@elementor/editor-controls 0.17.0 → 0.18.1

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 (18) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/dist/index.d.mts +13 -1
  3. package/dist/index.d.ts +13 -1
  4. package/dist/index.js +34 -11
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +41 -20
  7. package/dist/index.mjs.map +1 -1
  8. package/package.json +2 -2
  9. package/src/components/control-label.tsx +2 -6
  10. package/src/components/control-toggle-button-group.tsx +2 -4
  11. package/src/control-adornments/control-adornments-context.tsx +25 -0
  12. package/src/control-adornments/control-adornments.tsx +19 -0
  13. package/src/control-adornments/control-label-with-adornments.tsx +15 -0
  14. package/src/controls/box-shadow-repeater-control.tsx +3 -5
  15. package/src/controls/equal-unequal-sizes-control.tsx +1 -1
  16. package/src/controls/gap-control.tsx +2 -2
  17. package/src/controls/linked-dimensions-control.tsx +4 -4
  18. package/src/index.ts +2 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # @elementor/editor-controls
2
2
 
3
+ ## 0.18.1
4
+
5
+ ### Patch Changes
6
+
7
+ - 85facff: Set fixed max-width for toggle-buttons-group item.
8
+ - e67bdcb: Update control label spacing.
9
+
10
+ ## 0.18.0
11
+
12
+ ### Minor Changes
13
+
14
+ - 217d896: Add indicators to control labels to reflect the style inheritance.
15
+
16
+ ### Patch Changes
17
+
18
+ - Updated dependencies [14610ee]
19
+ - @elementor/editor-elements@0.6.4
20
+
3
21
  ## 0.17.0
4
22
 
5
23
  ### Minor Changes
package/dist/index.d.mts CHANGED
@@ -224,6 +224,18 @@ declare const createControlReplacement: () => {
224
224
  getControlReplacement: () => CreateControlReplacement;
225
225
  };
226
226
 
