@lumeweb/portal-framework-ui 0.0.1 → 0.1.0

package/dist/cjs/components/data-table/TableLayoutRenderer.d.cts

@@ -0,0 +1,49 @@
+import { TableLayoutType } from "./DataTable.types.cjs";
+import { ComponentSize } from "../sizing/index.cjs";
+import "../index.cjs";
+import React from "react";
+import { BaseRecord, useTableReturnType } from "@refinedev/core";
+import { Table } from "@tanstack/react-table";
+
+//#region src/components/data-table/TableLayoutRenderer.d.ts
+interface TableLayoutRendererProps<TData extends BaseRecord> {
+  layoutType: TableLayoutType;
+  table: Table<TData>;
+  refineTable?: useTableReturnType<TData, any>;
+  className?: string;
+  emptyState?: React.ReactNode;
+  footer?: React.ReactNode;
+  getCellProps?: (cell: any) => React.HTMLAttributes<HTMLTableCellElement>;
+  getRowProps?: (row: any) => React.HTMLAttributes<HTMLTableRowElement>;
+  header?: React.ReactNode;
+  isLoading?: boolean;
+  loadingState?: React.ReactNode;
+  onRowClick?: (row: any) => void;
+  pagination?: React.ReactNode;
+  responsive?: boolean;
+  hideColumnsOnMobile?: string[];
+  mobileBreakpoint?: ComponentSize | string;
+  stackedHeaderColumn?: string;
+}
+declare function TableLayoutRenderer<TData extends BaseRecord>({
+  layoutType,
+  table,
+  refineTable,
+  className,
+  emptyState,
+  footer,
+  getCellProps,
+  getRowProps,
+  header,
+  isLoading,
+  loadingState,
+  onRowClick,
+  pagination,
+  responsive,
+  hideColumnsOnMobile,
+  mobileBreakpoint,
+  stackedHeaderColumn
+}: TableLayoutRendererProps<TData>): any;
+//#endregion
+export { TableLayoutRenderer };
+//# sourceMappingURL=TableLayoutRenderer.d.cts.map

package/dist/cjs/components/data-table/Toolbar.cjs

@@ -0,0 +1,193 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_components_data_table_DataTable_types = require('./DataTable.types.cjs');
+const require_components_sizing_index = require('../sizing/index.cjs');
+const require_components_data_table_toolbarItems_filters_types = require('./toolbarItems/filters/types.cjs');
+const require_components_data_table_toolbarItems_filters_util = require('./toolbarItems/filters/util.cjs');
+const require_components_data_table_useMobileDetection = require('./useMobileDetection.cjs');
+const require_components_data_table_ToolbarRenderer = require('./ToolbarRenderer.cjs');
+const require_components_data_table_contexts_FilterHelpers = require('./contexts/FilterHelpers.cjs');
+const require_components_data_table_contexts_RefineTable = require('./contexts/RefineTable.cjs');
+const require_components_data_table_contexts_TableConfig = require('./contexts/TableConfig.cjs');
+const require_components_data_table_contexts_index = require('./contexts/index.cjs');
+const require_components_data_table_toolbarItems_index = require('./toolbarItems/index.cjs');
+const require_components_index = require('../index.cjs');
+let _lumeweb_portal_framework_ui_core = require("@lumeweb/portal-framework-ui-core");
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/data-table/Toolbar.tsx
+function MobileToolbarLayout({ table, className, config, refineContext, sortedItems, createCommonProps }) {
+	const containerClassName = (0, _lumeweb_portal_framework_ui_core.cn)("flex flex-col gap-3 p-3 border-b bg-background", config.sticky && "sticky top-0 z-10", className);
+	const getItemAlignment = (item) => {
+		if (item.alignment) return item.alignment;
+		return config.defaultAlignment || require_components_data_table_DataTable_types.ToolbarItemAlignment.LEFT;
+	};
+	const isLeftAligned = (item) => {
+		return getItemAlignment(item) === require_components_data_table_DataTable_types.ToolbarItemAlignment.LEFT;
+	};
+	const isRightAligned = (item) => {
+		return getItemAlignment(item) === require_components_data_table_DataTable_types.ToolbarItemAlignment.RIGHT;
+	};
+	const isCenterAligned = (item) => {
+		return getItemAlignment(item) === require_components_data_table_DataTable_types.ToolbarItemAlignment.CENTER;
+	};
+	const leftItems = sortedItems.filter(isLeftAligned);
+	const centerItems = sortedItems.filter(isCenterAligned);
+	const rightItems = sortedItems.filter(isRightAligned);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: containerClassName,
+		children: [
+			leftItems.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex flex-wrap gap-2",
+				children: leftItems.map((item) => {
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_data_table_ToolbarRenderer.ToolbarRenderer, {
+						item,
+						commonProps: createCommonProps(item)
+					}, item.id);
+				})
+			}),
+			centerItems.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex flex-wrap justify-center gap-2",
+				children: centerItems.map((item) => {
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_data_table_ToolbarRenderer.ToolbarRenderer, {
+						item,
+						commonProps: createCommonProps(item)
+					}, item.id);
+				})
+			}),
+			rightItems.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex flex-wrap justify-end gap-2",
+				children: rightItems.map((item) => {
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_data_table_ToolbarRenderer.ToolbarRenderer, {
+						item,
+						commonProps: createCommonProps(item)
+					}, item.id);
+				})
+			})
+		]
+	});
+}
+function DesktopToolbarLayout({ table, className, config, refineContext, sortedItems, createCommonProps }) {
+	const getItemAlignment = (item) => {
+		if (item.alignment) return item.alignment;
+		return config.defaultAlignment || require_components_data_table_DataTable_types.ToolbarItemAlignment.LEFT;
+	};
+	const isRightAligned = (item) => {
+		return getItemAlignment(item) === require_components_data_table_DataTable_types.ToolbarItemAlignment.RIGHT;
+	};
+	const isCenterAligned = (item) => {
+		return getItemAlignment(item) === require_components_data_table_DataTable_types.ToolbarItemAlignment.CENTER;
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: (0, _lumeweb_portal_framework_ui_core.cn)("flex flex-wrap items-center gap-2 p-4 border-b bg-background", config.justifyBetween ? "justify-between" : void 0, config.sticky && "sticky top-0 z-10", className),
+		children: sortedItems.map((item) => {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_data_table_ToolbarRenderer.ToolbarRenderer, {
+				item,
+				commonProps: createCommonProps(item),
+				className: (0, _lumeweb_portal_framework_ui_core.cn)(isRightAligned(item) && "ml-auto", isCenterAligned(item) && "mx-auto")
+			}, item.id);
+		})
+	});
+}
+function Toolbar({ table, className }) {
+	const { setFilters, setSorters, tableQuery, filters, sorters } = require_components_data_table_contexts_RefineTable.useRefineTable();
+	const { toolbarConfig: config, refineContext } = require_components_data_table_contexts_TableConfig.useTableConfig();
+	const { getDefaultFilter, getDefaultOperator } = require_components_data_table_contexts_FilterHelpers.useFilterHelpers();
+	const { isMobile } = require_components_data_table_useMobileDetection.useMobileDetection({ mobileBreakpoint: react.default.useMemo(() => {
+		const breakpoint = config?.mobileBreakpoint;
+		if (typeof breakpoint === "string" && [
+			"xs",
+			"sm",
+			"md",
+			"lg",
+			"xl",
+			"2xl"
+		].includes(breakpoint)) return breakpoint;
+		if (typeof breakpoint === "string" && /^\d+$/.test(breakpoint)) {
+			const parsed = parseInt(breakpoint, 10);
+			if (parsed > 0) return parsed;
+		}
+		if (typeof breakpoint === "number" && breakpoint > 0) return breakpoint;
+		return require_components_sizing_index.ComponentSize.SM;
+	}, [config?.mobileBreakpoint]) });
+	const sortedItems = react.default.useMemo(() => {
+		if (!config) return [];
+		return [...config.items].sort((a, b) => {
+			return (a.order ?? 0) - (b.order ?? 0);
+		});
+	}, [config?.items]);
+	const onChangeHandler = (0, react.useCallback)((item) => {
+		return require_components_data_table_toolbarItems_filters_util.createFilterOnChangeHandler(item, (filters$1) => {
+			if (setFilters) setFilters(filters$1);
+		}, getDefaultOperator, { itemId: item.id });
+	}, [setFilters, getDefaultOperator]);
+	const createCommonProps = (0, react.useCallback)((item) => {
+		const baseProps = {
+			table,
+			refineContext,
+			context: {
+				setFilters,
+				setSorters,
+				tableQuery,
+				filters,
+				sorters
+			}
+		};
+		if ([require_components_data_table_DataTable_types.ToolbarItemType.FILTER, require_components_data_table_DataTable_types.ToolbarItemType.FILTER_GROUP].includes(item.type)) {
+			const operator = item.config?.operator || (item.config?.type ? getDefaultOperator?.(item.config.type) : require_components_data_table_toolbarItems_filters_types.FilterOperator.EQ);
+			const existingValue = getDefaultFilter?.(item.config?.field, operator);
+			const initialValue = "initialValue" in item ? item.initialValue : void 0;
+			baseProps.value = existingValue ?? initialValue;
+			baseProps.onChange = onChangeHandler(item);
+		}
+		return baseProps;
+	}, [
+		table,
+		refineContext,
+		setFilters,
+		getDefaultFilter,
+		getDefaultOperator,
+		setSorters,
+		tableQuery,
+		filters,
+		sorters,
+		onChangeHandler
+	]);
+	if (!config) return null;
+	if (isMobile) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MobileToolbarLayout, {
+		table,
+		className,
+		config,
+		refineContext,
+		sortedItems,
+		createCommonProps
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DesktopToolbarLayout, {
+		table,
+		className,
+		config,
+		refineContext,
+		sortedItems,
+		createCommonProps
+	});
+}
+var init_Toolbar = require_rolldown_runtime.__esmMin((() => {
+	require_components_index.init_components();
+	require_components_data_table_DataTable_types.init_DataTable_types();
+	require_components_data_table_ToolbarRenderer.init_ToolbarRenderer();
+	require_components_data_table_contexts_index.init_contexts();
+	require_components_data_table_toolbarItems_index.init_toolbarItems();
+	require_components_data_table_useMobileDetection.init_useMobileDetection();
+}));
+
+//#endregion
+init_Toolbar();
+exports.Toolbar = Toolbar;
+Object.defineProperty(exports, 'init_Toolbar', {
+  enumerable: true,
+  get: function () {
+    return init_Toolbar;
+  }
+});
+//# sourceMappingURL=Toolbar.cjs.map

