@flozy/editor 5.0.5 → 5.0.6

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 (69) hide show
  1. package/dist/Editor/CommonEditor.js +6 -4
  2. package/dist/Editor/Editor.css +19 -1
  3. package/dist/Editor/Elements/Button/EditorButton.js +71 -53
  4. package/dist/Editor/Elements/Color Picker/ColorButtons.js +4 -2
  5. package/dist/Editor/Elements/DataView/DataView.js +101 -0
  6. package/dist/Editor/Elements/DataView/DataViewButton.js +23 -0
  7. package/dist/Editor/Elements/DataView/Layouts/ColumnView.js +59 -0
  8. package/dist/Editor/Elements/DataView/Layouts/DataTypes/CheckType.js +30 -0
  9. package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/Select.js +128 -0
  10. package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/SimpleSelect.js +25 -0
  11. package/dist/Editor/Elements/DataView/Layouts/DataTypes/DateType.js +26 -0
  12. package/dist/Editor/Elements/DataView/Layouts/DataTypes/MultiSelectType.js +38 -0
  13. package/dist/Editor/Elements/DataView/Layouts/DataTypes/NumberType.js +30 -0
  14. package/dist/Editor/Elements/DataView/Layouts/DataTypes/PersonType.js +30 -0
  15. package/dist/Editor/Elements/DataView/Layouts/DataTypes/SelectType.js +35 -0
  16. package/dist/Editor/Elements/DataView/Layouts/DataTypes/TextType.js +36 -0
  17. package/dist/Editor/Elements/DataView/Layouts/DataTypes/index.js +17 -0
  18. package/dist/Editor/Elements/DataView/Layouts/FilterSort/SortOptions/ChooseField.js +28 -0
  19. package/dist/Editor/Elements/DataView/Layouts/FilterSort/SortOptions/ChooseSort.js +37 -0
  20. package/dist/Editor/Elements/DataView/Layouts/FilterSort/SortOptions/index.js +74 -0
  21. package/dist/Editor/Elements/DataView/Layouts/FilterSort/index.js +59 -0
  22. package/dist/Editor/Elements/DataView/Layouts/FilterSort/styles.js +66 -0
  23. package/dist/Editor/Elements/DataView/Layouts/FilterView.js +174 -0
  24. package/dist/Editor/Elements/DataView/Layouts/Formula.js +29 -0
  25. package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js +113 -0
  26. package/dist/Editor/Elements/DataView/Layouts/Options/AddProperty.js +37 -0
  27. package/dist/Editor/Elements/DataView/Layouts/Options/AllProperties.js +111 -0
  28. package/dist/Editor/Elements/DataView/Layouts/Options/ChangeProperty.js +62 -0
  29. package/dist/Editor/Elements/DataView/Layouts/Options/ColumnsList.js +36 -0
  30. package/dist/Editor/Elements/DataView/Layouts/Options/Constants.js +101 -0
  31. package/dist/Editor/Elements/DataView/Layouts/Options/EditOption.js +158 -0
  32. package/dist/Editor/Elements/DataView/Layouts/Options/EditProperty.js +190 -0
  33. package/dist/Editor/Elements/DataView/Layouts/Options/FilterProperty.js +42 -0
  34. package/dist/Editor/Elements/DataView/Layouts/Options/PropertyList.js +30 -0
  35. package/dist/Editor/Elements/DataView/Layouts/Options/index.js +110 -0
  36. package/dist/Editor/Elements/DataView/Layouts/Options/styles.js +176 -0
  37. package/dist/Editor/Elements/DataView/Layouts/TableStyles.js +94 -0
  38. package/dist/Editor/Elements/DataView/Layouts/TableView.js +214 -0
  39. package/dist/Editor/Elements/DataView/Layouts/ViewData.js +83 -0
  40. package/dist/Editor/Elements/DataView/Layouts/index.js +25 -0
  41. package/dist/Editor/Elements/DataView/Providers/DataViewProvider.js +288 -0
  42. package/dist/Editor/Elements/DataView/Utils/globalSearch.js +15 -0
  43. package/dist/Editor/Elements/DataView/Utils/multiSortRows.js +72 -0
  44. package/dist/Editor/Elements/DataView/styles.js +133 -0
  45. package/dist/Editor/Elements/FreeGrid/styles.js +2 -1
  46. package/dist/Editor/Elements/Signature/Signature.css +1 -1
  47. package/dist/Editor/Elements/Table/AddRowCol.js +1 -1
  48. package/dist/Editor/Elements/Table/DragButton.js +71 -68
  49. package/dist/Editor/Elements/Table/Styles.js +2 -2
  50. package/dist/Editor/Elements/Table/Table.js +10 -7
  51. package/dist/Editor/Elements/Table/TableCell.js +21 -21
  52. package/dist/Editor/Elements/Table/tableHelper.js +4 -16
  53. package/dist/Editor/Toolbar/PopupTool/index.js +1 -1
  54. package/dist/Editor/Toolbar/Toolbar.js +6 -0
  55. package/dist/Editor/Toolbar/toolbarGroups.js +4 -0
  56. package/dist/Editor/assets/svg/OpenLinkIcon.js +3 -3
  57. package/dist/Editor/common/Icon.js +7 -1
  58. package/dist/Editor/common/MentionsPopup/index.js +1 -1
  59. package/dist/Editor/common/Shorthands/elements.js +13 -1
  60. package/dist/Editor/common/StyleBuilder/tableStyle.js +1 -1
  61. package/dist/Editor/common/iconslist.js +6 -3
  62. package/dist/Editor/hooks/useTable.js +4 -5
  63. package/dist/Editor/plugins/withHTML.js +18 -2
  64. package/dist/Editor/utils/SlateUtilityFunctions.js +16 -0
  65. package/dist/Editor/utils/dataView.js +43 -0
  66. package/dist/Editor/utils/embed.js +2 -1
  67. package/dist/Editor/utils/helper.js +19 -1
  68. package/dist/Editor/utils/insertNewLine.js +19 -1
  69. package/package.json +1 -1
