first

sample/prod/assets/js/main.js

@@ -0,0 +1,319 @@
+/**
+* Template Name: NiceAdmin
+* Template URL: https://bootstrapmade.com/nice-admin-bootstrap-admin-html-template/
+* Updated: Apr 20 2024 with Bootstrap v5.3.3
+* Author: BootstrapMade.com
+* License: https://bootstrapmade.com/license/
+*/
+
+(function() {
+  "use strict";
+
+  /**
+   * Easy selector helper function
+   */
+  const select = (el, all = false) => {
+    el = el.trim()
+    if (all) {
+      return [...document.querySelectorAll(el)]
+    } else {
+      return document.querySelector(el)
+    }
+  }
+
+  /**
+   * Easy event listener function
+   */
+  const on = (type, el, listener, all = false) => {
+    if (all) {
+      select(el, all).forEach(e => e.addEventListener(type, listener))
+    } else {
+      select(el, all).addEventListener(type, listener)
+    }
+  }
+
+  /**
+   * Easy on scroll event listener 
+   */
+  const onscroll = (el, listener) => {
+    el.addEventListener('scroll', listener)
+  }
+
+  /**
+   * Sidebar toggle
+   */
+  if (select('.toggle-sidebar-btn')) {
+    on('click', '.toggle-sidebar-btn', function(e) {
+      select('body').classList.toggle('toggle-sidebar')
+    })
+  }
+
+  /**
+   * Search bar toggle
+   */
+  if (select('.search-bar-toggle')) {
+    on('click', '.search-bar-toggle', function(e) {
+      select('.search-bar').classList.toggle('search-bar-show')
+    })
+  }
+
+  /**
+   * Navbar links active state on scroll
+   */
+  let navbarlinks = select('#navbar .scrollto', true)
+  const navbarlinksActive = () => {
+    let position = window.scrollY + 200
+    navbarlinks.forEach(navbarlink => {
+      if (!navbarlink.hash) return
+      let section = select(navbarlink.hash)
+      if (!section) return
+      if (position >= section.offsetTop && position <= (section.offsetTop + section.offsetHeight)) {
+        navbarlink.classList.add('active')
+      } else {
+        navbarlink.classList.remove('active')
+      }
+    })
+  }
+  window.addEventListener('load', navbarlinksActive)
+  onscroll(document, navbarlinksActive)
+
+  /**
+   * Toggle .header-scrolled class to #header when page is scrolled
+   */
+  let selectHeader = select('#header')
+  if (selectHeader) {
+    const headerScrolled = () => {
+      if (window.scrollY > 100) {
+        selectHeader.classList.add('header-scrolled')
+      } else {
+        selectHeader.classList.remove('header-scrolled')
+      }
+    }
+    window.addEventListener('load', headerScrolled)
+    onscroll(document, headerScrolled)
+  }
+
+  /**
+   * Back to top button
+   */
+  let backtotop = select('.back-to-top')
+  if (backtotop) {
+    const toggleBacktotop = () => {
+      if (window.scrollY > 100) {
+        backtotop.classList.add('active')
+      } else {
+        backtotop.classList.remove('active')
+      }
+    }
+    window.addEventListener('load', toggleBacktotop)
+    onscroll(document, toggleBacktotop)
+  }
+
+  /**
+   * Initiate tooltips
+   */
+  var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
+  var tooltipList = tooltipTriggerList.map(function(tooltipTriggerEl) {
+    return new bootstrap.Tooltip(tooltipTriggerEl)
+  })
+
+  /**
+   * Initiate quill editors
+   */
+  if (select('.quill-editor-default')) {
+    new Quill('.quill-editor-default', {
+      theme: 'snow'
+    });
+  }
+
+  if (select('.quill-editor-bubble')) {
+    new Quill('.quill-editor-bubble', {
+      theme: 'bubble'
+    });
+  }
+
+  if (select('.quill-editor-full')) {
+    new Quill(".quill-editor-full", {
+      modules: {
+        toolbar: [
+          [{
+            font: []
+          }, {
+            size: []
+          }],
+          ["bold", "italic", "underline", "strike"],
+          [{
+              color: []
+            },
+            {
+              background: []
+            }
+          ],
+          [{
+              script: "super"
+            },
+            {
+              script: "sub"
+            }
+          ],
+          [{
+              list: "ordered"
+            },
+            {
+              list: "bullet"
+            },
+            {
+              indent: "-1"
+            },
+            {
+              indent: "+1"
+            }
+          ],
+          ["direction", {
+            align: []
+          }],
+          ["link", "image", "video"],
+          ["clean"]
+        ]
+      },
+      theme: "snow"
+    });
+  }
+
+  /**
+   * Initiate TinyMCE Editor
+   */
+
+  const useDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
+  const isSmallScreen = window.matchMedia('(max-width: 1023.5px)').matches;
+
+  tinymce.init({
+    selector: 'textarea.tinymce-editor',
+    plugins: 'preview importcss searchreplace autolink autosave save directionality code visualblocks visualchars fullscreen image link media codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount help charmap quickbars emoticons accordion',
+    editimage_cors_hosts: ['picsum.photos'],
+    menubar: 'file edit view insert format tools table help',
+    toolbar: "undo redo | accordion accordionremove | blocks fontfamily fontsize | bold italic underline strikethrough | align numlist bullist | link image | table media | lineheight outdent indent| forecolor backcolor removeformat | charmap emoticons | code fullscreen preview | save print | pagebreak anchor codesample | ltr rtl",
+    autosave_ask_before_unload: true,
+    autosave_interval: '30s',
+    autosave_prefix: '{path}{query}-{id}-',
+    autosave_restore_when_empty: false,
+    autosave_retention: '2m',
+    image_advtab: true,
+    link_list: [{
+        title: 'My page 1',
+        value: 'https://www.tiny.cloud'
+      },
+      {
+        title: 'My page 2',
+        value: 'http://www.moxiecode.com'
+      }
+    ],
+    image_list: [{
+        title: 'My page 1',
+        value: 'https://www.tiny.cloud'
+      },
+      {
+        title: 'My page 2',
+        value: 'http://www.moxiecode.com'
+      }
+    ],
+    image_class_list: [{
+        title: 'None',
+        value: ''
+      },
+      {
+        title: 'Some class',
+        value: 'class-name'
+      }
+    ],
+    importcss_append: true,
+    file_picker_callback: (callback, value, meta) => {
+      /* Provide file and text for the link dialog */
+      if (meta.filetype === 'file') {
+        callback('https://www.google.com/logos/google.jpg', {
+          text: 'My text'
+        });
+      }
+
+      /* Provide image and alt text for the image dialog */
+      if (meta.filetype === 'image') {
+        callback('https://www.google.com/logos/google.jpg', {
+          alt: 'My alt text'
+        });
+      }
+
+      /* Provide alternative source and posted for the media dialog */
+      if (meta.filetype === 'media') {
+        callback('movie.mp4', {
+          source2: 'alt.ogg',
+          poster: 'https://www.google.com/logos/google.jpg'
+        });
+      }
+    },
+    height: 600,
+    image_caption: true,
+    quickbars_selection_toolbar: 'bold italic | quicklink h2 h3 blockquote quickimage quicktable',
+    noneditable_class: 'mceNonEditable',
+    toolbar_mode: 'sliding',
+    contextmenu: 'link image table',
+    skin: useDarkMode ? 'oxide-dark' : 'oxide',
+    content_css: useDarkMode ? 'dark' : 'default',
+    content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }'
+  });
+
+  /**
+   * Initiate Bootstrap validation check
+   */
+  var needsValidation = document.querySelectorAll('.needs-validation')
+
+  Array.prototype.slice.call(needsValidation)
+    .forEach(function(form) {
+      form.addEventListener('submit', function(event) {
+        if (!form.checkValidity()) {
+          event.preventDefault()
+          event.stopPropagation()
+        }
+
+        form.classList.add('was-validated')
+      }, false)
+    })
+
+  /**
+   * Initiate Datatables
+   */
+  const datatables = select('.datatable', true)
+  datatables.forEach(datatable => {
+    new simpleDatatables.DataTable(datatable, {
+      perPageSelect: [5, 10, 15, ["All", -1]],
+      columns: [{
+          select: 2,
+          sortSequence: ["desc", "asc"]
+        },
+        {
+          select: 3,
+          sortSequence: ["desc"]
+        },
+        {
+          select: 4,
+          cellClass: "green",
+          headerClass: "red"
+        }
+      ]
+    });
+  })
+
+  /**
+   * Autoresize echart charts
+   */
+  const mainContainer = select('#main');
+  if (mainContainer) {
+    setTimeout(() => {
+      new ResizeObserver(function() {
+        select('.echart', true).forEach(getEchart => {
+          echarts.getInstanceByDom(getEchart).resize();
+        })
+      }).observe(mainContainer);
+    }, 200);
+  }
+
+})();

sample/prod/assets/vendor/bootstrap/css/bootstrap-reboot.css

