@thangph2146/lexical-editor 0.0.7 → 0.0.11

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 (23) hide show
  1. package/README.md +8 -0
  2. package/dist/editor-x/editor.cjs +26 -24
  3. package/dist/editor-x/editor.cjs.map +1 -1
  4. package/dist/editor-x/editor.css +120 -105
  5. package/dist/editor-x/editor.css.map +1 -1
  6. package/dist/editor-x/editor.js +26 -24
  7. package/dist/editor-x/editor.js.map +1 -1
  8. package/dist/index.cjs +26 -24
  9. package/dist/index.cjs.map +1 -1
  10. package/dist/index.css +120 -105
  11. package/dist/index.css.map +1 -1
  12. package/dist/index.js +26 -24
  13. package/dist/index.js.map +1 -1
  14. package/package.json +87 -86
  15. package/src/editor-ui/content-editable.tsx +30 -42
  16. package/src/editor-x/plugins.tsx +3 -1
  17. package/src/plugins/floating-text-format-plugin.tsx +716 -702
  18. package/src/plugins/layout-plugin.tsx +1 -5
  19. package/src/themes/_variables.scss +26 -26
  20. package/src/themes/core/_typography.scss +26 -12
  21. package/src/themes/plugins/_color-picker.scss +103 -104
  22. package/src/themes/plugins/_menus-and-pickers.scss +2 -0
  23. package/src/themes/ui-components/_typography.scss +1 -1
package/README.md CHANGED
@@ -45,3 +45,11 @@ function MyEditor() {
45
45
  ## Giấy phép
46
46
 
47
47
  MIT
48
+
49
+ ## Publish
50
+
51
+ ```bash
52
+ pnpm build
53
+ npm whoami
54
+ npm publish --access public
55
+ ```
package/dist/editor-x/editor.cjs CHANGED
@@ -5109,19 +5109,7 @@ function ContentEditable({
5109
5109
  !isReadOnlyOrReview && "min-h-72 px-8 py-4",
5110
5110
  className
5111
5111
  ),
5112
- "aria-placeholder": placeholder,
5113
- "aria-label": placeholder || "Editor n\u1ED9i dung",
5114
- placeholder: /* @__PURE__ */ jsxRuntime.jsx(
5115
- "div",
5116
- {
5117
- className: cn(
5118
- placeholderClassName,
5119
- "text-muted-foreground pointer-events-none select-none",
5120
- placeholderDefaults && !isReadOnlyOrReview && "absolute top-0 left-0 overflow-hidden px-8 py-[18px] text-ellipsis"
5121
- ),
5122
- children: placeholder
5123
- }
5124
- )
5112
+ "aria-label": "Editor n\u1ED9i dung"
5125
5113
  }
5126
5114
  );
5127
5115
  }
