@box/unified-share-modal 1.48.2 → 1.49.0

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.
Files changed (5) hide show
  1. package/dist/esm/lib/components/unified-share-form-modal/collaboration-section/collaboration-section.js +94 -95
  2. package/dist/esm/lib/constants.js +4 -4
  3. package/dist/types/lib/constants.d.ts +0 -1
  4. package/dist/types/lib/types.d.ts +6 -0
  5. package/package.json +9 -9
package/dist/esm/lib/components/unified-share-form-modal/collaboration-section/collaboration-section.js CHANGED
@@ -1,99 +1,98 @@
1
1
  import pe from "clsx";
2
- import { useState as be, useRef as ge, useEffect as N, useCallback as C } from "react";
2
+ import { useState as be, useRef as ge, useEffect as R, useCallback as v } from "react";
3
3
  import { createPortal as Ce } from "react-dom";
4
4
  import { useIntl as ve } from "react-intl";
5
- import { useBlueprintModernization as Se, useNotification as _e, useUniqueId as Le, useLabelable as Fe, Tooltip as Ue, Focusable as ye, Text as xe, Modal as v } from "@box/blueprint-web";
6
- import { Globe as Ae } from "@box/blueprint-web-assets/icons/Medium";
7
- import { bpSize040 as I } from "@box/blueprint-web-assets/tokens/tokens";
5
+ import { useBlueprintModernization as Se, useNotification as Fe, useUniqueId as Ue, useLabelable as Le, Tooltip as _e, Focusable as ye, Text as xe, Modal as S } from "@box/blueprint-web";
6
+ import { Globe as Be } from "@box/blueprint-web-assets/icons/Medium";
7
+ import { bpSize040 as P } from "@box/blueprint-web-assets/tokens/tokens";
8
8
  import { UserSelectorContainer as Ee } from "@box/user-selector";
9
- import { CollaborationRole as Re } from "./collaboration-role.js";
10
- import { SharedWithAvatars as Be } from "./shared-with-avatars.js";
11
- import { ShieldRestrictionNotice as Ne } from "./shield-restriction-notice.js";
12
- import { TextAreaContainer as Ie } from "./text-area-container.js";
13
- import { COLLABORATION_MESSAGE_CHARACTER_LIMIT as Te } from "../../../constants.js";
9
+ import { CollaborationRole as Ae } from "./collaboration-role.js";
10
+ import { SharedWithAvatars as Ne } from "./shared-with-avatars.js";
11
+ import { ShieldRestrictionNotice as Re } from "./shield-restriction-notice.js";
12
+ import { TextAreaContainer as Pe } from "./text-area-container.js";
14
13
  import o from "./messages.js";
