@raystack/apsara 0.34.0 → 0.34.2

package/dist/v1/components/data-table/components/content.cjs

@@ -23,11 +23,11 @@ function LoaderRows({ rowCount, columnCount, }) {
     const rows = Array.from({ length: rowCount });
     return rows.map((_, rowIndex) => {
         const columns = Array.from({ length: columnCount });
-        return (jsxRuntime.jsxRuntimeExports.jsx(table.Table.Row, { children: columns.map((_, colIndex) => (jsxRuntime.jsxRuntimeExports.jsx(table.Table.Cell, { children: jsxRuntime.jsxRuntimeExports.jsx(index$1.default, {}) }, "loading-column-" + colIndex))) }, "loading-row-" + rowIndex));
+        return (jsxRuntime.jsxRuntimeExports.jsx(table.Table.Row, { children: columns.map((_, colIndex) => (jsxRuntime.jsxRuntimeExports.jsx(table.Table.Cell, { children: jsxRuntime.jsxRuntimeExports.jsx(index$1.default, { highlightColor: "var(--rs-color-background-base-primary)", baseColor: "var(--rs-color-background-base-primary-hover)" }) }, "loading-column-" + colIndex))) }, "loading-row-" + rowIndex));
     });
 }
 function GroupHeader({ colSpan, data, }) {
-    return (jsxRuntime.jsxRuntimeExports.jsx(table.Table.SectionHeader, { colSpan: colSpan, children: jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { gap: 3, align: "center", children: [data?.group_key, data.showGroupCount ? (jsxRuntime.jsxRuntimeExports.jsx(badge.Badge, { variant: "neutral", children: data?.count })) : null] }) }));
+    return (jsxRuntime.jsxRuntimeExports.jsx(table.Table.SectionHeader, { colSpan: colSpan, children: jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { gap: 3, align: "center", children: [data?.label, data.showGroupCount ? (jsxRuntime.jsxRuntimeExports.jsx(badge.Badge, { variant: "neutral", children: data?.count })) : null] }) }));
 }
 const Rows = React.forwardRef((props, lastRowRef) => {
     const { rows = [], onRowClick, classNames } = props;

package/dist/v1/components/data-table/components/content.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"content.cjs","sources":["../../../../../v1/components/data-table/components/content.tsx"],"sourcesContent":["import { Table } from \"../../table\";\nimport type { Row, HeaderGroup } from \"@tanstack/react-table\";\nimport { EmptyState } from \"../../empty-state\";\nimport { TableIcon } from \"@radix-ui/react-icons\";\nimport { flexRender } from \"@tanstack/react-table\";\nimport { useDataTable } from \"../hooks/useDataTable\";\nimport {\n  DataTableColumnDef,\n  DataTableContentProps,\n  GroupedData,\n} from \"../data-table.types\";\nimport Skeleton from \"react-loading-skeleton\";\nimport {\n  ForwardedRef,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useRef,\n} from \"react\";\nimport { Badge } from \"../../badge\";\nimport { Flex } from \"../../flex\";\nimport styles from \"../data-table.module.css\";\nimport clsx from \"clsx\";\n\nfunction Headers<TData>({\n  headerGroups = [],\n  className = \"\",\n}: {\n  headerGroups: HeaderGroup<TData>[];\n  className?: string;\n}) {\n  return (\n    <Table.Header className={className}>\n      {headerGroups?.map((headerGroup) => (\n        <Table.Row key={headerGroup?.id}>\n          {headerGroup?.headers?.map((header) => {\n            const columnDef = header.column.columnDef as DataTableColumnDef<\n              TData,\n              unknown\n            >;\n            return (\n              <Table.Head\n                key={header.id}\n                colSpan={header.colSpan}\n                className={columnDef.classNames?.header}\n                style={columnDef.styles?.header}\n              >\n                {flexRender(columnDef.header, header.getContext())}\n              </Table.Head>\n            );\n          })}\n        </Table.Row>\n      ))}\n    </Table.Header>\n  );\n}\n\ninterface RowsProps<TData> {\n  rows: Row<TData>[];\n  lastRowRef?: ForwardedRef<HTMLTableRowElement>;\n  onRowClick?: (row: TData) => void;\n  classNames?: {\n    row?: string;\n  };\n}\n\nfunction LoaderRows({\n  rowCount,\n  columnCount,\n}: {\n  rowCount: number;\n  columnCount: number;\n}) {\n  const rows = Array.from({ length: rowCount });\n  return rows.map((_, rowIndex) => {\n    const columns = Array.from({ length: columnCount });\n    return (\n      <Table.Row key={\"loading-row-\" + rowIndex}>\n        {columns.map((_, colIndex) => (\n          <Table.Cell key={\"loading-column-\" + colIndex}>\n            <Skeleton />\n          </Table.Cell>\n        ))}\n      </Table.Row>\n    );\n  });\n}\n\nfunction GroupHeader<TData>({\n  colSpan,\n  data,\n}: {\n  colSpan: number;\n  data: GroupedData<TData>;\n}) {\n  return (\n    <Table.SectionHeader colSpan={colSpan}>\n      <Flex gap={3} align=\"center\">\n        {data?.group_key}\n        {data.showGroupCount ? (\n          <Badge variant=\"neutral\">{data?.count}</Badge>\n        ) : null}\n      </Flex>\n    </Table.SectionHeader>\n  );\n}\n\nconst Rows = forwardRef<HTMLTableRowElement, RowsProps<unknown>>(\n  (props, lastRowRef) => {\n    const { rows = [], onRowClick, classNames } = props;\n    return (\n      <>\n        {rows?.map((row, index) => {\n          const isSelected = row.getIsSelected();\n          const cells = row.getVisibleCells() || [];\n          const isSectionHeadingRow = row.depth === 0 && row.getIsExpanded();\n          const isLastRow = index === rows.length - 1;\n          const rowKey = row.id + \"-\" + index;\n          return isSectionHeadingRow ? (\n            <GroupHeader\n              key={rowKey}\n              colSpan={cells.length}\n              data={row.original as GroupedData<unknown>}\n            />\n          ) : (\n            <Table.Row\n              key={rowKey}\n              className={clsx(\n                styles[\"row\"],\n                onRowClick ? styles[\"clickable\"] : \"\",\n                classNames?.row\n              )}\n              data-state={isSelected && \"selected\"}\n              ref={isLastRow ? lastRowRef : undefined}\n              onClick={() => onRowClick?.(row.original)}\n            >\n              {cells.map((cell) => {\n                const columnDef = cell.column.columnDef as DataTableColumnDef<\n                  unknown,\n                  unknown\n                >;\n                return (\n                  <Table.Cell\n                    key={cell.id}\n                    className={clsx(styles[\"cell\"], columnDef.classNames?.cell)}\n                    style={columnDef.styles?.cell}\n                  >\n                    {flexRender(columnDef.cell, cell.getContext())}\n                  </Table.Cell>\n                );\n              })}\n            </Table.Row>\n          );\n        })}\n      </>\n    );\n  }\n);\n\nconst DefaultEmptyComponent = () => (\n  <EmptyState icon={<TableIcon />} heading=\"No Data\" />\n);\n\nexport function Content({\n  emptyState,\n  classNames = {},\n}: DataTableContentProps) {\n  const {\n    onRowClick,\n    table,\n    mode,\n    isLoading,\n    loadMoreData,\n    loadingRowCount = 3,\n  } = useDataTable();\n  const headerGroups = table?.getHeaderGroups();\n  const { rows = [] } = table?.getRowModel();\n\n  const lastRowRef = useRef<HTMLTableRowElement | null>(null);\n  const observerRef = useRef<IntersectionObserver | null>(null);\n\n  const handleObserver = useCallback(\n    (entries: IntersectionObserverEntry[]) => {\n      const target = entries[0];\n      if (target.isIntersecting && !isLoading) {\n        loadMoreData();\n      }\n    },\n    [loadMoreData, isLoading]\n  );\n\n  useEffect(() => {\n    if (mode !== \"server\") return;\n\n    if (observerRef.current) {\n      observerRef.current.disconnect();\n    }\n\n    observerRef.current = new IntersectionObserver(handleObserver, {\n      threshold: 0.1,\n    });\n    const lastRow = lastRowRef.current;\n    if (lastRow) {\n      observerRef.current.observe(lastRow);\n    }\n\n    return () => {\n      if (observerRef.current && lastRow) {\n        observerRef.current.unobserve(lastRow);\n        observerRef.current.disconnect();\n      }\n    };\n  }, [mode, rows.length, handleObserver]);\n\n  const visibleColumnsLength = table.getVisibleLeafColumns().length;\n\n  return (\n    <Table className={classNames.table}>\n      <Headers headerGroups={headerGroups} className={classNames.header} />\n      <Table.Body className={classNames.body}>\n        {rows?.length || isLoading ? (\n          <>\n            <Rows\n              rows={rows}\n              ref={lastRowRef}\n              onRowClick={onRowClick}\n              classNames={{\n                row: classNames.row,\n              }}\n            />\n            {isLoading ? (\n              <LoaderRows\n                rowCount={loadingRowCount}\n                columnCount={visibleColumnsLength}\n              />\n            ) : null}\n          </>\n        ) : (\n          <Table.Row>\n            <Table.Cell colSpan={visibleColumnsLength}>\n              {emptyState || <DefaultEmptyComponent />}\n            </Table.Cell>\n          </Table.Row>\n        )}\n      </Table.Body>\n    </Table>\n  );\n}\n"],"names":["_jsx","Table","flexRender","Skeleton","_jsxs","Flex","Badge","forwardRef","_Fragment","index","clsx","styles","EmptyState","TableIcon","table","useDataTable","useRef","useCallback","useEffect"],"mappings":"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"}
+{"version":3,"file":"content.cjs","sources":["../../../../../v1/components/data-table/components/content.tsx"],"sourcesContent":["import { Table } from \"../../table\";\nimport type { Row, HeaderGroup } from \"@tanstack/react-table\";\nimport { EmptyState } from \"../../empty-state\";\nimport { TableIcon } from \"@radix-ui/react-icons\";\nimport { flexRender } from \"@tanstack/react-table\";\nimport { useDataTable } from \"../hooks/useDataTable\";\nimport {\n  DataTableColumnDef,\n  DataTableContentProps,\n  GroupedData,\n} from \"../data-table.types\";\nimport Skeleton from \"react-loading-skeleton\";\nimport {\n  ForwardedRef,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useRef,\n} from \"react\";\nimport { Badge } from \"../../badge\";\nimport { Flex } from \"../../flex\";\nimport styles from \"../data-table.module.css\";\nimport clsx from \"clsx\";\n\nfunction Headers<TData>({\n  headerGroups = [],\n  className = \"\",\n}: {\n  headerGroups: HeaderGroup<TData>[];\n  className?: string;\n}) {\n  return (\n    <Table.Header className={className}>\n      {headerGroups?.map((headerGroup) => (\n        <Table.Row key={headerGroup?.id}>\n          {headerGroup?.headers?.map((header) => {\n            const columnDef = header.column.columnDef as DataTableColumnDef<\n              TData,\n              unknown\n            >;\n            return (\n              <Table.Head\n                key={header.id}\n                colSpan={header.colSpan}\n                className={columnDef.classNames?.header}\n                style={columnDef.styles?.header}\n              >\n                {flexRender(columnDef.header, header.getContext())}\n              </Table.Head>\n            );\n          })}\n        </Table.Row>\n      ))}\n    </Table.Header>\n  );\n}\n\ninterface RowsProps<TData> {\n  rows: Row<TData>[];\n  lastRowRef?: ForwardedRef<HTMLTableRowElement>;\n  onRowClick?: (row: TData) => void;\n  classNames?: {\n    row?: string;\n  };\n}\n\nfunction LoaderRows({\n  rowCount,\n  columnCount,\n}: {\n  rowCount: number;\n  columnCount: number;\n}) {\n  const rows = Array.from({ length: rowCount });\n  return rows.map((_, rowIndex) => {\n    const columns = Array.from({ length: columnCount });\n    return (\n      <Table.Row key={\"loading-row-\" + rowIndex}>\n        {columns.map((_, colIndex) => (\n          <Table.Cell key={\"loading-column-\" + colIndex}>\n            <Skeleton\n              highlightColor=\"var(--rs-color-background-base-primary)\"\n              baseColor=\"var(--rs-color-background-base-primary-hover)\"\n            />\n          </Table.Cell>\n        ))}\n      </Table.Row>\n    );\n  });\n}\n\nfunction GroupHeader<TData>({\n  colSpan,\n  data,\n}: {\n  colSpan: number;\n  data: GroupedData<TData>;\n}) {\n  return (\n    <Table.SectionHeader colSpan={colSpan}>\n      <Flex gap={3} align=\"center\">\n        {data?.label}\n        {data.showGroupCount ? (\n          <Badge variant=\"neutral\">{data?.count}</Badge>\n        ) : null}\n      </Flex>\n    </Table.SectionHeader>\n  );\n}\n\nconst Rows = forwardRef<HTMLTableRowElement, RowsProps<unknown>>(\n  (props, lastRowRef) => {\n    const { rows = [], onRowClick, classNames } = props;\n    return (\n      <>\n        {rows?.map((row, index) => {\n          const isSelected = row.getIsSelected();\n          const cells = row.getVisibleCells() || [];\n          const isSectionHeadingRow = row.depth === 0 && row.getIsExpanded();\n          const isLastRow = index === rows.length - 1;\n          const rowKey = row.id + \"-\" + index;\n          return isSectionHeadingRow ? (\n            <GroupHeader\n              key={rowKey}\n              colSpan={cells.length}\n              data={row.original as GroupedData<unknown>}\n            />\n          ) : (\n            <Table.Row\n              key={rowKey}\n              className={clsx(\n                styles[\"row\"],\n                onRowClick ? styles[\"clickable\"] : \"\",\n                classNames?.row\n              )}\n              data-state={isSelected && \"selected\"}\n              ref={isLastRow ? lastRowRef : undefined}\n              onClick={() => onRowClick?.(row.original)}\n            >\n              {cells.map((cell) => {\n                const columnDef = cell.column.columnDef as DataTableColumnDef<\n                  unknown,\n                  unknown\n                >;\n                return (\n                  <Table.Cell\n                    key={cell.id}\n                    className={clsx(styles[\"cell\"], columnDef.classNames?.cell)}\n                    style={columnDef.styles?.cell}\n                  >\n                    {flexRender(columnDef.cell, cell.getContext())}\n                  </Table.Cell>\n                );\n              })}\n            </Table.Row>\n          );\n        })}\n      </>\n    );\n  }\n);\n\nconst DefaultEmptyComponent = () => (\n  <EmptyState icon={<TableIcon />} heading=\"No Data\" />\n);\n\nexport function Content({\n  emptyState,\n  classNames = {},\n}: DataTableContentProps) {\n  const {\n    onRowClick,\n    table,\n    mode,\n    isLoading,\n    loadMoreData,\n    loadingRowCount = 3,\n  } = useDataTable();\n  const headerGroups = table?.getHeaderGroups();\n  const { rows = [] } = table?.getRowModel();\n\n  const lastRowRef = useRef<HTMLTableRowElement | null>(null);\n  const observerRef = useRef<IntersectionObserver | null>(null);\n\n  const handleObserver = useCallback(\n    (entries: IntersectionObserverEntry[]) => {\n      const target = entries[0];\n      if (target.isIntersecting && !isLoading) {\n        loadMoreData();\n      }\n    },\n    [loadMoreData, isLoading]\n  );\n\n  useEffect(() => {\n    if (mode !== \"server\") return;\n\n    if (observerRef.current) {\n      observerRef.current.disconnect();\n    }\n\n    observerRef.current = new IntersectionObserver(handleObserver, {\n      threshold: 0.1,\n    });\n    const lastRow = lastRowRef.current;\n    if (lastRow) {\n      observerRef.current.observe(lastRow);\n    }\n\n    return () => {\n      if (observerRef.current && lastRow) {\n        observerRef.current.unobserve(lastRow);\n        observerRef.current.disconnect();\n      }\n    };\n  }, [mode, rows.length, handleObserver]);\n\n  const visibleColumnsLength = table.getVisibleLeafColumns().length;\n\n  return (\n    <Table className={classNames.table}>\n      <Headers headerGroups={headerGroups} className={classNames.header} />\n      <Table.Body className={classNames.body}>\n        {rows?.length || isLoading ? (\n          <>\n            <Rows\n              rows={rows}\n              ref={lastRowRef}\n              onRowClick={onRowClick}\n              classNames={{\n                row: classNames.row,\n              }}\n            />\n            {isLoading ? (\n              <LoaderRows\n                rowCount={loadingRowCount}\n                columnCount={visibleColumnsLength}\n              />\n            ) : null}\n          </>\n        ) : (\n          <Table.Row>\n            <Table.Cell colSpan={visibleColumnsLength}>\n              {emptyState || <DefaultEmptyComponent />}\n            </Table.Cell>\n          </Table.Row>\n        )}\n      </Table.Body>\n    </Table>\n  );\n}\n"],"names":["_jsx","Table","flexRender","Skeleton","_jsxs","Flex","Badge","forwardRef","_Fragment","index","clsx","styles","EmptyState","TableIcon","table","useDataTable","useRef","useCallback","useEffect"],"mappings":"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"}

package/dist/v1/components/data-table/components/content.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"content.d.ts","sourceRoot":"","sources":["../../../../../v1/components/data-table/components/content.tsx"],"names":[],"mappings":"AAMA,OAAO,EAEL,qBAAqB,EAEtB,MAAM,qBAAqB,CAAC;AAyJ7B,wBAAgB,OAAO,CAAC,EACtB,UAAU,EACV,UAAe,GAChB,EAAE,qBAAqB,2CAiFvB"}
+{"version":3,"file":"content.d.ts","sourceRoot":"","sources":["../../../../../v1/components/data-table/components/content.tsx"],"names":[],"mappings":"AAMA,OAAO,EAEL,qBAAqB,EAEtB,MAAM,qBAAqB,CAAC;AA4J7B,wBAAgB,OAAO,CAAC,EACtB,UAAU,EACV,UAAe,GAChB,EAAE,qBAAqB,2CAiFvB"}

