fis-component 0.0.46 → 0.0.48

package/dist/cjs/index.js

@@ -978,7 +978,7 @@ var theme = {
     "com/menu/left-padding": "8px",
     "com/menu/corner-radius": "12px",
     "com/menu/min-width": "132px",
-    "com/menu/max-height": "780px",
+    "com/menu/max-height": "380px",
     "com/menu/height": "204px",
     "com/menu/search-bar/size": "Md (36)",
     "com/menu/scrollbar/direction": "Vertical",
@@ -3128,237 +3128,237 @@ var theme = {
     "Elevation/Level-3": "0px 4px 8px -2px #00375b0e, 0px 16px 32px -12px #0a2f4d22",
     "Form's-Row": [
         {
-            "pattern": "columns",
-            "visible": true,
-            "alignment": "stretch",
-            "color": "#c48eff26",
-            "gutterSize": "16px",
-            "count": 4,
-            "offset": "0px"
-        }
+            pattern: "columns",
+            visible: true,
+            alignment: "stretch",
+            color: "#c48eff26",
+            gutterSize: "16px",
+            count: 4,
+            offset: "0px",
+        },
     ],
     "Grid/Container-Lg": [
         {
-            "pattern": "columns",
-            "visible": true,
-            "alignment": "stretch",
-            "color": "#c48eff26",
-            "gutterSize": "20px",
-            "count": 12,
-            "offset": "24px"
-        }
+            pattern: "columns",
+            visible: true,
+            alignment: "stretch",
+            color: "#c48eff26",
+            gutterSize: "20px",
+            count: 12,
+            offset: "24px",
+        },
     ],
     "Grid/Container-Md": [
         {
-            "pattern": "columns",
-            "visible": true,
-            "alignment": "stretch",
-            "color": "#c48eff26",
-            "gutterSize": "20px",
-            "count": 8,
-            "offset": "20px"
-        }
+            pattern: "columns",
+            visible: true,
+            alignment: "stretch",
+            color: "#c48eff26",
+            gutterSize: "20px",
+            count: 8,
+            offset: "20px",
+        },
     ],
     "Grid/Container-Sm": [
         {
-            "pattern": "columns",
-            "visible": true,
-            "alignment": "stretch",
-            "color": "#c48eff26",
-            "gutterSize": "12px",
-            "count": 6,
-            "offset": "16px"
-        }
+            pattern: "columns",
+            visible: true,
+            alignment: "stretch",
+            color: "#c48eff26",
+            gutterSize: "12px",
+            count: 6,
+            offset: "16px",
+        },
     ],
     "Emphasis/Emp-6": {
-        "fontFamily": "Inter Display",
-        "fontSize": "50px",
-        "fontWeight": 500,
-        "letterSpacing": "-0.5px",
-        "lineHeight": "68px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Display",
+        fontSize: "50px",
+        fontWeight: 500,
+        letterSpacing: "-0.5px",
+        lineHeight: "68px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Emphasis/Emp-5": {
-        "fontFamily": "Inter Display",
-        "fontSize": "42px",
-        "fontWeight": 500,
-        "letterSpacing": "-0.5px",
-        "lineHeight": "56px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Display",
+        fontSize: "42px",
+        fontWeight: 500,
+        letterSpacing: "-0.5px",
+        lineHeight: "56px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Emphasis/Emp-4": {
-        "fontFamily": "Inter Display",
-        "fontSize": "35px",
-        "fontWeight": 500,
-        "letterSpacing": "-0.5px",
-        "lineHeight": "48px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Display",
+        fontSize: "35px",
+        fontWeight: 500,
+        letterSpacing: "-0.5px",
+        lineHeight: "48px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Emphasis/Emp-3": {
-        "fontFamily": "Inter Display",
-        "fontSize": "29px",
-        "fontWeight": 500,
-        "letterSpacing": "-0.5px",
-        "lineHeight": "40px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Display",
+        fontSize: "29px",
+        fontWeight: 500,
+        letterSpacing: "-0.5px",
+        lineHeight: "40px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Emphasis/Emp-2": {
-        "fontFamily": "Inter Display",
-        "fontSize": "24px",
-        "fontWeight": 500,
-        "letterSpacing": "-0.5px",
-        "lineHeight": "32px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Display",
+        fontSize: "24px",
+        fontWeight: 500,
+        letterSpacing: "-0.5px",
+        lineHeight: "32px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Emphasis/Emp-1": {
-        "fontFamily": "Inter Display",
-        "fontSize": "20px",
-        "fontWeight": 500,
-        "letterSpacing": "-0.3px",
-        "lineHeight": "28px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Display",
+        fontSize: "20px",
+        fontWeight: 500,
+        letterSpacing: "-0.3px",
+        lineHeight: "28px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Label/XL": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "24px",
-        "fontWeight": 500,
-        "letterSpacing": "-0.5px",
-        "lineHeight": "32px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "24px",
+        fontWeight: 500,
+        letterSpacing: "-0.5px",
+        lineHeight: "32px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Label/Lg": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "20px",
-        "fontWeight": 500,
-        "letterSpacing": "-0.5px",
-        "lineHeight": "28px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "20px",
+        fontWeight: 500,
+        letterSpacing: "-0.5px",
+        lineHeight: "28px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Label/Md": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "17px",
-        "fontWeight": 500,
-        "letterSpacing": "-0.3px",
-        "lineHeight": "24px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "17px",
+        fontWeight: 500,
+        letterSpacing: "-0.3px",
+        lineHeight: "24px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Label/Sm": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "14px",
-        "fontWeight": 500,
-        "letterSpacing": "-0.15px",
-        "lineHeight": "20px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "14px",
+        fontWeight: 500,
+        letterSpacing: "-0.15px",
+        lineHeight: "20px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Label/XS": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "12px",
-        "fontWeight": 500,
-        "letterSpacing": "-0.15px",
-        "lineHeight": "16px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "12px",
+        fontWeight: 500,
+        letterSpacing: "-0.15px",
+        lineHeight: "16px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Subheading/Lg": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "17px",
-        "fontWeight": 500,
-        "letterSpacing": "0.5px",
-        "lineHeight": "24px",
-        "textTransform": "uppercase",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "17px",
+        fontWeight: 500,
+        letterSpacing: "0.5px",
+        lineHeight: "24px",
+        textTransform: "uppercase",
+        textDecoration: "none",
     },
     "Subheading/Md": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "14px",
-        "fontWeight": 500,
-        "letterSpacing": "0.5px",
-        "lineHeight": "20px",
-        "textTransform": "uppercase",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "14px",
+        fontWeight: 500,
+        letterSpacing: "0.5px",
+        lineHeight: "20px",
+        textTransform: "uppercase",
+        textDecoration: "none",
     },
     "Subheading/Sm": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "12px",
-        "fontWeight": 500,
-        "letterSpacing": "0.2px",
-        "lineHeight": "16px",
-        "textTransform": "uppercase",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "12px",
+        fontWeight: 500,
+        letterSpacing: "0.2px",
+        lineHeight: "16px",
+        textTransform: "uppercase",
+        textDecoration: "none",
     },
     "Subheading/XS": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "10px",
-        "fontWeight": 500,
-        "letterSpacing": "0.2px",
-        "lineHeight": "12px",
-        "textTransform": "uppercase",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "10px",
+        fontWeight: 500,
+        letterSpacing: "0.2px",
+        lineHeight: "12px",
+        textTransform: "uppercase",
+        textDecoration: "none",
     },
     "Paragraph/XL": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "24px",
-        "fontWeight": 400,
-        "letterSpacing": "-0.15px",
-        "lineHeight": "32px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "24px",
+        fontWeight: 400,
+        letterSpacing: "-0.15px",
+        lineHeight: "32px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Paragraph/Lg": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "20px",
-        "fontWeight": 400,
-        "letterSpacing": "-0.15px",
-        "lineHeight": "28px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "20px",
+        fontWeight: 400,
+        letterSpacing: "-0.15px",
+        lineHeight: "28px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Paragraph/Md": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "17px",
-        "fontWeight": 400,
-        "letterSpacing": "-0.15px",
-        "lineHeight": "24px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "17px",
+        fontWeight: 400,
+        letterSpacing: "-0.15px",
+        lineHeight: "24px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Paragraph/Sm": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "14px",
-        "fontWeight": 400,
-        "letterSpacing": "-0.15px",
-        "lineHeight": "20px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "14px",
+        fontWeight: 400,
+        letterSpacing: "-0.15px",
+        lineHeight: "20px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "Paragraph/XS": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "12px",
-        "fontWeight": 400,
-        "letterSpacing": "-0.15px",
-        "lineHeight": "16px",
-        "textTransform": "none",
-        "textDecoration": "none"
+        fontFamily: "Inter Variable",
+        fontSize: "12px",
+        fontWeight: 400,
+        letterSpacing: "-0.15px",
+        lineHeight: "16px",
+        textTransform: "none",
+        textDecoration: "none",
     },
     "_Guide/Flow-Line/Label": {
-        "fontFamily": "Inter Variable",
-        "fontSize": "24px",
-        "fontWeight": 700,
-        "letterSpacing": "-0.3px",
-        "lineHeight": "32px",
-        "textTransform": "none",
-        "textDecoration": "none"
-    }
+        fontFamily: "Inter Variable",
+        fontSize: "24px",
+        fontWeight: 700,
+        letterSpacing: "-0.3px",
+        lineHeight: "32px",
+        textTransform: "none",
+        textDecoration: "none",
+    },
 };
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -66280,6 +66280,8 @@ const FISTooltip = ({ className, variant = "primary", size = "md", title: titleP
 FISTooltip.displayName = "FISTooltip";
 
 const DivContainerSC$4 = styled.div `
+  display: flex;
+  flex-direction: column;
   width: unset;
   min-width: ${getTheme("com/menu/min-width")};
   max-height: ${getTheme("com/menu/max-height")};
@@ -66312,7 +66314,7 @@ const PTitleSC$2 = styled.p `
   ${getTheme("Paragraph/Sm")}
   color: ${getTheme("com/menu/item/action/label/color-text/default")};
 `;
-const DivWrapperMenuSC = styled.div `
+styled.div `
   display: flex;
   flex-direction: column;
   height: 100%;
@@ -66329,7 +66331,6 @@ const DivSearchSC = styled.div `
   padding-bottom: ${getTheme("com/alert-banner/bottom-padding")};
 `;
 const MenuContent = styled.div `
-  max-height: ${getTheme("com/menu/max-height")};
   overflow-y: scroll;
   overflow-x: hidden;
   width: calc(100% + ${getTheme("com/scrollbar/thumb/thumb-width/default")});
@@ -67422,7 +67423,7 @@ const FISMenuSelect = ({ placeholder, groups, size = "md", multi = false, select
             onClickMenu?.();
         }
     };
-    return (jsxRuntime.jsx(DivContainerSC$4, { className: className, children: jsxRuntime.jsxs(DivWrapperMenuSC, { children: [showInput && !combobox && (jsxRuntime.jsx(DivSearchSC, { children: jsxRuntime.jsx(FISInputText, { iconPrefix: jsxRuntime.jsx(SearchIcon, {}), placeholder: placeholder, onChange: handleSearchChange }) })), (shouldShowNoResult || noResult) && (jsxRuntime.jsxs(DivLoaderSC, { children: [jsxRuntime.jsx(DivIconDataSC, { children: jsxRuntime.jsx(NoResultIcon, {}) }), jsxRuntime.jsx(PTitleSC$2, { children: noResultText })] })), noData && (jsxRuntime.jsxs(DivLoaderSC, { children: [jsxRuntime.jsx(DivIconDataSC, { children: jsxRuntime.jsx(NoDataIcon, {}) }), jsxRuntime.jsx(PTitleSC$2, { children: noDataText })] })), loading && (jsxRuntime.jsxs(DivLoaderSC, { children: [jsxRuntime.jsx(FISProgressCircular, { size: size, variant: "indeterminate" }), jsxRuntime.jsx(PTitleSC$2, { children: loadingText })] })), !shouldShowNoResult && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(MenuContent, { "$removeSelectedGroup": !!menuState.removeSelectedGroup, children: menuState.filteredGroups.map((group, index) => (jsxRuntime.jsxs(DivWrapperSC$4, { children: [index !== 0 && jsxRuntime.jsx(FISMenuSection, { withDivider: true }), jsxRuntime.jsx(FISMenuSection, { label: group?.groupLabel }), group.items.map((item, idx) => (jsxRuntime.jsx(FISMenuItem, { title: item.label, description: item.description, size: size, onClickMenu: () => handleItemClick(item), selected: selectedValues?.includes(item.value), type: "select" }, idx)))] }, index))) }), menuState.removeSelectedGroup && (jsxRuntime.jsx(FixedBottomSection, { children: jsxRuntime.jsx(DivWrapperSC$4, { children: menuState.removeSelectedGroup.items.map((item, idx) => (jsxRuntime.jsx(FISMenuItem, { title: item.label, description: item.description, size: size, onClickMenu: () => onChangeSelected?.([]), type: "select", iconPrefix: jsxRuntime.jsx(RemoveIcon, {}), negative: true }, idx))) }) }))] }))] }) }));
+    return (jsxRuntime.jsxs(DivContainerSC$4, { className: className, children: [showInput && !combobox && (jsxRuntime.jsx(DivSearchSC, { children: jsxRuntime.jsx(FISInputText, { iconPrefix: jsxRuntime.jsx(SearchIcon, {}), placeholder: placeholder, onChange: handleSearchChange }) })), (shouldShowNoResult || noResult) && (jsxRuntime.jsxs(DivLoaderSC, { children: [jsxRuntime.jsx(DivIconDataSC, { children: jsxRuntime.jsx(NoResultIcon, {}) }), jsxRuntime.jsx(PTitleSC$2, { children: noResultText })] })), noData && (jsxRuntime.jsxs(DivLoaderSC, { children: [jsxRuntime.jsx(DivIconDataSC, { children: jsxRuntime.jsx(NoDataIcon, {}) }), jsxRuntime.jsx(PTitleSC$2, { children: noDataText })] })), loading && (jsxRuntime.jsxs(DivLoaderSC, { children: [jsxRuntime.jsx(FISProgressCircular, { size: size, variant: "indeterminate" }), jsxRuntime.jsx(PTitleSC$2, { children: loadingText })] })), !shouldShowNoResult && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(MenuContent, { "$removeSelectedGroup": !!menuState.removeSelectedGroup, children: menuState.filteredGroups.map((group, index) => (jsxRuntime.jsxs(DivWrapperSC$4, { children: [index !== 0 && jsxRuntime.jsx(FISMenuSection, { withDivider: true }), jsxRuntime.jsx(FISMenuSection, { label: group?.groupLabel }), group.items.map((item, idx) => (jsxRuntime.jsx(FISMenuItem, { title: item.label, description: item.description, size: size, onClickMenu: () => handleItemClick(item), selected: selectedValues?.includes(item.value), type: "select" }, idx)))] }, index))) }), menuState.removeSelectedGroup && (jsxRuntime.jsx(FixedBottomSection, { children: jsxRuntime.jsx(DivWrapperSC$4, { children: menuState.removeSelectedGroup.items.map((item, idx) => (jsxRuntime.jsx(FISMenuItem, { title: item.label, description: item.description, size: size, onClickMenu: () => onChangeSelected?.([]), type: "select", iconPrefix: jsxRuntime.jsx(RemoveIcon, {}), negative: true }, idx))) }) }))] }))] }));
 };
 FISMenuSelect.displayName = "FISMenuSelect";
 
