@cakemail-org/ui-components-v2 2.2.122 → 2.2.123

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/cjs/components/scopePicker/index.d.ts +10 -1
  2. package/dist/cjs/index.js +17 -13
  3. package/dist/esm/components/scopePicker/index.d.ts +10 -1
  4. package/dist/esm/index.js +17 -13
  5. package/package.json +1 -1
package/dist/cjs/components/scopePicker/index.d.ts CHANGED
@@ -2,10 +2,19 @@ import React from "react";
2
2
  import "./styles.scss";
3
3
  export { groupScopesByCategory } from "./scopeGroups";
4
4
  export type { TScopeCategorySummary } from "./scopeGroups";
5
+ export type TScopePickerLabels = {
6
+ presetsHeading?: string;
7
+ presets?: Record<string, string>;
8
+ categories?: Record<string, string>;
9
+ impliedHint?: string;
10
+ unrecognizedHint?: string;
11
+ selectedPermissions?: (count: number) => string;
12
+ };
5
13
  export type TScopePicker = {
6
14
  value: string[];
7
15
  onChange: (scopes: string[]) => void;
8
16
  isPartner?: boolean;
9
17
  disabled?: boolean;
18
+ labels?: TScopePickerLabels;
10
19
  };
11
- export declare function ScopePicker({ value, onChange, isPartner, disabled }: TScopePicker): React.JSX.Element;
20
+ export declare function ScopePicker({ value, onChange, isPartner, disabled, labels }: TScopePicker): React.JSX.Element;
package/dist/cjs/index.js CHANGED
@@ -19645,8 +19645,9 @@ function getImpliedScopes(scope) {
19645
19645
  return implied.map(function (a) { return "".concat(resource, ":").concat(a); }).filter(function (s) { return ALL_GRANULAR_SCOPES.has(s); });
19646
19646
  }
