@mittwald/flow-react-components 0.2.0-alpha.61 → 0.2.0-alpha.610

package/dist/js/components/src/components/List/components/ListItemView/components/ListItemViewContent/ListItemViewContent.mjs

@@ -0,0 +1,125 @@
+"use client"
+/* */
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import styles from '../../ListItemView.module.scss.mjs';
+import { dynamic } from '../../../../../../lib/propsContext/dynamicProps/dynamic.mjs';
+import '../../../../../../lib/propsContext/propsContext.mjs';
+import { PropsContextProvider } from '../../../../../../lib/propsContext/components/PropsContextProvider.mjs';
+import clsx from 'clsx';
+import { ColumnLayout } from '../../../../../ColumnLayout/ColumnLayout.mjs';
+
+const getStyleForContentSlot = (slot) => slot === "top" ? styles.topContent : slot === "bottom" ? styles.bottomContent : styles.topContent;
+const ListItemViewContent = (props) => {
+  const {
+    children,
+    avatar,
+    title,
+    subTitle,
+    button,
+    bottom,
+    checkbox,
+    viewMode,
+    s,
+    m,
+    l
+  } = props;
+  const contentProps = {
+    bottom: {
+      onMouseDown: (e) => e.stopPropagation(),
+      onPointerDown: (e) => e.stopPropagation(),
+      className: styles.bottomContent
+    },
+    top: {
+      className: styles.topContent
+    }
+  };
+  const propsContext = {
+    ContextMenu: {
+      placement: "bottom end"
+    },
+    Button: {
+      className: styles.action
+    },
+    ActionGroup: {
+      className: styles.action
+    },
+    Content: {
+      className: dynamic((p) => getStyleForContentSlot(p.slot)),
+      onMouseDown: dynamic((p) => contentProps[p.slot ?? "top"]?.onMouseDown),
+      onPointerDown: dynamic(
+        (p) => contentProps[p.slot ?? "top"]?.onPointerDown
+      )
+    },
+    Avatar: {
+      className: styles.avatar
+    },
+    Heading: {
+      className: styles.heading,
+      level: 5,
+      Badge: { className: styles.badge },
+      AlertBadge: { className: styles.badge }
+    },
+    Text: {
+      className: styles.text
+    },
+    Link: {
+      unstyled: true
+    }
+  };
+  const className = clsx(
+    styles.view,
+    viewMode === "tiles" ? styles.tileView : styles.listView
+  );
+  const header = /* @__PURE__ */ jsxs("div", { className: styles.header, children: [
+    /* @__PURE__ */ jsx("div", { className: styles.checkboxContainer, children: checkbox }),
+    avatar,
+    /* @__PURE__ */ jsxs("div", { className: styles.title, children: [
+      title,
+      /* @__PURE__ */ jsx("div", { className: styles.subTitle, children: subTitle })
+    ] })
+  ] });
+  const innerListContent = /* @__PURE__ */ jsxs(Fragment, { children: [
+    header,
+    children
+  ] });
+  const listColumnsContentView = /* @__PURE__ */ jsx(
+    ColumnLayout,
+    {
+      s,
+      m,
+      l,
+      className: clsx(styles.content, styles.columnLayout),
+      children: innerListContent
+    }
+  );
+  const listDefaultContentView = /* @__PURE__ */ jsx("div", { className: styles.content, children: innerListContent });
+  const listView = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: styles.contentWrapper, children: [
+      s || m || l ? listColumnsContentView : listDefaultContentView,
+      button
+    ] }),
+    bottom
+  ] });
+  const tilesViews = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: styles.avatarContainer, children: avatar }),
+    /* @__PURE__ */ jsxs("div", { className: styles.content, children: [
+      /* @__PURE__ */ jsxs("div", { className: styles.header, children: [
+        /* @__PURE__ */ jsx("div", { className: styles.checkboxContainer, children: checkbox }),
+        /* @__PURE__ */ jsxs("div", { className: styles.title, children: [
+          title,
+          /* @__PURE__ */ jsx("div", { className: styles.subTitle, children: subTitle })
+        ] }),
+        button
+      ] }),
+      children,
+      bottom
+    ] })
+  ] });
+  return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsxs(PropsContextProvider, { props: propsContext, children: [
+    viewMode === "list" && listView,
+    viewMode === "tiles" && tilesViews
+  ] }) });
+};
+
+export { ListItemViewContent, ListItemViewContent as default };
+//# sourceMappingURL=ListItemViewContent.mjs.map

