@payloadcms/richtext-lexical 4.0.0-internal.a7ca468 → 4.0.0-internal.aa277b8
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/dist/exports/client/bundled.css +1 -1
- package/dist/exports/client/index.js +16 -16
- package/dist/exports/client/index.js.map +4 -4
- package/dist/features/converters/lexicalToHtml/shared/findConverterForNode.d.ts.map +1 -1
- package/dist/features/converters/lexicalToHtml/shared/findConverterForNode.js +3 -2
- package/dist/features/converters/lexicalToHtml/shared/findConverterForNode.js.map +1 -1
- package/dist/features/converters/lexicalToHtml/sync/alignment.spec.js +92 -0
- package/dist/features/converters/lexicalToHtml/sync/alignment.spec.js.map +1 -0
- package/dist/features/toolbars/fixed/client/Toolbar/horizontalWheelScroll.d.ts +8 -0
- package/dist/features/toolbars/fixed/client/Toolbar/horizontalWheelScroll.d.ts.map +1 -0
- package/dist/features/toolbars/fixed/client/Toolbar/horizontalWheelScroll.js +80 -0
- package/dist/features/toolbars/fixed/client/Toolbar/horizontalWheelScroll.js.map +1 -0
- package/dist/features/toolbars/fixed/client/Toolbar/horizontalWheelScroll.spec.js +65 -0
- package/dist/features/toolbars/fixed/client/Toolbar/horizontalWheelScroll.spec.js.map +1 -0
- package/dist/features/toolbars/fixed/client/Toolbar/index.css +77 -3
- package/dist/features/toolbars/fixed/client/Toolbar/index.d.ts.map +1 -1
- package/dist/features/toolbars/fixed/client/Toolbar/index.js +4 -1
- package/dist/features/toolbars/fixed/client/Toolbar/index.js.map +1 -1
- package/dist/field/bundled.css +1 -1
- package/dist/field/index.css +10 -10
- package/package.json +6 -6
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"findConverterForNode.d.ts","sourceRoot":"","sources":["../../../../../src/features/converters/lexicalToHtml/shared/findConverterForNode.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAGpD,OAAO,KAAK,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAA;AAChF,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAGrE,wBAAgB,oBAAoB,CAClC,WAAW,SAAS,cAAc,GAAG,mBAAmB,EACxD,UAAU,SAAS,aAAa,GAAG,kBAAkB,EACrD,EACA,UAAU,EACV,aAAa,EACb,gBAAgB,EAChB,IAAI,EACJ,gBAAgB,GACjB,EAAE;IACD,UAAU,EAAE,WAAW,CAAA;IACvB,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,CAAA;IAClC,gBAAgB,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,CAAA;IACrC,IAAI,EAAE,qBAAqB,CAAA;IAC3B,gBAAgB,EAAE,UAAU,CAAA;CAC7B,GAAG;IACF,gBAAgB,EAAE,UAAU,GAAG,SAAS,CAAA;IACxC,iBAAiB,EAAE,MAAM,CAAA;IACzB,gBAAgB,EAAE,MAAM,CAAA;CACzB,
|
|
1
|
+
{"version":3,"file":"findConverterForNode.d.ts","sourceRoot":"","sources":["../../../../../src/features/converters/lexicalToHtml/shared/findConverterForNode.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAGpD,OAAO,KAAK,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAA;AAChF,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAGrE,wBAAgB,oBAAoB,CAClC,WAAW,SAAS,cAAc,GAAG,mBAAmB,EACxD,UAAU,SAAS,aAAa,GAAG,kBAAkB,EACrD,EACA,UAAU,EACV,aAAa,EACb,gBAAgB,EAChB,IAAI,EACJ,gBAAgB,GACjB,EAAE;IACD,UAAU,EAAE,WAAW,CAAA;IACvB,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,CAAA;IAClC,gBAAgB,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,CAAA;IACrC,IAAI,EAAE,qBAAqB,CAAA;IAC3B,gBAAgB,EAAE,UAAU,CAAA;CAC7B,GAAG;IACF,gBAAgB,EAAE,UAAU,GAAG,SAAS,CAAA;IACxC,iBAAiB,EAAE,MAAM,CAAA;IACzB,gBAAgB,EAAE,MAAM,CAAA;CACzB,CA6EA"}
|
|
@@ -28,18 +28,19 @@
|
|
|
28
28
|
style['text-align'] = 'center';
|
|
29
29
|
break;
|
|
30
30
|
case 'end':
|
|
31
|
-
style['text-align'] = '
|
|
31
|
+
style['text-align'] = 'end';
|
|
32
32
|
break;
|
|
33
33
|
case 'justify':
|
|
34
34
|
style['text-align'] = 'justify';
|
|
35
35
|
break;
|
|
36
36
|
case 'left':
|
|
37
|
+
style['text-align'] = 'left';
|
|
37
38
|
break;
|
|
38
39
|
case 'right':
|
|
39
40
|
style['text-align'] = 'right';
|
|
40
41
|
break;
|
|
41
42
|
case 'start':
|
|
42
|
-
style['text-align'] = '
|
|
43
|
+
style['text-align'] = 'start';
|
|
43
44
|
break;
|
|
44
45
|
}
|
|
45
46
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"findConverterForNode.js","names":["findConverterForNode","converters","disableIndent","disableTextAlign","node","unknownConverter","converterForNode","type","blocks","fields","blockType","console","error","inlineBlocks","style","Array","isArray","includes","format","indent","Number","providedCSSString","key","Object","keys","providedStyleTag","length"],"sources":["../../../../../src/features/converters/lexicalToHtml/shared/findConverterForNode.ts"],"sourcesContent":["/* eslint-disable no-console */\nimport type { SerializedLexicalNode } from 'lexical'\n\nimport type { SerializedBlockNode, SerializedInlineBlockNode } from '../../../../types/nodeTypes.js'\nimport type { HTMLConverterAsync, HTMLConvertersAsync } from '../async/types.js'\nimport type { HTMLConverter, HTMLConverters } from '../sync/types.js'\nimport type { ProvidedCSS } from './types.js'\n\nexport function findConverterForNode<\n TConverters extends HTMLConverters | HTMLConvertersAsync,\n TConverter extends HTMLConverter | HTMLConverterAsync,\n>({\n converters,\n disableIndent,\n disableTextAlign,\n node,\n unknownConverter,\n}: {\n converters: TConverters\n disableIndent?: boolean | string[]\n disableTextAlign?: boolean | string[]\n node: SerializedLexicalNode\n unknownConverter: TConverter\n}): {\n converterForNode: TConverter | undefined\n providedCSSString: string\n providedStyleTag: string\n} {\n let converterForNode: TConverter | undefined\n if (node.type === 'block') {\n converterForNode = converters?.blocks?.[\n (node as SerializedBlockNode)?.fields?.blockType\n ] as TConverter\n if (!converterForNode && !unknownConverter) {\n console.error(\n `Lexical => HTML converter: Blocks converter: found ${(node as SerializedBlockNode)?.fields?.blockType} block, but no converter is provided`,\n )\n }\n } else if (node.type === 'inlineBlock') {\n converterForNode = converters?.inlineBlocks?.[\n (node as SerializedInlineBlockNode)?.fields?.blockType\n ] as TConverter\n if (!converterForNode && !unknownConverter) {\n console.error(\n `Lexical => HTML converter: Inline Blocks converter: found ${(node as SerializedInlineBlockNode)?.fields?.blockType} inline block, but no converter is provided`,\n )\n }\n } else {\n converterForNode = converters[node.type] as TConverter\n }\n\n const style: ProvidedCSS = {}\n\n // Check if disableTextAlign is not true and does not include node type\n if (\n !disableTextAlign &&\n (!Array.isArray(disableTextAlign) || !disableTextAlign?.includes(node.type))\n ) {\n if ('format' in node && node.format) {\n switch (node.format) {\n case 'center':\n style['text-align'] = 'center'\n break\n case 'end':\n style['text-align'] = '
|
|
1
|
+
{"version":3,"file":"findConverterForNode.js","names":["findConverterForNode","converters","disableIndent","disableTextAlign","node","unknownConverter","converterForNode","type","blocks","fields","blockType","console","error","inlineBlocks","style","Array","isArray","includes","format","indent","Number","providedCSSString","key","Object","keys","providedStyleTag","length"],"sources":["../../../../../src/features/converters/lexicalToHtml/shared/findConverterForNode.ts"],"sourcesContent":["/* eslint-disable no-console */\nimport type { SerializedLexicalNode } from 'lexical'\n\nimport type { SerializedBlockNode, SerializedInlineBlockNode } from '../../../../types/nodeTypes.js'\nimport type { HTMLConverterAsync, HTMLConvertersAsync } from '../async/types.js'\nimport type { HTMLConverter, HTMLConverters } from '../sync/types.js'\nimport type { ProvidedCSS } from './types.js'\n\nexport function findConverterForNode<\n TConverters extends HTMLConverters | HTMLConvertersAsync,\n TConverter extends HTMLConverter | HTMLConverterAsync,\n>({\n converters,\n disableIndent,\n disableTextAlign,\n node,\n unknownConverter,\n}: {\n converters: TConverters\n disableIndent?: boolean | string[]\n disableTextAlign?: boolean | string[]\n node: SerializedLexicalNode\n unknownConverter: TConverter\n}): {\n converterForNode: TConverter | undefined\n providedCSSString: string\n providedStyleTag: string\n} {\n let converterForNode: TConverter | undefined\n if (node.type === 'block') {\n converterForNode = converters?.blocks?.[\n (node as SerializedBlockNode)?.fields?.blockType\n ] as TConverter\n if (!converterForNode && !unknownConverter) {\n console.error(\n `Lexical => HTML converter: Blocks converter: found ${(node as SerializedBlockNode)?.fields?.blockType} block, but no converter is provided`,\n )\n }\n } else if (node.type === 'inlineBlock') {\n converterForNode = converters?.inlineBlocks?.[\n (node as SerializedInlineBlockNode)?.fields?.blockType\n ] as TConverter\n if (!converterForNode && !unknownConverter) {\n console.error(\n `Lexical => HTML converter: Inline Blocks converter: found ${(node as SerializedInlineBlockNode)?.fields?.blockType} inline block, but no converter is provided`,\n )\n }\n } else {\n converterForNode = converters[node.type] as TConverter\n }\n\n const style: ProvidedCSS = {}\n\n // Check if disableTextAlign is not true and does not include node type\n if (\n !disableTextAlign &&\n (!Array.isArray(disableTextAlign) || !disableTextAlign?.includes(node.type))\n ) {\n if ('format' in node && node.format) {\n switch (node.format) {\n case 'center':\n style['text-align'] = 'center'\n break\n case 'end':\n style['text-align'] = 'end'\n break\n case 'justify':\n style['text-align'] = 'justify'\n break\n case 'left':\n style['text-align'] = 'left'\n break\n case 'right':\n style['text-align'] = 'right'\n break\n case 'start':\n style['text-align'] = 'start'\n break\n }\n }\n }\n\n if (!disableIndent && (!Array.isArray(disableIndent) || !disableIndent?.includes(node.type))) {\n if ('indent' in node && node.indent && node.type !== 'listitem') {\n // the unit should be px. Do not change it to rem, em, or something else.\n // The quantity should be 40px. Do not change it either.\n // See rationale in\n // https://github.com/payloadcms/payload/issues/13130#issuecomment-3058348085\n style['padding-inline-start'] = `${Number(node.indent) * 40}px`\n }\n }\n\n let providedCSSString: string = ''\n for (const key of Object.keys(style)) {\n // @ts-expect-error we're iterating over the keys of the object\n providedCSSString += `${key}: ${style[key]};`\n }\n const providedStyleTag = providedCSSString?.length ? ` style=\"${providedCSSString}\"` : ''\n\n return {\n converterForNode: converterForNode ?? unknownConverter,\n providedCSSString,\n providedStyleTag,\n }\n}\n"],"mappings":"AAAA,+BAQA,OAAO,SAASA,qBAGd;EACAC,UAAU;EACVC,aAAa;EACbC,gBAAgB;EAChBC,IAAI;EACJC;AAAgB,CAOjB;EAKC,IAAIC,gBAAA;EACJ,IAAIF,IAAA,CAAKG,IAAI,KAAK,SAAS;IACzBD,gBAAA,GAAmBL,UAAA,EAAYO,MAAA,GAC5BJ,IAAA,EAA8BK,MAAA,EAAQC,SAAA,CACxC;IACD,IAAI,CAACJ,gBAAA,IAAoB,CAACD,gBAAA,EAAkB;MAC1CM,OAAA,CAAQC,KAAK,CACX,sDAAuDR,IAAA,EAA8BK,MAAA,EAAQC,SAAA,sCAA+C;IAEhJ;EACF,OAAO,IAAIN,IAAA,CAAKG,IAAI,KAAK,eAAe;IACtCD,gBAAA,GAAmBL,UAAA,EAAYY,YAAA,GAC5BT,IAAA,EAAoCK,MAAA,EAAQC,SAAA,CAC9C;IACD,IAAI,CAACJ,gBAAA,IAAoB,CAACD,gBAAA,EAAkB;MAC1CM,OAAA,CAAQC,KAAK,CACX,6DAA8DR,IAAA,EAAoCK,MAAA,EAAQC,SAAA,6CAAsD;IAEpK;EACF,OAAO;IACLJ,gBAAA,GAAmBL,UAAU,CAACG,IAAA,CAAKG,IAAI,CAAC;EAC1C;EAEA,MAAMO,KAAA,GAAqB,CAAC;EAE5B;EACA,IACE,CAACX,gBAAA,KACA,CAACY,KAAA,CAAMC,OAAO,CAACb,gBAAA,KAAqB,CAACA,gBAAA,EAAkBc,QAAA,CAASb,IAAA,CAAKG,IAAI,IAC1E;IACA,IAAI,YAAYH,IAAA,IAAQA,IAAA,CAAKc,MAAM,EAAE;MACnC,QAAQd,IAAA,CAAKc,MAAM;QACjB,KAAK;UACHJ,KAAK,CAAC,aAAa,GAAG;UACtB;QACF,KAAK;UACHA,KAAK,CAAC,aAAa,GAAG;UACtB;QACF,KAAK;UACHA,KAAK,CAAC,aAAa,GAAG;UACtB;QACF,KAAK;UACHA,KAAK,CAAC,aAAa,GAAG;UACtB;QACF,KAAK;UACHA,KAAK,CAAC,aAAa,GAAG;UACtB;QACF,KAAK;UACHA,KAAK,CAAC,aAAa,GAAG;UACtB;MACJ;IACF;EACF;EAEA,IAAI,CAACZ,aAAA,KAAkB,CAACa,KAAA,CAAMC,OAAO,CAACd,aAAA,KAAkB,CAACA,aAAA,EAAee,QAAA,CAASb,IAAA,CAAKG,IAAI,IAAI;IAC5F,IAAI,YAAYH,IAAA,IAAQA,IAAA,CAAKe,MAAM,IAAIf,IAAA,CAAKG,IAAI,KAAK,YAAY;MAC/D;MACA;MACA;MACA;MACAO,KAAK,CAAC,uBAAuB,GAAG,GAAGM,MAAA,CAAOhB,IAAA,CAAKe,MAAM,IAAI,MAAM;IACjE;EACF;EAEA,IAAIE,iBAAA,GAA4B;EAChC,KAAK,MAAMC,GAAA,IAAOC,MAAA,CAAOC,IAAI,CAACV,KAAA,GAAQ;IACpC;IACAO,iBAAA,IAAqB,GAAGC,GAAA,KAAQR,KAAK,CAACQ,GAAA,CAAI,GAAG;EAC/C;EACA,MAAMG,gBAAA,GAAmBJ,iBAAA,EAAmBK,MAAA,GAAS,WAAWL,iBAAA,GAAoB,GAAG;EAEvF,OAAO;IACLf,gBAAA,EAAkBA,gBAAA,IAAoBD,gBAAA;IACtCgB,iBAAA;IACAI;EACF;AACF","ignoreList":[]}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
import { describe, expect, it } from 'vitest';
|
|
2
|
+
import { convertLexicalToHTML } from './index.js';
|
|
3
|
+
function textNode(text) {
|
|
4
|
+
return {
|
|
5
|
+
type: 'text',
|
|
6
|
+
detail: 0,
|
|
7
|
+
format: 0,
|
|
8
|
+
mode: 'normal',
|
|
9
|
+
style: '',
|
|
10
|
+
text,
|
|
11
|
+
version: 1
|
|
12
|
+
};
|
|
13
|
+
}
|
|
14
|
+
function paragraphNode({
|
|
15
|
+
direction = null,
|
|
16
|
+
format
|
|
17
|
+
}) {
|
|
18
|
+
return {
|
|
19
|
+
type: 'paragraph',
|
|
20
|
+
children: [textNode('مرحبا')],
|
|
21
|
+
direction,
|
|
22
|
+
format,
|
|
23
|
+
indent: 0,
|
|
24
|
+
textFormat: 0,
|
|
25
|
+
version: 1
|
|
26
|
+
};
|
|
27
|
+
}
|
|
28
|
+
function rootNode(paragraph) {
|
|
29
|
+
return {
|
|
30
|
+
root: {
|
|
31
|
+
type: 'root',
|
|
32
|
+
children: [paragraph],
|
|
33
|
+
direction: null,
|
|
34
|
+
format: '',
|
|
35
|
+
indent: 0,
|
|
36
|
+
version: 1
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
}
|
|
40
|
+
describe('convertLexicalToHTML - paragraph alignment', () => {
|
|
41
|
+
it('preserves logical alignment for format: start', () => {
|
|
42
|
+
const html = convertLexicalToHTML({
|
|
43
|
+
data: rootNode(paragraphNode({
|
|
44
|
+
format: 'start'
|
|
45
|
+
})),
|
|
46
|
+
disableContainer: true
|
|
47
|
+
});
|
|
48
|
+
expect(html).toBe('<p style="text-align: start;">مرحبا</p>');
|
|
49
|
+
});
|
|
50
|
+
it('preserves logical alignment for format: end', () => {
|
|
51
|
+
const html = convertLexicalToHTML({
|
|
52
|
+
data: rootNode(paragraphNode({
|
|
53
|
+
format: 'end'
|
|
54
|
+
})),
|
|
55
|
+
disableContainer: true
|
|
56
|
+
});
|
|
57
|
+
expect(html).toBe('<p style="text-align: end;">مرحبا</p>');
|
|
58
|
+
});
|
|
59
|
+
it('emits text-align for explicit format: left', () => {
|
|
60
|
+
const html = convertLexicalToHTML({
|
|
61
|
+
data: rootNode(paragraphNode({
|
|
62
|
+
format: 'left'
|
|
63
|
+
})),
|
|
64
|
+
disableContainer: true
|
|
65
|
+
});
|
|
66
|
+
expect(html).toBe('<p style="text-align: left;">مرحبا</p>');
|
|
67
|
+
});
|
|
68
|
+
it('emits text-align for explicit format: right', () => {
|
|
69
|
+
const html = convertLexicalToHTML({
|
|
70
|
+
data: rootNode(paragraphNode({
|
|
71
|
+
format: 'right'
|
|
72
|
+
})),
|
|
73
|
+
disableContainer: true
|
|
74
|
+
});
|
|
75
|
+
expect(html).toBe('<p style="text-align: right;">مرحبا</p>');
|
|
76
|
+
});
|
|
77
|
+
it('preserves logical alignment start for RTL-directed paragraphs', () => {
|
|
78
|
+
const html = convertLexicalToHTML({
|
|
79
|
+
data: rootNode(paragraphNode({
|
|
80
|
+
direction: 'rtl',
|
|
81
|
+
format: 'start'
|
|
82
|
+
})),
|
|
83
|
+
disableContainer: true
|
|
84
|
+
});
|
|
85
|
+
// For RTL content, `start` must NOT be resolved to `left` - it must stay logical
|
|
86
|
+
// (or resolve to `right`, its physical RTL equivalent), otherwise the paragraph
|
|
87
|
+
// renders visually misaligned against the text's own reading direction.
|
|
88
|
+
expect(html).not.toBe('<p style="text-align: left;">مرحبا</p>');
|
|
89
|
+
expect(html).toBe('<p style="text-align: start;">مرحبا</p>');
|
|
90
|
+
});
|
|
91
|
+
});
|
|
92
|
+
//# sourceMappingURL=alignment.spec.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alignment.spec.js","names":["describe","expect","it","convertLexicalToHTML","textNode","text","type","detail","format","mode","style","version","paragraphNode","direction","children","indent","textFormat","rootNode","paragraph","root","html","data","disableContainer","toBe","not"],"sources":["../../../../../src/features/converters/lexicalToHtml/sync/alignment.spec.ts"],"sourcesContent":["import { describe, expect, it } from 'vitest'\nimport type {\n DefaultTypedEditorState,\n LexicalElementDirection,\n LexicalElementFormat,\n SerializedParagraphNode,\n SerializedTextNode,\n} from '../../../../types/nodeTypes.js'\n\nimport { convertLexicalToHTML } from './index.js'\n\nfunction textNode(text: string): SerializedTextNode {\n return {\n type: 'text',\n detail: 0,\n format: 0,\n mode: 'normal',\n style: '',\n text,\n version: 1,\n }\n}\n\nfunction paragraphNode({\n direction = null,\n format,\n}: {\n direction?: LexicalElementDirection\n format: LexicalElementFormat\n}): SerializedParagraphNode {\n return {\n type: 'paragraph',\n children: [textNode('مرحبا')],\n direction,\n format,\n indent: 0,\n textFormat: 0,\n version: 1,\n }\n}\n\nfunction rootNode(paragraph: SerializedParagraphNode): DefaultTypedEditorState {\n return {\n root: {\n type: 'root',\n children: [paragraph],\n direction: null,\n format: '',\n indent: 0,\n version: 1,\n },\n }\n}\n\ndescribe('convertLexicalToHTML - paragraph alignment', () => {\n it('preserves logical alignment for format: start', () => {\n const html = convertLexicalToHTML({\n data: rootNode(paragraphNode({ format: 'start' })),\n disableContainer: true,\n })\n\n expect(html).toBe('<p style=\"text-align: start;\">مرحبا</p>')\n })\n\n it('preserves logical alignment for format: end', () => {\n const html = convertLexicalToHTML({\n data: rootNode(paragraphNode({ format: 'end' })),\n disableContainer: true,\n })\n\n expect(html).toBe('<p style=\"text-align: end;\">مرحبا</p>')\n })\n\n it('emits text-align for explicit format: left', () => {\n const html = convertLexicalToHTML({\n data: rootNode(paragraphNode({ format: 'left' })),\n disableContainer: true,\n })\n\n expect(html).toBe('<p style=\"text-align: left;\">مرحبا</p>')\n })\n\n it('emits text-align for explicit format: right', () => {\n const html = convertLexicalToHTML({\n data: rootNode(paragraphNode({ format: 'right' })),\n disableContainer: true,\n })\n\n expect(html).toBe('<p style=\"text-align: right;\">مرحبا</p>')\n })\n\n it('preserves logical alignment start for RTL-directed paragraphs', () => {\n const html = convertLexicalToHTML({\n data: rootNode(paragraphNode({ direction: 'rtl', format: 'start' })),\n disableContainer: true,\n })\n\n // For RTL content, `start` must NOT be resolved to `left` - it must stay logical\n // (or resolve to `right`, its physical RTL equivalent), otherwise the paragraph\n // renders visually misaligned against the text's own reading direction.\n expect(html).not.toBe('<p style=\"text-align: left;\">مرحبا</p>')\n expect(html).toBe('<p style=\"text-align: start;\">مرحبا</p>')\n })\n})\n"],"mappings":"AAAA,SAASA,QAAQ,EAAEC,MAAM,EAAEC,EAAE,QAAQ;AASrC,SAASC,oBAAoB,QAAQ;AAErC,SAASC,SAASC,IAAY;EAC5B,OAAO;IACLC,IAAA,EAAM;IACNC,MAAA,EAAQ;IACRC,MAAA,EAAQ;IACRC,IAAA,EAAM;IACNC,KAAA,EAAO;IACPL,IAAA;IACAM,OAAA,EAAS;EACX;AACF;AAEA,SAASC,cAAc;EACrBC,SAAA,GAAY,IAAI;EAChBL;AAAM,CAIP;EACC,OAAO;IACLF,IAAA,EAAM;IACNQ,QAAA,EAAU,CAACV,QAAA,CAAS,SAAS;IAC7BS,SAAA;IACAL,MAAA;IACAO,MAAA,EAAQ;IACRC,UAAA,EAAY;IACZL,OAAA,EAAS;EACX;AACF;AAEA,SAASM,SAASC,SAAkC;EAClD,OAAO;IACLC,IAAA,EAAM;MACJb,IAAA,EAAM;MACNQ,QAAA,EAAU,CAACI,SAAA,CAAU;MACrBL,SAAA,EAAW;MACXL,MAAA,EAAQ;MACRO,MAAA,EAAQ;MACRJ,OAAA,EAAS;IACX;EACF;AACF;AAEAX,QAAA,CAAS,8CAA8C;EACrDE,EAAA,CAAG,iDAAiD;IAClD,MAAMkB,IAAA,GAAOjB,oBAAA,CAAqB;MAChCkB,IAAA,EAAMJ,QAAA,CAASL,aAAA,CAAc;QAAEJ,MAAA,EAAQ;MAAQ;MAC/Cc,gBAAA,EAAkB;IACpB;IAEArB,MAAA,CAAOmB,IAAA,EAAMG,IAAI,CAAC;EACpB;EAEArB,EAAA,CAAG,+CAA+C;IAChD,MAAMkB,IAAA,GAAOjB,oBAAA,CAAqB;MAChCkB,IAAA,EAAMJ,QAAA,CAASL,aAAA,CAAc;QAAEJ,MAAA,EAAQ;MAAM;MAC7Cc,gBAAA,EAAkB;IACpB;IAEArB,MAAA,CAAOmB,IAAA,EAAMG,IAAI,CAAC;EACpB;EAEArB,EAAA,CAAG,8CAA8C;IAC/C,MAAMkB,IAAA,GAAOjB,oBAAA,CAAqB;MAChCkB,IAAA,EAAMJ,QAAA,CAASL,aAAA,CAAc;QAAEJ,MAAA,EAAQ;MAAO;MAC9Cc,gBAAA,EAAkB;IACpB;IAEArB,MAAA,CAAOmB,IAAA,EAAMG,IAAI,CAAC;EACpB;EAEArB,EAAA,CAAG,+CAA+C;IAChD,MAAMkB,IAAA,GAAOjB,oBAAA,CAAqB;MAChCkB,IAAA,EAAMJ,QAAA,CAASL,aAAA,CAAc;QAAEJ,MAAA,EAAQ;MAAQ;MAC/Cc,gBAAA,EAAkB;IACpB;IAEArB,MAAA,CAAOmB,IAAA,EAAMG,IAAI,CAAC;EACpB;EAEArB,EAAA,CAAG,iEAAiE;IAClE,MAAMkB,IAAA,GAAOjB,oBAAA,CAAqB;MAChCkB,IAAA,EAAMJ,QAAA,CAASL,aAAA,CAAc;QAAEC,SAAA,EAAW;QAAOL,MAAA,EAAQ;MAAQ;MACjEc,gBAAA,EAAkB;IACpB;IAEA;IACA;IACA;IACArB,MAAA,CAAOmB,IAAA,EAAMI,GAAG,CAACD,IAAI,CAAC;IACtBtB,MAAA,CAAOmB,IAAA,EAAMG,IAAI,CAAC;EACpB;AACF","ignoreList":[]}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export declare function getHorizontalScrollDelta({ clientWidth, deltaMode, deltaY, isRightToLeft, }: {
|
|
2
|
+
clientWidth: number;
|
|
3
|
+
deltaMode: number;
|
|
4
|
+
deltaY: number;
|
|
5
|
+
isRightToLeft: boolean;
|
|
6
|
+
}): number;
|
|
7
|
+
export declare function useRedirectVerticalWheelToHorizontalScroll(): void;
|
|
8
|
+
//# sourceMappingURL=horizontalWheelScroll.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"horizontalWheelScroll.d.ts","sourceRoot":"","sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/horizontalWheelScroll.ts"],"names":[],"mappings":"AASA,wBAAgB,wBAAwB,CAAC,EACvC,WAAW,EACX,SAAS,EACT,MAAM,EACN,aAAa,GACd,EAAE;IACD,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,MAAM,CAAA;IACd,aAAa,EAAE,OAAO,CAAA;CACvB,GAAG,MAAM,CAOT;AA0CD,wBAAgB,0CAA0C,IAAI,IAAI,CAgBjE"}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { c as _c } from "react/compiler-runtime";
|
|
4
|
+
import { useEffect } from 'react';
|
|
5
|
+
const scrollContainerSelector = '.fixed-toolbar__scroll';
|
|
6
|
+
// A single notch on a classic (non-trackpad) wheel mouse reports deltaMode 1 with a
|
|
7
|
+
// deltaY of only 1-3, so it must be scaled up to a pixel value that actually moves the scroll.
|
|
8
|
+
const PIXELS_PER_LINE = 40;
|
|
9
|
+
export function getHorizontalScrollDelta({
|
|
10
|
+
clientWidth,
|
|
11
|
+
deltaMode,
|
|
12
|
+
deltaY,
|
|
13
|
+
isRightToLeft
|
|
14
|
+
}) {
|
|
15
|
+
const deltaInPixels = deltaMode === 1 ? deltaY * PIXELS_PER_LINE : deltaMode === 2 ? deltaY * clientWidth : deltaY;
|
|
16
|
+
// scrollLeft moves toward the inline-start edge for a given positive delta in RTL,
|
|
17
|
+
// the opposite of LTR, so the delta must be negated to keep the scroll direction consistent.
|
|
18
|
+
return isRightToLeft ? -deltaInPixels : deltaInPixels;
|
|
19
|
+
}
|
|
20
|
+
function redirectVerticalWheelToHorizontalScroll(event) {
|
|
21
|
+
const isPrimarilyVerticalWheelInput = Math.abs(event.deltaY) > Math.abs(event.deltaX);
|
|
22
|
+
if (!isPrimarilyVerticalWheelInput) {
|
|
23
|
+
return;
|
|
24
|
+
}
|
|
25
|
+
const target = event.target;
|
|
26
|
+
if (!(target instanceof Element)) {
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
const scrollContainer = target.closest(scrollContainerSelector);
|
|
30
|
+
if (!scrollContainer) {
|
|
31
|
+
return;
|
|
32
|
+
}
|
|
33
|
+
const canScrollHorizontally = scrollContainer.scrollWidth > scrollContainer.clientWidth;
|
|
34
|
+
if (!canScrollHorizontally) {
|
|
35
|
+
return;
|
|
36
|
+
}
|
|
37
|
+
event.preventDefault();
|
|
38
|
+
scrollContainer.scrollLeft += getHorizontalScrollDelta({
|
|
39
|
+
clientWidth: scrollContainer.clientWidth,
|
|
40
|
+
deltaMode: event.deltaMode,
|
|
41
|
+
deltaY: event.deltaY,
|
|
42
|
+
isRightToLeft: getComputedStyle(scrollContainer).direction === 'rtl'
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
// A single page can render many fixed toolbars at once (e.g. rich text nested several
|
|
46
|
+
// layers deep inside blocks), so this listener is delegated to `document` and shared
|
|
47
|
+
// across every toolbar instance instead of being attached per instance. A wheel listener
|
|
48
|
+
// that can call preventDefault() must be non-passive, and non-passive listeners make the
|
|
49
|
+
// browser treat their element as a "non-fast-scrollable region" that every scroll gesture
|
|
50
|
+
// on the page has to be checked against, even ones nowhere near it. Attaching one instance
|
|
51
|
+
// per toolbar would multiply that bookkeeping by however many toolbars happen to be on the
|
|
52
|
+
// page; a single delegated listener keeps that cost constant no matter how many there are.
|
|
53
|
+
let toolbarsListeningForWheelEvents = 0;
|
|
54
|
+
export function useRedirectVerticalWheelToHorizontalScroll() {
|
|
55
|
+
const $ = _c(1);
|
|
56
|
+
let t0;
|
|
57
|
+
if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
|
|
58
|
+
t0 = [];
|
|
59
|
+
$[0] = t0;
|
|
60
|
+
} else {
|
|
61
|
+
t0 = $[0];
|
|
62
|
+
}
|
|
63
|
+
useEffect(_temp2, t0);
|
|
64
|
+
}
|
|
65
|
+
function _temp2() {
|
|
66
|
+
if (toolbarsListeningForWheelEvents === 0) {
|
|
67
|
+
document.addEventListener("wheel", redirectVerticalWheelToHorizontalScroll, {
|
|
68
|
+
passive: false
|
|
69
|
+
});
|
|
70
|
+
}
|
|
71
|
+
toolbarsListeningForWheelEvents = toolbarsListeningForWheelEvents + 1;
|
|
72
|
+
return _temp;
|
|
73
|
+
}
|
|
74
|
+
function _temp() {
|
|
75
|
+
toolbarsListeningForWheelEvents = toolbarsListeningForWheelEvents - 1;
|
|
76
|
+
if (toolbarsListeningForWheelEvents === 0) {
|
|
77
|
+
document.removeEventListener("wheel", redirectVerticalWheelToHorizontalScroll);
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
//# sourceMappingURL=horizontalWheelScroll.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"horizontalWheelScroll.js","names":["c","_c","useEffect","scrollContainerSelector","PIXELS_PER_LINE","getHorizontalScrollDelta","clientWidth","deltaMode","deltaY","isRightToLeft","deltaInPixels","redirectVerticalWheelToHorizontalScroll","event","isPrimarilyVerticalWheelInput","Math","abs","deltaX","target","Element","scrollContainer","closest","canScrollHorizontally","scrollWidth","preventDefault","scrollLeft","getComputedStyle","direction","toolbarsListeningForWheelEvents","useRedirectVerticalWheelToHorizontalScroll","$","t0","Symbol","for","_temp2","document","addEventListener","passive","_temp","removeEventListener"],"sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/horizontalWheelScroll.ts"],"sourcesContent":["'use client'\nimport { useEffect } from 'react'\n\nconst scrollContainerSelector = '.fixed-toolbar__scroll'\n\n// A single notch on a classic (non-trackpad) wheel mouse reports deltaMode 1 with a\n// deltaY of only 1-3, so it must be scaled up to a pixel value that actually moves the scroll.\nconst PIXELS_PER_LINE = 40\n\nexport function getHorizontalScrollDelta({\n clientWidth,\n deltaMode,\n deltaY,\n isRightToLeft,\n}: {\n clientWidth: number\n deltaMode: number\n deltaY: number\n isRightToLeft: boolean\n}): number {\n const deltaInPixels =\n deltaMode === 1 ? deltaY * PIXELS_PER_LINE : deltaMode === 2 ? deltaY * clientWidth : deltaY\n\n // scrollLeft moves toward the inline-start edge for a given positive delta in RTL,\n // the opposite of LTR, so the delta must be negated to keep the scroll direction consistent.\n return isRightToLeft ? -deltaInPixels : deltaInPixels\n}\n\nfunction redirectVerticalWheelToHorizontalScroll(event: WheelEvent): void {\n const isPrimarilyVerticalWheelInput = Math.abs(event.deltaY) > Math.abs(event.deltaX)\n if (!isPrimarilyVerticalWheelInput) {\n return\n }\n\n const target = event.target\n if (!(target instanceof Element)) {\n return\n }\n\n const scrollContainer = target.closest<HTMLElement>(scrollContainerSelector)\n if (!scrollContainer) {\n return\n }\n\n const canScrollHorizontally = scrollContainer.scrollWidth > scrollContainer.clientWidth\n if (!canScrollHorizontally) {\n return\n }\n\n event.preventDefault()\n scrollContainer.scrollLeft += getHorizontalScrollDelta({\n clientWidth: scrollContainer.clientWidth,\n deltaMode: event.deltaMode,\n deltaY: event.deltaY,\n isRightToLeft: getComputedStyle(scrollContainer).direction === 'rtl',\n })\n}\n\n// A single page can render many fixed toolbars at once (e.g. rich text nested several\n// layers deep inside blocks), so this listener is delegated to `document` and shared\n// across every toolbar instance instead of being attached per instance. A wheel listener\n// that can call preventDefault() must be non-passive, and non-passive listeners make the\n// browser treat their element as a \"non-fast-scrollable region\" that every scroll gesture\n// on the page has to be checked against, even ones nowhere near it. Attaching one instance\n// per toolbar would multiply that bookkeeping by however many toolbars happen to be on the\n// page; a single delegated listener keeps that cost constant no matter how many there are.\nlet toolbarsListeningForWheelEvents = 0\n\nexport function useRedirectVerticalWheelToHorizontalScroll(): void {\n useEffect(() => {\n if (toolbarsListeningForWheelEvents === 0) {\n document.addEventListener('wheel', redirectVerticalWheelToHorizontalScroll, {\n passive: false,\n })\n }\n toolbarsListeningForWheelEvents += 1\n\n return () => {\n toolbarsListeningForWheelEvents -= 1\n if (toolbarsListeningForWheelEvents === 0) {\n document.removeEventListener('wheel', redirectVerticalWheelToHorizontalScroll)\n }\n }\n }, [])\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;AACA,SAASC,SAAS,QAAQ;AAE1B,MAAMC,uBAAA,GAA0B;AAEhC;AACA;AACA,MAAMC,eAAA,GAAkB;AAExB,OAAO,SAASC,yBAAyB;EACvCC,WAAW;EACXC,SAAS;EACTC,MAAM;EACNC;AAAa,CAMd;EACC,MAAMC,aAAA,GACJH,SAAA,KAAc,IAAIC,MAAA,GAASJ,eAAA,GAAkBG,SAAA,KAAc,IAAIC,MAAA,GAASF,WAAA,GAAcE,MAAA;EAExF;EACA;EACA,OAAOC,aAAA,GAAgB,CAACC,aAAA,GAAgBA,aAAA;AAC1C;AAEA,SAASC,wCAAwCC,KAAiB;EAChE,MAAMC,6BAAA,GAAgCC,IAAA,CAAKC,GAAG,CAACH,KAAA,CAAMJ,MAAM,IAAIM,IAAA,CAAKC,GAAG,CAACH,KAAA,CAAMI,MAAM;EACpF,IAAI,CAACH,6BAAA,EAA+B;IAClC;EACF;EAEA,MAAMI,MAAA,GAASL,KAAA,CAAMK,MAAM;EAC3B,IAAI,EAAEA,MAAA,YAAkBC,OAAM,GAAI;IAChC;EACF;EAEA,MAAMC,eAAA,GAAkBF,MAAA,CAAOG,OAAO,CAAcjB,uBAAA;EACpD,IAAI,CAACgB,eAAA,EAAiB;IACpB;EACF;EAEA,MAAME,qBAAA,GAAwBF,eAAA,CAAgBG,WAAW,GAAGH,eAAA,CAAgBb,WAAW;EACvF,IAAI,CAACe,qBAAA,EAAuB;IAC1B;EACF;EAEAT,KAAA,CAAMW,cAAc;EACpBJ,eAAA,CAAgBK,UAAU,IAAInB,wBAAA,CAAyB;IACrDC,WAAA,EAAaa,eAAA,CAAgBb,WAAW;IACxCC,SAAA,EAAWK,KAAA,CAAML,SAAS;IAC1BC,MAAA,EAAQI,KAAA,CAAMJ,MAAM;IACpBC,aAAA,EAAegB,gBAAA,CAAiBN,eAAA,EAAiBO,SAAS,KAAK;EACjE;AACF;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIC,+BAAA,GAAkC;AAEtC,OAAO,SAAAC,2CAAA;EAAA,MAAAC,CAAA,GAAA5B,EAAA;EAAA,IAAA6B,EAAA;EAAA,IAAAD,CAAA,QAAAE,MAAA,CAAAC,GAAA;IAeFF,EAAA;IAAED,CAAA,MAAAC,EAAA;EAAA;IAAAA,EAAA,GAAAD,CAAA;EAAA;EAdL3B,SAAA,CAAA+B,MAAA,EAcGH,EAAE;AAAA;AAfA,SAAAG,OAAA;EAAA,IAECN,+BAAA,MAAoC;IACtCO,QAAA,CAAAC,gBAAA,CAA0B,SAAAxB,uCAAA;MAAAyB,OAAA;IAAA,CAE1B;EAAA;EAAAT,+BAAA,GAEFA,+BAAA,IAAmC;EAAA,OAAAU,KAAA;AAAA;AAPhC,SAAAA,MAAA;EAAAV,+BAAA,GAUDA,+BAAA,IAAmC;EAAA,IAC/BA,+BAAA,MAAoC;IACtCO,QAAA,CAAAI,mBAAA,CAA6B,SAAA3B,uCAAS;EAAA;AAAA","ignoreList":[]}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { describe, expect, it } from 'vitest';
|
|
2
|
+
import { getHorizontalScrollDelta } from './horizontalWheelScroll.js';
|
|
3
|
+
describe('getHorizontalScrollDelta', () => {
|
|
4
|
+
describe('deltaMode 0 (pixel)', () => {
|
|
5
|
+
it('should pass deltaY through unchanged for LTR', () => {
|
|
6
|
+
const delta = getHorizontalScrollDelta({
|
|
7
|
+
clientWidth: 300,
|
|
8
|
+
deltaMode: 0,
|
|
9
|
+
deltaY: 15,
|
|
10
|
+
isRightToLeft: false
|
|
11
|
+
});
|
|
12
|
+
expect(delta).toBe(15);
|
|
13
|
+
});
|
|
14
|
+
it('should negate deltaY for RTL', () => {
|
|
15
|
+
const delta = getHorizontalScrollDelta({
|
|
16
|
+
clientWidth: 300,
|
|
17
|
+
deltaMode: 0,
|
|
18
|
+
deltaY: 15,
|
|
19
|
+
isRightToLeft: true
|
|
20
|
+
});
|
|
21
|
+
expect(delta).toBe(-15);
|
|
22
|
+
});
|
|
23
|
+
});
|
|
24
|
+
describe('deltaMode 1 (line)', () => {
|
|
25
|
+
it('should scale deltaY by the pixels-per-line factor for LTR', () => {
|
|
26
|
+
const delta = getHorizontalScrollDelta({
|
|
27
|
+
clientWidth: 300,
|
|
28
|
+
deltaMode: 1,
|
|
29
|
+
deltaY: 3,
|
|
30
|
+
isRightToLeft: false
|
|
31
|
+
});
|
|
32
|
+
expect(delta).toBe(120);
|
|
33
|
+
});
|
|
34
|
+
it('should scale and negate deltaY for RTL', () => {
|
|
35
|
+
const delta = getHorizontalScrollDelta({
|
|
36
|
+
clientWidth: 300,
|
|
37
|
+
deltaMode: 1,
|
|
38
|
+
deltaY: 3,
|
|
39
|
+
isRightToLeft: true
|
|
40
|
+
});
|
|
41
|
+
expect(delta).toBe(-120);
|
|
42
|
+
});
|
|
43
|
+
});
|
|
44
|
+
describe('deltaMode 2 (page)', () => {
|
|
45
|
+
it('should scale deltaY by the scroll container width for LTR', () => {
|
|
46
|
+
const delta = getHorizontalScrollDelta({
|
|
47
|
+
clientWidth: 300,
|
|
48
|
+
deltaMode: 2,
|
|
49
|
+
deltaY: 2,
|
|
50
|
+
isRightToLeft: false
|
|
51
|
+
});
|
|
52
|
+
expect(delta).toBe(600);
|
|
53
|
+
});
|
|
54
|
+
it('should scale and negate deltaY for RTL', () => {
|
|
55
|
+
const delta = getHorizontalScrollDelta({
|
|
56
|
+
clientWidth: 300,
|
|
57
|
+
deltaMode: 2,
|
|
58
|
+
deltaY: 2,
|
|
59
|
+
isRightToLeft: true
|
|
60
|
+
});
|
|
61
|
+
expect(delta).toBe(-600);
|
|
62
|
+
});
|
|
63
|
+
});
|
|
64
|
+
});
|
|
65
|
+
//# sourceMappingURL=horizontalWheelScroll.spec.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"horizontalWheelScroll.spec.js","names":["describe","expect","it","getHorizontalScrollDelta","delta","clientWidth","deltaMode","deltaY","isRightToLeft","toBe"],"sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/horizontalWheelScroll.spec.ts"],"sourcesContent":["import { describe, expect, it } from 'vitest'\n\nimport { getHorizontalScrollDelta } from './horizontalWheelScroll.js'\n\ndescribe('getHorizontalScrollDelta', () => {\n describe('deltaMode 0 (pixel)', () => {\n it('should pass deltaY through unchanged for LTR', () => {\n const delta = getHorizontalScrollDelta({\n clientWidth: 300,\n deltaMode: 0,\n deltaY: 15,\n isRightToLeft: false,\n })\n\n expect(delta).toBe(15)\n })\n\n it('should negate deltaY for RTL', () => {\n const delta = getHorizontalScrollDelta({\n clientWidth: 300,\n deltaMode: 0,\n deltaY: 15,\n isRightToLeft: true,\n })\n\n expect(delta).toBe(-15)\n })\n })\n\n describe('deltaMode 1 (line)', () => {\n it('should scale deltaY by the pixels-per-line factor for LTR', () => {\n const delta = getHorizontalScrollDelta({\n clientWidth: 300,\n deltaMode: 1,\n deltaY: 3,\n isRightToLeft: false,\n })\n\n expect(delta).toBe(120)\n })\n\n it('should scale and negate deltaY for RTL', () => {\n const delta = getHorizontalScrollDelta({\n clientWidth: 300,\n deltaMode: 1,\n deltaY: 3,\n isRightToLeft: true,\n })\n\n expect(delta).toBe(-120)\n })\n })\n\n describe('deltaMode 2 (page)', () => {\n it('should scale deltaY by the scroll container width for LTR', () => {\n const delta = getHorizontalScrollDelta({\n clientWidth: 300,\n deltaMode: 2,\n deltaY: 2,\n isRightToLeft: false,\n })\n\n expect(delta).toBe(600)\n })\n\n it('should scale and negate deltaY for RTL', () => {\n const delta = getHorizontalScrollDelta({\n clientWidth: 300,\n deltaMode: 2,\n deltaY: 2,\n isRightToLeft: true,\n })\n\n expect(delta).toBe(-600)\n })\n })\n})\n"],"mappings":"AAAA,SAASA,QAAQ,EAAEC,MAAM,EAAEC,EAAE,QAAQ;AAErC,SAASC,wBAAwB,QAAQ;AAEzCH,QAAA,CAAS,4BAA4B;EACnCA,QAAA,CAAS,uBAAuB;IAC9BE,EAAA,CAAG,gDAAgD;MACjD,MAAME,KAAA,GAAQD,wBAAA,CAAyB;QACrCE,WAAA,EAAa;QACbC,SAAA,EAAW;QACXC,MAAA,EAAQ;QACRC,aAAA,EAAe;MACjB;MAEAP,MAAA,CAAOG,KAAA,EAAOK,IAAI,CAAC;IACrB;IAEAP,EAAA,CAAG,gCAAgC;MACjC,MAAME,KAAA,GAAQD,wBAAA,CAAyB;QACrCE,WAAA,EAAa;QACbC,SAAA,EAAW;QACXC,MAAA,EAAQ;QACRC,aAAA,EAAe;MACjB;MAEAP,MAAA,CAAOG,KAAA,EAAOK,IAAI,CAAC,CAAC;IACtB;EACF;EAEAT,QAAA,CAAS,sBAAsB;IAC7BE,EAAA,CAAG,6DAA6D;MAC9D,MAAME,KAAA,GAAQD,wBAAA,CAAyB;QACrCE,WAAA,EAAa;QACbC,SAAA,EAAW;QACXC,MAAA,EAAQ;QACRC,aAAA,EAAe;MACjB;MAEAP,MAAA,CAAOG,KAAA,EAAOK,IAAI,CAAC;IACrB;IAEAP,EAAA,CAAG,0CAA0C;MAC3C,MAAME,KAAA,GAAQD,wBAAA,CAAyB;QACrCE,WAAA,EAAa;QACbC,SAAA,EAAW;QACXC,MAAA,EAAQ;QACRC,aAAA,EAAe;MACjB;MAEAP,MAAA,CAAOG,KAAA,EAAOK,IAAI,CAAC,CAAC;IACtB;EACF;EAEAT,QAAA,CAAS,sBAAsB;IAC7BE,EAAA,CAAG,6DAA6D;MAC9D,MAAME,KAAA,GAAQD,wBAAA,CAAyB;QACrCE,WAAA,EAAa;QACbC,SAAA,EAAW;QACXC,MAAA,EAAQ;QACRC,aAAA,EAAe;MACjB;MAEAP,MAAA,CAAOG,KAAA,EAAOK,IAAI,CAAC;IACrB;IAEAP,EAAA,CAAG,0CAA0C;MAC3C,MAAME,KAAA,GAAQD,wBAAA,CAAyB;QACrCE,WAAA,EAAa;QACbC,SAAA,EAAW;QACXC,MAAA,EAAQ;QACRC,aAAA,EAAe;MACjB;MAEAP,MAAA,CAAOG,KAAA,EAAOK,IAAI,CAAC,CAAC;IACtB;EACF;AACF","ignoreList":[]}
|
|
@@ -1,3 +1,37 @@
|
|
|
1
|
+
@property --fixed-toolbar-fade-start {
|
|
2
|
+
syntax: '<length>';
|
|
3
|
+
inherits: false;
|
|
4
|
+
initial-value: 0px;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
@property --fixed-toolbar-fade-end {
|
|
8
|
+
syntax: '<length>';
|
|
9
|
+
inherits: false;
|
|
10
|
+
initial-value: 0px;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
/*
|
|
14
|
+
* Drives the fade widths off the toolbar's own scroll position: fully opaque at rest,
|
|
15
|
+
* fading in on whichever edge still has scrolled-off content once it overflows.
|
|
16
|
+
* Unsupported browsers (no animation-timeline) simply keep the initial 0px fade, i.e. no fade at all.
|
|
17
|
+
*/
|
|
18
|
+
@keyframes fixed-toolbar-scroll-fade {
|
|
19
|
+
0% {
|
|
20
|
+
--fixed-toolbar-fade-start: 0px;
|
|
21
|
+
}
|
|
22
|
+
10%,
|
|
23
|
+
100% {
|
|
24
|
+
--fixed-toolbar-fade-start: var(--spacer-5);
|
|
25
|
+
}
|
|
26
|
+
0%,
|
|
27
|
+
90% {
|
|
28
|
+
--fixed-toolbar-fade-end: var(--spacer-5);
|
|
29
|
+
}
|
|
30
|
+
100% {
|
|
31
|
+
--fixed-toolbar-fade-end: 0px;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
|
|
1
35
|
@layer payload-default {
|
|
2
36
|
.fixed-toolbar.fixed-toolbar--hide {
|
|
3
37
|
visibility: hidden;
|
|
@@ -7,10 +41,8 @@
|
|
|
7
41
|
|
|
8
42
|
.fixed-toolbar {
|
|
9
43
|
display: flex;
|
|
10
|
-
flex-wrap: wrap;
|
|
11
44
|
align-items: center;
|
|
12
45
|
padding: 0 var(--spacer-2);
|
|
13
|
-
gap: var(--spacer-2);
|
|
14
46
|
vertical-align: middle;
|
|
15
47
|
position: sticky;
|
|
16
48
|
z-index: 2;
|
|
@@ -55,13 +87,55 @@
|
|
|
55
87
|
}
|
|
56
88
|
}
|
|
57
89
|
|
|
90
|
+
.fixed-toolbar__scroll {
|
|
91
|
+
display: flex;
|
|
92
|
+
flex: 1 1 auto;
|
|
93
|
+
flex-wrap: nowrap;
|
|
94
|
+
align-items: center;
|
|
95
|
+
gap: var(--spacer-2);
|
|
96
|
+
min-width: 0;
|
|
97
|
+
overflow-x: auto;
|
|
98
|
+
scrollbar-width: none;
|
|
99
|
+
-ms-overflow-style: none;
|
|
100
|
+
position: relative;
|
|
101
|
+
z-index: 1;
|
|
102
|
+
animation: fixed-toolbar-scroll-fade linear;
|
|
103
|
+
animation-timeline: scroll(self inline);
|
|
104
|
+
mask: linear-gradient(
|
|
105
|
+
to right,
|
|
106
|
+
transparent,
|
|
107
|
+
black var(--fixed-toolbar-fade-start),
|
|
108
|
+
black calc(100% - var(--fixed-toolbar-fade-end)),
|
|
109
|
+
transparent
|
|
110
|
+
);
|
|
111
|
+
|
|
112
|
+
&::-webkit-scrollbar {
|
|
113
|
+
display: none;
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
[dir='rtl'] .fixed-toolbar__scroll {
|
|
118
|
+
mask: linear-gradient(
|
|
119
|
+
to left,
|
|
120
|
+
transparent,
|
|
121
|
+
black var(--fixed-toolbar-fade-start),
|
|
122
|
+
black calc(100% - var(--fixed-toolbar-fade-end)),
|
|
123
|
+
transparent
|
|
124
|
+
);
|
|
125
|
+
}
|
|
126
|
+
|
|
58
127
|
.fixed-toolbar__group {
|
|
59
128
|
display: flex;
|
|
60
|
-
flex-wrap:
|
|
129
|
+
flex-wrap: nowrap;
|
|
61
130
|
align-items: center;
|
|
62
131
|
gap: var(--spacer-2);
|
|
63
132
|
align-self: stretch;
|
|
64
133
|
z-index: 1;
|
|
134
|
+
flex-shrink: 0;
|
|
135
|
+
|
|
136
|
+
> * {
|
|
137
|
+
flex-shrink: 0;
|
|
138
|
+
}
|
|
65
139
|
|
|
66
140
|
.divider {
|
|
67
141
|
width: var(--stroke-width-small);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/index.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAGjE,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/index.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAGjE,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAA;AAOrE,OAAO,aAAa,CAAA;AA6PpB,eAAO,MAAM,kBAAkB,EAAE,eAAe,CAAC,wBAAwB,CAuCxE,CAAA"}
|
|
@@ -11,6 +11,7 @@ import { useEditorConfigContext } from '../../../../../lexical/config/client/Edi
|
|
|
11
11
|
import { ToolbarButton } from '../../../shared/ToolbarButton/index.js';
|
|
12
12
|
import { ToolbarDropdown } from '../../../shared/ToolbarDropdown/index.js';
|
|
13
13
|
import { useToolbarStates } from '../../../shared/useToolbarStates.js';
|
|
14
|
+
import { useRedirectVerticalWheelToHorizontalScroll } from './horizontalWheelScroll.js';
|
|
14
15
|
import './index.css';
|
|
15
16
|
function ButtonGroupItem({
|
|
16
17
|
active,
|
|
@@ -129,6 +130,7 @@ function FixedToolbar({
|
|
|
129
130
|
const {
|
|
130
131
|
y
|
|
131
132
|
} = useScrollInfo();
|
|
133
|
+
useRedirectVerticalWheelToHorizontalScroll();
|
|
132
134
|
const toolbarStates = useToolbarStates(editor, editorConfig?.features?.toolbarFixed?.groups);
|
|
133
135
|
// Memoize the parent toolbar element
|
|
134
136
|
const parentToolbarElem = useMemo(() => {
|
|
@@ -181,7 +183,8 @@ function FixedToolbar({
|
|
|
181
183
|
event.stopPropagation();
|
|
182
184
|
},
|
|
183
185
|
ref: currentToolbarRef,
|
|
184
|
-
children: isEditable && /*#__PURE__*/_jsx(
|
|
186
|
+
children: isEditable && /*#__PURE__*/_jsx("div", {
|
|
187
|
+
className: "fixed-toolbar__scroll",
|
|
185
188
|
children: editorConfig?.features && editorConfig.features?.toolbarFixed?.groups.map((group, i) => {
|
|
186
189
|
return /*#__PURE__*/_jsx(ToolbarGroupComponent, {
|
|
187
190
|
anchorElem: anchorElem,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","useLexicalEditable","useScrollInfo","useThrottledEffect","useTranslation","React","useMemo","useEditorConfigContext","ToolbarButton","ToolbarDropdown","useToolbarStates","ButtonGroupItem","active","anchorElem","editor","enabled","item","Component","_jsx","key","ChildComponent","ToolbarGroupComponent","editorConfig","group","index","toolbarStates","i18n","fieldProps","featureClientSchemaMap","schemaPath","groupState","groupStates","get","DropdownIcon","type","undefined","activeItem","activeItems","dropdownLabel","length","t","count","label","substring","_jsxs","className","items","Icon","itemsContainerClassNames","map","itemState","itemStates","features","toolbarFixed","groups","FixedToolbar","clientProps","parentWithFixedToolbar","currentToolbarRef","useRef","isEditable","y","parentToolbarElem","disableIfParentHasFixedToolbar","parentEditorElem","editorContainerRef","current","sibling","previousElementSibling","classList","contains","currentToolbarElem","currentRect","getBoundingClientRect","parentRect","overlapping","bottom","top","remove","add","onFocus","event","stopPropagation","ref","Fragment","i","getParentEditorWithFixedToolbar","editorConfigContext","parentEditor","resolvedFeatureMap","has","FixedToolbarPlugin","t0","$","currentEditor","currentEditorConfig","applyToFocusedEditor","focusedEditor","t1","t2","Symbol","for","bb0","document","body"],"sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport { useScrollInfo, useThrottledEffect, useTranslation } from '@payloadcms/ui'\nimport * as React from 'react'\nimport { useMemo } from 'react'\n\nimport type { EditorConfigContextType } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport type { SanitizedClientEditorConfig } from '../../../../../lexical/config/types.js'\nimport type { PluginComponent } from '../../../../typesClient.js'\nimport type { ToolbarStates } from '../../../shared/useToolbarStates.js'\nimport type { ToolbarGroup, ToolbarGroupItem } from '../../../types.js'\nimport type { FixedToolbarFeatureProps } from '../../server/index.js'\n\nimport { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { ToolbarButton } from '../../../shared/ToolbarButton/index.js'\nimport { ToolbarDropdown } from '../../../shared/ToolbarDropdown/index.js'\nimport { useToolbarStates } from '../../../shared/useToolbarStates.js'\nimport './index.css'\n\nfunction ButtonGroupItem({\n active,\n anchorElem,\n editor,\n enabled,\n item,\n}: {\n active: boolean\n anchorElem: HTMLElement\n editor: LexicalEditor\n enabled: boolean\n item: ToolbarGroupItem\n}): React.ReactNode {\n if (item.Component) {\n return (\n item?.Component && (\n <item.Component anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n )\n )\n }\n\n if (!item.ChildComponent) {\n return null\n }\n\n return (\n <ToolbarButton active={active} editor={editor} enabled={enabled} item={item} key={item.key}>\n <item.ChildComponent />\n </ToolbarButton>\n )\n}\n\nfunction ToolbarGroupComponent({\n anchorElem,\n editor,\n editorConfig,\n group,\n index,\n toolbarStates,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n editorConfig: SanitizedClientEditorConfig\n group: ToolbarGroup\n index: number\n toolbarStates: ToolbarStates\n}): React.ReactNode {\n const { i18n } = useTranslation<{}, string>()\n const {\n fieldProps: { featureClientSchemaMap, schemaPath },\n } = useEditorConfigContext()\n\n const groupState = toolbarStates.groupStates.get(group.key)\n\n const DropdownIcon = useMemo(() => {\n if (group.type !== 'dropdown') {\n return undefined\n }\n const activeItem = groupState?.activeItems?.[0]\n if (activeItem) {\n return activeItem.ChildComponent\n }\n return group.ChildComponent\n }, [group, groupState?.activeItems])\n\n const dropdownLabel = useMemo(() => {\n if (group.type !== 'dropdown') {\n return undefined\n }\n const activeItems = groupState?.activeItems\n if (!activeItems?.length) {\n return undefined\n }\n if (activeItems.length > 1) {\n return i18n.t('lexical:general:toolbarItemsActive', { count: activeItems.length })\n }\n const item = activeItems[0]!\n let label = item.key\n if (item.label) {\n label =\n typeof item.label === 'function'\n ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n : item.label\n }\n if (label.length > 25) {\n label = label.substring(0, 25) + '...'\n }\n return label\n }, [group, groupState?.activeItems, i18n, featureClientSchemaMap, schemaPath])\n\n return (\n <div\n className={`fixed-toolbar__group fixed-toolbar__group-${group.key}`}\n data-toolbar-group-key={group.key}\n key={group.key}\n >\n {group.type === 'dropdown' && group.items.length && groupState ? (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n groupState={groupState}\n Icon={DropdownIcon}\n itemsContainerClassNames={['fixed-toolbar__dropdown-items']}\n label={dropdownLabel}\n />\n ) : null}\n {group.type === 'buttons' && group.items.length\n ? group.items.map((item) => {\n const itemState = toolbarStates.itemStates.get(item.key)\n return (\n <ButtonGroupItem\n active={itemState?.active ?? false}\n anchorElem={anchorElem}\n editor={editor}\n enabled={itemState?.enabled ?? true}\n item={item}\n key={item.key}\n />\n )\n })\n : null}\n {index < editorConfig.features.toolbarFixed?.groups.length - 1 && <div className=\"divider\" />}\n </div>\n )\n}\n\nfunction FixedToolbar({\n anchorElem,\n clientProps,\n editor,\n editorConfig,\n parentWithFixedToolbar,\n}: {\n anchorElem: HTMLElement\n clientProps?: FixedToolbarFeatureProps\n editor: LexicalEditor\n editorConfig: SanitizedClientEditorConfig\n parentWithFixedToolbar: EditorConfigContextType | false\n}): React.ReactNode {\n const currentToolbarRef = React.useRef<HTMLDivElement>(null)\n const isEditable = useLexicalEditable()\n\n const { y } = useScrollInfo()\n\n const toolbarStates = useToolbarStates(editor, editorConfig?.features?.toolbarFixed?.groups)\n\n // Memoize the parent toolbar element\n const parentToolbarElem = useMemo(() => {\n if (!parentWithFixedToolbar || clientProps?.disableIfParentHasFixedToolbar) {\n return null\n }\n\n const parentEditorElem = parentWithFixedToolbar.editorContainerRef.current\n let sibling = parentEditorElem.previousElementSibling\n while (sibling) {\n if (sibling.classList.contains('fixed-toolbar')) {\n return sibling\n }\n sibling = sibling.previousElementSibling\n }\n return null\n }, [clientProps?.disableIfParentHasFixedToolbar, parentWithFixedToolbar])\n\n useThrottledEffect(\n () => {\n if (!parentToolbarElem) {\n // this also checks for clientProps?.disableIfParentHasFixedToolbar indirectly, see the parentToolbarElem useMemo\n return\n }\n const currentToolbarElem = currentToolbarRef.current\n if (!currentToolbarElem) {\n return\n }\n\n const currentRect = currentToolbarElem.getBoundingClientRect()\n const parentRect = parentToolbarElem.getBoundingClientRect()\n\n // we only need to check for vertical overlap\n const overlapping = !(\n currentRect.bottom < parentRect.top || currentRect.top > parentRect.bottom\n )\n\n if (overlapping) {\n currentToolbarElem.classList.remove('fixed-toolbar')\n currentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--overlapping')\n parentToolbarElem.classList.remove('fixed-toolbar')\n parentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--hide')\n } else {\n if (!currentToolbarElem.classList.contains('fixed-toolbar--overlapping')) {\n return\n }\n currentToolbarElem.classList.remove('fixed-toolbar--overlapping')\n currentToolbarElem.classList.add('fixed-toolbar')\n parentToolbarElem.classList.remove('fixed-toolbar--hide')\n parentToolbarElem.classList.add('fixed-toolbar')\n }\n },\n 50,\n [currentToolbarRef, parentToolbarElem, y],\n )\n\n return (\n <div\n className=\"fixed-toolbar\"\n onFocus={(event) => {\n // Prevent other focus events being triggered. Otherwise, if this was to be clicked while in a child editor,\n // the parent editor will be focused, and the child editor will lose focus.\n event.stopPropagation()\n }}\n ref={currentToolbarRef}\n >\n {isEditable && (\n <React.Fragment>\n {editorConfig?.features &&\n editorConfig.features?.toolbarFixed?.groups.map((group, i) => {\n return (\n <ToolbarGroupComponent\n anchorElem={anchorElem}\n editor={editor}\n editorConfig={editorConfig}\n group={group}\n index={i}\n key={group.key}\n toolbarStates={toolbarStates}\n />\n )\n })}\n </React.Fragment>\n )}\n </div>\n )\n}\n\nconst getParentEditorWithFixedToolbar = (\n editorConfigContext: EditorConfigContextType,\n): EditorConfigContextType | false => {\n if (editorConfigContext.parentEditor?.editorConfig) {\n if (editorConfigContext.parentEditor?.editorConfig.resolvedFeatureMap.has('toolbarFixed')) {\n return editorConfigContext.parentEditor\n } else {\n if (editorConfigContext.parentEditor) {\n return getParentEditorWithFixedToolbar(editorConfigContext.parentEditor)\n }\n }\n }\n return false\n}\n\nexport const FixedToolbarPlugin: PluginComponent<FixedToolbarFeatureProps> = ({ clientProps }) => {\n const [currentEditor] = useLexicalComposerContext()\n const editorConfigContext = useEditorConfigContext()\n const isEditable = useLexicalEditable()\n if (!isEditable) {\n return null\n }\n\n const { editorConfig: currentEditorConfig } = editorConfigContext\n\n const editor = clientProps.applyToFocusedEditor\n ? editorConfigContext.focusedEditor?.editor || currentEditor\n : currentEditor\n\n const editorConfig = clientProps.applyToFocusedEditor\n ? editorConfigContext.focusedEditor?.editorConfig || currentEditorConfig\n : currentEditorConfig\n\n const parentWithFixedToolbar = getParentEditorWithFixedToolbar(editorConfigContext)\n\n if (clientProps?.disableIfParentHasFixedToolbar) {\n if (parentWithFixedToolbar) {\n return null\n }\n }\n\n if (!editorConfig?.features?.toolbarFixed?.groups?.length) {\n return null\n }\n\n return (\n <FixedToolbar\n anchorElem={document.body}\n clientProps={clientProps}\n editor={editor}\n editorConfig={editorConfig}\n parentWithFixedToolbar={parentWithFixedToolbar}\n />\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","useLexicalEditable","useScrollInfo","useThrottledEffect","useTranslation","React","useMemo","useEditorConfigContext","ToolbarButton","ToolbarDropdown","useToolbarStates","useRedirectVerticalWheelToHorizontalScroll","ButtonGroupItem","active","anchorElem","editor","enabled","item","Component","_jsx","key","ChildComponent","ToolbarGroupComponent","editorConfig","group","index","toolbarStates","i18n","fieldProps","featureClientSchemaMap","schemaPath","groupState","groupStates","get","DropdownIcon","type","undefined","activeItem","activeItems","dropdownLabel","length","t","count","label","substring","_jsxs","className","items","Icon","itemsContainerClassNames","map","itemState","itemStates","features","toolbarFixed","groups","FixedToolbar","clientProps","parentWithFixedToolbar","currentToolbarRef","useRef","isEditable","y","parentToolbarElem","disableIfParentHasFixedToolbar","parentEditorElem","editorContainerRef","current","sibling","previousElementSibling","classList","contains","currentToolbarElem","currentRect","getBoundingClientRect","parentRect","overlapping","bottom","top","remove","add","onFocus","event","stopPropagation","ref","i","getParentEditorWithFixedToolbar","editorConfigContext","parentEditor","resolvedFeatureMap","has","FixedToolbarPlugin","t0","$","currentEditor","currentEditorConfig","applyToFocusedEditor","focusedEditor","t1","t2","Symbol","for","bb0","document","body"],"sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport { useScrollInfo, useThrottledEffect, useTranslation } from '@payloadcms/ui'\nimport * as React from 'react'\nimport { useMemo } from 'react'\n\nimport type { EditorConfigContextType } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport type { SanitizedClientEditorConfig } from '../../../../../lexical/config/types.js'\nimport type { PluginComponent } from '../../../../typesClient.js'\nimport type { ToolbarStates } from '../../../shared/useToolbarStates.js'\nimport type { ToolbarGroup, ToolbarGroupItem } from '../../../types.js'\nimport type { FixedToolbarFeatureProps } from '../../server/index.js'\n\nimport { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { ToolbarButton } from '../../../shared/ToolbarButton/index.js'\nimport { ToolbarDropdown } from '../../../shared/ToolbarDropdown/index.js'\nimport { useToolbarStates } from '../../../shared/useToolbarStates.js'\nimport { useRedirectVerticalWheelToHorizontalScroll } from './horizontalWheelScroll.js'\nimport './index.css'\n\nfunction ButtonGroupItem({\n active,\n anchorElem,\n editor,\n enabled,\n item,\n}: {\n active: boolean\n anchorElem: HTMLElement\n editor: LexicalEditor\n enabled: boolean\n item: ToolbarGroupItem\n}): React.ReactNode {\n if (item.Component) {\n return (\n item?.Component && (\n <item.Component anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n )\n )\n }\n\n if (!item.ChildComponent) {\n return null\n }\n\n return (\n <ToolbarButton active={active} editor={editor} enabled={enabled} item={item} key={item.key}>\n <item.ChildComponent />\n </ToolbarButton>\n )\n}\n\nfunction ToolbarGroupComponent({\n anchorElem,\n editor,\n editorConfig,\n group,\n index,\n toolbarStates,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n editorConfig: SanitizedClientEditorConfig\n group: ToolbarGroup\n index: number\n toolbarStates: ToolbarStates\n}): React.ReactNode {\n const { i18n } = useTranslation<{}, string>()\n const {\n fieldProps: { featureClientSchemaMap, schemaPath },\n } = useEditorConfigContext()\n\n const groupState = toolbarStates.groupStates.get(group.key)\n\n const DropdownIcon = useMemo(() => {\n if (group.type !== 'dropdown') {\n return undefined\n }\n const activeItem = groupState?.activeItems?.[0]\n if (activeItem) {\n return activeItem.ChildComponent\n }\n return group.ChildComponent\n }, [group, groupState?.activeItems])\n\n const dropdownLabel = useMemo(() => {\n if (group.type !== 'dropdown') {\n return undefined\n }\n const activeItems = groupState?.activeItems\n if (!activeItems?.length) {\n return undefined\n }\n if (activeItems.length > 1) {\n return i18n.t('lexical:general:toolbarItemsActive', { count: activeItems.length })\n }\n const item = activeItems[0]!\n let label = item.key\n if (item.label) {\n label =\n typeof item.label === 'function'\n ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n : item.label\n }\n if (label.length > 25) {\n label = label.substring(0, 25) + '...'\n }\n return label\n }, [group, groupState?.activeItems, i18n, featureClientSchemaMap, schemaPath])\n\n return (\n <div\n className={`fixed-toolbar__group fixed-toolbar__group-${group.key}`}\n data-toolbar-group-key={group.key}\n key={group.key}\n >\n {group.type === 'dropdown' && group.items.length && groupState ? (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n groupState={groupState}\n Icon={DropdownIcon}\n itemsContainerClassNames={['fixed-toolbar__dropdown-items']}\n label={dropdownLabel}\n />\n ) : null}\n {group.type === 'buttons' && group.items.length\n ? group.items.map((item) => {\n const itemState = toolbarStates.itemStates.get(item.key)\n return (\n <ButtonGroupItem\n active={itemState?.active ?? false}\n anchorElem={anchorElem}\n editor={editor}\n enabled={itemState?.enabled ?? true}\n item={item}\n key={item.key}\n />\n )\n })\n : null}\n {index < editorConfig.features.toolbarFixed?.groups.length - 1 && <div className=\"divider\" />}\n </div>\n )\n}\n\nfunction FixedToolbar({\n anchorElem,\n clientProps,\n editor,\n editorConfig,\n parentWithFixedToolbar,\n}: {\n anchorElem: HTMLElement\n clientProps?: FixedToolbarFeatureProps\n editor: LexicalEditor\n editorConfig: SanitizedClientEditorConfig\n parentWithFixedToolbar: EditorConfigContextType | false\n}): React.ReactNode {\n const currentToolbarRef = React.useRef<HTMLDivElement>(null)\n const isEditable = useLexicalEditable()\n\n const { y } = useScrollInfo()\n\n useRedirectVerticalWheelToHorizontalScroll()\n\n const toolbarStates = useToolbarStates(editor, editorConfig?.features?.toolbarFixed?.groups)\n\n // Memoize the parent toolbar element\n const parentToolbarElem = useMemo(() => {\n if (!parentWithFixedToolbar || clientProps?.disableIfParentHasFixedToolbar) {\n return null\n }\n\n const parentEditorElem = parentWithFixedToolbar.editorContainerRef.current\n let sibling = parentEditorElem.previousElementSibling\n while (sibling) {\n if (sibling.classList.contains('fixed-toolbar')) {\n return sibling\n }\n sibling = sibling.previousElementSibling\n }\n return null\n }, [clientProps?.disableIfParentHasFixedToolbar, parentWithFixedToolbar])\n\n useThrottledEffect(\n () => {\n if (!parentToolbarElem) {\n // this also checks for clientProps?.disableIfParentHasFixedToolbar indirectly, see the parentToolbarElem useMemo\n return\n }\n const currentToolbarElem = currentToolbarRef.current\n if (!currentToolbarElem) {\n return\n }\n\n const currentRect = currentToolbarElem.getBoundingClientRect()\n const parentRect = parentToolbarElem.getBoundingClientRect()\n\n // we only need to check for vertical overlap\n const overlapping = !(\n currentRect.bottom < parentRect.top || currentRect.top > parentRect.bottom\n )\n\n if (overlapping) {\n currentToolbarElem.classList.remove('fixed-toolbar')\n currentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--overlapping')\n parentToolbarElem.classList.remove('fixed-toolbar')\n parentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--hide')\n } else {\n if (!currentToolbarElem.classList.contains('fixed-toolbar--overlapping')) {\n return\n }\n currentToolbarElem.classList.remove('fixed-toolbar--overlapping')\n currentToolbarElem.classList.add('fixed-toolbar')\n parentToolbarElem.classList.remove('fixed-toolbar--hide')\n parentToolbarElem.classList.add('fixed-toolbar')\n }\n },\n 50,\n [currentToolbarRef, parentToolbarElem, y],\n )\n\n return (\n <div\n className=\"fixed-toolbar\"\n onFocus={(event) => {\n // Prevent other focus events being triggered. Otherwise, if this was to be clicked while in a child editor,\n // the parent editor will be focused, and the child editor will lose focus.\n event.stopPropagation()\n }}\n ref={currentToolbarRef}\n >\n {isEditable && (\n <div className=\"fixed-toolbar__scroll\">\n {editorConfig?.features &&\n editorConfig.features?.toolbarFixed?.groups.map((group, i) => {\n return (\n <ToolbarGroupComponent\n anchorElem={anchorElem}\n editor={editor}\n editorConfig={editorConfig}\n group={group}\n index={i}\n key={group.key}\n toolbarStates={toolbarStates}\n />\n )\n })}\n </div>\n )}\n </div>\n )\n}\n\nconst getParentEditorWithFixedToolbar = (\n editorConfigContext: EditorConfigContextType,\n): EditorConfigContextType | false => {\n if (editorConfigContext.parentEditor?.editorConfig) {\n if (editorConfigContext.parentEditor?.editorConfig.resolvedFeatureMap.has('toolbarFixed')) {\n return editorConfigContext.parentEditor\n } else {\n if (editorConfigContext.parentEditor) {\n return getParentEditorWithFixedToolbar(editorConfigContext.parentEditor)\n }\n }\n }\n return false\n}\n\nexport const FixedToolbarPlugin: PluginComponent<FixedToolbarFeatureProps> = ({ clientProps }) => {\n const [currentEditor] = useLexicalComposerContext()\n const editorConfigContext = useEditorConfigContext()\n const isEditable = useLexicalEditable()\n if (!isEditable) {\n return null\n }\n\n const { editorConfig: currentEditorConfig } = editorConfigContext\n\n const editor = clientProps.applyToFocusedEditor\n ? editorConfigContext.focusedEditor?.editor || currentEditor\n : currentEditor\n\n const editorConfig = clientProps.applyToFocusedEditor\n ? editorConfigContext.focusedEditor?.editorConfig || currentEditorConfig\n : currentEditorConfig\n\n const parentWithFixedToolbar = getParentEditorWithFixedToolbar(editorConfigContext)\n\n if (clientProps?.disableIfParentHasFixedToolbar) {\n if (parentWithFixedToolbar) {\n return null\n }\n }\n\n if (!editorConfig?.features?.toolbarFixed?.groups?.length) {\n return null\n }\n\n return (\n <FixedToolbar\n anchorElem={document.body}\n clientProps={clientProps}\n editor={editor}\n editorConfig={editorConfig}\n parentWithFixedToolbar={parentWithFixedToolbar}\n />\n )\n}\n"],"mappings":"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","ignoreList":[]}
|