@boxcustodia/library 1.2.1 → 1.2.2

package/dist/src/components/dropzone/__doc__/Dropzone.stories.d.ts

@@ -1,30 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-import { Dropzone } from '../Dropzone';
-
-declare const meta: Meta<typeof Dropzone>;
-export default meta;
-type Story = StoryObj<typeof Dropzone>;
-export declare const Default: Story;
-export declare const WithCustomIcon: Story;
-export declare const FileUploader: Story;
-export declare const MultipleFiles: Story;
-export declare const CustomFilePreview: Story;
-/**
- * El componente Dropzone está compuesto por los componentes primitivos UploadRoot, UploadTrigger, UploadContent, UploadAcceptedFiles y UploadRejectedFiles.
- *
- * Este ejemplo muestra como armar el componente Dropzone usando los componentes primitivos.
- *
- * ##### Estructura
- * ```tsx
- * <UploadRoot>
- *   <UploadTrigger>
- *   ...
- *   </UploadTrigger>
- *   <UploadContent>
- *     <UploadAcceptedFiles />
- *     <UploadRejectedFiles />
- *   </UploadContent>
- * </UploadRoot>
- * ```
- */
-export declare const Primitives: Story;

package/dist/src/components/dropzone/index.d.ts

@@ -1,3 +0,0 @@
-export * from './UploadPrimitives';
-export * from './Dropzone';
-export * from './FileTypes';

package/dist/src/components/dropzone/useDropzone.d.ts

@@ -1,17 +0,0 @@
-type UseDropzoneProps = {
-    onDrop: (acceptedFiles: File[], rejectedFiles: File[]) => void;
-    allowedExtensions?: string[];
-    maxFileSize?: number;
-    maxFiles?: number;
-};
-export declare const useDropzone: ({ onDrop, allowedExtensions, maxFileSize, maxFiles, }: UseDropzoneProps) => {
-    isDragActive: boolean;
-    validateFiles: (files: File[]) => [File[], File[]];
-    dropzoneProps: {
-        onDragOver: (e: React.DragEvent<HTMLDivElement>) => void;
-        onDragEnter: (e: React.DragEvent<HTMLDivElement>) => void;
-        onDragLeave: (e: React.DragEvent<HTMLDivElement>) => void;
-        onDrop: (e: React.DragEvent<HTMLDivElement>) => void;
-    };
-};
-export {};

package/dist/src/components/emptyState/EmptyState.d.ts

