@oliasoft-open-source/react-ui-library 4.0.0-beta-66 → 4.0.0-beta-68

package/dist/storybook/assets/list.stories-32bdff39.js

@@ -1,455 +0,0 @@
-import{j as s}from"./jsx-runtime-f961835c.js";import{r as $}from"./index-f80c8c95.js";import{p as k}from"./immer.esm-5c06d4d0.js";import{L as x,a as X}from"./list-f296a38e.js";import{L as Ue}from"./list-heading-6866bbfa.js";import{F as Ve}from"./flex-47732c42.js";import{l as Ye,a as Ze,b as en,c as nn,d as an,e as tn,f as rn,g as sn,h as on,i as dn,j as mn,k as ln,m as Pe}from"./list.stories-data-3724d238.js";import"./index-a80ed1cf.js";import"./index.es-648fc14e.js";import"./inheritsLoose-d4851ab8.js";import"./redux-10ee6be7.js";import"./objectSpread2-fdee9b6d.js";import"./index-3d476d02.js";import"./memoize-one.esm-52518564.js";import"./icon-ba53aa84.js";import"./tslib.es6-dfef685f.js";import"./index-c89a1915.js";import"./disabled-context-d654f6ff.js";import"./card-3847c251.js";import"./common-types-2c81813f.js";import"./actions-dc55083a.js";import"./lodash-75c70a11.js";import"./button-dd554c3d.js";import"./spinner-cb92a546.js";import"./tooltip-23e84186.js";import"./types-cc224262.js";import"./types-332ceaf3.js";import"./badge-3abf067b.js";import"./loader-87ec8334.js";import"./heading-18a1d4cf.js";import"./help-icon-3265d994.js";const _n={title:"Basic/List",component:x,args:{list:Ye,noHeader:!0},parameters:{layout:"fullscreen"}},o=d=>s.jsx(x,{...d}),B=o.bind({}),L=o.bind({});L.args={list:Ze};const D=o.bind({});D.args={list:en};const v=o.bind({});v.args={list:nn};const K=o.bind({});K.args={list:an,expanding:!0};const H=o.bind({});H.args={list:tn,noHeader:!1};const M=o.bind({});M.args={list:rn};const j=o.bind({});j.args={list:sn};const T=o.bind({});T.args={list:on};const R=o.bind({});R.args={list:dn,noHeader:!1};const E=o.bind({});E.args={bordered:!0};const N=o.bind({});N.args={list:mn};const w=o.bind({});w.args={list:ln};const I=o.bind({});I.args={list:Pe,noHeader:!1,stickyHeader:!0};I.parameters={docs:{story:{inline:!1,iframeHeight:200}}};const f=o.bind({});f.args={list:Pe,scrollDetails:{scrollable:!0}};f.parameters={docs:{description:{story:"Adds an internal scrollbar to the `List`, which will fill its parent height unless a `height` is set. The scrollbar can be toggled using `hideScrollbar`."}}};f.decorators=[d=>s.jsx("div",{style:{height:200,overflow:"hidden"},children:d()})];const O=()=>{const[d,y]=$.useState(0),b={name:"Animals",items:[...Array(50)].map((m,l)=>({id:l,name:`Aardvark #${l+1}`,active:l===d,onClick:()=>y(l)}))};return s.jsx("div",{style:{height:200,overflow:"auto"},children:s.jsx(x,{list:b,scrollDetails:{infiniteScroll:!0,scrollable:!0,limit:10}})})},J=()=>{const d=(e,a)=>{switch(a.type){case"headingClicked":{const{headingKey:t}=a.payload;return k(e,i=>{const r=i[t];r.expanded=!r.expanded})}case"itemClicked":{const{headingKey:t,itemIndex:i}=a.payload;return k(e,r=>{Object.keys(r).forEach(h=>{r[h].items.forEach((A,Qe)=>{A.active=h===t&&Qe===i})})})}case"addClicked":{const{headingKey:t}=a.payload;return k(e,i=>{const r=i[t];r.expanded=!0,r.items.push({name:`${r.label} #${r.items.length+1}`})})}case"deleteClicked":{const{headingKey:t,itemIndex:i}=a.payload;return k(e,r=>{let{items:h}=r[t];delete h[i],r[t].items=h.filter(A=>A)})}default:return e}},y=()=>({mammals:{draggable:!0,name:"Mammals",key:"mammals",label:"Mammals",expanded:!0,items:[{name:"Click item to scroll",type:"Heading"},{name:"Mammal #1",active:!0},{name:"Mammal #2"},{name:"Mammal #3"},{name:"Mammal #4"},{name:"Mammal #5"},{name:"Mammal #6"},{name:"Mammal #7"},{name:"Mammal #8"},{name:"Mammal #9"},{name:"Mammal #10"}]},amphibians:{name:"Amphibians (sticky header)",key:"amphibians",label:"Amphibians",expanded:!0,items:[{name:"Click item to scroll",type:"Heading"},{name:"Amphibian #1",active:!0},{name:"Amphibian #2"},{name:"Amphibian #3"},{name:"Amphibian #4"},{name:"Amphibian #5"},{name:"Amphibian #6"},{name:"Amphibian #7"},{name:"Amphibian #8"},{name:"Amphibian #9"},{name:"Amphibian #10"}]}}),[b,m]=$.useReducer(d,{},()=>y()),[l,u]=$.useState(!1),c=(e,a)=>{u(!0),m({type:"itemClicked",payload:{headingKey:e,itemIndex:a}}),setTimeout(()=>u(!1),0)},p=e=>{m({type:"addClicked",payload:{headingKey:e}})},g=(e,a)=>m({type:"deleteClicked",payload:{headingKey:e,itemIndex:a}}),{mammals:S,amphibians:F}=b,C=e=>({...e,actions:[{label:"Add",primary:!0,icon:"add",onClick:()=>p(e.key)}],items:e.items.map((a,t)=>a.type=="Heading"?{...a,id:t}:{...a,id:t,onClick:()=>c(e.key,t),actions:[{label:"Delete",icon:"delete",onClick:()=>g(e.key,t)}]})}),n=300;return s.jsxs(Ve,{gap:!0,children:[s.jsx(x,{list:C(S),bordered:!0,height:n,scrollDetails:{scrollable:!0,hideScrollbar:!1,triggerScrollToActiveItem:l}}),s.jsx(x,{list:C(F),bordered:!0,stickyHeader:!0,height:n,scrollDetails:{scrollable:!0,hideScrollbar:!1,triggerScrollToActiveItem:l}})]})},_=()=>{const d=(n,e)=>{switch(e.type){case"headingClicked":{const{headingKey:a}=e.payload;return k(n,t=>{const i=t[a];i.expanded=!i.expanded})}case"itemClicked":{const{headingKey:a,itemIndex:t}=e.payload;return k(n,i=>{Object.keys(i).forEach(r=>{i[r].items.forEach((h,A)=>{h.active=r===a&&A===t})})})}case"addClicked":{const{headingKey:a}=e.payload;return k(n,t=>{const i=t[a];i.expanded=!0,i.items.push({name:`${i.label} #${i.items.length+1}`})})}case"deleteClicked":{const{headingKey:a,itemIndex:t}=e.payload;return k(n,i=>{let{items:r}=i[a];delete r[t],i[a].items=r.filter(h=>h)})}default:return n}},y=()=>({mammals:{key:"mammals",label:"Mammals",expanded:!0,items:[{name:"Aardvark",active:!0},{name:"Kangaroo"}]},amphibians:{key:"amphibians",label:"Amphibians",expanded:!0,items:[{name:"Frog"}]}}),[b,m]=$.useReducer(d,y()),l=n=>m({type:"headingClicked",payload:{headingKey:n}}),u=(n,e)=>m({type:"itemClicked",payload:{headingKey:n,itemIndex:e}}),c=n=>m({type:"addClicked",payload:{headingKey:n}}),p=(n,e)=>m({type:"deleteClicked",payload:{headingKey:n,itemIndex:e}}),{mammals:g,amphibians:S}=b,F=n=>({name:n.label,metaCount:n.items.length,expanded:n.expanded,onClick:()=>l(n.key),actions:[{label:"Add",primary:!0,icon:"add",onClick:()=>c(n.key)}]}),C=n=>({...n,items:n.items.map((e,a)=>({...e,id:a,onClick:()=>u(n.key,a),actions:[{label:"Delete",icon:"delete",onClick:()=>p(n.key,a)}]}))});return s.jsxs(s.Fragment,{children:[s.jsx(Ue,{name:"Animals"}),s.jsx(X,{item:F(g)}),g.expanded&&s.jsx(x,{noHeader:!0,list:C(g)}),s.jsx(X,{item:F(S)}),S.expanded&&s.jsx(x,{noHeader:!0,list:C(S)})]})},W=()=>{const d=(u,c,p)=>{if(c&&isNaN(c)||p&&isNaN(p)||c===p)return u;const g=[...u];return typeof p=="number"&&typeof c=="number"&&g.splice(p,0,g.splice(c,1)[0]),g},y={name:"List Name",draggable:!0,items:[{id:1,name:"element 1",actions:[{label:"Delete",icon:"delete",onClick:()=>{}}]},{id:2,name:"element 2",actions:[{label:"Delete",icon:"delete",onClick:()=>{}}]},{id:3,name:"element 3"},{id:4,name:"element 4",actions:[{label:"Delete",icon:"delete",onClick:()=>{}}]},{id:5,name:"element 5",actions:[{label:"Delete",icon:"delete",onClick:()=>{}}]}]},[b,m]=$.useState(y.items),l=u=>{const{to:c,from:p}=u;m(d(b,p,c))};return s.jsx(x,{list:{...y,items:b},draggable:!0,onListReorder:l})};var q,z,G;B.parameters={...B.parameters,docs:{...(q=B.parameters)==null?void 0:q.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(G=(z=B.parameters)==null?void 0:z.docs)==null?void 0:G.source}}};var P,Q,U;L.parameters={...L.parameters,docs:{...(P=L.parameters)==null?void 0:P.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(U=(Q=L.parameters)==null?void 0:Q.docs)==null?void 0:U.source}}};var V,Y,Z;D.parameters={...D.parameters,docs:{...(V=D.parameters)==null?void 0:V.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(Z=(Y=D.parameters)==null?void 0:Y.docs)==null?void 0:Z.source}}};var ee,ne,ae;v.parameters={...v.parameters,docs:{...(ee=v.parameters)==null?void 0:ee.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(ae=(ne=v.parameters)==null?void 0:ne.docs)==null?void 0:ae.source}}};var te,ie,re;K.parameters={...K.parameters,docs:{...(te=K.parameters)==null?void 0:te.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(re=(ie=K.parameters)==null?void 0:ie.docs)==null?void 0:re.source}}};var se,oe,de;H.parameters={...H.parameters,docs:{...(se=H.parameters)==null?void 0:se.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(de=(oe=H.parameters)==null?void 0:oe.docs)==null?void 0:de.source}}};var me,le,ce;M.parameters={...M.parameters,docs:{...(me=M.parameters)==null?void 0:me.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(ce=(le=M.parameters)==null?void 0:le.docs)==null?void 0:ce.source}}};var pe,ue,ge;j.parameters={...j.parameters,docs:{...(pe=j.parameters)==null?void 0:pe.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(ge=(ue=j.parameters)==null?void 0:ue.docs)==null?void 0:ge.source}}};var he,ye,be;T.parameters={...T.parameters,docs:{...(he=T.parameters)==null?void 0:he.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(be=(ye=T.parameters)==null?void 0:ye.docs)==null?void 0:be.source}}};var ke,xe,fe;R.parameters={...R.parameters,docs:{...(ke=R.parameters)==null?void 0:ke.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(fe=(xe=R.parameters)==null?void 0:xe.docs)==null?void 0:fe.source}}};var Ie,Se,Ce;E.parameters={...E.parameters,docs:{...(Ie=E.parameters)==null?void 0:Ie.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(Ce=(Se=E.parameters)==null?void 0:Se.docs)==null?void 0:Ce.source}}};var Ae,Le,De;N.parameters={...N.parameters,docs:{...(Ae=N.parameters)==null?void 0:Ae.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(De=(Le=N.parameters)==null?void 0:Le.docs)==null?void 0:De.source}}};var ve,Ke,He;w.parameters={...w.parameters,docs:{...(ve=w.parameters)==null?void 0:ve.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(He=(Ke=w.parameters)==null?void 0:Ke.docs)==null?void 0:He.source}}};var Me,je,Te;I.parameters={...I.parameters,docs:{...(Me=I.parameters)==null?void 0:Me.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(Te=(je=I.parameters)==null?void 0:je.docs)==null?void 0:Te.source}}};var Re,Ee,Ne;f.parameters={...f.parameters,docs:{...(Re=f.parameters)==null?void 0:Re.docs,source:{originalSource:`args => {
-  return <List {...args} />;
-}`,...(Ne=(Ee=f.parameters)==null?void 0:Ee.docs)==null?void 0:Ne.source}}};var we,$e,Fe;O.parameters={...O.parameters,docs:{...(we=O.parameters)==null?void 0:we.docs,source:{originalSource:`() => {
-  const [activeIndex, setActiveIndex] = useState(0);
-  const list = {
-    name: 'Animals',
-    items: [...Array(50)].map((item, index) => ({
-      id: index,
-      name: \`Aardvark #\${index + 1}\`,
-      active: index === activeIndex,
-      onClick: () => setActiveIndex(index)
-    }))
-  };
-  return <div style={{
-    height: 200,
-    overflow: 'auto'
-  }}>
-      <List list={list} scrollDetails={{
-      infiniteScroll: true,
-      scrollable: true,
-      limit: 10
-    }} />
-    </div>;
-}`,...(Fe=($e=O.parameters)==null?void 0:$e.docs)==null?void 0:Fe.source}}};var Be,Oe,Je;J.parameters={...J.parameters,docs:{...(Be=J.parameters)==null?void 0:Be.docs,source:{originalSource:`() => {
-  const reducer: Reducer<StateShape, Action> = (state, action) => {
-    switch (action.type) {
-      case 'headingClicked':
-        {
-          const {
-            headingKey
-          } = action.payload;
-          return produce(state, draft => {
-            const heading = draft[headingKey];
-            heading.expanded = !heading.expanded;
-          });
-        }
-      case 'itemClicked':
-        {
-          const {
-            headingKey,
-            itemIndex
-          } = action.payload;
-          return produce(state, draft => {
-            Object.keys(draft).forEach(key => {
-              draft[key].items.forEach((item, i) => {
-                item.active = key === headingKey && i === itemIndex;
-              });
-            });
-          });
-        }
-      case 'addClicked':
-        {
-          const {
-            headingKey
-          } = action.payload;
-          return produce(state, draft => {
-            const heading = draft[headingKey];
-            heading.expanded = true;
-            heading.items.push({
-              name: \`\${heading.label} #\${heading.items.length + 1}\`
-            });
-          });
-        }
-      case 'deleteClicked':
-        {
-          const {
-            headingKey,
-            itemIndex
-          } = action.payload;
-          return produce(state, draft => {
-            let {
-              items
-            } = draft[headingKey];
-            delete items[itemIndex];
-            draft[headingKey].items = items.filter(i => i); //remove empty slots
-          });
-        }
-
-      default:
-        return state;
-    }
-  };
-  const initialState = () => ({
-    mammals: {
-      draggable: true,
-      name: 'Mammals',
-      key: 'mammals',
-      label: 'Mammals',
-      expanded: true,
-      items: [{
-        name: 'Click item to scroll',
-        type: 'Heading'
-      }, {
-        name: 'Mammal #1',
-        active: true
-      }, {
-        name: 'Mammal #2'
-      }, {
-        name: 'Mammal #3'
-      }, {
-        name: 'Mammal #4'
-      }, {
-        name: 'Mammal #5'
-      }, {
-        name: 'Mammal #6'
-      }, {
-        name: 'Mammal #7'
-      }, {
-        name: 'Mammal #8'
-      }, {
-        name: 'Mammal #9'
-      }, {
-        name: 'Mammal #10'
-      }]
-    },
-    amphibians: {
-      name: 'Amphibians (sticky header)',
-      key: 'amphibians',
-      label: 'Amphibians',
-      expanded: true,
-      items: [{
-        name: 'Click item to scroll',
-        type: 'Heading'
-      }, {
-        name: 'Amphibian #1',
-        active: true
-      }, {
-        name: 'Amphibian #2'
-      }, {
-        name: 'Amphibian #3'
-      }, {
-        name: 'Amphibian #4'
-      }, {
-        name: 'Amphibian #5'
-      }, {
-        name: 'Amphibian #6'
-      }, {
-        name: 'Amphibian #7'
-      }, {
-        name: 'Amphibian #8'
-      }, {
-        name: 'Amphibian #9'
-      }, {
-        name: 'Amphibian #10'
-      }]
-    }
-  });
-  const [state, dispatch] = useReducer(reducer, {}, () => initialState());
-  const [triggerScroll, setTriggerScroll] = useState(false);
-  const onClickItem = (headingKey: string, itemIndex: number) => {
-    setTriggerScroll(true);
-    dispatch({
-      type: 'itemClicked',
-      payload: {
-        headingKey,
-        itemIndex
-      }
-    });
-    // will execute after stack is cleared
-    setTimeout(() => setTriggerScroll(false), 0);
-  };
-  const onAddItem = (headingKey: string) => {
-    dispatch({
-      type: 'addClicked',
-      payload: {
-        headingKey
-      }
-    });
-  };
-  const onDeleteItem = (headingKey: string, itemIndex: number) => dispatch({
-    type: 'deleteClicked',
-    payload: {
-      headingKey,
-      itemIndex
-    }
-  });
-  const {
-    mammals,
-    amphibians
-  } = state;
-  const hydrateList = (list: any) => ({
-    ...list,
-    actions: [{
-      label: 'Add',
-      primary: true,
-      icon: 'add',
-      onClick: () => onAddItem(list.key)
-    }],
-    items: list.items.map((item: any, itemIndex: number) => {
-      if (item.type == 'Heading') {
-        return {
-          ...item,
-          id: itemIndex
-        };
-      }
-      return {
-        ...item,
-        id: itemIndex,
-        onClick: () => onClickItem(list.key, itemIndex),
-        actions: [{
-          label: 'Delete',
-          icon: 'delete',
-          onClick: () => onDeleteItem(list.key, itemIndex)
-        }]
-      };
-    })
-  });
-  const height = 300;
-  return <Flex gap>
-      <List list={hydrateList(mammals)} bordered height={height} scrollDetails={{
-      scrollable: true,
-      hideScrollbar: false,
-      triggerScrollToActiveItem: triggerScroll
-    }} />
-      <List list={hydrateList(amphibians)} bordered stickyHeader height={height} scrollDetails={{
-      scrollable: true,
-      hideScrollbar: false,
-      triggerScrollToActiveItem: triggerScroll
-    }} />
-    </Flex>;
-}`,...(Je=(Oe=J.parameters)==null?void 0:Oe.docs)==null?void 0:Je.source}}};var _e,We,Xe;_.parameters={..._.parameters,docs:{...(_e=_.parameters)==null?void 0:_e.docs,source:{originalSource:`() => {
-  const reducer: Reducer<StateShape, Action> = (state, action) => {
-    switch (action.type) {
-      case 'headingClicked':
-        {
-          const {
-            headingKey
-          } = action.payload;
-          return produce(state, draft => {
-            const heading = draft[headingKey];
-            heading.expanded = !heading.expanded;
-          });
-        }
-      case 'itemClicked':
-        {
-          const {
-            headingKey,
-            itemIndex
-          } = action.payload;
-          return produce(state, draft => {
-            Object.keys(draft).forEach(key => {
-              draft[key].items.forEach((item, i) => {
-                item.active = key === headingKey && i === itemIndex;
-              });
-            });
-          });
-        }
-      case 'addClicked':
-        {
-          const {
-            headingKey
-          } = action.payload;
-          return produce(state, draft => {
-            const heading = draft[headingKey];
-            heading.expanded = true;
-            heading.items.push({
-              name: \`\${heading.label} #\${heading.items.length + 1}\`
-            });
-          });
-        }
-      case 'deleteClicked':
-        {
-          const {
-            headingKey,
-            itemIndex
-          } = action.payload;
-          return produce(state, draft => {
-            let {
-              items
-            } = draft[headingKey];
-            delete items[itemIndex];
-            draft[headingKey].items = items.filter(i => i); //remove empty slots
-          });
-        }
-
-      default:
-        return state;
-    }
-  };
-  const initialState: () => StateShape = () => ({
-    mammals: {
-      key: 'mammals',
-      label: 'Mammals',
-      expanded: true,
-      items: [{
-        name: 'Aardvark',
-        active: true
-      }, {
-        name: 'Kangaroo'
-      }]
-    },
-    amphibians: {
-      key: 'amphibians',
-      label: 'Amphibians',
-      expanded: true,
-      items: [{
-        name: 'Frog'
-      }]
-    }
-  });
-  const [state, dispatch] = useReducer(reducer, initialState());
-  const onClickHeading = (headingKey: string) => dispatch({
-    type: 'headingClicked',
-    payload: {
-      headingKey
-    }
-  });
-  const onClickItem = (headingKey: string, itemIndex: number) => dispatch({
-    type: 'itemClicked',
-    payload: {
-      headingKey,
-      itemIndex
-    }
-  });
-  const onAddItem = (headingKey: string) => dispatch({
-    type: 'addClicked',
-    payload: {
-      headingKey
-    }
-  });
-  const onDeleteItem = (headingKey: string, itemIndex: number) => dispatch({
-    type: 'deleteClicked',
-    payload: {
-      headingKey,
-      itemIndex
-    }
-  });
-  const {
-    mammals,
-    amphibians
-  } = state;
-  const hydrateHeading = (list: ListSection) => ({
-    name: list.label,
-    metaCount: list.items.length,
-    expanded: list.expanded,
-    onClick: () => onClickHeading(list.key),
-    actions: [{
-      label: 'Add',
-      primary: true,
-      icon: 'add',
-      onClick: () => onAddItem(list.key)
-    }]
-  });
-  const hydrateList = (list: ListSection) => ({
-    ...list,
-    items: list.items.map((item, itemIndex) => ({
-      ...item,
-      id: itemIndex,
-      onClick: () => onClickItem(list.key, itemIndex),
-      actions: [{
-        label: 'Delete',
-        icon: 'delete',
-        onClick: () => onDeleteItem(list.key, itemIndex)
-      }]
-    }))
-  });
-  return <>
-      <ListHeading name="Animals" />
-      <ListSubheading item={hydrateHeading(mammals)} />
-      {mammals.expanded && <List noHeader list={hydrateList(mammals)} />}
-      <ListSubheading item={hydrateHeading(amphibians)} />
-      {amphibians.expanded && <List noHeader list={hydrateList(amphibians)} />}
-    </>;
-}`,...(Xe=(We=_.parameters)==null?void 0:We.docs)==null?void 0:Xe.source}}};var qe,ze,Ge;W.parameters={...W.parameters,docs:{...(qe=W.parameters)==null?void 0:qe.docs,source:{originalSource:`() => {
-  const arraymove = (arr: ListItem[], from?: number, to?: number): ListItem[] => {
-    if (from && isNaN(from) || to && isNaN(to) || from === to) {
-      return arr;
-    }
-    const copy = [...arr];
-    if (typeof to === 'number' && typeof from === 'number') {
-      copy.splice(to, 0, copy.splice(from, 1)[0]);
-    }
-    return copy;
-  };
-  const beautifulDnD = {
-    name: 'List Name',
-    draggable: true,
-    items: [{
-      id: 1,
-      name: 'element 1',
-      actions: [{
-        label: 'Delete',
-        icon: 'delete',
-        onClick: () => {}
-      }]
-    }, {
-      id: 2,
-      name: 'element 2',
-      actions: [{
-        label: 'Delete',
-        icon: 'delete',
-        onClick: () => {}
-      }]
-    }, {
-      id: 3,
-      name: 'element 3'
-    }, {
-      id: 4,
-      name: 'element 4',
-      actions: [{
-        label: 'Delete',
-        icon: 'delete',
-        onClick: () => {}
-      }]
-    }, {
-      id: 5,
-      name: 'element 5',
-      actions: [{
-        label: 'Delete',
-        icon: 'delete',
-        onClick: () => {}
-      }]
-    }]
-  };
-  const [reorderedItems, setReorderedItems] = useState(beautifulDnD.items);
-  const onListReorder = (reorderData: IReorderData) => {
-    const {
-      to,
-      from
-    } = reorderData;
-    setReorderedItems((arraymove((reorderedItems as any), from, to) as any));
-  };
-  return <List list={{
-    ...beautifulDnD,
-    items: reorderedItems
-  }} draggable onListReorder={onListReorder} />;
-}`,...(Ge=(ze=W.parameters)==null?void 0:ze.docs)==null?void 0:Ge.source}}};const Wn=["Default","Actions","Menus","Details","Expanding","Header","Badges","Nested","InvalidItems","JSXTitles","Bordered","IconWithTooltip","Metacount","StickyHeader","Scrollable","InfiniteScroll","ScrollToActiveItem","HeadingsManaged","ManagedDragAndDrop"];export{L as Actions,M as Badges,E as Bordered,B as Default,v as Details,K as Expanding,H as Header,_ as HeadingsManaged,N as IconWithTooltip,O as InfiniteScroll,T as InvalidItems,R as JSXTitles,W as ManagedDragAndDrop,D as Menus,w as Metacount,j as Nested,J as ScrollToActiveItem,f as Scrollable,I as StickyHeader,Wn as __namedExportsOrder,_n as default};

