@adaptabletools/adaptable 23.0.8 → 23.0.10

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.
package/index.css CHANGED
@@ -405,9 +405,6 @@
405
405
  .twa\:-mx-1 {
406
406
  margin-inline: calc(var(--ab-base-space) * -1);
407
407
  }
408
- .twa\:mx-0\.5 {
409
- margin-inline: calc(var(--ab-base-space) * 0.5);
410
- }
411
408
  .twa\:mx-1 {
412
409
  margin-inline: var(--ab-base-space);
413
410
  }
@@ -1379,9 +1376,6 @@
1379
1376
  .twa\:gap-y-3 {
1380
1377
  row-gap: calc(var(--ab-base-space) * 3);
1381
1378
  }
1382
- .twa\:self-center {
1383
- align-self: center;
1384
- }
1385
1379
  .twa\:self-end {
1386
1380
  align-self: flex-end;
1387
1381
  }
@@ -1825,6 +1819,9 @@
1825
1819
  .twa\:px-0 {
1826
1820
  padding-inline: 0;
1827
1821
  }
1822
+ .twa\:px-0\.5 {
1823
+ padding-inline: calc(var(--ab-base-space) * 0.5);
1824
+ }
1828
1825
  .twa\:px-1 {
1829
1826
  padding-inline: var(--ab-base-space);
1830
1827
  }
@@ -2756,6 +2753,16 @@
2756
2753
  }
2757
2754
  }
2758
2755
  }
