@jars-labs/jars-components 1.0.80 → 1.1.0

package/dist/{index-Di2CTm6m.js → index-Dpa5RAiC.js}

@@ -1,5 +1,5 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Accordion as Accordion$1, AccordionItem as AccordionItem$1, AccordionControl as AccordionControl$1, AccordionPanel as AccordionPanel$1, ActionIcon as ActionIcon$1, Group, Combobox, useCombobox, Flex, TextInput, Loader as Loader$1, Checkbox as Checkbox$1, Menu as Menu$1, Divider, Modal as Modal$1, Tooltip as Tooltip$1, Box, Tabs as Tabs$1, Pagination as Pagination$1, Radio, SegmentedControl as SegmentedControl$1, Select as Select$1, Stepper as Stepper$1, StepperStep, Progress, Table as Table$1, Textarea as Textarea$1 } from '@mantine/core';
+import { Accordion as Accordion$1, AccordionItem as AccordionItem$1, AccordionControl as AccordionControl$1, AccordionPanel as AccordionPanel$1, ActionIcon as ActionIcon$1, Group, Combobox, useCombobox, Flex, TextInput, Loader as Loader$1, Avatar as Avatar$1, Checkbox as Checkbox$1, Menu as Menu$1, Divider, Modal as Modal$1, Tooltip as Tooltip$1, Box, Tabs as Tabs$1, Pagination as Pagination$1, Radio, SegmentedControl as SegmentedControl$1, Select as Select$1, Stepper as Stepper$1, StepperStep, Progress, Table as Table$1, Textarea as Textarea$1 } from '@mantine/core';
 import React, { useRef, useState, useEffect, forwardRef, useMemo, useLayoutEffect } from 'react';
 import { DateInput as DateInput$1 } from '@mantine/dates';
 import { ToastContainer as ToastContainer$1 } from 'react-toastify';
