@join-x5/react-data-grid 1.1.1-nightly → 1.1.3-nightly

package/dist/DataGrid.d.ts

@@ -0,0 +1,3 @@
+import { FRC } from '@join-x5/react-theme';
+import { DataGridProps } from './types';
+export declare const DataGrid: FRC<HTMLTableElement, DataGridProps>;

package/dist/DataGrid.es.js

@@ -0,0 +1,67 @@
+"use client";
+import { jsx as T, jsxs as B } from "@emotion/react/jsx-runtime";
+import { useReactTable as j, getExpandedRowModel as v, getCoreRowModel as y } from "@tanstack/react-table";
+import { forwardRef as z } from "@join-x5/react-theme";
+import { DataGridTable as A } from "./Table/index.es.js";
+import { DataGridContextProvider as E } from "./DataGridContext.es.js";
+import { getDataGridTableHead as k } from "./TableHead/index.es.js";
+import { getDataGridTableBody as q } from "./TableBody/index.es.js";
+import { useDataGridColumnSettings as F } from "./hook.es.js";
+const U = z((t, r) => {
+  const {
+    qa: a = "datagrid",
+    isBordered: i,
+    isMultiline: n,
+    isShadowed: d,
+    size: l,
+    textAlign: s,
+    writingMode: m,
+    userSelect: c,
+    wordBreak: g,
+    whiteSpace: u,
+    cellProps: p,
+    headCellProps: f,
+    columns: w,
+    data: h,
+    tableProps: o,
+    columnSettings: x,
+    components: M,
+    children: b,
+    verticalAlign: R = t.isMultiline ? "top" : "center",
+    ...C
+  } = t, D = F(x, o), e = j({
+    columns: w,
+    data: h,
+    state: D,
+    manualSorting: !0,
+    manualFiltering: !0,
+    manualPagination: !0,
+    columnResizeMode: "onChange",
+    getCoreRowModel: y(),
+    getExpandedRowModel: v(),
+    ...o
+  }), G = {
+    size: l,
+    verticalAlign: R,
+    isBordered: i,
+    isMultiline: n,
+    isShadowed: d,
+    textAlign: s,
+    writingMode: m,
+    userSelect: c,
+    wordBreak: g,
+    whiteSpace: u,
+    cellProps: p,
+    headCellProps: f,
+    qa: a
+  }, S = k(e), P = q(e, M);
+  return /* @__PURE__ */ T(E, { ...G, children: /* @__PURE__ */ B(A, { ref: r, table: e, ...C, children: [
+    S,
+    b,
+    P
+  ] }) });
+});
+export {
+  U as DataGrid
+};
+//# sourceMappingURL=DataGrid.es.js.map

package/dist/DataGrid.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGrid.es.js","sources":["../src/DataGrid.tsx"],"sourcesContent":["'use client';\n\nimport {getCoreRowModel, getExpandedRowModel, useReactTable} from '@tanstack/react-table';\n\nimport {forwardRef} from '@join-x5/react-theme';\n\nimport {DataGridTable} from 'Table';\n\nimport {DataGridContextProvider} from 'DataGridContext';\nimport {getDataGridTableHead} from 'TableHead';\nimport {getDataGridTableBody} from 'TableBody';\n\nimport {useDataGridColumnSettings} from './hook';\n\nimport type {FRC} from '@join-x5/react-theme';\nimport type {DataGridProps} from './types';\n\nexport const DataGrid: FRC<HTMLTableElement, DataGridProps> = forwardRef((props, ref) => {\n  const {\n    qa = 'datagrid',\n\n    isBordered,\n    isMultiline,\n    isShadowed,\n\n    size,\n    textAlign,\n    writingMode,\n    userSelect,\n    wordBreak,\n    whiteSpace,\n\n    cellProps,\n    headCellProps,\n\n    columns,\n    data,\n    tableProps,\n    columnSettings,\n    components,\n    children,\n\n    verticalAlign = props.isMultiline ? 'top' : 'center',\n\n    ...rest\n  } = props;\n\n  const state = useDataGridColumnSettings(columnSettings, tableProps);\n\n  const table = useReactTable({\n    columns,\n    data,\n    state,\n\n    manualSorting: true,\n    manualFiltering: true,\n    manualPagination: true,\n    columnResizeMode: 'onChange',\n    getCoreRowModel: getCoreRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n\n    ...tableProps,\n  });\n\n  const context = {\n    size,\n    verticalAlign,\n    isBordered,\n    isMultiline,\n    isShadowed,\n    textAlign,\n    writingMode,\n    userSelect,\n    wordBreak,\n    whiteSpace,\n\n    cellProps,\n    headCellProps,\n    qa,\n  };\n\n  const head = getDataGridTableHead(table);\n  const body = getDataGridTableBody(table, components);\n\n  return (\n    <DataGridContextProvider {...context}>\n      <DataGridTable ref={ref} table={table} {...rest}>\n        {head}\n        {children}\n        {body}\n      </DataGridTable>\n    </DataGridContextProvider>\n  );\n});\n"],"names":["isBordered","isMultiline","isShadowed","size","textAlign","writingMode","userSelect","wordBreak","whiteSpace","cellProps","headCellProps","columns","data","tableProps","columnSettings","components","children","rest","state","verticalAlign","qa","head","body"],"mappings":";;;;;;;;;AAiBO;AACC;AAAA;AACC;AAELA;AACAC;AACAC;AAEAC;AACAC;AACAC;AACAC;AACAC;AACAC;AAEAC;AACAC;AAEAC;AACAC;AACAC;AACAC;AACAC;AACAC;AAE4C;AAEzCC;AAKuB;AAC1BN;AACAC;AACAM;AAEe;AACE;AACC;AACA;AACe;AACQ;AAEtCL;AAGW;AACdV;AACAgB;AACAnB;AACAC;AACAC;AACAE;AACAC;AACAC;AACAC;AACAC;AAEAC;AACAC;AACAU;AAOA;AAEKC;AAAAA;AACAL;AACAM;AAIT;;;;"}

package/dist/DataGridContext.d.ts

@@ -0,0 +1,10 @@
+import { PropsWithChildren } from '@join-x5/react-theme';
+import { DataGridProps } from 'types';
+type CommonProps = Pick<DataGridProps, 'isMultiline' | 'isShadowed' | 'qa' | 'isBordered' | 'size' | 'verticalAlign' | 'textAlign' | 'writingMode' | 'userSelect' | 'wordBreak' | 'whiteSpace' | 'cellProps' | 'headCellProps'>;
+type DataGridContextProps = {
+    activeCell: string | null;
+    setActiveCell: (newActiveCell: string | null) => void;
+} & CommonProps;
+export declare const DataGridContext: import('react').Context<DataGridContextProps>;
+export declare const DataGridContextProvider: React.FC<PropsWithChildren & CommonProps>;
+export {};

package/dist/DataGridContext.es.js

@@ -0,0 +1,23 @@
+"use client";
+import { jsx as o } from "@emotion/react/jsx-runtime";
+import { createContext as i, useState as a } from "react";
+const n = i({
+  activeCell: null,
+  setActiveCell: () => {
+  }
+}), v = ({
+  children: t,
+  ...e
+}) => {
+  const [r, l] = a(null);
+  return /* @__PURE__ */ o(n.Provider, { value: {
+    activeCell: r,
+    setActiveCell: l,
+    ...e
+  }, children: t });
+};
+export {
+  n as DataGridContext,
+  v as DataGridContextProvider
+};
+//# sourceMappingURL=DataGridContext.es.js.map

package/dist/DataGridContext.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGridContext.es.js","sources":["../src/DataGridContext.tsx"],"sourcesContent":["'use client';\n\nimport {createContext, useState} from 'react';\n\nimport type {PropsWithChildren} from '@join-x5/react-theme';\nimport type {DataGridProps} from 'types';\n\ntype CommonProps = Pick<\n  DataGridProps,\n  | 'isMultiline'\n  | 'isShadowed'\n  | 'qa'\n  | 'isBordered'\n  | 'size'\n  | 'verticalAlign'\n  | 'textAlign'\n  | 'writingMode'\n  | 'userSelect'\n  | 'wordBreak'\n  | 'whiteSpace'\n  | 'cellProps'\n  | 'headCellProps'\n>;\n\ntype DataGridContextProps = {\n  activeCell: string | null;\n  setActiveCell: (newActiveCell: string | null) => void;\n} & CommonProps;\n\nexport const DataGridContext = createContext<DataGridContextProps>({\n  activeCell: null,\n  setActiveCell: () => {},\n});\n\nexport const DataGridContextProvider: React.FC<PropsWithChildren & CommonProps> = ({children, ...rest}) => {\n  const [activeCell, setActiveCell] = useState<string | null>(null);\n\n  return <DataGridContext.Provider value={{activeCell, setActiveCell, ...rest}}>{children}</DataGridContext.Provider>;\n};\n"],"names":["children","activeCell","setActiveCell","rest"],"mappings":";;;AA6BO;AAA4D;AACrD;AACS;AACvB;AAEmF;AAACA;AAAiB;AACnG;AAEA;AAAwC;AAACC;AAAYC;AAAkBC;AACzE;;;;;"}

