@fabio.caffarello/react-design-system 3.12.0 → 4.0.0

package/dist/granular/ui/components/Table/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sources":["../../../../../src/ui/components/Table/Table.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { TableProvider, type TableProviderProps } from \"./TableProvider\";\nimport type { FilterConfig, FilterValue } from \"./TableFilters/TableFilters\";\nimport type { TableAction } from \"./TableActions/TableActions\";\nimport type { TableColumn } from \"./TableTypes\";\nimport TableHeader from \"./TableHeader\";\nimport TableHeaderRow from \"./TableHeaderRow\";\nimport TableHeaderCell from \"./TableHeaderCell\";\nimport TableBody from \"./TableBody\";\nimport TableRow from \"./TableRow\";\nimport TableCell from \"./TableCell\";\nimport TableFilters from \"./TableFilters\";\nimport TablePagination from \"./TablePagination\";\nimport TableEmptyState from \"./TableEmptyState\";\nimport TableActions from \"./TableActions\";\nimport { getRadiusClass } from \"../../tokens/radius\";\n\nexport type { TableColumn } from \"./TableTypes\";\n\n// API Simplificada Props (backward compatible)\ninterface SimplifiedTableProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> extends Omit<HTMLAttributes<HTMLDivElement>, \"onSort\" | \"children\"> {\n  columns: TableColumn<T>[];\n  data: T[];\n  loading?: boolean;\n  onSort?: (columnKey: string, direction: \"asc\" | \"desc\") => void;\n  sortColumn?: string;\n  sortDirection?: \"asc\" | \"desc\";\n  emptyMessage?: string;\n  emptyStateTitle?: string;\n  emptyStateMessage?: string;\n  emptyStateIllustration?: ReactNode;\n  emptyStateAction?: ReactNode;\n\n  // Pagination\n  pagination?: {\n    page: number;\n    pageSize: number;\n    total: number;\n    onPageChange: (page: number) => void;\n    onPageSizeChange: (size: number) => void;\n    pageSizeOptions?: number[];\n  };\n\n  // Filters\n  filters?: {\n    config: FilterConfig[];\n    onFilter: (filters: Record<string, FilterValue>) => void;\n    initialValues?: Record<string, FilterValue>;\n  };\n\n  // Selection\n  selectable?: boolean;\n  selectedRows?: string[];\n  onSelectionChange?: (selected: string[]) => void;\n  rowId?: (row: T) => string;\n\n  // Actions\n  actions?: (row: T) => TableAction<T>[];\n\n  // Row click callback\n  onRowClick?: (row: T) => void;\n\n  // Pagination mode\n  paginationMode?: \"client\" | \"server\" | \"auto\";\n  defaultPageSize?: number;\n\n  // Column resizing\n  resizable?: boolean;\n  columnWidths?: Record<string, number>;\n  onColumnResize?: (columnKey: string, width: number) => void;\n\n  // Virtual scrolling\n  virtualScrolling?: boolean;\n  virtualScrollingOptions?: {\n    itemHeight?: number;\n    containerHeight?: number;\n    overscan?: number;\n  };\n\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n\n  children?: never; // Simplified API doesn't accept children\n}\n\n// API Declarativa Props (compound components)\ninterface DeclarativeTableProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> extends Omit<TableProviderProps<T>, \"children\"> {\n  children: ReactNode; // Declarative API requires children\n}\n\ntype TableProps<T extends Record<string, unknown> = Record<string, unknown>> =\n  | SimplifiedTableProps<T>\n  | DeclarativeTableProps<T>;\n\n/**\n * Table Component\n *\n * A comprehensive table component with sorting, pagination, filters, selection, and actions.\n * Supports both simplified API (props-based) and declarative API (compound components).\n *\n * @example\n * ```tsx\n * // Simplified API\n * <Table\n *   columns={columns}\n *   data={data}\n *   pagination={{ page, pageSize, total, onPageChange }}\n * />\n *\n * // Declarative API\n * <Table columns={columns} data={data}>\n *   <Table.Filters />\n *   <Table.Header />\n *   <Table.Body />\n *   <Table.Pagination />\n * </Table>\n * ```\n */\nfunction TableComponent<\n  T extends Record<string, unknown> = Record<string, unknown>,\n>(props: TableProps<T>) {\n  const {\n    className = \"\",\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    ...restProps\n  } = props as SimplifiedTableProps<T> & DeclarativeTableProps<T>;\n  const hasChildren = \"children\" in props && props.children !== undefined;\n\n  // Convert simplified API props to provider props.\n  // The two double-casts below are safe: `restProps` originates from the\n  // same TableProps<T> union and convertSimplifiedToProviderProps' return\n  // mirrors TableProviderProps's shape — but TS cannot prove either via\n  // structural narrowing, so we assert the contract explicitly.\n  const providerProps: TableProviderProps<T> = hasChildren\n    ? (restProps as unknown as TableProviderProps<T>)\n    : (convertSimplifiedToProviderProps(\n        restProps as SimplifiedTableProps<T>,\n      ) as unknown as TableProviderProps<T>);\n\n  // If children are provided, use declarative API\n  if (hasChildren) {\n    return (\n      <div\n        className={`bg-surface-base shadow ${getRadiusClass(\"lg\")} overflow-hidden ${className}`}\n      >\n        <TableProvider {...providerProps}>{props.children}</TableProvider>\n      </div>\n    );\n  }\n\n  // Otherwise, use simplified API with default structure\n  return (\n    <div\n      className={`bg-surface-base shadow ${getRadiusClass(\"lg\")} overflow-hidden ${className}`}\n    >\n      <TableProvider {...providerProps}>\n        {providerProps.filters && providerProps.filters.length > 0 && (\n          <TableFilters />\n        )}\n        <div className=\"overflow-x-auto\">\n          <table\n            className=\"min-w-full divide-y divide-line-default\"\n            role=\"table\"\n            aria-label={ariaLabel}\n            aria-labelledby={ariaLabelledBy}\n            aria-rowcount={providerProps.total || providerProps.data.length}\n            aria-colcount={\n              providerProps.columns.length +\n              (providerProps.selectable ? 1 : 0) +\n              (providerProps.actions ? 1 : 0)\n            }\n          >\n            <TableHeader />\n            <TableBody />\n          </table>\n        </div>\n        {/* Show pagination - TablePagination component will decide if it should render based on totalPages */}\n        <TablePagination />\n      </TableProvider>\n    </div>\n  );\n}\n\n// Helper to convert simplified API props to provider props\nfunction convertSimplifiedToProviderProps<T extends Record<string, unknown>>(\n  props: SimplifiedTableProps<T>,\n): TableProviderProps<T> {\n  const {\n    columns,\n    data,\n    loading,\n    onSort,\n    sortColumn,\n    sortDirection,\n    emptyMessage,\n    emptyStateTitle,\n    emptyStateMessage,\n    emptyStateIllustration,\n    emptyStateAction,\n    pagination,\n    filters,\n    selectable,\n    selectedRows,\n    onSelectionChange,\n    rowId,\n    actions,\n    onRowClick,\n    paginationMode,\n    defaultPageSize,\n    resizable,\n    columnWidths,\n    onColumnResize,\n    virtualScrolling,\n    virtualScrollingOptions,\n  } = props;\n\n  // Determine pagination mode\n  let mode: \"client\" | \"server\" | \"auto\" = paginationMode || \"auto\";\n  if (mode === \"auto\") {\n    // pagination.onPageChange is required by the type, so its presence\n    // is implied by `pagination` itself.\n    mode = pagination && pagination.total !== undefined ? \"server\" : \"client\";\n  }\n\n  return {\n    columns,\n    data,\n    loading,\n    paginationMode: mode,\n    page: pagination?.page,\n    pageSize: pagination?.pageSize,\n    total: pagination?.total,\n    onPageChange: pagination?.onPageChange,\n    onPageSizeChange: pagination?.onPageSizeChange,\n    defaultPageSize: defaultPageSize || pagination?.pageSize || 10,\n    pageSizeOptions: pagination?.pageSizeOptions,\n    sortColumn,\n    sortDirection,\n    onSort,\n    filters: filters?.config,\n    filterValues: filters?.initialValues,\n    onFilter: filters?.onFilter,\n    initialFilterValues: filters?.initialValues,\n    selectable,\n    selectedRows,\n    onSelectionChange,\n    rowId,\n    actions,\n    onRowClick,\n    emptyMessage,\n    emptyStateTitle,\n    emptyStateMessage,\n    emptyStateIllustration,\n    emptyStateAction,\n    resizable,\n    columnWidths,\n    onColumnResize,\n    virtualScrolling,\n    virtualScrollingOptions,\n    children: <></>, // Placeholder, will be overridden by default structure\n  };\n}\n\n// Compound Components\nTableComponent.Header = TableHeader;\nTableComponent.HeaderRow = TableHeaderRow;\nTableComponent.HeaderCell = TableHeaderCell;\nTableComponent.Body = TableBody;\nTableComponent.Row = TableRow;\nTableComponent.Cell = TableCell;\nTableComponent.Filters = TableFilters;\nTableComponent.Pagination = TablePagination;\nTableComponent.EmptyState = TableEmptyState;\nTableComponent.Actions = TableActions;\n\nexport default TableComponent;\n"],"names":["TableComponent","props","_a","className","ariaLabel","ariaLabelledBy","restProps","__objRest","hasChildren","providerProps","convertSimplifiedToProviderProps","jsx","getRadiusClass","TableProvider","__spreadProps","__spreadValues","jsxs","TableFilters","TableHeader","TableBody","TablePagination","columns","data","loading","onSort","sortColumn","sortDirection","emptyMessage","emptyStateTitle","emptyStateMessage","emptyStateIllustration","emptyStateAction","pagination","filters","selectable","selectedRows","onSelectionChange","rowId","actions","onRowClick","paginationMode","defaultPageSize","resizable","columnWidths","onColumnResize","virtualScrolling","virtualScrollingOptions","mode","Fragment","TableHeaderRow","TableHeaderCell","TableRow","TableCell","TableEmptyState","TableActions"],"mappings":"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"}
+{"version":3,"file":"Table.js","sources":["../../../../../src/ui/components/Table/Table.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { TableProvider, type TableProviderProps } from \"./TableProvider\";\nimport type { FilterConfig, FilterValue } from \"./TableFilters/TableFilters\";\nimport type { TableAction } from \"./TableActions/TableActions\";\nimport type { TableColumn } from \"./TableTypes\";\nimport TableHeader from \"./TableHeader\";\nimport TableHeaderRow from \"./TableHeaderRow\";\nimport TableHeaderCell from \"./TableHeaderCell\";\nimport TableBody from \"./TableBody\";\nimport TableRow from \"./TableRow\";\nimport TableCell from \"./TableCell\";\nimport TableFilters from \"./TableFilters\";\nimport TablePagination from \"./TablePagination\";\nimport TableEmptyState from \"./TableEmptyState\";\nimport TableActions from \"./TableActions\";\nimport { getRadiusClass } from \"../../tokens/radius\";\n\nexport type { TableColumn } from \"./TableTypes\";\n\n// API Simplificada Props (backward compatible)\ninterface SimplifiedTableProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> extends Omit<HTMLAttributes<HTMLDivElement>, \"onSort\" | \"children\"> {\n  columns: TableColumn<T>[];\n  data: T[];\n  loading?: boolean;\n  onSort?: (columnKey: string, direction: \"asc\" | \"desc\") => void;\n  sortColumn?: string;\n  sortDirection?: \"asc\" | \"desc\";\n  emptyMessage?: string;\n  emptyStateTitle?: string;\n  emptyStateMessage?: string;\n  emptyStateIllustration?: ReactNode;\n  emptyStateAction?: ReactNode;\n\n  // Pagination\n  pagination?: {\n    page: number;\n    pageSize: number;\n    total: number;\n    onPageChange: (page: number) => void;\n    onPageSizeChange: (size: number) => void;\n    pageSizeOptions?: number[];\n  };\n\n  // Filters\n  filters?: {\n    config: FilterConfig[];\n    onFilter: (filters: Record<string, FilterValue>) => void;\n    initialValues?: Record<string, FilterValue>;\n  };\n\n  // Selection\n  selectable?: boolean;\n  selectedRows?: string[];\n  onSelectionChange?: (selected: string[]) => void;\n  rowId?: (row: T) => string;\n\n  // Actions\n  actions?: (row: T) => TableAction<T>[];\n\n  // Row click callback\n  onRowClick?: (row: T) => void;\n\n  // Pagination mode\n  paginationMode?: \"client\" | \"server\" | \"auto\";\n  defaultPageSize?: number;\n\n  // Column resizing\n  resizable?: boolean;\n  columnWidths?: Record<string, number>;\n  onColumnResize?: (columnKey: string, width: number) => void;\n\n  // Virtual scrolling\n  virtualScrolling?: boolean;\n  virtualScrollingOptions?: {\n    itemHeight?: number;\n    containerHeight?: number;\n    overscan?: number;\n  };\n\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n\n  children?: never; // Simplified API doesn't accept children\n}\n\n// API Declarativa Props (compound components)\ninterface DeclarativeTableProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> extends Omit<TableProviderProps<T>, \"children\"> {\n  children: ReactNode; // Declarative API requires children\n}\n\ntype TableProps<T extends Record<string, unknown> = Record<string, unknown>> =\n  | SimplifiedTableProps<T>\n  | DeclarativeTableProps<T>;\n\n/**\n * Table Component\n *\n * A comprehensive table component with sorting, pagination, filters, selection, and actions.\n * Supports both simplified API (props-based) and declarative API (compound components).\n *\n * @example\n * ```tsx\n * // Simplified API\n * <Table\n *   columns={columns}\n *   data={data}\n *   pagination={{ page, pageSize, total, onPageChange }}\n * />\n *\n * // Declarative API\n * <Table columns={columns} data={data}>\n *   <Table.Filters />\n *   <Table.Header />\n *   <Table.Body />\n *   <Table.Pagination />\n * </Table>\n * ```\n */\nfunction TableComponent<\n  T extends Record<string, unknown> = Record<string, unknown>,\n>(props: TableProps<T>) {\n  const {\n    className = \"\",\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    ...restProps\n  } = props as SimplifiedTableProps<T> & DeclarativeTableProps<T>;\n  const hasChildren = \"children\" in props && props.children !== undefined;\n\n  // Convert simplified API props to provider props.\n  // The two double-casts below are safe: `restProps` originates from the\n  // same TableProps<T> union and convertSimplifiedToProviderProps' return\n  // mirrors TableProviderProps's shape — but TS cannot prove either via\n  // structural narrowing, so we assert the contract explicitly.\n  const providerProps: TableProviderProps<T> = hasChildren\n    ? (restProps as unknown as TableProviderProps<T>)\n    : (convertSimplifiedToProviderProps(\n        restProps as SimplifiedTableProps<T>,\n      ) as unknown as TableProviderProps<T>);\n\n  // If children are provided, use declarative API\n  if (hasChildren) {\n    return (\n      <div\n        className={`bg-surface-base shadow ${getRadiusClass(\"lg\")} overflow-hidden ${className}`}\n      >\n        <TableProvider {...providerProps}>{props.children}</TableProvider>\n      </div>\n    );\n  }\n\n  // Otherwise, use simplified API with default structure\n  return (\n    <div\n      className={`bg-surface-base shadow ${getRadiusClass(\"lg\")} overflow-hidden ${className}`}\n    >\n      <TableProvider {...providerProps}>\n        {providerProps.filters && providerProps.filters.length > 0 && (\n          <TableFilters />\n        )}\n        <div className=\"overflow-x-auto\">\n          <table\n            className=\"min-w-full divide-y divide-line-default\"\n            role=\"table\"\n            aria-label={ariaLabel}\n            aria-labelledby={ariaLabelledBy}\n            aria-rowcount={providerProps.total || providerProps.data.length}\n            aria-colcount={\n              providerProps.columns.length +\n              (providerProps.selectable ? 1 : 0) +\n              (providerProps.actions ? 1 : 0)\n            }\n          >\n            <TableHeader />\n            <TableBody />\n          </table>\n        </div>\n        {/* Show pagination - TablePagination component will decide if it should render based on totalPages */}\n        <TablePagination />\n      </TableProvider>\n    </div>\n  );\n}\n\n// Helper to convert simplified API props to provider props\nfunction convertSimplifiedToProviderProps<T extends Record<string, unknown>>(\n  props: SimplifiedTableProps<T>,\n): TableProviderProps<T> {\n  const {\n    columns,\n    data,\n    loading,\n    onSort,\n    sortColumn,\n    sortDirection,\n    emptyMessage,\n    emptyStateTitle,\n    emptyStateMessage,\n    emptyStateIllustration,\n    emptyStateAction,\n    pagination,\n    filters,\n    selectable,\n    selectedRows,\n    onSelectionChange,\n    rowId,\n    actions,\n    onRowClick,\n    paginationMode,\n    defaultPageSize,\n    resizable,\n    columnWidths,\n    onColumnResize,\n    virtualScrolling,\n    virtualScrollingOptions,\n  } = props;\n\n  // Determine pagination mode\n  let mode: \"client\" | \"server\" | \"auto\" = paginationMode || \"auto\";\n  if (mode === \"auto\") {\n    // pagination.onPageChange is required by the type, so its presence\n    // is implied by `pagination` itself.\n    mode = pagination && pagination.total !== undefined ? \"server\" : \"client\";\n  }\n\n  return {\n    columns,\n    data,\n    loading,\n    paginationMode: mode,\n    page: pagination?.page,\n    pageSize: pagination?.pageSize,\n    total: pagination?.total,\n    onPageChange: pagination?.onPageChange,\n    onPageSizeChange: pagination?.onPageSizeChange,\n    defaultPageSize: defaultPageSize || pagination?.pageSize || 10,\n    pageSizeOptions: pagination?.pageSizeOptions,\n    sortColumn,\n    sortDirection,\n    onSort,\n    filters: filters?.config,\n    // Seed the uncontrolled filter state ONLY. Mapping initialValues onto\n    // `filterValues` too flipped the provider into controlled-filter mode\n    // (isFilterControlled = filterValues !== undefined), freezing the\n    // internal filter state forever so client-side filtering never ran.\n    // The simplified Filters API exposes no controlled-filter prop, so\n    // there is no legitimate controlled path through it.\n    filterValues: undefined,\n    onFilter: filters?.onFilter,\n    initialFilterValues: filters?.initialValues,\n    selectable,\n    selectedRows,\n    onSelectionChange,\n    rowId,\n    actions,\n    onRowClick,\n    emptyMessage,\n    emptyStateTitle,\n    emptyStateMessage,\n    emptyStateIllustration,\n    emptyStateAction,\n    resizable,\n    columnWidths,\n    onColumnResize,\n    virtualScrolling,\n    virtualScrollingOptions,\n    children: <></>, // Placeholder, will be overridden by default structure\n  };\n}\n\n// Compound Components\nTableComponent.Header = TableHeader;\nTableComponent.HeaderRow = TableHeaderRow;\nTableComponent.HeaderCell = TableHeaderCell;\nTableComponent.Body = TableBody;\nTableComponent.Row = TableRow;\nTableComponent.Cell = TableCell;\nTableComponent.Filters = TableFilters;\nTableComponent.Pagination = TablePagination;\nTableComponent.EmptyState = TableEmptyState;\nTableComponent.Actions = TableActions;\n\nexport default TableComponent;\n"],"names":["TableComponent","props","_a","className","ariaLabel","ariaLabelledBy","restProps","__objRest","hasChildren","providerProps","convertSimplifiedToProviderProps","jsx","getRadiusClass","TableProvider","__spreadProps","__spreadValues","jsxs","TableFilters","TableHeader","TableBody","TablePagination","columns","data","loading","onSort","sortColumn","sortDirection","emptyMessage","emptyStateTitle","emptyStateMessage","emptyStateIllustration","emptyStateAction","pagination","filters","selectable","selectedRows","onSelectionChange","rowId","actions","onRowClick","paginationMode","defaultPageSize","resizable","columnWidths","onColumnResize","virtualScrolling","virtualScrollingOptions","mode","Fragment","TableHeaderRow","TableHeaderCell","TableRow","TableCell","TableEmptyState","TableActions"],"mappings":"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"}

