@g4rcez/components 4.1.3 → 5.0.1

package/dist/components/form/date-picker.jsx

@@ -1,115 +0,0 @@
-"use client";
-import { format, isValid, parse, startOfDay } from "date-fns";
-import { CalendarIcon } from "@phosphor-icons/react";
-import React, { forwardRef, Fragment, useEffect, useId, useMemo, useState } from "react";
-import { Is } from "sidekicker";
-import { useLocale } from "../../hooks/use-locale";
-import { useTranslations } from "../../hooks/use-translations";
-import { Calendar } from "../display/calendar";
-import { Dropdown } from "../floating/dropdown";
-import { Input } from "./input";
-const fixedDate = new Date(1970, 11, 31);
-const parts = {
-    year: () => [/\d/, /\d/, /\d/, /\d/],
-    month: () => [/\d/, /\d/],
-    day: () => [/\d/, /\d/],
-    hour: () => [/\d/, /\d/],
-    minute: () => [/\d/, /\d/],
-    literal: (str) => str.split(""),
-};
-const placeholders = {
-    day: () => "dd",
-    hour: () => "HH",
-    month: () => "MM",
-    minute: () => "mm",
-    year: () => "yyyy",
-    literal: (str) => str,
-};
-const partValues = {
-    literal: (_, str) => str,
-    year: (date) => date.getFullYear().toString(),
-    day: (date) => date.getDate().toString().padStart(2, "0"),
-    hour: (date) => date.getHours().toString().padStart(2, "0"),
-    minute: (date) => date.getMinutes().toString().padStart(2, "0"),
-    month: (date) => (date.getMonth() + 1).toString().padStart(2, "0"),
-};
-const formatParts = (datetimeFormat, date) => {
-    try {
-        return datetimeFormat.formatToParts(date).map((x) => {
-            if (x.type === "literal" && x.value === ", ") {
-                return { type: x.type, value: " " };
-            }
-            return x;
-        });
-    }
-    catch (e) {
-        return [];
-    }
-};
-const DATE_TIME_FORMAT = { day: "numeric", month: "numeric", year: "numeric", hour: "numeric", minute: "numeric" };
-const DATE_FORMAT = { day: "numeric", month: "numeric", year: "numeric" };
-export const DatePicker = forwardRef(({ date, locale: inputLocal, disabledDate, onChange, markToday, clickToClose, floating = true, type, ...props }, externalRef) => {
-    const locale = useLocale(inputLocal);
-    const labelId = useId();
-    const translation = useTranslations();
-    const datetimeFormat = useMemo(() => new Intl.DateTimeFormat(locale, type === "datetime" ? DATE_TIME_FORMAT : DATE_FORMAT), [locale, type]);
-    const [innerDate, setInnerDate] = useState(date || undefined);
-    const [open, setOpen] = useState(false);
-    const mask = formatParts(datetimeFormat, fixedDate).flatMap((x) => Is.keyof(parts, x.type) ? parts[x.type](x.value) : []);
-    const placeholder = useMemo(() => {
-        return formatParts(datetimeFormat, fixedDate).reduce((acc, x) => acc + (Is.keyof(placeholders, x.type) ? placeholders[x.type](x.value) : ""), "");
-    }, [datetimeFormat]);
-    const isoDateEffect = date?.toISOString();
-    const [value, setValue] = useState(!innerDate
-        ? ""
-        : formatParts(datetimeFormat, innerDate).reduce((acc, x) => acc + (Is.keyof(parts, x.type) ? partValues[x.type](innerDate, x.value) : ""), ""));
-    const onChangeDateInput = (e) => {
-        const v = e.target.value;
-        setValue(v);
-        if (mask.length === v.length) {
-            const matches = mask.every((x, i) => {
-                const c = v.charAt(i);
-                return typeof x === "string" ? c === x : x.test(c);
-            });
-            if (matches) {
-                const parsed = parse(v, placeholder, new Date());
-                const d = type === "datetime" ? parsed : startOfDay(parsed);
-                setInnerDate(d);
-                return onChange?.(d);
-            }
-        }
-        setInnerDate(undefined);
-        return onChange?.(undefined);
-    };
-    useEffect(() => {
-        if (isValid(date)) {
-            setInnerDate(date);
-            setValue(format(date, placeholder));
-        }
-    }, [isoDateEffect, placeholder]);
-    const onChangeDate = (d) => {
-        setInnerDate(d);
-        onChange?.(d);
-        if (clickToClose)
-            setOpen(false);
-        if (d)
-            return setValue(format(d, placeholder));
-        return setValue("");
-    };
-    const validDate = isValid(innerDate);
-    const htmlValue = validDate ? innerDate.toISOString() : undefined;
-    const CalendarComponent = (<Calendar {...props} type={type} locale={locale} changeOnlyOnClick markToday={markToday} onChange={onChangeDate} disabledDate={disabledDate} date={validDate ? innerDate : undefined}/>);
-    return (<Fragment>
-                <Input {...props} mask={mask} value={value} id={undefined} name={undefined} data-value={htmlValue} formNoValidate={!open} data-target={props.name} data-component="date-picker" onChange={onChangeDateInput} required={props.required ?? true} error={open ? undefined : props.error} placeholder={props.placeholder || translation.datepickerPlaceholder(placeholder)} right={floating ? (<Fragment>
-                                <input data-origin={props.name} defaultValue={htmlValue} form={props.form} hidden id={props.name} name={props.name} ref={externalRef} type="date"/>
-                                <Dropdown open={open} onChange={setOpen} buttonProps={{ "aria-describedby": labelId }} trigger={<span aria-labelledby={labelId}>
-                                            <span id={labelId} className="sr-only">
-                                                {translation.datePickerCalendarButtonLabel}
-                                            </span>
-                                            <CalendarIcon />
-                                        </span>}>
-                                    {CalendarComponent}
-                                </Dropdown>
-                            </Fragment>) : null}/>
-            </Fragment>);
-});