package/dist/Table/index.d.ts

@@ -0,0 +1,25 @@
+import { Table as ReactTableTable } from '@tanstack/react-table';
+import { FRC } from '@join-x5/react-theme';
+import { TableProps } from './types';
+export declare const TableWrapper: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: React.ElementType;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TableFooter: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: React.ElementType;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ControlPanel: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: React.ElementType;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ControlPanelContent: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: React.ElementType;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Table: FRC<HTMLTableElement, TableProps>;
+type DataGridTableProps = {
+    table: ReactTableTable<unknown>;
+} & Omit<TableProps, 'isResizing'>;
+export declare const DataGridTable: FRC<HTMLTableElement, DataGridTableProps>;
+export {};

package/dist/Table/index.es.js

@@ -0,0 +1,93 @@
+"use client";
+import { jsx as X } from "@emotion/react/jsx-runtime";
+import G from "@emotion/styled/base";
+import { useContext as B, useMemo as C } from "react";
+import x, { forwardRef as u } from "@join-x5/react-theme";
+import { DataGridContext as Y } from "../DataGridContext.es.js";
+function W() {
+  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
+}
+const p = /* @__PURE__ */ G("div", process.env.NODE_ENV === "production" ? {
+  target: "e1pm3kai4"
+} : {
+  target: "e1pm3kai4",
+  label: "TableWrapper"
+})("width:100%;border-collapse:collapse;border-radius:8px 8px 0 0;overflow:auto;", x.scroll, " ", (c) => ({
+  border: `1px solid ${(b) => b.theme.colors.grey[10]}`,
+  backgroundColor: c.theme.colors.white
+}), ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC9zcmMvVGFibGUvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWFzQyIsImZpbGUiOiIvaG9tZS9zYWR5a292c2Qvam9pbi14NS9wYWNrYWdlcy9kYXRhLWdyaWQvc3JjL1RhYmxlL2luZGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIid1c2UgY2xpZW50JztcblxuaW1wb3J0IHt1c2VDb250ZXh0LCB1c2VNZW1vfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmltcG9ydCBiYXNlVGhlbWUsIHtmb3J3YXJkUmVmfSBmcm9tICdAam9pbi14NS9yZWFjdC10aGVtZSc7XG5cbmltcG9ydCB7RGF0YUdyaWRDb250ZXh0fSBmcm9tICdEYXRhR3JpZENvbnRleHQnO1xuXG5pbXBvcnQgdHlwZSB7VGFibGUgYXMgUmVhY3RUYWJsZVRhYmxlfSBmcm9tICdAdGFuc3RhY2svcmVhY3QtdGFibGUnO1xuaW1wb3J0IHR5cGUge0NTU1Byb3BlcnRpZXMsIEZSQ30gZnJvbSAnQGpvaW4teDUvcmVhY3QtdGhlbWUnO1xuaW1wb3J0IHR5cGUge1RhYmxlUHJvcHN9IGZyb20gJy4vdHlwZXMnO1xuXG5leHBvcnQgY29uc3QgVGFibGVXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgd2lkdGg6IDEwMCU7XG4gIGJvcmRlci1jb2xsYXBzZTogY29sbGFwc2U7XG4gIGJvcmRlci1yYWRpdXM6IDhweCA4cHggMCAwO1xuICBvdmVyZmxvdzogYXV0bztcblxuICAke2Jhc2VUaGVtZS5zY3JvbGx9XG5cbiAgJHtwcm9wcyA9PiAoe1xuICAgIGJvcmRlcjogYDFweCBzb2xpZCAke3Byb3BzID0+IHByb3BzLnRoZW1lLmNvbG9ycy5ncmV5WzEwXX1gLFxuICAgIGJhY2tncm91bmRDb2xvcjogcHJvcHMudGhlbWUuY29sb3JzLndoaXRlLFxuICB9KX1cbmA7XG5cbmV4cG9ydCBjb25zdCBUYWJsZUZvb3RlciA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIHBhZGRpbmc6IDhweDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICBib3JkZXItcmFkaXVzOiAwIDAgOHB4IDhweDtcbiAgZ2FwOiAxMnB4O1xuXG4gICR7cHJvcHMgPT4gKHtcbiAgICBib3JkZXI6IGAxcHggc29saWQgJHtwcm9wcyA9PiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVsxMF19YCxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHByb3BzLnRoZW1lLmNvbG9ycy53aGl0ZSxcbiAgfSl9XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udHJvbFBhbmVsID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgcGFkZGluZzogOHB4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG4gIGdhcDogOHB4O1xuICBib3JkZXItcmFkaXVzOiA4cHg7XG4gIGJhY2tncm91bmQtY29sb3I6ICR7cHJvcHMgPT4gcHJvcHMudGhlbWUuY29sb3JzLndoaXRlfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBDb250cm9sUGFuZWxDb250ZW50ID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgZ2FwOiA4cHg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5gO1xuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQudGFibGVgXG4gIGJvcmRlci1jb2xsYXBzZTogY29sbGFwc2U7XG4gIHRhYmxlLWxheW91dDogZml4ZWQ7XG5cbiAgJltkYXRhLWlzLXJlc2l6aW5nXSB7XG4gICAgY3Vyc29yOiBjb2wtcmVzaXplO1xuICB9XG5gO1xuXG5leHBvcnQgY29uc3QgVGFibGU6IEZSQzxIVE1MVGFibGVFbGVtZW50LCBUYWJsZVByb3BzPiA9IGZvcndhcmRSZWYoKHtpc1Jlc2l6aW5nLCAuLi5yZXN0fSwgcmVmKSA9PiB7XG4gIGNvbnN0IHJlc3VsdFByb3BzID0ge1xuICAgIC4uLnJlc3QsXG5cbiAgICAnZGF0YS1pcy1yZXNpemluZyc6IGlzUmVzaXppbmcgPyB0cnVlIDogdW5kZWZpbmVkLFxuICB9O1xuXG4gIHJldHVybiA8Q29udGFpbmVyIHJlZj17cmVmfSB7Li4ucmVzdWx0UHJvcHN9PjwvQ29udGFpbmVyPjtcbn0pO1xuXG50eXBlIERhdGFHcmlkVGFibGVQcm9wcyA9IHt0YWJsZTogUmVhY3RUYWJsZVRhYmxlPHVua25vd24+fSAmIE9taXQ8VGFibGVQcm9wcywgJ2lzUmVzaXppbmcnPjtcblxuZXhwb3J0IGNvbnN0IERhdGFHcmlkVGFibGU6IEZSQzxIVE1MVGFibGVFbGVtZW50LCBEYXRhR3JpZFRhYmxlUHJvcHM+ID0gZm9yd2FyZFJlZigoe3RhYmxlLCAuLi5wcm9wc30sIHJlZikgPT4ge1xuICBjb25zdCBjb250ZXh0ID0gdXNlQ29udGV4dChEYXRhR3JpZENvbnRleHQpO1xuXG4gIGNvbnN0IGNvbHVtblNpemVWYXJzID0gdXNlTWVtbygoKSA9PiB7XG4gICAgY29uc3QgaGVhZGVycyA9IHRhYmxlLmdldEZsYXRIZWFkZXJzKCk7XG4gICAgY29uc3QgY29sU2l6ZXM6IENTU1Byb3BlcnRpZXMgPSB7fTtcblxuICAgIGZvciAoY29uc3QgaGVhZGVyIG9mIGhlYWRlcnMpIHtcbiAgICAgIGNvbFNpemVzW2AtLWhlYWRlci0ke2hlYWRlci5pZH0tc2l6ZWBdID0gaGVhZGVyLmdldFNpemUoKTtcbiAgICAgIGNvbFNpemVzW2AtLWNvbC0ke2hlYWRlci5jb2x1bW4uaWR9LXNpemVgXSA9IGhlYWRlci5jb2x1bW4uZ2V0U2l6ZSgpO1xuICAgIH1cblxuICAgIHJldHVybiBjb2xTaXplcztcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgcmVhY3QtaG9va3MvZXhoYXVzdGl2ZS1kZXBzXG4gIH0sIFt0YWJsZS5nZXRTdGF0ZSgpLmNvbHVtblNpemluZ0luZm8sIHRhYmxlLmdldFN0YXRlKCkuY29sdW1uU2l6aW5nXSk7XG5cbiAgY29uc3QgaXNSZXNpemluZyA9ICEhdGFibGUuZ2V0U3RhdGUoKS5jb2x1bW5TaXppbmdJbmZvLmlzUmVzaXppbmdDb2x1bW47XG5cbiAgY29uc3QgcmVzdWx0UHJvcHMgPSB7XG4gICAgLi4ucHJvcHMsXG5cbiAgICBpc1Jlc2l6aW5nLFxuXG4gICAgc3R5bGU6IHtcbiAgICAgIHdpZHRoOiB0YWJsZS5nZXRUb3RhbFNpemUoKSxcblxuICAgICAgLi4ucHJvcHMuc3R5bGUsXG4gICAgICAuLi5jb2x1bW5TaXplVmFycyxcbiAgICB9LFxuXG4gICAgJ2RhdGEtcWEnOiBjb250ZXh0LnFhLFxuICB9O1xuXG4gIHJldHVybiA8VGFibGUgcmVmPXtyZWZ9IHsuLi5yZXN1bHRQcm9wc30gLz47XG59KTtcbiJdfQ== */")), H = /* @__PURE__ */ G("div", process.env.NODE_ENV === "production" ? {
+  target: "e1pm3kai3"
+} : {
+  target: "e1pm3kai3",
+  label: "TableFooter"
+})("display:flex;padding:8px;align-items:center;justify-content:space-between;border-radius:0 0 8px 8px;gap:12px;", (c) => ({
+  border: `1px solid ${(b) => b.theme.colors.grey[10]}`,
+  backgroundColor: c.theme.colors.white
+}), ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC9zcmMvVGFibGUvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJCcUMiLCJmaWxlIjoiL2hvbWUvc2FkeWtvdnNkL2pvaW4teDUvcGFja2FnZXMvZGF0YS1ncmlkL3NyYy9UYWJsZS9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCc7XG5cbmltcG9ydCB7dXNlQ29udGV4dCwgdXNlTWVtb30gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5pbXBvcnQgYmFzZVRoZW1lLCB7Zm9yd2FyZFJlZn0gZnJvbSAnQGpvaW4teDUvcmVhY3QtdGhlbWUnO1xuXG5pbXBvcnQge0RhdGFHcmlkQ29udGV4dH0gZnJvbSAnRGF0YUdyaWRDb250ZXh0JztcblxuaW1wb3J0IHR5cGUge1RhYmxlIGFzIFJlYWN0VGFibGVUYWJsZX0gZnJvbSAnQHRhbnN0YWNrL3JlYWN0LXRhYmxlJztcbmltcG9ydCB0eXBlIHtDU1NQcm9wZXJ0aWVzLCBGUkN9IGZyb20gJ0Bqb2luLXg1L3JlYWN0LXRoZW1lJztcbmltcG9ydCB0eXBlIHtUYWJsZVByb3BzfSBmcm9tICcuL3R5cGVzJztcblxuZXhwb3J0IGNvbnN0IFRhYmxlV3JhcHBlciA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiAxMDAlO1xuICBib3JkZXItY29sbGFwc2U6IGNvbGxhcHNlO1xuICBib3JkZXItcmFkaXVzOiA4cHggOHB4IDAgMDtcbiAgb3ZlcmZsb3c6IGF1dG87XG5cbiAgJHtiYXNlVGhlbWUuc2Nyb2xsfVxuXG4gICR7cHJvcHMgPT4gKHtcbiAgICBib3JkZXI6IGAxcHggc29saWQgJHtwcm9wcyA9PiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVsxMF19YCxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHByb3BzLnRoZW1lLmNvbG9ycy53aGl0ZSxcbiAgfSl9XG5gO1xuXG5leHBvcnQgY29uc3QgVGFibGVGb290ZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBwYWRkaW5nOiA4cHg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcbiAgYm9yZGVyLXJhZGl1czogMCAwIDhweCA4cHg7XG4gIGdhcDogMTJweDtcblxuICAke3Byb3BzID0+ICh7XG4gICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7cHJvcHMgPT4gcHJvcHMudGhlbWUuY29sb3JzLmdyZXlbMTBdfWAsXG4gICAgYmFja2dyb3VuZENvbG9yOiBwcm9wcy50aGVtZS5jb2xvcnMud2hpdGUsXG4gIH0pfVxuYDtcblxuZXhwb3J0IGNvbnN0IENvbnRyb2xQYW5lbCA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIHBhZGRpbmc6IDhweDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICBnYXA6IDhweDtcbiAgYm9yZGVyLXJhZGl1czogOHB4O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke3Byb3BzID0+IHByb3BzLnRoZW1lLmNvbG9ycy53aGl0ZX07XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udHJvbFBhbmVsQ29udGVudCA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIGdhcDogOHB4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuYDtcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLnRhYmxlYFxuICBib3JkZXItY29sbGFwc2U6IGNvbGxhcHNlO1xuICB0YWJsZS1sYXlvdXQ6IGZpeGVkO1xuXG4gICZbZGF0YS1pcy1yZXNpemluZ10ge1xuICAgIGN1cnNvcjogY29sLXJlc2l6ZTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IFRhYmxlOiBGUkM8SFRNTFRhYmxlRWxlbWVudCwgVGFibGVQcm9wcz4gPSBmb3J3YXJkUmVmKCh7aXNSZXNpemluZywgLi4ucmVzdH0sIHJlZikgPT4ge1xuICBjb25zdCByZXN1bHRQcm9wcyA9IHtcbiAgICAuLi5yZXN0LFxuXG4gICAgJ2RhdGEtaXMtcmVzaXppbmcnOiBpc1Jlc2l6aW5nID8gdHJ1ZSA6IHVuZGVmaW5lZCxcbiAgfTtcblxuICByZXR1cm4gPENvbnRhaW5lciByZWY9e3JlZn0gey4uLnJlc3VsdFByb3BzfT48L0NvbnRhaW5lcj47XG59KTtcblxudHlwZSBEYXRhR3JpZFRhYmxlUHJvcHMgPSB7dGFibGU6IFJlYWN0VGFibGVUYWJsZTx1bmtub3duPn0gJiBPbWl0PFRhYmxlUHJvcHMsICdpc1Jlc2l6aW5nJz47XG5cbmV4cG9ydCBjb25zdCBEYXRhR3JpZFRhYmxlOiBGUkM8SFRNTFRhYmxlRWxlbWVudCwgRGF0YUdyaWRUYWJsZVByb3BzPiA9IGZvcndhcmRSZWYoKHt0YWJsZSwgLi4ucHJvcHN9LCByZWYpID0+IHtcbiAgY29uc3QgY29udGV4dCA9IHVzZUNvbnRleHQoRGF0YUdyaWRDb250ZXh0KTtcblxuICBjb25zdCBjb2x1bW5TaXplVmFycyA9IHVzZU1lbW8oKCkgPT4ge1xuICAgIGNvbnN0IGhlYWRlcnMgPSB0YWJsZS5nZXRGbGF0SGVhZGVycygpO1xuICAgIGNvbnN0IGNvbFNpemVzOiBDU1NQcm9wZXJ0aWVzID0ge307XG5cbiAgICBmb3IgKGNvbnN0IGhlYWRlciBvZiBoZWFkZXJzKSB7XG4gICAgICBjb2xTaXplc1tgLS1oZWFkZXItJHtoZWFkZXIuaWR9LXNpemVgXSA9IGhlYWRlci5nZXRTaXplKCk7XG4gICAgICBjb2xTaXplc1tgLS1jb2wtJHtoZWFkZXIuY29sdW1uLmlkfS1zaXplYF0gPSBoZWFkZXIuY29sdW1uLmdldFNpemUoKTtcbiAgICB9XG5cbiAgICByZXR1cm4gY29sU2l6ZXM7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIHJlYWN0LWhvb2tzL2V4aGF1c3RpdmUtZGVwc1xuICB9LCBbdGFibGUuZ2V0U3RhdGUoKS5jb2x1bW5TaXppbmdJbmZvLCB0YWJsZS5nZXRTdGF0ZSgpLmNvbHVtblNpemluZ10pO1xuXG4gIGNvbnN0IGlzUmVzaXppbmcgPSAhIXRhYmxlLmdldFN0YXRlKCkuY29sdW1uU2l6aW5nSW5mby5pc1Jlc2l6aW5nQ29sdW1uO1xuXG4gIGNvbnN0IHJlc3VsdFByb3BzID0ge1xuICAgIC4uLnByb3BzLFxuXG4gICAgaXNSZXNpemluZyxcblxuICAgIHN0eWxlOiB7XG4gICAgICB3aWR0aDogdGFibGUuZ2V0VG90YWxTaXplKCksXG5cbiAgICAgIC4uLnByb3BzLnN0eWxlLFxuICAgICAgLi4uY29sdW1uU2l6ZVZhcnMsXG4gICAgfSxcblxuICAgICdkYXRhLXFhJzogY29udGV4dC5xYSxcbiAgfTtcblxuICByZXR1cm4gPFRhYmxlIHJlZj17cmVmfSB7Li4ucmVzdWx0UHJvcHN9IC8+O1xufSk7XG4iXX0= */")), s = /* @__PURE__ */ G("div", process.env.NODE_ENV === "production" ? {
+  target: "e1pm3kai2"
+} : {
+  target: "e1pm3kai2",
+  label: "ControlPanel"
+})("display:flex;padding:8px;align-items:center;justify-content:space-between;gap:8px;border-radius:8px;background-color:", (c) => c.theme.colors.white, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC9zcmMvVGFibGUvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXlDc0MiLCJmaWxlIjoiL2hvbWUvc2FkeWtvdnNkL2pvaW4teDUvcGFja2FnZXMvZGF0YS1ncmlkL3NyYy9UYWJsZS9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCc7XG5cbmltcG9ydCB7dXNlQ29udGV4dCwgdXNlTWVtb30gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5pbXBvcnQgYmFzZVRoZW1lLCB7Zm9yd2FyZFJlZn0gZnJvbSAnQGpvaW4teDUvcmVhY3QtdGhlbWUnO1xuXG5pbXBvcnQge0RhdGFHcmlkQ29udGV4dH0gZnJvbSAnRGF0YUdyaWRDb250ZXh0JztcblxuaW1wb3J0IHR5cGUge1RhYmxlIGFzIFJlYWN0VGFibGVUYWJsZX0gZnJvbSAnQHRhbnN0YWNrL3JlYWN0LXRhYmxlJztcbmltcG9ydCB0eXBlIHtDU1NQcm9wZXJ0aWVzLCBGUkN9IGZyb20gJ0Bqb2luLXg1L3JlYWN0LXRoZW1lJztcbmltcG9ydCB0eXBlIHtUYWJsZVByb3BzfSBmcm9tICcuL3R5cGVzJztcblxuZXhwb3J0IGNvbnN0IFRhYmxlV3JhcHBlciA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiAxMDAlO1xuICBib3JkZXItY29sbGFwc2U6IGNvbGxhcHNlO1xuICBib3JkZXItcmFkaXVzOiA4cHggOHB4IDAgMDtcbiAgb3ZlcmZsb3c6IGF1dG87XG5cbiAgJHtiYXNlVGhlbWUuc2Nyb2xsfVxuXG4gICR7cHJvcHMgPT4gKHtcbiAgICBib3JkZXI6IGAxcHggc29saWQgJHtwcm9wcyA9PiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVsxMF19YCxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHByb3BzLnRoZW1lLmNvbG9ycy53aGl0ZSxcbiAgfSl9XG5gO1xuXG5leHBvcnQgY29uc3QgVGFibGVGb290ZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBwYWRkaW5nOiA4cHg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcbiAgYm9yZGVyLXJhZGl1czogMCAwIDhweCA4cHg7XG4gIGdhcDogMTJweDtcblxuICAke3Byb3BzID0+ICh7XG4gICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7cHJvcHMgPT4gcHJvcHMudGhlbWUuY29sb3JzLmdyZXlbMTBdfWAsXG4gICAgYmFja2dyb3VuZENvbG9yOiBwcm9wcy50aGVtZS5jb2xvcnMud2hpdGUsXG4gIH0pfVxuYDtcblxuZXhwb3J0IGNvbnN0IENvbnRyb2xQYW5lbCA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIHBhZGRpbmc6IDhweDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICBnYXA6IDhweDtcbiAgYm9yZGVyLXJhZGl1czogOHB4O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke3Byb3BzID0+IHByb3BzLnRoZW1lLmNvbG9ycy53aGl0ZX07XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udHJvbFBhbmVsQ29udGVudCA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIGdhcDogOHB4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuYDtcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLnRhYmxlYFxuICBib3JkZXItY29sbGFwc2U6IGNvbGxhcHNlO1xuICB0YWJsZS1sYXlvdXQ6IGZpeGVkO1xuXG4gICZbZGF0YS1pcy1yZXNpemluZ10ge1xuICAgIGN1cnNvcjogY29sLXJlc2l6ZTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IFRhYmxlOiBGUkM8SFRNTFRhYmxlRWxlbWVudCwgVGFibGVQcm9wcz4gPSBmb3J3YXJkUmVmKCh7aXNSZXNpemluZywgLi4ucmVzdH0sIHJlZikgPT4ge1xuICBjb25zdCByZXN1bHRQcm9wcyA9IHtcbiAgICAuLi5yZXN0LFxuXG4gICAgJ2RhdGEtaXMtcmVzaXppbmcnOiBpc1Jlc2l6aW5nID8gdHJ1ZSA6IHVuZGVmaW5lZCxcbiAgfTtcblxuICByZXR1cm4gPENvbnRhaW5lciByZWY9e3JlZn0gey4uLnJlc3VsdFByb3BzfT48L0NvbnRhaW5lcj47XG59KTtcblxudHlwZSBEYXRhR3JpZFRhYmxlUHJvcHMgPSB7dGFibGU6IFJlYWN0VGFibGVUYWJsZTx1bmtub3duPn0gJiBPbWl0PFRhYmxlUHJvcHMsICdpc1Jlc2l6aW5nJz47XG5cbmV4cG9ydCBjb25zdCBEYXRhR3JpZFRhYmxlOiBGUkM8SFRNTFRhYmxlRWxlbWVudCwgRGF0YUdyaWRUYWJsZVByb3BzPiA9IGZvcndhcmRSZWYoKHt0YWJsZSwgLi4ucHJvcHN9LCByZWYpID0+IHtcbiAgY29uc3QgY29udGV4dCA9IHVzZUNvbnRleHQoRGF0YUdyaWRDb250ZXh0KTtcblxuICBjb25zdCBjb2x1bW5TaXplVmFycyA9IHVzZU1lbW8oKCkgPT4ge1xuICAgIGNvbnN0IGhlYWRlcnMgPSB0YWJsZS5nZXRGbGF0SGVhZGVycygpO1xuICAgIGNvbnN0IGNvbFNpemVzOiBDU1NQcm9wZXJ0aWVzID0ge307XG5cbiAgICBmb3IgKGNvbnN0IGhlYWRlciBvZiBoZWFkZXJzKSB7XG4gICAgICBjb2xTaXplc1tgLS1oZWFkZXItJHtoZWFkZXIuaWR9LXNpemVgXSA9IGhlYWRlci5nZXRTaXplKCk7XG4gICAgICBjb2xTaXplc1tgLS1jb2wtJHtoZWFkZXIuY29sdW1uLmlkfS1zaXplYF0gPSBoZWFkZXIuY29sdW1uLmdldFNpemUoKTtcbiAgICB9XG5cbiAgICByZXR1cm4gY29sU2l6ZXM7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIHJlYWN0LWhvb2tzL2V4aGF1c3RpdmUtZGVwc1xuICB9LCBbdGFibGUuZ2V0U3RhdGUoKS5jb2x1bW5TaXppbmdJbmZvLCB0YWJsZS5nZXRTdGF0ZSgpLmNvbHVtblNpemluZ10pO1xuXG4gIGNvbnN0IGlzUmVzaXppbmcgPSAhIXRhYmxlLmdldFN0YXRlKCkuY29sdW1uU2l6aW5nSW5mby5pc1Jlc2l6aW5nQ29sdW1uO1xuXG4gIGNvbnN0IHJlc3VsdFByb3BzID0ge1xuICAgIC4uLnByb3BzLFxuXG4gICAgaXNSZXNpemluZyxcblxuICAgIHN0eWxlOiB7XG4gICAgICB3aWR0aDogdGFibGUuZ2V0VG90YWxTaXplKCksXG5cbiAgICAgIC4uLnByb3BzLnN0eWxlLFxuICAgICAgLi4uY29sdW1uU2l6ZVZhcnMsXG4gICAgfSxcblxuICAgICdkYXRhLXFhJzogY29udGV4dC5xYSxcbiAgfTtcblxuICByZXR1cm4gPFRhYmxlIHJlZj17cmVmfSB7Li4ucmVzdWx0UHJvcHN9IC8+O1xufSk7XG4iXX0= */")), y = /* @__PURE__ */ G("div", process.env.NODE_ENV === "production" ? {
+  target: "e1pm3kai1"
+} : {
+  target: "e1pm3kai1",
+  label: "ControlPanelContent"
+})(process.env.NODE_ENV === "production" ? {
+  name: "197tvr9",
+  styles: "display:flex;gap:8px;align-items:center"
+} : {
+  name: "197tvr9",
+  styles: "display:flex;gap:8px;align-items:center/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC9zcmMvVGFibGUvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1ENkMiLCJmaWxlIjoiL2hvbWUvc2FkeWtvdnNkL2pvaW4teDUvcGFja2FnZXMvZGF0YS1ncmlkL3NyYy9UYWJsZS9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCc7XG5cbmltcG9ydCB7dXNlQ29udGV4dCwgdXNlTWVtb30gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5pbXBvcnQgYmFzZVRoZW1lLCB7Zm9yd2FyZFJlZn0gZnJvbSAnQGpvaW4teDUvcmVhY3QtdGhlbWUnO1xuXG5pbXBvcnQge0RhdGFHcmlkQ29udGV4dH0gZnJvbSAnRGF0YUdyaWRDb250ZXh0JztcblxuaW1wb3J0IHR5cGUge1RhYmxlIGFzIFJlYWN0VGFibGVUYWJsZX0gZnJvbSAnQHRhbnN0YWNrL3JlYWN0LXRhYmxlJztcbmltcG9ydCB0eXBlIHtDU1NQcm9wZXJ0aWVzLCBGUkN9IGZyb20gJ0Bqb2luLXg1L3JlYWN0LXRoZW1lJztcbmltcG9ydCB0eXBlIHtUYWJsZVByb3BzfSBmcm9tICcuL3R5cGVzJztcblxuZXhwb3J0IGNvbnN0IFRhYmxlV3JhcHBlciA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiAxMDAlO1xuICBib3JkZXItY29sbGFwc2U6IGNvbGxhcHNlO1xuICBib3JkZXItcmFkaXVzOiA4cHggOHB4IDAgMDtcbiAgb3ZlcmZsb3c6IGF1dG87XG5cbiAgJHtiYXNlVGhlbWUuc2Nyb2xsfVxuXG4gICR7cHJvcHMgPT4gKHtcbiAgICBib3JkZXI6IGAxcHggc29saWQgJHtwcm9wcyA9PiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVsxMF19YCxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHByb3BzLnRoZW1lLmNvbG9ycy53aGl0ZSxcbiAgfSl9XG5gO1xuXG5leHBvcnQgY29uc3QgVGFibGVGb290ZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBwYWRkaW5nOiA4cHg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcbiAgYm9yZGVyLXJhZGl1czogMCAwIDhweCA4cHg7XG4gIGdhcDogMTJweDtcblxuICAke3Byb3BzID0+ICh7XG4gICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7cHJvcHMgPT4gcHJvcHMudGhlbWUuY29sb3JzLmdyZXlbMTBdfWAsXG4gICAgYmFja2dyb3VuZENvbG9yOiBwcm9wcy50aGVtZS5jb2xvcnMud2hpdGUsXG4gIH0pfVxuYDtcblxuZXhwb3J0IGNvbnN0IENvbnRyb2xQYW5lbCA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIHBhZGRpbmc6IDhweDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICBnYXA6IDhweDtcbiAgYm9yZGVyLXJhZGl1czogOHB4O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke3Byb3BzID0+IHByb3BzLnRoZW1lLmNvbG9ycy53aGl0ZX07XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udHJvbFBhbmVsQ29udGVudCA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIGdhcDogOHB4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuYDtcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLnRhYmxlYFxuICBib3JkZXItY29sbGFwc2U6IGNvbGxhcHNlO1xuICB0YWJsZS1sYXlvdXQ6IGZpeGVkO1xuXG4gICZbZGF0YS1pcy1yZXNpemluZ10ge1xuICAgIGN1cnNvcjogY29sLXJlc2l6ZTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IFRhYmxlOiBGUkM8SFRNTFRhYmxlRWxlbWVudCwgVGFibGVQcm9wcz4gPSBmb3J3YXJkUmVmKCh7aXNSZXNpemluZywgLi4ucmVzdH0sIHJlZikgPT4ge1xuICBjb25zdCByZXN1bHRQcm9wcyA9IHtcbiAgICAuLi5yZXN0LFxuXG4gICAgJ2RhdGEtaXMtcmVzaXppbmcnOiBpc1Jlc2l6aW5nID8gdHJ1ZSA6IHVuZGVmaW5lZCxcbiAgfTtcblxuICByZXR1cm4gPENvbnRhaW5lciByZWY9e3JlZn0gey4uLnJlc3VsdFByb3BzfT48L0NvbnRhaW5lcj47XG59KTtcblxudHlwZSBEYXRhR3JpZFRhYmxlUHJvcHMgPSB7dGFibGU6IFJlYWN0VGFibGVUYWJsZTx1bmtub3duPn0gJiBPbWl0PFRhYmxlUHJvcHMsICdpc1Jlc2l6aW5nJz47XG5cbmV4cG9ydCBjb25zdCBEYXRhR3JpZFRhYmxlOiBGUkM8SFRNTFRhYmxlRWxlbWVudCwgRGF0YUdyaWRUYWJsZVByb3BzPiA9IGZvcndhcmRSZWYoKHt0YWJsZSwgLi4ucHJvcHN9LCByZWYpID0+IHtcbiAgY29uc3QgY29udGV4dCA9IHVzZUNvbnRleHQoRGF0YUdyaWRDb250ZXh0KTtcblxuICBjb25zdCBjb2x1bW5TaXplVmFycyA9IHVzZU1lbW8oKCkgPT4ge1xuICAgIGNvbnN0IGhlYWRlcnMgPSB0YWJsZS5nZXRGbGF0SGVhZGVycygpO1xuICAgIGNvbnN0IGNvbFNpemVzOiBDU1NQcm9wZXJ0aWVzID0ge307XG5cbiAgICBmb3IgKGNvbnN0IGhlYWRlciBvZiBoZWFkZXJzKSB7XG4gICAgICBjb2xTaXplc1tgLS1oZWFkZXItJHtoZWFkZXIuaWR9LXNpemVgXSA9IGhlYWRlci5nZXRTaXplKCk7XG4gICAgICBjb2xTaXplc1tgLS1jb2wtJHtoZWFkZXIuY29sdW1uLmlkfS1zaXplYF0gPSBoZWFkZXIuY29sdW1uLmdldFNpemUoKTtcbiAgICB9XG5cbiAgICByZXR1cm4gY29sU2l6ZXM7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIHJlYWN0LWhvb2tzL2V4aGF1c3RpdmUtZGVwc1xuICB9LCBbdGFibGUuZ2V0U3RhdGUoKS5jb2x1bW5TaXppbmdJbmZvLCB0YWJsZS5nZXRTdGF0ZSgpLmNvbHVtblNpemluZ10pO1xuXG4gIGNvbnN0IGlzUmVzaXppbmcgPSAhIXRhYmxlLmdldFN0YXRlKCkuY29sdW1uU2l6aW5nSW5mby5pc1Jlc2l6aW5nQ29sdW1uO1xuXG4gIGNvbnN0IHJlc3VsdFByb3BzID0ge1xuICAgIC4uLnByb3BzLFxuXG4gICAgaXNSZXNpemluZyxcblxuICAgIHN0eWxlOiB7XG4gICAgICB3aWR0aDogdGFibGUuZ2V0VG90YWxTaXplKCksXG5cbiAgICAgIC4uLnByb3BzLnN0eWxlLFxuICAgICAgLi4uY29sdW1uU2l6ZVZhcnMsXG4gICAgfSxcblxuICAgICdkYXRhLXFhJzogY29udGV4dC5xYSxcbiAgfTtcblxuICByZXR1cm4gPFRhYmxlIHJlZj17cmVmfSB7Li4ucmVzdWx0UHJvcHN9IC8+O1xufSk7XG4iXX0= */",
+  toString: W
+}), V = /* @__PURE__ */ G("table", process.env.NODE_ENV === "production" ? {
+  target: "e1pm3kai0"
+} : {
+  target: "e1pm3kai0",
+  label: "Container"
+})(process.env.NODE_ENV === "production" ? {
+  name: "h605yu",
+  styles: "border-collapse:collapse;table-layout:fixed;&[data-is-resizing]{cursor:col-resize;}"
+} : {
+  name: "h605yu",
+  styles: "border-collapse:collapse;table-layout:fixed;&[data-is-resizing]{cursor:col-resize;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC9zcmMvVGFibGUvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXlEOEIiLCJmaWxlIjoiL2hvbWUvc2FkeWtvdnNkL2pvaW4teDUvcGFja2FnZXMvZGF0YS1ncmlkL3NyYy9UYWJsZS9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCc7XG5cbmltcG9ydCB7dXNlQ29udGV4dCwgdXNlTWVtb30gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5pbXBvcnQgYmFzZVRoZW1lLCB7Zm9yd2FyZFJlZn0gZnJvbSAnQGpvaW4teDUvcmVhY3QtdGhlbWUnO1xuXG5pbXBvcnQge0RhdGFHcmlkQ29udGV4dH0gZnJvbSAnRGF0YUdyaWRDb250ZXh0JztcblxuaW1wb3J0IHR5cGUge1RhYmxlIGFzIFJlYWN0VGFibGVUYWJsZX0gZnJvbSAnQHRhbnN0YWNrL3JlYWN0LXRhYmxlJztcbmltcG9ydCB0eXBlIHtDU1NQcm9wZXJ0aWVzLCBGUkN9IGZyb20gJ0Bqb2luLXg1L3JlYWN0LXRoZW1lJztcbmltcG9ydCB0eXBlIHtUYWJsZVByb3BzfSBmcm9tICcuL3R5cGVzJztcblxuZXhwb3J0IGNvbnN0IFRhYmxlV3JhcHBlciA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiAxMDAlO1xuICBib3JkZXItY29sbGFwc2U6IGNvbGxhcHNlO1xuICBib3JkZXItcmFkaXVzOiA4cHggOHB4IDAgMDtcbiAgb3ZlcmZsb3c6IGF1dG87XG5cbiAgJHtiYXNlVGhlbWUuc2Nyb2xsfVxuXG4gICR7cHJvcHMgPT4gKHtcbiAgICBib3JkZXI6IGAxcHggc29saWQgJHtwcm9wcyA9PiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVsxMF19YCxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHByb3BzLnRoZW1lLmNvbG9ycy53aGl0ZSxcbiAgfSl9XG5gO1xuXG5leHBvcnQgY29uc3QgVGFibGVGb290ZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBwYWRkaW5nOiA4cHg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcbiAgYm9yZGVyLXJhZGl1czogMCAwIDhweCA4cHg7XG4gIGdhcDogMTJweDtcblxuICAke3Byb3BzID0+ICh7XG4gICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7cHJvcHMgPT4gcHJvcHMudGhlbWUuY29sb3JzLmdyZXlbMTBdfWAsXG4gICAgYmFja2dyb3VuZENvbG9yOiBwcm9wcy50aGVtZS5jb2xvcnMud2hpdGUsXG4gIH0pfVxuYDtcblxuZXhwb3J0IGNvbnN0IENvbnRyb2xQYW5lbCA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIHBhZGRpbmc6IDhweDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICBnYXA6IDhweDtcbiAgYm9yZGVyLXJhZGl1czogOHB4O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke3Byb3BzID0+IHByb3BzLnRoZW1lLmNvbG9ycy53aGl0ZX07XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udHJvbFBhbmVsQ29udGVudCA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIGdhcDogOHB4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuYDtcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLnRhYmxlYFxuICBib3JkZXItY29sbGFwc2U6IGNvbGxhcHNlO1xuICB0YWJsZS1sYXlvdXQ6IGZpeGVkO1xuXG4gICZbZGF0YS1pcy1yZXNpemluZ10ge1xuICAgIGN1cnNvcjogY29sLXJlc2l6ZTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IFRhYmxlOiBGUkM8SFRNTFRhYmxlRWxlbWVudCwgVGFibGVQcm9wcz4gPSBmb3J3YXJkUmVmKCh7aXNSZXNpemluZywgLi4ucmVzdH0sIHJlZikgPT4ge1xuICBjb25zdCByZXN1bHRQcm9wcyA9IHtcbiAgICAuLi5yZXN0LFxuXG4gICAgJ2RhdGEtaXMtcmVzaXppbmcnOiBpc1Jlc2l6aW5nID8gdHJ1ZSA6IHVuZGVmaW5lZCxcbiAgfTtcblxuICByZXR1cm4gPENvbnRhaW5lciByZWY9e3JlZn0gey4uLnJlc3VsdFByb3BzfT48L0NvbnRhaW5lcj47XG59KTtcblxudHlwZSBEYXRhR3JpZFRhYmxlUHJvcHMgPSB7dGFibGU6IFJlYWN0VGFibGVUYWJsZTx1bmtub3duPn0gJiBPbWl0PFRhYmxlUHJvcHMsICdpc1Jlc2l6aW5nJz47XG5cbmV4cG9ydCBjb25zdCBEYXRhR3JpZFRhYmxlOiBGUkM8SFRNTFRhYmxlRWxlbWVudCwgRGF0YUdyaWRUYWJsZVByb3BzPiA9IGZvcndhcmRSZWYoKHt0YWJsZSwgLi4ucHJvcHN9LCByZWYpID0+IHtcbiAgY29uc3QgY29udGV4dCA9IHVzZUNvbnRleHQoRGF0YUdyaWRDb250ZXh0KTtcblxuICBjb25zdCBjb2x1bW5TaXplVmFycyA9IHVzZU1lbW8oKCkgPT4ge1xuICAgIGNvbnN0IGhlYWRlcnMgPSB0YWJsZS5nZXRGbGF0SGVhZGVycygpO1xuICAgIGNvbnN0IGNvbFNpemVzOiBDU1NQcm9wZXJ0aWVzID0ge307XG5cbiAgICBmb3IgKGNvbnN0IGhlYWRlciBvZiBoZWFkZXJzKSB7XG4gICAgICBjb2xTaXplc1tgLS1oZWFkZXItJHtoZWFkZXIuaWR9LXNpemVgXSA9IGhlYWRlci5nZXRTaXplKCk7XG4gICAgICBjb2xTaXplc1tgLS1jb2wtJHtoZWFkZXIuY29sdW1uLmlkfS1zaXplYF0gPSBoZWFkZXIuY29sdW1uLmdldFNpemUoKTtcbiAgICB9XG5cbiAgICByZXR1cm4gY29sU2l6ZXM7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIHJlYWN0LWhvb2tzL2V4aGF1c3RpdmUtZGVwc1xuICB9LCBbdGFibGUuZ2V0U3RhdGUoKS5jb2x1bW5TaXppbmdJbmZvLCB0YWJsZS5nZXRTdGF0ZSgpLmNvbHVtblNpemluZ10pO1xuXG4gIGNvbnN0IGlzUmVzaXppbmcgPSAhIXRhYmxlLmdldFN0YXRlKCkuY29sdW1uU2l6aW5nSW5mby5pc1Jlc2l6aW5nQ29sdW1uO1xuXG4gIGNvbnN0IHJlc3VsdFByb3BzID0ge1xuICAgIC4uLnByb3BzLFxuXG4gICAgaXNSZXNpemluZyxcblxuICAgIHN0eWxlOiB7XG4gICAgICB3aWR0aDogdGFibGUuZ2V0VG90YWxTaXplKCksXG5cbiAgICAgIC4uLnByb3BzLnN0eWxlLFxuICAgICAgLi4uY29sdW1uU2l6ZVZhcnMsXG4gICAgfSxcblxuICAgICdkYXRhLXFhJzogY29udGV4dC5xYSxcbiAgfTtcblxuICByZXR1cm4gPFRhYmxlIHJlZj17cmVmfSB7Li4ucmVzdWx0UHJvcHN9IC8+O1xufSk7XG4iXX0= */",
+  toString: W
+}), n = u(({
+  isResizing: c,
+  ...b
+}, g) => {
+  const I = {
+    ...b,
+    "data-is-resizing": c ? !0 : void 0
+  };
+  return /* @__PURE__ */ X(V, { ref: g, ...I });
+}), h = u(({
+  table: c,
+  ...b
+}, g) => {
+  const I = B(Y), d = C(() => {
+    const t = c.getFlatHeaders(), Z = {};
+    for (const l of t)
+      Z[`--header-${l.id}-size`] = l.getSize(), Z[`--col-${l.column.id}-size`] = l.column.getSize();
+    return Z;
+  }, [c.getState().columnSizingInfo, c.getState().columnSizing]), m = !!c.getState().columnSizingInfo.isResizingColumn, i = {
+    ...b,
+    isResizing: m,
+    style: {
+      width: c.getTotalSize(),
+      ...b.style,
+      ...d
+    },
+    "data-qa": I.qa
+  };
+  return /* @__PURE__ */ X(n, { ref: g, ...i });
+});
+export {
+  s as ControlPanel,
+  y as ControlPanelContent,
+  h as DataGridTable,
+  n as Table,
+  H as TableFooter,
+  p as TableWrapper
+};
+//# sourceMappingURL=index.es.js.map

