@flozy/editor 3.7.0 → 3.7.2

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,211 @@
1
+ import React, { useCallback, useMemo, useRef, useState, useEffect, useImperativeHandle, forwardRef } from "react";
2
+ import { Editable, Slate, ReactEditor } from 'slate-react';
3
+ import { createEditor } from 'slate';
4
+ import { useDebounce } from "use-debounce";
5
+ import withCommon from "./hooks/withCommon";
6
+ import { getBlock, getMarked } from "./utils/chatEditor/SlateUtilityFunctions";
7
+ import MiniTextFormat from "./Toolbar/PopupTool/MiniTextFormat";
8
+ import { commands, mentionsEvent } from "./utils/events";
9
+ import { insertEmoji } from "./utils/emoji";
10
+ import { draftToSlate } from "./utils/draftToSlate";
11
+ import MentionsPopup from "./common/MentionsPopup";
12
+ import { serializeToText } from "./utils/serializeToText";
13
+ import useMentions from "./hooks/useMentions";
14
+ import Shorthands from "./common/Shorthands";
15
+ import usePopupStyle from "./Toolbar/PopupTool/PopupToolStyle";
16
+ import { EditorProvider } from "./hooks/useMouseMove";
17
+ import { jsx as _jsx } from "react/jsx-runtime";
18
+ import { jsxs as _jsxs } from "react/jsx-runtime";
19
+ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
20
+ const {
21
+ id,
22
+ theme,
23
+ content,
24
+ readOnly,
25
+ otherProps,
26
+ needLayout = false,
27
+ toolBar = true,
28
+ onSave,
29
+ onsubmit
30
+ } = props;
31
+ const classes = usePopupStyle(theme);
32
+ const convertedContent = draftToSlate({
33
+ data: content
34
+ });
35
+ const [isInteracted, setIsInteracted] = useState(false);
36
+ const [value, setValue] = useState(convertedContent);
37
+ const [loadedValue] = useState(value);
38
+ const [deboundedValue] = useDebounce(value, 500);
39
+ const editor = useMemo(() => {
40
+ return withCommon(createEditor(), {
41
+ needLayout
42
+ });
43
+ }, []);
44
+ const isReadOnly = readOnly === "readonly";
45
+ useImperativeHandle(ref, () => ({
46
+ emojiClick: emoji => {
47
+ if (editor) {
48
+ insertEmoji(editor, emoji?.native, editor.selection);
49
+ ReactEditor.focus(editor);
50
+ }
51
+ },
52
+ // Focus enable
53
+ enableFocus: () => {
54
+ if (editor) {
55
+ ReactEditor.focus(editor);
56
+ }
57
+ }
58
+ }));
59
+ useEffect(() => {
60
+ setValue(draftToSlate({
61
+ data: content
62
+ }));
63
+ }, [id, content]);
64
+ useEffect(() => {
65
+ if (JSON.stringify(loadedValue) !== JSON.stringify(deboundedValue) && isInteracted && onSave) {
66
+ const {
67
+ value: strVal,
68
+ ...restVal
69
+ } = getOnSaveData(deboundedValue);
70
+ onSave(strVal, restVal);
71
+ }
72
+ }, [deboundedValue]);
73
+ const getOnSaveData = val => {
74
+ const text = serializeToText(val);
75
+ const title = val?.find(f => f.type === "title");
76
+ return {
77
+ value: JSON.stringify(val),
78
+ text: text,
79
+ title: serializeToText(title?.children) || "Untitled"
80
+ };
81
+ };
82
+ const {
83
+ CHARACTERS = [],
84
+ hideTools
85
+ // needLayout = true,
86
+ } = otherProps || {};
87
+ const mentionsRef = useRef();
88
+ const customProps = {
89
+ ...(otherProps || {}),
90
+ readOnly: isReadOnly,
91
+ editorPlaceholder: "Write Something",
92
+ page_id: 1
93
+ };
94
+ const [mentions, setMentions] = useMentions({
95
+ editor,
96
+ selection: editor?.selection
97
+ });
98
+ const {
99
+ search,
100
+ target,
101
+ index
102
+ } = mentions;
103
+ let {
104
+ type
105
+ } = mentions;
106
+ if (type && type === "elements" && hideTools.indexOf("slash") > -1) {
107
+ type = null;
108
+ }
109
+ const chars = type ? Shorthands[type]({
110
+ ...mentions,
111
+ CHARACTERS,
112
+ hideTools: hideTools
113
+ }) : [];
114
+ const Leaf = ({
115
+ attributes,
116
+ children,
117
+ leaf
118
+ }) => {
119
+ children = getMarked(leaf, children);
120
+ return /*#__PURE__*/_jsx("span", {
121
+ ...attributes,
122
+ children: children
123
+ });
124
+ };
125
+ const handleEditorChange = newValue => {
126
+ setValue(newValue);
127
+ if (!isInteracted) {
128
+ setIsInteracted(true);
129
+ }
130
+ };
131
+ const Element = props => {
132
+ return getBlock(props);
133
+ };
134
+ const renderElement = useCallback(props => {
135
+ return /*#__PURE__*/_jsx(Element, {
136
+ ...props,
137
+ customProps: customProps
138
+ });
139
+ }, []);
140
+ const renderLeaf = useCallback(props => {
141
+ return /*#__PURE__*/_jsx(Leaf, {
142
+ ...props,
143
+ customProps: customProps
144
+ });
145
+ }, []);
146
+ const onKeyDown = useCallback(event => {
147
+ const isMetaKey = event.metaKey && event.keyCode >= 65 && event.keyCode <= 90;
148
+ const isCtrlKey = event.ctrlKey || isMetaKey;
149
+ if (target && chars.length > 0 && !isCtrlKey) {
150
+ mentionsEvent({
151
+ event,
152
+ mentions,
153
+ setMentions,
154
+ chars,
155
+ target,
156
+ editor,
157
+ type,
158
+ mentionsRef
159
+ });
160
+ } else if (isCtrlKey) {
161
+ commands({
162
+ event,
163
+ editor
164
+ });
165
+ } else if (event.key === "Enter" && !event.shiftKey) {
166
+ const {
167
+ value: strVal,
168
+ ...restVal
169
+ } = getOnSaveData(value);
170
+ onsubmit(false, {
171
+ strVal,
172
+ restVal
173
+ });
174
+ }
175
+ }, [chars, editor, target, mentions, setMentions, search, type, mentionsRef]);
176
+ const handleClose = () => {};
177
+ return /*#__PURE__*/_jsx(EditorProvider, {
178
+ theme: theme,
179
+ editor: editor,
180
+ children: /*#__PURE__*/_jsxs(Slate, {
181
+ editor: editor,
182
+ initialValue: value,
183
+ onChange: handleEditorChange,
184
+ children: [toolBar && /*#__PURE__*/_jsx(MiniTextFormat, {
185
+ classes: classes,
186
+ editor: editor,
187
+ closeMainPopup: handleClose
188
+ }), /*#__PURE__*/_jsx(Editable, {
189
+ className: "chatEditorRoot",
190
+ renderElement: renderElement,
191
+ renderLeaf: renderLeaf,
192
+ placeholder: "Start typing ...",
193
+ spellCheck: true,
194
+ autoFocus: true,
195
+ onKeyDown: onKeyDown
196
+ }), !readOnly ? /*#__PURE__*/_jsx(MentionsPopup, {
197
+ ref: mentionsRef,
198
+ mentions: mentions,
199
+ setMentions: setMentions,
200
+ editor: editor,
201
+ target: target,
202
+ index: index,
203
+ chars: chars,
204
+ type: type,
205
+ theme: theme
206
+ }) : null]
207
+ }, id)
208
+ });
209
+ });
210
+ ChatEditor.displayName = "ChatEditor";
211
+ export default ChatEditor;
@@ -146,19 +146,21 @@ function AppHeader(props) {
146
146
  src: appLogo
147
147
  }) : appTitle