15
- import { jsxs as l, jsx as r, Fragment as Pe } from "react/jsx-runtime";
16
- import { useFormValidation as ke } from "../../../hooks/use-form-validation.js";
17
- import { useCollaborationForm as Ve } from "../../../hooks/use-collaboration-form.js";
18
- import { useUnifiedShareFormContext as Me } from "../../../contexts/unified-share-form-context.js";
19
- import { useUnifiedShareModalContext as Oe } from "../../../contexts/unified-share-modal-context.js";
20
- import '../../../../../styles/collaboration-section.css';const De = "_container_1e2gg_2", ze = "_label_1e2gg_8", we = "_modernized_1e2gg_15", Ge = "_security_1e2gg_33", We = "_icon_1e2gg_37", je = "_access_1e2gg_43", c = {
21
- container: De,
14
+ import { jsxs as l, jsx as r, Fragment as ke } from "react/jsx-runtime";
15
+ import { useFormValidation as Ve } from "../../../hooks/use-form-validation.js";
16
+ import { useCollaborationForm as Ie } from "../../../hooks/use-collaboration-form.js";
17
+ import { useUnifiedShareFormContext as Te } from "../../../contexts/unified-share-form-context.js";
18
+ import { useUnifiedShareModalContext as De } from "../../../contexts/unified-share-modal-context.js";
19
+ import '../../../../../styles/collaboration-section.css';const Me = "_container_1e2gg_2", ze = "_label_1e2gg_8", Oe = "_modernized_1e2gg_15", we = "_security_1e2gg_33", We = "_icon_1e2gg_37", je = "_access_1e2gg_43", c = {
20
+ container: Me,
22
21
  label: ze,
23
- modernized: we,
24
- security: Ge,
22
+ modernized: Oe,
23
+ security: we,
25
24
  icon: We,
26
25
  access: je
27
26
  };
28
- function dt() {
27
+ function lt() {
29
28
  const {
30
29
  formatMessage: t
31
- } = ve(), [S, A] = be(), {
32
- enableModernizedComponents: T
30
+ } = ve(), [F, B] = be(), {
31
+ enableModernizedComponents: k
33
32
  } = Se(), {
34
- addNotification: P
35
- } = _e(), {
36
- validateShieldRestriction: k
37
- } = ke(), {
38
- contactValue: V,
39
- containerRef: _,
33
+ addNotification: V
34
+ } = Fe(), {
35
+ validateShieldRestriction: I
36
+ } = Ve(), {
37
+ contactValue: T,
38
+ containerRef: U,
40
39
  form: n,
41
40
  setForm: d,
42
- setUserContacts: M,
43
- shieldRestriction: O,
41
+ setUserContacts: D,
42
+ shieldRestriction: M,
44
43
  userContacts: i
45
- } = Me(), {
46
- collaborationAccess: D,
47
- collaborationNotices: z,
48
- config: L,
44
+ } = Te(), {
45
+ collaborationAccess: z,
46
+ collaborationNotices: O,
47
+ config: u,
49
48
  contactService: w,
50
- isFetching: G,
51
- isSubmitting: W,
52
- item: j,
49
+ isFetching: W,
50
+ isSubmitting: j,
51
+ item: G,
53
52
  onOpenChange: q,
54
- sharingService: H,
55
- variant: K
56
- } = Oe(), {
57
- permissions: $ = {},
53
+ sharingService: K,
54
+ variant: $
55
+ } = De(), {
56
+ permissions: H = {},
58
57
  type: J
59
- } = j, {
60
- getContacts: F,
61
- getContactsAvatarUrls: U
58
+ } = G, {
59
+ getContacts: L,
60
+ getContactsAvatarUrls: _
62
61
  } = w, {
63
62
  sendInvitations: Q,
64
63
  sendSharedLink: X
65
- } = H;
64
+ } = K;
66
65
  let y, x;
67
66
  n === "invite" && (y = Q, x = "invite-collaborators"), n === "email" && (y = X, x = "email-shared-link");
68
67
  const {
69
68
  errors: Y,
70
69
  handleFormReset: E,
71
70
  handleFormSubmit: Z,
72
- handleSelectedUsersChange: u,
71
+ handleSelectedUsersChange: f,
73
72
  handleUserSelectorBlur: ee,
74
73
  isFormSubmitting: te,
75
74
  updateContactValue: oe
76
- } = Ve(y, x), re = K === "desktop", m = n === "default" || n === "invite", a = n === "invite" || n === "email", f = W ?? te, ie = i.some((e) => e.isExternalUser), R = ge(n === "email" ? "email" : "invite");
77
- N(() => {
78
- R.current = n === "email" ? "email" : "invite";
79
- }, [n]), N(() => {
80
- (!i.length || !i.some((e) => e.chipVariant === "error")) && A(null);
75
+ } = Ie(y, x), re = $ === "desktop", m = n === "default" || n === "invite", a = n === "invite" || n === "email", h = j ?? te, ie = i.some((e) => e.isExternalUser), A = ge(n === "email" ? "email" : "invite");
76
+ R(() => {
77
+ A.current = n === "email" ? "email" : "invite";
78
+ }, [n]), R(() => {
79
+ (!i.length || !i.some((e) => e.chipVariant === "error")) && B(null);
81
80
  }, [i]);
82
- const ne = C((e) => (e.stopPropagation(), !0), []), ae = C((e) => F ? F(e, R.current) : Promise.resolve([]), [F]), se = C((e) => U ? U(e) : Promise.resolve({}), [U]), le = (e) => {
81
+ const ne = v((e) => (e.stopPropagation(), !0), []), ae = v((e) => L ? L(e, A.current) : Promise.resolve([]), [L]), se = v((e) => _ ? _(e) : Promise.resolve({}), [_]), le = (e) => {
83
82
  a || d("invite"), oe(e);
84
- }, ce = C(async (e) => {
83
+ }, ce = v(async (e) => {
85
84
  const s = e.clipboardData.getData("text").trim();
86
- s && (i.some((b) => b.email === s) || (e.preventDefault(), a || d("invite"), await u([...i, {
85
+ s && (i.some((g) => g.email === s) || (e.preventDefault(), a || d("invite"), await f([...i, {
87
86
  value: s
88
87
  }])));
89
- }, [u, a, d, i]), de = () => {
88
+ }, [f, a, d, i]), de = () => {
90
89
  E(), d("default");
91
90
  }, me = async () => {
92
91
  try {
93
- if (S) {
94
- const e = k(i, O);
92
+ if (F) {
93
+ const e = I(i, M);
95
94
  if (e) {
96
- P({
95
+ V({
97
96
  closeButtonAriaLabel: t(o.closeButton),
98
97
  sensitivity: "foreground",
99
98
  styledText: e,
@@ -111,52 +110,52 @@ function dt() {
111
110
  return;
112
111
  const {
113
112
  shieldRestriction: s
114
- } = e, b = [...s.restrictedEmails ?? [], ...s.restrictedGroups ?? []], he = i.map((g) => b.includes(g.email) || b.includes(`${g.id}`) ? {
115
- ...g,
113
+ } = e, g = [...s.restrictedEmails ?? [], ...s.restrictedGroups ?? []], he = i.map((C) => g.includes(C.email) || g.includes(`${C.id}`) ? {
114
+ ...C,
116
115
  chipVariant: "error"
117
- } : g);
118
- A(s), M(he);
116
+ } : C);
117
+ B(s), D(he);
119
118
  }
120
119
  };
121
- let h, p = !1;
122
- m && !$.canInviteCollaborator && (h = t(o.inviteDisabledTooltip), p = !0), m && J === "web_link" && (h = t(o.inviteWebLinkDisabledTooltip), p = !0);
123
- const B = Le("user-contacts-"), ue = t(m ? o.invitePeopleLabel : o.emailSharedLinkLabel), fe = Fe(ue, B);
120
+ let p, b = !1;
121
+ m && !H.canInviteCollaborator && (p = t(o.inviteDisabledTooltip), b = !0), m && J === "web_link" && (p = t(o.inviteWebLinkDisabledTooltip), b = !0);
122
+ const N = Ue("user-contacts-"), ue = t(m ? o.invitePeopleLabel : o.emailSharedLinkLabel), fe = Le(ue, N);
124
123
  return /* @__PURE__ */ l("form", {
125
124
  className: c.container,
126
125
  onSubmit: (e) => e.preventDefault(),
127
- children: [S && /* @__PURE__ */ r(Ne, {
128
- error: S,
129
- isLoading: f,
130
- onSelectedUsersChange: u
131
- }), z, /* @__PURE__ */ l("div", {
132
- children: [m && L.collaborators && /* @__PURE__ */ r(Be, {}), /* @__PURE__ */ r(fe, {
133
- className: pe(c.label, T && c.modernized)
134
- }), /* @__PURE__ */ r(Ue, {
135
- content: h,
126
+ children: [F && /* @__PURE__ */ r(Re, {
127
+ error: F,
128
+ isLoading: h,
129
+ onSelectedUsersChange: f
130
+ }), O, /* @__PURE__ */ l("div", {
131
+ children: [m && u.collaborators && /* @__PURE__ */ r(Ne, {}), /* @__PURE__ */ r(fe, {
132
+ className: pe(c.label, k && c.modernized)
133
+ }), /* @__PURE__ */ r(_e, {
134
+ content: p,
136
135
  "data-testid": "user-contacts-tooltip",
137
- open: h ? void 0 : !1,
136
+ open: p ? void 0 : !1,
138
137
  side: "bottom",
139
138
  children: /* @__PURE__ */ r(ye, {
140
- focusable: p,
139
+ focusable: b,
141
140
  children: /* @__PURE__ */ r(Ee, {
142
141
  className: "collaboration-user-selector",
143
142
  clearButtonAriaLabel: t(o.clearButton),
144
143
  clearOnBlur: !1,
145
- disabled: p || f,
144
+ disabled: b || h,
146
145
  displayChipVariant: (e) => e.chipVariant,
147
146
  error: Y["user-contact"],
148
147
  fetchAvatarUrls: se,
149
148
  fetchUsers: ae,
150
149
  hideOnEscape: ne,
151
- idForLabel: B,
152
- inputValue: V,
150
+ idForLabel: N,
151
+ inputValue: T,
153
152
  label: null,
154
153
  onBlur: ee,
155
154
  onInputValueChange: le,
156
155
  onPaste: ce,
157
- onSelectedUsersChange: u,
156
+ onSelectedUsersChange: f,
158
157
  placeholder: i.length ? "" : t(o.invitePeoplePlaceholder),
159
- portalElement: _,
158
+ portalElement: U,
160
159
  selectedUsers: i,
161
160
  selectOnEnterOrTab: !0,
162
161
  variant: a ? "textarea" : "input"
@@ -164,39 +163,39 @@ function dt() {
164
163
  })
165
164
  }), m && /* @__PURE__ */ l("div", {
166
165
  className: c.access,
167
- children: [L.collaborationRole && /* @__PURE__ */ r(Re, {}), D]
166
+ children: [u.collaborationRole && /* @__PURE__ */ r(Ae, {}), z]
168
167
  })]
169
- }), a && L.collaborationMessage && /* @__PURE__ */ r(Ie, {
170
- maxCount: Te
168
+ }), a && u.collaborationMessage && /* @__PURE__ */ r(Pe, {
169
+ maxCount: u.collaborationMessageLimit
171
170
  }), a && ie && /* @__PURE__ */ l("div", {
172
171
  className: c.security,
173
- children: [/* @__PURE__ */ r(Ae, {
172
+ children: [/* @__PURE__ */ r(Be, {
174
173
  className: c.icon,
175
- height: I,
176
- width: I
174
+ height: P,
175
+ width: P
177
176
  }), /* @__PURE__ */ r(xe, {
178
177
  as: "span",
179
178
  color: "textOnLightSecondary",
180
179
  children: t(o.contentSharedWithExternalCollaborators)
181
180
  })]
182
- }), a && _ && /* @__PURE__ */ Ce(/* @__PURE__ */ l(Pe, {
183
- children: [!G && /* @__PURE__ */ l(v.Footer, {
184
- children: [/* @__PURE__ */ r(v.Footer.SecondaryButton, {
185
- disabled: f,
181
+ }), a && U && /* @__PURE__ */ Ce(/* @__PURE__ */ l(ke, {
182
+ children: [!W && /* @__PURE__ */ l(S.Footer, {
183
+ children: [/* @__PURE__ */ r(S.Footer.SecondaryButton, {
184
+ disabled: h,
186
185
  onClick: de,
187
186
  children: t(o.cancelButton)
188
- }), /* @__PURE__ */ r(v.Footer.PrimaryButton, {
189
- loading: f,
187
+ }), /* @__PURE__ */ r(S.Footer.PrimaryButton, {
188
+ loading: h,
190
189
  loadingAriaLabel: t(o.loadingLabel),
191
190
  onClick: me,
192
191
  children: t(o.sendButton)
193
192
  })]
194
- }), !re && /* @__PURE__ */ r(v.Close, {
193
+ }), !re && /* @__PURE__ */ r(S.Close, {
195
194
  "aria-label": t(o.closeButton)
196
195
  })]
197
- }), _)]
196
+ }), U)]
198
197
  });
199
198
  }
200
199
  export {
201
- dt as CollaborationSection
200
+ lt as CollaborationSection
202
201
  };
package/dist/esm/lib/constants.js CHANGED
@@ -2,6 +2,7 @@ const e = ["invite-collaborators", "remove-collaborator", "create-shared-link",
2
2
  collaboration: !0,
3
3
  collaborationLimit: 100,
4
4
  collaborationMessage: !0,
5
+ collaborationMessageLimit: 750,
5
6
  collaborationRole: !0,
6
7
  collaborators: !0,
7
8
  collaboratorsLimit: 100,
@@ -14,14 +15,13 @@ const e = ["invite-collaborators", "remove-collaborator", "create-shared-link",
14
15
  sharedLinkEmail: !0,
15
16
  sharedLinkPermission: !0,
16
17
  sharedLinkSettings: !0
17
- }, o = ["co_owner", "editor", "previewer", "previewer_uploader", "uploader", "viewer", "viewer_uploader"], a = ["owner", ...o], t = ["open", "company", "collaborators"], n = ["can_edit", "can_download", "can_preview"], i = 256, l = "boxnote";
18
+ }, o = ["co_owner", "editor", "previewer", "previewer_uploader", "uploader", "viewer", "viewer_uploader"], a = ["owner", ...o], t = ["open", "company", "collaborators"], i = ["can_edit", "can_download", "can_preview"], n = "boxnote";
18
19
  export {
19
- i as COLLABORATION_MESSAGE_CHARACTER_LIMIT,
20
20
  r as DEFAULT_CONFIGURATION,
21
21
  e as DEFAULT_NOTIFICATIONS,
22
- l as FILE_EXTENSION_BOX_NOTE,
22
+ n as FILE_EXTENSION_BOX_NOTE,
23
23
  t as SUPPORTED_ACCESS_LEVELS,
24
24
  a as SUPPORTED_COLLABORATOR_ROLES,
25
25
  o as SUPPORTED_INVITATION_ROLES,
26
- n as SUPPORTED_PERMISSION_LEVELS
26
+ i as SUPPORTED_PERMISSION_LEVELS
27
27
  };
package/dist/types/lib/constants.d.ts CHANGED
@@ -5,5 +5,4 @@ export declare const SUPPORTED_INVITATION_ROLES: string[];
5
5
  export declare const SUPPORTED_COLLABORATOR_ROLES: string[];
6
6
  export declare const SUPPORTED_ACCESS_LEVELS: AccessLevelType[];
7
7
  export declare const SUPPORTED_PERMISSION_LEVELS: PermissionLevelType[];
8
- export declare const COLLABORATION_MESSAGE_CHARACTER_LIMIT = 256;
9
8
  export declare const FILE_EXTENSION_BOX_NOTE = "boxnote";
package/dist/types/lib/types.d.ts CHANGED
@@ -633,6 +633,12 @@ export interface Configuration {
633
633
  * @default true
634
634
  */
635
635
  collaborationMessage?: boolean;
636
+ /**
637
+ * Controls the maximum character limit for the collaboration message text field.
638
+ *
639
+ * @default 750
640
+ */
641
+ collaborationMessageLimit?: number;
636
642
  /**
637
643
  * Controls whether the collaboration role is visible to the user.
638
644
  *
package/package.json CHANGED
@@ -1,22 +1,22 @@
1
1
  {
2
2
  "name": "@box/unified-share-modal",
3
- "version": "1.48.2",
3
+ "version": "1.49.0",
4
4
  "license": "SEE LICENSE IN LICENSE",
5
5
  "peerDependencies": {
6
- "@box/blueprint-web": "^12.134.2",
7
- "@box/blueprint-web-assets": "^4.101.0",
8
- "@box/copy-input": "^1.30.1",
9
- "@box/user-selector": "^1.63.1",
6
+ "@box/blueprint-web": "^12.135.0",
7
+ "@box/blueprint-web-assets": "^4.101.1",
8
+ "@box/copy-input": "^1.30.2",
9
+ "@box/user-selector": "^1.63.2",
10
10
  "lodash": "^4.17.15",
11
11
  "react": "^18.0.0",
12
12
  "react-dom": "^18.0.0",
13
13
  "react-intl": "^6.4.2"
14
14
  },
15
15
  "devDependencies": {
16
- "@box/blueprint-web": "^12.134.2",
17
- "@box/blueprint-web-assets": "^4.101.0",
18
- "@box/copy-input": "^1.30.1",
19
- "@box/storybook-utils": "0.16.37",
16
+ "@box/blueprint-web": "^12.135.0",
17
+ "@box/blueprint-web-assets": "^4.101.1",
18
+ "@box/copy-input": "^1.30.2",
19
+ "@box/storybook-utils": "0.16.38",
20
20
  "@box/eslint-plugin-blueprint": "1.0.5",
21
21
  "react-intl": "^6.4.2"
22
22
  },