fictoan-react 0.42.1 → 0.42.3

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # CHANGELOG
 
+### 0.42.3
+- Update command for installing dependencies and build in CI
+
+### 0.42.2
+- Fix broken npm publish action
+
 ### 0.42.1
 - Fix styling issues in `Tabs`
 

package/dist/cjs/components/Badge/Badge.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { CommonAndHTMLProps } from "../Element/constants";
+export interface BadgeCustomProps {
+    size?: "tiny" | "small" | "medium" | "large" | "huge";
+    shape?: "rounded" | "curved";
+}
+export declare type BadgeElementType = HTMLDivElement;
+export declare type BadgeProps = Omit<CommonAndHTMLProps<BadgeElementType>, keyof BadgeCustomProps> & BadgeCustomProps;
+export declare const Badge: React.ForwardRefExoticComponent<Omit<CommonAndHTMLProps<HTMLDivElement>, keyof BadgeCustomProps> & BadgeCustomProps & React.RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/Badge/Badge.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../external/Element.js"),r=require("react"),t=require("./Badge.styled.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("styled-components"),require("../../external/theme.js"),require("../../external/DefaultColours.js");var a=/*#__PURE__*/s(r);const u=a.default.forwardRef(((r,s)=>{var{size:u="tiny",shape:l,kind:n}=r,i=e.__rest(r,["size","shape","kind"]);let d=[];return n&&d.push(n),u&&d.push(`size-${u}`),l&&d.push(`shape-${l}`),a.default.createElement(e.Element,Object.assign({as:t.BadgeStyled,ref:s,classNames:d},i))}));exports.Badge=u;
+//# sourceMappingURL=Badge.js.map

package/dist/cjs/components/Badge/Badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.js","sources":["../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Element } from \"../Element/Element\";\nimport { CommonAndHTMLProps } from \"../Element/constants\";\n\nimport { BadgeStyled } from \"./Badge.styled\";\n\n// prettier-ignore\nexport interface BadgeCustomProps {\n    size      ? : \"tiny\" | \"small\" | \"medium\" | \"large\" | \"huge\";\n    shape     ? : \"rounded\" | \"curved\";\n}\n\nexport type BadgeElementType = HTMLDivElement;\nexport type BadgeProps = Omit<CommonAndHTMLProps<BadgeElementType>, keyof BadgeCustomProps> & BadgeCustomProps;\n\nexport const Badge = React.forwardRef(\n    ({ size = \"tiny\", shape, kind, ...props }: BadgeProps, ref: React.Ref<BadgeElementType>) => {\n        let classNames = [];\n\n        if (kind) {\n            classNames.push(kind);\n        }\n\n        if (size) {\n            classNames.push(`size-${size}`);\n        }\n\n        if (shape) {\n            classNames.push(`shape-${shape}`);\n        }\n\n        return <Element<BadgeElementType> as={BadgeStyled} ref={ref} classNames={classNames} {...props} />;\n    }\n);\n"],"names":["Badge","React","forwardRef","_a","ref","size","shape","kind","props","classNames","push","Element","as","BadgeStyled"],"mappings":"mXAgBaA,EAAQC,UAAMC,YACvB,CAACC,EAAsDC,SAAtDC,KAAEA,EAAO,OAATC,MAAiBA,EAAjBC,KAAwBA,KAASC,aAAjC,6BACOC,EAAa,UAEbF,GACAE,EAAWC,KAAKH,GAGhBF,GACAI,EAAWC,aAAaL,KAGxBC,GACAG,EAAWC,cAAcJ,KAGtBL,wBAACU,yBAA0BC,GAAIC,cAAaT,IAAKA,EAAKK,WAAYA,GAAgBD"}

package/dist/cjs/components/Badge/Badge.stories.d.ts

@@ -0,0 +1,3 @@
+import { FictoanStory } from "../../utils/storyUtils";
+import { Badge } from "./Badge";
+export declare const Custom: FictoanStory<typeof Badge>;

package/dist/cjs/components/Badge/Badge.styled.d.ts

@@ -0,0 +1 @@
+export declare const BadgeStyled: import("styled-components").StyledComponent<"mark", any, {}, never>;

package/dist/cjs/components/Badge/Badge.styled.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../external/theme.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../external/DefaultColours.js");const a=/*#__PURE__*/i(e).default.mark.withConfig({displayName:"BadgeStyled",componentId:"-gunsny"})`position:relative;font-family:${e=>e.theme.button.font};font-weight:bold;font-size:92%;text-align:center;text-decoration:none;transition:all 0.2s ease-in-out;background-position:center;user-select:none;width:fit-content;height:fit-content;> *{all:unset;}&.shape-rounded{border-radius:${t.globalVariables.borderWidth};}&.shape-curved{border-radius:5000px;}&[class*="border-"]{border-width:${t.globalVariables.borderWidth};}&.border-none{border-width:0 !important;}&.size-tiny{padding:2px 8px;font-size:${e=>e.theme.text.paras.size*Math.pow(e.theme.text.headings.multiplier,-2)}em;}&.size-small{padding:3px 10px;font-size:${e=>e.theme.text.paras.size*Math.pow(e.theme.text.headings.multiplier,-1)}em;}&.size-medium{padding:4px 12px;font-size:${e=>e.theme.text.paras.size*Math.pow(e.theme.text.headings.multiplier,1)}em;}&.size-large{padding:6px 16px;font-size:${e=>e.theme.text.paras.size*Math.pow(e.theme.text.headings.multiplier,2)}em;}&.size-huge{padding:8px 20px;font-size:${e=>e.theme.text.paras.size*Math.pow(e.theme.text.headings.multiplier,4)}em;}`;exports.BadgeStyled=a;
+//# sourceMappingURL=Badge.styled.js.map

package/dist/cjs/components/Badge/Badge.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.styled.js","sources":["../../../../src/components/Badge/Badge.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { BadgeProps } from \"./Badge\";\nimport { globalVariables } from \"../../styles/theme\";\n\nexport const BadgeStyled = styled.mark`\n    position            : relative;\n    font-family         : ${(props : BadgeProps) => props.theme.button.font};\n    font-weight         : bold;\n    font-size           : 92%;\n    text-align          : center;\n    text-decoration     : none;\n    transition          : all 0.2s ease-in-out;\n    background-position : center;\n    user-select         : none;\n    width               : fit-content;\n    height              : fit-content;\n\n    // To make sure a button’s children\n    // don’t style themselves like a douchebag\n    > * {\n        all : unset;\n    }\n\n    &.shape-rounded { border-radius : ${globalVariables.borderWidth}; }\n\n    &.shape-curved { border-radius : 5000px; }\n\n    &[class*=\"border-\"] { border-width : ${globalVariables.borderWidth}; }\n\n    &.border-none { border-width : 0 !important; }\n\n    //  DIFFERENT SIZES  //////////////////////////////////////////////////////\n    &.size-tiny {\n        padding   : 2px 8px;\n        font-size : ${(props : BadgeProps) => props.theme.text.paras.size * Math.pow(props.theme.text.headings.multiplier, -2)}em;\n    }\n\n    &.size-small {\n        padding   : 3px 10px;\n        font-size : ${(props : BadgeProps) => props.theme.text.paras.size * Math.pow(props.theme.text.headings.multiplier, -1)}em;\n    }\n\n    &.size-medium {\n        padding   : 4px 12px;\n        font-size : ${(props : BadgeProps) => props.theme.text.paras.size * Math.pow(props.theme.text.headings.multiplier, 1)}em;\n    }\n\n    &.size-large {\n        padding   : 6px 16px;\n        font-size : ${(props : BadgeProps) => props.theme.text.paras.size * Math.pow(props.theme.text.headings.multiplier, 2)}em;\n    }\n\n    &.size-huge {\n        padding   : 8px 20px;\n        font-size : ${(props : BadgeProps) => props.theme.text.paras.size * Math.pow(props.theme.text.headings.multiplier, 4)}em;\n    }\n`;\n"],"names":["BadgeStyled","mark","props","theme","button","font","globalVariables","borderWidth","text","paras","size","Math","pow","headings","multiplier"],"mappings":"sQAKaA,4BAAqBC,mGAELC,GAAuBA,EAAMC,MAAMC,OAAOC,4OAiB/BC,kBAAgBC,sFAIbD,kBAAgBC,+FAOpCL,GAAuBA,EAAMC,MAAMK,KAAKC,MAAMC,KAAOC,KAAKC,IAAIV,EAAMC,MAAMK,KAAKK,SAASC,YAAa,iDAKrGZ,GAAuBA,EAAMC,MAAMK,KAAKC,MAAMC,KAAOC,KAAKC,IAAIV,EAAMC,MAAMK,KAAKK,SAASC,YAAa,kDAKrGZ,GAAuBA,EAAMC,MAAMK,KAAKC,MAAMC,KAAOC,KAAKC,IAAIV,EAAMC,MAAMK,KAAKK,SAASC,WAAY,iDAKpGZ,GAAuBA,EAAMC,MAAMK,KAAKC,MAAMC,KAAOC,KAAKC,IAAIV,EAAMC,MAAMK,KAAKK,SAASC,WAAY,gDAKpGZ,GAAuBA,EAAMC,MAAMK,KAAKC,MAAMC,KAAOC,KAAKC,IAAIV,EAAMC,MAAMK,KAAKK,SAASC,WAAY"}

package/dist/cjs/components/Badge/index.d.ts

@@ -0,0 +1,2 @@
+export { Badge } from "./Badge";
+export { BadgeStyled } from "./Badge.styled";

package/dist/cjs/components/Badge/index.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./Badge.js"),r=require("./Badge.styled.js");require("../../external/Element.js"),require("react"),require("styled-components"),require("../../external/theme.js"),require("../../external/DefaultColours.js"),exports.Badge=e.Badge,exports.BadgeStyled=r.BadgeStyled;
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Badge/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/cjs/components/BottomDrawer/BottomDrawer.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import { ColourPropTypes, CommonAndHTMLProps } from "../Element/constants";
+export interface BottomDrawerCustomProps {
+    isOpen?: boolean;
+    onCloseCallback?: () => void;
+    overlayOpacity?: number;
+    overlayColour?: ColourPropTypes;
+    overlayColor?: ColourPropTypes;
+    closeOnClickOutside?: boolean;
+}
+export declare type BottomDrawerElementType = HTMLDivElement;
+export declare type BottomDrawerProps = Omit<CommonAndHTMLProps<BottomDrawerElementType>, keyof BottomDrawerCustomProps> & BottomDrawerCustomProps;
+export declare const BottomDrawer: React.ForwardRefExoticComponent<Omit<CommonAndHTMLProps<HTMLDivElement>, keyof BottomDrawerCustomProps> & BottomDrawerCustomProps & React.RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/BottomDrawer/BottomDrawer.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../external/Element.js"),t=require("react"),r=require("./BottomDrawer.styled.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("styled-components"),require("../../external/helpers.js"),require("../../external/DefaultColours.js");var a=/*#__PURE__*/l(t);const o=a.default.forwardRef(((t,l)=>{var{isOpen:o,children:s,onCloseCallback:n,closeOnClickOutside:u,padding:d,bgColor:c,bgColour:i}=t,m=e.__rest(t,["isOpen","children","onCloseCallback","closeOnClickOutside","padding","bgColor","bgColour"]);let f=[];o&&f.push("open");const p=()=>{n&&n()};return!!o&&a.default.createElement(a.default.Fragment,null,a.default.createElement(e.Element,Object.assign({as:r.BottomDrawerStyled,ref:l,classNames:f},m),a.default.createElement(e.Element,{as:"div",classNames:[...f,"rest-of-page-overlay"],onClick:()=>{u&&p()}}),a.default.createElement(e.Element,{as:"div",className:"bottom-drawer-content-wrapper",padding:d,bgColor:c,bgColour:i},a.default.createElement(e.Element,{as:"div",className:"dismiss-button",onClick:p,role:"button"}),s)))}));exports.BottomDrawer=o;
+//# sourceMappingURL=BottomDrawer.js.map

