@elementor/editor-controls 4.3.0-1058 → 4.3.0-1060

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
@@ -5379,7 +5379,7 @@ var AspectRatioControl = createControl(({ label }) => {
5379
5379
  var React81 = __toESM(require("react"));
5380
5380
  var import_react49 = require("react");
5381
5381
  var import_editor_current_user = require("@elementor/editor-current-user");
5382
- var import_editor_props34 = require("@elementor/editor-props");
5382
+ var import_editor_props35 = require("@elementor/editor-props");
5383
5383
  var import_icons21 = require("@elementor/icons");
5384
5384
  var import_ui64 = require("@elementor/ui");
5385
5385
  var import_wp_media2 = require("@elementor/wp-media");
@@ -5435,10 +5435,49 @@ var AdminDialog = ({ open, onClose, handleEnable, isPending, isError }) => /* @_
5435
5435
  isPending ? /* @__PURE__ */ React80.createElement(import_ui63.CircularProgress, { size: 24 }) : (0, import_i18n31.__)("Enable", "elementor")
5436
5436
  )));
5437
5437
 
5438
+ // src/controls/open-icon-library.ts
5439
+ var import_editor_props34 = require("@elementor/editor-props");
5440
+ var SVG_ICON_LIBRARY = "svg";
5441
+ function isSvgLibrarySelection(icon) {
5442
+ return icon.library === SVG_ICON_LIBRARY && typeof icon.value === "object" && icon.value !== null;
5443
+ }
5444
+ function openIconLibrary({ selected, onSelect } = {}) {
5445
+ const iconManager = window.elementor?.iconManager;
5446
+ if (!iconManager) {
5447
+ return;
5448
+ }
5449
+ iconManager.loadIconLibraries();
5450
+ iconManager.show({
5451
+ view: createIconManagerControlView(selected, onSelect)
5452
+ });
5453
+ }
5454
+ function enqueueIconFonts(library) {
5455
+ window.elementor?.helpers?.enqueueIconFonts?.(library);
5456
+ }
5457
+ function createIconManagerControlView(selected, onSelect) {
5458
+ return {
5459
+ model: {
5460
+ get: () => false
5461
+ },
5462
+ getControlValue: () => selected ?? { value: "", library: "" },
5463
+ setValue: (icon) => {
5464
+ onSelect?.(icon);
5465
+ },
5466
+ applySavedValue: () => void 0
5467
+ };
5468
+ }
5469
+ function createIconPropValue(icon, library) {
5470
+ return {
5471
+ value: import_editor_props34.stringPropTypeUtil.create(icon),
5472
+ library: import_editor_props34.stringPropTypeUtil.create(library)
5473
+ };
5474
+ }
5475
+
5438
5476
  // src/controls/svg-media-control.tsx
5439
5477
  var TILE_SIZE = 8;
5440
5478
  var TILE_WHITE = "transparent";
5441
5479
  var TILE_BLACK = "#c1c1c1";
5480
+ var ICON_PREVIEW_FONT_SIZE = 50;
5442
5481
  var TILES_GRADIENT_FORMULA = `linear-gradient(45deg, ${TILE_BLACK} 25%, ${TILE_WHITE} 0, ${TILE_WHITE} 75%, ${TILE_BLACK} 0, ${TILE_BLACK})`;
