@uniformdev/mesh-sdk-react 19.79.1-alpha.11 → 19.79.1-alpha.8

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.esm.js CHANGED
@@ -2654,13 +2654,14 @@ function useConnectedDataAsVariables(connectedData) {
2654
2654
  }
2655
2655
 
2656
2656
  // src/hooks/useDynamicInputsAsVariables.tsx
2657
+ import { LOCALE_DYNAMIC_INPUT_NAME } from "@uniformdev/canvas";
2657
2658
  import { useMemo as useMemo4 } from "react";
2658
2659
  import { Fragment as Fragment4, jsx as jsx26 } from "@emotion/react/jsx-runtime";
2659
2660
  function useDynamicInputsAsVariables(dynamicInputs) {
2660
2661
  return useMemo4(() => {
2661
2662
  const result = Object.entries(dynamicInputs).reduce(
2662
2663
  (acc, [name, input3]) => {
2663
- const source = `from ${input3.type === "path" ? "URL path" : "query string"}`;
2664
+ const source = `from ${name === LOCALE_DYNAMIC_INPUT_NAME ? "current locale" : input3.type === "path" ? "URL path" : "query string"}`;
2664
2665
  acc[name] = {
2665
2666
  readOnly: true,
2666
2667
  type: input3.type,
@@ -2944,6 +2945,7 @@ function VariableChip({
2944
2945
  tooltip,
2945
2946
  reference,
2946
2947
  onClick,
2948
+ clickToEdit,
2947
2949
  isFresh,
2948
2950
  selected,
2949
2951
  disabled
@@ -2951,7 +2953,7 @@ function VariableChip({
2951
2953
  const hasClickEvent = !!onClick;
2952
2954
  const referenceIsValidFr = isFresh ? true : referenceIsValid;
2953
2955
  const Wrapper = referenceIsValidFr === "info" ? InfoVariableReference : referenceIsValidFr ? Fragment5 : UndefinedVariableReference;
2954
- const extraTitle = !referenceIsValidFr ? `${reference} is not defined.` : hasClickEvent ? "Click to edit" : void 0;
2956
+ const extraTitle = !referenceIsValidFr ? `${reference} is not defined.` : hasClickEvent && clickToEdit ? "Click to edit" : void 0;
2955
2957
  return /* @__PURE__ */ jsx29(
2956
2958
  MultilineChip,
2957
2959
  {
@@ -3968,6 +3970,7 @@ function VariableNodeComponent({
3968
3970
  displayName: state.isLoading ? /* @__PURE__ */ jsx33(LoadingIndicator2, { size: "sm" }) : state.displayName,
3969
3971
  selected: isSelected,
3970
3972
  disabled: readOnly,
3973
+ clickToEdit: state.hasClickEvent,
3971
3974
  onClick: state.hasClickEvent ? () => {
3972
3975
  setSelected(!isSelected);
3973
3976
  editor.dispatchCommand(EDIT_VARIABLE_COMMAND, {
@@ -4352,8 +4355,8 @@ function VariableField({
4352
4355
  buttonProps: isActive ? { "aria-pressed": "true" } : void 0
4353
4356
  }
4354
4357
  ) : null;
4355
- return /* @__PURE__ */ jsxs20("div", { children: [
4356
- /* @__PURE__ */ jsxs20("label", { htmlFor: id, css: labelText, children: [
4358
+ return /* @__PURE__ */ jsxs20("div", { "data-testid": "variable-field", children: [
4359
+ /* @__PURE__ */ jsxs20("label", { htmlFor: id, css: labelText, "data-testid": "field-name", children: [
4357
4360
  variableSelector,
4358
4361
  /* @__PURE__ */ jsx36("span", { children: label })
4359
4362
  ] }),
@@ -4459,6 +4462,7 @@ function VariablesComposer(props) {
4459
4462
  /* @__PURE__ */ jsx37(
4460
4463
  OnChangePlugin,
4461
4464
  {
4465
+ ignoreSelectionChange: true,
4462
4466
  onChange: (state) => {
4463
4467
  editorState.current = state;
4464
4468
  if (updateTimeout.current) {
@@ -5136,7 +5140,6 @@ var tableCellDragIcon = css25`
5136
5140
  `;
5137
5141
  var variableName = css25`
5138
5142
  border: none;
5139
- color: var(--brand-secondary-5);
5140
5143
  font-weight: var(--fw-medium);
5141
5144
  padding: 0;
5142
5145
  background: none;
@@ -5246,7 +5249,7 @@ function VariablesList() {
5246
5249
  {
5247
5250
  onButtonClick: () => dispatch({ type: "edit", variable: "" }),
5248
5251
  "aria-label": "Add variable",
5249
- buttonText: "add variable",
5252
+ buttonText: "Add variable",
5250
5253
  icon: "math-plus",
5251
5254
  css: { marginLeft: "var(--spacing-md)" }
5252
5255
  }
@@ -6141,9 +6144,9 @@ var DataRefreshButton = ({
6141
6144
  };
6142
6145
 
6143
6146
  // src/components/ObjectSearch/ObjectSearchContainer.tsx
6144
- import { css as css31 } from "@emotion/react";
6147
+ import { css as css32 } from "@emotion/react";
6145
6148
  import { bindVariables } from "@uniformdev/canvas";
6146
- import { Container, IconsProvider, ScrollableList, VerticalRhythm as VerticalRhythm2 } from "@uniformdev/design-system";
6149
+ import { Callout as Callout5, Container, IconsProvider, ScrollableList, VerticalRhythm as VerticalRhythm2 } from "@uniformdev/design-system";
6147
6150
 
6148
6151
  // src/components/ObjectSearch/hooks/ObjectSearchContext.tsx
6149
6152
  import { bindVariablesToObject as bindVariablesToObject2 } from "@uniformdev/canvas";
@@ -6168,12 +6171,19 @@ var ObjectSearchContext = createContext5({
6168
6171
  },
6169
6172
  selectedListItems: [],
6170
6173
  onRemoveAllSelectedItems: () => {
6171
- }
6174
+ },
6175
+ isMulti: false
6172
6176
  });
6173
- var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
6177
+ var ObjectSearchProvider = ({
6178
+ currentlySelectedItems,
6179
+ isMulti = false,
6180
+ children,
6181
+ defaultQuery
6182
+ }) => {
6174
6183
  const [query, setQuery] = useState15({
6175
6184
  contentType: "",
6176
- keyword: ""
6185
+ keyword: "",
6186
+ ...defaultQuery
6177
6187
  });
6178
6188
  const { flatVariables } = useVariables(true);
6179
6189
  const querySearchDeferred = useDeferredValue(query);
@@ -6224,6 +6234,7 @@ var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
6224
6234
  selectedListItems: selectedItems,
6225
6235
  onRemoveAllSelectedItems,
6226
6236
  list,
6237
+ isMulti,
6227
6238
  onSetList
6228
6239
  }),
6229
6240
  [
@@ -6234,6 +6245,7 @@ var ObjectSearchProvider = ({ currentlySelectedItems, children }) => {
6234
6245
  selectedItems,
6235
6246
  onRemoveAllSelectedItems,
6236
6247
  list,
6248
+ isMulti,
6237
6249
  onSetList
6238
6250
  ]
6239
6251
  );
@@ -6254,8 +6266,148 @@ function bindQuery(query, inputs) {
6254
6266
  return result;
6255
6267
  }
6256
6268
 
6257
- // src/components/ObjectSearch/ObjectSearchContainer.tsx
6269
+ // src/components/ObjectSearch/ObjectSearchListItem.tsx
6270
+ import { Chip, Popover } from "@uniformdev/design-system";
6271
+
6272
+ // src/components/ObjectSearch/styles/ObjectSearchListItem.styles.ts
6273
+ import { css as css31 } from "@emotion/react";
6274
+ import { skeletonLoading } from "@uniformdev/design-system";
6275
+ var ObjectListItemContainer = css31`
6276
+ align-items: center;
6277
+ border: 1px solid var(--gray-300);
6278
+ border-radius: var(--rounded-base);
6279
+ background: var(--white);
6280
+ display: grid;
6281
+ grid-template-columns: 1fr auto;
6282
+ padding: var(--spacing-sm);
6283
+ `;
6284
+ var ObjectListItemContainerDisabled = css31`
6285
+ opacity: var(--opacity-50);
6286
+ pointer-events: none;
6287
+ `;
6288
+ var ObjectListItemLoading = css31`
6289
+ animation: ${skeletonLoading} 1s linear infinite alternate;
6290
+ border-color: transparent;
6291
+ min-height: 42px;
6292
+ position: relative;
6293
+
6294
+ &:before,
6295
+ &:after {
6296
+ background: var(--gray-200);
6297
+ content: '';
6298
+ display: block;
6299
+ height: 1rem;
6300
+ }
6301
+
6302
+ &:before {
6303
+ border-radius: var(--rounded-base);
6304
+ width: 10rem;
6305
+ }
6306
+
6307
+ &:after {
6308
+ border-radius: var(--rounded-full);
6309
+ width: 1rem;
6310
+ }
6311
+ `;
6312
+ var ObjectListItemHeadingGroup = css31`
6313
+ align-items: center;
6314
+ display: grid;
6315
+ `;
6316
+ var ObjectListItemThumbnail = css31`
6317
+ width: 30px;
6318
+ object-fit: contain;
6319
+ `;
6320
+ var ObjectListItemTitle = css31`
6321
+ color: var(--brand-secondary-1);
6322
+ display: block;
6323
+ font-size: var(--fs-sm);
6324
+ `;
6325
+ var ObjectListItemSubtitle = css31`
6326
+ color: var(--gray-500);
6327
+ display: block;
6328
+ font-size: var(--fs-xs);
6329
+ line-height: 1;
6330
+ `;
6331
+ var ObjectListItemInfoContainer = css31`
6332
+ align-items: center;
6333
+ display: flex;
6334
+ gap: var(--spacing-sm);
6335
+ justify-content: center;
6336
+ `;
6337
+ var ObjectListItemControlledContent = css31`
6338
+ display: flex;
6339
+ gap: var(--spacing-sm);
6340
+ `;
6341
+ var ObjectListItemUnControlledContent = css31`
6342
+ margin-top: var(--spacing-sm);
6343
+ grid-column: 1 / -1;
6344
+ `;
6345
+
6346
+ // src/components/ObjectSearch/ObjectSearchListItem.tsx
6258
6347
  import { jsx as jsx59, jsxs as jsxs34 } from "@emotion/react/jsx-runtime";
6348
+ var ObjectSearchListItem = ({
6349
+ id,
6350
+ title,
6351
+ contentType,
6352
+ image,
6353
+ imageUrl,
6354
+ popoverData,
6355
+ onSelect,
6356
+ isMulti,
6357
+ disabled,
6358
+ children
6359
+ }) => {
6360
+ const { onSelectItem, selectedListItems, isMulti: globalIsMulti } = useObjectSearchContext();
6361
+ const formatedContentType = Array.isArray(contentType) ? contentType.join(", ") : contentType;
6362
+ const handleSelectItem = () => {
6363
+ var _a;
6364
+ const extraData = (_a = onSelect == null ? void 0 : onSelect()) != null ? _a : {};
6365
+ const selectedItem = { id, title, contentType, imageUrl, image, popoverData, ...extraData };
6366
+ if (isMulti === true || globalIsMulti) {
6367
+ return onSelectItem(selectedItem);
6368
+ }
6369
+ return onSelectItem([selectedItem]);
6370
+ };
6371
+ const selected = selectedListItems.some((item) => item.id === id);
6372
+ return /* @__PURE__ */ jsxs34(
6373
+ "div",
6374
+ {
6375
+ role: "listitem",
6376
+ css: [ObjectListItemContainer, disabled ? ObjectListItemContainerDisabled : void 0],
6377
+ "data-testid": "list-item",
6378
+ children: [
6379
+ /* @__PURE__ */ jsxs34(
6380
+ "div",
6381
+ {
6382
+ role: "button",
6383
+ onClick: handleSelectItem,
6384
+ css: ObjectListItemControlledContent,
6385
+ "aria-disabled": disabled,
6386
+ children: [
6387
+ !imageUrl ? null : /* @__PURE__ */ jsx59("img", { src: imageUrl, alt: `Thumbnail for ${title}`, css: ObjectListItemThumbnail }),
6388
+ !image || imageUrl ? null : /* @__PURE__ */ jsx59("img", { ...image, loading: (image == null ? void 0 : image.width) && image.height ? "lazy" : "eager" }),
6389
+ /* @__PURE__ */ jsxs34("div", { role: "heading", css: ObjectListItemHeadingGroup, children: [
6390
+ !contentType ? null : /* @__PURE__ */ jsx59("span", { css: ObjectListItemSubtitle, children: formatedContentType }),
6391
+ /* @__PURE__ */ jsx59("span", { css: ObjectListItemTitle, "data-testid": "title", children: title })
6392
+ ] })
6393
+ ]
6394
+ }
6395
+ ),
6396
+ /* @__PURE__ */ jsxs34("div", { css: ObjectListItemInfoContainer, children: [
6397
+ selected ? /* @__PURE__ */ jsx59(Chip, { text: "selected", size: "xs" }) : null,
6398
+ !popoverData ? null : /* @__PURE__ */ jsx59(Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, iconColor: "default", children: popoverData })
6399
+ ] }),
6400
+ !children ? null : /* @__PURE__ */ jsx59("div", { css: ObjectListItemUnControlledContent, children })
6401
+ ]
6402
+ }
6403
+ );
6404
+ };
6405
+ var ObjectSearchListItemLoadingSkeleton = () => {
6406
+ return /* @__PURE__ */ jsx59("div", { role: "presentation", css: [ObjectListItemContainer, ObjectListItemLoading] });
6407
+ };
6408
+
6409
+ // src/components/ObjectSearch/ObjectSearchContainer.tsx
6410
+ import { jsx as jsx60, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
6259
6411
  var ObjectSearchContainer = ({
6260
6412
  label,
6261
6413
  enableDynamicInputToResultId,
@@ -6267,21 +6419,22 @@ var ObjectSearchContainer = ({
6267
6419
  const { onSelectItem, selectedListItems, list } = useObjectSearchContext();
6268
6420
  const { flatVariables } = useVariables(true);
6269
6421
  const inputValue = (_b = (_a = selectedListItems == null ? void 0 : selectedListItems[0]) == null ? void 0 : _a.id) != null ? _b : "";
6270
- const body = /* @__PURE__ */ jsxs34(VerticalRhythm2, { children: [
6422
+ const listItems = resultList != null ? resultList : /* @__PURE__ */ jsx60(
6423
+ ScrollableList,
6424
+ {
6425
+ role: "list",
6426
+ css: css32`
6427
+ > div {
6428
+ transition: max-height var(--duration-slow) var(--timing-ease-out);
6429
+ max-height: ${selectedListItems.length === 0 ? "50vh" : "184px"};
6430
+ }
6431
+ `,
6432
+ children: /* @__PURE__ */ jsx60(DefaultResultList, {})
6433
+ }
6434
+ );
6435
+ const body = /* @__PURE__ */ jsxs35(VerticalRhythm2, { children: [
6271
6436
  searchFilters,
6272
- !resultList ? null : /* @__PURE__ */ jsx59(
6273
- ScrollableList,
6274
- {
6275
- role: "list",
6276
- css: css31`
6277
- > div {
6278
- transition: max-height var(--duration-slow) var(--timing-ease-out);
6279
- max-height: ${selectedListItems.length === 0 ? "50vh" : "184px"};
6280
- }
6281
- `,
6282
- children: resultList
6283
- }
6284
- )
6437
+ listItems
6285
6438
  ] });
6286
6439
  const handleSelectedVariableChange = (selectedValue) => {
6287
6440
  var _a2;
@@ -6310,8 +6463,8 @@ var ObjectSearchContainer = ({
6310
6463
  }
6311
6464
  ]);
6312
6465
  };
6313
- return /* @__PURE__ */ jsx59(IconsProvider, { children: /* @__PURE__ */ jsxs34(VerticalRhythm2, { children: [
6314
- /* @__PURE__ */ jsx59(Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: label ? /* @__PURE__ */ jsx59(
6466
+ return /* @__PURE__ */ jsx60(IconsProvider, { children: /* @__PURE__ */ jsxs35(VerticalRhythm2, { children: [
6467
+ /* @__PURE__ */ jsx60(Container, { backgroundColor: "gray-50", padding: "var(--spacing-base)", border: true, children: label ? /* @__PURE__ */ jsx60(
6315
6468
  InputVariables,
6316
6469
  {
6317
6470
  label,
@@ -6329,14 +6482,25 @@ var ObjectSearchContainer = ({
6329
6482
  children
6330
6483
  ] }) });
6331
6484
  };
6485
+ var DefaultResultList = () => {
6486
+ var _a;
6487
+ const { list } = useObjectSearchContext();
6488
+ if (!list.items) {
6489
+ return Array.from(Array(5).keys()).map((i) => /* @__PURE__ */ jsx60(ObjectSearchListItemLoadingSkeleton, {}, i));
6490
+ }
6491
+ if (list.items.length === 0) {
6492
+ return /* @__PURE__ */ jsx60(Callout5, { type: "info", children: "No results were found" });
6493
+ }
6494
+ return (_a = list.items) == null ? void 0 : _a.map((item) => /* @__PURE__ */ jsx60(ObjectSearchListItem, { ...item }, item.id));
6495
+ };
6332
6496
 
6333
6497
  // src/components/ObjectSearch/ObjectSearchFilter.tsx
6334
6498
  import { InputKeywordSearch as InputKeywordSearch2, InputSelect as InputSelect6 } from "@uniformdev/design-system";
6335
6499
  import { useMemo as useMemo15, useState as useState16 } from "react";
6336
6500
 
6337
6501
  // src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
6338
- import { css as css32 } from "@emotion/react";
6339
- var ObjectSearchFilterContainerLabel = css32`
6502
+ import { css as css33 } from "@emotion/react";
6503
+ var ObjectSearchFilterContainerLabel = css33`
6340
6504
  align-items: center;
6341
6505
  display: flex;
6342
6506
  font-size: var(--fs-sm);
@@ -6344,18 +6508,18 @@ var ObjectSearchFilterContainerLabel = css32`
6344
6508
  line-height: 1rem;
6345
6509
  margin-bottom: var(--spacing-sm);
6346
6510
  `;
6347
- var ObjectSearchFilterContainer = css32`
6511
+ var ObjectSearchFilterContainer = css33`
6348
6512
  display: grid;
6349
6513
  gap: var(--spacing-base);
6350
6514
  `;
6351
- var ObjectSearchFilterGrid = (gridColumns) => css32`
6515
+ var ObjectSearchFilterGrid = (gridColumns) => css33`
6352
6516
  display: grid;
6353
6517
  grid-template-columns: ${gridColumns};
6354
6518
  gap: var(--spacing-base);
6355
6519
  `;
6356
6520
 
6357
6521
  // src/components/ObjectSearch/ObjectSearchFilter.tsx
6358
- import { jsx as jsx60, jsxs as jsxs35 } from "@emotion/react/jsx-runtime";
6522
+ import { jsx as jsx61, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
6359
6523
  var ObjectSearchFilter = ({
6360
6524
  requireContentType,
6361
6525
  typeSelectorAllTypesOptionText = "All content types",
@@ -6364,10 +6528,11 @@ var ObjectSearchFilter = ({
6364
6528
  selectLabel = "Content Type Select",
6365
6529
  selectOptions
6366
6530
  }) => {
6531
+ var _a, _b;
6367
6532
  const { query, onSetQuery } = useObjectSearchContext();
6368
6533
  const [searchState, setSearchState] = useState16({
6369
- contentType: "",
6370
- keyword: ""
6534
+ contentType: (_a = query.contentType) != null ? _a : "",
6535
+ keyword: (_b = query.keyword) != null ? _b : ""
6371
6536
  });
6372
6537
  const handleFilterChange = (value) => {
6373
6538
  setSearchState((prev) => {
@@ -6382,13 +6547,13 @@ var ObjectSearchFilter = ({
6382
6547
  return [
6383
6548
  ...!requireContentType ? [{ value: "any", label: typeSelectorAllTypesOptionText }] : [],
6384
6549
  ...selectOptions ? selectOptions.map((option) => {
6385
- var _a;
6386
- return { name: option == null ? void 0 : option.name, label: (_a = option.label) != null ? _a : option == null ? void 0 : option.name, id: option.id };
6550
+ var _a2;
6551
+ return { name: option == null ? void 0 : option.name, label: (_a2 = option.label) != null ? _a2 : option == null ? void 0 : option.name, id: option.id };
6387
6552
  }) : []
6388
6553
  ];
6389
6554
  }, [requireContentType, typeSelectorAllTypesOptionText, selectOptions]);
6390
6555
  const shouldRenderSelect = memoizedSelectOptions.length > 0;
6391
- return /* @__PURE__ */ jsxs35(
6556
+ return /* @__PURE__ */ jsxs36(
6392
6557
  "fieldset",
6393
6558
  {
6394
6559
  css: [
@@ -6396,7 +6561,7 @@ var ObjectSearchFilter = ({
6396
6561
  ObjectSearchFilterGrid(shouldRenderSelect ? "1fr 2fr" : "1fr")
6397
6562
  ],
6398
6563
  children: [
6399
- memoizedSelectOptions.length ? /* @__PURE__ */ jsx60(
6564
+ memoizedSelectOptions.length ? /* @__PURE__ */ jsx61(
6400
6565
  InputSelect6,
6401
6566
  {
6402
6567
  label: selectLabel,
@@ -6406,7 +6571,7 @@ var ObjectSearchFilter = ({
6406
6571
  value: query.contentType
6407
6572
  }
6408
6573
  ) : null,
6409
- /* @__PURE__ */ jsx60(
6574
+ /* @__PURE__ */ jsx61(
6410
6575
  InputKeywordSearch2,
6411
6576
  {
6412
6577
  inputFieldName: searchInputName,
@@ -6423,154 +6588,14 @@ var ObjectSearchFilter = ({
6423
6588
  };
6424
6589
 
6425
6590
  // src/components/ObjectSearch/ObjectSearchFilterContainer.tsx
6426
- import { jsx as jsx61, jsxs as jsxs36 } from "@emotion/react/jsx-runtime";
6591
+ import { jsx as jsx62, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
6427
6592
  var ObjectSearchFilterContainer2 = ({ label, children }) => {
6428
- return /* @__PURE__ */ jsxs36("div", { children: [
6429
- label ? /* @__PURE__ */ jsx61("span", { css: ObjectSearchFilterContainerLabel, children: label }) : null,
6430
- /* @__PURE__ */ jsx61("div", { css: ObjectSearchFilterContainer, children })
6593
+ return /* @__PURE__ */ jsxs37("div", { children: [
6594
+ label ? /* @__PURE__ */ jsx62("span", { css: ObjectSearchFilterContainerLabel, children: label }) : null,
6595
+ /* @__PURE__ */ jsx62("div", { css: ObjectSearchFilterContainer, children })
6431
6596
  ] });
6432
6597
  };
6433
6598
 
6434
- // src/components/ObjectSearch/ObjectSearchListItem.tsx
6435
- import { Chip, Popover } from "@uniformdev/design-system";
6436
-
6437
- // src/components/ObjectSearch/styles/ObjectSearchListItem.styles.ts
6438
- import { css as css33 } from "@emotion/react";
6439
- import { skeletonLoading } from "@uniformdev/design-system";
6440
- var ObjectListItemContainer = css33`
6441
- align-items: center;
6442
- border: 1px solid var(--gray-300);
6443
- border-radius: var(--rounded-base);
6444
- background: var(--white);
6445
- display: grid;
6446
- grid-template-columns: 1fr auto;
6447
- padding: var(--spacing-sm);
6448
- `;
6449
- var ObjectListItemContainerDisabled = css33`
6450
- opacity: var(--opacity-50);
6451
- pointer-events: none;
6452
- `;
6453
- var ObjectListItemLoading = css33`
6454
- animation: ${skeletonLoading} 1s linear infinite alternate;
6455
- border-color: transparent;
6456
- min-height: 42px;
6457
- position: relative;
6458
-
6459
- &:before,
6460
- &:after {
6461
- background: var(--gray-200);
6462
- content: '';
6463
- display: block;
6464
- height: 1rem;
6465
- }
6466
-
6467
- &:before {
6468
- border-radius: var(--rounded-base);
6469
- width: 10rem;
6470
- }
6471
-
6472
- &:after {
6473
- border-radius: var(--rounded-full);
6474
- width: 1rem;
6475
- }
6476
- `;
6477
- var ObjectListItemHeadingGroup = css33`
6478
- align-items: center;
6479
- display: grid;
6480
- `;
6481
- var ObjectListItemThumbnail = css33`
6482
- width: 30px;
6483
- object-fit: contain;
6484
- `;
6485
- var ObjectListItemTitle = css33`
6486
- color: var(--brand-secondary-1);
6487
- display: block;
6488
- font-size: var(--fs-sm);
6489
- `;
6490
- var ObjectListItemSubtitle = css33`
6491
- color: var(--gray-500);
6492
- display: block;
6493
- font-size: var(--fs-xs);
6494
- line-height: 1;
6495
- `;
6496
- var ObjectListItemInfoContainer = css33`
6497
- align-items: center;
6498
- display: flex;
6499
- gap: var(--spacing-sm);
6500
- justify-content: center;
6501
- `;
6502
- var ObjectListItemControlledContent = css33`
6503
- display: flex;
6504
- gap: var(--spacing-sm);
6505
- `;
6506
- var ObjectListItemUnControlledContent = css33`
6507
- margin-top: var(--spacing-sm);
6508
- grid-column: 1 / -1;
6509
- `;
6510
-
6511
- // src/components/ObjectSearch/ObjectSearchListItem.tsx
6512
- import { jsx as jsx62, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
6513
- var ObjectSearchListItem = ({
6514
- id,
6515
- title,
6516
- contentType,
6517
- image,
6518
- imageUrl,
6519
- popoverData,
6520
- onSelect,
6521
- isMulti = false,
6522
- disabled,
6523
- children
6524
- }) => {
6525
- const { onSelectItem, selectedListItems } = useObjectSearchContext();
6526
- const formatedContentType = Array.isArray(contentType) ? contentType.join(", ") : contentType;
6527
- const handleSelectItem = () => {
6528
- var _a;
6529
- const extraData = (_a = onSelect == null ? void 0 : onSelect()) != null ? _a : {};
6530
- const selectedItem = { id, title, contentType, imageUrl, image, popoverData, ...extraData };
6531
- if (isMulti) {
6532
- return onSelectItem(selectedItem);
6533
- }
6534
- return onSelectItem([selectedItem]);
6535
- };
6536
- const selected = selectedListItems.some((item) => item.id === id);
6537
- return /* @__PURE__ */ jsxs37(
6538
- "div",
6539
- {
6540
- role: "listitem",
6541
- css: [ObjectListItemContainer, disabled ? ObjectListItemContainerDisabled : void 0],
6542
- "data-testid": "list-item",
6543
- children: [
6544
- /* @__PURE__ */ jsxs37(
6545
- "div",
6546
- {
6547
- role: "button",
6548
- onClick: handleSelectItem,
6549
- css: ObjectListItemControlledContent,
6550
- "aria-disabled": disabled,
6551
- children: [
6552
- !imageUrl ? null : /* @__PURE__ */ jsx62("img", { src: imageUrl, alt: `Thumbnail for ${title}`, css: ObjectListItemThumbnail }),
6553
- !image || imageUrl ? null : /* @__PURE__ */ jsx62("img", { ...image, loading: (image == null ? void 0 : image.width) && image.height ? "lazy" : "eager" }),
6554
- /* @__PURE__ */ jsxs37("div", { role: "heading", css: ObjectListItemHeadingGroup, children: [
6555
- !contentType ? null : /* @__PURE__ */ jsx62("span", { css: ObjectListItemSubtitle, children: formatedContentType }),
6556
- /* @__PURE__ */ jsx62("span", { css: ObjectListItemTitle, "data-testid": "title", children: title })
6557
- ] })
6558
- ]
6559
- }
6560
- ),
6561
- /* @__PURE__ */ jsxs37("div", { css: ObjectListItemInfoContainer, children: [
6562
- selected ? /* @__PURE__ */ jsx62(Chip, { text: "selected", size: "xs" }) : null,
6563
- !popoverData ? null : /* @__PURE__ */ jsx62(Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, iconColor: "default", children: popoverData })
6564
- ] }),
6565
- !children ? null : /* @__PURE__ */ jsx62("div", { css: ObjectListItemUnControlledContent, children })
6566
- ]
6567
- }
6568
- );
6569
- };
6570
- var ObjectSearchListItemLoadingSkeleton = () => {
6571
- return /* @__PURE__ */ jsx62("div", { role: "presentation", css: [ObjectListItemContainer, ObjectListItemLoading] });
6572
- };
6573
-
6574
6599
  // src/components/ObjectSearch/ObjectSearchResultItem.tsx
6575
6600
  import { Badge, Button as Button4, Popover as Popover2 } from "@uniformdev/design-system";
6576
6601
  import { format as timeagoFormat } from "timeago.js";
@@ -6718,13 +6743,13 @@ var ObjectSearchResultItem = ({
6718
6743
  onSelectItem({ id, title: id });
6719
6744
  onRemove == null ? void 0 : onRemove();
6720
6745
  };
6721
- return /* @__PURE__ */ jsxs39("div", { css: ObjectSearchResultItemContainer, children: [
6746
+ return /* @__PURE__ */ jsxs39("div", { css: ObjectSearchResultItemContainer, "data-testid": "search-result-item", children: [
6722
6747
  disableDnD ? null : /* @__PURE__ */ jsx64("div", { role: "presentation", className: "drag-handle", css: ObjectSearchDragHandle }),
6723
6748
  /* @__PURE__ */ jsx64("div", { children: /* @__PURE__ */ jsxs39("div", { css: ObjectSearchContentContainer, children: [
6724
6749
  !imageUrl ? null : /* @__PURE__ */ jsx64("img", { src: imageUrl, alt: `Thumbnail for ${title}`, css: ObjectSearchImage }),
6725
6750
  /* @__PURE__ */ jsxs39("div", { children: [
6726
- /* @__PURE__ */ jsx64("span", { css: ObjectSearchResultItemSubtitle, children: formatedContentType }),
6727
- /* @__PURE__ */ jsxs39("span", { role: "heading", css: ObjectSearchResultItemTitle, children: [
6751
+ /* @__PURE__ */ jsx64("span", { css: ObjectSearchResultItemSubtitle, "data-testid": "sub-title", children: formatedContentType }),
6752
+ /* @__PURE__ */ jsxs39("span", { role: "heading", css: ObjectSearchResultItemTitle, "data-testid": "title", children: [
6728
6753
  title != null ? title : name,
6729
6754
  !popoverData ? null : /* @__PURE__ */ jsx64(Popover2, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData })
6730
6755
  ] }),
@@ -6894,14 +6919,14 @@ var QueryFilter = ({
6894
6919
  ],
6895
6920
  children
6896
6921
  }) => {
6897
- var _a, _b, _c, _d;
6922
+ var _a, _b, _c, _d, _e, _f;
6898
6923
  const { query, onSetQuery } = useObjectSearchContext();
6899
6924
  const [queryState, setQueryState] = useState17({
6900
- contentType: "",
6901
- keyword: "",
6925
+ contentType: (_a = query.contentType) != null ? _a : "",
6926
+ keyword: (_b = query.contentType) != null ? _b : "",
6902
6927
  count: countValue != null ? countValue : 5,
6903
- sortBy: (_a = sortOptions[0].id) != null ? _a : "",
6904
- sortOrder: (_b = sortOrderOptions[0].id) != null ? _b : ""
6928
+ sortBy: (_c = sortOptions[0].id) != null ? _c : "",
6929
+ sortOrder: (_d = sortOrderOptions[0].id) != null ? _d : ""
6905
6930
  });
6906
6931
  const handleFilterChange = (value) => {
6907
6932
  setQueryState((prev) => ({ ...prev, ...value }));
@@ -6917,7 +6942,7 @@ var QueryFilter = ({
6917
6942
  InputVariables,
6918
6943
  {
6919
6944
  label: searchInputLabel,
6920
- value: (_c = queryState.keyword) != null ? _c : "",
6945
+ value: (_e = queryState.keyword) != null ? _e : "",
6921
6946
  onChange: (newQuery) => handleFilterChange({ keyword: newQuery }),
6922
6947
  disableInlineMenu: true,
6923
6948
  id: "qf_searchText",
@@ -6941,7 +6966,7 @@ var QueryFilter = ({
6941
6966
  {
6942
6967
  label: contentTypeLabel,
6943
6968
  id: "qf_contentType",
6944
- value: (_d = queryState.contentType) != null ? _d : "",
6969
+ value: (_f = queryState.contentType) != null ? _f : "",
6945
6970
  onChange: (newType) => handleFilterChange({ contentType: newType }),
6946
6971
  disableInlineMenu: true,
6947
6972
  inputWhenNoVariables: /* @__PURE__ */ jsx66(
@@ -7114,7 +7139,7 @@ function createLocationValidator(setValue, validate) {
7114
7139
  import {
7115
7140
  AddListButton as AddListButton2,
7116
7141
  Button as Button6,
7117
- Callout as Callout5,
7142
+ Callout as Callout6,
7118
7143
  DrawerContent,
7119
7144
  Heading,
7120
7145
  Input as Input6,
@@ -7153,7 +7178,7 @@ export {
7153
7178
  $isVariableNode,
7154
7179
  AddListButton2 as AddListButton,
7155
7180
  Button6 as Button,
7156
- Callout5 as Callout,
7181
+ Callout6 as Callout,
7157
7182
  ControlledValuePlugin,
7158
7183
  DISCONNECT_VARIABLE_COMMAND,
7159
7184
  DamSelectedItem,