@webiny/lexical-editor-actions 5.36.1 → 5.36.2-beta.1
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/LexicalEditorActions.js
CHANGED
|
@@ -9,11 +9,14 @@ var _lexicalEditor = require("@webiny/lexical-editor");
|
|
|
9
9
|
var _react = _interopRequireDefault(require("react"));
|
|
10
10
|
var _LexicalColorPickerDropdown = require("./components/LexicalColorPickerDropdown");
|
|
11
11
|
var _TypographyDropDown = require("./components/TypographyDropDown");
|
|
12
|
+
var _TextAlignmentDropdown = require("./components/TextAlignmentDropdown");
|
|
12
13
|
var LexicalEditorActions = function LexicalEditorActions() {
|
|
13
14
|
return /*#__PURE__*/_react.default.createElement(_lexicalEditor.LexicalEditorConfig, null, /*#__PURE__*/_react.default.createElement(_lexicalEditor.FontColorAction.ColorPicker, {
|
|
14
15
|
element: /*#__PURE__*/_react.default.createElement(_LexicalColorPickerDropdown.LexicalColorPickerDropdown, null)
|
|
15
16
|
}), /*#__PURE__*/_react.default.createElement(_lexicalEditor.TypographyAction.TypographyDropDown, {
|
|
16
17
|
element: /*#__PURE__*/_react.default.createElement(_TypographyDropDown.TypographyDropDown, null)
|
|
18
|
+
}), /*#__PURE__*/_react.default.createElement(_lexicalEditor.TextAlignmentAction.TextAlignmentDropDown, {
|
|
19
|
+
element: /*#__PURE__*/_react.default.createElement(_TextAlignmentDropdown.TextAlignmentDropdown, null)
|
|
17
20
|
}));
|
|
18
21
|
};
|
|
19
22
|
exports.LexicalEditorActions = LexicalEditorActions;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["LexicalEditorActions"],"sources":["LexicalEditorActions.tsx"],"sourcesContent":["import { LexicalEditorConfig, TypographyAction } from \"@webiny/lexical-editor\";\nimport React from \"react\";\nimport { LexicalColorPickerDropdown } from \"~/components/LexicalColorPickerDropdown\";\nimport { FontColorAction } from \"@webiny/lexical-editor\";\nimport { TypographyDropDown } from \"~/components/TypographyDropDown\";\n\nexport const LexicalEditorActions = () => {\n return (\n <LexicalEditorConfig>\n <FontColorAction.ColorPicker element={<LexicalColorPickerDropdown />} />\n <TypographyAction.TypographyDropDown element={<TypographyDropDown />} />\n </LexicalEditorConfig>\n );\n};\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AAEA;AAEO,IAAMA,oBAAoB,GAAG,SAAvBA,oBAAoB,GAAS;EACtC,oBACI,6BAAC,kCAAmB,qBAChB,6BAAC,8BAAe,CAAC,WAAW;IAAC,OAAO,eAAE,6BAAC,sDAA0B;EAAI,EAAG,eACxE,6BAAC,+BAAgB,CAAC,kBAAkB;IAAC,OAAO,eAAE,6BAAC,sCAAkB;EAAI,EAAG,
|
|
1
|
+
{"version":3,"names":["LexicalEditorActions"],"sources":["LexicalEditorActions.tsx"],"sourcesContent":["import { LexicalEditorConfig, TypographyAction, TextAlignmentAction } from \"@webiny/lexical-editor\";\nimport React from \"react\";\nimport { LexicalColorPickerDropdown } from \"~/components/LexicalColorPickerDropdown\";\nimport { FontColorAction } from \"@webiny/lexical-editor\";\nimport { TypographyDropDown } from \"~/components/TypographyDropDown\";\nimport { TextAlignmentDropdown } from \"~/components/TextAlignmentDropdown\";\n\nexport const LexicalEditorActions = () => {\n return (\n <LexicalEditorConfig>\n <FontColorAction.ColorPicker element={<LexicalColorPickerDropdown />} />\n <TypographyAction.TypographyDropDown element={<TypographyDropDown />} />\n <TextAlignmentAction.TextAlignmentDropDown element={<TextAlignmentDropdown />} />\n </LexicalEditorConfig>\n );\n};\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AAEA;AACA;AAEO,IAAMA,oBAAoB,GAAG,SAAvBA,oBAAoB,GAAS;EACtC,oBACI,6BAAC,kCAAmB,qBAChB,6BAAC,8BAAe,CAAC,WAAW;IAAC,OAAO,eAAE,6BAAC,sDAA0B;EAAI,EAAG,eACxE,6BAAC,+BAAgB,CAAC,kBAAkB;IAAC,OAAO,eAAE,6BAAC,sCAAkB;EAAI,EAAG,eACxE,6BAAC,kCAAmB,CAAC,qBAAqB;IAAC,OAAO,eAAE,6BAAC,4CAAqB;EAAI,EAAG,CAC/D;AAE9B,CAAC;AAAC"}
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.TextAlignmentDropdown = void 0;
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
var _lexicalEditor = require("@webiny/lexical-editor");
|
|
10
|
+
var TextAlignmentDropdown = function TextAlignmentDropdown() {
|
|
11
|
+
var _textBlockSelection$s, _textBlockSelection$s2;
|
|
12
|
+
var _useRichTextEditor = (0, _lexicalEditor.useRichTextEditor)(),
|
|
13
|
+
textBlockSelection = _useRichTextEditor.textBlockSelection;
|
|
14
|
+
var _useTextAlignmentActi = (0, _lexicalEditor.useTextAlignmentAction)(),
|
|
15
|
+
applyTextAlignment = _useTextAlignmentActi.applyTextAlignment,
|
|
16
|
+
outdentText = _useTextAlignmentActi.outdentText,
|
|
17
|
+
indentText = _useTextAlignmentActi.indentText;
|
|
18
|
+
return /*#__PURE__*/_react.default.createElement(_lexicalEditor.DropDown, {
|
|
19
|
+
buttonLabel: "Align",
|
|
20
|
+
buttonIconClassName: "icon left-align",
|
|
21
|
+
buttonClassName: "toolbar-item spaced alignment",
|
|
22
|
+
buttonAriaLabel: "Formatting options for text alignment"
|
|
23
|
+
}, /*#__PURE__*/_react.default.createElement(_lexicalEditor.DropDownItem, {
|
|
24
|
+
onClick: function onClick() {
|
|
25
|
+
applyTextAlignment("left");
|
|
26
|
+
},
|
|
27
|
+
className: "item"
|
|
28
|
+
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
29
|
+
className: "icon left-align"
|
|
30
|
+
}), /*#__PURE__*/_react.default.createElement("span", {
|
|
31
|
+
className: "text"
|
|
32
|
+
}, "Left Align")), /*#__PURE__*/_react.default.createElement(_lexicalEditor.DropDownItem, {
|
|
33
|
+
onClick: function onClick() {
|
|
34
|
+
applyTextAlignment("center");
|
|
35
|
+
},
|
|
36
|
+
className: "item"
|
|
37
|
+
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
38
|
+
className: "icon center-align"
|
|
39
|
+
}), /*#__PURE__*/_react.default.createElement("span", {
|
|
40
|
+
className: "text"
|
|
41
|
+
}, "Center Align")), /*#__PURE__*/_react.default.createElement(_lexicalEditor.DropDownItem, {
|
|
42
|
+
onClick: function onClick() {
|
|
43
|
+
applyTextAlignment("right");
|
|
44
|
+
},
|
|
45
|
+
className: "item"
|
|
46
|
+
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
47
|
+
className: "icon right-align"
|
|
48
|
+
}), /*#__PURE__*/_react.default.createElement("span", {
|
|
49
|
+
className: "text"
|
|
50
|
+
}, "Right Align")), /*#__PURE__*/_react.default.createElement(_lexicalEditor.DropDownItem, {
|
|
51
|
+
onClick: function onClick() {
|
|
52
|
+
applyTextAlignment("justify");
|
|
53
|
+
},
|
|
54
|
+
className: "item"
|
|
55
|
+
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
56
|
+
className: "icon justify-align"
|
|
57
|
+
}), /*#__PURE__*/_react.default.createElement("span", {
|
|
58
|
+
className: "text"
|
|
59
|
+
}, "Justify Align")), /*#__PURE__*/_react.default.createElement(_lexicalEditor.Divider, null), /*#__PURE__*/_react.default.createElement(_lexicalEditor.DropDownItem, {
|
|
60
|
+
onClick: function onClick() {
|
|
61
|
+
outdentText();
|
|
62
|
+
},
|
|
63
|
+
className: "item"
|
|
64
|
+
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
65
|
+
className: "icon " + (textBlockSelection !== null && textBlockSelection !== void 0 && (_textBlockSelection$s = textBlockSelection.state) !== null && _textBlockSelection$s !== void 0 && _textBlockSelection$s.isRTL ? "indent" : "outdent")
|
|
66
|
+
}), /*#__PURE__*/_react.default.createElement("span", {
|
|
67
|
+
className: "text"
|
|
68
|
+
}, "Outdent")), /*#__PURE__*/_react.default.createElement(_lexicalEditor.DropDownItem, {
|
|
69
|
+
onClick: function onClick() {
|
|
70
|
+
indentText();
|
|
71
|
+
},
|
|
72
|
+
className: "item"
|
|
73
|
+
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
74
|
+
className: "icon " + (textBlockSelection !== null && textBlockSelection !== void 0 && (_textBlockSelection$s2 = textBlockSelection.state) !== null && _textBlockSelection$s2 !== void 0 && _textBlockSelection$s2.isRTL ? "outdent" : "indent")
|
|
75
|
+
}), /*#__PURE__*/_react.default.createElement("span", {
|
|
76
|
+
className: "text"
|
|
77
|
+
}, "Indent")));
|
|
78
|
+
};
|
|
79
|
+
exports.TextAlignmentDropdown = TextAlignmentDropdown;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["TextAlignmentDropdown","useRichTextEditor","textBlockSelection","useTextAlignmentAction","applyTextAlignment","outdentText","indentText","state","isRTL"],"sources":["TextAlignmentDropdown.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n Divider,\n DropDown,\n DropDownItem,\n useRichTextEditor,\n useTextAlignmentAction\n} from \"@webiny/lexical-editor\";\n\nexport const TextAlignmentDropdown = () => {\n const { textBlockSelection } = useRichTextEditor();\n const { applyTextAlignment, outdentText, indentText } = useTextAlignmentAction();\n\n return (\n <DropDown\n buttonLabel=\"Align\"\n buttonIconClassName=\"icon left-align\"\n buttonClassName=\"toolbar-item spaced alignment\"\n buttonAriaLabel=\"Formatting options for text alignment\"\n >\n <DropDownItem\n onClick={() => {\n applyTextAlignment(\"left\");\n }}\n className=\"item\"\n >\n <i className=\"icon left-align\" />\n <span className=\"text\">Left Align</span>\n </DropDownItem>\n <DropDownItem\n onClick={() => {\n applyTextAlignment(\"center\");\n }}\n className=\"item\"\n >\n <i className=\"icon center-align\" />\n <span className=\"text\">Center Align</span>\n </DropDownItem>\n <DropDownItem\n onClick={() => {\n applyTextAlignment(\"right\");\n }}\n className=\"item\"\n >\n <i className=\"icon right-align\" />\n <span className=\"text\">Right Align</span>\n </DropDownItem>\n <DropDownItem\n onClick={() => {\n applyTextAlignment(\"justify\");\n }}\n className=\"item\"\n >\n <i className=\"icon justify-align\" />\n <span className=\"text\">Justify Align</span>\n </DropDownItem>\n <Divider />\n <DropDownItem\n onClick={() => {\n outdentText();\n }}\n className=\"item\"\n >\n <i\n className={\"icon \" + (textBlockSelection?.state?.isRTL ? \"indent\" : \"outdent\")}\n />\n <span className=\"text\">Outdent</span>\n </DropDownItem>\n <DropDownItem\n onClick={() => {\n indentText();\n }}\n className=\"item\"\n >\n <i\n className={\"icon \" + (textBlockSelection?.state?.isRTL ? \"outdent\" : \"indent\")}\n />\n <span className=\"text\">Indent</span>\n </DropDownItem>\n </DropDown>\n );\n};\n"],"mappings":";;;;;;;AAAA;AACA;AAQO,IAAMA,qBAAqB,GAAG,SAAxBA,qBAAqB,GAAS;EAAA;EACvC,yBAA+B,IAAAC,gCAAiB,GAAE;IAA1CC,kBAAkB,sBAAlBA,kBAAkB;EAC1B,4BAAwD,IAAAC,qCAAsB,GAAE;IAAxEC,kBAAkB,yBAAlBA,kBAAkB;IAAEC,WAAW,yBAAXA,WAAW;IAAEC,UAAU,yBAAVA,UAAU;EAEnD,oBACI,6BAAC,uBAAQ;IACL,WAAW,EAAC,OAAO;IACnB,mBAAmB,EAAC,iBAAiB;IACrC,eAAe,EAAC,+BAA+B;IAC/C,eAAe,EAAC;EAAuC,gBAEvD,6BAAC,2BAAY;IACT,OAAO,EAAE,mBAAM;MACXF,kBAAkB,CAAC,MAAM,CAAC;IAC9B,CAAE;IACF,SAAS,EAAC;EAAM,gBAEhB;IAAG,SAAS,EAAC;EAAiB,EAAG,eACjC;IAAM,SAAS,EAAC;EAAM,GAAC,YAAU,CAAO,CAC7B,eACf,6BAAC,2BAAY;IACT,OAAO,EAAE,mBAAM;MACXA,kBAAkB,CAAC,QAAQ,CAAC;IAChC,CAAE;IACF,SAAS,EAAC;EAAM,gBAEhB;IAAG,SAAS,EAAC;EAAmB,EAAG,eACnC;IAAM,SAAS,EAAC;EAAM,GAAC,cAAY,CAAO,CAC/B,eACf,6BAAC,2BAAY;IACT,OAAO,EAAE,mBAAM;MACXA,kBAAkB,CAAC,OAAO,CAAC;IAC/B,CAAE;IACF,SAAS,EAAC;EAAM,gBAEhB;IAAG,SAAS,EAAC;EAAkB,EAAG,eAClC;IAAM,SAAS,EAAC;EAAM,GAAC,aAAW,CAAO,CAC9B,eACf,6BAAC,2BAAY;IACT,OAAO,EAAE,mBAAM;MACXA,kBAAkB,CAAC,SAAS,CAAC;IACjC,CAAE;IACF,SAAS,EAAC;EAAM,gBAEhB;IAAG,SAAS,EAAC;EAAoB,EAAG,eACpC;IAAM,SAAS,EAAC;EAAM,GAAC,eAAa,CAAO,CAChC,eACf,6BAAC,sBAAO,OAAG,eACX,6BAAC,2BAAY;IACT,OAAO,EAAE,mBAAM;MACXC,WAAW,EAAE;IACjB,CAAE;IACF,SAAS,EAAC;EAAM,gBAEhB;IACI,SAAS,EAAE,OAAO,IAAIH,kBAAkB,aAAlBA,kBAAkB,wCAAlBA,kBAAkB,CAAEK,KAAK,kDAAzB,sBAA2BC,KAAK,GAAG,QAAQ,GAAG,SAAS;EAAE,EACjF,eACF;IAAM,SAAS,EAAC;EAAM,GAAC,SAAO,CAAO,CAC1B,eACf,6BAAC,2BAAY;IACT,OAAO,EAAE,mBAAM;MACXF,UAAU,EAAE;IAChB,CAAE;IACF,SAAS,EAAC;EAAM,gBAEhB;IACI,SAAS,EAAE,OAAO,IAAIJ,kBAAkB,aAAlBA,kBAAkB,yCAAlBA,kBAAkB,CAAEK,KAAK,mDAAzB,uBAA2BC,KAAK,GAAG,SAAS,GAAG,QAAQ;EAAE,EACjF,eACF;IAAM,SAAS,EAAC;EAAM,GAAC,QAAM,CAAO,CACzB,CACR;AAEnB,CAAC;AAAC"}
|
package/package.json
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webiny/lexical-editor-actions",
|
|
3
|
-
"version": "5.36.1",
|
|
3
|
+
"version": "5.36.2-beta.1",
|
|
4
4
|
"dependencies": {
|
|
5
5
|
"@emotion/styled": "11.10.6",
|
|
6
|
-
"@webiny/app-page-builder": "5.36.1",
|
|
7
|
-
"@webiny/app-page-builder-elements": "5.36.1",
|
|
8
|
-
"@webiny/lexical-editor": "5.36.1",
|
|
9
|
-
"@webiny/theme": "5.36.1",
|
|
6
|
+
"@webiny/app-page-builder": "5.36.2-beta.1",
|
|
7
|
+
"@webiny/app-page-builder-elements": "5.36.2-beta.1",
|
|
8
|
+
"@webiny/lexical-editor": "5.36.2-beta.1",
|
|
9
|
+
"@webiny/theme": "5.36.2-beta.1",
|
|
10
10
|
"classnames": "2.3.2",
|
|
11
11
|
"emotion": "10.0.27",
|
|
12
12
|
"react": "17.0.2",
|
|
@@ -14,8 +14,8 @@
|
|
|
14
14
|
"react-dom": "17.0.2"
|
|
15
15
|
},
|
|
16
16
|
"devDependencies": {
|
|
17
|
-
"@webiny/cli": "5.36.1",
|
|
18
|
-
"@webiny/project-utils": "5.36.1"
|
|
17
|
+
"@webiny/cli": "5.36.2-beta.1",
|
|
18
|
+
"@webiny/project-utils": "5.36.2-beta.1"
|
|
19
19
|
},
|
|
20
20
|
"publishConfig": {
|
|
21
21
|
"access": "public",
|
|
@@ -25,5 +25,5 @@
|
|
|
25
25
|
"build": "yarn webiny run build",
|
|
26
26
|
"watch": "yarn webiny run watch"
|
|
27
27
|
},
|
|
28
|
-
"gitHead": "
|
|
28
|
+
"gitHead": "49a0945306457226d4e625af10923d832c9c1065"
|
|
29
29
|
}
|