@procore/saved-views 1.1.0-alpha.4 → 1.1.0-alpha.5

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.
@@ -110,7 +110,7 @@ var require_react_is_production_min = __commonJS({
110
110
  var E2 = n2;
111
111
  var F2 = c2;
112
112
  var G2 = f2;
113
- var H3 = e2;
113
+ var H2 = e2;
114
114
  var I = l2;
115
115
  exports.ContextConsumer = h;
116
116
  exports.ContextProvider = z2;
@@ -121,7 +121,7 @@ var require_react_is_production_min = __commonJS({
121
121
  exports.Memo = E2;
122
122
  exports.Portal = F2;
123
123
  exports.Profiler = G2;
124
- exports.StrictMode = H3;
124
+ exports.StrictMode = H2;
125
125
  exports.Suspense = I;
126
126
  exports.isAsyncMode = function() {
127
127
  return false;
@@ -7868,7 +7868,7 @@ function __rest(s2, e2) {
7868
7868
  return t2;
7869
7869
  }
7870
7870
 
7871
- // ../../node_modules/@procore/core-icons/dist/Icon.js
7871
+ // node_modules/@procore/core-icons/dist/Icon.js
7872
7872
  import * as React from "react";
7873
7873
  function getSize(size) {
7874
7874
  if (size === "sm") {
@@ -7887,7 +7887,7 @@ function Icon(_a) {
7887
7887
  return React.isValidElement(children) ? React.cloneElement(children, __assign(__assign({ "aria-hidden": true, "data-qa": "ci-".concat(props.name) }, props), { width: getSize(props.size), height: getSize(props.size), focusable: false, style: __assign(__assign({}, props.style), { flex: "0 0 auto" }) })) : null;
7888
7888
  }
7889
7889
 
7890
- // ../../node_modules/@procore/core-icons/dist/icons/Building.js
7890
+ // node_modules/@procore/core-icons/dist/icons/Building.js
7891
7891
  import * as React2 from "react";
7892
7892
  var Building = React2.forwardRef(function Building2(props, ref) {
7893
7893
  return React2.createElement(
@@ -7903,7 +7903,7 @@ var Building = React2.forwardRef(function Building2(props, ref) {
7903
7903
  Building.displayName = "Building";
7904
7904
  var Building_default = Building;
7905
7905
 
7906
- // ../../node_modules/@procore/core-icons/dist/icons/ChevronDown.js
7906
+ // node_modules/@procore/core-icons/dist/icons/ChevronDown.js
7907
7907
  import * as React3 from "react";
7908
7908
  var ChevronDown = React3.forwardRef(function ChevronDown2(props, ref) {
7909
7909
  return React3.createElement(
@@ -7919,7 +7919,7 @@ var ChevronDown = React3.forwardRef(function ChevronDown2(props, ref) {
7919
7919
  ChevronDown.displayName = "ChevronDown";
7920
7920
  var ChevronDown_default = ChevronDown;
7921
7921
 
7922
- // ../../node_modules/@procore/core-icons/dist/icons/ChevronRight.js
7922
+ // node_modules/@procore/core-icons/dist/icons/ChevronRight.js
7923
7923
  import * as React4 from "react";
7924
7924
  var ChevronRight = React4.forwardRef(function ChevronRight2(props, ref) {
7925
7925
  return React4.createElement(
@@ -7935,7 +7935,7 @@ var ChevronRight = React4.forwardRef(function ChevronRight2(props, ref) {
7935
7935
  ChevronRight.displayName = "ChevronRight";
7936
7936
  var ChevronRight_default = ChevronRight;
7937
7937
 
7938
- // ../../node_modules/@procore/core-icons/dist/icons/Clear.js
7938
+ // node_modules/@procore/core-icons/dist/icons/Clear.js
7939
7939
  import * as React5 from "react";
7940
7940
  var Clear = React5.forwardRef(function Clear2(props, ref) {
7941
7941
  return React5.createElement(
@@ -7951,7 +7951,7 @@ var Clear = React5.forwardRef(function Clear2(props, ref) {
7951
7951
  Clear.displayName = "Clear";
7952
7952
  var Clear_default = Clear;
7953
7953
 
7954
- // ../../node_modules/@procore/core-icons/dist/icons/Excavator.js
7954
+ // node_modules/@procore/core-icons/dist/icons/Excavator.js
7955
7955
  import * as React6 from "react";
7956
7956
  var Excavator = React6.forwardRef(function Excavator2(props, ref) {
7957
7957
  return React6.createElement(
@@ -7968,7 +7968,7 @@ var Excavator = React6.forwardRef(function Excavator2(props, ref) {
7968
7968
  Excavator.displayName = "Excavator";
7969
7969
  var Excavator_default = Excavator;
7970
7970
 
7971
- // ../../node_modules/@procore/core-icons/dist/icons/ExpandSidebar.js
7971
+ // node_modules/@procore/core-icons/dist/icons/ExpandSidebar.js
7972
7972
  import * as React7 from "react";
7973
7973
  var ExpandSidebar = React7.forwardRef(function ExpandSidebar2(props, ref) {
7974
7974
  return React7.createElement(
@@ -7986,7 +7986,7 @@ var ExpandSidebar = React7.forwardRef(function ExpandSidebar2(props, ref) {
7986
7986
  ExpandSidebar.displayName = "ExpandSidebar";
7987
7987
  var ExpandSidebar_default = ExpandSidebar;
7988
7988
 
7989
- // ../../node_modules/@procore/core-icons/dist/icons/Help.js
7989
+ // node_modules/@procore/core-icons/dist/icons/Help.js
7990
7990
  import * as React8 from "react";
7991
7991
  var Help = React8.forwardRef(function Help2(props, ref) {
7992
7992
  return React8.createElement(
@@ -8002,7 +8002,7 @@ var Help = React8.forwardRef(function Help2(props, ref) {
8002
8002
  Help.displayName = "Help";
8003
8003
  var Help_default = Help;
8004
8004
 
8005
- // ../../node_modules/@procore/core-icons/dist/icons/Link.js
8005
+ // node_modules/@procore/core-icons/dist/icons/Link.js
8006
8006
  import * as React9 from "react";
8007
8007
  var Link = React9.forwardRef(function Link2(props, ref) {
8008
8008
  return React9.createElement(
@@ -8019,7 +8019,7 @@ var Link = React9.forwardRef(function Link2(props, ref) {
8019
8019
  Link.displayName = "Link";
8020
8020
  var Link_default = Link;
8021
8021
 
8022
- // ../../node_modules/@procore/core-icons/dist/icons/Person.js
8022
+ // node_modules/@procore/core-icons/dist/icons/Person.js
8023
8023
  import * as React10 from "react";
8024
8024
  var Person = React10.forwardRef(function Person2(props, ref) {
8025
8025
  return React10.createElement(
@@ -8035,7 +8035,7 @@ var Person = React10.forwardRef(function Person2(props, ref) {
8035
8035
  Person.displayName = "Person";
8036
8036
  var Person_default = Person;
8037
8037
 
8038
- // ../../node_modules/@procore/core-icons/dist/icons/Plus.js
8038
+ // node_modules/@procore/core-icons/dist/icons/Plus.js
8039
8039
  import * as React11 from "react";
8040
8040
  var Plus = React11.forwardRef(function Plus2(props, ref) {
8041
8041
  return React11.createElement(
@@ -8148,7 +8148,7 @@ function stylis_min(W2) {
8148
8148
  }
8149
8149
  k2 = M2(c2, r2, k2, g2, a2 + 1);
8150
8150
  t2 = k2.length;
8151
- 0 < A2 && (r2 = X2(O2, f2, I), C2 = H3(3, k2, r2, c2, D2, z2, t2, g2, a2, h), f2 = r2.join(""), void 0 !== C2 && 0 === (t2 = (k2 = C2.trim()).length) && (g2 = 0, k2 = ""));
8151
+ 0 < A2 && (r2 = X2(O2, f2, I), C2 = H2(3, k2, r2, c2, D2, z2, t2, g2, a2, h), f2 = r2.join(""), void 0 !== C2 && 0 === (t2 = (k2 = C2.trim()).length) && (g2 = 0, k2 = ""));
8152
8152
  if (0 < t2)
8153
8153
  switch (g2) {
8154
8154
  case 115:
@@ -8181,7 +8181,7 @@ function stylis_min(W2) {
8181
8181
  case 59:
8182
8182
  f2 = (0 < r2 ? f2.replace(N, "") : f2).trim();
8183
8183
  if (1 < (t2 = f2.length))
8184
- switch (0 === u2 && (q2 = f2.charCodeAt(0), 45 === q2 || 96 < q2 && 123 > q2) && (t2 = (f2 = f2.replace(" ", ":")).length), 0 < A2 && void 0 !== (C2 = H3(1, f2, c2, d, D2, z2, p.length, h, a2, h)) && 0 === (t2 = (f2 = C2.trim()).length) && (f2 = "\0\0"), q2 = f2.charCodeAt(0), g2 = f2.charCodeAt(1), q2) {
8184
+ switch (0 === u2 && (q2 = f2.charCodeAt(0), 45 === q2 || 96 < q2 && 123 > q2) && (t2 = (f2 = f2.replace(" ", ":")).length), 0 < A2 && void 0 !== (C2 = H2(1, f2, c2, d, D2, z2, p.length, h, a2, h)) && 0 === (t2 = (f2 = C2.trim()).length) && (f2 = "\0\0"), q2 = f2.charCodeAt(0), g2 = f2.charCodeAt(1), q2) {
8185
8185
  case 0:
8186
8186
  break;
8187
8187
  case 64:
@@ -8201,7 +8201,7 @@ function stylis_min(W2) {
8201
8201
  case 13:
8202
8202
  case 10:
8203
8203
  47 === b2 ? b2 = 0 : 0 === 1 + q2 && 107 !== h && 0 < f2.length && (r2 = 1, f2 += "\0");
8204
- 0 < A2 * Y2 && H3(0, f2, c2, d, D2, z2, p.length, h, a2, h);
8204
+ 0 < A2 * Y2 && H2(0, f2, c2, d, D2, z2, p.length, h, a2, h);
8205
8205
  z2 = 1;
8206
8206
  D2++;
8207
8207
  break;
@@ -8310,7 +8310,7 @@ function stylis_min(W2) {
8310
8310
  t2 = p.length;
8311
8311
  if (0 < t2) {
8312
8312
  r2 = c2;
8313
- if (0 < A2 && (C2 = H3(2, p, r2, d, D2, z2, t2, h, a2, h), void 0 !== C2 && 0 === (p = C2).length))
8313
+ if (0 < A2 && (C2 = H2(2, p, r2, d, D2, z2, t2, h, a2, h), void 0 !== C2 && 0 === (p = C2).length))
8314
8314
  return G3 + p + F3;
8315
8315
  p = r2.join(",") + "{" + p + "}";
8316
8316
  if (0 !== w2 * E2) {
@@ -8487,7 +8487,7 @@ function stylis_min(W2) {
8487
8487
  var e2 = P4(c2, c2.charCodeAt(0), c2.charCodeAt(1), c2.charCodeAt(2));
8488
8488
  return e2 !== c2 + ";" ? e2.replace(oa, " or ($1)").substring(4) : "(" + c2 + ")";
8489
8489
  }
8490
- function H3(d, c2, e2, h, a2, m2, b2, v2, n2, q2) {
8490
+ function H2(d, c2, e2, h, a2, m2, b2, v2, n2, q2) {
8491
8491
  for (var g2 = 0, x2 = c2, w3; g2 < A2; ++g2) {
8492
8492
  switch (w3 = S2[g2].call(B2, d, x2, e2, h, a2, m2, b2, v2, n2, q2)) {
8493
8493
  case void 0:
@@ -8531,11 +8531,11 @@ function stylis_min(W2) {
8531
8531
  V2 = e2;
8532
8532
  e2 = [V2];
8533
8533
  if (0 < A2) {
8534
- var h = H3(-1, c2, e2, e2, D2, z2, 0, 0, 0, 0);
8534
+ var h = H2(-1, c2, e2, e2, D2, z2, 0, 0, 0, 0);
8535
8535
  void 0 !== h && "string" === typeof h && (c2 = h);
8536
8536
  }
8537
8537
  var a2 = M2(O2, e2, c2, 0, 0);
8538
- 0 < A2 && (h = H3(-2, a2, e2, e2, D2, z2, a2.length, 0, 0, 0), void 0 !== h && (a2 = h));
8538
+ 0 < A2 && (h = H2(-2, a2, e2, e2, D2, z2, a2.length, 0, 0, 0), void 0 !== h && (a2 = h));
8539
8539
  V2 = "";
8540
8540
  E2 = 0;
8541
8541
  z2 = D2 = 1;
@@ -9343,8 +9343,8 @@ var useSavedViewsPanel = (domain, tableName) => {
9343
9343
  setIsOpen(!isOpen);
9344
9344
  localStorage.setItem(key(domain, tableName), JSON.stringify(!isOpen));
9345
9345
  };
9346
- const Button7 = () => /* @__PURE__ */ React14.createElement(SavedViewsButton, { handleClick, isOpen });
9347
- return { isOpen, SavedViewsButton: Button7 };
9346
+ const Button8 = () => /* @__PURE__ */ React14.createElement(SavedViewsButton, { handleClick, isOpen });
9347
+ return { isOpen, SavedViewsButton: Button8 };
9348
9348
  };
9349
9349
  var useSavedViewsPanel_default = useSavedViewsPanel;
9350
9350
 
@@ -9424,6 +9424,17 @@ var SavedViewCollectionMenuItem = (props) => {
9424
9424
  label: i18n.t("savedViews.actions.delete")
9425
9425
  }
9426
9426
  ];
9427
+ const preventEventBubbleToNotTriggerViewSelectEvent = React15.useCallback(
9428
+ (e2) => {
9429
+ e2.stopPropagation();
9430
+ },
9431
+ []
9432
+ );
9433
+ const hasUpdateButton = props.item.view_level !== "default" && props.canUpdate;
9434
+ const hasCopyShareLinkButton = props.item.view_level !== "default" && props.selected && !props.canUpdate && props.item.id !== "temporary";
9435
+ const hasClearTemporaryButton = props.item.id === "temporary";
9436
+ const hasOverflowMenu = props.item.view_level !== "default" && props.canEditOrDelete;
9437
+ const hasActions = hasUpdateButton || hasCopyShareLinkButton || hasClearTemporaryButton || hasOverflowMenu;
9427
9438
  return /* @__PURE__ */ React15.createElement(
9428
9439
  Container2,
9429
9440
  {
@@ -9433,7 +9444,8 @@ var SavedViewCollectionMenuItem = (props) => {
9433
9444
  "aria-label": i18n.t("savedViews.ariaLabels.menuItem", {
9434
9445
  name: props.item.name
9435
9446
  }),
9436
- "data-testid": "saved-view-collection-menu-item"
9447
+ "data-testid": "saved-view-collection-menu-item",
9448
+ onKeyDown: preventEventBubbleToNotTriggerViewSelectEvent
9437
9449
  },
9438
9450
  /* @__PURE__ */ React15.createElement(
9439
9451
  "span",
@@ -9443,7 +9455,7 @@ var SavedViewCollectionMenuItem = (props) => {
9443
9455
  },
9444
9456
  props.item.name
9445
9457
  ),
9446
- /* @__PURE__ */ React15.createElement(RowActionsBox, null, /* @__PURE__ */ React15.createElement(Box, { justifyContent: "space-between" }, props.item.view_level !== "default" && props.canUpdate && /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement(
9458
+ hasActions && /* @__PURE__ */ React15.createElement(RowActionsBox, null, /* @__PURE__ */ React15.createElement(Box, { justifyContent: "space-between" }, hasUpdateButton && /* @__PURE__ */ React15.createElement(
9447
9459
  Button2,
9448
9460
  {
9449
9461
  onClick: updateItem,
@@ -9454,7 +9466,7 @@ var SavedViewCollectionMenuItem = (props) => {
9454
9466
  loading: props.isUpdateProcessing
9455
9467
  },
9456
9468
  i18n.t("savedViews.actions.update")
9457
- )), props.item.view_level !== "default" && props.selected && !props.canUpdate && props.item.id !== "temporary" && /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement(
9469
+ ), hasCopyShareLinkButton && /* @__PURE__ */ React15.createElement(
9458
9470
  Button2,
9459
9471
  {
9460
9472
  onClick: copyShareLink,
@@ -9464,7 +9476,7 @@ var SavedViewCollectionMenuItem = (props) => {
9464
9476
  "data-testid": "copy-share-link-button"
9465
9477
  },
9466
9478
  /* @__PURE__ */ React15.createElement(IconWrapper, null, /* @__PURE__ */ React15.createElement(Link_default, { size: "sm" }))
9467
- )), props.item.id === "temporary" && /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement(
9479
+ ), hasClearTemporaryButton && /* @__PURE__ */ React15.createElement(
9468
9480
  Button2,
9469
9481
  {
9470
9482
  onClick: (e2) => {
@@ -9478,7 +9490,7 @@ var SavedViewCollectionMenuItem = (props) => {
9478
9490
  "data-testid": "clear-temporary-view-button"
9479
9491
  },
9480
9492
  /* @__PURE__ */ React15.createElement(IconWrapper, null, /* @__PURE__ */ React15.createElement(Clear_default, { size: "sm" }))
9481
- ))), /* @__PURE__ */ React15.createElement(Box, null, props.item.view_level !== "default" && props.canEditOrDelete && /* @__PURE__ */ React15.createElement("div", { onClick: (e2) => e2.stopPropagation() }, /* @__PURE__ */ React15.createElement(
9493
+ )), /* @__PURE__ */ React15.createElement(Box, null, hasOverflowMenu && /* @__PURE__ */ React15.createElement(
9482
9494
  DropdownFlyout,
9483
9495
  {
9484
9496
  "data-testid": "saved-view-overflow-button",
@@ -9489,7 +9501,7 @@ var SavedViewCollectionMenuItem = (props) => {
9489
9501
  variant: "tertiary",
9490
9502
  disabled: props.isUpdateProcessing
9491
9503
  }
9492
- ))))
9504
+ )))
9493
9505
  );
9494
9506
  };
9495
9507
 
@@ -9502,7 +9514,7 @@ var ExpandedPanel = styled_components_esm_default(Panel)`
9502
9514
  `;
9503
9515
 
9504
9516
  // src/components/panels/PanelContent.tsx
9505
- import { Flex as Flex3, useI18nContext as useI18nContext5 } from "@procore/core-react";
9517
+ import { Flex as Flex2, MenuImperative as MenuImperative2, useI18nContext as useI18nContext5 } from "@procore/core-react";
9506
9518
  import { useToastAlertContext as useToastAlertContext2 } from "@procore/toast-alert";
9507
9519
  import React17 from "react";
9508
9520
 
@@ -9878,9 +9890,9 @@ var useGroups = (isProjectLevelTool) => {
9878
9890
 
9879
9891
  // src/components/panels/ViewLevelHeader.tsx
9880
9892
  import {
9893
+ Box as Box2,
9894
+ Button as Button3,
9881
9895
  colors,
9882
- Flex as Flex2,
9883
- spacing,
9884
9896
  Typography,
9885
9897
  useI18nContext as useI18nContext4
9886
9898
  } from "@procore/core-react";
@@ -9895,27 +9907,31 @@ var groupIcon = (group) => {
9895
9907
  return /* @__PURE__ */ React16.createElement(Building_default, null);
9896
9908
  }
9897
9909
  };
9898
- var Header = styled_components_esm_default(Flex2)`
9899
- width: 100%;
9910
+ var StyledButton2 = styled_components_esm_default(Button3)`
9900
9911
  &:hover {
9901
9912
  background-color: ${colors.gray98};
9902
9913
  }
9903
9914
  `;
9904
9915
  var ViewLevelHeader = ({ expanded, toggleGroup, group }) => {
9905
9916
  const I18n = useI18nContext4();
9906
- return /* @__PURE__ */ React16.createElement(
9907
- Header,
9917
+ return /* @__PURE__ */ React16.createElement(Box2, { style: { width: "100%" } }, /* @__PURE__ */ React16.createElement(
9918
+ StyledButton2,
9908
9919
  {
9909
- alignItems: "center",
9910
- padding: `${spacing.sm}px`,
9911
- gap: `${spacing.sm}px`,
9912
- style: { cursor: "pointer" },
9913
- onClick: () => toggleGroup(group)
9920
+ block: true,
9921
+ style: {
9922
+ justifyContent: "start",
9923
+ height: "40px"
9924
+ },
9925
+ variant: "tertiary",
9926
+ size: "sm",
9927
+ onClick: () => toggleGroup(group),
9928
+ "aria-controls": `saved-views-collections-${group}`,
9929
+ "aria-expanded": expanded,
9930
+ icon: expanded ? /* @__PURE__ */ React16.createElement(ChevronDown_default, { size: "sm" }) : /* @__PURE__ */ React16.createElement(ChevronRight_default, { size: "sm" })
9914
9931
  },
9915
- expanded ? /* @__PURE__ */ React16.createElement(ChevronDown_default, { size: "sm" }) : /* @__PURE__ */ React16.createElement(ChevronRight_default, { size: "sm" }),
9916
9932
  groupIcon(group),
9917
9933
  /* @__PURE__ */ React16.createElement(Typography, { weight: "semibold" }, I18n.t(`savedViews.viewLevel.${group}`))
9918
- );
9934
+ ));
9919
9935
  };
9920
9936
  var ViewLevelHeader_default = ViewLevelHeader;
9921
9937
 
@@ -9935,8 +9951,8 @@ var useScrollToRef = (dependency) => {
9935
9951
  import {
9936
9952
  colors as colors2,
9937
9953
  DetailPage,
9938
- UNSAFE_Menu as MenuImperative,
9939
- spacing as spacing2
9954
+ MenuImperative,
9955
+ spacing
9940
9956
  } from "@procore/core-react";
9941
9957
  var Row = styled_components_esm_default(MenuImperative.Item)`
9942
9958
  width: 100%;
@@ -9951,11 +9967,16 @@ var Row = styled_components_esm_default(MenuImperative.Item)`
9951
9967
  var Panel2 = styled_components_esm_default(DetailPage.Card)`
9952
9968
  margin: 0;
9953
9969
  height: 100%;
9954
- padding-top: ${spacing2.sm}px;
9970
+ padding-top: ${spacing.sm}px;
9955
9971
  box-shadow: none;
9956
9972
  `;
9957
9973
 
9958
9974
  // src/components/panels/PanelContent.tsx
9975
+ var StyledMenuImperative = styled_components_esm_default(MenuImperative2)`
9976
+ div[role='listbox'] {
9977
+ padding: 0;
9978
+ }
9979
+ `;
9959
9980
  var PanelContent = (props) => {
9960
9981
  const { queryInput, selectedSavedView, tableConfig } = props;
9961
9982
  const { showToast } = useToastAlertContext2();
@@ -9996,40 +10017,52 @@ var PanelContent = (props) => {
9996
10017
  }
9997
10018
  });
9998
10019
  };
9999
- return /* @__PURE__ */ React17.createElement(Panel2, { "data-testid": "inner-panel" }, /* @__PURE__ */ React17.createElement(Flex3, { direction: "column", style: { height: "100%", width: "100%" } }, temporaryView && /* @__PURE__ */ React17.createElement(
10000
- Row,
10020
+ return /* @__PURE__ */ React17.createElement(Panel2, { "data-testid": "inner-panel" }, /* @__PURE__ */ React17.createElement(Flex2, { direction: "column", style: { height: "100%", width: "100%" } }, (temporaryView || presetViews) && /* @__PURE__ */ React17.createElement(
10021
+ StyledMenuImperative,
10001
10022
  {
10002
- selected: isTemporarySelected,
10003
- onClick: () => props.onSelect({ item: temporaryView }),
10004
- ref: isTemporarySelected ? selectedRowRef : null
10023
+ role: "listbox",
10024
+ onSelect: (selection) => {
10025
+ if (selectedSavedView?.id !== selection.item.id) {
10026
+ props.onSelect({ item: selection.item });
10027
+ }
10028
+ }
10005
10029
  },
10006
- /* @__PURE__ */ React17.createElement(
10007
- SavedViewCollectionMenuItem,
10030
+ /* @__PURE__ */ React17.createElement(MenuImperative2.Options, null, temporaryView && /* @__PURE__ */ React17.createElement(
10031
+ Row,
10008
10032
  {
10033
+ key: temporaryView.id,
10009
10034
  item: temporaryView,
10010
10035
  selected: isTemporarySelected,
10011
- onClearTemporary: props.onClearTemporary
10012
- }
10013
- )
10014
- ), presetViews.map((presetView) => {
10015
- const isSelected = selectedSavedView?.id === presetView.id;
10016
- return /* @__PURE__ */ React17.createElement(
10017
- Row,
10018
- {
10019
- key: presetView.id,
10020
- selected: isSelected,
10021
- onClick: () => props.onSelect({ item: presetView }),
10022
- ref: isSelected ? selectedRowRef : null
10036
+ ref: isTemporarySelected ? selectedRowRef : null
10023
10037
  },
10024
10038
  /* @__PURE__ */ React17.createElement(
10025
10039
  SavedViewCollectionMenuItem,
10026
10040
  {
10027
- item: presetView,
10028
- selected: isSelected
10041
+ item: temporaryView,
10042
+ selected: isTemporarySelected,
10043
+ onClearTemporary: props.onClearTemporary
10029
10044
  }
10030
10045
  )
10031
- );
10032
- }), viewLevels.map((level) => {
10046
+ ), presetViews.map((presetView) => {
10047
+ const isSelected = selectedSavedView?.id === presetView.id;
10048
+ return /* @__PURE__ */ React17.createElement(
10049
+ Row,
10050
+ {
10051
+ key: presetView.id,
10052
+ item: presetView,
10053
+ selected: isSelected,
10054
+ ref: isSelected ? selectedRowRef : null
10055
+ },
10056
+ /* @__PURE__ */ React17.createElement(
10057
+ SavedViewCollectionMenuItem,
10058
+ {
10059
+ item: presetView,
10060
+ selected: isSelected
10061
+ }
10062
+ )
10063
+ );
10064
+ }))
10065
+ ), viewLevels.map((level) => {
10033
10066
  const isExpanded = groups[level];
10034
10067
  const views = isExpanded && savedViews ? savedViews.filter(
10035
10068
  (view) => view.view_level === level && view.id !== "temporary"
@@ -10041,62 +10074,74 @@ var PanelContent = (props) => {
10041
10074
  toggleGroup,
10042
10075
  expanded: isExpanded
10043
10076
  }
10044
- ), views.map((view) => {
10045
- const isSelected = selectedSavedView?.id === view.id;
10046
- const canUpdate = isSelected && hasPermissionForViewLevel(view.view_level, permissions) && !isEqual(
10047
- view.table_config,
10048
- tableConfig,
10049
- props.defaultView.table_config,
10050
- props.provider
10051
- );
10052
- const canEditOrDelete = isSelected && hasPermissionForViewLevel(view.view_level, permissions);
10053
- return /* @__PURE__ */ React17.createElement(
10054
- Row,
10055
- {
10056
- key: view.id,
10057
- item: view,
10058
- selected: isSelected,
10059
- onClick: () => {
10060
- props.onSelect({ item: view });
10061
- },
10062
- ref: isSelected ? selectedRowRef : null
10063
- },
10064
- /* @__PURE__ */ React17.createElement(
10065
- SavedViewCollectionMenuItem,
10077
+ ), isExpanded && views.length > 0 && /* @__PURE__ */ React17.createElement(
10078
+ StyledMenuImperative,
10079
+ {
10080
+ id: `saved-views-collections-${level}`,
10081
+ role: "listbox",
10082
+ onSelect: (selection) => {
10083
+ if (selectedSavedView?.id !== selection.item.id) {
10084
+ props.onSelect({ item: selection.item });
10085
+ }
10086
+ }
10087
+ },
10088
+ /* @__PURE__ */ React17.createElement(MenuImperative2.Options, null, views.map((view) => {
10089
+ const isSelected = selectedSavedView?.id === view.id;
10090
+ const canUpdate = isSelected && hasPermissionForViewLevel(
10091
+ view.view_level,
10092
+ permissions
10093
+ ) && !isEqual(
10094
+ view.table_config,
10095
+ tableConfig,
10096
+ props.defaultView.table_config,
10097
+ props.provider
10098
+ );
10099
+ const canEditOrDelete = isSelected && hasPermissionForViewLevel(view.view_level, permissions);
10100
+ return /* @__PURE__ */ React17.createElement(
10101
+ Row,
10066
10102
  {
10067
- item: view,
10068
10103
  key: view.id,
10104
+ item: view,
10069
10105
  selected: isSelected,
10070
- canUpdate,
10071
- canEditOrDelete,
10072
- onUpdate: (data) => onUpdate(data),
10073
- isUpdateProcessing: isUpdateLoading,
10074
- onEdit: () => props.openModal("update" /* UPDATE */),
10075
- onDelete: props.onDelete,
10076
- permissions
10077
- }
10078
- )
10079
- );
10080
- }));
10106
+ ref: isSelected ? selectedRowRef : null
10107
+ },
10108
+ /* @__PURE__ */ React17.createElement(
10109
+ SavedViewCollectionMenuItem,
10110
+ {
10111
+ item: view,
10112
+ key: view.id,
10113
+ selected: isSelected,
10114
+ canUpdate,
10115
+ canEditOrDelete,
10116
+ onUpdate: (data) => onUpdate(data),
10117
+ isUpdateProcessing: isUpdateLoading,
10118
+ onEdit: () => props.openModal("update" /* UPDATE */),
10119
+ onDelete: props.onDelete,
10120
+ permissions
10121
+ }
10122
+ )
10123
+ );
10124
+ }))
10125
+ ));
10081
10126
  })));
10082
10127
  };
10083
10128
 
10084
10129
  // src/components/saved-views/SavedViews.tsx
10085
10130
  import {
10086
- Box as Box2,
10087
- Button as Button6,
10088
- Flex as Flex6,
10131
+ Box as Box3,
10132
+ Button as Button7,
10133
+ Flex as Flex5,
10089
10134
  Panel as Panel3,
10090
10135
  Tooltip,
10091
- useI18nContext as useI18nContext11
10136
+ useI18nContext as useI18nContext12
10092
10137
  } from "@procore/core-react";
10093
- import React22, { useState as useState4, useEffect as useEffect3, useCallback as useCallback3 } from "react";
10138
+ import React23, { useState as useState4, useEffect as useEffect4, useCallback as useCallback3 } from "react";
10094
10139
  import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
10095
10140
  import { useToastAlertContext as useToastAlertContext3, ToastAlertProvider } from "@procore/toast-alert";
10096
10141
 
10097
10142
  // src/components/modals/DeleteConfirmationModal.tsx
10098
10143
  import {
10099
- Button as Button3,
10144
+ Button as Button4,
10100
10145
  ConfirmModal,
10101
10146
  Modal,
10102
10147
  P as P2,
@@ -10120,28 +10165,27 @@ var SavedViewsDeleteConfirmationModalShared = ({
10120
10165
  style: { overflowWrap: "anywhere" }
10121
10166
  },
10122
10167
  /* @__PURE__ */ React18.createElement(Modal.Body, null, /* @__PURE__ */ React18.createElement(P2, null, i18n.t("savedViews.modal.delete.description"))),
10123
- /* @__PURE__ */ React18.createElement(Modal.Footer, null, /* @__PURE__ */ React18.createElement(Modal.FooterButtons, null, /* @__PURE__ */ React18.createElement(Button3, { variant: "secondary", onClick: onCancel }, i18n.t("savedViews.actions.cancel")), /* @__PURE__ */ React18.createElement(Button3, { variant: "primary", onClick: onDelete }, i18n.t("savedViews.actions.delete"))))
10168
+ /* @__PURE__ */ React18.createElement(Modal.Footer, null, /* @__PURE__ */ React18.createElement(Modal.FooterButtons, null, /* @__PURE__ */ React18.createElement(Button4, { variant: "secondary", onClick: onCancel }, i18n.t("savedViews.actions.cancel")), /* @__PURE__ */ React18.createElement(Button4, { variant: "primary", onClick: onDelete }, i18n.t("savedViews.actions.delete"))))
10124
10169
  );
10125
10170
  };
10126
10171
 
10127
10172
  // src/components/modals/form-modal/FormModal.tsx
10128
- import React20 from "react";
10173
+ import React21 from "react";
10129
10174
 
10130
10175
  // src/components/modals/form-modal/FormModalBase.tsx
10131
10176
  import {
10132
10177
  Banner,
10133
- Button as Button4,
10178
+ Button as Button5,
10134
10179
  colors as colors3,
10135
10180
  ErrorBanner,
10136
- Flex as Flex4,
10137
- Form,
10138
- H2,
10181
+ Flex as Flex3,
10182
+ Form as Form2,
10139
10183
  Modal as Modal2,
10140
- spacing as spacing3,
10184
+ spacing as spacing2,
10141
10185
  Typography as Typography2,
10142
- useI18nContext as useI18nContext7
10186
+ useI18nContext as useI18nContext8
10143
10187
  } from "@procore/core-react";
10144
- import * as React19 from "react";
10188
+ import * as React20 from "react";
10145
10189
  import * as yup from "yup";
10146
10190
 
10147
10191
  // src/components/modals/form-modal/FormModalBaseUtils.ts
@@ -10178,6 +10222,36 @@ function extractMessage(error, I18n) {
10178
10222
  return { form: I18n.t("savedViews.modal.errors.unknown") };
10179
10223
  }
10180
10224
 
10225
+ // src/components/modals/form-modal/NameInputField.tsx
10226
+ import { Form, useFormContext, useI18nContext as useI18nContext7 } from "@procore/core-react";
10227
+ import * as React19 from "react";
10228
+ var NAME_INPUT_ID = "saved-view-form-name-input";
10229
+ var NameInputField = ({
10230
+ error,
10231
+ onResetMutations
10232
+ }) => {
10233
+ const I18n = useI18nContext7();
10234
+ const label = I18n.t("savedViews.modal.fields.name");
10235
+ const { errors: formErrors, submitCount } = useFormContext();
10236
+ React19.useEffect(() => {
10237
+ if (submitCount > 0 && formErrors?.name) {
10238
+ document.getElementById(NAME_INPUT_ID)?.focus();
10239
+ }
10240
+ }, [formErrors?.name, submitCount]);
10241
+ return /* @__PURE__ */ React19.createElement(
10242
+ Form.Text,
10243
+ {
10244
+ id: NAME_INPUT_ID,
10245
+ name: "name",
10246
+ error,
10247
+ placeholder: label,
10248
+ label,
10249
+ colWidth: 12,
10250
+ onChange: onResetMutations
10251
+ }
10252
+ );
10253
+ };
10254
+
10181
10255
  // src/components/modals/form-modal/FormModalBase.tsx
10182
10256
  var ScrollContainer = styled_components_esm_default("div")`
10183
10257
  overflow: auto;
@@ -10197,7 +10271,7 @@ var FormModalBase = ({
10197
10271
  setOpenEditCreateModal,
10198
10272
  onSelect
10199
10273
  }) => {
10200
- const I18n = useI18nContext7();
10274
+ const I18n = useI18nContext8();
10201
10275
  const NAME_MAX_LENGTH = 150;
10202
10276
  const {
10203
10277
  mutate: createSavedView,
@@ -10256,24 +10330,17 @@ var FormModalBase = ({
10256
10330
  I18n,
10257
10331
  isProjectLevelTool
10258
10332
  );
10259
- return /* @__PURE__ */ React19.createElement(
10333
+ return /* @__PURE__ */ React20.createElement(
10260
10334
  Modal2,
10261
10335
  {
10262
- "aria-label": I18n.t("savedViews.ariaLabels.modal"),
10263
- onClickOverlay: onClose,
10336
+ howToClose: ["x", "scrim"],
10337
+ onClose,
10264
10338
  open,
10265
- style: { width: "540px" },
10339
+ width: "md",
10266
10340
  "data-testid": "create-update-modal"
10267
10341
  },
10268
- /* @__PURE__ */ React19.createElement(ScrollContainer, null, /* @__PURE__ */ React19.createElement(
10269
- Modal2.Header,
10270
- {
10271
- onClose,
10272
- style: { borderBottom: `1px solid ${colors3.gray85}` }
10273
- },
10274
- /* @__PURE__ */ React19.createElement(H2, null, header)
10275
- ), /* @__PURE__ */ React19.createElement(
10276
- Form,
10342
+ /* @__PURE__ */ React20.createElement(ScrollContainer, null, /* @__PURE__ */ React20.createElement(Modal2.Header, { style: { borderBottom: `1px solid ${colors3.gray85}` } }, /* @__PURE__ */ React20.createElement(Modal2.Heading, null, header)), /* @__PURE__ */ React20.createElement(
10343
+ Form2,
10277
10344
  {
10278
10345
  initialValues: {
10279
10346
  name: initialName,
@@ -10298,30 +10365,26 @@ var FormModalBase = ({
10298
10365
  onReset: onCancel,
10299
10366
  validateOnChange: true
10300
10367
  },
10301
- /* @__PURE__ */ React19.createElement(Form.Form, { name: header }, /* @__PURE__ */ React19.createElement(
10368
+ /* @__PURE__ */ React20.createElement(Form2.Form, { name: header }, /* @__PURE__ */ React20.createElement(
10302
10369
  Modal2.Body,
10303
10370
  {
10304
- style: { paddingTop: 0, paddingBottom: 0, marginTop: spacing3.lg }
10371
+ style: { paddingTop: 0, paddingBottom: 0, marginTop: spacing2.lg }
10305
10372
  },
10306
- errors && /* @__PURE__ */ React19.createElement(ErrorBanner, { style: { marginBottom: spacing3.xl } }, /* @__PURE__ */ React19.createElement(Banner.Content, null, /* @__PURE__ */ React19.createElement(Banner.Title, null, I18n.t("savedViews.modal.errors.title", { mode })), /* @__PURE__ */ React19.createElement(Banner.Body, null, errors?.form || I18n.t(`savedViews.modal.errors.description.${mode}`)))),
10307
- /* @__PURE__ */ React19.createElement(Form.Row, null, /* @__PURE__ */ React19.createElement(
10308
- Form.Text,
10373
+ errors && /* @__PURE__ */ React20.createElement(ErrorBanner, { style: { marginBottom: spacing2.xl } }, /* @__PURE__ */ React20.createElement(Banner.Content, null, /* @__PURE__ */ React20.createElement(Banner.Title, null, I18n.t("savedViews.modal.errors.title", { mode })), /* @__PURE__ */ React20.createElement(Banner.Body, null, errors?.form || I18n.t(`savedViews.modal.errors.description.${mode}`)))),
10374
+ /* @__PURE__ */ React20.createElement(Form2.Row, null, /* @__PURE__ */ React20.createElement(
10375
+ NameInputField,
10309
10376
  {
10310
- name: "name",
10311
10377
  error: errors?.name,
10312
- placeholder: I18n.t("savedViews.modal.fields.name"),
10313
- label: I18n.t("savedViews.modal.fields.name"),
10314
- colWidth: 12,
10315
- onChange: () => resetMutations()
10378
+ onResetMutations: resetMutations
10316
10379
  }
10317
10380
  )),
10318
- /* @__PURE__ */ React19.createElement(
10319
- Form.Row,
10381
+ /* @__PURE__ */ React20.createElement(
10382
+ Form2.Row,
10320
10383
  {
10321
- style: { marginTop: errors?.name ? spacing3.xl : spacing3.none }
10384
+ style: { marginTop: errors?.name ? spacing2.xl : spacing2.none }
10322
10385
  },
10323
- /* @__PURE__ */ React19.createElement(
10324
- Form.TextArea,
10386
+ /* @__PURE__ */ React20.createElement(
10387
+ Form2.TextArea,
10325
10388
  {
10326
10389
  name: "description",
10327
10390
  placeholder: I18n.t("savedViews.modal.fields.description"),
@@ -10331,8 +10394,8 @@ var FormModalBase = ({
10331
10394
  }
10332
10395
  )
10333
10396
  ),
10334
- viewLevelOptions.length > 1 && mode === "create" /* CREATE */ ? /* @__PURE__ */ React19.createElement(Form.Row, null, /* @__PURE__ */ React19.createElement(
10335
- Form.Select,
10397
+ viewLevelOptions.length > 1 && mode === "create" /* CREATE */ ? /* @__PURE__ */ React20.createElement(Form2.Row, null, /* @__PURE__ */ React20.createElement(
10398
+ Form2.Select,
10336
10399
  {
10337
10400
  name: "view_level",
10338
10401
  options: viewLevelOptions,
@@ -10341,9 +10404,9 @@ var FormModalBase = ({
10341
10404
  onSearch: false,
10342
10405
  onClear: false
10343
10406
  }
10344
- )) : /* @__PURE__ */ React19.createElement(React19.Fragment, null)
10345
- ), /* @__PURE__ */ React19.createElement(Modal2.Footer, { style: { borderTop: `1px solid ${colors3.gray85}` } }, /* @__PURE__ */ React19.createElement(Flex4, { grow: "1", justifyContent: "space-between", alignItems: "center" }, /* @__PURE__ */ React19.createElement(Typography2, { color: "gray45", italic: true }, /* @__PURE__ */ React19.createElement(Typography2, { color: "red45" }, "*"), " ", I18n.t("savedViews.modal.info.required_fields")), /* @__PURE__ */ React19.createElement(Modal2.FooterButtons, null, /* @__PURE__ */ React19.createElement(Button4, { type: "reset", variant: "tertiary", disabled: isLoading }, I18n.t("savedViews.actions.cancel")), /* @__PURE__ */ React19.createElement(
10346
- Button4,
10407
+ )) : /* @__PURE__ */ React20.createElement(React20.Fragment, null)
10408
+ ), /* @__PURE__ */ React20.createElement(Modal2.Footer, { style: { borderTop: `1px solid ${colors3.gray85}` } }, /* @__PURE__ */ React20.createElement(Flex3, { grow: "1", justifyContent: "space-between", alignItems: "center" }, /* @__PURE__ */ React20.createElement(Typography2, { color: "gray45", italic: true }, /* @__PURE__ */ React20.createElement(Typography2, { color: "red45" }, "*"), " ", I18n.t("savedViews.modal.info.required_fields")), /* @__PURE__ */ React20.createElement(Modal2.FooterButtons, null, /* @__PURE__ */ React20.createElement(Button5, { type: "reset", variant: "tertiary", disabled: isLoading }, I18n.t("savedViews.actions.cancel")), /* @__PURE__ */ React20.createElement(
10409
+ Button5,
10347
10410
  {
10348
10411
  "data-testid": "create-update-modal-button",
10349
10412
  type: "submit",
@@ -10358,7 +10421,7 @@ var FormModalBase = ({
10358
10421
  };
10359
10422
 
10360
10423
  // src/components/modals/form-modal/FormModal.tsx
10361
- import { useI18nContext as useI18nContext8 } from "@procore/core-react";
10424
+ import { useI18nContext as useI18nContext9 } from "@procore/core-react";
10362
10425
  var FormModal = ({
10363
10426
  open,
10364
10427
  mode,
@@ -10371,8 +10434,8 @@ var FormModal = ({
10371
10434
  onSelect,
10372
10435
  defaultView
10373
10436
  }) => {
10374
- const i18n = useI18nContext8();
10375
- return /* @__PURE__ */ React20.createElement(
10437
+ const i18n = useI18nContext9();
10438
+ return /* @__PURE__ */ React21.createElement(
10376
10439
  FormModalBase,
10377
10440
  {
10378
10441
  open,
@@ -10395,18 +10458,18 @@ var FormModal = ({
10395
10458
  // src/components/modals/form-modal/SharedViewFormModal.tsx
10396
10459
  import {
10397
10460
  Banner as Banner2,
10398
- Button as Button5,
10461
+ Button as Button6,
10399
10462
  colors as colors4,
10400
10463
  ErrorBanner as ErrorBanner2,
10401
- Flex as Flex5,
10402
- Form as Form2,
10464
+ Flex as Flex4,
10465
+ Form as Form3,
10403
10466
  Modal as Modal3,
10404
10467
  P as P3,
10405
- spacing as spacing4,
10468
+ spacing as spacing3,
10406
10469
  Typography as Typography3,
10407
- useI18nContext as useI18nContext9
10470
+ useI18nContext as useI18nContext10
10408
10471
  } from "@procore/core-react";
10409
- import * as React21 from "react";
10472
+ import * as React22 from "react";
10410
10473
  import * as yup2 from "yup";
10411
10474
  var SharedViewFormModal = ({
10412
10475
  open,
@@ -10418,7 +10481,7 @@ var SharedViewFormModal = ({
10418
10481
  isCreating,
10419
10482
  resetCreateError
10420
10483
  }) => {
10421
- const I18n = useI18nContext9();
10484
+ const I18n = useI18nContext10();
10422
10485
  const NAME_MAX_LENGTH = 150;
10423
10486
  const errors = extractMessage(createError, I18n);
10424
10487
  const handleNameChange = () => {
@@ -10429,35 +10492,36 @@ var SharedViewFormModal = ({
10429
10492
  const handleOnSubmit = (data) => {
10430
10493
  onCreateView(data.name, data.description);
10431
10494
  };
10432
- return /* @__PURE__ */ React21.createElement(
10495
+ return /* @__PURE__ */ React22.createElement(
10433
10496
  Modal3,
10434
10497
  {
10435
10498
  "data-testid": "shared-view-form-modal",
10436
10499
  open,
10437
- onClickOverlay: onClose,
10500
+ howToClose: ["x", "scrim"],
10501
+ onClose,
10438
10502
  style: { width: "540px" }
10439
10503
  },
10440
- /* @__PURE__ */ React21.createElement(
10504
+ /* @__PURE__ */ React22.createElement(
10441
10505
  Modal3.Header,
10442
10506
  {
10443
10507
  onClose,
10444
10508
  style: {
10445
- paddingTop: spacing4.lg,
10446
- paddingBottom: spacing4.xs,
10447
- paddingLeft: spacing4.xl,
10448
- paddingRight: spacing4.xl
10509
+ paddingTop: spacing3.lg,
10510
+ paddingBottom: spacing3.xs,
10511
+ paddingLeft: spacing3.xl,
10512
+ paddingRight: spacing3.xl
10449
10513
  }
10450
10514
  },
10451
- I18n.t("savedViews.modal.create.title")
10515
+ /* @__PURE__ */ React22.createElement(Modal3.Heading, null, I18n.t("savedViews.modal.create.title"))
10452
10516
  ),
10453
- /* @__PURE__ */ React21.createElement(
10517
+ /* @__PURE__ */ React22.createElement(
10454
10518
  P3,
10455
10519
  {
10456
10520
  style: {
10457
- paddingLeft: spacing4.xl,
10458
- paddingRight: spacing4.xl,
10459
- paddingBottom: spacing4.lg,
10460
- paddingTop: spacing4.none,
10521
+ paddingLeft: spacing3.xl,
10522
+ paddingRight: spacing3.xl,
10523
+ paddingBottom: spacing3.lg,
10524
+ paddingTop: spacing3.none,
10461
10525
  margin: 0,
10462
10526
  color: colors4.gray45,
10463
10527
  whiteSpace: "pre-line"
@@ -10465,8 +10529,8 @@ var SharedViewFormModal = ({
10465
10529
  },
10466
10530
  I18n.t("savedViews.modal.copyConfirmation.description")
10467
10531
  ),
10468
- /* @__PURE__ */ React21.createElement(
10469
- Form2,
10532
+ /* @__PURE__ */ React22.createElement(
10533
+ Form3,
10470
10534
  {
10471
10535
  initialValues: {
10472
10536
  name: fetchedView.name,
@@ -10484,36 +10548,32 @@ var SharedViewFormModal = ({
10484
10548
  onSubmit: handleOnSubmit,
10485
10549
  validateOnChange: true
10486
10550
  },
10487
- /* @__PURE__ */ React21.createElement(Form2.Form, { name: "share-view-form" }, /* @__PURE__ */ React21.createElement(
10551
+ /* @__PURE__ */ React22.createElement(Form3.Form, { name: "share-view-form" }, /* @__PURE__ */ React22.createElement(
10488
10552
  Modal3.Body,
10489
10553
  {
10490
10554
  style: {
10491
- paddingTop: spacing4.lg,
10555
+ paddingTop: spacing3.lg,
10492
10556
  paddingBottom: 0,
10493
10557
  borderTop: `1px solid ${colors4.gray85}`
10494
10558
  }
10495
10559
  },
10496
- errors && /* @__PURE__ */ React21.createElement(ErrorBanner2, { style: { marginBottom: spacing4.xl } }, /* @__PURE__ */ React21.createElement(Banner2.Content, null, /* @__PURE__ */ React21.createElement(Banner2.Title, null, I18n.t("savedViews.modal.errors.title", {
10560
+ errors && /* @__PURE__ */ React22.createElement(ErrorBanner2, { style: { marginBottom: spacing3.xl } }, /* @__PURE__ */ React22.createElement(Banner2.Content, null, /* @__PURE__ */ React22.createElement(Banner2.Title, null, I18n.t("savedViews.modal.errors.title", {
10497
10561
  mode: "create"
10498
- })), /* @__PURE__ */ React21.createElement(Banner2.Body, null, errors?.form || I18n.t("savedViews.modal.errors.description.create")))),
10499
- /* @__PURE__ */ React21.createElement(Form2.Row, null, /* @__PURE__ */ React21.createElement(
10500
- Form2.Text,
10562
+ })), /* @__PURE__ */ React22.createElement(Banner2.Body, null, errors?.form || I18n.t("savedViews.modal.errors.description.create")))),
10563
+ /* @__PURE__ */ React22.createElement(Form3.Row, null, /* @__PURE__ */ React22.createElement(
10564
+ NameInputField,
10501
10565
  {
10502
- name: "name",
10503
10566
  error: errors?.name,
10504
- placeholder: I18n.t("savedViews.modal.fields.name"),
10505
- label: I18n.t("savedViews.modal.fields.name"),
10506
- colWidth: 12,
10507
- onChange: handleNameChange
10567
+ onResetMutations: handleNameChange
10508
10568
  }
10509
10569
  )),
10510
- /* @__PURE__ */ React21.createElement(
10511
- Form2.Row,
10570
+ /* @__PURE__ */ React22.createElement(
10571
+ Form3.Row,
10512
10572
  {
10513
- style: { marginTop: errors?.name ? spacing4.xl : spacing4.none }
10573
+ style: { marginTop: errors?.name ? spacing3.xl : spacing3.none }
10514
10574
  },
10515
- /* @__PURE__ */ React21.createElement(
10516
- Form2.TextArea,
10575
+ /* @__PURE__ */ React22.createElement(
10576
+ Form3.TextArea,
10517
10577
  {
10518
10578
  name: "description",
10519
10579
  placeholder: I18n.t("savedViews.modal.fields.description"),
@@ -10523,8 +10583,8 @@ var SharedViewFormModal = ({
10523
10583
  }
10524
10584
  )
10525
10585
  )
10526
- ), /* @__PURE__ */ React21.createElement(Modal3.Footer, { style: { borderTop: `1px solid ${colors4.gray85}` } }, /* @__PURE__ */ React21.createElement(Flex5, { grow: "1", justifyContent: "space-between", alignItems: "center" }, /* @__PURE__ */ React21.createElement(Typography3, { color: "gray45", italic: true }, /* @__PURE__ */ React21.createElement(Typography3, { color: "red45" }, "*"), " ", I18n.t("savedViews.modal.info.required_fields")), /* @__PURE__ */ React21.createElement(Modal3.FooterButtons, null, /* @__PURE__ */ React21.createElement(
10527
- Button5,
10586
+ ), /* @__PURE__ */ React22.createElement(Modal3.Footer, { style: { borderTop: `1px solid ${colors4.gray85}` } }, /* @__PURE__ */ React22.createElement(Flex4, { grow: "1", justifyContent: "space-between", alignItems: "center" }, /* @__PURE__ */ React22.createElement(Typography3, { color: "gray45", italic: true }, /* @__PURE__ */ React22.createElement(Typography3, { color: "red45" }, "*"), " ", I18n.t("savedViews.modal.info.required_fields")), /* @__PURE__ */ React22.createElement(Modal3.FooterButtons, null, /* @__PURE__ */ React22.createElement(
10587
+ Button6,
10528
10588
  {
10529
10589
  variant: "secondary",
10530
10590
  onClick: onCreateTemporaryView,
@@ -10532,8 +10592,8 @@ var SharedViewFormModal = ({
10532
10592
  disabled: isCreating
10533
10593
  },
10534
10594
  I18n.t("savedViews.actions.viewTemporarily")
10535
- ), /* @__PURE__ */ React21.createElement(
10536
- Button5,
10595
+ ), /* @__PURE__ */ React22.createElement(
10596
+ Button6,
10537
10597
  {
10538
10598
  type: "submit",
10539
10599
  variant: "primary",
@@ -10548,9 +10608,9 @@ var SharedViewFormModal = ({
10548
10608
  };
10549
10609
 
10550
10610
  // src/utils/hooks/useViewSelection.ts
10551
- import { useState as useState3, useCallback as useCallback2, useEffect as useEffect2, useRef as useRef2, useMemo } from "react";
10611
+ import { useState as useState3, useCallback as useCallback2, useEffect as useEffect3, useRef as useRef2, useMemo } from "react";
10552
10612
  import { useSearchParams } from "react-router-dom";
10553
- import { useI18nContext as useI18nContext10 } from "@procore/core-react";
10613
+ import { useI18nContext as useI18nContext11 } from "@procore/core-react";
10554
10614
 
10555
10615
  // src/utils/viewStorage.ts
10556
10616
  var ViewStorage = {
@@ -10613,7 +10673,7 @@ var restoreUrlParameter = (currentParam, previousParam, setSearchParams) => {
10613
10673
  }
10614
10674
  };
10615
10675
  var useViewSelection = (config, savedViews, presetViews, openSharedViewModal) => {
10616
- const I18n = useI18nContext10();
10676
+ const I18n = useI18nContext11();
10617
10677
  const projectIdSegment = config.projectId ?? "company";
10618
10678
  const storageKey = `savedView_${config.domain}_${config.tableName}_${config.companyId}_${projectIdSegment}_${config.userId}`;
10619
10679
  const temporaryStorageKey = `${storageKey}-temporary`;
@@ -10689,7 +10749,7 @@ var useViewSelection = (config, savedViews, presetViews, openSharedViewModal) =>
10689
10749
  },
10690
10750
  [isViewAlreadySelected, openSharedViewModal, allViews, selectView]
10691
10751
  );
10692
- useEffect2(() => {
10752
+ useEffect3(() => {
10693
10753
  const savedViewId = searchParams.get("saved-view");
10694
10754
  restoreUrlParameter(
10695
10755
  savedViewId,
@@ -10729,7 +10789,7 @@ var SavedViewsContent = (props) => {
10729
10789
  const { data: savedViews } = useSavedViewsQuery(queryInput);
10730
10790
  const { mutate: deleteSavedView } = useDeleteSavedView(queryInput);
10731
10791
  const { showToast } = useToastAlertContext3();
10732
- const i18n = useI18nContext11();
10792
+ const i18n = useI18nContext12();
10733
10793
  const [activeModal, setActiveModal] = useState4(null);
10734
10794
  const [modalData, setModalData] = useState4(null);
10735
10795
  const openModal = (type, data) => {
@@ -10775,7 +10835,7 @@ var SavedViewsContent = (props) => {
10775
10835
  error: createError,
10776
10836
  reset: resetCreateError
10777
10837
  } = useCreateSavedView(queryInput);
10778
- useEffect3(() => {
10838
+ useEffect4(() => {
10779
10839
  if (fetchError) {
10780
10840
  showToast.error(i18n.t("savedViews.errors.notFound"));
10781
10841
  selectView(selectedView ?? props.defaultView);
@@ -10823,31 +10883,45 @@ var SavedViewsContent = (props) => {
10823
10883
  deleteSelectedView();
10824
10884
  closeModal();
10825
10885
  };
10826
- return /* @__PURE__ */ React22.createElement(StyledPanel, { provider: props.provider }, /* @__PURE__ */ React22.createElement(
10886
+ return /* @__PURE__ */ React23.createElement(StyledPanel, { provider: props.provider }, /* @__PURE__ */ React23.createElement(
10827
10887
  ExpandedPanel,
10828
10888
  {
10829
10889
  "data-testid": "saved-view-expanded-panel",
10830
10890
  provider: props.provider
10831
10891
  },
10832
- /* @__PURE__ */ React22.createElement(Panel3.Header, { id: "saved-views-collections-panel-header" }, /* @__PURE__ */ React22.createElement(Panel3.Title, null, /* @__PURE__ */ React22.createElement(Flex6, { alignItems: "center" }, /* @__PURE__ */ React22.createElement(Box2, { paddingRight: "sm" }, i18n.t("savedViews.title")), /* @__PURE__ */ React22.createElement(Tooltip, { showDelay: 200, overlay: i18n.t("savedViews.tooltip") }, /* @__PURE__ */ React22.createElement(Help_default, { size: "sm" })))), /* @__PURE__ */ React22.createElement(
10892
+ /* @__PURE__ */ React23.createElement(Panel3.Header, { id: "saved-views-collections-panel-header" }, /* @__PURE__ */ React23.createElement(Panel3.Title, null, /* @__PURE__ */ React23.createElement(Flex5, { alignItems: "center" }, /* @__PURE__ */ React23.createElement(Box3, { paddingRight: "sm" }, i18n.t("savedViews.title")), /* @__PURE__ */ React23.createElement(
10893
+ Tooltip,
10894
+ {
10895
+ showDelay: 200,
10896
+ overlay: /* @__PURE__ */ React23.createElement(Tooltip.Content, null, i18n.t("savedViews.tooltip"))
10897
+ },
10898
+ /* @__PURE__ */ React23.createElement(
10899
+ Help_default,
10900
+ {
10901
+ tabIndex: 0,
10902
+ size: "sm",
10903
+ "aria-label": i18n.t("savedViews.tooltip")
10904
+ }
10905
+ )
10906
+ ))), /* @__PURE__ */ React23.createElement(
10833
10907
  Tooltip,
10834
10908
  {
10835
10909
  overlay: i18n.t("savedViews.actions.create"),
10836
10910
  showDelay: 1e3
10837
10911
  },
10838
- /* @__PURE__ */ React22.createElement("span", null, /* @__PURE__ */ React22.createElement(
10839
- Button6,
10912
+ /* @__PURE__ */ React23.createElement(
10913
+ Button7,
10840
10914
  {
10841
- icon: /* @__PURE__ */ React22.createElement(Plus_default, null),
10915
+ icon: /* @__PURE__ */ React23.createElement(Plus_default, null),
10842
10916
  variant: "secondary",
10843
10917
  "data-testid": "expanded-panel-create-button",
10844
10918
  onClick: () => openModal("create" /* CREATE */),
10845
10919
  "aria-label": i18n.t("savedViews.actions.create")
10846
10920
  },
10847
10921
  i18n.t("savedViews.actions.create")
10848
- ))
10922
+ )
10849
10923
  )),
10850
- /* @__PURE__ */ React22.createElement(Panel3.Body, { style: { display: "flex", flexFlow: "column" } }, /* @__PURE__ */ React22.createElement(
10924
+ /* @__PURE__ */ React23.createElement(Panel3.Body, { style: { display: "flex", flexFlow: "column" } }, /* @__PURE__ */ React23.createElement(
10851
10925
  PanelContent,
10852
10926
  {
10853
10927
  onSelect: ({ item }) => selectView(item),
@@ -10864,7 +10938,7 @@ var SavedViewsContent = (props) => {
10864
10938
  onClearTemporary: clearTemporaryView
10865
10939
  }
10866
10940
  ))
10867
- ), (isModalOpen("create" /* CREATE */) || isModalOpen("update" /* UPDATE */)) && /* @__PURE__ */ React22.createElement(
10941
+ ), (isModalOpen("create" /* CREATE */) || isModalOpen("update" /* UPDATE */)) && /* @__PURE__ */ React23.createElement(
10868
10942
  FormModal,
10869
10943
  {
10870
10944
  open: true,
@@ -10878,14 +10952,14 @@ var SavedViewsContent = (props) => {
10878
10952
  setOpenEditCreateModal: closeModal,
10879
10953
  defaultView: props.defaultView
10880
10954
  }
10881
- ), selectedView && isModalOpen("delete" /* DELETE */) && /* @__PURE__ */ React22.createElement(
10955
+ ), selectedView && isModalOpen("delete" /* DELETE */) && /* @__PURE__ */ React23.createElement(
10882
10956
  SavedViewsDeleteConfirmationModalShared,
10883
10957
  {
10884
10958
  open: true,
10885
10959
  onDelete: confirmDeleteAndCloseModal,
10886
10960
  onCancel: closeModal
10887
10961
  }
10888
- ), fetchedView && isModalOpen("sharedView" /* SHARED_VIEW */) && /* @__PURE__ */ React22.createElement(
10962
+ ), fetchedView && isModalOpen("sharedView" /* SHARED_VIEW */) && /* @__PURE__ */ React23.createElement(
10889
10963
  SharedViewFormModal,
10890
10964
  {
10891
10965
  open: true,
@@ -10900,11 +10974,11 @@ var SavedViewsContent = (props) => {
10900
10974
  ));
10901
10975
  };
10902
10976
  var SavedViews = (props) => {
10903
- return /* @__PURE__ */ React22.createElement(EnvironmentI18nProvider, null, /* @__PURE__ */ React22.createElement(QueryClientProvider, { client: queryClient }, /* @__PURE__ */ React22.createElement(ToastAlertProvider, null, /* @__PURE__ */ React22.createElement(SavedViewsContent, { ...props }))));
10977
+ return /* @__PURE__ */ React23.createElement(EnvironmentI18nProvider, null, /* @__PURE__ */ React23.createElement(QueryClientProvider, { client: queryClient }, /* @__PURE__ */ React23.createElement(ToastAlertProvider, null, /* @__PURE__ */ React23.createElement(SavedViewsContent, { ...props }))));
10904
10978
  };
10905
10979
 
10906
10980
  // src/components/adapters/smart-grid/SmartGridSavedViews.tsx
10907
- import React23, { useCallback as useCallback4 } from "react";
10981
+ import React24, { useCallback as useCallback4 } from "react";
10908
10982
 
10909
10983
  // src/components/adapters/smart-grid/SmartGridDefaultSavedView.tsx
10910
10984
  import { useMemo as useMemo2 } from "react";
@@ -10967,7 +11041,7 @@ var useNormalizedDefaultViews = (defaultViews, gridApi) => {
10967
11041
  };
10968
11042
 
10969
11043
  // src/components/adapters/smart-grid/useSmartGridConfig.ts
10970
- import { useState as useState5, useEffect as useEffect4 } from "react";
11044
+ import { useState as useState5, useEffect as useEffect5 } from "react";
10971
11045
  var GRID_STATE_EVENTS = [
10972
11046
  "sortChanged",
10973
11047
  "filterOpened",
@@ -10986,7 +11060,7 @@ var useSmartGridConfig = (gridApi) => {
10986
11060
  const [config, setConfig] = useState5(
10987
11061
  () => getSmartGridConfig(gridApi)
10988
11062
  );
10989
- useEffect4(() => {
11063
+ useEffect5(() => {
10990
11064
  if (!gridApi)
10991
11065
  return;
10992
11066
  const updateConfig = () => {
@@ -11033,7 +11107,7 @@ var SmartGridSavedViews = (props) => {
11033
11107
  },
11034
11108
  [gridApi, tableConfig, setTableConfig]
11035
11109
  );
11036
- return /* @__PURE__ */ React23.createElement(
11110
+ return /* @__PURE__ */ React24.createElement(
11037
11111
  SavedViews,
11038
11112
  {
11039
11113
  onSelect,
@@ -11051,7 +11125,7 @@ var SmartGridSavedViews = (props) => {
11051
11125
  };
11052
11126
 
11053
11127
  // src/components/adapters/data-table/DataTableSavedViews.tsx
11054
- import React24, {
11128
+ import React25, {
11055
11129
  forwardRef as forwardRef11,
11056
11130
  useImperativeHandle,
11057
11131
  useState as useState6,
@@ -11151,7 +11225,7 @@ var DataTableSavedViews = forwardRef11((props, ref) => {
11151
11225
  if (!internalTableConfig) {
11152
11226
  return null;
11153
11227
  }
11154
- return /* @__PURE__ */ React24.createElement(
11228
+ return /* @__PURE__ */ React25.createElement(
11155
11229
  SavedViews,
11156
11230
  {
11157
11231
  onSelect,