@komensal/ui 0.16.1 → 0.17.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,295 @@
1
+ // src/utils/cn.ts
2
+ import { clsx } from "clsx";
3
+ import { twMerge } from "tailwind-merge";
4
+ function cn(...inputs) {
5
+ return twMerge(clsx(inputs));
6
+ }
7
+
8
+ // src/utils/color.ts
9
+ function isLightColor(hex) {
10
+ const raw = hex.replace("#", "");
11
+ const normalized = raw.length === 3 ? [...raw].map((c) => c + c).join("") : raw;
12
+ const r = parseInt(normalized.slice(0, 2), 16);
13
+ const g = parseInt(normalized.slice(2, 4), 16);
14
+ const b = parseInt(normalized.slice(4, 6), 16);
15
+ const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
16
+ return luminance > 0.6;
17
+ }
18
+
19
+ // src/utils/format.ts
20
+ var DEFAULT_CURRENCY = "COP";
21
+ var DEFAULT_LOCALE = "es-CO";
22
+ function capitalize(value) {
23
+ if (!value) return "";
24
+ const trimmed = value.trimStart();
25
+ if (trimmed.length === 0) return value;
26
+ return trimmed.charAt(0).toLocaleUpperCase("es") + trimmed.slice(1);
27
+ }
28
+ function formatNumber(value, locale = DEFAULT_LOCALE) {
29
+ return new Intl.NumberFormat(locale, { style: "decimal" }).format(value);
30
+ }
31
+ function formatPrice(value, locale = DEFAULT_LOCALE, currency = DEFAULT_CURRENCY) {
32
+ return new Intl.NumberFormat(locale, {
33
+ currency,
34
+ maximumFractionDigits: 0,
35
+ style: "currency"
36
+ }).format(value).replace(/\s/g, "");
37
+ }
38
+
39
+ // src/utils/styles.ts
40
+ var focusRing = cn("focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none");
41
+ var inputSurface = cn(
42
+ "w-full rounded-[10px] px-3 text-base font-normal",
43
+ "border-border bg-surface text-foreground border",
44
+ "transition-all duration-200 ease-in-out",
45
+ "placeholder:text-icon-muted placeholder:text-sm placeholder:leading-none placeholder:font-normal",
46
+ "disabled:bg-inactive disabled:text-inactive-text disabled:border-inactive disabled:placeholder:text-inactive-text disabled:cursor-not-allowed"
47
+ );
48
+ var inputBase = cn("flex h-[50px] items-center justify-between gap-[10px]", inputSurface);
49
+ var inputPlaceholder = cn("text-icon-muted text-sm leading-none font-normal");
50
+ var inputDisabled = cn("cursor-not-allowed opacity-50");
51
+ var inputCompact = cn(
52
+ "border-border bg-surface text-foreground focus:border-primary focus:ring-ring h-9 w-full rounded-lg border px-2.5 text-sm focus:ring-2 focus:outline-none"
53
+ );
54
+ var inputFocus = cn(
55
+ "focus:outline-none focus-visible:outline-none",
56
+ "focus-visible:ring-ring focus-visible:border-primary focus-visible:ring-2",
57
+ "data-[state=open]:ring-ring data-[state=open]:border-primary data-[state=open]:ring-2"
58
+ );
59
+
60
+ // src/utils/tag-emoji.ts
61
+ var TAG_EMOJI_RULES = [
62
+ { emoji: "\u{1F336}\uFE0F", keywords: ["picante", "picoso", "spicy"] },
63
+ { emoji: "\u{1F95C}", keywords: ["nuez", "nueces", "mani", "cacahuate", "frutos secos"] },
64
+ { emoji: "\u{1F331}", keywords: ["vegano", "vegetariano", "vegan"] },
65
+ { emoji: "\u{1F33E}", keywords: ["sin gluten", "gluten free"] },
66
+ { emoji: "\u{1F95B}", keywords: ["lacteos", "leche", "lactosa"] },
67
+ { emoji: "\u{1F990}", keywords: ["marisco", "camaron"] },
68
+ { emoji: "\u{1F525}", keywords: ["popular", "top ventas"] },
69
+ { emoji: "\u{1F195}", keywords: ["nuevo", "new"] },
70
+ { emoji: "\u{1F36C}", keywords: ["dulce"] },
71
+ { emoji: "\u{1F9CA}", keywords: ["frio", "helado"] }
72
+ ];
73
+ function getTagEmoji(tag) {
74
+ const normalized = normalize(tag);
75
+ const match = TAG_EMOJI_RULES.find((rule) => rule.keywords.some((keyword) => normalized.includes(keyword)));
76
+ return match?.emoji ?? null;
77
+ }
78
+ function normalize(text) {
79
+ return text.toLowerCase().normalize("NFD").replace(/\p{Diacritic}/gu, "");
80
+ }
81
+
82
+ // src/utils/toast-emitter.ts
83
+ var emitToast = null;
84
+ var toast = {
85
+ error(options) {
86
+ emit("destructive", options);
87
+ },
88
+ info(options) {
89
+ emit("info", options);
90
+ },
91
+ success(options) {
92
+ emit("success", options);
93
+ },
94
+ wait(options) {
95
+ emit("wait", options);
96
+ },
97
+ warning(options) {
98
+ emit("warning", options);
99
+ }
100
+ };
101
+ function registerToastEmitter(fn) {
102
+ emitToast = fn;
103
+ }
104
+ function emit(type, options) {
105
+ if (!emitToast) return;
106
+ if (typeof options === "string") {
107
+ emitToast(type, { title: options });
108
+ } else {
109
+ emitToast(type, options);
110
+ }
111
+ }
112
+
113
+ // src/utils/url.ts
114
+ function isSafeUrl(url) {
115
+ if (url.trim() === "") return false;
116
+ try {
117
+ const parsed = new URL(url, "https://placeholder.invalid");
118
+ return parsed.protocol === "http:" || parsed.protocol === "https:";
119
+ } catch {
120
+ return false;
121
+ }
122
+ }
123
+
124
+ // src/utils/z-index.ts
125
+ var zPopover = "z-50";
126
+ var zDialogOverlay = "z-60";
127
+ var zDialogContent = "z-70";
128
+ var zPopoverAboveDialog = "z-100";
129
+ var zToast = "z-4000";
130
+
131
+ // src/components/form-context.ts
132
+ import * as React from "react";
133
+ import { useFormContext } from "react-hook-form";
134
+ var FormFieldContext = React.createContext(null);
135
+ var FormItemContext = React.createContext(null);
136
+ var getFormItemId = (id) => `${id}-form-item`;
137
+ var useFormField = () => {
138
+ const fieldContext = React.useContext(FormFieldContext);
139
+ const itemContext = React.useContext(FormItemContext);
140
+ const { formState, getFieldState } = useFormContext();
141
+ if (!fieldContext) {
142
+ throw new Error("useFormField must be used within <FormField>");
143
+ }
144
+ if (!itemContext) {
145
+ throw new Error("useFormField must be used within <FormItem>");
146
+ }
147
+ const fieldState = getFieldState(fieldContext.name, formState);
148
+ const { id } = itemContext;
149
+ return {
150
+ formDescriptionId: `${id}-form-item-description`,
151
+ formItemId: getFormItemId(id),
152
+ formMessageId: `${id}-form-item-message`,
153
+ id,
154
+ name: fieldContext.name,
155
+ ...fieldState
156
+ };
157
+ };
158
+ var useFormControlProps = () => {
159
+ const { error, formItemId, formMessageId } = useFormField();
160
+ return {
161
+ "aria-describedby": error?.message ? formMessageId : void 0,
162
+ "aria-invalid": !!error,
163
+ id: formItemId
164
+ };
165
+ };
166
+ var useOptionalFormItemId = () => {
167
+ const itemContext = React.useContext(FormItemContext);
168
+ return itemContext ? getFormItemId(itemContext.id) : void 0;
169
+ };
170
+
171
+ // src/components/form.tsx
172
+ import { Slot } from "@radix-ui/react-slot";
173
+ import * as React2 from "react";
174
+ import { Controller, FormProvider } from "react-hook-form";
175
+ import { jsx } from "react/jsx-runtime";
176
+ var Form = FormProvider;
177
+ var FormField = ({
178
+ ...props
179
+ }) => {
180
+ return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx(Controller, { ...props }) });
181
+ };
182
+ var FormItem = React2.forwardRef(
183
+ ({ className, ...props }, ref) => {
184
+ const id = React2.useId();
185
+ return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx("div", { className: cn("space-y-1", className), ref, ...props }) });
186
+ }
187
+ );
188
+ FormItem.displayName = "FormItem";
189
+ var FormControl = React2.forwardRef(
190
+ ({ ...props }, ref) => {
191
+ const controlProps = useFormControlProps();
192
+ return /* @__PURE__ */ jsx(Slot, { ...controlProps, ref, ...props });
193
+ }
194
+ );
195
+ FormControl.displayName = "FormControl";
196
+ var FormMessage = React2.forwardRef(
197
+ ({ children, className, ...props }, ref) => {
198
+ const { error, formMessageId } = useFormField();
199
+ const body = error?.message ? String(error.message) : children;
200
+ if (!body) {
201
+ return null;
202
+ }
203
+ return /* @__PURE__ */ jsx("p", { className: cn("text-destructive text-xs font-medium", className), id: formMessageId, ref, ...props, children: body });
204
+ }
205
+ );
206
+ FormMessage.displayName = "FormMessage";
207
+
208
+ // src/components/label.tsx
209
+ import * as LabelPrimitive from "@radix-ui/react-label";
210
+ import { cva } from "class-variance-authority";
211
+ import * as React3 from "react";
212
+ import { jsx as jsx2 } from "react/jsx-runtime";
213
+ var labelVariants = cva("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70");
214
+ var Label = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx2(LabelPrimitive.Root, { className: cn(labelVariants(), className), ref, ...props }));
215
+ Label.displayName = LabelPrimitive.Root.displayName;
216
+
217
+ // src/components/form-fields/label-field.tsx
218
+ import { jsx as jsx3, jsxs } from "react/jsx-runtime";
219
+ var LabelField = ({ htmlFor, label, labelClassName, name, visualRequired }) => {
220
+ const formItemId = useOptionalFormItemId();
221
+ return /* @__PURE__ */ jsxs(
222
+ Label,
223
+ {
224
+ className: cn("text-body mb-2 text-start text-sm leading-none font-normal tracking-normal", labelClassName),
225
+ htmlFor: htmlFor ?? formItemId ?? name,
226
+ children: [
227
+ /* @__PURE__ */ jsx3("span", { children: label }),
228
+ " ",
229
+ visualRequired && /* @__PURE__ */ jsx3("span", { className: "text-destructive", children: " *" })
230
+ ]
231
+ }
232
+ );
233
+ };
234
+
235
+ // src/components/form-fields/form-field-shell.tsx
236
+ import { Fragment, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
237
+ var FieldControl = ({ children }) => {
238
+ const controlProps = useFormControlProps();
239
+ return /* @__PURE__ */ jsx4(Fragment, { children: children(controlProps) });
240
+ };
241
+ var FormFieldShell = ({
242
+ children,
243
+ hasError,
244
+ label,
245
+ labelClassName,
246
+ mainClassName,
247
+ name,
248
+ visualRequired
249
+ }) => /* @__PURE__ */ jsxs2(FormItem, { className: cn("flex flex-col", mainClassName), children: [
250
+ /* @__PURE__ */ jsx4(
251
+ LabelField,
252
+ {
253
+ label,
254
+ labelClassName: cn(labelClassName, hasError && "text-destructive"),
255
+ name,
256
+ visualRequired
257
+ }
258
+ ),
259
+ /* @__PURE__ */ jsx4(FieldControl, { children }),
260
+ /* @__PURE__ */ jsx4(FormMessage, {})
261
+ ] });
262
+
263
+ export {
264
+ cn,
265
+ isLightColor,
266
+ capitalize,
267
+ formatNumber,
268
+ formatPrice,
269
+ focusRing,
270
+ inputSurface,
271
+ inputBase,
272
+ inputPlaceholder,
273
+ inputDisabled,
274
+ inputCompact,
275
+ inputFocus,
276
+ getTagEmoji,
277
+ toast,
278
+ registerToastEmitter,
279
+ isSafeUrl,
280
+ zPopover,
281
+ zDialogOverlay,
282
+ zDialogContent,
283
+ zPopoverAboveDialog,
284
+ zToast,
285
+ useFormField,
286
+ Form,
287
+ FormField,
288
+ FormItem,
289
+ FormControl,
290
+ FormMessage,
291
+ Label,
292
+ LabelField,
293
+ FormFieldShell
294
+ };
295
+ //# sourceMappingURL=chunk-Y7PKMFTB.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/utils/cn.ts","../src/utils/color.ts","../src/utils/format.ts","../src/utils/styles.ts","../src/utils/tag-emoji.ts","../src/utils/toast-emitter.ts","../src/utils/url.ts","../src/utils/z-index.ts","../src/components/form-context.ts","../src/components/form.tsx","../src/components/label.tsx","../src/components/form-fields/label-field.tsx","../src/components/form-fields/form-field-shell.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}\n","export function isLightColor(hex: string): boolean {\n const raw = hex.replace('#', '')\n const normalized = raw.length === 3 ? [...raw].map((c) => c + c).join('') : raw\n const r = parseInt(normalized.slice(0, 2), 16)\n const g = parseInt(normalized.slice(2, 4), 16)\n const b = parseInt(normalized.slice(4, 6), 16)\n const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255\n\n return luminance > 0.6\n}\n","const DEFAULT_CURRENCY = 'COP'\nconst DEFAULT_LOCALE = 'es-CO'\n\nexport function capitalize(value: null | string | undefined): string {\n if (!value) return ''\n const trimmed = value.trimStart()\n if (trimmed.length === 0) return value\n return trimmed.charAt(0).toLocaleUpperCase('es') + trimmed.slice(1)\n}\n\nexport function formatNumber(value: number, locale = DEFAULT_LOCALE): string {\n return new Intl.NumberFormat(locale, { style: 'decimal' }).format(value)\n}\n\nexport function formatPrice(value: number, locale = DEFAULT_LOCALE, currency = DEFAULT_CURRENCY): string {\n return new Intl.NumberFormat(locale, {\n currency,\n maximumFractionDigits: 0,\n style: 'currency'\n })\n .format(value)\n .replace(/\\s/g, '')\n}\n","import { cn } from './cn'\n\nexport const focusRing = cn('focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none')\n\nexport const inputSurface = cn(\n 'w-full rounded-[10px] px-3 text-base font-normal',\n 'border-border bg-surface text-foreground border',\n 'transition-all duration-200 ease-in-out',\n 'placeholder:text-icon-muted placeholder:text-sm placeholder:leading-none placeholder:font-normal',\n 'disabled:bg-inactive disabled:text-inactive-text disabled:border-inactive disabled:placeholder:text-inactive-text disabled:cursor-not-allowed'\n)\n\nexport const inputBase = cn('flex h-[50px] items-center justify-between gap-[10px]', inputSurface)\n\nexport const inputPlaceholder = cn('text-icon-muted text-sm leading-none font-normal')\n\nexport const inputDisabled = cn('cursor-not-allowed opacity-50')\n\nexport const inputCompact = cn(\n 'border-border bg-surface text-foreground focus:border-primary focus:ring-ring h-9 w-full rounded-lg border px-2.5 text-sm focus:ring-2 focus:outline-none'\n)\n\nexport const inputFocus = cn(\n 'focus:outline-none focus-visible:outline-none',\n 'focus-visible:ring-ring focus-visible:border-primary focus-visible:ring-2',\n 'data-[state=open]:ring-ring data-[state=open]:border-primary data-[state=open]:ring-2'\n)\n","const TAG_EMOJI_RULES: { emoji: string; keywords: string[] }[] = [\n { emoji: '🌶️', keywords: ['picante', 'picoso', 'spicy'] },\n { emoji: '🥜', keywords: ['nuez', 'nueces', 'mani', 'cacahuate', 'frutos secos'] },\n { emoji: '🌱', keywords: ['vegano', 'vegetariano', 'vegan'] },\n { emoji: '🌾', keywords: ['sin gluten', 'gluten free'] },\n { emoji: '🥛', keywords: ['lacteos', 'leche', 'lactosa'] },\n { emoji: '🦐', keywords: ['marisco', 'camaron'] },\n { emoji: '🔥', keywords: ['popular', 'top ventas'] },\n { emoji: '🆕', keywords: ['nuevo', 'new'] },\n { emoji: '🍬', keywords: ['dulce'] },\n { emoji: '🧊', keywords: ['frio', 'helado'] }\n]\n\nexport function getTagEmoji(tag: string): null | string {\n const normalized = normalize(tag)\n const match = TAG_EMOJI_RULES.find((rule) => rule.keywords.some((keyword) => normalized.includes(keyword)))\n return match?.emoji ?? null\n}\n\nfunction normalize(text: string): string {\n return text\n .toLowerCase()\n .normalize('NFD')\n .replace(/\\p{Diacritic}/gu, '')\n}\n","import { ToastOptions, ToastType } from '../types/toast'\n\ntype ToastEmitter = ((type: ToastType, options: ToastOptions) => void) | null\n\nlet emitToast: ToastEmitter = null\n\nexport const toast = {\n error(options: string | ToastOptions) {\n emit('destructive', options)\n },\n info(options: string | ToastOptions) {\n emit('info', options)\n },\n success(options: string | ToastOptions) {\n emit('success', options)\n },\n wait(options: string | ToastOptions) {\n emit('wait', options)\n },\n warning(options: string | ToastOptions) {\n emit('warning', options)\n }\n}\n\nexport function registerToastEmitter(fn: ToastEmitter) {\n emitToast = fn\n}\n\nfunction emit(type: ToastType, options: string | ToastOptions) {\n if (!emitToast) return\n\n if (typeof options === 'string') {\n emitToast(type, { title: options })\n } else {\n emitToast(type, options)\n }\n}\n","export function isSafeUrl(url: string): boolean {\n if (url.trim() === '') return false\n try {\n const parsed = new URL(url, 'https://placeholder.invalid')\n return parsed.protocol === 'http:' || parsed.protocol === 'https:'\n } catch {\n return false\n }\n}\n","export const zPopover = 'z-50'\nexport const zDialogOverlay = 'z-60'\nexport const zDialogContent = 'z-70'\nexport const zPopoverAboveDialog = 'z-100'\nexport const zToast = 'z-4000'\n","import * as React from 'react'\nimport { FieldPath, FieldValues, useFormContext } from 'react-hook-form'\n\nexport interface FormControlA11yProps {\n 'aria-describedby'?: string\n 'aria-invalid': boolean\n id: string\n}\n\ninterface FormFieldContextValue<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n> {\n name: TName\n}\n\ninterface FormItemContextValue {\n id: string\n}\n\nexport const FormFieldContext = React.createContext<FormFieldContextValue | null>(null)\n\nexport const FormItemContext = React.createContext<FormItemContextValue | null>(null)\n\nexport const getFormItemId = (id: string) => `${id}-form-item`\n\nexport const useFormField = () => {\n const fieldContext = React.useContext(FormFieldContext)\n const itemContext = React.useContext(FormItemContext)\n const { formState, getFieldState } = useFormContext()\n\n if (!fieldContext) {\n throw new Error('useFormField must be used within <FormField>')\n }\n\n if (!itemContext) {\n throw new Error('useFormField must be used within <FormItem>')\n }\n\n const fieldState = getFieldState(fieldContext.name, formState)\n\n const { id } = itemContext\n\n return {\n formDescriptionId: `${id}-form-item-description`,\n formItemId: getFormItemId(id),\n formMessageId: `${id}-form-item-message`,\n id,\n name: fieldContext.name,\n ...fieldState\n }\n}\n\nexport const useFormControlProps = (): FormControlA11yProps => {\n const { error, formItemId, formMessageId } = useFormField()\n\n return {\n 'aria-describedby': error?.message ? formMessageId : undefined,\n 'aria-invalid': !!error,\n id: formItemId\n }\n}\n\nexport const useOptionalFormItemId = () => {\n const itemContext = React.useContext(FormItemContext)\n return itemContext ? getFormItemId(itemContext.id) : undefined\n}\n","import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\nimport { Controller, ControllerProps, FieldPath, FieldValues, FormProvider } from 'react-hook-form'\n\nimport { cn } from '../utils'\nimport { FormFieldContext, FormItemContext, useFormControlProps, useFormField } from './form-context'\n\nconst Form = FormProvider\n\nconst FormField = <\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n>({\n ...props\n}: ControllerProps<TFieldValues, TName>) => {\n return (\n <FormFieldContext.Provider value={{ name: props.name }}>\n <Controller {...props} />\n </FormFieldContext.Provider>\n )\n}\n\nconst FormItem = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n ({ className, ...props }, ref) => {\n const id = React.useId()\n\n return (\n <FormItemContext.Provider value={{ id }}>\n <div className={cn('space-y-1', className)} ref={ref} {...props} />\n </FormItemContext.Provider>\n )\n }\n)\nFormItem.displayName = 'FormItem'\n\nconst FormControl = React.forwardRef<React.ElementRef<typeof Slot>, React.ComponentPropsWithoutRef<typeof Slot>>(\n ({ ...props }, ref) => {\n const controlProps = useFormControlProps()\n\n return <Slot {...controlProps} ref={ref} {...props} />\n }\n)\nFormControl.displayName = 'FormControl'\n\nconst FormMessage = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(\n ({ children, className, ...props }, ref) => {\n const { error, formMessageId } = useFormField()\n const body = error?.message ? String(error.message) : children\n\n if (!body) {\n return null\n }\n\n return (\n <p className={cn('text-destructive text-xs font-medium', className)} id={formMessageId} ref={ref} {...props}>\n {body}\n </p>\n )\n }\n)\nFormMessage.displayName = 'FormMessage'\n\nexport { Form, FormControl, FormField, FormItem, FormMessage, useFormField }\n","import * as LabelPrimitive from '@radix-ui/react-label'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { cn } from '../utils'\n\nconst labelVariants = cva('text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70')\n\nconst Label = React.forwardRef<\n React.ElementRef<typeof LabelPrimitive.Root>,\n React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>\n>(({ className, ...props }, ref) => (\n <LabelPrimitive.Root className={cn(labelVariants(), className)} ref={ref} {...props} />\n))\nLabel.displayName = LabelPrimitive.Root.displayName\n\nexport { Label }\n","import { cn } from '../../utils'\nimport { useOptionalFormItemId } from '../form-context'\nimport { Label } from '../label'\n\ninterface LabelFieldProps {\n htmlFor?: string\n label?: string\n labelClassName?: string\n name: string\n visualRequired?: boolean\n}\n\nexport const LabelField = ({ htmlFor, label, labelClassName, name, visualRequired }: LabelFieldProps) => {\n const formItemId = useOptionalFormItemId()\n\n return (\n <Label\n className={cn('text-body mb-2 text-start text-sm leading-none font-normal tracking-normal', labelClassName)}\n htmlFor={htmlFor ?? formItemId ?? name}\n >\n <span>{label}</span> {visualRequired && <span className='text-destructive'> *</span>}\n </Label>\n )\n}\n","import type { ReactNode } from 'react'\n\nimport { cn } from '../../utils'\nimport { FormItem, FormMessage } from '../form'\nimport { type FormControlA11yProps, useFormControlProps } from '../form-context'\nimport { LabelField } from './label-field'\n\ninterface FormFieldShellProps {\n children: (controlProps: FormControlA11yProps) => ReactNode\n hasError?: boolean\n label?: string\n labelClassName?: string\n mainClassName?: string\n name: string\n visualRequired?: boolean\n}\n\nconst FieldControl = ({ children }: { children: FormFieldShellProps['children'] }) => {\n const controlProps = useFormControlProps()\n return <>{children(controlProps)}</>\n}\n\nexport const FormFieldShell = ({\n children,\n hasError,\n label,\n labelClassName,\n mainClassName,\n name,\n visualRequired\n}: FormFieldShellProps) => (\n <FormItem className={cn('flex flex-col', mainClassName)}>\n <LabelField\n label={label}\n labelClassName={cn(labelClassName, hasError && 'text-destructive')}\n name={name}\n visualRequired={visualRequired}\n />\n <FieldControl>{children}</FieldControl>\n <FormMessage />\n </FormItem>\n)\n"],"mappings":"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","names":["React","React","jsx","jsx","jsx","jsxs"]}
package/dist/index.d.ts CHANGED
@@ -6,7 +6,6 @@ import * as DialogPrimitive from '@radix-ui/react-dialog';
6
6
  import { DialogProps } from '@radix-ui/react-dialog';
7
7
  import * as react_hook_form from 'react-hook-form';
8
8
  import { FieldValues, FieldPath, ControllerProps, Control, Path, FieldError, Noop } from 'react-hook-form';
9
- export { GoogleMapPicker, GoogleMapPickerProps, MapPickerField, ResolvedAddress } from './maps.js';
10
9
  import * as LabelPrimitive from '@radix-ui/react-label';
11
10
  import { OTPInput } from 'input-otp';
12
11
  import * as PopoverPrimitive from '@radix-ui/react-popover';
package/dist/index.js CHANGED
@@ -5,10 +5,8 @@ import {
5
5
  FormFieldShell,
6
6
  FormItem,
7
7
  FormMessage,
8
- GoogleMapPicker,
9
8
  Label,
10
9
  LabelField,
11
- MapPickerField,
12
10
  capitalize,
13
11
  cn,
14
12
  focusRing,
@@ -31,7 +29,7 @@ import {
31
29
  zPopover,
32
30
  zPopoverAboveDialog,
33
31
  zToast
34
- } from "./chunk-5VBG6IKL.js";
32
+ } from "./chunk-Y7PKMFTB.js";
35
33
  import {
36
34
  ui_default
37
35
  } from "./chunk-FDVY36KS.js";
@@ -44,7 +42,7 @@ var AddTile = React.forwardRef(
44
42
  "button",
45
43
  {
46
44
  className: cn(
47
- "group border-border text-muted hover:border-primary-hover hover:bg-brand-200 hover:text-primary focus-visible:ring-ring flex min-h-92.5 cursor-pointer flex-col items-center justify-center gap-2 rounded-2xl border-2 border-dashed transition-colors focus-visible:ring-2 focus-visible:outline-none",
45
+ "group border-border text-muted hover:border-primary-hover hover:bg-brand-subtle hover:text-primary focus-visible:ring-ring flex min-h-92.5 cursor-pointer flex-col items-center justify-center gap-2 rounded-2xl border-2 border-dashed transition-colors focus-visible:ring-2 focus-visible:outline-none",
48
46
  className
49
47
  ),
50
48
  ref,
@@ -192,7 +190,7 @@ var variants = {
192
190
  primary: "var(--color-spinner-primary)",
193
191
  secondary: "var(--color-spinner-secondary)"
194
192
  };
195
- var Spinner = ({ className = "", loadingLabel, size = "md", variant = "primary" }) => {
193
+ var Spinner = ({ className = "", loadingLabel, size = "md", variant }) => {
196
194
  const t = useUiT();
197
195
  return /* @__PURE__ */ jsxs5(Fragment2, { children: [
198
196
  /* @__PURE__ */ jsx6(
@@ -202,7 +200,7 @@ var Spinner = ({ className = "", loadingLabel, size = "md", variant = "primary"
202
200
  fill: "currentColor",
203
201
  focusable: "false",
204
202
  height: sizes[size],
205
- stroke: variants[variant],
203
+ style: variant ? { color: variants[variant] } : void 0,
206
204
  viewBox: "0 0 100 100",
207
205
  width: sizes[size],
208
206
  xmlns: "http://www.w3.org/2000/svg",
@@ -338,12 +336,12 @@ var Button = React5.forwardRef(
338
336
  variant,
339
337
  ...props
340
338
  }, ref) => {
341
- const Comp = asChild ? Slot : "button";
342
- const buttonNode = /* @__PURE__ */ jsxs7(
343
- Comp,
339
+ const classes = cn(buttonVariants({ hoverStyle, size, variant }), isLoading && "relative", className);
340
+ const buttonNode = asChild ? /* @__PURE__ */ jsx8(Slot, { "aria-busy": isLoading || void 0, className: classes, ref, ...props, children }) : /* @__PURE__ */ jsxs7(
341
+ "button",
344
342
  {
345
343
  "aria-busy": isLoading || void 0,
346
- className: cn(buttonVariants({ hoverStyle, size, variant }), isLoading && "relative", className),
344
+ className: classes,
347
345
  disabled: disabled === true || isLoading,
348
346
  ref,
349
347
  ...props,
@@ -531,7 +529,7 @@ var CommandItem = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE
531
529
  CommandPrimitive.Item,
532
530
  {
533
531
  className: cn(
534
- "relative flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
532
+ "data-[selected=true]:bg-hover data-[selected=true]:text-foreground relative flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
535
533
  className
536
534
  ),
537
535
  ref,
@@ -1080,7 +1078,9 @@ var SelectInput = (props) => {
1080
1078
  {
1081
1079
  className: cn("bg-surface border-border rounded-sm p-1", zPopoverAboveDialog),
1082
1080
  id: listboxId,
1083
- onOpenAutoFocus: (e) => e.preventDefault(),
1081
+ onOpenAutoFocus: (e) => {
1082
+ if (!search || timeField) e.preventDefault();
1083
+ },
1084
1084
  style: timeField ? { maxWidth: "auto", width: "180px" } : width > 0 ? { maxWidth: "auto", minWidth: `${width}px`, width: `${width}px` } : void 0,
1085
1085
  children: timeField ? /* @__PURE__ */ jsx18(
1086
1086
  TimeColumns,
@@ -1112,9 +1112,9 @@ var SelectInput = (props) => {
1112
1112
  "hover:bg-hover mt-0.5 mb-0.5 flex cursor-pointer items-center gap-2 rounded-sm py-2 pl-3",
1113
1113
  valueValue === value && "bg-inactive"
1114
1114
  ),
1115
- onSelect: (currentValue) => {
1116
- onChange?.(currentValue);
1117
- onValueChange(currentValue);
1115
+ onSelect: () => {
1116
+ onChange?.(valueValue);
1117
+ onValueChange(valueValue);
1118
1118
  setOpen(false);
1119
1119
  if (queryResetRef.current) clearTimeout(queryResetRef.current);
1120
1120
  queryResetRef.current = setTimeout(() => setQuery(""), QUERY_RESET_DELAY_MS);
@@ -1268,7 +1268,7 @@ var Stepper = ({ activeIndex, className, intermediate = false, steps }) => {
1268
1268
  "flex h-5.5 w-5.5 shrink-0 items-center justify-center rounded-full border text-xs font-semibold transition-colors md:h-6.5 md:w-6.5",
1269
1269
  isCompleted && "bg-primary border-primary text-inverse",
1270
1270
  isActive && "bg-primary border-primary text-inverse",
1271
- !isCompleted && !isActive && "bg-inactive border-inactive text-inverse"
1271
+ !isCompleted && !isActive && "bg-inactive border-inactive text-inactive-text"
1272
1272
  ),
1273
1273
  children: isCompleted ? /* @__PURE__ */ jsx22(CheckIcon, { "aria-hidden": true, className: "h-4 w-4" }) : index + 1
1274
1274
  }
@@ -1401,6 +1401,7 @@ function Toast({ duration = 2500, id, onClose, subtitle, title, type }) {
1401
1401
  // src/components/toast/toast-provider.tsx
1402
1402
  import { useCallback as useCallback2, useEffect as useEffect5, useLayoutEffect, useMemo as useMemo3, useRef as useRef5, useState as useState5 } from "react";
1403
1403
  import { Fragment as Fragment4, jsx as jsx26 } from "react/jsx-runtime";
1404
+ var useIsomorphicLayoutEffect = typeof window === "undefined" ? useEffect5 : useLayoutEffect;
1404
1405
  function ToastProvider() {
1405
1406
  const [toasts, setToasts] = useState5([]);
1406
1407
  const itemRefs = useRef5(/* @__PURE__ */ new Map());
@@ -1431,7 +1432,7 @@ function ToastProvider() {
1431
1432
  return acc;
1432
1433
  }, {});
1433
1434
  }, [toasts]);
1434
- useLayoutEffect(() => {
1435
+ useIsomorphicLayoutEffect(() => {
1435
1436
  const newRects = /* @__PURE__ */ new Map();
1436
1437
  itemRefs.current.forEach((el, id) => {
1437
1438
  newRects.set(id, el.getBoundingClientRect());
@@ -1524,7 +1525,6 @@ export {
1524
1525
  FormField,
1525
1526
  FormItem,
1526
1527
  FormMessage,
1527
- GoogleMapPicker,
1528
1528
  Input,
1529
1529
  InputField,
1530
1530
  InputOTP,
@@ -1532,7 +1532,6 @@ export {
1532
1532
  InputOTPSlot,
1533
1533
  Label,
1534
1534
  LabelField,
1535
- MapPickerField,
1536
1535
  OTPField,
1537
1536
  PasswordChecklist,
1538
1537
  Popover,