package/dist/cjs/components/BottomDrawer/BottomDrawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomDrawer.js","sources":["../../../../src/components/BottomDrawer/BottomDrawer.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Element } from \"../Element/Element\";\nimport { ColourPropTypes, CommonAndHTMLProps } from \"../Element/constants\";\n\nimport { BottomDrawerStyled } from \"./BottomDrawer.styled\";\n\n// prettier-ignore\nexport interface BottomDrawerCustomProps {\n    isOpen              ? : boolean;\n    onCloseCallback     ? : () => void;\n    overlayOpacity      ? : number;\n    overlayColour       ? : ColourPropTypes;\n    overlayColor        ? : ColourPropTypes;\n    closeOnClickOutside ? : boolean;\n}\n\nexport type BottomDrawerElementType = HTMLDivElement;\nexport type BottomDrawerProps = Omit<CommonAndHTMLProps<BottomDrawerElementType>, keyof BottomDrawerCustomProps> &\n    BottomDrawerCustomProps;\n\nexport const BottomDrawer = React.forwardRef(\n    (\n        {\n            isOpen,\n            children,\n            onCloseCallback,\n            closeOnClickOutside,\n            padding,\n            bgColor,\n            bgColour,\n            ...props\n        }: BottomDrawerProps,\n        ref: React.Ref<BottomDrawerElementType>\n    ) => {\n        let classNames = [];\n\n        if (isOpen) {\n            classNames.push(\"open\");\n        }\n\n        const closeBottomDrawer = () => {\n            if (onCloseCallback) {\n                onCloseCallback();\n            }\n        };\n\n        return (\n            !!isOpen && (\n                <>\n                    <Element<BottomDrawerElementType>\n                        as={BottomDrawerStyled}\n                        ref={ref}\n                        classNames={classNames}\n                        {...props}\n                    >\n                        <Element\n                            as=\"div\"\n                            classNames={[...classNames, `rest-of-page-overlay`]}\n                            onClick={() => {\n                                if (closeOnClickOutside) closeBottomDrawer();\n                            }}\n                        />\n\n                        <Element\n                            as=\"div\"\n                            className=\"bottom-drawer-content-wrapper\"\n                            padding={padding}\n                            bgColor={bgColor}\n                            bgColour={bgColour}\n                        >\n                            <Element as=\"div\" className=\"dismiss-button\" onClick={closeBottomDrawer} role=\"button\" />\n                            {children}\n                        </Element>\n                    </Element>\n                </>\n            )\n        );\n    }\n);\n"],"names":["BottomDrawer","React","forwardRef","_a","ref","isOpen","children","onCloseCallback","closeOnClickOutside","padding","bgColor","bgColour","props","classNames","push","closeBottomDrawer","Element","as","BottomDrawerStyled","onClick","className","role"],"mappings":"4XAqBaA,EAAeC,UAAMC,YAC9B,CACIC,EAUAC,SAVAC,OACIA,EADJC,SAEIA,EAFJC,gBAGIA,EAHJC,oBAIIA,EAJJC,QAKIA,EALJC,QAMIA,EANJC,SAOIA,KACGC,aARP,kGAYIC,EAAa,GAEbR,GACAQ,EAAWC,KAAK,cAGdC,EAAoB,KAClBR,GACAA,aAKFF,GACEJ,gDACIA,wBAACe,yBACGC,GAAIC,qBACJd,IAAKA,EACLS,WAAYA,GACRD,GAEJX,wBAACe,WACGC,GAAG,MACHJ,WAAY,IAAIA,0BAChBM,QAAS,KACDX,GAAqBO,OAIjCd,wBAACe,WACGC,GAAG,MACHG,UAAU,gCACVX,QAASA,EACTC,QAASA,EACTC,SAAUA,GAEVV,wBAACe,WAAQC,GAAG,MAAMG,UAAU,iBAAiBD,QAASJ,EAAmBM,KAAK,WAC7Ef"}

package/dist/cjs/components/BottomDrawer/BottomDrawer.stories.d.ts

@@ -0,0 +1,3 @@
+import { FictoanStory } from "../../utils/storyUtils";
+import { BottomDrawer } from "./BottomDrawer";
+export declare const Default: FictoanStory<typeof BottomDrawer>;

package/dist/cjs/components/BottomDrawer/BottomDrawer.styled.d.ts

@@ -0,0 +1 @@
+export declare const BottomDrawerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/cjs/components/BottomDrawer/BottomDrawer.styled.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../external/helpers.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../external/DefaultColours.js");const r=/*#__PURE__*/o(e).default.div.withConfig({displayName:"BottomDrawerStyled",componentId:"-1equa2k"})`.rest-of-page-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:5000;backdrop-filter:blur(${e=>e.theme.bottomDrawer.overlay.blur});background-color:${e=>{var o,r;return`${(null!==(o=t.convertToFictoanColor(e.overlayColour||e.overlayColor))&&void 0!==o?o:e.theme.bottomDrawer.overlay.bg).replace(/(^hsla\(.*,.*,.*,)(.*)(\))$/,`$1${(null!==(r=e.overlayOpacity)&&void 0!==r?r:e.theme.bottomDrawer.overlay.opacity).toString()}$3`)}`}};}.bottom-drawer-content-wrapper{position:fixed;bottom:0;transform:translateY(120%);height:fit-content;max-height:90vh;transition:all 0.4s ease-in-out;transition-delay:0.2s;box-shadow:4px 0 24px -16px rgba(0, 0, 0, 0.92);z-index:100000;width:100%;border-top-left-radius:${e=>e.theme.bottomDrawer.borderRadius};border-top-right-radius:${e=>e.theme.bottomDrawer.borderRadius};border-bottom-left-radius:0;border-bottom-right-radius:0;&.padding-all-nano{padding:8px;}&.padding-all-micro{padding:24px;}&.padding-all-tiny{padding:02vw;}&.padding-all-small{padding:04vw;}&.padding-all-medium{padding:06vw;}&.padding-all-large{padding:08vw;}&.padding-all-huge{padding:12vw;}&:not([class*="bg-"]){background-color:${e=>e.theme.bottomDrawer.bg};}}&.open .bottom-drawer-content-wrapper{transform:translateY(0);}& .dismiss-button{position:absolute;display:flex;width:32px;height:32px;background-color:${e=>e.theme.bottomDrawer.bg};top:-36px;right:24px;z-index:100001;color:${e=>e.theme.bottomDrawer.dismissButton.color};cursor:pointer;place-content:center;backdrop-filter:blur(2px);border:solid ${e=>e.theme.bottomDrawer.border};border-width:1px 0 1px 1px;border-radius:50%;box-shadow:-4px 0 4px -1px rgba(0, 0, 0, 8%);&::before{display:grid;content:"\\00D7";place-self:center;color:${e=>e.theme.bottomDrawer.dismissButton.color};-webkit-transition:all 0.2s;transition:all 0.2s;cursor:pointer;align-self:center;text-align:center;margin-bottom:5px;line-height:1;font-size:24px;}}`;exports.BottomDrawerStyled=r;
+//# sourceMappingURL=BottomDrawer.styled.js.map

package/dist/cjs/components/BottomDrawer/BottomDrawer.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomDrawer.styled.js","sources":["../../../../src/components/BottomDrawer/BottomDrawer.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { convertToFictoanColor } from \"../../utils/helpers\";\nimport { BottomDrawerProps } from \"./BottomDrawer\";\n\n\nexport const BottomDrawerStyled = styled.div`\n    .rest-of-page-overlay {\n        position         : fixed;\n        top              : 0;\n        left             : 0;\n        width            : 100vw;\n        height           : 100vh;\n        z-index          : 5000;\n        backdrop-filter  : blur(${(props: BottomDrawerProps) => props.theme.bottomDrawer.overlay.blur});\n        background-color : ${(props: BottomDrawerProps) =>\n                `${(convertToFictoanColor(props.overlayColour || props.overlayColor)\n                        ?? props.theme.bottomDrawer.overlay.bg)\n                        .replace(/(^hsla\\(.*,.*,.*,)(.*)(\\))$/,\n                                `$1${(props.overlayOpacity ?? props.theme.bottomDrawer.overlay.opacity).toString()}$3`)}`\n        };\n    }\n\n    .bottom-drawer-content-wrapper {\n        position                   : fixed;\n        bottom                     : 0;\n        transform                  : translateY(120%);\n        height                     : fit-content;\n        max-height                 : 90vh;\n        transition                 : all 0.4s ease-in-out;\n        transition-delay           : 0.2s;\n        box-shadow                 : 4px 0 24px -16px rgba(0, 0, 0, 0.92);\n        z-index                    : 100000;\n        width                      : 100%;\n        border-top-left-radius     : ${(props: BottomDrawerProps) => props.theme.bottomDrawer.borderRadius};\n        border-top-right-radius    : ${(props: BottomDrawerProps) => props.theme.bottomDrawer.borderRadius};\n        border-bottom-left-radius  : 0;\n        border-bottom-right-radius : 0;\n\n        &.padding-all-nano   { padding :  8px; }\n        &.padding-all-micro  { padding : 24px; }\n        &.padding-all-tiny   { padding : 02vw; }\n        &.padding-all-small  { padding : 04vw; }\n        &.padding-all-medium { padding : 06vw; }\n        &.padding-all-large  { padding : 08vw; }\n        &.padding-all-huge   { padding : 12vw; }\n\n        &:not([class*=\"bg-\"]) {\n            background-color : ${(props: BottomDrawerProps) => props.theme.bottomDrawer.bg};\n        }\n    }\n\n    &.open .bottom-drawer-content-wrapper { transform : translateY(0); }\n\n    & .dismiss-button {\n        position         : absolute;\n        display          : flex;\n        width            : 32px;\n        height           : 32px;\n        background-color : ${(props: BottomDrawerProps) => props.theme.bottomDrawer.bg};\n        top              : -36px;\n        right            : 24px;\n        z-index          : 100001;\n        color            : ${(props: BottomDrawerProps) => props.theme.bottomDrawer.dismissButton.color};\n        cursor           : pointer;\n        place-content    : center;\n        backdrop-filter  : blur(2px);\n        border           : solid ${(props: BottomDrawerProps) => props.theme.bottomDrawer.border};\n        border-width     : 1px 0 1px 1px;\n        border-radius    : 50%;\n        box-shadow       : -4px 0 4px -1px rgba(0, 0, 0, 8%);\n\n        &::before {\n            display            : grid;\n            content            : \"\\\\00D7\";\n            place-self         : center;\n            color              : ${(props: BottomDrawerProps) => props.theme.bottomDrawer.dismissButton.color};\n            -webkit-transition : all 0.2s;\n            transition         : all 0.2s;\n            cursor             : pointer;\n            align-self         : center;\n            text-align         : center;\n            margin-bottom      : 5px;\n            line-height        : 1;\n            font-size          : 24px;\n        }\n    }\n`;\n"],"names":["BottomDrawerStyled","div","props","theme","bottomDrawer","overlay","blur","convertToFictoanColor","overlayColour","overlayColor","bg","replace","overlayOpacity","opacity","toString","borderRadius","dismissButton","color","border"],"mappings":"wQAMaA,4BAA4BC,yLAQNC,GAA6BA,EAAMC,MAAMC,aAAaC,QAAQC,0BACnEJ,gCACVK,wBAAsBL,EAAMM,eAAiBN,EAAMO,6BAC5CP,EAAMC,MAAMC,aAAaC,QAAQK,IACnCC,QAAQ,8CACKT,EAAMU,8BAAkBV,EAAMC,MAAMC,aAAaC,QAAQQ,SAASC,mSAehEZ,GAA6BA,EAAMC,MAAMC,aAAaW,wCACtDb,GAA6BA,EAAMC,MAAMC,aAAaW,2VAa5Db,GAA6BA,EAAMC,MAAMC,aAAaM,gKAW1DR,GAA6BA,EAAMC,MAAMC,aAAaM,gDAItDR,GAA6BA,EAAMC,MAAMC,aAAaY,cAAcC,oFAI9Df,GAA6BA,EAAMC,MAAMC,aAAac,oKAStDhB,GAA6BA,EAAMC,MAAMC,aAAaY,cAAcC"}