19647
19647
  function ScopePicker(_a) {
19648
- var value = _a.value, onChange = _a.onChange, _b = _a.isPartner, isPartner = _b === void 0 ? false : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c;
19649
- var _d = React.useState(new Set()), expandedCategories = _d[0], setExpandedCategories = _d[1];
19648
+ var _b;
19649
+ var value = _a.value, onChange = _a.onChange, _c = _a.isPartner, isPartner = _c === void 0 ? false : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.labels, labels = _e === void 0 ? {} : _e;
19650
+ var _f = React.useState(new Set()), expandedCategories = _f[0], setExpandedCategories = _f[1];
19650
19651
  var selectedSet = React.useMemo(function () { return new Set(value); }, [value]);
19651
19652
  var visibleCategories = React.useMemo(function () { return SCOPE_CATEGORIES.filter(function (c) { return !c.adminOnly || isPartner; }); }, [isPartner]);
19652
19653
  var toggleCategory = React.useCallback(function (categoryId) {
@@ -19742,39 +19743,42 @@ function ScopePicker(_a) {
19742
19743
  }, [selectedSet]);
19743
19744
  return (React.createElement("div", { className: "scopePicker", "aria-label": "Permission scope picker" },
19744
19745
  !disabled && (React.createElement("div", { className: "scopePicker__presets" },
19745
- React.createElement("span", { className: "scopePicker__presetsLabel" }, "Quick presets:"),
19746
- React.createElement("div", { className: "scopePicker__presetButtons" }, SCOPE_PRESETS.map(function (preset) { return (React.createElement("button", { key: preset.id, type: "button", className: "scopePicker__presetBtn", onClick: function () { return handlePreset(preset.id); } }, preset.label)); })))),
19746
+ React.createElement("span", { className: "scopePicker__presetsLabel" }, (_b = labels.presetsHeading) !== null && _b !== void 0 ? _b : "Quick presets:"),
19747
+ React.createElement("div", { className: "scopePicker__presetButtons" }, SCOPE_PRESETS.map(function (preset) {
19748
+ var _a, _b;
19749
+ return (React.createElement("button", { key: preset.id, type: "button", className: "scopePicker__presetBtn", onClick: function () { return handlePreset(preset.id); } }, (_b = (_a = labels.presets) === null || _a === void 0 ? void 0 : _a[preset.id]) !== null && _b !== void 0 ? _b : preset.label));
19750
+ })))),
19747
19751
  React.createElement("div", { className: "scopePicker__categories" }, visibleCategories.map(function (category) {
19752
+ var _a, _b, _c, _d, _e, _f;
19748
19753
  var isExpanded = expandedCategories.has(category.id);
19749
19754
  var allSelected = isCategoryAllSelected(category.id);
19750
19755
  var someSelected = isCategorySomeSelected(category.id);
19751
19756
  return (React.createElement("div", { key: category.id, className: "scopePicker__category ".concat(category.adminOnly ? "scopePicker__category--admin" : "") },
19752
19757
  React.createElement("div", { className: "scopePicker__categoryHeader" },
19753
19758
  React.createElement("label", { className: "scopePicker__categorySelect" },
19754
- React.createElement(IndeterminateCheckbox, { checked: allSelected, indeterminate: someSelected && !allSelected, onChange: function (checked) { return handleCategorySelectAll(category.id, checked); }, disabled: disabled, ariaLabel: "Select all ".concat(category.label, " scopes") }),
19755
- React.createElement("span", { className: "scopePicker__categoryLabel" }, category.label)),
19756
- React.createElement("button", { type: "button", className: "scopePicker__categoryToggle", onClick: function () { return toggleCategory(category.id); }, "aria-expanded": isExpanded, "aria-label": "".concat(isExpanded ? "Collapse" : "Expand", " ").concat(category.label) }, isExpanded ? "▲" : "▼")),
19759
+ React.createElement(IndeterminateCheckbox, { checked: allSelected, indeterminate: someSelected && !allSelected, onChange: function (checked) { return handleCategorySelectAll(category.id, checked); }, disabled: disabled, ariaLabel: "Select all ".concat((_b = (_a = labels.categories) === null || _a === void 0 ? void 0 : _a[category.id]) !== null && _b !== void 0 ? _b : category.label, " scopes") }),
19760
+ React.createElement("span", { className: "scopePicker__categoryLabel" }, (_d = (_c = labels.categories) === null || _c === void 0 ? void 0 : _c[category.id]) !== null && _d !== void 0 ? _d : category.label)),
19761
+ React.createElement("button", { type: "button", className: "scopePicker__categoryToggle", onClick: function () { return toggleCategory(category.id); }, "aria-expanded": isExpanded, "aria-label": "".concat(isExpanded ? "Collapse" : "Expand", " ").concat((_f = (_e = labels.categories) === null || _e === void 0 ? void 0 : _e[category.id]) !== null && _f !== void 0 ? _f : category.label) }, isExpanded ? "▲" : "▼")),
19757
19762
  isExpanded && (React.createElement("div", { className: "scopePicker__categoryBody" }, category.resources.map(function (resource) { return (React.createElement("div", { key: resource.resource, className: "scopePicker__resource" },
19758
19763
  React.createElement("span", { className: "scopePicker__resourceLabel" }, resource.label),
19759
19764
  React.createElement("div", { className: "scopePicker__actions" }, resource.actions.map(function (action) {
19765
+ var _a;
19760
19766
  var scope = "".concat(resource.resource, ":").concat(action);
19761
19767
  var checked = selectedSet.has(scope);
19762
19768
  var implied = isImplied(scope);
19763
- return (React.createElement("label", { key: action, className: "scopePicker__action ".concat(implied ? "scopePicker__action--implied" : ""), title: implied ? "Automatically included by another selected permission" : undefined },
19769
+ return (React.createElement("label", { key: action, className: "scopePicker__action ".concat(implied ? "scopePicker__action--implied" : ""), title: implied ? ((_a = labels.impliedHint) !== null && _a !== void 0 ? _a : "Automatically included by another selected permission") : undefined },
19764
19770
  React.createElement("input", { type: "checkbox", checked: checked, onChange: function (e) { return handleScopeToggle(scope, e.target.checked); }, disabled: disabled || implied, "aria-label": "".concat(resource.label, " ").concat(action) }),
19765
19771
  React.createElement("span", null, action)));
19766
19772
  })))); })))));
19767
19773
  })),
19768
19774
  value.length > 0 && (React.createElement("details", { className: "scopePicker__summary" },
19769
- React.createElement("summary", null,
19770
- "Selected permissions (",
19771
- value.length,
19772
- ")"),
19775
+ React.createElement("summary", null, labels.selectedPermissions ? labels.selectedPermissions(value.length) : "Selected permissions (".concat(value.length, ")")),
19773
19776
  React.createElement("div", { className: "scopePicker__summaryList" }, __spreadArray([], value, true).sort().map(function (scope) {
19777
+ var _a;
19774
19778
  // Scopes not in the catalog (e.g. enum drift) get a
19775
19779
  // distinct style + tooltip so they're never invisible.
19776
19780
  var unrecognized = !ALL_GRANULAR_SCOPES.has(scope);
19777
- return (React.createElement("span", { key: scope, className: "scopePicker__summaryChip ".concat(unrecognized ? "scopePicker__summaryChip--unknown" : ""), title: unrecognized ? "Not in the current permission catalog — kept as-is on save" : undefined }, scope));
19781
+ return (React.createElement("span", { key: scope, className: "scopePicker__summaryChip ".concat(unrecognized ? "scopePicker__summaryChip--unknown" : ""), title: unrecognized ? ((_a = labels.unrecognizedHint) !== null && _a !== void 0 ? _a : "Not in the current permission catalog — kept as-is on save") : undefined }, scope));
19778
19782
  }))))));
