@apple-pie/slice 0.1.59 → 0.2.0

package/dist/cjs/chunks/Switch-CfzJd19R.js

@@ -1,44 +0,0 @@
-'use client';
-"use strict";
-
-var tslib_es6 = require("./tslib.es6-B2uEaXWi.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, 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 ]);
-    const handleClick = React.useCallback(() => {
-        setOn(!on), onChange(value, !on);
-    }, [ on, onChange, value ]), cssVars = React.useMemo(() => ({
-        "--switch-width": `${width}px`,
-        "--switch-height": `${height}px`,
-        "--switch-padding": void 0 === padding ? "var(--spacing-xxs)" : `${padding}px`,
-        "--switch-knob-size": "calc(var(--switch-height) - var(--switch-padding) * 2)",
-        "--switch-knob-color": knobColor,
-        "--switch-bg-color": on ? resolvedBackgroundColorOn : resolvedBackgroundColorOff
-    }), [ width, height, padding, resolvedBackgroundColorOff, resolvedBackgroundColorOn, on, knobColor ]), justify = React.useMemo(() => ({
-        justifyContent: on ? "flex-end" : "flex-start"
-    }), [ on ]);
-    return jsxRuntime.jsx(react.motion.button, Object.assign({
-        id: divId,
-        type: "button",
-        className: `${css_wrapper}${divClass}`,
-        style: Object.assign(Object.assign(Object.assign({}, divStyle), justify), cssVars),
-        onClick: handleClick,
-        role: "switch",
-        "aria-label": null != fieldName ? fieldName : "Switch",
-        "aria-checked": on
-    }, rest, {
-        children: jsxRuntime.jsx(react.motion.div, {
-            className: css_knob,
-            layout: "preserve-aspect"
-        })
-    }));
-}
-
-SwitchComponent.displayName = "Switch";
-
-const Switch = React.memo(SwitchComponent);
-
-exports.Switch = Switch;

package/dist/cjs/chunks/TabBar-C2aNS0Sd.js

