@bookjane2/bookjane-design-library 7.3.2 → 7.3.3-4.1

package/lib/components/BKJToggleInput/BKJToggleInput.constants.js

@@ -1,59 +1,59 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, Fragment, useCallback, useMemo } from 'react';
-import { BKJToggleButton, BKJToggleInputPillLabelWrapper, BKJToggleInputWrapper, BKJToggleSliderTrack, StyledButton, StyledCheckbox, } from './BKJToggleInput.styled.js';
-const BKJToggleInputSwitch = forwardRef(({ onChange, name, checked, disabled, ...rest }, ref) => {
-    const handleChange = useCallback(() => {
-        !disabled && onChange({ target: { name, value: !Boolean(checked) } });
-    }, [name, onChange, checked, disabled]);
-    const isSelected = useMemo(() => !!checked, [checked]);
-    return (_jsxs(BKJToggleInputWrapper, Object.assign({ ref: ref, onMouseDown: handleChange }, rest, { children: [_jsx(BKJToggleButton, { isSelected: isSelected, disabled: disabled }, void 0),
-            _jsx(BKJToggleSliderTrack, { isSelected: isSelected, disabled: disabled }, void 0)] }), void 0));
-});
-const BKJToggleInputPill = ({ variant, onChange, width, minWidth, checked, children, disabled, name, fontSize, }) => {
-    const handleChange = useCallback((event) => {
-        if (!disabled) {
-            const nextValue = !checked;
-            onChange({
-                ...event,
-                target: {
-                    ...event.target,
-                    name,
-                    value: nextValue,
-                    checked: nextValue,
-                },
-            });
-        }
-    }, [disabled, checked, onChange, name]);
-    const ButtonVariantMap = {
-        PurplePillLeft: checked ? 'PurplePill' : 'PurplePillOutlined',
-        PurplePillRight: checked ? 'PurplePill' : 'PurplePillOutlined',
-        PurpleNoBorderLeft: 'NoStyles',
-        PurpleNoBorderRight: 'NoStyles',
-        Switch: 'NoStyles',
-    };
-    return (_jsx(StyledButton, Object.assign({ onClick: handleChange, variant: ButtonVariantMap[variant], width: width, minWidth: minWidth, disabled: disabled }, { children: (() => {
-            switch (variant) {
-                case 'PurplePillLeft':
-                case 'PurplePillRight':
-                    return (_jsxs(Fragment, { children: [variant === 'PurplePillLeft' && (_jsx(BKJToggleInputPillLabelWrapper, Object.assign({ fontSize: fontSize }, { children: children }), void 0)),
-                            _jsx(StyledCheckbox, { name: name, variant: "PurpleOutlined", isLeft: variant === 'PurplePillLeft', onChange: handleChange, readOnly: true, value: checked }, void 0),
-                            variant === 'PurplePillRight' && (_jsx(BKJToggleInputPillLabelWrapper, Object.assign({ fontSize: fontSize }, { children: children }), void 0))] }, void 0));
-                case 'PurpleNoBorderLeft':
-                case 'PurpleNoBorderRight':
-                    return (_jsxs(Fragment, { children: [variant === 'PurpleNoBorderLeft' && (_jsx(BKJToggleInputPillLabelWrapper, Object.assign({ color: "PrimaryDefault", disabled: disabled, fontSize: fontSize }, { children: children }), void 0)),
-                            _jsx(StyledCheckbox, { name: name, variant: "PurpleSolid", disabled: disabled, isLeft: variant === 'PurpleNoBorderLeft', onChange: handleChange, readOnly: true, value: checked }, void 0),
-                            variant === 'PurpleNoBorderRight' && (_jsx(BKJToggleInputPillLabelWrapper, Object.assign({ color: "PrimaryDefault", disabled: disabled, fontSize: fontSize }, { children: children }), void 0))] }, void 0));
-                case 'Switch':
-                default:
-                    return _jsx(Fragment, {}, void 0);
-            }
-        })() }), void 0));
-};
-export const BKJToggleInputComponentMap = {
-    Switch: BKJToggleInputSwitch,
-    PurplePillRight: BKJToggleInputPill,
-    PurplePillLeft: BKJToggleInputPill,
-    PurpleNoBorderRight: BKJToggleInputPill,
-    PurpleNoBorderLeft: BKJToggleInputPill,
-};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, Fragment, useCallback, useMemo } from 'react';
+import { BKJToggleButton, BKJToggleInputPillLabelWrapper, BKJToggleInputWrapper, BKJToggleSliderTrack, StyledButton, StyledCheckbox, } from './BKJToggleInput.styled.js';
+const BKJToggleInputSwitch = forwardRef(({ onChange, name, checked, disabled, ...rest }, ref) => {
+    const handleChange = useCallback(() => {
+        !disabled && onChange({ target: { name, value: !Boolean(checked) } });
+    }, [name, onChange, checked, disabled]);
+    const isSelected = useMemo(() => !!checked, [checked]);
+    return (_jsxs(BKJToggleInputWrapper, Object.assign({ ref: ref, onMouseDown: handleChange }, rest, { children: [_jsx(BKJToggleButton, { isSelected: isSelected, disabled: disabled }, void 0),
+            _jsx(BKJToggleSliderTrack, { isSelected: isSelected, disabled: disabled }, void 0)] }), void 0));
+});
+const BKJToggleInputPill = ({ variant, onChange, width, minWidth, checked, children, disabled, name, fontSize, }) => {
+    const handleChange = useCallback((event) => {
+        if (!disabled) {
+            const nextValue = !checked;
+            onChange({
+                ...event,
+                target: {
+                    ...event.target,
+                    name,
+                    value: nextValue,
+                    checked: nextValue,
+                },
+            });
+        }
+    }, [disabled, checked, onChange, name]);
+    const ButtonVariantMap = {
+        PurplePillLeft: checked ? 'PurplePill' : 'PurplePillOutlined',
+        PurplePillRight: checked ? 'PurplePill' : 'PurplePillOutlined',
+        PurpleNoBorderLeft: 'NoStyles',
+        PurpleNoBorderRight: 'NoStyles',
+        Switch: 'NoStyles',
+    };
+    return (_jsx(StyledButton, Object.assign({ onClick: handleChange, variant: ButtonVariantMap[variant], width: width, minWidth: minWidth, disabled: disabled }, { children: (() => {
+            switch (variant) {
+                case 'PurplePillLeft':
+                case 'PurplePillRight':
+                    return (_jsxs(Fragment, { children: [variant === 'PurplePillLeft' && (_jsx(BKJToggleInputPillLabelWrapper, Object.assign({ fontSize: fontSize }, { children: children }), void 0)),
+                            _jsx(StyledCheckbox, { name: name, variant: "PurpleOutlined", isLeft: variant === 'PurplePillLeft', onChange: handleChange, readOnly: true, value: checked }, void 0),
+                            variant === 'PurplePillRight' && (_jsx(BKJToggleInputPillLabelWrapper, Object.assign({ fontSize: fontSize }, { children: children }), void 0))] }, void 0));
+                case 'PurpleNoBorderLeft':
+                case 'PurpleNoBorderRight':
+                    return (_jsxs(Fragment, { children: [variant === 'PurpleNoBorderLeft' && (_jsx(BKJToggleInputPillLabelWrapper, Object.assign({ color: "PrimaryDefault", disabled: disabled, fontSize: fontSize }, { children: children }), void 0)),
+                            _jsx(StyledCheckbox, { name: name, variant: "PurpleSolid", disabled: disabled, isLeft: variant === 'PurpleNoBorderLeft', onChange: handleChange, readOnly: true, value: checked }, void 0),
+                            variant === 'PurpleNoBorderRight' && (_jsx(BKJToggleInputPillLabelWrapper, Object.assign({ color: "PrimaryDefault", disabled: disabled, fontSize: fontSize }, { children: children }), void 0))] }, void 0));
+                case 'Switch':
+                default:
+                    return _jsx(Fragment, {}, void 0);
+            }
+        })() }), void 0));
+};
+export const BKJToggleInputComponentMap = {
+    Switch: BKJToggleInputSwitch,
+    PurplePillRight: BKJToggleInputPill,
+    PurplePillLeft: BKJToggleInputPill,
+    PurpleNoBorderRight: BKJToggleInputPill,
+    PurpleNoBorderLeft: BKJToggleInputPill,
+};
 //# sourceMappingURL=BKJToggleInput.constants.js.map

