trepur_components 1.0.0 → 1.0.1

package/dist/src/lib/components/Button/button.stories.js

@@ -1,16 +1,16 @@
 import React from 'react';
 import Button from './index';
 import { action } from '@storybook/addon-actions';
-import { idAndClassName } from '@utils/controls';
+import { idAndClassName } from '../../utils/controls';
 const componentMeta = {
     title: 'Trepur Components/Rupert Bennett/Atoms/Button',
     component: Button,
     parameters: {
         docs: {
             description: {
-                component: 'A Button which can either be internal, external or social as well as a standard design or a slide design.',
-            },
-        },
+                component: 'A Button which can either be internal, external or social as well as a standard design or a slide design.'
+            }
+        }
     },
     argTypes: Object.assign(Object.assign({}, idAndClassName), { onClick: {
             type: { name: 'function', required: false },
@@ -23,44 +23,89 @@ const componentMeta = {
                 defaultValue: { summary: 'undefined' }
             }
         }, hoverText: {
-            type: { name: 'string', required: false },
+            type: {
+                name: 'string',
+                required: false
+            },
             description: 'The text to display when hovering on the component',
             table: {
-                type: { summary: 'string' }
+                type: {
+                    summary: 'string'
+                },
+                defaultValue: {
+                    summary: 'undefined'
+                }
             }
         }, variant: {
-            type: { name: 'string', required: false },
+            type: {
+                name: 'string', required: false
+            },
             options: ['primary', 'secondary'],
             description: 'The variant of button to render',
-            table: { type: { summary: 'primary' }, defaultValue: { summary: 'primary' } },
+            table: {
+                type: {
+                    summary: 'primary'
+                },
+                defaultValue: {
+                    summary: 'primary'
+                }
+            },
             defaultValue: 'primary',
-            control: { type: 'radio' }
+            control: {
+                type: 'radio'
+            }
         }, type: {
-            type: { name: 'string', required: false },
+            type: {
+                name: 'string',
+                required: false
+            },
             options: ['default', 'social', 'icon'],
             description: 'The type of button to render',
-            table: { type: { summary: 'default' }, defaultValue: { summary: 'default' } },
+            table: {
+                type: {
+                    summary: 'default'
+                },
+                defaultValue: {
+                    summary: 'default'
+                }
+            },
             defaultValue: 'default',
             control: { type: 'radio' }
         }, href: {
             type: { name: 'string', required: false },
             description: 'The link attached to the component',
             table: {
-                type: { summary: 'default' }
+                type: {
+                    summary: 'default'
+                },
+                defaultValue: {
+                    summary: 'undefined'
+                }
             }
         }, rounded: {
-            type: { name: 'boolean', required: false },
+            type: {
+                name: 'boolean',
+                required: false
+            },
             description: 'rounds the borders when true',
             defaultValue: 'true'
         }, disabled: {
-            type: { name: 'boolean', required: false },
+            type: {
+                name: 'boolean',
+                required: false
+            },
             description: 'Can the carousel be dragged or not'
         }, isLoading: {
-            type: { name: 'boolean', required: false },
-            description: 'Toggles the loading state of the compnent',
+            type: {
+                name: 'boolean',
+                required: false
+            },
             table: {
-                type: { summary: 'false' }
-            }
+                defaultValue: {
+                    summary: 'false'
+                }
+            },
+            description: 'Toggles the loading state of the compnent'
         }, openInNewTab: {
             type: { name: 'boolean', required: false },
             description: 'Opens the link in a new tab when set to true',
@@ -79,7 +124,7 @@ const componentMeta = {
         children: 'This is a button',
         rounded: true,
         onClick: action('button clicked')
-    },
+    }
 };
 const Template = (args) => React.createElement(Button, Object.assign({}, args));
 export const _Button = Template.bind({});

package/dist/src/lib/components/Button/button.stories.js.map

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

package/dist/src/lib/components/Button/index.js

