@digitalpromise/design 3.0.0 → 4.2.0

package/dist/components/button.d.ts

@@ -1,4 +1,4 @@
-import type { ButtonHTMLAttributes } from "react";
+import { ButtonHTMLAttributes } from 'react';
 declare const variants: readonly ["primary", "secondary", "tertiary"];
 declare const states: readonly ["default", "danger", "inverse", "decolor"];
 type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {

package/dist/components/forms/checkbox.d.ts

@@ -0,0 +1,7 @@
+import { FormInputProps, InputPropsWithoutType } from './types';
+type CheckboxProps = InputPropsWithoutType & FormInputProps & {
+    label: string;
+};
+export declare const Checkbox: ({ error, className, label, ...props }: CheckboxProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=checkbox.d.ts.map

package/dist/components/forms/checkbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/forms/checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAErE,KAAK,aAAa,GAAG,qBAAqB,GACxC,cAAc,GAAG;IACf,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEJ,eAAO,MAAM,QAAQ,GAAI,uCAKtB,aAAa,4CAoBf,CAAC"}

package/dist/components/forms/dropzone.d.ts

@@ -0,0 +1,11 @@
+import { ReactElement, ComponentPropsWithRef } from 'react';
+import { FormInputProps } from './types';
+interface DropzoneProps extends Omit<ComponentPropsWithRef<"input">, "type">, FormInputProps {
+    instructions?: string;
+    remover?: ReactElement;
+}
+export declare const Dropzone: ({ children, error, instructions, className, onChange: userOnChange, remover, ...props }: DropzoneProps) => import("react/jsx-runtime").JSX.Element;
+type SingleImageDropzoneProps = Omit<DropzoneProps, "multiple" | "accept" | "children">;
+export declare const SingleImageDropzone: (props: SingleImageDropzoneProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=dropzone.d.ts.map

package/dist/components/forms/dropzone.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropzone.d.ts","sourceRoot":"","sources":["../../../src/components/forms/dropzone.tsx"],"names":[],"mappings":"AAEA,OAAO,EAKL,YAAY,EAGZ,KAAK,qBAAqB,EAC3B,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAG9C,UAAU,aACR,SAAQ,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC,EAClD,cAAc;IAChB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB;AAED,eAAO,MAAM,QAAQ,GAAI,yFAQtB,aAAa,4CAiHf,CAAC;AAEF,KAAK,wBAAwB,GAAG,IAAI,CAClC,aAAa,EACb,UAAU,GAAG,QAAQ,GAAG,UAAU,CACnC,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,OAAO,wBAAwB,4CAelE,CAAC"}

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

@@ -0,0 +1,11 @@
+import { FormInputProps } from './types';
+interface FormFieldProps<C extends FormInputProps> {
+    Input: React.ComponentType<C>;
+    inputProps: C;
+    errorMessage?: string;
+    label: string;
+    labelClassname?: string;
+}
+export declare const FormField: <P extends FormInputProps>({ Input, inputProps, errorMessage, label, labelClassname, }: FormFieldProps<P>) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=form-field.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"form-field.d.ts","sourceRoot":"","sources":["../../../src/components/forms/form-field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAGzC,UAAU,cAAc,CAAC,CAAC,SAAS,cAAc;IAC/C,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;IAC9B,UAAU,EAAE,CAAC,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,SAAS,GAAI,CAAC,SAAS,cAAc,EAAE,6DAMjD,cAAc,CAAC,CAAC,CAAC,4CAmBnB,CAAC"}

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

@@ -0,0 +1,5 @@
+import { ComponentPropsWithRef } from 'react';
+type FormProps = ComponentPropsWithRef<"form">;
+export declare const Form: ({ noValidate, className, ...props }: FormProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=form.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../../src/components/forms/form.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAE9C,KAAK,SAAS,GAAG,qBAAqB,CAAC,MAAM,CAAC,CAAC;AAE/C,eAAO,MAAM,IAAI,GAAI,qCAAqC,SAAS,4CAQlE,CAAC"}

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

@@ -0,0 +1,9 @@
+import { Checkbox } from './checkbox';
+import { Dropzone, SingleImageDropzone } from './dropzone';
+import { Form } from './form';
+import { FormField } from './form-field';
+import { Select } from './select';
+import { TextInput } from './text-input';
+import { Textarea } from './textarea';
+export { Checkbox, Dropzone, SingleImageDropzone, Form, FormField, Select, Textarea, TextInput, };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/forms/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/forms/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,OAAO,EACL,QAAQ,EACR,QAAQ,EACR,mBAAmB,EACnB,IAAI,EACJ,SAAS,EACT,MAAM,EACN,QAAQ,EACR,SAAS,GACV,CAAC"}

package/dist/components/forms/label.d.ts

@@ -0,0 +1,8 @@
+import { ComponentPropsWithRef } from 'react';
+export interface LabelProps extends ComponentPropsWithRef<"label"> {
+    label: string;
+    error?: boolean;
+    required?: boolean;
+}
+export declare const Label: ({ className, label, required, error, ...props }: LabelProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=label.d.ts.map

package/dist/components/forms/label.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.d.ts","sourceRoot":"","sources":["../../../src/components/forms/label.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,MAAM,WAAW,UAAW,SAAQ,qBAAqB,CAAC,OAAO,CAAC;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,KAAK,GAAI,iDAMnB,UAAU,4CAWZ,CAAC"}

package/dist/components/forms/list.d.ts

@@ -0,0 +1,8 @@
+import { FormInputProps } from './types';
+type ListInputProps = FormInputProps & {
+    onChange?: (list: string[]) => void;
+    defaultValue?: string[];
+};
+export declare const ListInput: ({ onChange, defaultValue }: ListInputProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=list.d.ts.map

package/dist/components/forms/list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../../src/components/forms/list.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,KAAK,cAAc,GAAG,cAAc,GAAG;IACrC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACpC,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;CACzB,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,4BAA4B,cAAc,4CAmEnE,CAAC"}

package/dist/components/forms/select.d.ts

@@ -0,0 +1,10 @@
+import { ComponentPropsWithRef } from 'react';
+import { FormInputProps } from './types';
+export interface SelectProps extends ComponentPropsWithRef<"select">, FormInputProps {
+    options: {
+        value: string;
+        label: string;
+    }[];
+}
+export declare const Select: ({ options, error, className, ...props }: SelectProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=select.d.ts.map

package/dist/components/forms/select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/components/forms/select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,WAAW,WAAY,SAAQ,qBAAqB,CAAC,QAAQ,CAAC,EAAE,cAAc;IAClF,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CAC7C;AAED,eAAO,MAAM,MAAM,GAAI,yCAKpB,WAAW,4CAcb,CAAC"}

package/dist/components/forms/text-input.d.ts

@@ -0,0 +1,7 @@
+import { ComponentPropsWithRef } from 'react';
+import { FormInputProps } from './types';
+interface TextInputProps extends ComponentPropsWithRef<"input">, FormInputProps {
+}
+export declare const TextInput: ({ error, className, ...props }: TextInputProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=text-input.d.ts.map

package/dist/components/forms/text-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-input.d.ts","sourceRoot":"","sources":["../../../src/components/forms/text-input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,UAAU,cAAe,SAAQ,qBAAqB,CAAC,OAAO,CAAC,EAAE,cAAc;CAAG;AAElF,eAAO,MAAM,SAAS,GAAI,gCAAgC,cAAc,4CASvE,CAAC"}

package/dist/components/forms/textarea.d.ts

@@ -0,0 +1,7 @@
+import { ComponentPropsWithRef } from 'react';
+import { FormInputProps } from './types';
+interface TextareaProps extends ComponentPropsWithRef<"textarea">, FormInputProps {
+}
+export declare const Textarea: ({ className, error, ...props }: TextareaProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=textarea.d.ts.map

package/dist/components/forms/textarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/components/forms/textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,UAAU,aAAc,SAAQ,qBAAqB,CAAC,UAAU,CAAC,EAAE,cAAc;CAAG;AAEpF,eAAO,MAAM,QAAQ,GAAI,gCAAgC,aAAa,4CAQrE,CAAC"}

package/dist/components/forms/types.d.ts

@@ -0,0 +1,9 @@
+import { ComponentPropsWithRef } from 'react';
+export interface FormInputProps {
+    id?: string;
+    name?: string;
+    error?: boolean;
+    required?: boolean;
+}
+export type InputPropsWithoutType = Omit<ComponentPropsWithRef<"input">, "type">;
+//# sourceMappingURL=types.d.ts.map

package/dist/components/forms/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/forms/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,MAAM,WAAW,cAAc;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,MAAM,qBAAqB,GAAG,IAAI,CACtC,qBAAqB,CAAC,OAAO,CAAC,EAC9B,MAAM,CACP,CAAC"}

package/dist/components/icon.d.ts

@@ -0,0 +1,14 @@
+import { DPGIconName } from '@digitalpromise/icons';
+import { ComponentPropsWithRef } from 'react';
+interface IconProps extends ComponentPropsWithRef<"svg"> {
+    name: DPGIconName;
+}
+export declare const Icon: ({ name, className, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+type IconButtonProps = Omit<ComponentPropsWithRef<"button">, "type"> & {
+    icon: DPGIconName;
+    iconClassName?: string;
+    label?: string;
+};
+export declare const IconButton: ({ label, className, icon, iconClassName, ...props }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=icon.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../src/components/icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAEzD,OAAO,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,UAAU,SAAU,SAAQ,qBAAqB,CAAC,KAAK,CAAC;IACtD,IAAI,EAAE,WAAW,CAAC;CACnB;AAED,eAAO,MAAM,IAAI,GAAI,+BAA+B,SAAS,4CAQ5D,CAAC;AAEF,KAAK,eAAe,GAAG,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,GAAG;IACrE,IAAI,EAAE,WAAW,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,qDAMxB,eAAe,4CAWjB,CAAC"}

package/dist/components/index.d.ts

@@ -0,0 +1,8 @@
+import { default as Button } from './button';
+import { default as Logo } from './logo';
+import { default as Pagination } from './pagination';
+import { default as Search } from './search';
+import { default as Table } from './table';
+export type { TableColumn } from './table';
+export { Button, Logo, Pagination, Search, Table };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,YAAY,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"search.d.ts","sourceRoot":"","sources":["../../src/components/search.tsx"],"names":[],"mappings":"AAKA,KAAK,WAAW,GAAG;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,WAAW,EACX,SAAS,EACT,UAAU,EACV,KAAK,EACL,QAAQ,EACR,SAAgB,EAChB,EAAa,EACb,QAAc,GACf,EAAE,WAAW,2CA8Fb"}
+{"version":3,"file":"search.d.ts","sourceRoot":"","sources":["../../src/components/search.tsx"],"names":[],"mappings":"AAMA,KAAK,WAAW,GAAG;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,WAAW,EACX,SAAS,EACT,UAAU,EACV,KAAK,EACL,QAAQ,EACR,SAAgB,EAChB,EAAa,EACb,QAAc,GACf,EAAE,WAAW,2CA+Fb"}

package/dist/components/tab-list.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+export interface TabProps {
+    id: string;
+    label: ReactNode;
+    content: ReactNode;
+}
+export interface TabListProps {
+    tabs: TabProps[];
+}
+export declare const TabList: ({ tabs }: TabListProps) => import("react/jsx-runtime").JSX.Element | ReactNode[];
+//# sourceMappingURL=tab-list.d.ts.map

package/dist/components/tab-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-list.d.ts","sourceRoot":"","sources":["../../src/components/tab-list.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAEjD,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,SAAS,CAAC;IACjB,OAAO,EAAE,SAAS,CAAC;CACpB;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,QAAQ,EAAE,CAAC;CAClB;AAED,eAAO,MAAM,OAAO,GAAI,UAAU,YAAY,0DA8B7C,CAAC"}

package/dist/components/table.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from "react";
+import { ReactNode } from 'react';
 export type TableColumn<TRow> = {
     key: string;
     header: string;

package/dist/components/tag-list.d.ts

@@ -0,0 +1,4 @@
+export declare const TagList: ({ tags }: {
+    tags: string[];
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=tag-list.d.ts.map

package/dist/components/tag-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag-list.d.ts","sourceRoot":"","sources":["../../src/components/tag-list.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO,GAAI,UAAU;IAAE,IAAI,EAAE,MAAM,EAAE,CAAA;CAAE,4CAenD,CAAC"}

package/dist/forms.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("react"),g=require("./icon-DjGt_3uE.cjs"),I=({error:a,className:r,label:t,...l})=>{const n=l.id||l.name;return e.jsxs("div",{className:"flex gap-3 items-center",children:[e.jsx("input",{type:"checkbox",className:`transition-colors appearance-none cursor-pointer bg-neutral-1 border-2 border-gray-5 rounded-sm w-5 h-5 grid place-content-center hover:bg-gray-1 hover:border-neutral-5 before:hidden before:content-['\\2713'] before:text-neutral-1 before:font-bold checked:bg-blue-3 checked:border-blue-4 checked:hover:bg-blue-4 checked:hover:border-blue-5 checked:before:inline-block ${r??""}`.trim(),...l,id:n}),e.jsx("label",{"data-error":a||null,htmlFor:n,className:"data-error:text-red-4",children:t})]})},p=({children:a,error:r,instructions:t,className:l,onChange:n,remover:d,...i})=>{const s=u.useRef(null),[v,m]=u.useState(!1),[b,j]=u.useState([]),h=b.length>0,w=o=>{o.preventDefault(),m(!1),s.current&&o.dataTransfer.files.length>0&&(s.current.files=o.dataTransfer.files,o.dataTransfer.clearData(),s.current.dispatchEvent(new Event("change",{bubbles:!0})))},y=o=>{n&&n(o);const k=Array.from(o.currentTarget.files??[]).map(c=>{if(c.type.includes("image")){const F=URL.createObjectURL(c);return e.jsx("img",{alt:"",src:F,className:"max-h-full max-w-full object-contain"},c.name)}else return e.jsx("p",{children:c.name},c.name)});j(k)},N=()=>{s.current&&(s.current.value="",s.current.files=null,s.current.dispatchEvent(new Event("change",{bubbles:!0})))},x={onClick:o=>{o.preventDefault(),N()}},D=d?u.cloneElement(d,x):e.jsx(g.Button,{type:"button",variant:"tertiary",state:"decolor",...x,children:"Remove Files"}),f=o=>{o.preventDefault(),m(!0)};return e.jsxs("div",{children:[e.jsxs("label",{"data-showing-preview":h||null,"data-is-dragging":v||null,onDragLeave:()=>m(!1),onDragEnter:f,onDragOver:f,onDrop:w,htmlFor:i.id,"data-error":r||null,className:`flex items-center justify-center rounded-lg border border-dashed border-blue-3 px-7 py-8 font-medium text-blue-3 data-showing-preview:w-max data-showing-preview:border-gray-3 data-showing-preview:text-gray-3 data-is-dragging:border-blue-5 data-is-dragging:bg-blue-1 data-showing-preview:py-5 data-is-dragging:text-blue-4 ${l??""} cursor-default`.trim(),children:[e.jsx("input",{...i,ref:s,onChange:y,className:"sr-only",type:"file"}),h?e.jsxs(e.Fragment,{children:[e.jsx("aside",{className:"grid grid-cols-2 grid-rows-2 w-11 h-11",children:b}),D]}):a??e.jsxs("p",{className:"pointer-events-none select-none",children:[e.jsx(g.Icon,{name:"Upload"})," Click or drop to upload"]})]}),t&&e.jsx("p",{className:"font-light leading-6",children:t})]})},T=a=>{const r=e.jsx(g.Button,{type:"button",variant:"tertiary",state:"decolor",children:"Remove Image"});return e.jsx(p,{...a,multiple:!1,remover:r,accept:"image/png image/svg+xml"})},q=({noValidate:a,className:r,...t})=>e.jsx("form",{className:`container flex flex-col gap-7 max-w-[45rem] ${r??""}`.trim(),...t,noValidate:a??!0}),C=({className:a,label:r,required:t,error:l,...n})=>e.jsx("label",{"data-required":t||null,"data-error":l||null,...n,className:`text-base font-medium leading-5 data-error:text-red-4 data-required:after:content-['*'] data-required:after:text-red-4 data-required:after:ml-1 ${a??""}`.trim(),children:r}),S=({Input:a,inputProps:r,errorMessage:t,label:l,labelClassname:n})=>{const d=!!t,i=r?.id||r?.name;return e.jsxs("div",{className:"flex flex-col gap-3",children:[e.jsx(C,{label:l,className:n,htmlFor:i,required:r?.required,error:d}),e.jsx(a,{error:d,...r,id:i}),t&&e.jsx("p",{className:"text-red-4",children:t})]})},E=({options:a,error:r,className:t,...l})=>e.jsx("select",{...l,"data-error":r||null,className:`border border-gray-5 rounded-sm text-base leading-5 px-[0.94rem] py-[0.69rem] focus-within:border-transparent focus-within:outline-blue-4 data-error:border-red-4 data-error:outline-red-4 ${t??""}`.trim(),children:a.map(n=>e.jsx("option",{className:"hover:bg-gray-3",value:n.value,children:n.label},[l.name,n.label].join()))}),R=({error:a,className:r,...t})=>e.jsx("input",{"data-error":a||null,className:`border border-gray-5 rounded-sm text-base leading-5 px-[0.94rem] py-[0.69rem] focus-within:border-transparent focus-within:outline-blue-4 data-error:border-red-4 data-error:outline-red-4 ${r??""}`.trim(),...t,type:"text"}),$=({className:a,error:r,...t})=>e.jsx("textarea",{"data-error":r||null,className:`border border-gray-5 rounded-sm text-base leading-5 px-[0.94rem] py-[0.69rem] focus-within:border-transparent focus-within:outline-blue-4 data-error:border-red-4 data-error:outline-red-4 ${a??""}`.trim(),...t});exports.Checkbox=I;exports.Dropzone=p;exports.Form=q;exports.FormField=S;exports.Select=E;exports.SingleImageDropzone=T;exports.TextInput=R;exports.Textarea=$;

package/dist/forms.js

@@ -0,0 +1,199 @@
+import { jsxs as i, jsx as e, Fragment as C } from "react/jsx-runtime";
+import { useRef as E, useState as p, cloneElement as T } from "react";
+import { B as v, I as $ } from "./icon-BR2zaZo5.js";
+const S = ({
+  error: a,
+  className: r,
+  label: t,
+  ...l
+}) => {
+  const n = l.id || l.name;
+  return /* @__PURE__ */ i("div", { className: "flex gap-3 items-center", children: [
+    /* @__PURE__ */ e(
+      "input",
+      {
+        type: "checkbox",
+        className: `transition-colors appearance-none cursor-pointer bg-neutral-1 border-2 border-gray-5 rounded-sm w-5 h-5 grid place-content-center hover:bg-gray-1 hover:border-neutral-5 before:hidden before:content-['\\2713'] before:text-neutral-1 before:font-bold checked:bg-blue-3 checked:border-blue-4 checked:hover:bg-blue-4 checked:hover:border-blue-5 checked:before:inline-block ${r ?? ""}`.trim(),
+        ...l,
+        id: n
+      }
+    ),
+    /* @__PURE__ */ e(
+      "label",
+      {
+        "data-error": a || null,
+        htmlFor: n,
+        className: "data-error:text-red-4",
+        children: t
+      }
+    )
+  ] });
+}, j = ({
+  children: a,
+  error: r,
+  instructions: t,
+  className: l,
+  onChange: n,
+  remover: s,
+  ...c
+}) => {
+  const d = E(null), [x, m] = p(!1), [g, w] = p([]), b = g.length > 0, y = (o) => {
+    o.preventDefault(), m(!1), d.current && o.dataTransfer.files.length > 0 && (d.current.files = o.dataTransfer.files, o.dataTransfer.clearData(), d.current.dispatchEvent(
+      new Event("change", { bubbles: !0 })
+    ));
+  }, N = (o) => {
+    n && n(o);
+    const k = Array.from(o.currentTarget.files ?? []).map((u) => {
+      if (u.type.includes("image")) {
+        const F = URL.createObjectURL(u);
+        return /* @__PURE__ */ e(
+          "img",
+          {
+            alt: "",
+            src: F,
+            className: "max-h-full max-w-full object-contain"
+          },
+          u.name
+        );
+      } else
+        return /* @__PURE__ */ e("p", { children: u.name }, u.name);
+    });
+    w(k);
+  }, D = () => {
+    d.current && (d.current.value = "", d.current.files = null, d.current.dispatchEvent(
+      new Event("change", { bubbles: !0 })
+    ));
+  }, h = {
+    onClick: (o) => {
+      o.preventDefault(), D();
+    }
+  }, I = s ? T(s, h) : /* @__PURE__ */ e(v, { type: "button", variant: "tertiary", state: "decolor", ...h, children: "Remove Files" }), f = (o) => {
+    o.preventDefault(), m(!0);
+  };
+  return /* @__PURE__ */ i("div", { children: [
+    /* @__PURE__ */ i(
+      "label",
+      {
+        "data-showing-preview": b || null,
+        "data-is-dragging": x || null,
+        onDragLeave: () => m(!1),
+        onDragEnter: f,
+        onDragOver: f,
+        onDrop: y,
+        htmlFor: c.id,
+        "data-error": r || null,
+        className: `flex items-center justify-center rounded-lg border border-dashed border-blue-3 px-7 py-8 font-medium text-blue-3 data-showing-preview:w-max data-showing-preview:border-gray-3 data-showing-preview:text-gray-3 data-is-dragging:border-blue-5 data-is-dragging:bg-blue-1 data-showing-preview:py-5 data-is-dragging:text-blue-4 ${l ?? ""} cursor-default`.trim(),
+        children: [
+          /* @__PURE__ */ e(
+            "input",
+            {
+              ...c,
+              ref: d,
+              onChange: N,
+              className: "sr-only",
+              type: "file"
+            }
+          ),
+          b ? /* @__PURE__ */ i(C, { children: [
+            /* @__PURE__ */ e("aside", { className: "grid grid-cols-2 grid-rows-2 w-11 h-11", children: g }),
+            I
+          ] }) : a ?? /* @__PURE__ */ i("p", { className: "pointer-events-none select-none", children: [
+            /* @__PURE__ */ e($, { name: "Upload" }),
+            " Click or drop to upload"
+          ] })
+        ]
+      }
+    ),
+    t && /* @__PURE__ */ e("p", { className: "font-light leading-6", children: t })
+  ] });
+}, U = (a) => /* @__PURE__ */ e(
+  j,
+  {
+    ...a,
+    multiple: !1,
+    remover: /* @__PURE__ */ e(v, { type: "button", variant: "tertiary", state: "decolor", children: "Remove Image" }),
+    accept: "image/png image/svg+xml"
+  }
+), z = ({ noValidate: a, className: r, ...t }) => /* @__PURE__ */ e(
+  "form",
+  {
+    className: `container flex flex-col gap-7 max-w-[45rem] ${r ?? ""}`.trim(),
+    ...t,
+    noValidate: a ?? !0
+  }
+), q = ({
+  className: a,
+  label: r,
+  required: t,
+  error: l,
+  ...n
+}) => /* @__PURE__ */ e(
+  "label",
+  {
+    "data-required": t || null,
+    "data-error": l || null,
+    ...n,
+    className: `text-base font-medium leading-5 data-error:text-red-4 data-required:after:content-['*'] data-required:after:text-red-4 data-required:after:ml-1 ${a ?? ""}`.trim(),
+    children: r
+  }
+), P = ({
+  Input: a,
+  inputProps: r,
+  errorMessage: t,
+  label: l,
+  labelClassname: n
+}) => {
+  const s = !!t, c = r?.id || r?.name;
+  return /* @__PURE__ */ i("div", { className: "flex flex-col gap-3", children: [
+    /* @__PURE__ */ e(
+      q,
+      {
+        label: l,
+        className: n,
+        htmlFor: c,
+        required: r?.required,
+        error: s
+      }
+    ),
+    /* @__PURE__ */ e(a, { error: s, ...r, id: c }),
+    t && /* @__PURE__ */ e("p", { className: "text-red-4", children: t })
+  ] });
+}, A = ({
+  options: a,
+  error: r,
+  className: t,
+  ...l
+}) => /* @__PURE__ */ e(
+  "select",
+  {
+    ...l,
+    "data-error": r || null,
+    className: `border border-gray-5 rounded-sm text-base leading-5 px-[0.94rem] py-[0.69rem] focus-within:border-transparent focus-within:outline-blue-4 data-error:border-red-4 data-error:outline-red-4 ${t ?? ""}`.trim(),
+    children: a.map((n) => /* @__PURE__ */ e("option", { className: "hover:bg-gray-3", value: n.value, children: n.label }, [l.name, n.label].join()))
+  }
+), O = ({ error: a, className: r, ...t }) => /* @__PURE__ */ e(
+  "input",
+  {
+    "data-error": a || null,
+    className: `border border-gray-5 rounded-sm text-base leading-5 px-[0.94rem] py-[0.69rem] focus-within:border-transparent focus-within:outline-blue-4 data-error:border-red-4 data-error:outline-red-4 ${r ?? ""}`.trim(),
+    ...t,
+    type: "text"
+  }
+), V = ({ className: a, error: r, ...t }) => /* @__PURE__ */ e(
+  "textarea",
+  {
+    "data-error": r || null,
+    className: `border border-gray-5 rounded-sm text-base leading-5 px-[0.94rem] py-[0.69rem] focus-within:border-transparent focus-within:outline-blue-4 data-error:border-red-4 data-error:outline-red-4 ${a ?? ""}`.trim(),
+    ...t
+  }
+);
+export {
+  S as Checkbox,
+  j as Dropzone,
+  z as Form,
+  P as FormField,
+  A as Select,
+  U as SingleImageDropzone,
+  O as TextInput,
+  V as Textarea
+};