@bookjane2/bookjane-design-library 7.2.8 → 7.3.0

package/lib/components/BKJBadge/BKJBadge.styled.d.ts

@@ -1,5 +1,5 @@
-import { BKJThemeBadgeVariantType } from './BKJBadge.types.js';
-export declare const BadgeWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    variant: BKJThemeBadgeVariantType;
-}, never>;
+import { BKJThemeBadgeVariantType } from './BKJBadge.types.js';
+export declare const BadgeWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+    variant: BKJThemeBadgeVariantType;
+}, never>;
 //# sourceMappingURL=BKJBadge.styled.d.ts.map

package/lib/components/BKJBadge/BKJBadge.styled.js

@@ -1,18 +1,18 @@
-import styled from 'styled-components';
-export const BadgeWrapper = styled.div `
-  ${({ theme, variant }) => theme.badge[variant]}
-  padding: 2px 14px;
-  display: flex;
-  width: fit-content;
-  height: 25px;
-  min-height: 25px;
-  max-height: 25px;
-  justify-content: center;
-  align-items: center;
-  -webkit-font-smoothing: antialiased;
-  ${({ theme }) => theme.fonts.PoppinsTextMedium};
-  ${({ theme }) => theme.common.Ellipsis};
-  font-size: 14px;
-  line-height: 22px;
-`;
+import styled from 'styled-components';
+export const BadgeWrapper = styled.div `
+  ${({ theme, variant }) => theme.badge[variant]}
+  padding: 2px 14px;
+  display: flex;
+  width: fit-content;
+  height: 25px;
+  min-height: 25px;
+  max-height: 25px;
+  justify-content: center;
+  align-items: center;
+  -webkit-font-smoothing: antialiased;
+  ${({ theme }) => theme.fonts.PoppinsTextMedium};
+  ${({ theme }) => theme.common.Ellipsis};
+  font-size: 14px;
+  line-height: 22px;
+`;
 //# sourceMappingURL=BKJBadge.styled.js.map

package/lib/components/BKJBadge/BKJBadge.theme.d.ts

@@ -1,3 +1,3 @@
-import { IBKJThemeBadge } from './BKJBadge.types.js';
-export declare const BKJThemeBadge: IBKJThemeBadge;
+import { IBKJThemeBadge } from './BKJBadge.types.js';
+export declare const BKJThemeBadge: IBKJThemeBadge;
 //# sourceMappingURL=BKJBadge.theme.d.ts.map

package/lib/components/BKJBadge/BKJBadge.theme.js