package/dist/components/form/file-upload.d.ts

@@ -1,15 +0,0 @@
-import React from "react";
-import { DropzoneProps } from "react-dropzone";
-import { Override } from "sidekicker";
-type Props = Override<React.ComponentProps<"input">, DropzoneProps> & {
-    files?: File[];
-    idle?: React.ReactElement;
-    File?: React.FC<{
-        file: File;
-    }>;
-    onDrop?: (file: File[]) => void;
-    onDeleteFile?: (file: File) => void;
-};
-export declare const FileUpload: ({ idle, onDeleteFile, File, onDrop, ...props }: Props) => React.JSX.Element;
-export {};
-//# sourceMappingURL=file-upload.d.ts.map

package/dist/components/form/file-upload.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"file-upload.d.ts","sourceRoot":"","sources":["../../../src/components/form/file-upload.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAmE,MAAM,OAAO,CAAC;AACxF,OAAO,EAAE,aAAa,EAAe,MAAM,gBAAgB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAatC,KAAK,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,aAAa,CAAC,GAAG;IAClE,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;IACf,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B,IAAI,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,CAAC,CAAC;IAChC,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IAChC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACvC,CAAC;AAkJF,eAAO,MAAM,UAAU,GAAI,gDAA8D,KAAK,sBA+B7F,CAAC"}

package/dist/components/form/file-upload.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"file-upload.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/dist/components/form/file-upload.jsx

