@elementor/editor-ui 3.33.0-99 → 3.34.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/dist/index.d.mts +57 -10
  2. package/dist/index.d.ts +57 -10
  3. package/dist/index.js +223 -76
  4. package/dist/index.mjs +227 -73
  5. package/package.json +4 -4
  6. package/src/components/form.tsx +30 -0
  7. package/src/components/global-dialog/__tests__/global-dialog.test.tsx +272 -0
  8. package/src/components/global-dialog/__tests__/subscribers.test.ts +90 -0
  9. package/src/components/global-dialog/components/global-dialog.tsx +30 -0
  10. package/src/components/global-dialog/index.ts +2 -0
  11. package/src/components/global-dialog/subscribers.ts +36 -0
  12. package/src/components/menu-item.tsx +20 -6
  13. package/src/components/popover/__tests__/menu-list.test.tsx +106 -0
  14. package/src/components/popover/body.tsx +3 -1
  15. package/src/components/popover/index.ts +0 -1
  16. package/src/components/popover/menu-list.tsx +25 -15
  17. package/src/components/save-changes-dialog.tsx +106 -0
  18. package/src/components/{popover/search.tsx → search-field.tsx} +6 -4
  19. package/src/components/warning-infotip.tsx +11 -2
  20. package/src/hooks/__tests__/use-editable.test.tsx +255 -0
  21. package/src/hooks/use-editable.ts +15 -4
  22. package/src/index.ts +5 -0
  23. package/src/hooks/__tests__/use-editable.test.ts +0 -209
package/dist/index.d.mts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as React$1 from 'react';
2
- import { ReactNode, PropsWithChildren } from 'react';
3
- import { MenuItemProps, AlertProps, InfotipProps, MenuList } from '@elementor/ui';
2
+ import { ReactNode, PropsWithChildren, ReactElement } from 'react';
3
+ import { MenuItemProps, MenuItemTextProps, TypographyProps, AlertProps, InfotipProps, BoxProps, MenuList, DialogProps, DialogContentTextProps } from '@elementor/ui';
4
4
  import * as _emotion_styled from '@emotion/styled';
5
5
 