@@ -1,12 +0,0 @@
-import { ComponentPropsWithoutRef, ReactNode } from 'react';
-
-type Props = ComponentPropsWithoutRef<"div"> & {
-    icon?: ReactNode;
-    title?: ReactNode;
-    description?: ReactNode;
-};
-export declare const EmptyState: {
-    ({ icon, title, description, className, children, ...props }: Props): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export {};

package/dist/src/components/emptyState/__doc__/EmptyState.stories.d.ts

@@ -1,23 +0,0 @@
-import { EmptyState } from '../..';
-import { Meta, StoryObj } from '@storybook/react';
-
-/**
- * El componente EmptyState proporciona una interfaz visual para mostrar cuando no hay datos o contenido disponible.
- *
- * ### Características principales
- * - Soporte para íconos personalizados
- * - Título y descripción configurables
- * - Capacidad de agregar acciones mediante children
- */
-declare const meta: Meta<typeof EmptyState>;
-export default meta;
-type Story = StoryObj<typeof EmptyState>;
-/**
- * Ejemplo básico del EmptyState con título y descripción
- */
-export declare const Default: Story;
-/**
- * Ejemplo con ícono personalizado y botones de acción.
- * Demuestra cómo agregar interactividad al estado vacío.
- */
-export declare const Actions: Story;

package/dist/src/components/emptyState/index.d.ts

@@ -1 +0,0 @@
-export * from './EmptyState';

package/dist/src/components/field/Field.d.ts

@@ -1,15 +0,0 @@
-import { ComponentProps, ComponentPropsWithoutRef, ReactNode } from 'react';
-
-interface Props extends ComponentProps<"div"> {
-    label?: ReactNode;
-    labelClassName?: string;
-    labelProps?: ComponentPropsWithoutRef<"label">;
-    error?: ReactNode;
-    errorClassName?: string;
-    errorProps?: ComponentPropsWithoutRef<"p">;
-}
-export declare const Field: {
-    ({ label, labelClassName, labelProps, error, errorClassName, errorProps, children, className, ...props }: Props): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export {};

package/dist/src/components/field/__doc__/Field.stories.d.ts

@@ -1,12 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-import { Field } from '../..';
-
-/**
- * Componente Field que representa un campo de formulario.
- *
- * Agrega un label al campo y un mensaje de error opcional.
- **/
-declare const meta: Meta<typeof Field>;
-export default meta;
-type Story = StoryObj<typeof Field>;
-export declare const Default: Story;

package/dist/src/components/field/index.d.ts

@@ -1 +0,0 @@
-export * from './Field';

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

@@ -1,45 +0,0 @@
-import { Slot } from '@radix-ui/react-slot';
-import { ControllerRenderProps, FieldPath, FieldValues, UseFormReturn } from 'react-hook-form';
-
-import * as React from "react";
-type Props<TFieldValues extends FieldValues> = {
-    onSubmit: (data: TFieldValues) => void;
-    form: UseFormReturn<TFieldValues>;
-    children: React.ReactNode;
-    className?: string;
-    id?: string;
-};
-declare const Form: <TFieldValues extends FieldValues>({ onSubmit, id, form, children, className, }: Props<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-type FormFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = {
-    name: TName;
-    label: string;
-    description?: string;
-    render: (field: ControllerRenderProps<TFieldValues, TName>) => React.ReactNode;
-    itemProps?: React.ComponentProps<typeof FormItem>;
-    labelProps?: React.ComponentProps<typeof FormLabel>;
-    controlProps?: React.ComponentProps<typeof FormControl>;
-    descriptionProps?: React.ComponentProps<typeof FormDescription>;
-    messageProps?: React.ComponentProps<typeof FormMessage>;
-};
-declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ name, label, description, render, itemProps, labelProps, controlProps, descriptionProps, messageProps, }: FormFieldProps<TFieldValues, TName>) => import("react/jsx-runtime").JSX.Element;
-declare const FormItem: {
-    ({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-declare const FormLabel: {
-    ({ className, ...props }: React.ComponentProps<"label">): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-declare const FormControl: {
-    ({ className, ...props }: React.ComponentProps<typeof Slot>): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-declare const FormDescription: {
-    ({ className, ...props }: React.ComponentProps<"p">): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-declare const FormMessage: {
-    ({ className, children, ...props }: React.ComponentProps<"p">): import("react/jsx-runtime").JSX.Element | null;
-    displayName: string;
-};
-export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, };

package/dist/src/components/form/__doc__/Form.stories.d.ts

@@ -1,120 +0,0 @@
-import { Form } from '../..';
-import { Meta, StoryObj } from '@storybook/react';
-
-declare const meta: Meta<typeof Form>;
-export default meta;
-type Story = StoryObj<typeof Form>;
-/**
- * Para utilizar el componente `Form`, sigue estos pasos:
- *
- * **Crear un esquema de validación con Zod**:
- * El primer paso es definir un esquema de validación usando `zod`.
- * Este esquema establecerá las reglas para los datos del formulario,
- * como los tipos de datos esperados y los mensajes de error personalizados.
- *
- * ```tsx
- * const FormSchema = z.object({
- *   username: z.string().min(1, {
- *     message: "Debe tener al menos dos carácteres",
- *  }),
- *  email: z
- *     .string()
- *     .min(1, { message: "Debe ingresar un correo electrónico" })
- *     .email("Debe ingresar un correo electrónico válido"),
- * });
- *    ```
- *
- * **Llamar al hook `useForm`**:
- * Una vez definido el esquema, debes llamar al hook `useForm`
- * para inicializar el formulario con el esquema de validación.
- * También puedes definir valores predeterminados para los campos del formulario.
- *
- * ```tsx
- * const form = useForm<MyForm>(FormSchema, {
- *   defaultValues: {
- *     username: "",
- *     email: "",
- *   },
- * });
- * ```
- *
- * **Usar el componente `Form`**:
- * Finalmente, utiliza el componente `Form` pasándole la instancia
- * del formulario creada por el hook `useForm`. Dentro de este componente,
- * puedes definir los campos del formulario utilizando `FormField` y otros
- * componentes de entrada, como `Input`, `Select`, y `TextArea`.
- *
- * ```tsx
- * <Form form={form} onSubmit={onSubmit}>
- *   <FormField
- *     name="username"
- *     label="Username"
- *     description="Ingresa tu nombre de usuario"
- *     render={(field) => <Input {...field} />}
- *   />
- *   <FormField
- *     name="email"
- *     label="Email"
- *     description="Ingresa tu correo electrónico"
- *     render={(field) => <Input {...field} type="email" />}
- *   />
- * </Form>
- * ```
- *
- * **Manejo del envío del formulario**:
- * Define una función `onSubmit` que será llamada cuando el formulario sea enviado.
- * Esta función recibirá los datos validados según el esquema y permitirá manejar
- * el envío, como mostrar un mensaje de éxito o enviar los datos a un servidor.
- *
- * ```tsx
- * const onSubmit = (data: MyForm) => {
- *   ...
- * }
- * ```
- */
-export declare const Default: Story;
-/**
- * **Formulario controlado**:
- * Puedes controlar los valores del formulario programáticamente usando los métodos
- * que proporciona `react-hook-form`. En este ejemplo, mostramos cómo usar `setValue` para
- * actualizar campos específicos del formulario.
- *
- * ```tsx
- * const form = useForm<MyForm>(schema);
- *
- * // Actualizar valores individuales
- * form.setValue('username', 'John');
- * form.setValue('fruit', 'apple');
- * ```
- *
- * Esto es útil cuando necesitas:
- * - Establecer valores por defecto de forma asíncrona
- * - Actualizar el formulario basado en acciones del usuario
- * - Rellenar el formulario con datos externos
- *
- * El componente `Form` reaccionará automáticamente a estos cambios y
- * actualizará la interfaz de usuario en consecuencia.
- */
-export declare const Controlled: Story;
-/**
- * **Valores por defecto asíncronos**:
- * El componente Form también admite la carga asíncrona de valores por defecto.
- * Esto es útil cuando necesitas obtener los valores iniciales desde una API
- * o cualquier otra fuente asíncrona.
- *
- * ```tsx
- * const fetchDefaultValues = async () => {
- *   const response = await api.getUser();
- *   return response.data;
- * };
- *
- * const form = useForm({
- *   defaultValues: async () => fetchDefaultValues()
- * });
- * ```
- *
- * En este ejemplo, los valores del formulario se cargarán después de una
- * simulación de llamada a API. Durante la carga, los campos permanecerán
- * vacíos hasta que se resuelva la promesa.
- */
-export declare const AsyncDefaultValues: Story;

package/dist/src/components/form/context/FormFieldContext.d.ts

@@ -1,6 +0,0 @@
-import { FieldValues, FieldPath } from 'react-hook-form';
-
-export type FormFieldContextValue<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = {
-    name: TName;
-};
-export declare const useFormFieldContext: () => FormFieldContextValue<FieldValues, string>, FormFieldContextProvider: import('react').Provider<FormFieldContextValue<FieldValues, string> | null>;

package/dist/src/components/form/context/FormItemContext.d.ts

@@ -1,4 +0,0 @@
-export type FormItemContextValue = {
-    id: string;
-};
-export declare const useFormItemContext: () => FormItemContextValue, FormItemContextProvider: import('react').Provider<FormItemContextValue | null>;

package/dist/src/components/form/context/index.d.ts

@@ -1,2 +0,0 @@
-export * from './FormItemContext';
-export * from './FormFieldContext';

package/dist/src/components/form/hooks/index.d.ts

@@ -1,2 +0,0 @@
-export * from './useForm';
-export * from './useFormField';

package/dist/src/components/form/hooks/useForm.d.ts

@@ -1,4 +0,0 @@
-import { FieldValues, UseFormProps } from 'react-hook-form';
-import { ZodType } from 'zod';
-
-export declare function useForm<T extends FieldValues = FieldValues>(schema: ZodType<T>, options?: Partial<UseFormProps<T>>): import('react-hook-form').UseFormReturn<T, any, undefined>;

package/dist/src/components/form/hooks/useFormField.d.ts

@@ -1,12 +0,0 @@
-export declare const useFormField: () => {
-    invalid: boolean;
-    isDirty: boolean;
-    isTouched: boolean;
-    isValidating: boolean;
-    error?: import('react-hook-form').FieldError;
-    id: string;
-    name: string;
-    formItemId: string;
-    formDescriptionId: string;
-    formMessageId: string;
-};

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

@@ -1,2 +0,0 @@
-export * from './Form';
-export * from './hooks';

package/dist/src/components/heading/Heading.d.ts

@@ -1,11 +0,0 @@
-import { VariantProps } from 'class-variance-authority';
-import { HeadingVariants } from './Heading.variants';
-
-type Props<C extends React.ElementType> = VariantProps<typeof HeadingVariants> & {
-    as?: C;
-} & Omit<React.ComponentPropsWithoutRef<C>, "as">;
-export declare const Heading: {
-    <C extends React.ElementType = "h2">({ className, size, weight, as, ...props }: Props<C>): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export {};

package/dist/src/components/heading/Heading.variants.d.ts

@@ -1,4 +0,0 @@
-export declare const HeadingVariants: (props?: ({
-    size?: "sm" | "lg" | "md" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | null | undefined;
-    weight?: "bold" | "normal" | "medium" | "semibold" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/src/components/heading/__doc__/Heading.stories.d.ts

@@ -1,10 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-import { Heading } from '../..';
-
-declare const meta: Meta<typeof Heading>;
-export default meta;
-type Story = StoryObj<typeof Heading>;
-export declare const Default: Story;
-export declare const Sizes: Story;
-export declare const Weights: Story;
-export declare const As: Story;

package/dist/src/components/heading/index.d.ts

@@ -1 +0,0 @@
-export * from './Heading';

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

@@ -1,43 +0,0 @@
-export * from './alertdialog';
-export * from './autoComplete';
-export * from './avatar';
-export * from './backgroundImage';
-export * from './button';
-export * from './calendar';
-export * from './card';
-export * from './center';
-export * from './checkbox';
-export * from './combobox';
-export * from './datepicker';
-export * from './dialog';
-export * from './divider';
-export * from './dropzone';
-export * from './emptyState';
-export * from './field';
-export * from './form';
-export * from './heading';
-export * from './input';
-export * from './kbd';
-export * from './label';
-export * from './loader';
-export * from './menu';
-export * from './multiSelect';
-export * from './numberInput';
-export * from './pagination';
-export * from './password';
-export * from './popover';
-export * from './select';
-export * from './show';
-export * from './skeleton';
-export * from './stack';
-export * from './stepper';
-export * from './switch';
-export * from './table';
-export * from './tablePagination';
-export * from './tabs';
-export * from './tag';
-export * from './textarea';
-export * from './timeline';
-export * from './toast';
-export * from './tooltip';
-export * from './tree';

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

@@ -1,16 +0,0 @@
-import { OverrideProps } from '../../models';
-import { ComponentProps } from 'react';
-
-type Props = OverrideProps<ComponentProps<"input">, {
-    /** valor del input */
-    value?: string;
-    /** functión a ejecutar cuando el valor cambia */
-    onChange?: (value: string) => void;
-    /** valor por defecto del input */
-    defaultValue?: string;
-}>;
-export declare const Input: {
-    ({ value: prop, onChange, defaultValue: defaultProp, ...rest }: Props): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export {};

package/dist/src/components/input/__doc__/Input.stories.d.ts

@@ -1,38 +0,0 @@
-import { Input } from '../..';
-import { Meta, StoryObj } from '@storybook/react';
-
-/**
- * Componente principal para ingresar datos
- */
-declare const meta: Meta<typeof Input>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Default: Story;
-export declare const Disabled: Story;
-export declare const File: Story;
-/**
- * El componente permite recibir una referencia para manipular el componente
- */
-export declare const Reference: Story;
-/**
- * El componente se puede controlar con un estado
- */
-export declare const Controlled: Story;
-/**
- * ThemeProvider permite customizar de manera global las propiedades del componente
- *
- * Ejemplo:
- * ```tsx
- * <ThemeProvider
- *   theme={{
- *     Input: {
- *       placeholder: "Placeholder por defecto...",
- *       className: "bg-gray-200 rounded-full placeholder:text-gray-400",
- *     },
- *   }}
- * >
- *   <Input />
- * </ThemeProvider>
- * ```
- */
-export declare const Theme: Story;

package/dist/src/components/input/__test__/Input.test.d.ts

@@ -1 +0,0 @@
-export {};

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

@@ -1 +0,0 @@
-export * from './Input';

package/dist/src/components/kbd/Kbd.d.ts

@@ -1,10 +0,0 @@
-import { VariantProps } from 'class-variance-authority';
-import { ComponentPropsWithoutRef } from 'react';
-import { KbdVariants } from './Kbd.variants';
-
-type Props = ComponentPropsWithoutRef<"kbd"> & VariantProps<typeof KbdVariants>;
-export declare const Kbd: {
-    ({ variant, size, className, ...props }: Props): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export {};

package/dist/src/components/kbd/Kbd.variants.d.ts

@@ -1,4 +0,0 @@
-export declare const KbdVariants: (props?: ({
-    variant?: "default" | "error" | "outline" | "secondary" | null | undefined;
-    size?: "default" | "sm" | "lg" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/src/components/kbd/__doc__/Kbd.stories.d.ts

@@ -1,16 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-import { Kbd } from '../..';
-
-declare const meta: Meta<typeof Kbd>;
-export default meta;
-type Story = StoryObj<typeof Kbd>;
-export declare const Default: Story;
-export declare const Secondary: Story;
-export declare const Error: Story;
-export declare const Outline: Story;
-export declare const WithText: Story;
-/**
- * Se puede utilizar el atributo `size` para cambiar el tamaño del componente
- * los tamaños disponibles son `default`, `sm` y `lg`
- */
-export declare const Sizes: Story;

package/dist/src/components/kbd/index.d.ts

@@ -1 +0,0 @@
-export * from './Kbd';

package/dist/src/components/label/Label.d.ts

@@ -1,7 +0,0 @@
-import * as React from "react";
-type Props = React.ComponentProps<"label">;
-export declare const Label: {
-    ({ className, ...props }: Props): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export {};

package/dist/src/components/label/__doc__/Label.stories.d.ts

@@ -1,7 +0,0 @@
-import { Label } from '../..';
-import { Meta, StoryObj } from '@storybook/react';
-
-declare const meta: Meta<typeof Label>;
-export default meta;
-type Story = StoryObj<typeof Label>;
-export declare const Default: Story;

package/dist/src/components/label/__test__/Label.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/src/components/label/index.d.ts

@@ -1 +0,0 @@
-export * from './Label';

package/dist/src/components/loader/Loader.d.ts

@@ -1,12 +0,0 @@
-import { LucideProps } from 'lucide-react';
-import { LoaderVariants } from './loader.variants';
-
-type Props = LucideProps & LoaderVariants & {
-    center?: boolean;
-    containerClassName?: string;
-};
-export declare const Loader: {
-    ({ center, containerClassName, variant, size, ...props }: Props): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export {};

package/dist/src/components/loader/__doc__/Loader.stories.d.ts

@@ -1,43 +0,0 @@
-import { Loader } from '../..';
-import { Meta, StoryObj } from '@storybook/react';
-
-/**
- * El componente Loader proporciona una indicación visual de que una operación está en progreso.
- *
- * ### Características principales
- * - Múltiples variantes de color
- * - Diferentes tamaños
- * - Opción para centrado automático
- * - Personalizable mediante props
- *
- * ### Uso básico
- * ```tsx
- * <Loader />
- * ```
- */
-declare const meta: Meta<typeof Loader>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-/**
- * Ejemplo básico del loader con configuración por defecto
- */
-export declare const Default: Story;
-/**
- * El loader viene con diferentes variantes de color para adaptarse a distintos contextos `primary`, `secondary`, `ghost`, `error`, `success`
- */
-export declare const Variants: Story;
-/**
- * Disponible en tres tamaños diferentes:
- * - `sm`: Pequeño (16x16px)
- * - `default`: Mediano (28x28px)
- * - `lg`: Grande (40x40px)
- */
-export declare const Sizes: Story;
-/**
- * Con la prop `center={true}`, el loader se centrará automáticamente en su contenedor
- */
-export declare const Centered: Story;
-/**
- * El loader puede ser personalizado con props adicionales como color y tamaño
- */
-export declare const Custom: Story;

package/dist/src/components/loader/__test__/Loader.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/src/components/loader/index.d.ts

@@ -1 +0,0 @@
-export * from './Loader';

package/dist/src/components/loader/loader.variants.d.ts

@@ -1,7 +0,0 @@
-import { VariantProps } from 'class-variance-authority';
-
-export declare const loaderVariants: (props?: ({
-    variant?: "error" | "success" | "secondary" | "ghost" | "primary" | null | undefined;
-    size?: "default" | "sm" | "lg" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export type LoaderVariants = VariantProps<typeof loaderVariants>;