@uniformdev/mesh-sdk-react 19.138.0 → 19.138.1-alpha.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +107 -51
- package/dist/index.d.ts +107 -51
- package/dist/index.esm.js +462 -304
- package/dist/index.js +551 -387
- package/dist/index.mjs +462 -304
- package/package.json +5 -5
package/dist/index.esm.js
CHANGED
|
@@ -2652,6 +2652,9 @@ function DefaultDamItemRenderer({ item }) {
|
|
|
2652
2652
|
] }) : null;
|
|
2653
2653
|
}
|
|
2654
2654
|
|
|
2655
|
+
// src/components/DataResourceDynamicInputProvider.tsx
|
|
2656
|
+
import { createContext as createContext4, useContext as useContext6 } from "react";
|
|
2657
|
+
|
|
2655
2658
|
// src/hooks/useConnectedDataAsVariables.tsx
|
|
2656
2659
|
import { useMemo as useMemo3 } from "react";
|
|
2657
2660
|
function useConnectedDataAsVariables(connectedData) {
|
|
@@ -5374,6 +5377,10 @@ function VariablesList() {
|
|
|
5374
5377
|
|
|
5375
5378
|
// src/components/DataResourceDynamicInputProvider.tsx
|
|
5376
5379
|
import { jsx as jsx45 } from "@emotion/react/jsx-runtime";
|
|
5380
|
+
var DataResourceInputContext = createContext4(void 0);
|
|
5381
|
+
var useDataResourceDynamicInputs = () => {
|
|
5382
|
+
return useContext6(DataResourceInputContext);
|
|
5383
|
+
};
|
|
5377
5384
|
function DataResourceDynamicInputProvider(props) {
|
|
5378
5385
|
const { children, dynamicInputs } = props;
|
|
5379
5386
|
if (dynamicInputs) {
|
|
@@ -5392,7 +5399,7 @@ function DataResourceDynamicInputProviderRenderer({
|
|
|
5392
5399
|
dynamicInputs
|
|
5393
5400
|
}) {
|
|
5394
5401
|
const variables = useDynamicInputsAsVariables(dynamicInputs);
|
|
5395
|
-
return /* @__PURE__ */ jsx45(VariablesProvider, { value: variables, readOnly: true, children });
|
|
5402
|
+
return /* @__PURE__ */ jsx45(DataResourceInputContext.Provider, { value: dynamicInputs, children: /* @__PURE__ */ jsx45(VariablesProvider, { value: variables, readOnly: true, children }) });
|
|
5396
5403
|
}
|
|
5397
5404
|
|
|
5398
5405
|
// src/components/DataResourceVariablesList.tsx
|
|
@@ -6259,22 +6266,23 @@ var DataRefreshButton = ({
|
|
|
6259
6266
|
};
|
|
6260
6267
|
|
|
6261
6268
|
// src/components/ObjectSearch/ObjectSearchContainer.tsx
|
|
6262
|
-
import { css as
|
|
6269
|
+
import { css as css36 } from "@emotion/react";
|
|
6263
6270
|
import { bindVariables } from "@uniformdev/canvas";
|
|
6264
6271
|
import { Callout as Callout5, Container, IconsProvider, ScrollableList, VerticalRhythm as VerticalRhythm2 } from "@uniformdev/design-system";
|
|
6272
|
+
import React12 from "react";
|
|
6265
6273
|
|
|
6266
6274
|
// src/components/ObjectSearch/hooks/ObjectSearchContext.tsx
|
|
6267
6275
|
import { bindVariablesToObject as bindVariablesToObject2 } from "@uniformdev/canvas";
|
|
6268
6276
|
import {
|
|
6269
|
-
createContext as
|
|
6277
|
+
createContext as createContext6,
|
|
6270
6278
|
useCallback as useCallback5,
|
|
6271
|
-
useContext as
|
|
6279
|
+
useContext as useContext8,
|
|
6272
6280
|
useDeferredValue,
|
|
6273
6281
|
useMemo as useMemo14,
|
|
6274
6282
|
useState as useState16
|
|
6275
6283
|
} from "react";
|
|
6276
6284
|
import { jsx as jsx59 } from "@emotion/react/jsx-runtime";
|
|
6277
|
-
var ObjectSearchContext =
|
|
6285
|
+
var ObjectSearchContext = createContext6({
|
|
6278
6286
|
onSetQuery: () => {
|
|
6279
6287
|
},
|
|
6280
6288
|
onSelectItem: () => {
|
|
@@ -6282,8 +6290,6 @@ var ObjectSearchContext = createContext5({
|
|
|
6282
6290
|
query: {},
|
|
6283
6291
|
boundQuery: {},
|
|
6284
6292
|
list: {},
|
|
6285
|
-
onSetList: () => {
|
|
6286
|
-
},
|
|
6287
6293
|
selectedListItems: [],
|
|
6288
6294
|
onRemoveAllSelectedItems: () => {
|
|
6289
6295
|
},
|
|
@@ -6367,7 +6373,7 @@ var ObjectSearchProvider = ({
|
|
|
6367
6373
|
return /* @__PURE__ */ jsx59(ObjectSearchContext.Provider, { value, children });
|
|
6368
6374
|
};
|
|
6369
6375
|
function useObjectSearchContext() {
|
|
6370
|
-
return
|
|
6376
|
+
return useContext8(ObjectSearchContext);
|
|
6371
6377
|
}
|
|
6372
6378
|
function bindQuery(query, inputs) {
|
|
6373
6379
|
const { result, errors } = bindVariablesToObject2({
|
|
@@ -6523,201 +6529,18 @@ var ObjectSearchListItemLoadingSkeleton = () => {
|
|
|
6523
6529
|
return /* @__PURE__ */ jsx60("div", { role: "presentation", css: [ObjectListItemContainer, ObjectListItemLoading] });
|
|
6524
6530
|
};
|
|
6525
6531
|
|
|
6526
|
-
// src/components/ObjectSearch/
|
|
6527
|
-
import {
|
|
6528
|
-
|
|
6529
|
-
label,
|
|
6530
|
-
enableDynamicInputToResultId,
|
|
6531
|
-
searchFilters,
|
|
6532
|
-
resultList,
|
|
6533
|
-
children
|
|
6534
|
-
}) => {
|
|
6535
|
-
var _a, _b;
|
|
6536
|
-
const { onSelectItem, selectedListItems, list } = useObjectSearchContext();
|
|
6537
|
-
const { flatVariables } = useVariables(true);
|
|
6538
|
-
const inputValue = (_b = (_a = selectedListItems == null ? void 0 : selectedListItems[0]) == null ? void 0 : _a.id) != null ? _b : "";
|
|
6539
|
-
const listItems = resultList != null ? resultList : /* @__PURE__ */ jsx61(
|
|
6540
|
-
ScrollableList,
|
|
6541
|
-
{
|
|
6542
|
-
role: "list",
|
|
6543
|
-
css: css33`
|
|
6544
|
-
> div {
|
|
6545
|
-
transition: max-height var(--duration-slow) var(--timing-ease-out);
|
|
6546
|
-
max-height: ${selectedListItems.length === 0 ? "50vh" : "184px"};
|
|
6547
|
-
}
|
|
6548
|
-
`,
|
|
6549
|
-
children: /* @__PURE__ */ jsx61(DefaultResultList, {})
|
|
6550
|
-
}
|
|
6551
|
-
);
|
|
6552
|
-
const body = /* @__PURE__ */ jsxs35(VerticalRhythm2, { children: [
|
|
6553
|
-
searchFilters,
|
|
6554
|
-
listItems
|
|
6555
|
-
] });
|
|
6556
|
-
const handleSelectedVariableChange = (selectedValue) => {
|
|
6557
|
-
var _a2;
|
|
6558
|
-
if (!selectedValue) {
|
|
6559
|
-
onSelectItem([]);
|
|
6560
|
-
return;
|
|
6561
|
-
}
|
|
6562
|
-
const { result, errors } = bindVariables({
|
|
6563
|
-
value: selectedValue,
|
|
6564
|
-
variables: flatVariables,
|
|
6565
|
-
errorPrefix: "Dynamic input"
|
|
6566
|
-
});
|
|
6567
|
-
if (!result) {
|
|
6568
|
-
onSelectItem([]);
|
|
6569
|
-
return;
|
|
6570
|
-
}
|
|
6571
|
-
const item = (_a2 = list.items) == null ? void 0 : _a2.find((i) => i.id === result);
|
|
6572
|
-
onSelectItem([
|
|
6573
|
-
{
|
|
6574
|
-
title: selectedValue,
|
|
6575
|
-
contentType: (errors == null ? void 0 : errors.length) ? errors[0] instanceof Error ? errors[0].message : errors[0] : `Current dynamic value "${result}" is not an ID in the options`,
|
|
6576
|
-
// spread any matched list item, overriding the above default props
|
|
6577
|
-
...item,
|
|
6578
|
-
// we want to make sure the ID is our dynamic value
|
|
6579
|
-
id: selectedValue
|
|
6580
|
-
}
|
|
6581
|
-
]);
|
|
6582
|
-
};
|
|
6583
|
-
return /* @__PURE__ */ jsx61(IconsProvider, { children: /* @__PURE__ */ jsxs35(VerticalRhythm2, { children: [
|
|
6584
|
-
/* @__PURE__ */ jsx61(Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: label ? /* @__PURE__ */ jsx61(
|
|
6585
|
-
InputVariables,
|
|
6586
|
-
{
|
|
6587
|
-
label,
|
|
6588
|
-
value: inputValue,
|
|
6589
|
-
onChange: (value) => {
|
|
6590
|
-
if (value === inputValue) {
|
|
6591
|
-
return;
|
|
6592
|
-
}
|
|
6593
|
-
handleSelectedVariableChange(value);
|
|
6594
|
-
},
|
|
6595
|
-
inputWhenNoVariables: body,
|
|
6596
|
-
disableVariables: !enableDynamicInputToResultId
|
|
6597
|
-
}
|
|
6598
|
-
) : body }),
|
|
6599
|
-
children
|
|
6600
|
-
] }) });
|
|
6601
|
-
};
|
|
6602
|
-
var DefaultResultList = () => {
|
|
6603
|
-
var _a;
|
|
6604
|
-
const { list } = useObjectSearchContext();
|
|
6605
|
-
if (!list.items) {
|
|
6606
|
-
return Array.from(Array(5).keys()).map((i) => /* @__PURE__ */ jsx61(ObjectSearchListItemLoadingSkeleton, {}, i));
|
|
6607
|
-
}
|
|
6608
|
-
if (list.items.length === 0) {
|
|
6609
|
-
return /* @__PURE__ */ jsx61(Callout5, { type: "info", children: "No results were found" });
|
|
6610
|
-
}
|
|
6611
|
-
return (_a = list.items) == null ? void 0 : _a.map((item) => /* @__PURE__ */ jsx61(ObjectSearchListItem, { ...item }, item.id));
|
|
6612
|
-
};
|
|
6613
|
-
|
|
6614
|
-
// src/components/ObjectSearch/ObjectSearchFilter.tsx
|
|
6615
|
-
import { DebouncedInputKeywordSearch, InputSelect as InputSelect6 } from "@uniformdev/design-system";
|
|
6616
|
-
import { useMemo as useMemo15, useState as useState17 } from "react";
|
|
6617
|
-
|
|
6618
|
-
// src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
|
|
6619
|
-
import { css as css34 } from "@emotion/react";
|
|
6620
|
-
var ObjectSearchFilterContainerLabel = css34`
|
|
6621
|
-
align-items: center;
|
|
6622
|
-
display: flex;
|
|
6623
|
-
font-size: var(--fs-sm);
|
|
6624
|
-
font-weight: var(--fw-bold);
|
|
6625
|
-
line-height: 1rem;
|
|
6626
|
-
margin-bottom: var(--spacing-sm);
|
|
6627
|
-
`;
|
|
6628
|
-
var ObjectSearchFilterContainer = css34`
|
|
6629
|
-
display: grid;
|
|
6630
|
-
gap: var(--spacing-base);
|
|
6631
|
-
`;
|
|
6632
|
-
var ObjectSearchFilterGrid = (gridColumns) => css34`
|
|
6633
|
-
display: grid;
|
|
6634
|
-
grid-template-columns: ${gridColumns};
|
|
6635
|
-
gap: var(--spacing-base);
|
|
6636
|
-
`;
|
|
6637
|
-
|
|
6638
|
-
// src/components/ObjectSearch/ObjectSearchFilter.tsx
|
|
6639
|
-
import { jsx as jsx62, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
|
|
6640
|
-
var ObjectSearchFilter = ({
|
|
6641
|
-
requireContentType,
|
|
6642
|
-
typeSelectorAllTypesOptionText = "All content types",
|
|
6643
|
-
searchInputName = "searchText",
|
|
6644
|
-
searchInputPlaceholderText = "Enter keyword to narrow your results",
|
|
6645
|
-
selectLabel = "Content Type Select",
|
|
6646
|
-
selectOptions
|
|
6647
|
-
}) => {
|
|
6648
|
-
var _a, _b;
|
|
6649
|
-
const { query, onSetQuery } = useObjectSearchContext();
|
|
6650
|
-
const [searchState, setSearchState] = useState17({
|
|
6651
|
-
contentType: (_a = query.contentType) != null ? _a : "",
|
|
6652
|
-
keyword: (_b = query.keyword) != null ? _b : ""
|
|
6653
|
-
});
|
|
6654
|
-
const handleFilterChange = (value) => {
|
|
6655
|
-
setSearchState((prev) => {
|
|
6656
|
-
return { ...prev, ...value };
|
|
6657
|
-
});
|
|
6658
|
-
onSetQuery({ ...query, ...value });
|
|
6659
|
-
};
|
|
6660
|
-
const memoizedSelectOptions = useMemo15(() => {
|
|
6661
|
-
if (!requireContentType && !(selectOptions == null ? void 0 : selectOptions.length)) {
|
|
6662
|
-
return [];
|
|
6663
|
-
}
|
|
6664
|
-
return [
|
|
6665
|
-
...!requireContentType ? [{ value: "any", label: typeSelectorAllTypesOptionText }] : [],
|
|
6666
|
-
...selectOptions != null ? selectOptions : []
|
|
6667
|
-
];
|
|
6668
|
-
}, [requireContentType, typeSelectorAllTypesOptionText, selectOptions]);
|
|
6669
|
-
const shouldRenderSelect = memoizedSelectOptions.length > 0;
|
|
6670
|
-
return /* @__PURE__ */ jsxs36(
|
|
6671
|
-
"fieldset",
|
|
6672
|
-
{
|
|
6673
|
-
css: [
|
|
6674
|
-
ObjectSearchFilterContainer,
|
|
6675
|
-
ObjectSearchFilterGrid(shouldRenderSelect ? "1fr 2fr" : "1fr")
|
|
6676
|
-
],
|
|
6677
|
-
children: [
|
|
6678
|
-
memoizedSelectOptions.length ? /* @__PURE__ */ jsx62(
|
|
6679
|
-
InputSelect6,
|
|
6680
|
-
{
|
|
6681
|
-
label: selectLabel,
|
|
6682
|
-
showLabel: false,
|
|
6683
|
-
onChange: (e) => handleFilterChange({ contentType: e.target.value }),
|
|
6684
|
-
options: memoizedSelectOptions,
|
|
6685
|
-
value: query.contentType
|
|
6686
|
-
}
|
|
6687
|
-
) : null,
|
|
6688
|
-
/* @__PURE__ */ jsx62(
|
|
6689
|
-
DebouncedInputKeywordSearch,
|
|
6690
|
-
{
|
|
6691
|
-
inputFieldName: searchInputName,
|
|
6692
|
-
placeholder: searchInputPlaceholderText,
|
|
6693
|
-
onSearchTextChanged: (keyword) => handleFilterChange({ keyword }),
|
|
6694
|
-
disabledFieldSubmission: true,
|
|
6695
|
-
defaultValue: searchState.keyword,
|
|
6696
|
-
delay: 300
|
|
6697
|
-
}
|
|
6698
|
-
)
|
|
6699
|
-
]
|
|
6700
|
-
}
|
|
6701
|
-
);
|
|
6702
|
-
};
|
|
6703
|
-
|
|
6704
|
-
// src/components/ObjectSearch/ObjectSearchFilterContainer.tsx
|
|
6705
|
-
import { jsx as jsx63, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
|
|
6706
|
-
var ObjectSearchFilterContainer2 = ({ label, children }) => {
|
|
6707
|
-
return /* @__PURE__ */ jsxs37("div", { children: [
|
|
6708
|
-
label ? /* @__PURE__ */ jsx63("span", { css: ObjectSearchFilterContainerLabel, children: label }) : null,
|
|
6709
|
-
/* @__PURE__ */ jsx63("div", { css: ObjectSearchFilterContainer, children })
|
|
6710
|
-
] });
|
|
6711
|
-
};
|
|
6532
|
+
// src/components/ObjectSearch/ObjectSearchResultList.tsx
|
|
6533
|
+
import { Button as Button5, Counter } from "@uniformdev/design-system";
|
|
6534
|
+
import { Draggable as Draggable3, Droppable as Droppable3 } from "react-beautiful-dnd";
|
|
6712
6535
|
|
|
6713
6536
|
// src/components/ObjectSearch/ObjectSearchResultItem.tsx
|
|
6714
6537
|
import { Badge, Button as Button4, Popover as Popover2 } from "@uniformdev/design-system";
|
|
6715
6538
|
import { format as timeagoFormat } from "timeago.js";
|
|
6716
6539
|
|
|
6717
6540
|
// src/components/ObjectSearch/styles/ObjectSearchResultItemButton.styles.ts
|
|
6718
|
-
import { css as
|
|
6541
|
+
import { css as css33 } from "@emotion/react";
|
|
6719
6542
|
import { button as button2 } from "@uniformdev/design-system";
|
|
6720
|
-
var ButtonStyles =
|
|
6543
|
+
var ButtonStyles = css33`
|
|
6721
6544
|
${button2}
|
|
6722
6545
|
background: transparent;
|
|
6723
6546
|
border: 1px solid var(--typography-base);
|
|
@@ -6744,20 +6567,20 @@ var ButtonStyles = css35`
|
|
|
6744
6567
|
text-decoration: none;
|
|
6745
6568
|
}
|
|
6746
6569
|
`;
|
|
6747
|
-
var ButtonIcon =
|
|
6570
|
+
var ButtonIcon = css33`
|
|
6748
6571
|
width: 1rem;
|
|
6749
6572
|
height: 1rem;
|
|
6750
6573
|
`;
|
|
6751
6574
|
|
|
6752
6575
|
// src/components/ObjectSearch/ObjectSearchResultItemButton.tsx
|
|
6753
|
-
import { jsx as
|
|
6576
|
+
import { jsx as jsx61, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
|
|
6754
6577
|
var ObjectSearchResultItemButton = ({
|
|
6755
6578
|
text,
|
|
6756
6579
|
icon,
|
|
6757
6580
|
...props
|
|
6758
6581
|
}) => {
|
|
6759
|
-
return /* @__PURE__ */
|
|
6760
|
-
!icon ? null : /* @__PURE__ */
|
|
6582
|
+
return /* @__PURE__ */ jsxs35("button", { type: "button", css: ButtonStyles, ...props, children: [
|
|
6583
|
+
!icon ? null : /* @__PURE__ */ jsx61(Image, { src: icon, css: ButtonIcon }),
|
|
6761
6584
|
text
|
|
6762
6585
|
] });
|
|
6763
6586
|
};
|
|
@@ -6766,15 +6589,15 @@ var LinkButton = ({
|
|
|
6766
6589
|
icon,
|
|
6767
6590
|
...props
|
|
6768
6591
|
}) => {
|
|
6769
|
-
return /* @__PURE__ */
|
|
6770
|
-
!icon ? null : /* @__PURE__ */
|
|
6592
|
+
return /* @__PURE__ */ jsxs35("a", { ...props, css: ButtonStyles, target: "_blank", rel: "noopener noreferrer", children: [
|
|
6593
|
+
!icon ? null : /* @__PURE__ */ jsx61(Image, { src: icon, css: ButtonIcon }),
|
|
6771
6594
|
text
|
|
6772
6595
|
] });
|
|
6773
6596
|
};
|
|
6774
6597
|
|
|
6775
6598
|
// src/components/ObjectSearch/styles/ObjectSearchResultItem.styles.ts
|
|
6776
|
-
import { css as
|
|
6777
|
-
var ObjectSearchResultItemContainer =
|
|
6599
|
+
import { css as css34 } from "@emotion/react";
|
|
6600
|
+
var ObjectSearchResultItemContainer = css34`
|
|
6778
6601
|
align-items: center;
|
|
6779
6602
|
border: 1px solid var(--gray-300);
|
|
6780
6603
|
border-radius: var(--rounded-base);
|
|
@@ -6790,7 +6613,7 @@ var ObjectSearchResultItemContainer = css36`
|
|
|
6790
6613
|
}
|
|
6791
6614
|
}
|
|
6792
6615
|
`;
|
|
6793
|
-
var ObjectSearchDragHandle =
|
|
6616
|
+
var ObjectSearchDragHandle = css34`
|
|
6794
6617
|
border-left: 2px dotted var(--gray-300);
|
|
6795
6618
|
border-right: 2px dotted var(--gray-300);
|
|
6796
6619
|
position: absolute;
|
|
@@ -6799,41 +6622,41 @@ var ObjectSearchDragHandle = css36`
|
|
|
6799
6622
|
transition: opacity var(--duration-fast) var(--timing-ease-out);
|
|
6800
6623
|
opacity: 0;
|
|
6801
6624
|
`;
|
|
6802
|
-
var ObjectSearchResultItemSubtitle =
|
|
6625
|
+
var ObjectSearchResultItemSubtitle = css34`
|
|
6803
6626
|
color: var(--gray-500);
|
|
6804
6627
|
display: block;
|
|
6805
6628
|
font-size: var(--fs-xs);
|
|
6806
6629
|
line-height: 1;
|
|
6807
6630
|
`;
|
|
6808
|
-
var ObjectSearchResultItemTitle =
|
|
6631
|
+
var ObjectSearchResultItemTitle = css34`
|
|
6809
6632
|
align-items: center;
|
|
6810
6633
|
color: var(--typography-base);
|
|
6811
6634
|
display: flex;
|
|
6812
6635
|
gap: var(--spacing-xs);
|
|
6813
6636
|
`;
|
|
6814
|
-
var ObjectSearchResultItemTimeStamp =
|
|
6637
|
+
var ObjectSearchResultItemTimeStamp = css34`
|
|
6815
6638
|
color: var(--gray-500);
|
|
6816
6639
|
font-size: var(--fs-xs);
|
|
6817
6640
|
`;
|
|
6818
|
-
var ObjectSearchAuthorStateGroup =
|
|
6641
|
+
var ObjectSearchAuthorStateGroup = css34`
|
|
6819
6642
|
align-items: center;
|
|
6820
6643
|
display: flex;
|
|
6821
6644
|
gap: var(--spacing-sm);
|
|
6822
6645
|
`;
|
|
6823
|
-
var ObjectSearchUpdateGroup =
|
|
6646
|
+
var ObjectSearchUpdateGroup = css34`
|
|
6824
6647
|
display: grid;
|
|
6825
6648
|
`;
|
|
6826
|
-
var ObjectSearchContentContainer =
|
|
6649
|
+
var ObjectSearchContentContainer = css34`
|
|
6827
6650
|
display: flex;
|
|
6828
6651
|
gap: var(--spacing-base);
|
|
6829
6652
|
`;
|
|
6830
|
-
var ObjectSearchImage =
|
|
6653
|
+
var ObjectSearchImage = css34`
|
|
6831
6654
|
width: 56px;
|
|
6832
6655
|
object-fit: contain;
|
|
6833
6656
|
`;
|
|
6834
6657
|
|
|
6835
6658
|
// src/components/ObjectSearch/ObjectSearchResultItem.tsx
|
|
6836
|
-
import { jsx as
|
|
6659
|
+
import { jsx as jsx62, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
|
|
6837
6660
|
var ObjectSearchResultItem = ({
|
|
6838
6661
|
id,
|
|
6839
6662
|
title,
|
|
@@ -6857,70 +6680,66 @@ var ObjectSearchResultItem = ({
|
|
|
6857
6680
|
onSelectItem({ id, title: id });
|
|
6858
6681
|
onRemove == null ? void 0 : onRemove();
|
|
6859
6682
|
};
|
|
6860
|
-
return /* @__PURE__ */
|
|
6861
|
-
disableDnD ? null : /* @__PURE__ */
|
|
6862
|
-
/* @__PURE__ */
|
|
6863
|
-
!imageUrl ? null : /* @__PURE__ */
|
|
6864
|
-
/* @__PURE__ */
|
|
6865
|
-
/* @__PURE__ */
|
|
6866
|
-
/* @__PURE__ */
|
|
6683
|
+
return /* @__PURE__ */ jsxs36("div", { css: ObjectSearchResultItemContainer, "data-testid": "search-result-item", children: [
|
|
6684
|
+
disableDnD ? null : /* @__PURE__ */ jsx62("div", { role: "presentation", className: "drag-handle", css: ObjectSearchDragHandle }),
|
|
6685
|
+
/* @__PURE__ */ jsx62("div", { children: /* @__PURE__ */ jsxs36("div", { css: ObjectSearchContentContainer, children: [
|
|
6686
|
+
!imageUrl ? null : /* @__PURE__ */ jsx62("img", { src: imageUrl, alt: `Thumbnail for ${title}`, css: ObjectSearchImage }),
|
|
6687
|
+
/* @__PURE__ */ jsxs36("div", { children: [
|
|
6688
|
+
/* @__PURE__ */ jsx62("span", { css: ObjectSearchResultItemSubtitle, "data-testid": "sub-title", children: formatedContentType }),
|
|
6689
|
+
/* @__PURE__ */ jsxs36("span", { role: "heading", css: ObjectSearchResultItemTitle, "data-testid": "title", children: [
|
|
6867
6690
|
title != null ? title : name,
|
|
6868
|
-
!popoverData ? null : /* @__PURE__ */
|
|
6691
|
+
!popoverData ? null : /* @__PURE__ */ jsx62(Popover2, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
|
|
6869
6692
|
] }),
|
|
6870
|
-
!createdAt && !publishStatus ? null : /* @__PURE__ */
|
|
6871
|
-
!(publishStatus == null ? void 0 : publishStatus.text) ? null : /* @__PURE__ */
|
|
6872
|
-
!createdAt && !publishedAt ? null : /* @__PURE__ */
|
|
6873
|
-
!createdAt ? null : /* @__PURE__ */
|
|
6874
|
-
/* @__PURE__ */
|
|
6693
|
+
!createdAt && !publishStatus ? null : /* @__PURE__ */ jsxs36("div", { css: ObjectSearchAuthorStateGroup, children: [
|
|
6694
|
+
!(publishStatus == null ? void 0 : publishStatus.text) ? null : /* @__PURE__ */ jsx62(Badge, { ...publishStatus, size: "sm", uppercaseText: true }),
|
|
6695
|
+
!createdAt && !publishedAt ? null : /* @__PURE__ */ jsxs36("div", { css: ObjectSearchUpdateGroup, children: [
|
|
6696
|
+
!createdAt ? null : /* @__PURE__ */ jsxs36("small", { css: ObjectSearchResultItemTimeStamp, children: [
|
|
6697
|
+
/* @__PURE__ */ jsx62("strong", { children: "Last updated: " }),
|
|
6875
6698
|
timeagoFormat(createdAt)
|
|
6876
6699
|
] }),
|
|
6877
|
-
!publishedAt ? null : /* @__PURE__ */
|
|
6878
|
-
/* @__PURE__ */
|
|
6700
|
+
!publishedAt ? null : /* @__PURE__ */ jsxs36("small", { css: ObjectSearchResultItemTimeStamp, children: [
|
|
6701
|
+
/* @__PURE__ */ jsx62("strong", { children: "Last published: " }),
|
|
6879
6702
|
timeagoFormat(publishedAt)
|
|
6880
6703
|
] })
|
|
6881
6704
|
] })
|
|
6882
6705
|
] }),
|
|
6883
|
-
/* @__PURE__ */
|
|
6706
|
+
/* @__PURE__ */ jsx62("div", { children })
|
|
6884
6707
|
] })
|
|
6885
6708
|
] }) }),
|
|
6886
|
-
!editLink && hideRemoveButton ? null : /* @__PURE__ */
|
|
6887
|
-
!editLink ? null : /* @__PURE__ */
|
|
6888
|
-
hideRemoveButton ? null : /* @__PURE__ */
|
|
6709
|
+
!editLink && hideRemoveButton ? null : /* @__PURE__ */ jsxs36("div", { css: ObjectSearchAuthorStateGroup, children: [
|
|
6710
|
+
!editLink ? null : /* @__PURE__ */ jsx62(LinkButton, { text: "Edit", href: editLink, icon: editLinkIcon }),
|
|
6711
|
+
hideRemoveButton ? null : /* @__PURE__ */ jsx62(Button4, { buttonType: "ghostDestructive", onClick: onRemoveItem, children: "Remove" })
|
|
6889
6712
|
] })
|
|
6890
6713
|
] });
|
|
6891
6714
|
};
|
|
6892
6715
|
|
|
6893
|
-
// src/components/ObjectSearch/ObjectSearchResultList.tsx
|
|
6894
|
-
import { Button as Button5, Counter } from "@uniformdev/design-system";
|
|
6895
|
-
import { Draggable as Draggable3, Droppable as Droppable3 } from "react-beautiful-dnd";
|
|
6896
|
-
|
|
6897
6716
|
// src/components/ObjectSearch/styles/ObjectSearchResultList.styles.ts
|
|
6898
|
-
import { css as
|
|
6899
|
-
var ObjectSearchResultListContainer =
|
|
6717
|
+
import { css as css35 } from "@emotion/react";
|
|
6718
|
+
var ObjectSearchResultListContainer = css35`
|
|
6900
6719
|
align-items: center;
|
|
6901
6720
|
display: flex;
|
|
6902
6721
|
gap: var(--spacing-sm);
|
|
6903
6722
|
justify-content: space-between;
|
|
6904
6723
|
`;
|
|
6905
|
-
var ObjectSearchDragContainer =
|
|
6724
|
+
var ObjectSearchDragContainer = css35`
|
|
6906
6725
|
margin: 0 0 var(--spacing-sm);
|
|
6907
6726
|
`;
|
|
6908
|
-
var ObjectSearchContainerDragging =
|
|
6727
|
+
var ObjectSearchContainerDragging = css35`
|
|
6909
6728
|
box-shadow: var(--shadow-base);
|
|
6910
6729
|
opacity: var(--opacity-50);
|
|
6911
6730
|
`;
|
|
6912
|
-
var ObjectSearchResultListCounterContainer =
|
|
6731
|
+
var ObjectSearchResultListCounterContainer = css35`
|
|
6913
6732
|
align-items: center;
|
|
6914
6733
|
display: flex;
|
|
6915
6734
|
gap: var(--spacing-sm);
|
|
6916
6735
|
`;
|
|
6917
|
-
var ObjectSearchResultListTitle =
|
|
6736
|
+
var ObjectSearchResultListTitle = css35`
|
|
6918
6737
|
font-weight: var(--fw-bold);
|
|
6919
6738
|
line-height: 1;
|
|
6920
6739
|
`;
|
|
6921
6740
|
|
|
6922
6741
|
// src/components/ObjectSearch/ObjectSearchResultList.tsx
|
|
6923
|
-
import { Fragment as Fragment13, jsx as
|
|
6742
|
+
import { Fragment as Fragment13, jsx as jsx63, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
|
|
6924
6743
|
function ObjectSearchResultList({
|
|
6925
6744
|
resultLabelText = "Selected",
|
|
6926
6745
|
removeButtonText = "Remove all",
|
|
@@ -6928,7 +6747,7 @@ function ObjectSearchResultList({
|
|
|
6928
6747
|
hideRemoveButton = false,
|
|
6929
6748
|
resultLabelOverride,
|
|
6930
6749
|
additionalButtons,
|
|
6931
|
-
renderResultComponent = (value) => /* @__PURE__ */
|
|
6750
|
+
renderResultComponent = (value) => /* @__PURE__ */ jsx63(ObjectSearchResultItem, { ...value }),
|
|
6932
6751
|
multiSelectId,
|
|
6933
6752
|
disableDnD = false,
|
|
6934
6753
|
getContainerForDnDReparenting,
|
|
@@ -6955,7 +6774,7 @@ function ObjectSearchResultList({
|
|
|
6955
6774
|
...item,
|
|
6956
6775
|
disableDnD: selectedListItems.length === 1 || disableDnD
|
|
6957
6776
|
});
|
|
6958
|
-
return /* @__PURE__ */
|
|
6777
|
+
return /* @__PURE__ */ jsx63(
|
|
6959
6778
|
"div",
|
|
6960
6779
|
{
|
|
6961
6780
|
css: [
|
|
@@ -6970,16 +6789,16 @@ function ObjectSearchResultList({
|
|
|
6970
6789
|
}
|
|
6971
6790
|
);
|
|
6972
6791
|
};
|
|
6973
|
-
return /* @__PURE__ */
|
|
6974
|
-
/* @__PURE__ */
|
|
6975
|
-
!resultLabelOverride ? /* @__PURE__ */
|
|
6976
|
-
/* @__PURE__ */
|
|
6792
|
+
return /* @__PURE__ */ jsxs37(Fragment13, { children: [
|
|
6793
|
+
/* @__PURE__ */ jsxs37("div", { role: "group", css: ObjectSearchResultListContainer, children: [
|
|
6794
|
+
!resultLabelOverride ? /* @__PURE__ */ jsxs37("div", { role: "note", css: ObjectSearchResultListCounterContainer, children: [
|
|
6795
|
+
/* @__PURE__ */ jsx63("span", { css: ObjectSearchResultListTitle, children: resultLabelText }),
|
|
6977
6796
|
" ",
|
|
6978
|
-
!selectedListItems.length ? null : /* @__PURE__ */
|
|
6797
|
+
!selectedListItems.length ? null : /* @__PURE__ */ jsx63(Counter, { count: selectedListItems.length })
|
|
6979
6798
|
] }) : resultLabelOverride,
|
|
6980
|
-
/* @__PURE__ */
|
|
6799
|
+
/* @__PURE__ */ jsxs37("div", { css: ObjectSearchResultListCounterContainer, children: [
|
|
6981
6800
|
additionalButtons,
|
|
6982
|
-
hideRemoveButton ? null : /* @__PURE__ */
|
|
6801
|
+
hideRemoveButton ? null : /* @__PURE__ */ jsx63(
|
|
6983
6802
|
Button5,
|
|
6984
6803
|
{
|
|
6985
6804
|
buttonType: "ghostDestructive",
|
|
@@ -6991,15 +6810,15 @@ function ObjectSearchResultList({
|
|
|
6991
6810
|
)
|
|
6992
6811
|
] })
|
|
6993
6812
|
] }),
|
|
6994
|
-
!selectedListItems.length ? whenNothingSelected : /* @__PURE__ */
|
|
6813
|
+
!selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ jsx63(DragDropContext, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx63(
|
|
6995
6814
|
Droppable3,
|
|
6996
6815
|
{
|
|
6997
6816
|
droppableId: multiSelectId != null ? multiSelectId : "canvas-multi-select",
|
|
6998
6817
|
renderClone: getContainerForDnDReparenting ? getDraggableItem : void 0,
|
|
6999
6818
|
getContainerForClone: getContainerForDnDReparenting,
|
|
7000
|
-
children: (provided) => /* @__PURE__ */
|
|
6819
|
+
children: (provided) => /* @__PURE__ */ jsxs37("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
|
|
7001
6820
|
selectedListItems.map((item, i) => {
|
|
7002
|
-
return /* @__PURE__ */
|
|
6821
|
+
return /* @__PURE__ */ jsx63(
|
|
7003
6822
|
Draggable3,
|
|
7004
6823
|
{
|
|
7005
6824
|
draggableId: item.id,
|
|
@@ -7017,9 +6836,273 @@ function ObjectSearchResultList({
|
|
|
7017
6836
|
] });
|
|
7018
6837
|
}
|
|
7019
6838
|
|
|
6839
|
+
// src/components/ObjectSearch/ObjectSearchContainer.tsx
|
|
6840
|
+
import { Fragment as Fragment14, jsx as jsx64, jsxs as jsxs38 } from "@emotion/react/jsx-runtime";
|
|
6841
|
+
var ObjectSearchContainer = ({
|
|
6842
|
+
label,
|
|
6843
|
+
enableDynamicInputToResultId,
|
|
6844
|
+
searchFilters,
|
|
6845
|
+
resultList,
|
|
6846
|
+
children = /* @__PURE__ */ jsx64(ObjectSearchResultList, {})
|
|
6847
|
+
}) => {
|
|
6848
|
+
var _a, _b;
|
|
6849
|
+
const { onSelectItem, selectedListItems, list, dynamicEntryId, onSetQuery, query } = useObjectSearchContext();
|
|
6850
|
+
const { flatVariables } = useVariables(true);
|
|
6851
|
+
const inputValue = (_b = dynamicEntryId != null ? dynamicEntryId : (_a = selectedListItems[0]) == null ? void 0 : _a.id) != null ? _b : "";
|
|
6852
|
+
const isDynamicEntryIdAvailable = React12.useMemo(
|
|
6853
|
+
() => Boolean(inputValue && hasReferencedVariables(inputValue)),
|
|
6854
|
+
[inputValue]
|
|
6855
|
+
);
|
|
6856
|
+
const listItems = resultList != null ? resultList : /* @__PURE__ */ jsx64(
|
|
6857
|
+
ScrollableList,
|
|
6858
|
+
{
|
|
6859
|
+
role: "list",
|
|
6860
|
+
css: css36`
|
|
6861
|
+
> div {
|
|
6862
|
+
transition: max-height var(--duration-slow) var(--timing-ease-out);
|
|
6863
|
+
max-height: ${selectedListItems.length === 0 ? "50vh" : "184px"};
|
|
6864
|
+
}
|
|
6865
|
+
`,
|
|
6866
|
+
children: /* @__PURE__ */ jsx64(DefaultResultList, {})
|
|
6867
|
+
}
|
|
6868
|
+
);
|
|
6869
|
+
const handleSelectedVariableChange = (selectedValue) => {
|
|
6870
|
+
var _a2;
|
|
6871
|
+
if (!selectedValue) {
|
|
6872
|
+
onSelectItem([]);
|
|
6873
|
+
return;
|
|
6874
|
+
}
|
|
6875
|
+
const { result, errors } = bindVariables({
|
|
6876
|
+
value: selectedValue,
|
|
6877
|
+
variables: flatVariables,
|
|
6878
|
+
errorPrefix: "Dynamic input"
|
|
6879
|
+
});
|
|
6880
|
+
if (!result) {
|
|
6881
|
+
onSelectItem([]);
|
|
6882
|
+
return;
|
|
6883
|
+
}
|
|
6884
|
+
const item = (_a2 = list.items) == null ? void 0 : _a2.find((i) => i.id === result);
|
|
6885
|
+
onSelectItem([
|
|
6886
|
+
{
|
|
6887
|
+
title: selectedValue,
|
|
6888
|
+
contentType: (errors == null ? void 0 : errors.length) ? errors[0] instanceof Error ? errors[0].message : errors[0] : `Current dynamic value "${result}" is not an ID in the options`,
|
|
6889
|
+
// spread any matched list item, overriding the above default props
|
|
6890
|
+
...item,
|
|
6891
|
+
// we want to make sure the ID is our dynamic value
|
|
6892
|
+
id: selectedValue
|
|
6893
|
+
}
|
|
6894
|
+
]);
|
|
6895
|
+
if (hasReferencedVariables(selectedValue)) {
|
|
6896
|
+
onSetQuery({ ...query, dynamicEntryId: selectedValue });
|
|
6897
|
+
}
|
|
6898
|
+
};
|
|
6899
|
+
const showSearchList = !label || !isDynamicEntryIdAvailable || !enableDynamicInputToResultId;
|
|
6900
|
+
return /* @__PURE__ */ jsx64(IconsProvider, { children: /* @__PURE__ */ jsxs38(VerticalRhythm2, { children: [
|
|
6901
|
+
/* @__PURE__ */ jsx64(Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: /* @__PURE__ */ jsxs38(VerticalRhythm2, { children: [
|
|
6902
|
+
label ? /* @__PURE__ */ jsx64(
|
|
6903
|
+
InputVariables,
|
|
6904
|
+
{
|
|
6905
|
+
id: "entryId",
|
|
6906
|
+
label,
|
|
6907
|
+
value: inputValue,
|
|
6908
|
+
onChange: (value) => {
|
|
6909
|
+
if (value === inputValue) {
|
|
6910
|
+
return;
|
|
6911
|
+
}
|
|
6912
|
+
handleSelectedVariableChange(value);
|
|
6913
|
+
},
|
|
6914
|
+
inputWhenNoVariables: /* @__PURE__ */ jsx64(Fragment14, { children: searchFilters }),
|
|
6915
|
+
disableVariables: !enableDynamicInputToResultId
|
|
6916
|
+
}
|
|
6917
|
+
) : searchFilters,
|
|
6918
|
+
showSearchList ? listItems : null
|
|
6919
|
+
] }) }),
|
|
6920
|
+
children
|
|
6921
|
+
] }) });
|
|
6922
|
+
};
|
|
6923
|
+
var DefaultResultList = () => {
|
|
6924
|
+
var _a, _b;
|
|
6925
|
+
const { list, isListLoading } = useObjectSearchContext();
|
|
6926
|
+
if (isListLoading || !list.items) {
|
|
6927
|
+
return Array.from(Array(5).keys()).map((i) => /* @__PURE__ */ jsx64(ObjectSearchListItemLoadingSkeleton, {}, i));
|
|
6928
|
+
}
|
|
6929
|
+
if (((_a = list.items) == null ? void 0 : _a.length) === 0) {
|
|
6930
|
+
return /* @__PURE__ */ jsx64(Callout5, { type: "info", children: "No results were found" });
|
|
6931
|
+
}
|
|
6932
|
+
return (_b = list.items) == null ? void 0 : _b.map((item) => /* @__PURE__ */ jsx64(ObjectSearchListItem, { ...item }, item.id));
|
|
6933
|
+
};
|
|
6934
|
+
|
|
6935
|
+
// src/components/ObjectSearch/ObjectSearchFilter.tsx
|
|
6936
|
+
import { DebouncedInputKeywordSearch, InputSelect as InputSelect6, VerticalRhythm as VerticalRhythm3 } from "@uniformdev/design-system";
|
|
6937
|
+
import { useMemo as useMemo15, useState as useState17 } from "react";
|
|
6938
|
+
import { useDebounce as useDebounce4 } from "react-use";
|
|
6939
|
+
|
|
6940
|
+
// src/utils/createLocationValidator.ts
|
|
6941
|
+
function createLocationValidator(setValue, validate) {
|
|
6942
|
+
return (dispatch) => setValue((previous) => {
|
|
6943
|
+
const { newValue, options } = dispatch(previous);
|
|
6944
|
+
return { newValue, options: validate(newValue, options) };
|
|
6945
|
+
});
|
|
6946
|
+
}
|
|
6947
|
+
|
|
6948
|
+
// src/utils/useContentDataResourceLocaleInfo.ts
|
|
6949
|
+
import { bindVariables as bindVariables2, createVariableReference as createVariableReference4, LOCALE_DYNAMIC_INPUT_NAME as LOCALE_DYNAMIC_INPUT_NAME2 } from "@uniformdev/canvas";
|
|
6950
|
+
import { useEffect as useEffect16, useRef as useRef15 } from "react";
|
|
6951
|
+
function useContentDataResourceLocaleInfo({
|
|
6952
|
+
locale,
|
|
6953
|
+
setLocale,
|
|
6954
|
+
dynamicInputs
|
|
6955
|
+
}) {
|
|
6956
|
+
var _a;
|
|
6957
|
+
const setLocaleRef = useRef15(setLocale);
|
|
6958
|
+
setLocaleRef.current = setLocale;
|
|
6959
|
+
const { flatVariables } = useVariables();
|
|
6960
|
+
const effectiveLocale = locale != null ? locale : dynamicInputs[LOCALE_DYNAMIC_INPUT_NAME2] ? createVariableReference4(LOCALE_DYNAMIC_INPUT_NAME2) : "";
|
|
6961
|
+
const boundLocale = (_a = bindVariables2({ variables: flatVariables, value: effectiveLocale }).result) != null ? _a : effectiveLocale;
|
|
6962
|
+
useEffect16(() => {
|
|
6963
|
+
if (locale === void 0 && effectiveLocale && setLocaleRef.current) {
|
|
6964
|
+
setLocaleRef.current(createVariableReference4(LOCALE_DYNAMIC_INPUT_NAME2));
|
|
6965
|
+
}
|
|
6966
|
+
}, [locale, effectiveLocale]);
|
|
6967
|
+
return { effectiveLocale, boundLocale: boundLocale ? boundLocale : void 0 };
|
|
6968
|
+
}
|
|
6969
|
+
|
|
6970
|
+
// src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
|
|
6971
|
+
import { css as css37 } from "@emotion/react";
|
|
6972
|
+
var ObjectSearchFilterContainerLabel = css37`
|
|
6973
|
+
align-items: center;
|
|
6974
|
+
display: flex;
|
|
6975
|
+
font-size: var(--fs-sm);
|
|
6976
|
+
font-weight: var(--fw-bold);
|
|
6977
|
+
line-height: 1rem;
|
|
6978
|
+
margin-bottom: var(--spacing-sm);
|
|
6979
|
+
`;
|
|
6980
|
+
var ObjectSearchFilterContainer = css37`
|
|
6981
|
+
display: grid;
|
|
6982
|
+
gap: var(--spacing-base);
|
|
6983
|
+
`;
|
|
6984
|
+
var ObjectSearchFilterGrid = (gridColumns) => css37`
|
|
6985
|
+
display: grid;
|
|
6986
|
+
grid-template-columns: ${gridColumns};
|
|
6987
|
+
gap: var(--spacing-base);
|
|
6988
|
+
`;
|
|
6989
|
+
|
|
6990
|
+
// src/components/ObjectSearch/ObjectSearchFilter.tsx
|
|
6991
|
+
import { jsx as jsx65, jsxs as jsxs39 } from "@emotion/react/jsx-runtime";
|
|
6992
|
+
var ObjectSearchFilter = ({
|
|
6993
|
+
requireContentType,
|
|
6994
|
+
typeSelectorAllTypesOptionText = "All content types",
|
|
6995
|
+
searchInputName = "searchText",
|
|
6996
|
+
searchInputPlaceholderText = "Enter keyword to narrow your results",
|
|
6997
|
+
selectLabel = "Content Type Select",
|
|
6998
|
+
localeFilterLabel = "Filter by locale",
|
|
6999
|
+
selectOptions
|
|
7000
|
+
}) => {
|
|
7001
|
+
var _a, _b, _c;
|
|
7002
|
+
const { query, onSetQuery, localeOptions, enableFilterByLocale } = useObjectSearchContext();
|
|
7003
|
+
const dynamicInputs = useDataResourceDynamicInputs();
|
|
7004
|
+
const { boundLocale = "", effectiveLocale } = useContentDataResourceLocaleInfo({
|
|
7005
|
+
locale: query.locale,
|
|
7006
|
+
dynamicInputs: dynamicInputs != null ? dynamicInputs : {},
|
|
7007
|
+
setLocale: (newLocale) => handleFilterChange({ locale: newLocale != null ? newLocale : "" })
|
|
7008
|
+
});
|
|
7009
|
+
const [searchState, setSearchState] = useState17({
|
|
7010
|
+
keyword: (_a = query.keyword) != null ? _a : "",
|
|
7011
|
+
contentType: (_b = query.contentType) != null ? _b : "",
|
|
7012
|
+
locale: (_c = query.locale) != null ? _c : ""
|
|
7013
|
+
});
|
|
7014
|
+
const handleFilterChange = (value) => {
|
|
7015
|
+
setSearchState((prev) => {
|
|
7016
|
+
return { ...prev, ...value };
|
|
7017
|
+
});
|
|
7018
|
+
};
|
|
7019
|
+
useDebounce4(
|
|
7020
|
+
() => {
|
|
7021
|
+
onSetQuery({ ...query, ...searchState });
|
|
7022
|
+
},
|
|
7023
|
+
500,
|
|
7024
|
+
[searchState]
|
|
7025
|
+
);
|
|
7026
|
+
const memoizedSelectOptions = useMemo15(() => {
|
|
7027
|
+
if (!requireContentType && !(selectOptions == null ? void 0 : selectOptions.length)) {
|
|
7028
|
+
return [];
|
|
7029
|
+
}
|
|
7030
|
+
return [
|
|
7031
|
+
...!requireContentType ? [{ value: "any", label: typeSelectorAllTypesOptionText }] : [],
|
|
7032
|
+
...selectOptions != null ? selectOptions : []
|
|
7033
|
+
];
|
|
7034
|
+
}, [requireContentType, typeSelectorAllTypesOptionText, selectOptions]);
|
|
7035
|
+
const shouldRenderSelect = memoizedSelectOptions.length > 0;
|
|
7036
|
+
return /* @__PURE__ */ jsxs39(VerticalRhythm3, { gap: "base", children: [
|
|
7037
|
+
/* @__PURE__ */ jsxs39(
|
|
7038
|
+
"fieldset",
|
|
7039
|
+
{
|
|
7040
|
+
css: [
|
|
7041
|
+
ObjectSearchFilterContainer,
|
|
7042
|
+
ObjectSearchFilterGrid(shouldRenderSelect ? "1fr 2fr" : "1fr")
|
|
7043
|
+
],
|
|
7044
|
+
children: [
|
|
7045
|
+
memoizedSelectOptions.length ? /* @__PURE__ */ jsx65(
|
|
7046
|
+
InputSelect6,
|
|
7047
|
+
{
|
|
7048
|
+
label: selectLabel,
|
|
7049
|
+
showLabel: false,
|
|
7050
|
+
onChange: (e) => handleFilterChange({ contentType: e.target.value }),
|
|
7051
|
+
options: memoizedSelectOptions,
|
|
7052
|
+
value: query.contentType,
|
|
7053
|
+
"data-testid": "select-entry"
|
|
7054
|
+
}
|
|
7055
|
+
) : null,
|
|
7056
|
+
/* @__PURE__ */ jsx65(
|
|
7057
|
+
DebouncedInputKeywordSearch,
|
|
7058
|
+
{
|
|
7059
|
+
inputFieldName: searchInputName,
|
|
7060
|
+
placeholder: searchInputPlaceholderText,
|
|
7061
|
+
onSearchTextChanged: (keyword) => handleFilterChange({ keyword }),
|
|
7062
|
+
disabledFieldSubmission: true,
|
|
7063
|
+
defaultValue: searchState.keyword,
|
|
7064
|
+
delay: 300
|
|
7065
|
+
}
|
|
7066
|
+
)
|
|
7067
|
+
]
|
|
7068
|
+
}
|
|
7069
|
+
),
|
|
7070
|
+
enableFilterByLocale && (localeOptions == null ? void 0 : localeOptions.length) && /* @__PURE__ */ jsx65(
|
|
7071
|
+
InputVariables,
|
|
7072
|
+
{
|
|
7073
|
+
label: localeFilterLabel,
|
|
7074
|
+
id: "locale",
|
|
7075
|
+
value: effectiveLocale,
|
|
7076
|
+
onChange: (newLocale) => handleFilterChange({ locale: newLocale != null ? newLocale : "" }),
|
|
7077
|
+
disableInlineMenu: true,
|
|
7078
|
+
inputWhenNoVariables: /* @__PURE__ */ jsx65(
|
|
7079
|
+
InputSelect6,
|
|
7080
|
+
{
|
|
7081
|
+
id: "locale",
|
|
7082
|
+
options: localeOptions,
|
|
7083
|
+
name: "locale",
|
|
7084
|
+
label: "",
|
|
7085
|
+
value: boundLocale,
|
|
7086
|
+
onChange: (e) => handleFilterChange({ locale: e.target.value })
|
|
7087
|
+
}
|
|
7088
|
+
)
|
|
7089
|
+
}
|
|
7090
|
+
)
|
|
7091
|
+
] });
|
|
7092
|
+
};
|
|
7093
|
+
|
|
7094
|
+
// src/components/ObjectSearch/ObjectSearchFilterContainer.tsx
|
|
7095
|
+
import { jsx as jsx66, jsxs as jsxs40 } from "@emotion/react/jsx-runtime";
|
|
7096
|
+
var ObjectSearchFilterContainer2 = ({ label, children }) => {
|
|
7097
|
+
return /* @__PURE__ */ jsxs40("div", { children: [
|
|
7098
|
+
label ? /* @__PURE__ */ jsx66("span", { css: ObjectSearchFilterContainerLabel, children: label }) : null,
|
|
7099
|
+
/* @__PURE__ */ jsx66("div", { css: ObjectSearchFilterContainer, children })
|
|
7100
|
+
] });
|
|
7101
|
+
};
|
|
7102
|
+
|
|
7020
7103
|
// src/components/ObjectSearch/QueryFilter.tsx
|
|
7021
|
-
import { DebouncedInputKeywordSearch as DebouncedInputKeywordSearch2, Input as Input5, InputSelect as InputSelect7, VerticalRhythm as
|
|
7022
|
-
import { useEffect as
|
|
7104
|
+
import { DebouncedInputKeywordSearch as DebouncedInputKeywordSearch2, Input as Input5, InputSelect as InputSelect7, VerticalRhythm as VerticalRhythm4 } from "@uniformdev/design-system";
|
|
7105
|
+
import { useEffect as useEffect17, useState as useState18 } from "react";
|
|
7023
7106
|
import { jsx as jsx67, jsxs as jsxs41 } from "@emotion/react/jsx-runtime";
|
|
7024
7107
|
var QueryFilter = ({
|
|
7025
7108
|
requireContentType,
|
|
@@ -7060,12 +7143,12 @@ var QueryFilter = ({
|
|
|
7060
7143
|
setQueryState((prev) => ({ ...prev, ...value }));
|
|
7061
7144
|
onSetQuery({ ...query, ...value });
|
|
7062
7145
|
};
|
|
7063
|
-
|
|
7146
|
+
useEffect17(() => {
|
|
7064
7147
|
onSetQuery(queryState);
|
|
7065
7148
|
}, []);
|
|
7066
7149
|
return /* @__PURE__ */ jsxs41("fieldset", { children: [
|
|
7067
7150
|
/* @__PURE__ */ jsx67("span", { css: ObjectSearchFilterContainerLabel, children: queryFilterTitle }),
|
|
7068
|
-
/* @__PURE__ */ jsx67("div", { css: ObjectSearchFilterContainer, children: /* @__PURE__ */ jsxs41(
|
|
7151
|
+
/* @__PURE__ */ jsx67("div", { css: ObjectSearchFilterContainer, children: /* @__PURE__ */ jsxs41(VerticalRhythm4, { children: [
|
|
7069
7152
|
/* @__PURE__ */ jsx67(
|
|
7070
7153
|
InputVariables,
|
|
7071
7154
|
{
|
|
@@ -7185,9 +7268,108 @@ var QueryFilter = ({
|
|
|
7185
7268
|
] });
|
|
7186
7269
|
};
|
|
7187
7270
|
|
|
7188
|
-
// src/components/
|
|
7189
|
-
import {
|
|
7271
|
+
// src/components/ObjectSearch/ObjectSearchListOfSearchResults.tsx
|
|
7272
|
+
import { Callout as Callout6 } from "@uniformdev/design-system";
|
|
7190
7273
|
import { jsx as jsx68 } from "@emotion/react/jsx-runtime";
|
|
7274
|
+
function ObjectSearchListOfSearchResults() {
|
|
7275
|
+
var _a, _b;
|
|
7276
|
+
const { list, isListLoading } = useObjectSearchContext();
|
|
7277
|
+
if (isListLoading) {
|
|
7278
|
+
return Array.from(Array(5).keys()).map((i) => /* @__PURE__ */ jsx68(ObjectSearchListItemLoadingSkeleton, {}, i));
|
|
7279
|
+
}
|
|
7280
|
+
if (((_a = list.items) == null ? void 0 : _a.length) === 0) {
|
|
7281
|
+
return /* @__PURE__ */ jsx68(Callout6, { type: "info", children: "No results were found" });
|
|
7282
|
+
}
|
|
7283
|
+
return (_b = list.items) == null ? void 0 : _b.map((item) => /* @__PURE__ */ jsx68(ObjectSearchListItem, { ...item }, item.id));
|
|
7284
|
+
}
|
|
7285
|
+
|
|
7286
|
+
// src/components/ObjectSearch/hooks/ControlledObjectSearchProvider.tsx
|
|
7287
|
+
import { useCallback as useCallback6, useDeferredValue as useDeferredValue2, useMemo as useMemo16 } from "react";
|
|
7288
|
+
import { jsx as jsx69 } from "@emotion/react/jsx-runtime";
|
|
7289
|
+
var ControlledObjectSearchProvider = ({
|
|
7290
|
+
selectedItems,
|
|
7291
|
+
searchResultItems,
|
|
7292
|
+
selectedItemsLoading,
|
|
7293
|
+
searchResultListLoading,
|
|
7294
|
+
searchResultItemsLoading,
|
|
7295
|
+
onQueryChange,
|
|
7296
|
+
onSelectItemsChange,
|
|
7297
|
+
isMulti = false,
|
|
7298
|
+
children,
|
|
7299
|
+
query,
|
|
7300
|
+
enableFilterByLocale,
|
|
7301
|
+
localeOptions,
|
|
7302
|
+
dynamicEntryId
|
|
7303
|
+
}) => {
|
|
7304
|
+
const { flatVariables } = useVariables(true);
|
|
7305
|
+
const querySearchDeferred = useDeferredValue2(query);
|
|
7306
|
+
const onSetQuery = useCallback6(
|
|
7307
|
+
(value2) => {
|
|
7308
|
+
const newQuery = { ...query, ...value2 };
|
|
7309
|
+
onQueryChange(newQuery);
|
|
7310
|
+
},
|
|
7311
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
7312
|
+
[onQueryChange]
|
|
7313
|
+
);
|
|
7314
|
+
const onSelectItem = useCallback6(
|
|
7315
|
+
(selectedResult) => {
|
|
7316
|
+
if (Array.isArray(selectedResult)) {
|
|
7317
|
+
onSelectItemsChange(selectedResult);
|
|
7318
|
+
} else {
|
|
7319
|
+
if (selectedItems == null ? void 0 : selectedItems.some((item) => item.id === selectedResult.id)) {
|
|
7320
|
+
onSelectItemsChange(selectedItems.filter((item) => item.id !== selectedResult.id));
|
|
7321
|
+
} else {
|
|
7322
|
+
onSelectItemsChange([...selectedItems != null ? selectedItems : [], selectedResult]);
|
|
7323
|
+
}
|
|
7324
|
+
}
|
|
7325
|
+
},
|
|
7326
|
+
[onSelectItemsChange, selectedItems]
|
|
7327
|
+
);
|
|
7328
|
+
const onRemoveAllSelectedItems = useCallback6(() => {
|
|
7329
|
+
onSelectItemsChange([]);
|
|
7330
|
+
}, [onSelectItemsChange]);
|
|
7331
|
+
const list = useMemo16(() => ({ items: searchResultItems }), [searchResultItems]);
|
|
7332
|
+
const boundQuery = useMemo16(() => bindQuery(query, flatVariables), [query, flatVariables]);
|
|
7333
|
+
const value = useMemo16(
|
|
7334
|
+
() => ({
|
|
7335
|
+
boundQuery,
|
|
7336
|
+
onSetQuery,
|
|
7337
|
+
query: querySearchDeferred,
|
|
7338
|
+
onSelectItem,
|
|
7339
|
+
selectedListItems: selectedItems != null ? selectedItems : [],
|
|
7340
|
+
onRemoveAllSelectedItems,
|
|
7341
|
+
list,
|
|
7342
|
+
selectedItemsLoading,
|
|
7343
|
+
searchResultItemsLoading,
|
|
7344
|
+
searchResultListLoading,
|
|
7345
|
+
isMulti,
|
|
7346
|
+
localeOptions,
|
|
7347
|
+
enableFilterByLocale,
|
|
7348
|
+
dynamicEntryId
|
|
7349
|
+
}),
|
|
7350
|
+
[
|
|
7351
|
+
boundQuery,
|
|
7352
|
+
onSetQuery,
|
|
7353
|
+
querySearchDeferred,
|
|
7354
|
+
onSelectItem,
|
|
7355
|
+
selectedItems,
|
|
7356
|
+
selectedItemsLoading,
|
|
7357
|
+
searchResultItemsLoading,
|
|
7358
|
+
onRemoveAllSelectedItems,
|
|
7359
|
+
searchResultListLoading,
|
|
7360
|
+
list,
|
|
7361
|
+
isMulti,
|
|
7362
|
+
localeOptions,
|
|
7363
|
+
enableFilterByLocale,
|
|
7364
|
+
dynamicEntryId
|
|
7365
|
+
]
|
|
7366
|
+
);
|
|
7367
|
+
return /* @__PURE__ */ jsx69(ObjectSearchContext.Provider, { value, children });
|
|
7368
|
+
};
|
|
7369
|
+
|
|
7370
|
+
// src/components/ParamTypeDynamicDataProvider.tsx
|
|
7371
|
+
import { useEffect as useEffect18, useMemo as useMemo17, useRef as useRef16 } from "react";
|
|
7372
|
+
import { jsx as jsx70 } from "@emotion/react/jsx-runtime";
|
|
7191
7373
|
function ParamTypeDynamicDataProvider(props) {
|
|
7192
7374
|
const { children } = props;
|
|
7193
7375
|
const {
|
|
@@ -7195,11 +7377,11 @@ function ParamTypeDynamicDataProvider(props) {
|
|
|
7195
7377
|
} = useMeshLocation("paramType");
|
|
7196
7378
|
const dynamicInputsAsVariables = useDynamicInputsAsVariables(dynamicInputs);
|
|
7197
7379
|
const connectedDataAsVariables = useConnectedDataAsVariables(connectedData);
|
|
7198
|
-
const variables =
|
|
7380
|
+
const variables = useMemo17(
|
|
7199
7381
|
() => ({ ...connectedDataAsVariables, ...dynamicInputsAsVariables }),
|
|
7200
7382
|
[dynamicInputsAsVariables, connectedDataAsVariables]
|
|
7201
7383
|
);
|
|
7202
|
-
return /* @__PURE__ */
|
|
7384
|
+
return /* @__PURE__ */ jsx70(VariablesProvider, { value: variables, onChange: () => {
|
|
7203
7385
|
}, editVariableComponent: JsonMeshVariableEditor, children });
|
|
7204
7386
|
}
|
|
7205
7387
|
var JsonMeshVariableEditor = ({
|
|
@@ -7208,9 +7390,9 @@ var JsonMeshVariableEditor = ({
|
|
|
7208
7390
|
variable,
|
|
7209
7391
|
context
|
|
7210
7392
|
}) => {
|
|
7211
|
-
const sillyRef =
|
|
7393
|
+
const sillyRef = useRef16(false);
|
|
7212
7394
|
const { editConnectedData } = useMeshLocation("paramType");
|
|
7213
|
-
|
|
7395
|
+
useEffect18(() => {
|
|
7214
7396
|
if (sillyRef.current) {
|
|
7215
7397
|
return;
|
|
7216
7398
|
}
|
|
@@ -7244,13 +7426,13 @@ import {
|
|
|
7244
7426
|
FilterMultiChoiceEditor
|
|
7245
7427
|
} from "@uniformdev/design-system";
|
|
7246
7428
|
import { DateEditor, FilterSingleChoiceEditor, NumberEditor, TextEditor } from "@uniformdev/design-system";
|
|
7247
|
-
import { jsx as
|
|
7429
|
+
import { jsx as jsx71 } from "@emotion/react/jsx-runtime";
|
|
7248
7430
|
function withInputVariables(WrappedComponent) {
|
|
7249
7431
|
const WithInputVariables = (props) => {
|
|
7250
7432
|
if (Array.isArray(props.value) || !props.bindable || props.disabled || props.readOnly) {
|
|
7251
|
-
return /* @__PURE__ */
|
|
7433
|
+
return /* @__PURE__ */ jsx71(WrappedComponent, { ...props });
|
|
7252
7434
|
}
|
|
7253
|
-
return /* @__PURE__ */
|
|
7435
|
+
return /* @__PURE__ */ jsx71(
|
|
7254
7436
|
InputVariables,
|
|
7255
7437
|
{
|
|
7256
7438
|
disableInlineMenu: true,
|
|
@@ -7258,7 +7440,7 @@ function withInputVariables(WrappedComponent) {
|
|
|
7258
7440
|
onChange: (newValue) => props.onChange(newValue != null ? newValue : ""),
|
|
7259
7441
|
value: props.value,
|
|
7260
7442
|
disabled: props.disabled,
|
|
7261
|
-
inputWhenNoVariables: /* @__PURE__ */
|
|
7443
|
+
inputWhenNoVariables: /* @__PURE__ */ jsx71(WrappedComponent, { ...props })
|
|
7262
7444
|
}
|
|
7263
7445
|
);
|
|
7264
7446
|
};
|
|
@@ -7268,16 +7450,16 @@ function withInputVariablesForMultiValue(WrappedComponent) {
|
|
|
7268
7450
|
const WithInputVariables = (props) => {
|
|
7269
7451
|
var _a;
|
|
7270
7452
|
if (!props.bindable || props.disabled || props.readOnly) {
|
|
7271
|
-
return /* @__PURE__ */
|
|
7453
|
+
return /* @__PURE__ */ jsx71(WrappedComponent, { ...props });
|
|
7272
7454
|
}
|
|
7273
|
-
return /* @__PURE__ */
|
|
7455
|
+
return /* @__PURE__ */ jsx71(
|
|
7274
7456
|
InputVariables,
|
|
7275
7457
|
{
|
|
7276
7458
|
disableInlineMenu: true,
|
|
7277
7459
|
showMenuPosition: "inline-right",
|
|
7278
7460
|
onChange: (newValue) => props.onChange(newValue ? [newValue] : []),
|
|
7279
7461
|
value: (_a = props.value) == null ? void 0 : _a[0],
|
|
7280
|
-
inputWhenNoVariables: /* @__PURE__ */
|
|
7462
|
+
inputWhenNoVariables: /* @__PURE__ */ jsx71(WrappedComponent, { ...props })
|
|
7281
7463
|
}
|
|
7282
7464
|
);
|
|
7283
7465
|
};
|
|
@@ -7292,41 +7474,11 @@ var bindableFiltersMapper = {
|
|
|
7292
7474
|
number: withInputVariables(NumberEditor)
|
|
7293
7475
|
};
|
|
7294
7476
|
|
|
7295
|
-
// src/utils/createLocationValidator.ts
|
|
7296
|
-
function createLocationValidator(setValue, validate) {
|
|
7297
|
-
return (dispatch) => setValue((previous) => {
|
|
7298
|
-
const { newValue, options } = dispatch(previous);
|
|
7299
|
-
return { newValue, options: validate(newValue, options) };
|
|
7300
|
-
});
|
|
7301
|
-
}
|
|
7302
|
-
|
|
7303
|
-
// src/utils/useContentDataResourceLocaleInfo.ts
|
|
7304
|
-
import { bindVariables as bindVariables2, createVariableReference as createVariableReference4, LOCALE_DYNAMIC_INPUT_NAME as LOCALE_DYNAMIC_INPUT_NAME2 } from "@uniformdev/canvas";
|
|
7305
|
-
import { useEffect as useEffect18, useRef as useRef16 } from "react";
|
|
7306
|
-
function useContentDataResourceLocaleInfo({
|
|
7307
|
-
locale,
|
|
7308
|
-
setLocale,
|
|
7309
|
-
dynamicInputs
|
|
7310
|
-
}) {
|
|
7311
|
-
var _a;
|
|
7312
|
-
const setLocaleRef = useRef16(setLocale);
|
|
7313
|
-
setLocaleRef.current = setLocale;
|
|
7314
|
-
const { flatVariables } = useVariables();
|
|
7315
|
-
const effectiveLocale = locale != null ? locale : dynamicInputs[LOCALE_DYNAMIC_INPUT_NAME2] ? createVariableReference4(LOCALE_DYNAMIC_INPUT_NAME2) : "";
|
|
7316
|
-
const boundLocale = (_a = bindVariables2({ variables: flatVariables, value: effectiveLocale }).result) != null ? _a : effectiveLocale;
|
|
7317
|
-
useEffect18(() => {
|
|
7318
|
-
if (locale === void 0 && effectiveLocale && setLocaleRef.current) {
|
|
7319
|
-
setLocaleRef.current(createVariableReference4(LOCALE_DYNAMIC_INPUT_NAME2));
|
|
7320
|
-
}
|
|
7321
|
-
}, [locale, effectiveLocale]);
|
|
7322
|
-
return { effectiveLocale, boundLocale: boundLocale ? boundLocale : void 0 };
|
|
7323
|
-
}
|
|
7324
|
-
|
|
7325
7477
|
// src/index.ts
|
|
7326
7478
|
import {
|
|
7327
7479
|
AddListButton as AddListButton2,
|
|
7328
7480
|
Button as Button6,
|
|
7329
|
-
Callout as
|
|
7481
|
+
Callout as Callout7,
|
|
7330
7482
|
DrawerContent,
|
|
7331
7483
|
Heading,
|
|
7332
7484
|
Input as Input6,
|
|
@@ -7365,12 +7517,14 @@ export {
|
|
|
7365
7517
|
$isVariableNode,
|
|
7366
7518
|
AddListButton2 as AddListButton,
|
|
7367
7519
|
Button6 as Button,
|
|
7368
|
-
|
|
7520
|
+
Callout7 as Callout,
|
|
7521
|
+
ControlledObjectSearchProvider,
|
|
7369
7522
|
ControlledValuePlugin,
|
|
7370
7523
|
DISCONNECT_VARIABLE_COMMAND,
|
|
7371
7524
|
DamSelectedItem,
|
|
7372
7525
|
DataRefreshButton,
|
|
7373
7526
|
DataResourceDynamicInputProvider,
|
|
7527
|
+
DataResourceInputContext,
|
|
7374
7528
|
DataResourceVariablesList,
|
|
7375
7529
|
DataResourceVariablesListExplicit,
|
|
7376
7530
|
DataSourceEditor,
|
|
@@ -7398,10 +7552,12 @@ export {
|
|
|
7398
7552
|
MeshApp,
|
|
7399
7553
|
OPEN_INSERT_VARIABLE_COMMAND,
|
|
7400
7554
|
ObjectSearchContainer,
|
|
7555
|
+
ObjectSearchContext,
|
|
7401
7556
|
ObjectSearchFilter,
|
|
7402
7557
|
ObjectSearchFilterContainer2 as ObjectSearchFilterContainer,
|
|
7403
7558
|
ObjectSearchListItem,
|
|
7404
7559
|
ObjectSearchListItemLoadingSkeleton,
|
|
7560
|
+
ObjectSearchListOfSearchResults,
|
|
7405
7561
|
ObjectSearchProvider,
|
|
7406
7562
|
ObjectSearchResultItem,
|
|
7407
7563
|
ObjectSearchResultItemButton,
|
|
@@ -7455,6 +7611,7 @@ export {
|
|
|
7455
7611
|
VariablesPlugin,
|
|
7456
7612
|
VariablesProvider,
|
|
7457
7613
|
badgeIcon,
|
|
7614
|
+
bindQuery,
|
|
7458
7615
|
bindableFiltersMapper,
|
|
7459
7616
|
convertConnectedDataToVariable,
|
|
7460
7617
|
createLocationValidator,
|
|
@@ -7527,6 +7684,7 @@ export {
|
|
|
7527
7684
|
urlEncodeRequestUrl,
|
|
7528
7685
|
useConnectedDataAsVariables,
|
|
7529
7686
|
useContentDataResourceLocaleInfo,
|
|
7687
|
+
useDataResourceDynamicInputs,
|
|
7530
7688
|
useDynamicInputsAsVariables,
|
|
7531
7689
|
useMeshLocation,
|
|
7532
7690
|
useObjectSearchContext,
|