@payloadcms/richtext-lexical 3.59.0-internal.56a1b3b → 3.59.0-internal.58ab390
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/index.js +16 -16
- package/dist/exports/client/index.js.map +3 -3
- package/dist/features/blocks/premade/CodeBlock/Component/Block.d.ts.map +1 -1
- package/dist/features/blocks/premade/CodeBlock/Component/Block.js +19 -17
- package/dist/features/blocks/premade/CodeBlock/Component/Block.js.map +1 -1
- package/dist/features/blocks/premade/CodeBlock/Component/Code.d.ts +8 -0
- package/dist/features/blocks/premade/CodeBlock/Component/Code.d.ts.map +1 -1
- package/dist/features/blocks/premade/CodeBlock/Component/Code.js +15 -0
- package/dist/features/blocks/premade/CodeBlock/Component/Code.js.map +1 -1
- package/package.json +6 -6
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Block.d.ts","sourceRoot":"","sources":["../../../../../../src/features/blocks/premade/CodeBlock/Component/Block.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAErB,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,WAAW,CAAA;AAQ7D,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAC5C,QAAQ,CAAC,IAAI,CAAC,4BAA4B,EAAE,WAAW,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"Block.d.ts","sourceRoot":"","sources":["../../../../../../src/features/blocks/premade/CodeBlock/Component/Block.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAErB,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,WAAW,CAAA;AAQ7D,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAC5C,QAAQ,CAAC,IAAI,CAAC,4BAA4B,EAAE,WAAW,CAAC,CAAC,CA+F1D,CAAA"}
|
|
@@ -10,13 +10,14 @@ import { Collapse } from './Collapse/index.js';
|
|
|
10
10
|
import { FloatingCollapse } from './FloatingCollapse/index.js';
|
|
11
11
|
const baseClass = 'payload-richtext-code-block';
|
|
12
12
|
export const CodeBlockBlockComponent = args => {
|
|
13
|
-
const $ = _c(
|
|
13
|
+
const $ = _c(14);
|
|
14
14
|
const {
|
|
15
15
|
languages
|
|
16
16
|
} = args;
|
|
17
17
|
const {
|
|
18
18
|
BlockCollapsible,
|
|
19
|
-
formSchema
|
|
19
|
+
formSchema,
|
|
20
|
+
RemoveButton
|
|
20
21
|
} = useBlockComponentContext();
|
|
21
22
|
const {
|
|
22
23
|
setModified
|
|
@@ -52,9 +53,9 @@ export const CodeBlockBlockComponent = args => {
|
|
|
52
53
|
const selectedLanguageLabel = languages[selectedLanguageField?.value];
|
|
53
54
|
const t1 = selectedLanguageField?.value;
|
|
54
55
|
let t2;
|
|
55
|
-
if ($[2] !== BlockCollapsible || $[3] !== codeField?.value || $[
|
|
56
|
+
if ($[2] !== BlockCollapsible || $[3] !== RemoveButton || $[4] !== codeField?.value || $[5] !== formSchema || $[6] !== languages || $[7] !== selectedLanguageLabel || $[8] !== setSelectedLanguage || $[9] !== t1) {
|
|
56
57
|
let t3;
|
|
57
|
-
if ($[
|
|
58
|
+
if ($[11] !== languages || $[12] !== setSelectedLanguage) {
|
|
58
59
|
t3 = t4 => {
|
|
59
60
|
const {
|
|
60
61
|
close
|
|
@@ -78,11 +79,11 @@ export const CodeBlockBlockComponent = args => {
|
|
|
78
79
|
})
|
|
79
80
|
});
|
|
80
81
|
};
|
|
81
|
-
$[
|
|
82
|
-
$[
|
|
83
|
-
$[
|
|
82
|
+
$[11] = languages;
|
|
83
|
+
$[12] = setSelectedLanguage;
|
|
84
|
+
$[13] = t3;
|
|
84
85
|
} else {
|
|
85
|
-
t3 = $[
|
|
86
|
+
t3 = $[13];
|
|
86
87
|
}
|
|
87
88
|
t2 = _jsx(BlockCollapsible, {
|
|
88
89
|
Actions: _jsxs("div", {
|
|
@@ -104,7 +105,7 @@ export const CodeBlockBlockComponent = args => {
|
|
|
104
105
|
size: "large"
|
|
105
106
|
}), _jsx(CopyToClipboard, {
|
|
106
107
|
value: codeField?.value ?? ""
|
|
107
|
-
}), _jsx(Collapse, {})]
|
|
108
|
+
}), _jsx(Collapse, {}), _jsx(RemoveButton, {})]
|
|
108
109
|
}),
|
|
109
110
|
className: baseClass,
|
|
110
111
|
collapsibleProps: {
|
|
@@ -128,15 +129,16 @@ export const CodeBlockBlockComponent = args => {
|
|
|
128
129
|
})
|
|
129
130
|
});
|
|
130
131
|
$[2] = BlockCollapsible;
|
|
131
|
-
$[3] =
|
|
132
|
-
$[4] =
|
|
133
|
-
$[5] =
|
|
134
|
-
$[6] =
|
|
135
|
-
$[7] =
|
|
136
|
-
$[8] =
|
|
137
|
-
$[9] =
|
|
132
|
+
$[3] = RemoveButton;
|
|
133
|
+
$[4] = codeField?.value;
|
|
134
|
+
$[5] = formSchema;
|
|
135
|
+
$[6] = languages;
|
|
136
|
+
$[7] = selectedLanguageLabel;
|
|
137
|
+
$[8] = setSelectedLanguage;
|
|
138
|
+
$[9] = t1;
|
|
139
|
+
$[10] = t2;
|
|
138
140
|
} else {
|
|
139
|
-
t2 = $[
|
|
141
|
+
t2 = $[10];
|
|
140
142
|
}
|
|
141
143
|
return t2;
|
|
142
144
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Block.js","names":["c","_c","ChevronIcon","CopyToClipboard","Popup","PopupList","RenderFields","useForm","useFormFields","React","CodeBlockIcon","useBlockComponentContext","Collapse","FloatingCollapse","baseClass","CodeBlockBlockComponent","args","$","languages","BlockCollapsible","formSchema","setModified","codeField","_temp","t0","t1","fields_0","dispatch","selectedLanguageField","fields","language","setSelectedLanguage","type","path","value","selectedLanguageLabel","t2","t3","t4","close","_jsx","ButtonGroup","children","Object","entries","map","t5","languageCode","languageLabel","Button","active","disabled","onClick","className","Actions","_jsxs","button","horizontalAlign","render","disableHeaderToggle","disableToggleIndicator","Pill","_Fragment","forceRender","parentIndexPath","parentPath","parentSchemaPath","permissions","code"],"sources":["../../../../../../src/features/blocks/premade/CodeBlock/Component/Block.tsx"],"sourcesContent":["'use client'\nimport type {} from 'payload'\n\nimport {\n ChevronIcon,\n CopyToClipboard,\n Popup,\n PopupList,\n RenderFields,\n useForm,\n useFormFields,\n} from '@payloadcms/ui'\nimport React from 'react'\n\nimport './index.scss'\n\nimport type { AdditionalCodeComponentProps } from './Code.js'\n\nimport { CodeBlockIcon } from '../../../../../lexical/ui/icons/CodeBlock/index.js'\nimport { useBlockComponentContext } from '../../../client/component/BlockContent.js'\nimport { Collapse } from './Collapse/index.js'\nimport { FloatingCollapse } from './FloatingCollapse/index.js'\n\nconst baseClass = 'payload-richtext-code-block'\nexport const CodeBlockBlockComponent: React.FC<\n Required<Pick<AdditionalCodeComponentProps, 'languages'>>\n> = (args) => {\n const { languages } = args\n const { BlockCollapsible, formSchema } = useBlockComponentContext()\n const { setModified } = useForm()\n\n const { codeField } = useFormFields(([fields]) => ({\n codeField: fields?.code,\n }))\n\n const { selectedLanguageField, setSelectedLanguage } = useFormFields(([fields, dispatch]) => ({\n selectedLanguageField: fields?.language,\n setSelectedLanguage: (language: string) => {\n dispatch({\n type: 'UPDATE',\n path: 'language',\n value: language,\n })\n setModified(true)\n },\n }))\n\n const selectedLanguageLabel = languages[selectedLanguageField?.value as keyof typeof languages]\n\n return (\n <BlockCollapsible\n Actions={\n <div className={`${baseClass}__actions`}>\n <Popup\n button={\n <div\n className={`${baseClass}__language-selector-button`}\n data-selected-language={selectedLanguageField?.value}\n >\n <span>{selectedLanguageLabel}</span>\n <ChevronIcon className={`${baseClass}__chevron`} />\n </div>\n }\n className={`${baseClass}__language-selector`}\n horizontalAlign=\"right\"\n render={({ close }) => (\n <PopupList.ButtonGroup>\n {Object.entries(languages).map(([languageCode, languageLabel]) => {\n return (\n <PopupList.Button\n active={false}\n disabled={false}\n key={languageCode}\n onClick={() => {\n setSelectedLanguage(languageCode)\n close()\n }}\n >\n <span className={`${baseClass}__language-code`} data-language={languageCode}>\n {languageLabel}\n </span>\n </PopupList.Button>\n )\n })}\n </PopupList.ButtonGroup>\n )}\n showScrollbar\n size=\"large\"\n />\n <CopyToClipboard value={(codeField?.value as string) ?? ''} />\n\n <Collapse />\n </div>\n }\n className={baseClass}\n collapsibleProps={{\n AfterCollapsible: <FloatingCollapse />,\n disableHeaderToggle: true,\n disableToggleIndicator: true,\n }}\n Pill={\n <div className={`${baseClass}__pill`}>\n <CodeBlockIcon />\n </div>\n }\n >\n <>\n <RenderFields\n fields={formSchema}\n forceRender={true}\n parentIndexPath=\"\"\n parentPath={''}\n parentSchemaPath=\"\"\n permissions={true}\n />\n </>\n </BlockCollapsible>\n )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SACEC,WAAW,EACXC,eAAe,EACfC,KAAK,EACLC,SAAS,EACTC,YAAY,EACZC,OAAO,EACPC,aAAa,QACR;AACP,OAAOC,KAAA,MAAW;AAMlB,SAASC,aAAa,QAAQ;AAC9B,SAASC,wBAAwB,QAAQ;AACzC,SAASC,QAAQ,QAAQ;AACzB,SAASC,gBAAgB,QAAQ;AAEjC,MAAMC,SAAA,GAAY;AAClB,OAAO,MAAMC,uBAAA,GAETC,IAAA;EAAA,MAAAC,CAAA,GAAAhB,EAAA;EACF;IAAAiB;EAAA,IAAsBF,IAAA;EACtB;IAAAG,gBAAA;IAAAC;EAAA,
|
|
1
|
+
{"version":3,"file":"Block.js","names":["c","_c","ChevronIcon","CopyToClipboard","Popup","PopupList","RenderFields","useForm","useFormFields","React","CodeBlockIcon","useBlockComponentContext","Collapse","FloatingCollapse","baseClass","CodeBlockBlockComponent","args","$","languages","BlockCollapsible","formSchema","RemoveButton","setModified","codeField","_temp","t0","t1","fields_0","dispatch","selectedLanguageField","fields","language","setSelectedLanguage","type","path","value","selectedLanguageLabel","t2","t3","t4","close","_jsx","ButtonGroup","children","Object","entries","map","t5","languageCode","languageLabel","Button","active","disabled","onClick","className","Actions","_jsxs","button","horizontalAlign","render","disableHeaderToggle","disableToggleIndicator","Pill","_Fragment","forceRender","parentIndexPath","parentPath","parentSchemaPath","permissions","code"],"sources":["../../../../../../src/features/blocks/premade/CodeBlock/Component/Block.tsx"],"sourcesContent":["'use client'\nimport type {} from 'payload'\n\nimport {\n ChevronIcon,\n CopyToClipboard,\n Popup,\n PopupList,\n RenderFields,\n useForm,\n useFormFields,\n} from '@payloadcms/ui'\nimport React from 'react'\n\nimport './index.scss'\n\nimport type { AdditionalCodeComponentProps } from './Code.js'\n\nimport { CodeBlockIcon } from '../../../../../lexical/ui/icons/CodeBlock/index.js'\nimport { useBlockComponentContext } from '../../../client/component/BlockContent.js'\nimport { Collapse } from './Collapse/index.js'\nimport { FloatingCollapse } from './FloatingCollapse/index.js'\n\nconst baseClass = 'payload-richtext-code-block'\nexport const CodeBlockBlockComponent: React.FC<\n Required<Pick<AdditionalCodeComponentProps, 'languages'>>\n> = (args) => {\n const { languages } = args\n const { BlockCollapsible, formSchema, RemoveButton } = useBlockComponentContext()\n const { setModified } = useForm()\n\n const { codeField } = useFormFields(([fields]) => ({\n codeField: fields?.code,\n }))\n\n const { selectedLanguageField, setSelectedLanguage } = useFormFields(([fields, dispatch]) => ({\n selectedLanguageField: fields?.language,\n setSelectedLanguage: (language: string) => {\n dispatch({\n type: 'UPDATE',\n path: 'language',\n value: language,\n })\n setModified(true)\n },\n }))\n\n const selectedLanguageLabel = languages[selectedLanguageField?.value as keyof typeof languages]\n\n return (\n <BlockCollapsible\n Actions={\n <div className={`${baseClass}__actions`}>\n <Popup\n button={\n <div\n className={`${baseClass}__language-selector-button`}\n data-selected-language={selectedLanguageField?.value}\n >\n <span>{selectedLanguageLabel}</span>\n <ChevronIcon className={`${baseClass}__chevron`} />\n </div>\n }\n className={`${baseClass}__language-selector`}\n horizontalAlign=\"right\"\n render={({ close }) => (\n <PopupList.ButtonGroup>\n {Object.entries(languages).map(([languageCode, languageLabel]) => {\n return (\n <PopupList.Button\n active={false}\n disabled={false}\n key={languageCode}\n onClick={() => {\n setSelectedLanguage(languageCode)\n close()\n }}\n >\n <span className={`${baseClass}__language-code`} data-language={languageCode}>\n {languageLabel}\n </span>\n </PopupList.Button>\n )\n })}\n </PopupList.ButtonGroup>\n )}\n showScrollbar\n size=\"large\"\n />\n <CopyToClipboard value={(codeField?.value as string) ?? ''} />\n\n <Collapse />\n\n <RemoveButton />\n </div>\n }\n className={baseClass}\n collapsibleProps={{\n AfterCollapsible: <FloatingCollapse />,\n disableHeaderToggle: true,\n disableToggleIndicator: true,\n }}\n Pill={\n <div className={`${baseClass}__pill`}>\n <CodeBlockIcon />\n </div>\n }\n >\n <>\n <RenderFields\n fields={formSchema}\n forceRender={true}\n parentIndexPath=\"\"\n parentPath={''}\n parentSchemaPath=\"\"\n permissions={true}\n />\n </>\n </BlockCollapsible>\n )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SACEC,WAAW,EACXC,eAAe,EACfC,KAAK,EACLC,SAAS,EACTC,YAAY,EACZC,OAAO,EACPC,aAAa,QACR;AACP,OAAOC,KAAA,MAAW;AAMlB,SAASC,aAAa,QAAQ;AAC9B,SAASC,wBAAwB,QAAQ;AACzC,SAASC,QAAQ,QAAQ;AACzB,SAASC,gBAAgB,QAAQ;AAEjC,MAAMC,SAAA,GAAY;AAClB,OAAO,MAAMC,uBAAA,GAETC,IAAA;EAAA,MAAAC,CAAA,GAAAhB,EAAA;EACF;IAAAiB;EAAA,IAAsBF,IAAA;EACtB;IAAAG,gBAAA;IAAAC,UAAA;IAAAC;EAAA,IAAuDV,wBAAA;EACvD;IAAAW;EAAA,IAAwBf,OAAA;EAExB;IAAAgB;EAAA,IAAsBf,aAAA,CAAAgB,KAEtB;EAAA,IAAAC,EAAA;EAAA,IAAAR,CAAA,QAAAK,WAAA;IAEqEG,EAAA,GAAAC,EAAA;MAAC,OAAAC,QAAA,EAAAC,QAAA,IAAAF,EAAkB;MAAA;QAAAG,qBAAA,EAC/DC,QAAA,EAAAC,QAAA;QAAAC,mBAAA,EAAAD,QAAA;UAErBH,QAAA;YAAAK,IAAA,EACQ;YAAAC,IAAA,EACA;YAAAC,KAAA,EACCJ;UAAA,CACT;UACAT,WAAA,KAAY;QAAA;MAAA;IAAA;IAEhBL,CAAA,MAAAK,WAAA;IAAAL,CAAA,MAAAQ,EAAA;EAAA;IAAAA,EAAA,GAAAR,CAAA;EAAA;EAVA;IAAAY,qBAAA;IAAAG;EAAA,IAAuDxB,aAAA,CAAciB,EAUrE;EAEA,MAAAW,qBAAA,GAA8BlB,SAAS,CAACW,qBAAA,EAAAM,KAAA;EAUF,MAAAT,EAAA,GAAAG,qBAAA,EAAAM,KAAA;EAAuB,IAAAE,EAAA;EAAA,IAAApB,CAAA,QAAAE,gBAAA,IAAAF,CAAA,QAAAI,YAAA,IAAAJ,CAAA,QAAAM,SAAA,EAAAY,KAAA,IAAAlB,CAAA,QAAAG,UAAA,IAAAH,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAmB,qBAAA,IAAAnB,CAAA,QAAAe,mBAAA,IAAAf,CAAA,QAAAS,EAAA;IAAA,IAAAY,EAAA;IAAA,IAAArB,CAAA,SAAAC,SAAA,IAAAD,CAAA,SAAAe,mBAAA;MAQ3CM,EAAA,GAAAC,EAAA;QAAC;UAAAC;QAAA,IAAAD,EAAS;QAAA,OAChBE,IAAA,CAAApC,SAAA,CAAAqC,WAAA;UAAAC,QAAA,EACGC,MAAA,CAAAC,OAAA,CAAe3B,SAAA,EAAA4B,GAAA,CAAAC,EAAA;YAAgB,OAAAC,YAAA,EAAAC,aAAA,IAAAF,EAA6B;YAAA,OAEzDN,IAAA,CAAApC,SAAA,CAAA6C,MAAA;cAAAC,MAAA;cAAAC,QAAA;cAAAC,OAAA,EAAAA,CAAA;gBAKIrB,mBAAA,CAAoBgB,YAAA;gBACpBR,KAAA;cAAA;cAAAG,QAAA,EAGFF,IAAA,CAAC;gBAAAa,SAAA,EAAgB,GAAAxC,SAAA,iBAA6B;gBAAA,iBAAiBkC,YAAA;gBAAAL,QAAA,EAC5DM;cAAA,C;eAPED,YAAA;UAAA,CAWX;QAAA,C;;;;;;;;IAjCZX,EAAA,GAAAI,IAAA,CAACtB,gBAAA;MAAAoC,OAAA,EAEGC,KAAA,CAAC;QAAAF,SAAA,EAAe,GAAAxC,SAAA,WAAuB;QAAA6B,QAAA,GACrCF,IAAA,CAAArC,KAAA;UAAAqD,MAAA,EAEID,KAAA,CAAC;YAAAF,SAAA,EACY,GAAAxC,SAAA,4BAAwC;YAAA,0BAC3BY,EAAuB;YAAAiB,QAAA,GAE/CF,IAAA,CAAC;cAAAE,QAAA,EAAMP;YAAA,C,GACPK,IAAA,CAAAvC,WAAA;cAAAoD,SAAA,EAAwB,GAAAxC,SAAA;YAAuB,C;;qBAGxC,GAAAA,SAAA,qBAAiC;UAAA4C,eAAA,EAC5B;UAAAC,MAAA,EACRrB,E;;gBAsBH;QAAA,C,GAEPG,IAAA,CAAAtC,eAAA;UAAAgC,KAAA,EAAwBZ,SAAC,EAAAY,KAAA,IAA+B;QAAA,C,GAExDM,IAAA,CAAA7B,QAAA,IAAC,GAED6B,IAAA,CAACpB,YAAA;MAAA,C;;;0BAKeoB,IAAA,CAAA5B,gBAAA,IAAC;QAAA+C,mBAAA;QAAAC,sBAAA;MAAA;MAAAC,IAAA,EAKnBrB,IAAA,CAAC;QAAAa,SAAA,EAAe,GAAAxC,SAAA,QAAoB;QAAA6B,QAAA,EAClCF,IAAA,CAAA/B,aAAA,IAAC;MAAA,C;gBAIL+B,IAAA,CAAAsB,SAAA;QAAApB,QAAA,EACEF,IAAA,CAAAnC,YAAA;UAAAwB,MAAA,EACUV,UAAA;UAAA4C,WAAA;UAAAC,eAAA,EAEQ;UAAAC,UAAA,EACJ;UAAAC,gBAAA,EACK;UAAAC,WAAA;QAAA,C;;;;;;;;;;;;;;;SAhEvB/B,E;CAsEJ;AA9FI,SAAAb,MAAAC,EAAA;EAKmC,OAAAK,MAAA,IAAAL,EAAQ;EAAA;IAAAF,SAAA,EAChCO,MAAA,EAAAuC;EAAA;AAAA","ignoreList":[]}
|
|
@@ -24,6 +24,14 @@ export type AdditionalCodeComponentProps = {
|
|
|
24
24
|
* Configure typescript settings for the editor
|
|
25
25
|
*/
|
|
26
26
|
typescript?: {
|
|
27
|
+
/**
|
|
28
|
+
* By default, the editor will not perform semantic validation. This means that
|
|
29
|
+
* while syntax errors will be highlighted, other issues like missing imports or incorrect
|
|
30
|
+
* types will not be.
|
|
31
|
+
*
|
|
32
|
+
* @default false
|
|
33
|
+
*/
|
|
34
|
+
enableSemanticValidation?: boolean;
|
|
27
35
|
/**
|
|
28
36
|
* Additional types to fetch and include in the editor for autocompletion.
|
|
29
37
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Code.d.ts","sourceRoot":"","sources":["../../../../../../src/features/blocks/premade/CodeBlock/Component/Code.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAmB,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAGpE,OAAO,KAAkB,MAAM,OAAO,CAAA;AAEtC,MAAM,MAAM,4BAA4B,GAAG;IACzC;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAClC;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,UAAU,CAAC,EAAE;QACX;;;;;;WAMG;QACH,UAAU,CAAC,EAAE,KAAK,CAAC;YACjB,QAAQ,EAAE,MAAM,CAAA;YAChB,GAAG,EAAE,MAAM,CAAA;SACZ,CAAC,CAAA;QACF;;WAEG;QACH,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC,CAAA;QAChC;;WAEG;QACH,MAAM,CAAC,EAAE,MAAM,CAAA;QACf;;WAEG;QACH,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;KACrB,CAAA;CACF,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,GAAG,oBAAoB,
|
|
1
|
+
{"version":3,"file":"Code.d.ts","sourceRoot":"","sources":["../../../../../../src/features/blocks/premade/CodeBlock/Component/Code.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAmB,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAGpE,OAAO,KAAkB,MAAM,OAAO,CAAA;AAEtC,MAAM,MAAM,4BAA4B,GAAG;IACzC;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAClC;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,UAAU,CAAC,EAAE;QACX;;;;;;WAMG;QACH,wBAAwB,CAAC,EAAE,OAAO,CAAA;QAClC;;;;;;WAMG;QACH,UAAU,CAAC,EAAE,KAAK,CAAC;YACjB,QAAQ,EAAE,MAAM,CAAA;YAChB,GAAG,EAAE,MAAM,CAAA;SACZ,CAAC,CAAA;QACF;;WAEG;QACH,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC,CAAA;QAChC;;WAEG;QACH,MAAM,CAAC,EAAE,MAAM,CAAA;QACf;;WAEG;QACH,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;KACrB,CAAA;CACF,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,GAAG,oBAAoB,CAwHvF,CAAA"}
|
|
@@ -29,6 +29,11 @@ export const CodeComponent = ({
|
|
|
29
29
|
admin: {
|
|
30
30
|
...field.admin,
|
|
31
31
|
editorOptions: {},
|
|
32
|
+
editorProps: {
|
|
33
|
+
// If typescript is set, @monaco-editor/react needs to set the URI to a .ts or .tsx file when it calls createModel().
|
|
34
|
+
// This is done through the `defaultPath` prop.
|
|
35
|
+
defaultPath: language === 'ts' ? 'file.tsx' : undefined
|
|
36
|
+
},
|
|
32
37
|
language
|
|
33
38
|
}
|
|
34
39
|
}), [field, language]);
|
|
@@ -57,11 +62,21 @@ export const CodeComponent = ({
|
|
|
57
62
|
monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
|
|
58
63
|
allowNonTsExtensions: true,
|
|
59
64
|
// Set module resolution to NodeJs to enable autocompletion
|
|
65
|
+
allowJs: true,
|
|
66
|
+
allowSyntheticDefaultImports: true,
|
|
67
|
+
esModuleInterop: true,
|
|
68
|
+
jsx: monaco.languages.typescript.JsxEmit.React,
|
|
60
69
|
moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,
|
|
70
|
+
noEmit: true,
|
|
61
71
|
paths: typescript?.paths,
|
|
72
|
+
reactNamespace: 'React',
|
|
62
73
|
target: monaco.languages.typescript.ScriptTarget[typescript?.target ?? 'ESNext'],
|
|
63
74
|
typeRoots: typescript?.typeRoots ?? ['node_modules/@types']
|
|
64
75
|
});
|
|
76
|
+
monaco.languages.typescript.typescriptDefaults.setDiagnosticsOptions({
|
|
77
|
+
noSemanticValidation: typescript?.enableSemanticValidation ? false : true,
|
|
78
|
+
noSyntaxValidation: false
|
|
79
|
+
});
|
|
65
80
|
const run = async () => {
|
|
66
81
|
if (typescript?.fetchTypes && Array.isArray(typescript.fetchTypes) && typescript.fetchTypes.length > 0) {
|
|
67
82
|
await Promise.all(typescript.fetchTypes.map(async type => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Code.js","names":["CodeField","useFormFields","React","useMemo","CodeComponent","autoComplete","field","forceRender","languages","js","plaintext","ts","path","permissions","readOnly","renderedBlocks","schemaPath","typescript","validate","languageField","fields","language","value","initialValue","label","props","type","admin","editorOptions","key","name","_jsx","onMount","_editor","monaco","editor","defineTheme","base","colors","inherit","rules","typescriptDefaults","setCompilerOptions","allowNonTsExtensions","moduleResolution","ModuleResolutionKind","NodeJs","paths","target","ScriptTarget","typeRoots","run","fetchTypes","Array","isArray","length","Promise","all","map","types","fetch","url","typesText","text","addExtraLib","filePath"],"sources":["../../../../../../src/features/blocks/premade/CodeBlock/Component/Code.tsx"],"sourcesContent":["'use client'\n\nimport type { CodeFieldClient, CodeFieldClientProps } from 'payload'\n\nimport { CodeField, useFormFields } from '@payloadcms/ui'\nimport React, { useMemo } from 'react'\n\nexport type AdditionalCodeComponentProps = {\n /**\n * @default first key of the `languages` prop\n */\n defaultLanguage?: string\n /**\n * @default\n * {\n * js: 'JavaScript',\n * plaintext: 'Plain Text',\n * ts: 'TypeScript',\n * }\n */\n languages?: Record<string, string>\n /**\n * Override the name of the block.\n *\n * @default 'Code'\n */\n slug?: string\n /**\n * Configure typescript settings for the editor\n */\n typescript?: {\n /**\n * Additional types to fetch and include in the editor for autocompletion.\n *\n * For example, to include types for payload, you would set this to\n *\n * [{ url: 'https://unpkg.com/payload@latest/dist/index.d.ts', filePath: 'file:///node_modules/payload/index.d.ts' }]\n */\n fetchTypes?: Array<{\n filePath: string\n url: string\n }>\n /**\n * @default undefined\n */\n paths?: Record<string, string[]>\n /**\n * @default \"ESNext\"\n */\n target?: string\n /**\n * @default ['node_modules/@types']\n */\n typeRoots?: string[]\n }\n}\n\nexport const CodeComponent: React.FC<AdditionalCodeComponentProps & CodeFieldClientProps> = ({\n autoComplete,\n field,\n forceRender,\n languages = {\n js: 'JavaScript',\n plaintext: 'Plain Text',\n ts: 'TypeScript',\n },\n path,\n permissions,\n readOnly,\n renderedBlocks,\n schemaPath,\n typescript,\n validate,\n}) => {\n const languageField = useFormFields(([fields]) => fields['language'])\n\n const language: string =\n (languageField?.value as string) || (languageField?.initialValue as string) || 'typescript'\n\n const label = languages[language]\n\n const props: CodeFieldClient = useMemo<CodeFieldClient>(\n () => ({\n ...field,\n type: 'code',\n admin: {\n ...field.admin,\n editorOptions: {},\n language,\n },\n }),\n [field, language],\n )\n\n const key = `${field.name}-${language}-${label}`\n\n return (\n props && (\n <CodeField\n autoComplete={autoComplete}\n field={props}\n forceRender={forceRender}\n key={key}\n onMount={(_editor, monaco) => {\n monaco.editor.defineTheme('vs-dark', {\n base: 'vs-dark',\n colors: {\n 'editor.background': '#222222',\n },\n inherit: true,\n rules: [],\n })\n\n monaco.editor.defineTheme('vs', {\n base: 'vs',\n colors: {\n 'editor.background': '#f5f5f5',\n },\n inherit: true,\n rules: [],\n })\n monaco.languages.typescript.typescriptDefaults.setCompilerOptions({\n allowNonTsExtensions: true,\n // Set module resolution to NodeJs to enable autocompletion\n moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,\n paths: typescript?.paths,\n target: monaco.languages.typescript.ScriptTarget[\n typescript?.target ?? ('ESNext' as any)\n ] as any,\n typeRoots: typescript?.typeRoots ?? ['node_modules/@types'],\n })\n const run = async () => {\n if (\n typescript?.fetchTypes &&\n Array.isArray(typescript.fetchTypes) &&\n typescript.fetchTypes.length > 0\n ) {\n await Promise.all(\n typescript.fetchTypes.map(async (type) => {\n const types = await fetch(type.url)\n const typesText = await types.text()\n monaco.languages.typescript.typescriptDefaults.addExtraLib(\n typesText,\n type.filePath,\n )\n }),\n )\n }\n }\n void run()\n }}\n path={path}\n permissions={permissions}\n readOnly={readOnly}\n renderedBlocks={renderedBlocks}\n schemaPath={schemaPath}\n validate={validate}\n />\n )\n )\n}\n"],"mappings":"AAAA;;;AAIA,SAASA,SAAS,EAAEC,aAAa,QAAQ;AACzC,OAAOC,KAAA,IAASC,OAAO,QAAQ;
|
|
1
|
+
{"version":3,"file":"Code.js","names":["CodeField","useFormFields","React","useMemo","CodeComponent","autoComplete","field","forceRender","languages","js","plaintext","ts","path","permissions","readOnly","renderedBlocks","schemaPath","typescript","validate","languageField","fields","language","value","initialValue","label","props","type","admin","editorOptions","editorProps","defaultPath","undefined","key","name","_jsx","onMount","_editor","monaco","editor","defineTheme","base","colors","inherit","rules","typescriptDefaults","setCompilerOptions","allowNonTsExtensions","allowJs","allowSyntheticDefaultImports","esModuleInterop","jsx","JsxEmit","moduleResolution","ModuleResolutionKind","NodeJs","noEmit","paths","reactNamespace","target","ScriptTarget","typeRoots","setDiagnosticsOptions","noSemanticValidation","enableSemanticValidation","noSyntaxValidation","run","fetchTypes","Array","isArray","length","Promise","all","map","types","fetch","url","typesText","text","addExtraLib","filePath"],"sources":["../../../../../../src/features/blocks/premade/CodeBlock/Component/Code.tsx"],"sourcesContent":["'use client'\n\nimport type { CodeFieldClient, CodeFieldClientProps } from 'payload'\n\nimport { CodeField, useFormFields } from '@payloadcms/ui'\nimport React, { useMemo } from 'react'\n\nexport type AdditionalCodeComponentProps = {\n /**\n * @default first key of the `languages` prop\n */\n defaultLanguage?: string\n /**\n * @default\n * {\n * js: 'JavaScript',\n * plaintext: 'Plain Text',\n * ts: 'TypeScript',\n * }\n */\n languages?: Record<string, string>\n /**\n * Override the name of the block.\n *\n * @default 'Code'\n */\n slug?: string\n /**\n * Configure typescript settings for the editor\n */\n typescript?: {\n /**\n * By default, the editor will not perform semantic validation. This means that\n * while syntax errors will be highlighted, other issues like missing imports or incorrect\n * types will not be.\n *\n * @default false\n */\n enableSemanticValidation?: boolean\n /**\n * Additional types to fetch and include in the editor for autocompletion.\n *\n * For example, to include types for payload, you would set this to\n *\n * [{ url: 'https://unpkg.com/payload@latest/dist/index.d.ts', filePath: 'file:///node_modules/payload/index.d.ts' }]\n */\n fetchTypes?: Array<{\n filePath: string\n url: string\n }>\n /**\n * @default undefined\n */\n paths?: Record<string, string[]>\n /**\n * @default \"ESNext\"\n */\n target?: string\n /**\n * @default ['node_modules/@types']\n */\n typeRoots?: string[]\n }\n}\n\nexport const CodeComponent: React.FC<AdditionalCodeComponentProps & CodeFieldClientProps> = ({\n autoComplete,\n field,\n forceRender,\n languages = {\n js: 'JavaScript',\n plaintext: 'Plain Text',\n ts: 'TypeScript',\n },\n path,\n permissions,\n readOnly,\n renderedBlocks,\n schemaPath,\n typescript,\n validate,\n}) => {\n const languageField = useFormFields(([fields]) => fields['language'])\n\n const language: string =\n (languageField?.value as string) || (languageField?.initialValue as string) || 'typescript'\n\n const label = languages[language]\n\n const props: CodeFieldClient = useMemo<CodeFieldClient>(\n () => ({\n ...field,\n type: 'code',\n admin: {\n ...field.admin,\n editorOptions: {},\n editorProps: {\n // If typescript is set, @monaco-editor/react needs to set the URI to a .ts or .tsx file when it calls createModel().\n // This is done through the `defaultPath` prop.\n defaultPath: language === 'ts' ? 'file.tsx' : undefined,\n },\n language,\n },\n }),\n [field, language],\n )\n\n const key = `${field.name}-${language}-${label}`\n\n return (\n props && (\n <CodeField\n autoComplete={autoComplete}\n field={props}\n forceRender={forceRender}\n key={key}\n onMount={(_editor, monaco) => {\n monaco.editor.defineTheme('vs-dark', {\n base: 'vs-dark',\n colors: {\n 'editor.background': '#222222',\n },\n inherit: true,\n rules: [],\n })\n\n monaco.editor.defineTheme('vs', {\n base: 'vs',\n colors: {\n 'editor.background': '#f5f5f5',\n },\n inherit: true,\n rules: [],\n })\n monaco.languages.typescript.typescriptDefaults.setCompilerOptions({\n allowNonTsExtensions: true,\n // Set module resolution to NodeJs to enable autocompletion\n allowJs: true,\n allowSyntheticDefaultImports: true,\n esModuleInterop: true,\n jsx: monaco.languages.typescript.JsxEmit.React,\n moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,\n noEmit: true,\n paths: typescript?.paths,\n reactNamespace: 'React',\n target: monaco.languages.typescript.ScriptTarget[\n typescript?.target ?? ('ESNext' as any)\n ] as any,\n typeRoots: typescript?.typeRoots ?? ['node_modules/@types'],\n })\n\n monaco.languages.typescript.typescriptDefaults.setDiagnosticsOptions({\n noSemanticValidation: typescript?.enableSemanticValidation ? false : true,\n noSyntaxValidation: false,\n })\n\n const run = async () => {\n if (\n typescript?.fetchTypes &&\n Array.isArray(typescript.fetchTypes) &&\n typescript.fetchTypes.length > 0\n ) {\n await Promise.all(\n typescript.fetchTypes.map(async (type) => {\n const types = await fetch(type.url)\n const typesText = await types.text()\n monaco.languages.typescript.typescriptDefaults.addExtraLib(\n typesText,\n type.filePath,\n )\n }),\n )\n }\n }\n void run()\n }}\n path={path}\n permissions={permissions}\n readOnly={readOnly}\n renderedBlocks={renderedBlocks}\n schemaPath={schemaPath}\n validate={validate}\n />\n )\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@payloadcms/richtext-lexical",
|
|
3
|
-
"version": "3.59.0-internal.
|
|
3
|
+
"version": "3.59.0-internal.58ab390",
|
|
4
4
|
"description": "The officially supported Lexical richtext adapter for Payload",
|
|
5
5
|
"homepage": "https://payloadcms.com",
|
|
6
6
|
"repository": {
|
|
@@ -373,8 +373,8 @@
|
|
|
373
373
|
"react-error-boundary": "4.1.2",
|
|
374
374
|
"ts-essentials": "10.0.3",
|
|
375
375
|
"uuid": "10.0.0",
|
|
376
|
-
"@payloadcms/
|
|
377
|
-
"@payloadcms/
|
|
376
|
+
"@payloadcms/ui": "3.59.0-internal.58ab390",
|
|
377
|
+
"@payloadcms/translations": "3.59.0-internal.58ab390"
|
|
378
378
|
},
|
|
379
379
|
"devDependencies": {
|
|
380
380
|
"@babel/cli": "7.27.2",
|
|
@@ -394,15 +394,15 @@
|
|
|
394
394
|
"esbuild-sass-plugin": "3.3.1",
|
|
395
395
|
"swc-plugin-transform-remove-imports": "4.0.4",
|
|
396
396
|
"@payloadcms/eslint-config": "3.28.0",
|
|
397
|
-
"payload": "3.59.0-internal.
|
|
397
|
+
"payload": "3.59.0-internal.58ab390"
|
|
398
398
|
},
|
|
399
399
|
"peerDependencies": {
|
|
400
400
|
"@faceless-ui/modal": "3.0.0",
|
|
401
401
|
"@faceless-ui/scroll-info": "2.0.0",
|
|
402
402
|
"react": "^19.0.0 || ^19.0.0-rc-65a56d0e-20241020",
|
|
403
403
|
"react-dom": "^19.0.0 || ^19.0.0-rc-65a56d0e-20241020",
|
|
404
|
-
"@payloadcms/next": "3.59.0-internal.
|
|
405
|
-
"payload": "3.59.0-internal.
|
|
404
|
+
"@payloadcms/next": "3.59.0-internal.58ab390",
|
|
405
|
+
"payload": "3.59.0-internal.58ab390"
|
|
406
406
|
},
|
|
407
407
|
"engines": {
|
|
408
408
|
"node": "^18.20.2 || >=20.9.0"
|