package/dist/v1/components/data-table/components/content.js

@@ -21,11 +21,11 @@ function LoaderRows({ rowCount, columnCount, }) {
     const rows = Array.from({ length: rowCount });
     return rows.map((_, rowIndex) => {
         const columns = Array.from({ length: columnCount });
-        return (jsxRuntimeExports.jsx(Table.Row, { children: columns.map((_, colIndex) => (jsxRuntimeExports.jsx(Table.Cell, { children: jsxRuntimeExports.jsx(Skeleton, {}) }, "loading-column-" + colIndex))) }, "loading-row-" + rowIndex));
+        return (jsxRuntimeExports.jsx(Table.Row, { children: columns.map((_, colIndex) => (jsxRuntimeExports.jsx(Table.Cell, { children: jsxRuntimeExports.jsx(Skeleton, { highlightColor: "var(--rs-color-background-base-primary)", baseColor: "var(--rs-color-background-base-primary-hover)" }) }, "loading-column-" + colIndex))) }, "loading-row-" + rowIndex));
     });
 }
 function GroupHeader({ colSpan, data, }) {
-    return (jsxRuntimeExports.jsx(Table.SectionHeader, { colSpan: colSpan, children: jsxRuntimeExports.jsxs(Flex, { gap: 3, align: "center", children: [data?.group_key, data.showGroupCount ? (jsxRuntimeExports.jsx(Badge, { variant: "neutral", children: data?.count })) : null] }) }));
+    return (jsxRuntimeExports.jsx(Table.SectionHeader, { colSpan: colSpan, children: jsxRuntimeExports.jsxs(Flex, { gap: 3, align: "center", children: [data?.label, data.showGroupCount ? (jsxRuntimeExports.jsx(Badge, { variant: "neutral", children: data?.count })) : null] }) }));
 }
 const Rows = forwardRef((props, lastRowRef) => {
     const { rows = [], onRowClick, classNames } = props;

package/dist/v1/components/data-table/components/content.js.map

@@ -1 +1 @@
-{"version":3,"file":"content.js","sources":["../../../../../v1/components/data-table/components/content.tsx"],"sourcesContent":["import { Table } from \"../../table\";\nimport type { Row, HeaderGroup } from \"@tanstack/react-table\";\nimport { EmptyState } from \"../../empty-state\";\nimport { TableIcon } from \"@radix-ui/react-icons\";\nimport { flexRender } from \"@tanstack/react-table\";\nimport { useDataTable } from \"../hooks/useDataTable\";\nimport {\n  DataTableColumnDef,\n  DataTableContentProps,\n  GroupedData,\n} from \"../data-table.types\";\nimport Skeleton from \"react-loading-skeleton\";\nimport {\n  ForwardedRef,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useRef,\n} from \"react\";\nimport { Badge } from \"../../badge\";\nimport { Flex } from \"../../flex\";\nimport styles from \"../data-table.module.css\";\nimport clsx from \"clsx\";\n\nfunction Headers<TData>({\n  headerGroups = [],\n  className = \"\",\n}: {\n  headerGroups: HeaderGroup<TData>[];\n  className?: string;\n}) {\n  return (\n    <Table.Header className={className}>\n      {headerGroups?.map((headerGroup) => (\n        <Table.Row key={headerGroup?.id}>\n          {headerGroup?.headers?.map((header) => {\n            const columnDef = header.column.columnDef as DataTableColumnDef<\n              TData,\n              unknown\n            >;\n            return (\n              <Table.Head\n                key={header.id}\n                colSpan={header.colSpan}\n                className={columnDef.classNames?.header}\n                style={columnDef.styles?.header}\n              >\n                {flexRender(columnDef.header, header.getContext())}\n              </Table.Head>\n            );\n          })}\n        </Table.Row>\n      ))}\n    </Table.Header>\n  );\n}\n\ninterface RowsProps<TData> {\n  rows: Row<TData>[];\n  lastRowRef?: ForwardedRef<HTMLTableRowElement>;\n  onRowClick?: (row: TData) => void;\n  classNames?: {\n    row?: string;\n  };\n}\n\nfunction LoaderRows({\n  rowCount,\n  columnCount,\n}: {\n  rowCount: number;\n  columnCount: number;\n}) {\n  const rows = Array.from({ length: rowCount });\n  return rows.map((_, rowIndex) => {\n    const columns = Array.from({ length: columnCount });\n    return (\n      <Table.Row key={\"loading-row-\" + rowIndex}>\n        {columns.map((_, colIndex) => (\n          <Table.Cell key={\"loading-column-\" + colIndex}>\n            <Skeleton />\n          </Table.Cell>\n        ))}\n      </Table.Row>\n    );\n  });\n}\n\nfunction GroupHeader<TData>({\n  colSpan,\n  data,\n}: {\n  colSpan: number;\n  data: GroupedData<TData>;\n}) {\n  return (\n    <Table.SectionHeader colSpan={colSpan}>\n      <Flex gap={3} align=\"center\">\n        {data?.group_key}\n        {data.showGroupCount ? (\n          <Badge variant=\"neutral\">{data?.count}</Badge>\n        ) : null}\n      </Flex>\n    </Table.SectionHeader>\n  );\n}\n\nconst Rows = forwardRef<HTMLTableRowElement, RowsProps<unknown>>(\n  (props, lastRowRef) => {\n    const { rows = [], onRowClick, classNames } = props;\n    return (\n      <>\n        {rows?.map((row, index) => {\n          const isSelected = row.getIsSelected();\n          const cells = row.getVisibleCells() || [];\n          const isSectionHeadingRow = row.depth === 0 && row.getIsExpanded();\n          const isLastRow = index === rows.length - 1;\n          const rowKey = row.id + \"-\" + index;\n          return isSectionHeadingRow ? (\n            <GroupHeader\n              key={rowKey}\n              colSpan={cells.length}\n              data={row.original as GroupedData<unknown>}\n            />\n          ) : (\n            <Table.Row\n              key={rowKey}\n              className={clsx(\n                styles[\"row\"],\n                onRowClick ? styles[\"clickable\"] : \"\",\n                classNames?.row\n              )}\n              data-state={isSelected && \"selected\"}\n              ref={isLastRow ? lastRowRef : undefined}\n              onClick={() => onRowClick?.(row.original)}\n            >\n              {cells.map((cell) => {\n                const columnDef = cell.column.columnDef as DataTableColumnDef<\n                  unknown,\n                  unknown\n                >;\n                return (\n                  <Table.Cell\n                    key={cell.id}\n                    className={clsx(styles[\"cell\"], columnDef.classNames?.cell)}\n                    style={columnDef.styles?.cell}\n                  >\n                    {flexRender(columnDef.cell, cell.getContext())}\n                  </Table.Cell>\n                );\n              })}\n            </Table.Row>\n          );\n        })}\n      </>\n    );\n  }\n);\n\nconst DefaultEmptyComponent = () => (\n  <EmptyState icon={<TableIcon />} heading=\"No Data\" />\n);\n\nexport function Content({\n  emptyState,\n  classNames = {},\n}: DataTableContentProps) {\n  const {\n    onRowClick,\n    table,\n    mode,\n    isLoading,\n    loadMoreData,\n    loadingRowCount = 3,\n  } = useDataTable();\n  const headerGroups = table?.getHeaderGroups();\n  const { rows = [] } = table?.getRowModel();\n\n  const lastRowRef = useRef<HTMLTableRowElement | null>(null);\n  const observerRef = useRef<IntersectionObserver | null>(null);\n\n  const handleObserver = useCallback(\n    (entries: IntersectionObserverEntry[]) => {\n      const target = entries[0];\n      if (target.isIntersecting && !isLoading) {\n        loadMoreData();\n      }\n    },\n    [loadMoreData, isLoading]\n  );\n\n  useEffect(() => {\n    if (mode !== \"server\") return;\n\n    if (observerRef.current) {\n      observerRef.current.disconnect();\n    }\n\n    observerRef.current = new IntersectionObserver(handleObserver, {\n      threshold: 0.1,\n    });\n    const lastRow = lastRowRef.current;\n    if (lastRow) {\n      observerRef.current.observe(lastRow);\n    }\n\n    return () => {\n      if (observerRef.current && lastRow) {\n        observerRef.current.unobserve(lastRow);\n        observerRef.current.disconnect();\n      }\n    };\n  }, [mode, rows.length, handleObserver]);\n\n  const visibleColumnsLength = table.getVisibleLeafColumns().length;\n\n  return (\n    <Table className={classNames.table}>\n      <Headers headerGroups={headerGroups} className={classNames.header} />\n      <Table.Body className={classNames.body}>\n        {rows?.length || isLoading ? (\n          <>\n            <Rows\n              rows={rows}\n              ref={lastRowRef}\n              onRowClick={onRowClick}\n              classNames={{\n                row: classNames.row,\n              }}\n            />\n            {isLoading ? (\n              <LoaderRows\n                rowCount={loadingRowCount}\n                columnCount={visibleColumnsLength}\n              />\n            ) : null}\n          </>\n        ) : (\n          <Table.Row>\n            <Table.Cell colSpan={visibleColumnsLength}>\n              {emptyState || <DefaultEmptyComponent />}\n            </Table.Cell>\n          </Table.Row>\n        )}\n      </Table.Body>\n    </Table>\n  );\n}\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
+{"version":3,"file":"content.js","sources":["../../../../../v1/components/data-table/components/content.tsx"],"sourcesContent":["import { Table } from \"../../table\";\nimport type { Row, HeaderGroup } from \"@tanstack/react-table\";\nimport { EmptyState } from \"../../empty-state\";\nimport { TableIcon } from \"@radix-ui/react-icons\";\nimport { flexRender } from \"@tanstack/react-table\";\nimport { useDataTable } from \"../hooks/useDataTable\";\nimport {\n  DataTableColumnDef,\n  DataTableContentProps,\n  GroupedData,\n} from \"../data-table.types\";\nimport Skeleton from \"react-loading-skeleton\";\nimport {\n  ForwardedRef,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useRef,\n} from \"react\";\nimport { Badge } from \"../../badge\";\nimport { Flex } from \"../../flex\";\nimport styles from \"../data-table.module.css\";\nimport clsx from \"clsx\";\n\nfunction Headers<TData>({\n  headerGroups = [],\n  className = \"\",\n}: {\n  headerGroups: HeaderGroup<TData>[];\n  className?: string;\n}) {\n  return (\n    <Table.Header className={className}>\n      {headerGroups?.map((headerGroup) => (\n        <Table.Row key={headerGroup?.id}>\n          {headerGroup?.headers?.map((header) => {\n            const columnDef = header.column.columnDef as DataTableColumnDef<\n              TData,\n              unknown\n            >;\n            return (\n              <Table.Head\n                key={header.id}\n                colSpan={header.colSpan}\n                className={columnDef.classNames?.header}\n                style={columnDef.styles?.header}\n              >\n                {flexRender(columnDef.header, header.getContext())}\n              </Table.Head>\n            );\n          })}\n        </Table.Row>\n      ))}\n    </Table.Header>\n  );\n}\n\ninterface RowsProps<TData> {\n  rows: Row<TData>[];\n  lastRowRef?: ForwardedRef<HTMLTableRowElement>;\n  onRowClick?: (row: TData) => void;\n  classNames?: {\n    row?: string;\n  };\n}\n\nfunction LoaderRows({\n  rowCount,\n  columnCount,\n}: {\n  rowCount: number;\n  columnCount: number;\n}) {\n  const rows = Array.from({ length: rowCount });\n  return rows.map((_, rowIndex) => {\n    const columns = Array.from({ length: columnCount });\n    return (\n      <Table.Row key={\"loading-row-\" + rowIndex}>\n        {columns.map((_, colIndex) => (\n          <Table.Cell key={\"loading-column-\" + colIndex}>\n            <Skeleton\n              highlightColor=\"var(--rs-color-background-base-primary)\"\n              baseColor=\"var(--rs-color-background-base-primary-hover)\"\n            />\n          </Table.Cell>\n        ))}\n      </Table.Row>\n    );\n  });\n}\n\nfunction GroupHeader<TData>({\n  colSpan,\n  data,\n}: {\n  colSpan: number;\n  data: GroupedData<TData>;\n}) {\n  return (\n    <Table.SectionHeader colSpan={colSpan}>\n      <Flex gap={3} align=\"center\">\n        {data?.label}\n        {data.showGroupCount ? (\n          <Badge variant=\"neutral\">{data?.count}</Badge>\n        ) : null}\n      </Flex>\n    </Table.SectionHeader>\n  );\n}\n\nconst Rows = forwardRef<HTMLTableRowElement, RowsProps<unknown>>(\n  (props, lastRowRef) => {\n    const { rows = [], onRowClick, classNames } = props;\n    return (\n      <>\n        {rows?.map((row, index) => {\n          const isSelected = row.getIsSelected();\n          const cells = row.getVisibleCells() || [];\n          const isSectionHeadingRow = row.depth === 0 && row.getIsExpanded();\n          const isLastRow = index === rows.length - 1;\n          const rowKey = row.id + \"-\" + index;\n          return isSectionHeadingRow ? (\n            <GroupHeader\n              key={rowKey}\n              colSpan={cells.length}\n              data={row.original as GroupedData<unknown>}\n            />\n          ) : (\n            <Table.Row\n              key={rowKey}\n              className={clsx(\n                styles[\"row\"],\n                onRowClick ? styles[\"clickable\"] : \"\",\n                classNames?.row\n              )}\n              data-state={isSelected && \"selected\"}\n              ref={isLastRow ? lastRowRef : undefined}\n              onClick={() => onRowClick?.(row.original)}\n            >\n              {cells.map((cell) => {\n                const columnDef = cell.column.columnDef as DataTableColumnDef<\n                  unknown,\n                  unknown\n                >;\n                return (\n                  <Table.Cell\n                    key={cell.id}\n                    className={clsx(styles[\"cell\"], columnDef.classNames?.cell)}\n                    style={columnDef.styles?.cell}\n                  >\n                    {flexRender(columnDef.cell, cell.getContext())}\n                  </Table.Cell>\n                );\n              })}\n            </Table.Row>\n          );\n        })}\n      </>\n    );\n  }\n);\n\nconst DefaultEmptyComponent = () => (\n  <EmptyState icon={<TableIcon />} heading=\"No Data\" />\n);\n\nexport function Content({\n  emptyState,\n  classNames = {},\n}: DataTableContentProps) {\n  const {\n    onRowClick,\n    table,\n    mode,\n    isLoading,\n    loadMoreData,\n    loadingRowCount = 3,\n  } = useDataTable();\n  const headerGroups = table?.getHeaderGroups();\n  const { rows = [] } = table?.getRowModel();\n\n  const lastRowRef = useRef<HTMLTableRowElement | null>(null);\n  const observerRef = useRef<IntersectionObserver | null>(null);\n\n  const handleObserver = useCallback(\n    (entries: IntersectionObserverEntry[]) => {\n      const target = entries[0];\n      if (target.isIntersecting && !isLoading) {\n        loadMoreData();\n      }\n    },\n    [loadMoreData, isLoading]\n  );\n\n  useEffect(() => {\n    if (mode !== \"server\") return;\n\n    if (observerRef.current) {\n      observerRef.current.disconnect();\n    }\n\n    observerRef.current = new IntersectionObserver(handleObserver, {\n      threshold: 0.1,\n    });\n    const lastRow = lastRowRef.current;\n    if (lastRow) {\n      observerRef.current.observe(lastRow);\n    }\n\n    return () => {\n      if (observerRef.current && lastRow) {\n        observerRef.current.unobserve(lastRow);\n        observerRef.current.disconnect();\n      }\n    };\n  }, [mode, rows.length, handleObserver]);\n\n  const visibleColumnsLength = table.getVisibleLeafColumns().length;\n\n  return (\n    <Table className={classNames.table}>\n      <Headers headerGroups={headerGroups} className={classNames.header} />\n      <Table.Body className={classNames.body}>\n        {rows?.length || isLoading ? (\n          <>\n            <Rows\n              rows={rows}\n              ref={lastRowRef}\n              onRowClick={onRowClick}\n              classNames={{\n                row: classNames.row,\n              }}\n            />\n            {isLoading ? (\n              <LoaderRows\n                rowCount={loadingRowCount}\n                columnCount={visibleColumnsLength}\n              />\n            ) : null}\n          </>\n        ) : (\n          <Table.Row>\n            <Table.Cell colSpan={visibleColumnsLength}>\n              {emptyState || <DefaultEmptyComponent />}\n            </Table.Cell>\n          </Table.Row>\n        )}\n      </Table.Body>\n    </Table>\n  );\n}\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}

package/dist/v1/components/data-table/components/display-settings.cjs

@@ -32,19 +32,26 @@ function DisplaySettings() {
             };
         });
     }
-    function onGroupChange(columnId, order) {
+    function onGroupChange(columnId) {
         updateTableQuery((query) => {
             return {
                 ...query,
                 group_by: [columnId],
-                __group_by_sort: order,
+            };
+        });
+    }
+    function onGroupRemove() {
+        updateTableQuery((query) => {
+            return {
+                ...query,
+                group_by: [],
             };
         });
     }
     function onReset() {
         onDisplaySettingsReset();
     }
-    return (jsxRuntime.jsxRuntimeExports.jsxs(popover.Popover, { children: [jsxRuntime.jsxRuntimeExports.jsx(popover.Popover.Trigger, { asChild: true, children: jsxRuntime.jsxRuntimeExports.jsx(button.Button, { variant: "outline", color: "neutral", size: "small", leadingIcon: jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.MixerHorizontalIcon, {}), children: "Display" }) }), jsxRuntime.jsxRuntimeExports.jsx(popover.Popover.Content, { className: dataTable_module.default["display-popover-content"], align: "end", children: jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { direction: "column", children: [jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { direction: "column", className: dataTable_module.default["display-popover-properties-container"], gap: 5, children: [jsxRuntime.jsxRuntimeExports.jsx(ordering.Ordering, { columnList: sortableColumns, onChange: onSortChange, value: tableQuery?.sort?.[0] || defaultSort }), jsxRuntime.jsxRuntimeExports.jsx(grouping.Grouping, { columns: columns, onChange: onGroupChange, value: tableQuery?.group_by?.[0] || dataTable_types.defaultGroupOption.id })] }), jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { className: dataTable_module.default["display-popover-properties-container"], children: jsxRuntime.jsxRuntimeExports.jsx(displayProperties.DisplayProperties, { columns: columns }) }), jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { justify: "end", className: dataTable_module.default["display-popover-reset-container"], children: jsxRuntime.jsxRuntimeExports.jsx(button.Button, { variant: "text", onClick: onReset, children: "Reset to default" }) })] }) })] }));
+    return (jsxRuntime.jsxRuntimeExports.jsxs(popover.Popover, { children: [jsxRuntime.jsxRuntimeExports.jsx(popover.Popover.Trigger, { asChild: true, children: jsxRuntime.jsxRuntimeExports.jsx(button.Button, { variant: "outline", color: "neutral", size: "small", leadingIcon: jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.MixerHorizontalIcon, {}), children: "Display" }) }), jsxRuntime.jsxRuntimeExports.jsx(popover.Popover.Content, { className: dataTable_module.default["display-popover-content"], align: "end", children: jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { direction: "column", children: [jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { direction: "column", className: dataTable_module.default["display-popover-properties-container"], gap: 5, children: [jsxRuntime.jsxRuntimeExports.jsx(ordering.Ordering, { columnList: sortableColumns, onChange: onSortChange, value: tableQuery?.sort?.[0] || defaultSort }), jsxRuntime.jsxRuntimeExports.jsx(grouping.Grouping, { columns: columns, onRemove: onGroupRemove, onChange: onGroupChange, value: tableQuery?.group_by?.[0] || dataTable_types.defaultGroupOption.id })] }), jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { className: dataTable_module.default["display-popover-properties-container"], children: jsxRuntime.jsxRuntimeExports.jsx(displayProperties.DisplayProperties, { columns: columns }) }), jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { justify: "end", className: dataTable_module.default["display-popover-reset-container"], children: jsxRuntime.jsxRuntimeExports.jsx(button.Button, { variant: "text", onClick: onReset, children: "Reset to default" }) })] }) })] }));
 }
 
 exports.DisplaySettings = DisplaySettings;