148
148
  }), /*#__PURE__*/_jsx(Divider, {}), /*#__PURE__*/_jsx(List, {
149
- children: menus.map((item, i) => /*#__PURE__*/_jsx(ListItem, {
150
- disablePadding: true,
151
- children: /*#__PURE__*/_jsx(ListItemButton, {
152
- component: "a",
153
- href: item.url,
154
- sx: {
155
- textAlign: "center"
156
- },
157
- children: /*#__PURE__*/_jsx(ListItemText, {
158
- primary: item.text
149
+ children: menus.map((item, i) => {
150
+ const buttonProps = handleLinkType(item.url, item.linkType, true, item.target === "_blank");
151
+ return /*#__PURE__*/_jsx(ListItem, {
152
+ disablePadding: true,
153
+ children: /*#__PURE__*/_jsx(ListItemButton, {
154
+ ...buttonProps,
155
+ sx: {
156
+ textAlign: "center"
157
+ },
158
+ children: /*#__PURE__*/_jsx(ListItemText, {
159
+ primary: item.text
160
+ })
159
161
  })
160
- })
161
- }, `${item.text}_${i}`))
162
+ }, `${item.text}_${i}`);
163
+ })
162
164
  })]
163
165
  });
164
166
  const container = window !== undefined ? () => window().document.body : undefined;