@@ -1,134 +0,0 @@
-"use client";
-import { WaveformIcon, FileIcon, FileCodeIcon, FileTextIcon, FileVideoIcon, FolderIcon, FolderOpenIcon, TableIcon, XIcon, } from "@phosphor-icons/react";
-import prettyBytes from "pretty-bytes";
-import React, { createContext, Fragment, useContext, useEffect, useState } from "react";
-import { useDropzone } from "react-dropzone";
-import { useTranslations } from "../../hooks/use-translations";
-import { Modal } from "../floating/modal";
-const Context = createContext([null, () => { }]);
-const useFileManager = () => useContext(Context);
-const getMimeType = (file) => {
-    if (file.type.startsWith("image/"))
-        return "img";
-    if (file.type.startsWith("audio/"))
-        return "audio";
-    if (file.type.startsWith("video/"))
-        return "video";
-    return file.type;
-};
-const extensionMap = {
-    csv: TableIcon,
-    xls: TableIcon,
-    mov: FileVideoIcon,
-    mp4: FileVideoIcon,
-    xlsx: TableIcon,
-    pdf: FileTextIcon,
-    txt: FileTextIcon,
-    json: FileCodeIcon,
-    mp3: WaveformIcon,
-};
-const ItemViewer = (props) => {
-    const [, setManager] = useFileManager();
-    const [info, setInfo] = useState({ url: "", type: "", size: "" });
-    useEffect(() => {
-        const file = props.file;
-        const url = URL.createObjectURL(file);
-        setInfo({ url, type: getMimeType(file), size: prettyBytes(file.size) });
-        return () => URL.revokeObjectURL(url);
-    }, [props.file]);
-    const onViewFile = (e) => {
-        e.stopPropagation();
-        e.preventDefault();
-        setManager({ ...info, file: props.file });
-    };
-    const onDeleteFile = (e) => {
-        e.preventDefault();
-        e.stopPropagation();
-        props.onDeleteFile?.(props.file);
-    };
-    const fileName = props.file.name;
-    const Icon = extensionMap[props.file.name.split(".").at(-1)] ?? FileIcon;
-    const Element = info.type === "img" ? <img src={info.url} className="w-full object-contain" alt={props.file.name}/> : <Icon size={48}/>;
-    return (<li className="flex w-full flex-row justify-between gap-4 border-b border-card-border last:border-b-transparent">
-            <div className="flex flex-col gap-4">
-                <div className="flex flex-row items-center gap-4">
-                    <button type="button" onClick={onViewFile} aria-label={`View ${fileName}`} className="m-2 flex size-16 max-w-16 items-center justify-center overflow-hidden">
-                        {Element}
-                    </button>
-                    <div className="flex flex-col items-start justify-start text-left">
-                        <span>{props.file.name}</span>
-                        <span className="text-sm italic">{info.size}</span>
-                    </div>
-                </div>
-                {props.File ? (<div className="min-w-full flex-1">
-                        <props.File file={props.file}/>
-                    </div>) : null}
-            </div>
-            <div className="align-start flex justify-start py-4 transition-colors duration-300 ease-linear hover:text-danger-hover">
-                <button onClick={onDeleteFile} type="button" aria-label={`Remove ${fileName}`} className="flex size-6 items-center justify-center">
-                    <XIcon size={16} aria-hidden="true"/>
-                </button>
-            </div>
-        </li>);
-};
-const FilesList = (props) => (<ul className="w-full space-y-8">
-        {props.files.map((file) => {
-        return <ItemViewer File={props.File} onDeleteFile={props.onDeleteFile} key={file.name} file={file}/>;
-    })}
-    </ul>);
-const Idle = (props) => {
-    const t = useTranslations();
-    const Icon = props.dragging ? FolderOpenIcon : FolderIcon;
-    return (<div className="flex flex-col items-center justify-center">
-            <div className="flex flex-col items-center justify-center gap-2">
-                <Icon className="text-primary" size={80}/>
-            </div>
-            <div className="my-4 flex flex-col items-center gap-1">
-                <p>{t.uploadIdle}</p>
-                <button className="text-primary underline" type="button">
-                    {t.uploadIdleButton}
-                </button>
-            </div>
-        </div>);
-};
-const InteractiveArea = (props) => {
-    if (props.isDragActive)
-        return <Idle files={props.files} dragging/>;
-    if (props.files.length > 0) {
-        return <FilesList File={props.File} onDeleteFile={props.onDeleteFile} files={props.files}/>;
-    }
-    return <Fragment>{props.idle}</Fragment>;
-};
-const DefaultIdle = <Idle dragging={false}/>;
-const FileViewer = (props) => {
-    const file = props.item.file;
-    const type = props.item.type;
-    return (<div className="flex flex-col gap-4">
-            <p className="text-lg font-medium">{props.item.file.name}</p>
-            <p className="text-base">{props.item.size}</p>
-            {type === "img" ? (<img className="container inline-block w-full max-w-96" src={props.item.url} alt={file.name}/>) : type === "video" ? (<video className="container block w-full max-w-96" src={props.item.url} controls muted/>) : type === "audio" ? (<figure>
-                    <audio controls src={props.item.url}></audio>
-                </figure>) : null}
-        </div>);
-};
-export const FileUpload = ({ idle = DefaultIdle, onDeleteFile, File, onDrop, ...props }) => {
-    const t = useTranslations();
-    const state = useState(null);
-    const [files, setFiles] = useState([]);
-    const items = props.files ?? files;
-    const close = () => state[1](null);
-    const drop = (x) => {
-        onDrop?.(x);
-        setFiles((prev) => prev.concat(x));
-    };
-    const { getRootProps, getInputProps, isDragActive } = useDropzone({ onDrop: drop });
-    return (<Context.Provider value={state}>
-            <Modal overlayClickClose title={t.uploadDialogTitle} ariaTitle={t.uploadDialogTitle} open={state[0] !== null} onChange={close}>
-                {state[0] ? <FileViewer item={state[0]}/> : null}
-            </Modal>
-            <div {...getRootProps()} aria-label={t.fileUploadZoneLabel} data-active={items ? items.length > 0 : false} className="flex flex-col items-center justify-center rounded-lg border border-card-border p-6 text-foreground data-[active=true]:border-solid data-[active=false]:border-dashed data-[active=true]:border-transparent data-[active=true]:bg-card-background">
-                <input {...getInputProps(props)} name={props.name} id={props.name}/>
-                <InteractiveArea File={File} onDeleteFile={onDeleteFile} isDragActive={isDragActive} idle={idle} files={items}/>
-            </div>
-        </Context.Provider>);
-};

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

