thread-ui 0.2.0 → 0.4.0

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

@@ -0,0 +1,148 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+import { FileUploadProvider } from './file-upload-context';
+import { isFileImageType } from '../../../utils';
+import { FileUploadContent } from './components/file-upload-content';
+/**
+ * File upload component with drag-and-drop, file validation, image preview,
+ * and optional filename/alt text editing before saving.
+ *
+ * Validates against allowed MIME types, max file size, and max file count.
+ * Image files generate a preview; non-image files show a generic indicator.
+ *
+ * @example
+ * <FileUpload
+ *   name="attachments"
+ *   value={value}
+ *   onChange={onChange}
+ *   allowedFileTypes={['image/*', 'application/pdf']}
+ *   maxFileSize={5 * 1024 * 1024}
+ *   maxNumberFiles={3}
+ * />
+ */
+export const FileUpload = ({ title = 'Upload a File', name, id = name, value, onChange, allowedFileTypes = ['*/*'], maxFileSize, maxNumberFiles, supportedFormatsText, required, size = 'md', }) => {
+    // Init Display States
+    const [isDragging, setIsDragging] = useState(false);
+    const [preview, setPreview] = useState(null);
+    const [status, setStatus] = useState('');
+    // Init File States
+    const [selectedFile, setSelectedFile] = useState(null);
+    const [customFilename, setCustomFilename] = useState('');
+    const [alt, setAlt] = useState('');
+    // Validate File Type
+    const isValidFileType = (file) => {
+        if (allowedFileTypes.includes('*/*'))
+            return true;
+        return allowedFileTypes.some((type) => {
+            // Handle wildcards like 'image/*'
+            if (type.endsWith('/*')) {
+                const category = type.split('/')[0];
+                return file.type.startsWith(`${category}/`);
+            }
+            return file.type === type;
+        });
+    };
+    // File Submissions
+    const processFile = (file) => {
+        // Ensure Maximum is not Exceeded
+        if (maxNumberFiles && value.length >= maxNumberFiles) {
+            setStatus(`Maximum files already added`);
+            return;
+        }
+        // Ensure File is passed
+        if (!file) {
+            setStatus('No File Selected');
+        }
+        // Ensure Valid Type
+        if (!isValidFileType(file)) {
+            setStatus(`Invalid file type. Please select a ${allowedFileTypes.join(', ')} file`);
+            return;
+        }
+        // Ensure Valid Size
+        if (maxFileSize && file.size > maxFileSize) {
+            setStatus(`File too large. Maximum size is ${Math.round(maxFileSize / 1024 / 1024)}MB`);
+            return;
+        }
+        // Extract Original Filename for user Editing
+        const extension = file.name.split('.').pop() || '';
+        const originalName = file.name.replace(`.${extension}`, '');
+        setCustomFilename(originalName);
+        setSelectedFile(file);
+        setStatus('');
+        // Generate Image Preview
+        if (isFileImageType(file)) {
+            const reader = new FileReader();
+            reader.onloadend = () => {
+                const result = reader.result;
+                if (typeof result === 'string') {
+                    setPreview(result);
+                }
+            };
+            reader.readAsDataURL(file);
+        }
+        else {
+            // Clear preview for non-image files
+            setPreview(null);
+        }
+    };
+    // Remove File from files
+    const handleClearFile = () => {
+        setSelectedFile(null);
+        setPreview(null);
+        setCustomFilename('');
+        setStatus('');
+    };
+    // Save Selected file
+    const saveFile = () => {
+        if (selectedFile) {
+            // Create new file with custom name
+            const extension = selectedFile.name.split('.').pop() || '';
+            const newFileName = `${customFilename}.${extension}`;
+            const renamedFile = new File([selectedFile], newFileName, {
+                type: selectedFile.type,
+                lastModified: selectedFile.lastModified,
+            });
+            // Add alt text
+            renamedFile.alt = alt;
+            onChange([...value, renamedFile]);
+            handleClearFile();
+        }
+    };
+    const removeFile = (index) => {
+        // Remove File @ index
+        const updatedFiles = value.filter((_, i) => i !== index);
+        // Save Changes
+        onChange(updatedFiles);
+    };
+    return (_jsx(FileUploadProvider, { value: {
+            id,
+            title,
+            name,
+            onChange,
+            allowedFileTypes,
+            maxFileSize,
+            maxNumberFiles,
+            supportedFormatsText,
+            required,
+            size,
+            isDragging,
+            setIsDragging,
+            preview,
+            setPreview,
+            status,
+            setStatus,
+            customFilename,
+            setCustomFilename,
+            alt,
+            setAlt,
+            value,
+            selectedFile,
+            setSelectedFile,
+            processFile,
+            handleClearFile,
+            saveFile,
+            removeFile,
+        }, children: _jsx(FileUploadContent, {}) }));
+};
+//# sourceMappingURL=file-upload.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"file-upload.js","sourceRoot":"","sources":["../../../../src/components/form-elements/file-upload/file-upload.tsx"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,36 @@
+import { InputProps } from '../input-props.types';
+export type UploadableFile = File & {
+    /** Alt text for image files */
+    alt?: string;
+};
+export type FileUploadProps = Omit<InputProps<UploadableFile[], UploadableFile[]>, 'placeholder'> & {
+    /** MIME types accepted. Supports wildcards like `image/*` @default `['*\/*']` */
+    allowedFileTypes?: string[];
+    /** Maximum file size in bytes */
+    maxFileSize?: number;
+    /** Maximum number of files that can be uploaded */
+    maxNumberFiles?: number;
+    /** Custom text describing supported formats, shown in the upload area */
+    supportedFormatsText?: string;
+    /** Controls the size of the upload area @default `'md'` */
+    size?: 'sm' | 'md' | 'lg';
+};
+export type FileUploadContext = FileUploadProps & {
+    isDragging: boolean;
+    selectedFile: UploadableFile | null;
+    preview: string | null;
+    status: string;
+    customFilename: string;
+    alt: string;
+    setIsDragging: (isDragging: boolean) => void;
+    setSelectedFile: (file: UploadableFile | null) => void;
+    setPreview: (preview: string | null) => void;
+    setStatus: (status: string) => void;
+    setCustomFilename: (filename: string) => void;
+    setAlt: (alt: string) => void;
+    processFile: (file: File) => void;
+    handleClearFile: () => void;
+    saveFile: () => void;
+    removeFile: (index: number) => void;
+};
+//# sourceMappingURL=file-upload.types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"file-upload.types.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/file-upload/file-upload.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAElD,MAAM,MAAM,cAAc,GAAG,IAAI,GAAG;IACnC,+BAA+B;IAC/B,GAAG,CAAC,EAAE,MAAM,CAAC;CACb,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,IAAI,CACjC,UAAU,CAAC,cAAc,EAAE,EAAE,cAAc,EAAE,CAAC,EAC9C,aAAa,CACb,GAAG;IACH,iFAAiF;IACjF,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,iCAAiC;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,yEAAyE;IACzE,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,2DAA2D;IAC3D,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,eAAe,GAAG;IAEjD,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,cAAc,GAAG,IAAI,CAAC;IACpC,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,cAAc,EAAE,MAAM,CAAC;IACvB,GAAG,EAAE,MAAM,CAAC;IAGZ,aAAa,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,eAAe,EAAE,CAAC,IAAI,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;IACvD,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7C,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,iBAAiB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,MAAM,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAG9B,WAAW,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAClC,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,CAAC"}

