@box/unified-share-modal 0.45.1

package/dist/esm/lib/components/shared-link-settings-modal/shared-link-settings-modal.js

@@ -0,0 +1,181 @@
+import { useMemo as H } from "react";
+import { useIntl as O } from "react-intl";
+import { Modal as r, Text as C, Link as Y, Switch as d, DateI18nProvider as q, DatePicker as G, InlineNotice as E, TextInput as k } from "@box/blueprint-web";
+import e from "./messages.js";
+import { jsx as n, jsxs as s, Fragment as L } from "react/jsx-runtime";
+import { useAccessLevels as J } from "../../hooks/use-access-levels.js";
+import { formatDateFromTimestampToCalendarDate as K, formatTomorrowDateToCalendarDate as Q } from "../../utils/date.js";
+import { useLinkSettingsForm as X } from "../../hooks/use-link-settings-form.js";
+import { useUnifiedShareModalContext as Z } from "../../contexts/unified-share-modal-context.js";
+import '../../../../styles/shared-link-settings-modal.css';const aa = "_content_1wiic_1", ea = "_body_1wiic_5", D = {
+  content: aa,
+  body: ea
+}, na = "••••••••";
+function ga({
+  isOpen: P,
+  onOpenChange: c
+}) {
+  const {
+    formatMessage: a
+  } = O(), {
+    eventService: f,
+    isSubmitting: N,
+    sharedLink: S
+  } = Z(), {
+    expiresAt: p,
+    permissions: i = {},
+    vanityDomain: T,
+    vanityName: h
+  } = S, {
+    onSharedLinkSettingsClose: v
+  } = f, {
+    selectedAccess: g
+  } = J(), b = p ? K(p) : void 0, w = H(() => ({
+    expiration: b,
+    isDownloadEnabled: i.isDownloadEnabled ?? !1,
+    isExpirationEnabled: !!b,
+    isPasswordEnabled: i.isPasswordEnabled ?? !1,
+    isVanityEnabled: !!h,
+    password: "",
+    vanityName: h || ""
+  }), [b, i, h]), {
+    errors: u,
+    formData: o,
+    handleFormReset: x,
+    handleFormSubmit: A,
+    isUpdating: I,
+    setFieldError: m,
+    setFieldValue: l
+  } = X(w), V = () => {
+    x(), v && v(), c(!1);
+  }, F = async () => {
+    await A() || (x(), c(!1));
+  }, M = (t) => {
+    l("isExpirationEnabled", t);
+  }, _ = (t) => {
+    m("expiration", void 0), l("expiration", t);
+  }, B = (t) => {
+    l("isVanityEnabled", t);
+  }, U = (t) => {
+    m("vanityName", void 0), l("vanityName", t.target.value);
+  }, R = (t) => {
+    l("isPasswordEnabled", t);
+  }, W = (t) => {
+    m("password", void 0), l("password", t.target.value);
+  }, j = (t) => {
+    l("isDownloadEnabled", t);
+  }, $ = i.canChangeVanityName && !!o.vanityName, z = `${T || ""}${o.vanityName}`, y = N || I;
+  return /* @__PURE__ */ n(r, {
+    onOpenChange: c,
+    open: P,
+    children: /* @__PURE__ */ s(r.Content, {
+      className: D.content,
+      size: "medium",
+      children: [/* @__PURE__ */ n(r.Header, {
+        children: a(e.title)
+      }), /* @__PURE__ */ s(r.Body, {
+        className: D.body,
+        children: [/* @__PURE__ */ n(C, {
+          as: "p",
+          color: "textOnLightSecondary",
+          children: a(e.subtitle, {
+            learnSharedLinkSettingsLink: /* @__PURE__ */ n(Y, {
+              href: "https://support.box.com/hc/en-us/articles/360043697554-Configuring-Individual-Shared-Link-Settings",
+              rel: "noreferrer",
+              target: "_blank",
+              children: a(e.learnSharedLinkSettingsLink)
+            })
+          })
+        }), /* @__PURE__ */ n(d.Item, {
+          checked: o.isExpirationEnabled,
+          disabled: !i.canChangeExpiration,
+          label: a(e.linkExpirationToggleText),
+          onCheckedChange: M,
+          value: "link-expiration-settings"
+        }), o.isExpirationEnabled && // Get the locale from the user's operating system settings
+        /* @__PURE__ */ n(q, {
+          locale: navigator.language || "en-US",
+          children: /* @__PURE__ */ n(G, {
+            calendarAriaLabel: a(e.linkExpirationCalendarAriaLabel),
+            clearDatePickerAriaLabel: a(e.linkExpirationClearDatePickerAriaLabel),
+            error: u.expiration,
+            hideLabel: !0,
+            isDisabled: !i.canChangeExpiration,
+            label: a(e.linkExpirationDatePickerLabel),
+            minValue: Q(),
+            nextMonthAriaLabel: a(e.linkExpirationNextMonthAriaLabel),
+            onChange: _,
+            openCalendarDropdownAriaLabel: a(e.linkExpirationOpenCalendarDropdownAriaLabel),
+            previousMonthAriaLabel: a(e.linkExpirationPreviousMonthAriaLabel),
+            value: o.expiration
+          })
+        }), i.isPasswordAvailable && (g == null ? void 0 : g.id) === "open" && /* @__PURE__ */ n(d.Item, {
+          checked: o.isPasswordEnabled,
+          disabled: !i.canChangePassword,
+          label: a(e.passwordToggleText),
+          onCheckedChange: R,
+          value: "password-settings"
+        }), o.isPasswordEnabled && /* @__PURE__ */ s(L, {
+          children: [i.canChangePassword && /* @__PURE__ */ n(E, {
+            variant: "warning",
+            variantIconAriaLabel: a(e.warningNoticeIconAriaLabel),
+            children: a(e.passwordWarningText)
+          }), /* @__PURE__ */ n(k, {
+            disabled: !i.canChangePassword,
+            hideLabel: !0,
+            label: a(e.passwordToggleText),
+            onChange: W,
+            placeholder: w.isPasswordEnabled ? na : a(e.passwordInputPlaceholder),
+            type: "password",
+            value: o.password
+          })]
+        }), i.isVanityNameAvailable && /* @__PURE__ */ n(d.Item, {
+          checked: o.isVanityEnabled,
+          disabled: !i.canChangeVanityName,
+          label: a(e.vanityNameToggleText),
+          onCheckedChange: B,
+          value: "vanity-domain-settings"
+        }), o.isVanityEnabled && /* @__PURE__ */ s(L, {
+          children: [i.canChangeVanityName && /* @__PURE__ */ n(E, {
+            variant: "warning",
+            variantIconAriaLabel: a(e.warningNoticeIconAriaLabel),
+            children: a(e.vanityDomainSettingsWarningText)
+          }), /* @__PURE__ */ n(k, {
+            disabled: !i.canChangeVanityName,
+            error: u.vanityName,
+            hideLabel: !0,
+            label: a(e.vanityNameInputLabel),
+            onChange: U,
+            placeholder: a(e.vanityNameInputPlaceholder),
+            value: o.vanityName
+          }), $ && /* @__PURE__ */ n(C, {
+            as: "p",
+            children: z
+          })]
+        }), i.isDownloadAvailable && /* @__PURE__ */ n(d.Item, {
+          checked: o.isDownloadEnabled,
+          disabled: !i.canChangeDownload,
+          label: a(e.downloadSettingsToggleText),
+          onCheckedChange: j,
+          value: "download-link-settings"
+        })]
+      }), /* @__PURE__ */ s(r.Footer, {
+        children: [/* @__PURE__ */ n(r.Footer.SecondaryButton, {
+          disabled: y,
+          onClick: V,
+          children: a(e.cancelButton)
+        }), /* @__PURE__ */ n(r.Footer.PrimaryButton, {
+          loading: y,
+          loadingAriaLabel: a(e.loadingLabel),
+          onClick: F,
+          children: a(e.saveButton)
+        })]
+      }), /* @__PURE__ */ n(r.Close, {
+        "aria-label": a(e.closeButton)
+      })]
+    })
+  });
+}
+export {
+  ga as SharedLinkSettingsModal
+};

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