package/dist/cjs/components/BottomDrawer/index.d.ts

@@ -0,0 +1,2 @@
+export { BottomDrawer } from "./BottomDrawer";
+export { BottomDrawerStyled } from "./BottomDrawer.styled";

package/dist/cjs/components/BottomDrawer/index.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./BottomDrawer.js"),r=require("./BottomDrawer.styled.js");require("../../external/Element.js"),require("react"),require("styled-components"),require("../../external/helpers.js"),require("../../external/DefaultColours.js"),exports.BottomDrawer=e.BottomDrawer,exports.BottomDrawerStyled=r.BottomDrawerStyled;
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/BottomDrawer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/cjs/components/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { CommonAndHTMLProps } from "../../Element/constants";
+export declare type BreadcrumbItemElementType = HTMLLIElement;
+export declare type BreadcrumbItemProps = CommonAndHTMLProps<BreadcrumbItemElementType>;
+export declare const BreadcrumbItem: React.ForwardRefExoticComponent<BreadcrumbItemProps & React.RefAttributes<HTMLLIElement>>;

package/dist/cjs/components/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../external/Element.js"),r=require("react"),t=require("./BreadcrumbItem.styled.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("styled-components");var u=/*#__PURE__*/a(r);const n=u.default.forwardRef(((r,a)=>{var n=e.__rest(r,[]);return u.default.createElement(e.Element,Object.assign({as:t.BreadcrumbItemStyled,ref:a,marginRight:"micro"},n))}));exports.BreadcrumbItem=n;
+//# sourceMappingURL=BreadcrumbItem.js.map

package/dist/cjs/components/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreadcrumbItem.js","sources":["../../../../../src/components/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Element } from \"../../Element/Element\";\nimport { CommonAndHTMLProps } from \"../../Element/constants\";\n\nimport { BreadcrumbItemStyled } from \"./BreadcrumbItem.styled\";\n\nexport type BreadcrumbItemElementType = HTMLLIElement;\nexport type BreadcrumbItemProps = CommonAndHTMLProps<BreadcrumbItemElementType>;\n\nexport const BreadcrumbItem = React.forwardRef(\n    ({ ...props }: BreadcrumbItemProps, ref: React.Ref<BreadcrumbItemElementType>) => {\n        return (\n            <Element<BreadcrumbItemElementType> as={BreadcrumbItemStyled} ref={ref} marginRight=\"micro\" {...props} />\n        );\n    }\n);\n"],"names":["BreadcrumbItem","React","forwardRef","_a","ref","props","Element","as","BreadcrumbItemStyled","marginRight"],"mappings":"gTAUaA,EAAiBC,UAAMC,YAChC,CAACC,EAAmCC,SAA9BC,aAAL,WAEOJ,wBAACK,yBAAmCC,GAAIC,uBAAsBJ,IAAKA,EAAKK,YAAY,SAAYJ"}

package/dist/cjs/components/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.stories.d.ts

@@ -0,0 +1,3 @@
+import { FictoanStory } from "../../../utils/storyUtils";
+import { BreadcrumbItem } from "./BreadcrumbItem";
+export declare const Default: FictoanStory<typeof BreadcrumbItem>;

package/dist/cjs/components/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.styled.d.ts

@@ -0,0 +1 @@
+export declare const BreadcrumbItemStyled: import("styled-components").StyledComponent<"li", any, {}, never>;

package/dist/cjs/components/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.styled.js

@@ -0,0 +1,2 @@
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0});const t=/*#__PURE__*/e(require("styled-components")).default.li.withConfig({displayName:"BreadcrumbItemStyled",componentId:"-jo1hcj"})`display:inline-flex;position:relative;font-size:14px;&::after{position:absolute;right:-14px;content:${e=>e.theme.breadcrumbs.separator.content};color:${e=>e.theme.breadcrumbs.separator.text};}&:last-child,&:last-child a{color:${e=>e.theme.breadcrumbs.item.active};}&:not(:last-child),&:not(:last-child)a{color:${e=>e.theme.breadcrumbs.item.inactive};}&:last-child::after{content:"";}`;exports.BreadcrumbItemStyled=t;
+//# sourceMappingURL=BreadcrumbItem.styled.js.map

package/dist/cjs/components/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreadcrumbItem.styled.js","sources":["../../../../../src/components/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { BreadcrumbItemProps } from \"./BreadcrumbItem\";\n\n\nexport const BreadcrumbItemStyled = styled.li`\n    display   : inline-flex;\n    position  : relative;\n    font-size : 14px;\n\n    &::after {\n        position : absolute;\n        right    : -14px;\n        content  : ${(props : BreadcrumbItemProps) => props.theme.breadcrumbs.separator.content};\n        color    : ${(props : BreadcrumbItemProps) => props.theme.breadcrumbs.separator.text};\n    }\n\n    &:last-child,\n    &:last-child a {\n        color : ${(props : BreadcrumbItemProps) => props.theme.breadcrumbs.item.active};\n    }\n\n    &:not(:last-child),\n    &:not(:last-child) a {\n        color : ${(props : BreadcrumbItemProps) => props.theme.breadcrumbs.item.inactive};\n    }\n\n    &:last-child::after {\n        content : \"\";\n    }\n`;\n"],"names":["BreadcrumbItemStyled","li","props","theme","breadcrumbs","separator","content","text","item","active","inactive"],"mappings":"kJAKaA,uDAA8BC,gLAQrBC,GAAgCA,EAAMC,MAAMC,YAAYC,UAAUC,iBAClEJ,GAAgCA,EAAMC,MAAMC,YAAYC,UAAUE,2CAKrEL,GAAgCA,EAAMC,MAAMC,YAAYI,KAAKC,wDAK7DP,GAAgCA,EAAMC,MAAMC,YAAYI,KAAKE"}

package/dist/cjs/components/Breadcrumbs/BreadcrumbsWrapper/BreadcrumbsWrapper.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { CommonAndHTMLProps } from "../../Element/constants";
+export declare type BreadcrumbsWrapperElementType = HTMLDivElement;
+export declare type BreadcrumbsWrapperProps = CommonAndHTMLProps<BreadcrumbsWrapperElementType>;
+export declare const BreadcrumbsWrapper: React.ForwardRefExoticComponent<BreadcrumbsWrapperProps & React.RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/Breadcrumbs/BreadcrumbsWrapper/BreadcrumbsWrapper.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../external/Element.js"),r=require("react"),t=require("./BreadcrumbsWrapper.styled.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("styled-components");var n=/*#__PURE__*/a(r);const s=n.default.forwardRef(((r,a)=>{var s=e.__rest(r,[]);return n.default.createElement(e.Element,Object.assign({as:t.BreadcrumbsWrapperStyled,ref:a},s,{paddingTop:"nano",paddingBottom:"nano"}))}));exports.BreadcrumbsWrapper=s;
+//# sourceMappingURL=BreadcrumbsWrapper.js.map

package/dist/cjs/components/Breadcrumbs/BreadcrumbsWrapper/BreadcrumbsWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreadcrumbsWrapper.js","sources":["../../../../../src/components/Breadcrumbs/BreadcrumbsWrapper/BreadcrumbsWrapper.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Element } from \"../../Element\";\nimport { CommonAndHTMLProps } from \"../../Element/constants\";\n\nimport { BreadcrumbsWrapperStyled } from \"./BreadcrumbsWrapper.styled\";\n\nexport type BreadcrumbsWrapperElementType = HTMLDivElement;\nexport type BreadcrumbsWrapperProps = CommonAndHTMLProps<BreadcrumbsWrapperElementType>;\n\nexport const BreadcrumbsWrapper = React.forwardRef(\n    ({ ...props }: BreadcrumbsWrapperProps, ref: React.Ref<BreadcrumbsWrapperElementType>) => {\n        return (\n            <Element<BreadcrumbsWrapperElementType>\n                as={BreadcrumbsWrapperStyled}\n                ref={ref}\n                {...props}\n                paddingTop=\"nano\"\n                paddingBottom=\"nano\"\n            />\n        );\n    }\n);\n"],"names":["BreadcrumbsWrapper","React","forwardRef","_a","ref","props","Element","as","BreadcrumbsWrapperStyled","paddingTop","paddingBottom"],"mappings":"oTAUaA,EAAqBC,UAAMC,YACpC,CAACC,EAAuCC,SAAlCC,aAAL,WAEOJ,wBAACK,yBACGC,GAAIC,2BACJJ,IAAKA,GACDC,GACJI,WAAW,OACXC,cAAc"}

package/dist/cjs/components/Breadcrumbs/BreadcrumbsWrapper/BreadcrumbsWrapper.stories.d.ts

@@ -0,0 +1,3 @@
+import { FictoanStory } from "../../../utils/storyUtils";
+import { BreadcrumbsWrapper } from "./BreadcrumbsWrapper";
+export declare const Default: FictoanStory<typeof BreadcrumbsWrapper>;

package/dist/cjs/components/Breadcrumbs/BreadcrumbsWrapper/BreadcrumbsWrapper.styled.d.ts

@@ -0,0 +1 @@
+export declare const BreadcrumbsWrapperStyled: import("styled-components").StyledComponent<"nav", any, {}, never>;

package/dist/cjs/components/Breadcrumbs/BreadcrumbsWrapper/BreadcrumbsWrapper.styled.js