package/dist/components/form-elements/file-upload/file-upload.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=file-upload.types.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"file-upload.types.js","sourceRoot":"","sources":["../../../../src/components/form-elements/file-upload/file-upload.types.ts"],"names":[],"mappings":""}

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

@@ -0,0 +1,3 @@
+export type { FileUploadProps } from './file-upload.types';
+export { FileUpload } from './file-upload';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/file-upload/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}

package/dist/components/form-elements/file-upload/index.js

@@ -0,0 +1,2 @@
+export { FileUpload } from './file-upload';
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/form-elements/file-upload/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}

package/dist/components/form-elements/form-label/form-label.d.ts

@@ -1,3 +1,9 @@
 import { FormLabelProps } from './form-label.types';
+/**
+ * Form label linked to a control by `name`. Renders as an `H3` typographic style.
+ *
+ * @example
+ * <FormLabel name="email" title="Email Address" />
+ */
 export declare const FormLabel: ({ name, id, title }: FormLabelProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=form-label.d.ts.map

package/dist/components/form-elements/form-label/form-label.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form-label.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/form-label/form-label.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAGpD,eAAO,MAAM,SAAS,GAAI,qBAA4B,cAAc,4CAWnE,CAAC"}
+{"version":3,"file":"form-label.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/form-label/form-label.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAGpD;;;;;GAKG;AACH,eAAO,MAAM,SAAS,GAAI,qBAA4B,cAAc,4CAYnE,CAAC"}

package/dist/components/form-elements/form-label/form-label.js

@@ -1,12 +1,18 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { css } from '../../../styled-system/css';
 import { H3 } from '../../../components/typography';
+/**
+ * Form label linked to a control by `name`. Renders as an `H3` typographic style.
+ *
+ * @example
+ * <FormLabel name="email" title="Email Address" />
+ */
 export const FormLabel = ({ name, id = name, title }) => {
     const styles = css({
         display: 'block',
         alignSelf: 'flex-start',
-        marginBottom: '8px',
+        marginBottom: '2',
     });
-    return (_jsx("label", { id: id, htmlFor: name, className: "block self-start font-medium text-gray-700 mb-2", children: _jsx(H3, { children: title }) }));
+    return (_jsx("label", { id: id, htmlFor: name, className: styles, children: _jsx(H3, { children: title }) }));
 };
 //# sourceMappingURL=form-label.js.map

package/dist/components/form-elements/form-label/form-label.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-label.js","sourceRoot":"","sources":["../../../../src/components/form-elements/form-label/form-label.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;AAE7C,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,GAAG,IAAI,EAAE,KAAK,EAAkB,EAAE,EAAE;IACvE,MAAM,MAAM,GAAG,GAAG,CAAC;QAClB,OAAO,EAAE,OAAO;QAChB,SAAS,EAAE,YAAY;QACvB,YAAY,EAAE,KAAK;KACnB,CAAC,CAAC;IACH,OAAO,CACN,gBAAO,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAC,iDAAiD,YACxF,KAAC,EAAE,cAAE,KAAK,GAAM,GACT,CACR,CAAC;AACH,CAAC,CAAC"}
+{"version":3,"file":"form-label.js","sourceRoot":"","sources":["../../../../src/components/form-elements/form-label/form-label.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;AAE7C;;;;;GAKG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,GAAG,IAAI,EAAE,KAAK,EAAkB,EAAE,EAAE;IACvE,MAAM,MAAM,GAAG,GAAG,CAAC;QAClB,OAAO,EAAE,OAAO;QAChB,SAAS,EAAE,YAAY;QACvB,YAAY,EAAE,GAAG;KACjB,CAAC,CAAC;IAEH,OAAO,CACN,gBAAO,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,YAC9C,KAAC,EAAE,cAAE,KAAK,GAAM,GACT,CACR,CAAC;AACH,CAAC,CAAC"}

package/dist/components/form-elements/form-label/form-label.types.d.ts

@@ -1,6 +1,9 @@
 export type FormLabelProps = {
+    /** Defaults to `name` if not provided */
     id?: string;
+    /** Associates the label with its form control via `htmlFor` */
     name: string;
+    /** Text displayed in the label */
     title?: string;
 };
 //# sourceMappingURL=form-label.types.d.ts.map

package/dist/components/form-elements/form-label/form-label.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form-label.types.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/form-label/form-label.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,cAAc,GAAG;IACzB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC"}
+{"version":3,"file":"form-label.types.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/form-label/form-label.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,cAAc,GAAG;IAC5B,yCAAyC;IACzC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,+DAA+D;IAC/D,IAAI,EAAE,MAAM,CAAC;IACb,kCAAkC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,CAAC"}

package/dist/components/form-elements/index.d.ts

@@ -1,4 +1,6 @@
 export * from './form-label';
 export * from './number-input';
 export * from './text-input';
+export * from './file-upload';
+export * from './dropdown';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/form-elements/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/form-elements/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/form-elements/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC"}

package/dist/components/form-elements/index.js

@@ -1,4 +1,6 @@
 export * from './form-label';
 export * from './number-input';
 export * from './text-input';
+export * from './file-upload';
+export * from './dropdown';
 //# sourceMappingURL=index.js.map

package/dist/components/form-elements/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/form-elements/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/form-elements/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC"}

package/dist/components/form-elements/input-props.types.d.ts

@@ -1,10 +1,17 @@
-export type InputProps<T> = {
+export type InputProps<TValue, TChange = React.ChangeEvent<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement>> = {
+    /** Defaults to `name` if not provided */
     id?: string;
+    /** Form field name */
     name: string;
+    /** Label text rendered above the input */
     title?: string;
-    value?: T;
+    /** Controlled value */
+    value: TValue;
+    /** Require value for form submission */
     required?: boolean;
+    /** Descriptive text rendered within input */
     placeholder?: string;
-    onChange?: (e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement>) => void;
+    /** Called when the input value changes */
+    onChange: (e: TChange) => void | Promise<void>;
 };
 //# sourceMappingURL=input-props.types.d.ts.map

package/dist/components/form-elements/input-props.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input-props.types.d.ts","sourceRoot":"","sources":["../../../src/components/form-elements/input-props.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,UAAU,CAAC,CAAC,IAAI;IACxB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,CAAC,CAAC;IACV,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,GAAG,iBAAiB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;CACzG,CAAC"}
+{"version":3,"file":"input-props.types.d.ts","sourceRoot":"","sources":["../../../src/components/form-elements/input-props.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,UAAU,CACrB,MAAM,EACN,OAAO,GAAG,KAAK,CAAC,WAAW,CAAC,gBAAgB,GAAG,iBAAiB,GAAG,mBAAmB,CAAC,IACpF;IACH,yCAAyC;IACzC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,sBAAsB;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,0CAA0C;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uBAAuB;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0CAA0C;IAC1C,QAAQ,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CAC/C,CAAC"}

package/dist/components/form-elements/number-input/number-input.d.ts

@@ -1,3 +1,17 @@
 import { NumberInputProps } from './number-input.types';
-export declare const NumberInput: ({ name, id, title, value, placeholder, required, dark, min, max, onChange }: NumberInputProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Number input with increment/decrement buttons and optional min/max range enforcement.
+ * Blocks non-numeric keyboard input and respects range bounds on both direct input and stepping.
+ *
+ * @example
+ * <NumberInput
+ *   name="quantity"
+ *   title="Quantity"
+ *   value={qty}
+ *   min={1}
+ *   max={99}
+ *   onChange={handleChange}
+ * />
+ */
+export declare const NumberInput: ({ name, id, title, value, placeholder, required, dark, min, max, onChange, }: NumberInputProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=number-input.d.ts.map

package/dist/components/form-elements/number-input/number-input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"number-input.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/number-input/number-input.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAcxD,eAAO,MAAM,WAAW,GAAI,6EAAoF,gBAAgB,4CA4H/H,CAAC"}
+{"version":3,"file":"number-input.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/number-input/number-input.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAcxD;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,WAAW,GAAI,8EAWzB,gBAAgB,4CAmLlB,CAAC"}

package/dist/components/form-elements/number-input/number-input.js

@@ -4,7 +4,7 @@ import { Icon } from '../../../components';
 import { FormLabel } from '../form-label';
 import { InputWrapper } from '../input-wrapper';
 import { useState, useEffect } from 'react';
-import { css } from '../../../styled-system/css';
+import { css, cva, cx } from '../../../styled-system/css';
 const valueWithinRange = (value, min, max) => {
     if (min !== undefined && value < min) {
         return false;
@@ -14,7 +14,21 @@ const valueWithinRange = (value, min, max) => {
     }
     return true;
 };
-export const NumberInput = ({ name, id = name, title, value, placeholder, required, dark, min, max, onChange }) => {
+/**
+ * Number input with increment/decrement buttons and optional min/max range enforcement.
+ * Blocks non-numeric keyboard input and respects range bounds on both direct input and stepping.
+ *
+ * @example
+ * <NumberInput
+ *   name="quantity"
+ *   title="Quantity"
+ *   value={qty}
+ *   min={1}
+ *   max={99}
+ *   onChange={handleChange}
+ * />
+ */
+export const NumberInput = ({ name, id = name, title, value, placeholder, required, dark, min, max, onChange, }) => {
     // Initialize state with the value from props or null
     const [num, setNum] = useState(value);
     // Update internal state
@@ -66,35 +80,82 @@ export const NumberInput = ({ name, id = name, title, value, placeholder, requir
         }
     };
     const styles = {
-        bttnBg: css({
-            backgroundColor: { base: 'gray.light', _hover: 'gray.main' },
+        arrowButton: cva({
+            base: {
+                backgroundColor: { base: 'gray.light', _hover: 'gray.100' },
+                borderWidth: 'md',
+                borderColor: 'gray.light',
+                _focus: {
+                    ring: '2',
+                    ringColor: 'gray.100',
+                    outline: 'none',
+                },
+            },
+            variants: {
+                direction: {
+                    left: {
+                        borderStartStartRadius: 'lg',
+                        borderEndStartRadius: 'lg',
+                    },
+                    right: {
+                        borderStartEndRadius: 'lg',
+                        borderEndEndRadius: 'lg',
+                    },
+                },
+            },
+        }),
+        baseSegment: css({
+            borderWidth: 'md',
+            borderColor: 'gray.light',
+            padding: '3',
+            height: '11',
+            textAlign: 'center',
+            fontSize: 'sm',
+        }),
+        centerSegment: css({
+            color: 'text.standard',
+            width: '16',
+            appearance: 'none',
+            '&::-webkit-outer-spin-button': {
+                appearance: 'none',
+            },
+            '&::-webkit-inner-spin-button': {
+                appearance: 'none',
+            },
+            _focus: {
+                ringColor: 'blue.500',
+                borderColor: 'blue.500',
+            },
+        }),
+        container: css({
+            display: 'flex',
+            justifyContent: 'center',
+            alignItems: 'center',
+            alignSelf: 'start',
         }),
-        border: 'border border-gray-300',
-        layout: 'p-3 h-11',
-        focus: 'focus:ring-gray-100 focus:ring-2 focus:outline-none',
-        dark: 'dark:bg-gray-700 dark:hover:bg-gray-600 dark:border-gray-600 dark:focus:ring-gray-700',
-        left: 'rounded-s-lg',
-        right: 'rounded-e-lg',
-        inputBorder: 'border-y border-gray-300',
-        inputBg: 'bg-gray-50',
-        text: 'text-center text-gray-900 text-sm',
-        inputFocus: 'focus:ring-blue-500 focus:border-blue-500',
-        alterInput: 'appearance-none [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none [-moz-appearance:textfield]',
     };
-    const bttnLeft = `${styles.bttnBg} ${styles.border} ${styles.layout} ${styles.focus} ${styles.dark} ${styles.left}`;
-    const bttnRight = `${styles.bttnBg} ${styles.border} ${styles.layout} ${styles.focus} ${styles.dark} ${styles.right}`;
-    return (_jsxs(InputWrapper, { children: [title && _jsx(FormLabel, { id: id, name: name, title: title }), _jsxs("div", { className: "flex self-start justify-center items-center", children: [_jsx("button", { type: "button", className: bttnLeft, onClick: handleIncrement(-1), children: _jsx(Icon, { name: "CaretLeft", color: "gray", size: 12 }) }), _jsx("input", { type: "number", id: id, name: name, placeholder: placeholder, value: num ?? '', onChange: handleInputChange, className: `w-16  ${styles.layout} ${styles.border} ${styles.text} ${styles.inputFocus} ${styles.alterInput} ${dark ? styles.inputBg : ''}`, onKeyDown: (e) => {
+    return (_jsxs(InputWrapper, { children: [title && _jsx(FormLabel, { id: id, name: name, title: title }), _jsxs("div", { className: styles.container, children: [_jsx("button", { type: "button", className: cx(styles.arrowButton({ direction: 'left' }), styles.baseSegment), onClick: handleIncrement(-1), children: _jsx(Icon, { name: "CaretLeft", color: "gray", size: 12 }) }), _jsx("input", { type: "number", id: id, name: name, placeholder: placeholder, value: num ?? '', onChange: handleInputChange, className: cx(styles.baseSegment, styles.centerSegment), onKeyDown: (e) => {
                             // Allow minus sign as first character if negative values are allowed
-                            if (e.key === '-' && e.currentTarget.value.length === 0 && (min === undefined || min < 0)) {
+                            if (e.key === '-' &&
+                                e.currentTarget.value.length === 0 &&
+                                (min === undefined || min < 0)) {
                                 return; // Allow the minus sign
                             }
                             // Prevent non-numeric input except allowed control keys
                             if (!/[0-9]/.test(e.key) &&
                                 !e.ctrlKey &&
                                 !e.metaKey &&
-                                !['Backspace', 'Delete', 'ArrowLeft', 'ArrowRight', 'Tab', 'Home', 'End'].includes(e.key)) {
+                                ![
+                                    'Backspace',
+                                    'Delete',
+                                    'ArrowLeft',
+                                    'ArrowRight',
+                                    'Tab',
+                                    'Home',
+                                    'End',
+                                ].includes(e.key)) {
                                 e.preventDefault();
                             }
-                        }, required: required, min: min, max: max }), _jsx("button", { type: "button", className: bttnRight, onClick: handleIncrement(1), children: _jsx(Icon, { name: "CaretRight", color: "gray", size: 12 }) })] })] }));
+                        }, required: required, min: min, max: max }), _jsx("button", { type: "button", className: cx(styles.arrowButton({ direction: 'right' }), styles.baseSegment), onClick: handleIncrement(1), children: _jsx(Icon, { name: "CaretRight", color: "gray", size: 12 }) })] })] }));
 };
 //# sourceMappingURL=number-input.js.map

package/dist/components/form-elements/number-input/number-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"number-input.js","sourceRoot":"","sources":["../../../../src/components/form-elements/number-input/number-input.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"number-input.js","sourceRoot":"","sources":["../../../../src/components/form-elements/number-input/number-input.tsx"],"names":[],"mappings":"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"}

package/dist/components/form-elements/number-input/number-input.types.d.ts

@@ -1,7 +1,10 @@
 import { InputProps } from '../input-props.types';
 export type NumberInputProps = InputProps<number> & {
+    /** Applies dark styling */
     dark?: boolean;
+    /** Minimum allowed value */
     min?: number;
+    /** Maximum allowed value */
     max?: number;
 };
 //# sourceMappingURL=number-input.types.d.ts.map

package/dist/components/form-elements/number-input/number-input.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"number-input.types.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/number-input/number-input.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAElD,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,MAAM,CAAC,GAAG;IAChD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC"}
+{"version":3,"file":"number-input.types.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/number-input/number-input.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAElD,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,MAAM,CAAC,GAAG;IACnD,2BAA2B;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,4BAA4B;IAC5B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,4BAA4B;IAC5B,GAAG,CAAC,EAAE,MAAM,CAAC;CACb,CAAC"}

package/dist/components/form-elements/styles/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/styles/index.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,eAAe;;;;;;;;;EA2B1B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/styles/index.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,eAAe;;;;;;;;;EA6B1B,CAAC"}

package/dist/components/form-elements/styles/index.js

@@ -1,11 +1,13 @@
 import { cva } from '../../../styled-system/css';
 export const baseInputStyles = cva({
     base: {
+        color: 'text.standard',
         paddingX: '16px',
         paddingY: '8px',
         borderWidth: '1px',
         borderStyle: 'solid',
         borderColor: 'structure',
+        borderRadius: 'md',
         transition: 'colors',
         _focus: {
             outline: 'none',
@@ -24,7 +26,7 @@ export const baseInputStyles = cva({
         },
     },
     defaultVariants: {
-        alt: true,
+        alt: false,
     },
 });
 //# sourceMappingURL=index.js.map

package/dist/components/form-elements/styles/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/form-elements/styles/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,CAAC;IAClC,IAAI,EAAE;QACL,QAAQ,EAAE,MAAM;QAChB,QAAQ,EAAE,KAAK;QACf,WAAW,EAAE,KAAK;QAClB,WAAW,EAAE,OAAO;QACpB,WAAW,EAAE,WAAW;QACxB,UAAU,EAAE,QAAQ;QACpB,MAAM,EAAE;YACP,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,aAAa;YAC1B,SAAS,EAAE,6BAA6B;SACxC;KACD;IACD,QAAQ,EAAE;QACT,GAAG,EAAE;YACJ,IAAI,EAAE;gBACL,KAAK,EAAE,MAAM;aACb;YACD,KAAK,EAAE;gBACN,KAAK,EAAE,MAAM;aACb;SACD;KACD;IACD,eAAe,EAAE;QAChB,GAAG,EAAE,IAAI;KACT;CACD,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/form-elements/styles/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,CAAC;IAClC,IAAI,EAAE;QACL,KAAK,EAAE,eAAe;QACtB,QAAQ,EAAE,MAAM;QAChB,QAAQ,EAAE,KAAK;QACf,WAAW,EAAE,KAAK;QAClB,WAAW,EAAE,OAAO;QACpB,WAAW,EAAE,WAAW;QACxB,YAAY,EAAE,IAAI;QAClB,UAAU,EAAE,QAAQ;QACpB,MAAM,EAAE;YACP,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,aAAa;YAC1B,SAAS,EAAE,6BAA6B;SACxC;KACD;IACD,QAAQ,EAAE;QACT,GAAG,EAAE;YACJ,IAAI,EAAE;gBACL,KAAK,EAAE,MAAM;aACb;YACD,KAAK,EAAE;gBACN,KAAK,EAAE,MAAM;aACb;SACD;KACD;IACD,eAAe,EAAE;QAChB,GAAG,EAAE,KAAK;KACV;CACD,CAAC,CAAC"}

package/dist/components/form-elements/text-input/text-input.d.ts

@@ -1,3 +1,9 @@
 import { TextInputProps } from './text-input.types';
-export declare const TextInput: ({ name, id, title, value, required, placeholder, multiline, onChange }: TextInputProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Text input that renders either a single-line `input` or a resizable `textarea`.
+ *
+ * @example
+ * <TextInput name="bio" title="Bio" value={bio} multiline onChange={handleChange} />
+ */
+export declare const TextInput: ({ name, id, title, value, required, placeholder, multiline, onChange, }: TextInputProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=text-input.d.ts.map

package/dist/components/form-elements/text-input/text-input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-input.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/text-input/text-input.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAKpD,eAAO,MAAM,SAAS,GAAI,wEAAuF,cAAc,4CAiC9H,CAAC"}
+{"version":3,"file":"text-input.d.ts","sourceRoot":"","sources":["../../../../src/components/form-elements/text-input/text-input.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAKpD;;;;;GAKG;AACH,eAAO,MAAM,SAAS,GAAI,yEASvB,cAAc,4CAkChB,CAAC"}

package/dist/components/form-elements/text-input/text-input.js

@@ -3,9 +3,15 @@ import { FormLabel } from '../form-label';
 import { InputWrapper } from '../input-wrapper';
 import { baseInputStyles } from '../styles';
 import { cx, css } from '../../../styled-system/css';
-export const TextInput = ({ name, id = name, title, value, required, placeholder, multiline = false, onChange }) => {
+/**
+ * Text input that renders either a single-line `input` or a resizable `textarea`.
+ *
+ * @example
+ * <TextInput name="bio" title="Bio" value={bio} multiline onChange={handleChange} />
+ */
+export const TextInput = ({ name, id = name, title, value, required, placeholder, multiline = false, onChange, }) => {
     const style = css({
-        minHeight: '100px',
+        minHeight: '25',
         resize: 'vertical',
     });
     return (_jsxs(InputWrapper, { children: [title && _jsx(FormLabel, { id: id, name: name, title: title }), multiline ? (_jsx("textarea", { id: id, name: name, required: required, value: value, onChange: onChange, placeholder: placeholder, rows: 3, className: cx(baseInputStyles(), style) })) : (_jsx("input", { type: "text", id: id, name: name, required: required, value: value, onChange: onChange, placeholder: placeholder, className: baseInputStyles() }))] }));