@@ -0,0 +1,89 @@
+import I from "clsx";
+import _ from "lodash/camelCase";
+import { useState as y, useMemo as L, useEffect as O } from "react";
+import { useIntl as T } from "react-intl";
+import { DropdownMenu as t, TriggerButton as $ } from "@box/blueprint-web";
+import j from "../messages.js";
+import x from "./messages.js";
+import { jsxs as k, jsx as r } from "react/jsx-runtime";
+import { isInvitationRoleSupported as w, getDefaultCollaborationRole as F } from "../../../utils/collaborator.js";
+import { useUnifiedShareFormContext as P } from "../../../contexts/unified-share-form-context.js";
+import { useUnifiedShareModalContext as U } from "../../../contexts/unified-share-modal-context.js";
+import '../../../../../styles/collaboration-role.css';const z = "_container_19dff_1", A = "_overrides_19dff_5", C = {
+  container: z,
+  overrides: A
+};
+function X() {
+  const {
+    formatMessage: i
+  } = T(), [d, R] = y(!1), {
+    collaborationRole: m,
+    setCollaborationRole: l
+  } = P(), {
+    collaborationRoles: p,
+    isSubmitting: M,
+    item: S
+  } = U(), {
+    type: f
+  } = S, n = L(() => p.map((o) => {
+    const {
+      description: a,
+      id: e,
+      label: s
+    } = o, c = w(e), u = _(e);
+    let b = u;
+    e === "editor" && f === "folder" && (b += "Folder");
+    let g = e, h = "";
+    return c && (g = i(j[`${u}Role`]), h = i(x[`${b}Description`])), {
+      ...o,
+      description: a ?? h,
+      label: s ?? g
+    };
+  }), [p, i, f]);
+  if (O(() => {
+    l(F(n));
+  }, [n, l]), !n.length || !m)
+    return null;
+  const {
+    id: v,
+    label: D
+  } = m;
+  return /* @__PURE__ */ k(t.Root, {
+    onOpenChange: R,
+    open: d,
+    children: [/* @__PURE__ */ r(t.Trigger, {
+      children: /* @__PURE__ */ r($, {
+        caretDirection: d ? "up" : "down",
+        className: I(C.container, C.overrides),
+        disabled: M,
+        label: i(x.inviteAsRoleLabel, {
+          role: D
+        }),
+        size: "extraSmall",
+        variant: "tertiary"
+      })
+    }), /* @__PURE__ */ r(t.Content, {
+      align: "start",
+      children: n.map((o) => {
+        const {
+          description: a,
+          isDisabled: e,
+          id: s,
+          label: c
+        } = o;
+        return /* @__PURE__ */ r(t.CheckboxItem, {
+          checked: v === s,
+          disabled: e,
+          onSelect: () => l(o),
+          children: /* @__PURE__ */ r(t.Item.MainContent, {
+            caption: a,
+            label: c
+          })
+        }, s);
+      })
+    })]
+  });
+}
+export {
+  X as CollaborationRole
+};

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

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

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