6
6
  type EllipsisWithTooltipProps<T extends React$1.ElementType> = {
@@ -23,7 +23,11 @@ declare function ThemeProvider({ children }: {
23
23
  children: React$1.ReactNode;
24
24
  }): React$1.JSX.Element;
25
25
 
26
- declare const MenuListItem: ({ children, ...props }: MenuItemProps) => React$1.JSX.Element;
26
+ type MenuListItemProps = MenuItemProps & {
27
+ menuItemTextProps?: MenuItemTextProps;
28
+ primaryTypographyProps?: TypographyProps;
29
+ };
30
+ declare const MenuListItem: ({ children, menuItemTextProps, primaryTypographyProps, ...props }: MenuListItemProps) => React$1.JSX.Element;
27
31
  declare const MenuItemInfotip: React$1.ForwardRefExoticComponent<{
28
32
  showInfoTip?: boolean;
29
33
  children: React$1.ReactNode;
@@ -55,14 +59,37 @@ interface WarningInfotipProps extends PropsWithChildren {
55
59
  placement: InfotipProps['placement'];
56
60
  width?: string | number;
57
61
  offset?: number[];
62
+ hasError?: boolean;
58
63
  }
59
64
  declare const WarningInfotip: React$1.ForwardRefExoticComponent<WarningInfotipProps & React$1.RefAttributes<unknown>>;
60
65
 
66
+ declare const GlobalDialog: () => React$1.JSX.Element | null;
67
+
68
+ type DialogContent = {
69
+ component: ReactElement;
70
+ };
71
+ declare const openDialog: ({ component }: DialogContent) => void;
72
+ declare const closeDialog: () => void;
73
+
74
+ type Props$1 = {
75
+ value: string;
76
+ onSearch: (search: string) => void;
77
+ placeholder: string;
78
+ id?: string;
79
+ } & BoxProps;
80
+ declare const SearchField: ({ value, onSearch, placeholder, id, sx }: Props$1) => React$1.JSX.Element;
81
+
82
+ type Props = PropsWithChildren<{
83
+ onSubmit?: () => void;
84
+ }>;
85
+ declare const Form: ({ children, onSubmit }: Props) => React$1.JSX.Element;
86
+
61
87
  type PopoverBodyProps = PropsWithChildren<{
62
88
  height?: number | 'auto';
63
89
  width?: number;
90
+ id?: string;
64
91
  }>;
65
- declare const PopoverBody: ({ children, height, width }: PopoverBodyProps) => React$1.JSX.Element;
92
+ declare const PopoverBody: ({ children, height, width, id }: PopoverBodyProps) => React$1.JSX.Element;
66
93
 
67
94
  type PopoverHeaderProps = {
68
95
  title: React$1.ReactNode;
@@ -75,6 +102,7 @@ declare const PopoverHeader: ({ title, onClose, icon, actions }: PopoverHeaderPr
75
102
  type VirtualizedItem<T, V extends string> = {
76
103
  type: T;
77
104
  value: V;
105
+ disabled?: boolean;
78
106
  label?: string;
79
107
  icon?: React$1.ReactNode;
80
108
  secondaryText?: string;
@@ -100,12 +128,31 @@ declare const StyledMenuList: _emotion_styled.StyledComponent<any, {}, {
100
128
  ref?: React$1.Ref<any> | undefined;
101
129
  }>;
102
130
 
103
- type Props = {
104
- value: string;
105
- onSearch: (search: string) => void;
106
- placeholder: string;
131
+ declare const SaveChangesDialog: {
132
+ ({ children, onClose }: Pick<DialogProps, "children" | "onClose">): React$1.JSX.Element;
133
+ Title: ({ children, onClose }: React$1.PropsWithChildren & {
134
+ onClose?: () => void;
135
+ }) => React$1.JSX.Element;
136
+ Content: ({ children }: React$1.PropsWithChildren) => React$1.JSX.Element;
137
+ ContentText: (props: DialogContentTextProps) => React$1.JSX.Element;
138
+ Actions: ({ actions }: ConfirmationDialogActionsProps) => React$1.JSX.Element;
139
+ };
140
+ type Action = {
141
+ label: string;
142
+ action: () => void | Promise<void>;
143
+ };
144
+ type ConfirmationDialogActionsProps = {
145
+ actions: {
146
+ cancel?: Action;
147
+ confirm: Action;
148
+ discard?: Action;
149
+ };
150
+ };
151
+ declare const useDialog: () => {
152
+ isOpen: boolean;
153
+ open: () => void;
154
+ close: () => void;
107
155
  };
108
- declare const PopoverSearch: ({ value, onSearch, placeholder }: Props) => React$1.JSX.Element;
109
156
 
110
157
  type UseEditableParams = {
111
158
  value: string;
@@ -133,4 +180,4 @@ declare const useEditable: ({ value, onSubmit, validation, onClick, onError }: U
133
180
  };
134
181
  };
135
182
 
136
- export { EditableField, EllipsisWithTooltip, ITEM_HEIGHT, InfoAlert, InfoTipCard, IntroductionModal, MenuItemInfotip, MenuListItem, PopoverBody, PopoverHeader, PopoverMenuList, type PopoverMenuListProps, PopoverSearch, StyledMenuList, ThemeProvider, type VirtualizedItem, WarningInfotip, useEditable };
183
+ export { EditableField, EllipsisWithTooltip, Form, GlobalDialog, ITEM_HEIGHT, InfoAlert, InfoTipCard, IntroductionModal, MenuItemInfotip, MenuListItem, PopoverBody, PopoverHeader, PopoverMenuList, type PopoverMenuListProps, SaveChangesDialog, SearchField, StyledMenuList, ThemeProvider, type VirtualizedItem, WarningInfotip, closeDialog, openDialog, useDialog, useEditable };
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as React$1 from 'react';
2
- import { ReactNode, PropsWithChildren } from 'react';
3
- import { MenuItemProps, AlertProps, InfotipProps, MenuList } from '@elementor/ui';
2
+ import { ReactNode, PropsWithChildren, ReactElement } from 'react';
3
+ import { MenuItemProps, MenuItemTextProps, TypographyProps, AlertProps, InfotipProps, BoxProps, MenuList, DialogProps, DialogContentTextProps } from '@elementor/ui';
4
4
  import * as _emotion_styled from '@emotion/styled';
5
5
 
6
6
  type EllipsisWithTooltipProps<T extends React$1.ElementType> = {
@@ -23,7 +23,11 @@ declare function ThemeProvider({ children }: {
23
23
  children: React$1.ReactNode;
24
24
  }): React$1.JSX.Element;
25
25
 
26
- declare const MenuListItem: ({ children, ...props }: MenuItemProps) => React$1.JSX.Element;
26
+ type MenuListItemProps = MenuItemProps & {
27
+ menuItemTextProps?: MenuItemTextProps;
28
+ primaryTypographyProps?: TypographyProps;
29
+ };
30
+ declare const MenuListItem: ({ children, menuItemTextProps, primaryTypographyProps, ...props }: MenuListItemProps) => React$1.JSX.Element;
27
31
  declare const MenuItemInfotip: React$1.ForwardRefExoticComponent<{
28
32
  showInfoTip?: boolean;
29
33
  children: React$1.ReactNode;
@@ -55,14 +59,37 @@ interface WarningInfotipProps extends PropsWithChildren {
55
59
  placement: InfotipProps['placement'];
56
60
  width?: string | number;
57
61
  offset?: number[];
62
+ hasError?: boolean;
58
63
  }
59
64
  declare const WarningInfotip: React$1.ForwardRefExoticComponent<WarningInfotipProps & React$1.RefAttributes<unknown>>;
60
65
 
66
+ declare const GlobalDialog: () => React$1.JSX.Element | null;
67
+
68
+ type DialogContent = {
69
+ component: ReactElement;
70
+ };
71
+ declare const openDialog: ({ component }: DialogContent) => void;
72
+ declare const closeDialog: () => void;
73
+
74
+ type Props$1 = {
75
+ value: string;
76
+ onSearch: (search: string) => void;
77
+ placeholder: string;
78
+ id?: string;
79
+ } & BoxProps;
80
+ declare const SearchField: ({ value, onSearch, placeholder, id, sx }: Props$1) => React$1.JSX.Element;
81
+
82
+ type Props = PropsWithChildren<{
83
+ onSubmit?: () => void;
84
+ }>;
85
+ declare const Form: ({ children, onSubmit }: Props) => React$1.JSX.Element;
86
+
61
87
  type PopoverBodyProps = PropsWithChildren<{
62
88
  height?: number | 'auto';
63
89
  width?: number;
90
+ id?: string;
64
91
  }>;
65
- declare const PopoverBody: ({ children, height, width }: PopoverBodyProps) => React$1.JSX.Element;
92
+ declare const PopoverBody: ({ children, height, width, id }: PopoverBodyProps) => React$1.JSX.Element;
66
93
 
67
94
  type PopoverHeaderProps = {
68
95
  title: React$1.ReactNode;
@@ -75,6 +102,7 @@ declare const PopoverHeader: ({ title, onClose, icon, actions }: PopoverHeaderPr
75
102
  type VirtualizedItem<T, V extends string> = {
76
103
  type: T;
77
104
  value: V;
105
+ disabled?: boolean;
78
106
  label?: string;
79
107
  icon?: React$1.ReactNode;
80
108
  secondaryText?: string;
@@ -100,12 +128,31 @@ declare const StyledMenuList: _emotion_styled.StyledComponent<any, {}, {
100
128
  ref?: React$1.Ref<any> | undefined;
101
129
  }>;
102
130
 
103
- type Props = {
104
- value: string;
105
- onSearch: (search: string) => void;
106
- placeholder: string;
131
+ declare const SaveChangesDialog: {
132
+ ({ children, onClose }: Pick<DialogProps, "children" | "onClose">): React$1.JSX.Element;
133
+ Title: ({ children, onClose }: React$1.PropsWithChildren & {
134
+ onClose?: () => void;
135
+ }) => React$1.JSX.Element;
136
+ Content: ({ children }: React$1.PropsWithChildren) => React$1.JSX.Element;
137
+ ContentText: (props: DialogContentTextProps) => React$1.JSX.Element;
138
+ Actions: ({ actions }: ConfirmationDialogActionsProps) => React$1.JSX.Element;
139
+ };
140
+ type Action = {
141
+ label: string;
142
+ action: () => void | Promise<void>;
143
+ };
144
+ type ConfirmationDialogActionsProps = {
145
+ actions: {
146
+ cancel?: Action;
147
+ confirm: Action;
148
+ discard?: Action;
149
+ };
150
+ };
151
+ declare const useDialog: () => {
152
+ isOpen: boolean;
153
+ open: () => void;
154
+ close: () => void;
107
155
  };
108
- declare const PopoverSearch: ({ value, onSearch, placeholder }: Props) => React$1.JSX.Element;
109
156
 
110
157
  type UseEditableParams = {
111
158
  value: string;
@@ -133,4 +180,4 @@ declare const useEditable: ({ value, onSubmit, validation, onClick, onError }: U
133
180
  };
134
181
  };
135
182
 
136
- export { EditableField, EllipsisWithTooltip, ITEM_HEIGHT, InfoAlert, InfoTipCard, IntroductionModal, MenuItemInfotip, MenuListItem, PopoverBody, PopoverHeader, PopoverMenuList, type PopoverMenuListProps, PopoverSearch, StyledMenuList, ThemeProvider, type VirtualizedItem, WarningInfotip, useEditable };
183
+ export { EditableField, EllipsisWithTooltip, Form, GlobalDialog, ITEM_HEIGHT, InfoAlert, InfoTipCard, IntroductionModal, MenuItemInfotip, MenuListItem, PopoverBody, PopoverHeader, PopoverMenuList, type PopoverMenuListProps, SaveChangesDialog, SearchField, StyledMenuList, ThemeProvider, type VirtualizedItem, WarningInfotip, closeDialog, openDialog, useDialog, useEditable };