@uniformdev/mesh-sdk-react 18.34.0 → 18.35.1-alpha.12
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 +354 -75
- package/dist/index.esm.js +767 -70
- package/dist/index.js +805 -103
- package/dist/index.mjs +767 -70
- package/package.json +5 -5
package/dist/index.esm.js
CHANGED
|
@@ -893,7 +893,7 @@ var ProductPreviewList = ({
|
|
|
893
893
|
scrollbarStyles
|
|
894
894
|
],
|
|
895
895
|
children: products == null ? void 0 : products.map((product, index) => {
|
|
896
|
-
var _a
|
|
896
|
+
var _a;
|
|
897
897
|
const [category] = (product == null ? void 0 : product.categories) || [];
|
|
898
898
|
const categoryName = typeof category === "undefined" || !categories ? void 0 : (_a = categories.find((c) => c.id === category.id)) == null ? void 0 : _a.name;
|
|
899
899
|
return /* @__PURE__ */ jsx18("li", { css: productPreviewListItem, children: /* @__PURE__ */ jsxs7(
|
|
@@ -906,13 +906,13 @@ var ProductPreviewList = ({
|
|
|
906
906
|
"img",
|
|
907
907
|
{
|
|
908
908
|
src: product.thumbnailUrl,
|
|
909
|
-
alt: typeof product.title === "string" ? product.title :
|
|
909
|
+
alt: typeof product.title === "string" ? product.title : `Product ${index}`,
|
|
910
910
|
css: productPreviewListImage,
|
|
911
911
|
"data-test-id": "product-image"
|
|
912
912
|
}
|
|
913
913
|
) : /* @__PURE__ */ jsx18("div", { css: productPreviewListImageDefault }),
|
|
914
914
|
/* @__PURE__ */ jsxs7("h4", { css: productPreviewListTitle, "data-test-id": "product-name", children: [
|
|
915
|
-
product.title
|
|
915
|
+
product.title,
|
|
916
916
|
categoryName && /* @__PURE__ */ jsx18("span", { css: productPreviewListCategoryText, children: categoryName })
|
|
917
917
|
] }),
|
|
918
918
|
product && /* @__PURE__ */ jsxs7(Fragment2, { children: [
|
|
@@ -925,12 +925,12 @@ var ProductPreviewList = ({
|
|
|
925
925
|
"Price: ",
|
|
926
926
|
product.price
|
|
927
927
|
] }) : null,
|
|
928
|
-
product.editLink
|
|
928
|
+
product.editLink ? /* @__PURE__ */ jsxs7(
|
|
929
929
|
"a",
|
|
930
930
|
{
|
|
931
931
|
css: productPreviewListLinkBtn,
|
|
932
|
-
href:
|
|
933
|
-
title: `Go to ${product.title
|
|
932
|
+
href: product.editLink,
|
|
933
|
+
title: `Go to ${product.title}`,
|
|
934
934
|
target: "_blank",
|
|
935
935
|
rel: "noopener noreferrer",
|
|
936
936
|
"data-test-id": "edit-product-button",
|
|
@@ -955,12 +955,12 @@ import { Callout as Callout2 } from "@uniformdev/design-system";
|
|
|
955
955
|
import React6, { useContext as useContext2, useMemo as useMemo2, useRef as useRef5 } from "react";
|
|
956
956
|
import { useAsync, useAsyncFn as useAsyncFn2 } from "react-use";
|
|
957
957
|
|
|
958
|
-
// src/components/EntrySearch/DefaultSearchRow.tsx
|
|
958
|
+
// src/components/legacy/EntrySearch/DefaultSearchRow.tsx
|
|
959
959
|
import { css as css7 } from "@emotion/react";
|
|
960
960
|
import { useOutsideClick } from "@uniformdev/design-system";
|
|
961
961
|
import { useRef, useState } from "react";
|
|
962
962
|
|
|
963
|
-
// src/components/EntrySearch/styles/DefaultSearchRow.styles.ts
|
|
963
|
+
// src/components/legacy/EntrySearch/styles/DefaultSearchRow.styles.ts
|
|
964
964
|
import { css as css6 } from "@emotion/react";
|
|
965
965
|
var searchRowContainer = css6`
|
|
966
966
|
cursor: pointer;
|
|
@@ -1001,7 +1001,7 @@ var searchRowBtn = css6`
|
|
|
1001
1001
|
inset: 0 var(--spacing-sm) 0 auto;
|
|
1002
1002
|
`;
|
|
1003
1003
|
|
|
1004
|
-
// src/components/EntrySearch/DefaultSearchRow.tsx
|
|
1004
|
+
// src/components/legacy/EntrySearch/DefaultSearchRow.tsx
|
|
1005
1005
|
import { jsx as jsx19, jsxs as jsxs8 } from "@emotion/react/jsx-runtime";
|
|
1006
1006
|
var DefaultSearchRow = ({ result, isSelected, triggerSelection }) => {
|
|
1007
1007
|
const popoverRef = useRef(null);
|
|
@@ -1075,7 +1075,7 @@ var DefaultSearchRow = ({ result, isSelected, triggerSelection }) => {
|
|
|
1075
1075
|
);
|
|
1076
1076
|
};
|
|
1077
1077
|
|
|
1078
|
-
// src/components/EntrySearch/DefaultSelectedItem.tsx
|
|
1078
|
+
// src/components/legacy/EntrySearch/DefaultSelectedItem.tsx
|
|
1079
1079
|
import { css as css9 } from "@emotion/react";
|
|
1080
1080
|
import { Icon as Icon2, useOutsideClick as useOutsideClick2 } from "@uniformdev/design-system";
|
|
1081
1081
|
import { useEffect, useRef as useRef2, useState as useState2 } from "react";
|
|
@@ -1093,7 +1093,7 @@ function openWindowWithCloseCallback(href, callback) {
|
|
|
1093
1093
|
}, 500);
|
|
1094
1094
|
}
|
|
1095
1095
|
|
|
1096
|
-
// src/components/EntrySearch/styles/DefaultSelectedItem.styles.ts
|
|
1096
|
+
// src/components/legacy/EntrySearch/styles/DefaultSelectedItem.styles.ts
|
|
1097
1097
|
import { css as css8 } from "@emotion/react";
|
|
1098
1098
|
import { mq as mq2 } from "@uniformdev/design-system";
|
|
1099
1099
|
var selectedItemContainer = css8`
|
|
@@ -1177,7 +1177,7 @@ var selectItemLinkBtn = css8`
|
|
|
1177
1177
|
}
|
|
1178
1178
|
`;
|
|
1179
1179
|
|
|
1180
|
-
// src/components/EntrySearch/DefaultSelectedItem.tsx
|
|
1180
|
+
// src/components/legacy/EntrySearch/DefaultSelectedItem.tsx
|
|
1181
1181
|
import { jsx as jsx20, jsxs as jsxs9 } from "@emotion/react/jsx-runtime";
|
|
1182
1182
|
var DefaultSelectedItem = ({
|
|
1183
1183
|
selectedItem,
|
|
@@ -1360,7 +1360,7 @@ var DefaultSelectedItem = ({
|
|
|
1360
1360
|
] }) }, selectedItem.id);
|
|
1361
1361
|
};
|
|
1362
1362
|
|
|
1363
|
-
// src/components/EntrySearch/EntrySearch.tsx
|
|
1363
|
+
// src/components/legacy/EntrySearch/EntrySearch.tsx
|
|
1364
1364
|
import { css as css11 } from "@emotion/react";
|
|
1365
1365
|
import {
|
|
1366
1366
|
Button,
|
|
@@ -1411,7 +1411,7 @@ function useLoadingDelay(loading, { delay = 500, minDuration = 200 } = {
|
|
|
1411
1411
|
return state === "DISPLAY" || state === "EXPIRE";
|
|
1412
1412
|
}
|
|
1413
1413
|
|
|
1414
|
-
// src/components/EntrySearch/styles/EntrySearch.styles.ts
|
|
1414
|
+
// src/components/legacy/EntrySearch/styles/EntrySearch.styles.ts
|
|
1415
1415
|
import { css as css10 } from "@emotion/react";
|
|
1416
1416
|
var entrySearchWrapper = css10`
|
|
1417
1417
|
background: var(--white);
|
|
@@ -1522,7 +1522,7 @@ var badgeIcon = css10`
|
|
|
1522
1522
|
height: calc(var(--spacing-lg) + var(--spacing-xs));
|
|
1523
1523
|
`;
|
|
1524
1524
|
|
|
1525
|
-
// src/components/EntrySearch/EntrySearch.tsx
|
|
1525
|
+
// src/components/legacy/EntrySearch/EntrySearch.tsx
|
|
1526
1526
|
import { Fragment as Fragment3, jsx as jsx21, jsxs as jsxs10 } from "@emotion/react/jsx-runtime";
|
|
1527
1527
|
var DefaultNoResults = ({ searchText, selectedContentType }) => {
|
|
1528
1528
|
let message = "No content found";
|
|
@@ -2655,18 +2655,6 @@ import { Theme } from "@uniformdev/design-system";
|
|
|
2655
2655
|
import { createContext, useContext as useContext3 } from "react";
|
|
2656
2656
|
import { jsx as jsx26, jsxs as jsxs15 } from "@emotion/react/jsx-runtime";
|
|
2657
2657
|
var UniformMeshSdkContext = createContext(void 0);
|
|
2658
|
-
var UniformMeshSdkContextProvider = ({ children }) => {
|
|
2659
|
-
let value = void 0;
|
|
2660
|
-
if (typeof window !== "undefined" && typeof window.UniformMeshSDK !== "undefined") {
|
|
2661
|
-
value = {
|
|
2662
|
-
sdk: window.UniformMeshSDK
|
|
2663
|
-
};
|
|
2664
|
-
}
|
|
2665
|
-
return /* @__PURE__ */ jsxs15(UniformMeshSdkContext.Provider, { value, children: [
|
|
2666
|
-
/* @__PURE__ */ jsx26(Theme, {}),
|
|
2667
|
-
/* @__PURE__ */ jsx26(UniformMeshLocationContextProvider, { children })
|
|
2668
|
-
] });
|
|
2669
|
-
};
|
|
2670
2658
|
var useUniformMeshSdkContext = () => {
|
|
2671
2659
|
const context = useContext3(UniformMeshSdkContext);
|
|
2672
2660
|
if (!context) {
|
|
@@ -2683,9 +2671,7 @@ function useUniformMeshSdk() {
|
|
|
2683
2671
|
|
|
2684
2672
|
// src/components/UniformMeshLocationContext.tsx
|
|
2685
2673
|
import { jsx as jsx27 } from "@emotion/react/jsx-runtime";
|
|
2686
|
-
var UniformMeshLocationContext = createContext2(
|
|
2687
|
-
void 0
|
|
2688
|
-
);
|
|
2674
|
+
var UniformMeshLocationContext = createContext2(void 0);
|
|
2689
2675
|
var UniformMeshLocationContextProvider = ({
|
|
2690
2676
|
children
|
|
2691
2677
|
}) => {
|
|
@@ -2716,20 +2702,9 @@ var useUniformMeshLocationContext = () => {
|
|
|
2716
2702
|
};
|
|
2717
2703
|
|
|
2718
2704
|
// src/hooks/useMeshLocation.ts
|
|
2719
|
-
var legacyWarned = false;
|
|
2720
2705
|
function useMeshLocation(expectedLocation) {
|
|
2721
2706
|
const { location } = useUniformMeshLocationContext();
|
|
2722
|
-
|
|
2723
|
-
if (expectedLocation === "dataTypeInstance") {
|
|
2724
|
-
effectiveExpected = "dataResource";
|
|
2725
|
-
if (!legacyWarned) {
|
|
2726
|
-
console.warn(
|
|
2727
|
-
"`dataTypeInstance` mesh location is deprecated, please switch to `dataResource` instead."
|
|
2728
|
-
);
|
|
2729
|
-
legacyWarned = true;
|
|
2730
|
-
}
|
|
2731
|
-
}
|
|
2732
|
-
if (effectiveExpected && location.type !== effectiveExpected) {
|
|
2707
|
+
if (expectedLocation && location.type !== expectedLocation) {
|
|
2733
2708
|
throw new Error(`Expected location type ${expectedLocation} but got ${location.type}`);
|
|
2734
2709
|
}
|
|
2735
2710
|
const backdoorLocation = useRef7(location);
|
|
@@ -3216,7 +3191,7 @@ function DataResourceVariablesList({
|
|
|
3216
3191
|
const {
|
|
3217
3192
|
value,
|
|
3218
3193
|
metadata: { dataType }
|
|
3219
|
-
} = useMeshLocation("
|
|
3194
|
+
} = useMeshLocation("dataResource");
|
|
3220
3195
|
const variableDefinitions = variablesToList(dataType.variables);
|
|
3221
3196
|
if (variableDefinitions.length === 0) {
|
|
3222
3197
|
if (NoVariablesComponent) {
|
|
@@ -3962,11 +3937,730 @@ var MeshApp = ({
|
|
|
3962
3937
|
] });
|
|
3963
3938
|
};
|
|
3964
3939
|
|
|
3965
|
-
// src/
|
|
3966
|
-
|
|
3967
|
-
|
|
3968
|
-
|
|
3969
|
-
|
|
3940
|
+
// src/components/ObjectSearch/DataRefreshButton.tsx
|
|
3941
|
+
import { css as css25 } from "@emotion/react";
|
|
3942
|
+
import { Button as Button3, LoadingIndicator as LoadingIndicator3 } from "@uniformdev/design-system";
|
|
3943
|
+
import { jsx as jsx45, jsxs as jsxs26 } from "@emotion/react/jsx-runtime";
|
|
3944
|
+
var DataRefreshButton = ({
|
|
3945
|
+
buttonText,
|
|
3946
|
+
isLoading,
|
|
3947
|
+
onRefreshData,
|
|
3948
|
+
...props
|
|
3949
|
+
}) => {
|
|
3950
|
+
return /* @__PURE__ */ jsxs26(Button3, { buttonType: "primaryInvert", onClick: onRefreshData, disabled: isLoading, ...props, children: [
|
|
3951
|
+
!isLoading ? null : /* @__PURE__ */ jsx45(
|
|
3952
|
+
LoadingIndicator3,
|
|
3953
|
+
{
|
|
3954
|
+
css: css25`
|
|
3955
|
+
${isLoading ? "opacity: 0.2;" : void 0}
|
|
3956
|
+
`
|
|
3957
|
+
}
|
|
3958
|
+
),
|
|
3959
|
+
buttonText
|
|
3960
|
+
] });
|
|
3961
|
+
};
|
|
3962
|
+
|
|
3963
|
+
// src/components/ObjectSearch/ObjectSearchContainer.tsx
|
|
3964
|
+
import { Container, IconsProvider, ScrollableList, VerticalRhythm } from "@uniformdev/design-system";
|
|
3965
|
+
import { jsx as jsx46, jsxs as jsxs27 } from "@emotion/react/jsx-runtime";
|
|
3966
|
+
var ObjectSearchContainer = ({
|
|
3967
|
+
searchFilters,
|
|
3968
|
+
resultList,
|
|
3969
|
+
children
|
|
3970
|
+
}) => {
|
|
3971
|
+
return /* @__PURE__ */ jsx46(IconsProvider, { children: /* @__PURE__ */ jsxs27(VerticalRhythm, { children: [
|
|
3972
|
+
/* @__PURE__ */ jsx46(Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: /* @__PURE__ */ jsxs27(VerticalRhythm, { children: [
|
|
3973
|
+
searchFilters,
|
|
3974
|
+
!resultList ? null : /* @__PURE__ */ jsx46(ScrollableList, { role: "list", children: resultList })
|
|
3975
|
+
] }) }),
|
|
3976
|
+
children
|
|
3977
|
+
] }) });
|
|
3978
|
+
};
|
|
3979
|
+
|
|
3980
|
+
// src/components/ObjectSearch/ObjectSearchFilter.tsx
|
|
3981
|
+
import { InputKeywordSearch as InputKeywordSearch2, InputSelect as InputSelect6 } from "@uniformdev/design-system";
|
|
3982
|
+
import { useState as useState11 } from "react";
|
|
3983
|
+
|
|
3984
|
+
// src/components/ObjectSearch/hooks/ObjectSearchContext.tsx
|
|
3985
|
+
import { createContext as createContext5, useCallback, useContext as useContext7, useDeferredValue, useState as useState10 } from "react";
|
|
3986
|
+
import { jsx as jsx47 } from "@emotion/react/jsx-runtime";
|
|
3987
|
+
var ObjectSearchContext = createContext5({
|
|
3988
|
+
onSetQuery: () => {
|
|
3989
|
+
},
|
|
3990
|
+
onSelectItem: () => {
|
|
3991
|
+
},
|
|
3992
|
+
query: {
|
|
3993
|
+
contentType: "",
|
|
3994
|
+
keyword: ""
|
|
3995
|
+
},
|
|
3996
|
+
list: {},
|
|
3997
|
+
onSetList: () => {
|
|
3998
|
+
},
|
|
3999
|
+
selectedListItems: [],
|
|
4000
|
+
onRemoveAllSelectedItems: () => {
|
|
4001
|
+
}
|
|
4002
|
+
});
|
|
4003
|
+
var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
|
|
4004
|
+
const [query, setQuery] = useState10({
|
|
4005
|
+
contentType: "",
|
|
4006
|
+
keyword: ""
|
|
4007
|
+
});
|
|
4008
|
+
const querySearchDeferred = useDeferredValue(query);
|
|
4009
|
+
const [selectedItems, setSelectedItems] = useState10(currentlySelectedItems != null ? currentlySelectedItems : []);
|
|
4010
|
+
const [list, setList] = useState10({});
|
|
4011
|
+
const onSetQuery = useCallback(
|
|
4012
|
+
(value) => {
|
|
4013
|
+
if (Array.isArray(value.contentType) && value.contentType.length > 0) {
|
|
4014
|
+
return setQuery({
|
|
4015
|
+
...value,
|
|
4016
|
+
contentType: value.contentType[0].id
|
|
4017
|
+
});
|
|
4018
|
+
}
|
|
4019
|
+
return setQuery(value);
|
|
4020
|
+
},
|
|
4021
|
+
[setQuery]
|
|
4022
|
+
);
|
|
4023
|
+
const onSelectItem = useCallback(
|
|
4024
|
+
(selectedResult) => {
|
|
4025
|
+
if (Array.isArray(selectedResult)) {
|
|
4026
|
+
setSelectedItems(selectedResult);
|
|
4027
|
+
} else {
|
|
4028
|
+
if (selectedItems.some((item) => item.id === selectedResult.id)) {
|
|
4029
|
+
setSelectedItems((prev) => prev.filter((item) => item.id !== selectedResult.id));
|
|
4030
|
+
} else {
|
|
4031
|
+
setSelectedItems((prev) => [...prev, selectedResult]);
|
|
4032
|
+
}
|
|
4033
|
+
}
|
|
4034
|
+
},
|
|
4035
|
+
[setSelectedItems, selectedItems]
|
|
4036
|
+
);
|
|
4037
|
+
const onRemoveAllSelectedItems = useCallback(() => {
|
|
4038
|
+
setSelectedItems([]);
|
|
4039
|
+
}, [setSelectedItems]);
|
|
4040
|
+
const onSetList = useCallback(
|
|
4041
|
+
(value) => {
|
|
4042
|
+
setList(value);
|
|
4043
|
+
},
|
|
4044
|
+
[setList]
|
|
4045
|
+
);
|
|
4046
|
+
return /* @__PURE__ */ jsx47(
|
|
4047
|
+
ObjectSearchContext.Provider,
|
|
4048
|
+
{
|
|
4049
|
+
value: {
|
|
4050
|
+
onSetQuery,
|
|
4051
|
+
query: querySearchDeferred,
|
|
4052
|
+
onSelectItem,
|
|
4053
|
+
selectedListItems: selectedItems,
|
|
4054
|
+
onRemoveAllSelectedItems,
|
|
4055
|
+
list,
|
|
4056
|
+
onSetList
|
|
4057
|
+
},
|
|
4058
|
+
children
|
|
4059
|
+
}
|
|
4060
|
+
);
|
|
4061
|
+
};
|
|
4062
|
+
var useObjectSearchContext = () => {
|
|
4063
|
+
const contextValues = useContext7(ObjectSearchContext);
|
|
4064
|
+
return { ...contextValues };
|
|
4065
|
+
};
|
|
4066
|
+
|
|
4067
|
+
// src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
|
|
4068
|
+
import { css as css26 } from "@emotion/react";
|
|
4069
|
+
var ObjectSearchFilterContainerLabel = css26`
|
|
4070
|
+
align-items: center;
|
|
4071
|
+
display: flex;
|
|
4072
|
+
font-size: var(--fs-sm);
|
|
4073
|
+
font-weight: var(--fw-bold);
|
|
4074
|
+
line-height: 1rem;
|
|
4075
|
+
margin-bottom: var(--spacing-sm);
|
|
4076
|
+
`;
|
|
4077
|
+
var ObjectSearchFilterContainer = css26`
|
|
4078
|
+
display: grid;
|
|
4079
|
+
gap: var(--spacing-base);
|
|
4080
|
+
`;
|
|
4081
|
+
var ObjectSearchFilterDropdownAndTextSearch = css26`
|
|
4082
|
+
grid-template-columns: 0.5fr 1fr;
|
|
4083
|
+
`;
|
|
4084
|
+
var ObjectSearchFilterGrid = (gridColumns) => css26`
|
|
4085
|
+
display: grid;
|
|
4086
|
+
grid-template-columns: ${gridColumns};
|
|
4087
|
+
gap: var(--spacing-base);
|
|
4088
|
+
`;
|
|
4089
|
+
|
|
4090
|
+
// src/components/ObjectSearch/ObjectSearchFilter.tsx
|
|
4091
|
+
import { jsx as jsx48, jsxs as jsxs28 } from "@emotion/react/jsx-runtime";
|
|
4092
|
+
var ObjectSearchFilter = ({
|
|
4093
|
+
requireContentType,
|
|
4094
|
+
typeSelectorAllTypesOptionText = "All content types",
|
|
4095
|
+
searchInputName = "searchText",
|
|
4096
|
+
searchInputPlaceholderText = "Enter keyword to narrow your results",
|
|
4097
|
+
selectLabel = "Content Type Select",
|
|
4098
|
+
selectOptions
|
|
4099
|
+
}) => {
|
|
4100
|
+
const { query, onSetQuery } = useObjectSearchContext();
|
|
4101
|
+
const [searchState, setSearchState] = useState11({
|
|
4102
|
+
contentType: "",
|
|
4103
|
+
keyword: ""
|
|
4104
|
+
});
|
|
4105
|
+
const handleFilterChange = (value) => {
|
|
4106
|
+
setSearchState((prev) => {
|
|
4107
|
+
return { ...prev, ...value };
|
|
4108
|
+
});
|
|
4109
|
+
onSetQuery({ ...query, ...value });
|
|
4110
|
+
};
|
|
4111
|
+
return /* @__PURE__ */ jsxs28("fieldset", { css: [ObjectSearchFilterContainer, ObjectSearchFilterDropdownAndTextSearch], children: [
|
|
4112
|
+
/* @__PURE__ */ jsx48(
|
|
4113
|
+
InputSelect6,
|
|
4114
|
+
{
|
|
4115
|
+
label: selectLabel,
|
|
4116
|
+
showLabel: false,
|
|
4117
|
+
onChange: (e) => handleFilterChange({ contentType: e.target.value }),
|
|
4118
|
+
options: [
|
|
4119
|
+
...!requireContentType ? [{ value: "any", label: typeSelectorAllTypesOptionText }] : [],
|
|
4120
|
+
...selectOptions ? selectOptions.map((option) => {
|
|
4121
|
+
var _a;
|
|
4122
|
+
return { name: option == null ? void 0 : option.name, label: (_a = option.label) != null ? _a : option == null ? void 0 : option.name, id: option.id };
|
|
4123
|
+
}) : []
|
|
4124
|
+
],
|
|
4125
|
+
value: query.contentType
|
|
4126
|
+
}
|
|
4127
|
+
),
|
|
4128
|
+
/* @__PURE__ */ jsx48(
|
|
4129
|
+
InputKeywordSearch2,
|
|
4130
|
+
{
|
|
4131
|
+
inputFieldName: searchInputName,
|
|
4132
|
+
placeholder: searchInputPlaceholderText,
|
|
4133
|
+
onSearchTextChanged: (e) => handleFilterChange({ keyword: e }),
|
|
4134
|
+
disabledFieldSubmission: true,
|
|
4135
|
+
onClear: () => handleFilterChange({ keyword: "" }),
|
|
4136
|
+
value: searchState.keyword
|
|
4137
|
+
}
|
|
4138
|
+
)
|
|
4139
|
+
] });
|
|
4140
|
+
};
|
|
4141
|
+
|
|
4142
|
+
// src/components/ObjectSearch/ObjectSearchFilterContainer.tsx
|
|
4143
|
+
import { jsx as jsx49, jsxs as jsxs29 } from "@emotion/react/jsx-runtime";
|
|
4144
|
+
var ObjectSearchFilterContainer2 = ({ label, children }) => {
|
|
4145
|
+
return /* @__PURE__ */ jsxs29("div", { children: [
|
|
4146
|
+
/* @__PURE__ */ jsx49("span", { css: ObjectSearchFilterContainerLabel, children: label }),
|
|
4147
|
+
/* @__PURE__ */ jsx49("div", { css: ObjectSearchFilterContainer, children })
|
|
4148
|
+
] });
|
|
4149
|
+
};
|
|
4150
|
+
|
|
4151
|
+
// src/components/ObjectSearch/ObjectSearchListItem.tsx
|
|
4152
|
+
import { Popover } from "@uniformdev/design-system";
|
|
4153
|
+
|
|
4154
|
+
// src/components/ObjectSearch/styles/ObjectSearchListItem.styles.ts
|
|
4155
|
+
import { css as css27 } from "@emotion/react";
|
|
4156
|
+
import { skeletonLoading } from "@uniformdev/design-system";
|
|
4157
|
+
var ObjectListItemContainer = css27`
|
|
4158
|
+
align-items: center;
|
|
4159
|
+
border: 1px solid var(--gray-300);
|
|
4160
|
+
border-radius: var(--rounded-base);
|
|
4161
|
+
background: var(--white);
|
|
4162
|
+
display: grid;
|
|
4163
|
+
grid-template-columns: 1fr 32px;
|
|
4164
|
+
padding: var(--spacing-sm);
|
|
4165
|
+
|
|
4166
|
+
&[hidden] {
|
|
4167
|
+
display: none;
|
|
4168
|
+
}
|
|
4169
|
+
`;
|
|
4170
|
+
var ObjectListItemLoading = css27`
|
|
4171
|
+
animation: ${skeletonLoading} 1s linear infinite alternate;
|
|
4172
|
+
border-color: transparent;
|
|
4173
|
+
min-height: 42px;
|
|
4174
|
+
position: relative;
|
|
4175
|
+
|
|
4176
|
+
&:before,
|
|
4177
|
+
&:after {
|
|
4178
|
+
background: var(--gray-200);
|
|
4179
|
+
content: '';
|
|
4180
|
+
display: block;
|
|
4181
|
+
height: 1rem;
|
|
4182
|
+
}
|
|
4183
|
+
|
|
4184
|
+
&:before {
|
|
4185
|
+
border-radius: var(--rounded-base);
|
|
4186
|
+
width: 10rem;
|
|
4187
|
+
}
|
|
4188
|
+
|
|
4189
|
+
&:after {
|
|
4190
|
+
border-radius: var(--rounded-full);
|
|
4191
|
+
width: 1rem;
|
|
4192
|
+
}
|
|
4193
|
+
`;
|
|
4194
|
+
var ObjectListItemHeadingGroup = css27`
|
|
4195
|
+
align-items: center;
|
|
4196
|
+
display: grid;
|
|
4197
|
+
`;
|
|
4198
|
+
var ObjectListItemTitle = css27`
|
|
4199
|
+
color: var(--brand-secondary-1);
|
|
4200
|
+
display: block;
|
|
4201
|
+
font-size: var(--fs-sm);
|
|
4202
|
+
`;
|
|
4203
|
+
var ObjectListItemSubtitle = css27`
|
|
4204
|
+
color: var(--gray-500);
|
|
4205
|
+
display: block;
|
|
4206
|
+
font-size: var(--fs-xs);
|
|
4207
|
+
line-height: 1;
|
|
4208
|
+
`;
|
|
4209
|
+
var ObjectListItemInfoContainer = css27`
|
|
4210
|
+
align-items: center;
|
|
4211
|
+
display: flex;
|
|
4212
|
+
justify-content: center;
|
|
4213
|
+
`;
|
|
4214
|
+
var ObjectListItemControlledContent = css27`
|
|
4215
|
+
display: flex;
|
|
4216
|
+
gap: var(--spacing-sm);
|
|
4217
|
+
`;
|
|
4218
|
+
var ObjectListItemUnControlledContent = css27`
|
|
4219
|
+
margin-top: var(--spacing-sm);
|
|
4220
|
+
grid-column: 1 / -1;
|
|
4221
|
+
`;
|
|
4222
|
+
|
|
4223
|
+
// src/components/ObjectSearch/ObjectSearchListItem.tsx
|
|
4224
|
+
import { jsx as jsx50, jsxs as jsxs30 } from "@emotion/react/jsx-runtime";
|
|
4225
|
+
var ObjectSearchListItem = ({
|
|
4226
|
+
id,
|
|
4227
|
+
title,
|
|
4228
|
+
contentType,
|
|
4229
|
+
image,
|
|
4230
|
+
popoverData,
|
|
4231
|
+
onSelect,
|
|
4232
|
+
isMulti = false,
|
|
4233
|
+
children,
|
|
4234
|
+
...props
|
|
4235
|
+
}) => {
|
|
4236
|
+
const { onSelectItem, selectedListItems } = useObjectSearchContext();
|
|
4237
|
+
const formatedContentType = Array.isArray(contentType) ? contentType.join(", ") : contentType;
|
|
4238
|
+
const handleSelectItem = () => {
|
|
4239
|
+
var _a;
|
|
4240
|
+
const extraData = (_a = onSelect == null ? void 0 : onSelect()) != null ? _a : {};
|
|
4241
|
+
const selectedItem = { id, title, contentType, image, popoverData, ...extraData };
|
|
4242
|
+
if (isMulti) {
|
|
4243
|
+
return onSelectItem(selectedItem);
|
|
4244
|
+
}
|
|
4245
|
+
return onSelectItem([selectedItem]);
|
|
4246
|
+
};
|
|
4247
|
+
const hideWhenInSelectedList = selectedListItems.some((item) => item.id === id);
|
|
4248
|
+
return /* @__PURE__ */ jsxs30("div", { role: "listitem", hidden: hideWhenInSelectedList, css: ObjectListItemContainer, ...props, children: [
|
|
4249
|
+
/* @__PURE__ */ jsxs30("div", { role: "button", onClick: handleSelectItem, css: ObjectListItemControlledContent, children: [
|
|
4250
|
+
!image ? null : /* @__PURE__ */ jsx50("img", { ...image, loading: (image == null ? void 0 : image.width) && image.height ? "lazy" : "eager" }),
|
|
4251
|
+
/* @__PURE__ */ jsxs30("div", { role: "heading", css: ObjectListItemHeadingGroup, children: [
|
|
4252
|
+
!contentType ? null : /* @__PURE__ */ jsx50("span", { css: ObjectListItemSubtitle, children: formatedContentType }),
|
|
4253
|
+
/* @__PURE__ */ jsx50("span", { css: ObjectListItemTitle, children: title })
|
|
4254
|
+
] })
|
|
4255
|
+
] }),
|
|
4256
|
+
!popoverData ? null : /* @__PURE__ */ jsx50("div", { css: ObjectListItemInfoContainer, children: /* @__PURE__ */ jsx50(Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData }) }),
|
|
4257
|
+
!children ? null : /* @__PURE__ */ jsx50("div", { css: ObjectListItemUnControlledContent, children })
|
|
4258
|
+
] });
|
|
4259
|
+
};
|
|
4260
|
+
var ObjectSearchListItemLoadingSkeleton = () => {
|
|
4261
|
+
return /* @__PURE__ */ jsx50("div", { role: "presentation", css: [ObjectListItemContainer, ObjectListItemLoading] });
|
|
4262
|
+
};
|
|
4263
|
+
|
|
4264
|
+
// src/components/ObjectSearch/ObjectSearchResultItem.tsx
|
|
4265
|
+
import { Badge, Button as Button4, Popover as Popover2 } from "@uniformdev/design-system";
|
|
4266
|
+
import { format as timeagoFormat } from "timeago.js";
|
|
4267
|
+
|
|
4268
|
+
// src/components/ObjectSearch/styles/ObjectSearchResultItemButton.styles.ts
|
|
4269
|
+
import { css as css28 } from "@emotion/react";
|
|
4270
|
+
import { button as button2 } from "@uniformdev/design-system";
|
|
4271
|
+
var ButtonStyles = css28`
|
|
4272
|
+
${button2}
|
|
4273
|
+
background: transparent;
|
|
4274
|
+
border: 1px solid var(--brand-secondary-1);
|
|
4275
|
+
color: var(--brand-secondary-1);
|
|
4276
|
+
padding: var(--spacing-sm);
|
|
4277
|
+
font-size: var(--fs-sm);
|
|
4278
|
+
line-height: 1;
|
|
4279
|
+
gap: var(--spacing-xs);
|
|
4280
|
+
transition: border-color var(--duration-fast) var(--timing-ease-out),
|
|
4281
|
+
background-color var(--duration-fast) var(--timing-ease-out);
|
|
4282
|
+
|
|
4283
|
+
&:hover {
|
|
4284
|
+
background: var(--gray-100);
|
|
4285
|
+
border-color: var(--gray-300);
|
|
4286
|
+
}
|
|
4287
|
+
|
|
4288
|
+
&:disabled {
|
|
4289
|
+
background: var(--gray-300);
|
|
4290
|
+
border-color: var(--gray-200);
|
|
4291
|
+
color: var(--gray-500);
|
|
4292
|
+
}
|
|
4293
|
+
|
|
4294
|
+
&:link {
|
|
4295
|
+
text-decoration: none;
|
|
4296
|
+
}
|
|
4297
|
+
`;
|
|
4298
|
+
var ButtonIcon = css28`
|
|
4299
|
+
width: 1rem;
|
|
4300
|
+
height: 1rem;
|
|
4301
|
+
`;
|
|
4302
|
+
|
|
4303
|
+
// src/components/ObjectSearch/ObjectSearchResultItemButton.tsx
|
|
4304
|
+
import { jsx as jsx51, jsxs as jsxs31 } from "@emotion/react/jsx-runtime";
|
|
4305
|
+
var ObjectSearchResultItemButton = ({
|
|
4306
|
+
text,
|
|
4307
|
+
icon,
|
|
4308
|
+
...props
|
|
4309
|
+
}) => {
|
|
4310
|
+
return /* @__PURE__ */ jsxs31("button", { type: "button", css: ButtonStyles, ...props, children: [
|
|
4311
|
+
!icon ? null : /* @__PURE__ */ jsx51(Image, { src: icon, css: ButtonIcon }),
|
|
4312
|
+
text
|
|
4313
|
+
] });
|
|
4314
|
+
};
|
|
4315
|
+
var LinkButton = ({
|
|
4316
|
+
text,
|
|
4317
|
+
icon,
|
|
4318
|
+
...props
|
|
4319
|
+
}) => {
|
|
4320
|
+
return /* @__PURE__ */ jsxs31("a", { ...props, css: ButtonStyles, target: "_blank", rel: "noopener noreferrer", children: [
|
|
4321
|
+
!icon ? null : /* @__PURE__ */ jsx51(Image, { src: icon, css: ButtonIcon }),
|
|
4322
|
+
text
|
|
4323
|
+
] });
|
|
4324
|
+
};
|
|
4325
|
+
|
|
4326
|
+
// src/components/ObjectSearch/styles/ObjectSearchResultItem.styles.ts
|
|
4327
|
+
import { css as css29 } from "@emotion/react";
|
|
4328
|
+
var ObjectSearchResultItemContainer = css29`
|
|
4329
|
+
align-items: center;
|
|
4330
|
+
border: 1px solid var(--gray-300);
|
|
4331
|
+
border-radius: var(--rounded-base);
|
|
4332
|
+
background: var(--gray-50);
|
|
4333
|
+
display: grid;
|
|
4334
|
+
grid-template-columns: 1fr auto;
|
|
4335
|
+
padding: var(--spacing-sm) var(--spacing-sm) var(--spacing-sm) var(--spacing-md);
|
|
4336
|
+
position: relative;
|
|
4337
|
+
|
|
4338
|
+
&:hover {
|
|
4339
|
+
.drag-handle {
|
|
4340
|
+
opacity: 1;
|
|
4341
|
+
}
|
|
4342
|
+
}
|
|
4343
|
+
`;
|
|
4344
|
+
var ObjectSearchDragHandle = css29`
|
|
4345
|
+
border-left: 2px dotted var(--gray-300);
|
|
4346
|
+
border-right: 2px dotted var(--gray-300);
|
|
4347
|
+
position: absolute;
|
|
4348
|
+
inset: var(--spacing-sm) auto var(--spacing-sm) var(--spacing-sm);
|
|
4349
|
+
width: 5px;
|
|
4350
|
+
transition: opacity var(--duration-fast) var(--timing-ease-out);
|
|
4351
|
+
opacity: 0;
|
|
4352
|
+
`;
|
|
4353
|
+
var ObjectSearchResultItemSubtitle = css29`
|
|
4354
|
+
color: var(--gray-500);
|
|
4355
|
+
display: block;
|
|
4356
|
+
font-size: var(--fs-xs);
|
|
4357
|
+
line-height: 1;
|
|
4358
|
+
`;
|
|
4359
|
+
var ObjectSearchResultItemTitle = css29`
|
|
4360
|
+
align-items: center;
|
|
4361
|
+
color: var(--brand-secondary-1);
|
|
4362
|
+
display: flex;
|
|
4363
|
+
gap: var(--spacing-xs);
|
|
4364
|
+
`;
|
|
4365
|
+
var ObjectSearchResultItemTimeStamp = css29`
|
|
4366
|
+
color: var(--gray-500);
|
|
4367
|
+
font-size: var(--fs-xs);
|
|
4368
|
+
`;
|
|
4369
|
+
var ObjectSearchAuthorStateGroup = css29`
|
|
4370
|
+
align-items: center;
|
|
4371
|
+
display: flex;
|
|
4372
|
+
gap: var(--spacing-sm);
|
|
4373
|
+
`;
|
|
4374
|
+
var ObjectSearchUpdateGroup = css29`
|
|
4375
|
+
display: grid;
|
|
4376
|
+
`;
|
|
4377
|
+
var ObjectSearchContentContainer = css29`
|
|
4378
|
+
display: flex;
|
|
4379
|
+
gap: var(--spacing-base);
|
|
4380
|
+
`;
|
|
4381
|
+
var ObjectSearchImage = css29`
|
|
4382
|
+
width: 56px;
|
|
4383
|
+
object-fit: contain;
|
|
4384
|
+
`;
|
|
4385
|
+
|
|
4386
|
+
// src/components/ObjectSearch/ObjectSearchResultItem.tsx
|
|
4387
|
+
import { jsx as jsx52, jsxs as jsxs32 } from "@emotion/react/jsx-runtime";
|
|
4388
|
+
var ObjectSearchResultItem = ({
|
|
4389
|
+
id,
|
|
4390
|
+
title,
|
|
4391
|
+
name,
|
|
4392
|
+
contentType,
|
|
4393
|
+
popoverData,
|
|
4394
|
+
publishStatus,
|
|
4395
|
+
editLinkIcon,
|
|
4396
|
+
editLink,
|
|
4397
|
+
imageUrl,
|
|
4398
|
+
onRemove,
|
|
4399
|
+
createdAt,
|
|
4400
|
+
publishedAt,
|
|
4401
|
+
hideRemoveButton = false,
|
|
4402
|
+
disableDnD = false,
|
|
4403
|
+
children
|
|
4404
|
+
}) => {
|
|
4405
|
+
const { onSelectItem } = useObjectSearchContext();
|
|
4406
|
+
const formatedContentType = Array.isArray(contentType) ? contentType.join(", ") : contentType;
|
|
4407
|
+
const onRemoveItem = () => {
|
|
4408
|
+
onSelectItem({ id });
|
|
4409
|
+
onRemove == null ? void 0 : onRemove();
|
|
4410
|
+
};
|
|
4411
|
+
return /* @__PURE__ */ jsxs32("div", { css: ObjectSearchResultItemContainer, children: [
|
|
4412
|
+
disableDnD ? null : /* @__PURE__ */ jsx52("div", { role: "presentation", className: "drag-handle", css: ObjectSearchDragHandle }),
|
|
4413
|
+
/* @__PURE__ */ jsx52("div", { children: /* @__PURE__ */ jsxs32("div", { css: ObjectSearchContentContainer, children: [
|
|
4414
|
+
!imageUrl ? null : /* @__PURE__ */ jsx52("img", { src: imageUrl, alt: `Thumbnail for ${title}`, css: ObjectSearchImage }),
|
|
4415
|
+
/* @__PURE__ */ jsxs32("div", { children: [
|
|
4416
|
+
/* @__PURE__ */ jsx52("span", { css: ObjectSearchResultItemSubtitle, children: formatedContentType }),
|
|
4417
|
+
/* @__PURE__ */ jsxs32("span", { role: "heading", css: ObjectSearchResultItemTitle, children: [
|
|
4418
|
+
title != null ? title : name,
|
|
4419
|
+
!popoverData ? null : /* @__PURE__ */ jsx52(Popover2, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
|
|
4420
|
+
] }),
|
|
4421
|
+
!createdAt && !publishStatus ? null : /* @__PURE__ */ jsxs32("div", { css: ObjectSearchAuthorStateGroup, children: [
|
|
4422
|
+
!(publishStatus == null ? void 0 : publishStatus.text) ? null : /* @__PURE__ */ jsx52(Badge, { ...publishStatus, size: "sm", uppercaseText: true }),
|
|
4423
|
+
!createdAt && !publishedAt ? null : /* @__PURE__ */ jsxs32("div", { css: ObjectSearchUpdateGroup, children: [
|
|
4424
|
+
!createdAt ? null : /* @__PURE__ */ jsxs32("small", { css: ObjectSearchResultItemTimeStamp, children: [
|
|
4425
|
+
/* @__PURE__ */ jsx52("strong", { children: "Last updated: " }),
|
|
4426
|
+
timeagoFormat(createdAt)
|
|
4427
|
+
] }),
|
|
4428
|
+
!publishedAt ? null : /* @__PURE__ */ jsxs32("small", { css: ObjectSearchResultItemTimeStamp, children: [
|
|
4429
|
+
/* @__PURE__ */ jsx52("strong", { children: "Last published: " }),
|
|
4430
|
+
timeagoFormat(publishedAt)
|
|
4431
|
+
] })
|
|
4432
|
+
] })
|
|
4433
|
+
] }),
|
|
4434
|
+
/* @__PURE__ */ jsx52("div", { children })
|
|
4435
|
+
] })
|
|
4436
|
+
] }) }),
|
|
4437
|
+
!editLink && hideRemoveButton ? null : /* @__PURE__ */ jsxs32("div", { css: ObjectSearchAuthorStateGroup, children: [
|
|
4438
|
+
!editLink ? null : /* @__PURE__ */ jsx52(LinkButton, { text: "Edit", href: editLink, icon: editLinkIcon }),
|
|
4439
|
+
hideRemoveButton ? null : /* @__PURE__ */ jsx52(Button4, { buttonType: "ghostDestructive", onClick: onRemoveItem, children: "Remove" })
|
|
4440
|
+
] })
|
|
4441
|
+
] });
|
|
4442
|
+
};
|
|
4443
|
+
|
|
4444
|
+
// src/components/ObjectSearch/ObjectSearchResultList.tsx
|
|
4445
|
+
import { Button as Button5, Counter } from "@uniformdev/design-system";
|
|
4446
|
+
import { DragDropContext as DragDropContext3, Draggable as Draggable3, Droppable as Droppable3 } from "react-beautiful-dnd";
|
|
4447
|
+
|
|
4448
|
+
// src/components/ObjectSearch/styles/ObjectSearchResultList.styles.ts
|
|
4449
|
+
import { css as css30 } from "@emotion/react";
|
|
4450
|
+
var ObjectSearchResultListContainer = css30`
|
|
4451
|
+
align-items: center;
|
|
4452
|
+
display: flex;
|
|
4453
|
+
gap: var(--spacing-sm);
|
|
4454
|
+
justify-content: space-between;
|
|
4455
|
+
`;
|
|
4456
|
+
var ObjectSearchDragContainer = css30`
|
|
4457
|
+
margin: 0 0 var(--spacing-sm);
|
|
4458
|
+
`;
|
|
4459
|
+
var ObjectSearchResultListCounterContainer = css30`
|
|
4460
|
+
align-items: center;
|
|
4461
|
+
display: flex;
|
|
4462
|
+
gap: var(--spacing-sm);
|
|
4463
|
+
`;
|
|
4464
|
+
var ObjectSearchResultListTitle = css30`
|
|
4465
|
+
font-weight: var(--fw-bold);
|
|
4466
|
+
line-height: 1;
|
|
4467
|
+
`;
|
|
4468
|
+
|
|
4469
|
+
// src/components/ObjectSearch/ObjectSearchResultList.tsx
|
|
4470
|
+
import { Fragment as Fragment7, jsx as jsx53, jsxs as jsxs33 } from "@emotion/react/jsx-runtime";
|
|
4471
|
+
var ObjectSearchResultList = ({
|
|
4472
|
+
resultLabelText = "Selected",
|
|
4473
|
+
removeButtonText = "Remove all",
|
|
4474
|
+
onRemoveAllSelected,
|
|
4475
|
+
hideRemoveButton = false,
|
|
4476
|
+
additionalButtons,
|
|
4477
|
+
renderResultComponent = (value) => /* @__PURE__ */ jsx53(ObjectSearchResultItem, { ...value, disableDnD }),
|
|
4478
|
+
multiSelectId,
|
|
4479
|
+
disableDnD = false
|
|
4480
|
+
}) => {
|
|
4481
|
+
const { selectedListItems, onRemoveAllSelectedItems, onSelectItem } = useObjectSearchContext();
|
|
4482
|
+
const handleRemoveAllSelectedItems = () => {
|
|
4483
|
+
onRemoveAllSelectedItems();
|
|
4484
|
+
onRemoveAllSelected == null ? void 0 : onRemoveAllSelected();
|
|
4485
|
+
};
|
|
4486
|
+
const onDragEnd = (res) => {
|
|
4487
|
+
var _a, _b;
|
|
4488
|
+
if (res.destination && res.source.droppableId === ((_a = res.destination) == null ? void 0 : _a.droppableId)) {
|
|
4489
|
+
const result = [...selectedListItems || []];
|
|
4490
|
+
const [removed] = (_b = result == null ? void 0 : result.splice(res.source.index, 1)) != null ? _b : [];
|
|
4491
|
+
result == null ? void 0 : result.splice(res.destination.index, 0, removed);
|
|
4492
|
+
onSelectItem(result);
|
|
4493
|
+
return result;
|
|
4494
|
+
}
|
|
4495
|
+
};
|
|
4496
|
+
return /* @__PURE__ */ jsxs33(Fragment7, { children: [
|
|
4497
|
+
/* @__PURE__ */ jsxs33("div", { role: "group", css: ObjectSearchResultListContainer, children: [
|
|
4498
|
+
/* @__PURE__ */ jsxs33("div", { role: "note", css: ObjectSearchResultListCounterContainer, children: [
|
|
4499
|
+
/* @__PURE__ */ jsx53("span", { css: ObjectSearchResultListTitle, children: resultLabelText }),
|
|
4500
|
+
" ",
|
|
4501
|
+
!selectedListItems.length ? null : /* @__PURE__ */ jsx53(Counter, { count: selectedListItems.length })
|
|
4502
|
+
] }),
|
|
4503
|
+
/* @__PURE__ */ jsxs33("div", { css: ObjectSearchResultListCounterContainer, children: [
|
|
4504
|
+
additionalButtons,
|
|
4505
|
+
hideRemoveButton ? null : /* @__PURE__ */ jsx53(
|
|
4506
|
+
Button5,
|
|
4507
|
+
{
|
|
4508
|
+
buttonType: "ghostDestructive",
|
|
4509
|
+
size: "xs",
|
|
4510
|
+
disabled: selectedListItems.length === 0,
|
|
4511
|
+
onClick: handleRemoveAllSelectedItems,
|
|
4512
|
+
children: removeButtonText
|
|
4513
|
+
}
|
|
4514
|
+
)
|
|
4515
|
+
] })
|
|
4516
|
+
] }),
|
|
4517
|
+
!selectedListItems.length ? null : /* @__PURE__ */ jsx53(DragDropContext3, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx53(Droppable3, { droppableId: multiSelectId != null ? multiSelectId : "canvas-multi-select", children: (provided) => /* @__PURE__ */ jsxs33("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
|
|
4518
|
+
selectedListItems.map((item, i) => {
|
|
4519
|
+
const renderListItem = renderResultComponent(item);
|
|
4520
|
+
return /* @__PURE__ */ jsx53(Draggable3, { draggableId: item.id, index: i, isDragDisabled: disableDnD, children: (provided2, snapshot) => /* @__PURE__ */ jsx53(
|
|
4521
|
+
"div",
|
|
4522
|
+
{
|
|
4523
|
+
css: ObjectSearchDragContainer,
|
|
4524
|
+
ref: provided2.innerRef,
|
|
4525
|
+
"data-dragging": snapshot.isDragging,
|
|
4526
|
+
...provided2.draggableProps,
|
|
4527
|
+
...provided2.dragHandleProps,
|
|
4528
|
+
children: renderListItem
|
|
4529
|
+
}
|
|
4530
|
+
) }, item.id);
|
|
4531
|
+
}),
|
|
4532
|
+
provided.placeholder
|
|
4533
|
+
] }) }) })
|
|
4534
|
+
] });
|
|
4535
|
+
};
|
|
4536
|
+
|
|
4537
|
+
// src/components/ObjectSearch/QueryFilter.tsx
|
|
4538
|
+
import { Input as Input7, InputKeywordSearch as InputKeywordSearch3, InputSelect as InputSelect7 } from "@uniformdev/design-system";
|
|
4539
|
+
import { useEffect as useEffect8, useState as useState12 } from "react";
|
|
4540
|
+
import { jsx as jsx54, jsxs as jsxs34 } from "@emotion/react/jsx-runtime";
|
|
4541
|
+
var QueryFilter = ({
|
|
4542
|
+
requireContentType,
|
|
4543
|
+
queryFilterTitle = "Configure Query",
|
|
4544
|
+
contentTypeLabel = "Filter by content type",
|
|
4545
|
+
typeSelectorAllTypesOptionText = "All content types",
|
|
4546
|
+
contentTypeOptions,
|
|
4547
|
+
searchInputName = "searchText",
|
|
4548
|
+
searchInputPlaceholderText = "Enter keyword to narrow your results",
|
|
4549
|
+
countLabel = "Count",
|
|
4550
|
+
countValue = 5,
|
|
4551
|
+
sortLabel = "Sort",
|
|
4552
|
+
sortOptions,
|
|
4553
|
+
sortOrderLabel = "Sort Order",
|
|
4554
|
+
sortOrderOptions = [
|
|
4555
|
+
{
|
|
4556
|
+
name: "Ascending",
|
|
4557
|
+
id: "asc",
|
|
4558
|
+
label: "Ascending"
|
|
4559
|
+
},
|
|
4560
|
+
{
|
|
4561
|
+
name: "Descending",
|
|
4562
|
+
id: "desc",
|
|
4563
|
+
label: "Descending"
|
|
4564
|
+
}
|
|
4565
|
+
],
|
|
4566
|
+
children
|
|
4567
|
+
}) => {
|
|
4568
|
+
var _a, _b;
|
|
4569
|
+
const { query, onSetQuery } = useObjectSearchContext();
|
|
4570
|
+
const [queryState, setQueryState] = useState12({
|
|
4571
|
+
contentType: "",
|
|
4572
|
+
keyword: "",
|
|
4573
|
+
count: countValue != null ? countValue : 5,
|
|
4574
|
+
sortBy: (_a = sortOptions[0].id) != null ? _a : "",
|
|
4575
|
+
sortOrder: (_b = sortOrderOptions[0].id) != null ? _b : ""
|
|
4576
|
+
});
|
|
4577
|
+
const handleFilterChange = (value) => {
|
|
4578
|
+
setQueryState((prev) => ({ ...prev, ...value }));
|
|
4579
|
+
onSetQuery({ ...query, ...value });
|
|
4580
|
+
};
|
|
4581
|
+
useEffect8(() => {
|
|
4582
|
+
onSetQuery(queryState);
|
|
4583
|
+
}, [onSetQuery, queryState]);
|
|
4584
|
+
return /* @__PURE__ */ jsxs34("fieldset", { children: [
|
|
4585
|
+
/* @__PURE__ */ jsx54("span", { css: ObjectSearchFilterContainerLabel, children: queryFilterTitle }),
|
|
4586
|
+
/* @__PURE__ */ jsxs34("div", { css: ObjectSearchFilterContainer, children: [
|
|
4587
|
+
/* @__PURE__ */ jsxs34("div", { css: ObjectSearchFilterGrid("0.5fr 1fr"), children: [
|
|
4588
|
+
/* @__PURE__ */ jsx54(
|
|
4589
|
+
InputSelect7,
|
|
4590
|
+
{
|
|
4591
|
+
label: contentTypeLabel,
|
|
4592
|
+
showLabel: false,
|
|
4593
|
+
options: [
|
|
4594
|
+
...!requireContentType ? [{ id: "", label: typeSelectorAllTypesOptionText }] : [],
|
|
4595
|
+
...contentTypeOptions ? contentTypeOptions.map((option) => {
|
|
4596
|
+
var _a2;
|
|
4597
|
+
return { id: option.id, label: (_a2 = option.label) != null ? _a2 : option.name, name: option.name };
|
|
4598
|
+
}) : []
|
|
4599
|
+
],
|
|
4600
|
+
onChange: (e) => handleFilterChange({ contentType: e.target.value }),
|
|
4601
|
+
value: queryState.contentType
|
|
4602
|
+
}
|
|
4603
|
+
),
|
|
4604
|
+
/* @__PURE__ */ jsx54(
|
|
4605
|
+
InputKeywordSearch3,
|
|
4606
|
+
{
|
|
4607
|
+
inputFieldName: searchInputName,
|
|
4608
|
+
placeholder: searchInputPlaceholderText,
|
|
4609
|
+
onSearchTextChanged: (e) => handleFilterChange({ keyword: e }),
|
|
4610
|
+
disabledFieldSubmission: true,
|
|
4611
|
+
onClear: () => handleFilterChange({ keyword: "" }),
|
|
4612
|
+
value: queryState.keyword
|
|
4613
|
+
}
|
|
4614
|
+
)
|
|
4615
|
+
] }),
|
|
4616
|
+
/* @__PURE__ */ jsxs34("div", { css: ObjectSearchFilterGrid("repeat(2, 1fr) 0.5fr"), children: [
|
|
4617
|
+
/* @__PURE__ */ jsx54(
|
|
4618
|
+
InputSelect7,
|
|
4619
|
+
{
|
|
4620
|
+
label: sortLabel,
|
|
4621
|
+
options: [
|
|
4622
|
+
{
|
|
4623
|
+
label: "Select a sort",
|
|
4624
|
+
id: ""
|
|
4625
|
+
},
|
|
4626
|
+
...sortOptions ? sortOptions.map((option) => {
|
|
4627
|
+
var _a2;
|
|
4628
|
+
return { id: option.id, name: option.name, label: (_a2 = option.label) != null ? _a2 : option.name };
|
|
4629
|
+
}) : []
|
|
4630
|
+
],
|
|
4631
|
+
onChange: (e) => handleFilterChange({ sortBy: e.target.value }),
|
|
4632
|
+
value: queryState.sortBy
|
|
4633
|
+
}
|
|
4634
|
+
),
|
|
4635
|
+
/* @__PURE__ */ jsx54(
|
|
4636
|
+
InputSelect7,
|
|
4637
|
+
{
|
|
4638
|
+
label: sortOrderLabel,
|
|
4639
|
+
options: [
|
|
4640
|
+
...sortOrderOptions ? sortOrderOptions.map((option) => {
|
|
4641
|
+
var _a2;
|
|
4642
|
+
return { value: option.id, label: (_a2 = option.label) != null ? _a2 : option.name, name: option.name };
|
|
4643
|
+
}) : []
|
|
4644
|
+
],
|
|
4645
|
+
onChange: (e) => handleFilterChange({ sortOrder: e.target.value }),
|
|
4646
|
+
value: queryState.sortOrder
|
|
4647
|
+
}
|
|
4648
|
+
),
|
|
4649
|
+
/* @__PURE__ */ jsx54(
|
|
4650
|
+
Input7,
|
|
4651
|
+
{
|
|
4652
|
+
label: countLabel,
|
|
4653
|
+
type: "number",
|
|
4654
|
+
onChange: (e) => handleFilterChange({ count: e.target.value }),
|
|
4655
|
+
defaultValue: countValue,
|
|
4656
|
+
value: queryState.count
|
|
4657
|
+
}
|
|
4658
|
+
)
|
|
4659
|
+
] }),
|
|
4660
|
+
children
|
|
4661
|
+
] })
|
|
4662
|
+
] });
|
|
4663
|
+
};
|
|
3970
4664
|
|
|
3971
4665
|
// src/hooks/index.ts
|
|
3972
4666
|
import { ParameterShellContext, useParameterShell } from "@uniformdev/design-system";
|
|
@@ -3982,17 +4676,16 @@ function createLocationValidator(setValue, validate) {
|
|
|
3982
4676
|
// src/index.ts
|
|
3983
4677
|
import {
|
|
3984
4678
|
AddListButton as AddListButton2,
|
|
3985
|
-
Button as
|
|
4679
|
+
Button as Button6,
|
|
3986
4680
|
Callout as Callout4,
|
|
3987
4681
|
Heading,
|
|
3988
|
-
Input as
|
|
4682
|
+
Input as Input8,
|
|
3989
4683
|
InputComboBox,
|
|
3990
|
-
InputKeywordSearch as
|
|
3991
|
-
InputSelect as
|
|
4684
|
+
InputKeywordSearch as InputKeywordSearch4,
|
|
4685
|
+
InputSelect as InputSelect8,
|
|
3992
4686
|
InputToggle,
|
|
3993
|
-
InputKeywordSearch as InputKeywordSearch3,
|
|
3994
4687
|
Label,
|
|
3995
|
-
LoadingIndicator as
|
|
4688
|
+
LoadingIndicator as LoadingIndicator4,
|
|
3996
4689
|
LoadingOverlay as LoadingOverlay2,
|
|
3997
4690
|
Menu as Menu3,
|
|
3998
4691
|
MenuItem as MenuItem3,
|
|
@@ -4010,7 +4703,7 @@ import {
|
|
|
4010
4703
|
ParameterTextareaInner,
|
|
4011
4704
|
ParameterToggle,
|
|
4012
4705
|
ParameterToggleInner,
|
|
4013
|
-
ScrollableList,
|
|
4706
|
+
ScrollableList as ScrollableList2,
|
|
4014
4707
|
ScrollableListItem,
|
|
4015
4708
|
Switch,
|
|
4016
4709
|
Textarea,
|
|
@@ -4019,9 +4712,10 @@ import {
|
|
|
4019
4712
|
export * from "@uniformdev/mesh-sdk";
|
|
4020
4713
|
export {
|
|
4021
4714
|
AddListButton2 as AddListButton,
|
|
4022
|
-
|
|
4715
|
+
Button6 as Button,
|
|
4023
4716
|
Callout4 as Callout,
|
|
4024
4717
|
DamSelectedItem,
|
|
4718
|
+
DataRefreshButton,
|
|
4025
4719
|
DataResourceVariablesList,
|
|
4026
4720
|
DataSourceEditor,
|
|
4027
4721
|
DataTypeEditor,
|
|
@@ -4030,19 +4724,28 @@ export {
|
|
|
4030
4724
|
EntrySearch,
|
|
4031
4725
|
Heading,
|
|
4032
4726
|
icons_exports as Icons,
|
|
4033
|
-
|
|
4727
|
+
Input8 as Input,
|
|
4034
4728
|
InputComboBox,
|
|
4035
|
-
|
|
4036
|
-
|
|
4729
|
+
InputKeywordSearch4 as InputKeywordSearch,
|
|
4730
|
+
InputSelect8 as InputSelect,
|
|
4037
4731
|
InputToggle,
|
|
4038
4732
|
InputVariables,
|
|
4039
|
-
InputKeywordSearch3 as KeywordSearchInput,
|
|
4040
4733
|
Label,
|
|
4041
|
-
|
|
4734
|
+
LinkButton,
|
|
4735
|
+
LoadingIndicator4 as LoadingIndicator,
|
|
4042
4736
|
LoadingOverlay2 as LoadingOverlay,
|
|
4043
4737
|
Menu3 as Menu,
|
|
4044
4738
|
MenuItem3 as MenuItem,
|
|
4045
4739
|
MeshApp,
|
|
4740
|
+
ObjectSearchContainer,
|
|
4741
|
+
ObjectSearchFilter,
|
|
4742
|
+
ObjectSearchFilterContainer2 as ObjectSearchFilterContainer,
|
|
4743
|
+
ObjectSearchListItem,
|
|
4744
|
+
ObjectSearchListItemLoadingSkeleton,
|
|
4745
|
+
ObjectSearchProvider,
|
|
4746
|
+
ObjectSearchResultItem,
|
|
4747
|
+
ObjectSearchResultItemButton,
|
|
4748
|
+
ObjectSearchResultList,
|
|
4046
4749
|
ParameterGroup,
|
|
4047
4750
|
ParameterImage,
|
|
4048
4751
|
ParameterImageInner,
|
|
@@ -4065,6 +4768,7 @@ export {
|
|
|
4065
4768
|
ProductSearchContext,
|
|
4066
4769
|
ProductSearchRow,
|
|
4067
4770
|
ProductSelectedItem,
|
|
4771
|
+
QueryFilter,
|
|
4068
4772
|
RequestBody,
|
|
4069
4773
|
RequestHeaders,
|
|
4070
4774
|
RequestMethodSelect,
|
|
@@ -4074,17 +4778,13 @@ export {
|
|
|
4074
4778
|
RequestUrl,
|
|
4075
4779
|
RequestUrlInput,
|
|
4076
4780
|
ResolvableLoadingValue,
|
|
4077
|
-
ScrollableList,
|
|
4781
|
+
ScrollableList2 as ScrollableList,
|
|
4078
4782
|
ScrollableListItem,
|
|
4079
4783
|
SelectionField,
|
|
4080
4784
|
Switch,
|
|
4081
4785
|
TextVariableRenderer,
|
|
4082
4786
|
Textarea,
|
|
4083
4787
|
Theme3 as Theme,
|
|
4084
|
-
UniformMeshLocationContext,
|
|
4085
|
-
UniformMeshLocationContextProvider,
|
|
4086
|
-
UniformMeshSdkContext,
|
|
4087
|
-
UniformMeshSdkContextProvider,
|
|
4088
4788
|
VariableEditor,
|
|
4089
4789
|
VariablesList,
|
|
4090
4790
|
VariablesProvider,
|
|
@@ -4153,18 +4853,15 @@ export {
|
|
|
4153
4853
|
selectedItemTitle,
|
|
4154
4854
|
urlEncodeRequestParameter,
|
|
4155
4855
|
urlEncodeRequestUrl,
|
|
4156
|
-
useInitializeUniformMeshSdk,
|
|
4157
4856
|
useMeshLocation,
|
|
4857
|
+
useObjectSearchContext,
|
|
4158
4858
|
useParameterShell,
|
|
4159
4859
|
useProductQueryContext,
|
|
4160
4860
|
useProductSearchContext,
|
|
4161
4861
|
useRequest,
|
|
4162
4862
|
useRequestHeader,
|
|
4163
4863
|
useRequestParameter,
|
|
4164
|
-
useUniformMeshLocation,
|
|
4165
|
-
useUniformMeshLocationContext,
|
|
4166
4864
|
useUniformMeshSdk,
|
|
4167
|
-
useUniformMeshSdkContext,
|
|
4168
4865
|
useVariables,
|
|
4169
4866
|
variablesToList
|
|
4170
4867
|
};
|