227
+ type ControlAdornmentsItems = Array<{
228
+ id: string;
229
+ Adornment: ComponentType;
230
+ }>;
231
+ type ControlAdornmentsContext = {
232
+ items?: ControlAdornmentsItems;
233
+ };
234
+ type ControlAdornmentsProviderProps = PropsWithChildren<ControlAdornmentsContext>;
235
+ declare const ControlAdornmentsProvider: ({ children, items }: ControlAdornmentsProviderProps) => React.JSX.Element;
236
+
237
+ declare function ControlAdornments(): React.JSX.Element | null;
238
+
227
239
  type UseInternalStateOptions<TValue> = {
228
240
  external: TValue | null;
229
241
  setExternal: (value: TValue | null) => void;
@@ -232,4 +244,4 @@ type UseInternalStateOptions<TValue> = {
232
244
  };
233
245
  declare const useSyncExternalState: <TValue>({ external, setExternal, persistWhen, fallback, }: UseInternalStateOptions<TValue>) => readonly [TValue, (setter: ((value: TValue) => TValue) | TValue) => void];
234
246
 
235
- export { BackgroundControl, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, type ControlComponent, ControlLabel, ControlReplacementProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedValue, type FontCategory, FontFamilyControl, GapControl, ImageControl, LinkControl, LinkedDimensionsControl, NumberControl, PropKeyProvider, PropProvider, type PropProviderProps, SelectControl, type SetValue, SizeControl, StrokeControl, SvgMediaControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, type ToggleControlProps, UrlControl, createControlReplacement, useBoundProp, useControlActions, useSyncExternalState };
247
+ export { BackgroundControl, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent, ControlLabel, ControlReplacementProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedValue, type FontCategory, FontFamilyControl, GapControl, ImageControl, LinkControl, LinkedDimensionsControl, NumberControl, PropKeyProvider, PropProvider, type PropProviderProps, SelectControl, type SetValue, SizeControl, StrokeControl, SvgMediaControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, type ToggleControlProps, UrlControl, createControlReplacement, useBoundProp, useControlActions, useSyncExternalState };
package/dist/index.d.ts CHANGED
@@ -224,6 +224,18 @@ declare const createControlReplacement: () => {
224
224
  getControlReplacement: () => CreateControlReplacement;
225
225
  };
226
226
 
227
+ type ControlAdornmentsItems = Array<{
228
+ id: string;
229
+ Adornment: ComponentType;
230
+ }>;
231
+ type ControlAdornmentsContext = {
232
+ items?: ControlAdornmentsItems;
233
+ };
234
+ type ControlAdornmentsProviderProps = PropsWithChildren<ControlAdornmentsContext>;
235
+ declare const ControlAdornmentsProvider: ({ children, items }: ControlAdornmentsProviderProps) => React.JSX.Element;
236
+
237
+ declare function ControlAdornments(): React.JSX.Element | null;
238
+
227
239
  type UseInternalStateOptions<TValue> = {
228
240
  external: TValue | null;
229
241
  setExternal: (value: TValue | null) => void;
@@ -232,4 +244,4 @@ type UseInternalStateOptions<TValue> = {
232
244
  };
233
245
  declare const useSyncExternalState: <TValue>({ external, setExternal, persistWhen, fallback, }: UseInternalStateOptions<TValue>) => readonly [TValue, (setter: ((value: TValue) => TValue) | TValue) => void];
234
246
 
235
- export { BackgroundControl, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, type ControlComponent, ControlLabel, ControlReplacementProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedValue, type FontCategory, FontFamilyControl, GapControl, ImageControl, LinkControl, LinkedDimensionsControl, NumberControl, PropKeyProvider, PropProvider, type PropProviderProps, SelectControl, type SetValue, SizeControl, StrokeControl, SvgMediaControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, type ToggleControlProps, UrlControl, createControlReplacement, useBoundProp, useControlActions, useSyncExternalState };
247
+ export { BackgroundControl, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent, ControlLabel, ControlReplacementProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedValue, type FontCategory, FontFamilyControl, GapControl, ImageControl, LinkControl, LinkedDimensionsControl, NumberControl, PropKeyProvider, PropProvider, type PropProviderProps, SelectControl, type SetValue, SizeControl, StrokeControl, SvgMediaControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, type ToggleControlProps, UrlControl, createControlReplacement, useBoundProp, useControlActions, useSyncExternalState };
package/dist/index.js CHANGED
@@ -34,6 +34,8 @@ __export(index_exports, {
34
34
  BoxShadowRepeaterControl: () => BoxShadowRepeaterControl,
35
35
  ColorControl: () => ColorControl,
36
36
  ControlActionsProvider: () => ControlActionsProvider,
37
+ ControlAdornments: () => ControlAdornments,
38
+ ControlAdornmentsProvider: () => ControlAdornmentsProvider,
37
39
  ControlLabel: () => ControlLabel,
38
40
  ControlReplacementProvider: () => ControlReplacementProvider,
39
41
  ControlToggleButtonGroup: () => ControlToggleButtonGroup,
@@ -220,7 +222,7 @@ var resolveUnionPropType = (propType, key) => {
220
222
  var React3 = __toESM(require("react"));
221
223
  var import_ui = require("@elementor/ui");
222
224
  var ControlLabel = ({ children }) => {
223
- return /* @__PURE__ */ React3.createElement(import_ui.Typography, { component: "label", variant: "caption", color: "text.secondary" }, children);
225
+ return /* @__PURE__ */ React3.createElement(import_ui.FormLabel, { size: "tiny" }, children);
224
226
  };
225
227
 
226
228
  // src/create-control.tsx
@@ -1002,7 +1004,7 @@ var Control2 = ({
1002
1004
  bind,
1003
1005
  children,
1004
1006
  sx
1005
- }) => /* @__PURE__ */ React22.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React22.createElement(import_ui18.Grid, { item: true, xs: 6, sx }, /* @__PURE__ */ React22.createElement(import_ui18.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React22.createElement(import_ui18.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React22.createElement(import_ui18.Typography, { component: "label", variant: "caption", color: "text.secondary" }, label)), /* @__PURE__ */ React22.createElement(import_ui18.Grid, { item: true, xs: 12 }, children))));
1007
+ }) => /* @__PURE__ */ React22.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React22.createElement(import_ui18.Grid, { item: true, xs: 6, sx }, /* @__PURE__ */ React22.createElement(import_ui18.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React22.createElement(import_ui18.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React22.createElement(import_ui18.FormLabel, { size: "tiny" }, label)), /* @__PURE__ */ React22.createElement(import_ui18.Grid, { item: true, xs: 12 }, children))));
1006
1008
  var ItemLabel = ({ value }) => {
1007
1009
  const { position, hOffset, vOffset, blur, spread } = value.value;
1008
1010
  const { size: blurSize = "", unit: blurUnit = "" } = blur?.value || {};
@@ -1055,7 +1057,6 @@ var import_ui19 = require("@elementor/ui");
1055
1057
  var StyledToggleButtonGroup = (0, import_ui19.styled)(import_ui19.ToggleButtonGroup)`
1056
1058
  ${({ justify }) => `justify-content: ${justify};`}
1057
1059
  `;
1058
- var MAX_VISIBLE_ITEMS = 4;
1059
1060
  var ControlToggleButtonGroup = ({
1060
1061
  justify = "end",
1061
1062
  size = "tiny",
@@ -1079,8 +1080,8 @@ var ControlToggleButtonGroup = ({
1079
1080
  sx: {
1080
1081
  direction: isRtl ? "rtl /* @noflip */" : "ltr /* @noflip */",
1081
1082
  display: "grid",
1082
- gridTemplateColumns: `repeat(${items.length}, 1fr)`,
1083
- width: `${items.length / MAX_VISIBLE_ITEMS * 100}%`
1083
+ gridTemplateColumns: `repeat(${items.length}, minmax(0, 25%))`,
1084
+ width: `100%`
1084
1085
  }
1085
1086
  },
1086
1087
  items.map(
@@ -1269,7 +1270,7 @@ function EqualUnequalSizesControl({
1269
1270
  /* @__PURE__ */ React26.createElement(PropProvider, { propType: multiSizePropType, value: getMultiSizeValues(), setValue: setNestedProp }, /* @__PURE__ */ React26.createElement(PopoverContent, { p: 1.5 }, /* @__PURE__ */ React26.createElement(PopoverGridContainer, null, /* @__PURE__ */ React26.createElement(MultiSizeValueControl, { item: items[0] }), /* @__PURE__ */ React26.createElement(MultiSizeValueControl, { item: items[1] })), /* @__PURE__ */ React26.createElement(PopoverGridContainer, null, /* @__PURE__ */ React26.createElement(MultiSizeValueControl, { item: items[2] }), /* @__PURE__ */ React26.createElement(MultiSizeValueControl, { item: items[3] }))))
1270
1271
  ));
1271
1272
  }
1272
- var MultiSizeValueControl = ({ item }) => /* @__PURE__ */ React26.createElement(PropKeyProvider, { bind: item.bind }, /* @__PURE__ */ React26.createElement(import_ui21.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React26.createElement(import_ui21.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React26.createElement(import_ui21.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React26.createElement(ControlLabel, null, item.label)), /* @__PURE__ */ React26.createElement(import_ui21.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React26.createElement(SizeControl, { startIcon: item.icon })))));
1273
+ var MultiSizeValueControl = ({ item }) => /* @__PURE__ */ React26.createElement(PropKeyProvider, { bind: item.bind }, /* @__PURE__ */ React26.createElement(import_ui21.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React26.createElement(import_ui21.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React26.createElement(import_ui21.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React26.createElement(ControlLabel, null, item.label)), /* @__PURE__ */ React26.createElement(import_ui21.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React26.createElement(SizeControl, { startIcon: item.icon })))));
1273
1274
 
1274
1275
  // src/controls/linked-dimensions-control.tsx
1275
1276
  var React27 = __toESM(require("react"));
@@ -1318,7 +1319,7 @@ var LinkedDimensionsControl = createControl(
1318
1319
  onChange: onLinkToggle
1319
1320
  },
1320
1321
  /* @__PURE__ */ React27.createElement(LinkedIcon, { fontSize: "tiny" })
1321
- ))), /* @__PURE__ */ React27.createElement(import_ui22.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(ControlLabel, null, (0, import_i18n7.__)("Top", "elementor"))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(
1322
+ ))), /* @__PURE__ */ React27.createElement(import_ui22.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(ControlLabel, null, (0, import_i18n7.__)("Top", "elementor"))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(
1322
1323
  Control3,
1323
1324
  {
1324
1325
  bind: "block-start",
@@ -1326,7 +1327,7 @@ var LinkedDimensionsControl = createControl(
1326
1327
  isLinked,
1327
1328
  extendedValues
1328
1329
  }
1329
- ))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(ControlLabel, null, isSiteRtl ? (0, import_i18n7.__)("Left", "elementor") : (0, import_i18n7.__)("Right", "elementor"))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(
1330
+ ))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(ControlLabel, null, isSiteRtl ? (0, import_i18n7.__)("Left", "elementor") : (0, import_i18n7.__)("Right", "elementor"))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(
1330
1331
  Control3,
1331
1332
  {
1332
1333
  bind: "inline-end",
@@ -1334,7 +1335,7 @@ var LinkedDimensionsControl = createControl(
1334
1335
  isLinked,
1335
1336
  extendedValues
1336
1337
  }
1337
- )))), /* @__PURE__ */ React27.createElement(import_ui22.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(ControlLabel, null, (0, import_i18n7.__)("Bottom", "elementor"))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(
1338
+ )))), /* @__PURE__ */ React27.createElement(import_ui22.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(ControlLabel, null, (0, import_i18n7.__)("Bottom", "elementor"))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(
1338
1339
  Control3,
1339
1340
  {
1340
1341
  bind: "block-end",
@@ -1342,7 +1343,7 @@ var LinkedDimensionsControl = createControl(
1342
1343
  isLinked,
1343
1344
  extendedValues
1344
1345
  }
1345
- ))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(ControlLabel, null, isSiteRtl ? (0, import_i18n7.__)("Right", "elementor") : (0, import_i18n7.__)("Left", "elementor"))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(
1346
+ ))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(ControlLabel, null, isSiteRtl ? (0, import_i18n7.__)("Right", "elementor") : (0, import_i18n7.__)("Left", "elementor"))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(
1346
1347
  Control3,
1347
1348
  {
1348
1349
  bind: "inline-start",
@@ -1950,7 +1951,7 @@ var GapControl = createControl(({ label }) => {
1950
1951
  onChange: onLinkToggle
1951
1952
  },
1952
1953
  /* @__PURE__ */ React32.createElement(LinkedIcon, { fontSize: "tiny" })
1953
- ))), /* @__PURE__ */ React32.createElement(import_ui27.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React32.createElement(import_ui27.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React32.createElement(import_ui27.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React32.createElement(ControlLabel, null, (0, import_i18n10.__)("Column", "elementor"))), /* @__PURE__ */ React32.createElement(import_ui27.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React32.createElement(Control4, { bind: "column", isLinked }))), /* @__PURE__ */ React32.createElement(import_ui27.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React32.createElement(import_ui27.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React32.createElement(ControlLabel, null, (0, import_i18n10.__)("Row", "elementor"))), /* @__PURE__ */ React32.createElement(import_ui27.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React32.createElement(Control4, { bind: "row", isLinked })))));
1954
+ ))), /* @__PURE__ */ React32.createElement(import_ui27.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React32.createElement(import_ui27.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React32.createElement(import_ui27.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React32.createElement(ControlLabel, null, (0, import_i18n10.__)("Column", "elementor"))), /* @__PURE__ */ React32.createElement(import_ui27.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React32.createElement(Control4, { bind: "column", isLinked }))), /* @__PURE__ */ React32.createElement(import_ui27.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React32.createElement(import_ui27.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React32.createElement(ControlLabel, null, (0, import_i18n10.__)("Row", "elementor"))), /* @__PURE__ */ React32.createElement(import_ui27.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React32.createElement(Control4, { bind: "row", isLinked })))));
1954
1955
  });