package/dist/cjs/components/data-table/Toolbar.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar.cjs","names":["ToolbarItemAlignment","ToolbarRenderer","useRefineTable","useTableConfig","useFilterHelpers","useMobileDetection","React","ComponentSize","createFilterOnChangeHandler","filters","ToolbarItemType","FilterOperator"],"sources":["../../../../src/components/data-table/Toolbar.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { cn } from \"@lumeweb/portal-framework-ui-core\";\nimport { Table } from \"@tanstack/react-table\";\nimport { ComponentSize } from \"@/components\";\n\nimport type {\n  TableContext,\n  ToolbarItem,\n  ToolbarItemComponentProps,\n} from \"./DataTable.types\";\nimport { ToolbarItemAlignment, ToolbarItemType } from \"./DataTable.types\";\nimport { BaseRecord } from \"@refinedev/core\";\nimport { ToolbarRenderer } from \"./ToolbarRenderer\";\nimport { useFilterHelpers, useRefineTable, useTableConfig } from \"./contexts\";\nimport { createFilterOnChangeHandler, FilterOperator } from \"./toolbarItems\";\nimport { useMobileDetection } from \"./useMobileDetection\";\n\ninterface ToolbarProps<TData extends BaseRecord> {\n  /** The table instance */\n  table: Table<TData>;\n  /** Additional class name for the toolbar container */\n  className?: string;\n}\n\nfunction MobileToolbarLayout<TData extends BaseRecord>({\n  table,\n  className,\n  config,\n  refineContext,\n  sortedItems,\n  createCommonProps,\n}: {\n  table: Table<TData>;\n  className?: string;\n  config: any;\n  refineContext: any;\n  sortedItems: ToolbarItem<TData>[];\n  createCommonProps: (\n    item: ToolbarItem<TData>,\n  ) => ToolbarItemComponentProps<TData>;\n}) {\n  const containerClassName = cn(\n    \"flex flex-col gap-3 p-3 border-b bg-background\",\n    config.sticky && \"sticky top-0 z-10\",\n    className,\n  );\n\n  // Helper functions to determine item alignment (defined at component level, not inside hooks)\n  const getItemAlignment = (item: ToolbarItem<TData>): ToolbarItemAlignment => {\n    // If item has explicit alignment, use it\n    if (item.alignment) {\n      return item.alignment;\n    }\n\n    // Otherwise use the default alignment from config\n    return config.defaultAlignment || ToolbarItemAlignment.LEFT;\n  };\n\n  const isLeftAligned = (item: ToolbarItem<TData>): boolean => {\n    return getItemAlignment(item) === ToolbarItemAlignment.LEFT;\n  };\n\n  const isRightAligned = (item: ToolbarItem<TData>): boolean => {\n    return getItemAlignment(item) === ToolbarItemAlignment.RIGHT;\n  };\n\n  const isCenterAligned = (item: ToolbarItem<TData>): boolean => {\n    return getItemAlignment(item) === ToolbarItemAlignment.CENTER;\n  };\n\n  // Group items by alignment for mobile\n  const leftItems = sortedItems.filter(isLeftAligned);\n  const centerItems = sortedItems.filter(isCenterAligned);\n  const rightItems = sortedItems.filter(isRightAligned);\n\n  return (\n    <div className={containerClassName}>\n      {leftItems.length > 0 && (\n        <div className=\"flex flex-wrap gap-2\">\n          {leftItems.map((item) => {\n            const commonProps = createCommonProps(item);\n            return (\n              <ToolbarRenderer\n                key={item.id}\n                item={item}\n                commonProps={commonProps}\n              />\n            );\n          })}\n        </div>\n      )}\n\n      {centerItems.length > 0 && (\n        <div className=\"flex flex-wrap justify-center gap-2\">\n          {centerItems.map((item) => {\n            const commonProps = createCommonProps(item);\n            return (\n              <ToolbarRenderer\n                key={item.id}\n                item={item}\n                commonProps={commonProps}\n              />\n            );\n          })}\n        </div>\n      )}\n\n      {rightItems.length > 0 && (\n        <div className=\"flex flex-wrap justify-end gap-2\">\n          {rightItems.map((item) => {\n            const commonProps = createCommonProps(item);\n            return (\n              <ToolbarRenderer\n                key={item.id}\n                item={item}\n                commonProps={commonProps}\n              />\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction DesktopToolbarLayout<TData extends BaseRecord>({\n  table,\n  className,\n  config,\n  refineContext,\n  sortedItems,\n  createCommonProps,\n}: {\n  table: Table<TData>;\n  className?: string;\n  config: any;\n  refineContext: any;\n  sortedItems: ToolbarItem<TData>[];\n  createCommonProps: (\n    item: ToolbarItem<TData>,\n  ) => ToolbarItemComponentProps<TData>;\n}) {\n  // Helper functions to determine item alignment (defined at component level, not inside hooks)\n  const getItemAlignment = (item: ToolbarItem<TData>): ToolbarItemAlignment => {\n    // If item has explicit alignment, use it\n    if (item.alignment) {\n      return item.alignment;\n    }\n\n    // Otherwise use the default alignment from config\n    return config.defaultAlignment || ToolbarItemAlignment.LEFT;\n  };\n\n  const isRightAligned = (item: ToolbarItem<TData>): boolean => {\n    return getItemAlignment(item) === ToolbarItemAlignment.RIGHT;\n  };\n\n  const isCenterAligned = (item: ToolbarItem<TData>): boolean => {\n    return getItemAlignment(item) === ToolbarItemAlignment.CENTER;\n  };\n\n  const containerClassName = cn(\n    \"flex flex-wrap items-center gap-2 p-4 border-b bg-background\",\n    config.justifyBetween ? \"justify-between\" : undefined,\n    config.sticky && \"sticky top-0 z-10\",\n    className,\n  );\n\n  return (\n    <div className={containerClassName}>\n      {sortedItems.map((item) => {\n        const commonProps = createCommonProps(item);\n\n        // Add appropriate positioning classes based on alignment\n        const itemClassName = cn(\n          isRightAligned(item) && \"ml-auto\",\n          isCenterAligned(item) && \"mx-auto\",\n        );\n\n        return (\n          <ToolbarRenderer\n            key={item.id}\n            item={item}\n            commonProps={commonProps}\n            className={itemClassName}\n          />\n        );\n      })}\n    </div>\n  );\n}\n\nfunction Toolbar<TData extends BaseRecord>({\n  table,\n  className,\n}: ToolbarProps<TData>) {\n  const { setFilters, setSorters, tableQuery, filters, sorters } = useRefineTable<TData>();\n  const { toolbarConfig: config, refineContext } = useTableConfig<TData>();\n  const { getDefaultFilter, getDefaultOperator } = useFilterHelpers<TData>();\n\n  // Validate mobileBreakpoint value\n  const mobileBreakpoint = React.useMemo(() => {\n    const breakpoint = config?.mobileBreakpoint;\n    const validTokens = [\"xs\", \"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n\n    // If it's a valid Tailwind token, use it as-is\n    if (typeof breakpoint === \"string\" && validTokens.includes(breakpoint)) {\n      return breakpoint;\n    }\n\n    // If it's a numeric string or number, parse it and use the numeric value\n    if (typeof breakpoint === \"string\" && /^\\d+$/.test(breakpoint)) {\n      const parsed = parseInt(breakpoint, 10);\n      if (parsed > 0) {\n        return parsed;\n      }\n    }\n\n    if (typeof breakpoint === \"number\" && breakpoint > 0) {\n      return breakpoint;\n    }\n\n    // For any other value, fall back to ComponentSize.SM\n    return ComponentSize.SM;\n  }, [config?.mobileBreakpoint]);\n\n  // Mobile detection with proper breakpoint\n  const { isMobile } = useMobileDetection({\n    mobileBreakpoint: mobileBreakpoint,\n  });\n\n\n\n  // Sort items by order if specified (compute regardless of config presence)\n  const sortedItems = React.useMemo(() => {\n    if (!config) {\n      return [];\n    }\n    return [...config.items].sort((a, b) => {\n      const orderA = a.order ?? 0;\n      const orderB = b.order ?? 0;\n      return orderA - orderB;\n    });\n  }, [config?.items]);\n\n  // Create stable onChange handler using refs (compute regardless of config presence)\n  const onChangeHandler = useCallback(\n    (item: ToolbarItem<TData>) => {\n      return createFilterOnChangeHandler(\n        item,\n        (filters) => {\n          if (setFilters) {\n            setFilters(filters);\n          }\n        },\n        getDefaultOperator,\n        { itemId: item.id },\n      );\n    },\n    [setFilters, getDefaultOperator],\n  );\n\n  // Create common props for all toolbar items (compute regardless of config presence)\n  const createCommonProps = useCallback(\n    (item: ToolbarItem<TData>): ToolbarItemComponentProps<TData> => {\n      const context: TableContext<TData> = {\n        setFilters,\n        setSorters,\n        tableQuery,\n        filters,\n        sorters,\n      } as TableContext<TData>;\n\n      const baseProps: ToolbarItemComponentProps<TData> = {\n        table,\n        refineContext,\n        context,\n      };\n\n      // Add filter-specific props\n      if (\n        [ToolbarItemType.FILTER, ToolbarItemType.FILTER_GROUP].includes(\n          item.type,\n        )\n      ) {\n        // Get the operator to use - either from config or default based on field type\n        const operator =\n          (item as any).config?.operator ||\n          ((item as any).config?.type\n            ? getDefaultOperator?.((item as any).config.type)\n            : FilterOperator.EQ);\n\n        // Use the table contexts's getDefaultFilter function to get existing filter value\n        const existingValue = getDefaultFilter?.(\n          (item as any).config?.field as string,\n          operator,\n        );\n\n        // Only use initialValue for item types that support it\n        const initialValue =\n          \"initialValue\" in item ? item.initialValue : undefined;\n        baseProps.value = existingValue ?? initialValue;\n        baseProps.onChange = onChangeHandler(item);\n      }\n\n      return baseProps;\n    },\n    [\n      table,\n      refineContext,\n      setFilters,\n      getDefaultFilter,\n      getDefaultOperator,\n      setSorters,\n      tableQuery,\n      filters,\n      sorters,\n      onChangeHandler,\n    ],\n  );\n\n  // If no toolbar config is provided through contexts, don't render anything\n  if (!config) {\n    return null;\n  }\n\n  // For mobile, we want a more vertical layout with appropriate spacing\n  if (isMobile) {\n    return (\n      <MobileToolbarLayout\n        table={table}\n        className={className}\n        config={config}\n        refineContext={refineContext}\n        sortedItems={sortedItems}\n        createCommonProps={createCommonProps}\n      />\n    );\n  }\n\n  // Desktop layout\n  return (\n    <DesktopToolbarLayout\n      table={table}\n      className={className}\n      config={config}\n      refineContext={refineContext}\n      sortedItems={sortedItems}\n      createCommonProps={createCommonProps}\n    />\n  );\n}\n\nexport { Toolbar };\n"],"mappings":"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"}