package/dist/js/components/src/components/List/components/ListItemView/components/ListItemViewContent/ListItemViewContent.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemViewContent.mjs","sources":["../../../../../../../../../../src/components/List/components/ListItemView/components/ListItemViewContent/ListItemViewContent.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren, ReactNode } from \"react\";\nimport styles from \"../../ListItemView.module.scss\";\nimport {\n  dynamic,\n  type PropsContext,\n  PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport type { ListViewMode } from \"@/components/List/model/types\";\nimport clsx from \"clsx\";\nimport {\n  ColumnLayout,\n  type ColumnLayoutProps,\n} from \"@/components/ColumnLayout\";\n\nexport type ListItemViewContentProps = PropsWithChildren &\n  Pick<ColumnLayoutProps, \"s\" | \"m\" | \"l\"> & {\n    title?: ReactNode;\n    subTitle?: ReactNode;\n    avatar?: ReactNode;\n    button?: ReactNode;\n    bottom?: ReactNode;\n    checkbox?: ReactNode;\n    viewMode?: ListViewMode;\n  };\n\nconst getStyleForContentSlot = (slot?: string) =>\n  slot === \"top\"\n    ? styles.topContent\n    : slot === \"bottom\"\n      ? styles.bottomContent\n      : styles.topContent;\n\n/** @flr-generate all */\nexport const ListItemViewContent = (props: ListItemViewContentProps) => {\n  const {\n    children,\n    avatar,\n    title,\n    subTitle,\n    button,\n    bottom,\n    checkbox,\n    viewMode,\n    s,\n    m,\n    l,\n  } = props;\n\n  const contentProps: Record<string, ComponentProps<\"div\">> = {\n    bottom: {\n      onMouseDown: (e) => e.stopPropagation(),\n      onPointerDown: (e) => e.stopPropagation(),\n      className: styles.bottomContent,\n    },\n    top: {\n      className: styles.topContent,\n    },\n  };\n\n  const propsContext: PropsContext = {\n    ContextMenu: {\n      placement: \"bottom end\",\n    },\n    Button: {\n      className: styles.action,\n    },\n    ActionGroup: {\n      className: styles.action,\n    },\n    Content: {\n      className: dynamic((p) => getStyleForContentSlot(p.slot)),\n      onMouseDown: dynamic((p) => contentProps[p.slot ?? \"top\"]?.onMouseDown),\n      onPointerDown: dynamic(\n        (p) => contentProps[p.slot ?? \"top\"]?.onPointerDown,\n      ),\n    },\n    Avatar: {\n      className: styles.avatar,\n    },\n    Heading: {\n      className: styles.heading,\n      level: 5,\n      Badge: { className: styles.badge },\n      AlertBadge: { className: styles.badge },\n    },\n    Text: {\n      className: styles.text,\n    },\n    Link: {\n      unstyled: true,\n    },\n  };\n\n  const className = clsx(\n    styles.view,\n    viewMode === \"tiles\" ? styles.tileView : styles.listView,\n  );\n\n  const header = (\n    <div className={styles.header}>\n      <div className={styles.checkboxContainer}>{checkbox}</div>\n      {avatar}\n      <div className={styles.title}>\n        {title}\n        <div className={styles.subTitle}>{subTitle}</div>\n      </div>\n    </div>\n  );\n\n  const innerListContent = (\n    <>\n      {header}\n      {children}\n    </>\n  );\n\n  const listColumnsContentView = (\n    <ColumnLayout\n      s={s}\n      m={m}\n      l={l}\n      className={clsx(styles.content, styles.columnLayout)}\n    >\n      {innerListContent}\n    </ColumnLayout>\n  );\n\n  const listDefaultContentView = (\n    <div className={styles.content}>{innerListContent}</div>\n  );\n\n  const listView = (\n    <>\n      <div className={styles.contentWrapper}>\n        {s || m || l ? listColumnsContentView : listDefaultContentView}\n        {button}\n      </div>\n      {bottom}\n    </>\n  );\n\n  const tilesViews = (\n    <>\n      <div className={styles.avatarContainer}>{avatar}</div>\n      <div className={styles.content}>\n        <div className={styles.header}>\n          <div className={styles.checkboxContainer}>{checkbox}</div>\n          <div className={styles.title}>\n            {title}\n            <div className={styles.subTitle}>{subTitle}</div>\n          </div>\n          {button}\n        </div>\n        {children}\n        {bottom}\n      </div>\n    </>\n  );\n\n  return (\n    <div className={className}>\n      <PropsContextProvider props={propsContext}>\n        {viewMode === \"list\" && listView}\n        {viewMode === \"tiles\" && tilesViews}\n      </PropsContextProvider>\n    </div>\n  );\n};\n\nexport default ListItemViewContent;\n"],"names":[],"mappings":";;;;;;;;AAyBA,MAAM,sBAAA,GAAyB,CAAC,IAAA,KAC9B,IAAA,KAAS,KAAA,GACL,MAAA,CAAO,UAAA,GACP,IAAA,KAAS,QAAA,GACP,MAAA,CAAO,aAAA,GACP,MAAA,CAAO,UAAA;AAGR,MAAM,mBAAA,GAAsB,CAAC,KAAA,KAAoC;AACtE,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,MAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA,MAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,CAAA;AAAA,IACA,CAAA;AAAA,IACA;AAAA,GACF,GAAI,KAAA;AAEJ,EAAA,MAAM,YAAA,GAAsD;AAAA,IAC1D,MAAA,EAAQ;AAAA,MACN,WAAA,EAAa,CAAC,CAAA,KAAM,CAAA,CAAE,eAAA,EAAgB;AAAA,MACtC,aAAA,EAAe,CAAC,CAAA,KAAM,CAAA,CAAE,eAAA,EAAgB;AAAA,MACxC,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,GAAA,EAAK;AAAA,MACH,WAAW,MAAA,CAAO;AAAA;AACpB,GACF;AAEA,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,WAAA,EAAa;AAAA,MACX,SAAA,EAAW;AAAA,KACb;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,WAAA,EAAa;AAAA,MACX,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,OAAA,EAAS;AAAA,MACP,WAAW,OAAA,CAAQ,CAAC,MAAM,sBAAA,CAAuB,CAAA,CAAE,IAAI,CAAC,CAAA;AAAA,MACxD,WAAA,EAAa,QAAQ,CAAC,CAAA,KAAM,aAAa,CAAA,CAAE,IAAA,IAAQ,KAAK,CAAA,EAAG,WAAW,CAAA;AAAA,MACtE,aAAA,EAAe,OAAA;AAAA,QACb,CAAC,CAAA,KAAM,YAAA,CAAa,CAAA,CAAE,IAAA,IAAQ,KAAK,CAAA,EAAG;AAAA;AACxC,KACF;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,OAAA,EAAS;AAAA,MACP,WAAW,MAAA,CAAO,OAAA;AAAA,MAClB,KAAA,EAAO,CAAA;AAAA,MACP,KAAA,EAAO,EAAE,SAAA,EAAW,MAAA,CAAO,KAAA,EAAM;AAAA,MACjC,UAAA,EAAY,EAAE,SAAA,EAAW,MAAA,CAAO,KAAA;AAAM,KACxC;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,QAAA,EAAU;AAAA;AACZ,GACF;AAEA,EAAA,MAAM,SAAA,GAAY,IAAA;AAAA,IAChB,MAAA,CAAO,IAAA;AAAA,IACP,QAAA,KAAa,OAAA,GAAU,MAAA,CAAO,QAAA,GAAW,MAAA,CAAO;AAAA,GAClD;AAEA,EAAA,MAAM,MAAA,mBACJ,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAO,MAAA,EACrB,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,iBAAA,EAAoB,QAAA,EAAA,QAAA,EAAS,CAAA;AAAA,IACnD,MAAA;AAAA,oBACD,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,KAAA,EACpB,QAAA,EAAA;AAAA,MAAA,KAAA;AAAA,sBACD,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,UAAW,QAAA,EAAA,QAAA,EAAS;AAAA,KAAA,EAC7C;AAAA,GAAA,EACF,CAAA;AAGF,EAAA,MAAM,mCACJ,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,IAAA,MAAA;AAAA,IACA;AAAA,GAAA,EACH,CAAA;AAGF,EAAA,MAAM,sBAAA,mBACJ,GAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,CAAA;AAAA,MACA,CAAA;AAAA,MACA,CAAA;AAAA,MACA,SAAA,EAAW,IAAA,CAAK,MAAA,CAAO,OAAA,EAAS,OAAO,YAAY,CAAA;AAAA,MAElD,QAAA,EAAA;AAAA;AAAA,GACH;AAGF,EAAA,MAAM,yCACJ,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,SAAU,QAAA,EAAA,gBAAA,EAAiB,CAAA;AAGpD,EAAA,MAAM,2BACJ,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,cAAA,EACpB,QAAA,EAAA;AAAA,MAAA,CAAA,IAAK,CAAA,IAAK,IAAI,sBAAA,GAAyB,sBAAA;AAAA,MACvC;AAAA,KAAA,EACH,CAAA;AAAA,IACC;AAAA,GAAA,EACH,CAAA;AAGF,EAAA,MAAM,6BACJ,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,eAAA,EAAkB,QAAA,EAAA,MAAA,EAAO,CAAA;AAAA,oBAChD,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,OAAA,EACrB,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,MAAA,EACrB,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,iBAAA,EAAoB,QAAA,EAAA,QAAA,EAAS,CAAA;AAAA,wBACpD,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,KAAA,EACpB,QAAA,EAAA;AAAA,UAAA,KAAA;AAAA,0BACD,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,UAAW,QAAA,EAAA,QAAA,EAAS;AAAA,SAAA,EAC7C,CAAA;AAAA,QACC;AAAA,OAAA,EACH,CAAA;AAAA,MACC,QAAA;AAAA,MACA;AAAA,KAAA,EACH;AAAA,GAAA,EACF,CAAA;AAGF,EAAA,2BACG,KAAA,EAAA,EAAI,SAAA,EACH,QAAA,kBAAA,IAAA,CAAC,oBAAA,EAAA,EAAqB,OAAO,YAAA,EAC1B,QAAA,EAAA;AAAA,IAAA,QAAA,KAAa,MAAA,IAAU,QAAA;AAAA,IACvB,aAAa,OAAA,IAAW;AAAA,GAAA,EAC3B,CAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/js/components/src/components/List/components/ListSummary/ListSummary.mjs

