diff --git a/.nojekyll b/.nojekyll new file mode 100644 index 0000000..e69de29 diff --git a/assets/0-index-B9yafzNQ.js b/assets/0-index-B9yafzNQ.js new file mode 100644 index 0000000..da7e548 --- /dev/null +++ b/assets/0-index-B9yafzNQ.js @@ -0,0 +1,8 @@ +import{j as n}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as o}from"./index-BI1Biiay.js";import{ae as s}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function t(i){const e={a:"a",h1:"h1",h2:"h2",li:"li",ul:"ul",...o(),...i.components};return n.jsxs(n.Fragment,{children:[n.jsx(s,{title:"Elements/wip/Sectioning/Index"}),` +`,n.jsx(e.h1,{id:"sectioning",children:"Sectioning"}),` +`,n.jsx(e.h2,{id:"index",children:"Index"}),` +`,n.jsxs(e.ul,{children:[` +`,n.jsx(e.li,{children:n.jsx(e.a,{href:"?path=/story/elements-wip-sectioning-sections--page",children:"Sections"})}),` +`,n.jsx(e.li,{children:n.jsx(e.a,{href:"?path=/story/elements-wip-sectioning-heading--page",children:"Heading content"})}),` +`,n.jsx(e.li,{children:n.jsx(e.a,{href:"?path=/story/elements-wip-sectioning-scope--page",children:"Sectioning Scope Specific Elements"})}),` +`]})]})}function u(i={}){const{wrapper:e}={...o(),...i.components};return e?n.jsx(e,{...i,children:n.jsx(t,{...i})}):t(i)}export{u as default}; diff --git a/assets/0-index-BP5tIOyg.js b/assets/0-index-BP5tIOyg.js new file mode 100644 index 0000000..cc518c8 --- /dev/null +++ b/assets/0-index-BP5tIOyg.js @@ -0,0 +1,19 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as l}from"./index-BI1Biiay.js";import{ae as s}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function t(i){const n={a:"a",h1:"h1",h2:"h2",li:"li",ul:"ul",...l(),...i.components};return e.jsxs(e.Fragment,{children:[e.jsx(s,{title:"Elements/wip/Text/Inline/Index"}),` +`,e.jsx(n.h1,{id:"inline-text-semantics",children:"Inline text semantics"}),` +`,e.jsx(n.h2,{id:"index",children:"Index"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-generic--page",children:"Generic"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-line-breaks--page",children:"Line Breaks"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-links--page",children:"Links"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-emphasis--page",children:"Emphasis"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-terminology--page",children:"Terminology"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-quotations--page",children:"Quotations"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-citation--page",children:"Citation"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-altered-baseline--page",children:"Altered Baseline"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-io--page",children:"IO"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-code--page",children:"Code"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-data--page",children:"Data"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-enhanced-semantics--page",children:"Enhanced Semantics"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-directionality--page",children:"Directionality"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-text-inline-ruby--page",children:"Ruby"})}),` +`]})]})}function f(i={}){const{wrapper:n}={...l(),...i.components};return n?e.jsx(n,{...i,children:e.jsx(t,{...i})}):t(i)}export{f as default}; diff --git a/assets/0-index-B_t65hJO.js b/assets/0-index-B_t65hJO.js new file mode 100644 index 0000000..7882842 --- /dev/null +++ b/assets/0-index-B_t65hJO.js @@ -0,0 +1,13 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as s}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function i(n){const t={a:"a",h1:"h1",h2:"h2",li:"li",ul:"ul",...r(),...n.components};return e.jsxs(e.Fragment,{children:[e.jsx(s,{title:"Elements/wip/Text/Block/Index"}),` +`,e.jsx(t.h1,{id:"block-level-text-elements",children:"Block-level text elements"}),` +`,e.jsx(t.h2,{id:"index",children:"Index"}),` +`,e.jsxs(t.ul,{children:[` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"?path=/story/elements-wip-text-block-generic--page",children:"Generic"})}),` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"?path=/story/elements-wip-text-block-paragraphs--page",children:"Paragraphs"})}),` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"?path=/story/elements-wip-text-block-thematic-breaks--page",children:"Thematic Breaks"})}),` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"?path=/story/elements-wip-text-block-lists--page",children:"Lists"})}),` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"?path=/story/elements-wip-text-block-definition-lists--page",children:"Definition Lists"})}),` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"?path=/story/elements-wip-text-block-quotations--page",children:"Quotations"})}),` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"?path=/story/elements-wip-text-block-figures--page",children:"Figures"})}),` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"?path=/story/elements-wip-text-block-preformatted--page",children:"Preformatted"})}),` +`]})]})}function u(n={}){const{wrapper:t}={...r(),...n.components};return t?e.jsx(t,{...n,children:e.jsx(i,{...n})}):i(n)}export{u as default}; diff --git a/assets/0-index-DPNzM-78.js b/assets/0-index-DPNzM-78.js new file mode 100644 index 0000000..45b1d88 --- /dev/null +++ b/assets/0-index-DPNzM-78.js @@ -0,0 +1,7 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as o}from"./index-BI1Biiay.js";import{ae as r}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function i(n){const t={a:"a",h1:"h1",h2:"h2",li:"li",ul:"ul",...o(),...n.components};return e.jsxs(e.Fragment,{children:[e.jsx(r,{title:"Elements/wip/Text/Index"}),` +`,e.jsx(t.h1,{id:"text-content",children:"Text content"}),` +`,e.jsx(t.h2,{id:"index",children:"Index"}),` +`,e.jsxs(t.ul,{children:[` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"?path=/story/elements-wip-text-block-index--page",children:"Block-level Text Elements"})}),` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"?path=/story/elements-wip-text-inline-index--page",children:"Inline Text Semantics"})}),` +`]})]})}function f(n={}){const{wrapper:t}={...o(),...n.components};return t?e.jsx(t,{...n,children:e.jsx(i,{...n})}):i(n)}export{f as default}; diff --git a/assets/0-index-DwgQMNJ4.js b/assets/0-index-DwgQMNJ4.js new file mode 100644 index 0000000..66d3a81 --- /dev/null +++ b/assets/0-index-DwgQMNJ4.js @@ -0,0 +1,8 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as d}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function i(t){const n={a:"a",h1:"h1",h2:"h2",li:"li",ul:"ul",...r(),...t.components};return e.jsxs(e.Fragment,{children:[e.jsx(d,{title:"Elements/wip/Embedding/Index"}),` +`,e.jsx(n.h1,{id:"ebedding",children:"Ebedding"}),` +`,e.jsx(n.h2,{id:"index",children:"Index"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-embedding-media--page",children:"Multimedia Content"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-embedding-containers--page",children:"Embedding Containers"})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"?path=/story/elements-wip-embedding-other-ml--page",children:"Embedded Fragments of Other Markup Languages"})}),` +`]})]})}function u(t={}){const{wrapper:n}={...r(),...t.components};return n?e.jsx(n,{...t,children:e.jsx(i,{...t})}):i(t)}export{u as default}; diff --git a/assets/1-document-C-YSSubU.js b/assets/1-document-C-YSSubU.js new file mode 100644 index 0000000..598f87d --- /dev/null +++ b/assets/1-document-C-YSSubU.js @@ -0,0 +1,32 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as l}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function t(o){const n={a:"a",code:"code",h1:"h1",h2:"h2",li:"li",p:"p",ul:"ul",...r(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(l,{title:"Elements/wip/Document"}),` +`,e.jsx(n.h1,{id:"unique-document-elements",children:"Unique document elements"}),` +`,e.jsx(n.p,{children:`These elements are unique to each document. Some of the selectors are not pure element selectors. +But due to their uniqueness it makes sense to address them without any added class specificity.`}),` +`,e.jsx(n.h2,{id:"document-root",children:"Document root"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsxs(n.li,{children:[e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/html",rel:"nofollow",children:e.jsx(n.code,{children:"html"})}),` / +`,e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/CSS/:root",rel:"nofollow",children:e.jsx(n.code,{children:":root"})})]}),` +`]}),` +`,e.jsx(n.h2,{id:"sectioning-root",children:"Sectioning root"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body",rel:"nofollow",children:e.jsx(n.code,{children:"body"})})}),` +`]}),` +`,e.jsx(n.h2,{id:"the-documents-main-content",children:"The document’s main content"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsxs(n.li,{children:[e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/main",rel:"nofollow",children:e.jsx(n.code,{children:"main:not([hidden])"})}),` +(`,e.jsx(n.a,{href:"https://html.spec.whatwg.org/multipage/grouping-content.html#the-main-element:attr-hidden",rel:"nofollow",children:"There can be only one!"}),")"]}),` +`]}),` +`,e.jsx(n.h2,{id:"the-documents-main-header",children:"The document’s main header"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.code,{children:":where(body, body > div) > header:first-of-type"})}),` +`]}),` +`,e.jsx(n.h2,{id:"the-documents-main-footer",children:"The document’s main footer"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.code,{children:":where(body, body > div) > footer:last-of-type"})}),` +`,e.jsxs(n.li,{children:["Useful technique: ",e.jsx(n.a,{href:"https://css-tricks.com/a-clever-sticky-footer-technique/",rel:"nofollow",children:"Clever sticky footer"})]}),` +`]}),` +`,e.jsx(n.h2,{id:"the-current-target-element",children:"The current target element"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/CSS/:target",rel:"nofollow",children:e.jsx(n.code,{children:":target"})})}),` +`,e.jsxs(n.li,{children:["Useful property: ",e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-margin-top",rel:"nofollow",children:e.jsx(n.code,{children:"scroll-margin-top"})})]}),` +`]})]})}function f(o={}){const{wrapper:n}={...r(),...o.components};return n?e.jsx(n,{...o,children:e.jsx(t,{...o})}):t(o)}export{f as default}; diff --git a/assets/1-generic-C3iZDSDA.js b/assets/1-generic-C3iZDSDA.js new file mode 100644 index 0000000..7e7480f --- /dev/null +++ b/assets/1-generic-C3iZDSDA.js @@ -0,0 +1,6 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function t(o){const n={a:"a",code:"code",h1:"h1",li:"li",p:"p",ul:"ul",...r(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Text/Block/Generic"}),` +`,e.jsx(n.h1,{id:"generic-block",children:"Generic block"}),` +`,e.jsx(n.p,{children:"(⛔️ Nothing to style here.)"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div",rel:"nofollow",children:e.jsx(n.code,{children:"div"})})}),` +`]})]})}function f(o={}){const{wrapper:n}={...r(),...o.components};return n?e.jsx(n,{...o,children:e.jsx(t,{...o})}):t(o)}export{f as default}; diff --git a/assets/1-generic-Na1wHvjX.js b/assets/1-generic-Na1wHvjX.js new file mode 100644 index 0000000..1e75708 --- /dev/null +++ b/assets/1-generic-Na1wHvjX.js @@ -0,0 +1,6 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function o(t){const n={a:"a",code:"code",li:"li",p:"p",ul:"ul",...r(),...t.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Text/Inline/Generic"}),` +`,e.jsx(n.p,{children:"Generic range"}),` +`,e.jsx(n.p,{children:"(⛔️ Nothing to style here.)"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span",rel:"nofollow",children:e.jsx(n.code,{children:"span"})})}),` +`]})]})}function f(t={}){const{wrapper:n}={...r(),...t.components};return n?e.jsx(n,{...t,children:e.jsx(o,{...t})}):o(t)}export{f as default}; diff --git a/assets/1-media-DonEO5mv.js b/assets/1-media-DonEO5mv.js new file mode 100644 index 0000000..d69a4ae --- /dev/null +++ b/assets/1-media-DonEO5mv.js @@ -0,0 +1,10 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function n(l){const o={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...r(),...l.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Embedding/Media"}),` +`,e.jsx(o.h1,{id:"multimedia-content",children:"Multimedia content"}),` +`,e.jsxs(o.ul,{children:[` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img",rel:"nofollow",children:e.jsx(o.code,{children:"img"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/map",rel:"nofollow",children:e.jsx(o.code,{children:"map"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/area",rel:"nofollow",children:e.jsx(o.code,{children:"area"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio",rel:"nofollow",children:e.jsx(o.code,{children:"audio"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video",rel:"nofollow",children:e.jsx(o.code,{children:"video"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/track",rel:"nofollow",children:e.jsx(o.code,{children:"track"})})}),` +`]})]})}function u(l={}){const{wrapper:o}={...r(),...l.components};return o?e.jsx(o,{...l,children:e.jsx(n,{...l})}):n(l)}export{u as default}; diff --git a/assets/1-sections-B8aBtaGo.js b/assets/1-sections-B8aBtaGo.js new file mode 100644 index 0000000..68330f5 --- /dev/null +++ b/assets/1-sections-B8aBtaGo.js @@ -0,0 +1,9 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as t}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function l(o){const n={a:"a",code:"code",h1:"h1",li:"li",p:"p",ul:"ul",...t(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Sectioning/Sections"}),` +`,e.jsx(n.h1,{id:"sections",children:"Sections"}),` +`,e.jsx(n.p,{children:"(explicit sectioning content)"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/article",rel:"nofollow",children:e.jsx(n.code,{children:"article"})})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/section",rel:"nofollow",children:e.jsx(n.code,{children:"section"})})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/aside",rel:"nofollow",children:e.jsx(n.code,{children:"aside"})})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/nav",rel:"nofollow",children:e.jsx(n.code,{children:"nav"})})}),` +`]})]})}function u(o={}){const{wrapper:n}={...t(),...o.components};return n?e.jsx(n,{...o,children:e.jsx(l,{...o})}):l(o)}export{u as default}; diff --git a/assets/2-containers-mq8zQmOO.js b/assets/2-containers-mq8zQmOO.js new file mode 100644 index 0000000..0b2700c --- /dev/null +++ b/assets/2-containers-mq8zQmOO.js @@ -0,0 +1,11 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as t}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function l(n){const o={a:"a",code:"code",h1:"h1",li:"li",p:"p",ul:"ul",...r(),...n.components};return e.jsxs(e.Fragment,{children:[e.jsx(t,{title:"Elements/wip/Embedding/Containers"}),` +`,e.jsx(o.h1,{id:"embedding-containers",children:"Embedding containers"}),` +`,e.jsx(o.p,{children:"(⛔️ Nothing to style here.)"}),` +`,e.jsxs(o.ul,{children:[` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/embed",rel:"nofollow",children:e.jsx(o.code,{children:"embed"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe",rel:"nofollow",children:e.jsx(o.code,{children:"iframe"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/object",rel:"nofollow",children:e.jsx(o.code,{children:"object"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture",rel:"nofollow",children:e.jsx(o.code,{children:"picture"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/portal",rel:"nofollow",children:e.jsx(o.code,{children:"portal"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/source",rel:"nofollow",children:e.jsx(o.code,{children:"source"})})}),` +`]})]})}function u(n={}){const{wrapper:o}={...r(),...n.components};return o?e.jsx(o,{...n,children:e.jsx(l,{...n})}):l(n)}export{u as default}; diff --git a/assets/2-heading-openvivV.js b/assets/2-heading-openvivV.js new file mode 100644 index 0000000..5487e27 --- /dev/null +++ b/assets/2-heading-openvivV.js @@ -0,0 +1,6 @@ +import{j as n}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as i}from"./index-BI1Biiay.js";import{ae as r}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function o(t){const e={a:"a",code:"code",h1:"h1",li:"li",p:"p",ul:"ul",...i(),...t.components};return n.jsxs(n.Fragment,{children:[n.jsx(r,{title:"Elements/wip/Sectioning/Heading"}),` +`,n.jsx(e.h1,{id:"heading-content",children:"Heading content"}),` +`,n.jsx(e.p,{children:"(implicit sectoning content)"}),` +`,n.jsxs(e.ul,{children:[` +`,n.jsx(e.li,{children:n.jsx(e.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements",rel:"nofollow",children:n.jsx(e.code,{children:"h1–h6"})})}),` +`]})]})}function f(t={}){const{wrapper:e}={...i(),...t.components};return e?n.jsx(e,{...t,children:n.jsx(o,{...t})}):o(t)}export{f as default}; diff --git a/assets/2-line-breaks-zaorD9Y0.js b/assets/2-line-breaks-zaorD9Y0.js new file mode 100644 index 0000000..86effb9 --- /dev/null +++ b/assets/2-line-breaks-zaorD9Y0.js @@ -0,0 +1,6 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as t}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function r(o){const n={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...t(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Text/Inline/Line Breaks"}),` +`,e.jsx(n.h1,{id:"line-breaks",children:"Line Breaks"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/br",rel:"nofollow",children:e.jsx(n.code,{children:"br"})})}),` +`,e.jsxs(n.li,{children:[e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/wbr",rel:"nofollow",children:e.jsx(n.code,{children:"wbr"})})," (line break opportunity)"]}),` +`]})]})}function f(o={}){const{wrapper:n}={...t(),...o.components};return n?e.jsx(n,{...o,children:e.jsx(r,{...o})}):r(o)}export{f as default}; diff --git a/assets/2-paragraphs-C52CH81J.js b/assets/2-paragraphs-C52CH81J.js new file mode 100644 index 0000000..7301efa --- /dev/null +++ b/assets/2-paragraphs-C52CH81J.js @@ -0,0 +1,5 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as n}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function r(o){const t={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...n(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Text/Block/Paragraphs"}),` +`,e.jsx(t.h1,{id:"paragraphs",children:"Paragraphs"}),` +`,e.jsxs(t.ul,{children:[` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p",rel:"nofollow",children:e.jsx(t.code,{children:"p"})})}),` +`]})]})}function f(o={}){const{wrapper:t}={...n(),...o.components};return t?e.jsx(t,{...o,children:e.jsx(r,{...o})}):r(o)}export{f as default}; diff --git a/assets/3-links-BwxHeZxi.js b/assets/3-links-BwxHeZxi.js new file mode 100644 index 0000000..c79db8e --- /dev/null +++ b/assets/3-links-BwxHeZxi.js @@ -0,0 +1,6 @@ +import{j as n}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function t(o){const e={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...r(),...o.components};return n.jsxs(n.Fragment,{children:[n.jsx(i,{title:"Elements/wip/Text/Inline/Links"}),` +`,n.jsx(e.h1,{id:"links-and-anchors",children:"Links (and anchors)"}),` +`,n.jsxs(e.ul,{children:[` +`,n.jsxs(e.li,{children:[n.jsx(e.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a",rel:"nofollow",children:n.jsx(e.code,{children:"a[href]"})})," (links)"]}),` +`,n.jsxs(e.li,{children:[n.jsx(e.code,{children:"a[id]"})," (anchors)"]}),` +`]})]})}function f(o={}){const{wrapper:e}={...r(),...o.components};return e?n.jsx(e,{...o,children:n.jsx(t,{...o})}):t(o)}export{f as default}; diff --git a/assets/3-other-ml-aYMZ9DuF.js b/assets/3-other-ml-aYMZ9DuF.js new file mode 100644 index 0000000..a2aee32 --- /dev/null +++ b/assets/3-other-ml-aYMZ9DuF.js @@ -0,0 +1,6 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as l}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function n(t){const o={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...r(),...t.components};return e.jsxs(e.Fragment,{children:[e.jsx(l,{title:"Elements/wip/Embedding/Other ML"}),` +`,e.jsx(o.h1,{id:"embedded-fragments-of-other-markup-languages",children:"Embedded fragments of other markup languages"}),` +`,e.jsxs(o.ul,{children:[` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/SVG/Element/svg",rel:"nofollow",children:e.jsx(o.code,{children:"svg"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/MathML/Element/math",rel:"nofollow",children:e.jsx(o.code,{children:"math"})})}),` +`]})]})}function j(t={}){const{wrapper:o}={...r(),...t.components};return o?e.jsx(o,{...t,children:e.jsx(n,{...t})}):n(t)}export{j as default}; diff --git a/assets/3-scope-BKTU6T7s.js b/assets/3-scope-BKTU6T7s.js new file mode 100644 index 0000000..e16bdb5 --- /dev/null +++ b/assets/3-scope-BKTU6T7s.js @@ -0,0 +1,7 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as t}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function r(n){const o={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...t(),...n.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Sectioning/Scope"}),` +`,e.jsx(o.h1,{id:"sectioning-scope-specific-elements",children:"Sectioning scope specific elements"}),` +`,e.jsxs(o.ul,{children:[` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/header",rel:"nofollow",children:e.jsx(o.code,{children:"header"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/footer",rel:"nofollow",children:e.jsx(o.code,{children:"footer"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/address",rel:"nofollow",children:e.jsx(o.code,{children:"address"})})}),` +`]})]})}function u(n={}){const{wrapper:o}={...t(),...n.components};return o?e.jsx(o,{...n,children:e.jsx(r,{...n})}):r(n)}export{u as default}; diff --git a/assets/3-thematic-breaks-DOF-fGRR.js b/assets/3-thematic-breaks-DOF-fGRR.js new file mode 100644 index 0000000..b9a96fe --- /dev/null +++ b/assets/3-thematic-breaks-DOF-fGRR.js @@ -0,0 +1,5 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function n(o){const t={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...r(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Text/Block/Thematic Breaks"}),` +`,e.jsx(t.h1,{id:"thematic-breaks",children:"Thematic breaks"}),` +`,e.jsxs(t.ul,{children:[` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/hr",rel:"nofollow",children:e.jsx(t.code,{children:"hr"})})}),` +`]})]})}function f(o={}){const{wrapper:t}={...r(),...o.components};return t?e.jsx(t,{...o,children:e.jsx(n,{...o})}):n(o)}export{f as default}; diff --git a/assets/4-emphasis-CMP_6ecn.js b/assets/4-emphasis-CMP_6ecn.js new file mode 100644 index 0000000..354aabe --- /dev/null +++ b/assets/4-emphasis-CMP_6ecn.js @@ -0,0 +1,6 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function t(o){const n={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...r(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Text/Inline/Emphasis"}),` +`,e.jsx(n.h1,{id:"emphasis",children:"Emphasis"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/em",rel:"nofollow",children:e.jsx(n.code,{children:"em"})})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/strong",rel:"nofollow",children:e.jsx(n.code,{children:"strong"})})}),` +`]})]})}function f(o={}){const{wrapper:n}={...r(),...o.components};return n?e.jsx(n,{...o,children:e.jsx(t,{...o})}):t(o)}export{f as default}; diff --git a/assets/4-lists-Ce9Mq5gM.js b/assets/4-lists-Ce9Mq5gM.js new file mode 100644 index 0000000..791506d --- /dev/null +++ b/assets/4-lists-Ce9Mq5gM.js @@ -0,0 +1,8 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as t}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function n(l){const o={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...r(),...l.components};return e.jsxs(e.Fragment,{children:[e.jsx(t,{title:"Elements/wip/Text/Block/Lists"}),` +`,e.jsx(o.h1,{id:"lists",children:"Lists"}),` +`,e.jsxs(o.ul,{children:[` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ol",rel:"nofollow",children:e.jsx(o.code,{children:"ol"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ul",rel:"nofollow",children:e.jsx(o.code,{children:"ul"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/menu",rel:"nofollow",children:e.jsx(o.code,{children:"menu"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/li",rel:"nofollow",children:e.jsx(o.code,{children:"li"})})}),` +`]})]})}function f(l={}){const{wrapper:o}={...r(),...l.components};return o?e.jsx(o,{...l,children:e.jsx(n,{...l})}):n(l)}export{f as default}; diff --git a/assets/5-definition-lists-BmNiAd0m.js b/assets/5-definition-lists-BmNiAd0m.js new file mode 100644 index 0000000..f7b2e35 --- /dev/null +++ b/assets/5-definition-lists-BmNiAd0m.js @@ -0,0 +1,7 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as i}from"./index-BI1Biiay.js";import{ae as l}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function t(n){const o={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...i(),...n.components};return e.jsxs(e.Fragment,{children:[e.jsx(l,{title:"Elements/wip/Text/Block/Definition Lists"}),` +`,e.jsx(o.h1,{id:"definition-lists",children:"Definition lists"}),` +`,e.jsxs(o.ul,{children:[` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dl",rel:"nofollow",children:e.jsx(o.code,{children:"dl"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dt",rel:"nofollow",children:e.jsx(o.code,{children:"dt"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dd",rel:"nofollow",children:e.jsx(o.code,{children:"dd"})})}),` +`]})]})}function u(n={}){const{wrapper:o}={...i(),...n.components};return o?e.jsx(o,{...n,children:e.jsx(t,{...n})}):t(n)}export{u as default}; diff --git a/assets/5-scripting-CpHUiwEH.js b/assets/5-scripting-CpHUiwEH.js new file mode 100644 index 0000000..48c5d89 --- /dev/null +++ b/assets/5-scripting-CpHUiwEH.js @@ -0,0 +1,8 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as t}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function r(o){const n={a:"a",code:"code",h1:"h1",li:"li",p:"p",ul:"ul",...t(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Scripting"}),` +`,e.jsx(n.h1,{id:"scripting",children:"Scripting"}),` +`,e.jsx(n.p,{children:"(⛔️ Nothing to style here.)"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script",rel:"nofollow",children:e.jsx(n.code,{children:"script"})})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/noscript",rel:"nofollow",children:e.jsx(n.code,{children:"noscript"})})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/canvas",rel:"nofollow",children:e.jsx(n.code,{children:"canvas"})})}),` +`]})]})}function u(o={}){const{wrapper:n}={...t(),...o.components};return n?e.jsx(n,{...o,children:e.jsx(r,{...o})}):r(o)}export{u as default}; diff --git a/assets/5-terminology-Daqn4Kpj.js b/assets/5-terminology-Daqn4Kpj.js new file mode 100644 index 0000000..7e6c539 --- /dev/null +++ b/assets/5-terminology-Daqn4Kpj.js @@ -0,0 +1,7 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as l}from"./index-BI1Biiay.js";import{ae as t}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function r(n){const o={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...l(),...n.components};return e.jsxs(e.Fragment,{children:[e.jsx(t,{title:"Elements/wip/Text/Inline/Terminology"}),` +`,e.jsx(o.h1,{id:"terminology",children:"Terminology"}),` +`,e.jsxs(o.ul,{children:[` +`,e.jsxs(o.li,{children:[e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/abbr",rel:"nofollow",children:e.jsx(o.code,{children:"abbr"})})," (abbreviations)"]}),` +`,e.jsxs(o.li,{children:[e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dfn",rel:"nofollow",children:e.jsx(o.code,{children:"dfn"})})," (definitions)"]}),` +`,e.jsxs(o.li,{children:[e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/var",rel:"nofollow",children:e.jsx(o.code,{children:"var"})})," (variables)"]}),` +`]})]})}function u(n={}){const{wrapper:o}={...l(),...n.components};return o?e.jsx(o,{...n,children:e.jsx(r,{...n})}):r(n)}export{u as default}; diff --git a/assets/6-edits-BhP7S-7R.js b/assets/6-edits-BhP7S-7R.js new file mode 100644 index 0000000..ded6037 --- /dev/null +++ b/assets/6-edits-BhP7S-7R.js @@ -0,0 +1,6 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function o(t){const n={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...r(),...t.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Edits"}),` +`,e.jsx(n.h1,{id:"demarcating-edits",children:"Demarcating edits"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/del",rel:"nofollow",children:e.jsx(n.code,{children:"del"})})}),` +`,e.jsx(n.li,{children:e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ins",rel:"nofollow",children:e.jsx(n.code,{children:"ins"})})}),` +`]})]})}function f(t={}){const{wrapper:n}={...r(),...t.components};return n?e.jsx(n,{...t,children:e.jsx(o,{...t})}):o(t)}export{f as default}; diff --git a/assets/6-quotations-CPnghuI_.js b/assets/6-quotations-CPnghuI_.js new file mode 100644 index 0000000..09c8c93 --- /dev/null +++ b/assets/6-quotations-CPnghuI_.js @@ -0,0 +1,5 @@ +import{j as t}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function n(e){const o={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...r(),...e.components};return t.jsxs(t.Fragment,{children:[t.jsx(i,{title:"Elements/wip/Text/Block/Quotations"}),` +`,t.jsx(o.h1,{id:"extended-quotations",children:"Extended quotations"}),` +`,t.jsxs(o.ul,{children:[` +`,t.jsx(o.li,{children:t.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blockquote",rel:"nofollow",children:t.jsx(o.code,{children:"blockquote"})})}),` +`]})]})}function f(e={}){const{wrapper:o}={...r(),...e.components};return o?t.jsx(o,{...e,children:t.jsx(n,{...e})}):n(e)}export{f as default}; diff --git a/assets/6-quotations-_Zif5tYp.js b/assets/6-quotations-_Zif5tYp.js new file mode 100644 index 0000000..034e29d --- /dev/null +++ b/assets/6-quotations-_Zif5tYp.js @@ -0,0 +1,5 @@ +import{j as n}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as i}from"./index-BI1Biiay.js";import{ae as r}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function o(e){const t={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...i(),...e.components};return n.jsxs(n.Fragment,{children:[n.jsx(r,{title:"Elements/wip/Text/Inline/Quotations"}),` +`,n.jsx(t.h1,{id:"inline-quotations",children:"Inline quotations"}),` +`,n.jsxs(t.ul,{children:[` +`,n.jsx(t.li,{children:n.jsx(t.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/q",rel:"nofollow",children:n.jsx(t.code,{children:"q"})})}),` +`]})]})}function f(e={}){const{wrapper:t}={...i(),...e.components};return t?n.jsx(t,{...e,children:n.jsx(o,{...e})}):o(e)}export{f as default}; diff --git a/assets/7-citation-EUlwVGpH.js b/assets/7-citation-EUlwVGpH.js new file mode 100644 index 0000000..a7c632b --- /dev/null +++ b/assets/7-citation-EUlwVGpH.js @@ -0,0 +1,5 @@ +import{j as t}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as i}from"./index-BI1Biiay.js";import{ae as r}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function o(n){const e={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...i(),...n.components};return t.jsxs(t.Fragment,{children:[t.jsx(r,{title:"Elements/wip/Text/Inline/Citation"}),` +`,t.jsx(e.h1,{id:"citation",children:"Citation"}),` +`,t.jsxs(e.ul,{children:[` +`,t.jsx(e.li,{children:t.jsx(e.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/cite",rel:"nofollow",children:t.jsx(e.code,{children:"cite"})})}),` +`]})]})}function f(n={}){const{wrapper:e}={...i(),...n.components};return e?t.jsx(e,{...n,children:t.jsx(o,{...n})}):o(n)}export{f as default}; diff --git a/assets/7-figures-BRgY14FX.js b/assets/7-figures-BRgY14FX.js new file mode 100644 index 0000000..5e1aeaa --- /dev/null +++ b/assets/7-figures-BRgY14FX.js @@ -0,0 +1,6 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as i}from"./index-BI1Biiay.js";import{ae as r}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function t(n){const o={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...i(),...n.components};return e.jsxs(e.Fragment,{children:[e.jsx(r,{title:"Elements/wip/Text/Block/Figures"}),` +`,e.jsx(o.h1,{id:"self-contained-figures",children:"Self-contained figures"}),` +`,e.jsxs(o.ul,{children:[` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/figure",rel:"nofollow",children:e.jsx(o.code,{children:"figure"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/figcaption",rel:"nofollow",children:e.jsx(o.code,{children:"figcaption"})})}),` +`]})]})}function j(n={}){const{wrapper:o}={...i(),...n.components};return o?e.jsx(o,{...n,children:e.jsx(t,{...n})}):t(n)}export{j as default}; diff --git a/assets/7-tables-BJ8qEvRS.js b/assets/7-tables-BJ8qEvRS.js new file mode 100644 index 0000000..2c17469 --- /dev/null +++ b/assets/7-tables-BJ8qEvRS.js @@ -0,0 +1,14 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as t}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function n(o){const l={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...r(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(t,{title:"Elements/wip/Tables"}),` +`,e.jsx(l.h1,{id:"tabular-data",children:"Tabular data"}),` +`,e.jsxs(l.ul,{children:[` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table",rel:"nofollow",children:e.jsx(l.code,{children:"table"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/caption",rel:"nofollow",children:e.jsx(l.code,{children:"caption"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/thead",rel:"nofollow",children:e.jsx(l.code,{children:"thead"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/tbody",rel:"nofollow",children:e.jsx(l.code,{children:"tbody"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/tfoot",rel:"nofollow",children:e.jsx(l.code,{children:"tfoot"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/tr",rel:"nofollow",children:e.jsx(l.code,{children:"tr"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/td",rel:"nofollow",children:e.jsx(l.code,{children:"td"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th",rel:"nofollow",children:e.jsx(l.code,{children:"th"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/col",rel:"nofollow",children:e.jsx(l.code,{children:"col"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/colgroup",rel:"nofollow",children:e.jsx(l.code,{children:"colgroup"})})}),` +`]})]})}function b(o={}){const{wrapper:l}={...r(),...o.components};return l?e.jsx(l,{...o,children:e.jsx(n,{...o})}):n(o)}export{b as default}; diff --git a/assets/8-altered-baseline-CH9u3GUX.js b/assets/8-altered-baseline-CH9u3GUX.js new file mode 100644 index 0000000..7b0822f --- /dev/null +++ b/assets/8-altered-baseline-CH9u3GUX.js @@ -0,0 +1,6 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as l}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function o(t){const n={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...r(),...t.components};return e.jsxs(e.Fragment,{children:[e.jsx(l,{title:"Elements/wip/Text/Inline/Altered Baseline"}),` +`,e.jsx(n.h1,{id:"altered-baseline",children:"Altered baseline"}),` +`,e.jsxs(n.ul,{children:[` +`,e.jsxs(n.li,{children:[e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/sub",rel:"nofollow",children:e.jsx(n.code,{children:"sub"})})," (subscript)"]}),` +`,e.jsxs(n.li,{children:[e.jsx(n.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/sup",rel:"nofollow",children:e.jsx(n.code,{children:"sup"})})," (superscript)"]}),` +`]})]})}function f(t={}){const{wrapper:n}={...r(),...t.components};return n?e.jsx(n,{...t,children:e.jsx(o,{...t})}):o(t)}export{f as default}; diff --git a/assets/8-forms-2iH7yICY.js b/assets/8-forms-2iH7yICY.js new file mode 100644 index 0000000..6c6551a --- /dev/null +++ b/assets/8-forms-2iH7yICY.js @@ -0,0 +1,33 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as s}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function o(n){const l={a:"a",code:"code",h1:"h1",h2:"h2",li:"li",ul:"ul",...r(),...n.components};return e.jsxs(e.Fragment,{children:[e.jsx(s,{title:"Elements/wip/Forms"}),` +`,e.jsx(l.h1,{id:"form-related-elements",children:"Form-related elements"}),` +`,e.jsxs(l.ul,{children:[` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form",rel:"nofollow",children:e.jsx(l.code,{children:"form"})})}),` +`]}),` +`,e.jsx(l.h2,{id:"submission",children:"Submission"}),` +`,e.jsxs(l.ul,{children:[` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button",rel:"nofollow",children:e.jsx(l.code,{children:"button"})})}),` +`]}),` +`,e.jsx(l.h2,{id:"labeling--grouping",children:"Labeling & Grouping"}),` +`,e.jsxs(l.ul,{children:[` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label",rel:"nofollow",children:e.jsx(l.code,{children:"label"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/fieldset",rel:"nofollow",children:e.jsx(l.code,{children:"fieldset"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/legend",rel:"nofollow",children:e.jsx(l.code,{children:"legend"})})}),` +`]}),` +`,e.jsx(l.h2,{id:"value-lists",children:"Value lists"}),` +`,e.jsxs(l.ul,{children:[` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist",rel:"nofollow",children:e.jsx(l.code,{children:"datalist"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option",rel:"nofollow",children:e.jsx(l.code,{children:"option"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/optgroup",rel:"nofollow",children:e.jsx(l.code,{children:"optgroup"})})}),` +`]}),` +`,e.jsx(l.h2,{id:"inputs",children:"Inputs"}),` +`,e.jsxs(l.ul,{children:[` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input",rel:"nofollow",children:e.jsx(l.code,{children:"input"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea",rel:"nofollow",children:e.jsx(l.code,{children:"textarea"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select",rel:"nofollow",children:e.jsx(l.code,{children:"select"})})}),` +`]}),` +`,e.jsx(l.h2,{id:"outputs",children:"Outputs"}),` +`,e.jsxs(l.ul,{children:[` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meter",rel:"nofollow",children:e.jsx(l.code,{children:"meter"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/output",rel:"nofollow",children:e.jsx(l.code,{children:"output"})})}),` +`,e.jsx(l.li,{children:e.jsx(l.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress",rel:"nofollow",children:e.jsx(l.code,{children:"progress"})})}),` +`]})]})}function u(n={}){const{wrapper:l}={...r(),...n.components};return l?e.jsx(l,{...n,children:e.jsx(o,{...n})}):o(n)}export{u as default}; diff --git a/assets/8-preformatted-dMnSZaq1.js b/assets/8-preformatted-dMnSZaq1.js new file mode 100644 index 0000000..bb3db4c --- /dev/null +++ b/assets/8-preformatted-dMnSZaq1.js @@ -0,0 +1,5 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as n}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function r(o){const t={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...n(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Text/Block/Preformatted"}),` +`,e.jsx(t.h1,{id:"preformatted-text",children:"Preformatted text"}),` +`,e.jsxs(t.ul,{children:[` +`,e.jsx(t.li,{children:e.jsx(t.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/pre",rel:"nofollow",children:e.jsx(t.code,{children:"pre"})})}),` +`]})]})}function u(o={}){const{wrapper:t}={...n(),...o.components};return t?e.jsx(t,{...o,children:e.jsx(r,{...o})}):r(o)}export{u as default}; diff --git a/assets/9-interactive-s1m7b5rk.js b/assets/9-interactive-s1m7b5rk.js new file mode 100644 index 0000000..8bf2e75 --- /dev/null +++ b/assets/9-interactive-s1m7b5rk.js @@ -0,0 +1,7 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as l}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function n(t){const o={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...r(),...t.components};return e.jsxs(e.Fragment,{children:[e.jsx(l,{title:"Elements/wip/Interactive"}),` +`,e.jsx(o.h1,{id:"other-interactive-elements",children:"Other interactive elements"}),` +`,e.jsxs(o.ul,{children:[` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details",rel:"nofollow",children:e.jsx(o.code,{children:"details"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/summary",rel:"nofollow",children:e.jsx(o.code,{children:"summary"})})}),` +`,e.jsx(o.li,{children:e.jsx(o.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog",rel:"nofollow",children:e.jsx(o.code,{children:"dialog"})})}),` +`]})]})}function f(t={}){const{wrapper:o}={...r(),...t.components};return o?e.jsx(o,{...t,children:e.jsx(n,{...t})}):n(t)}export{f as default}; diff --git a/assets/9-io-M9bLP3Zg.js b/assets/9-io-M9bLP3Zg.js new file mode 100644 index 0000000..03206a2 --- /dev/null +++ b/assets/9-io-M9bLP3Zg.js @@ -0,0 +1,6 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{useMDXComponents as r}from"./index-BI1Biiay.js";import{ae as i}from"./index-DNzjNleM.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function n(o){const t={a:"a",code:"code",h1:"h1",li:"li",ul:"ul",...r(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Elements/wip/Text/Inline/IO"}),` +`,e.jsx(t.h1,{id:"inputoutput",children:"Input/output"}),` +`,e.jsxs(t.ul,{children:[` +`,e.jsxs(t.li,{children:[e.jsx(t.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/kbd",rel:"nofollow",children:e.jsx(t.code,{children:"kbd"})})," (keyboard input)"]}),` +`,e.jsxs(t.li,{children:[e.jsx(t.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/samp",rel:"nofollow",children:e.jsx(t.code,{children:"samp"})})," (sample output)"]}),` +`]})]})}function f(o={}){const{wrapper:t}={...r(),...o.components};return t?e.jsx(t,{...o,children:e.jsx(n,{...o})}):n(o)}export{f as default}; diff --git a/assets/Alert-8JktCpQs.css b/assets/Alert-8JktCpQs.css new file mode 100644 index 0000000..1daadb8 --- /dev/null +++ b/assets/Alert-8JktCpQs.css @@ -0,0 +1 @@ +._alert_1iits_1{box-shadow:var(--betterplace-shadow-floating-medium)}._icon_1iits_5{display:inline-block;vertical-align:middle}._iconContainer_1iits_10{flex-shrink:0;margin-inline-end:var(--betterplace-spacing-200)}._icon-success_1iits_15{color:var(--betterplace-color-border-success)}._icon-warning_1iits_19{color:var(--betterplace-color-border-attention)}._icon-error_1iits_23{color:var(--betterplace-color-border-danger)} diff --git a/assets/Alert.stories-Db06AhEI.js b/assets/Alert.stories-Db06AhEI.js new file mode 100644 index 0000000..56dd1fd --- /dev/null +++ b/assets/Alert.stories-Db06AhEI.js @@ -0,0 +1,6 @@ +import{j as t}from"./jsx-runtime-BlAj40OV.js";import{c as i}from"./index-Bl6ORisp.js";import{C as _}from"./Callout-C9Zts6EG.js";import{I as u}from"./Icon-DX5oPjN8.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";const d={id:"3720:3055",url:"https://www.figma.com/file/PJ7OUutWRrSHW6qgaPNW1l/DS-betterplace-GENERAL?node-id=3720%3A3055",themes:[]},g="_alert_1iits_1",f="_icon_1iits_5",O="_iconContainer_1iits_10",s={alert:g,icon:f,iconContainer:O,"icon-success":"_icon-success_1iits_15","icon-warning":"_icon-warning_1iits_19","icon-error":"_icon-error_1iits_23"},A={warning:"alertTriangle",error:"alertCircle",success:"checkCircle"};function C({kind:e,className:a,style:l,children:m}){const p=e==="error"?"alert":"status";return t.jsxs(_,{kind:e,role:p,className:i(s.alert,a),style:l,children:[t.jsx("div",{className:i(s[`icon-${e}`],s.iconContainer),children:t.jsx(u,{name:A[e],className:s.icon,title:e})}),t.jsx("div",{children:m})]})}var S={BASE_URL:"./",DEV:!1,MODE:"production",PROD:!0,SSR:!1,STORYBOOK:"true",STORYBOOK_BASE_URL:"/betterplace-design-system/"};const N={title:"Components/Alert",component:C,argTypes:{kind:{control:{type:"radio"},options:["success","warning","error"],description:"Applies specific design",table:{type:{summary:"AlertKind"}}},children:{control:{type:"text"}}},parameters:{design:{type:"figspec",accessToken:S.STORYBOOK_FIGMA_ACCESS_TOKEN,url:d.url},vitest:{testFile:"Alert.test.tsx"}}},r={args:{kind:"success",children:"Lorem ipsum dolor sit amet, consectetur adipiscing elit."}};var o,n,c;r.parameters={...r.parameters,docs:{...(o=r.parameters)==null?void 0:o.docs,source:{originalSource:`{ + args: { + kind: 'success', + children: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.' + } +}`,...(c=(n=r.parameters)==null?void 0:n.docs)==null?void 0:c.source}}};const T=["Default"];export{r as Default,T as __namedExportsOrder,N as default}; diff --git a/assets/AmountField.stories-fOpKXKkX.js b/assets/AmountField.stories-fOpKXKkX.js new file mode 100644 index 0000000..0da2898 --- /dev/null +++ b/assets/AmountField.stories-fOpKXKkX.js @@ -0,0 +1,7 @@ +import{A as r}from"./ClientAmountField-BeKZJ_SU.js";import"./jsx-runtime-BlAj40OV.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";import"./TextInput-CJfcBDcM.js";import"./TextInputWrapper-_VuV0eOO.js";import"./useForwardedRef-Bxam_td3.js";const c={title:"Components/AmountField",component:r,argTypes:{label:{control:{type:"text"},description:"The label of the field."},name:{control:{type:"text"},description:"Internal name of the field"},hideSteps:{control:{type:"boolean"},description:"Option to hide number input steps"},defaultValue:{control:{type:"number"},description:"The default amount."}},parameters:{vitest:{testFile:"AmountField.test.tsx"}}},e={args:{label:"Amount in Euro",name:"amount-in-euro",hideSteps:!1}};var t,o,n;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`{ + args: { + label: 'Amount in Euro', + name: 'amount-in-euro', + hideSteps: false + } +}`,...(n=(o=e.parameters)==null?void 0:o.docs)==null?void 0:n.source}}};const f=["Default"];export{e as Default,f as __namedExportsOrder,c as default}; diff --git a/assets/AnimateList.stories-C5jytTB7.js b/assets/AnimateList.stories-C5jytTB7.js new file mode 100644 index 0000000..57a00ea --- /dev/null +++ b/assets/AnimateList.stories-C5jytTB7.js @@ -0,0 +1,3 @@ +import{j as p}from"./jsx-runtime-BlAj40OV.js";import{r as s}from"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";const V=typeof window<"u"?s.useLayoutEffect:s.useEffect;function $(e){const r=s.useRef();return s.useEffect(()=>{r.current=e},[e]),r}function Y(e,r,t){const n=new Map;return s.Children.forEach(e,o=>{var d;if(!s.isValidElement(o)||!o.key)return;const i=r.get(o.key);if(!i)return;const f={top:(d=i.getBoundingClientRect())==null?void 0:d.top,parentTop:t};n.set(o.key,f)}),n}function C(e){return e===null?"":e.replace(".$","")}function L(e,r){const t=new Set,n=[];for(const o of e){const i=o.key;t.has(i)||(t.add(i),n.push(o))}for(const o of r){const i=o.key;t.has(i)||(t.add(i),n.push(o))}return n}function _({children:e,animationLengthInMs:r}){const t=s.useRef(null),n=s.useCallback((u,l,y)=>`transform ${u??r}ms ease, clip-path ${l??r}ms ease, opacity ${y??r}ms ease`,[r]),o="inset(0)",i="inset(0 0 100% 0)",[m,f]=s.useState(new Map),d=$(e),x=$(m),[E,w]=s.useState([]),b=s.useRef(new Map);V(()=>{var y,h;const u=((h=(y=t.current)==null?void 0:y.parentElement)==null?void 0:h.getBoundingClientRect().top)??0;f(Y(e,b.current,u));const l=d.current;if(l){const k=new Set(s.Children.map(e,c=>s.isValidElement(c)?C(c.key):null)),g=s.Children.toArray(l).filter(c=>s.isValidElement(c)&&!k.has(C(c.key)));g.length&&w(c=>L(c,g))}},[e,d,t]);const v=s.useMemo(()=>L(s.Children.toArray(e),E).filter(u=>s.isValidElement(u)?u.key?!0:(console.warn("AnimateList got a child with no key, skipping"),!1):(console.warn("AnimateList got an invalid child"),!1)),[e,E]);return V(()=>{var k;let u=0;const l=[],y=[],h=new AbortController;for(const g of v){if(!s.isValidElement(g)||!g.key)continue;const c=C(g.key),R=m.get(c),j=(k=x.current)==null?void 0:k.get(c),a=b.current.get(c);if(!a)continue;if(!R){l.push(requestAnimationFrame(()=>{a.style.transition=n(),a.style.transform!==i&&(a.style.clipPath=o,a.style.opacity="1"),l.push(requestAnimationFrame(()=>{a.style.clipPath=i,a.style.opacity="0"}))})),a.addEventListener("transitionend",function(D){D.propertyName==="clip-path"&&(w(K=>K.filter(F=>s.isValidElement(F)&&C(F.key)!==c)),b.current.delete(c),h.abort())},{signal:h.signal});continue}if(!j||a.style.opacity==="0"){const S=Math.round(u*r/2);u++,l.push(requestAnimationFrame(()=>{a.style.clipPath=i,a.style.opacity="0",a.style.transition=n(),y.push(setTimeout(()=>{l.push(requestAnimationFrame(()=>{a.style.clipPath=o,a.style.opacity="1"}))},S))}));continue}const B=j.top-j.parentTop-(R.top-R.parentTop);B&&l.push(requestAnimationFrame(()=>{a.style.transform=`translateY(${B}px)`,a.style.transition=n(0),l.push(requestAnimationFrame(()=>{a.style.transition=n(),a.style.transform="translateY(0)"}))}))}return()=>{y.map(clearTimeout),l.map(cancelAnimationFrame),h.signal.aborted||h.abort()}},[r,m,n,v]),p.jsxs(p.Fragment,{children:[p.jsx("div",{ref:t,style:{maxBlockSize:0}}),v.map(u=>s.cloneElement(u,{ref:l=>{b.current.set(C(u.key),l)}}))]})}const H=e=>{const t=e*.618033988749895%1*6,n=.95*.7,o=n*(1-Math.abs(t%2-1));let i=0,m=0,f=0;t<1?(i=n,m=o):t<2?(i=o,m=n):t<3?(m=n,f=o):t<4?(m=o,f=n):t<5?(i=o,f=n):(i=n,f=o);const d=.95-n,x=E=>Math.round((E+d)*255).toString(16).padStart(2,"0");return`#${x(i)}${x(m)}${x(f)}`},M=()=>{const[e,r]=s.useState([1,2,3]);return p.jsxs("div",{children:[p.jsx("button",{onClick:()=>{r([...e,Math.max(...e,0)+1])},children:"Add Item"}),p.jsx("button",{onClick:()=>{r(e.slice(0,-1))},children:"Remove Item"}),p.jsx("button",{onClick:()=>r(t=>t.toReversed()),children:"Reverse"}),p.jsx("div",{children:p.jsx(_,{animationLengthInMs:1e3,children:e.map(t=>{const n=H(t);return p.jsx("div",{style:{padding:"1rem",margin:"0.5rem",background:n,borderRadius:"4px"},children:t},t)})})})]})},A={render:()=>p.jsx(M,{})},O={title:"Components/AnimateList",component:M};var P,q,T;A.parameters={...A.parameters,docs:{...(P=A.parameters)==null?void 0:P.docs,source:{originalSource:`{ + render: () => +}`,...(T=(q=A.parameters)==null?void 0:q.docs)==null?void 0:T.source}}};const G=["Default"];export{A as Default,G as __namedExportsOrder,O as default}; diff --git a/assets/Badge-C0k1-kUc.css b/assets/Badge-C0k1-kUc.css new file mode 100644 index 0000000..e7a6931 --- /dev/null +++ b/assets/Badge-C0k1-kUc.css @@ -0,0 +1 @@ +._container_r63zv_1{inline-size:-moz-max-content;inline-size:max-content;overflow:hidden;text-overflow:ellipsis;border:var(--betterplace-border-default);font:var(--betterplace-typography-functional-text-sm-default);color:var(--betterplace-color-fg-content-primary);border-radius:var(--betterplace-border-radius-200);padding-inline:var(--betterplace-spacing-100);padding-block:var(--betterplace-spacing-50)}._default_r63zv_15{background-color:var(--betterplace-color-blue-dark);border-color:var(--betterplace-color-blue-dark);color:var(--betterplace-color-light)}._neutral_r63zv_21{border-color:var(--betterplace-color-bg-neutral);background-color:var(--betterplace-color-bg-neutral)}._success_r63zv_26{background-color:var(--betterplace-color-bg-success);border-color:var(--betterplace-color-border-success);color:var(--betterplace-color-fg-success)} diff --git a/assets/Badge.stories-B4xPcZ8C.js b/assets/Badge.stories-B4xPcZ8C.js new file mode 100644 index 0000000..9bb2ffc --- /dev/null +++ b/assets/Badge.stories-B4xPcZ8C.js @@ -0,0 +1,5 @@ +import{j as c}from"./jsx-runtime-BlAj40OV.js";import{c as d}from"./index-Bl6ORisp.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";const i="_container_r63zv_1",u="_neutral_r63zv_21",l="_success_r63zv_26",t={container:i,default:"_default_r63zv_15",neutral:u,success:l};function p({kind:a="default",children:o}){return c.jsx("div",{className:d(t.container,t[a]),children:o})}const x={title:"Components/Badge",component:p,argTypes:{kind:{options:["default","neutral","success"],control:{type:"radio"},description:"Applies specific design",table:{defaultValue:{summary:"default"},type:{summary:"BadgeKind | undefined"}}},children:{control:{type:"text"},description:"Text content to be rendered"}}},e={args:{children:"Badge content"}};var s,n,r;e.parameters={...e.parameters,docs:{...(s=e.parameters)==null?void 0:s.docs,source:{originalSource:`{ + args: { + children: 'Badge content' + } +}`,...(r=(n=e.parameters)==null?void 0:n.docs)==null?void 0:r.source}}};const y=["Default"];export{e as Default,y as __namedExportsOrder,x as default}; diff --git a/assets/BoxShadowPreview-Dn55OzGr.js b/assets/BoxShadowPreview-Dn55OzGr.js new file mode 100644 index 0000000..ace7b3b --- /dev/null +++ b/assets/BoxShadowPreview-Dn55OzGr.js @@ -0,0 +1 @@ +import{j as i}from"./jsx-runtime-BlAj40OV.js";const t=({token:e})=>i.jsx("div",{style:{boxShadow:`var(--${e.name})`,blockSize:"var(--betterplace-sizing-600)",inlineSize:"var(--betterplace-sizing-600)"}});export{t as B}; diff --git a/assets/Button-CmRA-hR5.js b/assets/Button-CmRA-hR5.js new file mode 100644 index 0000000..dbd8013 --- /dev/null +++ b/assets/Button-CmRA-hR5.js @@ -0,0 +1 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{c as O}from"./index-Bl6ORisp.js";import{r as m}from"./index-Cs7sjTYM.js";const N="_button_79wly_1",D="_ghost_79wly_156",I="_busy_79wly_181",S="_srOnly_79wly_395",s={button:N,"kind-primary":"_kind-primary_79wly_17","size-large":"_size-large_79wly_39","size-default":"_size-default_79wly_43","size-small":"_size-small_79wly_47","size-input":"_size-input_79wly_51","kind-secondary":"_kind-secondary_79wly_74","kind-secondary-danger":"_kind-secondary-danger_79wly_115",ghost:D,busy:I,"kind-danger":"_kind-danger_79wly_191","kind-plain":"_kind-plain_79wly_233",srOnly:S};function $(a){return s[`size-${a}`]}function E(a,i){return[{[s.ghost]:i},s[`kind-${a}`]]}const q=m.forwardRef(function({children:i,kind:w="primary",size:g="default",as:p="button",className:k,ghost:f,busy:r,id:z,"aria-disabled":x,"aria-describedby":h,disabledReason:d,disabled_:o,disabled:j,fullWidth:t,..._},c){const B=m.useId(),l=z||B,y=j||o||x||r,n=y&&d?`${l}-disabled-reason`:void 0,u=h??n,b=O(s.button,$(g),k,...E(w,f),{[s.busy]:r,fullWidth:t&&t!=="mobile-only",fullWidthOnMobile:t&&t==="mobile-only"});return p==="a"?e.jsxs("a",{..._,className:b,id:l,ref:c,"aria-disabled":y,"aria-describedby":u,disabled:o,children:[n&&e.jsx("span",{id:n,className:s.srOnly,children:d}),i]}):e.jsxs("button",{..._,className:b,id:l,ref:c,"aria-disabled":y,"aria-busy":r,"aria-describedby":u,disabled:o,children:[n&&e.jsx("span",{id:n,className:s.srOnly,children:d}),i]})});export{q as B}; diff --git a/assets/Button-DQr0dE6w.css b/assets/Button-DQr0dE6w.css new file mode 100644 index 0000000..40a54dd --- /dev/null +++ b/assets/Button-DQr0dE6w.css @@ -0,0 +1 @@ +._button_79wly_1{display:inline-block;text-align:center;position:relative;-webkit-text-decoration:var(--betterplace-text-decoration-none);text-decoration:var(--betterplace-text-decoration-none);border:var(--betterplace-border-default);padding:var(--betterplace-spacing-200) var(--betterplace-spacing-300);border-radius:var(--betterplace-border-radius-200);cursor:pointer}._button_79wly_1:focus-visible{outline:var(--betterplace-border-focused);outline-offset:var(--betterplace-spacing-50)}._kind-primary_79wly_17{background:var(--betterplace-color-cta-primary-dark);border-color:var(--betterplace-color-border-cta-primary);text-shadow:var(--betterplace-shadow-text-green);color:var(--betterplace-color-fg-light-primary);z-index:1;transition:color .1s linear,border-color .1s linear,box-shadow .1s linear}._kind-primary_79wly_17:before{display:block;content:"";background:var(--betterplace-color-cta-gradient);opacity:1;position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;transition:opacity .1s linear}._kind-primary_79wly_17._size-large_79wly_39{font:var(--betterplace-typography-label-lg)}._kind-primary_79wly_17._size-default_79wly_43{font:var(--betterplace-typography-label-md)}._kind-primary_79wly_17._size-small_79wly_47{font:var(--betterplace-typography-label-xs)}._kind-primary_79wly_17._size-input_79wly_51{font:var(--betterplace-typography-label-md);height:3.125rem}._kind-primary_79wly_17:hover{background:var(--betterplace-color-cta-primary-dark)}._kind-primary_79wly_17:hover:before{opacity:0}._kind-primary_79wly_17:active{background:var(--betterplace-color-cta-primary-dark);box-shadow:var(--betterplace-shadow-pressed-green)}._kind-primary_79wly_17:active:before{opacity:0}._kind-secondary_79wly_74{background:var(--betterplace-color-bg-light);border-color:var(--betterplace-color-border-cta-secondary);color:var(--betterplace-color-cta-secondary);transition:background .1s linear,color .1s linear,box-shadow .1s linear}._kind-secondary_79wly_74._size-large_79wly_39{font:var(--betterplace-typography-label-lg-secondary)}._kind-secondary_79wly_74._size-default_79wly_43{font:var(--betterplace-typography-label-md-secondary)}._kind-secondary_79wly_74._size-small_79wly_47{font:var(--betterplace-typography-label-xs-secondary)}._kind-secondary_79wly_74._size-input_79wly_51{font:var(--betterplace-typography-label-md);height:3.125rem}@media (hover: hover){._kind-secondary_79wly_74:hover{background:var(--betterplace-color-cta-secondary);color:var(--betterplace-color-fg-light-primary)}}._kind-secondary_79wly_74:active{background:var(--betterplace-color-cta-secondary);color:var(--betterplace-color-fg-light-primary);box-shadow:var(--betterplace-shadow-pressed-green)}._kind-secondary-danger_79wly_115{background:var(--betterplace-color-bg-light);border-color:var(--betterplace-color-border-danger);color:var(--betterplace-color-fg-danger);transition:background .1s linear,color .1s linear,box-shadow .1s linear}._kind-secondary-danger_79wly_115._size-large_79wly_39{font:var(--betterplace-typography-label-lg-secondary)}._kind-secondary-danger_79wly_115._size-default_79wly_43{font:var(--betterplace-typography-label-md-secondary)}._kind-secondary-danger_79wly_115._size-small_79wly_47{font:var(--betterplace-typography-label-xs-secondary)}._kind-secondary-danger_79wly_115._size-input_79wly_51{font:var(--betterplace-typography-label-md);height:3.125rem}@media (hover: hover){._kind-secondary-danger_79wly_115:hover{background:var(--betterplace-color-cta-danger-hover);color:var(--betterplace-color-fg-light-primary)}}._kind-secondary-danger_79wly_115:active{background:var(--betterplace-color-cta-danger-hover);color:var(--betterplace-color-fg-light-primary);box-shadow:var(--betterplace-shadow-pressed-danger)}._kind-secondary_79wly_74._ghost_79wly_156{border-color:var(--betterplace-color-border-on-color);background:transparent;color:var(--betterplace-color-fg-light-primary);transition:color .1s linear,box-shadow .1s linear}@media (hover: hover){._kind-secondary_79wly_74._ghost_79wly_156:hover{background:var(--betterplace-color-bg-light);color:var(--betterplace-color-cta-secondary)}}._kind-secondary_79wly_74._ghost_79wly_156:focus-visible{outline-color:var(--betterplace-color-border-on-color)}._kind-secondary_79wly_74._ghost_79wly_156:active{background:var(--betterplace-color-bg-light);color:var(--betterplace-color-cta-secondary);box-shadow:var(--betterplace-shadow-pressed-gray)}._kind-secondary_79wly_74._ghost_79wly_156[aria-disabled=true]:not(._busy_79wly_181),._kind-secondary_79wly_74._ghost_79wly_156[disabled]{color:var(--betterplace-color-fg-content-secondary);background-color:var(--betterplace-color-bg-on-top-light);border-color:transparent;box-shadow:none;text-shadow:none}._kind-danger_79wly_191{background:var(--betterplace-color-cta-danger);border-color:var(--betterplace-color-border-on-color);color:var(--betterplace-color-fg-light-primary);transition:background .1s linear,color .1s linear,box-shadow .1s linear}._kind-danger_79wly_191._size-large_79wly_39{font:var(--betterplace-typography-label-lg-secondary)}._kind-danger_79wly_191._size-default_79wly_43{font:var(--betterplace-typography-label-md-secondary)}._kind-danger_79wly_191._size-small_79wly_47{font:var(--betterplace-typography-label-xs-secondary)}._kind-danger_79wly_191._size-input_79wly_51{font:var(--betterplace-typography-label-md);height:3.125rem}@media (hover: hover){._kind-danger_79wly_191:hover{background:var(--betterplace-color-cta-danger-hover)}}._kind-danger_79wly_191:focus-visible{background:var(--betterplace-color-cta-danger-hover)}._kind-danger_79wly_191:active{background:var(--betterplace-color-cta-danger-hover);box-shadow:var(--betterplace-shadow-pressed-danger)}._kind-plain_79wly_233{border:none;background:transparent;color:var(--betterplace-color-cta-secondary);transition:background .1s linear,color .1s linear,box-shadow .1s linear}._kind-plain_79wly_233._size-large_79wly_39{font:var(--betterplace-typography-label-lg)}._kind-plain_79wly_233._size-default_79wly_43{font:var(--betterplace-typography-label-md)}._kind-plain_79wly_233._size-small_79wly_47{font:var(--betterplace-typography-label-xs)}._kind-plain_79wly_233._size-input_79wly_51{font:var(--betterplace-typography-label-md);height:3.125rem}._kind-plain_79wly_233:focus-visible{text-decoration:underline;text-underline-offset:.25em;outline-offset:var(--betterplace-spacing-none)}@media (hover: hover){._kind-plain_79wly_233:hover{text-decoration:underline;text-underline-offset:.25em;background-color:var(--betterplace-color-bg-primary);color:var(--betterplace-color-cta-secondary-hover-alt)}}._kind-plain_79wly_233:active{background-color:var(--betterplace-color-bg-neutral);color:var(--betterplace-color-cta-secondary-hover-alt)}:is(._kind-plain_79wly_233[aria-disabled=true]:not(._busy_79wly_181),._kind-plain_79wly_233[disabled]),:is(._kind-plain_79wly_233[aria-disabled=true]:not(._busy_79wly_181),._kind-plain_79wly_233[disabled]):hover,:is(._kind-plain_79wly_233[aria-disabled=true]:not(._busy_79wly_181),._kind-plain_79wly_233[disabled]):focus-visible,:is(._kind-plain_79wly_233[aria-disabled=true]:not(._busy_79wly_181),._kind-plain_79wly_233[disabled]):active{background-color:transparent;text-decoration:none;color:var(--betterplace-color-fg-mute)}._kind-plain_79wly_233._ghost_79wly_156{border:var(--betterplace-border-width-focus) solid transparent;background:transparent;color:var(--betterplace-color-fg-light-primary);transition:border .1s linear,color .1s linear,box-shadow .1s linear}._kind-plain_79wly_233._ghost_79wly_156:focus-visible{outline-offset:var(--betterplace-spacing-none);outline:var(--betterplace-border-on-color-focused);text-decoration:underline}._kind-plain_79wly_233._ghost_79wly_156:active{text-decoration:underline;border:var(--betterplace-border-on-color-focused);border-radius:var(--betterplace-border-radius-200)}@media (hover: hover){._kind-plain_79wly_233._ghost_79wly_156{text-decoration:underline;border:var(--betterplace-border-on-color-focused);border-radius:var(--betterplace-border-radius-200)}}:is(._kind-plain_79wly_233._ghost_79wly_156[aria-disabled=true]:not(._busy_79wly_181),._kind-plain_79wly_233._ghost_79wly_156[disabled]),:is(._kind-plain_79wly_233._ghost_79wly_156[aria-disabled=true]:not(._busy_79wly_181),._kind-plain_79wly_233._ghost_79wly_156[disabled]):hover,:is(._kind-plain_79wly_233._ghost_79wly_156[aria-disabled=true]:not(._busy_79wly_181),._kind-plain_79wly_233._ghost_79wly_156[disabled]):focus-visible,:is(._kind-plain_79wly_233._ghost_79wly_156[aria-disabled=true]:not(._busy_79wly_181),._kind-plain_79wly_233._ghost_79wly_156[disabled]):active{background-color:transparent;color:var(--betterplace-color-fg-mute);border:var(--betterplace-border-width-focus) solid transparent;text-decoration:none;box-shadow:none;text-shadow:none;cursor:default}._size-large_79wly_39{padding:var(--betterplace-spacing-250) var(--betterplace-spacing-400)}._size-small_79wly_47{padding:var(--betterplace-spacing-100) var(--betterplace-spacing-300);position:relative}._size-small_79wly_47:before,._size-small_79wly_47:after{content:"";position:absolute;inset-inline:0;block-size:var(--betterplace-sizing-100)}._size-small_79wly_47._size-input_79wly_51{font:var(--betterplace-typography-label-md);height:3.125rem}._size-small_79wly_47:before{inset-block-end:100%}._size-small_79wly_47:after{inset-block-start:100%}:is([aria-disabled=true]:not(._busy_79wly_181),[disabled]),:is([aria-disabled=true]:not(._busy_79wly_181),[disabled]):hover,:is([aria-disabled=true]:not(._busy_79wly_181),[disabled]):focus-visible,:is([aria-disabled=true]:not(._busy_79wly_181),[disabled]):active{background:var(--betterplace-color-bg-disabled);color:var(--betterplace-color-fg-content-secondary);border-color:transparent;box-shadow:none;text-shadow:none;cursor:default}:is(:is([aria-disabled=true]:not(._busy_79wly_181),[disabled]),:is([aria-disabled=true]:not(._busy_79wly_181),[disabled]):hover,:is([aria-disabled=true]:not(._busy_79wly_181),[disabled]):focus-visible,:is([aria-disabled=true]:not(._busy_79wly_181),[disabled]):active):before{opacity:0!important}@media (forced-colors: active){[aria-disabled=true]:not(._busy_79wly_181),[aria-disabled=true]:not(._busy_79wly_181):hover{border-color:GrayText;color:GrayText}}._srOnly_79wly_395{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0} diff --git a/assets/Button.stories-BjFU2eFw.js b/assets/Button.stories-BjFU2eFw.js new file mode 100644 index 0000000..93d1da1 --- /dev/null +++ b/assets/Button.stories-BjFU2eFw.js @@ -0,0 +1,9 @@ +import{j as o}from"./jsx-runtime-BlAj40OV.js";import{B as r}from"./Button-CmRA-hR5.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";const i={id:"1703:2814",url:"https://www.figma.com/file/PJ7OUutWRrSHW6qgaPNW1l/DS-betterplace-GENERAL?node-id=1703%3A2814",themes:[]};var d={BASE_URL:"./",DEV:!1,MODE:"production",PROD:!0,SSR:!1,STORYBOOK:"true",STORYBOOK_BASE_URL:"/betterplace-design-system/"};function l(t){return o.jsx("div",{style:{padding:"var(--betterplace-spacing-100)",background:t.ghost?"#4A4A4A":void 0,containerType:"inline-size"},children:o.jsx(r,{...t})})}const b={title:"Components/Button",component:l,argTypes:{children:{control:{type:"text"},description:"The (text) content of the button."},kind:{options:["primary","secondary","danger","plain","secondary-danger"],control:{type:"radio"},description:"Applies specific design",table:{defaultValue:{summary:"primary"},type:{summary:"ButtonKind | undefined"}}},size:{options:["large","default","small","input"],control:{type:"radio"},description:"Size of the button",table:{defaultValue:{summary:"default"},type:{summary:"ButtonSize | undefined"}}},as:{options:["button","a"],control:"radio",description:"HTML tag"},disabled:{control:{type:"boolean"},description:"Toggles aria-disabled. We use aria-disabled instead of disabled to keep focusability and with that the possibility to add a description that reasons the disabled state.",table:{defaultValue:{summary:"false"}}},disabledReason:{control:{type:"text"},description:"Reason for the disabled state. Will be read out by screen readers, if aria-describedby is not provided"},busy:{control:{type:"boolean"},description:"Toggles aria-busy and aria-disabled. Use when you want to preserve the non-disabled style.",table:{defaultValue:{summary:"false"}}},ghost:{description:"Additional styling options for ghost style button, which includes transparent button background and light font color for darker backgrounds.",control:{type:"boolean"}},props:{control:!1,description:"All props (e.g. `href`, `onClick`) are passed on to the root JSX element"}},parameters:{design:{type:"figspec",accessToken:d.STORYBOOK_FIGMA_ACCESS_TOKEN,url:i.url},vitest:{testFile:"Button.test.tsx"}}},e={args:{children:"Donate now",kind:"primary",as:"button",size:"default",ghost:!1}};var a,s,n;e.parameters={...e.parameters,docs:{...(a=e.parameters)==null?void 0:a.docs,source:{originalSource:`{ + args: { + children: 'Donate now', + kind: 'primary', + as: 'button', + size: 'default', + ghost: false + } +}`,...(n=(s=e.parameters)==null?void 0:s.docs)==null?void 0:n.source}}};const y=["Default"];export{e as Default,y as __namedExportsOrder,b as default}; diff --git a/assets/Callout-Bb2Jg5MV.css b/assets/Callout-Bb2Jg5MV.css new file mode 100644 index 0000000..eaa0a38 --- /dev/null +++ b/assets/Callout-Bb2Jg5MV.css @@ -0,0 +1 @@ +._alert_w0jma_1{border-radius:var(--betterplace-border-radius-200);padding:var(--betterplace-spacing-300);border:var(--betterplace-border-default);background-color:var(--betterplace-color-bg-neutral);display:flex}._kind-success_w0jma_9{border-color:var(--betterplace-color-border-success);background-color:var(--betterplace-color-bg-success)}._kind-warning_w0jma_14{border-color:var(--betterplace-color-border-attention);background-color:var(--betterplace-color-bg-attention)}._kind-error_w0jma_19{border-color:var(--betterplace-color-border-danger);background-color:var(--betterplace-color-bg-danger)} diff --git a/assets/Callout-C9Zts6EG.js b/assets/Callout-C9Zts6EG.js new file mode 100644 index 0000000..b05e477 --- /dev/null +++ b/assets/Callout-C9Zts6EG.js @@ -0,0 +1 @@ +import{j as i}from"./jsx-runtime-BlAj40OV.js";import{c as _}from"./index-Bl6ORisp.js";const c="_alert_w0jma_1",s={alert:c,"kind-success":"_kind-success_w0jma_9","kind-warning":"_kind-warning_w0jma_14","kind-error":"_kind-error_w0jma_19"};function d({kind:r,className:a,style:t,children:e,...n}){const o=r==="error"?"alert":"status";return i.jsx("div",{...n,style:t,className:_(s.alert,a,s[`kind-${r}`]),role:o,children:e})}export{d as C}; diff --git a/assets/Callout.stories-BCOhSEJg.js b/assets/Callout.stories-BCOhSEJg.js new file mode 100644 index 0000000..40e79b3 --- /dev/null +++ b/assets/Callout.stories-BCOhSEJg.js @@ -0,0 +1,6 @@ +import{C as s}from"./Callout-C9Zts6EG.js";import"./jsx-runtime-BlAj40OV.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";const l={title:"Components/Callout",component:s,argTypes:{kind:{control:{type:"radio"},options:["success","warning","error"],description:"Applies specific design",table:{type:{summary:"CalloutKind"}}},children:{control:{type:"text"}}}},e={args:{kind:"success",children:"Lorem ipsum dolor sit amet, consectetur adipiscing elit."}};var t,o,r;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`{ + args: { + kind: 'success', + children: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.' + } +}`,...(r=(o=e.parameters)==null?void 0:o.docs)==null?void 0:r.source}}};const m=["Default"];export{e as Default,m as __namedExportsOrder,l as default}; diff --git a/assets/Card-CXehOyXK.js b/assets/Card-CXehOyXK.js new file mode 100644 index 0000000..a76bb50 --- /dev/null +++ b/assets/Card-CXehOyXK.js @@ -0,0 +1 @@ +import{j as n}from"./jsx-runtime-BlAj40OV.js";import{c}from"./index-Bl6ORisp.js";import{r as e}from"./index-Cs7sjTYM.js";const i="_container_evalh_1",m={container:i},f=e.forwardRef(function({as:r="div",className:s,children:a,...o},t){return n.jsx(r,{...o,className:c(m.container,s),ref:t,children:a})}),C=f;export{C}; diff --git a/assets/Card-ChF_MIWm.css b/assets/Card-ChF_MIWm.css new file mode 100644 index 0000000..8699abc --- /dev/null +++ b/assets/Card-ChF_MIWm.css @@ -0,0 +1 @@ +._container_evalh_1{padding:var(--betterplace-spacing-300);background-color:var(--betterplace-color-bg-subtle);border-radius:var(--betterplace-border-radius-300);container-type:inline-size} diff --git a/assets/Card.stories-CXvHfswY.js b/assets/Card.stories-CXvHfswY.js new file mode 100644 index 0000000..dacc341 --- /dev/null +++ b/assets/Card.stories-CXvHfswY.js @@ -0,0 +1,5 @@ +import{C as s}from"./Card-CXehOyXK.js";import"./jsx-runtime-BlAj40OV.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";const i={title:"Components/Card",component:s,argTypes:{children:{control:!1,description:"(Text) content to be rendered"},props:{control:!1,description:"All props (e.g. style and className) are passed on to the root JSX element"}},parameters:{vitest:{testFile:"Card.test.tsx"}}},e={args:{children:"Card content"}};var r,t,o;e.parameters={...e.parameters,docs:{...(r=e.parameters)==null?void 0:r.docs,source:{originalSource:`{ + args: { + children: 'Card content' + } +}`,...(o=(t=e.parameters)==null?void 0:t.docs)==null?void 0:o.source}}};const l=["Default"];export{e as Default,l as __namedExportsOrder,i as default}; diff --git a/assets/Checkbox.stories-DzXifGDC.js b/assets/Checkbox.stories-DzXifGDC.js new file mode 100644 index 0000000..0d96f20 --- /dev/null +++ b/assets/Checkbox.stories-DzXifGDC.js @@ -0,0 +1,13 @@ +import{j as o}from"./jsx-runtime-BlAj40OV.js";import{C as l}from"./ClientCheckbox-C1-KzgT7.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";import"./preventDefault-M1KdZT7V.js";const x={title:"Components/Checkbox",component:l,parameters:{docs:{description:{component:"Checkbox component with custom betterplace styling. Checkboxes should always be grouped within a `Fieldset` component. When you have only one checkbox, but want to have an error state, it is necessary to enclose it in a `Fieldset`"}}},argTypes:{children:{control:{type:"text"},description:"Label text for the checkbox.",table:{type:{summary:"ReactNode"}}},disabled:{control:{type:"boolean"},description:"Toggles aria-disabled. We use aria-disabled instead of disabled to keep focusability and with that the possibility to add a description that reasons the disabled state.",table:{defaultValue:{summary:"false"},type:{summary:"boolean"}}},fullWidth:{control:{type:"radio"},options:[!0,void 0,"mobile-only"],description:"Take 100% of the space.",table:{defaultValue:{summary:"undefined"}}}}},e={args:{children:"Checkbox label",id:"test-checkbox"}},t={args:{children:o.jsxs(o.Fragment,{children:["This is a ",o.jsx("strong",{children:"rich text"})," label"]}),id:"test-checkbox"}};var s,a,r;e.parameters={...e.parameters,docs:{...(s=e.parameters)==null?void 0:s.docs,source:{originalSource:`{ + args: { + children: 'Checkbox label', + id: 'test-checkbox' + } +}`,...(r=(a=e.parameters)==null?void 0:a.docs)==null?void 0:r.source}}};var i,n,c;t.parameters={...t.parameters,docs:{...(i=t.parameters)==null?void 0:i.docs,source:{originalSource:`{ + args: { + children: <> + This is a rich text label + , + id: 'test-checkbox' + } +}`,...(c=(n=t.parameters)==null?void 0:n.docs)==null?void 0:c.source}}};const y=["Default","WithRichTextLabel"];export{e as Default,t as WithRichTextLabel,y as __namedExportsOrder,x as default}; diff --git a/assets/ClientAmountField-BeKZJ_SU.js b/assets/ClientAmountField-BeKZJ_SU.js new file mode 100644 index 0000000..eab5ec3 --- /dev/null +++ b/assets/ClientAmountField-BeKZJ_SU.js @@ -0,0 +1 @@ +import{j as J}from"./jsx-runtime-BlAj40OV.js";import{c as O}from"./index-Bl6ORisp.js";import{r as a}from"./index-Cs7sjTYM.js";import{T as Q}from"./TextInput-CJfcBDcM.js";import{u as X}from"./useForwardedRef-Bxam_td3.js";const Y=(r,e)=>Number(r==="en"?String(e).replace(/[^0-9.]/g,""):String(e).replace(/[^0-9,]/g,"").replace(/,/g,".")),C={},Z=(r,e,t,i)=>{const c=`${r}-${e?"currency":"noCurrency"}-${t}-${i}`;let s=C[c];return s||(s=new Intl.NumberFormat(r??"de",{minimumFractionDigits:t,maximumFractionDigits:t,...e?{style:"currency",currency:"EUR"}:{},...i?{}:{useGrouping:!1}}),C[c]=s),s};function b(r,e,t={}){const i=(t==null?void 0:t.precision)===void 0?2:t==null?void 0:t.precision,d=typeof e=="number"?e||0:Y(r,e),c=(t==null?void 0:t.thousandSeparator)??!0;return Z(r,!(t!=null&&t.format),i,c).format(d).replace(/\u00A0/," ")}function z(r){if(!r)return 0;const e=r.replace(/,/g,"."),t=parseFloat(e)||0;return Math.round(t*100)}function x(r,e=2){return r.replace(/[^\d.,]/g,"").replace(/^([.,]{1,1})/,"0$1").replace(/^0{2,}/,"0").replace(/^0([\d]+)([\d,.]*)/,"$1$2").replace(/[.,]([^.,]*)(?=[.,])/g,"$1").replace(new RegExp(`([.,]\\d{${e}}).*$`),"$1")}const B="_hideSteps_fdmq0_1",V={hideSteps:B};function A(r){if(typeof r>"u")return;let e;if(typeof r!="number"?e=parseFloat(r):e=r,!isNaN(e))return Math.round(e*100)}const w=a.forwardRef(({label:r,locale:e="de",name:t,id:i,min:d=0,onChange:c,onBlur:s,onFocus:f,defaultValue:m,value:p,step:h,children:I,className:j,hideSteps:D,max:P,...T},K)=>{const u=a.useMemo(()=>v(h),[h]),[l,N]=a.useState(x(b(e,p??m??"",{precision:u,format:"%v",thousandSeparator:!1}),u)),$=a.useMemo(()=>A(P),[P]),F=a.useMemo(()=>A(d),[d]),[g,y]=a.useState(null),[S,L]=X(K),U=a.useCallback(n=>{const o=k(n.target.value,e,u),M=z(o);if(typeof $<"u"&&M>$||typeof F<"u"&&M{const o=k(n.target.value,e,u);o!==n.target.value&&(n.target.value=o),y(null),s==null||s(n)},[s,u,e]),W=a.useCallback(n=>{y(n.target.selectionStart),f==null||f(n)},[f]),G=a.useMemo(()=>m?{defaultValue:l}:{value:l},[m,l]);return a.useEffect(()=>{if(typeof m<"u")return;const n=p??m;if(typeof p>"u")return N("");const o=x(b(e,n,{precision:u,format:"%v",thousandSeparator:!1}),u);N(o)},[p,u,m,e]),a.useEffect(()=>{const n=(l==null?void 0:l.length)??0,o=(g??0)>n?n:g;g===null||!S.current||document.activeElement!==S.current||S.current.setSelectionRange(o,o)},[g,S,l]),J.jsx(Q,{...T,...G,onFocus:W,onBlur:q,onChange:U,step:h,ref:L,id:i||t,name:t,label:r,pattern:"[0-9]*[.,]?[0-9]*",type:"text",inputMode:"decimal",className:O(j,{[V.hideSteps]:D}),children:I})});w.displayName="ClientAmountField";function k(r,e,t=2){if(typeof r>"u"||r===null)return r;const i=String(r),d=x(i,t),c=b(e,d,{precision:t,format:"%v",thousandSeparator:!1}),s=x(c,t);if(!t)return s;const f=s.search(/[.,]/);if(f<0)return s;const m=t-(s.length-1-f);return s.concat("0".repeat(m))}function v(r){var t;return r===void 0?void 0:((t=String(r).split(".")[1])==null?void 0:t.length)??0}const st=w;export{st as A}; diff --git a/assets/ClientAmountField-DiXec8Hg.css b/assets/ClientAmountField-DiXec8Hg.css new file mode 100644 index 0000000..41e4e76 --- /dev/null +++ b/assets/ClientAmountField-DiXec8Hg.css @@ -0,0 +1 @@ +._hideSteps_fdmq0_1{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}._hideSteps_fdmq0_1::-webkit-outer-spin-button,._hideSteps_fdmq0_1::-webkit-inner-spin-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0} diff --git a/assets/ClientButton-DhJqhttM.js b/assets/ClientButton-DhJqhttM.js new file mode 100644 index 0000000..40e8cce --- /dev/null +++ b/assets/ClientButton-DhJqhttM.js @@ -0,0 +1 @@ +import{j as K}from"./jsx-runtime-BlAj40OV.js";import{B as D}from"./Button-CmRA-hR5.js";import{r as d}from"./index-Cs7sjTYM.js";import{p as t}from"./preventDefault-M1KdZT7V.js";const j=d.forwardRef(function({onKeyDown:e,onKeyUp:r,onKeyDownCapture:s,onKeyUpCapture:a,onClick:p,...n},i){const{disabled:u,busy:c}=n,o=u||c,C=o?t:e,f=o?t:r,m=o?t:s,y=o?t:a,l=o?t:p;return K.jsx(D,{...n,onClick:l,onChange:C,onKeyUp:f,onKeyDownCapture:m,onKeyUpCapture:y,ref:i})});export{j as C}; diff --git a/assets/ClientCheckbox-C1-KzgT7.js b/assets/ClientCheckbox-C1-KzgT7.js new file mode 100644 index 0000000..a3a8a95 --- /dev/null +++ b/assets/ClientCheckbox-C1-KzgT7.js @@ -0,0 +1 @@ +import{j as a}from"./jsx-runtime-BlAj40OV.js";import{c as b}from"./index-Bl6ORisp.js";import{r as k}from"./index-Cs7sjTYM.js";import{p}from"./preventDefault-M1KdZT7V.js";const v="_checkmark_11dof_1",L="_checkboxContainer_11dof_26",R="_labelContent_11dof_42",g="_checkboxWrapper_11dof_91",I="_checkbox_11dof_26",q="_disabledLabel_11dof_101",e={checkmark:v,checkboxContainer:L,labelContent:R,checkboxWrapper:g,checkbox:I,disabledLabel:q},w=k.forwardRef(function({id:r,name:i,error:n=!1,classNames:o,"aria-disabled":s,"aria-required":h,children:d,required:m,checked:x,disabled_:t,disabled:C,fullWidth:c,...f},j){const u=k.useId(),l=r||i||u,N=s||C||t;return a.jsx("label",{htmlFor:l,className:b(e.checkboxContainer,o==null?void 0:o.label,{[e.disabledLabel]:C,fullWidth:c&&c!=="mobile-only",fullWidthOnMobile:c&&c==="mobile-only"}),children:a.jsxs("div",{className:b(e.checkboxWrapper,{fullWidth:c&&c!=="mobile-only",fullWidthOnMobile:c&&c==="mobile-only"}),children:[a.jsxs("div",{className:e.checkbox,children:[a.jsx("input",{tabIndex:0,...f,type:"checkbox",ref:j,id:l,name:i,required:m,disabled:t,"aria-disabled":N,"aria-required":m,"aria-invalid":n,"aria-checked":x,"aria-describedby":n?`${i}-error`:void 0}),a.jsx("span",{className:b(e.checkmark,o==null?void 0:o.checkmark)})]}),a.jsx("div",{className:b(e.labelContent,o==null?void 0:o.labelContent),children:d})]})})}),D=k.forwardRef(function({onChange:r,onClick:i,...n},o){const{disabled:s}=n,h=s?p:r,d=s?p:i;return a.jsx(w,{...n,onChange:h,onClick:d,ref:o})}),F=D;export{F as C}; diff --git a/assets/ClientCheckbox-C6sAWcT_.css b/assets/ClientCheckbox-C6sAWcT_.css new file mode 100644 index 0000000..d709bc1 --- /dev/null +++ b/assets/ClientCheckbox-C6sAWcT_.css @@ -0,0 +1 @@ +._checkmark_11dof_1{border:var(--betterplace-border-default);background:var(--betterplace-color-bg-light);width:var(--betterplace-sizing-400);height:var(--betterplace-sizing-400);border-radius:var(--betterplace-border-radius-200);flex-shrink:0;vertical-align:middle;display:flex;align-items:center;justify-content:center}._checkmark_11dof_1:before{content:"";display:inline-block;opacity:0;transition:transform .2s ease-out,opacity .1s ease-out;height:100%;width:100%;transform:scale(0)}._checkboxContainer_11dof_26{display:flex;align-items:center;position:relative;font:var(--betterplace-typography-functional-text-md-default);color:var(--betterplace-color-fg-content-primary);padding-block:var(--betterplace-spacing-200) var(--betterplace-spacing-200);cursor:pointer;transition:outline .1s linear;min-height:48px}._checkboxContainer_11dof_26 ._labelContent_11dof_42{padding-left:var(--betterplace-spacing-200);padding-top:1px}._checkboxContainer_11dof_26 input{position:absolute;z-index:-1;opacity:0}._checkboxContainer_11dof_26 input:checked+._checkmark_11dof_1{background-color:var(--betterplace-color-fg-selected)}._checkboxContainer_11dof_26 ._checkmark_11dof_1:before{background-image:url("data:image/svg+xml,%3csvg%20width='17'%20height='17'%20viewBox='0%200%2017%2017'%20fill='white'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M14.0404%203.29289C14.4309%203.68342%2014.4309%204.31658%2014.0404%204.70711L6.70707%2012.0404C6.51953%2012.228%206.26518%2012.3333%205.99996%2012.3333C5.73474%2012.3333%205.48039%2012.228%205.29285%2012.0404L1.95952%208.70711C1.56899%208.31658%201.56899%207.68342%201.95952%207.29289C2.35004%206.90237%202.98321%206.90237%203.37373%207.29289L5.99996%209.91912L12.6262%203.29289C13.0167%202.90237%2013.6499%202.90237%2014.0404%203.29289Z'%20/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:center;opacity:0;transform:scale(0);transition:transform .2s ease-out,opacity .1s ease-out}._checkboxContainer_11dof_26 input:checked+._checkmark_11dof_1:before{opacity:1;transform:scale(1)}._checkboxContainer_11dof_26 input[aria-disabled=true]:checked+._checkmark_11dof_1,._checkboxContainer_11dof_26 input:disabled:checked+._checkmark_11dof_1{background:var(--betterplace-color-fg-mute)}._checkboxContainer_11dof_26 input[aria-disabled=true]~*,._checkboxContainer_11dof_26 input:disabled~*{color:var(--betterplace-color-fg-mute)}._checkboxContainer_11dof_26:has(:focus-visible){border-radius:var(--betterplace-border-radius-100);outline:var(--betterplace-border-focused);outline-offset:var(--betterplace-spacing-100)}._checkboxContainer_11dof_26 ._checkboxWrapper_11dof_91{display:flex}._checkboxContainer_11dof_26 ._checkboxWrapper_11dof_91 ._checkbox_11dof_26{display:flex;flex-direction:column}._disabledLabel_11dof_101{color:var(--betterplace-color-fg-mute)} diff --git a/assets/ClientIconButton-B-dydley.css b/assets/ClientIconButton-B-dydley.css new file mode 100644 index 0000000..e8a4c57 --- /dev/null +++ b/assets/ClientIconButton-B-dydley.css @@ -0,0 +1 @@ +._iconButton_t9ddf_1{display:flex!important;align-items:center;justify-content:center;gap:var(--betterplace-spacing-100)}._iconOnly_t9ddf_9{padding:var(--betterplace-spacing-300)!important;gap:0}._iconSlot_t9ddf_14{--icon-size: 0;display:flex;align-items:center;justify-content:center;max-width:0;overflow:hidden;transition:max-width .2s ease-in-out}._iconSlot_t9ddf_14._hasIcon_t9ddf_24{max-width:var(--icon-size)} diff --git a/assets/ClientIconButton-CsrI0D2P.js b/assets/ClientIconButton-CsrI0D2P.js new file mode 100644 index 0000000..3bb376f --- /dev/null +++ b/assets/ClientIconButton-CsrI0D2P.js @@ -0,0 +1 @@ +import{j as c}from"./jsx-runtime-BlAj40OV.js";import{c as x}from"./index-Bl6ORisp.js";import{B as C}from"./Button-CmRA-hR5.js";import{r as B}from"./index-Cs7sjTYM.js";import{I as j}from"./Icon-DX5oPjN8.js";import{p as i}from"./preventDefault-M1KdZT7V.js";const K="_iconButton_t9ddf_1",w="_iconOnly_t9ddf_9",z="_iconSlot_t9ddf_14",S="_hasIcon_t9ddf_24",u={iconButton:K,iconOnly:w,iconSlot:z,hasIcon:S},g={small:"200",default:"300",input:"300",large:"400"};function _({enabled:r,...n}){const o=`var(--betterplace-sizing-${n.size})`;return c.jsx("span",{className:x(u.iconSlot,{[u.hasIcon]:r}),style:{"--icon-size":o,width:o},children:r&&c.jsx(j,{...n})})}const D=B.forwardRef(function({children:n,size:o="default",as:d,className:l,iconName:s,iconPosition:e="left",iconProps:a={},...t},m){const p=x(u.iconButton,{[l]:l,[u.iconOnly]:!n&&!!s}),f=!!s,y=f&&e==="right",I=f&&e==="left",h=a.size??g[o];return c.jsxs(C,{...t,size:o,as:d,className:p,ref:m,children:[c.jsx(_,{...a,name:s,size:h,enabled:I}),n,c.jsx(_,{...a,name:s,size:h,enabled:y})]})}),E=B.forwardRef(function({onKeyDown:n,onKeyUp:o,onKeyDownCapture:d,onKeyUpCapture:l,onClick:s,...e},a){const{disabled:t}=e,m=t?i:n,p=t?i:o,f=t?i:d,y=t?i:l,I=t?i:s;return c.jsx(D,{...e,onClick:I,onChange:m,onKeyUp:p,onKeyDownCapture:f,onKeyUpCapture:y,ref:a})});export{E as C}; diff --git a/assets/ClientRadioButton-BVXVcQMH.css b/assets/ClientRadioButton-BVXVcQMH.css new file mode 100644 index 0000000..134ab58 --- /dev/null +++ b/assets/ClientRadioButton-BVXVcQMH.css @@ -0,0 +1 @@ +._radioContainer_18a0e_1{display:flex;align-items:center;position:relative;font:var(--betterplace-typography-functional-text-md-default);color:var(--betterplace-color-fg-content-primary);padding-block:var(--betterplace-spacing-200) var(--betterplace-spacing-200);cursor:pointer;transition:outline .1s linear;min-height:3rem}._radioContainer_18a0e_1 ._label_18a0e_17{padding-inline-start:var(--betterplace-spacing-200)}._radioContainer_18a0e_1 input{position:absolute;z-index:-1;opacity:0}._radioContainer_18a0e_1 ._radioCircle_18a0e_27 circle:last-of-type{transition:transform .2s ease-out,opacity .1s ease-out;opacity:0;transform-origin:center;transform:scale(0)}._radioContainer_18a0e_1 input:checked+._radioCircle_18a0e_27 circle:last-of-type{opacity:1;transform:scale(1)}._radioContainer_18a0e_1 input[aria-disabled=true]:checked+._radioCircle_18a0e_27 circle:last-of-type,._radioContainer_18a0e_1 input:disabled:checked+._radioCircle_18a0e_27 circle:last-of-type{fill:var(--betterplace-color-bg-disabled)}._radioContainer_18a0e_1:has(:focus-visible),._radioContainer_18a0e_1:focus-visible{border-radius:var(--betterplace-border-radius-100);outline:var(--betterplace-border-focused);outline-offset:var(--betterplace-spacing-100)}._radioWrapper_18a0e_60{display:flex;align-items:center}._radio_18a0e_1{display:flex;flex-direction:column}._disabledLabel_18a0e_70{color:var(--betterplace-color-fg-mute)} diff --git a/assets/ClientRadioButton-D6ER925T.js b/assets/ClientRadioButton-D6ER925T.js new file mode 100644 index 0000000..e720c9d --- /dev/null +++ b/assets/ClientRadioButton-D6ER925T.js @@ -0,0 +1 @@ +import{j as a}from"./jsx-runtime-BlAj40OV.js";import{c as s}from"./index-Bl6ORisp.js";import{r as n}from"./index-Cs7sjTYM.js";import{p}from"./preventDefault-M1KdZT7V.js";const v="_radioContainer_18a0e_1",w="_label_18a0e_17",k="_radioCircle_18a0e_27",N="_radioWrapper_18a0e_60",B="_radio_18a0e_1",E="_disabledLabel_18a0e_70",r={radioContainer:v,label:w,radioCircle:k,radioWrapper:N,radio:B,disabledLabel:E},I=t=>n.createElement("svg",{width:27,height:28,viewBox:"0 0 27 28",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},n.createElement("circle",{cx:13.5,cy:14.21,r:12.9375,fill:"white",stroke:"#919191",strokeWidth:1.125}),n.createElement("circle",{cx:13.4882,cy:14.2689,r:6.75,fill:"#357C00"})),L=n.forwardRef(function({children:l,disabled_:c,checked:d,classNames:o,disabled:e,"aria-disabled":m,fullWidth:i,...b},u){const{value:f,name:h,id:R}=b,g=n.useId(),C=`${R||h||g}-${String(f)}`,_=c||e,j=m||_;return a.jsx("label",{htmlFor:C,className:s(r.radioContainer,o==null?void 0:o.container,{[r.disabledLabel]:_,fullWidth:i&&i!=="mobile-only",fullWidthOnMobile:i&&i==="mobile-only"}),onClick:b.onClick,children:a.jsxs("div",{className:s(r.radioWrapper,{fullWidth:i&&i!=="mobile-only",fullWidthOnMobile:i&&i==="mobile-only"}),children:[a.jsxs("div",{className:r.radio,children:[a.jsx("input",{...b,id:C,type:"radio",ref:u,"aria-disabled":j,"aria-checked":d,disabled:c}),a.jsx(I,{className:s(r.radioCircle,o==null?void 0:o.radioCircle)})]}),a.jsx("div",{className:s(r.label,o==null?void 0:o.label),children:l})]})})}),D=n.forwardRef(function({onChange:l,onClick:c,...d},o){const{disabled:e}=d,m=e?p:l,i=e?p:c;return a.jsx(L,{...d,onChange:m,onClick:i,ref:o})}),F=D;export{F as R}; diff --git a/assets/ClientSelect-DQsrC2rb.js b/assets/ClientSelect-DQsrC2rb.js new file mode 100644 index 0000000..3d36526 --- /dev/null +++ b/assets/ClientSelect-DQsrC2rb.js @@ -0,0 +1 @@ +import{j as o}from"./jsx-runtime-BlAj40OV.js";import{T as y}from"./TextInputWrapper-_VuV0eOO.js";import{c as N}from"./index-Bl6ORisp.js";import{s as p}from"./Select.module-VGDajZ98.js";import{I as R}from"./Icon-DX5oPjN8.js";import{r as l}from"./index-Cs7sjTYM.js";import{p as f}from"./preventDefault-M1KdZT7V.js";const h=l.forwardRef(function({id:n,name:e,children:t,label:a,hint:r,required:i,disabled:c,disabled_:d,"aria-disabled":b,description:u,error:C,warning:j,errorDisplay:D="all",fullWidth:s,...I},w){const S=l.useId(),m=n||e||S,g=b||(d||c);return o.jsx(y,{label:a,name:e,description:u,error:C,warning:j,id:m||e,required:i,errorDisplay:D,fullWidth:s,hint:r,children:o.jsxs("div",{className:p.selectContainer,children:[o.jsx("select",{...I,ref:w,className:N(p.select,{fullWidth:s&&s!=="mobile-only",fullWidthOnMobile:s&&s==="mobile-only"}),id:m,name:e,"aria-disabled":g,disabled:d,children:t}),o.jsx(R,{name:"arrowDown"})]})})}),A=l.forwardRef(function({onChange:n,onClick:e,...t},a){const{disabled:r}=t,i=r?f:n,c=r?f:e;return o.jsx(h,{...t,onChange:i,onClick:c,ref:a})});export{A as C}; diff --git a/assets/Color-KGDBMAHA-BwFCa3JR.js b/assets/Color-KGDBMAHA-BwFCa3JR.js new file mode 100644 index 0000000..bcb38fa --- /dev/null +++ b/assets/Color-KGDBMAHA-BwFCa3JR.js @@ -0,0 +1 @@ +import{aj as Q,ak as x,a2 as A,a0 as Y,b as ee,al as te,am as ne}from"./index-DNzjNleM.js";import{r as v,R as p}from"./index-Cs7sjTYM.js";import{Z as re,H as se,u as ae}from"./index-B_ZOYESs.js";import{g as D}from"./_commonjsHelpers-BosuxZz1.js";import{_ as oe,i as K}from"./index-nrpnv_Jx.js";import"./iframe-DS2PgOfP.js";import"../sb-preview/runtime.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-DrFu-skq.js";var ie={aliceblue:[240,248,255],antiquewhite:[250,235,215],aqua:[0,255,255],aquamarine:[127,255,212],azure:[240,255,255],beige:[245,245,220],bisque:[255,228,196],black:[0,0,0],blanchedalmond:[255,235,205],blue:[0,0,255],blueviolet:[138,43,226],brown:[165,42,42],burlywood:[222,184,135],cadetblue:[95,158,160],chartreuse:[127,255,0],chocolate:[210,105,30],coral:[255,127,80],cornflowerblue:[100,149,237],cornsilk:[255,248,220],crimson:[220,20,60],cyan:[0,255,255],darkblue:[0,0,139],darkcyan:[0,139,139],darkgoldenrod:[184,134,11],darkgray:[169,169,169],darkgreen:[0,100,0],darkgrey:[169,169,169],darkkhaki:[189,183,107],darkmagenta:[139,0,139],darkolivegreen:[85,107,47],darkorange:[255,140,0],darkorchid:[153,50,204],darkred:[139,0,0],darksalmon:[233,150,122],darkseagreen:[143,188,143],darkslateblue:[72,61,139],darkslategray:[47,79,79],darkslategrey:[47,79,79],darkturquoise:[0,206,209],darkviolet:[148,0,211],deeppink:[255,20,147],deepskyblue:[0,191,255],dimgray:[105,105,105],dimgrey:[105,105,105],dodgerblue:[30,144,255],firebrick:[178,34,34],floralwhite:[255,250,240],forestgreen:[34,139,34],fuchsia:[255,0,255],gainsboro:[220,220,220],ghostwhite:[248,248,255],gold:[255,215,0],goldenrod:[218,165,32],gray:[128,128,128],green:[0,128,0],greenyellow:[173,255,47],grey:[128,128,128],honeydew:[240,255,240],hotpink:[255,105,180],indianred:[205,92,92],indigo:[75,0,130],ivory:[255,255,240],khaki:[240,230,140],lavender:[230,230,250],lavenderblush:[255,240,245],lawngreen:[124,252,0],lemonchiffon:[255,250,205],lightblue:[173,216,230],lightcoral:[240,128,128],lightcyan:[224,255,255],lightgoldenrodyellow:[250,250,210],lightgray:[211,211,211],lightgreen:[144,238,144],lightgrey:[211,211,211],lightpink:[255,182,193],lightsalmon:[255,160,122],lightseagreen:[32,178,170],lightskyblue:[135,206,250],lightslategray:[119,136,153],lightslategrey:[119,136,153],lightsteelblue:[176,196,222],lightyellow:[255,255,224],lime:[0,255,0],limegreen:[50,205,50],linen:[250,240,230],magenta:[255,0,255],maroon:[128,0,0],mediumaquamarine:[102,205,170],mediumblue:[0,0,205],mediumorchid:[186,85,211],mediumpurple:[147,112,219],mediumseagreen:[60,179,113],mediumslateblue:[123,104,238],mediumspringgreen:[0,250,154],mediumturquoise:[72,209,204],mediumvioletred:[199,21,133],midnightblue:[25,25,112],mintcream:[245,255,250],mistyrose:[255,228,225],moccasin:[255,228,181],navajowhite:[255,222,173],navy:[0,0,128],oldlace:[253,245,230],olive:[128,128,0],olivedrab:[107,142,35],orange:[255,165,0],orangered:[255,69,0],orchid:[218,112,214],palegoldenrod:[238,232,170],palegreen:[152,251,152],paleturquoise:[175,238,238],palevioletred:[219,112,147],papayawhip:[255,239,213],peachpuff:[255,218,185],peru:[205,133,63],pink:[255,192,203],plum:[221,160,221],powderblue:[176,224,230],purple:[128,0,128],rebeccapurple:[102,51,153],red:[255,0,0],rosybrown:[188,143,143],royalblue:[65,105,225],saddlebrown:[139,69,19],salmon:[250,128,114],sandybrown:[244,164,96],seagreen:[46,139,87],seashell:[255,245,238],sienna:[160,82,45],silver:[192,192,192],skyblue:[135,206,235],slateblue:[106,90,205],slategray:[112,128,144],slategrey:[112,128,144],snow:[255,250,250],springgreen:[0,255,127],steelblue:[70,130,180],tan:[210,180,140],teal:[0,128,128],thistle:[216,191,216],tomato:[255,99,71],turquoise:[64,224,208],violet:[238,130,238],wheat:[245,222,179],white:[255,255,255],whitesmoke:[245,245,245],yellow:[255,255,0],yellowgreen:[154,205,50]};const O=ie,U={};for(const e of Object.keys(O))U[O[e]]=e;const c={rgb:{channels:3,labels:"rgb"},hsl:{channels:3,labels:"hsl"},hsv:{channels:3,labels:"hsv"},hwb:{channels:3,labels:"hwb"},cmyk:{channels:4,labels:"cmyk"},xyz:{channels:3,labels:"xyz"},lab:{channels:3,labels:"lab"},lch:{channels:3,labels:"lch"},hex:{channels:1,labels:["hex"]},keyword:{channels:1,labels:["keyword"]},ansi16:{channels:1,labels:["ansi16"]},ansi256:{channels:1,labels:["ansi256"]},hcg:{channels:3,labels:["h","c","g"]},apple:{channels:3,labels:["r16","g16","b16"]},gray:{channels:1,labels:["gray"]}};var Z=c;for(const e of Object.keys(c)){if(!("channels"in c[e]))throw new Error("missing channels property: "+e);if(!("labels"in c[e]))throw new Error("missing channel labels property: "+e);if(c[e].labels.length!==c[e].channels)throw new Error("channel and label counts mismatch: "+e);const{channels:t,labels:s}=c[e];delete c[e].channels,delete c[e].labels,Object.defineProperty(c[e],"channels",{value:t}),Object.defineProperty(c[e],"labels",{value:s})}c.rgb.hsl=function(e){const t=e[0]/255,s=e[1]/255,n=e[2]/255,r=Math.min(t,s,n),a=Math.max(t,s,n),o=a-r;let i,l;a===r?i=0:t===a?i=(s-n)/o:s===a?i=2+(n-t)/o:n===a&&(i=4+(t-s)/o),i=Math.min(i*60,360),i<0&&(i+=360);const u=(r+a)/2;return a===r?l=0:u<=.5?l=o/(a+r):l=o/(2-a-r),[i,l*100,u*100]};c.rgb.hsv=function(e){let t,s,n,r,a;const o=e[0]/255,i=e[1]/255,l=e[2]/255,u=Math.max(o,i,l),d=u-Math.min(o,i,l),h=function(f){return(u-f)/6/d+1/2};return d===0?(r=0,a=0):(a=d/u,t=h(o),s=h(i),n=h(l),o===u?r=n-s:i===u?r=1/3+t-n:l===u&&(r=2/3+s-t),r<0?r+=1:r>1&&(r-=1)),[r*360,a*100,u*100]};c.rgb.hwb=function(e){const t=e[0],s=e[1];let n=e[2];const r=c.rgb.hsl(e)[0],a=1/255*Math.min(t,Math.min(s,n));return n=1-1/255*Math.max(t,Math.max(s,n)),[r,a*100,n*100]};c.rgb.cmyk=function(e){const t=e[0]/255,s=e[1]/255,n=e[2]/255,r=Math.min(1-t,1-s,1-n),a=(1-t-r)/(1-r)||0,o=(1-s-r)/(1-r)||0,i=(1-n-r)/(1-r)||0;return[a*100,o*100,i*100,r*100]};function le(e,t){return(e[0]-t[0])**2+(e[1]-t[1])**2+(e[2]-t[2])**2}c.rgb.keyword=function(e){const t=U[e];if(t)return t;let s=1/0,n;for(const r of Object.keys(O)){const a=O[r],o=le(e,a);o.04045?((t+.055)/1.055)**2.4:t/12.92,s=s>.04045?((s+.055)/1.055)**2.4:s/12.92,n=n>.04045?((n+.055)/1.055)**2.4:n/12.92;const r=t*.4124+s*.3576+n*.1805,a=t*.2126+s*.7152+n*.0722,o=t*.0193+s*.1192+n*.9505;return[r*100,a*100,o*100]};c.rgb.lab=function(e){const t=c.rgb.xyz(e);let s=t[0],n=t[1],r=t[2];s/=95.047,n/=100,r/=108.883,s=s>.008856?s**(1/3):7.787*s+16/116,n=n>.008856?n**(1/3):7.787*n+16/116,r=r>.008856?r**(1/3):7.787*r+16/116;const a=116*n-16,o=500*(s-n),i=200*(n-r);return[a,o,i]};c.hsl.rgb=function(e){const t=e[0]/360,s=e[1]/100,n=e[2]/100;let r,a,o;if(s===0)return o=n*255,[o,o,o];n<.5?r=n*(1+s):r=n+s-n*s;const i=2*n-r,l=[0,0,0];for(let u=0;u<3;u++)a=t+1/3*-(u-1),a<0&&a++,a>1&&a--,6*a<1?o=i+(r-i)*6*a:2*a<1?o=r:3*a<2?o=i+(r-i)*(2/3-a)*6:o=i,l[u]=o*255;return l};c.hsl.hsv=function(e){const t=e[0];let s=e[1]/100,n=e[2]/100,r=s;const a=Math.max(n,.01);n*=2,s*=n<=1?n:2-n,r*=a<=1?a:2-a;const o=(n+s)/2,i=n===0?2*r/(a+r):2*s/(n+s);return[t,i*100,o*100]};c.hsv.rgb=function(e){const t=e[0]/60,s=e[1]/100;let n=e[2]/100;const r=Math.floor(t)%6,a=t-Math.floor(t),o=255*n*(1-s),i=255*n*(1-s*a),l=255*n*(1-s*(1-a));switch(n*=255,r){case 0:return[n,l,o];case 1:return[i,n,o];case 2:return[o,n,l];case 3:return[o,i,n];case 4:return[l,o,n];case 5:return[n,o,i]}};c.hsv.hsl=function(e){const t=e[0],s=e[1]/100,n=e[2]/100,r=Math.max(n,.01);let a,o;o=(2-s)*n;const i=(2-s)*r;return a=s*r,a/=i<=1?i:2-i,a=a||0,o/=2,[t,a*100,o*100]};c.hwb.rgb=function(e){const t=e[0]/360;let s=e[1]/100,n=e[2]/100;const r=s+n;let a;r>1&&(s/=r,n/=r);const o=Math.floor(6*t),i=1-n;a=6*t-o,o&1&&(a=1-a);const l=s+a*(i-s);let u,d,h;switch(o){default:case 6:case 0:u=i,d=l,h=s;break;case 1:u=l,d=i,h=s;break;case 2:u=s,d=i,h=l;break;case 3:u=s,d=l,h=i;break;case 4:u=l,d=s,h=i;break;case 5:u=i,d=s,h=l;break}return[u*255,d*255,h*255]};c.cmyk.rgb=function(e){const t=e[0]/100,s=e[1]/100,n=e[2]/100,r=e[3]/100,a=1-Math.min(1,t*(1-r)+r),o=1-Math.min(1,s*(1-r)+r),i=1-Math.min(1,n*(1-r)+r);return[a*255,o*255,i*255]};c.xyz.rgb=function(e){const t=e[0]/100,s=e[1]/100,n=e[2]/100;let r,a,o;return r=t*3.2406+s*-1.5372+n*-.4986,a=t*-.9689+s*1.8758+n*.0415,o=t*.0557+s*-.204+n*1.057,r=r>.0031308?1.055*r**(1/2.4)-.055:r*12.92,a=a>.0031308?1.055*a**(1/2.4)-.055:a*12.92,o=o>.0031308?1.055*o**(1/2.4)-.055:o*12.92,r=Math.min(Math.max(0,r),1),a=Math.min(Math.max(0,a),1),o=Math.min(Math.max(0,o),1),[r*255,a*255,o*255]};c.xyz.lab=function(e){let t=e[0],s=e[1],n=e[2];t/=95.047,s/=100,n/=108.883,t=t>.008856?t**(1/3):7.787*t+16/116,s=s>.008856?s**(1/3):7.787*s+16/116,n=n>.008856?n**(1/3):7.787*n+16/116;const r=116*s-16,a=500*(t-s),o=200*(s-n);return[r,a,o]};c.lab.xyz=function(e){const t=e[0],s=e[1],n=e[2];let r,a,o;a=(t+16)/116,r=s/500+a,o=a-n/200;const i=a**3,l=r**3,u=o**3;return a=i>.008856?i:(a-16/116)/7.787,r=l>.008856?l:(r-16/116)/7.787,o=u>.008856?u:(o-16/116)/7.787,r*=95.047,a*=100,o*=108.883,[r,a,o]};c.lab.lch=function(e){const t=e[0],s=e[1],n=e[2];let r;r=Math.atan2(n,s)*360/2/Math.PI,r<0&&(r+=360);const o=Math.sqrt(s*s+n*n);return[t,o,r]};c.lch.lab=function(e){const t=e[0],s=e[1],r=e[2]/360*2*Math.PI,a=s*Math.cos(r),o=s*Math.sin(r);return[t,a,o]};c.rgb.ansi16=function(e,t=null){const[s,n,r]=e;let a=t===null?c.rgb.hsv(e)[2]:t;if(a=Math.round(a/50),a===0)return 30;let o=30+(Math.round(r/255)<<2|Math.round(n/255)<<1|Math.round(s/255));return a===2&&(o+=60),o};c.hsv.ansi16=function(e){return c.rgb.ansi16(c.hsv.rgb(e),e[2])};c.rgb.ansi256=function(e){const t=e[0],s=e[1],n=e[2];return t===s&&s===n?t<8?16:t>248?231:Math.round((t-8)/247*24)+232:16+36*Math.round(t/255*5)+6*Math.round(s/255*5)+Math.round(n/255*5)};c.ansi16.rgb=function(e){let t=e%10;if(t===0||t===7)return e>50&&(t+=3.5),t=t/10.5*255,[t,t,t];const s=(~~(e>50)+1)*.5,n=(t&1)*s*255,r=(t>>1&1)*s*255,a=(t>>2&1)*s*255;return[n,r,a]};c.ansi256.rgb=function(e){if(e>=232){const a=(e-232)*10+8;return[a,a,a]}e-=16;let t;const s=Math.floor(e/36)/5*255,n=Math.floor((t=e%36)/6)/5*255,r=t%6/5*255;return[s,n,r]};c.rgb.hex=function(e){const s=(((Math.round(e[0])&255)<<16)+((Math.round(e[1])&255)<<8)+(Math.round(e[2])&255)).toString(16).toUpperCase();return"000000".substring(s.length)+s};c.hex.rgb=function(e){const t=e.toString(16).match(/[a-f0-9]{6}|[a-f0-9]{3}/i);if(!t)return[0,0,0];let s=t[0];t[0].length===3&&(s=s.split("").map(i=>i+i).join(""));const n=parseInt(s,16),r=n>>16&255,a=n>>8&255,o=n&255;return[r,a,o]};c.rgb.hcg=function(e){const t=e[0]/255,s=e[1]/255,n=e[2]/255,r=Math.max(Math.max(t,s),n),a=Math.min(Math.min(t,s),n),o=r-a;let i,l;return o<1?i=a/(1-o):i=0,o<=0?l=0:r===t?l=(s-n)/o%6:r===s?l=2+(n-t)/o:l=4+(t-s)/o,l/=6,l%=1,[l*360,o*100,i*100]};c.hsl.hcg=function(e){const t=e[1]/100,s=e[2]/100,n=s<.5?2*t*s:2*t*(1-s);let r=0;return n<1&&(r=(s-.5*n)/(1-n)),[e[0],n*100,r*100]};c.hsv.hcg=function(e){const t=e[1]/100,s=e[2]/100,n=t*s;let r=0;return n<1&&(r=(s-n)/(1-n)),[e[0],n*100,r*100]};c.hcg.rgb=function(e){const t=e[0]/360,s=e[1]/100,n=e[2]/100;if(s===0)return[n*255,n*255,n*255];const r=[0,0,0],a=t%1*6,o=a%1,i=1-o;let l=0;switch(Math.floor(a)){case 0:r[0]=1,r[1]=o,r[2]=0;break;case 1:r[0]=i,r[1]=1,r[2]=0;break;case 2:r[0]=0,r[1]=1,r[2]=o;break;case 3:r[0]=0,r[1]=i,r[2]=1;break;case 4:r[0]=o,r[1]=0,r[2]=1;break;default:r[0]=1,r[1]=0,r[2]=i}return l=(1-s)*n,[(s*r[0]+l)*255,(s*r[1]+l)*255,(s*r[2]+l)*255]};c.hcg.hsv=function(e){const t=e[1]/100,s=e[2]/100,n=t+s*(1-t);let r=0;return n>0&&(r=t/n),[e[0],r*100,n*100]};c.hcg.hsl=function(e){const t=e[1]/100,n=e[2]/100*(1-t)+.5*t;let r=0;return n>0&&n<.5?r=t/(2*n):n>=.5&&n<1&&(r=t/(2*(1-n))),[e[0],r*100,n*100]};c.hcg.hwb=function(e){const t=e[1]/100,s=e[2]/100,n=t+s*(1-t);return[e[0],(n-t)*100,(1-n)*100]};c.hwb.hcg=function(e){const t=e[1]/100,n=1-e[2]/100,r=n-t;let a=0;return r<1&&(a=(n-r)/(1-r)),[e[0],r*100,a*100]};c.apple.rgb=function(e){return[e[0]/65535*255,e[1]/65535*255,e[2]/65535*255]};c.rgb.apple=function(e){return[e[0]/255*65535,e[1]/255*65535,e[2]/255*65535]};c.gray.rgb=function(e){return[e[0]/100*255,e[0]/100*255,e[0]/100*255]};c.gray.hsl=function(e){return[0,0,e[0]]};c.gray.hsv=c.gray.hsl;c.gray.hwb=function(e){return[0,100,e[0]]};c.gray.cmyk=function(e){return[0,0,0,e[0]]};c.gray.lab=function(e){return[e[0],0,0]};c.gray.hex=function(e){const t=Math.round(e[0]/100*255)&255,n=((t<<16)+(t<<8)+t).toString(16).toUpperCase();return"000000".substring(n.length)+n};c.rgb.gray=function(e){return[(e[0]+e[1]+e[2])/3/255*100]};const P=Z;function ce(){const e={},t=Object.keys(P);for(let s=t.length,n=0;n1&&(s=n),e(s))};return"conversion"in e&&(t.conversion=e.conversion),t}function pe(e){const t=function(...s){const n=s[0];if(n==null)return n;n.length>1&&(s=n);const r=e(s);if(typeof r=="object")for(let a=r.length,o=0;o{M[e]={},Object.defineProperty(M[e],"channels",{value:B[e].channels}),Object.defineProperty(M[e],"labels",{value:B[e].labels});const t=ge(e);Object.keys(t).forEach(n=>{const r=t[n];M[e][n]=pe(r),M[e][n].raw=me(r)})});var ye=M;const y=D(ye);var ve=oe,ke=function(){return ve.Date.now()},xe=ke,we=/\s/;function $e(e){for(var t=e.length;t--&&we.test(e.charAt(t)););return t}var Me=$e,Ee=Me,Ce=/^\s+/;function Se(e){return e&&e.slice(0,Ee(e)+1).replace(Ce,"")}var Oe=Se,Ie=Oe,W=K,Fe=Q,N=NaN,_e=/^[-+]0x[0-9a-f]+$/i,je=/^0b[01]+$/i,Re=/^0o[0-7]+$/i,Pe=parseInt;function Te(e){if(typeof e=="number")return e;if(Fe(e))return N;if(W(e)){var t=typeof e.valueOf=="function"?e.valueOf():e;e=W(t)?t+"":t}if(typeof e!="string")return e===0?e:+e;e=Ie(e);var s=je.test(e);return s||Re.test(e)?Pe(e.slice(2),s?2:8):_e.test(e)?N:+e}var ze=Te,Le=K,L=xe,X=ze,Be="Expected a function",qe=Math.max,He=Math.min;function We(e,t,s){var n,r,a,o,i,l,u=0,d=!1,h=!1,f=!0;if(typeof e!="function")throw new TypeError(Be);t=X(t)||0,Le(s)&&(d=!!s.leading,h="maxWait"in s,a=h?qe(X(s.maxWait)||0,t):a,f="trailing"in s?!!s.trailing:f);function b(g){var k=n,S=r;return n=r=void 0,u=g,o=e.apply(S,k),o}function z(g){return u=g,i=setTimeout(w,t),d?b(g):o}function I(g){var k=g-l,S=g-u,H=t-k;return h?He(H,a-S):H}function F(g){var k=g-l,S=g-u;return l===void 0||k>=t||k<0||h&&S>=a}function w(){var g=L();if(F(g))return $(g);i=setTimeout(w,I(g))}function $(g){return i=void 0,f&&n?b(g):(n=r=void 0,o)}function _(){i!==void 0&&clearTimeout(i),u=0,n=l=r=i=void 0}function m(){return i===void 0?o:$(L())}function C(){var g=L(),k=F(g);if(n=arguments,r=this,l=g,k){if(i===void 0)return z(l);if(h)return clearTimeout(i),i=setTimeout(w,t),b(l)}return i===void 0&&(i=setTimeout(w,t)),o}return C.cancel=_,C.flush=m,C}var Ne=We;const Xe=D(Ne);var Ge=x.div({position:"relative",maxWidth:250,'&[aria-readonly="true"]':{opacity:.5}}),Ve=x(A)({position:"absolute",zIndex:1,top:4,left:4,"[aria-readonly=true] &":{cursor:"not-allowed"}}),Ae=x.div({width:200,margin:5,".react-colorful__saturation":{borderRadius:"4px 4px 0 0"},".react-colorful__hue":{boxShadow:"inset 0 0 0 1px rgb(0 0 0 / 5%)"},".react-colorful__last-control":{borderRadius:"0 0 4px 4px"}}),De=x(Y)(({theme:e})=>({fontFamily:e.typography.fonts.base})),Ke=x.div({display:"grid",gridTemplateColumns:"repeat(9, 16px)",gap:6,padding:3,marginTop:5,width:200}),Ue=x.div(({theme:e,active:t})=>({width:16,height:16,boxShadow:t?`${e.appBorderColor} 0 0 0 1px inset, ${e.textMutedColor}50 0 0 0 4px`:`${e.appBorderColor} 0 0 0 1px inset`,borderRadius:e.appBorderRadius})),Ze=`url('data:image/svg+xml;charset=utf-8,')`,G=({value:e,style:t,...s})=>{let n=`linear-gradient(${e}, ${e}), ${Ze}, linear-gradient(#fff, #fff)`;return p.createElement(Ue,{...s,style:{...t,backgroundImage:n}})},Je=x(ee.Input)(({theme:e,readOnly:t})=>({width:"100%",paddingLeft:30,paddingRight:30,boxSizing:"border-box",fontFamily:e.typography.fonts.base})),Qe=x(te)(({theme:e})=>({position:"absolute",zIndex:1,top:6,right:7,width:20,height:20,padding:4,boxSizing:"border-box",cursor:"pointer",color:e.input.color})),J=(e=>(e.RGB="rgb",e.HSL="hsl",e.HEX="hex",e))(J||{}),j=Object.values(J),Ye=/\(([0-9]+),\s*([0-9]+)%?,\s*([0-9]+)%?,?\s*([0-9.]+)?\)/,et=/^\s*rgba?\(([0-9]+),\s*([0-9]+),\s*([0-9]+),?\s*([0-9.]+)?\)\s*$/i,tt=/^\s*hsla?\(([0-9]+),\s*([0-9]+)%,\s*([0-9]+)%,?\s*([0-9.]+)?\)\s*$/i,q=/^\s*#?([0-9a-f]{3}|[0-9a-f]{6})\s*$/i,nt=/^\s*#?([0-9a-f]{3})\s*$/i,rt={hex:re,rgb:se,hsl:ae},R={hex:"transparent",rgb:"rgba(0, 0, 0, 0)",hsl:"hsla(0, 0%, 0%, 0)"},V=e=>{let t=e==null?void 0:e.match(Ye);if(!t)return[0,0,0,1];let[,s,n,r,a=1]=t;return[s,n,r,a].map(Number)},E=e=>{if(!e)return;let t=!0;if(et.test(e)){let[o,i,l,u]=V(e),[d,h,f]=y.rgb.hsl([o,i,l])||[0,0,0];return{valid:t,value:e,keyword:y.rgb.keyword([o,i,l]),colorSpace:"rgb",rgb:e,hsl:`hsla(${d}, ${h}%, ${f}%, ${u})`,hex:`#${y.rgb.hex([o,i,l]).toLowerCase()}`}}if(tt.test(e)){let[o,i,l,u]=V(e),[d,h,f]=y.hsl.rgb([o,i,l])||[0,0,0];return{valid:t,value:e,keyword:y.hsl.keyword([o,i,l]),colorSpace:"hsl",rgb:`rgba(${d}, ${h}, ${f}, ${u})`,hsl:e,hex:`#${y.hsl.hex([o,i,l]).toLowerCase()}`}}let s=e.replace("#",""),n=y.keyword.rgb(s)||y.hex.rgb(s),r=y.rgb.hsl(n),a=e;if(/[^#a-f0-9]/i.test(e)?a=s:q.test(e)&&(a=`#${s}`),a.startsWith("#"))t=q.test(a);else try{y.keyword.hex(a)}catch{t=!1}return{valid:t,value:a,keyword:y.rgb.keyword(n),colorSpace:"hex",rgb:`rgba(${n[0]}, ${n[1]}, ${n[2]}, 1)`,hsl:`hsla(${r[0]}, ${r[1]}%, ${r[2]}%, 1)`,hex:a}},st=(e,t,s)=>{if(!e||!(t!=null&&t.valid))return R[s];if(s!=="hex")return(t==null?void 0:t[s])||R[s];if(!t.hex.startsWith("#"))try{return`#${y.keyword.hex(t.hex)}`}catch{return R.hex}let n=t.hex.match(nt);if(!n)return q.test(t.hex)?t.hex:R.hex;let[r,a,o]=n[1].split("");return`#${r}${r}${a}${a}${o}${o}`},at=(e,t)=>{let[s,n]=v.useState(e||""),[r,a]=v.useState(()=>E(s)),[o,i]=v.useState((r==null?void 0:r.colorSpace)||"hex");v.useEffect(()=>{let h=e||"",f=E(h);n(h),a(f),i((f==null?void 0:f.colorSpace)||"hex")},[e]);let l=v.useMemo(()=>st(s,r,o).toLowerCase(),[s,r,o]),u=v.useCallback(h=>{let f=E(h),b=(f==null?void 0:f.value)||h||"";n(b),b===""&&(a(void 0),t(void 0)),f&&(a(f),i(f.colorSpace),t(f.value))},[t]),d=v.useCallback(()=>{let h=j.indexOf(o)+1;h>=j.length&&(h=0),i(j[h]);let f=(r==null?void 0:r[j[h]])||"";n(f),t(f)},[r,o,t]);return{value:s,realValue:l,updateValue:u,color:r,colorSpace:o,cycleColorSpace:d}},T=e=>e.replace(/\s*/,"").toLowerCase(),ot=(e,t,s)=>{let[n,r]=v.useState(t!=null&&t.valid?[t]:[]);v.useEffect(()=>{t===void 0&&r([])},[t]);let a=v.useMemo(()=>(e||[]).map(i=>typeof i=="string"?E(i):i.title?{...E(i.color),keyword:i.title}:E(i.color)).concat(n).filter(Boolean).slice(-27),[e,n]),o=v.useCallback(i=>{i!=null&&i.valid&&(a.some(l=>T(l[s])===T(i[s]))||r(l=>l.concat(i)))},[s,a]);return{presets:a,addPreset:o}},it=({name:e,value:t,onChange:s,onFocus:n,onBlur:r,presetColors:a,startOpen:o=!1,argType:i})=>{var _;let l=v.useCallback(Xe(s,200),[s]),{value:u,realValue:d,updateValue:h,color:f,colorSpace:b,cycleColorSpace:z}=at(t,l),{presets:I,addPreset:F}=ot(a,f,b),w=rt[b],$=!!((_=i==null?void 0:i.table)!=null&&_.readonly);return p.createElement(Ge,{"aria-readonly":$},p.createElement(Ve,{startOpen:o,trigger:$?[null]:void 0,closeOnOutsideClick:!0,onVisibleChange:()=>F(f),tooltip:p.createElement(Ae,null,p.createElement(w,{color:d==="transparent"?"#000000":d,onChange:h,onFocus:n,onBlur:r}),I.length>0&&p.createElement(Ke,null,I.map((m,C)=>p.createElement(A,{key:`${m.value}-${C}`,hasChrome:!1,tooltip:p.createElement(De,{note:m.keyword||m.value})},p.createElement(G,{value:m[b],active:f&&T(m[b])===T(f[b]),onClick:()=>h(m.value)})))))},p.createElement(G,{value:d,style:{margin:4}})),p.createElement(Je,{id:ne(e),value:u,onChange:m=>h(m.target.value),onFocus:m=>m.target.select(),readOnly:$,placeholder:"Choose color..."}),u?p.createElement(Qe,{onClick:z}):null)},yt=it;export{it as ColorControl,yt as default}; diff --git a/assets/ColorInput-BCTm_2fB.js b/assets/ColorInput-BCTm_2fB.js new file mode 100644 index 0000000..53751af --- /dev/null +++ b/assets/ColorInput-BCTm_2fB.js @@ -0,0 +1 @@ +import{j as a}from"./jsx-runtime-BlAj40OV.js";import{r as p}from"./index-Cs7sjTYM.js";import{P as k}from"./PopupArrow-BfkLmXfx.js";import{T as v}from"./TextInputWrapper-_VuV0eOO.js";import{c as m}from"./index-Bl6ORisp.js";import{D as y,u as b}from"./Dropdown-D3yVVs0w.js";import{O as S}from"./index-B_ZOYESs.js";import{c as N}from"./core-Drm9bBME.js";const j="_picker_yqwd0_1",x="_swatch_yqwd0_7",I="_activeSwatch_yqwd0_19",q="_inactiveSwatch_yqwd0_25",P="_errorSwatch_yqwd0_30",R="_swatchInner_yqwd0_34",B="_activePickerSwatch_yqwd0_41",E="_dropdown_yqwd0_45",T="_popover_yqwd0_49",C="_pickerSwatches_yqwd0_55",Q="_input_yqwd0_68",G="_label_yqwd0_91",s={picker:j,swatch:x,activeSwatch:I,inactiveSwatch:q,errorSwatch:P,swatchInner:R,activePickerSwatch:B,dropdown:E,popover:T,pickerSwatches:C,input:Q,label:G},O=e=>e.substring(1,3)==="00"&&e.length===9?"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAABlBMVEX////Z5exdL3Q7AAAAGklEQVQY02NgAAFGRkaa0gzo4gzo6hgGiTsANBAAYf1ZdsIAAAAASUVORK5CYII=')":e;function c(e){const t=N[e];return typeof t!="object"&&typeof t!="number"?t:"#"}const A=p.forwardRef(function({onClick:t,color:r,triggerSwatch:i=!1,className:n,"aria-describedby":l,...o},u){return a.jsxs("button",{...o,className:m(s.swatch,n,{[s.activeSwatch]:i}),onClick:t,ref:u,type:"button","aria-roledescription":i?"colour well":"button","aria-describedby":l,children:[a.jsx("div",{style:{background:O(r)},className:s.swatchInner}),a.jsx("span",{className:"sr-only",children:r})]})});function V({color:e,presetColors:t,onChange:r,hexInputLabel:i,label:n,id:l,classNames:o,error:u,...w}){const f=p.useId(),h=l||w.name||f,g=p.useRef(null),_=p.useRef(null);return a.jsx(v,{name:w.name,id:h,label:n,error:u,className:m(s.picker,o==null?void 0:o.label),errorDisplay:"border",children:a.jsx(y,{className:s.dropdown,trigger:a.jsx(A,{...w,"aria-describedby":`label-${h}`,id:h,color:e,ref:_,triggerSwatch:!0,className:m(o==null?void 0:o.trigger,{[s.errorSwatch]:u})}),Anchor:k,children:a.jsx("div",{className:s.popover,ref:g,children:a.jsxs("div",{className:s.pickerSwatches,children:[t.map(d=>p.createElement(L,{...w,key:d,color:d,onClick:()=>{r(d)},className:m({[s.activeSwatch]:d===e,[s.inactiveSwatch]:d!==e})})),a.jsx(U,{id:h,color:e,onChange:r,alpha:!0,prefixed:!0,className:s.input})]})})})})}function L({onClick:e,...t}){const{hidePopup:r}=b(),i=p.useCallback(n=>{r(),e==null||e(n)},[e,r]);return a.jsx(A,{...t,onClick:i})}function U({onKeyDown:e,...t}){const{hidePopup:r}=b(),i=p.useCallback(n=>{e==null||e(n),n.key==="Enter"&&r()},[e,r]);return a.jsx(S,{...t,onKeyDown:i})}function W({onColorChange:e,transparentOption:t=!1,value:r,hexInputLabel:i,label:n,...l}){const o=[c("betterplace-color-light"),c("betterplace-color-green-500"),c("betterplace-color-green-700"),c("betterplace-color-green-900"),c("betterplace-color-yellow-400"),c("betterplace-me-color-orange-500"),c("betterplace-color-red-700"),c("betterplace-color-red-900"),c("betterplace-color-purple-400"),c("betterplace-color-purple-700"),c("betterplace-color-gray-500"),c("betterplace-color-gray-700"),c("betterplace-color-gray-900")].filter(Boolean);return t&&o.push("#00000000"),a.jsx(V,{...l,color:`#${r==="transparent"?"00000000":r}`,presetColors:o,onChange:e,hexInputLabel:i,label:n})}export{W as C}; diff --git a/assets/ColorInput-BYbJISRL.css b/assets/ColorInput-BYbJISRL.css new file mode 100644 index 0000000..b1f8a83 --- /dev/null +++ b/assets/ColorInput-BYbJISRL.css @@ -0,0 +1 @@ +._picker_yqwd0_1{position:relative;width:-moz-max-content;width:max-content;height:-moz-min-content;height:min-content}._swatch_yqwd0_7{cursor:pointer;border-radius:var(--betterplace-border-radius-200);height:3.125rem;width:3.125rem}._swatch_yqwd0_7:focus-visible{outline:var(--betterplace-border-focused);outline-offset:var(--betterplace-spacing-50)}._activeSwatch_yqwd0_19{padding:var(--betterplace-spacing-100);border:var(--betterplace-border-default);background-color:var(--betterplace-color-bg-light)}._inactiveSwatch_yqwd0_25{border:none;padding:0}._errorSwatch_yqwd0_30{border:var(--betterplace-border-danger)}._swatchInner_yqwd0_34{border:var(--betterplace-border-light);border-radius:var(--betterplace-border-radius-200);width:100%;height:100%}._activePickerSwatch_yqwd0_41{border:3px solid white}._dropdown_yqwd0_45{margin:1rem 0!important}._popover_yqwd0_49{background-color:#fff;margin-block-start:var(--betterplace-spacing-250);transform:translateZ(0)}._pickerSwatches_yqwd0_55{display:grid;grid-template-columns:repeat(4,1fr);padding:var(--betterplace-spacing-300);gap:var(--betterplace-spacing-200);place-items:center center}@media screen and (min-width: 451px){._pickerSwatches_yqwd0_55{grid-template-columns:repeat(4,1fr)}}._input_yqwd0_68{max-width:100%;grid-column:span 3;padding:var(--betterplace-spacing-250) var(--betterplace-spacing-300);background:var(--betterplace-color-bg-light);border:var(--betterplace-border-default);border-radius:var(--betterplace-border-radius-200);color:var(--betterplace-color-fg-content-primary);font:var(--betterplace-typography-functional-text-md-default);block-size:70%}@media (hover: hover){._input_yqwd0_68:hover{box-shadow:var(--betterplace-shadow-floating-low)}}._input_yqwd0_68:focus-visible{outline:var(--betterplace-border-focused);outline-offset:var(--betterplace-spacing-50)}._label_yqwd0_91{display:block;color:var(--betterplace-color-fg-content-primary);font:var(--betterplace-typography-label-sm);padding-block-end:var(--betterplace-spacing-100)} diff --git a/assets/ColorInput.stories-CEJb1Gdh.js b/assets/ColorInput.stories-CEJb1Gdh.js new file mode 100644 index 0000000..b8a3540 --- /dev/null +++ b/assets/ColorInput.stories-CEJb1Gdh.js @@ -0,0 +1,7 @@ +import{j as r}from"./jsx-runtime-BlAj40OV.js";import{C as m}from"./ColorInput-BCTm_2fB.js";import{r as i}from"./index-Cs7sjTYM.js";import"./PopupArrow-BfkLmXfx.js";import"./index-Bl6ORisp.js";import"./_commonjsHelpers-BosuxZz1.js";import"./Popup-CReyU1RW.js";import"./PopupContext-CCyEydDt.js";import"./index-BU4L-DQy.js";import"./TextInputWrapper-_VuV0eOO.js";import"./Dropdown-D3yVVs0w.js";import"./Select.module-VGDajZ98.js";import"./Icon-DX5oPjN8.js";import"./index-B_ZOYESs.js";import"./core-Drm9bBME.js";const c=a=>{const[p,s]=i.useState("00000000");return r.jsx("div",{style:{height:"600px"},children:r.jsx(m,{...a,value:p,onColorChange:l=>s(l.replace("#",""))})})},D={title:"Components/ColorInput",component:c,parameters:{onColorChange:{},transparentOption:{table:{}},value:{},label:{}}},o={args:{onColorChange:()=>{},transparentOption:!0,label:"Something"}};var t,e,n;o.parameters={...o.parameters,docs:{...(t=o.parameters)==null?void 0:t.docs,source:{originalSource:`{ + args: { + onColorChange: () => {}, + transparentOption: true, + label: 'Something' + } +}`,...(n=(e=o.parameters)==null?void 0:e.docs)==null?void 0:n.source}}};const y=["Default"];export{o as Default,y as __namedExportsOrder,D as default}; diff --git a/assets/ColorPreview-BwjA73zZ.js b/assets/ColorPreview-BwjA73zZ.js new file mode 100644 index 0000000..32eff58 --- /dev/null +++ b/assets/ColorPreview-BwjA73zZ.js @@ -0,0 +1 @@ +import{j as r}from"./jsx-runtime-BlAj40OV.js";const t=({token:e})=>r.jsx("div",{style:{background:`var(--${e.name})`,blockSize:"var(--betterplace-sizing-800)",inlineSize:"var(--betterplace-sizing-800)"}});export{t as C}; diff --git a/assets/CopyText-DLuEHwkS.css b/assets/CopyText-DLuEHwkS.css new file mode 100644 index 0000000..9ed7d65 --- /dev/null +++ b/assets/CopyText-DLuEHwkS.css @@ -0,0 +1 @@ +._copyTextContainer_190y6_2 button{align-self:flex-end;height:3.125rem}._copyTextInput_190y6_7{text-overflow:ellipsis}@media screen and (max-width: 450px){._copyTextContainer_190y6_2{width:100%}._copyTextContainer_190y6_2 div{flex:1}} diff --git a/assets/CopyText.stories-CVIGwHYL.js b/assets/CopyText.stories-CVIGwHYL.js new file mode 100644 index 0000000..f38ba02 --- /dev/null +++ b/assets/CopyText.stories-CVIGwHYL.js @@ -0,0 +1,9 @@ +import{j as r}from"./jsx-runtime-BlAj40OV.js";import{c as g}from"./index-Bl6ORisp.js";import{L as w}from"./LayoutCluster-BkRwq4A8.js";import{T}from"./TextInput-CJfcBDcM.js";import{r as i}from"./index-Cs7sjTYM.js";import{C as v}from"./ClientButton-DhJqhttM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./TextInputWrapper-_VuV0eOO.js";import"./Button-CmRA-hR5.js";import"./preventDefault-M1KdZT7V.js";async function C(e){if(!e)return!1;await navigator.clipboard.writeText(e)}const _="_copyTextContainer_190y6_2",L="_copyTextInput_190y6_7",l={copyTextContainer:_,copyTextInput:L};function j({textToCopy:e,showPreview:d=!1,previewLabel:b,previewHint:x,children:a,onTextCopied:t,onError:o,className:f}){const c=i.useCallback(()=>{e&&C(e).then(()=>t==null?void 0:t(e)).catch(h=>o==null?void 0:o(h))},[e,t,o]),p=i.useMemo(()=>a(c),[a,c]);return d?r.jsxs(w,{className:g(l.copyTextContainer,f),children:[r.jsx(T,{className:l.copyTextInput,readOnly:!0,label:b,description:x,value:e}),p]}):p}const s={button:e=>r.jsx(v,{onClick:e,children:"Copy URL"})},S={title:"Components/CopyText",component:j,parameters:{docs:{description:{component:"CopyText component."}}},argTypes:{children:{description:"The actual component to be clicked in order to copy to the clipboard.",options:Object.keys(s),mapping:s,control:{type:"select",labels:{button:"button"}}},showPreview:{control:"boolean",description:"Whether or not there should be a readonly text input previewing the text to be copied"}}},n={args:{textToCopy:"https://streambot.example.com/livewidgets",children:s.button,showPreview:!0,previewLabel:"URL",onError:()=>console.log("copying failed")}};var m,u,y;n.parameters={...n.parameters,docs:{...(m=n.parameters)==null?void 0:m.docs,source:{originalSource:`{ + args: { + textToCopy: 'https://streambot.example.com/livewidgets', + children: labelMapping.button, + showPreview: true, + previewLabel: 'URL', + onError: () => console.log('copying failed') + } +}`,...(y=(u=n.parameters)==null?void 0:u.docs)==null?void 0:y.source}}};const W=["Default"];export{n as Default,W as __namedExportsOrder,S as default}; diff --git a/assets/DimensionPreview-BC7yfB8E.js b/assets/DimensionPreview-BC7yfB8E.js new file mode 100644 index 0000000..3ef9022 --- /dev/null +++ b/assets/DimensionPreview-BC7yfB8E.js @@ -0,0 +1 @@ +import{j as r}from"./jsx-runtime-BlAj40OV.js";const t=({token:e})=>r.jsx("div",{style:{background:"var(--betterplace-color-purple-400)",blockSize:"var(--betterplace-sizing-400)",inlineSize:`var(--${e.name})`}});export{t as D}; diff --git a/assets/DocsRenderer-PKQXORMH-DvpNRBJU.js b/assets/DocsRenderer-PKQXORMH-DvpNRBJU.js new file mode 100644 index 0000000..3a69df4 --- /dev/null +++ b/assets/DocsRenderer-PKQXORMH-DvpNRBJU.js @@ -0,0 +1,2 @@ +const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["./index-BI1Biiay.js","./index-Cs7sjTYM.js","./_commonjsHelpers-BosuxZz1.js"])))=>i.map(i=>d[i]); +import{_ as p}from"./iframe-DS2PgOfP.js";import{R as e,r as c}from"./index-Cs7sjTYM.js";import{r as u,u as l}from"./react-18-B8QpLNLP.js";import{af as h,ag as E,ah as d,ai as x}from"./index-DNzjNleM.js";import"../sb-preview/runtime.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-BU4L-DQy.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";var _={code:h,a:E,...d},D=class extends c.Component{constructor(){super(...arguments),this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(t){let{showException:r}=this.props;r(t)}render(){let{hasError:t}=this.state,{children:r}=this.props;return t?null:e.createElement(e.Fragment,null,r)}},O=class{constructor(){this.render=async(t,r,n)=>{let s={..._,...r==null?void 0:r.components},a=x;return new Promise((i,m)=>{p(async()=>{const{MDXProvider:o}=await import("./index-BI1Biiay.js");return{MDXProvider:o}},__vite__mapDeps([0,1,2]),import.meta.url).then(({MDXProvider:o})=>u(e.createElement(D,{showException:m,key:Math.random()},e.createElement(o,{components:s},e.createElement(a,{context:t,docsParameter:r}))),n)).then(()=>i())})},this.unmount=t=>{l(t)}}};export{O as DocsRenderer,_ as defaultComponents}; diff --git a/assets/Dropdown-5xcC1ZkP.css b/assets/Dropdown-5xcC1ZkP.css new file mode 100644 index 0000000..e0774fe --- /dev/null +++ b/assets/Dropdown-5xcC1ZkP.css @@ -0,0 +1 @@ +._dropdownContent_1n9sv_1{padding:0;fill:var(--betterplace-color-bg-light);background-color:var(--betterplace-color-bg-light);border:var(--betterplace-border-light);border-radius:var(--betterplace-border-radius-200);box-shadow:var(--betterplace-shadow-floating-low);border-top-left-radius:0;border-top-right-radius:0;max-width:17.25rem;margin:0}._dropdownTriggerButton_1n9sv_14{inline-size:initial;display:flex;justify-content:space-between}._dropdownTriggerButton_1n9sv_14 svg{flex-shrink:0;min-width:-moz-min-content;min-width:min-content;margin-inline-start:var(--betterplace-spacing-200)}._scaleTransition_1n9sv_26{transition:opacity .2s ease-in-out,clip-path .2s linear;opacity:0;clip-path:inset(-1rem -1rem 100% 0)}._scaleTransitionOpen_1n9sv_34{opacity:1;clip-path:inset(-1rem)}._dropdownMenu_1n9sv_39{display:flex;flex-direction:column;width:100%;margin:0;padding:0;align-items:stretch;list-style:none;text-align:left}._dropdownMenuSeparator_1n9sv_50{height:0;max-height:0;flex:initial;padding:0;margin:var(--betterplace-spacing-100);border-bottom:var(--betterplace-border-light)}._dropdownMenuItem_1n9sv_59{padding:var(--betterplace-spacing-200) 0;background-color:var(--betterplace-color-bg-light);transition:background-color .1s linear}._dropdownMenuItem_1n9sv_59:focus-within,._dropdownMenuItem_1n9sv_59:hover{background-color:var(--betterplace-color-bg-primary)}._dropdownMenuItem_1n9sv_59>*{padding:0 var(--betterplace-spacing-300);text-decoration:none!important;display:inline-block;width:100%} diff --git a/assets/Dropdown-D3yVVs0w.js b/assets/Dropdown-D3yVVs0w.js new file mode 100644 index 0000000..b460a4b --- /dev/null +++ b/assets/Dropdown-D3yVVs0w.js @@ -0,0 +1 @@ +import{j as l}from"./jsx-runtime-BlAj40OV.js";import{c as g}from"./index-Bl6ORisp.js";import{s as x}from"./Select.module-VGDajZ98.js";import{K as c,P as m,a as h,A as M}from"./Popup-CReyU1RW.js";import{f as v,a as L,b as y,c as C,u as O,t as S,d as D,e as j}from"./PopupContext-CCyEydDt.js";import{r as f}from"./index-Cs7sjTYM.js";import{I as F}from"./Icon-DX5oPjN8.js";const I="_dropdownContent_1n9sv_1",N="_dropdownTriggerButton_1n9sv_14",K="_scaleTransition_1n9sv_26",B="_scaleTransitionOpen_1n9sv_34",H="_dropdownMenu_1n9sv_39",U="_dropdownMenuSeparator_1n9sv_50",A="_dropdownMenuItem_1n9sv_59",w={dropdownContent:I,dropdownTriggerButton:N,scaleTransition:K,scaleTransitionOpen:B,dropdownMenu:H,dropdownMenuSeparator:U,dropdownMenuItem:A},G=["click","keypress"];function X({children:p,style:e,className:s,id:a}){return l.jsxs("button",{id:a,style:e,className:g(x.selectContainer,x.select,w.dropdownTriggerButton,s),type:"button",children:[p,l.jsx(F,{name:"arrowDown"})]})}function Z({children:p,className:e}){return l.jsx("ul",{className:g(w.dropdownMenu,e),children:p})}function nn({children:p,style:e,className:s}){const a=f.useRef(null),{preferredPopupPosition:u,hidePopup:i,parentContext:r,spyRef:o}=E(),t=f.useCallback(n=>{var T,k;const d=r&&u,_=d&&b[d].close;if(n.key===c.Down||n.key===c.Up){n.preventDefault();const P=n.key===c.Up?v(a.current):L(a.current);P==null||P.focus();return}n.key===_&&(n.preventDefault(),(k=y((T=o==null?void 0:o.current)==null?void 0:T.nextElementSibling))==null||k.focus(),i()),n.key===c.Enter&&n.target instanceof HTMLElement&&"click"in n.target&&n.target.click()},[i,r,u,o]);return f.useEffect(()=>{const n=C(a.current);if(n)return n.addEventListener("keydown",t),n.addEventListener("click",i),()=>{n.removeEventListener("keydown",t),n.removeEventListener("click",i)}},[i,t]),l.jsx("li",{ref:a,style:e,className:g(w.dropdownMenuItem,s),children:p})}function en(){return l.jsx("li",{className:w.dropdownMenuSeparator})}const b={[m.BOTTOM]:{open:c.Down,close:c.Down},[m.TOP]:{open:c.Up,close:c.Down},[m.RIGHT]:{open:c.Right,close:c.Left},[m.LEFT]:{open:c.Left,close:c.Right}};function W({children:p}){const{spyRef:e,popupRef:s,showPopup:a,preferredPopupPosition:u}=E(),i=f.useCallback(r=>{const o=u??m.BOTTOM,t=b[o].open;r.key===t&&(r.preventDefault(),a(),S().then(()=>{var d;let n=C(s==null?void 0:s.current);if(n){n.focus();return}r.key===c.Tab&&(n=D((d=e==null?void 0:e.current)==null?void 0:d.nextElementSibling),n==null||n.focus())}))},[s,u,a,e]);return f.useEffect(()=>{var o;const r=(o=e==null?void 0:e.current)==null?void 0:o.nextElementSibling;if(r)return r.addEventListener("keydown",i),()=>r.removeEventListener("keydown",i)},[i,e]),p}function J({children:p}){const{spyRef:e,popupRef:s,hidePopup:a,open:u}=E(),i=f.useCallback(o=>{var t,n;o.key!==c.Tab||!o.shiftKey||(o.preventDefault(),(n=y((t=e==null?void 0:e.current)==null?void 0:t.nextElementSibling))==null||n.focus(),a())},[e,a]),r=f.useCallback(o=>{var n;if(o.key!==c.Tab||o.shiftKey)return;o.preventDefault();const t=D((n=e==null?void 0:e.current)==null?void 0:n.nextElementSibling);t==null||t.focus()},[e]);return f.useEffect(()=>{const o=s==null?void 0:s.current;if(!o)return;const t=j(o);if(!t||!t.length)return;const n=t.item(0),d=t.item(t.length-1);return n.addEventListener("keydown",i),d.addEventListener("keydown",r),()=>{n.removeEventListener("keydown",i),d.removeEventListener("keydown",r)}},[i,r,e,s,p,u]),p}function on({trigger:p,children:e,className:s,alignContent:a=M.JUSTIFY,wrapperClassName:u,anchorClassName:i,preferredPopupPosition:r,Anchor:o}){const{parentContext:t}=E(),n=r??(t?t.preferredPopupPosition??m.RIGHT:m.BOTTOM);return l.jsx(h,{content:l.jsx(J,{children:e}),contentClassName:g(w.dropdownContent,s),contentWrapperClassName:g(w.scaleTransition,u),popupOpenWrapperClassName:w.scaleTransitionOpen,triggerEvents:G,preferredPopupPosition:n,alignPopup:a,anchorClassName:i,Anchor:o,children:l.jsx(W,{children:p})})}function E(){const{showPopup:p,hidePopup:e,togglePopup:s,spyRef:a,popupRef:u,inDOM:i,parentContext:r,alignPopup:o,preferredPopupPosition:t}=O(),n=r&&r.initialised?r:void 0;return{open:i,showPopup:p,hidePopup:e,togglePopup:s,spyRef:a,popupRef:u,parentContext:n,alignPopup:o,preferredPopupPosition:t}}export{on as D,X as a,Z as b,nn as c,en as d,E as u}; diff --git a/assets/Dropdown.stories-CK1uai_c.js b/assets/Dropdown.stories-CK1uai_c.js new file mode 100644 index 0000000..64e45b8 --- /dev/null +++ b/assets/Dropdown.stories-CK1uai_c.js @@ -0,0 +1,49 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{C as c}from"./ClientButton-DhJqhttM.js";import{D as s,a as h,b as i,c as r,d as x}from"./Dropdown-D3yVVs0w.js";import{T as n}from"./TextLink-BKWIXXPv.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./Button-CmRA-hR5.js";import"./index-Bl6ORisp.js";import"./preventDefault-M1KdZT7V.js";import"./Select.module-VGDajZ98.js";import"./Popup-CReyU1RW.js";import"./PopupContext-CCyEydDt.js";import"./index-BU4L-DQy.js";import"./Icon-DX5oPjN8.js";function w(a){return e.jsx("div",{style:{height:"200px",padding:"var(--betterplace-spacing-400)",containerType:"inline-size",display:"flex",justifyContent:"center",alignItems:"center",position:"relative"},children:e.jsx(s,{...a})})}const t={dropdownTrigger:e.jsx(h,{children:"Whatever"}),anchor:e.jsx(n,{href:"#",children:"Anchor"}),div:e.jsx("div",{role:"note",children:"This is a note, should have a popup!"})},v={title:"Components/Dropdown",component:w,argTypes:{trigger:{description:"The actual component to which the popup should be attached.",options:Object.keys(t),mapping:t,control:{type:"radio",labels:{text:"text",icon:"icon",button:"button"}}},children:{description:"The tooltip content."}}},o={args:{children:e.jsxs(i,{children:[e.jsx(r,{children:e.jsx(n,{kind:"textColor",href:"#",children:"Link One"})}),e.jsx(r,{children:e.jsx(n,{kind:"textColor",href:"https://www.betterplace.org",target:"_blank",rel:"noreferrer",children:"Link Two"})}),e.jsx(x,{}),e.jsx(r,{children:e.jsx(n,{kind:"textColor",href:"#",children:"Link Three"})}),e.jsx(r,{children:e.jsx(s,{trigger:e.jsx(n,{kind:"textColor",href:"#",children:"Link One"}),children:e.jsxs(i,{children:[e.jsx(r,{children:e.jsx(n,{kind:"textColor",href:"https://www.betterplace.org",target:"_blank",rel:"noreferrer",children:"Link Two"})}),e.jsx(r,{children:e.jsx(n,{kind:"textColor",href:"https://www.betterplace.org",target:"_blank",rel:"noreferrer",children:"Link Two"})})]})})}),e.jsx(r,{children:e.jsx(c,{kind:"secondary",onClick:()=>alert("clicked"),children:"Click me!"})})]}),trigger:t.dropdownTrigger}};var d,l,p;o.parameters={...o.parameters,docs:{...(d=o.parameters)==null?void 0:d.docs,source:{originalSource:`{ + args: { + children: + + {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */} + + Link One + + + + + Link Two + + + + + {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */} + + Link Three + + + + + Link One + }> + + + + Link Two + + + + + Link Two + + + + + + + {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */} + + + , + trigger: labelMapping.dropdownTrigger + } +}`,...(p=(l=o.parameters)==null?void 0:l.docs)==null?void 0:p.source}}};const _=["Default"];export{o as Default,_ as __namedExportsOrder,v as default}; diff --git a/assets/Fieldset-BhhTSG2o.css b/assets/Fieldset-BhhTSG2o.css new file mode 100644 index 0000000..bce0cb1 --- /dev/null +++ b/assets/Fieldset-BhhTSG2o.css @@ -0,0 +1 @@ +._groupLabel_1kfi8_1{font:var(--betterplace-typography-label-sm);color:var(--betterplace-color-fg-content-primary)}._fieldset_1kfi8_6{border:none;padding:0;margin:0}._legend_1kfi8_12{padding-inline:0;padding-block-end:var(--betterplace-spacing-200)}._legend_1kfi8_12._legendMedium_1kfi8_16{padding-block-end:var(--betterplace-spacing-300)}._legend_1kfi8_12._legendMedium_1kfi8_16 ._groupLabel_1kfi8_1{font:var(--betterplace-typography-label-md)}._legend_1kfi8_12:disabled input:checked+span:before,._legend_1kfi8_12[aria-disabled=true] input:checked+span:before{background-color:var(--betterplace-color-fg-mute)}._legend_1kfi8_12:disabled label,._legend_1kfi8_12[aria-disabled=true] label{color:var(--betterplace-color-fg-mute)}._legend_1kfi8_12:disabled,._legend_1kfi8_12:disabled:hover,._legend_1kfi8_12[aria-disabled=true],._legend_1kfi8_12[aria-disabled=true]:hover{background-color:transparent}._fieldContainer_1kfi8_42{border-radius:var(--betterplace-border-radius-100)}._groupHint_1kfi8_46{font:var(--betterplace-typography-functional-text-sm-default);color:var(--betterplace-color-fg-content-secondary)}._groupError_1kfi8_51{outline:var(--betterplace-border-danger);outline-offset:var(--betterplace-spacing-100)}._groupError_1kfi8_51:has(:focus-visible){outline-offset:var(--betterplace-spacing-200)}._errorMessage_1kfi8_60{font:var(--betterplace-typography-functional-text-sm-important);color:var(--betterplace-color-fg-danger);padding-top:var(--betterplace-spacing-200)}._invisibleLegend_1kfi8_67{position:absolute;width:0;height:0;padding:0;margin:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0} diff --git a/assets/Fieldset.stories-CObsRbDf.js b/assets/Fieldset.stories-CObsRbDf.js new file mode 100644 index 0000000..1e3e867 --- /dev/null +++ b/assets/Fieldset.stories-CObsRbDf.js @@ -0,0 +1,36 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{c as m}from"./index-Bl6ORisp.js";import{L as W}from"./LayoutStack-DCdAGefl.js";import{L as A}from"./LayoutCluster-BkRwq4A8.js";import{r as D}from"./index-Cs7sjTYM.js";import{C as a}from"./ClientCheckbox-C1-KzgT7.js";import{H as V}from"./Heading-C6c2EMQE.js";import{R as h}from"./ClientRadioButton-D6ER925T.js";import{T as g}from"./ToggleButton-BjrnRVGb.js";import{T as F}from"./Tooltip-Dt-HYHa2.js";import"./_commonjsHelpers-BosuxZz1.js";import"./preventDefault-M1KdZT7V.js";import"./PopupArrow-BfkLmXfx.js";import"./Popup-CReyU1RW.js";import"./PopupContext-CCyEydDt.js";import"./index-BU4L-DQy.js";const q="_groupLabel_1kfi8_1",U="_fieldset_1kfi8_6",$="_legend_1kfi8_12",J="_legendMedium_1kfi8_16",K="_fieldContainer_1kfi8_42",Q="_groupHint_1kfi8_46",X="_groupError_1kfi8_51",Z="_errorMessage_1kfi8_60",P="_invisibleLegend_1kfi8_67",t={groupLabel:q,fieldset:U,legend:$,legendMedium:J,fieldContainer:K,groupHint:Q,groupError:X,errorMessage:Z,invisibleLegend:P};function ee({className:o,hint:r,required:i,children:p}){return e.jsxs("legend",{className:m(o,t.legend),children:[e.jsxs("div",{className:t.groupLabel,children:[p,i&&e.jsx("span",{"aria-label":"(required)",children:"*"})]}),r?e.jsx("div",{className:t.groupHint,children:r}):null]})}function f({children:o,classNames:r,legend:i,legendSize:p="small",hint:b,required:M,error:s,layout:O="horizontal",layoutProps:n={space:"none"},errorDisplay:y="all",invisibleLegend:I,...x}){const B=m(t.fieldContainer,n==null?void 0:n.className,{[t.groupError]:!!s&&y!=="text"}),S=O==="vertical"?W:A,Y=D.useId(),k=x.id||Y,v=s?`${k}-error`:void 0;return e.jsxs("fieldset",{id:k,className:m(t.fieldset,r==null?void 0:r.fieldset),"aria-describedby":v,...x,children:[i||b?e.jsx(ee,{required:M,hint:b,className:m(r==null?void 0:r.legend,{[t.legendMedium]:p==="medium",[t.invisibleLegend]:I}),children:i}):null,e.jsx(S,{className:B,...n,children:o}),s&&y!=="border"?e.jsx("p",{id:v,className:t.errorMessage,"aria-live":"polite",role:"alert",children:s}):null]})}const oe=o=>e.jsxs(f,{...o,children:[e.jsx(a,{id:"checkbox-label",children:"First checkbox element"}),e.jsx(a,{id:"default-checked",defaultChecked:!0,children:"This one is checked"}),e.jsx(a,{id:"disabled",disabled:!0,children:"Look, a disabled checkbox"}),e.jsx(F,{content:"READ IT OUT LOUD",children:e.jsx(a,{id:"default-checked-disabled",defaultChecked:!0,disabled:!0,children:"This one is checked and disabled"})})]}),re=o=>e.jsxs(f,{...o,children:[e.jsx(h,{name:"radio",value:"radio-1",defaultChecked:!0,children:"One - You should choose this"}),e.jsx(h,{name:"radio",value:"radio-2",children:"Some other value"}),e.jsx(F,{content:"READ IT NOW!",children:e.jsx(h,{name:"radio",value:"radio-3",disabled:!0,children:"You can't touch this"})})]}),te=o=>e.jsx("div",{style:{width:"fit-content"},children:e.jsxs(f,{...o,children:[e.jsx(g,{id:"1",name:"grp",value:"f1",type:"radio",size:"small",children:"Wisely"}),e.jsx(g,{id:"2",name:"grp",value:"f2",type:"radio",size:"small",children:"Other"}),e.jsx(g,{id:"3",name:"grp",value:"f3",type:"radio",size:"small",children:"Third"})]})}),ke={title:"Components/Fieldset",component:oe,parameters:{docs:{description:{component:"This component groups either Checkboxes, Radio buttons or Toggle buttons."}}},argTypes:{children:{description:"The components that are grouped in the Fieldset.",table:{type:{summary:"RadioButton | Checkbox | ToggleButton"}}},layout:{control:{type:"radio"},options:["horizontal","vertical"],description:"Option to organize the `children` in either a vertical or a horizontal layout.",table:{defaultValue:{summary:"horizontal"},type:{summary:"horizontal | vertical"}}},legend:{control:{type:"text"},description:"The title of the fieldset.",table:{type:{summary:"ReactNode"}}},legendSize:{control:{type:"radio"},options:["small","medium"],description:"Size of the legend text",table:{defaultValue:{summary:"small"},type:{summary:"small | medium"}}},hint:{control:{type:"text"},description:"Hint text for the Fieldset. Hints can only be set, when there is a title as well.",table:{type:{summary:"string"}}},error:{control:{type:"text"},description:"Error message, that is going to be shown under the Fieldset. No error message is shown when undefined.",table:{type:{summary:"string"}}},errorDisplay:{control:{type:"radio"},options:["border","all","text"],table:{defaultValue:{summary:"all"}},description:"Controls the behaviour of how errors are displayed."},required:{control:{type:"boolean"},description:"Whether the fieldset group is required or not."},invisibleLegend:{control:{type:"boolean"},description:"Visually hides the legend, but screen readers can still associate it with the input fields."}}},l={args:{legend:"This is a checkbox group",legendSize:"small",hint:"You need to click on the checkbox",layout:"vertical"}},d={render:o=>e.jsx(re,{...o}),args:{legend:"You can only choose one",legendSize:"small",hint:"And one is disabled",layout:"vertical"}},c={render:o=>e.jsx(te,{...o}),args:{legend:"Choose wisely!",legendSize:"small",hint:"Or don't. I am not your Mom.",layout:"horizontal",layoutProps:{space:"200"}}},u={args:{legend:e.jsx(V,{level:"h200",children:"This is an h2 heading"}),layout:"vertical"}};var _,j,C;l.parameters={...l.parameters,docs:{...(_=l.parameters)==null?void 0:_.docs,source:{originalSource:`{ + args: { + legend: 'This is a checkbox group', + legendSize: 'small', + hint: 'You need to click on the checkbox', + layout: 'vertical' + } +}`,...(C=(j=l.parameters)==null?void 0:j.docs)==null?void 0:C.source}}};var T,z,L;d.parameters={...d.parameters,docs:{...(T=d.parameters)==null?void 0:T.docs,source:{originalSource:`{ + render: (args: FieldsetProps) => { + return ; + }, + args: { + legend: 'You can only choose one', + legendSize: 'small', + hint: 'And one is disabled', + layout: 'vertical' + } +}`,...(L=(z=d.parameters)==null?void 0:z.docs)==null?void 0:L.source}}};var N,G,H;c.parameters={...c.parameters,docs:{...(N=c.parameters)==null?void 0:N.docs,source:{originalSource:`{ + render: (args: FieldsetProps) => { + return ; + }, + args: { + legend: 'Choose wisely!', + legendSize: 'small', + hint: "Or don't. I am not your Mom.", + layout: 'horizontal', + layoutProps: { + space: '200' + } + } +}`,...(H=(G=c.parameters)==null?void 0:G.docs)==null?void 0:H.source}}};var R,w,E;u.parameters={...u.parameters,docs:{...(R=u.parameters)==null?void 0:R.docs,source:{originalSource:`{ + args: { + legend: This is an h2 heading, + layout: 'vertical' + } +}`,...(E=(w=u.parameters)==null?void 0:w.docs)==null?void 0:E.source}}};const ve=["CheckboxGroup","RadioGroup","ToggleButtonGroup","GroupWithHeading"];export{l as CheckboxGroup,u as GroupWithHeading,d as RadioGroup,c as ToggleButtonGroup,ve as __namedExportsOrder,ke as default}; diff --git a/assets/FluidityHint-BY0Et3gQ.css b/assets/FluidityHint-BY0Et3gQ.css new file mode 100644 index 0000000..2945f6d --- /dev/null +++ b/assets/FluidityHint-BY0Et3gQ.css @@ -0,0 +1 @@ +._container_1eeol_1{padding:var(--betterplace-sizing-300);margin-block:var(--betterplace-sizing-100)!important;background:var(--betterplace-color-bg-attention)}._paragraph_1eeol_7{margin:var(--betterplace-spacing-none)!important} diff --git a/assets/FluidityHint-CaQrXXn1.js b/assets/FluidityHint-CaQrXXn1.js new file mode 100644 index 0000000..bd30b93 --- /dev/null +++ b/assets/FluidityHint-CaQrXXn1.js @@ -0,0 +1 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";const n="_container_1eeol_1",i="_paragraph_1eeol_7",t={container:n,paragraph:i},r=()=>e.jsx("div",{className:t.container,children:e.jsxs("p",{className:t.paragraph,children:["Our root font size is dependent on the viewport width (it scales smoothly between a minimum and maximum value). Since the rem and ch units refer to this fluid root font size"," ",e.jsx("strong",{children:"the actual size of things defined by rem or ch values is dependent on the viewport width"}),", too."]})});export{r as F}; diff --git a/assets/Footer-CrVwqi1s.css b/assets/Footer-CrVwqi1s.css new file mode 100644 index 0000000..c8ecb4d --- /dev/null +++ b/assets/Footer-CrVwqi1s.css @@ -0,0 +1 @@ +._footer_bett2_1{padding:var(--betterplace-spacing-450) var(--betterplace-spacing-250);background:#fff;text-align:center} diff --git a/assets/Footer.stories-D4R-eayy.js b/assets/Footer.stories-D4R-eayy.js new file mode 100644 index 0000000..1dae4fd --- /dev/null +++ b/assets/Footer.stories-D4R-eayy.js @@ -0,0 +1,17 @@ +import{d as e}from"./de-CeSvLgNu.js";import{j as r}from"./jsx-runtime-BlAj40OV.js";import{c}from"./index-Bl6ORisp.js";import{L as m,D as p}from"./shared-Dv1kO_Nt.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./TextLink-BKWIXXPv.js";const f="_footer_bett2_1",d={footer:f};function x({text:o,Link:l=p}){return r.jsxs("footer",{className:c("bp-shared",d.footer),children:[o.providerInfo,o.links.map(i=>r.jsxs(r.Fragment,{children:[" | ",r.jsx(m,{Link:l,...i})]}))]})}const w={title:"Shared Layout Parts/Footer",component:x},t={args:{text:{providerInfo:e.nextjs.footer.provider_info,links:[{href:"https://www.betterplace.org/c/kontakt",children:e.nextjs.footer.impressum_label,external:!0},{href:e.nextjs.external_links.transaction_cost.url,children:e.nextjs.external_links.transaction_cost.content,className:"larger-click-area",external:!0}]}}};var n,s,a;t.parameters={...t.parameters,docs:{...(n=t.parameters)==null?void 0:n.docs,source:{originalSource:`{ + args: ({ + text: { + providerInfo: de.nextjs.footer.provider_info, + links: [{ + href: 'https://www.betterplace.org/c/kontakt', + children: de.nextjs.footer.impressum_label, + external: true + }, { + href: de.nextjs.external_links.transaction_cost.url, + children: de.nextjs.external_links.transaction_cost.content, + className: 'larger-click-area', + external: true + }] + } + } as FooterProps) +}`,...(a=(s=t.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};const v=["Default"];export{t as Default,v as __namedExportsOrder,w as default}; diff --git a/assets/FooterCompact-DNCFpDQy.css b/assets/FooterCompact-DNCFpDQy.css new file mode 100644 index 0000000..2949296 --- /dev/null +++ b/assets/FooterCompact-DNCFpDQy.css @@ -0,0 +1 @@ +._footer_1tlca_1{padding:var(--betterplace-spacing-450) var(--betterplace-spacing-250);background:#fff;text-align:center}@media only print{._footer_1tlca_1{visibility:hidden}} diff --git a/assets/FooterCompact.stories-DrtJ0hUN.js b/assets/FooterCompact.stories-DrtJ0hUN.js new file mode 100644 index 0000000..2e34d5f --- /dev/null +++ b/assets/FooterCompact.stories-DrtJ0hUN.js @@ -0,0 +1,17 @@ +import{d as e}from"./de-CeSvLgNu.js";import{j as t}from"./jsx-runtime-BlAj40OV.js";import{c as m}from"./index-Bl6ORisp.js";import{L as p,D as f}from"./shared-Dv1kO_Nt.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./TextLink-BKWIXXPv.js";const d="_footer_1tlca_1",x={footer:d};function u({text:o,Link:c=f}){return t.jsxs("footer",{className:m("bp-shared",x.footer),children:[o.providerInfo,o.links.map((l,i)=>t.jsxs(t.Fragment,{children:[" | ",t.jsx(p,{Link:c,...l})]},i))]})}const v={title:"Shared Layout Parts/FooterCompact",component:u},r={args:{text:{providerInfo:e.nextjs.footer.provider_info,links:[{href:"https://www.betterplace.org/c/kontakt",children:e.nextjs.footer.impressum_label,external:!0},{href:e.nextjs.external_links.transaction_cost.url,children:e.nextjs.external_links.transaction_cost.content,className:"larger-click-area",external:!0}]}}};var n,s,a;r.parameters={...r.parameters,docs:{...(n=r.parameters)==null?void 0:n.docs,source:{originalSource:`{ + args: ({ + text: { + providerInfo: de.nextjs.footer.provider_info, + links: [{ + href: 'https://www.betterplace.org/c/kontakt', + children: de.nextjs.footer.impressum_label, + external: true + }, { + href: de.nextjs.external_links.transaction_cost.url, + children: de.nextjs.external_links.transaction_cost.content, + className: 'larger-click-area', + external: true + }] + } + } as FooterCompactProps) +}`,...(a=(s=r.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};const F=["Default"];export{r as Default,F as __namedExportsOrder,v as default}; diff --git a/assets/Header-CkSn2SFN.css b/assets/Header-CkSn2SFN.css new file mode 100644 index 0000000..95e7929 --- /dev/null +++ b/assets/Header-CkSn2SFN.css @@ -0,0 +1 @@ +@media screen and (max-width: 940px){._searchButton_1f2c2_2{background-color:transparent!important;border:0!important}._searchButton_1f2c2_2:before{background:transparent!important}}@media screen and (min-width: 941px){._input_1f2c2_13{margin-right:4px}}._form_1f2c2_18{display:flex;align-items:center}._inputContainer_1f2c2_23{flex:1;display:flex;position:relative;height:28px}._input_1f2c2_13{flex:1 1 auto;padding:0 10px;margin-right:10px;border-radius:var(--betterplace-border-radius-200)}._input_1f2c2_13:focus{box-shadow:none;border-color:#fff}._searchButton_1f2c2_2{padding:var(--betterplace-spacing-100)!important;gap:0!important}._resetButton_1f2c2_47{padding:var(--betterplace-spacing-100)!important;position:absolute;right:0;top:0;bottom:0;margin-top:auto;margin-bottom:auto;margin-right:var(--betterplace-spacing-100);background-color:transparent!important}._links_h24ki_1{list-style:none;padding-left:0;grid-area:links;display:flex;justify-content:flex-end;overflow:hidden}@media screen and (max-width: 450px){._links_h24ki_1{justify-content:space-around}}._linkItem_h24ki_16{display:inline-block}@media screen and (min-width: 941px){._links_h24ki_1{margin-bottom:0;text-align:right}._linkItem_h24ki_16{color:#fff}}@media screen and (max-width: 940px){._links_h24ki_1{background-color:var(--betterplace-color-bg-light);height:40px}._search_h24ki_37{display:flex;align-items:center}}._search_h24ki_37{grid-area:search}@media only screen and (max-width: 1250px){._searchOpen_h24ki_48 ._links_h24ki_1{display:none!important}}@media screen and (max-width: 940px){._searchOpen_h24ki_48 ._links_h24ki_1{display:flex!important}} diff --git a/assets/Header.stories-BueM4hj8.js b/assets/Header.stories-BueM4hj8.js new file mode 100644 index 0000000..d1ad4af --- /dev/null +++ b/assets/Header.stories-BueM4hj8.js @@ -0,0 +1,60 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{c as U,s as o,U as D,d as z}from"./UserInfo-C4RfKeHP.js";import{c as m}from"./index-Bl6ORisp.js";import{D as K,a as M}from"./shared-Dv1kO_Nt.js";import{I as $}from"./Icon-DX5oPjN8.js";import"./ClientAmountField-BeKZJ_SU.js";import{r as s}from"./index-Cs7sjTYM.js";import"./ClientButton-DhJqhttM.js";import"./Card-CXehOyXK.js";import"./ClientCheckbox-C1-KzgT7.js";import"./ColorInput-BCTm_2fB.js";import"./LayoutCluster-BkRwq4A8.js";import"./TextInput-CJfcBDcM.js";import"./PopupContext-CCyEydDt.js";import"./index-BU4L-DQy.js";import"./ClientSelect-DQsrC2rb.js";import{C as P}from"./ClientIconButton-CsrI0D2P.js";import"./LayoutAccordion-Cce0sNYb.js";import"./LayoutModal-DfVyIvg1.js";import"./ClientRadioButton-D6ER925T.js";import"./RangeInput-Ceo1KbjA.js";import"./Textarea-CUO6QFMo.js";import"./TextLink-BKWIXXPv.js";import"./Tile-BHX8z08E.js";import"./ToggleButton-BjrnRVGb.js";import"./TooltipTrigger-DPJ28bmU.js";import"./VirtualScroll-BK9u8nPO.js";import{L}from"./LoadingSkeleton-DW0pUbAG.js";import{d as a}from"./de-CeSvLgNu.js";import{H as q}from"./HeaderCompact-ClJ-qs3W.js";import{K as x}from"./Popup-CReyU1RW.js";import"./PopupArrow-BfkLmXfx.js";import"./Dropdown-D3yVVs0w.js";import"./Select.module-VGDajZ98.js";import"./_commonjsHelpers-BosuxZz1.js";import"./useForwardedRef-Bxam_td3.js";import"./Button-CmRA-hR5.js";import"./preventDefault-M1KdZT7V.js";import"./TextInputWrapper-_VuV0eOO.js";import"./index-B_ZOYESs.js";import"./core-Drm9bBME.js";import"./LayoutStack-DCdAGefl.js";import"./Heading-C6c2EMQE.js";import"./ToggleSwitch-NdjEB8QA.js";function T({text:r,Link:c=K}){return e.jsxs(c,{href:r.loginUrl,className:m(U.whiteLink,o.login),children:[e.jsx($,{name:"user",className:o.icon,size:"400"}),e.jsx("span",{className:o.label,children:r.label})]})}function F(){return e.jsxs("div",{className:m(o.trigger,o.login),children:[e.jsx(L,{className:o.image,height:"36px",width:"36px",borderRadius:"100%",dark:!0}),e.jsx(L,{className:o.label,height:"36px",width:"100px",dark:!0})]})}const G="_searchButton_1f2c2_2",J="_input_1f2c2_13",Q="_form_1f2c2_18",V="_inputContainer_1f2c2_23",W="_resetButton_1f2c2_47",i={searchButton:G,input:J,form:Q,inputContainer:V,resetButton:W};function X({text:{url:r,label:c,placeholder:k},onShowSearch:_,onHideSearch:t,open:p,className:d}){const b=s.useRef(null),n=s.useRef(null);s.useEffect(()=>{!p||!n.current||n.current.focus()},[p]);const u=s.useCallback(l=>{if(l.key===x.Enter||l.key===x.Space||l.key===x.Space)return t==null?void 0:t()},[t]),w=s.useCallback(()=>{t==null||t()},[t]),N=s.useCallback(l=>{l.key===x.Escape&&(t==null||t())},[t]);return p?e.jsxs("form",{action:r,method:"POST",ref:b,className:m(i.form,d),children:[e.jsxs("div",{className:i.inputContainer,children:[e.jsx("input",{onKeyUp:N,name:"query",placeholder:k,ref:n,className:i.input}),e.jsx(P,{size:"large",type:"reset",iconName:"x",onClick:w,onKeyUp:u,className:i.resetButton,kind:"plain"})]}),e.jsx(P,{size:"large",type:"submit",iconName:"search",className:i.searchButton,children:e.jsx("span",{className:"sr-only",children:c})})]}):e.jsx(P,{size:"large",onClick:_,iconName:"search",className:m(i.searchButton,d),children:e.jsx("span",{className:"sr-only",children:c})})}const Y="_links_h24ki_1",Z="_linkItem_h24ki_16",H="_search_h24ki_37",ee="_searchOpen_h24ki_48",h={links:Y,linkItem:Z,search:H,searchOpen:ee};function re({Link:r=K,Image:c=M,children:k,text:{links:_,searchLabel:t,searchPlaceholder:p,searchUrl:d,...b}}){const[n,u]=s.useState(!1),w=s.useCallback(()=>u(!0),[]),N=s.useCallback(()=>u(!1),[]);return e.jsxs(q,{Link:r,Image:c,text:b,hideClaim:n,className:m({[h.searchOpen]:n}),children:[e.jsx("div",{className:h.search,children:e.jsx(X,{open:n,text:{placeholder:p,label:t,url:d},onShowSearch:w,onHideSearch:N,className:h.search})}),e.jsx("ul",{className:h.links,children:_.map((l,v)=>e.jsx("li",{className:h.linkItem,children:e.jsx(r,{className:m(U.whiteLink,U.headerLink),...l})},v))}),k]})}const Je={title:"Shared Layout Parts/Header",component:re},g={args:{text:{logoAlt:a.nextjs.header.betterplace_logo_alt_text,claim:a.nextjs.header.claim,homePageUrl:"https://www.betterplace.org",searchLabel:a.nextjs.core.search,searchPlaceholder:a.nextjs.header.search.placeholder,searchUrl:"https://www.betterplace.org",links:["Entdecken","Spenden sammeln","Über uns"].map(r=>({href:"#",children:r}))},children:e.jsx(D,{text:{myProfile:"Mein betterplace",avatar:z,links:["Profil","Meine Spenden","Neues Projekt anlegen","Neue Spendenaktion anlegen","separator","Abmelden"].map(r=>r!=="separator"?{href:"#",name:r}:r),name:"developers@betterplace.org"}})}},f={args:{text:{logoAlt:a.nextjs.header.betterplace_logo_alt_text,claim:a.nextjs.header.claim,homePageUrl:"https://www.betterplace.org",searchLabel:a.nextjs.core.search,searchPlaceholder:a.nextjs.header.search.placeholder,searchUrl:"https://www.betterplace.org",links:["Entdecken","Spenden sammeln","Über uns"].map(r=>({href:"#",children:r}))},children:e.jsx(T,{text:{loginUrl:"https://example.com",label:a.nextjs.login.log_in}})}},j={args:{text:{logoAlt:a.nextjs.header.betterplace_logo_alt_text,claim:a.nextjs.header.claim,homePageUrl:"https://www.betterplace.org",searchLabel:a.nextjs.core.search,searchPlaceholder:a.nextjs.header.search.placeholder,searchUrl:"https://www.betterplace.org",links:["Entdecken","Spenden sammeln","Über uns"].map(r=>({href:"#",children:r}))},children:e.jsx(F,{})}};var y,C,I;g.parameters={...g.parameters,docs:{...(y=g.parameters)==null?void 0:y.docs,source:{originalSource:`{ + args: ({ + text: { + logoAlt: de.nextjs.header.betterplace_logo_alt_text, + claim: de.nextjs.header.claim, + homePageUrl: 'https://www.betterplace.org', + searchLabel: de.nextjs.core.search, + searchPlaceholder: de.nextjs.header.search.placeholder, + searchUrl: 'https://www.betterplace.org', + links: ['Entdecken', 'Spenden sammeln', 'Über uns'].map(name => ({ + href: '#', + children: name + })) + }, + children: link !== 'separator' ? { + href: '#', + name: link + } : link), + name: 'developers@betterplace.org' + }} /> + } as HeaderProps) +}`,...(I=(C=g.parameters)==null?void 0:C.docs)==null?void 0:I.source}}};var E,B,O;f.parameters={...f.parameters,docs:{...(E=f.parameters)==null?void 0:E.docs,source:{originalSource:`{ + args: ({ + text: { + logoAlt: de.nextjs.header.betterplace_logo_alt_text, + claim: de.nextjs.header.claim, + homePageUrl: 'https://www.betterplace.org', + searchLabel: de.nextjs.core.search, + searchPlaceholder: de.nextjs.header.search.placeholder, + searchUrl: 'https://www.betterplace.org', + links: ['Entdecken', 'Spenden sammeln', 'Über uns'].map(name => ({ + href: '#', + children: name + })) + }, + children: + } as HeaderProps) +}`,...(O=(B=f.parameters)==null?void 0:B.docs)==null?void 0:O.source}}};var S,A,R;j.parameters={...j.parameters,docs:{...(S=j.parameters)==null?void 0:S.docs,source:{originalSource:`{ + args: ({ + text: { + logoAlt: de.nextjs.header.betterplace_logo_alt_text, + claim: de.nextjs.header.claim, + homePageUrl: 'https://www.betterplace.org', + searchLabel: de.nextjs.core.search, + searchPlaceholder: de.nextjs.header.search.placeholder, + searchUrl: 'https://www.betterplace.org', + links: ['Entdecken', 'Spenden sammeln', 'Über uns'].map(name => ({ + href: '#', + children: name + })) + }, + children: + } as HeaderProps) +}`,...(R=(A=j.parameters)==null?void 0:A.docs)==null?void 0:R.source}}};const Qe=["Default","LoggedOut","Loading"];export{g as Default,j as Loading,f as LoggedOut,Qe as __namedExportsOrder,Je as default}; diff --git a/assets/HeaderCompact-ClJ-qs3W.js b/assets/HeaderCompact-ClJ-qs3W.js new file mode 100644 index 0000000..e9bf79f --- /dev/null +++ b/assets/HeaderCompact-ClJ-qs3W.js @@ -0,0 +1 @@ +import{j as a}from"./jsx-runtime-BlAj40OV.js";import{c as d}from"./index-Bl6ORisp.js";import{D as m,a as i}from"./shared-Dv1kO_Nt.js";const n=""+new URL("layout-logo-CiTXzZAt.svg",import.meta.url).href,h="data:image/svg+xml,%3csvg%20enable-background='new%200%200%20427.4%20511'%20viewBox='0%200%20427.4%20511'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='m304.6%20413.9c13.8-14.8%2029.4-31.8%2050.6-54.6%2071.9-77.8%2085.2-159.2%2061.3-226.4-22.6-63.4-106.9-132.9-201.8-132.9-97.5.7-182.6%2066.3-204.2%20133-14.5%2044.8-28.5%20128.1%2064.6%20227.7l139.3%20150.3%2029.9-32.2s-98-106.1-133.6-144.5c-28.8-35.4-78.6-98.7-58-181.9%207.9-31.7%2064.5-108.8%20162.1-108.5%2097.3.3%20150.5%2080.8%20159.3%20104.5%2020.4%2055.1%209%20117-55%20185.5-22.7%2024.3-10.9%2011.8-34%2036.6%200%200-94.3-102.3-118.5-128.7-17.9-19.6-20.8-51.3-1.1-70.6%2019.3-19%2049.3-24.6%2073.4-1.6l28.3%2030.9c14.7%2015.3%2020.8%2015.1%2034.3%201.1%2010.5-10.8%2034.9-37.7%2041.1-44.6-10.8-10.5-19.5-19-31.2-30.7-6.9%207.5-22.8%2024.6-26.6%2028.6-15.2-16.4-34.5-43.4-80.4-43.9-28%200-52.7%2011.9-69.8%2028.8-23.3%2025.6-27.5%2047.4-28%2059.4-.9%2024.7%201.9%2045.2%2032.7%2078.7%2050.3%2054.5%20111.9%20120.6%20126.8%20136.6%2014.8%2015.4%2023.9%2015%2038.5-.6z'%20fill='%239ecb09'/%3e%3c/svg%3e",g="_header_krsnh_1",p="_headerClaim_krsnh_7",_="_claimHidden_krsnh_20",x="_headerLogo_krsnh_45",C="_logoCompact_krsnh_69",e={header:g,headerClaim:p,claimHidden:_,headerLogo:x,logoCompact:C};function w({Link:r=m,Image:s=i,text:o,children:c,className:l,hideClaim:t}){return a.jsxs("header",{className:d(e.header,"bp-shared",{[e.claimHidden]:t},l),children:[a.jsx("div",{className:e.headerLogo,children:a.jsxs(r,{href:o.homePageUrl,children:[a.jsx(s,{src:n,alt:o.logoAlt,width:175}),a.jsx(s,{src:h,className:e.logoCompact,alt:o.logoAlt,width:175})]})}),a.jsx("div",{className:e.headerClaim,"data-axe-expect":"color-contrast",children:o.claim}),c]})}export{w as H}; diff --git a/assets/HeaderCompact-DDGNGUVx.css b/assets/HeaderCompact-DDGNGUVx.css new file mode 100644 index 0000000..5684aa3 --- /dev/null +++ b/assets/HeaderCompact-DDGNGUVx.css @@ -0,0 +1 @@ +._header_krsnh_1{background:#000;display:grid;position:relative;z-index:30}._header_krsnh_1 ._headerClaim_krsnh_7{grid-area:claim;color:var(--betterplace-color-bg-neutral);white-space:nowrap;position:relative;left:10px;top:5px;font:var(--betterplace-typography-label-xs-secondary);text-overflow:ellipsis;overflow:hidden}._claimHidden_krsnh_20{grid-template-columns:210px auto 1fr auto auto!important}._claimHidden_krsnh_20 ._headerClaim_krsnh_7{display:none!important}@media screen and (min-width: 941px){._header_krsnh_1{height:65px;padding:3px 20px 0;background:#0009;align-items:center;border-bottom:1px solid rgb(99 99 99 / 60%);grid-template:"logo claim links login search" 60px / 210px auto 1fr auto 33px}}@media screen and (max-width: 940px){._header_krsnh_1{grid-template:"logo search login" 50px "links links links" 1fr / 1fr auto auto!important;border-bottom:1px solid #eeeeee}}._headerLogo_krsnh_45{grid-area:logo;position:relative}@media screen and (max-width: 940px){._headerLogo_krsnh_45{padding-inline:var(--betterplace-spacing-200);align-self:center}._headerLogo_krsnh_45 img{height:var(--betterplace-sizing-400);width:auto}}@media screen and (min-width: 941px){._headerLogo_krsnh_45 img{height:var(--betterplace-sizing-500);width:auto}}._headerLogo_krsnh_45 ._logoCompact_krsnh_69{display:none}@media only screen and (max-width: 1250px){._headerClaim_krsnh_7{display:none}}@media only print{._header_krsnh_1{visibility:hidden}} diff --git a/assets/HeaderCompact.stories-vN0qSCny.js b/assets/HeaderCompact.stories-vN0qSCny.js new file mode 100644 index 0000000..32dbb0e --- /dev/null +++ b/assets/HeaderCompact.stories-vN0qSCny.js @@ -0,0 +1,9 @@ +import{d as t}from"./de-CeSvLgNu.js";import{H as s}from"./HeaderCompact-ClJ-qs3W.js";import"./jsx-runtime-BlAj40OV.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";import"./shared-Dv1kO_Nt.js";import"./TextLink-BKWIXXPv.js";const x={title:"Shared Layout Parts/HeaderCompact",component:s},e={args:{text:{logoAlt:t.nextjs.header.betterplace_logo_alt_text,claim:t.nextjs.header.claim,homePageUrl:"https://www.betterplace.org"}}};var r,a,o;e.parameters={...e.parameters,docs:{...(r=e.parameters)==null?void 0:r.docs,source:{originalSource:`{ + args: ({ + text: { + logoAlt: de.nextjs.header.betterplace_logo_alt_text, + claim: de.nextjs.header.claim, + homePageUrl: 'https://www.betterplace.org' + } + } as HeaderCompactProps) +}`,...(o=(a=e.parameters)==null?void 0:a.docs)==null?void 0:o.source}}};const h=["Default"];export{e as Default,h as __namedExportsOrder,x as default}; diff --git a/assets/Heading-BCy83yZs.css b/assets/Heading-BCy83yZs.css new file mode 100644 index 0000000..1988b7c --- /dev/null +++ b/assets/Heading-BCy83yZs.css @@ -0,0 +1 @@ +._h000_1lipi_4{font:var(--betterplace-typography-heading-md)}._h100_1lipi_8{font:var(--betterplace-typography-heading-sm)}._h200_1lipi_12{font:var(--betterplace-typography-heading-xs)}._h300_1lipi_16{font:var(--betterplace-typography-functional-text-md-important)}._h400_1lipi_20{font:var(--betterplace-typography-functional-text-md-default)}._flex_1lipi_24{display:flex;flex-direction:row;align-items:center} diff --git a/assets/Heading-C6c2EMQE.js b/assets/Heading-C6c2EMQE.js new file mode 100644 index 0000000..09a9383 --- /dev/null +++ b/assets/Heading-C6c2EMQE.js @@ -0,0 +1 @@ +import{j as i}from"./jsx-runtime-BlAj40OV.js";import{c as l}from"./index-Bl6ORisp.js";import{L as d}from"./LayoutStack-DCdAGefl.js";import"./LayoutCluster-BkRwq4A8.js";import{r as m}from"./index-Cs7sjTYM.js";const x={h000:"h1",h100:"h1",h200:"h2",h300:"h3",h400:"h4"},f="_h000_1lipi_4",u="_h100_1lipi_8",j="_h200_1lipi_12",y="_h300_1lipi_16",b="_h400_1lipi_20",L="_flex_1lipi_24",r={h000:f,h100:u,h200:j,h300:y,h400:b,flex:L};function k({as:t,level:h,children:a,subtitle:s,className:c,flex:e,["aria-describedby"]:n,..._}){const p=t||x[h],o=m.useId();return i.jsxs(d,{space:"50",children:[i.jsx(p,{..._,className:l(r[h],c,{[r.flex]:e}),"aria-describedby":s?o:n,children:a}),s?i.jsx("div",{id:o,"aria-hidden":!0,children:s}):null]})}export{k as H}; diff --git a/assets/Heading.stories-DCpUB7nt.js b/assets/Heading.stories-DCpUB7nt.js new file mode 100644 index 0000000..50b68c9 --- /dev/null +++ b/assets/Heading.stories-DCpUB7nt.js @@ -0,0 +1,6 @@ +import{H as i}from"./Heading-C6c2EMQE.js";import"./jsx-runtime-BlAj40OV.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";import"./LayoutStack-DCdAGefl.js";import"./LayoutCluster-BkRwq4A8.js";const d={title:"Components/Heading",component:i,argTypes:{level:{options:["h100","h200","h300","h400"],control:{type:"radio"},description:"Stylistic headline level

The level affects the HTML tag:
  • h100: h1
  • h200: h2
  • h300: h3
  • h400: h4
"},as:{options:["h1","h2","h3","h4"],control:{type:"radio"},description:"HTML tag"},children:{control:{type:"text"},description:"Text content to be rendered"},subtitle:{control:{type:"text"},description:"Optional subtitle."},flex:{control:{type:"boolean"},description:"Whether to make heading a flex container with vertically centred content"},props:{control:!1,description:"All props (e.g. style and className) are passed on to the root JSX element"}}},e={args:{level:"h100",children:"Text of the heading"}};var t,o,r;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`{ + args: { + level: 'h100', + children: 'Text of the heading' + } +}`,...(r=(o=e.parameters)==null?void 0:o.docs)==null?void 0:r.source}}};const m=["Default"];export{e as Default,m as __namedExportsOrder,d as default}; diff --git a/assets/Icon-7trSyMxE.css b/assets/Icon-7trSyMxE.css new file mode 100644 index 0000000..ad7eb51 --- /dev/null +++ b/assets/Icon-7trSyMxE.css @@ -0,0 +1 @@ +._icon_r529q_1{fill:currentcolor} diff --git a/assets/Icon-DX5oPjN8.js b/assets/Icon-DX5oPjN8.js new file mode 100644 index 0000000..35ae844 --- /dev/null +++ b/assets/Icon-DX5oPjN8.js @@ -0,0 +1,15 @@ +import{j as h}from"./jsx-runtime-BlAj40OV.js";import{c as C}from"./index-Bl6ORisp.js";import{r as e}from"./index-Cs7sjTYM.js";const m=t=>e.createElement("svg",{fill:"none",height:16,viewBox:"0 0 16 16",width:16,xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",...t},e.createElement("clipPath",{id:"a"},e.createElement("path",{d:"m0 0h16v16h-16z"})),e.createElement("g",{clipPath:"url(#a)"},e.createElement("path",{clipRule:"evenodd",d:"m8.00016 2.33337c-3.12961 0-5.66666 2.53706-5.66666 5.66667 0 3.12966 2.53705 5.66666 5.66666 5.66666 3.12964 0 5.66664-2.537 5.66664-5.66666 0-3.12961-2.537-5.66667-5.66664-5.66667zm-7.666664 5.66667c0-4.23418 3.432484-7.666666 7.666664-7.666666 4.23414 0 7.66664 3.432486 7.66664 7.666666 0 4.23416-3.4325 7.66666-7.66664 7.66666-4.23418 0-7.666664-3.4325-7.666664-7.66666zm6.666504 2.66666c0-.5523.44772-.99998 1-.99998h.00667c.55228 0 1 .44768 1 .99998s-.44772 1-1 1h-.00667c-.55228 0-1-.4477-1-1zm2-5.33333c0-.55228-.44771-1-1-1-.55228 0-1 .44772-1 1v2.66667c0 .55229.44772 1 1 1 .55229 0 1-.44771 1-1z",fillRule:"evenodd"}))),w=t=>e.createElement("svg",{fill:"none",height:16,viewBox:"0 0 16 16",width:16,xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("path",{clipRule:"evenodd",d:"m6.85529 1.23162c.34944-.19674.7437-.300101 1.14472-.300101.40103 0 .79528.103361 1.14473.300101s.64229.48022.85027.8231l.00288.00475 5.64661 9.42663.0082.0139c.2037.3528.3115.7528.3127 1.1602.0011.4075-.1045.8081-.3062 1.162-.2018.354-.4927.649-.8439.8556-.3511.2066-.7502.3177-1.1576.3222l-.011.0001-11.30434-.0001c-.40741-.0045-.80653-.1156-1.15768-.3222-.351144-.2066-.642068-.5016-.843826-.8556-.201758-.3539-.3073177-.7545-.3061769-1.162.0011409-.4074.1089429-.8074.3126799-1.1602l.008123-.0139 5.64667-9.42662.85784.51386-.85498-.51862c.20799-.34288.50083-.62636.85028-.8231zm.8607 1.85876-5.63928 9.41432c-.0274.0493-.04188.1047-.04204.1611-.00016.0582.01492.1155.04374.166.02882.0506.07038.0927.12055.1223.0491.0288.10477.0447.16169.0459h11.27875c.0569-.0012.1126-.0171.1617-.0459.0501-.0296.0917-.0717.1205-.1223.0288-.0505.0439-.1078.0438-.166-.0002-.0564-.0147-.1118-.0421-.1611l-5.63926-9.41432c-.02965-.04827-.07112-.08819-.12049-.11599-.04992-.02811-.10625-.04287-.16354-.04287s-.11361.01476-.16353.04287c-.04938.0278-.09084.06772-.12049.11599zm.28401 1.90962c.55229 0 1 .44772 1 1v2.66667c0 .55228-.44771 1-1 1-.55228 0-1-.44772-1-1v-2.66667c0-.55228.44772-1 1-1zm0 5.3334c-.55228 0-1 .4477-1 1s.44772 1 1 1h.00667c.55228 0 1-.4477 1-1s-.44772-1-1-1z",fillRule:"evenodd"})),g=t=>e.createElement("svg",{width:17,height:17,viewBox:"0 0 17 17",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M3.82269 5.85553C4.17043 5.50779 4.73423 5.50779 5.08197 5.85553L8.01411 8.78767L10.9463 5.85553C11.294 5.50779 11.8578 5.50779 12.2055 5.85553C12.5533 6.20327 12.5533 6.76707 12.2055 7.11481L8.64375 10.6766C8.29601 11.0243 7.73221 11.0243 7.38447 10.6766L3.82269 7.11481C3.47495 6.76707 3.47495 6.20327 3.82269 5.85553Z"})),p=t=>e.createElement("svg",{fill:"none",height:16,viewBox:"0 0 16 16",width:16,xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("path",{clipRule:"evenodd",d:"m10.7071 3.29289c.3905.39053.3905 1.02369 0 1.41422l-3.29289 3.29289 3.29289 3.2929c.3905.3905.3905 1.0237 0 1.4142s-1.02368.3905-1.41421 0l-4-3.99999c-.39052-.39053-.39052-1.02369 0-1.41422l4-4c.39053-.39052 1.02371-.39052 1.41421 0z",fillRule:"evenodd"})),v=t=>e.createElement("svg",{width:17,height:17,viewBox:"0 0 17 17",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M5.29289 3.29289C5.68342 2.90237 6.31658 2.90237 6.70711 3.29289L10.7071 7.29289C11.0976 7.68342 11.0976 8.31658 10.7071 8.70711L6.70711 12.7071C6.31658 13.0976 5.68342 13.0976 5.29289 12.7071C4.90237 12.3166 4.90237 11.6834 5.29289 11.2929L8.58579 8L5.29289 4.70711C4.90237 4.31658 4.90237 3.68342 5.29289 3.29289Z"})),E=t=>e.createElement("svg",{width:16,height:16,viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("g",{id:"icon-new"},e.createElement("path",{id:"Vector",d:"M12 6H4",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{id:"Vector_2",d:"M14 2H2",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{id:"Vector_3",d:"M14 10H2",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{id:"Vector_4",d:"M12 14H4",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}))),f=t=>e.createElement("svg",{width:17,height:17,viewBox:"0 0 17 17",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M14.0404 3.29289C14.4309 3.68342 14.4309 4.31658 14.0404 4.70711L6.70707 12.0404C6.51953 12.228 6.26518 12.3333 5.99996 12.3333C5.73474 12.3333 5.48039 12.228 5.29285 12.0404L1.95952 8.70711C1.56899 8.31658 1.56899 7.68342 1.95952 7.29289C2.35004 6.90237 2.98321 6.90237 3.37373 7.29289L5.99996 9.91912L12.6262 3.29289C13.0167 2.90237 13.6499 2.90237 14.0404 3.29289Z"})),u=t=>e.createElement("svg",{fill:"none",height:16,viewBox:"0 0 16 16",width:16,xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",...t},e.createElement("clipPath",{id:"a"},e.createElement("path",{d:"m0 0h16v16h-16z"})),e.createElement("g",{clipPath:"url(#a)"},e.createElement("path",{clipRule:"evenodd",d:"m6.75134 2.4688c1.19193-.26931 2.43898-.1461 3.55516.35125.5045.22478 1.0956-.00196 1.3204-.50643s-.0019-1.09565-.5064-1.32043c-1.51013-.672876-3.19732-.83957-4.80992-.475222-1.61261.364348-3.06425 1.240212-4.1384 2.496982-1.07416 1.25676-1.713286 2.82707-1.822065 4.47675-.108779 1.64967.318619 3.2903 1.218455 4.6772.89983 1.387 2.22388 2.4459 3.77469 3.0188 1.5508.5729 3.24527.6292 4.83064.1605 1.5854-.4688 2.9769-1.4375 3.9668-2.7616.9898-1.3242 1.5252-2.93339 1.5261-4.58665v-.61333c0-.55229-.4477-1-1-1s-1 .44771-1 1v.61276c-.0007 1.22197-.3964 2.41102-1.128 3.38972-.7317.9787-1.7601 1.6947-2.93193 2.0412-1.17183.3464-2.42426.3048-3.57051-.1187-1.14624-.4234-2.12489-1.2061-2.78998-2.2312-.6651-1.0251-.981-2.23778-.9006-3.45711.0804-1.21932.5528-2.37999 1.34674-3.3089s1.86689-1.57629 3.05882-1.84559zm8.62276.90458c.3904-.39072.39-1.02389-.0007-1.41421-.3907-.39033-1.0239-.39002-1.4142.0007l-5.95955 5.96552-1.29254-1.29254c-.39053-.39052-1.02369-.39052-1.41422 0-.39052.39053-.39052 1.02369 0 1.41422l2 2.00003c.1876.1876.44206.2929.70736.2929.2653-.0001.51971-.1056.70721-.2933z",fillRule:"evenodd"}))),L=t=>e.createElement("svg",{width:19,height:19,viewBox:"0 0 19 19",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("g",{id:"icons-in-use",clipPath:"url(#clip0_708_26327)"},e.createElement("path",{id:"Union",fillRule:"evenodd",clipRule:"evenodd",d:"M15.1454 3.38427C15.2326 3.29703 15.351 3.24802 15.4743 3.24802C15.5977 3.24802 15.716 3.29703 15.8033 3.38427C15.8905 3.47151 15.9395 3.58983 15.9395 3.7132C15.9395 3.83657 15.8905 3.95489 15.8033 4.04213L8.91067 10.9347L8.03352 11.154L8.25281 10.2769L15.1454 3.38427ZM15.4743 1.00195C14.7553 1.00195 14.0657 1.2876 13.5572 1.79606L6.44464 8.90861C6.30072 9.05254 6.19861 9.23288 6.14925 9.43034L5.40056 12.4251C5.30488 12.8078 5.41701 13.2126 5.69595 13.4916C5.97489 13.7705 6.37973 13.8827 6.76244 13.787L9.7572 13.0383C9.95466 12.9889 10.135 12.8868 10.2789 12.7429L17.3915 5.63034C17.8999 5.12188 18.1856 4.43227 18.1856 3.7132C18.1856 2.99413 17.8999 2.30452 17.3915 1.79606C16.883 1.2876 16.1934 1.00195 15.4743 1.00195ZM3.49541 2.58999C2.80044 2.58999 2.13392 2.86607 1.6425 3.3575C1.15108 3.84892 0.875 4.51543 0.875 5.21041V15.6921C0.875 16.387 1.15108 17.0536 1.6425 17.545C2.13392 18.0364 2.80044 18.3125 3.49541 18.3125H13.9771C14.6721 18.3125 15.3386 18.0364 15.83 17.545C16.3214 17.0536 16.5975 16.387 16.5975 15.6921V10.4512C16.5975 9.831 16.0947 9.3282 15.4745 9.3282C14.8542 9.3282 14.3514 9.831 14.3514 10.4512V15.6921C14.3514 15.7913 14.312 15.8866 14.2418 15.9568C14.1716 16.027 14.0764 16.0664 13.9771 16.0664H3.49541C3.39613 16.0664 3.30092 16.027 3.23071 15.9568C3.16051 15.8866 3.12107 15.7913 3.12107 15.6921V5.21041C3.12107 5.11113 3.16051 5.01591 3.23071 4.94571C3.30092 4.8755 3.39613 4.83606 3.49541 4.83606H8.73624C9.35648 4.83606 9.85928 4.33326 9.85928 3.71303C9.85928 3.09279 9.35648 2.58999 8.73624 2.58999H3.49541Z"})),e.createElement("defs",null,e.createElement("clipPath",{id:"clip0_708_26327"},e.createElement("rect",{width:18,height:18,fill:"white",transform:"translate(0.5 0.75)"})))),x=t=>e.createElement("svg",{width:46,height:46,viewBox:"0 0 46 46",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("g",{id:"Ellipse 424",filter:"url(#filter0_d_5604_449)"},e.createElement("circle",{cx:22.75,cy:23.25,r:18})),e.createElement("defs",null,e.createElement("filter",{id:"filter0_d_5604_449",x:.25,y:.75,width:45,height:45,filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB"},e.createElement("feFlood",{floodOpacity:0,result:"BackgroundImageFix"}),e.createElement("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",result:"hardAlpha"}),e.createElement("feOffset",null),e.createElement("feGaussianBlur",{stdDeviation:2.25}),e.createElement("feComposite",{in2:"hardAlpha",operator:"out"}),e.createElement("feColorMatrix",{type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0"}),e.createElement("feBlend",{mode:"normal",in2:"BackgroundImageFix",result:"effect1_dropShadow_5604_449"}),e.createElement("feBlend",{mode:"normal",in:"SourceGraphic",in2:"effect1_dropShadow_5604_449",result:"shape"})))),k=t=>e.createElement("svg",{width:17,height:17,viewBox:"0 0 17 17",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("path",{d:"M7.428 10.46C7.788 11.99 8.67 12.656 10.056 12.656C11.028 12.656 11.91 12.332 12.684 11.882V14.06C11.73 14.492 10.884 14.726 9.786 14.726C6.978 14.726 5.124 13.142 4.548 10.46H3L3.396 8.984H4.476V7.706H3L3.396 6.212H4.584C5.286 3.584 7.338 2 9.876 2C11.352 2 12.432 2.45 13.314 3.044L12.306 4.772C11.568 4.286 10.866 4.052 9.984 4.052C8.832 4.052 7.896 4.736 7.464 6.212H11.838L11.442 7.706H7.338V8.984H11.172L10.794 10.46H7.428Z"})),V=t=>e.createElement("svg",{width:17,height:17,viewBox:"0 0 17 17",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("path",{d:"M8.34278 2.02783C9.1369 2.02783 9.7 2.60591 9.7 3.36185C9.7 4.1178 9.1369 4.69587 8.34278 4.69587C7.54866 4.69587 7 4.1178 7 3.36185C7 2.60591 7.54866 2.02783 8.34278 2.02783ZM9.49786 6.17812V14.0488H7.21658V6.17812H9.49786Z"})),M=t=>e.createElement("svg",{width:16,height:16,viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("g",{id:"icon-new"},e.createElement("path",{id:"Vector",d:"M11.3333 13.5H2",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{id:"Vector_2",d:"M14 10H2",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{id:"Vector_3",d:"M11.3333 6.5H2",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{id:"Vector_4",d:"M14 3H2",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}))),_=t=>e.createElement("svg",{width:14,height:17,viewBox:"0 0 14 17",fill:"none",...t},e.createElement("path",{d:"M 9.76552,13.5516 C 10.1858,13.0878 10.6623,12.5572 11.3035,11.8392 13.4913,9.40443 13.8942,6.85371 13.1707,4.74891 12.4862,2.76452 9.91715,0.588379 7.03185,0.588379 4.06858,0.610675 1.47788,2.66642 0.819372,4.75337 0.377479,6.15806 -0.047084,8.76229 2.78622,11.8838 l 4.23697,4.7046 0.90978,-1.0078 c 0,0 -2.98061,-3.3222 -4.06368,-4.5262 C 2.99417,9.94401 1.47788,7.96408 2.10606,5.35984 2.34433,4.36541 4.06858,1.95293 7.03619,1.96185 9.99946,1.97076 11.6154,4.49027 11.884,5.23498 c 0.6195,1.72575 0.2729,3.66109 -1.6723,5.80602 -0.69312,0.7625 -0.32921,0.3701 -1.03537,1.146 0,0 -2.86797,-3.20174 -3.60445,-4.03117 C 5.02601,7.54044 4.93936,6.55047 5.53722,5.94401 6.12641,5.35092 7.03619,5.17255 7.76834,5.89496 L 8.63046,6.86263 C 9.07669,7.33977 9.26298,7.33531 9.67454,6.8983 9.99513,6.55939 10.7359,5.71658 10.9266,5.49808 10.5973,5.16809 10.333,4.90053 9.9778,4.53487 9.76552,4.76675 9.28464,5.30633 9.16767,5.43119 8.70411,4.91837 8.11926,4.0711 6.71993,4.05772 5.8708,4.05772 5.11699,4.42784 4.59712,4.9585 3.88662,5.76118 3.76099,6.44345 3.74799,6.81803 3.722,7.59395 3.80431,8.23163 4.74008,9.28403 6.26937,10.9875 8.14092,13.0611 8.59581,13.5605 9.04636,14.051 9.32363,14.0421 9.76552,13.5516 Z"})),H=t=>e.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","xmlns:svg":"http://www.w3.org/2000/svg",...t},e.createElement("path",{d:"M 12,0.75 C 5.7869656,0.75 0.75,5.7869656 0.75,12 0.75,18.213034 5.7869656,23.25 12,23.25 18.213034,23.25 23.25,18.213034 23.25,12 23.25,5.7869656 18.213034,0.75 12,0.75 Z M 12,3 c 5.005454,0 9,3.9945456 9,9 0,5.005454 -3.994546,9 -9,9 C 6.9945456,21 3,17.005454 3,12 3,6.9945456 6.9945456,3 12,3 Z"}),e.createElement("circle",{cx:12,cy:12,r:6.75})),Z=t=>e.createElement("svg",{width:19,height:18,viewBox:"0 0 19 18",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M9.48493 2.90037C5.97027 2.90037 3.12107 5.74957 3.12107 9.26423C3.12107 12.7789 5.97027 15.6281 9.48493 15.6281C12.9996 15.6281 15.8488 12.7789 15.8488 9.26423C15.8488 5.74957 12.9996 2.90037 9.48493 2.90037ZM0.875 9.26423C0.875 4.50909 4.7298 0.654297 9.48493 0.654297C14.2401 0.654297 18.0949 4.50909 18.0949 9.26423C18.0949 14.0194 14.2401 17.8742 9.48493 17.8742C4.7298 17.8742 0.875 14.0194 0.875 9.26423ZM10.9823 5.89494C11.6025 5.89494 12.1053 6.39774 12.1053 7.01798V11.5101C12.1053 12.1304 11.6025 12.6332 10.9823 12.6332C10.3621 12.6332 9.85928 12.1304 9.85928 11.5101V7.01798C9.85928 6.39774 10.3621 5.89494 10.9823 5.89494ZM9.1105 7.01798C9.1105 6.39774 8.6077 5.89494 7.98746 5.89494C7.36723 5.89494 6.86443 6.39774 6.86443 7.01798V11.5101C6.86443 12.1304 7.36723 12.6332 7.98746 12.6332C8.6077 12.6332 9.1105 12.1304 9.1105 11.5101V7.01798Z"})),R=t=>e.createElement("svg",{width:18,height:19,viewBox:"0 0 18 19",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("g",{id:"icons-in-use",clipPath:"url(#clip0_1384_7139)"},e.createElement("path",{id:"Union",fillRule:"evenodd",clipRule:"evenodd",d:"M8.98493 2.66404C5.47027 2.66404 2.62107 5.51324 2.62107 9.0279C2.62107 12.5426 5.47027 15.3918 8.98493 15.3918C12.4996 15.3918 15.3488 12.5426 15.3488 9.0279C15.3488 5.51324 12.4996 2.66404 8.98493 2.66404ZM0.375 9.0279C0.375 4.27277 4.2298 0.417969 8.98493 0.417969C13.7401 0.417969 17.5949 4.27277 17.5949 9.0279C17.5949 13.783 13.7401 17.6378 8.98493 17.6378C4.2298 17.6378 0.375 13.783 0.375 9.0279ZM8.98489 4.91011C9.60512 4.91011 10.1079 5.41291 10.1079 6.03314V7.90468H11.9797C12.5999 7.90468 13.1027 8.40748 13.1027 9.02772C13.1027 9.64795 12.5999 10.1508 11.9797 10.1508H10.1079V12.0227C10.1079 12.6429 9.60512 13.1457 8.98489 13.1457C8.36465 13.1457 7.86185 12.6429 7.86185 12.0227V10.1508H5.99017C5.36994 10.1508 4.86714 9.64795 4.86714 9.02772C4.86714 8.40748 5.36994 7.90468 5.99017 7.90468H7.86185V6.03314C7.86185 5.41291 8.36465 4.91011 8.98489 4.91011Z"})),e.createElement("defs",null,e.createElement("clipPath",{id:"clip0_1384_7139"},e.createElement("rect",{width:18,height:18,fill:"white",transform:"translate(0 0.294922)"})))),S=t=>e.createElement("svg",{width:17,height:17,viewBox:"0 0 17 17",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("path",{d:"M8.61589 2C10.872 2 12 3.28748 12 4.75653C12 7.43054 9.21854 7.24897 9.21854 9.09766V9.51032H6.99338V8.99862C6.99338 6.14305 9.45033 6.34113 9.45033 4.98762C9.45033 4.3934 9.04856 4.04677 8.36865 4.04677C7.7351 4.04677 7.117 4.37689 6.56071 5.05365L5 3.76616C5.88079 2.66025 7.02428 2 8.61589 2ZM8.13687 11.0124C8.90949 11.0124 9.52759 11.6891 9.52759 12.4979C9.52759 13.3232 8.90949 14 8.13687 14C7.36424 14 6.74614 13.3232 6.74614 12.4979C6.74614 11.6891 7.36424 11.0124 8.13687 11.0124Z"})),B=t=>e.createElement("svg",{width:16,height:16,viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("g",{id:"icon-new"},e.createElement("path",{id:"Vector",d:"M13.9974 13.5H4.66406",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{id:"Vector_2",d:"M14 10H2",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{id:"Vector_3",d:"M13.9974 6.5H4.66406",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{id:"Vector_4",d:"M14 3H2",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}))),P=t=>e.createElement("svg",{width:18,height:18,viewBox:"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("path",{d:"M 8.1660156,0.5 C 3.9436797,0.5 0.5,3.9436797 0.5,8.1660156 c 0,4.2223614 3.4436924,7.6679684 7.6660156,7.6679684 1.7455677,0 3.2829934,-0.690754 4.5742184,-1.679687 l 3.052735,3.052734 a 1,1 0 0 0 1.414062,0 1,1 0 0 0 0,-1.414062 L 14.154297,12.740234 C 15.14323,11.449009 15.833984,9.9115833 15.833984,8.1660156 15.833984,3.9436924 12.388377,0.5 8.1660156,0.5 Z m 0,2 c 3.1414914,0 5.6679684,2.5245463 5.6679684,5.6660156 0,1.5621293 -0.628525,2.9695604 -1.642578,3.9921874 a 1,1 0 0 0 -0.02344,0.0098 1,1 0 0 0 -0.0098,0.02344 C 11.135576,13.205459 9.7281449,13.833984 8.1660156,13.833984 5.0245463,13.833984 2.5,11.307507 2.5,8.1660156 2.5,5.0245589 5.0245589,2.5 8.1660156,2.5 Z"})),z=t=>e.createElement("svg",{width:14,height:17,viewBox:"0 0 14 17",fill:"none",...t},e.createElement("style",null,` + @keyframes stroke-offset-animation { + to { + stroke-dashoffset: 240; + } + } + + mask path { + stroke-miterlimit: 50; + stroke-dasharray: 60; + animation: stroke-offset-animation 4s linear infinite; + animation-direction: reverse; + stroke-width: 2; + } + `),e.createElement("defs",{id:"defs79"},e.createElement("mask",{maskUnits:"userSpaceOnUse",id:"mask6031"},e.createElement("path",{style:{display:"inline",fill:"none",stroke:"#fff",strokeWidth:2,strokeOpacity:1},d:"M 7.6355932,16.207627 C 2.8813559,10.661017 1.1370534,9.786973 1.2245763,5.8347458 1.2785241,3.398654 4.7953789,1.1065425 7.3474576,1.2245763 9.8434648,1.3400168 12.470245,3.8044802 12.894068,6.2669491 13.342313,8.8713176 9.1483051,13.254237 9.1483051,13.254237 c 0,0 -3.8177966,-3.8898302 -4.3940678,-4.9703387 C 4.1779661,7.2033898 4.3801992,4.8079258 6.7711864,4.6101695 7.5774278,4.4844471 9.220339,6.4110169 9.220339,6.4110169 l 1.440678,-1.5847457"}))),e.createElement("g",{mask:"url(#mask6031)",id:"g70"},e.createElement("path",{d:"M 9.76552,13.5516 C 10.1858,13.0878 10.6623,12.5572 11.3035,11.8392 13.4913,9.40443 13.8942,6.85371 13.1707,4.74891 12.4862,2.76452 9.91715,0.588379 7.03185,0.588379 4.06858,0.610675 1.47788,2.66642 0.819372,4.75337 0.377479,6.15806 -0.047084,8.76229 2.78622,11.8838 l 4.23697,4.7046 0.90978,-1.0078 c 0,0 -2.98061,-3.3222 -4.06368,-4.5262 C 2.99417,9.94401 1.47788,7.96408 2.10606,5.35984 2.34433,4.36541 4.06858,1.95293 7.03619,1.96185 9.99946,1.97076 11.6154,4.49027 11.884,5.23498 c 0.6195,1.72575 0.2729,3.66109 -1.6723,5.80602 -0.69312,0.7625 -0.32921,0.3701 -1.03537,1.146 0,0 -2.86797,-3.20174 -3.60445,-4.03117 C 5.02601,7.54044 4.93936,6.55047 5.53722,5.94401 6.12641,5.35092 7.03619,5.17255 7.76834,5.89496 L 8.63046,6.86263 C 9.07669,7.33977 9.26298,7.33531 9.67454,6.8983 9.99513,6.55939 10.7359,5.71658 10.9266,5.49808 10.5973,5.16809 10.333,4.90053 9.9778,4.53487 9.76552,4.76675 9.28464,5.30633 9.16767,5.43119 8.70411,4.91837 8.11926,4.0711 6.71993,4.05772 5.8708,4.05772 5.11699,4.42784 4.59712,4.9585 3.88662,5.76118 3.76099,6.44345 3.74799,6.81803 3.722,7.59395 3.80431,8.23163 4.74008,9.28403 6.26937,10.9875 8.14092,13.0611 8.59581,13.5605 9.04636,14.051 9.32363,14.0421 9.76552,13.5516 Z"}))),j=t=>e.createElement("svg",{width:19,height:19,viewBox:"0 0 19 19",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("g",{clipPath:"url(#clip0_1661_26179)"},e.createElement("g",{clipPath:"url(#clip1_1661_26179)"},e.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M3.12107 9.13825C3.12107 5.62359 5.97027 2.77439 9.48493 2.77439C12.9996 2.77439 15.8488 5.62359 15.8488 9.13825C15.8488 12.6529 12.9996 15.5021 9.48493 15.5021C5.97027 15.5021 3.12107 12.6529 3.12107 9.13825ZM9.48493 0.52832C4.7298 0.52832 0.875 4.38312 0.875 9.13825C0.875 13.8934 4.7298 17.7482 9.48493 17.7482C14.2401 17.7482 18.0949 13.8934 18.0949 9.13825C18.0949 4.38312 14.2401 0.52832 9.48493 0.52832ZM7.23882 5.76897C6.61858 5.76897 6.11578 6.27177 6.11578 6.892V11.3841C6.11578 12.0044 6.61858 12.5072 7.23882 12.5072H11.731C12.3512 12.5072 12.854 12.0044 12.854 11.3841V6.892C12.854 6.27177 12.3512 5.76897 11.731 5.76897H7.23882ZM8.36185 10.2611V8.01504H10.6079V10.2611H8.36185Z"}))),e.createElement("defs",null,e.createElement("clipPath",{id:"clip0_1661_26179"},e.createElement("rect",{width:18,height:18,fill:"white",transform:"translate(0.5 0.5)"})),e.createElement("clipPath",{id:"clip1_1661_26179"},e.createElement("rect",{width:17.9686,height:17.9686,fill:"white",transform:"translate(0.5 0.153809)"})))),y=t=>e.createElement("svg",{width:17,height:17,viewBox:"0 0 17 17",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("g",{clipPath:"url(#clip0_5667_1175)"},e.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M1 4.00016C1 3.44788 1.44772 3.00016 2 3.00016H14C14.5523 3.00016 15 3.44788 15 4.00016C15 4.55245 14.5523 5.00016 14 5.00016H2C1.44772 5.00016 1 4.55245 1 4.00016Z"}),e.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M6.66667 2.3335C6.57826 2.3335 6.49348 2.36861 6.43096 2.43113C6.36845 2.49364 6.33333 2.57842 6.33333 2.66683V3.00016H9.66667V2.66683C9.66667 2.57842 9.63155 2.49364 9.56904 2.43113C9.50652 2.36861 9.42174 2.3335 9.33333 2.3335H6.66667ZM11.6667 3.00016V2.66683C11.6667 2.04799 11.4208 1.4545 10.9832 1.01691C10.5457 0.579329 9.95217 0.333496 9.33333 0.333496H6.66667C6.04783 0.333496 5.45434 0.579329 5.01675 1.01691C4.57917 1.4545 4.33333 2.04799 4.33333 2.66683V3.00016H3.33333C2.78105 3.00016 2.33333 3.44788 2.33333 4.00016V13.3335C2.33333 13.9523 2.57917 14.5458 3.01675 14.9834C3.45434 15.421 4.04783 15.6668 4.66667 15.6668H11.3333C11.9522 15.6668 12.5457 15.421 12.9832 14.9834C13.4208 14.5458 13.6667 13.9523 13.6667 13.3335V4.00016C13.6667 3.44788 13.219 3.00016 12.6667 3.00016H11.6667ZM4.33333 5.00016V13.3335C4.33333 13.4219 4.36845 13.5067 4.43096 13.5692C4.49348 13.6317 4.57826 13.6668 4.66667 13.6668H11.3333C11.4217 13.6668 11.5065 13.6317 11.569 13.5692C11.6315 13.5067 11.6667 13.4219 11.6667 13.3335V5.00016H4.33333Z"}),e.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M9.33333 6.3335C9.88562 6.3335 10.3333 6.78121 10.3333 7.3335V11.3335C10.3333 11.8858 9.88562 12.3335 9.33333 12.3335C8.78105 12.3335 8.33333 11.8858 8.33333 11.3335V7.3335C8.33333 6.78121 8.78105 6.3335 9.33333 6.3335Z"}),e.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M6.66667 6.3335C7.21895 6.3335 7.66667 6.78121 7.66667 7.3335V11.3335C7.66667 11.8858 7.21895 12.3335 6.66667 12.3335C6.11438 12.3335 5.66667 11.8858 5.66667 11.3335V7.3335C5.66667 6.78121 6.11438 6.3335 6.66667 6.3335Z"})),e.createElement("defs",null,e.createElement("clipPath",{id:"clip0_5667_1175"},e.createElement("rect",{width:16.028,height:16.028,fill:"white",transform:"translate(0 0.251953)"})))),W=t=>e.createElement("svg",{width:16,height:18,viewBox:"0 0 16 18",fill:"none",...t},e.createElement("path",{d:"m 8,0.5 c -2.381386,0 -4.3339844,1.9525984 -4.3339844,4.3339844 0,2.381386 1.9525948,4.3320312 4.3339844,4.3320312 2.38139,0 4.333984,-1.9506271 4.333984,-4.3320312 C 12.333984,2.4525803 10.381386,0.5 8,0.5 Z m 0,2 c 1.3005103,0 2.333984,1.0334921 2.333984,2.3339844 0,1.3004922 -1.0334773,2.3320312 -2.333984,2.3320312 -1.3005067,0 -2.3339844,-1.0315209 -2.3339844,-2.3320312 C 5.6660156,3.533474 6.6994897,2.5 8,2.5 Z m -3.3339844,8 c -1.1488976,0 -2.2520727,0.457177 -3.0644531,1.269531 -0.81241753,0.812392 -1.26757812,1.915605 -1.26757812,3.064453 V 16.5 a 1,1 0 0 0 1.00000002,1 1,1 0 0 0 1,-1 v -1.666016 c 0,-0.61915 0.2457725,-1.212583 0.6835937,-1.65039 C 3.4554364,12.745749 4.046795,12.5 4.6660156,12.5 h 6.6679684 c 0.619143,0 1.210626,0.245782 1.648438,0.683594 0.437812,0.437812 0.683594,1.031248 0.683594,1.65039 V 16.5 a 1,1 0 0 0 1,1 1,1 0 0 0 1,-1 v -1.666016 c 0,-1.148855 -0.457145,-2.252066 -1.269532,-3.064453 C 13.584098,10.957145 12.48284,10.5 11.333984,10.5 Z"})),A=t=>e.createElement("svg",{width:18,height:19,viewBox:"0 0 18 19",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("g",{id:"icons-in-use",clipPath:"url(#clip0_400_13741)"},e.createElement("path",{id:"Union",fillRule:"evenodd",clipRule:"evenodd",d:"M9.04448 2.43367L8.98392 2.43359L8.92341 2.43368L8.75493 2.43428C8.60963 2.43496 8.40112 2.43632 8.14707 2.43904C7.63944 2.44447 6.94783 2.45534 6.21423 2.47714C5.48243 2.49888 4.69984 2.53176 4.01294 2.58186C3.35745 2.62967 2.69351 2.69889 2.25517 2.81612L2.23959 2.82041C1.69697 2.97392 1.20448 3.26792 0.811846 3.67269C0.419215 4.07746 0.140355 4.57868 0.0034326 5.12572C-0.00264338 5.15 -0.00790626 5.17447 -0.0123473 5.1991C-0.259841 6.57151 -0.381094 7.9637 -0.374589 9.35822C-0.383023 10.7633 -0.26176 12.1661 -0.0123389 13.5488C-0.00575995 13.5853 0.00262049 13.6214 0.0127716 13.6571C0.163723 14.1871 0.44883 14.6693 0.840547 15.057C1.23226 15.4446 1.71734 15.7248 2.24893 15.8702L2.25517 15.8719C2.69351 15.9891 3.35745 16.0583 4.01294 16.1061C4.69984 16.1562 5.48243 16.1891 6.21423 16.2109C6.94783 16.2327 7.63944 16.2435 8.14707 16.249C8.40112 16.2517 8.60963 16.253 8.75493 16.2537L8.92341 16.2543L8.98392 16.2544C8.98399 16.2544 8.98405 16.2544 8.98405 15.1314C8.98405 16.2544 8.98521 16.2544 8.98528 16.2544L9.04469 16.2543L9.21317 16.2537C9.35847 16.253 9.56698 16.2517 9.82103 16.249C10.3287 16.2435 11.0203 16.2327 11.7539 16.2109C12.4857 16.1891 13.2683 16.1562 13.9552 16.1061C14.6106 16.0583 15.2746 15.9891 15.7129 15.8719L15.7285 15.8676C16.2711 15.7141 16.7636 15.4201 17.1563 15.0153C17.5489 14.6105 17.8277 14.1093 17.9647 13.5623C17.9707 13.538 17.976 13.5135 17.9805 13.4889C18.2261 12.1266 18.3473 10.7447 18.3427 9.36047C18.3512 7.95518 18.2299 6.55211 17.9804 5.1691L16.8752 5.36846L17.9647 5.09578C17.8277 4.54874 17.5489 4.04752 17.1563 3.64274C16.7636 3.23797 16.2711 2.94398 15.7285 2.79046C15.7155 2.78677 15.7024 2.78331 15.6892 2.7801C15.2597 2.67523 14.604 2.61241 13.9481 2.56873C13.2632 2.52312 12.4821 2.49315 11.751 2.47331C11.0182 2.45343 10.3272 2.44352 9.81998 2.43856C9.56616 2.43608 9.35785 2.43484 9.21271 2.43422L9.04448 2.43367ZM15.544 5.20659C15.6543 5.32026 15.7346 5.45936 15.7779 5.61136C15.9978 6.84588 16.1044 8.09793 16.0966 9.35192L16.0966 9.36301C16.101 10.598 15.9944 11.8309 15.7778 13.0467C15.7346 13.1987 15.6543 13.3378 15.544 13.4515C15.4285 13.5706 15.2839 13.6577 15.1247 13.7042C14.9153 13.7586 14.4557 13.8176 13.7918 13.866C13.1507 13.9128 12.4041 13.9445 11.6872 13.9658C10.972 13.987 10.2954 13.9977 9.797 14.003C9.54802 14.0057 9.34405 14.007 9.20263 14.0077L9.03973 14.0083H8.92837L8.76547 14.0077C8.62405 14.007 8.42008 14.0057 8.1711 14.003C7.67269 13.9977 6.99607 13.987 6.28095 13.9658C5.56403 13.9445 4.81743 13.9128 4.17633 13.866C3.50728 13.8172 3.04575 13.7577 2.83864 13.7029C2.68086 13.6592 2.5369 13.5757 2.42051 13.4605C2.31421 13.3553 2.23416 13.2269 2.18652 13.0856C1.9691 11.8579 1.86372 10.6129 1.87155 9.36603L1.87148 9.35342C1.86533 8.10892 1.97203 6.86646 2.19026 5.64129C2.23354 5.48929 2.3138 5.3502 2.42406 5.23653C2.53964 5.11737 2.68417 5.03031 2.84345 4.98383C3.05283 4.92944 3.5124 4.87041 4.17633 4.82198C4.81743 4.77522 5.56403 4.74352 6.28095 4.72222C6.99607 4.70097 7.67269 4.69031 8.1711 4.68498C8.42008 4.68232 8.62405 4.68099 8.76547 4.68032L8.92837 4.67974L9.03995 4.67974L9.20309 4.68027C9.34467 4.68087 9.54884 4.68209 9.79804 4.68452C10.2969 4.68939 10.9741 4.69913 11.6901 4.71856C12.4076 4.73803 13.1558 4.76701 13.7988 4.80984C14.4502 4.85322 14.9126 4.9063 15.1358 4.95719C15.2906 5.00444 15.4311 5.0902 15.544 5.20659ZM7.8547 5.93471C7.50706 5.73702 7.08053 5.7391 6.73484 5.94018C6.38916 6.14127 6.17649 6.51101 6.17649 6.91093V11.8074C6.17649 12.2073 6.38916 12.577 6.73484 12.7781C7.08053 12.9792 7.50706 12.9813 7.8547 12.7836L12.1597 10.3354C12.5107 10.1357 12.7275 9.76298 12.7275 9.35914C12.7275 8.95531 12.5107 8.58256 12.1597 8.38293L7.8547 5.93471ZM9.33274 9.35914L8.42256 9.87676V8.84153L9.33274 9.35914Z"})),e.createElement("defs",null,e.createElement("clipPath",{id:"clip0_400_13741"},e.createElement("rect",{width:18,height:18,fill:"white",transform:"translate(0 0.75)"})))),T=t=>e.createElement("svg",{fill:"none",height:16,viewBox:"0 0 16 16",width:16,xmlns:"http://www.w3.org/2000/svg",...t},e.createElement("path",{clipRule:"evenodd",d:"m12.7071 4.70711c.3905-.39053.3905-1.02369 0-1.41422-.3905-.39052-1.0237-.39052-1.4142 0l-3.2929 3.2929-3.29289-3.2929c-.39053-.39052-1.02369-.39052-1.41422 0-.39052.39053-.39052 1.02369 0 1.41422l3.2929 3.29289-3.2929 3.2929c-.39052.3905-.39052 1.0237 0 1.4142.39053.3905 1.02369.3905 1.41422 0l3.29289-3.29289 3.2929 3.29289c.3905.3905 1.0237.3905 1.4142 0s.3905-1.0237 0-1.4142l-3.29289-3.2929z",fillRule:"evenodd"})),I={alertCircle:m,alertTriangle:w,arrowDown:g,arrowLeft:p,arrowRight:v,centeredText:E,check:f,checkCircle:u,edit:L,ellipse:x,euroSign:k,information:V,leftAlignedText:M,logo:_,nestedEllipse:H,pause:Z,plus:R,question:S,rightAlignedText:B,search:P,spinner:z,stop:j,trashCan:y,user:W,x:T,video:A},U=I,b="_icon_r529q_1",$={icon:b};function G({size:t="300",color:n,title:l,name:i,className:o,style:c,minTargetSizeInRem:a=0,...s}){const r=U[i]??null;if(!r)throw new Error(`Icon ${i} does not exist`);const d={fill:n&&`var(--betterplace-color-${n})`};return h.jsx(r,{...s,"aria-label":l,"aria-hidden":!l,className:C($.icon,o),style:{width:`var(--betterplace-sizing-${t})`,height:`var(--betterplace-sizing-${t})`,padding:`calc((${a}rem - var(--betterplace-sizing-${t})) / 2)`,boxSizing:"content-box",...d,...c}})}export{G as I,U as i}; diff --git a/assets/Icon.stories-Dh8mz0H1.js b/assets/Icon.stories-Dh8mz0H1.js new file mode 100644 index 0000000..450e9b8 --- /dev/null +++ b/assets/Icon.stories-Dh8mz0H1.js @@ -0,0 +1,6 @@ +import{g as t}from"./getTokenSufficesByPrefix-D1tEbekl.js";import{I as i,i as n}from"./Icon-DX5oPjN8.js";import"./semantic-BrXw8HCe.js";import"./jsx-runtime-BlAj40OV.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";const y={title:"Components/Icon",component:i,argTypes:{size:{description:"The size of the icon (Width * Height)",options:t("betterplace-sizing"),table:{defaultValue:{summary:"300"},type:{summary:"Sizing"}},control:{type:"select"}},color:{description:"The color of the icon",options:t("betterplace-color"),table:{type:{summary:"Color | undefined"}},control:{type:"select"}},name:{description:"The name of the icon",options:Object.keys(n),control:{type:"radio"},table:{type:{summary:"IconName"}}},title:{description:"The title that describes the icon",control:{type:"text"},table:{type:{summary:"string | undefined"}}},minTargetSizeInRem:{description:"The minimum target size of the icon independent of it's actual size. If the icon itself is smaller, a padding will be added around it to increase the click/touch area.",control:{type:"number"},table:{defaultValue:{summary:0},type:{summary:"number"}}},props:{control:!1,description:"All props (e.g. `className`, `style` etc.) are passed on to the root SVG element"}},parameters:{vitest:{testFile:"Icon.test.tsx"}}},e={args:{color:"bg-brand",name:"x"}};var o,r,s;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`{ + args: { + color: 'bg-brand', + name: 'x' + } +}`,...(s=(r=e.parameters)==null?void 0:r.docs)==null?void 0:s.source}}};const f=["Default"];export{e as Default,f as __namedExportsOrder,y as default}; diff --git a/assets/IconButton.stories-DwbnSsZt.js b/assets/IconButton.stories-DwbnSsZt.js new file mode 100644 index 0000000..a234eb5 --- /dev/null +++ b/assets/IconButton.stories-DwbnSsZt.js @@ -0,0 +1,32 @@ +import{j as r}from"./jsx-runtime-BlAj40OV.js";import{i as b}from"./Icon-DX5oPjN8.js";import{C as k}from"./ClientIconButton-CsrI0D2P.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";import"./Button-CmRA-hR5.js";import"./preventDefault-M1KdZT7V.js";function B(i){return r.jsx("div",{style:{padding:"var(--betterplace-spacing-100)",background:i.ghost?"var(--betterplace-color-bg-dark)":void 0,containerType:"inline-size"},children:r.jsx(k,{...i})})}const S={title:"Components/IconButton",component:B,argTypes:{children:{control:{type:"text"},description:"The (text) content of the button."},kind:{options:["primary","secondary","danger","plain"],control:{type:"radio"},description:"Applies specific design",table:{defaultValue:{summary:"primary"},type:{summary:"ButtonKind | undefined"}}},size:{options:["large","default","small","input"],control:{type:"radio"},description:"Size of the button",table:{defaultValue:{summary:"default"},type:{summary:"ButtonSize | undefined"}}},as:{options:["button","a"],control:"radio",description:"HTML tag"},disabled:{control:{type:"boolean"},description:"Toggles aria-disabled. We use aria-disabled instead of disabled to keep focusability and with that the possibility to add a description that reasons the disabled state.",table:{defaultValue:{summary:"false"}}},iconName:{description:"The name of the icon to be displayed in the button.",options:[...Object.keys(b),void 0],control:{type:"radio"},table:{type:{summary:"IconName"}}},iconPosition:{description:"Position of the selected icon in the button.",options:["left","right",void 0],control:{type:"radio"},table:{type:{summary:"left | right | undefined",defaultValue:"left"}}},ghost:{description:"Additional styling options for ghost style button, which includes transparent button background and light font color for darker backgrounds.",control:{type:"boolean"}},iconProps:{description:"All props of the Icon component, except the `name` are passed down to the selected icon.",table:{type:{summary:"IconProps"}}},props:{control:!1,description:"IconButton props extend the original Button component props. All other props (e.g. `href`, `onClick`) are passed on to the root JSX element"}}},o={args:{children:"Donate now",kind:"primary",as:"button",size:"default",ghost:!1,iconName:"checkCircle",iconPosition:"left"}},t={args:{children:"Turn around!",iconName:"arrowLeft",iconPosition:"left",kind:"plain",size:"small"}},e={args:{children:"Do not click!",iconName:"alertCircle",kind:"danger",iconPosition:"right"}},n={args:{iconName:"x",kind:"plain",title:"Close"}};var a,s,c;o.parameters={...o.parameters,docs:{...(a=o.parameters)==null?void 0:a.docs,source:{originalSource:`{ + args: { + children: 'Donate now', + kind: 'primary', + as: 'button', + size: 'default', + ghost: false, + iconName: 'checkCircle', + iconPosition: 'left' + } +}`,...(c=(s=o.parameters)==null?void 0:s.docs)==null?void 0:c.source}}};var l,d,p;t.parameters={...t.parameters,docs:{...(l=t.parameters)==null?void 0:l.docs,source:{originalSource:`{ + args: { + children: 'Turn around!', + iconName: 'arrowLeft', + iconPosition: 'left', + kind: 'plain', + size: 'small' + } +}`,...(p=(d=t.parameters)==null?void 0:d.docs)==null?void 0:p.source}}};var u,m,h;e.parameters={...e.parameters,docs:{...(u=e.parameters)==null?void 0:u.docs,source:{originalSource:`{ + args: { + children: 'Do not click!', + iconName: 'alertCircle', + kind: 'danger', + iconPosition: 'right' + } +}`,...(h=(m=e.parameters)==null?void 0:m.docs)==null?void 0:h.source}}};var f,g,y;n.parameters={...n.parameters,docs:{...(f=n.parameters)==null?void 0:f.docs,source:{originalSource:`{ + args: { + iconName: 'x', + kind: 'plain', + title: 'Close' + } +}`,...(y=(g=n.parameters)==null?void 0:g.docs)==null?void 0:y.source}}};const v=["Default","ButtonWithLeftIcon","ButtonWithRightIcon","OnlyIconButton"];export{t as ButtonWithLeftIcon,e as ButtonWithRightIcon,o as Default,n as OnlyIconButton,v as __namedExportsOrder,S as default}; diff --git a/assets/JSONPrettyPrint-DZmPkKST.css b/assets/JSONPrettyPrint-DZmPkKST.css new file mode 100644 index 0000000..8263421 --- /dev/null +++ b/assets/JSONPrettyPrint-DZmPkKST.css @@ -0,0 +1 @@ +._JSONPrettyPrintMain_qmy6t_2{padding:5px}._string_qmy6t_6{color:green}._number_qmy6t_10{color:#ff8c00}._boolean_qmy6t_14{color:#00f}._null_qmy6t_18{color:#f0f}._key_qmy6t_22{color:red} diff --git a/assets/JSONPrettyPrint.stories-B7HtmAhL.js b/assets/JSONPrettyPrint.stories-B7HtmAhL.js new file mode 100644 index 0000000..b231398 --- /dev/null +++ b/assets/JSONPrettyPrint.stories-B7HtmAhL.js @@ -0,0 +1,12 @@ +import{j as l}from"./jsx-runtime-BlAj40OV.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";const u="_JSONPrettyPrintMain_qmy6t_2",c="_string_qmy6t_6",f="_number_qmy6t_10",p="_boolean_qmy6t_14",y="_key_qmy6t_22",r={JSONPrettyPrintMain:u,string:c,number:f,boolean:p,null:"_null_qmy6t_18",key:y};function m(){const e=new WeakSet;return(n,t)=>{if(!(typeof Node=="function"&&t instanceof Node)){if(typeof t=="object"&&t!==null){if(e.has(t))return;e.add(t)}return t}}}function _(e,n=2){return JSON.stringify(e,m(),n)}function g(e){return e=e.replace(/&/g,"&").replace(//g,">"),e.replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+-]?\d+)?)/g,n=>{let t=r.number;return/^"/.test(n)?/:$/.test(n)?t=r.key:t=r.string:/true|false/.test(n)?t=r.boolean:/null/.test(n)&&(t=r.null),t??(t=""),`${n}`})}function b({json:e}){const n=typeof e=="string"?e:_(e,2),t=g(n);return l.jsx("pre",{className:r.JSONPrettyPrintMain,dangerouslySetInnerHTML:{__html:t}})}const N={component:b,parameters:{vitest:{testFile:"JSONPrettyPrint.test.tsx"}}},s={args:{json:{bar:"Lorem ipsum sic dolor",baz:["it is a string",{foo:!1,sus:null}],bub:123}}};var o,i,a;s.parameters={...s.parameters,docs:{...(o=s.parameters)==null?void 0:o.docs,source:{originalSource:`{ + args: { + json: { + bar: 'Lorem ipsum sic dolor', + baz: ['it is a string', { + foo: false, + sus: null + }], + bub: 123 + } + } +}`,...(a=(i=s.parameters)==null?void 0:i.docs)==null?void 0:a.source}}};const O=["Default"];export{s as Default,O as __namedExportsOrder,N as default}; diff --git a/assets/LayoutAccordion-C4NCok-2.css b/assets/LayoutAccordion-C4NCok-2.css new file mode 100644 index 0000000..881108c --- /dev/null +++ b/assets/LayoutAccordion-C4NCok-2.css @@ -0,0 +1 @@ +._accordion_6m6m6_1{inline-size:100%;flex:1}._accordionItem_6m6m6_6{border-radius:var(--betterplace-radius-100);transition:all .5s ease;background-color:var(--betterplace-color-neutral-50)}._accordionItem_6m6m6_6 ._content_6m6m6_11{overflow:hidden;padding-block:var(--betterplace-spacing-300)}._accordionItem_6m6m6_6 ._wrapper_6m6m6_16{display:grid;grid-template-rows:0fr;opacity:0;transform:translateY(-10px);clip-path:inset(0 0 100% 0);transition:all .5s ease}._accordionSummary_6m6m6_26{flex-grow:0;display:flex;align-items:center;justify-content:space-between;padding-inline:var(--betterplace-spacing-200);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;border-bottom:var(--betterplace-border-light);position:relative}._accordionSummary_6m6m6_26>*{inline-size:100%}._accordionSummary_6m6m6_26 ._accordionIcon_6m6m6_41{transition:transform .5s ease;inline-size:unset;pointer-events:none;position:absolute;display:block;right:var(--betterplace-spacing-200);top:0;bottom:0;margin:auto 0;z-index:10}._accordionSummary_6m6m6_26::-webkit-details-marker{display:none}._open_6m6m6_59 ._accordionIcon_6m6m6_41{transform:rotate(180deg)}._open_6m6m6_59 ._wrapper_6m6m6_16{grid-template-rows:1fr;opacity:1;transform:translateY(0);clip-path:inset(0 0 0 0)}._closing_6m6m6_72 ._wrapper_6m6m6_16{grid-template-rows:0fr;opacity:0;transform:translateY(-10px);clip-path:inset(0 0 100% 0)} diff --git a/assets/LayoutAccordion-Cce0sNYb.js b/assets/LayoutAccordion-Cce0sNYb.js new file mode 100644 index 0000000..05f2db3 --- /dev/null +++ b/assets/LayoutAccordion-Cce0sNYb.js @@ -0,0 +1 @@ +import{j as c}from"./jsx-runtime-BlAj40OV.js";import{L as C}from"./LayoutStack-DCdAGefl.js";import{r as t}from"./index-Cs7sjTYM.js";import{c as x}from"./index-Bl6ORisp.js";import{I as S}from"./Icon-DX5oPjN8.js";import{g}from"./PopupContext-CCyEydDt.js";import"./index-BU4L-DQy.js";import{p as v}from"./preventDefault-M1KdZT7V.js";const N="_accordion_6m6m6_1",K="_accordionItem_6m6m6_6",h="_content_6m6m6_11",E="_wrapper_6m6m6_16",R="_accordionSummary_6m6m6_26",L="_accordionIcon_6m6m6_41",T="_open_6m6m6_59",b="_closing_6m6m6_72",r={accordion:N,accordionItem:K,content:h,wrapper:E,accordionSummary:R,accordionIcon:L,open:T,closing:b},w=t.createContext({activeKey:void 0,prevKey:void 0,onTransitionFinished:u=>{}});function A(){return t.useContext(w)}function H({label:u,id:o,className:s,children:a}){const{activeKey:n,onTransitionFinished:i,prevKey:m}=A(),[d,_]=t.useState(n===o||m===o),p=t.useRef(null),e=t.useRef(null),y=t.useCallback(l=>{l.propertyName==="opacity"&&l.target===p.current&&n===o&&(i(o),window.requestAnimationFrame(()=>{if(!e.current)return;const f=g(e.current);if(!f)return;const{top:I}=e.current.getBoundingClientRect(),j=f===window?0:f.offsetTop;f.scrollBy({behavior:"smooth",top:I-j})}))},[n,o,i]);return t.useEffect(()=>{if(n===m)return;const l=setTimeout(()=>_(n===o),1);return()=>clearTimeout(l)},[o,n,m]),c.jsxs("details",{open:!0,id:o,"aria-expanded":n===o?"true":"false",className:x(r.accordionItem,{[r.open]:d},s),ref:e,children:[c.jsxs("summary",{onClick:v,onKeyDown:v,className:r.accordionSummary,children:[u,c.jsx(S,{name:"arrowDown",className:r.accordionIcon,size:"400"})]}),c.jsx("div",{className:r.wrapper,onTransitionEnd:y,ref:p,children:c.jsx("div",{className:r.content,children:a})})]})}function J({defaultKey:u,children:o,activeKey:s,onTransitionFinished:a,className:n}){const[i,m]=t.useState(void 0),[d,_]=t.useState(s??u),p=t.useCallback(e=>{a==null||a(e,i),m(e)},[a,i]);return t.useEffect(()=>{s&&(_(s),m(d))},[s]),c.jsx(C,{className:x(r.accordion,n),children:c.jsx(w.Provider,{value:{activeKey:d,onTransitionFinished:p,prevKey:i},children:o})})}export{J as L,H as a}; diff --git a/assets/LayoutAccordion.stories-CBPukS9U.js b/assets/LayoutAccordion.stories-CBPukS9U.js new file mode 100644 index 0000000..53613d0 --- /dev/null +++ b/assets/LayoutAccordion.stories-CBPukS9U.js @@ -0,0 +1,32 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{L as u,a as r}from"./LayoutAccordion-Cce0sNYb.js";import{C as a}from"./ClientButton-DhJqhttM.js";import{r as m}from"./index-Cs7sjTYM.js";import"./LayoutStack-DCdAGefl.js";import"./index-Bl6ORisp.js";import"./_commonjsHelpers-BosuxZz1.js";import"./Icon-DX5oPjN8.js";import"./PopupContext-CCyEydDt.js";import"./index-BU4L-DQy.js";import"./preventDefault-M1KdZT7V.js";import"./Button-CmRA-hR5.js";const p={1:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",2:"Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",3:"Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur."},c=({id:o})=>e.jsx("div",{children:e.jsx("p",{children:p[o]})}),t={args:{activeKey:"2",defaultKey:"1",onTransitionFinished:(o,i)=>{console.log("Transition finished:",{next:o,previous:i})}},render:o=>{const[i,n]=m.useState(o.activeKey??o.defaultKey);return e.jsxs(u,{...o,activeKey:i,children:[e.jsx(r,{id:"1",label:e.jsx(a,{kind:"plain",onClick:()=>n("1"),children:"Section 1"}),children:e.jsx(c,{id:"1"},"1")}),e.jsx(r,{id:"2",label:e.jsx(a,{kind:"plain",onClick:()=>n("2"),children:"Section 2"}),children:e.jsx(c,{id:"2"})},"2"),e.jsx(r,{id:"3",label:e.jsx(a,{kind:"plain",onClick:()=>n("3"),children:"Section 3"}),children:e.jsx(c,{id:"3"})},"3")]})}},K={title:"Components/Layout components/LayoutAccordion",component:u,tags:["autodocs"],args:{activeKey:"2",defaultKey:"2",onTransitionEnd:console.log}};var s,d,l;t.parameters={...t.parameters,docs:{...(s=t.parameters)==null?void 0:s.docs,source:{originalSource:`{ + args: { + activeKey: '2', + defaultKey: '1', + onTransitionFinished: (next: string, previous: string | undefined) => { + console.log('Transition finished:', { + next, + previous + }); + } + }, + render: (args: LayoutAccordionProps) => { + const [selected, setSelected] = useState(args.activeKey ?? args.defaultKey); + return + setSelected('1')}> + Section 1 + }> + + + setSelected('2')}> + Section 2 + }> + + + setSelected('3')}> + Section 3 + }> + + + ; + } +}`,...(l=(d=t.parameters)==null?void 0:d.docs)==null?void 0:l.source}}};const b=["Default"];export{t as Default,b as __namedExportsOrder,K as default}; diff --git a/assets/LayoutCenter-DnQbzSZR.css b/assets/LayoutCenter-DnQbzSZR.css new file mode 100644 index 0000000..eb7a5a5 --- /dev/null +++ b/assets/LayoutCenter-DnQbzSZR.css @@ -0,0 +1 @@ +._center_8efln_1{display:block;box-sizing:border-box;margin-inline:auto;max-inline-size:var(--container-size);inline-size:100%;padding-inline:var(--container-gutters);container-type:inline-size;contain:none}._centerIntrinsic_8efln_12{display:flex;flex-direction:column;align-items:center;text-align:center}._container_8efln_19{container-type:inline-size}._flex_8efln_23{flex:1} diff --git a/assets/LayoutCenter.stories-Dw0lOTyp.js b/assets/LayoutCenter.stories-Dw0lOTyp.js new file mode 100644 index 0000000..318944f --- /dev/null +++ b/assets/LayoutCenter.stories-Dw0lOTyp.js @@ -0,0 +1,5 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{c as g}from"./index-Bl6ORisp.js";import{g as o}from"./getTokenSufficesByPrefix-D1tEbekl.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./semantic-BrXw8HCe.js";const b="_center_8efln_1",h="_centerIntrinsic_8efln_12",x="_container_8efln_19",_="_flex_8efln_23",t={center:b,centerIntrinsic:h,container:x,flex:_};function v({as:l="div",maxSize:c="fix-content-total",gutter:d="300",className:p,centeredChildren:u,container:m,flex:f,style:y,...r}){return e.jsx(l,{...r,className:g(t.center,{[t.centerIntrinsic]:u,[t.container]:m,[t.flex]:f},p),style:{"--container-size":`var(--betterplace-sizing-${c})`,"--container-gutters":`var(--betterplace-spacing-${d})`,...y},children:r.children})}const C=()=>e.jsxs(e.Fragment,{children:[e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"}),e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)",inlineSize:"100%"},children:"Content (full width)"})]}),I={title:"Components/Layout components/LayoutCenter",component:v,argTypes:{as:{description:"HTML tag of container",table:{defaultValue:{summary:"div"}},control:{type:"select"},options:["div","section","header","footer","nav","main","search"]},maxSize:{description:"Maximum width of container",options:o("betterplace-sizing"),table:{defaultValue:{summary:"fix-content-total"},type:{summary:"Sizing | undefined"}},control:{type:"select"}},gutter:{description:"Minimum space on either side of content",options:o("betterplace-spacing"),table:{defaultValue:{summary:"100"},type:{summary:"Spacing | undefined"}},control:{type:"select"}},centeredChildren:{description:"Center child elements",table:{defaultValue:{summary:!1},type:{summary:"boolean"}},control:"boolean"},container:{description:"Should it be treated as container (container-type: inline-size)",table:{defaultValue:{summary:!1}},control:"boolean"},flex:{description:"Should it shrink or grow in another layout - equivalent of flex: 1",table:{defaultValue:{summary:!1}},control:"boolean"},children:{control:!1,description:"Child elements to be rendered"},props:{control:!1,description:"All props (e.g. style and className) are passed on to the root JSX element"}}},n={args:{children:e.jsx(C,{})}};var a,i,s;n.parameters={...n.parameters,docs:{...(a=n.parameters)==null?void 0:a.docs,source:{originalSource:`{ + args: { + children: + } +}`,...(s=(i=n.parameters)==null?void 0:i.docs)==null?void 0:s.source}}};const w=["Default"];export{n as Default,w as __namedExportsOrder,I as default}; diff --git a/assets/LayoutCluster-BkRwq4A8.js b/assets/LayoutCluster-BkRwq4A8.js new file mode 100644 index 0000000..9bd5721 --- /dev/null +++ b/assets/LayoutCluster-BkRwq4A8.js @@ -0,0 +1 @@ +import{j as d}from"./jsx-runtime-BlAj40OV.js";import{r as j}from"./index-Cs7sjTYM.js";import{c as l}from"./index-Bl6ORisp.js";const p="_cluster_m1uri_1",y="_clustered_m1uri_7",m="_flex_m1uri_11",S="_justified_m1uri_15",x="_justifyStart_m1uri_19",C="_justifyCenter_m1uri_23",w="_justifyEnd_m1uri_27",E="_justifySpaceBetween_m1uri_31",A="_justifySpaceAround_m1uri_35",B="_container_m1uri_39",L="_noWrap_m1uri_43",t={cluster:p,clustered:y,flex:m,justified:S,justifyStart:x,justifyCenter:C,justifyEnd:w,justifySpaceBetween:E,justifySpaceAround:A,container:B,noWrap:L},W=j.forwardRef(function({as:u="div",alignment:s="clustered",justify:e="start",container:n,className:c,flex:i,wrap:a=!0,space:o="200",style:_,...r},f){return d.jsx(u,{...r,className:l(t.cluster,c,{[t.justified]:s==="justified",[t.clustered]:s==="clustered",[t.justifyStart]:e==="start",[t.justifyEnd]:e==="end",[t.justifyCenter]:e==="center",[t.justifySpaceAround]:e==="space-around",[t.justifySpaceBetween]:e==="space-between",[t.container]:n,[t.flex]:i,[t.noWrap]:!a}),ref:f,style:{..._,"--space":`var(--betterplace-spacing-${o})`},children:r.children})}),R=W;export{R as L}; diff --git a/assets/LayoutCluster-zKwun7Ef.css b/assets/LayoutCluster-zKwun7Ef.css new file mode 100644 index 0000000..3b45e37 --- /dev/null +++ b/assets/LayoutCluster-zKwun7Ef.css @@ -0,0 +1 @@ +._cluster_m1uri_1{display:flex;flex-flow:row wrap;gap:var(--space)}._clustered_m1uri_7>*{flex:0 0 auto}._flex_m1uri_11{flex:1}._justified_m1uri_15>*{flex:1 1 0}._justifyStart_m1uri_19{justify-content:flex-start}._justifyCenter_m1uri_23{justify-content:center}._justifyEnd_m1uri_27{justify-content:flex-end}._justifySpaceBetween_m1uri_31{justify-content:space-between}._justifySpaceAround_m1uri_35{justify-content:space-around}._container_m1uri_39{container-type:inline-size}._noWrap_m1uri_43{flex-wrap:nowrap} diff --git a/assets/LayoutCluster.stories-D76nlJyV.js b/assets/LayoutCluster.stories-D76nlJyV.js new file mode 100644 index 0000000..ca320bf --- /dev/null +++ b/assets/LayoutCluster.stories-D76nlJyV.js @@ -0,0 +1,5 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{L as n}from"./LayoutCluster-BkRwq4A8.js";import{g as l}from"./getTokenSufficesByPrefix-D1tEbekl.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";import"./semantic-BrXw8HCe.js";const s=()=>e.jsxs(e.Fragment,{children:[e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"}),e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"}),e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"}),e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"})]}),h={title:"Components/Layout components/LayoutCluster",component:n,argTypes:{as:{description:"HTML tag of container",table:{defaultValue:{summary:"div"}},control:{type:"select"},options:["div","section","header","footer","nav","main","search","ul","aside"]},alignment:{description:"Should the elements just keep their natural width or should they grow to fill the space?",table:{defaultValue:{summary:"clustered"}},control:{type:"radio"},options:["clustered","justified","intrinsic"]},justify:{description:"Should elements be placed at the beginning, end, or centre of the container",table:{defaultValue:{summary:"start"}},control:{type:"radio"},options:["start","end","center","space-between","space-around"]},flex:{description:"Should it shrink or grow in another layout - equivalent of flex: 1",table:{defaultValue:{summary:!1}},control:"boolean"},wrap:{description:"Should it wrap the children",table:{defaultValue:{summary:!0}},control:"boolean"},container:{description:"Should it be treated as container (container-type: inline-size)",table:{defaultValue:{summary:!1}},control:"boolean"},space:{description:"Space between children",options:l("betterplace-spacing"),table:{defaultValue:{summary:"100"},control:{type:"select"},type:{summary:"Spacing | undefined"}},control:{type:"select"}},children:{control:!1,description:"Child elements to be rendered"},props:{control:!1,description:"All props (e.g. style and className) are passed on to the root JSX element"}}},t={args:{children:e.jsx(s,{})}};var r,o,a;t.parameters={...t.parameters,docs:{...(r=t.parameters)==null?void 0:r.docs,source:{originalSource:`{ + args: { + children: + } +}`,...(a=(o=t.parameters)==null?void 0:o.docs)==null?void 0:a.source}}};const b=["Default"];export{t as Default,b as __namedExportsOrder,h as default}; diff --git a/assets/LayoutGrid-CAiAGpsM.css b/assets/LayoutGrid-CAiAGpsM.css new file mode 100644 index 0000000..4e74011 --- /dev/null +++ b/assets/LayoutGrid-CAiAGpsM.css @@ -0,0 +1 @@ +._grid_hx5c1_1{display:grid;gap:var(--space)}._gridAutoFit_hx5c1_6{grid-template-columns:repeat(auto-fit,minmax(var(--min),1fr))}._gridColumns_hx5c1_10{grid-template-columns:repeat(var(--columns),1fr)}._flex_hx5c1_14{flex:1} diff --git a/assets/LayoutGrid.stories-4e3vB5d8.js b/assets/LayoutGrid.stories-4e3vB5d8.js new file mode 100644 index 0000000..6d6f4cc --- /dev/null +++ b/assets/LayoutGrid.stories-4e3vB5d8.js @@ -0,0 +1,5 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{c as u}from"./index-Bl6ORisp.js";import{g as m}from"./getTokenSufficesByPrefix-D1tEbekl.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./semantic-BrXw8HCe.js";const g="_grid_hx5c1_1",f="_gridAutoFit_hx5c1_6",y="_gridColumns_hx5c1_10",h="_flex_hx5c1_14",t={grid:g,gridAutoFit:f,gridColumns:y,flex:h};function x({children:l,space:c="200",columns:o,minElementWidth:n,flex:d,style:p}){return e.jsx("div",{className:u(t.grid,{[t.gridAutoFit]:!o&&n,[t.gridColumns]:!!o,[t.flex]:d}),style:{...p,"--space":`var(--betterplace-spacing-${c})`,"--min":n,"--columns":o},children:l})}const b=()=>e.jsxs(e.Fragment,{children:[e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"}),e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"}),e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"}),e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"})]}),k={title:"Components/Layout components/LayoutGrid",component:x,argTypes:{columns:{description:"Number of columns for the CSS grid. The number of columns cannot be used with `minElementWidth` property.",table:{type:{summary:"number"},defaultValue:{summary:"undefined"}},control:{type:"text"}},minElementWidth:{description:"The min value for the `minmax()` function used for the `auto-fit`. `columns` prop has priority over `minElementWidth`.",control:{type:"text"},table:{type:{summary:"px | rem | em | ch"},defaultValue:{summary:"undefined"}}},space:{description:"Space between children",options:m("betterplace-spacing"),table:{defaultValue:{summary:"100"},control:{type:"select"},type:{summary:"Spacing | undefined"}},control:{type:"select"}},flex:{description:"Should it shrink or grow in another layout - equivalent of flex: 1",table:{defaultValue:{summary:!1}},control:"boolean"},children:{control:!1,description:"Child elements to be rendered"},props:{control:!1,description:"All props (e.g. style and className) are passed on to the root JSX element"}}},r={args:{children:e.jsx(b,{})}};var a,s,i;r.parameters={...r.parameters,docs:{...(a=r.parameters)==null?void 0:a.docs,source:{originalSource:`{ + args: { + children: + } +}`,...(i=(s=r.parameters)==null?void 0:s.docs)==null?void 0:i.source}}};const A=["Default"];export{r as Default,A as __namedExportsOrder,k as default}; diff --git a/assets/LayoutModal-BSqEDk1U.css b/assets/LayoutModal-BSqEDk1U.css new file mode 100644 index 0000000..6d0ffd0 --- /dev/null +++ b/assets/LayoutModal-BSqEDk1U.css @@ -0,0 +1 @@ +._modal_1b6hs_1{white-space:normal;display:block!important;position:fixed;top:0;bottom:0;margin:auto;z-index:1040;transition:opacity .3s ease-out,transform .3s ease-out;background-color:var(--betterplace-color-bg-light);border-radius:var(--betterplace-border-radius-300);border-width:0;padding:0;max-inline-size:calc(100% - var(--betterplace-spacing-200) * 2);max-block-size:calc(100% - var(--betterplace-spacing-200) * 2);box-shadow:0 0 .5rem 200vw var(--betterplace-color-bg-on-top-dark, rgb(0 0 0 / 40%));color:var(--betterplace-color-fg-content-primary)}@media screen and (max-width: 450px){._modal_1b6hs_1{margin:var(--betterplace-spacing-200)!important;top:0;right:0;bottom:0;left:0}}._modal_1b6hs_1::backdrop{z-index:1039;top:0;right:0;bottom:0;left:0;opacity:0}._modal_1b6hs_1[open]{transform:translateY(0);opacity:1}._modal_1b6hs_1:not([open]){transform:translateY(-50vh);opacity:0;pointer-events:none}@media (forced-colors: active){._modal_1b6hs_1{border-width:var(--betterplace-sizing-300)}}body:has(dialog._modal_1b6hs_1[open]){overflow:hidden}._modalInner_1b6hs_52{max-inline-size:var(--betterplace-sizing-fix-content-total)}._modalHeader_1b6hs_56{display:flex;align-items:flex-start;padding:var(--betterplace-spacing-300);padding-block-end:0}._modalHeader_1b6hs_56:after{content:"";display:inline-block;inline-size:var(--betterplace-spacing-400);padding-inline:var(--betterplace-spacing-400)}._closeButton_1b6hs_71{position:absolute;inset-block-start:var(--betterplace-spacing-50);inset-inline-end:var(--betterplace-spacing-50)}._modalContent_1b6hs_77{padding-inline:var(--betterplace-spacing-300)}._modalActions_1b6hs_81{display:flex;flex-wrap:wrap;gap:var(--betterplace-spacing-300);justify-content:flex-end;padding:var(--betterplace-spacing-300);padding-block-start:0} diff --git a/assets/LayoutModal-DfVyIvg1.js b/assets/LayoutModal-DfVyIvg1.js new file mode 100644 index 0000000..65b886d --- /dev/null +++ b/assets/LayoutModal-DfVyIvg1.js @@ -0,0 +1 @@ +import{j as o}from"./jsx-runtime-BlAj40OV.js";import{c as l}from"./index-Bl6ORisp.js";import{C as $}from"./ClientButton-DhJqhttM.js";import{H as q}from"./Heading-C6c2EMQE.js";import{C as F}from"./ClientIconButton-CsrI0D2P.js";import{L as z}from"./LayoutStack-DCdAGefl.js";import"./LayoutCluster-BkRwq4A8.js";import{r as n}from"./index-Cs7sjTYM.js";import{u as G}from"./useForwardedRef-Bxam_td3.js";const J="_modal_1b6hs_1",Q="_modalInner_1b6hs_52",T="_modalHeader_1b6hs_56",U="_closeButton_1b6hs_71",V="_modalContent_1b6hs_77",W="_modalActions_1b6hs_81",i={modal:J,modalInner:Q,modalHeader:T,closeButton:U,modalContent:V,modalActions:W};function X(d){d&&(!("close"in d)||typeof d.close!="function"||d.close())}const at=n.forwardRef(function({id:_,isOpen:u,onClose:s,onOpen:m,onCloseComplete:f,onOpenComplete:h,title:E,customActions:I,children:A,manualFocusRef:L,closeText:g,closeOnClickOutside:w=!0,hideHeader:B=!1,hideActions:H=!1,classNames:c={}},R){const[r,D]=G(R),x=n.useRef(null),[K,p]=n.useState(!0),C=n.useCallback(()=>L||(x.current?x:r),[L,r]),M=n.useId(),j=_||M,b=n.useCallback(t=>{var N;if(t.key==="Escape")return s(t);if(t.key!=="Tab")return;const e=(N=r.current)==null?void 0:N.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'),a=e==null?void 0:e[0],y=e==null?void 0:e[e.length-1];if(t.shiftKey&&document.activeElement===a){t.preventDefault(),y==null||y.focus();return}!t.shiftKey&&document.activeElement===y&&(t.preventDefault(),a==null||a.focus())},[r,s]),v=n.useCallback(()=>{f==null||f(),p(!0)},[f]),k=n.useCallback(()=>{var t;h==null||h(),p(!0),(t=r.current)==null||t.removeAttribute("inert")},[r,h]);n.useEffect(()=>{var e;p(!1);const t=r.current;if(t){if(u){t.showModal();const a=C();(e=a==null?void 0:a.current)==null||e.focus(),t.removeEventListener("transitionend",v),t.addEventListener("keydown",b),t.addEventListener("transitionend",k),m==null||m()}else t.removeEventListener("keydown",b),t.removeEventListener("transitionend",k),t.addEventListener("transitionend",v),X(t),t.setAttribute("inert","");return()=>{t==null||t.removeEventListener("keydown",b),t.removeEventListener("transitionend",v),t.removeEventListener("transitionend",k)}}},[C,b,u,r,v,m,k]);const P=n.useCallback(t=>{const{current:e}=r;t.target===e&&s(t)},[r,s]);return o.jsxs("dialog",{id:j,ref:D,className:l(i.modal,c.modal),onCancel:s,onClick:w?P:void 0,"aria-labelledby":`modal-title-${j}`,"aria-modal":"true",title:E,tabIndex:-1,children:[o.jsxs(z,{space:"400",className:l(i.modalInner,c.modalInner),children:[!B&&o.jsxs("div",{className:l(i.modalHeader,c.titleContainer),children:[o.jsx(q,{level:"h200",as:"h2",id:`modal-title-${j}`,children:E}),o.jsx(F,{kind:"plain",className:i.closeButton,onClick:s,ref:x,type:"button",iconName:"x",iconProps:{title:g,color:"fg-content-primary"}})]}),o.jsx("div",{className:l(i.modalContent,c.contentContainer),children:(u||!K)&&A}),!H&&o.jsx("div",{className:l(i.modalActions,c.actionsContainer),children:I||o.jsx($,{onClick:s,type:"button",children:g})})]}),u&&o.jsx("div",{id:"bp-portal-target",style:{position:"absolute",top:0,left:0},role:"alert"})]})});export{at as L}; diff --git a/assets/LayoutModal.stories-siGh02gT.js b/assets/LayoutModal.stories-siGh02gT.js new file mode 100644 index 0000000..c5c7474 --- /dev/null +++ b/assets/LayoutModal.stories-siGh02gT.js @@ -0,0 +1,14 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{B as n}from"./Button-CmRA-hR5.js";import{L as f}from"./LayoutModal-DfVyIvg1.js";import{r as l}from"./index-Cs7sjTYM.js";import"./index-Bl6ORisp.js";import"./_commonjsHelpers-BosuxZz1.js";import"./ClientButton-DhJqhttM.js";import"./preventDefault-M1KdZT7V.js";import"./Heading-C6c2EMQE.js";import"./LayoutStack-DCdAGefl.js";import"./LayoutCluster-BkRwq4A8.js";import"./ClientIconButton-CsrI0D2P.js";import"./Icon-DX5oPjN8.js";import"./useForwardedRef-Bxam_td3.js";const h={id:"3712:19327",url:"https://www.figma.com/file/PJ7OUutWRrSHW6qgaPNW1l/DS-betterplace-GENERAL?node-id=3712-19327",themes:[]};var x={BASE_URL:"./",DEV:!1,MODE:"production",PROD:!0,SSR:!1,STORYBOOK:"true",STORYBOOK_BASE_URL:"/betterplace-design-system/"};function g(){const[a,t]=l.useState(!1);return e.jsxs(e.Fragment,{children:[e.jsx(n,{onClick:()=>t(!0),children:"Open modal"}),e.jsx(f,{onClose:()=>t(!1),isOpen:a,title:"This is the title of the modal",closeText:"Close",children:"There can be any content in the modal. The modal has a close button by default."})]})}function T(){const[a,t]=l.useState(!1),i=l.useRef(null);return e.jsxs(e.Fragment,{children:[e.jsx(n,{onClick:()=>t(!0),children:"Open modal"}),e.jsx(f,{onClose:()=>t(!1),isOpen:a,title:"This is the title of the modal",closeText:"Cancel",manualFocusRef:i,customActions:e.jsxs(e.Fragment,{children:[e.jsx(n,{onClick:()=>t(!1),kind:"secondary",children:"Cancel"}),e.jsx(n,{onClick:()=>t(!1),ref:i,children:"Primary action"})]}),children:"There can be any content in the modal. The modal has a close button by default."})]})}const B={title:"Components/Layout components/LayoutModal",component:g,argTypes:{isOpen:{control:!1,description:"Modal state"},onClose:{control:!1,description:"Closing action"},title:{control:{type:"text"},description:"Title of the modal"},closeText:{control:{type:"text"},description:"Text content of the default close button and alternative text for the closing x"},customActions:{control:!1,description:"JSX element containing custom actions (buttons and/or links) that will be displayed in the modal"},manualFocusRef:{control:!1,description:"Reference to the HTML element inside of the modal that should receive focus. Per default the closing x is focussed."},children:{control:!1,description:"Content to be rendered in the modal"},props:{control:!1,description:"All props (e.g. style and className) are passed on to the root JSX element"}},parameters:{design:{type:"figspec",accessToken:x.STORYBOOK_FIGMA_ACCESS_TOKEN,url:h.url},vitest:{testFile:"LayoutModal.test.tsx"}}},o={name:"Modal with default action (close)",args:{title:"Title of the modal"}},s={name:"Modal with custom actions",render:()=>e.jsx(T,{}),args:{args:{title:"Title of the modal"}}};var r,c,d;o.parameters={...o.parameters,docs:{...(r=o.parameters)==null?void 0:r.docs,source:{originalSource:`{ + name: 'Modal with default action (close)', + args: { + title: 'Title of the modal' + } +}`,...(d=(c=o.parameters)==null?void 0:c.docs)==null?void 0:d.source}}};var m,p,u;s.parameters={...s.parameters,docs:{...(m=s.parameters)==null?void 0:m.docs,source:{originalSource:`{ + name: 'Modal with custom actions', + render: () => , + args: { + args: { + title: 'Title of the modal' + } + } +}`,...(u=(p=s.parameters)==null?void 0:p.docs)==null?void 0:u.source}}};const F=["Default","WithCustomActions"];export{o as Default,s as WithCustomActions,F as __namedExportsOrder,B as default}; diff --git a/assets/LayoutStack-DCdAGefl.js b/assets/LayoutStack-DCdAGefl.js new file mode 100644 index 0000000..8f8ae72 --- /dev/null +++ b/assets/LayoutStack-DCdAGefl.js @@ -0,0 +1 @@ +import{j as i}from"./jsx-runtime-BlAj40OV.js";import{c as l}from"./index-Bl6ORisp.js";const _="_stack_19aq8_1",x="_container_19aq8_8",f="_flex_19aq8_12",a={stack:_,container:x,flex:f};function p({as:s="div",className:c,style:e,space:n="200",container:o,flex:r,...t}){return i.jsx(s,{...t,className:l(a.stack,{[a.container]:o,[a.flex]:r},c),style:{...e,"--space":`var(--betterplace-spacing-${n})`},children:t.children})}export{p as L}; diff --git a/assets/LayoutStack-DrLeF8VP.css b/assets/LayoutStack-DrLeF8VP.css new file mode 100644 index 0000000..e0c6b40 --- /dev/null +++ b/assets/LayoutStack-DrLeF8VP.css @@ -0,0 +1 @@ +._stack_19aq8_1{display:flex;flex-direction:column;justify-content:flex-start;gap:var(--space)}._container_19aq8_8{container-type:inline-size}._flex_19aq8_12{flex:1} diff --git a/assets/LayoutStack.stories-CNb2SZzb.js b/assets/LayoutStack.stories-CNb2SZzb.js new file mode 100644 index 0000000..bd72b8c --- /dev/null +++ b/assets/LayoutStack.stories-CNb2SZzb.js @@ -0,0 +1,5 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{L as n}from"./LayoutStack-DCdAGefl.js";import{g as s}from"./getTokenSufficesByPrefix-D1tEbekl.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";import"./semantic-BrXw8HCe.js";const l=()=>e.jsxs(e.Fragment,{children:[e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"}),e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"}),e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"}),e.jsx("div",{style:{background:"var(--betterplace-color-purple-300)",padding:"var(--betterplace-spacing-100)"},children:"Content"})]}),f={title:"Components/Layout components/LayoutStack",component:n,argTypes:{as:{description:"HTML tag of container",table:{defaultValue:{summary:"div"}},control:{type:"select"},options:["div","section","header","footer","nav","main","search"]},space:{description:"Space between children",options:s("betterplace-spacing"),table:{defaultValue:{summary:"100"},control:{type:"select"},type:{summary:"Spacing | undefined"}},control:{type:"select"}},container:{description:"Should it be treated as container (container-type: inline-size)",table:{defaultValue:{summary:!1}},control:"boolean"},flex:{description:"Should it shrink or grow in another layout - equivalent of flex: 1",table:{defaultValue:{summary:!1}},control:"boolean"},children:{control:!1,description:"Child elements to be rendered"},props:{control:!1,description:"All props (e.g. style and className) are passed on to the root JSX element"}}},t={args:{children:e.jsx(l,{})}};var r,o,a;t.parameters={...t.parameters,docs:{...(r=t.parameters)==null?void 0:r.docs,source:{originalSource:`{ + args: { + children: + } +}`,...(a=(o=t.parameters)==null?void 0:o.docs)==null?void 0:a.source}}};const b=["Default"];export{t as Default,b as __namedExportsOrder,f as default}; diff --git a/assets/LoadingSkeleton-DW0pUbAG.js b/assets/LoadingSkeleton-DW0pUbAG.js new file mode 100644 index 0000000..b4306c9 --- /dev/null +++ b/assets/LoadingSkeleton-DW0pUbAG.js @@ -0,0 +1 @@ +import{j as l}from"./jsx-runtime-BlAj40OV.js";import{c as _}from"./index-Bl6ORisp.js";const c="_skeleton_17wk3_1",m="_shine_17wk3_1",d="_dark_17wk3_13",s={skeleton:c,shine:m,dark:d};function f({as:e="div",width:t,height:n,borderRadius:o,style:a,className:k,dark:r,...i}){return l.jsx(e,{className:_(s.skeleton,k,{[s.dark]:r}),style:{width:t,height:n,borderRadius:o,...a},...i})}export{f as L}; diff --git a/assets/LoadingSkeleton-KLPdcYRg.css b/assets/LoadingSkeleton-KLPdcYRg.css new file mode 100644 index 0000000..b534c2b --- /dev/null +++ b/assets/LoadingSkeleton-KLPdcYRg.css @@ -0,0 +1 @@ +._skeleton_17wk3_1{background:linear-gradient(110deg,var(--betterplace-color-bg-primary) 8%,var(--betterplace-color-bg-subtle) 18%,var(--betterplace-color-bg-primary) 33%);border-radius:var(--betterplace-border-radius-200);background-size:200% 100%;animation:1.5s _shine_17wk3_1 linear infinite}._dark_17wk3_13{background:linear-gradient(110deg,var(--betterplace-color-gray-600) 8%,var(--betterplace-color-gray-400) 18%,var(--betterplace-color-gray-600) 33%);background-size:200% 100%}@keyframes _shine_17wk3_1{to{background-position-x:-200%}} diff --git a/assets/LoadingSkeleton.stories-Clc9Ua-w.js b/assets/LoadingSkeleton.stories-Clc9Ua-w.js new file mode 100644 index 0000000..2f75c22 --- /dev/null +++ b/assets/LoadingSkeleton.stories-Clc9Ua-w.js @@ -0,0 +1,8 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{L as t}from"./LoadingSkeleton-DW0pUbAG.js";import"./index-Bl6ORisp.js";import{L as h}from"./LayoutStack-DCdAGefl.js";import{L as c}from"./LayoutCluster-BkRwq4A8.js";import{T as s}from"./Tile-BHX8z08E.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";function m(){return e.jsx("div",{style:{width:"250px"},children:e.jsxs(s,{children:[e.jsx(s.Header,{style:{padding:"0",borderBottom:"none"},children:e.jsx(t,{width:"100%",height:"150px",style:{borderBottomRightRadius:"unset",borderBottomLeftRadius:"unset"}})}),e.jsx(s.Content,{children:e.jsxs(h,{children:[e.jsx(t,{width:"199px",height:"25px"}),e.jsx(t,{width:"100%",height:"70px"}),e.jsxs(c,{alignment:"justified",children:[e.jsx(t,{width:"40%",height:"30px"}),e.jsx(t,{width:"40%",height:"30px"})]})]})})]})})}const b={title:"Components/LoadingSkeleton",component:t,parameters:{docs:{description:{component:"Reusable LoadingSkeleton component."}}},argTypes:{as:{description:"HTML tag of the loading skeleton element.",table:{defaultValue:{summary:"div"}},control:{type:"select"},options:["div","span"]},dark:{description:"Dark styling for the Skeleton element.",control:{type:"boolean"}},width:{description:"Sets the width of the element. It is just syntactic sugar for the width property of `style` prop."},height:{description:"Sets the height of the element. It is just syntactic sugar for the height property of `style` prop."},borderRadius:{table:{defaultValue:{summary:"border-radius-200"}},description:"Sets the `border-radius` of the element. It is just syntactic sugar for the `borderRadius` property of `style` prop."}}},o={args:{width:"199px",height:"25px"}},r={render:()=>e.jsx(m,{})};var i,n,a;o.parameters={...o.parameters,docs:{...(i=o.parameters)==null?void 0:i.docs,source:{originalSource:`{ + args: { + width: '199px', + height: '25px' + } +}`,...(a=(n=o.parameters)==null?void 0:n.docs)==null?void 0:a.source}}};var d,p,l;r.parameters={...r.parameters,docs:{...(d=r.parameters)==null?void 0:d.docs,source:{originalSource:`{ + render: () => +}`,...(l=(p=r.parameters)==null?void 0:p.docs)==null?void 0:l.source}}};const w=["Default","TileSkeleton"];export{o as Default,r as TileSkeleton,w as __namedExportsOrder,b as default}; diff --git a/assets/OpacityPreview-BBpQ--rv.js b/assets/OpacityPreview-BBpQ--rv.js new file mode 100644 index 0000000..ffe42f3 --- /dev/null +++ b/assets/OpacityPreview-BBpQ--rv.js @@ -0,0 +1 @@ +import{j as s}from"./jsx-runtime-BlAj40OV.js";import{c as o}from"./index-Bl6ORisp.js";const c="_container_1ic0o_1",t="_square_1ic0o_6",n="_overlapSquare_1ic0o_12",a={container:c,square:t,overlapSquare:n},u=({token:r})=>{const e=`var(--${r.name})`;return s.jsxs("div",{className:a.container,children:[s.jsx("div",{className:a.square,style:{opacity:e}}),s.jsx("div",{className:o(a.square,a.overlapSquare),style:{opacity:e}})]})};export{u as O}; diff --git a/assets/OpacityPreview-C-lnaoQy.css b/assets/OpacityPreview-C-lnaoQy.css new file mode 100644 index 0000000..510e538 --- /dev/null +++ b/assets/OpacityPreview-C-lnaoQy.css @@ -0,0 +1 @@ +._container_1ic0o_1{position:relative;margin-block-end:1rem!important}._square_1ic0o_6{block-size:var(--betterplace-sizing-600);inline-size:var(--betterplace-sizing-600);background:var(--betterplace-color-purple-400)}._overlapSquare_1ic0o_12{position:absolute;top:1rem;right:1rem;bottom:1rem;left:1rem} diff --git a/assets/Popup-C2CBl1-G.css b/assets/Popup-C2CBl1-G.css new file mode 100644 index 0000000..88e9ccf --- /dev/null +++ b/assets/Popup-C2CBl1-G.css @@ -0,0 +1 @@ +._popupContainer_y7ppu_1{position:fixed;left:0;top:0;z-index:9999}@initial{._popupContainer_y7ppu_1 {opacity: 0;}}._spyElement_y7ppu_15{position:absolute;width:0;height:0}._nonFocusableOutline_y7ppu_21:focus-visible{outline:var(--betterplace-border-focused);border-radius:var(--betterplace-border-radius-100);outline-offset:var(--betterplace-spacing-100)} diff --git a/assets/Popup-CReyU1RW.js b/assets/Popup-CReyU1RW.js new file mode 100644 index 0000000..cd310f6 --- /dev/null +++ b/assets/Popup-CReyU1RW.js @@ -0,0 +1 @@ +import{j as k}from"./jsx-runtime-BlAj40OV.js";import{c as g}from"./index-Bl6ORisp.js";import{r as n}from"./index-Cs7sjTYM.js";import{u as J,P as ee,g as K,e as te,i as ne,h as se,c as oe,j as re,k as ae,l as ue}from"./PopupContext-CCyEydDt.js";import{r as ce}from"./index-BU4L-DQy.js";const B={TOP:"top",BOTTOM:"bottom",LEFT:"left",RIGHT:"right"},D={LEFT:"left",CENTER:"center",RIGHT:"right",JUSTIFY:"justify"},ie="_popupContainer_y7ppu_1",le="_spyElement_y7ppu_15",fe="_nonFocusableOutline_y7ppu_21",W={popupContainer:ie,spyElement:le,nonFocusableOutline:fe};function de(t,a){return JSON.stringify(t)===JSON.stringify(a)}function V(t){return a=>a===t||a&&de(a,t)?a:t}const H={Enter:"Enter",Space:" ",Tab:"Tab",Escape:"Escape",Down:"ArrowDown",Up:"ArrowUp",Left:"ArrowLeft",Right:"ArrowRight"};function G(){const t=document.getElementById("bp-portal-target");if(t)return t;const a=document.createElement("div");return a.id="bp-portal-target",a.style.position="absolute",a.setAttribute("role","popup"),document.body.appendChild(a),a}function me(t){if(!t)return null;const{height:a,width:l}=t;return{height:a,width:l}}function pe({triggerRect:t,id:a,onCloseTransitionEnd:l,onPopupLeave:r,children:m}){const{popupRef:o,spyRef:h,preferredPopupPosition:s,alignPopup:c,hasHoverTrigger:f,Anchor:p,contentClassName:x,contentWrapperClassName:L,popupOpenWrapperClassName:T,anchorClassName:E}=J(),[P,A]=n.useState(null),[b,M]=n.useState(null),[w,v]=n.useState(null),[I,N]=n.useState(!1),{open:F,hidePopup:e,popupRef:u}=J();n.useEffect(()=>{if(!F)return N(!1);const i=window.requestAnimationFrame(()=>{N(!0)});return()=>window.cancelAnimationFrame(i)},[F,N]);const C=n.useCallback(()=>{var d;const i=me((d=o==null?void 0:o.current)==null?void 0:d.getBoundingClientRect());A(V(i))},[o]),S=n.useCallback(()=>{const i=K(G())??document.body,O=(i===window?document.body:i).getBoundingClientRect();M(O.width),v(O.height)},[]),y=n.useCallback(i=>{var O;if(i.key!==H.Escape)return;i.preventDefault();const d=(O=h==null?void 0:h.current)==null?void 0:O.nextElementSibling;d==null||d.focus(),e()},[e,h]);n.useEffect(()=>{const i=o==null?void 0:o.current;if(!i)return;const d=te(i);return d==null||d.forEach((O,U)=>{O.addEventListener("keydown",y)}),()=>{d==null||d.forEach((O,U)=>{O.removeEventListener("keydown",y)})}},[m,y,o]),n.useLayoutEffect(()=>{C(),S()},[C,S]);const _=n.useCallback(()=>{window.requestAnimationFrame(()=>{C(),S()})},[C,S]),Y=n.useCallback(i=>{f&&r(i)},[r,f]),j=n.useCallback(i=>{var O,U,Q;const d=(U=(O=u==null?void 0:u.current)==null?void 0:O.firstElementChild)==null?void 0:U.firstElementChild;if(i.target!==d&&!((Q=o==null?void 0:o.current)!=null&&Q.contains(i.relatedTarget))){if(ne(d,i.relatedTarget))return i.preventDefault();r(i)}},[r,u,o]);n.useEffect(()=>(window.addEventListener("resize",_),()=>{window.removeEventListener("resize",_)}),[_]);const q=n.useMemo(()=>p?17:0,[p]);n.useEffect(()=>{if(F)return;const i=o==null?void 0:o.current;if(!T)return l();i==null||i.addEventListener("transitionend",l);const d=setTimeout(l,300);return()=>{clearTimeout(d),i==null||i.removeEventListener("transitionend",l)}},[o,F,l,T]);const{x:Z,y:z,anchorOffsetX:$,position:X,width:R}=n.useMemo(()=>we({triggerRect:t,popupSize:P,bodyWidth:b,bodyHeight:w,anchorSize:q,preferredPopupPosition:s,alignPopup:c}),[t,P,b,w,q,s,c]);return ce.createPortal(k.jsx("div",{id:a,className:W.popupContainer,ref:o,onPointerLeave:Y,onBlur:j,style:{transform:`translate3d(${Z}px, ${z}px, 0)`},children:k.jsxs("div",{className:g(L,T&&{[T]:I}),children:[p&&X===B.BOTTOM&&k.jsx(p,{position:X,x:$,className:E}),k.jsx("div",{tabIndex:-1,className:x,style:{...c===D.JUSTIFY?{minWidth:R,overflowX:"hidden"}:{}},[se]:a,children:m}),p&&X===B.TOP&&k.jsx(p,{position:X,x:$,className:E})]})}),G())}function Te(t,a,l){n.useEffect(()=>{var p;const r=(p=l==null?void 0:l.current)==null?void 0:p.nextElementSibling;if(!r)return;const m=oe(r),o=m??r;r.setAttribute(re,t);const s=o.getAttribute("aria-roledescription")??ae(o)??"button";o.setAttribute("role","button"),m||(o==null||o.setAttribute("tabindex","0"),o==null||o.classList.add(W.nonFocusableOutline)),o.setAttribute("aria-roledescription",s);const c=o.getAttribute("aria-describedby");(c==null?void 0:c.includes(t))||o.setAttribute("aria-describedby",ue(c,t))},[a,t,l])}function he(t,a,l){if(!t)return null;const{left:r,top:m,bottom:o,width:h}=t;return{left:r,top:m,bottom:o,width:h,offsetX:l,offsetY:a}}function be({children:t,content:a,id:l}){const{showPopup:r,hidePopup:m,togglePopup:o,open:h,spyRef:s,popupRef:c,hasClickTrigger:f,hasFocusTrigger:p,hasHoverTrigger:x,hasKeypressTrigger:L,setInDOM:T}=J(),[E,P]=n.useState(null),A=n.useMemo(()=>!!E,[E]);Te(l,t,s);const b=n.useCallback(()=>{var Y;const e=(Y=s==null?void 0:s.current)==null?void 0:Y.nextSibling;let u=e==null?void 0:e.getBoundingClientRect();u!=null&&u.height||(u=void 0);let C=0,S=0;const y=K(G())??window;if(y!==window){const j=y;C=-j.getBoundingClientRect().top+j.scrollTop,S=-j.getBoundingClientRect().left+j.scrollLeft}const _=he(u,C,S);P(V(_)),T(!0)},[T,s]),M=n.useCallback(()=>{P(null),T(!1)},[T]),w=n.useCallback(()=>{A&&b()},[b,A]),v=n.useCallback(e=>{const u=c==null?void 0:c.current;if(e.relatedTarget instanceof Node&&(u!=null&&u.contains(e.relatedTarget)))return e.preventDefault();m()},[m,c]),I=n.useCallback(e=>{var u,C;if(e.relatedTarget instanceof Node&&((C=(u=s==null?void 0:s.current)==null?void 0:u.nextSibling)!=null&&C.contains(e.relatedTarget)))return e.preventDefault();m()},[m,s]),N=n.useCallback(e=>{var C,S,y;const u=e.target instanceof Node;u&&((C=c==null?void 0:c.current)!=null&&C.contains(e.target))||u&&((y=(S=s==null?void 0:s.current)==null?void 0:S.nextElementSibling)!=null&&y.contains(e.target))||I(e)},[I,c,s]),F=n.useCallback(e=>{if(e.key===H.Enter||e.key===H.Space)return e.preventDefault(),o();if(e.key===H.Escape)return m()},[m,o]);return n.useEffect(()=>{if(f)return document.addEventListener("pointerdown",N),()=>{document.removeEventListener("pointerdown",N)}},[f,N]),n.useEffect(()=>{var u;if(!f)return;const e=(u=s==null?void 0:s.current)==null?void 0:u.nextElementSibling;return e==null||e.addEventListener("pointerdown",o),()=>{e==null||e.removeEventListener("pointerdown",o)}},[f,o,s,t]),n.useEffect(()=>{var u;if(!x)return;const e=(u=s==null?void 0:s.current)==null?void 0:u.nextElementSibling;return e==null||e.addEventListener("mouseover",r),e==null||e.addEventListener("mouseleave",v),()=>{e==null||e.removeEventListener("mouseover",r),e==null||e.removeEventListener("mouseleave",v)}},[x,v,r,s,t]),n.useEffect(()=>{var u;const e=(u=s==null?void 0:s.current)==null?void 0:u.nextElementSibling;return e==null||e.addEventListener("focusout",v),()=>e==null?void 0:e.removeEventListener("focusout",v)},[v,s,t]),n.useEffect(()=>{var u;if(!p)return;const e=(u=s==null?void 0:s.current)==null?void 0:u.nextElementSibling;return e==null||e.addEventListener("focus",r),e==null||e.addEventListener("focusin",r),()=>{e==null||e.removeEventListener("focus",r),e==null||e.removeEventListener("focusin",r)}},[p,r,t,s]),n.useEffect(()=>{var u;if(!L)return;const e=(u=s==null?void 0:s.current)==null?void 0:u.nextElementSibling;return e==null||e.addEventListener("keydown",F),()=>{e==null||e.removeEventListener("keydown",F)}},[L,F,s,t]),n.useEffect(()=>{if(!h)return;window.addEventListener("resize",w,{passive:!0});const e=K(G())??window;return e.addEventListener("scroll",w,{passive:!0}),()=>{window.removeEventListener("resize",w),e.removeEventListener("scroll",w)}},[h,w]),n.useLayoutEffect(()=>{w()},[t,w]),n.useEffect(()=>{h&&b()},[h,b]),k.jsxs(k.Fragment,{children:[k.jsx("div",{ref:s,className:W.spyElement}),t,A&&k.jsx(pe,{triggerRect:E,onCloseTransitionEnd:M,id:l,onPopupLeave:I,children:a})]})}function Pe({children:t,content:a,id:l,triggerEvents:r=["hover","focus"],inactive:m,...o}){const[h,s]=n.useState(!1),[c,f]=n.useState(!1),[p,x]=n.useState(!1),L=n.useRef(null),T=n.useRef(null),E=J(),P=n.useId(),A=n.useMemo(()=>l??P,[l]),b=n.useMemo(()=>r==null?void 0:r.includes("click"),[r]),M=n.useMemo(()=>r==null?void 0:r.includes("focus"),[r]),w=n.useMemo(()=>r==null?void 0:r.includes("hover"),[r]),v=n.useMemo(()=>r==null?void 0:r.includes("keypress"),[r]),I=n.useCallback(()=>{f(!1)},[]),N=n.useCallback(()=>{f(!0)},[]),F=n.useCallback(()=>{f(e=>!e)},[]);return n.useEffect(()=>(s(!0),()=>{s(!1)}),[]),!h||m?t:k.jsx(ee.Provider,{value:{open:c,showPopup:N,hidePopup:I,togglePopup:F,spyRef:T,popupRef:L,hasClickTrigger:b,hasHoverTrigger:w,hasFocusTrigger:M,hasKeypressTrigger:v,inDOM:p,setInDOM:x,initialised:!0,parentContext:E,...o},children:k.jsx(be,{content:a,id:A,children:t})})}function we({triggerRect:t,popupSize:a,bodyWidth:l,bodyHeight:r,originalMargin:m=20,anchorSize:o=17,preferredPopupPosition:h=B.TOP,alignPopup:s=D.CENTER}){let c=0,f=0,p=0,x=0,L=h,T=(a==null?void 0:a.width)??0;if(!t||!a||!l||!r)return{x:c,y:f,anchorOffsetX:x,position:L,width:T};let E=0,P=a.width/2;const A=t.width/2;s===D.CENTER?c=t.left+t.offsetX-P+A:s===D.LEFT||s===D.JUSTIFY?(c=t.left+t.offsetX,s===D.JUSTIFY&&(T=t.width,P=A)):s===D.RIGHT&&(c=t.left+t.offsetX+t.width-T);const b=a.width>l?0:Math.min(m,(l-T)/2);if(E=c,p=c+a.width,cl-b&&(c-=p-(l-b)),o){x=E-c+P-o;const M=x+2*o-T;if(M>0){const w=Math.min(M,b);c+=w,x-=w}}return h===B.TOP?(f=t.top+t.offsetY-a.height,fr+t.offsetY&&(L=B.TOP,f=t.top+t.offsetY-a.height)),{x:c,y:f,anchorOffsetX:x,position:L,width:T}}export{D as A,H as K,B as P,Pe as a}; diff --git a/assets/Popup.stories-Dv4D_U2b.js b/assets/Popup.stories-Dv4D_U2b.js new file mode 100644 index 0000000..fcd81af --- /dev/null +++ b/assets/Popup.stories-Dv4D_U2b.js @@ -0,0 +1,9 @@ +import{j as o}from"./jsx-runtime-BlAj40OV.js";import{A as e,P as r,a as d}from"./Popup-CReyU1RW.js";import{C as h}from"./ClientButton-DhJqhttM.js";import{R as g}from"./ClientRadioButton-D6ER925T.js";import{T as f}from"./TextLink-BKWIXXPv.js";import{T as x}from"./TooltipTrigger-DPJ28bmU.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";import"./PopupContext-CCyEydDt.js";import"./index-BU4L-DQy.js";import"./Button-CmRA-hR5.js";import"./preventDefault-M1KdZT7V.js";import"./Icon-DX5oPjN8.js";import"./ClientAmountField-BeKZJ_SU.js";import"./TextInput-CJfcBDcM.js";import"./TextInputWrapper-_VuV0eOO.js";import"./useForwardedRef-Bxam_td3.js";import"./Card-CXehOyXK.js";import"./ClientCheckbox-C1-KzgT7.js";import"./ColorInput-BCTm_2fB.js";import"./PopupArrow-BfkLmXfx.js";import"./Dropdown-D3yVVs0w.js";import"./Select.module-VGDajZ98.js";import"./index-B_ZOYESs.js";import"./core-Drm9bBME.js";import"./LayoutCluster-BkRwq4A8.js";import"./ClientSelect-DQsrC2rb.js";import"./ClientIconButton-CsrI0D2P.js";import"./LayoutAccordion-Cce0sNYb.js";import"./LayoutStack-DCdAGefl.js";import"./LayoutModal-DfVyIvg1.js";import"./Heading-C6c2EMQE.js";import"./RangeInput-Ceo1KbjA.js";import"./Textarea-CUO6QFMo.js";import"./Tile-BHX8z08E.js";import"./ToggleButton-BjrnRVGb.js";import"./ToggleSwitch-NdjEB8QA.js";import"./VirtualScroll-BK9u8nPO.js";function v({content:a,children:l,triggerEvents:m,alignPopup:c,preferredPopupPosition:u}){return o.jsx("div",{style:{height:"200px",padding:"var(--betterplace-spacing-400)",containerType:"inline-size",display:"flex",justifyContent:"center",alignItems:"center",position:"relative"},children:o.jsx(d,{content:a,triggerEvents:m,alignPopup:c,preferredPopupPosition:u,children:l})})}const i={text:o.jsx("span",{style:{position:"relative",left:"300px"},children:"Simple Text"}),icon:o.jsx(x,{title:"More information"}),button:o.jsx(h,{onClick:()=>console.log("The button should still do what it's supposed to do"),children:"Actual button"}),anchor:o.jsx(f,{href:"#",children:"Anchor"}),radio:o.jsx(g,{value:"one",children:"For testing purposes only"}),div:o.jsx("div",{role:"note",children:"This is a note, should have a popup!"})},io={title:"Components/Popup",component:v,argTypes:{children:{description:"The actual component to which the popup should be attached.",options:Object.keys(i),mapping:i,control:{type:"radio",labels:{text:"text",icon:"icon",button:"button"}}},alignPopup:{options:Object.values(e),control:{type:"radio"},table:{defaultValue:{summary:e.CENTER}}},preferredPopupPosition:{options:Object.values(r),control:{type:"radio"},table:{defaultValue:{summary:r.TOP}}},content:{control:{type:"text"},description:"The popup content."},triggerEvents:{description:"The events that trigger the popup to open and close. Be careful not to override the default behaviour of the triggering element.",control:{type:"check"},options:["hover","focus","click","keypress"],table:{defaultValue:{summary:["hover","focus"]}}}}},t={args:{content:"Here is a popup with some extra information.",children:i.radio,triggerEvents:["hover","focus"],alignPopup:e.CENTER,preferredPopupPosition:r.TOP}};var p,n,s;t.parameters={...t.parameters,docs:{...(p=t.parameters)==null?void 0:p.docs,source:{originalSource:`{ + args: { + content: 'Here is a popup with some extra information.', + children: labelMapping.radio, + triggerEvents: ['hover', 'focus'], + alignPopup: Alignment.CENTER, + preferredPopupPosition: Position.TOP + } +}`,...(s=(n=t.parameters)==null?void 0:n.docs)==null?void 0:s.source}}};const po=["Default"];export{t as Default,po as __namedExportsOrder,io as default}; diff --git a/assets/PopupArrow-BGGEw06j.css b/assets/PopupArrow-BGGEw06j.css new file mode 100644 index 0000000..f8708d4 --- /dev/null +++ b/assets/PopupArrow-BGGEw06j.css @@ -0,0 +1 @@ +._tooltipArrow_qcdrl_1{pointer-events:none;position:absolute;width:1rem;height:1rem;left:.5rem}._tooltipArrow_qcdrl_1:before{content:"";position:absolute;transform:rotate(45deg);width:100%;height:100%;left:.0625rem;top:0;border:var(--betterplace-border-light);background-color:var(--betterplace-color-border-light);box-shadow:var(--betterplace-shadow-floating-low)}._tooltipArrow_qcdrl_1:after{content:"";position:absolute;transform:rotate(45deg);width:calc(100% + .15rem);height:calc(100% + .15rem);background-color:var(--betterplace-color-bg-light);top:-.25rem}._bottomTooltipArrow_qcdrl_32{top:.5rem;clip-path:inset(.41rem -.5rem -.5rem -.5rem)}._topTooltipArrow_qcdrl_37{bottom:.5rem;clip-path:inset(.41rem -.5rem -.5rem -.5rem)} diff --git a/assets/PopupArrow-BfkLmXfx.js b/assets/PopupArrow-BfkLmXfx.js new file mode 100644 index 0000000..e9b3702 --- /dev/null +++ b/assets/PopupArrow-BfkLmXfx.js @@ -0,0 +1 @@ +import{j as s}from"./jsx-runtime-BlAj40OV.js";import{c as i}from"./index-Bl6ORisp.js";import{P as t}from"./Popup-CReyU1RW.js";const m="_tooltipArrow_qcdrl_1",w="_bottomTooltipArrow_qcdrl_32",A="_topTooltipArrow_qcdrl_37",r={tooltipArrow:m,bottomTooltipArrow:w,topTooltipArrow:A};function e({x:p,position:o,className:l}){return s.jsx("div",{className:i(r.tooltipArrow,l,{[r.bottomTooltipArrow]:o===t.BOTTOM,[r.topTooltipArrow]:o===t.TOP}),style:{transform:`translateX(${p}px) ${o===t.BOTTOM?" rotate(180deg)":""}`}})}export{e as P}; diff --git a/assets/PopupContext-CCyEydDt.js b/assets/PopupContext-CCyEydDt.js new file mode 100644 index 0000000..29e5c90 --- /dev/null +++ b/assets/PopupContext-CCyEydDt.js @@ -0,0 +1 @@ +import{r as o}from"./index-Cs7sjTYM.js";const g={a:"link",area:"link",article:"article",aside:"complementary",button:"button",details:"group",dfn:"term",dialog:"dialog",fieldset:"group",figure:"figure",footer:"contentinfo",form:"form",h1:"heading",h2:"heading",h3:"heading",h4:"heading",h5:"heading",h6:"heading",header:"banner",hr:"separator",iframe:"document",img:"img",input:null,li:"listitem",main:"main",menu:"list",menuitem:"menuitem",meter:"meter",nav:"navigation",ol:"list",option:"option",progress:"progressbar",section:"region",select:"listbox",summary:"button",table:"table",tbody:"rowgroup",td:"cell",textarea:"textbox",tfoot:"rowgroup",th:"columnheader",thead:"rowgroup",tr:"row",ul:"list"},b={button:"button",checkbox:"checkbox",radio:"radio",range:"slider",text:"textbox",password:"textbox",email:"textbox",search:"searchbox",number:"spinbutton",tel:"textbox",url:"textbox",submit:"button",reset:"button",image:"button",file:"textbox"},u=["a","button","input","textarea","select","details","area","label"];function p(t){return!t||!t.trim()?new Set:new Set(t.trim().split(/\s+/))}function w(t,e){return[...p(t).add(e)].join(" ")}function A(t){const e=t.getAttribute("role");if(e)return e;const n=t.tagName.toLowerCase();if(n==="input"){const r=t.getAttribute("type");return r?b[r]:"textbox"}const i=g[n];return i||"button"}function S(t,e=u){if(!(!t||!(t instanceof HTMLElement)))return t.querySelectorAll(`${e.join(",")},[tabindex]:not([tabindex="-1"])`)}function s(t,e=u){if(!t)return!1;const n=t.getAttribute("tabindex");if(!n&&!e.includes(t.tagName.toLowerCase())||n&&parseInt(n)<0||t.hasAttribute("disabled"))return!1;const r=window.getComputedStyle(t);return!(r.display==="none"||r.visibility==="hidden")}function m(t,e=u){if(!t||!(t instanceof HTMLElement))return null;const n=t.querySelectorAll(`${e.join(",")}:not([tabindex="-1"]):not([disabled]):not([inert]),[tabindex]:not([tabindex="-1"]):not([disabled]):not([inert])`);for(const i of n)if(s(i,e))return i;return null}function h(t,e=u){return!t||!(t instanceof HTMLElement)?null:s(t,e)?t:m(t,e)}function f(t,e,n=u){if(!e||!(e instanceof HTMLElement))return null;let i=e,r=null;for(;(i=t(i))&&!(r=h(i,n)););return r}function x(t,e=u){return f(n=>(n==null?void 0:n.nextElementSibling)??null,t,e)}function y(t,e=u){return f(n=>(n==null?void 0:n.previousElementSibling)??null,t,e)}function C(t,e=u){if(!t||!(t instanceof HTMLElement))return null;let n=t;for(;;){const i=x(n,e);if(i)return i;if(n=(n==null?void 0:n.parentElement)??null,!n||n===t)return null}}async function L(){return new Promise(t=>{setTimeout(()=>window.requestAnimationFrame(()=>t()))})}const c="data-popup",l="data-popup-id";function a(t){let e=t;for(;e;){if(e!=null&&e.hasAttribute(c))return e;e=(e==null?void 0:e.parentElement)??null}return null}function I(t,e){if(!e||!t)return!1;const n=a(e);if(!n)return!1;const i=n.getAttribute(c);if(!i)return!1;if(t.getAttribute(l)===i)return!0;const r=a(t);return r?!!r.querySelector(`[${l}="${i}"]`):!1}function d(t){return t?t.clientHeight&&t.scrollHeight>t.clientHeight||t.tagName==="DIALOG"?t.tagName==="HTML"?window:t:d(t.parentNode):null}const E=o.createContext({initialised:!1,open:!1,inDOM:!1,setInDOM:()=>{},showPopup:()=>{},hidePopup:()=>{},togglePopup:()=>{},hasClickTrigger:!1,hasKeypressTrigger:!1,hasFocusTrigger:!1,hasHoverTrigger:!1});function F(){return o.useContext(E)}export{E as P,x as a,h as b,m as c,C as d,S as e,y as f,d as g,c as h,I as i,l as j,A as k,w as l,L as t,F as u}; diff --git a/assets/RadioButton.stories-CrksoN-9.js b/assets/RadioButton.stories-CrksoN-9.js new file mode 100644 index 0000000..68ba707 --- /dev/null +++ b/assets/RadioButton.stories-CrksoN-9.js @@ -0,0 +1,5 @@ +import{R as r}from"./ClientRadioButton-D6ER925T.js";import"./jsx-runtime-BlAj40OV.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";import"./preventDefault-M1KdZT7V.js";const c={title:"Components/RadioButton",component:r,parameters:{docs:{description:{component:"Radiobutton component with custom betterplace styling. Radiobuttons should always be grouped within a `Fieldset` component."}}},argTypes:{children:{control:{type:"text"},description:"Label text for the radio button.",table:{type:{summary:"string"}}},disabled:{control:{type:"boolean"},description:"Whether or not the radio button is disabled.",table:{defaultValue:{summary:"false"}}},fullWidth:{control:{type:"radio"},options:[!0,void 0,"mobile-only"],description:"Take 100% of the space.",table:{defaultValue:{summary:"undefined"}}}}},t={args:{children:"Radio label"}};var e,o,a;t.parameters={...t.parameters,docs:{...(e=t.parameters)==null?void 0:e.docs,source:{originalSource:`{ + args: { + children: 'Radio label' + } +}`,...(a=(o=t.parameters)==null?void 0:o.docs)==null?void 0:a.source}}};const m=["Default"];export{t as Default,m as __namedExportsOrder,c as default}; diff --git a/assets/RangeInput-BwqooYMb.css b/assets/RangeInput-BwqooYMb.css new file mode 100644 index 0000000..c5e4a3f --- /dev/null +++ b/assets/RangeInput-BwqooYMb.css @@ -0,0 +1 @@ +._rangeInput_eknoy_1{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:var(--betterplace-spacing-400);width:100%;margin:var(--betterplace-spacing-none);padding:var(--betterplace-spacing-none);border:none}._rangeInput_eknoy_1:focus{outline:none}._rangeInput_eknoy_1::-moz-range-thumb{-moz-appearance:none;-webkit-appearance:none;appearance:none;width:30px;height:30px;margin-top:-11px;background-color:var(--betterplace-color-bg-brand);border-radius:100%;border:none;cursor:pointer}._rangeInput_eknoy_1::-ms-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:30px;height:30px;margin-top:-11px;background-color:var(--betterplace-color-bg-brand);border-radius:100%;border:none;cursor:pointer}._rangeInput_eknoy_1::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:30px;height:30px;margin-top:-11px;background-color:var(--betterplace-color-bg-brand);border-radius:100%;border:none;cursor:pointer}._rangeInput_eknoy_1:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 var(--betterplace-spacing-50) var(--betterplace-color-bg-primary),0 0 0 var(--betterplace-spacing-100) var(--betterplace-color-border-focus)}._rangeInput_eknoy_1:focus-visible::-moz-range-thumb{box-shadow:0 0 0 var(--betterplace-spacing-50) var(--betterplace-color-bg-primary),0 0 0 var(--betterplace-spacing-100) var(--betterplace-color-border-focus)}._rangeInput_eknoy_1::-moz-range-track{height:var(--betterplace-sizing-100);border-radius:var(--betterplace-border-radius-100);background-color:var(--betterplace-color-bg-primary)}._rangeInput_eknoy_1::-ms-track{height:var(--betterplace-sizing-100);border-radius:var(--betterplace-border-radius-100);background-color:var(--betterplace-color-bg-primary)}._rangeInput_eknoy_1::-webkit-slider-runnable-track{height:var(--betterplace-sizing-100);border-radius:var(--betterplace-border-radius-100);background-color:var(--betterplace-color-bg-primary)}._rangeInput_eknoy_1::-moz-range-progress{height:var(--betterplace-sizing-100);background-color:var(--betterplace-color-bg-brand);border-radius:var(--betterplace-border-radius-100)} diff --git a/assets/RangeInput-Ceo1KbjA.js b/assets/RangeInput-Ceo1KbjA.js new file mode 100644 index 0000000..b45f761 --- /dev/null +++ b/assets/RangeInput-Ceo1KbjA.js @@ -0,0 +1 @@ +import{j as r}from"./jsx-runtime-BlAj40OV.js";import{c as s}from"./index-Bl6ORisp.js";import{r as a}from"./index-Cs7sjTYM.js";const p="_rangeInput_eknoy_1",m={rangeInput:p},l=a.forwardRef(function({className:t,fullWidth:n,...e},o){return r.jsx("input",{ref:o,...e,className:s(m.rangeInput,t,{fullWidth:n&&n!=="mobile-only",fullWidthOnMobile:n&&n==="mobile-only"}),type:"range"})});export{l as R}; diff --git a/assets/RangeInput.stories-TepmuIf9.js b/assets/RangeInput.stories-TepmuIf9.js new file mode 100644 index 0000000..7c4794a --- /dev/null +++ b/assets/RangeInput.stories-TepmuIf9.js @@ -0,0 +1 @@ +import{j as a}from"./jsx-runtime-BlAj40OV.js";import{R as n}from"./RangeInput-Ceo1KbjA.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-Bl6ORisp.js";const p=o=>a.jsx(n,{...o,"aria-label":"Use a slider to select a value",max:54,min:0}),d={title:"Components/RangeInput",component:p,parameters:{docs:{description:{component:"Accepts the same props as `HTMLInputElement`"}}}},e={};var t,r,s;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:"{}",...(s=(r=e.parameters)==null?void 0:r.docs)==null?void 0:s.source}}};const x=["Default"];export{e as Default,x as __namedExportsOrder,d as default}; diff --git a/assets/Select-c-741T9O.css b/assets/Select-c-741T9O.css new file mode 100644 index 0000000..317c5d7 --- /dev/null +++ b/assets/Select-c-741T9O.css @@ -0,0 +1 @@ +._selectContainer_1guj8_1{display:flex;align-items:center;min-width:var(--betterplace-sizing-900)}._selectContainer_1guj8_1 svg{margin-inline-start:-1.625rem;pointer-events:none}._select_1guj8_1{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:var(--betterplace-spacing-250) var(--betterplace-spacing-300);background:var(--betterplace-color-bg-light);border:var(--betterplace-border-default);border-radius:var(--betterplace-border-radius-200);color:var(--betterplace-color-fg-content-primary);font:var(--betterplace-typography-functional-text-md-default);inline-size:100%;transition:outline .1s linear,color .1s linear,background .1s linear}@media (hover: hover){._select_1guj8_1:hover{box-shadow:var(--betterplace-shadow-floating-low)}}._select_1guj8_1:focus-visible{outline:var(--betterplace-border-focused);outline-offset:var(--betterplace-spacing-50)}[disabled]:hover,[disabled]:focus-visible{background:var(--betterplace-color-bg-subtle);color:var(--betterplace-color-fg-mute);box-shadow:none} diff --git a/assets/Select.module-VGDajZ98.js b/assets/Select.module-VGDajZ98.js new file mode 100644 index 0000000..3104108 --- /dev/null +++ b/assets/Select.module-VGDajZ98.js @@ -0,0 +1 @@ +const e="_selectContainer_1guj8_1",t="_select_1guj8_1",s={selectContainer:e,select:t};export{s}; diff --git a/assets/Select.stories-D8Lr1j46.js b/assets/Select.stories-D8Lr1j46.js new file mode 100644 index 0000000..ab5a086 --- /dev/null +++ b/assets/Select.stories-D8Lr1j46.js @@ -0,0 +1,6 @@ +import{j as e}from"./jsx-runtime-BlAj40OV.js";import{C as p}from"./ClientSelect-DQsrC2rb.js";import"./index-Cs7sjTYM.js";import"./_commonjsHelpers-BosuxZz1.js";import"./TextInputWrapper-_VuV0eOO.js";import"./index-Bl6ORisp.js";import"./Select.module-VGDajZ98.js";import"./Icon-DX5oPjN8.js";import"./preventDefault-M1KdZT7V.js";const d=({label:i,hint:a,disabled:s,required:l})=>e.jsxs(p,{label:i,hint:a,disabled:s,required:l,children:[e.jsx("option",{value:"superman",children:"Superman"}),e.jsx("option",{value:"iron-man",children:"Iron Man"}),e.jsx("option",{value:"wonder-woman",children:"Wonder Woman"}),e.jsx("option",{value:"batman",children:"Duh... Batman"})]}),w={title:"Components/Select",component:d,argTypes:{children:{table:{type:{summary:"