@orbe-agro/client-core-prod 5.3.185

package/dist/@ecme/components/shared/DataTable.js

@@ -0,0 +1,291 @@
+import { jsx as n, jsxs as g, Fragment as se } from "react/jsx-runtime";
+import ce from "../../assets/svg/FileNotFound.js";
+import { Checkbox as de } from "../ui/Checkbox/index.js";
+import "../ui/Pagination/index.js";
+import "../ui/Select/index.js";
+import { Table as q } from "../ui/Table/index.js";
+import { useReactTable as ge, getSortedRowModel as me, getPaginationRowModel as he, getFilteredRowModel as ue, getCoreRowModel as fe, flexRender as D } from "@tanstack/react-table";
+import E from "classnames";
+import { useRef as O, useEffect as S, useState as F, useMemo as H, useImperativeHandle as Ce, Fragment as Se } from "react";
+import { useTranslation as pe } from "react-i18next";
+import xe from "./loaders/TableRowSkeleton.js";
+import Re from "./Loading.js";
+import we from "../ui/Pagination/Pagination.js";
+import be from "../ui/Select/Select.js";
+const { Tr: C, Th: ke, Td: M, THead: ve, TBody: Ie, Sorter: ye } = q, $ = (s) => {
+  const {
+    indeterminate: m,
+    onChange: u,
+    onCheckBoxChange: h,
+    onIndeterminateCheckBoxChange: f,
+    ...l
+  } = s, c = O(null);
+  S(() => {
+    typeof m == "boolean" && c.current && (c.current.indeterminate = !l.checked && m);
+  }, [c, m]);
+  const p = (d) => {
+    u(d), h?.(d), f?.(d);
+  };
+  return /* @__PURE__ */ n(
+    de,
+    {
+      ref: c,
+      className: "mb-0",
+      onChange: (d, x) => p(x),
+      ...l
+    }
+  );
+};
+function Oe(s) {
+  const {
+    skeletonAvatarColumns: m,
+    columns: u = [],
+    data: h = [],
+    customNoDataIcon: f,
+    loading: l,
+    noData: c,
+    onCheckBoxChange: p,
+    onIndeterminateCheckBoxChange: d,
+    onPaginationChange: x,
+    onSelectChange: V,
+    onSort: L,
+    pageSizes: N = [10, 25, 50, 100],
+    selectable: P = !1,
+    skeletonAvatarProps: W,
+    pagingData: T = {
+      total: 0,
+      pageIndex: 1,
+      pageSize: 10
+    },
+    checkboxChecked: R,
+    indeterminateCheckboxChecked: A,
+    instanceId: _ = "data-table",
+    ref: G,
+    renderSubComponent: J = () => null,
+    getRowCanExpand: K = () => !1,
+    onSelectionChange: w,
+    hidePagination: Q = !1,
+    ...U
+  } = s, { pageSize: b, pageIndex: X, total: Y } = T, [r, Z] = F(null), [ee, k] = F({}), { t: te } = pe(), B = H(
+    () => N.map((e) => ({
+      value: e,
+      label: `${e} / ${te("common.table.pageAbbr")}`
+    })),
+    [N]
+  );
+  S(() => {
+    if (Array.isArray(r)) {
+      const e = r.length > 0 ? r[0].desc ? "desc" : "asc" : "", t = r.length > 0 ? r[0].id : "";
+      L?.({ order: e, key: t });
+    }
+  }, [r]);
+  const ne = (e, t) => {
+    l || d?.(e, t);
+  }, oe = (e, t) => {
+    l || p?.(e, t);
+  }, v = H(() => {
+    const e = u;
+    return P ? [
+      {
+        id: "select",
+        maxSize: 50,
+        header: ({ table: t }) => /* @__PURE__ */ n(
+          $,
+          {
+            checked: A ? A(
+              t.getRowModel().rows
+            ) : t.getIsAllRowsSelected(),
+            indeterminate: t.getIsSomeRowsSelected(),
+            onChange: t.getToggleAllRowsSelectedHandler(),
+            onIndeterminateCheckBoxChange: (o) => {
+              ne(
+                o.target.checked,
+                t.getRowModel().rows
+              );
+            }
+          }
+        ),
+        cell: ({ row: t }) => /* @__PURE__ */ n(
+          $,
+          {
+            checked: R ? R(t.original) : t.getIsSelected(),
+            disabled: !t.getCanSelect(),
+            indeterminate: t.getIsSomeSelected(),
+            onChange: t.getToggleSelectedHandler(),
+            onCheckBoxChange: (o) => oe(
+              o.target.checked,
+              t.original
+            )
+          }
+        )
+      },
+      ...e
+    ] : e;
+  }, [u, P, l, R]), a = ge({
+    data: h,
+    // eslint-disable-next-line  @typescript-eslint/no-explicit-any
+    columns: v,
+    getCoreRowModel: fe(),
+    getFilteredRowModel: ue(),
+    getPaginationRowModel: he(),
+    getSortedRowModel: me(),
+    manualPagination: !0,
+    manualSorting: s.manualSorting ?? !1,
+    onSortingChange: (e) => {
+      Z(e);
+    },
+    onRowSelectionChange: k,
+    state: {
+      sorting: r,
+      rowSelection: ee
+    },
+    getRowCanExpand: K
+  }), le = () => {
+    a.resetSorting();
+  }, j = () => {
+    a.resetRowSelection(!0);
+  };
+  Ce(G, () => ({
+    resetSorting: le,
+    resetSelected: j
+  }));
+  const ae = (e) => {
+    l || (j(), x?.(e));
+  }, re = (e) => {
+    l || V?.(Number(e));
+  }, I = O([]);
+  return S(() => {
+    if (!w) return;
+    const e = a.getSelectedRowModel().rows.map((o) => o.original);
+    e.length === I.current.length && e.every(
+      (o, i) => o === I.current[i]
+    ) || (I.current = e, w(e));
+  }, [a.getState().rowSelection, w, a]), S(() => {
+    if (s.isAllSelected && a) {
+      const e = {};
+      a.getRowModel().rows.forEach((t) => {
+        e[t.id] = !0;
+      }), k(e);
+    } else
+      k({});
+  }, [s.isAllSelected]), /* @__PURE__ */ g(Re, { loading: !!(l && h.length !== 0), type: "cover", children: [
+    /* @__PURE__ */ g(q, { ...U, children: [
+      /* @__PURE__ */ n(ve, { children: a.getHeaderGroups().map((e) => /* @__PURE__ */ n(C, { children: e.headers.map((t) => {
+        const o = t.column.columnDef.meta?.headerAlign || "between";
+        let i = "justify-between";
+        const y = o === "name-center-sorter-end";
+        o === "center" ? i = "justify-center" : o === "start" ? i = "justify-start" : o === "end" && (i = "justify-end"), y && (i = "justify-center");
+        const ie = E("truncate", {
+          // Se for sorterEnd, o SPAN ocupa a largura total para centralizar o nome
+          "w-full text-center": y
+        });
+        let z = "";
+        return y && (z = "ml-auto"), /* @__PURE__ */ n(
+          ke,
+          {
+            colSpan: t.colSpan,
+            children: t.isPlaceholder ? null : /* @__PURE__ */ g(
+              "div",
+              {
+                className: E(
+                  "flex items-center gap-1",
+                  // O 'gap-1' fornece o espaçamento entre Nome e Sorter
+                  i,
+                  t.column.getCanSort() && "cursor-pointer select-none",
+                  l && "pointer-events-none"
+                ),
+                onClick: t.column.getToggleSortingHandler(),
+                children: [
+                  /* @__PURE__ */ n("span", { className: ie, children: D(
+                    t.column.columnDef.header,
+                    t.getContext()
+                  ) }),
+                  t.column.getCanSort() && // O Sorter deve estar em uma div se precisar de classes condicionais (ml-auto)
+                  /* @__PURE__ */ n("div", { className: z, children: /* @__PURE__ */ n(
+                    ye,
+                    {
+                      sort: t.column.getIsSorted()
+                    }
+                  ) })
+                ]
+              }
+            )
+          },
+          t.id
+        );
+      }) }, e.id)) }),
+      l && h.length === 0 ? /* @__PURE__ */ n(
+        xe,
+        {
+          columns: v.length,
+          rows: T.pageSize,
+          avatarInColumns: m,
+          avatarProps: W
+        }
+      ) : /* @__PURE__ */ n(Ie, { children: c ? /* @__PURE__ */ n(C, { children: /* @__PURE__ */ n(
+        M,
+        {
+          className: "hover:bg-transparent",
+          colSpan: v.length,
+          children: /* @__PURE__ */ n("div", { className: "flex flex-col items-center gap-4", children: f || /* @__PURE__ */ g(se, { children: [
+            /* @__PURE__ */ n(ce, {}),
+            /* @__PURE__ */ n("span", { className: "font-semibold", children: "No data found!" })
+          ] }) })
+        }
+      ) }) : a.getRowModel().rows.slice(0, b).map((e) => /* @__PURE__ */ g(Se, { children: [
+        /* @__PURE__ */ n(C, { children: e.getVisibleCells().map((t) => /* @__PURE__ */ n(
+          M,
+          {
+            style: {
+              width: t.column.getSize()
+            },
+            children: D(
+              t.column.columnDef.cell,
+              t.getContext()
+            )
+          },
+          t.id
+        )) }, e.id),
+        e.getIsExpanded() && /* @__PURE__ */ n(C, { children: /* @__PURE__ */ n(
+          M,
+          {
+            colSpan: e.getVisibleCells().length,
+            children: J(
+              e
+            )
+          }
+        ) })
+      ] }, e.id)) })
+    ] }),
+    !Q && /* @__PURE__ */ g("div", { className: "mt-4 flex items-center justify-between", children: [
+      /* @__PURE__ */ n(
+        we,
+        {
+          pageSize: b,
+          currentPage: X,
+          total: Y,
+          onChange: ae
+        }
+      ),
+      /* @__PURE__ */ n("div", { style: { minWidth: 130 }, children: /* @__PURE__ */ n(
+        be,
+        {
+          instanceId: _,
+          size: "sm",
+          menuPlacement: "top",
+          isSearchable: !1,
+          value: B.filter(
+            (e) => e.value === b
+          ),
+          options: B,
+          onChange: (e) => re(e?.value)
+        }
+      ) })
+    ] })
+  ] });
+}
+export {
+  Oe as DataTable,
+  Oe as default
+};
+//# sourceMappingURL=DataTable.js.map