@@ -0,0 +1,34 @@
+"use client"
+/* */
+import { jsx } from 'react/jsx-runtime';
+import 'react';
+import styles from './ListSummary.module.scss.mjs';
+import { flowComponent } from '../../../../lib/componentFactory/flowComponent.mjs';
+import clsx from 'clsx';
+
+const ListSummary = flowComponent("ListSummary", (props) => {
+  const { children, position = "top", ref } = props;
+  if (position === "bottom") {
+    return /* @__PURE__ */ jsx(
+      "footer",
+      {
+        ref,
+        className: clsx(styles.listSummary, styles.bottom),
+        ...props,
+        children
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "header",
+    {
+      ref,
+      className: clsx(styles.listSummary, styles.top),
+      ...props,
+      children
+    }
+  );
+});
+
+export { ListSummary, ListSummary as default };
+//# sourceMappingURL=ListSummary.mjs.map

package/dist/js/components/src/components/List/components/ListSummary/ListSummary.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListSummary.mjs","sources":["../../../../../../../../src/components/List/components/ListSummary/ListSummary.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport React from \"react\";\nimport styles from \"./ListSummary.module.scss\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport clsx from \"clsx\";\n\nexport interface ListSummaryProps\n  extends FlowComponentProps,\n    PropsWithChildren {\n  /** Whether the summary is placed above or underneath the list @default: \"top\" */\n  position?: \"top\" | \"bottom\";\n}\n\n/** @flr-generate all */\nexport const ListSummary = flowComponent(\"ListSummary\", (props) => {\n  const { children, position = \"top\", ref } = props;\n\n  if (position === \"bottom\") {\n    return (\n      <footer\n        ref={ref}\n        className={clsx(styles.listSummary, styles.bottom)}\n        {...props}\n      >\n        {children}\n      </footer>\n    );\n  }\n\n  return (\n    <header\n      ref={ref}\n      className={clsx(styles.listSummary, styles.top)}\n      {...props}\n    >\n      {children}\n    </header>\n  );\n});\n\nexport default ListSummary;\n"],"names":[],"mappings":";;;;;;AAeO,MAAM,WAAA,GAAc,aAAA,CAAc,aAAA,EAAe,CAAC,KAAA,KAAU;AACjE,EAAA,MAAM,EAAE,QAAA,EAAU,QAAA,GAAW,KAAA,EAAO,KAAI,GAAI,KAAA;AAE5C,EAAA,IAAI,aAAa,QAAA,EAAU;AACzB,IAAA,uBACE,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,IAAA,CAAK,MAAA,CAAO,WAAA,EAAa,OAAO,MAAM,CAAA;AAAA,QAChD,GAAG,KAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,IAAA,CAAK,MAAA,CAAO,WAAA,EAAa,OAAO,GAAG,CAAA;AAAA,MAC7C,GAAG,KAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}

package/dist/js/components/src/components/List/components/ListSummary/ListSummary.module.scss.mjs

@@ -0,0 +1,13 @@
+"use client"
+/* */
+const listSummary = "flow--list--list-summary";
+const top = "flow--list--list-summary--top";
+const bottom = "flow--list--list-summary--bottom";
+const styles = {
+	listSummary: listSummary,
+	top: top,
+	bottom: bottom
+};
+
+export { bottom, styles as default, listSummary, top };
+//# sourceMappingURL=ListSummary.module.scss.mjs.map

package/dist/js/components/src/components/List/components/ListSummary/ListSummary.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListSummary.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}

package/dist/js/components/src/components/List/components/Table/Table.mjs

@@ -0,0 +1,87 @@
+"use client"
+/* */
+import { jsx, jsxs } from 'react/jsx-runtime';
+import 'invariant';
+import 'react-aria-components';
+import 'react';
+import clsx from 'clsx';
+import '../../../../lib/propsContext/propsContext.mjs';
+import '../../../../lib/propsContext/components/PropsContextProvider.mjs';
+import '@tabler/icons-react';
+import '../../../Icon/Icon.mjs';
+import '../../../../views/IconView.mjs';
+import '../../../Heading/Heading.mjs';
+import '../../../Text/Text.mjs';
+import 'react-aria';
+import '@mittwald/react-tunnel';
+import '../../../../views/ListItemViewContentView.mjs';
+import '../../../../views/ButtonView.mjs';
+import '../../../../views/ContextMenuTriggerView.mjs';
+import '../../../ColumnLayout/ColumnLayout.mjs';
+import '../ListSummary/ListSummary.mjs';
+import { useList } from '../../hooks/useList.mjs';
+import '../../listContext.mjs';
+import 'mobx';
+import '../../List.mjs';
+import styles from './Table.module.css.mjs';
+import ListEmptyViewView from '../../../../views/ListEmptyViewView.mjs';
+import TableView from '../../../../views/TableView.mjs';
+import TableHeaderView from '../../../../views/TableHeaderView.mjs';
+import TableBodyView from '../../../../views/TableBodyView.mjs';
+import TableRowView from '../../../../views/TableRowView.mjs';
+import TableCellView from '../../../../views/TableCellView.mjs';
+import TableColumnView from '../../../../views/TableColumnView.mjs';
+import { TableBodyLoadingView } from './components/TableBodyLoadingView.mjs';
+
+const Table = () => {
+  const list = useList();
+  const table = list.table;
+  const listIsEmpty = list.useIsEmpty();
+  const isLoading = list.loader.useIsLoading();
+  const isInitiallyLoading = list.loader.useIsInitiallyLoading();
+  if (!table) {
+    return null;
+  }
+  if (listIsEmpty) {
+    return /* @__PURE__ */ jsx(ListEmptyViewView, {});
+  }
+  const rowAction = table.list.onAction;
+  const tableClassName = clsx(
+    styles.table,
+    isLoading && styles.isLoading,
+    table.componentProps.className
+  );
+  const rows = list.items.entries.map((item) => /* @__PURE__ */ jsx(
+    TableRowView,
+    {
+      className: (props) => clsx(
+        styles.row,
+        rowAction && styles.hasAction,
+        table.body.row.componentProps.className,
+        props.isSelected && styles.isSelected
+      ),
+      id: item.id,
+      onAction: rowAction ? () => rowAction(item.data) : void 0,
+      ...table.body.row.componentProps,
+      children: table.body.row?.cells.map((cell, i) => /* @__PURE__ */ jsx(TableCellView, { ...cell.componentProps, children: cell.renderFn ? cell.renderFn(item.data, list) : void 0 }, i))
+    },
+    item.id
+  ));
+  return /* @__PURE__ */ jsxs(
+    TableView,
+    {
+      ...list.componentProps,
+      ...table.componentProps,
+      className: tableClassName,
+      "aria-hidden": isInitiallyLoading,
+      "aria-busy": isLoading,
+      children: [
+        /* @__PURE__ */ jsx(TableHeaderView, { ...table.header.componentProps, children: table.header.columns.map((col, i) => /* @__PURE__ */ jsx(TableColumnView, { ...col.componentProps }, i)) }),
+        /* @__PURE__ */ jsx(TableBodyView, { ...table.body.componentProps, children: isInitiallyLoading ? /* @__PURE__ */ jsx(TableBodyLoadingView, {}) : rows })
+      ]
+    }
+  );
+};
+
+export { Table };
+//# sourceMappingURL=Table.mjs.map

