@akinon/akiform-builder 0.8.0 → 1.0.1

package/dist/cjs/__tests__/field-builder.test.d.ts

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

package/dist/cjs/__tests__/field-builder.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-builder.test.d.ts","sourceRoot":"","sources":["../../../__tests__/field-builder.test.ts"],"names":[],"mappings":""}

package/dist/cjs/__tests__/field-builder.test.js

@@ -0,0 +1,296 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const akival_1 = require("@akinon/akival");
+const field_builder_1 = require("../src/field-builder");
+describe('FieldBuilder', () => {
+    it('should build a text field with all properties', () => {
+        const textField = (0, field_builder_1.field)()
+            .key('name')
+            .label('Name')
+            .type('text')
+            .placeholder('Enter your name')
+            .defaultValue('John Doe')
+            .validation(akival_1.akival.string().required())
+            .config({ disabled: false, visible: true })
+            .build();
+        expect(textField).toEqual({
+            key: 'name',
+            label: 'Name',
+            type: 'text',
+            placeholder: 'Enter your name',
+            defaultValue: 'John Doe',
+            validation: expect.any(Object),
+            config: { disabled: false, visible: true }
+        });
+    });
+    it('should build a number field', () => {
+        const numberField = (0, field_builder_1.field)()
+            .key('age')
+            .label('Age')
+            .type('number')
+            .placeholder('Enter your age')
+            .defaultValue(18)
+            .validation(akival_1.akival.number().min(18))
+            .build();
+        expect(numberField).toEqual({
+            key: 'age',
+            label: 'Age',
+            type: 'number',
+            placeholder: 'Enter your age',
+            defaultValue: 18,
+            validation: expect.any(Object)
+        });
+    });
+    it('should build a select field', () => {
+        const selectField = (0, field_builder_1.field)()
+            .key('country')
+            .label('Country')
+            .type('select')
+            .options([
+            { value: 'us', label: 'United States' },
+            { value: 'ca', label: 'Canada' }
+        ])
+            .defaultValue('us')
+            .build();
+        expect(selectField).toEqual({
+            key: 'country',
+            label: 'Country',
+            type: 'select',
+            options: [
+                { value: 'us', label: 'United States' },
+                { value: 'ca', label: 'Canada' }
+            ],
+            defaultValue: 'us'
+        });
+    });
+    it('should build a checkbox field', () => {
+        const checkboxField = (0, field_builder_1.field)()
+            .key('subscribe')
+            .label('Subscribe to newsletter')
+            .type('checkbox')
+            .defaultValue(false)
+            .build();
+        expect(checkboxField).toEqual({
+            key: 'subscribe',
+            label: 'Subscribe to newsletter',
+            type: 'checkbox',
+            defaultValue: false
+        });
+    });
+    it('should build a date field', () => {
+        const dateField = (0, field_builder_1.field)()
+            .key('birthdate')
+            .label('Birth Date')
+            .type('date')
+            .placeholder('Select your birth date')
+            .build();
+        expect(dateField).toEqual({
+            key: 'birthdate',
+            label: 'Birth Date',
+            type: 'date',
+            placeholder: 'Select your birth date'
+        });
+    });
+    it('should build a textarea field', () => {
+        const textareaField = (0, field_builder_1.field)()
+            .key('description')
+            .label('Description')
+            .type('textarea')
+            .placeholder('Enter a description')
+            .build();
+        expect(textareaField).toEqual({
+            key: 'description',
+            label: 'Description',
+            type: 'textarea',
+            placeholder: 'Enter a description'
+        });
+    });
+    it('should build a custom field', () => {
+        const renderFn = vi.fn();
+        const customField = (0, field_builder_1.field)()
+            .key('custom')
+            .label('Custom Field')
+            .type('custom')
+            .render(renderFn)
+            .build();
+        expect(customField).toEqual({
+            key: 'custom',
+            label: 'Custom Field',
+            type: 'custom',
+            render: renderFn
+        });
+    });
+    it('should build row and col fields', () => {
+        const customField = (0, field_builder_1.field)()
+            .type('row')
+            .key('mainrow')
+            .rowProps({
+            align: 'middle'
+        })
+            .columnFields([
+            (0, field_builder_1.field)()
+                .type('column')
+                .key('col1')
+                .columnProps({
+                span: 24
+            })
+                .fields([
+                (0, field_builder_1.field)().type('text').key('test1').label('Text label').build()
+            ])
+                .build()
+        ])
+            .build();
+        expect(customField).toEqual({
+            type: 'row',
+            key: 'mainrow',
+            rowProps: {
+                align: 'middle'
+            },
+            columnFields: [
+                {
+                    type: 'column',
+                    key: 'col1',
+                    columnProps: {
+                        span: 24
+                    },
+                    fields: [
+                        {
+                            type: 'text',
+                            key: 'test1',
+                            label: 'Text label'
+                        }
+                    ]
+                }
+            ]
+        });
+    });
+    it('should throw an error if required properties are missing', () => {
+        expect(() => (0, field_builder_1.field)().build()).toThrow('Field must have at least a key and type');
+        expect(() => (0, field_builder_1.field)().key('test').build()).toThrow('Field must have at least a key and type');
+        expect(() => (0, field_builder_1.field)().type('text').build()).toThrow('Field must have at least a key and type');
+    });
+    it('should only allow options for select fields', () => {
+        const selectField = (0, field_builder_1.field)()
+            .key('country')
+            .label('Country')
+            .type('select')
+            .options([
+            { value: 'us', label: 'United States' },
+            { value: 'ca', label: 'Canada' }
+        ])
+            .build();
+        expect(selectField).toEqual({
+            key: 'country',
+            label: 'Country',
+            type: 'select',
+            options: [
+                { value: 'us', label: 'United States' },
+                { value: 'ca', label: 'Canada' }
+            ]
+        });
+        // @ts-expect-error : We are explicitly waiting .options to throw an error.
+        (0, field_builder_1.field)().key('name').label('Name').type('text').options([]);
+    });
+    it('should only allow render for custom fields', () => {
+        const renderFn = vi.fn();
+        const customField = (0, field_builder_1.field)()
+            .key('custom')
+            .label('Custom Field')
+            .type('custom')
+            .render(renderFn)
+            .build();
+        expect(customField).toEqual({
+            key: 'custom',
+            label: 'Custom Field',
+            type: 'custom',
+            render: renderFn
+        });
+        // @ts-expect-error : We are explicitly waiting .render to throw an error.
+        (0, field_builder_1.field)().key('name').label('Name').type('text').render(vi.fn());
+    });
+    it('should allow chaining methods in any order', () => {
+        const textField = (0, field_builder_1.field)()
+            .type('text')
+            .key('name')
+            .label('Name')
+            .placeholder('Enter your name')
+            .build();
+        expect(textField).toEqual({
+            key: 'name',
+            label: 'Name',
+            type: 'text',
+            placeholder: 'Enter your name'
+        });
+    });
+    it('should allow building fields with minimal properties', () => {
+        const minimalField = (0, field_builder_1.field)()
+            .key('minimal')
+            .label('Minimal')
+            .type('text')
+            .build();
+        expect(minimalField).toEqual({
+            key: 'minimal',
+            label: 'Minimal',
+            type: 'text'
+        });
+    });
+    it('should build a field array with fields', () => {
+        const fieldArray = (0, field_builder_1.field)()
+            .key('addresses')
+            .label('Addresses')
+            .type('fieldArray')
+            .fields([
+            (0, field_builder_1.field)().key('street').label('Street').type('text').build(),
+            (0, field_builder_1.field)().key('city').label('City').type('text').build()
+        ])
+            .build();
+        expect(fieldArray).toEqual({
+            key: 'addresses',
+            label: 'Addresses',
+            type: 'fieldArray',
+            fields: [
+                { key: 'street', label: 'Street', type: 'text' },
+                { key: 'city', label: 'City', type: 'text' }
+            ]
+        });
+    });
+    it('should build a section field with fields', () => {
+        const sectionField = (0, field_builder_1.field)()
+            .key('personalInfo')
+            .label('Personal Information')
+            .type('section')
+            .fields([
+            (0, field_builder_1.field)().key('name').label('Name').type('text').build(),
+            (0, field_builder_1.field)().key('age').label('Age').type('number').build()
+        ])
+            .defaultExpanded(true)
+            .build();
+        expect(sectionField).toEqual({
+            key: 'personalInfo',
+            label: 'Personal Information',
+            type: 'section',
+            fields: [
+                { key: 'name', label: 'Name', type: 'text' },
+                { key: 'age', label: 'Age', type: 'number' }
+            ],
+            defaultExpanded: true
+        });
+    });
+    it('should not set fields for non-fieldArray and non-section types', () => {
+        const consoleSpy = vi.spyOn(console, 'warn').mockImplementation(() => { });
+        const textField = (0, field_builder_1.field)()
+            .key('name')
+            .label('Name')
+            .type('text')
+            // @ts-expect-error : We are explicitly waiting .fields to throw an error.
+            .fields([(0, field_builder_1.field)().key('invalid').label('Invalid').type('text').build()])
+            .build();
+        expect(textField).toEqual({
+            key: 'name',
+            label: 'Name',
+            type: 'text'
+        });
+        expect(consoleSpy).toHaveBeenCalledWith("Fields can only be set for 'fieldArray' or 'section' types. Current type: text");
+        consoleSpy.mockRestore();
+    });
+});

