@uniformdev/mesh-sdk-react 18.34.0 → 18.34.1-alpha.57
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.ts +352 -13
- package/dist/index.esm.js +761 -23
- package/dist/index.js +798 -47
- package/dist/index.mjs +761 -23
- package/package.json +5 -5
package/dist/index.js
CHANGED
|
@@ -31,46 +31,57 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
31
31
|
// src/index.ts
|
|
32
32
|
var src_exports = {};
|
|
33
33
|
__export(src_exports, {
|
|
34
|
-
AddListButton: () =>
|
|
35
|
-
Button: () =>
|
|
36
|
-
Callout: () =>
|
|
34
|
+
AddListButton: () => import_design_system34.AddListButton,
|
|
35
|
+
Button: () => import_design_system34.Button,
|
|
36
|
+
Callout: () => import_design_system34.Callout,
|
|
37
37
|
DamSelectedItem: () => DamSelectedItem,
|
|
38
|
+
DataRefreshButton: () => DataRefreshButton,
|
|
38
39
|
DataResourceVariablesList: () => DataResourceVariablesList,
|
|
39
40
|
DataSourceEditor: () => DataSourceEditor,
|
|
40
41
|
DataTypeEditor: () => DataTypeEditor,
|
|
41
42
|
DefaultSearchRow: () => DefaultSearchRow,
|
|
42
43
|
DefaultSelectedItem: () => DefaultSelectedItem,
|
|
43
44
|
EntrySearch: () => EntrySearch,
|
|
44
|
-
Heading: () =>
|
|
45
|
+
Heading: () => import_design_system34.Heading,
|
|
45
46
|
Icons: () => icons_exports,
|
|
46
|
-
Input: () =>
|
|
47
|
-
InputComboBox: () =>
|
|
48
|
-
InputKeywordSearch: () =>
|
|
49
|
-
InputSelect: () =>
|
|
50
|
-
InputToggle: () =>
|
|
47
|
+
Input: () => import_design_system34.Input,
|
|
48
|
+
InputComboBox: () => import_design_system34.InputComboBox,
|
|
49
|
+
InputKeywordSearch: () => import_design_system34.InputKeywordSearch,
|
|
50
|
+
InputSelect: () => import_design_system34.InputSelect,
|
|
51
|
+
InputToggle: () => import_design_system34.InputToggle,
|
|
51
52
|
InputVariables: () => InputVariables,
|
|
52
|
-
KeywordSearchInput: () =>
|
|
53
|
-
Label: () =>
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
53
|
+
KeywordSearchInput: () => import_design_system34.InputKeywordSearch,
|
|
54
|
+
Label: () => import_design_system34.Label,
|
|
55
|
+
LinkButton: () => LinkButton,
|
|
56
|
+
LoadingIndicator: () => import_design_system34.LoadingIndicator,
|
|
57
|
+
LoadingOverlay: () => import_design_system34.LoadingOverlay,
|
|
58
|
+
Menu: () => import_design_system34.Menu,
|
|
59
|
+
MenuItem: () => import_design_system34.MenuItem,
|
|
58
60
|
MeshApp: () => MeshApp,
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
61
|
+
ObjectSearchContainer: () => ObjectSearchContainer,
|
|
62
|
+
ObjectSearchFilter: () => ObjectSearchFilter,
|
|
63
|
+
ObjectSearchFilterContainer: () => ObjectSearchFilterContainer2,
|
|
64
|
+
ObjectSearchListItem: () => ObjectSearchListItem,
|
|
65
|
+
ObjectSearchListItemLoadingSkeleton: () => ObjectSearchListItemLoadingSkeleton,
|
|
66
|
+
ObjectSearchProvider: () => ObjectSearchProvider,
|
|
67
|
+
ObjectSearchResultItem: () => ObjectSearchResultItem,
|
|
68
|
+
ObjectSearchResultItemButton: () => ObjectSearchResultItemButton,
|
|
69
|
+
ObjectSearchResultList: () => ObjectSearchResultList,
|
|
70
|
+
ParameterGroup: () => import_design_system34.ParameterGroup,
|
|
71
|
+
ParameterImage: () => import_design_system34.ParameterImage,
|
|
72
|
+
ParameterImageInner: () => import_design_system34.ParameterImageInner,
|
|
73
|
+
ParameterInput: () => import_design_system34.ParameterInput,
|
|
74
|
+
ParameterInputInner: () => import_design_system34.ParameterInputInner,
|
|
75
|
+
ParameterLabel: () => import_design_system34.ParameterLabel,
|
|
76
|
+
ParameterMenuButton: () => import_design_system34.ParameterMenuButton,
|
|
77
|
+
ParameterSelect: () => import_design_system34.ParameterSelect,
|
|
78
|
+
ParameterSelectInner: () => import_design_system34.ParameterSelectInner,
|
|
79
|
+
ParameterShell: () => import_design_system34.ParameterShell,
|
|
80
|
+
ParameterShellContext: () => import_design_system33.ParameterShellContext,
|
|
81
|
+
ParameterTextarea: () => import_design_system34.ParameterTextarea,
|
|
82
|
+
ParameterTextareaInner: () => import_design_system34.ParameterTextareaInner,
|
|
83
|
+
ParameterToggle: () => import_design_system34.ParameterToggle,
|
|
84
|
+
ParameterToggleInner: () => import_design_system34.ParameterToggleInner,
|
|
74
85
|
ProductPreviewList: () => ProductPreviewList,
|
|
75
86
|
ProductQuery: () => ProductQuery,
|
|
76
87
|
ProductQueryContext: () => ProductQueryContext,
|
|
@@ -78,6 +89,7 @@ __export(src_exports, {
|
|
|
78
89
|
ProductSearchContext: () => ProductSearchContext,
|
|
79
90
|
ProductSearchRow: () => ProductSearchRow,
|
|
80
91
|
ProductSelectedItem: () => ProductSelectedItem,
|
|
92
|
+
QueryFilter: () => QueryFilter,
|
|
81
93
|
RequestBody: () => RequestBody,
|
|
82
94
|
RequestHeaders: () => RequestHeaders,
|
|
83
95
|
RequestMethodSelect: () => RequestMethodSelect,
|
|
@@ -87,13 +99,13 @@ __export(src_exports, {
|
|
|
87
99
|
RequestUrl: () => RequestUrl,
|
|
88
100
|
RequestUrlInput: () => RequestUrlInput,
|
|
89
101
|
ResolvableLoadingValue: () => ResolvableLoadingValue,
|
|
90
|
-
ScrollableList: () =>
|
|
91
|
-
ScrollableListItem: () =>
|
|
102
|
+
ScrollableList: () => import_design_system34.ScrollableList,
|
|
103
|
+
ScrollableListItem: () => import_design_system34.ScrollableListItem,
|
|
92
104
|
SelectionField: () => SelectionField,
|
|
93
|
-
Switch: () =>
|
|
105
|
+
Switch: () => import_design_system34.Switch,
|
|
94
106
|
TextVariableRenderer: () => TextVariableRenderer,
|
|
95
|
-
Textarea: () =>
|
|
96
|
-
Theme: () =>
|
|
107
|
+
Textarea: () => import_design_system34.Textarea,
|
|
108
|
+
Theme: () => import_design_system34.Theme,
|
|
97
109
|
UniformMeshLocationContext: () => UniformMeshLocationContext,
|
|
98
110
|
UniformMeshLocationContextProvider: () => UniformMeshLocationContextProvider,
|
|
99
111
|
UniformMeshSdkContext: () => UniformMeshSdkContext,
|
|
@@ -168,7 +180,8 @@ __export(src_exports, {
|
|
|
168
180
|
urlEncodeRequestUrl: () => urlEncodeRequestUrl,
|
|
169
181
|
useInitializeUniformMeshSdk: () => useInitializeUniformMeshSdk,
|
|
170
182
|
useMeshLocation: () => useMeshLocation,
|
|
171
|
-
|
|
183
|
+
useObjectSearchContext: () => useObjectSearchContext,
|
|
184
|
+
useParameterShell: () => import_design_system33.useParameterShell,
|
|
172
185
|
useProductQueryContext: () => useProductQueryContext,
|
|
173
186
|
useProductSearchContext: () => useProductSearchContext,
|
|
174
187
|
useRequest: () => useRequest,
|
|
@@ -1134,12 +1147,12 @@ var import_design_system10 = require("@uniformdev/design-system");
|
|
|
1134
1147
|
var import_react21 = __toESM(require("react"));
|
|
1135
1148
|
var import_react_use3 = require("react-use");
|
|
1136
1149
|
|
|
1137
|
-
// src/components/EntrySearch/DefaultSearchRow.tsx
|
|
1150
|
+
// src/components/legacy/EntrySearch/DefaultSearchRow.tsx
|
|
1138
1151
|
var import_react9 = require("@emotion/react");
|
|
1139
1152
|
var import_design_system4 = require("@uniformdev/design-system");
|
|
1140
1153
|
var import_react10 = require("react");
|
|
1141
1154
|
|
|
1142
|
-
// src/components/EntrySearch/styles/DefaultSearchRow.styles.ts
|
|
1155
|
+
// src/components/legacy/EntrySearch/styles/DefaultSearchRow.styles.ts
|
|
1143
1156
|
var import_react8 = require("@emotion/react");
|
|
1144
1157
|
var searchRowContainer = import_react8.css`
|
|
1145
1158
|
cursor: pointer;
|
|
@@ -1180,7 +1193,7 @@ var searchRowBtn = import_react8.css`
|
|
|
1180
1193
|
inset: 0 var(--spacing-sm) 0 auto;
|
|
1181
1194
|
`;
|
|
1182
1195
|
|
|
1183
|
-
// src/components/EntrySearch/DefaultSearchRow.tsx
|
|
1196
|
+
// src/components/legacy/EntrySearch/DefaultSearchRow.tsx
|
|
1184
1197
|
var import_jsx_runtime19 = require("@emotion/react/jsx-runtime");
|
|
1185
1198
|
var DefaultSearchRow = ({ result, isSelected, triggerSelection }) => {
|
|
1186
1199
|
const popoverRef = (0, import_react10.useRef)(null);
|
|
@@ -1254,7 +1267,7 @@ var DefaultSearchRow = ({ result, isSelected, triggerSelection }) => {
|
|
|
1254
1267
|
);
|
|
1255
1268
|
};
|
|
1256
1269
|
|
|
1257
|
-
// src/components/EntrySearch/DefaultSelectedItem.tsx
|
|
1270
|
+
// src/components/legacy/EntrySearch/DefaultSelectedItem.tsx
|
|
1258
1271
|
var import_react12 = require("@emotion/react");
|
|
1259
1272
|
var import_design_system6 = require("@uniformdev/design-system");
|
|
1260
1273
|
var import_react13 = require("react");
|
|
@@ -1272,7 +1285,7 @@ function openWindowWithCloseCallback(href, callback) {
|
|
|
1272
1285
|
}, 500);
|
|
1273
1286
|
}
|
|
1274
1287
|
|
|
1275
|
-
// src/components/EntrySearch/styles/DefaultSelectedItem.styles.ts
|
|
1288
|
+
// src/components/legacy/EntrySearch/styles/DefaultSelectedItem.styles.ts
|
|
1276
1289
|
var import_react11 = require("@emotion/react");
|
|
1277
1290
|
var import_design_system5 = require("@uniformdev/design-system");
|
|
1278
1291
|
var selectedItemContainer = import_react11.css`
|
|
@@ -1356,7 +1369,7 @@ var selectItemLinkBtn = import_react11.css`
|
|
|
1356
1369
|
}
|
|
1357
1370
|
`;
|
|
1358
1371
|
|
|
1359
|
-
// src/components/EntrySearch/DefaultSelectedItem.tsx
|
|
1372
|
+
// src/components/legacy/EntrySearch/DefaultSelectedItem.tsx
|
|
1360
1373
|
var import_jsx_runtime20 = require("@emotion/react/jsx-runtime");
|
|
1361
1374
|
var DefaultSelectedItem = ({
|
|
1362
1375
|
selectedItem,
|
|
@@ -1539,7 +1552,7 @@ var DefaultSelectedItem = ({
|
|
|
1539
1552
|
] }) }, selectedItem.id);
|
|
1540
1553
|
};
|
|
1541
1554
|
|
|
1542
|
-
// src/components/EntrySearch/EntrySearch.tsx
|
|
1555
|
+
// src/components/legacy/EntrySearch/EntrySearch.tsx
|
|
1543
1556
|
var import_react16 = require("@emotion/react");
|
|
1544
1557
|
var import_design_system7 = require("@uniformdev/design-system");
|
|
1545
1558
|
var React5 = __toESM(require("react"));
|
|
@@ -1580,7 +1593,7 @@ function useLoadingDelay(loading, { delay = 500, minDuration = 200 } = {
|
|
|
1580
1593
|
return state === "DISPLAY" || state === "EXPIRE";
|
|
1581
1594
|
}
|
|
1582
1595
|
|
|
1583
|
-
// src/components/EntrySearch/styles/EntrySearch.styles.ts
|
|
1596
|
+
// src/components/legacy/EntrySearch/styles/EntrySearch.styles.ts
|
|
1584
1597
|
var import_react15 = require("@emotion/react");
|
|
1585
1598
|
var entrySearchWrapper = import_react15.css`
|
|
1586
1599
|
background: var(--white);
|
|
@@ -1691,7 +1704,7 @@ var badgeIcon = import_react15.css`
|
|
|
1691
1704
|
height: calc(var(--spacing-lg) + var(--spacing-xs));
|
|
1692
1705
|
`;
|
|
1693
1706
|
|
|
1694
|
-
// src/components/EntrySearch/EntrySearch.tsx
|
|
1707
|
+
// src/components/legacy/EntrySearch/EntrySearch.tsx
|
|
1695
1708
|
var import_jsx_runtime21 = require("@emotion/react/jsx-runtime");
|
|
1696
1709
|
var DefaultNoResults = ({ searchText, selectedContentType }) => {
|
|
1697
1710
|
let message = "No content found";
|
|
@@ -4103,6 +4116,731 @@ var MeshApp = ({
|
|
|
4103
4116
|
] });
|
|
4104
4117
|
};
|
|
4105
4118
|
|
|
4119
|
+
// src/components/ObjectSearch/DataRefreshButton.tsx
|
|
4120
|
+
var import_react39 = require("@emotion/react");
|
|
4121
|
+
var import_design_system24 = require("@uniformdev/design-system");
|
|
4122
|
+
var import_jsx_runtime45 = require("@emotion/react/jsx-runtime");
|
|
4123
|
+
var DataRefreshButton = ({
|
|
4124
|
+
buttonText,
|
|
4125
|
+
isLoading,
|
|
4126
|
+
onRefreshData,
|
|
4127
|
+
...props
|
|
4128
|
+
}) => {
|
|
4129
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_design_system24.Button, { buttonType: "primaryInvert", onClick: onRefreshData, disabled: isLoading, ...props, children: [
|
|
4130
|
+
!isLoading ? null : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
4131
|
+
import_design_system24.LoadingIndicator,
|
|
4132
|
+
{
|
|
4133
|
+
css: import_react39.css`
|
|
4134
|
+
${isLoading ? "opacity: 0.2;" : void 0}
|
|
4135
|
+
`
|
|
4136
|
+
}
|
|
4137
|
+
),
|
|
4138
|
+
buttonText
|
|
4139
|
+
] });
|
|
4140
|
+
};
|
|
4141
|
+
|
|
4142
|
+
// src/components/ObjectSearch/ObjectSearchContainer.tsx
|
|
4143
|
+
var import_design_system25 = require("@uniformdev/design-system");
|
|
4144
|
+
var import_jsx_runtime46 = require("@emotion/react/jsx-runtime");
|
|
4145
|
+
var ObjectSearchContainer = ({
|
|
4146
|
+
searchFilters,
|
|
4147
|
+
resultList,
|
|
4148
|
+
children
|
|
4149
|
+
}) => {
|
|
4150
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_design_system25.IconsProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_design_system25.VerticalRhythm, { children: [
|
|
4151
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_design_system25.Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_design_system25.VerticalRhythm, { children: [
|
|
4152
|
+
searchFilters,
|
|
4153
|
+
!resultList ? null : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_design_system25.ScrollableList, { role: "list", children: resultList })
|
|
4154
|
+
] }) }),
|
|
4155
|
+
children
|
|
4156
|
+
] }) });
|
|
4157
|
+
};
|
|
4158
|
+
|
|
4159
|
+
// src/components/ObjectSearch/ObjectSearchFilter.tsx
|
|
4160
|
+
var import_design_system26 = require("@uniformdev/design-system");
|
|
4161
|
+
var import_react42 = require("react");
|
|
4162
|
+
|
|
4163
|
+
// src/components/ObjectSearch/hooks/ObjectSearchContext.tsx
|
|
4164
|
+
var import_react40 = require("react");
|
|
4165
|
+
var import_jsx_runtime47 = require("@emotion/react/jsx-runtime");
|
|
4166
|
+
var ObjectSearchContext = (0, import_react40.createContext)({
|
|
4167
|
+
onSetQuery: () => {
|
|
4168
|
+
},
|
|
4169
|
+
onSelectItem: () => {
|
|
4170
|
+
},
|
|
4171
|
+
query: {
|
|
4172
|
+
contentType: "",
|
|
4173
|
+
keyword: ""
|
|
4174
|
+
},
|
|
4175
|
+
list: {},
|
|
4176
|
+
onSetList: () => {
|
|
4177
|
+
},
|
|
4178
|
+
selectedListItems: [],
|
|
4179
|
+
onRemoveAllSelectedItems: () => {
|
|
4180
|
+
}
|
|
4181
|
+
});
|
|
4182
|
+
var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
|
|
4183
|
+
const [query, setQuery] = (0, import_react40.useState)({
|
|
4184
|
+
contentType: "",
|
|
4185
|
+
keyword: ""
|
|
4186
|
+
});
|
|
4187
|
+
const querySearchDeferred = (0, import_react40.useDeferredValue)(query);
|
|
4188
|
+
const [selectedItems, setSelectedItems] = (0, import_react40.useState)(currentlySelectedItems != null ? currentlySelectedItems : []);
|
|
4189
|
+
const [list, setList] = (0, import_react40.useState)({});
|
|
4190
|
+
const onSetQuery = (0, import_react40.useCallback)(
|
|
4191
|
+
(value) => {
|
|
4192
|
+
if (Array.isArray(value.contentType) && value.contentType.length > 0) {
|
|
4193
|
+
return setQuery({
|
|
4194
|
+
...value,
|
|
4195
|
+
contentType: value.contentType[0].id
|
|
4196
|
+
});
|
|
4197
|
+
}
|
|
4198
|
+
return setQuery(value);
|
|
4199
|
+
},
|
|
4200
|
+
[setQuery]
|
|
4201
|
+
);
|
|
4202
|
+
const onSelectItem = (0, import_react40.useCallback)(
|
|
4203
|
+
(selectedResult) => {
|
|
4204
|
+
if (Array.isArray(selectedResult)) {
|
|
4205
|
+
setSelectedItems(selectedResult);
|
|
4206
|
+
} else {
|
|
4207
|
+
if (selectedItems.some((item) => item.id === selectedResult.id)) {
|
|
4208
|
+
setSelectedItems((prev) => prev.filter((item) => item.id !== selectedResult.id));
|
|
4209
|
+
} else {
|
|
4210
|
+
setSelectedItems((prev) => [...prev, selectedResult]);
|
|
4211
|
+
}
|
|
4212
|
+
}
|
|
4213
|
+
},
|
|
4214
|
+
[setSelectedItems, selectedItems]
|
|
4215
|
+
);
|
|
4216
|
+
const onRemoveAllSelectedItems = (0, import_react40.useCallback)(() => {
|
|
4217
|
+
setSelectedItems([]);
|
|
4218
|
+
}, [setSelectedItems]);
|
|
4219
|
+
const onSetList = (0, import_react40.useCallback)(
|
|
4220
|
+
(value) => {
|
|
4221
|
+
setList(value);
|
|
4222
|
+
},
|
|
4223
|
+
[setList]
|
|
4224
|
+
);
|
|
4225
|
+
return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
4226
|
+
ObjectSearchContext.Provider,
|
|
4227
|
+
{
|
|
4228
|
+
value: {
|
|
4229
|
+
onSetQuery,
|
|
4230
|
+
query: querySearchDeferred,
|
|
4231
|
+
onSelectItem,
|
|
4232
|
+
selectedListItems: selectedItems,
|
|
4233
|
+
onRemoveAllSelectedItems,
|
|
4234
|
+
list,
|
|
4235
|
+
onSetList
|
|
4236
|
+
},
|
|
4237
|
+
children
|
|
4238
|
+
}
|
|
4239
|
+
);
|
|
4240
|
+
};
|
|
4241
|
+
var useObjectSearchContext = () => {
|
|
4242
|
+
const contextValues = (0, import_react40.useContext)(ObjectSearchContext);
|
|
4243
|
+
return { ...contextValues };
|
|
4244
|
+
};
|
|
4245
|
+
|
|
4246
|
+
// src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
|
|
4247
|
+
var import_react41 = require("@emotion/react");
|
|
4248
|
+
var ObjectSearchFilterContainerLabel = import_react41.css`
|
|
4249
|
+
align-items: center;
|
|
4250
|
+
display: flex;
|
|
4251
|
+
font-size: var(--fs-sm);
|
|
4252
|
+
font-weight: var(--fw-bold);
|
|
4253
|
+
line-height: 1rem;
|
|
4254
|
+
margin-bottom: var(--spacing-sm);
|
|
4255
|
+
`;
|
|
4256
|
+
var ObjectSearchFilterContainer = import_react41.css`
|
|
4257
|
+
display: grid;
|
|
4258
|
+
gap: var(--spacing-base);
|
|
4259
|
+
`;
|
|
4260
|
+
var ObjectSearchFilterDropdownAndTextSearch = import_react41.css`
|
|
4261
|
+
grid-template-columns: 0.5fr 1fr;
|
|
4262
|
+
`;
|
|
4263
|
+
var ObjectSearchFilterGrid = (gridColumns) => import_react41.css`
|
|
4264
|
+
display: grid;
|
|
4265
|
+
grid-template-columns: ${gridColumns};
|
|
4266
|
+
gap: var(--spacing-base);
|
|
4267
|
+
`;
|
|
4268
|
+
|
|
4269
|
+
// src/components/ObjectSearch/ObjectSearchFilter.tsx
|
|
4270
|
+
var import_jsx_runtime48 = require("@emotion/react/jsx-runtime");
|
|
4271
|
+
var ObjectSearchFilter = ({
|
|
4272
|
+
requireContentType,
|
|
4273
|
+
typeSelectorAllTypesOptionText = "All content types",
|
|
4274
|
+
searchInputName = "searchText",
|
|
4275
|
+
searchInputPlaceholderText = "Enter keyword to narrow your results",
|
|
4276
|
+
selectLabel = "Content Type Select",
|
|
4277
|
+
selectOptions
|
|
4278
|
+
}) => {
|
|
4279
|
+
const { query, onSetQuery } = useObjectSearchContext();
|
|
4280
|
+
const [searchState, setSearchState] = (0, import_react42.useState)({
|
|
4281
|
+
contentType: "",
|
|
4282
|
+
keyword: ""
|
|
4283
|
+
});
|
|
4284
|
+
const handleFilterChange = (value) => {
|
|
4285
|
+
setSearchState((prev) => {
|
|
4286
|
+
return { ...prev, ...value };
|
|
4287
|
+
});
|
|
4288
|
+
onSetQuery({ ...query, ...value });
|
|
4289
|
+
};
|
|
4290
|
+
return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("fieldset", { css: [ObjectSearchFilterContainer, ObjectSearchFilterDropdownAndTextSearch], children: [
|
|
4291
|
+
/* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
|
|
4292
|
+
import_design_system26.InputSelect,
|
|
4293
|
+
{
|
|
4294
|
+
label: selectLabel,
|
|
4295
|
+
showLabel: false,
|
|
4296
|
+
onChange: (e) => handleFilterChange({ contentType: e.target.value }),
|
|
4297
|
+
options: [
|
|
4298
|
+
...!requireContentType ? [{ value: "any", label: typeSelectorAllTypesOptionText }] : [],
|
|
4299
|
+
...selectOptions ? selectOptions.map((option) => {
|
|
4300
|
+
var _a;
|
|
4301
|
+
return { name: option == null ? void 0 : option.name, label: (_a = option.label) != null ? _a : option == null ? void 0 : option.name, id: option.id };
|
|
4302
|
+
}) : []
|
|
4303
|
+
],
|
|
4304
|
+
value: query.contentType
|
|
4305
|
+
}
|
|
4306
|
+
),
|
|
4307
|
+
/* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
|
|
4308
|
+
import_design_system26.InputKeywordSearch,
|
|
4309
|
+
{
|
|
4310
|
+
inputFieldName: searchInputName,
|
|
4311
|
+
placeholder: searchInputPlaceholderText,
|
|
4312
|
+
onSearchTextChanged: (e) => handleFilterChange({ keyword: e }),
|
|
4313
|
+
disabledFieldSubmission: true,
|
|
4314
|
+
onClear: () => handleFilterChange({ keyword: "" }),
|
|
4315
|
+
value: searchState.keyword
|
|
4316
|
+
}
|
|
4317
|
+
)
|
|
4318
|
+
] });
|
|
4319
|
+
};
|
|
4320
|
+
|
|
4321
|
+
// src/components/ObjectSearch/ObjectSearchFilterContainer.tsx
|
|
4322
|
+
var import_jsx_runtime49 = require("@emotion/react/jsx-runtime");
|
|
4323
|
+
var ObjectSearchFilterContainer2 = ({ label, children }) => {
|
|
4324
|
+
return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { children: [
|
|
4325
|
+
/* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { css: ObjectSearchFilterContainerLabel, children: label }),
|
|
4326
|
+
/* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { css: ObjectSearchFilterContainer, children })
|
|
4327
|
+
] });
|
|
4328
|
+
};
|
|
4329
|
+
|
|
4330
|
+
// src/components/ObjectSearch/ObjectSearchListItem.tsx
|
|
4331
|
+
var import_design_system28 = require("@uniformdev/design-system");
|
|
4332
|
+
|
|
4333
|
+
// src/components/ObjectSearch/styles/ObjectSearchListItem.styles.ts
|
|
4334
|
+
var import_react43 = require("@emotion/react");
|
|
4335
|
+
var import_design_system27 = require("@uniformdev/design-system");
|
|
4336
|
+
var ObjectListItemContainer = import_react43.css`
|
|
4337
|
+
align-items: center;
|
|
4338
|
+
border: 1px solid var(--gray-300);
|
|
4339
|
+
border-radius: var(--rounded-base);
|
|
4340
|
+
background: var(--white);
|
|
4341
|
+
display: grid;
|
|
4342
|
+
grid-template-columns: 1fr 32px;
|
|
4343
|
+
padding: var(--spacing-sm);
|
|
4344
|
+
|
|
4345
|
+
&[hidden] {
|
|
4346
|
+
display: none;
|
|
4347
|
+
}
|
|
4348
|
+
`;
|
|
4349
|
+
var ObjectListItemLoading = import_react43.css`
|
|
4350
|
+
animation: ${import_design_system27.skeletonLoading} 1s linear infinite alternate;
|
|
4351
|
+
border-color: transparent;
|
|
4352
|
+
min-height: 42px;
|
|
4353
|
+
position: relative;
|
|
4354
|
+
|
|
4355
|
+
&:before,
|
|
4356
|
+
&:after {
|
|
4357
|
+
background: var(--gray-200);
|
|
4358
|
+
content: '';
|
|
4359
|
+
display: block;
|
|
4360
|
+
height: 1rem;
|
|
4361
|
+
}
|
|
4362
|
+
|
|
4363
|
+
&:before {
|
|
4364
|
+
border-radius: var(--rounded-base);
|
|
4365
|
+
width: 10rem;
|
|
4366
|
+
}
|
|
4367
|
+
|
|
4368
|
+
&:after {
|
|
4369
|
+
border-radius: var(--rounded-full);
|
|
4370
|
+
width: 1rem;
|
|
4371
|
+
}
|
|
4372
|
+
`;
|
|
4373
|
+
var ObjectListItemHeadingGroup = import_react43.css`
|
|
4374
|
+
align-items: center;
|
|
4375
|
+
display: grid;
|
|
4376
|
+
`;
|
|
4377
|
+
var ObjectListItemTitle = import_react43.css`
|
|
4378
|
+
color: var(--brand-secondary-1);
|
|
4379
|
+
display: block;
|
|
4380
|
+
font-size: var(--fs-sm);
|
|
4381
|
+
`;
|
|
4382
|
+
var ObjectListItemSubtitle = import_react43.css`
|
|
4383
|
+
color: var(--gray-500);
|
|
4384
|
+
display: block;
|
|
4385
|
+
font-size: var(--fs-xs);
|
|
4386
|
+
line-height: 1;
|
|
4387
|
+
`;
|
|
4388
|
+
var ObjectListItemInfoContainer = import_react43.css`
|
|
4389
|
+
align-items: center;
|
|
4390
|
+
display: flex;
|
|
4391
|
+
justify-content: center;
|
|
4392
|
+
`;
|
|
4393
|
+
var ObjectListItemControlledContent = import_react43.css`
|
|
4394
|
+
display: flex;
|
|
4395
|
+
gap: var(--spacing-sm);
|
|
4396
|
+
`;
|
|
4397
|
+
var ObjectListItemUnControlledContent = import_react43.css`
|
|
4398
|
+
margin-top: var(--spacing-sm);
|
|
4399
|
+
grid-column: 1 / -1;
|
|
4400
|
+
`;
|
|
4401
|
+
|
|
4402
|
+
// src/components/ObjectSearch/ObjectSearchListItem.tsx
|
|
4403
|
+
var import_jsx_runtime50 = require("@emotion/react/jsx-runtime");
|
|
4404
|
+
var ObjectSearchListItem = ({
|
|
4405
|
+
id,
|
|
4406
|
+
title,
|
|
4407
|
+
contentType,
|
|
4408
|
+
image,
|
|
4409
|
+
popoverData,
|
|
4410
|
+
onSelect,
|
|
4411
|
+
isMulti = false,
|
|
4412
|
+
children,
|
|
4413
|
+
...props
|
|
4414
|
+
}) => {
|
|
4415
|
+
const { onSelectItem, selectedListItems } = useObjectSearchContext();
|
|
4416
|
+
const formatedContentType = Array.isArray(contentType) ? contentType.join(", ") : contentType;
|
|
4417
|
+
const handleSelectItem = () => {
|
|
4418
|
+
var _a;
|
|
4419
|
+
const extraData = (_a = onSelect == null ? void 0 : onSelect()) != null ? _a : {};
|
|
4420
|
+
const selectedItem = { id, title, contentType, image, popoverData, ...extraData };
|
|
4421
|
+
if (isMulti) {
|
|
4422
|
+
return onSelectItem(selectedItem);
|
|
4423
|
+
}
|
|
4424
|
+
return onSelectItem([selectedItem]);
|
|
4425
|
+
};
|
|
4426
|
+
const hideWhenInSelectedList = selectedListItems.some((item) => item.id === id);
|
|
4427
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { role: "listitem", hidden: hideWhenInSelectedList, css: ObjectListItemContainer, ...props, children: [
|
|
4428
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { role: "button", onClick: handleSelectItem, css: ObjectListItemControlledContent, children: [
|
|
4429
|
+
!image ? null : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("img", { ...image, loading: (image == null ? void 0 : image.width) && image.height ? "lazy" : "eager" }),
|
|
4430
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { role: "heading", css: ObjectListItemHeadingGroup, children: [
|
|
4431
|
+
!contentType ? null : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { css: ObjectListItemSubtitle, children: formatedContentType }),
|
|
4432
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { css: ObjectListItemTitle, children: title })
|
|
4433
|
+
] })
|
|
4434
|
+
] }),
|
|
4435
|
+
!popoverData ? null : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { css: ObjectListItemInfoContainer, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_design_system28.Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData }) }),
|
|
4436
|
+
!children ? null : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { css: ObjectListItemUnControlledContent, children })
|
|
4437
|
+
] });
|
|
4438
|
+
};
|
|
4439
|
+
var ObjectSearchListItemLoadingSkeleton = () => {
|
|
4440
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { role: "presentation", css: [ObjectListItemContainer, ObjectListItemLoading] });
|
|
4441
|
+
};
|
|
4442
|
+
|
|
4443
|
+
// src/components/ObjectSearch/ObjectSearchResultItem.tsx
|
|
4444
|
+
var import_design_system30 = require("@uniformdev/design-system");
|
|
4445
|
+
var import_timeago3 = require("timeago.js");
|
|
4446
|
+
|
|
4447
|
+
// src/components/ObjectSearch/styles/ObjectSearchResultItemButton.styles.ts
|
|
4448
|
+
var import_react44 = require("@emotion/react");
|
|
4449
|
+
var import_design_system29 = require("@uniformdev/design-system");
|
|
4450
|
+
var ButtonStyles = import_react44.css`
|
|
4451
|
+
${import_design_system29.button}
|
|
4452
|
+
background: transparent;
|
|
4453
|
+
border: 1px solid var(--brand-secondary-1);
|
|
4454
|
+
color: var(--brand-secondary-1);
|
|
4455
|
+
padding: var(--spacing-sm);
|
|
4456
|
+
font-size: var(--fs-sm);
|
|
4457
|
+
line-height: 1;
|
|
4458
|
+
gap: var(--spacing-xs);
|
|
4459
|
+
transition: border-color var(--duration-fast) var(--timing-ease-out),
|
|
4460
|
+
background-color var(--duration-fast) var(--timing-ease-out);
|
|
4461
|
+
|
|
4462
|
+
&:hover {
|
|
4463
|
+
background: var(--gray-100);
|
|
4464
|
+
border-color: var(--gray-300);
|
|
4465
|
+
}
|
|
4466
|
+
|
|
4467
|
+
&:disabled {
|
|
4468
|
+
background: var(--gray-300);
|
|
4469
|
+
border-color: var(--gray-200);
|
|
4470
|
+
color: var(--gray-500);
|
|
4471
|
+
}
|
|
4472
|
+
|
|
4473
|
+
&:link {
|
|
4474
|
+
text-decoration: none;
|
|
4475
|
+
}
|
|
4476
|
+
`;
|
|
4477
|
+
var ButtonIcon = import_react44.css`
|
|
4478
|
+
width: 1rem;
|
|
4479
|
+
height: 1rem;
|
|
4480
|
+
`;
|
|
4481
|
+
|
|
4482
|
+
// src/components/ObjectSearch/ObjectSearchResultItemButton.tsx
|
|
4483
|
+
var import_jsx_runtime51 = require("@emotion/react/jsx-runtime");
|
|
4484
|
+
var ObjectSearchResultItemButton = ({
|
|
4485
|
+
text,
|
|
4486
|
+
icon,
|
|
4487
|
+
...props
|
|
4488
|
+
}) => {
|
|
4489
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("button", { type: "button", css: ButtonStyles, ...props, children: [
|
|
4490
|
+
!icon ? null : /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Image, { src: icon, css: ButtonIcon }),
|
|
4491
|
+
text
|
|
4492
|
+
] });
|
|
4493
|
+
};
|
|
4494
|
+
var LinkButton = ({
|
|
4495
|
+
text,
|
|
4496
|
+
icon,
|
|
4497
|
+
...props
|
|
4498
|
+
}) => {
|
|
4499
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("a", { ...props, css: ButtonStyles, target: "_blank", rel: "noopener noreferrer", children: [
|
|
4500
|
+
!icon ? null : /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Image, { src: icon, css: ButtonIcon }),
|
|
4501
|
+
text
|
|
4502
|
+
] });
|
|
4503
|
+
};
|
|
4504
|
+
|
|
4505
|
+
// src/components/ObjectSearch/styles/ObjectSearchResultItem.styles.ts
|
|
4506
|
+
var import_react45 = require("@emotion/react");
|
|
4507
|
+
var ObjectSearchResultItemContainer = import_react45.css`
|
|
4508
|
+
align-items: center;
|
|
4509
|
+
border: 1px solid var(--gray-300);
|
|
4510
|
+
border-radius: var(--rounded-base);
|
|
4511
|
+
background: var(--gray-50);
|
|
4512
|
+
display: grid;
|
|
4513
|
+
grid-template-columns: 1fr auto;
|
|
4514
|
+
padding: var(--spacing-sm) var(--spacing-sm) var(--spacing-sm) var(--spacing-md);
|
|
4515
|
+
position: relative;
|
|
4516
|
+
|
|
4517
|
+
&:hover {
|
|
4518
|
+
.drag-handle {
|
|
4519
|
+
opacity: 1;
|
|
4520
|
+
}
|
|
4521
|
+
}
|
|
4522
|
+
`;
|
|
4523
|
+
var ObjectSearchDragHandle = import_react45.css`
|
|
4524
|
+
border-left: 2px dotted var(--gray-300);
|
|
4525
|
+
border-right: 2px dotted var(--gray-300);
|
|
4526
|
+
position: absolute;
|
|
4527
|
+
inset: var(--spacing-sm) auto var(--spacing-sm) var(--spacing-sm);
|
|
4528
|
+
width: 5px;
|
|
4529
|
+
transition: opacity var(--duration-fast) var(--timing-ease-out);
|
|
4530
|
+
opacity: 0;
|
|
4531
|
+
`;
|
|
4532
|
+
var ObjectSearchResultItemSubtitle = import_react45.css`
|
|
4533
|
+
color: var(--gray-500);
|
|
4534
|
+
display: block;
|
|
4535
|
+
font-size: var(--fs-xs);
|
|
4536
|
+
line-height: 1;
|
|
4537
|
+
`;
|
|
4538
|
+
var ObjectSearchResultItemTitle = import_react45.css`
|
|
4539
|
+
align-items: center;
|
|
4540
|
+
color: var(--brand-secondary-1);
|
|
4541
|
+
display: flex;
|
|
4542
|
+
gap: var(--spacing-xs);
|
|
4543
|
+
`;
|
|
4544
|
+
var ObjectSearchResultItemTimeStamp = import_react45.css`
|
|
4545
|
+
color: var(--gray-500);
|
|
4546
|
+
font-size: var(--fs-xs);
|
|
4547
|
+
`;
|
|
4548
|
+
var ObjectSearchAuthorStateGroup = import_react45.css`
|
|
4549
|
+
align-items: center;
|
|
4550
|
+
display: flex;
|
|
4551
|
+
gap: var(--spacing-sm);
|
|
4552
|
+
`;
|
|
4553
|
+
var ObjectSearchUpdateGroup = import_react45.css`
|
|
4554
|
+
display: grid;
|
|
4555
|
+
`;
|
|
4556
|
+
var ObjectSearchContentContainer = import_react45.css`
|
|
4557
|
+
display: flex;
|
|
4558
|
+
gap: var(--spacing-base);
|
|
4559
|
+
`;
|
|
4560
|
+
var ObjectSearchImage = import_react45.css`
|
|
4561
|
+
width: 56px;
|
|
4562
|
+
object-fit: contain;
|
|
4563
|
+
`;
|
|
4564
|
+
|
|
4565
|
+
// src/components/ObjectSearch/ObjectSearchResultItem.tsx
|
|
4566
|
+
var import_jsx_runtime52 = require("@emotion/react/jsx-runtime");
|
|
4567
|
+
var ObjectSearchResultItem = ({
|
|
4568
|
+
id,
|
|
4569
|
+
title,
|
|
4570
|
+
name,
|
|
4571
|
+
contentType,
|
|
4572
|
+
popoverData,
|
|
4573
|
+
publishStatus,
|
|
4574
|
+
editLinkIcon,
|
|
4575
|
+
editLink,
|
|
4576
|
+
imageUrl,
|
|
4577
|
+
onRemove,
|
|
4578
|
+
createdAt,
|
|
4579
|
+
publishedAt,
|
|
4580
|
+
hideRemoveButton = false,
|
|
4581
|
+
disableDnD = false,
|
|
4582
|
+
children
|
|
4583
|
+
}) => {
|
|
4584
|
+
const { onSelectItem } = useObjectSearchContext();
|
|
4585
|
+
const formatedContentType = Array.isArray(contentType) ? contentType.join(", ") : contentType;
|
|
4586
|
+
const onRemoveItem = () => {
|
|
4587
|
+
onSelectItem({ id });
|
|
4588
|
+
onRemove == null ? void 0 : onRemove();
|
|
4589
|
+
};
|
|
4590
|
+
return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { css: ObjectSearchResultItemContainer, children: [
|
|
4591
|
+
disableDnD ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { role: "presentation", className: "drag-handle", css: ObjectSearchDragHandle }),
|
|
4592
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { css: ObjectSearchContentContainer, children: [
|
|
4593
|
+
!imageUrl ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("img", { src: imageUrl, alt: `Thumbnail for ${title}`, css: ObjectSearchImage }),
|
|
4594
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { children: [
|
|
4595
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { css: ObjectSearchResultItemSubtitle, children: formatedContentType }),
|
|
4596
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("span", { role: "heading", css: ObjectSearchResultItemTitle, children: [
|
|
4597
|
+
title != null ? title : name,
|
|
4598
|
+
!popoverData ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_design_system30.Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
|
|
4599
|
+
] }),
|
|
4600
|
+
!createdAt && !publishStatus ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { css: ObjectSearchAuthorStateGroup, children: [
|
|
4601
|
+
!(publishStatus == null ? void 0 : publishStatus.text) ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_design_system30.Badge, { ...publishStatus, size: "sm", uppercaseText: true }),
|
|
4602
|
+
!createdAt && !publishedAt ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { css: ObjectSearchUpdateGroup, children: [
|
|
4603
|
+
!createdAt ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("small", { css: ObjectSearchResultItemTimeStamp, children: [
|
|
4604
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("strong", { children: "Last updated: " }),
|
|
4605
|
+
(0, import_timeago3.format)(createdAt)
|
|
4606
|
+
] }),
|
|
4607
|
+
!publishedAt ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("small", { css: ObjectSearchResultItemTimeStamp, children: [
|
|
4608
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("strong", { children: "Last published: " }),
|
|
4609
|
+
(0, import_timeago3.format)(publishedAt)
|
|
4610
|
+
] })
|
|
4611
|
+
] })
|
|
4612
|
+
] }),
|
|
4613
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { children })
|
|
4614
|
+
] })
|
|
4615
|
+
] }) }),
|
|
4616
|
+
!editLink && hideRemoveButton ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { css: ObjectSearchAuthorStateGroup, children: [
|
|
4617
|
+
!editLink ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(LinkButton, { text: "Edit", href: editLink, icon: editLinkIcon }),
|
|
4618
|
+
hideRemoveButton ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_design_system30.Button, { buttonType: "ghostDestructive", onClick: onRemoveItem, children: "Remove" })
|
|
4619
|
+
] })
|
|
4620
|
+
] });
|
|
4621
|
+
};
|
|
4622
|
+
|
|
4623
|
+
// src/components/ObjectSearch/ObjectSearchResultList.tsx
|
|
4624
|
+
var import_design_system31 = require("@uniformdev/design-system");
|
|
4625
|
+
var import_react_beautiful_dnd3 = require("react-beautiful-dnd");
|
|
4626
|
+
|
|
4627
|
+
// src/components/ObjectSearch/styles/ObjectSearchResultList.styles.ts
|
|
4628
|
+
var import_react46 = require("@emotion/react");
|
|
4629
|
+
var ObjectSearchResultListContainer = import_react46.css`
|
|
4630
|
+
align-items: center;
|
|
4631
|
+
display: flex;
|
|
4632
|
+
gap: var(--spacing-sm);
|
|
4633
|
+
justify-content: space-between;
|
|
4634
|
+
`;
|
|
4635
|
+
var ObjectSearchDragContainer = import_react46.css`
|
|
4636
|
+
margin: 0 0 var(--spacing-sm);
|
|
4637
|
+
`;
|
|
4638
|
+
var ObjectSearchResultListCounterContainer = import_react46.css`
|
|
4639
|
+
align-items: center;
|
|
4640
|
+
display: flex;
|
|
4641
|
+
gap: var(--spacing-sm);
|
|
4642
|
+
`;
|
|
4643
|
+
var ObjectSearchResultListTitle = import_react46.css`
|
|
4644
|
+
font-weight: var(--fw-bold);
|
|
4645
|
+
line-height: 1;
|
|
4646
|
+
`;
|
|
4647
|
+
|
|
4648
|
+
// src/components/ObjectSearch/ObjectSearchResultList.tsx
|
|
4649
|
+
var import_jsx_runtime53 = require("@emotion/react/jsx-runtime");
|
|
4650
|
+
var ObjectSearchResultList = ({
|
|
4651
|
+
resultLabelText = "Selected",
|
|
4652
|
+
removeButtonText = "Remove all",
|
|
4653
|
+
onRemoveAllSelected,
|
|
4654
|
+
hideRemoveButton = false,
|
|
4655
|
+
additionalButtons,
|
|
4656
|
+
renderResultComponent = (value) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(ObjectSearchResultItem, { ...value, disableDnD }),
|
|
4657
|
+
multiSelectId,
|
|
4658
|
+
disableDnD = false
|
|
4659
|
+
}) => {
|
|
4660
|
+
const { selectedListItems, onRemoveAllSelectedItems, onSelectItem } = useObjectSearchContext();
|
|
4661
|
+
const handleRemoveAllSelectedItems = () => {
|
|
4662
|
+
onRemoveAllSelectedItems();
|
|
4663
|
+
onRemoveAllSelected == null ? void 0 : onRemoveAllSelected();
|
|
4664
|
+
};
|
|
4665
|
+
const onDragEnd = (res) => {
|
|
4666
|
+
var _a, _b;
|
|
4667
|
+
if (res.destination && res.source.droppableId === ((_a = res.destination) == null ? void 0 : _a.droppableId)) {
|
|
4668
|
+
const result = [...selectedListItems || []];
|
|
4669
|
+
const [removed] = (_b = result == null ? void 0 : result.splice(res.source.index, 1)) != null ? _b : [];
|
|
4670
|
+
result == null ? void 0 : result.splice(res.destination.index, 0, removed);
|
|
4671
|
+
onSelectItem(result);
|
|
4672
|
+
return result;
|
|
4673
|
+
}
|
|
4674
|
+
};
|
|
4675
|
+
return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
|
|
4676
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { role: "group", css: ObjectSearchResultListContainer, children: [
|
|
4677
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { role: "note", css: ObjectSearchResultListCounterContainer, children: [
|
|
4678
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { css: ObjectSearchResultListTitle, children: resultLabelText }),
|
|
4679
|
+
" ",
|
|
4680
|
+
!selectedListItems.length ? null : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_design_system31.Counter, { count: selectedListItems.length })
|
|
4681
|
+
] }),
|
|
4682
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { css: ObjectSearchResultListCounterContainer, children: [
|
|
4683
|
+
additionalButtons,
|
|
4684
|
+
hideRemoveButton ? null : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
|
|
4685
|
+
import_design_system31.Button,
|
|
4686
|
+
{
|
|
4687
|
+
buttonType: "ghostDestructive",
|
|
4688
|
+
size: "xs",
|
|
4689
|
+
disabled: selectedListItems.length === 0,
|
|
4690
|
+
onClick: handleRemoveAllSelectedItems,
|
|
4691
|
+
children: removeButtonText
|
|
4692
|
+
}
|
|
4693
|
+
)
|
|
4694
|
+
] })
|
|
4695
|
+
] }),
|
|
4696
|
+
!selectedListItems.length ? null : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_beautiful_dnd3.DragDropContext, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_beautiful_dnd3.Droppable, { droppableId: multiSelectId != null ? multiSelectId : "canvas-multi-select", children: (provided) => /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
|
|
4697
|
+
selectedListItems.map((item, i) => {
|
|
4698
|
+
const renderListItem = renderResultComponent(item);
|
|
4699
|
+
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_beautiful_dnd3.Draggable, { draggableId: item.id, index: i, isDragDisabled: disableDnD, children: (provided2, snapshot) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
|
|
4700
|
+
"div",
|
|
4701
|
+
{
|
|
4702
|
+
css: ObjectSearchDragContainer,
|
|
4703
|
+
ref: provided2.innerRef,
|
|
4704
|
+
"data-dragging": snapshot.isDragging,
|
|
4705
|
+
...provided2.draggableProps,
|
|
4706
|
+
...provided2.dragHandleProps,
|
|
4707
|
+
children: renderListItem
|
|
4708
|
+
}
|
|
4709
|
+
) }, item.id);
|
|
4710
|
+
}),
|
|
4711
|
+
provided.placeholder
|
|
4712
|
+
] }) }) })
|
|
4713
|
+
] });
|
|
4714
|
+
};
|
|
4715
|
+
|
|
4716
|
+
// src/components/ObjectSearch/QueryFilter.tsx
|
|
4717
|
+
var import_design_system32 = require("@uniformdev/design-system");
|
|
4718
|
+
var import_react47 = require("react");
|
|
4719
|
+
var import_jsx_runtime54 = require("@emotion/react/jsx-runtime");
|
|
4720
|
+
var QueryFilter = ({
|
|
4721
|
+
requireContentType,
|
|
4722
|
+
queryFilterTitle = "Configure Query",
|
|
4723
|
+
contentTypeLabel = "Filter by content type",
|
|
4724
|
+
typeSelectorAllTypesOptionText = "All content types",
|
|
4725
|
+
contentTypeOptions,
|
|
4726
|
+
searchInputName = "searchText",
|
|
4727
|
+
searchInputPlaceholderText = "Enter keyword to narrow your results",
|
|
4728
|
+
countLabel = "Count",
|
|
4729
|
+
countValue = 5,
|
|
4730
|
+
sortLabel = "Sort",
|
|
4731
|
+
sortOptions,
|
|
4732
|
+
sortOrderLabel = "Sort Order",
|
|
4733
|
+
sortOrderOptions = [
|
|
4734
|
+
{
|
|
4735
|
+
name: "Ascending",
|
|
4736
|
+
id: "asc",
|
|
4737
|
+
label: "Ascending"
|
|
4738
|
+
},
|
|
4739
|
+
{
|
|
4740
|
+
name: "Descending",
|
|
4741
|
+
id: "desc",
|
|
4742
|
+
label: "Descending"
|
|
4743
|
+
}
|
|
4744
|
+
],
|
|
4745
|
+
children
|
|
4746
|
+
}) => {
|
|
4747
|
+
var _a, _b;
|
|
4748
|
+
const { query, onSetQuery } = useObjectSearchContext();
|
|
4749
|
+
const [queryState, setQueryState] = (0, import_react47.useState)({
|
|
4750
|
+
contentType: "",
|
|
4751
|
+
keyword: "",
|
|
4752
|
+
count: countValue != null ? countValue : 5,
|
|
4753
|
+
sortBy: (_a = sortOptions[0].id) != null ? _a : "",
|
|
4754
|
+
sortOrder: (_b = sortOrderOptions[0].id) != null ? _b : ""
|
|
4755
|
+
});
|
|
4756
|
+
const handleFilterChange = (value) => {
|
|
4757
|
+
setQueryState((prev) => ({ ...prev, ...value }));
|
|
4758
|
+
onSetQuery({ ...query, ...value });
|
|
4759
|
+
};
|
|
4760
|
+
(0, import_react47.useEffect)(() => {
|
|
4761
|
+
onSetQuery(queryState);
|
|
4762
|
+
}, [onSetQuery, queryState]);
|
|
4763
|
+
return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("fieldset", { children: [
|
|
4764
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { css: ObjectSearchFilterContainerLabel, children: queryFilterTitle }),
|
|
4765
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { css: ObjectSearchFilterContainer, children: [
|
|
4766
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { css: ObjectSearchFilterGrid("0.5fr 1fr"), children: [
|
|
4767
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
|
|
4768
|
+
import_design_system32.InputSelect,
|
|
4769
|
+
{
|
|
4770
|
+
label: contentTypeLabel,
|
|
4771
|
+
showLabel: false,
|
|
4772
|
+
options: [
|
|
4773
|
+
...!requireContentType ? [{ id: "", label: typeSelectorAllTypesOptionText }] : [],
|
|
4774
|
+
...contentTypeOptions ? contentTypeOptions.map((option) => {
|
|
4775
|
+
var _a2;
|
|
4776
|
+
return { id: option.id, label: (_a2 = option.label) != null ? _a2 : option.name, name: option.name };
|
|
4777
|
+
}) : []
|
|
4778
|
+
],
|
|
4779
|
+
onChange: (e) => handleFilterChange({ contentType: e.target.value }),
|
|
4780
|
+
value: queryState.contentType
|
|
4781
|
+
}
|
|
4782
|
+
),
|
|
4783
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
|
|
4784
|
+
import_design_system32.InputKeywordSearch,
|
|
4785
|
+
{
|
|
4786
|
+
inputFieldName: searchInputName,
|
|
4787
|
+
placeholder: searchInputPlaceholderText,
|
|
4788
|
+
onSearchTextChanged: (e) => handleFilterChange({ keyword: e }),
|
|
4789
|
+
disabledFieldSubmission: true,
|
|
4790
|
+
onClear: () => handleFilterChange({ keyword: "" }),
|
|
4791
|
+
value: queryState.keyword
|
|
4792
|
+
}
|
|
4793
|
+
)
|
|
4794
|
+
] }),
|
|
4795
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { css: ObjectSearchFilterGrid("repeat(2, 1fr) 0.5fr"), children: [
|
|
4796
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
|
|
4797
|
+
import_design_system32.InputSelect,
|
|
4798
|
+
{
|
|
4799
|
+
label: sortLabel,
|
|
4800
|
+
options: [
|
|
4801
|
+
{
|
|
4802
|
+
label: "Select a sort",
|
|
4803
|
+
id: ""
|
|
4804
|
+
},
|
|
4805
|
+
...sortOptions ? sortOptions.map((option) => {
|
|
4806
|
+
var _a2;
|
|
4807
|
+
return { id: option.id, name: option.name, label: (_a2 = option.label) != null ? _a2 : option.name };
|
|
4808
|
+
}) : []
|
|
4809
|
+
],
|
|
4810
|
+
onChange: (e) => handleFilterChange({ sortBy: e.target.value }),
|
|
4811
|
+
value: queryState.sortBy
|
|
4812
|
+
}
|
|
4813
|
+
),
|
|
4814
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
|
|
4815
|
+
import_design_system32.InputSelect,
|
|
4816
|
+
{
|
|
4817
|
+
label: sortOrderLabel,
|
|
4818
|
+
options: [
|
|
4819
|
+
...sortOrderOptions ? sortOrderOptions.map((option) => {
|
|
4820
|
+
var _a2;
|
|
4821
|
+
return { value: option.id, label: (_a2 = option.label) != null ? _a2 : option.name, name: option.name };
|
|
4822
|
+
}) : []
|
|
4823
|
+
],
|
|
4824
|
+
onChange: (e) => handleFilterChange({ sortOrder: e.target.value }),
|
|
4825
|
+
value: queryState.sortOrder
|
|
4826
|
+
}
|
|
4827
|
+
),
|
|
4828
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
|
|
4829
|
+
import_design_system32.Input,
|
|
4830
|
+
{
|
|
4831
|
+
label: countLabel,
|
|
4832
|
+
type: "number",
|
|
4833
|
+
onChange: (e) => handleFilterChange({ count: e.target.value }),
|
|
4834
|
+
defaultValue: countValue,
|
|
4835
|
+
value: queryState.count
|
|
4836
|
+
}
|
|
4837
|
+
)
|
|
4838
|
+
] }),
|
|
4839
|
+
children
|
|
4840
|
+
] })
|
|
4841
|
+
] });
|
|
4842
|
+
};
|
|
4843
|
+
|
|
4106
4844
|
// src/hooks/useUniformMeshLocation.ts
|
|
4107
4845
|
function useUniformMeshLocation() {
|
|
4108
4846
|
const { location } = useUniformMeshLocationContext();
|
|
@@ -4110,7 +4848,7 @@ function useUniformMeshLocation() {
|
|
|
4110
4848
|
}
|
|
4111
4849
|
|
|
4112
4850
|
// src/hooks/index.ts
|
|
4113
|
-
var
|
|
4851
|
+
var import_design_system33 = require("@uniformdev/design-system");
|
|
4114
4852
|
|
|
4115
4853
|
// src/utils/createLocationValidator.ts
|
|
4116
4854
|
function createLocationValidator(setValue, validate) {
|
|
@@ -4121,7 +4859,7 @@ function createLocationValidator(setValue, validate) {
|
|
|
4121
4859
|
}
|
|
4122
4860
|
|
|
4123
4861
|
// src/index.ts
|
|
4124
|
-
var
|
|
4862
|
+
var import_design_system34 = require("@uniformdev/design-system");
|
|
4125
4863
|
__reExport(src_exports, require("@uniformdev/mesh-sdk"), module.exports);
|
|
4126
4864
|
// Annotate the CommonJS export names for ESM import in node:
|
|
4127
4865
|
0 && (module.exports = {
|
|
@@ -4129,6 +4867,7 @@ __reExport(src_exports, require("@uniformdev/mesh-sdk"), module.exports);
|
|
|
4129
4867
|
Button,
|
|
4130
4868
|
Callout,
|
|
4131
4869
|
DamSelectedItem,
|
|
4870
|
+
DataRefreshButton,
|
|
4132
4871
|
DataResourceVariablesList,
|
|
4133
4872
|
DataSourceEditor,
|
|
4134
4873
|
DataTypeEditor,
|
|
@@ -4145,11 +4884,21 @@ __reExport(src_exports, require("@uniformdev/mesh-sdk"), module.exports);
|
|
|
4145
4884
|
InputVariables,
|
|
4146
4885
|
KeywordSearchInput,
|
|
4147
4886
|
Label,
|
|
4887
|
+
LinkButton,
|
|
4148
4888
|
LoadingIndicator,
|
|
4149
4889
|
LoadingOverlay,
|
|
4150
4890
|
Menu,
|
|
4151
4891
|
MenuItem,
|
|
4152
4892
|
MeshApp,
|
|
4893
|
+
ObjectSearchContainer,
|
|
4894
|
+
ObjectSearchFilter,
|
|
4895
|
+
ObjectSearchFilterContainer,
|
|
4896
|
+
ObjectSearchListItem,
|
|
4897
|
+
ObjectSearchListItemLoadingSkeleton,
|
|
4898
|
+
ObjectSearchProvider,
|
|
4899
|
+
ObjectSearchResultItem,
|
|
4900
|
+
ObjectSearchResultItemButton,
|
|
4901
|
+
ObjectSearchResultList,
|
|
4153
4902
|
ParameterGroup,
|
|
4154
4903
|
ParameterImage,
|
|
4155
4904
|
ParameterImageInner,
|
|
@@ -4172,6 +4921,7 @@ __reExport(src_exports, require("@uniformdev/mesh-sdk"), module.exports);
|
|
|
4172
4921
|
ProductSearchContext,
|
|
4173
4922
|
ProductSearchRow,
|
|
4174
4923
|
ProductSelectedItem,
|
|
4924
|
+
QueryFilter,
|
|
4175
4925
|
RequestBody,
|
|
4176
4926
|
RequestHeaders,
|
|
4177
4927
|
RequestMethodSelect,
|
|
@@ -4262,6 +5012,7 @@ __reExport(src_exports, require("@uniformdev/mesh-sdk"), module.exports);
|
|
|
4262
5012
|
urlEncodeRequestUrl,
|
|
4263
5013
|
useInitializeUniformMeshSdk,
|
|
4264
5014
|
useMeshLocation,
|
|
5015
|
+
useObjectSearchContext,
|
|
4265
5016
|
useParameterShell,
|
|
4266
5017
|
useProductQueryContext,
|
|
4267
5018
|
useProductSearchContext,
|