package/dist/js/components/src/components/List/components/Table/Table.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.mjs","sources":["../../../../../../../../src/components/List/components/Table/Table.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useList } from \"@/components/List\";\nimport styles from \"./Table.module.css\";\nimport clsx from \"clsx\";\nimport ListEmptyViewView from \"@/views/ListEmptyViewView\";\nimport TableView from \"@/views/TableView\";\nimport TableHeaderView from \"@/views/TableHeaderView\";\nimport TableBodyView from \"@/views/TableBodyView\";\nimport TableRowView from \"@/views/TableRowView\";\nimport TableCellView from \"@/views/TableCellView\";\nimport TableColumnView from \"@/views/TableColumnView\";\nimport { TableBodyLoadingView } from \"@/components/List/components/Table/components/TableBodyLoadingView\";\n\nexport const Table: FC = () => {\n  const list = useList();\n  const table = list.table;\n  const listIsEmpty = list.useIsEmpty();\n\n  const isLoading = list.loader.useIsLoading();\n  const isInitiallyLoading = list.loader.useIsInitiallyLoading();\n\n  if (!table) {\n    return null;\n  }\n\n  if (listIsEmpty) {\n    return <ListEmptyViewView />;\n  }\n\n  const rowAction = table.list.onAction;\n\n  const tableClassName = clsx(\n    styles.table,\n    isLoading && styles.isLoading,\n    table.componentProps.className,\n  );\n\n  const rows = list.items.entries.map((item) => (\n    <TableRowView\n      className={(props) =>\n        clsx(\n          styles.row,\n          rowAction && styles.hasAction,\n          table.body.row.componentProps.className,\n          props.isSelected && styles.isSelected,\n        )\n      }\n      key={item.id}\n      id={item.id}\n      onAction={rowAction ? () => rowAction(item.data) : undefined}\n      {...table.body.row.componentProps}\n    >\n      {table.body.row?.cells.map((cell, i) => (\n        <TableCellView key={i} {...cell.componentProps}>\n          {cell.renderFn ? cell.renderFn(item.data, list) : undefined}\n        </TableCellView>\n      ))}\n    </TableRowView>\n  ));\n\n  return (\n    <TableView\n      {...list.componentProps}\n      {...table.componentProps}\n      className={tableClassName}\n      aria-hidden={isInitiallyLoading}\n      aria-busy={isLoading}\n    >\n      <TableHeaderView {...table.header.componentProps}>\n        {table.header.columns.map((col, i) => (\n          <TableColumnView key={i} {...col.componentProps} />\n        ))}\n      </TableHeaderView>\n      <TableBodyView {...table.body.componentProps}>\n        {isInitiallyLoading ? <TableBodyLoadingView /> : rows}\n      </TableBodyView>\n    </TableView>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaO,MAAM,QAAY,MAAM;AAC7B,EAAA,MAAM,OAAO,OAAA,EAAQ;AACrB,EAAA,MAAM,QAAQ,IAAA,CAAK,KAAA;AACnB,EAAA,MAAM,WAAA,GAAc,KAAK,UAAA,EAAW;AAEpC,EAAA,MAAM,SAAA,GAAY,IAAA,CAAK,MAAA,CAAO,YAAA,EAAa;AAC3C,EAAA,MAAM,kBAAA,GAAqB,IAAA,CAAK,MAAA,CAAO,qBAAA,EAAsB;AAE7D,EAAA,IAAI,CAAC,KAAA,EAAO;AACV,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,IAAI,WAAA,EAAa;AACf,IAAA,2BAAQ,iBAAA,EAAA,EAAkB,CAAA;AAAA,EAC5B;AAEA,EAAA,MAAM,SAAA,GAAY,MAAM,IAAA,CAAK,QAAA;AAE7B,EAAA,MAAM,cAAA,GAAiB,IAAA;AAAA,IACrB,MAAA,CAAO,KAAA;AAAA,IACP,aAAa,MAAA,CAAO,SAAA;AAAA,IACpB,MAAM,cAAA,CAAe;AAAA,GACvB;AAEA,EAAA,MAAM,OAAO,IAAA,CAAK,KAAA,CAAM,OAAA,CAAQ,GAAA,CAAI,CAAC,IAAA,qBACnC,GAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,CAAC,KAAA,KACV,IAAA;AAAA,QACE,MAAA,CAAO,GAAA;AAAA,QACP,aAAa,MAAA,CAAO,SAAA;AAAA,QACpB,KAAA,CAAM,IAAA,CAAK,GAAA,CAAI,cAAA,CAAe,SAAA;AAAA,QAC9B,KAAA,CAAM,cAAc,MAAA,CAAO;AAAA,OAC7B;AAAA,MAGF,IAAI,IAAA,CAAK,EAAA;AAAA,MACT,UAAU,SAAA,GAAY,MAAM,SAAA,CAAU,IAAA,CAAK,IAAI,CAAA,GAAI,MAAA;AAAA,MAClD,GAAG,KAAA,CAAM,IAAA,CAAK,GAAA,CAAI,cAAA;AAAA,MAElB,QAAA,EAAA,KAAA,CAAM,KAAK,GAAA,EAAK,KAAA,CAAM,IAAI,CAAC,IAAA,EAAM,CAAA,qBAChC,GAAA,CAAC,aAAA,EAAA,EAAuB,GAAG,KAAK,cAAA,EAC7B,QAAA,EAAA,IAAA,CAAK,QAAA,GAAW,IAAA,CAAK,QAAA,CAAS,IAAA,CAAK,MAAM,IAAI,CAAA,GAAI,MAAA,EAAA,EADhC,CAEpB,CACD;AAAA,KAAA;AAAA,IATI,IAAA,CAAK;AAAA,GAWb,CAAA;AAED,EAAA,uBACE,IAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA,CAAK,cAAA;AAAA,MACR,GAAG,KAAA,CAAM,cAAA;AAAA,MACV,SAAA,EAAW,cAAA;AAAA,MACX,aAAA,EAAa,kBAAA;AAAA,MACb,WAAA,EAAW,SAAA;AAAA,MAEX,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,mBAAiB,GAAG,KAAA,CAAM,OAAO,cAAA,EAC/B,QAAA,EAAA,KAAA,CAAM,OAAO,OAAA,CAAQ,GAAA,CAAI,CAAC,GAAA,EAAK,CAAA,yBAC7B,eAAA,EAAA,EAAyB,GAAG,IAAI,cAAA,EAAA,EAAX,CAA2B,CAClD,CAAA,EACH,CAAA;AAAA,wBACA,GAAA,CAAC,aAAA,EAAA,EAAe,GAAG,KAAA,CAAM,IAAA,CAAK,gBAC3B,QAAA,EAAA,kBAAA,mBAAqB,GAAA,CAAC,oBAAA,EAAA,EAAqB,CAAA,GAAK,IAAA,EACnD;AAAA;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/js/components/src/components/List/components/Table/components/TableBodyLoadingView.mjs

