@economic/taco 2.22.2 → 2.24.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 (150) hide show
  1. package/dist/components/Card/Card.d.ts +1 -0
  2. package/dist/components/Checkbox/Checkbox.d.ts +2 -0
  3. package/dist/components/OverflowGroup/OverflowGroup.d.ts +1 -1
  4. package/dist/components/Provider/Localization.d.ts +4 -0
  5. package/dist/components/Report/Report.d.ts +2 -0
  6. package/dist/components/Report/components/Body/Body.d.ts +0 -1
  7. package/dist/components/Report/components/Body/EmptyStateBody.d.ts +7 -0
  8. package/dist/components/Report/components/Cell/util.d.ts +1 -1
  9. package/dist/components/Report/components/Footer/Summary.d.ts +0 -1
  10. package/dist/components/Report/components/Toolbar/components/Filters/components/Filter.d.ts +2 -2
  11. package/dist/components/Report/components/Toolbar/components/Filters/components/FilterColumn.d.ts +5 -2
  12. package/dist/components/Report/types.d.ts +2 -0
  13. package/dist/components/Report/useReport.d.ts +1 -1
  14. package/dist/components/Select2/Select2.d.ts +4 -0
  15. package/dist/components/Select2/components/Trigger.d.ts +1 -0
  16. package/dist/components/Select2/hooks/useChildren.d.ts +1 -0
  17. package/dist/components/Table3/components/toolbar/Filter/filters/components/Filter.d.ts +2 -2
  18. package/dist/components/Table3/components/toolbar/Filter/filters/components/FilterColumn.d.ts +5 -2
  19. package/dist/components/Truncate/Truncate.d.ts +2 -2
  20. package/dist/esm/index.css +128 -121
  21. package/dist/esm/packages/taco/src/components/Button/util.js +8 -8
  22. package/dist/esm/packages/taco/src/components/Button/util.js.map +1 -1
  23. package/dist/esm/packages/taco/src/components/Card/Card.js +8 -4
  24. package/dist/esm/packages/taco/src/components/Card/Card.js.map +1 -1
  25. package/dist/esm/packages/taco/src/components/Checkbox/Checkbox.js +11 -2
  26. package/dist/esm/packages/taco/src/components/Checkbox/Checkbox.js.map +1 -1
  27. package/dist/esm/packages/taco/src/components/Field/Field.js +4 -15
  28. package/dist/esm/packages/taco/src/components/Field/Field.js.map +1 -1
  29. package/dist/esm/packages/taco/src/components/Header/components/PrimaryNavigation.js +2 -2
  30. package/dist/esm/packages/taco/src/components/Header/components/PrimaryNavigation.js.map +1 -1
  31. package/dist/esm/packages/taco/src/components/Listbox/ScrollableList.js +1 -1
  32. package/dist/esm/packages/taco/src/components/OverflowGroup/OverflowGroup.js +13 -6
  33. package/dist/esm/packages/taco/src/components/OverflowGroup/OverflowGroup.js.map +1 -1
  34. package/dist/esm/packages/taco/src/components/Provider/Localization.js +5 -1
  35. package/dist/esm/packages/taco/src/components/Provider/Localization.js.map +1 -1
  36. package/dist/esm/packages/taco/src/components/Report/Report.js +11 -13
  37. package/dist/esm/packages/taco/src/components/Report/Report.js.map +1 -1
  38. package/dist/esm/packages/taco/src/components/Report/components/Body/Body.js +1 -2
  39. package/dist/esm/packages/taco/src/components/Report/components/Body/Body.js.map +1 -1
  40. package/dist/esm/packages/taco/src/components/Report/components/Body/EmptyStateBody.js +18 -0
  41. package/dist/esm/packages/taco/src/components/Report/components/Body/EmptyStateBody.js.map +1 -0
  42. package/dist/esm/packages/taco/src/components/Report/components/Cell/util.js +6 -2
  43. package/dist/esm/packages/taco/src/components/Report/components/Cell/util.js.map +1 -1
  44. package/dist/esm/packages/taco/src/components/Report/components/Footer/Footer.js +14 -2
  45. package/dist/esm/packages/taco/src/components/Report/components/Footer/Footer.js.map +1 -1
  46. package/dist/esm/packages/taco/src/components/Report/components/Footer/Summary.js +2 -2
  47. package/dist/esm/packages/taco/src/components/Report/components/Footer/Summary.js.map +1 -1
  48. package/dist/esm/packages/taco/src/components/Report/components/Internal/Selection.js +47 -11
  49. package/dist/esm/packages/taco/src/components/Report/components/Internal/Selection.js.map +1 -1
  50. package/dist/esm/packages/taco/src/components/Report/components/Toolbar/components/Filters/ManageFiltersPopover.js +28 -43
  51. package/dist/esm/packages/taco/src/components/Report/components/Toolbar/components/Filters/ManageFiltersPopover.js.map +1 -1
  52. package/dist/esm/packages/taco/src/components/Report/components/Toolbar/components/Filters/components/Filter.js +14 -7
  53. package/dist/esm/packages/taco/src/components/Report/components/Toolbar/components/Filters/components/Filter.js.map +1 -1
  54. package/dist/esm/packages/taco/src/components/Report/components/Toolbar/components/Filters/components/FilterColumn.js +4 -3
  55. package/dist/esm/packages/taco/src/components/Report/components/Toolbar/components/Filters/components/FilterColumn.js.map +1 -1
  56. package/dist/esm/packages/taco/src/components/Report/components/Toolbar/components/Print/Print.js +10 -8
  57. package/dist/esm/packages/taco/src/components/Report/components/Toolbar/components/Print/Print.js.map +1 -1
  58. package/dist/esm/packages/taco/src/components/Report/listeners/useTableRowActiveListener.js +2 -2
  59. package/dist/esm/packages/taco/src/components/Report/listeners/useTableRowActiveListener.js.map +1 -1
  60. package/dist/esm/packages/taco/src/components/Report/styles/useCssGridStylesheet.js +10 -6
  61. package/dist/esm/packages/taco/src/components/Report/styles/useCssGridStylesheet.js.map +1 -1
  62. package/dist/esm/packages/taco/src/components/Report/util/useTableGlobalShortcuts.js +3 -10
  63. package/dist/esm/packages/taco/src/components/Report/util/useTableGlobalShortcuts.js.map +1 -1
  64. package/dist/esm/packages/taco/src/components/SearchInput2/SearchInput2.js +2 -1
  65. package/dist/esm/packages/taco/src/components/SearchInput2/SearchInput2.js.map +1 -1
  66. package/dist/esm/packages/taco/src/components/Select2/Select2.js +44 -4
  67. package/dist/esm/packages/taco/src/components/Select2/Select2.js.map +1 -1
  68. package/dist/esm/packages/taco/src/components/Select2/components/Trigger.js +9 -4
  69. package/dist/esm/packages/taco/src/components/Select2/components/Trigger.js.map +1 -1
  70. package/dist/esm/packages/taco/src/components/Select2/hooks/useChildren.js +1 -1
  71. package/dist/esm/packages/taco/src/components/Select2/hooks/useChildren.js.map +1 -1
  72. package/dist/esm/packages/taco/src/components/Table3/Table3.js +4 -6
  73. package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
  74. package/dist/esm/packages/taco/src/components/Table3/components/columns/cell/EditingCell.js +2 -2
  75. package/dist/esm/packages/taco/src/components/Table3/components/columns/cell/EditingCell.js.map +1 -1
  76. package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/Selection.js +66 -14
  77. package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/Selection.js.map +1 -1
  78. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/Filters.js +27 -44
  79. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/Filters.js.map +1 -1
  80. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/Filter.js +14 -7
  81. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/Filter.js.map +1 -1
  82. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/FilterColumn.js +4 -3
  83. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/FilterColumn.js.map +1 -1
  84. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/FilterComparator.js +1 -1
  85. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/FilterComparator.js.map +1 -1
  86. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/PrintButton/PrintButton.js +2 -0
  87. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/PrintButton/PrintButton.js.map +1 -1
  88. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/PrintButton/PrintIFrame.js +2 -1
  89. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/PrintButton/PrintIFrame.js.map +1 -1
  90. package/dist/esm/packages/taco/src/components/Table3/hooks/features/useSettings.js +1 -1
  91. package/dist/esm/packages/taco/src/components/Table3/hooks/listeners/useSettingsStateListener.js +3 -1
  92. package/dist/esm/packages/taco/src/components/Table3/hooks/listeners/useSettingsStateListener.js.map +1 -1
  93. package/dist/esm/packages/taco/src/components/Table3/hooks/useTable.js +10 -3
  94. package/dist/esm/packages/taco/src/components/Table3/hooks/useTable.js.map +1 -1
  95. package/dist/esm/packages/taco/src/components/Toast/Toaster.js +4 -3
  96. package/dist/esm/packages/taco/src/components/Toast/Toaster.js.map +1 -1
  97. package/dist/esm/packages/taco/src/components/Truncate/Truncate.js +34 -0
  98. package/dist/esm/packages/taco/src/components/Truncate/Truncate.js.map +1 -0
  99. package/dist/esm/packages/taco/src/hooks/useLocalStorage.js.map +1 -1
  100. package/dist/esm/packages/taco/src/index.js +2 -1
  101. package/dist/esm/packages/taco/src/index.js.map +1 -1
  102. package/dist/esm/packages/taco/src/primitives/Button.js +1 -0
  103. package/dist/esm/packages/taco/src/primitives/Button.js.map +1 -1
  104. package/dist/esm/packages/taco/src/primitives/Table/types.js.map +1 -1
  105. package/dist/esm/packages/taco/src/primitives/Table/useTable/features/useTablePrinting.js +24 -4
  106. package/dist/esm/packages/taco/src/primitives/Table/useTable/features/useTablePrinting.js.map +1 -1
  107. package/dist/esm/packages/taco/src/primitives/Table/useTable/features/useTableSettings.js +48 -7
  108. package/dist/esm/packages/taco/src/primitives/Table/useTable/features/useTableSettings.js.map +1 -1
  109. package/dist/esm/packages/taco/src/primitives/Table/useTable/listeners/useTableSettingsListener.js +1 -1
  110. package/dist/esm/packages/taco/src/primitives/Table/useTable/listeners/useTableSettingsListener.js.map +1 -1
  111. package/dist/esm/packages/taco/src/primitives/Table/useTable/useTable.js +11 -6
  112. package/dist/esm/packages/taco/src/primitives/Table/useTable/useTable.js.map +1 -1
  113. package/dist/esm/packages/taco/src/primitives/Table/useTable/util/columns.js +33 -7
  114. package/dist/esm/packages/taco/src/primitives/Table/useTable/util/columns.js.map +1 -1
  115. package/dist/esm/packages/taco/src/primitives/Table/useTable/util/presets.js +5 -5
  116. package/dist/esm/packages/taco/src/primitives/Table/useTable/util/presets.js.map +1 -1
  117. package/dist/esm/packages/taco/src/primitives/Table/useTable/util/search.js +14 -1
  118. package/dist/esm/packages/taco/src/primitives/Table/useTable/util/search.js.map +1 -1
  119. package/dist/esm/packages/taco/src/primitives/Table/useTable/util/settings.js +0 -1
  120. package/dist/esm/packages/taco/src/primitives/Table/useTable/util/settings.js.map +1 -1
  121. package/dist/esm/packages/taco/src/primitives/Table/useTableDataLoader.js +127 -3
  122. package/dist/esm/packages/taco/src/primitives/Table/useTableDataLoader.js.map +1 -1
  123. package/dist/esm/packages/taco/src/utils/dom.js +12 -3
  124. package/dist/esm/packages/taco/src/utils/dom.js.map +1 -1
  125. package/dist/esm/packages/taco/src/utils/hooks/useTruncated.js +4 -4
  126. package/dist/esm/packages/taco/src/utils/hooks/useTruncated.js.map +1 -1
  127. package/dist/esm/packages/taco/src/utils/keyboard.js +2 -2
  128. package/dist/esm/packages/taco/src/utils/keyboard.js.map +1 -1
  129. package/dist/hooks/useLocalStorage.d.ts +2 -1
  130. package/dist/index.css +128 -121
  131. package/dist/index.d.ts +1 -0
  132. package/dist/primitives/Table/types.d.ts +12 -2
  133. package/dist/primitives/Table/useTable/features/useTablePrinting.d.ts +10 -3
  134. package/dist/primitives/Table/useTable/features/useTableSettings.d.ts +2 -2
  135. package/dist/primitives/Table/useTable/useTable.d.ts +2 -1
  136. package/dist/primitives/Table/useTable/util/settings.d.ts +0 -1
  137. package/dist/taco.cjs.development.js +814 -455
  138. package/dist/taco.cjs.development.js.map +1 -1
  139. package/dist/taco.cjs.production.min.js +1 -1
  140. package/dist/taco.cjs.production.min.js.map +1 -1
  141. package/dist/utils/dom.d.ts +3 -1
  142. package/dist/utils/hooks/useTruncated.d.ts +1 -1
  143. package/package.json +2 -2
  144. package/types.json +9339 -9261
  145. package/dist/components/Report/components/Toolbar/components/Filters/components/Placeholder.d.ts +0 -12
  146. package/dist/components/Table3/components/toolbar/Filter/filters/components/Placeholder.d.ts +0 -12
  147. package/dist/esm/packages/taco/src/components/Report/components/Toolbar/components/Filters/components/Placeholder.js +0 -41
  148. package/dist/esm/packages/taco/src/components/Report/components/Toolbar/components/Filters/components/Placeholder.js.map +0 -1
  149. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/Placeholder.js +0 -41
  150. package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/Placeholder.js.map +0 -1
