@ilo-org/react 0.7.8 → 0.8.0

package/lib/esm/components/index.js

@@ -2,9 +2,9 @@ export { default as AccordionButton } from './Accordion/AccordionButton.js';
 export { default as AccordionPanel } from './Accordion/AccordionPanel.js';
 export { default as AccordionItem } from './Accordion/AccordionItem.js';
 export { default as Accordion } from './Accordion/Accordion.js';
+export { default as Form } from './Form/Form.js';
 export { default as Collapse } from './Collapse/Collapse.js';
 export { default as Empty } from './Empty/Empty.js';
-export { default as FormGroup } from './FormGroup/FormGroup.js';
 export { default as Image } from './Image/Image.js';
 export { default as Loading } from './Loading/Loading.js';
 export { default as Radio } from './Radio/Radio.js';
@@ -19,10 +19,10 @@ import '../TagCtx-34c545fe.js';
 export { default as Button } from './Button/Button.js';
 export { default as ContextMenu } from './ContextMenu/ContextMenu.js';
 export { default as Fieldset } from './Fieldset/Fieldset.js';
-export { default as Input } from './Input/Input.js';
 export { default as Notification } from './Notification/Notification.js';
 export { default as ReadMore } from './ReadMore/ReadMore.js';
 export { default as Textarea } from './Textarea/Textarea.js';
+import './Textarea/index.js';
 export { default as Callout } from './Callout/Callout.js';
 import './Callout/index.js';
 export { default as Credit } from './Credit/Credit.js';
@@ -33,17 +33,15 @@ export { default as NumberPicker } from './NumberPicker/NumberPicker.js';
 export { default as RichText } from './RichText/RichText.js';
 export { default as Tooltip } from './Tooltip/Tooltip.js';
 export { default as Checkbox } from './Checkbox/Checkbox.js';
+import './Checkbox/index.js';
 export { default as DatePicker } from './DatePicker/DatePicker.js';
-export { default as Form } from './Form/Form.js';
 export { default as Hero } from './Hero/Hero.js';
 import './SocialMedia/index.js';
 export { default as LinkList } from './LinkList/LinkList.js';
 export { default as Pagination } from './Pagination/Pagination.js';
 export { default as SearchField } from './SearchField/SearchField.js';
 export { default as Video } from './Video/Video.js';
-export { default as ChoiceGroup } from './ChoiceGroup/ChoiceGroup.js';
 export { default as Dropdown } from './Dropdown/Dropdown.js';
-export { default as FormElement } from './FormElement/FormElement.js';
 export { default as Icon } from './Icon/Icon.js';
 export { default as List } from './List/List.js';
 import '../ListCtx-da435fdf.js';
@@ -66,8 +64,13 @@ import '../utils/getDefaultDimensionValue.js';
 import '../css-7414f50b.js';
 import '../utils/transitionEndListener.js';
 import '../utils/triggerBrowserReflow.js';
+import './FormControl/FormControl.js';
+import 'nanoid';
+import '../hooks/usePrevious.js';
 import './Hero/HeroCard.js';
 import './SocialMedia/SocialMedia.js';
+import './Input/Input.js';
+import './FormElement/FormElement.js';
 import '../VideoPlayer-a5fa87ce.js';
 import '../utils/hoursMinutesSeconds.js';
 import 'screenfull';

package/lib/esm/hooks/usePrevious.js

@@ -0,0 +1,15 @@
+import { useRef, useEffect } from 'react';
+
+// This code was shamelessly borrowed from the blog post
+// "How to access previous props or state with React Hooks" by
+// Ohans Emmanuel, published on LogRocket May 11, 2023
+// https://blog.logrocket.com/accessing-previous-props-state-react-hooks/
+function usePrevious(value) {
+    const ref = useRef();
+    useEffect(() => {
+        ref.current = value; //assign the value of ref to the argument
+    }, [value]); //this code will run when the value of 'value' changes
+    return ref.current; //in the end, return the current ref value.
+}
+
+export { usePrevious as default, usePrevious };

package/lib/esm/index.js

@@ -2,9 +2,9 @@ export { default as AccordionButton } from './components/Accordion/AccordionButt
 export { default as AccordionPanel } from './components/Accordion/AccordionPanel.js';
 export { default as AccordionItem } from './components/Accordion/AccordionItem.js';
 export { default as Accordion } from './components/Accordion/Accordion.js';