@@ -0,0 +1,597 @@
+/*!
+ * Bootstrap Reboot v5.3.3 (https://getbootstrap.com/)
+ * Copyright 2011-2024 The Bootstrap Authors
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ */
+:root,
+[data-bs-theme=light] {
+  --bs-blue: #0d6efd;
+  --bs-indigo: #6610f2;
+  --bs-purple: #6f42c1;
+  --bs-pink: #d63384;
+  --bs-red: #dc3545;
+  --bs-orange: #fd7e14;
+  --bs-yellow: #ffc107;
+  --bs-green: #198754;
+  --bs-teal: #20c997;
+  --bs-cyan: #0dcaf0;
+  --bs-black: #000;
+  --bs-white: #fff;
+  --bs-gray: #6c757d;
+  --bs-gray-dark: #343a40;
+  --bs-gray-100: #f8f9fa;
+  --bs-gray-200: #e9ecef;
+  --bs-gray-300: #dee2e6;
+  --bs-gray-400: #ced4da;
+  --bs-gray-500: #adb5bd;
+  --bs-gray-600: #6c757d;
+  --bs-gray-700: #495057;
+  --bs-gray-800: #343a40;
+  --bs-gray-900: #212529;
+  --bs-primary: #0d6efd;
+  --bs-secondary: #6c757d;
+  --bs-success: #198754;
+  --bs-info: #0dcaf0;
+  --bs-warning: #ffc107;
+  --bs-danger: #dc3545;
+  --bs-light: #f8f9fa;
+  --bs-dark: #212529;
+  --bs-primary-rgb: 13, 110, 253;
+  --bs-secondary-rgb: 108, 117, 125;
+  --bs-success-rgb: 25, 135, 84;
+  --bs-info-rgb: 13, 202, 240;
+  --bs-warning-rgb: 255, 193, 7;
+  --bs-danger-rgb: 220, 53, 69;
+  --bs-light-rgb: 248, 249, 250;
+  --bs-dark-rgb: 33, 37, 41;
+  --bs-primary-text-emphasis: #052c65;
+  --bs-secondary-text-emphasis: #2b2f32;
+  --bs-success-text-emphasis: #0a3622;
+  --bs-info-text-emphasis: #055160;
+  --bs-warning-text-emphasis: #664d03;
+  --bs-danger-text-emphasis: #58151c;
+  --bs-light-text-emphasis: #495057;
+  --bs-dark-text-emphasis: #495057;
+  --bs-primary-bg-subtle: #cfe2ff;
+  --bs-secondary-bg-subtle: #e2e3e5;
+  --bs-success-bg-subtle: #d1e7dd;
+  --bs-info-bg-subtle: #cff4fc;
+  --bs-warning-bg-subtle: #fff3cd;
+  --bs-danger-bg-subtle: #f8d7da;
+  --bs-light-bg-subtle: #fcfcfd;
+  --bs-dark-bg-subtle: #ced4da;
+  --bs-primary-border-subtle: #9ec5fe;
+  --bs-secondary-border-subtle: #c4c8cb;
+  --bs-success-border-subtle: #a3cfbb;
+  --bs-info-border-subtle: #9eeaf9;
+  --bs-warning-border-subtle: #ffe69c;
+  --bs-danger-border-subtle: #f1aeb5;
+  --bs-light-border-subtle: #e9ecef;
+  --bs-dark-border-subtle: #adb5bd;
+  --bs-white-rgb: 255, 255, 255;
+  --bs-black-rgb: 0, 0, 0;
+  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
+  --bs-body-font-family: var(--bs-font-sans-serif);
+  --bs-body-font-size: 1rem;
+  --bs-body-font-weight: 400;
+  --bs-body-line-height: 1.5;
+  --bs-body-color: #212529;
+  --bs-body-color-rgb: 33, 37, 41;
+  --bs-body-bg: #fff;
+  --bs-body-bg-rgb: 255, 255, 255;
+  --bs-emphasis-color: #000;
+  --bs-emphasis-color-rgb: 0, 0, 0;
+  --bs-secondary-color: rgba(33, 37, 41, 0.75);
+  --bs-secondary-color-rgb: 33, 37, 41;
+  --bs-secondary-bg: #e9ecef;
+  --bs-secondary-bg-rgb: 233, 236, 239;
+  --bs-tertiary-color: rgba(33, 37, 41, 0.5);
+  --bs-tertiary-color-rgb: 33, 37, 41;
+  --bs-tertiary-bg: #f8f9fa;
+  --bs-tertiary-bg-rgb: 248, 249, 250;
+  --bs-heading-color: inherit;
+  --bs-link-color: #0d6efd;
+  --bs-link-color-rgb: 13, 110, 253;
+  --bs-link-decoration: underline;
+  --bs-link-hover-color: #0a58ca;
+  --bs-link-hover-color-rgb: 10, 88, 202;
+  --bs-code-color: #d63384;
+  --bs-highlight-color: #212529;
+  --bs-highlight-bg: #fff3cd;
+  --bs-border-width: 1px;
+  --bs-border-style: solid;
+  --bs-border-color: #dee2e6;
+  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
+  --bs-border-radius: 0.375rem;
+  --bs-border-radius-sm: 0.25rem;
+  --bs-border-radius-lg: 0.5rem;
+  --bs-border-radius-xl: 1rem;
+  --bs-border-radius-xxl: 2rem;
+  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
+  --bs-border-radius-pill: 50rem;
+  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
+  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
+  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
+  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
+  --bs-focus-ring-width: 0.25rem;
+  --bs-focus-ring-opacity: 0.25;
+  --bs-focus-ring-color: rgba(13, 110, 253, 0.25);
+  --bs-form-valid-color: #198754;
+  --bs-form-valid-border-color: #198754;
+  --bs-form-invalid-color: #dc3545;
+  --bs-form-invalid-border-color: #dc3545;
+}
+
+[data-bs-theme=dark] {
+  color-scheme: dark;
+  --bs-body-color: #dee2e6;
+  --bs-body-color-rgb: 222, 226, 230;
+  --bs-body-bg: #212529;
+  --bs-body-bg-rgb: 33, 37, 41;
+  --bs-emphasis-color: #fff;
+  --bs-emphasis-color-rgb: 255, 255, 255;
+  --bs-secondary-color: rgba(222, 226, 230, 0.75);
+  --bs-secondary-color-rgb: 222, 226, 230;
+  --bs-secondary-bg: #343a40;
+  --bs-secondary-bg-rgb: 52, 58, 64;
+  --bs-tertiary-color: rgba(222, 226, 230, 0.5);
+  --bs-tertiary-color-rgb: 222, 226, 230;
+  --bs-tertiary-bg: #2b3035;
+  --bs-tertiary-bg-rgb: 43, 48, 53;
+  --bs-primary-text-emphasis: #6ea8fe;
+  --bs-secondary-text-emphasis: #a7acb1;
+  --bs-success-text-emphasis: #75b798;
+  --bs-info-text-emphasis: #6edff6;
+  --bs-warning-text-emphasis: #ffda6a;
+  --bs-danger-text-emphasis: #ea868f;
+  --bs-light-text-emphasis: #f8f9fa;
+  --bs-dark-text-emphasis: #dee2e6;
+  --bs-primary-bg-subtle: #031633;
+  --bs-secondary-bg-subtle: #161719;
+  --bs-success-bg-subtle: #051b11;
+  --bs-info-bg-subtle: #032830;
+  --bs-warning-bg-subtle: #332701;
+  --bs-danger-bg-subtle: #2c0b0e;
+  --bs-light-bg-subtle: #343a40;
+  --bs-dark-bg-subtle: #1a1d20;
+  --bs-primary-border-subtle: #084298;
+  --bs-secondary-border-subtle: #41464b;
+  --bs-success-border-subtle: #0f5132;
+  --bs-info-border-subtle: #087990;
+  --bs-warning-border-subtle: #997404;
+  --bs-danger-border-subtle: #842029;
+  --bs-light-border-subtle: #495057;
+  --bs-dark-border-subtle: #343a40;
+  --bs-heading-color: inherit;
+  --bs-link-color: #6ea8fe;
+  --bs-link-hover-color: #8bb9fe;
+  --bs-link-color-rgb: 110, 168, 254;
+  --bs-link-hover-color-rgb: 139, 185, 254;
+  --bs-code-color: #e685b5;
+  --bs-highlight-color: #dee2e6;
+  --bs-highlight-bg: #664d03;
+  --bs-border-color: #495057;
+  --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
+  --bs-form-valid-color: #75b798;
+  --bs-form-valid-border-color: #75b798;
+  --bs-form-invalid-color: #ea868f;
+  --bs-form-invalid-border-color: #ea868f;
+}
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  :root {
+    scroll-behavior: smooth;
+  }
+}
+
+body {
+  margin: 0;
+  font-family: var(--bs-body-font-family);
+  font-size: var(--bs-body-font-size);
+  font-weight: var(--bs-body-font-weight);
+  line-height: var(--bs-body-line-height);
+  color: var(--bs-body-color);
+  text-align: var(--bs-body-text-align);
+  background-color: var(--bs-body-bg);
+  -webkit-text-size-adjust: 100%;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+hr {
+  margin: 1rem 0;
+  color: inherit;
+  border: 0;
+  border-top: var(--bs-border-width) solid;
+  opacity: 0.25;
+}
+
+h6, h5, h4, h3, h2, h1 {
+  margin-top: 0;
+  margin-bottom: 0.5rem;
+  font-weight: 500;
+  line-height: 1.2;
+  color: var(--bs-heading-color);
+}
+
+h1 {
+  font-size: calc(1.375rem + 1.5vw);
+}
+@media (min-width: 1200px) {
+  h1 {
+    font-size: 2.5rem;
+  }
+}
+
+h2 {
+  font-size: calc(1.325rem + 0.9vw);
+}
+@media (min-width: 1200px) {
+  h2 {
+    font-size: 2rem;
+  }
+}
+
+h3 {
+  font-size: calc(1.3rem + 0.6vw);
+}
+@media (min-width: 1200px) {
+  h3 {
+    font-size: 1.75rem;
+  }
+}
+
+h4 {
+  font-size: calc(1.275rem + 0.3vw);
+}
+@media (min-width: 1200px) {
+  h4 {
+    font-size: 1.5rem;
+  }
+}
+
+h5 {
+  font-size: 1.25rem;
+}
+
+h6 {
+  font-size: 1rem;
+}
+
+p {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+abbr[title] {
+  -webkit-text-decoration: underline dotted;
+  text-decoration: underline dotted;
+  cursor: help;
+  -webkit-text-decoration-skip-ink: none;
+  text-decoration-skip-ink: none;
+}
+
+address {
+  margin-bottom: 1rem;
+  font-style: normal;
+  line-height: inherit;
+}
+
+ol,
+ul {
+  padding-left: 2rem;
+}
+
+ol,
+ul,
+dl {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+ol ol,
+ul ul,
+ol ul,
+ul ol {
+  margin-bottom: 0;
+}
+
+dt {
+  font-weight: 700;
+}
+
+dd {
+  margin-bottom: 0.5rem;
+  margin-left: 0;
+}
+
+blockquote {
+  margin: 0 0 1rem;
+}
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+small {
+  font-size: 0.875em;
+}
+
+mark {
+  padding: 0.1875em;
+  color: var(--bs-highlight-color);
+  background-color: var(--bs-highlight-bg);
+}
+
+sub,
+sup {
+  position: relative;
+  font-size: 0.75em;
+  line-height: 0;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+a {
+  color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
+  text-decoration: underline;
+}
+a:hover {
+  --bs-link-color-rgb: var(--bs-link-hover-color-rgb);
+}
+
+a:not([href]):not([class]), a:not([href]):not([class]):hover {
+  color: inherit;
+  text-decoration: none;
+}
+
+pre,
+code,
+kbd,
+samp {
+  font-family: var(--bs-font-monospace);
+  font-size: 1em;
+}
+
+pre {
+  display: block;
+  margin-top: 0;
+  margin-bottom: 1rem;
+  overflow: auto;
+  font-size: 0.875em;
+}
+pre code {
+  font-size: inherit;
+  color: inherit;
+  word-break: normal;
+}
+
+code {
+  font-size: 0.875em;
+  color: var(--bs-code-color);
+  word-wrap: break-word;
+}
+a > code {
+  color: inherit;
+}
+
+kbd {
+  padding: 0.1875rem 0.375rem;
+  font-size: 0.875em;
+  color: var(--bs-body-bg);
+  background-color: var(--bs-body-color);
+  border-radius: 0.25rem;
+}
+kbd kbd {
+  padding: 0;
+  font-size: 1em;
+}
+
+figure {
+  margin: 0 0 1rem;
+}
+
+img,
+svg {
+  vertical-align: middle;
+}
+
+table {
+  caption-side: bottom;
+  border-collapse: collapse;
+}
+
+caption {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  color: var(--bs-secondary-color);
+  text-align: left;
+}
+
+th {
+  text-align: inherit;
+  text-align: -webkit-match-parent;
+}
+
+thead,
+tbody,
+tfoot,
+tr,
+td,
+th {
+  border-color: inherit;
+  border-style: solid;
+  border-width: 0;
+}
+
+label {
+  display: inline-block;
+}
+
+button {
+  border-radius: 0;
+}
+
+button:focus:not(:focus-visible) {
+  outline: 0;
+}
+
+input,
+button,
+select,
+optgroup,
+textarea {
+  margin: 0;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+button,
+select {
+  text-transform: none;
+}
+
+[role=button] {
+  cursor: pointer;
+}
+
+select {
+  word-wrap: normal;
+}
+select:disabled {
+  opacity: 1;
+}
+
+[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator {
+  display: none !important;
+}
+
+button,
+[type=button],
+[type=reset],
+[type=submit] {
+  -webkit-appearance: button;
+}
+button:not(:disabled),
+[type=button]:not(:disabled),
+[type=reset]:not(:disabled),
+[type=submit]:not(:disabled) {
+  cursor: pointer;
+}
+
+::-moz-focus-inner {
+  padding: 0;
+  border-style: none;
+}
+
+textarea {
+  resize: vertical;
+}
+
+fieldset {
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+}
+
+legend {
+  float: left;
+  width: 100%;
+  padding: 0;
+  margin-bottom: 0.5rem;
+  font-size: calc(1.275rem + 0.3vw);
+  line-height: inherit;
+}
+@media (min-width: 1200px) {
+  legend {
+    font-size: 1.5rem;
+  }
+}
+legend + * {
+  clear: left;
+}
+
+::-webkit-datetime-edit-fields-wrapper,
+::-webkit-datetime-edit-text,
+::-webkit-datetime-edit-minute,
+::-webkit-datetime-edit-hour-field,
+::-webkit-datetime-edit-day-field,
+::-webkit-datetime-edit-month-field,
+::-webkit-datetime-edit-year-field {
+  padding: 0;
+}
+
+::-webkit-inner-spin-button {
+  height: auto;
+}
+
+[type=search] {
+  -webkit-appearance: textfield;
+  outline-offset: -2px;
+}
+
+/* rtl:raw:
+[type="tel"],
+[type="url"],
+[type="email"],
+[type="number"] {
+  direction: ltr;
+}
+*/
+::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+::-webkit-color-swatch-wrapper {
+  padding: 0;
+}
+
+::-webkit-file-upload-button {
+  font: inherit;
+  -webkit-appearance: button;
+}
+
+::file-selector-button {
+  font: inherit;
+  -webkit-appearance: button;
+}
+
+output {
+  display: inline-block;
+}
+
+iframe {
+  border: 0;
+}
+
+summary {
+  display: list-item;
+  cursor: pointer;
+}
+
+progress {
+  vertical-align: baseline;
+}
+
+[hidden] {
+  display: none !important;
+}
+
+/*# sourceMappingURL=bootstrap-reboot.css.map */

sample/prod/assets/vendor/bootstrap/css/bootstrap-reboot.rtl.css

@@ -0,0 +1,594 @@
+/*!
+ * Bootstrap Reboot v5.3.3 (https://getbootstrap.com/)
+ * Copyright 2011-2024 The Bootstrap Authors
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ */
+:root,
+[data-bs-theme=light] {
+  --bs-blue: #0d6efd;
+  --bs-indigo: #6610f2;
+  --bs-purple: #6f42c1;
+  --bs-pink: #d63384;
+  --bs-red: #dc3545;
+  --bs-orange: #fd7e14;
+  --bs-yellow: #ffc107;
+  --bs-green: #198754;
+  --bs-teal: #20c997;
+  --bs-cyan: #0dcaf0;
+  --bs-black: #000;
+  --bs-white: #fff;
+  --bs-gray: #6c757d;
+  --bs-gray-dark: #343a40;
+  --bs-gray-100: #f8f9fa;
+  --bs-gray-200: #e9ecef;
+  --bs-gray-300: #dee2e6;
+  --bs-gray-400: #ced4da;
+  --bs-gray-500: #adb5bd;
+  --bs-gray-600: #6c757d;
+  --bs-gray-700: #495057;
+  --bs-gray-800: #343a40;
+  --bs-gray-900: #212529;
+  --bs-primary: #0d6efd;
+  --bs-secondary: #6c757d;
+  --bs-success: #198754;
+  --bs-info: #0dcaf0;
+  --bs-warning: #ffc107;
+  --bs-danger: #dc3545;
+  --bs-light: #f8f9fa;
+  --bs-dark: #212529;
+  --bs-primary-rgb: 13, 110, 253;
+  --bs-secondary-rgb: 108, 117, 125;
+  --bs-success-rgb: 25, 135, 84;
+  --bs-info-rgb: 13, 202, 240;
+  --bs-warning-rgb: 255, 193, 7;
+  --bs-danger-rgb: 220, 53, 69;
+  --bs-light-rgb: 248, 249, 250;
+  --bs-dark-rgb: 33, 37, 41;
+  --bs-primary-text-emphasis: #052c65;
+  --bs-secondary-text-emphasis: #2b2f32;
+  --bs-success-text-emphasis: #0a3622;
+  --bs-info-text-emphasis: #055160;
+  --bs-warning-text-emphasis: #664d03;
+  --bs-danger-text-emphasis: #58151c;
+  --bs-light-text-emphasis: #495057;
+  --bs-dark-text-emphasis: #495057;
+  --bs-primary-bg-subtle: #cfe2ff;
+  --bs-secondary-bg-subtle: #e2e3e5;
+  --bs-success-bg-subtle: #d1e7dd;
+  --bs-info-bg-subtle: #cff4fc;
+  --bs-warning-bg-subtle: #fff3cd;
+  --bs-danger-bg-subtle: #f8d7da;
+  --bs-light-bg-subtle: #fcfcfd;
+  --bs-dark-bg-subtle: #ced4da;
+  --bs-primary-border-subtle: #9ec5fe;
+  --bs-secondary-border-subtle: #c4c8cb;
+  --bs-success-border-subtle: #a3cfbb;
+  --bs-info-border-subtle: #9eeaf9;
+  --bs-warning-border-subtle: #ffe69c;
+  --bs-danger-border-subtle: #f1aeb5;
+  --bs-light-border-subtle: #e9ecef;
+  --bs-dark-border-subtle: #adb5bd;
+  --bs-white-rgb: 255, 255, 255;
+  --bs-black-rgb: 0, 0, 0;
+  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
+  --bs-body-font-family: var(--bs-font-sans-serif);
+  --bs-body-font-size: 1rem;
+  --bs-body-font-weight: 400;
+  --bs-body-line-height: 1.5;
+  --bs-body-color: #212529;
+  --bs-body-color-rgb: 33, 37, 41;
+  --bs-body-bg: #fff;
+  --bs-body-bg-rgb: 255, 255, 255;
+  --bs-emphasis-color: #000;
+  --bs-emphasis-color-rgb: 0, 0, 0;
+  --bs-secondary-color: rgba(33, 37, 41, 0.75);
+  --bs-secondary-color-rgb: 33, 37, 41;
+  --bs-secondary-bg: #e9ecef;
+  --bs-secondary-bg-rgb: 233, 236, 239;
+  --bs-tertiary-color: rgba(33, 37, 41, 0.5);
+  --bs-tertiary-color-rgb: 33, 37, 41;
+  --bs-tertiary-bg: #f8f9fa;
+  --bs-tertiary-bg-rgb: 248, 249, 250;
+  --bs-heading-color: inherit;
+  --bs-link-color: #0d6efd;
+  --bs-link-color-rgb: 13, 110, 253;
+  --bs-link-decoration: underline;
+  --bs-link-hover-color: #0a58ca;
+  --bs-link-hover-color-rgb: 10, 88, 202;
+  --bs-code-color: #d63384;
+  --bs-highlight-color: #212529;
+  --bs-highlight-bg: #fff3cd;
+  --bs-border-width: 1px;
+  --bs-border-style: solid;
+  --bs-border-color: #dee2e6;
+  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
+  --bs-border-radius: 0.375rem;
+  --bs-border-radius-sm: 0.25rem;
+  --bs-border-radius-lg: 0.5rem;
+  --bs-border-radius-xl: 1rem;
+  --bs-border-radius-xxl: 2rem;
+  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
+  --bs-border-radius-pill: 50rem;
+  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
+  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
+  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
+  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
+  --bs-focus-ring-width: 0.25rem;
+  --bs-focus-ring-opacity: 0.25;
+  --bs-focus-ring-color: rgba(13, 110, 253, 0.25);
+  --bs-form-valid-color: #198754;
+  --bs-form-valid-border-color: #198754;
+  --bs-form-invalid-color: #dc3545;
+  --bs-form-invalid-border-color: #dc3545;
+}
+
+[data-bs-theme=dark] {
+  color-scheme: dark;
+  --bs-body-color: #dee2e6;
+  --bs-body-color-rgb: 222, 226, 230;
+  --bs-body-bg: #212529;
+  --bs-body-bg-rgb: 33, 37, 41;
+  --bs-emphasis-color: #fff;
+  --bs-emphasis-color-rgb: 255, 255, 255;
+  --bs-secondary-color: rgba(222, 226, 230, 0.75);
+  --bs-secondary-color-rgb: 222, 226, 230;
+  --bs-secondary-bg: #343a40;
+  --bs-secondary-bg-rgb: 52, 58, 64;
+  --bs-tertiary-color: rgba(222, 226, 230, 0.5);
+  --bs-tertiary-color-rgb: 222, 226, 230;
+  --bs-tertiary-bg: #2b3035;
+  --bs-tertiary-bg-rgb: 43, 48, 53;
+  --bs-primary-text-emphasis: #6ea8fe;
+  --bs-secondary-text-emphasis: #a7acb1;
+  --bs-success-text-emphasis: #75b798;
+  --bs-info-text-emphasis: #6edff6;
+  --bs-warning-text-emphasis: #ffda6a;
+  --bs-danger-text-emphasis: #ea868f;
+  --bs-light-text-emphasis: #f8f9fa;
+  --bs-dark-text-emphasis: #dee2e6;
+  --bs-primary-bg-subtle: #031633;
+  --bs-secondary-bg-subtle: #161719;
+  --bs-success-bg-subtle: #051b11;
+  --bs-info-bg-subtle: #032830;
+  --bs-warning-bg-subtle: #332701;
+  --bs-danger-bg-subtle: #2c0b0e;
+  --bs-light-bg-subtle: #343a40;
+  --bs-dark-bg-subtle: #1a1d20;
+  --bs-primary-border-subtle: #084298;
+  --bs-secondary-border-subtle: #41464b;
+  --bs-success-border-subtle: #0f5132;
+  --bs-info-border-subtle: #087990;
+  --bs-warning-border-subtle: #997404;
+  --bs-danger-border-subtle: #842029;
+  --bs-light-border-subtle: #495057;
+  --bs-dark-border-subtle: #343a40;
+  --bs-heading-color: inherit;
+  --bs-link-color: #6ea8fe;
+  --bs-link-hover-color: #8bb9fe;
+  --bs-link-color-rgb: 110, 168, 254;
+  --bs-link-hover-color-rgb: 139, 185, 254;
+  --bs-code-color: #e685b5;
+  --bs-highlight-color: #dee2e6;
+  --bs-highlight-bg: #664d03;
+  --bs-border-color: #495057;
+  --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
+  --bs-form-valid-color: #75b798;
+  --bs-form-valid-border-color: #75b798;
+  --bs-form-invalid-color: #ea868f;
+  --bs-form-invalid-border-color: #ea868f;
+}
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  :root {
+    scroll-behavior: smooth;
+  }
+}
+
+body {
+  margin: 0;
+  font-family: var(--bs-body-font-family);
+  font-size: var(--bs-body-font-size);
+  font-weight: var(--bs-body-font-weight);
+  line-height: var(--bs-body-line-height);
+  color: var(--bs-body-color);
+  text-align: var(--bs-body-text-align);
+  background-color: var(--bs-body-bg);
+  -webkit-text-size-adjust: 100%;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+hr {
+  margin: 1rem 0;
+  color: inherit;
+  border: 0;
+  border-top: var(--bs-border-width) solid;
+  opacity: 0.25;
+}
+
+h6, h5, h4, h3, h2, h1 {
+  margin-top: 0;
+  margin-bottom: 0.5rem;
+  font-weight: 500;
+  line-height: 1.2;
+  color: var(--bs-heading-color);
+}
+
+h1 {
+  font-size: calc(1.375rem + 1.5vw);
+}
+@media (min-width: 1200px) {
+  h1 {
+    font-size: 2.5rem;
+  }
+}
+
+h2 {
+  font-size: calc(1.325rem + 0.9vw);
+}
+@media (min-width: 1200px) {
+  h2 {
+    font-size: 2rem;
+  }
+}
+
+h3 {
+  font-size: calc(1.3rem + 0.6vw);
+}
+@media (min-width: 1200px) {
+  h3 {
+    font-size: 1.75rem;
+  }
+}
+
+h4 {
+  font-size: calc(1.275rem + 0.3vw);
+}
+@media (min-width: 1200px) {
+  h4 {
+    font-size: 1.5rem;
+  }
+}
+
+h5 {
+  font-size: 1.25rem;
+}
+
+h6 {
+  font-size: 1rem;
+}
+
+p {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+abbr[title] {
+  -webkit-text-decoration: underline dotted;
+  text-decoration: underline dotted;
+  cursor: help;
+  -webkit-text-decoration-skip-ink: none;
+  text-decoration-skip-ink: none;
+}
+
+address {
+  margin-bottom: 1rem;
+  font-style: normal;
+  line-height: inherit;
+}
+
+ol,
+ul {
+  padding-right: 2rem;
+}
+
+ol,
+ul,
+dl {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+ol ol,
+ul ul,
+ol ul,
+ul ol {
+  margin-bottom: 0;
+}
+
+dt {
+  font-weight: 700;
+}
+
+dd {
+  margin-bottom: 0.5rem;
+  margin-right: 0;
+}
+
+blockquote {
+  margin: 0 0 1rem;
+}
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+small {
+  font-size: 0.875em;
+}
+
+mark {
+  padding: 0.1875em;
+  color: var(--bs-highlight-color);
+  background-color: var(--bs-highlight-bg);
+}
+
+sub,
+sup {
+  position: relative;
+  font-size: 0.75em;
+  line-height: 0;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+a {
+  color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
+  text-decoration: underline;
+}
+a:hover {
+  --bs-link-color-rgb: var(--bs-link-hover-color-rgb);
+}
+
+a:not([href]):not([class]), a:not([href]):not([class]):hover {
+  color: inherit;
+  text-decoration: none;
+}
+
+pre,
+code,
+kbd,
+samp {
+  font-family: var(--bs-font-monospace);
+  font-size: 1em;
+}
+
+pre {
+  display: block;
+  margin-top: 0;
+  margin-bottom: 1rem;
+  overflow: auto;
+  font-size: 0.875em;
+}
+pre code {
+  font-size: inherit;
+  color: inherit;
+  word-break: normal;
+}
+
+code {
+  font-size: 0.875em;
+  color: var(--bs-code-color);
+  word-wrap: break-word;
+}
+a > code {
+  color: inherit;
+}
+
+kbd {
+  padding: 0.1875rem 0.375rem;
+  font-size: 0.875em;
+  color: var(--bs-body-bg);
+  background-color: var(--bs-body-color);
+  border-radius: 0.25rem;
+}
+kbd kbd {
+  padding: 0;
+  font-size: 1em;
+}
+
+figure {
+  margin: 0 0 1rem;
+}
+
+img,
+svg {
+  vertical-align: middle;
+}
+
+table {
+  caption-side: bottom;
+  border-collapse: collapse;
+}
+
+caption {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  color: var(--bs-secondary-color);
+  text-align: right;
+}
+
+th {
+  text-align: inherit;
+  text-align: -webkit-match-parent;
+}
+
+thead,
+tbody,
+tfoot,
+tr,
+td,
+th {
+  border-color: inherit;
+  border-style: solid;
+  border-width: 0;
+}
+
+label {
+  display: inline-block;
+}
+
+button {
+  border-radius: 0;
+}
+
+button:focus:not(:focus-visible) {
+  outline: 0;
+}
+
+input,
+button,
+select,
+optgroup,
+textarea {
+  margin: 0;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+button,
+select {
+  text-transform: none;
+}
+
+[role=button] {
+  cursor: pointer;
+}
+
+select {
+  word-wrap: normal;
+}
+select:disabled {
+  opacity: 1;
+}
+
+[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator {
+  display: none !important;
+}
+
+button,
+[type=button],
+[type=reset],
+[type=submit] {
+  -webkit-appearance: button;
+}
+button:not(:disabled),
+[type=button]:not(:disabled),
+[type=reset]:not(:disabled),
+[type=submit]:not(:disabled) {
+  cursor: pointer;
+}
+
+::-moz-focus-inner {
+  padding: 0;
+  border-style: none;
+}
+
+textarea {
+  resize: vertical;
+}
+
+fieldset {
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+}
+
+legend {
+  float: right;
+  width: 100%;
+  padding: 0;
+  margin-bottom: 0.5rem;
+  font-size: calc(1.275rem + 0.3vw);
+  line-height: inherit;
+}
+@media (min-width: 1200px) {
+  legend {
+    font-size: 1.5rem;
+  }
+}
+legend + * {
+  clear: right;
+}
+
+::-webkit-datetime-edit-fields-wrapper,
+::-webkit-datetime-edit-text,
+::-webkit-datetime-edit-minute,
+::-webkit-datetime-edit-hour-field,
+::-webkit-datetime-edit-day-field,
+::-webkit-datetime-edit-month-field,
+::-webkit-datetime-edit-year-field {
+  padding: 0;
+}
+
+::-webkit-inner-spin-button {
+  height: auto;
+}
+
+[type=search] {
+  -webkit-appearance: textfield;
+  outline-offset: -2px;
+}
+
+[type="tel"],
+[type="url"],
+[type="email"],
+[type="number"] {
+  direction: ltr;
+}
+::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+::-webkit-color-swatch-wrapper {
+  padding: 0;
+}
+
+::-webkit-file-upload-button {
+  font: inherit;
+  -webkit-appearance: button;
+}
+
+::file-selector-button {
+  font: inherit;
+  -webkit-appearance: button;
+}
+
+output {
+  display: inline-block;
+}
+
+iframe {
+  border: 0;
+}
+
+summary {
+  display: list-item;
+  cursor: pointer;
+}
+
+progress {
+  vertical-align: baseline;
+}
+
+[hidden] {
+  display: none !important;
+}
+/*# sourceMappingURL=bootstrap-reboot.rtl.css.map */

sample/prod/index.html

@@ -0,0 +1,225 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <meta content="width=device-width, initial-scale=1.0" name="viewport">
+
+  <title>Dashboard - NiceAdmin Bootstrap Template</title>
+  <meta content="" name="description">
+  <meta content="" name="keywords">
+
+  <!-- Favicons -->
+  <link href="assets/img/favicon.png" rel="icon">
+  <link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
+
+
+  <!-- Vendor CSS Files -->
+  <link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
+  <link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
+
+  <!-- Template Main CSS File -->
+  <link href="assets/css/style.css" rel="stylesheet">
+
+  <link rel="stylesheet" href="http://talk.kospo.co.kr:3000/static/css/talk.css">
+
+  <!-- =======================================================
+  * Template Name: NiceAdmin
+  * Template URL: https://bootstrapmade.com/nice-admin-bootstrap-admin-html-template/
+  * Updated: Apr 20 2024 with Bootstrap v5.3.3
+  * Author: BootstrapMade.com
+  * License: https://bootstrapmade.com/license/
+  ======================================================== -->
+  <script>
+    const works = [
+      {
+        "work_id": "0020",
+        "work_nm": "EP포탈"
+      },
+      {
+        "work_id": "0040",
+        "work_nm": "코스모스"
+      },
+      {
+        "work_id": "0010",
+        "work_nm": "정보보안포탈"
+      },
+      {
+        "work_id": "0060",
+        "work_nm": "외부계정신청"
+      },
+      {
+        "work_id": "0000",
+        "work_nm": "디지털기술도서관"
+      },
+      {
+        "work_id": "0030",
+        "work_nm": "인사노무"
+      },
+      {
+        "work_id": "0050",
+        "work_nm": "연구개발"
+      }
+    ]
+  </script>
+</head>
+
+<body>
+
+
+
+  <main id="main" class="main">
+
+    <div class="pagetitle">
+      <h1>Dashboard</h1>
+      <nav>
+        <ol class="breadcrumb">
+          <li class="breadcrumb-item"><a href="index.html">Home</a></li>
+          <li class="breadcrumb-item active">Dashboard</li>
+        </ol>
+      </nav>
+    </div><!-- End Page Title -->
+
+    <section class="section dashboard">
+      <div class="row">
+
+        <!-- Left side columns -->
+        <div class="col-lg-12">
+          <div class="row">
+            <div class="col-xxl-3 col-md-3">
+              <div class="card info-card" id="start-wrap">
+                <input type="text" id="talkId" class="form-control" placeholder="톡방 아이디"/>
+                <button type="button" id="talk-start-btn" class="btn btn-primary">시작하기</button>
+              </div>
+            </div>
+            <div class="col-xxl-3 col-md-3">
+              <div class="card info-card" id="change-wrap">
+                <input type="text" id="talkId" class="form-control" placeholder="톡방 아이디"/>
+                <select id="work" class="form-control"></select>
+                <button type="button" id="talk-change-btn" class="btn btn-success" >업무변경</button>
+              </div>
+            </div>
+            <div class="col-xxl-3 col-md-3">
+              <div class="card info-card" id="sm-change-wrap">
+                <input type="text" id="talkId" class="form-control" placeholder="톡방 아이디"/>
+                <input type="text" id="chgSabun" class="form-control" placeholder="변경될 담당자 사번"/>
+                <button type="button" id="talk-sm-change-btn" class="btn btn-success" >담당자변경</button>
+              </div>
+            </div>
+            <div class="col-xxl-3 col-md-3">
+              <div class="card info-card" id="close-wrap">
+                <input type="text" id="talkId" class="form-control" placeholder="톡방 아이디"/>
+                <button type="button" id="talk-close-btn" class="btn btn-warning">종료하기</button>
+              </div>
+            </div>
+          </div>
+        </div>
+
+
+      </div>
+    </section>
+
+  </main><!-- End #main -->
+
+  <script type="module">
+    import {Talk} from 'http://talk.kospo.co.kr:3000/static/js/talk.js';
+
+
+    const talk = new Talk({
+      workId: 'HB0241',
+      position: 'br', // 헬프톡 위치(tl | tr | bl | br)
+      button: {
+        offsetX :30,
+        offsetY: 30,
+        color: '#007DC3', // optional
+        hoverColor: '#0068A3', // optional
+      },
+      container : {
+        offsetX: 100,
+        offsetY: 30,
+        color: '#007DC3', // optional
+        hoverColor: '#0068A3', // optional
+        activeColor: '#fff', // optional
+      },
+      serviceWorkerLocation: `./service-worker.js?v=1.05`, // 서비스워커 교체시 v=1.06 버전 변경
+      encSabun: 'h0VFCEwCVSn9SBCunLhGPWMgqQjf7h8CQ+ca7q43GRTmdr8QT1LK1uWOGZnDE6JzG/GULHGarfrOUve6qUOQAoOqOlYg2quU4Zy9bM1TG5jMH4aMp+yo5cRBXM5eJr+7oI78XE7m3pmebFZf6YEi77Xm5BtxSW436jrrOzfeEbHDDYVxOMd9Km5fOcNuLtDLDGKdhllA4w0Zv/xBfgQLJ1oC1+zo3PxGWOI5ypXDnDqUOmAldnHZEx4wM+gf7ZqHX4qiJ4tV+0baXrUuy43iA5XbnJ17s/gAk1oafG2MBL5N0n2aOJ6+367CKE2yditqEUPronrNWqwAHZiG5K8dHg=='
+    })
+    talk.run().then(() => {
+      console.log(1)
+    })
+
+
+    const startBtn = document.querySelector('#talk-start-btn');
+    const changeBtn = document.querySelector('#talk-change-btn');
+    const smChangeBtn = document.querySelector('#talk-sm-change-btn');
+    const workList = document.querySelectorAll('#work');
+    const closeBtn = document.querySelector('#talk-close-btn');
+
+    let html = '';
+    works.forEach((work) => {
+      html += `<option value="${work.work_id}">${work.work_nm}</option>`
+    })
+    workList.forEach((work) => {
+      work.insertAdjacentHTML("afterbegin", html)
+    })
+
+    startBtn.addEventListener('click', function(e) {
+      const global = talk.getGlobal()
+      const startWrap = document.querySelector('#start-wrap')
+      const talkId = startWrap.querySelector('#talkId').value
+      const msgObj = {
+        "type": "START",
+        "talkId": talkId,
+      }
+      global.stomp.send(`/pub/talk.start.${msgObj.talkId}`, {}, JSON.stringify(msgObj))
+    })
+
+    changeBtn.addEventListener('click', function(e) {
+      const global = talk.getGlobal()
+      const changeWrap = document.querySelector('#change-wrap')
+      const talkId = changeWrap.querySelector('#talkId').value
+      const workId = changeWrap.querySelector('#work').value
+      const newTalkId = talkEvent.generateUUID();
+      const msgObj = {
+        "type": "CHANGE",
+        "talkId": talkId,
+        "changeTalk" : {
+          talkId: newTalkId,
+          workId: workId
+        }
+      }
+      global.stomp.send(`/pub/talk.change.${talkId}`, {}, JSON.stringify(msgObj))
+    })
+
+    smChangeBtn.addEventListener('click', function(e) {
+      const global = talk.getGlobal()
+      const changeWrap = document.querySelector('#sm-change-wrap')
+      const chgSabun = changeWrap.querySelector('#chgSabun').value
+      const talkId = changeWrap.querySelector('#talkId').value
+      const newTalkId = talkEvent.generateUUID();
+      const msgObj = {
+        "type": "CHANGE",
+        "talkId": talkId,
+        "changeTalk" : {
+          talkId: newTalkId,
+          sabun: chgSabun, /*변경자 사번*/
+        }
+      }
+      global.stomp.send(`/pub/talk.sm.change.${talkId}`, {}, JSON.stringify(msgObj))
+    })
+
+    closeBtn.addEventListener('click', function(e) {
+      const global = talk.getGlobal()
+      const closeWrap = document.querySelector('#close-wrap')
+      const talkId = closeWrap.querySelector('#talkId').value
+      console.log(global)
+      const msgObj = {
+        "type": "CLOSE",
+        "talkId": talkId,
+      }
+      global.stomp.send(`/pub/talk.close.${msgObj.talkId}`, {}, JSON.stringify(msgObj))
+    })
+  </script>
+</body>
+
+</html>

sample/prod/service-worker.js

@@ -0,0 +1,290 @@
+const CACHE_NAME = 'v1';
+importScripts('http://talk.kospo.co.kr:3000/static/js/module/stomp.js');
+
+let sockJS = null;
+let stompClient = null;
+let reConnectAttempts = 0
+let maxReconnectAttempts = 3
+// 마스터 탭 변수
+let connTab = null
+
+let messageList = [];
+let forceConnect = false;
+// 서비스워커 체커 마지막 시간 변수
+let lastHeartbeat = null;
+
+/*재귀 함수 변수*/
+let checker;
+let connectLock = false;
+
+let subscribe = null;
+
+// indexeddb 데이터 조회
+function getData(col, val) {
+    return new Promise((resolve, reject) => {
+        if (connTab[col] === val) {
+            resolve(connTab);
+        }
+    })
+}
+
+// indexeddb 데이터 추가
+function addData(obj) {
+    connTab = obj;
+}
+
+function delData(tabId) {
+    return new Promise((resolve, reject) => {
+        messageList.forEach((message, idx) => {
+            if (message.tabId === tabId) {
+                messageList.splice(idx, 1);
+            }
+        })
+        if (connTab) {
+            if (connTab.tabId === tabId) {
+                connTab = null
+            }
+        }
+
+        resolve();
+    })
+}
+
+async function getClientCount(url) {
+    const allClients = await clients.matchAll({
+        includeUncontrolled: true,
+        type: 'window',
+    });
+
+
+    const cc = allClients.filter(client => client.url === url);
+    console.log(cc, '해당 클라이언트가 하나만 나와야함')
+    return cc.length;
+}
+
+// 클라이언트 에게 메시지 전달
+async function hubToClients(message) {
+    const allClients = await clients.matchAll({
+        includeUncontrolled: true,
+        type: 'window',
+    });
+
+    allClients.forEach(client => {
+        client.postMessage(message);
+    });
+}
+
+// 브라우저 종료시 소켓 연결 해지
+async function disConnectWebSocket(message) {
+    delData(message.tabId).then(() => {
+        console.log('disConnect', connTab, message.tabId)
+        if (connTab === null) {
+            try {
+                allClose();
+                if (messageList.length !== 0) connectWebSocket(messageList[0])
+            } catch (e) {
+            }
+        }
+    })
+
+    // 모든 클라이언트가 종료시 서비스워커 heartbeat 제거
+    const allClients = await clients.matchAll({
+        includeUncontrolled: true,
+        type: 'window',
+    });
+
+    if(allClients.length === 1) {
+        clearInterval(checker)
+        checker = null;
+    }
+}
+
+// 브라우저 종료시 소켓 연결 해지
+async function kill() {
+    console.log('service worker kill');
+    connTab = null;
+    messageList = [];
+    clearInterval(checker)
+    checker = null;
+    allClose();
+}
+
+// 탭간 공유 웹소켓 연결 관리
+async function connectWebSocket(message) {
+    getClientCount(message.site).then((windowClientCount) => {
+        if(windowClientCount === 1) {
+            connTab = null
+            messageList = []
+        }
+
+            lastHeartbeat = Date.now();
+
+            if (connTab === null || sockJS.readyState !== 1) {
+
+                if(sockJS !== null) {
+                    if(sockJS.readyState === WebSocket.OPEN) {
+                        allClose();
+                    }
+                }
+
+                sockJS = new WebSocket(`ws://talk.kospo.co.kr:3000/stomp/ws`);
+                // sockJS = new SockJS(
+                //     `http://talk.kospo.co.kr:3000/stomp/talk`, {
+                //         Authentication: message.encSabun
+                //     }, {
+                //         transports: ['websocket'],
+                //         reconnectInterval: 500,
+                //         reconnectDelay: 500,
+                //     },
+                // );
+
+                if(sockJS !== WebSocket.CLOSED && sockJS !== WebSocket.CLOSING) {
+                    stompClient = Stomp.over(sockJS);
+                    stompClient.heartbeat.outgoing = 20000;
+                    stompClient.heartbeat.incoming = 20000;
+                    stompClient.debug = (e) => {
+                        if (e.includes('ERROR') || e.includes('Exception') || e.includes('failed')) {
+                            console.log(new Date().toString())
+                            console.error('STOMP error:', e);
+
+                        }
+                    };
+
+                    stompClient.connect({Authentication: message.encSabun, location: 'SW'}, function (frame) {
+                        console.log('hub connect', message.tabId)
+                        subscribe = stompClient.subscribe(`/exchange/hub.exchange/hub.${message.tabId}`, async function (content) {
+                            const payload = JSON.parse(content.body);
+                            hubToClients(payload)
+
+                        })
+
+                        /*사이트 정보 탭 아이디 저장*/
+                        addData({
+                            url: message.site,
+                            tabId: message.tabId
+                        })
+
+                        /* 여러개 탭이 활성화시 방지용 서비스워커 체커*/
+                        if(checker == null) {
+                            /*테스트*/
+                            checker = setInterval(() => {
+                                // lastHeartbeat = Date.now();
+                                // console.log('서비스워커 실행중', new Date())
+                                hubToClients({type:"PING"})
+                            }, 10000)
+                        } else {
+                            console.log('checker and reset is exist')
+                        }
+
+
+                        // 재연결 시도 초기화
+                        reConnectAttempts = 0;
+                    })
+                }
+
+                const baseDelay = 500
+                sockJS.onclose = (e) => {
+                    if(e.code !== 1000) {
+                        const delay = Math.min(baseDelay * Math.pow(2, reConnectAttempts), 5000)
+                        setTimeout(() => {
+                            hubReconnect()
+                            if(reConnectAttempts < maxReconnectAttempts) {
+                                reConnectAttempts++;
+                            } else {
+                                console.log('[Service Worker Hub] Max Reconnect attempts reached.')
+                            }
+                        }, delay)
+                    }
+
+            }
+        } else {
+            console.log('hub socket is connected')
+        }
+    });
+}
+
+const hubReconnect = () => {
+    allClose()
+    clearInterval(checker)
+    checker = null;
+    hubToClients({type:'HUB_RECONNECT'});
+    lastHeartbeat = Date.now();
+}
+
+// 서비스워커 설치
+self.addEventListener('install', (event) => {
+    console.log('SW: Installing...');
+    event.waitUntil(
+        self.skipWaiting(),
+    );
+});
+
+// 서비스워커 활성화
+self.addEventListener('activate', function activator(event) {
+    // delData();
+    event.waitUntil(
+        self.clients.claim()
+    );
+})
+
+// 클라이언트로부터의 메시지 처리 (연결 및 해지)
+self.addEventListener('message', async (event) => {
+    const message = event.data;
+    switch (message.type) {
+        case 'CONNECT':
+            connectLock = false;
+            messageList.push(message);
+            connectWebSocket(message);
+            break;
+        case 'TAB_CLOSE':
+            disConnectWebSocket(message);
+            break;
+        case "KILL" :
+            kill();
+            break;
+        case 'PONG' :
+            if (stompClient === null) {
+                hubReconnect()
+            }
+            break;
+        case "WAKEUP" :
+            if (stompClient === null) {
+                if (!connectLock) {
+                    connectLock = true;
+                    hubReconnect()
+                }
+            } else {
+                if (!connectLock) {
+                    hubToClients({type: "GETUP"})
+                }
+
+            }
+            break;
+        case 'HUB_RECONNECT_SUCCESS' :
+            let suc = true;
+            while (suc) {
+                if (stompClient.connected) {
+                    connectLock = false;
+                    suc = false;
+                }
+                await sleep(100)
+            }
+            break;
+        case 'FONT_CHANGE':
+            hubToClients(message)
+            break;
+    }
+});
+
+const sleep = (delay) => {
+    return new Promise(resolve => setTimeout(resolve, delay));
+}
+
+const allClose = () => {
+    try{subscribe.unsubscribe()} catch(e) {}
+    try{stompClient.disconnect()} catch(e) {}
+    try{sockJS.close();} catch(e) {}
+    stompClient = null;
+    sockJS = null;
+    subscribe = null;
+}

sample/prod/talk/bundle/alertify-1.14.0/css/alertify.css

@@ -0,0 +1,968 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dimmer {
+  position: fixed;
+  z-index: 1981;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  padding: 0;
+  margin: 0;
+  background-color: #252525;
+  opacity: 0.5;
+}
+.alertify .ajs-modal {
+  position: fixed;
+  top: 0;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  padding: 0;
+  overflow-y: auto;
+  z-index: 1981;
+}
+.alertify .ajs-dialog {
+  position: relative;
+  margin: 5% auto;
+  min-height: 110px;
+  max-width: 500px;
+  padding: 24px 24px 0 24px;
+  outline: 0;
+  background-color: #fff;
+}
+.alertify .ajs-dialog.ajs-capture:before {
+  content: '';
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  display: block;
+  z-index: 1;
+}
+.alertify .ajs-reset {
+  position: absolute !important;
+  display: inline !important;
+  width: 0 !important;
+  height: 0 !important;
+  opacity: 0 !important;
+}
+.alertify .ajs-commands {
+  position: absolute;
+  right: 4px;
+  margin: -14px 24px 0 0;
+  z-index: 2;
+}
+.alertify .ajs-commands button {
+  display: none;
+  width: 10px;
+  height: 10px;
+  margin-left: 10px;
+  padding: 10px;
+  border: 0;
+  background-color: transparent;
+  background-repeat: no-repeat;
+  background-position: center;
+  cursor: pointer;
+}
+.alertify .ajs-commands button.ajs-close {
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNy8xMy8xNOrZqugAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAAh0lEQVQYlY2QsQ0EIQwEB9cBAR1CJUaI/gigDnwR6NBL/7/xWLNrZ2b8EwGotVpr7eOitWa1VjugiNB7R1UPrKrWe0dEAHBbXUqxMQbeewDmnHjvyTm7C3zDwAUd9c63YQdUVdu6EAJzzquz7HXvTiklt+H9DQFYaxFjvDqllFyMkbXWvfpXHjJrWFgdBq/hAAAAAElFTkSuQmCC);
+}
+.alertify .ajs-commands button.ajs-maximize {
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNy8xMy8xNOrZqugAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAAOUlEQVQYlWP8//8/AzGAhYGBgaG4uBiv6t7eXkYmooxjYGAgWiELsvHYFMCcRX2rSXcjoSBiJDbAAeD+EGu+8BZcAAAAAElFTkSuQmCC);
+}
+.alertify .ajs-header {
+  margin: -24px;
+  margin-bottom: 0;
+  padding: 16px 24px;
+  background-color: #fff;
+}
+.alertify .ajs-body {
+  min-height: 56px;
+}
+.alertify .ajs-body .ajs-content {
+  padding: 16px 24px 16px 16px;
+}
+.alertify .ajs-footer {
+  padding: 4px;
+  margin-left: -24px;
+  margin-right: -24px;
+  min-height: 43px;
+  background-color: #fff;
+}
+.alertify .ajs-footer .ajs-buttons.ajs-primary {
+  text-align: right;
+}
+.alertify .ajs-footer .ajs-buttons.ajs-primary .ajs-button {
+  margin: 4px;
+}
+.alertify .ajs-footer .ajs-buttons.ajs-auxiliary {
+  float: left;
+  clear: none;
+  text-align: left;
+}
+.alertify .ajs-footer .ajs-buttons.ajs-auxiliary .ajs-button {
+  margin: 4px;
+}
+.alertify .ajs-footer .ajs-buttons .ajs-button {
+  min-width: 88px;
+  min-height: 35px;
+}
+.alertify .ajs-handle {
+  position: absolute;
+  display: none;
+  width: 10px;
+  height: 10px;
+  right: 0;
+  bottom: 0;
+  z-index: 1;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNy8xMS8xNEDQYmMAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAAQ0lEQVQYlaXNMQoAIAxD0dT7H657l0KX3iJuUlBUNOsPPCGJm7VDp6ryeMxMuDsAQH7owW3pyn3RS26iKxERMLN3ugOaAkaL3sWVigAAAABJRU5ErkJggg==);
+  -webkit-transform: scaleX(1) /*rtl:scaleX(-1)*/;
+          transform: scaleX(1) /*rtl:scaleX(-1)*/;
+  cursor: se-resize;
+}
+.alertify.ajs-no-overflow .ajs-body .ajs-content {
+  overflow: hidden !important;
+}
+.alertify.ajs-no-padding.ajs-maximized .ajs-body .ajs-content {
+  left: 0;
+  right: 0;
+  padding: 0;
+}
+.alertify.ajs-no-padding:not(.ajs-maximized) .ajs-body {
+  margin-left: -24px;
+  margin-right: -24px;
+}
+.alertify.ajs-no-padding:not(.ajs-maximized) .ajs-body .ajs-content {
+  padding: 0;
+}
+.alertify.ajs-no-padding.ajs-resizable .ajs-body .ajs-content {
+  left: 0;
+  right: 0;
+}
+.alertify.ajs-maximizable .ajs-commands button.ajs-maximize,
+.alertify.ajs-maximizable .ajs-commands button.ajs-restore {
+  display: inline-block;
+}
+.alertify.ajs-closable .ajs-commands button.ajs-close {
+  display: inline-block;
+}
+.alertify.ajs-maximized .ajs-dialog {
+  width: 100% !important;
+  height: 100% !important;
+  max-width: none !important;
+  margin: 0 auto !important;
+  top: 0 !important;
+  left: 0 !important;
+}
+.alertify.ajs-maximized.ajs-modeless .ajs-modal {
+  position: fixed !important;
+  min-height: 100% !important;
+  max-height: none !important;
+  margin: 0 !important;
+}
+.alertify.ajs-maximized .ajs-commands button.ajs-maximize {
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNy8xMy8xNOrZqugAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAASklEQVQYlZWQ0QkAMQhDtXRincOZX78KVtrDCwgqJNEoIB3MPLj7lRUROlpyVXGzby6zWuY+kz6tj5sBMTMAyVV3/595RbOh3cAXsww1raeiOcoAAAAASUVORK5CYII=);
+}
+.alertify.ajs-resizable .ajs-dialog,
+.alertify.ajs-maximized .ajs-dialog {
+  padding: 0;
+}
+.alertify.ajs-resizable .ajs-commands,
+.alertify.ajs-maximized .ajs-commands {
+  margin: 14px 24px 0 0;
+}
+.alertify.ajs-resizable .ajs-header,
+.alertify.ajs-maximized .ajs-header {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  margin: 0;
+  padding: 16px 24px;
+}
+.alertify.ajs-resizable .ajs-body,
+.alertify.ajs-maximized .ajs-body {
+  min-height: 224px;
+  display: inline-block;
+}
+.alertify.ajs-resizable .ajs-body .ajs-content,
+.alertify.ajs-maximized .ajs-body .ajs-content {
+  position: absolute;
+  top: 50px;
+  right: 24px;
+  bottom: 50px;
+  left: 24px;
+  overflow: auto;
+}
+.alertify.ajs-resizable .ajs-footer,
+.alertify.ajs-maximized .ajs-footer {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  margin: 0;
+}
+.alertify.ajs-resizable:not(.ajs-maximized) .ajs-dialog {
+  min-width: 548px;
+}
+.alertify.ajs-resizable:not(.ajs-maximized) .ajs-handle {
+  display: block;
+}
+.alertify.ajs-movable:not(.ajs-maximized) .ajs-header {
+  cursor: move;
+}
+.alertify.ajs-modeless .ajs-dimmer,
+.alertify.ajs-modeless .ajs-reset {
+  display: none;
+}
+.alertify.ajs-modeless .ajs-modal {
+  overflow: visible;
+  max-width: none;
+  max-height: 0;
+}
+.alertify.ajs-modeless.ajs-pinnable .ajs-commands button.ajs-pin {
+  display: inline-block;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNy8xMy8xNOrZqugAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAAQklEQVQYlcWPMQ4AIAwCqU9u38GbcbHRWN1MvKQDhQFMEpKImGJA0gCgnYw0V0rwxseg5erT4oSkQVI5d9f+e9+xA0NbLpWfitPXAAAAAElFTkSuQmCC);
+}
+.alertify.ajs-modeless.ajs-unpinned .ajs-modal {
+  position: absolute;
+}
+.alertify.ajs-modeless.ajs-unpinned .ajs-commands button.ajs-pin {
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNy8xMy8xNOrZqugAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAAO0lEQVQYlWP8//8/AzGAiShV6AqLi4txGs+CLoBLMYbC3t5eRmyaWfBZhwwYkX2NTxPRvibKjRhW4wMAhxkYGbLu3pEAAAAASUVORK5CYII=);
+}
+.alertify.ajs-modeless:not(.ajs-unpinned) .ajs-body {
+  max-height: 500px;
+  overflow: auto;
+}
+.alertify.ajs-basic .ajs-header {
+  opacity: 0;
+}
+.alertify.ajs-basic .ajs-footer {
+  visibility: hidden;
+}
+.alertify.ajs-frameless .ajs-header {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  min-height: 60px;
+  margin: 0;
+  padding: 0;
+  opacity: 0;
+  z-index: 1;
+}
+.alertify.ajs-frameless .ajs-footer {
+  display: none;
+}
+.alertify.ajs-frameless .ajs-body .ajs-content {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}
+.alertify.ajs-frameless:not(.ajs-resizable) .ajs-dialog {
+  padding-top: 0;
+}
+.alertify.ajs-frameless:not(.ajs-resizable) .ajs-dialog .ajs-commands {
+  margin-top: 0;
+}
+.ajs-no-overflow {
+  overflow: hidden !important;
+  outline: none;
+}
+.ajs-no-overflow.ajs-fixed {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  overflow-y: scroll!important;
+}
+.ajs-no-selection,
+.ajs-no-selection * {
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+}
+@media screen and (max-width: 568px) {
+  .alertify .ajs-dialog {
+    min-width: 150px;
+  }
+  .alertify:not(.ajs-maximized) .ajs-modal {
+    padding: 0 5%;
+  }
+  .alertify:not(.ajs-maximized).ajs-resizable .ajs-dialog {
+    min-width: initial;
+    min-width: auto /*IE fallback*/;
+  }
+}
+@-moz-document url-prefix() {
+  .alertify button:focus {
+    outline: 1px dotted #3593D2;
+  }
+}
+.alertify .ajs-dimmer,
+.alertify .ajs-modal {
+  -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+  -webkit-transition-property: opacity, visibility;
+  transition-property: opacity, visibility;
+  -webkit-transition-timing-function: linear;
+          transition-timing-function: linear;
+  -webkit-transition-duration: 250ms;
+          transition-duration: 250ms;
+}
+.alertify.ajs-hidden .ajs-dimmer,
+.alertify.ajs-hidden .ajs-modal {
+  visibility: hidden;
+  opacity: 0;
+}
+.alertify.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-duration: 500ms;
+          animation-duration: 500ms;
+}
+.alertify.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-duration: 250ms;
+          animation-duration: 250ms;
+}
+.alertify .ajs-dialog.ajs-shake {
+  -webkit-animation-name: ajs-shake;
+          animation-name: ajs-shake;
+  -webkit-animation-duration: 0.1s;
+          animation-duration: 0.1s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+}
+@-webkit-keyframes ajs-shake {
+  0%,
+  100% {
+    -webkit-transform: translate3d(0, 0, 0);
+            transform: translate3d(0, 0, 0);
+  }
+  10%,
+  30%,
+  50%,
+  70%,
+  90% {
+    -webkit-transform: translate3d(-10px, 0, 0);
+            transform: translate3d(-10px, 0, 0);
+  }
+  20%,
+  40%,
+  60%,
+  80% {
+    -webkit-transform: translate3d(10px, 0, 0);
+            transform: translate3d(10px, 0, 0);
+  }
+}
+@keyframes ajs-shake {
+  0%,
+  100% {
+    -webkit-transform: translate3d(0, 0, 0);
+            transform: translate3d(0, 0, 0);
+  }
+  10%,
+  30%,
+  50%,
+  70%,
+  90% {
+    -webkit-transform: translate3d(-10px, 0, 0);
+            transform: translate3d(-10px, 0, 0);
+  }
+  20%,
+  40%,
+  60%,
+  80% {
+    -webkit-transform: translate3d(10px, 0, 0);
+            transform: translate3d(10px, 0, 0);
+  }
+}
+.alertify.ajs-slide.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-name: ajs-slideIn;
+          animation-name: ajs-slideIn;
+  -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+          animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+}
+.alertify.ajs-slide.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-name: ajs-slideOut;
+          animation-name: ajs-slideOut;
+  -webkit-animation-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
+          animation-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
+}
+.alertify.ajs-zoom.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-name: ajs-zoomIn;
+          animation-name: ajs-zoomIn;
+}
+.alertify.ajs-zoom.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-name: ajs-zoomOut;
+          animation-name: ajs-zoomOut;
+}
+.alertify.ajs-fade.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-name: ajs-fadeIn;
+          animation-name: ajs-fadeIn;
+}
+.alertify.ajs-fade.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-name: ajs-fadeOut;
+          animation-name: ajs-fadeOut;
+}
+.alertify.ajs-pulse.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-name: ajs-pulseIn;
+          animation-name: ajs-pulseIn;
+}
+.alertify.ajs-pulse.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-name: ajs-pulseOut;
+          animation-name: ajs-pulseOut;
+}
+.alertify.ajs-flipx.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-name: ajs-flipInX;
+          animation-name: ajs-flipInX;
+}
+.alertify.ajs-flipx.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-name: ajs-flipOutX;
+          animation-name: ajs-flipOutX;
+}
+.alertify.ajs-flipy.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-name: ajs-flipInY;
+          animation-name: ajs-flipInY;
+}
+.alertify.ajs-flipy.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-name: ajs-flipOutY;
+          animation-name: ajs-flipOutY;
+}
+@-webkit-keyframes ajs-pulseIn {
+  0%,
+  20%,
+  40%,
+  60%,
+  80%,
+  100% {
+    -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+            transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+  }
+  0% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+  }
+  20% {
+    -webkit-transform: scale3d(1.1, 1.1, 1.1);
+            transform: scale3d(1.1, 1.1, 1.1);
+  }
+  40% {
+    -webkit-transform: scale3d(0.9, 0.9, 0.9);
+            transform: scale3d(0.9, 0.9, 0.9);
+  }
+  60% {
+    opacity: 1;
+    -webkit-transform: scale3d(1.03, 1.03, 1.03);
+            transform: scale3d(1.03, 1.03, 1.03);
+  }
+  80% {
+    -webkit-transform: scale3d(0.97, 0.97, 0.97);
+            transform: scale3d(0.97, 0.97, 0.97);
+  }
+  100% {
+    opacity: 1;
+    -webkit-transform: scale3d(1, 1, 1);
+            transform: scale3d(1, 1, 1);
+  }
+}
+@keyframes ajs-pulseIn {
+  0%,
+  20%,
+  40%,
+  60%,
+  80%,
+  100% {
+    -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+            transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+  }
+  0% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+  }
+  20% {
+    -webkit-transform: scale3d(1.1, 1.1, 1.1);
+            transform: scale3d(1.1, 1.1, 1.1);
+  }
+  40% {
+    -webkit-transform: scale3d(0.9, 0.9, 0.9);
+            transform: scale3d(0.9, 0.9, 0.9);
+  }
+  60% {
+    opacity: 1;
+    -webkit-transform: scale3d(1.03, 1.03, 1.03);
+            transform: scale3d(1.03, 1.03, 1.03);
+  }
+  80% {
+    -webkit-transform: scale3d(0.97, 0.97, 0.97);
+            transform: scale3d(0.97, 0.97, 0.97);
+  }
+  100% {
+    opacity: 1;
+    -webkit-transform: scale3d(1, 1, 1);
+            transform: scale3d(1, 1, 1);
+  }
+}
+@-webkit-keyframes ajs-pulseOut {
+  20% {
+    -webkit-transform: scale3d(0.9, 0.9, 0.9);
+            transform: scale3d(0.9, 0.9, 0.9);
+  }
+  50%,
+  55% {
+    opacity: 1;
+    -webkit-transform: scale3d(1.1, 1.1, 1.1);
+            transform: scale3d(1.1, 1.1, 1.1);
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+  }
+}
+@keyframes ajs-pulseOut {
+  20% {
+    -webkit-transform: scale3d(0.9, 0.9, 0.9);
+            transform: scale3d(0.9, 0.9, 0.9);
+  }
+  50%,
+  55% {
+    opacity: 1;
+    -webkit-transform: scale3d(1.1, 1.1, 1.1);
+            transform: scale3d(1.1, 1.1, 1.1);
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+  }
+}
+@-webkit-keyframes ajs-zoomIn {
+  0% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.25, 0.25, 0.25);
+            transform: scale3d(0.25, 0.25, 0.25);
+  }
+  100% {
+    opacity: 1;
+    -webkit-transform: scale3d(1, 1, 1);
+            transform: scale3d(1, 1, 1);
+  }
+}
+@keyframes ajs-zoomIn {
+  0% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.25, 0.25, 0.25);
+            transform: scale3d(0.25, 0.25, 0.25);
+  }
+  100% {
+    opacity: 1;
+    -webkit-transform: scale3d(1, 1, 1);
+            transform: scale3d(1, 1, 1);
+  }
+}
+@-webkit-keyframes ajs-zoomOut {
+  0% {
+    opacity: 1;
+    -webkit-transform: scale3d(1, 1, 1);
+            transform: scale3d(1, 1, 1);
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.25, 0.25, 0.25);
+            transform: scale3d(0.25, 0.25, 0.25);
+  }
+}
+@keyframes ajs-zoomOut {
+  0% {
+    opacity: 1;
+    -webkit-transform: scale3d(1, 1, 1);
+            transform: scale3d(1, 1, 1);
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.25, 0.25, 0.25);
+            transform: scale3d(0.25, 0.25, 0.25);
+  }
+}
+@-webkit-keyframes ajs-fadeIn {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+@keyframes ajs-fadeIn {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+@-webkit-keyframes ajs-fadeOut {
+  0% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+@keyframes ajs-fadeOut {
+  0% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+@-webkit-keyframes ajs-flipInX {
+  0% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+    opacity: 0;
+  }
+  40% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+  }
+  60% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
+    opacity: 1;
+  }
+  80% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
+  }
+  100% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+}
+@keyframes ajs-flipInX {
+  0% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+    opacity: 0;
+  }
+  40% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+  }
+  60% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
+    opacity: 1;
+  }
+  80% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
+  }
+  100% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+}
+@-webkit-keyframes ajs-flipOutX {
+  0% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+  30% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+    opacity: 0;
+  }
+}
+@keyframes ajs-flipOutX {
+  0% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+  30% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+    opacity: 0;
+  }
+}
+@-webkit-keyframes ajs-flipInY {
+  0% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+    opacity: 0;
+  }
+  40% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
+            transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+  }
+  60% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
+            transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
+    opacity: 1;
+  }
+  80% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
+            transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
+  }
+  100% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+}
+@keyframes ajs-flipInY {
+  0% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+    opacity: 0;
+  }
+  40% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
+            transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+  }
+  60% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
+            transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
+    opacity: 1;
+  }
+  80% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
+            transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
+  }
+  100% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+}
+@-webkit-keyframes ajs-flipOutY {
+  0% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+  30% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+            transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+    opacity: 0;
+  }
+}
+@keyframes ajs-flipOutY {
+  0% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+  30% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+            transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+    opacity: 0;
+  }
+}
+@-webkit-keyframes ajs-slideIn {
+  0% {
+    margin-top: -100%;
+  }
+  100% {
+    margin-top: 5%;
+  }
+}
+@keyframes ajs-slideIn {
+  0% {
+    margin-top: -100%;
+  }
+  100% {
+    margin-top: 5%;
+  }
+}
+@-webkit-keyframes ajs-slideOut {
+  0% {
+    margin-top: 5%;
+  }
+  100% {
+    margin-top: -100%;
+  }
+}
+@keyframes ajs-slideOut {
+  0% {
+    margin-top: 5%;
+  }
+  100% {
+    margin-top: -100%;
+  }
+}
+.alertify-notifier {
+  position: fixed;
+  width: 0;
+  overflow: visible;
+  z-index: 1982;
+  -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+}
+.alertify-notifier .ajs-message {
+  position: relative;
+  width: 260px;
+  max-height: 0;
+  padding: 0;
+  opacity: 0;
+  margin: 0;
+  -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+  -webkit-transition-duration: 250ms;
+          transition-duration: 250ms;
+  -webkit-transition-timing-function: linear;
+          transition-timing-function: linear;
+}
+.alertify-notifier .ajs-message.ajs-visible {
+  -webkit-transition-duration: 500ms;
+          transition-duration: 500ms;
+  -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+          transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+  opacity: 1;
+  max-height: 100%;
+  padding: 15px;
+  margin-top: 10px;
+}
+.alertify-notifier .ajs-message.ajs-success {
+  background: rgba(91, 189, 114, 0.95);
+}
+.alertify-notifier .ajs-message.ajs-error {
+  background: rgba(217, 92, 92, 0.95);
+}
+.alertify-notifier .ajs-message.ajs-warning {
+  background: rgba(252, 248, 215, 0.95);
+}
+.alertify-notifier .ajs-message .ajs-close {
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 16px;
+  height: 16px;
+  cursor: pointer;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAABGdBTUEAALGPC/xhBQAAAFBJREFUGBl1j0EKADEIA+ve/P9f9bh1hEihNBfjVCO1v7RKVqJK4h8gM5cAPR42AkQEpSXPwMTyoi13n5N9YqJehm3Fnr7nL1D0ZEbD5OubGyC7a9gx+9eNAAAAAElFTkSuQmCC);
+  background-repeat: no-repeat;
+  background-position: center center;
+  background-color: rgba(0, 0, 0, 0.5);
+  border-top-right-radius: 2px;
+}
+.alertify-notifier.ajs-top {
+  top: 10px;
+}
+.alertify-notifier.ajs-bottom {
+  bottom: 10px;
+}
+.alertify-notifier.ajs-right {
+  right: 10px;
+}
+.alertify-notifier.ajs-right .ajs-message {
+  right: -320px;
+}
+.alertify-notifier.ajs-right .ajs-message.ajs-visible {
+  right: 290px;
+}
+.alertify-notifier.ajs-left {
+  left: 10px;
+}
+.alertify-notifier.ajs-left .ajs-message {
+  left: -300px;
+}
+.alertify-notifier.ajs-left .ajs-message.ajs-visible {
+  left: 0;
+}
+.alertify-notifier.ajs-center {
+  left: 50%;
+}
+.alertify-notifier.ajs-center .ajs-message {
+  -webkit-transform: translateX(-50%);
+          transform: translateX(-50%);
+}
+.alertify-notifier.ajs-center .ajs-message.ajs-visible {
+  left: 50%;
+  -webkit-transition-timing-function: cubic-bezier(0.57, 0.43, 0.1, 0.65);
+          transition-timing-function: cubic-bezier(0.57, 0.43, 0.1, 0.65);
+}
+.alertify-notifier.ajs-center.ajs-top .ajs-message {
+  top: -300px;
+}
+.alertify-notifier.ajs-center.ajs-top .ajs-message.ajs-visible {
+  top: 0;
+}
+.alertify-notifier.ajs-center.ajs-bottom .ajs-message {
+  bottom: -300px;
+}
+.alertify-notifier.ajs-center.ajs-bottom .ajs-message.ajs-visible {
+  bottom: 0;
+}
+.ajs-no-transition.alertify .ajs-dimmer,
+.ajs-no-transition.alertify .ajs-modal,
+.ajs-no-transition.alertify .ajs-dialog {
+  -webkit-transition: none!important;
+  transition: none!important;
+  -webkit-animation: none!important;
+          animation: none!important;
+}
+.ajs-no-transition.alertify-notifier .ajs-message {
+  -webkit-transition: none!important;
+  transition: none!important;
+  -webkit-animation: none!important;
+          animation: none!important;
+}
+@media (prefers-reduced-motion: reduce) {
+  .alertify .ajs-dimmer,
+  .alertify .ajs-modal,
+  .alertify .ajs-dialog {
+    -webkit-transition: none!important;
+    transition: none!important;
+    -webkit-animation: none!important;
+            animation: none!important;
+  }
+  .alertify-notifier .ajs-message {
+    -webkit-transition: none!important;
+    transition: none!important;
+    -webkit-animation: none!important;
+            animation: none!important;
+  }
+}