@@ -1,3 +0,0 @@
-import React from "react";
-export declare const Form: (props: React.ComponentProps<"form">) => React.JSX.Element;
-//# sourceMappingURL=form.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../../src/components/form/form.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,IAAI,GAAI,OAAO,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,sBAOvD,CAAC"}

package/dist/components/form/form.jsx

@@ -1,10 +0,0 @@
-"use client";
-import React from "react";
-export const Form = (props) => {
-    const onSubmit = (e) => {
-        e.persist();
-        e.preventDefault();
-        props.onSubmit?.(e);
-    };
-    return <form {...props} onSubmit={onSubmit}/>;
-};

package/dist/components/form/formReset.d.ts

@@ -1,2 +0,0 @@
-export declare const formReset: (form?: HTMLFormElement | null) => void;
-//# sourceMappingURL=formReset.d.ts.map

package/dist/components/form/formReset.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"formReset.d.ts","sourceRoot":"","sources":["../../../src/components/form/formReset.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS,GAAI,OAAO,eAAe,GAAG,IAAI,SAatD,CAAC"}

package/dist/components/form/formReset.jsx

@@ -1,17 +0,0 @@
-const inputFields = ["INPUT", "SELECT"];
-export const formReset = (form) => {
-    if (!form)
-        return;
-    const elements = Array.from(form.elements);
-    elements.forEach((field) => {
-        if (!inputFields.includes(field.tagName))
-            return;
-        if (field.tagName === "INPUT") {
-            field.value = field.defaultValue;
-        }
-        if (field.tagName === "SELECT") {
-            field.value = "";
-        }
-        field.setAttribute("data-initialized", "false");
-    });
-};

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

