@webiny/admin-ui 6.0.0-alpha.0

package/CheckboxGroup/CheckboxGroup.mdx

@@ -0,0 +1,125 @@
+import { Canvas, Meta, Controls } from '@storybook/blocks';
+
+import * as CheckboxGroupStories from './CheckboxGroup.stories';
+
+<Meta of={CheckboxGroupStories} />
+
+# Checkbox Group
+
+Checkboxes allow users to select multiple items from a list of individual items, or to mark one individual item as selected. A checkbox group is a grouping of checkboxes that are related to each other.
+
+## Usage
+
+<Canvas of={CheckboxGroupStories.Documentation} source={ { code:
+`// Code for a Checkbox Group
+
+import React, { useState } from "react";
+
+import { CheckboxGroup } from "@webiny/admin-ui";
+
+const CheckboxGroupExample = () => {
+    const [selectedValues, setSelectedValues] = useState<string[]>([]);
+    const [validation, setValidation] = useState({ isValid: true, message: "" });
+
+    const handleChange = (newValues: string[]) => {
+        setSelectedValues(newValues);
+
+        // Simple required validation
+        if (!newValues || newValues.length === 0) {
+            setValidation({ isValid: false, message: "Please select at least one option." });
+        } else {
+            setValidation({ isValid: true, message: "" });
+        }
+    };
+
+    return (
+        <div>
+            <CheckboxGroup
+                label="Select your preferences"
+                description="Choose one or more options."
+                note="Note: You can select multiple values."
+                required={true}
+                items={[
+                    { label: "Value 1", value: "value-1" },
+                    { label: "Value 2", value: "value-2" },
+                    { label: "Value 3", value: "value-3" }
+                ]}
+                value={selectedValues}
+                onChange={handleChange}
+                validation={validation}
+            />
+        </div>
+    );
+};
+
+export default CheckboxGroupExample;
+
+` } }
+        additionalActions={[
+            {
+                title: 'Open in GitHub',
+                onClick: () => {
+                    window.open(
+                        'https://github.com/webiny/webiny-js/blob/feat/new-admin-ui/packages/admin-ui/src/CheckboxGroup/CheckboxGroup.tsx',
+                        '_blank'
+                    );
+                },
+            }
+        ]}
+/>
+
+<Controls of={CheckboxGroupStories.Documentation} exclude={"onChange"}/>
+
+```tsx
+import React, { useState } from "react";
+
+import { CheckboxGroup } from "@webiny/admin-ui";
+
+const CheckboxGroupExample = () => {
+    const [selectedValues, setSelectedValues] = useState<string[]>([]);
+    const [validation, setValidation] = useState({ isValid: true, message: "" });
+
+    const handleChange = (newValues: string[]) => {
+        setSelectedValues(newValues);
+
+        // Simple required validation
+        if (!newValues || newValues.length === 0) {
+            setValidation({ isValid: false, message: "Please select at least one option." });
+        } else {
+            setValidation({ isValid: true, message: "" });
+        }
+    };
+
+    return (
+        <div>
+            <CheckboxGroup
+                label="Select your preferences"
+                description="Choose one or more options."
+                note="Note: You can select multiple values."
+                required={true}
+                items={[
+                    { label: "Value 1", value: "value-1" },
+                    { label: "Value 2", value: "value-2" },
+                    { label: "Value 3", value: "value-3" }
+                ]}
+                value={selectedValues}
+                onChange={handleChange}
+                validation={validation}
+            />
+        </div>
+    );
+};
+
+export default CheckboxGroupExample;
+```
+
+## Anatomy
+
+### General
+Checkbox Group input enable users to select a single or multiple items from a list of offered choices. A checkbox input group organizes related checkbox input options together for better clarity and functionality.
+
+<img src="/images/storybook/checkbox-group/general.png" alt="General"/>
+
+
+
+

package/CheckboxGroup/CheckboxGroup.stories.d.ts

@@ -0,0 +1,14 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { CheckboxGroup } from "./";
+declare const meta: Meta<typeof CheckboxGroup>;
+export default meta;
+type Story = StoryObj<typeof CheckboxGroup>;
+export declare const Default: Story;
+export declare const WithLabel: Story;
+export declare const WithRequiredLabel: Story;
+export declare const WithDescription: Story;
+export declare const WithNotes: Story;
+export declare const WithErrors: Story;
+export declare const Disabled: Story;
+export declare const FullExample: Story;
+export declare const Documentation: Story;

package/CheckboxGroup/CheckboxGroup.stories.js