sample/prod/talk/bundle/alertify-1.14.0/css/alertify.rtl.css

@@ -0,0 +1,968 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dimmer {
+  position: fixed;
+  z-index: 1981;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  padding: 0;
+  margin: 0;
+  background-color: #252525;
+  opacity: 0.5;
+}
+.alertify .ajs-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  padding: 0;
+  overflow-y: auto;
+  z-index: 1981;
+}
+.alertify .ajs-dialog {
+  position: relative;
+  margin: 5% auto;
+  min-height: 110px;
+  max-width: 500px;
+  padding: 24px 24px 0 24px;
+  outline: 0;
+  background-color: #fff;
+}
+.alertify .ajs-dialog.ajs-capture:before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  display: block;
+  z-index: 1;
+}
+.alertify .ajs-reset {
+  position: absolute !important;
+  display: inline !important;
+  width: 0 !important;
+  height: 0 !important;
+  opacity: 0 !important;
+}
+.alertify .ajs-commands {
+  position: absolute;
+  left: 4px;
+  margin: -14px 0 0 24px;
+  z-index: 2;
+}
+.alertify .ajs-commands button {
+  display: none;
+  width: 10px;
+  height: 10px;
+  margin-right: 10px;
+  padding: 10px;
+  border: 0;
+  background-color: transparent;
+  background-repeat: no-repeat;
+  background-position: center;
+  cursor: pointer;
+}
+.alertify .ajs-commands button.ajs-close {
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNy8xMy8xNOrZqugAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAAh0lEQVQYlY2QsQ0EIQwEB9cBAR1CJUaI/gigDnwR6NBL/7/xWLNrZ2b8EwGotVpr7eOitWa1VjugiNB7R1UPrKrWe0dEAHBbXUqxMQbeewDmnHjvyTm7C3zDwAUd9c63YQdUVdu6EAJzzquz7HXvTiklt+H9DQFYaxFjvDqllFyMkbXWvfpXHjJrWFgdBq/hAAAAAElFTkSuQmCC);
+}
+.alertify .ajs-commands button.ajs-maximize {
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNy8xMy8xNOrZqugAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAAOUlEQVQYlWP8//8/AzGAhYGBgaG4uBiv6t7eXkYmooxjYGAgWiELsvHYFMCcRX2rSXcjoSBiJDbAAeD+EGu+8BZcAAAAAElFTkSuQmCC);
+}
+.alertify .ajs-header {
+  margin: -24px;
+  margin-bottom: 0;
+  padding: 16px 24px;
+  background-color: #fff;
+}
+.alertify .ajs-body {
+  min-height: 56px;
+}
+.alertify .ajs-body .ajs-content {
+  padding: 16px 16px 16px 24px;
+}
+.alertify .ajs-footer {
+  padding: 4px;
+  margin-right: -24px;
+  margin-left: -24px;
+  min-height: 43px;
+  background-color: #fff;
+}
+.alertify .ajs-footer .ajs-buttons.ajs-primary {
+  text-align: left;
+}
+.alertify .ajs-footer .ajs-buttons.ajs-primary .ajs-button {
+  margin: 4px;
+}
+.alertify .ajs-footer .ajs-buttons.ajs-auxiliary {
+  float: right;
+  clear: none;
+  text-align: right;
+}
+.alertify .ajs-footer .ajs-buttons.ajs-auxiliary .ajs-button {
+  margin: 4px;
+}
+.alertify .ajs-footer .ajs-buttons .ajs-button {
+  min-width: 88px;
+  min-height: 35px;
+}
+.alertify .ajs-handle {
+  position: absolute;
+  display: none;
+  width: 10px;
+  height: 10px;
+  left: 0;
+  bottom: 0;
+  z-index: 1;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNy8xMS8xNEDQYmMAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAAQ0lEQVQYlaXNMQoAIAxD0dT7H657l0KX3iJuUlBUNOsPPCGJm7VDp6ryeMxMuDsAQH7owW3pyn3RS26iKxERMLN3ugOaAkaL3sWVigAAAABJRU5ErkJggg==);
+  -webkit-transform: scaleX(-1);
+          transform: scaleX(-1);
+  cursor: sw-resize;
+}
+.alertify.ajs-no-overflow .ajs-body .ajs-content {
+  overflow: hidden !important;
+}
+.alertify.ajs-no-padding.ajs-maximized .ajs-body .ajs-content {
+  right: 0;
+  left: 0;
+  padding: 0;
+}
+.alertify.ajs-no-padding:not(.ajs-maximized) .ajs-body {
+  margin-right: -24px;
+  margin-left: -24px;
+}
+.alertify.ajs-no-padding:not(.ajs-maximized) .ajs-body .ajs-content {
+  padding: 0;
+}
+.alertify.ajs-no-padding.ajs-resizable .ajs-body .ajs-content {
+  right: 0;
+  left: 0;
+}
+.alertify.ajs-maximizable .ajs-commands button.ajs-maximize,
+.alertify.ajs-maximizable .ajs-commands button.ajs-restore {
+  display: inline-block;
+}
+.alertify.ajs-closable .ajs-commands button.ajs-close {
+  display: inline-block;
+}
+.alertify.ajs-maximized .ajs-dialog {
+  width: 100% !important;
+  height: 100% !important;
+  max-width: none !important;
+  margin: 0 auto !important;
+  top: 0 !important;
+  right: 0 !important;
+}
+.alertify.ajs-maximized.ajs-modeless .ajs-modal {
+  position: fixed !important;
+  min-height: 100% !important;
+  max-height: none !important;
+  margin: 0 !important;
+}
+.alertify.ajs-maximized .ajs-commands button.ajs-maximize {
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNy8xMy8xNOrZqugAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAASklEQVQYlZWQ0QkAMQhDtXRincOZX78KVtrDCwgqJNEoIB3MPLj7lRUROlpyVXGzby6zWuY+kz6tj5sBMTMAyVV3/595RbOh3cAXsww1raeiOcoAAAAASUVORK5CYII=);
+}
+.alertify.ajs-resizable .ajs-dialog,
+.alertify.ajs-maximized .ajs-dialog {
+  padding: 0;
+}
+.alertify.ajs-resizable .ajs-commands,
+.alertify.ajs-maximized .ajs-commands {
+  margin: 14px 0 0 24px;
+}
+.alertify.ajs-resizable .ajs-header,
+.alertify.ajs-maximized .ajs-header {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  margin: 0;
+  padding: 16px 24px;
+}
+.alertify.ajs-resizable .ajs-body,
+.alertify.ajs-maximized .ajs-body {
+  min-height: 224px;
+  display: inline-block;
+}
+.alertify.ajs-resizable .ajs-body .ajs-content,
+.alertify.ajs-maximized .ajs-body .ajs-content {
+  position: absolute;
+  top: 50px;
+  left: 24px;
+  bottom: 50px;
+  right: 24px;
+  overflow: auto;
+}
+.alertify.ajs-resizable .ajs-footer,
+.alertify.ajs-maximized .ajs-footer {
+  position: absolute;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  margin: 0;
+}
+.alertify.ajs-resizable:not(.ajs-maximized) .ajs-dialog {
+  min-width: 548px;
+}
+.alertify.ajs-resizable:not(.ajs-maximized) .ajs-handle {
+  display: block;
+}
+.alertify.ajs-movable:not(.ajs-maximized) .ajs-header {
+  cursor: move;
+}
+.alertify.ajs-modeless .ajs-dimmer,
+.alertify.ajs-modeless .ajs-reset {
+  display: none;
+}
+.alertify.ajs-modeless .ajs-modal {
+  overflow: visible;
+  max-width: none;
+  max-height: 0;
+}
+.alertify.ajs-modeless.ajs-pinnable .ajs-commands button.ajs-pin {
+  display: inline-block;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNy8xMy8xNOrZqugAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAAQklEQVQYlcWPMQ4AIAwCqU9u38GbcbHRWN1MvKQDhQFMEpKImGJA0gCgnYw0V0rwxseg5erT4oSkQVI5d9f+e9+xA0NbLpWfitPXAAAAAElFTkSuQmCC);
+}
+.alertify.ajs-modeless.ajs-unpinned .ajs-modal {
+  position: absolute;
+}
+.alertify.ajs-modeless.ajs-unpinned .ajs-commands button.ajs-pin {
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNy8xMy8xNOrZqugAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAAO0lEQVQYlWP8//8/AzGAiShV6AqLi4txGs+CLoBLMYbC3t5eRmyaWfBZhwwYkX2NTxPRvibKjRhW4wMAhxkYGbLu3pEAAAAASUVORK5CYII=);
+}
+.alertify.ajs-modeless:not(.ajs-unpinned) .ajs-body {
+  max-height: 500px;
+  overflow: auto;
+}
+.alertify.ajs-basic .ajs-header {
+  opacity: 0;
+}
+.alertify.ajs-basic .ajs-footer {
+  visibility: hidden;
+}
+.alertify.ajs-frameless .ajs-header {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  min-height: 60px;
+  margin: 0;
+  padding: 0;
+  opacity: 0;
+  z-index: 1;
+}
+.alertify.ajs-frameless .ajs-footer {
+  display: none;
+}
+.alertify.ajs-frameless .ajs-body .ajs-content {
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+}
+.alertify.ajs-frameless:not(.ajs-resizable) .ajs-dialog {
+  padding-top: 0;
+}
+.alertify.ajs-frameless:not(.ajs-resizable) .ajs-dialog .ajs-commands {
+  margin-top: 0;
+}
+.ajs-no-overflow {
+  overflow: hidden !important;
+  outline: none;
+}
+.ajs-no-overflow.ajs-fixed {
+  position: fixed;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  overflow-y: scroll!important;
+}
+.ajs-no-selection,
+.ajs-no-selection * {
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+}
+@media screen and (max-width: 568px) {
+  .alertify .ajs-dialog {
+    min-width: 150px;
+  }
+  .alertify:not(.ajs-maximized) .ajs-modal {
+    padding: 0 5%;
+  }
+  .alertify:not(.ajs-maximized).ajs-resizable .ajs-dialog {
+    min-width: initial;
+    min-width: auto /*IE fallback*/;
+  }
+}
+@-moz-document url-prefix() {
+  .alertify button:focus {
+    outline: 1px dotted #3593D2;
+  }
+}
+.alertify .ajs-dimmer,
+.alertify .ajs-modal {
+  -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+  -webkit-transition-property: opacity, visibility;
+  transition-property: opacity, visibility;
+  -webkit-transition-timing-function: linear;
+          transition-timing-function: linear;
+  -webkit-transition-duration: 250ms;
+          transition-duration: 250ms;
+}
+.alertify.ajs-hidden .ajs-dimmer,
+.alertify.ajs-hidden .ajs-modal {
+  visibility: hidden;
+  opacity: 0;
+}
+.alertify.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-duration: 500ms;
+          animation-duration: 500ms;
+}
+.alertify.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-duration: 250ms;
+          animation-duration: 250ms;
+}
+.alertify .ajs-dialog.ajs-shake {
+  -webkit-animation-name: ajs-shake;
+          animation-name: ajs-shake;
+  -webkit-animation-duration: 0.1s;
+          animation-duration: 0.1s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+}
+@-webkit-keyframes ajs-shake {
+  0%,
+  100% {
+    -webkit-transform: translate3d(0, 0, 0);
+            transform: translate3d(0, 0, 0);
+  }
+  10%,
+  30%,
+  50%,
+  70%,
+  90% {
+    -webkit-transform: translate3d(10px, 0, 0);
+            transform: translate3d(10px, 0, 0);
+  }
+  20%,
+  40%,
+  60%,
+  80% {
+    -webkit-transform: translate3d(-10px, 0, 0);
+            transform: translate3d(-10px, 0, 0);
+  }
+}
+@keyframes ajs-shake {
+  0%,
+  100% {
+    -webkit-transform: translate3d(0, 0, 0);
+            transform: translate3d(0, 0, 0);
+  }
+  10%,
+  30%,
+  50%,
+  70%,
+  90% {
+    -webkit-transform: translate3d(10px, 0, 0);
+            transform: translate3d(10px, 0, 0);
+  }
+  20%,
+  40%,
+  60%,
+  80% {
+    -webkit-transform: translate3d(-10px, 0, 0);
+            transform: translate3d(-10px, 0, 0);
+  }
+}
+.alertify.ajs-slide.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-name: ajs-slideIn;
+          animation-name: ajs-slideIn;
+  -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+          animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+}
+.alertify.ajs-slide.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-name: ajs-slideOut;
+          animation-name: ajs-slideOut;
+  -webkit-animation-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
+          animation-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
+}
+.alertify.ajs-zoom.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-name: ajs-zoomIn;
+          animation-name: ajs-zoomIn;
+}
+.alertify.ajs-zoom.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-name: ajs-zoomOut;
+          animation-name: ajs-zoomOut;
+}
+.alertify.ajs-fade.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-name: ajs-fadeIn;
+          animation-name: ajs-fadeIn;
+}
+.alertify.ajs-fade.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-name: ajs-fadeOut;
+          animation-name: ajs-fadeOut;
+}
+.alertify.ajs-pulse.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-name: ajs-pulseIn;
+          animation-name: ajs-pulseIn;
+}
+.alertify.ajs-pulse.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-name: ajs-pulseOut;
+          animation-name: ajs-pulseOut;
+}
+.alertify.ajs-flipx.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-name: ajs-flipInX;
+          animation-name: ajs-flipInX;
+}
+.alertify.ajs-flipx.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-name: ajs-flipOutX;
+          animation-name: ajs-flipOutX;
+}
+.alertify.ajs-flipy.ajs-in:not(.ajs-hidden) .ajs-dialog {
+  -webkit-animation-name: ajs-flipInY;
+          animation-name: ajs-flipInY;
+}
+.alertify.ajs-flipy.ajs-out.ajs-hidden .ajs-dialog {
+  -webkit-animation-name: ajs-flipOutY;
+          animation-name: ajs-flipOutY;
+}
+@-webkit-keyframes ajs-pulseIn {
+  0%,
+  20%,
+  40%,
+  60%,
+  80%,
+  100% {
+    -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+            transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+  }
+  0% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+  }
+  20% {
+    -webkit-transform: scale3d(1.1, 1.1, 1.1);
+            transform: scale3d(1.1, 1.1, 1.1);
+  }
+  40% {
+    -webkit-transform: scale3d(0.9, 0.9, 0.9);
+            transform: scale3d(0.9, 0.9, 0.9);
+  }
+  60% {
+    opacity: 1;
+    -webkit-transform: scale3d(1.03, 1.03, 1.03);
+            transform: scale3d(1.03, 1.03, 1.03);
+  }
+  80% {
+    -webkit-transform: scale3d(0.97, 0.97, 0.97);
+            transform: scale3d(0.97, 0.97, 0.97);
+  }
+  100% {
+    opacity: 1;
+    -webkit-transform: scale3d(1, 1, 1);
+            transform: scale3d(1, 1, 1);
+  }
+}
+@keyframes ajs-pulseIn {
+  0%,
+  20%,
+  40%,
+  60%,
+  80%,
+  100% {
+    -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+            transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+  }
+  0% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+  }
+  20% {
+    -webkit-transform: scale3d(1.1, 1.1, 1.1);
+            transform: scale3d(1.1, 1.1, 1.1);
+  }
+  40% {
+    -webkit-transform: scale3d(0.9, 0.9, 0.9);
+            transform: scale3d(0.9, 0.9, 0.9);
+  }
+  60% {
+    opacity: 1;
+    -webkit-transform: scale3d(1.03, 1.03, 1.03);
+            transform: scale3d(1.03, 1.03, 1.03);
+  }
+  80% {
+    -webkit-transform: scale3d(0.97, 0.97, 0.97);
+            transform: scale3d(0.97, 0.97, 0.97);
+  }
+  100% {
+    opacity: 1;
+    -webkit-transform: scale3d(1, 1, 1);
+            transform: scale3d(1, 1, 1);
+  }
+}
+@-webkit-keyframes ajs-pulseOut {
+  20% {
+    -webkit-transform: scale3d(0.9, 0.9, 0.9);
+            transform: scale3d(0.9, 0.9, 0.9);
+  }
+  50%,
+  55% {
+    opacity: 1;
+    -webkit-transform: scale3d(1.1, 1.1, 1.1);
+            transform: scale3d(1.1, 1.1, 1.1);
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+  }
+}
+@keyframes ajs-pulseOut {
+  20% {
+    -webkit-transform: scale3d(0.9, 0.9, 0.9);
+            transform: scale3d(0.9, 0.9, 0.9);
+  }
+  50%,
+  55% {
+    opacity: 1;
+    -webkit-transform: scale3d(1.1, 1.1, 1.1);
+            transform: scale3d(1.1, 1.1, 1.1);
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+  }
+}
+@-webkit-keyframes ajs-zoomIn {
+  0% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.25, 0.25, 0.25);
+            transform: scale3d(0.25, 0.25, 0.25);
+  }
+  100% {
+    opacity: 1;
+    -webkit-transform: scale3d(1, 1, 1);
+            transform: scale3d(1, 1, 1);
+  }
+}
+@keyframes ajs-zoomIn {
+  0% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.25, 0.25, 0.25);
+            transform: scale3d(0.25, 0.25, 0.25);
+  }
+  100% {
+    opacity: 1;
+    -webkit-transform: scale3d(1, 1, 1);
+            transform: scale3d(1, 1, 1);
+  }
+}
+@-webkit-keyframes ajs-zoomOut {
+  0% {
+    opacity: 1;
+    -webkit-transform: scale3d(1, 1, 1);
+            transform: scale3d(1, 1, 1);
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.25, 0.25, 0.25);
+            transform: scale3d(0.25, 0.25, 0.25);
+  }
+}
+@keyframes ajs-zoomOut {
+  0% {
+    opacity: 1;
+    -webkit-transform: scale3d(1, 1, 1);
+            transform: scale3d(1, 1, 1);
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.25, 0.25, 0.25);
+            transform: scale3d(0.25, 0.25, 0.25);
+  }
+}
+@-webkit-keyframes ajs-fadeIn {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+@keyframes ajs-fadeIn {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+@-webkit-keyframes ajs-fadeOut {
+  0% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+@keyframes ajs-fadeOut {
+  0% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+@-webkit-keyframes ajs-flipInX {
+  0% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -90deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, -90deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+    opacity: 0;
+  }
+  40% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 20deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, 20deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+  }
+  60% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -10deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, -10deg);
+    opacity: 1;
+  }
+  80% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 5deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, 5deg);
+  }
+  100% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+}
+@keyframes ajs-flipInX {
+  0% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -90deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, -90deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+    opacity: 0;
+  }
+  40% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 20deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, 20deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+  }
+  60% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -10deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, -10deg);
+    opacity: 1;
+  }
+  80% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 5deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, 5deg);
+  }
+  100% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+}
+@-webkit-keyframes ajs-flipOutX {
+  0% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+  30% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 20deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, 20deg);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -90deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, -90deg);
+    opacity: 0;
+  }
+}
+@keyframes ajs-flipOutX {
+  0% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+  30% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 20deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, 20deg);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -90deg);
+            transform: perspective(400px) rotate3d(1, 0, 0, -90deg);
+    opacity: 0;
+  }
+}
+@-webkit-keyframes ajs-flipInY {
+  0% {
+    -webkit-transform: perspective(400px) rotate3d(0, -1, 0, -90deg);
+            transform: perspective(400px) rotate3d(0, -1, 0, -90deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+    opacity: 0;
+  }
+  40% {
+    -webkit-transform: perspective(400px) rotate3d(0, -1, 0, 20deg);
+            transform: perspective(400px) rotate3d(0, -1, 0, 20deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+  }
+  60% {
+    -webkit-transform: perspective(400px) rotate3d(0, -1, 0, -10deg);
+            transform: perspective(400px) rotate3d(0, -1, 0, -10deg);
+    opacity: 1;
+  }
+  80% {
+    -webkit-transform: perspective(400px) rotate3d(0, -1, 0, 5deg);
+            transform: perspective(400px) rotate3d(0, -1, 0, 5deg);
+  }
+  100% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+}
+@keyframes ajs-flipInY {
+  0% {
+    -webkit-transform: perspective(400px) rotate3d(0, -1, 0, -90deg);
+            transform: perspective(400px) rotate3d(0, -1, 0, -90deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+    opacity: 0;
+  }
+  40% {
+    -webkit-transform: perspective(400px) rotate3d(0, -1, 0, 20deg);
+            transform: perspective(400px) rotate3d(0, -1, 0, 20deg);
+    -webkit-transition-timing-function: ease-in;
+            transition-timing-function: ease-in;
+  }
+  60% {
+    -webkit-transform: perspective(400px) rotate3d(0, -1, 0, -10deg);
+            transform: perspective(400px) rotate3d(0, -1, 0, -10deg);
+    opacity: 1;
+  }
+  80% {
+    -webkit-transform: perspective(400px) rotate3d(0, -1, 0, 5deg);
+            transform: perspective(400px) rotate3d(0, -1, 0, 5deg);
+  }
+  100% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+}
+@-webkit-keyframes ajs-flipOutY {
+  0% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+  30% {
+    -webkit-transform: perspective(400px) rotate3d(0, -1, 0, 15deg);
+            transform: perspective(400px) rotate3d(0, -1, 0, 15deg);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: perspective(400px) rotate3d(0, -1, 0, -90deg);
+            transform: perspective(400px) rotate3d(0, -1, 0, -90deg);
+    opacity: 0;
+  }
+}
+@keyframes ajs-flipOutY {
+  0% {
+    -webkit-transform: perspective(400px);
+            transform: perspective(400px);
+  }
+  30% {
+    -webkit-transform: perspective(400px) rotate3d(0, -1, 0, 15deg);
+            transform: perspective(400px) rotate3d(0, -1, 0, 15deg);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: perspective(400px) rotate3d(0, -1, 0, -90deg);
+            transform: perspective(400px) rotate3d(0, -1, 0, -90deg);
+    opacity: 0;
+  }
+}
+@-webkit-keyframes ajs-slideIn {
+  0% {
+    margin-top: -100%;
+  }
+  100% {
+    margin-top: 5%;
+  }
+}
+@keyframes ajs-slideIn {
+  0% {
+    margin-top: -100%;
+  }
+  100% {
+    margin-top: 5%;
+  }
+}
+@-webkit-keyframes ajs-slideOut {
+  0% {
+    margin-top: 5%;
+  }
+  100% {
+    margin-top: -100%;
+  }
+}
+@keyframes ajs-slideOut {
+  0% {
+    margin-top: 5%;
+  }
+  100% {
+    margin-top: -100%;
+  }
+}
+.alertify-notifier {
+  position: fixed;
+  width: 0;
+  overflow: visible;
+  z-index: 1982;
+  -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+}
+.alertify-notifier .ajs-message {
+  position: relative;
+  width: 260px;
+  max-height: 0;
+  padding: 0;
+  opacity: 0;
+  margin: 0;
+  -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+  -webkit-transition-duration: 250ms;
+          transition-duration: 250ms;
+  -webkit-transition-timing-function: linear;
+          transition-timing-function: linear;
+}
+.alertify-notifier .ajs-message.ajs-visible {
+  -webkit-transition-duration: 500ms;
+          transition-duration: 500ms;
+  -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+          transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+  opacity: 1;
+  max-height: 100%;
+  padding: 15px;
+  margin-top: 10px;
+}
+.alertify-notifier .ajs-message.ajs-success {
+  background: rgba(91, 189, 114, 0.95);
+}
+.alertify-notifier .ajs-message.ajs-error {
+  background: rgba(217, 92, 92, 0.95);
+}
+.alertify-notifier .ajs-message.ajs-warning {
+  background: rgba(252, 248, 215, 0.95);
+}
+.alertify-notifier .ajs-message .ajs-close {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 16px;
+  height: 16px;
+  cursor: pointer;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAABGdBTUEAALGPC/xhBQAAAFBJREFUGBl1j0EKADEIA+ve/P9f9bh1hEihNBfjVCO1v7RKVqJK4h8gM5cAPR42AkQEpSXPwMTyoi13n5N9YqJehm3Fnr7nL1D0ZEbD5OubGyC7a9gx+9eNAAAAAElFTkSuQmCC);
+  background-repeat: no-repeat;
+  background-position: center center;
+  background-color: rgba(0, 0, 0, 0.5);
+  border-top-left-radius: 2px;
+}
+.alertify-notifier.ajs-top {
+  top: 10px;
+}
+.alertify-notifier.ajs-bottom {
+  bottom: 10px;
+}
+.alertify-notifier.ajs-right {
+  left: 10px;
+}
+.alertify-notifier.ajs-right .ajs-message {
+  left: -320px;
+}
+.alertify-notifier.ajs-right .ajs-message.ajs-visible {
+  left: 290px;
+}
+.alertify-notifier.ajs-left {
+  right: 10px;
+}
+.alertify-notifier.ajs-left .ajs-message {
+  right: -300px;
+}
+.alertify-notifier.ajs-left .ajs-message.ajs-visible {
+  right: 0;
+}
+.alertify-notifier.ajs-center {
+  right: 50%;
+}
+.alertify-notifier.ajs-center .ajs-message {
+  -webkit-transform: translateX(50%);
+          transform: translateX(50%);
+}
+.alertify-notifier.ajs-center .ajs-message.ajs-visible {
+  right: 50%;
+  -webkit-transition-timing-function: cubic-bezier(0.57, 0.43, 0.1, 0.65);
+          transition-timing-function: cubic-bezier(0.57, 0.43, 0.1, 0.65);
+}
+.alertify-notifier.ajs-center.ajs-top .ajs-message {
+  top: -300px;
+}
+.alertify-notifier.ajs-center.ajs-top .ajs-message.ajs-visible {
+  top: 0;
+}
+.alertify-notifier.ajs-center.ajs-bottom .ajs-message {
+  bottom: -300px;
+}
+.alertify-notifier.ajs-center.ajs-bottom .ajs-message.ajs-visible {
+  bottom: 0;
+}
+.ajs-no-transition.alertify .ajs-dimmer,
+.ajs-no-transition.alertify .ajs-modal,
+.ajs-no-transition.alertify .ajs-dialog {
+  -webkit-transition: none!important;
+  transition: none!important;
+  -webkit-animation: none!important;
+          animation: none!important;
+}
+.ajs-no-transition.alertify-notifier .ajs-message {
+  -webkit-transition: none!important;
+  transition: none!important;
+  -webkit-animation: none!important;
+          animation: none!important;
+}
+@media (prefers-reduced-motion: reduce) {
+  .alertify .ajs-dimmer,
+  .alertify .ajs-modal,
+  .alertify .ajs-dialog {
+    -webkit-transition: none!important;
+    transition: none!important;
+    -webkit-animation: none!important;
+            animation: none!important;
+  }
+  .alertify-notifier .ajs-message {
+    -webkit-transition: none!important;
+    transition: none!important;
+    -webkit-animation: none!important;
+            animation: none!important;
+  }
+}

sample/prod/talk/bundle/alertify-1.14.0/css/themes/bootstrap.css

@@ -0,0 +1,61 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dimmer {
+  background-color: #000;
+  opacity: 0.5;
+}
+.alertify .ajs-dialog {
+  max-width: 600px;
+  min-height: 122px;
+  background-color: #fff;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
+          box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
+  border-radius: 6px;
+}
+.alertify .ajs-header {
+  color: #333;
+  border-bottom: 1px solid #e5e5e5;
+  border-radius: 6px 6px 0 0;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 18px;
+}
+.alertify .ajs-body {
+  font-family: 'Roboto', sans-serif;
+  color: black;
+}
+.alertify.ajs-resizable .ajs-content,
+.alertify.ajs-maximized:not(.ajs-resizable) .ajs-content {
+  top: 58px;
+  bottom: 68px;
+}
+.alertify .ajs-footer {
+  background-color: #fff;
+  padding: 15px;
+  border-top: 1px solid #e5e5e5;
+  border-radius: 0 0 6px 6px;
+}
+.alertify-notifier .ajs-message {
+  background: rgba(255, 255, 255, 0.95);
+  color: #000;
+  text-align: center;
+  border: solid 1px #ddd;
+  border-radius: 2px;
+}
+.alertify-notifier .ajs-message.ajs-success {
+  color: #fff;
+  background: rgba(91, 189, 114, 0.95);
+  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5);
+}
+.alertify-notifier .ajs-message.ajs-error {
+  color: #fff;
+  background: rgba(217, 92, 92, 0.95);
+  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5);
+}
+.alertify-notifier .ajs-message.ajs-warning {
+  background: rgba(252, 248, 215, 0.95);
+  border-color: #999;
+}

