@apple-pie/slice 0.1.28 → 0.1.29

package/dist/esm/chunks/{Slider-Cav86rU6.mjs → Slider-CU0Zdlpu.mjs}

@@ -7,7 +7,7 @@ import React, { useRef, useState, useMemo, useCallback, useEffect } from "react"
 
 import { useObserveResize } from "../hooks/useObserveResize.mjs";
 
-import { p as pointerPosition } from "./misc-BeEWwOaJ.mjs";
+import { p as pointerPosition } from "./misc-Bjbro8Xe.mjs";
 
 import { d as debounce } from "./debounce-Bst1jxMS.mjs";
 
@@ -15,14 +15,18 @@ import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 
 var css_wrapper = "Slider-module_wrapper__KCCs1", css_trackBg = "Slider-module_trackBg__7zfqm flexBox-module_rowStart__4tcxS", css_track = "Slider-module_track__kaJkL flexBox-module_rowStart__4tcxS", css_trackHead = "Slider-module_trackHead__W-UdG", css_trackWrapper = "Slider-module_trackWrapper__Ot0Wh flexBox-module_rowStart__4tcxS";
 
-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}\n\n.Slider-module_wrapper__KCCs1 {\n\tposition: relative;\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0 var(--slider-padding);\n\tmargin: 0;\n\twidth: var(--slider-width);\n\theight: auto;\n\tmin-height: var(--slider-touch-height);\n\tcursor: var(--slider-cursor);\n\tbackground: transparent;\n}\n\n.Slider-module_trackBg__7zfqm {\n\tposition: relative;\n\twidth: 100%;\n\theight: var(--slider-height);\n\tbackground-color: var(--slider-track-color);\n\toverflow: hidden;\n\tborder-radius: 100px;\n}\n\n.Slider-module_track__kaJkL {\n\tposition: absolute;\n\ttop: 0;\n\tbottom: 0;\n\twidth: 0;\n\tbackground-color: var(--slider-progress-color);\n\toverflow: visible;\n\tborder-radius: 100px;\n}\n\n.Slider-module_trackHead__W-UdG {\n\tposition: absolute;\n\tdisplay: var(--slider-head-display);\n\tbackground-color: var(--slider-head-color);\n\tborder-radius: var(--slider-head-radius);\n\tmax-width: var(--slider-head-width);\n\tmax-height: var(--slider-head-size);\n\tmin-width: var(--slider-head-width);\n\tmin-height: var(--slider-head-size);\n\ttop: 50%;\n\ttransform: translateY(-50%) translateX(-50%);\n}\n\n.Slider-module_trackWrapper__Ot0Wh {\n\tposition: relative;\n\twidth: 100%;\n\theight: var(--slider-height);\n\tmin-height: var(--slider-touch-height);\n\tbackground-color: transparent;\n\tborder-radius: 100px;\n\toverflow: visible;\n\toutline: none;\n}\n\n.Slider-module_trackWrapper__Ot0Wh:focus-visible {\n\toutline: 2px solid var(--core-link-primary);\n\toutline-offset: 2px;\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}\n\n.Slider-module_wrapper__KCCs1 {\n\tposition: relative;\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0 var(--slider-padding);\n\tmargin: 0;\n\twidth: var(--slider-width);\n\theight: auto;\n\tmin-height: var(--slider-touch-height);\n\tcursor: var(--slider-cursor);\n\topacity: var(--slider-opacity);\n\tbackground: transparent;\n}\n\n.Slider-module_trackBg__7zfqm {\n\tposition: relative;\n\twidth: 100%;\n\theight: var(--slider-height);\n\tbackground-color: var(--slider-track-color);\n\toverflow: hidden;\n\tborder-radius: 100px;\n}\n\n.Slider-module_track__kaJkL {\n\tposition: absolute;\n\ttop: 0;\n\tbottom: 0;\n\twidth: 0;\n\tbackground-color: var(--slider-progress-color);\n\toverflow: visible;\n\tborder-radius: 100px;\n}\n\n.Slider-module_trackHead__W-UdG {\n\tposition: absolute;\n\tdisplay: var(--slider-head-display);\n\tbackground-color: var(--slider-head-color);\n\tborder: var(--slider-track-head-border);\n\tborder-radius: var(--slider-head-radius);\n\tmax-width: var(--slider-head-width);\n\tmax-height: var(--slider-head-size);\n\tmin-width: var(--slider-head-width);\n\tmin-height: var(--slider-head-size);\n\ttop: 50%;\n\ttransform: translateY(-50%) translateX(-50%);\n}\n\n.Slider-module_trackWrapper__Ot0Wh {\n\tposition: relative;\n\twidth: 100%;\n\theight: var(--slider-height);\n\tmin-height: var(--slider-touch-height);\n\tbackground-color: transparent;\n\tborder-radius: 4px;\n\toverflow: visible;\n\toutline: none;\n}\n\n.Slider-module_trackWrapper__Ot0Wh:focus-visible {\n\toutline: 2px solid var(--core-link-primary);\n\toutline-offset: 2px;\n}\n");
 
 const Slider = React.memo(props => {
-    const {value: value = 25, scaleMin: scaleMin = 0, scaleMax: scaleMax = 100, width: width, height: height = 2, touchHeight: touchHeight = 24, trackHeadSize: trackHeadSize = 7, cursor: cursor = "default", headColor: headColor = "var(--core-text-primary)", trackColor: trackColor = "var(--core-surface-secondary)", progressColor: progressColor = "var(--core-text-primary)", onChange: onChange = () => null, onDragChange: onDragChange = () => null} = props, divAttributes = __rest(props, [ "value", "scaleMin", "scaleMax", "width", "height", "touchHeight", "trackHeadSize", "cursor", "headColor", "trackColor", "progressColor", "onChange", "onDragChange" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", ref = useRef(null), track = useRef(null), head = useRef(null), [currentValue, setCurrentValue] = useState(value), absProgressRef = useRef(value), relativeProgressRef = useRef(0), didMount = useRef(!1), size = useObserveResize(ref, {
+    const {value: value = 25, scaleMin: scaleMin = 0, scaleMax: scaleMax = 100, width: width, height: height = 2, touchHeight: touchHeight = 24, trackHeadSize: trackHeadSize = 7, step: step, disabled: disabled = !1, disabledOpacity: disabledOpacity = .5, cursor: cursor = "default", headColor: headColor = "var(--core-text-light)", trackColor: trackColor = "var(--core-surface-secondary)", progressColor: progressColor = "var(--core-text-tertiary)", trackHeadBorderSize: trackHeadBorderSize = 1, trackHeadBorderColor: trackHeadBorderColor = "var(--core-outline-secondary)", onChange: onChange = () => null, onDragChange: onDragChange = () => null} = props, divAttributes = __rest(props, [ "value", "scaleMin", "scaleMax", "width", "height", "touchHeight", "trackHeadSize", "step", "disabled", "disabledOpacity", "cursor", "headColor", "trackColor", "progressColor", "trackHeadBorderSize", "trackHeadBorderColor", "onChange", "onDragChange" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", ref = useRef(null), track = useRef(null), head = useRef(null), [currentValue, setCurrentValue] = useState(value), absProgressRef = useRef(value), relativeProgressRef = useRef(0), didMount = useRef(!1), size = useObserveResize(ref, {
         ignore: "height"
     }), debouncedOnChange = debounce((value, percent) => {
         onChange(value, percent);
-    }, 0), padding = useMemo(() => trackHeadSize ? Math.ceil(trackHeadSize / 2) : 0, [ trackHeadSize ]), clampValue = useCallback(nextValue => Math.min(scaleMax, Math.max(scaleMin, nextValue)), [ scaleMax, scaleMin ]), valueToPercent = useCallback(nextValue => {
+    }, 0), padding = useMemo(() => trackHeadSize ? Math.ceil(trackHeadSize / 2) : 0, [ trackHeadSize ]), clampValue = useCallback(nextValue => Math.min(scaleMax, Math.max(scaleMin, nextValue)), [ scaleMax, scaleMin ]), stepIncrement = useMemo(() => {
+        if (step) return step;
+        const range = scaleMax - scaleMin;
+        return range <= 0 ? 0 : Math.max(range / 100, .01);
+    }, [ step, scaleMin, scaleMax ]), valueToPercent = useCallback(nextValue => {
         const range = scaleMax - scaleMin;
         return range <= 0 ? 0 : (nextValue - scaleMin) / range;
     }, [ scaleMax, scaleMin ]), setTrackAndHead = useCallback(pixelPos => {
@@ -60,12 +64,12 @@ const Slider = React.memo(props => {
         return pos > sliderWidth ? pos = sliderWidth : pos < 0 && (pos = 0), setTrackAndHead(pos), 
         pos;
     }, [ setTrackAndHead ]), handleMouseMove = useCallback(e => {
-        e.preventDefault();
+        if (e.preventDefault(), disabled) return;
         if (null == ref ? void 0 : ref.current) {
             const pos = updateSlider(e);
             progress(pos), debouncedOnChange(absProgressRef.current, relativeProgressRef.current);
         }
-    }, [ progress, updateSlider, debouncedOnChange ]), handleMouseUp = useCallback(e => {
+    }, [ progress, updateSlider, debouncedOnChange, disabled ]), handleMouseUp = useCallback(e => {
         e.preventDefault();
         if (null == ref ? void 0 : ref.current) {
             const pos = updateSlider(e);
@@ -75,27 +79,19 @@ const Slider = React.memo(props => {
         globalThis.removeEventListener("mousemove", handleMouseMove, !1), globalThis.removeEventListener("touchmove", handleMouseMove, !1), 
         globalThis.removeEventListener("mouseup", handleMouseUp, !1), globalThis.removeEventListener("touchend", handleMouseUp, !1);
     }, [ handleMouseMove, progress, updateSlider, debouncedOnChange, onDragChange, onChange ]), handleKeyDown = useCallback(event => {
-        const range = scaleMax - scaleMin;
-        if (range <= 0) return;
-        const step = Number.isInteger(scaleMin) && Number.isInteger(scaleMax) ? 1 : Math.max(range / 100, .01), pageStep = Math.max(step, range / 10);
+        if (disabled) return;
         let nextValue = null;
         switch (event.key) {
           case "ArrowRight":
           case "ArrowUp":
-            nextValue = absProgressRef.current + step;
+          case "PageUp":
+            nextValue = absProgressRef.current + stepIncrement;
             break;
 
           case "ArrowLeft":
           case "ArrowDown":
-            nextValue = absProgressRef.current - step;
-            break;
-
-          case "PageUp":
-            nextValue = absProgressRef.current + pageStep;
-            break;
-
           case "PageDown":
-            nextValue = absProgressRef.current - pageStep;
+            nextValue = absProgressRef.current - stepIncrement;
             break;
 
           case "Home":
@@ -106,16 +102,15 @@ const Slider = React.memo(props => {
             nextValue = scaleMax;
         }
         null !== nextValue && (event.preventDefault(), debouncedOnChange.cancel(), commitValue(nextValue, "change"));
-    }, [ scaleMin, scaleMax, debouncedOnChange, commitValue ]), handleMouseDown = useCallback(e => {
-        e.preventDefault(), e.stopPropagation(), globalThis.addEventListener("mousemove", handleMouseMove, !1), 
-        globalThis.addEventListener("touchmove", handleMouseMove, !1), globalThis.addEventListener("mouseup", handleMouseUp, !1), 
-        globalThis.addEventListener("touchend", handleMouseUp, !1);
+    }, [ scaleMin, scaleMax, debouncedOnChange, commitValue, stepIncrement, disabled ]), handleMouseDown = useCallback(e => {
+        if (e.preventDefault(), e.stopPropagation(), disabled) return;
+        globalThis.addEventListener("mousemove", handleMouseMove, !1), globalThis.addEventListener("touchmove", handleMouseMove, !1), 
+        globalThis.addEventListener("mouseup", handleMouseUp, !1), globalThis.addEventListener("touchend", handleMouseUp, !1);
         if (null == ref ? void 0 : ref.current) {
             const pos = updateSlider(e);
-            progress(pos), debouncedOnChange.cancel(), onChange(absProgressRef.current, relativeProgressRef.current), 
-            onDragChange(absProgressRef.current, relativeProgressRef.current);
+            progress(pos), debouncedOnChange.cancel(), onChange(absProgressRef.current, relativeProgressRef.current);
         }
-    }, [ handleMouseMove, handleMouseUp, onChange, onDragChange, progress, updateSlider, debouncedOnChange ]);
+    }, [ handleMouseMove, handleMouseUp, onChange, progress, updateSlider, debouncedOnChange, disabled ]);
     useEffect(() => {
         didMount.current && value === absProgressRef.current || initialProgress(value);
     }, [ value, initialProgress ]), useEffect(() => {
@@ -131,7 +126,7 @@ const Slider = React.memo(props => {
         const sliderWidth = null === (_a = null == ref ? void 0 : ref.current) || void 0 === _a ? void 0 : _a.offsetWidth;
         sliderWidth && 0 !== size.width && setTrackAndHead(relativeProgressRef.current * sliderWidth);
     }, [ size.width, setTrackAndHead ]);
-    const trackHeadColor = useMemo(() => trackHeadSize && 0 !== trackHeadSize ? null != headColor ? headColor : "var(--core-text-primary)" : "transparent", [ headColor, trackHeadSize ]), setWidth = useMemo(() => width && "string" == typeof width ? "auto" === width ? "100%" : width : `${null != width ? width : 100}px`, [ width ]), cssVars = useMemo(() => ({
+    const trackHeadColor = useMemo(() => trackHeadSize && 0 !== trackHeadSize ? null != headColor ? headColor : "var(--core-text-primary)" : "transparent", [ headColor, trackHeadSize ]), setWidth = useMemo(() => width && "string" == typeof width ? "auto" === width ? "100%" : width : `${null != width ? width : 100}px`, [ width ]), setHeadBorder = useMemo(() => trackHeadBorderSize && 0 !== trackHeadBorderSize ? `${trackHeadBorderSize}px solid ${trackHeadBorderColor}` : "unset", [ trackHeadBorderColor, trackHeadBorderSize ]), cssVars = useMemo(() => ({
         "--slider-padding": `${padding}px`,
         "--slider-width": setWidth,
         "--slider-height": `${height}px`,
@@ -143,8 +138,10 @@ const Slider = React.memo(props => {
         "--slider-head-width": `${null != trackHeadSize ? trackHeadSize : 0}px`,
         "--slider-head-color": trackHeadColor,
         "--slider-progress-color": null != progressColor ? progressColor : "var(--core-text-primary)",
-        "--slider-track-color": null != trackColor ? trackColor : "var(--core-surface-secondary)"
-    }), [ padding, height, touchHeight, cursor, progressColor, trackColor, trackHeadSize, trackHeadColor, setWidth ]);
+        "--slider-track-color": null != trackColor ? trackColor : "var(--core-surface-secondary)",
+        "--slider-track-head-border": setHeadBorder,
+        "--slider-opacity": disabled ? disabledOpacity : "1"
+    }), [ padding, height, touchHeight, cursor, progressColor, trackColor, trackHeadSize, trackHeadColor, setWidth, setHeadBorder, disabled, disabledOpacity ]);
     return jsx("div", Object.assign({
         id: divId,
         className: `${css_wrapper}${divClass}`,

package/dist/esm/chunks/{TabBar-DBoZ8aoV.mjs → TabBar-v8Dp4dr-.mjs}

@@ -13,9 +13,9 @@ import "../hooks/useWindow.mjs";
 
 import { B as Badge } from "./Badge-CC0zSLMf.mjs";
 
-import { I as Icon } from "./Icon-DRzjkybv.mjs";
+import { I as Icon } from "./Icon-BOJAk-hM.mjs";
 
-import { I as IconButton } from "./IconButton-b1v9Me0P.mjs";
+import { I as IconButton } from "./IconButton-Ck0IMn4i.mjs";
 
 import { T as ToolTipType } from "./sharedTypes-tn9-uJvb.mjs";
 
@@ -28,13 +28,13 @@ styleInject(".flexBox-module_row__z24tF {\n\tdisplay: flex;\n\tjustify-content:
 const placeholderOptions = [ {
     name: "Light",
     value: "Option 1",
-    icon: "circle"
+    icon: "sun"
 }, {
     name: "Dark",
     value: "Option 2",
-    icon: "target"
+    icon: "moon full"
 } ], TabBar = React.memo(props => {
-    const {options: options = placeholderOptions, selected: selected = 0, border: border = !0, underline: underline = !0, height: height = "100%", width: width = "100%", tabWidth: tabWidth = "fill", padding: padding = 8, iconSize: iconSize = 20, iconGap: iconGap = 8, tabGap: tabGap = 0, disabled: disabled = !1, hasClose: hasClose = !1, closeWidth: closeWidth = "auto", selectedValue: selectedValue = null, onChange: onChange = () => null, onTabChange: onTabChange = () => null, onClose: onClose = () => null, onToolTip: onToolTip = () => null} = props, divAttributes = __rest(props, [ "options", "selected", "border", "underline", "height", "width", "tabWidth", "padding", "iconSize", "iconGap", "tabGap", "disabled", "hasClose", "closeWidth", "selectedValue", "onChange", "onTabChange", "onClose", "onToolTip" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [index, setIndex] = useState(selected), optionRefs = useRef([]);
+    const {options: options = placeholderOptions, selected: selected = 0, border: border = !0, underline: underline = !0, height: height = "100%", width: width = "100%", tabWidth: tabWidth = "fill", padding: padding = 8, iconFill: iconFill = !1, iconSize: iconSize = 20, iconGap: iconGap = 8, tabGap: tabGap = 0, disabled: disabled = !1, hasClose: hasClose = !1, closeWidth: closeWidth = "auto", selectedValue: selectedValue = null, onChange: onChange = () => null, onTabChange: onTabChange = () => null, onClose: onClose = () => null, onToolTip: onToolTip = () => null} = props, divAttributes = __rest(props, [ "options", "selected", "border", "underline", "height", "width", "tabWidth", "padding", "iconFill", "iconSize", "iconGap", "tabGap", "disabled", "hasClose", "closeWidth", "selectedValue", "onChange", "onTabChange", "onClose", "onToolTip" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [index, setIndex] = useState(selected), optionRefs = useRef([]);
     useEffect(() => {
         let selectedIndex = 0;
         selectedValue && options ? (selectedIndex = options.findIndex(option => option.value === selectedValue), 
@@ -84,11 +84,12 @@ const placeholderOptions = [ {
         onKeyDown: handleOptionKeyDown,
         onToolTip: onToolTip,
         underline: underline,
+        iconFill: iconFill,
         tabWidth: tabWidth,
         buttonRef: element => {
             optionRefs.current[i] = element;
         }
-    }, `${i}_option_${option.name}`)), [ options, index, padding, iconSize, iconGap, disabled, underline, tabWidth, onToolTip, handleOptionClick, handleOptionKeyDown ]), setStyle = useCallback(value => "string" == typeof value ? value : `${value}px`, []), cssVars = useMemo(() => ({
+    }, `${i}_option_${option.name}`)), [ options, index, padding, iconSize, iconGap, disabled, underline, tabWidth, onToolTip, handleOptionClick, iconFill, handleOptionKeyDown ]), setStyle = useCallback(value => "string" == typeof value ? value : `${value}px`, []), cssVars = useMemo(() => ({
         "--tab-bar-gap": `${tabGap}px`,
         "--tab-bar-height": `${setStyle(height)}px`,
         "--tab-bar-width": setStyle(width),
@@ -111,7 +112,8 @@ const placeholderOptions = [ {
                 toggle: !1,
                 hover: !0,
                 icon: "x",
-                onClick: onClose
+                onClick: onClose,
+                iconFill: iconFill
             })
         }) ]
     }));
@@ -120,7 +122,7 @@ const placeholderOptions = [ {
 TabBar.displayName = "TabBar";
 
 const Option = React.memo(props => {
-    const theme = useTheme(), {label: label = "Option", value: value = 0, icon: icon = null, selected: selected = !1, onClick: onClick = () => null, onToolTip: onToolTip = () => null, padding: padding = 8, iconSize: iconSize = 20, iconGap: iconGap = 6, disabled: disabled = !1, showToolTip: showToolTip = null, underline: underline = !0, tabWidth: tabWidth = "fill", count: count = 0, onKeyDown: onKeyDown = () => null, buttonRef: buttonRef} = props, ref = useRef(null), strokeColor = useMemo(() => !disabled && selected ? theme.current.colors["core-text-special"] : disabled ? theme.current.colors["core-text-disabled"] : theme.current.colors["core-text-primary"], [ disabled, selected, theme ]), handleMouseOver = useCallback(e => {
+    const theme = useTheme(), {label: label = "Option", value: value = 0, icon: icon = null, selected: selected = !1, onClick: onClick = () => null, onToolTip: onToolTip = () => null, padding: padding = 8, iconSize: iconSize = 20, iconGap: iconGap = 6, disabled: disabled = !1, showToolTip: showToolTip = null, underline: underline = !0, tabWidth: tabWidth = "fill", count: count = 0, iconFill: iconFill = !1, onKeyDown: onKeyDown = () => null, buttonRef: buttonRef} = props, ref = useRef(null), strokeColor = useMemo(() => !disabled && selected ? theme.current.colors["core-text-special"] : disabled ? theme.current.colors["core-text-disabled"] : theme.current.colors["core-text-primary"], [ disabled, selected, theme ]), handleMouseOver = useCallback(e => {
         if (onToolTip(null), showToolTip && ref.current) {
             const tip = {
                 type: ToolTipType.button,
@@ -162,6 +164,7 @@ const Option = React.memo(props => {
             className: css_icon,
             children: jsx(Icon, {
                 name: icon,
+                fill: iconFill,
                 size: iconSize,
                 strokeColor: strokeColor
             })

package/dist/esm/chunks/{TextArea-CSUDfcYd.mjs → TextArea-DGF43RON.mjs}

@@ -5,7 +5,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
 
 import React, { useState, useRef, useCallback, useEffect, useMemo } from "react";
 
-import { B as Button } from "./Button-BIbAGVV8.mjs";
+import { B as Button } from "./Button-CYFpitCp.mjs";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 

package/dist/esm/chunks/{TextField-Z1O858hB.mjs → TextField-j4q0RUzH.mjs}

@@ -11,15 +11,15 @@ import { useTheme } from "../hooks/useTheme.mjs";
 
 import "../theme/colors.mjs";
 
-import { s as setStyle } from "./misc-BeEWwOaJ.mjs";
+import { s as setStyle } from "./misc-Bjbro8Xe.mjs";
 
 import "../hooks/useWindow.mjs";
 
-import { B as Button } from "./Button-BIbAGVV8.mjs";
+import { B as Button } from "./Button-CYFpitCp.mjs";
 
-import { I as Icon } from "./Icon-DRzjkybv.mjs";
+import { I as Icon } from "./Icon-BOJAk-hM.mjs";
 
-import { I as IconButton } from "./IconButton-b1v9Me0P.mjs";
+import { I as IconButton } from "./IconButton-Ck0IMn4i.mjs";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 

package/dist/esm/chunks/{Tip-B8YrmJEt.mjs → Tip-Bj9d-230.mjs}

@@ -7,7 +7,7 @@ import { motion } from "motion/react";
 
 import React, { useState, useRef, useEffect, useMemo } from "react";
 
-import { f as filterClasses } from "./misc-BeEWwOaJ.mjs";
+import { f as filterClasses } from "./misc-Bjbro8Xe.mjs";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 

package/dist/esm/chunks/{Toast-QQ6GMr5F.mjs → Toast-CoioLlEG.mjs}

@@ -11,11 +11,11 @@ import { useTheme } from "../hooks/useTheme.mjs";
 
 import "../theme/colors.mjs";
 
-import { s as setStyle, f as filterClasses, a as accessibleKeyDown } from "./misc-BeEWwOaJ.mjs";
+import { s as setStyle, f as filterClasses, a as accessibleKeyDown } from "./misc-Bjbro8Xe.mjs";
 
 import "../hooks/useWindow.mjs";
 
-import { I as Icon } from "./Icon-DRzjkybv.mjs";
+import { I as Icon } from "./Icon-BOJAk-hM.mjs";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 
@@ -27,14 +27,14 @@ var ToastType, css = {
     l: "Toast-module_l__-W0PD type-module_body-l-regular__lOYbg"
 };
 
-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.Toast-module_wrapper__1uj9O {\n\tpadding: var(--toast-padding) !important;\n\tcolor: var(--toast-color);\n\tposition: fixed;\n\tborder: var(--toast-border);\n\tborder-radius: var(--toast-border-radius);\n\tbackground: var(--toast-background);\n\tz-index: var(--elevation-status);\n\tgap: 16px;\n\tbox-shadow: var(--surface-shadow-soft);\n\tleft: 50%;\n\ttransform: translateX(-50%);\n}\n\n.Toast-module_close__i10-s {\n\tmin-height: 20px;\n\tmax-height: 20px;\n\tmin-width: 20px;\n\tmax-width: 20px;\n}\n\n.Toast-module_s__kc5Ef {\n}\n\n.Toast-module_m__JtmLz {\n}\n.Toast-module_l__-W0PD {\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.Toast-module_wrapper__1uj9O {\n\tpadding: var(--toast-padding) !important;\n\tcolor: var(--toast-color);\n\tposition: var(--toast-position);\n\tborder: var(--toast-border);\n\tborder-radius: var(--toast-border-radius);\n\tbackground: var(--toast-background);\n\tz-index: var(--elevation-status);\n\tgap: 16px;\n\tbox-shadow: var(--surface-shadow-soft);\n\tleft: 50%;\n\ttransform: translateX(-50%);\n}\n\n.Toast-module_close__i10-s {\n\tmin-height: 20px;\n\tmax-height: 20px;\n\tmin-width: 20px;\n\tmax-width: 20px;\n\tcursor: pointer;\n}\n\n.Toast-module_s__kc5Ef {\n}\n\n.Toast-module_m__JtmLz {\n}\n.Toast-module_l__-W0PD {\n}\n"), 
 function(ToastType) {
     ToastType.Success = "success", ToastType.Error = "error", ToastType.Warning = "warning", 
     ToastType.Info = "info";
 }(ToastType || (ToastType = {}));
 
 const ToastBase = React.forwardRef((props, ref) => {
-    const {message: message = null, size: size = "m", border: border = !0, padding: padding, radius: radius = 8, showDelay: showDelay = 0, duration: duration = 5e3, position: position = "bottom", offset: offset = 24, close: close = !0, type: type = ToastType.Info, didHide: didHide = () => null} = props, divAttributes = __rest(props, [ "message", "size", "border", "padding", "radius", "showDelay", "duration", "position", "offset", "close", "type", "didHide" ]), theme = useTheme(), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? `${className}` : "", [ready, setReady] = useState(!1), [content, setContent] = useState(null), timer = useRef(null);
+    const {message: message = null, size: size = "m", border: border = !0, padding: padding, radius: radius = 8, container: container = "window", showDelay: showDelay = 0, duration: duration = 5e3, position: position = "bottom", offset: offset = 24, close: close = !0, type: type = ToastType.Info, didHide: didHide = () => null} = props, divAttributes = __rest(props, [ "message", "size", "border", "padding", "radius", "container", "showDelay", "duration", "position", "offset", "close", "type", "didHide" ]), theme = useTheme(), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? `${className}` : "", [ready, setReady] = useState(!1), [content, setContent] = useState(null), timer = useRef(null);
     useEffect(() => {
         timer.current && clearTimeout(timer.current);
         return message && message.length > 0 ? timer.current = setTimeout(() => {
@@ -80,8 +80,9 @@ const ToastBase = React.forwardRef((props, ref) => {
         "--toast-background": colorScheme.bg,
         "--toast-color": colorScheme.text,
         "--toast-border": border ? `1px solid ${colorScheme.border}` : "unset",
-        "--toast-border-radius": setStyle(radius, 4)
-    }), [ padding, border, colorScheme, radius, defaultPadding ]), variants = useMemo(() => {
+        "--toast-border-radius": setStyle(radius, 4),
+        "--toast-position": "window" === container ? "fixed" : "absolute"
+    }), [ padding, border, colorScheme, radius, defaultPadding, container ]), variants = useMemo(() => {
         const positionShow = "bottom" === position ? {
             bottom: offset
         } : {

package/dist/esm/chunks/{ToggleButton-B5oobnXJ.mjs → ToggleButton-CwTm8Yx0.mjs}

@@ -2,9 +2,9 @@ import { jsxs, jsx } from "react/jsx-runtime";
 
 import { useMemo } from "react";
 
-import { I as IconButton } from "./IconButton-b1v9Me0P.mjs";
+import { I as IconButton } from "./IconButton-Ck0IMn4i.mjs";
 
-import { L as Label } from "./Label-CvCDAg1y.mjs";
+import { L as Label } from "./Label-DSfCcKtQ.mjs";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 

package/dist/esm/chunks/{UploadArea-CJAQmqOS.mjs → UploadArea-DAwoJxtr.mjs}

@@ -3,15 +3,15 @@ import { jsxs, jsx } from "react/jsx-runtime";
 
 import React, { useState, useRef, useId, useCallback, useMemo } from "react";
 
-import { s as setStyle, a as accessibleKeyDown } from "./misc-BeEWwOaJ.mjs";
+import { s as setStyle, a as accessibleKeyDown } from "./misc-Bjbro8Xe.mjs";
 
-import { I as Icon } from "./Icon-DRzjkybv.mjs";
+import { F as FileList } from "./FileList-CxHaEEUi.mjs";
 
-import { P as ProgressIndicator } from "./ProgressIndicator-D5e7406q.mjs";
+import { I as Icon } from "./Icon-BOJAk-hM.mjs";
 
-import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
+import { P as ProgressIndicator } from "./ProgressIndicator-d2JGUDW_.mjs";
 
-import { F as FileList } from "./FileList-DN4Ubroe.mjs";
+import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 
 var css = {
     wrapper: "UploadArea-module_wrapper__aircC flexBox-module_column__ezvMq",

package/dist/esm/chunks/{_types-fSW-DudT.mjs → _types-BVrr_Khp.mjs}

@@ -39,7 +39,9 @@ const SliceIcons = {
         download: "download",
         upload: "upload",
         speaker: "speaker",
-        speakerMuted: "speaker muted"
+        speakerMuted: "speaker muted",
+        speakerHigh: "speaker high",
+        speakerLow: "speaker low"
     },
     files: {
         document: "document",
@@ -48,7 +50,8 @@ const SliceIcons = {
     },
     people: {
         people: "people",
-        person: "person"
+        person: "person",
+        talk: "talk"
     },
     business: {
         briefcase: "briefcase",
@@ -119,6 +122,7 @@ const SliceIcons = {
         menu: "menu",
         more: "more",
         sidebar: "sidebar",
+        sidebarSplit: "sidebar split",
         keyboard: "keyboard",
         x: "x"
     }

package/dist/esm/chunks/{microphoneStore-t16oxjGB.mjs → microphoneStore-Dr3lxoWX.mjs}

@@ -14,8 +14,11 @@ const emptyMicStreamRef = {
 function createEmptyState() {
     return {
         micStream: emptyMicStreamRef,
+        processedMicStream: emptyMicStreamRef,
         micTrack: emptyMicTrackRef,
+        currentDeviceId: null,
         isActive: !1,
+        inputVolume: 1,
         muted: !0,
         isSupported: !1,
         isRequesting: !1,
@@ -43,6 +46,10 @@ function createBoundActions(microphone, clearState) {
             return null !== (_a = null == microphone ? void 0 : microphone.unmuteMic()) && void 0 !== _a && _a;
         },
         toggleMute: () => null == microphone ? void 0 : microphone.toggleMute(),
+        setInputVolume: volume => {
+            var _a;
+            return null !== (_a = null == microphone ? void 0 : microphone.setInputVolume(volume)) && void 0 !== _a ? _a : 1;
+        },
         refreshMicrophones: () => __awaiter(this, void 0, void 0, function*() {
             var _a;
             return null !== (_a = null == microphone ? void 0 : microphone.refreshMicrophones()) && void 0 !== _a ? _a : [];
@@ -67,8 +74,11 @@ function createBoundActions(microphone, clearState) {
                 set(state => Object.assign(Object.assign({}, function(microphone) {
                     return microphone ? {
                         micStream: microphone.micStream,
+                        processedMicStream: microphone.processedMicStream,
                         micTrack: microphone.micTrack,
+                        currentDeviceId: microphone.currentDeviceId,
                         isActive: microphone.isActive,
+                        inputVolume: microphone.inputVolume,
                         muted: microphone.muted,
                         isSupported: microphone.isSupported,
                         isRequesting: microphone.isRequesting,
@@ -88,13 +98,16 @@ function createBoundActions(microphone, clearState) {
 /**
  * Bind the value of useMicrophone hook to the useMicrophoneStore. Use this to update the store with a new mic object.
  */ function useSyncMicrophoneStore(microphone) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-    const sync = useMicrophoneStore(state => state.actions.sync), hasMicrophone = null !== microphone, micStream = null !== (_a = null == microphone ? void 0 : microphone.micStream) && void 0 !== _a ? _a : emptyMicStreamRef, micTrack = null !== (_b = null == microphone ? void 0 : microphone.micTrack) && void 0 !== _b ? _b : emptyMicTrackRef, isActive = null !== (_c = null == microphone ? void 0 : microphone.isActive) && void 0 !== _c && _c, muted = null === (_d = null == microphone ? void 0 : microphone.muted) || void 0 === _d || _d, isSupported = null !== (_e = null == microphone ? void 0 : microphone.isSupported) && void 0 !== _e && _e, isRequesting = null !== (_f = null == microphone ? void 0 : microphone.isRequesting) && void 0 !== _f && _f, error = null !== (_g = null == microphone ? void 0 : microphone.error) && void 0 !== _g ? _g : null, microphones = null !== (_h = null == microphone ? void 0 : microphone.microphones) && void 0 !== _h ? _h : [], micOptions = null !== (_j = null == microphone ? void 0 : microphone.micOptions) && void 0 !== _j ? _j : [], requestMicrophone = null == microphone ? void 0 : microphone.requestMicrophone, stopMicrophone = null == microphone ? void 0 : microphone.stopMicrophone, muteMic = null == microphone ? void 0 : microphone.muteMic, unmuteMic = null == microphone ? void 0 : microphone.unmuteMic, toggleMute = null == microphone ? void 0 : microphone.toggleMute, refreshMicrophones = null == microphone ? void 0 : microphone.refreshMicrophones, setMicrophone = null == microphone ? void 0 : microphone.setMicrophone;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+    const sync = useMicrophoneStore(state => state.actions.sync), hasMicrophone = null !== microphone, micStream = null !== (_a = null == microphone ? void 0 : microphone.micStream) && void 0 !== _a ? _a : emptyMicStreamRef, processedMicStream = null !== (_b = null == microphone ? void 0 : microphone.processedMicStream) && void 0 !== _b ? _b : emptyMicStreamRef, micTrack = null !== (_c = null == microphone ? void 0 : microphone.micTrack) && void 0 !== _c ? _c : emptyMicTrackRef, currentDeviceId = null !== (_d = null == microphone ? void 0 : microphone.currentDeviceId) && void 0 !== _d ? _d : null, isActive = null !== (_e = null == microphone ? void 0 : microphone.isActive) && void 0 !== _e && _e, inputVolume = null !== (_f = null == microphone ? void 0 : microphone.inputVolume) && void 0 !== _f ? _f : 1, muted = null === (_g = null == microphone ? void 0 : microphone.muted) || void 0 === _g || _g, isSupported = null !== (_h = null == microphone ? void 0 : microphone.isSupported) && void 0 !== _h && _h, isRequesting = null !== (_j = null == microphone ? void 0 : microphone.isRequesting) && void 0 !== _j && _j, error = null !== (_k = null == microphone ? void 0 : microphone.error) && void 0 !== _k ? _k : null, microphones = null !== (_l = null == microphone ? void 0 : microphone.microphones) && void 0 !== _l ? _l : [], micOptions = null !== (_m = null == microphone ? void 0 : microphone.micOptions) && void 0 !== _m ? _m : [], requestMicrophone = null == microphone ? void 0 : microphone.requestMicrophone, stopMicrophone = null == microphone ? void 0 : microphone.stopMicrophone, muteMic = null == microphone ? void 0 : microphone.muteMic, unmuteMic = null == microphone ? void 0 : microphone.unmuteMic, toggleMute = null == microphone ? void 0 : microphone.toggleMute, setInputVolume = null == microphone ? void 0 : microphone.setInputVolume, refreshMicrophones = null == microphone ? void 0 : microphone.refreshMicrophones, setMicrophone = null == microphone ? void 0 : microphone.setMicrophone;
     useEffect(() => {
         sync(hasMicrophone ? {
             micStream: micStream,
+            processedMicStream: processedMicStream,
             micTrack: micTrack,
+            currentDeviceId: currentDeviceId,
             isActive: isActive,
+            inputVolume: inputVolume,
             muted: muted,
             isSupported: isSupported,
             isRequesting: isRequesting,
@@ -108,14 +121,15 @@ function createBoundActions(microphone, clearState) {
             muteMic: null != muteMic ? muteMic : () => !1,
             unmuteMic: null != unmuteMic ? unmuteMic : () => !1,
             toggleMute: null != toggleMute ? toggleMute : () => null,
+            setInputVolume: null != setInputVolume ? setInputVolume : () => 1,
             refreshMicrophones: null != refreshMicrophones ? refreshMicrophones : () => __awaiter(this, void 0, void 0, function*() {
                 return [];
             }),
             setMicrophone: null != setMicrophone ? setMicrophone : () => __awaiter(this, void 0, void 0, function*() {})
         } : null);
-    }, [ sync, hasMicrophone, micStream, micTrack, isActive, muted, isSupported, isRequesting, error, microphones, micOptions, requestMicrophone, stopMicrophone, muteMic, unmuteMic, toggleMute, refreshMicrophones, setMicrophone ]);
+    }, [ sync, hasMicrophone, micStream, processedMicStream, micTrack, currentDeviceId, isActive, inputVolume, muted, isSupported, isRequesting, error, microphones, micOptions, requestMicrophone, stopMicrophone, muteMic, unmuteMic, toggleMute, setInputVolume, refreshMicrophones, setMicrophone ]);
 }
 
-const useMicStream = () => useMicrophoneStore(state => state.micStream), useMicTrack = () => useMicrophoneStore(state => state.micTrack), useMicActive = () => useMicrophoneStore(state => state.isActive), useMicMuted = () => useMicrophoneStore(state => state.muted), useMicSupported = () => useMicrophoneStore(state => state.isSupported), useMicRequesting = () => useMicrophoneStore(state => state.isRequesting), useMicError = () => useMicrophoneStore(state => state.error), useMicrophones = () => useMicrophoneStore(state => state.microphones), useMicOptions = () => useMicrophoneStore(state => state.micOptions), useMicrophoneStoreActions = () => useMicrophoneStore(state => state.actions), microphoneActions = useMicrophoneStore.getState().actions, getMicrophoneState = () => useMicrophoneStore.getState();
+const useMicStream = () => useMicrophoneStore(state => state.micStream), useProcessedMicStream = () => useMicrophoneStore(state => state.processedMicStream), useMicTrack = () => useMicrophoneStore(state => state.micTrack), useCurrentMicDeviceId = () => useMicrophoneStore(state => state.currentDeviceId), useMicActive = () => useMicrophoneStore(state => state.isActive), useMicInputVolume = () => useMicrophoneStore(state => state.inputVolume), useMicMuted = () => useMicrophoneStore(state => state.muted), useMicSupported = () => useMicrophoneStore(state => state.isSupported), useMicRequesting = () => useMicrophoneStore(state => state.isRequesting), useMicError = () => useMicrophoneStore(state => state.error), useMicrophones = () => useMicrophoneStore(state => state.microphones), useMicOptions = () => useMicrophoneStore(state => state.micOptions), useMicrophoneStoreActions = () => useMicrophoneStore(state => state.actions), microphoneActions = useMicrophoneStore.getState().actions, getMicrophoneState = () => useMicrophoneStore.getState();
 
-export { useMicError as a, useMicMuted as b, useMicOptions as c, useMicRequesting as d, useMicStream as e, useMicSupported as f, getMicrophoneState as g, useMicTrack as h, useMicrophoneStore as i, useMicrophoneStoreActions as j, useMicrophones as k, useSyncMicrophoneStore as l, microphoneActions as m, useMicActive as u };
+export { useMicActive as a, useMicError as b, useMicInputVolume as c, useMicMuted as d, useMicOptions as e, useMicRequesting as f, getMicrophoneState as g, useMicStream as h, useMicSupported as i, useMicTrack as j, useMicrophoneStore as k, useMicrophoneStoreActions as l, microphoneActions as m, useMicrophones as n, useProcessedMicStream as o, useSyncMicrophoneStore as p, useCurrentMicDeviceId as u };

package/dist/esm/chunks/{misc-BeEWwOaJ.mjs → misc-Bjbro8Xe.mjs}

@@ -48,9 +48,9 @@ import { _ as __awaiter } from "./tslib.es6-C-olHjXV.mjs";
     };
 }
 
-const hexToRgb = hex => {
+const hexToRgb = (hex, opacity) => {
     if (!hex) return;
-    return `"rgb(${Number.parseInt(hex.slice(1, 3), 16)}, ${Number.parseInt(hex.slice(3, 5), 16)}, ${Number.parseInt(hex.slice(5, 7), 16)})"`;
+    return `rgba(${Number.parseInt(hex.slice(1, 3), 16)}, ${Number.parseInt(hex.slice(3, 5), 16)}, ${Number.parseInt(hex.slice(5, 7), 16)}, ${null != opacity ? opacity : 1})`;
 };
 
 /**

package/dist/esm/chunks/volumeStore-GZnCDBMU.mjs

@@ -0,0 +1,90 @@
+import { _ as __awaiter } from "./tslib.es6-C-olHjXV.mjs";
+
+import { create } from "zustand";
+
+const useVolumeStore = create((set, get) => ({
+    volume: 1,
+    storedVolume: 1,
+    muted: !1,
+    elements: new Set,
+    feedbackElement: null,
+    actions: {
+        attachMedia: elements => {
+            const media = Array.isArray(elements) ? elements : [ elements ], mediaMap = new Set(get().elements);
+            for (const element of media) mediaMap.add(element);
+            adjustMediaVolume(mediaMap, get().volume), set({
+                elements: mediaMap
+            });
+        },
+        attachFeedbackElement: element => {
+            element.loop = !1, set({
+                feedbackElement: element
+            });
+        },
+        detachFeedbackElement: element => {
+            set({
+                feedbackElement: null
+            });
+        },
+        setVolume: volume => {
+            const currentVolume = get().muted ? 0 : volume, attachedMedia = get().elements, newStored = volume > 0 ? volume : get().storedVolume;
+            attachedMedia.size > 0 && adjustMediaVolume(attachedMedia, currentVolume), set({
+                volume: currentVolume,
+                storedVolume: newStored
+            });
+        },
+        playFeedback: volume => __awaiter(void 0, void 0, void 0, function*() {
+            if (get().muted) return;
+            const feedbackElement = get().feedbackElement;
+            yield playFeedbackSound(feedbackElement, null != volume ? volume : get().volume);
+        }),
+        mute: () => __awaiter(void 0, void 0, void 0, function*() {
+            if (get().muted) return;
+            const volume = get().volume, attachedMedia = get().elements;
+            attachedMedia.size > 0 && adjustMediaVolume(attachedMedia, 0), set({
+                volume: 0,
+                storedVolume: volume,
+                muted: !0
+            });
+        }),
+        unmute: () => __awaiter(void 0, void 0, void 0, function*() {
+            if (!get().muted) return;
+            const storedVolume = get().storedVolume, attachedMedia = get().elements, feedbackElement = get().feedbackElement;
+            attachedMedia.size > 0 && adjustMediaVolume(attachedMedia, storedVolume), set({
+                volume: storedVolume,
+                muted: !1
+            }), yield playFeedbackSound(feedbackElement, storedVolume);
+        }),
+        detachMedia: elements => {
+            const media = Array.isArray(elements) ? elements : [ elements ], mediaMap = new Set(get().elements);
+            for (const element of media) mediaMap.delete(element);
+            set({
+                elements: mediaMap
+            });
+        },
+        clearMedia: () => {
+            set({
+                elements: new Set
+            });
+        }
+    }
+}));
+
+function adjustMediaVolume(media, volume) {
+    const elements = Array.from(media);
+    for (const element of elements) element instanceof HTMLAudioElement && (element.volume = volume), 
+    element instanceof HTMLVideoElement && (element.volume = volume);
+}
+
+function playFeedbackSound(element, volume) {
+    return __awaiter(this, void 0, void 0, function*() {
+        if (Number(volume.toFixed(2)), element) {
+            !element.paused && !element.ended && element.readyState > 2 && (element.pause(), 
+            element.currentTime = 0), element.volume = Number(volume.toFixed(2)), yield element.play().catch(err => console.warn(err));
+        }
+    });
+}
+
+const useVolume = () => useVolumeStore(state => state.volume), useStoredVolume = () => useVolumeStore(state => state.storedVolume), useMuted = () => useVolumeStore(state => state.muted), useAttachedMedia = () => useVolumeStore(state => state.elements), useVolumeActions = () => useVolumeStore(state => state.actions), volumeActions = useVolumeStore.getState().actions, getVolume = () => useVolumeStore.getState().volume, getStoredVolume = () => useVolumeStore.getState().storedVolume, getMuted = () => useVolumeStore.getState().muted, getAttachedMedia = () => useVolumeStore.getState().elements;
+
+export { getMuted as a, getStoredVolume as b, getVolume as c, useMuted as d, useStoredVolume as e, useVolume as f, getAttachedMedia as g, useVolumeActions as h, useVolumeStore as i, useAttachedMedia as u, volumeActions as v };

package/dist/esm/components/Avatar/index.mjs

@@ -1,4 +1,4 @@
-export { A as Avatar } from "../../chunks/Avatar-m5-zleDk.mjs";
+export { A as Avatar } from "../../chunks/Avatar-Ds6MWC2c.mjs";
 
 import "../../chunks/tslib.es6-C-olHjXV.mjs";
 
@@ -6,6 +6,6 @@ import "react/jsx-runtime";
 
 import "react";
 
-import "../../chunks/misc-BeEWwOaJ.mjs";
+import "../../chunks/misc-Bjbro8Xe.mjs";
 
 import "../../chunks/style-inject.es-D0BjEaN8.mjs";

package/dist/esm/components/AvatarGroup/index.mjs

@@ -1,4 +1,4 @@
-export { A as AvatarGroup } from "../../chunks/AvatarGroup-DlgP4lTS.mjs";
+export { A as AvatarGroup } from "../../chunks/AvatarGroup-CBGi99eo.mjs";
 
 import "../../chunks/tslib.es6-C-olHjXV.mjs";
 
@@ -6,8 +6,8 @@ import "react/jsx-runtime";
 
 import "react";
 
-import "../../chunks/Avatar-m5-zleDk.mjs";
+import "../../chunks/Avatar-Ds6MWC2c.mjs";
 
-import "../../chunks/misc-BeEWwOaJ.mjs";
+import "../../chunks/misc-Bjbro8Xe.mjs";
 
 import "../../chunks/style-inject.es-D0BjEaN8.mjs";