@@ -1,122 +1,122 @@
-import { css } from 'styled-components';
-export const BKJThemeBadge = {
-    Orange: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.SecondaryPendingDefault};
-  `,
-    OrangePill: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.SecondaryPendingDefault};
-    border-radius: 19px;
-  `,
-    Green: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.SecondaryAcceptedDefault};
-  `,
-    GreenPill: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.SecondaryAcceptedDefault};
-    border-radius: 19px;
-  `,
-    Red: css `
-    color: ${({ theme }) => theme.colors.White};
-    background-color: ${({ theme }) => theme.colors.ErrorDefault};
-  `,
-    RedPill: css `
-    color: ${({ theme }) => theme.colors.White};
-    background-color: ${({ theme }) => theme.colors.ErrorDefault};
-    border-radius: 19px;
-  `,
-    Grey: css `
-    color: ${({ theme }) => theme.colors.White};
-    background-color: ${({ theme }) => theme.colors.Grey6};
-  `,
-    GreyPill: css `
-    color: ${({ theme }) => theme.colors.White};
-    background-color: ${({ theme }) => theme.colors.Grey6};
-    border-radius: 19px;
-  `,
-    LightGrey: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.Grey3};
-  `,
-    LightGreyPill: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.Grey3};
-    border-radius: 19px;
-  `,
-    MidGrey: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.Grey4};
-  `,
-    MidGreyPill: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.Grey4};
-    border-radius: 19px;
-  `,
-    DarkGrey: css `
-    color: ${({ theme }) => theme.colors.White};
-    background-color: ${({ theme }) => theme.colors.Grey7};
-  `,
-    DarkGreyPill: css `
-    color: ${({ theme }) => theme.colors.White};
-    background-color: ${({ theme }) => theme.colors.Grey7};
-    border-radius: 19px;
-  `,
-    GreyOutline: css `
-    border: 1px solid ${({ theme }) => theme.colors.TextSubtleGrey};
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    border-radius: 2px;
-  `,
-    AcceptedPill: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.ShiftAccepted};
-    border-radius: 19px;
-  `,
-    AssignedPill: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.ShiftAssigned};
-    border-radius: 19px;
-  `,
-    CancelledPill: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.ShiftCancelled};
-    border-radius: 19px;
-  `,
-    CompletedPill: css `
-    color: ${({ theme }) => theme.colors.TextWhite};
-    background-color: ${({ theme }) => theme.colors.ShiftCompleted};
-    border-radius: 19px;
-  `,
-    InProgressPill: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.ShiftInProgress};
-    border-radius: 19px;
-  `,
-    OpenPill: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.ShiftOpen};
-    border-radius: 19px;
-  `,
-    PendingPill: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.ShiftPending};
-    border-radius: 19px;
-  `,
-    RejectedPill: css `
-    color: ${({ theme }) => theme.colors.TextWhite};
-    background-color: ${({ theme }) => theme.colors.ShiftRejected};
-    border-radius: 19px;
-  `,
-    RequestedPill: css `
-    color: ${({ theme }) => theme.colors.TextHighlight1};
-    background-color: ${({ theme }) => theme.colors.ShiftRequested};
-    border-radius: 19px;
-  `,
-    UnfulfilledPill: css `
-    color: ${({ theme }) => theme.colors.TextWhite};
-    background-color: ${({ theme }) => theme.colors.ShiftUnfulfilledStroke};
-    border-radius: 19px;
-  `,
-};
+import { css } from 'styled-components';
+export const BKJThemeBadge = {
+    Orange: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.SecondaryPendingDefault};
+  `,
+    OrangePill: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.SecondaryPendingDefault};
+    border-radius: 19px;
+  `,
+    Green: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.SecondaryAcceptedDefault};
+  `,
+    GreenPill: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.SecondaryAcceptedDefault};
+    border-radius: 19px;
+  `,
+    Red: css `
+    color: ${({ theme }) => theme.colors.White};
+    background-color: ${({ theme }) => theme.colors.ErrorDefault};
+  `,
+    RedPill: css `
+    color: ${({ theme }) => theme.colors.White};
+    background-color: ${({ theme }) => theme.colors.ErrorDefault};
+    border-radius: 19px;
+  `,
+    Grey: css `
+    color: ${({ theme }) => theme.colors.White};
+    background-color: ${({ theme }) => theme.colors.Grey6};
+  `,
+    GreyPill: css `
+    color: ${({ theme }) => theme.colors.White};
+    background-color: ${({ theme }) => theme.colors.Grey6};
+    border-radius: 19px;
+  `,
+    LightGrey: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.Grey3};
+  `,
+    LightGreyPill: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.Grey3};
+    border-radius: 19px;
+  `,
+    MidGrey: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.Grey4};
+  `,
+    MidGreyPill: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.Grey4};
+    border-radius: 19px;
+  `,
+    DarkGrey: css `
+    color: ${({ theme }) => theme.colors.White};
+    background-color: ${({ theme }) => theme.colors.Grey7};
+  `,
+    DarkGreyPill: css `
+    color: ${({ theme }) => theme.colors.White};
+    background-color: ${({ theme }) => theme.colors.Grey7};
+    border-radius: 19px;
+  `,
+    GreyOutline: css `
+    border: 1px solid ${({ theme }) => theme.colors.TextSubtleGrey};
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    border-radius: 2px;
+  `,
+    AcceptedPill: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.ShiftAccepted};
+    border-radius: 19px;
+  `,
+    AssignedPill: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.ShiftAssigned};
+    border-radius: 19px;
+  `,
+    CancelledPill: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.ShiftCancelled};
+    border-radius: 19px;
+  `,
+    CompletedPill: css `
+    color: ${({ theme }) => theme.colors.TextWhite};
+    background-color: ${({ theme }) => theme.colors.ShiftCompleted};
+    border-radius: 19px;
+  `,
+    InProgressPill: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.ShiftInProgress};
+    border-radius: 19px;
+  `,
+    OpenPill: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.ShiftOpen};
+    border-radius: 19px;
+  `,
+    PendingPill: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.ShiftPending};
+    border-radius: 19px;
+  `,
+    RejectedPill: css `
+    color: ${({ theme }) => theme.colors.TextWhite};
+    background-color: ${({ theme }) => theme.colors.ShiftRejected};
+    border-radius: 19px;
+  `,
+    RequestedPill: css `
+    color: ${({ theme }) => theme.colors.TextHighlight1};
+    background-color: ${({ theme }) => theme.colors.ShiftRequested};
+    border-radius: 19px;
+  `,
+    UnfulfilledPill: css `
+    color: ${({ theme }) => theme.colors.TextWhite};
+    background-color: ${({ theme }) => theme.colors.ShiftUnfulfilledStroke};
+    border-radius: 19px;
+  `,
+};
 //# sourceMappingURL=BKJBadge.theme.js.map

package/lib/components/BKJBadge/BKJBadge.types.d.ts