sample/prod/talk/bundle/alertify-1.14.0/css/themes/bootstrap.min.css

@@ -0,0 +1,6 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dimmer{background-color:#000;opacity:.5}.alertify .ajs-dialog{max-width:600px;min-height:122px;background-color:#fff;border:1px solid rgba(0,0,0,.2);-webkit-box-shadow:0 5px 15px rgba(0,0,0,.5);box-shadow:0 5px 15px rgba(0,0,0,.5);border-radius:6px}.alertify .ajs-header{color:#333;border-bottom:1px solid #e5e5e5;border-radius:6px 6px 0 0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:18px}.alertify .ajs-body{font-family:Roboto,sans-serif;color:#000}.alertify.ajs-maximized:not(.ajs-resizable) .ajs-content,.alertify.ajs-resizable .ajs-content{top:58px;bottom:68px}.alertify .ajs-footer{background-color:#fff;padding:15px;border-top:1px solid #e5e5e5;border-radius:0 0 6px 6px}.alertify-notifier .ajs-message{background:rgba(255,255,255,.95);color:#000;text-align:center;border:solid 1px #ddd;border-radius:2px}.alertify-notifier .ajs-message.ajs-success{color:#fff;background:rgba(91,189,114,.95);text-shadow:-1px -1px 0 rgba(0,0,0,.5)}.alertify-notifier .ajs-message.ajs-error{color:#fff;background:rgba(217,92,92,.95);text-shadow:-1px -1px 0 rgba(0,0,0,.5)}.alertify-notifier .ajs-message.ajs-warning{background:rgba(252,248,215,.95);border-color:#999}

sample/prod/talk/bundle/alertify-1.14.0/css/themes/bootstrap.rtl.css

@@ -0,0 +1,61 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dimmer {
+  background-color: #000;
+  opacity: 0.5;
+}
+.alertify .ajs-dialog {
+  max-width: 600px;
+  min-height: 122px;
+  background-color: #fff;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
+          box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
+  border-radius: 6px;
+}
+.alertify .ajs-header {
+  color: #333;
+  border-bottom: 1px solid #e5e5e5;
+  border-radius: 6px 6px 0 0;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 18px;
+}
+.alertify .ajs-body {
+  font-family: 'Roboto', sans-serif;
+  color: black;
+}
+.alertify.ajs-resizable .ajs-content,
+.alertify.ajs-maximized:not(.ajs-resizable) .ajs-content {
+  top: 58px;
+  bottom: 68px;
+}
+.alertify .ajs-footer {
+  background-color: #fff;
+  padding: 15px;
+  border-top: 1px solid #e5e5e5;
+  border-radius: 0 0 6px 6px;
+}
+.alertify-notifier .ajs-message {
+  background: rgba(255, 255, 255, 0.95);
+  color: #000;
+  text-align: center;
+  border: solid 1px #ddd;
+  border-radius: 2px;
+}
+.alertify-notifier .ajs-message.ajs-success {
+  color: #fff;
+  background: rgba(91, 189, 114, 0.95);
+  text-shadow: 1px -1px 0 rgba(0, 0, 0, 0.5);
+}
+.alertify-notifier .ajs-message.ajs-error {
+  color: #fff;
+  background: rgba(217, 92, 92, 0.95);
+  text-shadow: 1px -1px 0 rgba(0, 0, 0, 0.5);
+}
+.alertify-notifier .ajs-message.ajs-warning {
+  background: rgba(252, 248, 215, 0.95);
+  border-color: #999;
+}

sample/prod/talk/bundle/alertify-1.14.0/css/themes/bootstrap.rtl.min.css

@@ -0,0 +1,6 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dimmer{background-color:#000;opacity:.5}.alertify .ajs-dialog{max-width:600px;min-height:122px;background-color:#fff;border:1px solid rgba(0,0,0,.2);-webkit-box-shadow:0 5px 15px rgba(0,0,0,.5);box-shadow:0 5px 15px rgba(0,0,0,.5);border-radius:6px}.alertify .ajs-header{color:#333;border-bottom:1px solid #e5e5e5;border-radius:6px 6px 0 0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:18px}.alertify .ajs-body{font-family:Roboto,sans-serif;color:#000}.alertify.ajs-maximized:not(.ajs-resizable) .ajs-content,.alertify.ajs-resizable .ajs-content{top:58px;bottom:68px}.alertify .ajs-footer{background-color:#fff;padding:15px;border-top:1px solid #e5e5e5;border-radius:0 0 6px 6px}.alertify-notifier .ajs-message{background:rgba(255,255,255,.95);color:#000;text-align:center;border:solid 1px #ddd;border-radius:2px}.alertify-notifier .ajs-message.ajs-success{color:#fff;background:rgba(91,189,114,.95);text-shadow:1px -1px 0 rgba(0,0,0,.5)}.alertify-notifier .ajs-message.ajs-error{color:#fff;background:rgba(217,92,92,.95);text-shadow:1px -1px 0 rgba(0,0,0,.5)}.alertify-notifier .ajs-message.ajs-warning{background:rgba(252,248,215,.95);border-color:#999}

sample/prod/talk/bundle/alertify-1.14.0/css/themes/default.css

@@ -0,0 +1,69 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dialog {
+  background-color: white;
+  -webkit-box-shadow: 0px 15px 20px 0px rgba(0, 0, 0, 0.25);
+          box-shadow: 0px 15px 20px 0px rgba(0, 0, 0, 0.25);
+  border-radius: 2px;
+}
+.alertify .ajs-header {
+  color: black;
+  font-weight: bold;
+  background: #fafafa;
+  border-bottom: #eee 1px solid;
+  border-radius: 2px 2px 0 0;
+}
+.alertify .ajs-body {
+  color: black;
+}
+.alertify .ajs-body .ajs-content .ajs-input {
+  display: block;
+  width: 100%;
+  padding: 8px;
+  margin: 4px;
+  border-radius: 2px;
+  border: 1px solid #CCC;
+}
+.alertify .ajs-body .ajs-content p {
+  margin: 0;
+}
+.alertify .ajs-footer {
+  background: #fbfbfb;
+  border-top: #eee 1px solid;
+  border-radius: 0 0 2px 2px;
+}
+.alertify .ajs-footer .ajs-buttons .ajs-button {
+  background-color: transparent;
+  color: #000;
+  border: 0;
+  font-size: 14px;
+  font-weight: bold;
+  text-transform: uppercase;
+}
+.alertify .ajs-footer .ajs-buttons .ajs-button.ajs-ok {
+  color: #3593D2;
+}
+.alertify-notifier .ajs-message {
+  background: rgba(255, 255, 255, 0.95);
+  color: #000;
+  text-align: center;
+  border: solid 1px #ddd;
+  border-radius: 2px;
+}
+.alertify-notifier .ajs-message.ajs-success {
+  color: #fff;
+  background: rgba(91, 189, 114, 0.95);
+  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5);
+}
+.alertify-notifier .ajs-message.ajs-error {
+  color: #fff;
+  background: rgba(217, 92, 92, 0.95);
+  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5);
+}
+.alertify-notifier .ajs-message.ajs-warning {
+  background: rgba(252, 248, 215, 0.95);
+  border-color: #999;
+}

