@bspk/ui 1.2.0 → 1.3.1

package/dist/components/Breadcrumb/BreadcrumbExample.js

@@ -1,156 +1,157 @@
-export const BreadcrumbExample = {
-    presets: [
-        {
-            label: '1 Item (nothing visible)',
-            propState: {
-                items: [
-                    {
-                        label: 'Item 1',
-                        href: '#link-1',
-                    },
-                ],
-            },
+export const presets = [
+    {
+        label: '1 Item (nothing visible)',
+        propState: {
+            items: [
+                {
+                    label: 'Item 1',
+                    href: '#link-1',
+                },
+            ],
         },
-        {
-            label: '2 Items (minimum)',
-            propState: {
-                items: [
-                    {
-                        label: 'Item 1',
-                        href: '#link-1',
-                    },
-                    {
-                        label: 'Item 2',
-                        href: '#link-2',
-                    },
-                ],
-            },
+    },
+    {
+        label: '2 Items (minimum)',
+        propState: {
+            items: [
+                {
+                    label: 'Item 1',
+                    href: '#link-1',
+                },
+                {
+                    label: 'Item 2',
+                    href: '#link-2',
+                },
+            ],
         },
-        {
-            label: '5 Items',
-            propState: {
-                items: [
-                    {
-                        label: 'Item 1',
-                        href: '#link-1',
-                    },
-                    {
-                        label: 'Item 2',
-                        href: '#link-2',
-                    },
-                    {
-                        label: 'Item 3',
-                        href: '#link-3',
-                    },
-                    {
-                        label: 'Item 4',
-                        href: '#link-4',
-                    },
-                    {
-                        label: 'Item 5',
-                        href: '#link-5',
-                    },
-                ],
-            },
+    },
+    {
+        label: '5 Items',
+        propState: {
+            items: [
+                {
+                    label: 'Item 1',
+                    href: '#link-1',
+                },
+                {
+                    label: 'Item 2',
+                    href: '#link-2',
+                },
+                {
+                    label: 'Item 3',
+                    href: '#link-3',
+                },
+                {
+                    label: 'Item 4',
+                    href: '#link-4',
+                },
+                {
+                    label: 'Item 5',
+                    href: '#link-5',
+                },
+            ],
         },
-        {
-            label: '6 Items',
-            propState: {
-                items: [
-                    {
-                        label: 'Item 1',
-                        href: '#link-1',
-                    },
-                    {
-                        label: 'Item 2',
-                        href: '#link-2',
-                    },
-                    {
-                        label: 'Item 3',
-                        href: '#link-3',
-                    },
-                    {
-                        label: 'Item 4',
-                        href: '#link-4',
-                    },
-                    {
-                        label: 'Item 5',
-                        href: '#link-5',
-                    },
-                    {
-                        label: 'Item 6',
-                        href: '#link-6',
-                    },
-                ],
-            },
+    },
+    {
+        label: '6 Items',
+        propState: {
+            items: [
+                {
+                    label: 'Item 1',
+                    href: '#link-1',
+                },
+                {
+                    label: 'Item 2',
+                    href: '#link-2',
+                },
+                {
+                    label: 'Item 3',
+                    href: '#link-3',
+                },
+                {
+                    label: 'Item 4',
+                    href: '#link-4',
+                },
+                {
+                    label: 'Item 5',
+                    href: '#link-5',
+                },
+                {
+                    label: 'Item 6',
+                    href: '#link-6',
+                },
+            ],
         },
-        {
-            label: 'NOT recommended',
-            propState: {
-                items: [
-                    {
-                        label: 'Item 1',
-                        href: '#link-1',
-                    },
-                    {
-                        label: 'Item 2',
-                        href: '#link-2',
-                    },
-                    {
-                        label: 'Item 3',
-                        href: '#link-3',
-                    },
-                    {
-                        label: 'Item 4',
-                        href: '#link-4',
-                    },
-                    {
-                        label: 'Item 5',
-                        href: '#link-5',
-                    },
-                    {
-                        label: 'Item 6',
-                        href: '#link-6',
-                    },
-                    {
-                        label: 'Item 7',
-                        href: '#link-7',
-                    },
-                    {
-                        label: 'Item 8',
-                        href: '#link-8',
-                    },
-                    {
-                        label: 'Item 9',
-                        href: '#link-9',
-                    },
-                    {
-                        label: 'Item 10',
-                        href: '#link-10',
-                    },
-                    {
-                        label: 'Item 11',
-                        href: '#link-11',
-                    },
-                    {
-                        label: 'Item 12',
-                        href: '#link-12',
-                    },
-                    {
-                        label: 'Item 13',
-                        href: '#link-13',
-                    },
-                    {
-                        label: 'Item 14',
-                        href: '#link-14',
-                    },
-                    {
-                        label: 'Item 15',
-                        href: '#link-15',
-                    },
-                ],
-            },
+    },
+    {
+        label: 'NOT recommended',
+        propState: {
+            items: [
+                {
+                    label: 'Item 1',
+                    href: '#link-1',
+                },
+                {
+                    label: 'Item 2',
+                    href: '#link-2',
+                },
+                {
+                    label: 'Item 3',
+                    href: '#link-3',
+                },
+                {
+                    label: 'Item 4',
+                    href: '#link-4',
+                },
+                {
+                    label: 'Item 5',
+                    href: '#link-5',
+                },
+                {
+                    label: 'Item 6',
+                    href: '#link-6',
+                },
+                {
+                    label: 'Item 7',
+                    href: '#link-7',
+                },
+                {
+                    label: 'Item 8',
+                    href: '#link-8',
+                },
+                {
+                    label: 'Item 9',
+                    href: '#link-9',
+                },
+                {
+                    label: 'Item 10',
+                    href: '#link-10',
+                },
+                {
+                    label: 'Item 11',
+                    href: '#link-11',
+                },
+                {
+                    label: 'Item 12',
+                    href: '#link-12',
+                },
+                {
+                    label: 'Item 13',
+                    href: '#link-13',
+                },
+                {
+                    label: 'Item 14',
+                    href: '#link-14',
+                },
+                {
+                    label: 'Item 15',
+                    href: '#link-15',
+                },
+            ],
         },
-    ],
+    },
+];
+export const BreadcrumbExample = {
+    presets,
 };
 //# sourceMappingURL=BreadcrumbExample.js.map

package/dist/components/Breadcrumb/BreadcrumbExample.js.map

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

package/dist/components/Button/Button.d.ts

@@ -1,6 +1,6 @@
+import './button.scss';
 import { AriaAttributes, ElementType, ReactNode } from 'react';
 import { ButtonSize, CommonProps, ElementProps, SetRef } from '-/types/common';
-import './button.scss';
 export type ButtonVariant = 'primary' | 'secondary' | 'tertiary';
 export type ButtonProps<As extends ElementType = 'button'> = CommonProps<'disabled' | 'owner'> & {
     /**

package/dist/components/Button/Button.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import './button.css.js';
 import { isValidElement } from 'react';
 import { Tooltip } from '../Tooltip';
-import './button.css.js';
 /**
  * A clickable component that allows users to perform an action, make a choice or trigger a change in state.
  *
@@ -29,9 +29,12 @@ export function Button(props) {
     const label = typeof children === 'string' ? children : labelProp || '';
     // ignore iconOnly if there is no icon
     const iconOnly = iconOnlyProp === true && !!icon;
-    // if toolTip label is not provided and iconOnly is true, toolTip should be label
+    // if toolTip text is not provided and iconOnly is true, toolTip text should be label
     const toolTip = toolTipProp || (iconOnly ? label : undefined);
-    const button = (triggerProps) => (_jsxs(As, { ...containerProps, "aria-describedby": triggerProps['aria-describedby'] || containerProps['aria-describedby'], "aria-label": label, "data-bspk": "button", "data-bspk-owner": owner || undefined, "data-destructive": destructive || undefined, "data-size": size, "data-touch-target-parent": true, "data-variant": variant, "data-width": width, disabled: disabled || undefined, onFocus: (e) => {
+    const button = (triggerProps) => (_jsxs(As, { type: As === 'button' ? 'button' : undefined, ...containerProps, ...triggerProps, "aria-label": label, "data-bspk": "button", "data-bspk-owner": owner || undefined, "data-destructive": destructive || undefined, "data-size": size, "data-touch-target-parent": true, "data-variant": variant, "data-width": width, disabled: disabled || undefined, onBlur: (e) => {
+            triggerProps.onBlur?.();
+            containerProps.onBlur?.(e);
+        }, onFocus: (e) => {
             triggerProps.onFocus?.();
             containerProps.onFocus?.(e);
         }, onMouseLeave: (e) => {

package/dist/components/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAA0C,cAAc,EAAE,MAAM,OAAO,CAAC;AAE/E,OAAO,EAAE,OAAO,EAAuB,MAAM,sBAAsB,CAAC;AAGpE,OAAO,eAAe,CAAC;AAuEvB;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,MAAM,CAClB,KAAyD;IAEzD,MAAM,EACF,IAAI,GAAG,QAAQ,EACf,OAAO,GAAG,SAAS,EACnB,WAAW,GAAG,KAAK,EACnB,KAAK,GAAG,KAAK,EACb,EAAE,EAAE,EAAE,GAAG,QAAQ,EACjB,QAAQ,GAAG,KAAK,EAChB,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,QAAQ,EAAE,YAAY,GAAG,KAAK,EAC9B,OAAO,EAAE,WAAW,EACpB,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,GAAG,cAAc,EACpB,GAAG,KAAK,CAAC;IACV,MAAM,KAAK,GAAG,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC;IAExE,sCAAsC;IACtC,MAAM,QAAQ,GAAG,YAAY,KAAK,IAAI,IAAI,CAAC,CAAC,IAAI,CAAC;IACjD,iFAAiF;IACjF,MAAM,OAAO,GAAG,WAAW,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAE9D,MAAM,MAAM,GAAG,CAAC,YAAiC,EAAE,EAAE,CAAC,CAClD,MAAC,EAAE,OACK,cAAc,sBACA,YAAY,CAAC,kBAAkB,CAAC,IAAI,cAAc,CAAC,kBAAkB,CAAC,gBAC5E,KAAK,eACP,QAAQ,qBACD,KAAK,IAAI,SAAS,sBACjB,WAAW,IAAI,SAAS,eAC/B,IAAI,oDAED,OAAO,gBACT,KAAK,EACjB,QAAQ,EAAE,QAAQ,IAAI,SAAS,EAC/B,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;YACX,YAAY,CAAC,OAAO,EAAE,EAAE,CAAC;YACzB,cAAc,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;QAChC,CAAC,EACD,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YAChB,YAAY,CAAC,YAAY,EAAE,EAAE,CAAC;YAC9B,cAAc,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;QACrC,CAAC,EACD,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE;YACf,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC;YAC7B,cAAc,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC;QACpC,CAAC,EACD,GAAG,EAAE,QAAQ,aAEZ,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,CACxC,QAAQ,CACX,CAAC,CAAC,CAAC,CACA,8BACK,CAAC,CAAC,IAAI,IAAI,cAAc,CAAC,IAAI,CAAC,IAAI,CAC/B,8BAAmB,IAAI,sCAClB,IAAI,GACF,CACV,EACA,CAAC,QAAQ,IAAI,oDAAyB,KAAK,GAAQ,IACrD,CACN,EACD,2CAA0B,IACzB,CACR,CAAC;IAEF,IAAI,OAAO;QACP,OAAO,CACH,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,EAAE,SAAS,EAAC,KAAK,YACnC,MAAM,GACD,CACb,CAAC;IAEN,OAAO,MAAM,CAAC,EAAE,CAAC,CAAC;AACtB,CAAC"}
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AACvB,OAAO,EAA0C,cAAc,EAAE,MAAM,OAAO,CAAC;AAC/E,OAAO,EAAE,OAAO,EAAuB,MAAM,sBAAsB,CAAC;AAwEpE;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,MAAM,CAClB,KAAyD;IAEzD,MAAM,EACF,IAAI,GAAG,QAAQ,EACf,OAAO,GAAG,SAAS,EACnB,WAAW,GAAG,KAAK,EACnB,KAAK,GAAG,KAAK,EACb,EAAE,EAAE,EAAE,GAAG,QAAQ,EACjB,QAAQ,GAAG,KAAK,EAChB,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,QAAQ,EAAE,YAAY,GAAG,KAAK,EAC9B,OAAO,EAAE,WAAW,EACpB,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,GAAG,cAAc,EACpB,GAAG,KAAK,CAAC;IACV,MAAM,KAAK,GAAG,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC;IAExE,sCAAsC;IACtC,MAAM,QAAQ,GAAG,YAAY,KAAK,IAAI,IAAI,CAAC,CAAC,IAAI,CAAC;IAEjD,qFAAqF;IACrF,MAAM,OAAO,GAAG,WAAW,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAE9D,MAAM,MAAM,GAAG,CAAC,YAAiC,EAAE,EAAE,CAAC,CAClD,MAAC,EAAE,IACC,IAAI,EAAE,EAAE,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,KACxC,cAAc,KACd,YAAY,gBACJ,KAAK,eACP,QAAQ,qBACD,KAAK,IAAI,SAAS,sBACjB,WAAW,IAAI,SAAS,eAC/B,IAAI,oDAED,OAAO,gBACT,KAAK,EACjB,QAAQ,EAAE,QAAQ,IAAI,SAAS,EAC/B,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE;YACV,YAAY,CAAC,MAAM,EAAE,EAAE,CAAC;YACxB,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC;QAC/B,CAAC,EACD,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;YACX,YAAY,CAAC,OAAO,EAAE,EAAE,CAAC;YACzB,cAAc,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;QAChC,CAAC,EACD,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YAChB,YAAY,CAAC,YAAY,EAAE,EAAE,CAAC;YAC9B,cAAc,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;QACrC,CAAC,EACD,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE;YACf,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC;YAC7B,cAAc,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC;QACpC,CAAC,EACD,GAAG,EAAE,QAAQ,aAEZ,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,CACxC,QAAQ,CACX,CAAC,CAAC,CAAC,CACA,8BACK,CAAC,CAAC,IAAI,IAAI,cAAc,CAAC,IAAI,CAAC,IAAI,CAC/B,8BAAmB,IAAI,sCAClB,IAAI,GACF,CACV,EACA,CAAC,QAAQ,IAAI,oDAAyB,KAAK,GAAQ,IACrD,CACN,EACD,2CAA0B,IACzB,CACR,CAAC;IAEF,IAAI,OAAO;QACP,OAAO,CACH,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,EAAE,SAAS,EAAC,KAAK,YACnC,MAAM,GACD,CACb,CAAC;IAEN,OAAO,MAAM,CAAC,EAAE,CAAC,CAAC;AACtB,CAAC"}

package/dist/components/Button/ButtonExample.d.ts

@@ -1,3 +1,4 @@
 import { ButtonProps } from '.';
-import { ComponentExample } from '-/utils/demo';
+import { ComponentExample, Preset } from '-/utils/demo';
+export declare const presets: Preset<ButtonProps>[];
 export declare const ButtonExample: ComponentExample<ButtonProps>;

package/dist/components/Button/ButtonExample.js

@@ -1,32 +1,33 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { SvgPerson } from '@bspk/icons/Person';
-export const ButtonExample = {
-    presets: [
-        {
-            label: 'Icon & Text',
-            propState: {
-                icon: 'Add',
-                label: 'Add',
-                iconOnly: false,
-            },
+export const presets = [
+    {
+        label: 'Icon & Text',
+        propState: {
+            icon: 'Add',
+            label: 'Add',
+            iconOnly: false,
         },
-        {
-            label: 'Text only',
-            propState: {
-                label: 'Add',
-                icon: undefined,
-                iconOnly: false,
-            },
+    },
+    {
+        label: 'Text only',
+        propState: {
+            label: 'Add',
+            icon: undefined,
+            iconOnly: false,
         },
-        {
-            label: 'Icon only',
-            propState: {
-                iconOnly: true,
-                icon: 'Add',
-                label: 'Add',
-            },
+    },
+    {
+        label: 'Icon only',
+        propState: {
+            iconOnly: true,
+            icon: 'Add',
+            label: 'Add',
         },
-    ],
+    },
+];
+export const ButtonExample = {
+    presets,
     variants: {
         iconOnly: () => ({ icon: _jsx(SvgPerson, {}), label: 'Person' }),
     },

package/dist/components/Button/ButtonExample.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonExample.js","sourceRoot":"","sources":["../../../src/components/Button/ButtonExample.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAI/C,MAAM,CAAC,MAAM,aAAa,GAAkC;IACxD,OAAO,EAAE;QACL;YACI,KAAK,EAAE,aAAa;YACpB,SAAS,EAAE;gBACP,IAAI,EAAE,KAAK;gBACX,KAAK,EAAE,KAAK;gBACZ,QAAQ,EAAE,KAAK;aAClB;SACJ;QACD;YACI,KAAK,EAAE,WAAW;YAClB,SAAS,EAAE;gBACP,KAAK,EAAE,KAAK;gBACZ,IAAI,EAAE,SAAS;gBACf,QAAQ,EAAE,KAAK;aAClB;SACJ;QACD;YACI,KAAK,EAAE,WAAW;YAClB,SAAS,EAAE;gBACP,QAAQ,EAAE,IAAI;gBACd,IAAI,EAAE,KAAK;gBACX,KAAK,EAAE,KAAK;aACf;SACJ;KACJ;IACD,QAAQ,EAAE;QACN,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,KAAC,SAAS,KAAG,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;KAC7D;CACJ,CAAC"}
+{"version":3,"file":"ButtonExample.js","sourceRoot":"","sources":["../../../src/components/Button/ButtonExample.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAI/C,MAAM,CAAC,MAAM,OAAO,GAA0B;IAC1C;QACI,KAAK,EAAE,aAAa;QACpB,SAAS,EAAE;YACP,IAAI,EAAE,KAAK;YACX,KAAK,EAAE,KAAK;YACZ,QAAQ,EAAE,KAAK;SAClB;KACJ;IACD;QACI,KAAK,EAAE,WAAW;QAClB,SAAS,EAAE;YACP,KAAK,EAAE,KAAK;YACZ,IAAI,EAAE,SAAS;YACf,QAAQ,EAAE,KAAK;SAClB;KACJ;IACD;QACI,KAAK,EAAE,WAAW;QAClB,SAAS,EAAE;YACP,QAAQ,EAAE,IAAI;YACd,IAAI,EAAE,KAAK;YACX,KAAK,EAAE,KAAK;SACf;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAkC;IACxD,OAAO;IACP,QAAQ,EAAE;QACN,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,KAAC,SAAS,KAAG,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;KAC7D;CACJ,CAAC"}

package/dist/components/ButtonDock/ButtonDock.d.ts

@@ -0,0 +1,55 @@
+import './button-dock.scss';
+import { ButtonProps } from '-/components/Button/Button';
+export type ButtonDockProps = {
+    /**
+     * The primary button in the dock. If a secondary button is provided the primary will render on the right side.
+     *
+     * @required
+     */
+    primaryButton: ButtonProps;
+    /**
+     * Secondary button. If provided will render on the left side.
+     *
+     * @required
+     */
+    secondaryButton?: ButtonProps;
+    /**
+     * If more than one button is provided defines how the buttons should be arranged.
+     *
+     * @default fill
+     */
+    arrangement?: 'fill' | 'spread';
+    /**
+     * If the dock should render inline or fixed to the bottom of the viewport.
+     *
+     * @default inline
+     */
+    mode?: 'fixed' | 'inline';
+};
+/**
+ * A sticky or fixed bar containing action buttons that are to remain on the screen while the page scrolls. Alternative
+ * option to house the bar within the bottom of a page’s body content.
+ *
+ * @example
+ *     import { ButtonDock } from '@bspk/ui/ButtonDock';
+ *
+ *     function Example() {
+ *         return (
+ *             <ButtonDock
+ *                 primaryButton={{
+ *                     children: 'Send',
+ *                     label: 'send',
+ *                 }}
+ *                 secondaryButton={{
+ *                     children: 'Cancel',
+ *                     label: 'cancel',
+ *                 }}
+ *             />
+ *         );
+ *     }
+ *
+ * @name ButtonDock
+ * @phase Dev
+ */
+export declare function ButtonDock({ primaryButton, secondaryButton, arrangement, mode }: ButtonDockProps): import("react/jsx-runtime").JSX.Element;
+/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/ButtonDock/ButtonDock.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './button-dock.css.js';
+import { Button } from '../Button/Button';
+/**
+ * A sticky or fixed bar containing action buttons that are to remain on the screen while the page scrolls. Alternative
+ * option to house the bar within the bottom of a page’s body content.
+ *
+ * @example
+ *     import { ButtonDock } from '@bspk/ui/ButtonDock';
+ *
+ *     function Example() {
+ *         return (
+ *             <ButtonDock
+ *                 primaryButton={{
+ *                     children: 'Send',
+ *                     label: 'send',
+ *                 }}
+ *                 secondaryButton={{
+ *                     children: 'Cancel',
+ *                     label: 'cancel',
+ *                 }}
+ *             />
+ *         );
+ *     }
+ *
+ * @name ButtonDock
+ * @phase Dev
+ */
+export function ButtonDock({ primaryButton, secondaryButton, arrangement = 'fill', mode = 'inline' }) {
+    const finalArrangement = secondaryButton ? arrangement : 'fill';
+    return (_jsxs("div", { "data-arrangement": finalArrangement, "data-bspk": "button-dock", "data-mode": mode, children: [secondaryButton && _jsx(Button, { size: 'medium', variant: 'secondary', ...secondaryButton }), _jsx(Button, { size: 'medium', variant: 'primary', ...primaryButton })] }));
+}
+//# sourceMappingURL=ButtonDock.js.map

package/dist/components/ButtonDock/ButtonDock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonDock.js","sourceRoot":"","sources":["../../../src/components/ButtonDock/ButtonDock.tsx"],"names":[],"mappings":";AAAA,OAAO,oBAAoB,CAAC;AAC5B,OAAO,EAAE,MAAM,EAAe,MAAM,4BAA4B,CAAC;AA6BjE;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,UAAU,UAAU,CAAC,EAAE,aAAa,EAAE,eAAe,EAAE,WAAW,GAAG,MAAM,EAAE,IAAI,GAAG,QAAQ,EAAmB;IACjH,MAAM,gBAAgB,GAAG,eAAe,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC;IAEhE,OAAO,CACH,mCAAuB,gBAAgB,eAAY,aAAa,eAAY,IAAI,aAC3E,eAAe,IAAI,KAAC,MAAM,IAAO,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,eAAe,GAAM,EAEhG,KAAC,MAAM,IAAO,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,aAAa,GAAM,IACtE,CACT,CAAC;AACN,CAAC"}

package/dist/components/ButtonDock/ButtonDockExample.d.ts

@@ -0,0 +1,4 @@
+import { ButtonDockProps } from '.';
+import { ComponentExampleFn, Preset } from '-/utils/demo';
+export declare const presets: Preset<ButtonDockProps>[];
+export declare const ButtonDockExample: ComponentExampleFn<ButtonDockProps>;

package/dist/components/ButtonDock/ButtonDockExample.js

@@ -0,0 +1,75 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const presets = [
+    {
+        label: 'One Button',
+        propState: {
+            mode: 'inline',
+            primaryButton: {
+                children: 'Send',
+                label: 'send',
+            },
+            secondaryButton: undefined,
+        },
+    },
+    {
+        label: 'Two Buttons',
+        propState: {
+            mode: 'inline',
+            arrangement: 'fill',
+            secondaryButton: {
+                children: 'Cancel',
+                label: 'cancel',
+            },
+            primaryButton: {
+                children: 'Send',
+                label: 'send',
+            },
+        },
+    },
+    {
+        label: 'Two Buttons Spread',
+        propState: {
+            mode: 'inline',
+            arrangement: 'spread',
+            secondaryButton: {
+                children: 'Cancel',
+                label: 'cancel',
+            },
+            primaryButton: {
+                children: 'Send',
+                label: 'send',
+            },
+        },
+    },
+];
+export const ButtonDockExample = ({ action }) => ({
+    containerStyle: {
+        height: '200px',
+        width: '100%',
+        padding: '0 0 16px 0',
+        justifyContent: 'end',
+        overflow: 'hidden',
+    },
+    defaultState: presets[1].propState,
+    disableProps: [],
+    presets,
+    render: ({ props, Component }) => {
+        const newProps = { ...props };
+        if (newProps.primaryButton) {
+            newProps.primaryButton = {
+                ...newProps.primaryButton,
+                onClick: () => action('Primary button clicked!'),
+            };
+        }
+        if (newProps.secondaryButton) {
+            newProps.secondaryButton = {
+                ...newProps.secondaryButton,
+                onClick: () => action('Secondary button clicked!'),
+            };
+        }
+        return _jsx(Component, { ...newProps });
+    },
+    sections: [],
+    variants: false,
+});
+//# sourceMappingURL=ButtonDockExample.js.map

package/dist/components/ButtonDock/ButtonDockExample.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonDockExample.js","sourceRoot":"","sources":["../../../src/components/ButtonDock/ButtonDockExample.tsx"],"names":[],"mappings":";AAGA,MAAM,CAAC,MAAM,OAAO,GAA8B;IAC9C;QACI,KAAK,EAAE,YAAY;QACnB,SAAS,EAAE;YACP,IAAI,EAAE,QAAQ;YACd,aAAa,EAAE;gBACX,QAAQ,EAAE,MAAM;gBAChB,KAAK,EAAE,MAAM;aAChB;YACD,eAAe,EAAE,SAAS;SAC7B;KACJ;IACD;QACI,KAAK,EAAE,aAAa;QACpB,SAAS,EAAE;YACP,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,MAAM;YACnB,eAAe,EAAE;gBACb,QAAQ,EAAE,QAAQ;gBAClB,KAAK,EAAE,QAAQ;aAClB;YACD,aAAa,EAAE;gBACX,QAAQ,EAAE,MAAM;gBAChB,KAAK,EAAE,MAAM;aAChB;SACJ;KACJ;IACD;QACI,KAAK,EAAE,oBAAoB;QAC3B,SAAS,EAAE;YACP,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,QAAQ;YACrB,eAAe,EAAE;gBACb,QAAQ,EAAE,QAAQ;gBAClB,KAAK,EAAE,QAAQ;aAClB;YACD,aAAa,EAAE;gBACX,QAAQ,EAAE,MAAM;gBAChB,KAAK,EAAE,MAAM;aAChB;SACJ;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAwC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;IACnF,cAAc,EAAE;QACZ,MAAM,EAAE,OAAO;QACf,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,YAAY;QACrB,cAAc,EAAE,KAAK;QACrB,QAAQ,EAAE,QAAQ;KACrB;IACD,YAAY,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS;IAClC,YAAY,EAAE,EAAE;IAChB,OAAO;IACP,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;QAC7B,MAAM,QAAQ,GAAG,EAAE,GAAG,KAAK,EAAE,CAAC;QAC9B,IAAI,QAAQ,CAAC,aAAa,EAAE,CAAC;YACzB,QAAQ,CAAC,aAAa,GAAG;gBACrB,GAAG,QAAQ,CAAC,aAAa;gBACzB,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,yBAAyB,CAAC;aACnD,CAAC;QACN,CAAC;QACD,IAAI,QAAQ,CAAC,eAAe,EAAE,CAAC;YAC3B,QAAQ,CAAC,eAAe,GAAG;gBACvB,GAAG,QAAQ,CAAC,eAAe;gBAC3B,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,2BAA2B,CAAC;aACrD,CAAC;QACN,CAAC;QACD,OAAO,KAAC,SAAS,OAAK,QAAQ,GAAI,CAAC;IACvC,CAAC;IACD,QAAQ,EAAE,EAAE;IACZ,QAAQ,EAAE,KAAK;CAClB,CAAC,CAAC"}