package/dist/cjs/components/data-table/Toolbar.d.cts

@@ -0,0 +1,17 @@
+import { BaseRecord } from "@refinedev/core";
+import { Table } from "@tanstack/react-table";
+
+//#region src/components/data-table/Toolbar.d.ts
+interface ToolbarProps<TData extends BaseRecord> {
+  /** The table instance */
+  table: Table<TData>;
+  /** Additional class name for the toolbar container */
+  className?: string;
+}
+declare function Toolbar<TData extends BaseRecord>({
+  table,
+  className
+}: ToolbarProps<TData>): any;
+//#endregion
+export { Toolbar };
+//# sourceMappingURL=Toolbar.d.cts.map

package/dist/cjs/components/data-table/ToolbarRegistry.cjs

@@ -0,0 +1,112 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+
+//#region src/components/data-table/ToolbarRegistry.tsx
+/**
+* Register a toolbar action item
+*/
+function registerAction(id, item) {
+	actions.set(id, item);
+}
+/**
+* Register a toolbar filter item
+*/
+function registerFilter(id, item) {
+	filters.set(id, item);
+}
+/**
+* Get a registered action item by ID
+*/
+function getAction(id) {
+	return actions.get(id);
+}
+/**
+* Get a registered filter item by ID
+*/
+function getFilter(id) {
+	return filters.get(id);
+}
+/**
+* Check if an action item exists
+*/
+function hasAction(id) {
+	return actions.has(id);
+}
+/**
+* Check if a filter item exists
+*/
+function hasFilter(id) {
+	return filters.has(id);
+}
+/**
+* Get all registered action items
+*/
+function listActions() {
+	return Array.from(actions.entries()).map(([id, item]) => ({
+		id,
+		item
+	}));
+}
+/**
+* Get all registered filter items
+*/
+function listFilters() {
+	return Array.from(filters.entries()).map(([id, item]) => ({
+		id,
+		item
+	}));
+}
+/**
+* Get all registered items
+*/
+function listAll() {
+	return {
+		actions: listActions(),
+		filters: listFilters()
+	};
+}
+/**
+* Clear all registered items
+*/
+function clear() {
+	actions.clear();
+	filters.clear();
+}
+/**
+* Remove a specific action item
+*/
+function removeAction(id) {
+	return actions.delete(id);
+}
+/**
+* Remove a specific filter item
+*/
+function removeFilter(id) {
+	return filters.delete(id);
+}
+var actions, filters;
+var init_ToolbarRegistry = require_rolldown_runtime.__esmMin((() => {
+	actions = /* @__PURE__ */ new Map();
+	filters = /* @__PURE__ */ new Map();
+}));
+
+//#endregion
+init_ToolbarRegistry();
+exports.clear = clear;
+exports.getAction = getAction;
+exports.getFilter = getFilter;
+exports.hasAction = hasAction;
+exports.hasFilter = hasFilter;
+Object.defineProperty(exports, 'init_ToolbarRegistry', {
+  enumerable: true,
+  get: function () {
+    return init_ToolbarRegistry;
+  }
+});
+exports.listActions = listActions;
+exports.listAll = listAll;
+exports.listFilters = listFilters;
+exports.registerAction = registerAction;
+exports.registerFilter = registerFilter;
+exports.removeAction = removeAction;
+exports.removeFilter = removeFilter;
+//# sourceMappingURL=ToolbarRegistry.cjs.map