@@ -1,11 +0,0 @@
-import MaskInput, { InputTypes } from "the-mask-input";
-import { Any, Override, ReactComponent } from "../../types";
-import { FeedbackProps, InputFieldProps } from "./input-field";
-type FreeTextTag = "input" | "textarea";
-export type FreeTextProps<T extends FreeTextTag, ExtraProps extends Any> = Override<InputFieldProps<T> & FeedbackProps & Partial<{
-    next: string;
-    type: InputTypes;
-}>, ExtraProps>;
-export declare const createFreeText: <const T extends FreeTextTag, const Html extends HTMLInputElement | HTMLTextAreaElement, Extra extends Any>(Element: "input" | "textarea" | typeof MaskInput, elementName: "input" | "textarea", defaultProps: FreeTextProps<T, Extra>, register?: (el: Html) => () => void) => ReactComponent<FreeTextProps<T, Extra>>;
-export {};
-//# sourceMappingURL=free-text.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"free-text.d.ts","sourceRoot":"","sources":["../../../src/components/form/free-text.tsx"],"names":[],"mappings":"AAEA,OAAO,SAAS,EAAE,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEvD,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC5D,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,GAAG,IAAI,QAAQ,CAC/E,eAAe,CAAC,CAAC,CAAC,GAAG,aAAa,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,UAAU,CAAA;CAAE,CAAC,EAChF,UAAU,CACb,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,KAAK,CAAC,CAAC,SAAS,WAAW,EAAE,KAAK,CAAC,IAAI,SAAS,gBAAgB,GAAG,mBAAmB,EAAE,KAAK,SAAS,GAAG,EACpI,SAAS,OAAO,GAAG,UAAU,GAAG,OAAO,SAAS,EAChD,aAAa,OAAO,GAAG,UAAU,EACjC,cAAc,aAAa,CAAC,CAAC,EAAE,KAAK,CAAC,EACrC,WAAW,CAAC,EAAE,EAAE,IAAI,KAAK,MAAM,IAAI,4CA2GtC,CAAC"}

package/dist/components/form/free-text.jsx

@@ -1,41 +0,0 @@
-"use client";
-import React, { forwardRef, useEffect, useRef } from "react";
-import { css, initializeInputDataset, mergeRefs } from "../../lib/dom";
-import { InputField } from "./input-field";
-export const createFreeText = (Element, elementName, defaultProps, register) => {
-    const FreeText = forwardRef(({ info, left, next, error, right, container, rightLabel, interactive, optionalText, type = "text", labelClassName, feedback = null, hideLeft = false, loading, hiddenLabel, ...props }, ref) => {
-        const Render = Element;
-        const id = props.id ?? props.name;
-        const inputRef = useRef(null);
-        useEffect(() => {
-            if (inputRef.current === null)
-                return;
-            const input = inputRef.current;
-            const focus = initializeInputDataset(inputRef.current);
-            const registered = register?.(input);
-            const goNextInputImpl = (e) => {
-                const event = e;
-                if (event.key === "Enter" && input.enterKeyHint === "next") {
-                    const focusNext = input.getAttribute("data-next");
-                    if (focusNext) {
-                        const el = document.getElementById(focusNext);
-                        if (el) {
-                            el.focus();
-                            return void event.preventDefault();
-                        }
-                    }
-                }
-            };
-            input.addEventListener("keydown", goNextInputImpl);
-            return () => {
-                registered?.();
-                focus();
-                input.removeEventListener("keydown", goNextInputImpl);
-            };
-        }, []);
-        return (<InputField {...defaultProps} info={info} left={left} error={error} right={right} form={props.form} loading={loading} name={props.name} feedback={feedback} hideLeft={hideLeft} title={props.title} rightLabel={rightLabel} disabled={props.disabled} hiddenLabel={hiddenLabel} interactive={interactive} required={props.required} componentName={elementName} id={props.name || props.id} optionalText={optionalText} labelClassName={labelClassName} placeholder={props.placeholder} container={css(container, defaultProps.container)}>
-                    <Render {...defaultProps} {...props} id={id} name={id} type={type} data-next={next} aria-busy={loading} aria-invalid={!!error} aria-disabled={props.disabled} aria-readonly={props.readOnly} aria-describedby={error ? `${id}-error` : undefined} 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-base 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)}/>
-                </InputField>);
-    });
-    return FreeText;
-};

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