package/dist/v1/components/data-table/components/display-settings.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"display-settings.cjs","sources":["../../../../../v1/components/data-table/components/display-settings.tsx"],"sourcesContent":["import { Flex } from \"../../flex\";\nimport styles from \"../data-table.module.css\";\nimport { Button } from \"../../button\";\nimport { Popover } from \"../../popover\";\nimport { MixerHorizontalIcon } from \"@radix-ui/react-icons\";\nimport { useDataTable } from \"../hooks/useDataTable\";\nimport {\n  DataTableColumn,\n  SortOrdersValues,\n  defaultGroupOption,\n} from \"../data-table.types\";\nimport { Ordering } from \"./ordering\";\nimport { Grouping } from \"./grouping\";\nimport { DisplayProperties } from \"./display-properties\";\n\nexport function DisplaySettings<TData, TValue>() {\n  const {\n    table,\n    updateTableQuery,\n    tableQuery,\n    defaultSort,\n    onDisplaySettingsReset,\n  } = useDataTable();\n  const columns = table?.getAllColumns() as DataTableColumn<TData, TValue>[];\n\n  const sortableColumns = columns\n    ?.filter((col) => col.columnDef.enableSorting)\n    ?.map((column) => {\n      const id = column.id;\n      return {\n        label: column.columnDef.header || id,\n        id: id,\n      };\n    });\n\n  function onSortChange(columnId: string, order: SortOrdersValues) {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        sort: [{ name: columnId, order }],\n      };\n    });\n  }\n\n  function onGroupChange(columnId: string, order: SortOrdersValues) {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        group_by: [columnId],\n        __group_by_sort: order,\n      };\n    });\n  }\n\n  function onReset() {\n    onDisplaySettingsReset();\n  }\n\n  return (\n    <Popover>\n      <Popover.Trigger asChild>\n        <Button\n          variant={\"outline\"}\n          color=\"neutral\"\n          size={\"small\"}\n          leadingIcon={<MixerHorizontalIcon />}\n        >\n          Display\n        </Button>\n      </Popover.Trigger>\n      <Popover.Content\n        className={styles[\"display-popover-content\"]}\n        align=\"end\"\n      >\n        <Flex direction={\"column\"}>\n          <Flex\n            direction={\"column\"}\n            className={styles[\"display-popover-properties-container\"]}\n            gap={5}\n          >\n            <Ordering\n              columnList={sortableColumns}\n              onChange={onSortChange}\n              value={tableQuery?.sort?.[0] || defaultSort}\n            />\n            <Grouping\n              columns={columns}\n              onChange={onGroupChange}\n              value={tableQuery?.group_by?.[0] || defaultGroupOption.id}\n            />\n          </Flex>\n          <Flex className={styles[\"display-popover-properties-container\"]}>\n            <DisplayProperties columns={columns} />\n          </Flex>\n          <Flex\n            justify={\"end\"}\n            className={styles[\"display-popover-reset-container\"]}\n          >\n            <Button variant={\"text\"} onClick={onReset}>\n              Reset to default\n            </Button>\n          </Flex>\n        </Flex>\n      </Popover.Content>\n    </Popover>\n  );\n}\n"],"names":["useDataTable","_jsxs","Popover","_jsx","Button","MixerHorizontalIcon","styles","Flex","Ordering","Grouping","defaultGroupOption","DisplayProperties"],"mappings":";;;;;;;;;;;;;;SAegB,eAAe,GAAA;AAC7B,IAAA,MAAM,EACJ,KAAK,EACL,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,sBAAsB,GACvB,GAAGA,yBAAY,EAAE,CAAC;AACnB,IAAA,MAAM,OAAO,GAAG,KAAK,EAAE,aAAa,EAAsC,CAAC;IAE3E,MAAM,eAAe,GAAG,OAAO;AAC7B,UAAE,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,SAAS,CAAC,aAAa,CAAC;AAC9C,UAAE,GAAG,CAAC,CAAC,MAAM,KAAI;AACf,QAAA,MAAM,EAAE,GAAG,MAAM,CAAC,EAAE,CAAC;QACrB,OAAO;AACL,YAAA,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,MAAM,IAAI,EAAE;AACpC,YAAA,EAAE,EAAE,EAAE;SACP,CAAC;AACJ,KAAC,CAAC,CAAC;AAEL,IAAA,SAAS,YAAY,CAAC,QAAgB,EAAE,KAAuB,EAAA;AAC7D,QAAA,gBAAgB,CAAC,CAAC,KAAK,KAAI;YACzB,OAAO;AACL,gBAAA,GAAG,KAAK;gBACR,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;aAClC,CAAC;AACJ,SAAC,CAAC,CAAC;KACJ;AAED,IAAA,SAAS,aAAa,CAAC,QAAgB,EAAE,KAAuB,EAAA;AAC9D,QAAA,gBAAgB,CAAC,CAAC,KAAK,KAAI;YACzB,OAAO;AACL,gBAAA,GAAG,KAAK;gBACR,QAAQ,EAAE,CAAC,QAAQ,CAAC;AACpB,gBAAA,eAAe,EAAE,KAAK;aACvB,CAAC;AACJ,SAAC,CAAC,CAAC;KACJ;AAED,IAAA,SAAS,OAAO,GAAA;AACd,QAAA,sBAAsB,EAAE,CAAC;KAC1B;AAED,IAAA,QACEC,iCAAC,CAAAC,eAAO,eACNC,gCAAC,CAAAD,eAAO,CAAC,OAAO,EAAA,EAAC,OAAO,EAAA,IAAA,EAAA,QAAA,EACtBC,iCAACC,aAAM,EAAA,EACL,OAAO,EAAE,SAAS,EAClB,KAAK,EAAC,SAAS,EACf,IAAI,EAAE,OAAO,EACb,WAAW,EAAED,iCAACE,kCAAmB,EAAA,EAAA,CAAG,EAG7B,QAAA,EAAA,SAAA,EAAA,CAAA,EAAA,CACO,EAClBF,gCAAC,CAAAD,eAAO,CAAC,OAAO,EAAA,EACd,SAAS,EAAEI,wBAAM,CAAC,yBAAyB,CAAC,EAC5C,KAAK,EAAC,KAAK,EAAA,QAAA,EAEXL,kCAACM,SAAI,EAAA,EAAC,SAAS,EAAE,QAAQ,EACvB,QAAA,EAAA,CAAAN,iCAAA,CAACM,SAAI,EACH,EAAA,SAAS,EAAE,QAAQ,EACnB,SAAS,EAAED,wBAAM,CAAC,sCAAsC,CAAC,EACzD,GAAG,EAAE,CAAC,EAAA,QAAA,EAAA,CAENH,iCAACK,iBAAQ,EAAA,EACP,UAAU,EAAE,eAAe,EAC3B,QAAQ,EAAE,YAAY,EACtB,KAAK,EAAE,UAAU,EAAE,IAAI,GAAG,CAAC,CAAC,IAAI,WAAW,EAAA,CAC3C,EACFL,gCAAA,CAACM,iBAAQ,EACP,EAAA,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,aAAa,EACvB,KAAK,EAAE,UAAU,EAAE,QAAQ,GAAG,CAAC,CAAC,IAAIC,kCAAkB,CAAC,EAAE,GACzD,CACG,EAAA,CAAA,EACPP,iCAACI,SAAI,EAAA,EAAC,SAAS,EAAED,wBAAM,CAAC,sCAAsC,CAAC,EAC7D,QAAA,EAAAH,gCAAA,CAACQ,mCAAiB,EAAC,EAAA,OAAO,EAAE,OAAO,EAAA,CAAI,EAClC,CAAA,EACPR,iCAACI,SAAI,EAAA,EACH,OAAO,EAAE,KAAK,EACd,SAAS,EAAED,wBAAM,CAAC,iCAAiC,CAAC,EAAA,QAAA,EAEpDH,iCAACC,aAAM,EAAA,EAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAEhC,QAAA,EAAA,kBAAA,EAAA,CAAA,EAAA,CACJ,IACF,EACS,CAAA,CAAA,EAAA,CACV,EACV;AACJ;;;;"}
+{"version":3,"file":"display-settings.cjs","sources":["../../../../../v1/components/data-table/components/display-settings.tsx"],"sourcesContent":["import { Flex } from \"../../flex\";\nimport styles from \"../data-table.module.css\";\nimport { Button } from \"../../button\";\nimport { Popover } from \"../../popover\";\nimport { MixerHorizontalIcon } from \"@radix-ui/react-icons\";\nimport { useDataTable } from \"../hooks/useDataTable\";\nimport {\n  DataTableColumn,\n  SortOrdersValues,\n  defaultGroupOption,\n} from \"../data-table.types\";\nimport { Ordering } from \"./ordering\";\nimport { Grouping } from \"./grouping\";\nimport { DisplayProperties } from \"./display-properties\";\n\nexport function DisplaySettings<TData, TValue>() {\n  const {\n    table,\n    updateTableQuery,\n    tableQuery,\n    defaultSort,\n    onDisplaySettingsReset,\n  } = useDataTable();\n  const columns = table?.getAllColumns() as DataTableColumn<TData, TValue>[];\n\n  const sortableColumns = columns\n    ?.filter((col) => col.columnDef.enableSorting)\n    ?.map((column) => {\n      const id = column.id;\n      return {\n        label: column.columnDef.header || id,\n        id: id,\n      };\n    });\n\n  function onSortChange(columnId: string, order: SortOrdersValues) {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        sort: [{ name: columnId, order }],\n      };\n    });\n  }\n\n  function onGroupChange(columnId: string) {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        group_by: [columnId],\n      };\n    });\n  }\n\n  function onGroupRemove() {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        group_by: [],\n      };\n    });\n  }\n\n  function onReset() {\n    onDisplaySettingsReset();\n  }\n\n  return (\n    <Popover>\n      <Popover.Trigger asChild>\n        <Button\n          variant={\"outline\"}\n          color=\"neutral\"\n          size={\"small\"}\n          leadingIcon={<MixerHorizontalIcon />}\n        >\n          Display\n        </Button>\n      </Popover.Trigger>\n      <Popover.Content\n        className={styles[\"display-popover-content\"]}\n        align=\"end\"\n      >\n        <Flex direction={\"column\"}>\n          <Flex\n            direction={\"column\"}\n            className={styles[\"display-popover-properties-container\"]}\n            gap={5}\n          >\n            <Ordering\n              columnList={sortableColumns}\n              onChange={onSortChange}\n              value={tableQuery?.sort?.[0] || defaultSort}\n            />\n            <Grouping\n              columns={columns}\n              onRemove={onGroupRemove}\n              onChange={onGroupChange}\n              value={tableQuery?.group_by?.[0] || defaultGroupOption.id}\n            />\n          </Flex>\n          <Flex className={styles[\"display-popover-properties-container\"]}>\n            <DisplayProperties columns={columns} />\n          </Flex>\n          <Flex\n            justify={\"end\"}\n            className={styles[\"display-popover-reset-container\"]}\n          >\n            <Button variant={\"text\"} onClick={onReset}>\n              Reset to default\n            </Button>\n          </Flex>\n        </Flex>\n      </Popover.Content>\n    </Popover>\n  );\n}\n"],"names":["useDataTable","_jsxs","Popover","_jsx","Button","MixerHorizontalIcon","styles","Flex","Ordering","Grouping","defaultGroupOption","DisplayProperties"],"mappings":"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"}