@@ -1,5 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { MenuProps } from '../Menu/Menu';
3
+ import './style.css';
3
4
  export declare type CardContentProps = React.HTMLAttributes<HTMLDivElement> & {
4
5
  noPadding?: boolean;
5
6
  };
@@ -8,6 +8,8 @@ declare type CheckboxBaseProps = Omit<React.ButtonHTMLAttributes<HTMLButtonEleme
8
8
  invalid?: boolean;
9
9
  /** Label for the checkbox */
10
10
  label?: React.ReactNode;
11
+ /** Displays loading state in checkbox */
12
+ loading?: boolean;
11
13
  required?: boolean;
12
14
  };
13
15
  interface UncontrolledCheckboxProps extends CheckboxBaseProps {
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  import { ButtonProps } from '../Button/Button';
3
3
  export declare const OverflowGroup: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
4
- moreButton?: React.ReactElement<ButtonProps, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
4
+ moreButton?: ((moreButtonText: string) => React.ReactElement<ButtonProps>) | undefined;
5
5
  } & React.RefAttributes<HTMLDivElement>>;
@@ -360,6 +360,10 @@ export declare const defaultLocalisationTexts: {
360
360
  save: string;
361
361
  search: string;
362
362
  searchOrCreate: string;
363
+ selectAll: string;
364
+ selectAllResults: string;
365
+ deselectAll: string;
366
+ deselectAllResults: string;
363
367
  };
