@elementor/editor-controls 3.35.0-412 → 3.35.0-414

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.
package/dist/index.js CHANGED
@@ -95,9 +95,9 @@ __export(index_exports, {
95
95
  module.exports = __toCommonJS(index_exports);
96
96
 
97
97
  // src/controls/image-control.tsx
98
- var React11 = __toESM(require("react"));
98
+ var React14 = __toESM(require("react"));
99
99
  var import_editor_props3 = require("@elementor/editor-props");
100
- var import_ui6 = require("@elementor/ui");
100
+ var import_ui7 = require("@elementor/ui");
101
101
  var import_i18n2 = require("@wordpress/i18n");
102
102
 
103
103
  // src/bound-prop-context/prop-context.tsx
@@ -300,20 +300,53 @@ var ControlFormLabel = (props) => {
300
300
  return /* @__PURE__ */ React3.createElement(import_ui.FormLabel, { size: "tiny", ...props });
301
301
  };
302
302
 
303
- // src/create-control.tsx
304
- var React5 = __toESM(require("react"));
303
+ // src/components/control-label.tsx
304
+ var React6 = __toESM(require("react"));
305
305
  var import_ui2 = require("@elementor/ui");
306
306
 
307
- // src/control-replacements.tsx
307
+ // src/control-adornments/control-adornments.tsx
308
+ var React5 = __toESM(require("react"));
309
+
310
+ // src/control-adornments/control-adornments-context.tsx
308
311
  var React4 = __toESM(require("react"));
309
312
  var import_react4 = require("react");
310
- var ControlReplacementContext = (0, import_react4.createContext)([]);
313
+ var Context = (0, import_react4.createContext)(null);
314
+ var ControlAdornmentsProvider = ({ children, items: items2 }) => /* @__PURE__ */ React4.createElement(Context.Provider, { value: { items: items2 } }, children);
315
+ var useControlAdornments = () => {
316
+ const context = (0, import_react4.useContext)(Context);
317
+ return context?.items ?? [];
318
+ };
319
+
320
+ // src/control-adornments/control-adornments.tsx
321
+ function ControlAdornments({
322
+ customContext
323
+ }) {
324
+ const items2 = useControlAdornments();
325
+ if (items2?.length === 0) {
326
+ return null;
327
+ }
328
+ return /* @__PURE__ */ React5.createElement(React5.Fragment, null, items2.map(({ Adornment, id }) => /* @__PURE__ */ React5.createElement(Adornment, { key: id, customContext })));
329
+ }
330
+
331
+ // src/components/control-label.tsx
332
+ var ControlLabel = ({ children, ...props }) => {
333
+ return /* @__PURE__ */ React6.createElement(import_ui2.Stack, { direction: "row", alignItems: "center", justifyItems: "start", gap: 0.25 }, /* @__PURE__ */ React6.createElement(ControlFormLabel, { ...props }, children), /* @__PURE__ */ React6.createElement(ControlAdornments, null));
334
+ };
335
+
336
+ // src/create-control.tsx
337
+ var React8 = __toESM(require("react"));
338
+ var import_ui3 = require("@elementor/ui");
339
+
340
+ // src/control-replacements.tsx
341
+ var React7 = __toESM(require("react"));
342
+ var import_react5 = require("react");
343
+ var ControlReplacementContext = (0, import_react5.createContext)([]);
311
344
  var ControlReplacementsProvider = ({ replacements, children }) => {
312
- return /* @__PURE__ */ React4.createElement(ControlReplacementContext.Provider, { value: replacements }, children);
345
+ return /* @__PURE__ */ React7.createElement(ControlReplacementContext.Provider, { value: replacements }, children);
313
346
  };
314
347
  var useControlReplacement = (OriginalComponent) => {
315
348
  const { value, placeholder } = useBoundProp();
316
- const replacements = (0, import_react4.useContext)(ControlReplacementContext);
349
+ const replacements = (0, import_react5.useContext)(ControlReplacementContext);
317
350
  try {
318
351
  const replacement = replacements.find((r) => r.condition({ value, placeholder }));
319
352
  return {
@@ -342,7 +375,7 @@ function createControl(Control5) {
342
375
  return ((props) => {
343
376
  const { ControlToRender, OriginalControl, isReplaced } = useControlReplacement(Control5);
344
377
  const controlProps = isReplaced ? { ...props, OriginalControl } : props;
345
- return /* @__PURE__ */ React5.createElement(import_ui2.ErrorBoundary, { fallback: null }, /* @__PURE__ */ React5.createElement(ControlToRender, { ...controlProps }));
378
+ return /* @__PURE__ */ React8.createElement(import_ui3.ErrorBoundary, { fallback: null }, /* @__PURE__ */ React8.createElement(ControlToRender, { ...controlProps }));
346
379
  });
347
380
  }
348
381
 
@@ -386,21 +419,21 @@ var formatResponse = (response) => {
386
419
  };
387
420
 
388
421
  // src/controls/image-media-control.tsx
389
- var React9 = __toESM(require("react"));
422
+ var React12 = __toESM(require("react"));
390
423
  var import_editor_props = require("@elementor/editor-props");
391
424
  var import_icons = require("@elementor/icons");
392
- var import_ui4 = require("@elementor/ui");
425
+ var import_ui5 = require("@elementor/ui");
393
426
  var import_wp_media = require("@elementor/wp-media");
394
427
  var import_i18n = require("@wordpress/i18n");
395
428
 
396
429
  // src/control-actions/control-actions.tsx
397
- var React8 = __toESM(require("react"));
430
+ var React11 = __toESM(require("react"));
398
431
 
399
432
  // src/components/floating-bar.tsx
400
- var React6 = __toESM(require("react"));
401
- var import_react5 = require("react");
402
- var import_ui3 = require("@elementor/ui");
403
- var FloatingBarContainer = (0, import_ui3.styled)("span")`
433
+ var React9 = __toESM(require("react"));
434
+ var import_react6 = require("react");
435
+ var import_ui4 = require("@elementor/ui");
436
+ var FloatingBarContainer = (0, import_ui4.styled)("span")`
404
437
  display: contents;
405
438
 
406
439
  .MuiFloatingActionBar-popper:has( .MuiFloatingActionBar-actions:empty ) {
@@ -411,13 +444,13 @@ var FloatingBarContainer = (0, import_ui3.styled)("span")`
411
444
  z-index: 1000;
412
445
  }
413
446
  `;
414
- var FloatingActionsContext = (0, import_react5.createContext)(null);
447
+ var FloatingActionsContext = (0, import_react6.createContext)(null);
415
448
  function FloatingActionsBar({ actions, children }) {
416
- const [open, setOpen] = (0, import_react5.useState)(false);
417
- return /* @__PURE__ */ React6.createElement(FloatingActionsContext.Provider, { value: { open, setOpen } }, /* @__PURE__ */ React6.createElement(FloatingBarContainer, null, /* @__PURE__ */ React6.createElement(import_ui3.UnstableFloatingActionBar, { actions, open: open || void 0 }, children)));
449
+ const [open, setOpen] = (0, import_react6.useState)(false);
450
+ return /* @__PURE__ */ React9.createElement(FloatingActionsContext.Provider, { value: { open, setOpen } }, /* @__PURE__ */ React9.createElement(FloatingBarContainer, null, /* @__PURE__ */ React9.createElement(import_ui4.UnstableFloatingActionBar, { actions, open: open || void 0 }, children)));
418
451
  }
419
452
  function useFloatingActionsBar() {
420
- const context = (0, import_react5.useContext)(FloatingActionsContext);
453
+ const context = (0, import_react6.useContext)(FloatingActionsContext);
421
454
  if (!context) {
422
455
  throw new Error("useFloatingActions must be used within a FloatingActionsBar");
423
456
  }
@@ -425,12 +458,12 @@ function useFloatingActionsBar() {
425
458
  }
426
459
 
427
460
  // src/control-actions/control-actions-context.tsx
428
- var React7 = __toESM(require("react"));
429
- var import_react6 = require("react");
430
- var Context = (0, import_react6.createContext)(null);
431
- var ControlActionsProvider = ({ children, items: items2 }) => /* @__PURE__ */ React7.createElement(Context.Provider, { value: { items: items2 } }, children);
461
+ var React10 = __toESM(require("react"));
462
+ var import_react7 = require("react");
463
+ var Context2 = (0, import_react7.createContext)(null);
464
+ var ControlActionsProvider = ({ children, items: items2 }) => /* @__PURE__ */ React10.createElement(Context2.Provider, { value: { items: items2 } }, children);
432
465
  var useControlActions = () => {
433
- const context = (0, import_react6.useContext)(Context);
466
+ const context = (0, import_react7.useContext)(Context2);
434
467
  if (!context) {
435
468
  throw new Error("useControlActions must be used within a ControlActionsProvider");
436
469
  }
@@ -444,8 +477,8 @@ function ControlActions({ children }) {
444
477
  if (items2.length === 0 || disabled) {
445
478
  return children;
446
479
  }
447
- const menuItems = items2.map(({ MenuItem: MenuItem2, id }) => /* @__PURE__ */ React8.createElement(MenuItem2, { key: id }));
448
- return /* @__PURE__ */ React8.createElement(FloatingActionsBar, { actions: menuItems }, children);
480
+ const menuItems = items2.map(({ MenuItem: MenuItem2, id }) => /* @__PURE__ */ React11.createElement(MenuItem2, { key: id }));
481
+ return /* @__PURE__ */ React11.createElement(FloatingActionsBar, { actions: menuItems }, children);
449
482
  }
450
483
 
451
484
  // src/controls/image-media-control.tsx
@@ -468,8 +501,8 @@ var ImageMediaControl = createControl(({ mediaTypes = ["image"] }) => {
468
501
  });
469
502
  }
470
503
  });
471
- return /* @__PURE__ */ React9.createElement(ControlActions, null, /* @__PURE__ */ React9.createElement(import_ui4.Card, { variant: "outlined" }, /* @__PURE__ */ React9.createElement(import_ui4.CardMedia, { image: src, sx: { height: propType.meta.isDynamic ? 134 : 150 } }, isFetching ? /* @__PURE__ */ React9.createElement(import_ui4.Stack, { justifyContent: "center", alignItems: "center", width: "100%", height: "100%" }, /* @__PURE__ */ React9.createElement(import_ui4.CircularProgress, null)) : /* @__PURE__ */ React9.createElement(React9.Fragment, null)), /* @__PURE__ */ React9.createElement(import_ui4.CardOverlay, null, /* @__PURE__ */ React9.createElement(import_ui4.Stack, { gap: 1 }, /* @__PURE__ */ React9.createElement(
472
- import_ui4.Button,
504
+ return /* @__PURE__ */ React12.createElement(ControlActions, null, /* @__PURE__ */ React12.createElement(import_ui5.Card, { variant: "outlined" }, /* @__PURE__ */ React12.createElement(import_ui5.CardMedia, { image: src, sx: { height: propType.meta.isDynamic ? 134 : 150 } }, isFetching ? /* @__PURE__ */ React12.createElement(import_ui5.Stack, { justifyContent: "center", alignItems: "center", width: "100%", height: "100%" }, /* @__PURE__ */ React12.createElement(import_ui5.CircularProgress, null)) : /* @__PURE__ */ React12.createElement(React12.Fragment, null)), /* @__PURE__ */ React12.createElement(import_ui5.CardOverlay, null, /* @__PURE__ */ React12.createElement(import_ui5.Stack, { gap: 1 }, /* @__PURE__ */ React12.createElement(
505
+ import_ui5.Button,
473
506
  {
474
507
  size: "tiny",
475
508
  color: "inherit",
@@ -477,13 +510,13 @@ var ImageMediaControl = createControl(({ mediaTypes = ["image"] }) => {
477
510
  onClick: () => open({ mode: "browse" })
478
511
  },
479
512
  (0, import_i18n.__)("Select image", "elementor")
480
- ), /* @__PURE__ */ React9.createElement(
481
- import_ui4.Button,
513
+ ), /* @__PURE__ */ React12.createElement(
514
+ import_ui5.Button,
482
515
  {
483
516
  size: "tiny",
484
517
  variant: "text",
485
518
  color: "inherit",
486
- startIcon: /* @__PURE__ */ React9.createElement(import_icons.UploadIcon, null),
519
+ startIcon: /* @__PURE__ */ React12.createElement(import_icons.UploadIcon, null),
487
520
  onClick: () => open({ mode: "upload" })
488
521
  },
489
522
  (0, import_i18n.__)("Upload", "elementor")
@@ -491,10 +524,10 @@ var ImageMediaControl = createControl(({ mediaTypes = ["image"] }) => {
491
524
  });
492
525
 
493
526
  // src/controls/select-control.tsx
494
- var React10 = __toESM(require("react"));
527
+ var React13 = __toESM(require("react"));
495
528
  var import_editor_props2 = require("@elementor/editor-props");
496
529
  var import_editor_ui = require("@elementor/editor-ui");
497
- var import_ui5 = require("@elementor/ui");
530
+ var import_ui6 = require("@elementor/ui");
498
531
  var DEFAULT_MENU_PROPS = {
499
532
  MenuListProps: {
500
533
  sx: {
@@ -511,8 +544,8 @@ var SelectControl = createControl(
511
544
  setValue(newValue);
512
545
  };
513
546
  const isDisabled = disabled || options.length === 0;
514
- return /* @__PURE__ */ React10.createElement(ControlActions, null, /* @__PURE__ */ React10.createElement(
515
- import_ui5.Select,
547
+ return /* @__PURE__ */ React13.createElement(ControlActions, null, /* @__PURE__ */ React13.createElement(
548
+ import_ui6.Select,
516
549
  {
517
550
  sx: { overflow: "hidden" },
518
551
  displayEmpty: true,
@@ -525,7 +558,7 @@ var SelectControl = createControl(
525
558
  if (placeholder) {
526
559
  const placeholderOption = findOptionByValue(placeholder);
527
560
  const displayText = placeholderOption?.label || placeholder;
528
- return /* @__PURE__ */ React10.createElement(import_ui5.Typography, { component: "span", variant: "caption", color: "text.tertiary" }, displayText);
561
+ return /* @__PURE__ */ React13.createElement(import_ui6.Typography, { component: "span", variant: "caption", color: "text.tertiary" }, displayText);
529
562
  }
530
563
  return "";
531
564
  }
@@ -537,7 +570,7 @@ var SelectControl = createControl(
537
570
  disabled: isDisabled,
538
571
  fullWidth: true
539
572
  },
540
- options.map(({ label, ...props }) => /* @__PURE__ */ React10.createElement(import_editor_ui.MenuListItem, { key: props.value, ...props, value: props.value ?? "" }, label))
573
+ options.map(({ label, ...props }) => /* @__PURE__ */ React13.createElement(import_editor_ui.MenuListItem, { key: props.value, ...props, value: props.value ?? "" }, label))
541
574
  ));
542
575
  }
543
576
  );
@@ -545,21 +578,21 @@ var SelectControl = createControl(
545
578
  // src/controls/image-control.tsx
546
579
  var ImageControl = createControl(({ sizes }) => {
547
580
  const propContext = useBoundProp(import_editor_props3.imagePropTypeUtil);
548
- return /* @__PURE__ */ React11.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React11.createElement(import_ui6.Stack, { gap: 1.5 }, /* @__PURE__ */ React11.createElement(ControlFormLabel, null, (0, import_i18n2.__)("Image", "elementor")), /* @__PURE__ */ React11.createElement(ImageSrcControl, null), /* @__PURE__ */ React11.createElement(import_ui6.Grid, { container: true, gap: 1.5, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React11.createElement(import_ui6.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React11.createElement(ControlFormLabel, null, (0, import_i18n2.__)("Resolution", "elementor"))), /* @__PURE__ */ React11.createElement(import_ui6.Grid, { item: true, xs: 6, sx: { overflow: "hidden" } }, /* @__PURE__ */ React11.createElement(ImageSizeControl, { sizes })))));
581
+ return /* @__PURE__ */ React14.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React14.createElement(import_ui7.Stack, { gap: 1.5 }, /* @__PURE__ */ React14.createElement(ControlLabel, null, (0, import_i18n2.__)("Image", "elementor")), /* @__PURE__ */ React14.createElement(ImageSrcControl, null), /* @__PURE__ */ React14.createElement(import_ui7.Grid, { container: true, gap: 1.5, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React14.createElement(import_ui7.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React14.createElement(ControlFormLabel, null, (0, import_i18n2.__)("Resolution", "elementor"))), /* @__PURE__ */ React14.createElement(import_ui7.Grid, { item: true, xs: 6, sx: { overflow: "hidden" } }, /* @__PURE__ */ React14.createElement(ImageSizeControl, { sizes })))));
549
582
  });
550
583
  var ImageSrcControl = () => {
551
584
  const { data: allowSvgUpload } = useUnfilteredFilesUpload();
552
585
  const mediaTypes = allowSvgUpload ? ["image", "svg"] : ["image"];
553
- return /* @__PURE__ */ React11.createElement(PropKeyProvider, { bind: "src" }, /* @__PURE__ */ React11.createElement(ImageMediaControl, { mediaTypes }));
586
+ return /* @__PURE__ */ React14.createElement(PropKeyProvider, { bind: "src" }, /* @__PURE__ */ React14.createElement(ImageMediaControl, { mediaTypes }));
554
587
  };
555
588
  var ImageSizeControl = ({ sizes }) => {
556
- return /* @__PURE__ */ React11.createElement(PropKeyProvider, { bind: "size" }, /* @__PURE__ */ React11.createElement(SelectControl, { options: sizes }));
589
+ return /* @__PURE__ */ React14.createElement(PropKeyProvider, { bind: "size" }, /* @__PURE__ */ React14.createElement(SelectControl, { options: sizes }));
557
590
  };
558
591
 
559
592
  // src/controls/text-control.tsx
560
- var React12 = __toESM(require("react"));
593
+ var React15 = __toESM(require("react"));
561
594
  var import_editor_props4 = require("@elementor/editor-props");
562
- var import_ui7 = require("@elementor/ui");
595
+ var import_ui8 = require("@elementor/ui");
563
596
  var TextControl = createControl(
564
597
  ({
565
598
  placeholder,
@@ -572,8 +605,8 @@ var TextControl = createControl(
572
605
  }) => {
573
606
  const { value, setValue, disabled } = useBoundProp(import_editor_props4.stringPropTypeUtil);
574
607
  const handleChange = (event) => setValue(event.target.value);
575
- return /* @__PURE__ */ React12.createElement(ControlActions, null, /* @__PURE__ */ React12.createElement(
576
- import_ui7.TextField,
608
+ return /* @__PURE__ */ React15.createElement(ControlActions, null, /* @__PURE__ */ React15.createElement(
609
+ import_ui8.TextField,
577
610
  {
578
611
  size: "tiny",
579
612
  fullWidth: true,
@@ -593,16 +626,16 @@ var TextControl = createControl(
593
626
  );
594
627
 
595
628
  // src/controls/text-area-control.tsx
596
- var React13 = __toESM(require("react"));
629
+ var React16 = __toESM(require("react"));
597
630
  var import_editor_props5 = require("@elementor/editor-props");
598
- var import_ui8 = require("@elementor/ui");
631
+ var import_ui9 = require("@elementor/ui");
599
632
  var TextAreaControl = createControl(({ placeholder, ariaLabel }) => {
600
633
  const { value, setValue, disabled } = useBoundProp(import_editor_props5.stringPropTypeUtil);
601
634
  const handleChange = (event) => {
602
635
  setValue(event.target.value);
603
636
  };
604
- return /* @__PURE__ */ React13.createElement(ControlActions, null, /* @__PURE__ */ React13.createElement(
605
- import_ui8.TextField,
637
+ return /* @__PURE__ */ React16.createElement(ControlActions, null, /* @__PURE__ */ React16.createElement(
638
+ import_ui9.TextField,
606
639
  {
607
640
  size: "tiny",
608
641
  multiline: true,
@@ -620,17 +653,17 @@ var TextAreaControl = createControl(({ placeholder, ariaLabel }) => {
620
653
  });
621
654
 
622
655
  // src/controls/size-control.tsx
623
- var React18 = __toESM(require("react"));
624
- var import_react13 = require("react");
656
+ var React21 = __toESM(require("react"));
657
+ var import_react14 = require("react");
625
658
  var import_editor_props7 = require("@elementor/editor-props");
626
659
  var import_editor_responsive = require("@elementor/editor-responsive");
627
- var import_ui13 = require("@elementor/ui");
660
+ var import_ui14 = require("@elementor/ui");
628
661
 
629
662
  // src/components/size-control/size-input.tsx
630
- var React16 = __toESM(require("react"));
631
- var import_react9 = require("react");
663
+ var React19 = __toESM(require("react"));
664
+ var import_react10 = require("react");
632
665
  var import_icons2 = require("@elementor/icons");
633
- var import_ui11 = require("@elementor/ui");
666
+ var import_ui12 = require("@elementor/ui");
634
667
 
635
668
  // src/utils/size-control.ts
636
669
  var lengthUnits = ["px", "%", "em", "rem", "vw", "vh", "ch"];
@@ -644,19 +677,19 @@ function isUnitExtendedOption(unit) {
644
677
  }
645
678
 
646
679
  // src/components/size-control/text-field-inner-selection.tsx
647
- var React15 = __toESM(require("react"));
648
- var import_react8 = require("react");
680
+ var React18 = __toESM(require("react"));
681
+ var import_react9 = require("react");
649
682
  var import_editor_props6 = require("@elementor/editor-props");
650
683
  var import_editor_ui2 = require("@elementor/editor-ui");
651
- var import_ui10 = require("@elementor/ui");
684
+ var import_ui11 = require("@elementor/ui");
652
685
 
653
686
  // src/components/number-input.tsx
654
- var React14 = __toESM(require("react"));
655
- var import_react7 = require("react");
656
- var import_ui9 = require("@elementor/ui");
687
+ var React17 = __toESM(require("react"));
688
+ var import_react8 = require("react");
689
+ var import_ui10 = require("@elementor/ui");
657
690
  var RESTRICTED_INPUT_KEYS = ["e", "E", "+"];
658
- var NumberInput = (0, import_react7.forwardRef)((props, ref) => {
659
- const [key, setKey] = (0, import_react7.useState)(0);
691
+ var NumberInput = (0, import_react8.forwardRef)((props, ref) => {
692
+ const [key, setKey] = (0, import_react8.useState)(0);
660
693
  const handleKeyDown = (event) => {
661
694
  blockRestrictedKeys(event, props.inputProps?.min);
662
695
  props.onKeyDown?.(event);
@@ -668,7 +701,7 @@ var NumberInput = (0, import_react7.forwardRef)((props, ref) => {
668
701
  setKey((prev) => prev + 1);
669
702
  }
670
703
  };
671
- return /* @__PURE__ */ React14.createElement(import_ui9.TextField, { ...props, ref, key, onKeyDown: handleKeyDown, onBlur: handleBlur });
704
+ return /* @__PURE__ */ React17.createElement(import_ui10.TextField, { ...props, ref, key, onKeyDown: handleKeyDown, onBlur: handleBlur });
672
705
  });
673
706
  function blockRestrictedKeys(event, min) {
674
707
  const restrictedInputKeys = [...RESTRICTED_INPUT_KEYS];
@@ -681,7 +714,7 @@ function blockRestrictedKeys(event, min) {
681
714
  }
682
715
 
683
716
  // src/components/size-control/text-field-inner-selection.tsx
684
- var TextFieldInnerSelection = (0, import_react8.forwardRef)(
717
+ var TextFieldInnerSelection = (0, import_react9.forwardRef)(
685
718
  ({
686
719
  placeholder,
687
720
  type,
@@ -700,7 +733,7 @@ var TextFieldInnerSelection = (0, import_react8.forwardRef)(
700
733
  const getCursorStyle = () => ({
701
734
  input: { cursor: InputProps.readOnly ? "default !important" : void 0 }
702
735
  });
703
- return /* @__PURE__ */ React15.createElement(
736
+ return /* @__PURE__ */ React18.createElement(
704
737
  NumberInput,
705
738
  {
706
739
  ref,
@@ -731,9 +764,9 @@ var SelectionEndAdornment = ({
731
764
  menuItemsAttributes = {},
732
765
  disabled
733
766
  }) => {
734
- const popupState = (0, import_ui10.usePopupState)({
767
+ const popupState = (0, import_ui11.usePopupState)({
735
768
  variant: "popover",
736
- popupId: (0, import_react8.useId)()
769
+ popupId: (0, import_react9.useId)()
737
770
  });
738
771
  const handleMenuItemClick = (index) => {
739
772
  onClick(options[index]);
@@ -745,16 +778,16 @@ var SelectionEndAdornment = ({
745
778
  flexDirection: "column",
746
779
  justifyContent: "center"
747
780
  };
748
- return /* @__PURE__ */ React15.createElement(import_ui10.InputAdornment, { position: "end" }, /* @__PURE__ */ React15.createElement(
781
+ return /* @__PURE__ */ React18.createElement(import_ui11.InputAdornment, { position: "end" }, /* @__PURE__ */ React18.createElement(
749
782
  StyledButton,
750
783
  {
751
784
  isPrimaryColor: showPrimaryColor,
752
785
  size: "small",
753
786
  disabled,
754
- ...(0, import_ui10.bindTrigger)(popupState)
787
+ ...(0, import_ui11.bindTrigger)(popupState)
755
788
  },
756
789
  placeholder ?? alternativeOptionLabels[value] ?? value
757
- ), /* @__PURE__ */ React15.createElement(import_ui10.Menu, { MenuListProps: { dense: true }, ...(0, import_ui10.bindMenu)(popupState) }, options.map((option, index) => /* @__PURE__ */ React15.createElement(
790
+ ), /* @__PURE__ */ React18.createElement(import_ui11.Menu, { MenuListProps: { dense: true }, ...(0, import_ui11.bindMenu)(popupState) }, options.map((option, index) => /* @__PURE__ */ React18.createElement(
758
791
  import_editor_ui2.MenuListItem,
759
792
  {
760
793
  key: option,
@@ -794,7 +827,7 @@ function useUnitPlaceholder(value) {
794
827
  showPrimaryColor
795
828
  };
796
829
  }
797
- var StyledButton = (0, import_ui10.styled)(import_ui10.Button, {
830
+ var StyledButton = (0, import_ui11.styled)(import_ui11.Button, {
798
831
  shouldForwardProp: (prop) => prop !== "isPrimaryColor"
799
832
  })(({ isPrimaryColor, theme }) => ({
800
833
  color: isPrimaryColor ? theme.palette.text.primary : theme.palette.text.tertiary,
@@ -822,7 +855,7 @@ var SizeInput = ({
822
855
  id,
823
856
  ariaLabel
824
857
  }) => {
825
- const unitInputBufferRef = (0, import_react9.useRef)("");
858
+ const unitInputBufferRef = (0, import_react10.useRef)("");
826
859
  const inputType = isUnitExtendedOption(unit) ? "text" : "number";
827
860
  const inputValue = !isUnitExtendedOption(unit) && Number.isNaN(size) ? "" : size ?? "";
828
861
  const handleKeyUp = (event) => {
@@ -847,7 +880,7 @@ var SizeInput = ({
847
880
  custom: popupAttributes
848
881
  } : void 0;
849
882
  const alternativeOptionLabels = {
850
- custom: /* @__PURE__ */ React16.createElement(import_icons2.MathFunctionIcon, { fontSize: "tiny" })
883
+ custom: /* @__PURE__ */ React19.createElement(import_icons2.MathFunctionIcon, { fontSize: "tiny" })
851
884
  };
852
885
  const InputProps = {
853
886
  ...popupAttributes,
@@ -855,8 +888,8 @@ var SizeInput = ({
855
888
  autoComplete: "off",
856
889
  onClick,
857
890
  onFocus,
858
- startAdornment: startIcon ? /* @__PURE__ */ React16.createElement(import_ui11.InputAdornment, { position: "start", disabled }, startIcon) : void 0,
859
- endAdornment: /* @__PURE__ */ React16.createElement(
891
+ startAdornment: startIcon ? /* @__PURE__ */ React19.createElement(import_ui12.InputAdornment, { position: "start", disabled }, startIcon) : void 0,
892
+ endAdornment: /* @__PURE__ */ React19.createElement(
860
893
  SelectionEndAdornment,
861
894
  {
862
895
  disabled,
@@ -868,7 +901,7 @@ var SizeInput = ({
868
901
  }
869
902
  )
870
903
  };
871
- return /* @__PURE__ */ React16.createElement(ControlActions, null, /* @__PURE__ */ React16.createElement(import_ui11.Box, null, /* @__PURE__ */ React16.createElement(
904
+ return /* @__PURE__ */ React19.createElement(ControlActions, null, /* @__PURE__ */ React19.createElement(import_ui12.Box, null, /* @__PURE__ */ React19.createElement(
872
905
  TextFieldInnerSelection,
873
906
  {
874
907
  disabled,
@@ -887,17 +920,17 @@ var SizeInput = ({
887
920
  };
888
921
 
889
922
  // src/components/text-field-popover.tsx
890
- var React17 = __toESM(require("react"));
891
- var import_react10 = require("react");
923
+ var React20 = __toESM(require("react"));
924
+ var import_react11 = require("react");
892
925
  var import_editor_ui3 = require("@elementor/editor-ui");
893
926
  var import_icons3 = require("@elementor/icons");
894
- var import_ui12 = require("@elementor/ui");
927
+ var import_ui13 = require("@elementor/ui");
895
928
  var import_i18n3 = require("@wordpress/i18n");
896
929
  var SIZE = "tiny";
897
930
  var TextFieldPopover = (props) => {
898
931
  const { popupState, restoreValue, anchorRef, value, onChange } = props;
899
- const inputRef = (0, import_react10.useRef)(null);
900
- (0, import_react10.useEffect)(() => {
932
+ const inputRef = (0, import_react11.useRef)(null);
933
+ (0, import_react11.useEffect)(() => {
901
934
  if (popupState.isOpen) {
902
935
  requestAnimationFrame(() => {
903
936
  if (inputRef.current) {
@@ -910,8 +943,8 @@ var TextFieldPopover = (props) => {
910
943
  restoreValue();
911
944
  popupState.close();
912
945
  };
913
- return /* @__PURE__ */ React17.createElement(
914
- import_ui12.Popover,
946
+ return /* @__PURE__ */ React20.createElement(
947
+ import_ui13.Popover,
915
948
  {
916
949
  disablePortal: true,
917
950
  slotProps: {
@@ -922,21 +955,21 @@ var TextFieldPopover = (props) => {
922
955
  }
923
956
  }
924
957
  },
925
- ...(0, import_ui12.bindPopover)(popupState),
958
+ ...(0, import_ui13.bindPopover)(popupState),
926
959
  anchorOrigin: { vertical: "bottom", horizontal: "center" },
927
960
  transformOrigin: { vertical: "top", horizontal: "center" },
928
961
  onClose: handleClose
929
962
  },
930
- /* @__PURE__ */ React17.createElement(
963
+ /* @__PURE__ */ React20.createElement(
931
964
  import_editor_ui3.PopoverHeader,
932
965
  {
933
966
  title: (0, import_i18n3.__)("CSS function", "elementor"),
934
967
  onClose: handleClose,
935
- icon: /* @__PURE__ */ React17.createElement(import_icons3.MathFunctionIcon, { fontSize: SIZE })
968
+ icon: /* @__PURE__ */ React20.createElement(import_icons3.MathFunctionIcon, { fontSize: SIZE })
936
969
  }
937
970
  ),
938
- /* @__PURE__ */ React17.createElement(
939
- import_ui12.TextField,
971
+ /* @__PURE__ */ React20.createElement(
972
+ import_ui13.TextField,
940
973
  {
941
974
  value,
942
975
  onChange,
@@ -953,9 +986,9 @@ var TextFieldPopover = (props) => {
953
986
  };
954
987
 
955
988
  // src/hooks/use-size-extended-options.ts
956
- var import_react11 = require("react");
989
+ var import_react12 = require("react");
957
990
  function useSizeExtendedOptions(options, disableCustom) {
958
- return (0, import_react11.useMemo)(() => {
991
+ return (0, import_react12.useMemo)(() => {
959
992
  const extendedOptions = [...options];
960
993
  if (!disableCustom && !extendedOptions.includes("custom")) {
961
994
  extendedOptions.push("custom");
@@ -967,7 +1000,7 @@ function useSizeExtendedOptions(options, disableCustom) {
967
1000
  }
968
1001
 
969
1002
  // src/hooks/use-sync-external-state.tsx
970
- var import_react12 = require("react");
1003
+ var import_react13 = require("react");
971
1004
  var useSyncExternalState = ({
972
1005
  external,
973
1006
  setExternal,
@@ -986,8 +1019,8 @@ var useSyncExternalState = ({
986
1019
  }
987
1020
  return externalValue;
988
1021
  }
989
- const [internal, setInternal] = (0, import_react12.useState)(toInternal(external, null));
990
- (0, import_react12.useEffect)(() => {
1022
+ const [internal, setInternal] = (0, import_react13.useState)(toInternal(external, null));
1023
+ (0, import_react13.useEffect)(() => {
991
1024
  setInternal((prevInternal) => toInternal(external, prevInternal));
992
1025
  }, [external]);
993
1026
  const setInternalValue = (setter, options, meta) => {
@@ -1038,8 +1071,8 @@ var SizeControl = createControl(
1038
1071
  const activeBreakpoint = (0, import_editor_responsive.useActiveBreakpoint)();
1039
1072
  const actualExtendedOptions = useSizeExtendedOptions(extendedOptions || [], disableCustom ?? false);
1040
1073
  const actualUnits = resolveUnits(propType, enablePropTypeUnits, variant, units2, actualExtendedOptions);
1041
- const popupState = (0, import_ui13.usePopupState)({ variant: "popover" });
1042
- const memorizedExternalState = (0, import_react13.useMemo)(
1074
+ const popupState = (0, import_ui14.usePopupState)({ variant: "popover" });
1075
+ const memorizedExternalState = (0, import_react14.useMemo)(
1043
1076
  () => createStateFromSizeProp(sizeValue, actualDefaultUnit),
1044
1077
  [sizeValue, actualDefaultUnit]
1045
1078
  );
@@ -1082,15 +1115,15 @@ var SizeControl = createControl(
1082
1115
  popupState.open(anchorRef?.current);
1083
1116
  }
1084
1117
  };
1085
- const maybeClosePopup = React18.useCallback(() => {
1118
+ const maybeClosePopup = React21.useCallback(() => {
1086
1119
  if (popupState && popupState.isOpen) {
1087
1120
  popupState.close();
1088
1121
  }
1089
1122
  }, [popupState]);
1090
- (0, import_react13.useEffect)(() => {
1123
+ (0, import_react14.useEffect)(() => {
1091
1124
  maybeClosePopup();
1092
1125
  }, [activeBreakpoint]);
1093
- return /* @__PURE__ */ React18.createElement(React18.Fragment, null, /* @__PURE__ */ React18.createElement(
1126
+ return /* @__PURE__ */ React21.createElement(React21.Fragment, null, /* @__PURE__ */ React21.createElement(
1094
1127
  SizeInput,
1095
1128
  {
1096
1129
  disabled,
@@ -1108,7 +1141,7 @@ var SizeControl = createControl(
1108
1141
  id,
1109
1142
  ariaLabel
1110
1143
  }
1111
- ), anchorRef?.current && popupState.isOpen && /* @__PURE__ */ React18.createElement(
1144
+ ), anchorRef?.current && popupState.isOpen && /* @__PURE__ */ React21.createElement(
1112
1145
  TextFieldPopover,
1113
1146
  {
1114
1147
  popupState,
@@ -1167,21 +1200,21 @@ function extractValueFromState(state, allowEmpty = false) {
1167
1200
  }
1168
1201
 
1169
1202
  // src/controls/stroke-control.tsx
1170
- var React21 = __toESM(require("react"));
1171
- var import_react14 = require("react");
1203
+ var React24 = __toESM(require("react"));
1204
+ var import_react15 = require("react");
1172
1205
  var import_editor_props9 = require("@elementor/editor-props");
1173
- var import_ui16 = require("@elementor/ui");
1206
+ var import_ui17 = require("@elementor/ui");
1174
1207
  var import_i18n4 = require("@wordpress/i18n");
1175
1208
 
1176
1209
  // src/components/section-content.tsx
1177
- var React19 = __toESM(require("react"));
1178
- var import_ui14 = require("@elementor/ui");
1179
- var SectionContent = ({ gap = 0.5, sx, children }) => /* @__PURE__ */ React19.createElement(import_ui14.Stack, { gap, sx: { ...sx } }, children);
1210
+ var React22 = __toESM(require("react"));
1211
+ var import_ui15 = require("@elementor/ui");
1212
+ var SectionContent = ({ gap = 0.5, sx, children }) => /* @__PURE__ */ React22.createElement(import_ui15.Stack, { gap, sx: { ...sx } }, children);
1180
1213
 
1181
1214
  // src/controls/color-control.tsx
1182
- var React20 = __toESM(require("react"));
1215
+ var React23 = __toESM(require("react"));
1183
1216
  var import_editor_props8 = require("@elementor/editor-props");
1184
- var import_ui15 = require("@elementor/ui");
1217
+ var import_ui16 = require("@elementor/ui");
1185
1218
  var ColorControl = createControl(
1186
1219
  ({ propTypeUtil = import_editor_props8.colorPropTypeUtil, anchorEl, slotProps = {}, id, ...props }) => {
1187
1220
  const { value, setValue, placeholder: boundPropPlaceholder, disabled } = useBoundProp(propTypeUtil);
@@ -1189,8 +1222,8 @@ var ColorControl = createControl(
1189
1222
  const handleChange = (selectedColor) => {
1190
1223
  setValue(selectedColor || null);
1191
1224
  };
1192
- return /* @__PURE__ */ React20.createElement(ControlActions, null, /* @__PURE__ */ React20.createElement(
1193
- import_ui15.UnstableColorField,
1225
+ return /* @__PURE__ */ React23.createElement(ControlActions, null, /* @__PURE__ */ React23.createElement(
1226
+ import_ui16.UnstableColorField,
1194
1227
  {
1195
1228
  id,
1196
1229
  size: "tiny",
@@ -1231,28 +1264,28 @@ var ColorControl = createControl(
1231
1264
  var units = ["px", "em", "rem"];
1232
1265
  var StrokeControl = createControl(() => {
1233
1266
  const propContext = useBoundProp(import_editor_props9.strokePropTypeUtil);
1234
- const rowRef = (0, import_react14.useRef)(null);
1235
- return /* @__PURE__ */ React21.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React21.createElement(SectionContent, null, /* @__PURE__ */ React21.createElement(Control, { bind: "width", label: (0, import_i18n4.__)("Stroke width", "elementor"), ref: rowRef }, /* @__PURE__ */ React21.createElement(SizeControl, { units, anchorRef: rowRef })), /* @__PURE__ */ React21.createElement(Control, { bind: "color", label: (0, import_i18n4.__)("Stroke color", "elementor") }, /* @__PURE__ */ React21.createElement(ColorControl, null))));
1267
+ const rowRef = (0, import_react15.useRef)(null);
1268
+ return /* @__PURE__ */ React24.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React24.createElement(SectionContent, null, /* @__PURE__ */ React24.createElement(Control, { bind: "width", label: (0, import_i18n4.__)("Stroke width", "elementor"), ref: rowRef }, /* @__PURE__ */ React24.createElement(SizeControl, { units, anchorRef: rowRef })), /* @__PURE__ */ React24.createElement(Control, { bind: "color", label: (0, import_i18n4.__)("Stroke color", "elementor") }, /* @__PURE__ */ React24.createElement(ColorControl, null))));
1236
1269
  });
1237
- var Control = (0, import_react14.forwardRef)(({ bind, label, children }, ref) => /* @__PURE__ */ React21.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React21.createElement(import_ui16.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap", ref }, /* @__PURE__ */ React21.createElement(import_ui16.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React21.createElement(ControlFormLabel, null, label)), /* @__PURE__ */ React21.createElement(import_ui16.Grid, { item: true, xs: 6 }, children))));
1270
+ var Control = (0, import_react15.forwardRef)(({ bind, label, children }, ref) => /* @__PURE__ */ React24.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React24.createElement(import_ui17.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap", ref }, /* @__PURE__ */ React24.createElement(import_ui17.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React24.createElement(ControlFormLabel, null, label)), /* @__PURE__ */ React24.createElement(import_ui17.Grid, { item: true, xs: 6 }, children))));
1238
1271
 
1239
1272
  // src/controls/box-shadow-repeater-control.tsx
1240
- var React39 = __toESM(require("react"));
1273
+ var React40 = __toESM(require("react"));
1241
1274
  var import_react22 = require("react");
1242
1275
  var import_editor_props10 = require("@elementor/editor-props");
1243
- var import_ui30 = require("@elementor/ui");
1276
+ var import_ui31 = require("@elementor/ui");
1244
1277
  var import_i18n11 = require("@wordpress/i18n");
1245
1278
 
1246
1279
  // src/components/control-repeater/actions/tooltip-add-item-action.tsx
1247
- var React23 = __toESM(require("react"));
1280
+ var React26 = __toESM(require("react"));
1248
1281
  var import_icons4 = require("@elementor/icons");
1249
- var import_ui18 = require("@elementor/ui");
1282
+ var import_ui19 = require("@elementor/ui");
1250
1283
  var import_i18n5 = require("@wordpress/i18n");
1251
1284
 
1252
1285
  // src/components/control-repeater/context/repeater-context.tsx
1253
- var React22 = __toESM(require("react"));
1254
- var import_react16 = require("react");
1255
- var import_ui17 = require("@elementor/ui");
1286
+ var React25 = __toESM(require("react"));
1287
+ var import_react17 = require("react");
1288
+ var import_ui18 = require("@elementor/ui");
1256
1289
 
1257
1290
  // src/services/event-bus.ts
1258
1291
  var EventBus = class {
@@ -1289,18 +1322,18 @@ var EventBus = class {
1289
1322
  var eventBus = new EventBus();
1290
1323
 
1291
1324
  // src/components/control-repeater/context/item-context.tsx
1292
- var import_react15 = require("react");
1293
- var ItemContext = (0, import_react15.createContext)({
1325
+ var import_react16 = require("react");
1326
+ var ItemContext = (0, import_react16.createContext)({
1294
1327
  index: -1,
1295
1328
  value: {}
1296
1329
  });
1297
1330
 
1298
1331
  // src/components/control-repeater/context/repeater-context.tsx
1299
- var RepeaterContext = (0, import_react16.createContext)(null);
1332
+ var RepeaterContext = (0, import_react17.createContext)(null);
1300
1333
  var EMPTY_OPEN_ITEM = -1;
1301
1334
  var useRepeaterContext = () => {
1302
- const context = React22.useContext(RepeaterContext);
1303
- const itemContext = React22.useContext(ItemContext);
1335
+ const context = React25.useContext(RepeaterContext);
1336
+ const itemContext = React25.useContext(ItemContext);
1304
1337
  if (!context) {
1305
1338
  throw new Error("useRepeaterContext must be used within a RepeaterContextProvider");
1306
1339
  }
@@ -1319,10 +1352,10 @@ var RepeaterContextProvider = ({
1319
1352
  setExternal: setRepeaterValues,
1320
1353
  persistWhen: () => true
1321
1354
  });
1322
- const [uniqueKeys, setUniqueKeys] = (0, import_react16.useState)(() => {
1355
+ const [uniqueKeys, setUniqueKeys] = (0, import_react17.useState)(() => {
1323
1356
  return items2?.map((_, index) => index) ?? [];
1324
1357
  });
1325
- const itemsWithKeys = (0, import_react16.useMemo)(
1358
+ const itemsWithKeys = (0, import_react17.useMemo)(
1326
1359
  () => uniqueKeys.map((key, index) => ({
1327
1360
  key,
1328
1361
  item: items2[index]
@@ -1332,10 +1365,10 @@ var RepeaterContextProvider = ({
1332
1365
  const handleSetItems = (newItemsWithKeys) => {
1333
1366
  setItems(newItemsWithKeys.map(({ item }) => item));
1334
1367
  };
1335
- const [openItemIndex, setOpenItemIndex] = (0, import_react16.useState)(EMPTY_OPEN_ITEM);
1336
- const [rowRef, setRowRef] = (0, import_react16.useState)(null);
1368
+ const [openItemIndex, setOpenItemIndex] = (0, import_react17.useState)(EMPTY_OPEN_ITEM);
1369
+ const [rowRef, setRowRef] = (0, import_react17.useState)(null);
1337
1370
  const isOpen = openItemIndex !== EMPTY_OPEN_ITEM;
1338
- const popoverState = (0, import_ui17.usePopupState)({ variant: "popover" });
1371
+ const popoverState = (0, import_ui18.usePopupState)({ variant: "popover" });
1339
1372
  const addItem = (ev, config) => {
1340
1373
  const item = config?.item ?? { ...initial };
1341
1374
  const newIndex = config?.index ?? items2.length;
@@ -1362,7 +1395,7 @@ var RepeaterContextProvider = ({
1362
1395
  const newItems = [...items2.slice(0, index), updatedItem, ...items2.slice(index + 1)];
1363
1396
  setItems(newItems);
1364
1397
  };
1365
- return /* @__PURE__ */ React22.createElement(
1398
+ return /* @__PURE__ */ React25.createElement(
1366
1399
  RepeaterContext.Provider,
1367
1400
  {
1368
1401
  value: {
@@ -1399,37 +1432,37 @@ var TooltipAddItemAction = ({
1399
1432
  }) => {
1400
1433
  const { addItem } = useRepeaterContext();
1401
1434
  const onClick = (ev) => addItem(ev, { index: newItemIndex });
1402
- return /* @__PURE__ */ React23.createElement(ConditionalToolTip, { content: tooltipContent, enable: enableTooltip }, /* @__PURE__ */ React23.createElement(import_ui18.Box, { component: "span", sx: { cursor: disabled ? "not-allowed" : "pointer" } }, /* @__PURE__ */ React23.createElement(
1403
- import_ui18.IconButton,
1435
+ return /* @__PURE__ */ React26.createElement(ConditionalToolTip, { content: tooltipContent, enable: enableTooltip }, /* @__PURE__ */ React26.createElement(import_ui19.Box, { component: "span", sx: { cursor: disabled ? "not-allowed" : "pointer" } }, /* @__PURE__ */ React26.createElement(
1436
+ import_ui19.IconButton,
1404
1437
  {
1405
1438
  size: SIZE2,
1406
1439
  disabled,
1407
1440
  onClick,
1408
1441
  "aria-label": (0, import_i18n5.sprintf)((0, import_i18n5.__)("Add %s item", "elementor"), ariaLabel?.toLowerCase())
1409
1442
  },
1410
- /* @__PURE__ */ React23.createElement(import_icons4.PlusIcon, { fontSize: SIZE2 })
1443
+ /* @__PURE__ */ React26.createElement(import_icons4.PlusIcon, { fontSize: SIZE2 })
1411
1444
  )));
1412
1445
  };
1413
1446
  var ConditionalToolTip = ({
1414
1447
  children,
1415
1448
  enable,
1416
1449
  content
1417
- }) => enable && content ? /* @__PURE__ */ React23.createElement(import_ui18.Infotip, { placement: "right", color: "secondary", content }, children) : children;
1450
+ }) => enable && content ? /* @__PURE__ */ React26.createElement(import_ui19.Infotip, { placement: "right", color: "secondary", content }, children) : children;
1418
1451
 
1419
1452
  // src/components/control-repeater/items/items-container.tsx
1420
- var React25 = __toESM(require("react"));
1453
+ var React28 = __toESM(require("react"));
1421
1454
 
1422
1455
  // src/components/repeater/sortable.tsx
1423
- var React24 = __toESM(require("react"));
1456
+ var React27 = __toESM(require("react"));
1424
1457
  var import_icons5 = require("@elementor/icons");
1425
- var import_ui19 = require("@elementor/ui");
1458
+ var import_ui20 = require("@elementor/ui");
1426
1459
  var import_i18n6 = require("@wordpress/i18n");
1427
1460
  var SortableProvider = (props) => {
1428
- return /* @__PURE__ */ React24.createElement(import_ui19.List, { sx: { p: 0, my: -0.5, mx: 0 } }, /* @__PURE__ */ React24.createElement(import_ui19.UnstableSortableProvider, { restrictAxis: true, disableDragOverlay: false, variant: "static", ...props }));
1461
+ return /* @__PURE__ */ React27.createElement(import_ui20.List, { sx: { p: 0, my: -0.5, mx: 0 } }, /* @__PURE__ */ React27.createElement(import_ui20.UnstableSortableProvider, { restrictAxis: true, disableDragOverlay: false, variant: "static", ...props }));
1429
1462
  };
1430
1463
  var SortableItem = ({ id, children, disabled }) => {
1431
- return /* @__PURE__ */ React24.createElement(
1432
- import_ui19.UnstableSortableItem,
1464
+ return /* @__PURE__ */ React27.createElement(
1465
+ import_ui20.UnstableSortableItem,
1433
1466
  {
1434
1467
  id,
1435
1468
  disabled,
@@ -1441,12 +1474,12 @@ var SortableItem = ({ id, children, disabled }) => {
1441
1474
  showDropIndication,
1442
1475
  dropIndicationStyle
1443
1476
  }) => {
1444
- return /* @__PURE__ */ React24.createElement(StyledListItem, { ...itemProps, style: itemStyle, tabIndex: -1 }, !disabled && /* @__PURE__ */ React24.createElement(SortableTrigger, { ...triggerProps, style: triggerStyle }), children, showDropIndication && /* @__PURE__ */ React24.createElement(StyledDivider, { style: dropIndicationStyle }));
1477
+ return /* @__PURE__ */ React27.createElement(StyledListItem, { ...itemProps, style: itemStyle, tabIndex: -1 }, !disabled && /* @__PURE__ */ React27.createElement(SortableTrigger, { ...triggerProps, style: triggerStyle }), children, showDropIndication && /* @__PURE__ */ React27.createElement(StyledDivider, { style: dropIndicationStyle }));
1445
1478
  }
1446
1479
  }
1447
1480
  );
1448
1481
  };
1449
- var StyledListItem = (0, import_ui19.styled)(import_ui19.ListItem)`
1482
+ var StyledListItem = (0, import_ui20.styled)(import_ui20.ListItem)`
1450
1483
  position: relative;
1451
1484
  margin-inline: 0px;
1452
1485
  padding-inline: 0px;
@@ -1476,7 +1509,7 @@ var StyledListItem = (0, import_ui19.styled)(import_ui19.ListItem)`
1476
1509
  }
1477
1510
  }
1478
1511
  `;
1479
- var SortableTrigger = (props) => /* @__PURE__ */ React24.createElement(
1512
+ var SortableTrigger = (props) => /* @__PURE__ */ React27.createElement(
1480
1513
  "div",
1481
1514
  {
1482
1515
  ...props,
@@ -1485,9 +1518,9 @@ var SortableTrigger = (props) => /* @__PURE__ */ React24.createElement(
1485
1518
  tabIndex: 0,
1486
1519
  "aria-label": (0, import_i18n6.__)("Drag item", "elementor")
1487
1520
  },
1488
- /* @__PURE__ */ React24.createElement(import_icons5.GripVerticalIcon, { fontSize: "tiny" })
1521
+ /* @__PURE__ */ React27.createElement(import_icons5.GripVerticalIcon, { fontSize: "tiny" })
1489
1522
  );
1490
- var StyledDivider = (0, import_ui19.styled)(import_ui19.Divider)`
1523
+ var StyledDivider = (0, import_ui20.styled)(import_ui20.Divider)`
1491
1524
  height: 0px;
1492
1525
  border: none;
1493
1526
  overflow: visible;
@@ -1522,22 +1555,22 @@ var ItemsContainer = ({
1522
1555
  })
1523
1556
  );
1524
1557
  };
1525
- return /* @__PURE__ */ React25.createElement(React25.Fragment, null, /* @__PURE__ */ React25.createElement(SortableProvider, { value: keys, onChange: onChangeOrder }, keys.map((key, index) => {
1558
+ return /* @__PURE__ */ React28.createElement(React28.Fragment, null, /* @__PURE__ */ React28.createElement(SortableProvider, { value: keys, onChange: onChangeOrder }, keys.map((key, index) => {
1526
1559
  const value = items2[index].item;
1527
- return /* @__PURE__ */ React25.createElement(SortableItem, { id: key, key: `sortable-${key}`, disabled: !isSortable }, /* @__PURE__ */ React25.createElement(ItemContext.Provider, { value: { index, value } }, children));
1560
+ return /* @__PURE__ */ React28.createElement(SortableItem, { id: key, key: `sortable-${key}`, disabled: !isSortable }, /* @__PURE__ */ React28.createElement(ItemContext.Provider, { value: { index, value } }, children));
1528
1561
  })));
1529
1562
  };
1530
1563
 
1531
1564
  // src/components/control-repeater/items/item.tsx
1532
- var React27 = __toESM(require("react"));
1533
- var import_ui21 = require("@elementor/ui");
1565
+ var React30 = __toESM(require("react"));
1566
+ var import_ui22 = require("@elementor/ui");
1534
1567
  var import_i18n7 = require("@wordpress/i18n");
1535
1568
 
1536
1569
  // src/hooks/use-repeatable-control-context.ts
1537
- var import_react17 = require("react");
1538
- var RepeatableControlContext = (0, import_react17.createContext)(void 0);
1570
+ var import_react18 = require("react");
1571
+ var RepeatableControlContext = (0, import_react18.createContext)(void 0);
1539
1572
  var useRepeatableControlContext = () => {
1540
- const context = (0, import_react17.useContext)(RepeatableControlContext);
1573
+ const context = (0, import_react18.useContext)(RepeatableControlContext);
1541
1574
  if (!context) {
1542
1575
  throw new Error("useRepeatableControlContext must be used within RepeatableControl");
1543
1576
  }
@@ -1545,12 +1578,12 @@ var useRepeatableControlContext = () => {
1545
1578
  };
1546
1579
 
1547
1580
  // src/components/repeater/repeater-tag.tsx
1548
- var React26 = __toESM(require("react"));
1549
- var import_react18 = require("react");
1550
- var import_ui20 = require("@elementor/ui");
1551
- var RepeaterTag = (0, import_react18.forwardRef)((props, ref) => {
1552
- return /* @__PURE__ */ React26.createElement(
1553
- import_ui20.UnstableTag,
1581
+ var React29 = __toESM(require("react"));
1582
+ var import_react19 = require("react");
1583
+ var import_ui21 = require("@elementor/ui");
1584
+ var RepeaterTag = (0, import_react19.forwardRef)((props, ref) => {
1585
+ return /* @__PURE__ */ React29.createElement(
1586
+ import_ui21.UnstableTag,
1554
1587
  {
1555
1588
  ref,
1556
1589
  fullWidth: true,
@@ -1579,9 +1612,9 @@ var Item = ({ Label: Label3, Icon, actions }) => {
1579
1612
  value,
1580
1613
  isItemDisabled: isItemDisabled2
1581
1614
  } = useRepeaterContext();
1582
- const repeatableContext = React27.useContext(RepeatableControlContext);
1615
+ const repeatableContext = React30.useContext(RepeatableControlContext);
1583
1616
  const disableOpen = !!repeatableContext?.props?.readOnly;
1584
- const triggerProps = (0, import_ui21.bindTrigger)(popoverState);
1617
+ const triggerProps = (0, import_ui22.bindTrigger)(popoverState);
1585
1618
  const onClick = (ev) => {
1586
1619
  if (disableOpen || isItemDisabled2(index)) {
1587
1620
  return;
@@ -1596,15 +1629,15 @@ var Item = ({ Label: Label3, Icon, actions }) => {
1596
1629
  setRowRef(ref);
1597
1630
  popoverState.setAnchorEl(ref);
1598
1631
  };
1599
- return /* @__PURE__ */ React27.createElement(
1632
+ return /* @__PURE__ */ React30.createElement(
1600
1633
  RepeaterTag,
1601
1634
  {
1602
1635
  ref: setRef,
1603
- label: /* @__PURE__ */ React27.createElement(RepeaterItemLabelSlot, { value }, /* @__PURE__ */ React27.createElement(Label3, { value })),
1636
+ label: /* @__PURE__ */ React30.createElement(RepeaterItemLabelSlot, { value }, /* @__PURE__ */ React30.createElement(Label3, { value })),
1604
1637
  "aria-label": (0, import_i18n7.__)("Open item", "elementor"),
1605
1638
  ...triggerProps,
1606
1639
  onClick,
1607
- startIcon: /* @__PURE__ */ React27.createElement(RepeaterItemIconSlot, { value }, /* @__PURE__ */ React27.createElement(Icon, { value })),
1640
+ startIcon: /* @__PURE__ */ React30.createElement(RepeaterItemIconSlot, { value }, /* @__PURE__ */ React30.createElement(Icon, { value })),
1608
1641
  sx: {
1609
1642
  minHeight: (theme) => theme.spacing(3.5),
1610
1643
  ...isItemDisabled2(index) && {
@@ -1613,20 +1646,20 @@ var Item = ({ Label: Label3, Icon, actions }) => {
1613
1646
  }
1614
1647
  }
1615
1648
  },
1616
- actions: /* @__PURE__ */ React27.createElement(React27.Fragment, null, /* @__PURE__ */ React27.createElement(RepeaterItemActionsSlot, { index: index ?? -1 }), actions)
1649
+ actions: /* @__PURE__ */ React30.createElement(React30.Fragment, null, /* @__PURE__ */ React30.createElement(RepeaterItemActionsSlot, { index: index ?? -1 }), actions)
1617
1650
  }
1618
1651
  );
1619
1652
  };
1620
1653
 
1621
1654
  // src/components/control-repeater/control-repeater.tsx
1622
- var React28 = __toESM(require("react"));
1655
+ var React31 = __toESM(require("react"));
1623
1656
  var ControlRepeater = ({
1624
1657
  children,
1625
1658
  initial,
1626
1659
  propTypeUtil,
1627
1660
  isItemDisabled: isItemDisabled2
1628
1661
  }) => {
1629
- return /* @__PURE__ */ React28.createElement(SectionContent, null, /* @__PURE__ */ React28.createElement(
1662
+ return /* @__PURE__ */ React31.createElement(SectionContent, null, /* @__PURE__ */ React31.createElement(
1630
1663
  RepeaterContextProvider,
1631
1664
  {
1632
1665
  initial,
@@ -1638,9 +1671,9 @@ var ControlRepeater = ({
1638
1671
  };
1639
1672
 
1640
1673
  // src/components/control-repeater/actions/disable-item-action.tsx
1641
- var React29 = __toESM(require("react"));
1674
+ var React32 = __toESM(require("react"));
1642
1675
  var import_icons6 = require("@elementor/icons");
1643
- var import_ui22 = require("@elementor/ui");
1676
+ var import_ui23 = require("@elementor/ui");
1644
1677
  var import_i18n8 = require("@wordpress/i18n");
1645
1678
  var SIZE3 = "tiny";
1646
1679
  var DisableItemAction = () => {
@@ -1658,13 +1691,13 @@ var DisableItemAction = () => {
1658
1691
  }
1659
1692
  updateItem(self, index);
1660
1693
  };
1661
- return /* @__PURE__ */ React29.createElement(import_ui22.Tooltip, { title: toggleLabel, placement: "top" }, /* @__PURE__ */ React29.createElement(import_ui22.IconButton, { size: SIZE3, onClick, "aria-label": toggleLabel }, propDisabled ? /* @__PURE__ */ React29.createElement(import_icons6.EyeOffIcon, { fontSize: SIZE3 }) : /* @__PURE__ */ React29.createElement(import_icons6.EyeIcon, { fontSize: SIZE3 })));
1694
+ return /* @__PURE__ */ React32.createElement(import_ui23.Tooltip, { title: toggleLabel, placement: "top" }, /* @__PURE__ */ React32.createElement(import_ui23.IconButton, { size: SIZE3, onClick, "aria-label": toggleLabel }, propDisabled ? /* @__PURE__ */ React32.createElement(import_icons6.EyeOffIcon, { fontSize: SIZE3 }) : /* @__PURE__ */ React32.createElement(import_icons6.EyeIcon, { fontSize: SIZE3 })));
1662
1695
  };
1663
1696
 
1664
1697
  // src/components/control-repeater/actions/duplicate-item-action.tsx
1665
- var React30 = __toESM(require("react"));
1698
+ var React33 = __toESM(require("react"));
1666
1699
  var import_icons7 = require("@elementor/icons");
1667
- var import_ui23 = require("@elementor/ui");
1700
+ var import_ui24 = require("@elementor/ui");
1668
1701
  var import_i18n9 = require("@wordpress/i18n");
1669
1702
  var SIZE4 = "tiny";
1670
1703
  var DuplicateItemAction = () => {
@@ -1678,22 +1711,22 @@ var DuplicateItemAction = () => {
1678
1711
  const newItem = structuredClone(item);
1679
1712
  addItem(ev, { item: newItem, index: index + 1 });
1680
1713
  };
1681
- return /* @__PURE__ */ React30.createElement(import_ui23.Tooltip, { title: duplicateLabel, placement: "top" }, /* @__PURE__ */ React30.createElement(
1682
- import_ui23.IconButton,
1714
+ return /* @__PURE__ */ React33.createElement(import_ui24.Tooltip, { title: duplicateLabel, placement: "top" }, /* @__PURE__ */ React33.createElement(
1715
+ import_ui24.IconButton,
1683
1716
  {
1684
1717
  size: SIZE4,
1685
1718
  onClick,
1686
1719
  "aria-label": duplicateLabel,
1687
1720
  disabled: isItemDisabled2(index)
1688
1721
  },
1689
- /* @__PURE__ */ React30.createElement(import_icons7.CopyIcon, { fontSize: SIZE4 })
1722
+ /* @__PURE__ */ React33.createElement(import_icons7.CopyIcon, { fontSize: SIZE4 })
1690
1723
  ));
1691
1724
  };
1692
1725
 
1693
1726
  // src/components/control-repeater/actions/remove-item-action.tsx
1694
- var React31 = __toESM(require("react"));
1727
+ var React34 = __toESM(require("react"));
1695
1728
  var import_icons8 = require("@elementor/icons");
1696
- var import_ui24 = require("@elementor/ui");
1729
+ var import_ui25 = require("@elementor/ui");
1697
1730
  var import_i18n10 = require("@wordpress/i18n");
1698
1731
  var SIZE5 = "tiny";
1699
1732
  var RemoveItemAction = () => {
@@ -1703,19 +1736,19 @@ var RemoveItemAction = () => {
1703
1736
  }
1704
1737
  const removeLabel = (0, import_i18n10.__)("Remove", "elementor");
1705
1738
  const onClick = () => removeItem(index);
1706
- return /* @__PURE__ */ React31.createElement(import_ui24.Tooltip, { title: removeLabel, placement: "top" }, /* @__PURE__ */ React31.createElement(import_ui24.IconButton, { size: SIZE5, onClick, "aria-label": removeLabel }, /* @__PURE__ */ React31.createElement(import_icons8.XIcon, { fontSize: SIZE5 })));
1739
+ return /* @__PURE__ */ React34.createElement(import_ui25.Tooltip, { title: removeLabel, placement: "top" }, /* @__PURE__ */ React34.createElement(import_ui25.IconButton, { size: SIZE5, onClick, "aria-label": removeLabel }, /* @__PURE__ */ React34.createElement(import_icons8.XIcon, { fontSize: SIZE5 })));
1707
1740
  };
1708
1741
 
1709
1742
  // src/components/control-repeater/items/edit-item-popover.tsx
1710
- var React33 = __toESM(require("react"));
1711
- var import_ui26 = require("@elementor/ui");
1743
+ var React36 = __toESM(require("react"));
1744
+ var import_ui27 = require("@elementor/ui");
1712
1745
 
1713
1746
  // src/components/repeater/repeater-popover.tsx
1714
- var React32 = __toESM(require("react"));
1715
- var import_ui25 = require("@elementor/ui");
1747
+ var React35 = __toESM(require("react"));
1748
+ var import_ui26 = require("@elementor/ui");
1716
1749
  var RepeaterPopover = ({ children, width, ...props }) => {
1717
- return /* @__PURE__ */ React32.createElement(
1718
- import_ui25.Popover,
1750
+ return /* @__PURE__ */ React35.createElement(
1751
+ import_ui26.Popover,
1719
1752
  {
1720
1753
  disablePortal: true,
1721
1754
  anchorOrigin: { vertical: "bottom", horizontal: "left" },
@@ -1741,60 +1774,34 @@ var EditItemPopover = ({ children }) => {
1741
1774
  popoverState.setAnchorEl(null);
1742
1775
  setOpenItemIndex(EMPTY_OPEN_ITEM);
1743
1776
  };
1744
- return /* @__PURE__ */ React33.createElement(RepeaterPopover, { width: rowRef.offsetWidth, ...(0, import_ui26.bindPopover)(popoverState), onClose }, /* @__PURE__ */ React33.createElement(PropKeyProvider, { bind: String(openItemIndex) }, /* @__PURE__ */ React33.createElement(import_ui26.Box, null, children)));
1777
+ return /* @__PURE__ */ React36.createElement(RepeaterPopover, { width: rowRef.offsetWidth, ...(0, import_ui27.bindPopover)(popoverState), onClose }, /* @__PURE__ */ React36.createElement(PropKeyProvider, { bind: String(openItemIndex) }, /* @__PURE__ */ React36.createElement(import_ui27.Box, null, children)));
1745
1778
  };
1746
1779
 
1747
1780
  // src/components/popover-content.tsx
1748
- var React34 = __toESM(require("react"));
1749
- var import_ui27 = require("@elementor/ui");
1750
- var PopoverContent = ({ gap = 1.5, children, ...props }) => /* @__PURE__ */ React34.createElement(import_ui27.Stack, { ...props, gap }, children);
1751
-
1752
- // src/components/popover-grid-container.tsx
1753
- var import_react19 = require("react");
1754
- var React35 = __toESM(require("react"));
1781
+ var React37 = __toESM(require("react"));
1755
1782
  var import_ui28 = require("@elementor/ui");
1756
- var PopoverGridContainer = (0, import_react19.forwardRef)(
1757
- ({ gap = 1.5, alignItems = "center", flexWrap = "nowrap", children }, ref) => /* @__PURE__ */ React35.createElement(import_ui28.Grid, { container: true, gap, alignItems, flexWrap, ref }, children)
1758
- );
1783
+ var PopoverContent = ({ gap = 1.5, children, ...props }) => /* @__PURE__ */ React37.createElement(import_ui28.Stack, { ...props, gap }, children);
1759
1784
 
1760
- // src/components/repeater/repeater-header.tsx
1785
+ // src/components/popover-grid-container.tsx
1786
+ var import_react20 = require("react");
1761
1787
  var React38 = __toESM(require("react"));
1762
- var import_react21 = require("react");
1763
1788
  var import_ui29 = require("@elementor/ui");
1764
-
1765
- // src/control-adornments/control-adornments.tsx
1766
- var React37 = __toESM(require("react"));
1767
-
1768
- // src/control-adornments/control-adornments-context.tsx
1769
- var React36 = __toESM(require("react"));
1770
- var import_react20 = require("react");
1771
- var Context2 = (0, import_react20.createContext)(null);
1772
- var ControlAdornmentsProvider = ({ children, items: items2 }) => /* @__PURE__ */ React36.createElement(Context2.Provider, { value: { items: items2 } }, children);
1773
- var useControlAdornments = () => {
1774
- const context = (0, import_react20.useContext)(Context2);
1775
- return context?.items ?? [];
1776
- };
1777
-
1778
- // src/control-adornments/control-adornments.tsx
1779
- function ControlAdornments({
1780
- customContext
1781
- }) {
1782
- const items2 = useControlAdornments();
1783
- if (items2?.length === 0) {
1784
- return null;
1785
- }
1786
- return /* @__PURE__ */ React37.createElement(React37.Fragment, null, items2.map(({ Adornment, id }) => /* @__PURE__ */ React37.createElement(Adornment, { key: id, customContext })));
1787
- }
1789
+ var PopoverGridContainer = (0, import_react20.forwardRef)(
1790
+ ({ gap = 1.5, alignItems = "center", flexWrap = "nowrap", children }, ref) => /* @__PURE__ */ React38.createElement(import_ui29.Grid, { container: true, gap, alignItems, flexWrap, ref }, children)
1791
+ );
1788
1792
 
1789
1793
  // src/components/repeater/repeater-header.tsx
1794
+ var React39 = __toESM(require("react"));
1795
+ var import_react21 = require("react");
1796
+ var import_ui30 = require("@elementor/ui");
1790
1797
  var RepeaterHeader = (0, import_react21.forwardRef)(
1791
1798
  ({
1792
1799
  label,
1793
1800
  children,
1794
1801
  adornment: Adornment = ControlAdornments
1795
1802
  }, ref) => {
1796
- return /* @__PURE__ */ React38.createElement(
1797
- import_ui29.Stack,
1803
+ return /* @__PURE__ */ React39.createElement(
1804
+ import_ui30.Stack,
1798
1805
  {
1799
1806
  direction: "row",
1800
1807
  alignItems: "center",
@@ -1802,7 +1809,7 @@ var RepeaterHeader = (0, import_react21.forwardRef)(
1802
1809
  sx: { marginInlineEnd: -0.75, py: 0.25 },
1803
1810
  ref
1804
1811
  },
1805
- /* @__PURE__ */ React38.createElement(import_ui29.Box, { display: "flex", alignItems: "center", gap: 1, sx: { flexGrow: 1 } }, /* @__PURE__ */ React38.createElement(import_ui29.Typography, { component: "label", variant: "caption", color: "text.secondary", sx: { lineHeight: 1 } }, label), /* @__PURE__ */ React38.createElement(Adornment, null)),
1812
+ /* @__PURE__ */ React39.createElement(import_ui30.Box, { display: "flex", alignItems: "center", gap: 1, sx: { flexGrow: 1 } }, /* @__PURE__ */ React39.createElement(import_ui30.Typography, { component: "label", variant: "caption", color: "text.secondary", sx: { lineHeight: 1 } }, label), /* @__PURE__ */ React39.createElement(Adornment, null)),
1806
1813
  children
1807
1814
  );
1808
1815
  }
@@ -1811,26 +1818,26 @@ var RepeaterHeader = (0, import_react21.forwardRef)(
1811
1818
  // src/controls/box-shadow-repeater-control.tsx
1812
1819
  var BoxShadowRepeaterControl = createControl(() => {
1813
1820
  const { propType, value, setValue, disabled } = useBoundProp(import_editor_props10.boxShadowPropTypeUtil);
1814
- return /* @__PURE__ */ React39.createElement(PropProvider, { propType, value, setValue, isDisabled: () => disabled }, /* @__PURE__ */ React39.createElement(ControlRepeater, { initial: initialShadow, propTypeUtil: import_editor_props10.boxShadowPropTypeUtil }, /* @__PURE__ */ React39.createElement(RepeaterHeader, { label: (0, import_i18n11.__)("Box shadow", "elementor") }, /* @__PURE__ */ React39.createElement(TooltipAddItemAction, { newItemIndex: 0, disabled, ariaLabel: "Box shadow" })), /* @__PURE__ */ React39.createElement(ItemsContainer, null, /* @__PURE__ */ React39.createElement(
1821
+ return /* @__PURE__ */ React40.createElement(PropProvider, { propType, value, setValue, isDisabled: () => disabled }, /* @__PURE__ */ React40.createElement(ControlRepeater, { initial: initialShadow, propTypeUtil: import_editor_props10.boxShadowPropTypeUtil }, /* @__PURE__ */ React40.createElement(RepeaterHeader, { label: (0, import_i18n11.__)("Box shadow", "elementor") }, /* @__PURE__ */ React40.createElement(TooltipAddItemAction, { newItemIndex: 0, disabled, ariaLabel: "Box shadow" })), /* @__PURE__ */ React40.createElement(ItemsContainer, null, /* @__PURE__ */ React40.createElement(
1815
1822
  Item,
1816
1823
  {
1817
1824
  Icon: ItemIcon,
1818
1825
  Label: ItemLabel,
1819
- actions: /* @__PURE__ */ React39.createElement(React39.Fragment, null, /* @__PURE__ */ React39.createElement(DuplicateItemAction, null), /* @__PURE__ */ React39.createElement(DisableItemAction, null), /* @__PURE__ */ React39.createElement(RemoveItemAction, null))
1826
+ actions: /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement(DuplicateItemAction, null), /* @__PURE__ */ React40.createElement(DisableItemAction, null), /* @__PURE__ */ React40.createElement(RemoveItemAction, null))
1820
1827
  }
1821
- )), /* @__PURE__ */ React39.createElement(EditItemPopover, null, /* @__PURE__ */ React39.createElement(Content, null))));
1828
+ )), /* @__PURE__ */ React40.createElement(EditItemPopover, null, /* @__PURE__ */ React40.createElement(Content, null))));
1822
1829
  });
1823
- var StyledUnstableColorIndicator = (0, import_ui30.styled)(import_ui30.UnstableColorIndicator)(({ theme }) => ({
1830
+ var StyledUnstableColorIndicator = (0, import_ui31.styled)(import_ui31.UnstableColorIndicator)(({ theme }) => ({
1824
1831
  height: "1rem",
1825
1832
  width: "1rem",
1826
1833
  borderRadius: `${theme.shape.borderRadius / 2}px`
1827
1834
  }));
1828
- var ItemIcon = ({ value }) => /* @__PURE__ */ React39.createElement(StyledUnstableColorIndicator, { size: "inherit", component: "span", value: value.value.color?.value });
1835
+ var ItemIcon = ({ value }) => /* @__PURE__ */ React40.createElement(StyledUnstableColorIndicator, { size: "inherit", component: "span", value: value.value.color?.value });
1829
1836
  var Content = () => {
1830
1837
  const context = useBoundProp(import_editor_props10.shadowPropTypeUtil);
1831
1838
  const rowRef = [(0, import_react22.useRef)(null), (0, import_react22.useRef)(null)];
1832
1839
  const { rowRef: anchorEl } = useRepeaterContext();
1833
- return /* @__PURE__ */ React39.createElement(PropProvider, { ...context }, /* @__PURE__ */ React39.createElement(PopoverContent, { p: 1.5 }, /* @__PURE__ */ React39.createElement(PopoverGridContainer, null, /* @__PURE__ */ React39.createElement(Control2, { bind: "color", label: (0, import_i18n11.__)("Color", "elementor") }, /* @__PURE__ */ React39.createElement(ColorControl, { anchorEl })), /* @__PURE__ */ React39.createElement(Control2, { bind: "position", label: (0, import_i18n11.__)("Position", "elementor"), sx: { overflow: "hidden" } }, /* @__PURE__ */ React39.createElement(
1840
+ return /* @__PURE__ */ React40.createElement(PropProvider, { ...context }, /* @__PURE__ */ React40.createElement(PopoverContent, { p: 1.5 }, /* @__PURE__ */ React40.createElement(PopoverGridContainer, null, /* @__PURE__ */ React40.createElement(Control2, { bind: "color", label: (0, import_i18n11.__)("Color", "elementor") }, /* @__PURE__ */ React40.createElement(ColorControl, { anchorEl })), /* @__PURE__ */ React40.createElement(Control2, { bind: "position", label: (0, import_i18n11.__)("Position", "elementor"), sx: { overflow: "hidden" } }, /* @__PURE__ */ React40.createElement(
1834
1841
  SelectControl,
1835
1842
  {
1836
1843
  options: [
@@ -1838,14 +1845,14 @@ var Content = () => {
1838
1845
  { label: (0, import_i18n11.__)("Outset", "elementor"), value: null }
1839
1846
  ]
1840
1847
  }
1841
- ))), /* @__PURE__ */ React39.createElement(PopoverGridContainer, { ref: rowRef[0] }, /* @__PURE__ */ React39.createElement(Control2, { bind: "hOffset", label: (0, import_i18n11.__)("Horizontal", "elementor") }, /* @__PURE__ */ React39.createElement(SizeControl, { anchorRef: rowRef[0] })), /* @__PURE__ */ React39.createElement(Control2, { bind: "vOffset", label: (0, import_i18n11.__)("Vertical", "elementor") }, /* @__PURE__ */ React39.createElement(SizeControl, { anchorRef: rowRef[0] }))), /* @__PURE__ */ React39.createElement(PopoverGridContainer, { ref: rowRef[1] }, /* @__PURE__ */ React39.createElement(Control2, { bind: "blur", label: (0, import_i18n11.__)("Blur", "elementor") }, /* @__PURE__ */ React39.createElement(SizeControl, { anchorRef: rowRef[1] })), /* @__PURE__ */ React39.createElement(Control2, { bind: "spread", label: (0, import_i18n11.__)("Spread", "elementor") }, /* @__PURE__ */ React39.createElement(SizeControl, { anchorRef: rowRef[1] })))));
1848
+ ))), /* @__PURE__ */ React40.createElement(PopoverGridContainer, { ref: rowRef[0] }, /* @__PURE__ */ React40.createElement(Control2, { bind: "hOffset", label: (0, import_i18n11.__)("Horizontal", "elementor") }, /* @__PURE__ */ React40.createElement(SizeControl, { anchorRef: rowRef[0] })), /* @__PURE__ */ React40.createElement(Control2, { bind: "vOffset", label: (0, import_i18n11.__)("Vertical", "elementor") }, /* @__PURE__ */ React40.createElement(SizeControl, { anchorRef: rowRef[0] }))), /* @__PURE__ */ React40.createElement(PopoverGridContainer, { ref: rowRef[1] }, /* @__PURE__ */ React40.createElement(Control2, { bind: "blur", label: (0, import_i18n11.__)("Blur", "elementor") }, /* @__PURE__ */ React40.createElement(SizeControl, { anchorRef: rowRef[1] })), /* @__PURE__ */ React40.createElement(Control2, { bind: "spread", label: (0, import_i18n11.__)("Spread", "elementor") }, /* @__PURE__ */ React40.createElement(SizeControl, { anchorRef: rowRef[1] })))));
1842
1849
  };
1843
1850
  var Control2 = ({
1844
1851
  label,
1845
1852
  bind,
1846
1853
  children,
1847
1854
  sx
1848
- }) => /* @__PURE__ */ React39.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React39.createElement(import_ui30.Grid, { item: true, xs: 6, sx }, /* @__PURE__ */ React39.createElement(import_ui30.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React39.createElement(import_ui30.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React39.createElement(import_ui30.FormLabel, { size: "tiny" }, label)), /* @__PURE__ */ React39.createElement(import_ui30.Grid, { item: true, xs: 12 }, children))));
1855
+ }) => /* @__PURE__ */ React40.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React40.createElement(import_ui31.Grid, { item: true, xs: 6, sx }, /* @__PURE__ */ React40.createElement(import_ui31.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React40.createElement(import_ui31.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React40.createElement(import_ui31.FormLabel, { size: "tiny" }, label)), /* @__PURE__ */ React40.createElement(import_ui31.Grid, { item: true, xs: 12 }, children))));
1849
1856
  var ItemLabel = ({ value }) => {
1850
1857
  const { position, hOffset, vOffset, blur, spread } = value.value;
1851
1858
  const { size: blurSize = "", unit: blurUnit = "" } = blur?.value || {};
@@ -1864,7 +1871,7 @@ var ItemLabel = ({ value }) => {
1864
1871
  }
1865
1872
  return !size ? CUSTOM_SIZE_LABEL : size;
1866
1873
  }).join(" ");
1867
- return /* @__PURE__ */ React39.createElement("span", { style: { textTransform: "capitalize" } }, positionLabel, ": ", sizes);
1874
+ return /* @__PURE__ */ React40.createElement("span", { style: { textTransform: "capitalize" } }, positionLabel, ": ", sizes);
1868
1875
  };
1869
1876
  var initialShadow = {
1870
1877
  $$type: "shadow",
@@ -1894,12 +1901,12 @@ var initialShadow = {
1894
1901
  };
1895
1902
 
1896
1903
  // src/controls/filter-control/filter-repeater-control.tsx
1897
- var React48 = __toESM(require("react"));
1904
+ var React49 = __toESM(require("react"));
1898
1905
  var import_editor_props15 = require("@elementor/editor-props");
1899
1906
  var import_i18n16 = require("@wordpress/i18n");
1900
1907
 
1901
1908
  // src/controls/filter-control/context/filter-config-context.tsx
1902
- var React40 = __toESM(require("react"));
1909
+ var React41 = __toESM(require("react"));
1903
1910
  var import_react23 = require("react");
1904
1911
  var import_editor_props11 = require("@elementor/editor-props");
1905
1912
 
@@ -2015,7 +2022,7 @@ function FilterConfigProvider({ children }) {
2015
2022
  getInitialValue: () => config.blur.defaultValue
2016
2023
  };
2017
2024
  }, [propContext.propType]);
2018
- return /* @__PURE__ */ React40.createElement(FilterConfigContext.Provider, { value: contextValue }, children);
2025
+ return /* @__PURE__ */ React41.createElement(FilterConfigContext.Provider, { value: contextValue }, children);
2019
2026
  }
2020
2027
  function useFilterConfig() {
2021
2028
  const context = (0, import_react23.useContext)(FilterConfigContext);
@@ -2026,16 +2033,16 @@ function useFilterConfig() {
2026
2033
  }
2027
2034
 
2028
2035
  // src/controls/filter-control/filter-content.tsx
2029
- var React43 = __toESM(require("react"));
2036
+ var React44 = __toESM(require("react"));
2030
2037
  var import_editor_props14 = require("@elementor/editor-props");
2031
- var import_ui33 = require("@elementor/ui");
2038
+ var import_ui34 = require("@elementor/ui");
2032
2039
  var import_i18n15 = require("@wordpress/i18n");
2033
2040
 
2034
2041
  // src/controls/filter-control/drop-shadow/drop-shadow-item-content.tsx
2035
- var React41 = __toESM(require("react"));
2042
+ var React42 = __toESM(require("react"));
2036
2043
  var import_react24 = require("react");
2037
2044
  var import_editor_props12 = require("@elementor/editor-props");
2038
- var import_ui31 = require("@elementor/ui");
2045
+ var import_ui32 = require("@elementor/ui");
2039
2046
  var import_i18n14 = require("@wordpress/i18n");
2040
2047
  var items = [
2041
2048
  {
@@ -2062,7 +2069,7 @@ var items = [
2062
2069
  var DropShadowItemContent = ({ anchorEl }) => {
2063
2070
  const context = useBoundProp(import_editor_props12.dropShadowFilterPropTypeUtil);
2064
2071
  const rowRefs = [(0, import_react24.useRef)(null), (0, import_react24.useRef)(null)];
2065
- return /* @__PURE__ */ React41.createElement(PropProvider, { ...context }, items.map((item) => /* @__PURE__ */ React41.createElement(PopoverGridContainer, { key: item.bind, ref: rowRefs[item.rowIndex] ?? null }, /* @__PURE__ */ React41.createElement(PropKeyProvider, { bind: item.bind }, /* @__PURE__ */ React41.createElement(import_ui31.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React41.createElement(ControlFormLabel, null, item.label)), /* @__PURE__ */ React41.createElement(import_ui31.Grid, { item: true, xs: 6 }, item.bind === "color" ? /* @__PURE__ */ React41.createElement(ColorControl, { anchorEl }) : /* @__PURE__ */ React41.createElement(
2072
+ return /* @__PURE__ */ React42.createElement(PropProvider, { ...context }, items.map((item) => /* @__PURE__ */ React42.createElement(PopoverGridContainer, { key: item.bind, ref: rowRefs[item.rowIndex] ?? null }, /* @__PURE__ */ React42.createElement(PropKeyProvider, { bind: item.bind }, /* @__PURE__ */ React42.createElement(import_ui32.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React42.createElement(ControlFormLabel, null, item.label)), /* @__PURE__ */ React42.createElement(import_ui32.Grid, { item: true, xs: 6 }, item.bind === "color" ? /* @__PURE__ */ React42.createElement(ColorControl, { anchorEl }) : /* @__PURE__ */ React42.createElement(
2066
2073
  SizeControl,
2067
2074
  {
2068
2075
  anchorRef: rowRefs[item.rowIndex],
@@ -2074,9 +2081,9 @@ var DropShadowItemContent = ({ anchorEl }) => {
2074
2081
 
2075
2082
  // src/controls/filter-control/single-size/single-size-item-content.tsx
2076
2083
  var import_react25 = require("react");
2077
- var React42 = __toESM(require("react"));
2084
+ var React43 = __toESM(require("react"));
2078
2085
  var import_editor_props13 = require("@elementor/editor-props");
2079
- var import_ui32 = require("@elementor/ui");
2086
+ var import_ui33 = require("@elementor/ui");
2080
2087
  var propTypeMap = {
2081
2088
  blur: import_editor_props13.blurFilterPropTypeUtil,
2082
2089
  intensity: import_editor_props13.intensityFilterPropTypeUtil,
@@ -2088,7 +2095,7 @@ var SingleSizeItemContent = ({ filterFunc }) => {
2088
2095
  const { getFilterFunctionConfig } = useFilterConfig();
2089
2096
  const { valueName, filterFunctionGroup } = getFilterFunctionConfig(filterFunc);
2090
2097
  const context = useBoundProp(propTypeMap[filterFunctionGroup]);
2091
- return /* @__PURE__ */ React42.createElement(PropProvider, { ...context }, /* @__PURE__ */ React42.createElement(PropKeyProvider, { bind: filterFunctionGroup }, /* @__PURE__ */ React42.createElement(PropKeyProvider, { bind: "size" }, /* @__PURE__ */ React42.createElement(PopoverGridContainer, { ref: rowRef }, /* @__PURE__ */ React42.createElement(import_ui32.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React42.createElement(ControlFormLabel, null, valueName)), /* @__PURE__ */ React42.createElement(import_ui32.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React42.createElement(SizeControl, { anchorRef: rowRef, enablePropTypeUnits: true }))))));
2098
+ return /* @__PURE__ */ React43.createElement(PropProvider, { ...context }, /* @__PURE__ */ React43.createElement(PropKeyProvider, { bind: filterFunctionGroup }, /* @__PURE__ */ React43.createElement(PropKeyProvider, { bind: "size" }, /* @__PURE__ */ React43.createElement(PopoverGridContainer, { ref: rowRef }, /* @__PURE__ */ React43.createElement(import_ui33.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React43.createElement(ControlFormLabel, null, valueName)), /* @__PURE__ */ React43.createElement(import_ui33.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React43.createElement(SizeControl, { anchorRef: rowRef, enablePropTypeUnits: true }))))));
2092
2099
  };
2093
2100
 
2094
2101
  // src/controls/filter-control/filter-content.tsx
@@ -2106,7 +2113,7 @@ var FilterContent = () => {
2106
2113
  }
2107
2114
  propContext.setValue(newValue);
2108
2115
  };
2109
- return /* @__PURE__ */ React43.createElement(PropProvider, { ...propContext, setValue: handleValueChange }, /* @__PURE__ */ React43.createElement(PropKeyProvider, { bind: "css-filter-func" }, /* @__PURE__ */ React43.createElement(PopoverContent, { p: 1.5 }, /* @__PURE__ */ React43.createElement(PopoverGridContainer, null, /* @__PURE__ */ React43.createElement(import_ui33.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React43.createElement(ControlFormLabel, null, (0, import_i18n15.__)("Filter", "elementor"))), /* @__PURE__ */ React43.createElement(import_ui33.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React43.createElement(PropKeyProvider, { bind: "func" }, /* @__PURE__ */ React43.createElement(SelectControl, { options: filterOptions })))), /* @__PURE__ */ React43.createElement(PropKeyProvider, { bind: "args" }, /* @__PURE__ */ React43.createElement(FilterValueContent, null)))));
2116
+ return /* @__PURE__ */ React44.createElement(PropProvider, { ...propContext, setValue: handleValueChange }, /* @__PURE__ */ React44.createElement(PropKeyProvider, { bind: "css-filter-func" }, /* @__PURE__ */ React44.createElement(PopoverContent, { p: 1.5 }, /* @__PURE__ */ React44.createElement(PopoverGridContainer, null, /* @__PURE__ */ React44.createElement(import_ui34.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React44.createElement(ControlFormLabel, null, (0, import_i18n15.__)("Filter", "elementor"))), /* @__PURE__ */ React44.createElement(import_ui34.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React44.createElement(PropKeyProvider, { bind: "func" }, /* @__PURE__ */ React44.createElement(SelectControl, { options: filterOptions })))), /* @__PURE__ */ React44.createElement(PropKeyProvider, { bind: "args" }, /* @__PURE__ */ React44.createElement(FilterValueContent, null)))));
2110
2117
  };
2111
2118
  var FilterValueContent = () => {
2112
2119
  const { openItemIndex, items: items2 } = useRepeaterContext();
@@ -2114,19 +2121,19 @@ var FilterValueContent = () => {
2114
2121
  const filterFunc = currentItem.item.value.func.value;
2115
2122
  const isDropShadow = filterFunc === "drop-shadow";
2116
2123
  if (isDropShadow) {
2117
- return /* @__PURE__ */ React43.createElement(DropShadowItemContent, null);
2124
+ return /* @__PURE__ */ React44.createElement(DropShadowItemContent, null);
2118
2125
  }
2119
- return /* @__PURE__ */ React43.createElement(SingleSizeItemContent, { filterFunc });
2126
+ return /* @__PURE__ */ React44.createElement(SingleSizeItemContent, { filterFunc });
2120
2127
  };
2121
2128
 
2122
2129
  // src/controls/filter-control/filter-icon.tsx
2123
- var React44 = __toESM(require("react"));
2124
- var import_ui34 = require("@elementor/ui");
2130
+ var React45 = __toESM(require("react"));
2131
+ var import_ui35 = require("@elementor/ui");
2125
2132
  var FilterIcon = ({ value }) => {
2126
2133
  if (value.value.func.value !== "drop-shadow") {
2127
2134
  return null;
2128
2135
  }
2129
- return /* @__PURE__ */ React44.createElement(
2136
+ return /* @__PURE__ */ React45.createElement(
2130
2137
  StyledUnstableColorIndicator2,
2131
2138
  {
2132
2139
  size: "inherit",
@@ -2135,44 +2142,44 @@ var FilterIcon = ({ value }) => {
2135
2142
  }
2136
2143
  );
2137
2144
  };
2138
- var StyledUnstableColorIndicator2 = (0, import_ui34.styled)(import_ui34.UnstableColorIndicator)(({ theme }) => ({
2145
+ var StyledUnstableColorIndicator2 = (0, import_ui35.styled)(import_ui35.UnstableColorIndicator)(({ theme }) => ({
2139
2146
  borderRadius: `${theme.shape.borderRadius / 2}px`
2140
2147
  }));
2141
2148
 
2142
2149
  // src/controls/filter-control/filter-label.tsx
2143
- var React47 = __toESM(require("react"));
2150
+ var React48 = __toESM(require("react"));
2144
2151
 
2145
2152
  // src/controls/filter-control/drop-shadow/drop-shadow-item-label.tsx
2146
- var React45 = __toESM(require("react"));
2147
- var import_ui35 = require("@elementor/ui");
2153
+ var React46 = __toESM(require("react"));
2154
+ var import_ui36 = require("@elementor/ui");
2148
2155
  var DropShadowItemLabel = ({ value }) => {
2149
2156
  const values = value.value.args.value;
2150
2157
  const keys = ["xAxis", "yAxis", "blur"];
2151
2158
  const labels = keys.map(
2152
2159
  (key) => values[key]?.value?.unit !== "custom" ? `${values[key]?.value?.size ?? 0}${values[key]?.value?.unit ?? "px"}` : values[key]?.value?.size || CUSTOM_SIZE_LABEL
2153
2160
  );
2154
- return /* @__PURE__ */ React45.createElement(import_ui35.Box, { component: "span" }, /* @__PURE__ */ React45.createElement(import_ui35.Box, { component: "span", style: { textTransform: "capitalize" } }, "Drop shadow:"), ` ${labels.join(" ")}`);
2161
+ return /* @__PURE__ */ React46.createElement(import_ui36.Box, { component: "span" }, /* @__PURE__ */ React46.createElement(import_ui36.Box, { component: "span", style: { textTransform: "capitalize" } }, "Drop shadow:"), ` ${labels.join(" ")}`);
2155
2162
  };
2156
2163
 
2157
2164
  // src/controls/filter-control/single-size/single-size-item-label.tsx
2158
- var React46 = __toESM(require("react"));
2159
- var import_ui36 = require("@elementor/ui");
2165
+ var React47 = __toESM(require("react"));
2166
+ var import_ui37 = require("@elementor/ui");
2160
2167
  var SingleSizeItemLabel = ({ value }) => {
2161
2168
  const { func, args } = value.value;
2162
2169
  const { getFilterFunctionConfig } = useFilterConfig();
2163
2170
  const { defaultValue } = getFilterFunctionConfig(func.value ?? "");
2164
2171
  const defaultUnit = defaultValue.value.args.value?.size?.value?.unit ?? lengthUnits[0];
2165
2172
  const { unit, size } = args.value.size?.value ?? { unit: defaultUnit, size: 0 };
2166
- const label = /* @__PURE__ */ React46.createElement(import_ui36.Box, { component: "span", style: { textTransform: "capitalize" } }, func.value ?? "", ":");
2167
- return /* @__PURE__ */ React46.createElement(import_ui36.Box, { component: "span" }, label, " " + (unit !== "custom" ? `${size ?? 0}${unit ?? defaultUnit}` : size || CUSTOM_SIZE_LABEL));
2173
+ const label = /* @__PURE__ */ React47.createElement(import_ui37.Box, { component: "span", style: { textTransform: "capitalize" } }, func.value ?? "", ":");
2174
+ return /* @__PURE__ */ React47.createElement(import_ui37.Box, { component: "span" }, label, " " + (unit !== "custom" ? `${size ?? 0}${unit ?? defaultUnit}` : size || CUSTOM_SIZE_LABEL));
2168
2175
  };
2169
2176
 
2170
2177
  // src/controls/filter-control/filter-label.tsx
2171
2178
  var FilterLabel = ({ value }) => {
2172
2179
  if (value.value.func.value === "drop-shadow") {
2173
- return /* @__PURE__ */ React47.createElement(DropShadowItemLabel, { value });
2180
+ return /* @__PURE__ */ React48.createElement(DropShadowItemLabel, { value });
2174
2181
  }
2175
- return /* @__PURE__ */ React47.createElement(SingleSizeItemLabel, { value });
2182
+ return /* @__PURE__ */ React48.createElement(SingleSizeItemLabel, { value });
2176
2183
  };
2177
2184
 
2178
2185
  // src/controls/filter-control/filter-repeater-control.tsx
@@ -2189,7 +2196,7 @@ var FILTER_CONFIG = {
2189
2196
  var FilterRepeaterControl = createControl(({ filterPropName = "filter" }) => {
2190
2197
  const { propTypeUtil, label } = ensureFilterConfig(filterPropName);
2191
2198
  const { propType, value: filterValues, setValue } = useBoundProp(propTypeUtil);
2192
- return /* @__PURE__ */ React48.createElement(FilterConfigProvider, null, /* @__PURE__ */ React48.createElement(PropProvider, { propType, value: filterValues, setValue }, /* @__PURE__ */ React48.createElement(
2199
+ return /* @__PURE__ */ React49.createElement(FilterConfigProvider, null, /* @__PURE__ */ React49.createElement(PropProvider, { propType, value: filterValues, setValue }, /* @__PURE__ */ React49.createElement(
2193
2200
  Repeater,
2194
2201
  {
2195
2202
  propTypeUtil,
@@ -2200,20 +2207,20 @@ var FilterRepeaterControl = createControl(({ filterPropName = "filter" }) => {
2200
2207
  });
2201
2208
  var Repeater = ({ propTypeUtil, label, filterPropName }) => {
2202
2209
  const { getInitialValue: getInitialValue2 } = useFilterConfig();
2203
- return /* @__PURE__ */ React48.createElement(ControlRepeater, { initial: getInitialValue2(), propTypeUtil }, /* @__PURE__ */ React48.createElement(RepeaterHeader, { label }, /* @__PURE__ */ React48.createElement(
2210
+ return /* @__PURE__ */ React49.createElement(ControlRepeater, { initial: getInitialValue2(), propTypeUtil }, /* @__PURE__ */ React49.createElement(RepeaterHeader, { label }, /* @__PURE__ */ React49.createElement(
2204
2211
  TooltipAddItemAction,
2205
2212
  {
2206
2213
  newItemIndex: 0,
2207
2214
  ariaLabel: filterPropName === "backdrop-filter" ? "backdrop filter" : "filter"
2208
2215
  }
2209
- )), /* @__PURE__ */ React48.createElement(ItemsContainer, null, /* @__PURE__ */ React48.createElement(
2216
+ )), /* @__PURE__ */ React49.createElement(ItemsContainer, null, /* @__PURE__ */ React49.createElement(
2210
2217
  Item,
2211
2218
  {
2212
2219
  Label: FilterLabel,
2213
2220
  Icon: FilterIcon,
2214
- actions: /* @__PURE__ */ React48.createElement(React48.Fragment, null, /* @__PURE__ */ React48.createElement(DuplicateItemAction, null), /* @__PURE__ */ React48.createElement(DisableItemAction, null), /* @__PURE__ */ React48.createElement(RemoveItemAction, null))
2221
+ actions: /* @__PURE__ */ React49.createElement(React49.Fragment, null, /* @__PURE__ */ React49.createElement(DuplicateItemAction, null), /* @__PURE__ */ React49.createElement(DisableItemAction, null), /* @__PURE__ */ React49.createElement(RemoveItemAction, null))
2215
2222
  }
2216
- )), /* @__PURE__ */ React48.createElement(EditItemPopover, null, /* @__PURE__ */ React48.createElement(FilterContent, null)));
2223
+ )), /* @__PURE__ */ React49.createElement(EditItemPopover, null, /* @__PURE__ */ React49.createElement(FilterContent, null)));
2217
2224
  };
2218
2225
  function ensureFilterConfig(name) {
2219
2226
  if (name && name in FILTER_CONFIG) {
@@ -2223,7 +2230,7 @@ function ensureFilterConfig(name) {
2223
2230
  }
2224
2231
 
2225
2232
  // src/controls/select-control-wrapper.tsx
2226
- var React49 = __toESM(require("react"));
2233
+ var React50 = __toESM(require("react"));
2227
2234
  var import_react26 = require("react");
2228
2235
  var getOffCanvasElements = () => {
2229
2236
  const extendedWindow = window;
@@ -2255,33 +2262,33 @@ var useDynamicOptions = (collectionId, initialOptions) => {
2255
2262
  var SelectControlWrapper = createControl(
2256
2263
  ({ collectionId, options, ...props }) => {
2257
2264
  const actualOptions = useDynamicOptions(collectionId, options);
2258
- return /* @__PURE__ */ React49.createElement(SelectControl, { options: actualOptions, ...props });
2265
+ return /* @__PURE__ */ React50.createElement(SelectControl, { options: actualOptions, ...props });
2259
2266
  }
2260
2267
  );
2261
2268
 
2262
2269
  // src/controls/toggle-control.tsx
2263
- var React53 = __toESM(require("react"));
2270
+ var React54 = __toESM(require("react"));
2264
2271
  var import_editor_props16 = require("@elementor/editor-props");
2265
2272
 
2266
2273
  // src/components/control-toggle-button-group.tsx
2267
- var React51 = __toESM(require("react"));
2274
+ var React52 = __toESM(require("react"));
2268
2275
  var import_react27 = require("react");
2269
2276
  var import_icons9 = require("@elementor/icons");
2270
- var import_ui38 = require("@elementor/ui");
2277
+ var import_ui39 = require("@elementor/ui");
2271
2278
 
2272
2279
  // src/components/conditional-tooltip.tsx
2273
- var React50 = __toESM(require("react"));
2274
- var import_ui37 = require("@elementor/ui");
2280
+ var React51 = __toESM(require("react"));
2281
+ var import_ui38 = require("@elementor/ui");
2275
2282
  var ConditionalTooltip = ({
2276
2283
  showTooltip,
2277
2284
  children,
2278
2285
  label
2279
2286
  }) => {
2280
- return showTooltip && label ? /* @__PURE__ */ React50.createElement(import_ui37.Tooltip, { title: label, disableFocusListener: true, placement: "top" }, children) : children;
2287
+ return showTooltip && label ? /* @__PURE__ */ React51.createElement(import_ui38.Tooltip, { title: label, disableFocusListener: true, placement: "top" }, children) : children;
2281
2288
  };
2282
2289
 
2283
2290
  // src/components/control-toggle-button-group.tsx
2284
- var StyledToggleButtonGroup = (0, import_ui38.styled)(import_ui38.ToggleButtonGroup)`
2291
+ var StyledToggleButtonGroup = (0, import_ui39.styled)(import_ui39.ToggleButtonGroup)`
2285
2292
  ${({ justify }) => `justify-content: ${justify};`}
2286
2293
  button:not( :last-of-type ) {
2287
2294
  border-start-end-radius: 0;
@@ -2296,7 +2303,7 @@ var StyledToggleButtonGroup = (0, import_ui38.styled)(import_ui38.ToggleButtonGr
2296
2303
  border-end-end-radius: 8px;
2297
2304
  }
2298
2305
  `;
2299
- var StyledToggleButton = (0, import_ui38.styled)(import_ui38.ToggleButton, {
2306
+ var StyledToggleButton = (0, import_ui39.styled)(import_ui39.ToggleButton, {
2300
2307
  shouldForwardProp: (prop) => prop !== "isPlaceholder"
2301
2308
  })`
2302
2309
  ${({ theme, isPlaceholder }) => isPlaceholder && `
@@ -2308,7 +2315,7 @@ var StyledToggleButton = (0, import_ui38.styled)(import_ui38.ToggleButton, {
2308
2315
  }
2309
2316
  `}
2310
2317
  `;
2311
- var ToggleButtonGroupUi = React51.forwardRef(
2318
+ var ToggleButtonGroupUi = React52.forwardRef(
2312
2319
  ({
2313
2320
  justify = "end",
2314
2321
  size = "tiny",
@@ -2324,7 +2331,7 @@ var ToggleButtonGroupUi = React51.forwardRef(
2324
2331
  const shouldSliceItems = exclusive && maxItems !== void 0 && items2.length > maxItems;
2325
2332
  const menuItems = shouldSliceItems ? items2.slice(maxItems - 1) : [];
2326
2333
  const fixedItems = shouldSliceItems ? items2.slice(0, maxItems - 1) : items2;
2327
- const theme = (0, import_ui38.useTheme)();
2334
+ const theme = (0, import_ui39.useTheme)();
2328
2335
  const isRtl = "rtl" === theme.direction;
2329
2336
  const handleChange = (_, newValue) => {
2330
2337
  onChange(newValue);
@@ -2353,7 +2360,7 @@ var ToggleButtonGroupUi = React51.forwardRef(
2353
2360
  return [];
2354
2361
  };
2355
2362
  const placeholderArray = getPlaceholderArray(placeholder);
2356
- return /* @__PURE__ */ React51.createElement(
2363
+ return /* @__PURE__ */ React52.createElement(
2357
2364
  StyledToggleButtonGroup,
2358
2365
  {
2359
2366
  ref,
@@ -2371,14 +2378,14 @@ var ToggleButtonGroupUi = React51.forwardRef(
2371
2378
  },
2372
2379
  fixedItems.map(({ label, value: buttonValue, renderContent: Content3, showTooltip }) => {
2373
2380
  const isPlaceholder = placeholderArray.length > 0 && placeholderArray.includes(buttonValue) && (shouldShowExclusivePlaceholder || shouldShowNonExclusivePlaceholder);
2374
- return /* @__PURE__ */ React51.createElement(
2381
+ return /* @__PURE__ */ React52.createElement(
2375
2382
  ConditionalTooltip,
2376
2383
  {
2377
2384
  key: buttonValue,
2378
2385
  label,
2379
2386
  showTooltip: showTooltip || false
2380
2387
  },
2381
- /* @__PURE__ */ React51.createElement(
2388
+ /* @__PURE__ */ React52.createElement(
2382
2389
  StyledToggleButton,
2383
2390
  {
2384
2391
  value: buttonValue,
@@ -2387,11 +2394,11 @@ var ToggleButtonGroupUi = React51.forwardRef(
2387
2394
  fullWidth,
2388
2395
  isPlaceholder
2389
2396
  },
2390
- /* @__PURE__ */ React51.createElement(Content3, { size })
2397
+ /* @__PURE__ */ React52.createElement(Content3, { size })
2391
2398
  )
2392
2399
  );
2393
2400
  }),
2394
- menuItems.length && exclusive && /* @__PURE__ */ React51.createElement(
2401
+ menuItems.length && exclusive && /* @__PURE__ */ React52.createElement(
2395
2402
  SplitButtonGroup,
2396
2403
  {
2397
2404
  size,
@@ -2405,7 +2412,7 @@ var ToggleButtonGroupUi = React51.forwardRef(
2405
2412
  }
2406
2413
  );
2407
2414
  var ControlToggleButtonGroup = (props) => {
2408
- return /* @__PURE__ */ React51.createElement(ControlActions, null, /* @__PURE__ */ React51.createElement(ToggleButtonGroupUi, { ...props }));
2415
+ return /* @__PURE__ */ React52.createElement(ControlActions, null, /* @__PURE__ */ React52.createElement(ToggleButtonGroupUi, { ...props }));
2409
2416
  };
2410
2417
  var SplitButtonGroup = ({
2411
2418
  size = "tiny",
@@ -2429,8 +2436,8 @@ var SplitButtonGroup = ({
2429
2436
  const shouldRemove = newValue === value;
2430
2437
  onChange(shouldRemove ? null : newValue);
2431
2438
  };
2432
- return /* @__PURE__ */ React51.createElement(React51.Fragment, null, /* @__PURE__ */ React51.createElement(
2433
- import_ui38.ToggleButton,
2439
+ return /* @__PURE__ */ React52.createElement(React52.Fragment, null, /* @__PURE__ */ React52.createElement(
2440
+ import_ui39.ToggleButton,
2434
2441
  {
2435
2442
  value: previewButton.value,
2436
2443
  "aria-label": previewButton.label,
@@ -2442,8 +2449,8 @@ var SplitButtonGroup = ({
2442
2449
  }
2443
2450
  },
2444
2451
  previewButton.renderContent({ size })
2445
- ), /* @__PURE__ */ React51.createElement(
2446
- import_ui38.ToggleButton,
2452
+ ), /* @__PURE__ */ React52.createElement(
2453
+ import_ui39.ToggleButton,
2447
2454
  {
2448
2455
  size,
2449
2456
  "aria-expanded": isMenuOpen ? "true" : void 0,
@@ -2453,9 +2460,9 @@ var SplitButtonGroup = ({
2453
2460
  ref: menuButtonRef,
2454
2461
  value: "__chevron-icon-button__"
2455
2462
  },
2456
- /* @__PURE__ */ React51.createElement(import_icons9.ChevronDownIcon, { fontSize: size })
2457
- ), /* @__PURE__ */ React51.createElement(
2458
- import_ui38.Menu,
2463
+ /* @__PURE__ */ React52.createElement(import_icons9.ChevronDownIcon, { fontSize: size })
2464
+ ), /* @__PURE__ */ React52.createElement(
2465
+ import_ui39.Menu,
2459
2466
  {
2460
2467
  open: isMenuOpen,
2461
2468
  onClose: () => setIsMenuOpen(false),
@@ -2472,14 +2479,14 @@ var SplitButtonGroup = ({
2472
2479
  mt: 0.5
2473
2480
  }
2474
2481
  },
2475
- items2.map(({ label, value: buttonValue }) => /* @__PURE__ */ React51.createElement(
2476
- import_ui38.MenuItem,
2482
+ items2.map(({ label, value: buttonValue }) => /* @__PURE__ */ React52.createElement(
2483
+ import_ui39.MenuItem,
2477
2484
  {
2478
2485
  key: buttonValue,
2479
2486
  selected: buttonValue === value,
2480
2487
  onClick: () => onMenuItemClick(buttonValue)
2481
2488
  },
2482
- /* @__PURE__ */ React51.createElement(import_ui38.ListItemText, null, /* @__PURE__ */ React51.createElement(import_ui38.Typography, { sx: { fontSize: "14px" } }, label))
2489
+ /* @__PURE__ */ React52.createElement(import_ui39.ListItemText, null, /* @__PURE__ */ React52.createElement(import_ui39.Typography, { sx: { fontSize: "14px" } }, label))
2483
2490
  ))
2484
2491
  ));
2485
2492
  };
@@ -2497,7 +2504,7 @@ var usePreviewButton = (items2, value) => {
2497
2504
  };
2498
2505
 
2499
2506
  // src/utils/convert-toggle-options-to-atomic.tsx
2500
- var React52 = __toESM(require("react"));
2507
+ var React53 = __toESM(require("react"));
2501
2508
  var Icons = __toESM(require("@elementor/icons"));
2502
2509
  var convertToggleOptionsToAtomic = (options) => {
2503
2510
  return options.map((option) => {
@@ -2508,7 +2515,7 @@ var convertToggleOptionsToAtomic = (options) => {
2508
2515
  label: option.label,
2509
2516
  renderContent: ({ size }) => {
2510
2517
  if (IconComponent) {
2511
- return /* @__PURE__ */ React52.createElement(IconComponent, { fontSize: size });
2518
+ return /* @__PURE__ */ React53.createElement(IconComponent, { fontSize: size });
2512
2519
  }
2513
2520
  return option.label;
2514
2521
  },
@@ -2544,7 +2551,7 @@ var ToggleControl = createControl(
2544
2551
  size,
2545
2552
  placeholder
2546
2553
  };
2547
- return exclusive ? /* @__PURE__ */ React53.createElement(
2554
+ return exclusive ? /* @__PURE__ */ React54.createElement(
2548
2555
  ControlToggleButtonGroup,
2549
2556
  {
2550
2557
  ...toggleButtonGroupProps,
@@ -2553,7 +2560,7 @@ var ToggleControl = createControl(
2553
2560
  disabled,
2554
2561
  exclusive: true
2555
2562
  }
2556
- ) : /* @__PURE__ */ React53.createElement(
2563
+ ) : /* @__PURE__ */ React54.createElement(
2557
2564
  ControlToggleButtonGroup,
2558
2565
  {
2559
2566
  ...toggleButtonGroupProps,
@@ -2567,9 +2574,9 @@ var ToggleControl = createControl(
2567
2574
  );
2568
2575
 
2569
2576
  // src/controls/number-control.tsx
2570
- var React54 = __toESM(require("react"));
2577
+ var React55 = __toESM(require("react"));
2571
2578
  var import_editor_props17 = require("@elementor/editor-props");
2572
- var import_ui39 = require("@elementor/ui");
2579
+ var import_ui40 = require("@elementor/ui");
2573
2580
  var isEmptyOrNaN = (value) => value === null || value === void 0 || value === "" || Number.isNaN(Number(value));
2574
2581
  var NumberControl = createControl(
2575
2582
  ({
@@ -2598,7 +2605,7 @@ var NumberControl = createControl(
2598
2605
  }
2599
2606
  setValue(updatedValue, void 0, { validation: () => isInputValid });
2600
2607
  };
2601
- return /* @__PURE__ */ React54.createElement(ControlActions, null, /* @__PURE__ */ React54.createElement(
2608
+ return /* @__PURE__ */ React55.createElement(ControlActions, null, /* @__PURE__ */ React55.createElement(
2602
2609
  NumberInput,
2603
2610
  {
2604
2611
  size: "tiny",
@@ -2611,7 +2618,7 @@ var NumberControl = createControl(
2611
2618
  placeholder: labelPlaceholder ?? (isEmptyOrNaN(placeholder) ? "" : String(placeholder)),
2612
2619
  inputProps: { step, min },
2613
2620
  InputProps: {
2614
- startAdornment: startIcon ? /* @__PURE__ */ React54.createElement(import_ui39.InputAdornment, { position: "start", disabled }, startIcon) : void 0
2621
+ startAdornment: startIcon ? /* @__PURE__ */ React55.createElement(import_ui40.InputAdornment, { position: "start", disabled }, startIcon) : void 0
2615
2622
  }
2616
2623
  }
2617
2624
  ));
@@ -2623,15 +2630,6 @@ var React56 = __toESM(require("react"));
2623
2630
  var import_react28 = require("react");
2624
2631
  var import_ui41 = require("@elementor/ui");
2625
2632
  var import_i18n17 = require("@wordpress/i18n");
2626
-
2627
- // src/components/control-label.tsx
2628
- var React55 = __toESM(require("react"));
2629
- var import_ui40 = require("@elementor/ui");
2630
- var ControlLabel = ({ children, ...props }) => {
2631
- return /* @__PURE__ */ React55.createElement(import_ui40.Stack, { direction: "row", alignItems: "center", justifyItems: "start", gap: 0.25 }, /* @__PURE__ */ React55.createElement(ControlFormLabel, { ...props }, children), /* @__PURE__ */ React55.createElement(ControlAdornments, null));
2632
- };
2633
-
2634
- // src/controls/equal-unequal-sizes-control.tsx
2635
2633
  function EqualUnequalSizesControl({
2636
2634
  label,
2637
2635
  icon,
@@ -3170,10 +3168,13 @@ var learnMoreButton = {
3170
3168
  };
3171
3169
  var INFOTIP_CONTENT = {
3172
3170
  descendant: (0, import_i18n21.__)(
3173
- "To add a link to this element, first remove the link from the elements inside of it.",
3171
+ "To add a link or action to this element, first remove the link or action from the elements inside of it.",
3174
3172
  "elementor"
3175
3173
  ),
3176
- ancestor: (0, import_i18n21.__)("To add a link to this element, first remove the link from its parent container.", "elementor")
3174
+ ancestor: (0, import_i18n21.__)(
3175
+ "To add a link or action to this container, first remove the link or action from its parent container.",
3176
+ "elementor"
3177
+ )
3177
3178
  };
3178
3179
  var RestrictedLinkInfotip = ({
3179
3180
  linkInLinkRestriction,