@@ -0,0 +1,221 @@
+import React, { useState, useEffect } from "react";
+import { CheckboxGroup } from "./";
+const meta = {
+  title: "Components/Form/CheckboxGroup",
+  component: CheckboxGroup,
+  argTypes: {
+    disabled: {
+      control: "boolean",
+      defaultValue: false
+    }
+  },
+  parameters: {
+    layout: "padded"
+  },
+  render: args => {
+    const [value, setValue] = useState(args.value);
+    return /*#__PURE__*/React.createElement(CheckboxGroup, Object.assign({}, args, {
+      value: value,
+      onChange: value => setValue(value)
+    }));
+  }
+};
+export default meta;
+export const Default = {
+  args: {
+    items: [{
+      label: "Value 1",
+      value: "value-1"
+    }, {
+      label: "Value 2",
+      value: "value-2"
+    }, {
+      label: "Value 3",
+      value: "value-3"
+    }],
+    value: []
+  }
+};
+export const WithLabel = {
+  args: {
+    ...Default.args,
+    label: "Any field label"
+  }
+};
+export const WithRequiredLabel = {
+  args: {
+    ...Default.args,
+    label: "Any field label",
+    required: true
+  }
+};
+export const WithDescription = {
+  args: {
+    ...Default.args,
+    description: "Provide the required information for processing your request."
+  }
+};
+export const WithNotes = {
+  args: {
+    ...Default.args,
+    note: "Note: Ensure your selection or input is accurate before proceeding."
+  }
+};
+export const WithErrors = {
+  args: {
+    ...Default.args,
+    validation: {
+      isValid: false,
+      message: "This field is required."
+    }
+  }
+};
+export const Disabled = {
+  args: {
+    ...Default.args,
+    label: "Any field label",
+    items: [{
+      label: "Value 1",
+      value: "value-1",
+      disabled: true
+    }, {
+      label: "Value 2",
+      value: "value-2",
+      disabled: true
+    }, {
+      label: "Value 3",
+      value: "value-3",
+      disabled: true
+    }],
+    disabled: true
+  }
+};
+export const FullExample = {
+  args: {
+    ...Default.args,
+    label: "Select which deploy option do you prefer",
+    required: true,
+    description: "Deployment option is simply a way of parsing the data based on your database settings.",
+    note: "Note: Ensure your selection or input is accurate before proceeding.",
+    validation: {
+      isValid: false,
+      message: "You must select at least one of the items!"
+    }
+  }
+};
+export const Documentation = {
+  render: args => {
+    const [selectedValues, setSelectedValues] = useState(args.value || []);
+    const [validation, setValidation] = useState({
+      isValid: true,
+      message: ""
+    });
+
+    // Update values when args.value changes
+    useEffect(() => {
+      setSelectedValues(args.value || []);
+    }, [args.value]);
+    const handleChange = newValues => {
+      setSelectedValues(newValues);
+
+      // Simple required validation
+      if (args.required && (!newValues || newValues.length === 0)) {
+        setValidation({
+          isValid: false,
+          message: "Please select at least one option."
+        });
+      } else {
+        setValidation({
+          isValid: true,
+          message: ""
+        });
+      }
+    };
+
+    // Validate on required change or value change
+    useEffect(() => {
+      if (args.required && (!selectedValues || selectedValues.length === 0)) {
+        setValidation({
+          isValid: false,
+          message: "Please select at least one option."
+        });
+      } else {
+        setValidation({
+          isValid: true,
+          message: ""
+        });
+      }
+    }, [args.required, selectedValues]);
+    return /*#__PURE__*/React.createElement(CheckboxGroup, Object.assign({}, args, {
+      value: selectedValues,
+      onChange: handleChange,
+      validation: validation,
+      required: args.required
+    }));
+  },
+  args: {
+    label: "Select your preferences",
+    required: true,
+    disabled: false,
+    description: "Choose one or more options.",
+    note: "Note: You can select multiple values.",
+    items: [{
+      label: "Value 1",
+      value: "value-1"
+    }, {
+      label: "Value 2",
+      value: "value-2"
+    }, {
+      label: "Value 3",
+      value: "value-3"
+    }],
+    value: [],
+    validation: {
+      isValid: false,
+      message: "Please select at least one option."
+    }
+  },
+  argTypes: {
+    label: {
+      description: "Label text for the checkbox group",
+      control: "text",
+      defaultValue: "Select your preferences"
+    },
+    required: {
+      description: "Makes the checkbox group required when set to true",
+      control: "boolean",
+      defaultValue: true
+    },
+    disabled: {
+      description: "Disables the checkbox group when set to true",
+      control: "boolean",
+      defaultValue: false
+    },
+    description: {
+      description: "Additional description text below the checkbox group",
+      control: "text"
+    },
+    note: {
+      description: "Additional note text below the checkbox group",
+      control: "text"
+    },
+    validation: {
+      description: "Validation state and message",
+      control: "object"
+    },
+    items: {
+      description: "Array of checkbox items with label and value",
+      control: "object"
+    },
+    value: {
+      description: "Array of selected values",
+      control: "object"
+    },
+    onChange: {
+      description: "Callback function triggered when selection changes",
+      control: "none"
+    }
+  }
+};
+
+//# sourceMappingURL=CheckboxGroup.stories.js.map