@@ -8,23 +8,23 @@ const Button = ({ id, className, onClick, hoverText, variant = 'primary', type =
         'px-8': type !== 'social' && type !== 'icon'
     }, 'py-2');
     const loadingClasses = classNames({
-        'invisible': !isLoading,
+        invisible: !isLoading
     }, 'absolute left-2/4 top-1/4 -ml-2');
     const classList = classNames({
         'bg-primary text-white border-white': variant === 'primary',
-        'hover:bg-white hover:text-primary hover:border-primary': disabled === false && variant === 'primary',
+        'hover:bg-white hover:text-primary hover:border-primary': !disabled && variant === 'primary',
         'bg-white text-primary border-primary': variant === 'secondary',
-        'hover:bg-primary hover:text-white hover:border-primary': disabled === false && variant === 'secondary',
-        'opacity-50': disabled === true,
+        'hover:bg-primary hover:text-white hover:border-primary': !disabled && variant === 'secondary',
+        'opacity-50': disabled,
         'rounded-lg': rounded,
         'rounded-none': !rounded
-    }, className, padding, 'border-2 transition-backgroundColor duration-500 transform');
-    const loadingIcon = React.createElement(Icon, { size: 1, type: 'spinner', animation: 'pulse', colour: 'white', bgColour: 'primary' });
-    return (React.createElement("a", Object.assign({}, (openInNewTab && { target: '_blank' }), { href: href }),
-        React.createElement("button", Object.assign({}, (id && { id: id }), { className: classList, "aria-busy": isLoading }, (onClick &&
-            { onClick: onClick }), (disabled &&
-            { disabled: disabled })),
-            React.createElement("div", { className: isLoading ? 'invisible' : '' }, children),
+    }, className, padding, 'group border-2 transition-backgroundColor duration-500 transform');
+    const loadingIcon = (React.createElement(Icon, { size: 1, type: 'spinner', animation: 'pulse', colour: 'white', bgColour: 'primary' }));
+    return (React.createElement("a", Object.assign({ className: 'group' }, (openInNewTab && { target: '_blank' }), { href: href }),
+        React.createElement("button", Object.assign({ id: id, className: classList, "aria-busy": isLoading }, ((onClick != null) &&
+            { onClick }), (disabled &&
+            { disabled })),
+            React.createElement("div", { className: classNames({ invisible: isLoading }) }, children),
             isLoading &&
                 React.createElement("div", { className: loadingClasses }, loadingIcon))));
 };