@@ -1,183 +0,0 @@
-'use client';
-"use strict";
-
-var tslib_es6 = require("./tslib.es6-B2uEaXWi.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-BallZ366.js");
-
-require("./broadcastChannel-DLSijpj_.js"), require("./webRTCStore-BXHg9abP.js"), 
-require("./microphoneStore-DljI0Zpj.js"), require("./volumeStore-DzgmrI6q.js"), 
-require("../hooks/useWindow.js");
-
-var Badge = require("./Badge-DMey3Pf3.js"), Icon = require("./Icon-BTjtQLNe.js"), IconButton = require("./IconButton-C0yNYhI6.js"), sharedTypes = require("./sharedTypes-XAbs742N.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",
-    close: "TabBar-module_close__bvSBh flexBox-module_row__z24tF",
-    xs: "TabBar-module_xs__QDjV9 type-module_body-xs-regular__ZAFft",
-    s: "TabBar-module_s__-EBj2 type-module_body-s-regular__vRHSP",
-    m: "TabBar-module_m__3sCA3 type-module_body-m-regular__LuQBA",
-    l: "TabBar-module_l__hy1rR type-module_body-l-regular__lOYbg",
-    xl: "TabBar-module_xl__zaASU type-module_body-xl-regular__pF2kC",
-    selected: "TabBar-module_selected__UmBdu"
-};
-
-const placeholderOptions = [ {
-    name: "Light",
-    value: "Option 1",
-    icon: "sun"
-}, {
-    name: "Dark",
-    value: "Option 2",
-    icon: "moon full"
-} ], TabBar = React.memo(props => {
-    const {options: options = placeholderOptions, selected: selected = 0, border: border = !0, underline: underline = !0, height: height = "100%", width: width = "100%", tabWidth: tabWidth = "fill", padding: padding = "var(--spacing-s)", iconFill: iconFill = !1, iconSize: iconSize = 20, iconGap: iconGap = 8, tabGap: tabGap = 0, disabled: disabled = !1, hasClose: hasClose = !1, closeWidth: closeWidth = "auto", selectedValue: selectedValue = null, justify: justify = "start", borderColor: borderColor = "var(--core-outline-secondary)", textSize: textSize = "m", onChange: onChange = () => null, onTabChange: onTabChange = () => null, onClose: onClose = () => null, onToolTip: onToolTip = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "options", "selected", "border", "underline", "height", "width", "tabWidth", "padding", "iconFill", "iconSize", "iconGap", "tabGap", "disabled", "hasClose", "closeWidth", "selectedValue", "justify", "borderColor", "textSize", "onChange", "onTabChange", "onClose", "onToolTip" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [index, setIndex] = React.useState(selected), optionRefs = React.useRef([]);
-    React.useEffect(() => {
-        let selectedIndex = 0;
-        selectedValue && options ? (selectedIndex = options.findIndex(option => option.value === selectedValue), 
-        setIndex(-1 === selectedIndex ? selected : selectedIndex)) : setIndex(selected);
-    }, [ selected, selectedValue, options ]);
-    const handleClick = React.useCallback(i => {
-        setIndex(i), onChange(i), onTabChange(options[i]);
-    }, [ onChange, onTabChange, options ]), handleOptionClick = React.useCallback(i => {
-        onToolTip(null), handleClick(i);
-    }, [ onToolTip, handleClick ]), focusOption = React.useCallback(nextIndex => {
-        var _a;
-        null === (_a = optionRefs.current[nextIndex]) || void 0 === _a || _a.focus();
-    }, []), handleOptionKeyDown = React.useCallback((event, optionIndex) => {
-        if (options.length < 1) return;
-        let nextIndex = null;
-        switch (event.key) {
-          case "ArrowRight":
-          case "ArrowDown":
-            nextIndex = (optionIndex + 1) % options.length;
-            break;
-
-          case "ArrowLeft":
-          case "ArrowUp":
-            nextIndex = (optionIndex - 1 + options.length) % options.length;
-            break;
-
-          case "Home":
-            nextIndex = 0;
-            break;
-
-          case "End":
-            nextIndex = options.length - 1;
-        }
-        null !== nextIndex && (event.preventDefault(), handleOptionClick(nextIndex), focusOption(nextIndex));
-    }, [ options.length, handleOptionClick, focusOption ]), renderedOptions = React.useMemo(() => options.map((option, i) => jsxRuntime.jsx(Option, {
-        name: option.name,
-        index: i,
-        toolTip: option.toolTip,
-        selected: i === index,
-        padding: padding,
-        icon: option.icon,
-        iconSize: iconSize,
-        iconGap: iconGap,
-        disabled: disabled,
-        count: option.count,
-        onClick: handleOptionClick,
-        onKeyDown: handleOptionKeyDown,
-        onToolTip: onToolTip,
-        underline: underline,
-        iconFill: iconFill,
-        tabWidth: tabWidth,
-        textSize: textSize,
-        borderColor: borderColor,
-        buttonRef: element => {
-            optionRefs.current[i] = element;
-        }
-    }, `${i}_option_${option.name}`)), [ options, index, padding, iconSize, iconGap, disabled, underline, tabWidth, onToolTip, handleOptionClick, iconFill, handleOptionKeyDown, borderColor, textSize ]), cssVars = React.useMemo(() => ({
-        "--tab-bar-gap": `${tabGap}px`,
-        "--tab-bar-height": `${misc.setStyle(height)}px`,
-        "--tab-bar-width": misc.setStyle(width),
-        "--tab-bar-border-bottom": "" + (border ? "1px" : "0"),
-        "--tab-bar-border-color": borderColor,
-        "--tab-bar-justify": justify,
-        "--tab-bar-close-width": `${closeWidth}px`,
-        "--tab-bar-close-padding": misc.setStyle(padding, "var(--spacing-s)")
-    }), [ tabGap, height, width, border, closeWidth, padding, borderColor, justify ]);
-    return jsxRuntime.jsxs("div", Object.assign({
-        id: divId,
-        className: `${css.wrapper}${divClass}`,
-        style: Object.assign(Object.assign({}, divStyle), cssVars),
-        role: "tablist",
-        "aria-orientation": "horizontal"
-    }, rest, {
-        children: [ renderedOptions, hasClose && jsxRuntime.jsx("div", {
-            className: css.close,
-            children: jsxRuntime.jsx(IconButton.IconButton, {
-                iconSize: iconSize - 4,
-                frameSize: iconSize,
-                toggle: !1,
-                hover: !0,
-                icon: "x",
-                onClick: onClose,
-                iconFill: iconFill
-            })
-        }) ]
-    }));
-});
-
-TabBar.displayName = "TabBar";
-
-const Option = React.memo(props => {
-    const theme = hooks_useTheme.useTheme(), {name: name = "Option", index: index = 0, icon: icon = null, selected: selected = !1, onClick: onClick = () => null, onToolTip: onToolTip = () => null, padding: padding = "var(--spacing-s)", iconSize: iconSize = 20, iconGap: iconGap = 6, disabled: disabled = !1, toolTip: toolTip = null, underline: underline = !0, tabWidth: tabWidth = "fill", borderColor: borderColor = "var(--core-outline-secondary)", count: count = 0, iconFill: iconFill = !1, textSize: textSize = "m", onKeyDown: onKeyDown = () => null, buttonRef: buttonRef} = props, ref = React.useRef(null), strokeColor = React.useMemo(() => !disabled && selected ? theme.current.colors["core-text-special"] : disabled ? theme.current.colors["core-text-disabled"] : theme.current.colors["core-text-primary"], [ disabled, selected, theme ]), handleMouseOver = React.useCallback(e => {
-        if (onToolTip(null), toolTip && ref.current) {
-            const tip = {
-                type: sharedTypes.ToolTipType.button,
-                payload: {
-                    label: toolTip
-                },
-                event: e,
-                ref: ref
-            };
-            onToolTip(tip);
-        }
-    }, [ toolTip, onToolTip ]), handleMouseLeave = React.useCallback(() => {
-        toolTip && onToolTip(null);
-    }, [ toolTip, onToolTip ]), textColor = React.useMemo(() => disabled ? "var(--core-text-disabled)" : selected ? "var(--core-text-special)" : "var(--core-text-primary)", [ disabled, selected ]), setTabWidth = React.useMemo(() => "compact" === tabWidth ? "min-content" : "fill" === tabWidth ? "unset" : `${tabWidth}px`, [ tabWidth ]), setTabFlex = React.useMemo(() => "fill" === tabWidth ? "1" : "unset", [ tabWidth ]), setUnderline = React.useMemo(() => selected && underline && !disabled ? "1px" : "0", [ underline, disabled, selected ]), cssVars = React.useMemo(() => ({
-        "--tab-bar-option-border": setUnderline,
-        "--tab-bar-option-border-color": borderColor,
-        "--tab-bar-option-padding": misc.setStyle(padding, "var(--spacing-s)"),
-        "--tab-bar-option-icon-size": `${iconSize}px`,
-        "--tab-bar-option-cursor": disabled ? "default" : "pointer",
-        "--tab-bar-option-gap": `${null != iconGap ? iconGap : 0}px`,
-        "--tab-bar-option-color": textColor,
-        "--tab-bar-option-width": setTabWidth,
-        "--tab-bar-option-flex": setTabFlex
-    }), [ padding, iconSize, disabled, textColor, iconGap, setTabFlex, setTabWidth, setUnderline, borderColor ]);
-    return jsxRuntime.jsxs("button", {
-        type: "button",
-        className: `${css.option} ${css[textSize]} ${selected ? css.selected : ""}`,
-        style: cssVars,
-        ref: element => {
-            ref.current = element, null == buttonRef || buttonRef(element);
-        },
-        role: "tab",
-        "aria-selected": selected,
-        tabIndex: selected ? 0 : -1,
-        onMouseEnter: handleMouseOver,
-        onMouseLeave: handleMouseLeave,
-        onClick: () => onClick(index),
-        onKeyDown: e => onKeyDown(e, index),
-        children: [ icon && jsxRuntime.jsx("div", {
-            className: css.icon,
-            children: jsxRuntime.jsx(Icon.Icon, {
-                name: icon,
-                fill: iconFill,
-                size: iconSize,
-                strokeColor: strokeColor
-            })
-        }), name, 0 !== count && jsxRuntime.jsx(Badge.Badge, {
-            variant: "light",
-            hideNull: !1,
-            count: count
-        }) ]
-    });
-}, (prevProps, nextProps) => prevProps.selected === nextProps.selected && prevProps.underline === nextProps.underline && prevProps.tabWidth === nextProps.tabWidth && prevProps.disabled === nextProps.disabled && prevProps.iconGap === nextProps.iconGap && prevProps.iconSize === nextProps.iconSize && prevProps.count === nextProps.count && prevProps.icon === nextProps.icon && prevProps.borderColor === nextProps.borderColor && prevProps.textSize === nextProps.textSize && prevProps.padding === nextProps.padding && prevProps.name === nextProps.name && prevProps.index === nextProps.index);
-
-Option.displayName = "TabOption", exports.TabBar = TabBar;

package/dist/cjs/chunks/TextArea-G_MUJAHw.js

@@ -1,77 +0,0 @@
-'use client';
-"use strict";
-
-var tslib_es6 = require("./tslib.es6-B2uEaXWi.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), misc = require("./misc-BallZ366.js"), theme_corners = require("../theme/corners.js"), Button = require("./Button-BjmkIu7l.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 = theme_corners.corners["corner-xs"], padding: padding = "var(--spacing-m)", error: error = !1, resizable: resizable = !0, hasSend: hasSend = !1, sendOffset: sendOffset = {
-        bottom: 10,
-        right: 10
-    }, 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(() => {
-        (null == ref ? void 0 : ref.current) && (focused ? ref.current.focus() : ref.current.blur(), 
-        setIsFocused(focused));
-    }, [ focused ]), React.useEffect(() => setText(value), [ value ]), React.useEffect(() => handleResize(), [ rows ]);
-    const handleChange = React.useCallback(content => {
-        onChange(content), setText(content);
-    }, [ onChange ]), handleFocus = React.useCallback(() => {
-        var _a, _b;
-        (null == ref ? void 0 : ref.current) && ref.current.focus(), setIsFocused(!0), onFocus(null !== (_b = null === (_a = ref.current) || void 0 === _a ? void 0 : _a.value) && void 0 !== _b ? _b : "");
-    }, [ onFocus ]), handleBlur = React.useCallback(() => {
-        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(""), 
-        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);
-    }, [ returnSubmits, handleSubmit, onKeyDown ]), setStyleValue = React.useCallback(value => "string" == typeof value ? value : `${value}px`, []), setBorderColor = React.useMemo(() => border && isFocused ? "var(--core-link-primary)" : border && error ? "var(--feedback-warning)" : border ? "var(--core-outline-primary)" : "transparent", [ isFocused, error, border ]), textClassName = React.useMemo(() => "xs" === textSize ? css_xs : "l" === textSize ? css_l : "m" === textSize ? css_m : css_s, [ textSize ]), cssVars = React.useMemo(() => ({
-        "--ta-border-radius": misc.setStyle(borderRadius),
-        "--ta-width": `${setStyleValue(width)}`,
-        "--ta-min-width": minWidth ? `${minWidth}px` : "unset",
-        "--ta-height": `${setStyleValue(height)}`,
-        "--ta-max-height": "auto" === height ? "unset" : `${setStyleValue(height)}`,
-        "--ta-bg-color": null != resolvedBackgroundColor ? resolvedBackgroundColor : "var(--core-surface-secondary)",
-        "--ta-border-color": setBorderColor,
-        "--ta-padding": `${setStyleValue(padding)}`,
-        "--ta-send-icon-offset-bottom": `${sendOffset.bottom}px`,
-        "--ta-send-icon-offset-right": `${sendOffset.right}px`,
-        "--ta-send-icon-size": `${sendSize}px`,
-        "--ta-resize": resizable ? "vertical" : "none"
-    }), [ width, minWidth, resolvedBackgroundColor, setBorderColor, padding, sendOffset, sendSize, setStyleValue, borderRadius, resizable, height ]);
-    return jsxRuntime.jsxs("div", Object.assign({
-        id: divId,
-        className: `${css_wrapper}${divClass}`,
-        style: Object.assign(Object.assign({}, divStyle), cssVars),
-        onBlur: () => handleBlur(),
-        onFocus: () => handleFocus()
-    }, rest, {
-        children: [ hasSend && jsxRuntime.jsx("div", {
-            className: css_send,
-            onMouseDown: e => handleSubmit(e),
-            children: jsxRuntime.jsx(Button.Button, {
-                iconLeft: "arrow up",
-                size: "medium",
-                variant: "solid",
-                round: !0
-            })
-        }), jsxRuntime.jsx("textarea", {
-            className: `${css_textarea} ${textClassName}`,
-            ref: ref,
-            name: name,
-            value: text,
-            placeholder: placeholder,
-            rows: rows,
-            maxLength: maxLength,
-            disabled: disabled,
-            onChange: e => handleChange(e.target.value),
-            onInput: () => handleResize(),
-            onKeyDown: e => handleKeyDownWrapper(e)
-        }) ]
-    }));
-});
-
-exports.TextArea = TextArea;

