import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{n as i,t as a}from"./LayoutFlex-BKX2c6Gj.js";import{n as o,t as s}from"./LayoutFlexItem-DBfq9Hv8.js";import{n as c,r as l,t as u}from"./storybook-utils-CaC0I5St.js";var d,f,p,m,h;t((()=>{e(n(),1),o(),i(),u(),d=r(),f={title:`components/LayoutFlex`,component:a,subcomponents:{LayoutFlexItem:s},argTypes:{gap:{description:l},padding:{description:c},direction:{description:l},justifyContent:{description:l},alignItems:{description:l},hide:{description:l},relative:{description:l}}},p=()=>(0,d.jsxs)(a,{gap:`16`,children:[(0,d.jsx)(`div`,{style:{minWidth:`100px`,backgroundColor:`hotpink`},children:` `}),(0,d.jsx)(`div`,{style:{minWidth:`100px`,backgroundColor:`hotpink`},children:` `}),(0,d.jsx)(s,{stretch:!0,children:(0,d.jsx)(`div`,{style:{minWidth:`100px`,backgroundColor:`hotpink`,textAlign:`center`},children:`stretch`})})]}),p.storyName=`LayoutFlex`,m={parameters:{chromatic:{disableSnapshot:!0}},args:{gap:`16`,children:(0,d.jsxs)(d.Fragment,{children:[(0,d.jsx)(`div`,{style:{minWidth:`100px`,height:50,backgroundColor:`hotpink`},children:` `}),(0,d.jsx)(`div`,{style:{minWidth:`100px`,height:75,backgroundColor:`hotpink`},children:` `}),(0,d.jsx)(s,{stretch:!0,children:(0,d.jsx)(`div`,{style:{minWidth:`100px`,height:100,backgroundColor:`hotpink`,textAlign:`center`}})})]}),dataset:{qaid:`layout-flex`}},argTypes:{dataset:{control:`object`},nowrap:{control:`boolean`},hide:{control:`boolean`},relative:{control:`boolean`},inline:{control:`boolean`},direction:{control:`select`},children:{control:!1},column:{table:{disable:!0}},reverse:{table:{disable:!0}}}},p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`() => <LayoutFlex gap="16">
        <div style={{
    minWidth: '100px',
    backgroundColor: 'hotpink'
  }}> </div>
        <div style={{
    minWidth: '100px',
    backgroundColor: 'hotpink'
  }}> </div>
        <LayoutFlexItem stretch>
            <div style={{
      minWidth: '100px',
      backgroundColor: 'hotpink',
      textAlign: 'center'
    }}>
                stretch
            </div>
        </LayoutFlexItem>
    </LayoutFlex>`,...p.parameters?.docs?.source}}},m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
  parameters: {
    chromatic: {
      disableSnapshot: true
    }
  },
  args: {
    gap: '16',
    children: <>
                <div style={{
        minWidth: '100px',
        height: 50,
        backgroundColor: 'hotpink'
      }}> </div>
                <div style={{
        minWidth: '100px',
        height: 75,
        backgroundColor: 'hotpink'
      }}> </div>
                <LayoutFlexItem stretch>
                    <div style={{
          minWidth: '100px',
          height: 100,
          backgroundColor: 'hotpink',
          textAlign: 'center'
        }}></div>
                </LayoutFlexItem>
            </>,
    dataset: {
      qaid: 'layout-flex'
    }
  },
  argTypes: {
    dataset: {
      control: 'object'
    },
    nowrap: {
      control: 'boolean'
    },
    hide: {
      control: 'boolean'
    },
    relative: {
      control: 'boolean'
    },
    inline: {
      control: 'boolean'
    },
    direction: {
      control: 'select'
    },
    children: {
      control: false
    },
    // Disable deprecated props
    column: {
      table: {
        disable: true
      }
    },
    reverse: {
      table: {
        disable: true
      }
    }
  }
}`,...m.parameters?.docs?.source}}},h=[`Base`,`Playground`]}))();export{p as Base,m as Playground,h as __namedExportsOrder,f as default};