@@ -0,0 +1,13 @@
+"use client"
+/* */
+import { jsx, Fragment } from 'react/jsx-runtime';
+import { TableRowSkeletonView } from './TableRowSkeletonView.mjs';
+import { useList } from '../../../hooks/useList.mjs';
+
+const TableBodyLoadingView = () => {
+  const list = useList();
+  return /* @__PURE__ */ jsx(Fragment, { children: Array.from(Array(list.loadingItemsCount)).map((_, i) => /* @__PURE__ */ jsx(TableRowSkeletonView, {}, i)) });
+};
+
+export { TableBodyLoadingView };
+//# sourceMappingURL=TableBodyLoadingView.mjs.map

package/dist/js/components/src/components/List/components/Table/components/TableBodyLoadingView.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableBodyLoadingView.mjs","sources":["../../../../../../../../../src/components/List/components/Table/components/TableBodyLoadingView.tsx"],"sourcesContent":["import { TableRowSkeletonView } from \"@/components/List/components/Table/components/TableRowSkeletonView\";\nimport { useList } from \"@/components/List/hooks/useList\";\nimport type { FC } from \"react\";\n\nexport const TableBodyLoadingView: FC = () => {\n  const list = useList();\n\n  return (\n    <>\n      {Array.from(Array(list.loadingItemsCount)).map((_, i) => (\n        <TableRowSkeletonView key={i} />\n      ))}\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;AAIO,MAAM,uBAA2B,MAAM;AAC5C,EAAA,MAAM,OAAO,OAAA,EAAQ;AAErB,EAAA,uCAEK,QAAA,EAAA,KAAA,CAAM,IAAA,CAAK,KAAA,CAAM,IAAA,CAAK,iBAAiB,CAAC,CAAA,CAAE,GAAA,CAAI,CAAC,GAAG,CAAA,qBACjD,GAAA,CAAC,oBAAA,EAAA,EAAA,EAA0B,CAAG,CAC/B,CAAA,EACH,CAAA;AAEJ;;;;"}

package/dist/js/components/src/components/List/components/Table/components/TableRowSkeletonView.mjs

@@ -0,0 +1,24 @@
+"use client"
+/* */
+import { jsx } from 'react/jsx-runtime';
+import { useList } from '../../../hooks/useList.mjs';
+import TableRowView from '../../../../../views/TableRowView.mjs';
+import clsx from 'clsx';
+import styles from '../Table.module.css.mjs';
+import invariant from 'invariant';
+import TableCellView from '../../../../../views/TableCellView.mjs';
+import SkeletonTextView from '../../../../../views/SkeletonTextView.mjs';
+
+const TableRowSkeletonView = () => {
+  const list = useList();
+  const table = list.table;
+  invariant(
+    !!table,
+    "TableRowSkeletonView must be used within a Table component"
+  );
+  const className = clsx(styles.row, table.body.row.componentProps.className);
+  return /* @__PURE__ */ jsx(TableRowView, { ...table.body.row.componentProps, className, children: table.body.row?.cells.map((cell, i) => /* @__PURE__ */ jsx(TableCellView, { ...cell.componentProps, children: cell.loadingView ?? /* @__PURE__ */ jsx(SkeletonTextView, { width: "10em" }) }, i)) });
+};
+
+export { TableRowSkeletonView };
+//# sourceMappingURL=TableRowSkeletonView.mjs.map

package/dist/js/components/src/components/List/components/Table/components/TableRowSkeletonView.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableRowSkeletonView.mjs","sources":["../../../../../../../../../src/components/List/components/Table/components/TableRowSkeletonView.tsx"],"sourcesContent":["import { useList } from \"@/components/List/hooks/useList\";\nimport TableRowView from \"@/views/TableRowView\";\nimport clsx from \"clsx\";\nimport type { FC } from \"react\";\nimport styles from \"../Table.module.css\";\nimport invariant from \"invariant\";\nimport TableCellView from \"@/views/TableCellView\";\nimport SkeletonTextView from \"@/views/SkeletonTextView\";\n\nexport const TableRowSkeletonView: FC = () => {\n  const list = useList();\n  const table = list.table;\n\n  invariant(\n    !!table,\n    \"TableRowSkeletonView must be used within a Table component\",\n  );\n\n  const className = clsx(styles.row, table.body.row.componentProps.className);\n\n  return (\n    <TableRowView {...table.body.row.componentProps} className={className}>\n      {table.body.row?.cells.map((cell, i) => (\n        <TableCellView key={i} {...cell.componentProps}>\n          {cell.loadingView ?? <SkeletonTextView width=\"10em\" />}\n        </TableCellView>\n      ))}\n    </TableRowView>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AASO,MAAM,uBAA2B,MAAM;AAC5C,EAAA,MAAM,OAAO,OAAA,EAAQ;AACrB,EAAA,MAAM,QAAQ,IAAA,CAAK,KAAA;AAEnB,EAAA,SAAA;AAAA,IACE,CAAC,CAAC,KAAA;AAAA,IACF;AAAA,GACF;AAEA,EAAA,MAAM,SAAA,GAAY,KAAK,MAAA,CAAO,GAAA,EAAK,MAAM,IAAA,CAAK,GAAA,CAAI,eAAe,SAAS,CAAA;AAE1E,EAAA,uBACE,GAAA,CAAC,YAAA,EAAA,EAAc,GAAG,KAAA,CAAM,IAAA,CAAK,GAAA,CAAI,cAAA,EAAgB,SAAA,EAC9C,QAAA,EAAA,KAAA,CAAM,IAAA,CAAK,GAAA,EAAK,KAAA,CAAM,IAAI,CAAC,IAAA,EAAM,CAAA,qBAChC,GAAA,CAAC,aAAA,EAAA,EAAuB,GAAG,IAAA,CAAK,cAAA,EAC7B,QAAA,EAAA,IAAA,CAAK,WAAA,oBAAe,GAAA,CAAC,gBAAA,EAAA,EAAiB,KAAA,EAAM,MAAA,EAAO,CAAA,EAAA,EADlC,CAEpB,CACD,CAAA,EACH,CAAA;AAEJ;;;;"}

package/dist/js/components/src/components/List/hooks/useAriaAnnounceSearchState.mjs

