@bookjane2/bookjane-design-library 7.2.8 → 7.3.0

package/lib/components/BKJInteractiveMap/BKJInteractiveMap.stories.js

@@ -1,117 +1,117 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import axios from 'axios';
-import { isArray, isNumber } from '../../common.types.js';
-import { BKJInteractiveMap } from '../BKJInteractiveMap/BKJInteractiveMap.js';
-import { Flex } from '../Flex/index.js';
-import { useCallback, useEffect, useRef, useState } from 'react';
-export default {
-    title: 'Basic Elements/BKJInteractiveMap',
-    component: BKJInteractiveMap,
-    argTypes: {},
-};
-const Template = () => {
-    const [url, setUrl] = useState('https://data.police.uk/api/crimes-street/all-crime?lat=52.629729&lng=-1.131592&date=2019-10');
-    const [isLoading, setLoading] = useState(true);
-    const debounceRef = useRef(null);
-    const [, setMap] = useState(null);
-    const [points, setData] = useState([]);
-    useEffect(() => {
-        main();
-        async function main() {
-            try {
-                const response = await axios.get(url);
-                if (isArray(response.data)) {
-                    setData(response.data.map((crime) => {
-                        return {
-                            type: 'Feature',
-                            id: crime['id'],
-                            properties: {
-                                numShotsFired: Math.floor(Math.random() * 2000) + 1,
-                                ...crime,
-                                id: crime['id'],
-                            },
-                            geometry: {
-                                type: 'Point',
-                                coordinates: [
-                                    Number.parseFloat(crime['location'].longitude),
-                                    Number.parseFloat(crime['location'].latitude),
-                                ],
-                            },
-                        };
-                    }));
-                }
-            }
-            catch (error) {
-            }
-            finally {
-                setLoading(false);
-            }
-        }
-    }, [url]);
-    const onBoundsChange = useCallback((event) => {
-        if (debounceRef.current)
-            window.clearTimeout(debounceRef.current);
-        setLoading(true);
-        debounceRef.current = window.setTimeout(() => {
-            setUrl(`https://data.police.uk/api/crimes-street/all-crime?poly=${event.target.value.northEast.latitude},${event.target.value.northEast.longitude}:${event.target.value.northWest.latitude},${event.target.value.northWest.longitude}:${event.target.value.southWest.latitude},${event.target.value.southWest.longitude}:${event.target.value.southEast.latitude},${event.target.value.southEast.longitude}&date=2019-10`);
-        }, 100);
-        setLoading(false);
-    }, []);
-    return (_jsx(Flex, Object.assign({ width: "100%", height: "100vh" }, { children: _jsx(BKJInteractiveMap, { setMapInstance: setMap, name: "withinBounds", apiKey: process.env['GOOGLE_MAPS_API_KEY'], defaultCenter: { lat: 52.629729, lng: -1.131592 }, clusterMapper: (cluster) => {
-                return { numShotsFired: cluster.numShotsFired };
-            }, clusterReduce: (accumulated, props) => {
-                accumulated.numShotsFired += props.numShotsFired;
-            }, pinComponent: (props) => {
-                // console.log('PIN', props);
-                const { children } = props;
-                return (_jsx("div", Object.assign({ style: {
-                        backgroundColor: 'white',
-                        borderRadius: '50%',
-                        color: 'white',
-                        width: '32px',
-                        minWidth: '32px',
-                        maxWidth: '32px',
-                        height: '32px',
-                        minHeight: '32px',
-                        maxHeight: '32px',
-                        display: 'flex',
-                        justifyContent: 'center',
-                        alignItems: 'center',
-                        overflow: 'hidden',
-                        lineHeight: 0,
-                        cursor: 'pointer',
-                        flexDirection: 'column',
-                        border: '1px solid grey',
-                    } }, { children: children }), props.properties.id));
-            }, clusterComponent: (props) => {
-                console.log('CLUSTER', props);
-                return (_jsx("div", Object.assign({ style: {
-                        flexDirection: 'column',
-                        backgroundColor: 'purple',
-                        borderRadius: '50%',
-                        color: 'white',
-                        width: '32px',
-                        minWidth: '32px',
-                        maxWidth: '32px',
-                        height: '32px',
-                        minHeight: '32px',
-                        maxHeight: '32px',
-                        display: 'flex',
-                        justifyContent: 'center',
-                        alignItems: 'center',
-                        overflow: 'hidden',
-                        lineHeight: 0,
-                        cursor: 'pointer',
-                        fontWeight: 'bold',
-                    }, onClick: props.onClick }, { children: props.childNodes.reduce((acc, { properties }) => {
-                        if (isNumber(properties.numShotsFired)) {
-                            return acc + properties.numShotsFired;
-                        }
-                        else
-                            return acc;
-                    }, 0) }), props.id));
-            }, points: points, onChange: onBoundsChange, isLoading: isLoading, clusterRadius: 75 }, void 0) }), void 0));
-};
-export const Default = Template.bind({});
-Default.args = {};
+import { jsx as _jsx } from "react/jsx-runtime";
+import axios from 'axios';
+import { isArray, isNumber } from '../../common.types.js';
+import { BKJInteractiveMap } from '../BKJInteractiveMap/BKJInteractiveMap.js';
+import { Flex } from '../Flex/index.js';
+import { useCallback, useEffect, useRef, useState } from 'react';
+export default {
+    title: 'Basic Elements/BKJInteractiveMap',
+    component: BKJInteractiveMap,
+    argTypes: {},
+};
+const Template = () => {
+    const [url, setUrl] = useState('https://data.police.uk/api/crimes-street/all-crime?lat=52.629729&lng=-1.131592&date=2019-10');
+    const [isLoading, setLoading] = useState(true);
+    const debounceRef = useRef(null);
+    const [, setMap] = useState(null);
+    const [points, setData] = useState([]);
+    useEffect(() => {
+        main();
+        async function main() {
+            try {
+                const response = await axios.get(url);
+                if (isArray(response.data)) {
+                    setData(response.data.map((crime) => {
+                        return {
+                            type: 'Feature',
+                            id: crime['id'],
+                            properties: {
+                                numShotsFired: Math.floor(Math.random() * 2000) + 1,
+                                ...crime,
+                                id: crime['id'],
+                            },
+                            geometry: {
+                                type: 'Point',
+                                coordinates: [
+                                    Number.parseFloat(crime['location'].longitude),
+                                    Number.parseFloat(crime['location'].latitude),
+                                ],
+                            },
+                        };
+                    }));
+                }
+            }
+            catch (error) {
+            }
+            finally {
+                setLoading(false);
+            }
+        }
+    }, [url]);
+    const onBoundsChange = useCallback((event) => {
+        if (debounceRef.current)
+            window.clearTimeout(debounceRef.current);
+        setLoading(true);
+        debounceRef.current = window.setTimeout(() => {
+            setUrl(`https://data.police.uk/api/crimes-street/all-crime?poly=${event.target.value.northEast.latitude},${event.target.value.northEast.longitude}:${event.target.value.northWest.latitude},${event.target.value.northWest.longitude}:${event.target.value.southWest.latitude},${event.target.value.southWest.longitude}:${event.target.value.southEast.latitude},${event.target.value.southEast.longitude}&date=2019-10`);
+        }, 100);
+        setLoading(false);
+    }, []);
+    return (_jsx(Flex, Object.assign({ width: "100%", height: "100vh" }, { children: _jsx(BKJInteractiveMap, { setMapInstance: setMap, name: "withinBounds", apiKey: process.env['GOOGLE_MAPS_API_KEY'], defaultCenter: { lat: 52.629729, lng: -1.131592 }, clusterMapper: (cluster) => {
+                return { numShotsFired: cluster.numShotsFired };
+            }, clusterReduce: (accumulated, props) => {
+                accumulated.numShotsFired += props.numShotsFired;
+            }, pinComponent: (props) => {
+                // console.log('PIN', props);
+                const { children } = props;
+                return (_jsx("div", Object.assign({ style: {
+                        backgroundColor: 'white',
+                        borderRadius: '50%',
+                        color: 'white',
+                        width: '32px',
+                        minWidth: '32px',
+                        maxWidth: '32px',
+                        height: '32px',
+                        minHeight: '32px',
+                        maxHeight: '32px',
+                        display: 'flex',
+                        justifyContent: 'center',
+                        alignItems: 'center',
+                        overflow: 'hidden',
+                        lineHeight: 0,
+                        cursor: 'pointer',
+                        flexDirection: 'column',
+                        border: '1px solid grey',
+                    } }, { children: children }), props.properties.id));
+            }, clusterComponent: (props) => {
+                console.log('CLUSTER', props);
+                return (_jsx("div", Object.assign({ style: {
+                        flexDirection: 'column',
+                        backgroundColor: 'purple',
+                        borderRadius: '50%',
+                        color: 'white',
+                        width: '32px',
+                        minWidth: '32px',
+                        maxWidth: '32px',
+                        height: '32px',
+                        minHeight: '32px',
+                        maxHeight: '32px',
+                        display: 'flex',
+                        justifyContent: 'center',
+                        alignItems: 'center',
+                        overflow: 'hidden',
+                        lineHeight: 0,
+                        cursor: 'pointer',
+                        fontWeight: 'bold',
+                    }, onClick: props.onClick }, { children: props.childNodes.reduce((acc, { properties }) => {
+                        if (isNumber(properties.numShotsFired)) {
+                            return acc + properties.numShotsFired;
+                        }
+                        else
+                            return acc;
+                    }, 0) }), props.id));
+            }, points: points, onChange: onBoundsChange, isLoading: isLoading, clusterRadius: 75 }, void 0) }), void 0));
+};
+export const Default = Template.bind({});
+Default.args = {};
 //# sourceMappingURL=BKJInteractiveMap.stories.js.map

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

