@sula-tech/webcomponents 0.24.1 → 0.25.0

package/dist/esm/webcomponents.js

@@ -16,7 +16,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["sula-avatar_32",[[1,"sula-icon-picker",{"label":[1025],"required":[1028],"disabled":[1028],"error":[1025],"value":[1025],"showSearch":[4,"show-search"],"searchPlaceholder":[1,"search-placeholder"],"icons":[1040],"maxVisibleIcons":[2,"max-visible-icons"],"menuMaxHeight":[2,"menu-max-height"],"selectedIcon":[32],"searchTerm":[32]},null,{"value":["handleValueChange"],"icons":["handleIconsChange"]}],[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-calendar",{"label":[1],"value":[1025],"placeholder":[1],"disabled":[4],"helpText":[1,"help-text"],"status":[1],"locale":[1],"minDate":[1,"min-date"],"maxDate":[1,"max-date"],"range":[4],"allowTyping":[4,"allow-typing"],"inline":[4],"compact":[4],"firstDayOfWeek":[2,"first-day-of-week"],"closeOnSelect":[4,"close-on-select"],"showCalendar":[32],"openUpward":[32],"viewMonth":[32],"viewYear":[32],"hoverDate":[32]},[[4,"click","handleDocumentClick"],[4,"keydown","handleDocumentKeydown"]],{"value":["handleValueChange"]}],[1,"sula-chip",{"text":[1025],"appearance":[1025],"disabled":[1028],"icon":[1],"items":[1040],"itemsPlacement":[1025,"items-placement"],"selected":[1028],"isFocused":[32],"showItems":[32]},[[4,"click","handleDocumentClick"]]],[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-menu",{"menuTitle":[1,"menu-title"],"image":[1],"width":[1],"density":[1],"labelOverflow":[1,"label-overflow"],"items":[1040],"collapsed":[32],"previewExpanded":[32],"selectedItem":[32]},null,{"items":["syncSelectedItemFromItems"]}],[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-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-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-toggle",{"selected":[1028],"buttonDisabled":[1028,"button-disabled"],"icon":[1]}],[1,"sula-tooltip",{"text":[1],"position":[1],"icon":[1],"iconClass":[1,"icon-class"],"focused":[4],"trigger":[1],"appendToBody":[4,"append-to-body"],"isVisible":[32]},null,{"text":["handleTextChange"]}],[1,"sula-radio-button",{"checked":[1028],"label":[1025],"disabled":[1028],"radioIsFocus":[32]}],[4,"sula-table",{"density":[1],"equalWidth":[4,"equal-width"],"fullWidth":[4,"full-width"]}],[4,"sula-table-body"],[4,"sula-table-cell"],[4,"sula-table-head-cell"],[4,"sula-table-header"],[4,"sula-table-row"],[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-dropdown",{"label":[1025],"disabled":[1028],"hasError":[1540,"has-error"],"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-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-textfield",{"value":[1025],"type":[1],"status":[1025],"label":[1],"placeholder":[1],"disabled":[1028],"readOnly":[4,"read-only"],"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-loader",{"size":[1],"animationInstance":[32]}],[1,"sula-switch",{"type":[1025],"active":[1028],"disabled":[1028],"label":[1025],"subTitle":[1025,"sub-title"],"responsive":[4],"isFocus":[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"]}]]],["sula-profile-menu",[[1,"sula-profile-menu",{"user":[16],"items":[1040]}]]],["sula-workbench-menu",[[1,"sula-workbench-menu",{"menuTitle":[1,"menu-title"],"image":[1],"width":[1],"density":[1],"labelOverflow":[1,"label-overflow"],"drilldownLevel":[2,"drilldown-level"],"drillPath":[16,"drill-path"],"items":[1040],"user":[16],"defaultIcon":[1,"default-icon"],"profileItems":[1040,"profile-items"],"collapsed":[32],"previewExpanded":[32],"stack":[32],"direction":[32],"selectedPath":[32],"crumbMenu":[32],"profileOpen":[32]},[[4,"click","onDocumentClick"],[4,"keydown","onDocumentKeydown"],[9,"resize","onWindowResize"]],{"items":["syncWithItems"],"drillPath":["syncDrillPath"]}]]],["sula-toast",[[1,"sula-toast",{"toastTitle":[1,"toast-title"],"message":[1],"type":[1],"icon":[1],"actionText":[1,"action-text"],"closable":[4],"duration":[2],"paused":[4],"animated":[4],"announcement":[1],"closeLabel":[1,"close-label"],"announcedText":[32]},[[4,"visibilitychange","updateTimeout"]],{"toastTitle":["handleContentChange"],"message":["handleContentChange"],"actionText":["handleContentChange"],"duration":["handleContentChange"],"announcement":["updateAnnouncement"],"paused":["updateTimeout"]}]]],["sula-toast-stack",[[1,"sula-toast-stack",{"items":[16],"hovering":[32],"focused":[32],"noHover":[32],"retainingPointerExpansion":[32],"announcements":[32]},null,{"items":["handleItemsChange"]}]]]], options);
+  return bootstrapLazy([["sula-avatar_32",[[1,"sula-icon-picker",{"label":[1025],"required":[1028],"disabled":[1028],"error":[1025],"value":[1025],"showSearch":[4,"show-search"],"searchPlaceholder":[1,"search-placeholder"],"icons":[1040],"maxVisibleIcons":[2,"max-visible-icons"],"menuMaxHeight":[2,"menu-max-height"],"selectedIcon":[32],"searchTerm":[32]},null,{"value":["handleValueChange"],"icons":["handleIconsChange"]}],[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"],"modalWidth":[1,"modal-width"],"slotMaxHeight":[1,"slot-max-height"],"slotAutoHeight":[4,"slot-auto-height"],"primaryButtonDisabled":[4,"primary-button-disabled"],"secondaryButtonDisabled":[4,"secondary-button-disabled"],"isAnimating":[32],"shouldRender":[32]},null,{"opened":["handleOpenedChange"]}],[1,"sula-calendar",{"label":[1],"value":[1025],"placeholder":[1],"disabled":[4],"helpText":[1,"help-text"],"status":[1],"locale":[1],"minDate":[1,"min-date"],"maxDate":[1,"max-date"],"range":[4],"allowTyping":[4,"allow-typing"],"inline":[4],"compact":[4],"firstDayOfWeek":[2,"first-day-of-week"],"closeOnSelect":[4,"close-on-select"],"showCalendar":[32],"openUpward":[32],"viewMonth":[32],"viewYear":[32],"hoverDate":[32]},[[4,"click","handleDocumentClick"],[4,"keydown","handleDocumentKeydown"]],{"value":["handleValueChange"]}],[1,"sula-chip",{"text":[1025],"appearance":[1025],"disabled":[1028],"icon":[1],"items":[1040],"itemsPlacement":[1025,"items-placement"],"selected":[1028],"isFocused":[32],"showItems":[32]},[[4,"click","handleDocumentClick"]]],[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-menu",{"menuTitle":[1,"menu-title"],"image":[1],"width":[1],"density":[1],"labelOverflow":[1,"label-overflow"],"items":[1040],"collapsed":[32],"previewExpanded":[32],"selectedItem":[32]},null,{"items":["syncSelectedItemFromItems"]}],[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-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-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-toggle",{"selected":[1028],"buttonDisabled":[1028,"button-disabled"],"icon":[1]}],[1,"sula-tooltip",{"text":[1],"position":[1],"icon":[1],"iconClass":[1,"icon-class"],"focused":[4],"trigger":[1],"appendToBody":[4,"append-to-body"],"isVisible":[32]},null,{"text":["handleTextChange"]}],[1,"sula-radio-button",{"checked":[1028],"label":[1025],"disabled":[1028],"radioIsFocus":[32]}],[4,"sula-table",{"density":[1],"equalWidth":[4,"equal-width"],"fullWidth":[4,"full-width"]}],[4,"sula-table-body"],[4,"sula-table-cell"],[4,"sula-table-head-cell"],[4,"sula-table-header"],[4,"sula-table-row"],[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-dropdown",{"label":[1025],"disabled":[1028],"hasError":[1540,"has-error"],"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-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-textfield",{"value":[1025],"type":[1],"status":[1025],"label":[1],"placeholder":[1],"disabled":[1028],"readOnly":[4,"read-only"],"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-loader",{"size":[1],"animationInstance":[32]}],[1,"sula-switch",{"type":[1025],"active":[1028],"disabled":[1028],"label":[1025],"subTitle":[1025,"sub-title"],"responsive":[4],"isFocus":[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"]}]]],["sula-profile-menu",[[1,"sula-profile-menu",{"user":[16],"items":[1040]}]]],["sula-workbench-menu",[[1,"sula-workbench-menu",{"menuTitle":[1,"menu-title"],"image":[1],"width":[1],"density":[1],"labelOverflow":[1,"label-overflow"],"drilldownLevel":[2,"drilldown-level"],"drillPath":[16,"drill-path"],"items":[1040],"user":[16],"defaultIcon":[1,"default-icon"],"profileItems":[1040,"profile-items"],"collapsed":[32],"previewExpanded":[32],"stack":[32],"direction":[32],"selectedPath":[32],"crumbMenu":[32],"profileOpen":[32]},[[4,"click","onDocumentClick"],[4,"keydown","onDocumentKeydown"],[9,"resize","onWindowResize"]],{"items":["syncWithItems"],"drillPath":["syncDrillPath"]}]]],["sula-toast",[[1,"sula-toast",{"toastTitle":[1,"toast-title"],"message":[1],"type":[1],"icon":[1],"actionText":[1,"action-text"],"closable":[4],"duration":[2],"paused":[4],"animated":[4],"announcement":[1],"closeLabel":[1,"close-label"],"announcedText":[32]},[[4,"visibilitychange","updateTimeout"]],{"toastTitle":["handleContentChange"],"message":["handleContentChange"],"actionText":["handleContentChange"],"duration":["handleContentChange"],"announcement":["updateAnnouncement"],"paused":["updateTimeout"]}]]],["sula-toast-stack",[[1,"sula-toast-stack",{"items":[16],"hovering":[32],"focused":[32],"noHover":[32],"retainingPointerExpansion":[32],"announcements":[32]},null,{"items":["handleItemsChange"]}]]]], options);
 });
 //# sourceMappingURL=webcomponents.js.map
 

package/dist/types/components/sula-modal/sula-modal.d.ts

@@ -45,6 +45,26 @@ export declare class SulaModal {
      * Slot overflow behavior
      */
     slotOverflow: SulaModalSlotOverflow;
+    /**
+     * Modal width on desktop (any CSS value, e.g. `900px`). Empty keeps the type default
+     */
+    modalWidth: string;
+    /**
+     * Max height of the slot area (any CSS value, e.g. `60vh`). Empty keeps the type default
+     */
+    slotMaxHeight: string;
+    /**
+     * Let the modal grow with its content (no slot scroll); the overlay scrolls instead when it exceeds the viewport
+     */
+    slotAutoHeight: boolean;
+    /**
+     * Disable the primary button
+     */
+    primaryButtonDisabled: boolean;
+    /**
+     * Disable the secondary button
+     */
+    secondaryButtonDisabled: boolean;
     /**
      * Event emitted when the modal is closed
      */
@@ -76,6 +96,7 @@ export declare class SulaModal {
     hasHeaderIcon(): boolean;
     hasSlotContent(): boolean;
     hasButtons(): boolean;
+    getWidthStyle(): Record<string, string> | undefined;
     getOverlayClasses(): Record<string, boolean>;
     getWrapperClasses(): Record<string, boolean>;
     getContentClasses(): Record<string, boolean>;

package/dist/types/components/sula-modal/sula-modal.stories.d.ts

@@ -43,6 +43,26 @@ declare const _default: {
             };
             options: SulaModalSlotOverflow[];
         };
+        modalWidth: {
+            control: string;
+            description: string;
+        };
+        slotAutoHeight: {
+            control: string;
+            description: string;
+        };
+        slotMaxHeight: {
+            control: string;
+            description: string;
+        };
+        primaryButtonDisabled: {
+            control: string;
+            description: string;
+        };
+        secondaryButtonDisabled: {
+            control: string;
+            description: string;
+        };
         blockBodyScroll: {
             control: string;
             description: string;
@@ -81,3 +101,5 @@ export declare const ListType: any;
 export declare const CustomFullType: any;
 export declare const SpecialSideType: any;
 export declare const WithCustomSlot: any;
+export declare const WithCustomSlotMaxHeight: any;
+export declare const WithSlotAutoHeight: any;

package/dist/types/components.d.ts

@@ -503,11 +503,21 @@ export namespace Components {
           * @default ''
          */
         "modalTitle": string;
+        /**
+          * Modal width on desktop (any CSS value, e.g. `900px`). Empty keeps the type default
+          * @default ''
+         */
+        "modalWidth": string;
         /**
           * Is modal opened
           * @default false
          */
         "opened": boolean;
+        /**
+          * Disable the primary button
+          * @default false
+         */
+        "primaryButtonDisabled": boolean;
         /**
           * Primary button text
           * @default ''
@@ -518,11 +528,26 @@ export namespace Components {
           * @default ''
          */
         "promoImage": string;
+        /**
+          * Disable the secondary button
+          * @default false
+         */
+        "secondaryButtonDisabled": boolean;
         /**
           * Secondary button text
           * @default ''
          */
         "secondaryButtonText": string;
+        /**
+          * Let the modal grow with its content (no slot scroll); the overlay scrolls instead when it exceeds the viewport
+          * @default false
+         */
+        "slotAutoHeight": boolean;
+        /**
+          * Max height of the slot area (any CSS value, e.g. `60vh`). Empty keeps the type default
+          * @default ''
+         */
+        "slotMaxHeight": string;
         /**
           * Slot overflow behavior
           * @default SulaModalSlotOverflow.Auto
@@ -2259,6 +2284,11 @@ declare namespace LocalJSX {
           * @default ''
          */
         "modalTitle"?: string;
+        /**
+          * Modal width on desktop (any CSS value, e.g. `900px`). Empty keeps the type default
+          * @default ''
+         */
+        "modalWidth"?: string;
         /**
           * Event emitted when the modal is closed
          */
@@ -2276,6 +2306,11 @@ declare namespace LocalJSX {
           * @default false
          */
         "opened"?: boolean;
+        /**
+          * Disable the primary button
+          * @default false
+         */
+        "primaryButtonDisabled"?: boolean;
         /**
           * Primary button text
           * @default ''
@@ -2286,11 +2321,26 @@ declare namespace LocalJSX {
           * @default ''
          */
         "promoImage"?: string;
+        /**
+          * Disable the secondary button
+          * @default false
+         */
+        "secondaryButtonDisabled"?: boolean;
         /**
           * Secondary button text
           * @default ''
          */
         "secondaryButtonText"?: string;
+        /**
+          * Let the modal grow with its content (no slot scroll); the overlay scrolls instead when it exceeds the viewport
+          * @default false
+         */
+        "slotAutoHeight"?: boolean;
+        /**
+          * Max height of the slot area (any CSS value, e.g. `60vh`). Empty keeps the type default
+          * @default ''
+         */
+        "slotMaxHeight"?: string;
         /**
           * Slot overflow behavior
           * @default SulaModalSlotOverflow.Auto