@@ -0,0 +1,35 @@
+"use client"
+/* */
+import { useLocalizedStringFormatter } from 'react-aria';
+import locales from '../../../../../_virtual/_.locale.json@8d5024994f97657f895a4e2a188d2d8a.mjs';
+import { announce } from '@react-aria/live-announcer';
+import { useDebounceCallback } from 'usehooks-ts';
+import { useEffect } from 'react';
+import { useList } from './useList.mjs';
+
+const announceDebounceMs = 600;
+const useAriaAnnounceSearchState = () => {
+  const formatter = useLocalizedStringFormatter(locales);
+  const list = useList();
+  const debouncedAnnounce = useDebounceCallback(announce, announceDebounceMs);
+  const searchTerm = list.search?.value;
+  const resultCount = list.batches.getTotalItemsCount();
+  const isLoading = list.loader.loaderState.useIsLoading();
+  useEffect(() => {
+    if (isLoading || !searchTerm) {
+      debouncedAnnounce.cancel();
+      return;
+    }
+    const text = formatter.format(
+      resultCount > 0 ? "list.search.announce.result" : "list.search.announce.noResult",
+      {
+        resultCount,
+        searchTerm
+      }
+    );
+    debouncedAnnounce(text, "polite");
+  }, [searchTerm, resultCount, isLoading]);
+};
+
+export { useAriaAnnounceSearchState };
+//# sourceMappingURL=useAriaAnnounceSearchState.mjs.map

package/dist/js/components/src/components/List/hooks/useAriaAnnounceSearchState.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAriaAnnounceSearchState.mjs","sources":["../../../../../../../src/components/List/hooks/useAriaAnnounceSearchState.ts"],"sourcesContent":["import { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"../locales/*.locale.json\";\nimport { announce } from \"@react-aria/live-announcer\";\nimport { useDebounceCallback } from \"usehooks-ts\";\nimport { useEffect } from \"react\";\nimport { useList } from \"@/components/List/hooks/useList\";\n\nconst announceDebounceMs = 600;\n\nexport const useAriaAnnounceSearchState = (): void => {\n  const formatter = useLocalizedStringFormatter(locales);\n  const list = useList();\n  const debouncedAnnounce = useDebounceCallback(announce, announceDebounceMs);\n\n  const searchTerm = list.search?.value;\n  const resultCount = list.batches.getTotalItemsCount();\n  const isLoading = list.loader.loaderState.useIsLoading();\n\n  useEffect(() => {\n    if (isLoading || !searchTerm) {\n      debouncedAnnounce.cancel();\n      return;\n    }\n\n    const text = formatter.format(\n      resultCount > 0\n        ? \"list.search.announce.result\"\n        : \"list.search.announce.noResult\",\n      {\n        resultCount,\n        searchTerm,\n      },\n    );\n\n    debouncedAnnounce(text, \"polite\");\n  }, [searchTerm, resultCount, isLoading]);\n};\n"],"names":[],"mappings":";;;;;;;AAOA,MAAM,kBAAA,GAAqB,GAAA;AAEpB,MAAM,6BAA6B,MAAY;AACpD,EAAA,MAAM,SAAA,GAAY,4BAA4B,OAAO,CAAA;AACrD,EAAA,MAAM,OAAO,OAAA,EAAQ;AACrB,EAAA,MAAM,iBAAA,GAAoB,mBAAA,CAAoB,QAAA,EAAU,kBAAkB,CAAA;AAE1E,EAAA,MAAM,UAAA,GAAa,KAAK,MAAA,EAAQ,KAAA;AAChC,EAAA,MAAM,WAAA,GAAc,IAAA,CAAK,OAAA,CAAQ,kBAAA,EAAmB;AACpD,EAAA,MAAM,SAAA,GAAY,IAAA,CAAK,MAAA,CAAO,WAAA,CAAY,YAAA,EAAa;AAEvD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,SAAA,IAAa,CAAC,UAAA,EAAY;AAC5B,MAAA,iBAAA,CAAkB,MAAA,EAAO;AACzB,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,OAAO,SAAA,CAAU,MAAA;AAAA,MACrB,WAAA,GAAc,IACV,6BAAA,GACA,+BAAA;AAAA,MACJ;AAAA,QACE,WAAA;AAAA,QACA;AAAA;AACF,KACF;AAEA,IAAA,iBAAA,CAAkB,MAAM,QAAQ,CAAA;AAAA,EAClC,CAAA,EAAG,CAAC,UAAA,EAAY,WAAA,EAAa,SAAS,CAAC,CAAA;AACzC;;;;"}

package/dist/js/components/src/components/List/hooks/useList.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useList.mjs","sources":["../../../../../../../src/components/List/hooks/useList.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { listContext } from \"@/components/List/listContext\";\nimport type List from \"@/components/List/model/List\";\n\nexport const useList = <T = never>() =>\n  useContext(listContext).list as unknown as List<T>;\n"],"names":[],"mappings":";;;AAIO,MAAM,OAAA,GAAU,MACrB,UAAA,CAAW,WAAW,CAAA,CAAE;;;;"}

package/dist/js/components/src/components/List/hooks/useListMetadata.mjs

@@ -0,0 +1,16 @@
+"use client"
+/* */
+import { useContext } from 'react';
+import { listContext } from '../listContext.mjs';
+import { useSelector } from '../../../lib/mobx/useSelector.mjs';
+
+function useListMetadata() {
+  const { list } = useContext(listContext);
+  return useSelector(
+    () => list?.loader?.loaderState?.metadata,
+    [list]
+  );
+}
+
+export { useListMetadata };
+//# sourceMappingURL=useListMetadata.mjs.map

package/dist/js/components/src/components/List/hooks/useListMetadata.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useListMetadata.mjs","sources":["../../../../../../../src/components/List/hooks/useListMetadata.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { listContext } from \"../listContext\";\nimport useSelector from \"@/lib/mobx/useSelector\";\n\nexport function useListMetadata<T = unknown>(): T | undefined {\n  const { list } = useContext(listContext);\n  return useSelector(\n    () => list?.loader?.loaderState?.metadata as T | undefined,\n    [list],\n  );\n}\n"],"names":[],"mappings":";;;;AAIO,SAAS,eAAA,GAA8C;AAC5D,EAAA,MAAM,EAAE,IAAA,EAAK,GAAI,UAAA,CAAW,WAAW,CAAA;AACvC,EAAA,OAAO,WAAA;AAAA,IACL,MAAM,IAAA,EAAM,MAAA,EAAQ,WAAA,EAAa,QAAA;AAAA,IACjC,CAAC,IAAI;AAAA,GACP;AACF;;;;"}

package/dist/js/components/src/components/List/listContext.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"listContext.mjs","sources":["../../../../../../src/components/List/listContext.ts"],"sourcesContent":["import { createContext } from \"react\";\nimport type List from \"@/components/List/model/List\";\n\ninterface ListContext {\n  list: List<never>;\n}\n\nexport const listContext = createContext<ListContext>({} as ListContext);\n"],"names":[],"mappings":";;AAOO,MAAM,WAAA,GAAc,aAAA,CAA2B,EAAiB;;;;"}

package/dist/js/components/src/components/List/model/List.mjs