@@ -1,86 +1,86 @@
-/// <reference types="google.maps" />
-import { IBKJChangeEvent } from '../../common.types.js';
-import { BBox, Position } from 'geojson';
-import GoogleMapReact from 'google-map-react';
-import { FC, MouseEventHandler } from 'react';
-import Supercluster from 'supercluster';
-export declare type IPinProps<TData, TAccumulator> = {
-    type: 'Feature';
-    geometry: {
-        type: 'Point';
-        coordinates: Position;
-    };
-    properties: TData & TAccumulator;
-};
-export interface IBKJInteractiveMapOnChangeEvent<TInputName extends string> extends IBKJChangeEvent<TInputName, Record<'northWest' | 'northEast' | 'southWest' | 'southEast', {
-    latitude: number;
-    longitude: number;
-}>> {
-}
-export declare type IBKJInteractiveMapOnChangeFn<TInputName extends string> = (event: IBKJInteractiveMapOnChangeEvent<TInputName>) => void;
-declare type PinComponentType<TData, TAccumulator> = FC<IPinProps<TData, TAccumulator>>;
-declare type ClusterComponentType<TData, TAccumulator> = FC<IClusterProps<TData, TAccumulator>>;
-export interface IBKJInteractiveMapProps<TInputName extends string, TData, TAccumulator> extends Omit<GoogleMapReact.Props, 'bootstrapURLKeys' | 'ref' | 'bootstrapURLKeys' | 'yesIWantToUseGoogleMapApiInternals' | 'onGoogleApiLoaded' | 'zoom' | 'onChange'> {
-    apiKey: string;
-    points: Array<IPinProps<TData, TAccumulator>>;
-    isLoading?: boolean;
-    setMapInstance?: (gMapInstance: IBKJInteractiveMapContext<TInputName, TData, TAccumulator>['gMapInstance']) => void;
-    pinComponent: PinComponentType<TData, TAccumulator>;
-    onChange?: IBKJInteractiveMapOnChangeFn<TInputName>;
-    clusterComponent: ClusterComponentType<TData, TAccumulator>;
-    clusterRadius?: number;
-    maxZoom?: number;
-    minZoom?: number;
-    name: TInputName;
-    clusterMapper?: Supercluster.Options<TData & TAccumulator, TAccumulator>['map'];
-    clusterReduce?: Supercluster.Options<TData & TAccumulator, TAccumulator>['reduce'];
-}
-export interface IClusterProps<TData, TAccumulator> {
-    childNodes: IPinProps<TData, TAccumulator>[];
-    type: 'Feature';
-    id: number;
-    properties: ClusterProperties & TData & TAccumulator;
-    geometry: ClusterGeometry;
-    onClick: MouseEventHandler;
-}
-export interface ClusterGeometry {
-    type: string;
-    coordinates: [number, number];
-}
-export interface ClusterProperties {
-    cluster: boolean;
-    cluster_id: number;
-    point_count: number;
-    point_count_abbreviated: number;
-}
-export interface IBKJInteractiveMapContext<TInputName extends string, TData, TAccumulator> extends Pick<IBKJInteractiveMapProps<TInputName, TData, TAccumulator>, 'apiKey' | 'pinComponent' | 'clusterComponent' | 'defaultCenter' | 'defaultZoom'> {
-    maxZoom: number;
-    minZoom: number;
-    gMapInstance: google.maps.Map;
-    gMapsApi: typeof google.maps;
-    onMapChange: (event: GoogleMapReact.ChangeEventValue) => void;
-    bounds: BBox;
-    zoom: number;
-    clusters: TData[];
-    onDrag: (map: google.maps.Map) => void;
-    onDragEnd: (map: google.maps.Map) => void;
-    isLoading: boolean;
-    supercluster: Supercluster<TData & TAccumulator, TAccumulator>;
-    onGoogleApiLoaded: (maps: {
-        map: google.maps.Map;
-        maps: typeof google.maps;
-        ref: Element | null;
-    }) => void;
-    __isLoading__?: boolean;
-}
-export declare type IBKJInteractiveMapContextAction = {
-    type: 'MapChangeEvent';
-    payload: {
-        bounds: BBox;
-        zoom: number;
-    };
-};
-export declare function isClusterType<TData, TAccumulator>(arg: any): arg is IClusterProps<TData, TAccumulator>;
-export declare function isPointType<TData, TAccumulator>(arg: any): arg is IPinProps<TData, TAccumulator>;
-export {};
+/// <reference types="google.maps" />
+import { IBKJChangeEvent } from '../../common.types.js';
+import { BBox, Position } from 'geojson';
+import GoogleMapReact from 'google-map-react';
+import { FC, MouseEventHandler } from 'react';
+import Supercluster from 'supercluster';
+export declare type IPinProps<TData, TAccumulator> = {
+    type: 'Feature';
+    geometry: {
+        type: 'Point';
+        coordinates: Position;
+    };
+    properties: TData & TAccumulator;
+};
+export interface IBKJInteractiveMapOnChangeEvent<TInputName extends string> extends IBKJChangeEvent<TInputName, Record<'northWest' | 'northEast' | 'southWest' | 'southEast', {
+    latitude: number;
+    longitude: number;
+}>> {
+}
+export declare type IBKJInteractiveMapOnChangeFn<TInputName extends string> = (event: IBKJInteractiveMapOnChangeEvent<TInputName>) => void;
+declare type PinComponentType<TData, TAccumulator> = FC<IPinProps<TData, TAccumulator>>;
+declare type ClusterComponentType<TData, TAccumulator> = FC<IClusterProps<TData, TAccumulator>>;
+export interface IBKJInteractiveMapProps<TInputName extends string, TData, TAccumulator> extends Omit<GoogleMapReact.Props, 'bootstrapURLKeys' | 'ref' | 'bootstrapURLKeys' | 'yesIWantToUseGoogleMapApiInternals' | 'onGoogleApiLoaded' | 'zoom' | 'onChange'> {
+    apiKey: string;
+    points: Array<IPinProps<TData, TAccumulator>>;
+    isLoading?: boolean;
+    setMapInstance?: (gMapInstance: IBKJInteractiveMapContext<TInputName, TData, TAccumulator>['gMapInstance']) => void;
+    pinComponent: PinComponentType<TData, TAccumulator>;
+    onChange?: IBKJInteractiveMapOnChangeFn<TInputName>;
+    clusterComponent: ClusterComponentType<TData, TAccumulator>;
+    clusterRadius?: number;
+    maxZoom?: number;
+    minZoom?: number;
+    name: TInputName;
+    clusterMapper?: Supercluster.Options<TData & TAccumulator, TAccumulator>['map'];
+    clusterReduce?: Supercluster.Options<TData & TAccumulator, TAccumulator>['reduce'];
+}
+export interface IClusterProps<TData, TAccumulator> {
+    childNodes: IPinProps<TData, TAccumulator>[];
+    type: 'Feature';
+    id: number;
+    properties: ClusterProperties & TData & TAccumulator;
+    geometry: ClusterGeometry;
+    onClick: MouseEventHandler;
+}
+export interface ClusterGeometry {
+    type: string;
+    coordinates: [number, number];
+}
+export interface ClusterProperties {
+    cluster: boolean;
+    cluster_id: number;
+    point_count: number;
+    point_count_abbreviated: number;
+}
+export interface IBKJInteractiveMapContext<TInputName extends string, TData, TAccumulator> extends Pick<IBKJInteractiveMapProps<TInputName, TData, TAccumulator>, 'apiKey' | 'pinComponent' | 'clusterComponent' | 'defaultCenter' | 'defaultZoom'> {
+    maxZoom: number;
+    minZoom: number;
+    gMapInstance: google.maps.Map;
+    gMapsApi: typeof google.maps;
+    onMapChange: (event: GoogleMapReact.ChangeEventValue) => void;
+    bounds: BBox;
+    zoom: number;
+    clusters: TData[];
+    onDrag: (map: google.maps.Map) => void;
+    onDragEnd: (map: google.maps.Map) => void;
+    isLoading: boolean;
+    supercluster: Supercluster<TData & TAccumulator, TAccumulator>;
+    onGoogleApiLoaded: (maps: {
+        map: google.maps.Map;
+        maps: typeof google.maps;
+        ref: Element | null;
+    }) => void;
+    __isLoading__?: boolean;
+}
+export declare type IBKJInteractiveMapContextAction = {
+    type: 'MapChangeEvent';
+    payload: {
+        bounds: BBox;
+        zoom: number;
+    };
+};
+export declare function isClusterType<TData, TAccumulator>(arg: any): arg is IClusterProps<TData, TAccumulator>;
+export declare function isPointType<TData, TAccumulator>(arg: any): arg is IPinProps<TData, TAccumulator>;
+export {};
 //# sourceMappingURL=BKJInteractiveMap.types.d.ts.map

