import{j as e}from"./jsx-runtime-CnH95YSl.js";import{w as x,e as b}from"./index-BJMTVygn.js";import{O as y}from"./OdysseyStorybookThemeDecorator-BuDiOG2V.js";import{M as g}from"./Box-1mvP3NLW.js";import{M as n}from"./TextField-BhK0y2Zt.js";const T={component:g,decorators:[y],argTypes:{children:{description:"The content of the component, whether text or other components.",table:{type:{summary:"ReactNode"}}},component:{description:"The HTML element the component should render, if different from the default.",table:{type:{summary:"ElementType"}}},id:{control:"text",description:"An optional id for the HTML elemenet rendered by the component.",table:{type:{summary:"string"}}},sx:{control:"object",description:"The system prop that allows defining system overrides as well as additional CSS styles. See the [MUI `sx` page](https://mui.com/system/getting-started/the-sx-prop/) for more details.",table:{type:{summary:"object"}}}},args:{children:"This is the tab content. This tab happens to be about stars."}},t={args:{children:"This is the content of the box.",sx:{borderColor:"lightGray",borderStyle:"dashed",borderWidth:2,p:3},id:"container-id"},play:async({canvasElement:c,step:p})=>{await p("Box Id",({args:m})=>{const h=x(c).getByText("This is the content of the box.");b(h).toHaveAttribute("id",m.id)})}},o={args:{children:e.jsxs(e.Fragment,{children:[e.jsx(n,{label:"Field One"}),e.jsx(n,{label:"Field Two"}),e.jsx(n,{label:"Field Three"})]}),sx:{display:"flex",alignItems:"start",gap:3,p:3}}};var r,s,a;t.parameters={...t.parameters,docs:{...(r=t.parameters)==null?void 0:r.docs,source:{originalSource:`{
  args: {
    children: "This is the content of the box.",
    sx: {
      borderColor: "lightGray",
      borderStyle: "dashed",
      borderWidth: 2,
      p: 3
    },
    id: "container-id"
  },
  play: async ({
    canvasElement,
    step
  }) => {
    await step("Box Id", ({
      args
    }) => {
      const canvas = within(canvasElement);
      const box = canvas.getByText("This is the content of the box.");
      expect(box).toHaveAttribute("id", args.id);
    });
  }
}`,...(a=(s=t.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};var i,d,l;o.parameters={...o.parameters,docs:{...(i=o.parameters)==null?void 0:i.docs,source:{originalSource:`{
  args: {
    children: <>
        <TextField label="Field One" />
        <TextField label="Field Two" />
        <TextField label="Field Three" />
      </>,
    sx: {
      display: "flex",
      alignItems: "start",
      gap: 3,
      p: 3
    }
  }
}`,...(l=(d=o.parameters)==null?void 0:d.docs)==null?void 0:l.source}}};const f=["Simple","Layout"],M=Object.freeze(Object.defineProperty({__proto__:null,Layout:o,Simple:t,__namedExportsOrder:f,default:T},Symbol.toStringTag,{value:"Module"}));export{M as B};