2756
+ @media (hover: hover) {
2757
+ .twa\:hover\:bg-current\/15:hover {
2758
+ background-color: currentcolor;
2759
+ }
2760
+ @supports (color: color-mix(in lab, red, red)) {
2761
+ .twa\:hover\:bg-current\/15:hover {
2762
+ background-color: color-mix(in oklab, currentcolor 15%, transparent);
2763
+ }
2764
+ }
2765
+ }
2759
2766
  @media (hover: hover) {
2760
2767
  .twa\:hover\:bg-destructive\/20:hover {
2761
2768
  background-color: var(--ab-color-destructive);
@@ -3630,6 +3637,9 @@
3630
3637
  :is(.twa\:\*\:\[\[role\=button\]\]\:absolute > *):is([role=button]) {
3631
3638
  position: absolute;
3632
3639
  }
3640
+ :is(.twa\:\*\:\[\[role\=button\]\]\:relative > *):is([role=button]) {
3641
+ position: relative;
3642
+ }
3633
3643
  :is(.twa\:\*\:\[\[role\=button\]\]\:inset-x-0\.5 > *):is([role=button]) {
3634
3644
  inset-inline: calc(var(--ab-base-space) * 0.5);
3635
3645
  }
@@ -3639,12 +3649,31 @@
3639
3649
  :is(.twa\:\*\:\[\[role\=button\]\]\:h-auto > *):is([role=button]) {
3640
3650
  height: auto;
3641
3651
  }
3652
+ :is(.twa\:\*\:\[\[role\=button\]\]\:h-full > *):is([role=button]) {
3653
+ height: 100%;
3654
+ }
3655
+ :is(.twa\:\*\:\[\[role\=button\]\]\:min-w-0 > *):is([role=button]) {
3656
+ min-width: 0;
3657
+ }
3658
+ :is(.twa\:\*\:\[\[role\=button\]\]\:flex-1 > *):is([role=button]) {
3659
+ flex: 1;
3660
+ }
3661
+ :is(.twa\:\*\:\[\[role\=button\]\]\:basis-0 > *):is([role=button]) {
3662
+ flex-basis: 0;
3663
+ }
3642
3664
  :is(.twa\:\*\:\[\[role\=button\]\]\:rounded-input > *):is([role=button]) {
3643
3665
  border-radius: var(--ab-border-radius-input);
3644
3666
  }
3667
+ :is(.twa\:\*\:\[\[role\=button\]\]\:border-none > *):is([role=button]) {
3668
+ --tw-border-style: none;
3669
+ border-style: none;
3670
+ }
3645
3671
  :is(.twa\:\*\:\[input\]\:absolute > *):is(input) {
3646
3672
  position: absolute;
3647
3673
  }
3674
+ :is(.twa\:\*\:\[input\]\:relative > *):is(input) {
3675
+ position: relative;
3676
+ }
3648
3677
  :is(.twa\:\*\:\[input\]\:inset-x-0\.5 > *):is(input) {
3649
3678
  inset-inline: calc(var(--ab-base-space) * 0.5);
3650
3679
  }
@@ -3654,9 +3683,25 @@
3654
3683
  :is(.twa\:\*\:\[input\]\:h-auto > *):is(input) {
3655
3684
  height: auto;
3656
3685
  }
3686
+ :is(.twa\:\*\:\[input\]\:h-full > *):is(input) {
3687
+ height: 100%;
3688
+ }
3689
+ :is(.twa\:\*\:\[input\]\:min-w-0 > *):is(input) {
3690
+ min-width: 0;
3691
+ }
3692
+ :is(.twa\:\*\:\[input\]\:flex-1 > *):is(input) {
3693
+ flex: 1;
3694
+ }
3695
+ :is(.twa\:\*\:\[input\]\:basis-0 > *):is(input) {
3696
+ flex-basis: 0;
3697
+ }
3657
3698
  :is(.twa\:\*\:\[input\]\:rounded-input > *):is(input) {
3658
3699
  border-radius: var(--ab-border-radius-input);
3659
3700
  }
3701
+ :is(.twa\:\*\:\[input\]\:border-none > *):is(input) {
3702
+ --tw-border-style: none;
3703
+ border-style: none;
3704
+ }
3660
3705
  :is(.twa\:\*\*\:\[input\]\:min-h-auto\! *):is(input) {
3661
3706
  min-height: auto !important;
3662
3707
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@adaptabletools/adaptable",
3
- "version": "23.0.8",
3
+ "version": "23.0.10",
4
4
  "description": "Powerful AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements",
5
5
  "keywords": [
6
6
  "web-components",
@@ -330,6 +330,13 @@ export interface ColumnApi {
330
330
  * @param columnId Column to use
331
331
  */
332
332
  getAGGridColDefForColumnId(columnId: string): ColDef | ColGroupDef;
333
+ /**
334
+ * Returns the AdapTable Column that maps to a given AG Grid ColDef
335
+ *
336
+ * The ColDef is matched to a Column by `colId` (falling back to `field`), mirroring how AG Grid derives a Column's `colId`
337
+ * @param colDef AG Grid ColDef to look up
338
+ */
339
+ getColumnForColDef(colDef: ColDef): AdaptableColumn | undefined;
333
340
  /**
334
341
  * Returns the AG Grid Column for a given ColumnId
335
342
  * @param columnId Column to use
@@ -89,6 +89,7 @@ export declare class ColumnApiImpl extends ApiBase implements ColumnApi {
89
89
  getRowGroupedColumns(): AdaptableColumn[];
90
90
  setColumnCaption(columnId: string, caption: string): void;
91
91
  getAGGridColDefForColumnId(columnId: string): ColDef | ColGroupDef;
92
+ getColumnForColDef(colDef: ColDef): AdaptableColumn | undefined;
92
93
  getAGGridColumnForColumnId(columnId: string): Column;
93
94
  hasColumnType(columnIdentifier: string | ColDef, columnType: string): boolean;
94
95
  getColumnSummaryForColumnId(columnId: string): AdaptableColumnSummary;
@@ -522,6 +522,16 @@ export class ColumnApiImpl extends ApiBase {
522
522
  getAGGridColDefForColumnId(columnId) {
523
523
  return this.getAgGridApi().getColumnDef(columnId);
524
524
  }
525
+ getColumnForColDef(colDef) {
526
+ if (!colDef) {
527
+ return undefined;
528
+ }
529
+ const candidateColumnId = colDef.colId ?? colDef.field;
530
+ if (candidateColumnId == undefined) {
531
+ return undefined;
532
+ }
533
+ return this.getColumnWithColumnId(candidateColumnId, false);
534
+ }
525
535
  getAGGridColumnForColumnId(columnId) {
526
536
  return this.getAgGridApi().getColumn(columnId);
527
537
  }
@@ -2,6 +2,7 @@ import * as React from 'react';
2
2
  import { AdaptableInputProps } from '../AdaptableInput';
3
3
  export type AdaptableDateInputProps = AdaptableInputProps & {
4
4
  showClearButton?: boolean;
5
+ showTriggerButton?: boolean;
5
6
  };
6
7
  declare const AdaptableDateInput: React.ForwardRefExoticComponent<Omit<AdaptableDateInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
7
8
  export default AdaptableDateInput;
@@ -6,7 +6,7 @@ import useProperty from '../../../components/utils/useProperty';
6
6
  import { dateToISO, parseDateValue } from '../../../Utilities/Helpers/DateHelper';
7
7
  const AdaptableDateInput = React.forwardRef(function AdaptableDateInputCmp(props, ref) {
8
8
  const dateInputOptions = useAdaptable().adaptableOptions.userInterfaceOptions.dateInputOptions;
9
- const { value: _, defaultValue: __, onChange, required, disabled, showClearButton, ...inputProps } = props;
9
+ const { value: _, defaultValue: __, onChange, required, disabled, showClearButton, showTriggerButton, ...inputProps } = props;
10
10
  const [value, setValue] = useProperty(props, 'value', undefined, {
11
11
  onChange: (dateString) => props.onChange?.({
12
12
  target: {
@@ -28,6 +28,7 @@ const AdaptableDateInput = React.forwardRef(function AdaptableDateInputCmp(props
28
28
  showOutsideDays: dateInputOptions.showOutsideDays,
29
29
  datepickerButtons: dateInputOptions.datepickerButtons,
30
30
  showClearButton,
31
+ showTriggerButton: showTriggerButton ?? true,
31
32
  ...inputProps,
32
33
  };
33
34
  return _jsx(Datepicker, { ref: ref, ...datepickerProps });
@@ -44,18 +44,18 @@ export const FloatingFilter = (props) => {
44
44
  }));
45
45
  const renderTriggerValue = () => (_jsxs(Flex, { alignItems: "center", className: "twa:min-w-0", children: [_jsx(Box, { className: "twa:flex twa:items-center", children: !isManualApply && singleFilterPredicateDef?.icon ? (singleFilterPredicateDef?.icon) : (_jsx(AdaptableIconComponent, { icon: { name: 'filter' } })) }), showLabel && (_jsx(Box, { className: "ab-FloatingFilter-label twa:ml-2 twa:flex-1 twa:truncate", title: label, children: label }))] }));
46
46
  let filterDropdown = null;
47
- const filterDropdownSelect = (_jsx(SingleSelect, { chevronIcon: null, "data-name": "floating-filter-button", ariaLabel: `Column Filter Operator Dropdown: current operator is ${label}`, size: "small", stopMouseDownPropagation: true, disabled: props.disabled, open: selectOpen, extraWidthChars: 5, onOpenChange: (nextOpen) => {
48
- if (nextOpen && !isInlineEditable) {
49
- adaptable.api.filterApi.columnFilterApi.internalApi.openColumnFilterPopup(props.columnId);
50
- return;
51
- }
52
- setSelectOpen(nextOpen);
53
- }, value: currentOperator, placeholder: label, items: operatorOptions, showItemTooltip: true, renderValue: renderTriggerValue, onValueChange: (operator) => {
54
- props.onPredicateChange({
55
- operator: props.predicate.operator,
56
- args: [{ operator: operator, args: [] }],
57
- });
58
- }, className: cn('twa:self-center twa:mx-0.5 twa:my-0.5 twa:text-left twa:p-0.5 twa:border-none', 'twa:shadow-none', !isInlineEditable && 'twa:min-w-0 twa:flex-1') }));
47
+ const filterDropdownSelect = (_jsx("div", { className: cn('twa:flex twa:box-border twa:self-stretch twa:min-h-0 twa:h-full twa:py-0.5 twa:px-0.5', !isInlineEditable && 'twa:min-w-0 twa:flex-1'), children: _jsx(SingleSelect, { chevronIcon: null, "data-name": "floating-filter-button", ariaLabel: `Column Filter Operator Dropdown: current operator is ${label}`, stopMouseDownPropagation: true, disabled: props.disabled, open: selectOpen, extraWidthChars: 5, onOpenChange: (nextOpen) => {
48
+ if (nextOpen && !isInlineEditable) {
49
+ adaptable.api.filterApi.columnFilterApi.internalApi.openColumnFilterPopup(props.columnId);
50
+ return;
51
+ }
52
+ setSelectOpen(nextOpen);
53
+ }, value: currentOperator, placeholder: label, items: operatorOptions, showItemTooltip: true, renderValue: renderTriggerValue, onValueChange: (operator) => {
54
+ props.onPredicateChange({
55
+ operator: props.predicate.operator,
56
+ args: [{ operator: operator, args: [] }],
57
+ });
58
+ }, className: cn('twa:h-full twa:w-full twa:min-h-0 twa:text-left twa:px-0.5 twa:py-0.5 twa:border-none', 'twa:shadow-none twa:cursor-pointer', 'twa:text-primary-foreground twa:hover:bg-current/15') }) }));
59
59
  if (isInlineEditable) {
60
60
  filterDropdown = showQuickFilterDropdown && filterDropdownSelect;
61
61
  }
@@ -91,7 +91,7 @@ export const FloatingFilter = (props) => {
91
91
  refreshed[Math.min(nextIndex, refreshed.length - 1)]?.focus();
92
92
  }
93
93
  });
94
- }, children: [filterDropdown, isInlineEditable && (_jsx(Flex, { className: "twa:flex-1 twa:min-w-0", children: _jsx(FloatingFilterInputList, { onKeyDown: props.onKeydown, columnId: props.columnId, disabled: props.disabled, predicate: props.predicate.args[0], predicateDefs: props.predicateDefs, onPredicateChange: (predicate) => {
94
+ }, children: [filterDropdown, isInlineEditable && (_jsx(Flex, { className: "twa:flex-1 twa:min-w-0 twa:min-h-0 twa:h-full", children: _jsx(FloatingFilterInputList, { onKeyDown: props.onKeydown, columnId: props.columnId, disabled: props.disabled, predicate: props.predicate.args[0], predicateDefs: props.predicateDefs, onPredicateChange: (predicate) => {
95
95
  props.onPredicateChange({
96
96
  operator: props.predicate.operator,
97
97
  args: [predicate],
@@ -1,4 +1,6 @@
1
1
  import * as React from 'react';
2
+ import { AdaptableInputProps } from '../../AdaptableInput';
3
+ import { AdaptableDateInputProps } from '../../AdaptableDateInput';
2
4
  type ColumnFilterEditorChangeProps = {
3
5
  type: 'text';
4
6
  value: string;
@@ -23,5 +25,6 @@ export declare const ColumnFilterInput: (props: {
23
25
  filterType?: "floating" | "default";
24
26
  usePrimitiveInputs?: boolean;
25
27
  columnId: string;
28
+ inputProps?: AdaptableInputProps | AdaptableDateInputProps;
26
29
  } & ColumnFilterEditorChangeProps) => React.JSX.Element;
27
30
  export {};
@@ -7,11 +7,12 @@ import { PermittedValuesSelector } from '../../Selectors/PermittedValuesSelector
7
7
  import { useAdaptable } from '../../../AdaptableContext';
8
8
  import { debounce } from '../../../../Utilities/Helpers/TimingHelper';
9
9
  import { useCallback } from 'react';
10
+ import { cn } from '../../../../lib/utils';
10
11
  function debounceOrImmediate(fn, time) {
11
12
  return time && time > 0 ? debounce(fn, time) : fn;
12
13
  }
13
14
  export const ColumnFilterInput = (props) => {
14
- const { type, value, onChange: onChangeProp, onClear: onClearProp, disabled, onKeyDown, filterType, usePrimitiveInputs = true, columnId, } = props;
15
+ const { type, value, onChange: onChangeProp, onClear: onClearProp, disabled, onKeyDown, filterType, usePrimitiveInputs = true, columnId, inputProps, } = props;
15
16
  const [liveValue, setLiveValue] = React.useState(value);
16
17
  const [hasFocus, setHasFocus] = React.useState(false);
17
18
  const onFocus = useCallback(() => {
@@ -63,7 +64,7 @@ export const ColumnFilterInput = (props) => {
63
64
  }
64
65
  };
65
66
  if (type === 'date' && !showDatePicker) {
66
- return (_jsx(AdaptableDateInlineInput, { "data-name": "floating-filter-input", value: liveValue, disabled: disabled, onFocus: onFocus, onBlur: onBlur, className: "twa:border-none twa:pr-0", onKeyDownCapture: onKeyDownCapture, onChange: (value) => {
67
+ return (_jsx(AdaptableDateInlineInput, { ...inputProps, "data-name": "floating-filter-input", value: liveValue, disabled: disabled, onFocus: onFocus, onBlur: onBlur, className: "twa:border-none twa:pr-0", onKeyDownCapture: onKeyDownCapture, onChange: (value) => {
67
68
  onChange(value);
68
69
  setLiveValue(value);
69
70
  } }));
@@ -80,13 +81,13 @@ export const ColumnFilterInput = (props) => {
80
81
  }
81
82
  } }));
82
83
  }
83
- return (_jsx(AdaptableInput, { style: filterType === 'floating'
84
+ return (_jsx(AdaptableInput, { ...inputProps, style: filterType === 'floating'
84
85
  ? {
85
- width: 'auto',
86
+ width: '100%',
86
87
  padding: 'var(--ab-base-space)',
87
88
  border: 'none',
88
89
  }
89
- : {}, "data-name": "floating-filter-input", onFocus: onFocus, onBlur: onBlur, disabled: disabled, type: type === 'number' ? 'text' : type, autoFocus: false, value: liveValue ?? '', onKeyDown: onKeyDown, showClearButton: false, className: 'twa:flex-1', onChange: (e) => {
90
+ : {}, "data-name": "floating-filter-input", onFocus: onFocus, onBlur: onBlur, disabled: disabled, type: type === 'number' ? 'text' : type, autoFocus: false, value: liveValue ?? '', onKeyDown: onKeyDown, showClearButton: false, className: cn(filterType === 'floating' ? 'twa:w-full twa:min-w-0 twa:h-full' : 'twa:flex-1', inputProps?.className), onChange: (e) => {
90
91
  const prevValue = `${liveValue}`;
91
92
  const value = e.target.value;
92
93
  if (value) {
@@ -1,4 +1,4 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
1
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { debounce } from '../../../../Utilities/Helpers/TimingHelper';
3
3
  import * as React from 'react';
4
4
  import { getOperatorMatchingInputs } from '../../../../components/ExpressionEditor/QueryBuilder/utils';
@@ -31,31 +31,43 @@ export const FloatingFilterInputList = (props) => {
31
31
  });
32
32
  }, value: props.predicate.args, type: props.predicate.operator === 'In' ? 'In' : 'NotIn' }));
33
33
  }
34
+ const hasMultipleInputs = matchingInputs.length > 1;
34
35
  return (_jsx("div", { className: cn('twa:relative twa:w-full twa:flex twa:flex-row twa:[&>*:not(:first-child)]:border-l! twa:[&>*:not(:first-child)]:border-input-border!', {
35
36
  'twa:**:[input]:min-h-auto!': 'make all inputs inside not have a height fixed',
36
37
  'twa:*:[[role=button]]:rounded-input': true,
37
- 'twa:*:[[role=button]]:absolute': 'make date picker absolute filter',
38
- 'twa:*:[[role=button]]:inset-y-0.5 twa:*:[[role=button]]:inset-x-0.5 twa:*:[[role=button]]:h-auto': 'make date picker - and give it some padding, so the focus is not cut off absolute outline filter',
38
+ 'twa:*:[[role=button]]:absolute': !hasMultipleInputs && 'make date picker absolute filter',
39
+ 'twa:*:[[role=button]]:inset-y-0.5 twa:*:[[role=button]]:inset-x-0.5 twa:*:[[role=button]]:h-auto': !hasMultipleInputs &&
40
+ 'make date picker - and give it some padding, so the focus is not cut off absolute outline filter',
39
41
  'twa:*:[input]:rounded-input': true,
40
- 'twa:*:[input]:absolute': 'make inputs absolute filter',
41
- 'twa:*:[input]:inset-y-0.5 twa:*:[input]:inset-x-0.5 twa:*:[input]:h-auto': 'make inputs - and give it some padding, so the focus is not cut off absolute outline filter',
42
+ 'twa:*:[input]:absolute': !hasMultipleInputs && 'make inputs absolute filter',
43
+ 'twa:*:[input]:inset-y-0.5 twa:*:[input]:inset-x-0.5 twa:*:[input]:h-auto': !hasMultipleInputs &&
44
+ 'make inputs - and give it some padding, so the focus is not cut off absolute outline filter',
45
+ 'twa:min-h-0 twa:h-full twa:p-0.5': hasMultipleInputs,
46
+ 'twa:*:[input]:relative twa:*:[[role=button]]:relative': hasMultipleInputs,
47
+ 'twa:*:[input]:min-w-0 twa:*:[[role=button]]:min-w-0': hasMultipleInputs,
48
+ 'twa:*:[input]:flex-1 twa:*:[[role=button]]:flex-1': hasMultipleInputs,
49
+ 'twa:*:[input]:basis-0 twa:*:[[role=button]]:basis-0': hasMultipleInputs,
50
+ 'twa:*:[input]:h-full twa:*:[[role=button]]:h-full': hasMultipleInputs,
51
+ 'twa:*:[input]:border-none twa:*:[[role=button]]:border-none': hasMultipleInputs,
42
52
  }), children: (matchingInputs ?? []).map((input, index) => {
43
53
  const value = props?.predicate?.args?.[index];
44
- return (_jsx(ColumnFilterInput, { filterType: "floating", columnId: props.columnId, usePrimitiveInputs: true, disabled: props.disabled, type: input, value: value, onKeyDown: props.onKeyDown, onClear: () => {
45
- const args = [...props.predicate.args];
46
- args.splice(index, 1);
47
- const newPredicate = {
48
- operator: props.predicate.operator,
49
- args: args,
50
- };
51
- debouncedPredicateChange(newPredicate);
52
- }, onChange: (value) => {
53
- const newPredicate = {
54
- operator: props.predicate.operator,
55
- args: [...props.predicate.args],
56
- };
57
- newPredicate.args[index] = value;
58
- debouncedPredicateChange(newPredicate);
59
- } }, index));
54
+ return (_jsxs(_Fragment, { children: [index > 0 && _jsx("div", { className: "twa:border-l twa:border-input-border" }), _jsx(ColumnFilterInput, { inputProps: {
55
+ showTriggerButton: hasMultipleInputs ? false : undefined,
56
+ }, filterType: "floating", columnId: props.columnId, usePrimitiveInputs: true, disabled: props.disabled, type: input, value: value, onKeyDown: props.onKeyDown, onClear: () => {
57
+ const args = [...props.predicate.args];
58
+ args.splice(index, 1);
59
+ const newPredicate = {
60
+ operator: props.predicate.operator,
61
+ args: args,
62
+ };
63
+ debouncedPredicateChange(newPredicate);
64
+ }, onChange: (value) => {
65
+ const newPredicate = {
66
+ operator: props.predicate.operator,
67
+ args: [...props.predicate.args],
68
+ };
69
+ newPredicate.args[index] = value;
70
+ debouncedPredicateChange(newPredicate);
71
+ } }, index)] }));
60
72
  }) }));
61
73
  };
@@ -104,6 +104,10 @@ const AdaptableCombobox_Root = (props) => {
104
104
  eventDetails.cancel?.();
105
105
  return;
106
106
  }
107
+ if (props.searchable === 'menulist' && eventDetails?.reason === 'input-clear' && props.open) {
108
+ eventDetails.cancel?.();
109
+ return;
110
+ }
107
111
  props.onInputValueChange?.(next);
108
112
  };
109
113
  let comboboxItems = props.groups ?? props.items;
@@ -122,6 +126,21 @@ const AdaptableCombobox_Root = (props) => {
122
126
  }
123
127
  return (_jsx(Combobox, { ...props, items: comboboxItems, isItemEqualToValue: isItemEqualToValue, itemToStringLabel: getItemTextLabel, value: internalValue, defaultValue: internalDefaultValue, onValueChange: handleValueChange, onInputValueChange: handleInputValueChange, "aria-label": props.ariaLabel || props['aria-label'], "data-name": props['data-name'], disabled: props.disabled, open: props.open, onOpenChange: props.onOpenChange, multiple: props.multiple, filter: props.filter, autoHighlight: true, children: props.children }));
124
128
  };
129
+ const useMenulistFilterInput = (props, creatableInput) => {
130
+ const isMenulistFilter = props.searchable === 'menulist' && !props.isCreatable;
131
+ const [filterValue, setFilterValue] = React.useState(props.inputValue ?? props.defaultInputValue ?? '');
132
+ if (!isMenulistFilter) {
133
+ return creatableInput;
134
+ }
135
+ const inputValue = props.inputValue !== undefined ? props.inputValue : filterValue;
136
+ const onInputValueChange = (value) => {
137
+ if (props.inputValue === undefined) {
138
+ setFilterValue(value);
139
+ }
140
+ props.onInputValueChange?.(value);
141
+ };
142
+ return { inputValue, onInputValueChange };
143
+ };
125
144
  const useGetAllItems = (props) => {
126
145
  const allItems = props.groups
127
146
  ? props.groups.flatMap((g) => g.items)
@@ -132,7 +151,12 @@ const useGetAllItems = (props) => {
132
151
  const itemByValue = useMemo(() => {
133
152
  return new Map(allItems.map((item) => [item.value, item]));
134
153
  }, [allItems]);
135
- const { inputValue, onInputValueChange, onValueChange, value } = useCreatable(props, allItems, itemByValue);
154
+ const creatableInput = useCreatable(props, allItems, itemByValue);
155
+ const { inputValue, onInputValueChange } = useMenulistFilterInput(props, {
156
+ inputValue: creatableInput.inputValue,
157
+ onInputValueChange: creatableInput.onInputValueChange,
158
+ });
159
+ const { onValueChange, value } = creatableInput;
136
160
  return {
137
161
  value,
138
162
  itemByValue,
@@ -140,7 +164,11 @@ const useGetAllItems = (props) => {
140
164
  onInputValueChange,
141
165
  onValueChange,
142
166
  allItems,
143
- maxLabelLength: allItems.reduce((max, item) => Math.max(max, typeof item.label === 'string' ? item.label.length : 0), 0),
167
+ maxLabelLength: allItems.reduce((max, item) => Math.max(max, typeof item.label === 'string'
168
+ ? item.label.length
169
+ : typeof item.textLabel === 'string'
170
+ ? item.textLabel.length
171
+ : 0), 0),
144
172
  };
145
173
  };
146
174
  function useCreatable(props, allItems, itemByValue) {
@@ -9,6 +9,7 @@ export type DatepickerProps = Omit<InputProps, 'value' | 'onChange' | 'defaultVa
9
9
  onChange: (value: Date | undefined) => void;
10
10
  onHide?: VoidFunction;
11
11
  showClearButton?: boolean;
12
+ showTriggerButton?: boolean;
12
13
  datepickerButtons?: DatepickerButton[];
13
14
  dateProps: {
14
15
  format: string;
@@ -38,7 +38,7 @@ const captionComponents = {
38
38
  const END_MONTH = endOfYear(addYears(new Date(), 10));
39
39
  const START_MONTH = startOfYear(addYears(new Date(), -50));
40
40
  export const Datepicker = React.forwardRef((props, ref) => {
41
- const { dateProps, disabled, style, className, placeholder, showWeekNumber, showOutsideDays, datepickerButtons, showClearButton, autoFocus, onHide, value: _value, defaultValue: _defaultValue, onChange: _onChange, } = props;
41
+ const { dateProps, disabled, style, className, placeholder, showWeekNumber, showOutsideDays, datepickerButtons, showClearButton, autoFocus, showTriggerButton = true, onHide, value: _value, defaultValue: _defaultValue, onChange: _onChange, } = props;
42
42
  void _value;
43
43
  void _defaultValue;
44
44
  void _onChange;
@@ -172,7 +172,7 @@ export const Datepicker = React.forwardRef((props, ref) => {
172
172
  clearValue();
173
173
  triggerRef.current?.firstChild?.focus();
174
174
  }, accessLevel: ACCESS_LEVEL_FULL })) : null;
175
- const calendarButton = (_jsx(SimpleButton, { disabled: disabled, variant: "text", icon: "calendar", tooltip: "Date", iconSize: 20, className: "twa:p-0", type: "button" }));
175
+ const calendarButton = showTriggerButton !== false ? (_jsx(SimpleButton, { disabled: disabled, variant: "text", icon: "calendar", tooltip: "Date", iconSize: 20, className: "twa:p-0", type: "button" })) : null;
176
176
  const [selectPortalRoot, setSelectPortalRoot] = React.useState(null);
177
177
  const popupRefCallback = React.useCallback((el) => {
178
178
  popupRef.current = el;
package/src/env.js CHANGED
@@ -1,5 +1,5 @@
1
1
  export default {
2
2
  NEXT_PUBLIC_INFINITE_TABLE_LICENSE_KEY: "StartDate=2021-06-29|EndDate=2030-01-01|Owner=Adaptable|Type=distribution|TS=1624971462479|C=137829811,1004007071,2756196225,1839832928,3994409405,636616862" || '',
3
- PUBLISH_TIMESTAMP: 1783326457287 || Date.now(),
4
- VERSION: "23.0.8" || '--current-version--',
3
+ PUBLISH_TIMESTAMP: 1783955510713 || Date.now(),
4
+ VERSION: "23.0.10" || '--current-version--',
5
5
  };