@@ -2,7 +2,8 @@ import React, { useState } from "react";
2
2
  import { Transforms } from "slate";
3
3
  import { ReactEditor, useSlateStatic } from "slate-react";
4
4
  import { IconButton, Tooltip, Box } from "@mui/material";
5
- import * as fIcons from "@mui/icons-material";
5
+ // import * as fIcons from "@mui/icons-material";
6
+ import MUIIcon from "../../common/StyleBuilder/fieldTypes/loadIcon";
6
7
  import SettingsIcon from "@mui/icons-material/Settings";
7
8
  import OpenInNewIcon from "@mui/icons-material/OpenInNew";
8
9
  import LinkIcon from "@mui/icons-material/Link";
@@ -63,7 +64,7 @@ const EditorButton = props => {
63
64
  };
64
65
  const isTrigger = linkType === "actionTrigger";
65
66
  const refURl = isTrigger ? buttonLink?.url : url;
66
- const BtnIcon = buttonIcon ? fIcons[buttonIcon] : null;
67
+ const BtnIcon = buttonIcon ? buttonIcon : null;
67
68
  windowVar.lastButtonProps = element;
68
69
  const handleTrigger = async () => {
69
70
  if (metadata?.buttonLink?.handler) {
@@ -80,6 +81,7 @@ const EditorButton = props => {
80
81
  }
81
82
  };
82
83
  const buttonProps = handleLinkType(refURl, linkType, readOnly, openInNewTab, handleTrigger);
84
+ console.log(openInNewTab);
83
85
  const onMenuClick = val => () => {
84
86
  switch (val) {
85
87
  case "edit":
@@ -131,6 +133,7 @@ const EditorButton = props => {
131
133
  color: "rgba(0, 0, 0, 0.54)"
132
134
  },
133
135
  ...btnProps,
136
+ target: openInNewTab ? "_blank" : "_self",
134
137
  children: /*#__PURE__*/_jsx(OpenInNewIcon, {})
135
138
  })
136
139
  })]
@@ -212,12 +215,14 @@ const EditorButton = props => {
212
215
  }
213
216
  },
214
217
  ...buttonProps,