package/dist/v1/components/data-table/components/display-settings.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-settings.d.ts","sourceRoot":"","sources":["../../../../../v1/components/data-table/components/display-settings.tsx"],"names":[],"mappings":"AAeA,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,6CA2F5C"}
+{"version":3,"file":"display-settings.d.ts","sourceRoot":"","sources":["../../../../../v1/components/data-table/components/display-settings.tsx"],"names":[],"mappings":"AAeA,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,6CAoG5C"}

package/dist/v1/components/data-table/components/display-settings.js

@@ -30,19 +30,26 @@ function DisplaySettings() {
             };
         });
     }
-    function onGroupChange(columnId, order) {
+    function onGroupChange(columnId) {
         updateTableQuery((query) => {
             return {
                 ...query,
                 group_by: [columnId],
-                __group_by_sort: order,
+            };
+        });
+    }
+    function onGroupRemove() {
+        updateTableQuery((query) => {
+            return {
+                ...query,
+                group_by: [],
             };
         });
     }
     function onReset() {
         onDisplaySettingsReset();
     }
-    return (jsxRuntimeExports.jsxs(Popover, { children: [jsxRuntimeExports.jsx(Popover.Trigger, { asChild: true, children: jsxRuntimeExports.jsx(Button, { variant: "outline", color: "neutral", size: "small", leadingIcon: jsxRuntimeExports.jsx(MixerHorizontalIcon, {}), children: "Display" }) }), jsxRuntimeExports.jsx(Popover.Content, { className: styles["display-popover-content"], align: "end", children: jsxRuntimeExports.jsxs(Flex, { direction: "column", children: [jsxRuntimeExports.jsxs(Flex, { direction: "column", className: styles["display-popover-properties-container"], gap: 5, children: [jsxRuntimeExports.jsx(Ordering, { columnList: sortableColumns, onChange: onSortChange, value: tableQuery?.sort?.[0] || defaultSort }), jsxRuntimeExports.jsx(Grouping, { columns: columns, onChange: onGroupChange, value: tableQuery?.group_by?.[0] || defaultGroupOption.id })] }), jsxRuntimeExports.jsx(Flex, { className: styles["display-popover-properties-container"], children: jsxRuntimeExports.jsx(DisplayProperties, { columns: columns }) }), jsxRuntimeExports.jsx(Flex, { justify: "end", className: styles["display-popover-reset-container"], children: jsxRuntimeExports.jsx(Button, { variant: "text", onClick: onReset, children: "Reset to default" }) })] }) })] }));
+    return (jsxRuntimeExports.jsxs(Popover, { children: [jsxRuntimeExports.jsx(Popover.Trigger, { asChild: true, children: jsxRuntimeExports.jsx(Button, { variant: "outline", color: "neutral", size: "small", leadingIcon: jsxRuntimeExports.jsx(MixerHorizontalIcon, {}), children: "Display" }) }), jsxRuntimeExports.jsx(Popover.Content, { className: styles["display-popover-content"], align: "end", children: jsxRuntimeExports.jsxs(Flex, { direction: "column", children: [jsxRuntimeExports.jsxs(Flex, { direction: "column", className: styles["display-popover-properties-container"], gap: 5, children: [jsxRuntimeExports.jsx(Ordering, { columnList: sortableColumns, onChange: onSortChange, value: tableQuery?.sort?.[0] || defaultSort }), jsxRuntimeExports.jsx(Grouping, { columns: columns, onRemove: onGroupRemove, onChange: onGroupChange, value: tableQuery?.group_by?.[0] || defaultGroupOption.id })] }), jsxRuntimeExports.jsx(Flex, { className: styles["display-popover-properties-container"], children: jsxRuntimeExports.jsx(DisplayProperties, { columns: columns }) }), jsxRuntimeExports.jsx(Flex, { justify: "end", className: styles["display-popover-reset-container"], children: jsxRuntimeExports.jsx(Button, { variant: "text", onClick: onReset, children: "Reset to default" }) })] }) })] }));
 }
 
 export { DisplaySettings };

package/dist/v1/components/data-table/components/display-settings.js.map

