@elementor/editor-ui 0.14.0 → 3.32.0-20
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/CHANGELOG.md +6 -0
- package/dist/index.d.mts +8 -9
- package/dist/index.d.ts +8 -9
- package/dist/index.js +48 -67
- package/dist/index.mjs +46 -65
- package/package.json +5 -5
- package/src/components/infotip-card.tsx +23 -14
- package/src/components/popover/body.tsx +29 -0
- package/src/components/popover/header.tsx +8 -27
- package/src/components/popover/index.ts +1 -1
- package/src/components/popover/menu-list.tsx +2 -7
- package/src/components/popover/search.tsx +1 -14
- package/.turbo/turbo-build.log +0 -22
- package/dist/index.js.map +0 -1
- package/dist/index.mjs.map +0 -1
- package/src/components/popover/scrollable-content.tsx +0 -32
package/CHANGELOG.md
CHANGED
package/dist/index.d.mts
CHANGED
|
@@ -58,8 +58,14 @@ interface WarningInfotipProps extends PropsWithChildren {
|
|
|
58
58
|
}
|
|
59
59
|
declare const WarningInfotip: React$1.ForwardRefExoticComponent<WarningInfotipProps & React$1.RefAttributes<unknown>>;
|
|
60
60
|
|
|
61
|
+
type PopoverBodyProps = PropsWithChildren<{
|
|
62
|
+
height?: number | 'auto';
|
|
63
|
+
width?: number;
|
|
64
|
+
}>;
|
|
65
|
+
declare const PopoverBody: ({ children, height, width }: PopoverBodyProps) => React$1.JSX.Element;
|
|
66
|
+
|
|
61
67
|
type PopoverHeaderProps = {
|
|
62
|
-
title:
|
|
68
|
+
title: React$1.ReactNode;
|
|
63
69
|
onClose: () => void;
|
|
64
70
|
icon?: React$1.ReactNode;
|
|
65
71
|
actions?: React$1.ReactNode[];
|
|
@@ -94,13 +100,6 @@ declare const StyledMenuList: _emotion_styled.StyledComponent<any, {}, {
|
|
|
94
100
|
ref?: React$1.Ref<any> | undefined;
|
|
95
101
|
}>;
|
|
96
102
|
|
|
97
|
-
declare const PopoverScrollableContent: React$1.ForwardRefExoticComponent<{
|
|
98
|
-
height?: number | "auto";
|
|
99
|
-
width?: number;
|
|
100
|
-
} & {
|
|
101
|
-
children?: React$1.ReactNode | undefined;
|
|
102
|
-
} & React$1.RefAttributes<HTMLDivElement>>;
|
|
103
|
-
|
|
104
103
|
type Props = {
|
|
105
104
|
value: string;
|
|
106
105
|
onSearch: (search: string) => void;
|
|
@@ -134,4 +133,4 @@ declare const useEditable: ({ value, onSubmit, validation, onClick, onError }: U
|
|
|
134
133
|
};
|
|
135
134
|
};
|
|
136
135
|
|
|
137
|
-
export { EditableField, EllipsisWithTooltip, ITEM_HEIGHT, InfoAlert, InfoTipCard, IntroductionModal, MenuItemInfotip, MenuListItem, PopoverHeader, PopoverMenuList, type PopoverMenuListProps,
|
|
136
|
+
export { EditableField, EllipsisWithTooltip, ITEM_HEIGHT, InfoAlert, InfoTipCard, IntroductionModal, MenuItemInfotip, MenuListItem, PopoverBody, PopoverHeader, PopoverMenuList, type PopoverMenuListProps, PopoverSearch, StyledMenuList, ThemeProvider, type VirtualizedItem, WarningInfotip, useEditable };
|
package/dist/index.d.ts
CHANGED
|
@@ -58,8 +58,14 @@ interface WarningInfotipProps extends PropsWithChildren {
|
|
|
58
58
|
}
|
|
59
59
|
declare const WarningInfotip: React$1.ForwardRefExoticComponent<WarningInfotipProps & React$1.RefAttributes<unknown>>;
|
|
60
60
|
|
|
61
|
+
type PopoverBodyProps = PropsWithChildren<{
|
|
62
|
+
height?: number | 'auto';
|
|
63
|
+
width?: number;
|
|
64
|
+
}>;
|
|
65
|
+
declare const PopoverBody: ({ children, height, width }: PopoverBodyProps) => React$1.JSX.Element;
|
|
66
|
+
|
|
61
67
|
type PopoverHeaderProps = {
|
|
62
|
-
title:
|
|
68
|
+
title: React$1.ReactNode;
|
|
63
69
|
onClose: () => void;
|
|
64
70
|
icon?: React$1.ReactNode;
|
|
65
71
|
actions?: React$1.ReactNode[];
|
|
@@ -94,13 +100,6 @@ declare const StyledMenuList: _emotion_styled.StyledComponent<any, {}, {
|
|
|
94
100
|
ref?: React$1.Ref<any> | undefined;
|
|
95
101
|
}>;
|
|
96
102
|
|
|
97
|
-
declare const PopoverScrollableContent: React$1.ForwardRefExoticComponent<{
|
|
98
|
-
height?: number | "auto";
|
|
99
|
-
width?: number;
|
|
100
|
-
} & {
|
|
101
|
-
children?: React$1.ReactNode | undefined;
|
|
102
|
-
} & React$1.RefAttributes<HTMLDivElement>>;
|
|
103
|
-
|
|
104
103
|
type Props = {
|
|
105
104
|
value: string;
|
|
106
105
|
onSearch: (search: string) => void;
|
|
@@ -134,4 +133,4 @@ declare const useEditable: ({ value, onSubmit, validation, onClick, onError }: U
|
|
|
134
133
|
};
|
|
135
134
|
};
|
|
136
135
|
|
|
137
|
-
export { EditableField, EllipsisWithTooltip, ITEM_HEIGHT, InfoAlert, InfoTipCard, IntroductionModal, MenuItemInfotip, MenuListItem, PopoverHeader, PopoverMenuList, type PopoverMenuListProps,
|
|
136
|
+
export { EditableField, EllipsisWithTooltip, ITEM_HEIGHT, InfoAlert, InfoTipCard, IntroductionModal, MenuItemInfotip, MenuListItem, PopoverBody, PopoverHeader, PopoverMenuList, type PopoverMenuListProps, PopoverSearch, StyledMenuList, ThemeProvider, type VirtualizedItem, WarningInfotip, useEditable };
|
package/dist/index.js
CHANGED
|
@@ -38,9 +38,9 @@ __export(index_exports, {
|
|
|
38
38
|
IntroductionModal: () => IntroductionModal,
|
|
39
39
|
MenuItemInfotip: () => MenuItemInfotip,
|
|
40
40
|
MenuListItem: () => MenuListItem,
|
|
41
|
+
PopoverBody: () => PopoverBody,
|
|
41
42
|
PopoverHeader: () => PopoverHeader,
|
|
42
43
|
PopoverMenuList: () => PopoverMenuList,
|
|
43
|
-
PopoverScrollableContent: () => PopoverScrollableContent,
|
|
44
44
|
PopoverSearch: () => PopoverSearch,
|
|
45
45
|
StyledMenuList: () => StyledMenuList,
|
|
46
46
|
ThemeProvider: () => ThemeProvider,
|
|
@@ -251,7 +251,17 @@ var MenuItemInfotip = (0, import_react5.forwardRef)(
|
|
|
251
251
|
var React7 = __toESM(require("react"));
|
|
252
252
|
var import_ui7 = require("@elementor/ui");
|
|
253
253
|
var InfoTipCard = ({ content, svgIcon, learnMoreButton, ctaButton }) => {
|
|
254
|
-
return /* @__PURE__ */ React7.createElement(import_ui7.Card, { elevation: 0, sx: { width: 320 } }, /* @__PURE__ */ React7.createElement(import_ui7.CardContent, { sx: { pb: 0 } }, /* @__PURE__ */ React7.createElement(import_ui7.Box, { display: "flex", alignItems: "start" }, /* @__PURE__ */ React7.createElement(import_ui7.SvgIcon, { fontSize: "tiny", sx: { mr: 0.5 } }, svgIcon), /* @__PURE__ */ React7.createElement(import_ui7.Typography, { variant: "body2" }, content
|
|
254
|
+
return /* @__PURE__ */ React7.createElement(import_ui7.Card, { elevation: 0, sx: { width: 320 } }, /* @__PURE__ */ React7.createElement(import_ui7.CardContent, { sx: { pb: 0 } }, /* @__PURE__ */ React7.createElement(import_ui7.Box, { display: "flex", alignItems: "start" }, /* @__PURE__ */ React7.createElement(import_ui7.SvgIcon, { fontSize: "tiny", sx: { mr: 0.5 } }, svgIcon), /* @__PURE__ */ React7.createElement(import_ui7.Typography, { variant: "body2" }, content, learnMoreButton && /* @__PURE__ */ React7.createElement(React7.Fragment, null, "\xA0", /* @__PURE__ */ React7.createElement(import_ui7.Link, { color: "info.main", href: learnMoreButton.href, target: "_blank" }, learnMoreButton.label))))), ctaButton && /* @__PURE__ */ React7.createElement(import_ui7.CardActions, { sx: { justifyContent: "flex-start" } }, /* @__PURE__ */ React7.createElement(
|
|
255
|
+
import_ui7.Button,
|
|
256
|
+
{
|
|
257
|
+
size: "small",
|
|
258
|
+
color: "secondary",
|
|
259
|
+
variant: "contained",
|
|
260
|
+
onClick: ctaButton.onClick,
|
|
261
|
+
sx: { marginInlineStart: "1rem" }
|
|
262
|
+
},
|
|
263
|
+
ctaButton.label
|
|
264
|
+
)));
|
|
255
265
|
};
|
|
256
266
|
|
|
257
267
|
// src/components/warning-infotip.tsx
|
|
@@ -281,41 +291,47 @@ var WarningInfotip = (0, import_react6.forwardRef)(
|
|
|
281
291
|
}
|
|
282
292
|
);
|
|
283
293
|
|
|
284
|
-
// src/components/popover/
|
|
294
|
+
// src/components/popover/body.tsx
|
|
285
295
|
var React9 = __toESM(require("react"));
|
|
286
|
-
var import_editor_v1_adapters2 = require("@elementor/editor-v1-adapters");
|
|
287
296
|
var import_ui9 = require("@elementor/ui");
|
|
297
|
+
var SECTION_PADDING_INLINE = 32;
|
|
298
|
+
var DEFAULT_POPOVER_HEIGHT = 348;
|
|
299
|
+
var FALLBACK_POPOVER_WIDTH = 220;
|
|
300
|
+
var PopoverBody = ({ children, height = DEFAULT_POPOVER_HEIGHT, width }) => {
|
|
301
|
+
return /* @__PURE__ */ React9.createElement(
|
|
302
|
+
import_ui9.Box,
|
|
303
|
+
{
|
|
304
|
+
display: "flex",
|
|
305
|
+
flexDirection: "column",
|
|
306
|
+
sx: {
|
|
307
|
+
height,
|
|
308
|
+
overflow: "hidden",
|
|
309
|
+
width: `${width ? width - SECTION_PADDING_INLINE : FALLBACK_POPOVER_WIDTH}px`,
|
|
310
|
+
maxWidth: 496
|
|
311
|
+
}
|
|
312
|
+
},
|
|
313
|
+
children
|
|
314
|
+
);
|
|
315
|
+
};
|
|
316
|
+
|
|
317
|
+
// src/components/popover/header.tsx
|
|
318
|
+
var React10 = __toESM(require("react"));
|
|
319
|
+
var import_ui10 = require("@elementor/ui");
|
|
288
320
|
var SIZE = "tiny";
|
|
289
|
-
var isVersion330Active = (0, import_editor_v1_adapters2.isExperimentActive)("e_v_3_30");
|
|
290
321
|
var PopoverHeader = ({ title, onClose, icon, actions }) => {
|
|
291
|
-
const paddingAndSizing =
|
|
322
|
+
const paddingAndSizing = {
|
|
292
323
|
pl: 2,
|
|
293
324
|
pr: 1,
|
|
294
325
|
py: 1.5,
|
|
295
326
|
maxHeight: 36
|
|
296
|
-
} : {
|
|
297
|
-
pl: 1.5,
|
|
298
|
-
pr: 0.5,
|
|
299
|
-
py: 1.5
|
|
300
327
|
};
|
|
301
|
-
return /* @__PURE__ */
|
|
302
|
-
import_ui9.Typography,
|
|
303
|
-
{
|
|
304
|
-
variant: "subtitle2",
|
|
305
|
-
sx: isVersion330Active ? {
|
|
306
|
-
fontSize: "12px",
|
|
307
|
-
mt: 0.25
|
|
308
|
-
} : void 0
|
|
309
|
-
},
|
|
310
|
-
title
|
|
311
|
-
), /* @__PURE__ */ React9.createElement(import_ui9.Stack, { direction: "row", sx: { ml: "auto" } }, actions, /* @__PURE__ */ React9.createElement(import_ui9.CloseButton, { slotProps: { icon: { fontSize: SIZE } }, sx: { ml: "auto" }, onClick: onClose })));
|
|
328
|
+
return /* @__PURE__ */ React10.createElement(import_ui10.Stack, { direction: "row", alignItems: "center", ...paddingAndSizing, sx: { columnGap: 0.5 } }, icon, /* @__PURE__ */ React10.createElement(import_ui10.Typography, { variant: "subtitle2", sx: { fontSize: "12px", mt: 0.25 } }, title), /* @__PURE__ */ React10.createElement(import_ui10.Stack, { direction: "row", sx: { ml: "auto" } }, actions, /* @__PURE__ */ React10.createElement(import_ui10.CloseButton, { slotProps: { icon: { fontSize: SIZE } }, sx: { ml: "auto" }, onClick: onClose })));
|
|
312
329
|
};
|
|
313
330
|
|
|
314
331
|
// src/components/popover/menu-list.tsx
|
|
315
|
-
var
|
|
332
|
+
var React11 = __toESM(require("react"));
|
|
316
333
|
var import_react9 = require("react");
|
|
317
|
-
var
|
|
318
|
-
var import_ui10 = require("@elementor/ui");
|
|
334
|
+
var import_ui11 = require("@elementor/ui");
|
|
319
335
|
var import_react_virtual = require("@tanstack/react-virtual");
|
|
320
336
|
|
|
321
337
|
// src/hooks/use-scroll-to-selected.ts
|
|
@@ -355,7 +371,6 @@ var useScrollTop = ({ containerRef }) => {
|
|
|
355
371
|
};
|
|
356
372
|
|
|
357
373
|
// src/components/popover/menu-list.tsx
|
|
358
|
-
var isVersion330Active2 = (0, import_editor_v1_adapters3.isExperimentActive)("e_v_3_30");
|
|
359
374
|
var ITEM_HEIGHT = 32;
|
|
360
375
|
var LIST_ITEMS_BUFFER = 6;
|
|
361
376
|
var MENU_LIST_PADDING_TOP = 8;
|
|
@@ -414,7 +429,7 @@ var PopoverMenuList = ({
|
|
|
414
429
|
onChange
|
|
415
430
|
});
|
|
416
431
|
useScrollToSelected({ selectedValue, items, virtualizer });
|
|
417
|
-
return /* @__PURE__ */
|
|
432
|
+
return /* @__PURE__ */ React11.createElement(import_ui11.Box, { ref: containerRef, sx: { height: "100%", overflowY: "auto" } }, items.length === 0 && noResultsComponent ? noResultsComponent : /* @__PURE__ */ React11.createElement(
|
|
418
433
|
MenuListComponent,
|
|
419
434
|
{
|
|
420
435
|
role: "listbox",
|
|
@@ -432,17 +447,17 @@ var PopoverMenuList = ({
|
|
|
432
447
|
}
|
|
433
448
|
if (item.type === "category") {
|
|
434
449
|
const shouldStick = virtualRow.start + MENU_LIST_PADDING_TOP <= scrollTop;
|
|
435
|
-
return /* @__PURE__ */
|
|
436
|
-
|
|
450
|
+
return /* @__PURE__ */ React11.createElement(
|
|
451
|
+
import_ui11.MenuSubheader,
|
|
437
452
|
{
|
|
438
453
|
key: virtualRow.key,
|
|
439
454
|
style: shouldStick ? {} : menuSubHeaderAbsoluteStyling(virtualRow.start),
|
|
440
|
-
sx:
|
|
455
|
+
sx: { fontWeight: "400", color: "text.tertiary" }
|
|
441
456
|
},
|
|
442
457
|
item.label || item.value
|
|
443
458
|
);
|
|
444
459
|
}
|
|
445
|
-
return /* @__PURE__ */
|
|
460
|
+
return /* @__PURE__ */ React11.createElement(
|
|
446
461
|
"li",
|
|
447
462
|
{
|
|
448
463
|
key: virtualRow.key,
|
|
@@ -480,7 +495,7 @@ var PopoverMenuList = ({
|
|
|
480
495
|
})
|
|
481
496
|
));
|
|
482
497
|
};
|
|
483
|
-
var StyledMenuList = (0,
|
|
498
|
+
var StyledMenuList = (0, import_ui11.styled)(import_ui11.MenuList)(({ theme }) => ({
|
|
484
499
|
"& > li": {
|
|
485
500
|
height: ITEM_HEIGHT,
|
|
486
501
|
width: "100%",
|
|
@@ -507,39 +522,12 @@ var StyledMenuList = (0, import_ui10.styled)(import_ui10.MenuList)(({ theme }) =
|
|
|
507
522
|
position: "relative"
|
|
508
523
|
}));
|
|
509
524
|
|
|
510
|
-
// src/components/popover/scrollable-content.tsx
|
|
511
|
-
var React11 = __toESM(require("react"));
|
|
512
|
-
var import_editor_v1_adapters4 = require("@elementor/editor-v1-adapters");
|
|
513
|
-
var import_ui11 = require("@elementor/ui");
|
|
514
|
-
var SECTION_PADDING_INLINE = 32;
|
|
515
|
-
var DEFAULT_POPOVER_WIDTH = 220;
|
|
516
|
-
var isVersion330Active3 = (0, import_editor_v1_adapters4.isExperimentActive)("e_v_3_30");
|
|
517
|
-
var PopoverScrollableContent = React11.forwardRef(
|
|
518
|
-
({ children, height = 260, width = DEFAULT_POPOVER_WIDTH }, ref) => {
|
|
519
|
-
return /* @__PURE__ */ React11.createElement(
|
|
520
|
-
import_ui11.Box,
|
|
521
|
-
{
|
|
522
|
-
ref,
|
|
523
|
-
sx: {
|
|
524
|
-
overflowY: "auto",
|
|
525
|
-
height,
|
|
526
|
-
width: `${isVersion330Active3 ? width - SECTION_PADDING_INLINE : DEFAULT_POPOVER_WIDTH}px`,
|
|
527
|
-
maxWidth: 496
|
|
528
|
-
}
|
|
529
|
-
},
|
|
530
|
-
children
|
|
531
|
-
);
|
|
532
|
-
}
|
|
533
|
-
);
|
|
534
|
-
|
|
535
525
|
// src/components/popover/search.tsx
|
|
536
526
|
var React12 = __toESM(require("react"));
|
|
537
527
|
var import_react10 = require("react");
|
|
538
|
-
var import_editor_v1_adapters5 = require("@elementor/editor-v1-adapters");
|
|
539
528
|
var import_icons2 = require("@elementor/icons");
|
|
540
529
|
var import_ui12 = require("@elementor/ui");
|
|
541
530
|
var import_i18n2 = require("@wordpress/i18n");
|
|
542
|
-
var isVersion330Active4 = (0, import_editor_v1_adapters5.isExperimentActive)("e_v_3_30");
|
|
543
531
|
var SIZE2 = "tiny";
|
|
544
532
|
var PopoverSearch = ({ value, onSearch, placeholder }) => {
|
|
545
533
|
const inputRef = (0, import_react10.useRef)(null);
|
|
@@ -550,14 +538,7 @@ var PopoverSearch = ({ value, onSearch, placeholder }) => {
|
|
|
550
538
|
const handleInputChange = (event) => {
|
|
551
539
|
onSearch(event.target.value);
|
|
552
540
|
};
|
|
553
|
-
|
|
554
|
-
px: 2,
|
|
555
|
-
pb: 1.5
|
|
556
|
-
} : {
|
|
557
|
-
px: 1.5,
|
|
558
|
-
pb: 1
|
|
559
|
-
};
|
|
560
|
-
return /* @__PURE__ */ React12.createElement(import_ui12.Box, { ...padding }, /* @__PURE__ */ React12.createElement(
|
|
541
|
+
return /* @__PURE__ */ React12.createElement(import_ui12.Box, { sx: { px: 2, pb: 1.5 } }, /* @__PURE__ */ React12.createElement(
|
|
561
542
|
import_ui12.TextField,
|
|
562
543
|
{
|
|
563
544
|
autoFocus: true,
|
|
@@ -680,9 +661,9 @@ var selectAll = (el) => {
|
|
|
680
661
|
IntroductionModal,
|
|
681
662
|
MenuItemInfotip,
|
|
682
663
|
MenuListItem,
|
|
664
|
+
PopoverBody,
|
|
683
665
|
PopoverHeader,
|
|
684
666
|
PopoverMenuList,
|
|
685
|
-
PopoverScrollableContent,
|
|
686
667
|
PopoverSearch,
|
|
687
668
|
StyledMenuList,
|
|
688
669
|
ThemeProvider,
|
package/dist/index.mjs
CHANGED
|
@@ -212,9 +212,19 @@ var MenuItemInfotip = forwardRef4(
|
|
|
212
212
|
|
|
213
213
|
// src/components/infotip-card.tsx
|
|
214
214
|
import * as React7 from "react";
|
|
215
|
-
import { Box as Box3, Button as Button2, Card, CardActions, CardContent, SvgIcon, Typography as Typography2 } from "@elementor/ui";
|
|
215
|
+
import { Box as Box3, Button as Button2, Card, CardActions, CardContent, Link, SvgIcon, Typography as Typography2 } from "@elementor/ui";
|
|
216
216
|
var InfoTipCard = ({ content, svgIcon, learnMoreButton, ctaButton }) => {
|
|
217
|
-
return /* @__PURE__ */ React7.createElement(Card, { elevation: 0, sx: { width: 320 } }, /* @__PURE__ */ React7.createElement(CardContent, { sx: { pb: 0 } }, /* @__PURE__ */ React7.createElement(Box3, { display: "flex", alignItems: "start" }, /* @__PURE__ */ React7.createElement(SvgIcon, { fontSize: "tiny", sx: { mr: 0.5 } }, svgIcon), /* @__PURE__ */ React7.createElement(Typography2, { variant: "body2" }, content
|
|
217
|
+
return /* @__PURE__ */ React7.createElement(Card, { elevation: 0, sx: { width: 320 } }, /* @__PURE__ */ React7.createElement(CardContent, { sx: { pb: 0 } }, /* @__PURE__ */ React7.createElement(Box3, { display: "flex", alignItems: "start" }, /* @__PURE__ */ React7.createElement(SvgIcon, { fontSize: "tiny", sx: { mr: 0.5 } }, svgIcon), /* @__PURE__ */ React7.createElement(Typography2, { variant: "body2" }, content, learnMoreButton && /* @__PURE__ */ React7.createElement(React7.Fragment, null, "\xA0", /* @__PURE__ */ React7.createElement(Link, { color: "info.main", href: learnMoreButton.href, target: "_blank" }, learnMoreButton.label))))), ctaButton && /* @__PURE__ */ React7.createElement(CardActions, { sx: { justifyContent: "flex-start" } }, /* @__PURE__ */ React7.createElement(
|
|
218
|
+
Button2,
|
|
219
|
+
{
|
|
220
|
+
size: "small",
|
|
221
|
+
color: "secondary",
|
|
222
|
+
variant: "contained",
|
|
223
|
+
onClick: ctaButton.onClick,
|
|
224
|
+
sx: { marginInlineStart: "1rem" }
|
|
225
|
+
},
|
|
226
|
+
ctaButton.label
|
|
227
|
+
)));
|
|
218
228
|
};
|
|
219
229
|
|
|
220
230
|
// src/components/warning-infotip.tsx
|
|
@@ -244,41 +254,47 @@ var WarningInfotip = forwardRef5(
|
|
|
244
254
|
}
|
|
245
255
|
);
|
|
246
256
|
|
|
247
|
-
// src/components/popover/
|
|
257
|
+
// src/components/popover/body.tsx
|
|
248
258
|
import * as React9 from "react";
|
|
249
|
-
import {
|
|
259
|
+
import { Box as Box4 } from "@elementor/ui";
|
|
260
|
+
var SECTION_PADDING_INLINE = 32;
|
|
261
|
+
var DEFAULT_POPOVER_HEIGHT = 348;
|
|
262
|
+
var FALLBACK_POPOVER_WIDTH = 220;
|
|
263
|
+
var PopoverBody = ({ children, height = DEFAULT_POPOVER_HEIGHT, width }) => {
|
|
264
|
+
return /* @__PURE__ */ React9.createElement(
|
|
265
|
+
Box4,
|
|
266
|
+
{
|
|
267
|
+
display: "flex",
|
|
268
|
+
flexDirection: "column",
|
|
269
|
+
sx: {
|
|
270
|
+
height,
|
|
271
|
+
overflow: "hidden",
|
|
272
|
+
width: `${width ? width - SECTION_PADDING_INLINE : FALLBACK_POPOVER_WIDTH}px`,
|
|
273
|
+
maxWidth: 496
|
|
274
|
+
}
|
|
275
|
+
},
|
|
276
|
+
children
|
|
277
|
+
);
|
|
278
|
+
};
|
|
279
|
+
|
|
280
|
+
// src/components/popover/header.tsx
|
|
281
|
+
import * as React10 from "react";
|
|
250
282
|
import { CloseButton, Stack, Typography as Typography3 } from "@elementor/ui";
|
|
251
283
|
var SIZE = "tiny";
|
|
252
|
-
var isVersion330Active = isExperimentActive("e_v_3_30");
|
|
253
284
|
var PopoverHeader = ({ title, onClose, icon, actions }) => {
|
|
254
|
-
const paddingAndSizing =
|
|
285
|
+
const paddingAndSizing = {
|
|
255
286
|
pl: 2,
|
|
256
287
|
pr: 1,
|
|
257
288
|
py: 1.5,
|
|
258
289
|
maxHeight: 36
|
|
259
|
-
} : {
|
|
260
|
-
pl: 1.5,
|
|
261
|
-
pr: 0.5,
|
|
262
|
-
py: 1.5
|
|
263
290
|
};
|
|
264
|
-
return /* @__PURE__ */
|
|
265
|
-
Typography3,
|
|
266
|
-
{
|
|
267
|
-
variant: "subtitle2",
|
|
268
|
-
sx: isVersion330Active ? {
|
|
269
|
-
fontSize: "12px",
|
|
270
|
-
mt: 0.25
|
|
271
|
-
} : void 0
|
|
272
|
-
},
|
|
273
|
-
title
|
|
274
|
-
), /* @__PURE__ */ React9.createElement(Stack, { direction: "row", sx: { ml: "auto" } }, actions, /* @__PURE__ */ React9.createElement(CloseButton, { slotProps: { icon: { fontSize: SIZE } }, sx: { ml: "auto" }, onClick: onClose })));
|
|
291
|
+
return /* @__PURE__ */ React10.createElement(Stack, { direction: "row", alignItems: "center", ...paddingAndSizing, sx: { columnGap: 0.5 } }, icon, /* @__PURE__ */ React10.createElement(Typography3, { variant: "subtitle2", sx: { fontSize: "12px", mt: 0.25 } }, title), /* @__PURE__ */ React10.createElement(Stack, { direction: "row", sx: { ml: "auto" } }, actions, /* @__PURE__ */ React10.createElement(CloseButton, { slotProps: { icon: { fontSize: SIZE } }, sx: { ml: "auto" }, onClick: onClose })));
|
|
275
292
|
};
|
|
276
293
|
|
|
277
294
|
// src/components/popover/menu-list.tsx
|
|
278
|
-
import * as
|
|
295
|
+
import * as React11 from "react";
|
|
279
296
|
import { useMemo, useRef } from "react";
|
|
280
|
-
import {
|
|
281
|
-
import { Box as Box4, MenuList, MenuSubheader, styled as styled2 } from "@elementor/ui";
|
|
297
|
+
import { Box as Box5, MenuList, MenuSubheader, styled as styled2 } from "@elementor/ui";
|
|
282
298
|
import { useVirtualizer } from "@tanstack/react-virtual";
|
|
283
299
|
|
|
284
300
|
// src/hooks/use-scroll-to-selected.ts
|
|
@@ -318,7 +334,6 @@ var useScrollTop = ({ containerRef }) => {
|
|
|
318
334
|
};
|
|
319
335
|
|
|
320
336
|
// src/components/popover/menu-list.tsx
|
|
321
|
-
var isVersion330Active2 = isExperimentActive2("e_v_3_30");
|
|
322
337
|
var ITEM_HEIGHT = 32;
|
|
323
338
|
var LIST_ITEMS_BUFFER = 6;
|
|
324
339
|
var MENU_LIST_PADDING_TOP = 8;
|
|
@@ -377,7 +392,7 @@ var PopoverMenuList = ({
|
|
|
377
392
|
onChange
|
|
378
393
|
});
|
|
379
394
|
useScrollToSelected({ selectedValue, items, virtualizer });
|
|
380
|
-
return /* @__PURE__ */
|
|
395
|
+
return /* @__PURE__ */ React11.createElement(Box5, { ref: containerRef, sx: { height: "100%", overflowY: "auto" } }, items.length === 0 && noResultsComponent ? noResultsComponent : /* @__PURE__ */ React11.createElement(
|
|
381
396
|
MenuListComponent,
|
|
382
397
|
{
|
|
383
398
|
role: "listbox",
|
|
@@ -395,17 +410,17 @@ var PopoverMenuList = ({
|
|
|
395
410
|
}
|
|
396
411
|
if (item.type === "category") {
|
|
397
412
|
const shouldStick = virtualRow.start + MENU_LIST_PADDING_TOP <= scrollTop;
|
|
398
|
-
return /* @__PURE__ */
|
|
413
|
+
return /* @__PURE__ */ React11.createElement(
|
|
399
414
|
MenuSubheader,
|
|
400
415
|
{
|
|
401
416
|
key: virtualRow.key,
|
|
402
417
|
style: shouldStick ? {} : menuSubHeaderAbsoluteStyling(virtualRow.start),
|
|
403
|
-
sx:
|
|
418
|
+
sx: { fontWeight: "400", color: "text.tertiary" }
|
|
404
419
|
},
|
|
405
420
|
item.label || item.value
|
|
406
421
|
);
|
|
407
422
|
}
|
|
408
|
-
return /* @__PURE__ */
|
|
423
|
+
return /* @__PURE__ */ React11.createElement(
|
|
409
424
|
"li",
|
|
410
425
|
{
|
|
411
426
|
key: virtualRow.key,
|
|
@@ -470,39 +485,12 @@ var StyledMenuList = styled2(MenuList)(({ theme }) => ({
|
|
|
470
485
|
position: "relative"
|
|
471
486
|
}));
|
|
472
487
|
|
|
473
|
-
// src/components/popover/scrollable-content.tsx
|
|
474
|
-
import * as React11 from "react";
|
|
475
|
-
import { isExperimentActive as isExperimentActive3 } from "@elementor/editor-v1-adapters";
|
|
476
|
-
import { Box as Box5 } from "@elementor/ui";
|
|
477
|
-
var SECTION_PADDING_INLINE = 32;
|
|
478
|
-
var DEFAULT_POPOVER_WIDTH = 220;
|
|
479
|
-
var isVersion330Active3 = isExperimentActive3("e_v_3_30");
|
|
480
|
-
var PopoverScrollableContent = React11.forwardRef(
|
|
481
|
-
({ children, height = 260, width = DEFAULT_POPOVER_WIDTH }, ref) => {
|
|
482
|
-
return /* @__PURE__ */ React11.createElement(
|
|
483
|
-
Box5,
|
|
484
|
-
{
|
|
485
|
-
ref,
|
|
486
|
-
sx: {
|
|
487
|
-
overflowY: "auto",
|
|
488
|
-
height,
|
|
489
|
-
width: `${isVersion330Active3 ? width - SECTION_PADDING_INLINE : DEFAULT_POPOVER_WIDTH}px`,
|
|
490
|
-
maxWidth: 496
|
|
491
|
-
}
|
|
492
|
-
},
|
|
493
|
-
children
|
|
494
|
-
);
|
|
495
|
-
}
|
|
496
|
-
);
|
|
497
|
-
|
|
498
488
|
// src/components/popover/search.tsx
|
|
499
489
|
import * as React12 from "react";
|
|
500
490
|
import { useRef as useRef2 } from "react";
|
|
501
|
-
import { isExperimentActive as isExperimentActive4 } from "@elementor/editor-v1-adapters";
|
|
502
491
|
import { SearchIcon, XIcon } from "@elementor/icons";
|
|
503
492
|
import { Box as Box6, IconButton, InputAdornment, TextField } from "@elementor/ui";
|
|
504
493
|
import { __ as __2 } from "@wordpress/i18n";
|
|
505
|
-
var isVersion330Active4 = isExperimentActive4("e_v_3_30");
|
|
506
494
|
var SIZE2 = "tiny";
|
|
507
495
|
var PopoverSearch = ({ value, onSearch, placeholder }) => {
|
|
508
496
|
const inputRef = useRef2(null);
|
|
@@ -513,14 +501,7 @@ var PopoverSearch = ({ value, onSearch, placeholder }) => {
|
|
|
513
501
|
const handleInputChange = (event) => {
|
|
514
502
|
onSearch(event.target.value);
|
|
515
503
|
};
|
|
516
|
-
|
|
517
|
-
px: 2,
|
|
518
|
-
pb: 1.5
|
|
519
|
-
} : {
|
|
520
|
-
px: 1.5,
|
|
521
|
-
pb: 1
|
|
522
|
-
};
|
|
523
|
-
return /* @__PURE__ */ React12.createElement(Box6, { ...padding }, /* @__PURE__ */ React12.createElement(
|
|
504
|
+
return /* @__PURE__ */ React12.createElement(Box6, { sx: { px: 2, pb: 1.5 } }, /* @__PURE__ */ React12.createElement(
|
|
524
505
|
TextField,
|
|
525
506
|
{
|
|
526
507
|
autoFocus: true,
|
|
@@ -642,9 +623,9 @@ export {
|
|
|
642
623
|
IntroductionModal,
|
|
643
624
|
MenuItemInfotip,
|
|
644
625
|
MenuListItem,
|
|
626
|
+
PopoverBody,
|
|
645
627
|
PopoverHeader,
|
|
646
628
|
PopoverMenuList,
|
|
647
|
-
PopoverScrollableContent,
|
|
648
629
|
PopoverSearch,
|
|
649
630
|
StyledMenuList,
|
|
650
631
|
ThemeProvider,
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elementor/editor-ui",
|
|
3
3
|
"description": "Elementor Editor UI",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "3.32.0-20",
|
|
5
5
|
"private": false,
|
|
6
6
|
"author": "Elementor Team",
|
|
7
7
|
"homepage": "https://elementor.com/",
|
|
@@ -19,11 +19,11 @@
|
|
|
19
19
|
},
|
|
20
20
|
"repository": {
|
|
21
21
|
"type": "git",
|
|
22
|
-
"url": "https://github.com/elementor/elementor
|
|
22
|
+
"url": "https://github.com/elementor/elementor.git",
|
|
23
23
|
"directory": "packages/libs/editor-ui"
|
|
24
24
|
},
|
|
25
25
|
"bugs": {
|
|
26
|
-
"url": "https://github.com/elementor/elementor
|
|
26
|
+
"url": "https://github.com/elementor/elementor/issues"
|
|
27
27
|
},
|
|
28
28
|
"publishConfig": {
|
|
29
29
|
"access": "public"
|
|
@@ -37,9 +37,9 @@
|
|
|
37
37
|
"react-dom": "^18.3.1"
|
|
38
38
|
},
|
|
39
39
|
"dependencies": {
|
|
40
|
-
"@elementor/editor-v1-adapters": "
|
|
40
|
+
"@elementor/editor-v1-adapters": "3.32.0-20",
|
|
41
41
|
"@elementor/icons": "1.46.0",
|
|
42
|
-
"@elementor/ui": "1.36.
|
|
42
|
+
"@elementor/ui": "1.36.2",
|
|
43
43
|
"@tanstack/react-virtual": "^3.13.3",
|
|
44
44
|
"@wordpress/i18n": "^5.13.0"
|
|
45
45
|
},
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { type ReactNode } from 'react';
|
|
3
|
-
import { Box, Button, Card, CardActions, CardContent, SvgIcon, Typography } from '@elementor/ui';
|
|
3
|
+
import { Box, Button, Card, CardActions, CardContent, Link, SvgIcon, Typography } from '@elementor/ui';
|
|
4
4
|
|
|
5
5
|
type InfoTipCardProps = {
|
|
6
6
|
content: ReactNode;
|
|
@@ -23,22 +23,31 @@ export const InfoTipCard = ( { content, svgIcon, learnMoreButton, ctaButton }: I
|
|
|
23
23
|
<SvgIcon fontSize="tiny" sx={ { mr: 0.5 } }>
|
|
24
24
|
{ svgIcon }
|
|
25
25
|
</SvgIcon>
|
|
26
|
-
<Typography variant="body2">
|
|
26
|
+
<Typography variant="body2">
|
|
27
|
+
{ content }
|
|
28
|
+
{ learnMoreButton && (
|
|
29
|
+
<>
|
|
30
|
+
|
|
31
|
+
<Link color="info.main" href={ learnMoreButton.href } target="_blank">
|
|
32
|
+
{ learnMoreButton.label }
|
|
33
|
+
</Link>
|
|
34
|
+
</>
|
|
35
|
+
) }
|
|
36
|
+
</Typography>
|
|
27
37
|
</Box>
|
|
28
38
|
</CardContent>
|
|
29
39
|
|
|
30
|
-
{
|
|
31
|
-
<CardActions>
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
) }
|
|
40
|
+
{ ctaButton && (
|
|
41
|
+
<CardActions sx={ { justifyContent: 'flex-start' } }>
|
|
42
|
+
<Button
|
|
43
|
+
size="small"
|
|
44
|
+
color="secondary"
|
|
45
|
+
variant="contained"
|
|
46
|
+
onClick={ ctaButton.onClick }
|
|
47
|
+
sx={ { marginInlineStart: '1rem' } }
|
|
48
|
+
>
|
|
49
|
+
{ ctaButton.label }
|
|
50
|
+
</Button>
|
|
42
51
|
</CardActions>
|
|
43
52
|
) }
|
|
44
53
|
</Card>
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { type PropsWithChildren } from 'react';
|
|
3
|
+
import { Box } from '@elementor/ui';
|
|
4
|
+
|
|
5
|
+
const SECTION_PADDING_INLINE = 32;
|
|
6
|
+
const DEFAULT_POPOVER_HEIGHT = 348;
|
|
7
|
+
const FALLBACK_POPOVER_WIDTH = 220;
|
|
8
|
+
|
|
9
|
+
type PopoverBodyProps = PropsWithChildren< {
|
|
10
|
+
height?: number | 'auto';
|
|
11
|
+
width?: number;
|
|
12
|
+
} >;
|
|
13
|
+
|
|
14
|
+
export const PopoverBody = ( { children, height = DEFAULT_POPOVER_HEIGHT, width }: PopoverBodyProps ) => {
|
|
15
|
+
return (
|
|
16
|
+
<Box
|
|
17
|
+
display="flex"
|
|
18
|
+
flexDirection="column"
|
|
19
|
+
sx={ {
|
|
20
|
+
height,
|
|
21
|
+
overflow: 'hidden',
|
|
22
|
+
width: `${ width ? width - SECTION_PADDING_INLINE : FALLBACK_POPOVER_WIDTH }px`,
|
|
23
|
+
maxWidth: 496,
|
|
24
|
+
} }
|
|
25
|
+
>
|
|
26
|
+
{ children }
|
|
27
|
+
</Box>
|
|
28
|
+
);
|
|
29
|
+
};
|
|
@@ -1,46 +1,27 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { isExperimentActive } from '@elementor/editor-v1-adapters';
|
|
3
2
|
import { CloseButton, Stack, Typography } from '@elementor/ui';
|
|
4
3
|
|
|
5
4
|
const SIZE = 'tiny';
|
|
6
5
|
|
|
7
6
|
type PopoverHeaderProps = {
|
|
8
|
-
title:
|
|
7
|
+
title: React.ReactNode;
|
|
9
8
|
onClose: () => void;
|
|
10
9
|
icon?: React.ReactNode;
|
|
11
10
|
actions?: React.ReactNode[];
|
|
12
11
|
};
|
|
13
12
|
|
|
14
|
-
const isVersion330Active = isExperimentActive( 'e_v_3_30' );
|
|
15
|
-
|
|
16
13
|
export const PopoverHeader = ( { title, onClose, icon, actions }: PopoverHeaderProps ) => {
|
|
17
|
-
const paddingAndSizing =
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
}
|
|
24
|
-
: {
|
|
25
|
-
pl: 1.5,
|
|
26
|
-
pr: 0.5,
|
|
27
|
-
py: 1.5,
|
|
28
|
-
};
|
|
14
|
+
const paddingAndSizing = {
|
|
15
|
+
pl: 2,
|
|
16
|
+
pr: 1,
|
|
17
|
+
py: 1.5,
|
|
18
|
+
maxHeight: 36,
|
|
19
|
+
};
|
|
29
20
|
|
|
30
21
|
return (
|
|
31
22
|
<Stack direction="row" alignItems="center" { ...paddingAndSizing } sx={ { columnGap: 0.5 } }>
|
|
32
23
|
{ icon }
|
|
33
|
-
<Typography
|
|
34
|
-
variant="subtitle2"
|
|
35
|
-
sx={
|
|
36
|
-
isVersion330Active
|
|
37
|
-
? {
|
|
38
|
-
fontSize: '12px',
|
|
39
|
-
mt: 0.25,
|
|
40
|
-
}
|
|
41
|
-
: undefined
|
|
42
|
-
}
|
|
43
|
-
>
|
|
24
|
+
<Typography variant="subtitle2" sx={ { fontSize: '12px', mt: 0.25 } }>
|
|
44
25
|
{ title }
|
|
45
26
|
</Typography>
|
|
46
27
|
<Stack direction="row" sx={ { ml: 'auto' } }>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
export { PopoverBody } from './body';
|
|
1
2
|
export { PopoverHeader } from './header';
|
|
2
3
|
export { ITEM_HEIGHT, PopoverMenuList, StyledMenuList } from './menu-list';
|
|
3
4
|
export type { PopoverMenuListProps, VirtualizedItem } from './menu-list';
|
|
4
|
-
export { PopoverScrollableContent } from './scrollable-content';
|
|
5
5
|
export { PopoverSearch } from './search';
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { useMemo, useRef } from 'react';
|
|
3
|
-
import { isExperimentActive } from '@elementor/editor-v1-adapters';
|
|
4
3
|
import { Box, MenuList, MenuSubheader, styled } from '@elementor/ui';
|
|
5
4
|
import { useVirtualizer } from '@tanstack/react-virtual';
|
|
6
5
|
|
|
@@ -28,8 +27,6 @@ export type PopoverMenuListProps< T, V extends string > = {
|
|
|
28
27
|
noResultsComponent?: React.ReactNode;
|
|
29
28
|
};
|
|
30
29
|
|
|
31
|
-
const isVersion330Active = isExperimentActive( 'e_v_3_30' );
|
|
32
|
-
|
|
33
30
|
export const ITEM_HEIGHT = 32;
|
|
34
31
|
const LIST_ITEMS_BUFFER = 6;
|
|
35
32
|
const MENU_LIST_PADDING_TOP = 8;
|
|
@@ -110,7 +107,7 @@ export const PopoverMenuList = < T, V extends string >( {
|
|
|
110
107
|
useScrollToSelected( { selectedValue, items, virtualizer } );
|
|
111
108
|
|
|
112
109
|
return (
|
|
113
|
-
<Box ref={ containerRef }>
|
|
110
|
+
<Box ref={ containerRef } sx={ { height: '100%', overflowY: 'auto' } }>
|
|
114
111
|
{ items.length === 0 && noResultsComponent ? (
|
|
115
112
|
noResultsComponent
|
|
116
113
|
) : (
|
|
@@ -138,9 +135,7 @@ export const PopoverMenuList = < T, V extends string >( {
|
|
|
138
135
|
<MenuSubheader
|
|
139
136
|
key={ virtualRow.key }
|
|
140
137
|
style={ shouldStick ? {} : menuSubHeaderAbsoluteStyling( virtualRow.start ) }
|
|
141
|
-
sx={
|
|
142
|
-
isVersion330Active ? { fontWeight: '400', color: 'text.tertiary' } : undefined
|
|
143
|
-
}
|
|
138
|
+
sx={ { fontWeight: '400', color: 'text.tertiary' } }
|
|
144
139
|
>
|
|
145
140
|
{ item.label || item.value }
|
|
146
141
|
</MenuSubheader>
|
|
@@ -1,12 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { useRef } from 'react';
|
|
3
|
-
import { isExperimentActive } from '@elementor/editor-v1-adapters';
|
|
4
3
|
import { SearchIcon, XIcon } from '@elementor/icons';
|
|
5
4
|
import { Box, IconButton, InputAdornment, TextField } from '@elementor/ui';
|
|
6
5
|
import { __ } from '@wordpress/i18n';
|
|
7
6
|
|
|
8
|
-
const isVersion330Active = isExperimentActive( 'e_v_3_30' );
|
|
9
|
-
|
|
10
7
|
const SIZE = 'tiny';
|
|
11
8
|
|
|
12
9
|
type Props = {
|
|
@@ -28,18 +25,8 @@ export const PopoverSearch = ( { value, onSearch, placeholder }: Props ) => {
|
|
|
28
25
|
onSearch( event.target.value );
|
|
29
26
|
};
|
|
30
27
|
|
|
31
|
-
const padding = isVersion330Active
|
|
32
|
-
? {
|
|
33
|
-
px: 2,
|
|
34
|
-
pb: 1.5,
|
|
35
|
-
}
|
|
36
|
-
: {
|
|
37
|
-
px: 1.5,
|
|
38
|
-
pb: 1,
|
|
39
|
-
};
|
|
40
|
-
|
|
41
28
|
return (
|
|
42
|
-
<Box {
|
|
29
|
+
<Box sx={ { px: 2, pb: 1.5 } }>
|
|
43
30
|
<TextField
|
|
44
31
|
// eslint-disable-next-line jsx-a11y/no-autofocus
|
|
45
32
|
autoFocus
|
package/.turbo/turbo-build.log
DELETED
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
|
|
2
|
-
> @elementor/editor-ui@0.14.0 build
|
|
3
|
-
> tsup --config=../../tsup.build.ts
|
|
4
|
-
|
|
5
|
-
[34mCLI[39m Building entry: src/index.ts
|
|
6
|
-
[34mCLI[39m Using tsconfig: ../../../tsconfig.json
|
|
7
|
-
[34mCLI[39m tsup v8.5.0
|
|
8
|
-
[34mCLI[39m Using tsup config: /home/runner/work/elementor-packages/elementor-packages/tsup.build.ts
|
|
9
|
-
[34mCLI[39m Target: esnext
|
|
10
|
-
[34mCLI[39m Cleaning output folder
|
|
11
|
-
[34mESM[39m Build start
|
|
12
|
-
[34mCJS[39m Build start
|
|
13
|
-
[32mCJS[39m [1mdist/index.js [22m[32m23.49 KB[39m
|
|
14
|
-
[32mCJS[39m [1mdist/index.js.map [22m[32m40.38 KB[39m
|
|
15
|
-
[32mCJS[39m ⚡️ Build success in 112ms
|
|
16
|
-
[32mESM[39m [1mdist/index.mjs [22m[32m20.74 KB[39m
|
|
17
|
-
[32mESM[39m [1mdist/index.mjs.map [22m[32m39.98 KB[39m
|
|
18
|
-
[32mESM[39m ⚡️ Build success in 121ms
|
|
19
|
-
[34mDTS[39m Build start
|
|
20
|
-
[32mDTS[39m ⚡️ Build success in 17533ms
|
|
21
|
-
[32mDTS[39m [1mdist/index.d.mts [22m[32m5.18 KB[39m
|
|
22
|
-
[32mDTS[39m [1mdist/index.d.ts [22m[32m5.18 KB[39m
|
package/dist/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/components/ellipsis-with-tooltip.tsx","../src/components/editable-field.tsx","../src/components/introduction-modal.tsx","../src/components/theme-provider.tsx","../src/hooks/use-color-scheme.ts","../src/components/menu-item.tsx","../src/components/info-alert.tsx","../src/components/infotip-card.tsx","../src/components/warning-infotip.tsx","../src/components/popover/header.tsx","../src/components/popover/menu-list.tsx","../src/hooks/use-scroll-to-selected.ts","../src/hooks/use-scroll-top.ts","../src/components/popover/scrollable-content.tsx","../src/components/popover/search.tsx","../src/hooks/use-editable.ts"],"sourcesContent":["// components\nexport { EllipsisWithTooltip } from './components/ellipsis-with-tooltip';\nexport { EditableField } from './components/editable-field';\nexport { IntroductionModal } from './components/introduction-modal';\nexport { default as ThemeProvider } from './components/theme-provider';\nexport { MenuListItem, MenuItemInfotip } from './components/menu-item';\nexport { InfoTipCard } from './components/infotip-card';\nexport { InfoAlert } from './components/info-alert';\nexport { WarningInfotip } from './components/warning-infotip';\nexport * from './components/popover';\n\n// hooks\nexport { useEditable } from './hooks/use-editable';\n","import * as React from 'react';\nimport { useEffect, useState } from 'react';\nimport { Box, Tooltip } from '@elementor/ui';\n\ntype EllipsisWithTooltipProps< T extends React.ElementType > = {\n\tmaxWidth?: React.CSSProperties[ 'maxWidth' ];\n\ttitle: string;\n\tas?: T;\n} & React.ComponentProps< T >;\n\nexport const EllipsisWithTooltip = < T extends React.ElementType >( {\n\tmaxWidth,\n\ttitle,\n\tas,\n\t...props\n}: EllipsisWithTooltipProps< T > ) => {\n\tconst [ setRef, isOverflowing ] = useIsOverflowing();\n\n\tif ( isOverflowing ) {\n\t\treturn (\n\t\t\t<Tooltip title={ title } placement=\"top\">\n\t\t\t\t<Content maxWidth={ maxWidth } ref={ setRef } as={ as } { ...props }>\n\t\t\t\t\t{ title }\n\t\t\t\t</Content>\n\t\t\t</Tooltip>\n\t\t);\n\t}\n\n\treturn (\n\t\t<Content maxWidth={ maxWidth } ref={ setRef } as={ as } { ...props }>\n\t\t\t{ title }\n\t\t</Content>\n\t);\n};\n\ntype ContentProps< T extends React.ElementType > = React.PropsWithChildren<\n\tOmit< EllipsisWithTooltipProps< T >, 'title' >\n>;\n\nconst Content = React.forwardRef(\n\t< T extends React.ElementType >(\n\t\t{ maxWidth, as: Component = Box, ...props }: ContentProps< T >,\n\t\t// forwardRef loses the typing when using generic components.\n\t\tref: unknown\n\t) => (\n\t\t<Component\n\t\t\tref={ ref }\n\t\t\tposition=\"relative\"\n\t\t\t{ ...props }\n\t\t\tstyle={ { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', maxWidth } }\n\t\t/>\n\t)\n);\n\nconst useIsOverflowing = () => {\n\tconst [ el, setEl ] = useState< HTMLElement | null >( null );\n\tconst [ isOverflowing, setIsOverflown ] = useState( false );\n\n\tuseEffect( () => {\n\t\tconst observer = new ResizeObserver( ( [ { target } ] ) => {\n\t\t\tsetIsOverflown( target.scrollWidth > target.clientWidth );\n\t\t} );\n\n\t\tif ( el ) {\n\t\t\tobserver.observe( el );\n\t\t}\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t};\n\t}, [ el ] );\n\n\treturn [ setEl, isOverflowing ] as const;\n};\n","import * as React from 'react';\nimport { forwardRef } from 'react';\nimport { Box, styled, Tooltip } from '@elementor/ui';\n\ntype EditableFieldProps< T extends React.ElementType > = {\n\tvalue: string;\n\terror?: string;\n\tas?: T;\n} & React.ComponentPropsWithRef< T >;\n\nexport const EditableField = forwardRef(\n\t< T extends React.ElementType >(\n\t\t{ value, error, as = 'span', sx, ...props }: EditableFieldProps< T >,\n\t\tref: unknown\n\t) => {\n\t\treturn (\n\t\t\t<Tooltip title={ error } open={ !! error } placement=\"top\">\n\t\t\t\t<StyledField ref={ ref } component={ as } { ...props }>\n\t\t\t\t\t{ value }\n\t\t\t\t</StyledField>\n\t\t\t</Tooltip>\n\t\t);\n\t}\n);\n\nconst StyledField = styled( Box )`\n\twidth: 100%;\n\t&:focus {\n\t\toutline: none;\n\t}\n`;\n","import * as React from 'react';\nimport { useState } from 'react';\nimport {\n\tButton,\n\tCheckbox,\n\tDialog,\n\tDialogActions,\n\tDialogHeader,\n\tDialogTitle,\n\tFade,\n\ttype FadeProps,\n\tFormControlLabel,\n\tTypography,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\ntype IntroductionModalProps = React.PropsWithChildren< {\n\topen: boolean;\n\thandleClose: ( shouldShowAgain: boolean ) => void;\n\ttitle?: string;\n} >;\n\nexport const IntroductionModal = ( { open, handleClose, title, children }: IntroductionModalProps ) => {\n\tconst [ shouldShowAgain, setShouldShowAgain ] = useState( true );\n\n\treturn (\n\t\t<Dialog open={ open } onClose={ handleClose } maxWidth={ 'sm' } TransitionComponent={ Transition }>\n\t\t\t{ title && (\n\t\t\t\t<DialogHeader logo={ false }>\n\t\t\t\t\t<DialogTitle>{ title }</DialogTitle>\n\t\t\t\t</DialogHeader>\n\t\t\t) }\n\t\t\t{ children }\n\t\t\t<DialogActions>\n\t\t\t\t<FormControlLabel\n\t\t\t\t\tsx={ { marginRight: 'auto' } }\n\t\t\t\t\tcontrol={\n\t\t\t\t\t\t<Checkbox\n\t\t\t\t\t\t\tchecked={ ! shouldShowAgain }\n\t\t\t\t\t\t\tonChange={ () => setShouldShowAgain( ! shouldShowAgain ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t}\n\t\t\t\t\tlabel={\n\t\t\t\t\t\t<Typography variant={ 'body2' }>{ __( \"Don't show this again\", 'elementor' ) }</Typography>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<Button\n\t\t\t\t\tsize={ 'medium' }\n\t\t\t\t\tvariant=\"contained\"\n\t\t\t\t\tsx={ { minWidth: '135px' } }\n\t\t\t\t\tonClick={ () => handleClose( shouldShowAgain ) }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Got it', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t</DialogActions>\n\t\t</Dialog>\n\t);\n};\n\nconst Transition = React.forwardRef( ( props: FadeProps, ref: React.Ref< unknown > ) => (\n\t<Fade\n\t\tref={ ref }\n\t\t{ ...props }\n\t\ttimeout={ {\n\t\t\tenter: 1000,\n\t\t\texit: 200,\n\t\t} }\n\t/>\n) );\n","import * as React from 'react';\nimport { ThemeProvider as ThemeProviderBase, type ThemeProviderProps } from '@elementor/ui';\n\nimport { useColorScheme } from '../hooks/use-color-scheme';\n\nconst EDITOR_PALLETTE: ThemeProviderProps[ 'palette' ] = 'unstable';\n\nexport default function ThemeProvider( { children }: { children: React.ReactNode } ) {\n\tconst colorScheme = useColorScheme();\n\n\treturn (\n\t\t<ThemeProviderBase colorScheme={ colorScheme } palette={ EDITOR_PALLETTE }>\n\t\t\t{ children }\n\t\t</ThemeProviderBase>\n\t);\n}\n","import { useEffect, useState } from 'react';\nimport {\n\t__privateListenTo as listenTo,\n\tcommandEndEvent,\n\ttype CommandEvent,\n\tv1ReadyEvent,\n} from '@elementor/editor-v1-adapters';\n\nexport type ColorScheme = 'auto' | 'dark' | 'light';\n\nexport type ExtendedWindow = Window & {\n\telementor: {\n\t\tgetPreferences: ( key: 'ui_theme' ) => ColorScheme;\n\t};\n};\n\nexport function useColorScheme() {\n\tconst [ colorScheme, setColorScheme ] = useState< ColorScheme >( () => getV1ColorScheme() );\n\n\tuseEffect( () => {\n\t\treturn listenTo( v1ReadyEvent(), () => setColorScheme( getV1ColorScheme() ) );\n\t}, [] );\n\n\tuseEffect( () => {\n\t\treturn listenTo( commandEndEvent( 'document/elements/settings' ), ( e ) => {\n\t\t\tconst event = e as CommandEvent< {\n\t\t\t\tsettings: {\n\t\t\t\t\tui_theme?: ColorScheme;\n\t\t\t\t};\n\t\t\t} >;\n\n\t\t\t// The User-Preferences settings object has a key named `ui_theme` that controls the color scheme.\n\t\t\tconst isColorScheme = event.args?.settings && 'ui_theme' in event.args.settings;\n\n\t\t\tif ( isColorScheme ) {\n\t\t\t\tsetColorScheme( getV1ColorScheme() );\n\t\t\t}\n\t\t} );\n\t}, [] );\n\n\treturn colorScheme;\n}\n\nfunction getV1ColorScheme() {\n\treturn ( window as unknown as ExtendedWindow ).elementor?.getPreferences?.( 'ui_theme' ) || 'auto';\n}\n","import * as React from 'react';\nimport { forwardRef } from 'react';\nimport { Infotip, MenuItem, type MenuItemProps, MenuItemText } from '@elementor/ui';\n\nimport { InfoAlert } from './info-alert';\n\nexport const MenuListItem = ( { children, ...props }: MenuItemProps ) => {\n\treturn (\n\t\t<MenuItem\n\t\t\tdense\n\t\t\t{ ...props }\n\t\t\tsx={ {\n\t\t\t\t...( props.sx ?? {} ),\n\t\t\t} }\n\t\t>\n\t\t\t<MenuItemText\n\t\t\t\tprimary={ children }\n\t\t\t\tprimaryTypographyProps={ {\n\t\t\t\t\tvariant: 'caption',\n\t\t\t\t} }\n\t\t\t/>\n\t\t</MenuItem>\n\t);\n};\n\ntype MenuItemInfotipProps = React.PropsWithChildren< {\n\tshowInfoTip?: boolean;\n\tchildren: React.ReactNode;\n\tcontent: string;\n} >;\n\nexport const MenuItemInfotip = forwardRef(\n\t( { showInfoTip = false, children, content }: MenuItemInfotipProps, ref: unknown ) => {\n\t\tif ( ! showInfoTip ) {\n\t\t\treturn <>{ children }</>;\n\t\t}\n\n\t\treturn (\n\t\t\t<Infotip\n\t\t\t\tref={ ref }\n\t\t\t\tplacement={ 'right' }\n\t\t\t\tarrow={ false }\n\t\t\t\tcontent={ <InfoAlert sx={ { maxWidth: 325 } }>{ content }</InfoAlert> }\n\t\t\t>\n\t\t\t\t{ /* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */ }\n\t\t\t\t<div style={ { pointerEvents: 'initial', width: '100%' } } onClick={ ( e ) => e.stopPropagation() }>\n\t\t\t\t\t{ children }\n\t\t\t\t</div>\n\t\t\t</Infotip>\n\t\t);\n\t}\n);\n","import * as React from 'react';\nimport { InfoCircleFilledIcon } from '@elementor/icons';\nimport { Alert, type AlertProps } from '@elementor/ui';\n\nexport const InfoAlert = ( props: AlertProps ) => (\n\t<Alert\n\t\ticon={ <InfoCircleFilledIcon fontSize=\"small\" color=\"secondary\" /> }\n\t\tvariant={ 'standard' }\n\t\tcolor=\"secondary\"\n\t\televation={ 0 }\n\t\tsize=\"small\"\n\t\t{ ...props }\n\t/>\n);\n","import * as React from 'react';\nimport { type ReactNode } from 'react';\nimport { Box, Button, Card, CardActions, CardContent, SvgIcon, Typography } from '@elementor/ui';\n\ntype InfoTipCardProps = {\n\tcontent: ReactNode;\n\tsvgIcon: ReactNode;\n\tlearnMoreButton?: {\n\t\tlabel: string;\n\t\thref: string;\n\t};\n\tctaButton?: {\n\t\tlabel: string;\n\t\tonClick: () => void;\n\t};\n};\n\nexport const InfoTipCard = ( { content, svgIcon, learnMoreButton, ctaButton }: InfoTipCardProps ) => {\n\treturn (\n\t\t<Card elevation={ 0 } sx={ { width: 320 } }>\n\t\t\t<CardContent sx={ { pb: 0 } }>\n\t\t\t\t<Box display=\"flex\" alignItems=\"start\">\n\t\t\t\t\t<SvgIcon fontSize=\"tiny\" sx={ { mr: 0.5 } }>\n\t\t\t\t\t\t{ svgIcon }\n\t\t\t\t\t</SvgIcon>\n\t\t\t\t\t<Typography variant=\"body2\">{ content }</Typography>\n\t\t\t\t</Box>\n\t\t\t</CardContent>\n\n\t\t\t{ ( ctaButton || learnMoreButton ) && (\n\t\t\t\t<CardActions>\n\t\t\t\t\t{ learnMoreButton && (\n\t\t\t\t\t\t<Button size=\"small\" color=\"warning\" href={ learnMoreButton.href } target=\"_blank\">\n\t\t\t\t\t\t\t{ learnMoreButton.label }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ctaButton && (\n\t\t\t\t\t\t<Button size=\"small\" color=\"warning\" variant=\"contained\" onClick={ ctaButton.onClick }>\n\t\t\t\t\t\t\t{ ctaButton.label }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t</CardActions>\n\t\t\t) }\n\t\t</Card>\n\t);\n};\n","import { forwardRef, type PropsWithChildren } from 'react';\nimport * as React from 'react';\nimport { Alert, AlertTitle, Infotip, type InfotipProps } from '@elementor/ui';\n\ninterface WarningInfotipProps extends PropsWithChildren {\n\topen: boolean;\n\ttitle?: string;\n\ttext: string;\n\tplacement: InfotipProps[ 'placement' ];\n\twidth?: string | number;\n\toffset?: number[];\n}\n\nexport const WarningInfotip = forwardRef(\n\t( { children, open, title, text, placement, width, offset }: WarningInfotipProps, ref: unknown ) => {\n\t\treturn (\n\t\t\t<Infotip\n\t\t\t\tref={ ref }\n\t\t\t\topen={ open }\n\t\t\t\tplacement={ placement }\n\t\t\t\tPopperProps={ {\n\t\t\t\t\tsx: {\n\t\t\t\t\t\twidth: width ? width : 'initial',\n\t\t\t\t\t\t'.MuiTooltip-tooltip': { marginLeft: 0, marginRight: 0 },\n\t\t\t\t\t},\n\t\t\t\t\tmodifiers: offset ? [ { name: 'offset', options: { offset } } ] : [],\n\t\t\t\t} }\n\t\t\t\tarrow={ false }\n\t\t\t\tcontent={\n\t\t\t\t\t<Alert color=\"error\" severity=\"warning\" variant=\"standard\" size=\"small\">\n\t\t\t\t\t\t{ title ? <AlertTitle>{ title }</AlertTitle> : null }\n\t\t\t\t\t\t{ text }\n\t\t\t\t\t</Alert>\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</Infotip>\n\t\t);\n\t}\n);\n","import * as React from 'react';\nimport { isExperimentActive } from '@elementor/editor-v1-adapters';\nimport { CloseButton, Stack, Typography } from '@elementor/ui';\n\nconst SIZE = 'tiny';\n\ntype PopoverHeaderProps = {\n\ttitle: string;\n\tonClose: () => void;\n\ticon?: React.ReactNode;\n\tactions?: React.ReactNode[];\n};\n\nconst isVersion330Active = isExperimentActive( 'e_v_3_30' );\n\nexport const PopoverHeader = ( { title, onClose, icon, actions }: PopoverHeaderProps ) => {\n\tconst paddingAndSizing = isVersion330Active\n\t\t? {\n\t\t\t\tpl: 2,\n\t\t\t\tpr: 1,\n\t\t\t\tpy: 1.5,\n\t\t\t\tmaxHeight: 36,\n\t\t }\n\t\t: {\n\t\t\t\tpl: 1.5,\n\t\t\t\tpr: 0.5,\n\t\t\t\tpy: 1.5,\n\t\t };\n\n\treturn (\n\t\t<Stack direction=\"row\" alignItems=\"center\" { ...paddingAndSizing } sx={ { columnGap: 0.5 } }>\n\t\t\t{ icon }\n\t\t\t<Typography\n\t\t\t\tvariant=\"subtitle2\"\n\t\t\t\tsx={\n\t\t\t\t\tisVersion330Active\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\tfontSize: '12px',\n\t\t\t\t\t\t\t\tmt: 0.25,\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{ title }\n\t\t\t</Typography>\n\t\t\t<Stack direction=\"row\" sx={ { ml: 'auto' } }>\n\t\t\t\t{ actions }\n\t\t\t\t<CloseButton slotProps={ { icon: { fontSize: SIZE } } } sx={ { ml: 'auto' } } onClick={ onClose } />\n\t\t\t</Stack>\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { useMemo, useRef } from 'react';\nimport { isExperimentActive } from '@elementor/editor-v1-adapters';\nimport { Box, MenuList, MenuSubheader, styled } from '@elementor/ui';\nimport { useVirtualizer } from '@tanstack/react-virtual';\n\nimport { useScrollTop, useScrollToSelected } from '../../hooks';\n\nexport type VirtualizedItem< T, V extends string > = {\n\ttype: T;\n\tvalue: V;\n\tlabel?: string;\n\ticon?: React.ReactNode;\n\tsecondaryText?: string;\n\t[ key: string ]: unknown;\n};\n\nexport type PopoverMenuListProps< T, V extends string > = {\n\titems: VirtualizedItem< T, V >[];\n\tonSelect: ( value: V ) => void;\n\tonClose: () => void;\n\tselectedValue?: V;\n\titemStyle?: ( item: VirtualizedItem< T, V > ) => React.CSSProperties;\n\t'data-testid'?: string;\n\tonChange?: ( params: { getVirtualIndexes: () => number[] } ) => void;\n\tmenuListTemplate?: React.ComponentType< React.ComponentProps< typeof MenuList > >;\n\tmenuItemContentTemplate?: ( item: VirtualizedItem< T, V > ) => React.ReactNode;\n\tnoResultsComponent?: React.ReactNode;\n};\n\nconst isVersion330Active = isExperimentActive( 'e_v_3_30' );\n\nexport const ITEM_HEIGHT = 32;\nconst LIST_ITEMS_BUFFER = 6;\nconst MENU_LIST_PADDING_TOP = 8;\n\nconst menuSubHeaderAbsoluteStyling = ( start: number ) => ( {\n\tposition: 'absolute',\n\ttransform: `translateY(${ start + MENU_LIST_PADDING_TOP }px)`,\n} );\n\nconst getAdjacentStickyIndices = (\n\tstickyIndices: number[],\n\trange: { startIndex: number; endIndex: number }\n): number[] => {\n\tconst previousTwoStickyIndices = stickyIndices\n\t\t.filter( ( stickyIndex ) => stickyIndex < range.startIndex )\n\t\t.slice( -2 );\n\n\tconst nextTwoStickyIndices = stickyIndices.filter( ( stickyIndex ) => stickyIndex > range.endIndex ).slice( 0, 2 );\n\n\treturn [ ...previousTwoStickyIndices, ...nextTwoStickyIndices ];\n};\n\nexport const PopoverMenuList = < T, V extends string >( {\n\titems,\n\tonSelect,\n\tonClose,\n\tselectedValue,\n\titemStyle,\n\tonChange,\n\t'data-testid': dataTestId,\n\tmenuItemContentTemplate,\n\tnoResultsComponent,\n\tmenuListTemplate: CustomMenuList,\n}: PopoverMenuListProps< T, V > ) => {\n\tconst containerRef = useRef< HTMLDivElement >( null );\n\tconst scrollTop = useScrollTop( { containerRef } );\n\n\tconst MenuListComponent = CustomMenuList || StyledMenuList;\n\n\tconst stickyIndices = useMemo(\n\t\t() =>\n\t\t\titems.reduce( ( categoryIndices, item, index ) => {\n\t\t\t\tif ( item.type === 'category' ) {\n\t\t\t\t\tcategoryIndices.push( index );\n\t\t\t\t}\n\t\t\t\treturn categoryIndices;\n\t\t\t}, [] as number[] ),\n\t\t[ items ]\n\t);\n\n\tconst getActiveItemIndices = ( range: { startIndex: number; endIndex: number } ) => {\n\t\tconst visibleAndStickyIndexes: number[] = [];\n\n\t\tfor ( let i = range.startIndex; i <= range.endIndex; i++ ) {\n\t\t\tvisibleAndStickyIndexes.push( i );\n\t\t}\n\n\t\tconst stickyIndicesToShow = getAdjacentStickyIndices( stickyIndices, range );\n\n\t\tstickyIndicesToShow.forEach( ( stickyIndex ) => {\n\t\t\tif ( ! visibleAndStickyIndexes.includes( stickyIndex ) ) {\n\t\t\t\tvisibleAndStickyIndexes.push( stickyIndex );\n\t\t\t}\n\t\t} );\n\n\t\treturn visibleAndStickyIndexes.sort( ( a, b ) => a - b );\n\t};\n\n\tconst virtualizer = useVirtualizer( {\n\t\tcount: items.length,\n\t\tgetScrollElement: () => containerRef.current,\n\t\testimateSize: () => ITEM_HEIGHT,\n\t\toverscan: LIST_ITEMS_BUFFER,\n\t\trangeExtractor: getActiveItemIndices,\n\t\tonChange,\n\t} );\n\n\tuseScrollToSelected( { selectedValue, items, virtualizer } );\n\n\treturn (\n\t\t<Box ref={ containerRef }>\n\t\t\t{ items.length === 0 && noResultsComponent ? (\n\t\t\t\tnoResultsComponent\n\t\t\t) : (\n\t\t\t\t<MenuListComponent\n\t\t\t\t\trole=\"listbox\"\n\t\t\t\t\tstyle={ { height: `${ virtualizer.getTotalSize() }px` } }\n\t\t\t\t\tdata-testid={ dataTestId }\n\t\t\t\t>\n\t\t\t\t\t{ virtualizer.getVirtualItems().map( ( virtualRow ) => {\n\t\t\t\t\t\tconst item = items[ virtualRow.index ];\n\t\t\t\t\t\tconst isLast = virtualRow.index === items.length - 1;\n\t\t\t\t\t\tconst isFirst =\n\t\t\t\t\t\t\titems[ 0 ]?.type === 'category' ? virtualRow.index === 1 : virtualRow.index === 0;\n\t\t\t\t\t\tconst isSelected = selectedValue === item.value;\n\t\t\t\t\t\tconst tabIndexFallback = ! selectedValue ? 0 : -1;\n\n\t\t\t\t\t\tif ( ! item ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif ( item.type === 'category' ) {\n\t\t\t\t\t\t\tconst shouldStick = virtualRow.start + MENU_LIST_PADDING_TOP <= scrollTop;\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<MenuSubheader\n\t\t\t\t\t\t\t\t\tkey={ virtualRow.key }\n\t\t\t\t\t\t\t\t\tstyle={ shouldStick ? {} : menuSubHeaderAbsoluteStyling( virtualRow.start ) }\n\t\t\t\t\t\t\t\t\tsx={\n\t\t\t\t\t\t\t\t\t\tisVersion330Active ? { fontWeight: '400', color: 'text.tertiary' } : undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ item.label || item.value }\n\t\t\t\t\t\t\t\t</MenuSubheader>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t\tkey={ virtualRow.key }\n\t\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\t\taria-selected={ isSelected }\n\t\t\t\t\t\t\t\tonClick={ ( e ) => {\n\t\t\t\t\t\t\t\t\tif ( ( e.target as HTMLElement ).closest( 'button' ) ) {\n\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonSelect( item.value );\n\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\t\t\tif ( event.key === 'Enter' ) {\n\t\t\t\t\t\t\t\t\t\tonSelect( item.value );\n\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\tif ( event.key === 'ArrowDown' && isLast ) {\n\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\tif ( event.key === 'ArrowUp' && isFirst ) {\n\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttabIndex={ isSelected ? 0 : tabIndexFallback }\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\ttransform: `translateY(${ virtualRow.start + MENU_LIST_PADDING_TOP }px)`,\n\t\t\t\t\t\t\t\t\t...( itemStyle ? itemStyle( item ) : {} ),\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ menuItemContentTemplate ? menuItemContentTemplate( item ) : item.label || item.value }\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</MenuListComponent>\n\t\t\t) }\n\t\t</Box>\n\t);\n};\n\nexport const StyledMenuList = styled( MenuList )( ( { theme } ) => ( {\n\t'& > li': {\n\t\theight: ITEM_HEIGHT,\n\t\twidth: '100%',\n\t\tdisplay: 'flex',\n\t\talignItems: 'center',\n\t},\n\t'& > [role=\"option\"]': {\n\t\t...theme.typography.caption,\n\t\tlineHeight: 'inherit',\n\t\tpadding: theme.spacing( 0.75, 2, 0.75, 4 ),\n\t\t'&:hover, &:focus': {\n\t\t\tbackgroundColor: theme.palette.action.hover,\n\t\t},\n\t\t'&[aria-selected=\"true\"]': {\n\t\t\tbackgroundColor: theme.palette.action.selected,\n\t\t},\n\t\tcursor: 'pointer',\n\t\ttextOverflow: 'ellipsis',\n\t\tposition: 'absolute',\n\t\ttop: 0,\n\t\tleft: 0,\n\t},\n\twidth: '100%',\n\tposition: 'relative',\n} ) );\n","import { useEffect } from 'react';\nimport type { Virtualizer } from '@tanstack/react-virtual';\n\nimport type { VirtualizedItem } from '../components/popover/menu-list';\n\ntype UseScrollToSelectedProps< T, V extends string > = {\n\tselectedValue?: V;\n\titems: VirtualizedItem< T, V >[];\n\tvirtualizer: Virtualizer< HTMLDivElement, Element >;\n};\n\nexport const useScrollToSelected = < T, V extends string >( {\n\tselectedValue,\n\titems,\n\tvirtualizer,\n}: UseScrollToSelectedProps< T, V > ) => {\n\tuseEffect( () => {\n\t\tif ( ! selectedValue || items.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst selectedIndex = items.findIndex( ( item ) => item.value === selectedValue );\n\n\t\tif ( selectedIndex !== -1 ) {\n\t\t\tvirtualizer.scrollToIndex( selectedIndex, { align: 'center' } );\n\t\t}\n\t}, [ selectedValue, items, virtualizer ] );\n};\n","import { useEffect, useState } from 'react';\n\ntype UseScrollTopProps = {\n\tcontainerRef: React.RefObject< HTMLDivElement >;\n};\n\nexport const useScrollTop = ( { containerRef }: UseScrollTopProps ) => {\n\tconst [ scrollTop, setScrollTop ] = useState( 0 );\n\n\tuseEffect( () => {\n\t\tconst container = containerRef.current;\n\n\t\tif ( ! container ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handleScroll = () => {\n\t\t\tsetScrollTop( container.scrollTop );\n\t\t};\n\n\t\tcontainer.addEventListener( 'scroll', handleScroll );\n\t\treturn () => container.removeEventListener( 'scroll', handleScroll );\n\t}, [ containerRef ] );\n\n\treturn scrollTop;\n};\n","import * as React from 'react';\nimport { type PropsWithChildren } from 'react';\nimport { isExperimentActive } from '@elementor/editor-v1-adapters';\nimport { Box } from '@elementor/ui';\n\nconst SECTION_PADDING_INLINE = 32;\nconst DEFAULT_POPOVER_WIDTH = 220;\n\ntype PopoverScrollableContentProps = PropsWithChildren< {\n\theight?: number | 'auto';\n\twidth?: number;\n} >;\n\nconst isVersion330Active = isExperimentActive( 'e_v_3_30' );\n\nexport const PopoverScrollableContent = React.forwardRef< HTMLDivElement, PopoverScrollableContentProps >(\n\t( { children, height = 260, width = DEFAULT_POPOVER_WIDTH }, ref ) => {\n\t\treturn (\n\t\t\t<Box\n\t\t\t\tref={ ref }\n\t\t\t\tsx={ {\n\t\t\t\t\toverflowY: 'auto',\n\t\t\t\t\theight,\n\t\t\t\t\twidth: `${ isVersion330Active ? width - SECTION_PADDING_INLINE : DEFAULT_POPOVER_WIDTH }px`,\n\t\t\t\t\tmaxWidth: 496,\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</Box>\n\t\t);\n\t}\n);\n","import * as React from 'react';\nimport { useRef } from 'react';\nimport { isExperimentActive } from '@elementor/editor-v1-adapters';\nimport { SearchIcon, XIcon } from '@elementor/icons';\nimport { Box, IconButton, InputAdornment, TextField } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nconst isVersion330Active = isExperimentActive( 'e_v_3_30' );\n\nconst SIZE = 'tiny';\n\ntype Props = {\n\tvalue: string;\n\tonSearch: ( search: string ) => void;\n\tplaceholder: string;\n};\n\nexport const PopoverSearch = ( { value, onSearch, placeholder }: Props ) => {\n\tconst inputRef = useRef< HTMLInputElement | null >( null );\n\n\tconst handleClear = () => {\n\t\tonSearch( '' );\n\n\t\tinputRef.current?.focus();\n\t};\n\n\tconst handleInputChange = ( event: React.ChangeEvent< HTMLInputElement > ) => {\n\t\tonSearch( event.target.value );\n\t};\n\n\tconst padding = isVersion330Active\n\t\t? {\n\t\t\t\tpx: 2,\n\t\t\t\tpb: 1.5,\n\t\t }\n\t\t: {\n\t\t\t\tpx: 1.5,\n\t\t\t\tpb: 1,\n\t\t };\n\n\treturn (\n\t\t<Box { ...padding }>\n\t\t\t<TextField\n\t\t\t\t// eslint-disable-next-line jsx-a11y/no-autofocus\n\t\t\t\tautoFocus\n\t\t\t\tfullWidth\n\t\t\t\tsize={ SIZE }\n\t\t\t\tvalue={ value }\n\t\t\t\tinputRef={ inputRef }\n\t\t\t\tonChange={ handleInputChange }\n\t\t\t\tplaceholder={ placeholder }\n\t\t\t\tInputProps={ {\n\t\t\t\t\tstartAdornment: (\n\t\t\t\t\t\t<InputAdornment position=\"start\">\n\t\t\t\t\t\t\t<SearchIcon fontSize={ SIZE } />\n\t\t\t\t\t\t</InputAdornment>\n\t\t\t\t\t),\n\t\t\t\t\tendAdornment: value && (\n\t\t\t\t\t\t<IconButton size={ SIZE } onClick={ handleClear } aria-label={ __( 'Clear', 'elementor' ) }>\n\t\t\t\t\t\t\t<XIcon color=\"action\" fontSize={ SIZE } />\n\t\t\t\t\t\t</IconButton>\n\t\t\t\t\t),\n\t\t\t\t} }\n\t\t\t/>\n\t\t</Box>\n\t);\n};\n","import { useEffect, useRef, useState } from 'react';\n\ntype UseEditableParams = {\n\tvalue: string;\n\tonSubmit: ( value: string ) => unknown;\n\tvalidation?: ( value: string ) => string | null;\n\tonClick?: ( event: React.MouseEvent< HTMLDivElement > ) => void;\n\tonError?: ( error: string | null ) => void;\n};\n\nexport const useEditable = ( { value, onSubmit, validation, onClick, onError }: UseEditableParams ) => {\n\tconst [ isEditing, setIsEditing ] = useState( false );\n\tconst [ error, setError ] = useState< string | null >( null );\n\n\tconst ref = useSelection( isEditing );\n\n\tconst isDirty = ( newValue: string ) => newValue !== value;\n\n\tconst openEditMode = () => {\n\t\tsetIsEditing( true );\n\t};\n\n\tconst closeEditMode = () => {\n\t\tref.current?.blur();\n\n\t\tsetError( null );\n\t\tonError?.( null );\n\t\tsetIsEditing( false );\n\t};\n\n\tconst submit = ( newValue: string ) => {\n\t\tif ( ! isDirty( newValue ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( ! error ) {\n\t\t\ttry {\n\t\t\t\tonSubmit( newValue );\n\t\t\t} finally {\n\t\t\t\tcloseEditMode();\n\t\t\t}\n\t\t}\n\t};\n\n\tconst onChange = ( event: React.ChangeEvent< HTMLSpanElement > ) => {\n\t\tconst { innerText: newValue } = event.target;\n\n\t\tif ( validation ) {\n\t\t\tconst updatedError = isDirty( newValue ) ? validation( newValue ) : null;\n\n\t\t\tsetError( updatedError );\n\t\t\tonError?.( updatedError );\n\t\t}\n\t};\n\n\tconst handleKeyDown = ( event: React.KeyboardEvent ) => {\n\t\tevent.stopPropagation();\n\n\t\tif ( [ 'Escape' ].includes( event.key ) ) {\n\t\t\treturn closeEditMode();\n\t\t}\n\n\t\tif ( [ 'Enter' ].includes( event.key ) ) {\n\t\t\tevent.preventDefault();\n\t\t\treturn submit( ( event.target as HTMLElement ).innerText );\n\t\t}\n\t};\n\n\tconst handleClick = ( event: React.MouseEvent< HTMLDivElement > ) => {\n\t\tif ( isEditing ) {\n\t\t\tevent.stopPropagation();\n\t\t}\n\n\t\tonClick?.( event );\n\t};\n\n\tconst listeners = {\n\t\tonClick: handleClick,\n\t\tonKeyDown: handleKeyDown,\n\t\tonInput: onChange,\n\t\tonBlur: closeEditMode,\n\t} as const;\n\n\tconst attributes = {\n\t\tvalue,\n\t\trole: 'textbox',\n\t\tcontentEditable: isEditing,\n\t\t...( isEditing && {\n\t\t\tsuppressContentEditableWarning: true,\n\t\t} ),\n\t} as const;\n\n\treturn {\n\t\tref,\n\t\tisEditing,\n\t\topenEditMode,\n\t\tcloseEditMode,\n\t\tvalue,\n\t\terror,\n\t\tgetProps: () => ( { ...listeners, ...attributes } ),\n\t} as const;\n};\n\nconst useSelection = ( isEditing: boolean ) => {\n\tconst ref = useRef< HTMLElement | null >( null );\n\n\tuseEffect( () => {\n\t\tif ( isEditing ) {\n\t\t\tselectAll( ref.current );\n\t\t}\n\t}, [ isEditing ] );\n\n\treturn ref;\n};\n\nconst selectAll = ( el: HTMLElement | null ) => {\n\tconst selection = getSelection();\n\n\tif ( ! selection || ! el ) {\n\t\treturn;\n\t}\n\n\tconst range = document.createRange();\n\trange.selectNodeContents( el );\n\n\tselection.removeAllRanges();\n\tselection.addRange( range );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,YAAuB;AACvB,mBAAoC;AACpC,gBAA6B;AAQtB,IAAM,sBAAsB,CAAiC;AAAA,EACnE;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACJ,MAAsC;AACrC,QAAM,CAAE,QAAQ,aAAc,IAAI,iBAAiB;AAEnD,MAAK,eAAgB;AACpB,WACC,oCAAC,qBAAQ,OAAgB,WAAU,SAClC,oCAAC,WAAQ,UAAsB,KAAM,QAAS,IAAY,GAAG,SAC1D,KACH,CACD;AAAA,EAEF;AAEA,SACC,oCAAC,WAAQ,UAAsB,KAAM,QAAS,IAAY,GAAG,SAC1D,KACH;AAEF;AAMA,IAAM,UAAgB;AAAA,EACrB,CACC,EAAE,UAAU,IAAI,YAAY,eAAK,GAAG,MAAM,GAE1C,QAEA;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,UAAS;AAAA,MACP,GAAG;AAAA,MACL,OAAQ,EAAE,UAAU,UAAU,cAAc,YAAY,YAAY,UAAU,SAAS;AAAA;AAAA,EACxF;AAEF;AAEA,IAAM,mBAAmB,MAAM;AAC9B,QAAM,CAAE,IAAI,KAAM,QAAI,uBAAgC,IAAK;AAC3D,QAAM,CAAE,eAAe,cAAe,QAAI,uBAAU,KAAM;AAE1D,8BAAW,MAAM;AAChB,UAAM,WAAW,IAAI,eAAgB,CAAE,CAAE,EAAE,OAAO,CAAE,MAAO;AAC1D,qBAAgB,OAAO,cAAc,OAAO,WAAY;AAAA,IACzD,CAAE;AAEF,QAAK,IAAK;AACT,eAAS,QAAS,EAAG;AAAA,IACtB;AAEA,WAAO,MAAM;AACZ,eAAS,WAAW;AAAA,IACrB;AAAA,EACD,GAAG,CAAE,EAAG,CAAE;AAEV,SAAO,CAAE,OAAO,aAAc;AAC/B;;;ACzEA,IAAAA,SAAuB;AACvB,IAAAC,gBAA2B;AAC3B,IAAAC,aAAqC;AAQ9B,IAAM,oBAAgB;AAAA,EAC5B,CACC,EAAE,OAAO,OAAO,KAAK,QAAQ,IAAI,GAAG,MAAM,GAC1C,QACI;AACJ,WACC,qCAAC,sBAAQ,OAAQ,OAAQ,MAAO,CAAC,CAAE,OAAQ,WAAU,SACpD,qCAAC,eAAY,KAAY,WAAY,IAAO,GAAG,SAC5C,KACH,CACD;AAAA,EAEF;AACD;AAEA,IAAM,kBAAc,mBAAQ,cAAI;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACzBhC,IAAAC,SAAuB;AACvB,IAAAC,gBAAyB;AACzB,IAAAC,aAWO;AACP,kBAAmB;AAQZ,IAAM,oBAAoB,CAAE,EAAE,MAAM,aAAa,OAAO,SAAS,MAA+B;AACtG,QAAM,CAAE,iBAAiB,kBAAmB,QAAI,wBAAU,IAAK;AAE/D,SACC,qCAAC,qBAAO,MAAc,SAAU,aAAc,UAAW,MAAO,qBAAsB,cACnF,SACD,qCAAC,2BAAa,MAAO,SACpB,qCAAC,8BAAc,KAAO,CACvB,GAEC,UACF,qCAAC,gCACA;AAAA,IAAC;AAAA;AAAA,MACA,IAAK,EAAE,aAAa,OAAO;AAAA,MAC3B,SACC;AAAA,QAAC;AAAA;AAAA,UACA,SAAU,CAAE;AAAA,UACZ,UAAW,MAAM,mBAAoB,CAAE,eAAgB;AAAA;AAAA,MACxD;AAAA,MAED,OACC,qCAAC,yBAAW,SAAU,eAAY,gBAAI,yBAAyB,WAAY,CAAG;AAAA;AAAA,EAEhF,GACA;AAAA,IAAC;AAAA;AAAA,MACA,MAAO;AAAA,MACP,SAAQ;AAAA,MACR,IAAK,EAAE,UAAU,QAAQ;AAAA,MACzB,SAAU,MAAM,YAAa,eAAgB;AAAA;AAAA,QAE3C,gBAAI,UAAU,WAAY;AAAA,EAC7B,CACD,CACD;AAEF;AAEA,IAAM,aAAmB,kBAAY,CAAE,OAAkB,QACxD;AAAA,EAAC;AAAA;AAAA,IACA;AAAA,IACE,GAAG;AAAA,IACL,SAAU;AAAA,MACT,OAAO;AAAA,MACP,MAAM;AAAA,IACP;AAAA;AACD,CACC;;;ACpEF,IAAAC,SAAuB;AACvB,IAAAC,aAA4E;;;ACD5E,IAAAC,gBAAoC;AACpC,gCAKO;AAUA,SAAS,iBAAiB;AAChC,QAAM,CAAE,aAAa,cAAe,QAAI,wBAAyB,MAAM,iBAAiB,CAAE;AAE1F,+BAAW,MAAM;AAChB,eAAO,0BAAAC,uBAAU,wCAAa,GAAG,MAAM,eAAgB,iBAAiB,CAAE,CAAE;AAAA,EAC7E,GAAG,CAAC,CAAE;AAEN,+BAAW,MAAM;AAChB,eAAO,0BAAAA,uBAAU,2CAAiB,4BAA6B,GAAG,CAAE,MAAO;AAC1E,YAAM,QAAQ;AAOd,YAAM,gBAAgB,MAAM,MAAM,YAAY,cAAc,MAAM,KAAK;AAEvE,UAAK,eAAgB;AACpB,uBAAgB,iBAAiB,CAAE;AAAA,MACpC;AAAA,IACD,CAAE;AAAA,EACH,GAAG,CAAC,CAAE;AAEN,SAAO;AACR;AAEA,SAAS,mBAAmB;AAC3B,SAAS,OAAsC,WAAW,iBAAkB,UAAW,KAAK;AAC7F;;;ADxCA,IAAM,kBAAmD;AAE1C,SAAR,cAAgC,EAAE,SAAS,GAAmC;AACpF,QAAM,cAAc,eAAe;AAEnC,SACC,qCAAC,WAAAC,eAAA,EAAkB,aAA4B,SAAU,mBACtD,QACH;AAEF;;;AEfA,IAAAC,SAAuB;AACvB,IAAAC,gBAA2B;AAC3B,IAAAC,aAAoE;;;ACFpE,IAAAC,SAAuB;AACvB,mBAAqC;AACrC,IAAAC,aAAuC;AAEhC,IAAM,YAAY,CAAE,UAC1B;AAAA,EAAC;AAAA;AAAA,IACA,MAAO,qCAAC,qCAAqB,UAAS,SAAQ,OAAM,aAAY;AAAA,IAChE,SAAU;AAAA,IACV,OAAM;AAAA,IACN,WAAY;AAAA,IACZ,MAAK;AAAA,IACH,GAAG;AAAA;AACN;;;ADNM,IAAM,eAAe,CAAE,EAAE,UAAU,GAAG,MAAM,MAAsB;AACxE,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAK;AAAA,MACH,GAAG;AAAA,MACL,IAAK;AAAA,QACJ,GAAK,MAAM,MAAM,CAAC;AAAA,MACnB;AAAA;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACA,SAAU;AAAA,QACV,wBAAyB;AAAA,UACxB,SAAS;AAAA,QACV;AAAA;AAAA,IACD;AAAA,EACD;AAEF;AAQO,IAAM,sBAAkB;AAAA,EAC9B,CAAE,EAAE,cAAc,OAAO,UAAU,QAAQ,GAAyB,QAAkB;AACrF,QAAK,CAAE,aAAc;AACpB,aAAO,4DAAI,QAAU;AAAA,IACtB;AAEA,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,WAAY;AAAA,QACZ,OAAQ;AAAA,QACR,SAAU,qCAAC,aAAU,IAAK,EAAE,UAAU,IAAI,KAAM,OAAS;AAAA;AAAA,MAGzD,qCAAC,SAAI,OAAQ,EAAE,eAAe,WAAW,OAAO,OAAO,GAAI,SAAU,CAAE,MAAO,EAAE,gBAAgB,KAC7F,QACH;AAAA,IACD;AAAA,EAEF;AACD;;;AEnDA,IAAAC,SAAuB;AAEvB,IAAAC,aAAiF;AAe1E,IAAM,cAAc,CAAE,EAAE,SAAS,SAAS,iBAAiB,UAAU,MAAyB;AACpG,SACC,qCAAC,mBAAK,WAAY,GAAI,IAAK,EAAE,OAAO,IAAI,KACvC,qCAAC,0BAAY,IAAK,EAAE,IAAI,EAAE,KACzB,qCAAC,kBAAI,SAAQ,QAAO,YAAW,WAC9B,qCAAC,sBAAQ,UAAS,QAAO,IAAK,EAAE,IAAI,IAAI,KACrC,OACH,GACA,qCAAC,yBAAW,SAAQ,WAAU,OAAS,CACxC,CACD,IAEI,aAAa,oBAChB,qCAAC,8BACE,mBACD,qCAAC,qBAAO,MAAK,SAAQ,OAAM,WAAU,MAAO,gBAAgB,MAAO,QAAO,YACvE,gBAAgB,KACnB,GAEC,aACD,qCAAC,qBAAO,MAAK,SAAQ,OAAM,WAAU,SAAQ,aAAY,SAAU,UAAU,WAC1E,UAAU,KACb,CAEF,CAEF;AAEF;;;AC7CA,IAAAC,gBAAmD;AACnD,IAAAC,SAAuB;AACvB,IAAAC,aAA8D;AAWvD,IAAM,qBAAiB;AAAA,EAC7B,CAAE,EAAE,UAAU,MAAM,OAAO,MAAM,WAAW,OAAO,OAAO,GAAwB,QAAkB;AACnG,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,aAAc;AAAA,UACb,IAAI;AAAA,YACH,OAAO,QAAQ,QAAQ;AAAA,YACvB,uBAAuB,EAAE,YAAY,GAAG,aAAa,EAAE;AAAA,UACxD;AAAA,UACA,WAAW,SAAS,CAAE,EAAE,MAAM,UAAU,SAAS,EAAE,OAAO,EAAE,CAAE,IAAI,CAAC;AAAA,QACpE;AAAA,QACA,OAAQ;AAAA,QACR,SACC,qCAAC,oBAAM,OAAM,SAAQ,UAAS,WAAU,SAAQ,YAAW,MAAK,WAC7D,QAAQ,qCAAC,6BAAa,KAAO,IAAgB,MAC7C,IACH;AAAA;AAAA,MAGC;AAAA,IACH;AAAA,EAEF;AACD;;;ACvCA,IAAAC,SAAuB;AACvB,IAAAC,6BAAmC;AACnC,IAAAC,aAA+C;AAE/C,IAAM,OAAO;AASb,IAAM,yBAAqB,+CAAoB,UAAW;AAEnD,IAAM,gBAAgB,CAAE,EAAE,OAAO,SAAS,MAAM,QAAQ,MAA2B;AACzF,QAAM,mBAAmB,qBACtB;AAAA,IACA,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,WAAW;AAAA,EACX,IACA;AAAA,IACA,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACJ;AAEH,SACC,qCAAC,oBAAM,WAAU,OAAM,YAAW,UAAW,GAAG,kBAAmB,IAAK,EAAE,WAAW,IAAI,KACtF,MACF;AAAA,IAAC;AAAA;AAAA,MACA,SAAQ;AAAA,MACR,IACC,qBACG;AAAA,QACA,UAAU;AAAA,QACV,IAAI;AAAA,MACJ,IACA;AAAA;AAAA,IAGF;AAAA,EACH,GACA,qCAAC,oBAAM,WAAU,OAAM,IAAK,EAAE,IAAI,OAAO,KACtC,SACF,qCAAC,0BAAY,WAAY,EAAE,MAAM,EAAE,UAAU,KAAK,EAAE,GAAI,IAAK,EAAE,IAAI,OAAO,GAAI,SAAU,SAAU,CACnG,CACD;AAEF;;;ACnDA,IAAAC,UAAuB;AACvB,IAAAC,gBAAgC;AAChC,IAAAC,6BAAmC;AACnC,IAAAC,cAAqD;AACrD,2BAA+B;;;ACJ/B,IAAAC,gBAA0B;AAWnB,IAAM,sBAAsB,CAAyB;AAAA,EAC3D;AAAA,EACA;AAAA,EACA;AACD,MAAyC;AACxC,+BAAW,MAAM;AAChB,QAAK,CAAE,iBAAiB,MAAM,WAAW,GAAI;AAC5C;AAAA,IACD;AAEA,UAAM,gBAAgB,MAAM,UAAW,CAAE,SAAU,KAAK,UAAU,aAAc;AAEhF,QAAK,kBAAkB,IAAK;AAC3B,kBAAY,cAAe,eAAe,EAAE,OAAO,SAAS,CAAE;AAAA,IAC/D;AAAA,EACD,GAAG,CAAE,eAAe,OAAO,WAAY,CAAE;AAC1C;;;AC3BA,IAAAC,gBAAoC;AAM7B,IAAM,eAAe,CAAE,EAAE,aAAa,MAA0B;AACtE,QAAM,CAAE,WAAW,YAAa,QAAI,wBAAU,CAAE;AAEhD,+BAAW,MAAM;AAChB,UAAM,YAAY,aAAa;AAE/B,QAAK,CAAE,WAAY;AAClB;AAAA,IACD;AAEA,UAAM,eAAe,MAAM;AAC1B,mBAAc,UAAU,SAAU;AAAA,IACnC;AAEA,cAAU,iBAAkB,UAAU,YAAa;AACnD,WAAO,MAAM,UAAU,oBAAqB,UAAU,YAAa;AAAA,EACpE,GAAG,CAAE,YAAa,CAAE;AAEpB,SAAO;AACR;;;AFKA,IAAMC,0BAAqB,+CAAoB,UAAW;AAEnD,IAAM,cAAc;AAC3B,IAAM,oBAAoB;AAC1B,IAAM,wBAAwB;AAE9B,IAAM,+BAA+B,CAAE,WAAqB;AAAA,EAC3D,UAAU;AAAA,EACV,WAAW,cAAe,QAAQ,qBAAsB;AACzD;AAEA,IAAM,2BAA2B,CAChC,eACA,UACc;AACd,QAAM,2BAA2B,cAC/B,OAAQ,CAAE,gBAAiB,cAAc,MAAM,UAAW,EAC1D,MAAO,EAAG;AAEZ,QAAM,uBAAuB,cAAc,OAAQ,CAAE,gBAAiB,cAAc,MAAM,QAAS,EAAE,MAAO,GAAG,CAAE;AAEjH,SAAO,CAAE,GAAG,0BAA0B,GAAG,oBAAqB;AAC/D;AAEO,IAAM,kBAAkB,CAAyB;AAAA,EACvD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA,kBAAkB;AACnB,MAAqC;AACpC,QAAM,mBAAe,sBAA0B,IAAK;AACpD,QAAM,YAAY,aAAc,EAAE,aAAa,CAAE;AAEjD,QAAM,oBAAoB,kBAAkB;AAE5C,QAAM,oBAAgB;AAAA,IACrB,MACC,MAAM,OAAQ,CAAE,iBAAiB,MAAM,UAAW;AACjD,UAAK,KAAK,SAAS,YAAa;AAC/B,wBAAgB,KAAM,KAAM;AAAA,MAC7B;AACA,aAAO;AAAA,IACR,GAAG,CAAC,CAAc;AAAA,IACnB,CAAE,KAAM;AAAA,EACT;AAEA,QAAM,uBAAuB,CAAE,UAAqD;AACnF,UAAM,0BAAoC,CAAC;AAE3C,aAAU,IAAI,MAAM,YAAY,KAAK,MAAM,UAAU,KAAM;AAC1D,8BAAwB,KAAM,CAAE;AAAA,IACjC;AAEA,UAAM,sBAAsB,yBAA0B,eAAe,KAAM;AAE3E,wBAAoB,QAAS,CAAE,gBAAiB;AAC/C,UAAK,CAAE,wBAAwB,SAAU,WAAY,GAAI;AACxD,gCAAwB,KAAM,WAAY;AAAA,MAC3C;AAAA,IACD,CAAE;AAEF,WAAO,wBAAwB,KAAM,CAAE,GAAG,MAAO,IAAI,CAAE;AAAA,EACxD;AAEA,QAAM,kBAAc,qCAAgB;AAAA,IACnC,OAAO,MAAM;AAAA,IACb,kBAAkB,MAAM,aAAa;AAAA,IACrC,cAAc,MAAM;AAAA,IACpB,UAAU;AAAA,IACV,gBAAgB;AAAA,IAChB;AAAA,EACD,CAAE;AAEF,sBAAqB,EAAE,eAAe,OAAO,YAAY,CAAE;AAE3D,SACC,sCAAC,mBAAI,KAAM,gBACR,MAAM,WAAW,KAAK,qBACvB,qBAEA;AAAA,IAAC;AAAA;AAAA,MACA,MAAK;AAAA,MACL,OAAQ,EAAE,QAAQ,GAAI,YAAY,aAAa,CAAE,KAAK;AAAA,MACtD,eAAc;AAAA;AAAA,IAEZ,YAAY,gBAAgB,EAAE,IAAK,CAAE,eAAgB;AACtD,YAAM,OAAO,MAAO,WAAW,KAAM;AACrC,YAAM,SAAS,WAAW,UAAU,MAAM,SAAS;AACnD,YAAM,UACL,MAAO,CAAE,GAAG,SAAS,aAAa,WAAW,UAAU,IAAI,WAAW,UAAU;AACjF,YAAM,aAAa,kBAAkB,KAAK;AAC1C,YAAM,mBAAmB,CAAE,gBAAgB,IAAI;AAE/C,UAAK,CAAE,MAAO;AACb,eAAO;AAAA,MACR;AAEA,UAAK,KAAK,SAAS,YAAa;AAC/B,cAAM,cAAc,WAAW,QAAQ,yBAAyB;AAEhE,eACC;AAAA,UAAC;AAAA;AAAA,YACA,KAAM,WAAW;AAAA,YACjB,OAAQ,cAAc,CAAC,IAAI,6BAA8B,WAAW,KAAM;AAAA,YAC1E,IACCA,sBAAqB,EAAE,YAAY,OAAO,OAAO,gBAAgB,IAAI;AAAA;AAAA,UAGpE,KAAK,SAAS,KAAK;AAAA,QACtB;AAAA,MAEF;AAEA,aACC;AAAA,QAAC;AAAA;AAAA,UACA,KAAM,WAAW;AAAA,UACjB,MAAK;AAAA,UACL,iBAAgB;AAAA,UAChB,SAAU,CAAE,MAAO;AAClB,gBAAO,EAAE,OAAwB,QAAS,QAAS,GAAI;AACtD;AAAA,YACD;AACA,qBAAU,KAAK,KAAM;AACrB,oBAAQ;AAAA,UACT;AAAA,UACA,WAAY,CAAE,UAAW;AACxB,gBAAK,MAAM,QAAQ,SAAU;AAC5B,uBAAU,KAAK,KAAM;AACrB,sBAAQ;AAAA,YACT;AAEA,gBAAK,MAAM,QAAQ,eAAe,QAAS;AAC1C,oBAAM,eAAe;AACrB,oBAAM,gBAAgB;AAAA,YACvB;AAEA,gBAAK,MAAM,QAAQ,aAAa,SAAU;AACzC,oBAAM,eAAe;AACrB,oBAAM,gBAAgB;AAAA,YACvB;AAAA,UACD;AAAA,UACA,UAAW,aAAa,IAAI;AAAA,UAC5B,OAAQ;AAAA,YACP,WAAW,cAAe,WAAW,QAAQ,qBAAsB;AAAA,YACnE,GAAK,YAAY,UAAW,IAAK,IAAI,CAAC;AAAA,UACvC;AAAA;AAAA,QAEE,0BAA0B,wBAAyB,IAAK,IAAI,KAAK,SAAS,KAAK;AAAA,MAClF;AAAA,IAEF,CAAE;AAAA,EACH,CAEF;AAEF;AAEO,IAAM,qBAAiB,oBAAQ,oBAAS,EAAG,CAAE,EAAE,MAAM,OAAS;AAAA,EACpE,UAAU;AAAA,IACT,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,SAAS;AAAA,IACT,YAAY;AAAA,EACb;AAAA,EACA,uBAAuB;AAAA,IACtB,GAAG,MAAM,WAAW;AAAA,IACpB,YAAY;AAAA,IACZ,SAAS,MAAM,QAAS,MAAM,GAAG,MAAM,CAAE;AAAA,IACzC,oBAAoB;AAAA,MACnB,iBAAiB,MAAM,QAAQ,OAAO;AAAA,IACvC;AAAA,IACA,2BAA2B;AAAA,MAC1B,iBAAiB,MAAM,QAAQ,OAAO;AAAA,IACvC;AAAA,IACA,QAAQ;AAAA,IACR,cAAc;AAAA,IACd,UAAU;AAAA,IACV,KAAK;AAAA,IACL,MAAM;AAAA,EACP;AAAA,EACA,OAAO;AAAA,EACP,UAAU;AACX,EAAI;;;AG1NJ,IAAAC,UAAuB;AAEvB,IAAAC,6BAAmC;AACnC,IAAAC,cAAoB;AAEpB,IAAM,yBAAyB;AAC/B,IAAM,wBAAwB;AAO9B,IAAMC,0BAAqB,+CAAoB,UAAW;AAEnD,IAAM,2BAAiC;AAAA,EAC7C,CAAE,EAAE,UAAU,SAAS,KAAK,QAAQ,sBAAsB,GAAG,QAAS;AACrE,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,IAAK;AAAA,UACJ,WAAW;AAAA,UACX;AAAA,UACA,OAAO,GAAIA,sBAAqB,QAAQ,yBAAyB,qBAAsB;AAAA,UACvF,UAAU;AAAA,QACX;AAAA;AAAA,MAEE;AAAA,IACH;AAAA,EAEF;AACD;;;AC/BA,IAAAC,UAAuB;AACvB,IAAAC,iBAAuB;AACvB,IAAAC,6BAAmC;AACnC,IAAAC,gBAAkC;AAClC,IAAAC,cAA2D;AAC3D,IAAAC,eAAmB;AAEnB,IAAMC,0BAAqB,+CAAoB,UAAW;AAE1D,IAAMC,QAAO;AAQN,IAAM,gBAAgB,CAAE,EAAE,OAAO,UAAU,YAAY,MAAc;AAC3E,QAAM,eAAW,uBAAmC,IAAK;AAEzD,QAAM,cAAc,MAAM;AACzB,aAAU,EAAG;AAEb,aAAS,SAAS,MAAM;AAAA,EACzB;AAEA,QAAM,oBAAoB,CAAE,UAAkD;AAC7E,aAAU,MAAM,OAAO,KAAM;AAAA,EAC9B;AAEA,QAAM,UAAUD,sBACb;AAAA,IACA,IAAI;AAAA,IACJ,IAAI;AAAA,EACJ,IACA;AAAA,IACA,IAAI;AAAA,IACJ,IAAI;AAAA,EACJ;AAEH,SACC,sCAAC,mBAAM,GAAG,WACT;AAAA,IAAC;AAAA;AAAA,MAEA,WAAS;AAAA,MACT,WAAS;AAAA,MACT,MAAOC;AAAA,MACP;AAAA,MACA;AAAA,MACA,UAAW;AAAA,MACX;AAAA,MACA,YAAa;AAAA,QACZ,gBACC,sCAAC,8BAAe,UAAS,WACxB,sCAAC,4BAAW,UAAWA,OAAO,CAC/B;AAAA,QAED,cAAc,SACb,sCAAC,0BAAW,MAAOA,OAAO,SAAU,aAAc,kBAAa,iBAAI,SAAS,WAAY,KACvF,sCAAC,uBAAM,OAAM,UAAS,UAAWA,OAAO,CACzC;AAAA,MAEF;AAAA;AAAA,EACD,CACD;AAEF;;;AClEA,IAAAC,iBAA4C;AAUrC,IAAM,cAAc,CAAE,EAAE,OAAO,UAAU,YAAY,SAAS,QAAQ,MAA0B;AACtG,QAAM,CAAE,WAAW,YAAa,QAAI,yBAAU,KAAM;AACpD,QAAM,CAAE,OAAO,QAAS,QAAI,yBAA2B,IAAK;AAE5D,QAAM,MAAM,aAAc,SAAU;AAEpC,QAAM,UAAU,CAAE,aAAsB,aAAa;AAErD,QAAM,eAAe,MAAM;AAC1B,iBAAc,IAAK;AAAA,EACpB;AAEA,QAAM,gBAAgB,MAAM;AAC3B,QAAI,SAAS,KAAK;AAElB,aAAU,IAAK;AACf,cAAW,IAAK;AAChB,iBAAc,KAAM;AAAA,EACrB;AAEA,QAAM,SAAS,CAAE,aAAsB;AACtC,QAAK,CAAE,QAAS,QAAS,GAAI;AAC5B;AAAA,IACD;AAEA,QAAK,CAAE,OAAQ;AACd,UAAI;AACH,iBAAU,QAAS;AAAA,MACpB,UAAE;AACD,sBAAc;AAAA,MACf;AAAA,IACD;AAAA,EACD;AAEA,QAAM,WAAW,CAAE,UAAiD;AACnE,UAAM,EAAE,WAAW,SAAS,IAAI,MAAM;AAEtC,QAAK,YAAa;AACjB,YAAM,eAAe,QAAS,QAAS,IAAI,WAAY,QAAS,IAAI;AAEpE,eAAU,YAAa;AACvB,gBAAW,YAAa;AAAA,IACzB;AAAA,EACD;AAEA,QAAM,gBAAgB,CAAE,UAAgC;AACvD,UAAM,gBAAgB;AAEtB,QAAK,CAAE,QAAS,EAAE,SAAU,MAAM,GAAI,GAAI;AACzC,aAAO,cAAc;AAAA,IACtB;AAEA,QAAK,CAAE,OAAQ,EAAE,SAAU,MAAM,GAAI,GAAI;AACxC,YAAM,eAAe;AACrB,aAAO,OAAU,MAAM,OAAwB,SAAU;AAAA,IAC1D;AAAA,EACD;AAEA,QAAM,cAAc,CAAE,UAA+C;AACpE,QAAK,WAAY;AAChB,YAAM,gBAAgB;AAAA,IACvB;AAEA,cAAW,KAAM;AAAA,EAClB;AAEA,QAAM,YAAY;AAAA,IACjB,SAAS;AAAA,IACT,WAAW;AAAA,IACX,SAAS;AAAA,IACT,QAAQ;AAAA,EACT;AAEA,QAAM,aAAa;AAAA,IAClB;AAAA,IACA,MAAM;AAAA,IACN,iBAAiB;AAAA,IACjB,GAAK,aAAa;AAAA,MACjB,gCAAgC;AAAA,IACjC;AAAA,EACD;AAEA,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,OAAQ,EAAE,GAAG,WAAW,GAAG,WAAW;AAAA,EACjD;AACD;AAEA,IAAM,eAAe,CAAE,cAAwB;AAC9C,QAAM,UAAM,uBAA8B,IAAK;AAE/C,gCAAW,MAAM;AAChB,QAAK,WAAY;AAChB,gBAAW,IAAI,OAAQ;AAAA,IACxB;AAAA,EACD,GAAG,CAAE,SAAU,CAAE;AAEjB,SAAO;AACR;AAEA,IAAM,YAAY,CAAE,OAA4B;AAC/C,QAAM,YAAY,aAAa;AAE/B,MAAK,CAAE,aAAa,CAAE,IAAK;AAC1B;AAAA,EACD;AAEA,QAAM,QAAQ,SAAS,YAAY;AACnC,QAAM,mBAAoB,EAAG;AAE7B,YAAU,gBAAgB;AAC1B,YAAU,SAAU,KAAM;AAC3B;","names":["React","import_react","import_ui","React","import_react","import_ui","React","import_ui","import_react","listenTo","ThemeProviderBase","React","import_react","import_ui","React","import_ui","React","import_ui","import_react","React","import_ui","React","import_editor_v1_adapters","import_ui","React","import_react","import_editor_v1_adapters","import_ui","import_react","import_react","isVersion330Active","React","import_editor_v1_adapters","import_ui","isVersion330Active","React","import_react","import_editor_v1_adapters","import_icons","import_ui","import_i18n","isVersion330Active","SIZE","import_react"]}
|
package/dist/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/ellipsis-with-tooltip.tsx","../src/components/editable-field.tsx","../src/components/introduction-modal.tsx","../src/components/theme-provider.tsx","../src/hooks/use-color-scheme.ts","../src/components/menu-item.tsx","../src/components/info-alert.tsx","../src/components/infotip-card.tsx","../src/components/warning-infotip.tsx","../src/components/popover/header.tsx","../src/components/popover/menu-list.tsx","../src/hooks/use-scroll-to-selected.ts","../src/hooks/use-scroll-top.ts","../src/components/popover/scrollable-content.tsx","../src/components/popover/search.tsx","../src/hooks/use-editable.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEffect, useState } from 'react';\nimport { Box, Tooltip } from '@elementor/ui';\n\ntype EllipsisWithTooltipProps< T extends React.ElementType > = {\n\tmaxWidth?: React.CSSProperties[ 'maxWidth' ];\n\ttitle: string;\n\tas?: T;\n} & React.ComponentProps< T >;\n\nexport const EllipsisWithTooltip = < T extends React.ElementType >( {\n\tmaxWidth,\n\ttitle,\n\tas,\n\t...props\n}: EllipsisWithTooltipProps< T > ) => {\n\tconst [ setRef, isOverflowing ] = useIsOverflowing();\n\n\tif ( isOverflowing ) {\n\t\treturn (\n\t\t\t<Tooltip title={ title } placement=\"top\">\n\t\t\t\t<Content maxWidth={ maxWidth } ref={ setRef } as={ as } { ...props }>\n\t\t\t\t\t{ title }\n\t\t\t\t</Content>\n\t\t\t</Tooltip>\n\t\t);\n\t}\n\n\treturn (\n\t\t<Content maxWidth={ maxWidth } ref={ setRef } as={ as } { ...props }>\n\t\t\t{ title }\n\t\t</Content>\n\t);\n};\n\ntype ContentProps< T extends React.ElementType > = React.PropsWithChildren<\n\tOmit< EllipsisWithTooltipProps< T >, 'title' >\n>;\n\nconst Content = React.forwardRef(\n\t< T extends React.ElementType >(\n\t\t{ maxWidth, as: Component = Box, ...props }: ContentProps< T >,\n\t\t// forwardRef loses the typing when using generic components.\n\t\tref: unknown\n\t) => (\n\t\t<Component\n\t\t\tref={ ref }\n\t\t\tposition=\"relative\"\n\t\t\t{ ...props }\n\t\t\tstyle={ { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', maxWidth } }\n\t\t/>\n\t)\n);\n\nconst useIsOverflowing = () => {\n\tconst [ el, setEl ] = useState< HTMLElement | null >( null );\n\tconst [ isOverflowing, setIsOverflown ] = useState( false );\n\n\tuseEffect( () => {\n\t\tconst observer = new ResizeObserver( ( [ { target } ] ) => {\n\t\t\tsetIsOverflown( target.scrollWidth > target.clientWidth );\n\t\t} );\n\n\t\tif ( el ) {\n\t\t\tobserver.observe( el );\n\t\t}\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t};\n\t}, [ el ] );\n\n\treturn [ setEl, isOverflowing ] as const;\n};\n","import * as React from 'react';\nimport { forwardRef } from 'react';\nimport { Box, styled, Tooltip } from '@elementor/ui';\n\ntype EditableFieldProps< T extends React.ElementType > = {\n\tvalue: string;\n\terror?: string;\n\tas?: T;\n} & React.ComponentPropsWithRef< T >;\n\nexport const EditableField = forwardRef(\n\t< T extends React.ElementType >(\n\t\t{ value, error, as = 'span', sx, ...props }: EditableFieldProps< T >,\n\t\tref: unknown\n\t) => {\n\t\treturn (\n\t\t\t<Tooltip title={ error } open={ !! error } placement=\"top\">\n\t\t\t\t<StyledField ref={ ref } component={ as } { ...props }>\n\t\t\t\t\t{ value }\n\t\t\t\t</StyledField>\n\t\t\t</Tooltip>\n\t\t);\n\t}\n);\n\nconst StyledField = styled( Box )`\n\twidth: 100%;\n\t&:focus {\n\t\toutline: none;\n\t}\n`;\n","import * as React from 'react';\nimport { useState } from 'react';\nimport {\n\tButton,\n\tCheckbox,\n\tDialog,\n\tDialogActions,\n\tDialogHeader,\n\tDialogTitle,\n\tFade,\n\ttype FadeProps,\n\tFormControlLabel,\n\tTypography,\n} from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\ntype IntroductionModalProps = React.PropsWithChildren< {\n\topen: boolean;\n\thandleClose: ( shouldShowAgain: boolean ) => void;\n\ttitle?: string;\n} >;\n\nexport const IntroductionModal = ( { open, handleClose, title, children }: IntroductionModalProps ) => {\n\tconst [ shouldShowAgain, setShouldShowAgain ] = useState( true );\n\n\treturn (\n\t\t<Dialog open={ open } onClose={ handleClose } maxWidth={ 'sm' } TransitionComponent={ Transition }>\n\t\t\t{ title && (\n\t\t\t\t<DialogHeader logo={ false }>\n\t\t\t\t\t<DialogTitle>{ title }</DialogTitle>\n\t\t\t\t</DialogHeader>\n\t\t\t) }\n\t\t\t{ children }\n\t\t\t<DialogActions>\n\t\t\t\t<FormControlLabel\n\t\t\t\t\tsx={ { marginRight: 'auto' } }\n\t\t\t\t\tcontrol={\n\t\t\t\t\t\t<Checkbox\n\t\t\t\t\t\t\tchecked={ ! shouldShowAgain }\n\t\t\t\t\t\t\tonChange={ () => setShouldShowAgain( ! shouldShowAgain ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t}\n\t\t\t\t\tlabel={\n\t\t\t\t\t\t<Typography variant={ 'body2' }>{ __( \"Don't show this again\", 'elementor' ) }</Typography>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<Button\n\t\t\t\t\tsize={ 'medium' }\n\t\t\t\t\tvariant=\"contained\"\n\t\t\t\t\tsx={ { minWidth: '135px' } }\n\t\t\t\t\tonClick={ () => handleClose( shouldShowAgain ) }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Got it', 'elementor' ) }\n\t\t\t\t</Button>\n\t\t\t</DialogActions>\n\t\t</Dialog>\n\t);\n};\n\nconst Transition = React.forwardRef( ( props: FadeProps, ref: React.Ref< unknown > ) => (\n\t<Fade\n\t\tref={ ref }\n\t\t{ ...props }\n\t\ttimeout={ {\n\t\t\tenter: 1000,\n\t\t\texit: 200,\n\t\t} }\n\t/>\n) );\n","import * as React from 'react';\nimport { ThemeProvider as ThemeProviderBase, type ThemeProviderProps } from '@elementor/ui';\n\nimport { useColorScheme } from '../hooks/use-color-scheme';\n\nconst EDITOR_PALLETTE: ThemeProviderProps[ 'palette' ] = 'unstable';\n\nexport default function ThemeProvider( { children }: { children: React.ReactNode } ) {\n\tconst colorScheme = useColorScheme();\n\n\treturn (\n\t\t<ThemeProviderBase colorScheme={ colorScheme } palette={ EDITOR_PALLETTE }>\n\t\t\t{ children }\n\t\t</ThemeProviderBase>\n\t);\n}\n","import { useEffect, useState } from 'react';\nimport {\n\t__privateListenTo as listenTo,\n\tcommandEndEvent,\n\ttype CommandEvent,\n\tv1ReadyEvent,\n} from '@elementor/editor-v1-adapters';\n\nexport type ColorScheme = 'auto' | 'dark' | 'light';\n\nexport type ExtendedWindow = Window & {\n\telementor: {\n\t\tgetPreferences: ( key: 'ui_theme' ) => ColorScheme;\n\t};\n};\n\nexport function useColorScheme() {\n\tconst [ colorScheme, setColorScheme ] = useState< ColorScheme >( () => getV1ColorScheme() );\n\n\tuseEffect( () => {\n\t\treturn listenTo( v1ReadyEvent(), () => setColorScheme( getV1ColorScheme() ) );\n\t}, [] );\n\n\tuseEffect( () => {\n\t\treturn listenTo( commandEndEvent( 'document/elements/settings' ), ( e ) => {\n\t\t\tconst event = e as CommandEvent< {\n\t\t\t\tsettings: {\n\t\t\t\t\tui_theme?: ColorScheme;\n\t\t\t\t};\n\t\t\t} >;\n\n\t\t\t// The User-Preferences settings object has a key named `ui_theme` that controls the color scheme.\n\t\t\tconst isColorScheme = event.args?.settings && 'ui_theme' in event.args.settings;\n\n\t\t\tif ( isColorScheme ) {\n\t\t\t\tsetColorScheme( getV1ColorScheme() );\n\t\t\t}\n\t\t} );\n\t}, [] );\n\n\treturn colorScheme;\n}\n\nfunction getV1ColorScheme() {\n\treturn ( window as unknown as ExtendedWindow ).elementor?.getPreferences?.( 'ui_theme' ) || 'auto';\n}\n","import * as React from 'react';\nimport { forwardRef } from 'react';\nimport { Infotip, MenuItem, type MenuItemProps, MenuItemText } from '@elementor/ui';\n\nimport { InfoAlert } from './info-alert';\n\nexport const MenuListItem = ( { children, ...props }: MenuItemProps ) => {\n\treturn (\n\t\t<MenuItem\n\t\t\tdense\n\t\t\t{ ...props }\n\t\t\tsx={ {\n\t\t\t\t...( props.sx ?? {} ),\n\t\t\t} }\n\t\t>\n\t\t\t<MenuItemText\n\t\t\t\tprimary={ children }\n\t\t\t\tprimaryTypographyProps={ {\n\t\t\t\t\tvariant: 'caption',\n\t\t\t\t} }\n\t\t\t/>\n\t\t</MenuItem>\n\t);\n};\n\ntype MenuItemInfotipProps = React.PropsWithChildren< {\n\tshowInfoTip?: boolean;\n\tchildren: React.ReactNode;\n\tcontent: string;\n} >;\n\nexport const MenuItemInfotip = forwardRef(\n\t( { showInfoTip = false, children, content }: MenuItemInfotipProps, ref: unknown ) => {\n\t\tif ( ! showInfoTip ) {\n\t\t\treturn <>{ children }</>;\n\t\t}\n\n\t\treturn (\n\t\t\t<Infotip\n\t\t\t\tref={ ref }\n\t\t\t\tplacement={ 'right' }\n\t\t\t\tarrow={ false }\n\t\t\t\tcontent={ <InfoAlert sx={ { maxWidth: 325 } }>{ content }</InfoAlert> }\n\t\t\t>\n\t\t\t\t{ /* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */ }\n\t\t\t\t<div style={ { pointerEvents: 'initial', width: '100%' } } onClick={ ( e ) => e.stopPropagation() }>\n\t\t\t\t\t{ children }\n\t\t\t\t</div>\n\t\t\t</Infotip>\n\t\t);\n\t}\n);\n","import * as React from 'react';\nimport { InfoCircleFilledIcon } from '@elementor/icons';\nimport { Alert, type AlertProps } from '@elementor/ui';\n\nexport const InfoAlert = ( props: AlertProps ) => (\n\t<Alert\n\t\ticon={ <InfoCircleFilledIcon fontSize=\"small\" color=\"secondary\" /> }\n\t\tvariant={ 'standard' }\n\t\tcolor=\"secondary\"\n\t\televation={ 0 }\n\t\tsize=\"small\"\n\t\t{ ...props }\n\t/>\n);\n","import * as React from 'react';\nimport { type ReactNode } from 'react';\nimport { Box, Button, Card, CardActions, CardContent, SvgIcon, Typography } from '@elementor/ui';\n\ntype InfoTipCardProps = {\n\tcontent: ReactNode;\n\tsvgIcon: ReactNode;\n\tlearnMoreButton?: {\n\t\tlabel: string;\n\t\thref: string;\n\t};\n\tctaButton?: {\n\t\tlabel: string;\n\t\tonClick: () => void;\n\t};\n};\n\nexport const InfoTipCard = ( { content, svgIcon, learnMoreButton, ctaButton }: InfoTipCardProps ) => {\n\treturn (\n\t\t<Card elevation={ 0 } sx={ { width: 320 } }>\n\t\t\t<CardContent sx={ { pb: 0 } }>\n\t\t\t\t<Box display=\"flex\" alignItems=\"start\">\n\t\t\t\t\t<SvgIcon fontSize=\"tiny\" sx={ { mr: 0.5 } }>\n\t\t\t\t\t\t{ svgIcon }\n\t\t\t\t\t</SvgIcon>\n\t\t\t\t\t<Typography variant=\"body2\">{ content }</Typography>\n\t\t\t\t</Box>\n\t\t\t</CardContent>\n\n\t\t\t{ ( ctaButton || learnMoreButton ) && (\n\t\t\t\t<CardActions>\n\t\t\t\t\t{ learnMoreButton && (\n\t\t\t\t\t\t<Button size=\"small\" color=\"warning\" href={ learnMoreButton.href } target=\"_blank\">\n\t\t\t\t\t\t\t{ learnMoreButton.label }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ctaButton && (\n\t\t\t\t\t\t<Button size=\"small\" color=\"warning\" variant=\"contained\" onClick={ ctaButton.onClick }>\n\t\t\t\t\t\t\t{ ctaButton.label }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t</CardActions>\n\t\t\t) }\n\t\t</Card>\n\t);\n};\n","import { forwardRef, type PropsWithChildren } from 'react';\nimport * as React from 'react';\nimport { Alert, AlertTitle, Infotip, type InfotipProps } from '@elementor/ui';\n\ninterface WarningInfotipProps extends PropsWithChildren {\n\topen: boolean;\n\ttitle?: string;\n\ttext: string;\n\tplacement: InfotipProps[ 'placement' ];\n\twidth?: string | number;\n\toffset?: number[];\n}\n\nexport const WarningInfotip = forwardRef(\n\t( { children, open, title, text, placement, width, offset }: WarningInfotipProps, ref: unknown ) => {\n\t\treturn (\n\t\t\t<Infotip\n\t\t\t\tref={ ref }\n\t\t\t\topen={ open }\n\t\t\t\tplacement={ placement }\n\t\t\t\tPopperProps={ {\n\t\t\t\t\tsx: {\n\t\t\t\t\t\twidth: width ? width : 'initial',\n\t\t\t\t\t\t'.MuiTooltip-tooltip': { marginLeft: 0, marginRight: 0 },\n\t\t\t\t\t},\n\t\t\t\t\tmodifiers: offset ? [ { name: 'offset', options: { offset } } ] : [],\n\t\t\t\t} }\n\t\t\t\tarrow={ false }\n\t\t\t\tcontent={\n\t\t\t\t\t<Alert color=\"error\" severity=\"warning\" variant=\"standard\" size=\"small\">\n\t\t\t\t\t\t{ title ? <AlertTitle>{ title }</AlertTitle> : null }\n\t\t\t\t\t\t{ text }\n\t\t\t\t\t</Alert>\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</Infotip>\n\t\t);\n\t}\n);\n","import * as React from 'react';\nimport { isExperimentActive } from '@elementor/editor-v1-adapters';\nimport { CloseButton, Stack, Typography } from '@elementor/ui';\n\nconst SIZE = 'tiny';\n\ntype PopoverHeaderProps = {\n\ttitle: string;\n\tonClose: () => void;\n\ticon?: React.ReactNode;\n\tactions?: React.ReactNode[];\n};\n\nconst isVersion330Active = isExperimentActive( 'e_v_3_30' );\n\nexport const PopoverHeader = ( { title, onClose, icon, actions }: PopoverHeaderProps ) => {\n\tconst paddingAndSizing = isVersion330Active\n\t\t? {\n\t\t\t\tpl: 2,\n\t\t\t\tpr: 1,\n\t\t\t\tpy: 1.5,\n\t\t\t\tmaxHeight: 36,\n\t\t }\n\t\t: {\n\t\t\t\tpl: 1.5,\n\t\t\t\tpr: 0.5,\n\t\t\t\tpy: 1.5,\n\t\t };\n\n\treturn (\n\t\t<Stack direction=\"row\" alignItems=\"center\" { ...paddingAndSizing } sx={ { columnGap: 0.5 } }>\n\t\t\t{ icon }\n\t\t\t<Typography\n\t\t\t\tvariant=\"subtitle2\"\n\t\t\t\tsx={\n\t\t\t\t\tisVersion330Active\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\tfontSize: '12px',\n\t\t\t\t\t\t\t\tmt: 0.25,\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{ title }\n\t\t\t</Typography>\n\t\t\t<Stack direction=\"row\" sx={ { ml: 'auto' } }>\n\t\t\t\t{ actions }\n\t\t\t\t<CloseButton slotProps={ { icon: { fontSize: SIZE } } } sx={ { ml: 'auto' } } onClick={ onClose } />\n\t\t\t</Stack>\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { useMemo, useRef } from 'react';\nimport { isExperimentActive } from '@elementor/editor-v1-adapters';\nimport { Box, MenuList, MenuSubheader, styled } from '@elementor/ui';\nimport { useVirtualizer } from '@tanstack/react-virtual';\n\nimport { useScrollTop, useScrollToSelected } from '../../hooks';\n\nexport type VirtualizedItem< T, V extends string > = {\n\ttype: T;\n\tvalue: V;\n\tlabel?: string;\n\ticon?: React.ReactNode;\n\tsecondaryText?: string;\n\t[ key: string ]: unknown;\n};\n\nexport type PopoverMenuListProps< T, V extends string > = {\n\titems: VirtualizedItem< T, V >[];\n\tonSelect: ( value: V ) => void;\n\tonClose: () => void;\n\tselectedValue?: V;\n\titemStyle?: ( item: VirtualizedItem< T, V > ) => React.CSSProperties;\n\t'data-testid'?: string;\n\tonChange?: ( params: { getVirtualIndexes: () => number[] } ) => void;\n\tmenuListTemplate?: React.ComponentType< React.ComponentProps< typeof MenuList > >;\n\tmenuItemContentTemplate?: ( item: VirtualizedItem< T, V > ) => React.ReactNode;\n\tnoResultsComponent?: React.ReactNode;\n};\n\nconst isVersion330Active = isExperimentActive( 'e_v_3_30' );\n\nexport const ITEM_HEIGHT = 32;\nconst LIST_ITEMS_BUFFER = 6;\nconst MENU_LIST_PADDING_TOP = 8;\n\nconst menuSubHeaderAbsoluteStyling = ( start: number ) => ( {\n\tposition: 'absolute',\n\ttransform: `translateY(${ start + MENU_LIST_PADDING_TOP }px)`,\n} );\n\nconst getAdjacentStickyIndices = (\n\tstickyIndices: number[],\n\trange: { startIndex: number; endIndex: number }\n): number[] => {\n\tconst previousTwoStickyIndices = stickyIndices\n\t\t.filter( ( stickyIndex ) => stickyIndex < range.startIndex )\n\t\t.slice( -2 );\n\n\tconst nextTwoStickyIndices = stickyIndices.filter( ( stickyIndex ) => stickyIndex > range.endIndex ).slice( 0, 2 );\n\n\treturn [ ...previousTwoStickyIndices, ...nextTwoStickyIndices ];\n};\n\nexport const PopoverMenuList = < T, V extends string >( {\n\titems,\n\tonSelect,\n\tonClose,\n\tselectedValue,\n\titemStyle,\n\tonChange,\n\t'data-testid': dataTestId,\n\tmenuItemContentTemplate,\n\tnoResultsComponent,\n\tmenuListTemplate: CustomMenuList,\n}: PopoverMenuListProps< T, V > ) => {\n\tconst containerRef = useRef< HTMLDivElement >( null );\n\tconst scrollTop = useScrollTop( { containerRef } );\n\n\tconst MenuListComponent = CustomMenuList || StyledMenuList;\n\n\tconst stickyIndices = useMemo(\n\t\t() =>\n\t\t\titems.reduce( ( categoryIndices, item, index ) => {\n\t\t\t\tif ( item.type === 'category' ) {\n\t\t\t\t\tcategoryIndices.push( index );\n\t\t\t\t}\n\t\t\t\treturn categoryIndices;\n\t\t\t}, [] as number[] ),\n\t\t[ items ]\n\t);\n\n\tconst getActiveItemIndices = ( range: { startIndex: number; endIndex: number } ) => {\n\t\tconst visibleAndStickyIndexes: number[] = [];\n\n\t\tfor ( let i = range.startIndex; i <= range.endIndex; i++ ) {\n\t\t\tvisibleAndStickyIndexes.push( i );\n\t\t}\n\n\t\tconst stickyIndicesToShow = getAdjacentStickyIndices( stickyIndices, range );\n\n\t\tstickyIndicesToShow.forEach( ( stickyIndex ) => {\n\t\t\tif ( ! visibleAndStickyIndexes.includes( stickyIndex ) ) {\n\t\t\t\tvisibleAndStickyIndexes.push( stickyIndex );\n\t\t\t}\n\t\t} );\n\n\t\treturn visibleAndStickyIndexes.sort( ( a, b ) => a - b );\n\t};\n\n\tconst virtualizer = useVirtualizer( {\n\t\tcount: items.length,\n\t\tgetScrollElement: () => containerRef.current,\n\t\testimateSize: () => ITEM_HEIGHT,\n\t\toverscan: LIST_ITEMS_BUFFER,\n\t\trangeExtractor: getActiveItemIndices,\n\t\tonChange,\n\t} );\n\n\tuseScrollToSelected( { selectedValue, items, virtualizer } );\n\n\treturn (\n\t\t<Box ref={ containerRef }>\n\t\t\t{ items.length === 0 && noResultsComponent ? (\n\t\t\t\tnoResultsComponent\n\t\t\t) : (\n\t\t\t\t<MenuListComponent\n\t\t\t\t\trole=\"listbox\"\n\t\t\t\t\tstyle={ { height: `${ virtualizer.getTotalSize() }px` } }\n\t\t\t\t\tdata-testid={ dataTestId }\n\t\t\t\t>\n\t\t\t\t\t{ virtualizer.getVirtualItems().map( ( virtualRow ) => {\n\t\t\t\t\t\tconst item = items[ virtualRow.index ];\n\t\t\t\t\t\tconst isLast = virtualRow.index === items.length - 1;\n\t\t\t\t\t\tconst isFirst =\n\t\t\t\t\t\t\titems[ 0 ]?.type === 'category' ? virtualRow.index === 1 : virtualRow.index === 0;\n\t\t\t\t\t\tconst isSelected = selectedValue === item.value;\n\t\t\t\t\t\tconst tabIndexFallback = ! selectedValue ? 0 : -1;\n\n\t\t\t\t\t\tif ( ! item ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif ( item.type === 'category' ) {\n\t\t\t\t\t\t\tconst shouldStick = virtualRow.start + MENU_LIST_PADDING_TOP <= scrollTop;\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<MenuSubheader\n\t\t\t\t\t\t\t\t\tkey={ virtualRow.key }\n\t\t\t\t\t\t\t\t\tstyle={ shouldStick ? {} : menuSubHeaderAbsoluteStyling( virtualRow.start ) }\n\t\t\t\t\t\t\t\t\tsx={\n\t\t\t\t\t\t\t\t\t\tisVersion330Active ? { fontWeight: '400', color: 'text.tertiary' } : undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ item.label || item.value }\n\t\t\t\t\t\t\t\t</MenuSubheader>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t\tkey={ virtualRow.key }\n\t\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\t\taria-selected={ isSelected }\n\t\t\t\t\t\t\t\tonClick={ ( e ) => {\n\t\t\t\t\t\t\t\t\tif ( ( e.target as HTMLElement ).closest( 'button' ) ) {\n\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonSelect( item.value );\n\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\t\t\tif ( event.key === 'Enter' ) {\n\t\t\t\t\t\t\t\t\t\tonSelect( item.value );\n\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\tif ( event.key === 'ArrowDown' && isLast ) {\n\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\tif ( event.key === 'ArrowUp' && isFirst ) {\n\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttabIndex={ isSelected ? 0 : tabIndexFallback }\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\ttransform: `translateY(${ virtualRow.start + MENU_LIST_PADDING_TOP }px)`,\n\t\t\t\t\t\t\t\t\t...( itemStyle ? itemStyle( item ) : {} ),\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ menuItemContentTemplate ? menuItemContentTemplate( item ) : item.label || item.value }\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</MenuListComponent>\n\t\t\t) }\n\t\t</Box>\n\t);\n};\n\nexport const StyledMenuList = styled( MenuList )( ( { theme } ) => ( {\n\t'& > li': {\n\t\theight: ITEM_HEIGHT,\n\t\twidth: '100%',\n\t\tdisplay: 'flex',\n\t\talignItems: 'center',\n\t},\n\t'& > [role=\"option\"]': {\n\t\t...theme.typography.caption,\n\t\tlineHeight: 'inherit',\n\t\tpadding: theme.spacing( 0.75, 2, 0.75, 4 ),\n\t\t'&:hover, &:focus': {\n\t\t\tbackgroundColor: theme.palette.action.hover,\n\t\t},\n\t\t'&[aria-selected=\"true\"]': {\n\t\t\tbackgroundColor: theme.palette.action.selected,\n\t\t},\n\t\tcursor: 'pointer',\n\t\ttextOverflow: 'ellipsis',\n\t\tposition: 'absolute',\n\t\ttop: 0,\n\t\tleft: 0,\n\t},\n\twidth: '100%',\n\tposition: 'relative',\n} ) );\n","import { useEffect } from 'react';\nimport type { Virtualizer } from '@tanstack/react-virtual';\n\nimport type { VirtualizedItem } from '../components/popover/menu-list';\n\ntype UseScrollToSelectedProps< T, V extends string > = {\n\tselectedValue?: V;\n\titems: VirtualizedItem< T, V >[];\n\tvirtualizer: Virtualizer< HTMLDivElement, Element >;\n};\n\nexport const useScrollToSelected = < T, V extends string >( {\n\tselectedValue,\n\titems,\n\tvirtualizer,\n}: UseScrollToSelectedProps< T, V > ) => {\n\tuseEffect( () => {\n\t\tif ( ! selectedValue || items.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst selectedIndex = items.findIndex( ( item ) => item.value === selectedValue );\n\n\t\tif ( selectedIndex !== -1 ) {\n\t\t\tvirtualizer.scrollToIndex( selectedIndex, { align: 'center' } );\n\t\t}\n\t}, [ selectedValue, items, virtualizer ] );\n};\n","import { useEffect, useState } from 'react';\n\ntype UseScrollTopProps = {\n\tcontainerRef: React.RefObject< HTMLDivElement >;\n};\n\nexport const useScrollTop = ( { containerRef }: UseScrollTopProps ) => {\n\tconst [ scrollTop, setScrollTop ] = useState( 0 );\n\n\tuseEffect( () => {\n\t\tconst container = containerRef.current;\n\n\t\tif ( ! container ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handleScroll = () => {\n\t\t\tsetScrollTop( container.scrollTop );\n\t\t};\n\n\t\tcontainer.addEventListener( 'scroll', handleScroll );\n\t\treturn () => container.removeEventListener( 'scroll', handleScroll );\n\t}, [ containerRef ] );\n\n\treturn scrollTop;\n};\n","import * as React from 'react';\nimport { type PropsWithChildren } from 'react';\nimport { isExperimentActive } from '@elementor/editor-v1-adapters';\nimport { Box } from '@elementor/ui';\n\nconst SECTION_PADDING_INLINE = 32;\nconst DEFAULT_POPOVER_WIDTH = 220;\n\ntype PopoverScrollableContentProps = PropsWithChildren< {\n\theight?: number | 'auto';\n\twidth?: number;\n} >;\n\nconst isVersion330Active = isExperimentActive( 'e_v_3_30' );\n\nexport const PopoverScrollableContent = React.forwardRef< HTMLDivElement, PopoverScrollableContentProps >(\n\t( { children, height = 260, width = DEFAULT_POPOVER_WIDTH }, ref ) => {\n\t\treturn (\n\t\t\t<Box\n\t\t\t\tref={ ref }\n\t\t\t\tsx={ {\n\t\t\t\t\toverflowY: 'auto',\n\t\t\t\t\theight,\n\t\t\t\t\twidth: `${ isVersion330Active ? width - SECTION_PADDING_INLINE : DEFAULT_POPOVER_WIDTH }px`,\n\t\t\t\t\tmaxWidth: 496,\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</Box>\n\t\t);\n\t}\n);\n","import * as React from 'react';\nimport { useRef } from 'react';\nimport { isExperimentActive } from '@elementor/editor-v1-adapters';\nimport { SearchIcon, XIcon } from '@elementor/icons';\nimport { Box, IconButton, InputAdornment, TextField } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nconst isVersion330Active = isExperimentActive( 'e_v_3_30' );\n\nconst SIZE = 'tiny';\n\ntype Props = {\n\tvalue: string;\n\tonSearch: ( search: string ) => void;\n\tplaceholder: string;\n};\n\nexport const PopoverSearch = ( { value, onSearch, placeholder }: Props ) => {\n\tconst inputRef = useRef< HTMLInputElement | null >( null );\n\n\tconst handleClear = () => {\n\t\tonSearch( '' );\n\n\t\tinputRef.current?.focus();\n\t};\n\n\tconst handleInputChange = ( event: React.ChangeEvent< HTMLInputElement > ) => {\n\t\tonSearch( event.target.value );\n\t};\n\n\tconst padding = isVersion330Active\n\t\t? {\n\t\t\t\tpx: 2,\n\t\t\t\tpb: 1.5,\n\t\t }\n\t\t: {\n\t\t\t\tpx: 1.5,\n\t\t\t\tpb: 1,\n\t\t };\n\n\treturn (\n\t\t<Box { ...padding }>\n\t\t\t<TextField\n\t\t\t\t// eslint-disable-next-line jsx-a11y/no-autofocus\n\t\t\t\tautoFocus\n\t\t\t\tfullWidth\n\t\t\t\tsize={ SIZE }\n\t\t\t\tvalue={ value }\n\t\t\t\tinputRef={ inputRef }\n\t\t\t\tonChange={ handleInputChange }\n\t\t\t\tplaceholder={ placeholder }\n\t\t\t\tInputProps={ {\n\t\t\t\t\tstartAdornment: (\n\t\t\t\t\t\t<InputAdornment position=\"start\">\n\t\t\t\t\t\t\t<SearchIcon fontSize={ SIZE } />\n\t\t\t\t\t\t</InputAdornment>\n\t\t\t\t\t),\n\t\t\t\t\tendAdornment: value && (\n\t\t\t\t\t\t<IconButton size={ SIZE } onClick={ handleClear } aria-label={ __( 'Clear', 'elementor' ) }>\n\t\t\t\t\t\t\t<XIcon color=\"action\" fontSize={ SIZE } />\n\t\t\t\t\t\t</IconButton>\n\t\t\t\t\t),\n\t\t\t\t} }\n\t\t\t/>\n\t\t</Box>\n\t);\n};\n","import { useEffect, useRef, useState } from 'react';\n\ntype UseEditableParams = {\n\tvalue: string;\n\tonSubmit: ( value: string ) => unknown;\n\tvalidation?: ( value: string ) => string | null;\n\tonClick?: ( event: React.MouseEvent< HTMLDivElement > ) => void;\n\tonError?: ( error: string | null ) => void;\n};\n\nexport const useEditable = ( { value, onSubmit, validation, onClick, onError }: UseEditableParams ) => {\n\tconst [ isEditing, setIsEditing ] = useState( false );\n\tconst [ error, setError ] = useState< string | null >( null );\n\n\tconst ref = useSelection( isEditing );\n\n\tconst isDirty = ( newValue: string ) => newValue !== value;\n\n\tconst openEditMode = () => {\n\t\tsetIsEditing( true );\n\t};\n\n\tconst closeEditMode = () => {\n\t\tref.current?.blur();\n\n\t\tsetError( null );\n\t\tonError?.( null );\n\t\tsetIsEditing( false );\n\t};\n\n\tconst submit = ( newValue: string ) => {\n\t\tif ( ! isDirty( newValue ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( ! error ) {\n\t\t\ttry {\n\t\t\t\tonSubmit( newValue );\n\t\t\t} finally {\n\t\t\t\tcloseEditMode();\n\t\t\t}\n\t\t}\n\t};\n\n\tconst onChange = ( event: React.ChangeEvent< HTMLSpanElement > ) => {\n\t\tconst { innerText: newValue } = event.target;\n\n\t\tif ( validation ) {\n\t\t\tconst updatedError = isDirty( newValue ) ? validation( newValue ) : null;\n\n\t\t\tsetError( updatedError );\n\t\t\tonError?.( updatedError );\n\t\t}\n\t};\n\n\tconst handleKeyDown = ( event: React.KeyboardEvent ) => {\n\t\tevent.stopPropagation();\n\n\t\tif ( [ 'Escape' ].includes( event.key ) ) {\n\t\t\treturn closeEditMode();\n\t\t}\n\n\t\tif ( [ 'Enter' ].includes( event.key ) ) {\n\t\t\tevent.preventDefault();\n\t\t\treturn submit( ( event.target as HTMLElement ).innerText );\n\t\t}\n\t};\n\n\tconst handleClick = ( event: React.MouseEvent< HTMLDivElement > ) => {\n\t\tif ( isEditing ) {\n\t\t\tevent.stopPropagation();\n\t\t}\n\n\t\tonClick?.( event );\n\t};\n\n\tconst listeners = {\n\t\tonClick: handleClick,\n\t\tonKeyDown: handleKeyDown,\n\t\tonInput: onChange,\n\t\tonBlur: closeEditMode,\n\t} as const;\n\n\tconst attributes = {\n\t\tvalue,\n\t\trole: 'textbox',\n\t\tcontentEditable: isEditing,\n\t\t...( isEditing && {\n\t\t\tsuppressContentEditableWarning: true,\n\t\t} ),\n\t} as const;\n\n\treturn {\n\t\tref,\n\t\tisEditing,\n\t\topenEditMode,\n\t\tcloseEditMode,\n\t\tvalue,\n\t\terror,\n\t\tgetProps: () => ( { ...listeners, ...attributes } ),\n\t} as const;\n};\n\nconst useSelection = ( isEditing: boolean ) => {\n\tconst ref = useRef< HTMLElement | null >( null );\n\n\tuseEffect( () => {\n\t\tif ( isEditing ) {\n\t\t\tselectAll( ref.current );\n\t\t}\n\t}, [ isEditing ] );\n\n\treturn ref;\n};\n\nconst selectAll = ( el: HTMLElement | null ) => {\n\tconst selection = getSelection();\n\n\tif ( ! selection || ! el ) {\n\t\treturn;\n\t}\n\n\tconst range = document.createRange();\n\trange.selectNodeContents( el );\n\n\tselection.removeAllRanges();\n\tselection.addRange( range );\n};\n"],"mappings":"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","names":["React","forwardRef","Box","Tooltip","React","useState","React","useEffect","useState","React","forwardRef","React","forwardRef","React","Box","Button","Typography","forwardRef","React","Alert","Infotip","React","Typography","React","isExperimentActive","Box","styled","useEffect","useEffect","useState","isVersion330Active","isExperimentActive","Box","styled","React","isExperimentActive","Box","isVersion330Active","React","useRef","isExperimentActive","Box","__","isVersion330Active","SIZE","useEffect","useRef","useState"]}
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { type PropsWithChildren } from 'react';
|
|
3
|
-
import { isExperimentActive } from '@elementor/editor-v1-adapters';
|
|
4
|
-
import { Box } from '@elementor/ui';
|
|
5
|
-
|
|
6
|
-
const SECTION_PADDING_INLINE = 32;
|
|
7
|
-
const DEFAULT_POPOVER_WIDTH = 220;
|
|
8
|
-
|
|
9
|
-
type PopoverScrollableContentProps = PropsWithChildren< {
|
|
10
|
-
height?: number | 'auto';
|
|
11
|
-
width?: number;
|
|
12
|
-
} >;
|
|
13
|
-
|
|
14
|
-
const isVersion330Active = isExperimentActive( 'e_v_3_30' );
|
|
15
|
-
|
|
16
|
-
export const PopoverScrollableContent = React.forwardRef< HTMLDivElement, PopoverScrollableContentProps >(
|
|
17
|
-
( { children, height = 260, width = DEFAULT_POPOVER_WIDTH }, ref ) => {
|
|
18
|
-
return (
|
|
19
|
-
<Box
|
|
20
|
-
ref={ ref }
|
|
21
|
-
sx={ {
|
|
22
|
-
overflowY: 'auto',
|
|
23
|
-
height,
|
|
24
|
-
width: `${ isVersion330Active ? width - SECTION_PADDING_INLINE : DEFAULT_POPOVER_WIDTH }px`,
|
|
25
|
-
maxWidth: 496,
|
|
26
|
-
} }
|
|
27
|
-
>
|
|
28
|
-
{ children }
|
|
29
|
-
</Box>
|
|
30
|
-
);
|
|
31
|
-
}
|
|
32
|
-
);
|