@@ -0,0 +1,185 @@
+"use client"
+/* */
+import { ItemCollection } from './item/ItemCollection.mjs';
+import { BatchesController } from './pagination/BatchesController.mjs';
+import { Filter } from './filter/Filter.mjs';
+import { Sorting } from './sorting/Sorting.mjs';
+import { ReactTable } from './ReactTable.mjs';
+import { IncrementalLoader } from './loading/IncrementalLoader.mjs';
+import invariant from 'invariant';
+import { Search } from './search/Search.mjs';
+import { ItemView } from './item/ItemView.mjs';
+import { Table } from './table/Table.mjs';
+import { useState, useEffect } from 'react';
+import { useSettings } from '../../SettingsProvider/SettingsProvider.mjs';
+import z from 'zod';
+
+class List {
+  static viewModeSettingsStorageSchema = z.enum(["list", "table", "tiles"]).optional();
+  filters;
+  itemView;
+  table;
+  search;
+  sorting;
+  items;
+  reactTable;
+  batches;
+  loader;
+  onAction;
+  accordion;
+  getItemId;
+  componentProps;
+  viewMode;
+  setViewMode;
+  supportsSettingsStorage;
+  settingStorageKey;
+  metadata;
+  settingsStore;
+  viewModeStorageKey;
+  filterSettingsStorageKey;
+  sortingStorageKey;
+  loadingItemsCount;
+  constructor(shape) {
+    const {
+      settingStorageKey,
+      itemView,
+      table,
+      filters = [],
+      sorting = [],
+      batchesController,
+      onChange,
+      loader,
+      search,
+      onAction,
+      getItemId,
+      defaultViewMode,
+      accordion = false,
+      loadingItemsCount = 5,
+      ...componentProps
+    } = shape;
+    this.settingsStore = useSettings();
+    this.settingStorageKey = settingStorageKey;
+    this.filterSettingsStorageKey = settingStorageKey ? `${settingStorageKey}.activeFilters` : void 0;
+    this.viewModeStorageKey = settingStorageKey ? `${settingStorageKey}.viewMode` : void 0;
+    this.sortingStorageKey = settingStorageKey ? `${settingStorageKey}.sorting` : void 0;
+    this.supportsSettingsStorage = !!this.settingStorageKey;
+    this.items = new ItemCollection(this);
+    this.filters = filters.map((shape2) => new Filter(this, shape2));
+    this.sorting = sorting.map((shape2) => new Sorting(this, shape2));
+    this.search = search ? new Search(this, search) : void 0;
+    this.itemView = itemView ? new ItemView(this, itemView) : void 0;
+    this.accordion = accordion;
+    this.table = table ? new Table(this, table) : void 0;
+    this.batches = new BatchesController(this, batchesController);
+    this.componentProps = componentProps;
+    this.loader = IncrementalLoader.useNew(this, loader);
+    this.onAction = onAction;
+    this.getItemId = getItemId;
+    this.loadingItemsCount = loadingItemsCount;
+    this.reactTable = ReactTable.useNew(this, onChange, {
+      manualFiltering: this.loader.manualFiltering,
+      manualPagination: this.loader.manualPagination,
+      manualSorting: this.loader.manualSorting
+    });
+    const [viewMode, setViewMode] = useState(
+      this.getStoredViewModeDefaultSetting() ?? defaultViewMode ?? "list"
+    );
+    this.viewMode = viewMode;
+    this.setViewMode = (viewMode2) => {
+      setViewMode(viewMode2);
+      if (this.settingsStore && this.viewModeStorageKey) {
+        this.settingsStore.set(
+          "List",
+          this.viewModeStorageKey,
+          List.viewModeSettingsStorageSchema,
+          viewMode2
+        );
+      }
+    };
+    useEffect(() => {
+      this.filters.forEach((f) => f.deleteUnknownFilterValues());
+    }, [this.filters]);
+  }
+  get isFiltered() {
+    return this.filters.some((f) => f.isActive()) || !!this.search && this.search.isSet;
+  }
+  get visibleSorting() {
+    return this.sorting.filter((s) => s.defaultEnabled !== "hidden");
+  }
+  static useNew(shape) {
+    return new List(shape);
+  }
+  storeFilterDefaultSettings() {
+    if (this.settingsStore && this.filterSettingsStorageKey) {
+      const data = Object.fromEntries(
+        this.filters.map((f) => [
+          f.property,
+          f.getArrayValue().filter((v) => v.isActive).map((v) => v.id)
+        ])
+      );
+      this.settingsStore.set(
+        "List",
+        this.filterSettingsStorageKey,
+        Filter.settingsStorageSchema,
+        data
+      );
+    }
+  }
+  getStoredFilterDefaultSettings() {
+    if (this.settingsStore && this.filterSettingsStorageKey) {
+      return this.settingsStore.get(
+        "List",
+        this.filterSettingsStorageKey,
+        Filter.settingsStorageSchema
+      );
+    }
+  }
+  getStoredViewModeDefaultSetting() {
+    if (this.settingsStore && this.viewModeStorageKey) {
+      return this.settingsStore.get(
+        "List",
+        this.viewModeStorageKey,
+        List.viewModeSettingsStorageSchema
+      );
+    }
+  }
+  storeSortingSettings(sorting) {
+    if (this.settingsStore && this.sortingStorageKey) {
+      this.settingsStore.set(
+        "List",
+        this.sortingStorageKey,
+        Sorting.storageSchema,
+        { direction: sorting.direction, property: sorting.property }
+      );
+    }
+  }
+  getStoredSortingDefaultSetting() {
+    if (this.settingsStore && this.sortingStorageKey) {
+      return this.settingsStore.get(
+        "List",
+        this.sortingStorageKey,
+        Sorting.storageSchema
+      );
+    }
+  }
+  getSorting(id) {
+    const sorting = this.sorting.find((s) => s.id === id);
+    invariant(!!sorting, `Could not get Sorting (ID: ${id})`);
+    return sorting;
+  }
+  clearSorting() {
+    return this.sorting.forEach((s) => s.clear());
+  }
+  resetFilters() {
+    return this.filters.forEach((f) => f.resetValues());
+  }
+  clearFilters() {
+    return this.filters.forEach((f) => f.clear());
+  }
+  useIsEmpty() {
+    return !this.loader.useIsLoading() && this.items.entries.length === 0;
+  }
+}
+
+export { List, List as default };
+//# sourceMappingURL=List.mjs.map

