@apple-pie/slice 0.1.52 → 0.1.54

package/dist/cjs/chunks/{IconButton-BbgyyMjG.js → IconButton-DlLDM8w2.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var AnimationPreset, AnimationType, tslib_es6 = require("./tslib.es6-CTGrDO27.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), Badge = require("./Badge-CWASZI0E.js"), Dot = require("./Dot-ByKZIcva.js"), Icon = require("./Icon-CUbgmUeu.js"), sharedTypes = require("./sharedTypes-BT25wBhL.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-CG8Jpxry.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), theme_corners = require("../theme/corners.js"), Badge = require("./Badge--0CfhLFo.js"), Dot = require("./Dot-C_3SC1bM.js"), Icon = require("./Icon-CsNB8HJ4.js"), sharedTypes = require("./sharedTypes-BgBhX0El.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-DFVmvrQg.js → IndexedDB-Cj_Oxilj.js}

@@ -1,6 +1,6 @@
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.js");
+var tslib_es6 = require("./tslib.es6-CG8Jpxry.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-CDuN-9n3.js → Label-BB8PYTuF.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var LabelBackground, tslib_es6 = require("./tslib.es6-CTGrDO27.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-BNlFh_4N.js"), css = {
+var LabelBackground, tslib_es6 = require("./tslib.es6-CG8Jpxry.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-BPL5e5rQ.js"), theme_corners = require("../theme/corners.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",
@@ -21,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-vbDvflcO.js → Level-IuQRDwDH.js}

@@ -1,14 +1,14 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-BNlFh_4N.js"), audioVisualizer = require("./audioVisualizer-DFgLMDKW.js");
+var tslib_es6 = require("./tslib.es6-CG8Jpxry.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), theme_corners = require("../theme/corners.js"), misc = require("./misc-BPL5e5rQ.js"), audioVisualizer = require("./audioVisualizer-GmZ0xNzv.js");
 
-require("./broadcastChannel-B0l8OE4I.js");
+require("./broadcastChannel-CtwRunj4.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-BS-9UkxV.js → Modal-c5lf--ia.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-BNlFh_4N.js"), Button = require("./Button-kzWt5lcL.js"), Icon = require("./Icon-CUbgmUeu.js"), IconButton = require("./IconButton-BbgyyMjG.js"), css = {
+var tslib_es6 = require("./tslib.es6-CG8Jpxry.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), theme_corners = require("../theme/corners.js"), misc = require("./misc-BPL5e5rQ.js"), Button = require("./Button-GKTXo4mq.js"), Icon = require("./Icon-CsNB8HJ4.js"), IconButton = require("./IconButton-DlLDM8w2.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-CTGrDO27.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, 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 = 8, 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(() => {
+    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;
@@ -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", {

package/dist/cjs/chunks/{ModalController-B-m3OD5K.js → ModalController-DqlX7Bvu.js}

@@ -3,9 +3,10 @@
 
 var jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react");
 
-require("./microphoneStore-Ch3VVm4T.js"), require("./volumeStore-CA9Pdx5e.js");
+require("./microphoneStore-Dn91izLl.js"), require("./volumeStore-DsHPJx-8.js"), 
+require("./webRTCStore-w3zT4ZiO.js");
 
-var Overlay = require("./Overlay-QprT1IaK.js"), modalStore = require("./modalStore-DaB75uoa.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-BS3eyLZz.js"), modalStore = require("./modalStore-B-Xkl2-3.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-QprT1IaK.js → Overlay-BS3eyLZz.js}

@@ -1,13 +1,13 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.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-CG8Jpxry.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-7edBFop6.js → Pager-CLGGNiPg.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-BNlFh_4N.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-CG8Jpxry.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-BPL5e5rQ.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-Bi1UfJIW.js → ProgressIndicator-CctdHXiJ.js}

@@ -5,12 +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-CTGrDO27.js");
+var tslib_es6 = require("./tslib.es6-CG8Jpxry.js");
 
-require("./broadcastChannel-B0l8OE4I.js"), require("./microphoneStore-Ch3VVm4T.js"), 
-require("./volumeStore-CA9Pdx5e.js"), require("../hooks/useWindow.js");
+require("./broadcastChannel-CtwRunj4.js"), require("./webRTCStore-w3zT4ZiO.js"), 
+require("./microphoneStore-Dn91izLl.js"), require("./volumeStore-DsHPJx-8.js"), 
+require("../hooks/useWindow.js");
 
-var Icon = require("./Icon-CUbgmUeu.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-CsNB8HJ4.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-BHDK8fjX.js → PromptInput-BmPDEllv.js}

@@ -3,14 +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-CTGrDO27.js");
+require("../theme/colors.js");
 
-var misc = require("./misc-BNlFh_4N.js");
+var theme_corners = require("../theme/corners.js");
 
-require("./broadcastChannel-B0l8OE4I.js"), require("./microphoneStore-Ch3VVm4T.js"), 
-require("./volumeStore-CA9Pdx5e.js"), require("../hooks/useWindow.js");
+require("../theme/type.js"), require("./tslib.es6-CG8Jpxry.js");
 
-var Button = require("./Button-kzWt5lcL.js"), FileList = require("./FileList-C3KR7jHj.js"), css = {
+var misc = require("./misc-BPL5e5rQ.js");
+
+require("./broadcastChannel-CtwRunj4.js"), require("./webRTCStore-w3zT4ZiO.js"), 
+require("./microphoneStore-Dn91izLl.js"), require("./volumeStore-DsHPJx-8.js"), 
+require("../hooks/useWindow.js");
+
+var Button = require("./Button-GKTXo4mq.js"), FileList = require("./FileList-Be7Sn-bF.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",
@@ -27,7 +32,7 @@ var Button = require("./Button-kzWt5lcL.js"), FileList = require("./FileList-C3K
 };
 
 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);
@@ -96,7 +101,7 @@ const PromptInputBase = React.forwardRef((props, ref) => {
                 children: jsxRuntime.jsx(FileList.FileList, {
                     files: attachments,
                     onChange: handleAttachmentsChange,
-                    bgColor: "var(--core-surface-primary)",
+                    backgroundColor: "var(--core-surface-primary)",
                     textSize: "s",
                     direction: "row",
                     gap: 8,
@@ -139,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-SqAqjkcO.js → RadioButton-aMfLOeHI.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-BNlFh_4N.js"), Icon = require("./Icon-CUbgmUeu.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-CG8Jpxry.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-BPL5e5rQ.js"), Icon = require("./Icon-CsNB8HJ4.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-Bk4zdfNK.js → RadioButtonList-DUAZeawt.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-BNlFh_4N.js"), RadioButton = require("./RadioButton-SqAqjkcO.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-CG8Jpxry.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-BPL5e5rQ.js"), RadioButton = require("./RadioButton-aMfLOeHI.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-CGXCa5hf.js → Slider-CCqbXz95.js}

@@ -1,14 +1,15 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react");
+var tslib_es6 = require("./tslib.es6-CG8Jpxry.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react");
 
 require("../theme/colors.js"), require("../theme/type.js");
 
-var misc = require("./misc-BNlFh_4N.js"), debounce = require("./debounce-CsmIqkDy.js");
+var misc = require("./misc-BPL5e5rQ.js"), debounce = require("./debounce-BP_p5Vjk.js");
 
-require("./broadcastChannel-B0l8OE4I.js"), require("./microphoneStore-Ch3VVm4T.js"), 
-require("./volumeStore-CA9Pdx5e.js"), require("../hooks/useWindow.js");
+require("./broadcastChannel-CtwRunj4.js"), require("./webRTCStore-w3zT4ZiO.js"), 
+require("./microphoneStore-Dn91izLl.js"), require("./volumeStore-DsHPJx-8.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-Cz634l5B.js → Spacer-1dAdRzu7.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react");
+var tslib_es6 = require("./tslib.es6-CG8Jpxry.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-BWz76WjN.js → Switch-D5qUfthw.js}

@@ -1,10 +1,10 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.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-CG8Jpxry.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-BhV5XeiX.js → TabBar-zpHPLgxV.js}

@@ -1,16 +1,17 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js");
+var tslib_es6 = require("./tslib.es6-CG8Jpxry.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-BNlFh_4N.js");
+var misc = require("./misc-BPL5e5rQ.js");
 
-require("./broadcastChannel-B0l8OE4I.js"), require("./microphoneStore-Ch3VVm4T.js"), 
-require("./volumeStore-CA9Pdx5e.js"), require("../hooks/useWindow.js");
+require("./broadcastChannel-CtwRunj4.js"), require("./webRTCStore-w3zT4ZiO.js"), 
+require("./microphoneStore-Dn91izLl.js"), require("./volumeStore-DsHPJx-8.js"), 
+require("../hooks/useWindow.js");
 
-var Badge = require("./Badge-CWASZI0E.js"), Icon = require("./Icon-CUbgmUeu.js"), IconButton = require("./IconButton-BbgyyMjG.js"), sharedTypes = require("./sharedTypes-BT25wBhL.js"), css = {
+var Badge = require("./Badge--0CfhLFo.js"), Icon = require("./Icon-CsNB8HJ4.js"), IconButton = require("./IconButton-DlLDM8w2.js"), sharedTypes = require("./sharedTypes-BgBhX0El.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",

package/dist/cjs/chunks/{TextArea-Dc0MXEtY.js → TextArea-Dq4U3Kpd.js}

@@ -1,13 +1,13 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), Button = require("./Button-kzWt5lcL.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-CG8Jpxry.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), theme_corners = require("../theme/corners.js"), Button = require("./Button-GKTXo4mq.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-l62uCubT.js → TextField-qjDwSe8i.js}

@@ -1,16 +1,21 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.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-CG8Jpxry.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-BNlFh_4N.js");
+var theme_corners = require("../theme/corners.js");
 
-require("./broadcastChannel-B0l8OE4I.js"), require("./microphoneStore-Ch3VVm4T.js"), 
-require("./volumeStore-CA9Pdx5e.js"), require("../hooks/useWindow.js");
+require("../theme/type.js");
 
-var Button = require("./Button-kzWt5lcL.js"), Icon = require("./Icon-CUbgmUeu.js"), IconButton = require("./IconButton-BbgyyMjG.js"), css = {
+var misc = require("./misc-BPL5e5rQ.js");
+
+require("./broadcastChannel-CtwRunj4.js"), require("./webRTCStore-w3zT4ZiO.js"), 
+require("./microphoneStore-Dn91izLl.js"), require("./volumeStore-DsHPJx-8.js"), 
+require("../hooks/useWindow.js");
+
+var Button = require("./Button-GKTXo4mq.js"), Icon = require("./Icon-CsNB8HJ4.js"), IconButton = require("./IconButton-DlLDM8w2.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",
@@ -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(() => {

package/dist/cjs/chunks/{Tip-BBMqZlgV.js → Tip-l0mnd4j8.js}

@@ -1,7 +1,7 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), misc = require("./misc-BNlFh_4N.js"), css = {
+var tslib_es6 = require("./tslib.es6-CG8Jpxry.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), misc = require("./misc-BPL5e5rQ.js"), theme_corners = require("../theme/corners.js"), css = {
     wrapper: "Tip-module_wrapper__D7ACT flexBox-module_rowStart__4tcxS",
     xs: "Tip-module_xs__wsz9y type-module_body-xs-regular__ZAFft",
     s: "Tip-module_s__Wvz3q type-module_body-s-regular__vRHSP",
@@ -15,7 +15,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 = tslib_es6.__rest(props, [ "tip", "textSize", "backgroundColor", "bgColor", "textColor", "color", "border", "borderColor", "padding", "borderRadius", "radius", "coords", "showDelay", "hideDelay" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? `${className}` : "", [pos, setPos] = React.useState(tipBasePos), [ready, setReady] = React.useState(!1), [animate, setAnimate] = React.useState(!1), timer = React.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 = tslib_es6.__rest(props, [ "tip", "textSize", "backgroundColor", "textColor", "color", "border", "borderColor", "padding", "borderRadius", "radius", "coords", "showDelay", "hideDelay" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? `${className}` : "", [pos, setPos] = React.useState(tipBasePos), [ready, setReady] = React.useState(!1), [animate, setAnimate] = React.useState(!1), timer = React.useRef(null), resolvedBackgroundColor = backgroundColor, resolvedTextColor = null != textColor ? textColor : color, resolvedBorderRadius = null != borderRadius ? borderRadius : radius;
     React.useEffect(() => {
         timer.current && clearTimeout(timer.current);
         const {x: x, y: y} = null != coords ? coords : {
@@ -45,7 +45,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 : `${theme_corners.corners["corner-xs"]}px`
     }), [ padding, resolvedBackgroundColor, resolvedTextColor, border, borderColor, resolvedBorderRadius ]), coordStyle = React.useMemo(() => {
         const {left: left, top: top} = pos;
         return {

package/dist/cjs/chunks/{Toast-DNSA3BzO.js → Toast-DLh9lGPy.js}

@@ -1,16 +1,17 @@
 'use client';
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-CTGrDO27.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-CG8Jpxry.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");
 
-var misc = require("./misc-BNlFh_4N.js");
+var misc = require("./misc-BPL5e5rQ.js");
 
-require("./broadcastChannel-B0l8OE4I.js"), require("./microphoneStore-Ch3VVm4T.js"), 
-require("./volumeStore-CA9Pdx5e.js"), require("../hooks/useWindow.js");
+require("./broadcastChannel-CtwRunj4.js"), require("./webRTCStore-w3zT4ZiO.js"), 
+require("./microphoneStore-Dn91izLl.js"), require("./volumeStore-DsHPJx-8.js"), 
+require("../hooks/useWindow.js");
 
-var ToastType, Icon = require("./Icon-CUbgmUeu.js"), ProgressIndicator = require("./ProgressIndicator-Bi1UfJIW.js"), css = {
+var ToastType, Icon = require("./Icon-CsNB8HJ4.js"), ProgressIndicator = require("./ProgressIndicator-CctdHXiJ.js"), css = {
     wrapper: "Toast-module_wrapper__1uj9O flexBox-module_rowBetween__5FEvi",
     close: "Toast-module_close__i10-s flexBox-module_row__z24tF",
     message: "Toast-module_message__3dP0P flexBox-module_rowStart__4tcxS",

package/dist/cjs/chunks/{ToggleButton-DclomTgT.js → ToggleButton-BXsZ_GRW.js}

@@ -1,10 +1,10 @@
 'use client';
 "use strict";
 
-var jsxRuntime = require("react/jsx-runtime"), React = require("react"), IconButton = require("./IconButton-BbgyyMjG.js"), Label = require("./Label-CDuN-9n3.js"), css_toggleButton = "ToggleButton-module_toggleButton__H7KgI flexBox-module_rowStart__4tcxS";
+var jsxRuntime = require("react/jsx-runtime"), React = require("react"), IconButton = require("./IconButton-DlLDM8w2.js"), Label = require("./Label-BB8PYTuF.js"), css_toggleButton = "ToggleButton-module_toggleButton__H7KgI flexBox-module_rowStart__4tcxS";
 
 exports.ToggleButton = function(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());
@@ -20,9 +20,9 @@ exports.ToggleButton = function(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,