@@ -0,0 +1,2 @@
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0});const r=/*#__PURE__*/e(require("styled-components")).default.nav.withConfig({displayName:"BreadcrumbsWrapperStyled",componentId:"-1re1uho"})`display:flex;flex-wrap:wrap;align-items:flex-start;box-shadow:0 1px 1px -1px rgba(0, 0, 0, 0.08);&:not([class*="bg-"]){background-color:${e=>e.theme.breadcrumbs.wrapper.bg};}`;exports.BreadcrumbsWrapperStyled=r;
+//# sourceMappingURL=BreadcrumbsWrapper.styled.js.map

package/dist/cjs/components/Breadcrumbs/BreadcrumbsWrapper/BreadcrumbsWrapper.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreadcrumbsWrapper.styled.js","sources":["../../../../../src/components/Breadcrumbs/BreadcrumbsWrapper/BreadcrumbsWrapper.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { BreadcrumbsWrapperProps } from \"./BreadcrumbsWrapper\";\n\n\nexport const BreadcrumbsWrapperStyled = styled.nav`\n    display     : flex;\n    flex-wrap   : wrap;\n    align-items : flex-start;\n    box-shadow  : 0 1px 1px -1px rgba(0, 0, 0, 0.08);\n    \n    &:not([class*=\"bg-\"]) {\n        background-color : ${(props : BreadcrumbsWrapperProps) => props.theme.breadcrumbs.wrapper.bg};\n    }\n`;\n"],"names":["BreadcrumbsWrapperStyled","nav","props","theme","breadcrumbs","wrapper","bg"],"mappings":"kJAKaA,uDAAkCC,0NAOjBC,GAAoCA,EAAMC,MAAMC,YAAYC,QAAQC"}

package/dist/cjs/components/Breadcrumbs/index.d.ts

@@ -0,0 +1,4 @@
+export { BreadcrumbsWrapper } from "./BreadcrumbsWrapper/BreadcrumbsWrapper";
+export { BreadcrumbsWrapperStyled } from "./BreadcrumbsWrapper/BreadcrumbsWrapper.styled";
+export { BreadcrumbItem } from "./BreadcrumbItem/BreadcrumbItem";
+export { BreadcrumbItemStyled } from "./BreadcrumbItem/BreadcrumbItem.styled";

package/dist/cjs/components/Breadcrumbs/index.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("./BreadcrumbsWrapper/BreadcrumbsWrapper.js"),e=require("./BreadcrumbsWrapper/BreadcrumbsWrapper.styled.js"),a=require("./BreadcrumbItem/BreadcrumbItem.js"),t=require("./BreadcrumbItem/BreadcrumbItem.styled.js");require("../../external/Element.js"),require("react"),require("styled-components"),exports.BreadcrumbsWrapper=r.BreadcrumbsWrapper,exports.BreadcrumbsWrapperStyled=e.BreadcrumbsWrapperStyled,exports.BreadcrumbItem=a.BreadcrumbItem,exports.BreadcrumbItemStyled=t.BreadcrumbItemStyled;
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Breadcrumbs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

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

@@ -0,0 +1,12 @@
+import React from "react";
+import { CommonAndHTMLProps } from "../Element/constants";
+export interface ButtonCustomProps {
+    kind?: "primary" | "secondary" | "tertiary" | "custom";
+    size?: "tiny" | "small" | "medium" | "large" | "huge";
+    shape?: "rounded" | "curved" | "circular";
+    isLoading?: boolean;
+    hasDelete?: boolean;
+}
+export declare type ButtonElementType = HTMLButtonElement;
+export declare type ButtonProps = Omit<CommonAndHTMLProps<ButtonElementType>, keyof ButtonCustomProps> & ButtonCustomProps;
+export declare const Button: React.ForwardRefExoticComponent<Omit<CommonAndHTMLProps<HTMLButtonElement>, keyof ButtonCustomProps> & ButtonCustomProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/cjs/components/Button/Button.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../external/Element.js"),t=require("react"),s=require("./Button.styled.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../external/helpers.js"),require("../../external/DefaultColours.js"),require("styled-components"),require("../../external/theme.js");var a=/*#__PURE__*/r(t);const u=a.default.forwardRef(((t,r)=>{var{size:u,shape:l,kind:n,isLoading:i,hasDelete:o}=t,d=e.__rest(t,["size","shape","kind","isLoading","hasDelete"]);let p=[];return n&&p.push(n),u&&p.push(`size-${u}`),l&&p.push(`shape-${l}`),i&&p.push("is-loading"),o&&p.push("has-delete"),a.default.createElement(e.Element,Object.assign({as:s.ButtonStyled,ref:r,classNames:p},d))}));exports.Button=u;
+//# sourceMappingURL=Button.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Element } from \"../Element/Element\";\nimport { CommonAndHTMLProps } from \"../Element/constants\";\n\nimport { ButtonStyled } from \"./Button.styled\";\n\n// prettier-ignore\nexport interface ButtonCustomProps {\n    kind      ? : \"primary\" | \"secondary\" | \"tertiary\" | \"custom\";\n    size      ? : \"tiny\" | \"small\" | \"medium\" | \"large\" | \"huge\";\n    shape     ? : \"rounded\" | \"curved\" | \"circular\";\n    isLoading ? : boolean;\n    hasDelete ? : boolean;\n}\n\nexport type ButtonElementType = HTMLButtonElement;\nexport type ButtonProps = Omit<CommonAndHTMLProps<ButtonElementType>, keyof ButtonCustomProps> & ButtonCustomProps;\n\nexport const Button = React.forwardRef(\n    ({ size, shape, kind, isLoading, hasDelete, ...props }: ButtonProps, ref: React.Ref<ButtonElementType>) => {\n        let classNames = [];\n\n        if (kind) {\n            classNames.push(kind);\n        }\n\n        if (size) {\n            classNames.push(`size-${size}`);\n        }\n\n        if (shape) {\n            classNames.push(`shape-${shape}`);\n        }\n\n        if (isLoading) {\n            classNames.push(\"is-loading\");\n        }\n\n        if (hasDelete) {\n            classNames.push(\"has-delete\");\n        }\n\n        return <Element<ButtonElementType> as={ButtonStyled} ref={ref} classNames={classNames} {...props} />;\n    }\n);\n"],"names":["Button","React","forwardRef","_a","ref","size","shape","kind","isLoading","hasDelete","props","classNames","push","Element","as","ButtonStyled"],"mappings":"yZAmBaA,EAASC,UAAMC,YACxB,CAACC,EAAoEC,SAApEC,KAAEA,EAAFC,MAAQA,EAARC,KAAeA,EAAfC,UAAqBA,EAArBC,UAAgCA,KAAcC,aAA9C,qDACOC,EAAa,UAEbJ,GACAI,EAAWC,KAAKL,GAGhBF,GACAM,EAAWC,aAAaP,KAGxBC,GACAK,EAAWC,cAAcN,KAGzBE,GACAG,EAAWC,KAAK,cAGhBH,GACAE,EAAWC,KAAK,cAGbX,wBAACY,yBAA2BC,GAAIC,eAAcX,IAAKA,EAAKO,WAAYA,GAAgBD"}

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

@@ -0,0 +1,6 @@
+import { FictoanStory } from "../../utils/storyUtils";
+import { Button } from "./Button";
+export declare const Primary: FictoanStory<typeof Button>;
+export declare const Secondary: FictoanStory<typeof Button>;
+export declare const Tertiary: FictoanStory<typeof Button>;
+export declare const Custom: FictoanStory<typeof Button>;

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

@@ -0,0 +1 @@
+export declare const ButtonStyled: import("styled-components").StyledComponent<"button", any, {}, never>;