@@ -1,34 +0,0 @@
-import React, { type PropsWithChildren } from "react";
-import { type Label, Override } from "../../types";
-import { type PolymorphicProps } from "../core/polymorph";
-export type FeedbackProps = React.PropsWithChildren<Partial<{
-    id: string;
-    info: Label;
-    title: Label;
-    hideLeft: boolean;
-    className: string;
-    placeholder: string;
-    reportStatus: boolean;
-    hiddenLabel: boolean;
-}>>;
-export declare const InputFeedback: ({ reportStatus, id, hideLeft, className, info, children, title }: FeedbackProps) => React.JSX.Element;
-export type InputFieldProps<T extends "input" | "select" | "textarea"> = PolymorphicProps<Partial<Override<FeedbackProps, {
-    id: string;
-    info: Label;
-    left: Label;
-    name: string;
-    right: Label;
-    error: string;
-    feedback: Label;
-    loading: boolean;
-    container: string;
-    hideLeft: boolean;
-    rightLabel: Label;
-    placeholder: string;
-    interactive: boolean;
-    optionalText: string;
-    componentName: string;
-    labelClassName: string;
-}>>, T>;
-export declare const InputField: <T extends "input" | "select" | "textarea">(props: PropsWithChildren<InputFieldProps<T>>) => React.ReactElement;
-//# sourceMappingURL=input-field.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"input-field.d.ts","sourceRoot":"","sources":["../../../src/components/form/input-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAwB,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAI5E,OAAO,EAAE,KAAK,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAG1D,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,iBAAiB,CAC/C,OAAO,CAAC;IACJ,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,KAAK,CAAC;IACZ,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,OAAO,CAAC;CACxB,CAAC,CACL,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,kEAA0E,aAAa,sBA+CpH,CAAC;AAEF,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,OAAO,GAAG,QAAQ,GAAG,UAAU,IAAI,gBAAgB,CACrF,OAAO,CACH,QAAQ,CACJ,aAAa,EACb;IACI,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,KAAK,CAAC;IACZ,IAAI,EAAE,KAAK,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,KAAK,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,KAAK,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,KAAK,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;CAC1B,CACJ,CACJ,EACD,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,YAiGG,CAAC"}

package/dist/components/form/input-field.jsx