@@ -0,0 +1,4 @@
+import { CollaborationSection as t } from "./collaboration-section.js";
+export {
+  t as CollaborationSection
+};

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

@@ -0,0 +1,90 @@
+import { defineMessages as e } from "react-intl";
+const o = e({
+  cancelButton: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.cancelButton",
+    defaultMessage: "Cancel"
+  },
+  closeButton: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.closeButton",
+    defaultMessage: "Close"
+  },
+  clearButton: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.clearButton",
+    defaultMessage: "Clear"
+  },
+  sendButton: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.sendButton",
+    defaultMessage: "Send"
+  },
+  loadingLabel: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.loadingLabel",
+    defaultMessage: "Loading"
+  },
+  invitePeopleLabel: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.invitePeopleLabel",
+    defaultMessage: "Invite People"
+  },
+  invitePeoplePlaceholder: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.invitePeoplePlaceholder",
+    defaultMessage: "Add names or email addresses"
+  },
+  emailSharedLinkLabel: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.emailSharedLinkLabel",
+    defaultMessage: "Email Shared Link"
+  },
+  inviteAsRoleLabel: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.inviteAsRoleLabel",
+    defaultMessage: "Invite as {role}"
+  },
+  sharedWithLabel: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.sharedWithLabel",
+    defaultMessage: "Shared with"
+  },
+  shareMessageLabel: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.shareMessageLabel",
+    defaultMessage: "Message (optional)"
+  },
+  shareMessagePlaceholder: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.shareMessagePlaceholder",
+    defaultMessage: "Add a message"
+  },
+  shareMessageCharacterCountAriaLabel: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.shareMessageCharacterCountAriaLabel",
+    defaultMessage: "{count} characters remaining"
+  },
+  coOwnerDescription: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.coOwnerDescription",
+    defaultMessage: "Manage security, upload, download, preview, share, edit, and delete"
+  },
+  editorDescription: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.editorDescription",
+    defaultMessage: "Upload, download, preview, share, and edit"
+  },
+  editorFolderDescription: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.editorFolderDescription",
+    defaultMessage: "Upload, download, preview, share, edit, and delete"
+  },
+  viewerUploaderDescription: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.viewerUploaderDescription",
+    defaultMessage: "Upload, download, preview, share, and edit"
+  },
+  previewerUploaderDescription: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.previewerUploaderDescription",
+    defaultMessage: "Upload and preview"
+  },
+  viewerDescription: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.viewerDescription",
+    defaultMessage: "Download, preview, and share"
+  },
+  previewerDescription: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.previewerDescription",
+    defaultMessage: "Preview-only"
+  },
+  uploaderDescription: {
+    id: "groupSharedFeatures.usm.unifiedShareFormModal.collaborationSection.uploaderDescription",
+    defaultMessage: "Upload-only"
+  }
+});
+export {
+  o as default
+};

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

