@webiny/lexical-editor 5.39.2 → 5.39.3-beta.0

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.
@@ -52,6 +52,7 @@ function FontSizeDropDown(props) {
52
52
  }, option));
53
53
  }));
54
54
  }
55
+ var defaultSize = "15px";
55
56
  var FontSizeAction = function FontSizeAction() {
56
57
  var _useLexicalComposerCo = (0, _LexicalComposerContext.useLexicalComposerContext)(),
57
58
  _useLexicalComposerCo2 = (0, _slicedToArray2.default)(_useLexicalComposerCo, 1),
@@ -65,9 +66,13 @@ var FontSizeAction = function FontSizeAction() {
65
66
  var fontSize = (0, _useCurrentSelection.useDeriveValueFromSelection)(function (_ref) {
66
67
  var rangeSelection = _ref.rangeSelection;
67
68
  if (!rangeSelection) {
68
- return "15px";
69
+ return defaultSize;
70
+ }
71
+ try {
72
+ return (0, _selection.$getSelectionStyleValueForProperty)(rangeSelection, "font-size", "15px");
73
+ } catch (_unused) {
74
+ return defaultSize;
69
75
  }
70
- return (0, _selection.$getSelectionStyleValueForProperty)(rangeSelection, "font-size", "15px");
71
76
  });
72
77
  (0, _react.useEffect)(function () {
73
78
  return (0, _utils.mergeRegister)(editor.registerEditableListener(function (editable) {
@@ -1 +1 @@
1
- {"version":3,"names":["_react","_interopRequireWildcard","require","_LexicalComposerContext","_selection","_utils","_lexical","_DropDown","_useCurrentSelection","FONT_SIZE_OPTIONS","dropDownActiveClass","active","FontSizeDropDown","props","editor","value","_props$disabled","disabled","handleClick","useCallback","option","update","selection","$getSelection","$isRangeSelection","$patchStyleText","_defineProperty2","default","createElement","DropDown","buttonClassName","buttonLabel","buttonAriaLabel","map","DropDownItem","className","concat","onClick","key","FontSizeAction","_useLexicalComposerCo","useLexicalComposerContext","_useLexicalComposerCo2","_slicedToArray2","_useState","useState","isEditable","_useState2","setIsEditable","fontSize","useDeriveValueFromSelection","_ref","rangeSelection","$getSelectionStyleValueForProperty","useEffect","mergeRegister","registerEditableListener","editable","Fragment","exports"],"sources":["FontSizeAction.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { $getSelectionStyleValueForProperty, $patchStyleText } from \"@lexical/selection\";\nimport { mergeRegister } from \"@lexical/utils\";\nimport { $getSelection, $isRangeSelection, LexicalEditor } from \"lexical\";\nimport { DropDown, DropDownItem } from \"~/ui/DropDown\";\nimport { useDeriveValueFromSelection } from \"~/hooks/useCurrentSelection\";\n\nconst FONT_SIZE_OPTIONS: string[] = [\n \"8px\",\n \"9px\",\n \"10px\",\n \"11px\",\n \"12px\",\n \"14px\",\n \"15px\",\n \"16px\",\n \"18px\",\n \"21px\",\n \"24px\",\n \"30px\",\n \"36px\",\n \"48px\",\n \"60px\",\n \"72px\",\n \"96px\"\n];\n\nfunction dropDownActiveClass(active: boolean) {\n if (active) {\n return \"active dropdown-item-active\";\n }\n return \"\";\n}\n\ninterface FontSizeDropDownProps {\n editor: LexicalEditor;\n value: string;\n disabled?: boolean;\n}\n\nfunction FontSizeDropDown(props: FontSizeDropDownProps): JSX.Element {\n const { editor, value, disabled = false } = props;\n\n const handleClick = useCallback(\n (option: string) => {\n editor.update(() => {\n const selection = $getSelection();\n if ($isRangeSelection(selection)) {\n $patchStyleText(selection, {\n [\"font-size\"]: option\n });\n }\n });\n },\n [editor]\n );\n\n return (\n <DropDown\n disabled={disabled}\n buttonClassName=\"toolbar-item font-size\"\n buttonLabel={value}\n buttonAriaLabel={\"Formatting options for font size\"}\n >\n {FONT_SIZE_OPTIONS.map(option => (\n <DropDownItem\n className={`item fontsize-item ${dropDownActiveClass(value === option)}`}\n onClick={() => handleClick(option)}\n key={option}\n >\n <span className=\"text\">{option}</span>\n </DropDownItem>\n ))}\n </DropDown>\n );\n}\n\nexport const FontSizeAction = () => {\n const [editor] = useLexicalComposerContext();\n const [isEditable, setIsEditable] = useState(() => editor.isEditable());\n const fontSize = useDeriveValueFromSelection(({ rangeSelection }) => {\n if (!rangeSelection) {\n return \"15px\";\n }\n return $getSelectionStyleValueForProperty(rangeSelection, \"font-size\", \"15px\");\n });\n\n useEffect(() => {\n return mergeRegister(\n editor.registerEditableListener(editable => {\n setIsEditable(editable);\n })\n );\n }, [editor]);\n\n return (\n <>\n <FontSizeDropDown disabled={!isEditable} value={fontSize} editor={editor} />\n </>\n );\n};\n"],"mappings":";;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,uBAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AACA,IAAAK,SAAA,GAAAL,OAAA;AACA,IAAAM,oBAAA,GAAAN,OAAA;AAEA,IAAMO,iBAA2B,GAAG,CAChC,KAAK,EACL,KAAK,EACL,MAAM,EACN,MAAM,EACN,MAAM,EACN,MAAM,EACN,MAAM,EACN,MAAM,EACN,MAAM,EACN,MAAM,EACN,MAAM,EACN,MAAM,EACN,MAAM,EACN,MAAM,EACN,MAAM,EACN,MAAM,EACN,MAAM,CACT;AAED,SAASC,mBAAmBA,CAACC,MAAe,EAAE;EAC1C,IAAIA,MAAM,EAAE;IACR,OAAO,6BAA6B;EACxC;EACA,OAAO,EAAE;AACb;AAQA,SAASC,gBAAgBA,CAACC,KAA4B,EAAe;EACjE,IAAQC,MAAM,GAA8BD,KAAK,CAAzCC,MAAM;IAAEC,KAAK,GAAuBF,KAAK,CAAjCE,KAAK;IAAAC,eAAA,GAAuBH,KAAK,CAA1BI,QAAQ;IAARA,QAAQ,GAAAD,eAAA,cAAG,KAAK,GAAAA,eAAA;EAEvC,IAAME,WAAW,GAAG,IAAAC,kBAAW,EAC3B,UAACC,MAAc,EAAK;IAChBN,MAAM,CAACO,MAAM,CAAC,YAAM;MAChB,IAAMC,SAAS,GAAG,IAAAC,sBAAa,EAAC,CAAC;MACjC,IAAI,IAAAC,0BAAiB,EAACF,SAAS,CAAC,EAAE;QAC9B,IAAAG,0BAAe,EAACH,SAAS,MAAAI,gBAAA,CAAAC,OAAA,MACpB,WAAW,EAAGP,MAAM,CACxB,CAAC;MACN;IACJ,CAAC,CAAC;EACN,CAAC,EACD,CAACN,MAAM,CACX,CAAC;EAED,oBACId,MAAA,CAAA2B,OAAA,CAAAC,aAAA,CAACrB,SAAA,CAAAsB,QAAQ;IACLZ,QAAQ,EAAEA,QAAS;IACnBa,eAAe,EAAC,wBAAwB;IACxCC,WAAW,EAAEhB,KAAM;IACnBiB,eAAe,EAAE;EAAmC,GAEnDvB,iBAAiB,CAACwB,GAAG,CAAC,UAAAb,MAAM;IAAA,oBACzBpB,MAAA,CAAA2B,OAAA,CAAAC,aAAA,CAACrB,SAAA,CAAA2B,YAAY;MACTC,SAAS,wBAAAC,MAAA,CAAwB1B,mBAAmB,CAACK,KAAK,KAAKK,MAAM,CAAC,CAAG;MACzEiB,OAAO,EAAE,SAAAA,QAAA;QAAA,OAAMnB,WAAW,CAACE,MAAM,CAAC;MAAA,CAAC;MACnCkB,GAAG,EAAElB;IAAO,gBAEZpB,MAAA,CAAA2B,OAAA,CAAAC,aAAA;MAAMO,SAAS,EAAC;IAAM,GAAEf,MAAa,CAC3B,CAAC;EAAA,CAClB,CACK,CAAC;AAEnB;AAEO,IAAMmB,cAAc,GAAG,SAAjBA,cAAcA,CAAA,EAAS;EAChC,IAAAC,qBAAA,GAAiB,IAAAC,iDAAyB,EAAC,CAAC;IAAAC,sBAAA,OAAAC,eAAA,CAAAhB,OAAA,EAAAa,qBAAA;IAArC1B,MAAM,GAAA4B,sBAAA;EACb,IAAAE,SAAA,GAAoC,IAAAC,eAAQ,EAAC;MAAA,OAAM/B,MAAM,CAACgC,UAAU,CAAC,CAAC;IAAA,EAAC;IAAAC,UAAA,OAAAJ,eAAA,CAAAhB,OAAA,EAAAiB,SAAA;IAAhEE,UAAU,GAAAC,UAAA;IAAEC,aAAa,GAAAD,UAAA;EAChC,IAAME,QAAQ,GAAG,IAAAC,gDAA2B,EAAC,UAAAC,IAAA,EAAwB;IAAA,IAArBC,cAAc,GAAAD,IAAA,CAAdC,cAAc;IAC1D,IAAI,CAACA,cAAc,EAAE;MACjB,OAAO,MAAM;IACjB;IACA,OAAO,IAAAC,6CAAkC,EAACD,cAAc,EAAE,WAAW,EAAE,MAAM,CAAC;EAClF,CAAC,CAAC;EAEF,IAAAE,gBAAS,EAAC,YAAM;IACZ,OAAO,IAAAC,oBAAa,EAChBzC,MAAM,CAAC0C,wBAAwB,CAAC,UAAAC,QAAQ,EAAI;MACxCT,aAAa,CAACS,QAAQ,CAAC;IAC3B,CAAC,CACL,CAAC;EACL,CAAC,EAAE,CAAC3C,MAAM,CAAC,CAAC;EAEZ,oBACId,MAAA,CAAA2B,OAAA,CAAAC,aAAA,CAAA5B,MAAA,CAAA2B,OAAA,CAAA+B,QAAA,qBACI1D,MAAA,CAAA2B,OAAA,CAAAC,aAAA,CAAChB,gBAAgB;IAACK,QAAQ,EAAE,CAAC6B,UAAW;IAAC/B,KAAK,EAAEkC,QAAS;IAACnC,MAAM,EAAEA;EAAO,CAAE,CAC7E,CAAC;AAEX,CAAC;AAAC6C,OAAA,CAAApB,cAAA,GAAAA,cAAA"}
1
+ {"version":3,"names":["_react","_interopRequireWildcard","require","_LexicalComposerContext","_selection","_utils","_lexical","_DropDown","_useCurrentSelection","FONT_SIZE_OPTIONS","dropDownActiveClass","active","FontSizeDropDown","props","editor","value","_props$disabled","disabled","handleClick","useCallback","option","update","selection","$getSelection","$isRangeSelection","$patchStyleText","_defineProperty2","default","createElement","DropDown","buttonClassName","buttonLabel","buttonAriaLabel","map","DropDownItem","className","concat","onClick","key","defaultSize","FontSizeAction","_useLexicalComposerCo","useLexicalComposerContext","_useLexicalComposerCo2","_slicedToArray2","_useState","useState","isEditable","_useState2","setIsEditable","fontSize","useDeriveValueFromSelection","_ref","rangeSelection","$getSelectionStyleValueForProperty","_unused","useEffect","mergeRegister","registerEditableListener","editable","Fragment","exports"],"sources":["FontSizeAction.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { $getSelectionStyleValueForProperty, $patchStyleText } from \"@lexical/selection\";\nimport { mergeRegister } from \"@lexical/utils\";\nimport { $getSelection, $isRangeSelection, LexicalEditor } from \"lexical\";\nimport { DropDown, DropDownItem } from \"~/ui/DropDown\";\nimport { useDeriveValueFromSelection } from \"~/hooks/useCurrentSelection\";\n\nconst FONT_SIZE_OPTIONS: string[] = [\n \"8px\",\n \"9px\",\n \"10px\",\n \"11px\",\n \"12px\",\n \"14px\",\n \"15px\",\n \"16px\",\n \"18px\",\n \"21px\",\n \"24px\",\n \"30px\",\n \"36px\",\n \"48px\",\n \"60px\",\n \"72px\",\n \"96px\"\n];\n\nfunction dropDownActiveClass(active: boolean) {\n if (active) {\n return \"active dropdown-item-active\";\n }\n return \"\";\n}\n\ninterface FontSizeDropDownProps {\n editor: LexicalEditor;\n value: string;\n disabled?: boolean;\n}\n\nfunction FontSizeDropDown(props: FontSizeDropDownProps): JSX.Element {\n const { editor, value, disabled = false } = props;\n\n const handleClick = useCallback(\n (option: string) => {\n editor.update(() => {\n const selection = $getSelection();\n if ($isRangeSelection(selection)) {\n $patchStyleText(selection, {\n [\"font-size\"]: option\n });\n }\n });\n },\n [editor]\n );\n\n return (\n <DropDown\n disabled={disabled}\n buttonClassName=\"toolbar-item font-size\"\n buttonLabel={value}\n buttonAriaLabel={\"Formatting options for font size\"}\n >\n {FONT_SIZE_OPTIONS.map(option => (\n <DropDownItem\n className={`item fontsize-item ${dropDownActiveClass(value === option)}`}\n onClick={() => handleClick(option)}\n key={option}\n >\n <span className=\"text\">{option}</span>\n </DropDownItem>\n ))}\n </DropDown>\n );\n}\n\nconst defaultSize = \"15px\";\n\nexport const FontSizeAction = () => {\n const [editor] = useLexicalComposerContext();\n const [isEditable, setIsEditable] = useState(() => editor.isEditable());\n const fontSize = useDeriveValueFromSelection(({ rangeSelection }) => {\n if (!rangeSelection) {\n return defaultSize;\n }\n try {\n return $getSelectionStyleValueForProperty(rangeSelection, \"font-size\", \"15px\");\n } catch {\n return defaultSize;\n }\n });\n\n useEffect(() => {\n return mergeRegister(\n editor.registerEditableListener(editable => {\n setIsEditable(editable);\n })\n );\n }, [editor]);\n\n return (\n <>\n <FontSizeDropDown disabled={!isEditable} value={fontSize} editor={editor} />\n </>\n );\n};\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webiny/lexical-editor",
3
- "version": "5.39.2",
3
+ "version": "5.39.3-beta.0",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "https://github.com/webiny/webiny-js.git"
@@ -14,17 +14,17 @@
14
14
  "@lexical/rich-text": "0.12.2",
15
15
  "@lexical/selection": "0.12.2",
16
16
  "@lexical/utils": "0.12.2",
17
- "@webiny/lexical-nodes": "5.39.2",
18
- "@webiny/lexical-theme": "5.39.2",
19
- "@webiny/react-composition": "5.39.2",
20
- "@webiny/react-properties": "5.39.2",
17
+ "@webiny/lexical-nodes": "5.39.3-beta.0",
18
+ "@webiny/lexical-theme": "5.39.3-beta.0",
19
+ "@webiny/react-composition": "5.39.3-beta.0",
20
+ "@webiny/react-properties": "5.39.3-beta.0",
21
21
  "lexical": "0.12.2",
22
22
  "react": "17.0.2",
23
23
  "react-dom": "17.0.2"
24
24
  },
25
25
  "devDependencies": {
26
- "@webiny/cli": "5.39.2",
27
- "@webiny/project-utils": "5.39.2"
26
+ "@webiny/cli": "5.39.3-beta.0",
27
+ "@webiny/project-utils": "5.39.3-beta.0"
28
28
  },
29
29
  "publishConfig": {
30
30
  "access": "public",
@@ -34,5 +34,5 @@
34
34
  "build": "yarn webiny run build",
35
35
  "watch": "yarn webiny run watch"
36
36
  },
37
- "gitHead": "d25ece60370f08c6138d0af0340d8900acb95bac"
37
+ "gitHead": "bb0a2c8b43b2caa88f7a2d745a88039a520d124c"
38
38
  }