@preply/ds-docs 0.97.3 → 0.97.4

package/dist/assets/{00.applications-DZv8NoXM.js → 00.applications-BiomFxjM.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-Bxcv0yjW.js";import{useMDXComponents as t}from"./index-EeWIkZEf.js";import{ae as o}from"./index-CXQveQOi.js";import"./index-mfbfsM12.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-9MNwBgj-.js";import"../sb-preview/runtime.js";import"./index-CnQXyiSh.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function r(s){const n={a:"a",code:"code",em:"em",h1:"h1",h2:"h2",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...t(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(o,{title:"Guides/Installation/Applications"}),`
+import{j as e}from"./jsx-runtime-Bxcv0yjW.js";import{useMDXComponents as t}from"./index-EeWIkZEf.js";import{ae as o}from"./index-CrxsFCDW.js";import"./index-mfbfsM12.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-CgaZSV0R.js";import"../sb-preview/runtime.js";import"./index-CnQXyiSh.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function r(s){const n={a:"a",code:"code",em:"em",h1:"h1",h2:"h2",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...t(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(o,{title:"Guides/Installation/Applications"}),`
 `,e.jsx(n.h1,{id:"installation-applications",children:"Installation: Applications"}),`
 `,e.jsx(n.p,{children:"This guide applies to both client-side and server-side rendered React applications."}),`
 `,e.jsx(n.h2,{id:"packages",children:"Packages"}),`

package/dist/assets/{00.favicons.guide-C8t4hmDP.js → 00.favicons.guide-BwJrwx9D.js}

@@ -1,4 +1,4 @@
-import{j as s}from"./jsx-runtime-Bxcv0yjW.js";import{useMDXComponents as o}from"./index-EeWIkZEf.js";import{ae as t}from"./index-CXQveQOi.js";import"./index-mfbfsM12.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-9MNwBgj-.js";import"../sb-preview/runtime.js";import"./index-CnQXyiSh.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function i(n){const e={a:"a",code:"code",h1:"h1",h2:"h2",h3:"h3",p:"p",pre:"pre",strong:"strong",...o(),...n.components};return s.jsxs(s.Fragment,{children:[s.jsx(t,{title:"Guides/Assets/Favicons"}),`
+import{j as s}from"./jsx-runtime-Bxcv0yjW.js";import{useMDXComponents as o}from"./index-EeWIkZEf.js";import{ae as t}from"./index-CrxsFCDW.js";import"./index-mfbfsM12.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-CgaZSV0R.js";import"../sb-preview/runtime.js";import"./index-CnQXyiSh.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function i(n){const e={a:"a",code:"code",h1:"h1",h2:"h2",h3:"h3",p:"p",pre:"pre",strong:"strong",...o(),...n.components};return s.jsxs(s.Fragment,{children:[s.jsx(t,{title:"Guides/Assets/Favicons"}),`
 `,s.jsx(e.h1,{id:"favicons",children:"Favicons"}),`
 `,s.jsxs(e.p,{children:["The optimised assets are available under ",s.jsx(e.strong,{children:"preply.com"})," in the formats required by modern and legacy browsers, as well as Android and iOS devices."]}),`
 `,s.jsxs(e.p,{children:["Refer to ",s.jsx(e.a,{href:"https://evilmartians.com/chronicles/how-to-favicon-in-2021-six-files-that-fit-most-needs",rel:"nofollow",children:"How to Favicon in 2022: Six files that fit most needs"})," for a detailed breakdown of the formats."]}),`

package/dist/assets/00.token-explorer-BHwmyUTA.js

@@ -0,0 +1,326 @@
+import{j as t}from"./jsx-runtime-Bxcv0yjW.js";import{useMDXComponents as N}from"./index-EeWIkZEf.js";import{ae as O}from"./index-CrxsFCDW.js";import{r as c,R as _}from"./index-mfbfsM12.js";import{g as A,u as W,T as w}from"./Text-Bfx8yREV.js";import{t as M}from"./tokens-D5WEKrsE.js";import{f as V,g as I,T as B,e as K,c as o}from"./styled-components.browser.esm-BaO8iHee.js";import{d as Y,a as R,u as z,b as q}from"./useTheme-BV4v5x7f.js";import{o as G}from"./mixins-DZk1Zeoo.js";import{L as p}from"./LayoutFlex-CT_mR8FH.js";import{L as y}from"./LayoutGrid-5spQZwnb.js";import{s as X}from"./style-inject.es-BI9ztQJ7.js";import{u as Q,m as U,s as J,i as Z,j as ee}from"./classNames-OZbnFNS5.js";import{w as S,g as te}from"./componentNames-BAR5iJaT.js";import{c as re}from"./useColorScheme-Bv74nHTy.js";import"./iframe-CgaZSV0R.js";import"../sb-preview/runtime.js";import"./index-CnQXyiSh.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";import"./useTextAccentClassnames-flfSYb_B.js";import"./useTextCenteredClassnames-DJAYJ6qC.js";import"./useLayoutFlexClassNames-CRhEo9D5.js";import"./useLayoutRelativeClassnames-Bourck76.js";import"./useLayoutGridResponsiveColumns-Clfao9J8.js";import"./breakpoints-BfMlrtxE.js";const oe=e=>Array.isArray(e)&&e.length===3&&V.includes(e[I]),ne=()=>{const{setTheme:e}=c.useContext(Y);return{setTheme:e}};var P=".ehLpOm{border-radius:var(--330e49);display:inline-block;font-style:normal;font-weight:var(--73984e);margin:0;padding-left:var(--58c1e5);padding-right:var(--58c1e5)}.a1Ymf6{background-color:var(--2d51ae);color:var(--68bd17)}.QQm6LD{background-color:var(--292009);color:var(--c50238)}.n35-dc{background-color:var(--df6b06);color:var(--977d1a)}.YEj6cn{background-color:var(--e5b0a4);color:var(--6c2ddf)}.uDEFkK{background-color:var(--aa7c4d);color:var(--8da8cb)}.JrA2sO{background-color:var(--301ea7);color:var(--1da698)}.tfVNZ-{background-color:var(--a2a233);color:var(--ad48d7)}.W1sMIT{background-color:var(--86df85);color:var(--2be49e)}.dzj54A{background-color:var(--d908ab);color:var(--98c505)}.V3-1SN{background-color:var(--0c251f);color:var(--802584)}",T={__id:"/home/runner/work/design-system/design-system/packages/web-lib/src/components/TextHighlighted/style/index.module.less",__css:P,TextHighlighted:"ehLpOm","TextHighlighted--highlight-blue":"a1Ymf6","TextHighlighted--highlight-green":"QQm6LD","TextHighlighted--highlight-primary":"n35-dc","TextHighlighted--highlight-secondary":"YEj6cn","TextHighlighted--highlight-tertiary":"uDEFkK","TextHighlighted--highlight-accent":"JrA2sO","TextHighlighted--highlight-positive":"tfVNZ-","TextHighlighted--highlight-info":"W1sMIT","TextHighlighted--highlight-warning":"dzj54A","TextHighlighted--highlight-critical":"V3-1SN"};X(P);const d=({children:e,highlight:r=Z,tag:i=ee,dataset:n})=>{Q(T);const a={className:U(T,S.TextHighlighted,[J("highlight",r)]).join(" "),...te(n,{preplyDsComponent:S.TextHighlighted})};return _.createElement(i,{...a},e)};d.__docgenInfo={description:"",methods:[],displayName:"TextHighlighted",props:{highlight:{defaultValue:{value:"'green'",computed:!1},required:!1},tag:{defaultValue:{value:"'span'",computed:!1},required:!1}}};const ie=(e,r)=>({token:r,name:e,id:r[B],type:r[I],colorSchemeAware:!!r[K]}),H=(e,r)=>Object.entries(r).flatMap(([i,n])=>{const s=`${e}.${i}`;return oe(n)?[ie(s,n)]:H(s,n)}),se=e=>Object.entries(e).flatMap(([r,i])=>H(r,i)),ae=se(M),ce=(e,r,i)=>e.filter(n=>{if(r==="-"||r==="--")return!0;if(r!=null&&r.startsWith("--"))return n.id.toLowerCase().startsWith(r.substring(2).toLowerCase());if(r){const s=n.name.toLowerCase().indexOf(r.toLowerCase())>-1,a=n.value.toLowerCase().indexOf(r.toLowerCase())>-1;return(s||a)&&(i?n.colorSchemeAware:!n.colorSchemeAware)}return i?n.colorSchemeAware:!n.colorSchemeAware}),F=c.createContext({terms:"",colorScheme:void 0,results:[],setColorScheme:()=>{},setSearchTerms:()=>{}});var D;const le=((D=window==null?void 0:window.localStorage)==null?void 0:D.getItem("storybook.ds-color-scheme"))||void 0;function de(e,r){return ae.map(n=>({...n,value:`${A(e,r,n.token)}`}))}const he=({children:e})=>{const{findColorScheme:r}=R(),{theme:i}=z(),[n,s]=c.useState(le),[a,h]=c.useState(""),[u,g]=c.useState([]),x=c.useCallback(m=>s(m),[s]),f=c.useCallback(m=>h(m),[h]);if(!i)throw new Error("useToken() must be used within a ThemeProvider");return c.useEffect(()=>{const m=r(n||"base"),j=de(i,m);g(ce(j,a,!!n))},[n,r,a,i]),t.jsx(F.Provider,{value:{terms:a,results:u,colorScheme:n,setSearchTerms:f,setColorScheme:x},children:t.jsx(q,{colorScheme:n||"base",children:e})})},v=()=>c.useContext(F),pe=o.div`
+    width: 64px;
+    height: 64px;
+    color: white;
+    background-color: ${({value:e})=>e};
+`,ge=({value:e})=>t.jsx(pe,{value:e}),me=o.div`
+    background: white;
+    width: 48px;
+    height: 48px
+    padding: 8px 0 0 8px;
+    background: ${({value:e})=>e==="white"?"black":"white"};
+
+
+    span {
+        display: block;
+        width: 40px;
+        height: 40px;
+        border-width: 2px;
+        border-style: solid;
+        border-top-left-radius: 16px;
+        border-color: ${({value:e})=>e};
+        border-right: none;
+        border-bottom: none;
+    }
+`,xe=({value:e})=>t.jsx(me,{value:e,children:t.jsx("span",{})}),ue=o.div`
+    width: 48px;
+    height: 48px
+    padding: 8px 0 0 8px;
+    background: ${({value:e})=>e==="white"?"black":"white"};
+    border-image: ${({value:e})=>e};
+
+
+
+`,fe=({value:e})=>t.jsx(ue,{value:e,children:t.jsx("span",{})}),be=o.div`
+    width: 32px;
+    height: 32px;
+    border-style: solid;
+    border-color: #999;
+    border-width: 12px;
+    border-right: none;
+    border-bottom: none;
+    border-top-left-radius: ${({value:e})=>e};
+`,ve=({value:e})=>t.jsx(be,{value:e}),je=o.div`
+    width: 64px;
+    padding-top: ${({value:e})=>e};
+    background: #666;
+
+    span {
+        display: block;
+        width: 100%;
+        border-top-style: solid;
+        border-color: white;
+        border-width: 2px;
+        height: 28px;
+        background: #999;
+    }
+`,we=({value:e})=>t.jsx(je,{value:e,children:t.jsx("span",{})}),ye=o.div`
+    width: 64px;
+    height: 64px;
+    box-shadow: ${({value:e})=>e};
+`,Se=({value:e})=>t.jsx(ye,{value:e}),Te=o.div`
+    background: #999;
+    font-size: 16px;
+    line-height: 32px;
+    text-align: center;
+    width: 200px;
+    color: white;
+
+    ${G(`
+        filter: brightness(${({value:e})=>e});
+    `)}
+`,ke=({value:e})=>t.jsx(Te,{value:e,children:"hover me"}),$e=o.div`
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 64px;
+    height: 64px;
+    font-size: 20px;
+    font-weight: 700;
+    color: ${({value:e})=>e};
+    background: ${({value:e})=>e==="white"?"black":"white"};
+`,Ce=({value:e})=>t.jsx($e,{value:e,children:"A"}),Le=o.div`
+    font-family: ${({value:e})=>e};
+    font-size: 20px;
+    font-weight: 600;
+
+    p:first-child {
+        font-weight: 700;
+    }
+
+    p:last-child {
+        font-weight: 400;
+    }
+`,k=({value:e})=>t.jsxs(Le,{value:e,children:[t.jsx("p",{children:"Lorem ipsum dolor sit amet (700)"}),t.jsx("p",{children:"Lorem ipsum dolor sit amet (500)"}),t.jsx("p",{children:"Lorem ipsum dolor sit amet (400)"})]}),De=o.div`
+    font-family: PreplyInter;
+    @supports (font-variation-settings: normal) {
+        font-family: PreplyInterV;
+    }
+    font-size: ${({value:e})=>e};
+`,Ie=({value:e})=>t.jsx(De,{value:e,children:"Lorem ipsum dolor sit amet"}),Re=o.div`
+    font-family: PreplyInter;
+    @supports (font-variation-settings: normal) {
+        font-family: PreplyInterV;
+    }
+    font-style: ${({value:e})=>e};
+    font-size: 14px;
+`,ze=({value:e})=>t.jsx(Re,{value:e,children:"Lorem ipsum dolor sit amet."}),Pe=o.div`
+    font-family: PreplyInter;
+    @supports (font-variation-settings: normal) {
+        font-family: PreplyInterV;
+    }
+    font-size: 20px;
+    font-weight: ${({value:e})=>e};
+`,He=({value:e})=>t.jsx(Pe,{value:e,children:"Lorem ipsum dolor sit amet"}),Fe=o.div`
+    height: ${({value:e})=>e};
+    width: 40px;
+    background-color: black;
+`,Ee=({value:e})=>t.jsx(Fe,{value:e}),Ne=o.div`
+    font-family: PreplyInter;
+    @supports (font-variation-settings: normal) {
+        font-family: PreplyInterV;
+    }
+    letter-spacing: ${({value:e})=>e};
+    font-size: 14px;
+`,Oe=({value:e})=>t.jsx(Ne,{value:e,children:"Lorem ipsum dolor sit amet."}),_e=o.div`
+    font-family: PreplyInter;
+    @supports (font-variation-settings: normal) {
+        font-family: PreplyInterV;
+    }
+    line-height: ${({value:e})=>e};
+    font-size: 14px;
+`,Ae=({value:e})=>t.jsx(_e,{value:e,children:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec massa nulla, suscipit id purus quis, facilisis tempus tortor. Praesent felis quam, tincidunt vitae libero ut, bibendum condimentum nunc."}),We=o.div`
+    font-family: PreplyInter;
+    @supports (font-variation-settings: normal) {
+        font-family: PreplyInterV;
+    }
+    line-height: ${({value:e})=>e};
+    font-size: 14px;
+`,Me=({value:e})=>t.jsx(We,{value:e,children:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec massa nulla, suscipit id purus quis, facilisis tempus tortor. Praesent felis quam, tincidunt vitae libero ut, bibendum condimentum nunc."}),Ve=o.div`
+    background: white;
+    width: 48px;
+    height: 48px
+    padding: 8px 0 0 8px;
+    background: ${({value:e})=>e==="white"?"black":"white"};
+
+
+    span {
+        display: block;
+        width: 40px;
+        height: 40px;
+        border-width: 2px;
+        border-style: solid;
+        border-top-left-radius: 16px;
+        border-color: ${({value:e})=>e};
+        border-right: none;
+        border-bottom: none;
+    }
+`,Be=({value:e})=>t.jsx(Ve,{value:e,children:t.jsx("span",{})}),Ke=o.div`
+    width: 64px;
+    padding-top: 2px;
+    background: #666;
+
+    span {
+        height: 2px;
+        display: block;
+        width: 100%;
+        border-top-style: solid;
+        border-color: white;
+        border-width: ${({value:e})=>e};
+        height: 28px;
+        background: #999;
+    }
+`,Ye=({value:e})=>t.jsx(Ke,{value:e,children:t.jsx("span",{})}),qe=o.div`
+    width: 64px;
+    padding-top: ${({value:e})=>e};
+    background: #666;
+
+    span {
+        display: block;
+        width: 100%;
+        border-top-style: solid;
+        border-color: white;
+        border-width: 2px;
+        height: 28px;
+        background: #999;
+    }
+`,Ge=({value:e})=>t.jsx(qe,{value:e,children:t.jsx("span",{})}),Xe=o.div`
+    width: 64px;
+    height: 64px;
+    background-color: ${({value:e})=>e};
+`,Qe=({value:e})=>t.jsx(Xe,{value:e}),Ue=o.div`
+    width: ${({value:e})=>e};
+    height: ${({value:e})=>e};
+    background-color: black;
+`,b=({value:e})=>t.jsx(Ue,{value:e}),Je=o.div`
+    width: ${({value:e})=>e};
+    height: 40px;
+    background-color: black;
+`,$=({value:e})=>t.jsx(Je,{value:e}),Ze=o.div`
+    text-decoration: ${({value:e})=>e};
+    font-size: 20px;
+    font-weight: 600;
+
+    p:first-child {
+        font-weight: 700;
+    }
+
+    p:last-child {
+        font-weight: 400;
+    }
+`,et=({value:e})=>t.jsx(Ze,{value:e,children:t.jsx("p",{children:"Lorem ipsum dolor sit amet"})}),tt=o.div`
+    font-family: PreplyInter;
+    font-style: italic;
+    font-variation-settings: ${({value:e})=>e};
+    font-size: 14px;
+`,rt=({value:e})=>t.jsx(tt,{value:e,children:"Lorem ipsum dolor sit amet."}),ot={"root.size":"size","icon.size":"size","root.space":"space",spacing:"space",sizing:"space","root.radius":"borderRadius",radius:"borderRadius","root.text.size":"fontSize","root.text.base.lineHeight":"lineHeightRatio","root.text.height":"lineHeightPixels","root.text.weight":"fontWeight","dsInternalPrimitive.button.borderWeight":"borderWidth","icon.fieldLayout.width":"horizontalPadding","icon.fieldLayout.height":"horizontalPadding","root.text.spacing":"letterSpacing","root.text.style":"fontStyle","root.text.variation":"variationSettings","root.palette":"color",background:"color","color.border.ai.borderImage":"borderImage",color:"color","spinner.icon.color":"color","dsInternalPrimitive.color":"color","badge.base.color":"color","badge.accent":"color",content:"color",elevation:"boxShadow",dropShadow:"boxShadow"},C={color:"fgColor",lineHeight:"lineHeightPixels",shadow:"boxShadow",borderImage:"borderImage",offset:"size"},nt={bgColor:{renderer:ge},borderColor:{renderer:xe},borderImage:{renderer:fe},borderRadius:{renderer:ve},brightness:{renderer:ke},color:{renderer:Qe},fgColor:{renderer:Ce},fontFamily:{renderer:k},fontSize:{renderer:Ie},fontWeight:{renderer:He},fontStyle:{renderer:ze},letterSpacing:{renderer:Oe},gap:{renderer:$},height:{renderer:Ee},horizontalPadding:{renderer:b},lineHeightRatio:{renderer:Me},lineHeightPixels:{renderer:Ae},outlineColor:{renderer:Be},outlineOffset:{renderer:Ye},outlineWidth:{renderer:Ge},borderWidth:{renderer:we},padding:{renderer:b},size:{renderer:b},space:{renderer:$},boxShadow:{renderer:Se},typeface:{renderer:k},variationSettings:{renderer:rt},verticalPadding:{renderer:b},textDecoration:{renderer:et}};function it(e){const r=Object.entries(ot).find(([i])=>e.startsWith(i));return r&&r[1]}function st(e){const r=e.split(".").pop()||"";return r in C?C[r]:r}function at(e){const r=it(e.name)||st(e.name)||"";return nt[r]}const ct=e=>{const r=at(e);if(!r)throw new Error(`No renderer for token "${e.name}".`);return r},lt=o.li`
+    list-style: none;
+    margin-bottom: 32px;
+
+    span[title] {
+        text-align: center;
+        display: block;
+    }
+`,dt=o.p`
+    margin: 0;
+    margin-top: 9px;
+    font-size: 14px;
+`,ht=o.div`
+    padding-top: 6px;
+`,pt=o.p`
+    margin: 0;
+    width: 160px;
+    text-align: right;
+    font-size: 16px;
+    line-height: 32px;
+`;o.div`
+    padding-top: 2px;
+`;const gt=({token:e})=>{const r=W(e.token),n=ct(e).renderer;return t.jsx(lt,{children:t.jsxs(p,{gap:"xs",direction:"column",children:[t.jsxs(y,{gap:"xs",columns:["90px","1fr","2fr"],children:[t.jsx(dt,{children:t.jsxs(d,{highlight:"blue",children:["(--",e.id,")"]})}),t.jsxs(p,{direction:"column",gap:"3xs",children:[t.jsx(w,{variant:"l-medium",children:e.name}),t.jsxs(w,{variant:"m",children:["@",e.name.replace(/\./g,"-")]})]}),t.jsx(ht,{children:t.jsx(p,{direction:"column",gap:"2xs",justifyContent:"start",children:e.colorSchemeAware&&t.jsx("div",{children:t.jsx(d,{children:t.jsx("span",{title:"this token may have different values, depending on color scheme",children:"color scheme aware"})})})})})]}),t.jsxs(y,{gap:"l",columns:["auto","1fr"],alignItems:"center",children:[t.jsx(pt,{children:t.jsx("span",{children:r})}),t.jsx("div",{children:t.jsx(n,{name:e.name,value:r})})]})]})})},mt=o.ul`
+    margin: 0;
+    padding: 0;
+`,xt=o.div`
+    font-size: 24px;
+
+    h3 {
+        margin: 0;
+    }
+`,ut={but:{name:"button",alternatives:["action"],note:"See also: props of <Button> component"},layo:{name:"layout",alternatives:["gap","padding","space"],note:"See also: props of <Layout> components"},align:{name:"align",alternatives:[],note:"You probably want to look at the <Layout> components"},just:{name:"justify",alternatives:[],note:"You probably want to look at the <Layout> components"},bol:{name:"bold",alternatives:["weight"],note:"See also <Text strong> component."},help:{name:"help? :-D",alternatives:[],note:"To be continued..."}},ft=o.h3`
+    margin: 0;
+    font-size: 24px;
+    font-weight: 400;
+`,bt=o.h3`
+    font-size: 16px;
+    font-weight: 400;
+`,vt=o.h3`
+    font-size: 16px;
+    font-weight: 400;
+`,jt=({hint:e})=>{const r=e.alternatives||[];return t.jsxs(p,{gap:"s",column:!0,children:[t.jsxs(ft,{children:["Searching for ",t.jsx(d,{children:e.name}),"?"," "]}),t.jsxs(p,{gap:"2xs",column:!0,children:[r.length&&t.jsxs(bt,{children:["Try searchinng for"," ",r.map((i,n)=>t.jsxs(t.Fragment,{children:[t.jsx(d,{children:i},i),n+2<r.length?", ":"",n+2===r.length?" or ":"",n===r.length-1?" ":""]})),"instead."]}),e.note&&t.jsxs(vt,{children:[t.jsx("strong",{children:"Note:"})," ",e.note]})]})]})},wt=({terms:e})=>e?t.jsx(t.Fragment,{children:Object.entries(ut).map(([r,i])=>e.toLowerCase().indexOf(r)>-1&&t.jsx(jt,{hint:i},r))}):null,yt=()=>{const{results:e,terms:r}=v();return e.length?t.jsx(mt,{children:e.map(i=>t.jsx(gt,{token:i},i.id))}):t.jsx(xt,{children:t.jsxs(p,{gap:"s",column:!0,children:[t.jsx("h3",{children:"No tokens found"}),t.jsx(wt,{terms:r})]})})},St=o.div`
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    font-size: 14px;
+
+    label {
+        font-weight: 500;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+    p {
+        margin: 0;
+    }
+
+    select {
+        height: 32px;
+        padding: 2.5px 5px;
+        border-width: 1px;
+        border-color: ${({isNotDefault:e})=>e?"orange;":"#ccc"};
+    }
+`,Tt=o.select`
+    padding: 5px 10px;
+`,kt=({onChange:e})=>{const{colorScheme:r,setColorScheme:i}=v(),n=c.useCallback(s=>{var h;const a=s.target.value;(h=window==null?void 0:window.localStorage)==null||h.setItem("storybook.ds-color-scheme",a),i(a??void 0),e==null||e(a)},[e,i]);return t.jsxs(St,{isNotDefault:!!r,children:[t.jsx("label",{children:"Color Scheme"}),t.jsxs(Tt,{value:r,onChange:n,children:[t.jsx("option",{value:"",children:"-- no color scheme --"},"none"),Object.keys(re).map(s=>t.jsx("option",{value:s,children:s},s))]})]})},$t=o.div`
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-height: 48px;
+    min-height: 24px;
+    font-size: 16px;
+
+    p {
+        margin: 0;
+    }
+
+    a {
+        color: #0077b3;
+    }
+`,Ct=({id:e})=>t.jsxs(t.Fragment,{children:["Searching for token ID ",t.jsx(d,{highlight:"blue",children:e}),"."]}),Lt=({terms:e,colorScheme:r,results:i})=>t.jsxs(t.Fragment,{children:["Found ",i.length," results matching"," ",t.jsx(d,{highlight:"green",children:e})," ",r?t.jsxs(t.Fragment,{children:["within ",t.jsx(d,{highlight:"green",children:"color scheme aware"})," ","tokens."]}):t.jsx(t.Fragment,{children:"within tokens without color scheme."})]}),Dt=({colorScheme:e,results:r})=>t.jsx(t.Fragment,{children:e?t.jsxs(t.Fragment,{children:["Showing all ",t.jsx(d,{highlight:"blue",children:r.length})," ","tokens that are"," ",t.jsx(d,{highlight:"green",children:"color scheme aware"}),"."]}):t.jsxs(t.Fragment,{children:["Showing all ",t.jsx(d,{highlight:"blue",children:r.length})," ","color scheme anostic tokens."]})}),It=()=>{const{terms:e,colorScheme:r,results:i}=v(),n=(e==null?void 0:e.startsWith("--"))&&(e==null?void 0:e.substring(2));return t.jsx($t,{children:t.jsxs("p",{children:[n&&t.jsx(Ct,{id:n}),e&&!n&&t.jsx(Lt,{terms:e,colorScheme:r,results:i}),!e&&!n&&t.jsx(Dt,{colorScheme:r,results:i})," ",r&&t.jsx("a",{href:"./?path=/story/guides-color-schemes-intro--page",children:"Learn more"})]})})},Rt=o.div`
+    position: relative;
+    margin-top: -20px;
+    padding-bottom: 200px;
+    h1 {
+        margin: 0;
+    }
+`,zt=o.div`
+    position: fixed;
+    left: 0;
+    width: 100%;
+    z-index: 9999;
+    display: flex;
+    justify-content: center;
+    padding: 20px 20px 24px;
+    gap: 16px;
+    background: white;
+`,Pt=o.div`
+    width: 100%;
+    max-width: 1000px;
+    margin: 0 auto;
+`,Ht=o.input`
+    flex: 1;
+    padding: 8px;
+    font-size: 16px;
+    height: 32px;
+    border-style: solid;
+    border-width: 1px;
+    border-color: ${({terms:e})=>e?"orange;":"#ccc"};
+`,Ft=()=>{const{theme:e}=z(),{themes:r}=R(),{setTheme:i}=ne(),{colorScheme:n,terms:s,setColorScheme:a,setSearchTerms:h}=v(),u=c.useMemo(()=>{var l;return new URL(((l=window.top)==null?void 0:l.location.href)||"")},[]),g=u.searchParams,x=g.get("theme"),f=x&&(r==null?void 0:r.find(l=>l.name===x)),m=g.get("colorScheme"),j=g.get("terms");c.useEffect(()=>{var l;x&&(x!==e.name&&i&&f&&i(f),x&&m!==n&&a(m),h(j||"")),g.delete("theme"),g.delete("colorScheme"),g.delete("terms"),(l=window.top)==null||l.history.replaceState({},"",u)},[]);const E=c.useCallback(l=>h(l),[h]);return t.jsx(Rt,{children:t.jsx(zt,{children:t.jsx(Pt,{children:t.jsxs(p,{gap:"xs",direction:"column",children:[t.jsx(p,{justifyContent:"space-between",alignItems:"start",children:t.jsx("h1",{id:"tokens",className:"sbdocs sbdocs-h1 css-1j28tt",children:"Token Explorer"})}),t.jsxs(p,{gap:"2xs",nowrap:!0,children:[t.jsx(Ht,{terms:s,type:"text",placeholder:"examples: teal, 300, action, primary, xs, --4adef, #00, 12px",onChange:l=>E(l.target.value),value:s}),t.jsx(kt,{})]}),t.jsx(It,{})]})})})})};function L(e){return t.jsxs(t.Fragment,{children:[t.jsx(O,{title:"'Guides/Token Explorer"}),`
+`,t.jsxs(he,{children:[t.jsx(Ft,{}),t.jsx(yt,{})]})]})}function dr(e={}){const{wrapper:r}={...N(),...e.components};return r?t.jsx(r,{...e,children:t.jsx(L,{...e})}):L()}export{dr as default};

package/dist/assets/00.using-responsive-props-BanfAFQv.js

@@ -0,0 +1,18 @@
+import{j as a}from"./jsx-runtime-Bxcv0yjW.js";import{useMDXComponents as m}from"./index-EeWIkZEf.js";import{ae as f}from"./index-CrxsFCDW.js";import{B as A}from"./breakpoints-BfMlrtxE.js";import{R as t}from"./index-mfbfsM12.js";import{s as z}from"./style-inject.es-BI9ztQJ7.js";import{u,m as x,s as j,b as _,A as y}from"./classNames-OZbnFNS5.js";import{w as d,g as N}from"./componentNames-BAR5iJaT.js";import{u as R}from"./useTheme-BV4v5x7f.js";import{A as k,a as P}from"./constants--ewUoBsO.js";import"./iframe-CgaZSV0R.js";import"../sb-preview/runtime.js";import"./index-CnQXyiSh.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";var g=".ENaapF{display:inline-block}.ENaapF img{border-radius:var(--dad9ec);-o-object-fit:cover;object-fit:cover;vertical-align:bottom}.d2pNqp img{height:var(--d51f41);width:var(--d51f41)}.hlQlfa img{height:var(--cfdb4f);width:var(--cfdb4f)}.OXNzrY img{height:var(--2dafbf);width:var(--2dafbf)}._4n3bpR img{height:var(--b51334);width:var(--b51334)}.VHR4R- img{height:var(--d318a5);width:var(--d318a5)}.AQlZ0h img{height:var(--6eb1c7);width:var(--6eb1c7)}.ObR4yy img{height:var(--86aa8e);width:var(--86aa8e)}.dN-5ky img{height:var(--32bbec);width:var(--32bbec)}.ddqP8a img{height:var(--950ab5);width:var(--950ab5)}.-Ju7IS img{height:var(--cc5dc7);width:var(--cc5dc7)}.KgHP3O img{height:var(--796da2);width:var(--796da2)}.KZ0FcP img{height:var(--329ba7);width:var(--329ba7)}@media (min-width:400px){.-PmgCn img{height:var(--d51f41);width:var(--d51f41)}.RdTWxp img{height:var(--cfdb4f);width:var(--cfdb4f)}.zwV933 img{height:var(--2dafbf);width:var(--2dafbf)}.pW4--J img{height:var(--b51334);width:var(--b51334)}._1pv2GS img{height:var(--d318a5);width:var(--d318a5)}.vH5iGl img{height:var(--6eb1c7);width:var(--6eb1c7)}.qXCWMy img{height:var(--86aa8e);width:var(--86aa8e)}.qq9TPv img{height:var(--32bbec);width:var(--32bbec)}.h51Bn7 img{height:var(--950ab5);width:var(--950ab5)}.LnrZ97 img{height:var(--cc5dc7);width:var(--cc5dc7)}.n3HEeZ img{height:var(--796da2);width:var(--796da2)}._1zjWLY img{height:var(--329ba7);width:var(--329ba7)}}@media (min-width:700px){.qWyz53 img{height:var(--d51f41);width:var(--d51f41)}._2e4QoO img{height:var(--cfdb4f);width:var(--cfdb4f)}.d0fm85 img{height:var(--2dafbf);width:var(--2dafbf)}.ZHi666 img{height:var(--b51334);width:var(--b51334)}.xxrocW img{height:var(--d318a5);width:var(--d318a5)}._2QWloV img{height:var(--6eb1c7);width:var(--6eb1c7)}._7-PF9V img{height:var(--86aa8e);width:var(--86aa8e)}.kS7dJo img{height:var(--32bbec);width:var(--32bbec)}._7rHLmZ img{height:var(--950ab5);width:var(--950ab5)}.eSycGy img{height:var(--cc5dc7);width:var(--cc5dc7)}.gMO59k img{height:var(--796da2);width:var(--796da2)}.VHYbX3 img{height:var(--329ba7);width:var(--329ba7)}}@media (min-width:880px){.Kt93if img{height:var(--d51f41);width:var(--d51f41)}.BwpLG7 img{height:var(--cfdb4f);width:var(--cfdb4f)}.JjLGRh img{height:var(--2dafbf);width:var(--2dafbf)}.L-KEk3 img{height:var(--b51334);width:var(--b51334)}.a53QCQ img{height:var(--d318a5);width:var(--d318a5)}.kUFUbQ img{height:var(--6eb1c7);width:var(--6eb1c7)}.wkAJav img{height:var(--86aa8e);width:var(--86aa8e)}.ZX2QH4 img{height:var(--32bbec);width:var(--32bbec)}._17P3wB img{height:var(--950ab5);width:var(--950ab5)}.FpM1GN img{height:var(--cc5dc7);width:var(--cc5dc7)}._5-hlk9 img{height:var(--796da2);width:var(--796da2)}.fa-Bb- img{height:var(--329ba7);width:var(--329ba7)}}@media (min-width:1200px){._1jiA7s img{height:var(--d51f41);width:var(--d51f41)}.CwbZaN img{height:var(--cfdb4f);width:var(--cfdb4f)}.DxpiNv img{height:var(--2dafbf);width:var(--2dafbf)}.qn5xeK img{height:var(--b51334);width:var(--b51334)}._4TPfZj img{height:var(--d318a5);width:var(--d318a5)}.NtVchz img{height:var(--6eb1c7);width:var(--6eb1c7)}.ggmeND img{height:var(--86aa8e);width:var(--86aa8e)}.J7HvUW img{height:var(--32bbec);width:var(--32bbec)}.FDJLhr img{height:var(--950ab5);width:var(--950ab5)}.qE9HQS img{height:var(--cc5dc7);width:var(--cc5dc7)}.yjySNE img{height:var(--796da2);width:var(--796da2)}.sQ83pE img{height:var(--329ba7);width:var(--329ba7)}}@media (min-width:1900px){.BuADeq img{height:var(--d51f41);width:var(--d51f41)}.g8TfiY img{height:var(--cfdb4f);width:var(--cfdb4f)}.qYwnPT img{height:var(--2dafbf);width:var(--2dafbf)}.tMD4Sq img{height:var(--b51334);width:var(--b51334)}.M3npPv img{height:var(--d318a5);width:var(--d318a5)}.-vkhWt img{height:var(--6eb1c7);width:var(--6eb1c7)}.lammM- img{height:var(--86aa8e);width:var(--86aa8e)}.hM5mXm img{height:var(--32bbec);width:var(--32bbec)}.mLV4ak img{height:var(--950ab5);width:var(--950ab5)}.uQV-Rf img{height:var(--cc5dc7);width:var(--cc5dc7)}.nbICpK img{height:var(--796da2);width:var(--796da2)}.gRCi9P img{height:var(--329ba7);width:var(--329ba7)}}.Ndyn3O img{border-radius:var(--8517a6)}.ENaapF img{border-color:var(--54e6b5);border-style:solid;border-width:var(--c4d145)}",s={__id:"/home/runner/work/design-system/design-system/packages/web-lib/src/components/Avatar/style/index.module.less",__css:g,Avatar:"ENaapF","Avatar--size-2xs":"d2pNqp","Avatar--size-xs":"hlQlfa","Avatar--size-s":"OXNzrY","Avatar--size-m":"_4n3bpR","Avatar--size-l":"VHR4R-","Avatar--size-xl":"AQlZ0h","Avatar--size-24":"ObR4yy","Avatar--size-32":"dN-5ky","Avatar--size-48":"ddqP8a","Avatar--size-64":"-Ju7IS","Avatar--size-96":"KgHP3O","Avatar--size-160":"KZ0FcP","Avatar--narrow-l--size-2xs":"-PmgCn","Avatar--narrow-l--size-xs":"RdTWxp","Avatar--narrow-l--size-s":"zwV933","Avatar--narrow-l--size-m":"pW4--J","Avatar--narrow-l--size-l":"_1pv2GS","Avatar--narrow-l--size-xl":"vH5iGl","Avatar--narrow-l--size-24":"qXCWMy","Avatar--narrow-l--size-32":"qq9TPv","Avatar--narrow-l--size-48":"h51Bn7","Avatar--narrow-l--size-64":"LnrZ97","Avatar--narrow-l--size-96":"n3HEeZ","Avatar--narrow-l--size-160":"_1zjWLY","Avatar--medium-s--size-2xs":"qWyz53","Avatar--medium-s--size-xs":"_2e4QoO","Avatar--medium-s--size-s":"d0fm85","Avatar--medium-s--size-m":"ZHi666","Avatar--medium-s--size-l":"xxrocW","Avatar--medium-s--size-xl":"_2QWloV","Avatar--medium-s--size-24":"_7-PF9V","Avatar--medium-s--size-32":"kS7dJo","Avatar--medium-s--size-48":"_7rHLmZ","Avatar--medium-s--size-64":"eSycGy","Avatar--medium-s--size-96":"gMO59k","Avatar--medium-s--size-160":"VHYbX3","Avatar--medium-l--size-2xs":"Kt93if","Avatar--medium-l--size-xs":"BwpLG7","Avatar--medium-l--size-s":"JjLGRh","Avatar--medium-l--size-m":"L-KEk3","Avatar--medium-l--size-l":"a53QCQ","Avatar--medium-l--size-xl":"kUFUbQ","Avatar--medium-l--size-24":"wkAJav","Avatar--medium-l--size-32":"ZX2QH4","Avatar--medium-l--size-48":"_17P3wB","Avatar--medium-l--size-64":"FpM1GN","Avatar--medium-l--size-96":"_5-hlk9","Avatar--medium-l--size-160":"fa-Bb-","Avatar--wide-s--size-2xs":"_1jiA7s","Avatar--wide-s--size-xs":"CwbZaN","Avatar--wide-s--size-s":"DxpiNv","Avatar--wide-s--size-m":"qn5xeK","Avatar--wide-s--size-l":"_4TPfZj","Avatar--wide-s--size-xl":"NtVchz","Avatar--wide-s--size-24":"ggmeND","Avatar--wide-s--size-32":"J7HvUW","Avatar--wide-s--size-48":"FDJLhr","Avatar--wide-s--size-64":"qE9HQS","Avatar--wide-s--size-96":"yjySNE","Avatar--wide-s--size-160":"sQ83pE","Avatar--wide-l--size-2xs":"BuADeq","Avatar--wide-l--size-xs":"g8TfiY","Avatar--wide-l--size-s":"qYwnPT","Avatar--wide-l--size-m":"tMD4Sq","Avatar--wide-l--size-l":"M3npPv","Avatar--wide-l--size-xl":"-vkhWt","Avatar--wide-l--size-24":"lammM-","Avatar--wide-l--size-32":"hM5mXm","Avatar--wide-l--size-48":"mLV4ak","Avatar--wide-l--size-64":"uQV-Rf","Avatar--wide-l--size-96":"nbICpK","Avatar--wide-l--size-160":"gRCi9P","Avatar--round":"Ndyn3O"};z(g);const r=({size:e=y,round:i,src:c,alt:n="",dataset:o})=>{u(s);const l=i??!0,b={className:x(s,d.Avatar,[j("size",e),_("round",void 0,l)]).join(" "),...N(o,{preplyDsComponent:d.Avatar})},{theme:w}=R(),p=w.name==="tokyo-ui"?k:P;return t.createElement("picture",{...b},t.createElement("img",{src:c||p,alt:n}))};r.__docgenInfo={description:"",methods:[],displayName:"Avatar",props:{size:{defaultValue:{value:"'xs'",computed:!1},required:!1},alt:{defaultValue:{value:"''",computed:!1},required:!1}}};const q=()=>a.jsx("table",{style:{fontSize:14},children:a.jsx("tbody",{children:Object.entries(A).map(([e,i])=>a.jsxs("tr",{children:[a.jsx("td",{style:{padding:"0px 40px 10px 20px"},children:a.jsx("code",{children:e})}),a.jsx("td",{style:{padding:"0px 40px 10px 20px"},children:a.jsxs("code",{children:[i,"px"]})})]},e))})}),h="./web-lib/src/components/Avatar/docs/static/avatar-1.png";function v(e){const i={code:"code",h1:"h1",h2:"h2",p:"p",pre:"pre",...m(),...e.components};return a.jsxs(a.Fragment,{children:[a.jsx(f,{title:"Guides/Responsive Props"}),`
+`,a.jsx(i.h1,{id:"responsive-props",children:"Responsive Props"}),`
+`,a.jsx(i.p,{children:`Some component props optionally accept responsive values for different screen sizes
+based on the global breakpoints:`}),`
+`,a.jsx(i.pre,{children:a.jsx(i.code,{className:"language-jsx",children:`<Component prop={<value>} />
+<Component prop={{ _: <value>, '<breakpoint>': <value>, ... }} />
+`})}),`
+`,a.jsxs(i.p,{children:["Where ",a.jsx(i.code,{children:"_"})," is the value for the smallest breakpoint, and ",a.jsx(i.code,{children:"<breakpoint>"}),` is one of
+the following, predefined values:`]}),`
+`,a.jsx(q,{}),`
+`,a.jsx(i.h2,{id:"example",children:"Example"}),`
+`,`
+`,a.jsx(r,{src:h,size:"24"}),`
+`,a.jsx(r,{src:h,size:{_:"24","medium-l":"48","wide-s":"64"}}),`
+`,a.jsx(i.pre,{children:a.jsx(i.code,{className:"language-jsx",children:`<Avatar src={url} size="24" />
+<Avatar src={url} size={{ _: '24', 'medium-l': '48', 'wide-s': '64' }} />
+`})}),`
+`,a.jsxs(i.p,{children:["Try resizing your viewport using the dev tools to see the ",a.jsx(i.code,{children:"Avatar"})," size update."]})]})}function X(e={}){const{wrapper:i}={...m(),...e.components};return i?a.jsx(i,{...e,children:a.jsx(v,{...e})}):v(e)}export{X as default,h as url};

package/dist/assets/{10.fonts.guide-BAV-SZHE.js → 10.fonts.guide-Lsgc5eH_.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-Bxcv0yjW.js";import{useMDXComponents as o}from"./index-EeWIkZEf.js";import{ae as r}from"./index-CXQveQOi.js";import"./index-mfbfsM12.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-9MNwBgj-.js";import"../sb-preview/runtime.js";import"./index-CnQXyiSh.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function t(s){const n={a:"a",code:"code",h1:"h1",h2:"h2",p:"p",pre:"pre",strong:"strong",...o(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(r,{title:"Guides/Assets/Fonts"}),`
+import{j as e}from"./jsx-runtime-Bxcv0yjW.js";import{useMDXComponents as o}from"./index-EeWIkZEf.js";import{ae as r}from"./index-CrxsFCDW.js";import"./index-mfbfsM12.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-CgaZSV0R.js";import"../sb-preview/runtime.js";import"./index-CnQXyiSh.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function t(s){const n={a:"a",code:"code",h1:"h1",h2:"h2",p:"p",pre:"pre",strong:"strong",...o(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(r,{title:"Guides/Assets/Fonts"}),`
 `,e.jsx(n.h1,{id:"fonts",children:"Fonts"}),`
 `,e.jsxs(n.p,{children:["The optimised assets are available under ",e.jsx(n.strong,{children:"preply.com"})," in the formats required by modern and legacy browsers."]}),`
 `,e.jsxs(n.p,{children:["Refer to ",e.jsx(n.a,{href:"https://preply.atlassian.net/l/cp/0sQoEgGa",rel:"nofollow",children:"Create new universal brand fonts"})," for a detailed breakdown of the formats, optimisations and technical decisions."]}),`

package/dist/assets/{10.ssr-3rImRK95.js → 10.ssr-DCHIfJOf.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-Bxcv0yjW.js";import{useMDXComponents as r}from"./index-EeWIkZEf.js";import{ae as o}from"./index-CXQveQOi.js";import"./index-mfbfsM12.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-9MNwBgj-.js";import"../sb-preview/runtime.js";import"./index-CnQXyiSh.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function t(s){const n={a:"a",code:"code",h1:"h1",h2:"h2",li:"li",ol:"ol",p:"p",pre:"pre",...r(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(o,{title:"Guides/Installation/SSR"}),`
+import{j as e}from"./jsx-runtime-Bxcv0yjW.js";import{useMDXComponents as r}from"./index-EeWIkZEf.js";import{ae as o}from"./index-CrxsFCDW.js";import"./index-mfbfsM12.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-CgaZSV0R.js";import"../sb-preview/runtime.js";import"./index-CnQXyiSh.js";import"./index-D-8MO0q_.js";import"./index-nrpnv_Jx.js";import"./index-DrFu-skq.js";function t(s){const n={a:"a",code:"code",h1:"h1",h2:"h2",li:"li",ol:"ol",p:"p",pre:"pre",...r(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(o,{title:"Guides/Installation/SSR"}),`
 `,e.jsx(n.h1,{id:"installation-ssr-applications",children:"Installation: SSR Applications"}),`
 `,e.jsxs(n.p,{children:["This guide assumes you have read and followed the steps in the ",e.jsx(n.a,{href:"/story/guides-installation-applications--page",children:"Installation: Applications"})," guide."]}),`
 `,e.jsx(n.h2,{id:"packages",children:"Packages"}),`