+export { default as Form } from './components/Form/Form.js';
 export { default as Collapse } from './components/Collapse/Collapse.js';
 export { default as Empty } from './components/Empty/Empty.js';
-export { default as FormGroup } from './components/FormGroup/FormGroup.js';
 export { default as Image } from './components/Image/Image.js';
 export { default as Loading } from './components/Loading/Loading.js';
 export { default as Radio } from './components/Radio/Radio.js';
@@ -19,10 +19,10 @@ import './TagCtx-34c545fe.js';
 export { default as Button } from './components/Button/Button.js';
 export { default as ContextMenu } from './components/ContextMenu/ContextMenu.js';
 export { default as Fieldset } from './components/Fieldset/Fieldset.js';
-export { default as Input } from './components/Input/Input.js';
 export { default as Notification } from './components/Notification/Notification.js';
 export { default as ReadMore } from './components/ReadMore/ReadMore.js';
 export { default as Textarea } from './components/Textarea/Textarea.js';
+import './components/Textarea/index.js';
 export { default as Callout } from './components/Callout/Callout.js';
 import './components/Callout/index.js';
 export { default as Credit } from './components/Credit/Credit.js';
@@ -33,17 +33,15 @@ export { default as NumberPicker } from './components/NumberPicker/NumberPicker.
 export { default as RichText } from './components/RichText/RichText.js';
 export { default as Tooltip } from './components/Tooltip/Tooltip.js';
 export { default as Checkbox } from './components/Checkbox/Checkbox.js';
+import './components/Checkbox/index.js';
 export { default as DatePicker } from './components/DatePicker/DatePicker.js';
-export { default as Form } from './components/Form/Form.js';
 export { default as Hero } from './components/Hero/Hero.js';
 import './components/SocialMedia/index.js';
 export { default as LinkList } from './components/LinkList/LinkList.js';
 export { default as Pagination } from './components/Pagination/Pagination.js';
 export { default as SearchField } from './components/SearchField/SearchField.js';
 export { default as Video } from './components/Video/Video.js';
-export { default as ChoiceGroup } from './components/ChoiceGroup/ChoiceGroup.js';
 export { default as Dropdown } from './components/Dropdown/Dropdown.js';
-export { default as FormElement } from './components/FormElement/FormElement.js';
 export { default as Icon } from './components/Icon/Icon.js';
 export { default as List } from './components/List/List.js';
 import './ListCtx-da435fdf.js';
@@ -66,9 +64,14 @@ import './utils/getDefaultDimensionValue.js';
 import './css-7414f50b.js';
 import './utils/transitionEndListener.js';
 import './utils/triggerBrowserReflow.js';
+import './components/FormControl/FormControl.js';
+import 'nanoid';
+import './hooks/usePrevious.js';
 import '@ilo-org/icons-react';
 import './components/Hero/HeroCard.js';
 import './components/SocialMedia/SocialMedia.js';
+import './components/Input/Input.js';
+import './components/FormElement/FormElement.js';
 import './VideoPlayer-a5fa87ce.js';
 import './utils/hoursMinutesSeconds.js';
 import 'screenfull';

package/lib/types/react/src/components/Checkbox/Checkbox.args.d.ts