364
368
  toasts: {
365
369
  dismiss: string;
@@ -6,11 +6,13 @@ declare function Column<TType = unknown>(_: ReportColumnProps<TType>): null;
6
6
  declare function Group(_: ReportGroupProps): null;
7
7
  export declare const Report: (<TType = unknown>(props: (import("../../primitives/Table/types").useTableClientProps<TType> & {
8
8
  customSettings?: import("./types").ReportCustomSettingsRenderer | undefined;
9
+ emptyState?: import("./types").ReportEmptyStateRenderer | undefined;
9
10
  toolbarLeft?: JSX.Element | undefined;
10
11
  toolbarRight?: JSX.Element | undefined;
11
12
  toolbarPanel?: JSX.Element | undefined;
12
13
  } & React.RefAttributes<TableRef>) | (import("../../primitives/Table/types").useTableServerProps<TType> & {
13
14
  customSettings?: import("./types").ReportCustomSettingsRenderer | undefined;
15
+ emptyState?: import("./types").ReportEmptyStateRenderer | undefined;
14
16
  toolbarLeft?: JSX.Element | undefined;
15
17
  toolbarRight?: JSX.Element | undefined;
16
18
  toolbarPanel?: JSX.Element | undefined;
@@ -2,7 +2,6 @@ import React from 'react';
2
2
  import { Table as ReactTable } from '@tanstack/react-table';
3
3
  declare type BodyProps<TType = unknown> = React.HTMLAttributes<HTMLTableSectionElement> & {
4
4
  enableArrowKeyFocusing?: boolean;
5
- length: number;
6
5
  table: ReactTable<TType>;
7
6
  };
8
7
  export declare function Body<TType = unknown>(props: BodyProps<TType>): JSX.Element;
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ import { ReportEmptyStateRenderer } from '../../types';
3
+ declare type EmptyStateProps = React.HTMLAttributes<HTMLTableSectionElement> & {
4
+ emptyState?: ReportEmptyStateRenderer;
5
+ };
6
+ export declare function EmptyStateBody(props: EmptyStateProps): JSX.Element;
7
+ export {};
@@ -13,6 +13,6 @@ export declare function getCellAttributes<TType = unknown>(cell: ReactTableCell<
13
13
  className: string | undefined;
14
14
  style: {};
15
15
  };
16
- export declare function useSearchHighlighting<TType = unknown>(cell: ReactTableCell<TType, unknown>, index: number, ref: React.RefObject<HTMLTableCellElement>): true | "current" | undefined;
16
+ export declare function useSearchHighlighting<TType = unknown>(cell: ReactTableCell<TType, unknown>, cellIndex: number, ref: React.RefObject<HTMLTableCellElement>): true | "current" | undefined;
17
17
  export declare function getCurrentRowCellElement(index: number, tableEl: HTMLElement): Element | null;
18
18
  export declare function scrollColumnIntoView(columnIndex: number, frozenColumnIndex: number, column: HTMLElement, tableEl: HTMLElement): void;
@@ -1,7 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { Table as ReactTable } from '@tanstack/react-table';
3
3
  export declare type FooterSummaryProps<TType = unknown> = {
4
- length: number;
5
4
  table: ReactTable<TType>;
6
5
  };
7
6
  export declare function Summary<TType = unknown>(props: FooterSummaryProps<TType>): JSX.Element;
@@ -6,7 +6,7 @@ export declare type FilterProps<TType = unknown> = {
6
6
  filter: TableFilter;
7
7
  filters: TableFilter[];
8
8
  position: number;
9
- onChange: (id: string, value: TableFilter) => void;
10
- onRemove: (columnId: string) => void;
9
+ onChange: (position: number, value: TableFilter) => void;
10
+ onRemove?: (position: number) => void;
11
11
  };
12
12
  export declare function Filter<TType = unknown>(props: FilterProps<TType>): JSX.Element;
@@ -1,4 +1,4 @@
1
- /// <reference types="react" />
1
+ import React from 'react';
2
2
  import { Column as ReactTableColumn } from '@tanstack/react-table';
3
3
  import { Select2Props } from '../../../../../../Select2/Select2';
4
4
  import { TableFilter } from '../../../../../../../primitives/Table/types';
@@ -6,4 +6,7 @@ export declare type FilterColumnProps<TType = unknown> = Omit<Select2Props, 'chi
6
6
  allColumns: ReactTableColumn<TType, unknown>[];
7
7
  filters: TableFilter[];
8
8
  };
9
- export declare function FilterColumn<TType = unknown>(props: FilterColumnProps<TType>): JSX.Element;
9
+ export declare const FilterColumn: React.ForwardRefExoticComponent<Pick<Select2Props, "defaultValue" | "onChange" | "value" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "autoFocus" | "emptyValue" | "disabled" | "highlighted" | "invalid" | "multiple" | "name" | "onCreate" | "onDelete" | "onEdit" | "readOnly" | "required" | "tags" | "fontSize"> & {
10
+ allColumns: ReactTableColumn<unknown, unknown>[];
11
+ filters: TableFilter[];
12
+ } & React.RefAttributes<HTMLButtonElement>>;
@@ -2,8 +2,10 @@
2
2
  import { TableColumnProps, TableGroupProps, TableSettings, useTableProps } from '../../primitives/Table/types';
3
3
  import { MenuItemProps } from '../Menu/components/Item';
4
4
  export type { TableFilterComparator, TableFilterValue, TableFilter, TableColumnAlignment, TableColumnClassNameHandler, TableColumnDataType, TableColumnFilter, TableColumnMenu, TableColumnRenderer, TableColumnRendererAggregate, TableColumnRendererControl, TableColumnRendererControlProps, TableColumnRendererHeader, TableColumnRendererFooter, TableColumnSort, TableColumnSortDirection, TableColumnSortFn, TableColumnWidth, TableRowActionRenderer, TableRowActionGroupRenderer, TableRowClickHandler, TableRowGotoHandler, TableRowHeight, TableRowSelectHandler, TableShortcutHandlerFn, TableShortcutHandlerObject, TableFilterHandler, TableFontSize, TablePreset, TableRowExpansionRenderer, TableScrollToIndexHandler, TableServerLoadPageHandler, TableServerLoadAllHandler, TableServerLoadAllState, TableSettingsHandler, TableShortcuts, TableSortHandler, TableSettings, TableFeatureProps, } from '../../primitives/Table/types';
5
+ export declare type ReportEmptyStateRenderer = () => JSX.Element | null;
5
6
  export declare type ReportProps<TType = unknown> = useTableProps<TType> & {
6
7
  customSettings?: ReportCustomSettingsRenderer;
8
+ emptyState?: ReportEmptyStateRenderer;
7
9
  toolbarLeft?: JSX.Element;
8
10
  toolbarRight?: JSX.Element;
9
11
  toolbarPanel?: JSX.Element;
@@ -2,8 +2,8 @@ import React from 'react';
2
2
  import { ReportProps } from './types';
3
3
  import { TableRef } from '../../primitives/Table/types';
4
4
  export declare function useReport<TType>(props: ReportProps<TType>, ref: React.RefObject<TableRef>): {
5
+ id: string;
5
6
  instance: import("@tanstack/table-core").Table<TType>;
6
- length: number;
7
7
  meta: import("@tanstack/table-core").TableMeta<TType>;
8
8
  state: import("@tanstack/table-core").TableState;
9
9
  };
@@ -14,6 +14,10 @@ declare type Select2Texts = {
14
14
  save: string;
15
15
  search: string;
16
16
  searchOrCreate: string;
17
+ selectAll: string;
18
+ selectAllResults: string;
19
+ deselectAll: string;
20
+ deselectAllResults: string;
17
21
  };
18
22
  declare type Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {
19
23
  autoFocus?: boolean;
@@ -4,4 +4,5 @@ export declare const Trigger: React.ForwardRefExoticComponent<Pick<React.HTMLAtt
4
4
  emptyValue?: string | number | boolean | null | undefined;
5
5
  placeholder?: string | undefined;
6
6
  children: React.ReactElement<Select2OptionProps>[];
7
+ fontSize?: "small" | "medium" | "large" | undefined;
7
8
  } & React.RefAttributes<HTMLButtonElement>>;
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  import { Select2OptionProps } from '../components/Option';
3
3
  import { Select2Children, Select2OptionValue, Select2Value } from '../types';
4
+ export declare const isGroup: (child: React.ReactElement) => boolean;
4
5
  export declare type useChildrenArgs = {
5
6
  children: Select2Children;
6
7
  emptyValue?: Select2OptionValue;
@@ -6,7 +6,7 @@ export declare type FilterProps<TType = unknown> = {
6
6
  filter: Table3Filter;
7
7
  filters: Table3Filter[];
8
8
  position: number;
9
- onChange: (id: string | null, value: Table3Filter) => void;
10
- onRemove: (columnId: string | null) => void;
9
+ onChange: (position: number, value: Table3Filter) => void;
10
+ onRemove?: (position: number) => void;
11
11
  };
12
12
  export declare function Filter<TType = unknown>(props: FilterProps<TType>): JSX.Element;
@@ -1,4 +1,4 @@
1
- /// <reference types="react" />
1
+ import React from 'react';
2
2
  import { Column as RTColumn } from '@tanstack/react-table';
3
3
  import { Select2Props } from '../../../../../../Select2/Select2';
4
4
  import { Table3Filter } from '../../../../../types';
@@ -6,4 +6,7 @@ export declare type FilterColumnProps<TType = unknown> = Omit<Select2Props, 'chi
6
6
  allColumns: RTColumn<TType, unknown>[];
7
7
  filters: Table3Filter[];
8
8
  };
9
- export declare function FilterColumn<TType = unknown>(props: FilterColumnProps<TType>): JSX.Element;
9
+ export declare const FilterColumn: React.ForwardRefExoticComponent<Pick<Select2Props, "defaultValue" | "onChange" | "value" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "autoFocus" | "emptyValue" | "disabled" | "highlighted" | "invalid" | "multiple" | "name" | "onCreate" | "onDelete" | "onEdit" | "readOnly" | "required" | "tags" | "fontSize"> & {
10
+ allColumns: RTColumn<unknown, unknown>[];
11
+ filters: Table3Filter[];
12
+ } & React.RefAttributes<HTMLButtonElement>>;
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  export declare type TruncateProps = {
3
- tooltip: string;
4
3
  children: React.ReactElement;
4
+ tooltip: string;
5
5
  };
6
- export declare const Truncate: ({ tooltip, children }: TruncateProps) => JSX.Element;
6
+ export declare const Truncate: ({ children, tooltip }: TruncateProps) => JSX.Element;
@@ -282,51 +282,9 @@
282
282
  @apply font-semibold;
283
283
  }
284
284
 
285
- [data-taco='scrollable-list'].yt-list--multiselect li:first-child {
286
- @apply border-grey-100 border-b-2 pl-4; /* Listbox max-height is dependant on this border-bottom-width value! */
287
- }
288
-
289
- [data-taco='scrollable-list'] li > [data-taco='icon'] {
290
- @apply mr-2;
291
- }
292
-
293
- [data-taco='scrollable-list']:not([readonly]) li:not([disabled]):hover {
294
- @apply wcag-grey-200;
295
- }
296
-
297
- [data-taco='scrollable-list']:not([readonly]) li:not([disabled]):hover [data-taco='icon'] {
298
- @apply wcag-grey-200;
299
- }
300
-
301
- [data-taco='scrollable-list'] li:focus,
302
- [data-taco='scrollable-list']:not(.yt-list--multiselect) li[aria-selected='true'],
303
- [data-taco='scrollable-list'] li[data-focused='true'] {
304
- @apply wcag-blue-500;
305
- }
306
-
307
- [data-taco='scrollable-list'] li:focus [data-taco='icon'],
308
- [data-taco='scrollable-list']:not(.yt-list--multiselect) li[aria-selected='true'] [data-taco='icon'],
309
- [data-taco='scrollable-list'] li[data-focused='true'] [data-taco='icon'] {
310
- @apply wcag-blue-500;
311
- }
312
-
313
- [data-taco='scrollable-list'][readonly] li {
314
- @apply cursor-not-allowed;
315
- }
316
-
317
- [data-taco='scrollable-list'] li[disabled],
318
- [data-taco='scrollable-list'][disabled] li[aria-selected='true'] {
319
- @apply cursor-not-allowed text-black text-opacity-25;
320
- }
321
-
322
- [data-taco='scrollable-list'] li.yt-list__empty,
323
- [data-taco='scrollable-list'] li.yt-list__empty:hover,
324
- [data-taco='scrollable-list'] li.yt-list__empty:focus {
325
- @apply text-grey-700 flex w-full items-center overflow-hidden bg-white px-3 italic;
326
- }
327
-
328
- [data-taco='scrollable-list'] li.yt-list__empty [data-taco='spinner'] {
329
- @apply mr-2 mt-2 h-5 w-5 opacity-75;
285
+ [data-taco='card'] [data-taco='report'],
286
+ [data-taco='card'] [data-taco='table2'] {
287
+ @apply !border-0;
330
288
  }
331
289
 
332
290
  [data-taco='spinner'] svg circle {
@@ -404,6 +362,53 @@
404
362
  stroke: currentColor;
405
363
  }
406
364
 
365
+ [data-taco='scrollable-list'].yt-list--multiselect li:first-child {
366
+ @apply border-grey-100 border-b-2 pl-4; /* Listbox max-height is dependant on this border-bottom-width value! */
367
+ }
368
+
369
+ [data-taco='scrollable-list'] li > [data-taco='icon'] {
370
+ @apply mr-2;
371
+ }
372
+
373
+ [data-taco='scrollable-list']:not([readonly]) li:not([disabled]):hover {
374
+ @apply wcag-grey-200;
375
+ }
376
+
377
+ [data-taco='scrollable-list']:not([readonly]) li:not([disabled]):hover [data-taco='icon'] {
378
+ @apply wcag-grey-200;
379
+ }
380
+
381
+ [data-taco='scrollable-list'] li:focus,
382
+ [data-taco='scrollable-list']:not(.yt-list--multiselect) li[aria-selected='true'],
383
+ [data-taco='scrollable-list'] li[data-focused='true'] {
384
+ @apply wcag-blue-500;
385
+ }
386
+
387
+ [data-taco='scrollable-list'] li:focus [data-taco='icon'],
388
+ [data-taco='scrollable-list']:not(.yt-list--multiselect) li[aria-selected='true'] [data-taco='icon'],
389
+ [data-taco='scrollable-list'] li[data-focused='true'] [data-taco='icon'] {
390
+ @apply wcag-blue-500;
391
+ }
392
+
393
+ [data-taco='scrollable-list'][readonly] li {
394
+ @apply cursor-not-allowed;
395
+ }
396
+
397
+ [data-taco='scrollable-list'] li[disabled],
398
+ [data-taco='scrollable-list'][disabled] li[aria-selected='true'] {
399
+ @apply cursor-not-allowed text-black text-opacity-25;
400
+ }
401
+
402
+ [data-taco='scrollable-list'] li.yt-list__empty,
403
+ [data-taco='scrollable-list'] li.yt-list__empty:hover,
404
+ [data-taco='scrollable-list'] li.yt-list__empty:focus {
405
+ @apply text-grey-700 flex w-full items-center overflow-hidden bg-white px-3 italic;
406
+ }
407
+
408
+ [data-taco='scrollable-list'] li.yt-list__empty [data-taco='spinner'] {
409
+ @apply mr-2 mt-2 h-5 w-5 opacity-75;
410
+ }
411
+
407
412
  [data-taco='combobox'] > [aria-expanded='true'] + [role='dialog'] > ul,
408
413
  [data-taco='combobox'] > [aria-expanded='true'] + [role='dialog'] > ul:hover {
409
414
  @apply border-blue-500;
@@ -574,9 +579,13 @@ table[data-taco='report'] tfoot {
574
579
  /* z-indexes & layout */
575
580
  @apply sticky bottom-0 isolate z-20;
576
581
  /* grid */
577
- @apply col-span-full grid auto-rows-min grid-cols-[subgrid];
582
+ @apply col-span-full grid grid-cols-[subgrid] grid-rows-[calc(theme(spacing.10)_+_2px)];
578
583
  }
579
584
 
585
+ table[data-taco='report'] tfoot > tr {
586
+ @apply grid-rows-[calc(theme(spacing.10)_+_2px)];
587
+ }
588
+
580
589
  table[data-taco='report'] tbody {
581
590
  /* z-indexes & layout */
582
591
  @apply isolate z-10;
@@ -903,88 +912,80 @@ table[data-taco='report'][data-table-font-size='large']
903
912
  }
904
913
 
905
914
  /* row/cell backgrounds -- we have to be specific so that nested tables don't inherit */
906
-
907
915
  /* normal rows */
908
- table[data-taco='report'] > tbody > tr:not([data-row-selected='true']) > td {
909
- @apply bg-white;
910
- }
916
+ table[data-taco='report'] > tbody > tr:not([data-row-selected]) > td {
917
+ @apply bg-white;
918
+ }
919
+ table[data-taco='report'] > tbody > tr:not([data-row-selected]):hover > td,
920
+ table[data-taco='report'] > tbody > tr:not([data-row-selected])[data-row-active] > td,
921
+ table[data-taco='report'] > tbody > tr:not([data-row-selected])[data-row-group] > td {
922
+ --table-row-actions-shadow: theme(colors.grey.100);
923
+ @apply bg-grey-100;
924
+ }
911
925
  /* search highlighting */
912
- table[data-taco='report'] > tbody > tr:not([data-row-selected='true']) > td[data-cell-highlighted='true'] {
913
- @apply bg-[#e9f2ff];
926
+ table[data-taco='report'] > tbody > tr:not([data-row-selected]) > td[data-cell-highlighted='true'] {
927
+ --table-row-actions-shadow: #e9f2ff;
928
+ @apply !bg-[#e9f2ff];
914
929
  }
915
- table[data-taco='report'] > tbody > tr:not([data-row-selected='true']) > td[data-cell-highlighted='current'] {
916
- @apply !bg-[#bfd9ff];
930
+ table[data-taco='report'] > tbody > tr:not([data-row-selected]) > td[data-cell-highlighted='current'] {
931
+ --table-row-actions-shadow: #bdd7fc;
932
+ @apply !bg-[#bdd7fc];
933
+ }
934
+ /* selected rows */
935
+ table[data-taco='report'] > tbody > tr[data-row-selected] > td {
936
+ @apply bg-blue-100;
937
+ }
938
+ table[data-taco='report'] > tbody > tr[data-row-selected]:hover > td,
939
+ table[data-taco='report'] > tbody > tr[data-row-selected][data-row-active] > td,
940
+ table[data-taco='report'] > tbody > tr[data-row-selected][data-row-group] > td {
941
+ --table-row-actions-shadow: #d6e3f6;
942
+ @apply bg-[#d6e3f6];
917
943
  }
918
- table[data-taco='report'] > tbody > tr:not([data-row-selected='true'])[data-row-group] > td {
919
- @apply bg-grey-100;
920
- }
921
- table[data-taco='report'] > tbody > tr:not([data-row-selected='true']):hover > td,
922
- table[data-taco='report'] > tbody > tr:not([data-row-selected='true'])[data-row-active='true'] > td,
923
- table[data-taco='report'] > tbody > tr:not([data-row-selected='true'])[data-row-active='true']:hover > td {
924
- --table-row-actions-shadow: theme(colors.grey.100);
925
- @apply bg-grey-100;
926
- }
927
944
  /* search highlighting */
928
- table[data-taco='report'] > tbody > tr:not([data-row-selected='true']):hover > td[data-cell-highlighted='true'], table[data-taco='report'] > tbody > tr:not([data-row-selected='true'])[data-row-active='true'] > td[data-cell-highlighted='true'], table[data-taco='report'] > tbody > tr:not([data-row-selected='true'])[data-row-active='true']:hover > td[data-cell-highlighted='true'] {
929
- @apply bg-[#e2ebf8];
945
+ table[data-taco='report'] > tbody > tr[data-row-selected] > td[data-cell-highlighted] {
946
+ --table-row-actions-shadow: #b4d2fd;
947
+ @apply !bg-[#b4d2fd];
930
948
  }
931
- /* normal rows when focus is inside the table */
932
- table[data-taco='report']:focus-within > tbody > tr[data-row-active='true']:not([data-row-selected='true']) > td {
933
- --table-row-actions-shadow: theme(colors.grey.200);
934
- @apply !bg-grey-200;
935
- }
936
949
 
937
- /* normal rows when hover is paused */
938
- table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr:not([data-row-selected='true']):hover:not([data-row-active='true']) > td {
939
- --table-row-actions-shadow: theme(colors.white);
940
- @apply !bg-white;
941
- }
942
- table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr:not([data-row-selected='true']):hover[data-row-active='true'] > td {
943
- --table-row-actions-shadow: theme(colors.grey.200);
944
- @apply !bg-grey-200;
945
- }
950
+ /* normal rows */
951
+
952
+ table[data-taco='report']:focus-within > tbody > tr:not([data-row-selected])[data-row-active] > td {
953
+ --table-row-actions-shadow: theme(colors.grey.200);
954
+ @apply bg-grey-200;
955
+ }
946
956
 
947
957
  /* selected rows */
948
- table[data-taco='report'] > tbody > tr[data-row-selected='true'] > td {
949
- @apply bg-blue-100;
950
- }
951
- /* search highlighting */
952
- table[data-taco='report'] > tbody > tr[data-row-selected='true'] > td[data-cell-highlighted='true'] {
953
- @apply bg-[#d0e4ff];
958
+
959
+ table[data-taco='report']:focus-within > tbody > tr[data-row-selected][data-row-active] > td {
960
+ --table-row-actions-shadow: #ccd8eb;
961
+ @apply bg-[#ccd8eb];
954
962
  }
955
- table[data-taco='report'] > tbody > tr[data-row-selected='true'] > td[data-cell-highlighted='current'] {
956
- @apply !bg-[#b6d4ff];
963
+
964
+ /* normal rows */
965
+
966
+ table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr:hover:not([data-row-selected]):not([data-row-active]) > td {
967
+ --table-row-actions-shadow: theme(colors.white);
968
+ @apply bg-white;
957
969
  }
958
- table[data-taco='report'] > tbody > tr[data-row-selected='true']:hover > td,
959
- table[data-taco='report'] > tbody > tr[data-row-selected='true'][data-row-active='true'] > td,
960
- table[data-taco='report'] > tbody > tr[data-row-selected='true'][data-row-active='true']:hover > td {
961
- --table-row-actions-shadow: #d6e3f6;
962
- @apply bg-[#D6E3F6];
963
- }
964
- /* search highlighting */
965
- table[data-taco='report'] > tbody > tr[data-row-selected='true']:hover > td[data-cell-highlighted='true'], table[data-taco='report'] > tbody > tr[data-row-selected='true'][data-row-active='true'] > td[data-cell-highlighted='true'], table[data-taco='report'] > tbody > tr[data-row-selected='true'][data-row-active='true']:hover > td[data-cell-highlighted='true'] {
966
- @apply bg-[#cadef9];
970
+
971
+ table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr:hover:not([data-row-selected])[data-row-active] > td {
972
+ --table-row-actions-shadow: theme(colors.grey.200);
973
+ @apply bg-grey-200;
967
974
  }
968
- table[data-taco='report'] > tbody > tr[data-row-selected='true']:hover > td[data-cell-highlighted='current'], table[data-taco='report'] > tbody > tr[data-row-selected='true'][data-row-active='true'] > td[data-cell-highlighted='current'], table[data-taco='report'] > tbody > tr[data-row-selected='true'][data-row-active='true']:hover > td[data-cell-highlighted='current'] {
969
- @apply !bg-[#b4d2fd];
975
+
976
+ /* selected rows */
977
+
978
+ table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr:hover[data-row-selected]:not([data-row-active]) > td {
979
+ --table-row-actions-shadow: theme(colors.blue.100);
980
+ @apply bg-blue-100;
970
981
  }
971
- /* selected rows when focus is inside the table */
972
- table[data-taco='report']:focus-within > tbody > tr[data-row-active='true'][data-row-selected='true'] > td {
973
- --table-row-actions-shadow: #ccd8eb;
974
- @apply bg-[#CCD8EB];
975
- }
976
- /* selected rows when hover is paused */
977
- table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr[data-row-selected='true']:hover:not([data-row-active='true']) > td {
978
- --table-row-actions-shadow: theme(colors.blue.100);
979
- @apply !bg-blue-100;
980
- }
981
- table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr[data-row-selected='true']:hover[data-row-active='true'] > td {
982
- --table-row-actions-shadow: #ccd8eb;
983
- @apply !bg-[#CCD8EB];
984
- }
985
982
 
986
- /* row metadata */
983
+ table[data-taco='report'][data-table-pause-hover='true'] > tbody > tr:hover[data-row-selected][data-row-active] > td {
984
+ --table-row-actions-shadow: #ccd8eb;
985
+ @apply bg-[#CCD8EB];
986
+ }
987
987
 
988
+ /* row metadata */
988
989
  table[data-taco='report'] tbody tr[data-row-meta-layout='heading']:not([data-row-group='true']) td {
989
990
  @apply !border-b-0 border-t font-bold;
990
991
  }
@@ -1335,7 +1336,7 @@ table[data-taco='report'] [data-cell-id^='__'] {
1335
1336
  }
1336
1337
 
1337
1338
  [data-font-size='small'] [role='cell'] [data-taco='tag'] {
1338
- @apply !-my-1;
1339
+ @apply h-4 min-h-[theme(spacing.4)];
1339
1340
  }
1340
1341
 
1341
1342
  [data-font-size='small'] [role='cell'] [data-taco='Select2'],
@@ -1391,7 +1392,7 @@ table[data-taco='report'] [data-cell-id^='__'] {
1391
1392
  }
1392
1393
 
1393
1394
  /* When cell is editable and highlighted, the padding should apply to highlight wrapper and remove 1px border-width,
1394
- because it should take all the available space in the cell */
1395
+ because it should take all the available space in the cell */
1395
1396
 
1396
1397
  [data-font-size='small'] [role='cell'][data-editable][data-highlighted='true'] [data-taco='highlight'] {
1397
1398
  @apply px-[calc(var(--table3-cell-padding-x)_-_6px_-_1px)];
@@ -1414,8 +1415,8 @@ table[data-taco='report'] [data-cell-id^='__'] {
1414
1415
  @apply !-my-0.5;
1415
1416
  }
1416
1417
 
1417
- [data-font-size='medium'] [role='cell'] [data-taco='tag'] {
1418
- @apply !-my-0.5;
1418
+ [data-font-size='medium'] [role='cell'] [data-taco='Select2'] {
1419
+ @apply !px-2;
1419
1420
  }
1420
1421
 
1421
1422
  [data-font-size='medium'] [role='cell'] [data-taco='Select2'],
@@ -1430,7 +1431,7 @@ table[data-taco='report'] [data-cell-id^='__'] {
1430
1431
  }
1431
1432
 
1432
1433
  /* When cell is editable and highlighted, the padding should apply to highlight wrapper and remove 1px border-width,
1433
- because it should take all the available space in the cell */
1434
+ because it should take all the available space in the cell */
1434
1435
 
1435
1436
  [data-font-size='medium'] [role='cell'][data-editable][data-highlighted='true'] [data-taco='highlight'] {
1436
1437
  @apply px-[calc(var(--table3-cell-padding-x)_-_8px_-_1px)];
@@ -1460,8 +1461,8 @@ table[data-taco='report'] [data-cell-id^='__'] {
1460
1461
  @apply !-my-0.5;
1461
1462
  }
1462
1463
 
1463
- [data-font-size='large'] [role='cell'] [data-taco='tag'] {
1464
- @apply !-my-0.5;
1464
+ [data-font-size='large'] [role='cell'] [data-taco='Select2'] {
1465
+ @apply !px-2.5;
1465
1466
  }
1466
1467
 
1467
1468
  [data-font-size='large'] [role='cell'] [data-taco='Select2'],
@@ -1502,7 +1503,7 @@ table[data-taco='report'] [data-cell-id^='__'] {
1502
1503
  }
1503
1504
 
1504
1505
  /* When cell is editable and highlighted, the padding should apply to highlight wrapper and remove 1px border-width,
1505
- because it should take all the available space in the cell */
1506
+ because it should take all the available space in the cell */
1506
1507
 
1507
1508
  [data-font-size='large'] [role='cell'][data-editable][data-highlighted='true'] [data-taco='highlight'] {
1508
1509
  @apply px-[calc(var(--table3-cell-padding-x)_-_10px_-_1px)];
@@ -1520,3 +1521,9 @@ table[data-taco='report'] [data-cell-id^='__'] {
1520
1521
  [data-font-size='large'] [role='columnheader'] button {
1521
1522
  @apply !text-sm;
1522
1523
  }
1524
+
1525
+ /* When spinner is rendered in the last cell of the table, it slightly pushes the edge of the table(while rotating),
1526
+ and making horisontal scroll bar jump */
1527
+ [data-editing='true'] [role='cell']:last-child [data-taco='spinner'] {
1528
+ overflow: hidden;
1529
+ }
@@ -3,29 +3,29 @@ import { Button } from '../../primitives/Button.js';
3
3
  import { Tooltip } from '../Tooltip/Tooltip.js';
4
4
 
5
5
  const getButtonClasses = () => {
6
- return 'flex-shrink-0 min-h-[theme(spacing.8)] min-w-[theme(spacing.8)] gap-1 h-max leading-5 inline-flex items-center justify-center focus-visible:yt-focus disabled:cursor-not-allowed';
6
+ return 'flex-shrink-0 min-h-[theme(spacing.8)] min-w-[theme(spacing.8)] gap-1 h-max leading-5 inline-flex items-center justify-center focus-visible:yt-focus aria-disabled:cursor-not-allowed';
7
7
  };
8
8
  const getAppearanceClasses = (value, icon = false) => {
9
9
  switch (value) {
10
10
  case 'primary':
11
- return `wcag-blue-500 enabled:hover:wcag-blue-700 enabled:hover:active:wcag-blue-500 disabled:bg-blue-500/50`;
11
+ return `wcag-blue-500 visited:wcag-blue-500 hover:wcag-blue-700 hover:active:wcag-blue-500 aria-disabled:bg-blue-500/50 aria-disabled:active:bg-blue-500/50`;
12
12
  case 'danger':
13
- return `wcag-red-500 enabled:hover:wcag-red-700 enabled:hover:active:wcag-red-500 disabled:bg-red-500/50`;
13
+ return `wcag-red-500 visited:wcag-red-500 hover:wcag-red-700 hover:active:wcag-red-500 aria-disabled:bg-red-500/50 aria-disabled:active:bg-red-500/50`;
14
14
  case 'ghost':
15
- return `bg-white border border-blue-500 text-blue-500 enabled:hover:bg-blue-100 enabled:hover:text-blue-700 disabled:border-blue-500/50 disabled:text-blue-500/50`;
15
+ return `bg-white border border-blue-500 text-blue-500 visited:text-blue-500 hover:bg-blue-100 hover:text-blue-700 aria-disabled:border-blue-500/50 aria-disabled:text-blue-500/50 aria-disabled:bg-white`;
16
16
  case 'discrete':
17
17
  {
18
18
  if (icon) {
19
- return `bg-transparent text-black enabled:hover:bg-[#000]/[0.08] disabled:text-black/30`;
19
+ return `bg-transparent text-black visited:text-black hover:bg-[#000]/[0.08] aria-disabled:text-black/30`;
20
20
  }
21
- return `bg-transparent text-blue-500 enabled:hover:text-blue-700 disabled:text-blue-500/50`;
21
+ return `bg-transparent text-blue-500 visited:text-blue-500 hover:text-blue-700 aria-disabled:text-blue-500/50`;
22
22
  }
23
23
  case 'transparent':
24
24
  {
25
- return `bg-transparent text-black enabled:hover:text-black enabled:hover:bg-[#000]/[0.08] disabled:text-black/30`;
25
+ return `bg-transparent text-black visited:text-black hover:text-black hover:bg-[#000]/[0.08] aria-disabled:text-black/30 aria-disabled:bg-transparent`;
26
26
  }
27
27
  default:
28
- return `wcag-grey-200 enabled:hover:wcag-grey-300 disabled:bg-grey-200/50 disabled:text-black/30`;
28
+ return `wcag-grey-200 visited:wcag-grey-200 hover:wcag-grey-300 aria-disabled:bg-grey-200/50 aria-disabled:text-black/30`;
29
29
  }
30
30
  };
31
31
  const createButtonWithTooltip = (props, className, ref) => {