package/dist/granular/ui/components/Table/TableActions/TableActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableActions.js","sources":["../../../../../../src/ui/components/Table/TableActions/TableActions.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes } from \"react\";\nimport Dropdown from \"../../../components/Dropdown/Dropdown\";\nimport { Button } from \"../../../primitives\";\nimport { MoreVertical } from \"lucide-react\";\nimport { getSpacingClass } from \"../../../tokens/spacing\";\n\nexport interface TableAction<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> {\n  label: string;\n  onClick: (row: T) => void;\n  variant?: \"default\" | \"danger\";\n  disabled?: boolean;\n  icon?: React.ReactNode;\n}\n\nexport interface TableActionsProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> extends HTMLAttributes<HTMLDivElement> {\n  actions: TableAction<T>[];\n  row: T;\n  align?: \"left\" | \"right\";\n}\n\n/**\n * TableActions Component\n *\n * Dropdown menu for row actions in tables.\n * Follows Atomic Design principles as a Molecule component.\n *\n * @example\n * ```tsx\n * <TableActions\n *   row={rowData}\n *   actions={[\n *     { label: 'Edit', onClick: (row) => handleEdit(row) },\n *     { label: 'Delete', onClick: (row) => handleDelete(row), variant: 'danger' },\n *   ]}\n * />\n * ```\n */\nexport default function TableActions<\n  T extends Record<string, unknown> = Record<string, unknown>,\n>({\n  actions,\n  row,\n  align = \"right\",\n  className = \"\",\n  ...props\n}: TableActionsProps<T>) {\n  const dropdownItems = actions.map((action) => ({\n    label: action.label,\n    onClick: () => action.onClick(row),\n    variant: action.variant,\n    disabled: action.disabled,\n  }));\n\n  return (\n    <div className={`inline-flex ${className}`} {...props}>\n      <Dropdown\n        trigger={\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            aria-label=\"Row actions\"\n            className={`h-8 w-8 ${getSpacingClass(\"none\", \"p\")}`}\n          >\n            <MoreVertical className=\"h-4 w-4\" />\n          </Button>\n        }\n        items={dropdownItems}\n        align={align}\n      />\n    </div>\n  );\n}\n"],"names":["TableActions","_a","_b","actions","row","align","className","props","__objRest","dropdownItems","action","__spreadProps","__spreadValues","jsx","Dropdown","Button","getSpacingClass","MoreVertical"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,SAAwBA,EAEtBC,GAMuB;AANvB,MAAAC,IAAAD,GACA;AAAA,aAAAE;AAAA,IACA,KAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,WAAAC,IAAY;AAAA,MAJZJ,GAKGK,IAAAC,EALHN,GAKG;AAAA,IAJH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAMO,IAAgBN,EAAQ,IAAI,CAACO,OAAY;AAAA,IAC7C,OAAOA,EAAO;AAAA,IACd,SAAS,MAAMA,EAAO,QAAQN,CAAG;AAAA,IACjC,SAASM,EAAO;AAAA,IAChB,UAAUA,EAAO;AAAA,EAAA,EACjB;AAEF,2BACG,OAAAC,EAAAC,EAAA,EAAI,WAAW,eAAeN,CAAS,MAAQC,IAA/C,EACC,UAAA,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SACE,gBAAAD;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,cAAW;AAAA,UACX,WAAW,WAAWC,EAAgB,QAAQ,GAAG,CAAC;AAAA,UAElD,UAAA,gBAAAH,EAACI,GAAA,EAAa,WAAU,UAAA,CAAU;AAAA,QAAA;AAAA,MAAA;AAAA,MAGtC,OAAOR;AAAA,MACP,OAAAJ;AAAA,IAAA;AAAA,EAAA,IAEJ;AAEJ;"}
+{"version":3,"file":"TableActions.js","sources":["../../../../../../src/ui/components/Table/TableActions/TableActions.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes } from \"react\";\nimport Dropdown from \"../../../components/Dropdown/Dropdown\";\nimport { Button } from \"../../../primitives\";\nimport { MoreVertical } from \"lucide-react\";\nimport { getSpacingClass } from \"../../../tokens/spacing\";\n\nexport interface TableAction<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> {\n  label: string;\n  onClick: (row: T) => void;\n  variant?: \"default\" | \"danger\";\n  disabled?: boolean;\n  icon?: React.ReactNode;\n}\n\nexport interface TableActionsProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> extends HTMLAttributes<HTMLDivElement> {\n  actions: TableAction<T>[];\n  row: T;\n  align?: \"left\" | \"right\";\n}\n\n/**\n * TableActions Component\n *\n * Dropdown menu for row actions in tables.\n *\n * @example\n * ```tsx\n * <TableActions\n *   row={rowData}\n *   actions={[\n *     { label: 'Edit', onClick: (row) => handleEdit(row) },\n *     { label: 'Delete', onClick: (row) => handleDelete(row), variant: 'danger' },\n *   ]}\n * />\n * ```\n */\nexport default function TableActions<\n  T extends Record<string, unknown> = Record<string, unknown>,\n>({\n  actions,\n  row,\n  align = \"right\",\n  className = \"\",\n  ...props\n}: TableActionsProps<T>) {\n  const dropdownItems = actions.map((action) => ({\n    label: action.label,\n    onClick: () => action.onClick(row),\n    variant: action.variant,\n    disabled: action.disabled,\n  }));\n\n  return (\n    <div className={`inline-flex ${className}`} {...props}>\n      <Dropdown\n        trigger={\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            aria-label=\"Row actions\"\n            className={`h-8 w-8 ${getSpacingClass(\"none\", \"p\")}`}\n          >\n            <MoreVertical className=\"h-4 w-4\" />\n          </Button>\n        }\n        items={dropdownItems}\n        align={align}\n      />\n    </div>\n  );\n}\n"],"names":["TableActions","_a","_b","actions","row","align","className","props","__objRest","dropdownItems","action","__spreadProps","__spreadValues","jsx","Dropdown","Button","getSpacingClass","MoreVertical"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,SAAwBA,EAEtBC,GAMuB;AANvB,MAAAC,IAAAD,GACA;AAAA,aAAAE;AAAA,IACA,KAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,WAAAC,IAAY;AAAA,MAJZJ,GAKGK,IAAAC,EALHN,GAKG;AAAA,IAJH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAMO,IAAgBN,EAAQ,IAAI,CAACO,OAAY;AAAA,IAC7C,OAAOA,EAAO;AAAA,IACd,SAAS,MAAMA,EAAO,QAAQN,CAAG;AAAA,IACjC,SAASM,EAAO;AAAA,IAChB,UAAUA,EAAO;AAAA,EAAA,EACjB;AAEF,2BACG,OAAAC,EAAAC,EAAA,EAAI,WAAW,eAAeN,CAAS,MAAQC,IAA/C,EACC,UAAA,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SACE,gBAAAD;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,cAAW;AAAA,UACX,WAAW,WAAWC,EAAgB,QAAQ,GAAG,CAAC;AAAA,UAElD,UAAA,gBAAAH,EAACI,GAAA,EAAa,WAAU,UAAA,CAAU;AAAA,QAAA;AAAA,MAAA;AAAA,MAGtC,OAAOR;AAAA,MACP,OAAAJ;AAAA,IAAA;AAAA,EAAA,IAEJ;AAEJ;"}

package/dist/granular/ui/components/Table/TableFilters/TableFilters.js

@@ -1,66 +1,66 @@
 "use client";
-var I = Object.defineProperty, L = Object.defineProperties;
-var O = Object.getOwnPropertyDescriptors;
+var L = Object.defineProperty, O = Object.defineProperties;
+var B = Object.getOwnPropertyDescriptors;
 var p = Object.getOwnPropertySymbols;
-var C = Object.prototype.hasOwnProperty, N = Object.prototype.propertyIsEnumerable;
-var k = (t, a, s) => a in t ? I(t, a, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[a] = s, h = (t, a) => {
+var f = Object.prototype.hasOwnProperty, N = Object.prototype.propertyIsEnumerable;
+var C = (t, a, s) => a in t ? L(t, a, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[a] = s, u = (t, a) => {
   for (var s in a || (a = {}))
-    C.call(a, s) && k(t, s, a[s]);
+    f.call(a, s) && C(t, s, a[s]);
   if (p)
     for (var s of p(a))
-      N.call(a, s) && k(t, s, a[s]);
+      N.call(a, s) && C(t, s, a[s]);
   return t;
-}, u = (t, a) => L(t, O(a));
-var f = (t, a) => {
+}, h = (t, a) => O(t, B(a));
+var F = (t, a) => {
   var s = {};
   for (var n in t)
-    C.call(t, n) && a.indexOf(n) < 0 && (s[n] = t[n]);
+    f.call(t, n) && a.indexOf(n) < 0 && (s[n] = t[n]);
   if (t != null && p)
     for (var n of p(t))
       a.indexOf(n) < 0 && N.call(t, n) && (s[n] = t[n]);
   return s;
 };
 import { jsx as l, jsxs as c } from "react/jsx-runtime";
-import { useState as F } from "react";
+import { useState as w, useId as T } from "react";
 import { getSpacingClass as o } from "../../../tokens/spacing.js";
-import { Filter as B, X as w } from "lucide-react";
-import { Button as T } from "../../../primitives/Button/Button.js";
-import X from "../../../primitives/Label/Label.js";
-import j from "../../../primitives/Input/Input.js";
-import q from "../../../primitives/Select/Select.js";
-function W(D) {
-  var g = D, {
+import { Filter as X, X as j } from "lucide-react";
+import { Button as q } from "../../../primitives/Button/Button.js";
+import D from "../../../primitives/Label/Label.js";
+import I from "../../../primitives/Input/Input.js";
+import G from "../../../primitives/Select/Select.js";
+function Z(H) {
+  var x = H, {
     filters: t,
     onFilter: a,
     initialValues: s = {},
     showClearAll: n = !0,
     className: S = ""
-  } = g, z = f(g, [
+  } = x, z = F(x, [
     "filters",
     "onFilter",
     "initialValues",
     "showClearAll",
     "className"
   ]);
-  const [d, y] = F(s), [x, A] = F(!1), E = Object.values(d).some(
+  const [d, b] = w(s), [y, A] = w(!1), v = `table-filters-panel-${T()}`, E = Object.values(d).some(
     (e) => e !== "" && e !== null && e !== void 0
-  ), b = (e, r) => {
-    const i = u(h({}, d), { [e]: r });
-    y(i), a(i);
+  ), g = (e, r) => {
+    const i = h(u({}, d), { [e]: r });
+    b(i), a(i);
   }, V = () => {
     const e = {};
     t.forEach((r) => {
       e[r.key] = "";
-    }), y(e), a(e);
-  }, v = (e) => {
-    const r = u(h({}, d), { [e]: "" });
-    y(r), a(r);
-  }, $ = Object.values(d).filter(
+    }), b(e), a(e);
+  }, $ = (e) => {
+    const r = h(u({}, d), { [e]: "" });
+    b(r), a(r);
+  }, k = Object.values(d).filter(
     (e) => e !== "" && e !== null && e !== void 0
   ).length;
   return /* @__PURE__ */ l(
     "div",
-    u(h({
+    h(u({
       className: `bg-surface-base border-b border-line-default ${S}`
     }, z), {
       children: /* @__PURE__ */ c(
@@ -73,23 +73,25 @@ function W(D) {
                 "button",
                 {
                   type: "button",
-                  onClick: () => A(!x),
+                  onClick: () => A(!y),
+                  "aria-expanded": y,
+                  "aria-controls": v,
                   className: `flex items-center ${o("sm", "gap")} text-sm font-medium text-fg-secondary hover:text-fg-primary`,
                   children: [
-                    /* @__PURE__ */ l(B, { className: "h-4 w-4" }),
+                    /* @__PURE__ */ l(X, { className: "h-4 w-4" }),
                     /* @__PURE__ */ l("span", { children: "Filters" }),
-                    $ > 0 && /* @__PURE__ */ l(
+                    k > 0 && /* @__PURE__ */ l(
                       "span",
                       {
                         className: `inline-flex items-center ${o("sm", "px")} ${o("0.5", "py")} rounded text-xs font-medium bg-surface-brand-muted text-fg-brand-emphasis`,
-                        children: $
+                        children: k
                       }
                     )
                   ]
                 }
               ),
               E && n && /* @__PURE__ */ l(
-                T,
+                q,
                 {
                   variant: "ghost",
                   size: "sm",
@@ -99,9 +101,10 @@ function W(D) {
                 }
               )
             ] }),
-            x && /* @__PURE__ */ l(
+            y && /* @__PURE__ */ l(
               "div",
               {
+                id: v,
                 className: `${o("base", "mt")} grid grid-cols-1 ${o("base", "gap")} sm:grid-cols-2 lg:grid-cols-3`,
                 children: t.map((e) => {
                   const r = d[e.key], i = r == null ? "" : String(r);
@@ -110,15 +113,15 @@ function W(D) {
                     {
                       className: o("xs", "space-y"),
                       children: [
-                        /* @__PURE__ */ l(X, { htmlFor: `filter-${e.key}`, variant: "optional", children: e.label }),
+                        /* @__PURE__ */ l(D, { htmlFor: `filter-${e.key}`, variant: "optional", children: e.label }),
                         /* @__PURE__ */ c("div", { className: "relative", children: [
                           e.type === "text" && /* @__PURE__ */ l(
-                            j,
+                            I,
                             {
                               id: `filter-${e.key}`,
                               type: "text",
                               value: i,
-                              onChange: (m) => b(e.key, m.target.value),
+                              onChange: (m) => g(e.key, m.target.value),
                               placeholder: e.placeholder || `Filter by ${e.label.toLowerCase()}`,
                               size: "sm",
                               variant: "outlined"
@@ -126,7 +129,7 @@ function W(D) {
                           ),
                           e.type === "select" && /* @__PURE__ */ c("div", { className: "relative", children: [
                             /* @__PURE__ */ l(
-                              q,
+                              G,
                               {
                                 id: `filter-${e.key}`,
                                 options: [
@@ -134,27 +137,27 @@ function W(D) {
                                   ...e.options || []
                                 ],
                                 value: i,
-                                onChange: (m) => b(e.key, m.target.value)
+                                onChange: (m) => g(e.key, m.target.value)
                               }
                             ),
                             i && /* @__PURE__ */ l(
                               "button",
                               {
                                 type: "button",
-                                onClick: () => v(e.key),
+                                onClick: () => $(e.key),
                                 className: "absolute right-8 top-1/2 -translate-y-1/2 text-fg-tertiary hover:text-fg-secondary",
                                 "aria-label": `Clear ${e.label} filter`,
-                                children: /* @__PURE__ */ l(w, { className: "h-4 w-4" })
+                                children: /* @__PURE__ */ l(j, { className: "h-4 w-4" })
                               }
                             )
                           ] }),
                           e.type === "date" && /* @__PURE__ */ l(
-                            j,
+                            I,
                             {
                               id: `filter-${e.key}`,
                               type: "date",
                               value: i,
-                              onChange: (m) => b(e.key, m.target.value),
+                              onChange: (m) => g(e.key, m.target.value),
                               size: "sm",
                               variant: "outlined"
                             }
@@ -163,10 +166,10 @@ function W(D) {
                             "button",
                             {
                               type: "button",
-                              onClick: () => v(e.key),
+                              onClick: () => $(e.key),
                               className: "absolute right-2 top-1/2 -translate-y-1/2 text-fg-tertiary hover:text-fg-secondary",
                               "aria-label": `Clear ${e.label} filter`,
-                              children: /* @__PURE__ */ l(w, { className: "h-4 w-4" })
+                              children: /* @__PURE__ */ l(j, { className: "h-4 w-4" })
                             }
                           )
                         ] })
@@ -184,6 +187,6 @@ function W(D) {
   );
 }
 export {
-  W as default
+  Z as default
 };
 //# sourceMappingURL=TableFilters.js.map

package/dist/granular/ui/components/Table/TableFilters/TableFilters.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableFilters.js","sources":["../../../../../../src/ui/components/Table/TableFilters/TableFilters.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes } from \"react\";\nimport { useState } from \"react\";\nimport { Input, Select, Label, Button } from \"../../../primitives\";\nimport { getSpacingClass } from \"../../../tokens/spacing\";\nimport { X, Filter } from \"lucide-react\";\n\nexport type FilterType = \"text\" | \"select\" | \"date\";\n\nexport interface FilterConfig {\n  key: string;\n  label: string;\n  type: FilterType;\n  options?: Array<{ value: string; label: string }>;\n  placeholder?: string;\n}\n\nexport type FilterValue = string | number | boolean | null | undefined;\n\nexport interface TableFiltersProps extends HTMLAttributes<HTMLDivElement> {\n  filters: FilterConfig[];\n  onFilter: (filters: Record<string, FilterValue>) => void;\n  initialValues?: Record<string, FilterValue>;\n  showClearAll?: boolean;\n}\n\n/**\n * TableFilters Component\n *\n * Filter controls for tables with support for text, select, and date filters.\n * Follows Atomic Design principles as a Molecule component.\n *\n * @example\n * ```tsx\n * <TableFilters\n *   filters={[\n *     { key: 'status', label: 'Status', type: 'select', options: [...] },\n *     { key: 'search', label: 'Search', type: 'text', placeholder: 'Search...' }\n *   ]}\n *   onFilter={(filters) => handleFilter(filters)}\n * />\n * ```\n */\nexport default function TableFilters({\n  filters,\n  onFilter,\n  initialValues = {},\n  showClearAll = true,\n  className = \"\",\n  ...props\n}: TableFiltersProps) {\n  const [filterValues, setFilterValues] =\n    useState<Record<string, FilterValue>>(initialValues);\n  const [isExpanded, setIsExpanded] = useState(false);\n\n  const hasActiveFilters = Object.values(filterValues).some(\n    (value) => value !== \"\" && value !== null && value !== undefined,\n  );\n\n  const handleFilterChange = (key: string, value: FilterValue) => {\n    const newFilters = { ...filterValues, [key]: value };\n    setFilterValues(newFilters);\n    onFilter(newFilters);\n  };\n\n  const handleClearAll = () => {\n    const clearedFilters: Record<string, FilterValue> = {};\n    filters.forEach((filter) => {\n      clearedFilters[filter.key] = \"\";\n    });\n    setFilterValues(clearedFilters);\n    onFilter(clearedFilters);\n  };\n\n  const handleClearFilter = (key: string) => {\n    const newFilters = { ...filterValues, [key]: \"\" };\n    setFilterValues(newFilters);\n    onFilter(newFilters);\n  };\n\n  const activeFilterCount = Object.values(filterValues).filter(\n    (value) => value !== \"\" && value !== null && value !== undefined,\n  ).length;\n\n  return (\n    <div\n      className={`bg-surface-base border-b border-line-default ${className}`}\n      {...props}\n    >\n      <div\n        className={`${getSpacingClass(\"base\", \"px\")} ${getSpacingClass(\"md\", \"py\")} sm:${getSpacingClass(\"lg\", \"px\")}`}\n      >\n        <div className=\"flex items-center justify-between\">\n          <button\n            type=\"button\"\n            onClick={() => setIsExpanded(!isExpanded)}\n            className={`flex items-center ${getSpacingClass(\"sm\", \"gap\")} text-sm font-medium text-fg-secondary hover:text-fg-primary`}\n          >\n            <Filter className=\"h-4 w-4\" />\n            <span>Filters</span>\n            {activeFilterCount > 0 && (\n              <span\n                className={`inline-flex items-center ${getSpacingClass(\"sm\", \"px\")} ${getSpacingClass(\"0.5\", \"py\")} rounded text-xs font-medium bg-surface-brand-muted text-fg-brand-emphasis`}\n              >\n                {activeFilterCount}\n              </span>\n            )}\n          </button>\n\n          {hasActiveFilters && showClearAll && (\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={handleClearAll}\n              className=\"text-sm\"\n            >\n              Clear all\n            </Button>\n          )}\n        </div>\n\n        {isExpanded && (\n          <div\n            className={`${getSpacingClass(\"base\", \"mt\")} grid grid-cols-1 ${getSpacingClass(\"base\", \"gap\")} sm:grid-cols-2 lg:grid-cols-3`}\n          >\n            {filters.map((filter) => {\n              const rawValue = filterValues[filter.key];\n              const value = rawValue == null ? \"\" : String(rawValue);\n\n              return (\n                <div\n                  key={filter.key}\n                  className={getSpacingClass(\"xs\", \"space-y\")}\n                >\n                  <Label htmlFor={`filter-${filter.key}`} variant=\"optional\">\n                    {filter.label}\n                  </Label>\n                  <div className=\"relative\">\n                    {filter.type === \"text\" && (\n                      <Input\n                        id={`filter-${filter.key}`}\n                        type=\"text\"\n                        value={value}\n                        onChange={(e) =>\n                          handleFilterChange(filter.key, e.target.value)\n                        }\n                        placeholder={\n                          filter.placeholder ||\n                          `Filter by ${filter.label.toLowerCase()}`\n                        }\n                        size=\"sm\"\n                        variant=\"outlined\"\n                      />\n                    )}\n\n                    {filter.type === \"select\" && (\n                      <div className=\"relative\">\n                        <Select\n                          id={`filter-${filter.key}`}\n                          options={[\n                            { value: \"\", label: `All ${filter.label}` },\n                            ...(filter.options || []),\n                          ]}\n                          value={value}\n                          onChange={(e) =>\n                            handleFilterChange(filter.key, e.target.value)\n                          }\n                        />\n                        {value && (\n                          <button\n                            type=\"button\"\n                            onClick={() => handleClearFilter(filter.key)}\n                            className=\"absolute right-8 top-1/2 -translate-y-1/2 text-fg-tertiary hover:text-fg-secondary\"\n                            aria-label={`Clear ${filter.label} filter`}\n                          >\n                            <X className=\"h-4 w-4\" />\n                          </button>\n                        )}\n                      </div>\n                    )}\n\n                    {filter.type === \"date\" && (\n                      <Input\n                        id={`filter-${filter.key}`}\n                        type=\"date\"\n                        value={value}\n                        onChange={(e) =>\n                          handleFilterChange(filter.key, e.target.value)\n                        }\n                        size=\"sm\"\n                        variant=\"outlined\"\n                      />\n                    )}\n\n                    {value && filter.type !== \"select\" && (\n                      <button\n                        type=\"button\"\n                        onClick={() => handleClearFilter(filter.key)}\n                        className=\"absolute right-2 top-1/2 -translate-y-1/2 text-fg-tertiary hover:text-fg-secondary\"\n                        aria-label={`Clear ${filter.label} filter`}\n                      >\n                        <X className=\"h-4 w-4\" />\n                      </button>\n                    )}\n                  </div>\n                </div>\n              );\n            })}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["TableFilters","_a","_b","filters","onFilter","initialValues","showClearAll","className","props","__objRest","filterValues","setFilterValues","useState","isExpanded","setIsExpanded","hasActiveFilters","value","handleFilterChange","key","newFilters","__spreadProps","__spreadValues","handleClearAll","clearedFilters","filter","handleClearFilter","activeFilterCount","jsx","jsxs","getSpacingClass","Filter","Button","rawValue","Label","Input","e","Select","X"],"mappings":"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"}
+{"version":3,"file":"TableFilters.js","sources":["../../../../../../src/ui/components/Table/TableFilters/TableFilters.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes } from \"react\";\nimport { useState, useId } from \"react\";\nimport { Input, Select, Label, Button } from \"../../../primitives\";\nimport { getSpacingClass } from \"../../../tokens/spacing\";\nimport { X, Filter } from \"lucide-react\";\n\nexport type FilterType = \"text\" | \"select\" | \"date\";\n\nexport interface FilterConfig {\n  key: string;\n  label: string;\n  type: FilterType;\n  options?: Array<{ value: string; label: string }>;\n  placeholder?: string;\n}\n\nexport type FilterValue = string | number | boolean | null | undefined;\n\nexport interface TableFiltersProps extends HTMLAttributes<HTMLDivElement> {\n  filters: FilterConfig[];\n  onFilter: (filters: Record<string, FilterValue>) => void;\n  initialValues?: Record<string, FilterValue>;\n  showClearAll?: boolean;\n}\n\n/**\n * TableFilters Component\n *\n * Filter controls for tables with support for text, select, and date filters.\n *\n * @example\n * ```tsx\n * <TableFilters\n *   filters={[\n *     { key: 'status', label: 'Status', type: 'select', options: [...] },\n *     { key: 'search', label: 'Search', type: 'text', placeholder: 'Search...' }\n *   ]}\n *   onFilter={(filters) => handleFilter(filters)}\n * />\n * ```\n */\nexport default function TableFilters({\n  filters,\n  onFilter,\n  initialValues = {},\n  showClearAll = true,\n  className = \"\",\n  ...props\n}: TableFiltersProps) {\n  const [filterValues, setFilterValues] =\n    useState<Record<string, FilterValue>>(initialValues);\n  const [isExpanded, setIsExpanded] = useState(false);\n  const panelId = `table-filters-panel-${useId()}`;\n\n  const hasActiveFilters = Object.values(filterValues).some(\n    (value) => value !== \"\" && value !== null && value !== undefined,\n  );\n\n  const handleFilterChange = (key: string, value: FilterValue) => {\n    const newFilters = { ...filterValues, [key]: value };\n    setFilterValues(newFilters);\n    onFilter(newFilters);\n  };\n\n  const handleClearAll = () => {\n    const clearedFilters: Record<string, FilterValue> = {};\n    filters.forEach((filter) => {\n      clearedFilters[filter.key] = \"\";\n    });\n    setFilterValues(clearedFilters);\n    onFilter(clearedFilters);\n  };\n\n  const handleClearFilter = (key: string) => {\n    const newFilters = { ...filterValues, [key]: \"\" };\n    setFilterValues(newFilters);\n    onFilter(newFilters);\n  };\n\n  const activeFilterCount = Object.values(filterValues).filter(\n    (value) => value !== \"\" && value !== null && value !== undefined,\n  ).length;\n\n  return (\n    <div\n      className={`bg-surface-base border-b border-line-default ${className}`}\n      {...props}\n    >\n      <div\n        className={`${getSpacingClass(\"base\", \"px\")} ${getSpacingClass(\"md\", \"py\")} sm:${getSpacingClass(\"lg\", \"px\")}`}\n      >\n        <div className=\"flex items-center justify-between\">\n          <button\n            type=\"button\"\n            onClick={() => setIsExpanded(!isExpanded)}\n            aria-expanded={isExpanded}\n            aria-controls={panelId}\n            className={`flex items-center ${getSpacingClass(\"sm\", \"gap\")} text-sm font-medium text-fg-secondary hover:text-fg-primary`}\n          >\n            <Filter className=\"h-4 w-4\" />\n            <span>Filters</span>\n            {activeFilterCount > 0 && (\n              <span\n                className={`inline-flex items-center ${getSpacingClass(\"sm\", \"px\")} ${getSpacingClass(\"0.5\", \"py\")} rounded text-xs font-medium bg-surface-brand-muted text-fg-brand-emphasis`}\n              >\n                {activeFilterCount}\n              </span>\n            )}\n          </button>\n\n          {hasActiveFilters && showClearAll && (\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={handleClearAll}\n              className=\"text-sm\"\n            >\n              Clear all\n            </Button>\n          )}\n        </div>\n\n        {isExpanded && (\n          <div\n            id={panelId}\n            className={`${getSpacingClass(\"base\", \"mt\")} grid grid-cols-1 ${getSpacingClass(\"base\", \"gap\")} sm:grid-cols-2 lg:grid-cols-3`}\n          >\n            {filters.map((filter) => {\n              const rawValue = filterValues[filter.key];\n              const value = rawValue == null ? \"\" : String(rawValue);\n\n              return (\n                <div\n                  key={filter.key}\n                  className={getSpacingClass(\"xs\", \"space-y\")}\n                >\n                  <Label htmlFor={`filter-${filter.key}`} variant=\"optional\">\n                    {filter.label}\n                  </Label>\n                  <div className=\"relative\">\n                    {filter.type === \"text\" && (\n                      <Input\n                        id={`filter-${filter.key}`}\n                        type=\"text\"\n                        value={value}\n                        onChange={(e) =>\n                          handleFilterChange(filter.key, e.target.value)\n                        }\n                        placeholder={\n                          filter.placeholder ||\n                          `Filter by ${filter.label.toLowerCase()}`\n                        }\n                        size=\"sm\"\n                        variant=\"outlined\"\n                      />\n                    )}\n\n                    {filter.type === \"select\" && (\n                      <div className=\"relative\">\n                        <Select\n                          id={`filter-${filter.key}`}\n                          options={[\n                            { value: \"\", label: `All ${filter.label}` },\n                            ...(filter.options || []),\n                          ]}\n                          value={value}\n                          onChange={(e) =>\n                            handleFilterChange(filter.key, e.target.value)\n                          }\n                        />\n                        {value && (\n                          <button\n                            type=\"button\"\n                            onClick={() => handleClearFilter(filter.key)}\n                            className=\"absolute right-8 top-1/2 -translate-y-1/2 text-fg-tertiary hover:text-fg-secondary\"\n                            aria-label={`Clear ${filter.label} filter`}\n                          >\n                            <X className=\"h-4 w-4\" />\n                          </button>\n                        )}\n                      </div>\n                    )}\n\n                    {filter.type === \"date\" && (\n                      <Input\n                        id={`filter-${filter.key}`}\n                        type=\"date\"\n                        value={value}\n                        onChange={(e) =>\n                          handleFilterChange(filter.key, e.target.value)\n                        }\n                        size=\"sm\"\n                        variant=\"outlined\"\n                      />\n                    )}\n\n                    {value && filter.type !== \"select\" && (\n                      <button\n                        type=\"button\"\n                        onClick={() => handleClearFilter(filter.key)}\n                        className=\"absolute right-2 top-1/2 -translate-y-1/2 text-fg-tertiary hover:text-fg-secondary\"\n                        aria-label={`Clear ${filter.label} filter`}\n                      >\n                        <X className=\"h-4 w-4\" />\n                      </button>\n                    )}\n                  </div>\n                </div>\n              );\n            })}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["TableFilters","_a","_b","filters","onFilter","initialValues","showClearAll","className","props","__objRest","filterValues","setFilterValues","useState","isExpanded","setIsExpanded","panelId","useId","hasActiveFilters","value","handleFilterChange","key","newFilters","__spreadProps","__spreadValues","handleClearAll","clearedFilters","filter","handleClearFilter","activeFilterCount","jsx","jsxs","getSpacingClass","Filter","Button","rawValue","Label","Input","e","Select","X"],"mappings":"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"}

package/dist/granular/ui/components/Table/TablePagination/TablePagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"TablePagination.js","sources":["../../../../../../src/ui/components/Table/TablePagination/TablePagination.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes } from \"react\";\nimport { Button, Select, Text } from \"../../../primitives\";\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\nimport { getSpacingClass } from \"../../../tokens/spacing\";\n\nexport interface TablePaginationProps extends HTMLAttributes<HTMLDivElement> {\n  page: number;\n  pageSize: number;\n  total: number;\n  onPageChange: (page: number) => void;\n  onPageSizeChange: (size: number) => void;\n  pageSizeOptions?: number[];\n  showPageSizeSelector?: boolean;\n  showPageInfo?: boolean;\n}\n\n/**\n * TablePagination Component\n *\n * Pagination controls for tables with page navigation and page size selection.\n * Follows Atomic Design principles as a Molecule component.\n *\n * @example\n * ```tsx\n * <TablePagination\n *   page={1}\n *   pageSize={10}\n *   total={100}\n *   onPageChange={(page) => setPage(page)}\n *   onPageSizeChange={(size) => setPageSize(size)}\n * />\n * ```\n */\nexport default function TablePagination({\n  page,\n  pageSize,\n  total,\n  onPageChange,\n  onPageSizeChange,\n  pageSizeOptions = [10, 25, 50, 100],\n  showPageSizeSelector = true,\n  showPageInfo = true,\n  className = \"\",\n  ...props\n}: TablePaginationProps) {\n  const totalPages = Math.ceil(total / pageSize);\n  const startItem = total === 0 ? 0 : (page - 1) * pageSize + 1;\n  const endItem = Math.min(page * pageSize, total);\n\n  const handlePrevious = () => {\n    if (page > 1) {\n      onPageChange(page - 1);\n    }\n  };\n\n  const handleNext = () => {\n    if (page < totalPages) {\n      onPageChange(page + 1);\n    }\n  };\n\n  const handleFirst = () => {\n    if (page > 1) {\n      onPageChange(1);\n    }\n  };\n\n  const handleLast = () => {\n    if (page < totalPages) {\n      onPageChange(totalPages);\n    }\n  };\n\n  return (\n    <div\n      className={`flex items-center justify-between ${getSpacingClass(\"base\", \"px\")} ${getSpacingClass(\"md\", \"py\")} bg-surface-base border-t border-line-default sm:${getSpacingClass(\"lg\", \"px\")} ${className}`}\n      {...props}\n    >\n      <div className=\"flex flex-1 justify-between sm:hidden\">\n        <Button\n          variant=\"outline\"\n          size=\"sm\"\n          onClick={handlePrevious}\n          disabled={page === 1}\n        >\n          Previous\n        </Button>\n        <Button\n          variant=\"outline\"\n          size=\"sm\"\n          onClick={handleNext}\n          disabled={page >= totalPages}\n        >\n          Next\n        </Button>\n      </div>\n\n      <div className=\"hidden sm:flex sm:flex-1 sm:items-center sm:justify-between\">\n        {showPageInfo && (\n          <div>\n            <Text as=\"p\" className=\"text-sm text-fg-secondary\">\n              Showing <span className=\"font-medium\">{startItem}</span> to{\" \"}\n              <span className=\"font-medium\">{endItem}</span> of{\" \"}\n              <span className=\"font-medium\">{total}</span> results\n            </Text>\n          </div>\n        )}\n\n        <div className={`flex items-center ${getSpacingClass(\"base\", \"gap\")}`}>\n          {showPageSizeSelector && (\n            <div\n              className={`flex items-center ${getSpacingClass(\"sm\", \"gap\")}`}\n            >\n              <Text as=\"span\" className=\"text-sm text-fg-secondary\">\n                Show:\n              </Text>\n              <Select\n                aria-label=\"Items per page\"\n                options={pageSizeOptions.map((size) => ({\n                  value: size.toString(),\n                  label: size.toString(),\n                }))}\n                value={pageSize.toString()}\n                onChange={(e) => {\n                  const newSize = parseInt(e.target.value);\n                  onPageSizeChange(newSize);\n                  // Reset to first page when changing page size\n                  onPageChange(1);\n                }}\n                className=\"w-20\"\n              />\n            </div>\n          )}\n\n          <nav\n            className={`flex items-center ${getSpacingClass(\"xs\", \"gap\")}`}\n            aria-label=\"Pagination\"\n          >\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={handleFirst}\n              disabled={page === 1}\n              aria-label=\"First page\"\n            >\n              <ChevronLeft className=\"h-4 w-4\" />\n              <ChevronLeft className=\"h-4 w-4 -ml-2\" />\n            </Button>\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={handlePrevious}\n              disabled={page === 1}\n              aria-label=\"Previous page\"\n            >\n              <ChevronLeft className=\"h-4 w-4\" />\n            </Button>\n\n            <div\n              className={`flex items-center ${getSpacingClass(\"xs\", \"gap\")}`}\n            >\n              {Array.from({ length: Math.min(5, totalPages) }, (_, i) => {\n                let pageNum: number;\n                if (totalPages <= 5) {\n                  pageNum = i + 1;\n                } else if (page <= 3) {\n                  pageNum = i + 1;\n                } else if (page >= totalPages - 2) {\n                  pageNum = totalPages - 4 + i;\n                } else {\n                  pageNum = page - 2 + i;\n                }\n\n                return (\n                  <Button\n                    key={pageNum}\n                    variant={page === pageNum ? \"primary\" : \"ghost\"}\n                    size=\"sm\"\n                    onClick={() => onPageChange(pageNum)}\n                    className=\"min-w-10\"\n                    aria-label={`Page ${pageNum}`}\n                    aria-current={page === pageNum ? \"page\" : undefined}\n                  >\n                    {pageNum}\n                  </Button>\n                );\n              })}\n            </div>\n\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={handleNext}\n              disabled={page >= totalPages}\n              aria-label=\"Next page\"\n            >\n              <ChevronRight className=\"h-4 w-4\" />\n            </Button>\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={handleLast}\n              disabled={page >= totalPages}\n              aria-label=\"Last page\"\n            >\n              <ChevronRight className=\"h-4 w-4\" />\n              <ChevronRight className=\"h-4 w-4 -ml-2\" />\n            </Button>\n          </nav>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["TablePagination","_a","_b","page","pageSize","total","onPageChange","onPageSizeChange","pageSizeOptions","showPageSizeSelector","showPageInfo","className","props","__objRest","totalPages","startItem","endItem","handlePrevious","handleNext","handleFirst","handleLast","jsxs","__spreadProps","__spreadValues","getSpacingClass","jsx","Button","Text","Select","size","e","newSize","ChevronLeft","_","i","pageNum","ChevronRight"],"mappings":"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"}
+{"version":3,"file":"TablePagination.js","sources":["../../../../../../src/ui/components/Table/TablePagination/TablePagination.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes } from \"react\";\nimport { Button, Select, Text } from \"../../../primitives\";\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\nimport { getSpacingClass } from \"../../../tokens/spacing\";\n\nexport interface TablePaginationProps extends HTMLAttributes<HTMLDivElement> {\n  page: number;\n  pageSize: number;\n  total: number;\n  onPageChange: (page: number) => void;\n  onPageSizeChange: (size: number) => void;\n  pageSizeOptions?: number[];\n  showPageSizeSelector?: boolean;\n  showPageInfo?: boolean;\n}\n\n/**\n * TablePagination Component\n *\n * Pagination controls for tables with page navigation and page size selection.\n *\n * @example\n * ```tsx\n * <TablePagination\n *   page={1}\n *   pageSize={10}\n *   total={100}\n *   onPageChange={(page) => setPage(page)}\n *   onPageSizeChange={(size) => setPageSize(size)}\n * />\n * ```\n */\nexport default function TablePagination({\n  page,\n  pageSize,\n  total,\n  onPageChange,\n  onPageSizeChange,\n  pageSizeOptions = [10, 25, 50, 100],\n  showPageSizeSelector = true,\n  showPageInfo = true,\n  className = \"\",\n  ...props\n}: TablePaginationProps) {\n  const totalPages = Math.ceil(total / pageSize);\n  const startItem = total === 0 ? 0 : (page - 1) * pageSize + 1;\n  const endItem = Math.min(page * pageSize, total);\n\n  const handlePrevious = () => {\n    if (page > 1) {\n      onPageChange(page - 1);\n    }\n  };\n\n  const handleNext = () => {\n    if (page < totalPages) {\n      onPageChange(page + 1);\n    }\n  };\n\n  const handleFirst = () => {\n    if (page > 1) {\n      onPageChange(1);\n    }\n  };\n\n  const handleLast = () => {\n    if (page < totalPages) {\n      onPageChange(totalPages);\n    }\n  };\n\n  return (\n    <div\n      className={`flex items-center justify-between ${getSpacingClass(\"base\", \"px\")} ${getSpacingClass(\"md\", \"py\")} bg-surface-base border-t border-line-default sm:${getSpacingClass(\"lg\", \"px\")} ${className}`}\n      {...props}\n    >\n      <div className=\"flex flex-1 justify-between sm:hidden\">\n        <Button\n          variant=\"outline\"\n          size=\"sm\"\n          onClick={handlePrevious}\n          disabled={page === 1}\n        >\n          Previous\n        </Button>\n        <Button\n          variant=\"outline\"\n          size=\"sm\"\n          onClick={handleNext}\n          disabled={page >= totalPages}\n        >\n          Next\n        </Button>\n      </div>\n\n      <div className=\"hidden sm:flex sm:flex-1 sm:items-center sm:justify-between\">\n        {showPageInfo && (\n          <div>\n            <Text as=\"p\" className=\"text-sm text-fg-secondary\">\n              Showing <span className=\"font-medium\">{startItem}</span> to{\" \"}\n              <span className=\"font-medium\">{endItem}</span> of{\" \"}\n              <span className=\"font-medium\">{total}</span> results\n            </Text>\n          </div>\n        )}\n\n        <div className={`flex items-center ${getSpacingClass(\"base\", \"gap\")}`}>\n          {showPageSizeSelector && (\n            <div\n              className={`flex items-center ${getSpacingClass(\"sm\", \"gap\")}`}\n            >\n              <Text as=\"span\" className=\"text-sm text-fg-secondary\">\n                Show:\n              </Text>\n              <Select\n                aria-label=\"Items per page\"\n                options={pageSizeOptions.map((size) => ({\n                  value: size.toString(),\n                  label: size.toString(),\n                }))}\n                value={pageSize.toString()}\n                onChange={(e) => {\n                  const newSize = parseInt(e.target.value);\n                  onPageSizeChange(newSize);\n                  // Reset to first page when changing page size\n                  onPageChange(1);\n                }}\n                className=\"w-20\"\n              />\n            </div>\n          )}\n\n          <nav\n            className={`flex items-center ${getSpacingClass(\"xs\", \"gap\")}`}\n            aria-label=\"Pagination\"\n          >\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={handleFirst}\n              disabled={page === 1}\n              aria-label=\"First page\"\n            >\n              <ChevronLeft className=\"h-4 w-4\" />\n              <ChevronLeft className=\"h-4 w-4 -ml-2\" />\n            </Button>\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={handlePrevious}\n              disabled={page === 1}\n              aria-label=\"Previous page\"\n            >\n              <ChevronLeft className=\"h-4 w-4\" />\n            </Button>\n\n            <div\n              className={`flex items-center ${getSpacingClass(\"xs\", \"gap\")}`}\n            >\n              {Array.from({ length: Math.min(5, totalPages) }, (_, i) => {\n                let pageNum: number;\n                if (totalPages <= 5) {\n                  pageNum = i + 1;\n                } else if (page <= 3) {\n                  pageNum = i + 1;\n                } else if (page >= totalPages - 2) {\n                  pageNum = totalPages - 4 + i;\n                } else {\n                  pageNum = page - 2 + i;\n                }\n\n                return (\n                  <Button\n                    key={pageNum}\n                    variant={page === pageNum ? \"primary\" : \"ghost\"}\n                    size=\"sm\"\n                    onClick={() => onPageChange(pageNum)}\n                    className=\"min-w-10\"\n                    aria-label={`Page ${pageNum}`}\n                    aria-current={page === pageNum ? \"page\" : undefined}\n                  >\n                    {pageNum}\n                  </Button>\n                );\n              })}\n            </div>\n\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={handleNext}\n              disabled={page >= totalPages}\n              aria-label=\"Next page\"\n            >\n              <ChevronRight className=\"h-4 w-4\" />\n            </Button>\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={handleLast}\n              disabled={page >= totalPages}\n              aria-label=\"Last page\"\n            >\n              <ChevronRight className=\"h-4 w-4\" />\n              <ChevronRight className=\"h-4 w-4 -ml-2\" />\n            </Button>\n          </nav>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["TablePagination","_a","_b","page","pageSize","total","onPageChange","onPageSizeChange","pageSizeOptions","showPageSizeSelector","showPageInfo","className","props","__objRest","totalPages","startItem","endItem","handlePrevious","handleNext","handleFirst","handleLast","jsxs","__spreadProps","__spreadValues","getSpacingClass","jsx","Button","Text","Select","size","e","newSize","ChevronLeft","_","i","pageNum","ChevronRight"],"mappings":"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"}