@apple-pie/slice 0.1.51 → 0.1.53

package/dist/cjs/chunks/{IconButton-DFk-yVc6.js → IconButton-Cz7iTVhO.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var AnimationPreset, AnimationType, tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), Badge = require("./Badge-Ca3fUHzW.js"), Dot = require("./Dot-W1TQ5vfI.js"), Icon = require("./Icon-NDphOLR6.js"), sharedTypes = require("./sharedTypes-BeP4wu1R.js"), css_button = "IconButton-module_button__rziqa flexBox-module_row__z24tF", css_label = "IconButton-module_label__qWGFD flexBox-module_row__z24tF type-module_body-l-regular__lOYbg", css_icon = "IconButton-module_icon__2DDWy flexBox-module_row__z24tF", css_count = "IconButton-module_count__6r373 flexBox-module_row__z24tF";
+var AnimationPreset, AnimationType, tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), theme_corners = require("../theme/corners.js"), Badge = require("./Badge-DNzsgQk9.js"), Dot = require("./Dot-nWPzJqlj.js"), Icon = require("./Icon-VcvTUkMA.js"), sharedTypes = require("./sharedTypes-BW_hw-Vb.js"), css_button = "IconButton-module_button__rziqa flexBox-module_row__z24tF", css_label = "IconButton-module_label__qWGFD flexBox-module_row__z24tF type-module_body-l-regular__lOYbg", css_icon = "IconButton-module_icon__2DDWy flexBox-module_row__z24tF", css_count = "IconButton-module_count__6r373 flexBox-module_row__z24tF";
 
 /**
  * Helper for quick popular animation effects
@@ -99,7 +99,7 @@ const presetAnimation = {
         transition: transition
     });
 }, IconButton = React.memo(props => {
-    const {frameSize: frameSize = 36, iconSize: iconSize = 20, round: round = !0, icon: icon = "more", borderRadius: borderRadius = 4, border: border = !1, tooltip: tooltip, color: color, colorOn: colorOn, iconFill: iconFill = !1, bgColor: bgColor = "var(--core-surface-secondary)", bgColorHover: bgColorHover = "var(--core-outline-primary)", bgColorOn: bgColorOn = "var(--core-outline-primary)", iconColor: iconColor = "var(--core-text-primary)", iconColorOn: iconColorOn = "var(--core-text-primary)", iconColorHover: iconColorHover = "var(--core-text-primary)", transition: transition, variants: variants, initial: initial, animate: animate, exit: exit, fillColor: fillColor, label: label, hover: hover = !0, count: count = 0, toggle: toggle = !1, toggleIcon: toggleIcon = !1, isToggled: isToggled = !1, disabled: disabled = !1, showDot: showDot = !1, buttonSize: buttonSize = "m", presetAnimations: presetAnimations, customAnimations: customAnimations, onClick: onClick = () => null, onToolTip: onToolTip = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "frameSize", "iconSize", "round", "icon", "borderRadius", "border", "tooltip", "color", "colorOn", "iconFill", "bgColor", "bgColorHover", "bgColorOn", "iconColor", "iconColorOn", "iconColorHover", "transition", "variants", "initial", "animate", "exit", "fillColor", "label", "hover", "count", "toggle", "toggleIcon", "isToggled", "disabled", "showDot", "buttonSize", "presetAnimations", "customAnimations", "onClick", "onToolTip" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", ref = React.useRef(null), [on, setOn] = React.useState(isToggled), [hovered, setHovered] = React.useState(!1);
+    const {frameSize: frameSize = 36, iconSize: iconSize = 20, round: round = !0, icon: icon = "more", borderRadius: borderRadius = theme_corners.corners["corner-xs"], border: border = !1, tooltip: tooltip, color: color, colorOn: colorOn, iconFill: iconFill = !1, backgroundColor: backgroundColor = "var(--core-surface-secondary)", backgroundColorHover: backgroundColorHover = "var(--core-outline-primary)", backgroundColorOn: backgroundColorOn = "var(--core-outline-primary)", iconColor: iconColor = "var(--core-text-primary)", iconColorOn: iconColorOn = "var(--core-text-primary)", iconColorHover: iconColorHover = "var(--core-text-primary)", transition: transition, variants: variants, initial: initial, animate: animate, exit: exit, fillColor: fillColor, label: label, hover: hover = !0, count: count = 0, toggle: toggle = !1, toggleIcon: toggleIcon = !1, isToggled: isToggled = !1, disabled: disabled = !1, showDot: showDot = !1, buttonSize: buttonSize = "m", presetAnimations: presetAnimations, customAnimations: customAnimations, onClick: onClick = () => null, onToolTip: onToolTip = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "frameSize", "iconSize", "round", "icon", "borderRadius", "border", "tooltip", "color", "colorOn", "iconFill", "backgroundColor", "backgroundColorHover", "backgroundColorOn", "iconColor", "iconColorOn", "iconColorHover", "transition", "variants", "initial", "animate", "exit", "fillColor", "label", "hover", "count", "toggle", "toggleIcon", "isToggled", "disabled", "showDot", "buttonSize", "presetAnimations", "customAnimations", "onClick", "onToolTip" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", ref = React.useRef(null), [on, setOn] = React.useState(isToggled), [hovered, setHovered] = React.useState(!1);
     React.useEffect(() => setOn(isToggled), [ isToggled ]);
     const handleClick = React.useCallback(e => {
         disabled || (tooltip && onToolTip(null), toggle && setOn(!on), onClick(e));
@@ -116,7 +116,7 @@ const presetAnimation = {
         onToolTip(tip);
     }, [ tooltip, onToolTip ]), handleMouseLeave = React.useCallback(() => {
         setHovered(!1), tooltip && onToolTip(null);
-    }, [ tooltip, onToolTip ]), bgColorNormal = React.useMemo(() => on ? bgColorOn : null != bgColor ? bgColor : "var(--core-surface-secondary)", [ bgColorOn, bgColor, on ]), bgHoverColor = React.useMemo(() => hover && on ? bgColorOn : hover ? bgColorHover : null != bgColor ? bgColor : "transparent", [ hover, bgColor, bgColorOn, bgColorHover, on ]), textColor = React.useMemo(() => on ? colorOn : null != color ? color : "var(--core-text-primary)", [ on, colorOn, color ]), setIconColor = React.useMemo(() => on ? iconColorOn : hovered ? iconColorHover : null != iconColor ? iconColor : "var(--core-text-primary)", [ on, iconColorOn, iconColor, iconColorHover, hovered ]), size = React.useMemo(() => buttonSize ? "s" === buttonSize ? 24 : "m" === buttonSize ? 36 : "l" === buttonSize ? 44 : "xl" === buttonSize ? 56 : void 0 : frameSize, [ frameSize, buttonSize ]), cssVars = React.useMemo(() => ({
+    }, [ tooltip, onToolTip ]), bgColorNormal = React.useMemo(() => on ? backgroundColorOn : null != backgroundColor ? backgroundColor : "var(--core-surface-secondary)", [ backgroundColorOn, backgroundColor, on ]), bgHoverColor = React.useMemo(() => hover && on ? backgroundColorOn : hover ? backgroundColorHover : null != backgroundColor ? backgroundColor : "transparent", [ hover, backgroundColor, backgroundColorOn, backgroundColorHover, on ]), textColor = React.useMemo(() => on ? colorOn : null != color ? color : "var(--core-text-primary)", [ on, colorOn, color ]), setIconColor = React.useMemo(() => on ? iconColorOn : hovered ? iconColorHover : null != iconColor ? iconColor : "var(--core-text-primary)", [ on, iconColorOn, iconColor, iconColorHover, hovered ]), size = React.useMemo(() => buttonSize ? "s" === buttonSize ? 24 : "m" === buttonSize ? 36 : "l" === buttonSize ? 44 : "xl" === buttonSize ? 56 : void 0 : frameSize, [ frameSize, buttonSize ]), cssVars = React.useMemo(() => ({
         "--ib-bg-color": bgColorNormal,
         "--ib-bg-color-hover": disabled ? bgColorNormal : bgHoverColor,
         "--ib-icon-size": `${null != iconSize ? iconSize : 0}px`,

package/dist/cjs/chunks/{IndexedDB-CpCbUa22.js → IndexedDB-D7TVb0pF.js}

@@ -1,6 +1,6 @@
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js");
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js");
 
 exports.IndexedDB = class {
     constructor(storeName, options = {}) {
@@ -43,7 +43,8 @@ exports.IndexedDB = class {
      * Get a single DB value by key.
      */    get(key) {
         return tslib_es6.__awaiter(this, void 0, void 0, function*() {
-            return this.runRequest("readonly", store => store.get(key));
+            const value = yield this.runRequest("readonly", store => store.get(key));
+            return null != value ? value : null;
         });
     }
     /**
@@ -62,15 +63,18 @@ exports.IndexedDB = class {
     }
     set(key, value) {
         return tslib_es6.__awaiter(this, void 0, void 0, function*() {
-            return this.runRequest("readwrite", store => store.put(value, key));
+            return this.runRequest("readwrite", store => this.key ? store.put(value) : store.put(value, key));
         });
     }
     /**
      * Adds a new value to the store with or without a key.
      * If a key already exists it will error.
+     *
+     * As with `set()`, a store configured with an in-line key path must never
+     * be given an explicit key - it is always derived from the value.
      */    add(value, key) {
         return tslib_es6.__awaiter(this, void 0, void 0, function*() {
-            return this.runRequest("readwrite", store => void 0 === key ? store.add(value) : store.add(value, key));
+            return this.runRequest("readwrite", store => this.key || void 0 === key ? store.add(value) : store.add(value, key));
         });
     }
     /**

package/dist/cjs/chunks/{Label-DkUq49nx.js → Label-E7350HYG.js}

@@ -1,13 +1,14 @@
 'use client';
 "use strict";
 
-var LabelBackground, tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-LAaHE64b.js"), css = {
+var LabelBackground, tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), theme_corners = require("../theme/corners.js"), misc = require("./misc-B2oK3rIL.js"), css = {
     label: "Label-module_label__RaRvM",
     button: "Label-module_button__N8bcQ type-module_body-m-regular__LuQBA",
     xs: "Label-module_xs__K9Ai6 type-module_body-xs-regular__ZAFft",
     s: "Label-module_s__Zh8Gp type-module_body-s-regular__vRHSP",
     m: "Label-module_m__BJtGL type-module_body-m-regular__LuQBA",
-    l: "Label-module_l__t70tt type-module_body-l-regular__lOYbg"
+    l: "Label-module_l__t70tt type-module_body-l-regular__lOYbg",
+    xl: "Label-module_xl__bX0ub type-module_body-xl-regular__pF2kC"
 };
 
 function resolveSemanticBackground(backgroundColor) {
@@ -20,7 +21,7 @@ exports.LabelBackground = void 0, (LabelBackground = exports.LabelBackground ||
 LabelBackground.yellow = "yellow", LabelBackground.green = "green", LabelBackground.blue = "blue", 
 LabelBackground.grey = "grey", LabelBackground.lightGrey = "lightGrey", LabelBackground.white = "white", 
 exports.Label = function(props) {
-    const {children: children, label: label, backgroundColor: backgroundColor, borderWidth: borderWidth, borderSize: borderSize = 1, borderColor: borderColor = "var(--core-outline-primary)", bgColor: bgColor = "transparent", borderRadius: borderRadius = 4, padding: padding, textColor: textColor = "var(--core-text-primary)", textSize: textSize = "s", onClick: onClick} = props, divAttributes = tslib_es6.__rest(props, [ "children", "label", "backgroundColor", "borderWidth", "borderSize", "borderColor", "bgColor", "borderRadius", "padding", "textColor", "textSize", "onClick" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", isInteractive = Boolean(onClick), resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, resolvedBorderWidth = null != borderWidth ? borderWidth : borderSize, handleClick = React.useCallback(e => {
+    const {children: children, label: label, backgroundColor: backgroundColor = "transparent", borderWidth: borderWidth, borderSize: borderSize = 1, borderColor: borderColor = "var(--core-outline-primary)", borderRadius: borderRadius = theme_corners.corners["corner-xs"], padding: padding, textColor: textColor = "var(--core-text-primary)", textSize: textSize = "s", onClick: onClick} = props, divAttributes = tslib_es6.__rest(props, [ "children", "label", "backgroundColor", "borderWidth", "borderSize", "borderColor", "borderRadius", "padding", "textColor", "textSize", "onClick" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", isInteractive = Boolean(onClick), resolvedBackgroundColor = backgroundColor, resolvedBorderWidth = null != borderWidth ? borderWidth : borderSize, handleClick = React.useCallback(e => {
         isInteractive && (null == onClick || onClick(e));
     }, [ isInteractive, onClick ]), setBgColor = React.useMemo(() => {
         if (!resolvedBackgroundColor) return "transparent";

package/dist/cjs/chunks/{Level-MO3XuoBp.js → Level-ZmAb4JQ9.js}

@@ -1,14 +1,14 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-LAaHE64b.js"), audioVisualizer = require("./audioVisualizer-COtQiyA7.js");
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), theme_corners = require("../theme/corners.js"), misc = require("./misc-B2oK3rIL.js"), audioVisualizer = require("./audioVisualizer-Dmtjjosj.js");
 
-require("./broadcastChannel-Cqzs7sXX.js");
+require("./broadcastChannel-CRR59lw6.js");
 
 var css_wrapper = "Level-module_wrapper__yOfXw", css_barContainer = "Level-module_barContainer__QMUdv", css_bar = "Level-module_bar__MnApX";
 
 const Level = React.memo(function(props) {
-    const {width: width = 100, height: height = 4, gap: gap = 0, audioStream: audioStream, playing: playing = !1, minIntensity: minIntensity = 0, maxIntensity: maxIntensity = 5, intensity: intensity = 3.5, peakIntensity: peakIntensity = .5, risePerSeconds: risePerSeconds = 4, releasePerSeconds: releasePerSeconds, ReleasePerSeconds: ReleasePerSeconds = 1.5, borderRadius: borderRadius = 4, borderColor: borderColor = "transparent", borderWidth: borderWidth = 0, colorActive: colorActive = "var(--feedback-positive)", backgroundColor: backgroundColor = "var(--core-surface-primary-tint)"} = props, divAttributes = tslib_es6.__rest(props, [ "width", "height", "gap", "audioStream", "playing", "minIntensity", "maxIntensity", "intensity", "peakIntensity", "risePerSeconds", "releasePerSeconds", "ReleasePerSeconds", "borderRadius", "borderColor", "borderWidth", "colorActive", "backgroundColor" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", visualizerRef = React.useRef(null), [normalizedIntensity, setNormalizedIntensity] = React.useState(0), totalBars = Math.max(1, Math.floor(maxIntensity)), minBars = Math.max(0, Math.min(Math.floor(minIntensity), totalBars)), releaseRate = null != releasePerSeconds ? releasePerSeconds : ReleasePerSeconds, intensityIntervals = React.useMemo(() => new Array(totalBars).fill(0).map((_, index) => index), [ totalBars ]), activeBars = React.useMemo(() => {
+    const {width: width = 100, height: height = 4, gap: gap = 0, audioStream: audioStream, playing: playing = !1, minIntensity: minIntensity = 0, maxIntensity: maxIntensity = 5, intensity: intensity = 3.5, peakIntensity: peakIntensity = .5, risePerSeconds: risePerSeconds = 4, releasePerSeconds: releasePerSeconds, ReleasePerSeconds: ReleasePerSeconds = 1.5, borderRadius: borderRadius = theme_corners.corners["corner-xs"], borderColor: borderColor = "transparent", borderWidth: borderWidth = 0, colorActive: colorActive = "var(--feedback-positive)", backgroundColor: backgroundColor = "var(--core-surface-primary-tint)"} = props, divAttributes = tslib_es6.__rest(props, [ "width", "height", "gap", "audioStream", "playing", "minIntensity", "maxIntensity", "intensity", "peakIntensity", "risePerSeconds", "releasePerSeconds", "ReleasePerSeconds", "borderRadius", "borderColor", "borderWidth", "colorActive", "backgroundColor" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", visualizerRef = React.useRef(null), [normalizedIntensity, setNormalizedIntensity] = React.useState(0), totalBars = Math.max(1, Math.floor(maxIntensity)), minBars = Math.max(0, Math.min(Math.floor(minIntensity), totalBars)), releaseRate = null != releasePerSeconds ? releasePerSeconds : ReleasePerSeconds, intensityIntervals = React.useMemo(() => new Array(totalBars).fill(0).map((_, index) => index), [ totalBars ]), activeBars = React.useMemo(() => {
         const scaledBars = Math.round(minBars + normalizedIntensity * (totalBars - minBars));
         return Math.max(minBars, Math.min(scaledBars, totalBars));
     }, [ minBars, normalizedIntensity, totalBars ]), visualizerSettings = React.useMemo(() => ({

package/dist/cjs/chunks/{Modal-o7KtPH6D.js → Modal-BKZ9fgWF.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-LAaHE64b.js"), Button = require("./Button-Cep3SqsR.js"), Icon = require("./Icon-NDphOLR6.js"), IconButton = require("./IconButton-DFk-yVc6.js"), css = {
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), theme_corners = require("../theme/corners.js"), misc = require("./misc-B2oK3rIL.js"), Button = require("./Button-GrPLJIBP.js"), Icon = require("./Icon-VcvTUkMA.js"), IconButton = require("./IconButton-Cz7iTVhO.js"), css = {
     wrapper: "Modal-module_wrapper__34Hds flexBox-module_columnBetween__ERfp7",
     title: "Modal-module_title__A5OeE flexBox-module_rowBetween__5FEvi",
     titleBlock: "Modal-module_titleBlock__HUepX flexBox-module_rowStart__4tcxS",
@@ -19,7 +19,7 @@ var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/
 };
 
 const Modal = React.memo(props => {
-    const {children: children, id: id, className: className, style: style, minWidth: minWidth = 300, minHeight: minHeight = 200, maxHeight: maxHeight = 400, maxWidth: maxWidth = 400, padding: padding, close: close = !0, title: title, titleSize: titleSize = "l", contentSize: contentSize = "m", actions: actions, titleIcon: titleIcon, titleIconFill: titleIconFill = !0, titleBorderColor: titleBorderColor = "var(--core-outline-primary)", titleBorderWidth: titleBorderWidth = 0, actionsBorderColor: actionsBorderColor = "var(--core-outline-primary)", actionsBorderWidth: actionsBorderWidth = 0, autoBorderBottom: autoBorderBottom = !0, onAction: onAction, onReject: onReject, onResolve: onResolve, onClose: onClose, onToolTip: onToolTip, onDragPointerDown: onDragPointerDown, backgroundColor: backgroundColor = "var(--core-surface-secondary)", scrollHandleColor: scrollHandleColor = "var(--core-text-disabled)", scrollHandleColorHover: scrollHandleColorHover = "var(--core-text-disabled)", titleColor: titleColor = "var(--core-text-special)", borderColor: borderColor = "var(--core-outline-primary)", borderRadius: borderRadius = 8, borderWidth: borderWidth = 1} = props, rest = tslib_es6.__rest(props, [ "children", "id", "className", "style", "minWidth", "minHeight", "maxHeight", "maxWidth", "padding", "close", "title", "titleSize", "contentSize", "actions", "titleIcon", "titleIconFill", "titleBorderColor", "titleBorderWidth", "actionsBorderColor", "actionsBorderWidth", "autoBorderBottom", "onAction", "onReject", "onResolve", "onClose", "onToolTip", "onDragPointerDown", "backgroundColor", "scrollHandleColor", "scrollHandleColorHover", "titleColor", "borderColor", "borderRadius", "borderWidth" ]), contentWrapperRef = React.useRef(null), modalStyle = null != style ? style : {}, modalClass = className ? ` ${className}` : "", [scrolls, setScrolls] = React.useState(!1), getScrolls = React.useCallback(() => {
+    const {children: children, id: id, className: className, style: style, minWidth: minWidth = 300, minHeight: minHeight = 200, maxHeight: maxHeight = 400, maxWidth: maxWidth = 400, padding: padding, close: close = !0, title: title, titleTextSize: titleTextSize = "l", contentTextSize: contentTextSize = "m", actions: actions, titleIcon: titleIcon, titleIconFill: titleIconFill = !0, titleBorderColor: titleBorderColor = "var(--core-outline-primary)", titleBorderWidth: titleBorderWidth = 0, actionsBorderColor: actionsBorderColor = "var(--core-outline-primary)", actionsBorderWidth: actionsBorderWidth = 0, autoBorderBottom: autoBorderBottom = !0, onAction: onAction, onReject: onReject, onResolve: onResolve, onClose: onClose, onToolTip: onToolTip, onDragPointerDown: onDragPointerDown, backgroundColor: backgroundColor = "var(--core-surface-secondary)", scrollHandleColor: scrollHandleColor = "var(--core-text-disabled)", scrollHandleColorHover: scrollHandleColorHover = "var(--core-text-disabled)", titleColor: titleColor = "var(--core-text-special)", borderColor: borderColor = "var(--core-outline-primary)", borderRadius: borderRadius = theme_corners.corners["corner-m"], borderWidth: borderWidth = 1} = props, rest = tslib_es6.__rest(props, [ "children", "id", "className", "style", "minWidth", "minHeight", "maxHeight", "maxWidth", "padding", "close", "title", "titleTextSize", "contentTextSize", "actions", "titleIcon", "titleIconFill", "titleBorderColor", "titleBorderWidth", "actionsBorderColor", "actionsBorderWidth", "autoBorderBottom", "onAction", "onReject", "onResolve", "onClose", "onToolTip", "onDragPointerDown", "backgroundColor", "scrollHandleColor", "scrollHandleColorHover", "titleColor", "borderColor", "borderRadius", "borderWidth" ]), contentWrapperRef = React.useRef(null), modalStyle = null != style ? style : {}, modalClass = className ? ` ${className}` : "", [scrolls, setScrolls] = React.useState(!1), getScrolls = React.useCallback(() => {
         var _a, _b;
         const height = null === (_a = contentWrapperRef.current) || void 0 === _a ? void 0 : _a.offsetHeight, scrollHeight = null === (_b = contentWrapperRef.current) || void 0 === _b ? void 0 : _b.scrollHeight;
         return !(!height || !scrollHeight) && height < scrollHeight;
@@ -75,7 +75,7 @@ const Modal = React.memo(props => {
         style: Object.assign(Object.assign({}, modalStyle), cssVars)
     }, rest, {
         children: [ (title || close) && jsxRuntime.jsxs("div", {
-            className: `${css.title} ${css[titleSize]}`,
+            className: `${css.title} ${css[titleTextSize]}`,
             onPointerDown: onDragPointerDown,
             children: [ jsxRuntime.jsxs("div", {
                 className: css.titleBlock,
@@ -93,6 +93,7 @@ const Modal = React.memo(props => {
                     className: css.titleIcon,
                     children: jsxRuntime.jsx(IconButton.IconButton, {
                         tooltip: "close",
+                        "aria-label": "close",
                         icon: "x",
                         onClick: () => {
                             null == onReject || onReject(new Error("Modal was closed", {
@@ -107,7 +108,7 @@ const Modal = React.memo(props => {
             className: css.contentWrapper,
             ref: contentWrapperRef,
             children: jsxRuntime.jsx("div", {
-                className: `${css.content} ${css[contentSize]}`,
+                className: `${css.content} ${css[contentTextSize]}`,
                 children: children
             })
         }), actions && actions.length > 0 && jsxRuntime.jsxs("div", {

package/dist/cjs/chunks/{ModalController-Bh4HjLKC.js → ModalController-CCcRXYUs.js}

@@ -3,10 +3,10 @@
 
 var jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react");
 
-require("./microphoneStore-Ds2J_e1I.js"), require("./volumeStore-DbLg_-L9.js"), 
-require("./webRTCStore-B-ZZdCuw.js");
+require("./microphoneStore-axA5TgKM.js"), require("./volumeStore-D64ziNWo.js"), 
+require("./webRTCStore-XciamNCa.js");
 
-var Overlay = require("./Overlay-CxVrTI2z.js"), modalStore = require("./modalStore-C6J4X4Z_.js"), css_container = "ModalController-module_container__3cSaO", css_box = "ModalController-module_box__cPzOz", css_wrapper = "ModalController-module_wrapper__HkOoX flexBox-module_row__z24tF";
+var Overlay = require("./Overlay-B0jNgBu3.js"), modalStore = require("./modalStore--QHdUyuE.js"), css_container = "ModalController-module_container__3cSaO", css_box = "ModalController-module_box__cPzOz", css_wrapper = "ModalController-module_wrapper__HkOoX flexBox-module_row__z24tF";
 
 const defaultTransition = {
     ease: "easeOut",

package/dist/cjs/chunks/{Overlay-CxVrTI2z.js → Overlay-B0jNgBu3.js}

@@ -1,13 +1,13 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), css_overlay = "Overlay-module_overlay__EkbfA";
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), css_overlay = "Overlay-module_overlay__EkbfA";
 
 const defaultTransition = {
     ease: "easeOut",
     duration: .25
 }, Overlay = React.memo(props => {
-    const {children: children, show: show = !1, type: type = "clear", global: global = !1, overlay: overlay, color: color = "rgb(0,0,0)", opacity: opacity = 0, transition: transition = defaultTransition, onClick: onClick = () => null, toggleOverlay: toggleOverlay = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "children", "show", "type", "global", "overlay", "color", "opacity", "transition", "onClick", "toggleOverlay" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", computedOpacity = React.useMemo(() => "clear" === type ? 0 : void 0 !== opacity ? opacity : "dark" === type ? .8 : 0, [ type, opacity ]), handleClick = React.useCallback(() => {
+    const {children: children, show: show = !1, type: type = "clear", global: global = !1, overlay: overlay, color: color = "rgb(0,0,0)", opacity: opacity, transition: transition = defaultTransition, onClick: onClick = () => null, toggleOverlay: toggleOverlay = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "children", "show", "type", "global", "overlay", "color", "opacity", "transition", "onClick", "toggleOverlay" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", computedOpacity = React.useMemo(() => "clear" === type ? 0 : void 0 !== opacity ? opacity : "dark" === type ? .8 : 0, [ type, opacity ]), handleClick = React.useCallback(() => {
         global && toggleOverlay(!1), onClick();
     }, [ global, toggleOverlay, onClick ]), handleContextMenu = React.useCallback(e => {
         e.preventDefault();

package/dist/cjs/chunks/{Pager-DkpPXtWt.js → Pager-CwOhw4nE.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-LAaHE64b.js"), css_wrapper = "Pager-module_wrapper__eutVg flexBox-module_row__z24tF", css_bullet = "Pager-module_bullet__TxyR5 flexBox-module_row__z24tF", css_selected = "Pager-module_selected__C6xbR";
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-B2oK3rIL.js"), css_wrapper = "Pager-module_wrapper__eutVg flexBox-module_row__z24tF", css_bullet = "Pager-module_bullet__TxyR5 flexBox-module_row__z24tF", css_selected = "Pager-module_selected__C6xbR";
 
 const Pager = React.memo(props => {
     const {size: size = 8, index: index = 0, color: color, colorHover: colorHover, colorOn: colorOn, pages: pages = 2, gap: gap = 4, onChange: onChange = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "size", "index", "color", "colorHover", "colorOn", "pages", "gap", "onChange" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [selected, setSelected] = React.useState(index), bullets = React.useMemo(() => Array.from({

package/dist/cjs/chunks/{ProgressIndicator-a4uthp1C.js → ProgressIndicator--Ph78ZSe.js}

@@ -5,13 +5,13 @@ var jsxRuntime = require("react/jsx-runtime"), React = require("react"), hooks_u
 
 require("../theme/colors.js"), require("../theme/type.js");
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js");
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js");
 
-require("./broadcastChannel-Cqzs7sXX.js"), require("./webRTCStore-B-ZZdCuw.js"), 
-require("./microphoneStore-Ds2J_e1I.js"), require("./volumeStore-DbLg_-L9.js"), 
+require("./broadcastChannel-CRR59lw6.js"), require("./webRTCStore-XciamNCa.js"), 
+require("./microphoneStore-axA5TgKM.js"), require("./volumeStore-D64ziNWo.js"), 
 require("../hooks/useWindow.js");
 
-var Icon = require("./Icon-NDphOLR6.js"), react = require("motion/react"), css$1_wrapper = "DoneCheck-module_wrapper__AlISD flexBox-module_row__z24tF", css$1_icon = "DoneCheck-module_icon__bKaFp flexBox-module_row__z24tF";
+var Icon = require("./Icon-VcvTUkMA.js"), react = require("motion/react"), css$1_wrapper = "DoneCheck-module_wrapper__AlISD flexBox-module_row__z24tF", css$1_icon = "DoneCheck-module_icon__bKaFp flexBox-module_row__z24tF";
 
 const DoneCheck = React.memo(props => {
     const theme = hooks_useTheme.useTheme(), {size: size = 88, stroke: stroke = 1.5, color: color = theme.current.colors["feedback-positive"], play: play = !0, delay: delay = 5, duration: duration = 1, didStart: didStart, didEnd: didEnd} = props, [playing, setPlaying] = React.useState(!play);

package/dist/cjs/chunks/{PromptInput-DJ3sMLAK.js → PromptInput-8TqoRRtq.js}

@@ -3,15 +3,19 @@
 
 var jsxRuntime = require("react/jsx-runtime"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js");
 
-require("../theme/colors.js"), require("../theme/type.js"), require("./tslib.es6-B8RWDz3P.js");
+require("../theme/colors.js");
 
-var misc = require("./misc-LAaHE64b.js");
+var theme_corners = require("../theme/corners.js");
 
-require("./broadcastChannel-Cqzs7sXX.js"), require("./webRTCStore-B-ZZdCuw.js"), 
-require("./microphoneStore-Ds2J_e1I.js"), require("./volumeStore-DbLg_-L9.js"), 
+require("../theme/type.js"), require("./tslib.es6-Y3RzGMQw.js");
+
+var misc = require("./misc-B2oK3rIL.js");
+
+require("./broadcastChannel-CRR59lw6.js"), require("./webRTCStore-XciamNCa.js"), 
+require("./microphoneStore-axA5TgKM.js"), require("./volumeStore-D64ziNWo.js"), 
 require("../hooks/useWindow.js");
 
-var Button = require("./Button-Cep3SqsR.js"), FileList = require("./FileList-CBGZ8PsW.js"), css = {
+var Button = require("./Button-GrPLJIBP.js"), FileList = require("./FileList-NDj9e_To.js"), css = {
     wrapperBg: "PromptInput-module_wrapperBg__zabZq flexBox-module_columnStart__C7P44",
     bgRotate: "PromptInput-module_bgRotate__Um720",
     textareaWrapper: "PromptInput-module_textareaWrapper__KusiV flexBox-module_columnStart__C7P44",
@@ -20,13 +24,15 @@ var Button = require("./Button-Cep3SqsR.js"), FileList = require("./FileList-CBG
     buttonBar: "PromptInput-module_buttonBar__X8LDe flexBox-module_rowBetween__5FEvi",
     toolBar: "PromptInput-module_toolBar__GBvPT flexBox-module_rowStart__4tcxS",
     textarea: "PromptInput-module_textarea__e4Kxn",
+    xs: "PromptInput-module_xs__Oy1ZT type-module_body-xs-regular__ZAFft",
     s: "PromptInput-module_s__ivyC9 type-module_body-s-regular__vRHSP",
     m: "PromptInput-module_m__LFHvW type-module_body-m-regular__LuQBA",
-    l: "PromptInput-module_l__TlceW type-module_body-l-regular__lOYbg"
+    l: "PromptInput-module_l__TlceW type-module_body-l-regular__lOYbg",
+    xl: "PromptInput-module_xl__FbITb type-module_body-xl-regular__pF2kC"
 };
 
 const PromptInputBase = React.forwardRef((props, ref) => {
-    const {children: children, attachments: attachments = [], value: value = "", width: width = "100%", maxWidth: maxWidth, minWidth: minWidth, working: working = !1, maxHeight: maxHeight, attachmentsDisabled: attachmentsDisabled = !1, submitWorking: submitWorking = !1, borderStyle: borderStyle = "gradient", borderColor: borderColor, borderColorOn: borderColorOn, borderAnimate: borderAnimate = !0, borderWidth: borderWidth = 1, borderRadius: borderRadius = 8, focused: focused = !1, placeholder: placeholder = "Ask me anything ...", placeholderWorking: placeholderWorking = "Working ...", submitClears: submitClears = !0, enterSubmits: enterSubmits = !0, attachButton: attachButton = !0, sendButton: sendButton = !0, stopEnabled: stopEnabled = !1, textSize: textSize = "m", maxLength: maxLength, toolbarGap: toolbarGap = 8, onChange: onChange, onBlur: onBlur, onFocus: onFocus, onSubmit: onSubmit, onStop: onStop, onAttachmentsChange: onAttachmentsChange} = props, {isDark: isDark} = hooks_useTheme.useTheme(), [isFocused, setIsFocused] = React.useState(null != focused && focused), [textValue, setTextValue] = React.useState(value), textAreaRef = React.useRef(null), handleFocus = React.useCallback(() => {
+    const {children: children, attachments: attachments = [], value: value = "", width: width = "100%", maxWidth: maxWidth, minWidth: minWidth, working: working = !1, maxHeight: maxHeight, attachmentsDisabled: attachmentsDisabled = !1, submitWorking: submitWorking = !1, borderStyle: borderStyle = "gradient", borderColor: borderColor, borderColorOn: borderColorOn, borderAnimate: borderAnimate = !0, borderWidth: borderWidth = 1, borderRadius: borderRadius = theme_corners.corners["corner-m"], focused: focused = !1, placeholder: placeholder = "Ask me anything ...", placeholderWorking: placeholderWorking = "Working ...", submitClears: submitClears = !0, enterSubmits: enterSubmits = !0, attachButton: attachButton = !0, sendButton: sendButton = !0, stopEnabled: stopEnabled = !1, textSize: textSize = "m", maxLength: maxLength, toolbarGap: toolbarGap = 8, onChange: onChange, onBlur: onBlur, onFocus: onFocus, onSubmit: onSubmit, onStop: onStop, onAttachmentsChange: onAttachmentsChange} = props, {isDark: isDark} = hooks_useTheme.useTheme(), [isFocused, setIsFocused] = React.useState(null != focused && focused), [textValue, setTextValue] = React.useState(value), textAreaRef = React.useRef(null), handleFocus = React.useCallback(() => {
         var _a, _b;
         setIsFocused(!0), null === (_a = null == textAreaRef ? void 0 : textAreaRef.current) || void 0 === _a || _a.focus(), 
         null == onFocus || onFocus(null === (_b = textAreaRef.current) || void 0 === _b ? void 0 : _b.value, attachments);
@@ -95,8 +101,8 @@ const PromptInputBase = React.forwardRef((props, ref) => {
                 children: jsxRuntime.jsx(FileList.FileList, {
                     files: attachments,
                     onChange: handleAttachmentsChange,
-                    bgColor: "var(--core-surface-primary)",
-                    size: "s",
+                    backgroundColor: "var(--core-surface-primary)",
+                    textSize: "s",
                     direction: "row",
                     gap: 8,
                     iconSize: 24
@@ -138,7 +144,7 @@ const PromptInputBase = React.forwardRef((props, ref) => {
                     iconLeft: stopEnabled ? "stop" : "arrow up",
                     iconSize: stopEnabled ? 16 : 20,
                     state: sendButtonState,
-                    bgColorDisabled: "var(--core-outline-primary)",
+                    backgroundColorDisabled: "var(--core-outline-primary)",
                     progress: !stopEnabled,
                     working: submitWorking && working,
                     onMouseDown: handleClickSend,

package/dist/cjs/chunks/{RadioButton-J0dfBuuZ.js → RadioButton-oZxMZCpd.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-LAaHE64b.js"), Icon = require("./Icon-NDphOLR6.js"), css_wrapper = "RadioButton-module_wrapper__-pWRe flexBox-module_row__z24tF", css_radioIcon = "RadioButton-module_radioIcon__I27Xv flexBox-module_column__ezvMq", css_radioTitle = "RadioButton-module_radioTitle__zCQII flexBox-module_rowStart__4tcxS type-module_body-m-regular__LuQBA", css_radioContent = "RadioButton-module_radioContent__38xVx flexBox-module_columnStart__C7P44";
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-B2oK3rIL.js"), Icon = require("./Icon-VcvTUkMA.js"), css_wrapper = "RadioButton-module_wrapper__-pWRe flexBox-module_row__z24tF", css_radioIcon = "RadioButton-module_radioIcon__I27Xv flexBox-module_column__ezvMq", css_radioTitle = "RadioButton-module_radioTitle__zCQII flexBox-module_rowStart__4tcxS type-module_body-m-regular__LuQBA", css_radioContent = "RadioButton-module_radioContent__38xVx flexBox-module_columnStart__C7P44";
 
 function RadioButtonComponent(props) {
     const {label: label, children: children, fieldName: fieldName, value: value, selected: selected = !1, controlType: controlType = "radio", deselect: deselect = !0, tabIndex: tabIndex = 0, wrap: wrap = !1, list: list = !1, hideRadio: hideRadio = !1, noFrame: noFrame = !0, icon: icon = "circle", checkedIcon: checkedIcon = "check circle", iconColor: iconColor, gap: gap = 6, onChange: onChange = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "label", "children", "fieldName", "value", "selected", "controlType", "deselect", "tabIndex", "wrap", "list", "hideRadio", "noFrame", "icon", "checkedIcon", "iconColor", "gap", "onChange" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [isSelected, setIsSelected] = React.useState(selected);

package/dist/cjs/chunks/{RadioButtonList-CovzfXBb.js → RadioButtonList-C0zngoe4.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-LAaHE64b.js"), RadioButton = require("./RadioButton-J0dfBuuZ.js"), css_wrapper = "RadioButtonList-module_wrapper__wnq1-", css_column = "RadioButtonList-module_column__Bq16e flexBox-module_columnStart__C7P44", css_row = "RadioButtonList-module_row__D3szq flexBox-module_rowStart__4tcxS";
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-B2oK3rIL.js"), RadioButton = require("./RadioButton-oZxMZCpd.js"), css_wrapper = "RadioButtonList-module_wrapper__wnq1-", css_column = "RadioButtonList-module_column__Bq16e flexBox-module_columnStart__C7P44", css_row = "RadioButtonList-module_row__D3szq flexBox-module_rowStart__4tcxS";
 
 function RadioButtonListComponent(props) {
     const {width: width = "min-content", options: options = [], selectedIndexes: selectedIndexes = null, selectedOptions: selectedOptions = null, label: label = null, deselect: deselect = !1, multiSelect: multiSelect = !1, wrap: wrap = !1, tabIndexSeed: tabIndexSeed = 0, spacer: spacer = "none", custom: custom = 0, gap: gap = 16, hideRadio: hideRadio = !1, noFrame: noFrame = !0, toggleIcon: toggleIcon = !0, iconColor: iconColor, icon: icon = "circle", checkedIcon: checkedIcon = "check circle", iconSelectedColor: iconSelectedColor, onChange: onChange = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "width", "options", "selectedIndexes", "selectedOptions", "label", "deselect", "multiSelect", "wrap", "tabIndexSeed", "spacer", "custom", "gap", "hideRadio", "noFrame", "toggleIcon", "iconColor", "icon", "checkedIcon", "iconSelectedColor", "onChange" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", labelId = React.useId(), [selected, setSelected] = React.useState(selectedIndexes);

package/dist/cjs/chunks/{Slider-CLQ0GSie.js → Slider-BfiaN55A.js}

@@ -1,14 +1,14 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react");
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react");
 
 require("../theme/colors.js"), require("../theme/type.js");
 
-var misc = require("./misc-LAaHE64b.js"), debounce = require("./debounce-TfVmWD0v.js");
+var misc = require("./misc-B2oK3rIL.js"), debounce = require("./debounce-C3P6vOcn.js");
 
-require("./broadcastChannel-Cqzs7sXX.js"), require("./webRTCStore-B-ZZdCuw.js"), 
-require("./microphoneStore-Ds2J_e1I.js"), require("./volumeStore-DbLg_-L9.js"), 
+require("./broadcastChannel-CRR59lw6.js"), require("./webRTCStore-XciamNCa.js"), 
+require("./microphoneStore-axA5TgKM.js"), require("./volumeStore-D64ziNWo.js"), 
 require("../hooks/useWindow.js");
 
 var hooks_useObserveResize = require("../hooks/useObserveResize.js"), 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";

package/dist/cjs/chunks/{Spacer-hd4zs1jA.js → Spacer-D9SULpcV.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react");
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react");
 
 const Spacer = React.memo(props => {
     const {size: size = 8} = props, divAttributes = tslib_es6.__rest(props, [ "size" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), spacerStyle = React.useMemo(() => ({

package/dist/cjs/chunks/{Switch-Bk0OdvjZ.js → Switch-Bax_lPw4.js}

@@ -1,10 +1,10 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), css_wrapper = "Switch-module_wrapper__kudO9 flexBox-module_row__z24tF", css_knob = "Switch-module_knob__vKNOc flexBox-module_row__z24tF";
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), css_wrapper = "Switch-module_wrapper__kudO9 flexBox-module_row__z24tF", css_knob = "Switch-module_knob__vKNOc flexBox-module_row__z24tF";
 
 function SwitchComponent(props) {
-    const {fieldName: fieldName, state: state = !1, value: value, height: height = 22, width: width = 44, padding: padding = 3, backgroundColorOn: backgroundColorOn, backgroundColorOff: backgroundColorOff, bgColorOn: bgColorOn = "var(--feedback-positive)", bgColorOff: bgColorOff = "var(--core-text-disabled)", knobColor: knobColor = "var(--core-surface-primary)", onChange: onChange = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "fieldName", "state", "value", "height", "width", "padding", "backgroundColorOn", "backgroundColorOff", "bgColorOn", "bgColorOff", "knobColor", "onChange" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [on, setOn] = React.useState(state), resolvedBackgroundColorOn = null != backgroundColorOn ? backgroundColorOn : bgColorOn, resolvedBackgroundColorOff = null != backgroundColorOff ? backgroundColorOff : bgColorOff;
+    const {fieldName: fieldName, state: state = !1, value: value, height: height = 22, width: width = 44, padding: padding = 3, backgroundColorOn: backgroundColorOn = "var(--feedback-positive)", backgroundColorOff: backgroundColorOff = "var(--core-text-disabled)", knobColor: knobColor = "var(--core-surface-primary)", onChange: onChange = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "fieldName", "state", "value", "height", "width", "padding", "backgroundColorOn", "backgroundColorOff", "knobColor", "onChange" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [on, setOn] = React.useState(state), resolvedBackgroundColorOn = backgroundColorOn, resolvedBackgroundColorOff = backgroundColorOff;
     React.useEffect(() => {
         setOn(state);
     }, [ state ]);

package/dist/cjs/chunks/{TabBar-DqkCgnSR.js → TabBar-C9NycMo8.js}

@@ -1,17 +1,17 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js");
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js");
 
 require("../theme/colors.js"), require("../theme/type.js");
 
-var misc = require("./misc-LAaHE64b.js");
+var misc = require("./misc-B2oK3rIL.js");
 
-require("./broadcastChannel-Cqzs7sXX.js"), require("./webRTCStore-B-ZZdCuw.js"), 
-require("./microphoneStore-Ds2J_e1I.js"), require("./volumeStore-DbLg_-L9.js"), 
+require("./broadcastChannel-CRR59lw6.js"), require("./webRTCStore-XciamNCa.js"), 
+require("./microphoneStore-axA5TgKM.js"), require("./volumeStore-D64ziNWo.js"), 
 require("../hooks/useWindow.js");
 
-var Badge = require("./Badge-Ca3fUHzW.js"), Icon = require("./Icon-NDphOLR6.js"), IconButton = require("./IconButton-DFk-yVc6.js"), sharedTypes = require("./sharedTypes-BeP4wu1R.js"), css = {
+var Badge = require("./Badge-DNzsgQk9.js"), Icon = require("./Icon-VcvTUkMA.js"), IconButton = require("./IconButton-Cz7iTVhO.js"), sharedTypes = require("./sharedTypes-BW_hw-Vb.js"), css = {
     wrapper: "TabBar-module_wrapper__cyOR1 flexBox-module_rowStart__4tcxS",
     option: "TabBar-module_option__gYjDf flexBox-module_row__z24tF",
     icon: "TabBar-module_icon__JDgG3 flexBox-module_row__z24tF",
@@ -69,9 +69,9 @@ const placeholderOptions = [ {
         }
         null !== nextIndex && (event.preventDefault(), handleOptionClick(nextIndex), focusOption(nextIndex));
     }, [ options.length, handleOptionClick, focusOption ]), renderedOptions = React.useMemo(() => options.map((option, i) => jsxRuntime.jsx(Option, {
-        label: option.name,
-        value: i,
-        showToolTip: option.toolTip,
+        name: option.name,
+        index: i,
+        toolTip: option.toolTip,
         selected: i === index,
         padding: padding,
         icon: option.icon,
@@ -125,21 +125,21 @@ const placeholderOptions = [ {
 TabBar.displayName = "TabBar";
 
 const Option = React.memo(props => {
-    const theme = hooks_useTheme.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", borderColor: borderColor = "var(--core-outline-secondary)", count: count = 0, iconFill: iconFill = !1, textSize: textSize = "m", onKeyDown: onKeyDown = () => null, buttonRef: buttonRef} = props, ref = React.useRef(null), strokeColor = React.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 = React.useCallback(e => {
-        if (onToolTip(null), showToolTip && ref.current) {
+    const theme = hooks_useTheme.useTheme(), {name: name = "Option", index: index = 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, toolTip: toolTip = null, underline: underline = !0, tabWidth: tabWidth = "fill", borderColor: borderColor = "var(--core-outline-secondary)", count: count = 0, iconFill: iconFill = !1, textSize: textSize = "m", onKeyDown: onKeyDown = () => null, buttonRef: buttonRef} = props, ref = React.useRef(null), strokeColor = React.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 = React.useCallback(e => {
+        if (onToolTip(null), toolTip && ref.current) {
             const tip = {
                 type: sharedTypes.ToolTipType.button,
                 payload: {
-                    label: showToolTip
+                    label: toolTip
                 },
                 event: e,
                 ref: ref
             };
             onToolTip(tip);
         }
-    }, [ showToolTip, onToolTip ]), handleMouseLeave = React.useCallback(() => {
-        showToolTip && onToolTip(null);
-    }, [ showToolTip, onToolTip ]), textColor = React.useMemo(() => disabled ? "var(--core-text-disabled)" : selected ? "var(--core-text-special)" : "var(--core-text-primary)", [ disabled, selected ]), setTabWidth = React.useMemo(() => "compact" === tabWidth ? "min-content" : "fill" === tabWidth ? "unset" : `${tabWidth}px`, [ tabWidth ]), setTabFlex = React.useMemo(() => "fill" === tabWidth ? "1" : "unset", [ tabWidth ]), setUnderline = React.useMemo(() => selected && underline && !disabled ? "1px" : "0", [ underline, disabled, selected ]), cssVars = React.useMemo(() => ({
+    }, [ toolTip, onToolTip ]), handleMouseLeave = React.useCallback(() => {
+        toolTip && onToolTip(null);
+    }, [ toolTip, onToolTip ]), textColor = React.useMemo(() => disabled ? "var(--core-text-disabled)" : selected ? "var(--core-text-special)" : "var(--core-text-primary)", [ disabled, selected ]), setTabWidth = React.useMemo(() => "compact" === tabWidth ? "min-content" : "fill" === tabWidth ? "unset" : `${tabWidth}px`, [ tabWidth ]), setTabFlex = React.useMemo(() => "fill" === tabWidth ? "1" : "unset", [ tabWidth ]), setUnderline = React.useMemo(() => selected && underline && !disabled ? "1px" : "0", [ underline, disabled, selected ]), cssVars = React.useMemo(() => ({
         "--tab-bar-option-border": setUnderline,
         "--tab-bar-option-border-color": borderColor,
         "--tab-bar-option-padding": misc.setStyle(padding, "8px"),
@@ -162,8 +162,8 @@ const Option = React.memo(props => {
         tabIndex: selected ? 0 : -1,
         onMouseEnter: handleMouseOver,
         onMouseLeave: handleMouseLeave,
-        onClick: () => onClick(value),
-        onKeyDown: e => onKeyDown(e, value),
+        onClick: () => onClick(index),
+        onKeyDown: e => onKeyDown(e, index),
         children: [ icon && jsxRuntime.jsx("div", {
             className: css.icon,
             children: jsxRuntime.jsx(Icon.Icon, {
@@ -172,12 +172,12 @@ const Option = React.memo(props => {
                 size: iconSize,
                 strokeColor: strokeColor
             })
-        }), label, 0 !== count && jsxRuntime.jsx(Badge.Badge, {
+        }), name, 0 !== count && jsxRuntime.jsx(Badge.Badge, {
             variant: "light",
             hideNull: !1,
             count: count
         }) ]
     });
-}, (prevProps, nextProps) => prevProps.selected === nextProps.selected && prevProps.underline === nextProps.underline && prevProps.tabWidth === nextProps.tabWidth && prevProps.disabled === nextProps.disabled && prevProps.iconGap === nextProps.iconGap && prevProps.iconSize === nextProps.iconSize && prevProps.count === nextProps.count && prevProps.label === nextProps.label && prevProps.icon === nextProps.icon && prevProps.borderColor === nextProps.borderColor && prevProps.textSize === nextProps.textSize && prevProps.padding === nextProps.padding);
+}, (prevProps, nextProps) => prevProps.selected === nextProps.selected && prevProps.underline === nextProps.underline && prevProps.tabWidth === nextProps.tabWidth && prevProps.disabled === nextProps.disabled && prevProps.iconGap === nextProps.iconGap && prevProps.iconSize === nextProps.iconSize && prevProps.count === nextProps.count && prevProps.icon === nextProps.icon && prevProps.borderColor === nextProps.borderColor && prevProps.textSize === nextProps.textSize && prevProps.padding === nextProps.padding && prevProps.name === nextProps.name && prevProps.index === nextProps.index);
 
 Option.displayName = "TabOption", exports.TabBar = TabBar;

package/dist/cjs/chunks/{TextArea-BCeor0hV.js → TextArea-BSo1K02e.js}

@@ -1,13 +1,13 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), Button = require("./Button-Cep3SqsR.js"), css_wrapper = "TextArea-module_wrapper__O0sWP flexBox-module_columnStart__C7P44", css_textarea = "TextArea-module_textarea__-R2n0 scrollBars-module_scrollbars__c-ZPl", css_send = "TextArea-module_send__Cub13", css_xs = "TextArea-module_xs__5e748 type-module_body-xs-regular__ZAFft", css_s = "TextArea-module_s__Ac-fq type-module_body-s-regular__vRHSP", css_m = "TextArea-module_m__dod4R type-module_body-m-regular__LuQBA", css_l = "TextArea-module_l__-uLCG type-module_body-l-regular__lOYbg";
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), theme_corners = require("../theme/corners.js"), Button = require("./Button-GrPLJIBP.js"), css_wrapper = "TextArea-module_wrapper__O0sWP flexBox-module_columnStart__C7P44", css_textarea = "TextArea-module_textarea__-R2n0 scrollBars-module_scrollbars__c-ZPl", css_send = "TextArea-module_send__Cub13", css_xs = "TextArea-module_xs__5e748 type-module_body-xs-regular__ZAFft", css_s = "TextArea-module_s__Ac-fq type-module_body-s-regular__vRHSP", css_m = "TextArea-module_m__dod4R type-module_body-m-regular__LuQBA", css_l = "TextArea-module_l__-uLCG type-module_body-l-regular__lOYbg";
 
 const TextArea = React.memo(props => {
-    const {value: value = "", name: name = "text_area", width: width = "100%", height: height = "auto", focused: focused = !1, placeholder: placeholder = "Enter text here...", rows: rows = 6, border: border = !0, borderRadius: borderRadius = 4, padding: padding = "16px 4px 16px 16px", error: error = !1, resizable: resizable = !0, hasSend: hasSend = !1, sendOffset: sendOffset = {
+    const {value: value = "", name: name = "text_area", width: width = "100%", height: height = "auto", focused: focused = !1, placeholder: placeholder = "Enter text here...", rows: rows = 6, border: border = !0, borderRadius: borderRadius = theme_corners.corners["corner-xs"], padding: padding = "16px 4px 16px 16px", error: error = !1, resizable: resizable = !0, hasSend: hasSend = !1, sendOffset: sendOffset = {
         bottom: 10,
         right: 10
-    }, sendSize: sendSize = 36, returnSubmits: returnSubmits = !1, backgroundColor: backgroundColor, bgColor: bgColor, minWidth: minWidth, textSize: textSize = "m", disabled: disabled = !1, submitClears: submitClears = !0, maxLength: maxLength, onChange: onChange = () => null, onFocus: onFocus = () => null, onBlur: onBlur = () => null, onSubmit: onSubmit = () => null, onKeyDown: onKeyDown = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "value", "name", "width", "height", "focused", "placeholder", "rows", "border", "borderRadius", "padding", "error", "resizable", "hasSend", "sendOffset", "sendSize", "returnSubmits", "backgroundColor", "bgColor", "minWidth", "textSize", "disabled", "submitClears", "maxLength", "onChange", "onFocus", "onBlur", "onSubmit", "onKeyDown" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, [isFocused, setIsFocused] = React.useState(focused), [text, setText] = React.useState(value), ref = React.useRef(null), handleResize = React.useCallback(() => {
+    }, sendSize: sendSize = 36, returnSubmits: returnSubmits = !1, backgroundColor: backgroundColor, minWidth: minWidth, textSize: textSize = "m", disabled: disabled = !1, submitClears: submitClears = !0, maxLength: maxLength, onChange: onChange = () => null, onFocus: onFocus = () => null, onBlur: onBlur = () => null, onSubmit: onSubmit = () => null, onKeyDown: onKeyDown = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "value", "name", "width", "height", "focused", "placeholder", "rows", "border", "borderRadius", "padding", "error", "resizable", "hasSend", "sendOffset", "sendSize", "returnSubmits", "backgroundColor", "minWidth", "textSize", "disabled", "submitClears", "maxLength", "onChange", "onFocus", "onBlur", "onSubmit", "onKeyDown" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", resolvedBackgroundColor = backgroundColor, [isFocused, setIsFocused] = React.useState(focused), [text, setText] = React.useState(value), ref = React.useRef(null), handleResize = React.useCallback(() => {
         (null == ref ? void 0 : ref.current) && (ref.current.style.height = "auto", ref.current.style.height = `${ref.current.scrollHeight}px`);
     }, []);
     React.useEffect(() => {
@@ -23,8 +23,8 @@ const TextArea = React.memo(props => {
         var _a, _b;
         setIsFocused(!1), onBlur(null !== (_b = null === (_a = ref.current) || void 0 === _a ? void 0 : _a.value) && void 0 !== _b ? _b : "");
     }, [ onBlur ]), handleSubmit = React.useCallback(e => {
-        null == e || e.preventDefault(), handleFocus(), onSubmit(text), submitClears && setText(""), 
-        (null == ref ? void 0 : ref.current) && (ref.current.value = ""), handleResize();
+        null == e || e.preventDefault(), handleFocus(), onSubmit(text), submitClears && (setText(""), 
+        ref.current && (ref.current.value = "")), handleResize();
     }, [ handleFocus, onSubmit, text, submitClears, handleResize ]), handleKeyDownWrapper = React.useCallback(e => {
         returnSubmits && "Enter" === e.key && (e.preventDefault(), e.stopPropagation(), 
         handleSubmit(void 0)), onKeyDown(e);

package/dist/cjs/chunks/{TextField-CtbfTAmK.js → TextField-TpzwNrB3.js}

@@ -1,17 +1,21 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B8RWDz3P.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js");
+var tslib_es6 = require("./tslib.es6-Y3RzGMQw.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js");
 
-require("../theme/colors.js"), require("../theme/type.js");
+require("../theme/colors.js");
 
-var misc = require("./misc-LAaHE64b.js");
+var theme_corners = require("../theme/corners.js");
 
-require("./broadcastChannel-Cqzs7sXX.js"), require("./webRTCStore-B-ZZdCuw.js"), 
-require("./microphoneStore-Ds2J_e1I.js"), require("./volumeStore-DbLg_-L9.js"), 
+require("../theme/type.js");
+
+var misc = require("./misc-B2oK3rIL.js");
+
+require("./broadcastChannel-CRR59lw6.js"), require("./webRTCStore-XciamNCa.js"), 
+require("./microphoneStore-axA5TgKM.js"), require("./volumeStore-D64ziNWo.js"), 
 require("../hooks/useWindow.js");
 
-var Button = require("./Button-Cep3SqsR.js"), Icon = require("./Icon-NDphOLR6.js"), IconButton = require("./IconButton-DFk-yVc6.js"), css = {
+var Button = require("./Button-GrPLJIBP.js"), Icon = require("./Icon-VcvTUkMA.js"), IconButton = require("./IconButton-Cz7iTVhO.js"), css = {
     wrapper: "TextField-module_wrapper__qZ-p- flexBox-module_rowStart__4tcxS",
     container: "TextField-module_container__5U9yK flexBox-module_rowStart__4tcxS",
     label: "TextField-module_label__jD8MR flexBox-module_rowStart__4tcxS",
@@ -21,7 +25,8 @@ var Button = require("./Button-Cep3SqsR.js"), Icon = require("./Icon-NDphOLR6.js
     xs: "TextField-module_xs__vyt2t type-module_body-xs-regular__ZAFft",
     s: "TextField-module_s__0qm83 type-module_body-s-regular__vRHSP",
     m: "TextField-module_m__M-tLl type-module_body-m-regular__LuQBA",
-    l: "TextField-module_l__gbNRz type-module_body-l-regular__lOYbg"
+    l: "TextField-module_l__gbNRz type-module_body-l-regular__lOYbg",
+    xl: "TextField-module_xl__tp--W type-module_body-xl-regular__pF2kC"
 };
 
 const MOTION_CONFIG = {
@@ -44,7 +49,7 @@ const MOTION_CONFIG = {
     const theme = hooks_useTheme.useTheme(), {name: name = "input_name", value: value = "", label: label, labelSize: labelSize = "m", textSize: textSize = "m", placeholder: placeholder = "placeholder", focused: focused = !1, onSubmit: onSubmit = () => null, onChange: onChange = () => null, onBlur: onBlur = () => null, onFocus: onFocus = () => null, onKeydown: onKeydown = () => null, onAction: onAction = () => null, onPaste: onPaste = () => null, onClear: onClear = () => null, actionButton: actionButton = !1, maxLength: maxLength, size: size = {
         width: "100%",
         height: "auto"
-    }, padding: padding, borderRadius: borderRadius = 8, editable: editable = !0, textAlign: textAlign = "left", inline: inline = !1, noShow: noShow = !1, borderType: borderType = "box", error: error = !1, borderColorFocused: borderColorFocused = "var(--core-link-primary)", borderColorBlurred: borderColorBlurred = "var(--core-outline-primary)", borderColorError: borderColorError = "var(--feedback-warning)", backgroundColorFocused: backgroundColorFocused = "var(--core-surface-secondary)", backgroundColorBlurred: backgroundColorBlurred = "var(--core-surface-secondary)", textColorFocused: textColorFocused = "var(--core-text-primary)", textColorBlurred: textColorBlurred = "var(--core-text-primary)", textColorError: textColorError = "var(--feedback-warning)", textColorPlaceholder: textColorPlaceholder = "var(--core-text-disabled)", textColorDisabled: textColorDisabled = "var(--core-text-disabled)", labelColor: labelColor = "var(--core-text-primary)", iconLeft: iconLeft, clearButton: clearButton = {
+    }, padding: padding, borderRadius: borderRadius = theme_corners.corners["corner-m"], editable: editable = !0, textAlign: textAlign = "left", inline: inline = !1, noShow: noShow = !1, borderType: borderType = "box", error: error = !1, borderColorFocused: borderColorFocused = "var(--core-link-primary)", borderColorBlurred: borderColorBlurred = "var(--core-outline-primary)", borderColorError: borderColorError = "var(--feedback-warning)", backgroundColorFocused: backgroundColorFocused = "var(--core-surface-secondary)", backgroundColorBlurred: backgroundColorBlurred = "var(--core-surface-secondary)", textColorFocused: textColorFocused = "var(--core-text-primary)", textColorBlurred: textColorBlurred = "var(--core-text-primary)", textColorError: textColorError = "var(--feedback-warning)", textColorPlaceholder: textColorPlaceholder = "var(--core-text-disabled)", textColorDisabled: textColorDisabled = "var(--core-text-disabled)", labelColor: labelColor = "var(--core-text-primary)", iconLeft: iconLeft, clearButton: clearButton = {
         size: 20
     }, clearBlurs: clearBlurs = !1, disabled: disabled = !1, inputType: inputType = "text"} = props, divAttributes = tslib_es6.__rest(props, [ "name", "value", "label", "labelSize", "textSize", "placeholder", "focused", "onSubmit", "onChange", "onBlur", "onFocus", "onKeydown", "onAction", "onPaste", "onClear", "actionButton", "maxLength", "size", "padding", "borderRadius", "editable", "textAlign", "inline", "noShow", "borderType", "error", "borderColorFocused", "borderColorBlurred", "borderColorError", "backgroundColorFocused", "backgroundColorBlurred", "textColorFocused", "textColorBlurred", "textColorError", "textColorPlaceholder", "textColorDisabled", "labelColor", "iconLeft", "clearButton", "clearBlurs", "disabled", "inputType" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", input = React.useRef(null), [text, setText] = React.useState(value), [isFocused, setIsFocused] = React.useState(focused), [show, setShow] = React.useState(!1);
     React.useEffect(() => {