Deploying to docs from @ c32684c 🚀

Author: SimeonC

assets/Alert.stories-894ca6c8.js assets/Alert.stories-48595baf.js

@@ -1,4 +1,4 @@
-import{j as a,a as x,F as h}from"./emotion-react-jsx-runtime.browser.esm-3699e87e.js";import{A as m,a as k,b as C,c as v,d as M,e as g}from"./TextArea-ab224c86.js";import"./index-d8ade8ea.js";import{A as $}from"./Tooltip-8f61c5b7.js";import"./emotion-use-insertion-effect-with-fallbacks.browser.esm-7e8b2c4e.js";import"./index-4d501b15.js";import"./_commonjsHelpers-042e6b4d.js";const u=["tertiary","ghost","success","info","error","warning","neutral"],f=[{key:"icon-title-close",title:"Icon, title, and close button",onClose:()=>{}},{key:"title-close",title:"Title and close button",icon:null,onClose:()=>{}},{key:"icon-title",title:"Icon and title"},{key:"title",title:"Title",icon:null},{key:"icon-close",onClose:()=>{}},{key:"close",icon:null,onClose:()=>{}},{key:"icon"},{key:"text-only",icon:null}],S={title:"Components/Alert",component:m,parameters:{...k,variants:u,auxiliaryClassNames:["alert-icon"],auxiliaryComponents:[C,v,M,g]}},y=({Alert:d})=>a(h,{children:f.map(({key:r,...A})=>u.map(o=>x(d,{"data-variant":o,"data-layout":r,...A,children:[a("p",{children:"More text here"}),a("p",{children:"More text here"}),a("p",{children:"More text here"})]},`${o}-${r}`)))}),e=y.bind({});e.args={Alert:m};e.parameters={useEmotion:!0};const t=y.bind({});t.args={Alert:$};t.parameters={useEmotion:!1};var n,s,l;e.parameters={...e.parameters,docs:{...(n=e.parameters)==null?void 0:n.docs,source:{originalSource:`({
+import{j as a,a as x,F as h}from"./emotion-react-jsx-runtime.browser.esm-3699e87e.js";import{A as m,a as k,b as C,c as v,d as M,e as g}from"./TextArea-eb64305e.js";import"./index-d8ade8ea.js";import{A as $}from"./Tooltip-3979159d.js";import"./emotion-use-insertion-effect-with-fallbacks.browser.esm-7e8b2c4e.js";import"./index-4d501b15.js";import"./_commonjsHelpers-042e6b4d.js";const u=["tertiary","ghost","success","info","error","warning","neutral"],f=[{key:"icon-title-close",title:"Icon, title, and close button",onClose:()=>{}},{key:"title-close",title:"Title and close button",icon:null,onClose:()=>{}},{key:"icon-title",title:"Icon and title"},{key:"title",title:"Title",icon:null},{key:"icon-close",onClose:()=>{}},{key:"close",icon:null,onClose:()=>{}},{key:"icon"},{key:"text-only",icon:null}],S={title:"Components/Alert",component:m,parameters:{...k,variants:u,auxiliaryClassNames:["alert-icon"],auxiliaryComponents:[C,v,M,g]}},y=({Alert:d})=>a(h,{children:f.map(({key:r,...A})=>u.map(o=>x(d,{"data-variant":o,"data-layout":r,...A,children:[a("p",{children:"More text here"}),a("p",{children:"More text here"}),a("p",{children:"More text here"})]},`${o}-${r}`)))}),e=y.bind({});e.args={Alert:m};e.parameters={useEmotion:!0};const t=y.bind({});t.args={Alert:$};t.parameters={useEmotion:!1};var n,s,l;e.parameters={...e.parameters,docs:{...(n=e.parameters)==null?void 0:n.docs,source:{originalSource:`({
   Alert
 }) => <>
     {layouts.map(({

assets/Anchor.stories-0c3237be.js assets/Anchor.stories-4e226f9e.js

@@ -1,4 +1,4 @@
-import{j as o,a as A,F as b}from"./emotion-react-jsx-runtime.browser.esm-3699e87e.js";import{f as r,g as v,h as f}from"./TextArea-ab224c86.js";import"./index-d8ade8ea.js";import{a as B}from"./Tooltip-8f61c5b7.js";import"./emotion-use-insertion-effect-with-fallbacks.browser.esm-7e8b2c4e.js";import"./index-4d501b15.js";import"./_commonjsHelpers-042e6b4d.js";const s=["Default","Disabled","Hover","Focus","Visited"],j={title:"Components/Anchor",component:r,parameters:{...v,variants:s}},u=({Anchor:e,ButtonAnchor:l})=>A(b,{children:[s.map(t=>o(e,{href:t==="Disabled"?void 0:"#","data-pseudo":t.toLowerCase(),children:"Link text here"})),s.map(t=>o(l,{disabled:t==="Disabled","data-pseudo":t.toLowerCase(),children:"Button text here"}))]}),a=u.bind({});a.args={Anchor:r,ButtonAnchor:r.withComponent("button",{target:"e1l0y1a00"})};const n=u.bind({});n.args={Anchor:B,ButtonAnchor:e=>o("button",{className:f,...e,type:"button"})};var i,c,d;a.parameters={...a.parameters,docs:{...(i=a.parameters)==null?void 0:i.docs,source:{originalSource:`({
+import{j as o,a as A,F as b}from"./emotion-react-jsx-runtime.browser.esm-3699e87e.js";import{f as r,g as v,h as f}from"./TextArea-eb64305e.js";import"./index-d8ade8ea.js";import{a as B}from"./Tooltip-3979159d.js";import"./emotion-use-insertion-effect-with-fallbacks.browser.esm-7e8b2c4e.js";import"./index-4d501b15.js";import"./_commonjsHelpers-042e6b4d.js";const s=["Default","Disabled","Hover","Focus","Visited"],j={title:"Components/Anchor",component:r,parameters:{...v,variants:s}},u=({Anchor:e,ButtonAnchor:l})=>A(b,{children:[s.map(t=>o(e,{href:t==="Disabled"?void 0:"#","data-pseudo":t.toLowerCase(),children:"Link text here"})),s.map(t=>o(l,{disabled:t==="Disabled","data-pseudo":t.toLowerCase(),children:"Button text here"}))]}),a=u.bind({});a.args={Anchor:r,ButtonAnchor:r.withComponent("button",{target:"e1l0y1a00"})};const n=u.bind({});n.args={Anchor:B,ButtonAnchor:e=>o("button",{className:f,...e,type:"button"})};var i,c,d;a.parameters={...a.parameters,docs:{...(i=a.parameters)==null?void 0:i.docs,source:{originalSource:`({
   Anchor,
   ButtonAnchor
 }) => <>

assets/Badge.stories-1572b86f.js assets/Badge.stories-42b28569.js

@@ -1,4 +1,4 @@
-import{j as t,a as i,F as z}from"./emotion-react-jsx-runtime.browser.esm-3699e87e.js";import{B as h,i as f,v as x,F as l}from"./TextArea-ab224c86.js";import{r as B}from"./index-d8ade8ea.js";import{B as y}from"./Tooltip-8f61c5b7.js";import"./emotion-use-insertion-effect-with-fallbacks.browser.esm-7e8b2c4e.js";import"./index-4d501b15.js";import"./_commonjsHelpers-042e6b4d.js";const u=Object.keys(x),C={title:"Components/Badge",component:h,parameters:{...f,variants:u}},v=({Badge:F})=>t(z,{children:["x-large","large","medium","small","x-small"].map(s=>i(B.Fragment,{children:[t("h4",{children:s}),["left","right",!1].map(r=>u.map(n=>i(F,{"data-variant":n,"data-size":s,children:[r==="left"?t(l,{size:s?16:20}):null,"Text",r==="right"?t(l,{size:s?16:20}):null]},n+r)))]},s))}),a=v.bind({});a.args={Badge:h};a.parameters={useEmotion:!0};const e=v.bind({});e.args={Badge:y};e.parameters={useEmotion:!1};var o,m,d;a.parameters={...a.parameters,docs:{...(o=a.parameters)==null?void 0:o.docs,source:{originalSource:`({
+import{j as t,a as i,F as z}from"./emotion-react-jsx-runtime.browser.esm-3699e87e.js";import{B as h,i as f,v as x,F as l}from"./TextArea-eb64305e.js";import{r as B}from"./index-d8ade8ea.js";import{B as y}from"./Tooltip-3979159d.js";import"./emotion-use-insertion-effect-with-fallbacks.browser.esm-7e8b2c4e.js";import"./index-4d501b15.js";import"./_commonjsHelpers-042e6b4d.js";const u=Object.keys(x),C={title:"Components/Badge",component:h,parameters:{...f,variants:u}},v=({Badge:F})=>t(z,{children:["x-large","large","medium","small","x-small"].map(s=>i(B.Fragment,{children:[t("h4",{children:s}),["left","right",!1].map(r=>u.map(n=>i(F,{"data-variant":n,"data-size":s,children:[r==="left"?t(l,{size:s?16:20}):null,"Text",r==="right"?t(l,{size:s?16:20}):null]},n+r)))]},s))}),a=v.bind({});a.args={Badge:h};a.parameters={useEmotion:!0};const e=v.bind({});e.args={Badge:y};e.parameters={useEmotion:!1};var o,m,d;a.parameters={...a.parameters,docs:{...(o=a.parameters)==null?void 0:o.docs,source:{originalSource:`({
   Badge
 }) => <>
     {(['x-large', 'large', 'medium', 'small', 'x-small'] as const).map(size => <React.Fragment key={size}>

assets/Banner.stories-6971abf2.js assets/Banner.stories-f1948e4e.js

@@ -1,4 +1,4 @@
-import{j as n,a as m,F as N}from"./emotion-react-jsx-runtime.browser.esm-3699e87e.js";import{_ as C,I as w,D as z,ao as E,ap as x,P as H,aq as T}from"./TextArea-ab224c86.js";import{e as V,c as _}from"./index-b28bbdf3.js";import{R as r}from"./index-d8ade8ea.js";import"./emotion-use-insertion-effect-with-fallbacks.browser.esm-7e8b2c4e.js";import"./index-4d501b15.js";import"./InputStructure-34a100c2.js";import"./Tooltip-8f61c5b7.js";import"./ThemeProvider-32797b78.js";import"./emotion-react.browser.esm-e172f3ff.js";import"./_commonjsHelpers-042e6b4d.js";var l,p,j=["children","size"],P=r.forwardRef(function(e,i){var o=e.children,c=e.size,d=c===void 0?16:c,y=C(e,j);return r.createElement(w,z({width:d,height:d,ref:i,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 32 32",fill:"currentColor"},y),l||(l=r.createElement("path",{d:"M8 18H14V20H8zM8 22H18V24H8z"})),p||(p=r.createElement("path",{d:"M26,4H6A2.0025,2.0025,0,0,0,4,6V26a2.0025,2.0025,0,0,0,2,2H26a2.0025,2.0025,0,0,0,2-2V6A2.0025,2.0025,0,0,0,26,4ZM18,6v4H14V6ZM6,26V6h6v6h8V6h6l.0012,20Z"})),o)});const M=[void 0,"single","dismissed","basic"],S=Object.keys(T),G={title:"Components/Banner",component:E,parameters:{...x}},g=({components:s})=>n(N,{children:M.map(e=>S.map(i=>{const o=e==="dismissed"||e==="basic";return m(s.Banner,{"data-variant":i,children:[e!=="basic"&&n("div",{className:"banner-icon",children:n(P,{size:32})}),n("h4",{className:"banner-title",children:"Tease usefull information"}),o&&n("div",{className:"banner-close",children:n(H,{size:24})}),n("aside",{className:"banner-content",children:"Educate the user on this area, describe what needs to be done and how to approach it."}),!o&&m("div",{className:"banner-actions",children:[e!=="single"&&n(s.Button,{"data-variant":"secondary",children:"Button"}),n(s.Button,{"data-variant":"ghost",children:"Button"})]})]})}))}),a=g.bind({});a.args={components:V};a.parameters={useEmotion:!0};const t=g.bind({});t.args={components:_};t.parameters={useEmotion:!1};var h,u,v;a.parameters={...a.parameters,docs:{...(h=a.parameters)==null?void 0:h.docs,source:{originalSource:`({
+import{j as n,a as m,F as N}from"./emotion-react-jsx-runtime.browser.esm-3699e87e.js";import{_ as C,I as w,D as z,ao as E,ap as x,P as H,aq as T}from"./TextArea-eb64305e.js";import{e as V,c as _}from"./index-d8e6076f.js";import{R as r}from"./index-d8ade8ea.js";import"./emotion-use-insertion-effect-with-fallbacks.browser.esm-7e8b2c4e.js";import"./index-4d501b15.js";import"./InputStructure-d89af118.js";import"./Tooltip-3979159d.js";import"./ThemeProvider-58cfb0a9.js";import"./emotion-react.browser.esm-e172f3ff.js";import"./_commonjsHelpers-042e6b4d.js";var l,p,j=["children","size"],P=r.forwardRef(function(e,i){var o=e.children,c=e.size,d=c===void 0?16:c,y=C(e,j);return r.createElement(w,z({width:d,height:d,ref:i,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 32 32",fill:"currentColor"},y),l||(l=r.createElement("path",{d:"M8 18H14V20H8zM8 22H18V24H8z"})),p||(p=r.createElement("path",{d:"M26,4H6A2.0025,2.0025,0,0,0,4,6V26a2.0025,2.0025,0,0,0,2,2H26a2.0025,2.0025,0,0,0,2-2V6A2.0025,2.0025,0,0,0,26,4ZM18,6v4H14V6ZM6,26V6h6v6h8V6h6l.0012,20Z"})),o)});const M=[void 0,"single","dismissed","basic"],S=Object.keys(T),G={title:"Components/Banner",component:E,parameters:{...x}},g=({components:s})=>n(N,{children:M.map(e=>S.map(i=>{const o=e==="dismissed"||e==="basic";return m(s.Banner,{"data-variant":i,children:[e!=="basic"&&n("div",{className:"banner-icon",children:n(P,{size:32})}),n("h4",{className:"banner-title",children:"Tease usefull information"}),o&&n("div",{className:"banner-close",children:n(H,{size:24})}),n("aside",{className:"banner-content",children:"Educate the user on this area, describe what needs to be done and how to approach it."}),!o&&m("div",{className:"banner-actions",children:[e!=="single"&&n(s.Button,{"data-variant":"secondary",children:"Button"}),n(s.Button,{"data-variant":"ghost",children:"Button"})]})]})}))}),a=g.bind({});a.args={components:V};a.parameters={useEmotion:!0};const t=g.bind({});t.args={components:_};t.parameters={useEmotion:!1};var h,u,v;a.parameters={...a.parameters,docs:{...(h=a.parameters)==null?void 0:h.docs,source:{originalSource:`({
   components
 }) => <>
     {bannerTypes.map(type => variants.map(variant => {

assets/Button.stories-3223bb1f.js assets/Button.stories-fbbecae0.js

@@ -1,4 +1,4 @@
-import{j as c,a as u,F as y}from"./emotion-react-jsx-runtime.browser.esm-3699e87e.js";import{m as F,n as z,F as h}from"./TextArea-ab224c86.js";import{r as A}from"./index-d8ade8ea.js";import{c as $}from"./Tooltip-8f61c5b7.js";import"./emotion-use-insertion-effect-with-fallbacks.browser.esm-7e8b2c4e.js";import"./index-4d501b15.js";import"./_commonjsHelpers-042e6b4d.js";const v=["Default","Hover","Focus","Focus Before","Focus After","Active"],E={title:"Components/ButtonGroup",component:F,parameters:{...z,variants:v,chromatic:{viewports:[1500]}}},k=["small","medium","large"],B=({ButtonGroup:b})=>c(y,{children:k.map(o=>u(A.Fragment,{children:[c("h4",{children:o}),[-1,0,1,2].map(n=>v.map(e=>c(b,{"data-size":o,children:["icon","text","icon+text"].map((i,t)=>{let r="default";switch(e){case"Default":case"Hover":case"Active":n===-1&&t===1&&(r=e.toLowerCase());break;case"Focus After":case"Focus Before":case"Focus":{(n!==-1&&(e==="Focus"&&t===n||e==="Focus Before"&&t===n-1||e==="Focus After"&&t===n+1)||n===-1&&(e==="Focus"&&t===1||e==="Focus Before"&&t===0||e==="Focus After"&&t===2))&&(r="focus");break}}return u("button",{type:"button","data-pseudo":r,"data-selected":t===n,children:[["icon","icon+text"].includes(i)?c(h,{size:o==="small"?16:20}):null,["text","icon+text"].includes(i)?"Button":null]},`${n}_${i}_${e}_${t}`)})})))]},o))}),a=B.bind({});a.args={ButtonGroup:F};a.parameters={useEmotion:!0};const s=B.bind({});s.args={ButtonGroup:$};s.parameters={useEmotion:!1};var d,l,p;a.parameters={...a.parameters,docs:{...(d=a.parameters)==null?void 0:d.docs,source:{originalSource:`({
+import{j as c,a as u,F as y}from"./emotion-react-jsx-runtime.browser.esm-3699e87e.js";import{m as F,n as z,F as h}from"./TextArea-eb64305e.js";import{r as A}from"./index-d8ade8ea.js";import{c as $}from"./Tooltip-3979159d.js";import"./emotion-use-insertion-effect-with-fallbacks.browser.esm-7e8b2c4e.js";import"./index-4d501b15.js";import"./_commonjsHelpers-042e6b4d.js";const v=["Default","Hover","Focus","Focus Before","Focus After","Active"],E={title:"Components/ButtonGroup",component:F,parameters:{...z,variants:v,chromatic:{viewports:[1500]}}},k=["small","medium","large"],B=({ButtonGroup:b})=>c(y,{children:k.map(o=>u(A.Fragment,{children:[c("h4",{children:o}),[-1,0,1,2].map(n=>v.map(e=>c(b,{"data-size":o,children:["icon","text","icon+text"].map((i,t)=>{let r="default";switch(e){case"Default":case"Hover":case"Active":n===-1&&t===1&&(r=e.toLowerCase());break;case"Focus After":case"Focus Before":case"Focus":{(n!==-1&&(e==="Focus"&&t===n||e==="Focus Before"&&t===n-1||e==="Focus After"&&t===n+1)||n===-1&&(e==="Focus"&&t===1||e==="Focus Before"&&t===0||e==="Focus After"&&t===2))&&(r="focus");break}}return u("button",{type:"button","data-pseudo":r,"data-selected":t===n,children:[["icon","icon+text"].includes(i)?c(h,{size:o==="small"?16:20}):null,["text","icon+text"].includes(i)?"Button":null]},`${n}_${i}_${e}_${t}`)})})))]},o))}),a=B.bind({});a.args={ButtonGroup:F};a.parameters={useEmotion:!0};const s=B.bind({});s.args={ButtonGroup:$};s.parameters={useEmotion:!1};var d,l,p;a.parameters={...a.parameters,docs:{...(d=a.parameters)==null?void 0:d.docs,source:{originalSource:`({
   ButtonGroup
 }) => <>
     {sizes.map(size => <React.Fragment key={size}>