uikit-react-public 0.36.0 → 0.37.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/dist/components/Table/Table.context.d.ts +6 -0
  2. package/dist/components/Table/Table.d.ts +4 -3
  3. package/dist/components/Table/Table.stories.d.ts +3 -3
  4. package/dist/components/Table/Table.types.d.ts +6 -0
  5. package/dist/components/Table/index.d.ts +1 -1
  6. package/dist/components/Table/subcomponents/Cell/Cell.d.ts +8 -1
  7. package/dist/components/Table/subcomponents/Cell/Cell.stories.d.ts +5 -1
  8. package/dist/components/Table/subcomponents/Cell/CellContent.d.ts +3 -2
  9. package/dist/components/Table/subcomponents/HeadCell/HeadCell.d.ts +4 -2
  10. package/dist/components/Table/subcomponents/HeadCell/HeadCell.stories.d.ts +3 -1
  11. package/dist/components/Table/subcomponents/Row.d.ts +8 -1
  12. package/dist/index.js +6564 -6194
  13. package/lib/components/Snackbar/Snackbar.tsx +2 -3
  14. package/lib/components/Snackbar/__tests__/__snapshots__/Snackbar.test.tsx.snap +2 -2
  15. package/lib/components/Table/Table.context.ts +12 -0
  16. package/lib/components/Table/Table.tsx +91 -12
  17. package/lib/components/Table/Table.types.ts +21 -0
  18. package/lib/components/Table/__tests__/Table.test.tsx +95 -1
  19. package/lib/components/Table/__tests__/__snapshots__/Table.test.tsx.snap +54 -13
  20. package/lib/components/Table/index.ts +6 -1
  21. package/lib/components/Table/subcomponents/Body.tsx +16 -3
  22. package/lib/components/Table/subcomponents/Cell/Cell.tsx +193 -4
  23. package/lib/components/Table/subcomponents/Cell/CellContent.tsx +63 -3
  24. package/lib/components/Table/subcomponents/Cell/__tests__/__snapshots__/Cell.test.tsx.snap +15 -10
  25. package/lib/components/Table/subcomponents/Head.tsx +14 -3
  26. package/lib/components/Table/subcomponents/HeadCell/HeadCell.tsx +17 -4
  27. package/lib/components/Table/subcomponents/HeadCell/__tests__/__snapshots__/HeadCell.test.tsx.snap +3 -3
  28. package/lib/components/Table/subcomponents/Row.tsx +195 -6
  29. package/lib/components/Table/subcomponents/SortIcon.tsx +4 -4
  30. package/lib/theme/__tests__/useTheme.test.tsx +2 -2
  31. package/lib/theme/useTheme.tsx +1 -1
  32. package/package.json +1 -1
@@ -0,0 +1,6 @@
1
+ import { TableColumnMetadata } from './Table.types';
2
+ export type TableContextValue = {
3
+ columns: TableColumnMetadata[];
4
+ };
5
+ export declare const TableContextProvider: import('react').Provider<TableContextValue>;
6
+ export declare const useTableContext: () => TableContextValue;
@@ -1,10 +1,11 @@
1
1
  import { TableProps } from './Table.types';
2
+ import { TableHeadCellProps } from './subcomponents';
2
3
  declare const Table: {
3
4
  ({ testId, className, children, ref, ariaLabel, ...props }: TableProps): import("react").JSX.Element;
4
5
  Head: ({ className, children, ...props }: import('./subcomponents').TableHeadProps) => import("react").JSX.Element;
5
- HeadCell: ({ variant, accessor, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, checkboxAriaLabel, ...props }: import('./subcomponents').TableHeadCellProps) => import("react").JSX.Element;
6
+ HeadCell: ({ variant, accessor, mobileRole, mobileLabel, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, checkboxAriaLabel, ...props }: TableHeadCellProps) => import("react").JSX.Element;
6
7
  Body: ({ className, children, ...props }: import('./subcomponents').TableBodyProps) => import("react").JSX.Element;
7
- Row: ({ selected, className, children, ...props }: import('./subcomponents').TableRowProps) => import("react").JSX.Element;
8
- Cell: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, checkboxProps, buttonProps, ...props }: import('./subcomponents').TableCellProps) => import("react").JSX.Element;
8
+ Row: ({ selected, mobileExpanded, defaultMobileExpanded, mobileCollapsible, mobileDetailsLabel, mobileExpandLabel, mobileCollapseLabel, onMobileExpandedChange, className, children, ...props }: import('./subcomponents').TableRowProps) => import("react").JSX.Element;
9
+ Cell: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, checkboxProps, buttonProps, __mobileColumnIndex, __mobileHasSelection, __mobileHasPrimaryMeta, __mobileIsFirstBodyField, ...props }: import('./subcomponents').TableCellProps) => import("react").JSX.Element;
9
10
  };
10
11
  export default Table;
