@powerhousedao/document-engineering 1.37.0 → 1.39.0

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

@@ -0,0 +1,339 @@
+import { withForm } from '../../lib/decorators.js';
+import { getDefaultArgTypes, getValidationArgTypes, PrebuiltArgTypes, StorybookControlCategory, } from '../../lib/storybook-arg-types.js';
+import { AmountField } from './amount-field.js';
+import { commonFiatCurrencies } from '@powerhousedao/document-engineering/ui/components/data-entry/currency-code-picker/defaults.js';
+const mappedFiatCurrencies = commonFiatCurrencies.map((currency) => ({
+    ...currency,
+    label: currency.ticker,
+}));
+const meta = {
+    title: 'Scalars/Amount Field',
+    component: AmountField,
+    decorators: [withForm],
+    parameters: {
+        layout: 'centered',
+        form: {
+            defaultValues: {
+                'amount-field': {
+                    value: undefined,
+                    unit: '',
+                },
+            },
+        },
+    },
+    tags: ['autodocs'],
+    argTypes: {
+        units: {
+            control: 'object',
+            description: 'Array of Currency objects',
+            table: {
+                type: { summary: 'Currency[]' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+            if: {
+                arg: 'type',
+                neq: 'AmountPercentage',
+            },
+        },
+        includeCurrencySymbols: {
+            control: 'boolean',
+            description: ' Whether to display currency symbols alongside codes',
+            table: {
+                defaultValue: { summary: 'true' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+            if: {
+                arg: 'type',
+                neq: 'AmountPercentage',
+            },
+        },
+        symbolPosition: {
+            control: 'select',
+            description: 'Position of the currency symbol',
+            options: ['left', 'right'],
+            table: {
+                type: { summary: 'string' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+            if: {
+                arg: 'type',
+                neq: 'AmountPercentage',
+            },
+        },
+        step: {
+            control: 'number',
+            description: 'The step value for the amount field',
+            table: {
+                defaultValue: { summary: '1' },
+                type: { summary: 'number' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        currencyPosition: {
+            control: 'select',
+            options: ['left', 'right'],
+            description: 'Determines the position of the currency select dropdown relative to the amount input field.',
+            table: {
+                defaultValue: { summary: 'right' },
+                type: { summary: 'string' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+            if: {
+                arg: 'type',
+                neq: 'AmountPercentage',
+            },
+        },
+        trailingZeros: {
+            control: 'boolean',
+            description: 'When precision is set, for example to 2, determines if the the trailing zeros should be preserved ( for example: 25.00,7.50, etc.) or not ( for example: 25, 7.5).',
+            if: {
+                arg: 'type',
+                neq: 'AmountToken',
+            },
+            table: {
+                type: { summary: 'boolean' },
+                category: StorybookControlCategory.VALIDATION,
+            },
+        },
+        viewPrecision: {
+            control: 'number',
+            description: 'Number of decimal places viewed',
+            table: {
+                type: { summary: 'number' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        precision: {
+            control: 'number',
+            description: 'Number of decimal places viewed',
+            table: {
+                type: { summary: 'number' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        allowNegative: {
+            control: 'boolean',
+            description: 'Whether negative values are allowed (true or false).',
+            table: {
+                defaultValue: { summary: 'false' },
+                type: { summary: 'boolean' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        numberProps: {
+            control: 'object',
+            description: 'All the props options for number field',
+            table: {
+                type: { summary: 'object' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        selectProps: {
+            control: 'object',
+            description: 'All the props options for select field',
+            table: {
+                type: { summary: 'object' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        // TODO:Improve the AmountType descriptions for the value
+        ...getDefaultArgTypes(),
+        value: {
+            control: 'object',
+            description: "The value of the amount field. Can be a number, an object with currency, or undefined. Examples: { amount: 100, currency: 'USD' }, 200, undefined.",
+            table: {
+                type: { summary: 'object | number | undefined' },
+                category: StorybookControlCategory.DEFAULT,
+            },
+        },
+        ...PrebuiltArgTypes.placeholder,
+        ...getValidationArgTypes(),
+        ...PrebuiltArgTypes.minValue,
+        ...PrebuiltArgTypes.maxValue,
+        type: {
+            control: 'select',
+            options: ['Amount', 'AmountFiat', 'AmountPercentage', 'AmountCrypto', 'AmountCurrency'],
+            description: 'The type of amount field.',
+            table: {
+                type: { summary: 'string' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        enableStepCarets: {
+            control: 'boolean',
+            description: 'Enable step carets',
+            table: {
+                type: { summary: 'boolean' },
+                defaultValue: { summary: 'false' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        ...PrebuiltArgTypes.viewMode,
+        baseValue: {
+            control: 'object',
+            description: 'The base value of the amount field.',
+            table: {
+                type: { summary: 'Amount | AmountFiat | AmountPercentage | AmountCrypto | AmountCurrency' },
+                category: StorybookControlCategory.DIFF,
+            },
+        },
+    },
+    args: {
+        name: 'amount-field',
+    },
+};
+export default meta;
+export const Default = {
+    args: {
+        placeholder: '0',
+        units: [...mappedFiatCurrencies],
+        label: 'Enter Amount and Select Currency',
+        placeholderSelect: 'CUR',
+        type: 'Amount',
+        value: {
+            value: undefined,
+            unit: '',
+        },
+    },
+};
+export const WithValue = {
+    args: {
+        placeholder: 'Enter Amount',
+        placeholderSelect: 'CUR',
+        label: 'Enter Amount',
+        type: 'Amount',
+        value: {
+            value: 100,
+        },
+    },
+};
+export const WithAmountFiat = {
+    parameters: {
+        form: {
+            defaultValues: {
+                'amount-field': '',
+            },
+        },
+    },
+    args: {
+        placeholder: 'Enter Amount',
+        placeholderSelect: 'CUR',
+        label: 'Enter Amout ',
+        type: 'AmountFiat',
+        value: {
+            value: 345,
+            unit: 'EUR',
+        },
+    },
+};
+export const WithAmountCurrency = {
+    args: {
+        placeholder: 'Enter Amount',
+        label: 'Enter Amount and Select Currency',
+        type: 'AmountCurrency',
+        placeholderSelect: 'CUR',
+        value: {
+            value: '3454564564',
+            unit: 'DAI',
+        },
+    },
+};
+export const WithAmountCrypto = {
+    parameters: {
+        form: {
+            defaultValues: {
+                'amount-field': {
+                    value: '',
+                    unit: '',
+                },
+            },
+        },
+    },
+    args: {
+        placeholder: 'Enter Amount',
+        label: 'Enter Amount and Select Currency',
+        type: 'AmountCrypto',
+        placeholderSelect: 'CUR',
+        value: {
+            value: '123',
+            unit: 'ETH',
+        },
+    },
+};
+export const WithValuePercent = {
+    parameters: {
+        form: {
+            defaultValues: {
+                'amount-field': '',
+            },
+        },
+    },
+    args: {
+        label: 'Enter Percentage ',
+        placeholder: 'Enter Amount',
+        type: 'AmountPercentage',
+        value: 9,
+    },
+};
+export const Disable = {
+    args: {
+        label: 'Enter Amount ',
+        placeholder: 'Enter Amount',
+        type: 'AmountFiat',
+        placeholderSelect: 'CUR',
+        disabled: true,
+        value: {
+            value: 9,
+            unit: 'USD',
+        },
+    },
+};
+export const WithDifferencesAddition = {
+    args: {
+        type: 'AmountFiat',
+        label: 'Icon names addition',
+        placeholderSelect: 'CUR',
+        value: {
+            value: 22233,
+            unit: 'USD',
+        },
+        baseValue: {
+            value: 42323,
+            unit: 'THB',
+        },
+        viewMode: 'addition',
+    },
+};
+export const WithDifferencesRemoval = {
+    args: {
+        label: 'Icon names removal',
+        placeholderSelect: 'CUR',
+        value: {
+            value: '12323',
+            unit: 'ETH',
+        },
+        baseValue: {
+            value: 413130,
+            unit: 'BTC',
+        },
+        type: 'AmountCurrency',
+        viewMode: 'removal',
+    },
+};
+export const WithDifferencesMixed = {
+    args: {
+        label: 'Icon names mixed',
+        placeholderSelect: 'CUR',
+        value: {
+            value: '909123223',
+            unit: 'BTC',
+        },
+        baseValue: {
+            value: '49989822',
+            unit: 'ETH',
+        },
+        type: 'AmountCurrency',
+        viewMode: 'mixed',
+    },
+};
+//# sourceMappingURL=amount-field.stories.js.map

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

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

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

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

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

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

package/dist/src/scalars/components/amount-field/amount-field.test.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { commonCryptoCurrencies } from '../../../ui/components/data-entry/currency-code-picker/defaults.js';
+import { screen, waitFor } from '@testing-library/react';
+import { renderWithForm } from '../../lib/testing.js';
+import { AmountField } from './amount-field.js';
+describe('AmountField Component', () => {
+    it('should match snapshot', () => {
+        const { container } = renderWithForm(_jsx(AmountField, { label: "Amount Label", name: "amount", type: "Amount", value: {
+                value: 345,
+            }, units: commonCryptoCurrencies }));
+        expect(container).toMatchSnapshot();
+    });
+    it('should render label when provided', () => {
+        renderWithForm(_jsx(AmountField, { label: "Amount Label", name: "amount", type: "Amount", value: {
+                value: 345,
+            }, units: commonCryptoCurrencies }));
+        expect(screen.getByLabelText('Amount Label')).toBeInTheDocument();
+    });
+    it('should render error messages when provided', async () => {
+        renderWithForm(_jsx(AmountField, { label: "Amount Label", name: "amount", type: "Amount", value: {
+                value: 345,
+            }, errors: ['Error 1', 'Error 2'], validators: () => 'Error 3', units: commonCryptoCurrencies }));
+        await waitFor(() => {
+            expect(screen.getByText('Error 1')).toBeInTheDocument();
+            expect(screen.getByText('Error 2')).toBeInTheDocument();
+            expect(screen.getByText('Error 3')).toBeInTheDocument();
+        });
+    });
+    it('should render the percentage sign if the type is percent', () => {
+        renderWithForm(_jsx(AmountField, { label: "Amount Label", name: "amount", type: "AmountPercentage", value: 345, step: 0 }));
+        expect(screen.getByText('%')).toBeInTheDocument();
+    });
+    it('should disable the input when disabled prop is true', () => {
+        renderWithForm(_jsx(AmountField, { label: "Amount Label", name: "amount", type: "Amount", value: {
+                value: 345,
+            }, units: commonCryptoCurrencies, disabled: true }));
+        const input = screen.getByLabelText('Amount Label');
+        expect(input).toBeDisabled();
+    });
+    it('should set the input as required when required prop is true', () => {
+        renderWithForm(_jsx(AmountField, { label: "Amount Label", name: "amount", type: "Amount", value: {
+                value: 345,
+            }, required: true, units: commonCryptoCurrencies }));
+        expect(screen.getByRole('spinbutton')).toHaveAttribute('required');
+    });
+    it('should render the description when provided', () => {
+        renderWithForm(_jsx(AmountField, { label: "Amount Label", name: "amount", type: "Amount", value: {
+                value: 345,
+            }, units: commonCryptoCurrencies, disabled: true, description: "This is a description" }));
+        expect(screen.getByText('This is a description')).toBeInTheDocument();
+    });
+});
+//# sourceMappingURL=amount-field.test.js.map

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

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

package/dist/src/scalars/components/boolean-field/boolean-field.stories.d.ts

@@ -0,0 +1,85 @@
+import type { StoryObj } from '@storybook/react';
+import { StorybookControlCategory } from '../../lib/storybook-arg-types.js';
+import { BooleanField } from './boolean-field.js';
+declare const meta: {
+    title: string;
+    component: import("react").ForwardRefExoticComponent<import("./boolean-field.js").BooleanFieldProps & import("react").RefAttributes<HTMLButtonElement>>;
+    decorators: import("@storybook/react").Decorator[];
+    argTypes: {
+        value: {
+            control: "inline-radio";
+            options: (string | boolean)[];
+            description: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+                category: StorybookControlCategory;
+            };
+        };
+        isToggle: {
+            control: "boolean";
+            description: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+                category: StorybookControlCategory;
+            };
+        };
+        optionalLabel: {
+            control: "text";
+            description: string;
+            table: {
+                category: StorybookControlCategory;
+            };
+            if: {
+                arg: string;
+                eq: boolean;
+            };
+        };
+        viewMode: {
+            control: "select";
+            description: string;
+            options: string[];
+            table: {
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+                category: StorybookControlCategory;
+            };
+        };
+        baseValue: {
+            control: "boolean";
+            description: string;
+            table: {
+                category: StorybookControlCategory;
+            };
+        };
+    };
+    args: {
+        name: string;
+    };
+    tags: string[];
+    parameters: {
+        layout: string;
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof BooleanField>;
+export declare const Checkbox: Story;
+export declare const Toggle: Story;
+export declare const WithDifferencesAddition: Story;
+export declare const WithDifferencesRemoval: Story;
+//# sourceMappingURL=boolean-field.stories.d.ts.map

package/dist/src/scalars/components/boolean-field/boolean-field.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"boolean-field.stories.d.ts","sourceRoot":"","sources":["../../../../../src/scalars/components/boolean-field/boolean-field.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAA6C,wBAAwB,EAAE,MAAM,kCAAkC,CAAA;AACtH,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AAEjD,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+E2B,CAAA;AAErC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,YAAY,CAAC,CAAA;AAE1C,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAMpB,CAAA;AAED,eAAO,MAAM,uBAAuB,EAAE,KAQrC,CAAA;AACD,eAAO,MAAM,sBAAsB,EAAE,KAQpC,CAAA"}

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

@@ -0,0 +1,113 @@
+import { withForm } from '../../lib/decorators.js';
+import { getDefaultArgTypes, getValidationArgTypes, StorybookControlCategory } from '../../lib/storybook-arg-types.js';
+import { BooleanField } from './boolean-field.js';
+const meta = {
+    title: 'Scalars/Boolean Field',
+    component: BooleanField,
+    decorators: [withForm],
+    argTypes: {
+        ...getDefaultArgTypes({
+            enabledArgTypes: {
+                value: false,
+            },
+            valueControlType: 'boolean',
+            valueType: 'boolean',
+        }),
+        value: {
+            control: 'inline-radio',
+            options: ['indeterminate', true, false],
+            description: 'Current value of the input field',
+            table: {
+                type: { summary: 'boolean' },
+                category: StorybookControlCategory.DEFAULT,
+            },
+        },
+        isToggle: {
+            control: 'boolean',
+            description: 'Whether the field is a toggle or checkbox',
+            table: {
+                type: { summary: 'boolean' },
+                defaultValue: { summary: 'false' },
+                category: StorybookControlCategory.COMPONENT_SPECIFIC,
+            },
+        },
+        optionalLabel: {
+            control: 'text',
+            description: 'The label of the optional field',
+            table: {
+                category: StorybookControlCategory.DIFF,
+            },
+            if: { arg: 'isToggle', eq: true },
+        },
+        viewMode: {
+            control: 'select',
+            description: 'The mode of the input field',
+            options: ['edition', 'addition', 'removal'],
+            table: {
+                type: { summary: 'edition | addition | removal' },
+                defaultValue: { summary: 'edition' },
+                category: StorybookControlCategory.DIFF,
+            },
+        },
+        baseValue: {
+            control: 'boolean',
+            description: 'The base value of the input field',
+            table: {
+                category: StorybookControlCategory.DIFF,
+            },
+        },
+        ...getValidationArgTypes({
+            enabledArgTypes: {
+                validators: false,
+                showErrorOnBlur: false,
+                showErrorOnChange: false,
+            },
+        }),
+    },
+    args: {
+        name: 'boolean-field',
+    },
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'centered',
+        docs: {
+            description: {
+                component: 'A boolean field component that can be used as a [checkbox](?path=/docs/data-entry-checkbox--readme) or [toggle](?path=/docs/data-entry-toggle--readme) depending on the `isToggle` prop.',
+            },
+        },
+    },
+};
+export default meta;
+export const Checkbox = {
+    args: {
+        label: 'Checkbox Field',
+        description: 'This is a checkbox field',
+        isToggle: false,
+    },
+};
+export const Toggle = {
+    args: {
+        label: 'Toggle Field',
+        description: 'This is a toggle field',
+        isToggle: true,
+    },
+};
+export const WithDifferencesAddition = {
+    args: {
+        label: 'Number difference addition',
+        value: true,
+        baseValue: false,
+        isToggle: true,
+        viewMode: 'addition',
+    },
+};
+export const WithDifferencesRemoval = {
+    args: {
+        label: 'Number difference removal',
+        value: false,
+        baseValue: true,
+        isToggle: false,
+        viewMode: 'removal',
+    },
+};
+//# sourceMappingURL=boolean-field.stories.js.map

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

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

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

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

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

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