package/lib/components/BKJToggleInput/BKJToggleInput.d.ts

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

package/lib/components/BKJToggleInput/BKJToggleInput.js

@@ -1,7 +1,7 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { BKJToggleInputComponentMap } from './BKJToggleInput.constants.js';
-export const BKJToggleInput = ({ variant, children, ...rest }) => {
-    const Component = BKJToggleInputComponentMap[variant];
-    return (_jsx(Component, Object.assign({}, rest, { variant: variant }, { children: children }), void 0));
-};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { BKJToggleInputComponentMap } from './BKJToggleInput.constants.js';
+export const BKJToggleInput = ({ variant, children, ...rest }) => {
+    const Component = BKJToggleInputComponentMap[variant];
+    return (_jsx(Component, Object.assign({}, rest, { variant: variant }, { children: children }), void 0));
+};
 //# sourceMappingURL=BKJToggleInput.js.map

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

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

package/lib/components/BKJToggleInput/BKJToggleInput.stories.js

@@ -1,75 +1,75 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import { BKJToggleInput } from './BKJToggleInput.js';
-export default {
-    title: 'Input Elements/BKJToggleInput',
-    component: BKJToggleInput,
-    argTypes: {
-        variant: {
-            name: 'Variation',
-            control: {
-                type: 'select',
-            },
-            option: [
-                'Switch',
-                'PurplePillRight',
-                'PurplePillLeft',
-                'PurpleNoBorderRight',
-                'PurpleNoBorderLeft',
-            ],
-        },
-        children: {
-            name: 'Label',
-            control: 'text',
-        },
-        checked: {
-            table: { disable: true },
-        },
-        name: {
-            table: { disable: true },
-        },
-        onChange: {
-            table: { disable: true },
-        },
-        minWidth: {
-            name: 'Minimum Width',
-            control: {
-                type: 'text',
-                default: '192px',
-            },
-        },
-        width: {
-            name: 'Width',
-            control: {
-                type: 'text',
-                default: '192px',
-            },
-        },
-        disabled: {
-            name: 'Disabled',
-            control: {
-                type: 'boolean',
-                default: false,
-            },
-        },
-    },
-};
-const Template = ({ children, ...props }) => {
-    const [isActive, setActive] = useState(props.checked);
-    function onChange(event) {
-        setActive(event.target.value);
-    }
-    useEffect(() => {
-        setActive(props.checked);
-    }, [props.checked]);
-    return (_jsx(BKJToggleInput, Object.assign({}, props, { name: "test", checked: isActive, onChange: onChange }, { children: children }), void 0));
-};
-export const Default = Template.bind({});
-Default.args = {
-    children: 'View all facilities',
-    width: 'auto',
-    name: 'viewAllFacilities',
-    minWidth: 'auto',
-    variant: 'PurplePillLeft',
-};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { BKJToggleInput } from './BKJToggleInput.js';
+export default {
+    title: 'Input Elements/BKJToggleInput',
+    component: BKJToggleInput,
+    argTypes: {
+        variant: {
+            name: 'Variation',
+            control: {
+                type: 'select',
+            },
+            option: [
+                'Switch',
+                'PurplePillRight',
+                'PurplePillLeft',
+                'PurpleNoBorderRight',
+                'PurpleNoBorderLeft',
+            ],
+        },
+        children: {
+            name: 'Label',
+            control: 'text',
+        },
+        checked: {
+            table: { disable: true },
+        },
+        name: {
+            table: { disable: true },
+        },
+        onChange: {
+            table: { disable: true },
+        },
+        minWidth: {
+            name: 'Minimum Width',
+            control: {
+                type: 'text',
+                default: '192px',
+            },
+        },
+        width: {
+            name: 'Width',
+            control: {
+                type: 'text',
+                default: '192px',
+            },
+        },
+        disabled: {
+            name: 'Disabled',
+            control: {
+                type: 'boolean',
+                default: false,
+            },
+        },
+    },
+};
+const Template = ({ children, ...props }) => {
+    const [isActive, setActive] = useState(props.checked);
+    function onChange(event) {
+        setActive(event.target.value);
+    }
+    useEffect(() => {
+        setActive(props.checked);
+    }, [props.checked]);
+    return (_jsx(BKJToggleInput, Object.assign({}, props, { name: "test", checked: isActive, onChange: onChange }, { children: children }), void 0));
+};
+export const Default = Template.bind({});
+Default.args = {
+    children: 'View all facilities',
+    width: 'auto',
+    name: 'viewAllFacilities',
+    minWidth: 'auto',
+    variant: 'PurplePillLeft',
+};
 //# sourceMappingURL=BKJToggleInput.stories.js.map

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

