@preply/ds-docs 0.100.1 → 1.0.0

package/dist/assets/{00.applications-SuGhZ2d6.js → 00.applications-CQSwS143.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as t}from"./index-DSz_1G2r.js";import{ae as o}from"./index-BdKDgH-N.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-C6ga-lcz.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.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-CKrituN3.js";import{useMDXComponents as r}from"./index-DSz_1G2r.js";import{ae as o}from"./index-BVSiPB0X.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-CFAYM9Mj.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";function t(s){const n={a:"a",code:"code",em:"em",h1:"h1",h2:"h2",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...r(),...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"}),`
@@ -46,11 +46,11 @@ import '@preply/ds-web-root/dist/styles/global/reset.less';
 
 ReactDOM.render(
     <React.StrictMode>
-        <RootProvider target={document.body}>
+        <RootProvider target={document.body} theme="tokyo-ui">
             <App />
         </RootProvider>
     </React.StrictMode>,
     document.getElementById('root'),
 );
 `})}),`
-`,e.jsxs(n.p,{children:[e.jsx(n.strong,{children:"Note:"})," If your app is rendered server side, continue with the instructions in the ",e.jsx(n.a,{href:"/story/guides-installation-ssr--page",children:"Installation: SSR"})," guide."]})]})}function y(s={}){const{wrapper:n}={...t(),...s.components};return n?e.jsx(n,{...s,children:e.jsx(r,{...s})}):r(s)}export{y as default};
+`,e.jsxs(n.p,{children:[e.jsx(n.strong,{children:"Note:"})," If your app is rendered server side, continue with the instructions in the ",e.jsx(n.a,{href:"/story/guides-installation-ssr--page",children:"Installation: SSR"})," guide."]})]})}function y(s={}){const{wrapper:n}={...r(),...s.components};return n?e.jsx(n,{...s,children:e.jsx(t,{...s})}):t(s)}export{y as default};