@@ -1,34 +1,34 @@
-import React from 'react';
-import { DefaultTheme, FlattenInterpolation, ThemeProps } from 'styled-components';
-export interface IBKJBadgeProps extends React.HTMLAttributes<HTMLDivElement> {
-    variant: BKJThemeBadgeVariantType;
-}
-export interface IBKJThemeBadge {
-    Orange: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    OrangePill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    Green: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    GreenPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    Red: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    RedPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    Grey: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    GreyPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    LightGrey: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    LightGreyPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    MidGrey: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    MidGreyPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    DarkGrey: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    DarkGreyPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    GreyOutline: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    AcceptedPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    AssignedPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    CancelledPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    CompletedPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    InProgressPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    OpenPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    PendingPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    RejectedPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    RequestedPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-    UnfulfilledPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
-}
-export declare type BKJThemeBadgeVariantType = keyof IBKJThemeBadge;
+import React from 'react';
+import { DefaultTheme, FlattenInterpolation, ThemeProps } from 'styled-components';
+export interface IBKJBadgeProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant: BKJThemeBadgeVariantType;
+}
+export interface IBKJThemeBadge {
+    Orange: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    OrangePill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    Green: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    GreenPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    Red: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    RedPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    Grey: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    GreyPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    LightGrey: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    LightGreyPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    MidGrey: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    MidGreyPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    DarkGrey: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    DarkGreyPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    GreyOutline: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    AcceptedPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    AssignedPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    CancelledPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    CompletedPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    InProgressPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    OpenPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    PendingPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    RejectedPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    RequestedPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+    UnfulfilledPill: FlattenInterpolation<ThemeProps<DefaultTheme>>;
+}
+export declare type BKJThemeBadgeVariantType = keyof IBKJThemeBadge;
 //# sourceMappingURL=BKJBadge.types.d.ts.map

package/lib/components/BKJBadge/BKJBadge.types.js

@@ -1,2 +1,2 @@
-export {};
+export {};
 //# sourceMappingURL=BKJBadge.types.js.map

package/lib/components/BKJBadge/index.d.ts

@@ -1,3 +1,3 @@
-import { BKJBadge } from './BKJBadge.js';
-export { BKJBadge };
+import { BKJBadge } from './BKJBadge.js';
+export { BKJBadge };
 //# sourceMappingURL=index.d.ts.map

package/lib/components/BKJBadge/index.js

@@ -1,3 +1,3 @@
-import { BKJBadge } from './BKJBadge.js';
-export { BKJBadge };
+import { BKJBadge } from './BKJBadge.js';
+export { BKJBadge };
 //# sourceMappingURL=index.js.map

package/lib/components/BKJButton/BKJButton.d.ts

@@ -1,4 +1,4 @@
-import { FC } from 'react';
-import { IBKJButtonProps } from './BKJButton.types.js';
-export declare const BKJButton: FC<IBKJButtonProps>;
+import { FC } from 'react';
+import { IBKJButtonProps } from './BKJButton.types.js';
+export declare const BKJButton: FC<IBKJButtonProps>;
 //# sourceMappingURL=BKJButton.d.ts.map

package/lib/components/BKJButton/BKJButton.js

@@ -1,9 +1,9 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { BKJButtonWrapper } from './BKJButton.styled.js';
-import { forwardRef } from 'react';
-import { BKJLoadingSpinner } from '../BKJLoadingSpinner/index.js';
-export const BKJButton = forwardRef((props, ref) => {
-    const { children, isLoading, className, ...rest } = props;
-    return (_jsx(BKJButtonWrapper, Object.assign({ className: className }, rest, { ref: ref }, { children: isLoading ? _jsx(BKJLoadingSpinner, { variant: "Small" }, void 0) : children }), void 0));
-});
+import { jsx as _jsx } from "react/jsx-runtime";
+import { BKJButtonWrapper } from './BKJButton.styled.js';
+import { forwardRef } from 'react';
+import { BKJLoadingSpinner } from '../BKJLoadingSpinner/index.js';
+export const BKJButton = forwardRef((props, ref) => {
+    const { children, isLoading, className, ...rest } = props;
+    return (_jsx(BKJButtonWrapper, Object.assign({ className: className }, rest, { ref: ref }, { children: isLoading ? _jsx(BKJLoadingSpinner, { variant: "Small" }, void 0) : children }), void 0));
+});
 //# sourceMappingURL=BKJButton.js.map

package/lib/components/BKJButton/BKJButton.stories.d.ts

