@sula-tech/webcomponents 0.14.0 → 0.14.1

package/dist/cjs/loader.cjs.js

@@ -5,7 +5,7 @@ var index = require('./index-C19aFtyq.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await index.globalScripts();
-  return index.bootstrapLazy([["sula-avatar_21.cjs",[[1,"sula-modal",{"opened":[1028],"blockBodyScroll":[1028,"block-body-scroll"],"closeOnClickOutside":[1028,"close-on-click-outside"],"type":[1],"headerIcon":[1,"header-icon"],"modalTitle":[1,"modal-title"],"promoImage":[1,"promo-image"],"subTitle":[1,"sub-title"],"primaryButtonText":[1,"primary-button-text"],"secondaryButtonText":[1,"secondary-button-text"],"slotOverflow":[1,"slot-overflow"],"isAnimating":[32],"shouldRender":[32]},null,{"opened":["handleOpenedChange"]}],[1,"sula-chip",{"text":[1025],"appearance":[1025],"disabled":[1028],"items":[1040],"selected":[1028],"isFocused":[32],"showItems":[32]},[[4,"click","handleDocumentClick"]]],[1,"sula-dropdown",{"label":[1025],"disabled":[1028],"items":[1040],"value":[1040],"searchable":[516],"menuMaxHeight":[2,"menu-max-height"],"contentMaxHeight":[2,"content-max-height"],"customContent":[516,"custom-content"],"closeOnSelect":[4,"close-on-select"],"selectedItem":[32],"showItems":[32],"isFocused":[32],"searchTerm":[32],"filteredItems":[32],"openUpward":[32]},[[4,"click","handleDocumentClick"],[9,"resize","handleWindowResize"]],{"value":["handleValueChange"],"showItems":["handleShowItemsChange"]}],[1,"sula-avatar",{"size":[1],"imageUrl":[1,"image-url"],"text":[1],"icon":[1]}],[1,"sula-badge",{"status":[1025],"size":[1025],"type":[1025],"text":[1025],"icon":[1025],"hasSlotContent":[32]}],[1,"sula-breadcrumb",{"items":[1040]}],[1,"sula-checkbox",{"type":[1025],"label":[1025],"subTitle":[1025,"sub-title"],"disabled":[1028],"checked":[1028],"isFocus":[32]}],[1,"sula-progress-bar",{"appearance":[1025],"state":[1025],"topLabel":[1025,"top-label"],"bottomLabel":[1025,"bottom-label"],"progress":[1026],"showProgress":[1028,"show-progress"]},null,{"progress":["validateProgress"]}],[1,"sula-search-bar",{"value":[1025],"searchBarStyle":[1025,"search-bar-style"],"placeholder":[1025],"leftIcon":[1025,"left-icon"],"rightIcon":[1025,"right-icon"],"isFocused":[32],"textValue":[32]}],[1,"sula-segmented-control",{"items":[1040],"type":[1025],"size":[1025],"color":[1025]}],[1,"sula-tag",{"label":[1025],"icon":[1025],"iconStatus":[1025,"icon-status"],"size":[1025],"appearance":[1025],"fontWeight":[1025,"font-weight"]}],[1,"sula-textfield",{"value":[1025],"type":[1],"status":[1025],"label":[1],"placeholder":[1],"disabled":[1028],"helpText":[1,"help-text"],"maxLength":[2,"max-length"],"icon":[1],"maskPattern":[1,"mask-pattern"],"maskPatternSwitchMaxLength":[2,"mask-pattern-switch-max-length"],"inputIsOpen":[32],"textValue":[32],"showPassword":[32],"inputIsFocused":[32]},[[4,"click","handleClick"]],{"value":["watchValueHandler"],"maskPattern":["watchMaskPatternHandler"],"maskPatternSwitchMaxLength":["watchMaskPatternSwitchMaxLengthHandler"]}],[1,"sula-tiles",{"type":[1],"size":[1],"ellipsis":[4],"icon":[1],"text":[1],"subText":[1,"sub-text"],"disabled":[4]}],[1,"sula-timeline-list",{"sulaTimelineList":[1040,"sula-timeline-list"]}],[1,"sula-radio-button",{"checked":[1028],"label":[1025],"disabled":[1028],"radioIsFocus":[32]}],[1,"sula-switch",{"type":[1025],"active":[1028],"disabled":[1028],"label":[1025],"subTitle":[1025,"sub-title"],"responsive":[4],"isFocus":[32]}],[1,"sula-textarea",{"value":[1025],"status":[1025],"label":[1],"placeholder":[1],"disabled":[1028],"helpText":[1,"help-text"],"maxLength":[2,"max-length"],"rows":[2],"isActive":[32],"textValue":[32],"textareaIsFocused":[32],"labelPadding":[32]},[[4,"click","handleClick"]],{"value":["watchValueHandler"]}],[1,"sula-button",{"text":[1025],"icon":[1025],"leftIcon":[1025,"left-icon"],"rightIcon":[1025,"right-icon"],"appearance":[1025],"type":[1025],"size":[1025],"status":[1025],"loading":[1028],"buttonDisabled":[1028,"button-disabled"],"fullWidth":[1028,"full-width"]}],[1,"sula-loader",{"size":[1],"animationInstance":[32]}],[1,"sula-menu-select-list",{"items":[1040],"fullWidth":[4,"full-width"],"maxHeight":[2,"max-height"],"selectedValue":[16,"selected-value"]}],[0,"sula-icon",{"icon":[1],"customClass":[1,"custom-class"]}]]]], options);
+  return index.bootstrapLazy([["sula-avatar_21.cjs",[[1,"sula-modal",{"opened":[1028],"blockBodyScroll":[1028,"block-body-scroll"],"closeOnClickOutside":[1028,"close-on-click-outside"],"type":[1],"headerIcon":[1,"header-icon"],"modalTitle":[1,"modal-title"],"promoImage":[1,"promo-image"],"subTitle":[1,"sub-title"],"primaryButtonText":[1,"primary-button-text"],"secondaryButtonText":[1,"secondary-button-text"],"slotOverflow":[1,"slot-overflow"],"isAnimating":[32],"shouldRender":[32]},null,{"opened":["handleOpenedChange"]}],[1,"sula-chip",{"text":[1025],"appearance":[1025],"disabled":[1028],"items":[1040],"selected":[1028],"isFocused":[32],"showItems":[32]},[[4,"click","handleDocumentClick"]]],[1,"sula-dropdown",{"label":[1025],"disabled":[1028],"items":[1040],"value":[1040],"searchable":[516],"menuMaxHeight":[2,"menu-max-height"],"contentMaxHeight":[2,"content-max-height"],"customContent":[516,"custom-content"],"closeOnSelect":[4,"close-on-select"],"showContent":[1540,"show-content"],"selectedItem":[32],"isFocused":[32],"searchTerm":[32],"filteredItems":[32],"openUpward":[32]},[[4,"click","handleDocumentClick"],[9,"resize","handleWindowResize"]],{"value":["handleValueChange"],"showContent":["handleShowContentChange"]}],[1,"sula-avatar",{"size":[1],"imageUrl":[1,"image-url"],"text":[1],"icon":[1]}],[1,"sula-badge",{"status":[1025],"size":[1025],"type":[1025],"text":[1025],"icon":[1025],"hasSlotContent":[32]}],[1,"sula-breadcrumb",{"items":[1040]}],[1,"sula-checkbox",{"type":[1025],"label":[1025],"subTitle":[1025,"sub-title"],"disabled":[1028],"checked":[1028],"isFocus":[32]}],[1,"sula-progress-bar",{"appearance":[1025],"state":[1025],"topLabel":[1025,"top-label"],"bottomLabel":[1025,"bottom-label"],"progress":[1026],"showProgress":[1028,"show-progress"]},null,{"progress":["validateProgress"]}],[1,"sula-search-bar",{"value":[1025],"searchBarStyle":[1025,"search-bar-style"],"placeholder":[1025],"leftIcon":[1025,"left-icon"],"rightIcon":[1025,"right-icon"],"isFocused":[32],"textValue":[32]}],[1,"sula-segmented-control",{"items":[1040],"type":[1025],"size":[1025],"color":[1025]}],[1,"sula-tag",{"label":[1025],"icon":[1025],"iconStatus":[1025,"icon-status"],"size":[1025],"appearance":[1025],"fontWeight":[1025,"font-weight"]}],[1,"sula-textfield",{"value":[1025],"type":[1],"status":[1025],"label":[1],"placeholder":[1],"disabled":[1028],"helpText":[1,"help-text"],"maxLength":[2,"max-length"],"icon":[1],"maskPattern":[1,"mask-pattern"],"maskPatternSwitchMaxLength":[2,"mask-pattern-switch-max-length"],"inputIsOpen":[32],"textValue":[32],"showPassword":[32],"inputIsFocused":[32]},[[4,"click","handleClick"]],{"value":["watchValueHandler"],"maskPattern":["watchMaskPatternHandler"],"maskPatternSwitchMaxLength":["watchMaskPatternSwitchMaxLengthHandler"]}],[1,"sula-tiles",{"type":[1],"size":[1],"ellipsis":[4],"icon":[1],"text":[1],"subText":[1,"sub-text"],"disabled":[4]}],[1,"sula-timeline-list",{"sulaTimelineList":[1040,"sula-timeline-list"]}],[1,"sula-radio-button",{"checked":[1028],"label":[1025],"disabled":[1028],"radioIsFocus":[32]}],[1,"sula-switch",{"type":[1025],"active":[1028],"disabled":[1028],"label":[1025],"subTitle":[1025,"sub-title"],"responsive":[4],"isFocus":[32]}],[1,"sula-textarea",{"value":[1025],"status":[1025],"label":[1],"placeholder":[1],"disabled":[1028],"helpText":[1,"help-text"],"maxLength":[2,"max-length"],"rows":[2],"isActive":[32],"textValue":[32],"textareaIsFocused":[32],"labelPadding":[32]},[[4,"click","handleClick"]],{"value":["watchValueHandler"]}],[1,"sula-button",{"text":[1025],"icon":[1025],"leftIcon":[1025,"left-icon"],"rightIcon":[1025,"right-icon"],"appearance":[1025],"type":[1025],"size":[1025],"status":[1025],"loading":[1028],"buttonDisabled":[1028,"button-disabled"],"fullWidth":[1028,"full-width"]}],[1,"sula-loader",{"size":[1],"animationInstance":[32]}],[1,"sula-menu-select-list",{"items":[1040],"fullWidth":[4,"full-width"],"maxHeight":[2,"max-height"],"selectedValue":[16,"selected-value"]}],[0,"sula-icon",{"icon":[1],"customClass":[1,"custom-class"]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/cjs/sula-avatar_21.cjs.entry.js

@@ -575,7 +575,10 @@ const SulaDropdown = class {
          * Close dropdown when an item is selected or content is clicked
          */
         this.closeOnSelect = true;
-        this.showItems = false;
+        /**
+         * Show or hide dropdown content
+         */
+        this.showContent = false;
         this.isFocused = false;
         this.searchTerm = '';
         this.filteredItems = [];
@@ -585,9 +588,9 @@ const SulaDropdown = class {
                 return;
             this.dropdownClicked.emit();
             if (this.customContent || this.items.length > 0) {
-                this.showItems = !this.showItems;
+                this.showContent = !this.showContent;
             }
-            if (this.searchable && this.showItems && this.searchInputRef) {
+            if (this.searchable && this.showContent && this.searchInputRef) {
                 this.searchInputRef.focus();
             }
         };
@@ -597,7 +600,7 @@ const SulaDropdown = class {
             this.menuItemSelected.emit(item.detail);
             if (this.closeOnSelect) {
                 setTimeout(() => {
-                    this.showItems = false;
+                    this.showContent = false;
                 }, 0);
             }
         };
@@ -631,7 +634,7 @@ const SulaDropdown = class {
             this.selectedItem = this.value;
         }
     }
-    handleShowItemsChange(newValue) {
+    handleShowContentChange(newValue) {
         if (!newValue) {
             this.searchTerm = '';
             this.filteredItems = [];
@@ -643,11 +646,11 @@ const SulaDropdown = class {
         const path = event.composedPath();
         const clickInside = path.some(el => el === this.node);
         if (!clickInside) {
-            this.showItems = false;
+            this.showContent = false;
         }
     }
     handleWindowResize() {
-        if (this.showItems) {
+        if (this.showContent) {
             this.calculateMenuPosition();
         }
     }
@@ -668,7 +671,7 @@ const SulaDropdown = class {
         }
     }
     componentDidRender() {
-        if (this.showItems) {
+        if (this.showContent) {
             this.calculateMenuPosition();
             if (this.searchable && this.searchInputRef) {
                 this.searchInputRef.focus();
@@ -682,21 +685,21 @@ const SulaDropdown = class {
     }
     render() {
         var _a;
-        return (index.h(index.Host, { key: 'bcb9fc6510f1f67d054824aeb6d50502e20ab8d0', ref: node => (this.node = node) }, index.h("div", { key: 'a46d801d67e501faee720916fff32f37791b0ee9', class: {
+        return (index.h(index.Host, { key: '812029af9121bf2f6b10b426b93dc0095796d66d', ref: node => (this.node = node) }, index.h("div", { key: '24e4b075470cd3ac8311374d0eebbc9d62bc248e', class: {
                 'flex justify-between items-center border border-line-input h-[72px] px-16 rounded-xl relative': true,
                 'bg-surface-body cursor-pointer': !this.disabled,
                 'bg-states-bg-disabled': this.disabled,
                 'dropdown-focus': this.isFocused,
-            }, onClick: this.handleClick, tabIndex: 0, onFocus: this.handleFocus, onBlur: this.handleBlur }, index.h("div", { key: 'ef745b49c183c29d86fd50d3fa9d2084e75d8156', class: "flex flex-col w-full" }, index.h("label", { key: '833a6a1866ebc31842d746fd1beef1af7d368fed', class: {
-                'text-base leading-4': !this.selectedItem && !(this.searchable && this.showItems),
-                'text-sm leading-4 font-bold': !!this.selectedItem || (this.searchable && this.showItems),
+            }, onClick: this.handleClick, tabIndex: 0, onFocus: this.handleFocus, onBlur: this.handleBlur }, index.h("div", { key: '10bb402bb063b83a66996c3b21e345045779fea6', class: "flex flex-col w-full" }, index.h("label", { key: '9e6013e76bd927d9cf50bccfe542205b2db5ad3c', class: {
+                'text-base leading-4': !this.selectedItem && !(this.searchable && this.showContent),
+                'text-sm leading-4 font-bold': !!this.selectedItem || (this.searchable && this.showContent),
                 'text-text-primary': !this.disabled,
                 'text-text-disabled': this.disabled,
-            } }, this.label), this.searchable && this.showItems ? (index.h("input", { ref: el => (this.searchInputRef = el), type: "text", value: this.searchTerm, onInput: this.handleSearchInput, placeholder: ((_a = this.selectedItem) === null || _a === void 0 ? void 0 : _a.title) || '', class: "w-full text-base text-text-primary bg-transparent border-none outline-none placeholder:text-text-secondary p-0 m-0 leading-4 pt-4" })) : (!!this.selectedItem && (index.h("span", { class: {
+            } }, this.label), this.searchable && this.showContent ? (index.h("input", { ref: el => (this.searchInputRef = el), type: "text", value: this.searchTerm, onInput: this.handleSearchInput, placeholder: ((_a = this.selectedItem) === null || _a === void 0 ? void 0 : _a.title) || '', class: "w-full text-base text-text-primary bg-transparent border-none outline-none placeholder:text-text-secondary p-0 m-0 leading-4 pt-4" })) : (!!this.selectedItem && (index.h("span", { class: {
                 'text-base leading-4 pt-4': true,
                 'text-text-primary': !this.disabled,
                 'text-text-disabled': this.disabled,
-            } }, this.selectedItem.title)))), index.h("div", { key: '1b8a1970c4750c3f314aa7d8e5193e8d9cfa3483', class: "flex items-center justify-center ml-8 leading-6 text-2xl" }, index.h("sula-icon", { key: '635d6d6df91f4ea2d8d051ca7443941a44a7c856', icon: `ph ph-caret-${this.showItems ? 'up' : 'down'}`, customClass: `${this.getIconClass()} text-2xl` })), this.showItems && (index.h("div", { key: '223e42138b156a98b1296e317599c2eb16e3a633', class: {
+            } }, this.selectedItem.title)))), index.h("div", { key: '9c570fe666a9e400882728dd6cc7375efc6fd9c3', class: "flex items-center justify-center ml-8 leading-6 text-2xl" }, index.h("sula-icon", { key: 'c33165aec78c9d227a645d5a5390caa5f5580e48', icon: `ph ph-caret-${this.showContent ? 'up' : 'down'}`, customClass: `${this.getIconClass()} text-2xl` })), this.showContent && (index.h("div", { key: 'a5f4c9c26cfc64bb39300474e8efb52174b538ab', class: {
                 'absolute z-50 left-0 w-full transition-all duration-200 ease-in-out': true,
                 'bottom-[72px]': this.openUpward,
                 'top-[72px]': !this.openUpward,
@@ -711,7 +714,7 @@ const SulaDropdown = class {
     }
     static get watchers() { return {
         "value": ["handleValueChange"],
-        "showItems": ["handleShowItemsChange"]
+        "showContent": ["handleShowContentChange"]
     }; }
 };
 SulaDropdown.style = sulaDropdownCss;