package/dist/cjs/components/Button/Button.styled.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../external/helpers.js"),t=require("styled-components"),r=require("../../external/theme.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../external/DefaultColours.js");const i=/*#__PURE__*/o(t).default.button.withConfig({displayName:"ButtonStyled",componentId:"-1wr2pvt"})`position:relative;cursor:pointer;font-family:${e=>e.theme.button.font};font-weight:bold;font-size:92%;text-align:center;text-decoration:none;line-height:1;transition:all 0.2s ease-in-out;background-position:center;user-select:none;&:not([class*="padding-"]){padding:12px 24px;}> *{all:unset;}&:active{box-shadow:none;opacity:0.72;}&.is-loading::after{border:3px solid;border-top-color:transparent;border-right-color:transparent;}&[disabled]{box-shadow:none;user-select:none;pointer-events:none;opacity:0.32;filter:grayscale(100%);cursor:not-allowed;}&.primary{background-color:${e=>e.theme.button.primary.default.bg};color:${e=>e.theme.button.primary.default.text};border:solid ${e=>e.theme.button.primary.default.border};border-width:${r.globalVariables.borderWidth};border-radius:${e=>e.theme.button.primary.default.borderRadius};:hover{background-color:${e=>e.theme.button.primary.onHover.bg};color:${e=>e.theme.button.primary.onHover.text};border:solid ${e=>e.theme.button.primary.onHover.border};border-width:${r.globalVariables.borderWidth};}:active{background-color:${e=>e.theme.button.primary.isActive.bg};color:${e=>e.theme.button.primary.isActive.text};border:solid ${e=>e.theme.button.primary.isActive.border};border-width:${r.globalVariables.borderWidth};}&.is-loading::after{border:3px solid ${e=>e.theme.button.primary.isLoading.spinnerBorder};border-top-color:transparent;border-right-color:transparent;}&[disabled]{background-color:${e=>e.theme.button.primary.isDisabled.bg};color:${e=>e.theme.button.primary.isDisabled.text};border:solid ${e=>e.theme.button.primary.isDisabled.border};border-width:${r.globalVariables.borderWidth};}}&.secondary{background-color:${e=>e.theme.button.secondary.default.bg};color:${e=>e.theme.button.secondary.default.text};border:solid ${e=>e.theme.button.secondary.default.border};border-radius:${e=>e.theme.button.secondary.default.borderRadius};border-width:${r.globalVariables.borderWidth};:hover{background-color:${e=>e.theme.button.secondary.onHover.bg};color:${e=>e.theme.button.secondary.onHover.text};border:solid ${e=>e.theme.button.secondary.onHover.border};border-width:${r.globalVariables.borderWidth};}:active{background-color:${e=>e.theme.button.secondary.isActive.bg};color:${e=>e.theme.button.secondary.isActive.text};border:solid ${e=>e.theme.button.secondary.isActive.border};border-width:${r.globalVariables.borderWidth};}&.is-loading::after{border:3px solid ${e=>e.theme.button.secondary.isLoading.spinnerBorder};border-top-color:transparent;border-right-color:transparent;}&[disabled]{background-color:${e=>e.theme.button.secondary.isDisabled.bg};color:${e=>e.theme.button.secondary.isDisabled.text};border:solid ${e=>e.theme.button.secondary.isDisabled.border};border-width:${r.globalVariables.borderWidth};}}&.tertiary{background-color:${e=>e.theme.button.tertiary.default.bg};color:${e=>e.theme.button.tertiary.default.text};border:solid ${e=>e.theme.button.tertiary.default.border};border-radius:${e=>e.theme.button.tertiary.default.borderRadius};border-width:${r.globalVariables.borderWidth};:hover{background-color:${e=>e.theme.button.tertiary.onHover.bg};color:${e=>e.theme.button.tertiary.onHover.text};border:solid ${e=>e.theme.button.tertiary.onHover.border};border-width:${r.globalVariables.borderWidth};}:active{background-color:${e=>e.theme.button.tertiary.isActive.bg};color:${e=>e.theme.button.tertiary.isActive.text};border:solid ${e=>e.theme.button.tertiary.isActive.border};border-width:${r.globalVariables.borderWidth};}&.is-loading::after{border:3px solid ${e=>e.theme.button.tertiary.isLoading.spinnerBorder};border-top-color:transparent;border-right-color:transparent;}&[disabled]{background-color:${e=>e.theme.button.tertiary.isDisabled.bg};color:${e=>e.theme.button.tertiary.isDisabled.text};border:solid ${e=>e.theme.button.tertiary.isDisabled.border};border-width:${r.globalVariables.borderWidth};}}&.shape-circular{width:64px;height:64px;padding:0 !important;border-radius:50%;}&.shape-circular.size-tiny{width:16px;height:16px;padding:0;font-size:8px;}&.shape-circular.size-small{width:32px;height:32px;padding:0;font-size:12px;}&.shape-circular.size-medium{font-size:16px;}&.shape-circular.size-large{width:80px;height:80px;padding:0;font-size:24px;}&.shape-circular.size-huge{width:128px;height:128px;padding:0;font-size:32px;}&.shape-circular img{position:absolute;margin:auto;left:0;top:0;bottom:0;right:0;}&[class*="border-"]{border-width:${r.globalVariables.borderWidth};}&.border-none{border-width:0 !important;}&.size-tiny{padding:4px 8px;font-size:${e=>e.theme.text.paras.size*Math.pow(e.theme.text.headings.multiplier,-2)}em;}&.size-small{padding:6px 12px;font-size:${e=>e.theme.text.paras.size*Math.pow(e.theme.text.headings.multiplier,-1)}em;}&.size-large{padding:16px 32px;font-size:${e=>e.theme.text.paras.size*Math.pow(e.theme.text.headings.multiplier,2)}em;}&.size-huge{padding:24px 40px;font-size:${e=>e.theme.text.paras.size*Math.pow(e.theme.text.headings.multiplier,4)}em;}&.is-loading{color:transparent !important;box-shadow:none;user-select:none;pointer-events:none;}&.is-loading::after{display:block;position:absolute;margin:auto;left:0;top:0;bottom:0;right:0;height:16px;width:16px;border-radius:50%;content:"";border:3px solid;border-color:${t=>{var r;return e.convertToFictoanColor(null!==(r=t.textColor)&&void 0!==r?r:t.textColour)}};border-top-color:transparent;border-right-color:transparent;-webkit-animation:spinner 0.4s infinite linear;animation:spinner 0.4s infinite linear;}&.size-tiny.is-loading::after,&.size-small.is-loading::after{height:8px;width:8px;}@-webkit-keyframes spinner{from{-webkit-transform:rotate(0deg);}to{-webkit-transform:rotate(359deg);}}@keyframes spinner{from{transform:rotate(0deg);}to{transform:rotate(359deg);}}&.has-delete{display:inline-flex;}&.has-delete::after{display:inline-flex;position:absolute;cursor:pointer;right:8px;content:"\\00d7";font-size:17px;line-height:1;align-self:center;}&.has-delete,&.size-tiny.has-delete,&.size-small.has-delete{padding-right:32px !important;}&.size-large.has-delete{padding-right:40px !important;}&.size-huge.has-delete{padding-right:48px !important;}&.size-large.has-delete::after,&.size-huge.has-delete::after{font-size:25px;right:16px;}`;exports.ButtonStyled=i;
+//# sourceMappingURL=Button.styled.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Button.styled.js","sources":["../../../../src/components/Button/Button.styled.tsx"],"sourcesContent":["import { convertToFictoanColor } from \"../../utils/helpers\";\nimport styled from \"styled-components\";\n\nimport { ButtonProps } from \"./Button\";\nimport { ColourPropTypes } from \"../Element/constants\";\nimport { globalVariables } from \"../../styles/theme\";\n\nexport const ButtonStyled = styled.button`\n    position            : relative;\n    cursor              : pointer;\n    font-family         : ${(props : ButtonProps) => props.theme.button.font};\n    font-weight         : bold;\n    font-size           : 92%;\n    text-align          : center;\n    text-decoration     : none;\n    line-height         : 1;\n    transition          : all 0.2s ease-in-out;\n    background-position : center;\n    user-select         : none;\n\n    &:not([class*=\"padding-\"]) {\n        padding : 12px 24px;\n    }\n\n    // To make sure a button’s children don’t style themselves like a douchebag\n    > * { all : unset; }\n\n    &:active {\n        box-shadow : none;\n        opacity    : 0.72;\n    }\n\n    &.is-loading::after {\n        border             : 3px solid;\n        border-top-color   : transparent;\n        border-right-color : transparent;\n    }\n\n    //  Common disabled styles  -----------------------------------------------\n    &[disabled] {\n        box-shadow     : none;\n        user-select    : none;\n        pointer-events : none;\n        opacity        : 0.32;\n        filter         : grayscale(100%);\n        cursor         : not-allowed;\n    }\n\n    //  PRIMARY BUTTON  ///////////////////////////////////////////////////////\n    &.primary {\n        background-color : ${(props : ButtonProps) => props.theme.button.primary.default.bg};\n        color            : ${(props : ButtonProps) => props.theme.button.primary.default.text};\n        border           : solid ${(props : ButtonProps) => props.theme.button.primary.default.border};\n        border-width     : ${globalVariables.borderWidth};\n        border-radius    : ${(props : ButtonProps) => props.theme.button.primary.default.borderRadius};\n\n        :hover {\n            background-color : ${(props : ButtonProps) => props.theme.button.primary.onHover.bg};\n            color            : ${(props : ButtonProps) => props.theme.button.primary.onHover.text};\n            border           : solid ${(props : ButtonProps) => props.theme.button.primary.onHover.border};\n            border-width     : ${globalVariables.borderWidth};\n        }\n\n        :active {\n            background-color : ${(props : ButtonProps) => props.theme.button.primary.isActive.bg};\n            color            : ${(props : ButtonProps) => props.theme.button.primary.isActive.text};\n            border           : solid ${(props : ButtonProps) => props.theme.button.primary.isActive.border};\n            border-width     : ${globalVariables.borderWidth};\n        }\n\n        &.is-loading::after {\n            border             : 3px solid ${(props : ButtonProps) => props.theme.button.primary.isLoading.spinnerBorder};\n            border-top-color   : transparent;\n            border-right-color : transparent;\n        }\n\n        //  DISABLED PRIMARY --------------------------------------------------\n        &[disabled] {\n            background-color : ${(props : ButtonProps) => props.theme.button.primary.isDisabled.bg};\n            color            : ${(props : ButtonProps) => props.theme.button.primary.isDisabled.text};\n            border           : solid ${(props : ButtonProps) => props.theme.button.primary.isDisabled.border};\n            border-width     : ${globalVariables.borderWidth};\n        }\n    }\n\n    //  SECONDARY BUTTON  /////////////////////////////////////////////////////\n    &.secondary {\n        background-color : ${(props : ButtonProps) => props.theme.button.secondary.default.bg};\n        color            : ${(props : ButtonProps) => props.theme.button.secondary.default.text};\n        border           : solid ${(props : ButtonProps) => props.theme.button.secondary.default.border};\n        border-radius    : ${(props : ButtonProps) => props.theme.button.secondary.default.borderRadius};\n        border-width     : ${globalVariables.borderWidth};\n\n        :hover {\n            background-color : ${(props : ButtonProps) => props.theme.button.secondary.onHover.bg};\n            color            : ${(props : ButtonProps) => props.theme.button.secondary.onHover.text};\n            border           : solid ${(props : ButtonProps) => props.theme.button.secondary.onHover.border};\n            border-width     : ${globalVariables.borderWidth};\n        }\n\n        :active {\n            background-color : ${(props : ButtonProps) => props.theme.button.secondary.isActive.bg};\n            color            : ${(props : ButtonProps) => props.theme.button.secondary.isActive.text};\n            border           : solid ${(props : ButtonProps) => props.theme.button.secondary.isActive.border};\n            border-width     : ${globalVariables.borderWidth};\n        }\n\n        &.is-loading::after {\n            border             : 3px solid ${(props : ButtonProps) => props.theme.button.secondary.isLoading.spinnerBorder};\n            border-top-color   : transparent;\n            border-right-color : transparent;\n        }\n\n        //  DISABLED SECONDARY ------------------------------------------------\n        &[disabled] {\n            background-color : ${(props : ButtonProps) => props.theme.button.secondary.isDisabled.bg};\n            color            : ${(props : ButtonProps) => props.theme.button.secondary.isDisabled.text};\n            border           : solid ${(props : ButtonProps) => props.theme.button.secondary.isDisabled.border};\n            border-width     : ${globalVariables.borderWidth};\n        }\n    }\n\n    //  TERTIARY BUTTON  //////////////////////////////////////////////////////\n    &.tertiary {\n        background-color : ${(props : ButtonProps) => props.theme.button.tertiary.default.bg};\n        color            : ${(props : ButtonProps) => props.theme.button.tertiary.default.text};\n        border           : solid ${(props : ButtonProps) => props.theme.button.tertiary.default.border};\n        border-radius    : ${(props : ButtonProps) => props.theme.button.tertiary.default.borderRadius};\n        border-width     : ${globalVariables.borderWidth};\n\n        :hover {\n            background-color : ${(props : ButtonProps) => props.theme.button.tertiary.onHover.bg};\n            color            : ${(props : ButtonProps) => props.theme.button.tertiary.onHover.text};\n            border           : solid ${(props : ButtonProps) => props.theme.button.tertiary.onHover.border};\n            border-width     : ${globalVariables.borderWidth};\n        }\n\n        :active {\n            background-color : ${(props : ButtonProps) => props.theme.button.tertiary.isActive.bg};\n            color            : ${(props : ButtonProps) => props.theme.button.tertiary.isActive.text};\n            border           : solid ${(props : ButtonProps) => props.theme.button.tertiary.isActive.border};\n            border-width     : ${globalVariables.borderWidth};\n        }\n\n        &.is-loading::after {\n            border             : 3px solid ${(props : ButtonProps) => props.theme.button.tertiary.isLoading.spinnerBorder};\n            border-top-color   : transparent;\n            border-right-color : transparent;\n        }\n\n        //  DISABLED TERTIARY -------------------------------------------------\n        &[disabled] {\n            background-color : ${(props : ButtonProps) => props.theme.button.tertiary.isDisabled.bg};\n            color            : ${(props : ButtonProps) => props.theme.button.tertiary.isDisabled.text};\n            border           : solid ${(props : ButtonProps) => props.theme.button.tertiary.isDisabled.border};\n            border-width     : ${globalVariables.borderWidth};\n        }\n    }\n\n    //  ROUND BUTTON  /////////////////////////////////////////////////////////\n    &.shape-circular {\n        width         : 64px;\n        height        : 64px;\n        padding       : 0 !important;\n        border-radius : 50%;\n    }\n\n    &.shape-circular.size-tiny {\n        width     : 16px;\n        height    : 16px;\n        padding   : 0;\n        font-size : 8px;\n    }\n\n    &.shape-circular.size-small {\n        width     : 32px;\n        height    : 32px;\n        padding   : 0;\n        font-size : 12px;\n    }\n\n    &.shape-circular.size-medium {\n        font-size : 16px;\n    }\n\n    &.shape-circular.size-large {\n        width     : 80px;\n        height    : 80px;\n        padding   : 0;\n        font-size : 24px;\n    }\n\n    &.shape-circular.size-huge {\n        width     : 128px;\n        height    : 128px;\n        padding   : 0;\n        font-size : 32px;\n    }\n\n    &.shape-circular img {\n        position : absolute;\n        margin   : auto;\n        left     : 0;\n        top      : 0;\n        bottom   : 0;\n        right    : 0;\n    }\n\n    &[class*=\"border-\"] {\n        border-width : ${globalVariables.borderWidth};\n    }\n\n    &.border-none { border-width : 0 !important; }\n\n    //  DIFFERENT SIZES  //////////////////////////////////////////////////////\n    &.size-tiny {\n        padding   : 4px 8px;\n        font-size : ${(props : ButtonProps) => props.theme.text.paras.size * Math.pow(props.theme.text.headings.multiplier, -2)}em;\n    }\n\n    &.size-small {\n        padding   : 6px 12px;\n        font-size : ${(props : ButtonProps) => props.theme.text.paras.size * Math.pow(props.theme.text.headings.multiplier, -1)}em;\n    }\n\n    &.size-large {\n        padding   : 16px 32px;\n        font-size : ${(props : ButtonProps) => props.theme.text.paras.size * Math.pow(props.theme.text.headings.multiplier, 2)}em;\n    }\n\n    &.size-huge {\n        padding   : 24px 40px;\n        font-size : ${(props : ButtonProps) => props.theme.text.paras.size * Math.pow(props.theme.text.headings.multiplier, 4)}em;\n    }\n\n    //  BUTTON WITH SPINNER  //////////////////////////////////////////////////\n    &.is-loading {\n        color          : transparent !important;\n        box-shadow     : none;\n        user-select    : none;\n        pointer-events : none;\n    }\n\n    &.is-loading::after {\n        display            : block;\n        position           : absolute;\n        margin             : auto;\n        left               : 0;\n        top                : 0;\n        bottom             : 0;\n        right              : 0;\n        height             : 16px;\n        width              : 16px;\n        border-radius      : 50%;\n        content            : \"\";\n        border             : 3px solid;\n        border-color       : ${(props : ButtonProps) => convertToFictoanColor((props.textColor ?? props.textColour) as ColourPropTypes)};\n        border-top-color   : transparent;\n        border-right-color : transparent;\n        -webkit-animation  : spinner 0.4s infinite linear;\n        animation          : spinner 0.4s infinite linear;\n    }\n\n    &.size-tiny.is-loading::after,\n    &.size-small.is-loading::after {\n        height : 8px;\n        width  : 8px;\n    }\n\n    /*  Animation for loader  */\n    @-webkit-keyframes spinner {\n        from {\n            -webkit-transform : rotate(0deg);\n        }\n        to {\n            -webkit-transform : rotate(359deg);\n        }\n    }\n\n    @keyframes spinner {\n        from {\n            transform : rotate(0deg);\n        }\n        to {\n            transform : rotate(359deg);\n        }\n    }\n\n    //  BUTTON WITH DELETE  ///////////////////////////////////////////////////\n    &.has-delete {\n        display : inline-flex;\n    }\n\n    &.has-delete::after {\n        display     : inline-flex;\n        position    : absolute;\n        cursor      : pointer;\n        right       : 8px;\n        content     : \"\\\\00d7\";\n        font-size   : 17px;\n        line-height : 1;\n        align-self  : center;\n    }\n\n    &.has-delete,\n    &.size-tiny.has-delete,\n    &.size-small.has-delete {\n        padding-right : 32px !important;\n    }\n\n    &.size-large.has-delete {\n        padding-right : 40px !important;\n    }\n\n    &.size-huge.has-delete {\n        padding-right : 48px !important;\n    }\n\n    &.size-large.has-delete::after,\n    &.size-huge.has-delete::after {\n        font-size : 25px;\n        right     : 16px;\n    }\n`;\n"],"names":["ButtonStyled","button","props","theme","font","primary","default","bg","text","border","globalVariables","borderWidth","borderRadius","onHover","isActive","isLoading","spinnerBorder","isDisabled","secondary","tertiary","paras","size","Math","pow","headings","multiplier","convertToFictoanColor","textColor","textColour"],"mappings":"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"}

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

