@box/metadata-editor 0.78.2 → 0.78.4

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/esm/index.js +29 -27
  2. package/esm/lib/components/filter-instances-dropdown/filter-instances-dropdown.js +75 -68
  3. package/package.json +3 -3
  4. package/styles/filter-instances-dropdown.css +1 -1
  5. package/types/index.d.ts +1 -0
package/esm/index.js CHANGED
@@ -1,37 +1,39 @@
1
1
  import { AddMetadataTemplateDropdown as o } from "./lib/components/add-metadata-template-dropdown/add-metadata-template-dropdown.js";
2
2
  import { ComboboxWithApiPagination as r } from "./lib/components/combobox-with-api-pagination/combobox-with-api-pagination.js";
3
3
  import { FilterDropdownMenu as d } from "./lib/components/filter-dropdown-menu/index.js";
4
- import { MetadataEmptyState as f } from "./lib/components/metadata-empty-state/metadata-empty-state.js";
5
- import { DeleteConfirmationModal as x } from "./lib/components/metadata-instance-editor/subcomponents/delete-confirmation-modal/delete-confirmation-modal.js";
6
- import { MetadataInstanceFormHeader as l } from "./lib/components/metadata-instance-editor/subcomponents/metadata-instance-form-header/metadata-instance-form-header.js";
7
- import { CustomInstanceNewField as s } from "./lib/components/metadata-instance-editor/subcomponents/custom-instance-new-field/custom-instance-new-field.js";
4
+ import { FilterInstancesDropdown as m } from "./lib/components/filter-instances-dropdown/filter-instances-dropdown.js";
5
+ import { MetadataEmptyState as x } from "./lib/components/metadata-empty-state/metadata-empty-state.js";
6
+ import { DeleteConfirmationModal as l } from "./lib/components/metadata-instance-editor/subcomponents/delete-confirmation-modal/delete-confirmation-modal.js";
7
+ import { MetadataInstanceFormHeader as M } from "./lib/components/metadata-instance-editor/subcomponents/metadata-instance-form-header/metadata-instance-form-header.js";
8
+ import { CustomInstanceNewField as I } from "./lib/components/metadata-instance-editor/subcomponents/custom-instance-new-field/custom-instance-new-field.js";
8
9
  import { MetadataInstanceForm as A } from "./lib/components/metadata-instance-editor/subcomponents/metadata-instance-form/metadata-instance-form.js";
9
- import { MetadataInstanceList as I } from "./lib/components/metadata-instance-list/metadata-instance-list.js";
10
- import { MetadataInstanceHeader as w } from "./lib/components/metadata-instance-list/subcomponents/metadata-instance-header/metadata-instance-header.js";
11
- import { UnsavedChangesModal as h } from "./lib/components/unsaved-changes-modal/unsaved-changes-modal.js";
12
- import { defaultInitialValues as U, defaultMetadataValueMap as b } from "./lib/defaults.js";
13
- import { MetadataEditor as v } from "./lib/metadata-editor.js";
14
- import { U as H } from "../chunks/types.js";
15
- import { AutofillContext as V, AutofillContextProvider as W, useAutofill as y } from "./lib/utils/autofill-context.js";
16
- import { withApiWrapper as N } from "./lib/utils/api-wrapper.js";
10
+ import { MetadataInstanceList as w } from "./lib/components/metadata-instance-list/metadata-instance-list.js";
11
+ import { MetadataInstanceHeader as D } from "./lib/components/metadata-instance-list/subcomponents/metadata-instance-header/metadata-instance-header.js";
12
+ import { UnsavedChangesModal as U } from "./lib/components/unsaved-changes-modal/unsaved-changes-modal.js";
13
+ import { defaultInitialValues as g, defaultMetadataValueMap as v } from "./lib/defaults.js";
14
+ import { MetadataEditor as H } from "./lib/metadata-editor.js";
15
+ import { U as V } from "../chunks/types.js";
16
+ import { AutofillContext as y, AutofillContextProvider as L, useAutofill as N } from "./lib/utils/autofill-context.js";
17
+ import { withApiWrapper as T } from "./lib/utils/api-wrapper.js";
17
18
  export {
18
19
  o as AddMetadataTemplateDropdown,
19
- V as AutofillContext,
20
- W as AutofillContextProvider,
20
+ y as AutofillContext,
21
+ L as AutofillContextProvider,
21
22
  r as ComboboxWithApiPagination,
22
- s as CustomInstanceNewField,
23
- x as DeleteConfirmationModal,
23
+ I as CustomInstanceNewField,
24
+ l as DeleteConfirmationModal,
24
25
  d as FilterDropdownMenu,
25
- v as MetadataEditor,
26
- f as MetadataEmptyState,
26
+ m as FilterInstancesDropdown,
27
+ H as MetadataEditor,
28
+ x as MetadataEmptyState,
27
29
  A as MetadataInstanceForm,
28
- l as MetadataInstanceFormHeader,
29
- w as MetadataInstanceHeader,
30
- I as MetadataInstanceList,
31
- h as UnsavedChangesModal,
32
- H as UpdateMode,
33
- U as defaultInitialValues,
34
- b as defaultMetadataValueMap,
35
- y as useAutofill,
36
- N as withApiWrapper
30
+ M as MetadataInstanceFormHeader,
31
+ D as MetadataInstanceHeader,
32
+ w as MetadataInstanceList,
33
+ U as UnsavedChangesModal,
34
+ V as UpdateMode,
35
+ g as defaultInitialValues,
36
+ v as defaultMetadataValueMap,
37
+ N as useAutofill,
38
+ T as withApiWrapper
37
39
  };