package/lib/components/BKJInteractiveMap/BKJInteractiveMap.types.js

@@ -1,11 +1,11 @@
-export function isClusterType(arg) {
-    if (!!arg?.properties?.cluster === true)
-        return true;
-    return false;
-}
-export function isPointType(arg) {
-    if (arg?.geometry?.type === 'Point')
-        return true;
-    return false;
-}
+export function isClusterType(arg) {
+    if (!!arg?.properties?.cluster === true)
+        return true;
+    return false;
+}
+export function isPointType(arg) {
+    if (arg?.geometry?.type === 'Point')
+        return true;
+    return false;
+}
 //# sourceMappingURL=BKJInteractiveMap.types.js.map

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

@@ -1,2 +1,2 @@
-export * from './BKJInteractiveMap.js';
+export * from './BKJInteractiveMap.js';
 //# sourceMappingURL=index.d.ts.map

package/lib/components/BKJInteractiveMap/index.js

@@ -1,2 +1,2 @@
-export * from './BKJInteractiveMap.js';
+export * from './BKJInteractiveMap.js';
 //# sourceMappingURL=index.js.map

package/lib/components/BKJListItem/BKJListItem.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
-import { IBKJListItemProps } from './BKJListItem.types.js';
-export declare const BKJListItem: import("react").ForwardRefExoticComponent<IBKJListItemProps & import("react").RefAttributes<HTMLLIElement>>;
+/// <reference types="react" />
+import { IBKJListItemProps } from './BKJListItem.types.js';
+export declare const BKJListItem: import("react").ForwardRefExoticComponent<IBKJListItemProps & import("react").RefAttributes<HTMLLIElement>>;
 //# sourceMappingURL=BKJListItem.d.ts.map

