@osdk/react-components 0.2.0-beta.27 → 0.2.0-beta.29
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/CHANGELOG.md +15 -0
- package/README.md +58 -3
- package/build/browser/action-form/FormFieldApi.js.map +1 -1
- package/build/browser/action-form/fields/FormFieldRenderer.js +8 -0
- package/build/browser/action-form/fields/FormFieldRenderer.js.map +1 -1
- package/build/browser/action-form/fields/NumberInputField.js +130 -0
- package/build/browser/action-form/fields/NumberInputField.js.map +1 -0
- package/build/browser/action-form/fields/NumberInputField.module.css +96 -0
- package/build/browser/action-form/fields/NumberInputField.module.css.js +9 -0
- package/build/browser/base-components/checkbox/Checkbox.js +6 -2
- package/build/browser/base-components/checkbox/Checkbox.js.map +1 -1
- package/build/browser/base-components/checkbox/Checkbox.module.css +15 -2
- package/build/browser/base-components/combobox/Combobox.js +14 -1
- package/build/browser/base-components/combobox/Combobox.js.map +1 -1
- package/build/browser/base-components/combobox/Combobox.module.css +16 -6
- package/build/browser/base-components/combobox/Combobox.module.css.js +1 -0
- package/build/browser/base-components/searchable-menu/SearchableMenu.js +86 -0
- package/build/browser/base-components/searchable-menu/SearchableMenu.js.map +1 -0
- package/build/browser/base-components/searchable-menu/SearchableMenu.module.css +80 -0
- package/build/browser/base-components/searchable-menu/SearchableMenu.module.css.js +10 -0
- package/build/browser/filter-list/FilterList.js +3 -1
- package/build/browser/filter-list/FilterList.js.map +1 -1
- package/build/browser/filter-list/FilterListApi.js.map +1 -1
- package/build/browser/filter-list/FilterListItemApi.js.map +1 -1
- package/build/browser/filter-list/base/AddFilterPopover.js +10 -21
- package/build/browser/filter-list/base/AddFilterPopover.js.map +1 -1
- package/build/browser/filter-list/base/AddFilterPopover.module.css +6 -40
- package/build/browser/filter-list/base/AddFilterPopover.module.css.js +1 -4
- package/build/browser/filter-list/base/BaseFilterList.js +4 -2
- package/build/browser/filter-list/base/BaseFilterList.js.map +1 -1
- package/build/browser/filter-list/base/ExcludeDropdown.js +4 -3
- package/build/browser/filter-list/base/ExcludeDropdown.js.map +1 -1
- package/build/browser/filter-list/base/ExcludeDropdown.module.css +7 -5
- package/build/browser/filter-list/base/FilterIcons.js +9 -3
- package/build/browser/filter-list/base/FilterIcons.js.map +1 -1
- package/build/browser/filter-list/base/FilterInputExcludeRow.js +14 -2
- package/build/browser/filter-list/base/FilterInputExcludeRow.js.map +1 -1
- package/build/browser/filter-list/base/FilterList.module.css +19 -6
- package/build/browser/filter-list/base/FilterList.module.css.js +1 -0
- package/build/browser/filter-list/base/FilterListContent.js +38 -17
- package/build/browser/filter-list/base/FilterListContent.js.map +1 -1
- package/build/browser/filter-list/base/FilterListHeader.js +1 -1
- package/build/browser/filter-list/base/FilterListHeader.js.map +1 -1
- package/build/browser/filter-list/base/FilterListHeader.module.css +8 -3
- package/build/browser/filter-list/base/FilterListItem.js +33 -1
- package/build/browser/filter-list/base/FilterListItem.js.map +1 -1
- package/build/browser/filter-list/base/FilterListItem.module.css +15 -6
- package/build/browser/filter-list/base/FilterListItem.module.css.js +1 -0
- package/build/browser/filter-list/base/SortableFilterListItem.js +3 -2
- package/build/browser/filter-list/base/SortableFilterListItem.js.map +1 -1
- package/build/browser/filter-list/base/inputs/ListogramInput.js +26 -11
- package/build/browser/filter-list/base/inputs/ListogramInput.js.map +1 -1
- package/build/browser/filter-list/base/inputs/ListogramInput.module.css +31 -0
- package/build/browser/filter-list/base/inputs/ListogramInput.module.css.js +2 -0
- package/build/browser/filter-list/base/inputs/MultiSelectInput.js +26 -43
- package/build/browser/filter-list/base/inputs/MultiSelectInput.js.map +1 -1
- package/build/browser/filter-list/base/inputs/MultiSelectInput.module.css +7 -8
- package/build/browser/filter-list/base/inputs/MultiSelectInput.module.css.js +1 -2
- package/build/browser/filter-list/base/inputs/NullValueWrapper.js +1 -1
- package/build/browser/filter-list/base/inputs/NullValueWrapper.js.map +1 -1
- package/build/browser/filter-list/base/inputs/RangeInput.js +5 -3
- package/build/browser/filter-list/base/inputs/RangeInput.js.map +1 -1
- package/build/browser/filter-list/base/inputs/RangeInput.module.css +7 -7
- package/build/browser/filter-list/base/inputs/SingleSelectInput.js +21 -30
- package/build/browser/filter-list/base/inputs/SingleSelectInput.js.map +1 -1
- package/build/browser/filter-list/base/inputs/SingleSelectInput.module.css +13 -23
- package/build/browser/filter-list/base/inputs/SingleSelectInput.module.css.js +3 -1
- package/build/browser/filter-list/base/inputs/index.js +0 -1
- package/build/browser/filter-list/base/inputs/index.js.map +1 -1
- package/build/browser/filter-list/hooks/useFilterListState.js +16 -12
- package/build/browser/filter-list/hooks/useFilterListState.js.map +1 -1
- package/build/browser/filter-list/hooks/usePropertyAggregation.js +7 -2
- package/build/browser/filter-list/hooks/usePropertyAggregation.js.map +1 -1
- package/build/browser/filter-list/inputs/ContainsTextFilterInput.js +1 -1
- package/build/browser/filter-list/inputs/ContainsTextFilterInput.js.map +1 -1
- package/build/browser/filter-list/inputs/LinkedPropertyInput.js +0 -35
- package/build/browser/filter-list/inputs/LinkedPropertyInput.js.map +1 -1
- package/build/browser/filter-list/inputs/ListogramFilterInput.js +14 -3
- package/build/browser/filter-list/inputs/ListogramFilterInput.js.map +1 -1
- package/build/browser/filter-list/inputs/MultiSelectFilterInput.js +9 -1
- package/build/browser/filter-list/inputs/MultiSelectFilterInput.js.map +1 -1
- package/build/browser/filter-list/inputs/PropertyFilterInput.js +1 -14
- package/build/browser/filter-list/inputs/PropertyFilterInput.js.map +1 -1
- package/build/browser/filter-list/inputs/SingleSelectFilterInput.js +9 -1
- package/build/browser/filter-list/inputs/SingleSelectFilterInput.js.map +1 -1
- package/build/browser/filter-list/inputs/TextTagsFilterInput.js +9 -1
- package/build/browser/filter-list/inputs/TextTagsFilterInput.js.map +1 -1
- package/build/browser/filter-list/utils/filterStateToWhereClause.js +2 -7
- package/build/browser/filter-list/utils/filterStateToWhereClause.js.map +1 -1
- package/build/browser/object-table/ColumnConfigDialog.module.css +1 -2
- package/build/browser/object-table/MultiColumnSortDialog.js +22 -59
- package/build/browser/object-table/MultiColumnSortDialog.js.map +1 -1
- package/build/browser/object-table/MultiColumnSortDialog.module.css +0 -64
- package/build/browser/object-table/MultiColumnSortDialog.module.css.js +0 -5
- package/build/browser/styles.css +324 -272
- package/build/cjs/public/experimental.cjs +1673 -1605
- package/build/cjs/public/experimental.cjs.map +1 -1
- package/build/cjs/public/experimental.css +501 -462
- package/build/cjs/public/experimental.css.map +1 -1
- package/build/cjs/public/experimental.d.cts +31 -26
- package/build/esm/action-form/FormFieldApi.js.map +1 -1
- package/build/esm/action-form/fields/FormFieldRenderer.js +8 -0
- package/build/esm/action-form/fields/FormFieldRenderer.js.map +1 -1
- package/build/esm/action-form/fields/NumberInputField.js +130 -0
- package/build/esm/action-form/fields/NumberInputField.js.map +1 -0
- package/build/esm/action-form/fields/NumberInputField.module.css +96 -0
- package/build/esm/base-components/checkbox/Checkbox.js +6 -2
- package/build/esm/base-components/checkbox/Checkbox.js.map +1 -1
- package/build/esm/base-components/checkbox/Checkbox.module.css +15 -2
- package/build/esm/base-components/combobox/Combobox.js +14 -1
- package/build/esm/base-components/combobox/Combobox.js.map +1 -1
- package/build/esm/base-components/combobox/Combobox.module.css +16 -6
- package/build/esm/base-components/searchable-menu/SearchableMenu.js +86 -0
- package/build/esm/base-components/searchable-menu/SearchableMenu.js.map +1 -0
- package/build/esm/base-components/searchable-menu/SearchableMenu.module.css +80 -0
- package/build/esm/filter-list/FilterList.js +3 -1
- package/build/esm/filter-list/FilterList.js.map +1 -1
- package/build/esm/filter-list/FilterListApi.js.map +1 -1
- package/build/esm/filter-list/FilterListItemApi.js.map +1 -1
- package/build/esm/filter-list/base/AddFilterPopover.js +10 -21
- package/build/esm/filter-list/base/AddFilterPopover.js.map +1 -1
- package/build/esm/filter-list/base/AddFilterPopover.module.css +6 -40
- package/build/esm/filter-list/base/BaseFilterList.js +4 -2
- package/build/esm/filter-list/base/BaseFilterList.js.map +1 -1
- package/build/esm/filter-list/base/ExcludeDropdown.js +4 -3
- package/build/esm/filter-list/base/ExcludeDropdown.js.map +1 -1
- package/build/esm/filter-list/base/ExcludeDropdown.module.css +7 -5
- package/build/esm/filter-list/base/FilterIcons.js +9 -3
- package/build/esm/filter-list/base/FilterIcons.js.map +1 -1
- package/build/esm/filter-list/base/FilterInputExcludeRow.js +14 -2
- package/build/esm/filter-list/base/FilterInputExcludeRow.js.map +1 -1
- package/build/esm/filter-list/base/FilterList.module.css +19 -6
- package/build/esm/filter-list/base/FilterListContent.js +38 -17
- package/build/esm/filter-list/base/FilterListContent.js.map +1 -1
- package/build/esm/filter-list/base/FilterListHeader.js +1 -1
- package/build/esm/filter-list/base/FilterListHeader.js.map +1 -1
- package/build/esm/filter-list/base/FilterListHeader.module.css +8 -3
- package/build/esm/filter-list/base/FilterListItem.js +33 -1
- package/build/esm/filter-list/base/FilterListItem.js.map +1 -1
- package/build/esm/filter-list/base/FilterListItem.module.css +15 -6
- package/build/esm/filter-list/base/SortableFilterListItem.js +3 -2
- package/build/esm/filter-list/base/SortableFilterListItem.js.map +1 -1
- package/build/esm/filter-list/base/inputs/ListogramInput.js +26 -11
- package/build/esm/filter-list/base/inputs/ListogramInput.js.map +1 -1
- package/build/esm/filter-list/base/inputs/ListogramInput.module.css +31 -0
- package/build/esm/filter-list/base/inputs/MultiSelectInput.js +26 -43
- package/build/esm/filter-list/base/inputs/MultiSelectInput.js.map +1 -1
- package/build/esm/filter-list/base/inputs/MultiSelectInput.module.css +7 -8
- package/build/esm/filter-list/base/inputs/NullValueWrapper.js +1 -1
- package/build/esm/filter-list/base/inputs/NullValueWrapper.js.map +1 -1
- package/build/esm/filter-list/base/inputs/RangeInput.js +5 -3
- package/build/esm/filter-list/base/inputs/RangeInput.js.map +1 -1
- package/build/esm/filter-list/base/inputs/RangeInput.module.css +7 -7
- package/build/esm/filter-list/base/inputs/SingleSelectInput.js +21 -30
- package/build/esm/filter-list/base/inputs/SingleSelectInput.js.map +1 -1
- package/build/esm/filter-list/base/inputs/SingleSelectInput.module.css +13 -23
- package/build/esm/filter-list/base/inputs/index.js +0 -1
- package/build/esm/filter-list/base/inputs/index.js.map +1 -1
- package/build/esm/filter-list/hooks/useFilterListState.js +16 -12
- package/build/esm/filter-list/hooks/useFilterListState.js.map +1 -1
- package/build/esm/filter-list/hooks/usePropertyAggregation.js +7 -2
- package/build/esm/filter-list/hooks/usePropertyAggregation.js.map +1 -1
- package/build/esm/filter-list/inputs/ContainsTextFilterInput.js +1 -1
- package/build/esm/filter-list/inputs/ContainsTextFilterInput.js.map +1 -1
- package/build/esm/filter-list/inputs/LinkedPropertyInput.js +0 -35
- package/build/esm/filter-list/inputs/LinkedPropertyInput.js.map +1 -1
- package/build/esm/filter-list/inputs/ListogramFilterInput.js +14 -3
- package/build/esm/filter-list/inputs/ListogramFilterInput.js.map +1 -1
- package/build/esm/filter-list/inputs/MultiSelectFilterInput.js +9 -1
- package/build/esm/filter-list/inputs/MultiSelectFilterInput.js.map +1 -1
- package/build/esm/filter-list/inputs/PropertyFilterInput.js +1 -14
- package/build/esm/filter-list/inputs/PropertyFilterInput.js.map +1 -1
- package/build/esm/filter-list/inputs/SingleSelectFilterInput.js +9 -1
- package/build/esm/filter-list/inputs/SingleSelectFilterInput.js.map +1 -1
- package/build/esm/filter-list/inputs/TextTagsFilterInput.js +9 -1
- package/build/esm/filter-list/inputs/TextTagsFilterInput.js.map +1 -1
- package/build/esm/filter-list/utils/filterStateToWhereClause.js +2 -7
- package/build/esm/filter-list/utils/filterStateToWhereClause.js.map +1 -1
- package/build/esm/object-table/ColumnConfigDialog.module.css +1 -2
- package/build/esm/object-table/MultiColumnSortDialog.js +22 -59
- package/build/esm/object-table/MultiColumnSortDialog.js.map +1 -1
- package/build/esm/object-table/MultiColumnSortDialog.module.css +0 -64
- package/build/types/action-form/FormFieldApi.d.ts +22 -4
- package/build/types/action-form/FormFieldApi.d.ts.map +1 -1
- package/build/types/action-form/fields/FormFieldRenderer.d.ts.map +1 -1
- package/build/types/action-form/fields/NumberInputField.d.ts +3 -0
- package/build/types/action-form/fields/NumberInputField.d.ts.map +1 -0
- package/build/types/base-components/checkbox/Checkbox.d.ts +2 -1
- package/build/types/base-components/checkbox/Checkbox.d.ts.map +1 -1
- package/build/types/base-components/combobox/Combobox.d.ts +6 -1
- package/build/types/base-components/combobox/Combobox.d.ts.map +1 -1
- package/build/types/base-components/searchable-menu/SearchableMenu.d.ts +18 -0
- package/build/types/base-components/searchable-menu/SearchableMenu.d.ts.map +1 -0
- package/build/types/filter-list/FilterListApi.d.ts +0 -7
- package/build/types/filter-list/FilterListApi.d.ts.map +1 -1
- package/build/types/filter-list/FilterListItemApi.d.ts +10 -7
- package/build/types/filter-list/FilterListItemApi.d.ts.map +1 -1
- package/build/types/filter-list/base/AddFilterPopover.d.ts.map +1 -1
- package/build/types/filter-list/base/ExcludeDropdown.d.ts.map +1 -1
- package/build/types/filter-list/base/FilterIcons.d.ts +1 -0
- package/build/types/filter-list/base/FilterIcons.d.ts.map +1 -1
- package/build/types/filter-list/base/FilterInputExcludeRow.d.ts +2 -1
- package/build/types/filter-list/base/FilterInputExcludeRow.d.ts.map +1 -1
- package/build/types/filter-list/base/FilterListContent.d.ts.map +1 -1
- package/build/types/filter-list/base/FilterListItem.d.ts.map +1 -1
- package/build/types/filter-list/base/SortableFilterListItem.d.ts +2 -1
- package/build/types/filter-list/base/SortableFilterListItem.d.ts.map +1 -1
- package/build/types/filter-list/base/inputs/ListogramInput.d.ts +2 -1
- package/build/types/filter-list/base/inputs/ListogramInput.d.ts.map +1 -1
- package/build/types/filter-list/base/inputs/MultiSelectInput.d.ts +1 -3
- package/build/types/filter-list/base/inputs/MultiSelectInput.d.ts.map +1 -1
- package/build/types/filter-list/base/inputs/RangeInput.d.ts.map +1 -1
- package/build/types/filter-list/base/inputs/SingleSelectInput.d.ts.map +1 -1
- package/build/types/filter-list/base/inputs/index.d.ts +0 -1
- package/build/types/filter-list/base/inputs/index.d.ts.map +1 -1
- package/build/types/filter-list/hooks/useFilterListState.d.ts +1 -0
- package/build/types/filter-list/hooks/useFilterListState.d.ts.map +1 -1
- package/build/types/filter-list/hooks/usePropertyAggregation.d.ts +1 -0
- package/build/types/filter-list/hooks/usePropertyAggregation.d.ts.map +1 -1
- package/build/types/filter-list/inputs/LinkedPropertyInput.d.ts.map +1 -1
- package/build/types/filter-list/inputs/ListogramFilterInput.d.ts.map +1 -1
- package/build/types/filter-list/inputs/MultiSelectFilterInput.d.ts.map +1 -1
- package/build/types/filter-list/inputs/PropertyFilterInput.d.ts.map +1 -1
- package/build/types/filter-list/inputs/SingleSelectFilterInput.d.ts.map +1 -1
- package/build/types/filter-list/inputs/TextTagsFilterInput.d.ts.map +1 -1
- package/build/types/filter-list/utils/filterStateToWhereClause.d.ts +1 -1
- package/build/types/filter-list/utils/filterStateToWhereClause.d.ts.map +1 -1
- package/build/types/object-table/MultiColumnSortDialog.d.ts.map +1 -1
- package/package.json +5 -5
- package/build/browser/filter-list/base/inputs/CheckboxListInput.js +0 -83
- package/build/browser/filter-list/base/inputs/CheckboxListInput.js.map +0 -1
- package/build/browser/filter-list/base/inputs/CheckboxListInput.module.css +0 -65
- package/build/browser/filter-list/base/inputs/CheckboxListInput.module.css.js +0 -10
- package/build/browser/filter-list/base/inputs/CheckboxListSkeleton.js +0 -46
- package/build/browser/filter-list/base/inputs/CheckboxListSkeleton.js.map +0 -1
- package/build/browser/filter-list/base/inputs/CheckboxListSkeleton.module.css +0 -32
- package/build/browser/filter-list/base/inputs/CheckboxListSkeleton.module.css.js +0 -8
- package/build/browser/filter-list/inputs/CheckboxListFilterInput.js +0 -66
- package/build/browser/filter-list/inputs/CheckboxListFilterInput.js.map +0 -1
- package/build/esm/filter-list/base/inputs/CheckboxListInput.js +0 -83
- package/build/esm/filter-list/base/inputs/CheckboxListInput.js.map +0 -1
- package/build/esm/filter-list/base/inputs/CheckboxListInput.module.css +0 -65
- package/build/esm/filter-list/base/inputs/CheckboxListSkeleton.js +0 -46
- package/build/esm/filter-list/base/inputs/CheckboxListSkeleton.js.map +0 -1
- package/build/esm/filter-list/base/inputs/CheckboxListSkeleton.module.css +0 -32
- package/build/esm/filter-list/inputs/CheckboxListFilterInput.js +0 -66
- package/build/esm/filter-list/inputs/CheckboxListFilterInput.js.map +0 -1
- package/build/types/filter-list/base/inputs/CheckboxListInput.d.ts +0 -16
- package/build/types/filter-list/base/inputs/CheckboxListInput.d.ts.map +0 -1
- package/build/types/filter-list/base/inputs/CheckboxListSkeleton.d.ts +0 -2
- package/build/types/filter-list/base/inputs/CheckboxListSkeleton.d.ts.map +0 -1
- package/build/types/filter-list/inputs/CheckboxListFilterInput.d.ts +0 -17
- package/build/types/filter-list/inputs/CheckboxListFilterInput.d.ts.map +0 -1
|
@@ -191,11 +191,11 @@ type PropertyTypeFromKey<Q extends ObjectTypeDefinition, K extends PropertyKeys<
|
|
|
191
191
|
/**
|
|
192
192
|
* All available filter component types
|
|
193
193
|
*/
|
|
194
|
-
type FilterComponentType = "LISTOGRAM" | "DATE_RANGE" | "NUMBER_RANGE" | "TEXT_TAGS" | "CONTAINS_TEXT" | "SINGLE_SELECT" | "MULTI_SELECT" | "SINGLE_DATE" | "MULTI_DATE" | "TIMELINE" | "
|
|
194
|
+
type FilterComponentType = "LISTOGRAM" | "DATE_RANGE" | "NUMBER_RANGE" | "TEXT_TAGS" | "CONTAINS_TEXT" | "SINGLE_SELECT" | "MULTI_SELECT" | "SINGLE_DATE" | "MULTI_DATE" | "TIMELINE" | "TOGGLE";
|
|
195
195
|
/**
|
|
196
196
|
* Gets valid component types for a given property type
|
|
197
197
|
*/
|
|
198
|
-
type ValidComponentsForPropertyType<P extends WirePropertyTypes> = P extends "boolean" ? "LISTOGRAM" | "
|
|
198
|
+
type ValidComponentsForPropertyType<P extends WirePropertyTypes> = P extends "boolean" ? "LISTOGRAM" | "SINGLE_SELECT" | "TOGGLE" : P extends "string" ? "LISTOGRAM" | "TEXT_TAGS" | "CONTAINS_TEXT" | "SINGLE_SELECT" | "MULTI_SELECT" : P extends "datetime" | "timestamp" ? "DATE_RANGE" | "SINGLE_DATE" | "MULTI_DATE" | "TIMELINE" : P extends "double" | "integer" | "long" | "float" | "short" | "byte" | "decimal" ? "NUMBER_RANGE" | "SINGLE_SELECT" | "MULTI_SELECT" : never;
|
|
199
199
|
/**
|
|
200
200
|
* Union of all possible filter states
|
|
201
201
|
*/
|
|
@@ -214,7 +214,6 @@ interface FilterStateByComponentType {
|
|
|
214
214
|
SINGLE_DATE: SelectFilterState<Date>;
|
|
215
215
|
MULTI_DATE: SelectFilterState<Date>;
|
|
216
216
|
TIMELINE: TimelineFilterState;
|
|
217
|
-
CHECKBOX_LIST: SelectFilterState<string>;
|
|
218
217
|
TOGGLE: ToggleFilterState;
|
|
219
218
|
}
|
|
220
219
|
/**
|
|
@@ -273,7 +272,7 @@ interface NumberRangeFilterState extends BaseFilterState {
|
|
|
273
272
|
}
|
|
274
273
|
/**
|
|
275
274
|
* Consolidated state type for select-based filters.
|
|
276
|
-
* Used by SINGLE_SELECT, MULTI_SELECT, SINGLE_DATE,
|
|
275
|
+
* Used by SINGLE_SELECT, MULTI_SELECT, SINGLE_DATE, and MULTI_DATE.
|
|
277
276
|
*/
|
|
278
277
|
interface SelectFilterState<T = string | boolean | number | Date> extends BaseFilterState {
|
|
279
278
|
type: "SELECT";
|
|
@@ -293,8 +292,8 @@ interface ToggleFilterState extends BaseFilterState {
|
|
|
293
292
|
* A property filter definition specifies configuration for filtering on a single property
|
|
294
293
|
*
|
|
295
294
|
* The component type C must be compatible with the property type derived from the key.
|
|
296
|
-
* For example, boolean properties can only use LISTOGRAM
|
|
297
|
-
* while string properties can use LISTOGRAM, TEXT_TAGS, CONTAINS_TEXT, SINGLE_SELECT,
|
|
295
|
+
* For example, boolean properties can only use LISTOGRAM or SINGLE_SELECT,
|
|
296
|
+
* while string properties can use LISTOGRAM, TEXT_TAGS, CONTAINS_TEXT, SINGLE_SELECT, or MULTI_SELECT.
|
|
298
297
|
*/
|
|
299
298
|
interface PropertyFilterDefinition<Q extends ObjectTypeDefinition, K extends PropertyKeys<Q> = PropertyKeys<Q>, C extends ValidComponentsForPropertyType<PropertyTypeFromKey<Q, K>> = ValidComponentsForPropertyType<PropertyTypeFromKey<Q, K>>> {
|
|
300
299
|
/**
|
|
@@ -325,7 +324,7 @@ interface PropertyFilterDefinition<Q extends ObjectTypeDefinition, K extends Pro
|
|
|
325
324
|
filterState: FilterStateByComponentType[C];
|
|
326
325
|
/**
|
|
327
326
|
* Maps filter values to colors for visual differentiation.
|
|
328
|
-
* Used by
|
|
327
|
+
* Used by LISTOGRAM (per-row bar colors).
|
|
329
328
|
*/
|
|
330
329
|
colorMap?: Record<string, string>;
|
|
331
330
|
/**
|
|
@@ -334,6 +333,10 @@ interface PropertyFilterDefinition<Q extends ObjectTypeDefinition, K extends Pro
|
|
|
334
333
|
*/
|
|
335
334
|
listogramConfig?: {
|
|
336
335
|
displayMode?: "full" | "count" | "minimal";
|
|
336
|
+
/**
|
|
337
|
+
* Number of items shown before "View all" link appears
|
|
338
|
+
* @default 5
|
|
339
|
+
*/
|
|
337
340
|
maxVisibleItems?: number;
|
|
338
341
|
};
|
|
339
342
|
/**
|
|
@@ -427,18 +430,11 @@ interface FilterListProps<Q extends ObjectTypeDefinition> {
|
|
|
427
430
|
filterClause?: WhereClause<Q>;
|
|
428
431
|
/**
|
|
429
432
|
* Called when the filter clause changes.
|
|
430
|
-
* The filters are joined by the selected filterOperator.
|
|
431
433
|
* Required in controlled mode.
|
|
432
434
|
*
|
|
433
435
|
* @param newClause The updated filter clause
|
|
434
436
|
*/
|
|
435
437
|
onFilterClauseChanged?: (newClause: WhereClause<Q>) => void;
|
|
436
|
-
/**
|
|
437
|
-
* The logical operator to join multiple filters
|
|
438
|
-
*
|
|
439
|
-
* @default "and"
|
|
440
|
-
*/
|
|
441
|
-
filterOperator?: "and" | "or";
|
|
442
438
|
/**
|
|
443
439
|
* Called when filter state changes
|
|
444
440
|
*
|
|
@@ -1461,9 +1457,8 @@ interface FormFieldDefinition<Q extends ActionDefinition<unknown>, K extends Fie
|
|
|
1461
1457
|
fieldKey: K;
|
|
1462
1458
|
/**
|
|
1463
1459
|
* Display label for the field
|
|
1464
|
-
* If not provided, the form field will not show any label.
|
|
1465
1460
|
*/
|
|
1466
|
-
label
|
|
1461
|
+
label: string;
|
|
1467
1462
|
/**
|
|
1468
1463
|
* Default value of the field
|
|
1469
1464
|
*/
|
|
@@ -1645,15 +1640,25 @@ interface TextInputFieldProps extends BaseFormFieldProps<string>, Pick<React__de
|
|
|
1645
1640
|
/**
|
|
1646
1641
|
* Number input field props
|
|
1647
1642
|
*/
|
|
1648
|
-
interface NumberInputFieldProps extends BaseFormFieldProps<number
|
|
1649
|
-
/**
|
|
1650
|
-
|
|
1651
|
-
|
|
1652
|
-
|
|
1653
|
-
/**
|
|
1654
|
-
|
|
1655
|
-
|
|
1656
|
-
|
|
1643
|
+
interface NumberInputFieldProps extends BaseFormFieldProps<number> {
|
|
1644
|
+
/**
|
|
1645
|
+
* Minimum allowed value.
|
|
1646
|
+
*/
|
|
1647
|
+
min?: number;
|
|
1648
|
+
/**
|
|
1649
|
+
* Maximum allowed value.
|
|
1650
|
+
*/
|
|
1651
|
+
max?: number;
|
|
1652
|
+
/**
|
|
1653
|
+
* Step increment for the input. Used by the stepper buttons and ArrowUp/ArrowDown keyboard stepping.
|
|
1654
|
+
*
|
|
1655
|
+
* @default 1
|
|
1656
|
+
*/
|
|
1657
|
+
step?: number;
|
|
1658
|
+
/**
|
|
1659
|
+
* Placeholder text shown when the input is empty.
|
|
1660
|
+
*/
|
|
1661
|
+
placeholder?: string;
|
|
1657
1662
|
}
|
|
1658
1663
|
/**
|
|
1659
1664
|
* Radio buttons field props
|
|
@@ -1763,7 +1768,7 @@ type RendererFieldDefinition = {
|
|
|
1763
1768
|
fieldKey: string;
|
|
1764
1769
|
fieldComponent: K;
|
|
1765
1770
|
fieldType?: FieldType;
|
|
1766
|
-
label
|
|
1771
|
+
label: string;
|
|
1767
1772
|
defaultValue?: unknown;
|
|
1768
1773
|
isRequired?: boolean;
|
|
1769
1774
|
placeholder?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormFieldApi.js","names":[],"sources":["FormFieldApi.ts"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type {\n ActionDefinition,\n ActionMetadata,\n ActionParam,\n CompileTimeMetadata,\n DataValueClientToWire,\n ObjectSet,\n ObjectTypeDefinition,\n} from \"@osdk/api\";\nimport type React from \"react\";\n\n/**\n * A form field definition specifies configuration for a single field\n */\nexport interface FormFieldDefinition<\n Q extends ActionDefinition<unknown>,\n K extends FieldKey<Q> = FieldKey<Q>,\n> {\n /**\n * The field's unique key\n */\n fieldKey: K;\n\n /**\n * Display label for the field\n * If not provided, the form field will not show any label.\n */\n label?: string;\n\n /**\n * Default value of the field\n */\n defaultValue?: FieldValueType<Q, K>;\n\n /**\n * The form field component type to render\n */\n fieldComponent: ValidFormFieldForPropertyType<FieldDescriptorType<Q, K>>;\n\n /**\n * Whether the field is required\n */\n isRequired?: boolean;\n\n /**\n * Placeholder text\n */\n placeholder?: string;\n\n /**\n * Additional information to display on this field\n * The placement of helper text depends on the value of helperTextPlacement prop\n */\n helperText?: string;\n\n /**\n * The placement of the helper text either below the field or in a tooltip\n *\n * @default \"tooltip\"\n */\n helperTextPlacement?: \"bottom\" | \"tooltip\";\n\n /**\n * Whether the field is disabled\n */\n isDisabled?: boolean;\n\n /**\n * A callback to return a custom error message if validation failed\n *\n * @param validationRule the validation rule that failed with the error message\n * @returns the error message to display\n */\n onValidationError?: (error: ValidationError) => string;\n\n /**\n * Additional function to validate the field\n *\n * @param value the current field value\n * @returns a boolean promise indicating whether the value is valid\n */\n validate?: (value: FieldValueType<Q, K>) => Promise<boolean>;\n\n /**\n * The component props for the form field\n * Excludes runtime props (value, onChange) which are managed by ActionForm\n */\n fieldComponentProps: Omit<\n FormFieldPropsByType[\n ValidFormFieldForPropertyType<\n FieldDescriptorType<Q, K>\n >\n ],\n \"value\" | \"onChange\"\n >;\n}\n\ntype ValidationError = { type: ValidationRule; error: string };\n\ntype ValidationRule =\n | \"required\"\n | \"min\"\n | \"max\"\n | \"minLength\"\n | \"maxLength\"\n | \"pattern\"\n | \"validate\";\n\n/**\n * Maps field types to their corresponding props\n */\nexport interface FormFieldPropsByType {\n DATETIME_PICKER: DatetimePickerFieldProps;\n DROPDOWN: DropdownFieldProps<unknown, boolean>;\n FILE_PICKER: FilePickerProps;\n NUMBER_INPUT: NumberInputFieldProps;\n OBJECT_SET: ObjectSetFieldProps<ObjectTypeDefinition>;\n RADIO_BUTTONS: RadioButtonsFieldProps<unknown>;\n TEXT_AREA: TextAreaFieldProps;\n TEXT_INPUT: TextInputFieldProps;\n CUSTOM: CustomFieldProps<unknown>;\n}\n\n/**\n * Datetime picker field props.\n *\n * When `formatDate` is omitted, ISO-like format is used (YYYY-MM-DD / YYYY-MM-DD HH:mm).\n */\nexport interface DatetimePickerFieldProps extends BaseFormFieldProps<Date> {\n /**\n * The earliest date the user can select.\n * If provided, this will be added to the field validation.\n */\n min?: Date;\n\n /**\n * The latest date the user can select.\n * If provided, this will be added to the field validation.\n */\n max?: Date;\n\n /**\n * Whether to show time picker.\n */\n showTime?: boolean;\n\n /**\n * Whether to close the popover after selecting a date.\n * @default true when `showTime` is false, false when `showTime` is true\n */\n closeOnSelection?: boolean;\n\n /**\n * Placeholder text shown when no value is selected.\n */\n placeholder?: string;\n\n /** Formats a Date for display in the trigger button. */\n formatDate?: (date: Date) => string;\n}\n\n/**\n * Dropdown field props with selectable items\n */\nexport interface DropdownFieldProps<V, Multiple extends boolean = false>\n extends BaseFormFieldProps<Multiple extends true ? V[] : V>\n{\n /**\n * Available items for the dropdown\n */\n items: V[];\n\n /**\n * Converts an item to a display string. Defaults to `String()`.\n */\n itemToStringLabel?: (item: V) => string;\n\n /**\n * Returns a unique string key for a list item. Used as the React `key`.\n * Falls back to the item's index when not provided.\n */\n itemToKey?: (item: V) => string;\n\n /**\n * Custom equality check for item values. Defaults to `Object.is`.\n * Required when items are objects to ensure correct selection matching.\n */\n isItemEqual?: (a: V, b: V) => boolean;\n\n /**\n * Whether the dropdown allows searching/filtering.\n * When true, renders a Combobox with a search input.\n * When false (default), renders a Select dropdown.\n */\n isSearchable?: boolean;\n\n /**\n * Placeholder text shown when no value is selected.\n */\n placeholder?: string;\n\n /**\n * Whether multiple values can be selected\n */\n isMultiple?: Multiple;\n}\n\nexport interface FilePickerProps extends BaseFormFieldProps<File | File[]> {\n /**\n * Whether multiple files can be selected\n */\n isMulti?: boolean;\n\n /**\n * Accepted file types (e.g., \"image/*\", \".pdf\")\n */\n accept?: string | string[];\n\n /**\n * Maximum file size in bytes\n */\n maxSize?: number;\n}\n\n/**\n * Text area field props\n */\nexport interface TextAreaFieldProps extends\n BaseFormFieldProps<string>,\n Pick<\n React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n | \"rows\"\n | \"wrap\"\n /**\n * If provided, this will be added to the field validation\n */\n | \"minLength\"\n /**\n * If provided, this will be added to the field validation\n */\n | \"maxLength\"\n >\n{\n placeholder?: string;\n}\n\nexport interface TextInputFieldProps extends\n BaseFormFieldProps<string>,\n Pick<\n React.InputHTMLAttributes<HTMLInputElement>,\n /**\n * If provided, this will be added to the field validation\n */\n | \"minLength\"\n /**\n * If provided, this will be added to the field validation\n */\n | \"maxLength\"\n >\n{\n placeholder?: string;\n}\n\n/**\n * Number input field props\n */\nexport interface NumberInputFieldProps extends\n BaseFormFieldProps<number>,\n Pick<\n React.InputHTMLAttributes<HTMLInputElement>,\n /**\n * If provided, this will be added to the field validation\n */\n | \"min\"\n /**\n * If provided, this will be added to the field validation\n */\n | \"max\"\n | \"step\"\n >\n{}\n\n/**\n * Radio buttons field props\n */\nexport interface RadioButtonsFieldProps<V> extends BaseFormFieldProps<V> {\n /**\n * Available options for radio buttons.\n *\n * Values are compared by reference equality (`===`). When options contain\n * non-primitive values, pass the same object references for `value` and\n * the corresponding option entry.\n */\n options: Option<V>[];\n}\n\n/**\n * Option interface for radio button options\n */\nexport interface Option<V> {\n label: string;\n value: V;\n}\n\n/**\n * Object set field displays the summary of the count of the given object set\n */\nexport interface ObjectSetFieldProps<T extends ObjectTypeDefinition>\n extends BaseFormFieldProps<ObjectSet<T>>\n{}\n\n/**\n * Custom field props for user-defined renderers\n */\nexport interface CustomFieldProps<V> extends BaseFormFieldProps<V> {\n /**\n * Custom renderer function\n */\n customRenderer: (props: BaseFormFieldProps<V>) => React.ReactNode;\n}\n\nexport interface BaseFormFieldProps<V> {\n /**\n * The HTML `id` attribute for the field input element.\n * Used for `<label htmlFor>` association.\n */\n id?: string;\n\n /**\n * The value of the form field\n */\n value: V | null;\n /**\n * Called when the field value changes.\n *\n * ActionForm internally wraps this to pass the key to `onFieldValueChange`:\n * ```\n * <DropdownField\n * {...fieldDef}\n * onChange={(value) => onFieldValueChange(fieldDef.key, value)}\n * />\n * ```\n *\n * @param value The new value of the form field\n */\n onChange?: (value: V | null) => void;\n}\n\nexport type FieldKey<Q extends ActionDefinition<unknown>> =\n keyof ActionParameters<Q>;\n\n/**\n * Extracts parameters from an ActionDefinition\n */\nexport type ActionParameters<Q extends ActionDefinition<unknown>> =\n CompileTimeMetadata<Q>[\"parameters\"];\n\n/**\n * Extracts the value type for a specific parameter\n *\n * TODO: Re-use `BaseType`\n */\nexport type FieldValueType<\n Q extends ActionDefinition<unknown>,\n K extends keyof ActionParameters<Q> = keyof ActionParameters<Q>,\n> = ActionParameters<Q>[K][\"type\"] extends\n ActionMetadata.DataType.Object<infer T> ? ActionParam.ObjectType<T>\n : ActionParameters<Q>[K][\"type\"] extends ActionMetadata.DataType.ObjectSet<\n infer T\n > ? ActionParam.ObjectSetType<T>\n : ActionParameters<Q>[K][\"type\"] extends ActionMetadata.DataType.Struct<\n infer T\n > ? ActionParam.StructType<T>\n : ActionParameters<Q>[K][\"type\"] extends keyof DataValueClientToWire\n ? DataValueClientToWire[ActionParameters<Q>[K][\"type\"]]\n : never;\n\n/**\n * Extracts the parameter type descriptor for a specific action parameter.\n */\nexport type FieldDescriptorType<\n Q extends ActionDefinition<unknown> = ActionDefinition<unknown>,\n K extends keyof ActionParameters<Q> = keyof ActionParameters<Q>,\n> = ActionParameters<Q>[K][\"type\"];\n\n/**\n * Available form field component types\n */\nexport type FieldComponent =\n | \"DATETIME_PICKER\"\n | \"DROPDOWN\"\n | \"FILE_PICKER\"\n | \"NUMBER_INPUT\"\n | \"RADIO_BUTTONS\"\n | \"OBJECT_SET\"\n | \"TEXT_AREA\"\n | \"TEXT_INPUT\"\n | \"CUSTOM\";\n\n/**\n * Describes the data type of a form field, independent of OSDK.\n * Mirrors ActionMetadata.DataType to keep the rendering layer OSDK-agnostic.\n */\nexport type FieldType =\n | \"boolean\"\n | \"string\"\n | \"integer\"\n | \"long\"\n | \"double\"\n | \"datetime\"\n | \"timestamp\"\n | \"attachment\"\n | \"marking\"\n | \"mediaReference\"\n | \"objectType\"\n | \"geoshape\"\n | \"geohash\"\n | { type: \"object\"; object: string }\n | { type: \"objectSet\"; objectSet: string }\n | { type: \"interface\"; interface: string }\n | { type: \"struct\"; struct: Record<string, string> };\n\n/**\n * An OSDK-agnostic field definition used by BaseForm and FormFieldRenderer.\n * Contains only the information needed to render a single field — no generics,\n * no compile-time parameter constraints.\n *\n * Implemented as a distributed mapped type: switching on `fieldComponent`\n * narrows `fieldComponentProps` to the correct props type automatically.\n */\nexport type RendererFieldDefinition = {\n [K in FieldComponent]: {\n fieldKey: string;\n fieldComponent: K;\n fieldType?: FieldType;\n label?: string;\n defaultValue?: unknown;\n isRequired?: boolean;\n placeholder?: string;\n helperText?: string;\n helperTextPlacement?: \"bottom\" | \"tooltip\";\n fieldComponentProps: Omit<FormFieldPropsByType[K], \"value\" | \"onChange\">;\n };\n}[FieldComponent];\n\n/**\n * Gets valid form field types for a given property type\n */\nexport type ValidFormFieldForPropertyType<P extends FieldDescriptorType> =\n P extends \"objectSet\" ? \"OBJECT_SET\"\n : P extends \"object\" ? \"DROPDOWN\"\n : P extends \"mediaReference\" | \"attachment\" ? \"FILE_PICKER\"\n : P extends \"boolean\" ? \"RADIO_BUTTONS\" | \"DROPDOWN\"\n : P extends \"string\" ? \"TEXT_INPUT\" | \"TEXT_AREA\"\n : P extends \"datetime\" | \"timestamp\" ? \"DATETIME_PICKER\"\n : P extends\n | \"double\"\n | \"integer\"\n | \"long\"\n | \"float\"\n | \"short\"\n | \"byte\"\n | \"decimal\" ? \"NUMBER_INPUT\"\n : never;\n"],"mappings":"","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"FormFieldApi.js","names":[],"sources":["FormFieldApi.ts"],"sourcesContent":["/*\n * Copyright 2026 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type {\n ActionDefinition,\n ActionMetadata,\n ActionParam,\n CompileTimeMetadata,\n DataValueClientToWire,\n ObjectSet,\n ObjectTypeDefinition,\n} from \"@osdk/api\";\nimport type React from \"react\";\n\n/**\n * A form field definition specifies configuration for a single field\n */\nexport interface FormFieldDefinition<\n Q extends ActionDefinition<unknown>,\n K extends FieldKey<Q> = FieldKey<Q>,\n> {\n /**\n * The field's unique key\n */\n fieldKey: K;\n\n /**\n * Display label for the field\n */\n label: string;\n\n /**\n * Default value of the field\n */\n defaultValue?: FieldValueType<Q, K>;\n\n /**\n * The form field component type to render\n */\n fieldComponent: ValidFormFieldForPropertyType<FieldDescriptorType<Q, K>>;\n\n /**\n * Whether the field is required\n */\n isRequired?: boolean;\n\n /**\n * Placeholder text\n */\n placeholder?: string;\n\n /**\n * Additional information to display on this field\n * The placement of helper text depends on the value of helperTextPlacement prop\n */\n helperText?: string;\n\n /**\n * The placement of the helper text either below the field or in a tooltip\n *\n * @default \"tooltip\"\n */\n helperTextPlacement?: \"bottom\" | \"tooltip\";\n\n /**\n * Whether the field is disabled\n */\n isDisabled?: boolean;\n\n /**\n * A callback to return a custom error message if validation failed\n *\n * @param validationRule the validation rule that failed with the error message\n * @returns the error message to display\n */\n onValidationError?: (error: ValidationError) => string;\n\n /**\n * Additional function to validate the field\n *\n * @param value the current field value\n * @returns a boolean promise indicating whether the value is valid\n */\n validate?: (value: FieldValueType<Q, K>) => Promise<boolean>;\n\n /**\n * The component props for the form field\n * Excludes runtime props (value, onChange) which are managed by ActionForm\n */\n fieldComponentProps: Omit<\n FormFieldPropsByType[\n ValidFormFieldForPropertyType<\n FieldDescriptorType<Q, K>\n >\n ],\n \"value\" | \"onChange\"\n >;\n}\n\ntype ValidationError = { type: ValidationRule; error: string };\n\ntype ValidationRule =\n | \"required\"\n | \"min\"\n | \"max\"\n | \"minLength\"\n | \"maxLength\"\n | \"pattern\"\n | \"validate\";\n\n/**\n * Maps field types to their corresponding props\n */\nexport interface FormFieldPropsByType {\n DATETIME_PICKER: DatetimePickerFieldProps;\n DROPDOWN: DropdownFieldProps<unknown, boolean>;\n FILE_PICKER: FilePickerProps;\n NUMBER_INPUT: NumberInputFieldProps;\n OBJECT_SET: ObjectSetFieldProps<ObjectTypeDefinition>;\n RADIO_BUTTONS: RadioButtonsFieldProps<unknown>;\n TEXT_AREA: TextAreaFieldProps;\n TEXT_INPUT: TextInputFieldProps;\n CUSTOM: CustomFieldProps<unknown>;\n}\n\n/**\n * Datetime picker field props.\n *\n * When `formatDate` is omitted, ISO-like format is used (YYYY-MM-DD / YYYY-MM-DD HH:mm).\n */\nexport interface DatetimePickerFieldProps extends BaseFormFieldProps<Date> {\n /**\n * The earliest date the user can select.\n * If provided, this will be added to the field validation.\n */\n min?: Date;\n\n /**\n * The latest date the user can select.\n * If provided, this will be added to the field validation.\n */\n max?: Date;\n\n /**\n * Whether to show time picker.\n */\n showTime?: boolean;\n\n /**\n * Whether to close the popover after selecting a date.\n * @default true when `showTime` is false, false when `showTime` is true\n */\n closeOnSelection?: boolean;\n\n /**\n * Placeholder text shown when no value is selected.\n */\n placeholder?: string;\n\n /** Formats a Date for display in the trigger button. */\n formatDate?: (date: Date) => string;\n}\n\n/**\n * Dropdown field props with selectable items\n */\nexport interface DropdownFieldProps<V, Multiple extends boolean = false>\n extends BaseFormFieldProps<Multiple extends true ? V[] : V>\n{\n /**\n * Available items for the dropdown\n */\n items: V[];\n\n /**\n * Converts an item to a display string. Defaults to `String()`.\n */\n itemToStringLabel?: (item: V) => string;\n\n /**\n * Returns a unique string key for a list item. Used as the React `key`.\n * Falls back to the item's index when not provided.\n */\n itemToKey?: (item: V) => string;\n\n /**\n * Custom equality check for item values. Defaults to `Object.is`.\n * Required when items are objects to ensure correct selection matching.\n */\n isItemEqual?: (a: V, b: V) => boolean;\n\n /**\n * Whether the dropdown allows searching/filtering.\n * When true, renders a Combobox with a search input.\n * When false (default), renders a Select dropdown.\n */\n isSearchable?: boolean;\n\n /**\n * Placeholder text shown when no value is selected.\n */\n placeholder?: string;\n\n /**\n * Whether multiple values can be selected\n */\n isMultiple?: Multiple;\n}\n\nexport interface FilePickerProps extends BaseFormFieldProps<File | File[]> {\n /**\n * Whether multiple files can be selected\n */\n isMulti?: boolean;\n\n /**\n * Accepted file types (e.g., \"image/*\", \".pdf\")\n */\n accept?: string | string[];\n\n /**\n * Maximum file size in bytes\n */\n maxSize?: number;\n}\n\n/**\n * Text area field props\n */\nexport interface TextAreaFieldProps extends\n BaseFormFieldProps<string>,\n Pick<\n React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n | \"rows\"\n | \"wrap\"\n /**\n * If provided, this will be added to the field validation\n */\n | \"minLength\"\n /**\n * If provided, this will be added to the field validation\n */\n | \"maxLength\"\n >\n{\n placeholder?: string;\n}\n\nexport interface TextInputFieldProps extends\n BaseFormFieldProps<string>,\n Pick<\n React.InputHTMLAttributes<HTMLInputElement>,\n /**\n * If provided, this will be added to the field validation\n */\n | \"minLength\"\n /**\n * If provided, this will be added to the field validation\n */\n | \"maxLength\"\n >\n{\n placeholder?: string;\n}\n\n/**\n * Number input field props\n */\nexport interface NumberInputFieldProps extends BaseFormFieldProps<number> {\n /**\n * Minimum allowed value.\n */\n min?: number;\n\n /**\n * Maximum allowed value.\n */\n max?: number;\n\n /**\n * Step increment for the input. Used by the stepper buttons and ArrowUp/ArrowDown keyboard stepping.\n *\n * @default 1\n */\n step?: number;\n\n /**\n * Placeholder text shown when the input is empty.\n */\n placeholder?: string;\n}\n\n/**\n * Radio buttons field props\n */\nexport interface RadioButtonsFieldProps<V> extends BaseFormFieldProps<V> {\n /**\n * Available options for radio buttons.\n *\n * Values are compared by reference equality (`===`). When options contain\n * non-primitive values, pass the same object references for `value` and\n * the corresponding option entry.\n */\n options: Option<V>[];\n}\n\n/**\n * Option interface for radio button options\n */\nexport interface Option<V> {\n label: string;\n value: V;\n}\n\n/**\n * Object set field displays the summary of the count of the given object set\n */\nexport interface ObjectSetFieldProps<T extends ObjectTypeDefinition>\n extends BaseFormFieldProps<ObjectSet<T>>\n{}\n\n/**\n * Custom field props for user-defined renderers\n */\nexport interface CustomFieldProps<V> extends BaseFormFieldProps<V> {\n /**\n * Custom renderer function\n */\n customRenderer: (props: BaseFormFieldProps<V>) => React.ReactNode;\n}\n\nexport interface BaseFormFieldProps<V> {\n /**\n * The HTML `id` attribute for the field input element.\n * Used for `<label htmlFor>` association.\n */\n id?: string;\n\n /**\n * The value of the form field\n */\n value: V | null;\n /**\n * Called when the field value changes.\n *\n * ActionForm internally wraps this to pass the key to `onFieldValueChange`:\n * ```\n * <DropdownField\n * {...fieldDef}\n * onChange={(value) => onFieldValueChange(fieldDef.key, value)}\n * />\n * ```\n *\n * @param value The new value of the form field\n */\n onChange?: (value: V | null) => void;\n}\n\nexport type FieldKey<Q extends ActionDefinition<unknown>> =\n keyof ActionParameters<Q>;\n\n/**\n * Extracts parameters from an ActionDefinition\n */\nexport type ActionParameters<Q extends ActionDefinition<unknown>> =\n CompileTimeMetadata<Q>[\"parameters\"];\n\n/**\n * Extracts the value type for a specific parameter\n *\n * TODO: Re-use `BaseType`\n */\nexport type FieldValueType<\n Q extends ActionDefinition<unknown>,\n K extends keyof ActionParameters<Q> = keyof ActionParameters<Q>,\n> = ActionParameters<Q>[K][\"type\"] extends\n ActionMetadata.DataType.Object<infer T> ? ActionParam.ObjectType<T>\n : ActionParameters<Q>[K][\"type\"] extends ActionMetadata.DataType.ObjectSet<\n infer T\n > ? ActionParam.ObjectSetType<T>\n : ActionParameters<Q>[K][\"type\"] extends ActionMetadata.DataType.Struct<\n infer T\n > ? ActionParam.StructType<T>\n : ActionParameters<Q>[K][\"type\"] extends keyof DataValueClientToWire\n ? DataValueClientToWire[ActionParameters<Q>[K][\"type\"]]\n : never;\n\n/**\n * Extracts the parameter type descriptor for a specific action parameter.\n */\nexport type FieldDescriptorType<\n Q extends ActionDefinition<unknown> = ActionDefinition<unknown>,\n K extends keyof ActionParameters<Q> = keyof ActionParameters<Q>,\n> = ActionParameters<Q>[K][\"type\"];\n\n/**\n * Available form field component types\n */\nexport type FieldComponent =\n | \"DATETIME_PICKER\"\n | \"DROPDOWN\"\n | \"FILE_PICKER\"\n | \"NUMBER_INPUT\"\n | \"RADIO_BUTTONS\"\n | \"OBJECT_SET\"\n | \"TEXT_AREA\"\n | \"TEXT_INPUT\"\n | \"CUSTOM\";\n\n/**\n * Describes the data type of a form field, independent of OSDK.\n * Mirrors ActionMetadata.DataType to keep the rendering layer OSDK-agnostic.\n */\nexport type FieldType =\n | \"boolean\"\n | \"string\"\n | \"integer\"\n | \"long\"\n | \"double\"\n | \"datetime\"\n | \"timestamp\"\n | \"attachment\"\n | \"marking\"\n | \"mediaReference\"\n | \"objectType\"\n | \"geoshape\"\n | \"geohash\"\n | { type: \"object\"; object: string }\n | { type: \"objectSet\"; objectSet: string }\n | { type: \"interface\"; interface: string }\n | { type: \"struct\"; struct: Record<string, string> };\n\n/**\n * An OSDK-agnostic field definition used by BaseForm and FormFieldRenderer.\n * Contains only the information needed to render a single field — no generics,\n * no compile-time parameter constraints.\n *\n * Implemented as a distributed mapped type: switching on `fieldComponent`\n * narrows `fieldComponentProps` to the correct props type automatically.\n */\nexport type RendererFieldDefinition = {\n [K in FieldComponent]: {\n fieldKey: string;\n fieldComponent: K;\n fieldType?: FieldType;\n label: string;\n defaultValue?: unknown;\n isRequired?: boolean;\n placeholder?: string;\n helperText?: string;\n helperTextPlacement?: \"bottom\" | \"tooltip\";\n fieldComponentProps: Omit<FormFieldPropsByType[K], \"value\" | \"onChange\">;\n };\n}[FieldComponent];\n\n/**\n * Gets valid form field types for a given property type\n */\nexport type ValidFormFieldForPropertyType<P extends FieldDescriptorType> =\n P extends \"objectSet\" ? \"OBJECT_SET\"\n : P extends \"object\" ? \"DROPDOWN\"\n : P extends \"mediaReference\" | \"attachment\" ? \"FILE_PICKER\"\n : P extends \"boolean\" ? \"RADIO_BUTTONS\" | \"DROPDOWN\"\n : P extends \"string\" ? \"TEXT_INPUT\" | \"TEXT_AREA\"\n : P extends \"datetime\" | \"timestamp\" ? \"DATETIME_PICKER\"\n : P extends\n | \"double\"\n | \"integer\"\n | \"long\"\n | \"float\"\n | \"short\"\n | \"byte\"\n | \"decimal\" ? \"NUMBER_INPUT\"\n : never;\n"],"mappings":"","ignoreList":[]}
|
|
@@ -20,6 +20,7 @@ import { FormField } from "../FormField.js";
|
|
|
20
20
|
import { CustomField } from "./CustomField.js";
|
|
21
21
|
import { DatetimePickerField } from "./DatetimePickerField.js";
|
|
22
22
|
import { DropdownField } from "./DropdownField.js";
|
|
23
|
+
import { NumberInputField } from "./NumberInputField.js";
|
|
23
24
|
import { RadioButtonsField } from "./RadioButtonsField.js";
|
|
24
25
|
import { TextAreaField } from "./TextAreaField.js";
|
|
25
26
|
import { TextInputField } from "./TextInputField.js";
|
|
@@ -87,6 +88,13 @@ function renderFieldComponent(fieldDefinition, value, onChange) {
|
|
|
87
88
|
onChange: onChange
|
|
88
89
|
}, fieldDefinition.fieldComponentProps));
|
|
89
90
|
case "NUMBER_INPUT":
|
|
91
|
+
// TODO: Use coerceFieldValue
|
|
92
|
+
return /*#__PURE__*/React.createElement(NumberInputField, _extends({
|
|
93
|
+
id: fieldDefinition.fieldKey,
|
|
94
|
+
value: typeof value === "number" ? value : null,
|
|
95
|
+
onChange: onChange,
|
|
96
|
+
placeholder: fieldDefinition.placeholder
|
|
97
|
+
}, fieldDefinition.fieldComponentProps));
|
|
90
98
|
case "FILE_PICKER":
|
|
91
99
|
case "OBJECT_SET":
|
|
92
100
|
return /*#__PURE__*/React.createElement("div", null, "Unsupported field type: ", fieldDefinition.fieldComponent);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormFieldRenderer.js","names":["React","memo","FormField","CustomField","DatetimePickerField","DropdownField","RadioButtonsField","TextAreaField","TextInputField","FormFieldRenderer","fieldDefinition","value","onFieldValueChange","label","isRequired","helperText","helperTextPlacement","createElement","fieldKey","undefined","renderFieldComponent","onChange","fieldComponent","_extends","id","String","placeholder","fieldComponentProps","Date","assertUnreachableFieldComponent","Error"],"sources":["FormFieldRenderer.tsx"],"sourcesContent":["/*\n * Copyright 2026 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { memo } from \"react\";\nimport { FormField } from \"../FormField.js\";\nimport type { RendererFieldDefinition } from \"../FormFieldApi.js\";\nimport { CustomField } from \"./CustomField.js\";\nimport { DatetimePickerField } from \"./DatetimePickerField.js\";\nimport { DropdownField } from \"./DropdownField.js\";\nimport { RadioButtonsField } from \"./RadioButtonsField.js\";\nimport { TextAreaField } from \"./TextAreaField.js\";\nimport { TextInputField } from \"./TextInputField.js\";\n\nexport interface FormFieldRendererProps {\n fieldDefinition: RendererFieldDefinition;\n value: unknown;\n onFieldValueChange: (value: unknown) => void;\n}\n\nexport const FormFieldRenderer: React.FC<FormFieldRendererProps> = memo(\n function FormFieldRendererFn({\n fieldDefinition,\n value,\n onFieldValueChange,\n }: FormFieldRendererProps): React.ReactElement {\n const { label, isRequired, helperText, helperTextPlacement } =\n fieldDefinition;\n\n return (\n <FormField\n label={label}\n isRequired={isRequired}\n fieldKey={fieldDefinition.fieldKey}\n helperText={helperTextPlacement !== \"tooltip\" ? helperText : undefined}\n >\n {renderFieldComponent(fieldDefinition, value, onFieldValueChange)}\n </FormField>\n );\n },\n);\n\nfunction renderFieldComponent(\n fieldDefinition: RendererFieldDefinition,\n value: unknown,\n onChange: (value: unknown) => void,\n): React.ReactElement {\n switch (fieldDefinition.fieldComponent) {\n case \"TEXT_INPUT\":\n return (\n <TextInputField\n id={fieldDefinition.fieldKey}\n value={value != null ? String(value) : \"\"}\n onChange={onChange}\n placeholder={fieldDefinition.placeholder}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n case \"TEXT_AREA\":\n return (\n <TextAreaField\n id={fieldDefinition.fieldKey}\n value={value != null ? String(value) : \"\"}\n onChange={onChange}\n placeholder={fieldDefinition.placeholder}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n case \"DROPDOWN\": {\n return (\n <DropdownField\n value={value}\n onChange={onChange}\n placeholder={fieldDefinition.placeholder}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n }\n case \"DATETIME_PICKER\":\n return (\n <DatetimePickerField\n id={fieldDefinition.fieldKey}\n placeholder={fieldDefinition.placeholder}\n // TODO: Use coerceFieldValue\n value={value instanceof Date ? value : null}\n onChange={onChange}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n case \"RADIO_BUTTONS\":\n return (\n <RadioButtonsField\n id={fieldDefinition.fieldKey}\n value={value}\n onChange={onChange}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n case \"CUSTOM\":\n return (\n <CustomField\n id={fieldDefinition.fieldKey}\n value={value}\n onChange={onChange}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n case \"NUMBER_INPUT\":\n case \"FILE_PICKER\":\n case \"OBJECT_SET\":\n return <div>Unsupported field type: {fieldDefinition.fieldComponent}\n </div>;\n default:\n return assertUnreachableFieldComponent(fieldDefinition);\n }\n}\n\nfunction assertUnreachableFieldComponent(value: never): never {\n throw new Error(`Unhandled field component: ${String(value)}`);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,KAAK,IAAIC,IAAI,QAAQ,OAAO;AACnC,SAASC,SAAS,QAAQ,iBAAiB;AAE3C,SAASC,WAAW,QAAQ,kBAAkB;AAC9C,SAASC,mBAAmB,QAAQ,0BAA0B;AAC9D,SAASC,aAAa,QAAQ,oBAAoB;AAClD,SAASC,iBAAiB,QAAQ,wBAAwB;AAC1D,SAASC,aAAa,QAAQ,oBAAoB;AAClD,SAASC,cAAc,QAAQ,qBAAqB;AAQpD,OAAO,MAAMC,iBAAmD,
|
|
1
|
+
{"version":3,"file":"FormFieldRenderer.js","names":["React","memo","FormField","CustomField","DatetimePickerField","DropdownField","NumberInputField","RadioButtonsField","TextAreaField","TextInputField","FormFieldRenderer","fieldDefinition","value","onFieldValueChange","label","isRequired","helperText","helperTextPlacement","createElement","fieldKey","undefined","renderFieldComponent","onChange","fieldComponent","_extends","id","String","placeholder","fieldComponentProps","Date","assertUnreachableFieldComponent","Error"],"sources":["FormFieldRenderer.tsx"],"sourcesContent":["/*\n * Copyright 2026 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { memo } from \"react\";\nimport { FormField } from \"../FormField.js\";\nimport type { RendererFieldDefinition } from \"../FormFieldApi.js\";\nimport { CustomField } from \"./CustomField.js\";\nimport { DatetimePickerField } from \"./DatetimePickerField.js\";\nimport { DropdownField } from \"./DropdownField.js\";\nimport { NumberInputField } from \"./NumberInputField.js\";\nimport { RadioButtonsField } from \"./RadioButtonsField.js\";\nimport { TextAreaField } from \"./TextAreaField.js\";\nimport { TextInputField } from \"./TextInputField.js\";\n\nexport interface FormFieldRendererProps {\n fieldDefinition: RendererFieldDefinition;\n value: unknown;\n onFieldValueChange: (value: unknown) => void;\n}\n\nexport const FormFieldRenderer: React.FC<FormFieldRendererProps> = memo(\n function FormFieldRendererFn({\n fieldDefinition,\n value,\n onFieldValueChange,\n }: FormFieldRendererProps): React.ReactElement {\n const { label, isRequired, helperText, helperTextPlacement } =\n fieldDefinition;\n\n return (\n <FormField\n label={label}\n isRequired={isRequired}\n fieldKey={fieldDefinition.fieldKey}\n helperText={helperTextPlacement !== \"tooltip\" ? helperText : undefined}\n >\n {renderFieldComponent(fieldDefinition, value, onFieldValueChange)}\n </FormField>\n );\n },\n);\n\nfunction renderFieldComponent(\n fieldDefinition: RendererFieldDefinition,\n value: unknown,\n onChange: (value: unknown) => void,\n): React.ReactElement {\n switch (fieldDefinition.fieldComponent) {\n case \"TEXT_INPUT\":\n return (\n <TextInputField\n id={fieldDefinition.fieldKey}\n value={value != null ? String(value) : \"\"}\n onChange={onChange}\n placeholder={fieldDefinition.placeholder}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n case \"TEXT_AREA\":\n return (\n <TextAreaField\n id={fieldDefinition.fieldKey}\n value={value != null ? String(value) : \"\"}\n onChange={onChange}\n placeholder={fieldDefinition.placeholder}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n case \"DROPDOWN\": {\n return (\n <DropdownField\n value={value}\n onChange={onChange}\n placeholder={fieldDefinition.placeholder}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n }\n case \"DATETIME_PICKER\":\n return (\n <DatetimePickerField\n id={fieldDefinition.fieldKey}\n placeholder={fieldDefinition.placeholder}\n // TODO: Use coerceFieldValue\n value={value instanceof Date ? value : null}\n onChange={onChange}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n case \"RADIO_BUTTONS\":\n return (\n <RadioButtonsField\n id={fieldDefinition.fieldKey}\n value={value}\n onChange={onChange}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n case \"CUSTOM\":\n return (\n <CustomField\n id={fieldDefinition.fieldKey}\n value={value}\n onChange={onChange}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n case \"NUMBER_INPUT\":\n // TODO: Use coerceFieldValue\n return (\n <NumberInputField\n id={fieldDefinition.fieldKey}\n value={typeof value === \"number\" ? value : null}\n onChange={onChange}\n placeholder={fieldDefinition.placeholder}\n {...fieldDefinition.fieldComponentProps}\n />\n );\n case \"FILE_PICKER\":\n case \"OBJECT_SET\":\n return <div>Unsupported field type: {fieldDefinition.fieldComponent}\n </div>;\n default:\n return assertUnreachableFieldComponent(fieldDefinition);\n }\n}\n\nfunction assertUnreachableFieldComponent(value: never): never {\n throw new Error(`Unhandled field component: ${String(value)}`);\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,130 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Copyright 2026 Palantir Technologies, Inc. All rights reserved.
|
|
3
|
+
*
|
|
4
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
+
* you may not use this file except in compliance with the License.
|
|
6
|
+
* You may obtain a copy of the License at
|
|
7
|
+
*
|
|
8
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
+
*
|
|
10
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
+
* See the License for the specific language governing permissions and
|
|
14
|
+
* limitations under the License.
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
import { Button } from "@base-ui/react/button";
|
|
18
|
+
import { Input } from "@base-ui/react/input";
|
|
19
|
+
import { ChevronDown, ChevronUp } from "@blueprintjs/icons";
|
|
20
|
+
import React, { useCallback, useRef, useState } from "react";
|
|
21
|
+
import styles from "./NumberInputField.module.css";
|
|
22
|
+
|
|
23
|
+
/**
|
|
24
|
+
* Structural regex for valid numeric input.
|
|
25
|
+
*
|
|
26
|
+
* Allows intermediate typing states that will become valid numbers:
|
|
27
|
+
* "" — user cleared the field (all groups are optional)
|
|
28
|
+
* "-" — user started typing a negative number
|
|
29
|
+
* "." — user started typing a decimal like ".5"
|
|
30
|
+
* "+" — user started typing an explicitly positive number
|
|
31
|
+
* "1.", "1e", "1e+" — partial but structurally valid
|
|
32
|
+
*
|
|
33
|
+
* Rejects obviously invalid strings like "1.2.3" or "+-5".
|
|
34
|
+
*/
|
|
35
|
+
const VALID_NUMERIC_REGEX = /^[+-.]?(\d+\.?\d*|\d*\.?\d+)?([eE][+-]?\d*)?$/;
|
|
36
|
+
const DEFAULT_STEP = 1;
|
|
37
|
+
const CHEVRON_SIZE = 12;
|
|
38
|
+
|
|
39
|
+
// TODO: Add min/max validation so the field can surface
|
|
40
|
+
// out-of-range errors through the form validation system.
|
|
41
|
+
export function NumberInputField({
|
|
42
|
+
id,
|
|
43
|
+
value,
|
|
44
|
+
onChange,
|
|
45
|
+
placeholder,
|
|
46
|
+
min: _min,
|
|
47
|
+
max: _max,
|
|
48
|
+
step
|
|
49
|
+
}) {
|
|
50
|
+
const [displayValue, setDisplayValue] = useState(() => formatNumberForDisplay(value));
|
|
51
|
+
const prevValueRef = useRef(value);
|
|
52
|
+
|
|
53
|
+
// Sync external value → internal display string
|
|
54
|
+
if (prevValueRef.current !== value) {
|
|
55
|
+
prevValueRef.current = value;
|
|
56
|
+
const currentParsed = parseNumericValue(displayValue);
|
|
57
|
+
if (value !== currentParsed) {
|
|
58
|
+
setDisplayValue(formatNumberForDisplay(value));
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
const handleValueChange = useCallback(newValue => {
|
|
62
|
+
if (!isValidInput(newValue)) {
|
|
63
|
+
return;
|
|
64
|
+
}
|
|
65
|
+
setDisplayValue(newValue);
|
|
66
|
+
onChange?.(parseNumericValue(newValue));
|
|
67
|
+
}, [onChange]);
|
|
68
|
+
const applyStep = useCallback(direction => {
|
|
69
|
+
const current = parseNumericValue(displayValue) ?? 0;
|
|
70
|
+
const next = current + direction * (step ?? DEFAULT_STEP);
|
|
71
|
+
const formatted = formatNumberForDisplay(next);
|
|
72
|
+
setDisplayValue(formatted);
|
|
73
|
+
onChange?.(next);
|
|
74
|
+
}, [displayValue, onChange, step]);
|
|
75
|
+
const handleKeyDown = useCallback(e => {
|
|
76
|
+
if (e.key !== "ArrowUp" && e.key !== "ArrowDown") {
|
|
77
|
+
return;
|
|
78
|
+
}
|
|
79
|
+
e.preventDefault();
|
|
80
|
+
applyStep(e.key === "ArrowUp" ? 1 : -1);
|
|
81
|
+
}, [applyStep]);
|
|
82
|
+
const handleStepUp = useCallback(() => {
|
|
83
|
+
applyStep(1);
|
|
84
|
+
}, [applyStep]);
|
|
85
|
+
const handleStepDown = useCallback(() => {
|
|
86
|
+
applyStep(-1);
|
|
87
|
+
}, [applyStep]);
|
|
88
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
89
|
+
className: styles.osdkNumberInputWrapper
|
|
90
|
+
}, /*#__PURE__*/React.createElement(Input, {
|
|
91
|
+
id: id,
|
|
92
|
+
className: styles.osdkNumberInputField,
|
|
93
|
+
type: "text",
|
|
94
|
+
inputMode: "decimal",
|
|
95
|
+
value: displayValue,
|
|
96
|
+
onValueChange: handleValueChange,
|
|
97
|
+
onKeyDown: handleKeyDown,
|
|
98
|
+
placeholder: placeholder
|
|
99
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
100
|
+
className: styles.osdkNumberInputStepper
|
|
101
|
+
}, /*#__PURE__*/React.createElement(Button, {
|
|
102
|
+
className: styles.osdkNumberInputStepButton,
|
|
103
|
+
"aria-label": "Increment",
|
|
104
|
+
tabIndex: -1,
|
|
105
|
+
onClick: handleStepUp
|
|
106
|
+
}, /*#__PURE__*/React.createElement(ChevronUp, {
|
|
107
|
+
size: CHEVRON_SIZE
|
|
108
|
+
})), /*#__PURE__*/React.createElement(Button, {
|
|
109
|
+
className: styles.osdkNumberInputStepButton,
|
|
110
|
+
"aria-label": "Decrement",
|
|
111
|
+
tabIndex: -1,
|
|
112
|
+
onClick: handleStepDown
|
|
113
|
+
}, /*#__PURE__*/React.createElement(ChevronDown, {
|
|
114
|
+
size: CHEVRON_SIZE
|
|
115
|
+
}))));
|
|
116
|
+
}
|
|
117
|
+
function isValidInput(text) {
|
|
118
|
+
return VALID_NUMERIC_REGEX.test(text);
|
|
119
|
+
}
|
|
120
|
+
function parseNumericValue(text) {
|
|
121
|
+
if (text === "") {
|
|
122
|
+
return null;
|
|
123
|
+
}
|
|
124
|
+
const parsed = Number(text);
|
|
125
|
+
return Number.isNaN(parsed) ? null : parsed;
|
|
126
|
+
}
|
|
127
|
+
function formatNumberForDisplay(value) {
|
|
128
|
+
return value != null ? String(value) : "";
|
|
129
|
+
}
|
|
130
|
+
//# sourceMappingURL=NumberInputField.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NumberInputField.js","names":["Button","Input","ChevronDown","ChevronUp","React","useCallback","useRef","useState","styles","VALID_NUMERIC_REGEX","DEFAULT_STEP","CHEVRON_SIZE","NumberInputField","id","value","onChange","placeholder","min","_min","max","_max","step","displayValue","setDisplayValue","formatNumberForDisplay","prevValueRef","current","currentParsed","parseNumericValue","handleValueChange","newValue","isValidInput","applyStep","direction","next","formatted","handleKeyDown","e","key","preventDefault","handleStepUp","handleStepDown","createElement","className","osdkNumberInputWrapper","osdkNumberInputField","type","inputMode","onValueChange","onKeyDown","osdkNumberInputStepper","osdkNumberInputStepButton","tabIndex","onClick","size","text","test","parsed","Number","isNaN","String"],"sources":["NumberInputField.tsx"],"sourcesContent":["/*\n * Copyright 2026 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Button } from \"@base-ui/react/button\";\nimport { Input } from \"@base-ui/react/input\";\nimport { ChevronDown, ChevronUp } from \"@blueprintjs/icons\";\nimport React, { useCallback, useRef, useState } from \"react\";\nimport type { NumberInputFieldProps } from \"../FormFieldApi.js\";\nimport styles from \"./NumberInputField.module.css\";\n\n/**\n * Structural regex for valid numeric input.\n *\n * Allows intermediate typing states that will become valid numbers:\n * \"\" — user cleared the field (all groups are optional)\n * \"-\" — user started typing a negative number\n * \".\" — user started typing a decimal like \".5\"\n * \"+\" — user started typing an explicitly positive number\n * \"1.\", \"1e\", \"1e+\" — partial but structurally valid\n *\n * Rejects obviously invalid strings like \"1.2.3\" or \"+-5\".\n */\nconst VALID_NUMERIC_REGEX = /^[+-.]?(\\d+\\.?\\d*|\\d*\\.?\\d+)?([eE][+-]?\\d*)?$/;\n\nconst DEFAULT_STEP = 1;\nconst CHEVRON_SIZE = 12;\n\n// TODO: Add min/max validation so the field can surface\n// out-of-range errors through the form validation system.\nexport function NumberInputField({\n id,\n value,\n onChange,\n placeholder,\n min: _min,\n max: _max,\n step,\n}: NumberInputFieldProps): React.ReactElement {\n const [displayValue, setDisplayValue] = useState<string>(() =>\n formatNumberForDisplay(value)\n );\n\n const prevValueRef = useRef(value);\n\n // Sync external value → internal display string\n if (prevValueRef.current !== value) {\n prevValueRef.current = value;\n const currentParsed = parseNumericValue(displayValue);\n\n if (value !== currentParsed) {\n setDisplayValue(formatNumberForDisplay(value));\n }\n }\n\n const handleValueChange = useCallback(\n (newValue: string) => {\n if (!isValidInput(newValue)) {\n return;\n }\n\n setDisplayValue(newValue);\n onChange?.(parseNumericValue(newValue));\n },\n [onChange],\n );\n\n const applyStep = useCallback(\n (direction: 1 | -1) => {\n const current = parseNumericValue(displayValue) ?? 0;\n const delta = direction * (step ?? DEFAULT_STEP);\n const next = current + delta;\n const formatted = formatNumberForDisplay(next);\n setDisplayValue(formatted);\n onChange?.(next);\n },\n [displayValue, onChange, step],\n );\n\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key !== \"ArrowUp\" && e.key !== \"ArrowDown\") {\n return;\n }\n e.preventDefault();\n applyStep(e.key === \"ArrowUp\" ? 1 : -1);\n },\n [applyStep],\n );\n\n const handleStepUp = useCallback(() => {\n applyStep(1);\n }, [applyStep]);\n\n const handleStepDown = useCallback(() => {\n applyStep(-1);\n }, [applyStep]);\n\n return (\n <div className={styles.osdkNumberInputWrapper}>\n <Input\n id={id}\n className={styles.osdkNumberInputField}\n type=\"text\"\n inputMode=\"decimal\"\n value={displayValue}\n onValueChange={handleValueChange}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n />\n <div className={styles.osdkNumberInputStepper}>\n <Button\n className={styles.osdkNumberInputStepButton}\n aria-label=\"Increment\"\n tabIndex={-1}\n onClick={handleStepUp}\n >\n <ChevronUp size={CHEVRON_SIZE} />\n </Button>\n <Button\n className={styles.osdkNumberInputStepButton}\n aria-label=\"Decrement\"\n tabIndex={-1}\n onClick={handleStepDown}\n >\n <ChevronDown size={CHEVRON_SIZE} />\n </Button>\n </div>\n </div>\n );\n}\n\nfunction isValidInput(text: string): boolean {\n return VALID_NUMERIC_REGEX.test(text);\n}\n\nfunction parseNumericValue(text: string): number | null {\n if (text === \"\") {\n return null;\n }\n const parsed = Number(text);\n return Number.isNaN(parsed) ? null : parsed;\n}\n\nfunction formatNumberForDisplay(value: number | null): string {\n return value != null ? String(value) : \"\";\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Copyright 2026 Palantir Technologies, Inc. All rights reserved.
|
|
3
|
+
*
|
|
4
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
+
* you may not use this file except in compliance with the License.
|
|
6
|
+
* You may obtain a copy of the License at
|
|
7
|
+
*
|
|
8
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
+
*
|
|
10
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
+
* See the License for the specific language governing permissions and
|
|
14
|
+
* limitations under the License.
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
.osdkNumberInputWrapper {
|
|
18
|
+
display: flex;
|
|
19
|
+
border-radius: var(--osdk-input-border-radius);
|
|
20
|
+
border: var(--osdk-input-border-width) solid var(--osdk-input-border-color);
|
|
21
|
+
background-color: var(--osdk-input-bg);
|
|
22
|
+
transition:
|
|
23
|
+
background-color var(--osdk-input-transition-duration)
|
|
24
|
+
var(--osdk-input-transition-ease),
|
|
25
|
+
border-color var(--osdk-input-transition-duration)
|
|
26
|
+
var(--osdk-input-transition-ease);
|
|
27
|
+
|
|
28
|
+
&:hover {
|
|
29
|
+
background-color: var(--osdk-input-bg-hover);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
&:focus-within {
|
|
33
|
+
outline: var(--osdk-input-focus-width) solid var(--osdk-input-focus-color);
|
|
34
|
+
outline-offset: var(--osdk-input-focus-offset);
|
|
35
|
+
border-color: var(--osdk-input-border-color-focus);
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.osdkNumberInputField {
|
|
40
|
+
flex: 1;
|
|
41
|
+
min-width: 0;
|
|
42
|
+
min-height: var(--osdk-input-min-height);
|
|
43
|
+
padding: var(--osdk-input-padding);
|
|
44
|
+
border: none;
|
|
45
|
+
border-radius: var(--osdk-input-border-radius) 0 0
|
|
46
|
+
var(--osdk-input-border-radius);
|
|
47
|
+
background: transparent;
|
|
48
|
+
color: var(--osdk-input-color);
|
|
49
|
+
font-family: var(--osdk-input-font-family);
|
|
50
|
+
font-size: var(--osdk-input-font-size);
|
|
51
|
+
line-height: var(
|
|
52
|
+
--osdk-input-line-height,
|
|
53
|
+
var(--osdk-typography-line-height-default)
|
|
54
|
+
);
|
|
55
|
+
|
|
56
|
+
&::placeholder {
|
|
57
|
+
color: var(--osdk-input-placeholder-color);
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
&:focus-visible {
|
|
61
|
+
outline: none;
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.osdkNumberInputStepper {
|
|
66
|
+
display: flex;
|
|
67
|
+
flex-direction: column;
|
|
68
|
+
border-left: var(--osdk-input-border-width) solid
|
|
69
|
+
var(--osdk-input-border-color);
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.osdkNumberInputStepButton {
|
|
73
|
+
display: flex;
|
|
74
|
+
align-items: center;
|
|
75
|
+
justify-content: center;
|
|
76
|
+
flex: 1;
|
|
77
|
+
padding: 0 calc(var(--osdk-surface-spacing) * 1.5);
|
|
78
|
+
border: none;
|
|
79
|
+
background: transparent;
|
|
80
|
+
color: var(--osdk-input-color);
|
|
81
|
+
cursor: pointer;
|
|
82
|
+
line-height: 0;
|
|
83
|
+
|
|
84
|
+
&:hover {
|
|
85
|
+
background-color: var(--osdk-input-bg-hover);
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
&:active {
|
|
89
|
+
background-color: var(--osdk-input-border-color);
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
& + & {
|
|
93
|
+
border-top: var(--osdk-input-border-width) solid
|
|
94
|
+
var(--osdk-input-border-color);
|
|
95
|
+
}
|
|
96
|
+
}
|
|
@@ -16,23 +16,27 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
|
|
|
16
16
|
*/
|
|
17
17
|
|
|
18
18
|
import { Checkbox as BaseUICheckbox } from "@base-ui/react/checkbox";
|
|
19
|
-
import { Minus, Tick } from "@blueprintjs/icons";
|
|
19
|
+
import { Cross, Minus, Tick } from "@blueprintjs/icons";
|
|
20
20
|
import classnames from "classnames";
|
|
21
21
|
import React from "react";
|
|
22
22
|
import styles from "./Checkbox.module.css";
|
|
23
23
|
export function Checkbox({
|
|
24
24
|
indeterminate,
|
|
25
25
|
className,
|
|
26
|
+
isExcluding,
|
|
26
27
|
indicatorProps,
|
|
27
28
|
...rest
|
|
28
29
|
}) {
|
|
29
30
|
return /*#__PURE__*/React.createElement(BaseUICheckbox.Root, _extends({
|
|
30
31
|
className: classnames(styles.osdkCheckboxRoot, className),
|
|
31
|
-
indeterminate: indeterminate
|
|
32
|
+
indeterminate: indeterminate,
|
|
33
|
+
"data-excluding": isExcluding || undefined
|
|
32
34
|
}, rest), /*#__PURE__*/React.createElement(BaseUICheckbox.Indicator, _extends({}, indicatorProps, {
|
|
33
35
|
className: classnames(styles.osdkCheckboxIndicator, indicatorProps?.className)
|
|
34
36
|
}), indeterminate ? /*#__PURE__*/React.createElement(Minus, {
|
|
35
37
|
size: 16
|
|
38
|
+
}) : isExcluding ? /*#__PURE__*/React.createElement(Cross, {
|
|
39
|
+
size: 16
|
|
36
40
|
}) : /*#__PURE__*/React.createElement(Tick, {
|
|
37
41
|
size: 16
|
|
38
42
|
})));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.js","names":["Checkbox","BaseUICheckbox","Minus","Tick","classnames","React","styles","indeterminate","className","indicatorProps","rest","createElement","Root","_extends","osdkCheckboxRoot","Indicator","osdkCheckboxIndicator","size"],"sources":["Checkbox.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n Checkbox as BaseUICheckbox,\n type CheckboxIndicatorProps,\n type CheckboxRootProps,\n} from \"@base-ui/react/checkbox\";\nimport { Minus, Tick } from \"@blueprintjs/icons\";\nimport classnames from \"classnames\";\nimport React from \"react\";\nimport styles from \"./Checkbox.module.css\";\n\ninterface CheckboxProps extends Omit<CheckboxRootProps, \"className\"> {\n className?: string;\n indicatorProps?: Omit<CheckboxIndicatorProps, \"className\"> & {\n className?: string;\n };\n}\n\nexport function Checkbox(\n {\n indeterminate,\n className,\n indicatorProps,\n ...rest\n }: CheckboxProps,\n): React.ReactElement {\n return (\n <BaseUICheckbox.Root\n className={classnames(styles.osdkCheckboxRoot, className)}\n indeterminate={indeterminate}\n {...rest}\n >\n <BaseUICheckbox.Indicator\n {...indicatorProps}\n className={classnames(\n styles.osdkCheckboxIndicator,\n indicatorProps?.className,\n )}\n >\n {/* Color is used as the \"fill\" attribute on the svg */}\n {indeterminate\n ?
|
|
1
|
+
{"version":3,"file":"Checkbox.js","names":["Checkbox","BaseUICheckbox","Cross","Minus","Tick","classnames","React","styles","indeterminate","className","isExcluding","indicatorProps","rest","createElement","Root","_extends","osdkCheckboxRoot","undefined","Indicator","osdkCheckboxIndicator","size"],"sources":["Checkbox.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n Checkbox as BaseUICheckbox,\n type CheckboxIndicatorProps,\n type CheckboxRootProps,\n} from \"@base-ui/react/checkbox\";\nimport { Cross, Minus, Tick } from \"@blueprintjs/icons\";\nimport classnames from \"classnames\";\nimport React from \"react\";\nimport styles from \"./Checkbox.module.css\";\n\ninterface CheckboxProps extends Omit<CheckboxRootProps, \"className\"> {\n className?: string;\n isExcluding?: boolean;\n indicatorProps?: Omit<CheckboxIndicatorProps, \"className\"> & {\n className?: string;\n };\n}\n\nexport function Checkbox(\n {\n indeterminate,\n className,\n isExcluding,\n indicatorProps,\n ...rest\n }: CheckboxProps,\n): React.ReactElement {\n return (\n <BaseUICheckbox.Root\n className={classnames(styles.osdkCheckboxRoot, className)}\n indeterminate={indeterminate}\n data-excluding={isExcluding || undefined}\n {...rest}\n >\n <BaseUICheckbox.Indicator\n {...indicatorProps}\n className={classnames(\n styles.osdkCheckboxIndicator,\n indicatorProps?.className,\n )}\n >\n {/* Color is used as the \"fill\" attribute on the svg */}\n {indeterminate\n ? <Minus size={16} />\n : isExcluding\n ? <Cross size={16} />\n : <Tick size={16} />}\n </BaseUICheckbox.Indicator>\n </BaseUICheckbox.Root>\n );\n}\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SACEA,QAAQ,IAAIC,cAAc,QAGrB,yBAAyB;AAChC,SAASC,KAAK,EAAEC,KAAK,EAAEC,IAAI,QAAQ,oBAAoB;AACvD,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,KAAK,MAAM,OAAO;AACzB,OAAOC,MAAM,MAAM,uBAAuB;AAU1C,OAAO,SAASP,QAAQA,CACtB;EACEQ,aAAa;EACbC,SAAS;EACTC,WAAW;EACXC,cAAc;EACd,GAAGC;AACU,CAAC,EACI;EACpB,oBACEN,KAAA,CAAAO,aAAA,CAACZ,cAAc,CAACa,IAAI,EAAAC,QAAA;IAClBN,SAAS,EAAEJ,UAAU,CAACE,MAAM,CAACS,gBAAgB,EAAEP,SAAS,CAAE;IAC1DD,aAAa,EAAEA,aAAc;IAC7B,kBAAgBE,WAAW,IAAIO;EAAU,GACrCL,IAAI,gBAERN,KAAA,CAAAO,aAAA,CAACZ,cAAc,CAACiB,SAAS,EAAAH,QAAA,KACnBJ,cAAc;IAClBF,SAAS,EAAEJ,UAAU,CACnBE,MAAM,CAACY,qBAAqB,EAC5BR,cAAc,EAAEF,SAClB;EAAE,IAGDD,aAAa,gBACVF,KAAA,CAAAO,aAAA,CAACV,KAAK;IAACiB,IAAI,EAAE;EAAG,CAAE,CAAC,GACnBV,WAAW,gBACXJ,KAAA,CAAAO,aAAA,CAACX,KAAK;IAACkB,IAAI,EAAE;EAAG,CAAE,CAAC,gBACnBd,KAAA,CAAAO,aAAA,CAACT,IAAI;IAACgB,IAAI,EAAE;EAAG,CAAE,CACG,CACP,CAAC;AAE1B","ignoreList":[]}
|
|
@@ -18,12 +18,13 @@
|
|
|
18
18
|
display: flex;
|
|
19
19
|
align-items: center;
|
|
20
20
|
justify-content: center;
|
|
21
|
-
|
|
21
|
+
width: calc(
|
|
22
22
|
var(--osdk-checkbox-icon-size) + var(--osdk-checkbox-padding) * 2
|
|
23
23
|
);
|
|
24
|
-
|
|
24
|
+
height: calc(
|
|
25
25
|
var(--osdk-checkbox-icon-size) + var(--osdk-checkbox-padding) * 2
|
|
26
26
|
);
|
|
27
|
+
flex-shrink: 0;
|
|
27
28
|
padding: var(--osdk-checkbox-padding);
|
|
28
29
|
cursor: pointer;
|
|
29
30
|
border-radius: var(--osdk-surface-border-radius);
|
|
@@ -54,6 +55,18 @@
|
|
|
54
55
|
}
|
|
55
56
|
}
|
|
56
57
|
|
|
58
|
+
&[data-excluding][data-checked] {
|
|
59
|
+
background-color: var(--osdk-checkbox-bg-checked);
|
|
60
|
+
|
|
61
|
+
&:hover {
|
|
62
|
+
background-color: var(--osdk-checkbox-bg-checked-hover);
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
&:active {
|
|
66
|
+
background-color: var(--osdk-checkbox-bg-checked-active);
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
|
|
57
70
|
&:focus-visible {
|
|
58
71
|
outline: var(--osdk-focus-outline);
|
|
59
72
|
outline-offset: calc(-1 * var(--osdk-focus-visible-outline-offset));
|
|
@@ -16,7 +16,7 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
|
|
|
16
16
|
*/
|
|
17
17
|
|
|
18
18
|
import { Combobox as BaseUICombobox } from "@base-ui/react/combobox";
|
|
19
|
-
import { Cross, Search } from "@blueprintjs/icons";
|
|
19
|
+
import { Cross, Search, Tick } from "@blueprintjs/icons";
|
|
20
20
|
import classnames from "classnames";
|
|
21
21
|
import React from "react";
|
|
22
22
|
import styles from "./Combobox.module.css";
|
|
@@ -122,6 +122,18 @@ function ComboboxList({
|
|
|
122
122
|
className: classnames(styles.osdkComboboxList, className)
|
|
123
123
|
}, rest), children);
|
|
124
124
|
}
|
|
125
|
+
function ComboboxItemIndicator({
|
|
126
|
+
className,
|
|
127
|
+
children,
|
|
128
|
+
...rest
|
|
129
|
+
}) {
|
|
130
|
+
return /*#__PURE__*/React.createElement(BaseUICombobox.ItemIndicator, _extends({
|
|
131
|
+
className: classnames(styles.osdkComboboxItemIndicator, className),
|
|
132
|
+
keepMounted: true
|
|
133
|
+
}, rest), children ?? /*#__PURE__*/React.createElement(Tick, {
|
|
134
|
+
size: 16
|
|
135
|
+
}));
|
|
136
|
+
}
|
|
125
137
|
export const Combobox = {
|
|
126
138
|
Root: BaseUICombobox.Root,
|
|
127
139
|
SearchInput: ComboboxSearchInput,
|
|
@@ -131,6 +143,7 @@ export const Combobox = {
|
|
|
131
143
|
Popup: ComboboxPopup,
|
|
132
144
|
List: ComboboxList,
|
|
133
145
|
Item: ComboboxItem,
|
|
146
|
+
ItemIndicator: ComboboxItemIndicator,
|
|
134
147
|
Chips: ComboboxChips,
|
|
135
148
|
Chip: ComboboxChip,
|
|
136
149
|
ChipRemove: ComboboxChipRemove,
|