@@ -0,0 +1,52 @@
+import { LabelledCheckboxProps } from "./Checkbox.props";
+/**
+ * Sample prop definitions Checkbox's enumerable properties (imported in stories and test)
+ */
+declare const CheckboxArgs: {
+    basic: LabelledCheckboxProps;
+    basicCheckBoxes: {
+        id: string;
+        defaultChecked?: boolean | undefined;
+        checked?: boolean | undefined;
+        value?: string | undefined;
+        onChange?: ((e: import("react").ChangeEvent<HTMLInputElement>) => any) | undefined;
+        onBlur?: ((e: import("react").FocusEvent<HTMLInputElement>) => any) | undefined;
+        className?: string | undefined;
+        disabled?: boolean | undefined;
+        error?: boolean | undefined;
+        name: string;
+        required?: boolean | undefined;
+        style?: import("react").CSSProperties | undefined;
+        errorMessage?: string | undefined;
+        helper?: string | undefined;
+        label: string;
+        labelPlacement?: "top" | "start" | "bottom" | "end" | undefined;
+        labelSize?: "small" | "medium" | "large" | undefined;
+        tooltip?: string | undefined;
+        inputStyle?: import("react").CSSProperties | undefined;
+    }[];
+    errorCheckBoxes: {
+        id: string;
+        defaultChecked?: boolean | undefined;
+        checked?: boolean | undefined;
+        value?: string | undefined;
+        onChange?: ((e: import("react").ChangeEvent<HTMLInputElement>) => any) | undefined;
+        onBlur?: ((e: import("react").FocusEvent<HTMLInputElement>) => any) | undefined;
+        className?: string | undefined;
+        disabled?: boolean | undefined;
+        error?: boolean | undefined;
+        name: string;
+        required?: boolean | undefined;
+        style?: import("react").CSSProperties | undefined;
+        errorMessage?: string | undefined;
+        helper?: string | undefined;
+        label: string;
+        labelPlacement?: "top" | "start" | "bottom" | "end" | undefined;
+        labelSize?: "small" | "medium" | "large" | undefined;
+        tooltip?: string | undefined;
+        inputStyle?: import("react").CSSProperties | undefined;
+    }[];
+    checked: LabelledCheckboxProps;
+    error: LabelledCheckboxProps;
+};
+export default CheckboxArgs;

package/lib/types/react/src/components/Checkbox/Checkbox.d.ts

@@ -1,4 +1,6 @@
-import { FC } from "react";
+import React from "react";
 import { CheckboxProps } from "./Checkbox.props";
-declare const Checkbox: FC<CheckboxProps>;
-export default Checkbox;
+declare const LabelledCheckbox: React.ForwardRefExoticComponent<CheckboxProps & import("../FormControl/FormControl.props").FormControlPublicProps & {
+    inputStyle?: React.CSSProperties | undefined;
+} & React.RefAttributes<HTMLInputElement>>;
+export default LabelledCheckbox;

package/lib/types/react/src/components/Checkbox/Checkbox.props.d.ts

@@ -1,13 +1,4 @@
-export interface CheckboxProps {
-    callback?: (e: React.ChangeEvent<HTMLInputElement>) => any;
-    className?: string;
-    disabled?: boolean;
-    error?: string | false;
-    grouped?: boolean;
-    helper?: string;
-    id?: string;
-    label?: string;
-    name: string;
-    required?: boolean;
-    tooltip?: string;
-}
+import { ChoiceFieldProps } from "../../types";
+import { LabelledFormFieldProps } from "../../types";
+export type CheckboxProps = ChoiceFieldProps<HTMLInputElement>;
+export type LabelledCheckboxProps = LabelledFormFieldProps<CheckboxProps>;

package/lib/types/react/src/components/Checkbox/index.d.ts

@@ -1 +1,2 @@
 export { default as Checkbox } from "./Checkbox";
+export { default as CheckboxArgs } from "./Checkbox.args";

package/lib/types/react/src/components/DatePicker/DatePicker.d.ts

@@ -1,4 +1,5 @@
-import { FC } from "react";
 import { DatePickerProps } from "./DatePicker.props";
-declare const DatePicker: FC<DatePickerProps>;
-export default DatePicker;
+declare const LabelledDatePicker: import("react").ForwardRefExoticComponent<DatePickerProps & import("../FormControl/FormControl.props").FormControlPublicProps & {
+    inputStyle?: import("react").CSSProperties | undefined;
+} & import("react").RefAttributes<HTMLInputElement>>;
+export default LabelledDatePicker;

package/lib/types/react/src/components/DatePicker/DatePicker.props.d.ts