package/lib/components/BKJListItem/BKJListItem.js

@@ -1,19 +1,19 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useCallback, useMemo } from 'react';
-import { BKJCheckbox } from '../BKJCheckbox/index.js';
-import { ListItemSubLabelText, ListItemText } from '../common/ListItemBaseCSS/index.js';
-import { ListItemWrapper } from './BKJListItem.styled.js';
-export const BKJListItem = forwardRef((props, ref) => {
-    const { onChange, name, subLabel, label, className, variant = 'LeftAlignAlternatingBackgroundColor', checkBoxVariant = 'GreenNoBorder', disabled = false, isTargeted = false, selected, value, onClick, id, index, type = 'Standard', ...rest } = props;
-    const checked = useMemo(() => selected?.some((str) => String(str) === String(value)), [selected, value]);
-    const handleClick = useCallback((event) => {
-        if (onClick)
-            onClick({ ...event, target: { checked, index, id, name, value, label } });
-        if (onChange)
-            onChange({ ...event, target: { checked, index, id, name, value, label } });
-    }, [checked, id, index, label, name, onChange, onClick, value]);
-    return (_jsxs(ListItemWrapper, Object.assign({}, rest, { role: "option", variant: variant, onClick: handleClick, className: className, checked: checked, disabled: disabled, isTargeted: isTargeted, ref: ref, type: type }, { children: [_jsx(ListItemText, { children: label }, void 0),
-            !!subLabel && _jsx(ListItemSubLabelText, { children: subLabel }, void 0),
-            _jsx(BKJCheckbox, { variant: checkBoxVariant, value: checked }, void 0)] }), void 0));
-});
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useCallback, useMemo } from 'react';
+import { BKJCheckbox } from '../BKJCheckbox/index.js';
+import { ListItemSubLabelText, ListItemText } from '../common/ListItemBaseCSS/index.js';
+import { ListItemWrapper } from './BKJListItem.styled.js';
+export const BKJListItem = forwardRef((props, ref) => {
+    const { onChange, name, subLabel, label, className, variant = 'LeftAlignAlternatingBackgroundColor', checkBoxVariant = 'GreenNoBorder', disabled = false, isTargeted = false, selected, value, onClick, id, index, type = 'Standard', ...rest } = props;
+    const checked = useMemo(() => selected?.some((str) => String(str) === String(value)), [selected, value]);
+    const handleClick = useCallback((event) => {
+        if (onClick)
+            onClick({ ...event, target: { checked, index, id, name, value, label } });
+        if (onChange)
+            onChange({ ...event, target: { checked, index, id, name, value, label } });
+    }, [checked, id, index, label, name, onChange, onClick, value]);
+    return (_jsxs(ListItemWrapper, Object.assign({}, rest, { role: "option", variant: variant, onClick: handleClick, className: className, checked: checked, disabled: disabled, isTargeted: isTargeted, ref: ref, type: type }, { children: [_jsx(ListItemText, { children: label }, void 0),
+            !!subLabel && _jsx(ListItemSubLabelText, { children: subLabel }, void 0),
+            _jsx(BKJCheckbox, { variant: checkBoxVariant, value: checked }, void 0)] }), void 0));
+});
 //# sourceMappingURL=BKJListItem.js.map

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