package/dist/cjs/components/data-table/ToolbarRegistry.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarRegistry.cjs","names":[],"sources":["../../../../src/components/data-table/ToolbarRegistry.tsx"],"sourcesContent":["import type {\n  ToolbarActionItem,\n  ToolbarFilterItem,\n} from \"./\";\nimport { BaseRecord } from \"@refinedev/core\";\n\ninterface RegisteredActionItem<TData extends BaseRecord> {\n  id: string;\n  item: ToolbarActionItem<TData>;\n}\n\ninterface RegisteredFilterItem<TData extends BaseRecord> {\n  id: string;\n  item: ToolbarFilterItem<TData>;\n}\n\n// Module-level private state\nconst actions: Map<string, ToolbarActionItem<any>> = new Map();\nconst filters: Map<string, ToolbarFilterItem<any>> = new Map();\n\n/**\n * Register a toolbar action item\n */\nfunction registerAction<TData extends BaseRecord>(\n  id: string,\n  item: ToolbarActionItem<TData>,\n): void {\n  actions.set(id, item);\n}\n\n/**\n * Register a toolbar filter item\n */\nfunction registerFilter<TData extends BaseRecord>(\n  id: string,\n  item: ToolbarFilterItem<TData>,\n): void {\n  filters.set(id, item as ToolbarFilterItem<any>);\n}\n\n/**\n * Get a registered action item by ID\n */\nfunction getAction<TData extends BaseRecord>(\n  id: string,\n): ToolbarActionItem<TData> | undefined {\n  return actions.get(id);\n}\n\n/**\n * Get a registered filter item by ID\n */\nfunction getFilter<TData extends BaseRecord>(\n  id: string,\n): ToolbarFilterItem<TData> | undefined {\n  return filters.get(id) as ToolbarFilterItem<TData> | undefined;\n}\n\n/**\n * Check if an action item exists\n */\nfunction hasAction(id: string): boolean {\n  return actions.has(id);\n}\n\n/**\n * Check if a filter item exists\n */\nfunction hasFilter(id: string): boolean {\n  return filters.has(id);\n}\n\n/**\n * Get all registered action items\n */\nfunction listActions<\n  TData extends BaseRecord,\n>(): RegisteredActionItem<TData>[] {\n  return Array.from(actions.entries()).map(([id, item]) => ({\n    id,\n    item: item as ToolbarActionItem<TData>,\n  }));\n}\n\n/**\n * Get all registered filter items\n */\nfunction listFilters<\n  TData extends BaseRecord,\n>(): RegisteredFilterItem<TData>[] {\n  return Array.from(filters.entries()).map(([id, item]) => ({\n    id,\n    item: item as ToolbarFilterItem<TData>,\n  }));\n}\n\n/**\n * Get all registered items\n */\nfunction listAll<TData extends BaseRecord>() {\n  return {\n    actions: listActions<TData>(),\n    filters: listFilters<TData>(),\n  };\n}\n\n/**\n * Clear all registered items\n */\nfunction clear(): void {\n  actions.clear();\n  filters.clear();\n}\n\n/**\n * Remove a specific action item\n */\nfunction removeAction(id: string): boolean {\n  return actions.delete(id);\n}\n\n/**\n * Remove a specific filter item\n */\nfunction removeFilter(id: string): boolean {\n  return filters.delete(id);\n}\n\nexport {\n  registerAction,\n  getAction,\n  registerFilter,\n  getFilter,\n  hasAction,\n  hasFilter,\n  listActions,\n  listFilters,\n  listAll,\n  clear,\n  removeAction,\n  removeFilter,\n};\n\nexport type {\n  RegisteredActionItem,\n  RegisteredFilterItem,\n};\n"],"mappings":";;;;;;AAuBA,SAAS,eACP,IACA,MACM;AACN,SAAQ,IAAI,IAAI,KAAK;;;;;AAMvB,SAAS,eACP,IACA,MACM;AACN,SAAQ,IAAI,IAAI,KAA+B;;;;;AAMjD,SAAS,UACP,IACsC;AACtC,QAAO,QAAQ,IAAI,GAAG;;;;;AAMxB,SAAS,UACP,IACsC;AACtC,QAAO,QAAQ,IAAI,GAAG;;;;;AAMxB,SAAS,UAAU,IAAqB;AACtC,QAAO,QAAQ,IAAI,GAAG;;;;;AAMxB,SAAS,UAAU,IAAqB;AACtC,QAAO,QAAQ,IAAI,GAAG;;;;;AAMxB,SAAS,cAE0B;AACjC,QAAO,MAAM,KAAK,QAAQ,SAAS,CAAC,CAAC,KAAK,CAAC,IAAI,WAAW;EACxD;EACM;EACP,EAAE;;;;;AAML,SAAS,cAE0B;AACjC,QAAO,MAAM,KAAK,QAAQ,SAAS,CAAC,CAAC,KAAK,CAAC,IAAI,WAAW;EACxD;EACM;EACP,EAAE;;;;;AAML,SAAS,UAAoC;AAC3C,QAAO;EACL,SAAS,aAAoB;EAC7B,SAAS,aAAoB;EAC9B;;;;;AAMH,SAAS,QAAc;AACrB,SAAQ,OAAO;AACf,SAAQ,OAAO;;;;;AAMjB,SAAS,aAAa,IAAqB;AACzC,QAAO,QAAQ,OAAO,GAAG;;;;;AAM3B,SAAS,aAAa,IAAqB;AACzC,QAAO,QAAQ,OAAO,GAAG;;;;CA5GrB,0BAA+C,IAAI,KAAK;CACxD,0BAA+C,IAAI,KAAK"}