@@ -1,23 +1,23 @@
-import { ForwardedRef, Ref } from 'react';
-import { IBKJThemeColor } from '../../providers/index.js';
-interface IBKJToggleInputWrapper {
-    ref: ForwardedRef<HTMLElement> | Ref<HTMLElement> | HTMLElement;
-}
-export declare const StyledButton: import("styled-components").StyledComponent<import("react").FC<import("../BKJButton/BKJButton.types.js").IBKJButtonProps>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledCheckbox: any;
-export declare const BKJToggleInputWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, IBKJToggleInputWrapper, never>;
-export declare const BKJToggleSliderTrack: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    isSelected: boolean;
-    disabled?: boolean | undefined;
-}, never>;
-export declare const BKJToggleButton: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    isSelected: boolean;
-    disabled?: boolean | undefined;
-}, never>;
-export declare const BKJToggleInputPillLabelWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    color?: keyof IBKJThemeColor | undefined;
-    disabled?: boolean | undefined;
-    fontSize?: number | undefined;
-}, never>;
-export {};
+import { ForwardedRef, Ref } from 'react';
+import { IBKJThemeColor } from '../../providers/index.js';
+interface IBKJToggleInputWrapper {
+    ref: ForwardedRef<HTMLElement> | Ref<HTMLElement> | HTMLElement;
+}
+export declare const StyledButton: import("styled-components").StyledComponent<import("react").FC<import("../BKJButton/BKJButton.types.js").IBKJButtonProps>, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledCheckbox: any;
+export declare const BKJToggleInputWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, IBKJToggleInputWrapper, never>;
+export declare const BKJToggleSliderTrack: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+    isSelected: boolean;
+    disabled?: boolean | undefined;
+}, never>;
+export declare const BKJToggleButton: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+    isSelected: boolean;
+    disabled?: boolean | undefined;
+}, never>;
+export declare const BKJToggleInputPillLabelWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+    color?: keyof IBKJThemeColor | undefined;
+    disabled?: boolean | undefined;
+    fontSize?: number | undefined;
+}, never>;
+export {};
 //# sourceMappingURL=BKJToggleInput.styled.d.ts.map

