@apple-pie/slice 0.0.6 → 0.0.8

package/dist/esm/chunks/Badge-BISGWj5-.mjs

@@ -0,0 +1,29 @@
+import { _ as __rest } from "./tslib.es6-c-7TIv71.mjs";
+
+import { jsx } from "react/jsx-runtime";
+
+import React, { useMemo } from "react";
+
+import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
+
+var css_badge = "Badge-module_badge__8-cpJ flexBox-module_row__PWxbe type-module_body-xs-medium__FxEAv";
+
+styleInject(".flexBox-module_row__PWxbe {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__27lKK {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__nJZnW {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__dHcOU {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__MP2Xd {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__Kg8cV {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__zcmtk {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__157yI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__u2nwI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__QWEzl {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__FxEAv {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__rf7AV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__8-FO- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__qyYq- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__7GQ5Z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__Qtp5G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__Ieh9K {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__0lZ3I {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__Ar4d3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__6tV1n {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__I8Q1v {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__zDf-z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__R5GpK {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__SI-hC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__jGIb2 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__QFgN8 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__tdBSi {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__-7Uyu {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__8hGYF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Cryjg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__PUi44 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__1B6fk {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.Badge-module_badge__8-cpJ {\n\tline-height: 1em;\n\tcolor: var(--badge-color);\n\tbackground: var(--badge-bg);\n\tpadding: 2px 8px;\n\tmin-width: 24px;\n\twidth: min-content;\n\tborder-radius: 8px;\n\twhite-space: nowrap;\n}\n");
+
+const Badge = React.memo(props => {
+    const {count: count, variant: variant = "dark", hideNull: hideNull = !0} = props, divAttributes = __rest(props, [ "count", "variant", "hideNull" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", displayCount = useMemo(() => void 0 === count ? "0" : "string" == typeof count ? count : count > 99 ? "99+" : count.toString(), [ count ]), cssVars = useMemo(() => ({
+        "--badge-color": "light" === variant ? "var(--core-text-primary)" : "var(--core-text-light)",
+        "--badge-bg": "light" === variant ? "var(--core-badge-secondary)" : "var(--core-badge-primary)"
+    }), [ variant ]);
+    return void 0 === count || "" === count || hideNull && 0 === count ? null : jsx("div", Object.assign({
+        id: divId,
+        className: `${css_badge}${divClass}`,
+        style: Object.assign(Object.assign({}, divStyle), cssVars),
+        role: "status",
+        "aria-live": "polite"
+    }, rest, {
+        children: displayCount
+    }));
+});
+
+export { Badge as B };

package/dist/esm/chunks/Button-B_aIY6wE.mjs