package/dist/cjs/components/data-table/ToolbarRegistry.d.cts

@@ -0,0 +1,67 @@
+import { ToolbarActionItem, ToolbarFilterItem } from "./DataTable.types.cjs";
+import "./index.cjs";
+import { BaseRecord } from "@refinedev/core";
+
+//#region src/components/data-table/ToolbarRegistry.d.ts
+interface RegisteredActionItem<TData extends BaseRecord> {
+  id: string;
+  item: ToolbarActionItem<TData>;
+}
+interface RegisteredFilterItem<TData extends BaseRecord> {
+  id: string;
+  item: ToolbarFilterItem<TData>;
+}
+/**
+ * Register a toolbar action item
+ */
+declare function registerAction<TData extends BaseRecord>(id: string, item: ToolbarActionItem<TData>): void;
+/**
+ * Register a toolbar filter item
+ */
+declare function registerFilter<TData extends BaseRecord>(id: string, item: ToolbarFilterItem<TData>): void;
+/**
+ * Get a registered action item by ID
+ */
+declare function getAction<TData extends BaseRecord>(id: string): ToolbarActionItem<TData> | undefined;
+/**
+ * Get a registered filter item by ID
+ */
+declare function getFilter<TData extends BaseRecord>(id: string): ToolbarFilterItem<TData> | undefined;
+/**
+ * Check if an action item exists
+ */
+declare function hasAction(id: string): boolean;
+/**
+ * Check if a filter item exists
+ */
+declare function hasFilter(id: string): boolean;
+/**
+ * Get all registered action items
+ */
+declare function listActions<TData extends BaseRecord>(): RegisteredActionItem<TData>[];
+/**
+ * Get all registered filter items
+ */
+declare function listFilters<TData extends BaseRecord>(): RegisteredFilterItem<TData>[];
+/**
+ * Get all registered items
+ */
+declare function listAll<TData extends BaseRecord>(): {
+  actions: RegisteredActionItem<TData>[];
+  filters: RegisteredFilterItem<TData>[];
+};
+/**
+ * Clear all registered items
+ */
+declare function clear(): void;
+/**
+ * Remove a specific action item
+ */
+declare function removeAction(id: string): boolean;
+/**
+ * Remove a specific filter item
+ */
+declare function removeFilter(id: string): boolean;
+//#endregion
+export { type RegisteredActionItem, type RegisteredFilterItem, clear, getAction, getFilter, hasAction, hasFilter, listActions, listAll, listFilters, registerAction, registerFilter, removeAction, removeFilter };
+//# sourceMappingURL=ToolbarRegistry.d.cts.map