package/dist/src/lib/components/Button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/lib/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,IAAI,MAAM,SAAS,CAAA;AAC1B,OAAO,UAAU,MAAM,YAAY,CAAA;AAiBnC,MAAM,MAAM,GAAG,CAAC,EACZ,EAAE,EACF,SAAS,EACT,OAAO,EACP,SAAS,EACT,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,SAAS,EAChB,IAAI,EACJ,OAAO,GAAG,IAAI,EACd,QAAQ,GAAG,KAAK,EAChB,SAAS,GAAG,KAAK,EACjB,YAAY,GAAG,KAAK,EACpB,QAAQ,EACJ,EAAE,EAAE;IACR,MAAM,OAAO,GAAG,UAAU,CAAC;QACvB,WAAW,EAAE,IAAI,KAAK,QAAQ;QAC9B,MAAM,EAAE,IAAI,KAAK,MAAM;QACvB,MAAM,EAAE,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,MAAM;KAC/C,EAAE,MAAM,CAAC,CAAA;IAEV,MAAM,cAAc,GAAG,UAAU,CAAC;QAC9B,WAAW,EAAE,CAAC,SAAS;KAC1B,EAAE,iCAAiC,CAAC,CAAA;IAErC,MAAM,SAAS,GAAG,UAAU,CAAC;QACzB,oCAAoC,EAAE,OAAO,KAAK,SAAS;QAC3D,wDAAwD,EAAE,QAAQ,KAAK,KAAK,IAAI,OAAO,KAAK,SAAS;QACrG,sCAAsC,EAAE,OAAO,KAAK,WAAW;QAC/D,wDAAwD,EAAE,QAAQ,KAAK,KAAK,IAAI,OAAO,KAAK,WAAW;QACvG,YAAY,EAAE,QAAQ,KAAK,IAAI;QAC/B,YAAY,EAAE,OAAO;QACrB,cAAc,EAAE,CAAC,OAAO;KAC3B,EAAE,SAAS,EAAE,OAAO,EAAE,4DAA4D,CAAC,CAAA;IAEpF,MAAM,WAAW,GACb,oBAAC,IAAI,IACD,IAAI,EAAE,CAAC,EACP,IAAI,EAAC,SAAS,EACd,SAAS,EAAC,OAAO,EACjB,MAAM,EAAC,OAAO,EACd,QAAQ,EAAC,SAAS,GACpB,CAAA;IAEN,OAAO,CACH,2CACQ,CAAC,YAAY,IAAI,EAAC,MAAM,EAAE,QAAQ,EAAC,CAAC,IACxC,IAAI,EAAE,IAAI;QAEV,gDACQ,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,IACtB,SAAS,EAAE,SAAS,eACT,SAAS,IAChB,CAAC,OAAO;YACR,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,EACrB,CAAC,QAAQ;YACT,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC;YAE3B,6BAAK,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,IACvC,QAAQ,CACP;YACL,SAAS;gBACN,6BAAK,SAAS,EAAE,cAAc,IACzB,WAAW,CACV,CAEL,CACT,CACP,CAAA;AACL,CAAC,CAAA;AAED,eAAe,MAAM,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/lib/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,IAAI,MAAM,kBAAkB,CAAA;AACnC,OAAO,UAAU,MAAM,YAAY,CAAA;AAiBnC,MAAM,MAAM,GAAG,CAAC,EACd,EAAE,EACF,SAAS,EACT,OAAO,EACP,SAAS,EACT,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,SAAS,EAChB,IAAI,EACJ,OAAO,GAAG,IAAI,EACd,QAAQ,GAAG,KAAK,EAChB,SAAS,GAAG,KAAK,EACjB,YAAY,GAAG,KAAK,EACpB,QAAQ,EACF,EAAe,EAAE;IACvB,MAAM,OAAO,GAAG,UAAU,CAAC;QACzB,WAAW,EAAE,IAAI,KAAK,QAAQ;QAC9B,MAAM,EAAE,IAAI,KAAK,MAAM;QACvB,MAAM,EAAE,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,MAAM;KAC7C,EAAE,MAAM,CAAC,CAAA;IAEV,MAAM,cAAc,GAAG,UAAU,CAAC;QAChC,SAAS,EAAE,CAAC,SAAS;KACtB,EAAE,iCAAiC,CAAC,CAAA;IAErC,MAAM,SAAS,GAAG,UAAU,CAAC;QAC3B,oCAAoC,EAAE,OAAO,KAAK,SAAS;QAC3D,wDAAwD,EAAE,CAAC,QAAQ,IAAI,OAAO,KAAK,SAAS;QAC5F,sCAAsC,EAAE,OAAO,KAAK,WAAW;QAC/D,wDAAwD,EAAE,CAAC,QAAQ,IAAI,OAAO,KAAK,WAAW;QAC9F,YAAY,EAAE,QAAQ;QACtB,YAAY,EAAE,OAAO;QACrB,cAAc,EAAE,CAAC,OAAO;KACzB,EAAE,SAAS,EAAE,OAAO,EAAE,kEAAkE,CAAC,CAAA;IAE1F,MAAM,WAAW,GAAG,CAClB,oBAAC,IAAI,IACH,IAAI,EAAE,CAAC,EACP,IAAI,EAAC,SAAS,EACd,SAAS,EAAC,OAAO,EACjB,MAAM,EAAC,OAAO,EACd,QAAQ,EAAC,SAAS,GAClB,CACH,CAAA;IAED,OAAO,CACL,yCACE,SAAS,EAAC,OAAO,IACb,CAAC,YAAY,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,IAC1C,IAAI,EAAE,IAAI;QAEV,8CACE,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,SAAS,eACT,SAAS,IAChB,CAAC,CAAC,OAAO,IAAI,IAAI,CAAC;YACV,EAAE,OAAO,EAAE,CAAC,EACpB,CAAC,QAAQ;YACD,EAAE,QAAQ,EAAE,CAAC;YAEzB,6BAAK,SAAS,EAAE,UAAU,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC,IACjD,QAAQ,CACL;YACL,SAAS;gBACR,6BAAK,SAAS,EAAE,cAAc,IAC3B,WAAW,CACR,CACD,CACP,CACL,CAAA;AACH,CAAC,CAAA;AAED,eAAe,MAAM,CAAA"}

package/dist/src/lib/components/Card/Card.stories.d.ts

@@ -1,5 +1,8 @@
 import React from 'react';
-import { ComponentStory } from '@storybook/react';
+import Card from './index';
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+declare const componentMeta: ComponentMeta<typeof Card>;
 export declare const _ImageCard: ComponentStory<React.FC<import("./index").Props>>;
 export declare const _VideoCard: ComponentStory<React.FC<import("./index").Props>>;
 export declare const _ProductCard: ComponentStory<React.FC<import("./index").Props>>;
+export default componentMeta;

package/dist/src/lib/components/Card/Card.stories.js

@@ -1,71 +1,70 @@
 import React from 'react';
 import Card from './index';
