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