@@ -0,0 +1,58 @@
+import { useIntl as p } from "react-intl";
+import { Text as v, Avatar as x } from "@box/blueprint-web";
+import { Gray10 as b } from "@box/blueprint-web-assets/tokens/tokens";
+import { CollaboratorAvatar as g } from "../collaborators-view/collaborator-avatar.js";
+import A from "./messages.js";
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { callOnKeyboardEvent as _ } from "../../../utils/event.js";
+import { useUnifiedShareModalContext as C } from "../../../contexts/unified-share-modal-context.js";
+import { useUnifiedShareFormContext as S } from "../../../contexts/unified-share-form-context.js";
+import '../../../../../styles/shared-with-avatars.css';const y = "_container_ixnh3_1", I = "_avatars_ixnh3_18", l = {
+  container: y,
+  avatars: I
+}, c = 3;
+function K() {
+  const {
+    formatMessage: m
+  } = p(), {
+    collaborators: d,
+    currentUser: h,
+    isSubmitting: o
+  } = C(), {
+    onShareViewChange: a
+  } = S(), {
+    id: n
+  } = h, t = d.filter(({
+    isCurrentUser: r,
+    userId: u
+  }) => !(r || n && n === u));
+  if (!t.length)
+    return null;
+  const f = t.slice(0, c), s = t.length - c;
+  return /* @__PURE__ */ i("div", {
+    "aria-disabled": o,
+    className: l.container,
+    onClick: () => a("collaborators"),
+    onKeyDown: _(() => a("collaborators")),
+    role: "button",
+    tabIndex: o ? -1 : 0,
+    children: [/* @__PURE__ */ e(v, {
+      as: "span",
+      color: "textOnLightSecondary",
+      children: m(A.sharedWithLabel)
+    }), /* @__PURE__ */ i("div", {
+      className: l.avatars,
+      children: [f.map((r) => /* @__PURE__ */ e(g, {
+        collaborator: r,
+        size: "medium"
+      }, r.id)), s > 0 && /* @__PURE__ */ e(x, {
+        color: b,
+        size: "medium",
+        text: `+${s}`
+      })]
+    })]
+  });
+}
+export {
+  K as SharedWithAvatars
+};

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