sample/prod/talk/bundle/alertify-1.14.0/css/themes/default.min.css

@@ -0,0 +1,6 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dialog{background-color:#fff;-webkit-box-shadow:0 15px 20px 0 rgba(0,0,0,.25);box-shadow:0 15px 20px 0 rgba(0,0,0,.25);border-radius:2px}.alertify .ajs-header{color:#000;font-weight:700;background:#fafafa;border-bottom:#eee 1px solid;border-radius:2px 2px 0 0}.alertify .ajs-body{color:#000}.alertify .ajs-body .ajs-content .ajs-input{display:block;width:100%;padding:8px;margin:4px;border-radius:2px;border:1px solid #ccc}.alertify .ajs-body .ajs-content p{margin:0}.alertify .ajs-footer{background:#fbfbfb;border-top:#eee 1px solid;border-radius:0 0 2px 2px}.alertify .ajs-footer .ajs-buttons .ajs-button{background-color:transparent;color:#000;border:0;font-size:14px;font-weight:700;text-transform:uppercase}.alertify .ajs-footer .ajs-buttons .ajs-button.ajs-ok{color:#3593d2}.alertify-notifier .ajs-message{background:rgba(255,255,255,.95);color:#000;text-align:center;border:solid 1px #ddd;border-radius:2px}.alertify-notifier .ajs-message.ajs-success{color:#fff;background:rgba(91,189,114,.95);text-shadow:-1px -1px 0 rgba(0,0,0,.5)}.alertify-notifier .ajs-message.ajs-error{color:#fff;background:rgba(217,92,92,.95);text-shadow:-1px -1px 0 rgba(0,0,0,.5)}.alertify-notifier .ajs-message.ajs-warning{background:rgba(252,248,215,.95);border-color:#999}

sample/prod/talk/bundle/alertify-1.14.0/css/themes/default.rtl.css

@@ -0,0 +1,69 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dialog {
+  background-color: white;
+  -webkit-box-shadow: 0px 15px 20px 0px rgba(0, 0, 0, 0.25);
+          box-shadow: 0px 15px 20px 0px rgba(0, 0, 0, 0.25);
+  border-radius: 2px;
+}
+.alertify .ajs-header {
+  color: black;
+  font-weight: bold;
+  background: #fafafa;
+  border-bottom: #eee 1px solid;
+  border-radius: 2px 2px 0 0;
+}
+.alertify .ajs-body {
+  color: black;
+}
+.alertify .ajs-body .ajs-content .ajs-input {
+  display: block;
+  width: 100%;
+  padding: 8px;
+  margin: 4px;
+  border-radius: 2px;
+  border: 1px solid #CCC;
+}
+.alertify .ajs-body .ajs-content p {
+  margin: 0;
+}
+.alertify .ajs-footer {
+  background: #fbfbfb;
+  border-top: #eee 1px solid;
+  border-radius: 0 0 2px 2px;
+}
+.alertify .ajs-footer .ajs-buttons .ajs-button {
+  background-color: transparent;
+  color: #000;
+  border: 0;
+  font-size: 14px;
+  font-weight: bold;
+  text-transform: uppercase;
+}
+.alertify .ajs-footer .ajs-buttons .ajs-button.ajs-ok {
+  color: #3593D2;
+}
+.alertify-notifier .ajs-message {
+  background: rgba(255, 255, 255, 0.95);
+  color: #000;
+  text-align: center;
+  border: solid 1px #ddd;
+  border-radius: 2px;
+}
+.alertify-notifier .ajs-message.ajs-success {
+  color: #fff;
+  background: rgba(91, 189, 114, 0.95);
+  text-shadow: 1px -1px 0 rgba(0, 0, 0, 0.5);
+}
+.alertify-notifier .ajs-message.ajs-error {
+  color: #fff;
+  background: rgba(217, 92, 92, 0.95);
+  text-shadow: 1px -1px 0 rgba(0, 0, 0, 0.5);
+}
+.alertify-notifier .ajs-message.ajs-warning {
+  background: rgba(252, 248, 215, 0.95);
+  border-color: #999;
+}

sample/prod/talk/bundle/alertify-1.14.0/css/themes/default.rtl.min.css

@@ -0,0 +1,6 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dialog{background-color:#fff;-webkit-box-shadow:0 15px 20px 0 rgba(0,0,0,.25);box-shadow:0 15px 20px 0 rgba(0,0,0,.25);border-radius:2px}.alertify .ajs-header{color:#000;font-weight:700;background:#fafafa;border-bottom:#eee 1px solid;border-radius:2px 2px 0 0}.alertify .ajs-body{color:#000}.alertify .ajs-body .ajs-content .ajs-input{display:block;width:100%;padding:8px;margin:4px;border-radius:2px;border:1px solid #ccc}.alertify .ajs-body .ajs-content p{margin:0}.alertify .ajs-footer{background:#fbfbfb;border-top:#eee 1px solid;border-radius:0 0 2px 2px}.alertify .ajs-footer .ajs-buttons .ajs-button{background-color:transparent;color:#000;border:0;font-size:14px;font-weight:700;text-transform:uppercase}.alertify .ajs-footer .ajs-buttons .ajs-button.ajs-ok{color:#3593d2}.alertify-notifier .ajs-message{background:rgba(255,255,255,.95);color:#000;text-align:center;border:solid 1px #ddd;border-radius:2px}.alertify-notifier .ajs-message.ajs-success{color:#fff;background:rgba(91,189,114,.95);text-shadow:1px -1px 0 rgba(0,0,0,.5)}.alertify-notifier .ajs-message.ajs-error{color:#fff;background:rgba(217,92,92,.95);text-shadow:1px -1px 0 rgba(0,0,0,.5)}.alertify-notifier .ajs-message.ajs-warning{background:rgba(252,248,215,.95);border-color:#999}

sample/prod/talk/bundle/alertify-1.14.0/css/themes/semantic.css

@@ -0,0 +1,89 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dimmer {
+  background-color: rgba(0, 0, 0, 0.85);
+  opacity: 1;
+}
+.alertify .ajs-dialog {
+  max-width: 50%;
+  min-height: 137px;
+  background-color: #F4F4F4;
+  border: 1px solid #DDD;
+  -webkit-box-shadow: none;
+          box-shadow: none;
+  border-radius: 5px;
+}
+.alertify .ajs-header {
+  padding: 1.5rem 2rem;
+  border-bottom: none;
+  border-radius: 5px 5px 0 0;
+  color: #555;
+  background-color: #fff;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 1.6em;
+  font-weight: 700;
+}
+.alertify .ajs-body {
+  font-family: 'Roboto', sans-serif;
+  color: #555;
+}
+.alertify .ajs-body .ajs-content .ajs-input {
+  width: 100%;
+  margin: 0;
+  padding: 0.65em 1em;
+  font-size: 1em;
+  background-color: #FFF;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  outline: 0;
+  color: rgba(0, 0, 0, 0.7);
+  border-radius: 0.3125em;
+  -webkit-transition: background-color 0.3s ease-out, border-color 0.2s ease, -webkit-box-shadow 0.2s ease;
+  transition: background-color 0.3s ease-out, border-color 0.2s ease, -webkit-box-shadow 0.2s ease;
+  transition: background-color 0.3s ease-out, box-shadow 0.2s ease, border-color 0.2s ease;
+  transition: background-color 0.3s ease-out, box-shadow 0.2s ease, border-color 0.2s ease, -webkit-box-shadow 0.2s ease;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+}
+.alertify .ajs-body .ajs-content .ajs-input:active {
+  border-color: rgba(0, 0, 0, 0.3);
+  background-color: #FAFAFA;
+}
+.alertify .ajs-body .ajs-content .ajs-input:focus {
+  border-color: rgba(0, 0, 0, 0.2);
+  color: rgba(0, 0, 0, 0.85);
+}
+.alertify.ajs-resizable .ajs-content,
+.alertify.ajs-maximized:not(.ajs-resizable) .ajs-content {
+  top: 64px;
+  bottom: 74px;
+}
+.alertify .ajs-footer {
+  background-color: #fff;
+  padding: 1rem 2rem;
+  border-top: none;
+  border-radius: 0 0 5px 5px;
+}
+.alertify-notifier .ajs-message {
+  background: rgba(255, 255, 255, 0.95);
+  color: #000;
+  text-align: center;
+  border: solid 1px #ddd;
+  border-radius: 2px;
+}
+.alertify-notifier .ajs-message.ajs-success {
+  color: #fff;
+  background: rgba(91, 189, 114, 0.95);
+  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5);
+}
+.alertify-notifier .ajs-message.ajs-error {
+  color: #fff;
+  background: rgba(217, 92, 92, 0.95);
+  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5);
+}
+.alertify-notifier .ajs-message.ajs-warning {
+  background: rgba(252, 248, 215, 0.95);
+  border-color: #999;
+}