package/dist/cjs/components/data-table/ToolbarRenderer.cjs

@@ -0,0 +1,141 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_components_data_table_DataTable_types = require('./DataTable.types.cjs');
+const require_components_data_table_ToolbarRegistry = require('./ToolbarRegistry.cjs');
+const require_components_data_table_toolbarItems_FilterResolver = require('./toolbarItems/FilterResolver.cjs');
+const require_components_sizing_index = require('../sizing/index.cjs');
+const require_components_data_table_toolbarItems_FilterGroup = require('./toolbarItems/FilterGroup.cjs');
+const require_components_data_table_useMobileDetection = require('./useMobileDetection.cjs');
+const require_components_index = require('../index.cjs');
+let _lumeweb_portal_framework_ui_core = require("@lumeweb/portal-framework-ui-core");
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/data-table/ToolbarRenderer.tsx
+function ActionItemRenderer(item, commonProps, isMobile) {
+	const actionItem = require_components_data_table_ToolbarRegistry.getAction(item.id);
+	if (!actionItem) return null;
+	const buttonSize = isMobile ? "mobile" : actionItem.size;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_lumeweb_portal_framework_ui_core.Button, {
+		className: actionItem.className,
+		disabled: actionItem.disabled,
+		onClick: () => actionItem.onClick(commonProps),
+		size: buttonSize,
+		title: actionItem.tooltip,
+		variant: actionItem.variant,
+		children: [actionItem.icon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "mr-2",
+			children: actionItem.icon
+		}), actionItem.label]
+	});
+}
+function FilterItemRenderer(item, commonProps) {
+	const filterItem = item;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+			className: "text-sm font-medium",
+			children: filterItem.label
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_data_table_toolbarItems_FilterResolver.FilterResolver, {
+			filterItem,
+			commonProps
+		})]
+	});
+}
+function FilterGroupItemRenderer(item, commonProps) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_data_table_toolbarItems_FilterGroup.FilterGroup, {
+		item,
+		commonProps
+	});
+}
+function SeparatorItemRenderer(item, commonProps) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "h-6 w-px bg-gray-300" });
+}
+function registerDefaultRenderers() {
+	toolbarItemRenderers.set(require_components_data_table_DataTable_types.ToolbarItemType.ACTION, ActionItemRenderer);
+	toolbarItemRenderers.set(require_components_data_table_DataTable_types.ToolbarItemType.FILTER, FilterItemRenderer);
+	toolbarItemRenderers.set(require_components_data_table_DataTable_types.ToolbarItemType.FILTER_GROUP, FilterGroupItemRenderer);
+	toolbarItemRenderers.set(require_components_data_table_DataTable_types.ToolbarItemType.SEPARATOR, SeparatorItemRenderer);
+}
+function ToolbarRenderer({ item, commonProps, className }) {
+	const mobileBreakpoint = commonProps.context?.toolbarConfig?.mobileBreakpoint;
+	const candidate = mobileBreakpoint && Object.values(require_components_sizing_index.ComponentSize).includes(mobileBreakpoint) ? mobileBreakpoint : require_components_sizing_index.ComponentSize.SM;
+	const { isMobile } = require_components_data_table_useMobileDetection.useMobileDetection({ mobileBreakpoint: (typeof candidate === "string" && !coreSupported.has(candidate) ? require_components_sizing_index.ComponentSize.SM : candidate) || require_components_sizing_index.ComponentSize.SM });
+	const containerClassName = (0, _lumeweb_portal_framework_ui_core.cn)("flex items-center", item.type === require_components_data_table_DataTable_types.ToolbarItemType.SEPARATOR && "mx-2", className);
+	if (item.type === require_components_data_table_DataTable_types.ToolbarItemType.CUSTOM) {
+		const CustomComponent = item.component;
+		if (CustomComponent) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: containerClassName,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CustomComponent, { ...commonProps })
+		});
+		return null;
+	}
+	const renderer = ToolbarRendererRegistry.get(item.type);
+	if (!renderer) {
+		console.warn(`No renderer registered for toolbar item type: ${item.type}`);
+		return null;
+	}
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: containerClassName,
+		children: renderer(item, commonProps, isMobile)
+	});
+}
+var toolbarItemRenderers, coreSupported, ToolbarRendererRegistry;
+var init_ToolbarRenderer = require_rolldown_runtime.__esmMin((() => {
+	require_components_data_table_toolbarItems_FilterGroup.init_FilterGroup();
+	require_components_data_table_toolbarItems_FilterResolver.init_FilterResolver();
+	require_components_data_table_DataTable_types.init_DataTable_types();
+	require_components_data_table_ToolbarRegistry.init_ToolbarRegistry();
+	require_components_data_table_useMobileDetection.init_useMobileDetection();
+	require_components_index.init_components();
+	toolbarItemRenderers = /* @__PURE__ */ new Map();
+	coreSupported = new Set([
+		"xs",
+		"sm",
+		"md",
+		"lg",
+		"xl",
+		"2xl",
+		"3xl",
+		"4xl",
+		"5xl",
+		"6xl",
+		"7xl",
+		"auto",
+		"full"
+	]);
+	registerDefaultRenderers();
+	ToolbarRendererRegistry = {
+		register(type, renderer) {
+			toolbarItemRenderers.set(type, renderer);
+		},
+		get(type) {
+			return toolbarItemRenderers.get(type);
+		},
+		has(type) {
+			return toolbarItemRenderers.has(type);
+		},
+		remove(type) {
+			return toolbarItemRenderers.delete(type);
+		},
+		clear() {
+			toolbarItemRenderers.clear();
+			registerDefaultRenderers();
+		},
+		list() {
+			return Array.from(toolbarItemRenderers.keys());
+		}
+	};
+}));
+
+//#endregion
+init_ToolbarRenderer();
+exports.ToolbarRenderer = ToolbarRenderer;
+exports.ToolbarRendererRegistry = ToolbarRendererRegistry;
+Object.defineProperty(exports, 'init_ToolbarRenderer', {
+  enumerable: true,
+  get: function () {
+    return init_ToolbarRenderer;
+  }
+});
+//# sourceMappingURL=ToolbarRenderer.cjs.map

