@sme.up/ketchup 9.2.0 → 9.3.0

package/dist/components/kup-lazy.js

@@ -8,348 +8,348 @@ import { c as componentWrapperId, d as defineCustomElement$2, a as defineCustomE
  */
 var KupLazyProps;
 (function (KupLazyProps) {
-  KupLazyProps["componentName"] = "Sets the tag name of the component to be lazy loaded.";
-  KupLazyProps["customStyle"] = "Custom style of the component.";
-  KupLazyProps["data"] = "Sets the data of the component to be lazy loaded.";
-  KupLazyProps["showPlaceholder"] = "Displays an animated SVG placeholder until the component is loaded.";
+    KupLazyProps["componentName"] = "Sets the tag name of the component to be lazy loaded.";
+    KupLazyProps["customStyle"] = "Custom style of the component.";
+    KupLazyProps["data"] = "Sets the data of the component to be lazy loaded.";
+    KupLazyProps["showPlaceholder"] = "Displays an animated SVG placeholder until the component is loaded.";
 })(KupLazyProps || (KupLazyProps = {}));
 /**
  * Decides when the sub component should be rendered.
  */
 var KupLazyRender;
 (function (KupLazyRender) {
-  KupLazyRender["VIEWPORT"] = "viewport";
-  KupLazyRender["PROPS"] = "props";
-  KupLazyRender["BOTH"] = "both";
+    KupLazyRender["VIEWPORT"] = "viewport";
+    KupLazyRender["PROPS"] = "props";
+    KupLazyRender["BOTH"] = "both";
 })(KupLazyRender || (KupLazyRender = {}));
 
 const kupLazyCss = ":host{--kup_lazy_animation_time:var(--kup-lazy-animation-time, 2s);--kup_lazy_hor_alignment:var(--kup-lazy-hor-alignment, center);--kup_lazy_placeholder_color:var(\n    --kup-lazy-placeholder-color,\n    var(--kup-icon-color)\n  );--kup_lazy_height:var(--kup-lazy-height, 100%);--kup_lazy_ver_alignment:var(--kup-lazy-ver-alignment, center);--kup_lazy_width:var(--kup-lazy-width, 100%);display:block;height:var(--kup_lazy_height);width:var(--kup_lazy_width);position:relative}#kup-component{align-items:var(--kup_lazy_ver_alignment);display:flex;justify-content:var(--kup_lazy_hor_alignment);height:var(--kup_lazy_height);width:var(--kup_lazy_width)}#kup-component>*{height:var(--kup_lazy_height)}#kup-component kup-data-table{min-width:100%}.kup-loaded,.kup-to-be-loaded{height:var(--kup_lazy_height);width:var(--kup_lazy_width)}svg{fill:var(--kup_lazy_placeholder_color);animation:shine ease var(--kup_lazy_animation_time) infinite}@keyframes shine{0%{opacity:0.4}50%{opacity:0.8}100%{opacity:0.4}}:host(.kup-bottom-aligned){--kup-lazy-ver-alignment:flex-end}:host(.kup-left-aligned){--kup-lazy-hor-alignment:flex-start}:host(.kup-right-aligned){--kup-lazy-hor-alignment:flex-end}:host(.kup-top-aligned){--kup-lazy-ver-alignment:flex-start}:host(.kup-to-be-loaded) #kup-component{position:absolute}:host(.kup-to-be-loaded) #kup-component>*{margin:auto}";
 
 const KupLazy$1 = /*@__PURE__*/ proxyCustomElement(class KupLazy extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.kupLazyLoaded = createEvent(this, "kup-lazy-loaded", 6);
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.kupLazyLoaded = createEvent(this, "kup-lazy-loaded", 6);
+        /*-------------------------------------------------*/
+        /*       I n t e r n a l   V a r i a b l e s       */
+        /*-------------------------------------------------*/
+        /**
+         * Instance of the intersection observer.
+         */
+        this.intObserver = null;
+        /**
+         * Instance of the KupManager class.
+         */
+        this.kupManager = kupManagerInstance();
+        this.lazyComponent = null;
+        this.lazyComponentLoaded = false;
+        this.isInViewport = false;
+        this.componentName = null;
+        this.customStyle = '';
+        this.data = null;
+        this.renderMode = KupLazyRender.BOTH;
+        this.showPlaceholder = true;
+    }
     /*-------------------------------------------------*/
-    /*       I n t e r n a l   V a r i a b l e s       */
+    /*           P u b l i c   M e t h o d s           */
     /*-------------------------------------------------*/
     /**
-     * Instance of the intersection observer.
+     * Used to retrieve component's props values.
+     * @param {boolean} descriptions - When provided and true, the result will be the list of props with their description.
+     * @returns {Promise<GenericObject>} List of props as object, each key will be a prop.
      */
-    this.intObserver = null;
+    async getProps(descriptions) {
+        return getProps(this, KupLazyProps, descriptions);
+    }
     /**
-     * Instance of the KupManager class.
+     * Returns the HTMLElement of the component to lazy load.
+     * @returns {HTMLElement} Lazy loaded component.
      */
-    this.kupManager = kupManagerInstance();
-    this.lazyComponent = null;
-    this.lazyComponentLoaded = false;
-    this.isInViewport = false;
-    this.componentName = null;
-    this.customStyle = '';
-    this.data = null;
-    this.renderMode = KupLazyRender.BOTH;
-    this.showPlaceholder = true;
-  }
-  /*-------------------------------------------------*/
-  /*           P u b l i c   M e t h o d s           */
-  /*-------------------------------------------------*/
-  /**
-   * Used to retrieve component's props values.
-   * @param {boolean} descriptions - When provided and true, the result will be the list of props with their description.
-   * @returns {Promise<GenericObject>} List of props as object, each key will be a prop.
-   */
-  async getProps(descriptions) {
-    return getProps(this, KupLazyProps, descriptions);
-  }
-  /**
-   * Returns the HTMLElement of the component to lazy load.
-   * @returns {HTMLElement} Lazy loaded component.
-   */
-  async getComponent() {
-    return this.lazyComponent;
-  }
-  /**
-   * This method is used to trigger a new render of the component.
-   */
-  async refresh() {
-    forceUpdate(this);
-  }
-  /**
-   * Sets the props to the component.
-   * @param {GenericObject} props - Object containing props that will be set to the component.
-   */
-  async setProps(props) {
-    setProps(this, KupLazyProps, props);
-  }
-  /*-------------------------------------------------*/
-  /*           P r i v a t e   M e t h o d s         */
-  /*-------------------------------------------------*/
-  setObserver() {
-    let callback = (entries) => {
-      entries.forEach((entry) => {
-        if (entry.isIntersecting) {
-          this.kupManager.debug.logMessage(this, 'kup-lazy entering the viewport, rendering ' +
-            this.componentName +
-            '.');
-          this.isInViewport = true;
-          this.intObserver.unobserve(this.rootElement);
-        }
-      });
-    };
-    let options = {
-      threshold: 0.25,
-    };
-    this.intObserver = new IntersectionObserver(callback, options);
-  }
-  /*-------------------------------------------------*/
-  /*          L i f e c y c l e   H o o k s          */
-  /*-------------------------------------------------*/
-  componentWillLoad() {
-    this.kupManager.debug.logLoad(this, false);
-    this.kupManager.theme.register(this);
-    this.setObserver();
-  }
-  componentDidLoad() {
-    this.intObserver.observe(this.rootElement);
-    this.kupManager.debug.logLoad(this, true);
-  }
-  componentWillRender() {
-    this.kupManager.debug.logRender(this, false);
-  }
-  componentDidRender() {
-    if (this.lazyComponent && !this.lazyComponentLoaded) {
-      this.lazyComponentLoaded = true;
-      this.kupLazyLoaded.emit({
-        comp: this,
-        id: this.rootElement.id,
-      });
+    async getComponent() {
+        return this.lazyComponent;
+    }
+    /**
+     * This method is used to trigger a new render of the component.
+     */
+    async refresh() {
+        forceUpdate(this);
+    }
+    /**
+     * Sets the props to the component.
+     * @param {GenericObject} props - Object containing props that will be set to the component.
+     */
+    async setProps(props) {
+        setProps(this, KupLazyProps, props);
+    }
+    /*-------------------------------------------------*/
+    /*           P r i v a t e   M e t h o d s         */
+    /*-------------------------------------------------*/
+    setObserver() {
+        let callback = (entries) => {
+            entries.forEach((entry) => {
+                if (entry.isIntersecting) {
+                    this.kupManager.debug.logMessage(this, 'kup-lazy entering the viewport, rendering ' +
+                        this.componentName +
+                        '.');
+                    this.isInViewport = true;
+                    this.intObserver.unobserve(this.rootElement);
+                }
+            });
+        };
+        let options = {
+            threshold: 0.25,
+        };
+        this.intObserver = new IntersectionObserver(callback, options);
+    }
+    /*-------------------------------------------------*/
+    /*          L i f e c y c l e   H o o k s          */
+    /*-------------------------------------------------*/
+    componentWillLoad() {
+        this.kupManager.debug.logLoad(this, false);
+        this.kupManager.theme.register(this);
+        this.setObserver();
     }
-    this.kupManager.debug.logRender(this, true);
-  }
-  render() {
-    let content;
-    let resource;
-    let className = this.componentName;
-    switch (this.componentName) {
-      case 'kup-button':
-        //call_to_action.svg
-        resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M42 6H6c-2.2 0-4 1.8-4 4v28c0 2.2 1.8 4 4 4h36c2.2 0 4-1.8 4-4V10c0-2.2-1.8-4-4-4zm0 32H6v-6h36v6z" })));
-        break;
-      case 'kup-card':
-        //art_track.svg
-        resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M44 26H28v-4h16v4zm0-12H28v4h16v-4zM28 34h16v-4H28v4zm-4-16v12c0 2.2-1.8 4-4 4H8c-2.2 0-4-1.8-4-4V18c0-2.2 1.8-4 4-4h12c2.2 0 4 1.8 4 4zm-3 12l-4.5-6-3.5 4.51-2.5-3.01L7 30h14z" })));
-        break;
-      case 'kup-checkbox':
-        //check_box_outline_blank.svg
-        resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M38 10v28H10V10h28m0-4H10c-2.21 0-4 1.79-4 4v28c0 2.21 1.79 4 4 4h28c2.21 0 4-1.79 4-4V10c0-2.21-1.79-4-4-4z" })));
-        break;
-      case 'kup-chart':
-        //chart-bar.svg
-        resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "100%", height: "100%", viewBox: "0 0 24 24" }, h("path", { d: "M22,21H2V3H4V19H6V10H10V19H12V6H16V19H18V14H22V21Z" })));
-        break;
-      case 'kup-data-table':
-        //table-large.svg
-        resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "100%", height: "100%", viewBox: "0 0 24 24" }, h("path", { d: "M4,3H20A2,2 0 0,1 22,5V20A2,2 0 0,1 20,22H4A2,2 0 0,1 2,20V5A2,2 0 0,1 4,3M4,7V10H8V7H4M10,7V10H14V7H10M20,10V7H16V10H20M4,12V15H8V12H4M4,20H8V17H4V20M10,12V15H14V12H10M10,20H14V17H10V20M20,20V17H16V20H20M20,12H16V15H20V12Z" })));
-        break;
-      case 'kup-image':
-        //photo.svg
-        resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M42 38V10c0-2.21-1.79-4-4-4H10c-2.21 0-4 1.79-4 4v28c0 2.21 1.79 4 4 4h28c2.21 0 4-1.79 4-4zM17 27l5 6.01L29 24l9 12H10l7-9z" })));
-        break;
-      case 'kup-progress-bar':
-        //linear_scale.svg
-        resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M39 19c-2.05 0-3.81 1.23-4.58 3h-5.84c-.77-1.77-2.53-3-4.58-3s-3.81 1.23-4.58 3h-5.84c-.77-1.77-2.53-3-4.58-3-2.77 0-5 2.23-5 5s2.23 5 5 5c2.05 0 3.81-1.23 4.58-3h5.84c.77 1.77 2.53 3 4.58 3s3.81-1.23 4.58-3h5.84c.77 1.77 2.53 3 4.58 3 2.77 0 5-2.23 5-5s-2.23-5-5-5z" })));
-        break;
-      case 'kup-radio':
-        //radio_button_unchecked.svg
-        resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M24 4C12.95 4 4 12.95 4 24s8.95 20 20 20 20-8.95 20-20S35.05 4 24 4zm0 36c-8.84 0-16-7.16-16-16S15.16 8 24 8s16 7.16 16 16-7.16 16-16 16z" })));
-        break;
-      default:
-        //art_track.svg
-        resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M44 26H28v-4h16v4zm0-12H28v4h16v-4zM28 34h16v-4H28v4zm-4-16v12c0 2.2-1.8 4-4 4H8c-2.2 0-4-1.8-4-4V18c0-2.2 1.8-4 4-4h12c2.2 0 4 1.8 4 4zm-3 12l-4.5-6-3.5 4.51-2.5-3.01L7 30h14z" })));
-        break;
+    componentDidLoad() {
+        this.intObserver.observe(this.rootElement);
+        this.kupManager.debug.logLoad(this, true);
     }