package/CheckboxGroup/CheckboxGroup.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","useEffect","CheckboxGroup","meta","title","component","argTypes","disabled","control","defaultValue","parameters","layout","render","args","value","setValue","createElement","Object","assign","onChange","Default","items","label","WithLabel","WithRequiredLabel","required","WithDescription","description","WithNotes","note","WithErrors","validation","isValid","message","Disabled","FullExample","Documentation","selectedValues","setSelectedValues","setValidation","handleChange","newValues","length"],"sources":["CheckboxGroup.stories.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { CheckboxGroup } from \"~/CheckboxGroup\";\n\nconst meta: Meta<typeof CheckboxGroup> = {\n    title: \"Components/Form/CheckboxGroup\",\n    component: CheckboxGroup,\n    argTypes: {\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <CheckboxGroup {...args} value={value} onChange={value => setValue(value)} />;\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof CheckboxGroup>;\n\nexport const Default: Story = {\n    args: {\n        items: [\n            {\n                label: \"Value 1\",\n                value: \"value-1\"\n            },\n            {\n                label: \"Value 2\",\n                value: \"value-2\"\n            },\n            {\n                label: \"Value 3\",\n                value: \"value-3\"\n            }\n        ],\n        value: []\n    }\n};\n\nexport const WithLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\"\n    }\n};\n\nexport const WithRequiredLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: \"Provide the required information for processing your request.\"\n    }\n};\n\nexport const WithNotes: Story = {\n    args: {\n        ...Default.args,\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\"\n    }\n};\n\nexport const WithErrors: Story = {\n    args: {\n        ...Default.args,\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        items: [\n            {\n                label: \"Value 1\",\n                value: \"value-1\",\n                disabled: true\n            },\n            {\n                label: \"Value 2\",\n                value: \"value-2\",\n                disabled: true\n            },\n            {\n                label: \"Value 3\",\n                value: \"value-3\",\n                disabled: true\n            }\n        ],\n        disabled: true\n    }\n};\n\nexport const FullExample: Story = {\n    args: {\n        ...Default.args,\n        label: \"Select which deploy option do you prefer\",\n        required: true,\n        description:\n            \"Deployment option is simply a way of parsing the data based on your database settings.\",\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\",\n        validation: {\n            isValid: false,\n            message: \"You must select at least one of the items!\"\n        }\n    }\n};\n\nexport const Documentation: Story = {\n    render: args => {\n        const [selectedValues, setSelectedValues] = useState<string[]>(args.value || []);\n        const [validation, setValidation] = useState({ isValid: true, message: \"\" });\n\n        // Update values when args.value changes\n        useEffect(() => {\n            setSelectedValues(args.value || []);\n        }, [args.value]);\n\n        const handleChange = (newValues: string[]) => {\n            setSelectedValues(newValues);\n\n            // Simple required validation\n            if (args.required && (!newValues || newValues.length === 0)) {\n                setValidation({ isValid: false, message: \"Please select at least one option.\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        };\n\n        // Validate on required change or value change\n        useEffect(() => {\n            if (args.required && (!selectedValues || selectedValues.length === 0)) {\n                setValidation({ isValid: false, message: \"Please select at least one option.\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        }, [args.required, selectedValues]);\n\n        return (\n            <CheckboxGroup\n                {...args}\n                value={selectedValues}\n                onChange={handleChange}\n                validation={validation}\n                required={args.required}\n            />\n        );\n    },\n    args: {\n        label: \"Select your preferences\",\n        required: true,\n        disabled: false,\n        description: \"Choose one or more options.\",\n        note: \"Note: You can select multiple values.\",\n        items: [\n            {\n                label: \"Value 1\",\n                value: \"value-1\"\n            },\n            {\n                label: \"Value 2\",\n                value: \"value-2\"\n            },\n            {\n                label: \"Value 3\",\n                value: \"value-3\"\n            }\n        ],\n        value: [],\n        validation: {\n            isValid: false,\n            message: \"Please select at least one option.\"\n        }\n    },\n    argTypes: {\n        label: {\n            description: \"Label text for the checkbox group\",\n            control: \"text\",\n            defaultValue: \"Select your preferences\"\n        },\n        required: {\n            description: \"Makes the checkbox group required when set to true\",\n            control: \"boolean\",\n            defaultValue: true\n        },\n        disabled: {\n            description: \"Disables the checkbox group when set to true\",\n            control: \"boolean\",\n            defaultValue: false\n        },\n        description: {\n            description: \"Additional description text below the checkbox group\",\n            control: \"text\"\n        },\n        note: {\n            description: \"Additional note text below the checkbox group\",\n            control: \"text\"\n        },\n        validation: {\n            description: \"Validation state and message\",\n            control: \"object\"\n        },\n        items: {\n            description: \"Array of checkbox items with label and value\",\n            control: \"object\"\n        },\n        value: {\n            description: \"Array of selected values\",\n            control: \"object\"\n        },\n        onChange: {\n            description: \"Callback function triggered when selection changes\",\n            control: \"none\"\n        }\n    }\n};\n"],"mappings":"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","ignoreList":[]}

package/CheckboxGroup/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./CheckboxGroup";
+export * from "./primitives";

package/CheckboxGroup/index.js

@@ -0,0 +1,4 @@
+export * from "./CheckboxGroup";
+export * from "./primitives";
+
+//# sourceMappingURL=index.js.map