package/dist/cjs/index.css

@@ -0,0 +1,17 @@
+.akiform-builder .sr-only {
+  display: none;
+}
+
+.akiform-builder-field-array {
+  padding-bottom: 1rem;
+}
+
+.akiform-builder-form-actions {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.akiform-builder-action-icon {
+  cursor: pointer;
+}

package/dist/cjs/src/akiform-builder.d.ts

@@ -0,0 +1,7 @@
+import './index.css';
+import { FieldValues } from '@akinon/akiform';
+import React from 'react';
+import { AkiformBuilderProps, AkiformBuilderRef } from './types';
+export declare const THROTTLE_DELAY = 300;
+export declare const AkiformBuilder: React.ForwardRefExoticComponent<AkiformBuilderProps<FieldValues> & React.RefAttributes<AkiformBuilderRef<FieldValues>>>;
+//# sourceMappingURL=akiform-builder.d.ts.map

package/dist/cjs/src/akiform-builder.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"akiform-builder.d.ts","sourceRoot":"","sources":["../../../src/akiform-builder.tsx"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAC;AAErB,OAAO,EAML,WAAW,EAMZ,MAAM,iBAAiB,CAAC;AAczB,OAAO,KAWN,MAAM,OAAO,CAAC;AAGf,OAAO,EACL,mBAAmB,EACnB,iBAAiB,EAQlB,MAAM,SAAS,CAAC;AAEjB,eAAO,MAAM,cAAc,MAAM,CAAC;AA6WlC,eAAO,MAAM,cAAc,yHA+V1B,CAAC"}