@preply/ds-docs 10.0.0 → 11.0.0

package/dist/assets/AlertDialog-B5rRXSxb.js

@@ -0,0 +1,4 @@
+import{r as a,j as l,I as q,g as J}from"./iframe-B_74HtSc.js";import{H as U}from"./Heading-Cj8Si45g.js";import{B as P}from"./Button-C0Um_QuO.js";import{w as W}from"./componentNames-hc9KR2nX.js";import{u as C,p as j,t as _,a as N,C as S,b as X,c as G,d as H,I as K,i as Y,F as $,e as L,f as z,g as Q,E as A,h as Z,j as ee}from"./useOpenInteractionType-D3sASQWj.js";import{u as f,a as te,D as ne,b as oe,c as se}from"./store-B0wM9Zg8.js";const ae={...j,..._},re=a.forwardRef(function(n,o){const{render:d,className:p,forceRender:s=!1,...i}=n,{store:r}=f(),e=r.useState("open"),u=r.useState("nested"),c=r.useState("mounted"),g=r.useState("transitionStatus"),m=a.useMemo(()=>({open:e,transitionStatus:g}),[e,g]);return C("div",n,{state:m,ref:[r.context.backdropRef,o],props:[{role:"presentation",hidden:!c,style:{userSelect:"none",WebkitUserSelect:"none"}},i],stateAttributesMapping:ae,enabled:s||!u})}),O=a.forwardRef(function(n,o){const{render:d,className:p,disabled:s=!1,nativeButton:i=!0,...r}=n,{store:e}=f(),u=e.useState("open"),{getRootProps:c,ref:g}=te({disabled:s,open:u,setOpen:e.setOpen,nativeButton:i}),m=a.useMemo(()=>({disabled:s}),[s]);return C("button",n,{state:m,ref:[o,g],props:[r,c]})}),le=a.forwardRef(function(n,o){const{render:d,className:p,id:s,...i}=n,{store:r}=f(),e=N(s);return r.useSyncedValueWithCleanup("descriptionElementId",e),C("p",n,{ref:o,props:[{id:e},i]})});let ie=(function(t){return t.nestedDialogs="--nested-dialogs",t})({}),ue=(function(t){return t[t.open=S.open]="open",t[t.closed=S.closed]="closed",t[t.startingStyle=S.startingStyle]="startingStyle",t[t.endingStyle=S.endingStyle]="endingStyle",t.nested="data-nested",t.nestedDialogOpen="data-nested-dialog-open",t})({});const w=a.createContext(void 0);function ce(){const t=a.useContext(w);if(t===void 0)throw new Error("Base UI: <AlertDialog.Portal> is missing.");return t}const de={...j,..._,nestedDialogOpen(t){return t?{[ue.nestedDialogOpen]:""}:null}},pe=a.forwardRef(function(n,o){const{className:d,render:p,initialFocus:s,finalFocus:i,...r}=n,{store:e}=f(),u=e.useState("descriptionElementId"),c=e.useState("floatingRootContext"),g=e.useState("popupProps"),m=e.useState("mounted"),x=e.useState("nested"),R=e.useState("nestedOpenDialogCount"),h=e.useState("open"),T=e.useState("titleElementId"),D=e.useState("transitionStatus");ce(),X({open:h,ref:e.context.popupRef,onComplete(){var v,b;h&&((b=(v=e.context).openChangeComplete)==null||b.call(v,!0))}});const k=G(v=>v==="touch"?e.context.popupRef.current:!0),B=s===void 0?k:s,E=R>0,F=a.useMemo(()=>({open:h,nested:x,transitionStatus:D,nestedDialogOpen:E}),[h,x,D,E]),V=C("div",n,{state:F,props:[g,{"aria-labelledby":T??void 0,"aria-describedby":u??void 0,role:"alertdialog",tabIndex:-1,hidden:!m,onKeyDown(v){H.has(v.key)&&v.stopPropagation()},style:{[ie.nestedDialogs]:R}},r],ref:[o,e.context.popupRef,e.getElementSetter("popupElement")],stateAttributesMapping:de});return l.jsxs(a.Fragment,{children:[m&&l.jsx(K,{ref:e.context.internalBackdropRef,inert:Y(!h)}),l.jsx($,{context:c,disabled:!m,initialFocus:B,returnFocus:i,children:V})]})});function ge(t){const{children:n,keepMounted:o=!1,container:d}=t,{store:p}=f();return p.useState("mounted")||o?l.jsx(w.Provider,{value:o,children:l.jsx(L,{root:d,children:n})}):null}const me={open:!1,dismissible:!1,nested:!1,popupElement:null,triggerElement:null,modal:!0,descriptionElementId:void 0,titleElementId:void 0,openMethod:null,mounted:!1,transitionStatus:"idle",nestedOpenDialogCount:0,triggerProps:A,popupProps:A,floatingRootContext:Q()},fe=function(n){const{children:o,defaultOpen:d=!1,onOpenChange:p,onOpenChangeComplete:s,open:i,actionsRef:r}=n,e=f(),u=!!e,c=z(ne.create,me).current;c.useControlledProp("open",i,d),c.useSyncedValue("nested",u),c.useContextCallback("openChange",p),c.useContextCallback("openChangeComplete",s),oe({store:c,actionsRef:r,parentContext:e==null?void 0:e.store.context});const g=a.useMemo(()=>({store:c}),[c]);return l.jsx(se.Provider,{value:g,children:o})},ve=a.forwardRef(function(n,o){const{render:d,className:p,id:s,...i}=n,{store:r}=f(),e=N(s);return r.useSyncedValueWithCleanup("titleElementId",e),C("h2",n,{ref:o,props:[{id:e},i]})}),Ce=a.forwardRef(function(n,o){const{render:d,className:p,disabled:s=!1,nativeButton:i=!0,...r}=n,{store:e}=f(),u=e.useState("open"),c=e.useState("triggerProps"),g=a.useMemo(()=>({disabled:s,open:u}),[s,u]),{getButtonProps:m,buttonRef:x}=Z({disabled:s,native:i});return C("button",n,{state:g,ref:[o,x,e.getElementSetter("triggerElement")],stateAttributesMapping:ee,props:[c,r,m]})}),he="overlay__vG-Gu",xe="content__Nk-Ib",Se="description__1dRpy",ye="actions__FsX-e",y={overlay:he,content:xe,description:Se,actions:ye},M=a.forwardRef(function(n,o){const d=a.Children.only(n.children);return a.isValidElement(d)?l.jsx(Ce,{render:p=>{const s={...p,ref:o};return a.cloneElement(d,s)}}):null}),Re=a.forwardRef(function(n,o){return l.jsx(O,{ref:o,render:l.jsx(P,{}),...n})}),De=a.forwardRef(function(n,o){return l.jsx(O,{ref:o,render:l.jsx(P,{}),...n})}),Ee=({open:t,title:n,description:o,dataset:d,children:p})=>{const s=q(),i=J(d,{preplyDsComponent:W.AlertDialog});let r;const e=[];return a.Children.forEach(p,u=>{a.isValidElement(u)&&(u.type===M?r=u:e.push(u))}),l.jsxs(fe,{open:t,children:[r,l.jsxs(ge,{container:s,children:[l.jsx(re,{className:y.overlay}),l.jsxs(pe,{...i,className:y.content,children:[l.jsx(ve,{render:l.jsx(U,{tag:"h3",variant:"medium",children:n})}),l.jsx(le,{className:y.description,children:o}),l.jsx("div",{className:y.actions,children:e})]})]})]})},I=Object.assign(Ee,{Trigger:M,Action:Re,Cancel:De});try{I.displayName="AlertDialog",I.__docgenInfo={description:"A modal alertdialog that interrupts the user with important content and expects a response.\n\nUnlike a `Dialog`, it cannot be dismissed by clicking outside or pressing escape.",displayName:"AlertDialog",props:{title:{defaultValue:null,description:"The alert's title, describing what the user needs to confirm",name:"title",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},description:{defaultValue:null,description:"Details about the action and its consequences",name:"description",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},children:{defaultValue:null,description:"The AlertDialog actions.\n@see  `AlertDialog.Actions` for a common actions convenience wrapper.",name:"children",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},open:{defaultValue:null,description:`Controls the visibility of the alert.
+
+Alternatively, you can use the \`AlertDialog.Trigger\` subcomponent for
+an uncontrolled instance.`,name:"open",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}}}}}catch{}export{I as A};

package/dist/assets/AlertDialog.stories-BKT7nitb.js

