@apple-pie/slice 0.1.10 → 0.1.12

package/dist/esm/chunks/{Chip-BqneFUOR.mjs → Chip-BRZeD1OX.mjs}

@@ -6,7 +6,7 @@ import React, { useState, useCallback, useMemo } from "react";
 
 import { s as setStyle, a as accessibleKeyDown } from "./misc-N8KLjOXc.mjs";
 
-import { I as Icon } from "./Icon-C92f63Ib.mjs";
+import { I as Icon } from "./Icon-CUSQtytG.mjs";
 
 import { T as ToolTipType } from "./sharedTypes-tn9-uJvb.mjs";
 
@@ -15,15 +15,16 @@ import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 var css = {
     chip: "Chip-module_chip__0nys- flexBox-module_row__z24tF",
     icon: "Chip-module_icon__dtR-K flexBox-module_row__z24tF",
+    xs: "Chip-module_xs__s-KNG type-module_body-xs-regular__ZAFft",
     s: "Chip-module_s__2KTXi type-module_body-s-regular__vRHSP",
     m: "Chip-module_m__l2u3N type-module_body-m-regular__LuQBA",
     l: "Chip-module_l__3MqPN type-module_body-l-regular__lOYbg"
 };
 
-styleInject(".flexBox-module_row__z24tF {\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__5FEvi {\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__4tcxS {\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__rVdVm {\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__ezvMq {\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__C7P44 {\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__PKcrG {\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__ERfp7 {\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__lLJuc {\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__ZAFft {\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__s3KvF {\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__Lhqqq {\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__vRHSP {\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__tjdFc {\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__Iy-VX {\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__LuQBA {\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__uW1on {\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__UBcvQ {\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__lOYbg {\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__BqRC7 {\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__Fh2dt {\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__pF2kC {\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__BeyrH {\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__Ruknj {\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__z8L3G {\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__0O3g6 {\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__KXxEB {\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__cJeEA {\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__eRe05 {\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__Xmwtf {\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__5q1m3 {\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__k9VFV {\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.Chip-module_chip__0nys- {\n\tpadding: var(--ui-chip-padding) !important;\n\twidth: min-content;\n\tmin-height: 30px;\n\tgap: var(--ui-chip-gap);\n\tbackground: var(--ui-chip-bg-color);\n\tline-height: 1em;\n\tcolor: var(--ui-chip-label-color);\n\tborder: var(--ui-chip-border-size) solid var(--ui-chip-border-color);\n\tborder-radius: var(--ui-chip-border-radius);\n\ttransition: all var(--motion-water-duration) var(--motion-water) 0s;\n\tcursor: var(--ui-chip-cursor);\n\twhite-space: nowrap;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t&:hover {\n\t\tborder-color: var(--ui-chip-border-color-hover);\n\t\tbackground: var(--ui-chip-bg-color-hover);\n\t\tcolor: var(--ui-chip-label-color-hover);\n\t}\n}\n\n.Chip-module_icon__dtR-K {\n\theight: var(--ui-chip-icon-size);\n\tmin-height: var(--ui-chip-icon-size);\n\twidth: var(--ui-chip-icon-size);\n\tmin-width: var(--ui-chip-icon-size);\n}\n\n.Chip-module_s__2KTXi {\n}\n\n.Chip-module_m__l2u3N {\n}\n\n.Chip-module_l__3MqPN {\n}\n");
+styleInject(".flexBox-module_row__z24tF {\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__5FEvi {\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__4tcxS {\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__rVdVm {\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__ezvMq {\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__C7P44 {\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__PKcrG {\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__ERfp7 {\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__lLJuc {\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__ZAFft {\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__s3KvF {\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__Lhqqq {\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__vRHSP {\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__tjdFc {\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__Iy-VX {\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__LuQBA {\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__uW1on {\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__UBcvQ {\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__lOYbg {\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__BqRC7 {\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__Fh2dt {\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__pF2kC {\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__BeyrH {\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__Ruknj {\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__z8L3G {\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__0O3g6 {\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__KXxEB {\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__cJeEA {\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__eRe05 {\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__Xmwtf {\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__5q1m3 {\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__k9VFV {\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.Chip-module_chip__0nys- {\n\tpadding: var(--ui-chip-padding) !important;\n\twidth: min-content;\n\tmin-height: 30px;\n\tgap: var(--ui-chip-gap);\n\tbackground: var(--ui-chip-bg-color);\n\tline-height: 1em;\n\tcolor: var(--ui-chip-label-color);\n\tborder: var(--ui-chip-border-size) solid var(--ui-chip-border-color);\n\tborder-radius: var(--ui-chip-border-radius);\n\ttransition: all var(--motion-water-duration) var(--motion-water) 0s;\n\tcursor: var(--ui-chip-cursor);\n\twhite-space: nowrap;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t&:hover {\n\t\tborder-color: var(--ui-chip-border-color-hover);\n\t\tbackground: var(--ui-chip-bg-color-hover);\n\t\tcolor: var(--ui-chip-label-color-hover);\n\t}\n}\n\n.Chip-module_icon__dtR-K {\n\theight: var(--ui-chip-icon-size);\n\tmin-height: var(--ui-chip-icon-size);\n\twidth: var(--ui-chip-icon-size);\n\tmin-width: var(--ui-chip-icon-size);\n}\n\n.Chip-module_xs__s-KNG {\n}\n\n.Chip-module_s__2KTXi {\n}\n\n.Chip-module_m__l2u3N {\n}\n\n.Chip-module_l__3MqPN {\n}\n");
 
 const Chip = React.memo(props => {
-    const {children: children, label: label, icon: icon, tooltip: tooltip, iconSize: iconSize = 20, disabled: disabled = !1, focused: focused = !1, iconPosition: iconPosition = "left", labelSize: labelSize = "m", labelColor: labelColor = "var(--core-text-primary)", labelColorHover: labelColorHover = "var(--core-text-special)", iconColor: iconColor = "var(--core-text-primary)", iconColorHover: iconColorHover = "var(--core-text-special)", borderSize: borderSize = 1, borderColor: borderColor = "var(--core-text-primary)", borderColorHover: borderColorHover = "var(--core-text-special)", borderColorDisabled: borderColorDisabled = "var(--core-text-disabled)", bgColor: bgColor = "transparent", bgColorHover: bgColorHover = "var(--core-surface-secondary)", borderRadius: borderRadius = 8, paddingTops: paddingTops = 8, paddingSides: paddingSides = 16, gap: gap = 4, onToolTip: onToolTip = () => null, onClick: onClick = () => null} = props, divAttributes = __rest(props, [ "children", "label", "icon", "tooltip", "iconSize", "disabled", "focused", "iconPosition", "labelSize", "labelColor", "labelColorHover", "iconColor", "iconColorHover", "borderSize", "borderColor", "borderColorHover", "borderColorDisabled", "bgColor", "bgColorHover", "borderRadius", "paddingTops", "paddingSides", "gap", "onToolTip", "onClick" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [isHovered, setIsHovered] = useState(!1), handleClick = useCallback(e => {
+    const {children: children, label: label, icon: icon, tooltip: tooltip, iconSize: iconSize = 20, disabled: disabled = !1, focused: focused = !1, iconPosition: iconPosition = "left", labelSize: labelSize = "m", labelColor: labelColor = "var(--core-text-primary)", labelColorHover: labelColorHover = "var(--core-text-special)", iconColor: iconColor = "var(--core-text-primary)", iconColorHover: iconColorHover = "var(--core-text-special)", backgroundColor: backgroundColor, backgroundColorHover: backgroundColorHover, borderWidth: borderWidth, borderSize: borderSize = 1, borderColor: borderColor = "var(--core-text-primary)", borderColorHover: borderColorHover = "var(--core-text-special)", borderColorDisabled: borderColorDisabled = "var(--core-text-disabled)", bgColor: bgColor = "transparent", bgColorHover: bgColorHover = "var(--core-surface-secondary)", borderRadius: borderRadius = 8, paddingTop: paddingTop, paddingTops: paddingTops = 8, paddingSides: paddingSides = 16, gap: gap = 4, onToolTip: onToolTip = () => null, onClick: onClick = () => null} = props, divAttributes = __rest(props, [ "children", "label", "icon", "tooltip", "iconSize", "disabled", "focused", "iconPosition", "labelSize", "labelColor", "labelColorHover", "iconColor", "iconColorHover", "backgroundColor", "backgroundColorHover", "borderWidth", "borderSize", "borderColor", "borderColorHover", "borderColorDisabled", "bgColor", "bgColorHover", "borderRadius", "paddingTop", "paddingTops", "paddingSides", "gap", "onToolTip", "onClick" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [isHovered, setIsHovered] = useState(!1), resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, resolvedBackgroundColorHover = null != backgroundColorHover ? backgroundColorHover : bgColorHover, resolvedBorderWidth = null != borderWidth ? borderWidth : borderSize, resolvedPaddingTop = null != paddingTop ? paddingTop : paddingTops, handleClick = useCallback(e => {
         disabled || onClick(e);
     }, [ disabled, onClick ]), handleMouseEnter = useCallback((enter, event) => {
         if (enter) {
@@ -41,21 +42,21 @@ const Chip = React.memo(props => {
             setIsHovered(!0);
         } else onToolTip(null), setIsHovered(!1);
     }, [ tooltip, onToolTip ]), padding = useMemo(() => {
-        if (!icon) return `${paddingTops}px ${paddingSides}px`;
-        return `${paddingTops}px ${"right" === iconPosition ? paddingSides - 4 : paddingSides}px ${paddingTops}px ${"right" === iconPosition ? paddingSides : paddingSides - 4}px`;
-    }, [ icon, iconPosition, paddingTops, paddingSides ]), computedIconColor = useMemo(() => disabled ? "var(--core-text-disabled)" : isHovered ? null != iconColorHover ? iconColorHover : "var(--core-text-special)" : null != iconColor ? iconColor : "var(--core-text-primary)", [ iconColor, disabled, isHovered, iconColorHover ]), cssVars = useMemo(() => ({
+        if (!icon) return `${resolvedPaddingTop}px ${paddingSides}px`;
+        return `${resolvedPaddingTop}px ${"right" === iconPosition ? paddingSides - 4 : paddingSides}px ${resolvedPaddingTop}px ${"right" === iconPosition ? paddingSides : paddingSides - 4}px`;
+    }, [ icon, iconPosition, resolvedPaddingTop, paddingSides ]), computedIconColor = useMemo(() => disabled ? "var(--core-text-disabled)" : isHovered ? null != iconColorHover ? iconColorHover : "var(--core-text-special)" : null != iconColor ? iconColor : "var(--core-text-primary)", [ iconColor, disabled, isHovered, iconColorHover ]), cssVars = useMemo(() => ({
         "--ui-chip-padding": padding,
         "--ui-chip-gap": setStyle(gap),
         "--ui-chip-border-radius": setStyle(borderRadius),
-        "--ui-chip-border-size": setStyle(borderSize),
+        "--ui-chip-border-size": setStyle(resolvedBorderWidth),
         "--ui-chip-border-color": disabled ? borderColorDisabled : borderColor,
         "--ui-chip-border-color-hover": disabled ? borderColorDisabled : borderColorHover,
-        "--ui-chip-bg-color": bgColor,
-        "--ui-chip-bg-color-hover": disabled ? bgColor : bgColorHover,
+        "--ui-chip-bg-color": resolvedBackgroundColor,
+        "--ui-chip-bg-color-hover": disabled ? resolvedBackgroundColor : resolvedBackgroundColorHover,
         "--ui-chip-label-color": disabled ? "var(--core-text-disabled)" : labelColor,
         "--ui-chip-label-color-hover": disabled ? "var(--core-text-disabled)" : labelColorHover,
         "--ui-chip-cursor": disabled ? "default" : "pointer"
-    }), [ padding, bgColor, borderColor, borderColorDisabled, borderColorHover, borderSize, bgColorHover, labelColorHover, labelColor, gap, borderRadius, disabled ]);
+    }), [ padding, resolvedBackgroundColor, borderColor, borderColorDisabled, borderColorHover, resolvedBorderWidth, resolvedBackgroundColorHover, labelColorHover, labelColor, gap, borderRadius, disabled ]);
     return jsxs("div", Object.assign({
         id: divId,
         className: `${css.chip}${divClass}`,

package/dist/esm/chunks/{DivInput-Ch9XjfWd.mjs → DivInput-DeSpC8Wm.mjs}

@@ -15,7 +15,7 @@ var css_wrapper = "DivInput-module_wrapper__ZQxY-", css_input = "DivInput-module
 styleInject(".type-module_body-xs-regular__ZAFft {\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__s3KvF {\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__Lhqqq {\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__vRHSP {\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__tjdFc {\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__Iy-VX {\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__LuQBA {\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__uW1on {\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__UBcvQ {\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__lOYbg {\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__BqRC7 {\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__Fh2dt {\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__pF2kC {\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__BeyrH {\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__Ruknj {\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__z8L3G {\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__0O3g6 {\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__KXxEB {\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__cJeEA {\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__eRe05 {\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__Xmwtf {\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__5q1m3 {\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__k9VFV {\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.DivInput-module_wrapper__ZQxY- {\n\tpadding: var(--div-input-padding);\n\twidth: var(--div-input-width);\n\tborder-radius: var(--div-input-border-radius);\n\tbackground: var(--div-input-wrapper-bg);\n\t&:hover {\n\t\tbackground: var(--div-input-bg);\n\t}\n}\n\n.DivInput-module_input__J34-l {\n\tcolor: var(--div-input-color);\n\tuser-select: var(--div-input-user-select);\n\t-webkit-user-select: var(--div-input-user-select);\n\ttext-align: var(--div-input-text-align);\n\tpointer-events: all;\n\tbackground: transparent;\n\tborder-radius: 4px;\n\tborder: 0;\n\toutline: none;\n\ttext-overflow: ellipsis;\n\tdisplay: -webkit-box;\n\toverflow: hidden;\n\twhite-space: var(--div-input-white-space);\n\t-webkit-line-clamp: var(--div-input-line-clamp);\n\t-webkit-box-orient: vertical;\n\tcursor: var(--div-input-cursor);\n\ttransition: background var(--motion-water-duration) var(--motion-water) 0s;\n}\n");
 
 const DivInput = React.memo(props => {
-    const {value: value = "", name: name = "Input Field", placeholder: placeholder = "Placeholder", isEditable: isEditable = !0, wrap: wrap = !1, focus: focus = !1, width: width = "auto", textAlign: textAlign = "left", clamp: clamp = 3, padding: padding = "0px", onChange: onChange = () => null, onSubmit: onSubmit = () => null, onFocus: onFocus = () => null, onBlur: onBlur = () => null, onDblClick: onDblClick = () => null, onClick: onClick = () => null, radius: radius = 4, bgColor: bgColor = "var(--core-surface-secondary)"} = props, divAttributes = __rest(props, [ "value", "name", "placeholder", "isEditable", "wrap", "focus", "width", "textAlign", "clamp", "padding", "onChange", "onSubmit", "onFocus", "onBlur", "onDblClick", "onClick", "radius", "bgColor" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", ref = useRef(null), innerText = useRef(cleanString("" === value ? placeholder : value)), [isFocused, setIsFocused] = useState(focus), [text, setText] = useState(innerText.current), [isPlaceholder, setIsPlaceholder] = useState(!1), setCursor = useCallback((to, length = 1) => {
+    const {value: value = "", name: name = "Input Field", placeholder: placeholder = "Placeholder", isEditable: isEditable = !0, wrap: wrap = !1, focus: focus = !1, width: width = "auto", textAlign: textAlign = "left", clamp: clamp = 3, padding: padding = "0px", onChange: onChange = () => null, onSubmit: onSubmit = () => null, onFocus: onFocus = () => null, onBlur: onBlur = () => null, onDblClick: onDblClick = () => null, onClick: onClick = () => null, borderRadius: borderRadius, radius: radius = 4, backgroundColor: backgroundColor, bgColor: bgColor = "var(--core-surface-secondary)"} = props, divAttributes = __rest(props, [ "value", "name", "placeholder", "isEditable", "wrap", "focus", "width", "textAlign", "clamp", "padding", "onChange", "onSubmit", "onFocus", "onBlur", "onDblClick", "onClick", "borderRadius", "radius", "backgroundColor", "bgColor" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", ref = useRef(null), innerText = useRef(cleanString("" === value ? placeholder : value)), [isFocused, setIsFocused] = useState(focus), [text, setText] = useState(innerText.current), [isPlaceholder, setIsPlaceholder] = useState(!1), resolvedBorderRadius = null != borderRadius ? borderRadius : radius, resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, setCursor = useCallback((to, length = 1) => {
         if (ref.current) {
             const range = document.createRange();
             range.setStart(ref.current, "start" === to ? 0 : length), range.setEnd(ref.current, "start" === to ? 0 : 1);
@@ -82,9 +82,9 @@ const DivInput = React.memo(props => {
         "--div-input-line-clamp": isEditable && isFocused ? "none" : null != clamp ? clamp : "none",
         "--div-input-cursor": isEditable ? "text" : "default",
         "--div-input-bg": isEditable ? null != bgColor ? bgColor : "var(--core-surface-secondary)" : "transparent",
-        "--div-input-wrapper-bg": isEditable && isFocused ? null != bgColor ? bgColor : "var(--core-surface-secondary)" : "transparent",
-        "--div-input-border-radius": `${radius}px`
-    }), [ clamp, wrap, isEditable, width, textAlign, isFocused, padding, isPlaceholder, setWidth, bgColor, radius ]);
+        "--div-input-wrapper-bg": isEditable && isFocused ? null != resolvedBackgroundColor ? resolvedBackgroundColor : "var(--core-surface-secondary)" : "transparent",
+        "--div-input-border-radius": `${resolvedBorderRadius}px`
+    }), [ clamp, wrap, isEditable, width, textAlign, isFocused, padding, isPlaceholder, setWidth, resolvedBackgroundColor, resolvedBorderRadius, bgColor ]);
     return jsx("div", Object.assign({
         id: divId,
         className: `${css_wrapper}${divClass}`,

package/dist/esm/chunks/{DropDown-Cvf2d_3u.mjs → DropDown-DOJvg96J.mjs}

@@ -4,89 +4,84 @@ import { jsx, jsxs } from "react/jsx-runtime";
 
 import React, { useState, useRef, useEffect, useCallback, useMemo } from "react";
 
-import { useTheme } from "../hooks/useTheme.mjs";
+import { s as setStyle } from "./misc-N8KLjOXc.mjs";
 
-import "../theme/colors.mjs";
-
-import "../hooks/useWindow.mjs";
-
-import { I as Icon } from "./Icon-C92f63Ib.mjs";
+import { I as Icon } from "./Icon-CUSQtytG.mjs";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 
 var css = {
     wrapper: "DropDown-module_wrapper__CyX0u flexBox-module_rowStart__4tcxS",
     face: "DropDown-module_face__6gyF3 flexBox-module_rowStart__4tcxS",
-    small: "DropDown-module_small__5R9bM type-module_body-s-regular__vRHSP",
-    medium: "DropDown-module_medium__MnvHF type-module_body-m-regular__LuQBA",
-    large: "DropDown-module_large__jMjDO type-module_body-l-regular__lOYbg",
+    label: "DropDown-module_label__Mrwbp flexBox-module_rowStart__4tcxS",
+    xs: "DropDown-module_xs__7L71q type-module_body-xs-regular__ZAFft",
+    s: "DropDown-module_s__vAxXD type-module_body-s-regular__vRHSP",
+    m: "DropDown-module_m__K6JPk type-module_body-m-regular__LuQBA",
+    l: "DropDown-module_l__Kib48 type-module_body-l-regular__lOYbg",
     chevron: "DropDown-module_chevron__LkYsE flexBox-module_rowStart__4tcxS",
     select: "DropDown-module_select__mzNnv"
 };
 
-styleInject(".flexBox-module_row__z24tF {\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__5FEvi {\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__4tcxS {\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__rVdVm {\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__ezvMq {\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__C7P44 {\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__PKcrG {\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__ERfp7 {\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__lLJuc {\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__ZAFft {\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__s3KvF {\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__Lhqqq {\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__vRHSP {\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__tjdFc {\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__Iy-VX {\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__LuQBA {\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__uW1on {\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__UBcvQ {\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__lOYbg {\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__BqRC7 {\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__Fh2dt {\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__pF2kC {\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__BeyrH {\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__Ruknj {\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__z8L3G {\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__0O3g6 {\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__KXxEB {\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__cJeEA {\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__eRe05 {\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__Xmwtf {\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__5q1m3 {\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__k9VFV {\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.DropDown-module_wrapper__CyX0u {\n\tposition: relative;\n\tgap: var(--dd-gap);\n\tmin-width: var(--dd-width);\n\twidth: var(--dd-width);\n\tborder-radius: var(--dd-border-radius);\n\tbackground-color: var(--dd-bg-color);\n\tbox-shadow: 0 0 0 var(--dd-box-shadow-size) var(--dd-border-color);\n\tpadding: var(--dd-padding-tops) var(--dd-padding-left) var(--dd-padding-tops)\n\t\tvar(--dd-padding-right) !important;\n\ttransition: all var(--motion-water-duration) var(--motion-water) 0s;\n}\n\n.DropDown-module_face__6gyF3 {\n\tflex: 1;\n\toverflow: hidden;\n\tdisplay: -webkit-box;\n\t-webkit-line-clamp: 1;\n\t-webkit-box-orient: vertical;\n\ttext-overflow: ellipsis;\n\tword-break: break-all;\n\tcolor: var(--dd-color);\n}\n\n.DropDown-module_small__5R9bM {\n}\n\n.DropDown-module_medium__MnvHF {\n}\n\n.DropDown-module_large__jMjDO {\n}\n\n.DropDown-module_chevron__LkYsE {\n\tmin-height: var(--dd-icon-size);\n\tmax-height: var(--dd-icon-size);\n\tmin-width: var(--dd-icon-size);\n\tmax-width: var(--dd-icon-size);\n}\n\n.DropDown-module_select__mzNnv {\n\tposition: absolute;\n\topacity: 0;\n\twidth: 100%;\n\theight: 100%;\n\tfont-size: 14px;\n\tbackground-color: #1f99cd;\n\tbackground-position: right 10px center;\n\tbackground-repeat: no-repeat;\n\tbackground-size: auto 50%;\n\tborder: none;\n\toutline: none;\n\t-moz-appearance: none;\n\t-webkit-appearance: none;\n\tappearance: none;\n\t&::-ms-expand {\n\t\tdisplay: none;\n\t}\n}\n");
+function resolveValueKey(value, valueKey) {
+    if (valueKey && value && "object" == typeof value) return value[valueKey];
+}
 
-const DropDown = React.memo(props => {
-    const theme = useTheme(), {name: name = "Select", width: width = "100%", height: height = "auto", selectedIndex: selectedIndex = 0, selectedValue: selectedValue = "", options: options = [], placeholder: placeholder = !0, validate: validate = !0, borderRadius: borderRadius = 4, bgColor: bgColor = "transparent", iconColor: iconColor = theme.current.colors["core-icon-primary"], paddingLeft: paddingLeft = "8px", paddingRight: paddingRight = "12px", paddingTops: paddingTops = "8px", iconSize: iconSize = 20, disabled: disabled = !1, unframed: unframed = !1, focused: focused = !1, gap: gap = 0, size: size = "medium", onChange: onChange = () => null, onValidate: onValidate = () => null, onFocus: onFocus = () => null, onBlur: onBlur = () => null} = props, divAttributes = __rest(props, [ "name", "width", "height", "selectedIndex", "selectedValue", "options", "placeholder", "validate", "borderRadius", "bgColor", "iconColor", "paddingLeft", "paddingRight", "paddingTops", "iconSize", "disabled", "unframed", "focused", "gap", "size", "onChange", "onValidate", "onFocus", "onBlur" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [index, setIndex] = useState(selectedIndex), [selectedText, setSelectedText] = useState("Select an option"), [initiated, setInitiated] = useState(!1), [color, setColor] = useState(iconColor), ref = useRef(null);
-    useEffect(() => setColor(theme.current.colors["core-icon-primary"]), [ theme ]), 
+function DropDownComponent(props) {
+    const {name: name = "drop-down-select", label: label, labelColor: labelColor = "var(--core-text-primary)", size: size = "m", width: width = "100%", height: height = "auto", selectedIndex: selectedIndex, selectedValue: selectedValue, valueKey: valueKey, options: options = [], placeholder: placeholder = !0, borderRadius: borderRadius = 4, backgroundColor: backgroundColor, bgColor: bgColor = "transparent", iconColor: iconColor = "var(--core-text-primary)", textColor: textColor = "var(--core-text-primary)", borderWidth: borderWidth, borderSize: borderSize = 1, borderColor: borderColor = "var(--core-outline-primary)", paddingLeft: paddingLeft = "8px", paddingRight: paddingRight = "12px", paddingTop: paddingTop = "8px", paddingBottom: paddingBottom = "8px", borderStyle: borderStyle = "box", iconSize: iconSize = 20, disabled: disabled = !1, error: error = !1, gap: gap = 8, onChange: onChange = () => null} = props, divAttributes = __rest(props, [ "name", "label", "labelColor", "size", "width", "height", "selectedIndex", "selectedValue", "valueKey", "options", "placeholder", "borderRadius", "backgroundColor", "bgColor", "iconColor", "textColor", "borderWidth", "borderSize", "borderColor", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "borderStyle", "iconSize", "disabled", "error", "gap", "onChange" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, resolvedBorderWidth = null != borderWidth ? borderWidth : borderSize, [index, setIndex] = useState(null != selectedIndex ? selectedIndex : 0), [selectedText, setSelectedText] = useState("Select an option"), ref = useRef(null);
     useEffect(() => {
-        let valid = !0;
-        validate && placeholder && 0 === index && (valid = !1), initiated || (valid = !0), 
-        onValidate(valid);
-    }, [ index, validate, placeholder, initiated, onValidate ]), useEffect(() => {
-        focused && (null == ref ? void 0 : ref.current) && (setInitiated(!0), ref.current.click());
-    }, [ focused ]), useEffect(() => {
-        if (null == ref ? void 0 : ref.current) {
+        if (null == selectedValue && void 0 !== selectedIndex && (null == ref ? void 0 : ref.current)) {
             if (!(null == options ? void 0 : options[selectedIndex])) return;
             const label = options[selectedIndex].label || "Select an option";
             setIndex(selectedIndex), setSelectedText(label), ref.current.selectedIndex = selectedIndex;
         }
-    }, [ selectedIndex, options ]), useEffect(() => {
-        if (!options || 0 === options.length || "" === selectedValue) return;
-        const foundIndex = options.findIndex(option => {
-            var _a, _b, _c;
-            return (null === (_a = null == option ? void 0 : option.value) || void 0 === _a ? void 0 : _a.toLowerCase()) === selectedValue.toString().toLowerCase() || (null === (_b = null == option ? void 0 : option.label) || void 0 === _b ? void 0 : _b.toLowerCase()) === selectedValue.toString().toLowerCase() || (null === (_c = null == option ? void 0 : option.alt) || void 0 === _c ? void 0 : _c.toLowerCase()) === selectedValue.toString().toLowerCase();
+    }, [ selectedIndex, options, selectedValue ]), useEffect(() => {
+        if (!options || 0 === options.length || null == selectedValue) return;
+        const selectedKey = resolveValueKey(selectedValue, valueKey), foundIndex = options.findIndex(option => {
+            var _a, _b;
+            return (null == option ? void 0 : option.value) === selectedValue || void 0 !== selectedKey && resolveValueKey(null == option ? void 0 : option.value, valueKey) === selectedKey || (null === (_a = null == option ? void 0 : option.label) || void 0 === _a ? void 0 : _a.toLowerCase()) === String(selectedValue).toLowerCase() || (null === (_b = null == option ? void 0 : option.alt) || void 0 === _b ? void 0 : _b.toLowerCase()) === String(selectedValue).toLowerCase();
         });
         if (-1 !== foundIndex) {
             const label = options[foundIndex].label || "Select an option";
             setSelectedText(label), setIndex(foundIndex), ref.current && (ref.current.selectedIndex = foundIndex);
         }
-    }, [ selectedValue, options ]);
+    }, [ selectedValue, options, valueKey ]);
     const handleChange = useCallback(i => {
         if (!options) return;
         const label = options[i].label || "Select an option";
-        setIndex(i), setSelectedText(label), index !== i && onChange(i, options[i]), onBlur(options[i].label || "");
-    }, [ options, index, onChange, onBlur ]), handleFocus = useCallback(() => {
-        setInitiated(!0), onFocus();
-    }, [ onFocus ]), renderedOptions = useMemo(() => options ? options.map((option, i) => jsx("option", {
-        value: null == option ? void 0 : option.value,
+        setIndex(i), setSelectedText(label), index !== i && onChange(i, options[i]);
+    }, [ options, index, onChange ]), renderedOptions = useMemo(() => options ? options.map((option, i) => jsx("option", {
+        value: i,
         onMouseUp: () => handleChange(i),
         children: null == option ? void 0 : option.label
     }, `${null == option ? void 0 : option.value}_${i}`)) : null, [ options, handleChange ]), displayText = useMemo(() => selectedText.replace("-- ", ""), [ selectedText ]), handleMouseDown = useCallback(e => {
-        disabled && e.preventDefault(), handleFocus();
-    }, [ disabled, handleFocus ]), handleSelectChange = useCallback(e => {
+        disabled && e.preventDefault();
+    }, [ disabled ]), handleSelectChange = useCallback(e => {
         handleChange(e.target.selectedIndex);
-    }, [ handleChange ]), getSize = useCallback(value => "string" == typeof value ? value : `${value}px`, []), cssVars = useMemo(() => ({
-        "--dd-gap": `${gap}px`,
-        "--dd-height": `${getSize(height)}`,
-        "--dd-width": `${getSize(width)}`,
+    }, [ handleChange ]), setTextColor = useMemo(() => disabled ? "var(--core-text-disabled)" : placeholder && 0 === index ? "var(--core-text-tertiary)" : textColor, [ disabled, placeholder, index, textColor ]), setLabelColor = useMemo(() => disabled ? "var(--core-text-disabled)" : labelColor, [ disabled, labelColor ]), setIconColor = useMemo(() => disabled ? "var(--core-text-disabled)" : iconColor, [ disabled, iconColor ]);
+    useMemo(() => disabled ? "var(--core-outline-primary)" : error ? "var(--feedback-warning)" : borderColor, [ disabled, error, borderColor ]);
+    const setPadding = useMemo(() => "box" === borderStyle ? `${setStyle(paddingTop)} ${setStyle(paddingRight)} ${setStyle(paddingBottom)} ${setStyle(paddingLeft)}` : `0 0 ${setStyle(paddingBottom)} 0`, [ paddingTop, paddingRight, paddingBottom, paddingLeft, borderStyle ]), setBorder = useMemo(() => "box" === borderStyle ? `${setStyle(resolvedBorderWidth)} solid ${setStyle(borderColor)}` : "unset", [ resolvedBorderWidth, borderColor, borderStyle ]), setBorderBottom = useMemo(() => "none" !== borderStyle ? `${setStyle(resolvedBorderWidth)} solid ${setStyle(borderColor)}` : "unset", [ resolvedBorderWidth, borderColor, borderStyle ]), setBorderRadius = useMemo(() => "box" !== borderStyle ? 0 : `${borderRadius}px`, [ borderStyle, borderRadius ]), cssVars = useMemo(() => ({
+        "--dd-gap": setStyle(gap),
+        "--dd-height": setStyle(height),
+        "--dd-width": setStyle(width),
         "--dd-margin": "8px",
-        "--dd-border-radius": borderRadius ? `${borderRadius}px` : "4px",
-        "--dd-box-shadow-size": unframed ? "0" : "1px",
-        "--dd-border-color": unframed ? "transparent" : "var(--core-outline-primary)",
-        "--dd-bg-color": null != bgColor ? bgColor : "transparent",
-        "--dd-padding-left": unframed ? "0" : `${getSize(paddingLeft)}`,
-        "--dd-padding-right": unframed ? "0" : `${getSize(paddingRight)}`,
-        "--dd-padding-tops": unframed ? "0" : `${getSize(paddingTops)}`,
+        "--dd-border-radius": setBorderRadius,
+        "--dd-border": setBorder,
+        "--dd-border-bottom": setBorderBottom,
+        "--dd-color": setTextColor,
+        "--dd-bg-color": null != resolvedBackgroundColor ? resolvedBackgroundColor : "transparent",
+        "--dd-padding": setPadding,
         "--dd-icon-size": `${iconSize}px`,
-        "--dd-color": placeholder && 0 === index ? "var(--core-text-tertiary)" : "var(--core-text-primary)"
-    }), [ gap, height, width, borderRadius, bgColor, paddingLeft, paddingRight, paddingTops, unframed, placeholder, iconSize, index, getSize ]);
+        "--dd-label-color": setLabelColor
+    }), [ gap, height, width, setBorderRadius, setBorder, setBorderBottom, setTextColor, resolvedBackgroundColor, setPadding, setLabelColor, iconSize ]);
     return jsxs("div", Object.assign({
         id: divId,
         className: `${css.wrapper}${divClass}`,
         style: Object.assign(Object.assign({}, divStyle), cssVars)
     }, rest, {
         children: [ jsx("div", {
+            className: `${css.label} ${css[size]}`,
+            children: label
+        }), jsx("div", {
             className: `${css.face} ${css[size]}`,
             children: displayText
         }), jsx("div", {
@@ -94,21 +89,23 @@ const DropDown = React.memo(props => {
             children: jsx(Icon, {
                 name: "chevron down",
                 size: iconSize,
-                strokeColor: color
+                strokeColor: setIconColor
             })
         }), jsx("select", {
             className: css.select,
-            defaultValue: index,
+            value: index,
             ref: ref,
-            onFocus: handleFocus,
             onMouseDown: handleMouseDown,
             onChange: handleSelectChange,
             "aria-label": name,
             children: renderedOptions
         }) ]
     }));
-});
+}
+
+styleInject(".flexBox-module_row__z24tF {\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__5FEvi {\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__4tcxS {\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__rVdVm {\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__ezvMq {\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__C7P44 {\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__PKcrG {\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__ERfp7 {\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__lLJuc {\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__ZAFft {\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__s3KvF {\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__Lhqqq {\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__vRHSP {\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__tjdFc {\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__Iy-VX {\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__LuQBA {\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__uW1on {\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__UBcvQ {\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__lOYbg {\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__BqRC7 {\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__Fh2dt {\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__pF2kC {\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__BeyrH {\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__Ruknj {\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__z8L3G {\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__0O3g6 {\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__KXxEB {\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__cJeEA {\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__eRe05 {\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__Xmwtf {\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__5q1m3 {\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__k9VFV {\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.DropDown-module_wrapper__CyX0u {\n\tposition: relative;\n\tpadding: var(--dd-padding) !important;\n\tgap: var(--dd-gap);\n\tmin-width: var(--dd-width);\n\twidth: var(--dd-width);\n\tborder-radius: var(--dd-border-radius);\n\tbackground-color: var(--dd-bg-color);\n\tborder: var(--dd-border);\n\tborder-bottom: var(--dd-border-bottom);\n\ttransition: all var(--motion-water-duration) var(--motion-water) 0s;\n}\n\n.DropDown-module_face__6gyF3 {\n\tflex: 1;\n\toverflow: hidden;\n\tdisplay: -webkit-box;\n\twhite-space: nowrap;\n\t-webkit-line-clamp: 1;\n\t-webkit-box-orient: vertical;\n\ttext-overflow: ellipsis;\n\tword-break: break-all;\n\tcolor: var(--dd-color);\n\tline-height: 1em;\n}\n\n.DropDown-module_label__Mrwbp {\n\twidth: min-content;\n\toverflow: hidden;\n\twhite-space: nowrap;\n\ttext-overflow: ellipsis;\n\tcolor: var(--dd-label-color);\n}\n\n.DropDown-module_xs__7L71q {\n}\n\n.DropDown-module_s__vAxXD {\n}\n\n.DropDown-module_m__K6JPk {\n}\n\n.DropDown-module_l__Kib48 {\n}\n\n.DropDown-module_chevron__LkYsE {\n\tmin-height: var(--dd-icon-size);\n\tmax-height: var(--dd-icon-size);\n\tmin-width: var(--dd-icon-size);\n\tmax-width: var(--dd-icon-size);\n}\n\n.DropDown-module_select__mzNnv {\n\tposition: absolute;\n\topacity: 0;\n\twidth: 100%;\n\theight: 100%;\n\tfont-size: 14px;\n\tbackground-color: #1f99cd;\n\tbackground-position: right 10px center;\n\tbackground-repeat: no-repeat;\n\tbackground-size: auto 50%;\n\tborder: none;\n\toutline: none;\n\t-moz-appearance: none;\n\t-webkit-appearance: none;\n\tappearance: none;\n\t&::-ms-expand {\n\t\tdisplay: none;\n\t}\n}\n"), 
+DropDownComponent.displayName = "DropDown";
 
-DropDown.displayName = "DropDown";
+const DropDown = React.memo(DropDownComponent);
 
 export { DropDown as D };

package/dist/esm/chunks/{ErrorSummary-S0shes-m.mjs → ErrorSummary-CHLkvdHk.mjs}

@@ -1,19 +1,37 @@
 import { _ as __rest } from "./tslib.es6-c-7TIv71.mjs";
 
-import { jsxs, jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 
 import { AnimatePresence, motion } from "motion/react";
 
-import React, { useMemo } from "react";
+import React, { useMemo, useCallback } from "react";
+
+import { useTheme } from "../hooks/useTheme.mjs";
+
+import "../theme/colors.mjs";
+
+import "../hooks/useWindow.mjs";
+
+import { a as addOpacity } from "./colors-FQ0uNQcW.mjs";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 
-var css_errorBox = "ErrorSummary-module_errorBox__hjY50 flexBox-module_columnStart__C7P44 type-module_body-m-regular__LuQBA", css_error = "ErrorSummary-module_error__QX1mr flexBox-module_columnStart__C7P44", css_p = "ErrorSummary-module_p__N-2Po type-module_body-m-regular__LuQBA", css_strong = "ErrorSummary-module_strong__UznWz type-module_body-m-bold__UBcvQ", css_ul = "ErrorSummary-module_ul__Xv0K7", css_li = "ErrorSummary-module_li__0ciEx type-module_body-m-regular__LuQBA";
+var css = {
+    errorBox: "ErrorSummary-module_errorBox__hjY50 flexBox-module_columnStart__C7P44",
+    error: "ErrorSummary-module_error__QX1mr flexBox-module_columnStart__C7P44",
+    p: "ErrorSummary-module_p__N-2Po",
+    ul: "ErrorSummary-module_ul__Xv0K7",
+    li: "ErrorSummary-module_li__0ciEx",
+    xs: "ErrorSummary-module_xs__pTqMn type-module_body-xs-regular__ZAFft",
+    s: "ErrorSummary-module_s__u2sIP type-module_body-s-regular__vRHSP",
+    m: "ErrorSummary-module_m__-QyP- type-module_body-m-regular__LuQBA",
+    l: "ErrorSummary-module_l__bb1xZ type-module_body-l-regular__lOYbg"
+};
 
-styleInject(".flexBox-module_row__z24tF {\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__5FEvi {\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__4tcxS {\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__rVdVm {\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__ezvMq {\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__C7P44 {\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__PKcrG {\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__ERfp7 {\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__lLJuc {\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__ZAFft {\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__s3KvF {\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__Lhqqq {\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__vRHSP {\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__tjdFc {\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__Iy-VX {\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__LuQBA {\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__uW1on {\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__UBcvQ {\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__lOYbg {\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__BqRC7 {\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__Fh2dt {\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__pF2kC {\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__BeyrH {\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__Ruknj {\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__z8L3G {\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__0O3g6 {\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__KXxEB {\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__cJeEA {\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__eRe05 {\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__Xmwtf {\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__5q1m3 {\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__k9VFV {\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.ErrorSummary-module_errorBox__hjY50 {\n\twidth: 100%;\n\tbackground: var(--core-surface-secondary);\n\tcolor: var(--feedback-warning);\n\tborder: 1px solid var(--feedback-warning);\n\tborder-radius: 4px;\n\tpadding: 0 16px 16px 16px !important;\n\toverflow: hidden;\n\tmargin-bottom: 44px !important;\n}\n\n.ErrorSummary-module_error__QX1mr {\n\twidth: 100%;\n}\n\n.ErrorSummary-module_p__N-2Po {\n\tmargin: 0;\n\tpadding: 16px 0 0 0;\n}\n\n.ErrorSummary-module_strong__UznWz {\n}\n\n.ErrorSummary-module_ul__Xv0K7 {\n\tlist-style-type: none;\n\tlist-style-position: outside;\n\tmargin: 0;\n\tpadding: 0;\n}\n\n.ErrorSummary-module_li__0ciEx {\n\tmargin: 3px 0 3px 0;\n\tline-height: 1.2em;\n\tpadding: 0;\n}\n");
+styleInject(".flexBox-module_row__z24tF {\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__5FEvi {\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__4tcxS {\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__rVdVm {\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__ezvMq {\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__C7P44 {\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__PKcrG {\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__ERfp7 {\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__lLJuc {\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__ZAFft {\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__s3KvF {\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__Lhqqq {\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__vRHSP {\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__tjdFc {\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__Iy-VX {\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__LuQBA {\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__uW1on {\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__UBcvQ {\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__lOYbg {\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__BqRC7 {\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__Fh2dt {\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__pF2kC {\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__BeyrH {\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__Ruknj {\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__z8L3G {\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__0O3g6 {\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__KXxEB {\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__cJeEA {\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__eRe05 {\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__Xmwtf {\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__5q1m3 {\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__k9VFV {\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.ErrorSummary-module_errorBox__hjY50 {\n\twidth: 100%;\n\tbackground: var(--error-bg-color);\n\tborder: 1px solid var(--error-text-color);\n\tborder-radius: 4px;\n\tpadding: 16px !important;\n\toverflow: hidden;\n\tgap: 0;\n}\n\n.ErrorSummary-module_error__QX1mr {\n\twidth: 100%;\n\tmargin: 0 !important;\n\tpadding: 0 !important;\n\tmargin-bottom: 4px !important;\n\t&:last-child {\n\t\tmargin-bottom: 0 !important;\n\t}\n}\n\n.ErrorSummary-module_p__N-2Po {\n\tmargin: 0 !important;\n\tpadding: 0 !important;\n\tcolor: var(--error-text-color) !important;\n}\n\n.ErrorSummary-module_ul__Xv0K7 {\n\tpadding: 0 !important;\n\tmargin: 0 !important;\n}\n\n.ErrorSummary-module_li__0ciEx {\n\tcolor: var(--error-text-color) !important;\n\tline-height: 1.5em !important;\n\tpadding: 0;\n}\n\n.ErrorSummary-module_xs__pTqMn {\n\tfont-size: var(--font-size-xs) !important;\n}\n\n.ErrorSummary-module_s__u2sIP {\n\tfont-size: var(--font-size-s) !important;\n}\n\n.ErrorSummary-module_m__-QyP- {\n\tfont-size: var(--font-size-m) !important;\n}\n\n.ErrorSummary-module_l__bb1xZ {\n\tfont-size: var(--font-size-l) !important;\n}\n");
 
 const ErrorSummary = React.memo(props => {
-    const {entries: entries, errors: errors = []} = props, divAttributes = __rest(props, [ "entries", "errors" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", variants = useMemo(() => ({
+    const {current: current} = useTheme(), warning = current.colors["feedback-warning"], bg = addOpacity(warning, .1), {entries: entries, textSize: textSize = "m", textColor: textColor = warning, backgroundColor: backgroundColor, bgColor: bgColor = bg, autoNumber: autoNumber = !0} = props, divAttributes = __rest(props, [ "entries", "textSize", "textColor", "backgroundColor", "bgColor", "autoNumber" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, variants = useMemo(() => ({
         enter: {
             opacity: 0,
             maxHeight: 0
@@ -29,31 +47,38 @@ const ErrorSummary = React.memo(props => {
     }), []), transition = useMemo(() => ({
         ease: "easeInOut",
         duration: .25
-    }), []), renderedErrors = useMemo(() => entries ? entries.map((error, index) => {
-        var _a;
-        return errors.includes(index) || errors.includes(error.id) ? jsxs("div", {
-            className: css_error,
-            children: [ jsx("p", {
-                className: css_p,
-                children: jsx("strong", {
-                    className: css_strong,
-                    children: error.title
-                })
-            }), jsx("ul", {
-                className: css_ul,
-                children: null === (_a = error.bullets) || void 0 === _a ? void 0 : _a.map((bullet, index) => jsx("li", {
-                    className: css_li,
-                    children: bullet
-                }, `${error.title}_bullet_${index}`))
-            }) ]
-        }, `${error.id}_${index}`) : null;
-    }) : null, [ entries, errors ]);
+    }), []), renderMessages = useCallback(messages => messages ? messages.map(message => jsx("li", {
+        className: `${css.li} ${css[textSize]}`,
+        children: message
+    }, message)) : null, [ textSize ]), renderedErrors = useMemo(() => {
+        if (!entries) return null;
+        const addNumbers = autoNumber && entries.length > 1;
+        return entries.map((error, index) => {
+            let messages;
+            error.message && (messages = Array.isArray(error.message) ? error.message : [ error.message ]);
+            return jsxs("div", {
+                className: css.error,
+                children: [ jsx("p", {
+                    className: `${css.p} ${css[textSize]}`,
+                    children: jsx("strong", {
+                        children: `${addNumbers ? `${index + 1}. ` : ""}${error.title}`
+                    })
+                }), messages && jsx("ul", {
+                    className: css.ul,
+                    children: renderMessages(messages)
+                }) ]
+            }, `${error.title}_${index}`);
+        });
+    }, [ entries, autoNumber, renderMessages, textSize ]), cssVars = useMemo(() => ({
+        "--error-text-color": textColor,
+        "--error-bg-color": resolvedBackgroundColor
+    }), [ textColor, resolvedBackgroundColor ]);
     return jsx(AnimatePresence, {
         initial: !1,
-        children: entries && errors && errors.length > 0 && jsx(motion.div, Object.assign({
+        children: entries && entries.length > 0 && jsx(motion.div, Object.assign({
             id: divId,
-            className: `${css_errorBox}${divClass}`,
-            style: divStyle,
+            className: `${css.errorBox}${divClass}`,
+            style: Object.assign(Object.assign({}, divStyle), cssVars),
             initial: "enter",
             animate: "animate",
             exit: "exit",

package/dist/esm/chunks/{FileList-Ckix8gUY.mjs → FileList-5LElsgoE.mjs}

@@ -8,9 +8,9 @@ import { s as setStyle, a as accessibleKeyDown } from "./misc-N8KLjOXc.mjs";
 
 import { F as FileIcon } from "./FileIcon-ePouoJpT.mjs";
 
-import { I as Icon } from "./Icon-C92f63Ib.mjs";
+import { I as Icon } from "./Icon-CUSQtytG.mjs";
 
-import { P as ProgressIndicator } from "./ProgressIndicator-CfM2c4ty.mjs";
+import { P as ProgressIndicator } from "./ProgressIndicator-D7paCpgY.mjs";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 
@@ -46,7 +46,7 @@ function displayClose(uploading) {
 styleInject('.flexBox-module_row__z24tF {\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__5FEvi {\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__4tcxS {\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__rVdVm {\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__ezvMq {\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__C7P44 {\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__PKcrG {\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__ERfp7 {\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__lLJuc {\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__ZAFft {\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__s3KvF {\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__Lhqqq {\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__vRHSP {\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__tjdFc {\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__Iy-VX {\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__LuQBA {\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__uW1on {\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__UBcvQ {\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__lOYbg {\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__BqRC7 {\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__Fh2dt {\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__pF2kC {\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__BeyrH {\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__Ruknj {\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__z8L3G {\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__0O3g6 {\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__KXxEB {\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__cJeEA {\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__eRe05 {\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__Xmwtf {\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__5q1m3 {\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__k9VFV {\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.FileList-module_wrapper__9-rrl {\n\twidth: 100%;\n\toverflow: hidden;\n\tflex-wrap: var(--file-wrap);\n\tflex-direction: var(--file-direction) !important;\n\talign-items: flex-start !important;\n\tgap: var(--file-gap);\n\tuser-select: none;\n\t-webkit-user-select: none;\n}\n\n.FileList-module_file__61dkh {\n\tposition: relative;\n\tpadding: var(--file-padding) !important;\n\tborder: 1px solid var(--file-border-color);\n\tborder-radius: 4px;\n\toverflow: hidden;\n\tmin-height: max-content;\n\tmax-width: var(--file-max-width);\n\tmin-width: var(--file-min-width);\n\tcolor: var(--core-text-primary);\n\tbackground: transparent;\n\tgap: 4px;\n}\n\n/* file progress bar */\n.FileList-module_file__61dkh::before {\n\tcontent: "";\n\tposition: absolute;\n\tbackground: var(--file-bg-color);\n\ttop: 0;\n\tbottom: 0;\n\tleft: 0;\n\twidth: var(--file-progress);\n\ttransition: width var(--motion-water-duration) var(--motion-water) 0s;\n\tz-index: 1;\n}\n\n.FileList-module_fileName__amame {\n\twidth: 100%;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n\tword-break: break-all;\n\tdisplay: -webkit-box !important;\n\t-webkit-line-clamp: 1;\n\t-webkit-box-orient: vertical;\n\tz-index: 2;\n}\n\n.FileList-module_meta__unbpG {\n\tflex: 1;\n\tmin-width: 0;\n\tgap: 2px;\n\tz-index: 2;\n}\n\n.FileList-module_status__H1s6f {\n\tcolor: var(--core-text-secondary);\n\tline-height: 1.2;\n}\n\n.FileList-module_error__UZ4-T {\n\tcolor: var(--feedback-warning);\n}\n\n.FileList-module_fileIcon__xDWW8 {\n\tmin-width: var(--file-icon-size);\n\tmin-height: var(--file-icon-size);\n\tmax-width: var(--file-icon-size);\n\tmax-height: var(--file-icon-size);\n\tz-index: 2;\n}\n\n.FileList-module_icon__JR0HE {\n\tmargin-left: 4px !important;\n\tmin-width: 20px;\n\tmin-height: 20px;\n\tmax-width: 20px;\n\tmax-height: 20px;\n\tcursor: pointer;\n\tz-index: 2;\n}\n\n.FileList-module_xs__i2S-5 {\n}\n\n.FileList-module_s__4q0ae {\n}\n\n.FileList-module_m__hWqBx {\n}\n\n.FileList-module_l__tHDNp {\n}\n\n.FileList-module_xl__fxW11 {\n}\n');
 
 const FileList = React.memo(props => {
-    const {files: files = [], onChange: onChange, onToolTip: onToolTip, maxWidth: maxWidth, minWidth: minWidth, direction: direction = "row", padding: padding, gap: gap = 10, size: size = "s", iconSize: iconSize = 24, bgColor: bgColor, canRemove: canRemove = !0} = props, divAttributes = __rest(props, [ "files", "onChange", "onToolTip", "maxWidth", "minWidth", "direction", "padding", "gap", "size", "iconSize", "bgColor", "canRemove" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", fileNameToFileItem = useCallback(fileName => {
+    const {files: files = [], onChange: onChange, onToolTip: onToolTip, maxWidth: maxWidth, minWidth: minWidth, direction: direction = "row", padding: padding, gap: gap = 10, size: size = "s", iconSize: iconSize = 24, backgroundColor: backgroundColor, bgColor: bgColor, canRemove: canRemove = !0} = props, divAttributes = __rest(props, [ "files", "onChange", "onToolTip", "maxWidth", "minWidth", "direction", "padding", "gap", "size", "iconSize", "backgroundColor", "bgColor", "canRemove" ]), {id: divId, className: className, style: style} = divAttributes, rest = __rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", resolvedBackgroundColor = null != backgroundColor ? backgroundColor : bgColor, fileNameToFileItem = useCallback(fileName => {
         const {ext: ext, name: name} = function(fileName) {
             var _a;
             const ext = null !== (_a = fileName.split(".").pop()) && void 0 !== _a ? _a : "unknown";
@@ -165,8 +165,8 @@ const FileList = React.memo(props => {
         "--file-padding": padding ? setStyle(padding) : "4px 4px 4px 2px",
         "--file-icon-size": setStyle(iconSize),
         "--file-overflow": "column" === direction ? "unset" : "hidden",
-        "--file-bg-color": null != bgColor ? bgColor : "var(--core-surface-secondary)"
-    }), [ maxWidth, gap, direction, minWidth, padding, iconSize, bgColor ]), fileCSSVars = useCallback((progress, error) => ({
+        "--file-bg-color": null != resolvedBackgroundColor ? resolvedBackgroundColor : "var(--core-surface-secondary)"
+    }), [ maxWidth, gap, direction, minWidth, padding, iconSize, resolvedBackgroundColor ]), fileCSSVars = useCallback((progress, error) => ({
         "--file-progress": `${progress}`,
         "--file-border-color": error ? "var(--feedback-warning)" : "var(--core-outline-primary)"
     }), []);

package/dist/esm/chunks/{Grouper-B_FutfjV.mjs → Grouper-DR14qDXP.mjs}

@@ -14,7 +14,7 @@ import "../hooks/useWindow.mjs";
 
 import { B as Badge } from "./Badge-DyICxZP2.mjs";
 
-import { I as Icon } from "./Icon-C92f63Ib.mjs";
+import { I as Icon } from "./Icon-CUSQtytG.mjs";
 
 import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 

package/dist/esm/chunks/{Icon-C92f63Ib.mjs → Icon-CUSQtytG.mjs}

@@ -16,7 +16,7 @@ import { s as styleInject } from "./style-inject.es-D0BjEaN8.mjs";
 
 var css_icon = "Icon-module_icon__szG-X";
 
-styleInject(".Icon-module_icon__szG-X {\n\tcursor: var(--cursor);\n\tuser-select: none;\n\t--webkit-user-select: none;\n\t-webkit-tap-highlight-color: transparent;\n\toutline: none;\n\tborder: 0;\n\ttransition: stroke, fill var(--motion-water-duration) var(--motion-water);\n}\n\npath,\ncircle,\nrect,\npolyline,\npolygon,\nline {\n\ttransition: stroke, fill var(--motion-water-duration) var(--motion-water);\n}\n");
+styleInject(".Icon-module_icon__szG-X {\n\tcursor: var(--cursor);\n\tuser-select: none;\n\tpointer-events: var(--pointer-events);\n\t--webkit-user-select: none;\n\t-webkit-tap-highlight-color: transparent;\n\toutline: none;\n\tborder: 0;\n\ttransition: stroke, fill var(--motion-water-duration) var(--motion-water);\n}\n\npath,\ncircle,\nrect,\npolyline,\npolygon,\nline {\n\ttransition: stroke, fill var(--motion-water-duration) var(--motion-water);\n}\n");
 
 /**
  * Static icon registry created once at module load.
@@ -1086,9 +1086,10 @@ const STATIC_ICON_REGISTRY = new Map([ [ "target", {
     })
 } ] ]), Icon = React.memo(props => {
     var _a;
-    const theme = useTheme(), {name: name = "home", size: size = 20, stroke: stroke = 1.5, strokeColor: strokeColor = theme.current.colors["core-icon-primary"], fillColor: fillColor = "transparent", coverUp: coverUp = theme.current.colors["core-surface-primary"], toggle: toggle = !1, pointer: pointer = !1, disabled: disabled = !1, onClick: onClick = () => null} = props, svgAttributes = __rest(props, [ "name", "size", "stroke", "strokeColor", "fillColor", "coverUp", "toggle", "pointer", "disabled", "onClick" ]), {id: svgId, className: className, style: style} = svgAttributes, rest = __rest(svgAttributes, [ "id", "className", "style" ]), svgStyle = null != style ? style : {}, variantKey = toggle ? "lineOn" : "line", iconVariant = STATIC_ICON_REGISTRY.get(name), shape = null !== (_a = null == iconVariant ? void 0 : iconVariant[variantKey]) && void 0 !== _a ? _a : null == iconVariant ? void 0 : iconVariant.line, cursor = useMemo(() => disabled ? "default" : pointer ? "pointer" : "inherit", [ disabled, pointer ]), iconStyle = useMemo(() => ({
-        "--cursor": cursor
-    }), [ cursor ]), handleKeyActivate = useMemo(() => () => onClick(void 0), [ onClick ]);
+    const theme = useTheme(), {name: name = "home", size: size = 20, stroke: stroke = 1.5, strokeColor: strokeColor = theme.current.colors["core-icon-primary"], fillColor: fillColor = "transparent", coverUp: coverUp = theme.current.colors["core-surface-primary"], toggle: toggle = !1, pointer: pointer = !1, disabled: disabled = !1, onClick: onClick} = props, svgAttributes = __rest(props, [ "name", "size", "stroke", "strokeColor", "fillColor", "coverUp", "toggle", "pointer", "disabled", "onClick" ]), {id: svgId, className: className, style: style} = svgAttributes, rest = __rest(svgAttributes, [ "id", "className", "style" ]), svgStyle = null != style ? style : {}, variantKey = toggle ? "lineOn" : "line", iconVariant = STATIC_ICON_REGISTRY.get(name), shape = null !== (_a = null == iconVariant ? void 0 : iconVariant[variantKey]) && void 0 !== _a ? _a : null == iconVariant ? void 0 : iconVariant.line, cursor = useMemo(() => disabled ? "default" : pointer ? "pointer" : "inherit", [ disabled, pointer ]), iconStyle = useMemo(() => ({
+        "--cursor": cursor,
+        "--pointer-events": onClick ? "auto" : "none"
+    }), [ cursor, onClick ]), handleKeyActivate = useMemo(() => () => null == onClick ? void 0 : onClick(void 0), [ onClick ]);
     return shape ? jsxs("svg", Object.assign({
         id: svgId,
         className: `${css_icon} ${className}`,
@@ -1097,7 +1098,7 @@ const STATIC_ICON_REGISTRY = new Map([ [ "target", {
         height: size,
         viewBox: "0 0 20 20",
         style: Object.assign(Object.assign({}, svgStyle), iconStyle),
-        onClick: e => onClick(e),
+        onClick: e => null == onClick ? void 0 : onClick(e),
         fill: fillColor,
         role: "img",
         "aria-label": `${name} icon`,