@@ -1,58 +0,0 @@
-"use client";
-import { CheckCircleIcon, InfoIcon, XCircleIcon } from "@phosphor-icons/react";
-import React, { forwardRef, Fragment } from "react";
-import { useTranslations } from "../../hooks/use-translations";
-import { useTweaks } from "../../hooks/use-tweaks";
-import { css } from "../../lib/dom";
-import { Tooltip } from "../floating/tooltip";
-export const InputFeedback = ({ reportStatus, id, hideLeft = false, className, info, children, title }) => (<span className={css("w-full justify-between", hideLeft && children === null ? "hidden" : "flex", className)}>
-        {hideLeft ? null : (<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">
-                {title}
-                {reportStatus || info ? (<span className="flex items-center justify-center gap-1">
-                        {info ? (<Tooltip as="button" type="button" aria-label={typeof info === "string" ? info : undefined} aria-describedby={typeof info === "string" ? undefined : id ? `tooltip-info-content-${id}` : undefined} title={<span className="cursor-help">
-                                        <InfoIcon className="aspect-square size-3" aria-hidden="true" size={16}/>
-                                    </span>}>
-                                <div id={id ? `tooltip-info-content-${id}` : undefined} className="w-full max-w-48 whitespace-break-spaces break-words">
-                                    {info}
-                                </div>
-                            </Tooltip>) : null}
-                        {reportStatus ? (<span className="flex h-3 min-w-6 items-center">
-                                <CheckCircleIcon 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}/>
-                                <XCircleIcon className="hidden aspect-square size-3 opacity-0 transition-opacity group-error:block group-error:opacity-100" aria-hidden="true" size={16}/>
-                            </span>) : null}
-                    </span>) : null}
-            </span>)}
-        {children}
-    </span>);
-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, reportStatus, hiddenLabel, }, ref) => {
-    const tweaks = useTweaks();
-    const reportStatusDefault = reportStatus !== undefined ? reportStatus : tweaks.input.iconFeedback;
-    const ID = id ?? name;
-    const translation = useTranslations();
-    const optionalText = _optionalText ?? translation.inputOptionalLabel;
-    return (<fieldset ref={ref} form={form} disabled={disabled} data-error={!!error} aria-disabled={disabled} data-component={componentName} data-interactive={!!interactive} className={css("group flex min-h-0 min-w-0 max-w-full flex-col items-start", container)}>
-                <label form={form} htmlFor={ID} className="relative inline-flex w-full max-w-full cursor-text flex-row flex-wrap justify-between gap-1 text-field-label text-sm transition-colors empty:hidden group-disabled:cursor-not-allowed group-error:text-danger">
-                    {hiddenLabel ? (<span className="sr-only">
-                            <InputFeedback info={info} hideLeft={hideLeft} reportStatus={reportStatusDefault} title={title} placeholder={placeholder}/>
-                        </span>) : (<InputFeedback info={info} hideLeft={hideLeft} reportStatus={reportStatusDefault} title={title} placeholder={placeholder}>
-                            {optionalText || rightLabel ? (<Fragment>
-                                    {!required ? (<span aria-disabled={disabled} className="text-opacity-70 transition-colors group-focus-within:text-primary group-hover:text-primary aria-disabled:text-disabled">
-                                            {optionalText}
-                                        </span>) : null}
-                                    {rightLabel ? <Fragment>{rightLabel}</Fragment> : null}
-                                </Fragment>) : null}
-                        </InputFeedback>)}
-                    <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}`}>
-                        {left ? <span className="flex flex-nowrap gap-1 whitespace-nowrap pl-2">{left}</span> : null}
-                        {children}
-                        {right ? <span className="flex flex-nowrap gap-2 whitespace-nowrap pr-2">{right}</span> : null}
-                    </div>
-                </label>
-                <p id={`${ID}-error`} role="alert" className="mt-input-gap hidden whitespace-pre-wrap text-wrap text-xs empty:mt-0 empty:hidden group-has-[input:not(:focus):invalid[data-initialized=true]]:flex group-error:flex group-error:text-danger">
-                    {error}
-                </p>
-                <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">
-                    {feedback}
-                </p>
-            </fieldset>);
-}); // forwardRef return is non-generic; cast restores the polymorphic signature

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

@@ -1,52 +0,0 @@
-import { AllMasks, CurrencyCode, CurrencyInputProps, CurrencyMaskTypes, Locales, PercentInputMask, PercentInputProps, TheMaskProps } from "the-mask-input";
-import { FreeTextProps } from "./free-text";
-export type * from "the-mask-input";
-/**
- * Props for the Input component, extending FreeTextProps with mask functionality
- * Supports currency, percentage, and custom mask patterns
- */
-export type InputProps = FreeTextProps<"input", ({
-    mask?: CurrencyMaskTypes;
-    locale?: Locales;
-    currency?: CurrencyCode | undefined;
-} & CurrencyInputProps) | ({
-    mask?: PercentInputMask;
-    locale?: Locales;
-    currency?: undefined;
-} & PercentInputProps) | ({
-    mask?: AllMasks | Array<string | RegExp> | ((p: string) => Array<string | RegExp> | AllMasks);
-    locale?: undefined;
-    currency?: undefined;
-} & TheMaskProps)>;
-/**
- * A text input component with advanced masking capabilities.
- *
- * Supports various input masks including:
- * - Currency formatting with locale support
- * - Percentage inputs
- * - Custom regex patterns
- * - Phone numbers, dates, and other formatted inputs
- *
- * @example
- * ```tsx
- * // Basic input
- * <Input placeholder="Enter text..." />
- *
- * // Phone number mask
- * <Input mask="(99) 99999-9999" placeholder="Phone" />
- *
- * // Currency input
- * <Input mask="currency" currency="USD" locale="en-US" />
- *
- * // Percentage input
- * <Input mask="percentage" />
- *
- * // Custom mask
- * <Input mask={["999.999.999-99"]} placeholder="CPF" />
- * ```
- *
- * @param props - Input props including mask, validation, and styling options
- * @returns A masked input component with form integration
- */
-export declare const Input: import("../..").ReactComponent<FreeTextProps<"input", InputProps>>;
-//# sourceMappingURL=input.d.ts.map

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

@@ -1 +0,0 @@
-{"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;;;GAGG;AACH,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,GAAG,SAAS,CAAC;CACvC,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,eAAO,MAAM,KAAK,oEAEhB,CAAC"}

package/dist/components/form/input.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"input.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/form/input.jsx

@@ -1,36 +0,0 @@
-"use client";
-import MaskInput from "the-mask-input";
-import { createFreeText } from "./free-text";
-/**
- * A text input component with advanced masking capabilities.
- *
- * Supports various input masks including:
- * - Currency formatting with locale support
- * - Percentage inputs
- * - Custom regex patterns
- * - Phone numbers, dates, and other formatted inputs
- *
- * @example
- * ```tsx
- * // Basic input
- * <Input placeholder="Enter text..." />
- *
- * // Phone number mask
- * <Input mask="(99) 99999-9999" placeholder="Phone" />
- *
- * // Currency input
- * <Input mask="currency" currency="USD" locale="en-US" />
- *
- * // Percentage input
- * <Input mask="percentage" />
- *
- * // Custom mask
- * <Input mask={["999.999.999-99"]} placeholder="CPF" />
- * ```
- *
- * @param props - Input props including mask, validation, and styling options
- * @returns A masked input component with form integration
- */
-export const Input = createFreeText(MaskInput, "input", {
-    type: "text",
-});

package/dist/components/form/multi-select.d.ts

@@ -1,19 +0,0 @@
-import React from "react";
-import { Label, Override } from "../../types";
-import { InputFieldProps } from "./input-field";
-import { type OptionProps } from "./select";
-export type MultiSelectItemProps = OptionProps & {
-    Render?: React.FC<OptionProps>;
-};
-export type MultiSelectProps = Override<InputFieldProps<"input">, {
-    title?: string;
-    value?: string[];
-    emptyMessage?: Label;
-    selectedLabel?: string;
-    defaultValue?: string[];
-    dynamicOption?: boolean;
-    options: MultiSelectItemProps[];
-    onChangeOptions?: (options: string[]) => void;
-}>;
-export declare const MultiSelect: React.ForwardRefExoticComponent<Omit<MultiSelectProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
-//# sourceMappingURL=multi-select.d.ts.map

package/dist/components/form/multi-select.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"multi-select.d.ts","sourceRoot":"","sources":["../../../src/components/form/multi-select.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAA6F,MAAM,OAAO,CAAC;AASlH,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAG9C,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,MAAM,MAAM,oBAAoB,GAAG,WAAW,GAAG;IAAE,MAAM,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAEpF,MAAM,MAAM,gBAAgB,GAAG,QAAQ,CACnC,eAAe,CAAC,OAAO,CAAC,EACxB;IACI,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,oBAAoB,EAAE,CAAC;IAChC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACjD,CACJ,CAAC;AA8DF,eAAO,MAAM,WAAW,wGAocvB,CAAC"}