package/dist/@ecme/components/shared/DataTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.js","sources":["../../../../lib/@ecme/components/shared/DataTable.tsx"],"sourcesContent":["import FileNotFound from '@/assets/svg/FileNotFound'\nimport type { CheckboxProps } from '@/components/ui/Checkbox'\nimport Checkbox from '@/components/ui/Checkbox'\nimport Pagination from '@/components/ui/Pagination'\nimport Select from '@/components/ui/Select'\nimport type { SkeletonProps } from '@/components/ui/Skeleton'\nimport type { TableProps } from '@/components/ui/Table'\nimport Table from '@/components/ui/Table'\nimport {\n    CellContext,\n    ColumnDef,\n    ColumnSort,\n    flexRender,\n    getCoreRowModel,\n    getFilteredRowModel,\n    getPaginationRowModel,\n    getSortedRowModel,\n    Row,\n    useReactTable,\n} from '@tanstack/react-table'\nimport classNames from 'classnames'\nimport type { ChangeEvent, ReactNode, Ref } from 'react'\nimport {\n    Fragment,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useRef,\n    useState\n} from 'react'\nimport { useTranslation } from 'react-i18next'\nimport TableRowSkeleton from './loaders/TableRowSkeleton'\nimport Loading from './Loading'\n\nexport type OnSortParam = { order: 'asc' | 'desc' | ''; key: string | number }\n\nexport type DataTableProps<T> = {\n    columns: ColumnDef<T>[]\n    customNoDataIcon?: ReactNode\n    data?: T[]\n    loading?: boolean\n    noData?: boolean\n    instanceId?: string\n    onCheckBoxChange?: (checked: boolean, row: T) => void\n    onIndeterminateCheckBoxChange?: (checked: boolean, rows: Row<T>[]) => void\n    onPaginationChange?: (page: number) => void\n    onSelectChange?: (num: number) => void\n    onSort?: (sort: OnSortParam) => void\n    pageSizes?: number[]\n    manualSorting?: boolean\n    selectable?: boolean\n    skeletonAvatarColumns?: number[]\n    skeletonAvatarProps?: SkeletonProps\n    pagingData?: {\n        total: number\n        pageIndex: number\n        pageSize: number\n    }\n    checkboxChecked?: (row: T) => boolean\n    indeterminateCheckboxChecked?: (row: Row<T>[]) => boolean\n    ref?: Ref<DataTableResetHandle | HTMLTableElement>\n    onSelectionChange?: (selected: T[]) => void\n    renderSubComponent?: (row: Row<T>) => React.ReactNode\n    getRowCanExpand?: (row: Row<T>) => boolean\n    hidePagination?: boolean\n    isAllSelected?: boolean\n} & TableProps\n\nexport type CheckBoxChangeEvent = ChangeEvent<HTMLInputElement>\n\nexport interface IndeterminateCheckboxProps\n    extends Omit<CheckboxProps, 'onChange'> {\n    onChange: (event: CheckBoxChangeEvent) => void\n    indeterminate: boolean\n    onCheckBoxChange?: (event: CheckBoxChangeEvent) => void\n    onIndeterminateCheckBoxChange?: (event: CheckBoxChangeEvent) => void\n}\n\nconst { Tr, Th, Td, THead, TBody, Sorter } = Table\n\nconst IndeterminateCheckbox = (props: IndeterminateCheckboxProps) => {\n    const {\n        indeterminate,\n        onChange,\n        onCheckBoxChange,\n        onIndeterminateCheckBoxChange,\n        ...rest\n    } = props\n\n    const ref = useRef<HTMLInputElement>(null)\n\n    useEffect(() => {\n        if (typeof indeterminate === 'boolean' && ref.current) {\n            ref.current.indeterminate = !rest.checked && indeterminate\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [ref, indeterminate])\n\n    const handleChange = (e: CheckBoxChangeEvent) => {\n        onChange(e)\n        onCheckBoxChange?.(e)\n        onIndeterminateCheckBoxChange?.(e)\n    }\n\n    return (\n        <Checkbox\n            ref={ref}\n            className=\"mb-0\"\n            onChange={(_, e) => handleChange(e)}\n            {...rest}\n        />\n    )\n}\n\nexport type DataTableResetHandle = {\n    resetSorting: () => void\n    resetSelected: () => void\n}\n\nfunction DataTable<T>(props: DataTableProps<T>) {\n    const {\n        skeletonAvatarColumns,\n        columns: columnsProp = [],\n        data = [],\n        customNoDataIcon,\n        loading,\n        noData,\n        onCheckBoxChange,\n        onIndeterminateCheckBoxChange,\n        onPaginationChange,\n        onSelectChange,\n        onSort,\n        pageSizes = [10, 25, 50, 100],\n        selectable = false,\n        skeletonAvatarProps,\n        pagingData = {\n            total: 0,\n            pageIndex: 1,\n            pageSize: 10,\n        },\n        checkboxChecked,\n        indeterminateCheckboxChecked,\n        instanceId = 'data-table',\n        ref,\n        renderSubComponent = () => null,\n        getRowCanExpand = () => false,\n        onSelectionChange,\n        hidePagination = false,\n        ...rest\n    } = props\n\n    const { pageSize, pageIndex, total } = pagingData\n\n    const [sorting, setSorting] = useState<ColumnSort[] | null>(null)\n    const [selection, setRowSelection] = useState({})\n\n    const { t } = useTranslation()\n\n    const pageSizeOption = useMemo(\n        () =>\n            pageSizes.map((number) => ({\n                value: number,\n                label: `${number} / ${t('common.table.pageAbbr')}`,\n            })),\n        [pageSizes],\n    )\n\n    useEffect(() => {\n        if (Array.isArray(sorting)) {\n            const sortOrder =\n                sorting.length > 0 ? (sorting[0].desc ? 'desc' : 'asc') : ''\n            const id = sorting.length > 0 ? sorting[0].id : ''\n            onSort?.({ order: sortOrder, key: id })\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [sorting])\n\n    const handleIndeterminateCheckBoxChange = (\n        checked: boolean,\n        rows: Row<T>[],\n    ) => {\n        if (!loading) {\n            onIndeterminateCheckBoxChange?.(checked, rows)\n        }\n    }\n\n    const handleCheckBoxChange = (checked: boolean, row: T) => {\n        if (!loading) {\n            onCheckBoxChange?.(checked, row)\n        }\n    }\n\n    const finalColumns: ColumnDef<T>[] = useMemo(() => {\n        const columns = columnsProp\n\n        if (selectable) {\n            return [\n                {\n                    id: 'select',\n                    maxSize: 50,\n                    header: ({ table }) => (\n                        <IndeterminateCheckbox\n                            checked={\n                                indeterminateCheckboxChecked\n                                    ? indeterminateCheckboxChecked(\n                                        table.getRowModel().rows,\n                                    )\n                                    : table.getIsAllRowsSelected()\n                            }\n                            indeterminate={table.getIsSomeRowsSelected()}\n                            onChange={table.getToggleAllRowsSelectedHandler()}\n                            onIndeterminateCheckBoxChange={(e) => {\n                                handleIndeterminateCheckBoxChange(\n                                    e.target.checked,\n                                    table.getRowModel().rows,\n                                )\n                            }}\n                        />\n                    ),\n                    cell: ({ row }) => (\n                        <IndeterminateCheckbox\n                            checked={\n                                checkboxChecked\n                                    ? checkboxChecked(row.original)\n                                    : row.getIsSelected()\n                            }\n                            disabled={!row.getCanSelect()}\n                            indeterminate={row.getIsSomeSelected()}\n                            onChange={row.getToggleSelectedHandler()}\n                            onCheckBoxChange={(e) =>\n                                handleCheckBoxChange(\n                                    e.target.checked,\n                                    row.original,\n                                )\n                            }\n                        />\n                    ),\n                },\n                ...columns,\n            ]\n        }\n        return columns\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [columnsProp, selectable, loading, checkboxChecked])\n\n    const table = useReactTable({\n        data,\n        // eslint-disable-next-line  @typescript-eslint/no-explicit-any\n        columns: finalColumns,\n        getCoreRowModel: getCoreRowModel(),\n        getFilteredRowModel: getFilteredRowModel(),\n        getPaginationRowModel: getPaginationRowModel(),\n        getSortedRowModel: getSortedRowModel(),\n        manualPagination: true,\n        manualSorting: props.manualSorting ?? false,\n        onSortingChange: (sorter) => {\n            setSorting(sorter as ColumnSort[])\n        },\n        onRowSelectionChange: setRowSelection,\n        state: {\n            sorting: sorting as ColumnSort[],\n            rowSelection: selection,\n        },\n        getRowCanExpand,\n    })\n\n    const resetSorting = () => {\n        table.resetSorting()\n    }\n\n    const resetSelected = () => {\n        table.resetRowSelection(true)\n    }\n\n    useImperativeHandle(ref, () => ({\n        resetSorting,\n        resetSelected,\n    }))\n\n    const handlePaginationChange = (page: number) => {\n        if (!loading) {\n            resetSelected()\n            onPaginationChange?.(page)\n        }\n    }\n\n    const handleSelectChange = (value?: number) => {\n        if (!loading) {\n            onSelectChange?.(Number(value))\n        }\n    }\n\n    const prevSelectedRef = useRef<T[]>([])\n\n    useEffect(() => {\n        if (!onSelectionChange) return\n\n        const selectedRows = table\n            .getSelectedRowModel()\n            .rows.map((r) => r.original as T)\n\n        const isEqual =\n            selectedRows.length === prevSelectedRef.current.length &&\n            selectedRows.every(\n                (item, idx) => item === prevSelectedRef.current[idx],\n            )\n\n        if (!isEqual) {\n            prevSelectedRef.current = selectedRows\n            onSelectionChange(selectedRows)\n        }\n    }, [table.getState().rowSelection, onSelectionChange, table])\n\n    useEffect(() => {\n        if (props.isAllSelected && table) {\n            const all = {}\n            table.getRowModel().rows.forEach((row) => {\n                all[row.id] = true\n            })\n            setRowSelection(all)\n        } else {\n            setRowSelection({})\n        }\n    }, [props.isAllSelected])\n\n    return (\n        <Loading loading={Boolean(loading && data.length !== 0)} type=\"cover\">\n            <Table {...rest}>\n                <THead>\n                    {table.getHeaderGroups().map((headerGroup) => (\n                        <Tr key={headerGroup.id}>\n                            {headerGroup.headers.map((header) => {\n                                // 1. LEITURA E VALIDAÇÕES DO ALINHAMENTO\n                                const headerAlign = (header.column.columnDef as any).meta?.headerAlign || 'between';\n\n                                let justifyClass = 'justify-between'; // Padrão: Nome Esquerda, Sorter Direita\n\n                                // Flag para o alinhamento complexo desejado\n                                const sorterEnd = headerAlign === 'name-center-sorter-end';\n\n                                // Define a classe de justificação principal para os alinhamentos simples\n                                if (headerAlign === 'center') {\n                                    justifyClass = 'justify-center'; // Nome + Sorter juntos no centro\n                                } else if (headerAlign === 'start') {\n                                    justifyClass = 'justify-start'; // Nome + Sorter juntos na esquerda\n                                } else if (headerAlign === 'end') {\n                                    justifyClass = 'justify-end'; // Nome + Sorter juntos na direita\n                                }\n\n                                // Se for o layout complexo, usamos 'justify-center' como base\n                                if (sorterEnd) {\n                                    // Usamos justify-center, e o ml-auto do Sorter o empurra para o canto.\n                                    justifyClass = 'justify-center';\n                                }\n\n                                // Define classes para o SPAN do nome (Ocupa largura total e centraliza o texto)\n                                const nameClasses = classNames('truncate', {\n                                    // Se for sorterEnd, o SPAN ocupa a largura total para centralizar o nome\n                                    'w-full text-center': sorterEnd,\n                                });\n\n                                // Define a classe para o wrapper do Sorter.\n                                let sorterClasses = '';\n                                if (sorterEnd) {\n                                    // Para sorterEnd, ml-auto empurra o Sorter para a EXTREMA direita\n                                    sorterClasses = 'ml-auto';\n                                }\n\n                                return (\n                                    <Th\n                                        key={header.id}\n                                        colSpan={header.colSpan}\n                                    >\n                                        {header.isPlaceholder ? null : (\n                                            <div\n                                                className={classNames(\n                                                    'flex items-center gap-1', // O 'gap-1' fornece o espaçamento entre Nome e Sorter\n                                                    justifyClass,\n                                                    header.column.getCanSort() &&\n                                                    'cursor-pointer select-none',\n                                                    loading &&\n                                                    'pointer-events-none',\n                                                )}\n                                                onClick={header.column.getToggleSortingHandler()}\n                                            >\n                                                {/* 2. RENDERIZAÇÃO DO NOME (Sempre primeiro, pois o Sorter deve ser à direita) */}\n                                                <span className={nameClasses}>\n                                                    {flexRender(\n                                                        header.column.columnDef\n                                                            .header,\n                                                        header.getContext(),\n                                                    )}\n                                                </span>\n\n                                                {/* 3. RENDERIZAÇÃO DO SORTER: Sempre depois do nome. O ml-auto será aplicado APENAS em sorterEnd */}\n                                                {header.column.getCanSort() && (\n                                                    // O Sorter deve estar em uma div se precisar de classes condicionais (ml-auto)\n                                                    <div className={sorterClasses}>\n                                                        <Sorter\n                                                            sort={header.column.getIsSorted()}\n                                                        />\n                                                    </div>\n                                                )}\n                                            </div>\n                                        )}\n                                    </Th>\n                                );\n                            })}\n                        </Tr>\n                    ))}\n                </THead>\n                {loading && data.length === 0 ? (\n                    <TableRowSkeleton\n                        columns={(finalColumns as Array<T>).length}\n                        rows={pagingData.pageSize}\n                        avatarInColumns={skeletonAvatarColumns}\n                        avatarProps={skeletonAvatarProps}\n                    />\n                ) : (\n                    <TBody>\n                        {noData ? (\n                            <Tr>\n                                <Td\n                                    className=\"hover:bg-transparent\"\n                                    colSpan={finalColumns.length}\n                                >\n                                    <div className=\"flex flex-col items-center gap-4\">\n                                        {customNoDataIcon ? (\n                                            customNoDataIcon\n                                        ) : (\n                                            <>\n                                                <FileNotFound />\n                                                <span className=\"font-semibold\">\n                                                    No data found!\n                                                </span>\n                                            </>\n                                        )}\n                                    </div>\n                                </Td>\n                            </Tr>\n                        ) : (\n                            table\n                                .getRowModel()\n                                .rows.slice(0, pageSize)\n                                .map((row) => {\n                                    return (\n                                        <Fragment key={row.id}>\n                                            <Tr key={row.id}>\n                                                {row\n                                                    .getVisibleCells()\n                                                    .map((cell) => {\n                                                        return (\n                                                            <Td\n                                                                key={cell.id}\n                                                                style={{\n                                                                    width: cell.column.getSize(),\n                                                                }}\n                                                            >\n                                                                {flexRender(\n                                                                    cell.column\n                                                                        .columnDef\n                                                                        .cell,\n                                                                    cell.getContext(),\n                                                                )}\n                                                            </Td>\n                                                        )\n                                                    })}\n                                            </Tr>\n                                            {row.getIsExpanded() && (\n                                                <Tr>\n                                                    <Td\n                                                        colSpan={\n                                                            row.getVisibleCells()\n                                                                .length\n                                                        }\n                                                    >\n                                                        {renderSubComponent(\n                                                            row,\n                                                        )}\n                                                    </Td>\n                                                </Tr>\n                                            )}\n                                        </Fragment>\n                                    )\n                                })\n                        )}\n                    </TBody>\n                )}\n            </Table>\n            {!hidePagination && (\n                <div className=\"mt-4 flex items-center justify-between\">\n                    <Pagination\n                        pageSize={pageSize}\n                        currentPage={pageIndex}\n                        total={total}\n                        onChange={handlePaginationChange}\n                    />\n                    <div style={{ minWidth: 130 }}>\n                        <Select\n                            instanceId={instanceId}\n                            size=\"sm\"\n                            menuPlacement=\"top\"\n                            isSearchable={false}\n                            value={pageSizeOption.filter(\n                                (option) => option.value === pageSize,\n                            )}\n                            options={pageSizeOption}\n                            onChange={(option) =>\n                                handleSelectChange(option?.value)\n                            }\n                        />\n                    </div>\n                </div>\n            )}\n        </Loading>\n    )\n}\n\nexport { DataTable }\nexport type { CellContext, ColumnDef, ColumnSort, Row }\nexport default DataTable\n"],"names":["Tr","Th","Td","THead","TBody","Sorter","Table","IndeterminateCheckbox","props","indeterminate","onChange","onCheckBoxChange","onIndeterminateCheckBoxChange","rest","ref","useRef","useEffect","handleChange","e","jsx","Checkbox","_","DataTable","skeletonAvatarColumns","columnsProp","data","customNoDataIcon","loading","noData","onPaginationChange","onSelectChange","onSort","pageSizes","selectable","skeletonAvatarProps","pagingData","checkboxChecked","indeterminateCheckboxChecked","instanceId","renderSubComponent","getRowCanExpand","onSelectionChange","hidePagination","pageSize","pageIndex","total","sorting","setSorting","useState","selection","setRowSelection","t","useTranslation","pageSizeOption","useMemo","number","sortOrder","id","handleIndeterminateCheckBoxChange","checked","rows","handleCheckBoxChange","row","finalColumns","columns","table","useReactTable","getCoreRowModel","getFilteredRowModel","getPaginationRowModel","getSortedRowModel","sorter","resetSorting","resetSelected","useImperativeHandle","handlePaginationChange","page","handleSelectChange","value","prevSelectedRef","selectedRows","r","item","idx","all","jsxs","Loading","headerGroup","header","headerAlign","justifyClass","sorterEnd","nameClasses","classNames","sorterClasses","flexRender","TableRowSkeleton","Fragment","FileNotFound","cell","Pagination","Select","option"],"mappings":"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"}

package/dist/@ecme/components/shared/DebounceInput.js

@@ -0,0 +1,18 @@
+import { jsx as c } from "react/jsx-runtime";
+import "../ui/Input/index.js";
+import h from "../../utils/hooks/useDebounce.js";
+import m from "../ui/Input/Input.js";
+const b = (e) => {
+  const { wait: o = 500, ref: t, ...u } = e;
+  function r(n) {
+    e.onChange?.(n);
+  }
+  const a = h(r, o);
+  return /* @__PURE__ */ c(m, { ref: t, ...u, onChange: (n) => {
+    a(n);
+  } });
+};
+export {
+  b as default
+};
+//# sourceMappingURL=DebounceInput.js.map

package/dist/@ecme/components/shared/DebounceInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DebounceInput.js","sources":["../../../../lib/@ecme/components/shared/DebounceInput.tsx"],"sourcesContent":["import Input from '@/components/ui/Input'\nimport useDebounce from '@/utils/hooks/useDebounce'\nimport type { ChangeEvent, Ref } from 'react'\nimport type { InputProps } from '@/components/ui/Input'\n\nexport type DebounceInputProps = InputProps & {\n    wait?: number\n    ref?: Ref<HTMLInputElement>\n}\n\nconst DebounceInput = (props: DebounceInputProps) => {\n    const { wait = 500, ref, ...rest } = props\n\n    function handleDebounceFn(value: ChangeEvent<HTMLInputElement>) {\n        props.onChange?.(value)\n    }\n\n    const debounceFn = useDebounce(handleDebounceFn, wait)\n\n    const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n        debounceFn(e)\n    }\n\n    return <Input ref={ref} {...rest} onChange={handleInputChange} />\n}\n\nexport default DebounceInput\n"],"names":["DebounceInput","props","wait","ref","rest","handleDebounceFn","value","debounceFn","useDebounce","Input","e"],"mappings":";;;;AAUM,MAAAA,IAAgB,CAACC,MAA8B;AACjD,QAAM,EAAE,MAAAC,IAAO,KAAK,KAAAC,GAAK,GAAGC,EAAS,IAAAH;AAErC,WAASI,EAAiBC,GAAsC;AAC5D,IAAAL,EAAM,WAAWK,CAAK;AAAA,EAAA;AAGpB,QAAAC,IAAaC,EAAYH,GAAkBH,CAAI;AAMrD,2BAAQO,GAAM,EAAA,KAAAN,GAAW,GAAGC,GAAM,UAJR,CAACM,MAAqC;AAC5D,IAAAH,EAAWG,CAAC;AAAA,EAChB,GAE+D;AACnE;"}

package/dist/@ecme/components/shared/DoubleSidedImage.js

@@ -0,0 +1,16 @@
+import { jsx as d } from "react/jsx-runtime";
+import { useThemeStore as i } from "../../store/themeStore.js";
+import { THEME_ENUM as c } from "../../constants/theme.constant.js";
+const { MODE_DARK: f } = c, E = ({
+  src: o,
+  darkModeSrc: e,
+  alt: m = "",
+  ...r
+}) => {
+  const t = i((s) => s.mode);
+  return /* @__PURE__ */ d("img", { src: t === f ? e : o, alt: m, ...r });
+};
+export {
+  E as default
+};
+//# sourceMappingURL=DoubleSidedImage.js.map

package/dist/@ecme/components/shared/DoubleSidedImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DoubleSidedImage.js","sources":["../../../../lib/@ecme/components/shared/DoubleSidedImage.tsx"],"sourcesContent":["import { useThemeStore } from '@/store/themeStore'\nimport { THEME_ENUM } from '@/constants/theme.constant'\nimport type { DetailedHTMLProps, ImgHTMLAttributes } from 'react'\n\ninterface DoubleSidedImageProps\n    extends DetailedHTMLProps<\n        ImgHTMLAttributes<HTMLImageElement>,\n        HTMLImageElement\n    > {\n    darkModeSrc: string\n}\n\nconst { MODE_DARK } = THEME_ENUM\n\nconst DoubleSidedImage = ({\n    src,\n    darkModeSrc,\n    alt = '',\n    ...rest\n}: DoubleSidedImageProps) => {\n    const mode = useThemeStore((state) => state.mode)\n\n    return (\n        <img src={mode === MODE_DARK ? darkModeSrc : src} alt={alt} {...rest} />\n    )\n}\n\nexport default DoubleSidedImage\n"],"names":["MODE_DARK","THEME_ENUM","DoubleSidedImage","src","darkModeSrc","alt","rest","mode","useThemeStore","state","jsx"],"mappings":";;;AAYA,MAAM,EAAE,WAAAA,EAAc,IAAAC,GAEhBC,IAAmB,CAAC;AAAA,EACtB,KAAAC;AAAA,EACA,aAAAC;AAAA,EACA,KAAAC,IAAM;AAAA,EACN,GAAGC;AACP,MAA6B;AACzB,QAAMC,IAAOC,EAAc,CAACC,MAAUA,EAAM,IAAI;AAG5C,SAAA,gBAAAC,EAAC,SAAI,KAAKH,MAASP,IAAYI,IAAcD,GAAK,KAAAE,GAAW,GAAGC,EAAM,CAAA;AAE9E;"}

package/dist/@ecme/components/shared/EllipsisButton.js

@@ -0,0 +1,27 @@
+import { jsx as o } from "react/jsx-runtime";
+import { TbDots as e } from "react-icons/tb";
+import "../ui/index.js";
+import m from "../ui/Button/Button.js";
+const u = (t) => {
+  const {
+    shape: i = "circle",
+    variant: r = "plain",
+    size: n = "xs",
+    type: s = "button"
+  } = t;
+  return /* @__PURE__ */ o(
+    m,
+    {
+      shape: i,
+      variant: r,
+      size: n,
+      icon: /* @__PURE__ */ o(e, {}),
+      type: s,
+      ...t
+    }
+  );
+};
+export {
+  u as default
+};
+//# sourceMappingURL=EllipsisButton.js.map

package/dist/@ecme/components/shared/EllipsisButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EllipsisButton.js","sources":["../../../../lib/@ecme/components/shared/EllipsisButton.tsx"],"sourcesContent":["import { TbDots } from \"react-icons/tb\";\nimport { Button, ButtonProps } from \"../ui\";\n\ntype EllipsisButtonProps = ButtonProps;\n\nconst EllipsisButton = (props: EllipsisButtonProps) => {\n  const {\n    shape = \"circle\",\n    variant = \"plain\",\n    size = \"xs\",\n    type = \"button\",\n  } = props;\n\n  return (\n    <Button\n      shape={shape}\n      variant={variant}\n      size={size}\n      icon={<TbDots />}\n      type={type}\n      {...props}\n    />\n  );\n};\n\nexport default EllipsisButton;\n"],"names":["EllipsisButton","props","shape","variant","size","type","jsx","Button","TbDots"],"mappings":";;;;AAKM,MAAAA,IAAiB,CAACC,MAA+B;AAC/C,QAAA;AAAA,IACJ,OAAAC,IAAQ;AAAA,IACR,SAAAC,IAAU;AAAA,IACV,MAAAC,IAAO;AAAA,IACP,MAAAC,IAAO;AAAA,EAAA,IACLJ;AAGF,SAAA,gBAAAK;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAAL;AAAA,MACA,SAAAC;AAAA,MACA,MAAAC;AAAA,MACA,wBAAOI,GAAO,EAAA;AAAA,MACd,MAAAH;AAAA,MACC,GAAGJ;AAAA,IAAA;AAAA,EACN;AAEJ;"}