@@ -4,10 +4,10 @@ declare const meta: {
4
4
  component: {
5
5
  ({ testId, className, children, ref, ariaLabel, ...props }: import('./Table.types').TableProps): import("react").JSX.Element;
6
6
  Head: ({ className, children, ...props }: import('./subcomponents').TableHeadProps) => import("react").JSX.Element;
7
- HeadCell: ({ variant, accessor, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, checkboxAriaLabel, ...props }: import('./subcomponents').TableHeadCellProps) => import("react").JSX.Element;
7
+ HeadCell: ({ variant, accessor, mobileRole, mobileLabel, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, checkboxAriaLabel, ...props }: import('./subcomponents').TableHeadCellProps) => import("react").JSX.Element;
8
8
  Body: ({ className, children, ...props }: import('./subcomponents').TableBodyProps) => import("react").JSX.Element;
9
- Row: ({ selected, className, children, ...props }: import('./subcomponents').TableRowProps) => import("react").JSX.Element;
10
- Cell: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, checkboxProps, buttonProps, ...props }: import('./subcomponents').TableCellProps) => import("react").JSX.Element;
9
+ Row: ({ selected, mobileExpanded, defaultMobileExpanded, mobileCollapsible, mobileDetailsLabel, mobileExpandLabel, mobileCollapseLabel, onMobileExpandedChange, className, children, ...props }: import('./subcomponents').TableRowProps) => import("react").JSX.Element;
10
+ Cell: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, checkboxProps, buttonProps, __mobileColumnIndex, __mobileHasSelection, __mobileHasPrimaryMeta, __mobileIsFirstBodyField, ...props }: import('./subcomponents').TableCellProps) => import("react").JSX.Element;
11
11
  };
12
12
  parameters: {
13
13
  layout: string;
@@ -1,5 +1,11 @@
1
1
  export type ColumnVariant = 'default' | 'numeric' | 'checkbox' | 'button';
2
2
  export type SortOrder = 'asc' | 'desc' | null;
3
+ export type TableMobileRole = 'selection' | 'primaryMeta' | 'primary' | 'status' | 'primaryStatus' | 'field' | 'primaryAction' | 'contextMenu' | 'hidden';
4
+ export type NormalizedTableMobileRole = Exclude<TableMobileRole, 'primaryStatus'>;
5
+ export type TableColumnMetadata = {
6
+ mobileRole: NormalizedTableMobileRole;
7
+ mobileLabel?: string;
8
+ };
3
9
  export type SortPattern = {
4
10
  accessor: string | null;
5
11
  order: SortOrder;
@@ -1,3 +1,3 @@
1
1
  export { default } from './Table';
2
- export type { TableProps, ColumnVariant } from './Table.types';
2
+ export type { TableProps, ColumnVariant, TableMobileRole, TableColumnMetadata, } from './Table.types';
3
3
  export type { TableHeadProps, TableHeadCellProps, TableBodyProps, TableRowProps, TableCellProps, } from './subcomponents';
@@ -11,6 +11,13 @@ export interface TableCellProps extends React.HTMLAttributes<HTMLTableCellElemen
11
11
  testId?: string;
12
12
  checkboxProps?: Omit<CheckboxProps, 'checked' | 'onChange'>;
13
13
  buttonProps?: Omit<ButtonProps<'button'>, 'variant' | 'onClick' | 'className'>;
14
+ /** @internal */
15
+ __mobileColumnIndex?: number;
16
+ __mobileHasSelection?: boolean;
17
+ /** @internal */
18
+ __mobileHasPrimaryMeta?: boolean;
19
+ /** @internal */
20
+ __mobileIsFirstBodyField?: boolean;
14
21
  }
15
- declare const Cell: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, checkboxProps, buttonProps, ...props }: TableCellProps) => import("react").JSX.Element;
22
+ declare const Cell: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, checkboxProps, buttonProps, __mobileColumnIndex, __mobileHasSelection, __mobileHasPrimaryMeta, __mobileIsFirstBodyField, ...props }: TableCellProps) => import("react").JSX.Element;
16
23
  export default Cell;
@@ -1,7 +1,7 @@
1
1
  import { StoryObj } from '@storybook/react-vite';
2
2
  declare const meta: {
3
3
  title: string;
4
- component: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, checkboxProps, buttonProps, ...props }: import('./Cell').TableCellProps) => import("react").JSX.Element;
4
+ component: ({ variant, icon, onCheck, checked, onButtonClick, testId, className, children, checkboxProps, buttonProps, __mobileColumnIndex, __mobileHasSelection, __mobileHasPrimaryMeta, __mobileIsFirstBodyField, ...props }: import('./Cell').TableCellProps) => import("react").JSX.Element;
5
5
  parameters: {
6
6
  layout: string;
7
7
  };
