@flozy/editor 1.9.3 → 1.9.5

Sign up to get free protection for your applications and to get access to all the features.
@@ -4,6 +4,8 @@ import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
4
4
  import TextSnippetIcon from "@mui/icons-material/TextSnippet";
5
5
  import { formatDate } from "../../utils/helper";
6
6
  import Icon from "../../common/Icon";
7
+ import { getEmbedURL } from "../../helper";
8
+ import Video from "../Embed/Video";
7
9
  import { jsx as _jsx } from "react/jsx-runtime";
8
10
  import { jsxs as _jsxs } from "react/jsx-runtime";
9
11
  const Attachments = props => {
@@ -17,15 +19,18 @@ const Attachments = props => {
17
19
  type,
18
20
  date
19
21
  } = element;
22
+ const {
23
+ isEmbed
24
+ } = getEmbedURL(element, true);
20
25
  const getLastName = url?.split("/").pop();
21
26
  const fileName = `${decodeURIComponent(getLastName)}`;
22
- return /*#__PURE__*/_jsxs(Box, {
27
+ return !isEmbed ? /*#__PURE__*/_jsxs(Box, {
23
28
  component: "div",
24
29
  className: "attachment-wrpr-ev2",
25
30
  ...attributes,
26
31
  contentEditable: false,
27
32
  style: {
28
- display: "inline-flex"
33
+ display: "block"
29
34
  },
30
35
  children: [/*#__PURE__*/_jsxs(Card, {
31
36
  style: {
@@ -95,6 +100,8 @@ const Attachments = props => {
95
100
  contentEditable: false,
96
101
  children: children
97
102
  })]
103
+ }) : /*#__PURE__*/_jsx(Video, {
104
+ ...props
98
105
  });
99
106
  };
100
107
  export default Attachments;
@@ -43,7 +43,8 @@ const EditorButton = props => {
43
43
  iconPosition = "start",
44
44
  borderStyle,
45
45
  borderWidth,
46
- borderColor
46
+ borderColor,
47
+ alignment
47
48
  } = element;
48
49
  const {
49
50
  linkType,
@@ -145,7 +146,7 @@ const EditorButton = props => {
145
146
  className: "editor-btn-wrapper",
146
147
  ...attributes,
147
148
  style: {
148
- textAlign: textAlign || "left"
149
+ textAlign: alignment || textAlign || "left"
149
150
  },
150
151
  contentEditable: false,
151
152
  children: [/*#__PURE__*/_jsx("div", {
@@ -201,7 +202,7 @@ const EditorButton = props => {
201
202
  }), /*#__PURE__*/_jsx("div", {
202
203
  contentEditable: false,
203
204
  style: {
204
- display: "inline"
205
+ display: "none"
205
206
  },
206
207
  children: children
207
208
  }), edit && /*#__PURE__*/_jsx(ButtonPopup, {
@@ -155,6 +155,7 @@ const Video = ({
155
155
  className: "embed has-hover video",
156
156
  style: {
157
157
  display: "flex",
158
+ flexDirection: "column",
158
159
  width: `100%`,
159
160
  justifyContent: horizantal,
160
161
  alignContent: vertical
@@ -11,11 +11,12 @@ import "./styles.css";
11
11
  import { absoluteLink } from "../../utils/helper";
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
13
  import { jsxs as _jsxs } from "react/jsx-runtime";
14
- const Link = ({
15
- attributes,
16
- element,
17
- children
18
- }) => {
14
+ const Link = props => {
15
+ const {
16
+ attributes,
17
+ element,
18
+ children
19
+ } = props;
19
20
  const editor = useSlateStatic();
20
21
  const selected = useSelected();
21
22
  const focused = useFocused();
@@ -26,7 +27,8 @@ const Link = ({
26
27
  showInNewTab: true
27
28
  });
28
29
  const path = ReactEditor.findPath(editor, element);
29
- const absLink = absoluteLink(element.href);
30
+ const urlPath = element.url || element.href;
31
+ const absLink = absoluteLink(urlPath);
30
32
  const updateLink = () => {
31
33
  Transforms.setNodes(editor, {
32
34
  href: linkData?.url,
@@ -44,7 +46,7 @@ const Link = ({
44
46
  const onEditLink = () => {
45
47
  setLinkData({
46
48
  name: Node.string(element),
47
- url: element?.href || "",
49
+ url: urlPath || "",
48
50
  showInNewTab: element?.showInNewTab
49
51
  });
50
52
  setShowInput(true);
@@ -62,17 +62,39 @@ function padZero(str, len) {
62
62
  var zeros = new Array(len).join("0");
63
63
  return (zeros + str).slice(-len);
64
64
  }
65
- export function getEmbedURL(element) {
65
+ export function getEmbedURL(element, needType = false) {
66
66
  let refUrl = element.href ? element.href : element.url;
67
67
  refUrl = refUrl ? refUrl.includes("http") ? refUrl : `//${refUrl}` : "Link";
68
68
  let embedUrl = refUrl;
69
- if (embedUrl.includes("youtube")) embedUrl = getQueryStrings(embedUrl);
70
- if (embedUrl.includes("youtu.be")) embedUrl = getQueryStrings(embedUrl);
71
- if (embedUrl.includes("loom")) embedUrl = embedUrl.replace(/\/share\//, "/embed/");
72
- if (embedUrl.includes("vimeo")) embedUrl = embedUrl.replace(/\/vimeo.com\//, "/player.vimeo.com/video/");
73
- if (embedUrl.includes("dailymotion") && embedUrl.includes("video")) embedUrl = embedUrl.replace(/www.dailymotion.com\//, "www.dailymotion.com/embed/");
74
- if (embedUrl.includes("dai.ly")) embedUrl = embedUrl.replace(/dai.ly\//, "www.dailymotion.com/embed/video/");
75
- return embedUrl;
69
+ let isEmbed = false;
70
+ if (embedUrl.includes("youtube")) {
71
+ isEmbed = true;
72
+ embedUrl = getQueryStrings(embedUrl);
73
+ }
74
+ if (embedUrl.includes("youtu.be")) {
75
+ isEmbed = true;
76
+ embedUrl = getQueryStrings(embedUrl);
77
+ }
78
+ if (embedUrl.includes("loom")) {
79
+ isEmbed = true;
80
+ embedUrl = embedUrl.replace(/\/share\//, "/embed/");
81
+ }
82
+ if (embedUrl.includes("vimeo")) {
83
+ isEmbed = true;
84
+ embedUrl = embedUrl.replace(/\/vimeo.com\//, "/player.vimeo.com/video/");
85
+ }
86
+ if (embedUrl.includes("dailymotion") && embedUrl.includes("video")) {
87
+ isEmbed = true;
88
+ embedUrl = embedUrl.replace(/www.dailymotion.com\//, "www.dailymotion.com/embed/");
89
+ }
90
+ if (embedUrl.includes("dai.ly")) {
91
+ isEmbed = true;
92
+ embedUrl = embedUrl.replace(/dai.ly\//, "www.dailymotion.com/embed/video/");
93
+ }
94
+ return needType ? {
95
+ embedUrl,
96
+ isEmbed
97
+ } : embedUrl;
76
98
  }
77
99
  export const isEmptyTextNode = element => {
78
100
  try {
@@ -75,7 +75,9 @@ const splitInlineStyleRanges = (text, inlineStyleRanges, data) => {
75
75
  }, []);
76
76
  return splits;
77
77
  } else {
78
- return [text];
78
+ return [{
79
+ text
80
+ }];
79
81
  }
80
82
  };
81
83
  export const draftToSlate = props => {
@@ -86,6 +88,7 @@ export const draftToSlate = props => {
86
88
  const converted = data?.blocks?.reduce((a, b) => {
87
89
  if (b?.text !== undefined) {
88
90
  const blocks = splitInlineStyleRanges(b?.text, [...b?.inlineStyleRanges, ...b?.entityRanges], data).map(m => {
91
+ console.log(m);
89
92
  return {
90
93
  ...m
91
94
  };
@@ -97,6 +100,7 @@ export const draftToSlate = props => {
97
100
  }
98
101
  return a;
99
102
  }, []);
103
+ console.log(converted);
100
104
  return converted;
101
105
  } else if (data?.length) {
102
106
  return data;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flozy/editor",
3
- "version": "1.9.3",
3
+ "version": "1.9.5",
4
4
  "description": "An Editor for flozy app brain",
5
5
  "files": [
6
6
  "dist"