@byline/richtext-lexical 4.11.0 → 4.11.2

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 (25) hide show
  1. package/dist/field/content-editable-inline.js +2 -2
  2. package/dist/field/content-editable.js +2 -2
  3. package/dist/field/extensions/admonition/icons/danger-icon.js +2 -2
  4. package/dist/field/extensions/admonition/icons/note-icon.js +2 -2
  5. package/dist/field/extensions/admonition/icons/tip-icon.js +2 -2
  6. package/dist/field/extensions/admonition/icons/warning-icon.js +2 -2
  7. package/dist/field/extensions/inline-image/inline-image-node-component.js +4 -4
  8. package/dist/field/extensions/layout/layout-extension.d.ts +1 -1
  9. package/dist/field/plugins/table-plugin/index.d.ts +1 -1
  10. package/dist/field/ui/placeholder-inline.js +2 -2
  11. package/dist/field/ui/placeholder.js +2 -2
  12. package/dist/richtext-field.js +4 -4
  13. package/package.json +29 -29
  14. package/src/field/content-editable-inline.tsx +1 -1
  15. package/src/field/content-editable.tsx +1 -1
  16. package/src/field/extensions/admonition/icons/danger-icon.tsx +1 -1
  17. package/src/field/extensions/admonition/icons/note-icon.tsx +1 -1
  18. package/src/field/extensions/admonition/icons/tip-icon.tsx +1 -1
  19. package/src/field/extensions/admonition/icons/warning-icon.tsx +1 -1
  20. package/src/field/extensions/inline-image/inline-image-node-component.tsx +8 -4
  21. package/src/field/extensions/layout/layout-extension.tsx +3 -1
  22. package/src/field/plugins/table-plugin/index.tsx +1 -1
  23. package/src/field/ui/placeholder-inline.tsx +1 -1
  24. package/src/field/ui/placeholder.tsx +1 -1
  25. package/src/richtext-field.tsx +1 -1
package/dist/field/content-editable-inline.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
2
  import { ContentEditable } from "@lexical/react/LexicalContentEditable";
3
- import classnames from "classnames";
3
+ import clsx from "clsx";
4
4
  import "./content-editable.css";