@@ -19,6 +19,10 @@ declare const meta: {
19
19
  testId?: string | undefined;
20
20
  checkboxProps?: Omit<import('../../..').CheckboxProps, "checked" | "onChange"> | undefined;
21
21
  buttonProps?: Omit<import('../../..').ButtonProps<"button">, "variant" | "onClick" | "className"> | undefined;
22
+ __mobileColumnIndex?: number | undefined;
23
+ __mobileHasSelection?: boolean | undefined;
24
+ __mobileHasPrimaryMeta?: boolean | undefined;
25
+ __mobileIsFirstBodyField?: boolean | undefined;
22
26
  defaultChecked?: boolean | undefined | undefined;
23
27
  defaultValue?: string | number | readonly string[] | undefined;
24
28
  suppressContentEditableWarning?: boolean | undefined | undefined;
@@ -1,8 +1,9 @@
1
1
  import { CheckboxProps } from '../../../Checkbox/Checkbox';
2
2
  import { ButtonProps } from '../../../Button';
3
- import { ColumnVariant } from '../../Table.types';
3
+ import { ColumnVariant, NormalizedTableMobileRole } from '../../Table.types';
4
4
  interface CellContentProps extends React.HTMLAttributes<HTMLDivElement> {
5
5
  variant: ColumnVariant;
6
+ mobileRole: NormalizedTableMobileRole;
6
7
  icon?: React.ReactNode;
7
8
  checked?: boolean;
8
9
  checkboxProps?: Omit<CheckboxProps, 'checked' | 'onChange'>;
@@ -10,5 +11,5 @@ interface CellContentProps extends React.HTMLAttributes<HTMLDivElement> {
10
11
  handleCheckboxChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
11
12
  handleButtonClick: (event: React.UIEvent) => void;
12
13
  }
13
- declare const CellContent: ({ variant, icon, checked, checkboxProps, buttonProps, handleCheckboxChange, handleButtonClick, children, }: CellContentProps) => import("react").JSX.Element;
14
+ declare const CellContent: ({ variant, mobileRole, icon, checked, checkboxProps, buttonProps, handleCheckboxChange, handleButtonClick, children, }: CellContentProps) => import("react").JSX.Element;
14
15
  export default CellContent;
@@ -1,7 +1,9 @@
1
- import { ColumnVariant, SortOrder } from '../../Table.types';
1
+ import { ColumnVariant, SortOrder, TableMobileRole } from '../../Table.types';
2
2
  export interface TableHeadCellProps extends React.HTMLAttributes<HTMLTableCellElement> {
3
3
  variant?: ColumnVariant;
4
4
  accessor?: string;
5
+ mobileRole?: TableMobileRole;
6
+ mobileLabel?: string;
5
7
  sort?: SortOrder;
6
8
  onSortChange?: (accessor: string, sort: SortOrder, event: React.UIEvent) => void;
7
9
  showSortIcon?: boolean;
@@ -10,5 +12,5 @@ export interface TableHeadCellProps extends React.HTMLAttributes<HTMLTableCellEl
10
12
  testId?: string;
11
13
  checkboxAriaLabel?: string;
12
14
  }
13
- declare const HeadCell: ({ variant, accessor, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, checkboxAriaLabel, ...props }: TableHeadCellProps) => import("react").JSX.Element;
15
+ declare const HeadCell: ({ variant, accessor, mobileRole, mobileLabel, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, checkboxAriaLabel, ...props }: TableHeadCellProps) => import("react").JSX.Element;
14
16
  export default HeadCell;
@@ -2,7 +2,7 @@ import { StoryObj } from '@storybook/react-vite';
2
2
  import { SortOrder } from '../../Table.types';
3
3
  declare const meta: {
4
4
  title: string;
5
- component: ({ variant, accessor, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, checkboxAriaLabel, ...props }: import('./HeadCell').TableHeadCellProps) => import("react").JSX.Element;
5
+ component: ({ variant, accessor, mobileRole, mobileLabel, sort, onSortChange, showSortIcon, checked, onCheck, testId, className, children, checkboxAriaLabel, ...props }: import('./HeadCell').TableHeadCellProps) => import("react").JSX.Element;
6
6
  parameters: {
7
7
  layout: string;
8
8
  };
@@ -17,6 +17,8 @@ declare const meta: {
17
17
  decorators: ((Story: import('storybook/internal/csf').PartialStoryFn<import('@storybook/react').ReactRenderer, {
18
18
  variant?: import('../..').ColumnVariant | undefined;
19
19
  accessor?: string | undefined;
20
+ mobileRole?: import('../..').TableMobileRole | undefined;
21
+ mobileLabel?: string | undefined;
20
22
  sort?: SortOrder | undefined;
21
23
  onSortChange?: ((accessor: string, sort: SortOrder, event: React.UIEvent) => void) | undefined;
22
24
  showSortIcon?: boolean | undefined;
@@ -1,5 +1,12 @@
1
1
  export interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement> {
2
2
  selected?: boolean;
3
+ mobileExpanded?: boolean;
4
+ defaultMobileExpanded?: boolean;
5
+ mobileCollapsible?: boolean;
6
+ mobileDetailsLabel?: string;
7
+ mobileExpandLabel?: string;
8
+ mobileCollapseLabel?: string;
9
+ onMobileExpandedChange?: (expanded: boolean) => void;
3
10
  }
4
- declare const Row: ({ selected, className, children, ...props }: TableRowProps) => import("react").JSX.Element;
11
+ declare const Row: ({ selected, mobileExpanded, defaultMobileExpanded, mobileCollapsible, mobileDetailsLabel, mobileExpandLabel, mobileCollapseLabel, onMobileExpandedChange, className, children, ...props }: TableRowProps) => import("react").JSX.Element;
5
12
  export default Row;