@uniformdev/mesh-sdk-react 20.75.1-alpha.0 → 20.75.1-alpha.11
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/dist/index.d.mts +199 -95
- package/dist/index.d.ts +199 -95
- package/package.json +6 -6
package/dist/index.d.ts
CHANGED
|
@@ -59,16 +59,27 @@ declare function DataResourceDynamicInputProvider(props: DataResourceDynamicInpu
|
|
|
59
59
|
|
|
60
60
|
/**
|
|
61
61
|
* Provides convenient access to the current Uniform Mesh location via React hook.
|
|
62
|
-
* Intended to be used within
|
|
62
|
+
* Intended to be used within `MeshApp`.
|
|
63
63
|
*
|
|
64
64
|
* There are three primary ways to invoke this hook:
|
|
65
65
|
* 1. Without any arguments, this hook will return the current location regardless of its type. The result will be a union of all possible locations you can discriminate between i.e. with an if statement on the `type`
|
|
66
|
-
*
|
|
67
|
-
*
|
|
66
|
+
* @example
|
|
67
|
+
* ```tsx
|
|
68
|
+
* const location = useMeshLocation();
|
|
69
|
+
* if (location.type === 'paramType') {
|
|
70
|
+
* // location is now known to be a paramType
|
|
71
|
+
* }
|
|
72
|
+
* ```
|
|
68
73
|
* 2. With a string argument, this hook will assert that the current location is the expected one and return the correct typings for that location.
|
|
69
|
-
*
|
|
74
|
+
* @example
|
|
75
|
+
* ```tsx
|
|
76
|
+
* const location = useMeshLocation('settings');
|
|
77
|
+
* ```
|
|
70
78
|
* 3. With an explicit generic to set the expected param type data or param type settings data. This is useful because (2) will return unknown as the value type for param types.
|
|
71
|
-
*
|
|
79
|
+
* @example
|
|
80
|
+
* ```tsx
|
|
81
|
+
* const location = useMeshLocation<'paramType', MyParamTypeValueType>();
|
|
82
|
+
* ```
|
|
72
83
|
*
|
|
73
84
|
* You can also combine (2) and (3) to get both explicit value typing and assertion of the location.
|
|
74
85
|
*/
|
|
@@ -514,7 +525,7 @@ type InputVariablesProps<TEditorContext = unknown> = {
|
|
|
514
525
|
* disable it with this prop.
|
|
515
526
|
*/
|
|
516
527
|
disableDismissEditorOnChange?: boolean;
|
|
517
|
-
/** Enables mutliple lines in the input (
|
|
528
|
+
/** Enables mutliple lines in the input (newline characters in the value) */
|
|
518
529
|
multiLine?: boolean;
|
|
519
530
|
/** Disables the inline variable selection menu when rendering a variables input */
|
|
520
531
|
disableInlineMenu?: boolean | 'by-label' | 'by-input';
|
|
@@ -629,7 +640,7 @@ type ParameterVariablesProps<TEditorContext = unknown> = {
|
|
|
629
640
|
/** Sets the test ID of the input */
|
|
630
641
|
'data-testid'?: string;
|
|
631
642
|
/**
|
|
632
|
-
* Enables mutliple lines in the input (
|
|
643
|
+
* Enables mutliple lines in the input (newline characters in the value).
|
|
633
644
|
* If a number is passed, the height of the editor is set to that number of lines and overflow scrolls.
|
|
634
645
|
* If a boolean true is passed, the editor auto-sizes to the content.
|
|
635
646
|
*/
|
|
@@ -812,12 +823,12 @@ declare function variableDefaultTextValue(defaultValue: unknown): string;
|
|
|
812
823
|
|
|
813
824
|
/**
|
|
814
825
|
* Expected prefix for variable expressions
|
|
815
|
-
* @deprecated
|
|
826
|
+
* @deprecated Use the variables binding API instead of string delimiters.
|
|
816
827
|
*/
|
|
817
828
|
declare const variablePrefix = "${";
|
|
818
829
|
/**
|
|
819
830
|
* Expected suffix for variable expressions
|
|
820
|
-
* @deprecated
|
|
831
|
+
* @deprecated Use the variables binding API instead of string delimiters.
|
|
821
832
|
*/
|
|
822
833
|
declare const variableSuffix = "}";
|
|
823
834
|
|
|
@@ -1028,8 +1039,11 @@ type DataRefreshButtonProps = HTMLAttributes<HTMLButtonElement> & {
|
|
|
1028
1039
|
onRefreshData: () => void;
|
|
1029
1040
|
};
|
|
1030
1041
|
/**
|
|
1031
|
-
*
|
|
1032
|
-
* @example
|
|
1042
|
+
* The data refresh button is a UI component to indicate to users a request for data is taking place
|
|
1043
|
+
* @example
|
|
1044
|
+
* ```tsx
|
|
1045
|
+
* <DataRefreshButton buttonText="my button" isLoading />
|
|
1046
|
+
* ```
|
|
1033
1047
|
* @deprecated this component is not recommended for use in new projects
|
|
1034
1048
|
*/
|
|
1035
1049
|
declare const DataRefreshButton: ({ buttonText, isLoading, onRefreshData, ...props }: DataRefreshButtonProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
@@ -1057,8 +1071,11 @@ type ObjectSearchContainerProps = {
|
|
|
1057
1071
|
children?: ReactNode;
|
|
1058
1072
|
};
|
|
1059
1073
|
/**
|
|
1060
|
-
*
|
|
1061
|
-
* @example
|
|
1074
|
+
* Object search container is an opinionated layout for search parameters and retrieved results
|
|
1075
|
+
* @example
|
|
1076
|
+
* ```tsx
|
|
1077
|
+
* <ObjectSearchContainer searchFilters={<>your component</>} resultList={<>your result list component<>} onSave={yourSaveAction} onCancel={yourCancelAction} />
|
|
1078
|
+
* ```
|
|
1062
1079
|
* @deprecated this component is not recommended for use in new projects
|
|
1063
1080
|
*/
|
|
1064
1081
|
declare const ObjectSearchContainer: ({ label, enableDynamicInputToResultId, searchFilters, resultList, children, }: ObjectSearchContainerProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
@@ -1067,11 +1084,11 @@ type ObjectSearchFilterProps = {
|
|
|
1067
1084
|
/** shows or hides the required content type select option */
|
|
1068
1085
|
requireContentType?: boolean;
|
|
1069
1086
|
/** sets the text for the required content type select option
|
|
1070
|
-
* @
|
|
1087
|
+
* @defaultValue 'All content types'
|
|
1071
1088
|
*/
|
|
1072
1089
|
typeSelectorAllTypesOptionText?: string;
|
|
1073
1090
|
/** sets the select input value label text
|
|
1074
|
-
* @
|
|
1091
|
+
* @defaultValue 'Content Type Select'
|
|
1075
1092
|
*/
|
|
1076
1093
|
selectLabel?: string;
|
|
1077
1094
|
/** sets the select input options, if empty - only keyword search field will be rendered */
|
|
@@ -1080,18 +1097,21 @@ type ObjectSearchFilterProps = {
|
|
|
1080
1097
|
value?: string;
|
|
1081
1098
|
}>;
|
|
1082
1099
|
/** sets the search input name value
|
|
1083
|
-
* @
|
|
1100
|
+
* @defaultValue 'searchText'
|
|
1084
1101
|
*/
|
|
1085
1102
|
searchInputName?: string;
|
|
1086
1103
|
/** sets the search input placeholder text
|
|
1087
|
-
* @
|
|
1104
|
+
* @defaultValue 'Enter keyword to narrow your results'
|
|
1088
1105
|
*/
|
|
1089
1106
|
searchInputPlaceholderText?: string;
|
|
1090
1107
|
};
|
|
1091
1108
|
/**
|
|
1092
|
-
*
|
|
1109
|
+
* Object search filter is an opinionated filter that has pre-defined query and setQuery functions
|
|
1093
1110
|
* that can be extended with custom functions
|
|
1094
|
-
* @example
|
|
1111
|
+
* @example
|
|
1112
|
+
* ```tsx
|
|
1113
|
+
* <ObjectSearchFilter selectOptions={[{ id: 'id value', name: 'name value'}]} />
|
|
1114
|
+
* ```
|
|
1095
1115
|
* @deprecated this component is not recommended for use in new projects
|
|
1096
1116
|
*/
|
|
1097
1117
|
declare const ObjectSearchFilter: ({ requireContentType, typeSelectorAllTypesOptionText, searchInputName, searchInputPlaceholderText, selectLabel, selectOptions, }: ObjectSearchFilterProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
@@ -1101,8 +1121,11 @@ type ObjectSearchFilterContainerProps = {
|
|
|
1101
1121
|
children?: React.ReactNode;
|
|
1102
1122
|
};
|
|
1103
1123
|
/**
|
|
1104
|
-
*
|
|
1105
|
-
* @example
|
|
1124
|
+
* an opinionated layout for search filters
|
|
1125
|
+
* @example
|
|
1126
|
+
* ```tsx
|
|
1127
|
+
* <ObjectSearchFilterContainer label="my label"><input type="text" aria-label="my input" /></ObjectSearchFilterContainer>
|
|
1128
|
+
* ```
|
|
1106
1129
|
* @deprecated this component is not recommended for use in new projects
|
|
1107
1130
|
*/
|
|
1108
1131
|
declare const ObjectSearchFilterContainer: ({ children }: ObjectSearchFilterContainerProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
@@ -1112,20 +1135,23 @@ type ObjectSearchResultItemProps = SelectedItemProps & {
|
|
|
1112
1135
|
/** sets additional remove functionality onto of default removal */
|
|
1113
1136
|
onRemove?: () => void;
|
|
1114
1137
|
/** sets whether to show or hide the remove button
|
|
1115
|
-
* @
|
|
1138
|
+
* @defaultValue false
|
|
1116
1139
|
*/
|
|
1117
1140
|
hideRemoveButton?: boolean;
|
|
1118
1141
|
/** sets user defined child nodes that are uncontrolled by Uniform */
|
|
1119
1142
|
children?: ReactNode;
|
|
1120
1143
|
/** disable or enable drag and drop functionality
|
|
1121
|
-
* @
|
|
1144
|
+
* @defaultValue false
|
|
1122
1145
|
*/
|
|
1123
1146
|
disableDnD?: boolean;
|
|
1124
1147
|
onClick?: () => void;
|
|
1125
1148
|
};
|
|
1126
1149
|
/**
|
|
1127
|
-
*
|
|
1128
|
-
* @example
|
|
1150
|
+
* An opinionated result item, best used for selected results
|
|
1151
|
+
* @example
|
|
1152
|
+
* ```tsx
|
|
1153
|
+
* <ObjectSearchResultItem id="my-result" title="title" />
|
|
1154
|
+
* ```
|
|
1129
1155
|
* @deprecated this component is not recommended for use in new projects
|
|
1130
1156
|
*/
|
|
1131
1157
|
declare const ObjectSearchResultItem: ({ id, title, contentType, popoverData, publishStatus, editLinkIcon, editLink, imageUrl, onRemove, createdAt, publishedAt, hideRemoveButton, disableDnD, children, onClick, }: ObjectSearchResultItemProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
@@ -1162,7 +1188,7 @@ type SelectedItemProps<TExtraProps = unknown> = {
|
|
|
1162
1188
|
/** sets the text value of the publish badge */
|
|
1163
1189
|
text: string;
|
|
1164
1190
|
/** sets the theme value of the publish badge
|
|
1165
|
-
* @
|
|
1191
|
+
* @defaultValue 'unimportant'
|
|
1166
1192
|
*/
|
|
1167
1193
|
theme?: BadgeThemeProps;
|
|
1168
1194
|
};
|
|
@@ -1226,21 +1252,27 @@ type ObjectSearchListItemProps = SelectedItemProps & {
|
|
|
1226
1252
|
/** allows authors to add any child component that is not controlled by Uniform */
|
|
1227
1253
|
children?: React$1.ReactNode;
|
|
1228
1254
|
/** sets whether multiple entries can be added to the results list context
|
|
1229
|
-
* @
|
|
1255
|
+
* @defaultValue inherit from context or false
|
|
1230
1256
|
*/
|
|
1231
1257
|
isMulti?: boolean;
|
|
1232
1258
|
/** sets disabled state to the interactive element */
|
|
1233
1259
|
disabled?: boolean;
|
|
1234
1260
|
} & React$1.HTMLAttributes<HTMLDivElement>;
|
|
1235
1261
|
/**
|
|
1236
|
-
*
|
|
1237
|
-
* @example
|
|
1262
|
+
* entry search list item is an opinionated UI component best used for initial retrieved results
|
|
1263
|
+
* @example
|
|
1264
|
+
* ```tsx
|
|
1265
|
+
* <ObjectSearchListItem id="my-result-item" title="title" popoverData={<p>some data info</p>}><div>example of uncontrolled content</div></ObjectSearchListItem>
|
|
1266
|
+
* ```
|
|
1238
1267
|
* @deprecated this component is not recommended for use in new projects
|
|
1239
1268
|
*/
|
|
1240
1269
|
declare const ObjectSearchListItem: ({ id, title, contentType, imageUrl, popoverData, onSelect, isMulti, disabled, children, ...props }: ObjectSearchListItemProps & React$1.HTMLAttributes<HTMLDivElement>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1241
1270
|
/**
|
|
1242
1271
|
* An opinionated loading skeleton component best used with ObjectSearchListItem
|
|
1243
|
-
* @example
|
|
1272
|
+
* @example
|
|
1273
|
+
* ```tsx
|
|
1274
|
+
* <ObjectSearchListItemLoadingSkeleton />
|
|
1275
|
+
* ```
|
|
1244
1276
|
*/
|
|
1245
1277
|
declare const ObjectSearchListItemLoadingSkeleton: () => _emotion_react_jsx_runtime.JSX.Element;
|
|
1246
1278
|
|
|
@@ -1253,22 +1285,28 @@ type ObjectSearchResultItemButtonProps<THtml extends HTMLAttributes<HTMLElement>
|
|
|
1253
1285
|
}>;
|
|
1254
1286
|
} & THtml;
|
|
1255
1287
|
/**
|
|
1256
|
-
*
|
|
1257
|
-
* @example
|
|
1288
|
+
* An opinionated button component best used within the ObjectSearchResultItem component
|
|
1289
|
+
* @example
|
|
1290
|
+
* ```tsx
|
|
1291
|
+
* <ObjectSearchResultItemButton text="button text" icon="/my-image.png" onClick={() => myFunction()} />
|
|
1292
|
+
* ```
|
|
1258
1293
|
* @deprecated this component is not recommended for use in new projects
|
|
1259
1294
|
*/
|
|
1260
1295
|
declare const ObjectSearchResultItemButton: ({ text, icon, ...props }: ObjectSearchResultItemButtonProps<HTMLAttributes<HTMLButtonElement>>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1261
1296
|
/**
|
|
1262
|
-
*
|
|
1297
|
+
* An opinionated link component styled the same of the ObjectSearchResultItemButton component,
|
|
1263
1298
|
* that automatically sets the target and rel attributes. Best used within the ObjectSearchResultItem component
|
|
1264
|
-
* @example
|
|
1299
|
+
* @example
|
|
1300
|
+
* ```tsx
|
|
1301
|
+
* <LinkButton text="link text" icon="/my-image.png" />
|
|
1302
|
+
* ```
|
|
1265
1303
|
* @deprecated this component is not recommended for use in new projects
|
|
1266
1304
|
*/
|
|
1267
1305
|
declare const LinkButton: ({ text, icon, ...props }: ObjectSearchResultItemButtonProps<Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "target" | "rel">>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1268
1306
|
|
|
1269
1307
|
type ObjectSearchResultListProps<TRenderComponent extends SelectedItemProps = SelectedItemProps> = {
|
|
1270
1308
|
/** sets the result label value
|
|
1271
|
-
* @
|
|
1309
|
+
* @defaultValue 'Selected'
|
|
1272
1310
|
*/
|
|
1273
1311
|
resultLabelText?: string;
|
|
1274
1312
|
/** sets and override react node replacing the whole HTML block for the result label and counter */
|
|
@@ -1276,11 +1314,11 @@ type ObjectSearchResultListProps<TRenderComponent extends SelectedItemProps = Se
|
|
|
1276
1314
|
/** sets the on remove button click action */
|
|
1277
1315
|
onRemoveAllSelected?: () => void;
|
|
1278
1316
|
/** sets the remove button text
|
|
1279
|
-
* @
|
|
1317
|
+
* @defaultValue 'Remove all'
|
|
1280
1318
|
*/
|
|
1281
1319
|
removeButtonText?: string;
|
|
1282
1320
|
/** sets whether to show or hide the remove button
|
|
1283
|
-
* @
|
|
1321
|
+
* @defaultValue false
|
|
1284
1322
|
*/
|
|
1285
1323
|
hideRemoveButton?: boolean;
|
|
1286
1324
|
/** allows additional buttons to be added to the result title group */
|
|
@@ -1288,7 +1326,7 @@ type ObjectSearchResultListProps<TRenderComponent extends SelectedItemProps = Se
|
|
|
1288
1326
|
/** allows placing child components within the result list area */
|
|
1289
1327
|
renderResultComponent?: (value: TRenderComponent) => React__default.ReactNode;
|
|
1290
1328
|
/** disable or enable drag and drop functionality
|
|
1291
|
-
* @
|
|
1329
|
+
* @defaultValue false
|
|
1292
1330
|
*/
|
|
1293
1331
|
disableDnD?: boolean;
|
|
1294
1332
|
/** sets the draggable id value */
|
|
@@ -1303,10 +1341,13 @@ type ObjectSearchResultListProps<TRenderComponent extends SelectedItemProps = Se
|
|
|
1303
1341
|
getContainerForDnDReparenting?: () => HTMLElement;
|
|
1304
1342
|
};
|
|
1305
1343
|
/**
|
|
1306
|
-
*
|
|
1307
|
-
* The result item component defaults to
|
|
1344
|
+
* An opinionated result list UI component that has built in drag and drop functionality and removal of all selected items from context.
|
|
1345
|
+
* The result item component defaults to `ObjectSearchResultItem`, however this can be overridden with any other UI component and still
|
|
1308
1346
|
* maintain drag and drop functionality
|
|
1309
|
-
* @example
|
|
1347
|
+
* @example
|
|
1348
|
+
* ```tsx
|
|
1349
|
+
* <ObjectSearchResultList id="my-id" title="title" renderResultComponent={(values) => <CustomComponent {...values} />} />
|
|
1350
|
+
* ```
|
|
1310
1351
|
* @deprecated this component is not recommended for use in new projects
|
|
1311
1352
|
*/
|
|
1312
1353
|
declare function ObjectSearchResultList<TRenderComponent extends SelectedItemProps = SelectedItemProps>({ resultLabelText, removeButtonText, onRemoveAllSelected, hideRemoveButton, resultLabelOverride, additionalButtons, renderResultComponent, multiSelectId, disableDnD, getContainerForDnDReparenting, whenNothingSelected, }: ObjectSearchResultListProps<TRenderComponent>): _emotion_react_jsx_runtime.JSX.Element;
|
|
@@ -1320,23 +1361,22 @@ type QueryFilterSearchProps = {
|
|
|
1320
1361
|
sortOrder: string;
|
|
1321
1362
|
};
|
|
1322
1363
|
type QueryFilterSelectionOptionProps = Array<{
|
|
1323
|
-
/** contains id or machine values
|
|
1364
|
+
/** contains id or machine values; used as the value attribute on HTML option elements */
|
|
1324
1365
|
value?: string;
|
|
1325
|
-
/** Contains human-readable display name for select options.
|
|
1326
|
-
* Used as value in case value is not present <option> */
|
|
1366
|
+
/** Contains human-readable display name for select options. Used as the option label when value is not present. */
|
|
1327
1367
|
label: string;
|
|
1328
1368
|
}>;
|
|
1329
1369
|
type QueryFilterProps<TSelectOptions extends QueryFilterSelectionOptionProps = QueryFilterSelectionOptionProps> = {
|
|
1330
1370
|
/** sets the query filter title
|
|
1331
|
-
* @
|
|
1371
|
+
* @defaultValue 'Configure Query'
|
|
1332
1372
|
*/
|
|
1333
1373
|
queryFilterTitle?: string;
|
|
1334
1374
|
/** sets the content type all selected options label
|
|
1335
|
-
* @
|
|
1375
|
+
* @defaultValue 'All content types'
|
|
1336
1376
|
*/
|
|
1337
1377
|
typeSelectorAllTypesOptionText?: string;
|
|
1338
1378
|
/** sets the content type label value
|
|
1339
|
-
* @
|
|
1379
|
+
* @defaultValue 'Filter by content type'
|
|
1340
1380
|
*/
|
|
1341
1381
|
contentTypeLabel?: string;
|
|
1342
1382
|
/** sets the content type select options */
|
|
@@ -1344,39 +1384,42 @@ type QueryFilterProps<TSelectOptions extends QueryFilterSelectionOptionProps = Q
|
|
|
1344
1384
|
/** sets whether the content type filter is required */
|
|
1345
1385
|
requireContentType?: boolean;
|
|
1346
1386
|
/** sets the count label value
|
|
1347
|
-
* @
|
|
1387
|
+
* @defaultValue 'Count'
|
|
1348
1388
|
*/
|
|
1349
1389
|
countLabel?: string;
|
|
1350
1390
|
/** sets the sort label text
|
|
1351
|
-
* @
|
|
1391
|
+
* @defaultValue 'Sort'
|
|
1352
1392
|
*/
|
|
1353
1393
|
sortLabel?: string;
|
|
1354
1394
|
/** sets the sort select options value */
|
|
1355
1395
|
sortOptions: TSelectOptions;
|
|
1356
1396
|
/** sets the sort order lable value
|
|
1357
|
-
* @
|
|
1397
|
+
* @defaultValue 'Sort Order'
|
|
1358
1398
|
*/
|
|
1359
1399
|
sortOrderLabel?: string;
|
|
1360
1400
|
/** sets the sort order select options value */
|
|
1361
1401
|
sortOrderOptions: TSelectOptions;
|
|
1362
1402
|
/** sets the search input name value
|
|
1363
|
-
* @
|
|
1403
|
+
* @defaultValue 'searchText'
|
|
1364
1404
|
*/
|
|
1365
1405
|
searchInputName?: string;
|
|
1366
1406
|
/** sets the search input placeholder text
|
|
1367
|
-
* @
|
|
1407
|
+
* @defaultValue 'Enter keyword to narrow your results'
|
|
1368
1408
|
*/
|
|
1369
1409
|
searchInputPlaceholderText?: string;
|
|
1370
1410
|
/** sets the label for the search input
|
|
1371
|
-
* @
|
|
1411
|
+
* @defaultValue 'Query'
|
|
1372
1412
|
*/
|
|
1373
1413
|
searchInputLabel?: string;
|
|
1374
1414
|
/** allows for additional child components, for example more input components */
|
|
1375
1415
|
children?: ReactNode;
|
|
1376
1416
|
};
|
|
1377
1417
|
/**
|
|
1378
|
-
*
|
|
1379
|
-
* @example
|
|
1418
|
+
* An opinionated multi query filter UI component, best used for querying product data or more complex scenarios
|
|
1419
|
+
* @example
|
|
1420
|
+
* ```tsx
|
|
1421
|
+
* <QueryFilter contentTypeOptions={[{ id: 'id', name: 'name' }]} sortOptions={[{ id: 'id', name: 'name' }]} sortOrderOptions={[{ id: 'id', name: 'name' }]} />
|
|
1422
|
+
* ```
|
|
1380
1423
|
* @deprecated this component is not recommended for use in new projects
|
|
1381
1424
|
*/
|
|
1382
1425
|
declare const QueryFilter: ({ requireContentType, queryFilterTitle, contentTypeLabel, typeSelectorAllTypesOptionText, contentTypeOptions, searchInputName, searchInputPlaceholderText, searchInputLabel, countLabel, sortLabel, sortOptions, sortOrderLabel, sortOrderOptions, children, }: QueryFilterProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
@@ -1480,17 +1523,21 @@ declare function useRequest(): RequestContext;
|
|
|
1480
1523
|
|
|
1481
1524
|
type RequestTypeContainerProps = React$1.HTMLAttributes<HTMLDivElement> & {
|
|
1482
1525
|
/**sets the background color of the container
|
|
1483
|
-
* @
|
|
1526
|
+
* @defaultValue 'transparent'
|
|
1484
1527
|
*/
|
|
1485
1528
|
bgColor?: 'transparent' | 'var(--gray-100)';
|
|
1486
1529
|
children: React$1.ReactNode;
|
|
1487
1530
|
};
|
|
1488
1531
|
/**
|
|
1489
|
-
*
|
|
1490
|
-
* @example
|
|
1491
|
-
*
|
|
1492
|
-
* <
|
|
1493
|
-
*
|
|
1532
|
+
* a container to layout content in a 2 column grid format = 12ch 1fr
|
|
1533
|
+
* @example
|
|
1534
|
+
* ```tsx
|
|
1535
|
+
* <RequestTypeContainer bgColor="var(--gray-100)">
|
|
1536
|
+
* <label>Name <input type="text" /></label>
|
|
1537
|
+
* <label>Name <input type="text" /></label>
|
|
1538
|
+
* </RequestTypeContainer>
|
|
1539
|
+
* ```
|
|
1540
|
+
*/
|
|
1494
1541
|
declare const RequestTypeContainer: ({ bgColor, children, ...props }: RequestTypeContainerProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1495
1542
|
|
|
1496
1543
|
/**
|
|
@@ -1707,37 +1754,55 @@ declare const MULTI_SELECT_OPERATORS: OperatorType;
|
|
|
1707
1754
|
|
|
1708
1755
|
/**
|
|
1709
1756
|
* Renders a date input field for filtering
|
|
1710
|
-
* @example
|
|
1757
|
+
* @example
|
|
1758
|
+
* ```tsx
|
|
1759
|
+
* <DateEditor ariaLabel="Date" value={value} onChange={onChange} />
|
|
1760
|
+
* ```
|
|
1711
1761
|
*/
|
|
1712
1762
|
declare const DateEditor: ({ onChange, ariaLabel, disabled, value, readOnly, valueTestId, }: FilterEditorRendererProps<string>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1713
1763
|
|
|
1714
1764
|
/**
|
|
1715
1765
|
* Renders a date range input field for filtering
|
|
1716
|
-
* @example
|
|
1766
|
+
* @example
|
|
1767
|
+
* ```tsx
|
|
1768
|
+
* <DateRangeEditor ariaLabel="Date Range" value={value} onChange={onChange} />
|
|
1769
|
+
* ```
|
|
1717
1770
|
*/
|
|
1718
1771
|
declare const DateRangeEditor: ({ ariaLabel, onChange, disabled, value, readOnly, valueTestId, }: FilterEditorRendererProps<string[]>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1719
1772
|
|
|
1720
1773
|
/**
|
|
1721
1774
|
* Multi select filter component
|
|
1722
|
-
* @example
|
|
1775
|
+
* @example
|
|
1776
|
+
* ```tsx
|
|
1777
|
+
* <FilterMultiChoiceEditor options={options} value={options.filter((option) => values.includes(option.value)} onChange={(e) => onChange(e.map((option) => option.value))} />
|
|
1778
|
+
* ```
|
|
1723
1779
|
*/
|
|
1724
1780
|
declare const FilterMultiChoiceEditor: ({ value, options, disabled, readOnly, valueTestId, ...props }: FilterEditorRendererProps<string[]>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1725
1781
|
|
|
1726
1782
|
/**
|
|
1727
1783
|
* Single select filter component
|
|
1728
|
-
* @example
|
|
1784
|
+
* @example
|
|
1785
|
+
* ```tsx
|
|
1786
|
+
* <FilterSingleChoiceEditor options={options} value={options.find((option) => values.includes(option.value)} onChange={(e) => onChange(e.value)} />
|
|
1787
|
+
* ```
|
|
1729
1788
|
*/
|
|
1730
1789
|
declare const FilterSingleChoiceEditor: ({ options, value, disabled, readOnly, onChange, valueTestId, }: FilterEditorRendererProps<string>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1731
1790
|
|
|
1732
1791
|
/**
|
|
1733
1792
|
* Renders a number input field for filtering
|
|
1734
|
-
* @example
|
|
1793
|
+
* @example
|
|
1794
|
+
* ```tsx
|
|
1795
|
+
* <NumberEditor ariaLabel="Number" value={value} onChange={onChange} />
|
|
1796
|
+
* ```
|
|
1735
1797
|
*/
|
|
1736
1798
|
declare const NumberEditor: ({ ariaLabel, onChange, disabled, value, readOnly, valueTestId, }: FilterEditorRendererProps<string>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1737
1799
|
|
|
1738
1800
|
/**
|
|
1739
1801
|
* Renders a number range input field for filtering
|
|
1740
|
-
* @example
|
|
1802
|
+
* @example
|
|
1803
|
+
* ```tsx
|
|
1804
|
+
* <NumberRangeEditor ariaLabel="Number Range" value={value} onChange={onChange} />
|
|
1805
|
+
* ```
|
|
1741
1806
|
*/
|
|
1742
1807
|
declare const NumberRangeEditor: ({ onChange, disabled, ariaLabel, value, readOnly, valueTestId, }: FilterEditorRendererProps<string[]>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1743
1808
|
|
|
@@ -1749,19 +1814,28 @@ declare const readOnlyAttributes: {
|
|
|
1749
1814
|
|
|
1750
1815
|
/**
|
|
1751
1816
|
* Status multi select filter component that renders a custom dropdown menu
|
|
1752
|
-
* @example
|
|
1817
|
+
* @example
|
|
1818
|
+
* ```tsx
|
|
1819
|
+
* <StatusMultiEditor options={options} value={value} onChange={onChange} />
|
|
1820
|
+
* ```
|
|
1753
1821
|
*/
|
|
1754
1822
|
declare const StatusMultiEditor: ({ options, value, disabled, readOnly, onChange, valueTestId, }: FilterEditorRendererProps<string[]>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1755
1823
|
|
|
1756
1824
|
/**
|
|
1757
1825
|
* Status single select filter component that renders a custom dropdown menu
|
|
1758
|
-
* @example
|
|
1826
|
+
* @example
|
|
1827
|
+
* ```tsx
|
|
1828
|
+
* <StatusSingleEditor options={options} value={value} onChange={onChange} />
|
|
1829
|
+
* ```
|
|
1759
1830
|
*/
|
|
1760
1831
|
declare const StatusSingleEditor: ({ options, value, disabled, readOnly, onChange, valueTestId, }: FilterEditorRendererProps<string>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1761
1832
|
|
|
1762
1833
|
/**
|
|
1763
1834
|
* Renders a text input field for filtering
|
|
1764
|
-
* @example
|
|
1835
|
+
* @example
|
|
1836
|
+
* ```tsx
|
|
1837
|
+
* <TextEditor ariaLabel="Search" value={value} onChange={onChange} />
|
|
1838
|
+
* ```
|
|
1765
1839
|
*/
|
|
1766
1840
|
declare const TextEditor: ({ onChange, ariaLabel, value, readOnly, valueTestId, }: FilterEditorRendererProps<string>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1767
1841
|
|
|
@@ -1772,11 +1846,11 @@ declare const TextMultiChoiceEditor: ({ value, disabled, readOnly, valueTestId,
|
|
|
1772
1846
|
|
|
1773
1847
|
type FilterButtonProps = {
|
|
1774
1848
|
/** text to display on the button
|
|
1775
|
-
* @
|
|
1849
|
+
* @defaultValue "Filters"
|
|
1776
1850
|
*/
|
|
1777
1851
|
text?: string;
|
|
1778
1852
|
/** icon to display on the button
|
|
1779
|
-
* @
|
|
1853
|
+
* @defaultValue "filter-add"
|
|
1780
1854
|
*/
|
|
1781
1855
|
icon?: IconType;
|
|
1782
1856
|
/** number of filters to display on the button and sets the styles on the button */
|
|
@@ -1790,13 +1864,19 @@ type FilterButtonProps = {
|
|
|
1790
1864
|
} & ButtonHTMLAttributes<HTMLButtonElement>;
|
|
1791
1865
|
/**
|
|
1792
1866
|
* A filter button component used to display filter menu options
|
|
1793
|
-
* @example
|
|
1867
|
+
* @example
|
|
1868
|
+
* ```tsx
|
|
1869
|
+
* <FilterButton text="Filters" filterCount={3} />
|
|
1870
|
+
* ```
|
|
1794
1871
|
*/
|
|
1795
1872
|
declare const FilterButton: ({ text, icon, filterCount, hasSelectedValue, dataTestId, showDropdownIcon, ...props }: FilterButtonProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1796
1873
|
|
|
1797
1874
|
/**
|
|
1798
1875
|
* Default filter controls for search and filter
|
|
1799
|
-
* @example
|
|
1876
|
+
* @example
|
|
1877
|
+
* ```tsx
|
|
1878
|
+
* <FilterControls />
|
|
1879
|
+
* ```
|
|
1800
1880
|
*/
|
|
1801
1881
|
declare const FilterControls: ({ children, hideSearchInput, }: {
|
|
1802
1882
|
/** optional param to allow you to add your own controls */
|
|
@@ -1807,7 +1887,10 @@ declare const FilterControls: ({ children, hideSearchInput, }: {
|
|
|
1807
1887
|
|
|
1808
1888
|
/**
|
|
1809
1889
|
* Renders a filter editor component
|
|
1810
|
-
* @example
|
|
1890
|
+
* @example
|
|
1891
|
+
* ```tsx
|
|
1892
|
+
* <FilterEditorRenderer editorType="multiChoice" options={options} value={value} onChange={onChange} />
|
|
1893
|
+
* ```
|
|
1811
1894
|
*/
|
|
1812
1895
|
declare const FilterEditorRenderer: ({ editorType, ...props }: FilterEditorRendererProps<never>) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1813
1896
|
/** A mapper for filter editor components */
|
|
@@ -1853,9 +1936,7 @@ type SearchAndFilterProviderProps = {
|
|
|
1853
1936
|
onChange: (filters: Filter[]) => void;
|
|
1854
1937
|
/** Sets default value for full text search input, useful for bindable search */
|
|
1855
1938
|
defaultSearchTerm?: string;
|
|
1856
|
-
/** sets the reset filter values
|
|
1857
|
-
* @default "[{ field: '', operator: '', value: '' }]"
|
|
1858
|
-
*/
|
|
1939
|
+
/** sets the reset filter values */
|
|
1859
1940
|
resetFilterValues?: Filter[];
|
|
1860
1941
|
/** sets the list of filter options for each filter row */
|
|
1861
1942
|
filterOptions: FilterOptionGroup[];
|
|
@@ -1907,11 +1988,17 @@ type SearchAndFilterContextProps = {
|
|
|
1907
1988
|
declare const SearchAndFilterContext: React$1.Context<SearchAndFilterContextProps>;
|
|
1908
1989
|
/**
|
|
1909
1990
|
* Search and filter provider
|
|
1910
|
-
* @example
|
|
1991
|
+
* @example
|
|
1992
|
+
* ```tsx
|
|
1993
|
+
* <SearchAndFilterProvider filters={filters} filterOptions={filterOptions} onSearchChange={onSearchChange} onChange={onChange}>Children</SearchAndFilterProvider>
|
|
1994
|
+
* ```
|
|
1911
1995
|
* */
|
|
1912
1996
|
declare const SearchAndFilterProvider: ({ filters, filterOptions, filterVisible, alwaysVisible, defaultSearchTerm, onSearchChange, onChange, resetFilterValues, onResetFilterValues, totalResults, isLoading, filterMapper, children, allowBindingSearchTerm, }: SearchAndFilterProviderProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1913
1997
|
/** Search and filter hook
|
|
1914
|
-
* @example
|
|
1998
|
+
* @example
|
|
1999
|
+
* ```tsx
|
|
2000
|
+
* const { searchTerm, setSearchTerm, filterVisibility, setFilterVisibility, filters, setFilters, handleAddFilter, handleResetFilters, handleDeleteFilter, filterOptions, validFilterQuery } = useSearchAndFilter();
|
|
2001
|
+
* ```
|
|
1915
2002
|
*/
|
|
1916
2003
|
declare const useSearchAndFilter: () => {
|
|
1917
2004
|
/** the search term value */
|
|
@@ -1948,7 +2035,7 @@ declare const useSearchAndFilter: () => {
|
|
|
1948
2035
|
|
|
1949
2036
|
type SearchAndFilterProps = Omit<SearchAndFilterProviderProps, 'children'> & {
|
|
1950
2037
|
/** The filter controls to be displayed
|
|
1951
|
-
* @
|
|
2038
|
+
* @defaultValue '<FilterControls />'
|
|
1952
2039
|
*/
|
|
1953
2040
|
filterControls?: React$1.ReactNode;
|
|
1954
2041
|
/** sets the filter mode */
|
|
@@ -1960,7 +2047,7 @@ type SearchAndFilterProps = Omit<SearchAndFilterProviderProps, 'children'> & {
|
|
|
1960
2047
|
/** Whether data is currently loading */
|
|
1961
2048
|
isLoading?: boolean;
|
|
1962
2049
|
/** The results container view
|
|
1963
|
-
* @
|
|
2050
|
+
* @defaultValue '<SearchAndFilterResultContainer />'
|
|
1964
2051
|
*/
|
|
1965
2052
|
resultsContainerView?: React$1.ReactNode;
|
|
1966
2053
|
/** sets the reset filter values */
|
|
@@ -1974,7 +2061,10 @@ type SearchAndFilterProps = Omit<SearchAndFilterProviderProps, 'children'> & {
|
|
|
1974
2061
|
};
|
|
1975
2062
|
/**
|
|
1976
2063
|
* Search and filter component
|
|
1977
|
-
* @example
|
|
2064
|
+
* @example
|
|
2065
|
+
* ```tsx
|
|
2066
|
+
* <SearchAndFilter filters={filters} filterOptions={filterOptions} onChange={onChange} onSearchChange={onSearchChange} onSearchReset={onSearchReset} totalResults={totalResults} />
|
|
2067
|
+
* ```
|
|
1978
2068
|
* */
|
|
1979
2069
|
declare const SearchAndFilter: ({ filters, filterOptions, filterVisible, filterControls, viewSwitchControls, resultsContainerView, filterMapper, additionalFiltersContainer, onChange, defaultSearchTerm, onSearchChange, totalResults, isLoading, allowBindingSearchTerm, resetFilterValues, onResetFilterValues, }: SearchAndFilterProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1980
2070
|
|
|
@@ -1997,7 +2087,10 @@ type SearchAndFilterOptionsContainerProps = {
|
|
|
1997
2087
|
};
|
|
1998
2088
|
/**
|
|
1999
2089
|
* A container component for search and filter options
|
|
2000
|
-
* @example
|
|
2090
|
+
* @example
|
|
2091
|
+
* ```tsx
|
|
2092
|
+
* <SearchAndFilterOptionsContainer buttonRow={<button>Button</button>}>Children</SearchAndFilterOptionsContainer>
|
|
2093
|
+
* ```
|
|
2001
2094
|
* */
|
|
2002
2095
|
declare const SearchAndFilterOptionsContainer: ({ buttonRow, additionalFiltersContainer, children, }: SearchAndFilterOptionsContainerProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
2003
2096
|
type FiltersProps = {
|
|
@@ -2012,20 +2105,23 @@ type FiltersProps = {
|
|
|
2012
2105
|
/** Sets the data-test-id attribute for the filter menu */
|
|
2013
2106
|
dataTestId?: string;
|
|
2014
2107
|
/** The text for the reset button
|
|
2015
|
-
* @
|
|
2108
|
+
* @defaultValue 'reset'
|
|
2016
2109
|
*/
|
|
2017
2110
|
resetButtonText?: string;
|
|
2018
2111
|
additionalFiltersContainer?: SearchAndFilterProps['additionalFiltersContainer'];
|
|
2019
2112
|
};
|
|
2020
2113
|
/**
|
|
2021
2114
|
* A filter menu component used to display filter options
|
|
2022
|
-
* @example
|
|
2115
|
+
* @example
|
|
2116
|
+
* ```tsx
|
|
2117
|
+
* <FilterMenu id="search-and-filter-options">Children</FilterMenu>
|
|
2118
|
+
* ```
|
|
2023
2119
|
* */
|
|
2024
2120
|
declare const FilterMenu: ({ id, filterTitle, menuControls, additionalFiltersContainer, children, dataTestId, resetButtonText, }: FiltersProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
2025
2121
|
|
|
2026
2122
|
type SearchAndFilterResultContainerProps = {
|
|
2027
2123
|
/** The label for the clear button
|
|
2028
|
-
* @
|
|
2124
|
+
* @defaultValue 'Clear'
|
|
2029
2125
|
*/
|
|
2030
2126
|
clearButtonLabel?: string;
|
|
2031
2127
|
/** The text for the button */
|
|
@@ -2045,7 +2141,7 @@ declare const SearchAndFilterResultContainer: ({ buttonText, clearButtonLabel, c
|
|
|
2045
2141
|
declare const SearchOnlyContext: React$1.Context<Pick<SearchAndFilterContextProps, "searchTerm" | "setSearchTerm">>;
|
|
2046
2142
|
type SearchOnlyProviderProps = Pick<SearchAndFilterProviderProps, 'onSearchChange'> & {
|
|
2047
2143
|
/** sets the max width of input wrapper
|
|
2048
|
-
* @
|
|
2144
|
+
* @defaultValue '712px'
|
|
2049
2145
|
*/
|
|
2050
2146
|
maxWidth?: string;
|
|
2051
2147
|
};
|
|
@@ -2053,11 +2149,11 @@ declare const SearchOnlyFilter: ({ onSearchChange, maxWidth }: SearchOnlyProvide
|
|
|
2053
2149
|
|
|
2054
2150
|
type SortItemsProps = {
|
|
2055
2151
|
/** The label for the sort by field
|
|
2056
|
-
* @
|
|
2152
|
+
* @defaultValue 'Sort by'
|
|
2057
2153
|
*/
|
|
2058
2154
|
sortByLabel?: string;
|
|
2059
2155
|
/** The label for the locale returned field
|
|
2060
|
-
* @
|
|
2156
|
+
* @defaultValue 'Enabled locale'
|
|
2061
2157
|
*/
|
|
2062
2158
|
localeLabel?: string;
|
|
2063
2159
|
/** sets the list of sort options */
|
|
@@ -2149,8 +2245,8 @@ declare function useUniformMeshSdk(): _uniformdev_mesh_sdk.UniformMeshSDK;
|
|
|
2149
2245
|
/**
|
|
2150
2246
|
* Creates a validation interceptor between useMeshLocation's setValue function and your code.
|
|
2151
2247
|
* You can use this utility to write cleaner validation logic for your Mesh Location UIs.
|
|
2152
|
-
* @param setValue The location's raw setValue function
|
|
2153
|
-
* @param validate A function to validate the new location's value.
|
|
2248
|
+
* @param setValue - The location's raw setValue function
|
|
2249
|
+
* @param validate - A function to validate the new location's value.
|
|
2154
2250
|
* @returns An equivalent to the setValue function that intercepts sets, performs validation, and emits the result with the new value.
|
|
2155
2251
|
*/
|
|
2156
2252
|
declare function createLocationValidator<TSetValue>(setValue: SetLocationValueDispatch<TSetValue>, validate: (newValue: TSetValue, currentResult: SetValueOptions | undefined) => SetValueOptions): SetLocationValueDispatch<TSetValue>;
|
|
@@ -2159,7 +2255,11 @@ type ContentDataResourceLocaleInfoResult = {
|
|
|
2159
2255
|
/**
|
|
2160
2256
|
* Effective locale for data resource. It can be one of two types:
|
|
2161
2257
|
* - raw locale string - locale stored in mesh data type/resource (e.g. 'en-US')
|
|
2162
|
-
* - variable reference - locale stored in mesh data type/resource as a variable reference
|
|
2258
|
+
* - variable reference - locale stored in mesh data type/resource as a variable reference
|
|
2259
|
+
* @example
|
|
2260
|
+
* ```
|
|
2261
|
+
* ${locale}
|
|
2262
|
+
* ```
|
|
2163
2263
|
*/
|
|
2164
2264
|
effectiveLocale: string;
|
|
2165
2265
|
/** Bound locale value. It can be one of two types:
|
|
@@ -2173,7 +2273,11 @@ type ContentDataResourceLocaleInfoProps = {
|
|
|
2173
2273
|
* It can be one of tree types:
|
|
2174
2274
|
* - undefined - no locale stored in mesh data type/resource yet or it is not localized
|
|
2175
2275
|
* - raw locale string - locale stored in mesh data type/resource (e.g. 'en-US')
|
|
2176
|
-
* - variable reference - locale stored in mesh data type/resource as a variable reference
|
|
2276
|
+
* - variable reference - locale stored in mesh data type/resource as a variable reference
|
|
2277
|
+
* @example
|
|
2278
|
+
* ```
|
|
2279
|
+
* ${locale}
|
|
2280
|
+
* ```
|
|
2177
2281
|
*
|
|
2178
2282
|
* If locale is empty, fallback to dynamic locale value if it is available.
|
|
2179
2283
|
*/
|
|
@@ -2182,7 +2286,7 @@ type ContentDataResourceLocaleInfoProps = {
|
|
|
2182
2286
|
defaultLocale: string | undefined;
|
|
2183
2287
|
/** Map of dynamic inputs for current composition. Should be passed down from DataResource metadata */
|
|
2184
2288
|
dynamicInputs: DynamicInputs;
|
|
2185
|
-
/** In case of empty locale value, this method is called to bind dynamic locale
|
|
2289
|
+
/** In case of empty locale value, this method is called to bind dynamic locale */
|
|
2186
2290
|
setLocale?: (locale: string) => void;
|
|
2187
2291
|
};
|
|
2188
2292
|
declare function useContentDataResourceLocaleInfo({ locale, defaultLocale, setLocale, dynamicInputs, }: ContentDataResourceLocaleInfoProps): ContentDataResourceLocaleInfoResult;
|