19779
19783
  }
19780
19784
 
package/dist/esm/components/scopePicker/index.d.ts CHANGED
@@ -2,10 +2,19 @@ import React from "react";
2
2
  import "./styles.scss";
3
3
  export { groupScopesByCategory } from "./scopeGroups";
4
4
  export type { TScopeCategorySummary } from "./scopeGroups";
5
+ export type TScopePickerLabels = {
6
+ presetsHeading?: string;
7
+ presets?: Record<string, string>;
8
+ categories?: Record<string, string>;
9
+ impliedHint?: string;
10
+ unrecognizedHint?: string;
11
+ selectedPermissions?: (count: number) => string;
12
+ };
5
13
  export type TScopePicker = {
6
14
  value: string[];
7
15
  onChange: (scopes: string[]) => void;
8
16
  isPartner?: boolean;
9
17
  disabled?: boolean;
18
+ labels?: TScopePickerLabels;
10
19
  };
11
- export declare function ScopePicker({ value, onChange, isPartner, disabled }: TScopePicker): React.JSX.Element;
20
+ export declare function ScopePicker({ value, onChange, isPartner, disabled, labels }: TScopePicker): React.JSX.Element;
package/dist/esm/index.js CHANGED
@@ -19625,8 +19625,9 @@ function getImpliedScopes(scope) {
19625
19625
  return implied.map(function (a) { return "".concat(resource, ":").concat(a); }).filter(function (s) { return ALL_GRANULAR_SCOPES.has(s); });
19626
19626
  }