@@ -0,0 +1,2 @@
+export { Button } from "./Button";
+export { ButtonStyled } from "./Button.styled";

package/dist/cjs/components/Button/index.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./Button.js"),t=require("./Button.styled.js");require("../../external/Element.js"),require("react"),require("../../external/helpers.js"),require("../../external/DefaultColours.js"),require("styled-components"),require("../../external/theme.js"),exports.Button=e.Button,exports.ButtonStyled=t.ButtonStyled;
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/cjs/components/Callout/Callout.d.ts

@@ -0,0 +1,9 @@
+import React, { ReactNode } from "react";
+import { CommonAndHTMLProps } from "../Element/constants";
+export interface CalloutCustomProps {
+    kind: "info" | "success" | "warning" | "error";
+    children: ReactNode;
+}
+export declare type CalloutElementType = HTMLDivElement;
+export declare type CalloutProps = Omit<CommonAndHTMLProps<CalloutElementType>, keyof CalloutCustomProps> & CalloutCustomProps;
+export declare const Callout: React.ForwardRefExoticComponent<Omit<CommonAndHTMLProps<HTMLDivElement>, keyof CalloutCustomProps> & CalloutCustomProps & React.RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/Callout/Callout.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../external/Element.js"),r=require("react"),t=require("./Callout.styled.js"),l=require("../Typography/Text.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../external/theme.js"),require("../../external/DefaultColours.js"),require("styled-components");var n=/*#__PURE__*/a(r);const u=n.default.forwardRef(((r,a)=>{var{kind:u,children:o}=r,s=e.__rest(r,["kind","children"]);return n.default.createElement(e.Element,Object.assign({as:t.CalloutStyled,ref:a,className:u},s),n.default.createElement(l.Text,{marginBottom:"none",marginTop:"none"},o))}));exports.Callout=u;
+//# sourceMappingURL=Callout.js.map

package/dist/cjs/components/Callout/Callout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Callout.js","sources":["../../../../src/components/Callout/Callout.tsx"],"sourcesContent":["import React, { ReactNode } from \"react\";\n\nimport { CommonAndHTMLProps } from \"../Element/constants\";\nimport { Element } from \"../Element\";\nimport { Text } from \"../Typography\";\n\nimport { CalloutStyled } from \"./Callout.styled\";\n\n// prettier-ignore\nexport interface CalloutCustomProps {\n    kind     : \"info\" | \"success\" | \"warning\" | \"error\";\n    children : ReactNode;\n}\n\nexport type CalloutElementType = HTMLDivElement;\nexport type CalloutProps = Omit<CommonAndHTMLProps<CalloutElementType>, keyof CalloutCustomProps> & CalloutCustomProps;\n\nexport const Callout = React.forwardRef(\n    ({kind, children, ...props}: CalloutProps, ref: React.Ref<CalloutElementType>) => {\n        return (\n            <Element<CalloutElementType> as={CalloutStyled} ref={ref} className={kind} {...props}>\n                <Text marginBottom=\"none\" marginTop=\"none\">\n                    {children}\n                </Text>\n            </Element>\n        );\n    }\n);\n"],"names":["Callout","React","forwardRef","_a","ref","kind","children","props","Element","as","CalloutStyled","className","Text","marginBottom","marginTop"],"mappings":"wZAiBaA,EAAUC,UAAMC,YACzB,CAACC,EAA0CC,SAA1CC,KAACA,EAADC,SAAOA,KAAaC,aAApB,4BAEON,wBAACO,yBAA4BC,GAAIC,gBAAeN,IAAKA,EAAKO,UAAWN,GAAUE,GAC3EN,wBAACW,QAAKC,aAAa,OAAOC,UAAU,QAC/BR"}

package/dist/cjs/components/Callout/Callout.stories.d.ts

@@ -0,0 +1,3 @@
+import { FictoanStory } from "../../utils/storyUtils";
+import { Callout } from "./Callout";
+export declare const Default: FictoanStory<typeof Callout>;

package/dist/cjs/components/Callout/Callout.styled.d.ts

@@ -0,0 +1 @@
+export declare const CalloutStyled: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/cjs/components/Callout/Callout.styled.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("../../external/theme.js"),e=require("styled-components"),o=require("../../external/DefaultColours.js");function t(r){return r&&"object"==typeof r&&"default"in r?r:{default:r}}var a=/*#__PURE__*/t(e),l={exports:{}};!function(e,o){o.__esModule=!0,o.default=void 0;var t=/*#__PURE__*/d(r._curry.exports),a=/*#__PURE__*/d(r._guard.exports),l=/*#__PURE__*/d(r.rgba.exports),u=/*#__PURE__*/d(r.parseToRgb.exports);function d(r){return r&&r.__esModule?r:{default:r}}function s(){return(s=Object.assign||function(r){for(var e=1;e<arguments.length;e++){var o=arguments[e];for(var t in o)Object.prototype.hasOwnProperty.call(o,t)&&(r[t]=o[t])}return r}).apply(this,arguments)}function n(r,e){if("transparent"===e)return e;var o=(0,u.default)(e),t="number"==typeof o.alpha?o.alpha:1,d=s({},o,{alpha:(0,a.default)(0,1,+(100*t-100*parseFloat(r)).toFixed(2)/100)});return(0,l.default)(d)}var f=/*#__PURE__*/(0,t.default)(n);o.default=f,e.exports=o.default}(l,l.exports);var u=/*@__PURE__*/r.getDefaultExportFromCjs(l.exports);const d=a.default.div.withConfig({displayName:"CalloutStyled",componentId:"-nj77kr"})`display:block;border-width:0 0 0 5px;word-break:break-word;border-style:solid;padding:16px;border-radius:${r.globalVariables.borderRadius};&.info{background-color:${u(.8,o.defaultColours.blue)};border-color:${o.defaultColours.blue};}&.success{background-color:${u(.8,o.defaultColours.green)};border-color:${o.defaultColours.green};}&.warning{background-color:${u(.8,o.defaultColours.amber)};border-color:${o.defaultColours.amber};}&.error{background-color:${u(.8,o.defaultColours.red)};border-color:${o.defaultColours.red};}`;exports.CalloutStyled=d;
+//# sourceMappingURL=Callout.styled.js.map