215
- children: [BtnIcon && iconPosition === "start" && /*#__PURE__*/_jsx(BtnIcon, {
218
+ children: [BtnIcon && iconPosition === "start" && /*#__PURE__*/_jsx(MUIIcon, {
219
+ iconName: buttonIcon,
216
220
  style: {
217
221
  paddingLeft: "4px",
218
222
  paddingRight: "4px"
219
223
  }
220
- }), label || "My Button", BtnIcon && iconPosition === "end" && /*#__PURE__*/_jsx(BtnIcon, {
224
+ }), label || "My Button", BtnIcon && iconPosition === "end" && /*#__PURE__*/_jsx(MUIIcon, {
225
+ iconName: buttonIcon,
221
226
  style: {
222
227
  paddingLeft: "4px",
223
228
  paddingRight: "4px"
@@ -1,10 +1,10 @@
1
1
  import React, { useState } from "react";
2
2
  import { Transforms } from "slate";
3
3
  import { useSlateStatic, ReactEditor } from "slate-react";
4
- import * as fIcons from "@mui/icons-material";
5
4
  import { Box } from "@mui/material";
6
5
  import ChipTextPopup from "./ChipTextPopup";
7
6
  import { getTRBLBreakPoints, getBreakPointsValue } from "../../helper/theme";
7
+ import MUIIcon from "../../common/StyleBuilder/fieldTypes/loadIcon";
8
8
  import { jsx as _jsx } from "react/jsx-runtime";
9
9
  import { jsxs as _jsxs } from "react/jsx-runtime";
10
10
  const ChipText = props => {
@@ -26,7 +26,6 @@ const ChipText = props => {
26
26
  buttonIcon,
27
27
  textSize
28
28
  } = element;
29
- const BtnIcon = buttonIcon ? fIcons[buttonIcon] : fIcons["Check"];
30
29
  const [openSetttings, setOpenSettings] = useState(false);
31
30
  const editor = useSlateStatic();
32
31
  const path = ReactEditor.findPath(editor, element);
@@ -82,7 +81,8 @@ const ChipText = props => {
82
81
  background: bgColor || "#CCC",
83
82
  color: textColor
84
83
  },
85
- children: [/*#__PURE__*/_jsx(BtnIcon, {
84
+ children: [/*#__PURE__*/_jsx(MUIIcon, {
85
+ iconName: buttonIcon || "Check",
86
86
  style: {
87
87
  fontSize: textSize || "16px",
88
88
  lineHeight: textSize || "16px",
@@ -2,10 +2,10 @@ import React, { useState, forwardRef, useImperativeHandle } from "react";
2
2
  import { useSlateStatic, ReactEditor } from "slate-react";
3
3
  import { Paper, Popover } from "@mui/material";
4
4
  import data from "@emoji-mart/data";
5
- import Picker from "@emoji-mart/react";
6
5
  import { insertEmoji } from "../../utils/emoji";
7
6
  import ToolbarIcon from "../../common/ToolbarIcon";
8
7
  import Icon from "../../common/Icon";
8
+ import EmojiPicker from "./EmojiPicker";
9
9
  import { jsx as _jsx } from "react/jsx-runtime";
10
10
  import { Fragment as _Fragment } from "react/jsx-runtime";
11
11
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -61,7 +61,7 @@ const EmojiButton = /*#__PURE__*/forwardRef((props, ref) => {
61
61
  },
62
62
  onClose: handleClose,
63
63
  children: /*#__PURE__*/_jsx(Paper, {
64
- children: /*#__PURE__*/_jsx(Picker, {
64
+ children: /*#__PURE__*/_jsx(EmojiPicker, {
65
65
  data: data,
66
66
  onEmojiSelect: onEmojiSelect
67
67
  })
@@ -0,0 +1,16 @@
1
+ import data from "@emoji-mart/data";
2
+ import Picker from "@emoji-mart/react";
3
+ import { jsx as _jsx } from "react/jsx-runtime";
4
+ import { Fragment as _Fragment } from "react/jsx-runtime";
5
+ const EmojiPicker = props => {
6
+ const {
7
+ onEmojiSelect
8
+ } = props;
9
+ return /*#__PURE__*/_jsx(_Fragment, {
10
+ children: /*#__PURE__*/_jsx(Picker, {
11
+ data: data,
12
+ onEmojiSelect: onEmojiSelect
13
+ })
14
+ });
15
+ };
16
+ export default EmojiPicker;
@@ -277,7 +277,7 @@ const Grid = props => {
277
277
  } = getBreakPointsValue(borderRadius, size?.device) || {};
278
278
  return /*#__PURE__*/_jsxs(GridContainer, {
279
279
  container: true,
280
- className: `grid-container ${grid} has-hover element-root`,
280
+ className: `grid-container ${grid} has-hover element-root dpath`,
281
281
  ...attributes,
282
282
  ...sectionId,
283
283
  sx: {
@@ -105,7 +105,7 @@ const GridItem = props => {
105
105
  return /*#__PURE__*/_jsxs(Item, {
106
106
  item: true,
107
107
  component: "div",
108
- className: `grid-item element-root gi-top-wrpr`,
108
+ className: `grid-item element-root gi-top-wrpr dpath`,
109
109
  ...attributes,
110
110
  sx: {
111
111
  width: {
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
- import * as fIcons from "@mui/icons-material";
3
2
  import { Box } from "@mui/material";
3
+ import Check from "@mui/icons-material/Check";
4
4
  import { getBreakPointsValue } from "../../helper/theme";
5
5
  import { jsx as _jsx } from "react/jsx-runtime";
6
6
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -23,7 +23,6 @@ const InlineIcon = props => {
23
23
  right,
24
24
  bottom
25
25
  } = bannerSpacing || {};
26
- const BtnIcon = fIcons["Check"];
27
26
  return /*#__PURE__*/_jsxs(Box, {
28
27
  ...attributes,
29
28
  className: "editor-icon-text",
@@ -42,7 +41,7 @@ const InlineIcon = props => {
42
41
  background: bgColor || "#CCC",
43
42
  color: textColor
44
43
  },
45
- children: [/*#__PURE__*/_jsx(BtnIcon, {}), /*#__PURE__*/_jsx("div", {
44
+ children: [/*#__PURE__*/_jsx(Check, {}), /*#__PURE__*/_jsx("div", {
46
45
  contentEditable: true,
47
46
  children: children
48
47
  })]
@@ -11,7 +11,9 @@ const CheckList = ({
11
11
  attributes,
12
12
  children,
13
13
  element,
14
- isEmpty
14
+ isEmpty,
15
+ className,
16
+ style
15
17
  }) => {
16
18
  const editor = useSlateStatic();
17
19
  const readOnly = useReadOnly();
@@ -30,12 +32,14 @@ const CheckList = ({
30
32
  const nestedCheckList = element?.children?.length && element.children[0].type === "check-list-item";
31
33
  return /*#__PURE__*/_jsx(_Fragment, {
32
34
  children: /*#__PURE__*/_jsxs("div", {
35
+ className: className || "",
33
36
  ...attributes,
34
37
  style: {
35
38
  textAlign: element.alignment || "left",
36
39
  display: "flex",
37
40
  justifyContent: "center",
38
- alignItems: "center"
41
+ alignItems: "center",
42
+ ...(style || {})
39
43
  },
40
44
  children: [/*#__PURE__*/_jsxs("div", {
41
45
  contentEditable: false,
@@ -188,6 +188,7 @@ const editorStyles = ({
188
188
  }
189
189
  },
190
190
  "& .checkbox-edit": {
191
+ alignSelf: "flex-start",
191
192
  "& .MuiFormControlLabel-root": {
192
193
  marginRight: "0px"
193
194
  },
@@ -212,7 +213,7 @@ const editorStyles = ({
212
213
  "& svg": {
213
214
  width: "17px",
214
215
  height: "18px",
215
- marginTop: '-1px'
216
+ marginTop: "-1px"
216
217
  }
217
218
  }
218
219
  },
@@ -273,7 +274,7 @@ const editorStyles = ({
273
274
  },
274
275
  cardsTypo: {
275
276
  color: theme?.palette?.editor?.textColor,
276
- fontSize: '14px !important'
277
+ fontSize: "14px !important"
277
278
  }
278
279
  });
279
280
  export default editorStyles;
@@ -1,5 +1,5 @@
1
1
  import React, { useEffect, useState } from "react";
2
- import { Popper, Fade, Paper, ClickAwayListener } from "@mui/material";
2
+ import { Popper, Fade, Paper } from "@mui/material";
3
3
  import { Editor, Range } from "slate";
4
4
  import { useSlate, useFocused } from "slate-react";
5
5
  import useDrag from "../../hooks/useDrag";
@@ -9,6 +9,7 @@ import MiniTextFormat from "./MiniTextFormat";
9
9
  import { useEditorContext } from "../../hooks/useMouseMove";
10
10
  import usePopupStyles from "../PopupTool/PopupToolStyle";
11
11
  import { jsx as _jsx } from "react/jsx-runtime";
12
+ import { Fragment as _Fragment } from "react/jsx-runtime";
12
13
  const PopupTool = props => {
13
14
  const {
14
15
  theme,
@@ -31,6 +32,11 @@ const PopupTool = props => {
31
32
  const id = open ? "popup-edit-tool" : "";
32
33
  const table = new TableUtil(editor);
33
34
  const [size] = useWindowResize();
35
+ useEffect(() => {
36
+ if (!inFocus) {
37
+ setAnchorEl(null);
38
+ }
39
+ }, [inFocus]);
34
40
  useEffect(() => {
35
41
  if (event === "end" && anchorEl && !open) {
36
42
  // for table cell selection
@@ -78,14 +84,7 @@ const PopupTool = props => {
78
84
  setOpen(false);
79
85
  setPopupType("");
80
86
  };
81
- return open && !openAI ? /*#__PURE__*/_jsx(ClickAwayListener, {
82
- onClickAway: e => {
83
- // close the mini toolbar, if user clicks outside the editor (in Flozy app.)
84
- if (e.target !== document.body) {
85
- // e.target returns body, if the user clicks material ui select popup inside the tool bar, on that time, we don't need to close
86
- handleClose();
87
- }
88
- },
87
+ return open && !openAI ? /*#__PURE__*/_jsx(_Fragment, {
89
88
  children: size.device === "xs" ? /*#__PURE__*/_jsx("div", {
90
89
  className: "mobileMiniTextWrapper",
91
90
  children: /*#__PURE__*/_jsx(MiniTextFormat, {
@@ -1,8 +1,24 @@
1
1
  import { Autocomplete, Checkbox, FormControlLabel, MenuItem, Select, TextField, Typography, createFilterOptions } from "@mui/material";
2
2
  import { useEffect, useMemo, useState } from "react";
3
+ import { useSlate } from "slate-react";
3
4
  import { jsx as _jsx } from "react/jsx-runtime";
4
5
  import { Fragment as _Fragment } from "react/jsx-runtime";
5
6
  import { jsxs as _jsxs } from "react/jsx-runtime";
7
+ const sectionTypes = ["grid"];
8
+ const loopChildren = (children = [], sections) => {
9
+ if (!children?.length) {
10
+ return sections;
11
+ }
12
+ for (let child of children) {
13
+ if (sectionTypes.includes(child?.type)) {
14
+ if (child.id) {
15
+ sections.push(child.id);
16
+ }
17
+ }
18
+ sections = loopChildren(child.children, sections);
19
+ }
20
+ return sections;
21
+ };
6
22
  const OpenInNewTab = props => {
7
23
  const {
8
24
  nav,
@@ -42,21 +58,35 @@ export const SelectPage = props => {
42
58
  services
43
59
  } = props;
44
60
  const [pages, setPages] = useState([]);
61
+ const editor = useSlate();
45
62
  const getPages = async () => {
46
63
  const result = await services("getPages", {});
47
- const refactor = result?.data?.map(r => {
48
- const {
49
- title,
50
- url_name,
51
- ...rest
52
- } = r;
53
- return {
54
- label: url_name,
55
- value: url_name,
56
- ...rest
64
+ if (result?.data?.length) {
65
+ const refactor = result?.data?.map(r => {
66
+ const {
67
+ title,
68
+ url_name,
69
+ ...rest
70
+ } = r;
71
+ return {
72
+ label: url_name,
73
+ value: url_name,
74
+ ...rest
75
+ };
76
+ });
77
+ setPages(refactor);
78
+ } else {
79
+ const currentPage = {
80
+ label: "Current Page",
81
+ value: "_currentPage",
82
+ is_current_page: 1,
83
+ sections: loopChildren(editor.children, [])
57
84
  };
58
- });
59
- setPages(refactor);
85
+ setPages([currentPage]);
86
+ if (!value) {
87
+ onChange(currentPage.value);
88
+ }
89
+ }
60
90
  };
61
91
  useEffect(() => {
62
92
  getPages();
@@ -76,12 +106,14 @@ export const SelectPage = props => {
76
106
  }
77
107
  return [];
78
108
  }, [value, pages]);
109
+ const isCurrentPage = page?.value === "_currentPage";
79
110
  return /*#__PURE__*/_jsxs("div", {
80
111
  children: [/*#__PURE__*/_jsx(FreeSoloCreateOption, {
81
112
  label: page?.label,
82
- setValue: val => onChange(val?.value),
113
+ setValue: val => onChange(val?.value || ""),
83
114
  placeholder: "Select Page",
84
- options: pages
115
+ options: pages,
116
+ disabled: isCurrentPage
85
117
  }), /*#__PURE__*/_jsx(FreeSoloCreateOption, {
86
118
  label: section?.label,
87
119
  setValue: val => {
@@ -96,7 +128,7 @@ export const SelectPage = props => {
96
128
  label: p,
97
129
  value: p
98
130
  }))
99
- }), /*#__PURE__*/_jsx(OpenInNewTab, {
131
+ }), isCurrentPage ? null : /*#__PURE__*/_jsx(OpenInNewTab, {
100
132
  ...props
101
133
  })]
102
134
  });
@@ -149,7 +181,8 @@ export function FreeSoloCreateOption({
149
181
  label,
150
182
  setValue,
151
183
  options = [],
152
- placeholder = ""
184
+ placeholder = "",
185
+ disabled = false
153
186
  }) {
154
187
  return /*#__PURE__*/_jsx(Autocomplete, {
155
188
  freeSolo: true,
@@ -164,7 +197,7 @@ export function FreeSoloCreateOption({
164
197
  children: option.label
165
198
  }),
166
199
  onChange: (event, newValue) => {
167
- if (typeof newValue === 'string') {
200
+ if (typeof newValue === "string") {
168
201
  setValue({
169
202
  value: newValue
170
203
  });
@@ -189,7 +222,7 @@ export function FreeSoloCreateOption({
189
222
  } = params;
190
223
  // Suggest the creation of a new value
191
224
  const isExisting = options.some(option => inputValue === option.label);
192
- if (inputValue !== '' && !isExisting) {
225
+ if (inputValue !== "" && !isExisting) {
193
226
  filtered.push({
194
227
  inputValue,
195
228
  label: `Add "${inputValue}"`
@@ -202,7 +235,7 @@ export function FreeSoloCreateOption({
202
235
  handleHomeEndKeys: true,
203
236
  getOptionLabel: option => {
204
237
  // Value selected with enter, right from the input
205
- if (typeof option === 'string') {
238
+ if (typeof option === "string") {
206
239
  return option;
207
240
  }
208
241
  // Add "xxx" option created dynamically
@@ -214,6 +247,7 @@ export function FreeSoloCreateOption({
214
247
  },
215
248
  sx: {
216
249
  marginTop: "10px"
217
- }
250
+ },
251
+ disabled: disabled
218
252
  });
219
253
  }