@bspk/ui 1.3.7 → 1.3.9

package/dist/components/Drawer/Drawer.d.ts

@@ -47,8 +47,8 @@ export type DrawerProps = Pick<DialogProps, 'container' | 'disableFocusTrap' | '
  *     import { Button } from '@bspk/ui/Button';
  *     import { Drawer } from '@bspk/ui/Drawer';
  *
- *     function Example() {
- *         const [open, setOpen] = React.useState(false);
+ *     () => {
+ *         const [open, setOpen] = useState(false);
  *
  *         return (
  *             <>
@@ -66,7 +66,7 @@ export type DrawerProps = Pick<DialogProps, 'container' | 'disableFocusTrap' | '
  *                 </Drawer>
  *             </>
  *         );
- *     }
+ *     };
  *
  * @name Drawer
  * @phase UXReview

package/dist/components/Drawer/Drawer.js

@@ -14,8 +14,8 @@ import { Txt } from '../Txt';
  *     import { Button } from '@bspk/ui/Button';
  *     import { Drawer } from '@bspk/ui/Drawer';
  *
- *     function Example() {
- *         const [open, setOpen] = React.useState(false);
+ *     () => {
+ *         const [open, setOpen] = useState(false);
  *
  *         return (
  *             <>
@@ -33,7 +33,7 @@ import { Txt } from '../Txt';
  *                 </Drawer>
  *             </>
  *         );
- *     }
+ *     };
  *
  * @name Drawer
  * @phase UXReview

package/dist/components/EmptyState/EmptyState.d.ts