package/CheckboxGroup/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./CheckboxGroup\";\nexport * from \"./primitives\";\n"],"mappings":"AAAA;AACA","ignoreList":[]}

package/CheckboxGroup/primitives/CheckboxGroupPrimitive.d.ts

@@ -0,0 +1,61 @@
+import React from "react";
+import { CheckboxItemDto, CheckboxItemFormatted } from "../../Checkbox";
+interface CheckboxGroupPrimitiveProps<TValue = any> {
+    /**
+     * Array of checkbox items.
+     */
+    items: CheckboxItemDto[];
+    /**
+     * Callback function called when the checkbox values change.
+     */
+    onChange?: (values: TValue[]) => void;
+    /**
+     * Array of selected checkbox values.
+     */
+    value?: TValue[];
+}
+interface CheckboxGroupPrimitiveVm {
+    items: CheckboxItemFormatted[];
+}
+type CheckboxGroupPrimitiveRendererProps<TValue = any> = CheckboxGroupPrimitiveVm & {
+    changeChecked: (value: TValue) => void;
+};
+declare const CheckboxGroupPrimitiveRenderer: (({ items, changeChecked }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element) & {
+    original: ({ items, changeChecked }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: (({ items, changeChecked }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element) & {
+        original: ({ items, changeChecked }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(({ items, changeChecked }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element) & {
+        original: ({ items, changeChecked }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+declare const CheckboxGroupPrimitive: ((props: CheckboxGroupPrimitiveProps) => React.JSX.Element) & {
+    original: (props: CheckboxGroupPrimitiveProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: ((props: CheckboxGroupPrimitiveProps) => React.JSX.Element) & {
+        original: (props: CheckboxGroupPrimitiveProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: CheckboxGroupPrimitiveProps) => React.JSX.Element) & {
+        original: (props: CheckboxGroupPrimitiveProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+export { CheckboxGroupPrimitive, CheckboxGroupPrimitiveRenderer, type CheckboxGroupPrimitiveProps, type CheckboxGroupPrimitiveRendererProps, type CheckboxGroupPrimitiveVm };

package/CheckboxGroup/primitives/CheckboxGroupPrimitive.js

@@ -0,0 +1,37 @@
+import React from "react";
+import { cn, makeDecoratable } from "../../utils";
+import { CheckboxPrimitiveRenderer } from "../../Checkbox";
+import { useCheckboxGroup } from "./useCheckboxGroup";
+/**
+ * Checkbox Group Renderer
+ */
+const DecoratableCheckboxGroupPrimitiveRenderer = ({
+  items,
+  changeChecked
+}) => {
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn("wby-grid wby-gap-sm-extra wby-py-xs-plus")
+  }, items.map(item => /*#__PURE__*/React.createElement(CheckboxPrimitiveRenderer, Object.assign({
+    key: item.id
+  }, item, {
+    changeChecked: () => changeChecked(item.value)
+  }))));
+};
+const CheckboxGroupPrimitiveRenderer = makeDecoratable("CheckboxGroupPrimitiveRenderer", DecoratableCheckboxGroupPrimitiveRenderer);
+
+/**
+ * Checkbox Group
+ */
+const DecoratableCheckboxGroupPrimitive = props => {
+  const {
+    vm,
+    changeChecked
+  } = useCheckboxGroup(props);
+  return /*#__PURE__*/React.createElement(CheckboxGroupPrimitiveRenderer, Object.assign({}, vm, {
+    changeChecked: changeChecked
+  }));
+};
+const CheckboxGroupPrimitive = makeDecoratable("CheckboxGroupPrimitive", DecoratableCheckboxGroupPrimitive);
+export { CheckboxGroupPrimitive, CheckboxGroupPrimitiveRenderer };
+
+//# sourceMappingURL=CheckboxGroupPrimitive.js.map

package/CheckboxGroup/primitives/CheckboxGroupPrimitive.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","cn","makeDecoratable","CheckboxPrimitiveRenderer","useCheckboxGroup","DecoratableCheckboxGroupPrimitiveRenderer","items","changeChecked","createElement","className","map","item","Object","assign","key","id","value","CheckboxGroupPrimitiveRenderer","DecoratableCheckboxGroupPrimitive","props","vm","CheckboxGroupPrimitive"],"sources":["CheckboxGroupPrimitive.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn, makeDecoratable } from \"~/utils\";\nimport { CheckboxItemDto, CheckboxItemFormatted, CheckboxPrimitiveRenderer } from \"~/Checkbox\";\nimport { useCheckboxGroup } from \"./useCheckboxGroup\";\n\ninterface CheckboxGroupPrimitiveProps<TValue = any> {\n    /**\n     * Array of checkbox items.\n     */\n    items: CheckboxItemDto[];\n    /**\n     * Callback function called when the checkbox values change.\n     */\n    onChange?: (values: TValue[]) => void;\n    /**\n     * Array of selected checkbox values.\n     */\n    value?: TValue[];\n}\n\ninterface CheckboxGroupPrimitiveVm {\n    items: CheckboxItemFormatted[];\n}\n\ntype CheckboxGroupPrimitiveRendererProps<TValue = any> = CheckboxGroupPrimitiveVm & {\n    changeChecked: (value: TValue) => void;\n};\n\n/**\n * Checkbox Group Renderer\n */\nconst DecoratableCheckboxGroupPrimitiveRenderer = ({\n    items,\n    changeChecked\n}: CheckboxGroupPrimitiveRendererProps) => {\n    return (\n        <div className={cn(\"wby-grid wby-gap-sm-extra wby-py-xs-plus\")}>\n            {items.map(item => (\n                <CheckboxPrimitiveRenderer\n                    key={item.id}\n                    {...item}\n                    changeChecked={() => changeChecked(item.value)}\n                />\n            ))}\n        </div>\n    );\n};\nconst CheckboxGroupPrimitiveRenderer = makeDecoratable(\n    \"CheckboxGroupPrimitiveRenderer\",\n    DecoratableCheckboxGroupPrimitiveRenderer\n);\n\n/**\n * Checkbox Group\n */\nconst DecoratableCheckboxGroupPrimitive = (props: CheckboxGroupPrimitiveProps) => {\n    const { vm, changeChecked } = useCheckboxGroup(props);\n    return <CheckboxGroupPrimitiveRenderer {...vm} changeChecked={changeChecked} />;\n};\nconst CheckboxGroupPrimitive = makeDecoratable(\n    \"CheckboxGroupPrimitive\",\n    DecoratableCheckboxGroupPrimitive\n);\n\nexport {\n    CheckboxGroupPrimitive,\n    CheckboxGroupPrimitiveRenderer,\n    type CheckboxGroupPrimitiveProps,\n    type CheckboxGroupPrimitiveRendererProps,\n    type CheckboxGroupPrimitiveVm\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,EAAE,EAAEC,eAAe;AAC5B,SAAiDC,yBAAyB;AAC1E,SAASC,gBAAgB;AAyBzB;AACA;AACA;AACA,MAAMC,yCAAyC,GAAGA,CAAC;EAC/CC,KAAK;EACLC;AACiC,CAAC,KAAK;EACvC,oBACIP,KAAA,CAAAQ,aAAA;IAAKC,SAAS,EAAER,EAAE,CAAC,0CAA0C;EAAE,GAC1DK,KAAK,CAACI,GAAG,CAACC,IAAI,iBACXX,KAAA,CAAAQ,aAAA,CAACL,yBAAyB,EAAAS,MAAA,CAAAC,MAAA;IACtBC,GAAG,EAAEH,IAAI,CAACI;EAAG,GACTJ,IAAI;IACRJ,aAAa,EAAEA,CAAA,KAAMA,aAAa,CAACI,IAAI,CAACK,KAAK;EAAE,EAClD,CACJ,CACA,CAAC;AAEd,CAAC;AACD,MAAMC,8BAA8B,GAAGf,eAAe,CAClD,gCAAgC,EAChCG,yCACJ,CAAC;;AAED;AACA;AACA;AACA,MAAMa,iCAAiC,GAAIC,KAAkC,IAAK;EAC9E,MAAM;IAAEC,EAAE;IAAEb;EAAc,CAAC,GAAGH,gBAAgB,CAACe,KAAK,CAAC;EACrD,oBAAOnB,KAAA,CAAAQ,aAAA,CAACS,8BAA8B,EAAAL,MAAA,CAAAC,MAAA,KAAKO,EAAE;IAAEb,aAAa,EAAEA;EAAc,EAAE,CAAC;AACnF,CAAC;AACD,MAAMc,sBAAsB,GAAGnB,eAAe,CAC1C,wBAAwB,EACxBgB,iCACJ,CAAC;AAED,SACIG,sBAAsB,EACtBJ,8BAA8B","ignoreList":[]}

package/CheckboxGroup/primitives/CheckboxGroupPrimitive.stories.d.ts

@@ -0,0 +1,11 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { CheckboxGroupPrimitive } from "./CheckboxGroupPrimitive";
+declare const meta: Meta<typeof CheckboxGroupPrimitive>;
+export default meta;
+type Story = StoryObj<typeof CheckboxGroupPrimitive>;
+export declare const Default: Story;
+export declare const WithLongLabels: Story;
+export declare const WithSelectedValues: Story;
+export declare const WithDisabledValue: Story;
+export declare const WithExternalValueControl: Story;
+export declare const WithNumericValues: Story;

package/CheckboxGroup/primitives/CheckboxGroupPrimitive.stories.js

@@ -0,0 +1,128 @@
+import React, { useState } from "react";
+import { CheckboxGroupPrimitive } from "./CheckboxGroupPrimitive";
+import { Button } from "../../Button";
+const meta = {
+  title: "Components/Form Primitives/CheckboxGroup",
+  component: CheckboxGroupPrimitive,
+  parameters: {
+    layout: "padded"
+  },
+  render: args => {
+    const [values, setValues] = useState(args.value);
+    return /*#__PURE__*/React.createElement("div", {
+      className: "wby-w-full"
+    }, /*#__PURE__*/React.createElement(CheckboxGroupPrimitive, Object.assign({}, args, {
+      value: values,
+      onChange: values => setValues(values)
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "wby-mt-4 wby-text-center"
+    }, "Current selected value: ", /*#__PURE__*/React.createElement("pre", null, values && values.join())));
+  }
+};
+export default meta;
+export const Default = {
+  args: {
+    items: [{
+      label: "Value 1",
+      value: "value-1"
+    }, {
+      label: "Value 2",
+      value: "value-2"
+    }, {
+      label: "Value 3",
+      value: "value-3"
+    }],
+    value: []
+  }
+};
+export const WithLongLabels = {
+  args: {
+    items: [{
+      label: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eu aliquam lacus. Morbi eleifend, eros et vestibulum lobortis, mi elit scelerisque neque, sit amet dictum orci sem ac ante. In hac habitasse platea dictumst. Pellentesque molestie nisl tortor, eu dictum velit mollis vitae. Integer consectetur id diam eget iaculis. Praesent egestas ullamcorper libero vel eleifend.",
+      value: "value-1"
+    }, {
+      label: "Ut pretium ex vel auctor bibendum. In hac habitasse platea dictumst. Etiam varius felis mi, eu sagittis erat congue vel. Phasellus dui eros, dignissim quis quam pulvinar, tincidunt venenatis felis.",
+      value: "value-2"
+    }, {
+      label: "Nullam gravida consequat volutpat. Ut faucibus imperdiet lobortis. Nullam tempus accumsan metus, vel fermentum lacus dignissim vitae. Sed vitae nunc ante. Cras sollicitudin id dolor sit amet imperdiet.",
+      value: "value-3"
+    }],
+    value: []
+  }
+};
+export const WithSelectedValues = {
+  args: {
+    items: [{
+      label: "Value 1",
+      value: "value-1"
+    }, {
+      label: "Value 2",
+      value: "value-2"
+    }, {
+      label: "Value 3",
+      value: "value-3"
+    }],
+    value: ["value-2"]
+  }
+};
+export const WithDisabledValue = {
+  args: {
+    items: [{
+      label: "Value 1",
+      value: "value-1"
+    }, {
+      label: "Value 2",
+      value: "value-2",
+      disabled: true
+    }, {
+      label: "Value 3",
+      value: "value-3"
+    }],
+    value: ["value-2"]
+  }
+};
+export const WithExternalValueControl = {
+  args: {
+    ...Default.args
+  },
+  render: args => {
+    const [values, setValues] = useState(args.value);
+    return /*#__PURE__*/React.createElement("div", {
+      className: "wby-w-full"
+    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CheckboxGroupPrimitive, Object.assign({}, args, {
+      value: values,
+      onChange: values => setValues(values)
+    }))), /*#__PURE__*/React.createElement("div", {
+      className: "wby-mt-4 wby-text-center"
+    }, /*#__PURE__*/React.createElement(Button, {
+      text: "Reset",
+      onClick: () => setValues([])
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "wby-mt-4 wby-text-center"
+    }, "Current selected value: ", /*#__PURE__*/React.createElement("pre", null, values && values.join())));
+  }
+};
+export const WithNumericValues = {
+  args: {
+    ...Default.args,
+    value: [3, 4],
+    items: [{
+      label: "Number 1",
+      value: 1
+    }, {
+      label: "Number 2",
+      value: 2
+    }, {
+      label: "Number 3",
+      value: 3
+    }, {
+      label: "Number 4",
+      value: 4
+    }, {
+      label: "Number 5",
+      value: 5
+    }]
+  }
+};
+
+//# sourceMappingURL=CheckboxGroupPrimitive.stories.js.map

package/CheckboxGroup/primitives/CheckboxGroupPrimitive.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","CheckboxGroupPrimitive","Button","meta","title","component","parameters","layout","render","args","values","setValues","value","createElement","className","Object","assign","onChange","join","Default","items","label","WithLongLabels","WithSelectedValues","WithDisabledValue","disabled","WithExternalValueControl","text","onClick","WithNumericValues"],"sources":["CheckboxGroupPrimitive.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { CheckboxGroupPrimitive } from \"./CheckboxGroupPrimitive\";\nimport { Button } from \"~/Button\";\n\nconst meta: Meta<typeof CheckboxGroupPrimitive> = {\n    title: \"Components/Form Primitives/CheckboxGroup\",\n    component: CheckboxGroupPrimitive,\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [values, setValues] = useState(args.value);\n        return (\n            <div className={\"wby-w-full\"}>\n                <CheckboxGroupPrimitive\n                    {...args}\n                    value={values}\n                    onChange={values => setValues(values)}\n                />\n                <div className={\"wby-mt-4 wby-text-center\"}>\n                    Current selected value: <pre>{values && values.join()}</pre>\n                </div>\n            </div>\n        );\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof CheckboxGroupPrimitive>;\n\nexport const Default: Story = {\n    args: {\n        items: [\n            {\n                label: \"Value 1\",\n                value: \"value-1\"\n            },\n            {\n                label: \"Value 2\",\n                value: \"value-2\"\n            },\n            {\n                label: \"Value 3\",\n                value: \"value-3\"\n            }\n        ],\n        value: []\n    }\n};\n\nexport const WithLongLabels: Story = {\n    args: {\n        items: [\n            {\n                label: \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eu aliquam lacus. Morbi eleifend, eros et vestibulum lobortis, mi elit scelerisque neque, sit amet dictum orci sem ac ante. In hac habitasse platea dictumst. Pellentesque molestie nisl tortor, eu dictum velit mollis vitae. Integer consectetur id diam eget iaculis. Praesent egestas ullamcorper libero vel eleifend.\",\n                value: \"value-1\"\n            },\n            {\n                label: \"Ut pretium ex vel auctor bibendum. In hac habitasse platea dictumst. Etiam varius felis mi, eu sagittis erat congue vel. Phasellus dui eros, dignissim quis quam pulvinar, tincidunt venenatis felis.\",\n                value: \"value-2\"\n            },\n            {\n                label: \"Nullam gravida consequat volutpat. Ut faucibus imperdiet lobortis. Nullam tempus accumsan metus, vel fermentum lacus dignissim vitae. Sed vitae nunc ante. Cras sollicitudin id dolor sit amet imperdiet.\",\n                value: \"value-3\"\n            }\n        ],\n        value: []\n    }\n};\n\nexport const WithSelectedValues: Story = {\n    args: {\n        items: [\n            {\n                label: \"Value 1\",\n                value: \"value-1\"\n            },\n            {\n                label: \"Value 2\",\n                value: \"value-2\"\n            },\n            {\n                label: \"Value 3\",\n                value: \"value-3\"\n            }\n        ],\n        value: [\"value-2\"]\n    }\n};\n\nexport const WithDisabledValue: Story = {\n    args: {\n        items: [\n            {\n                label: \"Value 1\",\n                value: \"value-1\"\n            },\n            {\n                label: \"Value 2\",\n                value: \"value-2\",\n                disabled: true\n            },\n            {\n                label: \"Value 3\",\n                value: \"value-3\"\n            }\n        ],\n        value: [\"value-2\"]\n    }\n};\n\nexport const WithExternalValueControl: Story = {\n    args: {\n        ...Default.args\n    },\n    render: args => {\n        const [values, setValues] = useState(args.value);\n        return (\n            <div className={\"wby-w-full\"}>\n                <div>\n                    <CheckboxGroupPrimitive\n                        {...args}\n                        value={values}\n                        onChange={values => setValues(values)}\n                    />\n                </div>\n                <div className={\"wby-mt-4 wby-text-center\"}>\n                    <Button text={\"Reset\"} onClick={() => setValues([])} />\n                </div>\n                <div className={\"wby-mt-4 wby-text-center\"}>\n                    Current selected value: <pre>{values && values.join()}</pre>\n                </div>\n            </div>\n        );\n    }\n};\n\nexport const WithNumericValues: Story = {\n    args: {\n        ...Default.args,\n        value: [3, 4],\n        items: [\n            {\n                label: \"Number 1\",\n                value: 1\n            },\n            {\n                label: \"Number 2\",\n                value: 2\n            },\n            {\n                label: \"Number 3\",\n                value: 3\n            },\n            {\n                label: \"Number 4\",\n                value: 4\n            },\n            {\n                label: \"Number 5\",\n                value: 5\n            }\n        ]\n    }\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AAEvC,SAASC,sBAAsB;AAC/B,SAASC,MAAM;AAEf,MAAMC,IAAyC,GAAG;EAC9CC,KAAK,EAAE,0CAA0C;EACjDC,SAAS,EAAEJ,sBAAsB;EACjCK,UAAU,EAAE;IACRC,MAAM,EAAE;EACZ,CAAC;EACDC,MAAM,EAAEC,IAAI,IAAI;IACZ,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAGX,QAAQ,CAACS,IAAI,CAACG,KAAK,CAAC;IAChD,oBACIb,KAAA,CAAAc,aAAA;MAAKC,SAAS,EAAE;IAAa,gBACzBf,KAAA,CAAAc,aAAA,CAACZ,sBAAsB,EAAAc,MAAA,CAAAC,MAAA,KACfP,IAAI;MACRG,KAAK,EAAEF,MAAO;MACdO,QAAQ,EAAEP,MAAM,IAAIC,SAAS,CAACD,MAAM;IAAE,EACzC,CAAC,eACFX,KAAA,CAAAc,aAAA;MAAKC,SAAS,EAAE;IAA2B,GAAC,0BAChB,eAAAf,KAAA,CAAAc,aAAA,cAAMH,MAAM,IAAIA,MAAM,CAACQ,IAAI,CAAC,CAAO,CAC1D,CACJ,CAAC;EAEd;AACJ,CAAC;AAED,eAAef,IAAI;AAGnB,OAAO,MAAMgB,OAAc,GAAG;EAC1BV,IAAI,EAAE;IACFW,KAAK,EAAE,CACH;MACIC,KAAK,EAAE,SAAS;MAChBT,KAAK,EAAE;IACX,CAAC,EACD;MACIS,KAAK,EAAE,SAAS;MAChBT,KAAK,EAAE;IACX,CAAC,EACD;MACIS,KAAK,EAAE,SAAS;MAChBT,KAAK,EAAE;IACX,CAAC,CACJ;IACDA,KAAK,EAAE;EACX;AACJ,CAAC;AAED,OAAO,MAAMU,cAAqB,GAAG;EACjCb,IAAI,EAAE;IACFW,KAAK,EAAE,CACH;MACIC,KAAK,EAAE,8XAA8X;MACrYT,KAAK,EAAE;IACX,CAAC,EACD;MACIS,KAAK,EAAE,uMAAuM;MAC9MT,KAAK,EAAE;IACX,CAAC,EACD;MACIS,KAAK,EAAE,2MAA2M;MAClNT,KAAK,EAAE;IACX,CAAC,CACJ;IACDA,KAAK,EAAE;EACX;AACJ,CAAC;AAED,OAAO,MAAMW,kBAAyB,GAAG;EACrCd,IAAI,EAAE;IACFW,KAAK,EAAE,CACH;MACIC,KAAK,EAAE,SAAS;MAChBT,KAAK,EAAE;IACX,CAAC,EACD;MACIS,KAAK,EAAE,SAAS;MAChBT,KAAK,EAAE;IACX,CAAC,EACD;MACIS,KAAK,EAAE,SAAS;MAChBT,KAAK,EAAE;IACX,CAAC,CACJ;IACDA,KAAK,EAAE,CAAC,SAAS;EACrB;AACJ,CAAC;AAED,OAAO,MAAMY,iBAAwB,GAAG;EACpCf,IAAI,EAAE;IACFW,KAAK,EAAE,CACH;MACIC,KAAK,EAAE,SAAS;MAChBT,KAAK,EAAE;IACX,CAAC,EACD;MACIS,KAAK,EAAE,SAAS;MAChBT,KAAK,EAAE,SAAS;MAChBa,QAAQ,EAAE;IACd,CAAC,EACD;MACIJ,KAAK,EAAE,SAAS;MAChBT,KAAK,EAAE;IACX,CAAC,CACJ;IACDA,KAAK,EAAE,CAAC,SAAS;EACrB;AACJ,CAAC;AAED,OAAO,MAAMc,wBAA+B,GAAG;EAC3CjB,IAAI,EAAE;IACF,GAAGU,OAAO,CAACV;EACf,CAAC;EACDD,MAAM,EAAEC,IAAI,IAAI;IACZ,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAGX,QAAQ,CAACS,IAAI,CAACG,KAAK,CAAC;IAChD,oBACIb,KAAA,CAAAc,aAAA;MAAKC,SAAS,EAAE;IAAa,gBACzBf,KAAA,CAAAc,aAAA,2BACId,KAAA,CAAAc,aAAA,CAACZ,sBAAsB,EAAAc,MAAA,CAAAC,MAAA,KACfP,IAAI;MACRG,KAAK,EAAEF,MAAO;MACdO,QAAQ,EAAEP,MAAM,IAAIC,SAAS,CAACD,MAAM;IAAE,EACzC,CACA,CAAC,eACNX,KAAA,CAAAc,aAAA;MAAKC,SAAS,EAAE;IAA2B,gBACvCf,KAAA,CAAAc,aAAA,CAACX,MAAM;MAACyB,IAAI,EAAE,OAAQ;MAACC,OAAO,EAAEA,CAAA,KAAMjB,SAAS,CAAC,EAAE;IAAE,CAAE,CACrD,CAAC,eACNZ,KAAA,CAAAc,aAAA;MAAKC,SAAS,EAAE;IAA2B,GAAC,0BAChB,eAAAf,KAAA,CAAAc,aAAA,cAAMH,MAAM,IAAIA,MAAM,CAACQ,IAAI,CAAC,CAAO,CAC1D,CACJ,CAAC;EAEd;AACJ,CAAC;AAED,OAAO,MAAMW,iBAAwB,GAAG;EACpCpB,IAAI,EAAE;IACF,GAAGU,OAAO,CAACV,IAAI;IACfG,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;IACbQ,KAAK,EAAE,CACH;MACIC,KAAK,EAAE,UAAU;MACjBT,KAAK,EAAE;IACX,CAAC,EACD;MACIS,KAAK,EAAE,UAAU;MACjBT,KAAK,EAAE;IACX,CAAC,EACD;MACIS,KAAK,EAAE,UAAU;MACjBT,KAAK,EAAE;IACX,CAAC,EACD;MACIS,KAAK,EAAE,UAAU;MACjBT,KAAK,EAAE;IACX,CAAC,EACD;MACIS,KAAK,EAAE,UAAU;MACjBT,KAAK,EAAE;IACX,CAAC;EAET;AACJ,CAAC","ignoreList":[]}