@apple-pie/slice 0.1.52 → 0.1.54

package/dist/esm/chunks/{Pager-Bjwlh0Vs.mjs → Pager-Pd6QanSG.mjs}

@@ -1,11 +1,11 @@
 'use client';
-import { a as __rest } from "./tslib.es6-DGRmn-gx.mjs";
+import { a as __rest } from "./tslib.es6-BTg9ZFwR.mjs";
 
 import { jsx } from "react/jsx-runtime";
 
 import React, { useState, useMemo, useEffect, useCallback } from "react";
 
-import { a as accessibleKeyDown } from "./misc-GB29X0YR.mjs";
+import { a as accessibleKeyDown } from "./misc-NDOWTiFf.mjs";
 
 var 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";
 

package/dist/esm/chunks/{ProgressIndicator-C8tli-Jg.mjs → ProgressIndicator-dkR6UF1M.mjs}

@@ -9,17 +9,19 @@ import "../theme/colors.mjs";
 
 import "../theme/type.mjs";
 
-import { a as __rest } from "./tslib.es6-DGRmn-gx.mjs";
+import { a as __rest } from "./tslib.es6-BTg9ZFwR.mjs";
 
-import "./broadcastChannel-qkn7bL4S.mjs";
+import "./broadcastChannel-jqOpePyV.mjs";
 
-import "./microphoneStore-CHjTUEL_.mjs";
+import "./webRTCStore-DmyQS-SN.mjs";
 
-import "./volumeStore-DBjptppw.mjs";
+import "./microphoneStore-CtpUG1DB.mjs";
+
+import "./volumeStore-IY7T-8fH.mjs";
 
 import "../hooks/useWindow.mjs";
 
-import { I as Icon } from "./Icon-DGQB6Mfm.mjs";
+import { I as Icon } from "./Icon-Ce2CM7lt.mjs";
 
 import { AnimatePresence, motion } from "motion/react";
 

package/dist/esm/chunks/{PromptInput-JE3EkzEV.mjs → PromptInput-CLVqz0ux.mjs}

@@ -7,23 +7,27 @@ import { useTheme } from "../hooks/useTheme.mjs";
 
 import "../theme/colors.mjs";
 
+import { corners } from "../theme/corners.mjs";
+
 import "../theme/type.mjs";
 
-import "./tslib.es6-DGRmn-gx.mjs";
+import "./tslib.es6-BTg9ZFwR.mjs";
+
+import { s as setStyle } from "./misc-NDOWTiFf.mjs";
 
-import { s as setStyle } from "./misc-GB29X0YR.mjs";
+import "./broadcastChannel-jqOpePyV.mjs";
 
-import "./broadcastChannel-qkn7bL4S.mjs";
+import "./webRTCStore-DmyQS-SN.mjs";
 
-import "./microphoneStore-CHjTUEL_.mjs";
+import "./microphoneStore-CtpUG1DB.mjs";
 
-import "./volumeStore-DBjptppw.mjs";
+import "./volumeStore-IY7T-8fH.mjs";
 
 import "../hooks/useWindow.mjs";
 
-import { B as Button } from "./Button-BdxJ4wnE.mjs";
+import { B as Button } from "./Button-CWM6SoTH.mjs";
 
-import { F as FileList } from "./FileList-D0b6RxKc.mjs";
+import { F as FileList } from "./FileList-WNFbRSQz.mjs";
 
 var css = {
     wrapperBg: "PromptInput-module_wrapperBg__zabZq flexBox-module_columnStart__C7P44",
@@ -42,7 +46,7 @@ var css = {
 };
 
 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} = useTheme(), [isFocused, setIsFocused] = useState(null != focused && focused), [textValue, setTextValue] = useState(value), textAreaRef = useRef(null), handleFocus = 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 = 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} = useTheme(), [isFocused, setIsFocused] = useState(null != focused && focused), [textValue, setTextValue] = useState(value), textAreaRef = useRef(null), handleFocus = 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);
