@oliasoft-open-source/react-ui-library 3.12.0-beta-21 → 3.12.0-beta-23

package/dist/assets/file-input.stories.c6f928e4.js

@@ -0,0 +1,55 @@
+import{j as t}from"./jsx-runtime.bc0b5389.js";import{r as u}from"./index.8c7046c4.js";import{I as k}from"./input-group.655922b4.js";import{I as P}from"./input.c3176058.js";import{B as W}from"./button.4d73be0d.js";import{D as Y}from"./disabled-context.47d44ea4.js";import{S as E}from"./spacer.17f9f9e6.js";import{M as D,a as U}from"./message.65e5823f.js";import{T as G}from"./textarea.61ee0223.js";import"./index.55214191.js";import"./common-enum.04de2059.js";import"./tooltip.47b8435e.js";import"./index.cb615f32.js";import"./types.f0417c6d.js";import"./lodash.96de7017.js";import"./spinner.f0fdc45e.js";import"./icon.86155bc3.js";import"./inheritsLoose.5387fada.js";import"./index.73b4811b.js";const X="_fileInput_1elar_1",z={fileInput:X};var q=(e=>(e.READ_AS_TEXT="readAsText",e.READ_AS_ARRAY_BUFFER="readAsArrayBuffer",e.READ_AS_DATA_URL="readAsDataURL",e.READ_AS_BINARY_STRING="readAsBinaryString",e))(q||{});const K=(e=new Blob,n=q.READ_AS_TEXT)=>{const r=new FileReader;return new Promise((l,s)=>{if(n in r)r[n](e);else{s(new Error("Invalid FileReader method"));return}r.onload=()=>{r.result!==null?l(r.result):s(new Error("File reading resulted in null"))},r.onerror=o=>s(o)})},p=({label:e="Select",loading:n=!1,placeholder:r="No file selected",disabled:l=!1,file:s,accept:o,multi:c,name:f,width:V,onChange:L=()=>{},testId:B})=>{const x=u.exports.useContext(Y),y=u.exports.useRef(null),M=(s==null?void 0:s.name)||null,H=()=>{var a;l||x||(a=y.current)==null||a.click()};return t.exports.jsxs("div",{onClick:H,style:{width:V},children:[t.exports.jsxs(k,{children:[t.exports.jsx(P,{value:M||"",placeholder:r,disabled:!0}),t.exports.jsx(W,{label:e,loading:n,disabled:n||l||x,groupOrder:"last"})]}),t.exports.jsx("input",{name:f,ref:y,className:z.fileInput,type:"file",accept:o,onChange:a=>{var h,_,S;L({...a,target:{...a.target,value:c?(h=a==null?void 0:a.target)==null?void 0:h.files:(S=(_=a==null?void 0:a.target)==null?void 0:_.files)==null?void 0:S[0]}})},"data-testid":B})]})};try{p.displayName="FileInput",p.__docgenInfo={description:"",displayName:"FileInput",props:{label:{defaultValue:{value:"Select"},description:"",name:"label",required:!1,type:{name:"string"}},loading:{defaultValue:{value:"false"},description:"",name:"loading",required:!1,type:{name:"boolean"}},placeholder:{defaultValue:{value:"No file selected"},description:"",name:"placeholder",required:!1,type:{name:"string"}},disabled:{defaultValue:{value:"false"},description:"",name:"disabled",required:!1,type:{name:"boolean"}},file:{defaultValue:null,description:"",name:"file",required:!1,type:{name:"File"}},accept:{defaultValue:null,description:"",name:"accept",required:!1,type:{name:"string"}},multi:{defaultValue:null,description:"",name:"multi",required:!1,type:{name:"boolean"}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"string"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | number"}},onChange:{defaultValue:{value:"() => {}"},description:"",name:"onChange",required:!1,type:{name:"((event: any) => void)"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}}}}}catch{}const{useArgs:Q}=__STORYBOOK_MODULE_ADDONS__,ye={title:"Forms/FileInput",component:p,args:{file:null}},J=e=>{const[n,r]=Q(),l=s=>{r({file:s.target.value})};return t.exports.jsx(p,{...e,onChange:l})},d=J.bind({}),i=J.bind({});i.args={accept:".json"};i.parameters={docs:{description:{story:"See [accept attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept) to restrict file type"}}};const m=()=>{const[e,n]=u.exports.useState(),[r,l]=u.exports.useState({});return t.exports.jsxs(t.exports.Fragment,{children:[t.exports.jsx(p,{file:e,onChange:async s=>{const o=s.target.value;try{const c=await K(o),f=JSON.parse(c);l(f)}catch(c){console.log(c)}n(o)},accept:".json"}),t.exports.jsx(E,{}),e?t.exports.jsx(G,{monospace:!0,value:JSON.stringify(r,null,2),rows:20}):t.exports.jsx(D,{message:{visible:!0,content:"Upload a JSON file to see preview",type:U.INFO}})]})},g=()=>{const[e,n]=u.exports.useState();return t.exports.jsxs(t.exports.Fragment,{children:[t.exports.jsx(p,{file:e,onChange:r=>{n(r.target.value)},accept:"image/*"}),t.exports.jsx(E,{}),e?t.exports.jsx("img",{src:e?URL.createObjectURL(e):"",alt:"Preview",style:{maxHeight:"400px",maxWidth:"400px"}}):t.exports.jsx(D,{message:{visible:!0,content:"Upload an image file to see preview",type:U.INFO}})]})};var F,A,v;d.parameters={...d.parameters,docs:{...(F=d.parameters)==null?void 0:F.docs,source:{originalSource:`args => {
+  const [_, updateArgs] = useArgs();
+  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
+    updateArgs({
+      file: evt.target.value
+    });
+  };
+  return <FileInput {...args} onChange={handleChange} />;
+}`,...(v=(A=d.parameters)==null?void 0:A.docs)==null?void 0:v.source}}};var I,j,b;i.parameters={...i.parameters,docs:{...(I=i.parameters)==null?void 0:I.docs,source:{originalSource:`args => {
+  const [_, updateArgs] = useArgs();
+  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
+    updateArgs({
+      file: evt.target.value
+    });
+  };
+  return <FileInput {...args} onChange={handleChange} />;
+}`,...(b=(j=i.parameters)==null?void 0:j.docs)==null?void 0:b.source}}};var R,C,N;m.parameters={...m.parameters,docs:{...(R=m.parameters)==null?void 0:R.docs,source:{originalSource:`() => {
+  const [file, setFile] = useState();
+  const [json, setJson] = useState({});
+  return <>
+      <FileInput file={file} onChange={async evt => {
+      const file = evt.target.value;
+      try {
+        const text = await readFile(file);
+        const json = JSON.parse((text as string));
+        setJson(json);
+      } catch (error) {
+        console.log(error);
+      }
+      setFile(file);
+    }} accept=".json" />
+      <Spacer />
+      {file ? <TextArea monospace value={JSON.stringify(json, null, 2)} rows={20} /> : <Message message={{
+      visible: true,
+      content: 'Upload a JSON file to see preview',
+      type: MessageType.INFO
+    }} />}
+    </>;
+}`,...(N=(C=m.parameters)==null?void 0:C.docs)==null?void 0:N.source}}};var O,T,w;g.parameters={...g.parameters,docs:{...(O=g.parameters)==null?void 0:O.docs,source:{originalSource:`() => {
+  const [file, setFile] = useState();
+  return <>
+      <FileInput file={file} onChange={evt => {
+      setFile(evt.target.value);
+    }} accept="image/*" />
+      <Spacer />
+      {file ? <img src={file ? URL.createObjectURL(file) : ''} alt="Preview" style={{
+      maxHeight: '400px',
+      maxWidth: '400px'
+    }} /> : <Message message={{
+      visible: true,
+      content: 'Upload an image file to see preview',
+      type: MessageType.INFO
+    }} />}
+    </>;
+}`,...(w=(T=g.parameters)==null?void 0:T.docs)==null?void 0:w.source}}};const he=["Default","RestrictFiletype","ReadJSONFile","Image"];export{d as Default,g as Image,m as ReadJSONFile,i as RestrictFiletype,he as __namedExportsOrder,ye as default};

package/dist/assets/file-input.stories.f40408e6.css

@@ -0,0 +1 @@
+._fileInput_1elar_1{display:none!important}

package/dist/assets/flex.f0bedd04.js

@@ -0,0 +1 @@
+import{j as u}from"./jsx-runtime.bc0b5389.js";const t=({alignItems:a="initial",justifyContent:n="initial",direction:r="initial",height:i="initial",children:l=null,wrap:s=!0,gap:e=!1})=>u.exports.jsx("div",{style:{display:"flex",flexDirection:r,alignItems:a,justifyContent:n,height:typeof i=="number"?`${i}px`:i,flexWrap:s?"wrap":"nowrap",gap:e===!1?0:e===!0?"20px":typeof e=="number"?`${e}px`:e},children:l});try{t.displayName="Flex",t.__docgenInfo={description:"",displayName:"Flex",props:{alignItems:{defaultValue:{value:"initial"},description:"",name:"alignItems",required:!1,type:{name:"string"}},justifyContent:{defaultValue:{value:"initial"},description:"",name:"justifyContent",required:!1,type:{name:"string"}},direction:{defaultValue:{value:"initial"},description:"",name:"direction",required:!1,type:{name:"string"}},height:{defaultValue:{value:"initial"},description:"",name:"height",required:!1,type:{name:"string | number"}},wrap:{defaultValue:{value:"true"},description:"",name:"wrap",required:!1,type:{name:"boolean"}},gap:{defaultValue:{value:"false"},description:"",name:"gap",required:!1,type:{name:"string | number | boolean"}}}}}catch{}export{t as F};

package/dist/assets/flex.stories.376a9450.js

@@ -0,0 +1,15 @@
+import{j as r}from"./jsx-runtime.bc0b5389.js";import{F as I}from"./flex.f0bedd04.js";import{B as v}from"./button.4d73be0d.js";import{T as J}from"./text.3e08313f.js";import"./index.8c7046c4.js";import"./index.55214191.js";import"./spinner.f0fdc45e.js";import"./disabled-context.47d44ea4.js";import"./icon.86155bc3.js";import"./inheritsLoose.5387fada.js";import"./index.73b4811b.js";import"./tooltip.47b8435e.js";import"./index.cb615f32.js";import"./common-enum.04de2059.js";const V={title:"Layout/Flex",component:I,argTypes:{alignItems:{control:{type:"inline-radio"},options:["flex-start","center","flex-end"]},justifyContent:{control:{type:"inline-radio"},options:["flex-start","center","flex-end","space-between"]},gap:{control:{type:"boolean"}}},args:{alignItems:void 0,justifyContent:void 0,children:r.exports.jsxs(r.exports.Fragment,{children:[r.exports.jsx(v,{label:"Button"}),r.exports.jsx(J,{children:"Text"})]})}},e=_=>r.exports.jsx(I,{..._}),p=e.bind({}),s=e.bind({});s.args={gap:!0};const t=e.bind({});t.args={gap:"50px"};const a=e.bind({});a.args={height:"200px",alignItems:"center",justifyContent:"center"};const o=e.bind({});o.args={justifyContent:"space-between"};const n=e.bind({});n.args={justifyContent:"flex-end"};const i=e.bind({});i.args={direction:"column"};var c,l,m;p.parameters={...p.parameters,docs:{...(c=p.parameters)==null?void 0:c.docs,source:{originalSource:`args => <Flex
+// eslint-disable-next-line react/jsx-props-no-spreading
+{...args} />`,...(m=(l=p.parameters)==null?void 0:l.docs)==null?void 0:m.source}}};var d,x,g;s.parameters={...s.parameters,docs:{...(d=s.parameters)==null?void 0:d.docs,source:{originalSource:`args => <Flex
+// eslint-disable-next-line react/jsx-props-no-spreading
+{...args} />`,...(g=(x=s.parameters)==null?void 0:x.docs)==null?void 0:g.source}}};var u,f,b;t.parameters={...t.parameters,docs:{...(u=t.parameters)==null?void 0:u.docs,source:{originalSource:`args => <Flex
+// eslint-disable-next-line react/jsx-props-no-spreading
+{...args} />`,...(b=(f=t.parameters)==null?void 0:f.docs)==null?void 0:b.source}}};var j,y,C;a.parameters={...a.parameters,docs:{...(j=a.parameters)==null?void 0:j.docs,source:{originalSource:`args => <Flex
+// eslint-disable-next-line react/jsx-props-no-spreading
+{...args} />`,...(C=(y=a.parameters)==null?void 0:y.docs)==null?void 0:C.source}}};var F,S,h;o.parameters={...o.parameters,docs:{...(F=o.parameters)==null?void 0:F.docs,source:{originalSource:`args => <Flex
+// eslint-disable-next-line react/jsx-props-no-spreading
+{...args} />`,...(h=(S=o.parameters)==null?void 0:S.docs)==null?void 0:h.source}}};var B,T,w;n.parameters={...n.parameters,docs:{...(B=n.parameters)==null?void 0:B.docs,source:{originalSource:`args => <Flex
+// eslint-disable-next-line react/jsx-props-no-spreading
+{...args} />`,...(w=(T=n.parameters)==null?void 0:T.docs)==null?void 0:w.source}}};var D,G,E;i.parameters={...i.parameters,docs:{...(D=i.parameters)==null?void 0:D.docs,source:{originalSource:`args => <Flex
+// eslint-disable-next-line react/jsx-props-no-spreading
+{...args} />`,...(E=(G=i.parameters)==null?void 0:G.docs)==null?void 0:E.source}}};const W=["Default","DefaultGap","CustomGap","Center","SpaceBetween","JustifyEnd","Column"];export{a as Center,i as Column,t as CustomGap,p as Default,s as DefaultGap,n as JustifyEnd,o as SpaceBetween,W as __namedExportsOrder,V as default};

package/dist/assets/footer.stories.61ffd164.js

@@ -0,0 +1,3 @@
+import{j as e}from"./jsx-runtime.bc0b5389.js";import{T as p}from"./table.34589fe4.js";import{t as a,r as s}from"./table.stories-data.ad50babd.js";import"./index.8c7046c4.js";import"./index.55214191.js";import"./index.es.5a055fee.js";import"./inheritsLoose.5387fada.js";import"./extends.946277fc.js";import"./redux.afc48bf2.js";import"./objectSpread2.62d3bde3.js";import"./hoist-non-react-statics.cjs.10bac274.js";import"./index.cb615f32.js";import"./memoize-one.esm.7a54f149.js";import"./icon.86155bc3.js";import"./index.73b4811b.js";import"./disabled-context.47d44ea4.js";import"./lodash.96de7017.js";import"./actions.310c4239.js";import"./button.4d73be0d.js";import"./spinner.f0fdc45e.js";import"./tooltip.47b8435e.js";import"./common-enum.04de2059.js";import"./enum.9003e5cc.js";import"./badge.c60b26e4.js";import"./types.f0417c6d.js";import"./heading.d8accca2.js";import"./help-icon.8deae1d5.js";import"./pagination.4f19f4f6.js";import"./select.0c940187.js";import"./assertThisInitialized.962dde02.js";import"./text.3e08313f.js";import"./select.input.395daa83.js";import"./input.c3176058.js";import"./input-group.655922b4.js";import"./input-group-addon.d746d2dd.js";import"./number-input.9aea4872.js";import"./index.cb879655.js";import"./check-box.fe165636.js";import"./slider.295b80b6.js";import"./index.eeb00e59.js";import"./popover.deb1280b.js";import"./flex.f0bedd04.js";const Z={title:"Basic/Table/Footer",component:p,args:{table:{...a}}},n=i=>e.exports.jsx(p,{...i}),r=n.bind({});r.args={table:s};var o,t,m;r.parameters={...r.parameters,docs:{...(o=r.parameters)==null?void 0:o.docs,source:{originalSource:`args => {
+  return <Table {...args} />;
+}`,...(m=(t=r.parameters)==null?void 0:t.docs)==null?void 0:m.source}}};const $=["Footer"];export{r as Footer,$ as __namedExportsOrder,Z as default};

package/dist/assets/form-row.62481e7e.css

@@ -0,0 +1 @@
+:root{--color-primary-0: hsl(0, 0%, 100%);--color-primary-50: hsl(18.24742268, 82.90598291%, 97.5%);--color-primary-100: hsl(18.24742268, 82.90598291%, 92.5%);--color-primary-150: hsl(18.24742268, 82.90598291%, 87.5%);--color-primary-200: hsl(18.24742268, 82.90598291%, 82.5%);--color-primary-250: hsl(18.24742268, 82.90598291%, 77.5%);--color-primary-300: hsl(18.24742268, 82.90598291%, 72.5%);--color-primary-350: hsl(18.24742268, 82.90598291%, 67.5%);--color-primary-400: hsl(18.24742268, 82.90598291%, 62.5%);--color-primary-450: hsl(18.24742268, 82.90598291%, 57.5%);--color-primary-500: hsl(18.24742268, 82.90598291%, 52.5%);--color-primary-550: hsl(18.24742268, 82.90598291%, 47.5%);--color-primary-600: hsl(18.24742268, 82.90598291%, 42.5%);--color-primary-650: hsl(18.24742268, 82.90598291%, 37.5%);--color-primary-700: hsl(18.24742268, 82.90598291%, 32.5%);--color-primary-750: hsl(18.24742268, 82.90598291%, 27.5%);--color-primary-800: hsl(18.24742268, 82.90598291%, 22.5%);--color-primary-850: hsl(18.24742268, 82.90598291%, 17.5%);--color-primary-900: hsl(18.24742268, 82.90598291%, 12.5%);--color-primary-950: hsl(18.24742268, 82.90598291%, 7.5%);--color-primary-1000: hsl(18.24742268, 82.90598291%, 2.5%);--color-error-0: hsl(180, 100%, 100%);--color-error-50: hsl(0, 71.29186603%, 97.5%);--color-error-100: hsl(0, 71.29186603%, 92.5%);--color-error-150: hsl(0, 71.29186603%, 87.5%);--color-error-200: hsl(0, 71.29186603%, 82.5%);--color-error-250: hsl(0, 71.29186603%, 77.5%);--color-error-300: hsl(0, 71.29186603%, 72.5%);--color-error-350: hsl(0, 71.29186603%, 67.5%);--color-error-400: hsl(0, 71.29186603%, 62.5%);--color-error-450: hsl(0, 71.29186603%, 57.5%);--color-error-500: hsl(0, 71.29186603%, 52.5%);--color-error-550: hsl(0, 71.29186603%, 47.5%);--color-error-600: hsl(0, 71.29186603%, 42.5%);--color-error-650: hsl(0, 71.29186603%, 37.5%);--color-error-700: hsl(0, 71.29186603%, 32.5%);--color-error-750: hsl(0, 71.29186603%, 27.5%);--color-error-800: hsl(0, 71.29186603%, 22.5%);--color-error-850: hsl(0, 71.29186603%, 17.5%);--color-error-900: hsl(0, 71.29186603%, 12.5%);--color-error-950: hsl(0, 71.29186603%, 7.5%);--color-error-1000: hsl(0, 71.29186603%, 2.5%);--color-success-0: hsl(0, 0%, 100%);--color-success-50: hsl(120, 52.03252033%, 97.5%);--color-success-100: hsl(120, 52.03252033%, 92.5%);--color-success-150: hsl(120, 52.03252033%, 87.5%);--color-success-200: hsl(120, 52.03252033%, 82.5%);--color-success-250: hsl(120, 52.03252033%, 77.5%);--color-success-300: hsl(120, 52.03252033%, 72.5%);--color-success-350: hsl(120, 52.03252033%, 67.5%);--color-success-400: hsl(120, 52.03252033%, 62.5%);--color-success-450: hsl(120, 52.03252033%, 57.5%);--color-success-500: hsl(120, 52.03252033%, 52.5%);--color-success-550: hsl(120, 52.03252033%, 47.5%);--color-success-600: hsl(120, 52.03252033%, 42.5%);--color-success-650: hsl(120, 52.03252033%, 37.5%);--color-success-700: hsl(120, 52.03252033%, 32.5%);--color-success-750: hsl(120, 52.03252033%, 27.5%);--color-success-800: hsl(120, 52.03252033%, 22.5%);--color-success-850: hsl(120, 52.03252033%, 17.5%);--color-success-900: hsl(120, 52.03252033%, 12.5%);--color-success-950: hsl(120, 52.03252033%, 7.5%);--color-success-1000: hsl(120, 52.03252033%, 2.5%);--color-warning-0: hsl(240, 100%, 100%);--color-warning-50: hsl(44.9197861, 76.32653061%, 97.5%);--color-warning-100: hsl(44.9197861, 76.32653061%, 92.5%);--color-warning-150: hsl(44.9197861, 76.32653061%, 87.5%);--color-warning-200: hsl(44.9197861, 76.32653061%, 82.5%);--color-warning-250: hsl(44.9197861, 76.32653061%, 77.5%);--color-warning-300: hsl(44.9197861, 76.32653061%, 72.5%);--color-warning-350: hsl(44.9197861, 76.32653061%, 67.5%);--color-warning-400: hsl(44.9197861, 76.32653061%, 62.5%);--color-warning-450: hsl(44.9197861, 76.32653061%, 57.5%);--color-warning-500: hsl(44.9197861, 76.32653061%, 52.5%);--color-warning-550: hsl(44.9197861, 76.32653061%, 47.5%);--color-warning-600: hsl(44.9197861, 76.32653061%, 42.5%);--color-warning-650: hsl(44.9197861, 76.32653061%, 37.5%);--color-warning-700: hsl(44.9197861, 76.32653061%, 32.5%);--color-warning-750: hsl(44.9197861, 76.32653061%, 27.5%);--color-warning-800: hsl(44.9197861, 76.32653061%, 22.5%);--color-warning-850: hsl(44.9197861, 76.32653061%, 17.5%);--color-warning-900: hsl(44.9197861, 76.32653061%, 12.5%);--color-warning-950: hsl(44.9197861, 76.32653061%, 7.5%);--color-warning-1000: hsl(44.9197861, 76.32653061%, 2.5%);--color-info-0: hsl(0, 0%, 100%);--color-info-50: hsl(201.03092784, 82.90598291%, 97.5%);--color-info-100: hsl(201.03092784, 82.90598291%, 92.5%);--color-info-150: hsl(201.03092784, 82.90598291%, 87.5%);--color-info-200: hsl(201.03092784, 82.90598291%, 82.5%);--color-info-250: hsl(201.03092784, 82.90598291%, 77.5%);--color-info-300: hsl(201.03092784, 82.90598291%, 72.5%);--color-info-350: hsl(201.03092784, 82.90598291%, 67.5%);--color-info-400: hsl(201.03092784, 82.90598291%, 62.5%);--color-info-450: hsl(201.03092784, 82.90598291%, 57.5%);--color-info-500: hsl(201.03092784, 82.90598291%, 52.5%);--color-info-550: hsl(201.03092784, 82.90598291%, 47.5%);--color-info-600: hsl(201.03092784, 82.90598291%, 42.5%);--color-info-650: hsl(201.03092784, 82.90598291%, 37.5%);--color-info-700: hsl(201.03092784, 82.90598291%, 32.5%);--color-info-750: hsl(201.03092784, 82.90598291%, 27.5%);--color-info-800: hsl(201.03092784, 82.90598291%, 22.5%);--color-info-850: hsl(201.03092784, 82.90598291%, 17.5%);--color-info-900: hsl(201.03092784, 82.90598291%, 12.5%);--color-info-950: hsl(201.03092784, 82.90598291%, 7.5%);--color-info-1000: hsl(201.03092784, 82.90598291%, 2.5%);--color-neutral-0: hsl(0, 0%, 100%);--color-neutral-50: hsl(210, 10%, 97.5%);--color-neutral-100: hsl(210, 10%, 92.5%);--color-neutral-150: hsl(210, 10%, 87.5%);--color-neutral-200: hsl(210, 10%, 82.5%);--color-neutral-250: hsl(210, 10%, 77.5%);--color-neutral-300: hsl(210, 10%, 72.5%);--color-neutral-350: hsl(210, 10%, 67.5%);--color-neutral-400: hsl(210, 10%, 62.5%);--color-neutral-450: hsl(210, 10%, 57.5%);--color-neutral-500: hsl(210, 10%, 52.5%);--color-neutral-550: hsl(210, 10%, 47.5%);--color-neutral-600: hsl(210, 10%, 42.5%);--color-neutral-650: hsl(210, 10%, 37.5%);--color-neutral-700: hsl(210, 10%, 32.5%);--color-neutral-750: hsl(210, 10%, 27.5%);--color-neutral-800: hsl(210, 10%, 22.5%);--color-neutral-850: hsl(210, 10%, 17.5%);--color-neutral-900: hsl(210, 10%, 12.5%);--color-neutral-950: hsl(210, 10%, 7.5%);--color-neutral-1000: hsl(210, 10%, 2.5%);--color-primary-muted-0: hsl(0, 0%, 100%);--color-primary-muted-50: hsl(18.24742268, 57.90598291%, 97.5%);--color-primary-muted-100: hsl(18.24742268, 57.90598291%, 92.5%);--color-primary-muted-150: hsl(18.24742268, 57.90598291%, 87.5%);--color-primary-muted-200: hsl(18.24742268, 57.90598291%, 82.5%);--color-primary-muted-250: hsl(18.24742268, 57.90598291%, 77.5%);--color-primary-muted-300: hsl(18.24742268, 57.90598291%, 72.5%);--color-primary-muted-350: hsl(18.24742268, 57.90598291%, 67.5%);--color-primary-muted-400: hsl(18.24742268, 57.90598291%, 62.5%);--color-primary-muted-450: hsl(18.24742268, 57.90598291%, 57.5%);--color-primary-muted-500: hsl(18.24742268, 57.90598291%, 52.5%);--color-primary-muted-550: hsl(18.24742268, 57.90598291%, 47.5%);--color-primary-muted-600: hsl(18.24742268, 57.90598291%, 42.5%);--color-primary-muted-650: hsl(18.24742268, 57.90598291%, 37.5%);--color-primary-muted-700: hsl(18.24742268, 57.90598291%, 32.5%);--color-primary-muted-750: hsl(18.24742268, 57.90598291%, 27.5%);--color-primary-muted-800: hsl(18.24742268, 57.90598291%, 22.5%);--color-primary-muted-850: hsl(18.24742268, 57.90598291%, 17.5%);--color-primary-muted-900: hsl(18.24742268, 57.90598291%, 12.5%);--color-primary-muted-950: hsl(18.24742268, 57.90598291%, 7.5%);--color-primary-muted-1000: hsl(18.24742268, 57.90598291%, 2.5%);--color-error-muted-0: hsl(180, 100%, 100%);--color-error-muted-50: hsl(0, 46.29186603%, 97.5%);--color-error-muted-100: hsl(0, 46.29186603%, 92.5%);--color-error-muted-150: hsl(0, 46.29186603%, 87.5%);--color-error-muted-200: hsl(0, 46.29186603%, 82.5%);--color-error-muted-250: hsl(0, 46.29186603%, 77.5%);--color-error-muted-300: hsl(0, 46.29186603%, 72.5%);--color-error-muted-350: hsl(0, 46.29186603%, 67.5%);--color-error-muted-400: hsl(0, 46.29186603%, 62.5%);--color-error-muted-450: hsl(0, 46.29186603%, 57.5%);--color-error-muted-500: hsl(0, 46.29186603%, 52.5%);--color-error-muted-550: hsl(0, 46.29186603%, 47.5%);--color-error-muted-600: hsl(0, 46.29186603%, 42.5%);--color-error-muted-650: hsl(0, 46.29186603%, 37.5%);--color-error-muted-700: hsl(0, 46.29186603%, 32.5%);--color-error-muted-750: hsl(0, 46.29186603%, 27.5%);--color-error-muted-800: hsl(0, 46.29186603%, 22.5%);--color-error-muted-850: hsl(0, 46.29186603%, 17.5%);--color-error-muted-900: hsl(0, 46.29186603%, 12.5%);--color-error-muted-950: hsl(0, 46.29186603%, 7.5%);--color-error-muted-1000: hsl(0, 46.29186603%, 2.5%);--color-success-muted-0: hsl(0, 0%, 100%);--color-success-muted-50: hsl(120, 27.03252033%, 97.5%);--color-success-muted-100: hsl(120, 27.03252033%, 92.5%);--color-success-muted-150: hsl(120, 27.03252033%, 87.5%);--color-success-muted-200: hsl(120, 27.03252033%, 82.5%);--color-success-muted-250: hsl(120, 27.03252033%, 77.5%);--color-success-muted-300: hsl(120, 27.03252033%, 72.5%);--color-success-muted-350: hsl(120, 27.03252033%, 67.5%);--color-success-muted-400: hsl(120, 27.03252033%, 62.5%);--color-success-muted-450: hsl(120, 27.03252033%, 57.5%);--color-success-muted-500: hsl(120, 27.03252033%, 52.5%);--color-success-muted-550: hsl(120, 27.03252033%, 47.5%);--color-success-muted-600: hsl(120, 27.03252033%, 42.5%);--color-success-muted-650: hsl(120, 27.03252033%, 37.5%);--color-success-muted-700: hsl(120, 27.03252033%, 32.5%);--color-success-muted-750: hsl(120, 27.03252033%, 27.5%);--color-success-muted-800: hsl(120, 27.03252033%, 22.5%);--color-success-muted-850: hsl(120, 27.03252033%, 17.5%);--color-success-muted-900: hsl(120, 27.03252033%, 12.5%);--color-success-muted-950: hsl(120, 27.03252033%, 7.5%);--color-success-muted-1000: hsl(120, 27.03252033%, 2.5%);--color-warning-muted-0: hsl(240, 100%, 100%);--color-warning-muted-50: hsl(44.9197861, 51.32653061%, 97.5%);--color-warning-muted-100: hsl(44.9197861, 51.32653061%, 92.5%);--color-warning-muted-150: hsl(44.9197861, 51.32653061%, 87.5%);--color-warning-muted-200: hsl(44.9197861, 51.32653061%, 82.5%);--color-warning-muted-250: hsl(44.9197861, 51.32653061%, 77.5%);--color-warning-muted-300: hsl(44.9197861, 51.32653061%, 72.5%);--color-warning-muted-350: hsl(44.9197861, 51.32653061%, 67.5%);--color-warning-muted-400: hsl(44.9197861, 51.32653061%, 62.5%);--color-warning-muted-450: hsl(44.9197861, 51.32653061%, 57.5%);--color-warning-muted-500: hsl(44.9197861, 51.32653061%, 52.5%);--color-warning-muted-550: hsl(44.9197861, 51.32653061%, 47.5%);--color-warning-muted-600: hsl(44.9197861, 51.32653061%, 42.5%);--color-warning-muted-650: hsl(44.9197861, 51.32653061%, 37.5%);--color-warning-muted-700: hsl(44.9197861, 51.32653061%, 32.5%);--color-warning-muted-750: hsl(44.9197861, 51.32653061%, 27.5%);--color-warning-muted-800: hsl(44.9197861, 51.32653061%, 22.5%);--color-warning-muted-850: hsl(44.9197861, 51.32653061%, 17.5%);--color-warning-muted-900: hsl(44.9197861, 51.32653061%, 12.5%);--color-warning-muted-950: hsl(44.9197861, 51.32653061%, 7.5%);--color-warning-muted-1000: hsl(44.9197861, 51.32653061%, 2.5%);--color-info-muted-0: hsl(0, 0%, 100%);--color-info-muted-50: hsl(201.03092784, 57.90598291%, 97.5%);--color-info-muted-100: hsl(201.03092784, 57.90598291%, 92.5%);--color-info-muted-150: hsl(201.03092784, 57.90598291%, 87.5%);--color-info-muted-200: hsl(201.03092784, 57.90598291%, 82.5%);--color-info-muted-250: hsl(201.03092784, 57.90598291%, 77.5%);--color-info-muted-300: hsl(201.03092784, 57.90598291%, 72.5%);--color-info-muted-350: hsl(201.03092784, 57.90598291%, 67.5%);--color-info-muted-400: hsl(201.03092784, 57.90598291%, 62.5%);--color-info-muted-450: hsl(201.03092784, 57.90598291%, 57.5%);--color-info-muted-500: hsl(201.03092784, 57.90598291%, 52.5%);--color-info-muted-550: hsl(201.03092784, 57.90598291%, 47.5%);--color-info-muted-600: hsl(201.03092784, 57.90598291%, 42.5%);--color-info-muted-650: hsl(201.03092784, 57.90598291%, 37.5%);--color-info-muted-700: hsl(201.03092784, 57.90598291%, 32.5%);--color-info-muted-750: hsl(201.03092784, 57.90598291%, 27.5%);--color-info-muted-800: hsl(201.03092784, 57.90598291%, 22.5%);--color-info-muted-850: hsl(201.03092784, 57.90598291%, 17.5%);--color-info-muted-900: hsl(201.03092784, 57.90598291%, 12.5%);--color-info-muted-950: hsl(201.03092784, 57.90598291%, 7.5%);--color-info-muted-1000: hsl(201.03092784, 57.90598291%, 2.5%)}:root{color-scheme:initial;--size: 32px;--size-sm: 24px;--size-xs: 16px;--spacing-3xl: 36px;--spacing-2xl: 32px;--spacing-xl: 28px;--spacing-lg: 24px;--spacing: 20px;--spacing-sm: 16px;--spacing-xs: 12px;--spacing-2xs: 8px;--spacing-3xs: 4px;--padding-input-x: 12px;--padding-input-y: 6.5px;--padding-input: var(--padding-input-y) var(--padding-input-x);--padding-input-small-x: 7px;--padding-input-small-y: 3.5px;--padding-input-small: var(--padding-input-small-y) var(--padding-input-small-x);--border-radius: 4px;--color-text: rgba(0, 0, 0, .87);--color-text-muted: #7d7b7a;--color-text-faint: #acabab;--color-text-error: hsl(0, 40%, 50%);--color-text-warning: var(--color-warning-700);--color-text-success: hsl(120, 40%, 50%);--color-text-info: hsl(201.03092784, 40%, 50%);--color-text-primary: #eb6429;--color-text-primary-hover: #ce4c13;--color-text-primary-active: #9f3b0f;--color-text-placeholder: rgba(0, 0, 0, .3);--color-background: #f5f7f9;--color-background-raised: white;--color-background-disabled: rgba(0, 0, 0, .025);--color-background-info: hsl(201.03092784, 40%, 90%);--color-background-error: hsl(0, 40%, 90%);--color-background-success: hsl(120, 40%, 90%);--color-background-warning: var(--color-warning-100);--color-background-primary: #eb6429;--color-background-input: white;--color-background-listitem-active: #fff0e4;--color-background-listitem-hover: #f5f7f9;--color-background-menuitem-active: #edf1f4;--color-background-menuitem-hover: #f5f7f9;--color-background-menuitem-activehover: #e5eaef;--color-border: #ddd;--color-border-checkbox: var(--color-neutral-300);--color-border-hover: var(--color-neutral-400);--color-border-focus: var(--color-info-muted-500);--color-border-error: var(--color-error-muted-300);--color-border-error-hover: var(--color-error-muted-400);--color-border-warning: var(--color-warning-muted-300);--color-border-warning-hover: var(--color-warning-muted-400);--shadow-focus: 0 0 0 2px rgba(41, 167, 235, .25)}html[data-theme=dark]{color-scheme:dark;--color-text: var(--color-neutral-200);--color-text-muted: var(--color-neutral-400);--color-text-faint: var(--color-neutral-600);--color-text-primary: var(--color-primary-muted-450);--color-text-primary-active: var(--color-primary-muted-350);--color-text-primary-hover: var(--color-primary-muted-400);--color-text-error: var(--color-error-muted-300);--color-text-info: var(--color-info-muted-300);--color-text-success: var(--color-success-muted-300);--color-text-warning: var(--color-warning-muted-300);--color-text-placeholder: rgba(255, 255, 255, .3);--color-background: var(--color-neutral-900);--color-background-raised: var(--color-neutral-800);--color-background-disabled: rgba(0, 0, 0, .2);--color-background-error: var(--color-error-muted-700);--color-background-info: var(--color-info-muted-700);--color-background-success: var(--color-success-muted-700);--color-background-warning: var(--color-warning-muted-700);--color-background-primary: var(--color-primary-muted-500);--color-background-input: var(--color-neutral-750);--color-background-listitem-active: var(--color-primary-muted-750);--color-background-listitem-hover: var(--color-neutral-750);--color-background-menuitem-active: var(--color-neutral-650);--color-background-menuitem-hover: var(--color-neutral-700);--color-background-menuitem-activehover: var(--color-neutral-600);--color-border: var(--color-neutral-1000);--color-border-checkbox: var(--color-neutral-1000);--color-border-hover: var(--color-neutral-500);--color-border-focus: var(--color-info-500);--color-border-error: var(--color-neutral-1000);--color-border-warning: var(--color-neutral-1000);--shadow-focus: 0 0 0 2px rgba(41, 167, 235, .5)}._formRow_qmafr_341{display:flex;flex-wrap:wrap;align-items:flex-end}._formRow_qmafr_341>*:not(:last-child){margin-right:20px}

package/dist/assets/form-row.78983423.js

@@ -0,0 +1 @@
+import{j as s}from"./jsx-runtime.bc0b5389.js";const e="_formRow_qmafr_341",t={formRow:e},r=({children:o})=>s.exports.jsx("div",{className:t.formRow,children:o});try{r.displayName="FormRow",r.__docgenInfo={description:"",displayName:"FormRow",props:{}}}catch{}export{r as F};

package/dist/assets/form.stories.f11fed32.js

@@ -0,0 +1,49 @@
+import{j as e}from"./jsx-runtime.bc0b5389.js";import{D as W}from"./disabled-context.47d44ea4.js";import{F as t}from"./field.34841a80.js";import{I as c}from"./input.c3176058.js";import{S as x}from"./select.0c940187.js";import{C as A}from"./check-box.fe165636.js";import{B as G}from"./button-group.db95fc8a.js";import{B as N}from"./button.4d73be0d.js";import{T as _}from"./toggle.ba9d43b4.js";import{I as V}from"./input-group.655922b4.js";import{I as b}from"./input-group-addon.d746d2dd.js";import{S as E}from"./slider.295b80b6.js";import{T as U}from"./textarea.61ee0223.js";import{R as $}from"./radio-button.581bf0f0.js";import{M as q}from"./actions.310c4239.js";import{F as z}from"./form-row.78983423.js";import{T as H}from"./common-enum.04de2059.js";import{M as g}from"./enum.9003e5cc.js";import"./index.8c7046c4.js";import"./index.55214191.js";import"./label.71b4dc9a.js";import"./help-icon.8deae1d5.js";import"./tooltip.47b8435e.js";import"./index.cb615f32.js";import"./icon.86155bc3.js";import"./inheritsLoose.5387fada.js";import"./index.73b4811b.js";import"./types.f0417c6d.js";import"./lodash.96de7017.js";import"./extends.946277fc.js";import"./assertThisInitialized.962dde02.js";import"./memoize-one.esm.7a54f149.js";import"./text.3e08313f.js";import"./select.input.395daa83.js";import"./spinner.f0fdc45e.js";import"./objectSpread2.62d3bde3.js";import"./index.eeb00e59.js";import"./badge.c60b26e4.js";const Be={title:"Forms/Layout",argTypes:{labelWidth:"text"},args:{small:!1,row:!1,labelLeft:!1,labelWidth:void 0,disabled:!1}},v=l=>{const{small:o,labelLeft:r,labelWidth:s}=l;return e.exports.jsxs(e.exports.Fragment,{children:[e.exports.jsx(t,{label:"Input",helpText:"Some help text",labelLeft:r,labelWidth:s,children:e.exports.jsx(c,{value:"Value",small:o})}),e.exports.jsx(t,{label:"TextArea",helpText:"Some very long help text that needs to have its width constrained so it doesn't look silly",helpTextMaxWidth:200,labelLeft:r,labelWidth:s,children:e.exports.jsx(U,{value:"Value"})}),e.exports.jsx(t,{label:"Select (native)",labelLeft:r,labelWidth:s,children:e.exports.jsx(x,{options:[{label:"Option 1",value:"1"},{label:"Option 2",value:"2"}],value:{label:"Option 2",value:"2"},native:!0,small:o,width:"auto"})}),e.exports.jsx(t,{label:"Select (custom)",labelLeft:r,labelWidth:s,children:e.exports.jsx(x,{options:[{label:"Option 1",value:"1"},{label:"Option 2",value:"2"}],value:{label:"Option 2",value:"2"},small:o,width:"auto"})}),e.exports.jsx(t,{label:"Select (multi)",labelLeft:r,labelWidth:s,children:e.exports.jsx(x,{options:[{label:"Option 1",value:"1"},{label:"Option 2",value:"2"}],value:[{label:"Option 1",value:"1"},{label:"Option 2",value:"2"}],small:o})}),e.exports.jsx(t,{label:"Slider",labelLeft:r,labelWidth:s,children:e.exports.jsx(E,{name:"example",label:"Number of aardvarks",value:35,min:0,max:100,step:1,onChange:()=>{},showArrows:!0,showTooltip:!0,small:o})}),e.exports.jsx(t,{label:"ButtonGroup",labelLeft:r,labelWidth:s,children:e.exports.jsx(G,{items:[{key:"0",label:"Option 1",value:"1"},{key:"1",label:"Option 2",value:"2"}],value:0,small:o})}),e.exports.jsx(t,{label:"InputGroup",labelLeft:r,labelWidth:s,children:e.exports.jsxs(V,{small:o,children:[e.exports.jsx(b,{children:"$"}),e.exports.jsx(c,{name:"example",value:"123",onChange:()=>{}}),e.exports.jsx(b,{children:"each"})]})}),e.exports.jsx(t,{label:"Menu",labelLeft:r,labelWidth:s,children:e.exports.jsx(q,{menu:{label:"Menu",trigger:H.DROP_DOWN_BUTTON,sections:[{type:g.OPTION,label:"Lorem"},{type:g.OPTION,label:"Ipsum"}],small:o}})}),e.exports.jsx(t,{label:"CheckBox",labelLeft:r,labelWidth:s,children:e.exports.jsx(A,{label:"CheckBox",checked:!0,small:o,onChange:()=>{}})}),e.exports.jsx(t,{label:"RadioButton",labelLeft:r,labelWidth:s,children:e.exports.jsx($,{options:[{label:"Aardvarks",value:"termites"},{label:"Monkeys",value:"bananas"}],value:{label:"Monkeys",value:"bananas"},inline:!0,small:o})}),e.exports.jsx(t,{label:"Toggle",labelLeft:r,labelWidth:s,children:e.exports.jsx(_,{label:"Toggle",checked:!0,onChange:()=>{},small:o})}),e.exports.jsx(t,{labelLeft:r,labelWidth:s,children:e.exports.jsx(N,{colored:!0,label:"Button",onClick:()=>{},small:o})})]})},a=l=>{const{row:o,disabled:r}=l;return e.exports.jsx(W.Provider,{value:r,children:o?e.exports.jsx(z,{children:v(l)}):v(l)})},u=a.bind({}),n=a.bind({});n.args={small:!0};const i=a.bind({});i.args={labelLeft:!0,labelWidth:100};const d=a.bind({});d.args={row:!0};const p=a.bind({});p.args={row:!0,small:!0};const m=a.bind({});m.args={disabled:!0};var h,w,j;u.parameters={...u.parameters,docs:{...(h=u.parameters)==null?void 0:h.docs,source:{originalSource:`args => {
+  const {
+    row,
+    disabled
+  } = args;
+  return <DisabledContext.Provider value={disabled}>
+      {row ? <FormRow>{renderFields(args)}</FormRow> : renderFields(args)}
+    </DisabledContext.Provider>;
+}`,...(j=(w=u.parameters)==null?void 0:w.docs)==null?void 0:j.source}}};var f,F,C;n.parameters={...n.parameters,docs:{...(f=n.parameters)==null?void 0:f.docs,source:{originalSource:`args => {
+  const {
+    row,
+    disabled
+  } = args;
+  return <DisabledContext.Provider value={disabled}>
+      {row ? <FormRow>{renderFields(args)}</FormRow> : renderFields(args)}
+    </DisabledContext.Provider>;
+}`,...(C=(F=n.parameters)==null?void 0:F.docs)==null?void 0:C.source}}};var O,R,T;i.parameters={...i.parameters,docs:{...(O=i.parameters)==null?void 0:O.docs,source:{originalSource:`args => {
+  const {
+    row,
+    disabled
+  } = args;
+  return <DisabledContext.Provider value={disabled}>
+      {row ? <FormRow>{renderFields(args)}</FormRow> : renderFields(args)}
+    </DisabledContext.Provider>;
+}`,...(T=(R=i.parameters)==null?void 0:R.docs)==null?void 0:T.source}}};var D,S,P;d.parameters={...d.parameters,docs:{...(D=d.parameters)==null?void 0:D.docs,source:{originalSource:`args => {
+  const {
+    row,
+    disabled
+  } = args;
+  return <DisabledContext.Provider value={disabled}>
+      {row ? <FormRow>{renderFields(args)}</FormRow> : renderFields(args)}
+    </DisabledContext.Provider>;
+}`,...(P=(S=d.parameters)==null?void 0:S.docs)==null?void 0:P.source}}};var k,y,B;p.parameters={...p.parameters,docs:{...(k=p.parameters)==null?void 0:k.docs,source:{originalSource:`args => {
+  const {
+    row,
+    disabled
+  } = args;
+  return <DisabledContext.Provider value={disabled}>
+      {row ? <FormRow>{renderFields(args)}</FormRow> : renderFields(args)}
+    </DisabledContext.Provider>;
+}`,...(B=(y=p.parameters)==null?void 0:y.docs)==null?void 0:B.source}}};var I,L,M;m.parameters={...m.parameters,docs:{...(I=m.parameters)==null?void 0:I.docs,source:{originalSource:`args => {
+  const {
+    row,
+    disabled
+  } = args;
+  return <DisabledContext.Provider value={disabled}>
+      {row ? <FormRow>{renderFields(args)}</FormRow> : renderFields(args)}
+    </DisabledContext.Provider>;
+}`,...(M=(L=m.parameters)==null?void 0:L.docs)==null?void 0:M.source}}};const Ie=["Default","Small","LabelsOnLeft","Row","SmallRow","DisabledWithContext"];export{u as Default,m as DisabledWithContext,i as LabelsOnLeft,d as Row,n as Small,p as SmallRow,Ie as __namedExportsOrder,Be as default};

package/dist/assets/formation.stories.2f7b0e86.js

@@ -0,0 +1,74 @@
+import{j as e}from"./jsx-runtime.bc0b5389.js";import{r as c}from"./index.8c7046c4.js";import{T as d}from"./top-bar.d067e7e6.js";import{S as x}from"./side-bar.38b8fdc1.js";import{H as g}from"./heading.d8accca2.js";import{P as v}from"./page.0fb98747.js";import{R as h,C as r}from"./row.1d0d4b93.js";import{S as b}from"./spacer.17f9f9e6.js";import{T as f}from"./tabs.408b21fe.js";import{T as j}from"./table.34589fe4.js";import"./index.55214191.js";import"./button.4d73be0d.js";import"./spinner.f0fdc45e.js";import"./disabled-context.47d44ea4.js";import"./icon.86155bc3.js";import"./inheritsLoose.5387fada.js";import"./index.73b4811b.js";import"./tooltip.47b8435e.js";import"./index.cb615f32.js";import"./common-enum.04de2059.js";import"./actions.310c4239.js";import"./lodash.96de7017.js";import"./enum.9003e5cc.js";import"./badge.c60b26e4.js";import"./types.f0417c6d.js";import"./index.eeb00e59.js";import"./drawer.cd7dde21.js";import"./help-icon.8deae1d5.js";import"./styled-components.browser.esm.611ca86c.js";import"./hoist-non-react-statics.cjs.10bac274.js";import"./select.input.395daa83.js";import"./index.es.5a055fee.js";import"./extends.946277fc.js";import"./redux.afc48bf2.js";import"./objectSpread2.62d3bde3.js";import"./memoize-one.esm.7a54f149.js";import"./pagination.4f19f4f6.js";import"./select.0c940187.js";import"./assertThisInitialized.962dde02.js";import"./text.3e08313f.js";import"./input.c3176058.js";import"./input-group.655922b4.js";import"./input-group-addon.d746d2dd.js";import"./number-input.9aea4872.js";import"./index.cb879655.js";import"./check-box.fe165636.js";import"./slider.295b80b6.js";import"./popover.deb1280b.js";const T=()=>e.exports.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",background:"rgba(0,0,0,0.05)",height:"100%",minHeight:400,textAlign:"center"},children:["CHART ",e.exports.jsx("br",{}),"(fills height, minHeight 400px)"]}),ve={title:"Layout/Layout Examples",parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:400}}}},t=()=>{const o=[{label:"Monkeys",value:"monkeys"},{label:"Bananas",value:"bananas"},{label:"Squirrels",value:"squirrels"},{label:"Pomegranates",value:"pomegranates"}],[i,m]=c.exports.useState(o[0]);return e.exports.jsxs(e.exports.Fragment,{children:[e.exports.jsx(d,{}),e.exports.jsx(x,{options:{title:"",sections:[]}}),e.exports.jsxs(v,{padding:"16px 20px",scroll:!0,children:[e.exports.jsx(g,{top:!0,marginBottom:0,children:"Formation Inputs"}),e.exports.jsx(f,{margin:!1,options:o,value:i,onChange:n=>{const{value:p,label:u}=n.target;m({value:p,label:u})}}),e.exports.jsx(b,{height:20}),e.exports.jsxs(h,{flex:!0,children:[e.exports.jsx(r,{width:400,children:e.exports.jsx(j,{table:{headers:[{cells:[{value:"Name"},{value:"Origin"}]}],rows:[{cells:[{value:"Brown rice"},{value:"Vietnam"}]},{cells:[{value:"Buckwheat"},{value:"Poland"}]},{cells:[{value:"Couscous"},{value:"France"}]}]}})}),e.exports.jsx(r,{children:e.exports.jsx(T,{})})]})]})]})};var a,s,l;t.parameters={...t.parameters,docs:{...(a=t.parameters)==null?void 0:a.docs,source:{originalSource:`() => {
+  const options = [{
+    label: 'Monkeys',
+    value: 'monkeys'
+  }, {
+    label: 'Bananas',
+    value: 'bananas'
+  }, {
+    label: 'Squirrels',
+    value: 'squirrels'
+  }, {
+    label: 'Pomegranates',
+    value: 'pomegranates'
+  }];
+  const [selectedTab, setSelectedTab] = useState(options[0]);
+  return <>
+      <TopBar />
+      <SideBar options={{
+      title: '',
+      sections: []
+    }} />
+      <Page padding="16px 20px" scroll>
+        <Heading top marginBottom={0}>
+          Formation Inputs
+        </Heading>
+        <Tabs margin={false} options={options} value={selectedTab} onChange={evt => {
+        const {
+          value,
+          label
+        } = evt.target;
+        setSelectedTab({
+          value,
+          label
+        });
+      }} />
+        <Spacer height={20} />
+        <Row flex>
+          <Column width={400}>
+            <Table table={{
+            headers: [{
+              cells: [{
+                value: 'Name'
+              }, {
+                value: 'Origin'
+              }]
+            }],
+            rows: [{
+              cells: [{
+                value: 'Brown rice'
+              }, {
+                value: 'Vietnam'
+              }]
+            }, {
+              cells: [{
+                value: 'Buckwheat'
+              }, {
+                value: 'Poland'
+              }]
+            }, {
+              cells: [{
+                value: 'Couscous'
+              }, {
+                value: 'France'
+              }]
+            }]
+          }} />
+          </Column>
+          <Column>
+            <ChartPlaceholder />
+          </Column>
+        </Row>
+      </Page>
+    </>;
+}`,...(l=(s=t.parameters)==null?void 0:s.docs)==null?void 0:l.source}}};t.__docgenInfo={description:"",methods:[],displayName:"Formation"};const he=["Formation"];export{t as Formation,he as __namedExportsOrder,ve as default};