@@ -1,49 +1,49 @@
-/// <reference types="react" />
-import { Story } from '@storybook/react';
-import { IBKJButtonProps } from './BKJButton.types.js';
-declare const _default: {
-    title: string;
-    component: import("react").FC<IBKJButtonProps>;
-    argTypes: {
-        variant: {
-            name: string;
-            control: {
-                type: string;
-            };
-            option: string[];
-        };
-        children: {
-            name: string;
-            control: string;
-        };
-        disabled: {
-            name: string;
-            type: string;
-        };
-        isLoading: {
-            name: string;
-        };
-        width: {
-            name: string;
-            control: {
-                type: string;
-                default: string;
-            };
-        };
-        css: {
-            table: {
-                disable: boolean;
-            };
-        };
-        minWidth: {
-            name: string;
-            control: {
-                type: string;
-                default: string;
-            };
-        };
-    };
-};
-export default _default;
-export declare const Default: Story<IBKJButtonProps>;
+/// <reference types="react" />
+import { Story } from '@storybook/react';
+import { IBKJButtonProps } from './BKJButton.types.js';
+declare const _default: {
+    title: string;
+    component: import("react").FC<IBKJButtonProps>;
+    argTypes: {
+        variant: {
+            name: string;
+            control: {
+                type: string;
+            };
+            option: string[];
+        };
+        children: {
+            name: string;
+            control: string;
+        };
+        disabled: {
+            name: string;
+            type: string;
+        };
+        isLoading: {
+            name: string;
+        };
+        width: {
+            name: string;
+            control: {
+                type: string;
+                default: string;
+            };
+        };
+        css: {
+            table: {
+                disable: boolean;
+            };
+        };
+        minWidth: {
+            name: string;
+            control: {
+                type: string;
+                default: string;
+            };
+        };
+    };
+};
+export default _default;
+export declare const Default: Story<IBKJButtonProps>;
 //# sourceMappingURL=BKJButton.stories.d.ts.map

package/lib/components/BKJButton/BKJButton.stories.js

@@ -1,66 +1,66 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { BKJButton } from './BKJButton.js';
-export default {
-    title: 'Basic Elements/BKJButton',
-    component: BKJButton,
-    argTypes: {
-        variant: {
-            name: 'Variation',
-            control: {
-                type: 'select',
-            },
-            option: [
-                'PurplePill',
-                'PurpleSolid',
-                'GreenSolid',
-                'RedSolid',
-                'PurpleOutlined',
-                'GreenOutlined',
-                'RedOutlined',
-                'PurpleText',
-                'GreenText',
-                'RedText',
-                'PurpleNoDecorations',
-                'UnderlinedTab',
-            ],
-        },
-        children: {
-            name: 'Label',
-            control: 'text',
-        },
-        disabled: {
-            name: 'Disabled',
-            type: 'boolean',
-        },
-        isLoading: {
-            name: 'Loading',
-        },
-        width: {
-            name: 'Width',
-            control: {
-                type: 'text',
-                default: '192px',
-            },
-        },
-        css: {
-            table: { disable: true },
-        },
-        minWidth: {
-            name: 'Minimum Width',
-            control: {
-                type: 'text',
-                default: '192px',
-            },
-        },
-    },
-};
-const Template = ({ children, ...props }) => {
-    return _jsx(BKJButton, Object.assign({}, props, { children: children }), void 0);
-};
-export const Default = Template.bind({});
-Default.args = {
-    children: 'Submit',
-    width: 'auto',
-    variant: 'PurpleText',
-};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { BKJButton } from './BKJButton.js';
+export default {
+    title: 'Basic Elements/BKJButton',
+    component: BKJButton,
+    argTypes: {
+        variant: {
+            name: 'Variation',
+            control: {
+                type: 'select',
+            },
+            option: [
+                'PurplePill',
+                'PurpleSolid',
+                'GreenSolid',
+                'RedSolid',
+                'PurpleOutlined',
+                'GreenOutlined',
+                'RedOutlined',
+                'PurpleText',
+                'GreenText',
+                'RedText',
+                'PurpleNoDecorations',
+                'UnderlinedTab',
+            ],
+        },
+        children: {
+            name: 'Label',
+            control: 'text',
+        },
+        disabled: {
+            name: 'Disabled',
+            type: 'boolean',
+        },
+        isLoading: {
+            name: 'Loading',
+        },
+        width: {
+            name: 'Width',
+            control: {
+                type: 'text',
+                default: '192px',
+            },
+        },
+        css: {
+            table: { disable: true },
+        },
+        minWidth: {
+            name: 'Minimum Width',
+            control: {
+                type: 'text',
+                default: '192px',
+            },
+        },
+    },
+};
+const Template = ({ children, ...props }) => {
+    return _jsx(BKJButton, Object.assign({}, props, { children: children }), void 0);
+};
+export const Default = Template.bind({});
+Default.args = {
+    children: 'Submit',
+    width: 'auto',
+    variant: 'PurpleText',
+};
 //# sourceMappingURL=BKJButton.stories.js.map