package/dist/Table/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../src/Table/index.tsx"],"sourcesContent":["'use client';\n\nimport {useContext, useMemo} from 'react';\nimport styled from '@emotion/styled';\n\nimport baseTheme, {forwardRef} from '@join-x5/react-theme';\n\nimport {DataGridContext} from 'DataGridContext';\n\nimport type {Table as ReactTableTable} from '@tanstack/react-table';\nimport type {CSSProperties, FRC} from '@join-x5/react-theme';\nimport type {TableProps} from './types';\n\nexport const TableWrapper = styled.div`\n  width: 100%;\n  border-collapse: collapse;\n  border-radius: 8px 8px 0 0;\n  overflow: auto;\n\n  ${baseTheme.scroll}\n\n  ${props => ({\n    border: `1px solid ${props => props.theme.colors.grey[10]}`,\n    backgroundColor: props.theme.colors.white,\n  })}\n`;\n\nexport const TableFooter = styled.div`\n  display: flex;\n  padding: 8px;\n  align-items: center;\n  justify-content: space-between;\n  border-radius: 0 0 8px 8px;\n  gap: 12px;\n\n  ${props => ({\n    border: `1px solid ${props => props.theme.colors.grey[10]}`,\n    backgroundColor: props.theme.colors.white,\n  })}\n`;\n\nexport const ControlPanel = styled.div`\n  display: flex;\n  padding: 8px;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n  border-radius: 8px;\n  background-color: ${props => props.theme.colors.white};\n`;\n\nexport const ControlPanelContent = styled.div`\n  display: flex;\n  gap: 8px;\n  align-items: center;\n`;\n\nconst Container = styled.table`\n  border-collapse: collapse;\n  table-layout: fixed;\n\n  &[data-is-resizing] {\n    cursor: col-resize;\n  }\n`;\n\nexport const Table: FRC<HTMLTableElement, TableProps> = forwardRef(({isResizing, ...rest}, ref) => {\n  const resultProps = {\n    ...rest,\n\n    'data-is-resizing': isResizing ? true : undefined,\n  };\n\n  return <Container ref={ref} {...resultProps}></Container>;\n});\n\ntype DataGridTableProps = {table: ReactTableTable<unknown>} & Omit<TableProps, 'isResizing'>;\n\nexport const DataGridTable: FRC<HTMLTableElement, DataGridTableProps> = forwardRef(({table, ...props}, ref) => {\n  const context = useContext(DataGridContext);\n\n  const columnSizeVars = useMemo(() => {\n    const headers = table.getFlatHeaders();\n    const colSizes: CSSProperties = {};\n\n    for (const header of headers) {\n      colSizes[`--header-${header.id}-size`] = header.getSize();\n      colSizes[`--col-${header.column.id}-size`] = header.column.getSize();\n    }\n\n    return colSizes;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [table.getState().columnSizingInfo, table.getState().columnSizing]);\n\n  const isResizing = !!table.getState().columnSizingInfo.isResizingColumn;\n\n  const resultProps = {\n    ...props,\n\n    isResizing,\n\n    style: {\n      width: table.getTotalSize(),\n\n      ...props.style,\n      ...columnSizeVars,\n    },\n\n    'data-qa': context.qa,\n  };\n\n  return <Table ref={ref} {...resultProps} />;\n});\n"],"names":["isResizing","rest","undefined","table","context","headers","colSizes","props","style","columnSizeVars","qa"],"mappings":";;;;;;AAAa;AAAA;AAAA;AAaN;AAAkB;AAAA;AAAA;AAAA;AAAA;AAQX;AAC+C;AAE3D;AAGsB;AAAA;AAAA;AAAA;AAAA;AAQV;AAC+C;AAE3D;AAGuB;AAAA;AAAA;AAAA;AAAA;AAUO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMjB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASqD;AAACA;AAAmB;AACtF;AAAoB;AACfC;AAEqCC;AAG1C;AACF;AAIoF;AAACC;AAAe;AAC5FC;AAGEC;AAGN;AACEC;AAIKA;AAAAA;AAMW;AACfC;AAEHP;AAEO;AACqB;AAEjBQ;AACNC;AACL;AAEmBC;AAGrB;AACF;;;;;;;;;"}

package/dist/Table/types.d.ts

@@ -0,0 +1,3 @@
+import { TableHTMLAttributes } from 'react';
+import { TableCellProps } from 'TableCell/types';
+export type TableProps = Pick<TableCellProps, 'isBordered' | 'isResizing'> & TableHTMLAttributes<HTMLTableElement>;

package/dist/TableBody/index.d.ts

@@ -0,0 +1,11 @@
+import { Table } from '@tanstack/react-table';
+import { DataGridProps } from 'types';
+export declare const TableBody: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: React.ElementType;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, {}>;
+type DataGridTableBodyProps = {
+    table: Table<unknown>;
+} & Pick<DataGridProps, 'components'>;
+export declare const getDataGridTableBody: (table: DataGridTableBodyProps["table"], components: DataGridProps["components"]) => import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/TableBody/index.es.js

@@ -0,0 +1,26 @@
+"use client";
+import { jsx as l } from "@emotion/react/jsx-runtime";
+import R from "@emotion/styled/base";
+import { memo as e, useContext as i } from "react";
+import { DataGridContext as Z } from "../DataGridContext.es.js";
+import { getDataGridTableRow as a } from "../TableRow/index.es.js";
+const n = /* @__PURE__ */ R("tbody", process.env.NODE_ENV === "production" ? {
+  target: "e1p3q9a00"
+} : {
+  target: "e1p3q9a00",
+  label: "TableBody"
+})(process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC9zcmMvVGFibGVCb2R5L2luZGV4LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFXcUMiLCJmaWxlIjoiL2hvbWUvc2FkeWtvdnNkL2pvaW4teDUvcGFja2FnZXMvZGF0YS1ncmlkL3NyYy9UYWJsZUJvZHkvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnO1xuXG5pbXBvcnQge21lbW8sIHVzZUNvbnRleHR9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHtEYXRhR3JpZENvbnRleHR9IGZyb20gJ0RhdGFHcmlkQ29udGV4dCc7XG5pbXBvcnQge2dldERhdGFHcmlkVGFibGVSb3d9IGZyb20gJ1RhYmxlUm93JztcblxuaW1wb3J0IHR5cGUge1RhYmxlfSBmcm9tICdAdGFuc3RhY2svcmVhY3QtdGFibGUnO1xuaW1wb3J0IHR5cGUge0RhdGFHcmlkUHJvcHN9IGZyb20gJ3R5cGVzJztcblxuZXhwb3J0IGNvbnN0IFRhYmxlQm9keSA9IHN0eWxlZC50Ym9keWBgO1xuXG50eXBlIERhdGFHcmlkVGFibGVCb2R5UHJvcHMgPSB7XG4gIHRhYmxlOiBUYWJsZTx1bmtub3duPjtcbn0gJiBQaWNrPERhdGFHcmlkUHJvcHMsICdjb21wb25lbnRzJz47XG5cbmNvbnN0IERhdGFHcmlkVGFibGVCb2R5OiBSZWFjdC5GQzxEYXRhR3JpZFRhYmxlQm9keVByb3BzPiA9ICh7dGFibGUsIGNvbXBvbmVudHN9KSA9PiB7XG4gIGNvbnN0IGNvbnRleHQgPSB1c2VDb250ZXh0KERhdGFHcmlkQ29udGV4dCk7XG4gIGNvbnN0IHJvd3MgPSB0YWJsZS5nZXRSb3dNb2RlbCgpLnJvd3M7XG5cbiAgY29uc3QgaXRlcmF0b3IgPSBjb21wb25lbnRzPy5yb3cgPz8gZ2V0RGF0YUdyaWRUYWJsZVJvdztcblxuICByZXR1cm4gPFRhYmxlQm9keSBkYXRhLXFhPXtgJHtjb250ZXh0LnFhfS1ib2R5YH0+e3Jvd3MubWFwKGl0ZXJhdG9yKX08L1RhYmxlQm9keT47XG59O1xuXG5jb25zdCBNZW1vaXplZERhdGFHcmlkVGFibGVCb2R5ID0gbWVtbyhcbiAgRGF0YUdyaWRUYWJsZUJvZHksXG4gIChwcmV2LCBuZXh0KSA9PiBwcmV2LnRhYmxlLm9wdGlvbnMuZGF0YSA9PT0gbmV4dC50YWJsZS5vcHRpb25zLmRhdGFcbik7XG5cbmV4cG9ydCBjb25zdCBnZXREYXRhR3JpZFRhYmxlQm9keSA9IChcbiAgdGFibGU6IERhdGFHcmlkVGFibGVCb2R5UHJvcHNbJ3RhYmxlJ10sXG4gIGNvbXBvbmVudHM6IERhdGFHcmlkUHJvcHNbJ2NvbXBvbmVudHMnXVxuKSA9PiB7XG4gIGNvbnN0IGlzUmVzaXppbmcgPSB0YWJsZS5nZXRTdGF0ZSgpLmNvbHVtblNpemluZ0luZm8uaXNSZXNpemluZ0NvbHVtbjtcbiAgY29uc3QgQ29tcG9uZW50ID0gaXNSZXNpemluZyA/IE1lbW9pemVkRGF0YUdyaWRUYWJsZUJvZHkgOiBEYXRhR3JpZFRhYmxlQm9keTtcblxuICByZXR1cm4gPENvbXBvbmVudCB0YWJsZT17dGFibGV9IGNvbXBvbmVudHM9e2NvbXBvbmVudHN9IC8+O1xufTtcbiJdfQ== */"), m = ({
+  table: G,
+  components: b
+}) => {
+  const d = i(Z), c = G.getRowModel().rows, t = (b == null ? void 0 : b.row) ?? a;
+  return /* @__PURE__ */ l(n, { "data-qa": `${d.qa}-body`, children: c.map(t) });
+}, J = e(m, (G, b) => G.table.options.data === b.table.options.data), u = (G, b) => {
+  const c = G.getState().columnSizingInfo.isResizingColumn ? J : m;
+  return /* @__PURE__ */ l(c, { table: G, components: b });
+};
+export {
+  n as TableBody,
+  u as getDataGridTableBody
+};
+//# sourceMappingURL=index.es.js.map

package/dist/TableBody/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../src/TableBody/index.tsx"],"sourcesContent":["'use client';\n\nimport {memo, useContext} from 'react';\nimport styled from '@emotion/styled';\n\nimport {DataGridContext} from 'DataGridContext';\nimport {getDataGridTableRow} from 'TableRow';\n\nimport type {Table} from '@tanstack/react-table';\nimport type {DataGridProps} from 'types';\n\nexport const TableBody = styled.tbody``;\n\ntype DataGridTableBodyProps = {\n  table: Table<unknown>;\n} & Pick<DataGridProps, 'components'>;\n\nconst DataGridTableBody: React.FC<DataGridTableBodyProps> = ({table, components}) => {\n  const context = useContext(DataGridContext);\n  const rows = table.getRowModel().rows;\n\n  const iterator = components?.row ?? getDataGridTableRow;\n\n  return <TableBody data-qa={`${context.qa}-body`}>{rows.map(iterator)}</TableBody>;\n};\n\nconst MemoizedDataGridTableBody = memo(\n  DataGridTableBody,\n  (prev, next) => prev.table.options.data === next.table.options.data\n);\n\nexport const getDataGridTableBody = (\n  table: DataGridTableBodyProps['table'],\n  components: DataGridProps['components']\n) => {\n  const isResizing = table.getState().columnSizingInfo.isResizingColumn;\n  const Component = isResizing ? MemoizedDataGridTableBody : DataGridTableBody;\n\n  return <Component table={table} components={components} />;\n};\n"],"names":["table","context","Component"],"mappings":";;;;;;AAWO;AAAe;AAAA;AAAA;AAAA;AAAA;AAMuC;AAACA;AAAiB;AACvEC;AAKC;AACT;AAYQC;AAEC;AACT;;;;;"}

package/dist/TableCell/hook.d.ts

@@ -0,0 +1,4 @@
+import { Column, Cell as ReactTableCell } from '@tanstack/react-table';
+import { TableCellProps } from './types';
+export declare const areaProps: (column: Column<unknown>, props: TableCellProps) => void;
+export declare const useDataGridTableCell: (cell: ReactTableCell<unknown, unknown>) => TableCellProps;

package/dist/TableCell/hook.es.js

@@ -0,0 +1,42 @@
+"use client";
+import { useContext as o } from "react";
+import { ColumnArea as r } from "@join-x5/react-data-grid-settings";
+import { DataGridContext as d } from "../DataGridContext.es.js";
+const c = (t, e) => {
+  const i = t.getIsPinned();
+  e.columnArea = (() => {
+    switch (t.getIsPinned()) {
+      case "left":
+        return r.FixedLeft;
+      case "right":
+        return r.FixedRight;
+    }
+    return r.Default;
+  })(), i && (e.style ?? (e.style = {}), i === "left" ? (e.style.left = `${t.getStart("left")}px`, e.isLastFixed = t.getIsLastColumn("left")) : (e.style.right = `${t.getAfter("right")}px`, e.isLastFixed = t.getIsFirstColumn("right")));
+}, h = (t) => {
+  var a, l;
+  const e = o(d), i = typeof e.isMultiline == "boolean" ? e.isMultiline : (a = e.isMultiline) == null ? void 0 : a.call(e, t), n = `calc(var(--header-${(l = t.column) == null ? void 0 : l.id}-size) * 1px)`, s = {
+    isMultiline: i,
+    qa: e.qa,
+    isBordered: e.isBordered,
+    isShadowed: e.isShadowed,
+    size: e.size,
+    verticalAlign: e.verticalAlign,
+    writingMode: e.writingMode,
+    userSelect: e.userSelect,
+    wordBreak: e.wordBreak,
+    whiteSpace: e.whiteSpace,
+    isRowSelected: t.row.getIsSelected(),
+    isResizing: t.column.getIsResizing(),
+    style: {
+      width: n,
+      maxWidth: n
+    }
+  };
+  return c(t.column, s), e.cellProps && Object.assign(s, e.cellProps instanceof Function ? e.cellProps(t) : e.cellProps), s;
+};
+export {
+  c as areaProps,
+  h as useDataGridTableCell
+};
+//# sourceMappingURL=hook.es.js.map