@@ -13,6 +13,7 @@ import { insertDivider } from "../../utils/divider";
13
13
  import { insertFreeGrid } from "../../utils/freegrid";
14
14
  import { Transforms } from "slate";
15
15
  import { insertInfinityAI } from "../../utils/infinityAI";
16
+ import { insertDataView } from "../../utils/dataView";
16
17
  import SearchButton from "../../Elements/Search/SearchButton";
17
18
  import { jsx as _jsx } from "react/jsx-runtime";
18
19
  const ELEMENTS_LIST = [{
@@ -158,7 +159,7 @@ const ELEMENTS_LIST = [{
158
159
  renderComponent: rest => /*#__PURE__*/_jsx(SearchButton, {
159
160
  ...rest,
160
161
  element: {
161
- name: 'Brain'
162
+ name: "Brain"
162
163
  },
163
164
  icoBtnType: "cmd"
164
165
  })
@@ -262,6 +263,17 @@ const ELEMENTS_LIST = [{
262
263
  onInsert: editor => {
263
264
  insertInfinityAI(editor);
264
265
  }
266
+ }, {
267
+ name: "Dynamic Table",
268
+ group: "Dynamic Table",
269
+ desc: "",
270
+ type: "dataView",
271
+ icon: /*#__PURE__*/_jsx(Icon, {
272
+ icon: "dataView"
273
+ }),
274
+ onInsert: editor => {
275
+ insertDataView(editor);
276
+ }
265
277
  }];
266
278
  const elements = props => {
267
279
  const {
@@ -5,7 +5,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
5
5
  const allTools = toolbarGroups.flat();
6
6
  const fontWeight = allTools.find(f => f.format === "fontWeight");
7
7
  function getKey(prefix, key) {
8
- const settingKey = prefix === "col" ? capitalizeFirstLetter(key) : key;
8
+ const settingKey = prefix === "col" ? `entire${capitalizeFirstLetter(key)}` : key;
9
9
  return `${prefix}.${settingKey}`;
10
10
  }
11
11
  function getCommonSettings(prefix) {
@@ -1343,19 +1343,22 @@ export const GridAddSectionIcon = props => /*#__PURE__*/_jsxs("svg", {
1343
1343
  stroke: "#64748B",
1344
1344
  strokeWidth: "1.5",
1345
1345
  strokeLinecap: "round",
1346
- strokeLinejoin: "round"
1346
+ strokeLinejoin: "round",
1347
+ className: "fillStroke"
1347
1348
  }), /*#__PURE__*/_jsx("path", {
1348
1349
  d: "M10.1733 6.125V14.875",
1349
1350
  stroke: "#64748B",
1350
1351
  strokeWidth: "1.5",
1351
1352
  strokeLinecap: "round",
1352
- strokeLinejoin: "round"
1353
+ strokeLinejoin: "round",
1354
+ className: "fillStroke"
1353
1355
  }), /*#__PURE__*/_jsx("path", {
1354
1356
  d: "M5.79834 10.5H14.5483",
1355
1357
  stroke: "#64748B",
1356
1358
  strokeWidth: "1.5",
1357
1359
  strokeLinecap: "round",
1358
- strokeLinejoin: "round"
1360
+ strokeLinejoin: "round",
1361
+ className: "fillStroke"
1359
1362
  })]
1360
1363
  });
1361
1364
  export const FormIcon = () => {
@@ -123,21 +123,20 @@ export const TableProvider = ({
123
123
  try {
124
124
  const isTextSelected = editor?.selection && !Range.isCollapsed(editor.selection);
125
125
  const customCopy = tableSelection?.startCellPath?.length;
126
- if (customCopy) {
126
+ if (customCopy && !isTextSelected) {
127
127
  event.preventDefault(); // Prevent default copy behavior
128
128
 
129
129
  const {
130
130
  tablePath
131
131
  } = otherProps;
132
132
  const [node] = Editor.node(editor, tablePath);
133
- const selectedText = isTextSelected ? Editor.string(editor, editor.selection) : "";
134
- const copiedTableNode = createCopiedTableStructure(editor, tableSelection, node, tablePath, selectedText);
133
+ const copiedTableNode = createCopiedTableStructure(editor, tableSelection, node, tablePath);
135
134
  const tableNode = [copiedTableNode];
136
135
  const encodedTableNode = encodeToBase64(tableNode);
137
136
  event.clipboardData.setData("application/x-slate-fragment", encodedTableNode);
138
- const textData = selectedText || serializeToText(tableNode);
137
+ const textData = serializeToText(tableNode);
139
138
  event.clipboardData.setData("text/plain", textData);
140
- const tableDom = tableNodeToDom(copiedTableNode, selectedText);
139
+ const tableDom = tableNodeToDom(copiedTableNode);
141
140
  event.clipboardData.setData("text/html", tableDom?.outerHTML);
142
141
  }
143
142
  } catch (err) {
@@ -68,6 +68,12 @@ const handleInsert = (editor, defaultInsert, fragment = []) => {
68
68
  defaultInsert();
69
69
  }
70
70
  };
71
+ const getTableCellChild = (fragment = []) => {
72
+ const table = fragment.find(node => node.type === "table");
73
+ const row = table?.children?.find(node => node.type === "table-row");
74
+ const cell = row?.children?.find(node => node.type === "table-cell");
75
+ return cell?.children || [];
76
+ };
71
77
  const formatFragment = {
72
78
  "list-item": fragment => {
73
79
  let refactorFragment = [];
@@ -104,9 +110,19 @@ const withHtml = editor => {
104
110
  const slateHTML = data?.getData("application/x-slate-fragment");
105
111
  const html = data?.getData("text/html");
106
112
  const currentEl = getCurrentElement(editor);
107
- const eltype = currentEl?.type;
113
+ let eltype = currentEl?.type;
108
114
  if (slateHTML && !formatFragment[eltype]) {
115
+ const [tableCellNode] = Editor.nodes(editor, {
116
+ match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table-cell"
117
+ });
109
118
  const decoded = decodeAndParseBase64(slateHTML);
119
+ if (tableCellNode) {
120
+ const tableCellChild = getTableCellChild(decoded);
121
+ if (tableCellChild?.length) {
122
+ Transforms.insertFragment(editor, tableCellChild);
123
+ return;
124
+ }
125
+ }
110
126
  const [tableNode] = Editor.nodes(editor, {
111
127
  match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table"
112
128
  });
@@ -160,7 +176,7 @@ const withHtml = editor => {
160
176
  const formattedFragment = formatFragment[eltype] ? formatFragment[eltype](fragment) : fragment;
161
177
  let is_img_table = false;
162
178
  formattedFragment.map(f => {
163
- if (f.type === 'image' || f?.type?.includes('table')) {
179
+ if (f.type === "image" || f?.type?.includes("table")) {
164
180
  is_img_table = true;
165
181
  }
166
182
  });
@@ -43,6 +43,9 @@ import Code from "../Elements/EmbedScript/Code";
43
43
  import FreeGrid from "../Elements/FreeGrid/FreeGrid";
44
44
  import FreeGridItem from "../Elements/FreeGrid/FreeGridItem";
45
45
  import FreeGridBox from "../Elements/FreeGrid/FreeGridBox";
46
+ import DataView from "../Elements/DataView/DataView";
47
+ import ViewData from "../Elements/DataView/Layouts/ViewData";
48
+ import ColumnView from "../Elements/DataView/Layouts/ColumnView";
46
49
  import SearchAttachment from "../Elements/Search/SearchAttachment";
47
50
  // import { wrapThemeBreakpoints } from "../Elements/FreeGrid/breakpointConstants";
48
51
  import { jsx as _jsx } from "react/jsx-runtime";
@@ -564,6 +567,19 @@ export const getBlock = props => {
564
567
  contentEditable: false,
565
568
  children: children
566
569
  });
570
+ // Data View
571
+ case "dataView":
572
+ return /*#__PURE__*/_jsx(DataView, {
573
+ ...props
574
+ });
575
+ case "viewData":
576
+ return /*#__PURE__*/_jsx(ViewData, {
577
+ ...props
578
+ });
579
+ case "columnView":
580
+ return /*#__PURE__*/_jsx(ColumnView, {
581
+ ...props
582
+ });
567
583
  default:
568
584
  return /*#__PURE__*/_jsx(SimpleText, {
569
585
  ...props,
@@ -0,0 +1,43 @@
1
+ import { Transforms } from "slate";
2
+ const getDefaultDatView = () => ({
3
+ type: "paragraph",
4
+ children: [{
5
+ type: "dataView",
6
+ title: "",
7
+ layouts: [{
8
+ key: "view1",
9
+ type: "table",
10
+ label: "Table 1 View",
11
+ value: "table1",
12
+ filter: [],
13
+ sort: []
14
+ }],
15
+ properties: [{
16
+ key: "column1",
17
+ label: "Task",
18
+ type: "text",
19
+ visible: true,
20
+ default: true
21
+ }],
22
+ rows: [{
23
+ id: new Date().getTime(),
24
+ column1: ""
25
+ }],
26
+ children: [{
27
+ type: "viewData",
28
+ children: [{
29
+ text: ""
30
+ }]
31
+ }]
32
+ }]
33
+ });
34
+ export const insertDataView = editor => {
35
+ try {
36
+ Transforms.insertNodes(editor, {
37
+ ...getDefaultDatView()
38
+ });
39
+ Transforms.move(editor);
40
+ } catch (err) {
41
+ console.log(err);
42
+ }
43
+ };
@@ -1,5 +1,5 @@
1
1
  import { Transforms } from "slate";
2
- import insertNewLine from "./insertNewLine";
2
+ import insertNewLine, { insertNewLineAfterCurrentPath } from "./insertNewLine";
3
3
  export const insertDefaultEmbed = (editor, type, defaultURL = "", extProps = {}) => {
4
4
  try {
5
5
  const url = defaultURL ? defaultURL : type === "image" ? "" : "";
@@ -56,6 +56,7 @@ export const insertEmbed = (editor, embedData, format) => {
56
56
  at: editor.selection.anchor.path
57
57
  });
58
58
  insertNewLine(editor);
59
+ insertNewLineAfterCurrentPath(editor);
59
60
  } catch (err) {
60
61
  console.log(err);
61
62
  }
@@ -626,4 +626,22 @@ export const isPageSettings = (event, editor) => {
626
626
  export function capitalizeFirstLetter(str) {
627
627
  if (!str) return str;
628
628
  return str.charAt(0).toUpperCase() + str.slice(1);
629
- }
629
+ }
630
+ export const insertLineBreakAtEndOfPath = (editor, path) => {
631
+ try {
632
+ const [node, nodePath] = Editor.node(editor, path); // Get the node at the specified path
633
+ if (node) {
634
+ // Insert the line break
635
+ Transforms.insertNodes(editor, {
636
+ type: "paragraph",
637
+ children: [{
638
+ text: ""
639
+ }]
640
+ }, {
641
+ at: nodePath
642
+ });
643
+ }
644
+ } catch (err) {
645
+ console.log(err);
646
+ }
647
+ };
@@ -1,4 +1,4 @@
1
- import { Transforms } from "slate";
1
+ import { Editor, Element, Path, Transforms } from "slate";
2
2
  const insertNewLine = editor => {
3
3
  Transforms.insertNodes(editor, {
4
4
  type: "paragraph",
@@ -9,4 +9,22 @@ const insertNewLine = editor => {
9
9
  at: [editor.children.length]
10
10
  });
11
11
  };
12
+ export const insertNewLineAfterCurrentPath = editor => {
13
+ const currentPath = editor?.selection?.anchor?.path;
14
+ const [tableNode] = Editor.nodes(editor, {
15
+ match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table"
16
+ });
17
+ if (currentPath && tableNode) {
18
+ const currentParentPath = Path.parent(currentPath);
19
+ const nextPath = Path.next(currentParentPath);
20
+ Transforms.insertNodes(editor, {
21
+ type: "paragraph",
22
+ children: [{
23
+ text: ""
24
+ }]
25
+ }, {
26
+ at: nextPath
27
+ });
28
+ }
29
+ };
12
30
  export default insertNewLine;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flozy/editor",
3
- "version": "5.0.5",
3
+ "version": "5.0.6",
4
4
  "description": "An Editor for flozy app brain",
5
5
  "files": [
6
6
  "dist"