@powerhousedao/document-engineering 1.38.0 → 1.39.0

package/dist/src/scalars/components/file-field/file-field.stories.js

@@ -0,0 +1,199 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { getDefaultArgTypes, getValidationArgTypes, PrebuiltArgTypes, StorybookControlCategory, } from '@powerhousedao/document-engineering/scalars/lib/storybook-arg-types.js';
+import { FileField } from './file-field.js';
+import { withForm } from '@powerhousedao/document-engineering/scalars/lib/decorators.js';
+/**
+ *
+ * `FileField` is an enhanced file picker component that wraps `FileInput` with built-in validation support.
+ * It provides automatic validation for file types and file size limits.
+ *
+ */
+const meta = {
+    title: 'Scalars/File Field',
+    component: FileField,
+    decorators: [
+        withForm,
+        (Story) => (_jsx("div", { className: "w-[247px]", children: _jsx(Story, {}) })),
+    ],
+    parameters: {
+        layout: 'centered',
+        form: {
+            resetBehavior: 'unmount',
+        },
+    },
+    tags: ['autodocs'],
+    argTypes: {
+        ...getDefaultArgTypes(),
+        ...PrebuiltArgTypes.className,
+        value: {
+            control: 'file',
+            description: 'Current value of the input field',
+            table: {
+                type: { summary: 'File | null' },
+                category: StorybookControlCategory.DEFAULT,
+            },
+        },
+        defaultValue: {
+            control: 'file',
+            description: 'Default value for the input field',
+            table: {
+                type: { summary: 'File | null' },
+                category: StorybookControlCategory.DEFAULT,
+            },
+        },
+        allowedFileTypes: {
+            control: 'object',
+            description: 'Array of allowed MIME types for file uploads',
+            table: {
+                type: { summary: 'string[]' },
+                category: StorybookControlCategory.VALIDATION,
+            },
+        },
+        maxFileSize: {
+            control: 'number',
+            description: 'Maximum file size in bytes',
+            table: {
+                type: { summary: 'number' },
+                category: StorybookControlCategory.VALIDATION,
+            },
+        },
+        dragAndDropEnabled: {
+            control: 'boolean',
+            defaultValue: true,
+            description: 'Enable or disable drag-and-drop functionality',
+            table: {
+                defaultValue: { summary: 'true' },
+                type: { summary: 'boolean' },
+                category: StorybookControlCategory.DEFAULT,
+            },
+        },
+        status: {
+            control: 'select',
+            options: ['idle', 'uploading', 'success', 'error'],
+            description: 'Controls the visual state of the upload item, determining which UI is rendered.',
+            defaultValue: 'idle',
+            table: {
+                type: { summary: "'idle' | 'uploading' | 'success' | 'error'" },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+                defaultValue: { summary: 'idle' },
+            },
+        },
+        fileName: {
+            control: 'text',
+            description: 'The name of the file to display. Must be provided once the file is selected.',
+            table: {
+                type: { summary: 'string' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        fileSize: {
+            control: 'number',
+            description: 'The file size in bytes. The component formats it automatically (KB, MB).',
+            table: {
+                type: { summary: 'number' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        mimeType: {
+            control: 'text',
+            description: 'The MIME type of the file (e.g., "image/png"), used to display the correct icon.',
+            table: {
+                type: { summary: 'string' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        progress: {
+            control: { type: 'range', min: 0, max: 100, step: 1 },
+            if: { arg: 'status', eq: 'uploading' },
+            description: 'The upload progress (0-100). Only visible when status is "uploading".',
+            table: {
+                type: { summary: 'number' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        showPreview: {
+            control: 'boolean',
+            description: 'If true, displays the "Preview" button when the status is "success".',
+            defaultValue: false,
+            table: {
+                type: { summary: 'boolean' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+                defaultValue: { summary: 'false' },
+            },
+        },
+        errorsUpload: {
+            control: 'object',
+            description: 'List of error messages to display if status is "error".',
+            table: {
+                type: { summary: 'string[]' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        onCancel: {
+            action: 'cancel',
+            description: 'Callback function invoked when the cancel button (X) is pressed.',
+            table: {
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+                type: { summary: '(e: MouseEvent) => void' },
+            },
+        },
+        onReload: {
+            action: 'reload',
+            description: 'Callback function to retry the upload. Only visible if status is "error".',
+            table: {
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+                type: { summary: '(e: MouseEvent) => void' },
+            },
+        },
+        submitAsBase64: {
+            control: 'boolean',
+            description: 'If true, the file is encoded in base64.',
+            table: {
+                type: { summary: 'boolean' },
+                defaultValue: { summary: 'false' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        ...getValidationArgTypes({
+            enabledArgTypes: {
+                validators: false,
+                showErrorOnBlur: false,
+            },
+        }),
+    },
+};
+export default meta;
+export const Default = {
+    args: {
+        name: 'file-input',
+        label: 'Upload File',
+        description: 'Click to chose files',
+        allowedFileTypes: ['image/png', 'image/jpg', 'image/jpeg', 'application/pdf', 'text/plain', 'application/epub+zip'],
+        maxFileSize: 15728640,
+        fileName: 'example.png',
+        fileSize: 256000,
+        status: 'idle',
+    },
+};
+export const WithUploadedFile = {
+    args: {
+        ...Default.args,
+        fileName: 'example.png',
+        fileSize: 256000,
+        status: 'uploading',
+        mimeType: 'image/png',
+        progress: 90,
+    },
+};
+export const WithPreview = {
+    args: {
+        ...Default.args,
+        fileName: 'example.png',
+        fileSize: 256000,
+        status: 'success',
+        mimeType: 'image/png',
+        progress: 100,
+        showPreview: true,
+    },
+};
+//# sourceMappingURL=file-field.stories.js.map

package/dist/src/scalars/components/file-field/file-field.stories.js.map

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

package/dist/src/scalars/components/file-field/index.js

@@ -1,2 +1,3 @@
 export { FileField } from './file-field.js';
+export {} from './types.js';
 //# sourceMappingURL=index.js.map

package/dist/src/scalars/components/file-field/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/scalars/components/file-field/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/scalars/components/file-field/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAC3C,OAAO,EAAuB,MAAM,YAAY,CAAA"}

package/dist/src/scalars/components/form/form.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=form.test.d.ts.map

package/dist/src/scalars/components/form/form.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form.test.d.ts","sourceRoot":"","sources":["../../../../../src/scalars/components/form/form.test.tsx"],"names":[],"mappings":""}

package/dist/src/scalars/components/form/form.test.js

@@ -0,0 +1,129 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { userEvent } from '@testing-library/user-event';
+import { describe, expect, it, vi } from 'vitest';
+import { StringField } from '../string-field/index.js';
+import { Form } from './form.js';
+import { PasswordField } from '../password-field/index.js';
+import { EmailField } from '../email-field/index.js';
+describe('Form', () => {
+    it('should render children as React nodes', () => {
+        render(_jsx(Form, { onSubmit: () => undefined, children: _jsx("div", { "data-testid": "child", children: "Test Child" }) }));
+        expect(screen.getByTestId('child')).toBeInTheDocument();
+    });
+    it('should render children as function with form methods', () => {
+        render(_jsx(Form, { onSubmit: () => undefined, children: (methods) => _jsx("div", { "data-testid": "child", children: methods.formState.isSubmitting ? 'Submitting' : 'Not Submitting' }) }));
+        expect(screen.getByTestId('child')).toHaveTextContent('Not Submitting');
+    });
+    it('should call onSubmit with form data', async () => {
+        const handleSubmit = vi.fn();
+        render(_jsxs(Form, { onSubmit: handleSubmit, children: [_jsx(StringField, { name: "test", defaultValue: "test-value" }), _jsx("button", { type: "submit", children: "Submit" })] }));
+        fireEvent.click(screen.getByText('Submit'));
+        await waitFor(() => {
+            expect(handleSubmit).toHaveBeenCalledWith({
+                test: 'test-value',
+            });
+        });
+    });
+    it('should reset form after successful submit when resetOnSuccessfulSubmit is true', async () => {
+        const user = userEvent.setup();
+        const handleSubmit = vi.fn();
+        render(_jsxs(Form, { onSubmit: handleSubmit, resetOnSuccessfulSubmit: true, defaultValues: { test: 'hello' }, children: [_jsx(StringField, { name: "test" }), _jsx("button", { type: "submit", children: "Submit" })] }));
+        // type something in the input
+        const stringField = screen.getByRole('textbox');
+        await user.type(stringField, ' world');
+        expect(stringField).toHaveValue('hello world');
+        const input = screen.getByRole('textbox');
+        fireEvent.click(screen.getByText('Submit'));
+        await waitFor(() => {
+            expect(input).toHaveValue('hello');
+        });
+    });
+    it('should submit only changed values when submitChangesOnly is true', async () => {
+        const handleSubmit = vi.fn();
+        const user = userEvent.setup();
+        const defaultValues = { unchanged: 'default', changed: 'old' };
+        render(_jsxs(Form, { onSubmit: handleSubmit, defaultValues: defaultValues, submitChangesOnly: true, children: [_jsx(StringField, { name: "unchanged" }), _jsx(StringField, { name: "changed" }), _jsx("button", { type: "submit", children: "Submit" })] }));
+        const changedInput = screen.getByDisplayValue('old');
+        await user.clear(changedInput);
+        await user.type(changedInput, 'new');
+        fireEvent.click(screen.getByText('Submit'));
+        await waitFor(() => {
+            expect(handleSubmit).toHaveBeenCalledWith({
+                changed: 'new',
+            });
+        });
+    });
+    it('should submit null for empty values', async () => {
+        const handleSubmit = vi.fn();
+        render(_jsxs(Form, { onSubmit: handleSubmit, children: [_jsx(StringField, { name: "empty" }), _jsx("button", { type: "submit", children: "Submit" })] }));
+        fireEvent.click(screen.getByText('Submit'));
+        await waitFor(() => {
+            expect(handleSubmit).toHaveBeenCalledWith({
+                empty: null,
+            });
+        });
+    });
+    it('should apply className to form element', () => {
+        render(
+        // disable tailwind custom classname rule for this test
+        _jsx(Form, { onSubmit: () => undefined, className: "test-class", children: "Test" }));
+        expect(screen.getByText('Test')).toHaveClass('test-class');
+    });
+    describe('PasswordField with matchFieldName', () => {
+        it('should not submit field when it has matchFieldName set', async () => {
+            const handleSubmit = vi.fn();
+            render(_jsxs(Form, { onSubmit: handleSubmit, children: [_jsx(PasswordField, { name: "password", defaultValue: "@A1a" }), _jsx(PasswordField, { name: "confirmPassword", defaultValue: "@A1a", matchFieldName: "password" }), _jsx("button", { type: "submit", children: "Submit" })] }));
+            fireEvent.click(screen.getByText('Submit'));
+            await waitFor(() => {
+                expect(handleSubmit).toHaveBeenCalledWith({
+                    password: '@A1a',
+                });
+            });
+        });
+        it('should submit fields when matchFieldName is not set', async () => {
+            const handleSubmit = vi.fn();
+            render(_jsxs(Form, { onSubmit: handleSubmit, children: [_jsx(PasswordField, { name: "password", defaultValue: "@A1a" }), _jsx(PasswordField, { name: "confirmPassword", defaultValue: "@A1a" }), _jsx("button", { type: "submit", children: "Submit" })] }));
+            fireEvent.click(screen.getByText('Submit'));
+            await waitFor(() => {
+                expect(handleSubmit).toHaveBeenCalledWith({
+                    password: '@A1a',
+                    confirmPassword: '@A1a',
+                });
+            });
+        });
+    });
+    describe('EmailField with matchFieldName', () => {
+        it('should submit field when it has matchFieldName set', async () => {
+            const handleSubmit = vi.fn();
+            render(_jsxs(Form, { onSubmit: handleSubmit, children: [_jsx(EmailField, { name: "email", defaultValue: "test@example.com" }), _jsx(EmailField, { name: "confirmEmail", defaultValue: "test@example.com", matchFieldName: "email" }), _jsx("button", { type: "submit", children: "Submit" })] }));
+            fireEvent.click(screen.getByText('Submit'));
+            await waitFor(() => {
+                expect(handleSubmit).toHaveBeenCalledWith({
+                    email: 'test@example.com',
+                });
+            });
+        });
+        it('should submit fields when matchFieldName is not set', async () => {
+            const handleSubmit = vi.fn();
+            render(_jsxs(Form, { onSubmit: handleSubmit, children: [_jsx(EmailField, { name: "email", defaultValue: "test@example.com" }), _jsx(EmailField, { name: "confirmEmail", defaultValue: "test@example.com" }), _jsx("button", { type: "submit", children: "Submit" })] }));
+            fireEvent.click(screen.getByText('Submit'));
+            await waitFor(() => {
+                expect(handleSubmit).toHaveBeenCalledWith({
+                    email: 'test@example.com',
+                    confirmEmail: 'test@example.com',
+                });
+            });
+        });
+        it('should show validation error when matchFieldName values do not match', async () => {
+            const user = userEvent.setup();
+            const handleSubmit = vi.fn();
+            render(_jsxs(Form, { onSubmit: handleSubmit, children: [_jsx(EmailField, { name: "email", label: "Email", value: "test@example.com" }), _jsx(EmailField, { name: "confirmEmail", label: "Confirm Email", matchFieldName: "email", showErrorOnBlur: true }), _jsx("button", { type: "submit", children: "Submit" })] }));
+            const confirmInput = screen.getByLabelText('Confirm Email');
+            await user.type(confirmInput, 'different@example.com');
+            await user.tab();
+            expect(screen.getByText('Email must match the "Email" field')).toBeInTheDocument();
+        });
+    });
+});
+//# sourceMappingURL=form.test.js.map

package/dist/src/scalars/components/form/form.test.js.map

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

package/dist/src/scalars/components/fragments/button/button.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=button.test.d.ts.map

package/dist/src/scalars/components/fragments/button/button.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.test.d.ts","sourceRoot":"","sources":["../../../../../../src/scalars/components/fragments/button/button.test.tsx"],"names":[],"mappings":""}

package/dist/src/scalars/components/fragments/button/button.test.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from 'vitest';
+import { render } from '@testing-library/react';
+import { Button } from './button.js';
+describe('Button Component', () => {
+    it('should match snapshot', () => {
+        const { asFragment } = render(_jsx(Button, {}));
+        expect(asFragment()).toMatchSnapshot();
+    });
+});
+//# sourceMappingURL=button.test.js.map

package/dist/src/scalars/components/fragments/button/button.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.test.js","sourceRoot":"","sources":["../../../../../../src/scalars/components/fragments/button/button.test.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAA;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAEpC,QAAQ,CAAC,kBAAkB,EAAE,GAAG,EAAE;IAChC,EAAE,CAAC,uBAAuB,EAAE,GAAG,EAAE;QAC/B,MAAM,EAAE,UAAU,EAAE,GAAG,MAAM,CAAC,KAAC,MAAM,KAAG,CAAC,CAAA;QACzC,MAAM,CAAC,UAAU,EAAE,CAAC,CAAC,eAAe,EAAE,CAAA;IACxC,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}

package/dist/src/scalars/components/fragments/character-counter/character-counter.stories.d.ts

@@ -0,0 +1,30 @@
+import type { StoryObj } from '@storybook/react';
+import { CharacterCounter } from './character-counter.js';
+declare const meta: {
+    title: string;
+    component: import("react").FC<import("./character-counter.js").CharacterCounterProps>;
+    parameters: {
+        layout: string;
+        chromatic: {
+            disableSnapshot: boolean;
+        };
+    };
+    tags: string[];
+    argTypes: {
+        maxLength: {
+            control: "number";
+            description: string;
+        };
+        value: {
+            control: "text";
+            description: string;
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof CharacterCounter>;
+export declare const Default: Story;
+export declare const AtLimit: Story;
+export declare const ExceedingLimit: Story;
+export declare const LargeLimit: Story;
+//# sourceMappingURL=character-counter.stories.d.ts.map

package/dist/src/scalars/components/fragments/character-counter/character-counter.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"character-counter.stories.d.ts","sourceRoot":"","sources":["../../../../../../src/scalars/components/fragments/character-counter/character-counter.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAA;AAEzD,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;CAoB+B,CAAA;AAEzC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,gBAAgB,CAAC,CAAA;AAE9C,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAA;AAED,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAK5B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAKxB,CAAA"}

package/dist/src/scalars/components/fragments/character-counter/character-counter.stories.js

@@ -0,0 +1,48 @@
+import { CharacterCounter } from './character-counter.js';
+const meta = {
+    title: 'Fragments/CharacterCounter',
+    component: CharacterCounter,
+    parameters: {
+        layout: 'centered',
+        chromatic: {
+            disableSnapshot: true,
+        },
+    },
+    tags: ['autodocs'],
+    argTypes: {
+        maxLength: {
+            control: 'number',
+            description: 'Maximum number of characters allowed',
+        },
+        value: {
+            control: 'text',
+            description: 'Current text value to count characters from',
+        },
+    },
+};
+export default meta;
+export const Default = {
+    args: {
+        maxLength: 10,
+        value: '',
+    },
+};
+export const AtLimit = {
+    args: {
+        maxLength: 10,
+        value: 'HelloWorld',
+    },
+};
+export const ExceedingLimit = {
+    args: {
+        maxLength: 10,
+        value: 'Hello World!',
+    },
+};
+export const LargeLimit = {
+    args: {
+        maxLength: 100,
+        value: 'This is a longer text that demonstrates the counter with a larger character limit',
+    },
+};
+//# sourceMappingURL=character-counter.stories.js.map

package/dist/src/scalars/components/fragments/character-counter/character-counter.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"character-counter.stories.js","sourceRoot":"","sources":["../../../../../../src/scalars/components/fragments/character-counter/character-counter.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAA;AAEzD,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,4BAA4B;IACnC,SAAS,EAAE,gBAAgB;IAC3B,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,SAAS,EAAE;YACT,eAAe,EAAE,IAAI;SACtB;KACF;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,SAAS,EAAE;YACT,OAAO,EAAE,QAAQ;YACjB,WAAW,EAAE,sCAAsC;SACpD;QACD,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,6CAA6C;SAC3D;KACF;CACsC,CAAA;AAEzC,eAAe,IAAI,CAAA;AAGnB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,SAAS,EAAE,EAAE;QACb,KAAK,EAAE,EAAE;KACV;CACF,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,SAAS,EAAE,EAAE;QACb,KAAK,EAAE,YAAY;KACpB;CACF,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAU;IACnC,IAAI,EAAE;QACJ,SAAS,EAAE,EAAE;QACb,KAAK,EAAE,cAAc;KACtB;CACF,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAU;IAC/B,IAAI,EAAE;QACJ,SAAS,EAAE,GAAG;QACd,KAAK,EAAE,mFAAmF;KAC3F;CACF,CAAA"}

package/dist/src/scalars/components/fragments/character-counter/character-counter.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=character-counter.test.d.ts.map

package/dist/src/scalars/components/fragments/character-counter/character-counter.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"character-counter.test.d.ts","sourceRoot":"","sources":["../../../../../../src/scalars/components/fragments/character-counter/character-counter.test.tsx"],"names":[],"mappings":""}

package/dist/src/scalars/components/fragments/character-counter/character-counter.test.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from 'vitest';
+import { render, screen } from '@testing-library/react';
+import { CharacterCounter } from './character-counter.js';
+describe('CharacterCounter', () => {
+    it('should match snapshot', () => {
+        const { container } = render(_jsx(CharacterCounter, { maxLength: 10, value: "Hello" }));
+        expect(container).toMatchSnapshot();
+    });
+    it('should display correct character count and max length', () => {
+        render(_jsx(CharacterCounter, { maxLength: 10, value: "Hello" }));
+        expect(screen.getByText('5')).toBeInTheDocument();
+        expect(screen.getByText('/10')).toBeInTheDocument();
+    });
+    it('should show normal state when under 90% of max length', () => {
+        render(_jsx(CharacterCounter, { maxLength: 10, value: "Hello" }));
+        expect(screen.getByText('5')).toHaveClass('text-gray-500');
+        expect(screen.getByText('/10')).toHaveClass('text-gray-300');
+    });
+    it('should show warning state when between 90% and 100% of max length', () => {
+        render(_jsx(CharacterCounter, { maxLength: 10, value: "Hello Wor" }));
+        expect(screen.getByText('9')).toHaveClass('text-yellow-900');
+        expect(screen.getByText('/10')).toHaveClass('text-yellow-400');
+    });
+    it('should show error state when at or exceeding max length', () => {
+        render(_jsx(CharacterCounter, { maxLength: 10, value: "Hello World" }));
+        expect(screen.getByText('11')).toHaveClass('text-red-900');
+        expect(screen.getByText('/10')).toHaveClass('text-red-400');
+    });
+    it('should handle empty string value', () => {
+        render(_jsx(CharacterCounter, { maxLength: 10, value: "" }));
+        expect(screen.getByText('0')).toBeInTheDocument();
+        expect(screen.getByText('0')).toHaveClass('text-gray-500');
+    });
+});
+//# sourceMappingURL=character-counter.test.js.map

package/dist/src/scalars/components/fragments/character-counter/character-counter.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"character-counter.test.js","sourceRoot":"","sources":["../../../../../../src/scalars/components/fragments/character-counter/character-counter.test.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAA;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AACvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAA;AAEzD,QAAQ,CAAC,kBAAkB,EAAE,GAAG,EAAE;IAChC,EAAE,CAAC,uBAAuB,EAAE,GAAG,EAAE;QAC/B,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,KAAC,gBAAgB,IAAC,SAAS,EAAE,EAAE,EAAE,KAAK,EAAC,OAAO,GAAG,CAAC,CAAA;QAC/E,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAA;IACrC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,uDAAuD,EAAE,GAAG,EAAE;QAC/D,MAAM,CAAC,KAAC,gBAAgB,IAAC,SAAS,EAAE,EAAE,EAAE,KAAK,EAAC,OAAO,GAAG,CAAC,CAAA;QACzD,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAA;QACjD,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAA;IACrD,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,uDAAuD,EAAE,GAAG,EAAE;QAC/D,MAAM,CAAC,KAAC,gBAAgB,IAAC,SAAS,EAAE,EAAE,EAAE,KAAK,EAAC,OAAO,GAAG,CAAC,CAAA;QACzD,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;QAC1D,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;IAC9D,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,mEAAmE,EAAE,GAAG,EAAE;QAC3E,MAAM,CAAC,KAAC,gBAAgB,IAAC,SAAS,EAAE,EAAE,EAAE,KAAK,EAAC,WAAW,GAAG,CAAC,CAAA;QAC7D,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAA;QAC5D,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAA;IAChE,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,yDAAyD,EAAE,GAAG,EAAE;QACjE,MAAM,CAAC,KAAC,gBAAgB,IAAC,SAAS,EAAE,EAAE,EAAE,KAAK,EAAC,aAAa,GAAG,CAAC,CAAA;QAC/D,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,cAAc,CAAC,CAAA;QAC1D,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC,cAAc,CAAC,CAAA;IAC7D,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,kCAAkC,EAAE,GAAG,EAAE;QAC1C,MAAM,CAAC,KAAC,gBAAgB,IAAC,SAAS,EAAE,EAAE,EAAE,KAAK,EAAC,EAAE,GAAG,CAAC,CAAA;QACpD,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAA;QACjD,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;IAC5D,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}

package/dist/src/scalars/components/fragments/checkbox-field/checkbox-field.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=checkbox-field.test.d.ts.map

package/dist/src/scalars/components/fragments/checkbox-field/checkbox-field.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox-field.test.d.ts","sourceRoot":"","sources":["../../../../../../src/scalars/components/fragments/checkbox-field/checkbox-field.test.tsx"],"names":[],"mappings":""}

package/dist/src/scalars/components/fragments/checkbox-field/checkbox-field.test.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { fireEvent, screen, waitFor } from '@testing-library/react';
+import { describe, expect, it, vi } from 'vitest';
+import { renderWithForm } from '../../../lib/testing.js';
+import { CheckboxField } from './checkbox-field.js';
+describe('CheckboxField Component', () => {
+    it('should match snapshot', () => {
+        const { container } = renderWithForm(_jsx(CheckboxField, { name: "test", label: "Test Label" }));
+        expect(container).toMatchSnapshot();
+    });
+    it('should render with label', () => {
+        renderWithForm(_jsx(CheckboxField, { name: "test", label: "Test checkbox" }));
+        expect(screen.getByText('Test checkbox')).toBeInTheDocument();
+    });
+    it('should render with description icon', () => {
+        renderWithForm(_jsx(CheckboxField, { name: "test", label: "Test checkbox", description: "This is a description" }));
+        expect(screen.getByTestId('icon-fallback')).toBeInTheDocument();
+    });
+    it('should handle checked state', () => {
+        const handleChange = vi.fn();
+        renderWithForm(_jsx(CheckboxField, { name: "test", label: "Test checkbox", value: false, onChange: handleChange }));
+        const checkbox = screen.getByRole('checkbox');
+        fireEvent.click(checkbox);
+        expect(handleChange).toHaveBeenCalledWith(true);
+        expect(checkbox).toHaveAttribute('data-state', 'checked');
+    });
+    it('should be disabled when disabled prop is true', () => {
+        renderWithForm(_jsx(CheckboxField, { name: "test", label: "Test checkbox", disabled: true }));
+        const checkbox = screen.getByRole('checkbox');
+        expect(checkbox).toBeDisabled();
+    });
+    it('should show required indicator when required', () => {
+        renderWithForm(_jsx(CheckboxField, { name: "test", label: "Test checkbox", required: true }));
+        const checkbox = screen.getByRole('checkbox');
+        expect(checkbox).toBeRequired();
+        expect(checkbox).toHaveAttribute('aria-required', 'true');
+        expect(screen.getByText('*')).toBeInTheDocument();
+    });
+    it('should render with errors', async () => {
+        renderWithForm(_jsx(CheckboxField, { name: "test", label: "Test checkbox", errors: ['This is an error'] }));
+        await waitFor(() => {
+            expect(screen.getByText('This is an error')).toBeInTheDocument();
+        });
+    });
+    it('should render with warnings and errors', async () => {
+        renderWithForm(_jsx(CheckboxField, { name: "test", label: "Test checkbox", warnings: ['This is a warning'], errors: ['This is an error'] }));
+        expect(screen.getByText('This is a warning')).toBeInTheDocument();
+        await waitFor(() => {
+            expect(screen.getByText('This is an error')).toBeInTheDocument();
+        });
+    });
+});
+//# sourceMappingURL=checkbox-field.test.js.map

package/dist/src/scalars/components/fragments/checkbox-field/checkbox-field.test.js.map

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

package/dist/src/scalars/components/fragments/command/command.d.ts

@@ -20,7 +20,7 @@ declare const CommandInput: React.ForwardRefExoticComponent<Omit<Omit<Pick<Pick<
     ref?: React.Ref<HTMLInputElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "value" | "type" | "onChange"> & {
+}, "key" | "asChild" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "type" | "onChange" | "value"> & {
     value?: string;
     onValueChange?: (search: string) => void;
 } & React.RefAttributes<HTMLInputElement>, "ref"> & {
@@ -58,7 +58,7 @@ declare const CommandGroup: React.ForwardRefExoticComponent<Omit<{
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>>, "value" | "heading"> & {
+}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>>, "heading" | "value"> & {
     heading?: React.ReactNode;
     value?: string;
     forceMount?: boolean;
@@ -69,7 +69,7 @@ declare const CommandItem: React.ForwardRefExoticComponent<Omit<{
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>>, "value" | "onSelect" | "disabled"> & {
+}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>>, "onSelect" | "disabled" | "value"> & {
     disabled?: boolean;
     onSelect?: (value: string) => void;
     value?: string;