5443
5482
  var StyledCard = (0, import_ui64.styled)(import_ui64.Card)`
5444
5483
  background-color: white;
@@ -5460,26 +5499,29 @@ var StyledCardMediaContainer = (0, import_ui64.styled)(import_ui64.Stack)`
5460
5499
  `;
5461
5500
  var MODE_BROWSE = { mode: "browse" };
5462
5501
  var MODE_UPLOAD = { mode: "upload" };
5463
- var SvgMediaControl = createControl(() => {
5464
- const { value, setValue } = useBoundProp(import_editor_props34.svgSrcPropTypeUtil);
5465
- const id = value?.id;
5466
- const url = value?.url;
5502
+ var SvgMediaControl = createControl(({ showIconLibrary = false }) => {
5503
+ const { value: svgValue, setValue: setSvgValue } = useBoundProp(import_editor_props35.svgSrcPropTypeUtil);
5504
+ const { value: iconValue, setValue: setIconValue } = useBoundProp(import_editor_props35.iconPropTypeUtil);
5505
+ const id = svgValue?.id;
5506
+ const url = svgValue?.url;
5467
5507
  const { data: attachment, isFetching } = (0, import_wp_media2.useWpMediaAttachment)(id?.value || null);
5468
5508
  const src = attachment?.url ?? url?.value ?? null;
5469
5509
  const { data: allowSvgUpload } = useUnfilteredFilesUpload();
5470
5510
  const [unfilteredModalOpenState, setUnfilteredModalOpenState] = (0, import_react49.useState)(false);
5471
5511
  const { isAdmin } = (0, import_editor_current_user.useCurrentUserCapabilities)();
5512
+ const selectedIconClass = showIconLibrary && typeof iconValue?.value?.value === "string" ? iconValue.value.value : null;
5513
+ const selectedIconLibrary = showIconLibrary && typeof iconValue?.library?.value === "string" ? iconValue.library.value : null;
5472
5514
  const { open } = (0, import_wp_media2.useWpMediaFrame)({
5473
5515
  mediaTypes: ["svg"],
5474
5516
  multiple: false,
5475
5517
  selected: id?.value || null,
5476
5518
  onSelect: (selectedAttachment) => {
5477
- setValue({
5519
+ setSvgValue({
5478
5520
  id: {
5479
5521
  $$type: "image-attachment-id",
5480
5522
  value: selectedAttachment.id
5481
5523
  },
5482
- url: import_editor_props34.urlPropTypeUtil.create(selectedAttachment.url)
5524
+ url: import_editor_props35.urlPropTypeUtil.create(selectedAttachment.url)
5483
5525
  });
5484
5526
  }
5485
5527
  });
@@ -5496,18 +5538,36 @@ var SvgMediaControl = createControl(() => {
5496
5538
  open(openOptions);
5497
5539
  }
5498
5540
  };
5541
+ const handleIconLibrarySelect = (icon) => {
5542
+ if (!showIconLibrary) {
5543
+ return;
5544
+ }
5545
+ if (isSvgLibrarySelection(icon)) {
5546
+ setSvgValue({
5547
+ id: icon.value.id ? {
5548
+ $$type: "image-attachment-id",
5549
+ value: icon.value.id
5550
+ } : null,
5551
+ url: icon.value.url ? import_editor_props35.urlPropTypeUtil.create(icon.value.url) : null
5552
+ });
5553
+ return;
5554
+ }
5555
+ if (typeof icon.value === "string") {
5556
+ setIconValue(createIconPropValue(icon.value, icon.library));
5557
+ }
5558
+ };
5499
5559
  const infotipProps = {
5500
5560
  title: (0, import_i18n32.__)("Sorry, you can't upload that file yet.", "elementor"),
5501
5561
  description: /* @__PURE__ */ React81.createElement(React81.Fragment, null, (0, import_i18n32.__)("To upload them anyway, ask the site administrator to enable unfiltered", "elementor"), /* @__PURE__ */ React81.createElement("br", null), (0, import_i18n32.__)("file uploads.", "elementor")),
5502
5562
  isEnabled: !isAdmin
5503
5563
  };
5504
- return /* @__PURE__ */ React81.createElement(import_ui64.Stack, { gap: 1, "aria-label": "SVG Control" }, /* @__PURE__ */ React81.createElement(EnableUnfilteredModal, { open: unfilteredModalOpenState, onClose: onCloseUnfilteredModal }), /* @__PURE__ */ React81.createElement(ControlActions, null, /* @__PURE__ */ React81.createElement(StyledCard, { variant: "outlined" }, /* @__PURE__ */ React81.createElement(StyledCardMediaContainer, null, isFetching ? /* @__PURE__ */ React81.createElement(import_ui64.CircularProgress, { role: "progressbar" }) : /* @__PURE__ */ React81.createElement(
5505
- import_ui64.CardMedia,
5564
+ return /* @__PURE__ */ React81.createElement(import_ui64.Stack, { gap: 1, "aria-label": "SVG Control" }, /* @__PURE__ */ React81.createElement(EnableUnfilteredModal, { open: unfilteredModalOpenState, onClose: onCloseUnfilteredModal }), /* @__PURE__ */ React81.createElement(ControlActions, null, /* @__PURE__ */ React81.createElement(StyledCard, { variant: "outlined" }, /* @__PURE__ */ React81.createElement(StyledCardMediaContainer, null, /* @__PURE__ */ React81.createElement(
5565
+ SvgMediaPreview,
5506
5566
  {
5507
- component: "img",
5508
- image: src,
5509
- alt: (0, import_i18n32.__)("Preview SVG", "elementor"),
5510
- sx: { maxHeight: "140px", width: "50px" }
5567
+ isFetching,
5568
+ src,
5569
+ iconClassName: selectedIconClass,
5570
+ iconLibrary: selectedIconLibrary
5511
5571
  }
5512
5572
  )), /* @__PURE__ */ React81.createElement(
5513
5573
  import_ui64.CardOverlay,
@@ -5528,7 +5588,20 @@ var SvgMediaControl = createControl(() => {
5528
5588
  "aria-label": "Select SVG"
5529
5589
  },
5530
5590
  (0, import_i18n32.__)("Select SVG", "elementor")
5531
- ), /* @__PURE__ */ React81.createElement(ConditionalControlInfotip, { ...infotipProps }, /* @__PURE__ */ React81.createElement("span", null, /* @__PURE__ */ React81.createElement(import_ui64.ThemeProvider, { colorScheme: isAdmin ? "light" : "dark" }, /* @__PURE__ */ React81.createElement(
5591
+ ), showIconLibrary ? /* @__PURE__ */ React81.createElement(
5592
+ import_ui64.Button,
5593
+ {
5594
+ size: "tiny",
5595
+ variant: "text",
5596
+ color: "inherit",
5597
+ onClick: () => openIconLibrary({
5598
+ selected: selectedIconClass && selectedIconLibrary ? { value: selectedIconClass, library: selectedIconLibrary } : void 0,
5599
+ onSelect: handleIconLibrarySelect
5600
+ }),
5601
+ "aria-label": (0, import_i18n32.__)("Icon library", "elementor")
5602
+ },
5603
+ (0, import_i18n32.__)("Icon library", "elementor")
5604
+ ) : null, /* @__PURE__ */ React81.createElement(ConditionalControlInfotip, { ...infotipProps }, /* @__PURE__ */ React81.createElement("span", null, /* @__PURE__ */ React81.createElement(import_ui64.ThemeProvider, { colorScheme: isAdmin ? "light" : "dark" }, /* @__PURE__ */ React81.createElement(
5532
5605
  import_ui64.Button,
5533
5606
  {
5534
5607
  size: "tiny",
@@ -5543,21 +5616,56 @@ var SvgMediaControl = createControl(() => {
5543
5616
  )))))
5544
5617
  ))));
5545
5618
  });
5619
+ function SvgMediaPreview({
5620
+ isFetching,
5621
+ src,
5622
+ iconClassName,
5623
+ iconLibrary
5624
+ }) {
5625
+ (0, import_react49.useEffect)(() => {
5626
+ if (iconLibrary) {
5627
+ enqueueIconFonts(iconLibrary);
5628
+ }
5629
+ }, [iconLibrary]);
5630
+ if (isFetching) {
5631
+ return /* @__PURE__ */ React81.createElement(import_ui64.CircularProgress, { role: "progressbar" });
5632
+ }
5633
+ if (iconClassName) {
5634
+ return /* @__PURE__ */ React81.createElement(
5635
+ import_ui64.Box,
5636
+ {
5637
+ component: "i",
5638
+ className: iconClassName,
5639
+ "aria-label": (0, import_i18n32.__)("Preview icon", "elementor"),
5640
+ sx: { fontSize: ICON_PREVIEW_FONT_SIZE }
5641
+ }
5642
+ );
5643
+ }
5644
+ return /* @__PURE__ */ React81.createElement(
5645
+ import_ui64.CardMedia,
5646
+ {
5647
+ component: "img",
5648
+ image: src,
5649
+ alt: (0, import_i18n32.__)("Preview SVG", "elementor"),
5650
+ sx: { maxHeight: "140px", width: `${ICON_PREVIEW_FONT_SIZE}px` }
5651
+ }
5652
+ );
5653
+ }
5546
5654
 
5547
5655
  // src/controls/video-media-control.tsx
5548
5656
  var React82 = __toESM(require("react"));
5549
- var import_editor_props35 = require("@elementor/editor-props");
5657
+ var import_editor_props36 = require("@elementor/editor-props");
5550
5658
  var import_icons22 = require("@elementor/icons");
5551
5659
  var import_ui65 = require("@elementor/ui");
5552
5660
  var import_wp_media3 = require("@elementor/wp-media");
5553
5661
  var import_i18n33 = require("@wordpress/i18n");
5554
5662
  var PLACEHOLDER_IMAGE = window.elementorCommon?.config?.urls?.assets + "/shapes/play-triangle.svg";
5555
5663
  var VideoMediaControl = createControl(() => {
5556
- const { value, setValue, propType } = useBoundProp(import_editor_props35.videoSrcPropTypeUtil);
5664
+ const { value, setValue, propType } = useBoundProp(import_editor_props36.videoSrcPropTypeUtil);
5557
5665
  const { id, url } = value ?? {};
5558
5666
  const { data: attachment, isFetching } = (0, import_wp_media3.useWpMediaAttachment)(id?.value || null);
5559
5667
  const videoUrl = attachment?.url ?? url?.value ?? null;
5560
- const defaultUrl = import_editor_props35.videoSrcPropTypeUtil.extract(propType.default ?? null)?.url?.value;
5668
+ const defaultUrl = import_editor_props36.videoSrcPropTypeUtil.extract(propType.default ?? null)?.url?.value;
5561
5669
  const currentUrlForModal = url?.value && url.value !== defaultUrl ? url.value : void 0;
5562
5670
  const { open } = (0, import_wp_media3.useWpMediaFrame)({
5563
5671
  mediaTypes: ["video"],
@@ -5576,7 +5684,7 @@ var VideoMediaControl = createControl(() => {
5576
5684
  onSelectUrl: (selectedUrl) => {
5577
5685
  setValue({
5578
5686
  id: null,
5579
- url: import_editor_props35.urlPropTypeUtil.create(selectedUrl)
5687
+ url: import_editor_props36.urlPropTypeUtil.create(selectedUrl)
5580
5688
  });
5581
5689
  }
5582
5690
  });
@@ -5652,13 +5760,13 @@ var VideoPreview = ({ isFetching = false, videoUrl }) => {
5652
5760
 
5653
5761
  // src/controls/background-control/background-control.tsx
5654
5762
  var React89 = __toESM(require("react"));
5655
- var import_editor_props41 = require("@elementor/editor-props");
5763
+ var import_editor_props42 = require("@elementor/editor-props");
5656
5764
  var import_ui73 = require("@elementor/ui");
5657
5765
  var import_i18n39 = require("@wordpress/i18n");
5658
5766
 
5659
5767
  // src/controls/background-control/background-overlay/background-overlay-repeater-control.tsx
5660
5768
  var React88 = __toESM(require("react"));
5661
- var import_editor_props40 = require("@elementor/editor-props");
5769
+ var import_editor_props41 = require("@elementor/editor-props");
5662
5770
  var import_ui72 = require("@elementor/ui");
5663
5771
  var import_wp_media4 = require("@elementor/wp-media");
5664
5772
  var import_i18n38 = require("@wordpress/i18n");
@@ -5669,26 +5777,26 @@ var { env } = (0, import_env.parseEnv)("@elementor/editor-controls");
5669
5777
 
5670
5778
  // src/controls/background-control/background-gradient-color-control.tsx
5671
5779
  var React83 = __toESM(require("react"));
5672
- var import_editor_props36 = require("@elementor/editor-props");
5780
+ var import_editor_props37 = require("@elementor/editor-props");
5673
5781
  var import_ui66 = require("@elementor/ui");
5674
5782
  var BackgroundGradientColorControl = createControl(() => {
5675
- const { value, setValue } = useBoundProp(import_editor_props36.backgroundGradientOverlayPropTypeUtil);
5783
+ const { value, setValue } = useBoundProp(import_editor_props37.backgroundGradientOverlayPropTypeUtil);
5676
5784
  const handleChange = (newValue) => {
5677
5785
  const transformedValue = createTransformableValue(newValue);
5678
5786
  if (transformedValue.positions) {
5679
- transformedValue.positions = import_editor_props36.stringPropTypeUtil.create(newValue.positions.join(" "));
5787
+ transformedValue.positions = import_editor_props37.stringPropTypeUtil.create(newValue.positions.join(" "));
5680
5788
  }
5681
5789
  setValue(transformedValue);
5682
5790
  };
5683
5791
  const createTransformableValue = (newValue) => ({
5684
5792
  ...newValue,
5685
- type: import_editor_props36.stringPropTypeUtil.create(newValue.type),
5686
- angle: import_editor_props36.numberPropTypeUtil.create(newValue.angle),
5687
- stops: import_editor_props36.gradientColorStopPropTypeUtil.create(
5793
+ type: import_editor_props37.stringPropTypeUtil.create(newValue.type),
5794
+ angle: import_editor_props37.numberPropTypeUtil.create(newValue.angle),
5795
+ stops: import_editor_props37.gradientColorStopPropTypeUtil.create(
5688
5796
  newValue.stops.map(
5689
- ({ color, offset }) => import_editor_props36.colorStopPropTypeUtil.create({
5690
- color: import_editor_props36.colorPropTypeUtil.create(color),
5691
- offset: import_editor_props36.numberPropTypeUtil.create(offset)
5797
+ ({ color, offset }) => import_editor_props37.colorStopPropTypeUtil.create({
5798
+ color: import_editor_props37.colorPropTypeUtil.create(color),
5799
+ offset: import_editor_props37.numberPropTypeUtil.create(offset)
5692
5800
  })
5693
5801
  )
5694
5802
  )
@@ -5717,17 +5825,17 @@ var BackgroundGradientColorControl = createControl(() => {
5717
5825
  }
5718
5826
  );
5719
5827
  });
5720
- var initialBackgroundGradientOverlay = import_editor_props36.backgroundGradientOverlayPropTypeUtil.create({
5721
- type: import_editor_props36.stringPropTypeUtil.create("linear"),
5722
- angle: import_editor_props36.numberPropTypeUtil.create(180),
5723
- stops: import_editor_props36.gradientColorStopPropTypeUtil.create([
5724
- import_editor_props36.colorStopPropTypeUtil.create({
5725
- color: import_editor_props36.colorPropTypeUtil.create("rgb(0,0,0)"),
5726
- offset: import_editor_props36.numberPropTypeUtil.create(0)
5828
+ var initialBackgroundGradientOverlay = import_editor_props37.backgroundGradientOverlayPropTypeUtil.create({
5829
+ type: import_editor_props37.stringPropTypeUtil.create("linear"),
5830
+ angle: import_editor_props37.numberPropTypeUtil.create(180),
5831
+ stops: import_editor_props37.gradientColorStopPropTypeUtil.create([
5832
+ import_editor_props37.colorStopPropTypeUtil.create({
5833
+ color: import_editor_props37.colorPropTypeUtil.create("rgb(0,0,0)"),
5834
+ offset: import_editor_props37.numberPropTypeUtil.create(0)
5727
5835
  }),
5728
- import_editor_props36.colorStopPropTypeUtil.create({
5729
- color: import_editor_props36.colorPropTypeUtil.create("rgb(255,255,255)"),
5730
- offset: import_editor_props36.numberPropTypeUtil.create(100)
5836
+ import_editor_props37.colorStopPropTypeUtil.create({
5837
+ color: import_editor_props37.colorPropTypeUtil.create("rgb(255,255,255)"),
5838
+ offset: import_editor_props37.numberPropTypeUtil.create(100)
5731
5839
  })
5732
5840
  ])
5733
5841
  });
@@ -5758,7 +5866,7 @@ var BackgroundImageOverlayAttachment = () => {
5758
5866
  // src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-position.tsx
5759
5867
  var React85 = __toESM(require("react"));
5760
5868
  var import_react50 = require("react");
5761
- var import_editor_props37 = require("@elementor/editor-props");
5869
+ var import_editor_props38 = require("@elementor/editor-props");
5762
5870
  var import_editor_ui11 = require("@elementor/editor-ui");
5763
5871
  var import_icons24 = require("@elementor/icons");
5764
5872
  var import_ui68 = require("@elementor/ui");
@@ -5776,8 +5884,8 @@ var backgroundPositionOptions = [
5776
5884
  { label: (0, import_i18n35.__)("Custom", "elementor"), value: "custom" }
5777
5885
  ];
5778
5886
  var BackgroundImageOverlayPosition = () => {
5779
- const backgroundImageOffsetContext = useBoundProp(import_editor_props37.backgroundImagePositionOffsetPropTypeUtil);
5780
- const stringPropContext = useBoundProp(import_editor_props37.stringPropTypeUtil);
5887
+ const backgroundImageOffsetContext = useBoundProp(import_editor_props38.backgroundImagePositionOffsetPropTypeUtil);
5888
+ const stringPropContext = useBoundProp(import_editor_props38.stringPropTypeUtil);
5781
5889
  const isCustom = !!backgroundImageOffsetContext.value;
5782
5890
  const rowRef = (0, import_react50.useRef)(null);
5783
5891
  const handlePositionChange = (event) => {
@@ -5853,7 +5961,7 @@ var BackgroundImageOverlayRepeat = () => {
5853
5961
  // src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-size.tsx
5854
5962
  var React87 = __toESM(require("react"));
5855
5963
  var import_react51 = require("react");
5856
- var import_editor_props38 = require("@elementor/editor-props");
5964
+ var import_editor_props39 = require("@elementor/editor-props");
5857
5965
  var import_icons26 = require("@elementor/icons");
5858
5966
  var import_ui70 = require("@elementor/ui");
5859
5967
  var import_i18n37 = require("@wordpress/i18n");
@@ -5884,8 +5992,8 @@ var sizeControlOptions = [
5884
5992
  }
5885
5993
  ];
5886
5994
  var BackgroundImageOverlaySize = () => {
5887
- const backgroundImageScaleContext = useBoundProp(import_editor_props38.backgroundImageSizeScalePropTypeUtil);
5888
- const stringPropContext = useBoundProp(import_editor_props38.stringPropTypeUtil);
5995
+ const backgroundImageScaleContext = useBoundProp(import_editor_props39.backgroundImageSizeScalePropTypeUtil);
5996
+ const stringPropContext = useBoundProp(import_editor_props39.stringPropTypeUtil);
5889
5997
  const isCustom = !!backgroundImageScaleContext.value;
5890
5998
  const rowRef = (0, import_react51.useRef)(null);
5891
5999
  const handleSizeChange = (size) => {
@@ -5923,16 +6031,16 @@ var BackgroundImageOverlaySize = () => {
5923
6031
 
5924
6032
  // src/controls/background-control/background-overlay/use-background-tabs-history.ts
5925
6033
  var import_react52 = require("react");
5926
- var import_editor_props39 = require("@elementor/editor-props");
6034
+ var import_editor_props40 = require("@elementor/editor-props");
5927
6035
  var import_ui71 = require("@elementor/ui");
5928
6036
  var useBackgroundTabsHistory = ({
5929
6037
  color: initialBackgroundColorOverlay2,
5930
6038
  image: initialBackgroundImageOverlay,
5931
6039
  gradient: initialBackgroundGradientOverlay2
5932
6040
  }) => {
5933
- const { value: imageValue, setValue: setImageValue } = useBoundProp(import_editor_props39.backgroundImageOverlayPropTypeUtil);
5934
- const { value: colorValue, setValue: setColorValue } = useBoundProp(import_editor_props39.backgroundColorOverlayPropTypeUtil);
5935
- const { value: gradientValue, setValue: setGradientValue } = useBoundProp(import_editor_props39.backgroundGradientOverlayPropTypeUtil);
6041
+ const { value: imageValue, setValue: setImageValue } = useBoundProp(import_editor_props40.backgroundImageOverlayPropTypeUtil);
6042
+ const { value: colorValue, setValue: setColorValue } = useBoundProp(import_editor_props40.backgroundColorOverlayPropTypeUtil);
6043
+ const { value: gradientValue, setValue: setGradientValue } = useBoundProp(import_editor_props40.backgroundGradientOverlayPropTypeUtil);
5936
6044
  const getCurrentOverlayType = () => {
5937
6045
  if (colorValue) {
5938
6046
  return "color";
@@ -5981,9 +6089,9 @@ var useBackgroundTabsHistory = ({
5981
6089
 
5982
6090
  // src/controls/background-control/background-overlay/background-overlay-repeater-control.tsx
5983
6091
  var DEFAULT_BACKGROUND_COLOR_OVERLAY_COLOR = "#00000033";
5984
- var initialBackgroundColorOverlay = import_editor_props40.backgroundColorOverlayPropTypeUtil.create(
6092
+ var initialBackgroundColorOverlay = import_editor_props41.backgroundColorOverlayPropTypeUtil.create(
5985
6093
  {
5986
- color: import_editor_props40.colorPropTypeUtil.create(DEFAULT_BACKGROUND_COLOR_OVERLAY_COLOR)
6094
+ color: import_editor_props41.colorPropTypeUtil.create(DEFAULT_BACKGROUND_COLOR_OVERLAY_COLOR)
5987
6095
  }
5988
6096
  );
5989
6097
  var getInitialBackgroundOverlay = () => ({
@@ -6017,12 +6125,12 @@ var backgroundResolutionOptions = [
6017
6125
  { label: (0, import_i18n38.__)("Full", "elementor"), value: "full" }
6018
6126
  ];
6019
6127
  var BackgroundOverlayRepeaterControl = createControl(() => {
6020
- const { propType, value: overlayValues, setValue } = useBoundProp(import_editor_props40.backgroundOverlayPropTypeUtil);
6128
+ const { propType, value: overlayValues, setValue } = useBoundProp(import_editor_props41.backgroundOverlayPropTypeUtil);
6021
6129
  return /* @__PURE__ */ React88.createElement(PropProvider, { propType, value: overlayValues, setValue }, /* @__PURE__ */ React88.createElement(
6022
6130
  ControlRepeater,
6023
6131
  {
6024
6132
  initial: getInitialBackgroundOverlay(),
6025
- propTypeUtil: import_editor_props40.backgroundOverlayPropTypeUtil
6133
+ propTypeUtil: import_editor_props41.backgroundOverlayPropTypeUtil
6026
6134
  },
6027
6135
  /* @__PURE__ */ React88.createElement(RepeaterHeader, { label: (0, import_i18n38.__)("Overlay", "elementor") }, /* @__PURE__ */ React88.createElement(TooltipAddItemAction, { newItemIndex: 0 })),
6028
6136
  /* @__PURE__ */ React88.createElement(ItemsContainer, null, /* @__PURE__ */ React88.createElement(
@@ -6124,11 +6232,11 @@ var ItemLabelGradient = ({ value }) => {
6124
6232
  return /* @__PURE__ */ React88.createElement("span", null, (0, import_i18n38.__)("Radial Gradient", "elementor"));
6125
6233
  };
6126
6234
  var ColorOverlayContent = ({ anchorEl }) => {
6127
- const propContext = useBoundProp(import_editor_props40.backgroundColorOverlayPropTypeUtil);
6235
+ const propContext = useBoundProp(import_editor_props41.backgroundColorOverlayPropTypeUtil);
6128
6236
  return /* @__PURE__ */ React88.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React88.createElement(PropKeyProvider, { bind: "color" }, /* @__PURE__ */ React88.createElement(ColorControl, { anchorEl })));
6129
6237
  };
6130
6238
  var ImageOverlayContent = () => {
6131
- const propContext = useBoundProp(import_editor_props40.backgroundImageOverlayPropTypeUtil);
6239
+ const propContext = useBoundProp(import_editor_props41.backgroundImageOverlayPropTypeUtil);
6132
6240
  return /* @__PURE__ */ React88.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React88.createElement(PropKeyProvider, { bind: "image" }, /* @__PURE__ */ React88.createElement(ImageControl, { sizes: backgroundResolutionOptions })), /* @__PURE__ */ React88.createElement(PropKeyProvider, { bind: "position" }, /* @__PURE__ */ React88.createElement(BackgroundImageOverlayPosition, null)), /* @__PURE__ */ React88.createElement(PropKeyProvider, { bind: "repeat" }, /* @__PURE__ */ React88.createElement(BackgroundImageOverlayRepeat, null)), /* @__PURE__ */ React88.createElement(PropKeyProvider, { bind: "size" }, /* @__PURE__ */ React88.createElement(BackgroundImageOverlaySize, null)), /* @__PURE__ */ React88.createElement(PropKeyProvider, { bind: "attachment" }, /* @__PURE__ */ React88.createElement(BackgroundImageOverlayAttachment, null)));
6133
6241
  };
6134
6242
  var StyledUnstableColorIndicator3 = (0, import_ui72.styled)(import_ui72.UnstableColorIndicator)(({ theme }) => ({
@@ -6178,7 +6286,7 @@ var clipOptions = [
6178
6286
  var colorLabel = (0, import_i18n39.__)("Color", "elementor");
6179
6287
  var clipLabel = (0, import_i18n39.__)("Clipping", "elementor");
6180
6288
  var BackgroundControl = createControl(() => {
6181
- const propContext = useBoundProp(import_editor_props41.backgroundPropTypeUtil);
6289
+ const propContext = useBoundProp(import_editor_props42.backgroundPropTypeUtil);
6182
6290
  return /* @__PURE__ */ React89.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React89.createElement(PropKeyProvider, { bind: "background-overlay" }, /* @__PURE__ */ React89.createElement(BackgroundOverlayRepeaterControl, null)), /* @__PURE__ */ React89.createElement(BackgroundColorField, null), /* @__PURE__ */ React89.createElement(BackgroundClipField, null));
6183
6291
  });
6184
6292
  var BackgroundColorField = () => {
@@ -6191,7 +6299,7 @@ var BackgroundClipField = () => {
6191
6299
  // src/controls/repeatable-control.tsx
6192
6300
  var React90 = __toESM(require("react"));
6193
6301
  var import_react53 = require("react");
6194
- var import_editor_props42 = require("@elementor/editor-props");
6302
+ var import_editor_props43 = require("@elementor/editor-props");
6195
6303
  var import_ui74 = require("@elementor/ui");
6196
6304
  var PLACEHOLDER_REGEX = /\$\{([^}]+)\}/g;
6197
6305
  var RepeatableControl = createControl(
@@ -6212,7 +6320,7 @@ var RepeatableControl = createControl(
6212
6320
  return null;
6213
6321
  }
6214
6322
  const childArrayPropTypeUtil2 = (0, import_react53.useMemo)(
6215
- () => (0, import_editor_props42.createArrayPropUtils)(childPropTypeUtil.key, childPropTypeUtil.schema, propKey),
6323
+ () => (0, import_editor_props43.createArrayPropUtils)(childPropTypeUtil.key, childPropTypeUtil.schema, propKey),
6216
6324
  [childPropTypeUtil.key, childPropTypeUtil.schema, propKey]
6217
6325
  );
6218
6326
  const contextValue = (0, import_react53.useMemo)(
@@ -6348,7 +6456,7 @@ var getAllProperties = (pattern) => {
6348
6456
  // src/controls/key-value-control.tsx
6349
6457
  var React91 = __toESM(require("react"));
6350
6458
  var import_react54 = require("react");
6351
- var import_editor_props43 = require("@elementor/editor-props");
6459
+ var import_editor_props44 = require("@elementor/editor-props");
6352
6460
  var import_ui75 = require("@elementor/ui");
6353
6461
  var import_i18n40 = require("@wordpress/i18n");
6354
6462
 
@@ -6373,7 +6481,7 @@ var getInitialFieldValue = (fieldValue) => {
6373
6481
  return transformableValue.value || "";
6374
6482
  };
6375
6483
  var KeyValueControl = createControl((props = {}) => {
6376
- const { value, setValue, ...propContext } = useBoundProp(import_editor_props43.keyValuePropTypeUtil);
6484
+ const { value, setValue, ...propContext } = useBoundProp(import_editor_props44.keyValuePropTypeUtil);
6377
6485
  const [keyError, setKeyError] = (0, import_react54.useState)("");
6378
6486
  const [valueError, setValueError] = (0, import_react54.useState)("");
6379
6487
  const [sessionState, setSessionState] = (0, import_react54.useState)({
@@ -6412,14 +6520,14 @@ var KeyValueControl = createControl((props = {}) => {
6412
6520
  return;
6413
6521
  }
6414
6522
  const newChangedValue = newValue[fieldType];
6415
- if ((0, import_editor_props43.isTransformable)(newChangedValue) && newChangedValue.$$type === "dynamic") {
6523
+ if ((0, import_editor_props44.isTransformable)(newChangedValue) && newChangedValue.$$type === "dynamic") {
6416
6524
  setValue({
6417
6525
  ...value,
6418
6526
  [fieldType]: newChangedValue
6419
6527
  });
6420
6528
  return;
6421
6529
  }
6422
- const extractedValue = import_editor_props43.stringPropTypeUtil.extract(newChangedValue);
6530
+ const extractedValue = import_editor_props44.stringPropTypeUtil.extract(newChangedValue);
6423
6531
  setSessionState((prev) => ({
6424
6532
  ...prev,
6425
6533
  [fieldType]: extractedValue
@@ -6459,7 +6567,7 @@ var KeyValueControl = createControl((props = {}) => {
6459
6567
 
6460
6568
  // src/controls/position-control.tsx
6461
6569
  var React92 = __toESM(require("react"));
6462
- var import_editor_props44 = require("@elementor/editor-props");
6570
+ var import_editor_props45 = require("@elementor/editor-props");
6463
6571
  var import_editor_ui12 = require("@elementor/editor-ui");
6464
6572
  var import_icons27 = require("@elementor/icons");
6465
6573
  var import_ui76 = require("@elementor/ui");
@@ -6477,8 +6585,8 @@ var positionOptions = [
6477
6585
  { label: (0, import_i18n41.__)("Custom", "elementor"), value: "custom" }
6478
6586
  ];
6479
6587
  var PositionControl = () => {
6480
- const positionContext = useBoundProp(import_editor_props44.positionPropTypeUtil);
6481
- const stringPropContext = useBoundProp(import_editor_props44.stringPropTypeUtil);
6588
+ const positionContext = useBoundProp(import_editor_props45.positionPropTypeUtil);
6589
+ const stringPropContext = useBoundProp(import_editor_props45.stringPropTypeUtil);
6482
6590
  const isCustom = !!positionContext.value;
6483
6591
  const placeholder = positionContext.placeholder ? "custom" : stringPropContext.placeholder ?? null;
6484
6592
  const handlePositionChange = (event) => {
@@ -6519,13 +6627,13 @@ var PositionControl = () => {
6519
6627
  // src/controls/transform-control/transform-repeater-control.tsx
6520
6628
  var React105 = __toESM(require("react"));
6521
6629
  var import_react62 = require("react");
6522
- var import_editor_props53 = require("@elementor/editor-props");
6630
+ var import_editor_props54 = require("@elementor/editor-props");
6523
6631
  var import_icons34 = require("@elementor/icons");
6524
6632
  var import_ui89 = require("@elementor/ui");
6525
6633
  var import_i18n51 = require("@wordpress/i18n");
6526
6634
 
6527
6635
  // src/controls/transform-control/initial-values.ts
6528
- var import_editor_props45 = require("@elementor/editor-props");
6636
+ var import_editor_props46 = require("@elementor/editor-props");
6529
6637
  var TransformFunctionKeys = {
6530
6638
  move: "transform-move",
6531
6639
  scale: "transform-scale",
@@ -6555,17 +6663,17 @@ var initialTransformValue = {
6555
6663
  z: { $$type: "size", value: { size: defaultValues.move.size, unit: defaultValues.move.unit } }
6556
6664
  }
6557
6665
  };
6558
- var initialScaleValue = import_editor_props45.scaleTransformPropTypeUtil.create({
6559
- x: import_editor_props45.numberPropTypeUtil.create(defaultValues.scale),
6560
- y: import_editor_props45.numberPropTypeUtil.create(defaultValues.scale),
6561
- z: import_editor_props45.numberPropTypeUtil.create(defaultValues.scale)
6666
+ var initialScaleValue = import_editor_props46.scaleTransformPropTypeUtil.create({
6667
+ x: import_editor_props46.numberPropTypeUtil.create(defaultValues.scale),
6668
+ y: import_editor_props46.numberPropTypeUtil.create(defaultValues.scale),
6669
+ z: import_editor_props46.numberPropTypeUtil.create(defaultValues.scale)
6562
6670
  });
6563
- var initialRotateValue = import_editor_props45.rotateTransformPropTypeUtil.create({
6671
+ var initialRotateValue = import_editor_props46.rotateTransformPropTypeUtil.create({
6564
6672
  x: { $$type: "size", value: { size: defaultValues.rotate.size, unit: defaultValues.rotate.unit } },
6565
6673
  y: { $$type: "size", value: { size: defaultValues.rotate.size, unit: defaultValues.rotate.unit } },
6566
6674
  z: { $$type: "size", value: { size: defaultValues.rotate.size, unit: defaultValues.rotate.unit } }
6567
6675
  });
6568
- var initialSkewValue = import_editor_props45.skewTransformPropTypeUtil.create({
6676
+ var initialSkewValue = import_editor_props46.skewTransformPropTypeUtil.create({
6569
6677
  x: { $$type: "size", value: { size: defaultValues.skew.size, unit: defaultValues.skew.unit } },
6570
6678
  y: { $$type: "size", value: { size: defaultValues.skew.size, unit: defaultValues.skew.unit } }
6571
6679
  });
@@ -6578,7 +6686,7 @@ var import_i18n46 = require("@wordpress/i18n");
6578
6686
  // src/controls/transform-control/functions/move.tsx
6579
6687
  var React94 = __toESM(require("react"));
6580
6688
  var import_react55 = require("react");
6581
- var import_editor_props46 = require("@elementor/editor-props");
6689
+ var import_editor_props47 = require("@elementor/editor-props");
6582
6690
  var import_icons28 = require("@elementor/icons");
6583
6691
  var import_ui78 = require("@elementor/ui");
6584
6692
  var import_i18n42 = require("@wordpress/i18n");
@@ -6623,7 +6731,7 @@ var moveAxisControls = [
6623
6731
  }
6624
6732
  ];
6625
6733
  var Move = () => {
6626
- const context = useBoundProp(import_editor_props46.moveTransformPropTypeUtil);
6734
+ const context = useBoundProp(import_editor_props47.moveTransformPropTypeUtil);
6627
6735
  const rowRefs = [(0, import_react55.useRef)(null), (0, import_react55.useRef)(null), (0, import_react55.useRef)(null)];
6628
6736
  return /* @__PURE__ */ React94.createElement(import_ui78.Grid, { container: true, spacing: 1.5 }, /* @__PURE__ */ React94.createElement(PropProvider, { ...context }, /* @__PURE__ */ React94.createElement(PropKeyProvider, { bind: TransformFunctionKeys.move }, moveAxisControls.map((control, index) => /* @__PURE__ */ React94.createElement(
6629
6737
  AxisRow,
@@ -6640,7 +6748,7 @@ var Move = () => {
6640
6748
  // src/controls/transform-control/functions/rotate.tsx
6641
6749
  var React95 = __toESM(require("react"));
6642
6750
  var import_react56 = require("react");
6643
- var import_editor_props47 = require("@elementor/editor-props");
6751
+ var import_editor_props48 = require("@elementor/editor-props");
6644
6752
  var import_icons29 = require("@elementor/icons");
6645
6753
  var import_ui79 = require("@elementor/ui");
6646
6754
  var import_i18n43 = require("@wordpress/i18n");
@@ -6663,7 +6771,7 @@ var rotateAxisControls = [
6663
6771
  ];
6664
6772
  var rotateUnits = ["deg", "rad", "grad", "turn"];
6665
6773
  var Rotate = () => {
6666
- const context = useBoundProp(import_editor_props47.rotateTransformPropTypeUtil);
6774
+ const context = useBoundProp(import_editor_props48.rotateTransformPropTypeUtil);
6667
6775
  const rowRefs = [(0, import_react56.useRef)(null), (0, import_react56.useRef)(null), (0, import_react56.useRef)(null)];
6668
6776
  return /* @__PURE__ */ React95.createElement(import_ui79.Grid, { container: true, spacing: 1.5 }, /* @__PURE__ */ React95.createElement(PropProvider, { ...context }, /* @__PURE__ */ React95.createElement(PropKeyProvider, { bind: TransformFunctionKeys.rotate }, rotateAxisControls.map((control, index) => /* @__PURE__ */ React95.createElement(
6669
6777
  AxisRow,
@@ -6679,7 +6787,7 @@ var Rotate = () => {
6679
6787
  // src/controls/transform-control/functions/scale.tsx
6680
6788
  var React97 = __toESM(require("react"));
6681
6789
  var import_react57 = require("react");
6682
- var import_editor_props48 = require("@elementor/editor-props");
6790
+ var import_editor_props49 = require("@elementor/editor-props");
6683
6791
  var import_icons30 = require("@elementor/icons");
6684
6792
  var import_ui81 = require("@elementor/ui");
6685
6793
  var import_i18n44 = require("@wordpress/i18n");
@@ -6710,7 +6818,7 @@ var scaleAxisControls = [
6710
6818
  }
6711
6819
  ];
6712
6820
  var Scale = () => {
6713
- const context = useBoundProp(import_editor_props48.scaleTransformPropTypeUtil);
6821
+ const context = useBoundProp(import_editor_props49.scaleTransformPropTypeUtil);
6714
6822
  const rowRefs = [(0, import_react57.useRef)(null), (0, import_react57.useRef)(null), (0, import_react57.useRef)(null)];
6715
6823
  return /* @__PURE__ */ React97.createElement(import_ui81.Grid, { container: true, spacing: 1.5 }, /* @__PURE__ */ React97.createElement(PropProvider, { ...context }, /* @__PURE__ */ React97.createElement(PropKeyProvider, { bind: TransformFunctionKeys.scale }, scaleAxisControls.map((control, index) => /* @__PURE__ */ React97.createElement(ScaleAxisRow, { key: control.bind, ...control, anchorRef: rowRefs[index] })))));
6716
6824
  };
@@ -6718,7 +6826,7 @@ var Scale = () => {
6718
6826
  // src/controls/transform-control/functions/skew.tsx
6719
6827
  var React98 = __toESM(require("react"));
6720
6828
  var import_react58 = require("react");
6721
- var import_editor_props49 = require("@elementor/editor-props");
6829
+ var import_editor_props50 = require("@elementor/editor-props");
6722
6830
  var import_icons31 = require("@elementor/icons");
6723
6831
  var import_ui82 = require("@elementor/ui");
6724
6832
  var import_i18n45 = require("@wordpress/i18n");
@@ -6736,7 +6844,7 @@ var skewAxisControls = [
6736
6844
  ];
6737
6845
  var skewUnits = ["deg", "rad", "grad", "turn"];
6738
6846
  var Skew = () => {
6739
- const context = useBoundProp(import_editor_props49.skewTransformPropTypeUtil);
6847
+ const context = useBoundProp(import_editor_props50.skewTransformPropTypeUtil);
6740
6848
  const rowRefs = [(0, import_react58.useRef)(null), (0, import_react58.useRef)(null), (0, import_react58.useRef)(null)];
6741
6849
  return /* @__PURE__ */ React98.createElement(import_ui82.Grid, { container: true, spacing: 1.5 }, /* @__PURE__ */ React98.createElement(PropProvider, { ...context }, /* @__PURE__ */ React98.createElement(PropKeyProvider, { bind: TransformFunctionKeys.skew }, skewAxisControls.map((control, index) => /* @__PURE__ */ React98.createElement(
6742
6850
  AxisRow,
@@ -6751,7 +6859,7 @@ var Skew = () => {
6751
6859
 
6752
6860
  // src/controls/transform-control/use-transform-tabs-history.tsx
6753
6861
  var import_react59 = require("react");
6754
- var import_editor_props50 = require("@elementor/editor-props");
6862
+ var import_editor_props51 = require("@elementor/editor-props");
6755
6863
  var import_ui83 = require("@elementor/ui");
6756
6864
  var useTransformTabsHistory = ({
6757
6865
  move: initialMove,
@@ -6759,10 +6867,10 @@ var useTransformTabsHistory = ({
6759
6867
  rotate: initialRotate,
6760
6868
  skew: initialSkew
6761
6869
  }) => {
6762
- const { value: moveValue, setValue: setMoveValue } = useBoundProp(import_editor_props50.moveTransformPropTypeUtil);
6763
- const { value: scaleValue, setValue: setScaleValue } = useBoundProp(import_editor_props50.scaleTransformPropTypeUtil);
6764
- const { value: rotateValue, setValue: setRotateValue } = useBoundProp(import_editor_props50.rotateTransformPropTypeUtil);
6765
- const { value: skewValue, setValue: setSkewValue } = useBoundProp(import_editor_props50.skewTransformPropTypeUtil);
6870
+ const { value: moveValue, setValue: setMoveValue } = useBoundProp(import_editor_props51.moveTransformPropTypeUtil);
6871
+ const { value: scaleValue, setValue: setScaleValue } = useBoundProp(import_editor_props51.scaleTransformPropTypeUtil);
6872
+ const { value: rotateValue, setValue: setRotateValue } = useBoundProp(import_editor_props51.rotateTransformPropTypeUtil);
6873
+ const { value: skewValue, setValue: setSkewValue } = useBoundProp(import_editor_props51.skewTransformPropTypeUtil);
6766
6874
  const { openItemIndex, items: items2 } = useRepeaterContext();
6767
6875
  const getCurrentTransformType = () => {
6768
6876
  switch (true) {
@@ -6922,7 +7030,7 @@ var import_i18n50 = require("@wordpress/i18n");
6922
7030
  // src/controls/transform-control/transform-base-controls/children-perspective-control.tsx
6923
7031
  var React102 = __toESM(require("react"));
6924
7032
  var import_react60 = require("react");
6925
- var import_editor_props51 = require("@elementor/editor-props");
7033
+ var import_editor_props52 = require("@elementor/editor-props");
6926
7034
  var import_ui86 = require("@elementor/ui");
6927
7035
  var import_i18n48 = require("@wordpress/i18n");
6928
7036
  var ORIGIN_UNITS = ["px", "%", "em", "rem"];
@@ -6949,7 +7057,7 @@ var ChildrenPerspectiveControl = () => {
6949
7057
  var PerspectiveControl = () => /* @__PURE__ */ React102.createElement(PropKeyProvider, { bind: "perspective" }, /* @__PURE__ */ React102.createElement(ControlFields, { control: PERSPECTIVE_CONTROL_FIELD, key: PERSPECTIVE_CONTROL_FIELD.bind }));
6950
7058
  var PerspectiveOriginControl = () => /* @__PURE__ */ React102.createElement(PropKeyProvider, { bind: "perspective-origin" }, /* @__PURE__ */ React102.createElement(PerspectiveOriginControlProvider, null));
6951
7059
  var PerspectiveOriginControlProvider = () => {
6952
- const context = useBoundProp(import_editor_props51.perspectiveOriginPropTypeUtil);
7060
+ const context = useBoundProp(import_editor_props52.perspectiveOriginPropTypeUtil);
6953
7061
  return /* @__PURE__ */ React102.createElement(PropProvider, { ...context }, CHILDREN_PERSPECTIVE_FIELDS.map((control) => /* @__PURE__ */ React102.createElement(PropKeyProvider, { bind: control.bind, key: control.bind }, /* @__PURE__ */ React102.createElement(ControlFields, { control }))));
6954
7062
  };
6955
7063
  var ControlFields = ({ control }) => {
@@ -6960,7 +7068,7 @@ var ControlFields = ({ control }) => {
6960
7068
  // src/controls/transform-control/transform-base-controls/transform-origin-control.tsx
6961
7069
  var React103 = __toESM(require("react"));
6962
7070
  var import_react61 = require("react");
6963
- var import_editor_props52 = require("@elementor/editor-props");
7071
+ var import_editor_props53 = require("@elementor/editor-props");
6964
7072
  var import_ui87 = require("@elementor/ui");
6965
7073
  var import_i18n49 = require("@wordpress/i18n");
6966
7074
  var TRANSFORM_ORIGIN_UNITS = ["px", "%", "em", "rem"];
@@ -6986,7 +7094,7 @@ var TransformOriginControl = () => {
6986
7094
  return /* @__PURE__ */ React103.createElement(import_ui87.Stack, { direction: "column", spacing: 1.5 }, /* @__PURE__ */ React103.createElement(ControlFormLabel, null, (0, import_i18n49.__)("Transform", "elementor")), TRANSFORM_ORIGIN_FIELDS.map((control) => /* @__PURE__ */ React103.createElement(ControlFields2, { control, key: control.bind })));
6987
7095
  };
6988
7096
  var ControlFields2 = ({ control }) => {
6989
- const context = useBoundProp(import_editor_props52.transformOriginPropTypeUtil);
7097
+ const context = useBoundProp(import_editor_props53.transformOriginPropTypeUtil);
6990
7098
  const rowRef = (0, import_react61.useRef)(null);
6991
7099
  return /* @__PURE__ */ React103.createElement(PropProvider, { ...context }, /* @__PURE__ */ React103.createElement(PropKeyProvider, { bind: control.bind }, /* @__PURE__ */ React103.createElement(PopoverGridContainer, { ref: rowRef }, /* @__PURE__ */ React103.createElement(import_ui87.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React103.createElement(ControlFormLabel, null, control.label)), /* @__PURE__ */ React103.createElement(import_ui87.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React103.createElement(SizeControl, { variant: "length", units: control.units, anchorRef: rowRef })))));
6992
7100
  };
@@ -7034,7 +7142,7 @@ var TransformSettingsControl = ({
7034
7142
  var SIZE11 = "tiny";
7035
7143
  var TransformRepeaterControl = createControl(
7036
7144
  ({ showChildrenPerspective }) => {
7037
- const context = useBoundProp(import_editor_props53.transformPropTypeUtil);
7145
+ const context = useBoundProp(import_editor_props54.transformPropTypeUtil);
7038
7146
  const headerRef = (0, import_react62.useRef)(null);
7039
7147
  const popupState = (0, import_ui89.usePopupState)({ variant: "popover" });
7040
7148
  return /* @__PURE__ */ React105.createElement(PropProvider, { ...context }, /* @__PURE__ */ React105.createElement(
@@ -7062,7 +7170,7 @@ var Repeater2 = ({
7062
7170
  propType,
7063
7171
  popupState
7064
7172
  }) => {
7065
- const transformFunctionsContext = useBoundProp(import_editor_props53.transformFunctionsPropTypeUtil);
7173
+ const transformFunctionsContext = useBoundProp(import_editor_props54.transformFunctionsPropTypeUtil);
7066
7174
  const availableValues = [initialTransformValue, initialScaleValue, initialRotateValue, initialSkewValue];
7067
7175
  const { value: transformValues, bind } = transformFunctionsContext;
7068
7176
  const getInitialValue2 = () => {
@@ -7073,7 +7181,7 @@ var Repeater2 = ({
7073
7181
  ControlRepeater,
7074
7182
  {
7075
7183
  initial: getInitialValue2() ?? initialTransformValue,
7076
- propTypeUtil: import_editor_props53.transformFunctionsPropTypeUtil
7184
+ propTypeUtil: import_editor_props54.transformFunctionsPropTypeUtil
7077
7185
  },
7078
7186
  /* @__PURE__ */ React105.createElement(
7079
7187
  RepeaterHeader,
@@ -7116,7 +7224,7 @@ var TransformBasePopoverTrigger = ({
7116
7224
  // src/controls/transition-control/transition-repeater-control.tsx
7117
7225
  var React108 = __toESM(require("react"));
7118
7226
  var import_react65 = require("react");
7119
- var import_editor_props56 = require("@elementor/editor-props");
7227
+ var import_editor_props57 = require("@elementor/editor-props");
7120
7228
  var import_icons36 = require("@elementor/icons");
7121
7229
  var import_ui92 = require("@elementor/ui");
7122
7230
  var import_utils7 = require("@elementor/utils");
@@ -7125,11 +7233,11 @@ var import_i18n54 = require("@wordpress/i18n");
7125
7233
  // src/controls/selection-size-control.tsx
7126
7234
  var React106 = __toESM(require("react"));
7127
7235
  var import_react63 = require("react");
7128
- var import_editor_props54 = require("@elementor/editor-props");
7236
+ var import_editor_props55 = require("@elementor/editor-props");
7129
7237
  var import_ui90 = require("@elementor/ui");
7130
7238
  var SelectionSizeControl = createControl(
7131
7239
  ({ selectionLabel, sizeLabel, selectionConfig, sizeConfigMap }) => {
7132
- const { value, setValue, propType } = useBoundProp(import_editor_props54.selectionSizePropTypeUtil);
7240
+ const { value, setValue, propType } = useBoundProp(import_editor_props55.selectionSizePropTypeUtil);
7133
7241
  const rowRef = (0, import_react63.useRef)(null);
7134
7242
  const sizeFieldId = sizeLabel.replace(/\s+/g, "-").toLowerCase();
7135
7243
  const currentSizeConfig = (0, import_react63.useMemo)(() => {
@@ -7346,7 +7454,7 @@ function subscribeToTransitionEvent() {
7346
7454
  // src/controls/transition-control/transition-selector.tsx
7347
7455
  var React107 = __toESM(require("react"));
7348
7456
  var import_react64 = require("react");
7349
- var import_editor_props55 = require("@elementor/editor-props");
7457
+ var import_editor_props56 = require("@elementor/editor-props");
7350
7458
  var import_editor_ui14 = require("@elementor/editor-ui");
7351
7459
  var import_icons35 = require("@elementor/icons");
7352
7460
  var import_ui91 = require("@elementor/ui");
@@ -7427,7 +7535,7 @@ var TransitionSelector = ({
7427
7535
  disabledItems = [],
7428
7536
  showPromotion = false
7429
7537
  }) => {
7430
- const { value, setValue } = useBoundProp(import_editor_props55.keyValuePropTypeUtil);
7538
+ const { value, setValue } = useBoundProp(import_editor_props56.keyValuePropTypeUtil);
7431
7539
  const {
7432
7540
  key: { value: transitionLabel }
7433
7541
  } = value;
@@ -7546,9 +7654,9 @@ var DURATION_CONFIG = {
7546
7654
  units: ["s", "ms"],
7547
7655
  defaultUnit: "ms"
7548
7656
  };
7549
- var childArrayPropTypeUtil = (0, import_editor_props56.createArrayPropUtils)(
7550
- import_editor_props56.selectionSizePropTypeUtil.key,
7551
- import_editor_props56.selectionSizePropTypeUtil.schema,
7657
+ var childArrayPropTypeUtil = (0, import_editor_props57.createArrayPropUtils)(
7658
+ import_editor_props57.selectionSizePropTypeUtil.key,
7659
+ import_editor_props57.selectionSizePropTypeUtil.schema,
7552
7660
  "transition"
7553
7661
  );
7554
7662
  subscribeToTransitionEvent();
@@ -7592,7 +7700,7 @@ var isItemDisabled = (item) => {
7592
7700
  };
7593
7701
  var getChildControlConfig = (recentlyUsedList, disabledItems, showPromotion) => {
7594
7702
  return {
7595
- propTypeUtil: import_editor_props56.selectionSizePropTypeUtil,
7703
+ propTypeUtil: import_editor_props57.selectionSizePropTypeUtil,
7596
7704
  component: SelectionSizeControl,
7597
7705
  props: getSelectionSizeProps(recentlyUsedList, disabledItems, showPromotion),
7598
7706
  isItemDisabled
@@ -7723,17 +7831,17 @@ var TransitionRepeaterControl = createControl(
7723
7831
  // src/controls/date-time-control.tsx
7724
7832
  var React109 = __toESM(require("react"));
7725
7833
  var dayjs = __toESM(require("dayjs"));
7726
- var import_editor_props57 = require("@elementor/editor-props");
7727
7834
  var import_editor_props58 = require("@elementor/editor-props");
7835
+ var import_editor_props59 = require("@elementor/editor-props");
7728
7836
  var import_ui93 = require("@elementor/ui");
7729
7837
  var DATE_FORMAT = "YYYY-MM-DD";
7730
7838
  var TIME_FORMAT = "HH:mm";
7731
7839
  var DateTimeControl = createControl(({ inputDisabled }) => {
7732
- const { value, setValue, ...propContext } = useBoundProp(import_editor_props58.DateTimePropTypeUtil);
7840
+ const { value, setValue, ...propContext } = useBoundProp(import_editor_props59.DateTimePropTypeUtil);
7733
7841
  const handleChange = (newValue, meta) => {
7734
7842
  const field = meta.bind;
7735
7843
  const fieldValue = newValue[field];
7736
- if ((0, import_editor_props57.isTransformable)(fieldValue)) {
7844
+ if ((0, import_editor_props58.isTransformable)(fieldValue)) {
7737
7845
  return setValue({ ...value, [field]: fieldValue });
7738
7846
  }
7739
7847
  let formattedValue = "";
@@ -7772,7 +7880,7 @@ var DateTimeControl = createControl(({ inputDisabled }) => {
7772
7880
  return /* @__PURE__ */ React109.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React109.createElement(ControlActions, null, /* @__PURE__ */ React109.createElement(import_ui93.LocalizationProvider, null, /* @__PURE__ */ React109.createElement(import_ui93.Box, { display: "flex", gap: 1, alignItems: "center" }, /* @__PURE__ */ React109.createElement(PropKeyProvider, { bind: "date" }, /* @__PURE__ */ React109.createElement(
7773
7881
  import_ui93.DatePicker,
7774
7882
  {
7775
- value: parseDateValue(import_editor_props57.stringPropTypeUtil.extract(value?.date)),
7883
+ value: parseDateValue(import_editor_props58.stringPropTypeUtil.extract(value?.date)),
7776
7884
  onChange: (v) => handleChange({ date: v }, { bind: "date" }),
7777
7885
  disabled: inputDisabled,
7778
7886
  slotProps: {
@@ -7784,7 +7892,7 @@ var DateTimeControl = createControl(({ inputDisabled }) => {
7784
7892
  )), /* @__PURE__ */ React109.createElement(PropKeyProvider, { bind: "time" }, /* @__PURE__ */ React109.createElement(
7785
7893
  import_ui93.TimePicker,
7786
7894
  {
7787
- value: parseTimeValue(import_editor_props57.stringPropTypeUtil.extract(value?.time)),
7895
+ value: parseTimeValue(import_editor_props58.stringPropTypeUtil.extract(value?.time)),
7788
7896
  onChange: (v) => handleChange({ time: v }, { bind: "time" }),
7789
7897
  disabled: inputDisabled,
7790
7898
  slotProps: {
@@ -7798,13 +7906,13 @@ var DateTimeControl = createControl(({ inputDisabled }) => {
7798
7906
 
7799
7907
  // src/controls/date-range-control.tsx
7800
7908
  var React111 = __toESM(require("react"));
7801
- var import_editor_props60 = require("@elementor/editor-props");
7909
+ var import_editor_props61 = require("@elementor/editor-props");
7802
7910
  var import_ui95 = require("@elementor/ui");
7803
7911
  var import_i18n55 = require("@wordpress/i18n");
7804
7912
 
7805
7913
  // src/controls/date-string-control.tsx
7806
7914
  var React110 = __toESM(require("react"));
7807
- var import_editor_props59 = require("@elementor/editor-props");
7915
+ var import_editor_props60 = require("@elementor/editor-props");
7808
7916
  var import_ui94 = require("@elementor/ui");
7809
7917
 
7810
7918
  // src/utils/date-time.ts
@@ -7839,7 +7947,7 @@ function parseTimeString(raw) {
7839
7947
  // src/controls/date-string-control.tsx
7840
7948
  var DateStringControl = createControl(
7841
7949
  ({ inputDisabled, ariaLabel, error, coerceInvalidToNull = false }) => {
7842
- const { value, setValue, disabled } = useBoundProp(import_editor_props59.dateStringPropTypeUtil);
7950
+ const { value, setValue, disabled } = useBoundProp(import_editor_props60.dateStringPropTypeUtil);
7843
7951
  const isDisabled = inputDisabled ?? disabled;
7844
7952
  const slotProps = {
7845
7953
  textField: {
@@ -7887,9 +7995,9 @@ var isMaxBeforeMin = (minIso, maxIso) => {
7887
7995
  };
7888
7996
  var RANGE_ERROR_MESSAGE = (0, import_i18n55.__)("Max date must be on or after Min date", "elementor");
7889
7997
  var DateRangeControl = createControl(() => {
7890
- const { value, setValue, ...propContext } = useBoundProp(import_editor_props60.dateRangePropTypeUtil);
7891
- const minString = import_editor_props60.dateStringPropTypeUtil.extract(value?.min);
7892
- const maxString = import_editor_props60.dateStringPropTypeUtil.extract(value?.max);
7998
+ const { value, setValue, ...propContext } = useBoundProp(import_editor_props61.dateRangePropTypeUtil);
7999
+ const minString = import_editor_props61.dateStringPropTypeUtil.extract(value?.min);
8000
+ const maxString = import_editor_props61.dateStringPropTypeUtil.extract(value?.max);
7893
8001
  const hasInvalidRange = isMaxBeforeMin(minString, maxString);
7894
8002
  return /* @__PURE__ */ React111.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React111.createElement(import_ui95.Stack, { gap: 0.75 }, /* @__PURE__ */ React111.createElement(import_ui95.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React111.createElement(import_ui95.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React111.createElement(import_ui95.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React111.createElement(ControlFormLabel, null, RANGE_LABELS.min)), /* @__PURE__ */ React111.createElement(import_ui95.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React111.createElement(
7895
8003
  BoundDateStringControl,
@@ -7917,11 +8025,11 @@ var BoundDateStringControl = ({
7917
8025
 
7918
8026
  // src/controls/time-string-control.tsx
7919
8027
  var React112 = __toESM(require("react"));
7920
- var import_editor_props61 = require("@elementor/editor-props");
8028
+ var import_editor_props62 = require("@elementor/editor-props");
7921
8029
  var import_ui96 = require("@elementor/ui");
7922
8030
  var TimeStringControl = createControl(
7923
8031
  ({ inputDisabled, ariaLabel, error, coerceInvalidToNull = false }) => {
7924
- const { value, setValue, disabled } = useBoundProp(import_editor_props61.timeStringPropTypeUtil);
8032
+ const { value, setValue, disabled } = useBoundProp(import_editor_props62.timeStringPropTypeUtil);
7925
8033
  const isDisabled = inputDisabled ?? disabled;
7926
8034
  const slotProps = {
7927
8035
  textField: {
@@ -7958,7 +8066,7 @@ var TimeStringControl = createControl(
7958
8066
 
7959
8067
  // src/controls/time-range-control.tsx
7960
8068
  var React113 = __toESM(require("react"));
7961
- var import_editor_props62 = require("@elementor/editor-props");
8069
+ var import_editor_props63 = require("@elementor/editor-props");
7962
8070
  var import_ui97 = require("@elementor/ui");
7963
8071
  var import_i18n56 = require("@wordpress/i18n");
7964
8072
  var RANGE_LABELS2 = {
@@ -7966,7 +8074,7 @@ var RANGE_LABELS2 = {
7966
8074
  max: (0, import_i18n56.__)("End time", "elementor")
7967
8075
  };
7968
8076
  var TimeRangeControl = createControl(() => {
7969
- const { value, setValue, ...propContext } = useBoundProp(import_editor_props62.timeRangePropTypeUtil);
8077
+ const { value, setValue, ...propContext } = useBoundProp(import_editor_props63.timeRangePropTypeUtil);
7970
8078
  return /* @__PURE__ */ React113.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React113.createElement(import_ui97.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React113.createElement(import_ui97.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React113.createElement(import_ui97.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React113.createElement(ControlFormLabel, null, RANGE_LABELS2.min)), /* @__PURE__ */ React113.createElement(import_ui97.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React113.createElement(BoundTimeStringControl, { bind: "min", ariaLabel: RANGE_LABELS2.min }))), /* @__PURE__ */ React113.createElement(import_ui97.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React113.createElement(import_ui97.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React113.createElement(ControlFormLabel, null, RANGE_LABELS2.max)), /* @__PURE__ */ React113.createElement(import_ui97.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React113.createElement(BoundTimeStringControl, { bind: "max", ariaLabel: RANGE_LABELS2.max })))));
7971
8079
  });
7972
8080
  var BoundTimeStringControl = ({ bind, ariaLabel }) => {
@@ -7974,10 +8082,10 @@ var BoundTimeStringControl = ({ bind, ariaLabel }) => {
7974
8082
  };
7975
8083
 
7976
8084
  // src/controls/inline-editing-control.tsx
7977
- var React115 = __toESM(require("react"));
7978
- var import_react68 = require("react");
7979
- var import_editor_props64 = require("@elementor/editor-props");
7980
- var import_ui99 = require("@elementor/ui");
8085
+ var React117 = __toESM(require("react"));
8086
+ var import_react71 = require("react");
8087
+ var import_editor_props65 = require("@elementor/editor-props");
8088
+ var import_ui101 = require("@elementor/ui");
7981
8089
 
7982
8090
  // src/components/inline-editor.tsx
7983
8091
  var React114 = __toESM(require("react"));
@@ -7998,7 +8106,7 @@ var import_extension_underline = __toESM(require("@tiptap/extension-underline"))
7998
8106
  var import_react67 = require("@tiptap/react");
7999
8107
 
8000
8108
  // src/utils/inline-editing.ts
8001
- var import_editor_props63 = require("@elementor/editor-props");
8109
+ var import_editor_props64 = require("@elementor/editor-props");
8002
8110
  function isEmpty(value = "") {
8003
8111
  if (!value) {
8004
8112
  return true;
@@ -8016,11 +8124,11 @@ function htmlToPlainText(html) {
8016
8124
  return doc.body.textContent ?? "";
8017
8125
  }
8018
8126
  function extractInlineHtmlContent(propValue) {
8019
- if (import_editor_props63.escapedHtmlPropTypeUtil.isValid(propValue)) {
8020
- return import_editor_props63.escapedHtmlPropTypeUtil.extract(propValue) ?? "";
8127
+ if (import_editor_props64.escapedHtmlPropTypeUtil.isValid(propValue)) {
8128
+ return import_editor_props64.escapedHtmlPropTypeUtil.extract(propValue) ?? "";
8021
8129
  }
8022
- const htmlV3 = import_editor_props63.htmlV3PropTypeUtil.extract(propValue);
8023
- return import_editor_props63.stringPropTypeUtil.extract(htmlV3?.content ?? null) ?? "";
8130
+ const htmlV3 = import_editor_props64.htmlV3PropTypeUtil.extract(propValue);
8131
+ return import_editor_props64.stringPropTypeUtil.extract(htmlV3?.content ?? null) ?? "";
8024
8132
  }
8025
8133
 
8026
8134
  // src/components/inline-editor.tsx
@@ -8039,6 +8147,7 @@ var InlineEditor = React114.forwardRef((props, ref) => {
8039
8147
  onBlur = void 0,
8040
8148
  expectedTag = null,
8041
8149
  onEditorCreate,
8150
+ onEditorDestroy,
8042
8151
  wrapperClassName,
8043
8152
  onSelectionEnd,
8044
8153
  mountElement = null
@@ -8123,6 +8232,7 @@ var InlineEditor = React114.forwardRef((props, ref) => {
8123
8232
  }
8124
8233
  },
8125
8234
  onCreate: onEditorCreate ? ({ editor: mountedEditor }) => onEditorCreate(mountedEditor) : void 0,
8235
+ onDestroy: onEditorDestroy ? () => onEditorDestroy() : void 0,
8126
8236
  onBlur: mountElement ? void 0 : () => onBlurRef.current?.(),
8127
8237
  onSelectionUpdate: onSelectionEnd ? ({ editor: updatedEditor }) => onSelectionEnd(updatedEditor.view) : void 0
8128
8238
  });
@@ -8151,151 +8261,471 @@ var useOnUpdate = (callback, dependencies) => {
8151
8261
  }, dependencies);
8152
8262
  };
8153
8263
 
8154
- // src/controls/inline-editing-control.tsx
8155
- var InlineEditingControl = createControl(
8156
- ({
8157
- sx,
8158
- attributes,
8159
- props
8160
- }) => {
8161
- const { setValue, placeholder, value } = useBoundProp(import_editor_props64.escapedHtmlPropTypeUtil);
8162
- const { value: rawValue } = usePropKeyContext();
8163
- const content = value ?? extractInlineHtmlContent(rawValue);
8164
- const handleChange = (0, import_react68.useCallback)(
8165
- (newValue) => {
8166
- const html = newValue ?? "";
8167
- setValue(html);
8168
- },
8169
- [setValue]
8170
- );
8171
- return /* @__PURE__ */ React115.createElement(ControlActions, null, /* @__PURE__ */ React115.createElement(
8172
- import_ui99.Box,
8173
- {
8174
- sx: {
8175
- p: 0.8,
8176
- border: "1px solid",
8177
- borderColor: "grey.200",
8178
- borderRadius: "8px",
8179
- transition: "border-color .2s ease, box-shadow .2s ease",
8180
- "&:hover": {
8181
- borderColor: "black"
8182
- },
8183
- "&:focus-within": {
8184
- borderColor: "black",
8185
- boxShadow: "0 0 0 1px black"
8186
- },
8187
- "& .ProseMirror:focus": {
8188
- outline: "none"
8189
- },
8190
- "& .ProseMirror": {
8191
- minHeight: "70px",
8192
- fontSize: "12px",
8193
- "& a": {
8194
- color: "inherit"
8195
- },
8196
- "& .elementor-inline-editor-reset": {
8197
- margin: 0,
8198
- padding: 0
8199
- },
8200
- "&.is-empty::before": {
8201
- content: "attr(data-placeholder)",
8202
- color: "text.tertiary",
8203
- pointerEvents: "none",
8204
- position: "absolute",
8205
- opacity: 0.6
8206
- }
8207
- },
8208
- ".strip-styles *": {
8209
- all: "unset"
8210
- },
8211
- ...sx
8212
- },
8213
- ...attributes,
8214
- ...props
8215
- },
8216
- /* @__PURE__ */ React115.createElement(InlineEditor, { value: content, setValue: handleChange, placeholder: placeholder ?? null })
8217
- ));
8218
- }
8219
- );
8220
-
8221
- // src/controls/email-form-action-control/index.tsx
8222
- var React119 = __toESM(require("react"));
8223
- var import_editor_props67 = require("@elementor/editor-props");
8224
- var import_editor_ui16 = require("@elementor/editor-ui");
8225
- var import_ui103 = require("@elementor/ui");
8264
+ // src/components/inline-editor-toolbar.tsx
8265
+ var React116 = __toESM(require("react"));
8266
+ var import_react69 = require("react");
8267
+ var import_editor_elements7 = require("@elementor/editor-elements");
8268
+ var import_icons38 = require("@elementor/icons");
8269
+ var import_ui100 = require("@elementor/ui");
8270
+ var import_react70 = require("@tiptap/react");
8226
8271
  var import_i18n58 = require("@wordpress/i18n");
8227
8272
 
8228
- // src/controls/email-form-action-control/fields.tsx
8229
- var React118 = __toESM(require("react"));
8230
- var import_editor_ui15 = require("@elementor/editor-ui");
8231
- var import_ui102 = require("@elementor/ui");
8273
+ // src/components/url-popover.tsx
8274
+ var React115 = __toESM(require("react"));
8275
+ var import_react68 = require("react");
8276
+ var import_icons37 = require("@elementor/icons");
8277
+ var import_ui99 = require("@elementor/ui");
8232
8278
  var import_i18n57 = require("@wordpress/i18n");
8233
-
8234
- // src/hooks/use-form-field-suggestions.ts
8235
- var import_editor_elements7 = require("@elementor/editor-elements");
8236
- var import_editor_props65 = require("@elementor/editor-props");
8237
- var import_editor_v1_adapters2 = require("@elementor/editor-v1-adapters");
8238
- var FORM_FIELD_WIDGET_TYPES = [
8239
- "e-form-input",
8240
- "e-form-textarea",
8241
- "e-form-checkbox",
8242
- "e-form-radio-button",
8243
- "e-form-select",
8244
- "e-form-date-picker",
8245
- "e-form-time-picker"
8246
- ];
8247
- var FORM_ELEMENT_TYPE = "e-form";
8248
- var CSS_ID_PROP_KEY = "_cssid";
8249
- function isFormFieldWidgetType(widgetType) {
8250
- return FORM_FIELD_WIDGET_TYPES.includes(widgetType);
8251
- }
8252
- function extractStringPropValue(value) {
8253
- return import_editor_props65.stringPropTypeUtil.extract(value);
8254
- }
8255
- function getSettingWithDefault(child, widgetType, key) {
8256
- const fromGet = child.settings.get(key);
8257
- if (fromGet !== null && fromGet !== void 0) {
8258
- return fromGet;
8259
- }
8260
- const schema = (0, import_editor_elements7.getWidgetsCache)()?.[widgetType]?.atomic_props_schema;
8261
- return schema?.[key]?.default ?? null;
8262
- }
8263
- function getFieldCssId(child, widgetType) {
8264
- return extractStringPropValue(getSettingWithDefault(child, widgetType, CSS_ID_PROP_KEY));
8265
- }
8266
- function getFormContainer(elementId) {
8267
- let container = (0, import_editor_elements7.getContainer)(elementId);
8268
- while (container) {
8269
- if (container.model.get("elType") === FORM_ELEMENT_TYPE) {
8270
- return container;
8279
+ var UrlPopover = ({
8280
+ popupState,
8281
+ restoreValue,
8282
+ anchorRef,
8283
+ value,
8284
+ onChange,
8285
+ openInNewTab,
8286
+ onToggleNewTab
8287
+ }) => {
8288
+ const inputRef = (0, import_react68.useRef)(null);
8289
+ (0, import_react68.useEffect)(() => {
8290
+ if (popupState.isOpen) {
8291
+ requestAnimationFrame(() => inputRef.current?.focus());
8271
8292
  }
8272
- container = container.parent ?? null;
8273
- }
8274
- return null;
8275
- }
8276
- function useFormFieldSuggestions(options) {
8277
- return (0, import_editor_v1_adapters2.__privateUseListenTo)(
8278
- [
8279
- (0, import_editor_v1_adapters2.v1ReadyEvent)(),
8280
- (0, import_editor_v1_adapters2.commandEndEvent)("document/elements/create"),
8281
- (0, import_editor_v1_adapters2.commandEndEvent)("document/elements/delete"),
8282
- (0, import_editor_v1_adapters2.commandEndEvent)("document/elements/set-settings")
8283
- ],
8284
- () => {
8285
- const selectedElements = (0, import_editor_elements7.getSelectedElements)();
8286
- const selectedElement = selectedElements[0];
8287
- if (!selectedElement) {
8288
- return [];
8289
- }
8290
- const formContainer = getFormContainer(selectedElement.id);
8291
- if (!formContainer?.children) {
8292
- return [];
8293
+ }, [popupState.isOpen]);
8294
+ const handleClose = () => {
8295
+ restoreValue();
8296
+ popupState.close();
8297
+ };
8298
+ return /* @__PURE__ */ React115.createElement(
8299
+ import_ui99.Popover,
8300
+ {
8301
+ slotProps: {
8302
+ paper: { sx: { borderRadius: "16px", width: anchorRef.current?.offsetWidth + "px", marginTop: -1 } }
8303
+ },
8304
+ ...(0, import_ui99.bindPopover)(popupState),
8305
+ anchorOrigin: { vertical: "top", horizontal: "left" },
8306
+ transformOrigin: { vertical: "top", horizontal: "left" },
8307
+ onClose: handleClose
8308
+ },
8309
+ /* @__PURE__ */ React115.createElement(import_ui99.Stack, { direction: "row", alignItems: "center", gap: 1, sx: { p: 1.5 } }, /* @__PURE__ */ React115.createElement(
8310
+ import_ui99.TextField,
8311
+ {
8312
+ value,
8313
+ onChange,
8314
+ size: "tiny",
8315
+ fullWidth: true,
8316
+ placeholder: (0, import_i18n57.__)("Type a URL", "elementor"),
8317
+ inputProps: { ref: inputRef },
8318
+ color: "secondary",
8319
+ InputProps: { sx: { borderRadius: "8px" } },
8320
+ onKeyUp: (event) => event.key === "Enter" && handleClose()
8293
8321
  }
8294
- const suggestions = [];
8295
- const seenCssIds = /* @__PURE__ */ new Set();
8296
- formContainer.children.forEachRecursive?.((child) => {
8297
- const widgetType = child.model.get("widgetType");
8298
- if (!widgetType || !isFormFieldWidgetType(widgetType)) {
8322
+ ), /* @__PURE__ */ React115.createElement(import_ui99.Tooltip, { title: (0, import_i18n57.__)("Open in a new tab", "elementor") }, /* @__PURE__ */ React115.createElement(
8323
+ import_ui99.ToggleButton,
8324
+ {
8325
+ size: "tiny",
8326
+ value: "newTab",
8327
+ selected: openInNewTab,
8328
+ onClick: onToggleNewTab,
8329
+ "aria-label": (0, import_i18n57.__)("Open in a new tab", "elementor"),
8330
+ sx: { borderRadius: "8px" }
8331
+ },
8332
+ /* @__PURE__ */ React115.createElement(import_icons37.ExternalLinkIcon, { fontSize: "tiny" })
8333
+ )))
8334
+ );
8335
+ };
8336
+
8337
+ // src/components/inline-editor-toolbar.tsx
8338
+ var InlineEditorToolbar = ({
8339
+ editor,
8340
+ elementId,
8341
+ sx = {},
8342
+ inControlPanel = false
8343
+ }) => {
8344
+ const [urlValue, setUrlValue] = (0, import_react69.useState)("");
8345
+ const [openInNewTab, setOpenInNewTab] = (0, import_react69.useState)(false);
8346
+ const toolbarRef = (0, import_react69.useRef)(null);
8347
+ const linkPopupState = (0, import_ui100.usePopupState)({ variant: "popover" });
8348
+ const isElementClickable = elementId ? checkIfElementIsClickable(elementId) : false;
8349
+ const editorState = (0, import_react70.useEditorState)({
8350
+ editor,
8351
+ selector: (ctx) => possibleFormats.filter((format) => ctx.editor.isActive(format))
8352
+ });
8353
+ const formatButtonsList = (0, import_react69.useMemo)(() => {
8354
+ const buttons = Object.values(formatButtons);
8355
+ if (isElementClickable) {
8356
+ return buttons.filter((button) => button.action !== "link");
8357
+ }
8358
+ return buttons;
8359
+ }, [isElementClickable]);
8360
+ const handleLinkClick = () => {
8361
+ const linkAttrs = editor.getAttributes("link");
8362
+ setUrlValue(linkAttrs.href || "");
8363
+ setOpenInNewTab(linkAttrs.target === "_blank");
8364
+ linkPopupState.open(toolbarRef.current);
8365
+ };
8366
+ const handleUrlChange = (event) => {
8367
+ setUrlValue(event.target.value);
8368
+ };
8369
+ const handleToggleNewTab = () => {
8370
+ setOpenInNewTab(!openInNewTab);
8371
+ };
8372
+ const handleUrlSubmit = () => {
8373
+ if (urlValue) {
8374
+ editor.chain().focus().setLink({
8375
+ href: urlValue,
8376
+ target: openInNewTab ? "_blank" : "_self"
8377
+ }).run();
8378
+ } else {
8379
+ editor.chain().focus().unsetLink().run();
8380
+ }
8381
+ if (elementId) {
8382
+ window.dispatchEvent(
8383
+ new CustomEvent("elementor:inline-link-changed", {
8384
+ detail: { elementId }
8385
+ })
8386
+ );
8387
+ }
8388
+ linkPopupState.close();
8389
+ };
8390
+ (0, import_react69.useEffect)(() => {
8391
+ if (!inControlPanel) {
8392
+ editor?.commands?.focus();
8393
+ }
8394
+ }, [editor, inControlPanel]);
8395
+ return /* @__PURE__ */ React116.createElement(
8396
+ import_ui100.Box,
8397
+ {
8398
+ ref: toolbarRef,
8399
+ sx: {
8400
+ display: "inline-flex",
8401
+ gap: 0.5,
8402
+ padding: 0.5,
8403
+ borderRadius: "8px",
8404
+ backgroundColor: "background.paper",
8405
+ boxShadow: "0 2px 8px rgba(0, 0, 0, 0.2)",
8406
+ alignItems: "center",
8407
+ visibility: linkPopupState.isOpen ? "hidden" : "visible",
8408
+ pointerEvents: linkPopupState.isOpen ? "none" : "all",
8409
+ ...sx,
8410
+ ...inControlPanel && {
8411
+ width: "100%",
8412
+ justifyContent: "center",
8413
+ flexDirection: "row",
8414
+ backgroundColor: "transparent",
8415
+ boxShadow: "none",
8416
+ borderWidth: "0",
8417
+ borderBottom: "1px solid",
8418
+ borderBottomColor: "grey.200",
8419
+ borderRadius: "0",
8420
+ position: "absolute",
8421
+ top: "0",
8422
+ left: "0"
8423
+ }
8424
+ }
8425
+ },
8426
+ /* @__PURE__ */ React116.createElement(import_ui100.Tooltip, { title: clearButton.label, placement: "top", sx: { borderRadius: "8px" } }, /* @__PURE__ */ React116.createElement(import_ui100.IconButton, { "aria-label": clearButton.label, onClick: () => clearButton.method(editor), size: "tiny" }, clearButton.icon)),
8427
+ /* @__PURE__ */ React116.createElement(
8428
+ import_ui100.ToggleButtonGroup,
8429
+ {
8430
+ value: editorState,
8431
+ size: "tiny",
8432
+ sx: {
8433
+ display: "flex",
8434
+ gap: 0.5,
8435
+ border: "none",
8436
+ [`& .${import_ui100.toggleButtonGroupClasses.firstButton}, & .${import_ui100.toggleButtonGroupClasses.middleButton}, & .${import_ui100.toggleButtonGroupClasses.lastButton}`]: {
8437
+ borderRadius: "8px",
8438
+ border: "none",
8439
+ marginLeft: 0,
8440
+ "&.Mui-selected": {
8441
+ marginLeft: 0
8442
+ },
8443
+ "& + &.Mui-selected": {
8444
+ marginLeft: 0
8445
+ }
8446
+ },
8447
+ ...inControlPanel && {
8448
+ justifyContent: "space-between",
8449
+ width: "100%",
8450
+ "& svg": {
8451
+ width: "0.7rem",
8452
+ height: "0.7rem",
8453
+ fill: "black"
8454
+ }
8455
+ }
8456
+ }
8457
+ },
8458
+ formatButtonsList.map((button) => /* @__PURE__ */ React116.createElement(import_ui100.Tooltip, { title: button.label, key: button.action, placement: "top" }, /* @__PURE__ */ React116.createElement(
8459
+ import_ui100.ToggleButton,
8460
+ {
8461
+ value: button.action,
8462
+ "aria-label": button.label,
8463
+ size: "tiny",
8464
+ onClick: () => {
8465
+ if (button.action === "link") {
8466
+ handleLinkClick();
8467
+ } else {
8468
+ button.method?.(editor);
8469
+ }
8470
+ editor?.commands?.focus();
8471
+ }
8472
+ },
8473
+ button.icon
8474
+ )))
8475
+ ),
8476
+ /* @__PURE__ */ React116.createElement(
8477
+ UrlPopover,
8478
+ {
8479
+ popupState: linkPopupState,
8480
+ anchorRef: toolbarRef,
8481
+ restoreValue: handleUrlSubmit,
8482
+ value: urlValue,
8483
+ onChange: handleUrlChange,
8484
+ openInNewTab,
8485
+ onToggleNewTab: handleToggleNewTab
8486
+ }
8487
+ )
8488
+ );
8489
+ };
8490
+ var checkIfElementIsClickable = (elementId) => {
8491
+ const container = (0, import_editor_elements7.getContainer)(elementId);
8492
+ const type = container?.model.get("widgetType");
8493
+ const isButton = type === "e-button";
8494
+ const hasLink = !!(0, import_editor_elements7.getElementSetting)(elementId, "link")?.value?.destination;
8495
+ return isButton || hasLink;
8496
+ };
8497
+ var toolbarButtons = {
8498
+ clear: {
8499
+ label: (0, import_i18n58.__)("Clear", "elementor"),
8500
+ icon: /* @__PURE__ */ React116.createElement(import_icons38.MinusIcon, { fontSize: "tiny" }),
8501
+ action: "clear",
8502
+ method: (editor) => {
8503
+ editor.chain().focus().clearNodes().unsetAllMarks().run();
8504
+ }
8505
+ },
8506
+ bold: {
8507
+ label: (0, import_i18n58.__)("Bold", "elementor"),
8508
+ icon: /* @__PURE__ */ React116.createElement(import_icons38.BoldIcon, { fontSize: "tiny" }),
8509
+ action: "bold",
8510
+ method: (editor) => {
8511
+ editor.chain().focus().toggleBold().run();
8512
+ }
8513
+ },
8514
+ italic: {
8515
+ label: (0, import_i18n58.__)("Italic", "elementor"),
8516
+ icon: /* @__PURE__ */ React116.createElement(import_icons38.ItalicIcon, { fontSize: "tiny" }),
8517
+ action: "italic",
8518
+ method: (editor) => {
8519
+ editor.chain().focus().toggleItalic().run();
8520
+ }
8521
+ },
8522
+ underline: {
8523
+ label: (0, import_i18n58.__)("Underline", "elementor"),
8524
+ icon: /* @__PURE__ */ React116.createElement(import_icons38.UnderlineIcon, { fontSize: "tiny" }),
8525
+ action: "underline",
8526
+ method: (editor) => {
8527
+ editor.chain().focus().toggleUnderline().run();
8528
+ }
8529
+ },
8530
+ strike: {
8531
+ label: (0, import_i18n58.__)("Strikethrough", "elementor"),
8532
+ icon: /* @__PURE__ */ React116.createElement(import_icons38.StrikethroughIcon, { fontSize: "tiny" }),
8533
+ action: "strike",
8534
+ method: (editor) => {
8535
+ editor.chain().focus().toggleStrike().run();
8536
+ }
8537
+ },
8538
+ superscript: {
8539
+ label: (0, import_i18n58.__)("Superscript", "elementor"),
8540
+ icon: /* @__PURE__ */ React116.createElement(import_icons38.SuperscriptIcon, { fontSize: "tiny" }),
8541
+ action: "superscript",
8542
+ method: (editor) => {
8543
+ editor.chain().focus().toggleSuperscript().run();
8544
+ }
8545
+ },
8546
+ subscript: {
8547
+ label: (0, import_i18n58.__)("Subscript", "elementor"),
8548
+ icon: /* @__PURE__ */ React116.createElement(import_icons38.SubscriptIcon, { fontSize: "tiny" }),
8549
+ action: "subscript",
8550
+ method: (editor) => {
8551
+ editor.chain().focus().toggleSubscript().run();
8552
+ }
8553
+ },
8554
+ link: {
8555
+ label: (0, import_i18n58.__)("Link", "elementor"),
8556
+ icon: /* @__PURE__ */ React116.createElement(import_icons38.LinkIcon, { fontSize: "tiny" }),
8557
+ action: "link",
8558
+ method: null
8559
+ }
8560
+ };
8561
+ var { clear: clearButton, ...formatButtons } = toolbarButtons;
8562
+ var possibleFormats = Object.keys(formatButtons);
8563
+
8564
+ // src/controls/inline-editing-control.tsx
8565
+ var InlineEditingControl = createControl(({ sx, attributes, props, context: { elementId } }) => {
8566
+ const { setValue, placeholder, value } = useBoundProp(import_editor_props65.escapedHtmlPropTypeUtil);
8567
+ const { value: rawValue } = usePropKeyContext();
8568
+ const content = value ?? extractInlineHtmlContent(rawValue);
8569
+ const [editor, setEditor] = (0, import_react71.useState)(null);
8570
+ const handleChange = (0, import_react71.useCallback)(
8571
+ (newValue) => {
8572
+ const html = newValue ?? "";
8573
+ setValue(html);
8574
+ },
8575
+ [setValue]
8576
+ );
8577
+ return /* @__PURE__ */ React117.createElement(ControlActions, null, /* @__PURE__ */ React117.createElement(import_ui101.Box, { sx: { position: "relative" } }, editor && editor.isEditable && /* @__PURE__ */ React117.createElement(
8578
+ InlineEditorToolbar,
8579
+ {
8580
+ editor,
8581
+ elementId,
8582
+ sx: {
8583
+ boxShadow: "none",
8584
+ border: "1px solid",
8585
+ borderColor: "grey.200",
8586
+ mb: 0.5
8587
+ },
8588
+ inControlPanel: true
8589
+ }
8590
+ ), /* @__PURE__ */ React117.createElement(
8591
+ import_ui101.Box,
8592
+ {
8593
+ sx: {
8594
+ p: 0.8,
8595
+ border: "1px solid",
8596
+ borderColor: "grey.200",
8597
+ borderRadius: "8px",
8598
+ transition: "border-color .2s ease, box-shadow .2s ease",
8599
+ "&:hover": {
8600
+ borderColor: "black"
8601
+ },
8602
+ "&:focus-within": {
8603
+ borderColor: "black",
8604
+ boxShadow: "0 0 0 1px black"
8605
+ },
8606
+ "& .ProseMirror:focus": {
8607
+ outline: "none"
8608
+ },
8609
+ "& .ProseMirror": {
8610
+ minHeight: "100px",
8611
+ fontSize: "12px",
8612
+ "& a": {
8613
+ color: "inherit"
8614
+ },
8615
+ "& .elementor-inline-editor-reset": {
8616
+ margin: 0,
8617
+ padding: 0
8618
+ },
8619
+ "&.is-empty::before": {
8620
+ content: "attr(data-placeholder)",
8621
+ color: "text.tertiary",
8622
+ pointerEvents: "none",
8623
+ position: "absolute",
8624
+ opacity: 0.6
8625
+ }
8626
+ },
8627
+ ".strip-styles *": {
8628
+ all: "unset"
8629
+ },
8630
+ ...sx
8631
+ },
8632
+ ...attributes,
8633
+ ...props
8634
+ },
8635
+ /* @__PURE__ */ React117.createElement(
8636
+ InlineEditor,
8637
+ {
8638
+ value: content,
8639
+ setValue: handleChange,
8640
+ placeholder: placeholder ?? null,
8641
+ onEditorCreate: setEditor,
8642
+ onEditorDestroy: () => setEditor(null),
8643
+ sx: {
8644
+ paddingBlockStart: 5
8645
+ }
8646
+ }
8647
+ )
8648
+ )));
8649
+ });
8650
+
8651
+ // src/controls/email-form-action-control/index.tsx
8652
+ var React121 = __toESM(require("react"));
8653
+ var import_editor_props68 = require("@elementor/editor-props");
8654
+ var import_editor_ui16 = require("@elementor/editor-ui");
8655
+ var import_ui105 = require("@elementor/ui");
8656
+ var import_i18n60 = require("@wordpress/i18n");
8657
+
8658
+ // src/controls/email-form-action-control/fields.tsx
8659
+ var React120 = __toESM(require("react"));
8660
+ var import_editor_ui15 = require("@elementor/editor-ui");
8661
+ var import_ui104 = require("@elementor/ui");
8662
+ var import_i18n59 = require("@wordpress/i18n");
8663
+
8664
+ // src/hooks/use-form-field-suggestions.ts
8665
+ var import_editor_elements8 = require("@elementor/editor-elements");
8666
+ var import_editor_props66 = require("@elementor/editor-props");
8667
+ var import_editor_v1_adapters2 = require("@elementor/editor-v1-adapters");
8668
+ var FORM_FIELD_WIDGET_TYPES = [
8669
+ "e-form-input",
8670
+ "e-form-textarea",
8671
+ "e-form-checkbox",
8672
+ "e-form-radio-button",
8673
+ "e-form-select",
8674
+ "e-form-date-picker",
8675
+ "e-form-time-picker"
8676
+ ];
8677
+ var FORM_ELEMENT_TYPE = "e-form";
8678
+ var CSS_ID_PROP_KEY = "_cssid";
8679
+ function isFormFieldWidgetType(widgetType) {
8680
+ return FORM_FIELD_WIDGET_TYPES.includes(widgetType);
8681
+ }
8682
+ function extractStringPropValue(value) {
8683
+ return import_editor_props66.stringPropTypeUtil.extract(value);
8684
+ }
8685
+ function getSettingWithDefault(child, widgetType, key) {
8686
+ const fromGet = child.settings.get(key);
8687
+ if (fromGet !== null && fromGet !== void 0) {
8688
+ return fromGet;
8689
+ }
8690
+ const schema = (0, import_editor_elements8.getWidgetsCache)()?.[widgetType]?.atomic_props_schema;
8691
+ return schema?.[key]?.default ?? null;
8692
+ }
8693
+ function getFieldCssId(child, widgetType) {
8694
+ return extractStringPropValue(getSettingWithDefault(child, widgetType, CSS_ID_PROP_KEY));
8695
+ }
8696
+ function getFormContainer(elementId) {
8697
+ let container = (0, import_editor_elements8.getContainer)(elementId);
8698
+ while (container) {
8699
+ if (container.model.get("elType") === FORM_ELEMENT_TYPE) {
8700
+ return container;
8701
+ }
8702
+ container = container.parent ?? null;
8703
+ }
8704
+ return null;
8705
+ }
8706
+ function useFormFieldSuggestions(options) {
8707
+ return (0, import_editor_v1_adapters2.__privateUseListenTo)(
8708
+ [
8709
+ (0, import_editor_v1_adapters2.v1ReadyEvent)(),
8710
+ (0, import_editor_v1_adapters2.commandEndEvent)("document/elements/create"),
8711
+ (0, import_editor_v1_adapters2.commandEndEvent)("document/elements/delete"),
8712
+ (0, import_editor_v1_adapters2.commandEndEvent)("document/elements/set-settings")
8713
+ ],
8714
+ () => {
8715
+ const selectedElements = (0, import_editor_elements8.getSelectedElements)();
8716
+ const selectedElement = selectedElements[0];
8717
+ if (!selectedElement) {
8718
+ return [];
8719
+ }
8720
+ const formContainer = getFormContainer(selectedElement.id);
8721
+ if (!formContainer?.children) {
8722
+ return [];
8723
+ }
8724
+ const suggestions = [];
8725
+ const seenCssIds = /* @__PURE__ */ new Set();
8726
+ formContainer.children.forEachRecursive?.((child) => {
8727
+ const widgetType = child.model.get("widgetType");
8728
+ if (!widgetType || !isFormFieldWidgetType(widgetType)) {
8299
8729
  return;
8300
8730
  }
8301
8731
  if (options?.inputType) {
@@ -8318,10 +8748,10 @@ function useFormFieldSuggestions(options) {
8318
8748
  }
8319
8749
 
8320
8750
  // src/controls/email-form-action-control/email-chips-field.tsx
8321
- var React116 = __toESM(require("react"));
8322
- var import_react69 = require("react");
8323
- var import_editor_props66 = require("@elementor/editor-props");
8324
- var import_ui100 = require("@elementor/ui");
8751
+ var React118 = __toESM(require("react"));
8752
+ var import_react72 = require("react");
8753
+ var import_editor_props67 = require("@elementor/editor-props");
8754
+ var import_ui102 = require("@elementor/ui");
8325
8755
 
8326
8756
  // src/controls/email-form-action-control/utils.ts
8327
8757
  var import_schema = require("@elementor/schema");
@@ -8356,11 +8786,11 @@ function resolveMention(raw, suggestions) {
8356
8786
  return match ? `[${match.value}]` : raw;
8357
8787
  }
8358
8788
  var EmailChipsControl = createControl(({ placeholder, suggestions = [] }) => {
8359
- const { value, setValue, disabled } = useBoundProp(import_editor_props66.stringArrayPropTypeUtil);
8360
- const [inputValue, setInputValue] = (0, import_react69.useState)("");
8789
+ const { value, setValue, disabled } = useBoundProp(import_editor_props67.stringArrayPropTypeUtil);
8790
+ const [inputValue, setInputValue] = (0, import_react72.useState)("");
8361
8791
  const items2 = value || [];
8362
- const selectedValues = items2.map((item) => import_editor_props66.stringPropTypeUtil.extract(item)).filter((val) => val !== null);
8363
- const suggestionOptions = (0, import_react69.useMemo)(
8792
+ const selectedValues = items2.map((item) => import_editor_props67.stringPropTypeUtil.extract(item)).filter((val) => val !== null);
8793
+ const suggestionOptions = (0, import_react72.useMemo)(
8364
8794
  () => suggestions.map((suggestion) => `[${suggestion.value}]`),
8365
8795
  [suggestions]
8366
8796
  );
@@ -8369,7 +8799,7 @@ var EmailChipsControl = createControl(({ placeholder, suggestions = [] }) => {
8369
8799
  if (!address || selectedValues.includes(address) || !isValidRecipient(address)) {
8370
8800
  return;
8371
8801
  }
8372
- setValue([...items2, import_editor_props66.stringPropTypeUtil.create(address)]);
8802
+ setValue([...items2, import_editor_props67.stringPropTypeUtil.create(address)]);
8373
8803
  setInputValue("");
8374
8804
  };
8375
8805
  const handleChange = (_, newValue) => {
@@ -8379,7 +8809,7 @@ var EmailChipsControl = createControl(({ placeholder, suggestions = [] }) => {
8379
8809
  if (!address || !isValidRecipient(address)) {
8380
8810
  continue;
8381
8811
  }
8382
- updated.push(import_editor_props66.stringPropTypeUtil.create(address));
8812
+ updated.push(import_editor_props67.stringPropTypeUtil.create(address));
8383
8813
  }
8384
8814
  setValue(updated);
8385
8815
  setInputValue("");
@@ -8395,8 +8825,8 @@ var EmailChipsControl = createControl(({ placeholder, suggestions = [] }) => {
8395
8825
  tryAddChip(inputValue);
8396
8826
  }
8397
8827
  };
8398
- return /* @__PURE__ */ React116.createElement(ControlActions, null, /* @__PURE__ */ React116.createElement(
8399
- import_ui100.Autocomplete,
8828
+ return /* @__PURE__ */ React118.createElement(ControlActions, null, /* @__PURE__ */ React118.createElement(
8829
+ import_ui102.Autocomplete,
8400
8830
  {
8401
8831
  fullWidth: true,
8402
8832
  multiple: true,
@@ -8420,99 +8850,99 @@ var EmailChipsControl = createControl(({ placeholder, suggestions = [] }) => {
8420
8850
  onBlur: handleBlur,
8421
8851
  getOptionLabel: (option) => option,
8422
8852
  isOptionEqualToValue: (option, val) => option === val,
8423
- renderInput: (params) => /* @__PURE__ */ React116.createElement(import_ui100.TextField, { ...params, placeholder, onKeyDown: handleKeyDown }),
8424
- renderTags: (tagValues, getTagProps) => /* @__PURE__ */ React116.createElement(ChipsList, { getLabel: (option) => option, getTagProps, values: tagValues })
8853
+ renderInput: (params) => /* @__PURE__ */ React118.createElement(import_ui102.TextField, { ...params, placeholder, onKeyDown: handleKeyDown }),
8854
+ renderTags: (tagValues, getTagProps) => /* @__PURE__ */ React118.createElement(ChipsList, { getLabel: (option) => option, getTagProps, values: tagValues })
8425
8855
  }
8426
8856
  ));
8427
8857
  });
8428
- var EmailChipsField = ({ fieldLabel, placeholder, suggestions }) => /* @__PURE__ */ React116.createElement(import_ui100.Grid, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React116.createElement(import_ui100.Grid, { item: true }, /* @__PURE__ */ React116.createElement(ControlFormLabel, null, fieldLabel)), /* @__PURE__ */ React116.createElement(import_ui100.Grid, { item: true }, /* @__PURE__ */ React116.createElement(EmailChipsControl, { placeholder, suggestions })));
8858
+ var EmailChipsField = ({ fieldLabel, placeholder, suggestions }) => /* @__PURE__ */ React118.createElement(import_ui102.Grid, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React118.createElement(import_ui102.Grid, { item: true }, /* @__PURE__ */ React118.createElement(ControlFormLabel, null, fieldLabel)), /* @__PURE__ */ React118.createElement(import_ui102.Grid, { item: true }, /* @__PURE__ */ React118.createElement(EmailChipsControl, { placeholder, suggestions })));
8429
8859
 
8430
8860
  // src/controls/email-form-action-control/email-field.tsx
8431
- var React117 = __toESM(require("react"));
8432
- var import_ui101 = require("@elementor/ui");
8433
- var EmailField = ({ bind, label, placeholder }) => /* @__PURE__ */ React117.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React117.createElement(import_ui101.Grid, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React117.createElement(import_ui101.Grid, { item: true }, /* @__PURE__ */ React117.createElement(ControlFormLabel, null, label)), /* @__PURE__ */ React117.createElement(import_ui101.Grid, { item: true }, /* @__PURE__ */ React117.createElement(TextControl, { placeholder }))));
8861
+ var React119 = __toESM(require("react"));
8862
+ var import_ui103 = require("@elementor/ui");
8863
+ var EmailField = ({ bind, label, placeholder }) => /* @__PURE__ */ React119.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React119.createElement(import_ui103.Grid, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React119.createElement(import_ui103.Grid, { item: true }, /* @__PURE__ */ React119.createElement(ControlFormLabel, null, label)), /* @__PURE__ */ React119.createElement(import_ui103.Grid, { item: true }, /* @__PURE__ */ React119.createElement(TextControl, { placeholder }))));
8434
8864
 
8435
8865
  // src/controls/email-form-action-control/fields.tsx
8436
8866
  var SendToField = ({ placeholder }) => {
8437
8867
  const suggestions = useFormFieldSuggestions({ inputType: "email" });
8438
- return /* @__PURE__ */ React118.createElement(PropKeyProvider, { bind: "to" }, /* @__PURE__ */ React118.createElement(import_ui102.Stack, { gap: 0.5 }, /* @__PURE__ */ React118.createElement(
8868
+ return /* @__PURE__ */ React120.createElement(PropKeyProvider, { bind: "to" }, /* @__PURE__ */ React120.createElement(import_ui104.Stack, { gap: 0.5 }, /* @__PURE__ */ React120.createElement(
8439
8869
  EmailChipsField,
8440
8870
  {
8441
- fieldLabel: (0, import_i18n57.__)("Send to", "elementor"),
8871
+ fieldLabel: (0, import_i18n59.__)("Send to", "elementor"),
8442
8872
  placeholder,
8443
8873
  suggestions
8444
8874
  }
8445
- ), shouldShowMentionsInfo() && /* @__PURE__ */ React118.createElement(import_editor_ui15.InfoAlert, null, (0, import_i18n57.__)("Type @ or an email field name to insert its submitted value.", "elementor"))));
8875
+ ), shouldShowMentionsInfo() && /* @__PURE__ */ React120.createElement(import_editor_ui15.InfoAlert, null, (0, import_i18n59.__)("Type @ or an email field name to insert its submitted value.", "elementor"))));
8446
8876
  };
8447
- var SubjectField = () => /* @__PURE__ */ React118.createElement(
8877
+ var SubjectField = () => /* @__PURE__ */ React120.createElement(
8448
8878
  EmailField,
8449
8879
  {
8450
8880
  bind: "subject",
8451
- label: (0, import_i18n57.__)("Email subject", "elementor"),
8452
- placeholder: (0, import_i18n57.__)("New form submission", "elementor")
8881
+ label: (0, import_i18n59.__)("Email subject", "elementor"),
8882
+ placeholder: (0, import_i18n59.__)("New form submission", "elementor")
8453
8883
  }
8454
8884
  );
8455
8885
  var MessageField = () => {
8456
8886
  const suggestions = useFormFieldSuggestions();
8457
- return /* @__PURE__ */ React118.createElement(PropKeyProvider, { bind: "message" }, /* @__PURE__ */ React118.createElement(import_ui102.Grid, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React118.createElement(import_ui102.Grid, { item: true }, /* @__PURE__ */ React118.createElement(ControlFormLabel, null, (0, import_i18n57.__)("Message", "elementor"))), /* @__PURE__ */ React118.createElement(import_ui102.Grid, { item: true }, /* @__PURE__ */ React118.createElement(MentionTextAreaControl, { suggestions })), /* @__PURE__ */ React118.createElement(import_ui102.Grid, { item: true }, /* @__PURE__ */ React118.createElement(import_editor_ui15.InfoAlert, null, shouldShowMentionsInfo() ? (0, import_i18n57.__)(
8887
+ return /* @__PURE__ */ React120.createElement(PropKeyProvider, { bind: "message" }, /* @__PURE__ */ React120.createElement(import_ui104.Grid, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React120.createElement(import_ui104.Grid, { item: true }, /* @__PURE__ */ React120.createElement(ControlFormLabel, null, (0, import_i18n59.__)("Message", "elementor"))), /* @__PURE__ */ React120.createElement(import_ui104.Grid, { item: true }, /* @__PURE__ */ React120.createElement(MentionTextAreaControl, { suggestions })), /* @__PURE__ */ React120.createElement(import_ui104.Grid, { item: true }, /* @__PURE__ */ React120.createElement(import_editor_ui15.InfoAlert, null, shouldShowMentionsInfo() ? (0, import_i18n59.__)(
8458
8888
  "[all-fields] shortcode sends all fields. Type @ to insert specific fields and customize your message.",
8459
8889
  "elementor"
8460
- ) : (0, import_i18n57.__)("[all-fields] shortcode sends all fields.", "elementor")))));
8890
+ ) : (0, import_i18n59.__)("[all-fields] shortcode sends all fields.", "elementor")))));
8461
8891
  };
8462
- var FromEmailField = () => /* @__PURE__ */ React118.createElement(
8892
+ var FromEmailField = () => /* @__PURE__ */ React120.createElement(
8463
8893
  EmailField,
8464
8894
  {
8465
8895
  bind: "from",
8466
- label: (0, import_i18n57.__)("From email", "elementor"),
8467
- placeholder: (0, import_i18n57.__)("What email should appear as the sender?", "elementor")
8896
+ label: (0, import_i18n59.__)("From email", "elementor"),
8897
+ placeholder: (0, import_i18n59.__)("What email should appear as the sender?", "elementor")
8468
8898
  }
8469
8899
  );
8470
- var FromNameField = () => /* @__PURE__ */ React118.createElement(
8900
+ var FromNameField = () => /* @__PURE__ */ React120.createElement(
8471
8901
  EmailField,
8472
8902
  {
8473
8903
  bind: "from-name",
8474
- label: (0, import_i18n57.__)("From name", "elementor"),
8475
- placeholder: (0, import_i18n57.__)("What name should appear as the sender?", "elementor")
8904
+ label: (0, import_i18n59.__)("From name", "elementor"),
8905
+ placeholder: (0, import_i18n59.__)("What name should appear as the sender?", "elementor")
8476
8906
  }
8477
8907
  );
8478
8908
  var ReplyToField = () => {
8479
8909
  const emailSuggestions = useFormFieldSuggestions({ inputType: "email" });
8480
- return /* @__PURE__ */ React118.createElement(PropKeyProvider, { bind: "reply-to" }, /* @__PURE__ */ React118.createElement(import_ui102.Grid, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React118.createElement(import_ui102.Grid, { item: true }, /* @__PURE__ */ React118.createElement(ControlFormLabel, null, (0, import_i18n57.__)("Reply-to", "elementor"))), /* @__PURE__ */ React118.createElement(import_ui102.Grid, { item: true }, /* @__PURE__ */ React118.createElement(
8910
+ return /* @__PURE__ */ React120.createElement(PropKeyProvider, { bind: "reply-to" }, /* @__PURE__ */ React120.createElement(import_ui104.Grid, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React120.createElement(import_ui104.Grid, { item: true }, /* @__PURE__ */ React120.createElement(ControlFormLabel, null, (0, import_i18n59.__)("Reply-to", "elementor"))), /* @__PURE__ */ React120.createElement(import_ui104.Grid, { item: true }, /* @__PURE__ */ React120.createElement(
8481
8911
  MentionTextAreaControl,
8482
8912
  {
8483
8913
  suggestions: emailSuggestions,
8484
8914
  rows: 1,
8485
8915
  triggerPosition: "start",
8486
- placeholder: (0, import_i18n57.__)("You can type @ to insert an email field", "elementor")
8916
+ placeholder: (0, import_i18n59.__)("You can type @ to insert an email field", "elementor")
8487
8917
  }
8488
8918
  ))));
8489
8919
  };
8490
8920
  var CcField = () => {
8491
8921
  const suggestions = useFormFieldSuggestions({ inputType: "email" });
8492
- return /* @__PURE__ */ React118.createElement(PropKeyProvider, { bind: "cc" }, /* @__PURE__ */ React118.createElement(EmailChipsField, { fieldLabel: (0, import_i18n57.__)("Cc", "elementor"), suggestions }));
8922
+ return /* @__PURE__ */ React120.createElement(PropKeyProvider, { bind: "cc" }, /* @__PURE__ */ React120.createElement(EmailChipsField, { fieldLabel: (0, import_i18n59.__)("Cc", "elementor"), suggestions }));
8493
8923
  };
8494
8924
  var BccField = () => {
8495
8925
  const suggestions = useFormFieldSuggestions({ inputType: "email" });
8496
- return /* @__PURE__ */ React118.createElement(PropKeyProvider, { bind: "bcc" }, /* @__PURE__ */ React118.createElement(EmailChipsField, { fieldLabel: (0, import_i18n57.__)("Bcc", "elementor"), suggestions }));
8926
+ return /* @__PURE__ */ React120.createElement(PropKeyProvider, { bind: "bcc" }, /* @__PURE__ */ React120.createElement(EmailChipsField, { fieldLabel: (0, import_i18n59.__)("Bcc", "elementor"), suggestions }));
8497
8927
  };
8498
- var MetaDataField = () => /* @__PURE__ */ React118.createElement(PropKeyProvider, { bind: "meta-data" }, /* @__PURE__ */ React118.createElement(import_ui102.Stack, { gap: 0.5 }, /* @__PURE__ */ React118.createElement(ControlFormLabel, null, (0, import_i18n57.__)("Metadata", "elementor")), /* @__PURE__ */ React118.createElement(
8928
+ var MetaDataField = () => /* @__PURE__ */ React120.createElement(PropKeyProvider, { bind: "meta-data" }, /* @__PURE__ */ React120.createElement(import_ui104.Stack, { gap: 0.5 }, /* @__PURE__ */ React120.createElement(ControlFormLabel, null, (0, import_i18n59.__)("Metadata", "elementor")), /* @__PURE__ */ React120.createElement(
8499
8929
  ChipsControl,
8500
8930
  {
8501
8931
  options: [
8502
- { label: (0, import_i18n57.__)("Date", "elementor"), value: "date" },
8503
- { label: (0, import_i18n57.__)("Time", "elementor"), value: "time" },
8504
- { label: (0, import_i18n57.__)("Page URL", "elementor"), value: "page-url" },
8505
- { label: (0, import_i18n57.__)("User agent", "elementor"), value: "user-agent" },
8506
- { label: (0, import_i18n57.__)("Credit", "elementor"), value: "credit" }
8932
+ { label: (0, import_i18n59.__)("Date", "elementor"), value: "date" },
8933
+ { label: (0, import_i18n59.__)("Time", "elementor"), value: "time" },
8934
+ { label: (0, import_i18n59.__)("Page URL", "elementor"), value: "page-url" },
8935
+ { label: (0, import_i18n59.__)("User agent", "elementor"), value: "user-agent" },
8936
+ { label: (0, import_i18n59.__)("Credit", "elementor"), value: "credit" }
8507
8937
  ]
8508
8938
  }
8509
8939
  )));
8510
- var SendAsField = () => /* @__PURE__ */ React118.createElement(PropKeyProvider, { bind: "send-as" }, /* @__PURE__ */ React118.createElement(import_ui102.Grid, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React118.createElement(import_ui102.Grid, { item: true }, /* @__PURE__ */ React118.createElement(ControlFormLabel, null, (0, import_i18n57.__)("Send as", "elementor"))), /* @__PURE__ */ React118.createElement(import_ui102.Grid, { item: true }, /* @__PURE__ */ React118.createElement(
8940
+ var SendAsField = () => /* @__PURE__ */ React120.createElement(PropKeyProvider, { bind: "send-as" }, /* @__PURE__ */ React120.createElement(import_ui104.Grid, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React120.createElement(import_ui104.Grid, { item: true }, /* @__PURE__ */ React120.createElement(ControlFormLabel, null, (0, import_i18n59.__)("Send as", "elementor"))), /* @__PURE__ */ React120.createElement(import_ui104.Grid, { item: true }, /* @__PURE__ */ React120.createElement(
8511
8941
  SelectControl,
8512
8942
  {
8513
8943
  options: [
8514
- { label: (0, import_i18n57.__)("HTML", "elementor"), value: "html" },
8515
- { label: (0, import_i18n57.__)("Plain Text", "elementor"), value: "plain" }
8944
+ { label: (0, import_i18n59.__)("HTML", "elementor"), value: "html" },
8945
+ { label: (0, import_i18n59.__)("Plain Text", "elementor"), value: "plain" }
8516
8946
  ]
8517
8947
  }
8518
8948
  ))));
@@ -8520,28 +8950,28 @@ var SendAsField = () => /* @__PURE__ */ React118.createElement(PropKeyProvider,
8520
8950
  // src/controls/email-form-action-control/index.tsx
8521
8951
  var EmailFormActionControl = createControl(
8522
8952
  ({ toPlaceholder, label }) => {
8523
- const { value, setValue, ...propContext } = useBoundProp(import_editor_props67.emailsPropTypeUtil);
8524
- return /* @__PURE__ */ React119.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React119.createElement(import_ui103.Stack, { gap: 2 }, /* @__PURE__ */ React119.createElement(ControlLabel, null, label ? label + " " + (0, import_i18n58.__)("settings", "elementor") : (0, import_i18n58.__)("Email settings", "elementor")), /* @__PURE__ */ React119.createElement(SendToField, { placeholder: toPlaceholder }), /* @__PURE__ */ React119.createElement(SubjectField, null), /* @__PURE__ */ React119.createElement(MessageField, null), /* @__PURE__ */ React119.createElement(FromEmailField, null), /* @__PURE__ */ React119.createElement(AdvancedSettings, null)));
8953
+ const { value, setValue, ...propContext } = useBoundProp(import_editor_props68.emailsPropTypeUtil);
8954
+ return /* @__PURE__ */ React121.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React121.createElement(import_ui105.Stack, { gap: 2 }, /* @__PURE__ */ React121.createElement(ControlLabel, null, label ? label + " " + (0, import_i18n60.__)("settings", "elementor") : (0, import_i18n60.__)("Email settings", "elementor")), /* @__PURE__ */ React121.createElement(SendToField, { placeholder: toPlaceholder }), /* @__PURE__ */ React121.createElement(SubjectField, null), /* @__PURE__ */ React121.createElement(MessageField, null), /* @__PURE__ */ React121.createElement(FromEmailField, null), /* @__PURE__ */ React121.createElement(AdvancedSettings, null)));
8525
8955
  }
8526
8956
  );
8527
- var AdvancedSettings = () => /* @__PURE__ */ React119.createElement(import_editor_ui16.CollapsibleContent, { defaultOpen: false }, /* @__PURE__ */ React119.createElement(import_ui103.Box, { sx: { pt: 2 } }, /* @__PURE__ */ React119.createElement(import_ui103.Stack, { gap: 2 }, /* @__PURE__ */ React119.createElement(FromNameField, null), /* @__PURE__ */ React119.createElement(ReplyToField, null), /* @__PURE__ */ React119.createElement(CcField, null), /* @__PURE__ */ React119.createElement(BccField, null), /* @__PURE__ */ React119.createElement(import_ui103.Divider, null), /* @__PURE__ */ React119.createElement(MetaDataField, null), /* @__PURE__ */ React119.createElement(SendAsField, null))));
8957
+ var AdvancedSettings = () => /* @__PURE__ */ React121.createElement(import_editor_ui16.CollapsibleContent, { defaultOpen: false }, /* @__PURE__ */ React121.createElement(import_ui105.Box, { sx: { pt: 2 } }, /* @__PURE__ */ React121.createElement(import_ui105.Stack, { gap: 2 }, /* @__PURE__ */ React121.createElement(FromNameField, null), /* @__PURE__ */ React121.createElement(ReplyToField, null), /* @__PURE__ */ React121.createElement(CcField, null), /* @__PURE__ */ React121.createElement(BccField, null), /* @__PURE__ */ React121.createElement(import_ui105.Divider, null), /* @__PURE__ */ React121.createElement(MetaDataField, null), /* @__PURE__ */ React121.createElement(SendAsField, null))));
8528
8958
 
8529
8959
  // src/controls/attachment-type-control.tsx
8530
- var React120 = __toESM(require("react"));
8960
+ var React122 = __toESM(require("react"));
8531
8961
  var import_editor_ui17 = require("@elementor/editor-ui");
8532
- var import_ui104 = require("@elementor/ui");
8533
- var import_i18n59 = require("@wordpress/i18n");
8962
+ var import_ui106 = require("@elementor/ui");
8963
+ var import_i18n61 = require("@wordpress/i18n");
8534
8964
  var AttachmentTypeControl = createControl(({ label, options }) => {
8535
- return /* @__PURE__ */ React120.createElement(import_ui104.Grid, { container: true, direction: "column", gap: 1 }, label && /* @__PURE__ */ React120.createElement(import_ui104.Grid, { item: true }, /* @__PURE__ */ React120.createElement(ControlFormLabel, null, label)), /* @__PURE__ */ React120.createElement(import_ui104.Grid, { item: true }, /* @__PURE__ */ React120.createElement(SelectControl, { options })), /* @__PURE__ */ React120.createElement(import_ui104.Grid, { item: true }, /* @__PURE__ */ React120.createElement(import_editor_ui17.InfoAlert, null, (0, import_i18n59.__)(
8965
+ return /* @__PURE__ */ React122.createElement(import_ui106.Grid, { container: true, direction: "column", gap: 1 }, label && /* @__PURE__ */ React122.createElement(import_ui106.Grid, { item: true }, /* @__PURE__ */ React122.createElement(ControlFormLabel, null, label)), /* @__PURE__ */ React122.createElement(import_ui106.Grid, { item: true }, /* @__PURE__ */ React122.createElement(SelectControl, { options })), /* @__PURE__ */ React122.createElement(import_ui106.Grid, { item: true }, /* @__PURE__ */ React122.createElement(import_editor_ui17.InfoAlert, null, (0, import_i18n61.__)(
8536
8966
  "Linked uploads are saved to the server. Direct attachments will not appear under Submissions.",
8537
8967
  "elementor"
8538
8968
  ))));
8539
8969
  });
8540
8970
 
8541
8971
  // src/controls/grid-span-control.tsx
8542
- var React121 = __toESM(require("react"));
8543
- var import_editor_props68 = require("@elementor/editor-props");
8544
- var import_ui105 = require("@elementor/ui");
8972
+ var React123 = __toESM(require("react"));
8973
+ var import_editor_props69 = require("@elementor/editor-props");
8974
+ var import_ui107 = require("@elementor/ui");
8545
8975
  var GridSpanControl = createControl(
8546
8976
  ({
8547
8977
  placeholder: propPlaceholder,
@@ -8552,14 +8982,14 @@ var GridSpanControl = createControl(
8552
8982
  sx,
8553
8983
  ariaLabel
8554
8984
  }) => {
8555
- const { value, setValue, disabled, placeholder: boundPlaceholder } = useBoundProp(import_editor_props68.spanPropTypeUtil);
8985
+ const { value, setValue, disabled, placeholder: boundPlaceholder } = useBoundProp(import_editor_props69.spanPropTypeUtil);
8556
8986
  const handleChange = (event) => {
8557
8987
  const next = event.target.value;
8558
8988
  setValue(next === "" ? null : next);
8559
8989
  };
8560
8990
  const placeholder = propPlaceholder ?? boundPlaceholder ?? `e.g: 'span 2' or '1 / 3'`;
8561
- return /* @__PURE__ */ React121.createElement(ControlActions, null, /* @__PURE__ */ React121.createElement(
8562
- import_ui105.TextField,
8991
+ return /* @__PURE__ */ React123.createElement(ControlActions, null, /* @__PURE__ */ React123.createElement(
8992
+ import_ui107.TextField,
8563
8993
  {
8564
8994
  size: "tiny",
8565
8995
  fullWidth: true,
@@ -8578,26 +9008,26 @@ var GridSpanControl = createControl(
8578
9008
  }
8579
9009
  );
8580
9010
 
8581
- // src/components/promotions/display-conditions-control.tsx
8582
- var React123 = __toESM(require("react"));
8583
- var import_react71 = require("react");
8584
- var import_icons37 = require("@elementor/icons");
8585
- var import_ui107 = require("@elementor/ui");
8586
- var import_i18n60 = require("@wordpress/i18n");
9011
+ // src/components/promotions/display-conditions-control.tsx
9012
+ var React125 = __toESM(require("react"));
9013
+ var import_react74 = require("react");
9014
+ var import_icons39 = require("@elementor/icons");
9015
+ var import_ui109 = require("@elementor/ui");
9016
+ var import_i18n62 = require("@wordpress/i18n");
8587
9017
 
8588
9018
  // src/components/promotions/promotion-trigger.tsx
8589
- var React122 = __toESM(require("react"));
8590
- var import_react70 = require("react");
9019
+ var React124 = __toESM(require("react"));
9020
+ var import_react73 = require("react");
8591
9021
  var import_editor_ui18 = require("@elementor/editor-ui");
8592
- var import_ui106 = require("@elementor/ui");
9022
+ var import_ui108 = require("@elementor/ui");
8593
9023
  function getV4Promotion(key) {
8594
9024
  return window.elementor?.config?.v4Promotions?.[key];
8595
9025
  }
8596
- var PromotionTrigger = (0, import_react70.forwardRef)(
9026
+ var PromotionTrigger = (0, import_react73.forwardRef)(
8597
9027
  ({ promotionKey, children, trackingData }, ref) => {
8598
- const [isOpen, setIsOpen] = (0, import_react70.useState)(false);
9028
+ const [isOpen, setIsOpen] = (0, import_react73.useState)(false);
8599
9029
  const promotion = getV4Promotion(promotionKey);
8600
- const toggle = (0, import_react70.useCallback)(() => {
9030
+ const toggle = (0, import_react73.useCallback)(() => {
8601
9031
  setIsOpen((prev) => {
8602
9032
  if (!prev) {
8603
9033
  trackViewPromotion(trackingData);
@@ -8605,8 +9035,8 @@ var PromotionTrigger = (0, import_react70.forwardRef)(
8605
9035
  return !prev;
8606
9036
  });
8607
9037
  }, [trackingData]);
8608
- (0, import_react70.useImperativeHandle)(ref, () => ({ toggle }), [toggle]);
8609
- return /* @__PURE__ */ React122.createElement(React122.Fragment, null, promotion && /* @__PURE__ */ React122.createElement(
9038
+ (0, import_react73.useImperativeHandle)(ref, () => ({ toggle }), [toggle]);
9039
+ return /* @__PURE__ */ React124.createElement(React124.Fragment, null, promotion && /* @__PURE__ */ React124.createElement(
8610
9040
  import_editor_ui18.PromotionInfotip,
8611
9041
  {
8612
9042
  title: promotion.title,
@@ -8620,8 +9050,8 @@ var PromotionTrigger = (0, import_react70.forwardRef)(
8620
9050
  },
8621
9051
  onCtaClick: () => trackUpgradePromotionClick(trackingData)
8622
9052
  },
8623
- /* @__PURE__ */ React122.createElement(
8624
- import_ui106.Box,
9053
+ /* @__PURE__ */ React124.createElement(
9054
+ import_ui108.Box,
8625
9055
  {
8626
9056
  onClick: (e) => {
8627
9057
  e.stopPropagation();
@@ -8629,19 +9059,19 @@ var PromotionTrigger = (0, import_react70.forwardRef)(
8629
9059
  },
8630
9060
  sx: { cursor: "pointer", display: "inline-flex" }
8631
9061
  },
8632
- children ?? /* @__PURE__ */ React122.createElement(import_editor_ui18.PromotionChip, null)
9062
+ children ?? /* @__PURE__ */ React124.createElement(import_editor_ui18.PromotionChip, null)
8633
9063
  )
8634
9064
  ));
8635
9065
  }
8636
9066
  );
8637
9067
 
8638
9068
  // src/components/promotions/display-conditions-control.tsx
8639
- var ARIA_LABEL = (0, import_i18n60.__)("Display Conditions", "elementor");
9069
+ var ARIA_LABEL = (0, import_i18n62.__)("Display Conditions", "elementor");
8640
9070
  var TRACKING_DATA = { target_name: "display_conditions", location_l2: "general" };
8641
9071
  var DisplayConditionsControl = createControl(() => {
8642
- const triggerRef = (0, import_react71.useRef)(null);
8643
- return /* @__PURE__ */ React123.createElement(
8644
- import_ui107.Stack,
9072
+ const triggerRef = (0, import_react74.useRef)(null);
9073
+ return /* @__PURE__ */ React125.createElement(
9074
+ import_ui109.Stack,
8645
9075
  {
8646
9076
  direction: "row",
8647
9077
  spacing: 2,
@@ -8650,9 +9080,9 @@ var DisplayConditionsControl = createControl(() => {
8650
9080
  alignItems: "center"
8651
9081
  }
8652
9082
  },
8653
- /* @__PURE__ */ React123.createElement(PromotionTrigger, { ref: triggerRef, promotionKey: "displayConditions", trackingData: TRACKING_DATA }),
8654
- /* @__PURE__ */ React123.createElement(import_ui107.Tooltip, { title: ARIA_LABEL, placement: "top" }, /* @__PURE__ */ React123.createElement(
8655
- import_ui107.IconButton,
9083
+ /* @__PURE__ */ React125.createElement(PromotionTrigger, { ref: triggerRef, promotionKey: "displayConditions", trackingData: TRACKING_DATA }),
9084
+ /* @__PURE__ */ React125.createElement(import_ui109.Tooltip, { title: ARIA_LABEL, placement: "top" }, /* @__PURE__ */ React125.createElement(
9085
+ import_ui109.IconButton,
8656
9086
  {
8657
9087
  size: "tiny",
8658
9088
  "aria-label": ARIA_LABEL,
@@ -8664,23 +9094,23 @@ var DisplayConditionsControl = createControl(() => {
8664
9094
  borderRadius: 1
8665
9095
  }
8666
9096
  },
8667
- /* @__PURE__ */ React123.createElement(import_icons37.SitemapIcon, { fontSize: "tiny", color: "disabled" })
9097
+ /* @__PURE__ */ React125.createElement(import_icons39.SitemapIcon, { fontSize: "tiny", color: "disabled" })
8668
9098
  ))
8669
9099
  );
8670
9100
  });
8671
9101
 
8672
9102
  // src/components/promotions/attributes-control.tsx
8673
- var React124 = __toESM(require("react"));
8674
- var import_react72 = require("react");
8675
- var import_icons38 = require("@elementor/icons");
8676
- var import_ui108 = require("@elementor/ui");
8677
- var import_i18n61 = require("@wordpress/i18n");
8678
- var ARIA_LABEL2 = (0, import_i18n61.__)("Attributes", "elementor");
9103
+ var React126 = __toESM(require("react"));
9104
+ var import_react75 = require("react");
9105
+ var import_icons40 = require("@elementor/icons");
9106
+ var import_ui110 = require("@elementor/ui");
9107
+ var import_i18n63 = require("@wordpress/i18n");
9108
+ var ARIA_LABEL2 = (0, import_i18n63.__)("Attributes", "elementor");
8679
9109
  var TRACKING_DATA2 = { target_name: "attributes", location_l2: "general" };
8680
9110
  var AttributesControl = createControl(() => {
8681
- const triggerRef = (0, import_react72.useRef)(null);
8682
- return /* @__PURE__ */ React124.createElement(
8683
- import_ui108.Stack,
9111
+ const triggerRef = (0, import_react75.useRef)(null);
9112
+ return /* @__PURE__ */ React126.createElement(
9113
+ import_ui110.Stack,
8684
9114
  {
8685
9115
  direction: "row",
8686
9116
  spacing: 2,
@@ -8689,9 +9119,9 @@ var AttributesControl = createControl(() => {
8689
9119
  alignItems: "center"
8690
9120
  }
8691
9121
  },
8692
- /* @__PURE__ */ React124.createElement(PromotionTrigger, { ref: triggerRef, promotionKey: "attributes", trackingData: TRACKING_DATA2 }),
8693
- /* @__PURE__ */ React124.createElement(import_ui108.Tooltip, { title: ARIA_LABEL2, placement: "top" }, /* @__PURE__ */ React124.createElement(
8694
- import_icons38.PlusIcon,
9122
+ /* @__PURE__ */ React126.createElement(PromotionTrigger, { ref: triggerRef, promotionKey: "attributes", trackingData: TRACKING_DATA2 }),
9123
+ /* @__PURE__ */ React126.createElement(import_ui110.Tooltip, { title: ARIA_LABEL2, placement: "top" }, /* @__PURE__ */ React126.createElement(
9124
+ import_icons40.PlusIcon,
8695
9125
  {
8696
9126
  "aria-label": ARIA_LABEL2,
8697
9127
  fontSize: "tiny",
@@ -8704,21 +9134,21 @@ var AttributesControl = createControl(() => {
8704
9134
  });
8705
9135
 
8706
9136
  // src/components/icon-buttons/clear-icon-button.tsx
8707
- var React125 = __toESM(require("react"));
8708
- var import_icons39 = require("@elementor/icons");
8709
- var import_ui109 = require("@elementor/ui");
8710
- var CustomIconButton = (0, import_ui109.styled)(import_ui109.IconButton)(({ theme }) => ({
9137
+ var React127 = __toESM(require("react"));
9138
+ var import_icons41 = require("@elementor/icons");
9139
+ var import_ui111 = require("@elementor/ui");
9140
+ var CustomIconButton = (0, import_ui111.styled)(import_ui111.IconButton)(({ theme }) => ({
8711
9141
  width: theme.spacing(2.5),
8712
9142
  height: theme.spacing(2.5)
8713
9143
  }));
8714
- var ClearIconButton = ({ tooltipText, onClick, disabled, size = "tiny" }) => /* @__PURE__ */ React125.createElement(import_ui109.Tooltip, { title: tooltipText, placement: "top", disableInteractive: true }, /* @__PURE__ */ React125.createElement(CustomIconButton, { "aria-label": tooltipText, size, onClick, disabled }, /* @__PURE__ */ React125.createElement(import_icons39.BrushBigIcon, { fontSize: size })));
9144
+ var ClearIconButton = ({ tooltipText, onClick, disabled, size = "tiny" }) => /* @__PURE__ */ React127.createElement(import_ui111.Tooltip, { title: tooltipText, placement: "top", disableInteractive: true }, /* @__PURE__ */ React127.createElement(CustomIconButton, { "aria-label": tooltipText, size, onClick, disabled }, /* @__PURE__ */ React127.createElement(import_icons41.BrushBigIcon, { fontSize: size })));
8715
9145
 
8716
9146
  // src/components/repeater/repeater.tsx
8717
- var React126 = __toESM(require("react"));
8718
- var import_react73 = require("react");
8719
- var import_icons40 = require("@elementor/icons");
8720
- var import_ui110 = require("@elementor/ui");
8721
- var import_i18n62 = require("@wordpress/i18n");
9147
+ var React128 = __toESM(require("react"));
9148
+ var import_react76 = require("react");
9149
+ var import_icons42 = require("@elementor/icons");
9150
+ var import_ui112 = require("@elementor/ui");
9151
+ var import_i18n64 = require("@wordpress/i18n");
8722
9152
  var SIZE12 = "tiny";
8723
9153
  var EMPTY_OPEN_ITEM2 = -1;
8724
9154
  var Repeater3 = ({
@@ -8737,7 +9167,7 @@ var Repeater3 = ({
8737
9167
  isSortable = true,
8738
9168
  adornment = ControlAdornments
8739
9169
  }) => {
8740
- const [openItem, setOpenItem] = (0, import_react73.useState)(initialOpenItem);
9170
+ const [openItem, setOpenItem] = (0, import_react76.useState)(initialOpenItem);
8741
9171
  const uniqueKeys = items2.map(
8742
9172
  (item, index) => isSortable && "getId" in itemSettings ? itemSettings.getId({ item, index }) : String(index)
8743
9173
  );
@@ -8800,8 +9230,8 @@ var Repeater3 = ({
8800
9230
  };
8801
9231
  const isButtonDisabled = disabled || disableAddItemButton;
8802
9232
  const shouldShowInfotip = isButtonDisabled && addButtonInfotipContent;
8803
- const addButton = /* @__PURE__ */ React126.createElement(
8804
- import_ui110.IconButton,
9233
+ const addButton = /* @__PURE__ */ React128.createElement(
9234
+ import_ui112.IconButton,
8805
9235
  {
8806
9236
  size: SIZE12,
8807
9237
  sx: {
@@ -8809,32 +9239,32 @@ var Repeater3 = ({
8809
9239
  },
8810
9240
  disabled: isButtonDisabled,
8811
9241
  onClick: addRepeaterItem,
8812
- "aria-label": (0, import_i18n62.__)("Add item", "elementor")
9242
+ "aria-label": (0, import_i18n64.__)("Add item", "elementor")
8813
9243
  },
8814
- /* @__PURE__ */ React126.createElement(import_icons40.PlusIcon, { fontSize: SIZE12 })
9244
+ /* @__PURE__ */ React128.createElement(import_icons42.PlusIcon, { fontSize: SIZE12 })
8815
9245
  );
8816
- return /* @__PURE__ */ React126.createElement(SectionContent, { gap: 2 }, /* @__PURE__ */ React126.createElement(RepeaterHeader, { label, adornment }, shouldShowInfotip ? /* @__PURE__ */ React126.createElement(
8817
- import_ui110.Infotip,
9246
+ return /* @__PURE__ */ React128.createElement(SectionContent, { gap: 2 }, /* @__PURE__ */ React128.createElement(RepeaterHeader, { label, adornment }, shouldShowInfotip ? /* @__PURE__ */ React128.createElement(
9247
+ import_ui112.Infotip,
8818
9248
  {
8819
9249
  placement: "right",
8820
9250
  content: addButtonInfotipContent,
8821
9251
  color: "secondary",
8822
9252
  slotProps: { popper: { sx: { width: 300 } } }
8823
9253
  },
8824
- /* @__PURE__ */ React126.createElement(import_ui110.Box, { sx: { ...isButtonDisabled ? { cursor: "not-allowed" } : {} } }, addButton)
8825
- ) : addButton), 0 < uniqueKeys.length && /* @__PURE__ */ React126.createElement(SortableProvider, { value: uniqueKeys, onChange: onChangeOrder }, uniqueKeys.map((key) => {
9254
+ /* @__PURE__ */ React128.createElement(import_ui112.Box, { sx: { ...isButtonDisabled ? { cursor: "not-allowed" } : {} } }, addButton)
9255
+ ) : addButton), 0 < uniqueKeys.length && /* @__PURE__ */ React128.createElement(SortableProvider, { value: uniqueKeys, onChange: onChangeOrder }, uniqueKeys.map((key) => {
8826
9256
  const index = uniqueKeys.indexOf(key);
8827
9257
  const value = items2[index];
8828
9258
  if (!value) {
8829
9259
  return null;
8830
9260
  }
8831
- return /* @__PURE__ */ React126.createElement(SortableItem, { id: key, key: `sortable-${key}`, disabled: !isSortable }, /* @__PURE__ */ React126.createElement(
9261
+ return /* @__PURE__ */ React128.createElement(SortableItem, { id: key, key: `sortable-${key}`, disabled: !isSortable }, /* @__PURE__ */ React128.createElement(
8832
9262
  RepeaterItem,
8833
9263
  {
8834
9264
  disabled,
8835
9265
  propDisabled: value?.disabled,
8836
- label: /* @__PURE__ */ React126.createElement(RepeaterItemLabelSlot, { value }, /* @__PURE__ */ React126.createElement(itemSettings.Label, { value, index })),
8837
- startIcon: /* @__PURE__ */ React126.createElement(RepeaterItemIconSlot, { value }, /* @__PURE__ */ React126.createElement(itemSettings.Icon, { value })),
9266
+ label: /* @__PURE__ */ React128.createElement(RepeaterItemLabelSlot, { value }, /* @__PURE__ */ React128.createElement(itemSettings.Label, { value, index })),
9267
+ startIcon: /* @__PURE__ */ React128.createElement(RepeaterItemIconSlot, { value }, /* @__PURE__ */ React128.createElement(itemSettings.Icon, { value })),
8838
9268
  removeItem: () => removeRepeaterItem(index),
8839
9269
  duplicateItem: () => duplicateRepeaterItem(index),
8840
9270
  toggleDisableItem: () => toggleDisableRepeaterItem(index),
@@ -8848,7 +9278,7 @@ var Repeater3 = ({
8848
9278
  actions: itemSettings.actions,
8849
9279
  value
8850
9280
  },
8851
- (props) => /* @__PURE__ */ React126.createElement(
9281
+ (props) => /* @__PURE__ */ React128.createElement(
8852
9282
  itemSettings.Content,
8853
9283
  {
8854
9284
  ...props,
@@ -8888,18 +9318,18 @@ var RepeaterItem = ({
8888
9318
  },
8889
9319
  wrappedOnPopoverClose
8890
9320
  );
8891
- const triggerProps = (0, import_ui110.bindTrigger)(popoverState);
9321
+ const triggerProps = (0, import_ui112.bindTrigger)(popoverState);
8892
9322
  usePopoverDismiss({ isOpen: popoverState.isOpen, onClose: popoverProps.onClose });
8893
- const duplicateLabel = (0, import_i18n62.__)("Duplicate", "elementor");
8894
- const toggleLabel = propDisabled ? (0, import_i18n62.__)("Show", "elementor") : (0, import_i18n62.__)("Hide", "elementor");
8895
- const removeLabel = (0, import_i18n62.__)("Remove", "elementor");
8896
- return /* @__PURE__ */ React126.createElement(import_ui110.Box, { sx: { display: "contents" } }, /* @__PURE__ */ React126.createElement(
9323
+ const duplicateLabel = (0, import_i18n64.__)("Duplicate", "elementor");
9324
+ const toggleLabel = propDisabled ? (0, import_i18n64.__)("Show", "elementor") : (0, import_i18n64.__)("Hide", "elementor");
9325
+ const removeLabel = (0, import_i18n64.__)("Remove", "elementor");
9326
+ return /* @__PURE__ */ React128.createElement(import_ui112.Box, { sx: { display: "contents" } }, /* @__PURE__ */ React128.createElement(
8897
9327
  RepeaterTag,
8898
9328
  {
8899
9329
  disabled,
8900
9330
  label,
8901
9331
  ref: setRef,
8902
- "aria-label": (0, import_i18n62.__)("Open item", "elementor"),
9332
+ "aria-label": (0, import_i18n64.__)("Open item", "elementor"),
8903
9333
  ...triggerProps,
8904
9334
  onClick: (e) => {
8905
9335
  triggerProps.onClick(e);
@@ -8908,15 +9338,15 @@ var RepeaterItem = ({
8908
9338
  }
8909
9339
  },
8910
9340
  startIcon,
8911
- actions: /* @__PURE__ */ React126.createElement(React126.Fragment, null, showDuplicate && /* @__PURE__ */ React126.createElement(import_ui110.Tooltip, { title: duplicateLabel, placement: "top" }, /* @__PURE__ */ React126.createElement(import_ui110.IconButton, { size: SIZE12, onClick: duplicateItem, "aria-label": duplicateLabel }, /* @__PURE__ */ React126.createElement(import_icons40.CopyIcon, { fontSize: SIZE12 }))), showToggle && /* @__PURE__ */ React126.createElement(import_ui110.Tooltip, { title: toggleLabel, placement: "top" }, /* @__PURE__ */ React126.createElement(import_ui110.IconButton, { size: SIZE12, onClick: toggleDisableItem, "aria-label": toggleLabel }, propDisabled ? /* @__PURE__ */ React126.createElement(import_icons40.EyeOffIcon, { fontSize: SIZE12 }) : /* @__PURE__ */ React126.createElement(import_icons40.EyeIcon, { fontSize: SIZE12 }))), actions?.(value), showRemove && /* @__PURE__ */ React126.createElement(import_ui110.Tooltip, { title: removeLabel, placement: "top" }, /* @__PURE__ */ React126.createElement(import_ui110.IconButton, { size: SIZE12, onClick: removeItem, "aria-label": removeLabel }, /* @__PURE__ */ React126.createElement(import_icons40.XIcon, { fontSize: SIZE12 }))))
9341
+ actions: /* @__PURE__ */ React128.createElement(React128.Fragment, null, showDuplicate && /* @__PURE__ */ React128.createElement(import_ui112.Tooltip, { title: duplicateLabel, placement: "top" }, /* @__PURE__ */ React128.createElement(import_ui112.IconButton, { size: SIZE12, onClick: duplicateItem, "aria-label": duplicateLabel }, /* @__PURE__ */ React128.createElement(import_icons42.CopyIcon, { fontSize: SIZE12 }))), showToggle && /* @__PURE__ */ React128.createElement(import_ui112.Tooltip, { title: toggleLabel, placement: "top" }, /* @__PURE__ */ React128.createElement(import_ui112.IconButton, { size: SIZE12, onClick: toggleDisableItem, "aria-label": toggleLabel }, propDisabled ? /* @__PURE__ */ React128.createElement(import_icons42.EyeOffIcon, { fontSize: SIZE12 }) : /* @__PURE__ */ React128.createElement(import_icons42.EyeIcon, { fontSize: SIZE12 }))), actions?.(value), showRemove && /* @__PURE__ */ React128.createElement(import_ui112.Tooltip, { title: removeLabel, placement: "top" }, /* @__PURE__ */ React128.createElement(import_ui112.IconButton, { size: SIZE12, onClick: removeItem, "aria-label": removeLabel }, /* @__PURE__ */ React128.createElement(import_icons42.XIcon, { fontSize: SIZE12 }))))
8912
9342
  }
8913
- ), /* @__PURE__ */ React126.createElement(RepeaterPopover, { width: ref?.getBoundingClientRect().width, ...popoverProps, anchorEl: ref }, /* @__PURE__ */ React126.createElement(import_ui110.Box, null, children({ anchorEl: ref }))));
9343
+ ), /* @__PURE__ */ React128.createElement(RepeaterPopover, { width: ref?.getBoundingClientRect().width, ...popoverProps, anchorEl: ref }, /* @__PURE__ */ React128.createElement(import_ui112.Box, null, children({ anchorEl: ref }))));
8914
9344
  };
8915
9345
  var usePopover = (openOnMount, onOpen, onPopoverClose) => {
8916
- const [ref, setRef] = (0, import_react73.useState)(null);
8917
- const popoverState = (0, import_ui110.usePopupState)({ variant: "popover" });
8918
- const popoverProps = (0, import_ui110.bindPopover)(popoverState);
8919
- (0, import_react73.useEffect)(() => {
9346
+ const [ref, setRef] = (0, import_react76.useState)(null);
9347
+ const popoverState = (0, import_ui112.usePopupState)({ variant: "popover" });
9348
+ const popoverProps = (0, import_ui112.bindPopover)(popoverState);
9349
+ (0, import_react76.useEffect)(() => {
8920
9350
  if (openOnMount && ref) {
8921
9351
  popoverState.open(ref);
8922
9352
  onOpen?.();
@@ -8934,276 +9364,6 @@ var usePopover = (openOnMount, onOpen, onPopoverClose) => {
8934
9364
  };
8935
9365
  };
8936
9366
 
8937
- // src/components/inline-editor-toolbar.tsx
8938
- var React128 = __toESM(require("react"));
8939
- var import_react75 = require("react");
8940
- var import_editor_elements8 = require("@elementor/editor-elements");
8941
- var import_icons42 = require("@elementor/icons");
8942
- var import_ui112 = require("@elementor/ui");
8943
- var import_react76 = require("@tiptap/react");
8944
- var import_i18n64 = require("@wordpress/i18n");
8945
-
8946
- // src/components/url-popover.tsx
8947
- var React127 = __toESM(require("react"));
8948
- var import_react74 = require("react");
8949
- var import_icons41 = require("@elementor/icons");
8950
- var import_ui111 = require("@elementor/ui");
8951
- var import_i18n63 = require("@wordpress/i18n");
8952
- var UrlPopover = ({
8953
- popupState,
8954
- restoreValue,
8955
- anchorRef,
8956
- value,
8957
- onChange,
8958
- openInNewTab,
8959
- onToggleNewTab
8960
- }) => {
8961
- const inputRef = (0, import_react74.useRef)(null);
8962
- (0, import_react74.useEffect)(() => {
8963
- if (popupState.isOpen) {
8964
- requestAnimationFrame(() => inputRef.current?.focus());
8965
- }
8966
- }, [popupState.isOpen]);
8967
- const handleClose = () => {
8968
- restoreValue();
8969
- popupState.close();
8970
- };
8971
- return /* @__PURE__ */ React127.createElement(
8972
- import_ui111.Popover,
8973
- {
8974
- slotProps: {
8975
- paper: { sx: { borderRadius: "16px", width: anchorRef.current?.offsetWidth + "px", marginTop: -1 } }
8976
- },
8977
- ...(0, import_ui111.bindPopover)(popupState),
8978
- anchorOrigin: { vertical: "top", horizontal: "left" },
8979
- transformOrigin: { vertical: "top", horizontal: "left" },
8980
- onClose: handleClose
8981
- },
8982
- /* @__PURE__ */ React127.createElement(import_ui111.Stack, { direction: "row", alignItems: "center", gap: 1, sx: { p: 1.5 } }, /* @__PURE__ */ React127.createElement(
8983
- import_ui111.TextField,
8984
- {
8985
- value,
8986
- onChange,
8987
- size: "tiny",
8988
- fullWidth: true,
8989
- placeholder: (0, import_i18n63.__)("Type a URL", "elementor"),
8990
- inputProps: { ref: inputRef },
8991
- color: "secondary",
8992
- InputProps: { sx: { borderRadius: "8px" } },
8993
- onKeyUp: (event) => event.key === "Enter" && handleClose()
8994
- }
8995
- ), /* @__PURE__ */ React127.createElement(import_ui111.Tooltip, { title: (0, import_i18n63.__)("Open in a new tab", "elementor") }, /* @__PURE__ */ React127.createElement(
8996
- import_ui111.ToggleButton,
8997
- {
8998
- size: "tiny",
8999
- value: "newTab",
9000
- selected: openInNewTab,
9001
- onClick: onToggleNewTab,
9002
- "aria-label": (0, import_i18n63.__)("Open in a new tab", "elementor"),
9003
- sx: { borderRadius: "8px" }
9004
- },
9005
- /* @__PURE__ */ React127.createElement(import_icons41.ExternalLinkIcon, { fontSize: "tiny" })
9006
- )))
9007
- );
9008
- };
9009
-
9010
- // src/components/inline-editor-toolbar.tsx
9011
- var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
9012
- const [urlValue, setUrlValue] = (0, import_react75.useState)("");
9013
- const [openInNewTab, setOpenInNewTab] = (0, import_react75.useState)(false);
9014
- const toolbarRef = (0, import_react75.useRef)(null);
9015
- const linkPopupState = (0, import_ui112.usePopupState)({ variant: "popover" });
9016
- const isElementClickable = elementId ? checkIfElementIsClickable(elementId) : false;
9017
- const editorState = (0, import_react76.useEditorState)({
9018
- editor,
9019
- selector: (ctx) => possibleFormats.filter((format) => ctx.editor.isActive(format))
9020
- });
9021
- const formatButtonsList = (0, import_react75.useMemo)(() => {
9022
- const buttons = Object.values(formatButtons);
9023
- if (isElementClickable) {
9024
- return buttons.filter((button) => button.action !== "link");
9025
- }
9026
- return buttons;
9027
- }, [isElementClickable]);
9028
- const handleLinkClick = () => {
9029
- const linkAttrs = editor.getAttributes("link");
9030
- setUrlValue(linkAttrs.href || "");
9031
- setOpenInNewTab(linkAttrs.target === "_blank");
9032
- linkPopupState.open(toolbarRef.current);
9033
- };
9034
- const handleUrlChange = (event) => {
9035
- setUrlValue(event.target.value);
9036
- };
9037
- const handleToggleNewTab = () => {
9038
- setOpenInNewTab(!openInNewTab);
9039
- };
9040
- const handleUrlSubmit = () => {
9041
- if (urlValue) {
9042
- editor.chain().focus().setLink({
9043
- href: urlValue,
9044
- target: openInNewTab ? "_blank" : "_self"
9045
- }).run();
9046
- } else {
9047
- editor.chain().focus().unsetLink().run();
9048
- }
9049
- if (elementId) {
9050
- window.dispatchEvent(
9051
- new CustomEvent("elementor:inline-link-changed", {
9052
- detail: { elementId }
9053
- })
9054
- );
9055
- }
9056
- linkPopupState.close();
9057
- };
9058
- (0, import_react75.useEffect)(() => {
9059
- editor?.commands?.focus();
9060
- }, [editor]);
9061
- return /* @__PURE__ */ React128.createElement(
9062
- import_ui112.Box,
9063
- {
9064
- ref: toolbarRef,
9065
- sx: {
9066
- display: "inline-flex",
9067
- gap: 0.5,
9068
- padding: 0.5,
9069
- borderRadius: "8px",
9070
- backgroundColor: "background.paper",
9071
- boxShadow: "0 2px 8px rgba(0, 0, 0, 0.2)",
9072
- alignItems: "center",
9073
- visibility: linkPopupState.isOpen ? "hidden" : "visible",
9074
- pointerEvents: linkPopupState.isOpen ? "none" : "all",
9075
- ...sx
9076
- }
9077
- },
9078
- /* @__PURE__ */ React128.createElement(import_ui112.Tooltip, { title: clearButton.label, placement: "top", sx: { borderRadius: "8px" } }, /* @__PURE__ */ React128.createElement(import_ui112.IconButton, { "aria-label": clearButton.label, onClick: () => clearButton.method(editor), size: "tiny" }, clearButton.icon)),
9079
- /* @__PURE__ */ React128.createElement(
9080
- import_ui112.ToggleButtonGroup,
9081
- {
9082
- value: editorState,
9083
- size: "tiny",
9084
- sx: {
9085
- display: "flex",
9086
- gap: 0.5,
9087
- border: "none",
9088
- [`& .${import_ui112.toggleButtonGroupClasses.firstButton}, & .${import_ui112.toggleButtonGroupClasses.middleButton}, & .${import_ui112.toggleButtonGroupClasses.lastButton}`]: {
9089
- borderRadius: "8px",
9090
- border: "none",
9091
- marginLeft: 0,
9092
- "&.Mui-selected": {
9093
- marginLeft: 0
9094
- },
9095
- "& + &.Mui-selected": {
9096
- marginLeft: 0
9097
- }
9098
- }
9099
- }
9100
- },
9101
- formatButtonsList.map((button) => /* @__PURE__ */ React128.createElement(import_ui112.Tooltip, { title: button.label, key: button.action, placement: "top" }, /* @__PURE__ */ React128.createElement(
9102
- import_ui112.ToggleButton,
9103
- {
9104
- value: button.action,
9105
- "aria-label": button.label,
9106
- size: "tiny",
9107
- onClick: () => {
9108
- if (button.action === "link") {
9109
- handleLinkClick();
9110
- } else {
9111
- button.method?.(editor);
9112
- }
9113
- editor?.commands?.focus();
9114
- }
9115
- },
9116
- button.icon
9117
- )))
9118
- ),
9119
- /* @__PURE__ */ React128.createElement(
9120
- UrlPopover,
9121
- {
9122
- popupState: linkPopupState,
9123
- anchorRef: toolbarRef,
9124
- restoreValue: handleUrlSubmit,
9125
- value: urlValue,
9126
- onChange: handleUrlChange,
9127
- openInNewTab,
9128
- onToggleNewTab: handleToggleNewTab
9129
- }
9130
- )
9131
- );
9132
- };
9133
- var checkIfElementIsClickable = (elementId) => {
9134
- const container = (0, import_editor_elements8.getContainer)(elementId);
9135
- const type = container?.model.get("widgetType");
9136
- const isButton = type === "e-button";
9137
- const hasLink = !!(0, import_editor_elements8.getElementSetting)(elementId, "link")?.value?.destination;
9138
- return isButton || hasLink;
9139
- };
9140
- var toolbarButtons = {
9141
- clear: {
9142
- label: (0, import_i18n64.__)("Clear", "elementor"),
9143
- icon: /* @__PURE__ */ React128.createElement(import_icons42.MinusIcon, { fontSize: "tiny" }),
9144
- action: "clear",
9145
- method: (editor) => {
9146
- editor.chain().focus().clearNodes().unsetAllMarks().run();
9147
- }
9148
- },
9149
- bold: {
9150
- label: (0, import_i18n64.__)("Bold", "elementor"),
9151
- icon: /* @__PURE__ */ React128.createElement(import_icons42.BoldIcon, { fontSize: "tiny" }),
9152
- action: "bold",
9153
- method: (editor) => {
9154
- editor.chain().focus().toggleBold().run();
9155
- }
9156
- },
9157
- italic: {
9158
- label: (0, import_i18n64.__)("Italic", "elementor"),
9159
- icon: /* @__PURE__ */ React128.createElement(import_icons42.ItalicIcon, { fontSize: "tiny" }),
9160
- action: "italic",
9161
- method: (editor) => {
9162
- editor.chain().focus().toggleItalic().run();
9163
- }
9164
- },
9165
- underline: {
9166
- label: (0, import_i18n64.__)("Underline", "elementor"),
9167
- icon: /* @__PURE__ */ React128.createElement(import_icons42.UnderlineIcon, { fontSize: "tiny" }),
9168
- action: "underline",
9169
- method: (editor) => {
9170
- editor.chain().focus().toggleUnderline().run();
9171
- }
9172
- },
9173
- strike: {
9174
- label: (0, import_i18n64.__)("Strikethrough", "elementor"),
9175
- icon: /* @__PURE__ */ React128.createElement(import_icons42.StrikethroughIcon, { fontSize: "tiny" }),
9176
- action: "strike",
9177
- method: (editor) => {
9178
- editor.chain().focus().toggleStrike().run();
9179
- }
9180
- },
9181
- superscript: {
9182
- label: (0, import_i18n64.__)("Superscript", "elementor"),
9183
- icon: /* @__PURE__ */ React128.createElement(import_icons42.SuperscriptIcon, { fontSize: "tiny" }),
9184
- action: "superscript",
9185
- method: (editor) => {
9186
- editor.chain().focus().toggleSuperscript().run();
9187
- }
9188
- },
9189
- subscript: {
9190
- label: (0, import_i18n64.__)("Subscript", "elementor"),
9191
- icon: /* @__PURE__ */ React128.createElement(import_icons42.SubscriptIcon, { fontSize: "tiny" }),
9192
- action: "subscript",
9193
- method: (editor) => {
9194
- editor.chain().focus().toggleSubscript().run();
9195
- }
9196
- },
9197
- link: {
9198
- label: (0, import_i18n64.__)("Link", "elementor"),
9199
- icon: /* @__PURE__ */ React128.createElement(import_icons42.LinkIcon, { fontSize: "tiny" }),
9200
- action: "link",
9201
- method: null
9202
- }
9203
- };
9204
- var { clear: clearButton, ...formatButtons } = toolbarButtons;
9205
- var possibleFormats = Object.keys(formatButtons);
9206
-
9207
9367
  // src/components/size/unstable-size-field.tsx
9208
9368
  var React131 = __toESM(require("react"));
9209
9369
  var import_ui114 = require("@elementor/ui");