1955
1956
  var Control4 = ({ bind, isLinked }) => {
1956
1957
  if (isLinked) {
@@ -2596,12 +2597,34 @@ var BackgroundControl = createControl(() => {
2596
2597
  const propContext = useBoundProp(import_editor_props24.backgroundPropTypeUtil);
2597
2598
  return /* @__PURE__ */ React41.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React41.createElement(SectionContent, null, /* @__PURE__ */ React41.createElement(PropKeyProvider, { bind: "background-overlay" }, /* @__PURE__ */ React41.createElement(BackgroundOverlayRepeaterControl, null)), /* @__PURE__ */ React41.createElement(PropKeyProvider, { bind: "color" }, /* @__PURE__ */ React41.createElement(import_ui37.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React41.createElement(import_ui37.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React41.createElement(ControlLabel, null, (0, import_i18n18.__)("Color", "elementor"))), /* @__PURE__ */ React41.createElement(import_ui37.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React41.createElement(ColorControl, null))))));
2598
2599
  });
2600
+
2601
+ // src/control-adornments/control-adornments-context.tsx
2602
+ var React42 = __toESM(require("react"));
2603
+ var import_react15 = require("react");
2604
+ var Context2 = (0, import_react15.createContext)(null);
2605
+ var ControlAdornmentsProvider = ({ children, items }) => /* @__PURE__ */ React42.createElement(Context2.Provider, { value: { items } }, children);
2606
+ var useControlAdornments = () => {
2607
+ const context = (0, import_react15.useContext)(Context2);
2608
+ return context?.items ?? [];
2609
+ };
2610
+
2611
+ // src/control-adornments/control-adornments.tsx
2612
+ var React43 = __toESM(require("react"));
2613
+ function ControlAdornments() {
2614
+ const items = useControlAdornments();
2615
+ if (items?.length === 0) {
2616
+ return null;
2617
+ }
2618
+ return /* @__PURE__ */ React43.createElement(React43.Fragment, null, items.map(({ Adornment, id }) => /* @__PURE__ */ React43.createElement(Adornment, { key: id })));
2619
+ }
2599
2620
  // Annotate the CommonJS export names for ESM import in node:
2600
2621
  0 && (module.exports = {
2601
2622
  BackgroundControl,
2602
2623
  BoxShadowRepeaterControl,
2603
2624
  ColorControl,
2604
2625
  ControlActionsProvider,
2626
+ ControlAdornments,
2627
+ ControlAdornmentsProvider,
2605
2628
  ControlLabel,
2606
2629
  ControlReplacementProvider,
2607
2630
  ControlToggleButtonGroup,