package/dist/cjs/chunks/TextField-CWIGERkd.js

@@ -1,190 +0,0 @@
-'use client';
-"use strict";
-
-var tslib_es6 = require("./tslib.es6-B2uEaXWi.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js");
-
-require("../theme/colors.js");
-
-var theme_corners = require("../theme/corners.js");
-
-require("../theme/type.js");
-
-var misc = require("./misc-BallZ366.js");
-
-require("./broadcastChannel-DLSijpj_.js"), require("./webRTCStore-BXHg9abP.js"), 
-require("./microphoneStore-DljI0Zpj.js"), require("./volumeStore-DzgmrI6q.js"), 
-require("../hooks/useWindow.js");
-
-var Button = require("./Button-BjmkIu7l.js"), Icon = require("./Icon-BTjtQLNe.js"), IconButton = require("./IconButton-C0yNYhI6.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",
-    input: "TextField-module_input__AkWBQ",
-    showPassword: "TextField-module_showPassword__4Ecfo flexBox-module_row__z24tF",
-    clearButton: "TextField-module_clearButton__O9ed3 flexBox-module_row__z24tF",
-    xs: "TextField-module_xs__vyt2t type-module_body-xs-regular__ZAFft",
-    s: "TextField-module_s__0qm83 type-module_body-s-regular__vRHSP",
-    m: "TextField-module_m__M-tLl type-module_body-m-regular__LuQBA",
-    l: "TextField-module_l__gbNRz type-module_body-l-regular__lOYbg",
-    xl: "TextField-module_xl__tp--W type-module_body-xl-regular__pF2kC"
-};
-
-const MOTION_CONFIG = {
-    variants: {
-        initial: {
-            opacity: 0
-        },
-        animate: {
-            opacity: 1
-        },
-        exit: {
-            opacity: 0
-        }
-    },
-    transition: {
-        ease: "easeInOut",
-        duration: .25
-    }
-}, TextField = React.memo(props => {
-    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 = 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(() => {
-        input.current && (focused ? input.current.focus() : input.current.blur(), setIsFocused(focused));
-    }, [ focused ]), React.useEffect(() => {
-        setText(value);
-    }, [ value ]);
-    const handleClearTextField = React.useCallback(() => {
-        var _a;
-        disabled || "" === (null === (_a = input.current) || void 0 === _a ? void 0 : _a.value) || ((null == input ? void 0 : input.current) && (clearBlurs || input.current.focus(), 
-        setText("")), onChange(""), onClear());
-    }, [ disabled, clearBlurs, onChange, onClear ]), handleValueChange = React.useCallback(newValue => {
-        disabled || (setText(newValue), onChange(newValue));
-    }, [ onChange, disabled ]), handleBlur = React.useCallback(() => {
-        disabled || (setIsFocused(!1), onBlur(text));
-    }, [ text, onBlur, disabled ]), handleKeyDown = React.useCallback(e => {
-        var _a;
-        if (!disabled) {
-            if ("Enter" === e.key && (handleBlur(), onSubmit(text), null === (_a = input.current) || void 0 === _a || _a.blur()), 
-            disabled) return e.preventDefault(), !0;
-            onKeydown(e.key, e);
-        }
-    }, [ text, disabled, onSubmit, onKeydown, handleBlur ]), handleFocus = React.useCallback(() => {
-        disabled || (setIsFocused(!0), onFocus(text));
-    }, [ text, onFocus, disabled ]), toggleShow = React.useCallback(() => {
-        setShow(prev => !prev);
-    }, []), iconContainerStyle = React.useMemo(() => iconLeft ? {
-        width: iconLeft.size,
-        height: iconLeft.size
-    } : void 0, [ iconLeft ]), iconStrokeColor = React.useMemo(() => (null == iconLeft ? void 0 : iconLeft.color) ? iconLeft.color : theme.current.colors["core-icon-secondary"], [ iconLeft, theme ]), clearButtonStyle = React.useMemo(() => clearButton ? {
-        minWidth: clearButton.size,
-        minHeight: clearButton.size
-    } : void 0, [ clearButton ]), setBackgroundColor = React.useMemo(() => inline ? "unset" : isFocused ? null != backgroundColorFocused ? backgroundColorFocused : "transparent" : null != backgroundColorBlurred ? backgroundColorBlurred : "transparent", [ inline, isFocused, backgroundColorFocused, backgroundColorBlurred ]), setBorderColor = React.useMemo(() => {
-        var _a, _b;
-        return "none" === borderType ? "transparent" : error ? null !== (_a = null != borderColorError ? borderColorError : borderColorBlurred) && void 0 !== _a ? _a : "transparent" : isFocused ? null !== (_b = null != borderColorFocused ? borderColorFocused : borderColorBlurred) && void 0 !== _b ? _b : "transparent" : null != borderColorBlurred ? borderColorBlurred : "transparent";
-    }, [ borderType, error, isFocused, borderColorError, borderColorFocused, borderColorBlurred ]), setBoxShadow = React.useMemo(() => "none" === borderType ? "unset" : "underline" === borderType ? `0 1px 0 0 ${setBorderColor}` : `0 0 0 1px ${setBorderColor}`, [ borderType, setBorderColor ]), textColor = React.useMemo(() => error ? null != textColorError ? textColorError : "var(--core-text-primary)" : isFocused ? null != textColorFocused ? textColorFocused : "var(--core-text-primary)" : null != textColorBlurred ? textColorBlurred : "var(--core-text-primary)", [ isFocused, error, textColorError, textColorFocused, textColorBlurred ]), setTextAlign = React.useMemo(() => null != textAlign ? textAlign : "left", [ textAlign ]), setShowOpacity = React.useMemo(() => "password" !== inputType ? "0" : isFocused ? "1" : "0.5", [ inputType, isFocused ]), resolvedPadding = React.useMemo(() => {
-        if (null != padding) return "number" == typeof padding ? `${padding}px` : padding;
-        const iconInset = "calc(var(--spacing-m) - var(--spacing-xs))";
-        return `var(--spacing-s) ${"password" === inputType && !noShow || !actionButton && clearButton ? iconInset : "var(--spacing-m)"} var(--spacing-s) ${iconLeft && !label ? iconInset : "var(--spacing-m)"}`;
-    }, [ padding, iconLeft, label, inputType, noShow, actionButton, clearButton ]), cssVars = React.useMemo(() => ({
-        "--tf-input-width": "unset" !== size.width && "100%",
-        "--tf-field-size": "auto" === size.width ? "content" : "unset",
-        "--tf-width": misc.setStyle(size.width),
-        "--tf-height": misc.setStyle(size.height),
-        "--tf-padding": resolvedPadding,
-        "--tf-padding-label-left": "" === label ? "unset" : "0",
-        "--tf-border-radius": misc.setStyle(borderRadius),
-        "--tf-bg-color": setBackgroundColor,
-        "--tf-box-shadow": setBoxShadow,
-        "--tf-color": textColor,
-        "--tf-label-color": disabled ? null != textColorDisabled ? textColorDisabled : "var(--core-text-disabled)" : labelColor,
-        "--tf-text-align": setTextAlign,
-        "--tf-show-opacity": setShowOpacity,
-        "--tf-placeholder-color": null != textColorPlaceholder ? textColorPlaceholder : "var(--core-text-disabled)"
-    }), [ size, label, borderRadius, setBackgroundColor, setBoxShadow, textColor, setTextAlign, setShowOpacity, textColorPlaceholder, textColorDisabled, labelColor, disabled, resolvedPadding ]);
-    return jsxRuntime.jsxs("div", Object.assign({
-        id: divId,
-        className: `${css.wrapper}${divClass}`,
-        style: Object.assign(Object.assign({}, divStyle), cssVars)
-    }, rest, {
-        children: [ label && jsxRuntime.jsx("div", {
-            className: `${css.label} ${css[labelSize]}`,
-            children: label
-        }), jsxRuntime.jsxs("div", {
-            className: css.container,
-            children: [ iconLeft && jsxRuntime.jsx("div", {
-                style: iconContainerStyle,
-                children: jsxRuntime.jsx(Icon.Icon, {
-                    name: iconLeft.name,
-                    size: iconLeft.size,
-                    strokeColor: iconStrokeColor
-                })
-            }), jsxRuntime.jsx("input", {
-                className: `${css.input} ${css[textSize]}`,
-                ref: input,
-                type: "password" === inputType && show ? "text" : inputType,
-                name: name,
-                "aria-label": name,
-                autoCapitalize: "none",
-                autoCorrect: "off",
-                autoComplete: "off",
-                value: text,
-                onChange: e => handleValueChange(e.target.value),
-                onKeyDown: handleKeyDown,
-                onPaste: onPaste,
-                placeholder: placeholder,
-                onFocus: handleFocus,
-                onBlur: handleBlur,
-                onMouseDown: e => e.stopPropagation(),
-                disabled: !editable || disabled,
-                maxLength: maxLength
-            }), clearButton && jsxRuntime.jsx("button", {
-                type: "button",
-                "aria-label": "Clear text",
-                className: css.clearButton,
-                style: clearButtonStyle,
-                onClick: handleClearTextField,
-                children: isFocused && "" !== text && jsxRuntime.jsx(Icon.Icon, {
-                    name: "x",
-                    size: clearButton.size,
-                    strokeColor: theme.current.colors["core-icon-secondary"]
-                })
-            }), jsxRuntime.jsx(react.AnimatePresence, {
-                initial: !1,
-                children: actionButton && jsxRuntime.jsx(react.motion.div, {
-                    variants: MOTION_CONFIG.variants,
-                    initial: "initial",
-                    animate: "animate",
-                    exit: "exit",
-                    transition: MOTION_CONFIG.transition,
-                    children: jsxRuntime.jsx(Button.Button, {
-                        label: "Translate",
-                        variant: "text",
-                        size: "small",
-                        state: "" === text ? "disabled" : "normal",
-                        labelColor: theme.current.colors["core-button-primary"],
-                        onClick: onAction
-                    })
-                })
-            }), "password" === inputType && !noShow && jsxRuntime.jsx("div", {
-                className: css.showPassword,
-                children: jsxRuntime.jsx(IconButton.IconButton, {
-                    icon: "view",
-                    toggleIcon: !0,
-                    toggle: !1,
-                    isToggled: show,
-                    iconSize: 18,
-                    frameSize: 18,
-                    onClick: toggleShow,
-                    tooltip: "Show / Hide",
-                    disabled: !1
-                })
-            }) ]
-        }) ]
-    }));
-}, (prevProps, nextProps) => prevProps.value === nextProps.value && prevProps.borderType === nextProps.borderType && prevProps.borderRadius === nextProps.borderRadius && prevProps.borderColorFocused === nextProps.borderColorFocused && prevProps.borderColorBlurred === nextProps.borderColorBlurred && prevProps.borderColorError === nextProps.borderColorError && prevProps.backgroundColorFocused === nextProps.backgroundColorFocused && prevProps.backgroundColorBlurred === nextProps.backgroundColorBlurred && prevProps.textColorFocused === nextProps.textColorFocused && prevProps.textColorBlurred === nextProps.textColorBlurred && prevProps.textColorError === nextProps.textColorError && prevProps.textColorPlaceholder === nextProps.textColorPlaceholder && prevProps.textColorDisabled === nextProps.textColorDisabled && prevProps.labelColor === nextProps.labelColor && prevProps.labelSize === nextProps.labelSize && prevProps.focused === nextProps.focused && prevProps.error === nextProps.error && prevProps.disabled === nextProps.disabled && prevProps.label === nextProps.label && prevProps.inputType === nextProps.inputType && prevProps.textSize === nextProps.textSize && prevProps.padding === nextProps.padding && prevProps.iconLeft === nextProps.iconLeft && prevProps.clearButton === nextProps.clearButton && prevProps.actionButton === nextProps.actionButton && prevProps.noShow === nextProps.noShow && prevProps.textAlign === nextProps.textAlign && prevProps.placeholder === nextProps.placeholder);
-
-TextField.displayName = "TextField", exports.TextField = TextField;