package/dist/@ecme/components/shared/GanttChart/GanttChart.js

@@ -0,0 +1,74 @@
+import { jsxs as c, Fragment as m, jsx as r } from "react/jsx-runtime";
+import { ViewMode as p, Gantt as f } from "gantt-task-react";
+import g from "./TaskListTable.js";
+import k from "./TaskListHeader.js";
+import C from "./TooltipContent.js";
+import h from "./tasksPreProcess.js";
+import { PatternLines as u } from "@visx/pattern";
+const B = (t) => {
+  const {
+    tasks: s,
+    viewMode: l = p.Day,
+    extraColumns: a,
+    colorsMap: i = {},
+    showArrow: n,
+    ...d
+  } = t;
+  return /* @__PURE__ */ c(m, { children: [
+    /* @__PURE__ */ r(
+      f,
+      {
+        tasks: h(s, i),
+        viewMode: l,
+        listCellWidth: "200px",
+        columnWidth: 65,
+        barProgressColor: "#3380fa",
+        barProgressSelectedColor: "#3380fa",
+        barBackgroundColor: "#e2e8f0",
+        barBackgroundSelectedColor: "#e2e8f0",
+        projectProgressColor: "#6299f1",
+        projectProgressSelectedColor: "#6299f1",
+        projectBackgroundColor: "#3380fa",
+        projectBackgroundSelectedColor: "#3380fa",
+        milestoneBackgroundColor: "#3380fa",
+        milestoneBackgroundSelectedColor: "#3380fa",
+        todayColor: "url(#horzLines)",
+        rowHeight: 50,
+        TaskListHeader: (o) => /* @__PURE__ */ r(
+          k,
+          {
+            ...o,
+            extraHeaders: a?.map((e) => e.header)
+          }
+        ),
+        TaskListTable: (o) => /* @__PURE__ */ r(
+          g,
+          {
+            ...o,
+            extraCells: a?.map((e) => e.cell)
+          }
+        ),
+        TooltipContent: C,
+        barCornerRadius: 6,
+        ...n ? {} : { arrowColor: "transparent" },
+        ...d
+      }
+    ),
+    /* @__PURE__ */ r("svg", { className: "h-0 w-0", children: /* @__PURE__ */ r(
+      u,
+      {
+        id: "horzLines",
+        height: 10,
+        width: 10,
+        className: "stroke-gray-200 dark:stroke-gray-700",
+        strokeWidth: 1.5,
+        background: "transparent",
+        orientation: ["diagonal"]
+      }
+    ) })
+  ] });
+};
+export {
+  B as default
+};
+//# sourceMappingURL=GanttChart.js.map

