@box/unified-share-modal 0.49.0 → 0.50.0

package/dist/esm/lib/components/unified-share-form-modal/collaboration-section/collaboration-section.js

@@ -1,111 +1,128 @@
-import { useRef as H, useEffect as K, useCallback as C } from "react";
-import { createPortal as W } from "react-dom";
-import { useIntl as z } from "react-intl";
-import { useUniqueId as J, useLabelable as Q, Modal as i } from "@box/blueprint-web";
-import { UserSelectorContainer as X } from "@box/user-selector";
-import { CollaborationRole as Y } from "./collaboration-role.js";
-import { SharedWithAvatars as Z } from "./shared-with-avatars.js";
-import { TextAreaContainer as $ } from "./text-area-container.js";
-import { COLLABORATION_MESSAGE_CHARACTER_LIMIT as ee } from "../../../constants.js";
-import a from "./messages.js";
-import { jsxs as s, jsx as n, Fragment as te } from "react/jsx-runtime";
-import { useCollaborationForm as oe } from "../../../hooks/use-collaboration-form.js";
-import { useUnifiedShareFormContext as ae } from "../../../contexts/unified-share-form-context.js";
-import { useUnifiedShareModalContext as ne } from "../../../contexts/unified-share-modal-context.js";
-import '../../../../../styles/collaboration-section.css';const re = "_container_19jv3_1", le = "_label_19jv3_7", A = {
-  container: re,
-  label: le
+import { useRef as X, useEffect as Y, useCallback as g } from "react";
+import { createPortal as Z } from "react-dom";
+import { useIntl as $ } from "react-intl";
+import { useUniqueId as ee, useLabelable as te, Tooltip as oe, Focusable as ae, Modal as m } from "@box/blueprint-web";
+import { UserSelectorContainer as ne } from "@box/user-selector";
+import { CollaborationRole as re } from "./collaboration-role.js";
+import { SharedWithAvatars as ie } from "./shared-with-avatars.js";
+import { TextAreaContainer as le } from "./text-area-container.js";
+import { COLLABORATION_MESSAGE_CHARACTER_LIMIT as se } from "../../../constants.js";
+import t from "./messages.js";
+import { jsxs as u, jsx as o, Fragment as ce } from "react/jsx-runtime";
+import { useCollaborationForm as me } from "../../../hooks/use-collaboration-form.js";
+import { useUnifiedShareFormContext as ue } from "../../../contexts/unified-share-form-context.js";
+import { useUnifiedShareModalContext as de } from "../../../contexts/unified-share-modal-context.js";
+import '../../../../../styles/collaboration-section.css';const fe = "_container_19jv3_1", be = "_label_19jv3_7", B = {
+  container: fe,
+  label: be
 };
-function Fe() {
+function xe() {
   const {
-    formatMessage: o
-  } = z(), {
-    contactValue: B,
-    container: c,
-    onModalOpenChange: v,
-    onShareViewChange: m,
-    shareView: e,
-    userContacts: g
-  } = ae(), {
-    config: r,
-    contactService: x,
-    isFetching: E,
-    isSubmitting: u,
-    sharingService: I
-  } = ne(), {
-    getContacts: d,
-    getContactsAvatarUrls: f
-  } = x, {
-    sendInvitations: P,
-    sendSharedLink: _
-  } = I, h = e === "default" || e === "invite", l = e === "invite" || e === "email", S = H(e === "email" ? "email" : "invite");
-  K(() => {
-    S.current = e === "email" ? "email" : "invite";
-  }, [e]);
-  let b, p;
-  e === "invite" && (b = P, p = "invite-collaborators"), e === "email" && (b = _, p = "email-shared-link");
+    formatMessage: e
+  } = $(), {
+    contactValue: I,
+    container: d,
+    onModalOpenChange: S,
+    onShareViewChange: f,
+    shareView: a,
+    userContacts: F
+  } = ue(), {
+    config: i,
+    contactService: T,
+    isFetching: _,
+    isSubmitting: x,
+    item: E,
+    sharingService: P
+  } = de(), {
+    permissions: k = {},
+    type: O
+  } = E, {
+    getContacts: b,
+    getContactsAvatarUrls: h
+  } = T, {
+    sendInvitations: V,
+    sendSharedLink: y
+  } = P;
+  let p, C;
+  a === "invite" && (p = V, C = "invite-collaborators"), a === "email" && (p = y, C = "email-shared-link");
   const {
-    errors: O,
-    handleFormReset: F,
-    handleFormSubmit: V,
-    handleSelectedUsersChange: M,
-    handleUserSelectorBlur: R,
-    isFormSubmitting: L,
-    updateContactValue: k
-  } = oe(b, p), N = C((t) => (t.stopPropagation(), !0), []), y = C((t) => d ? d(t, S.current) : Promise.resolve([]), [d]), T = C((t) => f ? f(t) : Promise.resolve({}), [f]), j = (t) => {
-    l || m("invite"), k(t);
-  }, w = () => {
-    F(), m("default");
-  }, q = async () => {
-    await V() || (F(), v && v(!1), m("default"));
-  }, U = J("user-contacts-"), D = o(h ? a.invitePeopleLabel : a.emailSharedLinkLabel), G = Q(D, U);
-  return /* @__PURE__ */ s("form", {
-    className: A.container,
-    onSubmit: (t) => t.preventDefault(),
-    children: [r.collaborationNotices, /* @__PURE__ */ s("div", {
-      children: [h && r.collaborators && /* @__PURE__ */ n(Z, {}), /* @__PURE__ */ n(G, {
-        className: A.label
-      }), /* @__PURE__ */ n(X, {
-        className: "collaboration-user-selector",
-        clearButtonAriaLabel: o(a.clearButton),
-        clearOnBlur: !1,
-        disabled: u,
-        error: O["user-contact"],
-        fetchAvatarUrls: T,
-        fetchUsers: y,
-        hideOnEscape: N,
-        idForLabel: U,
-        inputValue: B,
-        label: null,
-        onBlur: R,
-        onInputValueChange: j,
-        onSelectedUsersChange: M,
-        placeholder: g.length ? "" : o(a.invitePeoplePlaceholder),
-        portalElement: c,
-        selectedUsers: g,
-        selectOnEnterOrTab: !0,
-        variant: l ? "textarea" : "input"
-      }), h && r.collaborationRole && /* @__PURE__ */ n(Y, {})]
-    }), l && r.collaborationMessage && /* @__PURE__ */ n($, {
-      maxCount: ee
-    }), l && c && /* @__PURE__ */ W(/* @__PURE__ */ s(te, {
-      children: [!E && /* @__PURE__ */ s(i.Footer, {
-        children: [/* @__PURE__ */ n(i.Footer.SecondaryButton, {
-          disabled: u ?? L,
-          onClick: w,
-          children: o(a.cancelButton)
-        }), /* @__PURE__ */ n(i.Footer.PrimaryButton, {
-          loading: u ?? L,
-          loadingAriaLabel: o(a.loadingLabel),
-          onClick: q,
-          children: o(a.sendButton)
+    errors: M,
+    handleFormReset: L,
+    handleFormSubmit: R,
+    handleSelectedUsersChange: N,
+    handleUserSelectorBlur: w,
+    isFormSubmitting: j,
+    updateContactValue: D
+  } = me(p, C), r = a === "default" || a === "invite", l = a === "invite" || a === "email", v = x ?? j, U = X(a === "email" ? "email" : "invite");
+  Y(() => {
+    U.current = a === "email" ? "email" : "invite";
+  }, [a]);
+  const W = g((n) => (n.stopPropagation(), !0), []), q = g((n) => b ? b(n, U.current) : Promise.resolve([]), [b]), G = g((n) => h ? h(n) : Promise.resolve({}), [h]), H = (n) => {
+    l || f("invite"), D(n);
+  }, K = () => {
+    L(), f("default");
+  }, z = async () => {
+    await R() || (L(), S && S(!1), f("default"));
+  };
+  let s, c = !1;
+  r && !k.canInviteCollaborator && (s = e(t.inviteDisabledTooltip), c = !0), r && O === "web_link" && (s = e(t.inviteWebLinkDisabledTooltip), c = !0);
+  const A = ee("user-contacts-"), J = e(r ? t.invitePeopleLabel : t.emailSharedLinkLabel), Q = te(J, A);
+  return /* @__PURE__ */ u("form", {
+    className: B.container,
+    onSubmit: (n) => n.preventDefault(),
+    children: [i.collaborationNotices, /* @__PURE__ */ u("div", {
+      children: [r && i.collaborators && /* @__PURE__ */ o(ie, {}), /* @__PURE__ */ o(Q, {
+        className: B.label
+      }), /* @__PURE__ */ o(oe, {
+        content: s,
+        "data-testid": "user-contacts-tooltip",
+        open: s ? void 0 : !1,
+        side: "bottom",
+        children: /* @__PURE__ */ o(ae, {
+          focusable: c,
+          children: /* @__PURE__ */ o(ne, {
+            className: "collaboration-user-selector",
+            clearButtonAriaLabel: e(t.clearButton),
+            clearOnBlur: !1,
+            disabled: c || v,
+            error: M["user-contact"],
+            fetchAvatarUrls: G,
+            fetchUsers: q,
+            hideOnEscape: W,
+            idForLabel: A,
+            inputValue: I,
+            label: null,
+            onBlur: w,
+            onInputValueChange: H,
+            onSelectedUsersChange: N,
+            placeholder: F.length ? "" : e(t.invitePeoplePlaceholder),
+            portalElement: d,
+            selectedUsers: F,
+            selectOnEnterOrTab: !0,
+            variant: l ? "textarea" : "input"
+          })
+        })
+      }), r && i.collaborationRole && /* @__PURE__ */ o(re, {})]
+    }), l && i.collaborationMessage && /* @__PURE__ */ o(le, {
+      maxCount: se
+    }), l && d && /* @__PURE__ */ Z(/* @__PURE__ */ u(ce, {
+      children: [!_ && /* @__PURE__ */ u(m.Footer, {
+        children: [/* @__PURE__ */ o(m.Footer.SecondaryButton, {
+          disabled: v,
+          onClick: K,
+          children: e(t.cancelButton)
+        }), /* @__PURE__ */ o(m.Footer.PrimaryButton, {
+          loading: v,
+          loadingAriaLabel: e(t.loadingLabel),
+          onClick: z,
+          children: e(t.sendButton)
         })]
-      }), /* @__PURE__ */ n(i.Close, {
-        "aria-label": o(a.closeButton)
+      }), /* @__PURE__ */ o(m.Close, {
+        "aria-label": e(t.closeButton)
       })]
-    }), c)]
+    }), d)]
   });
 }
 export {
-  Fe as CollaborationSection
+  xe as CollaborationSection
 };

package/dist/esm/lib/components/unified-share-form-modal/collaboration-section/messages.js

@@ -83,6 +83,14 @@ const o = e({
   uploaderDescription: {
     id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.uploaderDescription",
     defaultMessage: "Upload-only"
+  },
+  inviteDisabledTooltip: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.inviteDisabledTooltip",
+    defaultMessage: "You do not have permission to invite collaborators"
+  },
+  inviteWebLinkDisabledTooltip: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.inviteWebLinkDisabledTooltip",
+    defaultMessage: "Collaborators cannot be added to bookmarks"
   }
 });
 export {

package/dist/esm/lib/components/unified-share-form-modal/shared-link-section/messages.js

@@ -12,6 +12,14 @@ const i = e({
     id: "groupSharedFeatures.usm.unifiedShareFormModal.sharedLinkSection.sharedLinkToggleTooltip",
     defaultMessage: "Create and copy link"
   },
+  createLinkDisabledTooltip: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.sharedLinkSection.createLinkDisabledTooltip",
+    defaultMessage: "You do not have permission to create the link"
+  },
+  removeLinkDisabledTooltip: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.sharedLinkSection.removeLinkDisabledTooltip",
+    defaultMessage: "You do not have permission to remove the link"
+  },
   sharedLinkSettingsLabel: {
     id: "groupSharedFeatures.usm.unifiedShareFormModal.sharedLinkSection.sharedLinkSettingsLabel",
     defaultMessage: "Link Settings"
@@ -76,6 +84,10 @@ const i = e({
     id: "groupSharedFeatures.usm.unifiedShareFormModal.sharedLinkSection.hubsAccessLevelItem",
     defaultMessage: "hub"
   },
+  webLinkAccessLevelItem: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.sharedLinkSection.webLinkAccessLevelItem",
+    defaultMessage: "bookmark"
+  },
   disabledAccessLevelTooltip: {
     id: "groupSharedFeatures.usm.unifiedShareFormModal.sharedLinkSection.disabledAccessLevelTooltip",
     defaultMessage: "This option is not available due to a security policy"

package/dist/esm/lib/components/unified-share-form-modal/shared-link-section/shared-link-access.js

@@ -1,67 +1,70 @@
-import L from "clsx";
-import { useState as k } from "react";
-import { useIntl as A } from "react-intl";
-import { DropdownMenu as n, TriggerButton as M, Tooltip as I, Focusable as z } from "@box/blueprint-web";
-import T from "./messages.js";
-import { jsxs as q, jsx as e } from "react/jsx-runtime";
-import { useUnifiedShareModalContext as w } from "../../../contexts/unified-share-modal-context.js";
-import { useSharingAction as O } from "../../../hooks/use-sharing-action.js";
-import { useAccessLevels as j } from "../../../hooks/use-access-levels.js";
-import '../../../../../styles/shared-link-access.css';const y = "_container_xhq4z_1", D = "_overrides_xhq4z_1", N = "_content_xhq4z_6", s = {
-  container: y,
-  overrides: D,
-  content: N
+import k from "clsx";
+import { useState as M } from "react";
+import { useIntl as I } from "react-intl";
+import { DropdownMenu as n, TriggerButton as z, Tooltip as T, Focusable as q } from "@box/blueprint-web";
+import w from "./messages.js";
+import { jsxs as O, jsx as e } from "react/jsx-runtime";
+import { useUnifiedShareModalContext as j } from "../../../contexts/unified-share-modal-context.js";
+import { useSharingAction as y } from "../../../hooks/use-sharing-action.js";
+import { useAccessLevels as D } from "../../../hooks/use-access-levels.js";
+import '../../../../../styles/shared-link-access.css';const N = "_container_xhq4z_1", R = "_overrides_xhq4z_1", B = "_content_xhq4z_6", s = {
+  container: N,
+  overrides: R,
+  content: B
 };
-function P() {
+function V() {
   const {
     formatMessage: d
-  } = A(), [c, m] = k(!1), {
+  } = I(), [c, m] = M(!1), {
     isSubmitting: h,
-    sharedLink: p,
-    sharingService: u
-  } = w(), {
-    access: f
+    item: p,
+    sharedLink: u,
+    sharingService: f
+  } = j(), {
+    permissions: g = {}
   } = p, {
-    changeSharedLinkAccess: g
+    access: S
   } = u, {
-    isLoading: b,
-    onAction: x
-  } = O(g), {
+    changeSharedLinkAccess: b
+  } = f, {
+    isLoading: x,
+    onAction: v
+  } = y(b), {
     allowedLevels: r,
     selectedAccess: i
-  } = j();
+  } = D();
   if (!r.length || !i)
     return null;
   const {
-    label: S
+    label: _
   } = i;
-  return /* @__PURE__ */ q(n.Root, {
+  return /* @__PURE__ */ O(n.Root, {
     onOpenChange: m,
     open: c,
     children: [/* @__PURE__ */ e(n.Trigger, {
-      children: /* @__PURE__ */ e(M, {
+      children: /* @__PURE__ */ e(z, {
         caretDirection: c ? "up" : "down",
-        className: L(s.container, s.overrides),
-        disabled: h ?? b,
-        label: S,
+        className: k(s.container, s.overrides),
+        disabled: !g.canSetShareAccess || (h ?? x),
+        label: _,
         size: "extraSmall",
         variant: "tertiary"
       })
     }), /* @__PURE__ */ e(n.Content, {
       align: "start",
       className: s.content,
-      children: r.map((v) => {
+      children: r.map((A) => {
         const {
           description: a,
-          disabledReason: _,
+          disabledReason: C,
           id: t,
           label: l
-        } = v, o = f === t, C = () => {
-          o || x(t);
+        } = A, o = S === t, L = () => {
+          o || v(t);
         };
-        return _ ? /* @__PURE__ */ e(I, {
-          content: d(T.disabledAccessLevelTooltip),
-          children: /* @__PURE__ */ e(z, {
+        return C ? /* @__PURE__ */ e(T, {
+          content: d(w.disabledAccessLevelTooltip),
+          children: /* @__PURE__ */ e(q, {
             children: /* @__PURE__ */ e(n.CheckboxItem, {
               checked: o,
               disabled: !0,
@@ -73,7 +76,7 @@ function P() {
           })
         }, t) : /* @__PURE__ */ e(n.CheckboxItem, {
           checked: o,
-          onSelect: C,
+          onSelect: L,
           children: /* @__PURE__ */ e(n.Item.MainContent, {
             caption: a,
             label: l
@@ -84,5 +87,5 @@ function P() {
   });
 }
 export {
-  P as SharedLinkAccess
+  V as SharedLinkAccess
 };

package/dist/esm/lib/components/unified-share-form-modal/shared-link-section/shared-link-permission.js

@@ -1,66 +1,69 @@
-import L from "clsx";
-import { useState as C } from "react";
-import { DropdownMenu as e, TriggerButton as k } from "@box/blueprint-web";
-import { jsxs as M, jsx as n } from "react/jsx-runtime";
-import { usePermissionLevels as z } from "../../../hooks/use-permission-levels.js";
-import { useUnifiedShareModalContext as P } from "../../../contexts/unified-share-modal-context.js";
-import { useSharingAction as q } from "../../../hooks/use-sharing-action.js";
-import '../../../../../styles/shared-link-access.css';const w = "_container_xhq4z_1", I = "_overrides_xhq4z_1", O = "_content_xhq4z_6", o = {
-  container: w,
-  overrides: I,
-  content: O
+import k from "clsx";
+import { useState as M } from "react";
+import { DropdownMenu as e, TriggerButton as z } from "@box/blueprint-web";
+import { jsxs as P, jsx as n } from "react/jsx-runtime";
+import { usePermissionLevels as q } from "../../../hooks/use-permission-levels.js";
+import { useUnifiedShareModalContext as w } from "../../../contexts/unified-share-modal-context.js";
+import { useSharingAction as A } from "../../../hooks/use-sharing-action.js";
+import '../../../../../styles/shared-link-access.css';const I = "_container_xhq4z_1", O = "_overrides_xhq4z_1", j = "_content_xhq4z_6", o = {
+  container: I,
+  overrides: O,
+  content: j
 };
-function R() {
-  const [r, a] = C(!1), {
+function E() {
+  const [s, a] = M(!1), {
     isSubmitting: l,
+    item: m,
     sharedLink: d,
-    sharingService: m
-  } = P(), {
-    access: h,
-    permission: p
-  } = d, {
-    changeSharedLinkPermission: u
+    sharingService: h
+  } = w(), {
+    permissions: p = {}
   } = m, {
-    isLoading: g,
-    onAction: f
-  } = q(u), {
+    access: u,
+    permission: g
+  } = d, {
+    changeSharedLinkPermission: S
+  } = h, {
+    isLoading: f,
+    onAction: x
+  } = A(S), {
     allowedLevels: i,
-    selectedPermission: s
-  } = z();
-  if (h === "collaborators" || !i.length || !s)
+    selectedPermission: r
+  } = q();
+  if (u === "collaborators" || !i.length || !r)
     return null;
   const {
-    label: S
-  } = s;
-  return /* @__PURE__ */ M(e.Root, {
+    label: _
+  } = r;
+  return /* @__PURE__ */ P(e.Root, {
     onOpenChange: a,
-    open: r,
+    open: s,
     children: [/* @__PURE__ */ n(e.Trigger, {
-      children: /* @__PURE__ */ n(k, {
-        caretDirection: r ? "up" : "down",
-        className: L(o.container, o.overrides),
-        disabled: l ?? g,
-        label: S,
+      children: /* @__PURE__ */ n(z, {
+        caretDirection: s ? "up" : "down",
+        className: k(o.container, o.overrides),
+        disabled: !p.canSetShareAccess || (l ?? f),
+        label: _,
         size: "extraSmall",
         variant: "tertiary"
       })
     }), /* @__PURE__ */ n(e.Content, {
       align: "start",
       className: o.content,
-      children: i.map((x) => {
+      children: i.map((b) => {
         const {
-          description: _,
+          description: v,
           id: t,
-          label: b
-        } = x, c = p === t, v = () => {
-          c || f(t);
+          label: L
+        } = b, c = g === t, C = () => {
+          c || x(t);
         };
         return /* @__PURE__ */ n(e.CheckboxItem, {
           checked: c,
-          onSelect: v,
+          onSelect: C,
           children: /* @__PURE__ */ n(e.Item.MainContent, {
-            caption: _,
-            label: b
+            caption: v,
+            label: L
           })
         }, t);
       })
@@ -68,5 +71,5 @@ function R() {
   });
 }
 export {
-  R as SharedLinkPermission
+  E as SharedLinkPermission
 };