5
5
  function ContentEditableInline({ className }) {
6
- const classes = classnames(className);
6
+ const classes = clsx(className);
7
7
  return /*#__PURE__*/ jsx(ContentEditable, {
8
8
  className: classes
9
9
  });
package/dist/field/content-editable.js CHANGED
@@ -1,12 +1,12 @@
1
1
  "use client";
2
2
  import { jsx } from "react/jsx-runtime";
3
3
  import { ContentEditable } from "@lexical/react/LexicalContentEditable";
4
- import classnames from "classnames";
4
+ import clsx from "clsx";
5
5
  import { useEditorConfig } from "./config/editor-config-context.js";
6
6
  import "./content-editable.css";
7
7
  function content_editable_ContentEditable({ className }) {
8
8
  const { config } = useEditorConfig();
9
- const classes = classnames('ContentEditable__root', className);
9
+ const classes = clsx('ContentEditable__root', className);
10
10
  return /*#__PURE__*/ jsx(ContentEditable, {
11
11
  className: classes
12
12
  });
package/dist/field/extensions/admonition/icons/danger-icon.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
- import classnames from "classnames";
2
+ import clsx from "clsx";
3
3
  import "./danger-icon.css";
4
4
  function DangerIcon({ className, ...rest }) {
5
5
  return /*#__PURE__*/ jsx("div", {
6
- className: classnames('danger-icon', className),
6
+ className: clsx('danger-icon', className),
7
7
  ...rest,
8
8
  children: /*#__PURE__*/ jsx("svg", {
9
9
  focusable: "false",
package/dist/field/extensions/admonition/icons/note-icon.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
- import classnames from "classnames";
2
+ import clsx from "clsx";
3
3
  import "./note-icon.css";
4
4
  function NoteIcon({ className, ...rest }) {
5
5
  return /*#__PURE__*/ jsx("div", {
6
- className: classnames('note-icon', className),
6
+ className: clsx('note-icon', className),
7
7
  ...rest,
8
8
  children: /*#__PURE__*/ jsx("svg", {
9
9
  focusable: "false",
package/dist/field/extensions/admonition/icons/tip-icon.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
- import classnames from "classnames";
2
+ import clsx from "clsx";
3
3
  import "./tip-icon.css";
4
4
  function TipIcon({ className, ...rest }) {
5
5
  return /*#__PURE__*/ jsx("div", {
6
- className: classnames('tip-icon', className),
6
+ className: clsx('tip-icon', className),
7
7
  ...rest,
8
8
  children: /*#__PURE__*/ jsx("svg", {
9
9
  focusable: "false",
package/dist/field/extensions/admonition/icons/warning-icon.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
- import classnames from "classnames";
2
+ import clsx from "clsx";
3
3
  import "./warning-icon.css";
4
4
  function WarningIcon({ className, ...rest }) {
5
5
  return /*#__PURE__*/ jsx("div", {
6
- className: classnames('warning-icon', className),
6
+ className: clsx('warning-icon', className),
7
7
  ...rest,
8
8
  children: /*#__PURE__*/ jsx("svg", {
9
9
  focusable: "false",
package/dist/field/extensions/inline-image/inline-image-node-component.js CHANGED
@@ -8,7 +8,7 @@ import { OnChangePlugin } from "@lexical/react/LexicalOnChangePlugin";
8
8
  import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
9
9
  import { useLexicalNodeSelection } from "@lexical/react/useLexicalNodeSelection";
10
10
  import { mergeRegister } from "@lexical/utils";
11
- import classnames from "classnames";
11
+ import clsx from "clsx";
12
12
  import { $getNodeByKey, $getSelection, $isNodeSelection, $setSelection, CLICK_COMMAND, COMMAND_PRIORITY_LOW, DRAGSTART_COMMAND, KEY_BACKSPACE_COMMAND, KEY_DELETE_COMMAND, KEY_ENTER_COMMAND, KEY_ESCAPE_COMMAND, SELECTION_CHANGE_COMMAND } from "lexical";
13
13
  import content_editable_inline from "../../content-editable-inline.js";
14
14
  import { useSharedHistoryContext } from "../../context/shared-history-context.js";
@@ -79,11 +79,11 @@ function InlineImageComponent({ relation, src, position, altText, width, height,
79
79
  if (isSelected && $isNodeSelection(latestSelection) && 1 === latestSelection.getNodes().length) {
80
80
  if (showCaption) {
81
81
  $setSelection(null);
82
- event.preventDefault();
82
+ event?.preventDefault();
83
83
  caption.focus();
84
84
  return true;
85
85
  } else if (null !== buttonElem && buttonElem !== document.activeElement) {
86
- event.preventDefault();
86
+ event?.preventDefault();
87
87
  buttonElem.focus();
88
88
  return true;
89
89
  }
@@ -155,7 +155,7 @@ function InlineImageComponent({ relation, src, position, altText, width, height,
155
155
  nodeKey
156
156
  });
157
157
  };
158
- const classNames = classnames('InlineImageNode__container', {
158
+ const classNames = clsx('InlineImageNode__container', {
159
159
  focused: isFocused
160
160
  }, {
161
161
  draggable: $isNodeSelection(selection)
package/dist/field/extensions/layout/layout-extension.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import type { LexicalCommand, NodeKey } from 'lexical';
3
- export declare const OPEN_INSERT_LAYOUT_MODAL_COMMAND: LexicalCommand<unknown>;
3
+ export declare const OPEN_INSERT_LAYOUT_MODAL_COMMAND: LexicalCommand<null>;
4
4
  export declare const INSERT_LAYOUT_COMMAND: LexicalCommand<string>;
5
5
  export declare const UPDATE_LAYOUT_COMMAND: LexicalCommand<{
6
6
  template: string;
package/dist/field/plugins/table-plugin/index.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import * as React from 'react';
2
- export declare const OPEN_TABLE_MODAL_COMMAND: import("lexical").LexicalCommand<unknown>;
2
+ export declare const OPEN_TABLE_MODAL_COMMAND: import("lexical").LexicalCommand<null>;
3
3
  export declare function TablePlugin(): React.JSX.Element;
package/dist/field/ui/placeholder-inline.js CHANGED
@@ -1,9 +1,9 @@
1
1
  "use client";
2
2
  import { jsx } from "react/jsx-runtime";
3
- import classnames from "classnames";
3
+ import clsx from "clsx";
4
4
  import "./placeholder.css";
5
5
  function PlaceholderInline({ children, className }) {
6
- const classes = classnames('Placeholder__root', className);
6
+ const classes = clsx('Placeholder__root', className);
7
7
  return /*#__PURE__*/ jsx("span", {
8
8
  className: classes,
9
9
  children: children
package/dist/field/ui/placeholder.js CHANGED
@@ -1,11 +1,11 @@
1
1
  "use client";
2
2
  import { jsx } from "react/jsx-runtime";
3
- import classnames from "classnames";
3
+ import clsx from "clsx";
4
4
  import "./placeholder.css";
5
5
  import { useEditorConfig } from "../config/editor-config-context.js";
6
6
  function Placeholder({ children, className }) {
7
7
  const { config } = useEditorConfig();
8
- const classes = classnames('Placeholder__root', className);
8
+ const classes = clsx('Placeholder__root', className);
9
9
  return /*#__PURE__*/ jsx("div", {
10
10
  className: classes,
11
11
  children: children
package/dist/richtext-field.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { LocaleBadge, useFieldError, useFieldValue } from "@byline/admin/react";
3
3
  import { ErrorText, Label } from "@byline/ui/react";
4
- import classnames from "classnames";
4
+ import clsx from "clsx";
5
5
  import { defaultEditorConfig } from "./field/config/default.js";
6
6
  import { defaultExtensionsList } from "./field/config/default-extensions.js";
7
7
  import { resolveEditorConfig } from "./field/config/resolve-editor-config.js";
@@ -21,7 +21,7 @@ const RichTextField = ({ field, value, defaultValue, editorConfig, readonly = fa
21
21
  };
22
22
  const resolvedEditorConfig = baseEditorConfig;
23
23
  const labelNode = locale && field.label ? /*#__PURE__*/ jsxs("div", {
24
- className: classnames('byline-field-richtext-label', richtext_field_module["label-row"]),
24
+ className: clsx('byline-field-richtext-label', richtext_field_module["label-row"]),
25
25
  children: [
26
26
  /*#__PURE__*/ jsx(Label, {
27
27
  id: `${fieldId}-label`,
@@ -35,9 +35,9 @@ const RichTextField = ({ field, value, defaultValue, editorConfig, readonly = fa
35
35
  ]
36
36
  }) : field.label;
37
37
  return /*#__PURE__*/ jsx("div", {
38
- className: classnames('byline-field-richtext', field.name, richtext_field_module.wrapper),
38
+ className: clsx('byline-field-richtext', field.name, richtext_field_module.wrapper),
39
39
  children: /*#__PURE__*/ jsxs("div", {
40
- className: classnames('byline-field-richtext-body', richtext_field_module.body),
40
+ className: clsx('byline-field-richtext-body', richtext_field_module.body),
41
41
  children: [
42
42
  /*#__PURE__*/ jsx(EditorField, {
43
43
  onChange: onChange,
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "private": false,
4
4
  "type": "module",
5
5
  "license": "MPL-2.0",
6
- "version": "4.11.0",
6
+ "version": "4.11.2",
7
7
  "engines": {
8
8
  "node": ">=20.9.0"
9
9
  },
@@ -56,47 +56,47 @@
56
56
  }
57
57
  },
58
58
  "dependencies": {
59
- "@lexical/code": "0.48.0",
60
- "@lexical/extension": "0.48.0",
61
- "@lexical/headless": "0.48.0",
62
- "@lexical/link": "0.48.0",
63
- "@lexical/list": "0.48.0",
64
- "@lexical/mark": "0.48.0",
65
- "@lexical/markdown": "0.48.0",
66
- "@lexical/overflow": "0.48.0",
67
- "@lexical/react": "0.48.0",
68
- "@lexical/rich-text": "0.48.0",
69
- "@lexical/selection": "0.48.0",
70
- "@lexical/table": "0.48.0",
71
- "@lexical/utils": "0.48.0",
72
- "classnames": "^2.5.1",
73
- "lexical": "0.48.0",
59
+ "@lexical/code": "0.49.0",
60
+ "@lexical/extension": "0.49.0",
61
+ "@lexical/headless": "0.49.0",
62
+ "@lexical/link": "0.49.0",
63
+ "@lexical/list": "0.49.0",
64
+ "@lexical/mark": "0.49.0",
65
+ "@lexical/markdown": "0.49.0",
66
+ "@lexical/overflow": "0.49.0",
67
+ "@lexical/react": "0.49.0",
68
+ "@lexical/rich-text": "0.49.0",
69
+ "@lexical/selection": "0.49.0",
70
+ "@lexical/table": "0.49.0",
71
+ "@lexical/utils": "0.49.0",
72
+ "clsx": "^2.1.1",
73
+ "lexical": "0.49.0",
74
74
  "react-error-boundary": "^6.1.2",
75
- "@byline/admin": "4.11.0",
76
- "@byline/client": "4.11.0",
77
- "@byline/ui": "4.11.0",
78
- "@byline/core": "4.11.0"
75
+ "@byline/admin": "4.11.2",
76
+ "@byline/client": "4.11.2",
77
+ "@byline/core": "4.11.2",
78
+ "@byline/ui": "4.11.2"
79
79
  },
80
80
  "peerDependencies": {
81
81
  "react": "^19.0.0",
82
82
  "react-dom": "^19.0.0"
83
83
  },
84
84
  "devDependencies": {
85
- "@biomejs/biome": "2.5.4",
85
+ "@biomejs/biome": "2.5.6",
86
86
  "@rsbuild/plugin-react": "^2.1.0",
87
87
  "@rslib/core": "^0.23.2",
88
- "@types/node": "^26.1.1",
89
- "@types/react": "19.2.17",
90
- "@types/react-dom": "19.2.3",
91
- "@vitejs/plugin-react": "^6.0.3",
92
- "lightningcss": "^1.32.0",
88
+ "@types/node": "^26.1.2",
89
+ "@types/react": "19.2.18",
90
+ "@types/react-dom": "19.2.4",
91
+ "@vitejs/plugin-react": "^6.0.5",
92
+ "lightningcss": "^1.33.0",
93
93
  "npm-run-all": "^4.1.5",
94
- "react": "^19.2.7",
95
- "react-dom": "^19.2.7",
94
+ "react": "^19.2.8",
95
+ "react-dom": "^19.2.8",
96
96
  "rimraf": "^6.1.3",
97
97
  "typescript": "^7.0.2",
98
98
  "typescript-plugin-css-modules": "^5.2.0",
99
- "vite": "^8.1.5",
99
+ "vite": "^8.2.0",
100
100
  "vitest": "^4.1.10"
101
101
  },
102
102
  "publishConfig": {
package/src/field/content-editable-inline.tsx CHANGED
@@ -8,7 +8,7 @@
8
8
  import type * as React from 'react'
9
9
 
10
10
  import { ContentEditable as LexicalContentEditable } from '@lexical/react/LexicalContentEditable'
11
- import cx from 'classnames'
11
+ import cx from 'clsx'
12
12
 
13
13
  import './content-editable.css'
14
14
 
package/src/field/content-editable.tsx CHANGED
@@ -10,7 +10,7 @@
10
10
  import type * as React from 'react'
11
11
 
12
12
  import { ContentEditable as LexicalContentEditable } from '@lexical/react/LexicalContentEditable'
13
- import cx from 'classnames'
13
+ import cx from 'clsx'
14
14
 
15
15
  import { useEditorConfig } from './config/editor-config-context'
16
16
 
package/src/field/extensions/admonition/icons/danger-icon.tsx CHANGED
@@ -1,6 +1,6 @@
1
1
  import type React from 'react'
2
2
 
3
- import cx from 'classnames'
3
+ import cx from 'clsx'
4
4
 
5
5
  import './danger-icon.css'
6
6
 
package/src/field/extensions/admonition/icons/note-icon.tsx CHANGED
@@ -1,6 +1,6 @@
1
1
  import type React from 'react'
2
2
 
3
- import cx from 'classnames'
3
+ import cx from 'clsx'
4
4
 
5
5
  import './note-icon.css'
6
6
 
package/src/field/extensions/admonition/icons/tip-icon.tsx CHANGED
@@ -1,6 +1,6 @@
1
1
  import type React from 'react'
2
2
 
3
- import cx from 'classnames'
3
+ import cx from 'clsx'
4
4
 
5
5
  import './tip-icon.css'
6
6
 
package/src/field/extensions/admonition/icons/warning-icon.tsx CHANGED
@@ -1,6 +1,6 @@
1
1
  import type React from 'react'
2
2
 
3
- import cx from 'classnames'
3
+ import cx from 'clsx'
4
4
 
5
5
  import './warning-icon.css'
6
6
 
package/src/field/extensions/inline-image/inline-image-node-component.tsx CHANGED
@@ -19,7 +19,7 @@ import { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin'
19
19
  import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin'
20
20
  import { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection'
21
21
  import { mergeRegister } from '@lexical/utils'
22
- import cx from 'classnames'
22
+ import cx from 'clsx'
23
23
  import type { BaseSelection, LexicalEditor, NodeKey, NodeSelection, RangeSelection } from 'lexical'
24
24
  import {
25
25
  $getNodeByKey,
@@ -158,7 +158,11 @@ export default function InlineImageComponent({
158
158
  )
159
159
 
160
160
  const onEnter = useCallback(
161
- (event: KeyboardEvent) => {
161
+ // KEY_ENTER_COMMAND carries `KeyboardEvent | null` — Lexical synthesises an
162
+ // Enter with a null event when an IME composition ends in a newline, and
163
+ // that path reaches node selections too. There is nothing to preventDefault
164
+ // in that case, but the focus move still applies.
165
+ (event: KeyboardEvent | null) => {
162
166
  const latestSelection = $getSelection()
163
167
  const buttonElem = buttonRef.current
164
168
  if (
@@ -169,11 +173,11 @@ export default function InlineImageComponent({
169
173
  if (showCaption) {
170
174
  // Move focus into nested editor
171
175
  $setSelection(null)
172
- event.preventDefault()
176
+ event?.preventDefault()
173
177
  caption.focus()
174
178
  return true
175
179
  } else if (buttonElem !== null && buttonElem !== document.activeElement) {
176
- event.preventDefault()
180
+ event?.preventDefault()
177
181
  buttonElem.focus()
178
182
  return true
179
183
  }
package/src/field/extensions/layout/layout-extension.tsx CHANGED
@@ -39,7 +39,9 @@ import {
39
39
  } from './layout-container-node'
40
40
  import { $createLayoutItemNode, $isLayoutItemNode, LayoutItemNode } from './layout-item-node'
41
41
 
42
- export const OPEN_INSERT_LAYOUT_MODAL_COMMAND = createCommand('OPEN_INSERT_LAYOUT_MODAL_COMMAND')
42
+ export const OPEN_INSERT_LAYOUT_MODAL_COMMAND = createCommand<null>(
43
+ 'OPEN_INSERT_LAYOUT_MODAL_COMMAND'
44
+ )
43
45
 
44
46
  export const INSERT_LAYOUT_COMMAND: LexicalCommand<string> = createCommand<string>()
45
47
 
package/src/field/plugins/table-plugin/index.tsx CHANGED
@@ -8,7 +8,7 @@ import { COMMAND_PRIORITY_NORMAL, createCommand } from 'lexical'
8
8
 
9
9
  import { TableModal } from './table-modal'
10
10
 
11
- export const OPEN_TABLE_MODAL_COMMAND = createCommand('OPEN_TABLE_MODAL_COMMAND')
11
+ export const OPEN_TABLE_MODAL_COMMAND = createCommand<null>('OPEN_TABLE_MODAL_COMMAND')
12
12
 
13
13
  export function TablePlugin(): React.JSX.Element {
14
14
  const [editor] = useLexicalComposerContext()
package/src/field/ui/placeholder-inline.tsx CHANGED
@@ -9,7 +9,7 @@
9
9
  */
10
10
  import type * as React from 'react'
11
11
 
12
- import cx from 'classnames'
12
+ import cx from 'clsx'
13
13
 
14
14
  import './placeholder.css'
15
15
 
package/src/field/ui/placeholder.tsx CHANGED
@@ -9,7 +9,7 @@
9
9
  */
10
10
  import type * as React from 'react'
11
11
 
12
- import cx from 'classnames'
12
+ import cx from 'clsx'
13
13
 
14
14
  import './placeholder.css'
15
15
 
package/src/richtext-field.tsx CHANGED
@@ -11,7 +11,7 @@ import type React from 'react'
11
11
  import { LocaleBadge, useFieldError, useFieldValue } from '@byline/admin/react'
12
12
  import type { RichTextField as FieldType } from '@byline/core'
13
13
  import { ErrorText, Label } from '@byline/ui/react'
14
- import cx from 'classnames'
14
+ import cx from 'clsx'
15
15
 
16
16
  import { defaultEditorConfig } from './field/config/default'
17
17
  import { defaultExtensionsList } from './field/config/default-extensions'