package/dist/TableCell/hook.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hook.es.js","sources":["../../src/TableCell/hook.ts"],"sourcesContent":["'use client';\n\nimport {useContext} from 'react';\n\nimport {ColumnArea} from '@join-x5/react-data-grid-settings';\n\nimport {DataGridContext} from 'DataGridContext';\n\nimport type {Column, Cell as ReactTableCell} from '@tanstack/react-table';\nimport type {TableCellProps} from './types';\n\nexport const areaProps = (column: Column<unknown>, props: TableCellProps): void => {\n  const isPinned = column.getIsPinned();\n\n  props.columnArea = (() => {\n    switch (column.getIsPinned()) {\n      case 'left':\n        return ColumnArea.FixedLeft;\n      case 'right':\n        return ColumnArea.FixedRight;\n    }\n\n    return ColumnArea.Default;\n  })();\n\n  if (!isPinned) {\n    return;\n  }\n\n  props.style ??= {};\n\n  if (isPinned === 'left') {\n    props.style.left = `${column.getStart('left')}px`;\n    props.isLastFixed = column.getIsLastColumn('left');\n  } else {\n    props.style.right = `${column.getAfter('right')}px`;\n    props.isLastFixed = column.getIsFirstColumn('right');\n  }\n};\n\nexport const useDataGridTableCell = (cell: ReactTableCell<unknown, unknown>) => {\n  const context = useContext(DataGridContext);\n\n  const isMultiline = typeof context.isMultiline === 'boolean' ? context.isMultiline : context.isMultiline?.(cell);\n  const width = `calc(var(--header-${cell.column?.id}-size) * 1px)`;\n\n  const resultProps: TableCellProps = {\n    isMultiline,\n\n    qa: context.qa,\n    isBordered: context.isBordered,\n    isShadowed: context.isShadowed,\n    size: context.size,\n    verticalAlign: context.verticalAlign,\n    writingMode: context.writingMode,\n    userSelect: context.userSelect,\n    wordBreak: context.wordBreak,\n    whiteSpace: context.whiteSpace,\n\n    isRowSelected: cell.row.getIsSelected(),\n    isResizing: cell.column.getIsResizing(),\n\n    style: {\n      width,\n      maxWidth: width,\n    },\n  };\n\n  areaProps(cell.column, resultProps);\n\n  if (context.cellProps) {\n    Object.assign(resultProps, context.cellProps instanceof Function ? context.cellProps(cell) : context.cellProps);\n  }\n\n  return resultProps;\n};\n"],"names":["areaProps","isPinned","column","FixedLeft","FixedRight","Default","context","isMultiline","qa","isBordered","isShadowed","size","verticalAlign","writingMode","userSelect","wordBreak","whiteSpace","width","cell"],"mappings":";;;;AAWaA;AACLC;AAaN;AAVUC;AAAoB;AAExB;AAAkBC;AAElB;AAAkBC;AAGtB;AAAkBC;AAgBtB;;AAGQC;AAK8B;AAClCC;AAEYC;AACQC;AACAC;AACNC;AACSC;AACFC;AACDC;AACDC;AACCC;AAEkB;AACA;AAE/B;AACLC;AACUA;AAAAA;AAIJC;AAOZ;;;;;"}

package/dist/TableCell/index.d.ts

@@ -0,0 +1,9 @@
+import { HTMLAttributes } from 'react';
+import { FRC, PropsWithChildren } from '@join-x5/react-theme';
+import { DataGridTableCellProps, TableCellProps } from './types';
+type TableCellContentProps = Pick<TableCellProps, 'children' | 'isMultiline' | 'whiteSpace' | 'wordBreak'> & HTMLAttributes<HTMLDivElement>;
+export declare const TableCellContent: FRC<HTMLDivElement, TableCellContentProps>;
+export declare const TableCell: FRC<HTMLTableCellElement, TableCellProps>;
+export declare const DataGridTableCell: FRC<HTMLTableCellElement, DataGridTableCellProps & PropsWithChildren>;
+export declare const getDataGridTableCell: (cell: DataGridTableCellProps["cell"]) => import("@emotion/react/jsx-runtime").JSX.Element;
+export * from './types';