@@ -9979,7 +9967,7 @@ function LayoutPlugin() {
9979
9967
  values: {
9980
9968
  template: parentContainer.getTemplateColumns(),
9981
9969
  itemBackgroundColor: extractStyleValue(style, "background-color") ?? "#ffffff",
9982
- itemPaddingXPx: paddingValues && paddingValues.length > 1 ? paddingValues[1] : paddingValues?.[0] ?? 12,
9970
+ itemPaddingXPx: paddingValues?.[1] ?? paddingValues?.[0] ?? 12,
9983
9971
  itemPaddingYPx: paddingValues?.[0] ?? 12,
9984
9972
  itemBorderRadiusPx: borderRadiusValues?.[0] ?? 8
9985
9973
  }
@@ -28794,10 +28782,16 @@ function FontColorModalContent({
28794
28782
  /* @__PURE__ */ jsxRuntime.jsx(ColorPickerRoot, { inline: true, value: color, onValueChange: setColor, children: /* @__PURE__ */ jsxRuntime.jsxs(ColorPickerContent, { className: "editor-w-full editor-border-0 editor-shadow-none editor-p-0", children: [
28795
28783
  /* @__PURE__ */ jsxRuntime.jsx(ColorPickerArea, { className: "editor-h-40 editor-w-full editor-rounded-md" }),
28796
28784
  /* @__PURE__ */ jsxRuntime.jsxs(Flex, { direction: "column", gap: 3, className: "editor-mt-3", children: [
28797
- /* @__PURE__ */ jsxRuntime.jsxs(Flex, { direction: "column", gap: 2, children: [
28798
- /* @__PURE__ */ jsxRuntime.jsx(ColorPickerHueSlider, { className: "editor-w-full" }),
28799
- /* @__PURE__ */ jsxRuntime.jsx(ColorPickerAlphaSlider, { className: "editor-w-full" }),
28800
- /* @__PURE__ */ jsxRuntime.jsx(ColorPickerInput, { className: "editor-w-full" })
28785
+ /* @__PURE__ */ jsxRuntime.jsxs(Flex, { align: "center", gap: 2, children: [
28786
+ /* @__PURE__ */ jsxRuntime.jsx(ColorPickerEyeDropper, {}),
28787
+ /* @__PURE__ */ jsxRuntime.jsxs(Flex, { direction: "column", gap: 2, className: "editor-flex-1", children: [
28788
+ /* @__PURE__ */ jsxRuntime.jsx(ColorPickerHueSlider, { className: "editor-w-full" }),
28789
+ /* @__PURE__ */ jsxRuntime.jsx(ColorPickerAlphaSlider, { className: "editor-w-full" })
28790
+ ] })
28791
+ ] }),
28792
+ /* @__PURE__ */ jsxRuntime.jsxs(Flex, { align: "center", gap: 2, children: [
28793
+ /* @__PURE__ */ jsxRuntime.jsx(ColorPickerFormatSelect, {}),
28794
+ /* @__PURE__ */ jsxRuntime.jsx(ColorPickerInput, {})
28801
28795
  ] }),
28802
28796
  /* @__PURE__ */ jsxRuntime.jsx(ColorPickerPresets, {})
28803
28797
  ] })
@@ -28828,10 +28822,16 @@ function BgColorModalContent({
28828
28822
  /* @__PURE__ */ jsxRuntime.jsx(ColorPickerRoot, { inline: true, value: color, onValueChange: setColor, children: /* @__PURE__ */ jsxRuntime.jsxs(ColorPickerContent, { className: "editor-w-full editor-border-0 editor-shadow-none editor-p-0", children: [
28829
28823
  /* @__PURE__ */ jsxRuntime.jsx(ColorPickerArea, { className: "editor-h-40 editor-w-full editor-rounded-md" }),
28830
28824
  /* @__PURE__ */ jsxRuntime.jsxs(Flex, { direction: "column", gap: 3, className: "editor-mt-3", children: [
28831
- /* @__PURE__ */ jsxRuntime.jsxs(Flex, { direction: "column", gap: 2, children: [
28832
- /* @__PURE__ */ jsxRuntime.jsx(ColorPickerHueSlider, { className: "editor-w-full" }),
28833
- /* @__PURE__ */ jsxRuntime.jsx(ColorPickerAlphaSlider, { className: "editor-w-full" }),
28834
- /* @__PURE__ */ jsxRuntime.jsx(ColorPickerInput, { className: "editor-w-full" })
28825
+ /* @__PURE__ */ jsxRuntime.jsxs(Flex, { align: "center", gap: 2, children: [
28826
+ /* @__PURE__ */ jsxRuntime.jsx(ColorPickerEyeDropper, {}),
28827
+ /* @__PURE__ */ jsxRuntime.jsxs(Flex, { direction: "column", gap: 2, className: "editor-flex-1", children: [
28828
+ /* @__PURE__ */ jsxRuntime.jsx(ColorPickerHueSlider, { className: "editor-w-full" }),
28829
+ /* @__PURE__ */ jsxRuntime.jsx(ColorPickerAlphaSlider, { className: "editor-w-full" })
28830
+ ] })
28831
+ ] }),
28832
+ /* @__PURE__ */ jsxRuntime.jsxs(Flex, { align: "center", gap: 2, children: [
28833
+ /* @__PURE__ */ jsxRuntime.jsx(ColorPickerFormatSelect, {}),
28834
+ /* @__PURE__ */ jsxRuntime.jsx(ColorPickerInput, {})
28835
28835
  ] }),
28836
28836
  /* @__PURE__ */ jsxRuntime.jsx(ColorPickerPresets, {})
28837
28837
  ] })
@@ -33075,11 +33075,13 @@ function Plugins({
33075
33075
  contentEditable: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("editor-relative-full"), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("editor-relative-full"), ref: onRef, children: /* @__PURE__ */ jsxRuntime.jsx(
33076
33076
  ContentEditable,
33077
33077
  {
33078
- placeholder: readOnly ? "" : placeholder,
33078
+ placeholder: "",
33079
33079
  className: cn(
33080
33080
  "editor-content-editable",
33081
33081
  readOnly && "editor-content-editable--readonly"
33082
- )
33082
+ ),
33083
+ placeholderClassName: "editor-placeholder",
33084
+ placeholderDefaults: false
33083
33085
  }
33084
33086
  ) }) }),
33085
33087
  ErrorBoundary: LexicalErrorBoundary.LexicalErrorBoundary,