@@ -1,54 +1,21 @@
-export interface DatePickerProps {
+import { FormFieldProps } from "../../types";
+import { LabelledFormFieldProps } from "../../types";
+export interface DatePickerProps extends FormFieldProps<HTMLInputElement> {
     /**
-     * The input's onChange callback.
+     * The latest date to accept
      */
-    callback?: (e: React.ChangeEvent<HTMLInputElement>, picker?: string) => any;
+    max?: string | number;
     /**
-     * Specify an optional className to be added to your input.
+     * The earliest date to accept.
      */
-    className?: string;
+    min?: string | number;
     /**
-     * Is the input disabled?
+     * The granularity of the date picker
      */
-    disabled?: boolean;
-    /**
-     * If this is a range, the data for the second field
-     */
-    enddata?: DatePickerProps;
-    /**
-     * Does the input have an error?
-     */
-    error?: string | false;
-    /**
-     * The input's helper text
-     */
-    helper: string | false;
-    /**
-     * The input's id attribute
-     */
-    id?: string;
-    /**
-     * Does this input have a label?
-     */
-    label: string;
-    /**
-     * The input's name attribute
-     */
-    name?: Required<string>;
+    step?: number;
     /**
      * Specify an optional className to be added to your DatePicker component.
      */
     placeholder?: string;
-    /**
-     * Specify whether this is a date range
-     */
-    range?: boolean;
-    /**
-     * Specify whether this input is required
-     */
-    required?: boolean;
-    /**
-     * Does this DatePicker have a tooltip?
-     */
-    tooltip?: string;
 }
+export type LabelledDatePickerProps = LabelledFormFieldProps<DatePickerProps>;

package/lib/types/react/src/components/Dropdown/Dropdown.d.ts

@@ -1,4 +1,6 @@
-import { FC } from "react";
+import React from "react";
 import { DropdownProps } from "./Dropdown.props";
-declare const Dropdown: FC<DropdownProps>;
-export default Dropdown;
+declare const LabelledDropdown: React.ForwardRefExoticComponent<DropdownProps & import("../FormControl/FormControl.props").FormControlPublicProps & {
+    inputStyle?: React.CSSProperties | undefined;
+} & React.RefAttributes<HTMLSelectElement>>;
+export default LabelledDropdown;

package/lib/types/react/src/components/Dropdown/Dropdown.props.d.ts

@@ -1,3 +1,5 @@
+import { FormFieldProps } from "../../types";
+import { LabelledFormFieldProps } from "../../types";
 export interface OptionProps {
     /**
      * Is this option disabled?
@@ -6,64 +8,36 @@ export interface OptionProps {
     /**
      * The option's label
      */
-    label: Required<string>;
+    label: string;
     /**
      * The option's value
      */
-    value?: Required<string>;
+    value?: string;
 }
-export interface DropdownProps {
+export interface DropdownProps extends FormFieldProps<HTMLSelectElement> {
     /**
-     * Should the Dropdown allow default browser autocomplete functionality?
-     * Ideally this would be boolean but for some reason React expects a string. So: "true" if true.
+     * A string providing a hint for a user agent's autocomplete feature.
      */
-    autocomplete: string;
+    autocomplete?: string;
     /**
-     * The Dropdown's onChange callback.
+     * The form element to associate the Dropdown with if it's not nested in a form element.
      */
-    callback?: (e: React.ChangeEvent<HTMLSelectElement>) => any;
+    form?: string;
     /**
-     * Specify an optional className to be added to your Profile component.
+     * Indicates that multiple options can be selected from the list.
      */
-    className?: string;
-    /**
-     * Is the Dropdown disabled?
-     */
-    disabled?: boolean;
-    /**
-     * Does the Dropdown have an error?
-     */
-    error?: string | false;
-    /**
-     * The Dropdown's helper text
-     */
-    helper: string | false;
-    /**
-     * The Dropdown's id attribute
-     */
-    id?: string;
-    /**
-     * The Dropdown's label
-     */
-    label: string;
-    /**
-     * The Dropdown's name attribute
-     */
-    name?: Required<string>;
+    multiple?: boolean;
     /**
      * The Dropdown's options
      */
-    options?: Required<Array<OptionProps>>;
-    /**
-     * Is a selection required?
-     */
-    required?: boolean;
+    options?: OptionProps[];
     /**
-     * Does this Dropdown have a tooltip?
+     * Number of rows in the list that should be visible at one time. Corresponds to the select element's size attribute.
      */
-    tooltip?: string;
+    selectSize?: number;
     /**
      * The Dropdown's default selection; should match one of the values in `options`
      */
-    value: string;
+    value?: string;
 }
+export type LabelledDropdownProps = LabelledFormFieldProps<DropdownProps>;

package/lib/types/react/src/components/Fieldset/Fieldset.d.ts

@@ -1,4 +1,10 @@
 import { FC } from "react";
 import { FieldsetProps } from "./Fieldset.props";
+type FieldsetContextType = {
+    hasError: boolean;
+    setHasError: (value: boolean) => void;
+};
+export declare const FieldsetErrorContext: import("react").Context<FieldsetContextType>;
+export declare const useFieldsetError: () => FieldsetContextType;
 declare const Fieldset: FC<FieldsetProps>;
 export default Fieldset;

package/lib/types/react/src/components/Fieldset/Fieldset.props.d.ts

@@ -1,34 +1,27 @@
-import { ReactElement } from "react";
-import { InputProps } from "../Input/Input.props";
-import { TextareaProps } from "../Textarea/Textarea.props";
-export type FieldsetChild = ReactElement<InputProps | TextareaProps>;
-export interface FieldsetProps {
+import { HTMLProps } from "react";
+export interface FieldsetProps extends HTMLProps<HTMLFieldSetElement> {
     /**
-     * Specify the content of your Fieldset.
-     */
-    children: (null | false | FieldsetChild) | (null | false | FieldsetChild)[];
-    /**
-     * Specify an optional className to be added to your Fieldset component.
-     */
-    className?: string;
-    /**
-     * The fieldset's id
+     * Optional helper text for the fieldset
      */
-    fieldsetid?: string;
+    helper?: string;
     /**
      * Optional error text for the fieldset
      */
-    grouperror?: string;
-    /**
-     * Optional helper text for the fieldset
-     */
-    grouphelper?: string;
+    errorMessage?: string;
     /**
      * Optional tooltip text for the fieldset
      */
-    grouptooltip?: string;
+    tooltip?: string;
     /**
      * The fieldset's legend
      */
     legend?: string;
+    /**
+     * The direction of the Fieldset's children
+     */
+    direction?: "row" | "column" | "row-reverse" | "column-reverse";
+    /**
+     * How the Fieldset children will wrap
+     */
+    wrap?: "reverse" | "nowrap" | "wrap" | "wrap-reverse";
 }

package/lib/types/react/src/components/FileUpload/FileUpload.d.ts

@@ -1,4 +1,6 @@
-import { FC } from "react";
+import React from "react";
 import { FileUploadProps } from "./FileUpload.props";
-declare const FileUpload: FC<FileUploadProps>;
-export default FileUpload;
+declare const LabelledFileUpload: React.ForwardRefExoticComponent<FileUploadProps & import("../FormControl/FormControl.props").FormControlPublicProps & {
+    inputStyle?: React.CSSProperties | undefined;
+} & React.RefAttributes<HTMLInputElement>>;
+export default LabelledFileUpload;

package/lib/types/react/src/components/FileUpload/FileUpload.props.d.ts

@@ -1,50 +1,13 @@
-export interface FileUploadProps {
+import { FormFieldProps } from "../../types";
+import { LabelledFormFieldProps } from "../../types";
+export interface FileUploadProps extends FormFieldProps<HTMLInputElement> {
     /**
-     * The FileUpload's onChange callback.
-     */
-    callback?: (e: React.ChangeEvent<HTMLInputElement>) => any;
-    /**
-     * Specify an optional className to be added to your FileUpload.
-     */
-    className?: string;
-    /**
-     * Is the FileUpload disabled?
-     */
-    disabled?: boolean;
-    /**
-     * Does the FileUpload have an error?
-     */
-    error?: string | false;
-    /**
-     * The FileUpload's helper text
-     */
-    helper: string | false;
-    /**
-     * The FileUpload's id attribute
-     */
-    id?: string;
-    /**
-     * Does this FileUpload have a label?
-     */
-    label: string;
-    /**
-     * Should the FileUpload allow multiple uploads?
-     */
-    multiple?: boolean;
-    /**
-     * The FileUpload's name attribute
-     */
-    name?: Required<string>;
-    /**
-     * Specify an optional className to be added to your FileUpload component.
+     * The placeholder for the input
      */
     placeholder?: string;
     /**
-     * Specify whether this FileUpload is required
+     * Can the user upload more than one file?
      */
-    required?: boolean;
-    /**
-     * Does this FileUpload have a tooltip?
-     */
-    tooltip?: string;
+    multiple?: boolean;
 }
+export type LabelledFileUploadProps = LabelledFormFieldProps<FileUploadProps>;

package/lib/types/react/src/components/Form/Form.args.d.ts

@@ -0,0 +1,2 @@
+import { FormProps } from "./Form.props";
+export declare const basic: FormProps;

package/lib/types/react/src/components/Form/Form.d.ts

@@ -1,4 +1,3 @@
-import { FC } from "react";
 import { FormProps } from "./Form.props";
-declare const Form: FC<FormProps>;
+declare const Form: import("react").ForwardRefExoticComponent<FormProps & import("react").RefAttributes<HTMLFormElement>>;
 export default Form;

package/lib/types/react/src/components/Form/Form.props.d.ts

@@ -1,114 +1,7 @@
-import { CheckboxProps } from "../Checkbox/Checkbox.props";
-import { DatePickerProps } from "../DatePicker/DatePicker.props";
-import { DropdownProps } from "../Dropdown/Dropdown.props";
-import { FileUploadProps } from "../FileUpload/FileUpload.props";
-import { NumberPickerProps } from "../NumberPicker/NumberPicker.props";
-import { RadioProps } from "../Radio/Radio.props";
-import { TextareaProps } from "../Textarea/Textarea.props";
-import { InputProps } from "../Input/Input.props";
-import { FormGroupProps } from "../FormGroup/FormGroup.props";
-export interface InputItem {
-    type: "input";
-    field: InputProps;
-    choicegroupid?: never;
-    legend?: never;
-    grouptooltip?: never;
-    grouperror?: never;
-    grouphelper?: never;
-}
-export interface DropdownItem {
-    type: "dropdown";
-    field: DropdownProps;
-    choicegroupid?: never;
-    legend?: never;
-    grouptooltip?: never;
-    grouperror?: never;
-    grouphelper?: never;
-}
-export interface CheckboxItem {
-    type: "checkbox";
-    field: CheckboxProps | CheckboxProps[];
-    choicegroupid: string;
-    legend?: string;
-    grouptooltip?: string;
-    grouperror?: string;
-    grouphelper?: string;
-}
-export interface RadioItem {
-    type: "radio";
-    field: RadioProps | RadioProps[];
-    choicegroupid: string;
-    legend?: string;
-    grouptooltip?: string;
-    grouperror?: string;
-    grouphelper?: string;
-}
-export interface FileUploadItem {
-    type: "file";
-    field: FileUploadProps;
-    choicegroupid?: never;
-    legend?: never;
-    grouptooltip?: never;
-    grouperror?: never;
-    grouphelper?: never;
-}
-export interface NumberPickerItem {
-    type: "number";
-    field: NumberPickerProps;
-    choicegroupid?: never;
-    legend?: never;
-    grouptooltip?: never;
-    grouperror?: never;
-    grouphelper?: never;
-}
-export interface DatePickerItem {
-    type: "date";
-    field: DatePickerProps;
-    choicegroupid?: never;
-    legend?: never;
-    grouptooltip?: never;
-    grouperror?: never;
-    grouphelper?: never;
-}
-export interface TextareaItem {
-    type: "textarea";
-    field: TextareaProps;
-    choicegroupid?: never;
-    legend?: never;
-    grouptooltip?: never;
-    grouperror?: never;
-    grouphelper?: never;
-}
-export interface FormGroupItem {
-    type: "formgroup";
-    field: FormGroupProps;
-    choicegroupid?: string;
-    legend?: string;
-    grouptooltip?: string;
-    grouperror?: string;
-    grouphelper?: string;
-}
-type FormItem = InputItem | DropdownItem | CheckboxItem | RadioItem | FileUploadItem | NumberPickerItem | DatePickerItem | TextareaItem | FormGroupItem;
-export interface FormProps {
-    /**
-     * The form's action attribute
-     */
-    action: Required<string>;
-    /**
-     * Specify an optional className to be added to your Form component.
-     */
-    className?: string;
-    /**
-     * The ID of the form
-     */
-    formid: Required<string>;
-    /**
-     * The inputs in this form group
-     */
-    items: FormItem[];
+export interface FormProps extends React.FormHTMLAttributes<HTMLFormElement> {
+    children?: React.ReactNode;
     /**
-     * The label for the form's submit button
+     * The theme of the form. Also sets the theme of the form's children.
      */
-    submitlabel: string;
+    theme?: "light" | "dark";
 }
-export {};

package/lib/types/react/src/components/Form/index.d.ts

@@ -1 +1,2 @@
 export { default as Form } from "./Form";
+export * as FormArgs from "./Form.args";