package/dist/cjs/chunks/Tip-B7RF879X.js

@@ -1,89 +0,0 @@
-'use client';
-"use strict";
-
-var tslib_es6 = require("./tslib.es6-B2uEaXWi.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), misc = require("./misc-BallZ366.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",
-    m: "Tip-module_m__9qJbB type-module_body-m-regular__LuQBA",
-    l: "Tip-module_l__OdNuh type-module_body-l-regular__lOYbg",
-    xl: "Tip-module_xl__izmFk type-module_body-xl-regular__pF2kC"
-};
-
-const tipBasePos = {
-    left: 0,
-    top: 0
-}, TipBase = React.forwardRef((props, ref) => {
-    var _a;
-    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 : {
-            x: 0,
-            y: 0
-        };
-        return x > 0 && y > 0 ? timer.current = setTimeout(() => {
-            var _a, _b;
-            setPos({
-                left: null !== (_a = null == coords ? void 0 : coords.x) && void 0 !== _a ? _a : 0,
-                top: null !== (_b = null == coords ? void 0 : coords.y) && void 0 !== _b ? _b : 0
-            }), setReady(!0), timer.current && clearTimeout(timer.current), timer.current = setTimeout(() => {
-                setReady(!1), setPos({
-                    left: 0,
-                    top: 0
-                });
-            }, hideDelay);
-        }, showDelay) : (setReady(!1), setPos({
-            left: 0,
-            top: 0
-        })), () => {
-            timer.current && clearTimeout(timer.current);
-        };
-    }, [ coords, showDelay, hideDelay ]), React.useEffect(() => setAnimate(ready), [ ready ]);
-    const cssVars = React.useMemo(() => ({
-        "--tooltip-padding": 0 === padding ? "0px" : misc.setStyle(padding, "var(--spacing-xs) var(--spacing-s)"),
-        "--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": misc.setStyle(resolvedBorderRadius, theme_corners.corners["corner-xs"])
-    }), [ padding, resolvedBackgroundColor, resolvedTextColor, border, borderColor, resolvedBorderRadius ]), coordStyle = React.useMemo(() => {
-        const {left: left, top: top} = pos;
-        return {
-            left: `${null != left ? left : 0}px`,
-            top: `${null != top ? top : 0}px`
-        };
-    }, [ pos ]), classNames = React.useMemo(() => misc.filterClasses([ css.wrapper, css[textSize], divClass ]), [ textSize, divClass ]);
-    return jsxRuntime.jsx(react.motion.div, Object.assign({
-        ref: ref,
-        id: divId,
-        className: classNames,
-        onKeyDown: () => null,
-        style: Object.assign(Object.assign(Object.assign(Object.assign({}, divStyle), cssVars), coordStyle), {
-            visibility: ready ? "visible" : "hidden"
-        }),
-        initial: {
-            opacity: 0
-        },
-        animate: animate ? {
-            opacity: 1,
-            transition: {
-                ease: "easeInOut",
-                duration: .25
-            }
-        } : void 0,
-        exit: {
-            opacity: 0,
-            transition: {
-                duration: 0
-            }
-        }
-    }, rest, {
-        children: null === (_a = null == tip ? void 0 : tip.payload) || void 0 === _a ? void 0 : _a.label
-    }));
-});
-
-TipBase.displayName = "Tip";
-
-const Tip = React.memo(TipBase);
-
-exports.Tip = Tip;