@@ -35,13 +35,9 @@ export type EmptyStateProps = {
  * @example
  *     import { EmptyState } from '@bspk/ui/EmptyState';
  *
- *     function Example() {
- *         return (
- *             <EmptyState body="Example body" header="Example header">
- *                 Example EmptyState
- *             </EmptyState>
- *         );
- *     }
+ *     <EmptyState body="Example body" header="Example header">
+ *         Example EmptyState
+ *     </EmptyState>;
  *
  * @name EmptyState
  * @phase UXReview

package/dist/components/EmptyState/EmptyState.js

@@ -8,13 +8,9 @@ import { Txt } from '../Txt';
  * @example
  *     import { EmptyState } from '@bspk/ui/EmptyState';
  *
- *     function Example() {
- *         return (
- *             <EmptyState body="Example body" header="Example header">
- *                 Example EmptyState
- *             </EmptyState>
- *         );
- *     }
+ *     <EmptyState body="Example body" header="Example header">
+ *         Example EmptyState
+ *     </EmptyState>;
  *
  * @name EmptyState
  * @phase UXReview

package/dist/components/EmptyState/EmptyState.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.js","sourceRoot":"","sources":["../../../src/components/EmptyState/EmptyState.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAiCvC;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,YAAY,EAAE,SAAS,GAAG,QAAQ,EAAmB;IACtG,OAAO,CACH,MAAC,MAAM,IACH,KAAK,EAAC,QAAQ,EACd,MAAM,qBACI,aAAa,EACvB,KAAK,EAAE;YACH,MAAM,EAAE,0BAA0B;YAClC,QAAQ,EAAE,OAAO;SACpB,aAEA,QAAQ,EACT,MAAC,MAAM,IAAC,KAAK,EAAC,QAAQ,EAAC,MAAM,QAAC,GAAG,EAAC,GAAG,aACjC,KAAC,GAAG,IAAC,EAAE,EAAC,QAAQ,EAAC,OAAO,EAAC,YAAY,YAChC,MAAM,GACL,EACN,KAAC,GAAG,IAAC,EAAE,EAAC,GAAG,EAAC,KAAK,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,OAAO,EAAC,WAAW,YAC3D,IAAI,GACH,IACD,EACR,YAAY,IAAI,CACb,KAAC,MAAM,IACH,KAAK,EAAE,YAAY,CAAC,KAAK,EACzB,OAAO,EAAE,YAAY,CAAC,OAAO,EAC7B,IAAI,EAAE,YAAY,CAAC,IAAI,IAAI,QAAQ,EACnC,OAAO,EAAC,SAAS,GACnB,CACL,IACI,CACZ,CAAC;AACN,CAAC"}
+{"version":3,"file":"EmptyState.js","sourceRoot":"","sources":["../../../src/components/EmptyState/EmptyState.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAiCvC;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,YAAY,EAAE,SAAS,GAAG,QAAQ,EAAmB;IACtG,OAAO,CACH,MAAC,MAAM,IACH,KAAK,EAAC,QAAQ,EACd,MAAM,qBACI,aAAa,EACvB,KAAK,EAAE;YACH,MAAM,EAAE,0BAA0B;YAClC,QAAQ,EAAE,OAAO;SACpB,aAEA,QAAQ,EACT,MAAC,MAAM,IAAC,KAAK,EAAC,QAAQ,EAAC,MAAM,QAAC,GAAG,EAAC,GAAG,aACjC,KAAC,GAAG,IAAC,EAAE,EAAC,QAAQ,EAAC,OAAO,EAAC,YAAY,YAChC,MAAM,GACL,EACN,KAAC,GAAG,IAAC,EAAE,EAAC,GAAG,EAAC,KAAK,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,OAAO,EAAC,WAAW,YAC3D,IAAI,GACH,IACD,EACR,YAAY,IAAI,CACb,KAAC,MAAM,IACH,KAAK,EAAE,YAAY,CAAC,KAAK,EACzB,OAAO,EAAE,YAAY,CAAC,OAAO,EAC7B,IAAI,EAAE,YAAY,CAAC,IAAI,IAAI,QAAQ,EACnC,OAAO,EAAC,SAAS,GACnB,CACL,IACI,CACZ,CAAC;AACN,CAAC"}

package/dist/components/Fab/Fab.d.ts

@@ -2,14 +2,15 @@ import './fab.scss';
 import { AriaAttributes, ElementType } from 'react';
 import { ButtonProps } from '-/components/Button';
 import { ElementProps } from '-/types/common';
+export type FabSize = 'medium' | 'small';
 export type FabVariant = 'neutral' | 'primary' | 'secondary';
-export type FabProps<As extends ElementType = ElementType> = Pick<ButtonProps<As>, 'as' | 'icon' | 'iconOnly' | 'onClick' | 'toolTip'> & Required<Pick<ButtonProps<As>, 'label'>> & {
+export type FabProps<As extends ElementType = ElementType> = Pick<ButtonProps<As>, 'as' | 'icon' | 'iconOnly' | 'innerRef' | 'onClick' | 'toolTip'> & Required<Pick<ButtonProps<As>, 'label'>> & {
     /**
      * The size of the button.
      *
      * @default small
      */
-    size?: 'medium' | 'small';
+    size?: FabSize;
     /**
      * The style variant of the button.
      *
@@ -37,9 +38,7 @@ export type FabProps<As extends ElementType = ElementType> = Pick<ButtonProps<As
  *     import { SvgBolt } from '@bspk/icons/Bolt';
  *     import { Fab } from '@bspk/ui/Fab';
  *
- *     function Example() {
- *         return <Fab icon={<SvgBolt />} label="Example label" placement="bottom-right" variant="neutral" />;
- *     }
+ *     <Fab icon={<SvgBolt />} label="Example label" placement="bottom-right" variant="neutral" />;
  *
  * @name Fab
  * @phase UXReview

package/dist/components/Fab/Fab.js

@@ -10,18 +10,16 @@ import { Tooltip } from '../Tooltip';
  *     import { SvgBolt } from '@bspk/icons/Bolt';
  *     import { Fab } from '@bspk/ui/Fab';
  *
- *     function Example() {
- *         return <Fab icon={<SvgBolt />} label="Example label" placement="bottom-right" variant="neutral" />;
- *     }
+ *     <Fab icon={<SvgBolt />} label="Example label" placement="bottom-right" variant="neutral" />;
  *
  * @name Fab
  * @phase UXReview
  */
 export function Fab(props) {
-    const { size = 'small', variant = 'primary', iconOnly: iconOnlyProp = false, as: As = 'button', placement = 'bottom-right', container = 'local', label, icon, toolTip, ...otherProps } = props;
+    const { size = 'small', variant = 'primary', iconOnly: iconOnlyProp = false, as: As = 'button', placement = 'bottom-right', container = 'local', label, icon, toolTip, innerRef, ...otherProps } = props;
     // ignore iconOnly=true if there is no icon
     const iconOnly = iconOnlyProp === true && !!icon;
-    const button = (triggerProps) => (_jsxs(As, { ...otherProps, ...triggerProps, "aria-label": label, "data-bspk": "fab", "data-container": container, "data-placement": placement, "data-round": iconOnly || undefined, "data-size": size, "data-variant": variant, onBlur: (e) => {
+    const button = (triggerProps) => (_jsxs(As, { ...otherProps, ...triggerProps, "aria-label": label, "data-bspk": "fab", "data-container": container, "data-placement": placement, "data-position": container === 'page' ? 'fixed' : 'absolute', "data-round": iconOnly || undefined, "data-size": size, "data-variant": variant, onBlur: (e) => {
             triggerProps.onBlur?.();
             otherProps.onBlur?.(e);
         }, onFocus: (e) => {
@@ -33,7 +31,7 @@ export function Fab(props) {
         }, onMouseOver: (e) => {
             triggerProps.onMouseOver?.();
             otherProps.onMouseOver?.(e);
-        }, children: [!!icon && isValidElement(icon) && (_jsx("span", { "aria-hidden": true, "data-fab-icon": true, children: icon })), !iconOnly && _jsx("span", { "data-fab-label": true, children: label })] }));
+        }, ref: innerRef, children: [!!icon && isValidElement(icon) && (_jsx("span", { "aria-hidden": true, "data-fab-icon": true, children: icon })), !iconOnly && _jsx("span", { "data-fab-label": true, children: label })] }));
     if (toolTip || iconOnly)
         return (_jsx(Tooltip, { label: toolTip || label, placement: "top", children: button }));
     return button({});

package/dist/components/Fab/Fab.js.map

@@ -1 +1 @@
-{"version":3,"file":"Fab.js","sourceRoot":"","sources":["../../../src/components/Fab/Fab.tsx"],"names":[],"mappings":";AAAA,OAAO,YAAY,CAAC;AACpB,OAAO,EAA+B,cAAc,EAAE,MAAM,OAAO,CAAC;AAEpE,OAAO,EAAE,OAAO,EAAuB,MAAM,sBAAsB,CAAC;AAoCpE;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,GAAG,CAAuC,KAAsD;IAC5G,MAAM,EACF,IAAI,GAAG,OAAO,EACd,OAAO,GAAG,SAAS,EACnB,QAAQ,EAAE,YAAY,GAAG,KAAK,EAC9B,EAAE,EAAE,EAAE,GAAG,QAAQ,EACjB,SAAS,GAAG,cAAc,EAC1B,SAAS,GAAG,OAAO,EACnB,KAAK,EACL,IAAI,EACJ,OAAO,EACP,GAAG,UAAU,EAChB,GAAG,KAAK,CAAC;IAEV,2CAA2C;IAC3C,MAAM,QAAQ,GAAG,YAAY,KAAK,IAAI,IAAI,CAAC,CAAC,IAAI,CAAC;IAEjD,MAAM,MAAM,GAAG,CAAC,YAAiC,EAAE,EAAE,CAAC,CAClD,MAAC,EAAE,OACK,UAAU,KACV,YAAY,gBACJ,KAAK,eACP,KAAK,oBACC,SAAS,oBACT,SAAS,gBACb,QAAQ,IAAI,SAAS,eACtB,IAAI,kBACD,OAAO,EACrB,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE;YACV,YAAY,CAAC,MAAM,EAAE,EAAE,CAAC;YACxB,UAAU,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC;QAC3B,CAAC,EACD,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;YACX,YAAY,CAAC,OAAO,EAAE,EAAE,CAAC;YACzB,UAAU,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;QAC5B,CAAC,EACD,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YAChB,YAAY,CAAC,YAAY,EAAE,EAAE,CAAC;YAC9B,UAAU,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;QACjC,CAAC,EACD,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE;YACf,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC;YAC7B,UAAU,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC;QAChC,CAAC,aAEA,CAAC,CAAC,IAAI,IAAI,cAAc,CAAC,IAAI,CAAC,IAAI,CAC/B,8BAAmB,IAAI,mCAClB,IAAI,GACF,CACV,EACA,CAAC,QAAQ,IAAI,iDAAsB,KAAK,GAAQ,IAChD,CACR,CAAC;IAEF,IAAI,OAAO,IAAI,QAAQ;QACnB,OAAO,CACH,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,IAAI,KAAK,EAAE,SAAS,EAAC,KAAK,YAC5C,MAAM,GACD,CACb,CAAC;IAEN,OAAO,MAAM,CAAC,EAAE,CAAC,CAAC;AACtB,CAAC"}
+{"version":3,"file":"Fab.js","sourceRoot":"","sources":["../../../src/components/Fab/Fab.tsx"],"names":[],"mappings":";AAAA,OAAO,YAAY,CAAC;AACpB,OAAO,EAA+B,cAAc,EAAE,MAAM,OAAO,CAAC;AAEpE,OAAO,EAAE,OAAO,EAAuB,MAAM,sBAAsB,CAAC;AAsCpE;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,GAAG,CAAuC,KAAsD;IAC5G,MAAM,EACF,IAAI,GAAG,OAAO,EACd,OAAO,GAAG,SAAS,EACnB,QAAQ,EAAE,YAAY,GAAG,KAAK,EAC9B,EAAE,EAAE,EAAE,GAAG,QAAQ,EACjB,SAAS,GAAG,cAAc,EAC1B,SAAS,GAAG,OAAO,EACnB,KAAK,EACL,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,GAAG,UAAU,EAChB,GAAG,KAAK,CAAC;IAEV,2CAA2C;IAC3C,MAAM,QAAQ,GAAG,YAAY,KAAK,IAAI,IAAI,CAAC,CAAC,IAAI,CAAC;IAEjD,MAAM,MAAM,GAAG,CAAC,YAAiC,EAAE,EAAE,CAAC,CAClD,MAAC,EAAE,OACK,UAAU,KACV,YAAY,gBACJ,KAAK,eACP,KAAK,oBACC,SAAS,oBACT,SAAS,mBACV,SAAS,KAAK,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,gBAC9C,QAAQ,IAAI,SAAS,eACtB,IAAI,kBACD,OAAO,EACrB,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE;YACV,YAAY,CAAC,MAAM,EAAE,EAAE,CAAC;YACxB,UAAU,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC;QAC3B,CAAC,EACD,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;YACX,YAAY,CAAC,OAAO,EAAE,EAAE,CAAC;YACzB,UAAU,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;QAC5B,CAAC,EACD,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YAChB,YAAY,CAAC,YAAY,EAAE,EAAE,CAAC;YAC9B,UAAU,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;QACjC,CAAC,EACD,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE;YACf,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC;YAC7B,UAAU,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC;QAChC,CAAC,EACD,GAAG,EAAE,QAAQ,aAEZ,CAAC,CAAC,IAAI,IAAI,cAAc,CAAC,IAAI,CAAC,IAAI,CAC/B,8BAAmB,IAAI,mCAClB,IAAI,GACF,CACV,EACA,CAAC,QAAQ,IAAI,iDAAsB,KAAK,GAAQ,IAChD,CACR,CAAC;IAEF,IAAI,OAAO,IAAI,QAAQ;QACnB,OAAO,CACH,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,IAAI,KAAK,EAAE,SAAS,EAAC,KAAK,YAC5C,MAAM,GACD,CACb,CAAC;IAEN,OAAO,MAAM,CAAC,EAAE,CAAC,CAAC;AACtB,CAAC"}

package/dist/components/Fab/FabExample.d.ts

@@ -1,3 +1,4 @@
+import { FabProps } from './Fab';
 import { ComponentExample } from '-/utils/demo';
 export declare const presets: import("-/utils/demo").Preset<import("../Button").ButtonProps>[];
-export declare const FabExample: ComponentExample;
+export declare const FabExample: ComponentExample<FabProps>;

package/dist/components/Fab/FabExample.js

@@ -2,7 +2,25 @@ import { ButtonExample } from '../Button/ButtonExample';
 export const presets = ButtonExample.presets || [];
 export const FabExample = {
     containerStyle: { display: 'block', height: '152px', width: '100%' },
-    presets,
-    variants: false,
+    presets: ButtonExample.presets?.map((preset) => ({
+        ...preset,
+        propState: {
+            ...preset.propState,
+            size: undefined,
+            variant: undefined,
+        },
+    })),
+    defaultState: {
+        container: 'local',
+        placement: 'bottom-right',
+    },
+    variants: {
+        container: false,
+        placement: false,
+        iconOnly: {
+            icon: 'MenuBook',
+            label: 'Menu Book',
+        },
+    },
 };
 //# sourceMappingURL=FabExample.js.map

package/dist/components/Fab/FabExample.js.map

@@ -1 +1 @@
-{"version":3,"file":"FabExample.js","sourceRoot":"","sources":["../../../src/components/Fab/FabExample.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAGlE,MAAM,CAAC,MAAM,OAAO,GAAG,aAAa,CAAC,OAAO,IAAI,EAAE,CAAC;AAEnD,MAAM,CAAC,MAAM,UAAU,GAAqB;IACxC,cAAc,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE;IACpE,OAAO;IACP,QAAQ,EAAE,KAAK;CAClB,CAAC"}
+{"version":3,"file":"FabExample.js","sourceRoot":"","sources":["../../../src/components/Fab/FabExample.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAGlE,MAAM,CAAC,MAAM,OAAO,GAAG,aAAa,CAAC,OAAO,IAAI,EAAE,CAAC;AAEnD,MAAM,CAAC,MAAM,UAAU,GAA+B;IAClD,cAAc,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE;IACpE,OAAO,EAAE,aAAa,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;QAC7C,GAAG,MAAM;QACT,SAAS,EAAE;YACP,GAAG,MAAM,CAAC,SAAS;YACnB,IAAI,EAAE,SAAS;YACf,OAAO,EAAE,SAAS;SACrB;KACJ,CAAC,CAAC;IACH,YAAY,EAAE;QACV,SAAS,EAAE,OAAO;QAClB,SAAS,EAAE,cAAc;KAC5B;IACD,QAAQ,EAAE;QACN,SAAS,EAAE,KAAK;QAChB,SAAS,EAAE,KAAK;QAChB,QAAQ,EAAE;YACN,IAAI,EAAE,UAAU;YAChB,KAAK,EAAE,WAAW;SACrB;KACJ;CACJ,CAAC"}

package/dist/components/Field/Field.d.ts

@@ -29,9 +29,9 @@ export type FieldProps<As extends ElementType = ElementType> = {
  *     import { Input } from '@bspk/ui/Input';
  *     import { Field, FieldLabel, FieldDescription, FieldError } from '@bspk/ui/Field';
  *
- *     function Example() {
- *         const [state, setState] = React.useState<string | undefined>(undefined);
- *         const [error, setError] = React.useState<string | undefined>(undefined);
+ *     () => {
+ *         const [state, setState] = useState<string | undefined>(undefined);
+ *         const [error, setError] = useState<string | undefined>(undefined);
  *
  *         return (
  *             <Field label="Example label">
@@ -43,13 +43,12 @@ export type FieldProps<As extends ElementType = ElementType> = {
  *                         setState(next);
  *                     }}
  *                     value={state}
- *                     {...fieldProps}
  *                 />
  *                 <FieldDescription>This is an example description.</FieldDescription>
  *                 {error && <FieldError>{error}</FieldError>}
  *             </Field>
  *         );
- *     }
+ *     };
  *
  * @name Field
  * @phase Utility

package/dist/components/Field/Field.js

@@ -17,9 +17,9 @@ const isComponentName = (child, name) => {
  *     import { Input } from '@bspk/ui/Input';
  *     import { Field, FieldLabel, FieldDescription, FieldError } from '@bspk/ui/Field';
  *
- *     function Example() {
- *         const [state, setState] = React.useState<string | undefined>(undefined);
- *         const [error, setError] = React.useState<string | undefined>(undefined);
+ *     () => {
+ *         const [state, setState] = useState<string | undefined>(undefined);
+ *         const [error, setError] = useState<string | undefined>(undefined);
  *
  *         return (
  *             <Field label="Example label">
@@ -31,13 +31,12 @@ const isComponentName = (child, name) => {
  *                         setState(next);
  *                     }}
  *                     value={state}
- *                     {...fieldProps}
  *                 />
  *                 <FieldDescription>This is an example description.</FieldDescription>
  *                 {error && <FieldError>{error}</FieldError>}
  *             </Field>
  *         );
- *     }
+ *     };
  *
  * @name Field
  * @phase Utility

package/dist/components/Field/Field.js.map

@@ -1 +1 @@
-{"version":3,"file":"Field.js","sourceRoot":"","sources":["../../../src/components/Field/Field.tsx"],"names":[],"mappings":";AAAA,OAAO,cAAc,CAAC;AACtB,OAAO,EAAE,QAAQ,EAAe,cAAc,EAAa,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5F,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,YAAY,EAAgB,YAAY,EAAE,MAAM,SAAS,CAAC;AAElG,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAqB9C,MAAM,eAAe,GAAG,CACpB,KAAqG,EACrG,IAAY,EACd,EAAE;IACA,MAAM,aAAa,GAAG,KAAK,CAAC,IAA+C,CAAC;IAC5E,OAAO,aAAa,CAAC,WAAW,KAAK,IAAI,IAAI,aAAa,CAAC,IAAI,KAAK,IAAI,CAAC;AAC7E,CAAC,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,MAAM,UAAU,KAAK,CAAuC,EACxD,QAAQ,EACR,EAAE,EACF,EAAE,EAAE,MAAM,EACV,GAAG,KAAK,EACuB;IAC/B,MAAM,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,MAAM,IAAI,SAAS,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEzE,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE;QAC9B,MAAM,IAAI,GAAkF,EAAE,CAAC;QAC/F,QAAQ,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YACjC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ;gBAAE,OAAO;YAE9F,IAAI,eAAe,CAAC,KAAK,EAAE,YAAY,CAAC;gBAAE,IAAI,CAAC,gBAAgB,GAAG,cAAc,CAAC,EAAE,CAAC,CAAC;iBAChF,IAAI,eAAe,CAAC,KAAK,EAAE,YAAY,CAAC;gBAAE,IAAI,CAAC,cAAc,GAAG,YAAY,CAAC,EAAE,CAAC,CAAC;iBACjF,IAAI,eAAe,CAAC,KAAK,EAAE,kBAAkB,CAAC;gBAAE,IAAI,CAAC,eAAe,GAAG,aAAa,CAAC,EAAE,CAAC,CAAC;QAClG,CAAC,CAAC,CAAC;QACH,OAAO,IAAI,CAAC;IAChB,CAAC,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,CAAC;IAEnB,MAAM,CAAC,YAAY,EAAE,UAAU,CAAC,GAAG,QAAQ,CAA6C,EAAE,CAAC,CAAC;IAE5F,MAAM,EAAE,GAAG,EAAE,IAAI,KAAK,CAAC;IAEvB,OAAO,CACH,KAAC,YAAY,CAAC,QAAQ,IAClB,KAAK,EAAE;YACH,GAAG,YAAY;YACf,GAAG,YAAY;YACf,EAAE;YACF,UAAU;SACb,YAED,KAAC,EAAE,OAAK,KAAK,uBAAoB,OAAO,EAAC,EAAE,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,YACxD,QAAQ,GACR,GACe,CAC3B,CAAC;AACN,CAAC"}
+{"version":3,"file":"Field.js","sourceRoot":"","sources":["../../../src/components/Field/Field.tsx"],"names":[],"mappings":";AAAA,OAAO,cAAc,CAAC;AACtB,OAAO,EAAE,QAAQ,EAAe,cAAc,EAAa,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5F,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,YAAY,EAAgB,YAAY,EAAE,MAAM,SAAS,CAAC;AAElG,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAqB9C,MAAM,eAAe,GAAG,CACpB,KAAqG,EACrG,IAAY,EACd,EAAE;IACA,MAAM,aAAa,GAAG,KAAK,CAAC,IAA+C,CAAC;IAC5E,OAAO,aAAa,CAAC,WAAW,KAAK,IAAI,IAAI,aAAa,CAAC,IAAI,KAAK,IAAI,CAAC;AAC7E,CAAC,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,MAAM,UAAU,KAAK,CAAuC,EACxD,QAAQ,EACR,EAAE,EACF,EAAE,EAAE,MAAM,EACV,GAAG,KAAK,EACuB;IAC/B,MAAM,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,MAAM,IAAI,SAAS,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEzE,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE;QAC9B,MAAM,IAAI,GAAkF,EAAE,CAAC;QAC/F,QAAQ,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YACjC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ;gBAAE,OAAO;YAE9F,IAAI,eAAe,CAAC,KAAK,EAAE,YAAY,CAAC;gBAAE,IAAI,CAAC,gBAAgB,GAAG,cAAc,CAAC,EAAE,CAAC,CAAC;iBAChF,IAAI,eAAe,CAAC,KAAK,EAAE,YAAY,CAAC;gBAAE,IAAI,CAAC,cAAc,GAAG,YAAY,CAAC,EAAE,CAAC,CAAC;iBACjF,IAAI,eAAe,CAAC,KAAK,EAAE,kBAAkB,CAAC;gBAAE,IAAI,CAAC,eAAe,GAAG,aAAa,CAAC,EAAE,CAAC,CAAC;QAClG,CAAC,CAAC,CAAC;QACH,OAAO,IAAI,CAAC;IAChB,CAAC,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,CAAC;IAEnB,MAAM,CAAC,YAAY,EAAE,UAAU,CAAC,GAAG,QAAQ,CAA6C,EAAE,CAAC,CAAC;IAE5F,MAAM,EAAE,GAAG,EAAE,IAAI,KAAK,CAAC;IAEvB,OAAO,CACH,KAAC,YAAY,CAAC,QAAQ,IAClB,KAAK,EAAE;YACH,GAAG,YAAY;YACf,GAAG,YAAY;YACf,EAAE;YACF,UAAU;SACb,YAED,KAAC,EAAE,OAAK,KAAK,uBAAoB,OAAO,EAAC,EAAE,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,YACxD,QAAQ,GACR,GACe,CAC3B,CAAC;AACN,CAAC"}

package/dist/components/FileUpload/FileUpload.d.ts

@@ -64,7 +64,7 @@ export type FileUploadProps = Pick<FileUploadItemProps, 'cancelButtonLabel' | 'o
  * @example
  *     import { FileUpload } from '@bspk/ui/FileUpload';
  *
- *     function Example() {
+ *     () => {
  *         const [files, setFiles] = useState([]);
  *         return (
  *             <FileUpload
@@ -73,12 +73,12 @@ export type FileUploadProps = Pick<FileUploadItemProps, 'cancelButtonLabel' | 'o
  *                 acceptedFileTypes={['image/png', 'image/gif', 'image/svg+xml']}
  *                 files={files}
  *                 maxFileSize={5}
- *                 onError={(errorFiles) => console.log('Upload error:', errorFiles)}
+ *                 onError={(errorFiles) => sendSnackbar('Upload error:', errorFiles)}
  *                 onUpload={(uploadFiles) => setFiles(uploadFiles)}
  *                 uploadSubtitle="SVG, PNG, JPG or GIF (max. 5MB)"
  *             />
  *         );
- *     }
+ *     };
  *
  * @name FileUpload
  * @phase UXReview

package/dist/components/FileUpload/FileUpload.js

@@ -15,7 +15,7 @@ const MB = 1048576;
  * @example
  *     import { FileUpload } from '@bspk/ui/FileUpload';
  *
- *     function Example() {
+ *     () => {
  *         const [files, setFiles] = useState([]);
  *         return (
  *             <FileUpload
@@ -24,12 +24,12 @@ const MB = 1048576;
  *                 acceptedFileTypes={['image/png', 'image/gif', 'image/svg+xml']}
  *                 files={files}
  *                 maxFileSize={5}
- *                 onError={(errorFiles) => console.log('Upload error:', errorFiles)}
+ *                 onError={(errorFiles) => sendSnackbar('Upload error:', errorFiles)}
  *                 onUpload={(uploadFiles) => setFiles(uploadFiles)}
  *                 uploadSubtitle="SVG, PNG, JPG or GIF (max. 5MB)"
  *             />
  *         );
- *     }
+ *     };
  *
  * @name FileUpload
  * @phase UXReview

package/dist/components/FileUploadItem/FileUploadItem.d.ts

@@ -22,16 +22,12 @@ export type FileUploadItemProps = FileEntry & {
  * @example
  *     import { FileUploadItem } from '@bspk/ui/FileUploadItem';
  *
- *     function Example() {
- *         return (
- *             <FileUploadItem
- *                 fileName="dunder-mifflin-paper-co.jpg"
- *                 fileSize="1.43 mb"
- *                 status="Uploading"
- *                 onCancel={() => console.log('Cancel item clicked!')}
- *             />
- *         );
- *     }
+ *     <FileUploadItem
+ *         fileName="dunder-mifflin-paper-co.jpg"
+ *         fileSize="1.43 mb"
+ *         status="Uploading"
+ *         onCancel={() => sendSnackbar('Cancel item clicked!')}
+ *     />;
  *
  * @name FileUploadItem
  * @phase UXReview

package/dist/components/FileUploadItem/FileUploadItem.js

@@ -15,16 +15,12 @@ import { DEFAULT_ERROR_MESSAGE } from '../../utils/fileUploads';
  * @example
  *     import { FileUploadItem } from '@bspk/ui/FileUploadItem';
  *
- *     function Example() {
- *         return (
- *             <FileUploadItem
- *                 fileName="dunder-mifflin-paper-co.jpg"
- *                 fileSize="1.43 mb"
- *                 status="Uploading"
- *                 onCancel={() => console.log('Cancel item clicked!')}
- *             />
- *         );
- *     }
+ *     <FileUploadItem
+ *         fileName="dunder-mifflin-paper-co.jpg"
+ *         fileSize="1.43 mb"
+ *         status="Uploading"
+ *         onCancel={() => sendSnackbar('Cancel item clicked!')}
+ *     />;
  *
  * @name FileUploadItem
  * @phase UXReview

package/dist/components/FileUploadItem/FileUploadItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileUploadItem.js","sourceRoot":"","sources":["../../../src/components/FileUploadItem/FileUploadItem.tsx"],"names":[],"mappings":";AAAA,OAAO,yBAAyB,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,qBAAqB,EAAa,MAAM,qBAAqB,CAAC;AAiBvE;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,cAAc,CAAC,EAC3B,QAAQ,GAAG,EAAE,EACb,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,iBAAiB,EAAE,eAAe,GAAG,QAAQ,EAC7C,QAAQ,GAAG,CAAC,EACZ,YAAY,GAAG,qBAAqB,GAClB;IAClB,MAAM,OAAO,GAAG,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAE/E,OAAO,CACH,4BAAe,kBAAkB,aAC7B,4CACI,2CACI,KAAC,QAAQ,KAAG,GACV,EACN,6CACI,KAAC,SAAS,sCAAiB,QAAQ,GAAa,EAChD,oDAAyB,OAAO,GAAQ,IACtC,EACN,KAAC,MAAM,IACH,IAAI,EAAE,KAAC,SAAS,KAAG,EACnB,QAAQ,QACR,KAAK,EAAE,eAAe,IAAI,QAAQ,EAClC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC,EACrC,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,GACpB,IACA,EACN,6CACK,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,CAClB,KAAC,WAAW,IAAC,OAAO,EAAC,OAAO,YAAE,YAAY,GAAe,CAC5D,CAAC,CAAC,CAAC,CACA,KAAC,WAAW,IACR,KAAK,EAAC,MAAM,EACZ,UAAU,EAAE,QAAQ,EACpB,KAAK,EAAE,GACH,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,yCAAyC;oBAC9F,GAAG,GACL,CACL,GACC,IACJ,CACT,CAAC;AACN,CAAC;AAED,MAAM,EAAE,GAAG,IAAI,CAAC;AAChB,MAAM,EAAE,GAAG,IAAI,GAAG,EAAE,CAAC;AACrB,MAAM,EAAE,GAAG,IAAI,GAAG,EAAE,CAAC;AAErB;;;;;;;;GAQG;AACH,SAAS,cAAc,CAAC,QAAiB;IACrC,IAAI,CAAC,QAAQ;QAAE,OAAO,cAAc,CAAC;IAErC,MAAM,UAAU,GAAG,QAAQ,GAAG,EAAE,CAAC,CAAC,sBAAsB;IAExD,MAAM,QAAQ,GAAG,CAAC,GAAW,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;IAE7D,IAAI,UAAU,GAAG,EAAE;QAAE,OAAO,GAAG,QAAQ,CAAC,UAAU,GAAG,EAAE,CAAC,KAAK,CAAC;IAC9D,IAAI,UAAU,GAAG,EAAE;QAAE,OAAO,GAAG,QAAQ,CAAC,UAAU,GAAG,EAAE,CAAC,KAAK,CAAC;IAC9D,OAAO,GAAG,QAAQ,CAAC,UAAU,GAAG,EAAE,CAAC,KAAK,CAAC;AAC7C,CAAC"}
+{"version":3,"file":"FileUploadItem.js","sourceRoot":"","sources":["../../../src/components/FileUploadItem/FileUploadItem.tsx"],"names":[],"mappings":";AAAA,OAAO,yBAAyB,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,qBAAqB,EAAa,MAAM,qBAAqB,CAAC;AAiBvE;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,UAAU,cAAc,CAAC,EAC3B,QAAQ,GAAG,EAAE,EACb,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,iBAAiB,EAAE,eAAe,GAAG,QAAQ,EAC7C,QAAQ,GAAG,CAAC,EACZ,YAAY,GAAG,qBAAqB,GAClB;IAClB,MAAM,OAAO,GAAG,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAE/E,OAAO,CACH,4BAAe,kBAAkB,aAC7B,4CACI,2CACI,KAAC,QAAQ,KAAG,GACV,EACN,6CACI,KAAC,SAAS,sCAAiB,QAAQ,GAAa,EAChD,oDAAyB,OAAO,GAAQ,IACtC,EACN,KAAC,MAAM,IACH,IAAI,EAAE,KAAC,SAAS,KAAG,EACnB,QAAQ,QACR,KAAK,EAAE,eAAe,IAAI,QAAQ,EAClC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC,EACrC,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,GACpB,IACA,EACN,6CACK,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,CAClB,KAAC,WAAW,IAAC,OAAO,EAAC,OAAO,YAAE,YAAY,GAAe,CAC5D,CAAC,CAAC,CAAC,CACA,KAAC,WAAW,IACR,KAAK,EAAC,MAAM,EACZ,UAAU,EAAE,QAAQ,EACpB,KAAK,EAAE,GACH,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,yCAAyC;oBAC9F,GAAG,GACL,CACL,GACC,IACJ,CACT,CAAC;AACN,CAAC;AAED,MAAM,EAAE,GAAG,IAAI,CAAC;AAChB,MAAM,EAAE,GAAG,IAAI,GAAG,EAAE,CAAC;AACrB,MAAM,EAAE,GAAG,IAAI,GAAG,EAAE,CAAC;AAErB;;;;;;;;GAQG;AACH,SAAS,cAAc,CAAC,QAAiB;IACrC,IAAI,CAAC,QAAQ;QAAE,OAAO,cAAc,CAAC;IAErC,MAAM,UAAU,GAAG,QAAQ,GAAG,EAAE,CAAC,CAAC,sBAAsB;IAExD,MAAM,QAAQ,GAAG,CAAC,GAAW,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;IAE7D,IAAI,UAAU,GAAG,EAAE;QAAE,OAAO,GAAG,QAAQ,CAAC,UAAU,GAAG,EAAE,CAAC,KAAK,CAAC;IAC9D,IAAI,UAAU,GAAG,EAAE;QAAE,OAAO,GAAG,QAAQ,CAAC,UAAU,GAAG,EAAE,CAAC,KAAK,CAAC;IAC9D,OAAO,GAAG,QAAQ,CAAC,UAAU,GAAG,EAAE,CAAC,KAAK,CAAC;AAC7C,CAAC"}

package/dist/components/FormField/FormField.d.ts

@@ -49,26 +49,15 @@ export type FormFieldProps<As extends ElementType = ElementType> = CommonProps<'
  *     import { Input } from '@bspk/ui/Input';
  *     import { FormField } from '@bspk/ui/FormField';
  *
- *     function Example() {
- *         const [state, setState] = React.useState<string | undefined>(undefined);
+ *     () => {
+ *         const [state, setState] = useState<string | undefined>(undefined);
+ *
  *         return (
  *             <FormField controlId="Example controlId" label="Example label">
- *                 {(fieldProps) => {
- *                     return (
- *                         <Input
- *                             aria-label="example aria-label"
- *                             name="example-text"
- *                             onChange={(next) => {
- *                                 setState(next);
- *                             }}
- *                             value={state}
- *                             {...fieldProps}
- *                         />
- *                     );
- *                 }}
+ *                 <Input name="example-text" onChange={(next) => setState(next)} value={state} />
  *             </FormField>
  *         );
- *     }
+ *     };
  *
  * @name FormField
  * @phase Utility

package/dist/components/FormField/FormField.js

@@ -10,26 +10,15 @@ import { Field, FieldLabel, FieldDescription, FieldError } from '../Field';
  *     import { Input } from '@bspk/ui/Input';
  *     import { FormField } from '@bspk/ui/FormField';
  *
- *     function Example() {
- *         const [state, setState] = React.useState<string | undefined>(undefined);
+ *     () => {
+ *         const [state, setState] = useState<string | undefined>(undefined);
+ *
  *         return (
  *             <FormField controlId="Example controlId" label="Example label">
- *                 {(fieldProps) => {
- *                     return (
- *                         <Input
- *                             aria-label="example aria-label"
- *                             name="example-text"
- *                             onChange={(next) => {
- *                                 setState(next);
- *                             }}
- *                             value={state}
- *                             {...fieldProps}
- *                         />
- *                     );
- *                 }}
+ *                 <Input name="example-text" onChange={(next) => setState(next)} value={state} />
  *             </FormField>
  *         );
- *     }
+ *     };
  *
  * @name FormField
  * @phase Utility

package/dist/components/FormField/FormField.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/FormField/FormField.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AA6CrF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,MAAM,UAAU,SAAS,CAAC,EACtB,KAAK,EACL,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,aAAa,EACb,QAAQ,EACR,EAAE,EACF,KAAK,GACQ;IACb,MAAM,OAAO,GAAG,EAAE,IAAI,KAAK,CAAC;IAE5B,MAAM,OAAO,GAAG,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC;IAC9D,OAAO,CACH,MAAC,KAAK,IAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,aAC5B,KAAC,UAAU,IAAC,EAAE,EAAE,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,YACpE,KAAK,GACG,EACZ,QAAQ,EACR,CAAC,YAAY,IAAI,UAAU,IAAI,KAAC,gBAAgB,cAAE,UAAU,GAAoB,EACjF,KAAC,UAAU,cAAE,YAAY,GAAc,IACnC,CACX,CAAC;AACN,CAAC"}
+{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/FormField/FormField.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AA6CrF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,UAAU,SAAS,CAAC,EACtB,KAAK,EACL,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,aAAa,EACb,QAAQ,EACR,EAAE,EACF,KAAK,GACQ;IACb,MAAM,OAAO,GAAG,EAAE,IAAI,KAAK,CAAC;IAE5B,MAAM,OAAO,GAAG,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC;IAC9D,OAAO,CACH,MAAC,KAAK,IAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,aAC5B,KAAC,UAAU,IAAC,EAAE,EAAE,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,YACpE,KAAK,GACG,EACZ,QAAQ,EACR,CAAC,YAAY,IAAI,UAAU,IAAI,KAAC,gBAAgB,cAAE,UAAU,GAAoB,EACjF,KAAC,UAAU,cAAE,YAAY,GAAc,IACnC,CACX,CAAC;AACN,CAAC"}

package/dist/components/Img/Img.d.ts

@@ -19,9 +19,7 @@ export type ImgProps = {
  * @example
  *     import { Img } from '@bspk/ui/Img';
  *
- *     function Example() {
- *         return <Img alt="Example alt" src="Example src" />;
- *     }
+ *     <Img alt="Example alt" src="Example src" />;
  *
  * @name Img
  * @phase Backlog

package/dist/components/Img/Img.js

@@ -5,9 +5,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * @example
  *     import { Img } from '@bspk/ui/Img';
  *
- *     function Example() {
- *         return <Img alt="Example alt" src="Example src" />;
- *     }
+ *     <Img alt="Example alt" src="Example src" />;
  *
  * @name Img
  * @phase Backlog

package/dist/components/Img/Img.js.map

@@ -1 +1 @@
-{"version":3,"file":"Img.js","sourceRoot":"","sources":["../../../src/components/Img/Img.tsx"],"names":[],"mappings":";AAiBA;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,KAAK,EAAiC;IAChE,OAAO,iBAAS,KAAK,EAAE,GAAG,EAAE,GAAG,eAAY,KAAK,GAAG,CAAC;AACxD,CAAC"}
+{"version":3,"file":"Img.js","sourceRoot":"","sources":["../../../src/components/Img/Img.tsx"],"names":[],"mappings":";AAiBA;;;;;;;;;;GAUG;AACH,MAAM,UAAU,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,KAAK,EAAiC;IAChE,OAAO,iBAAS,KAAK,EAAE,GAAG,EAAE,GAAG,eAAY,KAAK,GAAG,CAAC;AACxD,CAAC"}

package/dist/components/InlineAlert/InlineAlert.d.ts

@@ -24,9 +24,7 @@ export type InlineAlertProps = CommonProps<'owner'> & {
  * @example
  *     import { InlineAlert } from '@bspk/ui/InlineAlert';
  *
- *     function Example() {
- *         return <InlineAlert variant="informational">Example informational inline alert</InlineAlert>;
- *     }
+ *     <InlineAlert variant="informational">Example informational inline alert</InlineAlert>;
  *
  * @name InlineAlert
  * @phase UXReview

package/dist/components/InlineAlert/InlineAlert.js

@@ -12,9 +12,7 @@ import { Txt } from '../Txt';
  * @example
  *     import { InlineAlert } from '@bspk/ui/InlineAlert';
  *
- *     function Example() {
- *         return <InlineAlert variant="informational">Example informational inline alert</InlineAlert>;
- *     }
+ *     <InlineAlert variant="informational">Example informational inline alert</InlineAlert>;
  *
  * @name InlineAlert
  * @phase UXReview

package/dist/components/InlineAlert/InlineAlert.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineAlert.js","sourceRoot":"","sources":["../../../src/components/InlineAlert/InlineAlert.tsx"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAqBvC;;;;;;;;;;;;;GAaG;AACH,MAAM,UAAU,WAAW,CAAC,EAAE,QAAQ,EAAE,OAAO,GAAG,eAAe,EAAE,EAAE,EAAE,KAAK,EAAoB;IAC5F,OAAO,CACH,4BAAe,cAAc,qBAAkB,KAAK,IAAI,SAAS,kBAAgB,OAAO,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,aACzG,YAAY,CAAC,OAAO,CAAC,EACtB,KAAC,GAAG,IAAC,OAAO,EAAC,YAAY,YAAE,QAAQ,GAAO,IACxC,CACT,CAAC;AACN,CAAC;AAED,MAAM,YAAY,GAAoC;IAClD,KAAK,EAAE,KAAC,YAAY,KAAG;IACvB,aAAa,EAAE,KAAC,WAAW,KAAG;IAC9B,OAAO,EAAE,KAAC,kBAAkB,KAAG;IAC/B,OAAO,EAAE,KAAC,iBAAiB,KAAG;CACjC,CAAC"}
+{"version":3,"file":"InlineAlert.js","sourceRoot":"","sources":["../../../src/components/InlineAlert/InlineAlert.tsx"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAqBvC;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,WAAW,CAAC,EAAE,QAAQ,EAAE,OAAO,GAAG,eAAe,EAAE,EAAE,EAAE,KAAK,EAAoB;IAC5F,OAAO,CACH,4BAAe,cAAc,qBAAkB,KAAK,IAAI,SAAS,kBAAgB,OAAO,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,aACzG,YAAY,CAAC,OAAO,CAAC,EACtB,KAAC,GAAG,IAAC,OAAO,EAAC,YAAY,YAAE,QAAQ,GAAO,IACxC,CACT,CAAC;AACN,CAAC;AAED,MAAM,YAAY,GAAoC;IAClD,KAAK,EAAE,KAAC,YAAY,KAAG;IACvB,aAAa,EAAE,KAAC,WAAW,KAAG;IAC9B,OAAO,EAAE,KAAC,kBAAkB,KAAG;IAC/B,OAAO,EAAE,KAAC,iBAAiB,KAAG;CACjC,CAAC"}

package/dist/components/Input/Input.d.ts

@@ -12,23 +12,23 @@ export type InputProps = Omit<InputElementProps, 'ariaDescribedBy' | 'ariaErrorM
  *     import { Input } from '@bspk/ui/Input';
  *     import { Field, FieldLabel } from '@bspk/ui/Field';
  *
- *     function Example() {
+ *     () => {
  *         const [value, setValue] = useState('');
  *
  *         return (
- *             <Field>
- *                 <FieldLabel>Example Label</FieldLabel>
- *                 <Input name="example-name" onChange={setValue} value={value} />
- *                 <FieldDescription>This is an example input field.</FieldDescription>
- *             </Field>
+ *             <>
+ *                 // standalone input example
+ *                 <Input aria-label="Example Input" name="example-name" onChange={setValue} value={value} />
+ *                 <br />
+ *                 // input used within a field
+ *                 <Field>
+ *                     <FieldLabel>Example Label</FieldLabel>
+ *                     <Input name="example-name" onChange={setValue} value={value} />
+ *                     <FieldDescription>This is an example input field.</FieldDescription>
+ *                 </Field>
+ *             </>
  *         );
- *     }
- *
- *     function ExampleWithAriaLabel() {
- *         const [value, setValue] = useState('');
- *
- *         return <Input aria-label="Example Input" name="example-name" onChange={setValue} value={value} />;
- *     }
+ *     };
  *
  * @name Input
  * @phase UXReview

package/dist/components/Input/Input.js

@@ -12,23 +12,23 @@ import { useFieldInit } from '../Field';
  *     import { Input } from '@bspk/ui/Input';
  *     import { Field, FieldLabel } from '@bspk/ui/Field';
  *
- *     function Example() {
+ *     () => {
  *         const [value, setValue] = useState('');
  *
  *         return (
- *             <Field>
- *                 <FieldLabel>Example Label</FieldLabel>
- *                 <Input name="example-name" onChange={setValue} value={value} />
- *                 <FieldDescription>This is an example input field.</FieldDescription>
- *             </Field>
+ *             <>
+ *                 // standalone input example
+ *                 <Input aria-label="Example Input" name="example-name" onChange={setValue} value={value} />
+ *                 <br />
+ *                 // input used within a field
+ *                 <Field>
+ *                     <FieldLabel>Example Label</FieldLabel>
+ *                     <Input name="example-name" onChange={setValue} value={value} />
+ *                     <FieldDescription>This is an example input field.</FieldDescription>
+ *                 </Field>
+ *             </>
  *         );
- *     }
- *
- *     function ExampleWithAriaLabel() {
- *         const [value, setValue] = useState('');
- *
- *         return <Input aria-label="Example Input" name="example-name" onChange={setValue} value={value} />;
- *     }
+ *     };
  *
  * @name Input
  * @phase UXReview

package/dist/components/Input/InputElement.d.ts

@@ -58,16 +58,22 @@ export type InputElementProps = InputElementBaseProps & {
  *     import { InputElement } from '@bspk/ui/InputElement';
  *     import { Field, FieldLabel } from '@bspk/ui/Field';
  *
- *     function Example() {
+ *     () => {
  *         const [value, setValue] = useState('');
  *
  *         return (
- *             <Field>
- *                 <FieldLabel>Example Label</FieldLabel>
+ *             <>
+ *                 // standalone input element example
  *                 <InputElement name="example-name" onChange={setValue} value={value} />
- *             </Field>
+ *                 <br />
+ *                 // input element used within a field
+ *                 <Field>
+ *                     <FieldLabel>Example Label</FieldLabel>
+ *                     <InputElement name="example-name" onChange={setValue} value={value} />
+ *                 </Field>
+ *             </>
  *         );
- *     }
+ *     };
  *
  * @name InputElement
  * @phase Utility