-    if ((this.renderMode === KupLazyRender.VIEWPORT && this.isInViewport) ||
-      (this.renderMode === KupLazyRender.PROPS && this.data) ||
-      (this.renderMode === KupLazyRender.BOTH &&
-        this.data &&
-        this.isInViewport)) {
-      let Tag = this.componentName;
-      content = (h(Tag, Object.assign({}, this.data, { ref: (el) => (this.lazyComponent = el) })));
-      className += ' kup-loaded';
+    componentWillRender() {
+        this.kupManager.debug.logRender(this, false);
     }
-    else if (this.showPlaceholder) {
-      content = resource;
-      className += ' kup-to-be-loaded';
+    componentDidRender() {
+        if (this.lazyComponent && !this.lazyComponentLoaded) {
+            this.lazyComponentLoaded = true;
+            this.kupLazyLoaded.emit({
+                comp: this,
+                id: this.rootElement.id,
+            });
+        }
+        this.kupManager.debug.logRender(this, true);
     }
-    return (h(Host, { class: className }, h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId }, content)));
-  }
-  disconnectedCallback() {
-    var _a;
-    this.kupManager.theme.unregister(this);
-    (_a = this.intObserver) === null || _a === void 0 ? void 0 : _a.unobserve(this.rootElement);
-  }
-  get rootElement() { return this; }
-  static get style() { return kupLazyCss; }
+    render() {
+        let content;
+        let resource;
+        let className = this.componentName;
+        switch (this.componentName) {
+            case 'kup-button':
+                //call_to_action.svg
+                resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M42 6H6c-2.2 0-4 1.8-4 4v28c0 2.2 1.8 4 4 4h36c2.2 0 4-1.8 4-4V10c0-2.2-1.8-4-4-4zm0 32H6v-6h36v6z" })));
+                break;
+            case 'kup-card':
+                //art_track.svg
+                resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M44 26H28v-4h16v4zm0-12H28v4h16v-4zM28 34h16v-4H28v4zm-4-16v12c0 2.2-1.8 4-4 4H8c-2.2 0-4-1.8-4-4V18c0-2.2 1.8-4 4-4h12c2.2 0 4 1.8 4 4zm-3 12l-4.5-6-3.5 4.51-2.5-3.01L7 30h14z" })));
+                break;
+            case 'kup-checkbox':
+                //check_box_outline_blank.svg
+                resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M38 10v28H10V10h28m0-4H10c-2.21 0-4 1.79-4 4v28c0 2.21 1.79 4 4 4h28c2.21 0 4-1.79 4-4V10c0-2.21-1.79-4-4-4z" })));
+                break;
+            case 'kup-chart':
+                //chart-bar.svg
+                resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "100%", height: "100%", viewBox: "0 0 24 24" }, h("path", { d: "M22,21H2V3H4V19H6V10H10V19H12V6H16V19H18V14H22V21Z" })));
+                break;
+            case 'kup-data-table':
+                //table-large.svg
+                resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "100%", height: "100%", viewBox: "0 0 24 24" }, h("path", { d: "M4,3H20A2,2 0 0,1 22,5V20A2,2 0 0,1 20,22H4A2,2 0 0,1 2,20V5A2,2 0 0,1 4,3M4,7V10H8V7H4M10,7V10H14V7H10M20,10V7H16V10H20M4,12V15H8V12H4M4,20H8V17H4V20M10,12V15H14V12H10M10,20H14V17H10V20M20,20V17H16V20H20M20,12H16V15H20V12Z" })));
+                break;
+            case 'kup-image':
+                //photo.svg
+                resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M42 38V10c0-2.21-1.79-4-4-4H10c-2.21 0-4 1.79-4 4v28c0 2.21 1.79 4 4 4h28c2.21 0 4-1.79 4-4zM17 27l5 6.01L29 24l9 12H10l7-9z" })));
+                break;
+            case 'kup-progress-bar':
+                //linear_scale.svg
+                resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M39 19c-2.05 0-3.81 1.23-4.58 3h-5.84c-.77-1.77-2.53-3-4.58-3s-3.81 1.23-4.58 3h-5.84c-.77-1.77-2.53-3-4.58-3-2.77 0-5 2.23-5 5s2.23 5 5 5c2.05 0 3.81-1.23 4.58-3h5.84c.77 1.77 2.53 3 4.58 3s3.81-1.23 4.58-3h5.84c.77 1.77 2.53 3 4.58 3 2.77 0 5-2.23 5-5s-2.23-5-5-5z" })));
+                break;
+            case 'kup-radio':
+                //radio_button_unchecked.svg
+                resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M24 4C12.95 4 4 12.95 4 24s8.95 20 20 20 20-8.95 20-20S35.05 4 24 4zm0 36c-8.84 0-16-7.16-16-16S15.16 8 24 8s16 7.16 16 16-7.16 16-16 16z" })));
+                break;
+            default:
+                //art_track.svg
+                resource = (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { d: "M44 26H28v-4h16v4zm0-12H28v4h16v-4zM28 34h16v-4H28v4zm-4-16v12c0 2.2-1.8 4-4 4H8c-2.2 0-4-1.8-4-4V18c0-2.2 1.8-4 4-4h12c2.2 0 4 1.8 4 4zm-3 12l-4.5-6-3.5 4.51-2.5-3.01L7 30h14z" })));
+                break;
+        }
+        if ((this.renderMode === KupLazyRender.VIEWPORT && this.isInViewport) ||
+            (this.renderMode === KupLazyRender.PROPS && this.data) ||
+            (this.renderMode === KupLazyRender.BOTH &&
+                this.data &&
+                this.isInViewport)) {
+            let Tag = this.componentName;
+            content = (h(Tag, Object.assign({}, this.data, { ref: (el) => (this.lazyComponent = el) })));
+            className += ' kup-loaded';
+        }
+        else if (this.showPlaceholder) {
+            content = resource;
+            className += ' kup-to-be-loaded';
+        }
+        return (h(Host, { class: className }, h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId }, content)));
+    }
+    disconnectedCallback() {
+        var _a;
+        this.kupManager.theme.unregister(this);
+        (_a = this.intObserver) === null || _a === void 0 ? void 0 : _a.unobserve(this.rootElement);
+    }
+    get rootElement() { return this; }
+    static get style() { return kupLazyCss; }
 }, [1, "kup-lazy", {
-    "componentName": [1, "component-name"],
-    "customStyle": [1, "custom-style"],
-    "data": [16],
-    "renderMode": [1, "render-mode"],
-    "showPlaceholder": [4, "show-placeholder"],
-    "isInViewport": [32],
-    "getProps": [64],
-    "getComponent": [64],
-    "refresh": [64],
-    "setProps": [64]
-  }]);
+        "componentName": [1, "component-name"],
+        "customStyle": [1, "custom-style"],
+        "data": [16],
+        "renderMode": [1, "render-mode"],
+        "showPlaceholder": [4, "show-placeholder"],
+        "isInViewport": [32],
+        "getProps": [64],
+        "getComponent": [64],
+        "refresh": [64],
+        "setProps": [64]
+    }]);
 function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["kup-lazy", "kup-autocomplete", "kup-badge", "kup-button", "kup-button-list", "kup-card", "kup-chart", "kup-checkbox", "kup-chip", "kup-color-picker", "kup-combobox", "kup-data-table", "kup-date-picker", "kup-dialog", "kup-dropdown-button", "kup-form", "kup-gauge", "kup-image", "kup-list", "kup-progress-bar", "kup-radio", "kup-rating", "kup-spinner", "kup-switch", "kup-tab-bar", "kup-text-field", "kup-time-picker", "kup-tree"];