-import { idAndClassName } from '@utils/controls';
+import { idAndClassName } from '../../utils/controls';
 import Icon from '../Icon';
 const componentMeta = {
     title: 'Trepur Components/Rupert Bennett/Organisms/Card',
     component: Card,
-    parameters: {},
     argTypes: Object.assign(Object.assign({}, idAndClassName), { title: {
             description: '',
             table: {
-                category: 'Card',
-            },
+                category: 'Card'
+            }
         }, image: {
             description: '',
             table: {
-                category: 'Card',
-            },
+                category: 'Card'
+            }
         }, subTitle: {
             description: '',
             table: {
-                category: 'Card',
-            },
+                category: 'Card'
+            }
         }, description: {
             description: '',
             table: {
-                category: 'Card',
-            },
+                category: 'Card'
+            }
         }, extraText: {
             description: '',
             table: {
-                category: 'Card',
-            },
+                category: 'Card'
+            }
         }, imageBelowTitle: {
             description: '',
             table: {
-                category: 'Card',
-            },
+                category: 'Card'
+            }
         }, bordered: {
             description: '',
             table: {
-                category: 'Card',
-            },
+                category: 'Card'
+            }
         }, rounded: {
             description: '',
             table: {
-                category: 'Card',
-            },
+                category: 'Card'
+            }
         }, hasCta: {
             description: '',
             table: {
-                category: 'Card',
-            },
+                category: 'Card'
+            }
         }, titleLeft: {
             description: '',
             table: {
-                category: 'Card',
-            },
+                category: 'Card'
+            }
         }, titleRight: {
             description: '',
             table: {
-                category: 'Card',
-            },
+                category: 'Card'
+            }
         }, titleBold: {
             description: '',
             table: {
-                category: 'Card',
-            },
+                category: 'Card'
+            }
         } }),
     args: {
         subTitle: 'This is a subtitle',
@@ -81,14 +80,14 @@ const componentMeta = {
             children: React.createElement(Icon, { type: 'heart', hollow: false })
         },
         cardButtonProps: {
-            children: React.createElement("div", { className: 'flex' },
+            children: (React.createElement("div", { className: 'flex' },
                 React.createElement(Icon, { type: 'heart' }),
-                "buttonText",
-                React.createElement(Icon, { type: 'heart' })),
+                React.createElement("p", null, "buttonText"),
+                React.createElement(Icon, { type: 'heart' }))),
             disabled: false,
             hoverText: 'buttonHoverText',
             href: 'buttonUrl',
-            rounded: true,
+            rounded: true
         },
         button2Props: {
             className: 'ml-2 w-full mt-8',
@@ -102,7 +101,7 @@ const Template = (args) => React.createElement(Card, Object.assign({}, args));
 export const _ImageCard = Template.bind({});
 _ImageCard.args = {
     title: 'This is a title',
-    image: 'https://picsum.photos/500/300',
+    image: 'https://picsum.photos/500/300'
 };
 export const _VideoCard = Template.bind({});
 _VideoCard.args = {
@@ -110,7 +109,7 @@ _VideoCard.args = {
     videoProps: {
         mp4File: '/',
         withControls: true,
-        autoPlay: true,
+        autoPlay: true
     }
 };
 export const _ProductCard = Template.bind({});
@@ -121,4 +120,5 @@ _ProductCard.args = {
     extraText: '£123.45',
     onHover: true
 };
+export default componentMeta;
 //# sourceMappingURL=Card.stories.js.map

package/dist/src/lib/components/Card/Card.stories.js.map

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

package/dist/src/lib/components/Card/index.d.ts

@@ -11,9 +11,9 @@ export interface Props {
     extraText?: string;
     hasCta?: boolean;
     imageBelowTitle?: boolean;
-    titleLeft?: string;
-    titleRight?: string;
-    titleBold?: string;
+    titleLeft?: boolean;
+    titleRight?: boolean;
+    titleBold?: boolean;
     imageClass?: string;
     subTitleClass?: string;
     extraTextClass?: string;

package/dist/src/lib/components/Card/index.js

@@ -2,60 +2,63 @@ import React, { useState } from 'react';
 import classNames from 'classnames';
 import Button from '../Button';
 import Video from '../Video';
-const Card = ({ id, className, title, image, subTitle, description, extraText, hasCta, imageBelowTitle, titleLeft, titleRight, titleBold, imageClass, subTitleClass, extraTextClass, descriptionClass, altText, rounded, bordered, videoProps, onHover, iconButtonProps, cardButtonProps, button2Props }) => {
+const Card = ({ id, className, title, image, subTitle, description, extraText, hasCta, imageBelowTitle, titleLeft = false, titleRight = false, titleBold = false, imageClass, subTitleClass, extraTextClass, descriptionClass, altText, rounded, bordered, videoProps, onHover = false, iconButtonProps, cardButtonProps, button2Props }) => {
     const [showHoverButtons, setShowHoverButtons] = useState(false);
-    let orderClass = imageBelowTitle ? ' order-first ' : '';
-    let btnClass = 'w-full p-3 ';
-    let border = bordered ? 'border border-grey border-opacity-100 ' : '';
-    let cardTitleFont = titleBold ? 'font-bold' : '';
-    let cardTitlePosition = titleLeft ? 'text-left ' : titleRight ? 'text-right ' : 'text-center ';
-    let roundedImage = rounded ? 'rounded-t-2xl ' : '';
-    let roundedCard = rounded ? 'rounded-2xl ' : '';
-    let contentWrapperClass = 'px-3 order-3';
-    const titleWrapperClass = classNames({}, `${orderClass} pt-3`);
+    const orderClass = classNames({ 'order-first': imageBelowTitle });
+    const btnClass = 'w-full p-3';
+    const border = classNames({ 'border border-grey border-opacity-100:': bordered });
+    const cardTitleFont = classNames({ 'font-bold': titleBold });
+    const cardTitlePosition = classNames({
+        'text-left': titleLeft,
+        'text-right': titleRight,
+        'text-center': !titleLeft && !titleRight
+    });
+    const roundedImage = classNames({ 'rounded-t-lg': rounded });
+    const roundedCard = classNames({ 'rounded-lg': rounded });
+    const contentWrapperClass = 'px-3 order-3';
+    const titleWrapperClass = classNames(orderClass, 'pt-3');
     const cardTitleClasses = classNames({
         [cardTitlePosition]: true
-    }, `${cardTitleFont} font-medium text-md text-grey`);
-    const cardSubTitleClassList = classNames({}, `${subTitleClass} font-light text-sm text-grey`);
-    const cardDescriptionClassList = classNames({}, `${descriptionClass} font-extraLight text-xs text-light-grey`);
-    const classList = classNames({}, `${className} ${border} ${roundedCard} flex flex-col`);
-    const imageClassList = classNames({}, `${roundedImage} ${imageClass} w-full object-cover h-full`);
+    }, cardTitleFont, 'font-medium text-md text-grey');
+    const cardSubTitleClassList = classNames(subTitleClass, 'font-light text-sm text-grey');
+    const cardDescriptionClassList = classNames(descriptionClass, 'font-extraLight text-xs text-light-grey');
+    const classList = classNames(className, border, roundedCard, 'flex flex-col');
+    const imageClassList = classNames(roundedImage, imageClass, 'w-full object-cover h-full');
     const cardExtraTextClassList = classNames({
-        'pb-4': !hasCta,
-    }, `${extraTextClass} w-full object-cover h-full font-extraLight text-xs text-light-grey`);
+        'pb-4': hasCta === false
+    }, extraTextClass, 'w-full object-cover h-full font-extraLight text-xs text-light-grey');
     const imageWrapperClassList = classNames({
-        'order-2': imageBelowTitle,
-        [`${roundedImage} order-1`]: !imageBelowTitle
+        'order-2': imageBelowTitle === true,
+        [roundedImage]: imageBelowTitle === false,
+        'order-1': imageBelowTitle === false
     }, 'h-64 overflow-hidden object-cover');
     const toggleHover = (isHovering) => {
-        onHover && setShowHoverButtons(isHovering ? true : false);
+        onHover && setShowHoverButtons(!!isHovering);
     };
-    return (React.createElement("div", Object.assign({}, (id && { id: id }), { className: classList, onMouseEnter: () => toggleHover(true), onMouseLeave: () => toggleHover(false) }),
+    return (React.createElement("div", { id: id, className: classList, onMouseEnter: () => toggleHover(true), onMouseLeave: () => toggleHover(false) },
         React.createElement("div", { className: 'card-content flex flex-1 flex-col' },
-            (videoProps === null || videoProps === void 0 ? void 0 : videoProps.mp4File) || (videoProps === null || videoProps === void 0 ? void 0 : videoProps.webmFile) || (videoProps === null || videoProps === void 0 ? void 0 : videoProps.ogvFile) ?
-                React.createElement("div", { className: imageWrapperClassList },
-                    React.createElement(Video, Object.assign({}, videoProps)))
-                :
-                    image &&
-                        React.createElement("div", { className: imageWrapperClassList },
-                            React.createElement("img", { className: imageClassList, src: image, alt: altText })),
-            !showHoverButtons ?
-                React.createElement(React.Fragment, null,
-                    React.createElement("div", { className: imageBelowTitle ? 'order-1' : 'order-3' }, title &&
+            (videoProps === null || videoProps === void 0 ? void 0 : videoProps.mp4File) !== undefined || (videoProps === null || videoProps === void 0 ? void 0 : videoProps.webmFile) !== undefined || (videoProps === null || videoProps === void 0 ? void 0 : videoProps.ogvFile) !== undefined
+                ? (React.createElement("div", { className: imageWrapperClassList },
+                    React.createElement(Video, Object.assign({}, videoProps))))
+                : (image !== undefined &&
+                    React.createElement("div", { className: imageWrapperClassList },
+                        React.createElement("img", { className: imageClassList, src: image, alt: altText }))),
+            !showHoverButtons
+                ? (React.createElement(React.Fragment, null,
+                    React.createElement("div", { className: imageBelowTitle !== undefined ? 'order-1' : 'order-3' }, title !== undefined &&
                         React.createElement("div", { className: titleWrapperClass },
                             React.createElement("h3", { className: cardTitleClasses }, title))),
                     React.createElement("div", { className: contentWrapperClass },
-                        subTitle &&
+                        subTitle !== undefined &&
                             React.createElement("h4", { className: cardSubTitleClassList }, subTitle),
-                        description &&
+                        description !== undefined &&
                             React.createElement("p", { className: cardDescriptionClassList }, description),
-                        extraText &&
-                            React.createElement("p", { className: cardExtraTextClassList }, extraText)))
-                :
-                    React.createElement("div", { className: 'flex p-2 order-last h-24' },
-                        React.createElement(Button, Object.assign({}, iconButtonProps), iconButtonProps === null || iconButtonProps === void 0 ? void 0 : iconButtonProps.children),
-                        React.createElement(Button, Object.assign({}, button2Props), button2Props === null || button2Props === void 0 ? void 0 : button2Props.children))),
-        cardButtonProps &&
+                        extraText !== undefined &&
+                            React.createElement("p", { className: cardExtraTextClassList }, extraText))))
+                : (React.createElement("div", { className: 'flex p-2 order-last h-24' },
+                    React.createElement(Button, Object.assign({}, iconButtonProps), iconButtonProps === null || iconButtonProps === void 0 ? void 0 : iconButtonProps.children),
+                    React.createElement(Button, Object.assign({}, button2Props), button2Props === null || button2Props === void 0 ? void 0 : button2Props.children)))),
+        (cardButtonProps != null) &&
             React.createElement("div", { className: btnClass },
                 React.createElement(Button, Object.assign({}, cardButtonProps), cardButtonProps.children))));
 };

package/dist/src/lib/components/Card/index.js.map

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

package/dist/src/lib/components/CardWithTopImage/CardWithTopImage.stories.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import CardWithTopImage from './index';
-import logo from '../../assets/images/primary-logo.png';
-import { idAndClassName } from '@utils/controls';
+import logo from '@assets/images/primary-logo.png';
+import { idAndClassName } from '../../utils/controls';
 const componentMeta = {
     title: 'Trepur Components/Rupert Bennett/Organisms/Card With Top Image',
     component: CardWithTopImage,
@@ -31,7 +31,7 @@ const componentMeta = {
             width: 4,
             height: 4
         },
-        children: [React.createElement("p", null, "This is a child"), React.createElement("p", null, "This is another child")]
+        children: [React.createElement("p", { key: '1' }, "This is a child"), React.createElement("p", { key: '2' }, "This is another child")]
     }
 };
 const Template = (args) => React.createElement(CardWithTopImage, Object.assign({}, args));

package/dist/src/lib/components/CardWithTopImage/CardWithTopImage.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardWithTopImage.stories.js","sourceRoot":"","sources":["../../../../../src/lib/components/CardWithTopImage/CardWithTopImage.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,gBAAgB,MAAM,SAAS,CAAA;AACtC,OAAO,IAAI,MAAM,sCAAsC,CAAA;AAEvD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAA;AAEhD,MAAM,aAAa,GAA2C;IAC1D,KAAK,EAAE,gEAAgE;IACvE,SAAS,EAAE,gBAAgB;IAC3B,QAAQ,kCACD,cAAc,KACjB,QAAQ,EAAE;YACN,IAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,0BAA0B,EAAE;YAC1D,WAAW,EAAE,6CAA6C;YAC1D,KAAK,EAAE;gBACL,IAAI,EAAE;oBACJ,OAAO,EAAE,OAAO;iBACjB;gBACD,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACJ,EACD,UAAU,EAAE;YACR,IAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE;YACxC,WAAW,EAAE,iDAAiD;YAC9D,KAAK,EAAE;gBACL,IAAI,EAAE;oBACJ,OAAO,EAAE,QAAQ;iBAClB;gBACD,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACJ,GACJ;IACD,IAAI,EAAE;QACF,UAAU,EAAE;YACR,KAAK,EAAE,IAAI;YACX,WAAW,EAAE,IAAI;YACjB,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,CAAC;SACZ;QACD,QAAQ,EAAE,CAAC,iDAAsB,EAAC,uDAA4B,CAAC;KAClE;CACJ,CAAA;AAED,MAAM,QAAQ,GAA4C,CAAC,IAAI,EAAE,EAAE,CAAC,oBAAC,gBAAgB,oBAAK,IAAI,EAAI,CAAA;AAElG,MAAM,CAAC,MAAM,iBAAiB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEnD,eAAe,aAAa,CAAA"}
+{"version":3,"file":"CardWithTopImage.stories.js","sourceRoot":"","sources":["../../../../../src/lib/components/CardWithTopImage/CardWithTopImage.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,gBAAgB,MAAM,SAAS,CAAA;AACtC,OAAO,IAAI,MAAM,iCAAiC,CAAA;AAElD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAA;AAEhD,MAAM,aAAa,GAA2C;IAC5D,KAAK,EAAE,gEAAgE;IACvE,SAAS,EAAE,gBAAgB;IAC3B,QAAQ,kCACH,cAAc,KACjB,QAAQ,EAAE;YACR,IAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,0BAA0B,EAAE;YAC1D,WAAW,EAAE,6CAA6C;YAC1D,KAAK,EAAE;gBACL,IAAI,EAAE;oBACJ,OAAO,EAAE,OAAO;iBACjB;gBACD,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACF,EACD,UAAU,EAAE;YACV,IAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE;YACxC,WAAW,EAAE,iDAAiD;YAC9D,KAAK,EAAE;gBACL,IAAI,EAAE;oBACJ,OAAO,EAAE,QAAQ;iBAClB;gBACD,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACF,GACF;IACD,IAAI,EAAE;QACJ,UAAU,EAAE;YACV,KAAK,EAAE,IAAI;YACX,WAAW,EAAE,IAAI;YACjB,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,CAAC;SACV;QACD,QAAQ,EAAE,CAAC,2BAAG,GAAG,EAAC,GAAG,sBAAoB,EAAE,2BAAG,GAAG,EAAC,GAAG,4BAA0B,CAAC;KACjF;CACF,CAAA;AAED,MAAM,QAAQ,GAA4C,CAAC,IAAI,EAAE,EAAE,CAAC,oBAAC,gBAAgB,oBAAK,IAAI,EAAI,CAAA;AAElG,MAAM,CAAC,MAAM,iBAAiB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAElD,eAAe,aAAa,CAAA"}

package/dist/src/lib/components/CardWithTopImage/index.js

@@ -5,7 +5,7 @@ const CardWithTopImage = ({ id, className, children, imageProps }) => {
     const wrapperClassList = classNames('rounded-full mx-auto max-w-max bg-white p-4');
     const contentClassList = 'pt-12 px-4 h-auto pb-16 -mt-12 bg-white';
     return (React.createElement("div", { style: {
-            'filter': 'drop-shadow(0 4px 8px rgb(154, 154, 154))'
+            filter: 'drop-shadow(0 4px 8px rgb(154, 154, 154))'
         }, id: id, className: className },
         React.createElement("div", { className: wrapperClassList },
             React.createElement(Image, Object.assign({}, imageProps))),

package/dist/src/lib/components/CardWithTopImage/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/lib/components/CardWithTopImage/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAA8B,MAAM,UAAU,CAAA;AACrD,OAAO,UAAU,MAAM,YAAY,CAAA;AASnC,MAAM,gBAAgB,GAAG,CAAC,EACtB,EAAE,EACF,SAAS,EACT,QAAQ,EACR,UAAU,EACN,EAAE,EAAE;IACR,MAAM,gBAAgB,GAAG,UAAU,CAAC,6CAA6C,CAAC,CAAA;IAElF,MAAM,gBAAgB,GAAG,yCAAyC,CAAA;IAElE,OAAO,CACH,6BACI,KAAK,EAAE;YACH,QAAQ,EAAE,2CAA2C;SACxD,EACD,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,SAAS;QAEpB,6BAAK,SAAS,EAAE,gBAAgB;YAC5B,oBAAC,KAAK,oBAAK,UAAU,EAAI,CACvB;QACN,6BAAK,SAAS,EAAE,gBAAgB,IAC3B,QAAQ,CACP,CACJ,CACT,CAAA;AACL,CAAC,CAAA;AAED,eAAe,gBAAgB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/lib/components/CardWithTopImage/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAA8B,MAAM,mBAAmB,CAAA;AAC9D,OAAO,UAAU,MAAM,YAAY,CAAA;AASnC,MAAM,gBAAgB,GAAG,CAAC,EACxB,EAAE,EACF,SAAS,EACT,QAAQ,EACR,UAAU,EACJ,EAAe,EAAE;IACvB,MAAM,gBAAgB,GAAG,UAAU,CAAC,6CAA6C,CAAC,CAAA;IAElF,MAAM,gBAAgB,GAAG,yCAAyC,CAAA;IAElE,OAAO,CACL,6BACE,KAAK,EAAE;YACL,MAAM,EAAE,2CAA2C;SACpD,EACD,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,SAAS;QAEpB,6BAAK,SAAS,EAAE,gBAAgB;YAC9B,oBAAC,KAAK,oBAAK,UAAU,EAAI,CACrB;QACN,6BAAK,SAAS,EAAE,gBAAgB,IAC7B,QAAQ,CACL,CACF,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,gBAAgB,CAAA"}

package/dist/src/lib/components/Carousel/Carousel.stories.js

@@ -1,13 +1,13 @@
 import React from 'react';
 import Carousel from './index';
-import { idAndClassName } from '@utils/controls';
+import { idAndClassName } from '../../utils/controls';
 import Card from '../Card';
-import logo from '../../assets/images/primary-logo.png';
+import logo from '@assets/images/primary-logo.png';
 const slides = [
-    React.createElement(Card, { className: 'keen-slider__slide', image: logo, subTitle: 'This is a subtitle', description: 'This is a description paragraph', extraText: 'This is another paragraph', rounded: true, bordered: true }),
-    React.createElement(Card, { className: 'keen-slider__slide', image: logo, subTitle: 'This is a subtitle', description: 'This is a description paragraph', extraText: 'This is another paragraph', rounded: true, bordered: true }),
-    React.createElement(Card, { className: 'keen-slider__slide', image: logo, subTitle: 'This is a subtitle', description: 'This is a description paragraph', extraText: 'This is another paragraph', rounded: true, bordered: true }),
-    React.createElement(Card, { className: 'keen-slider__slide', image: logo, subTitle: 'This is a subtitle', description: 'This is a description paragraph', extraText: 'This is another paragraph', rounded: true, bordered: true })
+    React.createElement(Card, { key: 'card_1', className: 'keen-slider__slide', image: logo, subTitle: 'This is a subtitle', description: 'This is a description paragraph', extraText: 'This is another paragraph', rounded: true, bordered: true }),
+    React.createElement(Card, { key: 'card_2', className: 'keen-slider__slide', image: logo, subTitle: 'This is a subtitle', description: 'This is a description paragraph', extraText: 'This is another paragraph', rounded: true, bordered: true }),
+    React.createElement(Card, { key: 'card_3', className: 'keen-slider__slide', image: logo, subTitle: 'This is a subtitle', description: 'This is a description paragraph', extraText: 'This is another paragraph', rounded: true, bordered: true }),
+    React.createElement(Card, { key: 'card_4', className: 'keen-slider__slide', image: logo, subTitle: 'This is a subtitle', description: 'This is a description paragraph', extraText: 'This is another paragraph', rounded: true, bordered: true })
 ];
 const componentMeta = {
     title: 'Trepur Components/Rupert Bennett/Organisms/Carousel',
@@ -238,7 +238,7 @@ const componentMeta = {
                 type: { summary: 'boolean' },
                 defaultValue: { summary: 'undefined' }
             }
-        }, slidesToShow: {
+        }, perView: {
             type: { name: 'number', required: false },
             description: 'The number of slides to show at a time',
             table: {
@@ -278,16 +278,16 @@ const componentMeta = {
     args: {
         loop: true,
         drag: true,
-        slides: slides,
+        slides,
+        spacing: 16,
+        perView: 4,
         arrows: {
-            visible: true,
-            colours: 'fill-primary',
-            disabledColours: 'fill-secondary '
+            visible: true
         },
         dots: {
             visible: true,
             colours: 'bg-primary',
-            activeColours: 'bg-primary',
+            activeColours: 'bg-secondary'
         }
     }
 };