@@ -1 +1 @@
-{"version":3,"file":"display-settings.js","sources":["../../../../../v1/components/data-table/components/display-settings.tsx"],"sourcesContent":["import { Flex } from \"../../flex\";\nimport styles from \"../data-table.module.css\";\nimport { Button } from \"../../button\";\nimport { Popover } from \"../../popover\";\nimport { MixerHorizontalIcon } from \"@radix-ui/react-icons\";\nimport { useDataTable } from \"../hooks/useDataTable\";\nimport {\n  DataTableColumn,\n  SortOrdersValues,\n  defaultGroupOption,\n} from \"../data-table.types\";\nimport { Ordering } from \"./ordering\";\nimport { Grouping } from \"./grouping\";\nimport { DisplayProperties } from \"./display-properties\";\n\nexport function DisplaySettings<TData, TValue>() {\n  const {\n    table,\n    updateTableQuery,\n    tableQuery,\n    defaultSort,\n    onDisplaySettingsReset,\n  } = useDataTable();\n  const columns = table?.getAllColumns() as DataTableColumn<TData, TValue>[];\n\n  const sortableColumns = columns\n    ?.filter((col) => col.columnDef.enableSorting)\n    ?.map((column) => {\n      const id = column.id;\n      return {\n        label: column.columnDef.header || id,\n        id: id,\n      };\n    });\n\n  function onSortChange(columnId: string, order: SortOrdersValues) {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        sort: [{ name: columnId, order }],\n      };\n    });\n  }\n\n  function onGroupChange(columnId: string, order: SortOrdersValues) {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        group_by: [columnId],\n        __group_by_sort: order,\n      };\n    });\n  }\n\n  function onReset() {\n    onDisplaySettingsReset();\n  }\n\n  return (\n    <Popover>\n      <Popover.Trigger asChild>\n        <Button\n          variant={\"outline\"}\n          color=\"neutral\"\n          size={\"small\"}\n          leadingIcon={<MixerHorizontalIcon />}\n        >\n          Display\n        </Button>\n      </Popover.Trigger>\n      <Popover.Content\n        className={styles[\"display-popover-content\"]}\n        align=\"end\"\n      >\n        <Flex direction={\"column\"}>\n          <Flex\n            direction={\"column\"}\n            className={styles[\"display-popover-properties-container\"]}\n            gap={5}\n          >\n            <Ordering\n              columnList={sortableColumns}\n              onChange={onSortChange}\n              value={tableQuery?.sort?.[0] || defaultSort}\n            />\n            <Grouping\n              columns={columns}\n              onChange={onGroupChange}\n              value={tableQuery?.group_by?.[0] || defaultGroupOption.id}\n            />\n          </Flex>\n          <Flex className={styles[\"display-popover-properties-container\"]}>\n            <DisplayProperties columns={columns} />\n          </Flex>\n          <Flex\n            justify={\"end\"}\n            className={styles[\"display-popover-reset-container\"]}\n          >\n            <Button variant={\"text\"} onClick={onReset}>\n              Reset to default\n            </Button>\n          </Flex>\n        </Flex>\n      </Popover.Content>\n    </Popover>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;;SAegB,eAAe,GAAA;AAC7B,IAAA,MAAM,EACJ,KAAK,EACL,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,sBAAsB,GACvB,GAAG,YAAY,EAAE,CAAC;AACnB,IAAA,MAAM,OAAO,GAAG,KAAK,EAAE,aAAa,EAAsC,CAAC;IAE3E,MAAM,eAAe,GAAG,OAAO;AAC7B,UAAE,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,SAAS,CAAC,aAAa,CAAC;AAC9C,UAAE,GAAG,CAAC,CAAC,MAAM,KAAI;AACf,QAAA,MAAM,EAAE,GAAG,MAAM,CAAC,EAAE,CAAC;QACrB,OAAO;AACL,YAAA,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,MAAM,IAAI,EAAE;AACpC,YAAA,EAAE,EAAE,EAAE;SACP,CAAC;AACJ,KAAC,CAAC,CAAC;AAEL,IAAA,SAAS,YAAY,CAAC,QAAgB,EAAE,KAAuB,EAAA;AAC7D,QAAA,gBAAgB,CAAC,CAAC,KAAK,KAAI;YACzB,OAAO;AACL,gBAAA,GAAG,KAAK;gBACR,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;aAClC,CAAC;AACJ,SAAC,CAAC,CAAC;KACJ;AAED,IAAA,SAAS,aAAa,CAAC,QAAgB,EAAE,KAAuB,EAAA;AAC9D,QAAA,gBAAgB,CAAC,CAAC,KAAK,KAAI;YACzB,OAAO;AACL,gBAAA,GAAG,KAAK;gBACR,QAAQ,EAAE,CAAC,QAAQ,CAAC;AACpB,gBAAA,eAAe,EAAE,KAAK;aACvB,CAAC;AACJ,SAAC,CAAC,CAAC;KACJ;AAED,IAAA,SAAS,OAAO,GAAA;AACd,QAAA,sBAAsB,EAAE,CAAC;KAC1B;AAED,IAAA,QACEA,sBAAC,CAAA,OAAO,eACNC,qBAAC,CAAA,OAAO,CAAC,OAAO,EAAA,EAAC,OAAO,EAAA,IAAA,EAAA,QAAA,EACtBA,sBAAC,MAAM,EAAA,EACL,OAAO,EAAE,SAAS,EAClB,KAAK,EAAC,SAAS,EACf,IAAI,EAAE,OAAO,EACb,WAAW,EAAEA,sBAAC,mBAAmB,EAAA,EAAA,CAAG,EAG7B,QAAA,EAAA,SAAA,EAAA,CAAA,EAAA,CACO,EAClBA,qBAAC,CAAA,OAAO,CAAC,OAAO,EAAA,EACd,SAAS,EAAE,MAAM,CAAC,yBAAyB,CAAC,EAC5C,KAAK,EAAC,KAAK,EAAA,QAAA,EAEXD,uBAAC,IAAI,EAAA,EAAC,SAAS,EAAE,QAAQ,EACvB,QAAA,EAAA,CAAAA,sBAAA,CAAC,IAAI,EACH,EAAA,SAAS,EAAE,QAAQ,EACnB,SAAS,EAAE,MAAM,CAAC,sCAAsC,CAAC,EACzD,GAAG,EAAE,CAAC,EAAA,QAAA,EAAA,CAENC,sBAAC,QAAQ,EAAA,EACP,UAAU,EAAE,eAAe,EAC3B,QAAQ,EAAE,YAAY,EACtB,KAAK,EAAE,UAAU,EAAE,IAAI,GAAG,CAAC,CAAC,IAAI,WAAW,EAAA,CAC3C,EACFA,qBAAA,CAAC,QAAQ,EACP,EAAA,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,aAAa,EACvB,KAAK,EAAE,UAAU,EAAE,QAAQ,GAAG,CAAC,CAAC,IAAI,kBAAkB,CAAC,EAAE,GACzD,CACG,EAAA,CAAA,EACPA,sBAAC,IAAI,EAAA,EAAC,SAAS,EAAE,MAAM,CAAC,sCAAsC,CAAC,EAC7D,QAAA,EAAAA,qBAAA,CAAC,iBAAiB,EAAC,EAAA,OAAO,EAAE,OAAO,EAAA,CAAI,EAClC,CAAA,EACPA,sBAAC,IAAI,EAAA,EACH,OAAO,EAAE,KAAK,EACd,SAAS,EAAE,MAAM,CAAC,iCAAiC,CAAC,EAAA,QAAA,EAEpDA,sBAAC,MAAM,EAAA,EAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAEhC,QAAA,EAAA,kBAAA,EAAA,CAAA,EAAA,CACJ,IACF,EACS,CAAA,CAAA,EAAA,CACV,EACV;AACJ;;;;"}
+{"version":3,"file":"display-settings.js","sources":["../../../../../v1/components/data-table/components/display-settings.tsx"],"sourcesContent":["import { Flex } from \"../../flex\";\nimport styles from \"../data-table.module.css\";\nimport { Button } from \"../../button\";\nimport { Popover } from \"../../popover\";\nimport { MixerHorizontalIcon } from \"@radix-ui/react-icons\";\nimport { useDataTable } from \"../hooks/useDataTable\";\nimport {\n  DataTableColumn,\n  SortOrdersValues,\n  defaultGroupOption,\n} from \"../data-table.types\";\nimport { Ordering } from \"./ordering\";\nimport { Grouping } from \"./grouping\";\nimport { DisplayProperties } from \"./display-properties\";\n\nexport function DisplaySettings<TData, TValue>() {\n  const {\n    table,\n    updateTableQuery,\n    tableQuery,\n    defaultSort,\n    onDisplaySettingsReset,\n  } = useDataTable();\n  const columns = table?.getAllColumns() as DataTableColumn<TData, TValue>[];\n\n  const sortableColumns = columns\n    ?.filter((col) => col.columnDef.enableSorting)\n    ?.map((column) => {\n      const id = column.id;\n      return {\n        label: column.columnDef.header || id,\n        id: id,\n      };\n    });\n\n  function onSortChange(columnId: string, order: SortOrdersValues) {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        sort: [{ name: columnId, order }],\n      };\n    });\n  }\n\n  function onGroupChange(columnId: string) {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        group_by: [columnId],\n      };\n    });\n  }\n\n  function onGroupRemove() {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        group_by: [],\n      };\n    });\n  }\n\n  function onReset() {\n    onDisplaySettingsReset();\n  }\n\n  return (\n    <Popover>\n      <Popover.Trigger asChild>\n        <Button\n          variant={\"outline\"}\n          color=\"neutral\"\n          size={\"small\"}\n          leadingIcon={<MixerHorizontalIcon />}\n        >\n          Display\n        </Button>\n      </Popover.Trigger>\n      <Popover.Content\n        className={styles[\"display-popover-content\"]}\n        align=\"end\"\n      >\n        <Flex direction={\"column\"}>\n          <Flex\n            direction={\"column\"}\n            className={styles[\"display-popover-properties-container\"]}\n            gap={5}\n          >\n            <Ordering\n              columnList={sortableColumns}\n              onChange={onSortChange}\n              value={tableQuery?.sort?.[0] || defaultSort}\n            />\n            <Grouping\n              columns={columns}\n              onRemove={onGroupRemove}\n              onChange={onGroupChange}\n              value={tableQuery?.group_by?.[0] || defaultGroupOption.id}\n            />\n          </Flex>\n          <Flex className={styles[\"display-popover-properties-container\"]}>\n            <DisplayProperties columns={columns} />\n          </Flex>\n          <Flex\n            justify={\"end\"}\n            className={styles[\"display-popover-reset-container\"]}\n          >\n            <Button variant={\"text\"} onClick={onReset}>\n              Reset to default\n            </Button>\n          </Flex>\n        </Flex>\n      </Popover.Content>\n    </Popover>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/v1/components/data-table/components/grouping.cjs

@@ -7,7 +7,7 @@ var text = require('../../text/text.cjs');
 var select = require('../../select/select.cjs');
 var dataTable_types = require('../data-table.types.cjs');
 
-function Grouping({ columns = [], onChange, value, }) {
+function Grouping({ columns = [], onChange, onRemove, value, }) {
     const columnList = columns
         .filter((column) => column.columnDef.enableGrouping)
         ?.map((column) => {
@@ -18,9 +18,13 @@ function Grouping({ columns = [], onChange, value, }) {
         };
     });
     const handleGroupChange = (columnId) => {
+        if (columnId === dataTable_types.defaultGroupOption.id) {
+            onRemove();
+            return;
+        }
         const column = columns.find((col) => col.id === columnId);
         if (column) {
-            onChange(column.id, column.columnDef.groupSortOrder || dataTable_types.SortOrders.ASC);
+            onChange(column.id);
         }
     };
     return (jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { justify: "between", align: "center", children: [jsxRuntime.jsxRuntimeExports.jsx(text.Text, { size: 2, weight: 500, className: dataTable_module.default["flex-1"], children: "Grouping" }), jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { className: dataTable_module.default["flex-1"], children: jsxRuntime.jsxRuntimeExports.jsxs(select.Select, { onValueChange: handleGroupChange, value: value, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Trigger, { size: "small", className: dataTable_module.default["display-popover-properties-select"], children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, { placeholder: "Select value" }) }), jsxRuntime.jsxRuntimeExports.jsxs(select.Select.Content, { "data-variant": "filter", children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: dataTable_types.defaultGroupOption.id, children: dataTable_types.defaultGroupOption.label }), columnList.map((column) => (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: column.id, children: column.label }, column.id)))] })] }) })] }));

