@economic/taco 2.43.1 → 2.44.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (56) hide show
  1. package/dist/components/Report/Report.d.ts +1 -1
  2. package/dist/components/Table3/features/useTableEditing.d.ts +8 -8
  3. package/dist/esm/index.css +44 -22
  4. package/dist/esm/packages/taco/src/components/Datepicker/Datepicker.js +7 -1
  5. package/dist/esm/packages/taco/src/components/Datepicker/Datepicker.js.map +1 -1
  6. package/dist/esm/packages/taco/src/components/Select2/Select2.js +9 -6
  7. package/dist/esm/packages/taco/src/components/Select2/Select2.js.map +1 -1
  8. package/dist/esm/packages/taco/src/components/Table3/Table3.js +2 -2
  9. package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
  10. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js +6 -1
  11. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js.map +1 -1
  12. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/util.js +4 -3
  13. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/util.js.map +1 -1
  14. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Internal/EditingActionsMenu.js +17 -3
  15. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Internal/EditingActionsMenu.js.map +1 -1
  16. package/dist/esm/packages/taco/src/components/Table3/components/Editing/Alert.js +1 -11
  17. package/dist/esm/packages/taco/src/components/Table3/components/Editing/Alert.js.map +1 -1
  18. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js +1 -1
  19. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js.map +1 -1
  20. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/SaveStatus.js +7 -5
  21. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/SaveStatus.js.map +1 -1
  22. package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js +36 -47
  23. package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js.map +1 -1
  24. package/dist/esm/packages/taco/src/components/Table3/listeners/useTableEditingListener.js +9 -0
  25. package/dist/esm/packages/taco/src/components/Table3/listeners/useTableEditingListener.js.map +1 -1
  26. package/dist/esm/packages/taco/src/components/Tooltip/Tooltip.js +1 -1
  27. package/dist/esm/packages/taco/src/components/Tooltip/Tooltip.js.map +1 -1
  28. package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js +3 -1
  29. package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js.map +1 -1
  30. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Cell/BuiltIns/GroupedCell.js +0 -3
  31. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Cell/BuiltIns/GroupedCell.js.map +1 -1
  32. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Actions.js +1 -8
  33. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Actions.js.map +1 -1
  34. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Selection.js +85 -109
  35. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Selection.js.map +1 -1
  36. package/dist/esm/packages/taco/src/primitives/Table/types.js.map +1 -1
  37. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/listeners/useTableRowSelectionListener.js +4 -9
  38. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/listeners/useTableRowSelectionListener.js.map +1 -1
  39. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/listeners/useTableSearchListener.js +12 -1
  40. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/listeners/useTableSearchListener.js.map +1 -1
  41. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/presets.js +1 -7
  42. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/presets.js.map +1 -1
  43. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/search.js +17 -10
  44. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/search.js.map +1 -1
  45. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js +4 -6
  46. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js.map +1 -1
  47. package/dist/index.css +44 -22
  48. package/dist/primitives/Table/Core/components/Columns/Internal/Actions.d.ts +1 -2
  49. package/dist/primitives/Table/types.d.ts +0 -1
  50. package/dist/primitives/Table/useTableManager/util/columns.d.ts +1 -1
  51. package/dist/primitives/Table/useTableManager/util/search.d.ts +2 -2
  52. package/dist/taco.cjs.development.js +224 -231
  53. package/dist/taco.cjs.development.js.map +1 -1
  54. package/dist/taco.cjs.production.min.js +1 -1
  55. package/dist/taco.cjs.production.min.js.map +1 -1
  56. package/package.json +2 -2
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { ReportRef, ReportProps, ReportColumnProps, ReportGroupProps } from './types';
3
3
  declare function Column<TType = unknown>(_: ReportColumnProps<TType>): null;
4
4
  declare function Group(_: ReportGroupProps): null;