package/dist/cjs/components/Callout/Callout.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Callout.styled.js","sources":["../../../../node_modules/polished/lib/color/transparentize.js","../../../../src/components/Callout/Callout.styled.tsx"],"sourcesContent":["\"use strict\";\n\nexports.__esModule = true;\nexports[\"default\"] = void 0;\n\nvar _curry = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require(\"../internalHelpers/_curry\"));\n\nvar _guard = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require(\"../internalHelpers/_guard\"));\n\nvar _rgba = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require(\"./rgba\"));\n\nvar _parseToRgb = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require(\"./parseToRgb\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { \"default\": obj }; }\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\n/**\n * Decreases the opacity of a color. Its range for the amount is between 0 to 1.\n *\n *\n * @example\n * // Styles as object usage\n * const styles = {\n *   background: transparentize(0.1, '#fff');\n *   background: transparentize(0.2, 'hsl(0, 0%, 100%)'),\n *   background: transparentize('0.5', 'rgba(255, 0, 0, 0.8)'),\n * }\n *\n * // styled-components usage\n * const div = styled.div`\n *   background: ${transparentize(0.1, '#fff')};\n *   background: ${transparentize(0.2, 'hsl(0, 0%, 100%)')},\n *   background: ${transparentize('0.5', 'rgba(255, 0, 0, 0.8)')},\n * `\n *\n * // CSS in JS Output\n *\n * element {\n *   background: \"rgba(255,255,255,0.9)\";\n *   background: \"rgba(255,255,255,0.8)\";\n *   background: \"rgba(255,0,0,0.3)\";\n * }\n */\nfunction transparentize(amount, color) {\n  if (color === 'transparent') return color;\n  var parsedColor = (0, _parseToRgb[\"default\"])(color);\n  var alpha = typeof parsedColor.alpha === 'number' ? parsedColor.alpha : 1;\n\n  var colorWithAlpha = _extends({}, parsedColor, {\n    alpha: (0, _guard[\"default\"])(0, 1, +(alpha * 100 - parseFloat(amount) * 100).toFixed(2) / 100)\n  });\n\n  return (0, _rgba[\"default\"])(colorWithAlpha);\n} // prettier-ignore\n\n\nvar curriedTransparentize = /*#__PURE__*/(0, _curry[\"default\"]\n/* ::<number | string, string, string> */\n)(transparentize);\nvar _default = curriedTransparentize;\nexports[\"default\"] = _default;\nmodule.exports = exports.default;","import transparentize from \"polished/lib/color/transparentize\";\nimport styled from \"styled-components\";\n\nimport { defaultColours } from \"../../styles/DefaultColours\";\nimport { globalVariables } from \"../../styles/theme\";\n\nexport const CalloutStyled = styled.div`\n    display       : block;\n    border-width  : 0 0 0 5px;\n    word-break    : break-word;\n    border-style  : solid;\n    padding       : 16px;\n    border-radius : ${globalVariables.borderRadius};\n\n    &.info {\n        background-color : ${transparentize(0.80, defaultColours.blue)};\n        border-color     : ${defaultColours.blue};\n    }\n\n    &.success {\n        background-color : ${transparentize(0.80, defaultColours.green)};\n        border-color     : ${defaultColours.green};\n    }\n\n    &.warning {\n        background-color : ${transparentize(0.80, defaultColours.amber)};\n        border-color     : ${defaultColours.amber};\n    }\n\n    &.error {\n        background-color : ${transparentize(0.80, defaultColours.red)};\n        border-color     : ${defaultColours.red};\n    }\n`;\n"],"names":["exports","_curry","_interopRequireDefault","require$$0","_guard","require$$1","_rgba","require$$2","_parseToRgb","require$$3","obj","__esModule","_extends","Object","assign","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","this","transparentize","amount","color","parsedColor","alpha","colorWithAlpha","parseFloat","toFixed","_default","module","default","CalloutStyled","styled","div","globalVariables","borderRadius","defaultColours","blue","green","amber","red"],"mappings":"wTAEAA,cAAqB,EACrBA,EAAO,aAAc,MAEjBC,eAAsBC,EAAqCC,kBAE3DC,eAAsBF,EAAqCG,kBAE3DC,eAAqBJ,EAAqCK,gBAE1DC,eAA2BN,EAAqCO,+BAE3DP,EAAuBQ,UAAcA,GAAOA,EAAIC,WAAaD,EAAM,SAAaA,YAEhFE,WAAaA,EAAWC,OAAOC,QAAU,SAAUC,OAAe,IAAIC,EAAI,EAAGA,EAAIC,UAAUC,OAAQF,IAAK,KAAMG,EAASF,UAAUD,OAAS,IAAII,KAAOD,EAAcN,OAAOQ,UAAUC,eAAeC,KAAKJ,EAAQC,KAAQL,EAAOK,GAAOD,EAAOC,WAAmBL,IAA2BS,MAAMC,KAAMR,oBA6BvSS,EAAeC,EAAQC,MAChB,gBAAVA,EAAyB,OAAOA,MAChCC,GAAc,EAAIrB,EAAW,SAAaoB,GAC1CE,EAAqC,iBAAtBD,EAAYC,MAAqBD,EAAYC,MAAQ,EAEpEC,EAAiBnB,EAAS,GAAIiB,EAAa,CAC7CC,OAAO,EAAI1B,EAAM,SAAa,EAAG,IAAa,IAAR0B,EAAmC,IAArBE,WAAWL,IAAeM,QAAQ,GAAK,cAGtF,EAAI3B,EAAK,SAAayB,OAO3BG,gBAHqC,EAAIjC,EAAM,SAEjDyB,GAEF1B,EAAO,QAAckC,EACrBC,UAAiBnC,EAAQoC,oFCxDZC,EAAgBC,UAAOC,+KAMdC,kBAAgBC,wCAGTf,EAAe,GAAMgB,iBAAeC,sBACpCD,iBAAeC,oCAIfjB,EAAe,GAAMgB,iBAAeE,uBACpCF,iBAAeE,qCAIflB,EAAe,GAAMgB,iBAAeG,uBACpCH,iBAAeG,mCAIfnB,EAAe,GAAMgB,iBAAeI,qBACpCJ,iBAAeI"}

package/dist/cjs/components/Callout/index.d.ts

@@ -0,0 +1,2 @@
+export { Callout } from "./Callout";
+export { CalloutStyled } from "./Callout.styled";

package/dist/cjs/components/Callout/index.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./Callout.js"),r=require("./Callout.styled.js");require("../../external/Element.js"),require("react"),require("../Typography/Text.js"),require("../../external/theme.js"),require("../../external/DefaultColours.js"),require("styled-components"),exports.Callout=e.Callout,exports.CalloutStyled=r.CalloutStyled;
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Callout/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/cjs/components/Card/Card.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { CommonAndHTMLProps } from "../Element/constants";
+export declare type CardElementType = HTMLDivElement;
+export declare type CardProps = CommonAndHTMLProps<CardElementType>;
+export declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/Card/Card.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../external/Element.js"),r=require("react"),t=require("./Card.styled.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("styled-components"),require("../../external/theme.js"),require("../../external/DefaultColours.js");var s=/*#__PURE__*/a(r);const l=s.default.forwardRef(((r,a)=>{var{shape:l}=r,u=e.__rest(r,["shape"]);let n=[];return l&&n.push(`shape-${l}`),s.default.createElement(e.Element,Object.assign({as:t.CardStyled,ref:a,classNames:n},u))}));exports.Card=l;
+//# sourceMappingURL=Card.js.map

package/dist/cjs/components/Card/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.js","sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Element } from \"../Element/Element\";\nimport { CommonAndHTMLProps } from \"../Element/constants\";\n\nimport { CardStyled } from \"./Card.styled\";\n\nexport type CardElementType = HTMLDivElement;\nexport type CardProps = CommonAndHTMLProps<CardElementType>;\n\nexport const Card = React.forwardRef(({ shape, ...props }: CardProps, ref: React.Ref<CardElementType>) => {\n    let classNames = [];\n\n    if (shape) {\n        classNames.push(`shape-${shape}`);\n    }\n\n    return <Element<CardElementType> as={CardStyled} ref={ref} classNames={classNames} {...props} />;\n});\n"],"names":["Card","React","forwardRef","_a","ref","shape","props","classNames","push","Element","as","CardStyled"],"mappings":"kXAUaA,EAAOC,UAAMC,YAAW,CAACC,EAAgCC,SAAhCC,MAAEA,KAAUC,aAAZ,eAC9BC,EAAa,UAEbF,GACAE,EAAWC,cAAcH,KAGtBJ,wBAACQ,yBAAyBC,GAAIC,aAAYP,IAAKA,EAAKG,WAAYA,GAAgBD"}

package/dist/cjs/components/Card/Card.stories.d.ts

@@ -0,0 +1,3 @@
+import { FictoanStory } from "../../utils/storyUtils";
+import { Card } from "./Card";
+export declare const Default: FictoanStory<typeof Card>;

package/dist/cjs/components/Card/Card.styled.d.ts

@@ -0,0 +1 @@
+export declare const CardStyled: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/cjs/components/Card/Card.styled.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var d=require("styled-components"),e=require("../../external/theme.js");function a(d){return d&&"object"==typeof d&&"default"in d?d:{default:d}}require("../../external/DefaultColours.js");const r=/*#__PURE__*/a(d).default.div.withConfig({displayName:"CardStyled",componentId:"-1xpuzqr"})`position:relative;width:100%;&[class*="border-"]{border-width:${e.globalVariables.borderWidth};}&:not([class*="border-"]){border:1px solid ${d=>d.theme.card.border};}&:not([class*="bg-"]){background-color:${d=>d.theme.card.bg};}&.shape-rounded{border-radius:${d=>d.theme.card.borderRadius};}&.padding-all-tiny{padding:8px;}&.padding-all-small{padding:16px;}&.padding-all-medium{padding:32px;}&.padding-all-large{padding:48px;}&.padding-all-huge{padding:64px;}@media all and (max-width : 600px){&[class*="padding"]{padding:4vmin;}.padding-none{padding:0 !important;}}`;exports.CardStyled=r;
+//# sourceMappingURL=Card.styled.js.map

package/dist/cjs/components/Card/Card.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.styled.js","sources":["../../../../src/components/Card/Card.styled.tsx"],"sourcesContent":["///////////////////////////////////////////////////////////////////////////////\n// CARD\n// The card is a simple box that encloses content within, and is one of the\n// oft-used components in modern UI.\n///////////////////////////////////////////////////////////////////////////////\n\nimport styled from \"styled-components\";\n\nimport { CardProps } from \"./Card\";\nimport { globalVariables } from \"../../styles/theme\";\n\n\nexport const CardStyled = styled.div`\n    position : relative;\n    width    : 100%;\n\n    &[class*=\"border-\"] { border-width : ${globalVariables.borderWidth}; }\n\n    &:not([class*=\"border-\"]) { border : 1px solid ${(props: CardProps) => props.theme.card.border}; }\n    \n    &:not([class*=\"bg-\"]) { background-color : ${(props: CardProps) => props.theme.card.bg}; }\n\n    &.shape-rounded { border-radius : ${(props: CardProps) => props.theme.card.borderRadius}; }\n\n    &.padding-all-tiny   { padding : 8px; }\n    &.padding-all-small  { padding : 16px; }\n    &.padding-all-medium { padding : 32px; }\n    &.padding-all-large  { padding : 48px; }\n    &.padding-all-huge   { padding : 64px; }\n\n    @media all and (max-width : 600px) {\n        &[class*=\"padding\"] { padding : 4vmin; }\n\n        .padding-none { padding : 0 !important; }\n    }\n`;\n"],"names":["CardStyled","div","globalVariables","borderWidth","props","theme","card","border","bg","borderRadius"],"mappings":"sQAYaA,4BAAoBC,kIAIUC,kBAAgBC,2DAELC,GAAqBA,EAAMC,MAAMC,KAAKC,kDAE1CH,GAAqBA,EAAMC,MAAMC,KAAKE,qCAE/CJ,GAAqBA,EAAMC,MAAMC,KAAKG"}