@@ -0,0 +1,264 @@
+import { _ as __rest } from "./tslib.es6-c-7TIv71.mjs";
+
+import { jsxs, jsx } from "react/jsx-runtime";
+
+import { motion } from "motion/react";
+
+import React, { forwardRef, useState, useRef, useCallback, useEffect, useImperativeHandle, useMemo } from "react";
+
+import { B as Badge } from "./Badge-BISGWj5-.mjs";
+
+import { D as Dot } from "./Dot-C-Xu24wF.mjs";
+
+import { I as Icon } from "./_types-KZDzhaiK.mjs";
+
+import { P as ProgressIndicator } from "./ProgressIndicator-CNOBQ_Fv.mjs";
+
+import { T as ToolTipType } from "./sharedTypes-tn9-uJvb.mjs";
+
+import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
+
+var css = {
+    button: "Button-module_button__-gHnS flexBox-module_row__PWxbe",
+    label: "Button-module_label__jzYdr",
+    count: "Button-module_count__8YTcm flexBox-module_row__PWxbe",
+    icon: "Button-module_icon__BNF2p flexBox-module_row__PWxbe",
+    m: "Button-module_m__q-q0F type-module_body-m-regular__Qtp5G",
+    l: "Button-module_l__r6jKt type-module_body-l-regular__Ar4d3",
+    s: "Button-module_s__GucGM type-module_body-s-regular__8-FO-"
+};
+
+styleInject(".flexBox-module_row__PWxbe {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__27lKK {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__nJZnW {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__dHcOU {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__MP2Xd {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__Kg8cV {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__zcmtk {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__157yI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__u2nwI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__QWEzl {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__FxEAv {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__rf7AV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__8-FO- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__qyYq- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__7GQ5Z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__Qtp5G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__Ieh9K {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__0lZ3I {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__Ar4d3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__6tV1n {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__I8Q1v {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__zDf-z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__R5GpK {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__SI-hC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__jGIb2 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__QFgN8 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__tdBSi {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__-7Uyu {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__8hGYF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Cryjg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__PUi44 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__1B6fk {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.Button-module_button__-gHnS {\n\tposition: relative;\n\tuser-select: none;\n\tmin-width: var(--ui-button-min-width);\n\t-webkit-user-select: none;\n}\n\n.Button-module_label__jzYdr {\n\tuser-select: none;\n\t-webkit-user-select: none;\n\ttext-overflow: ellipsis;\n\toverflow: hidden;\n\twhite-space: nowrap;\n\tword-break: break-all;\n\tdisplay: -webkit-box;\n\t-webkit-line-clamp: 1;\n\t-webkit-box-orient: vertical;\n\t&:hover {\n\t\ttext-decoration: var(--ui-button-decoration);\n\t}\n}\n\n.Button-module_count__8YTcm {\n\tposition: absolute;\n\ttop: 0;\n\tright: 0;\n\ttransform: translateX(10px) translateY(-2px);\n}\n\n.Button-module_icon__BNF2p {\n\tmin-width: var(--ui-button-icon-size);\n\tmin-height: var(--ui-button-icon-size);\n\theight: var(--ui-button-icon-size);\n\twidth: var(--ui-button-icon-size);\n}\n\n.Button-module_m__q-q0F {\n}\n\n.Button-module_l__r6jKt {\n}\n\n.Button-module_s__GucGM {\n}\n");
+
+const ButtonComponent = forwardRef((props, buttonRef) => {
+    const {size: size = "medium", variant: variant = "outline", label: label, labelSize: labelSize = "m", iconRight: iconRight, iconLeft: iconLeft, count: count = (void 0 === props.count ? void 0 : Number(props.count)), showDot: showDot, tooltip: tooltip, round: round = !1, state: state = "normal", fill: fill = !1, iconSize: iconSize = (void 0 === props.iconSize ? 20 : Number(props.iconSize)), width: width = "auto", underline: underline = !1, borderRadius: borderRadius, iconColor: iconColor, bgColor: bgColor, bgColorDisabled: bgColorDisabled, labelColor: labelColor, transition: transition, variants: variants, initial: initial, animate: animate, exit: exit, paddingRight: paddingRight, paddingLeft: paddingLeft, progress: progress = !1, working: working = !1, duration: duration, trigger: trigger = !1, destructive: destructive = !1, onClick: onClick = () => null, onToolTip: onToolTip = () => null} = props, divAttributes = __rest(props, [ "size", "variant", "label", "labelSize", "iconRight", "iconLeft", "count", "showDot", "tooltip", "round", "state", "fill", "iconSize", "width", "underline", "borderRadius", "iconColor", "bgColor", "bgColorDisabled", "labelColor", "transition", "variants", "initial", "animate", "exit", "paddingRight", "paddingLeft", "progress", "working", "duration", "trigger", "destructive", "onClick", "onToolTip" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [btnState, setBtnState] = useState(state), [btnWidth, setBtnWidth] = useState(void 0), [playing, setPlaying] = useState(working), ref = useRef(null), handleClick = useCallback(e => {
+        onToolTip(null), "disabled" !== btnState && (progress && duration ? setPlaying(!0) : onClick(e));
+    }, [ onToolTip, btnState, progress, duration, onClick ]);
+    useEffect(() => setBtnState(state), [ state ]), useEffect(() => setPlaying(working), [ working ]), 
+    useEffect(() => {
+        variant && size && labelSize && ((null == ref ? void 0 : ref.current) ? setBtnWidth(ref.current.offsetWidth) : setBtnWidth(width));
+    }, [ width, variant, labelSize, size ]), useImperativeHandle(buttonRef, () => ({
+        triggerClick: () => handleClick(void 0)
+    })), useEffect(() => {
+        trigger && handleClick(void 0);
+    }, [ trigger, handleClick ]);
+    const destructiveColor = useCallback(icon => {
+        if (icon) {
+            if ("disabled" === btnState) return "var(--core-text-disabled)";
+            if ("solid" === variant) return "var(--core-text-light)";
+        }
+        return destructive ? "var(--feedback-warning)" : "var(--core-text-primary)";
+    }, [ destructive, variant, btnState ]), solid = useMemo(() => ({
+        border: "0px",
+        iconColor: {
+            normal: iconColor || destructiveColor(!0),
+            hover: iconColor || destructiveColor(!0),
+            disabled: iconColor || destructiveColor(!0)
+        },
+        background: {
+            normal: bgColor || (destructive ? "var(--feedback-warning)" : "var(--core-button-primary)"),
+            hover: bgColor || (destructive ? "var(--feedback-warning)" : "var(--core-button-primary)"),
+            disabled: bgColorDisabled || "var(--core-button-disabled)"
+        },
+        borderColor: {
+            normal: "transparent",
+            hover: "transparent",
+            disabled: "transparent"
+        },
+        color: {
+            normal: labelColor || (destructive ? "white" : "var(--core-text-light)"),
+            hover: labelColor || (destructive ? "white" : "var(--core-text-light)"),
+            disabled: "var(--core-text-disabled)"
+        }
+    }), [ labelColor, destructive, destructiveColor, bgColor, bgColorDisabled, iconColor ]), outline = useMemo(() => ({
+        border: "1px",
+        iconColor: {
+            normal: iconColor || destructiveColor(!0),
+            hover: iconColor || destructiveColor(!0),
+            disabled: iconColor || destructiveColor(!0)
+        },
+        background: {
+            normal: bgColor || "var(--core-surface-primary)",
+            hover: bgColor || "var(--core-surface-primary)",
+            disabled: bgColorDisabled || "var(--core-surface-primary)"
+        },
+        borderColor: {
+            normal: destructive ? "var(--feedback-warning)" : "var(--core-outline-primary)",
+            hover: destructive ? "var(--feedback-warning)" : "var(--core-outline-primary)",
+            disabled: "var(--core-outline-primary)"
+        },
+        color: {
+            normal: labelColor || (destructive ? "var(--feedback-warning)" : "var(--core-text-primary)"),
+            hover: labelColor || (destructive ? "var(--feedback-warning)" : "var(--core-text-special)"),
+            disabled: "var(--core-text-disabled)"
+        }
+    }), [ labelColor, destructive, destructiveColor, bgColor, bgColorDisabled, iconColor ]), text = useMemo(() => ({
+        border: "1px",
+        iconColor: {
+            normal: destructiveColor(!0),
+            hover: destructiveColor(!0),
+            disabled: "var(--core-text-disabled)"
+        },
+        background: {
+            normal: "transparent",
+            hover: "transparent",
+            disabled: "transparent"
+        },
+        borderColor: {
+            normal: "transparent",
+            hover: "transparent",
+            disabled: "transparent"
+        },
+        color: {
+            normal: labelColor || destructiveColor(!1),
+            hover: labelColor || destructiveColor(!1),
+            disabled: "var(--core-text-disabled)"
+        }
+    }), [ destructiveColor, labelColor ]), colorStyles = useMemo(() => ({
+        solid: solid,
+        outline: outline,
+        text: text
+    }), [ solid, outline, text ]), setPadding = useCallback(side => round ? 0 : "left" === side && iconLeft || "right" === side && iconRight ? 20 : 24, [ round, iconLeft, iconRight ]), sizingStyles = useMemo(() => ({
+        large: {
+            height: 48,
+            gap: 8,
+            iconSize: iconSize,
+            paddingLeft: setPadding("left"),
+            paddingRight: setPadding("right"),
+            width: round ? "48px" : btnWidth || "auto",
+            borderRadius: null != borderRadius ? borderRadius : "500px"
+        },
+        medium: {
+            height: 36,
+            gap: 8,
+            iconSize: iconSize,
+            paddingLeft: setPadding("left"),
+            paddingRight: setPadding("right"),
+            width: round ? "36px" : btnWidth || "auto",
+            borderRadius: null != borderRadius ? borderRadius : "500px"
+        },
+        text: {
+            height: 20,
+            gap: 8,
+            iconSize: iconSize,
+            paddingLeft: 0,
+            paddingRight: 0,
+            btnWidth: btnWidth,
+            borderRadius: 0
+        }
+    }), [ iconSize, btnWidth, round, borderRadius, setPadding ]), handleMouseEnter = useCallback(e => {
+        if ("disabled" !== btnState && setBtnState("hover"), !(null == ref ? void 0 : ref.current) || !tooltip) return;
+        const tip = {
+            type: ToolTipType.button,
+            payload: {
+                label: tooltip
+            },
+            event: e,
+            ref: ref
+        };
+        onToolTip(tip);
+    }, [ btnState, tooltip, onToolTip ]), handleMouseLeave = useCallback(() => {
+        "disabled" !== btnState && setBtnState("normal"), tooltip && onToolTip(null);
+    }, [ btnState, tooltip, onToolTip ]), handleDidStop = useCallback(() => {
+        setPlaying(!1), onClick(void 0);
+    }, [ onClick ]), shouldShowLabel = useMemo(() => !(playing && !iconLeft && !iconRight) && Boolean(label), [ playing, iconLeft, iconRight, label ]), buttonStyle = useMemo(() => ({
+        color: colorStyles[variant].color[btnState],
+        background: fill ? "var(--core-surface-primary)" : colorStyles[variant].background[state],
+        paddingRight: null != paddingRight ? paddingRight : sizingStyles[size].paddingRight,
+        paddingLeft: null != paddingLeft ? paddingLeft : sizingStyles[size].paddingLeft,
+        borderRadius: sizingStyles[size].borderRadius,
+        height: sizingStyles[size].height,
+        maxHeight: sizingStyles[size].height,
+        minHeight: sizingStyles[size].height,
+        flex: "fill" === width ? 1 : "unset",
+        gap: sizingStyles[size].gap,
+        borderWidth: colorStyles[variant].border,
+        borderStyle: "solid",
+        borderColor: colorStyles[variant].borderColor[btnState],
+        cursor: "disabled" === state ? "default" : "pointer",
+        transition: "all 0s ease-in-out 0s"
+    }), [ colorStyles, variant, btnState, fill, state, paddingRight, paddingLeft, sizingStyles, size, width ]), progressColor = useMemo(() => destructive ? "var(feedback-warning)" : colorStyles[variant].color[btnState], [ destructive, colorStyles, variant, btnState ]), setStyle = useCallback(value => void 0 === value ? "unset" : "number" == typeof value ? `${value}px` : value, []), iconDivSize = useMemo(() => round ? `${buttonStyle.minHeight}px` : iconSize ? setStyle(iconSize) : "unset", [ round, iconSize, buttonStyle, setStyle ]), cssVars = useMemo(() => ({
+        "--ui-button-decoration": underline ? "underline" : "unset",
+        "--ui-button-min-width": btnWidth ? setStyle(btnWidth) : "unset",
+        "--ui-button-icon-size": iconDivSize
+    }), [ underline, btnWidth, setStyle, iconDivSize ]);
+    return jsxs(motion.div, Object.assign({
+        id: divId,
+        className: `${css.button}${divClass}`,
+        ref: ref,
+        onMouseEnter: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        style: Object.assign(Object.assign(Object.assign({}, divStyle), buttonStyle), cssVars),
+        transition: transition,
+        variants: variants,
+        initial: initial,
+        animate: animate,
+        exit: exit,
+        onClick: handleClick
+    }, rest, {
+        children: [ !playing && iconLeft && jsx("div", {
+            className: css.icon,
+            children: jsx(Icon, {
+                name: iconLeft,
+                size: sizingStyles[size].iconSize,
+                strokeColor: colorStyles[variant].iconColor[btnState],
+                pointer: "disabled" !== btnState
+            })
+        }), playing && iconLeft && jsx("div", {
+            className: css.icon,
+            children: jsx(ProgressIndicator, {
+                show: playing,
+                didStop: handleDidStop,
+                duration: duration,
+                size: sizingStyles[size].iconSize,
+                color: progressColor,
+                inline: !0
+            })
+        }), playing && !iconLeft && !iconRight && jsx("div", {
+            className: css.icon,
+            children: jsx(ProgressIndicator, {
+                show: playing,
+                didStop: handleDidStop,
+                duration: duration,
+                size: sizingStyles[size].iconSize,
+                color: progressColor,
+                inline: !1
+            })
+        }), shouldShowLabel && jsx("div", {
+            className: `${css.label} ${css[labelSize]}`,
+            children: label
+        }), playing && iconRight && jsx("div", {
+            className: css.icon,
+            children: jsx(ProgressIndicator, {
+                show: playing,
+                didStop: handleDidStop,
+                duration: duration,
+                size: sizingStyles[size].iconSize,
+                color: progressColor,
+                inline: !0
+            })
+        }), !playing && iconRight && jsx("div", {
+            className: css.icon,
+            children: jsx(Icon, {
+                name: iconRight,
+                size: sizingStyles[size].iconSize,
+                strokeColor: colorStyles[variant].iconColor[btnState],
+                pointer: "disabled" !== btnState
+            })
+        }), jsx(Dot, {
+            show: !playing && showDot
+        }), !playing && count && jsx("div", {
+            className: css.count,
+            children: jsx(Badge, {
+                variant: "light",
+                count: Number(count)
+            })
+        }) ]
+    }));
+});
+
+ButtonComponent.displayName = "Button";
+
+const Button = React.memo(ButtonComponent);
+
+export { Button as B };

package/dist/esm/chunks/ButtonBar-Cr6TFvvD.mjs

@@ -0,0 +1,66 @@
+import { _ as __rest } from "./tslib.es6-c-7TIv71.mjs";
+
+import { jsxs, jsx } from "react/jsx-runtime";
+
+import { useState, useEffect, useCallback } from "react";
+
+import { useTheme } from "../hooks/useTheme.mjs";
+
+import "../theme/colors.mjs";
+
+import "../hooks/useWindow.mjs";
+
+import { I as IconButton } from "./IconButton-BBiZrXlS.mjs";
+
+import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
+
+var css_wrapper = "ButtonBar-module_wrapper__056Gm flexBox-module_rowStart__nJZnW", css_label = "ButtonBar-module_label__ubTGP flexBox-module_rowStart__nJZnW type-module_body-s-regular__8-FO-", css_button = "ButtonBar-module_button__woeDh flexBox-module_rowStart__nJZnW", css_selected = "ButtonBar-module_selected__0KKNw", css_divider = "ButtonBar-module_divider__kfIkV", css_last = "ButtonBar-module_last__1yYdd";
+
+function ButtonBar(props) {
+    const {options: options = [], current: current = 0, label: label, onChange: onChange = () => null, onToolTip: onToolTip = () => null} = props, divAttributes = __rest(props, [ "options", "current", "label", "onChange", "onToolTip" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", theme = useTheme(), [hovered, setHovered] = useState(-1), [currentPage, setCurrentPage] = useState(current);
+    useEffect(() => setCurrentPage(current), [ current ]);
+    const handleMouseEnter = useCallback(index => {
+        setHovered(index);
+    }, []), handleMouseLeave = useCallback(() => {
+        setHovered(-1);
+    }, []), handleClick = useCallback((button, index) => {
+        setCurrentPage(index), onChange(button);
+    }, [ onChange ]), display = useCallback(index => index === options.length - 1 ? css_last : "", [ options.length ]), selected = useCallback(index => currentPage === index ? css_selected : "", [ currentPage ]), iconColor = useCallback(index => {
+        const isHovered = hovered === index;
+        return currentPage === index ? theme.current.colors["core-icon-primary"] : isHovered ? theme.current.colors["core-button-primary"] : theme.current.colors["core-text-disabled"];
+    }, [ currentPage, hovered, theme ]);
+    return jsxs("div", Object.assign({
+        id: divId,
+        className: `${css_wrapper}${divClass}`,
+        style: divStyle
+    }, rest, {
+        children: [ label && jsx("div", {
+            className: css_label,
+            children: label
+        }), null == options ? void 0 : options.map((button, index) => jsxs("div", {
+            className: css_button,
+            onMouseEnter: () => handleMouseEnter(index),
+            onMouseLeave: () => handleMouseLeave(),
+            children: [ jsx("div", {
+                className: selected(index),
+                onClick: () => handleClick(button, index),
+                onKeyDown: () => handleClick(button, index),
+                children: jsx(IconButton, {
+                    icon: button.icon,
+                    color: iconColor(index),
+                    label: button.label,
+                    tooltip: button.tip,
+                    onToolTip: onToolTip,
+                    hover: !0,
+                    toggle: !1
+                })
+            }), jsx("div", {
+                className: `${css_divider} ${display(index)}`
+            }) ]
+        }, `button-bar-${button.icon}-${index}`)) ]
+    }));
+}
+
+styleInject(".flexBox-module_row__PWxbe {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__27lKK {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__nJZnW {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__dHcOU {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__MP2Xd {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__Kg8cV {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__zcmtk {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__157yI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__u2nwI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__QWEzl {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__FxEAv {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__rf7AV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__8-FO- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__qyYq- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__7GQ5Z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__Qtp5G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__Ieh9K {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__0lZ3I {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__Ar4d3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__6tV1n {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__I8Q1v {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__zDf-z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__R5GpK {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__SI-hC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__jGIb2 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__QFgN8 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__tdBSi {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__-7Uyu {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__8hGYF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Cryjg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__PUi44 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__1B6fk {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.ButtonBar-module_wrapper__056Gm {\n}\n\n.ButtonBar-module_label__ubTGP {\n\tcolor: var(--core-text-disabled);\n\tpadding-right: 4px;\n}\n\n.ButtonBar-module_button__woeDh {\n\theight: 32px;\n\tgap: 0;\n\tcursor: pointer;\n\tbackground: var(--core-surface-primary);\n\tcolor: var(--core-text-disabled);\n\t&:last-child {\n\t\t&:hover {\n\t\t\tbackground: var(--core-surface-primary);\n\t\t}\n\t}\n\t&:first-child {\n\t\t&:hover {\n\t\t\tbackground: var(--core-surface-primary);\n\t\t}\n\t}\n\t&:hover {\n\t\tbackground: var(--core-surface-primary);\n\t\tcolor: var(--core-text-primary);\n\t}\n}\n\n.ButtonBar-module_selected__0KKNw {\n\tbackground: var(--core-surface-primary);\n\tcolor: var(--core-link-primary);\n}\n\n.ButtonBar-module_divider__kfIkV {\n\tdisplay: block;\n\tbackground: var(--core-outline-primary);\n\twidth: 1px;\n\theight: 16px;\n\tmargin: 0 4px;\n}\n\n.ButtonBar-module_last__1yYdd {\n\tdisplay: none;\n}\n");
+
+export { ButtonBar as B };

package/dist/esm/chunks/Card-BzKBF0ny.mjs

@@ -0,0 +1,45 @@
+import { _ as __rest } from "./tslib.es6-c-7TIv71.mjs";
+
+import { jsxs, jsx } from "react/jsx-runtime";
+
+import React, { useCallback, useMemo } from "react";
+
+import { I as Icon } from "./_types-KZDzhaiK.mjs";
+
+import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
+
+var css_card = "Card-module_card__PHKoO flexBox-module_rowStart__nJZnW type-module_body-m-regular__Qtp5G", css_icon = "Card-module_icon__k0FIP flexBox-module_row__PWxbe", css_label = "Card-module_label__mGere";
+
+styleInject(".flexBox-module_row__PWxbe {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__27lKK {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__nJZnW {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__dHcOU {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__MP2Xd {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__Kg8cV {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__zcmtk {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__157yI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__u2nwI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__QWEzl {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__FxEAv {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__rf7AV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__8-FO- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__qyYq- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__7GQ5Z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__Qtp5G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__Ieh9K {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__0lZ3I {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__Ar4d3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__6tV1n {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__I8Q1v {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__zDf-z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__R5GpK {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__SI-hC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__jGIb2 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__QFgN8 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__tdBSi {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__-7Uyu {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__8hGYF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Cryjg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__PUi44 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__1B6fk {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.Card-module_card__PHKoO {\n\tpadding: 8px 14px 8px 8px !important;\n\tcolor: var(--core-text-primary);\n\twidth: var(--card-width);\n\tmax-width: min-content;\n\tflex: var(--card-flex);\n\tgap: 8px;\n\tborder-radius: 8px;\n\tborder: 1px solid var(--core-outline-primary);\n\tcursor: pointer;\n\ttransition: all 0.25s ease-in-out 0s;\n\t&:hover {\n\t\tcolor: var(--core-button-primary);\n\t\tborder: 1px solid var(--core-button-primary);\n\t}\n}\n\n.Card-module_icon__k0FIP {\n\tmin-width: 20px;\n\tmin-height: 20px;\n\tmax-width: 20px;\n\tmax-height: 20px;\n}\n\n.Card-module_label__mGere {\n\tflex: 1;\n\tword-break: break-all;\n\ttext-overflow: ellipsis;\n\toverflow: hidden;\n\toverflow-wrap: anywhere;\n\tdisplay: -webkit-box;\n\twhite-space: nowrap;\n\t-webkit-line-clamp: 1;\n\t-webkit-box-orient: vertical;\n}\n");
+
+const Card = React.memo(function(props) {
+    const {id: id, icon: icon, label: label, command: command, width: width, onCommand: onCommand = () => null} = props, divAttributes = __rest(props, [ "id", "icon", "label", "command", "width", "onCommand" ]), {className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", setStyle = useCallback(value => void 0 === value || "fill" === value ? "unset" : "string" == typeof value ? value : `${value}px`, []), cssVars = useMemo(() => ({
+        "--card-width": setStyle(width),
+        "--card-flex": "fill" === width ? "1" : "unset"
+    }), [ setStyle, width ]);
+    return jsxs("div", Object.assign({
+        id: id,
+        className: `${css_card}${divClass}`,
+        style: Object.assign(Object.assign({}, divStyle), cssVars),
+        onClick: () => onCommand({
+            id: id,
+            command: command
+        }),
+        onKeyDown: () => onCommand({
+            id: id,
+            command: command
+        })
+    }, rest, {
+        children: [ icon && jsx("div", {
+            className: css_icon,
+            children: jsx(Icon, {
+                name: icon
+            })
+        }), label && jsx("div", {
+            className: css_label,
+            children: label
+        }) ]
+    }));
+});
+
+export { Card as C };

package/dist/esm/chunks/CheckBox-CYggPKaT.mjs

@@ -0,0 +1,68 @@
+import { _ as __rest } from "./tslib.es6-c-7TIv71.mjs";
+
+import { jsxs, jsx } from "react/jsx-runtime";
+
+import { motion } from "motion/react";
+
+import React, { useState, useEffect, useMemo, useCallback } from "react";
+
+import { useTheme } from "../hooks/useTheme.mjs";
+
+import "../theme/colors.mjs";
+
+import "../hooks/useWindow.mjs";
+
+import { I as Icon } from "./_types-KZDzhaiK.mjs";
+
+import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
+
+var css_wrapper = "CheckBox-module_wrapper__m-SdK flexBox-module_row__PWxbe", css_icon = "CheckBox-module_icon__N3ORQ flexBox-module_row__PWxbe", css_label = "CheckBox-module_label__iNXWc type-module_body-m-regular__Qtp5G";
+
+styleInject(".flexBox-module_row__PWxbe {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__27lKK {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__nJZnW {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__dHcOU {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__MP2Xd {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__Kg8cV {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__zcmtk {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__157yI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__u2nwI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__QWEzl {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__FxEAv {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__rf7AV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__8-FO- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__qyYq- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__7GQ5Z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__Qtp5G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__Ieh9K {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__0lZ3I {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__Ar4d3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__6tV1n {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__I8Q1v {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__zDf-z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__R5GpK {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__SI-hC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__jGIb2 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__QFgN8 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__tdBSi {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__-7Uyu {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__8hGYF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Cryjg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__PUi44 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__1B6fk {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.CheckBox-module_wrapper__m-SdK {\n\tmin-height: var(--cb-size);\n\theight: var(--cb-size);\n\twidth: auto;\n\tgap: 6px;\n\tcursor: pointer;\n\toverflow: hidden;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\toutline: none;\n\tborder: 0;\n}\n\n.CheckBox-module_icon__N3ORQ {\n\tmin-width: var(--cb-size);\n\tmax-width: var(--cb-size);\n\tmin-height: var(--cb-size);\n\tmax-height: var(--cb-size);\n}\n\n.CheckBox-module_label__iNXWc {\n\tcolor: var(--core-text-primary);\n}\n");
+
+const CheckBox = React.memo(props => {
+    const {size: size = 20, checked: checked = !1, disabled: disabled = !1, color: color, label: label, onChange: onChange = () => null} = props, divAttributes = __rest(props, [ "size", "checked", "disabled", "color", "label", "onChange" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [state, setState] = useState(checked), theme = useTheme();
+    useEffect(() => setState(checked), [ checked ]);
+    const iconName = useMemo(() => !0 === state ? "checked" : "mixed" === state ? "partial" : "unchecked", [ state ]), iconColor = useMemo(() => color || (disabled ? theme.current.colors["core-icon-disabled"] : "mixed" === state ? theme.current.colors["core-icon-primary"] : state ? theme.current.colors["core-text-special"] : theme.current.colors["core-icon-secondary"]), [ color, disabled, state, theme ]), cssVars = useMemo(() => ({
+        "--cb-size": `${size}px`,
+        "--cb-label-color": `${color}`
+    }), [ size, color ]), handleToggle = useCallback(() => {
+        let newState = !1;
+        switch (state) {
+          case !0:
+            break;
+
+          case "mixed":
+          case !1:
+            newState = !0;
+        }
+        setState(newState), onChange(newState);
+    }, [ state, onChange ]), handleKeyDown = useCallback(e => {
+        " " !== e.key && "Enter" !== e.key || (e.preventDefault(), handleToggle());
+    }, [ handleToggle ]);
+    return jsxs(motion.div, Object.assign({
+        id: divId,
+        className: `${css_wrapper}${divClass}`,
+        style: Object.assign(Object.assign({}, divStyle), cssVars),
+        onClick: handleToggle,
+        onKeyDown: handleKeyDown,
+        tabIndex: disabled ? -1 : 0,
+        role: "checkbox",
+        "aria-checked": "mixed" === state ? "mixed" : state,
+        "aria-disabled": disabled
+    }, rest, {
+        children: [ jsx("div", {
+            className: css_icon,
+            children: jsx(Icon, {
+                name: iconName,
+                strokeColor: iconColor,
+                size: size
+            })
+        }), label && jsx("span", {
+            className: css_label,
+            children: label
+        }) ]
+    }));
+});
+
+export { CheckBox as C };