@@ -59,14 +59,14 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-var styles$p = {"accordion":"Accordion-module_accordion__Nl0Vb","item":"Accordion-module_item__85Qrt","item-neutral":"Accordion-module_item-neutral__c06SU","item-white":"Accordion-module_item-white__l-DtA","chevron":"Accordion-module_chevron__kqKKx","bottom-right":"Accordion-module_bottom-right__2C-t6","control":"Accordion-module_control__92uvC","content":"Accordion-module_content__LkKAo","label":"Accordion-module_label__VkyEF"};
+var styles$r = {"accordion":"Accordion-module_accordion__Nl0Vb","item":"Accordion-module_item__85Qrt","item-neutral":"Accordion-module_item-neutral__c06SU","item-white":"Accordion-module_item-white__l-DtA","chevron":"Accordion-module_chevron__kqKKx","bottom-right":"Accordion-module_bottom-right__2C-t6","control":"Accordion-module_control__92uvC","content":"Accordion-module_content__LkKAo","label":"Accordion-module_label__VkyEF"};
 
 var serverSideRenderSVG = function (_a, children) {
     var width = _a.width, height = _a.height, viewBox = _a.viewBox, fill = _a.fill, rotate = _a.rotate;
     return (jsx("svg", { width: width, height: height, viewBox: viewBox, fill: fill, preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg", transform: "rotate(".concat(rotate, ")"), children: children }));
 };
 var Icon = function (_a) {
-    var _b = _a.width, width = _b === undefined ? '32px' : _b, _c = _a.height, height = _c === undefined ? '32px' : _c, viewBox = _a.viewBox, _d = _a.fill, fill = _d === undefined ? 'none' : _d, _e = _a.stroke, stroke = _e === undefined ? 'currentColor' : _e, _f = _a.rotate, rotate = _f === undefined ? 0 : _f, _g = _a.style, style = _g === undefined ? {} : _g, children = _a.children;
+    var _b = _a.width, width = _b === undefined ? '32px' : _b, _c = _a.height, height = _c === undefined ? '32px' : _c, viewBox = _a.viewBox, _d = _a.fill, fill = _d === undefined ? 'none' : _d, _e = _a.stroke, stroke = _e === undefined ? 'currentColor' : _e, _f = _a.rotate, rotate = _f === undefined ? 0 : _f, _g = _a.style, style = _g === undefined ? {} : _g, children = _a.children, rest = __rest(_a, ["width", "height", "viewBox", "fill", "stroke", "rotate", "style", "children"]);
     if (typeof window === 'undefined') {
         serverSideRenderSVG({
             width: width,
@@ -108,7 +108,7 @@ var Icon = function (_a) {
         };
         centerSvgInViewBox();
     }, [viewBox]);
-    return (jsx("svg", { ref: svgRef, width: width, height: height, viewBox: viewBox, fill: fill, stroke: stroke, preserveAspectRatio: "xMidYMid meet", style: __assign(__assign({}, style), { transform: "rotate(".concat(rotate, "deg)"), transformOrigin: 'center' }), children: jsx("g", { transform: transform || undefined, children: children }) }));
+    return (jsx("svg", __assign({ ref: svgRef, width: width, height: height, viewBox: viewBox, fill: fill, stroke: stroke, preserveAspectRatio: "xMidYMid meet", style: __assign(__assign({}, style), { transform: "rotate(".concat(rotate, "deg)"), transformOrigin: 'center' }) }, rest, { children: jsx("g", { transform: transform || undefined, children: children }) })));
 };
 Icon.displayName = 'Icon';
 
@@ -131,30 +131,30 @@ var Accordion = function (_a) {
         return child;
     });
     return (jsx(Accordion$1, { variant: "unstyled", chevron: jsx(Chevron, { rotate: 270, width: "24px", height: "24px" }), chevronSize: 24, classNames: {
-            root: styles$p.accordion,
-            chevron: "".concat(styles$p.chevron, " ").concat(styles$p[customChevronPosition]),
+            root: styles$r.accordion,
+            chevron: "".concat(styles$r.chevron, " ").concat(styles$r[customChevronPosition]),
         }, multiple: true, children: childrenWithColor }));
 };
 Accordion.displayName = 'Accordion';
 var AccordionItem = function (_a) {
     var children = _a.children, value = _a.value, _b = _a.bgColor, bgColor = _b === undefined ? 'neutral' : _b, props = __rest(_a, ["children", "value", "bgColor"]);
     return (jsx(AccordionItem$1, __assign({ classNames: {
-            item: "".concat(styles$p.item, " ").concat(bgColor === 'white' ? styles$p['item-white'] : styles$p['item-neutral']),
+            item: "".concat(styles$r.item, " ").concat(bgColor === 'white' ? styles$r['item-white'] : styles$r['item-neutral']),
         }, value: value }, props, { children: children })));
 };
 AccordionItem.displayName = 'AccordionItem';
 var AccordionControl = function (_a) {
     var children = _a.children;
-    return (jsx(AccordionControl$1, { classNames: { label: styles$p.label, control: styles$p.control }, children: children }));
+    return (jsx(AccordionControl$1, { classNames: { label: styles$r.label, control: styles$r.control }, children: children }));
 };
 AccordionControl.displayName = 'AccordionControl';
 var AccordionPanel = function (_a) {
     var children = _a.children;
-    return (jsx(AccordionPanel$1, { classNames: { content: styles$p.content }, children: children }));
+    return (jsx(AccordionPanel$1, { classNames: { content: styles$r.content }, children: children }));
 };
 AccordionPanel.displayName = 'AccordionPanel';
 
-var styles$o = {"root":"ActionIcon-module_root__orJKP"};
+var styles$q = {"root":"ActionIcon-module_root__orJKP"};
 
 /**
  * ActionIcon component to display an icon with a clickable action.
@@ -173,7 +173,7 @@ var styles$o = {"root":"ActionIcon-module_root__orJKP"};
 var ActionIcon = forwardRef(function (_a, ref) {
     var onClick = _a.onClick, _b = _a.radius, radius = _b === undefined ? 'xl' : _b, _c = _a.color, color = _c === undefined ? 'var(--color-neutral-200)' : _c, _d = _a.variant, variant = _d === undefined ? 'filled' : _d, _e = _a.size, size = _e === undefined ? 'md' : _e, _f = _a.disabled, disabled = _f === undefined ? false : _f, children = _a.children, rest = __rest(_a, ["onClick", "radius", "color", "variant", "size", "disabled", "children"]);
     return (jsx(ActionIcon$1, __assign({ onClick: onClick && onClick, radius: radius, variant: variant, size: size, disabled: disabled, classNames: {
-            root: styles$o.root,
+            root: styles$q.root,
         }, color: color, ref: ref }, rest, { children: jsx(Group, { children: children }) })));
 });
 ActionIcon.displayName = 'ActionIcon';
@@ -183,7 +183,7 @@ var Animation = function (_a) {
     var refVector = useRef(null);
     var _b = useState(null), lottie = _b[0], setLottie = _b[1];
     useEffect(function () {
-        import('./lottie-CAeceDXT.js').then(function (n) { return n.l; }).then(function (Lottie) { return setLottie(Lottie.default); });
+        import('./lottie-DfsERZoD.js').then(function (n) { return n.l; }).then(function (Lottie) { return setLottie(Lottie.default); });
     }, []);
     useEffect(function () {
         if (lottie && refVector.current) {
@@ -201,7 +201,7 @@ var Animation = function (_a) {
 };
 Animation.displayName = 'Animation';
 
-var styles$n = {"dropdown":"Dropdown-module_dropdown__Pf3Aj","option":"Dropdown-module_option__5-7L7"};
+var styles$p = {"dropdown":"Dropdown-module_dropdown__Pf3Aj","option":"Dropdown-module_option__5-7L7"};
 
 /**
  *
@@ -241,7 +241,7 @@ var Dropdown = function (_a) {
                         store.selectOption(index);
                         onOptionSubmit === null || onOptionSubmit === undefined ? undefined : onOptionSubmit(option);
                         closeOnSelect && store.closeDropdown();
-                    }, className: styles$n.option, children: option }, index));
+                    }, className: styles$p.option, children: option }, index));
             }
             return option;
         });
@@ -249,7 +249,7 @@ var Dropdown = function (_a) {
     return (jsxs(Combobox, __assign({ store: store, onOptionSubmit: function (value) {
             onOptionSubmit === null || onOptionSubmit === undefined ? undefined : onOptionSubmit(value);
             closeOnSelect && store.closeDropdown();
-        } }, rest, { children: [jsx(Combobox.Target, { children: jsx(Flex, { w: "100%", children: typeof children === 'function' ? children(store) : children }) }), jsxs(Combobox.Dropdown, { classNames: { dropdown: styles$n.dropdown }, children: [jsx(Combobox.Options, { mah: maxHeight, style: { overflow: maxHeight ? 'auto' : 'unset' }, children: renderOptions(options, onOptionSubmit) }), footer && (jsx(Combobox.Footer, { children: typeof footer === 'function' ? footer(store) : footer }))] })] })));
+        } }, rest, { children: [jsx(Combobox.Target, { children: jsx(Flex, { w: "100%", children: typeof children === 'function' ? children(store) : children }) }), jsxs(Combobox.Dropdown, { classNames: { dropdown: styles$p.dropdown }, children: [jsx(Combobox.Options, { mah: maxHeight, style: { overflow: maxHeight ? 'auto' : 'unset' }, children: renderOptions(options, onOptionSubmit) }), footer && (jsx(Combobox.Footer, { children: typeof footer === 'function' ? footer(store) : footer }))] })] })));
 };
 Dropdown.displayName = 'Dropdown';
 Dropdown.Option = Combobox.Option;
@@ -358,7 +358,11 @@ function requireClassnames () {
 var classnamesExports = requireClassnames();
 var classNames = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
 
-var styles$m = {"container":"Input-module_container__zzWGm","input":"Input-module_input__aRXjR","inputError":"Input-module_inputError__s3cRz","inputLeftIcon":"Input-module_inputLeftIcon__gObSe","inputRightIcon":"Input-module_inputRightIcon__hWB1a","label":"Input-module_label__HtZ2L","labelFocused":"Input-module_labelFocused__3-p5R","labelError":"Input-module_labelError__MA8Ti","labelDisabled":"Input-module_labelDisabled__lhjNw","description":"Input-module_description__Q1Rbw","error":"Input-module_error__yiAgw","errorVisible":"Input-module_errorVisible__IS7J2","errorHidden":"Input-module_errorHidden__8-hAw","errorText":"Input-module_errorText__wKZ67","leftSection":"Input-module_leftSection__YyGeo","rightSection":"Input-module_rightSection__zMH-z"};
+var styles$o = {"container":"Input-module_container__zzWGm","input":"Input-module_input__aRXjR","inputError":"Input-module_inputError__s3cRz","inputLeftIcon":"Input-module_inputLeftIcon__gObSe","inputRightIcon":"Input-module_inputRightIcon__hWB1a","label":"Input-module_label__HtZ2L","labelFocused":"Input-module_labelFocused__3-p5R","labelError":"Input-module_labelError__MA8Ti","labelDisabled":"Input-module_labelDisabled__lhjNw","description":"Input-module_description__Q1Rbw","error":"Input-module_error__yiAgw","errorVisible":"Input-module_errorVisible__IS7J2","errorHidden":"Input-module_errorHidden__8-hAw","errorText":"Input-module_errorText__wKZ67","leftSection":"Input-module_leftSection__YyGeo","rightSection":"Input-module_rightSection__zMH-z"};
+
+var inputWrapperSlotElement = { component: 'div' };
+var inputDescriptionProps = __assign({ className: styles$o.description }, inputWrapperSlotElement);
+var inputErrorProps = __assign({ className: styles$o.error }, inputWrapperSlotElement);
 
 var Info = function (_a) {
     var width = _a.width, height = _a.height, viewBox = _a.viewBox, _b = _a.stroke, stroke = _b === undefined ? 'currentColor' : _b, _c = _a.strokeWidth, strokeWidth = _c === undefined ? 1.5 : _c;
@@ -366,7 +370,7 @@ var Info = function (_a) {
 };
 Info.displayName = 'Info';
 
-var styles$l = {"text":"Text-module_text__3xRq3","h1":"Text-module_h1__RkLfx","h2":"Text-module_h2__fAm7L","h3":"Text-module_h3__o11c2","h4":"Text-module_h4__RIwZg","m":"Text-module_m__nlfmp","s":"Text-module_s__t9q3d","xs":"Text-module_xs__ZU2jV","xxs":"Text-module_xxs__hmZHQ","bold":"Text-module_bold__N75tZ","medium":"Text-module_medium__Q8kf4","regular":"Text-module_regular__-EdPk"};
+var styles$n = {"text":"Text-module_text__3xRq3","h1":"Text-module_h1__RkLfx","h2":"Text-module_h2__fAm7L","h3":"Text-module_h3__o11c2","h4":"Text-module_h4__RIwZg","m":"Text-module_m__nlfmp","s":"Text-module_s__t9q3d","xs":"Text-module_xs__ZU2jV","xxs":"Text-module_xxs__hmZHQ","bold":"Text-module_bold__N75tZ","medium":"Text-module_medium__Q8kf4","regular":"Text-module_regular__-EdPk"};
 
 var elementType = {
     h1: 'h1',
@@ -377,7 +381,7 @@ var elementType = {
 var Text = React.forwardRef(function (props, ref) {
     var as = props.as, children = props.children, className = props.className, color = props.color, style = props.style, variant = props.variant, weight = props.weight, rest = __rest(props, ["as", "children", "className", "color", "style", "variant", "weight"]);
     var combinedStyle = __assign(__assign({}, style), { color: color });
-    var combinedClassName = classNames(className, styles$l['text'], styles$l[variant || ''], styles$l[weight || '']);
+    var combinedClassName = classNames(className, styles$n['text'], styles$n[variant || ''], styles$n[weight || '']);
     return React.createElement(as || elementType[variant] || 'p', __assign({ ref: ref, className: combinedClassName, style: combinedStyle }, rest), children);
 });
 Text.displayName = 'Text';
@@ -447,19 +451,19 @@ var Input = function (_a) {
     var showLabel = !hideLabel && (isFocused || value.trim());
     var placeHolderValue = placeholder && isFocused ? placeholder : (label !== null && label !== undefined ? label : placeholder);
     var ErrorSection = useMemo(function () {
-        return holdSpace && (jsxs(Flex, { className: classNames(styles$m.error, error ? styles$m.errorVisible : styles$m.errorHidden), gap: 4, ml: 0, style: { alignItems: 'flex-start' }, children: [jsx(Flex, { style: { flexShrink: 0 }, children: jsx(Info, { width: "18px", height: "18px", viewBox: "0 0 24 24", stroke: "var(--color-red-300)" }) }), jsx(Text, { variant: "xs", className: classNames(styles$m.errorText), as: "span", children: capitalizeFirstSentenceLetter(error) })] }));
+        return holdSpace && (jsxs(Flex, { className: classNames(styles$o.error, error ? styles$o.errorVisible : styles$o.errorHidden), gap: 4, ml: 0, style: { alignItems: 'flex-start' }, children: [jsx(Flex, { style: { flexShrink: 0 }, children: jsx(Info, { width: "18px", height: "18px", viewBox: "0 0 24 24", stroke: "var(--color-red-300)" }) }), jsx(Text, { variant: "xs", className: classNames(styles$o.errorText), as: "span", children: capitalizeFirstSentenceLetter(error) })] }));
     }, [error]);
-    return (jsxs("div", { className: styles$m.container, children: [showLabel && (jsx("label", { className: classNames(styles$m.label, (_b = {},
-                    _b[styles$m.labelError] = error && !isFocused,
-                    _b[styles$m.labelFocused] = isFocused || isHovered,
-                    _b[styles$m.labelDisabled] = disabled,
+    return (jsxs("div", { className: styles$o.container, children: [showLabel && (jsx("label", { className: classNames(styles$o.label, (_b = {},
+                    _b[styles$o.labelError] = error && !isFocused,
+                    _b[styles$o.labelFocused] = isFocused || isHovered,
+                    _b[styles$o.labelDisabled] = disabled,
                     _b)), children: label })), jsx("div", { onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onFocus: function () { return setIsFocused(true); }, onBlur: function () { return setIsFocused(false); }, children: jsx(TextInput, __assign({ classNames: {
-                        input: classNames(styles$m.input, (_c = {},
-                            _c[styles$m.inputLeftIcon] = leftSection,
-                            _c[styles$m.inputRightIcon] = rightSection,
-                            _c[styles$m.inputError] = error,
+                        input: classNames(styles$o.input, (_c = {},
+                            _c[styles$o.inputLeftIcon] = leftSection,
+                            _c[styles$o.inputRightIcon] = rightSection,
+                            _c[styles$o.inputError] = error,
                             _c)),
-                    }, placeholder: placeHolderValue, name: name, error: ErrorSection, description: !error && jsx(Text, { variant: "xs", children: description }), descriptionProps: { className: styles$m.description }, errorProps: { className: styles$m.error }, inputWrapperOrder: ['label', 'input', 'description', 'error'], value: value, onChange: onChange, leftSection: leftSection, rightSection: rightSection, leftSectionProps: { className: styles$m.leftSection }, rightSectionProps: { className: styles$m.rightSection }, type: type, disabled: disabled }, rest)) })] }));
+                    }, placeholder: placeHolderValue, name: name, error: ErrorSection, description: !error && jsx(Text, { variant: "xs", children: description }), descriptionProps: inputDescriptionProps, errorProps: inputErrorProps, inputWrapperOrder: ['label', 'input', 'description', 'error'], value: value, onChange: onChange, leftSection: leftSection, rightSection: rightSection, leftSectionProps: { className: styles$o.leftSection }, rightSectionProps: { className: styles$o.rightSection }, type: type, disabled: disabled }, rest)) })] }));
 };
 Input.displayName = 'Input';
 
@@ -544,12 +548,40 @@ var Autocomplete = function (_a) {
 };
 Autocomplete.displayName = 'Autocomplete';
 
+var styles$m = {"avatar":"Avatar-module_avatar__QJpdG","placeholder":"Avatar-module_placeholder__9AtPN"};
+
 var AvatarPlaceholder = function (_a) {
-    var width = _a.width, height = _a.height, viewBox = _a.viewBox, rotate = _a.rotate;
-    return (jsxs(Icon, { width: width, height: height, viewBox: viewBox, rotate: rotate, stroke: "none", children: [jsx("ellipse", { cx: "11.755", cy: "5.818", fill: "var(--color-tertiary-200)", rx: "5.878", ry: "5.818" }), jsx("path", { fill: "var(--color-primary-300)", d: "M24 24H12 0c0-6.56 5.373-11.879 12-11.879s12 5.319 12 11.88z" })] }));
+    var width = _a.width, height = _a.height, _b = _a.viewBox, viewBox = _b === undefined ? '0 0 24 24' : _b, rotate = _a.rotate, rest = __rest(_a, ["width", "height", "viewBox", "rotate"]);
+    return (jsxs(Icon, __assign({ stroke: "none", width: width, height: height, viewBox: viewBox, rotate: rotate }, rest, { children: [jsx("ellipse", { cx: "11.755", cy: "5.818", fill: "var(--color-tertiary-200)", rx: "5.878", ry: "5.818" }), jsx("path", { fill: "var(--color-primary-300)", d: "M24 24H12 0c0-6.56 5.373-11.879 12-11.879s12 5.319 12 11.88z" })] })));
 };
 AvatarPlaceholder.displayName = 'AvatarPlaceholder';
 
+var sizeMapping = {
+    small: '32px',
+    medium: '48px',
+    large: '112px',
+    extraLarge: '150px',
+};
+var placeholderSizeMapping = {
+    small: '14px',
+    medium: '22px',
+    large: '46px',
+    extraLarge: '60px',
+};
+var Avatar = function (_a) {
+    var src = _a.src, alt = _a.alt, _b = _a.size, size = _b === undefined ? 'medium' : _b, testId = _a.testId, rest = __rest(_a, ["src", "alt", "size", "testId"]);
+    return (jsx(Avatar$1, __assign({ src: src, alt: alt, "data-testid": testId, radius: "xl", variant: "outline", styles: {
+            root: {
+                minWidth: sizeMapping[size],
+                minHeight: sizeMapping[size],
+            },
+        }, classNames: {
+            root: styles$m.avatar,
+            placeholder: styles$m.placeholder,
+        } }, rest, { children: jsx(AvatarPlaceholder, { role: "img", "aria-label": alt, "data-testid": testId ? "".concat(testId, "-placeholder") : undefined, width: placeholderSizeMapping[size], height: placeholderSizeMapping[size] }) })));
+};
+Avatar.displayName = 'Avatar';
+
 var badgeVariantMap = {
     notes: {
         backgroundColor: 'var(--color-neutral-100)',
@@ -616,19 +648,19 @@ var Badge = forwardRef(function (_a, ref) {
 });
 Badge.displayName = 'Badge';
 
-var styles$k = {"button":"Button-module_button__7BLGt","label":"Button-module_label__447Ll","button-flex":"Button-module_button-flex__bzVRB","button--filled":"Button-module_button--filled__BKGu2","label-color--filled":"Button-module_label-color--filled__wJHlw","label-color--filled--disabled":"Button-module_label-color--filled--disabled__BbMbV","button--outlined":"Button-module_button--outlined__QZysw","label-color--outlined":"Button-module_label-color--outlined__seGi5","label-color--outlined--disabled":"Button-module_label-color--outlined--disabled__qXPjI","button--underlined":"Button-module_button--underlined__BsY5s","label-color--underlined":"Button-module_label-color--underlined__ymMfq","label-color--underlined--disabled":"Button-module_label-color--underlined--disabled__TBDd8","button--underlined-neutral":"Button-module_button--underlined-neutral__30A91","label-color--underlined-neutral":"Button-module_label-color--underlined-neutral__1xWMY","label-color--underlined-neutral--disabled":"Button-module_label-color--underlined-neutral--disabled__RQKW7","button--delete":"Button-module_button--delete__Xqpbl","label-color--delete":"Button-module_label-color--delete__iPB3X","label-color--delete--disabled":"Button-module_label-color--delete--disabled__lJkM6","button--small":"Button-module_button--small__3npYU","button--medium":"Button-module_button--medium__WRSIQ","button--large":"Button-module_button--large__bGVS1"};
+var styles$l = {"button":"Button-module_button__7BLGt","label":"Button-module_label__447Ll","button-flex":"Button-module_button-flex__bzVRB","button--filled":"Button-module_button--filled__BKGu2","label-color--filled":"Button-module_label-color--filled__wJHlw","label-color--filled--disabled":"Button-module_label-color--filled--disabled__BbMbV","button--outlined":"Button-module_button--outlined__QZysw","label-color--outlined":"Button-module_label-color--outlined__seGi5","label-color--outlined--disabled":"Button-module_label-color--outlined--disabled__qXPjI","button--underlined":"Button-module_button--underlined__BsY5s","label-color--underlined":"Button-module_label-color--underlined__ymMfq","label-color--underlined--disabled":"Button-module_label-color--underlined--disabled__TBDd8","button--underlined-neutral":"Button-module_button--underlined-neutral__30A91","label-color--underlined-neutral":"Button-module_label-color--underlined-neutral__1xWMY","label-color--underlined-neutral--disabled":"Button-module_label-color--underlined-neutral--disabled__RQKW7","button--delete":"Button-module_button--delete__Xqpbl","label-color--delete":"Button-module_label-color--delete__iPB3X","label-color--delete--disabled":"Button-module_label-color--delete--disabled__lJkM6","button--small":"Button-module_button--small__3npYU","button--medium":"Button-module_button--medium__WRSIQ","button--large":"Button-module_button--large__bGVS1"};
 
 var Button = forwardRef(function (_a, ref) {
     var _b;
     var _c = _a.variant, variant = _c === undefined ? 'filled' : _c, submit = _a.submit, _d = _a.size, size = _d === undefined ? 'medium' : _d, fullWidth = _a.fullWidth, backgroundColor = _a.backgroundColor, label = _a.label, icon = _a.icon, children = _a.children, props = __rest(_a, ["variant", "submit", "size", "fullWidth", "backgroundColor", "label", "icon", "children"]);
-    var mode = styles$k["button--".concat(variant)];
-    return (jsx("button", __assign({ ref: ref, type: submit ? 'submit' : 'button', style: __assign(__assign({}, props.style), { backgroundColor: backgroundColor, width: fullWidth ? '100%' : 'auto' }) }, props, { className: [styles$k.button, styles$k["button--".concat(size)], mode].join(' '), children: jsxs("div", { className: styles$k['button-flex'], children: [!!icon && icon, label ? (jsx(Text, { className: classNames(styles$k.label, styles$k["label-color--".concat(variant)], (_b = {},
-                        _b[styles$k["label-color--".concat(variant, "--disabled")]] = props.disabled,
+    var mode = styles$l["button--".concat(variant)];
+    return (jsx("button", __assign({ ref: ref, type: submit ? 'submit' : 'button', style: __assign(__assign({}, props.style), { backgroundColor: backgroundColor, width: fullWidth ? '100%' : 'auto' }) }, props, { className: [styles$l.button, styles$l["button--".concat(size)], mode].join(' '), children: jsxs("div", { className: styles$l['button-flex'], children: [!!icon && icon, label ? (jsx(Text, { className: classNames(styles$l.label, styles$l["label-color--".concat(variant)], (_b = {},
+                        _b[styles$l["label-color--".concat(variant, "--disabled")]] = props.disabled,
                         _b)), children: label })) : (children)] }) })));
 });
 Button.displayName = 'Button';
 
-var styles$j = {"card":"Card-module_card__-PlHa","footerDivider":"Card-module_footerDivider__nt5J7","mdShadow":"Card-module_mdShadow__yft6m","lgShadow":"Card-module_lgShadow__WzWj7","variantDefault":"Card-module_variantDefault__AIy3D","variantPlain":"Card-module_variantPlain__MOaH5","variantNeutral":"Card-module_variantNeutral__OAsYA","variantSuccess":"Card-module_variantSuccess__GWiOd","variantWarning":"Card-module_variantWarning__jappm","variantNotice":"Card-module_variantNotice__C7UUh","variantInfo":"Card-module_variantInfo__B26E9","variantPrimary":"Card-module_variantPrimary__9E-0B","variantCaution":"Card-module_variantCaution__-p-t8","paddingMd":"Card-module_paddingMd__i1uBq","paddingXs":"Card-module_paddingXs__9BSaQ","paddingCustom":"Card-module_paddingCustom__km95M","appearanceFilled":"Card-module_appearanceFilled__r6-rn","appearanceOutline":"Card-module_appearanceOutline__tseCa","borderWidthDefault":"Card-module_borderWidthDefault__QblrJ","borderWidthMd":"Card-module_borderWidthMd__lCL3w"};
+var styles$k = {"card":"Card-module_card__-PlHa","footerDivider":"Card-module_footerDivider__nt5J7","mdShadow":"Card-module_mdShadow__yft6m","lgShadow":"Card-module_lgShadow__WzWj7","variantDefault":"Card-module_variantDefault__AIy3D","variantPlain":"Card-module_variantPlain__MOaH5","variantNeutral":"Card-module_variantNeutral__OAsYA","variantSuccess":"Card-module_variantSuccess__GWiOd","variantWarning":"Card-module_variantWarning__jappm","variantNotice":"Card-module_variantNotice__C7UUh","variantInfo":"Card-module_variantInfo__B26E9","variantPrimary":"Card-module_variantPrimary__9E-0B","variantCaution":"Card-module_variantCaution__-p-t8","paddingMd":"Card-module_paddingMd__i1uBq","paddingXs":"Card-module_paddingXs__9BSaQ","paddingCustom":"Card-module_paddingCustom__km95M","appearanceFilled":"Card-module_appearanceFilled__r6-rn","appearanceOutline":"Card-module_appearanceOutline__tseCa","borderWidthDefault":"Card-module_borderWidthDefault__QblrJ","borderWidthMd":"Card-module_borderWidthMd__lCL3w"};
 
 var capitalize = function (value) {
     return value.charAt(0).toUpperCase() + value.slice(1);
@@ -636,15 +668,15 @@ var capitalize = function (value) {
 var Card = function (_a) {
     var _b;
     var header = _a.header, children = _a.children, footer = _a.footer, style = _a.style, _c = _a.shadow, shadow = _c === undefined ? 'md' : _c, _d = _a.variant, variant = _d === undefined ? 'default' : _d, _e = _a.appearance, appearance = _e === undefined ? 'filled' : _e, _f = _a.padding, padding = _f === undefined ? 'md' : _f, _g = _a.borderWidth, borderWidth = _g === undefined ? 'default' : _g;
-    var cardClassName = classNames(styles$j.card, (_b = {},
-        _b[styles$j.mdShadow] = shadow === 'md',
-        _b[styles$j.lgShadow] = shadow === 'lg',
-        _b), styles$j["variant".concat(capitalize(variant))], styles$j["appearance".concat(capitalize(appearance))], styles$j["padding".concat(capitalize(padding))], styles$j["borderWidth".concat(capitalize(borderWidth))]);
-    return (jsxs("div", { className: cardClassName, style: style, children: [header, children, footer && jsx("div", { className: styles$j.footerDivider }), footer] }));
+    var cardClassName = classNames(styles$k.card, (_b = {},
+        _b[styles$k.mdShadow] = shadow === 'md',
+        _b[styles$k.lgShadow] = shadow === 'lg',
+        _b), styles$k["variant".concat(capitalize(variant))], styles$k["appearance".concat(capitalize(appearance))], styles$k["padding".concat(capitalize(padding))], styles$k["borderWidth".concat(capitalize(borderWidth))]);
+    return (jsxs("div", { className: cardClassName, style: style, children: [header, children, footer && jsx("div", { className: styles$k.footerDivider }), footer] }));
 };
 Card.displayName = 'Card';
 
-var styles$i = {"cardStatus":"CardStatus-module_cardStatus__5T4aF","cardStatus--leftIcon":"CardStatus-module_cardStatus--leftIcon__ULp9A"};
+var styles$j = {"cardStatus":"CardStatus-module_cardStatus__5T4aF","cardStatus--leftIcon":"CardStatus-module_cardStatus--leftIcon__ULp9A"};
 
 var cardStatusVariantMap = {
     notes: {
@@ -681,11 +713,11 @@ var CardStatus = function (_a) {
         ? (_b = cardStatusVariantMap[variant]) === null || _b === undefined ? undefined : _b.backgroundColor
         : undefined;
     var sizeStyles = sizeMap[size || 'small'];
-    return (jsxs("div", { className: "".concat(styles$i.cardStatus, " ").concat(leftIcon ? styles$i['cardStatus--leftIcon'] : ''), style: backgroundColor ? { backgroundColor: backgroundColor } : undefined, children: [leftIcon && icon, jsx(Text, { variant: sizeStyles.textVariant, color: 'var(--color-neutral-600)', children: label }), !leftIcon && icon] }));
+    return (jsxs("div", { className: "".concat(styles$j.cardStatus, " ").concat(leftIcon ? styles$j['cardStatus--leftIcon'] : ''), style: backgroundColor ? { backgroundColor: backgroundColor } : undefined, children: [leftIcon && icon, jsx(Text, { variant: sizeStyles.textVariant, color: 'var(--color-neutral-600)', children: label }), !leftIcon && icon] }));
 };
 CardStatus.displayName = 'CardStatus';
 
-var styles$h = {"inner":"Checkbox-module_inner__R7olC","input":"Checkbox-module_input__XnCmS","label":"Checkbox-module_label__l8z5T","label-disabled":"Checkbox-module_label-disabled__fXIgW","icon-disabled":"Checkbox-module_icon-disabled__Nw0dG"};
+var styles$i = {"inner":"Checkbox-module_inner__R7olC","input":"Checkbox-module_input__XnCmS","label":"Checkbox-module_label__l8z5T","label-disabled":"Checkbox-module_label-disabled__fXIgW","icon-disabled":"Checkbox-module_icon-disabled__Nw0dG"};
 
 /**
  * Checkbox component for selecting multiple options from a set.
@@ -703,20 +735,20 @@ var Checkbox = function (_a) {
     var _b, _c;
     var _d = _a.checked, checked = _d === undefined ? false : _d, _e = _a.disabled, disabled = _e === undefined ? false : _e, label = _a.label, onChange = _a.onChange, id = _a.id, rest = __rest(_a, ["checked", "disabled", "label", "onChange", "id"]);
     return (jsx(Checkbox$1, __assign({ checked: checked, label: label, disabled: disabled, onChange: onChange, id: id, color: "var(--color-primary-300)", classNames: {
-            labelWrapper: styles$h.labelWrapper,
-            label: classNames(styles$h.label, (_b = {},
-                _b[styles$h['label-disabled']] = disabled,
+            labelWrapper: styles$i.labelWrapper,
+            label: classNames(styles$i.label, (_b = {},
+                _b[styles$i['label-disabled']] = disabled,
                 _b)),
-            input: styles$h.input,
-            inner: styles$h.inner,
+            input: styles$i.input,
+            inner: styles$i.inner,
             icon: classNames((_c = {},
-                _c[styles$h['icon-disabled']] = disabled,
+                _c[styles$i['icon-disabled']] = disabled,
                 _c)),
         } }, rest)));
 };
 Checkbox.displayName = 'Checkbox';
 
-var styles$g = {"chip-wrapper":"Chip-module_chip-wrapper__XcAWQ","chip-wrapper-text":"Chip-module_chip-wrapper-text__MGQ2X","chip-wrapper-menu-text":"Chip-module_chip-wrapper-menu-text__6-ZGF","chip-number":"Chip-module_chip-number__Y2-Tg","chip-number-wide":"Chip-module_chip-number-wide__qIVlX","chip-menu-dropdown":"Chip-module_chip-menu-dropdown__36ced","chip-menu-item":"Chip-module_chip-menu-item__-u2K-","chip-wrapper-filter":"Chip-module_chip-wrapper-filter__0GhdM"};
+var styles$h = {"chip-wrapper":"Chip-module_chip-wrapper__XcAWQ","chip-wrapper-text":"Chip-module_chip-wrapper-text__MGQ2X","chip-wrapper-menu-text":"Chip-module_chip-wrapper-menu-text__6-ZGF","chip-number":"Chip-module_chip-number__Y2-Tg","chip-number-wide":"Chip-module_chip-number-wide__qIVlX","chip-menu-dropdown":"Chip-module_chip-menu-dropdown__36ced","chip-menu-item":"Chip-module_chip-menu-item__-u2K-","chip-wrapper-filter":"Chip-module_chip-wrapper-filter__0GhdM"};
 
 var ChevronCollapse = function (_a) {
     var _b = _a.width, width = _b === undefined ? '32px' : _b, _c = _a.height, height = _c === undefined ? '32px' : _c, _d = _a.viewBox, viewBox = _d === undefined ? '0 0 32 32' : _d, _e = _a.stroke, stroke = _e === undefined ? 'currentColor' : _e, _f = _a.fill, fill = _f === undefined ? 'none' : _f;
@@ -740,10 +772,10 @@ var Chip = function (_a) {
         return null;
     // Just one filter
     if (itemGroup.length === 1) {
-        return (jsxs(Flex, { className: styles$g['chip-wrapper'], children: [jsx(Text, { variant: "xs", weight: "regular", className: styles$g['chip-wrapper-text'], children: itemGroup[0] }), jsx(ActionIcon, { variant: "light", size: "xs", onClick: function () { return handleDelete(itemGroup[0]); }, children: jsx(Close, { width: "18px", height: "18px" }) })] }));
+        return (jsxs(Flex, { className: styles$h['chip-wrapper'], children: [jsx(Text, { variant: "xs", weight: "regular", className: styles$h['chip-wrapper-text'], children: itemGroup[0] }), jsx(ActionIcon, { variant: "light", size: "xs", onClick: function () { return handleDelete(itemGroup[0]); }, children: jsx(Close, { width: "18px", height: "18px" }) })] }));
     }
     // More than one filter
-    return (jsxs(Menu$1, { opened: opened, onChange: setOpened, withinPortal: true, position: "bottom-start", closeOnItemClick: false, children: [jsx(Menu$1.Target, { children: jsxs(Flex, { className: styles$g['chip-wrapper'], children: [jsxs(Flex, { className: styles$g['chip-wrapper-menu-text'], children: [jsx(Text, { variant: "xs", weight: "regular", children: item }), jsx(Flex, { className: "".concat(styles$g['chip-number'], " ").concat(itemGroup.length > 9 ? styles$g['chip-number-wide'] : ''), children: jsx(Text, { variant: "xxs", weight: "bold", color: "var(--color-white)", style: { lineHeight: 1 }, children: itemGroup.length }) })] }), jsx(ActionIcon, { variant: "light", size: "xs", onClick: function () { return setOpened(function (o) { return !o; }); }, children: jsx(ChevronCollapse, { width: "24px", height: "24px" }) })] }) }), jsx(Menu$1.Dropdown, { className: styles$g['chip-menu-dropdown'], children: itemGroup.map(function (f) { return (jsx(Menu$1.Item, { className: styles$g['chip-menu-item'], children: jsx(Checkbox, { label: jsxs(Flex, { className: styles$g['chip-wrapper-filter'], children: [jsx(Text, { variant: "xs", weight: "regular", children: f }), jsxs(Text, { variant: "xs", weight: "regular", children: ["(", f.length, ")"] })] }), checked: itemGroup.includes(f), onChange: function () { return handleDelete(f); } }) }, f)); }) })] }));
+    return (jsxs(Menu$1, { opened: opened, onChange: setOpened, withinPortal: true, position: "bottom-start", closeOnItemClick: false, children: [jsx(Menu$1.Target, { children: jsxs(Flex, { className: styles$h['chip-wrapper'], children: [jsxs(Flex, { className: styles$h['chip-wrapper-menu-text'], children: [jsx(Text, { variant: "xs", weight: "regular", children: item }), jsx(Flex, { className: "".concat(styles$h['chip-number'], " ").concat(itemGroup.length > 9 ? styles$h['chip-number-wide'] : ''), children: jsx(Text, { variant: "xxs", weight: "bold", color: "var(--color-white)", style: { lineHeight: 1 }, children: itemGroup.length }) })] }), jsx(ActionIcon, { variant: "light", size: "xs", onClick: function () { return setOpened(function (o) { return !o; }); }, children: jsx(ChevronCollapse, { width: "24px", height: "24px" }) })] }) }), jsx(Menu$1.Dropdown, { className: styles$h['chip-menu-dropdown'], children: itemGroup.map(function (f) { return (jsx(Menu$1.Item, { className: styles$h['chip-menu-item'], children: jsx(Checkbox, { label: jsxs(Flex, { className: styles$h['chip-wrapper-filter'], children: [jsx(Text, { variant: "xs", weight: "regular", children: f }), jsxs(Text, { variant: "xs", weight: "regular", children: ["(", f.length, ")"] })] }), checked: itemGroup.includes(f), onChange: function () { return handleDelete(f); } }) }, f)); }) })] }));
 };
 Chip.displayName = 'Chip';
 
@@ -834,10 +866,10 @@ var DateInput = function (_a) {
     var showLabel = !hideLabel && (isFocused || value);
     var placeHolderValue = placeholder && isFocused ? placeholder : (label !== null && label !== undefined ? label : placeholder);
     var ErrorSection = useMemo(function () {
-        return holdSpace && (jsxs(Flex, { className: styles$m.error, gap: 4, ml: 16, style: {
+        return holdSpace && (jsxs(Flex, { className: styles$o.error, gap: 4, ml: 16, style: {
                 visibility: error ? 'visible' : 'hidden',
                 alignItems: 'flex-start',
-            }, children: [jsx(Flex, { style: { flexShrink: 0 }, children: jsx(Info, { width: "18px", height: "18px", viewBox: "0 0 24 24", stroke: "var(--color-red-300)" }) }), jsx(Text, { variant: "xs", className: classNames(styles$m.errorText), children: capitalizeFirstSentenceLetter(error || '') })] }));
+            }, children: [jsx(Flex, { style: { flexShrink: 0 }, children: jsx(Info, { width: "18px", height: "18px", viewBox: "0 0 24 24", stroke: "var(--color-red-300)" }) }), jsx(Text, { variant: "xs", className: classNames(styles$o.errorText), children: capitalizeFirstSentenceLetter(error || '') })] }));
     }, [error, holdSpace]);
     var handleBlur = function (e) {
         setIsFocused(false);
@@ -845,36 +877,36 @@ var DateInput = function (_a) {
             onBlur(e);
         }
     };
-    return (jsxs("div", { className: styles$m.container, children: [showLabel && (jsx("label", { className: classNames(styles$m.label, (_b = {},
-                    _b[styles$m.labelError] = error && !isFocused,
-                    _b[styles$m.labelFocused] = isFocused || isHovered,
-                    _b[styles$m.labelDisabled] = disabled,
+    return (jsxs("div", { className: styles$o.container, children: [showLabel && (jsx("label", { className: classNames(styles$o.label, (_b = {},
+                    _b[styles$o.labelError] = error && !isFocused,
+                    _b[styles$o.labelFocused] = isFocused || isHovered,
+                    _b[styles$o.labelDisabled] = disabled,
                     _b)), children: label })), jsx("div", { onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onFocus: function () { return setIsFocused(true); }, onBlur: function () { return setIsFocused(false); }, children: jsx(DateInput$1, __assign({ name: name, classNames: {
-                        input: classNames(styles$m.input, (_c = {},
-                            _c[styles$m.inputError] = error,
-                            _c[styles$m.inputRightIcon] = true,
+                        input: classNames(styles$o.input, (_c = {},
+                            _c[styles$o.inputError] = error,
+                            _c[styles$o.inputRightIcon] = true,
                             _c)),
-                    }, valueFormat: "MM/DD/YYYY", dateParser: dateParser, rightSection: jsx(Calendar, { stroke: "var(--color-neutral-600)", width: "18px", height: "18px", viewBox: "0 0 24 24" }), rightSectionProps: { className: styles$m.rightSection }, placeholder: placeHolderValue, value: value, onChange: onChange, onBlur: handleBlur, error: ErrorSection, inputWrapperOrder: ['label', 'input', 'error'], disabled: disabled }, rest)) })] }));
+                    }, valueFormat: "MM/DD/YYYY", dateParser: dateParser, rightSection: jsx(Calendar, { stroke: "var(--color-neutral-600)", width: "18px", height: "18px", viewBox: "0 0 24 24" }), rightSectionProps: { className: styles$o.rightSection }, placeholder: placeHolderValue, value: value, onChange: onChange, onBlur: handleBlur, error: ErrorSection, errorProps: inputErrorProps, inputWrapperOrder: ['label', 'input', 'error'], disabled: disabled }, rest)) })] }));
 };
 DateInput.displayName = 'DateInput';
 
-var styles$f = {"code-input":"EnterCodeInput-module_code-input__bCj-T","code-input--2":"EnterCodeInput-module_code-input--2__yoYWJ","code-input--3":"EnterCodeInput-module_code-input--3__0xXFa","code-input--4":"EnterCodeInput-module_code-input--4__stWlP","code-input-error":"EnterCodeInput-module_code-input-error__l8yKQ"};
+var styles$g = {"code-input":"EnterCodeInput-module_code-input__bCj-T","code-input--2":"EnterCodeInput-module_code-input--2__yoYWJ","code-input--3":"EnterCodeInput-module_code-input--3__0xXFa","code-input--4":"EnterCodeInput-module_code-input--4__stWlP","code-input-error":"EnterCodeInput-module_code-input-error__l8yKQ"};
 
 var EnterCodeInput = React.forwardRef(function (props, ref) {
     var className = [
-        styles$f['code-input'],
-        styles$f["code-input--".concat(props.inline)],
+        styles$g['code-input'],
+        styles$g["code-input--".concat(props.inline)],
     ].join(' ');
     if (props.error) {
-        className = [className, styles$f['code-input-error']].join(' ');
+        className = [className, styles$g['code-input-error']].join(' ');
     }
     return (jsx("input", __assign({}, (typeof props.field === 'object' ? props.field : {}), props, { ref: ref, name: props.name, autoFocus: true, className: className, type: props.type, maxLength: 6, placeholder: props.placeholder, onChange: props.onChange, onBlur: props.onBlur, onKeyUp: props.onKeyUp, value: props.value })));
 });
 EnterCodeInput.displayName = 'EnterCodeInput';
 
-var styles$e = {"container":"FileInput-module_container__PUDhK","dropzone":"FileInput-module_dropzone__y5BNo","dragging":"FileInput-module_dragging__DoJPz","disabled":"FileInput-module_disabled__2Vlih","input":"FileInput-module_input__xiCkj","icon":"FileInput-module_icon__lXNr-","content":"FileInput-module_content__V9dYE","label":"FileInput-module_label__3DYWx","helper":"FileInput-module_helper__vVlYi","fileFormatText":"FileInput-module_fileFormatText__3E24H","fileList":"FileInput-module_fileList__xwhfk"};
+var styles$f = {"container":"FileInput-module_container__PUDhK","dropzone":"FileInput-module_dropzone__y5BNo","dragging":"FileInput-module_dragging__DoJPz","disabled":"FileInput-module_disabled__2Vlih","input":"FileInput-module_input__xiCkj","icon":"FileInput-module_icon__lXNr-","content":"FileInput-module_content__V9dYE","label":"FileInput-module_label__3DYWx","helper":"FileInput-module_helper__vVlYi","fileFormatText":"FileInput-module_fileFormatText__3E24H","fileList":"FileInput-module_fileList__xwhfk"};
 
-var styles$d = {"fileItem":"FileUpload-module_fileItem__TQAj3","fileInfo":"FileUpload-module_fileInfo__0Rsbg","successIcon":"FileUpload-module_successIcon__P4ekl","errorIcon":"FileUpload-module_errorIcon__3IUcP","fileName":"FileUpload-module_fileName__iE6N7","fileSize":"FileUpload-module_fileSize__BuAI5","fileMessage":"FileUpload-module_fileMessage__ymYSV","progressBar":"FileUpload-module_progressBar__MYqP0","progress":"FileUpload-module_progress__eXpUX"};
+var styles$e = {"fileItem":"FileUpload-module_fileItem__TQAj3","fileInfo":"FileUpload-module_fileInfo__0Rsbg","successIcon":"FileUpload-module_successIcon__P4ekl","errorIcon":"FileUpload-module_errorIcon__3IUcP","fileName":"FileUpload-module_fileName__iE6N7","fileSize":"FileUpload-module_fileSize__BuAI5","fileMessage":"FileUpload-module_fileMessage__ymYSV","progressBar":"FileUpload-module_progressBar__MYqP0","progress":"FileUpload-module_progress__eXpUX"};
 
 var Clock = function (_a) {
     var _b = _a.width, width = _b === undefined ? '32px' : _b, _c = _a.height, height = _c === undefined ? '32px' : _c, _d = _a.viewBox, viewBox = _d === undefined ? '0 0 32 32' : _d, _e = _a.stroke, stroke = _e === undefined ? 'currentColor' : _e;
@@ -930,25 +962,25 @@ var getMessage = function (status, message, progress) {
     if (status === 'failed') {
         if (message === null || message === undefined ? undefined : message.includes('-')) {
             var _a = message.split('-'), errorReason = _a[0], errorMessage = _a[1];
-            return (jsxs(Text, { className: styles$d.fileMessage, color: "var(--color-red-400)", children: [jsx("strong", { children: errorReason }), " - ", errorMessage] }));
+            return (jsxs(Text, { className: styles$e.fileMessage, color: "var(--color-red-400)", children: [jsx("strong", { children: errorReason }), " - ", errorMessage] }));
         }
-        return (jsx(Text, { className: styles$d.fileMessage, color: "var(--color-red-400)", children: message }));
+        return (jsx(Text, { className: styles$e.fileMessage, color: "var(--color-red-400)", children: message }));
     }
     if (status === 'duplicate') {
         if (message === null || message === undefined ? undefined : message.includes('-')) {
             var _b = message.split('-'), errorReason = _b[0], errorMessage = _b[1];
-            return (jsxs(Text, { className: styles$d.fileMessage, color: "var(--color-orange-400)", children: [jsx("strong", { children: errorReason }), " - ", errorMessage] }));
+            return (jsxs(Text, { className: styles$e.fileMessage, color: "var(--color-orange-400)", children: [jsx("strong", { children: errorReason }), " - ", errorMessage] }));
         }
-        return (jsx(Text, { className: styles$d.fileMessage, color: "var(--color-orange-400)", children: message }));
+        return (jsx(Text, { className: styles$e.fileMessage, color: "var(--color-orange-400)", children: message }));
     }
     if (status === 'uploading') {
-        return (jsxs(Flex, { align: "center", gap: 24, children: [jsx(Flex, { className: styles$d.progressBar, children: jsx(Flex, { className: styles$d.progress, w: "".concat(progress, "%") }) }), jsxs(Text, { color: "var(--color-neutral-500)", variant: "m", style: { margin: 0 }, children: [progress, "%"] })] }));
+        return (jsxs(Flex, { align: "center", gap: 24, children: [jsx(Flex, { className: styles$e.progressBar, children: jsx(Flex, { className: styles$e.progress, w: "".concat(progress, "%") }) }), jsxs(Text, { color: "var(--color-neutral-500)", variant: "m", style: { margin: 0 }, children: [progress, "%"] })] }));
     }
     if (status === 'previously-uploaded') {
-        return (jsx(Text, { className: styles$d.fileMessage, color: "var(--color-green-400)", children: message }));
+        return (jsx(Text, { className: styles$e.fileMessage, color: "var(--color-green-400)", children: message }));
     }
     if (status === 'uploaded') {
-        return (jsx(Text, { className: styles$d.fileMessage, color: "var(--color-green-400)", children: message }));
+        return (jsx(Text, { className: styles$e.fileMessage, color: "var(--color-green-400)", children: message }));
     }
     return null;
 };
@@ -964,7 +996,7 @@ var parseFileSize = function (size) {
 
 var FileUpload = function (_a) {
     var id = _a.id, name = _a.name, size = _a.size, status = _a.status, message = _a.message, progress = _a.progress, removeFile = _a.removeFile;
-    return (jsxs(Fragment, { children: [jsx(Divider, { color: "var(--color-neutral-300)" }), jsxs("div", { className: styles$d.fileItem, children: [jsxs("div", { className: styles$d.fileInfo, children: [getIcon$1(status), jsxs(Flex, { direction: "column", w: "100%", children: [jsx(Text, { className: styles$d.fileName, children: name }), jsx(Text, { className: styles$d.fileSize, color: "var(--color-neutral-500)", children: parseFileSize(size) }), getMessage(status, message, progress)] })] }), removeFile && (jsx(ActionIcon, { variant: "light", size: 'md', onClick: function () { return removeFile(id); }, "aria-label": "Remove ".concat(name), children: jsx(Close, {}) }))] }, "".concat(name, "-").concat(id))] }));
+    return (jsxs(Fragment, { children: [jsx(Divider, { color: "var(--color-neutral-300)" }), jsxs("div", { className: styles$e.fileItem, children: [jsxs("div", { className: styles$e.fileInfo, children: [getIcon$1(status), jsxs(Flex, { direction: "column", w: "100%", children: [jsx(Text, { className: styles$e.fileName, children: name }), jsx(Text, { className: styles$e.fileSize, color: "var(--color-neutral-500)", children: parseFileSize(size) }), getMessage(status, message, progress)] })] }), removeFile && (jsx(ActionIcon, { variant: "light", size: 'md', onClick: function () { return removeFile(id); }, "aria-label": "Remove ".concat(name), children: jsx(Close, {}) }))] }, "".concat(name, "-").concat(id))] }));
 };
 FileUpload.displayName = 'FileUpload';
 
@@ -1022,34 +1054,34 @@ var FileInput = function (_a) {
         .join(', ')
         .slice('.'.length)
         .toUpperCase(), ". Max file size: ").concat(maxSize, "MB");
-    return (jsxs(Fragment, { children: [jsx("div", { className: styles$e.container, children: jsxs("div", { className: classNames(styles$e.dropzone, (_b = {},
-                        _b[styles$e.dragging] = isDragging,
-                        _b[styles$e.disabled] = disabled,
-                        _b)), onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, children: [jsx("input", { type: "file", accept: acceptedFormats.join(','), onChange: handleFileInput, className: styles$e.input, "aria-label": label, disabled: disabled, multiple: true }), jsx("div", { className: styles$e.icon, children: jsx(Upload, { stroke: color, width: "2.6rem", height: "2.6rem", viewBox: "0 0 40 40" }) }), jsxs("div", { className: styles$e.content, children: [jsxs(Flex, { gap: 4, children: [jsx(Text, { variant: "m", weight: "medium", color: color, children: "Drag or" }), jsxs(Text, { variant: "m", weight: "medium", color: color, style: { textDecoration: 'underline' }, children: ["click to upload ", label] })] }), jsx(Text, { className: styles$e.fileFormatText, color: color, children: fileFormatText })] })] }) }), files.some(function (f) { return f.status === 'failed'; }) ? (jsx(Text, { variant: "xs", className: styles$e.helper, children: errorMessage })) : (jsx(Text, { variant: "xs", className: styles$e.helper, children: helperText })), files.length > 0 && (jsx(Flex, { className: styles$e.fileList, children: files.map(function (_a, index) {
+    return (jsxs(Fragment, { children: [jsx("div", { className: styles$f.container, children: jsxs("div", { className: classNames(styles$f.dropzone, (_b = {},
+                        _b[styles$f.dragging] = isDragging,
+                        _b[styles$f.disabled] = disabled,
+                        _b)), onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, children: [jsx("input", { type: "file", accept: acceptedFormats.join(','), onChange: handleFileInput, className: styles$f.input, "aria-label": label, disabled: disabled, multiple: true }), jsx("div", { className: styles$f.icon, children: jsx(Upload, { stroke: color, width: "2.6rem", height: "2.6rem", viewBox: "0 0 40 40" }) }), jsxs("div", { className: styles$f.content, children: [jsxs(Flex, { gap: 4, children: [jsx(Text, { variant: "m", weight: "medium", color: color, children: "Drag or" }), jsxs(Text, { variant: "m", weight: "medium", color: color, style: { textDecoration: 'underline' }, children: ["click to upload ", label] })] }), jsx(Text, { className: styles$f.fileFormatText, color: color, children: fileFormatText })] })] }) }), files.some(function (f) { return f.status === 'failed'; }) ? (jsx(Text, { variant: "xs", className: styles$f.helper, children: errorMessage })) : (jsx(Text, { variant: "xs", className: styles$f.helper, children: helperText })), files.length > 0 && (jsx(Flex, { className: styles$f.fileList, children: files.map(function (_a, index) {
                     var file = _a.file, rest = __rest(_a, ["file"]);
                     return (jsx(FileUpload, __assign({ file: file, removeFile: removeFile }, rest), "".concat(file.name, "-").concat(index)));
                 }) }))] }));
 };
 FileInput.displayName = 'FileInput';
 
-var styles$c = {"flex":"IncrementNumber-module_flex__Zo8-v","increment-button":"IncrementNumber-module_increment-button__qpw2X"};
+var styles$d = {"flex":"IncrementNumber-module_flex__Zo8-v","increment-button":"IncrementNumber-module_increment-button__qpw2X"};
 
 var IncrementNumber = function (props) {
     var formatter = new Intl.NumberFormat('en-US', {
         style: 'currency',
         currency: 'USD',
     });
-    return (jsxs("div", { className: styles$c['flex'], children: [props.disableDecrease ? (jsx("div", { style: { width: 24 } })) : (jsx("button", { className: styles$c['increment-button'], onClick: function () { return props.handleDecrease(props.value); }, children: jsx("img", { src: props.minusIconPath, width: 24, height: 24, alt: "-", style: {
+    return (jsxs("div", { className: styles$d['flex'], children: [props.disableDecrease ? (jsx("div", { style: { width: 24 } })) : (jsx("button", { className: styles$d['increment-button'], onClick: function () { return props.handleDecrease(props.value); }, children: jsx("img", { src: props.minusIconPath, width: 24, height: 24, alt: "-", style: {
                         maxWidth: '100%',
                         height: 'auto',
-                    } }) })), jsx(Text, { variant: "m", weight: "regular", style: { minWidth: 120 }, children: formatter.format(props.value) }), props.disableIncrease ? (jsx("div", { style: { width: 24 } })) : (jsx("button", { className: styles$c['increment-button'], onClick: function () { return props.handleIncrease(props.value); }, children: jsx("img", { src: props.plusIconPath, width: 24, height: 24, alt: "+", style: {
+                    } }) })), jsx(Text, { variant: "m", weight: "regular", style: { minWidth: 120 }, children: formatter.format(props.value) }), props.disableIncrease ? (jsx("div", { style: { width: 24 } })) : (jsx("button", { className: styles$d['increment-button'], onClick: function () { return props.handleIncrease(props.value); }, children: jsx("img", { src: props.plusIconPath, width: 24, height: 24, alt: "+", style: {
                         maxWidth: '100%',
                         height: 'auto',
                     } }) }))] }));
 };
 IncrementNumber.displayName = 'IncrementNumber';
 
-var styles$b = {"link":"Link-module_link__8oxip","s":"Link-module_s__YsU8H","m":"Link-module_m__8-UFj","bold":"Link-module_bold__H3baG","medium":"Link-module_medium__nuncU","regular":"Link-module_regular__4VBH2","disabledUnderlined":"Link-module_disabledUnderlined__rLghi"};
+var styles$c = {"link":"Link-module_link__8oxip","s":"Link-module_s__YsU8H","m":"Link-module_m__8-UFj","bold":"Link-module_bold__H3baG","medium":"Link-module_medium__nuncU","regular":"Link-module_regular__4VBH2","disabledUnderlined":"Link-module_disabledUnderlined__rLghi"};
 
 /**
  *
@@ -1079,15 +1111,15 @@ var styles$b = {"link":"Link-module_link__8oxip","s":"Link-module_s__YsU8H","m":
 var Link = function (_a) {
     var children = _a.children, variant = _a.variant, weight = _a.weight, href = _a.href, target = _a.target, _b = _a.disabledUnderlined, disabledUnderlined = _b === undefined ? false : _b, rel = _a.rel, rest = __rest(_a, ["children", "variant", "weight", "href", "target", "disabledUnderlined", "rel"]);
     return (jsx("a", __assign({}, rest, { href: href || '#', target: target, rel: rel, className: [
-            styles$b['link'],
-            styles$b[variant || ''],
-            styles$b[weight || ''],
-            disabledUnderlined ? styles$b['disabledUnderlined'] : '',
+            styles$c['link'],
+            styles$c[variant || ''],
+            styles$c[weight || ''],
+            disabledUnderlined ? styles$c['disabledUnderlined'] : '',
         ].join(' '), children: children })));
 };
 Link.displayName = 'Link';
 
-var styles$a = {"modal":"Modal-module_modal__gMPgi","body":"Modal-module_body__OhLb0","header":"Modal-module_header__5sBzU"};
+var styles$b = {"modal":"Modal-module_modal__gMPgi","body":"Modal-module_body__OhLb0","header":"Modal-module_header__5sBzU"};
 
 var Modal = function (_a) {
     var isOpen = _a.isOpen, onClose = _a.onClose, noLabel = _a.noLabel, yesLabel = _a.yesLabel, invertColors = _a.invertColors, underButton = _a.underButton, no = _a.no, yes = _a.yes, _b = _a.size, size = _b === undefined ? 'sm' : _b, _c = _a.padding, padding = _c === undefined ? 'sm' : _c, _d = _a.customRadius, customRadius = _d === undefined ? 16 : _d, children = _a.children, _e = _a.disabled, disabled = _e === undefined ? false : _e;
@@ -1112,9 +1144,9 @@ var Modal = function (_a) {
             title: 'Close modal',
             icon: jsx(Close, { fill: "var(--color-neutral-200)" }),
         }, classNames: {
-            content: styles$a.modal,
-            body: styles$a.body,
-            header: styles$a.header,
+            content: styles$b.modal,
+            body: styles$b.body,
+            header: styles$b.header,
         }, styles: {
             body: {
                 padding: paddingMap[padding],
@@ -1140,7 +1172,7 @@ var Warning = function (_a) {
 };
 Warning.displayName = 'Warning';
 
-var styles$9 = {"message":"Message-module_message__HyLo0","general":"Message-module_general__jNnP2","alert":"Message-module_alert__3mQLB","negative":"Message-module_negative__H-tsT","positive":"Message-module_positive__CU0EL","center":"Message-module_center__Y4KjG","top":"Message-module_top__J-o9d","bottom":"Message-module_bottom__2p2bW"};
+var styles$a = {"message":"Message-module_message__HyLo0","general":"Message-module_general__jNnP2","alert":"Message-module_alert__3mQLB","negative":"Message-module_negative__H-tsT","positive":"Message-module_positive__CU0EL","center":"Message-module_center__Y4KjG","top":"Message-module_top__J-o9d","bottom":"Message-module_bottom__2p2bW"};
 
 /**
  * Message component for displaying feedback to the user.
@@ -1170,18 +1202,18 @@ var getIcon = function (status) {
 };
 var Message = function (_a) {
     var content = _a.content, _b = _a.variant, variant = _b === undefined ? 'form' : _b, _c = _a.status, status = _c === undefined ? 'general' : _c, _d = _a.iconAlignment, iconAlignment = _d === undefined ? 'center' : _d;
-    return (jsxs(Flex, { className: classNames(styles$9.message, styles$9[status], styles$9[variant]), children: [jsx(Flex, { className: styles$9[iconAlignment], children: getIcon(status) }), typeof content === 'string' ? (jsx(Text, { variant: "xs", children: content })) : (content)] }));
+    return (jsxs(Flex, { className: classNames(styles$a.message, styles$a[status], styles$a[variant]), children: [jsx(Flex, { className: styles$a[iconAlignment], children: getIcon(status) }), typeof content === 'string' ? (jsx(Text, { variant: "xs", children: content })) : (content)] }));
 };
 Message.displayName = 'Message';
 
 var multiselectStyles = {"input":"Multiselect-module_input__lwmrJ","inputFocused":"Multiselect-module_inputFocused__rm-OP","disabled":"Multiselect-module_disabled__DyqLt","pill":"Multiselect-module_pill__NwXcT","pillText":"Multiselect-module_pillText__6hobG"};
 
-var styles$8 = {"tooltip":"Tooltip-module_tooltip__Q1YfF"};
+var styles$9 = {"tooltip":"Tooltip-module_tooltip__Q1YfF"};
 
 var Tooltip = function (_a) {
     var children = _a.children, props = __rest(_a, ["children"]);
     return (jsx(Tooltip$1, __assign({}, props, { classNames: {
-            tooltip: styles$8.tooltip,
+            tooltip: styles$9.tooltip,
         }, offset: 4, children: children })));
 };
 Tooltip.displayName = 'Tooltip';
@@ -1338,17 +1370,17 @@ var MultiselectInternal = function (_a) {
                     }, onClick: function (e) { return e.stopPropagation(); } }))] }));
     };
     PillAndSearchSection.displayName = 'PillAndSearchSection';
-    var ErrorSection = (jsxs(Flex, { className: styles$m.error, gap: 4, ml: 16, mt: 8, style: { visibility: error ? 'visible' : 'hidden' }, children: [jsx(Info, { width: "18px", height: "18px", viewBox: "0 0 24 24", stroke: "var(--color-red-300)" }), jsx(Text, { variant: "xs", className: classNames(styles$m.errorText), children: error })] }));
-    var DescriptionSection = (jsx(Flex, { className: styles$m.description, gap: 4, ml: 16, mt: 8, style: { visibility: description ? 'visible' : 'hidden' }, children: jsx(Text, { variant: "xs", children: description }) }));
+    var ErrorSection = (jsxs(Flex, { className: styles$o.error, gap: 4, ml: 16, mt: 8, style: { visibility: error ? 'visible' : 'hidden' }, children: [jsx(Info, { width: "18px", height: "18px", viewBox: "0 0 24 24", stroke: "var(--color-red-300)" }), jsx(Text, { variant: "xs", className: classNames(styles$o.errorText), children: error })] }));
+    var DescriptionSection = (jsx(Flex, { className: styles$o.description, gap: 4, ml: 16, mt: 8, style: { visibility: description ? 'visible' : 'hidden' }, children: jsx(Text, { variant: "xs", children: description }) }));
     var dropdownFooter = function (store) { return (jsxs(Flex, { justify: "flex-end", py: 8, gap: 8, children: [jsx(Button, { variant: "outlined", label: "Clear", size: "small", onClick: handleClear }), jsx(Button, { variant: "filled", label: "Apply", size: "small", onClick: function () { return handleApply(store.closeDropdown); } })] })); };
     return (jsx(Dropdown, { options: dropdownOptions, maxHeight: 300, footer: dropdownFooter, children: function (store) {
             var _a, _b;
             var floatLabel = store.dropdownOpened || hasSelectedOptions;
-            return (jsxs("div", { className: styles$m.container, children: [floatLabel && (jsx("label", { className: classNames(styles$m.label, (_a = {},
-                            _a[styles$m.labelError] = error && !isFocused,
-                            _a[styles$m.labelFocused] = isFocused || isHovered,
-                            _a)), children: label })), jsxs(Box, { className: classNames(styles$m.input, multiselectStyles.input, (_b = {},
-                            _b[styles$m.inputError] = error && !isFocused,
+            return (jsxs("div", { className: styles$o.container, children: [floatLabel && (jsx("label", { className: classNames(styles$o.label, (_a = {},
+                            _a[styles$o.labelError] = error && !isFocused,
+                            _a[styles$o.labelFocused] = isFocused || isHovered,
+                            _a)), children: label })), jsxs(Box, { className: classNames(styles$o.input, multiselectStyles.input, (_b = {},
+                            _b[styles$o.inputError] = error && !isFocused,
                             _b[multiselectStyles.inputFocused] = isFocused || store.dropdownOpened,
                             _b[multiselectStyles.disabled] = disabled,
                             _b)), onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onClick: function () { return store.toggleDropdown(); }, onFocus: function () { return setIsFocused(true); }, onBlur: handleBlur, tabIndex: 0, children: [jsx(PillAndSearchSection, { store: store, maxPills: maxPills }), jsx(Chevron, { rotate: store.dropdownOpened ? 90 : 270 })] }), error ? ErrorSection : DescriptionSection] }));
@@ -1378,6 +1410,9 @@ var NavBar = function (_a) {
         }
     }, [expandedIdx, links]);
     var isSubitemActive = function (item) { var _a; return (_a = item.subitems) === null || _a === undefined ? undefined : _a.some(function (sub) { return currentPath === null || currentPath === undefined ? undefined : currentPath.startsWith(sub.href); }); };
+    var isItemActive = function (item) {
+        return !!item.href && (currentPath === null || currentPath === undefined ? undefined : currentPath.startsWith(item.href));
+    };
     var handleNavigation = function (e, href) {
         if (!href)
             return;
@@ -1404,7 +1439,10 @@ var NavBar = function (_a) {
                                                         : ''), "data-text": item.title, children: item.title })) : (jsx("a", { onClick: function (e) {
                                                     setExpandedIdx(null);
                                                     handleNavigation(e, item.href);
-                                                }, className: navBarStyles.menuItemText, href: (_b = item.href) !== null && _b !== undefined ? _b : '', "data-text": item.title, children: item.title })), expandedIdx === idx && hasSubitems && (jsx(Flex, { className: navBarStyles.subnav, direction: "column", ref: dropdownRef, children: (_c = item === null || item === undefined ? undefined : item.subitems) === null || _c === undefined ? undefined : _c.map(function (sub) { return (jsx("a", { href: sub.href, onClick: function (e) {
+                                                }, className: navBarStyles.menuItemText +
+                                                    (isItemActive(item)
+                                                        ? ' ' + navBarStyles['menuItemText--bold']
+                                                        : ''), href: (_b = item.href) !== null && _b !== undefined ? _b : '', "data-text": item.title, children: item.title })), expandedIdx === idx && hasSubitems && (jsx(Flex, { className: navBarStyles.subnav, direction: "column", ref: dropdownRef, children: (_c = item === null || item === undefined ? undefined : item.subitems) === null || _c === undefined ? undefined : _c.map(function (sub) { return (jsx("a", { href: sub.href, onClick: function (e) {
                                                         setExpandedIdx(null);
                                                         handleNavigation(e, sub.href);
                                                     }, className: navBarStyles.subnavItem +
@@ -1415,15 +1453,15 @@ var NavBar = function (_a) {
 };
 NavBar.displayName = 'NavBar';
 
-var styles$7 = {"navbarSideContainer":"NavBarSide-module_navbarSideContainer__P8vLp","tabsRoot":"NavBarSide-module_tabsRoot__AAHNn","tabsList":"NavBarSide-module_tabsList__q9npG","tab":"NavBarSide-module_tab__i8yDE","tabsPanel":"NavBarSide-module_tabsPanel__-JWPo"};
+var styles$8 = {"navbarSideContainer":"NavBarSide-module_navbarSideContainer__P8vLp","tabsRoot":"NavBarSide-module_tabsRoot__AAHNn","tabsList":"NavBarSide-module_tabsList__q9npG","tab":"NavBarSide-module_tab__i8yDE","tabsPanel":"NavBarSide-module_tabsPanel__-JWPo"};
 
 var NavBarSide = function (_a) {
     var tabs = _a.tabs, onChange = _a.onChange, value = _a.value;
-    return (jsx("div", { className: styles$7.navbarSideContainer, children: jsxs(Tabs$1, { value: value, onChange: onChange, orientation: "vertical", keepMounted: false, classNames: {
-                list: styles$7.tabsList,
-                tab: styles$7.tab,
-                panel: styles$7.tabsPanel,
-                root: styles$7.tabsRoot,
+    return (jsx("div", { className: styles$8.navbarSideContainer, children: jsxs(Tabs$1, { value: value, onChange: onChange, orientation: "vertical", keepMounted: false, classNames: {
+                list: styles$8.tabsList,
+                tab: styles$8.tab,
+                panel: styles$8.tabsPanel,
+                root: styles$8.tabsRoot,
             }, children: [jsx(Tabs$1.List, { children: tabs.map(function (tab) { return (jsx(Tabs$1.Tab, { value: tab.value, "data-active": undefined, children: tab.label }, tab.value)); }) }), tabs.map(function (tab) { return (jsx(Tabs$1.Panel, { value: tab.value, children: tab.content }, tab.value)); })] }) }));
 };
 NavBarSide.displayName = 'NavBarSide';
@@ -1486,6 +1524,30 @@ var PasswordInput = function (_a) {
 };
 PasswordInput.displayName = 'PasswordInput';
 
+var styles$7 = {"pill":"Pill-module_pill__LeCgu","badge":"Pill-module_badge__DN2xw","secondary":"Pill-module_secondary__gu5Nq","text":"Pill-module_text__kUgzL","secondarySelected":"Pill-module_secondarySelected__-f9tB","primary":"Pill-module_primary__ZlP8y","primarySelected":"Pill-module_primarySelected__JC8JY","disabled":"Pill-module_disabled__1KocP"};
+
+/**
+ * Pill component is used to display a pill with a label and an optional icon
+ * @param label - The label of the pill
+ * @param rightIcon - The icon to display on the right side of the pill
+ * @param leftIcon - The icon to display on the left side of the pill
+ * @param isSelected - Whether the pill is selected
+ * @param onClick - The function to call when the pill is clicked
+ * @param disabled - Whether the pill is disabled
+ * @param className - The class name to apply to the pill
+ * @param dataFsElement - The data-fs-element to apply to the pill
+ * @param variant - The variant of the pill
+ * @returns The Pill component
+ */
+var Pill = function (_a) {
+    var label = _a.label, rightIcon = _a.rightIcon, leftIcon = _a.leftIcon, _b = _a.isSelected, isSelected = _b === undefined ? false : _b, onClick = _a.onClick, _c = _a.disabled, disabled = _c === undefined ? false : _c, _d = _a.className, className = _d === undefined ? '' : _d, dataFsElement = _a.dataFsElement, _e = _a.variant, variant = _e === undefined ? 'secondary' : _e;
+    var variantClass = isSelected
+        ? styles$7["".concat(variant, "Selected")]
+        : styles$7[variant];
+    return (jsxs("div", __assign({ className: classNames(styles$7.pill, variantClass, disabled && styles$7.disabled, className), onClick: disabled ? undefined : onClick }, (dataFsElement ? { 'data-fs-element': dataFsElement } : {}), { children: [leftIcon, jsx(Text, { variant: "xs", weight: "medium", className: "\n          ".concat(styles$7.text, "\n          ").concat(isSelected ? styles$7.selectedText : '', "\n          ").concat(disabled ? styles$7.disabledText : '', "\n        "), children: label }), rightIcon] })));
+};
+Pill.displayName = 'Pill';
+
 var styles$6 = {"radio":"RadioButton-module_radio__0A47m","label":"RadioButton-module_label__4gTzQ","disabled-label":"RadioButton-module_disabled-label__Nk0NW"};
 
 /**
@@ -1585,7 +1647,7 @@ var Select = function (_a) {
                         label: styles$4['default-label'],
                         dropdown: styles$4.dropdown,
                         option: styles$4.option,
-                    }, data: data, placeholder: placeHolderValue, value: value, name: name || '', onChange: onChange, comboboxProps: { zIndex: 1000 }, error: ErrorSection, onFocus: function () { return setIsFocused(true); }, onBlur: handleBlur, inputWrapperOrder: ['label', 'input', 'description', 'error'], description: !error && description && jsx(Text, { variant: "xs", children: description }), descriptionProps: { className: styles$4.description }, errorProps: { className: styles$4.error }, rightSection: jsx(Chevron, { rotate: isOpen ? 90 : 270 }), rightSectionPointerEvents: "none", rightSectionProps: {
+                    }, data: data, placeholder: placeHolderValue, value: value, name: name || '', onChange: onChange, comboboxProps: { zIndex: 1000 }, error: ErrorSection, onFocus: function () { return setIsFocused(true); }, onBlur: handleBlur, inputWrapperOrder: ['label', 'input', 'description', 'error'], description: !error && description && jsx(Text, { variant: "xs", children: description }), descriptionProps: __assign({ className: styles$4.description }, inputWrapperSlotElement), errorProps: __assign({ className: styles$4.error }, inputWrapperSlotElement), rightSection: jsx(Chevron, { rotate: isOpen ? 90 : 270 }), rightSectionPointerEvents: "none", rightSectionProps: {
                         className: styles$4.chevron,
                     }, withCheckIcon: false, onDropdownOpen: function () { return setIsOpen(true); }, onDropdownClose: function () { return setIsOpen(false); }, disabled: disabled, searchable: searchable, allowDeselect: false, autoComplete: "new-password", renderOption: renderOption }) })] }));
 };
@@ -1795,16 +1857,16 @@ var Textarea = function (_a) {
     var _j = useState(false), isHovered = _j[0], setIsHovered = _j[1];
     var showLabel = !hideLabel && (isFocused || value.trim());
     var ErrorSection = useMemo(function () {
-        return holdSpace && (jsxs(Flex, { className: styles$m.error, gap: 4, ml: 0, style: { visibility: error ? 'visible' : 'hidden' }, children: [jsx(Info, { width: "18px", height: "18px", viewBox: "0 0 24 24", stroke: "var(--color-red-300)" }), jsx(Text, { variant: "xs", className: classNames(styles$m.errorText), children: error })] }));
+        return holdSpace && (jsxs(Flex, { className: styles$o.error, gap: 4, ml: 0, style: { visibility: error ? 'visible' : 'hidden' }, children: [jsx(Info, { width: "18px", height: "18px", viewBox: "0 0 24 24", stroke: "var(--color-red-300)" }), jsx(Text, { variant: "xs", className: classNames(styles$o.errorText), as: "span", children: capitalizeFirstSentenceLetter(error) })] }));
     }, [error]);
-    return (jsxs("div", { className: styles$m.container, children: [showLabel && (jsx("label", { className: classNames(styles$m.label, (_b = {},
-                    _b[styles$m.labelError] = error && !isFocused,
-                    _b[styles$m.labelFocused] = isFocused || isHovered,
+    return (jsxs("div", { className: styles$o.container, children: [showLabel && (jsx("label", { className: classNames(styles$o.label, (_b = {},
+                    _b[styles$o.labelError] = error && !isFocused,
+                    _b[styles$o.labelFocused] = isFocused || isHovered,
                     _b)), children: label })), jsx("div", { onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onFocus: function () { return setIsFocused(true); }, onBlur: function () { return setIsFocused(false); }, children: jsx(Textarea$1, __assign({ classNames: {
-                        input: classNames(styles$m.input, (_c = {},
-                            _c[styles$m.inputError] = error,
+                        input: classNames(styles$o.input, (_c = {},
+                            _c[styles$o.inputError] = error,
                             _c)),
-                    }, placeholder: placeholder !== null && placeholder !== undefined ? placeholder : label, name: name, error: ErrorSection, description: !error && jsx(Text, { variant: "xs", children: description }), descriptionProps: { className: styles$m.description }, errorProps: { className: styles$m.error }, inputWrapperOrder: ['label', 'input', 'description', 'error'], value: value, onChange: onChange, autosize: rest.h ? false : rest.autosize, minRows: 2 }, rest, { styles: {
+                    }, placeholder: placeholder !== null && placeholder !== undefined ? placeholder : label, name: name, error: ErrorSection, description: !error && jsx(Text, { variant: "xs", children: description }), descriptionProps: inputDescriptionProps, errorProps: inputErrorProps, inputWrapperOrder: ['label', 'input', 'description', 'error'], value: value, onChange: onChange, autosize: rest.h ? false : rest.autosize, minRows: 2 }, rest, { styles: {
                         input: {
                             height: typeof rest.h === 'string' || typeof rest.h === 'number'
                                 ? rest.h
@@ -2050,5 +2112,5 @@ var World = function (_a) {
 };
 World.displayName = 'World';
 
-export { Bell as $, Accordion as A, Badge as B, Card as C, DateInput as D, EnterCodeInput as E, FileInput as F, Text as G, Textarea as H, IncrementNumber as I, ToastContainer as J, Tooltip as K, Link as L, Message as M, NavBar as N, AIGenerate as O, Pagination as P, AIPrompt as Q, RadioButton as R, SegmentedControl as S, Table as T, AIRedo as U, AISearch as V, Alert as W, Archive as X, Arrow as Y, Attachment as Z, AvatarPlaceholder as _, AccordionItem as a, Calendar as a0, Camera as a1, Cat as a2, Chat as a3, Check as a4, Chevron as a5, ChevronCollapse as a6, Clock as a7, Close as a8, Cloud as a9, Refresh as aA, Remove as aB, Search as aC, Shield as aD, StepIndicator as aE, ThreeDots as aF, ThumbsDown as aG, Tick as aH, Umbrello as aI, Upload as aJ, Visa as aK, Warning as aL, World as aM, capitalizeFirstSentenceLetter as aN, CloudUpload as aa, CreditCard as ab, Delete as ac, Document as ad, Dog as ae, EyeHide as af, EyeShow as ag, Fingerprint as ah, Google as ai, Grid as aj, Hamburger as ak, HappyFace as al, House as am, HouseTime as an, Identification as ao, Info as ap, Location as aq, Mail as ar, Menu as as, MenuTouched as at, Notification as au, Open as av, Pets as aw, Phone as ax, Plaid as ay, Plus as az, AccordionControl as b, AccordionPanel as c, ActionIcon as d, Animation as e, Autocomplete as f, getDefaultExportFromCjs as g, badgeVariantMap as h, Button as i, cardStatusVariantMap as j, CardStatus as k, Checkbox as l, Chip as m, Dropdown as n, FileUpload as o, Input as p, LinkModal as q, Loader as r, Modal as s, Multiselect as t, NavBarSide as u, PasswordInput as v, Select as w, StatusBadge as x, Stepper as y, Tabs as z };
-//# sourceMappingURL=index-Di2CTm6m.js.map
+export { Attachment as $, Accordion as A, Badge as B, Card as C, DateInput as D, EnterCodeInput as E, FileInput as F, Stepper as G, Tabs as H, IncrementNumber as I, Text as J, Textarea as K, Link as L, Message as M, NavBar as N, ToastContainer as O, Pagination as P, Tooltip as Q, RadioButton as R, SegmentedControl as S, Table as T, AIGenerate as U, AIPrompt as V, AIRedo as W, AISearch as X, Alert as Y, Archive as Z, Arrow as _, AccordionItem as a, AvatarPlaceholder as a0, Bell as a1, Calendar as a2, Camera as a3, Cat as a4, Chat as a5, Check as a6, Chevron as a7, ChevronCollapse as a8, Clock as a9, Plaid as aA, Plus as aB, Refresh as aC, Remove as aD, Search as aE, Shield as aF, StepIndicator as aG, ThreeDots as aH, ThumbsDown as aI, Tick as aJ, Umbrello as aK, Upload as aL, Visa as aM, Warning as aN, World as aO, capitalizeFirstSentenceLetter as aP, Close as aa, Cloud as ab, CloudUpload as ac, CreditCard as ad, Delete as ae, Document as af, Dog as ag, EyeHide as ah, EyeShow as ai, Fingerprint as aj, Google as ak, Grid as al, Hamburger as am, HappyFace as an, House as ao, HouseTime as ap, Identification as aq, Info as ar, Location as as, Mail as at, Menu as au, MenuTouched as av, Notification as aw, Open as ax, Pets as ay, Phone as az, AccordionControl as b, AccordionPanel as c, ActionIcon as d, Animation as e, Autocomplete as f, getDefaultExportFromCjs as g, Avatar as h, badgeVariantMap as i, Button as j, cardStatusVariantMap as k, CardStatus as l, Checkbox as m, Chip as n, Dropdown as o, FileUpload as p, Input as q, LinkModal as r, Loader as s, Modal as t, Multiselect as u, NavBarSide as v, PasswordInput as w, Pill as x, Select as y, StatusBadge as z };
+//# sourceMappingURL=index-Dpa5RAiC.js.map