@oliasoft-open-source/react-ui-library 4.0.0-beta-40 → 4.0.0-beta-41

package/dist/storybook/assets/table.stories-e859a65a.js

@@ -0,0 +1,581 @@
+import{j as c}from"./jsx-runtime-f961835c.js";import{r as S}from"./index-f80c8c95.js";import{f as K}from"./immer.esm-5c06d4d0.js";import{l as ae}from"./lodash-75c70a11.js";import{T}from"./table-43e92fcb.js";import{C as Ge}from"./card-2de0de0b.js";import{I as ee}from"./input-8db939f4.js";import{F as ne}from"./field-69d1c5f6.js";import{H as Je}from"./heading-5eb5ea78.js";import{t as Y,a as Xe,b as Ye,c as Ze,d as en,e as nn,f as tn,g as an}from"./table.stories-data-c68bf7bd.js";import"./index-a80ed1cf.js";import"./index.es-2e8c1ff9.js";import"./inheritsLoose-d4851ab8.js";import"./redux-10ee6be7.js";import"./objectSpread2-fdee9b6d.js";import"./hoist-non-react-statics.cjs-cd4c875b.js";import"./index-3d476d02.js";import"./memoize-one.esm-52518564.js";import"./icon-6cfc6944.js";import"./index-c89a1915.js";import"./disabled-context-d654f6ff.js";import"./actions-3e8ee8ec.js";import"./common-types-3a5f9d98.js";import"./button-9027cb35.js";import"./spinner-cb92a546.js";import"./tooltip-23e84186.js";import"./types-cc224262.js";import"./types-332ceaf3.js";import"./badge-1615fbe5.js";import"./pagination-0755df3d.js";import"./select-b35e468b.js";import"./assertThisInitialized-081f9914.js";import"./text-ad1f5f1d.js";import"./select.input-88b6ebab.js";import"./input-group-9ddeb24a.js";import"./input-group-addon-63147930.js";import"./number-input-11543c86.js";import"./index-54f0d271.js";import"./check-box-24c24273.js";import"./help-icon-6216ea0b.js";import"./slider-493c7d12.js";import"./index-c7f280f6.js";import"./popover-64e44a17.js";import"./label-92aaba2c.js";import"./flex-47732c42.js";const Jn={title:"Basic/Table",component:T,args:{table:{...Y}}},I=h=>c.jsx(T,{...h}),B=I.bind({}),N=I.bind({});N.args={table:{...Y,fixedWidth:"400px"}};const M=I.bind({});M.args={table:{...Y,fixedWidth:"auto"}};const O=I.bind({});O.args={table:Xe};O.parameters={docs:{description:{story:"Use sparingly when certain columns cannot be below a certain width. Unless the Table is auto width, set one column to `auto` to use remaining space."}}};const Q=I.bind({});Q.args={table:Ye};const W=I.bind({});W.args={table:Ze};W.parameters={docs:{description:{story:"This is only required when you need to override `columnAlignment` in header cells (i.e. they have different alignment)"}}};const _=I.bind({});_.args={table:en};const U=I.bind({});U.args={table:nn};U.decorators=[h=>c.jsx("div",{style:{position:"absolute",inset:0,padding:"var(--padding)"},children:c.jsx(h,{})})];const E=I.bind({});E.args={table:tn};E.parameters={docs:{description:{story:"If a `maxHeight` is set, the table should only fill that height if it needs to."}}};const L=I.bind({});L.args={table:an};const q=()=>c.jsx(Ge,{heading:c.jsx(Je,{children:"Card heading"}),padding:!1,children:c.jsx(T,{table:{...Y,bordered:!1}})});q.parameters={docs:{source:{type:"dynamic"}}};const z=()=>{const h=["Section","Width","Height"];let m=["","m","m"],o=[...Array(175).keys()].map((a,n)=>[n,n*2,n*2]);const k=(a,n,s)=>a==="m"&&n==="ft"?s*3.28084:a==="ft"&&n==="m"?s/3.28084:s,l=(a,n,s,u)=>{o[n][s]=a.target.value,u()},C=a=>{o=o.concat([["","",""]]),a()},A=(a,n)=>{o=o.filter((s,u)=>u!==a),n()},d=(a,n,s)=>{const u=m[n],y=a.target.value;m=m.map((R,b)=>b===n?y:R),o=o.map(R=>R.map((b,g)=>g===n?k(u,y,b):b)),s()},p=()=>{const a=[{label:"10 / page",value:10},{label:"20 / page",value:20},{label:"50 / page",value:50},{label:"Show all",value:0}],[n,s]=S.useState(10),[u,y]=S.useState(1),[R,b]=S.useState(!1),g=()=>{b(!R)},F=()=>{const e=Math.ceil(o.length/n);y(e)},D=(u-1)*n,t=n===0?o.length-1:D+n,i={headers:[{cells:h.map(e=>({value:e})),actions:[{primary:!0,label:"Add",icon:"add",onClick:()=>{C(g),F()}}]},{cells:[{},{options:[{label:"m",value:"m"},{label:"ft",value:"ft"}],value:m[1],type:"Select",native:!0,onChange:e=>d(e,1,g)},{options:[{label:"m",value:"m"},{label:"ft",value:"ft"}],value:m[2],type:"Select",native:!0,onChange:e=>d(e,2,g)}]}],rows:o.slice(D,t).map((e,r)=>{const x=D+r;return{cells:[...Array(3).keys()].map((f,w)=>({value:e[w],type:"Input",onChange:P=>l(P,x,w,g)})),actions:[{label:"Delete",icon:"minus",onClick:()=>A(x,g)}]}}),footer:{pagination:{rowCount:o.length,selectedPage:u,rowsPerPage:{onChange:e=>{const{value:r}=e.target;s(Number(r))},options:a,value:n},onSelectPage:e=>y(e),small:!0}}};return c.jsx(T,{table:i})};return c.jsx(p,{})},G=()=>{const h=["Section","Width","Height"];let m=[...Array(175).keys()].map((k,l)=>({Section:l,Width:l*2,Height:l*2}));const o=()=>{const k=[{label:"10 / page",value:10},{label:"20 / page",value:20},{label:"50 / page",value:50},{label:"Show all",value:0}],[l,C]=S.useState(10),[A,d]=S.useState(1),[p,a]=S.useState({}),[n,s]=S.useState({});S.useEffect(()=>{d(1)},[p,n]);const u=(A-1)*l,y=l===0?m.length-1:u+l,R=(e,r,x)=>e.filter(f=>Object.keys(r).every(w=>r[w]===""?!0:f[w].toString().includes(r[w]))).sort((f,w)=>Object.entries(x).map(([P,j])=>{switch(j){case"up":return f[P]-w[P];case"down":return w[P]-f[P];default:return 0}}).reduce((P,j)=>P||j,0)),b=(e,r,x,f,w)=>{const P=e.map(v=>{const V=Object.keys(f).includes(v)?f[v]:"",H=`${v[0].toUpperCase()}${v.slice(1)}`;return{key:v,value:H,hasSort:!0,sort:V,onSort:()=>{const $=V===""?"up":V==="up"?"down":"";w({...f,[v]:$})}}}),j=e.map(v=>{const V=Object.keys(r).includes(v)?r[v]:"";return{key:v,value:V,type:"Input",placeholder:"Filter",onChange:H=>x({...r,[v]:H.target.value})}});return{dataSortCells:P,dataFilterCells:j}},{dataSortCells:g,dataFilterCells:F}=b(h,p,a,n,s),D=R(m,p,n),t=[...D.slice(u,y).map(e=>({cells:Object.entries(e).map(([x,f])=>({key:x,value:f,type:"Input",disabled:!0}))}))],i={headers:[{cells:g},{cells:F}],rows:t,footer:{pagination:{rowCount:D.length,selectedPage:A,rowsPerPage:{onChange:e=>{const{value:r}=e.target;C(Number(r))},options:k,value:l},onSelectPage:e=>d(e),small:!0}}};return c.jsx(T,{table:i})};return c.jsx(o,{})},J=()=>{const h={tea:3.6,coffee:3.2,orange:4.1},m=[{label:"Tea",value:"tea"},{label:"Coffee",value:"coffee"},{label:"Orange juice",value:"orange"}],o={cells:[{type:"Select",options:m,value:{value:"tea"}},{type:"Input"},{type:"Static"}]},k=[...Array(15).keys()].map((t,i)=>({cells:[{type:"Select",options:m,value:{value:"tea"}},{type:"Input",value:i+1},{type:"Static"}]})),[l,C]=S.useState(k),A=[{label:"10 / page",value:10},{label:"20 / page",value:20},{label:"50 / page",value:50},{label:"Show all",value:0}],[d,p]=S.useState(10),[a,n]=S.useState(1),s=(a-1)*d,u=d===0?l.length-1:s+d,y=({newRow:t}={})=>{const i=K(l,e=>{e.push(t??o)});C(i)},R=({rowIndex:t})=>{const i=K(l,e=>{delete e[t]}).filter(e=>e);C(i)},b=({rowIndex:t,value:i})=>{const e=K(l,r=>{r[t].cells[0].value.value=i});C(e)},g=({rowIndex:t,value:i})=>{const e=K(l,r=>{r[t].cells[1].value=i});C(e)},F=({value:t})=>{const i=Number(t);return!ae.isNaN(i)&&ae.isInteger(i)&&i>0},D=l.slice(s,u).map((t,i)=>{const e=s+i;return l.length-1,{...t,cells:t==null?void 0:t.cells.map((r,x)=>{var v,V,H,$,te;const f=(H=(V=(v=t==null?void 0:t.cells)==null?void 0:v[0])==null?void 0:V.value)==null?void 0:H.value,w=Number((te=($=t==null?void 0:t.cells)==null?void 0:$[1])==null?void 0:te.value),P=h==null?void 0:h[f],j=P&&F({value:w})?(P*w).toFixed(2):null;if(x===0)return{...r,onChange:Z=>b({rowIndex:e,value:Z.target.value})};if(x===1)return{...r,onChange:Z=>g({rowIndex:e,value:Z.target.value}),error:F({value:r.value})?null:"Must be valid whole number"};if(x===2)return{...r,value:j}}),actions:[{label:"Delete",icon:"minus",onClick:()=>R({rowIndex:e})}]}});return c.jsx(T,{table:{defaultEmptyRow:o,onAddRow:y,columnAlignment:["left","right","right"],headers:[{cells:[{value:"Drink"},{value:"Quantity"},{value:"Total Price (£)"}],actions:[{primary:!0,icon:"plus",label:"Add",onClick:()=>y()}]}],rows:D,footer:{pagination:{rowCount:l.length,selectedPage:a,rowsPerPage:{onChange:t=>{const{value:i}=t.target;p(Number(i))},options:A,value:d},onSelectPage:t=>n(t),small:!0}}}})},X=()=>{const h=["Section","Width","Height"];let m=Array.from(Array(10),(d,p)=>[p,p*2,p*2]);const[o,k]=S.useState({pastedValues:"",rowIndex:0,cellIndex:0}),l=(d,p,a,n)=>{m[p][a]=Number(d.target.value),n()},C=(d,p,a,n)=>{var u;let s=((u=d==null?void 0:d.clipboardData)==null?void 0:u.getData("text"))??"";return k({rowIndex:p,cellIndex:a,pastedValues:s}),n(),{pastedData:o}},A=()=>{const[d,p]=S.useState(!1),a=()=>{p(!d)},n={headers:[{cells:h.map(s=>({value:s}))}],rows:m.map((s,u)=>{const y=u;return{cells:[...Array(3).keys()].map((R,b)=>({value:s[b],type:"Input",onChange:g=>l(g,y,b,a),onPaste:g=>C(g,y,b,a)}))}})};return c.jsxs(c.Fragment,{children:[c.jsx(T,{table:n}),c.jsx(ne,{label:"Pasted Data",children:c.jsx(ee,{value:o.pastedValues})}),c.jsx(ne,{label:"At Row",children:c.jsx(ee,{value:o.rowIndex})}),c.jsx(ne,{label:"At Cell Index",children:c.jsx(ee,{value:o.cellIndex})})]})};return c.jsx(A,{})};var re,se,oe;B.parameters={...B.parameters,docs:{...(re=B.parameters)==null?void 0:re.docs,source:{originalSource:`args => {
+  return <Table
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(oe=(se=B.parameters)==null?void 0:se.docs)==null?void 0:oe.source}}};var le,ie,ce;N.parameters={...N.parameters,docs:{...(le=N.parameters)==null?void 0:le.docs,source:{originalSource:`args => {
+  return <Table
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(ce=(ie=N.parameters)==null?void 0:ie.docs)==null?void 0:ce.source}}};var de,ue,pe;M.parameters={...M.parameters,docs:{...(de=M.parameters)==null?void 0:de.docs,source:{originalSource:`args => {
+  return <Table
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(pe=(ue=M.parameters)==null?void 0:ue.docs)==null?void 0:pe.source}}};var ge,me,be;O.parameters={...O.parameters,docs:{...(ge=O.parameters)==null?void 0:ge.docs,source:{originalSource:`args => {
+  return <Table
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(be=(me=O.parameters)==null?void 0:me.docs)==null?void 0:be.source}}};var we,ve,he;Q.parameters={...Q.parameters,docs:{...(we=Q.parameters)==null?void 0:we.docs,source:{originalSource:`args => {
+  return <Table
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(he=(ve=Q.parameters)==null?void 0:ve.docs)==null?void 0:he.source}}};var ye,fe,Pe;W.parameters={...W.parameters,docs:{...(ye=W.parameters)==null?void 0:ye.docs,source:{originalSource:`args => {
+  return <Table
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Pe=(fe=W.parameters)==null?void 0:fe.docs)==null?void 0:Pe.source}}};var Se,xe,Ce;_.parameters={..._.parameters,docs:{...(Se=_.parameters)==null?void 0:Se.docs,source:{originalSource:`args => {
+  return <Table
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Ce=(xe=_.parameters)==null?void 0:xe.docs)==null?void 0:Ce.source}}};var Re,Ie,ke;U.parameters={...U.parameters,docs:{...(Re=U.parameters)==null?void 0:Re.docs,source:{originalSource:`args => {
+  return <Table
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(ke=(Ie=U.parameters)==null?void 0:Ie.docs)==null?void 0:ke.source}}};var Ae,De,Ve;E.parameters={...E.parameters,docs:{...(Ae=E.parameters)==null?void 0:Ae.docs,source:{originalSource:`args => {
+  return <Table
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Ve=(De=E.parameters)==null?void 0:De.docs)==null?void 0:Ve.source}}};var je,Te,Fe;L.parameters={...L.parameters,docs:{...(je=L.parameters)==null?void 0:je.docs,source:{originalSource:`args => {
+  return <Table
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  {...args} />;
+}`,...(Fe=(Te=L.parameters)==null?void 0:Te.docs)==null?void 0:Fe.source}}};var He,Oe,We;q.parameters={...q.parameters,docs:{...(He=q.parameters)==null?void 0:He.docs,source:{originalSource:`() => <Card heading={<Heading>Card heading</Heading>} padding={false}>
+    <Table table={({
+    ...storyData.table,
+    bordered: false
+  } as any)} />
+  </Card>`,...(We=(Oe=q.parameters)==null?void 0:Oe.docs)==null?void 0:We.source}}};var Ue,Ee,Ne;z.parameters={...z.parameters,docs:{...(Ue=z.parameters)==null?void 0:Ue.docs,source:{originalSource:`() => {
+  /*
+    Mock table data store (real apps should use Redux or similar)
+  */
+  const headings = ['Section', 'Width', 'Height'];
+  let units = ['', 'm', 'm'];
+  let data = [...Array(175).keys()].map((c, i) => [i, i * 2, i * 2]);
+  /*
+    Mock table data actions (real apps should use Redux or similar)
+  */
+  const convertUnit = (fromUnit: any, toUnit: any, value: any) => {
+    return fromUnit === 'm' && toUnit === 'ft' ? value * 3.28084 : fromUnit === 'ft' && toUnit === 'm' ? value / 3.28084 : value;
+  };
+  const onChangeValue = (evt: any, rowIndex: any, cellIndex: any, render: any) => {
+    data[rowIndex][cellIndex] = evt.target.value;
+    render();
+  };
+  const onAddRow = (render: any) => {
+    data = data.concat(([['', '', '']] as any));
+    render();
+  };
+  const onDeleteRow = (rowIndex: any, render: any) => {
+    data = data.filter((r, i) => i !== rowIndex);
+    render();
+  };
+  const onChangeUnit = (evt: any, columnIndex: any, render: any) => {
+    const fromUnit = units[columnIndex];
+    const toUnit = evt.target.value;
+    units = units.map((u, i) => i === columnIndex ? toUnit : u);
+    data = data.map(r => r.map((c, i) => i === columnIndex ? convertUnit(fromUnit, toUnit, c) : c));
+    render();
+  };
+  /*
+    Container component manages state and configuration of table
+  */
+  const ManagedTable = () => {
+    const rowsPerPageOptions = [{
+      label: '10 / page',
+      value: 10
+    }, {
+      label: '20 / page',
+      value: 20
+    }, {
+      label: '50 / page',
+      value: 50
+    }, {
+      label: 'Show all',
+      value: 0
+    }];
+    const [rowsPerPage, setRowsPerPage] = useState(10);
+    const [selectedPage, setSelectedPage] = useState(1);
+    //hack to make Storybook re-render after event handlers alter data
+    //only using this because example does not manage data with Redux / props
+    const [toggle, forceRender] = useState(false);
+    const render = () => {
+      forceRender(!toggle);
+    };
+    const goToLastPage = () => {
+      const lastPage = Math.ceil(data.length / rowsPerPage);
+      setSelectedPage(lastPage);
+    };
+    const firstVisibleRow = (selectedPage - 1) * rowsPerPage;
+    const lastVisibleRow = rowsPerPage === 0 ? data.length - 1 : firstVisibleRow + rowsPerPage;
+    const table = {
+      headers: [{
+        cells: headings.map(h => ({
+          value: h
+        })),
+        actions: [{
+          primary: true,
+          label: 'Add',
+          icon: 'add',
+          onClick: () => {
+            onAddRow(render);
+            goToLastPage();
+          }
+        }]
+      }, {
+        cells: [{}, {
+          options: [{
+            label: 'm',
+            value: 'm'
+          }, {
+            label: 'ft',
+            value: 'ft'
+          }],
+          value: units[1],
+          type: 'Select',
+          native: true,
+          onChange: (evt: any) => onChangeUnit(evt, 1, render)
+        }, {
+          options: [{
+            label: 'm',
+            value: 'm'
+          }, {
+            label: 'ft',
+            value: 'ft'
+          }],
+          value: units[2],
+          type: 'Select',
+          native: true,
+          onChange: (evt: any) => onChangeUnit(evt, 2, render)
+        }]
+      }],
+      rows: data.slice(firstVisibleRow, lastVisibleRow).map((row, i) => {
+        const rowIndex = firstVisibleRow + i;
+        return {
+          cells: [...Array(3).keys()].map((c, i) => ({
+            //https://stackoverflow.com/a/33352604
+            value: row[i],
+            type: 'Input',
+            onChange: (evt: any) => onChangeValue(evt, rowIndex, i, render)
+          })),
+          actions: [{
+            label: 'Delete',
+            icon: 'minus',
+            onClick: () => onDeleteRow(rowIndex, render)
+          }]
+        };
+      }),
+      footer: {
+        pagination: {
+          rowCount: data.length,
+          selectedPage,
+          rowsPerPage: {
+            onChange: (evt: any) => {
+              const {
+                value
+              } = evt.target;
+              setRowsPerPage(Number(value));
+            },
+            options: rowsPerPageOptions,
+            value: rowsPerPage
+          },
+          onSelectPage: (evt: any) => setSelectedPage(evt),
+          small: true
+        }
+      }
+    };
+    return <Table table={(table as any)} />;
+  };
+  return <ManagedTable />;
+}`,...(Ne=(Ee=z.parameters)==null?void 0:Ee.docs)==null?void 0:Ne.source}}};var Me,Qe,_e;G.parameters={...G.parameters,docs:{...(Me=G.parameters)==null?void 0:Me.docs,source:{originalSource:`() => {
+  /*
+    Mock table data store (real apps should use Redux or similar)
+  */
+  const headings = ['Section', 'Width', 'Height'];
+  let keyedData = [...Array(175).keys()].map((_c, i) => ({
+    Section: i,
+    Width: i * 2,
+    Height: i * 2
+  }));
+  /*
+        Container component manages state and configuration of table
+      */
+  const TableWithSortAndFilter: StoryFn<any> = () => {
+    const rowsPerPageOptions = [{
+      label: '10 / page',
+      value: 10
+    }, {
+      label: '20 / page',
+      value: 20
+    }, {
+      label: '50 / page',
+      value: 50
+    }, {
+      label: 'Show all',
+      value: 0
+    }];
+    const [rowsPerPage, setRowsPerPage] = useState(10);
+    const [selectedPage, setSelectedPage] = useState(1);
+    const [filters, setFilters] = useState({});
+    const [sorts, setSorts] = useState({});
+    useEffect(() => {
+      setSelectedPage(1);
+    }, [filters, sorts]);
+    const firstVisibleRow = (selectedPage - 1) * rowsPerPage;
+    const lastVisibleRow = rowsPerPage === 0 ? keyedData.length - 1 : firstVisibleRow + rowsPerPage;
+    const filterAndSortDataRows = (dataRows: any, filters: any, sorts: any) => dataRows.filter((row: any) => Object.keys(filters).every(key => {
+      return filters[key] === '' ? true : row[key].toString().includes(filters[key]);
+    })).sort((a: any, b: any) => Object.entries(sorts).map(([key, value]) => {
+      switch (value) {
+        case 'up':
+          {
+            return a[key] - b[key];
+          }
+        case 'down':
+          {
+            return b[key] - a[key];
+          }
+        default:
+          return 0;
+      }
+    }).reduce((a, acc) => a || acc, 0));
+    const dataHeaders = (dataRowsKeys: any, filters: any, setFilters: any, sorts: any, setSorts: any) => {
+      const dataSortCells = dataRowsKeys.map((key: any) => {
+        const sort = Object.keys(sorts).includes(key) ? sorts[key] : '';
+        const prettifyHeaderValue = \`\${key[0].toUpperCase()}\${key.slice(1)}\`;
+        return {
+          key,
+          value: prettifyHeaderValue,
+          hasSort: true,
+          sort,
+          onSort: () => {
+            const newSort = sort === '' ? 'up' : sort === 'up' ? 'down' : '';
+            setSorts({
+              ...sorts,
+              [key]: newSort
+            });
+          }
+        };
+      });
+      const dataFilterCells = dataRowsKeys.map((key: any) => {
+        const filterValue = Object.keys(filters).includes(key) ? filters[key] : '';
+        return {
+          key,
+          value: filterValue,
+          type: 'Input',
+          placeholder: 'Filter',
+          onChange: (ev: any) => setFilters({
+            ...filters,
+            [key]: ev.target.value
+          })
+        };
+      });
+      return {
+        dataSortCells,
+        dataFilterCells
+      };
+    };
+    const {
+      dataSortCells,
+      dataFilterCells
+    } = dataHeaders(headings, filters, setFilters, sorts, setSorts);
+    const filteredAndSortedData = filterAndSortDataRows(keyedData, filters, sorts);
+    const dataRows = [...filteredAndSortedData.slice(firstVisibleRow, lastVisibleRow).map((dataRow: any) => {
+      const rowsCells = Object.entries(dataRow).map(([key, value]) => ({
+        key,
+        value,
+        type: 'Input',
+        disabled: true
+      }));
+      return {
+        cells: rowsCells
+      };
+    })];
+    const table = {
+      headers: [{
+        cells: dataSortCells
+      }, {
+        cells: dataFilterCells
+      }],
+      rows: dataRows,
+      footer: {
+        pagination: {
+          rowCount: filteredAndSortedData.length,
+          selectedPage,
+          rowsPerPage: {
+            onChange: (evt: any) => {
+              const {
+                value
+              } = evt.target;
+              setRowsPerPage(Number(value));
+            },
+            options: rowsPerPageOptions,
+            value: rowsPerPage
+          },
+          onSelectPage: (evt: any) => setSelectedPage(evt),
+          small: true
+        }
+      }
+    };
+    return <Table table={(table as any)} />;
+  };
+  return <TableWithSortAndFilter />;
+}`,...(_e=(Qe=G.parameters)==null?void 0:Qe.docs)==null?void 0:_e.source}}};var Le,qe,$e;J.parameters={...J.parameters,docs:{...(Le=J.parameters)==null?void 0:Le.docs,source:{originalSource:`() => {
+  const prices = {
+    tea: 3.6,
+    coffee: 3.2,
+    orange: 4.1
+  };
+  const drinks = [{
+    label: 'Tea',
+    value: 'tea'
+  }, {
+    label: 'Coffee',
+    value: 'coffee'
+  }, {
+    label: 'Orange juice',
+    value: 'orange'
+  }];
+  const defaultEmptyRow = {
+    cells: [{
+      type: 'Select',
+      options: drinks,
+      value: {
+        value: 'tea'
+      }
+    }, {
+      type: 'Input'
+    }, {
+      type: 'Static'
+    }]
+  };
+  const initialRows = [...Array(15).keys()].map((row, rowIndex) => ({
+    cells: [{
+      type: 'Select',
+      options: drinks,
+      value: {
+        value: 'tea'
+      }
+    }, {
+      type: 'Input',
+      value: rowIndex + 1
+    }, {
+      type: 'Static'
+    }]
+  }));
+  const [rows, setRows] = useState(initialRows);
+  const rowsPerPageOptions = [{
+    label: '10 / page',
+    value: 10
+  }, {
+    label: '20 / page',
+    value: 20
+  }, {
+    label: '50 / page',
+    value: 50
+  }, {
+    label: 'Show all',
+    value: 0
+  }];
+  const [rowsPerPage, setRowsPerPage] = useState(10);
+  const [selectedPage, setSelectedPage] = useState(1);
+  const firstVisibleRow = (selectedPage - 1) * rowsPerPage;
+  const lastVisibleRow = rowsPerPage === 0 ? rows.length - 1 : firstVisibleRow + rowsPerPage;
+  const onAddRow = ({
+    newRow
+  }: any = {}) => {
+    const nextRows = produce(rows, draft => {
+      draft.push(newRow ?? defaultEmptyRow);
+    });
+    setRows(nextRows);
+  };
+  const onDeleteRow = ({
+    rowIndex
+  }: any) => {
+    const nextRows = produce(rows, draft => {
+      delete draft[rowIndex];
+    }).filter(r => r);
+    setRows(nextRows);
+  };
+  const onChangeDrink = ({
+    rowIndex,
+    value
+  }: any) => {
+    const nextRows = produce(rows, draft => {
+      // @ts-ignore: write explicit reason
+      draft[rowIndex].cells[0].value.value = value;
+    });
+    setRows(nextRows);
+  };
+  const onChangeQuantity = ({
+    rowIndex,
+    value
+  }: any) => {
+    const nextRows = produce(rows, draft => {
+      draft[rowIndex].cells[1].value = value;
+    });
+    setRows(nextRows);
+  };
+  const validQuantity = ({
+    value
+  }: any) => {
+    const numericValue = Number(value);
+    return !isNaN(numericValue) && isInteger(numericValue) && numericValue > 0;
+  };
+  const hydratedRows = rows.slice(firstVisibleRow, lastVisibleRow).map((row, i) => {
+    const rowIndex = firstVisibleRow + i;
+    const isLastRow = rowIndex === rows.length - 1;
+    return {
+      ...row,
+      cells: row?.cells.map((cell, cellIndex) => {
+        const drink = (row?.cells?.[0]?.value as any)?.value;
+        const quantity = Number(row?.cells?.[1]?.value);
+        const drinkPrice = (prices as any)?.[drink];
+        const price = drinkPrice && validQuantity({
+          value: quantity
+        }) ? (drinkPrice * quantity).toFixed(2) : null;
+        if (cellIndex === 0) {
+          return {
+            ...cell,
+            onChange: (evt: any) => onChangeDrink({
+              rowIndex,
+              value: evt.target.value
+            })
+          };
+        } else if (cellIndex === 1) {
+          return {
+            ...cell,
+            onChange: (evt: any) => onChangeQuantity({
+              rowIndex,
+              value: evt.target.value
+            }),
+            error: !validQuantity({
+              value: cell.value
+            }) ? 'Must be valid whole number' : null
+          };
+        } else if (cellIndex === 2) {
+          return {
+            ...cell,
+            value: price
+          };
+        }
+      }),
+      actions: [{
+        label: 'Delete',
+        icon: 'minus',
+        onClick: () => onDeleteRow({
+          rowIndex
+        })
+      }]
+    };
+  });
+  return <Table table={({
+    defaultEmptyRow,
+    onAddRow,
+    columnAlignment: ['left', 'right', 'right'],
+    headers: [{
+      cells: [{
+        value: 'Drink'
+      }, {
+        value: 'Quantity'
+      }, {
+        value: 'Total Price (£)'
+      }],
+      actions: [{
+        primary: true,
+        icon: 'plus',
+        label: 'Add',
+        onClick: () => onAddRow()
+      }]
+    }],
+    rows: (hydratedRows as any),
+    footer: {
+      pagination: {
+        rowCount: rows.length,
+        selectedPage,
+        rowsPerPage: {
+          onChange: (evt: any) => {
+            const {
+              value
+            } = evt.target;
+            setRowsPerPage(Number(value));
+          },
+          options: rowsPerPageOptions,
+          value: rowsPerPage
+        },
+        onSelectPage: (evt: any) => setSelectedPage(evt),
+        small: true
+      }
+    }
+  } as any)} />;
+}`,...($e=(qe=J.parameters)==null?void 0:qe.docs)==null?void 0:$e.source}}};var Ke,Be,ze;X.parameters={...X.parameters,docs:{...(Ke=X.parameters)==null?void 0:Ke.docs,source:{originalSource:`() => {
+  const headings = ['Section', 'Width', 'Height'];
+  let data = Array.from(Array(10), (_, i) => [i, i * 2, i * 2]);
+  const [pastedData, setpastedData] = useState<PastedData>({
+    pastedValues: '',
+    rowIndex: 0,
+    cellIndex: 0
+  });
+  /*
+    Mock table data
+  */
+
+  const onChangeValue = (evt: ChangeEvent<HTMLInputElement>, rowIndex: number, cellIndex: number, render: TEmpty) => {
+    data[rowIndex][cellIndex] = Number(evt.target.value);
+    render();
+  };
+  const handleOnPaste = (evt: ClipboardEvent, rowIndex: number, cellIndex: number, render: TEmpty) => {
+    let pastedValues = evt?.clipboardData?.getData('text') ?? '';
+    setpastedData({
+      rowIndex,
+      cellIndex,
+      pastedValues
+    });
+    render();
+    return {
+      pastedData
+    };
+  };
+  /*
+    Container component manages state and configuration of table
+  */
+  const CallbackCellTable = () => {
+    //hack to make Storybook re-render after event handlers alter data
+    //only using this because example does not manage data with Redux / props
+    const [toggle, forceRender] = useState(false);
+    const render = () => {
+      forceRender(!toggle);
+    };
+    const table = {
+      headers: [{
+        cells: headings.map(h => ({
+          value: h
+        }))
+      }],
+      rows: data.map((row, i) => {
+        const rowIndex = i;
+        //row
+        return {
+          cells: [...Array(3).keys()].map((_, i) => ({
+            //https://stackoverflow.com/a/33352604
+            value: row[i],
+            type: 'Input',
+            onChange: (evt: ChangeEvent<HTMLInputElement>) => onChangeValue(evt, rowIndex, i, render),
+            onPaste: (evt: ClipboardEvent) => handleOnPaste(evt, rowIndex, i, render)
+          }))
+        };
+      })
+    };
+    return <>
+        <Table table={table} />
+        <Field label="Pasted Data">
+          <Input value={pastedData.pastedValues} />
+        </Field>
+        <Field label="At Row">
+          <Input value={pastedData.rowIndex} />
+        </Field>
+        <Field label="At Cell Index">
+          <Input value={pastedData.cellIndex} />
+        </Field>
+      </>;
+  };
+  return <CallbackCellTable />;
+}`,...(ze=(Be=X.parameters)==null?void 0:Be.docs)==null?void 0:ze.source}}};const Xn=["Default","FixedWidth","AutoWidth","ColumnWidths","ColumnAlignment","ColumnHeaderAlignment","InfiniteScrollFixedHeight","InfiniteScrollFullHeight","InfiniteScrollShort","InfiniteScrollWithDragAndDrop","InCard","Managed","ManagedWithFilterAndSort","AutoAddNewRow","OnPasteCallback"];export{J as AutoAddNewRow,M as AutoWidth,Q as ColumnAlignment,W as ColumnHeaderAlignment,O as ColumnWidths,B as Default,N as FixedWidth,q as InCard,_ as InfiniteScrollFixedHeight,U as InfiniteScrollFullHeight,E as InfiniteScrollShort,L as InfiniteScrollWithDragAndDrop,z as Managed,G as ManagedWithFilterAndSort,X as OnPasteCallback,Xn as __namedExportsOrder,Jn as default};

package/dist/storybook/assets/tabs-a69a771b.js

@@ -0,0 +1 @@
+import{j as n}from"./jsx-runtime-f961835c.js";import{r as R}from"./index-f80c8c95.js";import{c as V}from"./index-a80ed1cf.js";import{D as w}from"./disabled-context-d654f6ff.js";import{B as P}from"./badge-1615fbe5.js";import{s as F}from"./select.input-88b6ebab.js";const G="_tabs_12xfo_1",J="_padding_12xfo_7",K="_margin_12xfo_11",Q="_contentPadding_12xfo_14",U="_item_12xfo_17",W="_active_12xfo_38",X="_hidden_12xfo_57",Y="_disabled_12xfo_60",Z="_left_12xfo_64",ee="_right_12xfo_64",t={tabs:G,padding:J,margin:K,contentPadding:Q,item:U,active:W,hidden:X,disabled:Y,left:Z,right:ee},h=({label:e,url:o,hidden:d,disabled:u,active:l,onClick:g,right:v,invalid:b,badge:i,testId:c})=>{const y=getComputedStyle(document.body).getPropertyValue("--color-text-error");return n.jsx("a",{id:e==null?void 0:e.toString(),href:o,className:V(t.item,l?t.active:"",u?t.disabled:"",d&&!l?t.hidden:"",v?t.right:t.left),onClick:g,"data-testid":c,children:b?n.jsx(P,{small:!0,margin:"-4px",color:y,title:"!",children:e}):i?n.jsx(P,{small:!0,margin:"-4px",title:i==null?void 0:i.toString(),children:e}):e})};try{h.displayName="Label",h.__docgenInfo={description:"",displayName:"Label",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"TStringOrNumber"}},url:{defaultValue:null,description:"",name:"url",required:!1,type:{name:"string"}},hidden:{defaultValue:null,description:"",name:"hidden",required:!1,type:{name:"boolean"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},active:{defaultValue:null,description:"",name:"active",required:!1,type:{name:"boolean"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"((evt: MouseEvent<HTMLAnchorElement, MouseEvent>) => void)"}},right:{defaultValue:null,description:"",name:"right",required:!1,type:{name:"boolean"}},invalid:{defaultValue:null,description:"",name:"invalid",required:!1,type:{name:"boolean"}},badge:{defaultValue:null,description:"",name:"badge",required:!1,type:{name:"TStringOrNumber"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}}}}}catch{}const I=({children:e,activeTabIndex:o,contentPadding:d})=>Array.isArray(e)?n.jsx("div",{className:V(d?t.contentPadding:""),children:e.map((u,l)=>o===l&&u)}):null;try{I.displayName="Content",I.__docgenInfo={description:"",displayName:"Content",props:{activeTabIndex:{defaultValue:null,description:"",name:"activeTabIndex",required:!0,type:{name:"number"}},contentPadding:{defaultValue:null,description:"",name:"contentPadding",required:!1,type:{name:"boolean"}}}}}catch{}const O=({name:e=void 0,options:o=null,children:d=null,value:u=void 0,onChange:l=()=>{},padding:g=!1,margin:v=!0,contentPadding:b=!0,onChangeTab:i,activeTabIndex:c=void 0,tabs:y=void 0,testId:S})=>{const q=R.useContext(w),m=i!==void 0,T=d?d.map((a,r)=>{var s;return{value:r,url:a.props.url,label:a.props.label,hidden:a.props.hidden,disabled:a.props.disabled||q,badge:a.props.badge,testId:((s=a.props)==null?void 0:s.testId)&&`${a.props.testId}-${r}`}}):o||y,{simpleInputs:E,options:p,selectedOptions:f}=m?{simpleInputs:!1,options:T,selectedOptions:void 0}:F(T,u),C=m||f===void 0||f===null?void 0:E?f:f.value,N=c!==void 0?c:p==null?void 0:p.findIndex(a=>a.value===C),j=N===-1?0:N,k=(a,r)=>{const{label:s,url:L,hidden:B,disabled:D,value:M,right:A,invalid:$,badge:z,testId:H}=a;return n.jsx(h,{label:s,url:L,hidden:B,disabled:D||q,invalid:$,badge:z,right:A,active:m?r===j:M===C,onClick:m?()=>{const _=a.key||s||null;i(r,_)}:_=>{const x=_.target;x.name=e,x.value=a.value,x.label=s,l(_)},testId:H},r)};return p?n.jsxs("div",{children:[n.jsx("div",{className:V(t.tabs,g?t.padding:"",v?t.margin:""),"data-testid":S,children:p.map(k)}),n.jsx(I,{activeTabIndex:j??0,contentPadding:b,children:d})]}):null};try{O.displayName="Tabs",O.__docgenInfo={description:"",displayName:"Tabs",props:{name:{defaultValue:{value:"undefined"},description:"",name:"name",required:!1,type:{name:"string"}},options:{defaultValue:null,description:"",name:"options",required:!1,type:{name:"ITabOption[] | null"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"ITabSelectedOption"}},onChange:{defaultValue:{value:"() => {}"},description:"",name:"onChange",required:!1,type:{name:"((evt: ChangeEvent<any>) => void)"}},padding:{defaultValue:{value:"false"},description:"",name:"padding",required:!1,type:{name:"boolean"}},margin:{defaultValue:{value:"true"},description:"",name:"margin",required:!1,type:{name:"boolean"}},contentPadding:{defaultValue:{value:"true"},description:"",name:"contentPadding",required:!1,type:{name:"boolean"}},activeTabIndex:{defaultValue:null,description:"",name:"activeTabIndex",required:!1,type:{name:"number"}},tabs:{defaultValue:null,description:"",name:"tabs",required:!1,type:{name:"ITabOption[]"}},onChangeTab:{defaultValue:null,description:"",name:"onChangeTab",required:!1,type:{name:"((index: number, value: TStringOrNumber | null) => void)"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}}}}}catch{}export{O as T};

package/dist/storybook/assets/tabs-f0f2a36b.css

@@ -0,0 +1 @@
+._tabs_12xfo_1{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--color-border);flex-shrink:0}._tabs_12xfo_1._padding_12xfo_7{padding-left:var(--padding);padding-right:var(--padding)}._tabs_12xfo_1._margin_12xfo_11{margin:var(--padding) 0}._contentPadding_12xfo_14{padding-top:var(--padding)}._item_12xfo_17{align-self:flex-end;display:flex;align-items:center;position:relative;vertical-align:middle;line-height:1;text-decoration:none;flex:0 0 auto;-webkit-user-select:none;user-select:none;padding:var(--padding-xs) 0;transition:border .1s ease,color .1s ease;margin-bottom:-1px;border-bottom:1px solid transparent;font-weight:400;color:var(--color-text-primary);cursor:pointer}._item_12xfo_17:not(:last-child){margin-right:var(--padding)}._item_12xfo_17:hover:not(._active_12xfo_38){color:var(--color-text-primary-hover);background:rgba(0,0,0,.025)}[data-theme=dark] ._item_12xfo_17:hover:not(._active_12xfo_38){background:rgba(255,255,255,.1)}._item_12xfo_17:active:not(._active_12xfo_38){color:var(--color-text-primary-active);background:rgba(0,0,0,.05)}[data-theme=dark] ._item_12xfo_17:active:not(._active_12xfo_38){background:rgba(255,255,255,.2)}._item_12xfo_17._active_12xfo_38{border-color:var(--color-text);color:var(--color-text);cursor:default}._item_12xfo_17._hidden_12xfo_57{display:none!important}._item_12xfo_17._disabled_12xfo_60{color:var(--color-text-faint);pointer-events:none}._item_12xfo_17._left_12xfo_64+._item_12xfo_17._right_12xfo_64{margin-left:auto}

package/dist/storybook/assets/tabs.stories-39aacb2e.js

@@ -0,0 +1,30 @@
+import{j as e}from"./jsx-runtime-f961835c.js";import{r as H}from"./index-f80c8c95.js";import{T as d}from"./tabs-a69a771b.js";import"./index-a80ed1cf.js";import"./disabled-context-d654f6ff.js";import"./badge-1615fbe5.js";import"./select.input-88b6ebab.js";import"./types-cc224262.js";const q={title:"Navigation/Tabs",component:d,args:{name:"example",options:[{label:"Tab",value:0},{label:"Tab",value:1},{label:"With Badge",value:2,badge:"3"},{label:"Invalid",value:3,invalid:!0},{label:"Disabled",value:4,disabled:!0},{label:"Hidden tab",value:5,hidden:!0}],value:0}},l=n=>e.jsx(d,{...n}),o=l.bind({}),r=l.bind({});r.args={children:[e.jsx("div",{label:"Tab 0",children:e.jsx("h3",{children:"Tab 0 Content"})}),e.jsx("div",{label:"Tab 1",hidden:!0,children:e.jsx("h3",{children:"Tab 1 Content"})}),e.jsx("div",{label:"Tab 2",disabled:!0,children:e.jsx("h3",{children:"Tab 2 Content"})}),e.jsx("div",{label:"Tab 3",children:e.jsx("h3",{children:"Tab 3 Content"})}),e.jsx("div",{label:"Tab 4",children:e.jsx("h3",{children:"Tab 4 Content"})})]};const s=l.bind({});s.args={margin:!1};const a=l.bind({});a.parameters={layout:"fullscreen",docs:{description:{story:"When you want the divider to fill the edges of its container."}}};a.args={padding:!0};const t=l.bind({});t.args={options:[{label:"Tab 0",value:0},{label:"Tab 1",value:1},{label:"Tab 2",value:2},{label:"Tab 3",value:3,right:!0},{label:"Tab 4",value:4,right:!0}]};const i=()=>{const n=[{label:"Strawberries",value:"strawberries"},{label:"Bananas",value:"bananas"},{label:"Apples",value:"apples",disabled:!0},{label:"Pomegranates",value:"pomegranates"}],[b,W]=H.useState(n[0]);return e.jsxs(e.Fragment,{children:[e.jsx(d,{name:"example",value:b,options:n,onChange:y=>{const{value:B,label:D}=y.target;W({value:B,label:D})}}),e.jsxs("span",{children:["Eating ",b.value,"..."]})]})};var c,u,p;o.parameters={...o.parameters,docs:{...(c=o.parameters)==null?void 0:c.docs,source:{originalSource:"args => <Tabs {...args} />",...(p=(u=o.parameters)==null?void 0:u.docs)==null?void 0:p.source}}};var m,g,v;r.parameters={...r.parameters,docs:{...(m=r.parameters)==null?void 0:m.docs,source:{originalSource:"args => <Tabs {...args} />",...(v=(g=r.parameters)==null?void 0:g.docs)==null?void 0:v.source}}};var T,h,x;s.parameters={...s.parameters,docs:{...(T=s.parameters)==null?void 0:T.docs,source:{originalSource:"args => <Tabs {...args} />",...(x=(h=s.parameters)==null?void 0:h.docs)==null?void 0:x.source}}};var j,S,f;a.parameters={...a.parameters,docs:{...(j=a.parameters)==null?void 0:j.docs,source:{originalSource:"args => <Tabs {...args} />",...(f=(S=a.parameters)==null?void 0:S.docs)==null?void 0:f.source}}};var C,w,E;t.parameters={...t.parameters,docs:{...(C=t.parameters)==null?void 0:C.docs,source:{originalSource:"args => <Tabs {...args} />",...(E=(w=t.parameters)==null?void 0:w.docs)==null?void 0:E.source}}};var A,M,P;i.parameters={...i.parameters,docs:{...(A=i.parameters)==null?void 0:A.docs,source:{originalSource:`() => {
+  const options = [{
+    label: 'Strawberries',
+    value: 'strawberries'
+  }, {
+    label: 'Bananas',
+    value: 'bananas'
+  }, {
+    label: 'Apples',
+    value: 'apples',
+    disabled: true
+  }, {
+    label: 'Pomegranates',
+    value: 'pomegranates'
+  }];
+  const [selectedTab, setSelectedTab] = useState(options[0]);
+  return <>
+      <Tabs name="example" value={selectedTab} options={options} onChange={evt => {
+      const {
+        value,
+        label
+      } = evt.target;
+      setSelectedTab({
+        value,
+        label
+      });
+    }} />
+      <span>Eating {selectedTab.value}...</span>
+    </>;
+}`,...(P=(M=i.parameters)==null?void 0:M.docs)==null?void 0:P.source}}};const G=["Default","WithChildren","NoMargin","HorizontalPadding","Alignment","Managed"];export{t as Alignment,o as Default,a as HorizontalPadding,i as Managed,s as NoMargin,r as WithChildren,G as __namedExportsOrder,q as default};

package/dist/storybook/assets/text-1e636744.css

@@ -0,0 +1 @@
+._bold_11ofj_1{font-weight:700}._center_11ofj_4{text-align:center}._muted_11ofj_7{color:var(--color-text-muted)}._faint_11ofj_10{color:var(--color-text-faint)}._success_11ofj_13{color:var(--color-text-success)}._warning_11ofj_16{color:var(--color-text-warning)}._error_11ofj_19{color:var(--color-text-error)}._small_11ofj_22{font-size:var(--font-size-sm)}._link_11ofj_25{color:var(--color-text-primary);cursor:pointer}._link_11ofj_25:hover{color:var(--color-text-primary-hover)}._link_11ofj_25:active{color:var(--color-text-primary-active)}

package/dist/storybook/assets/text-ad1f5f1d.js

@@ -0,0 +1 @@
+import{j as m}from"./jsx-runtime-f961835c.js";import{c as _}from"./index-a80ed1cf.js";const p="_bold_11ofj_1",b="_center_11ofj_4",y="_muted_11ofj_7",j="_faint_11ofj_10",v="_success_11ofj_13",q="_warning_11ofj_16",V="_error_11ofj_19",g="_small_11ofj_22",k="_link_11ofj_25",e={bold:p,center:b,muted:y,faint:j,success:v,warning:q,error:V,small:g,link:k},n=({children:a,bold:s=!1,center:t=!1,error:o=!1,faint:r=!1,link:i=!1,muted:f=!1,onClick:l,small:u=!1,success:c=!1,warning:d=!1})=>m.jsx("span",{className:_(s&&e.bold,t&&e.center,o&&e.error,r&&e.faint,i&&e.link,f&&e.muted,l&&e.clickable,u&&e.small,c&&e.success,d&&e.warning),onClick:l,children:a});try{n.displayName="Text",n.__docgenInfo={description:"",displayName:"Text",props:{bold:{defaultValue:{value:"false"},description:"",name:"bold",required:!1,type:{name:"boolean"}},center:{defaultValue:{value:"false"},description:"",name:"center",required:!1,type:{name:"boolean"}},error:{defaultValue:{value:"false"},description:"",name:"error",required:!1,type:{name:"boolean"}},faint:{defaultValue:{value:"false"},description:"",name:"faint",required:!1,type:{name:"boolean"}},link:{defaultValue:{value:"false"},description:"",name:"link",required:!1,type:{name:"boolean"}},muted:{defaultValue:{value:"false"},description:"",name:"muted",required:!1,type:{name:"boolean"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"((e: MouseEvent<HTMLSpanElement, MouseEvent>) => void)"}},small:{defaultValue:{value:"false"},description:"",name:"small",required:!1,type:{name:"boolean"}},success:{defaultValue:{value:"false"},description:"",name:"success",required:!1,type:{name:"boolean"}},warning:{defaultValue:{value:"false"},description:"",name:"warning",required:!1,type:{name:"boolean"}}}}}catch{}export{n as T};

package/dist/storybook/assets/text-link.stories-c1227c6f.js

@@ -0,0 +1 @@
+import{j as s}from"./jsx-runtime-f961835c.js";import{T as x}from"./text-ad1f5f1d.js";import"./index-f80c8c95.js";import"./index-a80ed1cf.js";const a=({children:t,href:u=void 0,target:m=void 0,testId:f,onClick:g})=>s.jsx("a",{href:u,target:m,onClick:g,"data-testid":f,children:s.jsx(x,{link:!0,children:t})});try{a.displayName="TextLink",a.__docgenInfo={description:"",displayName:"TextLink",props:{href:{defaultValue:{value:"undefined"},description:"",name:"href",required:!1,type:{name:"string"}},target:{defaultValue:{value:"undefined"},description:"",name:"target",required:!1,type:{name:"string"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"((e: MouseEvent<HTMLAnchorElement, MouseEvent>) => void)"}}}}}catch{}const L={title:"Basic/TextLink",component:a,args:{children:"Link text goes here",href:"http://oliasoft.com"}},p=t=>s.jsx(a,{...t}),r=p.bind({}),e=p.bind({});e.args={href:void 0,onClick:()=>console.log("Clicked!")};var n,o,i;r.parameters={...r.parameters,docs:{...(n=r.parameters)==null?void 0:n.docs,source:{originalSource:"args => <TextLink {...args} />",...(i=(o=r.parameters)==null?void 0:o.docs)==null?void 0:i.source}}};var d,c,l;e.parameters={...e.parameters,docs:{...(d=e.parameters)==null?void 0:d.docs,source:{originalSource:"args => <TextLink {...args} />",...(l=(c=e.parameters)==null?void 0:c.docs)==null?void 0:l.source}}};const v=["Default","OnClick"];export{r as Default,e as OnClick,v as __namedExportsOrder,L as default};