package/dist/@ecme/components/shared/GanttChart/GanttChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GanttChart.js","sources":["../../../../../lib/@ecme/components/shared/GanttChart/GanttChart.tsx"],"sourcesContent":["import { ViewMode, Gantt } from 'gantt-task-react'\nimport TaskListTable from './TaskListTable'\nimport TaskListHeader from './TaskListHeader'\nimport TooltipContent from './TooltipContent'\nimport tasksPreProcess from './tasksPreProcess'\nimport { PatternLines } from '@visx/pattern'\nimport type { ExtraCell } from './TaskListTable'\nimport type { ExtraHeader } from './TaskListHeader'\nimport type { Task, GanttProps } from 'gantt-task-react'\n\ntype ExtendedTask<T extends Record<string, unknown> = NonNullable<unknown>> =\n    Task & {\n        barVariant?: string\n    } & T\n\ntype GanttChartProps<T extends Record<string, unknown>> = GanttProps & {\n    extraColumns?: Array<{\n        header: ExtraHeader\n        cell: ExtraCell\n    }>\n    tasks: ExtendedTask<T>[]\n    colorsMap?: Record<string, string>\n    showArrow?: boolean\n}\n\nconst GanttChart = <T extends Record<string, unknown>>(\n    props: GanttChartProps<T>,\n) => {\n    const {\n        tasks,\n        viewMode = ViewMode.Day,\n        extraColumns,\n        colorsMap = {},\n        showArrow,\n        ...rest\n    } = props\n\n    return (\n        <>\n            <Gantt\n                tasks={tasksPreProcess(tasks, colorsMap)}\n                viewMode={viewMode}\n                listCellWidth={'200px'}\n                columnWidth={65}\n                barProgressColor={'#3380fa'}\n                barProgressSelectedColor={'#3380fa'}\n                barBackgroundColor={'#e2e8f0'}\n                barBackgroundSelectedColor={'#e2e8f0'}\n                projectProgressColor={'#6299f1'}\n                projectProgressSelectedColor={'#6299f1'}\n                projectBackgroundColor=\"#3380fa\"\n                projectBackgroundSelectedColor=\"#3380fa\"\n                milestoneBackgroundColor=\"#3380fa\"\n                milestoneBackgroundSelectedColor=\"#3380fa\"\n                todayColor=\"url(#horzLines)\"\n                rowHeight={50}\n                TaskListHeader={(props) => (\n                    <TaskListHeader\n                        {...props}\n                        extraHeaders={extraColumns?.map((col) => col.header)}\n                    />\n                )}\n                TaskListTable={(props) => (\n                    <TaskListTable\n                        {...props}\n                        extraCells={extraColumns?.map((col) => col.cell)}\n                    />\n                )}\n                TooltipContent={TooltipContent}\n                barCornerRadius={6}\n                {...(!showArrow ? { arrowColor: 'transparent' } : {})}\n                {...rest}\n            />\n            <svg className=\"h-0 w-0\">\n                <PatternLines\n                    id=\"horzLines\"\n                    height={10}\n                    width={10}\n                    className=\"stroke-gray-200 dark:stroke-gray-700\"\n                    strokeWidth={1.5}\n                    background=\"transparent\"\n                    orientation={['diagonal']}\n                />\n            </svg>\n        </>\n    )\n}\n\nexport type { Task, ExtendedTask }\n\nexport default GanttChart\n"],"names":["GanttChart","props","tasks","viewMode","ViewMode","extraColumns","colorsMap","showArrow","rest","jsxs","Fragment","jsx","Gantt","tasksPreProcess","TaskListHeader","col","TaskListTable","TooltipContent","PatternLines"],"mappings":";;;;;;;AAyBM,MAAAA,IAAa,CACfC,MACC;AACK,QAAA;AAAA,IACF,OAAAC;AAAA,IACA,UAAAC,IAAWC,EAAS;AAAA,IACpB,cAAAC;AAAA,IACA,WAAAC,IAAY,CAAC;AAAA,IACb,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACHP;AAEJ,SAEQ,gBAAAQ,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,OAAOC,EAAgBX,GAAOI,CAAS;AAAA,QACvC,UAAAH;AAAA,QACA,eAAe;AAAA,QACf,aAAa;AAAA,QACb,kBAAkB;AAAA,QAClB,0BAA0B;AAAA,QAC1B,oBAAoB;AAAA,QACpB,4BAA4B;AAAA,QAC5B,sBAAsB;AAAA,QACtB,8BAA8B;AAAA,QAC9B,wBAAuB;AAAA,QACvB,gCAA+B;AAAA,QAC/B,0BAAyB;AAAA,QACzB,kCAAiC;AAAA,QACjC,YAAW;AAAA,QACX,WAAW;AAAA,QACX,gBAAgB,CAACF,MACb,gBAAAU;AAAA,UAACG;AAAA,UAAA;AAAA,YACI,GAAGb;AAAAA,YACJ,cAAcI,GAAc,IAAI,CAACU,MAAQA,EAAI,MAAM;AAAA,UAAA;AAAA,QACvD;AAAA,QAEJ,eAAe,CAACd,MACZ,gBAAAU;AAAA,UAACK;AAAA,UAAA;AAAA,YACI,GAAGf;AAAAA,YACJ,YAAYI,GAAc,IAAI,CAACU,MAAQA,EAAI,IAAI;AAAA,UAAA;AAAA,QACnD;AAAA,QAEJ,gBAAAE;AAAA,QACA,iBAAiB;AAAA,QAChB,GAAKV,IAA4C,CAAC,IAAjC,EAAE,YAAY;QAC/B,GAAGC;AAAA,MAAA;AAAA,IACR;AAAA,IACA,gBAAAG,EAAC,OAAI,EAAA,WAAU,WACX,UAAA,gBAAAA;AAAA,MAACO;AAAA,MAAA;AAAA,QACG,IAAG;AAAA,QACH,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,WAAU;AAAA,QACV,aAAa;AAAA,QACb,YAAW;AAAA,QACX,aAAa,CAAC,UAAU;AAAA,MAAA;AAAA,IAAA,EAEhC,CAAA;AAAA,EAAA,GACJ;AAER;"}

package/dist/@ecme/components/shared/GanttChart/TaskListHeader.js

@@ -0,0 +1,75 @@
+import { jsxs as e, jsx as a } from "react/jsx-runtime";
+const m = ({
+  headerHeight: l,
+  rowWidth: r,
+  extraHeaders: i = []
+}) => /* @__PURE__ */ e("div", { className: "table", children: [
+  /* @__PURE__ */ e(
+    "div",
+    {
+      className: "table-row list-none bg-gray-100/50 bg:fill-gray-700/40",
+      style: {
+        height: l
+      },
+      children: [
+        /* @__PURE__ */ a(
+          "div",
+          {
+            className: "table-cell align-middle px-3 ",
+            style: {
+              minWidth: r
+            },
+            children: " Name"
+          }
+        ),
+        /* @__PURE__ */ a(
+          "div",
+          {
+            className: "border-r border-gray-200 dark:border-gray-700 -ml-1",
+            style: {
+              height: l
+            }
+          }
+        )
+      ]
+    }
+  ),
+  i.map((s, d) => /* @__PURE__ */ e(
+    "div",
+    {
+      className: "table-row list-none bg-gray-100/50 bg:fill-gray-700/40",
+      style: {
+        height: l
+      },
+      children: [
+        /* @__PURE__ */ e(
+          "div",
+          {
+            className: "table-cell align-middle px-3",
+            style: {
+              minWidth: r
+            },
+            children: [
+              " ",
+              s
+            ]
+          }
+        ),
+        /* @__PURE__ */ a(
+          "div",
+          {
+            className: "border-r border-gray-200 dark:border-gray-700 -ml-1",
+            style: {
+              height: l
+            }
+          }
+        )
+      ]
+    },
+    `${s}-${d}`
+  ))
+] });
+export {
+  m as default
+};
+//# sourceMappingURL=TaskListHeader.js.map

package/dist/@ecme/components/shared/GanttChart/TaskListHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TaskListHeader.js","sources":["../../../../../lib/@ecme/components/shared/GanttChart/TaskListHeader.tsx"],"sourcesContent":["import { ReactNode } from 'react'\n\nexport type ExtraHeader = string | ReactNode\n\ntype TaskListHeaderProps = {\n    headerHeight: number\n    rowWidth: string\n    fontFamily: string\n    fontSize: string\n    extraHeaders?: ExtraHeader[]\n}\n\nconst TaskListHeader = ({\n    headerHeight,\n    rowWidth,\n    extraHeaders = [],\n}: TaskListHeaderProps) => {\n    return (\n        <div className=\"table\">\n            <div\n                className=\"table-row list-none bg-gray-100/50 bg:fill-gray-700/40\"\n                style={{\n                    height: headerHeight,\n                }}\n            >\n                <div\n                    className=\"table-cell align-middle px-3 \"\n                    style={{\n                        minWidth: rowWidth,\n                    }}\n                >\n                    &nbsp;Name\n                </div>\n                <div\n                    className=\"border-r border-gray-200 dark:border-gray-700 -ml-1\"\n                    style={{\n                        height: headerHeight,\n                    }}\n                />\n            </div>\n            {extraHeaders.map((headers, index) => (\n                <div\n                    key={`${headers}-${index}`}\n                    className=\"table-row list-none bg-gray-100/50 bg:fill-gray-700/40\"\n                    style={{\n                        height: headerHeight,\n                    }}\n                >\n                    <div\n                        className=\"table-cell align-middle px-3\"\n                        style={{\n                            minWidth: rowWidth,\n                        }}\n                    >\n                        &nbsp;{headers}\n                    </div>\n                    <div\n                        className=\"border-r border-gray-200 dark:border-gray-700 -ml-1\"\n                        style={{\n                            height: headerHeight,\n                        }}\n                    />\n                </div>\n            ))}\n        </div>\n    )\n}\n\nexport default TaskListHeader\n"],"names":["TaskListHeader","headerHeight","rowWidth","extraHeaders","jsxs","jsx","headers","index"],"mappings":";AAYA,MAAMA,IAAiB,CAAC;AAAA,EACpB,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC,IAAe,CAAA;AACnB,MAEQ,gBAAAC,EAAC,OAAI,EAAA,WAAU,SACX,UAAA;AAAA,EAAA,gBAAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAU;AAAA,MACV,OAAO;AAAA,QACH,QAAQH;AAAA,MACZ;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAAI;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAU;AAAA,YACV,OAAO;AAAA,cACH,UAAUH;AAAA,YACd;AAAA,YACH,UAAA;AAAA,UAAA;AAAA,QAED;AAAA,QACA,gBAAAG;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAU;AAAA,YACV,OAAO;AAAA,cACH,QAAQJ;AAAA,YAAA;AAAA,UACZ;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EACJ;AAAA,EACCE,EAAa,IAAI,CAACG,GAASC,MACxB,gBAAAH;AAAA,IAAC;AAAA,IAAA;AAAA,MAEG,WAAU;AAAA,MACV,OAAO;AAAA,QACH,QAAQH;AAAA,MACZ;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAAG;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAU;AAAA,YACV,OAAO;AAAA,cACH,UAAUF;AAAA,YACd;AAAA,YACH,UAAA;AAAA,cAAA;AAAA,cACUI;AAAA,YAAA;AAAA,UAAA;AAAA,QACX;AAAA,QACA,gBAAAD;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAU;AAAA,YACV,OAAO;AAAA,cACH,QAAQJ;AAAA,YAAA;AAAA,UACZ;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,IAnBK,GAAGK,CAAO,IAAIC,CAAK;AAAA,EAqB/B,CAAA;AAAA,GACL;"}