package/dist/cjs/components/data-table/ToolbarRenderer.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarRenderer.cjs","names":["getAction","Button","FilterResolver","FilterGroup","ToolbarItemType","ComponentSize","useMobileDetection"],"sources":["../../../../src/components/data-table/ToolbarRenderer.tsx"],"sourcesContent":["import { Button, cn } from \"@lumeweb/portal-framework-ui-core\";\nimport React from \"react\";\nimport { FilterGroup } from \"./toolbarItems/FilterGroup\";\nimport { FilterResolver } from \"./toolbarItems/FilterResolver\";\n\nimport {\n  ExtendedToolbarItem,\n  FilterConfig,\n  ToolbarCustomItem,\n  ToolbarFilterGroupItem,\n  ToolbarFilterItem,\n  ToolbarItemComponentProps,\n  ToolbarItemType,\n} from \"./DataTable.types\";\nimport { BaseRecord } from \"@refinedev/core\";\nimport { getAction } from \"./ToolbarRegistry\";\nimport { useMobileDetection } from \"./useMobileDetection\";\nimport { ComponentSize } from \"@/components\";\n\n// Registry for toolbar item renderers\ntype ToolbarItemRenderer<TData extends BaseRecord> = (\n  item: ExtendedToolbarItem<TData>,\n  commonProps: ToolbarItemComponentProps<TData>,\n) => React.ReactNode;\n\nconst toolbarItemRenderers = new Map<string, ToolbarItemRenderer<any>>();\n\n// Define core supported breakpoints\nconst coreSupported = new Set([\"xs\", \"sm\", \"md\", \"lg\", \"xl\", \"2xl\", \"3xl\", \"4xl\", \"5xl\", \"6xl\", \"7xl\", \"auto\", \"full\"]);\n\n// Internal renderer components\nfunction ActionItemRenderer<TData extends BaseRecord>(\n  item: ExtendedToolbarItem<TData>,\n  commonProps: ToolbarItemComponentProps<TData>,\n  isMobile: boolean,\n) {\n  const actionItem = getAction<TData>(item.id);\n  if (!actionItem) return null;\n\n  // Use mobile size on small screens for better touch targets\n  const buttonSize = isMobile ? \"mobile\" : actionItem.size;\n\n  return (\n    <Button\n      className={actionItem.className}\n      disabled={actionItem.disabled}\n      onClick={() => actionItem.onClick(commonProps)}\n      size={buttonSize}\n      title={actionItem.tooltip}\n      variant={actionItem.variant}>\n      {actionItem.icon && <span className=\"mr-2\">{actionItem.icon}</span>}\n      {actionItem.label}\n    </Button>\n  );\n}\n\nfunction FilterItemRenderer<TData extends BaseRecord>(\n  item: ExtendedToolbarItem<TData>,\n  commonProps: ToolbarItemComponentProps<TData>,\n) {\n  const filterItem = item as ToolbarFilterItem<TData>;\n\n  return (\n    <div className=\"flex flex-col\">\n      <label className=\"text-sm font-medium\">{filterItem.label}</label>\n      <FilterResolver filterItem={filterItem} commonProps={commonProps} />\n    </div>\n  );\n}\n\nfunction FilterGroupItemRenderer<TData extends BaseRecord>(\n  item: ExtendedToolbarItem<TData>,\n  commonProps: ToolbarItemComponentProps<TData>,\n) {\n  const filterGroupItem = item as ToolbarFilterGroupItem<TData>;\n\n  return <FilterGroup item={filterGroupItem} commonProps={commonProps} />;\n}\n\nfunction SeparatorItemRenderer<TData extends BaseRecord>(\n  item: ExtendedToolbarItem<TData>,\n  commonProps: ToolbarItemComponentProps<TData>,\n) {\n  return <div className=\"h-6 w-px bg-gray-300\" />;\n}\n\n// Register default renderers\nfunction registerDefaultRenderers() {\n  // Action item renderer\n  toolbarItemRenderers.set(ToolbarItemType.ACTION, ActionItemRenderer);\n  toolbarItemRenderers.set(ToolbarItemType.FILTER, FilterItemRenderer);\n  toolbarItemRenderers.set(\n    ToolbarItemType.FILTER_GROUP,\n    FilterGroupItemRenderer,\n  );\n\n  // Separator item renderer\n  toolbarItemRenderers.set(ToolbarItemType.SEPARATOR, SeparatorItemRenderer);\n}\n\n// Initialize default renderers\nregisterDefaultRenderers();\n\n// Registry API\nexport const ToolbarRendererRegistry = {\n  /**\n   * Register a custom renderer for a toolbar item type\n   */\n  register<TData extends BaseRecord>(\n    type: string,\n    renderer: ToolbarItemRenderer<TData>,\n  ) {\n    toolbarItemRenderers.set(type, renderer);\n  },\n\n  /**\n   * Get a registered renderer for a toolbar item type\n   */\n  get<TData extends BaseRecord>(\n    type: string,\n  ): ToolbarItemRenderer<TData> | undefined {\n    return toolbarItemRenderers.get(type);\n  },\n\n  /**\n   * Check if a renderer is registered for a type\n   */\n  has(type: string): boolean {\n    return toolbarItemRenderers.has(type);\n  },\n\n  /**\n   * Remove a registered renderer\n   */\n  remove(type: string): boolean {\n    return toolbarItemRenderers.delete(type);\n  },\n\n  /**\n   * Clear all registered renderers\n   */\n  clear() {\n    toolbarItemRenderers.clear();\n    registerDefaultRenderers(); // Re-register defaults\n  },\n\n  list(): string[] {\n    return Array.from(toolbarItemRenderers.keys());\n  },\n};\n\ninterface ToolbarRendererProps<TData extends BaseRecord> {\n  /** The toolbar item to render */\n  item: ExtendedToolbarItem<TData>;\n  /** Common props passed to all toolbar item components */\n  commonProps: ToolbarItemComponentProps<TData>;\n  /** Additional class name for the item container */\n  className?: string;\n}\n\nfunction ToolbarRenderer<TData extends BaseRecord>({\n  item,\n  commonProps,\n  className,\n}: ToolbarRendererProps<TData>) {\n  // Validate mobileBreakpoint value\n  const mobileBreakpoint = commonProps.context?.toolbarConfig?.mobileBreakpoint;\n  const candidate =\n    mobileBreakpoint &&\n    Object.values(ComponentSize).includes(mobileBreakpoint as ComponentSize)\n      ? mobileBreakpoint\n      : ComponentSize.SM;\n\n  const breakpointName =\n    typeof candidate === \"string\" && !coreSupported.has(candidate)\n      ? ComponentSize.SM\n      : candidate;\n\n  // Check if we're on mobile to adjust button sizing\n  const { isMobile } = useMobileDetection({\n    mobileBreakpoint: breakpointName || ComponentSize.SM,\n  });\n\n  const containerClassName = cn(\n    \"flex items-center\",\n    item.type === ToolbarItemType.SEPARATOR && \"mx-2\",\n    className,\n  );\n\n  // Handle CUSTOM type items directly\n  if (item.type === ToolbarItemType.CUSTOM) {\n    const customItem = item as ToolbarCustomItem<TData>;\n    const CustomComponent = customItem.component;\n\n    if (CustomComponent) {\n      return (\n        <div className={containerClassName}>\n          <CustomComponent {...commonProps} />\n        </div>\n      );\n    }\n\n    return null;\n  }\n\n  const renderer = ToolbarRendererRegistry.get<TData>(item.type);\n\n  if (!renderer) {\n    console.warn(`No renderer registered for toolbar item type: ${item.type}`);\n    return null;\n  }\n\n  const renderedItem = renderer(item, commonProps, isMobile);\n\n  return <div className={containerClassName}>{renderedItem}</div>;\n}\n\nexport { ToolbarRenderer };\n"],"mappings":";;;;;;;;;;;;;;AA+BA,SAAS,mBACP,MACA,aACA,UACA;CACA,MAAM,aAAaA,wDAAiB,KAAK,GAAG;AAC5C,KAAI,CAAC,WAAY,QAAO;CAGxB,MAAM,aAAa,WAAW,WAAW,WAAW;AAEpD,QACE,4CAACC;EACC,WAAW,WAAW;EACtB,UAAU,WAAW;EACrB,eAAe,WAAW,QAAQ,YAAY;EAC9C,MAAM;EACN,OAAO,WAAW;EAClB,SAAS,WAAW;aACnB,WAAW,QAAQ,2CAAC;GAAK,WAAU;aAAQ,WAAW;IAAY,EAClE,WAAW;GACL;;AAIb,SAAS,mBACP,MACA,aACA;CACA,MAAM,aAAa;AAEnB,QACE,4CAAC;EAAI,WAAU;aACb,2CAAC;GAAM,WAAU;aAAuB,WAAW;IAAc,EACjE,2CAACC;GAA2B;GAAyB;IAAe;GAChE;;AAIV,SAAS,wBACP,MACA,aACA;AAGA,QAAO,2CAACC;EAFgB;EAEgC;GAAe;;AAGzE,SAAS,sBACP,MACA,aACA;AACA,QAAO,2CAAC,SAAI,WAAU,yBAAyB;;AAIjD,SAAS,2BAA2B;AAElC,sBAAqB,IAAIC,8DAAgB,QAAQ,mBAAmB;AACpE,sBAAqB,IAAIA,8DAAgB,QAAQ,mBAAmB;AACpE,sBAAqB,IACnBA,8DAAgB,cAChB,wBACD;AAGD,sBAAqB,IAAIA,8DAAgB,WAAW,sBAAsB;;AA+D5E,SAAS,gBAA0C,EACjD,MACA,aACA,aAC8B;CAE9B,MAAM,mBAAmB,YAAY,SAAS,eAAe;CAC7D,MAAM,YACJ,oBACA,OAAO,OAAOC,8CAAc,CAAC,SAAS,iBAAkC,GACpE,mBACAA,8CAAc;CAQpB,MAAM,EAAE,aAAaC,oEAAmB,EACtC,mBANA,OAAO,cAAc,YAAY,CAAC,cAAc,IAAI,UAAU,GAC1DD,8CAAc,KACd,cAIgCA,8CAAc,IACnD,CAAC;CAEF,MAAM,+DACJ,qBACA,KAAK,SAASD,8DAAgB,aAAa,QAC3C,UACD;AAGD,KAAI,KAAK,SAASA,8DAAgB,QAAQ;EAExC,MAAM,kBADa,KACgB;AAEnC,MAAI,gBACF,QACE,2CAAC;GAAI,WAAW;aACd,2CAAC,mBAAgB,GAAI,cAAe;IAChC;AAIV,SAAO;;CAGT,MAAM,WAAW,wBAAwB,IAAW,KAAK,KAAK;AAE9D,KAAI,CAAC,UAAU;AACb,UAAQ,KAAK,iDAAiD,KAAK,OAAO;AAC1E,SAAO;;AAKT,QAAO,2CAAC;EAAI,WAAW;YAFF,SAAS,MAAM,aAAa,SAAS;GAEK;;;;0EApNR;gFACM;qEAUpC;qEAEmB;2EACY;2CACb;CAQvC,uCAAuB,IAAI,KAAuC;CAGlE,gBAAgB,IAAI,IAAI;EAAC;EAAM;EAAM;EAAM;EAAM;EAAM;EAAO;EAAO;EAAO;EAAO;EAAO;EAAO;EAAQ;EAAO,CAAC;AAyEvH,2BAA0B;CAGb,0BAA0B;EAIrC,SACE,MACA,UACA;AACA,wBAAqB,IAAI,MAAM,SAAS;;EAM1C,IACE,MACwC;AACxC,UAAO,qBAAqB,IAAI,KAAK;;EAMvC,IAAI,MAAuB;AACzB,UAAO,qBAAqB,IAAI,KAAK;;EAMvC,OAAO,MAAuB;AAC5B,UAAO,qBAAqB,OAAO,KAAK;;EAM1C,QAAQ;AACN,wBAAqB,OAAO;AAC5B,6BAA0B;;EAG5B,OAAiB;AACf,UAAO,MAAM,KAAK,qBAAqB,MAAM,CAAC;;EAEjD"}