-  components.forEach(tagName => { switch (tagName) {
-    case "kup-lazy":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, KupLazy$1);
-      }
-      break;
-    case "kup-autocomplete":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$s();
-      }
-      break;
-    case "kup-badge":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$r();
-      }
-      break;
-    case "kup-button":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$q();
-      }
-      break;
-    case "kup-button-list":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$p();
-      }
-      break;
-    case "kup-card":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$o();
-      }
-      break;
-    case "kup-chart":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$n();
-      }
-      break;
-    case "kup-checkbox":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$m();
-      }
-      break;
-    case "kup-chip":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$l();
-      }
-      break;
-    case "kup-color-picker":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$k();
-      }
-      break;
-    case "kup-combobox":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$j();
-      }
-      break;
-    case "kup-data-table":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$i();
-      }
-      break;
-    case "kup-date-picker":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$h();
-      }
-      break;
-    case "kup-dialog":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$g();
-      }
-      break;
-    case "kup-dropdown-button":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$f();
-      }
-      break;
-    case "kup-form":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$e();
-      }
-      break;
-    case "kup-gauge":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$d();
-      }
-      break;
-    case "kup-image":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$c();
-      }
-      break;
-    case "kup-list":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$b();
-      }
-      break;
-    case "kup-progress-bar":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$a();
-      }
-      break;
-    case "kup-radio":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$9();
-      }
-      break;
-    case "kup-rating":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$8();
-      }
-      break;
-    case "kup-spinner":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$7();
-      }
-      break;
-    case "kup-switch":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$6();
-      }
-      break;
-    case "kup-tab-bar":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$5();
-      }
-      break;
-    case "kup-text-field":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$4();
-      }
-      break;
-    case "kup-time-picker":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "kup-tree":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-  } });
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["kup-lazy", "kup-autocomplete", "kup-badge", "kup-button", "kup-button-list", "kup-card", "kup-chart", "kup-checkbox", "kup-chip", "kup-color-picker", "kup-combobox", "kup-data-table", "kup-date-picker", "kup-dialog", "kup-dropdown-button", "kup-form", "kup-gauge", "kup-image", "kup-list", "kup-progress-bar", "kup-radio", "kup-rating", "kup-spinner", "kup-switch", "kup-tab-bar", "kup-text-field", "kup-time-picker", "kup-tree"];
+    components.forEach(tagName => { switch (tagName) {
+        case "kup-lazy":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, KupLazy$1);
+            }
+            break;
+        case "kup-autocomplete":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$s();
+            }
+            break;
+        case "kup-badge":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$r();
+            }
+            break;
+        case "kup-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$q();
+            }
+            break;
+        case "kup-button-list":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$p();
+            }
+            break;
+        case "kup-card":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$o();
+            }
+            break;
+        case "kup-chart":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$n();
+            }
+            break;
+        case "kup-checkbox":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$m();
+            }
+            break;
+        case "kup-chip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$l();
+            }
+            break;
+        case "kup-color-picker":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$k();
+            }
+            break;
+        case "kup-combobox":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$j();
+            }
+            break;
+        case "kup-data-table":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$i();
+            }
+            break;
+        case "kup-date-picker":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$h();
+            }
+            break;
+        case "kup-dialog":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$g();
+            }
+            break;
+        case "kup-dropdown-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$f();
+            }
+            break;
+        case "kup-form":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$e();
+            }
+            break;
+        case "kup-gauge":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$d();
+            }
+            break;
+        case "kup-image":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$c();
+            }
+            break;
+        case "kup-list":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$b();
+            }
+            break;
+        case "kup-progress-bar":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$a();
+            }
+            break;
+        case "kup-radio":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$9();
+            }
+            break;
+        case "kup-rating":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$8();
+            }
+            break;
+        case "kup-spinner":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "kup-switch":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "kup-tab-bar":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "kup-text-field":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "kup-time-picker":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "kup-tree":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
 }
 
 const KupLazy = KupLazy$1;