sample/prod/talk/bundle/alertify-1.14.0/css/themes/semantic.min.css

@@ -0,0 +1,6 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dimmer{background-color:rgba(0,0,0,.85);opacity:1}.alertify .ajs-dialog{max-width:50%;min-height:137px;background-color:#f4f4f4;border:1px solid #ddd;-webkit-box-shadow:none;box-shadow:none;border-radius:5px}.alertify .ajs-header{padding:1.5rem 2rem;border-bottom:none;border-radius:5px 5px 0 0;color:#555;background-color:#fff;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:1.6em;font-weight:700}.alertify .ajs-body{font-family:Roboto,sans-serif;color:#555}.alertify .ajs-body .ajs-content .ajs-input{width:100%;margin:0;padding:.65em 1em;font-size:1em;background-color:#fff;border:1px solid rgba(0,0,0,.15);outline:0;color:rgba(0,0,0,.7);border-radius:.3125em;-webkit-transition:background-color .3s ease-out,border-color .2s ease,-webkit-box-shadow .2s ease;transition:background-color .3s ease-out,border-color .2s ease,-webkit-box-shadow .2s ease;transition:background-color .3s ease-out,box-shadow .2s ease,border-color .2s ease;transition:background-color .3s ease-out,box-shadow .2s ease,border-color .2s ease,-webkit-box-shadow .2s ease;-webkit-box-sizing:border-box;box-sizing:border-box}.alertify .ajs-body .ajs-content .ajs-input:active{border-color:rgba(0,0,0,.3);background-color:#fafafa}.alertify .ajs-body .ajs-content .ajs-input:focus{border-color:rgba(0,0,0,.2);color:rgba(0,0,0,.85)}.alertify.ajs-maximized:not(.ajs-resizable) .ajs-content,.alertify.ajs-resizable .ajs-content{top:64px;bottom:74px}.alertify .ajs-footer{background-color:#fff;padding:1rem 2rem;border-top:none;border-radius:0 0 5px 5px}.alertify-notifier .ajs-message{background:rgba(255,255,255,.95);color:#000;text-align:center;border:solid 1px #ddd;border-radius:2px}.alertify-notifier .ajs-message.ajs-success{color:#fff;background:rgba(91,189,114,.95);text-shadow:-1px -1px 0 rgba(0,0,0,.5)}.alertify-notifier .ajs-message.ajs-error{color:#fff;background:rgba(217,92,92,.95);text-shadow:-1px -1px 0 rgba(0,0,0,.5)}.alertify-notifier .ajs-message.ajs-warning{background:rgba(252,248,215,.95);border-color:#999}

sample/prod/talk/bundle/alertify-1.14.0/css/themes/semantic.rtl.css

@@ -0,0 +1,89 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dimmer {
+  background-color: rgba(0, 0, 0, 0.85);
+  opacity: 1;
+}
+.alertify .ajs-dialog {
+  max-width: 50%;
+  min-height: 137px;
+  background-color: #F4F4F4;
+  border: 1px solid #DDD;
+  -webkit-box-shadow: none;
+          box-shadow: none;
+  border-radius: 5px;
+}
+.alertify .ajs-header {
+  padding: 1.5rem 2rem;
+  border-bottom: none;
+  border-radius: 5px 5px 0 0;
+  color: #555;
+  background-color: #fff;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 1.6em;
+  font-weight: 700;
+}
+.alertify .ajs-body {
+  font-family: 'Roboto', sans-serif;
+  color: #555;
+}
+.alertify .ajs-body .ajs-content .ajs-input {
+  width: 100%;
+  margin: 0;
+  padding: 0.65em 1em;
+  font-size: 1em;
+  background-color: #FFF;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  outline: 0;
+  color: rgba(0, 0, 0, 0.7);
+  border-radius: 0.3125em;
+  -webkit-transition: background-color 0.3s ease-out, border-color 0.2s ease, -webkit-box-shadow 0.2s ease;
+  transition: background-color 0.3s ease-out, border-color 0.2s ease, -webkit-box-shadow 0.2s ease;
+  transition: background-color 0.3s ease-out, box-shadow 0.2s ease, border-color 0.2s ease;
+  transition: background-color 0.3s ease-out, box-shadow 0.2s ease, border-color 0.2s ease, -webkit-box-shadow 0.2s ease;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+}
+.alertify .ajs-body .ajs-content .ajs-input:active {
+  border-color: rgba(0, 0, 0, 0.3);
+  background-color: #FAFAFA;
+}
+.alertify .ajs-body .ajs-content .ajs-input:focus {
+  border-color: rgba(0, 0, 0, 0.2);
+  color: rgba(0, 0, 0, 0.85);
+}
+.alertify.ajs-resizable .ajs-content,
+.alertify.ajs-maximized:not(.ajs-resizable) .ajs-content {
+  top: 64px;
+  bottom: 74px;
+}
+.alertify .ajs-footer {
+  background-color: #fff;
+  padding: 1rem 2rem;
+  border-top: none;
+  border-radius: 0 0 5px 5px;
+}
+.alertify-notifier .ajs-message {
+  background: rgba(255, 255, 255, 0.95);
+  color: #000;
+  text-align: center;
+  border: solid 1px #ddd;
+  border-radius: 2px;
+}
+.alertify-notifier .ajs-message.ajs-success {
+  color: #fff;
+  background: rgba(91, 189, 114, 0.95);
+  text-shadow: 1px -1px 0 rgba(0, 0, 0, 0.5);
+}
+.alertify-notifier .ajs-message.ajs-error {
+  color: #fff;
+  background: rgba(217, 92, 92, 0.95);
+  text-shadow: 1px -1px 0 rgba(0, 0, 0, 0.5);
+}
+.alertify-notifier .ajs-message.ajs-warning {
+  background: rgba(252, 248, 215, 0.95);
+  border-color: #999;
+}

sample/prod/talk/bundle/alertify-1.14.0/css/themes/semantic.rtl.min.css

@@ -0,0 +1,6 @@
+/**
+ * alertifyjs 1.14.0 http://alertifyjs.com
+ * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
+ * Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) 
+ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
+.alertify .ajs-dimmer{background-color:rgba(0,0,0,.85);opacity:1}.alertify .ajs-dialog{max-width:50%;min-height:137px;background-color:#f4f4f4;border:1px solid #ddd;-webkit-box-shadow:none;box-shadow:none;border-radius:5px}.alertify .ajs-header{padding:1.5rem 2rem;border-bottom:none;border-radius:5px 5px 0 0;color:#555;background-color:#fff;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:1.6em;font-weight:700}.alertify .ajs-body{font-family:Roboto,sans-serif;color:#555}.alertify .ajs-body .ajs-content .ajs-input{width:100%;margin:0;padding:.65em 1em;font-size:1em;background-color:#fff;border:1px solid rgba(0,0,0,.15);outline:0;color:rgba(0,0,0,.7);border-radius:.3125em;-webkit-transition:background-color .3s ease-out,border-color .2s ease,-webkit-box-shadow .2s ease;transition:background-color .3s ease-out,border-color .2s ease,-webkit-box-shadow .2s ease;transition:background-color .3s ease-out,box-shadow .2s ease,border-color .2s ease;transition:background-color .3s ease-out,box-shadow .2s ease,border-color .2s ease,-webkit-box-shadow .2s ease;-webkit-box-sizing:border-box;box-sizing:border-box}.alertify .ajs-body .ajs-content .ajs-input:active{border-color:rgba(0,0,0,.3);background-color:#fafafa}.alertify .ajs-body .ajs-content .ajs-input:focus{border-color:rgba(0,0,0,.2);color:rgba(0,0,0,.85)}.alertify.ajs-maximized:not(.ajs-resizable) .ajs-content,.alertify.ajs-resizable .ajs-content{top:64px;bottom:74px}.alertify .ajs-footer{background-color:#fff;padding:1rem 2rem;border-top:none;border-radius:0 0 5px 5px}.alertify-notifier .ajs-message{background:rgba(255,255,255,.95);color:#000;text-align:center;border:solid 1px #ddd;border-radius:2px}.alertify-notifier .ajs-message.ajs-success{color:#fff;background:rgba(91,189,114,.95);text-shadow:1px -1px 0 rgba(0,0,0,.5)}.alertify-notifier .ajs-message.ajs-error{color:#fff;background:rgba(217,92,92,.95);text-shadow:1px -1px 0 rgba(0,0,0,.5)}.alertify-notifier .ajs-message.ajs-warning{background:rgba(252,248,215,.95);border-color:#999}

sample/prod/talk/bundle/awesome-notifications-3.1.1/constants.js

@@ -0,0 +1,49 @@
+const libName = "awn"
+const prefix = {
+  popup: `${libName}-popup`,
+  toast: `${libName}-toast`,
+  btn: `${libName}-btn`,
+  confirm: `${libName}-confirm`
+}
+
+// Constants for toasts
+export const tConsts = {
+  prefix: prefix.toast,
+  klass: {
+    label: `${prefix.toast}-label`,
+    content: `${prefix.toast}-content`,
+    icon: `${prefix.toast}-icon`,
+    progressBar: `${prefix.toast}-progress-bar`,
+    progressBarPause: `${prefix.toast}-progress-bar-paused`
+  },
+  ids: {
+    container: `${prefix.toast}-container`
+  }
+}
+
+// Constants for popups
+export const mConsts = {
+  prefix: prefix.popup,
+  klass: {
+    buttons: `${libName}-buttons`,
+    button: prefix.btn,
+    successBtn: `${prefix.btn}-success`,
+    cancelBtn: `${prefix.btn}-cancel`,
+    title: `${prefix.popup}-title`,
+    body: `${prefix.popup}-body`,
+    content: `${prefix.popup}-content`,
+    dotAnimation: `${prefix.popup}-loading-dots`
+  },
+  ids: {
+    wrapper: `${prefix.popup}-wrapper`,
+    confirmOk: `${prefix.confirm}-ok`,
+    confirmCancel: `${prefix.confirm}-cancel`
+  }
+}
+
+export const eConsts = {
+  klass: {
+    hiding: `${libName}-hiding`
+  },
+  lib: libName
+}

sample/prod/talk/bundle/awesome-notifications-3.1.1/elem.js

@@ -0,0 +1,75 @@
+import {
+    eConsts
+} from "./constants.js"
+import {global} from '../../js/module/variable.js'
+
+export default class {
+    constructor(parent, id, klass, style, options) {
+        this.newNode = document.createElement('div')
+        if (id) this.newNode.id = id
+        if (klass) this.newNode.className = klass
+        if (style) this.newNode.style.cssText = style
+        this.parent = parent
+        this.options = options
+    }
+    beforeInsert() {}
+    afterInsert() {}
+    insert() {
+        this.beforeInsert()
+        this.el = this.parent.appendChild(this.newNode)
+        this.afterInsert()
+        return this
+    }
+
+    replace(el) {
+        if (!this.getElement()) return
+        return this.beforeDelete().then(() => {
+            this.updateType(el.type)
+            this.parent.replaceChild(el.newNode, this.el)
+            this.el = this.getElement(el.newNode)
+            this.afterInsert()
+            return this
+        })
+    }
+
+    beforeDelete(el = this.el) {
+        let timeLeft = 0
+        if (this.start) {
+            timeLeft = this.options.minDurations[this.type] + this.start - Date.now()
+            if (timeLeft < 0) timeLeft = 0
+        }
+
+        return new Promise(resolve => {
+            setTimeout(() => {
+                el.classList.add(eConsts.klass.hiding)
+                setTimeout(resolve, this.options.animationDuration)
+            }, timeLeft)
+        })
+    }
+
+    delete(el = this.el) {
+        if (!this.getElement(el)) return null
+        return this.beforeDelete(el).then(() => {
+            el.remove()
+            this.afterDelete()
+        })
+    }
+    afterDelete() {}
+
+    getElement(el = this.el) {
+        if (!el) return null
+        return global.shadowRoot.getElementById(el.id)
+    }
+
+    addEvent(name, func) {
+        this.el.addEventListener(name, func)
+    }
+
+    toggleClass(klass) {
+        this.el.classList.toggle(klass)
+    }
+    updateType(type) {
+        this.type = type
+        this.duration = this.options.duration(this.type)
+    }
+}

sample/prod/talk/bundle/awesome-notifications-3.1.1/index.js

@@ -0,0 +1,107 @@
+import Options from "./options.js"
+import Toast from "./toast.js"
+import Popup from "./popup.js"
+import Elem from "./elem.js"
+import {global} from '../../js/module/variable.js'
+
+import {
+  tConsts
+} from "./constants.js"
+
+export default class Notifier {
+  constructor(options = {}) {
+    this.options = new Options(options)
+  }
+
+  tip(msg, options) {
+    return this._addToast(msg, "tip", options).el
+  }
+
+  info(msg, options) {
+    return this._addToast(msg, "info", options).el
+  }
+
+  success(msg, options) {
+    return this._addToast(msg, "success", options).el
+  }
+
+  warning(msg, options) {
+    return this._addToast(msg, "warning", options).el
+  }
+
+  alert(msg, options) {
+    return this._addToast(msg, "alert", options).el
+  }
+
+  async (promise, onResolve, onReject, msg, options) {
+    let asyncToast = this._addToast(msg, "async", options)
+    return this._afterAsync(promise, onResolve, onReject, options, asyncToast)
+  }
+
+  confirm(msg, onOk, onCancel, options) {
+    return this._addPopup(msg, "confirm", options, onOk, onCancel)
+  }
+
+  asyncBlock(promise, onResolve, onReject, msg, options) {
+    let asyncBlock = this._addPopup(msg, "async-block", options)
+    return this._afterAsync(promise, onResolve, onReject, options, asyncBlock)
+  }
+
+  modal(msg, className, options) {
+    return this._addPopup(msg, className, options)
+  }
+
+  closeToasts() {
+    let c = this.container
+    while (c.firstChild) {
+      c.removeChild(c.firstChild)
+    }
+  }
+
+  // Tools
+  _addPopup(msg, className, options, onOk, onCancel) {
+    return new Popup(msg, className, this.options.override(options), onOk, onCancel)
+  }
+
+  _addToast(msg, type, options, old) {
+    options = this.options.override(options)
+    let newToast = new Toast(msg, type, options, this.container)
+    if (old) {
+      if (old instanceof Popup) return old.delete().then(() => newToast.insert())
+      let i = old.replace(newToast)
+      return i
+    }
+    return newToast.insert()
+  }
+
+  _afterAsync(promise, onResolve, onReject, options, oldElement) {
+    return promise.then(
+      this._responseHandler(onResolve, "success", options, oldElement),
+      this._responseHandler(onReject, "alert", options, oldElement)
+    )
+  }
+
+  _responseHandler(payload, toastName, options, oldElement) {
+    return result => {
+      switch (typeof payload) {
+        case 'undefined':
+        case 'string':
+          let msg = toastName === 'alert' ? payload || result : payload
+          this._addToast(msg, toastName, options, oldElement)
+          break
+        default:
+          oldElement.delete().then(() => {
+            if (payload) payload(result)
+          })
+      }
+    }
+  }
+
+  _createContainer() {
+    return new Elem(global.shadowRoot, tConsts.ids.container, `awn-${this.options.position}`).insert().el
+  }
+
+  get container() {
+    return global.shadowRoot.getElementById(tConsts.ids.container) || this._createContainer()
+  }
+}

sample/prod/talk/bundle/awesome-notifications-3.1.1/index.var.js

@@ -0,0 +1 @@
+module.exports = require("./index.js").default

sample/prod/talk/bundle/awesome-notifications-3.1.1/options.js

@@ -0,0 +1,129 @@
+const defaults = {
+  maxNotifications: 10,
+  animationDuration: 300,
+  position: "bottom-right",
+  labels: {
+    tip: "Tip",
+    info: "Info",
+    success: "Success",
+    warning: "Attention",
+    alert: "Error",
+    async: "Loading",
+    confirm: "Confirmation required",
+    confirmOk: "OK",
+    confirmCancel: "Cancel"
+  },
+  icons: {
+    tip: "question-circle",
+    info: "info-circle",
+    success: "check-circle",
+    warning: "exclamation-circle",
+    alert: "exclamation-triangle",
+    async: "cog fa-spin",
+    confirm: "exclamation-triangle",
+    prefix: "<i class='fa fas fa-fw fa-",
+    suffix: "'></i>",
+    enabled: true
+  },
+  replacements: {
+    tip: null,
+    info: null,
+    success: null,
+    warning: null,
+    alert: null,
+    async: null,
+    "async-block": null,
+    modal: null,
+    confirm: null,
+    general: {
+      "<script>": "",
+      "</script>": ""
+    }
+  },
+  messages: {
+    tip: "",
+    info: "",
+    success: "Action has been succeeded",
+    warning: "",
+    alert: "Action has been failed",
+    confirm: "This action can't be undone. Continue?",
+    async: "Please, wait...",
+    "async-block": "Loading"
+  },
+  formatError(err) {
+    if (err.response) {
+      if (!err.response.data) return '500 API Server Error'
+      if (err.response.data.errors) {
+        return err.response.data.errors.map(o => o.detail).join('<br>')
+      }
+      if (err.response.statusText) {
+        return `${err.response.status} ${err.response.statusText}: ${err.response.data}`
+      }
+    }
+    if (err.message) return err.message
+    return err
+  },
+  durations: {
+    global: 5000,
+    success: null,
+    info: null,
+    tip: null,
+    warning: null,
+    alert: null
+  },
+  minDurations: {
+    async: 1000,
+    "async-block": 1000
+  },
+}
+export default class Options {
+  constructor(options = {}, global = defaults) {
+    Object.assign(this, this.defaultsDeep(global, options))
+  }
+
+  icon(type) {
+    if (this.icons.enabled) return `${this.icons.prefix}${this.icons[type]}${this.icons.suffix}`
+    return ''
+  }
+
+  label(type) {
+    return this.labels[type]
+  }
+
+  duration(type) {
+    let duration = this.durations[type]
+    return duration === null ? this.durations.global : duration
+  }
+
+  toSecs(value) {
+    return `${value / 1000}s`
+  }
+
+  applyReplacements(str, type) {
+    if (!str) return this.messages[type] || ""
+    for (const n of ['general', type]) {
+      if (!this.replacements[n]) continue
+      for (const k in this.replacements[n]) {
+        str = str.replace(k, this.replacements[n][k])
+      }
+    }
+    return str
+  }
+
+  override(options) {
+    if (options) return new Options(options, this)
+    return this
+  }
+
+  defaultsDeep(defaults, overrides) {
+    let result = {}
+    for (const k in defaults) {
+      if (overrides.hasOwnProperty(k)) {
+        result[k] = typeof defaults[k] === "object" && defaults[k] !== null ? this.defaultsDeep(defaults[k], overrides[k]) : overrides[k]
+      } else {
+        result[k] = defaults[k]
+      }
+    }
+    return result
+  }
+}

sample/prod/talk/bundle/awesome-notifications-3.1.1/popup.js

@@ -0,0 +1,86 @@
+import Elem from "./elem.js"
+import {
+  mConsts
+} from "./constants.js"
+import {global} from '../../js/module/variable.js'
+
+export default class extends Elem {
+  constructor(msg, type = 'modal', options, onOk, onCancel) {
+    let animationDuration = `animation-duration: ${options.toSecs(options.animationDuration)};`
+    super(document.body, mConsts.ids.wrapper, null, animationDuration, options)
+    this[mConsts.ids.confirmOk] = onOk
+    this[mConsts.ids.confirmCancel] = onCancel
+    this.className = `${mConsts.prefix}-${type}`
+    if (!['confirm', 'async-block', 'modal'].includes(type)) type = 'modal'
+    this.updateType(type)
+    this.setInnerHtml(msg)
+    this.insert()
+  }
+
+  setInnerHtml(html) {
+    let innerHTML = this.options.applyReplacements(html, this.type)
+    switch (this.type) {
+      case "confirm":
+        let buttons = [`<button class='${mConsts.klass.button} ${mConsts.klass.successBtn}'id='${mConsts.ids.confirmOk}'>${this.options.labels.confirmOk}</button>`]
+        if (this[mConsts.ids.confirmCancel] !== false) {
+          buttons.push(`<button class='${mConsts.klass.button} ${mConsts.klass.cancelBtn}'id='${mConsts.ids.confirmCancel}'>${this.options.labels.confirmCancel}</button>`)
+        }
+        innerHTML = `${this.options.icon(this.type)}<div class='${mConsts.klass.title}'>${this.options.label(this.type)}</div><div class="${mConsts.klass.content}">${innerHTML}</div><div class='${mConsts.klass.buttons} ${mConsts.klass.buttons}-${buttons.length}'>${buttons.join('')}</div>`
+        break
+      case "async-block":
+        innerHTML = `${innerHTML}<div class="${mConsts.klass.dotAnimation}"></div>`
+    }
+    this.newNode.innerHTML = `<div class="${mConsts.klass.body} ${this.className}">${innerHTML}</div>`
+  }
+
+  keyupListener(e) {
+    if (this.type === 'async-block') return e.preventDefault()
+    switch (e.code) {
+      case 'Escape':
+        e.preventDefault()
+        this.delete()
+      case 'Tab':
+        e.preventDefault()
+        if (this.type !== 'confirm' || this[mConsts.ids.confirmCancel] === false) return true
+        let next = this.okBtn
+        if (e.shiftKey) {
+          if (document.activeElement.id == mConsts.ids.confirmOk) next = this.cancelBtn
+        } else if (document.activeElement.id !== mConsts.ids.confirmCancel) next = this.cancelBtn
+        next.focus()
+    }
+  }
+  afterInsert() {
+    this.listener = e => this.keyupListener(e)
+    window.addEventListener("keydown", this.listener)
+    switch (this.type) {
+      case 'async-block':
+        this.start = Date.now()
+        break
+      case 'confirm':
+        this.okBtn.focus()
+        this.addEvent("click", e => {
+          if (e.target.nodeName !== "BUTTON") return false
+          this.delete()
+          if (this[e.target.id]) this[e.target.id]()
+        })
+        break
+      default:
+        document.activeElement.blur()
+        this.addEvent("click", e => {
+          if (e.target.id === this.newNode.id) this.delete()
+        })
+    }
+  }
+
+  afterDelete() {
+    window.removeEventListener("keydown", this.listener)
+  }
+
+  get okBtn() {
+    return document.getElementById(mConsts.ids.confirmOk)
+  }
+
+  get cancelBtn() {
+    return document.getElementById(mConsts.ids.confirmCancel)
+  }
+}

sample/prod/talk/bundle/awesome-notifications-3.1.1/style.css

@@ -0,0 +1,374 @@
+@keyframes awn-fade-in {
+    0% {
+        opacity: 0
+    }
+    to {
+        opacity: 1
+    }
+}
+
+@keyframes awn-fade-out {
+    0% {
+        opacity: 1
+    }
+    to {
+        opacity: 0
+    }
+}
+
+@keyframes awn-slide-right {
+    0% {
+        left: 100%;
+        opacity: 0
+    }
+    to {
+        left: 0;
+        opacity: 1
+    }
+}
+
+@keyframes awn-slide-left {
+    0% {
+        opacity: 0;
+        right: 100%
+    }
+    to {
+        opacity: 1;
+        right: 0
+    }
+}
+
+@keyframes awn-bar {
+    0% {
+        right: 100%
+    }
+    to {
+        right: 0
+    }
+}
+
+.awn-popup-loading-dots, .awn-popup-loading-dots:after, .awn-popup-loading-dots:before {
+    animation-fill-mode: both;
+    animation: awn-loading-dots 1s ease-in-out infinite;
+    background: #fff;
+    border-radius: 50%;
+    height: 6px;
+    width: 6px
+}
+
+.awn-popup-loading-dots {
+    animation-delay: -.16s;
+    color: #fff;
+    display: inline-block;
+    margin-left: 24px;
+    position: relative
+}
+
+.awn-popup-loading-dots:after, .awn-popup-loading-dots:before {
+    content: "";
+    position: absolute;
+    top: 0
+}
+
+.awn-popup-loading-dots:before {
+    animation-delay: -.32s;
+    left: -16px
+}
+
+.awn-popup-loading-dots:after {
+    left: 16px
+}
+
+@keyframes awn-loading-dots {
+    0%, 80%, to {
+        box-shadow: 0 0 0 0
+    }
+    40% {
+        box-shadow: 0 0 0 2px
+    }
+}
+
+#awn-popup-wrapper {
+    align-items: center;
+    animation-fill-mode: both;
+    animation-name: awn-fade-in;
+    animation-timing-function: ease-out;
+    background: rgba(0, 0, 0, .7);
+    bottom: 0;
+    display: flex;
+    justify-content: center;
+    left: 0;
+    opacity: 0;
+    position: fixed;
+    right: 0;
+    top: 0;
+    z-index: 99999
+}
+
+#awn-popup-wrapper.awn-hiding {
+    animation-name: awn-fade-out
+}
+
+#awn-popup-wrapper .awn-popup-body {
+    background: #fff;
+    border-radius: 6px;
+    font-size: 14px;
+    max-width: 500px;
+    min-width: 320px;
+    padding: 24px;
+    position: relative;
+    word-break: break-word
+}
+
+#awn-popup-wrapper .awn-popup-body.awn-popup-confirm {
+    align-items: center;
+    display: flex;
+    flex-direction: column
+}
+
+#awn-popup-wrapper .awn-popup-body.awn-popup-confirm .fa {
+    color: #c26700;
+    font-size: 44px
+}
+
+#awn-popup-wrapper .awn-popup-body.awn-popup-async-block {
+    background: transparent;
+    color: #fff;
+    font-size: 32px;
+    font-weight: 700;
+    text-align: center
+}
+
+#awn-popup-wrapper .awn-popup-title {
+    font-size: 14px;
+    font-weight: 700;
+    margin-top: 8px;
+    text-transform: uppercase
+}
+
+#awn-popup-wrapper .awn-buttons {
+    display: flex;
+    justify-content: space-between;
+    margin-top: 24px;
+    width: 100%
+}
+
+#awn-popup-wrapper .awn-buttons .awn-btn {
+    border: 0;
+    border-radius: 4px;
+    color: #fff;
+    font-size: 14px;
+    font-weight: 700;
+    line-height: 32px;
+    transition: background .2s linear;
+    width: 45%
+}
+
+#awn-popup-wrapper .awn-buttons-1 .awn-btn {
+    width: 100%
+}
+
+#awn-popup-wrapper .awn-buttons .awn-btn-success {
+    background: #40871d
+}
+
+#awn-popup-wrapper .awn-buttons .awn-btn-success:hover {
+    background: #367218
+}
+
+#awn-popup-wrapper .awn-buttons .awn-btn-cancel {
+    background: #1c76a6
+}
+
+#awn-popup-wrapper .awn-buttons .awn-btn-cancel:hover {
+    background: #186690
+}
+
+#awn-toast-container {
+    bottom: 24px;
+    box-sizing: border-box;
+    position: fixed;
+    right: 24px;
+    z-index: 99998
+}
+
+#awn-toast-container.awn-top-left, #awn-toast-container.awn-top-right {
+    bottom: auto;
+    top: 24px
+}
+
+#awn-toast-container.awn-top-left .awn-toast:first-child, #awn-toast-container.awn-top-right .awn-toast:first-child {
+    margin-top: 16px
+}
+
+#awn-toast-container.awn-bottom-left, #awn-toast-container.awn-top-left {
+    left: 24px;
+    right: auto
+}
+
+#awn-toast-container.awn-bottom-left .awn-toast, #awn-toast-container.awn-top-left .awn-toast {
+    animation-name: awn-slide-left;
+    right: 100%
+}
+
+#awn-toast-container.awn-bottom-left .awn-toast.awn-hiding, #awn-toast-container.awn-top-left .awn-toast.awn-hiding {
+    right: 0
+}
+
+#awn-toast-container.awn-bottom-right .awn-toast, #awn-toast-container.awn-top-right .awn-toast {
+    animation-name: awn-slide-right;
+    left: 100%
+}
+
+#awn-toast-container.awn-bottom-right .awn-toast.awn-hiding, #awn-toast-container.awn-top-right .awn-toast.awn-hiding {
+    left: 0
+}
+
+.awn-toast {
+    animation-fill-mode: both;
+    animation-timing-function: linear;
+    background: #ebebeb;
+    border-radius: 6px;
+    color: gray;
+    cursor: pointer;
+    font-size: 14px;
+    margin-top: 16px;
+    opacity: 0;
+    overflow: hidden;
+    position: relative;
+    width: 320px
+}
+
+.awn-toast-content {
+    word-break: break-word
+}
+
+.awn-toast-label {
+    color: gray;
+    display: block;
+    font-size: 18px;
+    text-transform: uppercase
+}
+
+.awn-toast-icon {
+    align-items: center;
+    bottom: 0;
+    display: flex;
+    justify-content: flex-end;
+    position: absolute;
+    right: 16px;
+    top: 6px
+}
+
+.awn-toast-icon .fa {
+    color: gray;
+    font-size: 44px
+}
+
+.awn-toast-wrapper {
+    border: 2px solid #d1d1d1;
+    border-radius: 6px;
+    padding: 22px 88px 16px 16px
+}
+
+.awn-toast-progress-bar {
+    height: 6px;
+    left: 0;
+    position: absolute;
+    right: 0;
+    top: 0
+}
+
+.awn-toast-progress-bar:after {
+    animation-duration: inherit;
+    animation-fill-mode: both;
+    animation-name: awn-bar;
+    animation-timing-function: linear;
+    background: gray;
+    content: " ";
+    height: 6px;
+    position: absolute;
+    right: 100%;
+    top: 0;
+    width: 100%
+}
+
+.awn-toast.awn-toast-progress-bar-paused .awn-toast-progress-bar:after {
+    animation-play-state: paused
+}
+
+.awn-toast.awn-hiding {
+    animation-name: awn-fade-out !important
+}
+
+.awn-toast.awn-toast-success {
+    background: #dff8d3;
+    color: #40871d
+}
+
+.awn-toast.awn-toast-success .awn-toast-wrapper {
+    border-color: #a7d590
+}
+
+.awn-toast.awn-toast-success .fa, .awn-toast.awn-toast-success b {
+    color: #40871d
+}
+
+.awn-toast.awn-toast-success .awn-toast-progress-bar:after {
+    background: #40871d
+}
+
+.awn-toast.awn-toast-info {
+    background: #d3ebf8;
+    color: #1c76a6
+}
+
+.awn-toast.awn-toast-info .awn-toast-wrapper {
+    border-color: #9fd3ef
+}
+
+.awn-toast.awn-toast-info .fa, .awn-toast.awn-toast-info b {
+    color: #1c76a6
+}
+
+.awn-toast.awn-toast-info .awn-toast-progress-bar:after {
+    background: #1c76a6
+}
+
+.awn-toast.awn-toast-alert {
+    background: #f8d5d3;
+    color: #a92019
+}
+
+.awn-toast.awn-toast-alert .awn-toast-wrapper {
+    border-color: #f0a29d
+}
+
+.awn-toast.awn-toast-alert .fa, .awn-toast.awn-toast-alert b {
+    color: #a92019
+}
+
+.awn-toast.awn-toast-alert .awn-toast-progress-bar:after {
+    background: #a92019
+}
+
+.awn-toast.awn-toast-warning {
+    background: #ffe7cc;
+    color: #c26700
+}
+
+.awn-toast.awn-toast-warning .awn-toast-wrapper {
+    border-color: #ffc480
+}
+
+.awn-toast.awn-toast-warning .fa, .awn-toast.awn-toast-warning b {
+    color: #c26700
+}
+
+.awn-toast.awn-toast-warning .awn-toast-progress-bar:after {
+    background: #c26700
+}
+
+[class^=awn-] {
+    box-sizing: border-box
+}

sample/prod/talk/bundle/awesome-notifications-3.1.1/styles/animations.scss

@@ -0,0 +1,101 @@
+@keyframes awn-fade-in {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes awn-fade-out {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+  }
+}
+
+@keyframes awn-slide-right {
+  from {
+    opacity: 0;
+    left: 100%;
+  }
+
+  to {
+    opacity: 1;
+    left: 0;
+  }
+}
+
+@keyframes awn-slide-left {
+  from {
+    opacity: 0;
+    right: 100%;
+  }
+
+  to {
+    opacity: 1;
+    right: 0;
+  }
+}
+
+@keyframes awn-bar {
+  from {
+    right: 100%;
+  }
+
+  to {
+    right: 0;
+  }
+}
+
+.awn-popup-loading-dots,
+.awn-popup-loading-dots:before,
+.awn-popup-loading-dots:after {
+  border-radius: 50%;
+  width: 6px;
+  height: 6px;
+  animation-fill-mode: both;
+  background: #fff;
+  animation: awn-loading-dots 1s infinite ease-in-out;
+}
+
+.awn-popup-loading-dots {
+  position: relative;
+  margin-left: 24px;
+  display: inline-block;
+  color: #fff;
+  animation-delay: -0.16s;
+}
+
+.awn-popup-loading-dots:before,
+.awn-popup-loading-dots:after {
+  content: "";
+  position: absolute;
+  top: 0;
+}
+
+.awn-popup-loading-dots:before {
+  left: -16px;
+  animation-delay: -0.32s;
+}
+
+.awn-popup-loading-dots:after {
+  left: 16px;
+}
+
+@keyframes awn-loading-dots {
+
+  0%,
+  80%,
+  100% {
+    box-shadow: 0 0 0 0;
+  }
+
+  40% {
+    box-shadow: 0 0 0 2px;
+  }
+}

sample/prod/talk/bundle/awesome-notifications-3.1.1/styles/popups.scss

@@ -0,0 +1,97 @@
+#awn-popup-wrapper {
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: $awn-popup-wrapper-bg;
+  z-index: $awn-popup-wrapper-z-index;
+  opacity: 0;
+  animation-name: $awn-popup-show-animation;
+  animation-timing-function: $awn-popup-animation-timing;
+  animation-fill-mode: both;
+
+  &.awn-hiding {
+    animation-name: $awn-popup-hide-animation;
+  }
+
+  .awn-popup-body {
+    position: relative;
+    border-radius: $awn-popup-border-radius;
+    word-break: break-word;
+    background: $awn-popup-bg;
+    padding: $awn-popup-padding;
+    min-width: $awn-popup-min-width;
+    font-size: $awn-popup-font-size;
+    max-width: $awn-popup-max-width;
+
+    &.awn-popup-confirm {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+
+      .fa {
+        font-size: $awn-popup-icon-size;
+        color: $awn-warning-color;
+      }
+    }
+
+    &.awn-popup-async-block {
+      background: transparent;
+      font-size: 32px;
+      font-weight: bold;
+      color: #fff;
+      text-align: center;
+    }
+  }
+
+  .awn-popup-title {
+    font-size: $awn-popup-font-size;
+    font-weight: bold;
+    text-transform: uppercase;
+    margin-top: 8px;
+  }
+
+  .awn-buttons {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    margin-top: $awn-popup-padding;
+
+    .awn-btn {
+      border-radius: $awn-popup-btn-border-radius;
+      border: 0;
+      font-weight: bold;
+      transition: background 0.2s linear;
+      font-size: $awn-popup-font-size;
+      width: 45%;
+      line-height: $awn-popup-btn-height;
+      color: $awn-popup-btn-color;
+    }
+
+    &-1 {
+      .awn-btn {
+        width: 100%;
+      }
+    }
+
+    .awn-btn-success {
+      background: $awn-success-color;
+
+      &:hover {
+        background: darken($awn-success-color, 5%);
+      }
+    }
+
+    .awn-btn-cancel {
+      background: $awn-info-color;
+
+      &:hover {
+        background: darken($awn-info-color, 5%);
+      }
+    }
+  }
+}

sample/prod/talk/bundle/awesome-notifications-3.1.1/styles/style.scss

@@ -0,0 +1,8 @@
+@import "variables";
+@import "animations";
+@import "popups";
+@import "toasts";
+
+[class^="awn-"] {
+  box-sizing: border-box;
+}

sample/prod/talk/bundle/awesome-notifications-3.1.1/styles/toasts.scss

@@ -0,0 +1,194 @@
+#awn-toast-container {
+  position: fixed;
+  z-index: $awn-container-z-index;
+  bottom: $awn-container-padding;
+  right: $awn-container-padding;
+  box-sizing: border-box;
+
+  &.awn-top-left,
+  &.awn-top-right {
+    top: $awn-container-padding;
+    bottom: auto;
+
+    .awn-toast:first-child {
+      margin-top: $awn-toast-margin;
+    }
+  }
+
+  &.awn-top-left,
+  &.awn-bottom-left {
+    left: $awn-container-padding;
+    right: auto;
+
+    .awn-toast {
+      right: 100%;
+      animation-name: $awn-toast-left-show-animation;
+
+      &.awn-hiding {
+        right: 0;
+      }
+    }
+  }
+
+  &.awn-top-right,
+  &.awn-bottom-right {
+    .awn-toast {
+      left: 100%;
+      animation-name: $awn-toast-right-show-animation;
+
+      &.awn-hiding {
+        left: 0;
+      }
+    }
+  }
+}
+
+.awn-toast {
+  position: relative;
+  cursor: pointer;
+  overflow: hidden;
+  opacity: 0;
+  width: $awn-toast-width;
+  background: $awn-primary-background;
+  margin-top: $awn-toast-margin;
+  border-radius: $awn-toast-border-radius;
+  color: $awn-primary-color;
+  font-size: $awn-toast-font-size;
+  animation-timing-function: $awn-toast-animation-timing;
+  animation-fill-mode: both;
+
+  &-content {
+    word-break: break-word;
+  }
+
+  &-label {
+    display: block;
+    text-transform: uppercase;
+    color: $awn-primary-color;
+    font-size: $awn-toast-title-font-size;
+  }
+
+  &-icon {
+    position: absolute;
+    right: $awn-toast-padding;
+    top: $awn-progress-bar-height;
+    bottom: 0;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+
+    .fa {
+      font-size: $awn-toast-icon-size;
+      color: $awn-primary-color;
+    }
+  }
+
+  &-wrapper {
+    padding: $awn-progress-bar-height + $awn-toast-padding 88px $awn-toast-padding $awn-toast-padding;
+
+    border: $awn-border;
+    border-radius: $awn-toast-border-radius;
+  }
+
+  &-progress-bar {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: $awn-progress-bar-height;
+
+    &:after {
+      content: " ";
+      background: $awn-primary-color;
+      position: absolute;
+      width: 100%;
+      right: 100%;
+      top: 0;
+      height: $awn-progress-bar-height;
+      animation-name: awn-bar;
+      animation-duration: inherit;
+      animation-timing-function: linear;
+      animation-fill-mode: both;
+    }
+  }
+
+  &.awn-toast-progress-bar-paused .awn-toast-progress-bar:after {
+    animation-play-state: paused;
+  }
+
+  &.awn-hiding {
+    animation-name: $awn-toast-hide-animation !important;
+  }
+
+  &.awn-toast-success {
+    background: $awn-success-background;
+    color: $awn-success-color;
+
+    .awn-toast-wrapper {
+      border-color: $awn-success-border-color;
+    }
+
+    b,
+    .fa {
+      color: $awn-success-color;
+    }
+
+    .awn-toast-progress-bar:after {
+      background: $awn-success-color;
+    }
+  }
+
+  &.awn-toast-info {
+    background: $awn-info-background;
+    color: $awn-info-color;
+
+    .awn-toast-wrapper {
+      border-color: $awn-info-border-color;
+    }
+
+    b,
+    .fa {
+      color: $awn-info-color;
+    }
+
+    .awn-toast-progress-bar:after {
+      background: $awn-info-color;
+    }
+  }
+
+  &.awn-toast-alert {
+    background: $awn-alert-background;
+    color: $awn-alert-color;
+
+    .awn-toast-wrapper {
+      border-color: $awn-alert-border-color;
+    }
+
+    b,
+    .fa {
+      color: $awn-alert-color;
+    }
+
+    .awn-toast-progress-bar:after {
+      background: $awn-alert-color;
+    }
+  }
+
+  &.awn-toast-warning {
+    background: $awn-warning-background;
+    color: $awn-warning-color;
+
+    .awn-toast-wrapper {
+      border-color: $awn-warning-border-color;
+    }
+
+    b,
+    .fa {
+      color: $awn-warning-color;
+    }
+
+    .awn-toast-progress-bar:after {
+      background: $awn-warning-color;
+    }
+  }
+}

sample/prod/talk/bundle/awesome-notifications-3.1.1/styles/variables.scss

@@ -0,0 +1,63 @@
+// Container
+$awn-container-z-index: 99998 !default;
+$awn-container-padding: 24px !default;
+
+// Colors
+$awn-primary-color: hsl(0, 0%, 50%) !default;
+$awn-primary-background: hsl(0, 0%, 92%) !default;
+$awn-primary-border-color: hsl(0, 0%, 82%) !default;
+
+$awn-success-color: hsl(100, 65%, 32%) !default;
+$awn-success-background: hsl(100, 74%, 90%) !default;
+$awn-success-border-color: hsl(100, 45%, 70%) !default;
+
+$awn-info-color: hsl(201, 71%, 38%) !default;
+$awn-info-background: hsl(201, 71%, 90%) !default;
+$awn-info-border-color: hsl(201, 71%, 78%) !default;
+
+$awn-alert-color: hsl(3, 74%, 38%) !default;
+$awn-alert-background: hsl(3, 74%, 90%) !default;
+$awn-alert-border-color: hsl(3, 74%, 78%) !default;
+
+$awn-warning-color: hsl(32, 100%, 38%) !default;
+$awn-warning-background: hsl(32, 100%, 90%) !default;
+$awn-warning-border-color: hsl(32, 100%, 75%) !default;
+
+// Notifications
+$awn-toast-width: 320px !default;
+$awn-toast-padding: 16px !default;
+$awn-toast-margin: 16px !default;
+$awn-toast-border-width: 2px !default;
+$awn-toast-border-style: solid !default;
+$awn-toast-border-color: $awn-primary-border-color !default;
+$awn-toast-border-radius: 6px !default;
+$awn-border: $awn-toast-border-width $awn-toast-border-style
+  $awn-toast-border-color !default;
+$awn-progress-bar-height: 6px !default;
+$awn-toast-font-size: 14px !default;
+$awn-toast-title-font-size: 18px !default;
+$awn-toast-icon-size: 44px !default;
+
+// Popups
+$awn-popup-wrapper-bg: rgba(0, 0, 0, 0.7) !default;
+$awn-popup-wrapper-z-index: 99999 !default;
+$awn-popup-bg: #fff !default;
+$awn-popup-min-width: 320px !default;
+$awn-popup-max-width: 500px !default;
+$awn-popup-font-size: 14px !default;
+$awn-popup-icon-size: 44px !default;
+$awn-popup-padding: 24px !default;
+$awn-popup-border-radius: 6px !default;
+$awn-popup-btn-height: 32px !default;
+$awn-popup-btn-color: #fff !default;
+$awn-popup-btn-border-radius: 4px !default;
+
+// Animations
+$awn-popup-show-animation: awn-fade-in;
+$awn-popup-hide-animation: awn-fade-out;
+$awn-popup-animation-timing: ease-out;
+
+$awn-toast-left-show-animation: awn-slide-left;
+$awn-toast-right-show-animation: awn-slide-right;
+$awn-toast-hide-animation: awn-fade-out;
+$awn-toast-animation-timing: linear;

sample/prod/talk/bundle/awesome-notifications-3.1.1/timer.js

@@ -0,0 +1,25 @@
+export default class {
+  constructor(callback, delay) {
+    this.callback = callback
+    this.remaining = delay
+    this.resume()
+  }
+  pause() {
+    this.paused = true
+    window.clearTimeout(this.timerId)
+    this.remaining -= new Date() - this.start
+  }
+  resume() {
+    this.paused = false
+    this.start = new Date()
+    window.clearTimeout(this.timerId)
+    this.timerId = window.setTimeout(() => {
+      window.clearTimeout(this.timerId)
+      this.callback()
+    }, this.remaining)
+  }
+  toggle() {
+    if (this.paused) this.resume()
+    else this.pause()
+  }
+}

sample/prod/talk/bundle/awesome-notifications-3.1.1/toast.js

@@ -0,0 +1,61 @@
+import Elem from "./elem.js"
+import Timer from "./timer.js"
+
+import {
+  tConsts,
+  eConsts
+} from "./constants.js"
+
+export default class extends Elem {
+  constructor(msg, type, options, parent) {
+    super(
+      parent,
+      `${tConsts.prefix}-${Math.floor(Date.now() - Math.random() * 100)}`,
+      `${tConsts.prefix} ${tConsts.prefix}-${type}`,
+      `animation-duration: ${options.toSecs(options.animationDuration)};`,
+      options
+    )
+    this.updateType(type)
+    this.setInnerHtml(msg)
+  }
+
+  setInnerHtml(html) {
+    if (this.type === 'alert' && html) html = this.options.formatError(html)
+    html = this.options.applyReplacements(html, this.type)
+    this.newNode.innerHTML = `<div class="awn-toast-wrapper">${this.progressBar}${this.label}<div class="${tConsts.klass.content}">${html}</div><span class="${tConsts.klass.icon}">${this.options.icon(this.type)}</span></div>`
+  }
+
+  beforeInsert() {
+    if (this.parent.childElementCount >= this.options.maxNotifications) {
+      let elements = Array.from(this.parent.getElementsByClassName(tConsts.prefix))
+      this.delete(elements.find(e => !this.isDeleted(e)))
+    }
+  }
+  afterInsert() {
+    if (this.type == "async") return this.start = Date.now()
+
+    this.addEvent("click", () => this.delete())
+
+    if (this.duration <= 0) return
+    this.timer = new Timer(() => this.delete(), this.duration)
+    for (const e of ["mouseenter", "mouseleave"]) {
+      this.addEvent(e, () => {
+        if (this.isDeleted()) return
+        this.toggleClass(tConsts.klass.progressBarPause)
+        this.timer.toggle()
+      })
+    }
+  }
+
+  isDeleted(el = this.el) {
+    return el.classList.contains(eConsts.klass.hiding)
+  }
+  get progressBar() {
+    if (this.duration <= 0 || this.type === 'async') return ""
+    return `<div class='${tConsts.klass.progressBar}' style="animation-duration:${this.options.toSecs(this.duration)};"></div>`
+  }
+  get label() {
+    return `<b class="${tConsts.klass.label}">${this.options.label(this.type)}</b>`
+  }
+
+}