package/dist/js/components/src/components/List/model/List.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.mjs","sources":["../../../../../../../src/components/List/model/List.ts"],"sourcesContent":["import { ItemCollection } from \"@/components/List/model/item/ItemCollection\";\nimport { BatchesController } from \"@/components/List/model/pagination/BatchesController\";\nimport { Filter } from \"./filter/Filter\";\nimport { Sorting } from \"@/components/List/model/sorting/Sorting\";\nimport ReactTable from \"@/components/List/model/ReactTable\";\nimport type {\n  GetItemId,\n  ItemActionFn,\n  ListShape,\n  ListSupportedComponentProps,\n  ListViewMode,\n} from \"@/components/List/model/types\";\nimport { IncrementalLoader } from \"@/components/List/model/loading/IncrementalLoader\";\nimport invariant from \"invariant\";\nimport { Search } from \"@/components/List/model/search/Search\";\nimport { ItemView } from \"@/components/List/model/item/ItemView\";\nimport { Table } from \"@/components/List/model/table/Table\";\nimport { useEffect, useState } from \"react\";\nimport { useSettings } from \"@/components/SettingsProvider/SettingsProvider\";\nimport type { SettingsStore } from \"@/components/SettingsProvider/models/SettingsStore\";\nimport z from \"zod\";\n\nexport class List<T, TMeta = unknown> {\n  public static readonly viewModeSettingsStorageSchema = z\n    .enum([\"list\", \"table\", \"tiles\"])\n    .optional();\n  public readonly filters: Filter<T, never, never>[];\n  public readonly itemView?: ItemView<T>;\n  public readonly table?: Table<T>;\n  public readonly search?: Search<T>;\n  public readonly sorting: Sorting<T>[];\n  public readonly items: ItemCollection<T>;\n  public readonly reactTable: ReactTable<T>;\n  public readonly batches: BatchesController<T>;\n  public readonly loader: IncrementalLoader<T>;\n  public readonly onAction?: ItemActionFn<T>;\n  public readonly accordion: boolean;\n  public readonly getItemId?: GetItemId<T>;\n  public readonly componentProps: ListSupportedComponentProps;\n  public viewMode: ListViewMode;\n  public readonly setViewMode: (viewMode: ListViewMode) => void;\n  public readonly supportsSettingsStorage: boolean;\n  public readonly settingStorageKey?: string;\n  public metadata?: TMeta;\n  private readonly settingsStore?: SettingsStore;\n  private readonly viewModeStorageKey?: string;\n  private readonly filterSettingsStorageKey?: string;\n  private readonly sortingStorageKey?: string;\n  public readonly loadingItemsCount;\n\n  public constructor(shape: ListShape<T, TMeta>) {\n    const {\n      settingStorageKey,\n      itemView,\n      table,\n      filters = [],\n      sorting = [],\n      batchesController,\n      onChange,\n      loader,\n      search,\n      onAction,\n      getItemId,\n      defaultViewMode,\n      accordion = false,\n      loadingItemsCount = 5,\n      ...componentProps\n    } = shape;\n\n    this.settingsStore = useSettings();\n    this.settingStorageKey = settingStorageKey;\n    this.filterSettingsStorageKey = settingStorageKey\n      ? `${settingStorageKey}.activeFilters`\n      : undefined;\n    this.viewModeStorageKey = settingStorageKey\n      ? `${settingStorageKey}.viewMode`\n      : undefined;\n    this.sortingStorageKey = settingStorageKey\n      ? `${settingStorageKey}.sorting`\n      : undefined;\n    this.supportsSettingsStorage = !!this.settingStorageKey;\n\n    this.items = new ItemCollection(this);\n    this.filters = filters.map((shape) => new Filter(this, shape));\n    this.sorting = sorting.map((shape) => new Sorting<T>(this, shape));\n    this.search = search ? new Search(this, search) : undefined;\n    this.itemView = itemView ? new ItemView(this, itemView) : undefined;\n    this.accordion = accordion;\n    this.table = table ? new Table(this, table) : undefined;\n    this.batches = new BatchesController(this, batchesController);\n    this.componentProps = componentProps;\n    this.loader = IncrementalLoader.useNew<T>(this, loader);\n    this.onAction = onAction;\n    this.getItemId = getItemId;\n    this.loadingItemsCount = loadingItemsCount;\n    this.reactTable = ReactTable.useNew(this, onChange, {\n      manualFiltering: this.loader.manualFiltering,\n      manualPagination: this.loader.manualPagination,\n      manualSorting: this.loader.manualSorting,\n    });\n\n    const [viewMode, setViewMode] = useState(\n      this.getStoredViewModeDefaultSetting() ?? defaultViewMode ?? \"list\",\n    );\n    this.viewMode = viewMode;\n\n    this.setViewMode = (viewMode) => {\n      setViewMode(viewMode);\n      if (this.settingsStore && this.viewModeStorageKey) {\n        this.settingsStore.set(\n          \"List\",\n          this.viewModeStorageKey,\n          List.viewModeSettingsStorageSchema,\n          viewMode,\n        );\n      }\n    };\n\n    useEffect(() => {\n      this.filters.forEach((f) => f.deleteUnknownFilterValues());\n    }, [this.filters]);\n  }\n\n  public get isFiltered(): boolean {\n    return (\n      this.filters.some((f) => f.isActive()) ||\n      (!!this.search && this.search.isSet)\n    );\n  }\n\n  public get visibleSorting() {\n    return this.sorting.filter((s) => s.defaultEnabled !== \"hidden\");\n  }\n\n  public static useNew<T, TMeta = unknown>(\n    shape: ListShape<T, TMeta>,\n  ): List<T, TMeta> {\n    return new List<T, TMeta>(shape);\n  }\n\n  public storeFilterDefaultSettings() {\n    if (this.settingsStore && this.filterSettingsStorageKey) {\n      const data = Object.fromEntries(\n        this.filters.map((f) => [\n          f.property,\n          f\n            .getArrayValue()\n            .filter((v) => v.isActive)\n            .map((v) => v.id),\n        ]),\n      );\n\n      this.settingsStore.set(\n        \"List\",\n        this.filterSettingsStorageKey,\n        Filter.settingsStorageSchema,\n        data,\n      );\n    }\n  }\n\n  public getStoredFilterDefaultSettings() {\n    if (this.settingsStore && this.filterSettingsStorageKey) {\n      return this.settingsStore.get(\n        \"List\",\n        this.filterSettingsStorageKey,\n        Filter.settingsStorageSchema,\n      );\n    }\n  }\n\n  public getStoredViewModeDefaultSetting() {\n    if (this.settingsStore && this.viewModeStorageKey) {\n      return this.settingsStore.get(\n        \"List\",\n        this.viewModeStorageKey,\n        List.viewModeSettingsStorageSchema,\n      );\n    }\n  }\n\n  public storeSortingSettings(sorting: Sorting<T>) {\n    if (this.settingsStore && this.sortingStorageKey) {\n      this.settingsStore.set(\n        \"List\",\n        this.sortingStorageKey,\n        Sorting.storageSchema,\n        { direction: sorting.direction, property: sorting.property },\n      );\n    }\n  }\n\n  public getStoredSortingDefaultSetting() {\n    if (this.settingsStore && this.sortingStorageKey) {\n      return this.settingsStore.get(\n        \"List\",\n        this.sortingStorageKey,\n        Sorting.storageSchema,\n      );\n    }\n  }\n\n  public getSorting(id: string): Sorting<T> {\n    const sorting = this.sorting.find((s) => s.id === id);\n    invariant(!!sorting, `Could not get Sorting (ID: ${id})`);\n    return sorting;\n  }\n\n  public clearSorting(): void {\n    return this.sorting.forEach((s) => s.clear());\n  }\n\n  public resetFilters(): void {\n    return this.filters.forEach((f) => f.resetValues());\n  }\n\n  public clearFilters(): void {\n    return this.filters.forEach((f) => f.clear());\n  }\n\n  public useIsEmpty(): boolean {\n    return !this.loader.useIsLoading() && this.items.entries.length === 0;\n  }\n}\n\nexport default List;\n"],"names":["shape","viewMode"],"mappings":"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"}