@apple-pie/slice 0.1.26 → 0.1.28

package/dist/esm/chunks/{DropDown-BQ2tNN3_.mjs → DropDown-CdkEVTRk.mjs}

@@ -7,13 +7,14 @@ import React, { useState, useRef, useEffect, useCallback, useMemo } from "react"
 
 import { s as setStyle } from "./misc-BeEWwOaJ.mjs";
 
-import { I as Icon } from "./Icon-DI32kOA1.mjs";
+import { I as Icon } from "./Icon-DRzjkybv.mjs";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 
 var css = {
     wrapper: "DropDown-module_wrapper__CyX0u flexBox-module_rowStart__4tcxS",
     face: "DropDown-module_face__6gyF3 flexBox-module_rowStart__4tcxS",
+    faceText: "DropDown-module_faceText__glhB3",
     label: "DropDown-module_label__Mrwbp flexBox-module_rowStart__4tcxS",
     xs: "DropDown-module_xs__7L71q type-module_body-xs-regular__ZAFft",
     s: "DropDown-module_s__vAxXD type-module_body-s-regular__vRHSP",
@@ -28,7 +29,7 @@ function resolveValueKey(value, valueKey) {
 }
 
 function DropDownComponent(props) {
-    const {name: name = "drop-down-select", label: label, labelColor: labelColor = "var(--core-text-primary)", size: size = "m", width: width = "100%", height: height = "auto", selectedIndex: selectedIndex, selectedValue: selectedValue, valueKey: valueKey, options: options = [], placeholder: placeholder = !0, borderRadius: borderRadius = 4, backgroundColor: backgroundColor = "var(--core-surface-secondary)", bgColor: bgColor = "var(--core-surface-secondary)", iconColor: iconColor = "var(--core-text-primary)", textColor: textColor = "var(--core-text-primary)", borderWidth: borderWidth, borderSize: borderSize = 1, borderColor: borderColor = "var(--core-outline-primary)", paddingLeft: paddingLeft = "8px", paddingRight: paddingRight = "12px", paddingTop: paddingTop = "8px", paddingBottom: paddingBottom = "8px", borderStyle: borderStyle = "box", iconSize: iconSize = 20, disabled: disabled = !1, error: error = !1, gap: gap = 8, onChange: onChange = () => null, onOption: onOption = () => null} = props, divAttributes = __rest(props, [ "name", "label", "labelColor", "size", "width", "height", "selectedIndex", "selectedValue", "valueKey", "options", "placeholder", "borderRadius", "backgroundColor", "bgColor", "iconColor", "textColor", "borderWidth", "borderSize", "borderColor", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "borderStyle", "iconSize", "disabled", "error", "gap", "onChange", "onOption" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, resolvedBorderWidth = null != borderWidth ? borderWidth : borderSize, [index, setIndex] = useState(null != selectedIndex ? selectedIndex : 0), [selectedText, setSelectedText] = useState("Select an option"), ref = useRef(null);
+    const {name: name = "drop-down-select", label: label, labelColor: labelColor = "var(--core-text-primary)", size: size = "m", width: width = "100%", height: height = "auto", selectedIndex: selectedIndex, selectedValue: selectedValue, valueKey: valueKey, options: options = [], placeholder: placeholder = !0, borderRadius: borderRadius = 8, backgroundColor: backgroundColor = "var(--core-surface-secondary)", bgColor: bgColor = "var(--core-surface-secondary)", iconColor: iconColor = "var(--core-text-primary)", textColor: textColor = "var(--core-text-primary)", borderWidth: borderWidth, borderSize: borderSize = 1, borderColor: borderColor = "var(--core-outline-primary)", paddingLeft: paddingLeft = "10px", paddingRight: paddingRight = "8px", paddingTop: paddingTop = "8px", paddingBottom: paddingBottom = "8px", borderStyle: borderStyle = "box", iconSize: iconSize = 20, disabled: disabled = !1, error: error = !1, gap: gap = 8, onChange: onChange = () => null, onOption: onOption = () => null} = props, divAttributes = __rest(props, [ "name", "label", "labelColor", "size", "width", "height", "selectedIndex", "selectedValue", "valueKey", "options", "placeholder", "borderRadius", "backgroundColor", "bgColor", "iconColor", "textColor", "borderWidth", "borderSize", "borderColor", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "borderStyle", "iconSize", "disabled", "error", "gap", "onChange", "onOption" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, resolvedBorderWidth = null != borderWidth ? borderWidth : borderSize, [index, setIndex] = useState(null != selectedIndex ? selectedIndex : 0), [selectedText, setSelectedText] = useState("Select an option"), ref = useRef(null);
     useEffect(() => {
         if (null == selectedValue && void 0 !== selectedIndex && (null == ref ? void 0 : ref.current)) {
             if (!(null == options ? void 0 : options[selectedIndex])) return;
@@ -58,9 +59,7 @@ function DropDownComponent(props) {
         disabled && e.preventDefault();
     }, [ disabled ]), handleSelectChange = useCallback(e => {
         handleChange(e.target.selectedIndex);
-    }, [ handleChange ]), setTextColor = useMemo(() => disabled ? "var(--core-text-disabled)" : placeholder && 0 === index ? "var(--core-text-tertiary)" : textColor, [ disabled, placeholder, index, textColor ]), setLabelColor = useMemo(() => disabled ? "var(--core-text-disabled)" : labelColor, [ disabled, labelColor ]), setIconColor = useMemo(() => disabled ? "var(--core-text-disabled)" : iconColor, [ disabled, iconColor ]);
-    useMemo(() => disabled ? "var(--core-outline-primary)" : error ? "var(--feedback-warning)" : borderColor, [ disabled, error, borderColor ]);
-    const setPadding = useMemo(() => "box" === borderStyle ? `${setStyle(paddingTop)} ${setStyle(paddingRight)} ${setStyle(paddingBottom)} ${setStyle(paddingLeft)}` : `0 0 ${setStyle(paddingBottom)} 0`, [ paddingTop, paddingRight, paddingBottom, paddingLeft, borderStyle ]), setBorder = useMemo(() => "box" === borderStyle ? `${setStyle(resolvedBorderWidth)} solid ${setStyle(borderColor)}` : "unset", [ resolvedBorderWidth, borderColor, borderStyle ]), setBorderBottom = useMemo(() => "none" !== borderStyle ? `${setStyle(resolvedBorderWidth)} solid ${setStyle(borderColor)}` : "unset", [ resolvedBorderWidth, borderColor, borderStyle ]), setBorderRadius = useMemo(() => "box" !== borderStyle ? 0 : `${borderRadius}px`, [ borderStyle, borderRadius ]), cssVars = useMemo(() => ({
+    }, [ handleChange ]), setTextColor = useMemo(() => disabled ? "var(--core-text-disabled)" : placeholder && 0 === index ? "var(--core-text-tertiary)" : textColor, [ disabled, placeholder, index, textColor ]), setLabelColor = useMemo(() => disabled ? "var(--core-text-disabled)" : labelColor, [ disabled, labelColor ]), setIconColor = useMemo(() => disabled ? "var(--core-text-disabled)" : iconColor, [ disabled, iconColor ]), setBorderColor = useMemo(() => disabled ? "var(--core-outline-primary)" : error ? "var(--feedback-warning)" : borderColor, [ disabled, error, borderColor ]), setPadding = useMemo(() => "box" === borderStyle ? `${setStyle(paddingTop)} ${setStyle(paddingRight)} ${setStyle(paddingBottom)} ${setStyle(paddingLeft)}` : `0 0 ${setStyle(paddingBottom)} 0`, [ paddingTop, paddingRight, paddingBottom, paddingLeft, borderStyle ]), setBorder = useMemo(() => "box" === borderStyle ? `${setStyle(resolvedBorderWidth)} solid ${setBorderColor}` : "unset", [ resolvedBorderWidth, setBorderColor, borderStyle ]), setBorderBottom = useMemo(() => "none" !== borderStyle ? `${setStyle(resolvedBorderWidth)} solid ${setStyle(borderColor)}` : "unset", [ resolvedBorderWidth, borderColor, borderStyle ]), setBorderRadius = useMemo(() => "box" !== borderStyle ? 0 : `${borderRadius}px`, [ borderStyle, borderRadius ]), cssVars = useMemo(() => ({
         "--dd-gap": setStyle(gap),
         "--dd-height": setStyle(height),
         "--dd-width": setStyle(width),
@@ -79,12 +78,15 @@ function DropDownComponent(props) {
         className: `${css.wrapper}${divClass}`,
         style: Object.assign(Object.assign({}, divStyle), cssVars)
     }, rest, {
-        children: [ jsx("div", {
+        children: [ label && jsx("div", {
             className: `${css.label} ${css[size]}`,
             children: label
         }), jsx("div", {
             className: `${css.face} ${css[size]}`,
-            children: displayText
+            children: jsx("span", {
+                className: css.faceText,
+                children: displayText
+            })
         }), jsx("div", {
             className: css.chevron,
             children: jsx(Icon, {
@@ -104,7 +106,7 @@ function DropDownComponent(props) {
     }));
 }
 
-styleInject(".flexBox-module_row__z24tF {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__5FEvi {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__4tcxS {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__rVdVm {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__ezvMq {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__C7P44 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__PKcrG {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__ERfp7 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__lLJuc {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__ZAFft {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__s3KvF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__Lhqqq {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__vRHSP {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__tjdFc {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__Iy-VX {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__LuQBA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__uW1on {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__UBcvQ {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__lOYbg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__BqRC7 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__Fh2dt {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__pF2kC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__BeyrH {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__Ruknj {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__z8L3G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__0O3g6 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__KXxEB {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__cJeEA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__eRe05 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Xmwtf {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__5q1m3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__k9VFV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.DropDown-module_wrapper__CyX0u {\n\tposition: relative;\n\tpadding: var(--dd-padding) !important;\n\tgap: var(--dd-gap);\n\tmin-width: var(--dd-width);\n\twidth: var(--dd-width);\n\tborder-radius: var(--dd-border-radius);\n\tbackground-color: var(--dd-bg-color);\n\tborder: var(--dd-border);\n\tborder-bottom: var(--dd-border-bottom);\n\ttransition: all var(--motion-water-duration) var(--motion-water) 0s;\n}\n\n.DropDown-module_face__6gyF3 {\n\tflex: 1;\n\toverflow: hidden;\n\tdisplay: -webkit-box;\n\twhite-space: nowrap;\n\t-webkit-line-clamp: 1;\n\t-webkit-box-orient: vertical;\n\ttext-overflow: ellipsis;\n\tword-break: break-all;\n\tcolor: var(--dd-color);\n\tline-height: 1em;\n}\n\n.DropDown-module_label__Mrwbp {\n\twidth: min-content;\n\toverflow: hidden;\n\twhite-space: nowrap;\n\ttext-overflow: ellipsis;\n\tcolor: var(--dd-label-color);\n}\n\n.DropDown-module_xs__7L71q {\n}\n\n.DropDown-module_s__vAxXD {\n}\n\n.DropDown-module_m__K6JPk {\n}\n\n.DropDown-module_l__Kib48 {\n}\n\n.DropDown-module_chevron__LkYsE {\n\tmin-height: var(--dd-icon-size);\n\tmax-height: var(--dd-icon-size);\n\tmin-width: var(--dd-icon-size);\n\tmax-width: var(--dd-icon-size);\n}\n\n.DropDown-module_select__mzNnv {\n\tposition: absolute;\n\topacity: 0;\n\twidth: 100%;\n\theight: 100%;\n\tfont-size: 14px;\n\tbackground-color: #1f99cd;\n\tbackground-position: right 10px center;\n\tbackground-repeat: no-repeat;\n\tbackground-size: auto 50%;\n\tborder: none;\n\toutline: none;\n\t-moz-appearance: none;\n\t-webkit-appearance: none;\n\tappearance: none;\n\t&::-ms-expand {\n\t\tdisplay: none;\n\t}\n}\n"), 
+styleInject(".flexBox-module_row__z24tF {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__5FEvi {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__4tcxS {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__rVdVm {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__ezvMq {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__C7P44 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__PKcrG {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__ERfp7 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__lLJuc {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__ZAFft {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__s3KvF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__Lhqqq {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__vRHSP {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__tjdFc {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__Iy-VX {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__LuQBA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__uW1on {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__UBcvQ {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__lOYbg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__BqRC7 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__Fh2dt {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__pF2kC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__BeyrH {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__Ruknj {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__z8L3G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__0O3g6 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__KXxEB {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__cJeEA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__eRe05 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Xmwtf {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__5q1m3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__k9VFV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.DropDown-module_wrapper__CyX0u {\n\tposition: relative;\n\tpadding: var(--dd-padding) !important;\n\tgap: var(--dd-gap);\n\tmin-width: var(--dd-width);\n\twidth: var(--dd-width);\n\tborder-radius: var(--dd-border-radius);\n\tbackground-color: var(--dd-bg-color);\n\tborder: var(--dd-border);\n\tborder-bottom: var(--dd-border-bottom);\n\ttransition: all var(--motion-water-duration) var(--motion-water) 0s;\n}\n\n.DropDown-module_face__6gyF3 {\n\tflex: 1;\n\toverflow: hidden;\n}\n\n.DropDown-module_faceText__glhB3 {\n\tdisplay: block;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n\tcolor: var(--dd-color);\n}\n\n.DropDown-module_label__Mrwbp {\n\twidth: min-content;\n\toverflow: hidden;\n\twhite-space: nowrap;\n\ttext-overflow: ellipsis;\n\tcolor: var(--dd-label-color);\n}\n\n.DropDown-module_xs__7L71q {\n}\n\n.DropDown-module_s__vAxXD {\n}\n\n.DropDown-module_m__K6JPk {\n}\n\n.DropDown-module_l__Kib48 {\n}\n\n.DropDown-module_chevron__LkYsE {\n\tmin-height: var(--dd-icon-size);\n\tmax-height: var(--dd-icon-size);\n\tmin-width: var(--dd-icon-size);\n\tmax-width: var(--dd-icon-size);\n}\n\n.DropDown-module_select__mzNnv {\n\tposition: absolute;\n\topacity: 0;\n\twidth: 100%;\n\theight: 100%;\n\tfont-size: 14px;\n\tbackground-color: #1f99cd;\n\tbackground-position: right 10px center;\n\tbackground-repeat: no-repeat;\n\tbackground-size: auto 50%;\n\tborder: none;\n\toutline: none;\n\t-moz-appearance: none;\n\t-webkit-appearance: none;\n\tappearance: none;\n\t&::-ms-expand {\n\t\tdisplay: none;\n\t}\n}\n"), 
 DropDownComponent.displayName = "DropDown";
 
 const DropDown = React.memo(DropDownComponent);

package/dist/esm/chunks/{FileList-BQ9X5YnB.mjs → FileList-DN4Ubroe.mjs}

@@ -9,9 +9,9 @@ import { s as setStyle, a as accessibleKeyDown } from "./misc-BeEWwOaJ.mjs";
 
 import { F as FileIcon } from "./FileIcon-Cufsp1gn.mjs";
 
-import { I as Icon } from "./Icon-DI32kOA1.mjs";
+import { I as Icon } from "./Icon-DRzjkybv.mjs";
 
-import { P as ProgressIndicator } from "./ProgressIndicator-CB_oazMD.mjs";
+import { P as ProgressIndicator } from "./ProgressIndicator-D5e7406q.mjs";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 

package/dist/esm/chunks/{FlexDiv-BFrVoFhC.mjs → FlexDiv-BWZ7f8mA.mjs}

@@ -5,20 +5,20 @@ import { jsx } from "react/jsx-runtime";
 
 import { motion } from "motion/react";
 
-import React, { useMemo } from "react";
+import React, { useMemo, useCallback } from "react";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 
 var Size, Preset, css_flexDiv = "FlexDiv-module_flexDiv__EY5A- type-module_body-m-regular__LuQBA";
 
-styleInject(".type-module_body-xs-regular__ZAFft {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__s3KvF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__Lhqqq {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__vRHSP {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__tjdFc {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__Iy-VX {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__LuQBA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__uW1on {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__UBcvQ {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__lOYbg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__BqRC7 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__Fh2dt {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__pF2kC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__BeyrH {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__Ruknj {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__z8L3G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__0O3g6 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__KXxEB {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__cJeEA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__eRe05 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Xmwtf {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__5q1m3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__k9VFV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.FlexDiv-module_flexDiv__EY5A- {\n\t&::-webkit-scrollbar {\n\t\tbackground-color: var(--flex-div-bg);\n\t\twidth: 14px;\n\t}\n\n\t&::-webkit-scrollbar-track {\n\t\tbackground-color: var(--flex-div-scroll-border);\n\t}\n\n\t&::-webkit-scrollbar-thumb {\n\t\tbackground-color: var(--flex-div-scroll-handle);\n\t\tborder-radius: 20px;\n\t\tborder: 4px solid var(--flex-div-scroll-border);\n\t}\n\n\t&::-webkit-scrollbar-thumb:hover {\n\t\tbackground-color: var(--flex-div-scroll-handle-hover);\n\t\tborder-radius: 20px;\n\t\tborder: 4px solid var(--flex-div-scroll-border);\n\t\tcursor: default;\n\t}\n}\n"), 
+styleInject(".type-module_body-xs-regular__ZAFft {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__s3KvF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__Lhqqq {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__vRHSP {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__tjdFc {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__Iy-VX {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__LuQBA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__uW1on {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__UBcvQ {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__lOYbg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__BqRC7 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__Fh2dt {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__pF2kC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__BeyrH {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__Ruknj {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__z8L3G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__0O3g6 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__KXxEB {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__cJeEA {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__eRe05 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Xmwtf {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__5q1m3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__k9VFV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.FlexDiv-module_flexDiv__EY5A- {\n\t&::-webkit-scrollbar {\n\t\tbackground-color: var(--flex-div-bg);\n\t\twidth: 6px;\n\t}\n\n\t&::-webkit-scrollbar-track {\n\t\tbackground-color: var(--flex-div-bg);\n\t\twidth: 6px;\n\t}\n\n\t&::-webkit-scrollbar-thumb {\n\t\tbackground-color: var(--flex-div-scroll-handle);\n\t\tborder-radius: 20px;\n\t\tborder: 1px solid var(--flex-div-bg);\n\t}\n\n\t&::-webkit-scrollbar-thumb:hover {\n\t\tbackground-color: var(--flex-div-scroll-handle-hover);\n\t\tborder-radius: 20px;\n\t\tborder: 1px solid var(--flex-div-bg);\n\t}\n}\n"), 
 function(Size) {
     Size.Grow = "grow", Size.Fill = "fill", Size.Fit = "fit", Size.Viewport = "viewport", 
     Size.Auto = "auto";
 }(Size || (Size = {})), function(Preset) {
-    Preset.FillScroll = "fill-scroll", Preset.FillCenter = "fill-center", Preset.Window = "window", 
-    Preset.Row = "row", Preset.RowBetween = "row-between", Preset.Column = "fill-column", 
-    Preset.Default = "default", Preset.Draggable = "draggable";
+    Preset.FillScroll = "fill-scroll", Preset.FillCenter = "fill-center", Preset.FillStart = "fill-start", 
+    Preset.Window = "window", Preset.Row = "row", Preset.RowBetween = "row-between", 
+    Preset.Column = "column", Preset.Default = "default", Preset.Draggable = "draggable";
 }(Preset || (Preset = {}));
 
 const layoutSets = {
@@ -28,6 +28,8 @@ const layoutSets = {
         justify: "start",
         align: "start",
         scrollY: !0,
+        scrollX: !1,
+        overflow: "hidden",
         direction: "column"
     },
     [Preset.FillCenter]: {
@@ -36,6 +38,18 @@ const layoutSets = {
         justify: "center",
         align: "center",
         scrollY: !1,
+        scrollX: !1,
+        overflow: "hidden",
+        direction: "column"
+    },
+    [Preset.FillStart]: {
+        width: "fill",
+        height: "fill",
+        justify: "start",
+        align: "start",
+        scrollY: !1,
+        scrollX: !1,
+        overflow: "hidden",
         direction: "column"
     },
     [Preset.Window]: {
@@ -44,6 +58,8 @@ const layoutSets = {
         justify: "start",
         align: "start",
         scrollY: !1,
+        scrollX: !1,
+        overflow: "hidden",
         direction: "row"
     },
     [Preset.Row]: {
@@ -51,7 +67,9 @@ const layoutSets = {
         height: "fit",
         justify: "start",
         align: "center",
-        scrollY: !1,
+        scrollY: void 0,
+        scrollX: void 0,
+        overflow: "hidden",
         direction: "row"
     },
     [Preset.RowBetween]: {
@@ -59,15 +77,19 @@ const layoutSets = {
         height: "fit",
         justify: "between",
         align: "center",
-        scrollY: !1,
+        scrollY: void 0,
+        scrollX: void 0,
+        overflow: "hidden",
         direction: "row"
     },
     [Preset.Column]: {
         width: "fill",
         height: "fit",
         justify: "start",
-        align: "center",
-        scrollY: !1,
+        align: "start",
+        scrollY: void 0,
+        scrollX: void 0,
+        overflow: "hidden",
         direction: "column"
     },
     [Preset.Default]: {
@@ -75,7 +97,9 @@ const layoutSets = {
         height: "fit",
         justify: "start",
         align: "start",
-        scrollY: !1,
+        scrollY: void 0,
+        scrollX: void 0,
+        overflow: "hidden",
         direction: "column"
     },
     [Preset.Draggable]: {
@@ -83,7 +107,9 @@ const layoutSets = {
         height: "fill",
         justify: "start",
         align: "start",
-        scrollY: !1,
+        scrollY: void 0,
+        scrollX: void 0,
+        overflow: "visible",
         direction: "column"
     }
 };
@@ -96,23 +122,37 @@ function setBox(style) {
     return "number" == typeof style ? `${style}px` : style;
 }
 
+function setPaddingRight(padding, scrollBox, pad = 4) {
+    return padding ? "number" == typeof padding ? `${padding}px` : padding : scrollBox ? `${pad}px` : "unset";
+}
+
 function setFlex(style) {
     return "start" === style || "top" === style ? "flex-start" : "end" === style || "bottom" === style ? "flex-end" : "between" === style ? "space-between" : style;
 }
 
 const FlexDiv = React.memo(React.forwardRef((props, ref) => {
-    const {children: children, preset: preset = "default", scrollY: scrollY = layoutSets[preset].scrollY, scrollX: scrollX = !1, background: background = "var(--core-surface-primary)", direction: direction = layoutSets[preset].direction, align: align = layoutSets[preset].align, justify: justify = layoutSets[preset].justify, height: height = layoutSets[preset].height, width: width = layoutSets[preset].width, maxWidth: maxWidth, centerSelf: centerSelf, wrap: wrap = !1, reverse: reverse = !1, padding: padding = 0, margin: margin = 0, absolute: absolute = !1, flex: flex, gap: gap, variants: variants, transition: transition, animate: animate, enter: enter, exit: exit, border: border, borderRadius: borderRadius, className: className, scrollHandle: scrollHandle, scrollHandleHover: scrollHandleHover} = props, divAttributes = __rest(props, [ "children", "preset", "scrollY", "scrollX", "background", "direction", "align", "justify", "height", "width", "maxWidth", "centerSelf", "wrap", "reverse", "padding", "margin", "absolute", "flex", "gap", "variants", "transition", "animate", "enter", "exit", "border", "borderRadius", "className", "scrollHandle", "scrollHandleHover" ]), {id: divId, style: userStyle} = divAttributes, rest = __rest(divAttributes, [ "id", "style" ]), wrapperStyle = null != userStyle ? userStyle : {}, style = useMemo(() => ({
+    const {children: children, preset: preset = "default", scrollY: scrollY, scrollX: scrollX, scrollBox: scrollBox = !1, background: background = "transparent", direction: direction, align: align, justify: justify, height: height, width: width, maxWidth: maxWidth, centerSelf: centerSelf, wrap: wrap = !1, reverse: reverse = !1, padding: padding = 0, margin: margin = 0, absolute: absolute = !1, flex: flex, gap: gap, variants: variants, transition: transition, animate: animate, enter: enter, exit: exit, border: border, borderRadius: borderRadius, className: className, scrollHandle: scrollHandle, scrollHandleHover: scrollHandleHover} = props, divAttributes = __rest(props, [ "children", "preset", "scrollY", "scrollX", "scrollBox", "background", "direction", "align", "justify", "height", "width", "maxWidth", "centerSelf", "wrap", "reverse", "padding", "margin", "absolute", "flex", "gap", "variants", "transition", "animate", "enter", "exit", "border", "borderRadius", "className", "scrollHandle", "scrollHandleHover" ]), {id: divId, style: userStyle} = divAttributes, rest = __rest(divAttributes, [ "id", "style" ]), wrapperStyle = null != userStyle ? userStyle : {}, presets = useMemo(() => ({
+        width: null != width ? width : layoutSets[preset].width,
+        height: null != height ? height : layoutSets[preset].height,
+        direction: null != direction ? direction : layoutSets[preset].direction,
+        align: null != align ? align : layoutSets[preset].align,
+        justify: null != justify ? justify : layoutSets[preset].justify,
+        scrollY: null != scrollY ? scrollY : layoutSets[preset].scrollY,
+        scrollX: null != scrollX ? scrollX : layoutSets[preset].scrollX,
+        overflow: layoutSets[preset].overflow
+    }), [ preset, width, height, direction, align, justify, scrollY, scrollX ]), setScroll = useCallback(value => void 0 === value ? "unset" : value ? "auto" : "hidden", []), style = useMemo(() => ({
         display: "flex",
         position: "" + (absolute ? "absolute" : "relative"),
-        flexDirection: `${direction}${reverse ? "-reverse" : ""}`,
+        flexDirection: `${presets.direction}${reverse ? "-reverse" : ""}`,
         flexWrap: "" + (wrap ? "wrap" : "nowrap"),
-        justifyContent: `${setFlex(justify)}`,
-        alignItems: `${setFlex(align)}`,
+        justifyContent: `${setFlex(presets.justify)}`,
+        alignItems: `${setFlex(presets.align)}`,
         boxSizing: "border-box",
         padding: `${setBox(padding)}`,
+        paddingRight: setPaddingRight(padding, scrollBox),
         margin: centerSelf ? "0 auto" : `${setBox(margin)}`,
-        width: `${absolute ? "unset" : setSize(width, !1)}`,
-        height: `${absolute ? "unset" : setSize(height, !0)}`,
+        width: `${absolute ? "unset" : setSize(presets.width, !1)}`,
+        height: `${absolute ? "unset" : setSize(presets.height, !0)}`,
         maxWidth: `${maxWidth ? setSize(maxWidth, !1) : "unset"}`,
         flex: `${absolute ? "unset" : null != flex ? flex : "unset"}`,
         top: "" + (absolute ? "0" : "unset"),
@@ -122,15 +162,15 @@ const FlexDiv = React.memo(React.forwardRef((props, ref) => {
         gap: gap ? `${gap}px` : "unset",
         border: `${null != border ? border : "unset"}`,
         background: `${null != background ? background : "transparent"}`,
-        overflow: "hidden",
-        overflowY: "" + (scrollY ? "auto" : "unset"),
-        overflowX: "" + (scrollX ? "auto" : "unset"),
+        overflow: presets.overflow,
+        overflowY: setScroll(presets.scrollY),
+        overflowX: setScroll(presets.scrollX),
         borderRadius: borderRadius ? `${borderRadius}px` : "unset",
         color: "var(--core-text-primary)",
         "--flex-div-scroll-border": `${null != background ? background : "transparent"}`,
         "--flex-div-scroll-handle": `${null != scrollHandle ? scrollHandle : "var(--scroll-bar)"}`,
         "--flex-div-scroll-handle-hover": `${null != scrollHandleHover ? scrollHandleHover : "var(--scroll-bar-hover)"}`
-    }), [ absolute, direction, reverse, wrap, justify, align, padding, margin, width, height, flex, gap, border, background, scrollY, scrollX, centerSelf, maxWidth, scrollHandle, scrollHandleHover, borderRadius ]);
+    }), [ absolute, reverse, wrap, padding, margin, flex, gap, border, background, centerSelf, maxWidth, scrollHandle, scrollHandleHover, borderRadius, setScroll, presets, scrollBox ]);
     return jsx(motion.div, Object.assign({
         id: divId,
         ref: ref,

package/dist/esm/chunks/{Grouper-CvPYEsF_.mjs → Grouper-C4A3qYot.mjs}

@@ -15,7 +15,7 @@ import "../hooks/useWindow.mjs";
 
 import { B as Badge } from "./Badge-CC0zSLMf.mjs";
 
-import { I as Icon } from "./Icon-DI32kOA1.mjs";
+import { I as Icon } from "./Icon-DRzjkybv.mjs";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 

package/dist/esm/chunks/{Icon-DI32kOA1.mjs → Icon-DRzjkybv.mjs}

@@ -1,7 +1,7 @@
 'use client';
 import { a as __rest } from "./tslib.es6-C-olHjXV.mjs";
 
-import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 
 import React, { useMemo } from "react";
 
@@ -23,7 +23,162 @@ styleInject(".Icon-module_icon__szG-X {\n\tcursor: var(--cursor);\n\tuser-select
  * Static icon registry created once at module load.
  * Each entry stores only icon line content renderers.
  */
-const STATIC_ICON_REGISTRY = new Map([ [ "sidebar", {
+const STATIC_ICON_REGISTRY = new Map([ [ "speaker", {
+    line: ({fillColor: fillColor, strokeColor: strokeColor}) => jsx("path", {
+        d: "M4.71,7.95v4.13c0,.37.3.66.66.66h3.31c.08,0,.17.03.23.09l4.81,4.21c.22.19.56.04.56-.25V3.15c0-.25-.3-.37-.47-.2l-4.21,4.21c-.06.06-.15.1-.24.1h-3.97c-.37,0-.68.3-.68.68Z",
+        fill: strokeColor,
+        fillOpacity: fillColor,
+        stroke: strokeColor,
+        strokeWidth: 1.5
+    })
+} ], [ "speaker muted", {
+    line: ({stroke: stroke, strokeColor: strokeColor, fillColor: fillColor}) => jsxs(Fragment, {
+        children: [ jsx("polygon", {
+            points: "4.82 8.35 9.61 12.51 4.82 12.51 4.82 8.35",
+            fill: strokeColor,
+            fillOpacity: fillColor
+        }), jsx("polygon", {
+            points: "8.51 7.58 14.51 12.78 14.5 3 14 2.5 8.51 7.58",
+            fill: strokeColor,
+            fillOpacity: fillColor
+        }), jsx("path", {
+            d: "M9.02,8.02h.34c.29,0,.57-.11.77-.32l3.41-3.41v7.65l1.5,1.3V3.15c0-.42-.25-.79-.64-.95-.39-.16-.83-.07-1.12.22l-4.09,4.09h-1.9l1.73,1.5Z",
+            fill: strokeColor
+        }), jsx("path", {
+            d: "M9.16,12.11c-.15-.07-.3-.12-.47-.12h-3.22v-3.09l-1.46-1.27c-.02.1-.04.2-.04.31v4.13c0,.78.63,1.41,1.41,1.41h3.16l4.7,4.11c.2.18.46.27.72.27.15,0,.31-.03.45-.1.27-.12.47-.35.57-.62l-5.81-5.04Z",
+            fill: strokeColor
+        }), jsx("line", {
+            x1: "3.25",
+            y1: "5",
+            x2: "16.5",
+            y2: "16.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            stroke: strokeColor,
+            strokeWidth: stroke,
+            fill: "none"
+        }) ]
+    })
+} ], [ "laptop", {
+    line: ({fillColor: fillColor, strokeColor: strokeColor}) => jsxs(Fragment, {
+        children: [ jsx("rect", {
+            x: "4",
+            y: "5",
+            width: "12",
+            height: "9",
+            rx: "1",
+            ry: "1",
+            fill: strokeColor,
+            opacity: fillColor
+        }), jsx("path", {
+            d: "M18,13.25h-1.25v-7.25c0-.96-.79-1.75-1.75-1.75H5c-.96,0-1.75.79-1.75,1.75v7.25h-1.25c-.41,0-.75.34-.75.75s.34.75.75.75h16c.41,0,.75-.34.75-.75s-.34-.75-.75-.75ZM4.75,6c0-.14.11-.25.25-.25h10c.14,0,.25.11.25.25v7.25H4.75v-7.25Z",
+            fill: strokeColor
+        }) ]
+    })
+} ], [ "moon full", {
+    line: ({strokeColor: strokeColor, fillColor: fillColor}) => jsxs(Fragment, {
+        children: [ jsx("circle", {
+            cx: "10",
+            cy: "10",
+            r: "6.5",
+            fill: "none",
+            stroke: strokeColor,
+            strokeWidth: 1.5
+        }), jsx("circle", {
+            cx: "10",
+            cy: "10",
+            r: "6.5",
+            fill: strokeColor,
+            fillOpacity: fillColor
+        }) ]
+    })
+} ], [ "sun", {
+    line: ({strokeColor: strokeColor, fillColor: fillColor}) => jsxs(Fragment, {
+        children: [ jsx("path", {
+            d: "M10,13.25c-1.79,0-3.25-1.46-3.25-3.25s1.46-3.25,3.25-3.25,3.25,1.46,3.25,3.25-1.46,3.25-3.25,3.25Z",
+            fill: strokeColor,
+            fillOpacity: fillColor
+        }), jsx("path", {
+            d: "M10,5.25c-2.62,0-4.75,2.13-4.75,4.75s2.13,4.75,4.75,4.75,4.75-2.13,4.75-4.75-2.13-4.75-4.75-4.75ZM10,13.25c-1.79,0-3.25-1.46-3.25-3.25s1.46-3.25,3.25-3.25,3.25,1.46,3.25,3.25-1.46,3.25-3.25,3.25Z",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "10",
+            cy: "2",
+            r: "1",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "15.7",
+            cy: "4.3",
+            r: "1",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "18.06",
+            cy: "10",
+            r: "1",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "1.95",
+            cy: "10",
+            r: "1",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "4.3",
+            cy: "15.7",
+            r: "1",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "10",
+            cy: "18.05",
+            r: "1",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "15.7",
+            cy: "15.7",
+            r: "1",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "4.3",
+            cy: "4.3",
+            r: "1",
+            fill: strokeColor
+        }) ]
+    })
+} ], [ "keyboard", {
+    line: ({strokeColor: strokeColor}) => jsxs(Fragment, {
+        children: [ jsx("path", {
+            d: "M17.26,16.46H2.75c-.96,0-1.75-.85-1.75-1.89V5.88c0-1.04.79-1.89,1.75-1.89h14.51c.96,0,1.75.85,1.75,1.89v8.69c0,1.04-.79,1.89-1.75,1.89ZM2.75,5.61c-.14,0-.25.12-.25.27v8.69c0,.15.11.27.25.27h14.51c.14,0,.25-.12.25-.27V5.88c0-.15-.11-.27-.25-.27H2.75Z",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "5.52",
+            cy: "8.52",
+            r: ".97",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "8.53",
+            cy: "8.52",
+            r: ".97",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "11.52",
+            cy: "8.52",
+            r: ".97",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "14.48",
+            cy: "8.52",
+            r: ".97",
+            fill: strokeColor
+        }), jsx("circle", {
+            cx: "14.48",
+            cy: "11.97",
+            r: ".97",
+            fill: strokeColor
+        }), jsx("path", {
+            d: "M11.52,11h-6c-.54,0-.97.44-.97.97s.44.97.97.97h6c.54,0,.97-.44.97-.97s-.44-.97-.97-.97Z",
+            fill: strokeColor
+        }) ]
+    })
+} ], [ "sidebar", {
     line: ({strokeColor: strokeColor, fillColor: fillColor}) => jsxs(Fragment, {
         children: [ jsx("rect", {
             x: "10",
@@ -83,8 +238,12 @@ const STATIC_ICON_REGISTRY = new Map([ [ "sidebar", {
         }) ]
     })
 } ], [ "mic", {
-    line: ({strokeColor: strokeColor}) => jsxs(Fragment, {
+    line: ({strokeColor: strokeColor, fillColor: fillColor}) => jsxs(Fragment, {
         children: [ jsx("path", {
+            d: "M10.25,11.75c1.65,0,3-1.35,3-3v-4.5c0-1.65-1.35-3-3-3s-3,1.35-3,3v4.5c0,1.65,1.35,3,3,3Z",
+            fill: strokeColor,
+            fillOpacity: fillColor
+        }), jsx("path", {
             d: "M10.25,11.75c1.65,0,3-1.35,3-3v-4.5c0-1.65-1.35-3-3-3s-3,1.35-3,3v4.5c0,1.65,1.35,3,3,3ZM8.75,4.25c0-.83.67-1.5,1.5-1.5s1.5.67,1.5,1.5v4.5c0,.83-.67,1.5-1.5,1.5s-1.5-.67-1.5-1.5v-4.5Z",
             fill: strokeColor
         }), jsx("path", {
@@ -839,10 +998,12 @@ const STATIC_ICON_REGISTRY = new Map([ [ "sidebar", {
         }) ]
     })
 } ], [ "share", {
-    line: ({stroke: stroke, strokeColor: strokeColor}) => jsx("path", {
+    line: ({stroke: stroke, strokeColor: strokeColor, fillColor: fillColor}) => jsx("path", {
         d: "M11 7c-5.063 0-8 4.03-8 9 1.222-1.2 3-3 8-3v3l6-6-6-6v3Z",
         stroke: strokeColor,
-        strokeWidth: stroke
+        strokeWidth: stroke,
+        fill: strokeColor,
+        fillOpacity: fillColor
     })
 } ], [ "search", {
     line: ({strokeColor: strokeColor}) => jsxs(Fragment, {
@@ -1078,11 +1239,23 @@ const STATIC_ICON_REGISTRY = new Map([ [ "sidebar", {
         fill: strokeColor
     })
 } ], [ "sparkle", {
-    line: ({strokeColor: strokeColor}) => jsx("path", {
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M10.5 2h.5a7 7 0 0 0 7 7v2a7 7 0 0 0-7 7H9a7 7 0 0 0-7-7V9a7 7 0 0 0 7-7h1.5ZM10 4.88A8.525 8.525 0 0 0 15.12 10 8.525 8.525 0 0 0 10 15.12 8.525 8.525 0 0 0 4.88 10 8.524 8.524 0 0 0 10 4.88ZM17 4a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM5 16a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z",
-        fill: strokeColor
+    line: ({strokeColor: strokeColor, fillColor: fillColor}) => jsxs(Fragment, {
+        children: [ jsx("path", {
+            d: "M10.5 2h.5a7 7 0 0 0 7 7v2a7 7 0 0 0-7 7H9a7 7 0 0 0-7-7V9a7 7 0 0 0 7-7h1.5ZM10 4.88A8.525 8.525 0 0 0 15.12 10 8.525 8.525 0 0 0 10 15.12 8.525 8.525 0 0 0 4.88 10 8.524 8.524 0 0 0 10 4.88Z",
+            fill: strokeColor,
+            fillOpacity: fillColor
+        }), jsx("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M10.5 2h.5a7 7 0 0 0 7 7v2a7 7 0 0 0-7 7H9a7 7 0 0 0-7-7V9a7 7 0 0 0 7-7h1.5ZM10 4.88A8.525 8.525 0 0 0 15.12 10 8.525 8.525 0 0 0 10 15.12 8.525 8.525 0 0 0 4.88 10 8.524 8.524 0 0 0 10 4.88ZM17 4a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM5 16a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z",
+            fill: strokeColor
+        }), jsx("path", {
+            d: "M17 4a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z",
+            fill: strokeColor
+        }), jsx("path", {
+            d: "M5 16a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z",
+            fill: strokeColor
+        }) ]
     })
 } ], [ "inbox", {
     line: ({strokeColor: strokeColor}) => jsx("path", {
@@ -1103,7 +1276,7 @@ const STATIC_ICON_REGISTRY = new Map([ [ "sidebar", {
     })
 } ] ]), Icon = React.memo(props => {
     var _a;
-    const theme = useTheme(), {name: name = "home", size: size = 20, stroke: stroke = 1.5, strokeColor: strokeColor = theme.current.colors["core-icon-primary"], fillColor: fillColor = .2, coverUp: coverUp = theme.current.colors["core-surface-primary"], toggle: toggle = !1, pointer: pointer = !1, disabled: disabled = !1, onClick: onClick} = props, svgAttributes = __rest(props, [ "name", "size", "stroke", "strokeColor", "fillColor", "coverUp", "toggle", "pointer", "disabled", "onClick" ]), {id: svgId, className: className, style: style} = svgAttributes, rest = __rest(svgAttributes, [ "id", "className", "style" ]), svgStyle = null != style ? style : {}, variantKey = toggle ? "lineOn" : "line", iconVariant = STATIC_ICON_REGISTRY.get(name), shape = null !== (_a = null == iconVariant ? void 0 : iconVariant[variantKey]) && void 0 !== _a ? _a : null == iconVariant ? void 0 : iconVariant.line, cursor = useMemo(() => disabled ? "default" : pointer ? "pointer" : "inherit", [ disabled, pointer ]), iconStyle = useMemo(() => ({
+    const theme = useTheme(), {name: name = "home", size: size = 20, stroke: stroke = 1.5, strokeColor: strokeColor = theme.current.colors["core-icon-primary"], fillColor: fillColor, fill: fill = !1, coverUp: coverUp = theme.current.colors["core-surface-primary"], toggle: toggle = !1, pointer: pointer = !1, disabled: disabled = !1, onClick: onClick} = props, svgAttributes = __rest(props, [ "name", "size", "stroke", "strokeColor", "fillColor", "fill", "coverUp", "toggle", "pointer", "disabled", "onClick" ]), {id: svgId, className: className, style: style} = svgAttributes, rest = __rest(svgAttributes, [ "id", "className", "style" ]), svgStyle = null != style ? style : {}, variantKey = toggle ? "lineOn" : "line", iconVariant = STATIC_ICON_REGISTRY.get(name), shape = null !== (_a = null == iconVariant ? void 0 : iconVariant[variantKey]) && void 0 !== _a ? _a : null == iconVariant ? void 0 : iconVariant.line, cursor = useMemo(() => disabled ? "default" : pointer ? "pointer" : "inherit", [ disabled, pointer ]), setFillColor = useMemo(() => fill ? fillColor || (theme.current.name.includes("dark") ? .2 : .125) : 0, [ fillColor, fill, theme.current.name ]), iconStyle = useMemo(() => ({
         "--cursor": cursor,
         "--pointer-events": onClick ? "auto" : "none"
     }), [ cursor, onClick ]), handleKeyActivate = useMemo(() => () => null == onClick ? void 0 : onClick(void 0), [ onClick ]);
@@ -1126,7 +1299,7 @@ const STATIC_ICON_REGISTRY = new Map([ [ "sidebar", {
         children: [ jsx("title", {}), shape({
             stroke: stroke,
             strokeColor: strokeColor,
-            fillColor: fillColor,
+            fillColor: setFillColor,
             coverUp: coverUp
         }) ]
     })) : null;