package/lib/components/BKJToggleInput/BKJToggleInput.styled.js

@@ -1,102 +1,102 @@
-import styled, { css } from 'styled-components';
-import { BKJButton } from '../BKJButton/index.js';
-import { BKJCheckbox } from '../BKJCheckbox/index.js';
-export const StyledButton = styled(BKJButton) `
-  padding: 0 18px !important;
-`;
-export const StyledCheckbox = styled(BKJCheckbox) `
-  ${({ isLeft }) => isLeft
-    ? css `
-          margin-left: 8px !important;
-          margin-right: 0px !important;
-          div {
-            margin: 0px !important;
-          }
-        `
-    : css `
-          margin-right: 8px !important;
-          margin-left: 0px !important;
-          div {
-            margin: 0px !important;
-          }
-        `}
-`;
-export const BKJToggleInputWrapper = styled.div `
-  position: relative;
-  height: 28px;
-  min-height: 28px;
-  max-height: 28px;
-  width: 80px;
-  min-width: 80px;
-  max-width: 80px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  overflow: visible;
-`;
-export const BKJToggleSliderTrack = styled.div `
-  background-color: ${({ theme }) => theme.colors.Grey6};
-  box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3);
-  border-radius: 18px;
-  width: 100%;
-  height: 100%;
-  &:hover {
-    cursor: pointer;
-  }
-  transition: background-color linear 100ms;
-  ${({ disabled }) => disabled &&
-    css `
-      background-color: ${({ theme }) => theme.colors.Grey4};
-    `}
-  ${({ isSelected, disabled }) => {
-    if (isSelected) {
-        if (disabled) {
-            return css `
-          background-color: ${({ theme }) => theme.colors.SecondaryAcceptedDefault};
-        `;
-        }
-        else {
-            return css `
-          background-color: ${({ theme }) => theme.colors.AccentGreen};
-        `;
-        }
-    }
-    return;
-}}
-`;
-export const BKJToggleButton = styled.div `
-  position: absolute;
-  left: 0%;
-  height: 36px;
-  min-height: 36px;
-  max-height: 36px;
-  width: 36px;
-  min-width: 36px;
-  max-width: 36px;
-  background-color: ${({ theme, disabled }) => disabled ? theme.colors.Grey1 : theme.colors.White};
-  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.2);
-  border-radius: 50%;
-  &:hover {
-    cursor: pointer;
-  }
-
-  transition: left ease-in 100ms;
-
-  ${({ isSelected }) => isSelected &&
-    css `
-      left: calc(100% - 36px);
-    `}
-`;
-export const BKJToggleInputPillLabelWrapper = styled.div `
-  ${({ theme }) => theme.common.Ellipsis};
-  ${({ color, disabled }) => !disabled &&
-    color &&
-    css `
-      color: ${({ theme }) => theme.colors[color]};
-    `}
-  ${({ fontSize }) => fontSize &&
-    css `
-      font-size: ${fontSize}px;
-    `}
-`;
+import styled, { css } from 'styled-components';
+import { BKJButton } from '../BKJButton/index.js';
+import { BKJCheckbox } from '../BKJCheckbox/index.js';
+export const StyledButton = styled(BKJButton) `
+  padding: 0 18px !important;
+`;
+export const StyledCheckbox = styled(BKJCheckbox) `
+  ${({ isLeft }) => isLeft
+    ? css `
+          margin-left: 8px !important;
+          margin-right: 0px !important;
+          div {
+            margin: 0px !important;
+          }
+        `
+    : css `
+          margin-right: 8px !important;
+          margin-left: 0px !important;
+          div {
+            margin: 0px !important;
+          }
+        `}
+`;
+export const BKJToggleInputWrapper = styled.div `
+  position: relative;
+  height: 28px;
+  min-height: 28px;
+  max-height: 28px;
+  width: 80px;
+  min-width: 80px;
+  max-width: 80px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  overflow: visible;
+`;
+export const BKJToggleSliderTrack = styled.div `
+  background-color: ${({ theme }) => theme.colors.Grey6};
+  box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3);
+  border-radius: 18px;
+  width: 100%;
+  height: 100%;
+  &:hover {
+    cursor: pointer;
+  }
+  transition: background-color linear 100ms;
+  ${({ disabled }) => disabled &&
+    css `
+      background-color: ${({ theme }) => theme.colors.Grey4};
+    `}
+  ${({ isSelected, disabled }) => {
+    if (isSelected) {
+        if (disabled) {
+            return css `
+          background-color: ${({ theme }) => theme.colors.SecondaryAcceptedDefault};
+        `;
+        }
+        else {
+            return css `
+          background-color: ${({ theme }) => theme.colors.AccentGreen};
+        `;
+        }
+    }
+    return;
+}}
+`;
+export const BKJToggleButton = styled.div `
+  position: absolute;
+  left: 0%;
+  height: 36px;
+  min-height: 36px;
+  max-height: 36px;
+  width: 36px;
+  min-width: 36px;
+  max-width: 36px;
+  background-color: ${({ theme, disabled }) => disabled ? theme.colors.Grey1 : theme.colors.White};
+  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.2);
+  border-radius: 50%;
+  &:hover {
+    cursor: pointer;
+  }
+
+  transition: left ease-in 100ms;
+
+  ${({ isSelected }) => isSelected &&
+    css `
+      left: calc(100% - 36px);
+    `}
+`;
+export const BKJToggleInputPillLabelWrapper = styled.div `
+  ${({ theme }) => theme.common.Ellipsis};
+  ${({ color, disabled }) => !disabled &&
+    color &&
+    css `
+      color: ${({ theme }) => theme.colors[color]};
+    `}
+  ${({ fontSize }) => fontSize &&
+    css `
+      font-size: ${fontSize}px;
+    `}
+`;
 //# sourceMappingURL=BKJToggleInput.styled.js.map