@okta/odyssey-react-mui 1.45.0 → 1.47.1

package/dist/assets/TextField.stories-DL7enA3k.js

@@ -0,0 +1,149 @@
+import{j as v}from"./jsx-runtime-CnH95YSl.js";import{f as w,w as Te,u as r,e as C}from"./index-BJMTVygn.js";import{r as S}from"./index-NdkWRN8K.js";import{O as we}from"./OdysseyStorybookThemeDecorator-BRjYVaUu.js";import{f as e}from"./fieldComponentPropsMetaData-BqbNLw6V.js";import{t as E,M as be}from"./TextField-BuwBI2RX.js";import{I as ve}from"./InputAdornment-D4SsBOPe.js";import{M as Ce}from"./Link-DI6v1ROk.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./OdysseyThemeProvider-BBwjgzn2.js";import"./index-BJTM6NaI.js";import"./OdysseyProvider-2xjMTEu6.js";import"./Field-lyECanzU.js";import"./Box-BGpAHVQV.js";import"./Box-CWTB5xfE.js";import"./List-Be7fhh4_.js";import"./ListItem-C8ebNPnP.js";import"./utils-iop7lDec.js";import"./useFormControl-BMISTZuX.js";import"./FormLabel-BLj3hKkg.js";import"./useIsFocusVisible-DH0qxT5e.js";import"./isHostComponent-DVu5iVWx.js";import"./ButtonBase-BAQsCgRq.js";import"./TransitionGroupContext-DLI0IzWy.js";import"./ScreenReaderText-CM78bF1y.js";import"./visuallyHidden-Dan1xhjv.js";import"./FormHelperText-qF3DX-zz.js";import"./FieldHint-C3tXb7u4.js";import"./Typography-DfSdXC7o.js";import"./Typography-Yf1Zkad_.js";import"./useUniqueId-Bsgqe1tm.js";import"./createUniqueId-ByTaVY63.js";import"./inputUtils-Dbi8XkA6.js";import"./InputBase-DSZ9ZgyW.js";import"./ownerWindow-HkKU3E4x.js";import"./ownerDocument-DW-IO8s5.js";import"./debounce-Be36O1Ab.js";import"./Link-BnBknBcu.js";import"./ExternalLink-BZ-Yczsk.js";const pt={component:be,decorators:[we],tags:["autodocs"],argTypes:{autoCompleteType:{control:"text",description:"This prop helps users to fill forms faster, especially on mobile devices. You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill)",table:{type:{summary:"string"}}},defaultValue:{control:"text",description:"The value of the `input` element. Use when the component is not controlled",table:{type:{summary:"string"},defaultValue:{summary:void 0}}},endAdornment:{control:"text",description:"End `InputAdornment` for this component",table:{type:{summary:"string | ReactElement<typeof Icon>"}}},errorMessage:e.errorMessage,errorMessageList:e.errorMessageList,hasInitialFocus:{control:"boolean",description:"If `true`, the component will receive focus automatically",table:{type:{summary:"boolean"}}},hint:e.hint,HintLinkComponent:e.HintLinkComponent,id:e.id,isDisabled:e.isDisabled,isFullWidth:e.isFullWidth,isMultiline:{control:"boolean",description:"If `true`, a TextareaAutosize element is rendered",table:{type:{summary:"boolean"},defaultValue:{summary:"false"}}},isOptional:e.isOptional,isReadOnly:e.isReadOnly,label:{control:"text",description:"The label for the `input` element",table:{type:{summary:"string"}},type:{required:!0,name:"string"}},name:e.name,onBlur:{description:"Callback fired when the `input` element loses focus",table:{type:{summary:"func"}}},onChange:{description:"Callback fired when the value is changed",table:{type:{summary:"func"}}},onFocus:{description:"Callback fired when the `input` element gets focus",table:{type:{summary:"func"}}},placeholder:{control:"text",description:"The short hint displayed in the `input` before the user enters a value",table:{type:{summary:"string"}}},startAdornment:{control:"text",description:"Start `InputAdornment` for this component",table:{type:{summary:"string | ReactElement<typeof Icon>"}}},type:{options:E,control:{type:"radio"},description:"Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types)",table:{type:{summary:E.join(" | ")},defaultValue:{summary:"text"}}},value:{control:"text",description:"The value of the `input` element, required for a controlled component",table:{type:{summary:"string"}}}},args:{defaultValue:void 0,label:"Destination",onBlur:w(),onChange:w(),onFocus:w()}},n={args:{defaultValue:""},play:async({args:a,canvasElement:x,step:T})=>{await T("Textfield callback",async()=>{const t=Te(x).getByRole("textbox");await r.click(t),await C(a.onFocus).toHaveBeenCalledTimes(1),await r.type(t,"Earth"),await C(a.onChange).toHaveBeenCalledTimes(5),await r.clear(t),await r.tab(),await C(a.onBlur).toHaveBeenCalledTimes(1)})}},o={parameters:{docs:{description:{story:"The values of disabled inputs will not be submitted."}}},args:{isDisabled:!0,defaultValue:"Earth"}},s={args:{isOptional:!0,defaultValue:""}},i={parameters:{docs:{description:{story:"The values of readonly inputs will be submitted."}}},args:{isReadOnly:!0,value:"Earth"}},l={args:{errorMessage:"This field is required.",defaultValue:""}},p={args:{errorMessage:"This field is required:",errorMessageList:["At least 2 chars","No more than 20 chars"],defaultValue:""}},c={args:{isFullWidth:!0}},m={args:{hint:"Specify your destination within the Sol system.",defaultValue:""}},u={args:{hint:"Specify your destination within the Sol system. Learn more",HintLinkComponent:v.jsx(Ce,{href:"/learn-more",children:"about the Sol system"}),defaultValue:""}},d={parameters:{docs:{description:{story:"TextField supports both `string` and `<Icon />` adornments."}}},args:{label:"Cargo weight",endAdornment:v.jsx(ve,{position:"end",children:"kg"}),defaultValue:""}},h={args:{autoCompleteType:"work email",label:"Company email",type:"email",defaultValue:""}},y={parameters:{docs:{description:{story:"As the user types, the field will grow vertically to accommodate the new lines."}}},args:{autoCompleteType:"shipping street-address",label:"Permanent residence",isMultiline:!0,defaultValue:""},name:"Multiline (Textarea)"},g={args:{placeholder:"Destination within the Sol system"}},f={parameters:{docs:{description:{story:"TextFields of type `tel` are not automatically validated because global formats are so varied."}}},args:{autoCompleteType:"mobile tel",label:"Phone number",startAdornment:v.jsx(ve,{position:"start",children:"+1"}),type:"tel",defaultValue:""}},b={parameters:{docs:{description:{story:"When the component is controlled, the parent component is responsible for passing `value` to the component and listening for changes with `onChange`"}}},args:{value:"Initial state"},render:function({...x}){const[T,V]=S.useState("Initial state"),t=S.useCallback(xe=>V(xe.target.value),[]);return v.jsx(be,{...x,onChange:t,value:T})}};var M,L,k;n.parameters={...n.parameters,docs:{...(M=n.parameters)==null?void 0:M.docs,source:{originalSource:`{
+  args: {
+    defaultValue: ""
+  },
+  play: async ({
+    args,
+    canvasElement,
+    step
+  }) => {
+    await step("Textfield callback", async () => {
+      const canvas = within(canvasElement);
+      const textbox = canvas.getByRole("textbox");
+      await userEvent.click(textbox);
+      await expect(args.onFocus).toHaveBeenCalledTimes(1);
+      await userEvent.type(textbox, "Earth");
+      await expect(args.onChange).toHaveBeenCalledTimes(5);
+      await userEvent.clear(textbox);
+      await userEvent.tab();
+      await expect(args.onBlur).toHaveBeenCalledTimes(1);
+    });
+  }
+}`,...(k=(L=n.parameters)==null?void 0:L.docs)==null?void 0:k.source}}};var A,F,I;o.parameters={...o.parameters,docs:{...(A=o.parameters)==null?void 0:A.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: "The values of disabled inputs will not be submitted."
+      }
+    }
+  },
+  args: {
+    isDisabled: true,
+    defaultValue: "Earth"
+  }
+}`,...(I=(F=o.parameters)==null?void 0:F.docs)==null?void 0:I.source}}};var H,O,D;s.parameters={...s.parameters,docs:{...(H=s.parameters)==null?void 0:H.docs,source:{originalSource:`{
+  args: {
+    isOptional: true,
+    defaultValue: ""
+  }
+}`,...(D=(O=s.parameters)==null?void 0:O.docs)==null?void 0:D.source}}};var B,R,W;i.parameters={...i.parameters,docs:{...(B=i.parameters)==null?void 0:B.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: "The values of readonly inputs will be submitted."
+      }
+    }
+  },
+  args: {
+    isReadOnly: true,
+    value: "Earth"
+  }
+}`,...(W=(R=i.parameters)==null?void 0:R.docs)==null?void 0:W.source}}};var j,P,q;l.parameters={...l.parameters,docs:{...(j=l.parameters)==null?void 0:j.docs,source:{originalSource:`{
+  args: {
+    errorMessage: "This field is required.",
+    defaultValue: ""
+  }
+}`,...(q=(P=l.parameters)==null?void 0:P.docs)==null?void 0:q.source}}};var z,_,N;p.parameters={...p.parameters,docs:{...(z=p.parameters)==null?void 0:z.docs,source:{originalSource:`{
+  args: {
+    errorMessage: "This field is required:",
+    errorMessageList: ["At least 2 chars", "No more than 20 chars"],
+    defaultValue: ""
+  }
+}`,...(N=(_=p.parameters)==null?void 0:_.docs)==null?void 0:N.source}}};var U,Y,G;c.parameters={...c.parameters,docs:{...(U=c.parameters)==null?void 0:U.docs,source:{originalSource:`{
+  args: {
+    isFullWidth: true
+  }
+}`,...(G=(Y=c.parameters)==null?void 0:Y.docs)==null?void 0:G.source}}};var J,K,Q;m.parameters={...m.parameters,docs:{...(J=m.parameters)==null?void 0:J.docs,source:{originalSource:`{
+  args: {
+    hint: "Specify your destination within the Sol system.",
+    defaultValue: ""
+  }
+}`,...(Q=(K=m.parameters)==null?void 0:K.docs)==null?void 0:Q.source}}};var X,Z,$;u.parameters={...u.parameters,docs:{...(X=u.parameters)==null?void 0:X.docs,source:{originalSource:`{
+  args: {
+    hint: "Specify your destination within the Sol system. Learn more",
+    HintLinkComponent: <Link href="/learn-more">about the Sol system</Link>,
+    defaultValue: ""
+  }
+}`,...($=(Z=u.parameters)==null?void 0:Z.docs)==null?void 0:$.source}}};var ee,te,ae;d.parameters={...d.parameters,docs:{...(ee=d.parameters)==null?void 0:ee.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: "TextField supports both \`string\` and \`<Icon />\` adornments."
+      }
+    }
+  },
+  args: {
+    label: "Cargo weight",
+    endAdornment: <InputAdornment position="end">kg</InputAdornment>,
+    defaultValue: ""
+  }
+}`,...(ae=(te=d.parameters)==null?void 0:te.docs)==null?void 0:ae.source}}};var re,ne,oe;h.parameters={...h.parameters,docs:{...(re=h.parameters)==null?void 0:re.docs,source:{originalSource:`{
+  args: {
+    autoCompleteType: "work email",
+    label: "Company email",
+    type: "email",
+    defaultValue: ""
+  }
+}`,...(oe=(ne=h.parameters)==null?void 0:ne.docs)==null?void 0:oe.source}}};var se,ie,le;y.parameters={...y.parameters,docs:{...(se=y.parameters)==null?void 0:se.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: "As the user types, the field will grow vertically to accommodate the new lines."
+      }
+    }
+  },
+  args: {
+    autoCompleteType: "shipping street-address",
+    label: "Permanent residence",
+    isMultiline: true,
+    defaultValue: ""
+  },
+  name: "Multiline (Textarea)"
+}`,...(le=(ie=y.parameters)==null?void 0:ie.docs)==null?void 0:le.source}}};var pe,ce,me;g.parameters={...g.parameters,docs:{...(pe=g.parameters)==null?void 0:pe.docs,source:{originalSource:`{
+  args: {
+    placeholder: "Destination within the Sol system"
+  }
+}`,...(me=(ce=g.parameters)==null?void 0:ce.docs)==null?void 0:me.source}}};var ue,de,he;f.parameters={...f.parameters,docs:{...(ue=f.parameters)==null?void 0:ue.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: "TextFields of type \`tel\` are not automatically validated because global formats are so varied."
+      }
+    }
+  },
+  args: {
+    autoCompleteType: "mobile tel",
+    label: "Phone number",
+    startAdornment: <InputAdornment position="start">+1</InputAdornment>,
+    type: "tel",
+    defaultValue: ""
+  }
+}`,...(he=(de=f.parameters)==null?void 0:de.docs)==null?void 0:he.source}}};var ye,ge,fe;b.parameters={...b.parameters,docs:{...(ye=b.parameters)==null?void 0:ye.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: "When the component is controlled, the parent component is responsible for passing \`value\` to the component and listening for changes with \`onChange\`"
+      }
+    }
+  },
+  args: {
+    value: "Initial state"
+  },
+  render: function C({
+    ...props
+  }) {
+    const [localValue, setLocalValue] = useState("Initial state");
+    const onChange = useCallback((event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => setLocalValue(event.target.value), []);
+    return <TextField {...props} onChange={onChange} value={localValue} />;
+  }
+}`,...(fe=(ge=b.parameters)==null?void 0:ge.docs)==null?void 0:fe.source}}};const ct=["Default","Disabled","Optional","ReadOnly","Error","ErrorsList","FullWidth","Hint","HintLink","Adornment","Email","Multiline","Placeholder","Tel","ControlledTextField"];export{d as Adornment,b as ControlledTextField,n as Default,o as Disabled,h as Email,l as Error,p as ErrorsList,c as FullWidth,m as Hint,u as HintLink,y as Multiline,s as Optional,g as Placeholder,i as ReadOnly,f as Tel,ct as __namedExportsOrder,pt as default};