@@ -1,10 +1,10 @@
-/// <reference types="react" />
-import { Story } from '@storybook/react';
-import { IBKJListItemProps } from './BKJListItem.types.js';
-declare const _default: {
-    title: string;
-    component: import("react").ForwardRefExoticComponent<IBKJListItemProps & import("react").RefAttributes<HTMLLIElement>>;
-};
-export default _default;
-export declare const Default: Story<IBKJListItemProps>;
+/// <reference types="react" />
+import { Story } from '@storybook/react';
+import { IBKJListItemProps } from './BKJListItem.types.js';
+declare const _default: {
+    title: string;
+    component: import("react").ForwardRefExoticComponent<IBKJListItemProps & import("react").RefAttributes<HTMLLIElement>>;
+};
+export default _default;
+export declare const Default: Story<IBKJListItemProps>;
 //# sourceMappingURL=BKJListItem.stories.d.ts.map

package/lib/components/BKJListItem/BKJListItem.stories.js

@@ -1,9 +1,9 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { BKJListItem } from './BKJListItem.js';
-export default {
-    title: 'List Elements/BKJListItem',
-    component: BKJListItem,
-};
-const Template = (props) => (_jsx(BKJListItem, Object.assign({}, props, { children: "Item Name" }), void 0));
-export const Default = Template.bind({});
+import { jsx as _jsx } from "react/jsx-runtime";
+import { BKJListItem } from './BKJListItem.js';
+export default {
+    title: 'List Elements/BKJListItem',
+    component: BKJListItem,
+};
+const Template = (props) => (_jsx(BKJListItem, Object.assign({}, props, { children: "Item Name" }), void 0));
+export const Default = Template.bind({});
 //# sourceMappingURL=BKJListItem.stories.js.map

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

@@ -1,4 +1,4 @@
-import { IListItemWrapperProps } from './BKJListItem.types.js';
-export declare const ListItemWrapper: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, IListItemWrapperProps, never>;
-export declare const ListItemCheckWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+import { IListItemWrapperProps } from './BKJListItem.types.js';
+export declare const ListItemWrapper: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, IListItemWrapperProps, never>;
+export declare const ListItemCheckWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 //# sourceMappingURL=BKJListItem.styled.d.ts.map