@oliasoft-open-source/react-ui-library 4.7.5 → 4.7.6

package/dist/storybook/assets/select.stories-CX_B6BvR.js

@@ -0,0 +1,579 @@
+import{j as d}from"./jsx-runtime-eps93zm2.js";import{r as b}from"./index-DhsZuJvc.js";import{w as i,e as o,u as c}from"./index-Be0hXiyp.js";import{S as z}from"./select-Z-GCZ-pY.js";import{S as qa}from"./spacer-BWoNR27H.js";import{I as Z}from"./common-types-Sih75Sav.js";import{I as $}from"./icon-BP4BO6-k.js";import"./index-CF7H4eMJ.js";import"./index-Bk2sglWO.js";import"./disabled-context-rmpd7YJS.js";import"./types-UmZ4Y_CR.js";import"./lodash-BHd_uQHh.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./index-CEuq6vkz.js";import"./extends-CF3RwP-h.js";import"./assertThisInitialized-B9jnkVVz.js";import"./inheritsLoose-DR8r8Ogv.js";import"./memoize-one.esm-CcMeOnPo.js";import"./types-BmbYqTX_.js";import"./text-B3-TSWok.js";import"./actions-CZK3mphC.js";import"./button-C1sV-0mR.js";import"./spinner-AWUe4xwQ.js";import"./badge-CLQ59MDF.js";import"./select.input-DIKP56UZ.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";const _a=[{label:"Aardvarks",value:"termites"},{label:"Kangaroos",value:"grass"},{label:"Koalas",value:"leaves"},{label:"Monkeys",value:"bananas",disabled:!0},{label:"Wombats",value:"bark"}],Fa=[{label:"Kangaroos",value:"grass",details:"(grass)"},{label:"Monkeys",value:"bananas",details:"(bananas)"},{label:"Possums",value:"slugs",details:"(slugs)"}],Ga=[{type:"Heading",label:"Large"},{label:"Aardvarks",value:"termites"},{label:"Kangaroos",value:"grass"},{label:"Monkeys",value:"bananas"},{type:"Heading",label:"Small"},{label:"Possums",value:"slugs"}],Ya=[{label:1,value:1},{label:2,value:2},{label:3,value:3},{label:4,value:4}],Za=[{label:"Yes",value:!0},{label:"No",value:!1}],$a=[{label:"Aardvarks",value:"termites"},{label:"Monkeys",value:"bananas"},{label:"Vampires",value:"blood",icon:d.jsx($,{icon:Z.WARNING,color:"var(--color-text-warning)"})},{label:"Zombies",value:"brains",icon:d.jsx($,{icon:Z.ERROR,color:"var(--color-text-error)"})}],y=[{label:"Delete",icon:"delete",onClick:()=>{}},{label:"Rename",icon:"rename",onClick:()=>{}}],za=[{label:"Kangaroos",value:"grass",actions:y},{label:"Monkeys",value:"bananas",actions:y},{label:"Possums",value:"slugs",actions:y,details:"(some details)"}],Ja=[{label:"Kangaroos",value:"grass",actions:y,icon:d.jsx($,{icon:Z.WARNING,color:"var(--color-text-warning)"}),details:"(grass)"},{label:"Monkeys",value:"bananas",actions:y,icon:d.jsx($,{icon:Z.WARNING,color:"var(--color-text-warning)"}),details:"(bananas)"},{label:"Possums",value:"slugs",actions:y,icon:d.jsx($,{icon:Z.WARNING,color:"var(--color-text-warning)"}),details:"(slugs)"}],Qa=[...Array(1e4).keys()].map((t,l)=>({label:Math.random().toString(36).substring(7),value:l})),Ua=["Aardvarks","Kangaroos","Monkeys","Possums"],Bn={title:"Forms/Select",component:z,args:{options:_a,native:!1,multi:!1,disabled:!1,autoLayerWidth:!1,clearable:!1,searchable:!0,right:!1}},a=t=>{const{multi:l,value:e}=t,[s,n]=b.useState(e||(l?[]:void 0)),u=r=>{const{value:g}=r.target;n(l?g:{value:g})};return d.jsx(z,{value:s,onChange:u,...t})},J=a.bind({}),C=a.bind({});C.args={small:!0};const x=a.bind({});x.args={width:"auto"};const I=a.bind({});I.args={width:"200px"};const w=a.bind({});w.args={native:!0};const f=a.bind({});f.args={multi:!0,clearable:!0};const T=a.bind({});T.args={options:[]};const B=a.bind({});B.args={clearable:!0};const j=a.bind({});j.args={value:{label:"Vampires",value:"blood"}};const k=a.bind({});k.args={placeholder:"Select the best animal..."};const W=a.bind({});W.args={options:Ga};const O=a.bind({});O.args={options:Fa};const D=a.bind({});D.args={options:$a};const N=a.bind({});N.args={options:za};const A=a.bind({});A.args={options:Ja};const E=a.bind({});E.args={searchable:!1};const M=a.bind({});M.args={right:!0};const v=a.bind({});v.parameters={docs:{description:{story:"Avoid autoLayerWidth for very long lists in custom selects (slow)"}}};v.args={width:"70px",autoLayerWidth:!0};const L=a.bind({});L.args={tooltip:"Some info"};const K=a.bind({});K.args={error:"Some info"};const R=a.bind({});R.args={warning:"Some info"};const P=a.bind({});P.args={disabled:!0};const H=a.bind({});H.args={options:Ya,placeholder:void 0};const _=a.bind({});_.args={options:Za};const q=a.bind({});q.args={options:Ua};const m=a.bind({});m.parameters={docs:{description:{story:"Avoid `width: auto` and autoLayerWidth for very long lists in custom selects (slow). Consider checkNonExistentValues={false}."}}};m.args={options:Qa};const F=a.bind({});F.args={deprecatedEventHandler:!0};const G=a.bind({});G.args={value:{label:"Vampires",value:"blood"},disabled:!0};const Y=()=>{const[t,l]=b.useState([{label:"Aardvarks",value:"termites"},{label:"Kangaroos",value:"grass"},{label:"Monkeys",value:"bananas"},{label:"Possums",value:"slugs"}]),[e,s]=b.useState(void 0),[n,u]=b.useState([]);return d.jsxs(d.Fragment,{children:[d.jsx(z,{name:"example",options:t,onChange:r=>s({value:r.target.value}),onCreate:r=>{const g={label:r,value:r};l([...t,g]),s(g)},value:e,clearable:!0}),d.jsx(qa,{}),d.jsx(z,{name:"example",options:t,onChange:r=>u(r.target.value),onCreate:r=>{const g={label:r,value:r};l([...t,g]),console.log(r),u([...n,g])},value:n,multi:!0,clearable:!0})]})},h=a.bind({});h.args={testId:"testId",clearable:!0};h.play=async({canvasElement:t,step:l})=>{const e=t.parentElement?i(t.parentElement):null;await o(e).toBeTruthy(),e&&(await l("Select item with click",async()=>{const s=e.getByTestId("testId");await c.click(s);const n=e.getByTestId("testId-layer");await o(n).toBeInTheDocument();const u=i(n).getByText("Wombats");await c.click(u);const r=e.getByTestId("testId-value");await o(i(r).getByText("Wombats")).toBeInTheDocument()}),await l("Clear selected value",async()=>{const s=e.getByTestId("testId-clear");await c.click(s);const n=e.queryByTestId("testId-value");await o(n).not.toBeInTheDocument()}))};const S=a.bind({});S.args={testId:"testId",clearable:!0,multi:!0};S.play=async({canvasElement:t,step:l})=>{const e=t.parentElement?i(t.parentElement):null;await o(e).toBeTruthy(),e&&(await l("Select items with click",async()=>{const s=e.getByTestId("testId");await c.click(s);const n=e.getByTestId("testId-layer");await o(n).toBeInTheDocument();const u=i(n).getByText("Wombats");await c.click(u);const r=i(n).getByText("Kangaroos");await c.click(r),await c.click(t),await o(n).not.toBeInTheDocument();const g=e.getByTestId("testId-value");await o(i(g).getByText("Wombats")).toBeInTheDocument(),await o(i(g).getByText("Kangaroos")).toBeInTheDocument()}),await l("Deselect item with click",async()=>{const s=e.getByTestId("testId");await c.click(s);const n=e.getByTestId("testId-layer");await o(n).toBeInTheDocument();const u=i(n).getByText("Wombats");await c.click(u),await c.click(t),await o(n).not.toBeInTheDocument();const r=e.getByTestId("testId-value");await o(i(r).queryByText("Wombats")).not.toBeInTheDocument()}),await l("Clear selected values",async()=>{const s=e.getByTestId("testId-clear");await c.click(s);const n=e.queryByTestId("testId-value");await o(n).not.toBeInTheDocument()}))};const V=a.bind({});V.args={testId:"testId",disabled:!0};V.play=async({canvasElement:t,step:l})=>{const e=i(t);await l("Clicking disabled trigger should not show layer",async()=>{await e.getByTestId("testId").click();const n=e.queryByTestId("testId-layer");await o(n).toBeNull()})};const p=()=>{const[t,l]=b.useState(_a),[e,s]=b.useState(void 0);return d.jsx(z,{testId:"testId",name:"example",options:t,onChange:n=>s({value:n.target.value}),onCreate:n=>{const u={label:n,value:n};l([...t,u]),s(u)},value:e})};p.args={testId:"testId"};p.play=async({canvasElement:t,step:l})=>{const e=t.parentElement?i(t.parentElement):null;await o(e).toBeTruthy(),e&&await l("Create new item",async()=>{const s=e.getByTestId("testId-input");if(o(s).toBeInTheDocument(),!s)return;await c.type(s,"New value");const n=e.getByText('Create "New value"');await c.click(n);const u=e.getByTestId("testId-value");await o(i(u).getByText("New value")).toBeInTheDocument()})};Y.__docgenInfo={description:"",methods:[],displayName:"OnCreate"};p.__docgenInfo={description:"",methods:[{name:"play",docblock:null,modifiers:["static"],params:[{name:"{ canvasElement, step }",optional:!1,type:null}],returns:null}],displayName:"TestCreate"};var Q,U,X;J.parameters={...J.parameters,docs:{...(Q=J.parameters)==null?void 0:Q.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(X=(U=J.parameters)==null?void 0:U.docs)==null?void 0:X.source}}};var ee,ae,ne;C.parameters={...C.parameters,docs:{...(ee=C.parameters)==null?void 0:ee.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(ne=(ae=C.parameters)==null?void 0:ae.docs)==null?void 0:ne.source}}};var te,se,le;x.parameters={...x.parameters,docs:{...(te=x.parameters)==null?void 0:te.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(le=(se=x.parameters)==null?void 0:se.docs)==null?void 0:le.source}}};var re,oe,ue;I.parameters={...I.parameters,docs:{...(re=I.parameters)==null?void 0:re.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(ue=(oe=I.parameters)==null?void 0:oe.docs)==null?void 0:ue.source}}};var ce,ie,de;w.parameters={...w.parameters,docs:{...(ce=w.parameters)==null?void 0:ce.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(de=(ie=w.parameters)==null?void 0:ie.docs)==null?void 0:de.source}}};var ge,pe,ve;f.parameters={...f.parameters,docs:{...(ge=f.parameters)==null?void 0:ge.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(ve=(pe=f.parameters)==null?void 0:pe.docs)==null?void 0:ve.source}}};var me,he,Se;T.parameters={...T.parameters,docs:{...(me=T.parameters)==null?void 0:me.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Se=(he=T.parameters)==null?void 0:he.docs)==null?void 0:Se.source}}};var Ve,be,ye;B.parameters={...B.parameters,docs:{...(Ve=B.parameters)==null?void 0:Ve.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(ye=(be=B.parameters)==null?void 0:be.docs)==null?void 0:ye.source}}};var Ce,xe,Ie;j.parameters={...j.parameters,docs:{...(Ce=j.parameters)==null?void 0:Ce.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Ie=(xe=j.parameters)==null?void 0:xe.docs)==null?void 0:Ie.source}}};var we,fe,Te;k.parameters={...k.parameters,docs:{...(we=k.parameters)==null?void 0:we.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Te=(fe=k.parameters)==null?void 0:fe.docs)==null?void 0:Te.source}}};var Be,je,ke;W.parameters={...W.parameters,docs:{...(Be=W.parameters)==null?void 0:Be.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(ke=(je=W.parameters)==null?void 0:je.docs)==null?void 0:ke.source}}};var We,Oe,De;O.parameters={...O.parameters,docs:{...(We=O.parameters)==null?void 0:We.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(De=(Oe=O.parameters)==null?void 0:Oe.docs)==null?void 0:De.source}}};var Ne,Ae,Ee;D.parameters={...D.parameters,docs:{...(Ne=D.parameters)==null?void 0:Ne.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Ee=(Ae=D.parameters)==null?void 0:Ae.docs)==null?void 0:Ee.source}}};var Me,Le,Ke;N.parameters={...N.parameters,docs:{...(Me=N.parameters)==null?void 0:Me.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Ke=(Le=N.parameters)==null?void 0:Le.docs)==null?void 0:Ke.source}}};var Re,Pe,He;A.parameters={...A.parameters,docs:{...(Re=A.parameters)==null?void 0:Re.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(He=(Pe=A.parameters)==null?void 0:Pe.docs)==null?void 0:He.source}}};var _e,qe,Fe;E.parameters={...E.parameters,docs:{...(_e=E.parameters)==null?void 0:_e.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Fe=(qe=E.parameters)==null?void 0:qe.docs)==null?void 0:Fe.source}}};var Ge,Ye,Ze;M.parameters={...M.parameters,docs:{...(Ge=M.parameters)==null?void 0:Ge.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Ze=(Ye=M.parameters)==null?void 0:Ye.docs)==null?void 0:Ze.source}}};var $e,ze,Je;v.parameters={...v.parameters,docs:{...($e=v.parameters)==null?void 0:$e.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Je=(ze=v.parameters)==null?void 0:ze.docs)==null?void 0:Je.source}}};var Qe,Ue,Xe;L.parameters={...L.parameters,docs:{...(Qe=L.parameters)==null?void 0:Qe.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Xe=(Ue=L.parameters)==null?void 0:Ue.docs)==null?void 0:Xe.source}}};var ea,aa,na;K.parameters={...K.parameters,docs:{...(ea=K.parameters)==null?void 0:ea.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(na=(aa=K.parameters)==null?void 0:aa.docs)==null?void 0:na.source}}};var ta,sa,la;R.parameters={...R.parameters,docs:{...(ta=R.parameters)==null?void 0:ta.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(la=(sa=R.parameters)==null?void 0:sa.docs)==null?void 0:la.source}}};var ra,oa,ua;P.parameters={...P.parameters,docs:{...(ra=P.parameters)==null?void 0:ra.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(ua=(oa=P.parameters)==null?void 0:oa.docs)==null?void 0:ua.source}}};var ca,ia,da;H.parameters={...H.parameters,docs:{...(ca=H.parameters)==null?void 0:ca.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(da=(ia=H.parameters)==null?void 0:ia.docs)==null?void 0:da.source}}};var ga,pa,va;_.parameters={..._.parameters,docs:{...(ga=_.parameters)==null?void 0:ga.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(va=(pa=_.parameters)==null?void 0:pa.docs)==null?void 0:va.source}}};var ma,ha,Sa;q.parameters={...q.parameters,docs:{...(ma=q.parameters)==null?void 0:ma.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Sa=(ha=q.parameters)==null?void 0:ha.docs)==null?void 0:Sa.source}}};var Va,ba,ya;m.parameters={...m.parameters,docs:{...(Va=m.parameters)==null?void 0:Va.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(ya=(ba=m.parameters)==null?void 0:ba.docs)==null?void 0:ya.source}}};var Ca,xa,Ia;F.parameters={...F.parameters,docs:{...(Ca=F.parameters)==null?void 0:Ca.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Ia=(xa=F.parameters)==null?void 0:xa.docs)==null?void 0:Ia.source}}};var wa,fa,Ta;G.parameters={...G.parameters,docs:{...(wa=G.parameters)==null?void 0:wa.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Ta=(fa=G.parameters)==null?void 0:fa.docs)==null?void 0:Ta.source}}};var Ba,ja,ka;Y.parameters={...Y.parameters,docs:{...(Ba=Y.parameters)==null?void 0:Ba.docs,source:{originalSource:`() => {
+  const [options, setOptions] = useState([{
+    label: 'Aardvarks',
+    value: 'termites'
+  }, {
+    label: 'Kangaroos',
+    value: 'grass'
+  }, {
+    label: 'Monkeys',
+    value: 'bananas'
+  }, {
+    label: 'Possums',
+    value: 'slugs'
+  }]);
+  const [singleValue, setSingleValue] = useState<ISelectSelectedOption | undefined>(undefined);
+  const [multiValue, setMultiValue] = useState<ISelectSelectedOption[]>([]);
+  return <>
+      <Select name="example" options={options} onChange={evt => setSingleValue({
+      value: evt.target.value
+    })} onCreate={value => {
+      const newValue = {
+        label: value,
+        value
+      };
+      setOptions([...options, newValue]);
+      setSingleValue(newValue);
+    }} value={singleValue} clearable />
+      <Spacer />
+      <Select name="example" options={options} onChange={evt => setMultiValue(evt.target.value)} onCreate={value => {
+      const newValue = {
+        label: value,
+        value
+      };
+      setOptions([...options, newValue]);
+      console.log(value);
+      setMultiValue([...multiValue, newValue]);
+    }} value={multiValue} multi clearable />
+    </>;
+}`,...(ka=(ja=Y.parameters)==null?void 0:ja.docs)==null?void 0:ka.source}}};var Wa,Oa,Da;h.parameters={...h.parameters,docs:{...(Wa=h.parameters)==null?void 0:Wa.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Da=(Oa=h.parameters)==null?void 0:Oa.docs)==null?void 0:Da.source}}};var Na,Aa,Ea;S.parameters={...S.parameters,docs:{...(Na=S.parameters)==null?void 0:Na.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Ea=(Aa=S.parameters)==null?void 0:Aa.docs)==null?void 0:Ea.source}}};var Ma,La,Ka;V.parameters={...V.parameters,docs:{...(Ma=V.parameters)==null?void 0:Ma.docs,source:{originalSource:`(args: any) => {
+  const {
+    multi,
+    value
+  } = args;
+  const [selectedValue, setSelectedValue] = useState(value || (multi ? [] : undefined));
+  const handleChange = (evt: any) => {
+    const {
+      value
+    } = evt.target;
+    setSelectedValue(multi ? value : {
+      value
+    });
+  };
+  return <Select value={selectedValue} onChange={handleChange}
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Ka=(La=V.parameters)==null?void 0:La.docs)==null?void 0:Ka.source}}};var Ra,Pa,Ha;p.parameters={...p.parameters,docs:{...(Ra=p.parameters)==null?void 0:Ra.docs,source:{originalSource:`() => {
+  const [options, setOptions] = useState(storyData.options);
+  const [singleValue, setSingleValue] = useState<ISelectSelectedOption | undefined>(undefined);
+  return <Select testId="testId" name="example" options={options} onChange={evt => setSingleValue({
+    value: evt.target.value
+  })} onCreate={value => {
+    const newValue = {
+      label: value,
+      value
+    };
+    setOptions([...options, newValue]);
+    setSingleValue(newValue);
+  }} value={singleValue} />;
+}`,...(Ha=(Pa=p.parameters)==null?void 0:Pa.docs)==null?void 0:Ha.source}}};const jn=["Default","Small","AutoWidth","FixedWidth","Native","Multiselect","Empty","Clearable","NonExistentValue","CustomPlaceholder","OptionsWithHeadings","OptionsWithDetails","OptionsWithIcons","OptionsWithActions","OptionsWithEverything","NotSearchable","RightAligned","AutoLayerWidth","Tooltip","Error","Warning","Disabled","NumericOptions","BooleanOptions","SimpleOptions","VeryLongList","DeprecatedEventHandler","TestDisabledNonExistentValue","OnCreate","Test","TestMulti","TestDisabled","TestCreate"];export{v as AutoLayerWidth,x as AutoWidth,_ as BooleanOptions,B as Clearable,k as CustomPlaceholder,J as Default,F as DeprecatedEventHandler,P as Disabled,T as Empty,K as Error,I as FixedWidth,f as Multiselect,w as Native,j as NonExistentValue,E as NotSearchable,H as NumericOptions,Y as OnCreate,N as OptionsWithActions,O as OptionsWithDetails,A as OptionsWithEverything,W as OptionsWithHeadings,D as OptionsWithIcons,M as RightAligned,q as SimpleOptions,C as Small,h as Test,p as TestCreate,V as TestDisabled,G as TestDisabledNonExistentValue,S as TestMulti,L as Tooltip,m as VeryLongList,R as Warning,jn as __namedExportsOrder,Bn as default};

package/dist/storybook/assets/{side-bar-CKbHPgIV.js → side-bar-ChOjPNLR.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as m,R as M}from"./index-DhsZuJvc.js";import{c as d}from"./index-Bk2sglWO.js";import{i as v}from"./index-BI4_Bp97.js";import{B as h,I as T}from"./common-types-Sih75Sav.js";import{D as y}from"./drawer-BhuWxI7V.js";import{T as f}from"./tooltip-1V7clEnw.js";import{I as x}from"./icon-BSFY3vDO.js";import{B as I}from"./badge-CLQ59MDF.js";import{B as R}from"./button-VxhoNhrV.js";const j="_inputInTable_1ube5_1",L="_inputHover_1ube5_13",A="_inputFocus_1ube5_18",H="_inputError_1ube5_25",w="_inputWarning_1ube5_26",N="_inputDisabled_1ube5_61",q="_hideScrollbars_1ube5_67",C="_sidebar_1ube5_82",S="_inner_1ube5_93",k="_title_1ube5_103",B="_subtitle_1ube5_104",O="_label_1ube5_105",F="_collapsed_1ube5_109",D="_list_1ube5_134",W="_item_1ube5_140",P="_experimental_1ube5_155",z="_active_1ube5_159",V="_icon_1ube5_163",a={inputInTable:j,inputHover:L,inputFocus:A,inputError:H,inputWarning:w,inputDisabled:N,hideScrollbars:q,sidebar:C,inner:S,title:k,subtitle:B,label:O,collapsed:F,list:D,item:W,experimental:P,active:z,icon:V},$=m.memo(({isOpen:n,label:t,icon:u,invalid:i})=>e.jsxs(e.Fragment,{children:[e.jsx(f,{text:t,enabled:!n,placement:"right-center",possiblePlacements:["right-center"],fontSize:16,padding:"var(--padding-sm)",display:"block",children:e.jsx("span",{className:a.icon,children:e.jsx(I,{small:!0,title:i?"!":void 0,margin:4,children:e.jsx(x,{icon:u})})})}),e.jsx("span",{className:a.label,children:t})]}),(n,t)=>v(n,t)),b=({isOpen:n,items:t,sectionIndex:u,onClick:i,testId:r})=>e.jsx("div",{className:a.list,children:t.map((s,c)=>{const l=`${u}_${c}`;return e.jsx("a",{href:s.value,className:d(a.item,s.isActive?a.active:"",s.isExperimental?a.experimental:""),onClick:o=>i(o,s.value,s.label,s.onClick),"data-testid":r,children:e.jsx($,{label:s.label,icon:s.icon,invalid:s.invalid,isOpen:n},l)},l)})});b.__docgenInfo={description:"",methods:[],displayName:"Link",props:{isOpen:{required:!0,tsType:{name:"boolean"},description:""},items:{required:!0,tsType:{name:"Array",elements:[{name:"IOptionItem"}],raw:"IOptionItem[]"},description:""},sectionIndex:{required:!0,tsType:{name:"number"},description:""},onClick:{required:!0,tsType:{name:"signature",type:"function",raw:`(
+import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as m,R as M}from"./index-DhsZuJvc.js";import{c as d}from"./index-Bk2sglWO.js";import{i as v}from"./index-BI4_Bp97.js";import{B as h,I as T}from"./common-types-Sih75Sav.js";import{D as y}from"./drawer-DSS8yvvp.js";import{T as f}from"./tooltip-1V7clEnw.js";import{I as x}from"./icon-BP4BO6-k.js";import{B as I}from"./badge-CLQ59MDF.js";import{B as R}from"./button-C1sV-0mR.js";const j="_inputInTable_1ube5_1",L="_inputHover_1ube5_13",A="_inputFocus_1ube5_18",H="_inputError_1ube5_25",w="_inputWarning_1ube5_26",N="_inputDisabled_1ube5_61",q="_hideScrollbars_1ube5_67",C="_sidebar_1ube5_82",S="_inner_1ube5_93",k="_title_1ube5_103",B="_subtitle_1ube5_104",O="_label_1ube5_105",F="_collapsed_1ube5_109",D="_list_1ube5_134",W="_item_1ube5_140",P="_experimental_1ube5_155",z="_active_1ube5_159",V="_icon_1ube5_163",a={inputInTable:j,inputHover:L,inputFocus:A,inputError:H,inputWarning:w,inputDisabled:N,hideScrollbars:q,sidebar:C,inner:S,title:k,subtitle:B,label:O,collapsed:F,list:D,item:W,experimental:P,active:z,icon:V},$=m.memo(({isOpen:n,label:t,icon:u,invalid:i})=>e.jsxs(e.Fragment,{children:[e.jsx(f,{text:t,enabled:!n,placement:"right-center",possiblePlacements:["right-center"],fontSize:16,padding:"var(--padding-sm)",display:"block",children:e.jsx("span",{className:a.icon,children:e.jsx(I,{small:!0,title:i?"!":void 0,margin:4,children:e.jsx(x,{icon:u})})})}),e.jsx("span",{className:a.label,children:t})]}),(n,t)=>v(n,t)),b=({isOpen:n,items:t,sectionIndex:u,onClick:i,testId:r})=>e.jsx("div",{className:a.list,children:t.map((s,c)=>{const l=`${u}_${c}`;return e.jsx("a",{href:s.value,className:d(a.item,s.isActive?a.active:"",s.isExperimental?a.experimental:""),onClick:o=>i(o,s.value,s.label,s.onClick),"data-testid":r,children:e.jsx($,{label:s.label,icon:s.icon,invalid:s.invalid,isOpen:n},l)},l)})});b.__docgenInfo={description:"",methods:[],displayName:"Link",props:{isOpen:{required:!0,tsType:{name:"boolean"},description:""},items:{required:!0,tsType:{name:"Array",elements:[{name:"IOptionItem"}],raw:"IOptionItem[]"},description:""},sectionIndex:{required:!0,tsType:{name:"number"},description:""},onClick:{required:!0,tsType:{name:"signature",type:"function",raw:`(
   evt: React.MouseEvent<HTMLAnchorElement, MouseEvent>,
   value: string,
   label: string | ReactNode,

package/dist/storybook/assets/{side-bar.stories-MUj_dj1F.js → side-bar.stories-BupidZk5.js}

@@ -1 +1 @@
-import{j as a}from"./jsx-runtime-eps93zm2.js";import{I as t}from"./common-types-Sih75Sav.js";import{S as m}from"./side-bar-CKbHPgIV.js";import{F as g}from"./flex-EllkLxgO.js";import{B as u}from"./badge-CLQ59MDF.js";import{s as S}from"./icon-custom-Xcl4YkWP.js";import"./index-DhsZuJvc.js";import"./index-Bk2sglWO.js";import"./index-BI4_Bp97.js";import"./drawer-BhuWxI7V.js";import"./lodash-BHd_uQHh.js";import"./index-CEuq6vkz.js";import"./index-CUZDtIZe.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./disabled-context-rmpd7YJS.js";import"./button-VxhoNhrV.js";import"./spinner-AWUe4xwQ.js";import"./tooltip-1V7clEnw.js";const h=[{heading:"First Heading",items:[{label:"Section A",value:"/path/to/something",onClick:()=>{},icon:S},{label:a.jsxs(g,{alignItems:"center",gap:"var(--padding-xxs)",children:["Section B",a.jsx(u,{small:!0,title:"BETA"})]}),value:"/path/to/something",onClick:()=>{},icon:t.HELP,isActive:!0},{label:"Section C",value:"/path/to/something",onClick:()=>{},icon:t.EDIT},{label:"Experimental Section",value:"/path/to/something",onClick:()=>{},icon:t.LIBRARY,isExperimental:!0}]},{heading:"Second Heading",items:[{label:"Section 1",value:"/path/to/something",onClick:()=>{},icon:t.SETTINGS},{label:"Section 2",value:"/path/to/something",onClick:()=>{},icon:t.STAR},{label:"Invalid Section",value:"/path/to/something",onClick:()=>{},icon:t.NOTIFICATION,invalid:!0}]}],L={title:"Navigation/SideBar",component:m,parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:400}}},args:{options:{title:"Title",sections:h},startOpen:!1},argTypes:{top:{control:{type:"text"}},startOpen:{control:{type:"boolean"}}}},c=d=>a.jsx(m,{...d}),o=c.bind({}),e=c.bind({});e.args={startOpen:!0};var i,r,s;o.parameters={...o.parameters,docs:{...(i=o.parameters)==null?void 0:i.docs,source:{originalSource:"args => <SideBar {...args} />",...(s=(r=o.parameters)==null?void 0:r.docs)==null?void 0:s.source}}};var n,l,p;e.parameters={...e.parameters,docs:{...(n=e.parameters)==null?void 0:n.docs,source:{originalSource:"args => <SideBar {...args} />",...(p=(l=e.parameters)==null?void 0:l.docs)==null?void 0:p.source}}};const G=["Default","StartOpen"];export{o as Default,e as StartOpen,G as __namedExportsOrder,L as default};
+import{j as a}from"./jsx-runtime-eps93zm2.js";import{I as t}from"./common-types-Sih75Sav.js";import{S as m}from"./side-bar-ChOjPNLR.js";import{F as g}from"./flex-EllkLxgO.js";import{B as u}from"./badge-CLQ59MDF.js";import{s as S}from"./icon-custom-Xcl4YkWP.js";import"./index-DhsZuJvc.js";import"./index-Bk2sglWO.js";import"./index-BI4_Bp97.js";import"./drawer-DSS8yvvp.js";import"./lodash-BHd_uQHh.js";import"./index-CEuq6vkz.js";import"./index-CUZDtIZe.js";import"./icon-BP4BO6-k.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DR8r8Ogv.js";import"./disabled-context-rmpd7YJS.js";import"./button-C1sV-0mR.js";import"./spinner-AWUe4xwQ.js";import"./tooltip-1V7clEnw.js";const h=[{heading:"First Heading",items:[{label:"Section A",value:"/path/to/something",onClick:()=>{},icon:S},{label:a.jsxs(g,{alignItems:"center",gap:"var(--padding-xxs)",children:["Section B",a.jsx(u,{small:!0,title:"BETA"})]}),value:"/path/to/something",onClick:()=>{},icon:t.HELP,isActive:!0},{label:"Section C",value:"/path/to/something",onClick:()=>{},icon:t.EDIT},{label:"Experimental Section",value:"/path/to/something",onClick:()=>{},icon:t.LIBRARY,isExperimental:!0}]},{heading:"Second Heading",items:[{label:"Section 1",value:"/path/to/something",onClick:()=>{},icon:t.SETTINGS},{label:"Section 2",value:"/path/to/something",onClick:()=>{},icon:t.STAR},{label:"Invalid Section",value:"/path/to/something",onClick:()=>{},icon:t.NOTIFICATION,invalid:!0}]}],L={title:"Navigation/SideBar",component:m,parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:400}}},args:{options:{title:"Title",sections:h},startOpen:!1},argTypes:{top:{control:{type:"text"}},startOpen:{control:{type:"boolean"}}}},c=d=>a.jsx(m,{...d}),o=c.bind({}),e=c.bind({});e.args={startOpen:!0};var i,r,s;o.parameters={...o.parameters,docs:{...(i=o.parameters)==null?void 0:i.docs,source:{originalSource:"args => <SideBar {...args} />",...(s=(r=o.parameters)==null?void 0:r.docs)==null?void 0:s.source}}};var n,l,p;e.parameters={...e.parameters,docs:{...(n=e.parameters)==null?void 0:n.docs,source:{originalSource:"args => <SideBar {...args} />",...(p=(l=e.parameters)==null?void 0:l.docs)==null?void 0:p.source}}};const G=["Default","StartOpen"];export{o as Default,e as StartOpen,G as __namedExportsOrder,L as default};

package/dist/storybook/assets/{site.stories-Ci4g5W2A.js → site.stories-C1GnbK5P.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as x}from"./index-DhsZuJvc.js";import{I as j}from"./common-types-Sih75Sav.js";import{T as g}from"./top-bar-C_tn2Pc5.js";import{S as w}from"./side-bar-CKbHPgIV.js";import{H as t}from"./heading-CRNoBc7q.js";import{B as L}from"./button-VxhoNhrV.js";import{D as v}from"./drawer-BhuWxI7V.js";import{L as d}from"./list-yVTOdmpX.js";import{F as l}from"./field-HrLaMLbx.js";import{I as a}from"./input-BW9trNAW.js";import{C as m}from"./check-box-BtCGePRy.js";import{P as f}from"./page-7SSpdYhb.js";import{R as o,C as i}from"./row-4iAGREkV.js";import{A as u}from"./accordion-BiuI_LCA.js";import{S as s}from"./spacer-BWoNR27H.js";import{T as F}from"./tabs-CAZ_dHGK.js";import"./index-Bk2sglWO.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./disabled-context-rmpd7YJS.js";import"./actions-CHgr8eL8.js";import"./lodash-BHd_uQHh.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./types-BmbYqTX_.js";import"./types-UmZ4Y_CR.js";import"./badge-CLQ59MDF.js";import"./index-BI4_Bp97.js";import"./help-icon-Buhx5nl6.js";import"./spinner-AWUe4xwQ.js";import"./index.es-DazXb-ul.js";import"./redux-tRgGMjwY.js";import"./objectSpread2-DW4nTBoq.js";import"./tiny-invariant-DqLgxztJ.js";import"./memoize-one.esm-CcMeOnPo.js";import"./card-EcjmryU9.js";import"./meta-content-cbHGvPJ7.js";import"./loader-XHoVniao.js";import"./label-CqmyC9he.js";import"./styled-components.browser.esm-Bf0q9Yjk.js";import"./select.input-DIKP56UZ.js";const C=[{label:"Import",value:"import",right:!0},{label:"Settings",value:"settings",right:!0}],S=()=>e.jsx("div",{style:{background:"#AAD3DF",borderLeft:"1px solid #8AB3BF",display:"flex",alignItems:"center",justifyContent:"center",color:"white",height:"100%"},children:"MAP"}),xe={title:"Layout/Layout Examples",parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:400}}}},n=()=>{const[r,b]=x.useState(!0);return e.jsxs(e.Fragment,{children:[e.jsx(g,{}),e.jsx(w,{options:{title:"",sections:[]},width:"250px"}),e.jsx(f,{padding:!1,scroll:!1,children:e.jsxs(o,{spacing:0,flex:!0,children:[e.jsxs(v,{button:e.jsx(L,{onClick:()=>b(!r),round:!0,icon:j.CHEVRON_LEFT}),open:r,width:300,closedWidth:"var(--size-sidebar)",children:[e.jsx(d,{drawer:!0,narrow:!r,list:{name:"Sites",items:[{id:1,name:"Main Site",type:"Heading"},{id:2,name:"Site name here",active:!0,label:{value:1,color:"#69779b"}},{id:3,name:"Locations",type:"Heading"},{id:4,name:"Ipsum",label:{value:2,color:"#69779b"}},{id:5,name:"Dolor",label:{value:3,color:"#69779b"}}]}}),e.jsx(d,{drawer:!0,narrow:!r,list:{name:"Wells",items:[{id:1,name:"Main Wellbore",type:"Heading"},{id:2,name:"Lorem",label:{value:1,color:"#77699b"}}]}}),e.jsx(d,{drawer:!0,narrow:!r,list:{name:"Targets",items:[{id:1,name:"Lorem",label:{value:1,color:"#9b6977"}}]}})]}),e.jsxs(i,{borderLeft:!0,flexbox:!0,children:[e.jsx(s,{}),e.jsx(F,{padding:!0,margin:!1,options:C}),e.jsxs(o,{spacing:0,flex:!0,children:[e.jsxs(i,{scroll:!0,padding:!0,width:550,children:[e.jsx(t,{top:!0,children:"Site name here"}),e.jsx(l,{label:"Name",children:e.jsx(a,{value:"Site name here",width:"200px"})}),e.jsxs(u,{heading:e.jsx(t,{children:"Coordinate Reference System"}),managed:!0,children:[e.jsx(l,{label:"Label",labelLeft:!0,labelWidth:"50px",children:e.jsx(a,{value:"Value",width:"100%"})}),e.jsx(l,{label:"Label",labelLeft:!0,labelWidth:"50px",children:e.jsx(a,{value:"Value",width:"100%"})}),e.jsx(l,{label:"Label",labelLeft:!0,labelWidth:"50px",children:e.jsx(a,{value:"Value",width:"100%"})}),e.jsx(l,{children:e.jsx(m,{label:"Dolor"})})]}),e.jsx(s,{}),e.jsx(t,{marginBottom:"var(--padding)",children:"Location"}),e.jsxs(o,{children:[e.jsx(i,{children:e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})}),e.jsx(i,{children:e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})}),e.jsx(i,{children:e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})}),e.jsx(i,{children:e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})})]}),e.jsx(s,{}),e.jsx(t,{marginBottom:"var(--padding)",children:"Model"}),e.jsxs(o,{children:[e.jsx(i,{children:e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})}),e.jsx(i,{children:e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})})]}),e.jsxs(u,{heading:e.jsx(t,{children:"Settings"}),managed:!0,children:[e.jsx(l,{children:e.jsx(m,{label:"Dolor"})}),e.jsxs(o,{children:[e.jsxs(i,{children:[e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})}),e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})]}),e.jsxs(i,{children:[e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})}),e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})]})]})]})]}),e.jsx(i,{children:e.jsx(S,{})})]})]})]})})]})};n.__docgenInfo={description:"",methods:[],displayName:"Site"};var p,c,h;n.parameters={...n.parameters,docs:{...(p=n.parameters)==null?void 0:p.docs,source:{originalSource:`() => {
+import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as x}from"./index-DhsZuJvc.js";import{I as j}from"./common-types-Sih75Sav.js";import{T as g}from"./top-bar-DG4ok0uF.js";import{S as w}from"./side-bar-ChOjPNLR.js";import{H as t}from"./heading-NkLgQYoP.js";import{B as L}from"./button-C1sV-0mR.js";import{D as v}from"./drawer-DSS8yvvp.js";import{L as d}from"./list-DYNKqvUR.js";import{F as l}from"./field-C5_fLDpy.js";import{I as a}from"./input-BW9trNAW.js";import{C as m}from"./check-box-CaSrhzev.js";import{P as f}from"./page-7SSpdYhb.js";import{R as o,C as i}from"./row-4iAGREkV.js";import{A as u}from"./accordion-6ouB0WTt.js";import{S as s}from"./spacer-BWoNR27H.js";import{T as F}from"./tabs-CAZ_dHGK.js";import"./index-Bk2sglWO.js";import"./icon-BP4BO6-k.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DR8r8Ogv.js";import"./index-CEuq6vkz.js";import"./disabled-context-rmpd7YJS.js";import"./actions-CZK3mphC.js";import"./lodash-BHd_uQHh.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./types-BmbYqTX_.js";import"./types-UmZ4Y_CR.js";import"./badge-CLQ59MDF.js";import"./index-BI4_Bp97.js";import"./help-icon-41R-Z9N1.js";import"./spinner-AWUe4xwQ.js";import"./index.es-D2piFfFj.js";import"./extends-CF3RwP-h.js";import"./redux-tRgGMjwY.js";import"./objectSpread2-DW4nTBoq.js";import"./tiny-invariant-DqLgxztJ.js";import"./memoize-one.esm-CcMeOnPo.js";import"./card-EcjmryU9.js";import"./meta-content-BE7pulye.js";import"./loader-XHoVniao.js";import"./label-hiSz3I8H.js";import"./styled-components.browser.esm-Bf0q9Yjk.js";import"./select.input-DIKP56UZ.js";const C=[{label:"Import",value:"import",right:!0},{label:"Settings",value:"settings",right:!0}],S=()=>e.jsx("div",{style:{background:"#AAD3DF",borderLeft:"1px solid #8AB3BF",display:"flex",alignItems:"center",justifyContent:"center",color:"white",height:"100%"},children:"MAP"}),je={title:"Layout/Layout Examples",parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:400}}}},n=()=>{const[r,b]=x.useState(!0);return e.jsxs(e.Fragment,{children:[e.jsx(g,{}),e.jsx(w,{options:{title:"",sections:[]},width:"250px"}),e.jsx(f,{padding:!1,scroll:!1,children:e.jsxs(o,{spacing:0,flex:!0,children:[e.jsxs(v,{button:e.jsx(L,{onClick:()=>b(!r),round:!0,icon:j.CHEVRON_LEFT}),open:r,width:300,closedWidth:"var(--size-sidebar)",children:[e.jsx(d,{drawer:!0,narrow:!r,list:{name:"Sites",items:[{id:1,name:"Main Site",type:"Heading"},{id:2,name:"Site name here",active:!0,label:{value:1,color:"#69779b"}},{id:3,name:"Locations",type:"Heading"},{id:4,name:"Ipsum",label:{value:2,color:"#69779b"}},{id:5,name:"Dolor",label:{value:3,color:"#69779b"}}]}}),e.jsx(d,{drawer:!0,narrow:!r,list:{name:"Wells",items:[{id:1,name:"Main Wellbore",type:"Heading"},{id:2,name:"Lorem",label:{value:1,color:"#77699b"}}]}}),e.jsx(d,{drawer:!0,narrow:!r,list:{name:"Targets",items:[{id:1,name:"Lorem",label:{value:1,color:"#9b6977"}}]}})]}),e.jsxs(i,{borderLeft:!0,flexbox:!0,children:[e.jsx(s,{}),e.jsx(F,{padding:!0,margin:!1,options:C}),e.jsxs(o,{spacing:0,flex:!0,children:[e.jsxs(i,{scroll:!0,padding:!0,width:550,children:[e.jsx(t,{top:!0,children:"Site name here"}),e.jsx(l,{label:"Name",children:e.jsx(a,{value:"Site name here",width:"200px"})}),e.jsxs(u,{heading:e.jsx(t,{children:"Coordinate Reference System"}),managed:!0,children:[e.jsx(l,{label:"Label",labelLeft:!0,labelWidth:"50px",children:e.jsx(a,{value:"Value",width:"100%"})}),e.jsx(l,{label:"Label",labelLeft:!0,labelWidth:"50px",children:e.jsx(a,{value:"Value",width:"100%"})}),e.jsx(l,{label:"Label",labelLeft:!0,labelWidth:"50px",children:e.jsx(a,{value:"Value",width:"100%"})}),e.jsx(l,{children:e.jsx(m,{label:"Dolor"})})]}),e.jsx(s,{}),e.jsx(t,{marginBottom:"var(--padding)",children:"Location"}),e.jsxs(o,{children:[e.jsx(i,{children:e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})}),e.jsx(i,{children:e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})}),e.jsx(i,{children:e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})}),e.jsx(i,{children:e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})})]}),e.jsx(s,{}),e.jsx(t,{marginBottom:"var(--padding)",children:"Model"}),e.jsxs(o,{children:[e.jsx(i,{children:e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})}),e.jsx(i,{children:e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})})]}),e.jsxs(u,{heading:e.jsx(t,{children:"Settings"}),managed:!0,children:[e.jsx(l,{children:e.jsx(m,{label:"Dolor"})}),e.jsxs(o,{children:[e.jsxs(i,{children:[e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})}),e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})]}),e.jsxs(i,{children:[e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})}),e.jsx(l,{label:"Label",children:e.jsx(a,{value:"Value",width:"100%"})})]})]})]})]}),e.jsx(i,{children:e.jsx(S,{})})]})]})]})})]})};n.__docgenInfo={description:"",methods:[],displayName:"Site"};var p,c,h;n.parameters={...n.parameters,docs:{...(p=n.parameters)==null?void 0:p.docs,source:{originalSource:`() => {
   const [open, setOpen] = useState(true);
   return <>
       <TopBar />
@@ -163,4 +163,4 @@ import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as x}from"./index-DhsZuJv
         </Row>
       </Page>
     </>;
-}`,...(h=(c=n.parameters)==null?void 0:c.docs)==null?void 0:h.source}}};const je=["Site"];export{n as Site,je as __namedExportsOrder,xe as default};
+}`,...(h=(c=n.parameters)==null?void 0:c.docs)==null?void 0:h.source}}};const ge=["Site"];export{n as Site,ge as __namedExportsOrder,je as default};