@@ -111,7 +115,7 @@ const PromptInputBase = React.forwardRef((props, ref) => {
                 children: jsx(FileList, {
                     files: attachments,
                     onChange: handleAttachmentsChange,
-                    bgColor: "var(--core-surface-primary)",
+                    backgroundColor: "var(--core-surface-primary)",
                     textSize: "s",
                     direction: "row",
                     gap: 8,
@@ -154,7 +158,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/esm/chunks/{RadioButton-BK37fGER.mjs → RadioButton-ClKR7eks.mjs}

@@ -1,13 +1,13 @@
 'use client';
-import { a as __rest } from "./tslib.es6-DGRmn-gx.mjs";
+import { a as __rest } from "./tslib.es6-BTg9ZFwR.mjs";
 
 import { jsxs, jsx } from "react/jsx-runtime";
 
 import React, { useState, useEffect, useCallback, useMemo } from "react";
 
-import { s as setStyle } from "./misc-GB29X0YR.mjs";
+import { s as setStyle } from "./misc-NDOWTiFf.mjs";
 
-import { I as Icon } from "./Icon-DGQB6Mfm.mjs";
+import { I as Icon } from "./Icon-Ce2CM7lt.mjs";
 
 var 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";
 

package/dist/esm/chunks/{RadioButtonList-CPfE3YBM.mjs → RadioButtonList-YtfbHCig.mjs}

@@ -1,13 +1,13 @@
 'use client';
-import { a as __rest } from "./tslib.es6-DGRmn-gx.mjs";
+import { a as __rest } from "./tslib.es6-BTg9ZFwR.mjs";
 
 import { jsx, jsxs } from "react/jsx-runtime";
 
 import React, { useId, useState, useEffect, useCallback, useMemo } from "react";
 
-import { s as setStyle } from "./misc-GB29X0YR.mjs";
+import { s as setStyle } from "./misc-NDOWTiFf.mjs";
 
-import { R as RadioButton } from "./RadioButton-BK37fGER.mjs";
+import { R as RadioButton } from "./RadioButton-ClKR7eks.mjs";
 
 var 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";
 

package/dist/esm/chunks/{Slider-D6nWSQ-A.mjs → Slider-B8A9FdgY.mjs}

@@ -1,5 +1,5 @@
 'use client';
-import { a as __rest } from "./tslib.es6-DGRmn-gx.mjs";
+import { a as __rest } from "./tslib.es6-BTg9ZFwR.mjs";
 
 import { jsx, jsxs } from "react/jsx-runtime";
 
@@ -9,15 +9,17 @@ import "../theme/colors.mjs";
 
 import "../theme/type.mjs";
 
-import { p as pointerPosition } from "./misc-GB29X0YR.mjs";
+import { p as pointerPosition } from "./misc-NDOWTiFf.mjs";
 
-import { d as debounce } from "./debounce-xuz65F25.mjs";
+import { d as debounce } from "./debounce-LajsXcz1.mjs";
 
-import "./broadcastChannel-qkn7bL4S.mjs";
+import "./broadcastChannel-jqOpePyV.mjs";
 
-import "./microphoneStore-CHjTUEL_.mjs";
+import "./webRTCStore-DmyQS-SN.mjs";
 
-import "./volumeStore-DBjptppw.mjs";
+import "./microphoneStore-CtpUG1DB.mjs";
+
+import "./volumeStore-IY7T-8fH.mjs";
 
 import "../hooks/useWindow.mjs";
 

package/dist/esm/chunks/{Spacer-CWY79s4p.mjs → Spacer-CNowPM3L.mjs}

@@ -1,5 +1,5 @@
 'use client';
-import { a as __rest } from "./tslib.es6-DGRmn-gx.mjs";
+import { a as __rest } from "./tslib.es6-BTg9ZFwR.mjs";
 
 import { jsx } from "react/jsx-runtime";
 

package/dist/esm/chunks/{Switch-De_cFgOS.mjs → Switch-BT1dUQya.mjs}

@@ -1,5 +1,5 @@
 'use client';
-import { a as __rest } from "./tslib.es6-DGRmn-gx.mjs";
+import { a as __rest } from "./tslib.es6-BTg9ZFwR.mjs";
 
 import { jsx } from "react/jsx-runtime";
 
@@ -10,7 +10,7 @@ import React, { useState, useEffect, useCallback, useMemo } from "react";
 var 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 = __rest(props, [ "fieldName", "state", "value", "height", "width", "padding", "backgroundColorOn", "backgroundColorOff", "bgColorOn", "bgColorOff", "knobColor", "onChange" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [on, setOn] = 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 = __rest(props, [ "fieldName", "state", "value", "height", "width", "padding", "backgroundColorOn", "backgroundColorOff", "knobColor", "onChange" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [on, setOn] = useState(state), resolvedBackgroundColorOn = backgroundColorOn, resolvedBackgroundColorOff = backgroundColorOff;
     useEffect(() => {
         setOn(state);
     }, [ state ]);

package/dist/esm/chunks/{TabBar-CCq8-TdA.mjs → TabBar-CCiJ42x5.mjs}

@@ -1,5 +1,5 @@
 'use client';
-import { a as __rest } from "./tslib.es6-DGRmn-gx.mjs";
+import { a as __rest } from "./tslib.es6-BTg9ZFwR.mjs";
 
 import { jsx, jsxs } from "react/jsx-runtime";
 
@@ -11,23 +11,25 @@ import "../theme/colors.mjs";
 
 import "../theme/type.mjs";
 
-import { s as setStyle } from "./misc-GB29X0YR.mjs";
+import { s as setStyle } from "./misc-NDOWTiFf.mjs";
 
-import "./broadcastChannel-qkn7bL4S.mjs";
+import "./broadcastChannel-jqOpePyV.mjs";
 
-import "./microphoneStore-CHjTUEL_.mjs";
+import "./webRTCStore-DmyQS-SN.mjs";
 
-import "./volumeStore-DBjptppw.mjs";
+import "./microphoneStore-CtpUG1DB.mjs";
+
+import "./volumeStore-IY7T-8fH.mjs";
 
 import "../hooks/useWindow.mjs";
 
-import { B as Badge } from "./Badge-Cli_Ebpu.mjs";
+import { B as Badge } from "./Badge-gU-yUZyp.mjs";
 
-import { I as Icon } from "./Icon-DGQB6Mfm.mjs";
+import { I as Icon } from "./Icon-Ce2CM7lt.mjs";
 
-import { I as IconButton } from "./IconButton-Wffb0Rhg.mjs";
+import { I as IconButton } from "./IconButton-DmhOQNtq.mjs";
 
-import { T as ToolTipType } from "./sharedTypes-DqPH1p0Q.mjs";
+import { T as ToolTipType } from "./sharedTypes-DnHEGYor.mjs";
 
 var css = {
     wrapper: "TabBar-module_wrapper__cyOR1 flexBox-module_rowStart__4tcxS",

package/dist/esm/chunks/{TextArea-kAVb9Lpy.mjs → TextArea-MVHdEa8y.mjs}

@@ -1,19 +1,21 @@
 'use client';
-import { a as __rest } from "./tslib.es6-DGRmn-gx.mjs";
+import { a as __rest } from "./tslib.es6-BTg9ZFwR.mjs";
 
 import { jsxs, jsx } from "react/jsx-runtime";
 
 import React, { useState, useRef, useCallback, useEffect, useMemo } from "react";
 
-import { B as Button } from "./Button-BdxJ4wnE.mjs";
+import { corners } from "../theme/corners.mjs";
+
+import { B as Button } from "./Button-CWM6SoTH.mjs";
 
 var 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 = 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 = __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 = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, [isFocused, setIsFocused] = useState(focused), [text, setText] = useState(value), ref = useRef(null), handleResize = 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 = __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 = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", resolvedBackgroundColor = backgroundColor, [isFocused, setIsFocused] = useState(focused), [text, setText] = useState(value), ref = useRef(null), handleResize = useCallback(() => {
         (null == ref ? void 0 : ref.current) && (ref.current.style.height = "auto", ref.current.style.height = `${ref.current.scrollHeight}px`);
     }, []);
     useEffect(() => {
@@ -29,8 +31,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 = 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 = useCallback(e => {
         returnSubmits && "Enter" === e.key && (e.preventDefault(), e.stopPropagation(), 
         handleSubmit(void 0)), onKeyDown(e);

package/dist/esm/chunks/{TextField-MxcxS6SE.mjs → TextField-BZ2kmUcF.mjs}

@@ -1,5 +1,5 @@
 'use client';
-import { a as __rest } from "./tslib.es6-DGRmn-gx.mjs";
+import { a as __rest } from "./tslib.es6-BTg9ZFwR.mjs";
 
 import { jsxs, jsx } from "react/jsx-runtime";
 
@@ -11,23 +11,27 @@ import { useTheme } from "../hooks/useTheme.mjs";
 
 import "../theme/colors.mjs";
 
+import { corners } from "../theme/corners.mjs";
+
 import "../theme/type.mjs";
 
-import { s as setStyle } from "./misc-GB29X0YR.mjs";
+import { s as setStyle } from "./misc-NDOWTiFf.mjs";
+
+import "./broadcastChannel-jqOpePyV.mjs";
 
-import "./broadcastChannel-qkn7bL4S.mjs";
+import "./webRTCStore-DmyQS-SN.mjs";
 
-import "./microphoneStore-CHjTUEL_.mjs";
+import "./microphoneStore-CtpUG1DB.mjs";
 
-import "./volumeStore-DBjptppw.mjs";
+import "./volumeStore-IY7T-8fH.mjs";
 
 import "../hooks/useWindow.mjs";
 
-import { B as Button } from "./Button-BdxJ4wnE.mjs";
+import { B as Button } from "./Button-CWM6SoTH.mjs";
 
-import { I as Icon } from "./Icon-DGQB6Mfm.mjs";
+import { I as Icon } from "./Icon-Ce2CM7lt.mjs";
 
-import { I as IconButton } from "./IconButton-Wffb0Rhg.mjs";
+import { I as IconButton } from "./IconButton-DmhOQNtq.mjs";
 
 var css = {
     wrapper: "TextField-module_wrapper__qZ-p- flexBox-module_rowStart__4tcxS",
@@ -63,7 +67,7 @@ const MOTION_CONFIG = {
     const theme = 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 = 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 = __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 = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", input = useRef(null), [text, setText] = useState(value), [isFocused, setIsFocused] = useState(focused), [show, setShow] = useState(!1);
     useEffect(() => {

package/dist/esm/chunks/{Tip-CuRp-fki.mjs → Tip-dvhw-sBF.mjs}

@@ -1,5 +1,5 @@
 'use client';
-import { a as __rest } from "./tslib.es6-DGRmn-gx.mjs";
+import { a as __rest } from "./tslib.es6-BTg9ZFwR.mjs";
 
 import { jsx } from "react/jsx-runtime";
 
@@ -7,7 +7,9 @@ import { motion } from "motion/react";
 
 import React, { useState, useRef, useEffect, useMemo } from "react";
 
-import { f as filterClasses } from "./misc-GB29X0YR.mjs";
+import { f as filterClasses } from "./misc-NDOWTiFf.mjs";
+
+import { corners } from "../theme/corners.mjs";
 
 var css = {
     wrapper: "Tip-module_wrapper__D7ACT flexBox-module_rowStart__4tcxS",
@@ -23,7 +25,7 @@ const tipBasePos = {
     top: 0
 }, TipBase = React.forwardRef((props, ref) => {
     var _a;
-    const {tip: tip, textSize: textSize = "s", backgroundColor: backgroundColor, bgColor: bgColor, textColor: textColor, color: color, border: border = !0, borderColor: borderColor, padding: padding, borderRadius: borderRadius, radius: radius, coords: coords, showDelay: showDelay = 500, hideDelay: hideDelay = 2500} = props, divAttributes = __rest(props, [ "tip", "textSize", "backgroundColor", "bgColor", "textColor", "color", "border", "borderColor", "padding", "borderRadius", "radius", "coords", "showDelay", "hideDelay" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? `${className}` : "", [pos, setPos] = useState(tipBasePos), [ready, setReady] = useState(!1), [animate, setAnimate] = useState(!1), timer = useRef(null), resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, resolvedTextColor = null != textColor ? textColor : color, resolvedBorderRadius = null != borderRadius ? borderRadius : radius;
+    const {tip: tip, textSize: textSize = "s", backgroundColor: backgroundColor, textColor: textColor, color: color, border: border = !0, borderColor: borderColor, padding: padding, borderRadius: borderRadius, radius: radius, coords: coords, showDelay: showDelay = 500, hideDelay: hideDelay = 2500} = props, divAttributes = __rest(props, [ "tip", "textSize", "backgroundColor", "textColor", "color", "border", "borderColor", "padding", "borderRadius", "radius", "coords", "showDelay", "hideDelay" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? `${className}` : "", [pos, setPos] = useState(tipBasePos), [ready, setReady] = useState(!1), [animate, setAnimate] = useState(!1), timer = useRef(null), resolvedBackgroundColor = backgroundColor, resolvedTextColor = null != textColor ? textColor : color, resolvedBorderRadius = null != borderRadius ? borderRadius : radius;
     useEffect(() => {
         timer.current && clearTimeout(timer.current);
         const {x: x, y: y} = null != coords ? coords : {
@@ -53,7 +55,7 @@ const tipBasePos = {
         "--tooltip-background": null != resolvedBackgroundColor ? resolvedBackgroundColor : "var(--core-surface-secondary)",
         "--tooltip-color": null != resolvedTextColor ? resolvedTextColor : "var(--core-text-primary)",
         "--tooltip-border": border ? `1px solid ${null != borderColor ? borderColor : "var(--core-outline-primary)"}` : "unset",
-        "--tooltip-border-radius": null != resolvedBorderRadius ? resolvedBorderRadius : "4px"
+        "--tooltip-border-radius": null != resolvedBorderRadius ? resolvedBorderRadius : `${corners["corner-xs"]}px`
     }), [ padding, resolvedBackgroundColor, resolvedTextColor, border, borderColor, resolvedBorderRadius ]), coordStyle = useMemo(() => {
         const {left: left, top: top} = pos;
         return {

package/dist/esm/chunks/{Toast-CvWVJwrM.mjs → Toast-Ct5uczWn.mjs}

@@ -1,5 +1,5 @@
 'use client';
-import { a as __rest } from "./tslib.es6-DGRmn-gx.mjs";
+import { a as __rest } from "./tslib.es6-BTg9ZFwR.mjs";
 
 import { jsx, jsxs } from "react/jsx-runtime";
 
@@ -13,19 +13,21 @@ import "../theme/colors.mjs";
 
 import "../theme/type.mjs";
 
-import { s as setStyle, f as filterClasses, a as accessibleKeyDown } from "./misc-GB29X0YR.mjs";
+import { s as setStyle, f as filterClasses, a as accessibleKeyDown } from "./misc-NDOWTiFf.mjs";
 
-import "./broadcastChannel-qkn7bL4S.mjs";
+import "./broadcastChannel-jqOpePyV.mjs";
 
-import "./microphoneStore-CHjTUEL_.mjs";
+import "./webRTCStore-DmyQS-SN.mjs";
 
-import "./volumeStore-DBjptppw.mjs";
+import "./microphoneStore-CtpUG1DB.mjs";
+
+import "./volumeStore-IY7T-8fH.mjs";
 
 import "../hooks/useWindow.mjs";
 
-import { I as Icon } from "./Icon-DGQB6Mfm.mjs";
+import { I as Icon } from "./Icon-Ce2CM7lt.mjs";
 
-import { P as ProgressIndicator } from "./ProgressIndicator-C8tli-Jg.mjs";
+import { P as ProgressIndicator } from "./ProgressIndicator-dkR6UF1M.mjs";
 
 var ToastType, css = {
     wrapper: "Toast-module_wrapper__1uj9O flexBox-module_rowBetween__5FEvi",

package/dist/esm/chunks/{ToggleButton-DpR2FO_I.mjs → ToggleButton-nusOpkrZ.mjs}

@@ -3,14 +3,14 @@ import { jsxs, jsx } from "react/jsx-runtime";
 
 import { useMemo } from "react";
 
-import { I as IconButton } from "./IconButton-Wffb0Rhg.mjs";
+import { I as IconButton } from "./IconButton-DmhOQNtq.mjs";
 
-import { L as Label } from "./Label-BF7Bac6I.mjs";
+import { L as Label } from "./Label-CKShh9JV.mjs";
 
 var css_toggleButton = "ToggleButton-module_toggleButton__H7KgI flexBox-module_rowStart__4tcxS";
 
 function ToggleButton(props) {
-    const {label: label, textSize: textSize, icon: icon, iconOn: iconOn, selected: selected = !1, iconColor: iconColor = "var(--core-text-primary)", iconColorOn: iconColorOn = "var(--core-surface-primary)", iconColorHover: iconColorHover = "var(--core-text-primary)", bgColor: bgColor = "var(--core-surface-secondary)", bgColorHover: bgColorHover = "var(--core-surface-secondary)", bgColorOn: bgColorOn = "var(--core-text-special)", iconSize: iconSize = 20, buttonSize: buttonSize = "m", tooltip: tooltip, gap: gap = 4, unselect: unselect = !0, fill: fill = !1, disabled: disabled = !1, border: border = !1, onChange: onChange, onSelect: onSelect, onToolTip: onToolTip, children: children, presetAnimations: presetAnimations, customAnimations: customAnimations} = props, handleClick = () => {
+    const {label: label, textSize: textSize, icon: icon, iconOn: iconOn, selected: selected = !1, iconColor: iconColor = "var(--core-text-primary)", iconColorOn: iconColorOn = "var(--core-surface-primary)", iconColorHover: iconColorHover = "var(--core-text-primary)", backgroundColor: backgroundColor = "var(--core-surface-secondary)", backgroundColorHover: backgroundColorHover = "var(--core-surface-secondary)", backgroundColorOn: backgroundColorOn = "var(--core-text-special)", iconSize: iconSize = 20, buttonSize: buttonSize = "m", tooltip: tooltip, gap: gap = 4, unselect: unselect = !0, fill: fill = !1, disabled: disabled = !1, border: border = !1, onChange: onChange, onSelect: onSelect, onToolTip: onToolTip, children: children, presetAnimations: presetAnimations, customAnimations: customAnimations} = props, handleClick = () => {
         if (!unselect && selected) return;
         const newState = !selected;
         null == onChange || onChange(newState), newState && (null == onSelect || onSelect());
@@ -26,9 +26,9 @@ function ToggleButton(props) {
             tooltip: tooltip,
             toggle: !selected,
             isToggled: selected,
-            bgColorOn: bgColorOn,
-            bgColorHover: bgColorHover,
-            bgColor: bgColor,
+            backgroundColorOn: backgroundColorOn,
+            backgroundColorHover: backgroundColorHover,
+            backgroundColor: backgroundColor,
             iconColor: iconColor,
             iconColorOn: iconColorOn,
             iconColorHover: iconColorHover,

package/dist/esm/chunks/{UploadArea-ChXIXxSg.mjs → UploadArea-BjlfBjiw.mjs}

@@ -3,13 +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-GB29X0YR.mjs";
+import { corners } from "../theme/corners.mjs";
 
-import { I as Icon } from "./Icon-DGQB6Mfm.mjs";
+import { s as setStyle, a as accessibleKeyDown } from "./misc-NDOWTiFf.mjs";
 
-import { P as ProgressIndicator } from "./ProgressIndicator-C8tli-Jg.mjs";
+import { I as Icon } from "./Icon-Ce2CM7lt.mjs";
 
-import { F as FileList } from "./FileList-D0b6RxKc.mjs";
+import { P as ProgressIndicator } from "./ProgressIndicator-dkR6UF1M.mjs";
+
+import { F as FileList } from "./FileList-WNFbRSQz.mjs";
 
 var css = {
     wrapper: "UploadArea-module_wrapper__aircC flexBox-module_column__ezvMq",
@@ -34,7 +36,7 @@ var FileTypes;
 }(FileTypes || (FileTypes = {}));
 
 const UploadAreaBase = React.forwardRef((props, ref) => {
-    const {icon: icon = "upload", iconColor: iconColor = "var(--core-text-primary)", iconColorHover: iconColorHover = "var(--core-text-special)", title: title = "Upload Files", width: width = "100%", height: height = "auto", message: message = "Drag and drop files here or click to upload", busyMessage: busyMessage = "Uploading in progress", iconSize: iconSize = 24, textSize: textSize = "m", borderWidth: borderWidth, border: border = 1, borderStyle: borderStyle = "dashed", borderColor: borderColor = "var(--core-outline-primary)", borderColorHover: borderColorHover = "var(--core-outline-special)", borderRadius: borderRadius, radius: radius = 8, padding: padding = 32, backgroundColor: backgroundColor, backgroundColorHover: backgroundColorHover, bgColor: bgColor = "var(--core-surface-secondary)", bgColorHover: bgColorHover = "var(--core-surface-special)", acceptedTypes: acceptedTypes = allTypes, multiple: multiple = !0, busy: busy = !1, canRemove: canRemove = !0, showProgress: showProgress = !0, files: files = [], onUpload: onUpload} = props, [hovered, setHovered] = useState(!1), inputRef = useRef(null), dragDepth = useRef(0), inputId = useId(), titleId = useId(), messageId = useId(), isInteractive = !busy && files.length < 1, resolvedBorderWidth = null != borderWidth ? borderWidth : border, resolvedBorderRadius = null != borderRadius ? borderRadius : radius, resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, resolvedBackgroundColorHover = null != backgroundColorHover ? backgroundColorHover : bgColorHover, handleClickUpload = useCallback(() => {
+    const {icon: icon = "upload", iconColor: iconColor = "var(--core-text-primary)", iconColorHover: iconColorHover = "var(--core-text-special)", title: title = "Upload Files", width: width = "100%", height: height = "auto", message: message = "Drag and drop files here or click to upload", busyMessage: busyMessage = "Uploading in progress", iconSize: iconSize = 24, textSize: textSize = "m", borderWidth: borderWidth, border: border = 1, borderStyle: borderStyle = "dashed", borderColor: borderColor = "var(--core-outline-primary)", borderColorHover: borderColorHover = "var(--core-outline-special)", borderRadius: borderRadius, radius: radius = corners["corner-m"], padding: padding = 32, backgroundColor: backgroundColor = "var(--core-surface-secondary)", backgroundColorHover: backgroundColorHover = "var(--core-surface-special)", acceptedTypes: acceptedTypes = allTypes, multiple: multiple = !0, busy: busy = !1, canRemove: canRemove = !0, showProgress: showProgress = !0, files: files = [], onUpload: onUpload} = props, [hovered, setHovered] = useState(!1), inputRef = useRef(null), dragDepth = useRef(0), inputId = useId(), titleId = useId(), messageId = useId(), isInteractive = !busy && files.length < 1, resolvedBorderWidth = null != borderWidth ? borderWidth : border, resolvedBorderRadius = null != borderRadius ? borderRadius : radius, resolvedBackgroundColor = backgroundColor, resolvedBackgroundColorHover = backgroundColorHover, handleClickUpload = useCallback(() => {
         var _a;
         isInteractive && (null == inputRef ? void 0 : inputRef.current) && (inputRef.current.value = "", 
         null === (_a = inputRef.current) || void 0 === _a || _a.click());
@@ -49,10 +51,10 @@ const UploadAreaBase = React.forwardRef((props, ref) => {
         e.preventDefault(), busy || (dragDepth.current = Math.max(0, dragDepth.current - 1), 
         0 === dragDepth.current && setHovered(!1));
     }, [ busy ]), handleDrop = useCallback(e => {
-        var _a;
+        var _a, _b;
         if (e.preventDefault(), busy) return;
         dragDepth.current = 0, setHovered(!1);
-        const files = Array.from(null !== (_a = e.dataTransfer.files) && void 0 !== _a ? _a : []);
+        const files = Array.from(null !== (_b = null === (_a = e.dataTransfer) || void 0 === _a ? void 0 : _a.files) && void 0 !== _b ? _b : []);
         null == onUpload || onUpload(files);
     }, [ busy, onUpload ]), iconStrokeColor = useMemo(() => hovered ? iconColorHover : iconColor, [ hovered, iconColor, iconColorHover ]), cssVars = useMemo(() => ({
         "--ua-border": `${resolvedBorderWidth}px`,
@@ -108,7 +110,7 @@ const UploadAreaBase = React.forwardRef((props, ref) => {
             className: css.files,
             children: jsx(FileList, {
                 files: files,
-                bgColor: "var(--core-surface-primary)",
+                backgroundColor: "var(--core-surface-primary)",
                 textSize: "m",
                 direction: "column",
                 gap: 8,