package/dist/assets/{00.favicons.guide-DzTzQGOX.js → 00.favicons.guide-B5VhuzDN.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as t}from"./index-DSz_1G2r.js";import{ae as i}from"./index-BdKDgH-N.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-C6ga-lcz.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";function o(s){const n={a:"a",code:"code",h1:"h1",h2:"h2",h3:"h3",p:"p",pre:"pre",strong:"strong",...t(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Guides/Assets/Favicons"}),`
+import{j as e}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as t}from"./index-DSz_1G2r.js";import{ae as i}from"./index-BVSiPB0X.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-CFAYM9Mj.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";function o(s){const n={a:"a",code:"code",h1:"h1",h2:"h2",h3:"h3",p:"p",pre:"pre",strong:"strong",...t(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Guides/Assets/Favicons"}),`
 `,e.jsx(n.h1,{id:"favicons",children:"Favicons"}),`
 `,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, as well as Android and iOS devices."]}),`
 `,e.jsxs(n.p,{children:["Refer to ",e.jsx(n.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-YKX25K0Z.js → 00.token-explorer-D52-d6td.js}

@@ -1,4 +1,4 @@
-import{j as t}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as P}from"./index-DSz_1G2r.js";import{ae as F}from"./index-BdKDgH-N.js";import{L as p}from"./LayoutFlex-CI-IyFab.js";import{r as c}from"./index-CBqU2yxZ.js";import{g as E,u as O,T as v}from"./Text-CfFW9YKH.js";import{t as H}from"./tokens-D22H5zrO.js";import{i as W,T as d,u as N}from"./TextHighlighted-CojzyNhw.js";import{T as M,d as A,e as B}from"./constants-mdQROz_Y.js";import{e as L,u as D,C as _,c as V}from"./useTheme-ByES4oDS.js";import{L as y}from"./LayoutGrid-Bbpoq4GZ.js";import{d as o}from"./styled-components.browser.esm-BUFlhth0.js";import{o as K}from"./mixins-DZk1Zeoo.js";import"./iframe-C6ga-lcz.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";import"./layout-relative-qgYNk7GR.js";import"./classNames-Cqk1oqv4.js";import"./constants-DYYVurUY.js";import"./componentNames-BSriaIOD.js";import"./text-accent-Cu7YjM5H.js";import"./text-centered-yu4Ks4Ko.js";import"./breakpoints-BfMlrtxE.js";const q=(e,r)=>({token:r,name:e,id:r[M],type:r[A],colorSchemeAware:!!r[B]}),R=(e,r)=>Object.entries(r).flatMap(([i,n])=>{const s=`${e}.${i}`;return W(n)?[q(s,n)]:R(s,n)}),X=e=>Object.entries(e).flatMap(([r,i])=>R(r,i)),Y=X(H),G=(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}),z=c.createContext({terms:"",colorScheme:void 0,results:[],setColorScheme:()=>{},setSearchTerms:()=>{}});var C;const U=((C=window==null?void 0:window.localStorage)==null?void 0:C.getItem("storybook.ds-color-scheme"))||void 0;function J(e,r){return Y.map(n=>({...n,value:`${E(e,r,n.token)}`}))}const Q=({children:e})=>{const{findColorScheme:r}=L(),{theme:i}=D(),[n,s]=c.useState(U),[a,h]=c.useState(""),[g,x]=c.useState([]),u=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"),w=J(i,m);x(G(w,a,!!n))},[n,r,a,i]),t.jsx(z.Provider,{value:{terms:a,results:g,colorScheme:n,setSearchTerms:f,setColorScheme:u},children:t.jsx(_,{colorScheme:n||"base",children:e})})},j=()=>c.useContext(z),Z=o.div`
+import{j as t}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as P}from"./index-DSz_1G2r.js";import{ae as F}from"./index-BVSiPB0X.js";import{L as p}from"./LayoutFlex-DaMkUPaJ.js";import{r as c}from"./index-CBqU2yxZ.js";import{g as E,u as O,T as v}from"./Text-B7-ttl-t.js";import{t as H}from"./tokens-D22H5zrO.js";import{i as W,T as d,u as N}from"./TextHighlighted-etaYnV4Y.js";import{T as M,d as A,e as B}from"./constants-mdQROz_Y.js";import{e as L,u as D,C as _,c as V}from"./useTheme-pdzgtlkQ.js";import{L as y}from"./LayoutGrid-DnQoHEcf.js";import{d as o}from"./styled-components.browser.esm-BUFlhth0.js";import{o as K}from"./mixins-DZk1Zeoo.js";import"./iframe-CFAYM9Mj.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";import"./layout-relative-Cl5Y3N4W.js";import"./classNames-DypE0CS3.js";import"./constants-DYYVurUY.js";import"./componentNames-BSriaIOD.js";import"./text-accent-BbG6aEsK.js";import"./text-centered-CcR3xfWS.js";import"./breakpoints-BfMlrtxE.js";const q=(e,r)=>({token:r,name:e,id:r[M],type:r[A],colorSchemeAware:!!r[B]}),R=(e,r)=>Object.entries(r).flatMap(([i,n])=>{const s=`${e}.${i}`;return W(n)?[q(s,n)]:R(s,n)}),X=e=>Object.entries(e).flatMap(([r,i])=>R(r,i)),Y=X(H),G=(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}),z=c.createContext({terms:"",colorScheme:void 0,results:[],setColorScheme:()=>{},setSearchTerms:()=>{}});var C;const U=((C=window==null?void 0:window.localStorage)==null?void 0:C.getItem("storybook.ds-color-scheme"))||void 0;function J(e,r){return Y.map(n=>({...n,value:`${E(e,r,n.token)}`}))}const Q=({children:e})=>{const{findColorScheme:r}=L(),{theme:i}=D(),[n,s]=c.useState(U),[a,h]=c.useState(""),[g,x]=c.useState([]),u=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"),w=J(i,m);x(G(w,a,!!n))},[n,r,a,i]),t.jsx(z.Provider,{value:{terms:a,results:g,colorScheme:n,setSearchTerms:f,setColorScheme:u},children:t.jsx(_,{colorScheme:n||"base",children:e})})},j=()=>c.useContext(z),Z=o.div`
     width: 64px;
     height: 64px;
     color: white;

package/dist/assets/{00.using-responsive-props-B53R_GrL.js → 00.using-responsive-props-BfY7f1x1.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as i}from"./index-DSz_1G2r.js";import{A as r}from"./Avatar-DUpkb2KC.js";import{ae as p}from"./index-BdKDgH-N.js";import{B as a}from"./breakpoints-BfMlrtxE.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./classNames-Cqk1oqv4.js";import"./componentNames-BSriaIOD.js";import"./constants--ewUoBsO.js";import"./iframe-C6ga-lcz.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";const c=()=>e.jsx("table",{style:{fontSize:14},children:e.jsx("tbody",{children:Object.entries(a).map(([n,s])=>e.jsxs("tr",{children:[e.jsx("td",{style:{padding:"0px 40px 10px 20px"},children:e.jsx("code",{children:n})}),e.jsx("td",{style:{padding:"0px 40px 10px 20px"},children:e.jsxs("code",{children:[s,"px"]})})]},n))})}),o="./web-lib/src/components/Avatar/docs/static/avatar-1.png";function t(n){const s={code:"code",h1:"h1",h2:"h2",p:"p",pre:"pre",...i(),...n.components};return e.jsxs(e.Fragment,{children:[e.jsx(p,{title:"Guides/Responsive Props"}),`
+import{j as e}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as i}from"./index-DSz_1G2r.js";import{A as r}from"./Avatar-wjE18wgf.js";import{ae as p}from"./index-BVSiPB0X.js";import{B as a}from"./breakpoints-BfMlrtxE.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./classNames-DypE0CS3.js";import"./componentNames-BSriaIOD.js";import"./constants--ewUoBsO.js";import"./iframe-CFAYM9Mj.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";const c=()=>e.jsx("table",{style:{fontSize:14},children:e.jsx("tbody",{children:Object.entries(a).map(([n,s])=>e.jsxs("tr",{children:[e.jsx("td",{style:{padding:"0px 40px 10px 20px"},children:e.jsx("code",{children:n})}),e.jsx("td",{style:{padding:"0px 40px 10px 20px"},children:e.jsxs("code",{children:[s,"px"]})})]},n))})}),o="./web-lib/src/components/Avatar/docs/static/avatar-1.png";function t(n){const s={code:"code",h1:"h1",h2:"h2",p:"p",pre:"pre",...i(),...n.components};return e.jsxs(e.Fragment,{children:[e.jsx(p,{title:"Guides/Responsive Props"}),`
 `,e.jsx(s.h1,{id:"responsive-props",children:"Responsive Props"}),`
 `,e.jsx(s.p,{children:`Some component props optionally accept responsive values for different screen sizes
 based on the global breakpoints:`}),`

package/dist/assets/{01.semantic-tokens-BRIHpkCy.js → 01.semantic-tokens-CG1v-2wG.js}

@@ -1,2 +1,2 @@
-import{j as r}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as k}from"./index-DSz_1G2r.js";import{ae as m}from"./index-BdKDgH-N.js";import{H as a,B as s}from"./Heading-eTizhp-a.js";import{L as d}from"./LayoutGrid-Bbpoq4GZ.js";import{L as l}from"./LayoutGridItem-yCAtLcT1.js";import"./index-CBqU2yxZ.js";import{t as x}from"./tokens-D22H5zrO.js";import"./iframe-C6ga-lcz.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";import"./render-icon-C9YZCLtv.js";import"./classNames-Cqk1oqv4.js";import"./useHostname-B91Ahm0o.js";import"./index-CC6DAVyL.js";import"./componentNames-BSriaIOD.js";import"./text-accent-Cu7YjM5H.js";import"./text-centered-yu4Ks4Ko.js";import"./breakpoints-BfMlrtxE.js";import"./layout-relative-qgYNk7GR.js";import"./constants-DYYVurUY.js";import"./constants-mdQROz_Y.js";const o=({inverted:t,textToken:n})=>{const c=x.color.text[n];return Array.isArray(c)?r.jsxs(l,{children:[r.jsx(a,{level:"h4",children:n}),r.jsx("div",{style:{color:`var(--${c[1]})`,maxWidth:"240px",padding:"10px",background:`var(--${t?x.color.background.primaryInverted[1]:x.color.background.primary[1]})`},children:r.jsxs("code",{children:["color.text.",n]})})]},n):null};o.defaultProps={inverted:!1};const e=({inverted:t,bgToken:n})=>{const c=x.color.background[n];return Array.isArray(c)?r.jsxs(l,{children:[r.jsx(a,{level:"h4",children:n}),r.jsxs("div",{style:{background:`var(--${x.color.background[n][1]})`,color:`var(--${t?x.color.text.inverted[1]:x.color.text.primary[1]})`,maxWidth:"240px",padding:"10px"},children:["Background token: ",r.jsxs("code",{children:["color.background.",n]})]})]},n):null};e.defaultProps={inverted:!1};const i=({contentToken:t})=>{const n=x.color.border[t];return Array.isArray(n)?r.jsxs(l,{children:[r.jsx(a,{level:"h4",children:t}),r.jsx("br",{}),r.jsxs("div",{style:{border:`1px solid var(--${n[1]})`,background:"transparent",color:`var(--${n[1]})`,maxWidth:"240px",height:"50px",padding:"10px"},children:["color.border.",t]})]},t):null};i.defaultProps={};const p=()=>r.jsxs(d,{gap:"xs",columns:2,children:[r.jsx(s,{children:"Token family: action.variant.primary.*"}),r.jsx(s,{variant:"secondary",children:"Token family: action.variant.secondary.*"}),r.jsx(s,{variant:"tertiary",children:"Token family: action.variant.tertiary.*"}),r.jsx(s,{variant:"ghost",children:"Token family: action.variant.ghost.*"}),r.jsx(s,{variant:"critical",children:"Token family: action.variant.critical.*"}),r.jsx(s,{variant:"onColor",children:"Token family: action.variant.onColor.*"}),r.jsx(s,{variant:"inverted",children:"Token family: action.variant.inverted.*"}),r.jsx(s,{disabled:!0,children:"Token family: action.variant.disabled.*"})]}),h=()=>r.jsxs("div",{children:[r.jsx(a,{level:"h1",children:"Semantic token examples"}),r.jsx("p",{children:"With Tokyo UI the semantic tokens have been renamed and expanded to cover more use cases. Here is a list of the most important ones."}),r.jsx("br",{}),r.jsx("hr",{}),r.jsx("br",{}),r.jsx(a,{level:"h2",children:"Text tokens"}),r.jsx("br",{}),r.jsx("br",{}),r.jsxs(d,{gap:"xs",columns:4,children:[r.jsx(o,{textToken:"primary"}),r.jsx(o,{textToken:"secondary"}),r.jsx(o,{textToken:"tertiary"}),r.jsx(o,{textToken:"accentDark"}),r.jsx(o,{textToken:"placeholder"}),r.jsx(o,{textToken:"inverted",inverted:!0}),r.jsx(o,{textToken:"positive"}),r.jsx(o,{textToken:"info"}),r.jsx(o,{textToken:"warning"}),r.jsx(o,{textToken:"critical"})]}),r.jsx("br",{}),r.jsx("br",{}),r.jsx(a,{level:"h2",children:"Background tokens"}),r.jsxs(d,{gap:"xs",columns:4,children:[r.jsx(e,{bgToken:"primary"}),r.jsx(e,{bgToken:"secondary"}),r.jsx(e,{bgToken:"tertiary"}),r.jsx(e,{bgToken:"overlay"}),r.jsx(e,{bgToken:"disabled"}),r.jsx(e,{bgToken:"brand"}),r.jsx(e,{bgToken:"brandB2b"}),r.jsx(e,{bgToken:"accentLight"}),r.jsx(e,{bgToken:"accentDark",inverted:!0}),r.jsx(e,{bgToken:"positiveLight"}),r.jsx(e,{bgToken:"positiveDark",inverted:!0}),r.jsx(e,{bgToken:"infoLight"}),r.jsx(e,{bgToken:"infoDark",inverted:!0}),r.jsx(e,{bgToken:"warningLight"}),r.jsx(e,{bgToken:"warningDark",inverted:!0}),r.jsx(e,{bgToken:"criticalLight"}),r.jsx(e,{bgToken:"criticalDark",inverted:!0}),r.jsx(e,{bgToken:"statusOnline"}),r.jsx(e,{bgToken:"statusOffline"}),r.jsx(e,{bgToken:"primaryInverted",inverted:!0}),r.jsx(e,{bgToken:"secondaryInverted",inverted:!0}),r.jsx(e,{bgToken:"tertiaryInverted",inverted:!0})]}),r.jsx("br",{}),r.jsx("hr",{}),r.jsx("br",{}),r.jsx(a,{level:"h2",children:"Action"}),r.jsx("br",{}),r.jsx(p,{}),r.jsx("br",{}),r.jsx("hr",{}),r.jsx("br",{}),r.jsx(a,{level:"h2",children:"Borders"}),r.jsx("br",{}),r.jsxs(d,{gap:"xs",columns:4,children:[r.jsx(i,{contentToken:"primary"}),r.jsx(i,{contentToken:"secondary"}),r.jsx(i,{contentToken:"secondary-opacity"}),r.jsx(i,{contentToken:"tertiary"}),r.jsx(i,{contentToken:"disabled"}),r.jsx(i,{contentToken:"brand"}),r.jsx(i,{contentToken:"critical"}),r.jsx(i,{contentToken:"focus"}),r.jsx(i,{contentToken:"positive"})]})]});function j(t){return r.jsxs(r.Fragment,{children:[r.jsx(m,{title:"Guides/Semantic tokens examples"}),`
+import{j as r}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as k}from"./index-DSz_1G2r.js";import{ae as m}from"./index-BVSiPB0X.js";import{H as a,B as s}from"./Heading-D-AZG0v4.js";import{L as d}from"./LayoutGrid-DnQoHEcf.js";import{L as l}from"./LayoutGridItem-QKsx1EOv.js";import"./index-CBqU2yxZ.js";import{t as x}from"./tokens-D22H5zrO.js";import"./iframe-CFAYM9Mj.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";import"./render-icon-C9YZCLtv.js";import"./classNames-DypE0CS3.js";import"./useHostname-B91Ahm0o.js";import"./index-CC6DAVyL.js";import"./componentNames-BSriaIOD.js";import"./text-accent-BbG6aEsK.js";import"./text-centered-CcR3xfWS.js";import"./breakpoints-BfMlrtxE.js";import"./layout-relative-Cl5Y3N4W.js";import"./constants-DYYVurUY.js";import"./constants-mdQROz_Y.js";const o=({inverted:t,textToken:n})=>{const c=x.color.text[n];return Array.isArray(c)?r.jsxs(l,{children:[r.jsx(a,{level:"h4",children:n}),r.jsx("div",{style:{color:`var(--${c[1]})`,maxWidth:"240px",padding:"10px",background:`var(--${t?x.color.background.primaryInverted[1]:x.color.background.primary[1]})`},children:r.jsxs("code",{children:["color.text.",n]})})]},n):null};o.defaultProps={inverted:!1};const e=({inverted:t,bgToken:n})=>{const c=x.color.background[n];return Array.isArray(c)?r.jsxs(l,{children:[r.jsx(a,{level:"h4",children:n}),r.jsxs("div",{style:{background:`var(--${x.color.background[n][1]})`,color:`var(--${t?x.color.text.inverted[1]:x.color.text.primary[1]})`,maxWidth:"240px",padding:"10px"},children:["Background token: ",r.jsxs("code",{children:["color.background.",n]})]})]},n):null};e.defaultProps={inverted:!1};const i=({contentToken:t})=>{const n=x.color.border[t];return Array.isArray(n)?r.jsxs(l,{children:[r.jsx(a,{level:"h4",children:t}),r.jsx("br",{}),r.jsxs("div",{style:{border:`1px solid var(--${n[1]})`,background:"transparent",color:`var(--${n[1]})`,maxWidth:"240px",height:"50px",padding:"10px"},children:["color.border.",t]})]},t):null};i.defaultProps={};const p=()=>r.jsxs(d,{gap:"xs",columns:2,children:[r.jsx(s,{children:"Token family: action.variant.primary.*"}),r.jsx(s,{variant:"secondary",children:"Token family: action.variant.secondary.*"}),r.jsx(s,{variant:"tertiary",children:"Token family: action.variant.tertiary.*"}),r.jsx(s,{variant:"ghost",children:"Token family: action.variant.ghost.*"}),r.jsx(s,{variant:"critical",children:"Token family: action.variant.critical.*"}),r.jsx(s,{variant:"onColor",children:"Token family: action.variant.onColor.*"}),r.jsx(s,{variant:"inverted",children:"Token family: action.variant.inverted.*"}),r.jsx(s,{disabled:!0,children:"Token family: action.variant.disabled.*"})]}),h=()=>r.jsxs("div",{children:[r.jsx(a,{level:"h1",children:"Semantic token examples"}),r.jsx("p",{children:"With Tokyo UI the semantic tokens have been renamed and expanded to cover more use cases. Here is a list of the most important ones."}),r.jsx("br",{}),r.jsx("hr",{}),r.jsx("br",{}),r.jsx(a,{level:"h2",children:"Text tokens"}),r.jsx("br",{}),r.jsx("br",{}),r.jsxs(d,{gap:"xs",columns:4,children:[r.jsx(o,{textToken:"primary"}),r.jsx(o,{textToken:"secondary"}),r.jsx(o,{textToken:"tertiary"}),r.jsx(o,{textToken:"accentDark"}),r.jsx(o,{textToken:"placeholder"}),r.jsx(o,{textToken:"inverted",inverted:!0}),r.jsx(o,{textToken:"positive"}),r.jsx(o,{textToken:"info"}),r.jsx(o,{textToken:"warning"}),r.jsx(o,{textToken:"critical"})]}),r.jsx("br",{}),r.jsx("br",{}),r.jsx(a,{level:"h2",children:"Background tokens"}),r.jsxs(d,{gap:"xs",columns:4,children:[r.jsx(e,{bgToken:"primary"}),r.jsx(e,{bgToken:"secondary"}),r.jsx(e,{bgToken:"tertiary"}),r.jsx(e,{bgToken:"overlay"}),r.jsx(e,{bgToken:"disabled"}),r.jsx(e,{bgToken:"brand"}),r.jsx(e,{bgToken:"brandB2b"}),r.jsx(e,{bgToken:"accentLight"}),r.jsx(e,{bgToken:"accentDark",inverted:!0}),r.jsx(e,{bgToken:"positiveLight"}),r.jsx(e,{bgToken:"positiveDark",inverted:!0}),r.jsx(e,{bgToken:"infoLight"}),r.jsx(e,{bgToken:"infoDark",inverted:!0}),r.jsx(e,{bgToken:"warningLight"}),r.jsx(e,{bgToken:"warningDark",inverted:!0}),r.jsx(e,{bgToken:"criticalLight"}),r.jsx(e,{bgToken:"criticalDark",inverted:!0}),r.jsx(e,{bgToken:"statusOnline"}),r.jsx(e,{bgToken:"statusOffline"}),r.jsx(e,{bgToken:"primaryInverted",inverted:!0}),r.jsx(e,{bgToken:"secondaryInverted",inverted:!0}),r.jsx(e,{bgToken:"tertiaryInverted",inverted:!0})]}),r.jsx("br",{}),r.jsx("hr",{}),r.jsx("br",{}),r.jsx(a,{level:"h2",children:"Action"}),r.jsx("br",{}),r.jsx(p,{}),r.jsx("br",{}),r.jsx("hr",{}),r.jsx("br",{}),r.jsx(a,{level:"h2",children:"Borders"}),r.jsx("br",{}),r.jsxs(d,{gap:"xs",columns:4,children:[r.jsx(i,{contentToken:"primary"}),r.jsx(i,{contentToken:"secondary"}),r.jsx(i,{contentToken:"secondary-opacity"}),r.jsx(i,{contentToken:"tertiary"}),r.jsx(i,{contentToken:"disabled"}),r.jsx(i,{contentToken:"brand"}),r.jsx(i,{contentToken:"critical"}),r.jsx(i,{contentToken:"focus"}),r.jsx(i,{contentToken:"positive"})]})]});function j(t){return r.jsxs(r.Fragment,{children:[r.jsx(m,{title:"Guides/Semantic tokens examples"}),`
 `,r.jsx(h,{})]})}function U(t={}){const{wrapper:n}={...k(),...t.components};return n?r.jsx(n,{...t,children:r.jsx(j,{...t})}):j()}export{U as default};

package/dist/assets/{10.fonts.guide-CpnQZZLi.js → 10.fonts.guide-CSfRFAZF.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as o}from"./index-DSz_1G2r.js";import{ae as r}from"./index-BdKDgH-N.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-C6ga-lcz.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.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-CKrituN3.js";import{useMDXComponents as o}from"./index-DSz_1G2r.js";import{ae as r}from"./index-BVSiPB0X.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-CFAYM9Mj.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.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-Kxsb6CV_.js → 10.ssr-iKr3ztu4.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as r}from"./index-DSz_1G2r.js";import{ae as o}from"./index-BdKDgH-N.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-C6ga-lcz.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.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/Next.js pages router"}),`
+import{j as e}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as r}from"./index-DSz_1G2r.js";import{ae as o}from"./index-BVSiPB0X.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-CFAYM9Mj.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.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/Next.js pages router"}),`
 `,e.jsx(n.h1,{id:"installation-nextjs-pages-router",children:"Installation: Next.js pages router"}),`
 `,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"}),`
@@ -14,7 +14,7 @@ export const wrapWithProviders = () => (values: ContextValues) => {
         ...
         <NextRouter.Provider value={values.nextRouter}>
             ...
-            <RootProvider target="none">{elements}</RootProvider>
+            <RootProvider target="none" theme="tokyo-ui">{elements}</RootProvider>
             ...
         </NextRouter.Provider>
         ...

package/dist/assets/{11.languageFont.explorer-Ckz-uF4N.js → 11.languageFont.explorer-CbzOJ5IK.js}

@@ -1,13 +1,13 @@
-import{j as t}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as I}from"./index-DSz_1G2r.js";import{ae as z}from"./index-BdKDgH-N.js";import{B as m,H as g}from"./Heading-eTizhp-a.js";import{L as A}from"./LayoutFlex-CI-IyFab.js";import{L as E}from"./LayoutGrid-Bbpoq4GZ.js";import{u as O,T as y}from"./Text-CfFW9YKH.js";import{T}from"./TextField-C2nBL3Da.js";import{R as n,r as u}from"./index-CBqU2yxZ.js";import{R as L}from"./RootProvider-BvHSkgDA.js";import{d as D}from"./styled-components.browser.esm-BUFlhth0.js";import{t as c}from"./tokens-D22H5zrO.js";import{u as V}from"./useTheme-ByES4oDS.js";import{H as S,b}from"./options-Cmszy4eB.js";import{c as B}from"./classNames-Cqk1oqv4.js";import"./iframe-C6ga-lcz.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";import"./render-icon-C9YZCLtv.js";import"./useHostname-B91Ahm0o.js";import"./index-CC6DAVyL.js";import"./componentNames-BSriaIOD.js";import"./text-accent-Cu7YjM5H.js";import"./text-centered-yu4Ks4Ko.js";import"./layout-relative-qgYNk7GR.js";import"./constants-DYYVurUY.js";import"./breakpoints-BfMlrtxE.js";import"./constants-mdQROz_Y.js";import"./constants-DL6gdbsq.js";import"./getInputProps-CQF_KcrT.js";import"./useForcedRef-CC5bJQVj.js";import"./useTextField-IMWr4_ZB.js";import"./constants-BaXVdZRV.js";const U=D.td`
+import{j as t}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as I}from"./index-DSz_1G2r.js";import{ae as z}from"./index-BVSiPB0X.js";import{B as m,H as g}from"./Heading-D-AZG0v4.js";import{L as A}from"./LayoutFlex-DaMkUPaJ.js";import{L as S}from"./LayoutGrid-DnQoHEcf.js";import{u as T,T as p}from"./Text-B7-ttl-t.js";import{T as O}from"./TextField-Cwr0pxnn.js";import{R as n,r as u}from"./index-CBqU2yxZ.js";import{R as L}from"./RootProvider-CLBjXsMY.js";import{d as D}from"./styled-components.browser.esm-BUFlhth0.js";import{t as U}from"./tokens-D22H5zrO.js";import{u as V}from"./useTheme-pdzgtlkQ.js";import{H as E,b}from"./options-B-izEUN2.js";import{c as B}from"./classNames-DypE0CS3.js";import"./iframe-CFAYM9Mj.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./_commonjsHelpers-BosuxZz1.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";import"./render-icon-C9YZCLtv.js";import"./useHostname-B91Ahm0o.js";import"./index-CC6DAVyL.js";import"./componentNames-BSriaIOD.js";import"./text-accent-BbG6aEsK.js";import"./text-centered-CcR3xfWS.js";import"./layout-relative-Cl5Y3N4W.js";import"./constants-DYYVurUY.js";import"./breakpoints-BfMlrtxE.js";import"./constants-mdQROz_Y.js";import"./constants-DL6gdbsq.js";import"./getInputProps-CQF_KcrT.js";import"./useForcedRef-CC5bJQVj.js";import"./useTextField-IMWr4_ZB.js";import"./constants-BaXVdZRV.js";const y=D.td`
     width: ${({width:a})=>a?`${a}px`:"auto"};
     padding-top: 0;
     padding-right: ${({horizontalSpace:a})=>a?"40px":"20px"};
     padding-bottom: ${({verticalSpace:a})=>a?"20px":"0px"};
     padding-left: 0;
-`,j=({index:a,id:l,defaultValue:s,resolveToken:i,render:f})=>{const r=O(i?i(l):c.root.text.base.typeface);return n.createElement("tr",null,n.createElement(U,{verticalSpace:!0},n.createElement("span",null,n.createElement("code",null,l))),i&&n.createElement(U,{verticalSpace:!0},r),s&&l===s?n.createElement(U,{verticalSpace:!0},"(default)"):n.createElement(U,null),f&&n.createElement(U,{verticalSpace:!0},f(l,a)))};j.__docgenInfo={description:"",methods:[],displayName:"ThemeOptionsItem"};const H=D.div`
+`,j=({index:a,id:l,defaultValue:s,resolveToken:i,render:f})=>{const r=T(i?i(l):U.root.text.base.typeface);return n.createElement("tr",null,n.createElement(y,{verticalSpace:!0},n.createElement("span",null,n.createElement("code",null,l))),i&&n.createElement(y,{verticalSpace:!0},r),s&&l===s?n.createElement(y,{verticalSpace:!0},"(default)"):n.createElement(y,null),f&&n.createElement(y,{verticalSpace:!0},f(l,a)))};j.__docgenInfo={description:"",methods:[],displayName:"ThemeOptionsItem"};const H=D.div`
     margin-bottom: 20px;
     ${({relevant:a})=>`opacity: ${a?"unset":.5}}`}
-`,h=({component:a,prop:l,options:s,defaultValue:i,resolveToken:f,render:r,hideOptions:F=[],referenceTheme:d})=>{const{theme:{name:k}}=V(),w=s.filter(({id:p})=>!F.includes(p));return n.createElement(H,{relevant:d===void 0||d===k},d?n.createElement("h4",null,"Options (theme: ",d,")"):n.createElement("h4",null,"Options"),n.createElement("table",{style:{fontSize:"14px"}},n.createElement("tbody",null,w.map(({id:p},N)=>n.createElement(j,{key:p,index:N,component:a,prop:l,id:p,defaultValue:i,resolveToken:f,render:r})))))};h.__docgenInfo={description:"",methods:[],displayName:"ThemeOptionsList",props:{hideOptions:{defaultValue:{value:"[]",computed:!1},required:!1}}};const Q=()=>n.createElement("style",{"data-ds-style":"global",dangerouslySetInnerHTML:{__html:`/* Variable fonts */
+`,c=({component:a,prop:l,options:s,defaultValue:i,resolveToken:f,render:r,hideOptions:F=[],referenceTheme:h})=>{const{theme:{name:k}}=V(),w=s.filter(({id:d})=>!F.includes(d));return n.createElement(H,{relevant:h===k},n.createElement("h4",null,"Options (theme: ",h,")"),n.createElement("table",{style:{fontSize:"14px"}},n.createElement("tbody",null,w.map(({id:d},N)=>n.createElement(j,{key:d,index:N,component:a,prop:l,id:d,defaultValue:i,resolveToken:f,render:r})))))};c.__docgenInfo={description:"",methods:[],displayName:"ThemeOptionsList",props:{hideOptions:{defaultValue:{value:"[]",computed:!1},required:!1}}};const Q=()=>n.createElement("style",{"data-ds-style":"global",dangerouslySetInnerHTML:{__html:`/* Variable fonts */
 /* English */
 @font-face {
     font-family: 'PreplyInterV';
@@ -1179,7 +1179,7 @@ does not use the correct Thai glyphs for Thai characters.
 [data-preply-ds-theme='tokyo-ui'] * {
     font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
 }
-`}});Q.__docgenInfo={description:"",methods:[],displayName:"GlobalStyle"};const P=["caption-regular","caption-semibold","small-regular","small-regular-italic","small-semibold","small-semibold-italic","default-regular","default-regular-italic","default-semibold","default-semibold-italic","large-regular","large-regular-italic","large-semibold","large-semibold-italic"],C=[{name:"Русский (Russian)",code:"ru",localized:"Привет, мир!"},{name:"English",code:"en",localized:"Hello, World!"},{name:"Polski",code:"pl",localized:"Cześć, Świecie!"},{name:"Deutsch",code:"de",localized:"Hallo, Welt!"},{name:"Українська (Ukranina)",code:"ua",localized:"Привіт, Світ!"},{name:"Português",code:"pt",localized:"Olá, Mundo!"},{name:"Türkçe",code:"tr",localized:"Merhaba, Dünya!"},{name:"Bahasa",code:"id",localized:"Halo, Dunia!"},{name:"Français",code:"fr",localized:"Bonjour, le monde!"},{name:"Italiano",code:"it",localized:"Ciao, Mondo!"},{name:"Español",code:"es",localized:"¡Hola, Mundo!"},{name:"中文 (Chinese)",code:"zh",localized:"你好，世界！"},{name:"日本語 (Japanese)",code:"ja",localized:"こんにちは、世界！"},{name:"한국어 (Korean)",code:"ko",localized:"안녕하세요, 세계!"},{name:"العربية",code:"ar",localized:"مرحبا بك في عالم البرمجة!"},{name:"Nederlands",code:"nl",localized:"Hallo, wereld!"},{name:"Română",code:"ro",localized:"Salut, Lume!"},{name:"Thai",code:"th",localized:"สวัสดี, โลก!"},{name:"Swedish",code:"sv",localized:"Hej, världen!"},{name:"Czeck",code:"cs",localized:"Ahoj, světe!"}],x={en:!0,ua:!0,th:!0,sv:!0,zh:!0};function _(){const a=localStorage.getItem("selectedLanguages"),[l,s]=u.useState(a?JSON.parse(a):x),[i,f]=u.useState(!1),[r,F]=u.useState("Hello, World!");u.useEffect(()=>{localStorage.setItem("selectedLanguages",JSON.stringify(l))},[l]);const d=o=>{s({...l,[o.target.name]:o.target.checked})},k=()=>{const o=C.reduce((e,R)=>(e[R.code]=!0,e),{});s(o)},w=()=>{s({})},p=()=>{s(x)},N=()=>{f(o=>!o)};return t.jsx("div",{className:"App",children:t.jsxs(A,{column:!0,gap:"32",children:[t.jsx(E,{columns:5,gap:"8",children:C.map(o=>t.jsxs("div",{children:[t.jsx("input",{type:"checkbox",name:o.code,checked:l[o.code]||!1,onChange:d,id:o.code}),t.jsxs("label",{htmlFor:o.code,children:[o.name," (",o.code,")"]})]},o.code))}),t.jsxs(A,{gap:"8",children:[t.jsx(m,{variant:"secondary",onClick:k,children:"Select all languages"}),t.jsx(m,{variant:"secondary",onClick:w,children:"Deselect all languages"}),t.jsx(m,{variant:"ghost",onClick:p,children:"Reset selected languages"}),t.jsx(m,{variant:"ghost",onClick:N,children:"Toggle all text variants"})]}),t.jsx(A,{column:!0,gap:"32",children:t.jsx(T,{label:"English sentence",value:r,onValueChange:F})}),t.jsx(E,{columns:3,gap:"16",children:C.filter(o=>l[o.code]).map(o=>t.jsxs("div",{style:{display:"contents"},children:[t.jsxs("div",{children:[o.name," (",o.code,")"]}),t.jsxs("div",{lang:o.code,children:[t.jsx(y,{accent:"tertiary",children:t.jsx("i",{children:"English sentence"})}),t.jsx(g,{variant:"large",tag:"h2",children:r}),t.jsx(y,{children:r}),i&&t.jsxs(t.Fragment,{children:[t.jsx(h,{component:"Heading",prop:"variant",options:S,render:e=>t.jsx(g,{variant:e,children:r}),resolveToken:e=>c.heading.variant[e].fontSize}),t.jsx(h,{component:"Text",prop:"variant",options:b.filter(({id:e})=>P.includes(e)),defaultValue:B,resolveToken:e=>c.text.variant[e].fontSize,render:e=>t.jsx(y,{variant:e,children:r})})]})]}),t.jsxs("div",{lang:o.code,children:[t.jsx(y,{accent:"tertiary",children:t.jsx("i",{children:"Localized sentence"})}),t.jsx(g,{variant:"large",tag:"h2",children:o.localized}),t.jsx(y,{children:o.localized}),i&&t.jsxs(t.Fragment,{children:[t.jsx(h,{component:"Heading",prop:"variant",options:S,render:e=>t.jsx(g,{variant:e,children:o.localized}),resolveToken:e=>c.heading.variant[e].fontSize}),t.jsx(h,{component:"Text",prop:"variant",options:b.filter(({id:e})=>P.includes(e)),defaultValue:B,resolveToken:e=>c.text.variant[e].fontSize,render:e=>t.jsx(y,{variant:e,children:o.localized})})]})]})]},o.code))})]})})}const q=()=>t.jsxs(t.Fragment,{children:[t.jsx(Q,{}),t.jsx(L,{theme:"tokyo-ui",children:t.jsx("div",{"data-preply-ds-theme":"tokyo-ui",children:t.jsx(_,{})})})]});function v(a){const l={h1:"h1",p:"p",...I(),...a.components};return t.jsxs(t.Fragment,{children:[t.jsx(z,{title:"Guides/Assets/Language Font Explorer"}),`
+`}});Q.__docgenInfo={description:"",methods:[],displayName:"GlobalStyle"};const P=["caption-regular","caption-semibold","small-regular","small-regular-italic","small-semibold","small-semibold-italic","default-regular","default-regular-italic","default-semibold","default-semibold-italic","large-regular","large-regular-italic","large-semibold","large-semibold-italic"],C=[{name:"Русский (Russian)",code:"ru",localized:"Привет, мир!"},{name:"English",code:"en",localized:"Hello, World!"},{name:"Polski",code:"pl",localized:"Cześć, Świecie!"},{name:"Deutsch",code:"de",localized:"Hallo, Welt!"},{name:"Українська (Ukranina)",code:"ua",localized:"Привіт, Світ!"},{name:"Português",code:"pt",localized:"Olá, Mundo!"},{name:"Türkçe",code:"tr",localized:"Merhaba, Dünya!"},{name:"Bahasa",code:"id",localized:"Halo, Dunia!"},{name:"Français",code:"fr",localized:"Bonjour, le monde!"},{name:"Italiano",code:"it",localized:"Ciao, Mondo!"},{name:"Español",code:"es",localized:"¡Hola, Mundo!"},{name:"中文 (Chinese)",code:"zh",localized:"你好，世界！"},{name:"日本語 (Japanese)",code:"ja",localized:"こんにちは、世界！"},{name:"한국어 (Korean)",code:"ko",localized:"안녕하세요, 세계!"},{name:"العربية",code:"ar",localized:"مرحبا بك في عالم البرمجة!"},{name:"Nederlands",code:"nl",localized:"Hallo, wereld!"},{name:"Română",code:"ro",localized:"Salut, Lume!"},{name:"Thai",code:"th",localized:"สวัสดี, โลก!"},{name:"Swedish",code:"sv",localized:"Hej, världen!"},{name:"Czeck",code:"cs",localized:"Ahoj, světe!"}],x={en:!0,ua:!0,th:!0,sv:!0,zh:!0};function _(){const a=localStorage.getItem("selectedLanguages"),[l,s]=u.useState(a?JSON.parse(a):x),[i,f]=u.useState(!1),[r,F]=u.useState("Hello, World!");u.useEffect(()=>{localStorage.setItem("selectedLanguages",JSON.stringify(l))},[l]);const h=o=>{s({...l,[o.target.name]:o.target.checked})},k=()=>{const o=C.reduce((e,R)=>(e[R.code]=!0,e),{});s(o)},w=()=>{s({})},d=()=>{s(x)},N=()=>{f(o=>!o)};return t.jsx("div",{className:"App",children:t.jsxs(A,{column:!0,gap:"32",children:[t.jsx(S,{columns:5,gap:"8",children:C.map(o=>t.jsxs("div",{children:[t.jsx("input",{type:"checkbox",name:o.code,checked:l[o.code]||!1,onChange:h,id:o.code}),t.jsxs("label",{htmlFor:o.code,children:[o.name," (",o.code,")"]})]},o.code))}),t.jsxs(A,{gap:"8",children:[t.jsx(m,{variant:"secondary",onClick:k,children:"Select all languages"}),t.jsx(m,{variant:"secondary",onClick:w,children:"Deselect all languages"}),t.jsx(m,{variant:"ghost",onClick:d,children:"Reset selected languages"}),t.jsx(m,{variant:"ghost",onClick:N,children:"Toggle all text variants"})]}),t.jsx(A,{column:!0,gap:"32",children:t.jsx(O,{label:"English sentence",value:r,onValueChange:F})}),t.jsx(S,{columns:3,gap:"16",children:C.filter(o=>l[o.code]).map(o=>t.jsxs("div",{style:{display:"contents"},children:[t.jsxs("div",{children:[o.name," (",o.code,")"]}),t.jsxs("div",{lang:o.code,children:[t.jsx(p,{accent:"tertiary",children:t.jsx("i",{children:"English sentence"})}),t.jsx(g,{variant:"large",tag:"h2",children:r}),t.jsx(p,{children:r}),i&&t.jsxs(t.Fragment,{children:[t.jsx(c,{referenceTheme:"tokyo-ui",component:"Heading",prop:"variant",options:E,render:e=>t.jsx(g,{variant:e,children:r}),resolveToken:e=>U.heading.variant[e].fontSize}),t.jsx(c,{referenceTheme:"tokyo-ui",component:"Text",prop:"variant",options:b.filter(({id:e})=>P.includes(e)),defaultValue:B,resolveToken:e=>U.text.variant[e].fontSize,render:e=>t.jsx(p,{variant:e,children:r})})]})]}),t.jsxs("div",{lang:o.code,children:[t.jsx(p,{accent:"tertiary",children:t.jsx("i",{children:"Localized sentence"})}),t.jsx(g,{variant:"large",tag:"h2",children:o.localized}),t.jsx(p,{children:o.localized}),i&&t.jsxs(t.Fragment,{children:[t.jsx(c,{referenceTheme:"tokyo-ui",component:"Heading",prop:"variant",options:E,render:e=>t.jsx(g,{variant:e,children:o.localized}),resolveToken:e=>U.heading.variant[e].fontSize}),t.jsx(c,{referenceTheme:"tokyo-ui",component:"Text",prop:"variant",options:b.filter(({id:e})=>P.includes(e)),defaultValue:B,resolveToken:e=>U.text.variant[e].fontSize,render:e=>t.jsx(p,{variant:e,children:o.localized})})]})]})]},o.code))})]})})}const q=()=>t.jsxs(t.Fragment,{children:[t.jsx(Q,{}),t.jsx(L,{theme:"tokyo-ui",children:t.jsx("div",{"data-preply-ds-theme":"tokyo-ui",children:t.jsx(_,{})})})]});function v(a){const l={h1:"h1",p:"p",...I(),...a.components};return t.jsxs(t.Fragment,{children:[t.jsx(z,{title:"Guides/Assets/Language Font Explorer"}),`
 `,t.jsx(l.h1,{id:"language-font-explorer",children:"Language Font Explorer"}),`
 `,t.jsx(l.p,{children:"Here you can visualize how headings and texts are rendered for every single language."}),`
 `,t.jsx(q,{})]})}function Bt(a={}){const{wrapper:l}={...I(),...a.components};return l?t.jsx(l,{...a,children:t.jsx(v,{...a})}):v(a)}export{Bt as default};

package/dist/assets/{11.ssr.app-router-DC-0dbEn.js → 11.ssr.app-router-s2wtNWNt.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as n}from"./index-DSz_1G2r.js";import{ae as s}from"./index-BdKDgH-N.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-C6ga-lcz.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";function o(r){const t={a:"a",code:"code",h1:"h1",h2:"h2",p:"p",pre:"pre",...n(),...r.components};return e.jsxs(e.Fragment,{children:[e.jsx(s,{title:"Guides/Installation/SSR/Next.js app router"}),`
+import{j as e}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as n}from"./index-DSz_1G2r.js";import{ae as s}from"./index-BVSiPB0X.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-CFAYM9Mj.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";function o(r){const t={a:"a",code:"code",h1:"h1",h2:"h2",p:"p",pre:"pre",...n(),...r.components};return e.jsxs(e.Fragment,{children:[e.jsx(s,{title:"Guides/Installation/SSR/Next.js app router"}),`
 `,e.jsx(t.h1,{id:"installation-nextjs-app-router",children:"Installation: Next.js app router"}),`
 `,e.jsxs(t.p,{children:["This guide assumes you have read and followed the steps in the ",e.jsx(t.a,{href:"/story/guides-installation-applications--page",children:"Installation: Applications"})," guide."]}),`
 `,e.jsx(t.h2,{id:"packages",children:"Packages"}),`

package/dist/assets/{20.libraries-CmacBW8t.js → 20.libraries-r7trOO77.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as o}from"./index-DSz_1G2r.js";import{ae as r}from"./index-BdKDgH-N.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-C6ga-lcz.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";function i(s){const n={a:"a",code:"code",h1:"h1",h2:"h2",h3:"h3",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...o(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(r,{title:"Guides/Installation/Libraries"}),`
+import{j as e}from"./jsx-runtime-CKrituN3.js";import{useMDXComponents as o}from"./index-DSz_1G2r.js";import{ae as r}from"./index-BVSiPB0X.js";import"./index-CBqU2yxZ.js";import"./_commonjsHelpers-BosuxZz1.js";import"./iframe-CFAYM9Mj.js";import"../sb-preview/runtime.js";import"./index-D5dhze5r.js";import"./index-D-8MO0q_.js";import"./index-DF3CPj03.js";import"./index-DrFu-skq.js";function i(s){const n={a:"a",code:"code",h1:"h1",h2:"h2",h3:"h3",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...o(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(r,{title:"Guides/Installation/Libraries"}),`
 `,e.jsx(n.h1,{id:"installation-libraries",children:"Installation: Libraries"}),`
 `,e.jsxs(n.p,{children:["This guide applies to libraries consumed in Preply applications, and assumes these applications are already integrated according to the steps outlined in the ",e.jsx(n.a,{href:"/story/guides-installation-applications--page",children:"Installation: Applications"})," guide."]}),`
 `,e.jsx(n.h2,{id:"install-packages",children:"Install Packages"}),`