package/esm/lib/components/filter-instances-dropdown/filter-instances-dropdown.js CHANGED
@@ -1,88 +1,95 @@
1
1
  import "../../../../styles/filter-instances-dropdown.css";
2
- import { TriggerButton as v, Text as N, ScrollableContainer as b, Divider as x } from "@box/blueprint-web";
3
- import { useIntl as C } from "react-intl";
4
- import { SelectProvider as I, Select as B, SelectPopover as k, SelectItem as p, SelectItemCheck as y } from "@ariakit/react";
2
+ import { TriggerButton as v, Text as C, ScrollableContainer as N, Divider as w } from "@box/blueprint-web";
3
+ import { useIntl as x } from "react-intl";
4
+ import { SelectProvider as B, Select as b, SelectPopover as I, SelectItem as d, SelectItemCheck as k } from "@ariakit/react";
5
5
  import { Space1 as M } from "@box/blueprint-web-assets/tokens/px-tokens";
6
6
  import { useEffect as S } from "react";
7
- import D from "clsx";
8
- import { Checkmark as g } from "@box/blueprint-web-assets/icons/Fill";
9
- import { getVisibleTemplates as j, getTemplateDisplayName as f } from "../../utils/utils.js";
10
- import a from "./messages.js";
11
- import { jsxs as s, jsx as t } from "react/jsx-runtime";
12
- const w = "_details_l5feo_1", F = "_popover_l5feo_5", O = "_divider_l5feo_22", P = "_scrollableContainer_l5feo_25", L = "_item_l5feo_29", V = "_indicator_l5feo_56", z = "_indicatorIcon_l5feo_65", e = {
13
- details: w,
14
- popover: F,
15
- divider: O,
16
- scrollableContainer: P,
17
- item: L,
18
- indicator: V,
19
- indicatorIcon: z
20
- }, E = parseInt(M, 10);
21
- function Y({
22
- appliedTemplates: u,
23
- selectedTemplates: l,
24
- setSelectedTemplates: n
7
+ import y from "clsx";
8
+ import { Checkmark as p } from "@box/blueprint-web-assets/icons/Fill";
9
+ import { getVisibleTemplates as D, getTemplateDisplayName as _ } from "../../utils/utils.js";
10
+ import s from "./messages.js";
11
+ import { jsxs as o, jsx as e } from "react/jsx-runtime";
12
+ const j = "_details_w5gf4_1", F = "_triggerContainer_w5gf4_5", O = "_triggerButton_w5gf4_10", P = "_popover_w5gf4_15", L = "_divider_w5gf4_32", V = "_scrollableContainer_w5gf4_35", z = "_item_w5gf4_39", E = "_indicator_w5gf4_66", G = "_indicatorIcon_w5gf4_75", R = "_testContainer_w5gf4_79", t = {
13
+ details: j,
14
+ triggerContainer: F,
15
+ triggerButton: O,
16
+ popover: P,
17
+ divider: L,
18
+ scrollableContainer: V,
19
+ item: z,
20
+ indicator: E,
21
+ indicatorIcon: G,
22
+ testContainer: R
23
+ }, q = parseInt(M, 10);
24
+ function tt({
25
+ appliedTemplates: f,
26
+ selectedTemplates: c,
27
+ setSelectedTemplates: l
25
28
  }) {
26
- const i = C(), d = i.formatMessage(a.customMetadataName), c = j(u), r = l.length, m = c.length, _ = r === 0 ? i.formatMessage(a.allTemplatesTriggerButtonText) : i.formatMessage(a.selectedTemplatesTriggerButtonText, {
27
- selectedTemplatesNumber: r,
29
+ const a = x(), g = a.formatMessage(s.customMetadataName), n = D(f), i = c.length, m = n.length, u = i === 0 ? a.formatMessage(s.allTemplatesTriggerButtonText) : a.formatMessage(s.selectedTemplatesTriggerButtonText, {
30
+ selectedTemplatesNumber: i,
28
31
  visibleTemplatesNumber: m
29
- }), T = () => {
30
- n([]);
32
+ }), h = () => {
33
+ l([]);
31
34
  };
32
35
  return S(() => {
33
- r === m && n([]);
34
- }, [r, m]), /* @__PURE__ */ s(I, {
35
- setValue: n,
36
- value: l,
37
- children: [/* @__PURE__ */ t(B, {
38
- render: /* @__PURE__ */ t(v, {
39
- caretDirection: "down",
40
- label: _,
41
- size: "small",
42
- variant: "tertiary",
43
- "data-target-id": "TriggerButton-allTemplatesTriggerButtonText|selectedTemplatesTriggerButtonText"
44
- })
45
- }), /* @__PURE__ */ t(N, {
46
- as: "p",
47
- className: e.details,
48
- color: "textOnLightSecondary",
49
- "data-testid": "detailsList",
50
- variant: "bodyDefault",
51
- children: c.filter((o) => l.some((h) => h === o.id)).map((o) => f(o, d)).join(", ")
52
- }), /* @__PURE__ */ t(k, {
53
- className: e.popover,
54
- gutter: E,
55
- children: /* @__PURE__ */ s(b, {
56
- className: e.scrollableContainer,
57
- children: [/* @__PURE__ */ s(p, {
58
- autoFocus: r === 0,
59
- className: e.item,
36
+ i === m && l([]);
37
+ }, [i, m]), /* @__PURE__ */ o(B, {
38
+ setValue: l,
39
+ value: c,
40
+ children: [/* @__PURE__ */ o("div", {
41
+ className: t.triggerContainer,
42
+ children: [/* @__PURE__ */ e(b, {
43
+ render: /* @__PURE__ */ e(v, {
44
+ caretDirection: "down",
45
+ className: t.triggerButton,
46
+ label: u,
47
+ size: "small",
48
+ variant: "tertiary",
49
+ "data-target-id": "TriggerButton-allTemplatesTriggerButtonText|selectedTemplatesTriggerButtonText"
50
+ })
51
+ }), n.length > 0 && /* @__PURE__ */ e(C, {
52
+ as: "p",
53
+ className: t.details,
54
+ color: "textOnLightSecondary",
55
+ "data-testid": "detailsList",
56
+ variant: "caption",
57
+ children: n.filter((r) => c.some((T) => T === r.id)).map((r) => _(r, g)).join(", ")
58
+ })]
59
+ }), /* @__PURE__ */ e(I, {
60
+ className: t.popover,
61
+ gutter: q,
62
+ children: /* @__PURE__ */ o(N, {
63
+ className: t.scrollableContainer,
64
+ children: [/* @__PURE__ */ o(d, {
65
+ autoFocus: i === 0,
66
+ className: t.item,
60
67
  hideOnClick: !0,
61
- onClick: T,
62
- children: [r === 0 && /* @__PURE__ */ t(g, {
63
- className: D(e.indicator, e.indicatorIcon)
64
- }), i.formatMessage(a.allTemplatesTriggerButtonText)]
65
- }), /* @__PURE__ */ t(x, {
66
- className: e.divider
67
- }), c.map((o) => /* @__PURE__ */ s(p, {
68
- className: e.item,
68
+ onClick: h,
69
+ children: [i === 0 && /* @__PURE__ */ e(p, {
70
+ className: y(t.indicator, t.indicatorIcon)
71
+ }), a.formatMessage(s.allTemplatesTriggerButtonText)]
72
+ }), /* @__PURE__ */ e(w, {
73
+ className: t.divider
74
+ }), n.map((r) => /* @__PURE__ */ o(d, {
75
+ className: t.item,
69
76
  hideOnClick: !0,
70
- value: o.id,
71
- children: [/* @__PURE__ */ t(y, {
72
- className: e.indicator,
77
+ value: r.id,
78
+ children: [/* @__PURE__ */ e(k, {
79
+ className: t.indicator,
73
80
  style: {
74
81
  width: "none",
75
82
  height: "none"
76
83
  },
77
- children: /* @__PURE__ */ t(g, {
78
- className: e.indicatorIcon
84
+ children: /* @__PURE__ */ e(p, {
85
+ className: t.indicatorIcon
79
86
  })
80
- }), f(o, d)]
81
- }, o.id))]
87
+ }), _(r, g)]
88
+ }, r.id))]
82
89
  })
83
90
  })]
84
91
  });
85
92
  }
86
93
  export {
87
- Y as FilterInstancesDropdown
94
+ tt as FilterInstancesDropdown
88
95
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@box/metadata-editor",
3
- "version": "0.78.2",
3
+ "version": "0.78.4",
4
4
  "peerDependencies": {
5
5
  "@ariakit/react": "0.4.14",
6
6
  "@box/blueprint-web": "^7.30.3",
@@ -14,7 +14,7 @@
14
14
  "devDependencies": {
15
15
  "@ariakit/react": "0.4.14",
16
16
  "@box/babel-plugin-target-attributes": "1.3.0",
17
- "@box/blueprint-web": "^9.1.0",
17
+ "@box/blueprint-web": "^9.1.1",
18
18
  "@box/blueprint-web-assets": "^4.30.0",
19
19
  "@box/storybook-utils": "^0.7.0",
20
20
  "@testing-library/react": "^15.0.6",
@@ -53,5 +53,5 @@
53
53
  "**/*.css"
54
54
  ],
55
55
  "license": "SEE LICENSE IN LICENSE",
56
- "gitHead": "9813a49e438da2e6375398b9c80065816680c67e"
56
+ "gitHead": "12459b549bab127f965a7a68620ab58a8d171862"
57
57
  }
package/styles/filter-instances-dropdown.css CHANGED
@@ -1 +1 @@
1
- ._details_l5feo_1{padding-inline:var(--size-4)}._popover_l5feo_5{font-weight:400;font-size:.875rem;font-family:Lato,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif;line-height:1.25rem;letter-spacing:.01875rem;text-transform:none;text-decoration:none;z-index:var(--z-index-popover);box-sizing:border-box;max-width:17.75rem;padding:0;background-color:var(--surface-menu-surface);border:var(--border-1) solid var(--border-card-border);border-radius:var(--radius-3);box-shadow:var(--dropshadow-3)}._popover_l5feo_5 ._divider_l5feo_22{margin-block:var(--space-2)}._popover_l5feo_5 ._scrollableContainer_l5feo_25{padding:var(--space-3);max-height:22.5rem}._popover_l5feo_5 ._item_l5feo_29{position:relative;align-items:center;padding:var(--border-8) var(--space-2) var(--border-8) var(--space-10);border:var(--border-2) solid transparent;border-radius:var(--radius-3);outline:none;-webkit-user-select:none;user-select:none;cursor:pointer;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}._popover_l5feo_5 ._item_l5feo_29[aria-disabled]{color:var(--gray-65);pointer-events:none}._popover_l5feo_5 ._item_l5feo_29[data-active-item]:not(:hover),._popover_l5feo_5 ._item_l5feo_29[data-highlighted]:not(:hover){background-color:var(--surface-menu-surface-hover);border:var(--border-2) solid var(--border-input-border-focus)}._popover_l5feo_5 ._item_l5feo_29[data-state=open],._popover_l5feo_5 ._item_l5feo_29:hover{background-color:var(--surface-menu-surface-hover)}._popover_l5feo_5 ._indicator_l5feo_56{position:absolute;top:0;left:var(--space-2);display:flex;align-items:center;justify-content:center;height:var(--size-9)}._popover_l5feo_5 ._indicatorIcon_l5feo_65 path{fill:var(--icon-icon-on-light)}
1
+ ._details_w5gf4_1{padding-inline:var(--size-1)}._triggerContainer_w5gf4_5{display:flex;flex-direction:column}._triggerButton_w5gf4_10{min-height:var(--size-6)!important;padding:0 var(--space-1)!important}._popover_w5gf4_15{font-weight:400;font-size:.875rem;font-family:Lato,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif;line-height:1.25rem;letter-spacing:.01875rem;text-transform:none;text-decoration:none;z-index:var(--z-index-popover);box-sizing:border-box;max-width:17.75rem;padding:0;background-color:var(--surface-menu-surface);border:var(--border-1) solid var(--border-card-border);border-radius:var(--radius-3);box-shadow:var(--dropshadow-3)}._popover_w5gf4_15 ._divider_w5gf4_32{margin-block:var(--space-2)}._popover_w5gf4_15 ._scrollableContainer_w5gf4_35{padding:var(--space-3);max-height:22.5rem}._popover_w5gf4_15 ._item_w5gf4_39{position:relative;align-items:center;padding:var(--border-8) var(--space-2) var(--border-8) var(--space-10);border:var(--border-2) solid transparent;border-radius:var(--radius-3);outline:none;-webkit-user-select:none;user-select:none;cursor:pointer;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}._popover_w5gf4_15 ._item_w5gf4_39[aria-disabled]{color:var(--gray-65);pointer-events:none}._popover_w5gf4_15 ._item_w5gf4_39[data-active-item]:not(:hover),._popover_w5gf4_15 ._item_w5gf4_39[data-highlighted]:not(:hover){background-color:var(--surface-menu-surface-hover);border:var(--border-2) solid var(--border-input-border-focus)}._popover_w5gf4_15 ._item_w5gf4_39[data-state=open],._popover_w5gf4_15 ._item_w5gf4_39:hover{background-color:var(--surface-menu-surface-hover)}._popover_w5gf4_15 ._indicator_w5gf4_66{position:absolute;top:0;left:var(--space-2);display:flex;align-items:center;justify-content:center;height:var(--size-9)}._popover_w5gf4_15 ._indicatorIcon_w5gf4_75 path{fill:var(--icon-icon-on-light)}._testContainer_w5gf4_79{border:2px #9f3fed dashed;height:56px;width:340px;display:flex;align-items:center}
package/types/index.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  export * from './lib/components/add-metadata-template-dropdown';
2
2
  export * from './lib/components/combobox-with-api-pagination';
3
3
  export * from './lib/components/filter-dropdown-menu';
4
+ export * from './lib/components/filter-instances-dropdown';
4
5
  export * from './lib/components/metadata-empty-state/metadata-empty-state';
5
6
  export * from './lib/components/metadata-instance-editor';
6
7
  export * from './lib/components/metadata-instance-list';