5
- export declare const Report: (<TType = unknown>(props: Pick<import("../..").TableProps<TType>, "length" | "loadAll" | "loadPage" | "pageSize" | "enableFiltering" | "enableSearch" | "enableSorting" | "enableColumnFreezing" | "enableColumnHiding" | "enableColumnResizing" | "enableRowExpansion" | "enableRowSelection" | "enableRowSelectionSingle" | "enableColumnOrdering" | "enableFontSize" | "enableFooter" | "enablePrinting" | "enableRowActions" | "enableRowActive" | "enableRowClick" | "enableRowDrag" | "enableRowDrop" | "enableRowGoto" | "enableRowHeight" | "enableSaveSettings" | "children" | "data" | "id" | "customSettings" | "defaultColumnFreezingIndex" | "defaultRowActiveIndex" | "defaultRowGroupColumnId" | "defaultSettings" | "emptyState" | "rowActions" | "rowActionsForGroup" | "rowActionsLength" | "rowExpansionRenderer" | "rowIdentityColumnId" | "shortcuts" | "toolbarLeft" | "toolbarRight" | "toolbarPanel" | "onRowClick" | "onRowDrag" | "onRowDrop" | "onRowGoto" | "onRowSelect" | "onChangeFilter" | "onChangeSearch" | "onChangeSettings" | "onChangeSort"> & React.RefAttributes<import("../..").TableRef>) => JSX.Element) & {
5
+ export declare const Report: (<TType = unknown>(props: Pick<import("../..").TableProps<TType>, "length" | "loadAll" | "loadPage" | "pageSize" | "enableFiltering" | "enableSearch" | "enableSorting" | "enableColumnFreezing" | "enableColumnHiding" | "enableColumnResizing" | "enableRowExpansion" | "enableRowSelection" | "enableColumnOrdering" | "enableFontSize" | "enableFooter" | "enablePrinting" | "enableRowActions" | "enableRowActive" | "enableRowClick" | "enableRowDrag" | "enableRowDrop" | "enableRowGoto" | "enableRowHeight" | "enableSaveSettings" | "children" | "data" | "id" | "customSettings" | "defaultColumnFreezingIndex" | "defaultRowActiveIndex" | "defaultRowGroupColumnId" | "defaultSettings" | "emptyState" | "rowActions" | "rowActionsForGroup" | "rowActionsLength" | "rowExpansionRenderer" | "rowIdentityColumnId" | "shortcuts" | "toolbarLeft" | "toolbarRight" | "toolbarPanel" | "onRowClick" | "onRowDrag" | "onRowDrop" | "onRowGoto" | "onRowSelect" | "onChangeFilter" | "onChangeSearch" | "onChangeSettings" | "onChangeSort"> & React.RefAttributes<import("../..").TableRef>) => JSX.Element) & {
6
6
  Column: typeof Column;
7
7
  Group: typeof Group;
8
8
  };
@@ -1,7 +1,6 @@
1
1
  import React from 'react';
2
- import { Cell as ReactTableCell, Table as ReactTable } from '@tanstack/react-table';
2
+ import { Cell as ReactTableCell } from '@tanstack/react-table';
3
3
  import { Table3EditingChangeHandler, Table3EditingSaveHandler, Table3EditingValidatorFn } from '../types';
4
- import { TableRef } from '../../../primitives/Table/types';
5
4
  export declare function useTableEditing<TType = unknown>(isEnabled: boolean | undefined, handleSave: Table3EditingSaveHandler<TType> | undefined, handleChange: Table3EditingChangeHandler<TType> | undefined, validator: Table3EditingValidatorFn<TType> | undefined): {
6
5
  getCellValue: <T extends TType>(cell: ReactTableCell<T, unknown>) => unknown;
7
6
  getCellError: <T_1 extends TType>(cell: ReactTableCell<T_1, unknown>) => string | undefined;
@@ -9,19 +8,20 @@ export declare function useTableEditing<TType = unknown>(isEnabled: boolean | un
9
8
  validateCell: <T_3 extends TType>(cell: ReactTableCell<T_3, unknown>) => Promise<void>;
10
9
  addCreatedRowChangeset: (row: any) => Promise<void>;
11
10
  hasChanges: (rowId?: string | undefined) => boolean;
12
- hasErrors: <T_4 extends TType>(table: ReactTable<T_4>, tableRef: React.RefObject<TableRef>) => number | false;
13
- getErrors: <T_5 extends TType>() => {
11
+ hasAlertErrors: () => boolean;
12
+ getAlertErrors: <T_4 extends TType>() => {
14
13
  rowId: string;
15
- pendingChange: PendingChange<T_5>;
14
+ pendingChange: PendingChange<T_4>;
16
15
  }[];
17
16
  saveChanges: (rowId?: string | undefined) => Promise<void>;
18
17
  resetChanges: (rowId: string) => void;
19
18
  hasRowErrors: (rowId: string) => boolean;
20
19
  hasRowErrorsSeen: (rowId: string) => boolean;
21
- setRowErrorsSeen: (rowId: string) => void;
20
+ getRowPendingChange: (rowId: string) => Pick<PendingChange<TType>, Exclude<keyof TType, "_meta">> | undefined;
22
21
  getRowSaveStatus: (rowId: string) => false | "pending" | "complete";
23
22
  setRowSaveStatus: (rowId: string, status: "pending" | "complete" | undefined) => void;
24
23
  getRowMoveReason: (rowId: string) => "search" | "sorting" | "filter" | undefined;
24
+ getCompletedRowsCount: () => number;
25
25
  isEnabled: boolean;
26
26
  isEditing: boolean;
27
27
  isDetailedMode: boolean;
@@ -31,14 +31,14 @@ export declare function useTableEditing<TType = unknown>(isEnabled: boolean | un
31
31
  setLastFocusedCellIndex: (index: number | undefined) => void;
32
32
  };
33
33
  declare type SaveState = 'pending' | 'complete';
34
- declare type PendingChange<TType = unknown> = Partial<TType> & {
34
+ export declare type PendingChange<TType = unknown> = Partial<TType> & {
35
35
  _meta: {
36
36
  original: TType;
37
37
  moveReason: Record<string, 'search' | 'sorting' | 'filter'>;
38
38
  errors: {
39
39
  row: string;
40
40
  cells: Record<string, string>;
41
- hasShownErrorAlert: boolean;
41
+ shouldShowErrorAlert: boolean;
42
42
  };
43
43
  status?: SaveState;
44
44
  };
@@ -674,13 +674,19 @@ table[data-taco^='table'] th[aria-sort]:hover {
674
674
 
675
675
  table[data-taco^='table'] td {
676
676
  /* layout */
677
- @apply flex justify-start px-[var(--table-cell-padding-x)] py-[var(--table-cell-padding-y)];
677
+ @apply flex justify-start px-[var(--table-cell-padding-x)] pt-[var(--table-cell-padding-y)];
678
678
  /* styling */
679
679
  @apply border-grey-300 border-b bg-white outline-none;
680
680
  /* word breaking */
681
681
  @apply break-word hyphens-auto whitespace-pre-line;
682
682
  }
683
683
 
684
+ /* apply bottom padding only when the cell is text only) */
685
+
686
+ table[data-taco^='table'] td:not(:has(> *)) {
687
+ @apply pb-[var(--table-cell-padding-y)];
688
+ }
689
+
684
690
  table[data-taco^='table'][data-table-row-height='short'] td {
685
691
  @apply min-h-[33px];
686
692
  }
@@ -691,6 +697,14 @@ table[data-taco^='table'][data-table-row-height] tfoot td {
691
697
  @apply min-h-[41px];
692
698
  }
693
699
 
700
+ table[data-taco^='table'][data-table-row-height='tall'] td {
701
+ @apply min-h-[49px];
702
+ }
703
+
704
+ table[data-taco^='table'][data-table-row-height='extra-tall'] td {
705
+ @apply min-h-[61px];
706
+ }
707
+
694
708
  table[data-taco^='table'] [data-cell-align='left'] {
695
709
  @apply justify-start text-left;
696
710
  }
@@ -766,13 +780,17 @@ table[data-taco^='table'] td label {
766
780
  }
767
781
 
768
782
  table[data-taco^='table'] td label [data-taco='label-message'] {
769
- @apply !-mb-1.5 !-ml-2 !mt-1.5;
783
+ @apply !-ml-2 !mb-1 !mt-1.5;
770
784
  }
771
785
 
772
786
  table[data-taco^='table'] td label [data-taco='switch'] + [data-taco='label-message'] {
773
787
  @apply !ml-0;
774
788
  }
775
789
 
790
+ table[data-taco^='table'][data-table-font-size] td [role='checkbox'] [data-taco='icon'] {
791
+ @apply !my-0;
792
+ }
793
+
776
794
  /* font sizing */
777
795
  table[data-taco^='table'][data-table-font-size='small'] {
778
796
  @apply text-xs;
@@ -787,8 +805,8 @@ table[data-taco^='table'][data-table-font-size='large'] {
787
805
  }
788
806
 
789
807
  /* small font size */
790
- table[data-taco^='table'][data-table-font-size='small'] td > [data-taco='button'],
791
- table[data-taco^='table'][data-table-font-size='small'] td > [data-taco='icon-button'] {
808
+ table[data-taco^='table'][data-table-font-size='small'] td [data-taco='button'],
809
+ table[data-taco^='table'][data-table-font-size='small'] td [data-taco='icon-button'] {
792
810
  @apply !-my-2;
793
811
  }
794
812
 
@@ -796,7 +814,7 @@ table[data-taco^='table'][data-table-font-size='small'] td [data-taco='spinner']
796
814
  @apply !h-4 !w-4;
797
815
  }
798
816
 
799
- table[data-taco^='table'][data-table-font-size='small'] td > [data-taco='icon'],
817
+ table[data-taco^='table'][data-table-font-size='small'] td [data-taco='icon'],
800
818
  table[data-taco^='table'][data-table-font-size='small'] td [data-taco='spinner'] {
801
819
  @apply !-my-[3px];
802
820
  }
@@ -815,7 +833,7 @@ table[data-taco^='table'][data-table-font-size='small'] td [data-taco='tag'] {
815
833
  table[data-taco^='table'][data-table-font-size='small'] td [data-taco='select2-container'],
816
834
  table[data-taco^='table'][data-table-font-size='small'] td [data-taco='Select2'],
817
835
  table[data-taco^='table'][data-table-font-size='small'] td [data-taco='textarea'] {
818
- @apply !-mx-[7px] !-my-[4px] !min-h-[theme(spacing.6)] !w-[calc(100%_+_14px)] text-xs focus:z-10;
836
+ @apply !-mx-[7px] !-mt-[4px] !min-h-[theme(spacing.6)] !w-[calc(100%_+_14px)] text-xs focus:z-10;
819
837
  }
820
838
 
821
839
  table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container']:has([data-taco='input']) {
@@ -823,7 +841,7 @@ table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-con
823
841
  }
824
842
 
825
843
  table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container']:has([data-taco='input']) [data-taco='input'] {
826
- @apply !-my-[4px] !min-h-[theme(spacing.6)] !w-[calc(100%_+_14px)] text-xs focus:z-10;
844
+ @apply !-my-[4px] !min-h-[theme(spacing.6)] !w-[calc(100%_+_14px)] !pl-[3px] text-xs focus:z-10;
827
845
  }
828
846
 
829
847
  table[data-taco^='table'][data-table-font-size='small'] td [data-taco='Select2'],
@@ -841,7 +859,7 @@ table[data-taco^='table'][data-table-font-size='small'] td [data-taco='Select2']
841
859
  }
842
860
 
843
861
  table[data-taco^='table'][data-table-font-size='small'] td [data-taco='textarea'] {
844
- @apply !py-[3px] !leading-4;
862
+ @apply !mb-1.5 !py-[3px] !leading-4;
845
863
  }
846
864
 
847
865
  table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container'] [data-affix-type='postfix'] button {
@@ -877,16 +895,16 @@ table[data-taco^='table'][data-table-font-size='small'] td [data-taco='switch-co
877
895
  }
878
896
 
879
897
  /* medium font size */
880
- table[data-taco^='table'][data-table-font-size='medium'] td > [data-taco='spinner'] {
898
+ table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='spinner'] {
881
899
  @apply !h-5 !w-5;
882
900
  }
883
901
 
884
- table[data-taco^='table'][data-table-font-size='medium'] td > [data-taco='button'],
885
- table[data-taco^='table'][data-table-font-size='medium'] td > [data-taco='icon-button'] {
902
+ table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='button'],
903
+ table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='icon-button'] {
886
904
  @apply !-my-1.5;
887
905
  }
888
906
 
889
- table[data-taco^='table'][data-table-font-size='medium'] td > [data-taco='icon'] {
907
+ table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='icon'] {
890
908
  @apply !-my-0.5;
891
909
  }
892
910
 
@@ -905,7 +923,7 @@ table[data-taco^='table'][data-table-font-size='medium'] td [role='combobox'] [d
905
923
  table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='select2-container'],
906
924
  table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='Select2'],
907
925
  table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='textarea'] {
908
- @apply !-mx-[9px] !-my-[6px] !min-h-[theme(spacing.8)] !w-[calc(100%_+_16px)] focus:z-10;
926
+ @apply !-mx-[9px] !-mt-[6px] !min-h-[theme(spacing.8)] !w-[calc(100%_+_16px)] focus:z-10;
909
927
  }
910
928
 
911
929
  table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input-container']:has([data-taco='input']) {
@@ -934,7 +952,7 @@ table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='Select2'
934
952
  }
935
953
 
936
954
  table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='textarea'] {
937
- @apply !-mb-[8px] !pr-[5px];
955
+ @apply !mb-[3px] !pr-[5px];
938
956
  }
939
957
 
940
958
  table[data-taco^='table'][data-table-font-size='medium'] td[data-cell-truncate='true'] [data-taco='textarea'] {
@@ -950,16 +968,16 @@ table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input-co
950
968
  }
951
969
 
952
970
  /* large font size */
953
- table[data-taco^='table'][data-table-font-size='large'] td > [data-taco='spinner'] {
971
+ table[data-taco^='table'][data-table-font-size='large'] td [data-taco='spinner'] {
954
972
  @apply !h-6 !w-6;
955
973
  }
956
974
 
957
- table[data-taco^='table'][data-table-font-size='large'] td > [data-taco='button'],
958
- table[data-taco^='table'][data-table-font-size='large'] td > [data-taco='icon-button'] {
975
+ table[data-taco^='table'][data-table-font-size='large'] td [data-taco='button'],
976
+ table[data-taco^='table'][data-table-font-size='large'] td [data-taco='icon-button'] {
959
977
  @apply !-my-1;
960
978
  }
961
979
 
962
- table[data-taco^='table'][data-table-font-size='large'] td > [data-taco='icon'] {
980
+ table[data-taco^='table'][data-table-font-size='large'] td [data-taco='icon'] {
963
981
  @apply !-my-0.5;
964
982
  }
965
983
 
@@ -998,7 +1016,7 @@ table[data-taco^='table'][data-table-font-size='large'] td [data-taco='Select2']
998
1016
  }
999
1017
 
1000
1018
  table[data-taco^='table'][data-table-font-size='large'] td [data-taco='textarea'] {
1001
- @apply !py-[7.5px];
1019
+ @apply !-mb-[1px] !py-[7.5px];
1002
1020
  }
1003
1021
 
1004
1022
  table[data-taco^='table'][data-table-font-size='large'] td:not([data-cell-truncate='true']) > [data-taco='textarea'] {
@@ -1255,19 +1273,23 @@ table[data-taco='table3'][data-table-editing-mode] tbody tr:not([data-row-active
1255
1273
  }
1256
1274
 
1257
1275
  table[data-taco='table3'][data-table-editing-mode] tbody tr[data-row-editing-move='true'] {
1258
- @apply rounded border-2 border-blue-500 px-px;
1276
+ @apply rounded-[4px] border-y-2 border-blue-500;
1259
1277
  }
1260
1278
 
1261
1279
  table[data-taco='table3'][data-table-editing-mode] tbody tr[data-row-editing-move='true'] td {
1262
1280
  @apply z-30 border-b-0;
1263
1281
  }
1264
1282
 
1283
+ table[data-taco='table3'][data-table-editing-mode] tbody tr[data-row-editing-move='true'] td[data-cell-pinned] {
1284
+ @apply z-40;
1285
+ }
1286
+
1265
1287
  table[data-taco='table3'][data-table-editing-mode] tbody tr[data-row-editing-move='true'] > td:first-child {
1266
- @apply rounded-l;
1288
+ @apply border-l-2 border-blue-500 pl-[calc(var(--table-cell-padding-x)_-_2px)];
1267
1289
  }
1268
1290
 
1269
1291
  table[data-taco='table3'][data-table-editing-mode] tbody tr[data-row-editing-move='true'] > td:last-child {
1270
- @apply rounded-l;
1292
+ @apply border-r-2 border-blue-500 pr-[calc(var(--table-cell-padding-x)_-_2px)];
1271
1293
  }
1272
1294
 
1273
1295
  /* invalid rows */
@@ -31,6 +31,11 @@ const Datepicker = /*#__PURE__*/forwardRef(function Datepicker(props, ref) {
31
31
  const currentDay = (_popoverContentRef$cu = popoverContentRef === null || popoverContentRef === void 0 ? void 0 : (_popoverContentRef$cu2 = popoverContentRef.current) === null || _popoverContentRef$cu2 === void 0 ? void 0 : _popoverContentRef$cu2.querySelector('table button[name="day"][aria-selected="true"]')) !== null && _popoverContentRef$cu !== void 0 ? _popoverContentRef$cu : null;
32
32
  currentDay === null || currentDay === void 0 ? void 0 : currentDay.focus();
33
33
  }, [popoverContentRef]);
34
+ const handleCloseAutoFocus = useCallback(e => {
35
+ var _input$ref$current;
36
+ e.preventDefault();
37
+ (_input$ref$current = input.ref.current) === null || _input$ref$current === void 0 ? void 0 : _input$ref$current.focus();
38
+ }, [input.ref]);
34
39
  return /*#__PURE__*/createElement("span", {
35
40
  className: className,
36
41
  "data-taco": "datepicker",
@@ -42,7 +47,8 @@ const Datepicker = /*#__PURE__*/forwardRef(function Datepicker(props, ref) {
42
47
  icon: "calendar",
43
48
  tabIndex: -1,
44
49
  popover: props => (/*#__PURE__*/createElement(Popover, Object.assign({}, props), /*#__PURE__*/createElement(Popover.Content, {
45
- onOpenAutoFocus: handleOpenAutofocus
50
+ onOpenAutoFocus: handleOpenAutofocus,
51
+ onCloseAutoFocus: handleCloseAutoFocus
46
52
  }, ({
47
53
  close
48
54
  }) => (/*#__PURE__*/createElement("div", {
@@ -1 +1 @@
1
- {"version":3,"file":"Datepicker.js","sources":["../../../../../../../src/components/Datepicker/Datepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { Calendar, CalendarProps } from '../Calendar/Calendar';\nimport { Input, InputProps } from '../Input/Input';\nimport { useLocalization } from '../Provider/Localization';\nimport { useDatepicker } from './useDatepicker';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Popover } from '../Popover/Popover';\n\nexport type DatepickerTexts = {\n /** Aria-label for calendar */\n calendar: string;\n /** Clear button text */\n clear: string;\n /**\n * Aria-label for calendar icon button in the input.\n * Calendar will open when user clicks this icon button.\n */\n expand: string;\n /** Shortcut heading text */\n shortcuts: string;\n};\n\nexport type DatePickerShortcut = {\n onClick: (event: React.MouseEvent) => void;\n text: string;\n};\n\nexport type DatepickerProps = Omit<InputProps, 'value'> & {\n /** [Calendar](component:calendar) component associated with the DatePicker */\n calendar?: CalendarProps;\n /** List of shortcuts */\n shortcuts?: DatePickerShortcut[];\n /** Title for the shortcuts panel */\n shortcutsText?: string;\n /** Handler to be called when the clear button is clicked */\n onReset?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /**\n * Date value of the calendar.\n * This will be displayed in DatePicker's input in the format given to the [Provider](component:provider) component\n */\n value?: Date | string;\n};\n\nexport const Datepicker = React.forwardRef(function Datepicker(props: DatepickerProps, ref: React.Ref<HTMLInputElement>) {\n const { className: externalClassName, onReset: handleReset, style, shortcuts, shortcutsText, ...otherProps } = props;\n const { calendar, input } = useDatepicker(otherProps, ref);\n const { texts } = useLocalization();\n const className = cn('inline-flex w-full text-black font-normal', externalClassName);\n\n const popoverContentRef = React.useRef<HTMLDivElement>(null);\n const handleOpenAutofocus = React.useCallback(\n (e: Event) => {\n e.preventDefault();\n\n const currentDay: HTMLButtonElement | null =\n popoverContentRef?.current?.querySelector('table button[name=\"day\"][aria-selected=\"true\"]') ?? null;\n currentDay?.focus();\n },\n [popoverContentRef]\n );\n\n return (\n <span className={className} data-taco=\"datepicker\" style={style}>\n <Input\n {...input}\n button={\n input.readOnly ? undefined : (\n <IconButton\n aria-label={texts.datepicker.expand}\n disabled={input.disabled || input.readOnly}\n icon=\"calendar\"\n tabIndex={-1}\n popover={props => (\n <Popover {...props}>\n <Popover.Content onOpenAutoFocus={handleOpenAutofocus}>\n {({ close }) => (\n <div\n className='[&_button[name=\"day\"]:focus]:yt-focus -m-3 flex'\n ref={popoverContentRef}>\n <Calendar\n {...calendar}\n onChange={(date: Date, event?: React.MouseEvent<Element>) => {\n calendar.onChange(date, event);\n close();\n }}\n />\n {shortcuts && (\n <div className=\"border-grey-300 flex flex-col border-l\">\n <span className=\"m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold\">\n {shortcutsText ?? texts.datepicker.shortcuts}\n </span>\n <ul>\n {shortcuts.map(shortcut => (\n <li key={shortcut.text}>\n <button\n type=\"button\"\n className=\"hover:wcag-grey-200 flex w-full items-start px-4 py-1 text-xs\"\n onClick={event => {\n event.persist();\n shortcut.onClick(event);\n close();\n }}>\n {shortcut.text}\n </button>\n </li>\n ))}\n </ul>\n {handleReset && (\n <button\n type=\"button\"\n className=\"mx-auto my-4 mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300\"\n onClick={event => {\n event.persist();\n handleReset(event);\n close();\n }}>\n {texts.datepicker.clear}\n </button>\n )}\n </div>\n )}\n </div>\n )}\n </Popover.Content>\n </Popover>\n )}\n tooltip={texts.datepicker.calendar}\n />\n )\n }\n />\n </span>\n );\n});\nDatepicker.displayName = 'Datepicker';\n"],"names":["Datepicker","React","props","ref","className","externalClassName","onReset","handleReset","style","shortcuts","shortcutsText","otherProps","calendar","input","useDatepicker","texts","useLocalization","cn","popoverContentRef","handleOpenAutofocus","e","preventDefault","currentDay","_popoverContentRef$cu","_popoverContentRef$cu2","current","querySelector","focus","Input","button","readOnly","undefined","IconButton","datepicker","expand","disabled","icon","tabIndex","popover","Popover","Content","onOpenAutoFocus","close","Calendar","onChange","date","event","map","shortcut","key","text","type","onClick","persist","clear","tooltip","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"Datepicker.js","sources":["../../../../../../../src/components/Datepicker/Datepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { Calendar, CalendarProps } from '../Calendar/Calendar';\nimport { Input, InputProps } from '../Input/Input';\nimport { useLocalization } from '../Provider/Localization';\nimport { useDatepicker } from './useDatepicker';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Popover } from '../Popover/Popover';\n\nexport type DatepickerTexts = {\n /** Aria-label for calendar */\n calendar: string;\n /** Clear button text */\n clear: string;\n /**\n * Aria-label for calendar icon button in the input.\n * Calendar will open when user clicks this icon button.\n */\n expand: string;\n /** Shortcut heading text */\n shortcuts: string;\n};\n\nexport type DatePickerShortcut = {\n onClick: (event: React.MouseEvent) => void;\n text: string;\n};\n\nexport type DatepickerProps = Omit<InputProps, 'value'> & {\n /** [Calendar](component:calendar) component associated with the DatePicker */\n calendar?: CalendarProps;\n /** List of shortcuts */\n shortcuts?: DatePickerShortcut[];\n /** Title for the shortcuts panel */\n shortcutsText?: string;\n /** Handler to be called when the clear button is clicked */\n onReset?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /**\n * Date value of the calendar.\n * This will be displayed in DatePicker's input in the format given to the [Provider](component:provider) component\n */\n value?: Date | string;\n};\n\nexport const Datepicker = React.forwardRef(function Datepicker(props: DatepickerProps, ref: React.Ref<HTMLInputElement>) {\n const { className: externalClassName, onReset: handleReset, style, shortcuts, shortcutsText, ...otherProps } = props;\n const { calendar, input } = useDatepicker(otherProps, ref);\n const { texts } = useLocalization();\n const className = cn('inline-flex w-full text-black font-normal', externalClassName);\n\n const popoverContentRef = React.useRef<HTMLDivElement>(null);\n\n const handleOpenAutofocus = React.useCallback(\n (e: Event) => {\n e.preventDefault();\n const currentDay: HTMLButtonElement | null =\n popoverContentRef?.current?.querySelector('table button[name=\"day\"][aria-selected=\"true\"]') ?? null;\n currentDay?.focus();\n },\n [popoverContentRef]\n );\n\n const handleCloseAutoFocus = React.useCallback(\n (e: Event) => {\n e.preventDefault();\n input.ref.current?.focus();\n },\n [input.ref]\n );\n\n return (\n <span className={className} data-taco=\"datepicker\" style={style}>\n <Input\n {...input}\n button={\n input.readOnly ? undefined : (\n <IconButton\n aria-label={texts.datepicker.expand}\n disabled={input.disabled || input.readOnly}\n icon=\"calendar\"\n tabIndex={-1}\n popover={props => (\n <Popover {...props}>\n <Popover.Content\n onOpenAutoFocus={handleOpenAutofocus}\n onCloseAutoFocus={handleCloseAutoFocus}>\n {({ close }) => (\n <div\n className='[&_button[name=\"day\"]:focus]:yt-focus -m-3 flex'\n ref={popoverContentRef}>\n <Calendar\n {...calendar}\n onChange={(date: Date, event?: React.MouseEvent<Element>) => {\n calendar.onChange(date, event);\n close();\n }}\n />\n {shortcuts && (\n <div className=\"border-grey-300 flex flex-col border-l\">\n <span className=\"m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold\">\n {shortcutsText ?? texts.datepicker.shortcuts}\n </span>\n <ul>\n {shortcuts.map(shortcut => (\n <li key={shortcut.text}>\n <button\n type=\"button\"\n className=\"hover:wcag-grey-200 flex w-full items-start px-4 py-1 text-xs\"\n onClick={event => {\n event.persist();\n shortcut.onClick(event);\n close();\n }}>\n {shortcut.text}\n </button>\n </li>\n ))}\n </ul>\n {handleReset && (\n <button\n type=\"button\"\n className=\"mx-auto my-4 mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300\"\n onClick={event => {\n event.persist();\n handleReset(event);\n close();\n }}>\n {texts.datepicker.clear}\n </button>\n )}\n </div>\n )}\n </div>\n )}\n </Popover.Content>\n </Popover>\n )}\n tooltip={texts.datepicker.calendar}\n />\n )\n }\n />\n </span>\n );\n});\nDatepicker.displayName = 'Datepicker';\n"],"names":["Datepicker","React","props","ref","className","externalClassName","onReset","handleReset","style","shortcuts","shortcutsText","otherProps","calendar","input","useDatepicker","texts","useLocalization","cn","popoverContentRef","handleOpenAutofocus","e","preventDefault","currentDay","_popoverContentRef$cu","_popoverContentRef$cu2","current","querySelector","focus","handleCloseAutoFocus","_input$ref$current","Input","button","readOnly","undefined","IconButton","datepicker","expand","disabled","icon","tabIndex","popover","Popover","Content","onOpenAutoFocus","onCloseAutoFocus","close","Calendar","onChange","date","event","map","shortcut","key","text","type","onClick","persist","clear","tooltip","displayName"],"mappings":"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"}
@@ -217,8 +217,12 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
217
217
  setValue(nextValue);
218
218
  }
219
219
  };
220
- const className = cn('border-grey-300 rounded border bg-white py-1.5 shadow-md outline-none', createCollectionClassName());
221
- const isInlineCreation = onCreate && !createDialog;
220
+ const hasInlineCreation = onCreate && !createDialog;
221
+ const hasSearch = flattenedChildren.length > 5 || hasInlineCreation;
222
+ const className = cn('border-grey-300 rounded border bg-white py-1.5 shadow-md ', {
223
+ 'focus-within:yt-focus': !hasSearch,
224
+ 'outline-none': hasSearch
225
+ }, createCollectionClassName());
222
226
  return /*#__PURE__*/React__default.createElement(Select2Context.Provider, {
223
227
  value: context
224
228
  }, /*#__PURE__*/React__default.createElement(Root, {
@@ -249,8 +253,8 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
249
253
  style: {
250
254
  minWidth: dimensions !== null && dimensions !== void 0 && dimensions.width ? `${dimensions.width}px` : undefined
251
255
  }
252
- }, flattenedChildren.length > 0 || isInlineCreation ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Search, {
253
- placeholder: isInlineCreation ? texts.select2.searchOrCreate : texts.select2.search,
256
+ }, hasSearch ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Search, {
257
+ placeholder: hasInlineCreation ? texts.select2.searchOrCreate : texts.select2.search,
254
258
  ref: searchRef,
255
259
  onTabKeyPress: () => setTabTriggeredClose(true)
256
260
  }), multiple && selectOptions.length > 1 && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Button, {
@@ -272,7 +276,7 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
272
276
  className: "text-grey-700 -mt-0.5 flex h-8 items-center px-2",
273
277
  role: "presentation"
274
278
  }, texts.listbox.empty)) : (/*#__PURE__*/React__default.createElement(Root$1, {
275
- className: "flex flex-col gap-0.5",
279
+ className: "flex flex-col gap-0.5 focus-visible:outline-none",
276
280
  customSelector: ":scope > button",
277
281
  disabled: disabled,
278
282
  multiple: multiple,
@@ -280,7 +284,6 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
280
284
  readOnly: readOnly,
281
285
  ref: listboxRef,
282
286
  setValue: setValue,
283
- tabIndex: -1,
284
287
  value: value
285
288
  }, searchQuery === '' ? (/*#__PURE__*/React__default.createElement(Collection, null, initialChildren)) : (/*#__PURE__*/React__default.createElement(Collection, null, filteredChildren)), onCreate ? /*#__PURE__*/React__default.createElement(Create, {
286
289
  onCreate: onCreate,
@@ -1 +1 @@
1
- {"version":3,"file":"Select2.js","sources":["../../../../../../../src/components/Select2/Select2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as ListboxPrimitive from '../../primitives/Listbox2/Listbox2';\nimport {\n Select2Children,\n Select2CreateHandler,\n Select2CreateDialogRenderer,\n Select2DeleteHandler,\n Select2EditHandler,\n Select2OptionValue,\n Select2Value,\n} from './types';\nimport { Option, Select2OptionProps } from './components/Option';\nimport { Group, Select2GroupProps } from './components/Group';\nimport { Select2TitleProps, Title } from './components/Title';\nimport { Select2Context } from './components/Context';\nimport { createCollectionClassName, getFontSize } from './utilities';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport { Trigger } from './components/Trigger';\nimport { useIsFormControl } from '../../hooks/useIsFormControl';\nimport { BubbleSelect } from '../../primitives/BubbleSelect';\nimport { Search } from './components/Search';\nimport { isGroup, useChildren } from './hooks/useChildren';\n\nimport { Create } from './components/Create';\nimport { Collection } from './components/Collection';\nimport { CollectionRef } from '../../primitives/Collection/Collection';\nimport { useLocalization } from '../Provider/Localization';\nimport { useIsHoverStatePaused } from '../../hooks/useIsHoverStatePaused';\nimport { isAriaDirectionKey } from '../../utils/aria';\nimport { getNextFocussableElement, isElementInsideTable3OrReport } from '../../utils/dom';\nimport { FontSize, FontSizes } from '../../types';\nimport { Button } from '../Button/Button';\nimport { Spinner } from '../Spinner/Spinner';\n\ntype Select2Texts = {\n allSelect: string;\n allDeselect: string;\n cancel: string;\n chooseColor: string;\n create: string;\n delete: string;\n save: string;\n search: string;\n searchOrCreate: string;\n selectAll: string;\n selectAllResults: string;\n deselectAll: string;\n deselectAllResults: string;\n};\n\ntype Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n /** Autofocus Select2 when loaded **/\n autoFocus?: boolean;\n /** Array of options in Select2 */\n children: Select2Children;\n /** Initial value of the input in Select2 */\n defaultValue?: Select2Value;\n /** Set what value should have an empty option in Select2 */\n emptyValue?: Select2OptionValue;\n /** Whether the Select2 is in a disabled state **/\n disabled?: boolean;\n /** Font size of text in Select2 **/\n fontSize?: FontSize;\n /** Draws attention to the Select2 by changing its style and making it visually prominent */\n highlighted?: boolean;\n /** Whether the Select2 is in an invalid state **/\n invalid?: boolean;\n /** Whether the Select2 is loading the data **/\n loading?: boolean;\n /** Whether the Select2 allows selecting multiple values **/\n multiple?: boolean;\n /** Whether the Select2 is in an invalid state **/\n name?: string;\n /** Handler called when user chooses an option from the provided options **/\n onChange?: (value: Select2Value) => void;\n /** Handler called when user creates a new option **/\n onCreate?: Select2CreateHandler;\n /** Handler called when user deletes an option **/\n onDelete?: Select2DeleteHandler;\n /** Handler called when user edits an option **/\n onEdit?: Select2EditHandler;\n /** Placeholder showed when nothing is selected **/\n placeholder?: string;\n /** Whether the Select2 is in a readonly state **/\n readOnly?: boolean;\n required?: boolean;\n /** Renders select options as tags **/\n tags?: boolean;\n /** Value of the input in select2 */\n value?: Select2Value;\n /** Create dialog component, if specified, then create button will become always visible in the bottom of options dropdown,\n * when clicked, it will open create dialog and wait for 'onCreate' handler to be triggered from the dialog */\n createDialog?: Select2CreateDialogRenderer;\n /** Create button text */\n createTriggerText?: string;\n};\ntype Select2PropsWithStatics = React.ForwardRefExoticComponent<Select2Props & React.RefAttributes<HTMLButtonElement>> & {\n Option: React.ForwardRefExoticComponent<Select2OptionProps>;\n Group: React.ForwardRefExoticComponent<Select2GroupProps>;\n Title: React.ForwardRefExoticComponent<Select2TitleProps>;\n};\n\nconst Select2 = React.forwardRef<HTMLButtonElement, Select2Props>(function Select2(props, ref) {\n const {\n children: initChildren,\n defaultValue: defaultProp,\n disabled = false,\n emptyValue = undefined,\n fontSize,\n highlighted = false,\n invalid = false,\n loading,\n multiple = false,\n name,\n onChange,\n onCreate,\n onDelete,\n onEdit,\n placeholder,\n readOnly = false,\n tags = false,\n value: prop,\n createDialog,\n createTriggerText,\n ...otherProps\n } = props;\n\n const emptyOption: React.ReactElement<Select2OptionProps> | undefined = React.useMemo(() => {\n if (emptyValue !== undefined && !multiple) {\n // Empty option has 0px height, because it's empty, so need to apply height manually\n return <Option key=\"__empty\" children=\"\" value={emptyValue} className=\"h-8\" />;\n }\n return;\n }, [emptyValue, multiple]);\n\n const initialChildren = React.useMemo(() => {\n if (emptyOption) {\n return [emptyOption, ...initChildren] as Select2Children;\n }\n return initChildren;\n }, [emptyOption, initChildren]);\n\n // refs\n const internalRef = useMergedRef<HTMLButtonElement>(ref);\n const listboxRef = React.useRef<CollectionRef>(null);\n const searchRef = React.useRef<HTMLInputElement>(null);\n const { texts } = useLocalization();\n // align the listbox min width with the width of the input - it should never be smaller\n const dimensions = useBoundingClientRectListener(internalRef);\n\n // state\n const [tabTriggeredClose, setTabTriggeredClose] = React.useState(false);\n const [open, setOpen] = React.useState(false);\n const [value, _setValue] = useControllableState<Select2Value>({\n // uncontrolled\n defaultProp,\n // controlled\n onChange,\n prop,\n });\n const setValue = ListboxPrimitive.createListboxValueSetter(multiple, _setValue);\n const [validationError, setValidationError] = React.useState<Error | undefined>();\n const [shouldPauseHoverState, setShouldPauseHoverState] = useIsHoverStatePaused();\n\n const { flattenedChildren, filteredChildren, searchQuery, setSearchQuery } = useChildren({\n children: initialChildren,\n emptyValue,\n multiple,\n open,\n setValue,\n value,\n });\n\n // context\n const context = {\n disabled,\n highlighted,\n invalid,\n listboxRef,\n multiple,\n onCreate,\n onDelete,\n onEdit,\n open,\n readOnly,\n ref: internalRef,\n searchQuery,\n searchRef,\n setOpen,\n setSearchQuery,\n setValidationError,\n setValue,\n shouldPauseHoverState,\n setShouldPauseHoverState,\n tags,\n fontSize,\n validationError,\n value,\n createDialog,\n createTriggerText,\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n if (open) {\n event.preventDefault();\n } else if (isElementInsideTable3OrReport(event.currentTarget)) {\n return;\n } else if (!event.ctrlKey && !event.metaKey && (event.key === 'ArrowDown' || /^[a-z0-9]$/i.test(event.key))) {\n setOpen(true);\n }\n\n // the focus should always remain on the input, so we forward events on to the listbox\n listboxRef.current?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n };\n\n let handleBlur;\n\n if (otherProps.onBlur) {\n // we might be focusing on an input or something inside the dropdown that was triggered by the select\n // so see if the element gaining focus is inside a portal and look up its controller\n // if we don't do this, things like validate on blur occur while simply opening the select\n handleBlur = (event: React.FocusEvent<HTMLButtonElement>) => {\n const elementGainingFocus = event.relatedTarget;\n\n if (elementGainingFocus === undefined) {\n return;\n }\n\n const portalId = elementGainingFocus?.closest('[data-radix-popper-content-wrapper] > :first-child')?.id;\n\n if (!portalId || event.currentTarget.getAttribute(`aria-controls`) !== portalId) {\n otherProps.onBlur?.(event);\n }\n };\n }\n\n const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n if (isAriaDirectionKey(event)) {\n setShouldPauseHoverState(true);\n }\n };\n\n const handleCloseAutoFocus = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n\n if (tabTriggeredClose) {\n const nextFocussableElement = getNextFocussableElement(internalRef.current);\n\n if (nextFocussableElement) {\n // UX requirement: move focus to the next focussable element when tab key is pressed to select the value\n nextFocussableElement.focus();\n // Reset the tabTriggeredClose state\n setTabTriggeredClose(false);\n }\n } else {\n internalRef.current?.focus();\n }\n };\n\n const selectOptions =\n searchQuery === ''\n ? flattenedChildren.map(child => child.props.value)\n : filteredChildren\n .map(child =>\n isGroup(child)\n ? Array.isArray(child.props.children) && child.props.children.map(subChild => subChild.props.value)\n : child.props.value\n )\n .flatMap(c => c) || [];\n\n const areAllSelected = Array.isArray(value) && selectOptions.every(option => value.includes(option as string));\n\n const selectAllText = React.useMemo(() => {\n if (searchQuery === '') {\n if (areAllSelected) {\n return texts.select2.deselectAll;\n } else {\n return texts.select2.selectAll;\n }\n } else if (areAllSelected) {\n return texts.select2.deselectAllResults;\n } else {\n return texts.select2.selectAllResults;\n }\n }, [areAllSelected, searchQuery]);\n\n const selectAll = () => {\n if (!Array.isArray(value) || value.length === 0) {\n setValue(selectOptions);\n } else {\n // array of all available options which are not selected\n const preselectedValues = selectOptions.filter(option => !value.includes(option));\n setValue([...value, ...preselectedValues]);\n }\n };\n\n const deselectAll = () => {\n if (searchQuery === '') {\n setValue([]);\n } else {\n const nextValue = Array.isArray(value) && value.filter(subValue => !selectOptions.includes(subValue as string));\n setValue(nextValue);\n }\n };\n\n const className = cn('border-grey-300 rounded border bg-white py-1.5 shadow-md outline-none', createCollectionClassName());\n const isInlineCreation = onCreate && !createDialog;\n\n return (\n <Select2Context.Provider value={context}>\n <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\n <PopoverPrimitive.Trigger asChild data-taco=\"Select2\">\n <Trigger\n {...otherProps}\n aria-haspopup=\"listbox\"\n emptyValue={emptyValue}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n ref={internalRef}>\n {flattenedChildren}\n </Trigger>\n </PopoverPrimitive.Trigger>\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n asChild\n align=\"start\"\n onOpenAutoFocus={() => {\n internalRef.current?.focus();\n }}\n onCloseAutoFocus={handleCloseAutoFocus}\n sideOffset={4}\n tabIndex={-1}>\n <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n {flattenedChildren.length > 0 || isInlineCreation ? (\n <>\n <Search\n placeholder={isInlineCreation ? texts.select2.searchOrCreate : texts.select2.search}\n ref={searchRef}\n onTabKeyPress={() => setTabTriggeredClose(true)}\n />\n {multiple && selectOptions.length > 1 && (\n <>\n <Button\n className=\"!justify-start\"\n appearance=\"discrete\"\n onClick={areAllSelected ? deselectAll : selectAll}>\n {selectAllText}\n </Button>\n <div className=\"border-grey-300 mx-3 rounded border-t\" />\n </>\n )}\n </>\n ) : null}\n {loading ? (\n <span className={cn('text-grey-700 flex items-center italic', fontSize && getFontSize(fontSize))}>\n <span>\n <Spinner\n delay={0}\n className={cn('ml-3 mr-2 mt-1.5 h-5 w-5', {\n '!mt-1 !h-3.5 !w-3.5': fontSize === FontSizes.small,\n '!h-4 !w-4': fontSize === FontSizes.medium,\n '!h-5 !w-5': fontSize === FontSizes.large,\n })}\n />\n </span>\n <span>{texts.listbox.loading}</span>\n </span>\n ) : flattenedChildren.length <= 0 ? (\n <div className=\"text-grey-700 -mt-0.5 flex h-8 items-center px-2\" role=\"presentation\">\n {texts.listbox.empty}\n </div>\n ) : (\n <ListboxPrimitive.Root\n className=\"flex flex-col gap-0.5\"\n customSelector=\":scope > button\"\n disabled={disabled}\n multiple={multiple}\n onKeyDown={handleListboxKeyDown}\n readOnly={readOnly}\n ref={listboxRef}\n setValue={setValue}\n tabIndex={-1}\n value={value}>\n {searchQuery === '' ? (\n <Collection>{initialChildren}</Collection>\n ) : (\n <Collection>{filteredChildren}</Collection>\n )}\n {onCreate ? <Create onCreate={onCreate} options={flattenedChildren} /> : null}\n </ListboxPrimitive.Root>\n )}\n </div>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n <ControlledHiddenField\n emptyValue={emptyValue}\n multiple={multiple || tags}\n name={name}\n options={flattenedChildren.map(child => child.props.value)}\n parentRef={internalRef}\n setValue={setValue}\n value={value}\n />\n </PopoverPrimitive.Root>\n </Select2Context.Provider>\n );\n}) as Select2PropsWithStatics;\nSelect2.Option = Option;\nSelect2.Group = Group;\nSelect2.Title = Title;\n\nconst ControlledHiddenField = props => {\n const { emptyValue, multiple, name, options, parentRef, value, setValue } = props;\n const isFormControl = useIsFormControl(parentRef, () => setValue(multiple ? [] : undefined));\n\n let bubbleValue;\n\n if (isFormControl) {\n if (value !== undefined) {\n if (multiple) {\n bubbleValue = Array.isArray(value) ? value.map(String) : [value === null ? '' : String(value)];\n } else {\n bubbleValue = value === null ? '' : String(value);\n }\n }\n\n return (\n <BubbleSelect aria-hidden key={String(bubbleValue)} multiple={multiple} name={name} value={bubbleValue}>\n {emptyValue !== undefined ? <option value={emptyValue} /> : null}\n {options.map(option => (\n <option key={String(option)} value={String(option)} />\n ))}\n </BubbleSelect>\n );\n }\n\n return null;\n};\nSelect2.displayName = 'Select2';\n\nexport { Select2 };\n\nexport type {\n Select2Texts,\n Select2GroupProps,\n Select2OptionProps,\n Select2OptionValue,\n Select2Value,\n Select2Props,\n Select2TitleProps,\n};\n"],"names":["Select2","React","forwardRef","props","ref","children","initChildren","defaultValue","defaultProp","disabled","emptyValue","undefined","fontSize","highlighted","invalid","loading","multiple","name","onChange","onCreate","onDelete","onEdit","placeholder","readOnly","tags","value","prop","createDialog","createTriggerText","otherProps","emptyOption","useMemo","Option","key","className","initialChildren","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","tabTriggeredClose","setTabTriggeredClose","useState","open","setOpen","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","shouldPauseHoverState","setShouldPauseHoverState","useIsHoverStatePaused","flattenedChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","handleKeyDown","event","preventDefault","isElementInsideTable3OrReport","currentTarget","ctrlKey","metaKey","test","_listboxRef$current","current","dispatchEvent","createCustomKeyboardEvent","handleBlur","onBlur","elementGainingFocus","relatedTarget","portalId","_elementGainingFocus$","closest","id","getAttribute","_otherProps$onBlur","call","handleListboxKeyDown","isAriaDirectionKey","handleCloseAutoFocus","stopPropagation","nextFocussableElement","getNextFocussableElement","focus","_internalRef$current","selectOptions","map","child","isGroup","Array","isArray","subChild","flatMap","c","areAllSelected","every","option","includes","selectAllText","select2","deselectAll","selectAll","deselectAllResults","selectAllResults","length","preselectedValues","filter","nextValue","subValue","cn","createCollectionClassName","isInlineCreation","Select2Context","Provider","PopoverPrimitive","onOpenChange","asChild","Trigger","onKeyDown","align","onOpenAutoFocus","_internalRef$current2","onCloseAutoFocus","sideOffset","tabIndex","style","minWidth","width","Search","searchOrCreate","search","onTabKeyPress","Button","appearance","onClick","getFontSize","Spinner","delay","FontSizes","small","medium","large","listbox","role","empty","customSelector","Collection","Create","options","ControlledHiddenField","parentRef","Group","Title","isFormControl","useIsFormControl","bubbleValue","String","BubbleSelect","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"Select2.js","sources":["../../../../../../../src/components/Select2/Select2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as ListboxPrimitive from '../../primitives/Listbox2/Listbox2';\nimport {\n Select2Children,\n Select2CreateHandler,\n Select2CreateDialogRenderer,\n Select2DeleteHandler,\n Select2EditHandler,\n Select2OptionValue,\n Select2Value,\n} from './types';\nimport { Option, Select2OptionProps } from './components/Option';\nimport { Group, Select2GroupProps } from './components/Group';\nimport { Select2TitleProps, Title } from './components/Title';\nimport { Select2Context } from './components/Context';\nimport { createCollectionClassName, getFontSize } from './utilities';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport { Trigger } from './components/Trigger';\nimport { useIsFormControl } from '../../hooks/useIsFormControl';\nimport { BubbleSelect } from '../../primitives/BubbleSelect';\nimport { Search } from './components/Search';\nimport { isGroup, useChildren } from './hooks/useChildren';\n\nimport { Create } from './components/Create';\nimport { Collection } from './components/Collection';\nimport { CollectionRef } from '../../primitives/Collection/Collection';\nimport { useLocalization } from '../Provider/Localization';\nimport { useIsHoverStatePaused } from '../../hooks/useIsHoverStatePaused';\nimport { isAriaDirectionKey } from '../../utils/aria';\nimport { getNextFocussableElement, isElementInsideTable3OrReport } from '../../utils/dom';\nimport { FontSize, FontSizes } from '../../types';\nimport { Button } from '../Button/Button';\nimport { Spinner } from '../Spinner/Spinner';\n\ntype Select2Texts = {\n allSelect: string;\n allDeselect: string;\n cancel: string;\n chooseColor: string;\n create: string;\n delete: string;\n save: string;\n search: string;\n searchOrCreate: string;\n selectAll: string;\n selectAllResults: string;\n deselectAll: string;\n deselectAllResults: string;\n};\n\ntype Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n /** Autofocus Select2 when loaded **/\n autoFocus?: boolean;\n /** Array of options in Select2 */\n children: Select2Children;\n /** Initial value of the input in Select2 */\n defaultValue?: Select2Value;\n /** Set what value should have an empty option in Select2 */\n emptyValue?: Select2OptionValue;\n /** Whether the Select2 is in a disabled state **/\n disabled?: boolean;\n /** Font size of text in Select2 **/\n fontSize?: FontSize;\n /** Draws attention to the Select2 by changing its style and making it visually prominent */\n highlighted?: boolean;\n /** Whether the Select2 is in an invalid state **/\n invalid?: boolean;\n /** Whether the Select2 is loading the data **/\n loading?: boolean;\n /** Whether the Select2 allows selecting multiple values **/\n multiple?: boolean;\n /** Whether the Select2 is in an invalid state **/\n name?: string;\n /** Handler called when user chooses an option from the provided options **/\n onChange?: (value: Select2Value) => void;\n /** Handler called when user creates a new option **/\n onCreate?: Select2CreateHandler;\n /** Handler called when user deletes an option **/\n onDelete?: Select2DeleteHandler;\n /** Handler called when user edits an option **/\n onEdit?: Select2EditHandler;\n /** Placeholder showed when nothing is selected **/\n placeholder?: string;\n /** Whether the Select2 is in a readonly state **/\n readOnly?: boolean;\n required?: boolean;\n /** Renders select options as tags **/\n tags?: boolean;\n /** Value of the input in select2 */\n value?: Select2Value;\n /** Create dialog component, if specified, then create button will become always visible in the bottom of options dropdown,\n * when clicked, it will open create dialog and wait for 'onCreate' handler to be triggered from the dialog */\n createDialog?: Select2CreateDialogRenderer;\n /** Create button text */\n createTriggerText?: string;\n};\ntype Select2PropsWithStatics = React.ForwardRefExoticComponent<Select2Props & React.RefAttributes<HTMLButtonElement>> & {\n Option: React.ForwardRefExoticComponent<Select2OptionProps>;\n Group: React.ForwardRefExoticComponent<Select2GroupProps>;\n Title: React.ForwardRefExoticComponent<Select2TitleProps>;\n};\n\nconst Select2 = React.forwardRef<HTMLButtonElement, Select2Props>(function Select2(props, ref) {\n const {\n children: initChildren,\n defaultValue: defaultProp,\n disabled = false,\n emptyValue = undefined,\n fontSize,\n highlighted = false,\n invalid = false,\n loading,\n multiple = false,\n name,\n onChange,\n onCreate,\n onDelete,\n onEdit,\n placeholder,\n readOnly = false,\n tags = false,\n value: prop,\n createDialog,\n createTriggerText,\n ...otherProps\n } = props;\n\n const emptyOption: React.ReactElement<Select2OptionProps> | undefined = React.useMemo(() => {\n if (emptyValue !== undefined && !multiple) {\n // Empty option has 0px height, because it's empty, so need to apply height manually\n return <Option key=\"__empty\" children=\"\" value={emptyValue} className=\"h-8\" />;\n }\n return;\n }, [emptyValue, multiple]);\n\n const initialChildren = React.useMemo(() => {\n if (emptyOption) {\n return [emptyOption, ...initChildren] as Select2Children;\n }\n return initChildren;\n }, [emptyOption, initChildren]);\n\n // refs\n const internalRef = useMergedRef<HTMLButtonElement>(ref);\n const listboxRef = React.useRef<CollectionRef>(null);\n const searchRef = React.useRef<HTMLInputElement>(null);\n const { texts } = useLocalization();\n // align the listbox min width with the width of the input - it should never be smaller\n const dimensions = useBoundingClientRectListener(internalRef);\n\n // state\n const [tabTriggeredClose, setTabTriggeredClose] = React.useState(false);\n const [open, setOpen] = React.useState(false);\n const [value, _setValue] = useControllableState<Select2Value>({\n // uncontrolled\n defaultProp,\n // controlled\n onChange,\n prop,\n });\n const setValue = ListboxPrimitive.createListboxValueSetter(multiple, _setValue);\n const [validationError, setValidationError] = React.useState<Error | undefined>();\n const [shouldPauseHoverState, setShouldPauseHoverState] = useIsHoverStatePaused();\n\n const { flattenedChildren, filteredChildren, searchQuery, setSearchQuery } = useChildren({\n children: initialChildren,\n emptyValue,\n multiple,\n open,\n setValue,\n value,\n });\n\n // context\n const context = {\n disabled,\n highlighted,\n invalid,\n listboxRef,\n multiple,\n onCreate,\n onDelete,\n onEdit,\n open,\n readOnly,\n ref: internalRef,\n searchQuery,\n searchRef,\n setOpen,\n setSearchQuery,\n setValidationError,\n setValue,\n shouldPauseHoverState,\n setShouldPauseHoverState,\n tags,\n fontSize,\n validationError,\n value,\n createDialog,\n createTriggerText,\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n if (open) {\n event.preventDefault();\n } else if (isElementInsideTable3OrReport(event.currentTarget)) {\n return;\n } else if (!event.ctrlKey && !event.metaKey && (event.key === 'ArrowDown' || /^[a-z0-9]$/i.test(event.key))) {\n setOpen(true);\n }\n\n // the focus should always remain on the input, so we forward events on to the listbox\n listboxRef.current?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n };\n\n let handleBlur;\n\n if (otherProps.onBlur) {\n // we might be focusing on an input or something inside the dropdown that was triggered by the select\n // so see if the element gaining focus is inside a portal and look up its controller\n // if we don't do this, things like validate on blur occur while simply opening the select\n handleBlur = (event: React.FocusEvent<HTMLButtonElement>) => {\n const elementGainingFocus = event.relatedTarget;\n\n if (elementGainingFocus === undefined) {\n return;\n }\n\n const portalId = elementGainingFocus?.closest('[data-radix-popper-content-wrapper] > :first-child')?.id;\n\n if (!portalId || event.currentTarget.getAttribute(`aria-controls`) !== portalId) {\n otherProps.onBlur?.(event);\n }\n };\n }\n\n const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n if (isAriaDirectionKey(event)) {\n setShouldPauseHoverState(true);\n }\n };\n\n const handleCloseAutoFocus = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n\n if (tabTriggeredClose) {\n const nextFocussableElement = getNextFocussableElement(internalRef.current);\n\n if (nextFocussableElement) {\n // UX requirement: move focus to the next focussable element when tab key is pressed to select the value\n nextFocussableElement.focus();\n // Reset the tabTriggeredClose state\n setTabTriggeredClose(false);\n }\n } else {\n internalRef.current?.focus();\n }\n };\n\n const selectOptions =\n searchQuery === ''\n ? flattenedChildren.map(child => child.props.value)\n : filteredChildren\n .map(child =>\n isGroup(child)\n ? Array.isArray(child.props.children) && child.props.children.map(subChild => subChild.props.value)\n : child.props.value\n )\n .flatMap(c => c) || [];\n\n const areAllSelected = Array.isArray(value) && selectOptions.every(option => value.includes(option as string));\n\n const selectAllText = React.useMemo(() => {\n if (searchQuery === '') {\n if (areAllSelected) {\n return texts.select2.deselectAll;\n } else {\n return texts.select2.selectAll;\n }\n } else if (areAllSelected) {\n return texts.select2.deselectAllResults;\n } else {\n return texts.select2.selectAllResults;\n }\n }, [areAllSelected, searchQuery]);\n\n const selectAll = () => {\n if (!Array.isArray(value) || value.length === 0) {\n setValue(selectOptions);\n } else {\n // array of all available options which are not selected\n const preselectedValues = selectOptions.filter(option => !value.includes(option));\n setValue([...value, ...preselectedValues]);\n }\n };\n\n const deselectAll = () => {\n if (searchQuery === '') {\n setValue([]);\n } else {\n const nextValue = Array.isArray(value) && value.filter(subValue => !selectOptions.includes(subValue as string));\n setValue(nextValue);\n }\n };\n\n const hasInlineCreation = onCreate && !createDialog;\n const hasSearch = flattenedChildren.length > 5 || hasInlineCreation;\n const className = cn(\n 'border-grey-300 rounded border bg-white py-1.5 shadow-md ',\n {\n 'focus-within:yt-focus': !hasSearch,\n 'outline-none': hasSearch,\n },\n createCollectionClassName()\n );\n\n return (\n <Select2Context.Provider value={context}>\n <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\n <PopoverPrimitive.Trigger asChild data-taco=\"Select2\">\n <Trigger\n {...otherProps}\n aria-haspopup=\"listbox\"\n emptyValue={emptyValue}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n ref={internalRef}>\n {flattenedChildren}\n </Trigger>\n </PopoverPrimitive.Trigger>\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n asChild\n align=\"start\"\n onOpenAutoFocus={() => {\n internalRef.current?.focus();\n }}\n onCloseAutoFocus={handleCloseAutoFocus}\n sideOffset={4}\n tabIndex={-1}>\n <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n {hasSearch ? (\n <>\n <Search\n placeholder={hasInlineCreation ? texts.select2.searchOrCreate : texts.select2.search}\n ref={searchRef}\n onTabKeyPress={() => setTabTriggeredClose(true)}\n />\n {multiple && selectOptions.length > 1 && (\n <>\n <Button\n className=\"!justify-start\"\n appearance=\"discrete\"\n onClick={areAllSelected ? deselectAll : selectAll}>\n {selectAllText}\n </Button>\n <div className=\"border-grey-300 mx-3 rounded border-t\" />\n </>\n )}\n </>\n ) : null}\n {loading ? (\n <span className={cn('text-grey-700 flex items-center italic', fontSize && getFontSize(fontSize))}>\n <span>\n <Spinner\n delay={0}\n className={cn('ml-3 mr-2 mt-1.5 h-5 w-5', {\n '!mt-1 !h-3.5 !w-3.5': fontSize === FontSizes.small,\n '!h-4 !w-4': fontSize === FontSizes.medium,\n '!h-5 !w-5': fontSize === FontSizes.large,\n })}\n />\n </span>\n <span>{texts.listbox.loading}</span>\n </span>\n ) : flattenedChildren.length <= 0 ? (\n <div className=\"text-grey-700 -mt-0.5 flex h-8 items-center px-2\" role=\"presentation\">\n {texts.listbox.empty}\n </div>\n ) : (\n <ListboxPrimitive.Root\n className=\"flex flex-col gap-0.5 focus-visible:outline-none\"\n customSelector=\":scope > button\"\n disabled={disabled}\n multiple={multiple}\n onKeyDown={handleListboxKeyDown}\n readOnly={readOnly}\n ref={listboxRef}\n setValue={setValue}\n value={value}>\n {searchQuery === '' ? (\n <Collection>{initialChildren}</Collection>\n ) : (\n <Collection>{filteredChildren}</Collection>\n )}\n {onCreate ? <Create onCreate={onCreate} options={flattenedChildren} /> : null}\n </ListboxPrimitive.Root>\n )}\n </div>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n <ControlledHiddenField\n emptyValue={emptyValue}\n multiple={multiple || tags}\n name={name}\n options={flattenedChildren.map(child => child.props.value)}\n parentRef={internalRef}\n setValue={setValue}\n value={value}\n />\n </PopoverPrimitive.Root>\n </Select2Context.Provider>\n );\n}) as Select2PropsWithStatics;\nSelect2.Option = Option;\nSelect2.Group = Group;\nSelect2.Title = Title;\n\nconst ControlledHiddenField = props => {\n const { emptyValue, multiple, name, options, parentRef, value, setValue } = props;\n const isFormControl = useIsFormControl(parentRef, () => setValue(multiple ? [] : undefined));\n\n let bubbleValue;\n\n if (isFormControl) {\n if (value !== undefined) {\n if (multiple) {\n bubbleValue = Array.isArray(value) ? value.map(String) : [value === null ? '' : String(value)];\n } else {\n bubbleValue = value === null ? '' : String(value);\n }\n }\n\n return (\n <BubbleSelect aria-hidden key={String(bubbleValue)} multiple={multiple} name={name} value={bubbleValue}>\n {emptyValue !== undefined ? <option value={emptyValue} /> : null}\n {options.map(option => (\n <option key={String(option)} value={String(option)} />\n ))}\n </BubbleSelect>\n );\n }\n\n return null;\n};\nSelect2.displayName = 'Select2';\n\nexport { Select2 };\n\nexport type {\n Select2Texts,\n Select2GroupProps,\n Select2OptionProps,\n Select2OptionValue,\n Select2Value,\n Select2Props,\n Select2TitleProps,\n};\n"],"names":["Select2","React","forwardRef","props","ref","children","initChildren","defaultValue","defaultProp","disabled","emptyValue","undefined","fontSize","highlighted","invalid","loading","multiple","name","onChange","onCreate","onDelete","onEdit","placeholder","readOnly","tags","value","prop","createDialog","createTriggerText","otherProps","emptyOption","useMemo","Option","key","className","initialChildren","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","tabTriggeredClose","setTabTriggeredClose","useState","open","setOpen","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","shouldPauseHoverState","setShouldPauseHoverState","useIsHoverStatePaused","flattenedChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","handleKeyDown","event","preventDefault","isElementInsideTable3OrReport","currentTarget","ctrlKey","metaKey","test","_listboxRef$current","current","dispatchEvent","createCustomKeyboardEvent","handleBlur","onBlur","elementGainingFocus","relatedTarget","portalId","_elementGainingFocus$","closest","id","getAttribute","_otherProps$onBlur","call","handleListboxKeyDown","isAriaDirectionKey","handleCloseAutoFocus","stopPropagation","nextFocussableElement","getNextFocussableElement","focus","_internalRef$current","selectOptions","map","child","isGroup","Array","isArray","subChild","flatMap","c","areAllSelected","every","option","includes","selectAllText","select2","deselectAll","selectAll","deselectAllResults","selectAllResults","length","preselectedValues","filter","nextValue","subValue","hasInlineCreation","hasSearch","cn","createCollectionClassName","Select2Context","Provider","PopoverPrimitive","onOpenChange","asChild","Trigger","onKeyDown","align","onOpenAutoFocus","_internalRef$current2","onCloseAutoFocus","sideOffset","tabIndex","style","minWidth","width","Search","searchOrCreate","search","onTabKeyPress","Button","appearance","onClick","getFontSize","Spinner","delay","FontSizes","small","medium","large","listbox","role","empty","customSelector","Collection","Create","options","ControlledHiddenField","parentRef","Group","Title","isFormControl","useIsFormControl","bubbleValue","String","BubbleSelect","displayName"],"mappings":"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"}
@@ -21,14 +21,14 @@ const BaseTable3 = /*#__PURE__*/fixedForwardRef(function BaseTable3(props, ref)
21
21
  'data-table-editing-mode': (_table3$meta$editing = table3.meta.editing) !== null && _table3$meta$editing !== void 0 && _table3$meta$editing.isEditing ? (_table3$meta$editing2 = table3.meta.editing) !== null && _table3$meta$editing2 !== void 0 && _table3$meta$editing2.isDetailedMode ? 'detailed' : 'normal' : undefined,
22
22
  enableHorizontalArrowKeyNavigation: table3.meta.editing.isEditing
23
23
  };
24
- const hasValidationErrors = table3.meta.editing.hasErrors(table3.instance, table3.ref);
24
+ const hasAlertErrors = table3.meta.editing.hasAlertErrors();
25
25
  const showCreateRowButton = table3.meta.editing.isEnabled && props.onEditingCreate;
26
26
  return /*#__PURE__*/React__default.createElement(Table, null, /*#__PURE__*/React__default.createElement(Table.Toolbar, {
27
27
  table: table3
28
28
  }, table3.meta.editing.isEnabled ? (/*#__PURE__*/React__default.createElement(Editing, {
29
29
  scrollToIndex: table3.renderer.scrollToIndex,
30
30
  table: table3.instance
31
- })) : null), hasValidationErrors ? (/*#__PURE__*/React__default.createElement(Alert, {
31
+ })) : null), hasAlertErrors ? (/*#__PURE__*/React__default.createElement(Alert, {
32
32
  className: "mb-4",
33
33
  scrollToIndex: table3.renderer.scrollToIndex,
34
34
  table: table3.instance,
@@ -1 +1 @@
1
- {"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport { fixedForwardRef } from '../../types';\nimport { useTable3 } from './useTable3';\nimport { Table } from '../../primitives/Table/Core/Table';\nimport { Alert } from './components/Editing/Alert';\nimport CreateNewRowButton from './components/Row/Editing/CreateRowButton';\nimport { Table3Props, Table3Ref, Table3ColumnProps, Table3GroupProps } from './types';\nimport { Editing } from './components/Toolbar/Editing/Editing';\nimport './style.css';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n return null;\n}\nColumn.displayName = 'Table3Column';\n\nfunction Group(_: Table3GroupProps) {\n return null;\n}\nGroup.displayName = 'Table3Group';\n\nconst BaseTable3 = fixedForwardRef(function BaseTable3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const table3 = useTable3<TType>(props, ref);\n\n const gridAttributes = {\n 'data-table-editing-mode': table3.meta.editing?.isEditing\n ? table3.meta.editing?.isDetailedMode\n ? 'detailed'\n : 'normal'\n : undefined,\n enableHorizontalArrowKeyNavigation: table3.meta.editing.isEditing,\n };\n\n const hasValidationErrors = table3.meta.editing.hasErrors(table3.instance, table3.ref);\n const showCreateRowButton = table3.meta.editing.isEnabled && props.onEditingCreate;\n\n return (\n <Table>\n <Table.Toolbar<TType> table={table3}>\n {table3.meta.editing.isEnabled ? (\n <Editing scrollToIndex={table3.renderer.scrollToIndex} table={table3.instance} />\n ) : null}\n </Table.Toolbar>\n {hasValidationErrors ? (\n <Alert\n className=\"mb-4\"\n scrollToIndex={table3.renderer.scrollToIndex}\n table={table3.instance}\n tableRef={table3.ref}\n />\n ) : null}\n <Table.Grid<TType> {...gridAttributes} data-taco=\"table3\" table={table3}>\n {showCreateRowButton && (\n <CreateNewRowButton\n table={table3.instance}\n tableMeta={table3.meta}\n onEditingCreate={props.onEditingCreate}\n scrollToIndex={table3.renderer.scrollToIndex}\n />\n )}\n </Table.Grid>\n </Table>\n );\n});\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const stringifiedChildren = String(props.children);\n // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n // this is cheaper from a complexity perspective, and probably performance wise as well\n const key = React.useMemo(() => String('tableKey_' + stringifiedChildren), [stringifiedChildren]);\n return <BaseTable3<TType> {...props} key={key} ref={ref} />;\n}) as (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n Column: typeof Column;\n Group: typeof Group;\n};\nTable3.Column = Column;\nTable3.Group = Group;\n\nexport type {\n Table3Props,\n Table3Ref,\n Table3ColumnProps,\n Table3GroupProps,\n Table3EditingSaveHandler,\n Table3EditingValidatorFn,\n Table3FeatureProps,\n Table3Texts,\n} from './types';\n"],"names":["Column","_","displayName","Group","BaseTable3","fixedForwardRef","props","ref","table3","useTable3","gridAttributes","_table3$meta$editing","meta","editing","isEditing","_table3$meta$editing2","isDetailedMode","undefined","enableHorizontalArrowKeyNavigation","hasValidationErrors","hasErrors","instance","showCreateRowButton","isEnabled","onEditingCreate","React","Table","Toolbar","table","Editing","scrollToIndex","renderer","Alert","className","tableRef","Grid","CreateNewRowButton","tableMeta","Table3","stringifiedChildren","String","children","key","useMemo"],"mappings":";;;;;;;;AAUA,SAASA,MAAMA,CAAkBC,CAA2B;EACxD,OAAO,IAAI;AACf;AACAD,MAAM,CAACE,WAAW,GAAG,cAAc;AAEnC,SAASC,KAAKA,CAACF,CAAmB;EAC9B,OAAO,IAAI;AACf;AACAE,KAAK,CAACD,WAAW,GAAG,aAAa;AAEjC,MAAME,UAAU,gBAAGC,eAAe,CAAC,SAASD,UAAUA,CAAkBE,KAAyB,EAAEC,GAAyB;;EACxH,MAAMC,MAAM,GAAGC,SAAS,CAAQH,KAAK,EAAEC,GAAG,CAAC;EAE3C,MAAMG,cAAc,GAAG;IACnB,yBAAyB,EAAE,CAAAC,oBAAA,GAAAH,MAAM,CAACI,IAAI,CAACC,OAAO,cAAAF,oBAAA,eAAnBA,oBAAA,CAAqBG,SAAS,GACnD,CAAAC,qBAAA,GAAAP,MAAM,CAACI,IAAI,CAACC,OAAO,cAAAE,qBAAA,eAAnBA,qBAAA,CAAqBC,cAAc,GAC/B,UAAU,GACV,QAAQ,GACZC,SAAS;IACfC,kCAAkC,EAAEV,MAAM,CAACI,IAAI,CAACC,OAAO,CAACC;GAC3D;EAED,MAAMK,mBAAmB,GAAGX,MAAM,CAACI,IAAI,CAACC,OAAO,CAACO,SAAS,CAACZ,MAAM,CAACa,QAAQ,EAAEb,MAAM,CAACD,GAAG,CAAC;EACtF,MAAMe,mBAAmB,GAAGd,MAAM,CAACI,IAAI,CAACC,OAAO,CAACU,SAAS,IAAIjB,KAAK,CAACkB,eAAe;EAElF,oBACIC,6BAACC,KAAK,qBACFD,6BAACC,KAAK,CAACC,OAAO;IAAQC,KAAK,EAAEpB;KACxBA,MAAM,CAACI,IAAI,CAACC,OAAO,CAACU,SAAS,iBAC1BE,6BAACI,OAAO;IAACC,aAAa,EAAEtB,MAAM,CAACuB,QAAQ,CAACD,aAAa;IAAEF,KAAK,EAAEpB,MAAM,CAACa;IAAY,IACjF,IAAI,CACI,EACfF,mBAAmB,iBAChBM,6BAACO,KAAK;IACFC,SAAS,EAAC,MAAM;IAChBH,aAAa,EAAEtB,MAAM,CAACuB,QAAQ,CAACD,aAAa;IAC5CF,KAAK,EAAEpB,MAAM,CAACa,QAAQ;IACtBa,QAAQ,EAAE1B,MAAM,CAACD;IACnB,IACF,IAAI,eACRkB,6BAACC,KAAK,CAACS,IAAI,oBAAYzB,cAAc;iBAAY,QAAQ;IAACkB,KAAK,EAAEpB;MAC5Dc,mBAAmB,kBAChBG,6BAACW,kBAAkB;IACfR,KAAK,EAAEpB,MAAM,CAACa,QAAQ;IACtBgB,SAAS,EAAE7B,MAAM,CAACI,IAAI;IACtBY,eAAe,EAAElB,KAAK,CAACkB,eAAe;IACtCM,aAAa,EAAEtB,MAAM,CAACuB,QAAQ,CAACD;IACjC,CACL,CACQ,CACT;AAEhB,CAAC,CAAC;MAEWQ,MAAM,gBAAGjC,eAAe,CAAC,SAASiC,MAAMA,CAAkBhC,KAAyB,EAAEC,GAAyB;EACvH,MAAMgC,mBAAmB,GAAGC,MAAM,CAAClC,KAAK,CAACmC,QAAQ,CAAC;;;EAGlD,MAAMC,GAAG,GAAGjB,cAAK,CAACkB,OAAO,CAAC,MAAMH,MAAM,CAAC,WAAW,GAAGD,mBAAmB,CAAC,EAAE,CAACA,mBAAmB,CAAC,CAAC;EACjG,oBAAOd,6BAACrB,UAAU,oBAAYE,KAAK;IAAEoC,GAAG,EAAEA,GAAG;IAAEnC,GAAG,EAAEA;KAAO;AAC/D,CAAC;AAID+B,MAAM,CAACtC,MAAM,GAAGA,MAAM;AACtBsC,MAAM,CAACnC,KAAK,GAAGA,KAAK;;;;"}
1
+ {"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport { fixedForwardRef } from '../../types';\nimport { useTable3 } from './useTable3';\nimport { Table } from '../../primitives/Table/Core/Table';\nimport { Alert } from './components/Editing/Alert';\nimport CreateNewRowButton from './components/Row/Editing/CreateRowButton';\nimport { Table3Props, Table3Ref, Table3ColumnProps, Table3GroupProps } from './types';\nimport { Editing } from './components/Toolbar/Editing/Editing';\nimport './style.css';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n return null;\n}\nColumn.displayName = 'Table3Column';\n\nfunction Group(_: Table3GroupProps) {\n return null;\n}\nGroup.displayName = 'Table3Group';\n\nconst BaseTable3 = fixedForwardRef(function BaseTable3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const table3 = useTable3<TType>(props, ref);\n\n const gridAttributes = {\n 'data-table-editing-mode': table3.meta.editing?.isEditing\n ? table3.meta.editing?.isDetailedMode\n ? 'detailed'\n : 'normal'\n : undefined,\n enableHorizontalArrowKeyNavigation: table3.meta.editing.isEditing,\n };\n\n const hasAlertErrors = table3.meta.editing.hasAlertErrors();\n const showCreateRowButton = table3.meta.editing.isEnabled && props.onEditingCreate;\n\n return (\n <Table>\n <Table.Toolbar<TType> table={table3}>\n {table3.meta.editing.isEnabled ? (\n <Editing scrollToIndex={table3.renderer.scrollToIndex} table={table3.instance} />\n ) : null}\n </Table.Toolbar>\n {hasAlertErrors ? (\n <Alert\n className=\"mb-4\"\n scrollToIndex={table3.renderer.scrollToIndex}\n table={table3.instance}\n tableRef={table3.ref}\n />\n ) : null}\n <Table.Grid<TType> {...gridAttributes} data-taco=\"table3\" table={table3}>\n {showCreateRowButton && (\n <CreateNewRowButton\n table={table3.instance}\n tableMeta={table3.meta}\n onEditingCreate={props.onEditingCreate}\n scrollToIndex={table3.renderer.scrollToIndex}\n />\n )}\n </Table.Grid>\n </Table>\n );\n});\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const stringifiedChildren = String(props.children);\n // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n // this is cheaper from a complexity perspective, and probably performance wise as well\n const key = React.useMemo(() => String('tableKey_' + stringifiedChildren), [stringifiedChildren]);\n return <BaseTable3<TType> {...props} key={key} ref={ref} />;\n}) as (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n Column: typeof Column;\n Group: typeof Group;\n};\nTable3.Column = Column;\nTable3.Group = Group;\n\nexport type {\n Table3Props,\n Table3Ref,\n Table3ColumnProps,\n Table3GroupProps,\n Table3EditingSaveHandler,\n Table3EditingValidatorFn,\n Table3FeatureProps,\n Table3Texts,\n} from './types';\n"],"names":["Column","_","displayName","Group","BaseTable3","fixedForwardRef","props","ref","table3","useTable3","gridAttributes","_table3$meta$editing","meta","editing","isEditing","_table3$meta$editing2","isDetailedMode","undefined","enableHorizontalArrowKeyNavigation","hasAlertErrors","showCreateRowButton","isEnabled","onEditingCreate","React","Table","Toolbar","table","Editing","scrollToIndex","renderer","instance","Alert","className","tableRef","Grid","CreateNewRowButton","tableMeta","Table3","stringifiedChildren","String","children","key","useMemo"],"mappings":";;;;;;;;AAUA,SAASA,MAAMA,CAAkBC,CAA2B;EACxD,OAAO,IAAI;AACf;AACAD,MAAM,CAACE,WAAW,GAAG,cAAc;AAEnC,SAASC,KAAKA,CAACF,CAAmB;EAC9B,OAAO,IAAI;AACf;AACAE,KAAK,CAACD,WAAW,GAAG,aAAa;AAEjC,MAAME,UAAU,gBAAGC,eAAe,CAAC,SAASD,UAAUA,CAAkBE,KAAyB,EAAEC,GAAyB;;EACxH,MAAMC,MAAM,GAAGC,SAAS,CAAQH,KAAK,EAAEC,GAAG,CAAC;EAE3C,MAAMG,cAAc,GAAG;IACnB,yBAAyB,EAAE,CAAAC,oBAAA,GAAAH,MAAM,CAACI,IAAI,CAACC,OAAO,cAAAF,oBAAA,eAAnBA,oBAAA,CAAqBG,SAAS,GACnD,CAAAC,qBAAA,GAAAP,MAAM,CAACI,IAAI,CAACC,OAAO,cAAAE,qBAAA,eAAnBA,qBAAA,CAAqBC,cAAc,GAC/B,UAAU,GACV,QAAQ,GACZC,SAAS;IACfC,kCAAkC,EAAEV,MAAM,CAACI,IAAI,CAACC,OAAO,CAACC;GAC3D;EAED,MAAMK,cAAc,GAAGX,MAAM,CAACI,IAAI,CAACC,OAAO,CAACM,cAAc,EAAE;EAC3D,MAAMC,mBAAmB,GAAGZ,MAAM,CAACI,IAAI,CAACC,OAAO,CAACQ,SAAS,IAAIf,KAAK,CAACgB,eAAe;EAElF,oBACIC,6BAACC,KAAK,qBACFD,6BAACC,KAAK,CAACC,OAAO;IAAQC,KAAK,EAAElB;KACxBA,MAAM,CAACI,IAAI,CAACC,OAAO,CAACQ,SAAS,iBAC1BE,6BAACI,OAAO;IAACC,aAAa,EAAEpB,MAAM,CAACqB,QAAQ,CAACD,aAAa;IAAEF,KAAK,EAAElB,MAAM,CAACsB;IAAY,IACjF,IAAI,CACI,EACfX,cAAc,iBACXI,6BAACQ,KAAK;IACFC,SAAS,EAAC,MAAM;IAChBJ,aAAa,EAAEpB,MAAM,CAACqB,QAAQ,CAACD,aAAa;IAC5CF,KAAK,EAAElB,MAAM,CAACsB,QAAQ;IACtBG,QAAQ,EAAEzB,MAAM,CAACD;IACnB,IACF,IAAI,eACRgB,6BAACC,KAAK,CAACU,IAAI,oBAAYxB,cAAc;iBAAY,QAAQ;IAACgB,KAAK,EAAElB;MAC5DY,mBAAmB,kBAChBG,6BAACY,kBAAkB;IACfT,KAAK,EAAElB,MAAM,CAACsB,QAAQ;IACtBM,SAAS,EAAE5B,MAAM,CAACI,IAAI;IACtBU,eAAe,EAAEhB,KAAK,CAACgB,eAAe;IACtCM,aAAa,EAAEpB,MAAM,CAACqB,QAAQ,CAACD;IACjC,CACL,CACQ,CACT;AAEhB,CAAC,CAAC;MAEWS,MAAM,gBAAGhC,eAAe,CAAC,SAASgC,MAAMA,CAAkB/B,KAAyB,EAAEC,GAAyB;EACvH,MAAM+B,mBAAmB,GAAGC,MAAM,CAACjC,KAAK,CAACkC,QAAQ,CAAC;;;EAGlD,MAAMC,GAAG,GAAGlB,cAAK,CAACmB,OAAO,CAAC,MAAMH,MAAM,CAAC,WAAW,GAAGD,mBAAmB,CAAC,EAAE,CAACA,mBAAmB,CAAC,CAAC;EACjG,oBAAOf,6BAACnB,UAAU,oBAAYE,KAAK;IAAEmC,GAAG,EAAEA,GAAG;IAAElC,GAAG,EAAEA;KAAO;AAC/D,CAAC;AAID8B,MAAM,CAACrC,MAAM,GAAGA,MAAM;AACtBqC,MAAM,CAAClC,KAAK,GAAGA,KAAK;;;;"}