package/dist/cjs/components/Card/index.d.ts

@@ -0,0 +1,2 @@
+export { Card } from "./Card";
+export { CardStyled } from "./Card.styled";

package/dist/cjs/components/Card/index.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./Card.js"),r=require("./Card.styled.js");require("../../external/Element.js"),require("react"),require("styled-components"),require("../../external/theme.js"),require("../../external/DefaultColours.js"),exports.Card=e.Card,exports.CardStyled=r.CardStyled;
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Card/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/cjs/components/CodeBlock/Code.styled.d.ts

@@ -0,0 +1 @@
+export declare const CodeStyled: import("styled-components").StyledComponent<"div", any, Omit<import("../Element/constants").CommonAndHTMLProps<HTMLPreElement>, keyof import("./CodeBlock").CodeBlockCustomProps> & import("./CodeBlock").CodeBlockCustomProps, never>;

package/dist/cjs/components/CodeBlock/Code.styled.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../external/theme.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../external/DefaultColours.js");const n=/*#__PURE__*/o(e).default.div.withConfig({displayName:"CodeStyled",componentId:"-18qv0af"})`pre{display:block;width:100%;max-width:100%;font-family:${e=>e.theme.text.font.mono};color:${e=>e.theme.text.code.block.text};font-size:${e=>e.theme.text.code.block.scale}%;line-height:${e=>e.theme.text.code.block.lineHeight};font-weight:400;padding:16px 24px;background-color:${e=>e.theme.text.code.block.bg};text-align:left;overflow:auto;direction:ltr;white-space:pre;word-spacing:normal;word-break:normal;letter-spacing:-0.5px;font-variant-ligatures:none;-webkit-font-smoothing:subpixel-antialiased;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none;border-radius:${t.globalVariables.borderRadius};-moz-tab-size:4;tab-size:4;}@media print{pre[class*="language-"],code[class*="language-"]{text-shadow:none;}}.token.tag{color:${e=>e.theme.text.code.prism.tokens.tag};}.token.atrule{color:${e=>e.theme.text.code.prism.tokens.atrule};}.token.attr-name{color:${e=>e.theme.text.code.prism.tokens.attrName};}.token.attr-value{color:${e=>e.theme.text.code.prism.tokens.attrValue};}.token.boolean{color:${e=>e.theme.text.code.prism.tokens.boolean};}.token.cdata{color:${e=>e.theme.text.code.prism.tokens.cdata};}.token.class-name{color:${e=>e.theme.text.code.prism.tokens.className};}.token.comment{color:${e=>e.theme.text.code.prism.tokens.comment};}.token.constant{color:${e=>e.theme.text.code.prism.tokens.constant}}.token.deleted{color:${e=>e.theme.text.code.prism.tokens.deleted};}.token.delimiter{color:${e=>e.theme.text.code.prism.tokens.delimiter};}.token.doctype{color:${e=>e.theme.text.code.prism.tokens.doctype};}.token.entity{color:${e=>e.theme.text.code.prism.tokens.entity}}.token.function{color:${e=>e.theme.text.code.prism.tokens.function};}.token.hexcode{color:${e=>e.theme.text.code.prism.tokens.hexcode};}.token.inserted{color:${e=>e.theme.text.code.prism.tokens.inserted}}.token.keyword{color:${e=>e.theme.text.code.prism.tokens.keyword};}.token.number{color:${e=>e.theme.text.code.prism.tokens.number}}.token.operator{color:${e=>e.theme.text.code.prism.tokens.operator};}.token.plain{color:${e=>e.theme.text.code.prism.tokens.plain}}.token.prolog{color:${e=>e.theme.text.code.prism.tokens.prolog};}.token.property{color:${e=>e.theme.text.code.prism.tokens.property};}.token.punctuation{color:${e=>e.theme.text.code.prism.tokens.punctuation};}.token.regex{color:${e=>e.theme.text.code.prism.tokens.regex}}.token.selector{color:${e=>e.theme.text.code.prism.tokens.selector};}.token.string{color:${e=>e.theme.text.code.prism.tokens.string};}.token.symbol{color:${e=>e.theme.text.code.prism.tokens.symbol}}.token.url{color:${e=>e.theme.text.code.prism.tokens.url}}.token.variable{color:${e=>e.theme.text.code.prism.tokens.variable};}.token.namespace{opacity:0.72;}.token.italic{font-style:italic;}pre::selection,code::selection,pre::-moz-selection,code::-moz-selection,pre[class*=language-]::selection,code[class*=language-]::selection,pre[class*=language-]::-moz-selection,code[class*=language-]::-moz-selection{text-shadow:none;color:${e=>e.theme.text.selection.text};background:${e=>e.theme.text.selection.bg} !important;}code[class*=language-css],code[class*=language-less],code[class*=language-sass]{color:${e=>e.theme.text.code.prism.languages.css.fallback};}code[class*=language-scss]{color:${e=>e.theme.text.code.prism.languages.css.fallback};}code[class*=language-html]{color:${e=>e.theme.text.code.prism.languages.html.fallback};}code[class*=language-js]{color:${e=>e.theme.text.code.prism.languages.js.fallback};}code[class*=language-json] .token.string{color:${e=>e.theme.text.code.prism.languages.json.tokens.string};}`;exports.CodeStyled=n;
+//# sourceMappingURL=Code.styled.js.map

package/dist/cjs/components/CodeBlock/Code.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Code.styled.js","sources":["../../../../src/components/CodeBlock/Code.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { globalVariables } from \"../../styles/theme\";\nimport { CodeBlockProps } from \"./CodeBlock\";\n\n\nexport const CodeStyled = styled.div`\n    pre {\n        display                : block;\n        width                  : 100%;\n        max-width              : 100%;\n        font-family            : ${(props: CodeBlockProps) => props.theme.text.font.mono};\n        color                  : ${(props: CodeBlockProps) => props.theme.text.code.block.text};\n        font-size              : ${(props: CodeBlockProps) => props.theme.text.code.block.scale}%;\n        line-height            : ${(props: CodeBlockProps) => props.theme.text.code.block.lineHeight};\n        font-weight            : 400;\n        padding                : 16px 24px;\n        background-color       : ${(props: CodeBlockProps) => props.theme.text.code.block.bg};\n        text-align             : left;\n        overflow               : auto;\n        direction              : ltr;\n        white-space            : pre;\n        word-spacing           : normal;\n        word-break             : normal;\n        letter-spacing         : -0.5px;\n        font-variant-ligatures : none;\n        -webkit-font-smoothing : subpixel-antialiased;\n        -webkit-hyphens        : none;\n        -ms-hyphens            : none;\n        hyphens                : none;\n        border-radius          : ${globalVariables.borderRadius};\n        -moz-tab-size          : 4;\n        tab-size               : 4;\n    }\n\n    @media print {\n        pre[class*=\"language-\"],\n        code[class*=\"language-\"] {\n            text-shadow: none;\n        }\n    }\n    /*********************************************************\n    * Tokens\n    */\n    .token.tag         { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.tag}; }\n    .token.atrule      { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.atrule}; }\n    .token.attr-name   { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.attrName}; }\n    .token.attr-value  { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.attrValue}; }\n    .token.boolean     { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.boolean}; }\n    .token.cdata       { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.cdata}; }\n    .token.class-name  { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.className}; }\n    .token.comment     { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.comment}; }\n    .token.constant    { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.constant} }\n    .token.deleted     { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.deleted}; }\n    .token.delimiter   { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.delimiter}; }\n    .token.doctype     { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.doctype}; }\n    .token.entity      { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.entity} }\n    .token.function    { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.function}; }\n    .token.hexcode     { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.hexcode}; }\n    .token.inserted    { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.inserted} }\n    .token.keyword     { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.keyword}; }\n    .token.number      { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.number} }\n    .token.operator    { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.operator}; }\n    .token.plain       { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.plain} }\n    .token.prolog      { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.prolog}; }\n    .token.property    { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.property}; }\n    .token.punctuation { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.punctuation}; }\n    .token.regex       { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.regex} }\n    .token.selector    { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.selector}; }\n    .token.string      { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.string}; }\n    .token.symbol      { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.symbol} }\n    .token.url         { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.url} }\n    .token.variable    { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.tokens.variable}; }\n\n    .token.namespace { opacity : 0.72; }\n    .token.italic { font-style : italic; }\n\n    pre::selection,\n    code::selection,\n    pre::-moz-selection,\n    code::-moz-selection,\n    pre[class*=language-]::selection,\n    code[class*=language-]::selection,\n    pre[class*=language-]::-moz-selection,\n    code[class*=language-] ::-moz-selection {\n        text-shadow : none;\n        color       : ${(props: CodeBlockProps) => props.theme.text.selection.text};\n        background  : ${(props: CodeBlockProps) => props.theme.text.selection.bg} !important;\n    }\n\n    code[class*=language-css],\n    code[class*=language-less],\n    code[class*=language-sass] {\n        color : ${(props: CodeBlockProps) => props.theme.text.code.prism.languages.css.fallback};\n    }\n\n    code[class*=language-scss] { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.languages.css.fallback}; }\n\n    code[class*=language-html] { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.languages.html.fallback}; }\n\n    code[class*=language-js]   { color : ${(props: CodeBlockProps) => props.theme.text.code.prism.languages.js.fallback}; }\n\n    code[class*=language-json] .token.string {\n        color : ${(props: CodeBlockProps) => props.theme.text.code.prism.languages.json.tokens.string};\n    }\n`;\n"],"names":["CodeStyled","div","props","theme","text","font","mono","code","block","scale","lineHeight","bg","globalVariables","borderRadius","prism","tokens","tag","atrule","attrName","attrValue","boolean","cdata","className","comment","constant","deleted","delimiter","doctype","entity","function","hexcode","inserted","keyword","number","operator","plain","prolog","property","punctuation","regex","selector","string","symbol","url","variable","selection","languages","css","fallback","html","js","json"],"mappings":"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"}

package/dist/cjs/components/CodeBlock/CodeBlock.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { Language } from "prism-react-renderer";
+import { CommonAndHTMLProps } from "../Element/constants";
+export interface CodeBlockCustomProps {
+    source?: object | string;
+    language?: Language;
+}
+export declare type CodeBlockElementType = HTMLPreElement;
+export declare type CodeBlockProps = Omit<CommonAndHTMLProps<CodeBlockElementType>, keyof CodeBlockCustomProps> & CodeBlockCustomProps;
+export declare const CodeBlock: React.ForwardRefExoticComponent<Omit<CommonAndHTMLProps<HTMLPreElement>, keyof CodeBlockCustomProps> & CodeBlockCustomProps & React.RefAttributes<HTMLPreElement>>;