package/dist/storybook/assets/list.stories-data-3724d238.js

@@ -1 +0,0 @@
-import{j as s}from"./jsx-runtime-f961835c.js";import{I as i,T as r}from"./common-types-2c81813f.js";import{F as o}from"./flex-47732c42.js";import{M as d}from"./actions-dc55083a.js";import{I as n}from"./icon-ba53aa84.js";import{M as l}from"./types-cc224262.js";const a=[{id:1,name:"Aardvark"},{id:2,name:"Kangaroo",active:!0},{id:3,name:"Jaguar",disabled:!0}],p=[{id:1,name:"Marsupials",type:"Heading",metaCount:1},{id:2,name:"Aardvark"},{id:3,name:"Kangaroo",active:!0},{id:4,name:"Mammals",type:"Heading",metaCount:1},{id:5,name:"Jaguar"}],g=[{id:1,name:"Aardvark"},{id:2,name:"Kangaroo",active:!0},{id:3,name:"Grey",level:1},{id:4,name:"Eastern",level:2},{id:5,name:"Macropus giganteus giganteus",title:"Macropus giganteus giganteus",level:3},{id:6,name:"Macropus giganteus tasmaniensis",title:"Macropus giganteus tasmaniensis",level:3},{id:7,name:"Western",level:2},{id:8,name:"Red",level:1},{id:9,name:"Jaguar"}],A={items:a},c={name:"Animals",actions:[{label:"More",subActions:[{label:"Item",icon:"up",onClick:()=>{}},{label:"Item",icon:"down",onClick:()=>{}}]},{label:"Add",primary:!0,icon:"add",onClick:()=>{}}],items:a},m={...c,items:p},C={...c,name:s.jsxs(o,{gap:"var(--padding-xs)",alignItems:"center",children:["Animals",s.jsx(n,{icon:i.STAR})]}),items:a.map(e=>({...e,name:s.jsxs(o,{gap:"var(--padding-xs)",alignItems:"center",children:[e.name,s.jsx(n,{icon:i.STAR})]})}))};a.map(e=>({...e,actions:[{childComponent:s.jsx(d,{menu:{trigger:r.COMPONENT,component:s.jsx(n,{icon:i.MENU}),placement:"bottom-end",sections:[{type:l.OPTION,label:"Item",onClick:()=>{}},{type:l.OPTION,label:"Item",onClick:()=>{}}]}})}]}));const h={items:a.map(e=>({...e,actions:[{label:"More",subActions:[{label:"Move Up",icon:"up",onClick:()=>{}},{label:"Move Down",icon:"down",onClick:()=>{}}]}]}))},k={items:a.map((e,t)=>({...e,label:{value:String(t+1),color:"var(--color-text-info)"}}))},T={...m,items:m.items.map((e,t)=>({...e,label:{value:String(t+1),color:"var(--color-text-info)"}}))},j={items:a.map(e=>({...e,actions:[{label:"Delete",icon:"delete",onClick:()=>{}}]}))},y={items:a.map((e,t)=>({...e,details:"Description goes here",metadata:"2019-05-03 09:03:51",testId:`story-list-item-${t}`}))},f={items:a.map(e=>({...e,content:s.jsx("div",{children:"Example content element (for show/hide)."})}))},S={items:g},N={items:[...a,{id:4,name:"Dodo",invalid:!0}]},E={items:a.map(e=>({...e,icon:{icon:"success",color:"var(--color-text-success)",tooltip:{text:s.jsx(s.Fragment,{children:"Tooltip goes here"})}}}))},O={items:a.map(e=>({...e,metaCount:3}))},D={name:"Animals",items:[...Array(50)].map((e,t)=>({id:t,name:`Aardvark #${t+1}`}))};export{j as a,h as b,y as c,f as d,c as e,k as f,S as g,N as h,C as i,E as j,O as k,A as l,D as m,T as n};

package/dist/storybook/assets/preview-190489dc.js

@@ -1 +0,0 @@
-import{_ as e}from"./iframe-e893a37d.js";import"../sb-preview/runtime.js";var a={docs:{renderer:async()=>{let{DocsRenderer:r}=await e(()=>import("./DocsRenderer-NNNQARDV-bdeabbc5.js"),["./DocsRenderer-NNNQARDV-bdeabbc5.js","./chunk-HLWAVYOI-53a1b0ff.js","./iframe-e893a37d.js","./index-f80c8c95.js","./react-16-147b12fd.js","./index-3d476d02.js","./index-f9f9a967.js","./inheritsLoose-d4851ab8.js","./assertThisInitialized-081f9914.js","./index-97a99495.js"],import.meta.url);return new r}}};export{a as parameters};