@@ -71685,6 +71686,18 @@ const DivDateRangeContainerSC = styled.div `
     justify-content: center;
   }
 
+  ${(props) => props.$disabled &&
+    styled.css `
+      .ant-picker-range {
+        background-color: ${getTheme("com/input/field/disable/background-color")};
+        border-color: ${getTheme("com/input/field/disable/stroke-color")};
+
+        .ant-picker-suffix svg {
+          color: ${getTheme("com/button/disable/icon-color")};
+        }
+      }
+    `}
+
   ${(props) => {
     if (props.$negative) {
         return styled.css `
@@ -71734,12 +71747,12 @@ const DivSuffixIconSC = styled.div `
 `;
 
 const { RangePicker } = DatePicker;
-const FISDateRange = ({ placeholder = ["dd/mm/yyyy", "dd/mm/yyyy"], label, required = true, message, negative = false, positive = false, ...rest }) => {
+const FISDateRange = ({ placeholder = ["dd/mm/yyyy", "dd/mm/yyyy"], label, required = true, message, negative = false, positive = false, disabled = true, ...rest }) => {
     const [open, setOpen] = React.useState(false);
     const handleOpenCalendar = () => {
         setOpen(!open);
     };
-    return (jsxRuntime.jsxs(DivDateRangeContainerSC, { "$negative": negative, "$positive": positive, children: [label && jsxRuntime.jsx(FISInputLabel, { textLabel: label, required: required }), jsxRuntime.jsx(RangePicker, { open: open, onOpenChange: setOpen, placeholder: placeholder, separator: jsxRuntime.jsx(DivSeparatorIconSC, { "$negative": negative, children: jsxRuntime.jsx(ArrowRightIcon, {}) }), suffixIcon: jsxRuntime.jsx(DivSuffixIconSC, { children: jsxRuntime.jsx(FISIconButton, { size: "sm", variant: "tertiary-invisible", icon: jsxRuntime.jsx(CalendarIcon, {}), onClick: handleOpenCalendar }) }), ...rest }), message && (jsxRuntime.jsx("div", { className: "hint-box", children: jsxRuntime.jsx("div", { className: "hint-text", children: message }) }))] }));
+    return (jsxRuntime.jsxs(DivDateRangeContainerSC, { "$negative": negative, "$positive": positive, "$disabled": disabled, children: [label && jsxRuntime.jsx(FISInputLabel, { textLabel: label, required: required }), jsxRuntime.jsx(RangePicker, { open: open, onOpenChange: setOpen, placeholder: placeholder, disabled: disabled, separator: jsxRuntime.jsx(DivSeparatorIconSC, { "$negative": negative, children: jsxRuntime.jsx(ArrowRightIcon, {}) }), suffixIcon: jsxRuntime.jsx(DivSuffixIconSC, { children: jsxRuntime.jsx(FISIconButton, { disabled: disabled, size: "sm", variant: "tertiary-invisible", icon: jsxRuntime.jsx(CalendarIcon, {}), onClick: handleOpenCalendar }) }), ...rest }), message && (jsxRuntime.jsx("div", { className: "hint-box", children: jsxRuntime.jsx("div", { className: "hint-text", children: message }) }))] }));
 };
 FISDateRange.displayName = "FISDateRange";