package/dist/v1/components/data-table/components/grouping.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"grouping.cjs","sources":["../../../../../v1/components/data-table/components/grouping.tsx"],"sourcesContent":["import { Flex } from \"../../flex\";\nimport styles from \"../data-table.module.css\";\nimport { Text } from \"../../text\";\nimport { Select } from \"../../select\";\nimport {\n  DataTableColumn,\n  SortOrders,\n  SortOrdersValues,\n  defaultGroupOption,\n} from \"../data-table.types\";\n\ninterface GroupingProps<TData, TValue> {\n  columns: DataTableColumn<TData, TValue>[];\n  onChange: (columnId: string, order: SortOrdersValues) => void;\n  value: string;\n}\n\nexport function Grouping<TData, TValue>({\n  columns = [],\n  onChange,\n  value,\n}: GroupingProps<TData, TValue>) {\n  const columnList = columns\n    .filter((column) => column.columnDef.enableGrouping)\n    ?.map((column) => {\n      const id = column.id;\n      return {\n        label: column.columnDef.header || id,\n        id: id,\n      };\n    });\n\n  const handleGroupChange = (columnId: string) => {\n    const column = columns.find((col) => col.id === columnId);\n    if (column) {\n      onChange(column.id, column.columnDef.groupSortOrder || SortOrders.ASC);\n    }\n  };\n\n  return (\n    <Flex justify=\"between\" align=\"center\">\n      <Text size={2} weight={500} className={styles[\"flex-1\"]}>\n        Grouping\n      </Text>\n      <Flex className={styles[\"flex-1\"]}>\n        <Select onValueChange={handleGroupChange} value={value}>\n          <Select.Trigger\n            size={\"small\"}\n            className={styles[\"display-popover-properties-select\"]}\n          >\n            <Select.Value placeholder=\"Select value\" />\n          </Select.Trigger>\n          <Select.Content data-variant=\"filter\">\n            <Select.Item value={defaultGroupOption.id}>\n              {defaultGroupOption.label}\n            </Select.Item>\n            {columnList.map((column) => (\n              <Select.Item key={column.id} value={column.id}>\n                {column.label}\n              </Select.Item>\n            ))}\n          </Select.Content>\n        </Select>\n      </Flex>\n    </Flex>\n  );\n}\n"],"names":["SortOrders","_jsxs","Flex","_jsx","Text","styles","Select","defaultGroupOption"],"mappings":";;;;;;;;;AAiBM,SAAU,QAAQ,CAAgB,EACtC,OAAO,GAAG,EAAE,EACZ,QAAQ,EACR,KAAK,GACwB,EAAA;IAC7B,MAAM,UAAU,GAAG,OAAO;SACvB,MAAM,CAAC,CAAC,MAAM,KAAK,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;AACpD,UAAE,GAAG,CAAC,CAAC,MAAM,KAAI;AACf,QAAA,MAAM,EAAE,GAAG,MAAM,CAAC,EAAE,CAAC;QACrB,OAAO;AACL,YAAA,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,MAAM,IAAI,EAAE;AACpC,YAAA,EAAE,EAAE,EAAE;SACP,CAAC;AACJ,KAAC,CAAC,CAAC;AAEL,IAAA,MAAM,iBAAiB,GAAG,CAAC,QAAgB,KAAI;AAC7C,QAAA,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC;QAC1D,IAAI,MAAM,EAAE;AACV,YAAA,QAAQ,CAAC,MAAM,CAAC,EAAE,EAAE,MAAM,CAAC,SAAS,CAAC,cAAc,IAAIA,0BAAU,CAAC,GAAG,CAAC,CAAC;SACxE;AACH,KAAC,CAAC;AAEF,IAAA,QACEC,iCAAA,CAACC,SAAI,EAAA,EAAC,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAA,QAAA,EAAA,CACpCC,iCAACC,SAAI,EAAA,EAAC,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,SAAS,EAAEC,wBAAM,CAAC,QAAQ,CAAC,EAAA,QAAA,EAAA,UAAA,EAAA,CAEhD,EACPF,gCAAC,CAAAD,SAAI,EAAC,EAAA,SAAS,EAAEG,wBAAM,CAAC,QAAQ,CAAC,EAC/B,QAAA,EAAAJ,iCAAA,CAACK,aAAM,EAAA,EAAC,aAAa,EAAE,iBAAiB,EAAE,KAAK,EAAE,KAAK,EACpD,QAAA,EAAA,CAAAH,gCAAA,CAACG,aAAM,CAAC,OAAO,EAAA,EACb,IAAI,EAAE,OAAO,EACb,SAAS,EAAED,wBAAM,CAAC,mCAAmC,CAAC,EAEtD,QAAA,EAAAF,gCAAA,CAACG,aAAM,CAAC,KAAK,EAAA,EAAC,WAAW,EAAC,cAAc,EAAA,CAAG,EAC5B,CAAA,EACjBL,iCAAC,CAAAK,aAAM,CAAC,OAAO,oBAAc,QAAQ,EAAA,QAAA,EAAA,CACnCH,gCAAC,CAAAG,aAAM,CAAC,IAAI,EAAC,EAAA,KAAK,EAAEC,kCAAkB,CAAC,EAAE,EAAA,QAAA,EACtCA,kCAAkB,CAAC,KAAK,EAAA,CACb,EACb,UAAU,CAAC,GAAG,CAAC,CAAC,MAAM,MACrBJ,gCAAA,CAACG,aAAM,CAAC,IAAI,EAAA,EAAiB,KAAK,EAAE,MAAM,CAAC,EAAE,EAC1C,QAAA,EAAA,MAAM,CAAC,KAAK,EADG,EAAA,MAAM,CAAC,EAAE,CAEb,CACf,CAAC,CACa,EAAA,CAAA,CAAA,EAAA,CACV,EACJ,CAAA,CAAA,EAAA,CACF,EACP;AACJ;;;;"}
+{"version":3,"file":"grouping.cjs","sources":["../../../../../v1/components/data-table/components/grouping.tsx"],"sourcesContent":["import { Flex } from \"../../flex\";\nimport styles from \"../data-table.module.css\";\nimport { Text } from \"../../text\";\nimport { Select } from \"../../select\";\nimport { DataTableColumn, defaultGroupOption } from \"../data-table.types\";\n\ninterface GroupingProps<TData, TValue> {\n  columns: DataTableColumn<TData, TValue>[];\n  onChange: (columnId: string) => void;\n  onRemove: () => void;\n  value: string;\n}\n\nexport function Grouping<TData, TValue>({\n  columns = [],\n  onChange,\n  onRemove,\n  value,\n}: GroupingProps<TData, TValue>) {\n  const columnList = columns\n    .filter((column) => column.columnDef.enableGrouping)\n    ?.map((column) => {\n      const id = column.id;\n      return {\n        label: column.columnDef.header || id,\n        id: id,\n      };\n    });\n\n  const handleGroupChange = (columnId: string) => {\n    if (columnId === defaultGroupOption.id) {\n      onRemove();\n      return;\n    }\n    const column = columns.find((col) => col.id === columnId);\n    if (column) {\n      onChange(column.id);\n    }\n  };\n\n  return (\n    <Flex justify=\"between\" align=\"center\">\n      <Text size={2} weight={500} className={styles[\"flex-1\"]}>\n        Grouping\n      </Text>\n      <Flex className={styles[\"flex-1\"]}>\n        <Select onValueChange={handleGroupChange} value={value}>\n          <Select.Trigger\n            size={\"small\"}\n            className={styles[\"display-popover-properties-select\"]}\n          >\n            <Select.Value placeholder=\"Select value\" />\n          </Select.Trigger>\n          <Select.Content data-variant=\"filter\">\n            <Select.Item value={defaultGroupOption.id}>\n              {defaultGroupOption.label}\n            </Select.Item>\n            {columnList.map((column) => (\n              <Select.Item key={column.id} value={column.id}>\n                {column.label}\n              </Select.Item>\n            ))}\n          </Select.Content>\n        </Select>\n      </Flex>\n    </Flex>\n  );\n}\n"],"names":["defaultGroupOption","_jsxs","Flex","_jsx","Text","styles","Select"],"mappings":";;;;;;;;;AAagB,SAAA,QAAQ,CAAgB,EACtC,OAAO,GAAG,EAAE,EACZ,QAAQ,EACR,QAAQ,EACR,KAAK,GACwB,EAAA;IAC7B,MAAM,UAAU,GAAG,OAAO;SACvB,MAAM,CAAC,CAAC,MAAM,KAAK,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;AACpD,UAAE,GAAG,CAAC,CAAC,MAAM,KAAI;AACf,QAAA,MAAM,EAAE,GAAG,MAAM,CAAC,EAAE,CAAC;QACrB,OAAO;AACL,YAAA,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,MAAM,IAAI,EAAE;AACpC,YAAA,EAAE,EAAE,EAAE;SACP,CAAC;AACJ,KAAC,CAAC,CAAC;AAEL,IAAA,MAAM,iBAAiB,GAAG,CAAC,QAAgB,KAAI;AAC7C,QAAA,IAAI,QAAQ,KAAKA,kCAAkB,CAAC,EAAE,EAAE;AACtC,YAAA,QAAQ,EAAE,CAAC;YACX,OAAO;SACR;AACD,QAAA,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC;QAC1D,IAAI,MAAM,EAAE;AACV,YAAA,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;SACrB;AACH,KAAC,CAAC;AAEF,IAAA,QACEC,iCAAA,CAACC,SAAI,EAAA,EAAC,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAA,QAAA,EAAA,CACpCC,iCAACC,SAAI,EAAA,EAAC,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,SAAS,EAAEC,wBAAM,CAAC,QAAQ,CAAC,EAAA,QAAA,EAAA,UAAA,EAAA,CAEhD,EACPF,gCAAC,CAAAD,SAAI,EAAC,EAAA,SAAS,EAAEG,wBAAM,CAAC,QAAQ,CAAC,EAC/B,QAAA,EAAAJ,iCAAA,CAACK,aAAM,EAAA,EAAC,aAAa,EAAE,iBAAiB,EAAE,KAAK,EAAE,KAAK,EACpD,QAAA,EAAA,CAAAH,gCAAA,CAACG,aAAM,CAAC,OAAO,EAAA,EACb,IAAI,EAAE,OAAO,EACb,SAAS,EAAED,wBAAM,CAAC,mCAAmC,CAAC,EAEtD,QAAA,EAAAF,gCAAA,CAACG,aAAM,CAAC,KAAK,EAAA,EAAC,WAAW,EAAC,cAAc,EAAA,CAAG,EAC5B,CAAA,EACjBL,iCAAC,CAAAK,aAAM,CAAC,OAAO,oBAAc,QAAQ,EAAA,QAAA,EAAA,CACnCH,gCAAC,CAAAG,aAAM,CAAC,IAAI,EAAC,EAAA,KAAK,EAAEN,kCAAkB,CAAC,EAAE,EAAA,QAAA,EACtCA,kCAAkB,CAAC,KAAK,EAAA,CACb,EACb,UAAU,CAAC,GAAG,CAAC,CAAC,MAAM,MACrBG,gCAAA,CAACG,aAAM,CAAC,IAAI,EAAA,EAAiB,KAAK,EAAE,MAAM,CAAC,EAAE,EAC1C,QAAA,EAAA,MAAM,CAAC,KAAK,EADG,EAAA,MAAM,CAAC,EAAE,CAEb,CACf,CAAC,CACa,EAAA,CAAA,CAAA,EAAA,CACV,EACJ,CAAA,CAAA,EAAA,CACF,EACP;AACJ;;;;"}

package/dist/v1/components/data-table/components/grouping.d.ts

@@ -1,9 +1,10 @@
-import { DataTableColumn, SortOrdersValues } from "../data-table.types";
+import { DataTableColumn } from "../data-table.types";
 interface GroupingProps<TData, TValue> {
     columns: DataTableColumn<TData, TValue>[];
-    onChange: (columnId: string, order: SortOrdersValues) => void;
+    onChange: (columnId: string) => void;
+    onRemove: () => void;
     value: string;
 }