@@ -0,0 +1,232 @@
+import{j as e,r as h}from"./iframe-B_74HtSc.js";import{A as t}from"./AlertDialog-B5rRXSxb.js";import{B as s}from"./Button-C0Um_QuO.js";import"./preload-helper-Dp1pzeXC.js";import"./Heading-Cj8Si45g.js";import"./text-accent-BQ9POoE5.js";import"./text-centered-BEaaxMgl.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./componentNames-hc9KR2nX.js";import"./useOpenInteractionType-D3sASQWj.js";import"./store-B0wM9Zg8.js";import"./render-icon-MT6RlyNs.js";import"./ButtonBase-HkSfLFbE.js";import"./Spinner-8-RB4YZR.js";import"./useMergeRefs-Caz9hOck.js";import"./useHostname-CbpnzdHv.js";import"./index-CC6DAVyL.js";const{expect:u,userEvent:z,waitFor:I}=__STORYBOOK_MODULE_TEST__,{action:i}=__STORYBOOK_MODULE_ACTIONS__,Q={title:"Components/AlertDialog",component:t,parameters:{preventIframeFromScrollingParent:!0,docs:{description:{component:"A modal alert dialog for confirming destructive or important actions."},story:{inline:!1,height:300}}},play:async({canvas:a,step:n})=>{await n("Open alert",async()=>(await z.click(a.getByTestId("alert-trigger")),I(()=>{const r=a.getByTestId("alert-dialog");u(r).toBeVisible()})))}},l={parameters:{docs:{description:{story:"Uncontrolled alert using the `Trigger`, `Cancel`, and `Action` subcomponents."}}},args:{title:"Confirm",description:"This action cannot be undone.",dataset:{testid:"alert-dialog"}},render:function(n){return e.jsxs(t,{...n,children:[e.jsx(t.Trigger,{children:e.jsx(s,{dataset:{testid:"alert-trigger"},children:"Action"})}),e.jsx(t.Cancel,{variant:"tertiary",onClick:i("cancel"),children:"Cancel"}),e.jsx(t.Action,{onClick:i("confirm"),children:"Confirm"})]})}},c={parameters:{docs:{description:{story:"Uncontrolled alert using the `Trigger`, and two `Action` subcomponents.\n\nThe two actions are styled differently to suggest a preferred action to the one the user has requested.\n\nFor example, in this case, the user is prompted to reschedule instead of canceling."}}},args:{title:"Cancel Lesson",description:"Your balance will not be refunded. Would you like to reschedule instead?",dataset:{testid:"alert-dialog"}},render:function(n){return e.jsxs(t,{...n,children:[e.jsx(t.Trigger,{children:e.jsx(s,{variant:"critical",dataset:{testid:"alert-trigger"},children:"Cancel Lesson"})}),e.jsx(t.Action,{variant:"ghost",onClick:i("cancel"),children:"Cancel lesson"}),e.jsx(t.Action,{variant:"secondary",onClick:i("reschedule"),children:"Reschedule"})]})}},d={parameters:{docs:{description:{story:"Fully controlled using custom `Buttons`."}}},args:{title:"Delete Account",description:"This action cannot be undone.",dataset:{testid:"alert-dialog"}},render:function(n){const[r,o]=h.useState(!1),y=()=>{o(!1),i("account deleted")()},_=()=>{o(!1),i("deletion canceled")()};return e.jsxs(e.Fragment,{children:[e.jsx(s,{onClick:()=>o(!0),dataset:{testid:"alert-trigger"},children:"Action"}),e.jsxs(t,{...n,open:r,children:[e.jsx(t.Cancel,{variant:"tertiary",onClick:_,children:"Cancel"}),e.jsx(t.Action,{variant:"critical",onClick:y,children:"Delete"})]})]})}},p={parameters:{docs:{description:{story:"Fully controlled using a single custom `Button`."}}},args:{title:"Payment failed",description:"The page will refresh. Please try again.",dataset:{testid:"alert-dialog"}},render:function(n){const[r,o]=h.useState(!1);return e.jsxs(e.Fragment,{children:[e.jsx(s,{onClick:()=>o(!0),dataset:{testid:"alert-trigger"},children:"Action"}),e.jsx(t,{...n,open:r,children:e.jsx(t.Action,{onClick:()=>{o(!1),i("page refreshed")()},children:"Refresh"})})]})}},g={parameters:{docs:{description:{story:`
+The Dialog component provides CSS property escape hatches for controlling the z-index of both the overlay and content:
+
+- \`--ds-dialog-overlay-z-index-override\`: Controls the overlay's z-index
+- \`--ds-dialog-content-z-index-override\`: Controls the content's z-index
+
+These should only be used when necessary, as proper stacking context isolation is preferred.
+
+In the following example, the stacking order of the dialog trigger, overlay, and content are
+reveresed using the above CSS properties.
+
+Note: This is done using a \`useEffect\` just for the sake of the story. In a real-world scenario, this should ideally be done in a global stylesheet or a theme provider.
+                `}}},args:{title:"Delete Account",description:"This action cannot be undone.",dataset:{testid:"alert-dialog"}},render:function(n){const[r,o]=h.useState(!1);return h.useEffect(()=>(document.body.style.setProperty("--ds-dialog-overlay-z-index-override","88"),document.body.style.setProperty("--ds-dialog-content-z-index-override","77"),()=>{document.body.style.removeProperty("--ds-dialog-overlay-z-index-override"),document.body.style.removeProperty("--ds-dialog-content-z-index-override")}),[]),e.jsxs("div",{style:{position:"relative",zIndex:99},children:[e.jsx(s,{dataset:{testid:"alert-trigger"},onClick:()=>o(!0),children:"Open"}),e.jsxs(t,{...n,open:r,children:[e.jsx(t.Cancel,{variant:"tertiary",onClick:()=>o(!1),children:"Cancel"}),e.jsx(t.Action,{variant:"critical",onClick:()=>o(!1),children:"Delete"})]})]})},play:async({canvas:a,step:n})=>{await n("Open alert",async()=>(await z.click(a.getByTestId("alert-trigger")),I(()=>{const r=a.getByTestId("alert-dialog");u(r).toBeVisible()}))),await n("Check content's computed z-index",async()=>{const r=a.getByTestId("alert-dialog"),o=getComputedStyle(r);u(o.zIndex).toBe("77")}),await n("Check overlay's computed z-index",async()=>{const r=document.querySelectorAll('[class^="overlay__"]');if(!r)throw new Error("The overlay happened to be in the page, but it isn't anymore. Please update the selector or check if the overlay is properly rendered.");if(r.length>1)throw new Error("There overlay happened to be unique, but it isn't anymore. Please update the selector or check why multiple overlays are rendered.");const o=r[0],y=getComputedStyle(o);u(y.zIndex).toBe("88")})}};var m,f,v;l.parameters={...l.parameters,docs:{...(m=l.parameters)==null?void 0:m.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: \`Uncontrolled alert using the \\\`Trigger\\\`, \\\`Cancel\\\`, and \\\`Action\\\` subcomponents.\`
+      }
+    }
+  },
+  args: {
+    title: 'Confirm',
+    description: 'This action cannot be undone.',
+    dataset: {
+      testid: 'alert-dialog'
+    }
+  },
+  render: function Story(props) {
+    return <AlertDialog {...props}>
+                <AlertDialog.Trigger>
+                    <Button dataset={{
+          testid: 'alert-trigger'
+        }}>Action</Button>
+                </AlertDialog.Trigger>
+                <AlertDialog.Cancel variant="tertiary" onClick={action('cancel')}>
+                    Cancel
+                </AlertDialog.Cancel>
+                <AlertDialog.Action onClick={action('confirm')}>Confirm</AlertDialog.Action>
+            </AlertDialog>;
+  }
+}`,...(v=(f=l.parameters)==null?void 0:f.docs)==null?void 0:v.source}}};var C,A,x;c.parameters={...c.parameters,docs:{...(C=c.parameters)==null?void 0:C.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: \`Uncontrolled alert using the \\\`Trigger\\\`, and two \\\`Action\\\` subcomponents.
+
+The two actions are styled differently to suggest a preferred action to the one the user has requested.
+
+For example, in this case, the user is prompted to reschedule instead of canceling.\`
+      }
+    }
+  },
+  args: {
+    title: 'Cancel Lesson',
+    description: 'Your balance will not be refunded. Would you like to reschedule instead?',
+    dataset: {
+      testid: 'alert-dialog'
+    }
+  },
+  render: function Story(props) {
+    return <AlertDialog {...props}>
+                <AlertDialog.Trigger>
+                    <Button variant="critical" dataset={{
+          testid: 'alert-trigger'
+        }}>
+                        Cancel Lesson
+                    </Button>
+                </AlertDialog.Trigger>
+                <AlertDialog.Action variant="ghost" onClick={action('cancel')}>
+                    Cancel lesson
+                </AlertDialog.Action>
+                <AlertDialog.Action variant="secondary" onClick={action('reschedule')}>
+                    Reschedule
+                </AlertDialog.Action>
+            </AlertDialog>;
+  }
+}`,...(x=(A=c.parameters)==null?void 0:A.docs)==null?void 0:x.source}}};var D,S,b;d.parameters={...d.parameters,docs:{...(D=d.parameters)==null?void 0:D.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: 'Fully controlled using custom \`Buttons\`.'
+      }
+    }
+  },
+  args: {
+    title: 'Delete Account',
+    description: 'This action cannot be undone.',
+    dataset: {
+      testid: 'alert-dialog'
+    }
+  },
+  render: function Story(props) {
+    const [open, setOpen] = useState(false);
+    const handleConfirm = () => {
+      setOpen(false);
+      action('account deleted')();
+    };
+    const handleCancel = () => {
+      setOpen(false);
+      action('deletion canceled')();
+    };
+    return <>
+                <Button onClick={() => setOpen(true)} dataset={{
+        testid: 'alert-trigger'
+      }}>
+                    Action
+                </Button>
+                <AlertDialog {...props} open={open}>
+                    <AlertDialog.Cancel variant="tertiary" onClick={handleCancel}>
+                        Cancel
+                    </AlertDialog.Cancel>
+                    <AlertDialog.Action variant="critical" onClick={handleConfirm}>
+                        Delete
+                    </AlertDialog.Action>
+                </AlertDialog>
+            </>;
+  }
+}`,...(b=(S=d.parameters)==null?void 0:S.docs)==null?void 0:b.source}}};var k,T,w;p.parameters={...p.parameters,docs:{...(k=p.parameters)==null?void 0:k.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: 'Fully controlled using a single custom \`Button\`.'
+      }
+    }
+  },
+  args: {
+    title: 'Payment failed',
+    description: 'The page will refresh. Please try again.',
+    dataset: {
+      testid: 'alert-dialog'
+    }
+  },
+  render: function Story(props) {
+    const [open, setOpen] = useState(false);
+    return <>
+                <Button onClick={() => setOpen(true)} dataset={{
+        testid: 'alert-trigger'
+      }}>
+                    Action
+                </Button>
+                <AlertDialog {...props} open={open}>
+                    <AlertDialog.Action onClick={() => {
+          setOpen(false);
+          action('page refreshed')();
+        }}>
+                        Refresh
+                    </AlertDialog.Action>
+                </AlertDialog>
+            </>;
+  }
+}`,...(w=(T=p.parameters)==null?void 0:T.docs)==null?void 0:w.source}}};var B,O,j;g.parameters={...g.parameters,docs:{...(B=g.parameters)==null?void 0:B.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: \`
+The Dialog component provides CSS property escape hatches for controlling the z-index of both the overlay and content:
+
+- \\\`--ds-dialog-overlay-z-index-override\\\`: Controls the overlay's z-index
+- \\\`--ds-dialog-content-z-index-override\\\`: Controls the content's z-index
+
+These should only be used when necessary, as proper stacking context isolation is preferred.
+
+In the following example, the stacking order of the dialog trigger, overlay, and content are
+reveresed using the above CSS properties.
+
+Note: This is done using a \\\`useEffect\\\` just for the sake of the story. In a real-world scenario, this should ideally be done in a global stylesheet or a theme provider.
+                \`
+      }
+    }
+  },
+  args: {
+    title: 'Delete Account',
+    description: 'This action cannot be undone.',
+    dataset: {
+      testid: 'alert-dialog'
+    }
+  },
+  render: function Story(props) {
+    const [open, setOpen] = useState(false);
+    useEffect(() => {
+      document.body.style.setProperty('--ds-dialog-overlay-z-index-override', '88');
+      document.body.style.setProperty('--ds-dialog-content-z-index-override', '77');
+      return () => {
+        document.body.style.removeProperty('--ds-dialog-overlay-z-index-override');
+        document.body.style.removeProperty('--ds-dialog-content-z-index-override');
+      };
+    }, []);
+    return <div style={{
+      position: 'relative',
+      zIndex: 99
+    }}>
+                <Button dataset={{
+        testid: 'alert-trigger'
+      }} onClick={() => setOpen(true)}>
+                    Open
+                </Button>
+                <AlertDialog {...props} open={open}>
+                    <AlertDialog.Cancel variant="tertiary" onClick={() => setOpen(false)}>
+                        Cancel
+                    </AlertDialog.Cancel>
+                    <AlertDialog.Action variant="critical" onClick={() => setOpen(false)}>
+                        Delete
+                    </AlertDialog.Action>
+                </AlertDialog>
+            </div>;
+  },
+  play: async ({
+    canvas,
+    step
+  }) => {
+    await step('Open alert', async () => {
+      await userEvent.click(canvas.getByTestId('alert-trigger'));
+      return waitFor(() => {
+        const alert = canvas.getByTestId('alert-dialog');
+        expect(alert).toBeVisible();
+      });
+    });
+    await step(\`Check content's computed z-index\`, async () => {
+      const alert = canvas.getByTestId('alert-dialog');
+      const styles = getComputedStyle(alert);
+      expect(styles.zIndex).toBe('77');
+    });
+    await step(\`Check overlay's computed z-index\`, async () => {
+      const overlays = document.querySelectorAll('[class^="overlay__"]');
+      if (!overlays) throw new Error(\`The overlay happened to be in the page, but it isn't anymore. Please update the selector or check if the overlay is properly rendered.\`);
+      if (overlays.length > 1) throw new Error(\`There overlay happened to be unique, but it isn't anymore. Please update the selector or check why multiple overlays are rendered.\`);
+      const overlay = overlays[0];
+      const styles = getComputedStyle(overlay);
+      expect(styles.zIndex).toBe('88');
+    });
+  }
+}`,...(j=(O=g.parameters)==null?void 0:O.docs)==null?void 0:j.source}}};const X=["Uncontrolled","UncontrolledWithSuggestionAction","Controlled","ControlledWithSingleButton","WithZIndexOverride"];export{d as Controlled,p as ControlledWithSingleButton,l as Uncontrolled,c as UncontrolledWithSuggestionAction,g as WithZIndexOverride,X as __namedExportsOrder,Q as default};

package/dist/assets/{Avatar-Dlo9b83e.js → Avatar-Die_4zu0.js}

@@ -1,4 +1,4 @@
-import{r as z,u as p,v as c,w,g as f,j as a,A as g}from"./iframe-DjYTJz7A.js";import{f as y}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{w as e}from"./componentNames-hc9KR2nX.js";import{A as h}from"./constants-5om8Ptru.js";const x="Avatar__K41Tw",N={Avatar:x,"Avatar--size-24":"Avatar--size-24__hDb5G","Avatar--size-32":"Avatar--size-32__0goVI","Avatar--size-48":"Avatar--size-48__uGMSJ","Avatar--size-64":"Avatar--size-64__WD77O","Avatar--size-96":"Avatar--size-96__OxIe2","Avatar--size-160":"Avatar--size-160__8tEPo","Avatar--narrow-l--size-24":"Avatar--narrow-l--size-24__L-54O","Avatar--narrow-l--size-32":"Avatar--narrow-l--size-32__Mdeh3","Avatar--narrow-l--size-48":"Avatar--narrow-l--size-48__1xNsg","Avatar--narrow-l--size-64":"Avatar--narrow-l--size-64__ZQ5C-","Avatar--narrow-l--size-96":"Avatar--narrow-l--size-96__DuZVB","Avatar--narrow-l--size-160":"Avatar--narrow-l--size-160__PN1pX","Avatar--medium-s--size-24":"Avatar--medium-s--size-24__6--6m","Avatar--medium-s--size-32":"Avatar--medium-s--size-32__7rlpv","Avatar--medium-s--size-48":"Avatar--medium-s--size-48__R893D","Avatar--medium-s--size-64":"Avatar--medium-s--size-64__x4N0d","Avatar--medium-s--size-96":"Avatar--medium-s--size-96__1qdaO","Avatar--medium-s--size-160":"Avatar--medium-s--size-160__z7IAl","Avatar--medium-l--size-24":"Avatar--medium-l--size-24__Ndkzw","Avatar--medium-l--size-32":"Avatar--medium-l--size-32__3miIB","Avatar--medium-l--size-48":"Avatar--medium-l--size-48__arPBB","Avatar--medium-l--size-64":"Avatar--medium-l--size-64__aFQa7","Avatar--medium-l--size-96":"Avatar--medium-l--size-96__eg03F","Avatar--medium-l--size-160":"Avatar--medium-l--size-160__fGJ7K","Avatar--wide-s--size-24":"Avatar--wide-s--size-24__Ue7o0","Avatar--wide-s--size-32":"Avatar--wide-s--size-32__hYoGY","Avatar--wide-s--size-48":"Avatar--wide-s--size-48__Q9kzJ","Avatar--wide-s--size-64":"Avatar--wide-s--size-64__vvQME","Avatar--wide-s--size-96":"Avatar--wide-s--size-96__tVnz3","Avatar--wide-s--size-160":"Avatar--wide-s--size-160__brJ59","Avatar--wide-l--size-24":"Avatar--wide-l--size-24__EMfbp","Avatar--wide-l--size-32":"Avatar--wide-l--size-32__7bYZs","Avatar--wide-l--size-48":"Avatar--wide-l--size-48__548Bt","Avatar--wide-l--size-64":"Avatar--wide-l--size-64__5Ce08","Avatar--wide-l--size-96":"Avatar--wide-l--size-96__-6w7Y","Avatar--wide-l--size-160":"Avatar--wide-l--size-160__5ft-T","Avatar--round":"Avatar--round__ZDtGc"},s=z.forwardRef(function({size:i=g,round:t,src:l,alt:v="",dataset:d,crossOrigin:u,...m},A){const n=t??!0,o=p(N,e.Avatar,[c("size",i),w("round",void 0,n)]),_={...y(m),ref:A,className:o.join(" "),...f(d,{preplyDsComponent:e.Avatar})};return a.jsx("picture",{..._,children:a.jsx("img",{src:l||h,alt:v,crossOrigin:u})})});try{s.displayName="Avatar",s.__docgenInfo={description:"",displayName:"Avatar",props:{size:{defaultValue:{value:"32"},description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"24"'},{value:'"32"'},{value:'"48"'},{value:'"64"'},{value:'"96"'},{value:'"160"'},{value:"ResponsiveProp<AvatarSize>"}]}},round:{defaultValue:null,description:"@deprecated this prop is deprecated and has no effect",name:"round",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},src:{defaultValue:null,description:`The avatar image URL.
+import{r as z,u as p,v as c,w,g as f,j as a,A as g}from"./iframe-B_74HtSc.js";import{f as y}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{w as e}from"./componentNames-hc9KR2nX.js";import{A as h}from"./constants-5om8Ptru.js";const x="Avatar__K41Tw",N={Avatar:x,"Avatar--size-24":"Avatar--size-24__hDb5G","Avatar--size-32":"Avatar--size-32__0goVI","Avatar--size-48":"Avatar--size-48__uGMSJ","Avatar--size-64":"Avatar--size-64__WD77O","Avatar--size-96":"Avatar--size-96__OxIe2","Avatar--size-160":"Avatar--size-160__8tEPo","Avatar--narrow-l--size-24":"Avatar--narrow-l--size-24__L-54O","Avatar--narrow-l--size-32":"Avatar--narrow-l--size-32__Mdeh3","Avatar--narrow-l--size-48":"Avatar--narrow-l--size-48__1xNsg","Avatar--narrow-l--size-64":"Avatar--narrow-l--size-64__ZQ5C-","Avatar--narrow-l--size-96":"Avatar--narrow-l--size-96__DuZVB","Avatar--narrow-l--size-160":"Avatar--narrow-l--size-160__PN1pX","Avatar--medium-s--size-24":"Avatar--medium-s--size-24__6--6m","Avatar--medium-s--size-32":"Avatar--medium-s--size-32__7rlpv","Avatar--medium-s--size-48":"Avatar--medium-s--size-48__R893D","Avatar--medium-s--size-64":"Avatar--medium-s--size-64__x4N0d","Avatar--medium-s--size-96":"Avatar--medium-s--size-96__1qdaO","Avatar--medium-s--size-160":"Avatar--medium-s--size-160__z7IAl","Avatar--medium-l--size-24":"Avatar--medium-l--size-24__Ndkzw","Avatar--medium-l--size-32":"Avatar--medium-l--size-32__3miIB","Avatar--medium-l--size-48":"Avatar--medium-l--size-48__arPBB","Avatar--medium-l--size-64":"Avatar--medium-l--size-64__aFQa7","Avatar--medium-l--size-96":"Avatar--medium-l--size-96__eg03F","Avatar--medium-l--size-160":"Avatar--medium-l--size-160__fGJ7K","Avatar--wide-s--size-24":"Avatar--wide-s--size-24__Ue7o0","Avatar--wide-s--size-32":"Avatar--wide-s--size-32__hYoGY","Avatar--wide-s--size-48":"Avatar--wide-s--size-48__Q9kzJ","Avatar--wide-s--size-64":"Avatar--wide-s--size-64__vvQME","Avatar--wide-s--size-96":"Avatar--wide-s--size-96__tVnz3","Avatar--wide-s--size-160":"Avatar--wide-s--size-160__brJ59","Avatar--wide-l--size-24":"Avatar--wide-l--size-24__EMfbp","Avatar--wide-l--size-32":"Avatar--wide-l--size-32__7bYZs","Avatar--wide-l--size-48":"Avatar--wide-l--size-48__548Bt","Avatar--wide-l--size-64":"Avatar--wide-l--size-64__5Ce08","Avatar--wide-l--size-96":"Avatar--wide-l--size-96__-6w7Y","Avatar--wide-l--size-160":"Avatar--wide-l--size-160__5ft-T","Avatar--round":"Avatar--round__ZDtGc"},s=z.forwardRef(function({size:i=g,round:t,src:l,alt:v="",dataset:d,crossOrigin:u,...m},A){const n=t??!0,o=p(N,e.Avatar,[c("size",i),w("round",void 0,n)]),_={...y(m),ref:A,className:o.join(" "),...f(d,{preplyDsComponent:e.Avatar})};return a.jsx("picture",{..._,children:a.jsx("img",{src:l||h,alt:v,crossOrigin:u})})});try{s.displayName="Avatar",s.__docgenInfo={description:"",displayName:"Avatar",props:{size:{defaultValue:{value:"32"},description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"24"'},{value:'"32"'},{value:'"48"'},{value:'"64"'},{value:'"96"'},{value:'"160"'},{value:"ResponsiveProp<AvatarSize>"}]}},round:{defaultValue:null,description:"@deprecated this prop is deprecated and has no effect",name:"round",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},src:{defaultValue:null,description:`The avatar image URL.
 If not provided, the default placeholder image is used instead.`,name:"src",required:!1,type:{name:"enum",value:[{value:"string"}]}},alt:{defaultValue:{value:""},description:`A description of the image.
 This is recommended for accessibility purposes, specifically for users
 of screen readers.

package/dist/assets/{Avatar.stories-B27rtxK8.js → Avatar.stories-DJHK0lEC.js}

@@ -1,4 +1,4 @@
-import{j as a}from"./iframe-DjYTJz7A.js";import{A as s}from"./Avatar-Dlo9b83e.js";import{S as d}from"./consts-KAYct7Gj.js";import"./preload-helper-Dp1pzeXC.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./componentNames-hc9KR2nX.js";import"./constants-5om8Ptru.js";const S={title:"components/Avatar",component:s,argTypes:{size:{description:d}}},t=()=>a.jsxs("div",{style:{display:"flex",gap:"8px",alignItems:"end"},children:[a.jsx(s,{size:"160"}),a.jsx(s,{src:"./assets/avatar-1.png",size:"96"}),a.jsx(s,{src:"./assets/avatar-2.png",size:"64"}),a.jsx(s,{src:"./assets/avatar-3.png",size:"48"}),a.jsx(s,{src:"./assets/avatar-4.png",size:"32"}),a.jsx(s,{src:"./assets/avatar-5.png",size:"24"})]}),r={parameters:{chromatic:{disableSnapshot:!0}},args:{size:"32",src:"./assets/avatar-1.png",dataset:{qaid:"avatar"}},argTypes:{src:{control:"text"},dataset:{control:"object"},alt:{control:"text"},round:{table:{disable:!0}}}};var e,n,o;t.parameters={...t.parameters,docs:{...(e=t.parameters)==null?void 0:e.docs,source:{originalSource:`() => <div style={{
+import{j as a}from"./iframe-B_74HtSc.js";import{A as s}from"./Avatar-Die_4zu0.js";import{S as d}from"./consts-KAYct7Gj.js";import"./preload-helper-Dp1pzeXC.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./componentNames-hc9KR2nX.js";import"./constants-5om8Ptru.js";const S={title:"components/Avatar",component:s,argTypes:{size:{description:d}}},t=()=>a.jsxs("div",{style:{display:"flex",gap:"8px",alignItems:"end"},children:[a.jsx(s,{size:"160"}),a.jsx(s,{src:"./assets/avatar-1.png",size:"96"}),a.jsx(s,{src:"./assets/avatar-2.png",size:"64"}),a.jsx(s,{src:"./assets/avatar-3.png",size:"48"}),a.jsx(s,{src:"./assets/avatar-4.png",size:"32"}),a.jsx(s,{src:"./assets/avatar-5.png",size:"24"})]}),r={parameters:{chromatic:{disableSnapshot:!0}},args:{size:"32",src:"./assets/avatar-1.png",dataset:{qaid:"avatar"}},argTypes:{src:{control:"text"},dataset:{control:"object"},alt:{control:"text"},round:{table:{disable:!0}}}};var e,n,o;t.parameters={...t.parameters,docs:{...(e=t.parameters)==null?void 0:e.docs,source:{originalSource:`() => <div style={{
   display: 'flex',
   gap: '8px',
   alignItems: 'end'

package/dist/assets/{AvatarWithStatus.stories-DBeEaQQL.js → AvatarWithStatus.stories-E9QQr3Dr.js}

@@ -1,4 +1,4 @@
-import{r as T,u as b,w as q,v as C,G as N,g as R,j as a,a4 as w,A as V}from"./iframe-DjYTJz7A.js";import{f as D}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{A as E}from"./Avatar-Dlo9b83e.js";import{w as r}from"./componentNames-hc9KR2nX.js";import"./preload-helper-Dp1pzeXC.js";import"./constants-5om8Ptru.js";const I="AvatarWithStatus__z8Zik",i={AvatarWithStatus:I,"AvatarWithStatus--indicator":"AvatarWithStatus--indicator__dsdXa","AvatarWithStatus--online":"AvatarWithStatus--online__pGAFw","AvatarWithStatus--size-64":"AvatarWithStatus--size-64__vG-kB","AvatarWithStatus--size-96":"AvatarWithStatus--size-96__Dgqc1","AvatarWithStatus--size-160":"AvatarWithStatus--size-160__7gCR7"},e=T.forwardRef(function({online:A=!1,size:n=w,dataset:f,alt:S,crossOrigin:g,src:_,...y},W){const x=b(i,r.AvatarWithStatus,[q("online",void 0,A),C("size",n)]),z=[...N(i,r.AvatarWithStatus,["indicator"])],j={...D(y),ref:W,className:x.join(" "),...R(f,{preplyDsComponent:r.AvatarWithStatus})};return a.jsxs("div",{...j,children:[a.jsx("span",{className:z.join(" ")}),a.jsx("div",{children:a.jsx(E,{alt:S,crossOrigin:g,src:_,size:n??V})})]})});try{e.displayName="AvatarWithStatus",e.__docgenInfo={description:"",displayName:"AvatarWithStatus",props:{dataset:{defaultValue:null,description:`Sets data attributes on the DOM element.
+import{r as T,u as b,w as q,v as C,G as N,g as R,j as a,a4 as w,A as V}from"./iframe-B_74HtSc.js";import{f as D}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{A as E}from"./Avatar-Die_4zu0.js";import{w as r}from"./componentNames-hc9KR2nX.js";import"./preload-helper-Dp1pzeXC.js";import"./constants-5om8Ptru.js";const I="AvatarWithStatus__z8Zik",i={AvatarWithStatus:I,"AvatarWithStatus--indicator":"AvatarWithStatus--indicator__dsdXa","AvatarWithStatus--online":"AvatarWithStatus--online__pGAFw","AvatarWithStatus--size-64":"AvatarWithStatus--size-64__vG-kB","AvatarWithStatus--size-96":"AvatarWithStatus--size-96__Dgqc1","AvatarWithStatus--size-160":"AvatarWithStatus--size-160__7gCR7"},e=T.forwardRef(function({online:A=!1,size:n=w,dataset:f,alt:S,crossOrigin:g,src:_,...y},W){const x=b(i,r.AvatarWithStatus,[q("online",void 0,A),C("size",n)]),z=[...N(i,r.AvatarWithStatus,["indicator"])],j={...D(y),ref:W,className:x.join(" "),...R(f,{preplyDsComponent:r.AvatarWithStatus})};return a.jsxs("div",{...j,children:[a.jsx("span",{className:z.join(" ")}),a.jsx("div",{children:a.jsx(E,{alt:S,crossOrigin:g,src:_,size:n??V})})]})});try{e.displayName="AvatarWithStatus",e.__docgenInfo={description:"",displayName:"AvatarWithStatus",props:{dataset:{defaultValue:null,description:`Sets data attributes on the DOM element.
 @example <Avatar dataset={{ 'qa-id': 'user-avatar' }} /> // will add data-qa-id="user-avatar" to the HTML element`,name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},src:{defaultValue:null,description:`The avatar image URL.
 If not provided, the default placeholder image is used instead.`,name:"src",required:!1,type:{name:"enum",value:[{value:"string"}]}},alt:{defaultValue:null,description:`A description of the image.
 This is recommended for accessibility purposes, specifically for users

package/dist/assets/{Badge-CEZW6Ww4.js → Badge-BSDHZ3bI.js}

@@ -1,4 +1,4 @@
-import{r as y,g as b,j as t}from"./iframe-DjYTJz7A.js";import{f as h}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{I as B}from"./Icon-kphbe0CE.js";import{w as T}from"./componentNames-hc9KR2nX.js";const x="badge__ioy0w",I="label__lXPEF",u={badge:x,label:I},V=e=>{switch(e){case"xs":return"small";case"s":return"medium";case"m":return"large";default:return e}},r=y.forwardRef(function({type:d="neutral",size:l="medium",leadingSvgIcon:n,dataset:o,children:m,accent:s,inverted:i,hideLabel:c,...p},v){const g=V(l),a={...o,size:g};s===void 0&&i===void 0?a.type=d:(a.accent=s||"unset",a.inverted=!!i);const f={...h(p),ref:v,className:u.badge,...b(a,{preplyDsComponent:T.Badge})};return t.jsxs("span",{...f,children:[!!n&&t.jsx(B,{accent:"primary",size:l==="large"?"24":"16",svg:n}),t.jsx("span",{className:u.label,"data-hidden":c,children:m})]})});try{r.displayName="Badge",r.__docgenInfo={description:"",displayName:"Badge",props:{size:{defaultValue:{value:"medium"},description:"The size of the badge.",name:"size",required:!1,type:{name:"enum",value:[{value:'"s"'},{value:'"small"'},{value:'"medium"'},{value:'"large"'},{value:'"xs"'},{value:'"m"'}]}},leadingSvgIcon:{defaultValue:null,description:`The leading SVG icon.
+import{r as y,g as b,j as t}from"./iframe-B_74HtSc.js";import{f as h}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{I as B}from"./Icon-CC0yjdx9.js";import{w as T}from"./componentNames-hc9KR2nX.js";const x="badge__ioy0w",I="label__lXPEF",u={badge:x,label:I},V=e=>{switch(e){case"xs":return"small";case"s":return"medium";case"m":return"large";default:return e}},r=y.forwardRef(function({type:d="neutral",size:l="medium",leadingSvgIcon:n,dataset:o,children:m,accent:s,inverted:i,hideLabel:c,...p},v){const g=V(l),a={...o,size:g};s===void 0&&i===void 0?a.type=d:(a.accent=s||"unset",a.inverted=!!i);const f={...h(p),ref:v,className:u.badge,...b(a,{preplyDsComponent:T.Badge})};return t.jsxs("span",{...f,children:[!!n&&t.jsx(B,{accent:"primary",size:l==="large"?"24":"16",svg:n}),t.jsx("span",{className:u.label,"data-hidden":c,children:m})]})});try{r.displayName="Badge",r.__docgenInfo={description:"",displayName:"Badge",props:{size:{defaultValue:{value:"medium"},description:"The size of the badge.",name:"size",required:!1,type:{name:"enum",value:[{value:'"large"'},{value:'"medium"'},{value:'"small"'},{value:'"s"'},{value:'"xs"'},{value:'"m"'}]}},leadingSvgIcon:{defaultValue:null,description:`The leading SVG icon.
 @example import TokyoUITag from '@preply/ds-media-icons/dist/24/TokyoUITag.svg';
 
 <Badge leadingSvgIcon={TokyoUITag}>Badge</Badge>
@@ -7,4 +7,4 @@ or
 
 Hides badge label visually, but keeps it in the accessibility tree.
 Use this prop to implement icons-only badges.
-@example <Badge leadingSvgIcon={<TokyoUITag />} hideLabel>Badge</Badge>`,name:"hideLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},assistiveText:{defaultValue:null,description:"@deprecated badge children should have all necessary information",name:"assistiveText",required:!1,type:{name:"enum",value:[{value:"string"}]}},type:{defaultValue:{value:"neutral"},description:"The type of the badge.",name:"type",required:!1,type:{name:"enum",value:[{value:'"neutral"'},{value:'"info"'},{value:'"ai"'},{value:'"warning"'},{value:'"critical"'},{value:'"positive"'}]}},accent:{defaultValue:null,description:"@deprecated Use `type` instead.",name:"accent",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"warning"'},{value:'"critical"'},{value:'"positive"'},{value:'"accent"'},{value:'"tertiary"'}]}},inverted:{defaultValue:null,description:"@deprecated inverted badge is deprecated & will be removed in the future releases",name:"inverted",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}}}}}catch{}export{r as B};
+@example <Badge leadingSvgIcon={<TokyoUITag />} hideLabel>Badge</Badge>`,name:"hideLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},assistiveText:{defaultValue:null,description:"@deprecated badge children should have all necessary information",name:"assistiveText",required:!1,type:{name:"enum",value:[{value:"string"}]}},type:{defaultValue:{value:"neutral"},description:"The type of the badge.",name:"type",required:!1,type:{name:"enum",value:[{value:'"positive"'},{value:'"info"'},{value:'"warning"'},{value:'"critical"'},{value:'"ai"'},{value:'"neutral"'}]}},accent:{defaultValue:null,description:"@deprecated Use `type` instead.",name:"accent",required:!1,type:{name:"enum",value:[{value:'"accent"'},{value:'"tertiary"'},{value:'"positive"'},{value:'"info"'},{value:'"warning"'},{value:'"critical"'}]}},inverted:{defaultValue:null,description:"@deprecated inverted badge is deprecated & will be removed in the future releases",name:"inverted",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}}}}}catch{}export{r as B};

package/dist/assets/{Badge.stories-ioY8q4d7.js → Badge.stories-6FOVA96I.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./iframe-DjYTJz7A.js";import{F as n}from"./TokyoUITag-fMAL09F9.js";import{L as d}from"./LayoutFlex-p_p7LCCd.js";import{B as a}from"./Badge-CEZW6Ww4.js";import"./preload-helper-Dp1pzeXC.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./layout-relative.module-BM7yIsEb.js";import"./componentNames-hc9KR2nX.js";import"./Icon-kphbe0CE.js";import"./text-accent-C5-m5mrW.js";import"./render-icon-DZ6hllTG.js";const q={title:"components/Badge",component:a,parameters:{layout:"padded",docs:{source:{type:"dynamic"}}}},t=()=>e.jsxs(d,{gap:"16",children:[e.jsx(a,{type:"neutral",children:"Neutral"}),e.jsx(a,{type:"positive",children:"Positive"}),e.jsx(a,{type:"info",children:"Info"}),e.jsx(a,{type:"warning",children:"Warning"}),e.jsx(a,{type:"critical",children:"Critical"}),e.jsx(a,{type:"ai",children:"AI"}),e.jsx(a,{type:"neutral",leadingSvgIcon:e.jsx(n,{}),children:"Neutral"}),e.jsx(a,{type:"positive",leadingSvgIcon:e.jsx(n,{}),children:"Positive"}),e.jsx(a,{type:"info",leadingSvgIcon:e.jsx(n,{}),children:"Info"}),e.jsx(a,{type:"warning",leadingSvgIcon:e.jsx(n,{}),children:"Warning"}),e.jsx(a,{type:"critical",leadingSvgIcon:e.jsx(n,{}),children:"Critical"}),e.jsx(a,{type:"ai",leadingSvgIcon:e.jsx(n,{}),children:"AI"})]});n.displayName="TokyoUITag";const r=()=>e.jsxs(d,{gap:"16",alignItems:"center",children:[e.jsx(a,{size:"small",leadingSvgIcon:e.jsx(n,{}),children:"Small"}),e.jsx(a,{size:"medium",leadingSvgIcon:e.jsx(n,{}),children:"Medium"}),e.jsx(a,{size:"large",leadingSvgIcon:e.jsx(n,{}),children:"Large"})]}),i=()=>e.jsx(d,{gap:"16",direction:"column",children:e.jsx(a,{size:"small",leadingSvgIcon:e.jsx(n,{}),children:"Badge"})});i.tags=["!autodocs"];const o=()=>e.jsx("div",{style:{maxWidth:150,margin:"0 auto"},children:e.jsx(a,{size:"medium",leadingSvgIcon:e.jsx(n,{}),children:"I'm way too long to be a badge label"})}),s={parameters:{chromatic:{disableSnapshot:!0}},args:{type:"neutral",size:"medium",children:"Badge",dataset:{qaid:"badge"}},argTypes:{dataset:{control:"object"},leadingSvgIcon:{options:["None","With Icon"],mapping:{None:void 0,"With Icon":n},control:"select"},assistiveText:{table:{disable:!0}},accent:{table:{disable:!0}},inverted:{table:{disable:!0}}}};var g,l,c;t.parameters={...t.parameters,docs:{...(g=t.parameters)==null?void 0:g.docs,source:{originalSource:`() => <LayoutFlex gap="16">
+import{j as e}from"./iframe-B_74HtSc.js";import{F as n}from"./TokyoUITag-B1Xueyd7.js";import{L as d}from"./LayoutFlex-DXRMJ9FH.js";import{B as a}from"./Badge-BSDHZ3bI.js";import"./preload-helper-Dp1pzeXC.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./layout-relative.module-BIZVul8q.js";import"./componentNames-hc9KR2nX.js";import"./Icon-CC0yjdx9.js";import"./text-accent-BQ9POoE5.js";import"./render-icon-MT6RlyNs.js";const q={title:"components/Badge",component:a,parameters:{layout:"padded",docs:{source:{type:"dynamic"}}}},t=()=>e.jsxs(d,{gap:"16",children:[e.jsx(a,{type:"neutral",children:"Neutral"}),e.jsx(a,{type:"positive",children:"Positive"}),e.jsx(a,{type:"info",children:"Info"}),e.jsx(a,{type:"warning",children:"Warning"}),e.jsx(a,{type:"critical",children:"Critical"}),e.jsx(a,{type:"ai",children:"AI"}),e.jsx(a,{type:"neutral",leadingSvgIcon:e.jsx(n,{}),children:"Neutral"}),e.jsx(a,{type:"positive",leadingSvgIcon:e.jsx(n,{}),children:"Positive"}),e.jsx(a,{type:"info",leadingSvgIcon:e.jsx(n,{}),children:"Info"}),e.jsx(a,{type:"warning",leadingSvgIcon:e.jsx(n,{}),children:"Warning"}),e.jsx(a,{type:"critical",leadingSvgIcon:e.jsx(n,{}),children:"Critical"}),e.jsx(a,{type:"ai",leadingSvgIcon:e.jsx(n,{}),children:"AI"})]});n.displayName="TokyoUITag";const r=()=>e.jsxs(d,{gap:"16",alignItems:"center",children:[e.jsx(a,{size:"small",leadingSvgIcon:e.jsx(n,{}),children:"Small"}),e.jsx(a,{size:"medium",leadingSvgIcon:e.jsx(n,{}),children:"Medium"}),e.jsx(a,{size:"large",leadingSvgIcon:e.jsx(n,{}),children:"Large"})]}),i=()=>e.jsx(d,{gap:"16",direction:"column",children:e.jsx(a,{size:"small",leadingSvgIcon:e.jsx(n,{}),children:"Badge"})});i.tags=["!autodocs"];const o=()=>e.jsx("div",{style:{maxWidth:150,margin:"0 auto"},children:e.jsx(a,{size:"medium",leadingSvgIcon:e.jsx(n,{}),children:"I'm way too long to be a badge label"})}),s={parameters:{chromatic:{disableSnapshot:!0}},args:{type:"neutral",size:"medium",children:"Badge",dataset:{qaid:"badge"}},argTypes:{dataset:{control:"object"},leadingSvgIcon:{options:["None","With Icon"],mapping:{None:void 0,"With Icon":n},control:"select"},assistiveText:{table:{disable:!0}},accent:{table:{disable:!0}},inverted:{table:{disable:!0}}}};var g,l,c;t.parameters={...t.parameters,docs:{...(g=t.parameters)==null?void 0:g.docs,source:{originalSource:`() => <LayoutFlex gap="16">
         <Badge type="neutral">Neutral</Badge>
         <Badge type="positive">Positive</Badge>
         <Badge type="info">Info</Badge>

package/dist/assets/{Box.stories-udfSjNu1.js → Box.stories-DAVs5Qmd.js}

@@ -1,4 +1,4 @@
-import{r as S,u as O,v as i,g as q,j as a,L as I,a5 as A,a6 as H}from"./iframe-DjYTJz7A.js";import{H as c}from"./Heading-BPJGe0Bg.js";import{L as m}from"./LayoutFlex-p_p7LCCd.js";import{T as b}from"./Text-C8DrHLQF.js";import{f as R}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{g as N}from"./layout-relative.module-BM7yIsEb.js";import{w as u}from"./componentNames-hc9KR2nX.js";import{a as V,S as j}from"./consts-KAYct7Gj.js";import"./preload-helper-Dp1pzeXC.js";import"./text-accent-C5-m5mrW.js";import"./text-centered-D70wah8Y.js";const C="Box__T6Fyt",E={Box:C,"Box--box-radius-0":"Box--box-radius-0__FWPBJ","Box--box-radius-2":"Box--box-radius-2__IXJHQ","Box--box-radius-4":"Box--box-radius-4__aoSlX","Box--box-radius-8":"Box--box-radius-8__-BuzF","Box--box-radius-16":"Box--box-radius-16__n3666","Box--box-radius-300":"Box--box-radius-300__MyFTq","Box--narrow-l--box-radius-0":"Box--narrow-l--box-radius-0__rbA8v","Box--narrow-l--box-radius-2":"Box--narrow-l--box-radius-2__Cn0nB","Box--narrow-l--box-radius-4":"Box--narrow-l--box-radius-4__dXX4d","Box--narrow-l--box-radius-8":"Box--narrow-l--box-radius-8__c2qTs","Box--narrow-l--box-radius-16":"Box--narrow-l--box-radius-16__7yiZ2","Box--narrow-l--box-radius-300":"Box--narrow-l--box-radius-300__Ic2BC","Box--medium-s--box-radius-0":"Box--medium-s--box-radius-0__6dX4D","Box--medium-s--box-radius-2":"Box--medium-s--box-radius-2__h-yhf","Box--medium-s--box-radius-4":"Box--medium-s--box-radius-4__YmbvG","Box--medium-s--box-radius-8":"Box--medium-s--box-radius-8__NOIeK","Box--medium-s--box-radius-16":"Box--medium-s--box-radius-16__Q-4Io","Box--medium-s--box-radius-300":"Box--medium-s--box-radius-300__fynf3","Box--medium-l--box-radius-0":"Box--medium-l--box-radius-0__-HCNC","Box--medium-l--box-radius-2":"Box--medium-l--box-radius-2__cWx-n","Box--medium-l--box-radius-4":"Box--medium-l--box-radius-4__ibcr4","Box--medium-l--box-radius-8":"Box--medium-l--box-radius-8__zm-dC","Box--medium-l--box-radius-16":"Box--medium-l--box-radius-16__o3E1Q","Box--medium-l--box-radius-300":"Box--medium-l--box-radius-300__Hsi3C","Box--wide-s--box-radius-0":"Box--wide-s--box-radius-0__H9zOa","Box--wide-s--box-radius-2":"Box--wide-s--box-radius-2__FnsdM","Box--wide-s--box-radius-4":"Box--wide-s--box-radius-4__G4jL0","Box--wide-s--box-radius-8":"Box--wide-s--box-radius-8__7Mz6S","Box--wide-s--box-radius-16":"Box--wide-s--box-radius-16__or-lk","Box--wide-s--box-radius-300":"Box--wide-s--box-radius-300__rPeg0","Box--wide-l--box-radius-0":"Box--wide-l--box-radius-0__HQ2Tn","Box--wide-l--box-radius-2":"Box--wide-l--box-radius-2__GYO54","Box--wide-l--box-radius-4":"Box--wide-l--box-radius-4__267az","Box--wide-l--box-radius-8":"Box--wide-l--box-radius-8__1hPOR","Box--wide-l--box-radius-16":"Box--wide-l--box-radius-16__gp8Ov","Box--wide-l--box-radius-300":"Box--wide-l--box-radius-300__NiuZR","Box--background-primary":"Box--background-primary__00zVu","Box--background-secondary":"Box--background-secondary__hY7w0","Box--background-tertiary":"Box--background-tertiary__cIPge","Box--background-overlay":"Box--background-overlay__vbs8V","Box--background-disabled":"Box--background-disabled__81WYT","Box--background-brand":"Box--background-brand__2W0VB","Box--background-brandB2b":"Box--background-brandB2b__KQrLm","Box--background-accentLight":"Box--background-accentLight__x6RrQ","Box--background-accentDark":"Box--background-accentDark__agpDd","Box--background-positiveLight":"Box--background-positiveLight__67dRq","Box--background-positiveDark":"Box--background-positiveDark__lYghV","Box--background-infoLight":"Box--background-infoLight__u-TX4","Box--background-infoDark":"Box--background-infoDark__ud4qs","Box--background-warningLight":"Box--background-warningLight__JtSuS","Box--background-warningDark":"Box--background-warningDark__SIgOQ","Box--background-criticalLight":"Box--background-criticalLight__uPTDs","Box--background-criticalDark":"Box--background-criticalDark__12Zft","Box--background-statusOnline":"Box--background-statusOnline__5PZcQ","Box--background-statusOffline":"Box--background-statusOffline__Vh0CO","Box--background-primaryInverted":"Box--background-primaryInverted__TePy2","Box--background-secondaryInverted":"Box--background-secondaryInverted__tMytW","Box--background-tertiaryInverted":"Box--background-tertiaryInverted__K2wU5"},r=S.forwardRef(function({children:g,background:_="primary",radius:v=A,padding:p=H,tag:k,dataset:f,...y},h){const w=O(E,u.Box,[i("box-radius",v),i("background",_)]),L=N(p),P=k??I,D=[...w,...L],T={...R(y),ref:h,className:D.join(" "),...q(f,{preplyDsComponent:u.Box})};return a.jsx(P,{...T,children:g})});try{r.displayName="Box",r.__docgenInfo={description:"A styleable container.\n\nUse this with `Layout*` components to create complex content containers.",displayName:"Box",props:{background:{defaultValue:{value:"primary"},description:"",name:"background",required:!1,type:{name:"enum",value:[{value:'"accentDark"'},{value:'"disabled"'},{value:'"primary"'},{value:'"secondary"'},{value:'"tertiary"'},{value:'"overlay"'},{value:'"brand"'},{value:'"brandB2b"'},{value:'"accentLight"'},{value:'"positiveLight"'},{value:'"positiveDark"'},{value:'"infoLight"'},{value:'"infoDark"'},{value:'"warningLight"'},{value:'"warningDark"'},{value:'"criticalLight"'},{value:'"criticalDark"'},{value:'"statusOnline"'},{value:'"statusOffline"'},{value:'"primaryInverted"'},{value:'"secondaryInverted"'},{value:'"tertiaryInverted"'}]}},radius:{defaultValue:{value:"16"},description:"",name:"radius",required:!1,type:{name:"enum",value:[{value:'"0"'},{value:'"2"'},{value:'"4"'},{value:'"8"'},{value:'"16"'},{value:'"300"'},{value:"ResponsiveProp<BoxRadius>"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"article"'},{value:'"caption"'},{value:'"div"'},{value:'"fieldset"'},{value:'"figcaption"'},{value:'"figure"'},{value:'"footer"'},{value:'"header"'},{value:'"li"'},{value:'"main"'},{value:'"ol"'},{value:'"p"'},{value:'"section"'},{value:'"span"'},{value:'"table"'},{value:'"tbody"'},{value:'"td"'},{value:'"tfoot"'},{value:'"th"'},{value:'"thead"'},{value:'"tr"'},{value:'"ul"'}]}},padding:{defaultValue:{value:"24"},description:"",name:"padding",required:!1,type:{name:"enum",value:[{value:'"24"'},{value:'"32"'},{value:'"48"'},{value:'"64"'},{value:'"96"'},{value:'"160"'},{value:'"0"'},{value:'"1"'},{value:'"2"'},{value:'"4"'},{value:'"6"'},{value:'"8"'},{value:'"12"'},{value:'"16"'},{value:'"20"'},{value:"[BoxPadding, BoxPadding]"},{value:"[BoxPadding, BoxPadding, BoxPadding]"},{value:"[BoxPadding, BoxPadding, BoxPadding, BoxPadding]"},{value:"ResponsiveProp<ShortHand<BoxPadding>>"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLElement | null) => void"},{value:"RefObject<HTMLElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const K={title:"components/Box",component:r,argTypes:{radius:{description:j},padding:{description:V}}},e=()=>a.jsx(r,{background:"positiveLight",children:a.jsxs(m,{gap:"16",direction:"column",children:[a.jsx(c,{tag:"h3",variant:"medium",children:"Heading"}),a.jsx(b,{accent:"positive",children:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed metus nisi, ornare sit amet elit ut, porttitor commodo ipsum. Aliquam vel est quis erat sagittis posuere et vitae eros"})]})});e.storyName="Box";const o={parameters:{chromatic:{disableSnapshot:!0}},args:{background:void 0,radius:void 0,padding:void 0,children:a.jsxs(m,{gap:"16",direction:"column",children:[a.jsx(c,{variant:"large",tag:"h3",children:"Heading"}),a.jsx(b,{children:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed metus nisi, ornare sit amet elit ut, porttitor commodo ipsum. Aliquam vel est quis erat sagittis posuere et vitae eros"})]}),dataset:{qaid:"box"}},argTypes:{children:{control:!1},dataset:{control:"object"}}};var d,s,t;e.parameters={...e.parameters,docs:{...(d=e.parameters)==null?void 0:d.docs,source:{originalSource:`() => <Box background="positiveLight">
+import{r as S,u as O,v as i,g as q,j as a,L as I,a5 as A,a6 as H}from"./iframe-B_74HtSc.js";import{H as c}from"./Heading-Cj8Si45g.js";import{L as m}from"./LayoutFlex-DXRMJ9FH.js";import{T as b}from"./Text-DvShrljd.js";import{f as R}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{g as N}from"./layout-relative.module-BIZVul8q.js";import{w as u}from"./componentNames-hc9KR2nX.js";import{a as V,S as j}from"./consts-KAYct7Gj.js";import"./preload-helper-Dp1pzeXC.js";import"./text-accent-BQ9POoE5.js";import"./text-centered-BEaaxMgl.js";const C="Box__T6Fyt",E={Box:C,"Box--box-radius-0":"Box--box-radius-0__FWPBJ","Box--box-radius-2":"Box--box-radius-2__IXJHQ","Box--box-radius-4":"Box--box-radius-4__aoSlX","Box--box-radius-8":"Box--box-radius-8__-BuzF","Box--box-radius-16":"Box--box-radius-16__n3666","Box--box-radius-300":"Box--box-radius-300__MyFTq","Box--narrow-l--box-radius-0":"Box--narrow-l--box-radius-0__rbA8v","Box--narrow-l--box-radius-2":"Box--narrow-l--box-radius-2__Cn0nB","Box--narrow-l--box-radius-4":"Box--narrow-l--box-radius-4__dXX4d","Box--narrow-l--box-radius-8":"Box--narrow-l--box-radius-8__c2qTs","Box--narrow-l--box-radius-16":"Box--narrow-l--box-radius-16__7yiZ2","Box--narrow-l--box-radius-300":"Box--narrow-l--box-radius-300__Ic2BC","Box--medium-s--box-radius-0":"Box--medium-s--box-radius-0__6dX4D","Box--medium-s--box-radius-2":"Box--medium-s--box-radius-2__h-yhf","Box--medium-s--box-radius-4":"Box--medium-s--box-radius-4__YmbvG","Box--medium-s--box-radius-8":"Box--medium-s--box-radius-8__NOIeK","Box--medium-s--box-radius-16":"Box--medium-s--box-radius-16__Q-4Io","Box--medium-s--box-radius-300":"Box--medium-s--box-radius-300__fynf3","Box--medium-l--box-radius-0":"Box--medium-l--box-radius-0__-HCNC","Box--medium-l--box-radius-2":"Box--medium-l--box-radius-2__cWx-n","Box--medium-l--box-radius-4":"Box--medium-l--box-radius-4__ibcr4","Box--medium-l--box-radius-8":"Box--medium-l--box-radius-8__zm-dC","Box--medium-l--box-radius-16":"Box--medium-l--box-radius-16__o3E1Q","Box--medium-l--box-radius-300":"Box--medium-l--box-radius-300__Hsi3C","Box--wide-s--box-radius-0":"Box--wide-s--box-radius-0__H9zOa","Box--wide-s--box-radius-2":"Box--wide-s--box-radius-2__FnsdM","Box--wide-s--box-radius-4":"Box--wide-s--box-radius-4__G4jL0","Box--wide-s--box-radius-8":"Box--wide-s--box-radius-8__7Mz6S","Box--wide-s--box-radius-16":"Box--wide-s--box-radius-16__or-lk","Box--wide-s--box-radius-300":"Box--wide-s--box-radius-300__rPeg0","Box--wide-l--box-radius-0":"Box--wide-l--box-radius-0__HQ2Tn","Box--wide-l--box-radius-2":"Box--wide-l--box-radius-2__GYO54","Box--wide-l--box-radius-4":"Box--wide-l--box-radius-4__267az","Box--wide-l--box-radius-8":"Box--wide-l--box-radius-8__1hPOR","Box--wide-l--box-radius-16":"Box--wide-l--box-radius-16__gp8Ov","Box--wide-l--box-radius-300":"Box--wide-l--box-radius-300__NiuZR","Box--background-primary":"Box--background-primary__00zVu","Box--background-secondary":"Box--background-secondary__hY7w0","Box--background-tertiary":"Box--background-tertiary__cIPge","Box--background-overlay":"Box--background-overlay__vbs8V","Box--background-disabled":"Box--background-disabled__81WYT","Box--background-brand":"Box--background-brand__2W0VB","Box--background-brandB2b":"Box--background-brandB2b__KQrLm","Box--background-accentLight":"Box--background-accentLight__x6RrQ","Box--background-accentDark":"Box--background-accentDark__agpDd","Box--background-positiveLight":"Box--background-positiveLight__67dRq","Box--background-positiveDark":"Box--background-positiveDark__lYghV","Box--background-infoLight":"Box--background-infoLight__u-TX4","Box--background-infoDark":"Box--background-infoDark__ud4qs","Box--background-warningLight":"Box--background-warningLight__JtSuS","Box--background-warningDark":"Box--background-warningDark__SIgOQ","Box--background-criticalLight":"Box--background-criticalLight__uPTDs","Box--background-criticalDark":"Box--background-criticalDark__12Zft","Box--background-statusOnline":"Box--background-statusOnline__5PZcQ","Box--background-statusOffline":"Box--background-statusOffline__Vh0CO","Box--background-primaryInverted":"Box--background-primaryInverted__TePy2","Box--background-secondaryInverted":"Box--background-secondaryInverted__tMytW","Box--background-tertiaryInverted":"Box--background-tertiaryInverted__K2wU5"},r=S.forwardRef(function({children:g,background:_="primary",radius:v=A,padding:p=H,tag:k,dataset:f,...y},h){const w=O(E,u.Box,[i("box-radius",v),i("background",_)]),L=N(p),P=k??I,D=[...w,...L],T={...R(y),ref:h,className:D.join(" "),...q(f,{preplyDsComponent:u.Box})};return a.jsx(P,{...T,children:g})});try{r.displayName="Box",r.__docgenInfo={description:"A styleable container.\n\nUse this with `Layout*` components to create complex content containers.",displayName:"Box",props:{background:{defaultValue:{value:"primary"},description:"",name:"background",required:!1,type:{name:"enum",value:[{value:'"primary"'},{value:'"secondary"'},{value:'"tertiary"'},{value:'"accentDark"'},{value:'"overlay"'},{value:'"disabled"'},{value:'"brand"'},{value:'"brandB2b"'},{value:'"accentLight"'},{value:'"positiveLight"'},{value:'"positiveDark"'},{value:'"infoLight"'},{value:'"infoDark"'},{value:'"warningLight"'},{value:'"warningDark"'},{value:'"criticalLight"'},{value:'"criticalDark"'},{value:'"statusOnline"'},{value:'"statusOffline"'},{value:'"primaryInverted"'},{value:'"secondaryInverted"'},{value:'"tertiaryInverted"'}]}},radius:{defaultValue:{value:"16"},description:"",name:"radius",required:!1,type:{name:"enum",value:[{value:'"0"'},{value:'"2"'},{value:'"4"'},{value:'"8"'},{value:'"16"'},{value:'"300"'},{value:"ResponsiveProp<BoxRadius>"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"p"'},{value:'"div"'},{value:'"span"'},{value:'"main"'},{value:'"header"'},{value:'"footer"'},{value:'"article"'},{value:'"section"'},{value:'"ul"'},{value:'"ol"'},{value:'"li"'},{value:'"fieldset"'},{value:'"table"'},{value:'"th"'},{value:'"tr"'},{value:'"td"'},{value:'"thead"'},{value:'"tfoot"'},{value:'"tbody"'},{value:'"caption"'},{value:'"figure"'},{value:'"figcaption"'}]}},padding:{defaultValue:{value:"24"},description:"",name:"padding",required:!1,type:{name:"enum",value:[{value:'"0"'},{value:'"2"'},{value:'"4"'},{value:'"8"'},{value:'"16"'},{value:'"1"'},{value:'"6"'},{value:'"12"'},{value:'"20"'},{value:'"24"'},{value:'"32"'},{value:'"48"'},{value:'"64"'},{value:'"96"'},{value:'"160"'},{value:"[BoxPadding, BoxPadding]"},{value:"[BoxPadding, BoxPadding, BoxPadding]"},{value:"[BoxPadding, BoxPadding, BoxPadding, BoxPadding]"},{value:"ResponsiveProp<ShortHand<BoxPadding>>"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLElement | null) => void"},{value:"RefObject<HTMLElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const K={title:"components/Box",component:r,argTypes:{radius:{description:j},padding:{description:V}}},e=()=>a.jsx(r,{background:"positiveLight",children:a.jsxs(m,{gap:"16",direction:"column",children:[a.jsx(c,{tag:"h3",variant:"medium",children:"Heading"}),a.jsx(b,{accent:"positive",children:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed metus nisi, ornare sit amet elit ut, porttitor commodo ipsum. Aliquam vel est quis erat sagittis posuere et vitae eros"})]})});e.storyName="Box";const o={parameters:{chromatic:{disableSnapshot:!0}},args:{background:void 0,radius:void 0,padding:void 0,children:a.jsxs(m,{gap:"16",direction:"column",children:[a.jsx(c,{variant:"large",tag:"h3",children:"Heading"}),a.jsx(b,{children:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed metus nisi, ornare sit amet elit ut, porttitor commodo ipsum. Aliquam vel est quis erat sagittis posuere et vitae eros"})]}),dataset:{qaid:"box"}},argTypes:{children:{control:!1},dataset:{control:"object"}}};var d,s,t;e.parameters={...e.parameters,docs:{...(d=e.parameters)==null?void 0:d.docs,source:{originalSource:`() => <Box background="positiveLight">
         <LayoutFlex gap="16" direction="column">
             <Heading tag="h3" variant="medium">
                 Heading

package/dist/assets/{BubbleCounter.stories-D2G7jKKI.js → BubbleCounter.stories-DHv_hrNV.js}

@@ -1,4 +1,4 @@
-import{j as e,g as je}from"./iframe-DjYTJz7A.js";import{b as l,I as b}from"./IconButton-D4lbFOKH.js";import{w as ye}from"./componentNames-hc9KR2nX.js";import{F as g}from"./TokyoUIMessages-0is9ybHR.js";import{B as C}from"./Button-DS2bg8PO.js";import{A as v}from"./Avatar-Dlo9b83e.js";import{L as j}from"./LayoutFlex-p_p7LCCd.js";import"./preload-helper-Dp1pzeXC.js";import"./render-icon-DZ6hllTG.js";import"./ButtonBase-sV1YoG7h.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./Spinner-BG27lVzS.js";import"./useMergeRefs-CL5DIjXV.js";import"./useHostname-By9vNKnQ.js";import"./index-CC6DAVyL.js";import"./constants-5om8Ptru.js";import"./layout-relative.module-BM7yIsEb.js";const t=({count:r,showEmpty:be=!1,limit:y=99,size:ge="large",variant:xe="dark",children:x,dataset:ve})=>{if(r===void 0&&!be)return x??e.jsx(e.Fragment,{});const z=e.jsx("span",{className:[l.bubbleCounter,l[`size-${ge}`],l[`variant-${xe}`]].join(" "),...je(ve,{preplyDsComponent:ye.BubbleCounter}),children:typeof r=="number"&&(r>y?`${y}+`:r)});return x?e.jsxs("div",{className:l.childTargetOverlay,children:[z,x]}):z};try{t.displayName="BubbleCounter",t.__docgenInfo={description:"",displayName:"BubbleCounter",props:{count:{defaultValue:null,description:"The counter's current value;\n\n- If `undefined`, the counter is not rendered.\n- If above `limit`, the `limit` value is rendered instead, with a `+`\n  suffix.",name:"count",required:!1,type:{name:"enum",value:[{value:"number"}]}},showEmpty:{defaultValue:{value:"false"},description:"If `true`, the counter will render even if `count` is `undefined`.",name:"showEmpty",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},limit:{defaultValue:{value:"99"},description:"",name:"limit",required:!1,type:{name:"enum",value:[{value:"number"}]}},size:{defaultValue:{value:"large"},description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"small"'},{value:'"medium"'},{value:'"large"'}]}},variant:{defaultValue:{value:"dark"},description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"light"'},{value:'"dark"'}]}},children:{defaultValue:null,description:`When provided, the \`BubbleCounter\` will position itself as an indicator
+import{j as e,g as je}from"./iframe-B_74HtSc.js";import{b as l,I as b}from"./IconButton-BpjNyYgD.js";import{w as ye}from"./componentNames-hc9KR2nX.js";import{F as g}from"./TokyoUIMessages-hZLnK87p.js";import{B as C}from"./Button-C0Um_QuO.js";import{A as v}from"./Avatar-Die_4zu0.js";import{L as j}from"./LayoutFlex-DXRMJ9FH.js";import"./preload-helper-Dp1pzeXC.js";import"./render-icon-MT6RlyNs.js";import"./ButtonBase-HkSfLFbE.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./Spinner-8-RB4YZR.js";import"./useMergeRefs-Caz9hOck.js";import"./useHostname-CbpnzdHv.js";import"./index-CC6DAVyL.js";import"./constants-5om8Ptru.js";import"./layout-relative.module-BIZVul8q.js";const t=({count:r,showEmpty:be=!1,limit:y=99,size:ge="large",variant:xe="dark",children:x,dataset:ve})=>{if(r===void 0&&!be)return x??e.jsx(e.Fragment,{});const z=e.jsx("span",{className:[l.bubbleCounter,l[`size-${ge}`],l[`variant-${xe}`]].join(" "),...je(ve,{preplyDsComponent:ye.BubbleCounter}),children:typeof r=="number"&&(r>y?`${y}+`:r)});return x?e.jsxs("div",{className:l.childTargetOverlay,children:[z,x]}):z};try{t.displayName="BubbleCounter",t.__docgenInfo={description:"",displayName:"BubbleCounter",props:{count:{defaultValue:null,description:"The counter's current value;\n\n- If `undefined`, the counter is not rendered.\n- If above `limit`, the `limit` value is rendered instead, with a `+`\n  suffix.",name:"count",required:!1,type:{name:"enum",value:[{value:"number"}]}},showEmpty:{defaultValue:{value:"false"},description:"If `true`, the counter will render even if `count` is `undefined`.",name:"showEmpty",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},limit:{defaultValue:{value:"99"},description:"",name:"limit",required:!1,type:{name:"enum",value:[{value:"number"}]}},size:{defaultValue:{value:"large"},description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"large"'},{value:'"medium"'},{value:'"small"'}]}},variant:{defaultValue:{value:"dark"},description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"light"'},{value:'"dark"'}]}},children:{defaultValue:null,description:`When provided, the \`BubbleCounter\` will position itself as an indicator
 overlay above the target child element.
 
 This is intended to work on just one child, but will not throw errors if

package/dist/assets/{Button-DS2bg8PO.js → Button-C0Um_QuO.js}

@@ -1,11 +1,11 @@
-import{r as _,u as z,v as y,j as a,z as g,D as w}from"./iframe-DjYTJz7A.js";import{r as u}from"./render-icon-DZ6hllTG.js";import{B as V}from"./ButtonBase-sV1YoG7h.js";import{w as i}from"./componentNames-hc9KR2nX.js";const T="Button__zN6zT",q="leadingIcon__wQqJW",E="trailingIcon__zChSf",h="icon__sU6GA",e={Button:T,leadingIcon:q,trailingIcon:E,"Button--size-s":"Button--size-s__yKEFo",icon:h,"Button--size-m":"Button--size-m__-0jeH","Button--size-small":"Button--size-small__xrFvg","Button--size-medium":"Button--size-medium__Mc1B1","Button--size-l":"Button--size-l__7gew2","Button--size-large":"Button--size-large__LejpK","Button--narrow-l--size-s":"Button--narrow-l--size-s__oKIHq","Button--narrow-l--size-m":"Button--narrow-l--size-m__FfkOA","Button--narrow-l--size-small":"Button--narrow-l--size-small__y-M26","Button--narrow-l--size-medium":"Button--narrow-l--size-medium__so23Y","Button--narrow-l--size-l":"Button--narrow-l--size-l__xZOAd","Button--narrow-l--size-large":"Button--narrow-l--size-large__8clcn","Button--medium-s--size-s":"Button--medium-s--size-s__I-GoC","Button--medium-s--size-m":"Button--medium-s--size-m__Fk3sj","Button--medium-s--size-small":"Button--medium-s--size-small__N-91h","Button--medium-s--size-medium":"Button--medium-s--size-medium__sRSxR","Button--medium-s--size-l":"Button--medium-s--size-l__QXDbD","Button--medium-s--size-large":"Button--medium-s--size-large__Rtei-","Button--medium-l--size-s":"Button--medium-l--size-s__YqR0K","Button--medium-l--size-m":"Button--medium-l--size-m__BaJ0d","Button--medium-l--size-small":"Button--medium-l--size-small__iP5bS","Button--medium-l--size-medium":"Button--medium-l--size-medium__JanvZ","Button--medium-l--size-l":"Button--medium-l--size-l__ps0aM","Button--medium-l--size-large":"Button--medium-l--size-large__2gVOL","Button--wide-s--size-s":"Button--wide-s--size-s__OE3Yz","Button--wide-s--size-m":"Button--wide-s--size-m__H2KPf","Button--wide-s--size-small":"Button--wide-s--size-small__lDDYF","Button--wide-s--size-medium":"Button--wide-s--size-medium__CoePZ","Button--wide-s--size-l":"Button--wide-s--size-l__gcSoP","Button--wide-s--size-large":"Button--wide-s--size-large__KLj98","Button--wide-l--size-s":"Button--wide-l--size-s__HAZa1","Button--wide-l--size-m":"Button--wide-l--size-m__xB4x0","Button--wide-l--size-small":"Button--wide-l--size-small__WdoWT","Button--wide-l--size-medium":"Button--wide-l--size-medium__KgZbS","Button--wide-l--size-l":"Button--wide-l--size-l__rw5N1","Button--wide-l--size-large":"Button--wide-l--size-large__7TyOT"},o=_.forwardRef(function({variant:r=w,size:l=g,url:m,a11yLabel:d,leadingSvgIcon:n,trailingSvgIcon:t,children:c,...v},p){const f=!!n||!!t,B=z(e,i.Button,[y("size",l)]);return a.jsxs(V,{...v,ref:p,isIconButton:!1,variant:r,size:l,url:m,a11yLabel:d,preplyDsComponent:i.Button,className:f?B.join(" "):"",children:[!!n&&a.jsx("span",{className:`${e.icon} ${e.leadingIcon}`,children:u(n,{"aria-hidden":"true",focusable:"false"})}),c,!!t&&a.jsx("span",{className:`${e.icon} ${e.trailingIcon}`,children:u(t,{"aria-hidden":"true",focusable:"false"})})]})});try{o.displayName="Button",o.__docgenInfo={description:"",displayName:"Button",props:{href:{defaultValue:null,description:"",name:"href",required:!1,type:{name:"enum",value:[{value:"string"}]}},download:{defaultValue:null,description:"",name:"download",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},variant:{defaultValue:{value:"primary"},description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"ai"'},{value:'"critical"'},{value:'"primary"'},{value:'"secondary"'},{value:'"tertiary"'},{value:'"inverted"'},{value:'"quaternary"'},{value:'"ghost"'},{value:'"onColor"'},{value:'"classroom"'},{value:'"primaryB2b"'},{value:'"primaryTutor"'},{value:'"newFeature"'}]}},opensInNewTab:{defaultValue:null,description:"",name:"opensInNewTab",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},nofollow:{defaultValue:null,description:"",name:"nofollow",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},assistiveText:{defaultValue:null,description:"",name:"assistiveText",required:!1,type:{name:"enum",value:[{value:"string"}]}},as:{defaultValue:null,description:`Custom element to render the button.
+import{r as _,u as z,v as y,j as a,z as g,D as w}from"./iframe-B_74HtSc.js";import{r as u}from"./render-icon-MT6RlyNs.js";import{B as V}from"./ButtonBase-HkSfLFbE.js";import{w as i}from"./componentNames-hc9KR2nX.js";const T="Button__zN6zT",q="leadingIcon__wQqJW",E="trailingIcon__zChSf",h="icon__sU6GA",e={Button:T,leadingIcon:q,trailingIcon:E,"Button--size-s":"Button--size-s__yKEFo",icon:h,"Button--size-m":"Button--size-m__-0jeH","Button--size-small":"Button--size-small__xrFvg","Button--size-medium":"Button--size-medium__Mc1B1","Button--size-l":"Button--size-l__7gew2","Button--size-large":"Button--size-large__LejpK","Button--narrow-l--size-s":"Button--narrow-l--size-s__oKIHq","Button--narrow-l--size-m":"Button--narrow-l--size-m__FfkOA","Button--narrow-l--size-small":"Button--narrow-l--size-small__y-M26","Button--narrow-l--size-medium":"Button--narrow-l--size-medium__so23Y","Button--narrow-l--size-l":"Button--narrow-l--size-l__xZOAd","Button--narrow-l--size-large":"Button--narrow-l--size-large__8clcn","Button--medium-s--size-s":"Button--medium-s--size-s__I-GoC","Button--medium-s--size-m":"Button--medium-s--size-m__Fk3sj","Button--medium-s--size-small":"Button--medium-s--size-small__N-91h","Button--medium-s--size-medium":"Button--medium-s--size-medium__sRSxR","Button--medium-s--size-l":"Button--medium-s--size-l__QXDbD","Button--medium-s--size-large":"Button--medium-s--size-large__Rtei-","Button--medium-l--size-s":"Button--medium-l--size-s__YqR0K","Button--medium-l--size-m":"Button--medium-l--size-m__BaJ0d","Button--medium-l--size-small":"Button--medium-l--size-small__iP5bS","Button--medium-l--size-medium":"Button--medium-l--size-medium__JanvZ","Button--medium-l--size-l":"Button--medium-l--size-l__ps0aM","Button--medium-l--size-large":"Button--medium-l--size-large__2gVOL","Button--wide-s--size-s":"Button--wide-s--size-s__OE3Yz","Button--wide-s--size-m":"Button--wide-s--size-m__H2KPf","Button--wide-s--size-small":"Button--wide-s--size-small__lDDYF","Button--wide-s--size-medium":"Button--wide-s--size-medium__CoePZ","Button--wide-s--size-l":"Button--wide-s--size-l__gcSoP","Button--wide-s--size-large":"Button--wide-s--size-large__KLj98","Button--wide-l--size-s":"Button--wide-l--size-s__HAZa1","Button--wide-l--size-m":"Button--wide-l--size-m__xB4x0","Button--wide-l--size-small":"Button--wide-l--size-small__WdoWT","Button--wide-l--size-medium":"Button--wide-l--size-medium__KgZbS","Button--wide-l--size-l":"Button--wide-l--size-l__rw5N1","Button--wide-l--size-large":"Button--wide-l--size-large__7TyOT"},o=_.forwardRef(function({variant:r=w,size:l=g,url:m,a11yLabel:d,leadingSvgIcon:n,trailingSvgIcon:t,children:c,...v},p){const f=!!n||!!t,B=z(e,i.Button,[y("size",l)]);return a.jsxs(V,{...v,ref:p,isIconButton:!1,variant:r,size:l,url:m,a11yLabel:d,preplyDsComponent:i.Button,className:f?B.join(" "):"",children:[!!n&&a.jsx("span",{className:`${e.icon} ${e.leadingIcon}`,children:u(n,{"aria-hidden":"true",focusable:"false"})}),c,!!t&&a.jsx("span",{className:`${e.icon} ${e.trailingIcon}`,children:u(t,{"aria-hidden":"true",focusable:"false"})})]})});try{o.displayName="Button",o.__docgenInfo={description:"",displayName:"Button",props:{variant:{defaultValue:{value:"primary"},description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"primary"'},{value:'"secondary"'},{value:'"tertiary"'},{value:'"inverted"'},{value:'"critical"'},{value:'"quaternary"'},{value:'"ghost"'},{value:'"onColor"'},{value:'"classroom"'},{value:'"primaryB2b"'},{value:'"primaryTutor"'},{value:'"newFeature"'},{value:'"ai"'}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},size:{defaultValue:{value:"small"},description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"large"'},{value:'"medium"'},{value:'"small"'},{value:"ResponsiveProp<ButtonSize>"}]}},fullWidth:{defaultValue:null,description:"",name:"fullWidth",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},wrap:{defaultValue:null,description:"",name:"wrap",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},href:{defaultValue:null,description:"",name:"href",required:!1,type:{name:"enum",value:[{value:"string"}]}},download:{defaultValue:null,description:"",name:"download",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},opensInNewTab:{defaultValue:null,description:"",name:"opensInNewTab",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},nofollow:{defaultValue:null,description:"",name:"nofollow",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},submitsForm:{defaultValue:null,description:"",name:"submitsForm",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},assistiveText:{defaultValue:null,description:"",name:"assistiveText",required:!1,type:{name:"enum",value:[{value:"string"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler"}]}},onMouseDown:{defaultValue:null,description:"",name:"onMouseDown",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},onMouseUp:{defaultValue:null,description:"",name:"onMouseUp",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},onMouseEnter:{defaultValue:null,description:"",name:"onMouseEnter",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},onMouseMove:{defaultValue:null,description:"",name:"onMouseMove",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},onPointerDown:{defaultValue:null,description:"",name:"onPointerDown",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},onPointerEnter:{defaultValue:null,description:"",name:"onPointerEnter",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},busy:{defaultValue:null,description:"Replaces the content with a loading indicator.",name:"busy",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},as:{defaultValue:null,description:`Custom element to render the button.
 
 Allows rendering the button using a different React element or component.
 This is particularly useful for integrating with router libraries like \`react-router\` or \`next/router\`.
 @example // Render as a react router link component
 import { Link } from 'react-router-dom';
 
-<ButtonBase as={<Link to="/home" />} />`,name:"as",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},url:{defaultValue:null,description:"@deprecated Use `href` instead",name:"url",required:!1,type:{name:"enum",value:[{value:"string"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler"}]}},onMouseDown:{defaultValue:null,description:"",name:"onMouseDown",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},onMouseEnter:{defaultValue:null,description:"",name:"onMouseEnter",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},onMouseMove:{defaultValue:null,description:"",name:"onMouseMove",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},onMouseUp:{defaultValue:null,description:"",name:"onMouseUp",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},onPointerDown:{defaultValue:null,description:"",name:"onPointerDown",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},onPointerEnter:{defaultValue:null,description:"",name:"onPointerEnter",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler"}]}},size:{defaultValue:{value:"small"},description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"small"'},{value:'"medium"'},{value:'"large"'},{value:"ResponsiveProp<ButtonSize>"}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},fullWidth:{defaultValue:null,description:"",name:"fullWidth",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},wrap:{defaultValue:null,description:"",name:"wrap",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},submitsForm:{defaultValue:null,description:"",name:"submitsForm",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},busy:{defaultValue:null,description:"Replaces the content with a loading indicator.",name:"busy",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},a11yLabel:{defaultValue:null,description:"@deprecated Use `assistiveText` instead",name:"a11yLabel",required:!1,type:{name:"enum",value:[{value:"string"}]}},leadingSvgIcon:{defaultValue:null,description:`The leading SVG icon.
+<ButtonBase as={<Link to="/home" />} />`,name:"as",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},url:{defaultValue:null,description:"@deprecated Use `href` instead",name:"url",required:!1,type:{name:"enum",value:[{value:"string"}]}},a11yLabel:{defaultValue:null,description:"@deprecated Use `assistiveText` instead",name:"a11yLabel",required:!1,type:{name:"enum",value:[{value:"string"}]}},leadingSvgIcon:{defaultValue:null,description:`The leading SVG icon.
 @example import TokyoUITag from '@preply/ds-media-icons/dist/24/TokyoUITag.svg';
 
 <Button leadingSvgIcon={TokyoUITag}>Button</Button>

package/dist/assets/{Button.stories-VD5Bx8BA.js → Button.stories-CTSwUwYJ.js}

@@ -1,4 +1,4 @@
-import{j as t,r as X}from"./iframe-DjYTJz7A.js";import{F as a}from"./TokyoUIFav-w08HsdRu.js";import{I as s}from"./IconButton-D4lbFOKH.js";import{B as e}from"./Button-DS2bg8PO.js";import{T as Q}from"./Text-C8DrHLQF.js";import{g as p}from"./getTokenVar-B8jDl0Ui.js";import{c as m}from"./tokens-Cp4gIGSO.js";import{S as b}from"./consts-KAYct7Gj.js";import"./preload-helper-Dp1pzeXC.js";import"./render-icon-DZ6hllTG.js";import"./ButtonBase-sV1YoG7h.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./Spinner-BG27lVzS.js";import"./useMergeRefs-CL5DIjXV.js";import"./useHostname-By9vNKnQ.js";import"./index-CC6DAVyL.js";import"./componentNames-hc9KR2nX.js";import"./text-accent-C5-m5mrW.js";import"./text-centered-D70wah8Y.js";const yt={title:"components/Button",component:e,subcomponents:{IconButton:s},argTypes:{size:{description:b},fullWidth:{description:b}}},i=()=>t.jsxs("div",{style:{display:"flex",gap:"1rem"},children:[t.jsx(e,{children:"Button"}),t.jsx(e,{leadingSvgIcon:a,children:"Button"}),t.jsx(e,{trailingSvgIcon:a,children:"Button"}),t.jsx(s,{svg:a,assistiveText:"Favourite"})]});i.tags=["!autodocs","!test"];i.parameters={chromatic:{disableSnapshot:!0}};const g=()=>{const o=p(m.background.primaryInverted);return t.jsxs("div",{style:{display:"flex",gap:"1rem"},children:[t.jsx(e,{variant:"primary",children:"Primary"}),t.jsx(e,{variant:"secondary",children:"Secondary"}),t.jsx(e,{variant:"tertiary",children:"Tertiary"}),t.jsx(e,{variant:"ghost",children:"Ghost"}),t.jsx("div",{style:{backgroundColor:o,borderRadius:"8px"},children:t.jsx(e,{variant:"inverted",children:"Inverted"})}),t.jsx(e,{variant:"critical",children:"Critical"}),t.jsx(e,{variant:"onColor",children:"onColor"})]})},d=()=>{const o=p(m.background.primaryInverted);return t.jsxs("div",{style:{display:"flex",gap:"1rem"},children:[t.jsx(s,{variant:"primary",svg:a,assistiveText:"primary"}),t.jsx(s,{variant:"secondary",svg:a,assistiveText:"secondary"}),t.jsx(s,{variant:"tertiary",svg:a,assistiveText:"tertiary"}),t.jsx(s,{variant:"ghost",svg:a,assistiveText:"ghost"}),t.jsx("div",{style:{backgroundColor:o,borderRadius:"8px"},children:t.jsx(s,{variant:"inverted",svg:a,assistiveText:"inverted"})}),t.jsx(s,{variant:"critical",svg:a,assistiveText:"critical"}),t.jsx(s,{variant:"onColor",svg:a,assistiveText:"onColor"})]})};d.storyName="Variants (IconButton)";const x=()=>{const o=p(m.background.primaryInverted);return t.jsxs("div",{style:{display:"flex",gap:"8px"},children:[t.jsxs("div",{style:{display:"flex",gap:"4px"},children:[t.jsx(e,{variant:"ai",children:"AI"}),t.jsx(s,{variant:"ai",svg:a,assistiveText:"Fav"})]}),t.jsxs("div",{style:{display:"flex",gap:"4px",backgroundColor:o},children:[t.jsx(e,{variant:"classroom",children:"Classroom"}),t.jsx(s,{variant:"classroom",svg:a,assistiveText:"Fav"})]})]})},y=()=>t.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[t.jsxs("div",{style:{display:"flex",gap:"4px"},children:[t.jsx(e,{size:"small",children:"Small"}),t.jsx(s,{size:"small",svg:a,assistiveText:"Fav"})]}),t.jsxs("div",{style:{display:"flex",gap:"4px"},children:[t.jsx(e,{size:"medium",children:"Medium"}),t.jsx(s,{size:"medium",svg:a,assistiveText:"Fav"})]}),t.jsxs("div",{style:{display:"flex",gap:"4px"},children:[t.jsx(e,{size:"large",children:"Large"}),t.jsx(s,{size:"large",svg:a,assistiveText:"Fav"})]})]}),l=()=>t.jsxs(t.Fragment,{children:[t.jsx(e,{wrap:!0,size:"small",children:"Do the really quite unusually long thing"}),t.jsx(e,{wrap:!0,size:"medium",children:"Do the really quite unusually long thing"}),t.jsx(e,{wrap:!0,size:"large",children:"Do the really quite unusually long thing"})]});l.tags=["!autodocs"];l.decorators=[o=>t.jsx("div",{style:{width:"200px"},children:o()})];const v=()=>t.jsx(e,{size:{_:"small","medium-l":"medium","wide-s":"large"},leadingSvgIcon:a,children:"Change the viewport size"});v.parameters={chromatic:{modes:{"narrow-l":{viewport:"narrow-l"},"medium-l":{viewport:"medium-l"},"wide-s":{viewport:"wide-s"}}}};const u=()=>{const o=p(m.background.primaryInverted);return t.jsx("div",{style:{display:"flex",gap:"16px",flexDirection:"column"},children:["small","medium","large"].map(r=>["primary","secondary","tertiary","ghost","inverted","critical","ai","onColor","classroom"].map(n=>t.jsxs(X.Fragment,{children:[t.jsxs(Q,{variant:"default-regular-italic",children:[n," - ",r]}),t.jsxs("div",{style:{display:"flex",gap:"16px",backgroundColor:n==="inverted"||n==="classroom"?o:void 0},children:[t.jsx(e,{size:r,variant:n,children:"button"}),t.jsx(e,{size:r,variant:n,leadingSvgIcon:a,children:"button"}),t.jsx(e,{size:r,variant:n,trailingSvgIcon:a,children:"button"}),t.jsx(e,{size:r,variant:n,busy:!0,assistiveText:"Fav",children:"button"}),t.jsx(e,{size:r,variant:n,disabled:!0,children:"disabled"}),t.jsx(e,{size:r,variant:n,dsInternalSimulation:"hover",children:"hover"}),t.jsx(e,{size:r,variant:n,dsInternalSimulation:"active",children:"active"}),t.jsx(e,{size:r,variant:n,dsInternalSimulation:"focus",children:"focus"})]},`${r}-${n}`)]},`${r}-${n}`)))})};u.tags=["!autodocs"];const c=()=>{const o=p(m.background.primaryInverted);return t.jsx("div",{style:{display:"flex",gap:"16px",flexDirection:"column"},children:["small","medium","large"].map(r=>["primary","secondary","tertiary","ghost","inverted","critical","ai","onColor","classroom"].map(n=>t.jsxs(t.Fragment,{children:[t.jsxs(Q,{variant:"default-regular-italic",children:[n," - ",r]}),t.jsxs("div",{style:{display:"flex",gap:"16px",backgroundColor:n==="inverted"||n==="classroom"?o:void 0},children:[t.jsx(s,{svg:a,assistiveText:"fav",size:r,variant:n}),t.jsx(s,{svg:a,assistiveText:"fav",size:r,variant:n,busy:!0}),t.jsx(s,{svg:a,assistiveText:"fav",size:r,variant:n,disabled:!0}),t.jsx(s,{svg:a,assistiveText:"fav",size:r,variant:n,dsInternalSimulation:"hover"}),t.jsx(s,{svg:a,assistiveText:"fav",size:r,variant:n,dsInternalSimulation:"active"}),t.jsx(s,{svg:a,assistiveText:"fav",size:r,variant:n,dsInternalSimulation:"focus"})]},`${r}-${n}`)]})))})};c.storyName="Combinations (IconButton)";c.tags=["!autodocs"];const h={parameters:{chromatic:{disableSnapshot:!0}},decorators:[(o,{args:r})=>t.jsx("div",{style:{backgroundColor:r.variant==="inverted"?"black":void 0},children:o()})],args:{children:"Button",dataset:{qaid:"button"}},argTypes:{children:{control:"text"},dataset:{control:"object"},assistiveText:{control:"text"},disabled:{control:"boolean"},fullWidth:{control:"boolean"},wrap:{control:"boolean"},href:{control:"text"},download:{control:"boolean"},opensInNewTab:{control:"boolean"},nofollow:{control:"boolean"},submitsForm:{control:"boolean"},busy:{control:"boolean"},leadingSvgIcon:{options:["None","With Icon"],mapping:{None:void 0,"With Icon":a},control:"select"},trailingSvgIcon:{options:["None","With Icon"],mapping:{None:void 0,"With Icon":a},control:"select"},url:{table:{disable:!0}},a11yLabel:{table:{disable:!0}}}};var B,I,f;i.parameters={...i.parameters,docs:{...(B=i.parameters)==null?void 0:B.docs,source:{originalSource:`() => <div style={{
+import{j as t,r as X}from"./iframe-B_74HtSc.js";import{F as a}from"./TokyoUIFav-C-stY9U_.js";import{I as s}from"./IconButton-BpjNyYgD.js";import{B as e}from"./Button-C0Um_QuO.js";import{T as Q}from"./Text-DvShrljd.js";import{g as p}from"./getTokenVar-CVkrm5Qs.js";import{c as m}from"./tokens-im-qJUCZ.js";import{S as b}from"./consts-KAYct7Gj.js";import"./preload-helper-Dp1pzeXC.js";import"./render-icon-MT6RlyNs.js";import"./ButtonBase-HkSfLFbE.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./Spinner-8-RB4YZR.js";import"./useMergeRefs-Caz9hOck.js";import"./useHostname-CbpnzdHv.js";import"./index-CC6DAVyL.js";import"./componentNames-hc9KR2nX.js";import"./text-accent-BQ9POoE5.js";import"./text-centered-BEaaxMgl.js";const yt={title:"components/Button",component:e,subcomponents:{IconButton:s},argTypes:{size:{description:b},fullWidth:{description:b}}},i=()=>t.jsxs("div",{style:{display:"flex",gap:"1rem"},children:[t.jsx(e,{children:"Button"}),t.jsx(e,{leadingSvgIcon:a,children:"Button"}),t.jsx(e,{trailingSvgIcon:a,children:"Button"}),t.jsx(s,{svg:a,assistiveText:"Favourite"})]});i.tags=["!autodocs","!test"];i.parameters={chromatic:{disableSnapshot:!0}};const g=()=>{const o=p(m.background.primaryInverted);return t.jsxs("div",{style:{display:"flex",gap:"1rem"},children:[t.jsx(e,{variant:"primary",children:"Primary"}),t.jsx(e,{variant:"secondary",children:"Secondary"}),t.jsx(e,{variant:"tertiary",children:"Tertiary"}),t.jsx(e,{variant:"ghost",children:"Ghost"}),t.jsx("div",{style:{backgroundColor:o,borderRadius:"8px"},children:t.jsx(e,{variant:"inverted",children:"Inverted"})}),t.jsx(e,{variant:"critical",children:"Critical"}),t.jsx(e,{variant:"onColor",children:"onColor"})]})},d=()=>{const o=p(m.background.primaryInverted);return t.jsxs("div",{style:{display:"flex",gap:"1rem"},children:[t.jsx(s,{variant:"primary",svg:a,assistiveText:"primary"}),t.jsx(s,{variant:"secondary",svg:a,assistiveText:"secondary"}),t.jsx(s,{variant:"tertiary",svg:a,assistiveText:"tertiary"}),t.jsx(s,{variant:"ghost",svg:a,assistiveText:"ghost"}),t.jsx("div",{style:{backgroundColor:o,borderRadius:"8px"},children:t.jsx(s,{variant:"inverted",svg:a,assistiveText:"inverted"})}),t.jsx(s,{variant:"critical",svg:a,assistiveText:"critical"}),t.jsx(s,{variant:"onColor",svg:a,assistiveText:"onColor"})]})};d.storyName="Variants (IconButton)";const x=()=>{const o=p(m.background.primaryInverted);return t.jsxs("div",{style:{display:"flex",gap:"8px"},children:[t.jsxs("div",{style:{display:"flex",gap:"4px"},children:[t.jsx(e,{variant:"ai",children:"AI"}),t.jsx(s,{variant:"ai",svg:a,assistiveText:"Fav"})]}),t.jsxs("div",{style:{display:"flex",gap:"4px",backgroundColor:o},children:[t.jsx(e,{variant:"classroom",children:"Classroom"}),t.jsx(s,{variant:"classroom",svg:a,assistiveText:"Fav"})]})]})},y=()=>t.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[t.jsxs("div",{style:{display:"flex",gap:"4px"},children:[t.jsx(e,{size:"small",children:"Small"}),t.jsx(s,{size:"small",svg:a,assistiveText:"Fav"})]}),t.jsxs("div",{style:{display:"flex",gap:"4px"},children:[t.jsx(e,{size:"medium",children:"Medium"}),t.jsx(s,{size:"medium",svg:a,assistiveText:"Fav"})]}),t.jsxs("div",{style:{display:"flex",gap:"4px"},children:[t.jsx(e,{size:"large",children:"Large"}),t.jsx(s,{size:"large",svg:a,assistiveText:"Fav"})]})]}),l=()=>t.jsxs(t.Fragment,{children:[t.jsx(e,{wrap:!0,size:"small",children:"Do the really quite unusually long thing"}),t.jsx(e,{wrap:!0,size:"medium",children:"Do the really quite unusually long thing"}),t.jsx(e,{wrap:!0,size:"large",children:"Do the really quite unusually long thing"})]});l.tags=["!autodocs"];l.decorators=[o=>t.jsx("div",{style:{width:"200px"},children:o()})];const v=()=>t.jsx(e,{size:{_:"small","medium-l":"medium","wide-s":"large"},leadingSvgIcon:a,children:"Change the viewport size"});v.parameters={chromatic:{modes:{"narrow-l":{viewport:"narrow-l"},"medium-l":{viewport:"medium-l"},"wide-s":{viewport:"wide-s"}}}};const u=()=>{const o=p(m.background.primaryInverted);return t.jsx("div",{style:{display:"flex",gap:"16px",flexDirection:"column"},children:["small","medium","large"].map(r=>["primary","secondary","tertiary","ghost","inverted","critical","ai","onColor","classroom"].map(n=>t.jsxs(X.Fragment,{children:[t.jsxs(Q,{variant:"default-regular-italic",children:[n," - ",r]}),t.jsxs("div",{style:{display:"flex",gap:"16px",backgroundColor:n==="inverted"||n==="classroom"?o:void 0},children:[t.jsx(e,{size:r,variant:n,children:"button"}),t.jsx(e,{size:r,variant:n,leadingSvgIcon:a,children:"button"}),t.jsx(e,{size:r,variant:n,trailingSvgIcon:a,children:"button"}),t.jsx(e,{size:r,variant:n,busy:!0,assistiveText:"Fav",children:"button"}),t.jsx(e,{size:r,variant:n,disabled:!0,children:"disabled"}),t.jsx(e,{size:r,variant:n,dsInternalSimulation:"hover",children:"hover"}),t.jsx(e,{size:r,variant:n,dsInternalSimulation:"active",children:"active"}),t.jsx(e,{size:r,variant:n,dsInternalSimulation:"focus",children:"focus"})]},`${r}-${n}`)]},`${r}-${n}`)))})};u.tags=["!autodocs"];const c=()=>{const o=p(m.background.primaryInverted);return t.jsx("div",{style:{display:"flex",gap:"16px",flexDirection:"column"},children:["small","medium","large"].map(r=>["primary","secondary","tertiary","ghost","inverted","critical","ai","onColor","classroom"].map(n=>t.jsxs(t.Fragment,{children:[t.jsxs(Q,{variant:"default-regular-italic",children:[n," - ",r]}),t.jsxs("div",{style:{display:"flex",gap:"16px",backgroundColor:n==="inverted"||n==="classroom"?o:void 0},children:[t.jsx(s,{svg:a,assistiveText:"fav",size:r,variant:n}),t.jsx(s,{svg:a,assistiveText:"fav",size:r,variant:n,busy:!0}),t.jsx(s,{svg:a,assistiveText:"fav",size:r,variant:n,disabled:!0}),t.jsx(s,{svg:a,assistiveText:"fav",size:r,variant:n,dsInternalSimulation:"hover"}),t.jsx(s,{svg:a,assistiveText:"fav",size:r,variant:n,dsInternalSimulation:"active"}),t.jsx(s,{svg:a,assistiveText:"fav",size:r,variant:n,dsInternalSimulation:"focus"})]},`${r}-${n}`)]})))})};c.storyName="Combinations (IconButton)";c.tags=["!autodocs"];const h={parameters:{chromatic:{disableSnapshot:!0}},decorators:[(o,{args:r})=>t.jsx("div",{style:{backgroundColor:r.variant==="inverted"?"black":void 0},children:o()})],args:{children:"Button",dataset:{qaid:"button"}},argTypes:{children:{control:"text"},dataset:{control:"object"},assistiveText:{control:"text"},disabled:{control:"boolean"},fullWidth:{control:"boolean"},wrap:{control:"boolean"},href:{control:"text"},download:{control:"boolean"},opensInNewTab:{control:"boolean"},nofollow:{control:"boolean"},submitsForm:{control:"boolean"},busy:{control:"boolean"},leadingSvgIcon:{options:["None","With Icon"],mapping:{None:void 0,"With Icon":a},control:"select"},trailingSvgIcon:{options:["None","With Icon"],mapping:{None:void 0,"With Icon":a},control:"select"},url:{table:{disable:!0}},a11yLabel:{table:{disable:!0}}}};var B,I,f;i.parameters={...i.parameters,docs:{...(B=i.parameters)==null?void 0:B.docs,source:{originalSource:`() => <div style={{
   display: 'flex',
   gap: '1rem'
 }}>