@@ -0,0 +1,58 @@
+import { useState as C } from "react";
+import { useIntl as g } from "react-intl";
+import { useUniqueId as p, TextArea as b, Text as A } from "@box/blueprint-web";
+import a from "./messages.js";
+import { jsxs as M, jsx as i } from "react/jsx-runtime";
+import { useUnifiedShareModalContext as _ } from "../../../contexts/unified-share-modal-context.js";
+import { useUnifiedShareFormContext as v } from "../../../contexts/unified-share-form-context.js";
+import '../../../../../styles/text-area-container.css';const S = "_textArea_v76md_1", y = "_textCount_v76md_5", u = {
+  textArea: S,
+  textCount: y
+};
+function q(c) {
+  const {
+    formatMessage: t
+  } = g(), {
+    isSubmitting: l
+  } = _(), {
+    messageValue: m,
+    setMessageValue: x
+  } = v(), {
+    maxCount: e
+  } = c, [o, d] = C(e), s = p("text-count-"), h = (f) => {
+    const n = f.target.value;
+    if (typeof e == "number") {
+      const r = e - n.length;
+      if (r < 0)
+        return;
+      d(r);
+    }
+    x(n);
+  };
+  return /* @__PURE__ */ M("div", {
+    children: [/* @__PURE__ */ i(b, {
+      className: u.textArea,
+      disabled: l,
+      label: t(a.shareMessageLabel),
+      minRows: 3,
+      onChange: h,
+      placeholder: t(a.shareMessagePlaceholder),
+      value: m,
+      ...e && {
+        "aria-describedby": s
+      }
+    }), !!e && /* @__PURE__ */ i(A, {
+      "aria-label": t(a.shareMessageCharacterCountAriaLabel, {
+        count: o
+      }),
+      as: "span",
+      className: u.textCount,
+      color: "textOnLightSecondary",
+      id: s,
+      children: o
+    })]
+  });
+}
+export {
+  q as TextAreaContainer
+};

package/dist/esm/lib/components/unified-share-form-modal/collaborators-view/collaborator-avatar.js

@@ -0,0 +1,65 @@
+import { useCallback as c } from "react";
+import { useIntl as A } from "react-intl";
+import { Avatar as b, IconBadge as f } from "@box/blueprint-web";
+import C from "./messages.js";
+import { jsx as t } from "react/jsx-runtime";
+import { getFirstInitial as I, getAvatarBadgeSize as g } from "../../../utils/collaborator.js";
+import { formatDateFromTimestampToDateString as B } from "../../../utils/date.js";
+import '../../../../../styles/collaborator-avatar.css';const S = "_avatar_1jpa6_1", D = {
+  avatar: S
+};
+function k({
+  collaborator: v,
+  isBadgeable: e,
+  size: a = "large"
+}) {
+  const {
+    formatMessage: d
+  } = A(), {
+    avatarUrl: x,
+    expiresAt: r,
+    hasCustomAvatar: u,
+    id: i,
+    isExternal: s,
+    name: n
+  } = v, m = u === !1 ? void 0 : x, o = c(() => /* @__PURE__ */ t(b, {
+    alt: "",
+    className: D.avatar,
+    colorIndex: parseInt(i, 10),
+    size: a,
+    src: m,
+    text: I(n)
+  }), [m, i, n, a]), l = c(() => /* @__PURE__ */ t(f, {
+    offset: {
+      bottom: -4,
+      right: -4
+    },
+    size: g(a),
+    variant: "collaborator-external",
+    children: /* @__PURE__ */ t(o, {})
+  }), [o, a]);
+  if (e && r) {
+    const h = typeof r == "number" ? B(r) : r, p = d(C.expiresBadge, {
+      date: h
+    });
+    return /* @__PURE__ */ t(f, {
+      offset: {
+        bottom: 20,
+        right: 20
+      },
+      showTooltipOnBadge: !0,
+      size: g(a),
+      tooltipConfig: {
+        tooltipAriaLabel: p,
+        tooltipContent: p,
+        tooltipSide: "right"
+      },
+      variant: "status-pending",
+      children: s ? /* @__PURE__ */ t(l, {}) : /* @__PURE__ */ t(o, {})
+    });
+  }
+  return e && s ? /* @__PURE__ */ t(l, {}) : /* @__PURE__ */ t(o, {});
+}
+export {
+  k as CollaboratorAvatar
+};