-export declare function Grouping<TData, TValue>({ columns, onChange, value, }: GroupingProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
+export declare function Grouping<TData, TValue>({ columns, onChange, onRemove, value, }: GroupingProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=grouping.d.ts.map

package/dist/v1/components/data-table/components/grouping.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"grouping.d.ts","sourceRoot":"","sources":["../../../../../v1/components/data-table/components/grouping.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,eAAe,EAEf,gBAAgB,EAEjB,MAAM,qBAAqB,CAAC;AAE7B,UAAU,aAAa,CAAC,KAAK,EAAE,MAAM;IACnC,OAAO,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,CAAC,EAAE,CAAC;IAC1C,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC9D,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,EACtC,OAAY,EACZ,QAAQ,EACR,KAAK,GACN,EAAE,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,2CA6C9B"}
+{"version":3,"file":"grouping.d.ts","sourceRoot":"","sources":["../../../../../v1/components/data-table/components/grouping.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,eAAe,EAAsB,MAAM,qBAAqB,CAAC;AAE1E,UAAU,aAAa,CAAC,KAAK,EAAE,MAAM;IACnC,OAAO,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,CAAC,EAAE,CAAC;IAC1C,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,EACtC,OAAY,EACZ,QAAQ,EACR,QAAQ,EACR,KAAK,GACN,EAAE,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,2CAiD9B"}

package/dist/v1/components/data-table/components/grouping.js

@@ -3,9 +3,9 @@ import { Flex } from '../../flex/flex.js';
 import styles from '../data-table.module.css.js';
 import { Text } from '../../text/text.js';
 import { Select } from '../../select/select.js';
-import { defaultGroupOption, SortOrders } from '../data-table.types.js';
+import { defaultGroupOption } from '../data-table.types.js';
 
-function Grouping({ columns = [], onChange, value, }) {
+function Grouping({ columns = [], onChange, onRemove, value, }) {
     const columnList = columns
         .filter((column) => column.columnDef.enableGrouping)
         ?.map((column) => {
@@ -16,9 +16,13 @@ function Grouping({ columns = [], onChange, value, }) {
         };
     });
     const handleGroupChange = (columnId) => {
+        if (columnId === defaultGroupOption.id) {
+            onRemove();
+            return;
+        }
         const column = columns.find((col) => col.id === columnId);
         if (column) {
-            onChange(column.id, column.columnDef.groupSortOrder || SortOrders.ASC);
+            onChange(column.id);
         }
     };
     return (jsxRuntimeExports.jsxs(Flex, { justify: "between", align: "center", children: [jsxRuntimeExports.jsx(Text, { size: 2, weight: 500, className: styles["flex-1"], children: "Grouping" }), jsxRuntimeExports.jsx(Flex, { className: styles["flex-1"], children: jsxRuntimeExports.jsxs(Select, { onValueChange: handleGroupChange, value: value, children: [jsxRuntimeExports.jsx(Select.Trigger, { size: "small", className: styles["display-popover-properties-select"], children: jsxRuntimeExports.jsx(Select.Value, { placeholder: "Select value" }) }), jsxRuntimeExports.jsxs(Select.Content, { "data-variant": "filter", children: [jsxRuntimeExports.jsx(Select.Item, { value: defaultGroupOption.id, children: defaultGroupOption.label }), columnList.map((column) => (jsxRuntimeExports.jsx(Select.Item, { value: column.id, children: column.label }, column.id)))] })] }) })] }));

package/dist/v1/components/data-table/components/grouping.js.map

@@ -1 +1 @@
-{"version":3,"file":"grouping.js","sources":["../../../../../v1/components/data-table/components/grouping.tsx"],"sourcesContent":["import { Flex } from \"../../flex\";\nimport styles from \"../data-table.module.css\";\nimport { Text } from \"../../text\";\nimport { Select } from \"../../select\";\nimport {\n  DataTableColumn,\n  SortOrders,\n  SortOrdersValues,\n  defaultGroupOption,\n} from \"../data-table.types\";\n\ninterface GroupingProps<TData, TValue> {\n  columns: DataTableColumn<TData, TValue>[];\n  onChange: (columnId: string, order: SortOrdersValues) => void;\n  value: string;\n}\n\nexport function Grouping<TData, TValue>({\n  columns = [],\n  onChange,\n  value,\n}: GroupingProps<TData, TValue>) {\n  const columnList = columns\n    .filter((column) => column.columnDef.enableGrouping)\n    ?.map((column) => {\n      const id = column.id;\n      return {\n        label: column.columnDef.header || id,\n        id: id,\n      };\n    });\n\n  const handleGroupChange = (columnId: string) => {\n    const column = columns.find((col) => col.id === columnId);\n    if (column) {\n      onChange(column.id, column.columnDef.groupSortOrder || SortOrders.ASC);\n    }\n  };\n\n  return (\n    <Flex justify=\"between\" align=\"center\">\n      <Text size={2} weight={500} className={styles[\"flex-1\"]}>\n        Grouping\n      </Text>\n      <Flex className={styles[\"flex-1\"]}>\n        <Select onValueChange={handleGroupChange} value={value}>\n          <Select.Trigger\n            size={\"small\"}\n            className={styles[\"display-popover-properties-select\"]}\n          >\n            <Select.Value placeholder=\"Select value\" />\n          </Select.Trigger>\n          <Select.Content data-variant=\"filter\">\n            <Select.Item value={defaultGroupOption.id}>\n              {defaultGroupOption.label}\n            </Select.Item>\n            {columnList.map((column) => (\n              <Select.Item key={column.id} value={column.id}>\n                {column.label}\n              </Select.Item>\n            ))}\n          </Select.Content>\n        </Select>\n      </Flex>\n    </Flex>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;AAiBM,SAAU,QAAQ,CAAgB,EACtC,OAAO,GAAG,EAAE,EACZ,QAAQ,EACR,KAAK,GACwB,EAAA;IAC7B,MAAM,UAAU,GAAG,OAAO;SACvB,MAAM,CAAC,CAAC,MAAM,KAAK,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;AACpD,UAAE,GAAG,CAAC,CAAC,MAAM,KAAI;AACf,QAAA,MAAM,EAAE,GAAG,MAAM,CAAC,EAAE,CAAC;QACrB,OAAO;AACL,YAAA,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,MAAM,IAAI,EAAE;AACpC,YAAA,EAAE,EAAE,EAAE;SACP,CAAC;AACJ,KAAC,CAAC,CAAC;AAEL,IAAA,MAAM,iBAAiB,GAAG,CAAC,QAAgB,KAAI;AAC7C,QAAA,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC;QAC1D,IAAI,MAAM,EAAE;AACV,YAAA,QAAQ,CAAC,MAAM,CAAC,EAAE,EAAE,MAAM,CAAC,SAAS,CAAC,cAAc,IAAI,UAAU,CAAC,GAAG,CAAC,CAAC;SACxE;AACH,KAAC,CAAC;AAEF,IAAA,QACEA,sBAAA,CAAC,IAAI,EAAA,EAAC,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAA,QAAA,EAAA,CACpCC,sBAAC,IAAI,EAAA,EAAC,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,CAAC,QAAQ,CAAC,EAAA,QAAA,EAAA,UAAA,EAAA,CAEhD,EACPA,qBAAC,CAAA,IAAI,EAAC,EAAA,SAAS,EAAE,MAAM,CAAC,QAAQ,CAAC,EAC/B,QAAA,EAAAD,sBAAA,CAAC,MAAM,EAAA,EAAC,aAAa,EAAE,iBAAiB,EAAE,KAAK,EAAE,KAAK,EACpD,QAAA,EAAA,CAAAC,qBAAA,CAAC,MAAM,CAAC,OAAO,EAAA,EACb,IAAI,EAAE,OAAO,EACb,SAAS,EAAE,MAAM,CAAC,mCAAmC,CAAC,EAEtD,QAAA,EAAAA,qBAAA,CAAC,MAAM,CAAC,KAAK,EAAA,EAAC,WAAW,EAAC,cAAc,EAAA,CAAG,EAC5B,CAAA,EACjBD,sBAAC,CAAA,MAAM,CAAC,OAAO,oBAAc,QAAQ,EAAA,QAAA,EAAA,CACnCC,qBAAC,CAAA,MAAM,CAAC,IAAI,EAAC,EAAA,KAAK,EAAE,kBAAkB,CAAC,EAAE,EAAA,QAAA,EACtC,kBAAkB,CAAC,KAAK,EAAA,CACb,EACb,UAAU,CAAC,GAAG,CAAC,CAAC,MAAM,MACrBA,qBAAA,CAAC,MAAM,CAAC,IAAI,EAAA,EAAiB,KAAK,EAAE,MAAM,CAAC,EAAE,EAC1C,QAAA,EAAA,MAAM,CAAC,KAAK,EADG,EAAA,MAAM,CAAC,EAAE,CAEb,CACf,CAAC,CACa,EAAA,CAAA,CAAA,EAAA,CACV,EACJ,CAAA,CAAA,EAAA,CACF,EACP;AACJ;;;;"}
+{"version":3,"file":"grouping.js","sources":["../../../../../v1/components/data-table/components/grouping.tsx"],"sourcesContent":["import { Flex } from \"../../flex\";\nimport styles from \"../data-table.module.css\";\nimport { Text } from \"../../text\";\nimport { Select } from \"../../select\";\nimport { DataTableColumn, defaultGroupOption } from \"../data-table.types\";\n\ninterface GroupingProps<TData, TValue> {\n  columns: DataTableColumn<TData, TValue>[];\n  onChange: (columnId: string) => void;\n  onRemove: () => void;\n  value: string;\n}\n\nexport function Grouping<TData, TValue>({\n  columns = [],\n  onChange,\n  onRemove,\n  value,\n}: GroupingProps<TData, TValue>) {\n  const columnList = columns\n    .filter((column) => column.columnDef.enableGrouping)\n    ?.map((column) => {\n      const id = column.id;\n      return {\n        label: column.columnDef.header || id,\n        id: id,\n      };\n    });\n\n  const handleGroupChange = (columnId: string) => {\n    if (columnId === defaultGroupOption.id) {\n      onRemove();\n      return;\n    }\n    const column = columns.find((col) => col.id === columnId);\n    if (column) {\n      onChange(column.id);\n    }\n  };\n\n  return (\n    <Flex justify=\"between\" align=\"center\">\n      <Text size={2} weight={500} className={styles[\"flex-1\"]}>\n        Grouping\n      </Text>\n      <Flex className={styles[\"flex-1\"]}>\n        <Select onValueChange={handleGroupChange} value={value}>\n          <Select.Trigger\n            size={\"small\"}\n            className={styles[\"display-popover-properties-select\"]}\n          >\n            <Select.Value placeholder=\"Select value\" />\n          </Select.Trigger>\n          <Select.Content data-variant=\"filter\">\n            <Select.Item value={defaultGroupOption.id}>\n              {defaultGroupOption.label}\n            </Select.Item>\n            {columnList.map((column) => (\n              <Select.Item key={column.id} value={column.id}>\n                {column.label}\n              </Select.Item>\n            ))}\n          </Select.Content>\n        </Select>\n      </Flex>\n    </Flex>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;AAagB,SAAA,QAAQ,CAAgB,EACtC,OAAO,GAAG,EAAE,EACZ,QAAQ,EACR,QAAQ,EACR,KAAK,GACwB,EAAA;IAC7B,MAAM,UAAU,GAAG,OAAO;SACvB,MAAM,CAAC,CAAC,MAAM,KAAK,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;AACpD,UAAE,GAAG,CAAC,CAAC,MAAM,KAAI;AACf,QAAA,MAAM,EAAE,GAAG,MAAM,CAAC,EAAE,CAAC;QACrB,OAAO;AACL,YAAA,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,MAAM,IAAI,EAAE;AACpC,YAAA,EAAE,EAAE,EAAE;SACP,CAAC;AACJ,KAAC,CAAC,CAAC;AAEL,IAAA,MAAM,iBAAiB,GAAG,CAAC,QAAgB,KAAI;AAC7C,QAAA,IAAI,QAAQ,KAAK,kBAAkB,CAAC,EAAE,EAAE;AACtC,YAAA,QAAQ,EAAE,CAAC;YACX,OAAO;SACR;AACD,QAAA,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC;QAC1D,IAAI,MAAM,EAAE;AACV,YAAA,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;SACrB;AACH,KAAC,CAAC;AAEF,IAAA,QACEA,sBAAA,CAAC,IAAI,EAAA,EAAC,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAA,QAAA,EAAA,CACpCC,sBAAC,IAAI,EAAA,EAAC,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,CAAC,QAAQ,CAAC,EAAA,QAAA,EAAA,UAAA,EAAA,CAEhD,EACPA,qBAAC,CAAA,IAAI,EAAC,EAAA,SAAS,EAAE,MAAM,CAAC,QAAQ,CAAC,EAC/B,QAAA,EAAAD,sBAAA,CAAC,MAAM,EAAA,EAAC,aAAa,EAAE,iBAAiB,EAAE,KAAK,EAAE,KAAK,EACpD,QAAA,EAAA,CAAAC,qBAAA,CAAC,MAAM,CAAC,OAAO,EAAA,EACb,IAAI,EAAE,OAAO,EACb,SAAS,EAAE,MAAM,CAAC,mCAAmC,CAAC,EAEtD,QAAA,EAAAA,qBAAA,CAAC,MAAM,CAAC,KAAK,EAAA,EAAC,WAAW,EAAC,cAAc,EAAA,CAAG,EAC5B,CAAA,EACjBD,sBAAC,CAAA,MAAM,CAAC,OAAO,oBAAc,QAAQ,EAAA,QAAA,EAAA,CACnCC,qBAAC,CAAA,MAAM,CAAC,IAAI,EAAC,EAAA,KAAK,EAAE,kBAAkB,CAAC,EAAE,EAAA,QAAA,EACtC,kBAAkB,CAAC,KAAK,EAAA,CACb,EACb,UAAU,CAAC,GAAG,CAAC,CAAC,MAAM,MACrBA,qBAAA,CAAC,MAAM,CAAC,IAAI,EAAA,EAAiB,KAAK,EAAE,MAAM,CAAC,EAAE,EAC1C,QAAA,EAAA,MAAM,CAAC,KAAK,EADG,EAAA,MAAM,CAAC,EAAE,CAEb,CACf,CAAC,CACa,EAAA,CAAA,CAAA,EAAA,CACV,EACJ,CAAA,CAAA,EAAA,CACF,EACP;AACJ;;;;"}

package/dist/v1/components/data-table/data-table.types.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.types.cjs","sources":["../../../../v1/components/data-table/data-table.types.tsx"],"sourcesContent":["import type { Column, ColumnDef, Table } from \"@tanstack/table-core\";\nimport type {\n  FilterOperatorTypes,\n  FilterSelectOption,\n  FilterTypes,\n  FilterValueType,\n} from \"~/v1/types/filters\";\n\nexport type DataTableMode = \"client\" | \"server\";\n\nexport const SortOrders = {\n  ASC: \"asc\",\n  DESC: \"desc\",\n} as const;\n\nexport interface RQLFilterValues {\n  value: any;\n  // Only one of these value fields should be present at a time\n  boolValue?: boolean;\n  stringValue?: string;\n  numberValue?: number;\n}\nexport interface RQLFilter extends RQLFilterValues {\n  _type?: FilterTypes;\n  _dataType?: FilterValueType;\n  name: string;\n  operator: FilterOperatorTypes;\n}\n\ntype SortOrdersKeys = keyof typeof SortOrders;\nexport type SortOrdersValues = typeof SortOrders[SortOrdersKeys];\n\nexport interface DataTableSort {\n  name: string;\n  order: SortOrdersValues;\n}\n\nexport interface DataTableQuery {\n  filters?: RQLFilter[];\n  sort?: DataTableSort[];\n  group_by?: string[];\n  offset?: number;\n  limit?: number;\n  search?: string;\n  __group_by_sort?: SortOrdersValues;\n}\n\nexport type DataTableColumn<TData, TValue> = Omit<\n  Column<TData, TValue>,\n  \"columnDef\"\n> & {\n  columnDef: DataTableColumnDef<TData, TValue>;\n};\n\nexport type DataTableColumnDef<TData, TValue> = ColumnDef<TData, TValue> & {\n  accessorKey: string;\n  header: string;\n  filterType?: FilterTypes;\n  dataType?: FilterValueType;\n  enableColumnFilter?: boolean;\n  enableSorting?: boolean;\n  enableHiding?: boolean;\n  defaultHidden?: boolean;\n  filterOptions?: FilterSelectOption[];\n  classNames?: {\n    cell?: string;\n    header?: string;\n  };\n  styles?: {\n    cell?: React.CSSProperties;\n    header?: React.CSSProperties;\n  };\n  enableGrouping?: boolean;\n  groupSortOrder?: SortOrdersValues;\n  showGroupCount?: boolean;\n  groupCountMap?: Record<string, number>;\n  // TODO: implement these\n  icon?: React.ReactNode;\n};\n\nexport interface DataTableProps<TData, TValue> {\n  columns: DataTableColumnDef<TData, TValue>[];\n  data: TData[];\n  query?: DataTableQuery;\n  mode?: DataTableMode;\n  isLoading?: boolean;\n  loadingRowCount?: number;\n  tableQuery?: DataTableQuery;\n  onTableQueryChange?: (query: DataTableQuery) => void;\n  defaultSort: DataTableSort;\n  onLoadMore?: () => Promise<void>;\n  onRowClick?: (row: TData) => void;\n}\n\nexport type DataTableContentProps = {\n  emptyState?: React.ReactNode;\n  classNames?: {\n    table?: string;\n    header?: string;\n    body?: string;\n    row?: string;\n  };\n};\n\nexport type TableQueryUpdateFn = (query: DataTableQuery) => DataTableQuery;\n\nexport type TableContextType<TData, TValue> = {\n  table: Table<TData>;\n  columns: DataTableColumnDef<TData, TValue>[];\n  isLoading?: boolean;\n  loadMoreData: () => void;\n  mode: DataTableMode;\n  defaultSort: DataTableSort;\n  tableQuery?: DataTableQuery;\n  loadingRowCount?: number;\n  onDisplaySettingsReset: () => void;\n  updateTableQuery: (fn: TableQueryUpdateFn) => void;\n  onRowClick?: (row: TData) => void;\n};\n\nexport interface ColumnData {\n  label: string;\n  id: string;\n  isVisible?: boolean;\n}\n\ninterface SubRows<T> {}\n\nexport interface GroupedData<T> extends SubRows<T> {\n  group_key: string;\n  subRows: T[];\n  count?: number;\n  showGroupCount?: boolean;\n}\n\nexport const defaultGroupOption = {\n  id: \"--\",\n  label: \"No grouping\",\n};\n\nexport const EmptyFilterValue = \"--empty--\";\n"],"names":[],"mappings":";;AAUa,MAAA,UAAU,GAAG;AACxB,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,MAAM;EACH;AA0HE,MAAA,kBAAkB,GAAG;AAChC,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,KAAK,EAAE,aAAa;EACpB;AAEK,MAAM,gBAAgB,GAAG;;;;;;"}
+{"version":3,"file":"data-table.types.cjs","sources":["../../../../v1/components/data-table/data-table.types.tsx"],"sourcesContent":["import type { Column, ColumnDef, Table } from \"@tanstack/table-core\";\nimport type {\n  FilterOperatorTypes,\n  FilterSelectOption,\n  FilterTypes,\n  FilterValueType,\n} from \"~/v1/types/filters\";\n\nexport type DataTableMode = \"client\" | \"server\";\n\nexport const SortOrders = {\n  ASC: \"asc\",\n  DESC: \"desc\",\n} as const;\n\nexport interface RQLFilterValues {\n  value: any;\n  // Only one of these value fields should be present at a time\n  boolValue?: boolean;\n  stringValue?: string;\n  numberValue?: number;\n}\nexport interface RQLFilter extends RQLFilterValues {\n  _type?: FilterTypes;\n  _dataType?: FilterValueType;\n  name: string;\n  operator: FilterOperatorTypes;\n}\n\ntype SortOrdersKeys = keyof typeof SortOrders;\nexport type SortOrdersValues = typeof SortOrders[SortOrdersKeys];\n\nexport interface DataTableSort {\n  name: string;\n  order: SortOrdersValues;\n}\n\nexport interface DataTableQuery {\n  filters?: RQLFilter[];\n  sort?: DataTableSort[];\n  group_by?: string[];\n  offset?: number;\n  limit?: number;\n  search?: string;\n}\n\nexport type DataTableColumn<TData, TValue> = Omit<\n  Column<TData, TValue>,\n  \"columnDef\"\n> & {\n  columnDef: DataTableColumnDef<TData, TValue>;\n};\n\nexport type DataTableColumnDef<TData, TValue> = ColumnDef<TData, TValue> & {\n  accessorKey: string;\n  header: string;\n  filterType?: FilterTypes;\n  dataType?: FilterValueType;\n  enableColumnFilter?: boolean;\n  enableSorting?: boolean;\n  enableHiding?: boolean;\n  defaultHidden?: boolean;\n  filterOptions?: FilterSelectOption[];\n  classNames?: {\n    cell?: string;\n    header?: string;\n  };\n  styles?: {\n    cell?: React.CSSProperties;\n    header?: React.CSSProperties;\n  };\n  enableGrouping?: boolean;\n  showGroupCount?: boolean;\n  groupCountMap?: Record<string, number>;\n  groupLabelsMap?: Record<string, string>;\n  // TODO: implement these\n  icon?: React.ReactNode;\n};\n\nexport interface DataTableProps<TData, TValue> {\n  columns: DataTableColumnDef<TData, TValue>[];\n  data: TData[];\n  query?: DataTableQuery;\n  mode?: DataTableMode;\n  isLoading?: boolean;\n  loadingRowCount?: number;\n  tableQuery?: DataTableQuery;\n  onTableQueryChange?: (query: DataTableQuery) => void;\n  defaultSort: DataTableSort;\n  onLoadMore?: () => Promise<void>;\n  onRowClick?: (row: TData) => void;\n}\n\nexport type DataTableContentProps = {\n  emptyState?: React.ReactNode;\n  classNames?: {\n    table?: string;\n    header?: string;\n    body?: string;\n    row?: string;\n  };\n};\n\nexport type TableQueryUpdateFn = (query: DataTableQuery) => DataTableQuery;\n\nexport type TableContextType<TData, TValue> = {\n  table: Table<TData>;\n  columns: DataTableColumnDef<TData, TValue>[];\n  isLoading?: boolean;\n  loadMoreData: () => void;\n  mode: DataTableMode;\n  defaultSort: DataTableSort;\n  tableQuery?: DataTableQuery;\n  loadingRowCount?: number;\n  onDisplaySettingsReset: () => void;\n  updateTableQuery: (fn: TableQueryUpdateFn) => void;\n  onRowClick?: (row: TData) => void;\n};\n\nexport interface ColumnData {\n  label: string;\n  id: string;\n  isVisible?: boolean;\n}\n\ninterface SubRows<T> {}\n\nexport interface GroupedData<T> extends SubRows<T> {\n  label: string;\n  group_key: string;\n  subRows: T[];\n  count?: number;\n  showGroupCount?: boolean;\n}\n\nexport const defaultGroupOption = {\n  id: \"--\",\n  label: \"No grouping\",\n};\n\nexport const EmptyFilterValue = \"--empty--\";\n"],"names":[],"mappings":";;AAUa,MAAA,UAAU,GAAG;AACxB,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,MAAM;EACH;AA0HE,MAAA,kBAAkB,GAAG;AAChC,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,KAAK,EAAE,aAAa;EACpB;AAEK,MAAM,gBAAgB,GAAG;;;;;;"}

package/dist/v1/components/data-table/data-table.types.d.ts

@@ -30,7 +30,6 @@ export interface DataTableQuery {
     offset?: number;
     limit?: number;
     search?: string;
-    __group_by_sort?: SortOrdersValues;
 }
 export type DataTableColumn<TData, TValue> = Omit<Column<TData, TValue>, "columnDef"> & {
     columnDef: DataTableColumnDef<TData, TValue>;
@@ -54,9 +53,9 @@ export type DataTableColumnDef<TData, TValue> = ColumnDef<TData, TValue> & {
         header?: React.CSSProperties;
     };
     enableGrouping?: boolean;
-    groupSortOrder?: SortOrdersValues;
     showGroupCount?: boolean;
     groupCountMap?: Record<string, number>;
+    groupLabelsMap?: Record<string, string>;
     icon?: React.ReactNode;
 };
 export interface DataTableProps<TData, TValue> {
@@ -103,6 +102,7 @@ export interface ColumnData {
 interface SubRows<T> {
 }
 export interface GroupedData<T> extends SubRows<T> {
+    label: string;
     group_key: string;
     subRows: T[];
     count?: number;

package/dist/v1/components/data-table/data-table.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.types.d.ts","sourceRoot":"","sources":["../../../../v1/components/data-table/data-table.types.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"data-table.types.d.ts","sourceRoot":"","sources":["../../../../v1/components/data-table/data-table.types.tsx"],"names":[],"mappings":"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"}

package/dist/v1/components/data-table/data-table.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.types.js","sources":["../../../../v1/components/data-table/data-table.types.tsx"],"sourcesContent":["import type { Column, ColumnDef, Table } from \"@tanstack/table-core\";\nimport type {\n  FilterOperatorTypes,\n  FilterSelectOption,\n  FilterTypes,\n  FilterValueType,\n} from \"~/v1/types/filters\";\n\nexport type DataTableMode = \"client\" | \"server\";\n\nexport const SortOrders = {\n  ASC: \"asc\",\n  DESC: \"desc\",\n} as const;\n\nexport interface RQLFilterValues {\n  value: any;\n  // Only one of these value fields should be present at a time\n  boolValue?: boolean;\n  stringValue?: string;\n  numberValue?: number;\n}\nexport interface RQLFilter extends RQLFilterValues {\n  _type?: FilterTypes;\n  _dataType?: FilterValueType;\n  name: string;\n  operator: FilterOperatorTypes;\n}\n\ntype SortOrdersKeys = keyof typeof SortOrders;\nexport type SortOrdersValues = typeof SortOrders[SortOrdersKeys];\n\nexport interface DataTableSort {\n  name: string;\n  order: SortOrdersValues;\n}\n\nexport interface DataTableQuery {\n  filters?: RQLFilter[];\n  sort?: DataTableSort[];\n  group_by?: string[];\n  offset?: number;\n  limit?: number;\n  search?: string;\n  __group_by_sort?: SortOrdersValues;\n}\n\nexport type DataTableColumn<TData, TValue> = Omit<\n  Column<TData, TValue>,\n  \"columnDef\"\n> & {\n  columnDef: DataTableColumnDef<TData, TValue>;\n};\n\nexport type DataTableColumnDef<TData, TValue> = ColumnDef<TData, TValue> & {\n  accessorKey: string;\n  header: string;\n  filterType?: FilterTypes;\n  dataType?: FilterValueType;\n  enableColumnFilter?: boolean;\n  enableSorting?: boolean;\n  enableHiding?: boolean;\n  defaultHidden?: boolean;\n  filterOptions?: FilterSelectOption[];\n  classNames?: {\n    cell?: string;\n    header?: string;\n  };\n  styles?: {\n    cell?: React.CSSProperties;\n    header?: React.CSSProperties;\n  };\n  enableGrouping?: boolean;\n  groupSortOrder?: SortOrdersValues;\n  showGroupCount?: boolean;\n  groupCountMap?: Record<string, number>;\n  // TODO: implement these\n  icon?: React.ReactNode;\n};\n\nexport interface DataTableProps<TData, TValue> {\n  columns: DataTableColumnDef<TData, TValue>[];\n  data: TData[];\n  query?: DataTableQuery;\n  mode?: DataTableMode;\n  isLoading?: boolean;\n  loadingRowCount?: number;\n  tableQuery?: DataTableQuery;\n  onTableQueryChange?: (query: DataTableQuery) => void;\n  defaultSort: DataTableSort;\n  onLoadMore?: () => Promise<void>;\n  onRowClick?: (row: TData) => void;\n}\n\nexport type DataTableContentProps = {\n  emptyState?: React.ReactNode;\n  classNames?: {\n    table?: string;\n    header?: string;\n    body?: string;\n    row?: string;\n  };\n};\n\nexport type TableQueryUpdateFn = (query: DataTableQuery) => DataTableQuery;\n\nexport type TableContextType<TData, TValue> = {\n  table: Table<TData>;\n  columns: DataTableColumnDef<TData, TValue>[];\n  isLoading?: boolean;\n  loadMoreData: () => void;\n  mode: DataTableMode;\n  defaultSort: DataTableSort;\n  tableQuery?: DataTableQuery;\n  loadingRowCount?: number;\n  onDisplaySettingsReset: () => void;\n  updateTableQuery: (fn: TableQueryUpdateFn) => void;\n  onRowClick?: (row: TData) => void;\n};\n\nexport interface ColumnData {\n  label: string;\n  id: string;\n  isVisible?: boolean;\n}\n\ninterface SubRows<T> {}\n\nexport interface GroupedData<T> extends SubRows<T> {\n  group_key: string;\n  subRows: T[];\n  count?: number;\n  showGroupCount?: boolean;\n}\n\nexport const defaultGroupOption = {\n  id: \"--\",\n  label: \"No grouping\",\n};\n\nexport const EmptyFilterValue = \"--empty--\";\n"],"names":[],"mappings":"AAUa,MAAA,UAAU,GAAG;AACxB,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,MAAM;EACH;AA0HE,MAAA,kBAAkB,GAAG;AAChC,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,KAAK,EAAE,aAAa;EACpB;AAEK,MAAM,gBAAgB,GAAG;;;;"}
+{"version":3,"file":"data-table.types.js","sources":["../../../../v1/components/data-table/data-table.types.tsx"],"sourcesContent":["import type { Column, ColumnDef, Table } from \"@tanstack/table-core\";\nimport type {\n  FilterOperatorTypes,\n  FilterSelectOption,\n  FilterTypes,\n  FilterValueType,\n} from \"~/v1/types/filters\";\n\nexport type DataTableMode = \"client\" | \"server\";\n\nexport const SortOrders = {\n  ASC: \"asc\",\n  DESC: \"desc\",\n} as const;\n\nexport interface RQLFilterValues {\n  value: any;\n  // Only one of these value fields should be present at a time\n  boolValue?: boolean;\n  stringValue?: string;\n  numberValue?: number;\n}\nexport interface RQLFilter extends RQLFilterValues {\n  _type?: FilterTypes;\n  _dataType?: FilterValueType;\n  name: string;\n  operator: FilterOperatorTypes;\n}\n\ntype SortOrdersKeys = keyof typeof SortOrders;\nexport type SortOrdersValues = typeof SortOrders[SortOrdersKeys];\n\nexport interface DataTableSort {\n  name: string;\n  order: SortOrdersValues;\n}\n\nexport interface DataTableQuery {\n  filters?: RQLFilter[];\n  sort?: DataTableSort[];\n  group_by?: string[];\n  offset?: number;\n  limit?: number;\n  search?: string;\n}\n\nexport type DataTableColumn<TData, TValue> = Omit<\n  Column<TData, TValue>,\n  \"columnDef\"\n> & {\n  columnDef: DataTableColumnDef<TData, TValue>;\n};\n\nexport type DataTableColumnDef<TData, TValue> = ColumnDef<TData, TValue> & {\n  accessorKey: string;\n  header: string;\n  filterType?: FilterTypes;\n  dataType?: FilterValueType;\n  enableColumnFilter?: boolean;\n  enableSorting?: boolean;\n  enableHiding?: boolean;\n  defaultHidden?: boolean;\n  filterOptions?: FilterSelectOption[];\n  classNames?: {\n    cell?: string;\n    header?: string;\n  };\n  styles?: {\n    cell?: React.CSSProperties;\n    header?: React.CSSProperties;\n  };\n  enableGrouping?: boolean;\n  showGroupCount?: boolean;\n  groupCountMap?: Record<string, number>;\n  groupLabelsMap?: Record<string, string>;\n  // TODO: implement these\n  icon?: React.ReactNode;\n};\n\nexport interface DataTableProps<TData, TValue> {\n  columns: DataTableColumnDef<TData, TValue>[];\n  data: TData[];\n  query?: DataTableQuery;\n  mode?: DataTableMode;\n  isLoading?: boolean;\n  loadingRowCount?: number;\n  tableQuery?: DataTableQuery;\n  onTableQueryChange?: (query: DataTableQuery) => void;\n  defaultSort: DataTableSort;\n  onLoadMore?: () => Promise<void>;\n  onRowClick?: (row: TData) => void;\n}\n\nexport type DataTableContentProps = {\n  emptyState?: React.ReactNode;\n  classNames?: {\n    table?: string;\n    header?: string;\n    body?: string;\n    row?: string;\n  };\n};\n\nexport type TableQueryUpdateFn = (query: DataTableQuery) => DataTableQuery;\n\nexport type TableContextType<TData, TValue> = {\n  table: Table<TData>;\n  columns: DataTableColumnDef<TData, TValue>[];\n  isLoading?: boolean;\n  loadMoreData: () => void;\n  mode: DataTableMode;\n  defaultSort: DataTableSort;\n  tableQuery?: DataTableQuery;\n  loadingRowCount?: number;\n  onDisplaySettingsReset: () => void;\n  updateTableQuery: (fn: TableQueryUpdateFn) => void;\n  onRowClick?: (row: TData) => void;\n};\n\nexport interface ColumnData {\n  label: string;\n  id: string;\n  isVisible?: boolean;\n}\n\ninterface SubRows<T> {}\n\nexport interface GroupedData<T> extends SubRows<T> {\n  label: string;\n  group_key: string;\n  subRows: T[];\n  count?: number;\n  showGroupCount?: boolean;\n}\n\nexport const defaultGroupOption = {\n  id: \"--\",\n  label: \"No grouping\",\n};\n\nexport const EmptyFilterValue = \"--empty--\";\n"],"names":[],"mappings":"AAUa,MAAA,UAAU,GAAG;AACxB,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,MAAM;EACH;AA0HE,MAAA,kBAAkB,GAAG;AAChC,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,KAAK,EAAE,aAAa;EACpB;AAEK,MAAM,gBAAgB,GAAG;;;;"}

package/dist/v1/components/data-table/utils/filter-operations.cjs

@@ -104,6 +104,11 @@ const handleStringBasedTypes = (filterType, value) => {
             };
     }
 };
+const getFilterOperator = ({ value, filterType, operator, }) => {
+    return value === dataTable_types.EmptyFilterValue && filterType === filters.FilterType.select
+        ? "empty"
+        : operator;
+};
 const getFilterValue = ({ value, dataType = "string", filterType = filters.FilterType.string, }) => {
     if (dataType === "boolean") {
         return { boolValue: value, value };
@@ -128,5 +133,6 @@ const getDataType = ({ filterType = filters.FilterType.string, dataType = "strin
 exports.filterOperationsMap = filterOperationsMap;
 exports.getDataType = getDataType;
 exports.getFilterFn = getFilterFn;
+exports.getFilterOperator = getFilterOperator;
 exports.getFilterValue = getFilterValue;
 //# sourceMappingURL=filter-operations.cjs.map