package/dist/assets/Toast.stories-DO1V8pyh.js

@@ -0,0 +1,134 @@
+import{j as t}from"./jsx-runtime-CnH95YSl.js";import{a as m,w as S,u as c,e as B}from"./index-BJMTVygn.js";import{r as l}from"./index-NdkWRN8K.js";import{a as Y}from"./axeRun-B-LchFqf.js";import{O as et}from"./OdysseyStorybookThemeDecorator-BRjYVaUu.js";import{J as st,a2 as at}from"./OdysseyThemeProvider-BBwjgzn2.js";import{M as it}from"./Link-DI6v1ROk.js";import{M as nt}from"./ScreenReaderText-CM78bF1y.js";import{S as Z}from"./Snackbar-Cn_gMSEK.js";import{A as ot,a as rt}from"./AlertTitle-BbBpDTwd.js";import{M as D}from"./Button-DGmXZ3jw.js";import{B as lt}from"./Box-CWTB5xfE.js";import{c as k}from"./createUniqueId-ByTaVY63.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./axe-4JP0vCEZ.js";import"./index-BJTM6NaI.js";import"./OdysseyProvider-2xjMTEu6.js";import"./Link-BnBknBcu.js";import"./useIsFocusVisible-DH0qxT5e.js";import"./Typography-Yf1Zkad_.js";import"./ExternalLink-BZ-Yczsk.js";import"./visuallyHidden-Dan1xhjv.js";import"./TransitionGroupContext-DLI0IzWy.js";import"./resolveComponentProps-BzfJewMt.js";import"./isHostComponent-DVu5iVWx.js";import"./utils-DkZjDCLm.js";import"./index-B5xazMy1.js";import"./index-DieBXP3Z.js";import"./Grow-DacPmog-.js";import"./Portal-GAJY6Au9.js";import"./ownerDocument-DW-IO8s5.js";import"./Paper-XsV8SWR9.js";import"./useSlot-CaOQD_17.js";import"./createSvgIcon-DsUj6UQo.js";import"./Close-ATS01D1v.js";import"./IconButton-OY9nJWpv.js";import"./ButtonBase-BAQsCgRq.js";import"./BaseButton-COF38VLB.js";import"./MuiPropsContext-DhRylJZk.js";import"./Tooltip-XQJL1Byd.js";import"./Tooltip-D4AWrTBw.js";import"./useControlled-NQulfz4l.js";import"./Popper-DjhYeJJy.js";import"./Button-CdPi1pZc.js";const C=["status","alert"],A=["success","info","warning","error"],ct={onClickAway:()=>!1},mt=({autoHideDuration:n=6e3,isDismissable:s,linkText:o,linkUrl:a,isVisible:e,onHide:r,role:i,severity:u,testId:p,text:P,translate:w})=>{const{t:I}=st(),[tt,V]=l.useState(e);l.useEffect(()=>{V(e)},[e]);const j=l.useCallback(()=>{V(!1),r==null||r()},[r]);return t.jsx(t.Fragment,{children:t.jsx(Z,{autoHideDuration:s||n<=0?void 0:n,className:"Toast",ClickAwayListenerProps:ct,onClose:j,open:tt,children:t.jsxs(ot,{action:s===!0&&t.jsx(D,{ariaLabel:I("close.text"),onClick:j,size:"small",startIcon:t.jsx(at,{}),variant:"floating"}),"data-se":p,role:i,severity:u,variant:"toast",children:[t.jsxs(rt,{translate:w,children:[t.jsxs(nt,{translate:w,children:[I(`severity.${u}`),":"]}),P]}),a&&t.jsx(it,{href:a,translate:w,variant:"monochrome",children:o})]})})})},x=l.memo(mt);x.displayName="Toast";const ut=({children:n})=>t.jsx(Z,{open:!0,children:t.jsx(lt,{sx:{display:"flex",flexDirection:"column-reverse",gap:2},children:n})}),E=l.memo(ut);E.displayName="ToastStack";const se={component:x,decorators:[et],tags:["autodocs"],argTypes:{autoHideDuration:{control:"number",description:"If set, this determines how long the toast should appear before automatically disappearing in milliseconds. It will only take effect if the toast is not dismissible. If left blank, it defaults to 6000",table:{type:{summary:"number"},defaultValue:{summary:"6000"}}},isDismissable:{control:"boolean",description:"If `true`, the alert will include a close button",table:{type:{summary:"boolean"},defaultValue:{summary:"false"}}},isVisible:{control:"boolean",description:"If true, the Toast is visible",table:{type:{summary:"boolean"}}},linkText:{control:"text",description:"If linkUrl is defined, this is the text of the link. If left blank, it defaults to 'Learn more'. Note that linkText does nothing if linkUrl is not defined",table:{type:{summary:"string"}}},linkUrl:{control:"text",description:"If defined, the alert will include a link to the URL",table:{type:{summary:"string"}}},onHide:{description:"An optional function to run when the Toast is closed",table:{type:{summary:"func"}}},role:{options:C,control:{type:"radio"},description:"Sets the ARIA role of the alert ('status' for something that dynamically updates, 'alert' for errors, null for something unchanging)",table:{type:{summary:C.join(" | ")}}},severity:{options:A,control:{type:"radio"},description:"Determine the color and icon of the alert",table:{type:{summary:A.join(" | ")}},type:{required:!0,name:"other",value:"radio"}},text:{control:"text",description:"The text content of the alert",table:{type:{summary:"string"}},type:{required:!0,name:"string"}}},args:{severity:"info",role:"status",linkText:"Info",text:"The mission to Sagittarius A is set for January 7.",autoHideDuration:1e4}},v=n=>({args:s,canvasElement:o,step:a})=>a(`open ${n}`,async()=>{await m(async()=>{const e=S(o).getByText(`Open ${s.severity} toast`);await c.hover(e),await c.click(e),await c.tab()}),await m(()=>Y(n))}),d={args:{isVisible:!1,role:"status"},render:function(s){const[o,a]=l.useState(s.isVisible),e=l.useCallback(()=>a(!0),[]),r=l.useCallback(()=>a(!1),[]);return t.jsxs(t.Fragment,{children:[t.jsx(D,{label:`Open ${s.severity} toast`,onClick:e,variant:"primary"}),t.jsx(E,{children:t.jsx(x,{autoHideDuration:s.autoHideDuration,isDismissable:s.isDismissable,isVisible:o,linkText:s.linkText,linkUrl:s.linkUrl,onHide:r,role:s.role,severity:s.severity,text:s.text})})]})}},y={...d,args:{text:"The mission to Sagittarius A is set for January 7.",severity:"info"},play:v("Info Toast")},T={...d,name:"Error",args:{text:"Security breach in Hangar 18",role:"alert",severity:"error"},play:v("Error Toast")},b={...d,args:{text:"Severe solar winds may delay local system flights",role:"status",severity:"warning"},play:v("Warning Toast")},h={...d,args:{text:"Docking completed",role:"status",severity:"success"},play:v("Success Toast")},f={...d,args:{isDismissable:!0,linkText:"View report",linkUrl:"#"},play:async({args:n,canvasElement:s,step:o})=>{const a=S(s);await o("open Dismissible Toast}",async()=>{await m(async()=>{const e=a.getByText(`Open ${n.severity} toast`);await c.hover(e),await c.click(e),await c.tab()})}),await o("link in toast",async()=>{await m(()=>{const e=a.getByText(n.linkText||"");B(e).toHaveAttribute("href",n.linkUrl)})}),await o("dismiss toast and reopen",async()=>{await m(async()=>{const e=a.getByRole("status");if(e){const r=S(e).getByRole("button",{name:"Close"});r&&(await c.click(r),await m(async()=>{B(e).not.toBeVisible();const i=a.getByText(`Open ${n.severity} toast`);await c.click(i)}))}}),await m(()=>Y("Dismissible Toast"))})}},g={parameters:{docs:{description:{story:"`Toast` handles the visual appearance and show/hide logic, but not positioning. To have a Toast positioned correctly, it must be wrapped inside a `ToastStack`. There should only be one ToastStack per screen, regardless of how many Toasts there are, since a single ToastStack can accept multiple Toasts as children and will manage positioning accordingly."}}},render:function(){const s=[{id:k(),severity:"info",text:"The mission to Sagittarius A is set for January 7.",isDismissable:!0,isVisible:!0},{id:k(),severity:"success",text:"Docking completed.",isDismissable:!0,isVisible:!0}],[o,a]=l.useState(s),e=l.useCallback(()=>{const i=[{severity:"warning",text:"Severe solar winds may delay local system flights.",isDismissable:!0,isVisible:!0},{severity:"error",text:"Security breach in Hangar 10.",isDismissable:!0,isVisible:!0}],u=i[Math.floor(Math.random()*i.length)];a(p=>[...p,{...u,id:k()}])},[]),r=l.useCallback(i=>{a(u=>u.filter(p=>p.id!==i))},[]);return t.jsxs(t.Fragment,{children:[t.jsx(D,{label:"Open another Toast",onClick:e,variant:"primary"}),t.jsx(E,{children:o.map(i=>t.jsx(x,{isDismissable:i.isDismissable,isVisible:i.isVisible,onHide:()=>r(i.id),severity:i.severity,text:i.text},i.id))})]})}};var M,O,U;y.parameters={...y.parameters,docs:{...(M=y.parameters)==null?void 0:M.docs,source:{originalSource:`{
+  ...Single,
+  args: {
+    text: "The mission to Sagittarius A is set for January 7.",
+    severity: "info"
+  },
+  play: openToast("Info Toast")
+}`,...(U=(O=y.parameters)==null?void 0:O.docs)==null?void 0:U.source}}};var H,R,F;T.parameters={...T.parameters,docs:{...(H=T.parameters)==null?void 0:H.docs,source:{originalSource:`{
+  ...Single,
+  name: "Error",
+  args: {
+    text: "Security breach in Hangar 18",
+    role: "alert",
+    severity: "error"
+  },
+  play: openToast("Error Toast")
+}`,...(F=(R=T.parameters)==null?void 0:R.docs)==null?void 0:F.source}}};var L,$,z;b.parameters={...b.parameters,docs:{...(L=b.parameters)==null?void 0:L.docs,source:{originalSource:`{
+  ...Single,
+  args: {
+    text: "Severe solar winds may delay local system flights",
+    role: "status",
+    severity: "warning"
+  },
+  play: openToast("Warning Toast")
+}`,...(z=($=b.parameters)==null?void 0:$.docs)==null?void 0:z.source}}};var q,J,W;h.parameters={...h.parameters,docs:{...(q=h.parameters)==null?void 0:q.docs,source:{originalSource:`{
+  ...Single,
+  args: {
+    text: "Docking completed",
+    role: "status",
+    severity: "success"
+  },
+  play: openToast("Success Toast")
+}`,...(W=(J=h.parameters)==null?void 0:J.docs)==null?void 0:W.source}}};var N,_,G;f.parameters={...f.parameters,docs:{...(N=f.parameters)==null?void 0:N.docs,source:{originalSource:`{
+  ...Single,
+  args: {
+    isDismissable: true,
+    linkText: "View report",
+    linkUrl: "#"
+  },
+  play: async ({
+    args,
+    canvasElement,
+    step
+  }) => {
+    const canvas = within(canvasElement);
+    await step(\`open Dismissible Toast}\`, async () => {
+      await waitFor(async () => {
+        const buttonElement = canvas.getByText(\`Open \${args.severity} toast\`);
+        await userEvent.hover(buttonElement);
+        await userEvent.click(buttonElement);
+        await userEvent.tab();
+      });
+    });
+    await step("link in toast", async () => {
+      await waitFor(() => {
+        const toastLink = canvas.getByText(args.linkText || "");
+        expect(toastLink).toHaveAttribute("href", args.linkUrl);
+      });
+    });
+    await step("dismiss toast and reopen", async () => {
+      await waitFor(async () => {
+        const toastElement = canvas.getByRole("status");
+        if (toastElement) {
+          const dismissToastButton = within(toastElement).getByRole("button", {
+            name: "Close"
+          });
+          if (dismissToastButton) {
+            await userEvent.click(dismissToastButton);
+            await waitFor(async () => {
+              expect(toastElement).not.toBeVisible();
+              const buttonElement = canvas.getByText(\`Open \${args.severity} toast\`);
+              await userEvent.click(buttonElement);
+            });
+          }
+        }
+      });
+      await waitFor(() => axeRun("Dismissible Toast"));
+    });
+  }
+}`,...(G=(_=f.parameters)==null?void 0:_.docs)==null?void 0:G.source}}};var K,Q,X;g.parameters={...g.parameters,docs:{...(K=g.parameters)==null?void 0:K.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: "\`Toast\` handles the visual appearance and show/hide logic, but not positioning. To have a Toast positioned correctly, it must be wrapped inside a \`ToastStack\`. There should only be one ToastStack per screen, regardless of how many Toasts there are, since a single ToastStack can accept multiple Toasts as children and will manage positioning accordingly."
+      }
+    }
+  },
+  render: function C() {
+    type ToastWithId = ToastProps & {
+      id: string;
+    };
+    const unstableToasts = [{
+      id: createUniqueId(),
+      severity: "info" as const,
+      text: "The mission to Sagittarius A is set for January 7.",
+      isDismissable: true,
+      isVisible: true
+    }, {
+      id: createUniqueId(),
+      severity: "success" as const,
+      text: "Docking completed.",
+      isDismissable: true,
+      isVisible: true
+    }];
+    const [toasts, setToasts] = useState<ToastWithId[]>(unstableToasts);
+    const addToast = useCallback(() => {
+      const toastOptions = [{
+        severity: "warning" as const,
+        text: "Severe solar winds may delay local system flights.",
+        isDismissable: true,
+        isVisible: true
+      }, {
+        severity: "error" as const,
+        text: "Security breach in Hangar 10.",
+        isDismissable: true,
+        isVisible: true
+      }];
+      const randomToast = toastOptions[Math.floor(Math.random() * toastOptions.length)];
+      setToasts(prevToasts => [...prevToasts, {
+        ...randomToast,
+        id: createUniqueId()
+      }]);
+    }, []);
+    const handleDismiss = useCallback((toastId: string) => {
+      setToasts(prevToasts => prevToasts.filter(toast => toast.id !== toastId));
+    }, []);
+    return <>
+        <Button label="Open another Toast" onClick={addToast} variant="primary" />
+        <ToastStack>
+          {toasts.map(toast => <Toast isDismissable={toast.isDismissable} isVisible={toast.isVisible} key={toast.id} onHide={() => handleDismiss(toast.id)} severity={toast.severity} text={toast.text} />)}
+        </ToastStack>
+      </>;
+  }
+}`,...(X=(Q=g.parameters)==null?void 0:Q.docs)==null?void 0:X.source}}};const ae=["Info","ErrorToast","Warning","Success","Dismissible","MultipleToasts"];export{f as Dismissible,T as ErrorToast,y as Info,g as MultipleToasts,h as Success,b as Warning,ae as __namedExportsOrder,se as default};

package/dist/assets/ToastManager.stories-CmZGqHye.js

@@ -0,0 +1,22 @@
+import{j as f}from"./jsx-runtime-CnH95YSl.js";import{r as m}from"./index-NdkWRN8K.js";import{I as R}from"./IgaComponentsLegacyOdysseyDecorator-28myx5I9.js";import{O as F}from"./OdysseyStorybookThemeDecorator-BRjYVaUu.js";import{j as w,a as d}from"./emotion-react-jsx-runtime.browser.esm-DcYOMKFp.js";import{S as k,aD as B,aE as D,aF as C,aG as z}from"./OdysseyThemeProvider-BBwjgzn2.js";import{S as G}from"./Snackbar-Cn_gMSEK.js";import{A as N,a as U}from"./AlertTitle-BbBpDTwd.js";import{B as W}from"./Button-CdPi1pZc.js";import{P as H}from"./Portal-GAJY6Au9.js";import{F as V}from"./Fade-CVbWKXvx.js";import{M as Z}from"./Button-DGmXZ3jw.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./tableSortLabelClasses-DtOYtU1J.js";import"./dialogActionsClasses-BWrWITLY.js";import"./index-BJTM6NaI.js";import"./OdysseyProvider-2xjMTEu6.js";import"./useIsFocusVisible-DH0qxT5e.js";import"./TransitionGroupContext-DLI0IzWy.js";import"./resolveComponentProps-BzfJewMt.js";import"./isHostComponent-DVu5iVWx.js";import"./utils-DkZjDCLm.js";import"./index-B5xazMy1.js";import"./index-DieBXP3Z.js";import"./Grow-DacPmog-.js";import"./ownerDocument-DW-IO8s5.js";import"./Paper-XsV8SWR9.js";import"./useSlot-CaOQD_17.js";import"./createSvgIcon-DsUj6UQo.js";import"./Close-ATS01D1v.js";import"./IconButton-OY9nJWpv.js";import"./ButtonBase-BAQsCgRq.js";import"./Typography-Yf1Zkad_.js";import"./BaseButton-COF38VLB.js";import"./MuiPropsContext-DhRylJZk.js";import"./Tooltip-XQJL1Byd.js";import"./Tooltip-D4AWrTBw.js";import"./useControlled-NQulfz4l.js";import"./Popper-DjhYeJJy.js";/*!
+ * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */const I=m.forwardRef((t,n)=>f.jsx(k,{viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",ref:n,...t,children:f.jsx(f.Fragment,{children:f.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M8 7.2929L2.35355 1.64645L1.64644 2.35355L7.29289 8L1.64645 13.6464L2.35355 14.3536L8 8.70711L13.6464 14.3536L14.3535 13.6464L8.7071 8L14.3536 2.35355L13.6464 1.64645L8 7.2929Z",fill:"currentColor"})})}));I.displayName="CloseIcon";function S(t,n){if(t.inserted[n.name]===void 0)return t.insert("",n,t.sheet,!0)}function E(t,n,r){var a=[],l=D(t,a,r);return a.length<2?r:l+n(a)}var q=function(n){var r=B(n);r.sheet.speedy=function(c){this.isSpeedy=c},r.compat=!0;var a=function(){for(var o=arguments.length,i=new Array(o),s=0;s<o;s++)i[s]=arguments[s];var u=C(i,r.registered,void 0);return z(r,u,!1),r.key+"-"+u.name},l=function(){for(var o=arguments.length,i=new Array(o),s=0;s<o;s++)i[s]=arguments[s];var u=C(i,r.registered),g="animation-"+u.name;return S(r,{name:u.name,styles:"@keyframes "+g+"{"+u.styles+"}"}),g},e=function(){for(var o=arguments.length,i=new Array(o),s=0;s<o;s++)i[s]=arguments[s];var u=C(i,r.registered);S(r,u)},p=function(){for(var o=arguments.length,i=new Array(o),s=0;s<o;s++)i[s]=arguments[s];return E(r.registered,a,J(i))};return{css:a,cx:p,injectGlobal:e,keyframes:l,hydrate:function(o){o.forEach(function(i){r.inserted[i]=!0})},flush:function(){r.registered={},r.inserted={},r.sheet.flush()},sheet:r.sheet,cache:r,getRegisteredStyles:D.bind(null,r.registered),merge:E.bind(null,r.registered,a)}},J=function t(n){for(var r="",a=0;a<n.length;a++){var l=n[a];if(l!=null){var e=void 0;switch(typeof l){case"boolean":break;case"object":{if(Array.isArray(l))e=t(l);else{e="";for(var p in l)l[p]&&p&&(e&&(e+=" "),e+=p)}break}default:e=l}e&&(r&&(r+=" "),r+=e)}}return r},K=q({key:"css"}),Q=K.css;const L=5e3,X=t=>{if(!t)return L;const n=window.localStorage.getItem("toast_duration");return(n?Number(n)*1e3:null)??L},P=m.createContext(void 0);function Y(){const t=m.useContext(P);if(t===void 0)throw new Error("useToast must be used within a ToastManager");return t}function $(t){return d(V,{...t})}function A({applyToastDurationPreference:t=!1,anchorOrigin:n,children:r}){const[a,l]=m.useState([]),[e,p]=m.useState(null),[c,o]=m.useState(!1),i=m.useMemo(()=>X(t),[t]),s=m.useCallback(h=>{l(x=>[...x,h])},[]),u=m.useCallback((h,x)=>{x!=="clickaway"&&o(!1)},[]),g=m.useCallback(()=>{p(null)},[]);m.useEffect(()=>{a.length&&!e?(p({...a[0]}),l(h=>h.slice(1)),o(!0)):a.length&&e&&c&&o(!1)},[a,e,c]);const O=m.useMemo(()=>({addToast:s}),[s]),b=(e==null?void 0:e.title)??(e==null?void 0:e.message),y=e!=null&&e.title?e==null?void 0:e.message:null;return w(P.Provider,{value:O,children:[r,d(H,{children:d(G,{anchorOrigin:n,autoHideDuration:i,disableWindowBlurListener:!0,onClose:u,open:c,TransitionComponent:$,TransitionProps:{onExited:g},children:w(N,{action:!(e!=null&&e.disableDismiss)&&d(W,{"aria-label":"Close",name:"close-toast",onClick:u,startIcon:d(I,{onPointerEnterCapture:()=>{},onPointerLeaveCapture:()=>{}}),variant:"floating"}),classes:{message:Q`
+                flex-basis: 0;
+                word-break: break-word;
+              `},severity:e==null?void 0:e.severity,variant:"toast",children:[b&&d(U,{children:b}),y&&y]})})})]})}const Ge={component:A,decorators:[F,R],args:{},argTypes:{}},_=()=>{const{addToast:t}=Y(),n=m.useCallback(()=>t({severity:"success",message:"This is a success toast"}),[t]);return f.jsx(Z,{label:"Add Toast",onClick:n,variant:"primary"})},v={name:"Example",render:t=>f.jsx(A,{children:t.children}),args:{children:f.jsx(_,{})}};var M,T,j;v.parameters={...v.parameters,docs:{...(M=v.parameters)==null?void 0:M.docs,source:{originalSource:`{
+  name: "Example",
+  render: args => {
+    return <ToastManager>{args.children}</ToastManager>;
+  },
+  args: {
+    children: <ChildComponent />
+  }
+}`,...(j=(T=v.parameters)==null?void 0:T.docs)==null?void 0:j.source}}};const Ne=["Example"];export{v as Example,Ne as __namedExportsOrder,Ge as default};

package/dist/assets/Tooltip-D4AWrTBw.js

@@ -0,0 +1 @@
+import{c as fe,_ as he,z as ge,A as be,b as r,e as F,d as q,f as Wo,g as Te,B as ve,C as u,p as jo}from"./OdysseyThemeProvider-BBwjgzn2.js";import{r as p}from"./index-NdkWRN8K.js";import{j as g}from"./jsx-runtime-CnH95YSl.js";import{G as Ao}from"./Grow-DacPmog-.js";import{u as Pe}from"./utils-DkZjDCLm.js";import{a as N,b as ye,u as we,T as xe}from"./useIsFocusVisible-DH0qxT5e.js";import{u as Re}from"./useControlled-NQulfz4l.js";import{u as Bo}from"./TransitionGroupContext-DLI0IzWy.js";import{g as Ce}from"./Portal-GAJY6Au9.js";import{a as k}from"./resolveComponentProps-BzfJewMt.js";import{P as zo}from"./Popper-DjhYeJJy.js";const Me=["arrow","children","classes","components","componentsProps","describeChild","disableFocusListener","disableHoverListener","disableInteractive","disableTouchListener","enterDelay","enterNextDelay","enterTouchDelay","followCursor","id","leaveDelay","leaveTouchDelay","onClose","onOpen","open","placement","PopperComponent","PopperProps","slotProps","slots","title","TransitionComponent","TransitionProps"];function Oe(t){return Math.round(t*1e5)/1e5}const _e=t=>{const{classes:e,disableInteractive:s,arrow:a,touch:x,placement:R}=t,C={popper:["popper",!s&&"popperInteractive",a&&"popperArrow"],tooltip:["tooltip",a&&"tooltipArrow",x&&"touch",`tooltipPlacement${Wo(R.split("-")[0])}`],arrow:["arrow"]};return Te(C,ve,e)},$e=q(zo,{name:"MuiTooltip",slot:"Popper",overridesResolver:(t,e)=>{const{ownerState:s}=t;return[e.popper,!s.disableInteractive&&e.popperInteractive,s.arrow&&e.popperArrow,!s.open&&e.popperClose]}})(({theme:t,ownerState:e,open:s})=>r({zIndex:(t.vars||t).zIndex.tooltip,pointerEvents:"none"},!e.disableInteractive&&{pointerEvents:"auto"},!s&&{pointerEvents:"none"},e.arrow&&{[`&[data-popper-placement*="bottom"] .${u.arrow}`]:{top:0,marginTop:"-0.71em","&::before":{transformOrigin:"0 100%"}},[`&[data-popper-placement*="top"] .${u.arrow}`]:{bottom:0,marginBottom:"-0.71em","&::before":{transformOrigin:"100% 0"}},[`&[data-popper-placement*="right"] .${u.arrow}`]:r({},e.isRtl?{right:0,marginRight:"-0.71em"}:{left:0,marginLeft:"-0.71em"},{height:"1em",width:"0.71em","&::before":{transformOrigin:"100% 100%"}}),[`&[data-popper-placement*="left"] .${u.arrow}`]:r({},e.isRtl?{left:0,marginLeft:"-0.71em"}:{right:0,marginRight:"-0.71em"},{height:"1em",width:"0.71em","&::before":{transformOrigin:"0 0"}})})),Ee=q("div",{name:"MuiTooltip",slot:"Tooltip",overridesResolver:(t,e)=>{const{ownerState:s}=t;return[e.tooltip,s.touch&&e.touch,s.arrow&&e.tooltipArrow,e[`tooltipPlacement${Wo(s.placement.split("-")[0])}`]]}})(({theme:t,ownerState:e})=>r({backgroundColor:t.vars?t.vars.palette.Tooltip.bg:jo.alpha(t.palette.grey[700],.92),borderRadius:(t.vars||t).shape.borderRadius,color:(t.vars||t).palette.common.white,fontFamily:t.typography.fontFamily,padding:"4px 8px",fontSize:t.typography.pxToRem(11),maxWidth:300,margin:2,wordWrap:"break-word",fontWeight:t.typography.fontWeightMedium},e.arrow&&{position:"relative",margin:0},e.touch&&{padding:"8px 16px",fontSize:t.typography.pxToRem(14),lineHeight:`${Oe(16/14)}em`,fontWeight:t.typography.fontWeightRegular},{[`.${u.popper}[data-popper-placement*="left"] &`]:r({transformOrigin:"right center"},e.isRtl?r({marginLeft:"14px"},e.touch&&{marginLeft:"24px"}):r({marginRight:"14px"},e.touch&&{marginRight:"24px"})),[`.${u.popper}[data-popper-placement*="right"] &`]:r({transformOrigin:"left center"},e.isRtl?r({marginRight:"14px"},e.touch&&{marginRight:"24px"}):r({marginLeft:"14px"},e.touch&&{marginLeft:"24px"})),[`.${u.popper}[data-popper-placement*="top"] &`]:r({transformOrigin:"center bottom",marginBottom:"14px"},e.touch&&{marginBottom:"24px"}),[`.${u.popper}[data-popper-placement*="bottom"] &`]:r({transformOrigin:"center top",marginTop:"14px"},e.touch&&{marginTop:"24px"})})),Le=q("span",{name:"MuiTooltip",slot:"Arrow",overridesResolver:(t,e)=>e.arrow})(({theme:t})=>({overflow:"hidden",position:"absolute",width:"1em",height:"0.71em",boxSizing:"border-box",color:t.vars?t.vars.palette.Tooltip.bg:jo.alpha(t.palette.grey[700],.9),"&::before":{content:'""',margin:"auto",display:"block",width:"100%",height:"100%",backgroundColor:"currentColor",transform:"rotate(45deg)"}}));let D=!1;const So=new xe;let w={x:0,y:0};function A(t,e){return(s,...a)=>{e&&e(s,...a),t(s,...a)}}const Ue=p.forwardRef(function(e,s){var a,x,R,C,J,Q,Z,oo,eo,to,ro,so,no,po,io,lo,ao,co,uo;const B=fe({props:e,name:"MuiTooltip"}),{arrow:mo=!1,children:S,components:M={},componentsProps:d={},describeChild:Uo=!1,disableFocusListener:Vo=!1,disableHoverListener:fo=!1,disableInteractive:Ho=!1,disableTouchListener:Go=!1,enterDelay:ho=100,enterNextDelay:go=0,enterTouchDelay:Ko=700,followCursor:W=!1,id:Xo,leaveDelay:bo=0,leaveTouchDelay:Yo=1500,onClose:To,onOpen:vo,open:qo,placement:Po="bottom",PopperComponent:j,PopperProps:m={},slotProps:f={},slots:O={},title:h,TransitionComponent:Jo=Ao,TransitionProps:Qo}=B,yo=he(B,Me),c=p.isValidElement(S)?S:g.jsx("span",{children:S}),wo=Pe(),Zo=ge(),[b,xo]=p.useState(),[z,oe]=p.useState(null),_=p.useRef(!1),U=Ho||W,Ro=N(),V=N(),$=N(),Co=N(),[ee,Mo]=Re({controlled:qo,default:!1,name:"Tooltip",state:"open"});let l=ee;const H=be(Xo),T=p.useRef(),E=Bo(()=>{T.current!==void 0&&(document.body.style.WebkitUserSelect=T.current,T.current=void 0),Co.clear()});p.useEffect(()=>E,[E]);const Oo=o=>{So.clear(),D=!0,Mo(!0),vo&&!l&&vo(o)},L=Bo(o=>{So.start(800+bo,()=>{D=!1}),Mo(!1),To&&l&&To(o),Ro.start(wo.transitions.duration.shortest,()=>{_.current=!1})}),I=o=>{_.current&&o.type!=="touchstart"||(b&&b.removeAttribute("title"),V.clear(),$.clear(),ho||D&&go?V.start(D?go:ho,()=>{Oo(o)}):Oo(o))},G=o=>{V.clear(),$.start(bo,()=>{L(o)})},{isFocusVisibleRef:_o,onBlur:te,onFocus:re,ref:se}=ye(),[,$o]=p.useState(!1),Eo=o=>{te(o),_o.current===!1&&($o(!1),G(o))},Lo=o=>{b||xo(o.currentTarget),re(o),_o.current===!0&&($o(!0),I(o))},Io=o=>{_.current=!0;const n=c.props;n.onTouchStart&&n.onTouchStart(o)},ne=o=>{Io(o),$.clear(),Ro.clear(),E(),T.current=document.body.style.WebkitUserSelect,document.body.style.WebkitUserSelect="none",Co.start(Ko,()=>{document.body.style.WebkitUserSelect=T.current,I(o)})},pe=o=>{c.props.onTouchEnd&&c.props.onTouchEnd(o),E(),$.start(Yo,()=>{L(o)})};p.useEffect(()=>{if(!l)return;function o(n){(n.key==="Escape"||n.key==="Esc")&&L(n)}return document.addEventListener("keydown",o),()=>{document.removeEventListener("keydown",o)}},[L,l]);const ie=we(Ce(c),se,xo,s);!h&&h!==0&&(l=!1);const K=p.useRef(),le=o=>{const n=c.props;n.onMouseMove&&n.onMouseMove(o),w={x:o.clientX,y:o.clientY},K.current&&K.current.update()},v={},X=typeof h=="string";Uo?(v.title=!l&&X&&!fo?h:null,v["aria-describedby"]=l?H:null):(v["aria-label"]=X?h:null,v["aria-labelledby"]=l&&!X?H:null);const i=r({},v,yo,c.props,{className:F(yo.className,c.props.className),onTouchStart:Io,ref:ie},W?{onMouseMove:le}:{}),P={};Go||(i.onTouchStart=ne,i.onTouchEnd=pe),fo||(i.onMouseOver=A(I,i.onMouseOver),i.onMouseLeave=A(G,i.onMouseLeave),U||(P.onMouseOver=I,P.onMouseLeave=G)),Vo||(i.onFocus=A(Lo,i.onFocus),i.onBlur=A(Eo,i.onBlur),U||(P.onFocus=Lo,P.onBlur=Eo));const ae=p.useMemo(()=>{var o;let n=[{name:"arrow",enabled:!!z,options:{element:z,padding:4}}];return(o=m.popperOptions)!=null&&o.modifiers&&(n=n.concat(m.popperOptions.modifiers)),r({},m.popperOptions,{modifiers:n})},[z,m]),y=r({},B,{isRtl:Zo,arrow:mo,disableInteractive:U,placement:Po,PopperComponentProp:j,touch:_.current}),Y=_e(y),Fo=(a=(x=O.popper)!=null?x:M.Popper)!=null?a:$e,No=(R=(C=(J=O.transition)!=null?J:M.Transition)!=null?C:Jo)!=null?R:Ao,ko=(Q=(Z=O.tooltip)!=null?Z:M.Tooltip)!=null?Q:Ee,Do=(oo=(eo=O.arrow)!=null?eo:M.Arrow)!=null?oo:Le,ce=k(Fo,r({},m,(to=f.popper)!=null?to:d.popper,{className:F(Y.popper,m==null?void 0:m.className,(ro=(so=f.popper)!=null?so:d.popper)==null?void 0:ro.className)}),y),ue=k(No,r({},Qo,(no=f.transition)!=null?no:d.transition),y),de=k(ko,r({},(po=f.tooltip)!=null?po:d.tooltip,{className:F(Y.tooltip,(io=(lo=f.tooltip)!=null?lo:d.tooltip)==null?void 0:io.className)}),y),me=k(Do,r({},(ao=f.arrow)!=null?ao:d.arrow,{className:F(Y.arrow,(co=(uo=f.arrow)!=null?uo:d.arrow)==null?void 0:co.className)}),y);return g.jsxs(p.Fragment,{children:[p.cloneElement(c,i),g.jsx(Fo,r({as:j??zo,placement:Po,anchorEl:W?{getBoundingClientRect:()=>({top:w.y,left:w.x,right:w.x,bottom:w.y,width:0,height:0})}:b,popperRef:K,open:b?l:!1,id:H,transition:!0},P,ce,{popperOptions:ae,children:({TransitionProps:o})=>g.jsx(No,r({timeout:wo.transitions.duration.shorter},o,ue,{children:g.jsxs(ko,r({},de,{children:[h,mo?g.jsx(Do,r({},me,{ref:oe})):null]}))}))}))]})});export{Ue as T};

package/dist/assets/{Tooltip-3088PjcT.js → Tooltip-XQJL1Byd.js}

@@ -1,4 +1,4 @@
-import{r as i}from"./index-NdkWRN8K.js";import{M as m}from"./MuiPropsContext-DhRylJZk.js";import{j as s}from"./jsx-runtime-CnH95YSl.js";import{T as d}from"./Tooltip-B4GIR2eB.js";/*!
+import{r as i}from"./index-NdkWRN8K.js";import{M as m}from"./MuiPropsContext-DhRylJZk.js";import{j as s}from"./jsx-runtime-CnH95YSl.js";import{T as d}from"./Tooltip-D4AWrTBw.js";/*!
  * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.
  * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
  *

package/dist/assets/Tooltip.stories-s36iDmFy.js

@@ -0,0 +1,68 @@
+import{j as t}from"./jsx-runtime-CnH95YSl.js";import{w as m,u}from"./index-BJMTVygn.js";import{a as d}from"./axeRun-B-LchFqf.js";import{O as R}from"./OdysseyStorybookThemeDecorator-BRjYVaUu.js";import{M as o}from"./Tooltip-XQJL1Byd.js";import{M}from"./Download-CnpAgqy2.js";import{M as E}from"./Button-DGmXZ3jw.js";import{M as L}from"./Status-BpzpxYZ-.js";import{M as r}from"./Tag-BgjQI7VM.js";import"./index-NdkWRN8K.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./axe-4JP0vCEZ.js";import"./OdysseyThemeProvider-BBwjgzn2.js";import"./index-BJTM6NaI.js";import"./OdysseyProvider-2xjMTEu6.js";import"./MuiPropsContext-DhRylJZk.js";import"./Tooltip-D4AWrTBw.js";import"./Grow-DacPmog-.js";import"./utils-DkZjDCLm.js";import"./TransitionGroupContext-DLI0IzWy.js";import"./index-B5xazMy1.js";import"./index-DieBXP3Z.js";import"./useIsFocusVisible-DH0qxT5e.js";import"./Portal-GAJY6Au9.js";import"./resolveComponentProps-BzfJewMt.js";import"./isHostComponent-DVu5iVWx.js";import"./useControlled-NQulfz4l.js";import"./Popper-DjhYeJJy.js";import"./ownerDocument-DW-IO8s5.js";import"./BaseButton-COF38VLB.js";import"./Button-CdPi1pZc.js";import"./ButtonBase-BAQsCgRq.js";import"./Chip-DXaMeATb.js";import"./createSvgIcon-DsUj6UQo.js";const dt={component:o,decorators:[R],tags:["autodocs"],argTypes:{children:{control:"object",description:"The content that will trigger the tooltip",table:{type:{summary:"ReactElement"}},type:{required:!0,name:"other",value:"ReactElement"}},ariaType:{options:["description","label"],control:{type:"radio"},description:"The type of ARIA attribute to use",table:{type:{summary:"description | label"}},type:{required:!0,name:"other",value:"radio"}},text:{control:"text",description:"The text to display in the tooltip",table:{type:{summary:"string"}},type:{required:!0,name:"string"}},placement:{options:["top","right","bottom","left"],control:{type:"radio"},description:"The placement of the tooltip",table:{type:{summary:"top | right | bottom | left"},defaultValue:{summary:"top"}}}},args:{ariaType:"label"}},y={args:{},render:function(e){return t.jsx(o,{ariaType:e.ariaType,placement:e.placement,text:e.text,children:e.children})}},z=a=>({canvasElement:e,step:c})=>c("show the tooltip on hover",async()=>{const I=m(e).getByText("Launch");await u.hover(I),await d(a)}),i={...y,args:{children:t.jsx(E,{label:"Launch",variant:"primary"}),ariaType:"description",placement:"top",text:"This will begin a 10-second countdown"},play:z("Tooltip Default")},l={...y,args:{children:t.jsx(E,{ariaLabel:"Download logs",startIcon:t.jsx(M,{}),variant:"secondary"}),ariaType:"label",placement:"top",text:"Download logs"},play:async({canvasElement:a,step:e})=>{await e("tooltip text",async()=>{const n=m(a).getByRole("button");await u.hover(n),await d("Tooltip Icon Button")})}},s={...y,args:{children:t.jsx(L,{label:"Warp drive online",severity:"success"}),ariaType:"label",placement:"top",text:"The warp drive is currently online."},play:async({canvasElement:a,step:e})=>{await e("tooltip text",async()=>{const n=m(a).getByLabelText("The warp drive is currently online.");await u.hover(n),await d("Tooltip Icon Button")})}},p={args:{},render:()=>t.jsxs(t.Fragment,{children:[t.jsx(o,{ariaType:"label",placement:"top",text:"Top",children:t.jsx(r,{label:"Bow"})}),t.jsx(o,{ariaType:"label",placement:"left",text:"Left",children:t.jsx(r,{label:"Stern"})}),t.jsx(o,{ariaType:"label",placement:"bottom",text:"Bottom",children:t.jsx(r,{label:"Port"})}),t.jsx(o,{ariaType:"label",placement:"right",text:"Right",children:t.jsx(r,{label:"Starboard"})})]})};var T,b,h;i.parameters={...i.parameters,docs:{...(T=i.parameters)==null?void 0:T.docs,source:{originalSource:`{
+  ...Template,
+  args: {
+    children: <Button label="Launch" variant="primary" />,
+    ariaType: "description",
+    placement: "top",
+    text: "This will begin a 10-second countdown"
+  },
+  play: showTooltip("Tooltip Default")
+}`,...(h=(b=i.parameters)==null?void 0:b.docs)==null?void 0:h.source}}};var x,g,w;l.parameters={...l.parameters,docs:{...(x=l.parameters)==null?void 0:x.docs,source:{originalSource:`{
+  ...Template,
+  args: {
+    children: <Button ariaLabel="Download logs" startIcon={<DownloadIcon />} variant="secondary" />,
+    ariaType: "label",
+    placement: "top",
+    text: "Download logs"
+  },
+  play: async ({
+    canvasElement,
+    step
+  }) => {
+    await step("tooltip text", async () => {
+      const canvas = within(canvasElement);
+      const button = canvas.getByRole("button");
+      await userEvent.hover(button);
+      await axeRun("Tooltip Icon Button");
+    });
+  }
+}`,...(w=(g=l.parameters)==null?void 0:g.docs)==null?void 0:w.source}}};var v,f,B;s.parameters={...s.parameters,docs:{...(v=s.parameters)==null?void 0:v.docs,source:{originalSource:`{
+  ...Template,
+  args: {
+    children: <Status label="Warp drive online" severity="success" />,
+    ariaType: "label",
+    placement: "top",
+    text: "The warp drive is currently online."
+  },
+  play: async ({
+    canvasElement,
+    step
+  }) => {
+    await step("tooltip text", async () => {
+      const canvas = within(canvasElement);
+      const button = canvas.getByLabelText("The warp drive is currently online.");
+      await userEvent.hover(button);
+      await axeRun("Tooltip Icon Button");
+    });
+  }
+}`,...(B=(f=s.parameters)==null?void 0:f.docs)==null?void 0:B.source}}};var j,S,D;p.parameters={...p.parameters,docs:{...(j=p.parameters)==null?void 0:j.docs,source:{originalSource:`{
+  args: {} as TooltipProps,
+  // This is a hack.
+  render: () => <>
+      <Tooltip ariaType="label" placement="top" text="Top">
+        <Tag label="Bow" />
+      </Tooltip>
+
+      <Tooltip ariaType="label" placement="left" text="Left">
+        <Tag label="Stern" />
+      </Tooltip>
+
+      <Tooltip ariaType="label" placement="bottom" text="Bottom">
+        <Tag label="Port" />
+      </Tooltip>
+
+      <Tooltip ariaType="label" placement="right" text="Right">
+        <Tag label="Starboard" />
+      </Tooltip>
+    </>
+}`,...(D=(S=p.parameters)==null?void 0:S.docs)==null?void 0:D.source}}};const yt=["Default","IconButton","StatusWrapper","Placement"];export{i as Default,l as IconButton,p as Placement,s as StatusWrapper,yt as __namedExportsOrder,dt as default};

package/dist/assets/{TopNav-CWVyy01x.js → TopNav-dZWiR_bv.js}

@@ -1,4 +1,4 @@
-import{n as a}from"./createTheme-BmPXDA4p.js";import{r as d}from"./index-NdkWRN8K.js";import{u as p}from"./OdysseyDesignTokensContext-BWQIA5ie.js";import{u as l}from"./UiShellProvider-D1w1Ocw9.js";import{U as m,T as n}from"./uiShellSharedConstants-DD9UP82e.js";import{j as i}from"./jsx-runtime-CnH95YSl.js";/*!
+import{u as d,s as a}from"./OdysseyThemeProvider-BBwjgzn2.js";import{r as l}from"./index-NdkWRN8K.js";import{u as p}from"./UiShellProvider-BOM87LOZ.js";import{U as s,T as n}from"./uiShellSharedConstants-DD9UP82e.js";import{j as i}from"./jsx-runtime-CnH95YSl.js";/*!
  * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
  * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
  *
@@ -8,4 +8,4 @@ import{n as a}from"./createTheme-BmPXDA4p.js";import{r as d}from"./index-NdkWRN8
  * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  *
  * See the License for the specific language governing permissions and limitations under the License.
- */const s=a("div")(()=>({flexGrow:1})),c=a("div")(()=>({flexShrink:0})),u=a("div",{shouldForwardProp:t=>t!=="odysseyDesignTokens"&&t!=="topNavBackgroundColor"})(({odysseyDesignTokens:t,topNavBackgroundColor:o})=>({alignItems:"center",backgroundColor:o,display:"flex",gap:t.Spacing4,height:"100%",justifyContent:"space-between",maxHeight:n,minHeight:n,paddingBlock:t.Spacing2,paddingInline:t.Spacing8,position:"relative",transition:`box-shadow ${t.TransitionDurationMain} ${t.TransitionTimingMain}`,zIndex:m,...o===t.HueNeutralWhite&&{borderBottom:`${t.BorderWidthMain} ${t.BorderStyleMain} ${t.HueNeutral100}`}})),x=({leftSideComponent:t,rightSideComponent:o})=>{const e=p(),r=l();return i.jsxs(u,{odysseyDesignTokens:e,topNavBackgroundColor:r==null?void 0:r.topNavBackgroundColor,children:[i.jsx(s,{children:t??i.jsx("div",{})}),i.jsx(c,{children:o??i.jsx("div",{})})]})},h=d.memo(x);h.displayName="TopNav";export{h as M};
+ */const c=a("div")(()=>({flexGrow:1})),m=a("div")(()=>({flexShrink:0})),u=a("div",{shouldForwardProp:t=>t!=="odysseyDesignTokens"&&t!=="topNavBackgroundColor"})(({odysseyDesignTokens:t,topNavBackgroundColor:o})=>({alignItems:"center",backgroundColor:o,display:"flex",gap:t.Spacing4,height:"100%",justifyContent:"space-between",maxHeight:n,minHeight:n,paddingBlock:t.Spacing2,paddingInline:t.Spacing8,position:"relative",transition:`box-shadow ${t.TransitionDurationMain} ${t.TransitionTimingMain}`,zIndex:s,...o===t.HueNeutralWhite&&{borderBottom:`${t.BorderWidthMain} ${t.BorderStyleMain} ${t.HueNeutral100}`}})),x=({leftSideComponent:t,rightSideComponent:o})=>{const e=d(),r=p();return i.jsxs(u,{odysseyDesignTokens:e,topNavBackgroundColor:r==null?void 0:r.topNavBackgroundColor,children:[i.jsx(c,{children:t??i.jsx("div",{})}),i.jsx(m,{children:o??i.jsx("div",{})})]})},h=l.memo(x);h.displayName="TopNav";export{h as M};

package/dist/assets/TopNav.stories-Dg27-0zA.js

@@ -0,0 +1,13 @@
+import{j as o}from"./jsx-runtime-CnH95YSl.js";import{a6 as m}from"./OdysseyThemeProvider-BBwjgzn2.js";import{O as p}from"./OdysseyStorybookThemeDecorator-BRjYVaUu.js";import{M as a}from"./UserProfile-DqokqHU1.js";import{M as s}from"./TopNav-dZWiR_bv.js";import{M as n}from"./Button-DGmXZ3jw.js";import{M as l}from"./User-D6db-Gy0.js";import{M as d}from"./SearchField-CYM6nbh5.js";import"./index-NdkWRN8K.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./index-BJTM6NaI.js";import"./OdysseyProvider-2xjMTEu6.js";import"./Box-BGpAHVQV.js";import"./Box-CWTB5xfE.js";import"./Typography-DfSdXC7o.js";import"./Typography-Yf1Zkad_.js";import"./UiShellProvider-BOM87LOZ.js";import"./uiShellSharedConstants-DD9UP82e.js";import"./BaseButton-COF38VLB.js";import"./MuiPropsContext-DhRylJZk.js";import"./Tooltip-XQJL1Byd.js";import"./Tooltip-D4AWrTBw.js";import"./Grow-DacPmog-.js";import"./utils-DkZjDCLm.js";import"./TransitionGroupContext-DLI0IzWy.js";import"./index-B5xazMy1.js";import"./index-DieBXP3Z.js";import"./useIsFocusVisible-DH0qxT5e.js";import"./Portal-GAJY6Au9.js";import"./resolveComponentProps-BzfJewMt.js";import"./isHostComponent-DVu5iVWx.js";import"./useControlled-NQulfz4l.js";import"./Popper-DjhYeJJy.js";import"./ownerDocument-DW-IO8s5.js";import"./Button-CdPi1pZc.js";import"./ButtonBase-BAQsCgRq.js";import"./Field-lyECanzU.js";import"./List-Be7fhh4_.js";import"./ListItem-C8ebNPnP.js";import"./utils-iop7lDec.js";import"./useFormControl-BMISTZuX.js";import"./FormLabel-BLj3hKkg.js";import"./ScreenReaderText-CM78bF1y.js";import"./visuallyHidden-Dan1xhjv.js";import"./FormHelperText-qF3DX-zz.js";import"./FieldHint-C3tXb7u4.js";import"./useUniqueId-Bsgqe1tm.js";import"./createUniqueId-ByTaVY63.js";import"./inputUtils-Dbi8XkA6.js";import"./InputBase-DSZ9ZgyW.js";import"./ownerWindow-HkKU3E4x.js";import"./debounce-Be36O1Ab.js";import"./InputAdornment-D4SsBOPe.js";import"./Search-CkfJXFe5.js";import"./IconButton-OY9nJWpv.js";const uo={component:s,decorators:[p],parameters:{layout:"fullscreen"},tags:["autodocs"],argTypes:{leftSideComponent:{control:void 0,description:"Display global search field",table:{type:{summary:"ReactElement"}}},rightSideComponent:{description:"Additional element to be displayed at the end of the top nav",table:{type:{summary:"ReactElement"}}}}},r={args:{leftSideComponent:o.jsx(d,{label:"Search",placeholder:"Search..."}),rightSideComponent:o.jsxs("div",{style:{display:"flex",gap:m},children:[o.jsx(n,{label:"Connect Builder",variant:"secondary"}),o.jsx(a,{orgName:"ORG123",profileIcon:o.jsx(l,{}),userName:"test.user@test.com"})]})}};var e,t,i;r.parameters={...r.parameters,docs:{...(e=r.parameters)==null?void 0:e.docs,source:{originalSource:`{
+  args: {
+    leftSideComponent: <SearchField label="Search" placeholder="Search..." />,
+    rightSideComponent: <div style={{
+      display: "flex",
+      gap: odysseyDesignTokens.Spacing5
+    }}>
+        <Button label="Connect Builder" variant="secondary" />
+
+        <UserProfile orgName="ORG123" profileIcon={<UserIcon />} userName="test.user@test.com" />
+      </div>
+  }
+}`,...(i=(t=r.parameters)==null?void 0:t.docs)==null?void 0:i.source}}};const yo=["Default"];export{r as Default,yo as __namedExportsOrder,uo as default};

package/dist/assets/TransitionGroupContext-DLI0IzWy.js

@@ -0,0 +1 @@
+import{r as n,e as s}from"./index-NdkWRN8K.js";import{a as u}from"./OdysseyThemeProvider-BBwjgzn2.js";function f(t){const e=n.useRef(t);return u(()=>{e.current=t}),n.useRef((...r)=>(0,e.current)(...r)).current}function o(t,e){return o=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(r,c){return r.__proto__=c,r},o(t,e)}function i(t,e){t.prototype=Object.create(e.prototype),t.prototype.constructor=t,o(t,e)}const _=s.createContext(null);export{_ as T,i as _,f as u};

package/dist/assets/Typography-CORddEdk.js

@@ -0,0 +1,9 @@
+import{j as o}from"./jsx-runtime-CnH95YSl.js";import{useMDXComponents as n}from"./index-BeeV6X6A.js";import"./index-BsDcV5Kh.js";import{M as s,T as p,S as m,D as a,P as c,a as d,b as x}from"./index-BqmbiZ7T.js";import{T as e}from"./Typography.stories-D-TscJaP.js";import"./index-NdkWRN8K.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./preview-BprB3Yzd.js";import"./iframe-CXLAql3E.js";import"./DocsRenderer-CFRXHY34-IKzmQUB4.js";import"./client-ByW5HbEz.js";import"./index-DieBXP3Z.js";import"./index-BJTM6NaI.js";import"./index-B5xazMy1.js";import"./index-CXQShRbs.js";import"./index-DrFu-skq.js";import"./axeRun-B-LchFqf.js";import"./axe-4JP0vCEZ.js";import"./OdysseyStorybookThemeDecorator-BRjYVaUu.js";import"./OdysseyThemeProvider-BBwjgzn2.js";import"./OdysseyProvider-2xjMTEu6.js";import"./Typography-DfSdXC7o.js";import"./Typography-Yf1Zkad_.js";function i(r){const t={code:"code",p:"p",...n(),...r.components};return o.jsxs(o.Fragment,{children:[o.jsx(s,{of:e}),`
+`,o.jsx(p,{of:e}),`
+`,o.jsx(m,{of:e}),`
+`,o.jsx(a,{of:e}),`
+`,o.jsx(c,{of:e}),`
+`,o.jsxs(t.p,{children:["Typography can be rendered with the ",o.jsx(t.code,{children:"<Typography>"}),` component itself, or via one of its
+semantic aliases (`,o.jsx(t.code,{children:"<Heading1>"}),", ",o.jsx(t.code,{children:"<Heading2>"}),", ",o.jsx(t.code,{children:"<Paragraph>"}),", ",o.jsx(t.code,{children:"<Caption>"}),", etc.)"]}),`
+`,o.jsx(d,{}),`
+`,o.jsx(x,{})]})}function k(r={}){const{wrapper:t}={...n(),...r.components};return t?o.jsx(t,{...r,children:o.jsx(i,{...r})}):i(r)}export{k as default};