19627
19627
  function ScopePicker(_a) {
19628
- var value = _a.value, onChange = _a.onChange, _b = _a.isPartner, isPartner = _b === void 0 ? false : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c;
19629
- var _d = useState(new Set()), expandedCategories = _d[0], setExpandedCategories = _d[1];
19628
+ var _b;
19629
+ var value = _a.value, onChange = _a.onChange, _c = _a.isPartner, isPartner = _c === void 0 ? false : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.labels, labels = _e === void 0 ? {} : _e;
19630
+ var _f = useState(new Set()), expandedCategories = _f[0], setExpandedCategories = _f[1];
19630
19631
  var selectedSet = useMemo(function () { return new Set(value); }, [value]);
19631
19632
  var visibleCategories = useMemo(function () { return SCOPE_CATEGORIES.filter(function (c) { return !c.adminOnly || isPartner; }); }, [isPartner]);
19632
19633
  var toggleCategory = useCallback(function (categoryId) {
@@ -19722,39 +19723,42 @@ function ScopePicker(_a) {
19722
19723
  }, [selectedSet]);
19723
19724
  return (React__default.createElement("div", { className: "scopePicker", "aria-label": "Permission scope picker" },
19724
19725
  !disabled && (React__default.createElement("div", { className: "scopePicker__presets" },
19725
- React__default.createElement("span", { className: "scopePicker__presetsLabel" }, "Quick presets:"),
19726
- React__default.createElement("div", { className: "scopePicker__presetButtons" }, SCOPE_PRESETS.map(function (preset) { return (React__default.createElement("button", { key: preset.id, type: "button", className: "scopePicker__presetBtn", onClick: function () { return handlePreset(preset.id); } }, preset.label)); })))),
19726
+ React__default.createElement("span", { className: "scopePicker__presetsLabel" }, (_b = labels.presetsHeading) !== null && _b !== void 0 ? _b : "Quick presets:"),
19727
+ React__default.createElement("div", { className: "scopePicker__presetButtons" }, SCOPE_PRESETS.map(function (preset) {
19728
+ var _a, _b;
19729
+ return (React__default.createElement("button", { key: preset.id, type: "button", className: "scopePicker__presetBtn", onClick: function () { return handlePreset(preset.id); } }, (_b = (_a = labels.presets) === null || _a === void 0 ? void 0 : _a[preset.id]) !== null && _b !== void 0 ? _b : preset.label));
19730
+ })))),
19727
19731
  React__default.createElement("div", { className: "scopePicker__categories" }, visibleCategories.map(function (category) {
19732
+ var _a, _b, _c, _d, _e, _f;
19728
19733
  var isExpanded = expandedCategories.has(category.id);
19729
19734
  var allSelected = isCategoryAllSelected(category.id);
19730
19735
  var someSelected = isCategorySomeSelected(category.id);
19731
19736
  return (React__default.createElement("div", { key: category.id, className: "scopePicker__category ".concat(category.adminOnly ? "scopePicker__category--admin" : "") },
19732
19737
  React__default.createElement("div", { className: "scopePicker__categoryHeader" },
19733
19738
  React__default.createElement("label", { className: "scopePicker__categorySelect" },
19734
- React__default.createElement(IndeterminateCheckbox, { checked: allSelected, indeterminate: someSelected && !allSelected, onChange: function (checked) { return handleCategorySelectAll(category.id, checked); }, disabled: disabled, ariaLabel: "Select all ".concat(category.label, " scopes") }),
19735
- React__default.createElement("span", { className: "scopePicker__categoryLabel" }, category.label)),
19736
- React__default.createElement("button", { type: "button", className: "scopePicker__categoryToggle", onClick: function () { return toggleCategory(category.id); }, "aria-expanded": isExpanded, "aria-label": "".concat(isExpanded ? "Collapse" : "Expand", " ").concat(category.label) }, isExpanded ? "▲" : "▼")),
19739
+ React__default.createElement(IndeterminateCheckbox, { checked: allSelected, indeterminate: someSelected && !allSelected, onChange: function (checked) { return handleCategorySelectAll(category.id, checked); }, disabled: disabled, ariaLabel: "Select all ".concat((_b = (_a = labels.categories) === null || _a === void 0 ? void 0 : _a[category.id]) !== null && _b !== void 0 ? _b : category.label, " scopes") }),
19740
+ React__default.createElement("span", { className: "scopePicker__categoryLabel" }, (_d = (_c = labels.categories) === null || _c === void 0 ? void 0 : _c[category.id]) !== null && _d !== void 0 ? _d : category.label)),
19741
+ React__default.createElement("button", { type: "button", className: "scopePicker__categoryToggle", onClick: function () { return toggleCategory(category.id); }, "aria-expanded": isExpanded, "aria-label": "".concat(isExpanded ? "Collapse" : "Expand", " ").concat((_f = (_e = labels.categories) === null || _e === void 0 ? void 0 : _e[category.id]) !== null && _f !== void 0 ? _f : category.label) }, isExpanded ? "▲" : "▼")),
19737
19742
  isExpanded && (React__default.createElement("div", { className: "scopePicker__categoryBody" }, category.resources.map(function (resource) { return (React__default.createElement("div", { key: resource.resource, className: "scopePicker__resource" },
19738
19743
  React__default.createElement("span", { className: "scopePicker__resourceLabel" }, resource.label),
19739
19744
  React__default.createElement("div", { className: "scopePicker__actions" }, resource.actions.map(function (action) {
19745
+ var _a;
19740
19746
  var scope = "".concat(resource.resource, ":").concat(action);
19741
19747
  var checked = selectedSet.has(scope);
19742
19748
  var implied = isImplied(scope);
19743
- return (React__default.createElement("label", { key: action, className: "scopePicker__action ".concat(implied ? "scopePicker__action--implied" : ""), title: implied ? "Automatically included by another selected permission" : undefined },
19749
+ return (React__default.createElement("label", { key: action, className: "scopePicker__action ".concat(implied ? "scopePicker__action--implied" : ""), title: implied ? ((_a = labels.impliedHint) !== null && _a !== void 0 ? _a : "Automatically included by another selected permission") : undefined },
19744
19750
  React__default.createElement("input", { type: "checkbox", checked: checked, onChange: function (e) { return handleScopeToggle(scope, e.target.checked); }, disabled: disabled || implied, "aria-label": "".concat(resource.label, " ").concat(action) }),
19745
19751
  React__default.createElement("span", null, action)));
19746
19752
  })))); })))));
19747
19753
  })),
19748
19754
  value.length > 0 && (React__default.createElement("details", { className: "scopePicker__summary" },
19749
- React__default.createElement("summary", null,
19750
- "Selected permissions (",
19751
- value.length,
19752
- ")"),
19755
+ React__default.createElement("summary", null, labels.selectedPermissions ? labels.selectedPermissions(value.length) : "Selected permissions (".concat(value.length, ")")),
19753
19756
  React__default.createElement("div", { className: "scopePicker__summaryList" }, __spreadArray([], value, true).sort().map(function (scope) {
19757
+ var _a;
19754
19758
  // Scopes not in the catalog (e.g. enum drift) get a
19755
19759
  // distinct style + tooltip so they're never invisible.
19756
19760
  var unrecognized = !ALL_GRANULAR_SCOPES.has(scope);
19757
- return (React__default.createElement("span", { key: scope, className: "scopePicker__summaryChip ".concat(unrecognized ? "scopePicker__summaryChip--unknown" : ""), title: unrecognized ? "Not in the current permission catalog — kept as-is on save" : undefined }, scope));
19761
+ return (React__default.createElement("span", { key: scope, className: "scopePicker__summaryChip ".concat(unrecognized ? "scopePicker__summaryChip--unknown" : ""), title: unrecognized ? ((_a = labels.unrecognizedHint) !== null && _a !== void 0 ? _a : "Not in the current permission catalog — kept as-is on save") : undefined }, scope));
19758
19762
  }))))));
19759
19763
  }
19760
19764
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cakemail-org/ui-components-v2",
3
- "version": "2.2.122",
3
+ "version": "2.2.123",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },