@g4rcez/components 0.0.62 → 0.0.64

package/dist/src/components/floating/modal.js

@@ -96,5 +96,5 @@ export const Modal = ({ type: _type = "dialog", resizer = true, overlayClickClos
     const onClose = () => props.onChange(false);
     return (_jsxs(Fragment, { children: [props.trigger ? (_jsx(Fragment, { children: props.asChild ? (_jsx(Slot, { ref: refs.setReference, ...getReferenceProps({
                         layoutId: props.layoutId,
-                    }), children: Trigger })) : (_jsx(motion.button, { ref: refs.setReference, ...getReferenceProps(), layoutId: props.layoutId, type: "button", children: Trigger })) })) : null, _jsx(FloatingPortal, { children: _jsx(AnimatePresence, { presenceAffectsLayout: true, children: props.open ? (_jsx(FloatingOverlay, { lockScroll: true, className: `inset-0 isolate z-overlay h-[100dvh] !overflow-clip bg-floating-overlay/70 ${type === "drawer" ? "" : "grid items-end justify-center lg:items-center"}`, children: _jsx(FloatingFocusManager, { visuallyHiddenDismiss: true, modal: true, closeOnFocusOut: true, context: context, children: _jsxs(motion.div, { exit: "exit", animate: "enter", initial: "initial", variants: animation, ref: refs.setFloating, "aria-modal": props.open, layoutId: props.layoutId, "aria-labelledby": headingId, "aria-describedby": descriptionId, className: variants({ position, type }), style: type === "drawer" ? { width: value } : { height: value }, ...getFloatingProps(), children: [props.title ? (_jsx("header", { className: "relative w-full", children: props.title ? (_jsx("h2", { className: "border-b border-floating-border px-8 pb-2 text-3xl font-medium leading-relaxed", children: props.title })) : null })) : null, _jsx("section", { className: "flex-1 overflow-y-auto px-8 py-1", children: props.children }), props.footer ? (_jsx("footer", { className: "w-full border-t border-floating-border px-8 pt-4", children: props.footer })) : null, closable ? (_jsx("nav", { className: "absolute right-4 top-1 z-floating", children: _jsx("button", { type: "button", onClick: onClose, className: "p-1 opacity-70 transition-colors hover:text-danger hover:opacity-100 focus:text-danger", children: _jsx(XIcon, {}) }) })) : null, useResizer && resizer ? (_jsx(Draggable, { onChange: props.onChange, parent: refs.floating, position: position, sheet: type === "sheet", value: value })) : null] }) }) })) : null }) })] }));
+                    }), children: Trigger })) : (_jsx(motion.button, { ref: refs.setReference, ...getReferenceProps(), layoutId: props.layoutId, type: "button", children: Trigger })) })) : null, _jsx(FloatingPortal, { children: _jsx(AnimatePresence, { presenceAffectsLayout: true, children: props.open ? (_jsx(FloatingOverlay, { lockScroll: true, className: `inset-0 isolate z-overlay h-[100dvh] !overflow-clip bg-floating-overlay/70 ${type === "drawer" ? "" : "flex items-start justify-center p-10"}`, children: _jsx(FloatingFocusManager, { visuallyHiddenDismiss: true, modal: true, closeOnFocusOut: true, context: context, children: _jsxs(motion.div, { exit: "exit", animate: "enter", initial: "initial", variants: animation, ref: refs.setFloating, "aria-modal": props.open, layoutId: props.layoutId, "aria-labelledby": headingId, "aria-describedby": descriptionId, className: variants({ position, type }), style: type === "drawer" ? { width: value } : { height: value }, ...getFloatingProps(), children: [props.title ? (_jsx("header", { className: "relative w-full", children: props.title ? (_jsx("h2", { className: "border-b border-floating-border px-8 pb-2 text-3xl font-medium leading-relaxed", children: props.title })) : null })) : null, _jsx("section", { className: "flex-1 overflow-y-auto px-8 py-1", children: props.children }), props.footer ? (_jsx("footer", { className: "w-full border-t border-floating-border px-8 pt-4", children: props.footer })) : null, closable ? (_jsx("nav", { className: "absolute right-4 top-1 z-floating", children: _jsx("button", { type: "button", onClick: onClose, className: "p-1 opacity-70 transition-colors hover:text-danger hover:opacity-100 focus:text-danger", children: _jsx(XIcon, {}) }) })) : null, useResizer && resizer ? (_jsx(Draggable, { onChange: props.onChange, parent: refs.floating, position: position, sheet: type === "sheet", value: value })) : null] }) }) })) : null }) })] }));
 };

package/dist/src/components/form/autocomplete.d.ts

@@ -12,6 +12,7 @@ export type AutocompleteOptionProps = Omit<React.HTMLProps<HTMLLIElement>, "chil
 export declare const Option: React.ForwardRefExoticComponent<Omit<AutocompleteOptionProps, "ref"> & React.RefAttributes<HTMLLIElement>>;
 export type AutocompleteProps = Omit<InputFieldProps<"input">, "value"> & {
     value?: string;
+    emptyMessage?: string;
     dynamicOption?: boolean;
     options: AutocompleteItemProps[];
 };

package/dist/src/components/form/autocomplete.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"autocomplete.d.ts","sourceRoot":"","sources":["../../../../src/components/form/autocomplete.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAoF,MAAM,OAAO,CAAC;AAIzG,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,MAAM,MAAM,qBAAqB,GAAG,WAAW,GAAG;IAAE,MAAM,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAErF,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,EAAE,UAAU,CAAC,GAAG;IACrF,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,qBAAqB,CAAC;CACjC,CAAC;AAIF,eAAO,MAAM,MAAM,4GA2BjB,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,GAAG;IACtE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,qBAAqB,EAAE,CAAC;CACpC,CAAC;AAaF,eAAO,MAAM,YAAY,yGAyRxB,CAAC"}
+{"version":3,"file":"autocomplete.d.ts","sourceRoot":"","sources":["../../../../src/components/form/autocomplete.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAoF,MAAM,OAAO,CAAC;AAKzG,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,MAAM,MAAM,qBAAqB,GAAG,WAAW,GAAG;IAAE,MAAM,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAErF,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,EAAE,UAAU,CAAC,GAAG;IACrF,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,qBAAqB,CAAC;CACjC,CAAC;AAIF,eAAO,MAAM,MAAM,4GA2BjB,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,GAAG;IACtE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,qBAAqB,EAAE,CAAC;CACpC,CAAC;AAaF,eAAO,MAAM,YAAY,yGAgSxB,CAAC"}

package/dist/src/components/form/autocomplete.js

@@ -2,7 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { autoUpdate, FloatingFocusManager, FloatingPortal, offset, size, useDismiss, useFloating, useInteractions, useListNavigation, useRole, useTransitionStyles, } from "@floating-ui/react";
 import Fuzzy from "fuzzy-search";
-import { CheckIcon, ChevronDown } from "lucide-react";
+import { CheckIcon, ChevronDown, XIcon } from "lucide-react";
 import { forwardRef, Fragment, useEffect, useRef, useState } from "react";
 import { useTranslations } from "../../hooks/use-components-provider";
 import { css, dispatchInput, initializeInputDataset } from "../../lib/dom";
@@ -15,7 +15,7 @@ export const Option = forwardRef(({ selected, active, onClick, option, ...props
     if (option.hidden) {
         return null;
     }
-    return (_jsx("li", { ...props, ref: ref, role: "option", "aria-selected": active, className: "w-full border-b border-tooltip-border last:border-transparent", children: _jsxs("button", { type: "button", "aria-busy": option.disabled, "aria-checked": active, "aria-current": active, "aria-selected": active, onClick: onClick, "data-value": option.value, className: `flex w-full cursor-pointer justify-between p-2 text-left ${active ? "bg-primary-hover text-primary-foreground" : ""} ${selected ? "bg-primary text-primary-foreground" : ""}`, children: [_jsx(Label, { ...props, label: option.label, value: option.value, children: children }), active ? (_jsx("span", { children: _jsx(CheckIcon, { "aria-hidden": true, className: "text-current", absoluteStrokeWidth: true, strokeWidth: 2, size: 22 }) })) : null] }) }));
+    return (_jsx("li", { ...props, ref: ref, role: "option", "aria-selected": active, className: "w-full min-w-0 container border-b border-tooltip-border last:border-b-0", children: _jsxs("button", { type: "button", "aria-checked": active, "aria-current": active, "aria-selected": active, onClick: onClick, "data-value": option.value, "aria-busy": option.disabled, className: `flex w-full cursor-pointer justify-between p-2 text-left ${active ? "bg-primary-hover text-primary-foreground" : ""} ${selected ? "bg-primary text-primary-foreground" : ""}`, children: [_jsx(Label, { ...props, label: option.label, value: option.value, children: children }), active ? (_jsx("span", { children: _jsx(CheckIcon, { "aria-hidden": true, className: "text-current", absoluteStrokeWidth: true, strokeWidth: 2, size: 22 }) })) : null] }) }));
 });
 const transitionStyles = {
     duration: 300,
@@ -25,15 +25,16 @@ const transitionStyles = {
 };
 const fuzzyOptions = { caseSensitive: false, sort: false };
 const emptyRef = [];
-export const Autocomplete = forwardRef(({ options, dynamicOption = false, feedback = null, labelClassName, interactive, rightLabel, optionalText, container, hideLeft = false, right, left, error, required = false, ...props }, externalRef) => {
-    const defaults = props.value ?? props.defaultValue ?? "";
+export const Autocomplete = forwardRef(({ left, error, right, options, container, rightLabel, interactive, emptyMessage, optionalText, labelClassName, feedback = null, hideLeft = false, required = false, dynamicOption = false, ...props }, externalRef) => {
     const translation = useTranslations();
+    const defaults = props.value ?? props.defaultValue ?? "";
     const [open, setOpen] = useState(false);
     const [shadow, setShadow] = useState("");
     const [value, setValue] = useState(defaults);
     const [label, setLabel] = useState(() => options.find((x) => x.value === defaults)?.label ?? defaults);
     const [index, setIndex] = useState(null);
     const listRef = useRef(emptyRef);
+    const fieldset = useRef(null);
     const innerOptions = dynamicOption && shadow !== ""
         ? [
             {
@@ -63,16 +64,18 @@ export const Autocomplete = forwardRef(({ options, dynamicOption = false, feedba
         middleware: [
             offset(4),
             size({
-                elementContext: "reference",
                 padding: 10,
+                elementContext: "reference",
                 apply(a) {
                     const html = a.elements.reference;
                     const parent = html.parentElement;
-                    const w = parent?.getBoundingClientRect().width;
+                    const max = fieldset.current?.getBoundingClientRect().width;
+                    const w = parent?.getBoundingClientRect().width || 0;
                     Object.assign(a.elements.floating.style, {
                         width: `${w}px`,
-                        maxWidth: `${w}px`,
-                        minWidth: "max-content",
+                        overflowY: "auto",
+                        maxWidth: `${max}px`,
+                        minWidth: `${max}px`,
                         maxHeight: `${Math.min(250, a.availableHeight)}px`,
                     });
                 },
@@ -131,16 +134,21 @@ export const Autocomplete = forwardRef(({ options, dynamicOption = false, feedba
         setOpen(true);
         setShadow("");
     };
-    const onClose = () => {
+    const onOpenCaret = () => {
+        setOpen(true);
+        refs.reference.current?.focus();
+    };
+    const onClose = (e) => {
+        e.stopPropagation();
+        refs.reference.current?.setAttribute("data-value", "");
+        dispatchInput(refs.reference.current, "");
         setShadow("");
         setValue("");
-        refs.reference.current?.setAttribute("data-value", "");
         setLabel("");
-        dispatchInput(refs.reference.current, "");
         setOpen(false);
     };
     const id = props.id || props.name;
-    return (_jsxs(InputField, { ...props, left: left, error: error, form: props.form, name: props.name, feedback: feedback, hideLeft: hideLeft, required: required, title: props.title, container: container, rightLabel: rightLabel, interactive: interactive, id: props.name || props.id, optionalText: optionalText, componentName: "autocomplete", labelClassName: labelClassName, placeholder: props.placeholder, right: _jsxs("span", { className: "flex items-center gap-0.5", children: [_jsxs("button", { type: "button", className: "transition-colors link:text-primary", children: [_jsx(ChevronDown, { size: 20 }), _jsx("span", { className: "sr-only", children: translation.inputCaretDown })] }), value ? (_jsx("button", { type: "button", onClick: onClose, className: "transition-colors link:text-danger", children: _jsx("svg", { width: "15", height: "15", viewBox: "0 0 15 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z", fill: "currentColor", fillRule: "evenodd", clipRule: "evenodd" }) }) })) : null] }), children: [_jsx("input", { ...getReferenceProps({
+    return (_jsxs(InputField, { ...props, left: left, error: error, ref: fieldset, form: props.form, name: props.name, feedback: feedback, hideLeft: hideLeft, required: required, title: props.title, container: container, rightLabel: rightLabel, disabled: props.disabled, interactive: interactive, id: props.name || props.id, optionalText: optionalText, componentName: "autocomplete", labelClassName: labelClassName, placeholder: props.placeholder, right: _jsxs("span", { className: "flex items-center gap-0.5", children: [_jsxs("button", { disabled: props.disabled, onClick: onOpenCaret, type: "button", className: "transition-colors disabled:link:text-disabled link:text-primary disabled:text-disabled", children: [_jsx(ChevronDown, { size: 20 }), _jsx("span", { className: "sr-only", children: translation.inputCaretDown })] }), value ? (_jsxs("button", { type: "button", onClick: onClose, className: "isolate relative transition-colors link:text-danger", children: [_jsx(XIcon, { size: 15 }), _jsx("span", { className: "sr-only", children: translation.inputCloseValue })] })) : null] }), children: [_jsx("input", { ...getReferenceProps({
                     ...props,
                     onChange,
                     onFocus,
@@ -165,20 +173,20 @@ export const Autocomplete = forwardRef(({ options, dynamicOption = false, feedba
                             }
                         }
                     },
-                }), "data-value": value, "data-error": !!error, "data-name": id, "data-target": id, required: required, value: open ? shadow : label || value, "aria-autocomplete": "list", autoComplete: "off", className: css("input placeholder-input-mask group h-input-height w-full flex-1", "rounded-md bg-transparent px-input-x py-input-y text-foreground", "outline-none transition-colors focus:ring-2 focus:ring-inset focus:ring-primary", "group-error:text-danger group-error:placeholder-input-mask-error", "group-focus-within:border-primary group-hover:border-primary", props.className) }), _jsx("input", { id: id, name: id, type: "hidden", "data-origin": id, ref: externalRef, required: required, defaultValue: props.value || value || undefined }), _jsx(FloatingPortal, { preserveTabOrder: true, children: open ? (_jsx(FloatingFocusManager, { guards: true, returnFocus: false, context: context, initialFocus: -1, visuallyHiddenDismiss: true, children: _jsxs("ul", { ...getFloatingProps({
+                }), "data-value": value, "data-error": !!error, "data-name": id, "data-target": id, required: required, value: open ? shadow : label || value, "aria-autocomplete": "list", autoComplete: "off", className: css("input placeholder-input-mask group h-input-height w-full flex-1", "rounded-md bg-transparent px-input-x py-input-y text-foreground", "outline-none transition-colors focus:ring-2 focus:ring-inset focus:ring-primary", "group-error:text-danger group-error:placeholder-input-mask-error", "group-focus-within:border-primary group-hover:border-primary line-clamp-1", props.className) }), _jsx("input", { id: id, name: id, type: "hidden", "data-origin": id, ref: externalRef, required: required, defaultValue: props.value || value || undefined }), _jsx(FloatingPortal, { preserveTabOrder: true, children: open ? (_jsx(FloatingFocusManager, { disabled: props.disabled, guards: true, returnFocus: false, context: context, initialFocus: -1, visuallyHiddenDismiss: true, children: _jsxs("ul", { ...getFloatingProps({
                             ref: refs.setFloating,
                             style: {
                                 position: strategy,
-                                left: (x ?? 0) + (!!value ? 26 : 16),
+                                left: (x ?? 0) + (!!value ? 26 : 18),
                                 top: y ?? 0,
                                 ...transitions.styles,
                             },
-                        }), "data-floating": "true", className: "z-floating m-0 origin-[top_center] list-none overflow-auto overflow-y-auto overscroll-contain rounded-b-lg rounded-t-lg border border-floating-border bg-floating-background p-0 text-foreground shadow-floating", children: [list.map((option, i) => {
+                        }), "data-floating": "true", className: "container z-floating m-0 origin-[top_center] list-none overflow-auto overflow-y-auto overscroll-contain rounded-b-lg rounded-t-lg border border-floating-border bg-floating-background p-0 text-foreground shadow-floating", children: [list.map((option, i) => {
                                 const active = value === option.value || value === option.label;
                                 return (_jsx(Option, { ...getItemProps({
                                         onClick: () => onSelect(option, i),
                                         ref: (node) => void (listRef.current[i] = node),
                                         selected: index === i,
                                     }), option: option, active: active, selected: index === i }, `${option.value}-option`));
-                            }), list.length === 0 ? (_jsx("li", { role: "option", className: "w-full border-b border-tooltip-border last:border-transparent", children: _jsx("span", { className: "flex w-full justify-between p-2 text-left text-disabled", children: translation.autocompleteEmpty }) })) : null] }) })) : null })] }));
+                            }), list.length === 0 ? (_jsx("li", { role: "option", className: "w-full border-b border-tooltip-border last:border-b-0", children: _jsx("span", { className: "flex w-full justify-between p-2 text-left text-disabled", children: emptyMessage || translation.autocompleteEmpty }) })) : null] }) })) : null })] }));
 });

package/dist/src/components/form/date-picker.d.ts

@@ -4,7 +4,7 @@ import { CalendarProps } from "../display/calendar";
 import { InputProps } from "./input";
 export type DatePickerProps = Override<InputProps, CalendarProps<"date">>;
 export declare const DatePicker: React.ForwardRefExoticComponent<(Omit<Omit<InputProps, "onChange" | "date" | "locale" | "markRange" | "markToday" | "rangeMode" | "styles" | "changeOnlyOnClick" | "onChangeYear" | "onChangeMonth" | "RenderOnDay" | "disabledDate" | "labelRange"> & Partial<{
-    locale: import("the-mask-input").Locales;
+    locale: import("the-mask-input/dist/src/types").Locales;
     markRange: boolean;
     markToday: boolean;
     rangeMode: boolean;
@@ -33,7 +33,7 @@ export declare const DatePicker: React.ForwardRefExoticComponent<(Omit<Omit<Inpu
     date: Date;
     onChange: (d: Date | undefined) => void;
 }>, "ref"> | Omit<Omit<InputProps, "onChange" | "date" | "locale" | "markRange" | "markToday" | "rangeMode" | "styles" | "changeOnlyOnClick" | "onChangeYear" | "onChangeMonth" | "RenderOnDay" | "disabledDate" | "labelRange"> & Partial<{
-    locale: import("the-mask-input").Locales;
+    locale: import("the-mask-input/dist/src/types").Locales;
     markRange: boolean;
     markToday: boolean;
     rangeMode: boolean;

package/dist/src/components/form/free-text.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"free-text.d.ts","sourceRoot":"","sources":["../../../../src/components/form/free-text.tsx"],"names":[],"mappings":"AACA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAC7D,OAAO,SAAS,EAAE,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEvD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,aAAa,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAE3E,KAAK,WAAW,GAAG,OAAO,GAAG,UAAU,CAAC;AAExC,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,WAAW,EAAE,UAAU,SAAS,MAAM,IAAI,QAAQ,CAClF,UAAU,GAAG,aAAa,EAC1B,eAAe,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,UAAU,CAAA;CAAE,CAAC,CACnE,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,CAAC,SAAS,WAAW,EAAE,IAAI,SAAS,gBAAgB,GAAG,mBAAmB,EAAE,KAAK,SAAS,MAAM,WAClH,OAAO,GAAG,UAAU,GAAG,OAAO,SAAS,eACnC,OAAO,GAAG,UAAU,gBACnB,aAAa,CAAC,CAAC,EAAE,KAAK,CAAC,aAC1B,CAAC,EAAE,EAAE,IAAI,KAAK,MAAM,IAAI,sCAmGtC,CAAC"}
+{"version":3,"file":"free-text.d.ts","sourceRoot":"","sources":["../../../../src/components/form/free-text.tsx"],"names":[],"mappings":"AACA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAC7D,OAAO,SAAS,EAAE,EAAE,UAAU,EAAY,MAAM,gBAAgB,CAAC;AAEjE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,aAAa,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAE3E,KAAK,WAAW,GAAG,OAAO,GAAG,UAAU,CAAC;AAExC,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,WAAW,EAAE,UAAU,SAAS,MAAM,IAAI,QAAQ,CAClF,UAAU,GAAG,aAAa,EAC1B,eAAe,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,UAAU,CAAA;CAAE,CAAC,CACnE,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,CAAC,SAAS,WAAW,EAAE,IAAI,SAAS,gBAAgB,GAAG,mBAAmB,EAAE,KAAK,SAAS,MAAM,WAClH,OAAO,GAAG,UAAU,GAAG,OAAO,SAAS,eACnC,OAAO,GAAG,UAAU,gBACnB,aAAa,CAAC,CAAC,EAAE,KAAK,CAAC,aAC1B,CAAC,EAAE,EAAE,IAAI,KAAK,MAAM,IAAI,sCAqGtC,CAAC"}

package/dist/src/components/form/free-text.js

@@ -34,7 +34,7 @@ export const createFreeText = (Element, elementName, defaultProps, register) =>
                 input.removeEventListener("keydown", goNextInputImpl);
             };
         }, []);
-        return (_jsx(InputField, { ...defaultProps, componentName: elementName, info: info, container: container, error: error, feedback: feedback, hideLeft: hideLeft, left: left, optionalText: optionalText, right: right, rightLabel: rightLabel, interactive: interactive, form: props.form, id: props.name || props.id, name: props.name, labelClassName: labelClassName, title: props.title, placeholder: props.placeholder, required: props.required, children: _jsx(Render, { ...defaultProps, ...props, id: id, name: id, type: type, "data-next": next, "aria-busy": props.disabled, "aria-disabled": props.disabled, "aria-readonly": props.readOnly, ref: mergeRefs(ref, inputRef), className: css("input placeholder-input-mask group h-input-height w-full flex-1", "rounded-md bg-transparent px-input-x py-input-y text-foreground", "outline-none transition-colors focus:ring-2 focus:ring-inset focus:ring-primary", "group-error:text-danger group-error:placeholder-input-mask-error", "resize-y group-focus-within:border-primary group-hover:border-primary", props.className) }) }));
+        return (_jsx(InputField, { ...defaultProps, componentName: elementName, info: info, container: container, error: error, feedback: feedback, hideLeft: hideLeft, left: left, optionalText: optionalText, right: right, rightLabel: rightLabel, interactive: interactive, form: props.form, id: props.name || props.id, name: props.name, labelClassName: labelClassName, title: props.title, placeholder: props.placeholder, required: props.required, disabled: props.disabled, children: _jsx(Render, { ...defaultProps, ...props, id: id, name: id, type: type, "data-next": next, "aria-busy": props.disabled, "aria-disabled": props.disabled, "aria-readonly": props.readOnly, ref: mergeRefs(ref, inputRef), className: css("input placeholder-input-mask group h-input-height w-full flex-1", "rounded-md bg-transparent px-input-x py-input-y text-foreground", "outline-none transition-colors focus:ring-2 focus:ring-inset focus:ring-primary", "group-error:text-danger group-error:placeholder-input-mask-error", "resize-y group-focus-within:border-primary group-hover:border-primary", "disabled:cursor-not-allowed disabled:text-disabled", props.className) }) }));
     });
     return FreeText;
 };

package/dist/src/components/form/input-field.d.ts

@@ -27,5 +27,5 @@ export type InputFieldProps<T extends "input" | "select" | "textarea"> = Polymor
     name: string;
     placeholder: string;
 }>, T>;
-export declare const InputField: <T extends "input" | "select" | "textarea">({ optionalText: _optionalText, left, rightLabel, container, feedback, interactive, right, info, children, error, form, id, labelClassName, name, title, componentName, placeholder, hideLeft, required, }: PropsWithChildren<InputFieldProps<T>>) => import("react/jsx-runtime").JSX.Element;
+export declare const InputField: <T extends "input" | "select" | "textarea">(props: PropsWithChildren<InputFieldProps<T>>) => React.ReactElement;
 //# sourceMappingURL=input-field.d.ts.map

package/dist/src/components/form/input-field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input-field.d.ts","sourceRoot":"","sources":["../../../../src/components/form/input-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG3D,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAGrD,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,iBAAiB,CAC/C,OAAO,CAAC;IACJ,IAAI,EAAE,KAAK,CAAC;IACZ,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;CACzB,CAAC,CACL,CAAC;AAEF,eAAO,MAAM,aAAa,iEAA0E,aAAa,4CA6ChH,CAAC;AAEF,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,OAAO,GAAG,QAAQ,GAAG,UAAU,IAAI,gBAAgB,CACrF,OAAO,CAAC;IACJ,aAAa,EAAE,MAAM,CAAC;IACtB,IAAI,EAAE,KAAK,CAAC;IACZ,cAAc,EAAE,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,KAAK,CAAC;IACZ,QAAQ,EAAE,KAAK,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,KAAK,CAAC;IACb,UAAU,EAAE,KAAK,CAAC;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;CACvB,CAAC,EACF,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,OAAO,GAAG,QAAQ,GAAG,UAAU,6MAoBjE,iBAAiB,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,4CAyCvC,CAAC"}
+{"version":3,"file":"input-field.d.ts","sourceRoot":"","sources":["../../../../src/components/form/input-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAwB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAGvE,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAGrD,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,iBAAiB,CAC/C,OAAO,CAAC;IACJ,IAAI,EAAE,KAAK,CAAC;IACZ,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;CACzB,CAAC,CACL,CAAC;AAEF,eAAO,MAAM,aAAa,iEAA0E,aAAa,4CA6ChH,CAAC;AAEF,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,OAAO,GAAG,QAAQ,GAAG,UAAU,IAAI,gBAAgB,CACrF,OAAO,CAAC;IACJ,aAAa,EAAE,MAAM,CAAC;IACtB,IAAI,EAAE,KAAK,CAAC;IACZ,cAAc,EAAE,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,KAAK,CAAC;IACZ,QAAQ,EAAE,KAAK,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,KAAK,CAAC;IACb,UAAU,EAAE,KAAK,CAAC;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;CACvB,CAAC,EACF,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,CAAC,CAAC,SAAS,OAAO,GAAG,QAAQ,GAAG,UAAU,EAAE,KAAK,EAAE,iBAAiB,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,YA0EpH,CAAC"}

package/dist/src/components/form/input-field.js

@@ -1,14 +1,14 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { CheckCircle, InfoIcon, XCircle } from "lucide-react";
-import { Fragment } from "react";
+import { forwardRef, Fragment } from "react";
 import { useTranslations } from "../../hooks/use-components-provider";
 import { css } from "../../lib/dom";
 import { Tooltip } from "../floating/tooltip";
-export const InputFeedback = ({ reportStatus, hideLeft = false, className, info, children, title }) => (_jsxs("div", { className: css("w-full justify-between", hideLeft && children === null ? "hidden" : "flex", className), children: [hideLeft ? null : (_jsxs("span", { className: "flex items-center gap-1 transition-colors group-focus-within:text-primary group-hover:text-primary group-error:text-danger", children: [title, reportStatus || info ? (_jsxs("span", { className: "flex items-center justify-center gap-1", children: [info ? (_jsx(Tooltip, { as: "button", type: "button", title: _jsxs("span", { className: "cursor-help", children: [_jsx("span", { className: "sr-only", children: info }), _jsx(InfoIcon, { className: "aspect-square size-3", "aria-hidden": "true", size: 16, strokeWidth: 1, absoluteStrokeWidth: true })] }), children: _jsx("div", { className: "w-full max-w-48 whitespace-break-spaces break-words", children: info }) })) : null, reportStatus ? (_jsxs(Fragment, { children: [_jsx(CheckCircle, { className: "hidden aspect-square size-3 opacity-0 transition-opacity group-assert:block group-assert:text-success group-assert:opacity-100", "aria-hidden": "true", size: 16, strokeWidth: 1, absoluteStrokeWidth: true }), _jsx(XCircle, { className: "hidden aspect-square size-3 opacity-0 transition-opacity group-error:block group-error:opacity-100", "aria-hidden": "true", size: 16, strokeWidth: 1, absoluteStrokeWidth: true })] })) : null] })) : null] })), children] }));
-export const InputField = ({ optionalText: _optionalText, left, rightLabel, container, feedback, interactive, right, info, children, error, form, id, labelClassName = "", name, title, componentName, placeholder, hideLeft = false, required, }) => {
+export const InputFeedback = ({ reportStatus, hideLeft = false, className, info, children, title }) => (_jsxs("div", { className: css("w-full justify-between", hideLeft && children === null ? "hidden" : "flex", className), children: [hideLeft ? null : (_jsxs("span", { className: "flex items-center gap-1 transition-colors group-focus-within:text-primary group-hover:text-primary group-disabled:text-disabled group-error:text-danger", children: [title, reportStatus || info ? (_jsxs("span", { className: "flex items-center justify-center gap-1", children: [info ? (_jsx(Tooltip, { as: "button", type: "button", title: _jsxs("span", { className: "cursor-help", children: [_jsx("span", { className: "sr-only", children: info }), _jsx(InfoIcon, { className: "aspect-square size-3", "aria-hidden": "true", size: 16, strokeWidth: 1, absoluteStrokeWidth: true })] }), children: _jsx("div", { className: "w-full max-w-48 whitespace-break-spaces break-words", children: info }) })) : null, reportStatus ? (_jsxs(Fragment, { children: [_jsx(CheckCircle, { className: "hidden aspect-square size-3 opacity-0 transition-opacity group-assert:block group-assert:text-success group-assert:opacity-100", "aria-hidden": "true", size: 16, strokeWidth: 1, absoluteStrokeWidth: true }), _jsx(XCircle, { className: "hidden aspect-square size-3 opacity-0 transition-opacity group-error:block group-error:opacity-100", "aria-hidden": "true", size: 16, strokeWidth: 1, absoluteStrokeWidth: true })] })) : null] })) : null] })), children] }));
+export const InputField = forwardRef(({ optionalText: _optionalText, left, rightLabel, container, feedback, interactive, right, info, children, error, form, id, labelClassName = "", name, title, componentName, placeholder, hideLeft = false, required, disabled, }, ref) => {
     const ID = id ?? name;
     const translation = useTranslations();
     const optionalText = _optionalText ?? translation.inputOptionalLabel;
-    return (_jsxs("fieldset", { form: form, "data-error": !!error, "data-component": componentName, "data-interactive": !!interactive, className: css("group grid min-h-0 min-w-0 grid-cols-1 items-baseline", container), children: [_jsxs("label", { form: form, htmlFor: ID, className: "inline-flex cursor-text flex-row flex-wrap justify-between gap-1 text-sm transition-colors empty:hidden group-error:text-danger", children: [_jsx(InputFeedback, { info: info, hideLeft: hideLeft, reportStatus: true, title: title, placeholder: placeholder, children: optionalText || rightLabel ? (_jsxs(Fragment, { children: [!required ? _jsx("span", { className: "text-opacity-70", children: optionalText }) : null, rightLabel ? _jsx(Fragment, { children: rightLabel }) : null] })) : null }), _jsxs("div", { className: `group relative flex w-full flex-row flex-nowrap items-center gap-x-2 gap-y-1 rounded-md border border-input-border bg-transparent transition-colors group-hover:border-primary group-error:border-danger ${labelClassName}`, children: [left ? _jsx("span", { className: "flex flex-nowrap gap-1 whitespace-nowrap pl-2", children: left }) : null, children, right ? _jsx("span", { className: "flex flex-nowrap gap-2 whitespace-nowrap pr-2", children: right }) : null] })] }), _jsx("p", { className: "mt-input-gap hidden flex-shrink-0 flex-grow-0 whitespace-pre-wrap text-wrap text-xs empty:mt-0 empty:hidden group-has-[input:not(:focus):invalid[data-initialized=true]]:inline-block group-error:inline-block group-error:text-danger", children: error }), _jsx("p", { className: "mt-input-gap text-xs empty:mt-0 empty:hidden group-has-[input:not(:focus):valid[data-initialized=true]]:block group-assert:block group-error:hidden", children: feedback })] }));
-};
+    return (_jsxs("fieldset", { ref: ref, form: form, disabled: disabled, "data-error": !!error, "aria-disabled": disabled, "data-component": componentName, "data-interactive": !!interactive, className: css("group grid min-h-0 min-w-0 grid-cols-1 items-baseline", container), children: [_jsxs("label", { form: form, htmlFor: ID, className: "inline-flex cursor-text flex-row flex-wrap justify-between gap-1 text-sm transition-colors empty:hidden group-disabled:cursor-not-allowed group-error:text-danger", children: [_jsx(InputFeedback, { info: info, hideLeft: hideLeft, reportStatus: true, title: title, placeholder: placeholder, children: optionalText || rightLabel ? (_jsxs(Fragment, { children: [!required ? (_jsx("span", { "aria-disabled": disabled, className: "text-opacity-70 aria-disabled:text-disabled", children: optionalText })) : null, rightLabel ? _jsx(Fragment, { children: rightLabel }) : null] })) : null }), _jsxs("div", { className: `group relative flex w-full flex-row flex-nowrap items-center gap-x-2 gap-y-1 rounded-md border border-input-border bg-transparent transition-colors group-hover:border-primary group-disabled:border-disabled group-error:border-danger ${labelClassName}`, children: [left ? _jsx("span", { className: "flex flex-nowrap gap-1 whitespace-nowrap pl-2", children: left }) : null, children, right ? _jsx("span", { className: "flex flex-nowrap gap-2 whitespace-nowrap pr-2", children: right }) : null] })] }), _jsx("p", { className: "mt-input-gap hidden flex-shrink-0 flex-grow-0 whitespace-pre-wrap text-wrap text-xs empty:mt-0 empty:hidden group-has-[input:not(:focus):invalid[data-initialized=true]]:inline-block group-error:inline-block group-error:text-danger", children: error }), _jsx("p", { className: "mt-input-gap text-xs empty:mt-0 empty:hidden group-has-[input:not(:focus):valid[data-initialized=true]]:block group-assert:block group-error:hidden", children: feedback })] }));
+});

package/dist/src/components/form/input.d.ts

@@ -1,5 +1,18 @@
-import { TheMaskProps } from "the-mask-input";
+import { AllMasks, CurrencyCode, CurrencyInputProps, CurrencyMaskTypes, Locales, PercentInputMask, PercentInputProps, TheMaskProps } from "the-mask-input";
 import { FreeTextProps } from "./free-text";
-export type InputProps = FreeTextProps<"input", TheMaskProps>;
-export declare const Input: import("react").FC<FreeTextProps<"input", TheMaskProps>>;
+export type * from "the-mask-input";
+export type InputProps = FreeTextProps<"input", ({
+    mask?: CurrencyMaskTypes;
+    locale?: Locales;
+    currency?: CurrencyCode;
+} & CurrencyInputProps) | ({
+    mask?: PercentInputMask;
+    locale?: Locales;
+    currency?: undefined;
+} & PercentInputProps) | ({
+    mask?: AllMasks | Array<string | RegExp> | ((p: string) => Array<string | RegExp> | AllMasks);
+    locale?: undefined;
+    currency?: undefined;
+} & TheMaskProps)>;
+export declare const Input: import("react").FC<FreeTextProps<"input", InputProps>>;
 //# sourceMappingURL=input.d.ts.map

package/dist/src/components/form/input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../../src/components/form/input.tsx"],"names":[],"mappings":"AACA,OAAkB,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAkB,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5D,MAAM,MAAM,UAAU,GAAG,aAAa,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC;AAE9D,eAAO,MAAM,KAAK,0DAAgG,CAAC"}
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../../src/components/form/input.tsx"],"names":[],"mappings":"AACA,OAAkB,EACd,QAAQ,EACR,YAAY,EACZ,kBAAkB,EAClB,iBAAiB,EACjB,OAAO,EACP,gBAAgB,EAChB,iBAAiB,EACjB,YAAY,EACf,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAkB,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5D,mBAAmB,gBAAgB,CAAC;AAEpC,MAAM,MAAM,UAAU,GAAG,aAAa,CAClC,OAAO,EACL,CAAC;IACG,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,YAAY,CAAC;CAC3B,GAAG,kBAAkB,CAAC,GACvB,CAAC;IACG,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB,GAAG,iBAAiB,CAAC,GACtB,CAAC;IACG,IAAI,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,MAAM,KAAK,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC,GAAG,QAAQ,CAAC,CAAC;IAC9F,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB,GAAG,YAAY,CAAC,CACtB,CAAC;AAEF,eAAO,MAAM,KAAK,wDAA8F,CAAC"}

package/dist/src/hooks/use-components-provider.d.ts

@@ -4,6 +4,7 @@ import { Locales } from "the-mask-input";
 declare const defaultTranslations: {
     emptyDataMessage: string;
     inputCaretDown: string;
+    inputCloseValue: string;
     datePickerCalendarButtonLabel: string;
     inputOptionalLabel: string;
     autocompleteEmpty: string;
@@ -62,6 +63,7 @@ export declare const useLocale: () => Locales | undefined;
 export declare const useTranslations: () => {
     emptyDataMessage: string;
     inputCaretDown: string;
+    inputCloseValue: string;
     datePickerCalendarButtonLabel: string;
     inputOptionalLabel: string;
     autocompleteEmpty: string;

package/dist/src/hooks/use-components-provider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-components-provider.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-components-provider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAA2B,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAC/F,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,QAAA,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCA+Ce;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE;;;;CASxI,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,OAAO,mBAAmB,CAAC;AAQtD,KAAK,YAAY,GAAG,OAAO,CAAC;IACxB,GAAG,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IAC3B,MAAM,EAAE,OAAO,GAAG,SAAS,CAAC;IAC5B,MAAM,EAAE,OAAO,OAAO,CAAC,IAAI,CAAC;CAC/B,CAAC,CAAC;AAEH,eAAO,MAAM,kBAAkB,UAAW,iBAAiB,CAAC,YAAY,CAAC,4CAUxE,CAAC;AAEF,eAAO,MAAM,SAAS,QAAO,OAAO,GAAG,SAItC,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCA3CY;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE;;;;CA+CxI,CAAC;AAEF,eAAO,MAAM,cAAc,wCAI1B,CAAC"}
+{"version":3,"file":"use-components-provider.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-components-provider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAA2B,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAC/F,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,QAAA,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCAgDe;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE;;;;CASxI,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,OAAO,mBAAmB,CAAC;AAQtD,KAAK,YAAY,GAAG,OAAO,CAAC;IACxB,GAAG,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IAC3B,MAAM,EAAE,OAAO,GAAG,SAAS,CAAC;IAC5B,MAAM,EAAE,OAAO,OAAO,CAAC,IAAI,CAAC;CAC/B,CAAC,CAAC;AAEH,eAAO,MAAM,kBAAkB,UAAW,iBAAiB,CAAC,YAAY,CAAC,4CAMxE,CAAC;AAEF,eAAO,MAAM,SAAS,QAAO,OAAO,GAAG,SAItC,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCAvCY;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE;;;;CA2CxI,CAAC;AAEF,eAAO,MAAM,cAAc,wCAI1B,CAAC"}

package/dist/src/hooks/use-components-provider.js

@@ -5,6 +5,7 @@ import { parsers } from "../../preset.tailwind";
 const defaultTranslations = {
     emptyDataMessage: "No data",
     inputCaretDown: "Click to see all options",
+    inputCloseValue: "Click to clear the value",
     datePickerCalendarButtonLabel: "Click to open a date picker",
     inputOptionalLabel: "Optional",
     autocompleteEmpty: "Nothing here...",
@@ -52,11 +53,7 @@ const Context = createContext({
     locale: undefined,
 });
 export const ComponentsProvider = (props) => {
-    const memoMap = useMemo(() => ({
-        locale: props.locale,
-        translations: { ...defaultTranslations, ...props.map },
-        colorTokenParser: props.parser || parsers.hsla,
-    }), [props]);
+    const memoMap = useMemo(() => ({ locale: props.locale, translations: { ...defaultTranslations, ...props.map }, colorTokenParser: props.parser || parsers.hsla, }), [props]);
     return _jsx(Context.Provider, { value: memoMap, children: props.children });
 };
 export const useLocale = () => {

package/dist/src/index.d.ts

@@ -2,7 +2,7 @@ export * from "./components";
 export * from "./hooks/use-form";
 export * from "./hooks/use-previous";
 export * from "./hooks/use-reactive";
-export { ComponentsProvider, useTranslations } from "./hooks/use-components-provider";
+export { ComponentsProvider, useTranslations, type Translations, useLocale, useColorParser } from "./hooks/use-components-provider";
 export * from "./lib/dom";
 export * from "./lib/fns";
 export * from "./styles/theme";

package/dist/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AACtF,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,wBAAwB,CAAC;AACvC,mBAAmB,SAAS,CAAC;AAC7B,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,kBAAkB,EAAE,eAAe,EAAE,KAAK,YAAY,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AACpI,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,wBAAwB,CAAC;AACvC,mBAAmB,SAAS,CAAC;AAC7B,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC"}

package/dist/src/index.js

@@ -2,7 +2,7 @@ export * from "./components";
 export * from "./hooks/use-form";
 export * from "./hooks/use-previous";
 export * from "./hooks/use-reactive";
-export { ComponentsProvider, useTranslations } from "./hooks/use-components-provider";
+export { ComponentsProvider, useTranslations, useLocale, useColorParser } from "./hooks/use-components-provider";
 export * from "./lib/dom";
 export * from "./lib/fns";
 export * from "./styles/theme";

package/dist/src/lib/fns.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fns.d.ts","sourceRoot":"","sources":["../../../src/lib/fns.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAE3C,eAAO,MAAM,IAAI,QAAO,MAKlB,CAAC;AAUP,eAAO,MAAM,IAAI,GAAI,CAAC,SAAS,EAAE,EAAE,CAAC,SAAS,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,QAGxE,CAAC;AAEF,eAAO,MAAM,KAAK,eAAsC,CAAC;AAEzD,eAAO,MAAM,SAAS,WAAY,MAAM,WAAkD,CAAC;AAG3F,eAAO,MAAM,SAAS,GAAI,CAAC,yBAAqB,CAAC,EAAE,QAAQ,MAAM,UAQhE,CAAC"}
+{"version":3,"file":"fns.d.ts","sourceRoot":"","sources":["../../../src/lib/fns.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAI3C,eAAO,MAAM,IAAI,QAAO,MAUvB,CAAC;AAUF,eAAO,MAAM,IAAI,GAAI,CAAC,SAAS,EAAE,EAAE,CAAC,SAAS,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,QAGxE,CAAC;AAEF,eAAO,MAAM,KAAK,eAAsC,CAAC;AAEzD,eAAO,MAAM,SAAS,WAAY,MAAM,WAAkD,CAAC;AAE3F,eAAO,MAAM,SAAS,GAAI,CAAC,yBAAqB,CAAC,EAAE,QAAQ,MAAM,UAQhE,CAAC"}

package/dist/src/lib/fns.js

@@ -1,8 +1,15 @@
-export const uuid = () => "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
-    let r = (Math.random() * 16) | 0;
-    let v = c == "x" ? r : (r & 0x3) | 0x8;
-    return v.toString(16);
-});
+const toHex = (n, length = 2) => n.toString(16).padStart(length, "0");
+export const uuid = () => {
+    const now = Date.now();
+    const timeHigh = ((now / 1000) & 0x0fff) | 0x7000;
+    const timeLow = now % 1000;
+    const randomBytes = new Uint8Array(10);
+    for (let i = 0; i < randomBytes.length; i++) {
+        randomBytes[i] = Math.floor(Math.random() * 256);
+    }
+    randomBytes[0] = (randomBytes[0] & 0x3f) | 0x80;
+    return `${toHex(timeHigh, 4) + toHex(timeLow, 3)}-${toHex(randomBytes[0]) + toHex(randomBytes[1])}-${toHex(randomBytes[2]) + toHex(randomBytes[3])}-${toHex(randomBytes[4]) + toHex(randomBytes[5])}-${toHex(randomBytes[6]) + toHex(randomBytes[7]) + toHex(randomBytes[8]) + toHex(randomBytes[9])}`;
+};
 const travel = (path, regexp, obj) => path
     .split(regexp)
     .filter(Boolean)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@g4rcez/components",
-  "version": "0.0.62",
+  "version": "0.0.64",
   "sideEffects": false,
   "private": false,
   "packageManager": "pnpm@8.15.3",