@komensal/ui 0.16.1 → 0.17.0

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,
@@ -1112,9 +1110,9 @@ var SelectInput = (props) => {
1112
1110
  "hover:bg-hover mt-0.5 mb-0.5 flex cursor-pointer items-center gap-2 rounded-sm py-2 pl-3",
1113
1111
  valueValue === value && "bg-inactive"
1114
1112
  ),
1115
- onSelect: (currentValue) => {
1116
- onChange?.(currentValue);
1117
- onValueChange(currentValue);
1113
+ onSelect: () => {
1114
+ onChange?.(valueValue);
1115
+ onValueChange(valueValue);
1118
1116
  setOpen(false);
1119
1117
  if (queryResetRef.current) clearTimeout(queryResetRef.current);
1120
1118
  queryResetRef.current = setTimeout(() => setQuery(""), QUERY_RESET_DELAY_MS);
@@ -1268,7 +1266,7 @@ var Stepper = ({ activeIndex, className, intermediate = false, steps }) => {
1268
1266
  "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
1267
  isCompleted && "bg-primary border-primary text-inverse",
1270
1268
  isActive && "bg-primary border-primary text-inverse",
1271
- !isCompleted && !isActive && "bg-inactive border-inactive text-inverse"
1269
+ !isCompleted && !isActive && "bg-inactive border-inactive text-inactive-text"
1272
1270
  ),
1273
1271
  children: isCompleted ? /* @__PURE__ */ jsx22(CheckIcon, { "aria-hidden": true, className: "h-4 w-4" }) : index + 1
1274
1272
  }
@@ -1401,6 +1399,7 @@ function Toast({ duration = 2500, id, onClose, subtitle, title, type }) {
1401
1399
  // src/components/toast/toast-provider.tsx
1402
1400
  import { useCallback as useCallback2, useEffect as useEffect5, useLayoutEffect, useMemo as useMemo3, useRef as useRef5, useState as useState5 } from "react";
1403
1401
  import { Fragment as Fragment4, jsx as jsx26 } from "react/jsx-runtime";
1402
+ var useIsomorphicLayoutEffect = typeof window === "undefined" ? useEffect5 : useLayoutEffect;
1404
1403
  function ToastProvider() {
1405
1404
  const [toasts, setToasts] = useState5([]);
1406
1405
  const itemRefs = useRef5(/* @__PURE__ */ new Map());
@@ -1431,7 +1430,7 @@ function ToastProvider() {
1431
1430
  return acc;
1432
1431
  }, {});
1433
1432
  }, [toasts]);
1434
- useLayoutEffect(() => {
1433
+ useIsomorphicLayoutEffect(() => {
1435
1434
  const newRects = /* @__PURE__ */ new Map();
1436
1435
  itemRefs.current.forEach((el, id) => {
1437
1436
  newRects.set(id, el.getBoundingClientRect());
@@ -1524,7 +1523,6 @@ export {
1524
1523
  FormField,
1525
1524
  FormItem,
1526
1525
  FormMessage,
1527
- GoogleMapPicker,
1528
1526
  Input,
1529
1527
  InputField,
1530
1528
  InputOTP,
@@ -1532,7 +1530,6 @@ export {
1532
1530
  InputOTPSlot,
1533
1531
  Label,
1534
1532
  LabelField,
1535
- MapPickerField,
1536
1533
  OTPField,
1537
1534
  PasswordChecklist,
1538
1535
  Popover,