@payloadcms/richtext-slate 3.0.0-canary.926cbeb → 3.0.0-canary.95fcd13
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/data/populate.d.ts +2 -2
- package/dist/data/populate.d.ts.map +1 -1
- package/dist/data/populate.js.map +1 -1
- package/dist/data/recurseNestedFields.js +2 -2
- package/dist/data/recurseNestedFields.js.map +1 -1
- package/dist/field/RichText.d.ts +5 -4
- package/dist/field/RichText.d.ts.map +1 -1
- package/dist/field/RichText.js.map +1 -1
- package/dist/field/elements/link/Button/index.d.ts.map +1 -1
- package/dist/field/elements/link/Button/index.js +2 -1
- package/dist/field/elements/link/Button/index.js.map +1 -1
- package/dist/field/elements/link/Element/index.js +2 -2
- package/dist/field/elements/link/Element/index.js.map +1 -1
- package/dist/field/elements/link/LinkDrawer/types.d.ts +1 -2
- package/dist/field/elements/link/LinkDrawer/types.d.ts.map +1 -1
- package/dist/field/elements/link/LinkDrawer/types.js.map +1 -1
- package/dist/field/elements/link/types.d.ts +2 -2
- package/dist/field/elements/link/types.d.ts.map +1 -1
- package/dist/field/elements/link/types.js.map +1 -1
- package/dist/field/elements/relationship/Element/index.d.ts +3 -3
- package/dist/field/elements/relationship/Element/index.d.ts.map +1 -1
- package/dist/field/elements/relationship/Element/index.js.map +1 -1
- package/dist/field/elements/relationship/types.d.ts +2 -2
- package/dist/field/elements/relationship/types.d.ts.map +1 -1
- package/dist/field/elements/relationship/types.js.map +1 -1
- package/dist/field/elements/upload/Element/UploadDrawer/index.d.ts +3 -4
- package/dist/field/elements/upload/Element/UploadDrawer/index.d.ts.map +1 -1
- package/dist/field/elements/upload/Element/UploadDrawer/index.js.map +1 -1
- package/dist/field/elements/upload/Element/index.d.ts +3 -3
- package/dist/field/elements/upload/Element/index.d.ts.map +1 -1
- package/dist/field/elements/upload/Element/index.js.map +1 -1
- package/dist/field/elements/upload/types.d.ts +2 -2
- package/dist/field/elements/upload/types.d.ts.map +1 -1
- package/dist/field/elements/upload/types.js.map +1 -1
- package/dist/field/index.d.ts +3 -3
- package/dist/field/index.d.ts.map +1 -1
- package/dist/field/index.js.map +1 -1
- package/dist/field/index.scss +3 -1
- package/dist/field/providers/ElementButtonProvider.d.ts +5 -5
- package/dist/field/providers/ElementButtonProvider.d.ts.map +1 -1
- package/dist/field/providers/ElementButtonProvider.js.map +1 -1
- package/dist/field/providers/ElementProvider.d.ts +5 -5
- package/dist/field/providers/ElementProvider.d.ts.map +1 -1
- package/dist/field/providers/ElementProvider.js.map +1 -1
- package/dist/field/providers/LeafButtonProvider.d.ts +5 -5
- package/dist/field/providers/LeafButtonProvider.d.ts.map +1 -1
- package/dist/field/providers/LeafButtonProvider.js.map +1 -1
- package/dist/field/providers/LeafProvider.d.ts +5 -5
- package/dist/field/providers/LeafProvider.d.ts.map +1 -1
- package/dist/field/providers/LeafProvider.js.map +1 -1
- package/dist/scss/app.scss +4 -9
- package/dist/scss/colors.scss +76 -76
- package/dist/scss/toastify.scss +59 -0
- package/dist/scss/toasts.scss +75 -45
- package/dist/scss/type.scss +14 -23
- package/dist/scss/vars.scss +26 -47
- package/package.json +12 -12
|
@@ -1,14 +1,13 @@
|
|
|
1
|
-
import type { FormFieldBase } from '
|
|
2
|
-
import type { ClientCollectionConfig } from 'payload';
|
|
1
|
+
import type { ClientCollectionConfig, FormFieldBase } from 'payload';
|
|
3
2
|
import React from 'react';
|
|
4
3
|
import type { UploadElementType } from '../../types.js';
|
|
5
4
|
export declare const UploadDrawer: React.FC<{
|
|
6
5
|
drawerSlug: string;
|
|
7
6
|
element: UploadElementType;
|
|
8
|
-
fieldProps:
|
|
7
|
+
fieldProps: {
|
|
9
8
|
name: string;
|
|
10
9
|
richTextComponentMap: Map<string, React.ReactNode>;
|
|
11
|
-
};
|
|
10
|
+
} & FormFieldBase;
|
|
12
11
|
relatedCollection: ClientCollectionConfig;
|
|
13
12
|
schemaPath: string;
|
|
14
13
|
}>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/field/elements/upload/Element/UploadDrawer/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/field/elements/upload/Element/UploadDrawer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAiBpE,OAAO,KAA2C,MAAM,OAAO,CAAA;AAI/D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAIvD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC;IAClC,UAAU,EAAE,MAAM,CAAA;IAClB,OAAO,EAAE,iBAAiB,CAAA;IAC1B,UAAU,EAAE;QACV,IAAI,EAAE,MAAM,CAAA;QACZ,oBAAoB,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;KACnD,GAAG,aAAa,CAAA;IACjB,iBAAiB,EAAE,sBAAsB,CAAA;IACzC,UAAU,EAAE,MAAM,CAAA;CACnB,CAyGA,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../../src/field/elements/upload/Element/UploadDrawer/index.tsx"],"sourcesContent":["'use client'\n\nimport type {
|
|
1
|
+
{"version":3,"sources":["../../../../../../src/field/elements/upload/Element/UploadDrawer/index.tsx"],"sourcesContent":["'use client'\n\nimport type { FormProps } from '@payloadcms/ui'\nimport type { ClientCollectionConfig, FormFieldBase } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n Drawer,\n Form,\n FormSubmit,\n RenderFields,\n useAuth,\n useConfig,\n useDocumentInfo,\n useLocale,\n useModal,\n useTranslation,\n} from '@payloadcms/ui'\nimport { getFormState } from '@payloadcms/ui/shared'\nimport { deepCopyObject } from 'payload/shared'\nimport React, { useCallback, useEffect, useState } from 'react'\nimport { Transforms } from 'slate'\nimport { ReactEditor, useSlateStatic } from 'slate-react'\n\nimport type { UploadElementType } from '../../types.js'\n\nimport { uploadFieldsSchemaPath } from '../../shared.js'\n\nexport const UploadDrawer: React.FC<{\n drawerSlug: string\n element: UploadElementType\n fieldProps: {\n name: string\n richTextComponentMap: Map<string, React.ReactNode>\n } & FormFieldBase\n relatedCollection: ClientCollectionConfig\n schemaPath: string\n}> = (props) => {\n const editor = useSlateStatic()\n\n const { drawerSlug, element, fieldProps, relatedCollection, schemaPath } = props\n\n const { i18n, t } = useTranslation()\n const { code: locale } = useLocale()\n const { user } = useAuth()\n const { closeModal } = useModal()\n const { id, collectionSlug } = useDocumentInfo()\n const [initialState, setInitialState] = useState({})\n const { richTextComponentMap } = fieldProps\n\n const relatedFieldSchemaPath = `${uploadFieldsSchemaPath}.${relatedCollection.slug}`\n const fieldMap = richTextComponentMap.get(relatedFieldSchemaPath)\n\n const config = useConfig()\n\n const handleUpdateEditData = useCallback(\n (_, data) => {\n const newNode = {\n fields: data,\n }\n\n const elementPath = ReactEditor.findPath(editor, element)\n\n Transforms.setNodes(editor, newNode, { at: elementPath })\n closeModal(drawerSlug)\n },\n [closeModal, editor, element, drawerSlug],\n )\n\n useEffect(() => {\n const data = deepCopyObject(element?.fields || {})\n\n const awaitInitialState = async () => {\n const state = await getFormState({\n apiRoute: config.routes.api,\n body: {\n id,\n collectionSlug,\n data,\n operation: 'update',\n schemaPath: `${schemaPath}.${uploadFieldsSchemaPath}.${relatedCollection.slug}`,\n },\n serverURL: config.serverURL,\n })\n\n setInitialState(state)\n }\n\n void awaitInitialState()\n }, [\n config,\n element?.fields,\n user,\n locale,\n t,\n collectionSlug,\n id,\n schemaPath,\n relatedCollection.slug,\n ])\n\n const onChange: FormProps['onChange'][0] = useCallback(\n async ({ formState: prevFormState }) => {\n return await getFormState({\n apiRoute: config.routes.api,\n body: {\n id,\n formState: prevFormState,\n operation: 'update',\n schemaPath: `${schemaPath}.${uploadFieldsSchemaPath}.${relatedCollection.slug}`,\n },\n serverURL: config.serverURL,\n })\n },\n\n [config.routes.api, config.serverURL, relatedCollection.slug, schemaPath, id],\n )\n\n return (\n <Drawer\n slug={drawerSlug}\n title={t('general:editLabel', {\n label: getTranslation(relatedCollection.labels.singular, i18n),\n })}\n >\n <Form\n beforeSubmit={[onChange]}\n disableValidationOnSubmit\n initialState={initialState}\n onChange={[onChange]}\n onSubmit={handleUpdateEditData}\n >\n <RenderFields\n fieldMap={Array.isArray(fieldMap) ? fieldMap : []}\n path=\"\"\n readOnly={false}\n schemaPath=\"\"\n />\n <FormSubmit>{t('fields:saveChanges')}</FormSubmit>\n </Form>\n </Drawer>\n )\n}\n"],"names":["getTranslation","Drawer","Form","FormSubmit","RenderFields","useAuth","useConfig","useDocumentInfo","useLocale","useModal","useTranslation","getFormState","deepCopyObject","React","useCallback","useEffect","useState","Transforms","ReactEditor","useSlateStatic","uploadFieldsSchemaPath","UploadDrawer","props","editor","drawerSlug","element","fieldProps","relatedCollection","schemaPath","i18n","t","code","locale","user","closeModal","id","collectionSlug","initialState","setInitialState","richTextComponentMap","relatedFieldSchemaPath","slug","fieldMap","get","config","handleUpdateEditData","_","data","newNode","fields","elementPath","findPath","setNodes","at","awaitInitialState","state","apiRoute","routes","api","body","operation","serverURL","onChange","formState","prevFormState","title","label","labels","singular","beforeSubmit","disableValidationOnSubmit","onSubmit","Array","isArray","path","readOnly"],"mappings":"AAAA;;AAKA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SACEC,MAAM,EACNC,IAAI,EACJC,UAAU,EACVC,YAAY,EACZC,OAAO,EACPC,SAAS,EACTC,eAAe,EACfC,SAAS,EACTC,QAAQ,EACRC,cAAc,QACT,iBAAgB;AACvB,SAASC,YAAY,QAAQ,wBAAuB;AACpD,SAASC,cAAc,QAAQ,iBAAgB;AAC/C,OAAOC,SAASC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AAC/D,SAASC,UAAU,QAAQ,QAAO;AAClC,SAASC,WAAW,EAAEC,cAAc,QAAQ,cAAa;AAIzD,SAASC,sBAAsB,QAAQ,kBAAiB;AAExD,OAAO,MAAMC,eASR,CAACC;IACJ,MAAMC,SAASJ;IAEf,MAAM,EAAEK,UAAU,EAAEC,OAAO,EAAEC,UAAU,EAAEC,iBAAiB,EAAEC,UAAU,EAAE,GAAGN;IAE3E,MAAM,EAAEO,IAAI,EAAEC,CAAC,EAAE,GAAGpB;IACpB,MAAM,EAAEqB,MAAMC,MAAM,EAAE,GAAGxB;IACzB,MAAM,EAAEyB,IAAI,EAAE,GAAG5B;IACjB,MAAM,EAAE6B,UAAU,EAAE,GAAGzB;IACvB,MAAM,EAAE0B,EAAE,EAAEC,cAAc,EAAE,GAAG7B;IAC/B,MAAM,CAAC8B,cAAcC,gBAAgB,GAAGtB,SAAS,CAAC;IAClD,MAAM,EAAEuB,oBAAoB,EAAE,GAAGb;IAEjC,MAAMc,yBAAyB,CAAC,EAAEpB,uBAAuB,CAAC,EAAEO,kBAAkBc,IAAI,CAAC,CAAC;IACpF,MAAMC,WAAWH,qBAAqBI,GAAG,CAACH;IAE1C,MAAMI,SAAStC;IAEf,MAAMuC,uBAAuB/B,YAC3B,CAACgC,GAAGC;QACF,MAAMC,UAAU;YACdC,QAAQF;QACV;QAEA,MAAMG,cAAchC,YAAYiC,QAAQ,CAAC5B,QAAQE;QAEjDR,WAAWmC,QAAQ,CAAC7B,QAAQyB,SAAS;YAAEK,IAAIH;QAAY;QACvDhB,WAAWV;IACb,GACA;QAACU;QAAYX;QAAQE;QAASD;KAAW;IAG3CT,UAAU;QACR,MAAMgC,OAAOnC,eAAea,SAASwB,UAAU,CAAC;QAEhD,MAAMK,oBAAoB;YACxB,MAAMC,QAAQ,MAAM5C,aAAa;gBAC/B6C,UAAUZ,OAAOa,MAAM,CAACC,GAAG;gBAC3BC,MAAM;oBACJxB;oBACAC;oBACAW;oBACAa,WAAW;oBACXhC,YAAY,CAAC,EAAEA,WAAW,CAAC,EAAER,uBAAuB,CAAC,EAAEO,kBAAkBc,IAAI,CAAC,CAAC;gBACjF;gBACAoB,WAAWjB,OAAOiB,SAAS;YAC7B;YAEAvB,gBAAgBiB;QAClB;QAEA,KAAKD;IACP,GAAG;QACDV;QACAnB,SAASwB;QACThB;QACAD;QACAF;QACAM;QACAD;QACAP;QACAD,kBAAkBc,IAAI;KACvB;IAED,MAAMqB,WAAqChD,YACzC,OAAO,EAAEiD,WAAWC,aAAa,EAAE;QACjC,OAAO,MAAMrD,aAAa;YACxB6C,UAAUZ,OAAOa,MAAM,CAACC,GAAG;YAC3BC,MAAM;gBACJxB;gBACA4B,WAAWC;gBACXJ,WAAW;gBACXhC,YAAY,CAAC,EAAEA,WAAW,CAAC,EAAER,uBAAuB,CAAC,EAAEO,kBAAkBc,IAAI,CAAC,CAAC;YACjF;YACAoB,WAAWjB,OAAOiB,SAAS;QAC7B;IACF,GAEA;QAACjB,OAAOa,MAAM,CAACC,GAAG;QAAEd,OAAOiB,SAAS;QAAElC,kBAAkBc,IAAI;QAAEb;QAAYO;KAAG;IAG/E,qBACE,KAAClC;QACCwC,MAAMjB;QACNyC,OAAOnC,EAAE,qBAAqB;YAC5BoC,OAAOlE,eAAe2B,kBAAkBwC,MAAM,CAACC,QAAQ,EAAEvC;QAC3D;kBAEA,cAAA,MAAC3B;YACCmE,cAAc;gBAACP;aAAS;YACxBQ,yBAAyB;YACzBjC,cAAcA;YACdyB,UAAU;gBAACA;aAAS;YACpBS,UAAU1B;;8BAEV,KAACzC;oBACCsC,UAAU8B,MAAMC,OAAO,CAAC/B,YAAYA,WAAW,EAAE;oBACjDgC,MAAK;oBACLC,UAAU;oBACV/C,YAAW;;8BAEb,KAACzB;8BAAY2B,EAAE;;;;;AAIvB,EAAC"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import type { FormFieldBase } from '
|
|
1
|
+
import type { FormFieldBase } from 'payload';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import './index.scss';
|
|
4
|
-
type Props =
|
|
4
|
+
type Props = {
|
|
5
5
|
name: string;
|
|
6
6
|
richTextComponentMap: Map<string, React.ReactNode>;
|
|
7
|
-
};
|
|
7
|
+
} & FormFieldBase;
|
|
8
8
|
export declare const Element: (props: Props) => React.ReactNode;
|
|
9
9
|
export {};
|
|
10
10
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/field/elements/upload/Element/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/field/elements/upload/Element/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAe5C,OAAO,KAA4C,MAAM,OAAO,CAAA;AAUhE,OAAO,cAAc,CAAA;AAQrB,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,oBAAoB,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;CACnD,GAAG,aAAa,CAAA;AAwLjB,eAAO,MAAM,OAAO,UAAW,KAAK,KAAG,KAAK,CAAC,SAM5C,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/field/elements/upload/Element/index.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '@payloadcms/ui'\nimport type { ClientCollectionConfig } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n Button,\n DrawerToggler,\n File,\n useConfig,\n useDocumentDrawer,\n useDrawerSlug,\n useListDrawer,\n usePayloadAPI,\n useTranslation,\n} from '@payloadcms/ui'\nimport React, { useCallback, useReducer, useState } from 'react'\nimport { Transforms } from 'slate'\nimport { ReactEditor, useFocused, useSelected, useSlateStatic } from 'slate-react'\n\nimport type { UploadElementType } from '../types.js'\n\nimport { useElement } from '../../../providers/ElementProvider.js'\nimport { EnabledRelationshipsCondition } from '../../EnabledRelationshipsCondition.js'\nimport { uploadFieldsSchemaPath, uploadName } from '../shared.js'\nimport { UploadDrawer } from './UploadDrawer/index.js'\nimport './index.scss'\n\nconst baseClass = 'rich-text-upload'\n\nconst initialParams = {\n depth: 0,\n}\n\ntype Props = FormFieldBase & {\n name: string\n richTextComponentMap: Map<string, React.ReactNode>\n}\n\nconst UploadElement: React.FC<Props & { enabledCollectionSlugs?: string[] }> = ({\n enabledCollectionSlugs,\n}) => {\n const {\n attributes,\n children,\n element: { relationTo, value },\n element,\n fieldProps,\n schemaPath,\n } = useElement<UploadElementType>()\n\n const {\n collections,\n routes: { api },\n serverURL,\n } = useConfig()\n const { i18n, t } = useTranslation()\n const [cacheBust, dispatchCacheBust] = useReducer((state) => state + 1, 0)\n const [relatedCollection, setRelatedCollection] = useState<ClientCollectionConfig>(() =>\n collections.find((coll) => coll.slug === relationTo),\n )\n\n const drawerSlug = useDrawerSlug('upload-drawer')\n\n const [ListDrawer, ListDrawerToggler, { closeDrawer: closeListDrawer }] = useListDrawer({\n collectionSlugs: enabledCollectionSlugs,\n selectedCollection: relatedCollection.slug,\n })\n\n const [DocumentDrawer, DocumentDrawerToggler, { closeDrawer }] = useDocumentDrawer({\n id: value?.id,\n collectionSlug: relatedCollection.slug,\n })\n\n const editor = useSlateStatic()\n const selected = useSelected()\n const focused = useFocused()\n\n // Get the referenced document\n const [{ data }, { setParams }] = usePayloadAPI(\n `${serverURL}${api}/${relatedCollection.slug}/${value?.id}`,\n { initialParams },\n )\n\n const thumbnailSRC = data?.thumbnailURL || data?.url\n\n const removeUpload = useCallback(() => {\n const elementPath = ReactEditor.findPath(editor, element)\n\n Transforms.removeNodes(editor, { at: elementPath })\n }, [editor, element])\n\n const updateUpload = useCallback(\n (json) => {\n const { doc } = json\n\n const newNode = {\n fields: doc,\n }\n\n const elementPath = ReactEditor.findPath(editor, element)\n\n Transforms.setNodes(editor, newNode, { at: elementPath })\n\n setParams({\n ...initialParams,\n cacheBust, // do this to get the usePayloadAPI to re-fetch the data even though the URL string hasn't changed\n })\n\n dispatchCacheBust()\n closeDrawer()\n },\n [editor, element, setParams, cacheBust, closeDrawer],\n )\n\n const swapUpload = React.useCallback(\n ({ collectionSlug, docID }) => {\n const newNode = {\n type: uploadName,\n children: [{ text: ' ' }],\n relationTo: collectionSlug,\n value: { id: docID },\n }\n\n const elementPath = ReactEditor.findPath(editor, element)\n\n setRelatedCollection(collections.find((coll) => coll.slug === collectionSlug))\n\n Transforms.setNodes(editor, newNode, { at: elementPath })\n\n dispatchCacheBust()\n closeListDrawer()\n },\n [closeListDrawer, editor, element, collections],\n )\n\n const relatedFieldSchemaPath = `${uploadFieldsSchemaPath}.${relatedCollection.slug}`\n const customFieldsMap = fieldProps.richTextComponentMap.get(relatedFieldSchemaPath)\n\n return (\n <div\n className={[baseClass, selected && focused && `${baseClass}--selected`]\n .filter(Boolean)\n .join(' ')}\n contentEditable={false}\n {...attributes}\n >\n <div className={`${baseClass}__card`}>\n <div className={`${baseClass}__topRow`}>\n {/* TODO: migrate to use Thumbnail component */}\n <div className={`${baseClass}__thumbnail`}>\n {thumbnailSRC ? <img alt={data?.filename} src={thumbnailSRC} /> : <File />}\n </div>\n <div className={`${baseClass}__topRowRightPanel`}>\n <div className={`${baseClass}__collectionLabel`}>\n {getTranslation(relatedCollection.labels.singular, i18n)}\n </div>\n <div className={`${baseClass}__actions`}>\n {Boolean(customFieldsMap) && (\n <DrawerToggler\n className={`${baseClass}__upload-drawer-toggler`}\n disabled={fieldProps?.readOnly}\n slug={drawerSlug}\n >\n <Button\n buttonStyle=\"icon-label\"\n el=\"div\"\n icon=\"edit\"\n onClick={(e) => {\n e.preventDefault()\n }}\n round\n tooltip={t('fields:editRelationship')}\n />\n </DrawerToggler>\n )}\n <ListDrawerToggler\n className={`${baseClass}__list-drawer-toggler`}\n disabled={fieldProps?.readOnly}\n >\n <Button\n buttonStyle=\"icon-label\"\n disabled={fieldProps?.readOnly}\n el=\"div\"\n icon=\"swap\"\n onClick={() => {\n // do nothing\n }}\n round\n tooltip={t('fields:swapUpload')}\n />\n </ListDrawerToggler>\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__removeButton`}\n disabled={fieldProps?.readOnly}\n icon=\"x\"\n onClick={(e) => {\n e.preventDefault()\n removeUpload()\n }}\n round\n tooltip={t('fields:removeUpload')}\n />\n </div>\n </div>\n </div>\n <div className={`${baseClass}__bottomRow`}>\n <DocumentDrawerToggler className={`${baseClass}__doc-drawer-toggler`}>\n <strong>{data?.filename}</strong>\n </DocumentDrawerToggler>\n </div>\n </div>\n {children}\n {value?.id && <DocumentDrawer onSave={updateUpload} />}\n <ListDrawer onSelect={swapUpload} />\n <UploadDrawer {...{ drawerSlug, element, fieldProps, relatedCollection, schemaPath }} />\n </div>\n )\n}\n\nexport const Element = (props: Props): React.ReactNode => {\n return (\n <EnabledRelationshipsCondition {...props} uploads>\n <UploadElement {...props} />\n </EnabledRelationshipsCondition>\n )\n}\n"],"names":["getTranslation","Button","DrawerToggler","File","useConfig","useDocumentDrawer","useDrawerSlug","useListDrawer","usePayloadAPI","useTranslation","React","useCallback","useReducer","useState","Transforms","ReactEditor","useFocused","useSelected","useSlateStatic","useElement","EnabledRelationshipsCondition","uploadFieldsSchemaPath","uploadName","UploadDrawer","baseClass","initialParams","depth","UploadElement","enabledCollectionSlugs","attributes","children","element","relationTo","value","fieldProps","schemaPath","collections","routes","api","serverURL","i18n","t","cacheBust","dispatchCacheBust","state","relatedCollection","setRelatedCollection","find","coll","slug","drawerSlug","ListDrawer","ListDrawerToggler","closeDrawer","closeListDrawer","collectionSlugs","selectedCollection","DocumentDrawer","DocumentDrawerToggler","id","collectionSlug","editor","selected","focused","data","setParams","thumbnailSRC","thumbnailURL","url","removeUpload","elementPath","findPath","removeNodes","at","updateUpload","json","doc","newNode","fields","setNodes","swapUpload","docID","type","text","relatedFieldSchemaPath","customFieldsMap","richTextComponentMap","get","div","className","filter","Boolean","join","contentEditable","img","alt","filename","src","labels","singular","disabled","readOnly","buttonStyle","el","icon","onClick","e","preventDefault","round","tooltip","strong","onSave","onSelect","Element","props","uploads"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../../../src/field/elements/upload/Element/index.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from 'payload'\nimport type { ClientCollectionConfig } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n Button,\n DrawerToggler,\n File,\n useConfig,\n useDocumentDrawer,\n useDrawerSlug,\n useListDrawer,\n usePayloadAPI,\n useTranslation,\n} from '@payloadcms/ui'\nimport React, { useCallback, useReducer, useState } from 'react'\nimport { Transforms } from 'slate'\nimport { ReactEditor, useFocused, useSelected, useSlateStatic } from 'slate-react'\n\nimport type { UploadElementType } from '../types.js'\n\nimport { useElement } from '../../../providers/ElementProvider.js'\nimport { EnabledRelationshipsCondition } from '../../EnabledRelationshipsCondition.js'\nimport { uploadFieldsSchemaPath, uploadName } from '../shared.js'\nimport { UploadDrawer } from './UploadDrawer/index.js'\nimport './index.scss'\n\nconst baseClass = 'rich-text-upload'\n\nconst initialParams = {\n depth: 0,\n}\n\ntype Props = {\n name: string\n richTextComponentMap: Map<string, React.ReactNode>\n} & FormFieldBase\n\nconst UploadElement: React.FC<{ enabledCollectionSlugs?: string[] } & Props> = ({\n enabledCollectionSlugs,\n}) => {\n const {\n attributes,\n children,\n element: { relationTo, value },\n element,\n fieldProps,\n schemaPath,\n } = useElement<UploadElementType>()\n\n const {\n collections,\n routes: { api },\n serverURL,\n } = useConfig()\n const { i18n, t } = useTranslation()\n const [cacheBust, dispatchCacheBust] = useReducer((state) => state + 1, 0)\n const [relatedCollection, setRelatedCollection] = useState<ClientCollectionConfig>(() =>\n collections.find((coll) => coll.slug === relationTo),\n )\n\n const drawerSlug = useDrawerSlug('upload-drawer')\n\n const [ListDrawer, ListDrawerToggler, { closeDrawer: closeListDrawer }] = useListDrawer({\n collectionSlugs: enabledCollectionSlugs,\n selectedCollection: relatedCollection.slug,\n })\n\n const [DocumentDrawer, DocumentDrawerToggler, { closeDrawer }] = useDocumentDrawer({\n id: value?.id,\n collectionSlug: relatedCollection.slug,\n })\n\n const editor = useSlateStatic()\n const selected = useSelected()\n const focused = useFocused()\n\n // Get the referenced document\n const [{ data }, { setParams }] = usePayloadAPI(\n `${serverURL}${api}/${relatedCollection.slug}/${value?.id}`,\n { initialParams },\n )\n\n const thumbnailSRC = data?.thumbnailURL || data?.url\n\n const removeUpload = useCallback(() => {\n const elementPath = ReactEditor.findPath(editor, element)\n\n Transforms.removeNodes(editor, { at: elementPath })\n }, [editor, element])\n\n const updateUpload = useCallback(\n (json) => {\n const { doc } = json\n\n const newNode = {\n fields: doc,\n }\n\n const elementPath = ReactEditor.findPath(editor, element)\n\n Transforms.setNodes(editor, newNode, { at: elementPath })\n\n setParams({\n ...initialParams,\n cacheBust, // do this to get the usePayloadAPI to re-fetch the data even though the URL string hasn't changed\n })\n\n dispatchCacheBust()\n closeDrawer()\n },\n [editor, element, setParams, cacheBust, closeDrawer],\n )\n\n const swapUpload = React.useCallback(\n ({ collectionSlug, docID }) => {\n const newNode = {\n type: uploadName,\n children: [{ text: ' ' }],\n relationTo: collectionSlug,\n value: { id: docID },\n }\n\n const elementPath = ReactEditor.findPath(editor, element)\n\n setRelatedCollection(collections.find((coll) => coll.slug === collectionSlug))\n\n Transforms.setNodes(editor, newNode, { at: elementPath })\n\n dispatchCacheBust()\n closeListDrawer()\n },\n [closeListDrawer, editor, element, collections],\n )\n\n const relatedFieldSchemaPath = `${uploadFieldsSchemaPath}.${relatedCollection.slug}`\n const customFieldsMap = fieldProps.richTextComponentMap.get(relatedFieldSchemaPath)\n\n return (\n <div\n className={[baseClass, selected && focused && `${baseClass}--selected`]\n .filter(Boolean)\n .join(' ')}\n contentEditable={false}\n {...attributes}\n >\n <div className={`${baseClass}__card`}>\n <div className={`${baseClass}__topRow`}>\n {/* TODO: migrate to use Thumbnail component */}\n <div className={`${baseClass}__thumbnail`}>\n {thumbnailSRC ? <img alt={data?.filename} src={thumbnailSRC} /> : <File />}\n </div>\n <div className={`${baseClass}__topRowRightPanel`}>\n <div className={`${baseClass}__collectionLabel`}>\n {getTranslation(relatedCollection.labels.singular, i18n)}\n </div>\n <div className={`${baseClass}__actions`}>\n {Boolean(customFieldsMap) && (\n <DrawerToggler\n className={`${baseClass}__upload-drawer-toggler`}\n disabled={fieldProps?.readOnly}\n slug={drawerSlug}\n >\n <Button\n buttonStyle=\"icon-label\"\n el=\"div\"\n icon=\"edit\"\n onClick={(e) => {\n e.preventDefault()\n }}\n round\n tooltip={t('fields:editRelationship')}\n />\n </DrawerToggler>\n )}\n <ListDrawerToggler\n className={`${baseClass}__list-drawer-toggler`}\n disabled={fieldProps?.readOnly}\n >\n <Button\n buttonStyle=\"icon-label\"\n disabled={fieldProps?.readOnly}\n el=\"div\"\n icon=\"swap\"\n onClick={() => {\n // do nothing\n }}\n round\n tooltip={t('fields:swapUpload')}\n />\n </ListDrawerToggler>\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__removeButton`}\n disabled={fieldProps?.readOnly}\n icon=\"x\"\n onClick={(e) => {\n e.preventDefault()\n removeUpload()\n }}\n round\n tooltip={t('fields:removeUpload')}\n />\n </div>\n </div>\n </div>\n <div className={`${baseClass}__bottomRow`}>\n <DocumentDrawerToggler className={`${baseClass}__doc-drawer-toggler`}>\n <strong>{data?.filename}</strong>\n </DocumentDrawerToggler>\n </div>\n </div>\n {children}\n {value?.id && <DocumentDrawer onSave={updateUpload} />}\n <ListDrawer onSelect={swapUpload} />\n <UploadDrawer {...{ drawerSlug, element, fieldProps, relatedCollection, schemaPath }} />\n </div>\n )\n}\n\nexport const Element = (props: Props): React.ReactNode => {\n return (\n <EnabledRelationshipsCondition {...props} uploads>\n <UploadElement {...props} />\n </EnabledRelationshipsCondition>\n )\n}\n"],"names":["getTranslation","Button","DrawerToggler","File","useConfig","useDocumentDrawer","useDrawerSlug","useListDrawer","usePayloadAPI","useTranslation","React","useCallback","useReducer","useState","Transforms","ReactEditor","useFocused","useSelected","useSlateStatic","useElement","EnabledRelationshipsCondition","uploadFieldsSchemaPath","uploadName","UploadDrawer","baseClass","initialParams","depth","UploadElement","enabledCollectionSlugs","attributes","children","element","relationTo","value","fieldProps","schemaPath","collections","routes","api","serverURL","i18n","t","cacheBust","dispatchCacheBust","state","relatedCollection","setRelatedCollection","find","coll","slug","drawerSlug","ListDrawer","ListDrawerToggler","closeDrawer","closeListDrawer","collectionSlugs","selectedCollection","DocumentDrawer","DocumentDrawerToggler","id","collectionSlug","editor","selected","focused","data","setParams","thumbnailSRC","thumbnailURL","url","removeUpload","elementPath","findPath","removeNodes","at","updateUpload","json","doc","newNode","fields","setNodes","swapUpload","docID","type","text","relatedFieldSchemaPath","customFieldsMap","richTextComponentMap","get","div","className","filter","Boolean","join","contentEditable","img","alt","filename","src","labels","singular","disabled","readOnly","buttonStyle","el","icon","onClick","e","preventDefault","round","tooltip","strong","onSave","onSelect","Element","props","uploads"],"mappings":"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"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import type { Element } from 'slate';
|
|
2
|
-
export type UploadElementType =
|
|
2
|
+
export type UploadElementType = {
|
|
3
3
|
fields: Record<string, unknown>;
|
|
4
4
|
relationTo: string;
|
|
5
5
|
value: {
|
|
6
6
|
id: number | string;
|
|
7
7
|
} | null;
|
|
8
|
-
};
|
|
8
|
+
} & Element;
|
|
9
9
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/field/elements/upload/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAEpC,MAAM,MAAM,iBAAiB,GAAG
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/field/elements/upload/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAEpC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IAC/B,UAAU,EAAE,MAAM,CAAA;IAClB,KAAK,EAAE;QACL,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;KACpB,GAAG,IAAI,CAAA;CACT,GAAG,OAAO,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/field/elements/upload/types.ts"],"sourcesContent":["import type { Element } from 'slate'\n\nexport type UploadElementType =
|
|
1
|
+
{"version":3,"sources":["../../../../src/field/elements/upload/types.ts"],"sourcesContent":["import type { Element } from 'slate'\n\nexport type UploadElementType = {\n fields: Record<string, unknown>\n relationTo: string\n value: {\n id: number | string\n } | null\n} & Element\n"],"names":[],"mappings":"AAEA,WAMW"}
|
package/dist/field/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import type { FormFieldBase } from '
|
|
1
|
+
import type { FormFieldBase } from 'payload';
|
|
2
2
|
import React from 'react';
|
|
3
|
-
export declare const RichTextField: React.FC<
|
|
3
|
+
export declare const RichTextField: React.FC<{
|
|
4
4
|
name: string;
|
|
5
5
|
richTextComponentMap: Map<string, React.ReactNode>;
|
|
6
|
-
}>;
|
|
6
|
+
} & FormFieldBase>;
|
|
7
7
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/field/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/field/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAG5C,OAAO,KAA8C,MAAM,OAAO,CAAA;AAalE,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAClC;IACE,IAAI,EAAE,MAAM,CAAA;IACZ,oBAAoB,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;CACnD,GAAG,aAAa,CAoDlB,CAAA"}
|
package/dist/field/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/field/index.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '
|
|
1
|
+
{"version":3,"sources":["../../src/field/index.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from 'payload'\n\nimport { ShimmerEffect, useClientFunctions, useFieldProps } from '@payloadcms/ui'\nimport React, { Suspense, lazy, useEffect, useState } from 'react'\n\nimport type { RichTextPlugin } from '../types.js'\nimport type { EnabledFeatures } from './types.js'\n\nimport { createFeatureMap } from './createFeatureMap.js'\n\nconst RichTextEditor = lazy(() =>\n import('./RichText.js').then((module) => ({\n default: module.RichText,\n })),\n)\n\nexport const RichTextField: React.FC<\n {\n name: string\n richTextComponentMap: Map<string, React.ReactNode>\n } & FormFieldBase\n> = (props) => {\n const { richTextComponentMap } = props\n\n const { schemaPath } = useFieldProps()\n const clientFunctions = useClientFunctions()\n const [hasLoadedPlugins, setHasLoadedPlugins] = useState(false)\n\n const [features] = useState<EnabledFeatures>(() => {\n return createFeatureMap(richTextComponentMap)\n })\n\n const [plugins, setPlugins] = useState<RichTextPlugin[]>([])\n\n useEffect(() => {\n if (!hasLoadedPlugins) {\n const plugins: RichTextPlugin[] = []\n\n Object.entries(clientFunctions).forEach(([key, plugin]) => {\n if (key.startsWith(`slatePlugin.${schemaPath}.`)) {\n plugins.push(plugin)\n }\n })\n\n if (plugins.length === features.plugins.length) {\n setPlugins(plugins)\n setHasLoadedPlugins(true)\n }\n }\n }, [hasLoadedPlugins, clientFunctions, schemaPath, features.plugins.length])\n\n if (!hasLoadedPlugins) {\n return (\n <React.Fragment>\n {Array.isArray(features.plugins) &&\n features.plugins.map((Plugin, i) => {\n return <React.Fragment key={i}>{Plugin}</React.Fragment>\n })}\n </React.Fragment>\n )\n }\n\n return (\n <Suspense fallback={<ShimmerEffect height=\"35vh\" />}>\n <RichTextEditor\n {...props}\n elements={features.elements}\n leaves={features.leaves}\n plugins={plugins}\n />\n </Suspense>\n )\n}\n"],"names":["ShimmerEffect","useClientFunctions","useFieldProps","React","Suspense","lazy","useEffect","useState","createFeatureMap","RichTextEditor","then","module","default","RichText","RichTextField","props","richTextComponentMap","schemaPath","clientFunctions","hasLoadedPlugins","setHasLoadedPlugins","features","plugins","setPlugins","Object","entries","forEach","key","plugin","startsWith","push","length","Fragment","Array","isArray","map","Plugin","i","fallback","height","elements","leaves"],"mappings":"AAAA;;AAIA,SAASA,aAAa,EAAEC,kBAAkB,EAAEC,aAAa,QAAQ,iBAAgB;AACjF,OAAOC,SAASC,QAAQ,EAAEC,IAAI,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AAKlE,SAASC,gBAAgB,QAAQ,wBAAuB;AAExD,MAAMC,+BAAiBJ,KAAK,IAC1B,MAAM,CAAC,iBAAiBK,IAAI,CAAC,CAACC,SAAY,CAAA;YACxCC,SAASD,OAAOE,QAAQ;QAC1B,CAAA;AAGF,OAAO,MAAMC,gBAKT,CAACC;IACH,MAAM,EAAEC,oBAAoB,EAAE,GAAGD;IAEjC,MAAM,EAAEE,UAAU,EAAE,GAAGf;IACvB,MAAMgB,kBAAkBjB;IACxB,MAAM,CAACkB,kBAAkBC,oBAAoB,GAAGb,SAAS;IAEzD,MAAM,CAACc,SAAS,GAAGd,SAA0B;QAC3C,OAAOC,iBAAiBQ;IAC1B;IAEA,MAAM,CAACM,SAASC,WAAW,GAAGhB,SAA2B,EAAE;IAE3DD,UAAU;QACR,IAAI,CAACa,kBAAkB;YACrB,MAAMG,UAA4B,EAAE;YAEpCE,OAAOC,OAAO,CAACP,iBAAiBQ,OAAO,CAAC,CAAC,CAACC,KAAKC,OAAO;gBACpD,IAAID,IAAIE,UAAU,CAAC,CAAC,YAAY,EAAEZ,WAAW,CAAC,CAAC,GAAG;oBAChDK,QAAQQ,IAAI,CAACF;gBACf;YACF;YAEA,IAAIN,QAAQS,MAAM,KAAKV,SAASC,OAAO,CAACS,MAAM,EAAE;gBAC9CR,WAAWD;gBACXF,oBAAoB;YACtB;QACF;IACF,GAAG;QAACD;QAAkBD;QAAiBD;QAAYI,SAASC,OAAO,CAACS,MAAM;KAAC;IAE3E,IAAI,CAACZ,kBAAkB;QACrB,qBACE,KAAChB,MAAM6B,QAAQ;sBACZC,MAAMC,OAAO,CAACb,SAASC,OAAO,KAC7BD,SAASC,OAAO,CAACa,GAAG,CAAC,CAACC,QAAQC;gBAC5B,qBAAO,KAAClC,MAAM6B,QAAQ;8BAAUI;mBAAJC;YAC9B;;IAGR;IAEA,qBACE,KAACjC;QAASkC,wBAAU,KAACtC;YAAcuC,QAAO;;kBACxC,cAAA,KAAC9B;YACE,GAAGM,KAAK;YACTyB,UAAUnB,SAASmB,QAAQ;YAC3BC,QAAQpB,SAASoB,MAAM;YACvBnB,SAASA;;;AAIjB,EAAC"}
|
package/dist/field/index.scss
CHANGED
|
@@ -38,7 +38,8 @@
|
|
|
38
38
|
|
|
39
39
|
&__editor {
|
|
40
40
|
font-family: var(--font-serif);
|
|
41
|
-
font-size: base(0.
|
|
41
|
+
font-size: base(0.8);
|
|
42
|
+
letter-spacing: 0.02em;
|
|
42
43
|
|
|
43
44
|
h1,
|
|
44
45
|
h2,
|
|
@@ -48,6 +49,7 @@
|
|
|
48
49
|
h6 {
|
|
49
50
|
font-family: var(--font-body);
|
|
50
51
|
line-height: 1.125;
|
|
52
|
+
letter-spacing: 0;
|
|
51
53
|
}
|
|
52
54
|
|
|
53
55
|
h1[data-slate-node='element'] {
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import type { FormFieldBase } from '
|
|
1
|
+
import type { FormFieldBase } from 'payload';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
type ElementButtonContextType = {
|
|
4
4
|
disabled?: boolean;
|
|
5
|
-
fieldProps:
|
|
5
|
+
fieldProps: {
|
|
6
6
|
name: string;
|
|
7
7
|
richTextComponentMap: Map<string, React.ReactNode>;
|
|
8
|
-
};
|
|
8
|
+
} & FormFieldBase;
|
|
9
9
|
path: string;
|
|
10
10
|
schemaPath: string;
|
|
11
11
|
};
|
|
12
|
-
export declare const ElementButtonProvider: React.FC<
|
|
12
|
+
export declare const ElementButtonProvider: React.FC<{
|
|
13
13
|
children: React.ReactNode;
|
|
14
|
-
}>;
|
|
14
|
+
} & ElementButtonContextType>;
|
|
15
15
|
export declare const useElementButton: () => ElementButtonContextType;
|
|
16
16
|
export {};
|
|
17
17
|
//# sourceMappingURL=ElementButtonProvider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ElementButtonProvider.d.ts","sourceRoot":"","sources":["../../../src/field/providers/ElementButtonProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"ElementButtonProvider.d.ts","sourceRoot":"","sources":["../../../src/field/providers/ElementButtonProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAE5C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,KAAK,wBAAwB,GAAG;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,EAAE;QACV,IAAI,EAAE,MAAM,CAAA;QACZ,oBAAoB,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;KACnD,GAAG,aAAa,CAAA;IACjB,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAQD,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAC1C;IACE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,GAAG,wBAAwB,CAa7B,CAAA;AAED,eAAO,MAAM,gBAAgB,gCAG5B,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/field/providers/ElementButtonProvider.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '
|
|
1
|
+
{"version":3,"sources":["../../../src/field/providers/ElementButtonProvider.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from 'payload'\n\nimport React from 'react'\n\ntype ElementButtonContextType = {\n disabled?: boolean\n fieldProps: {\n name: string\n richTextComponentMap: Map<string, React.ReactNode>\n } & FormFieldBase\n path: string\n schemaPath: string\n}\n\nconst ElementButtonContext = React.createContext<ElementButtonContextType>({\n fieldProps: {} as any,\n path: '',\n schemaPath: '',\n})\n\nexport const ElementButtonProvider: React.FC<\n {\n children: React.ReactNode\n } & ElementButtonContextType\n> = (props) => {\n const { children, ...rest } = props\n\n return (\n <ElementButtonContext.Provider\n value={{\n ...rest,\n }}\n >\n {children}\n </ElementButtonContext.Provider>\n )\n}\n\nexport const useElementButton = () => {\n const path = React.useContext(ElementButtonContext)\n return path\n}\n"],"names":["React","ElementButtonContext","createContext","fieldProps","path","schemaPath","ElementButtonProvider","props","children","rest","Provider","value","useElementButton","useContext"],"mappings":"AAAA;;AAIA,OAAOA,WAAW,QAAO;AAYzB,MAAMC,qCAAuBD,MAAME,aAAa,CAA2B;IACzEC,YAAY,CAAC;IACbC,MAAM;IACNC,YAAY;AACd;AAEA,OAAO,MAAMC,wBAIT,CAACC;IACH,MAAM,EAAEC,QAAQ,EAAE,GAAGC,MAAM,GAAGF;IAE9B,qBACE,KAACN,qBAAqBS,QAAQ;QAC5BC,OAAO;YACL,GAAGF,IAAI;QACT;kBAECD;;AAGP,EAAC;AAED,OAAO,MAAMI,mBAAmB;IAC9B,MAAMR,OAAOJ,MAAMa,UAAU,CAACZ;IAC9B,OAAOG;AACT,EAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { FormFieldBase } from '
|
|
1
|
+
import type { FormFieldBase } from 'payload';
|
|
2
2
|
import type { Element } from 'slate';
|
|
3
3
|
import React from 'react';
|
|
4
4
|
type ElementContextType<T> = {
|
|
@@ -6,16 +6,16 @@ type ElementContextType<T> = {
|
|
|
6
6
|
children: React.ReactNode;
|
|
7
7
|
editorRef: React.MutableRefObject<HTMLDivElement>;
|
|
8
8
|
element: T;
|
|
9
|
-
fieldProps:
|
|
9
|
+
fieldProps: {
|
|
10
10
|
name: string;
|
|
11
11
|
richTextComponentMap: Map<string, React.ReactNode>;
|
|
12
|
-
};
|
|
12
|
+
} & FormFieldBase;
|
|
13
13
|
path: string;
|
|
14
14
|
schemaPath: string;
|
|
15
15
|
};
|
|
16
|
-
export declare const ElementProvider: React.FC<
|
|
16
|
+
export declare const ElementProvider: React.FC<{
|
|
17
17
|
childNodes: React.ReactNode;
|
|
18
|
-
}
|
|
18
|
+
} & ElementContextType<Element>>;
|
|
19
19
|
export declare const useElement: <T>() => ElementContextType<T>;
|
|
20
20
|
export {};
|
|
21
21
|
//# sourceMappingURL=ElementProvider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ElementProvider.d.ts","sourceRoot":"","sources":["../../../src/field/providers/ElementProvider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"ElementProvider.d.ts","sourceRoot":"","sources":["../../../src/field/providers/ElementProvider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAC5C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAEpC,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,KAAK,kBAAkB,CAAC,CAAC,IAAI;IAC3B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACnC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAA;IACjD,OAAO,EAAE,CAAC,CAAA;IACV,UAAU,EAAE;QACV,IAAI,EAAE,MAAM,CAAA;QACZ,oBAAoB,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;KACnD,GAAG,aAAa,CAAA;IACjB,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAYD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CACpC;IACE,UAAU,EAAE,KAAK,CAAC,SAAS,CAAA;CAC5B,GAAG,kBAAkB,CAAC,OAAO,CAAC,CAchC,CAAA;AAED,eAAO,MAAM,UAAU,GAAI,CAAC,OAAM,kBAAkB,CAAC,CAAC,CAErD,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/field/providers/ElementProvider.tsx"],"sourcesContent":["'use client'\nimport type { FormFieldBase } from '
|
|
1
|
+
{"version":3,"sources":["../../../src/field/providers/ElementProvider.tsx"],"sourcesContent":["'use client'\nimport type { FormFieldBase } from 'payload'\nimport type { Element } from 'slate'\n\nimport React from 'react'\n\ntype ElementContextType<T> = {\n attributes: Record<string, unknown>\n children: React.ReactNode\n editorRef: React.MutableRefObject<HTMLDivElement>\n element: T\n fieldProps: {\n name: string\n richTextComponentMap: Map<string, React.ReactNode>\n } & FormFieldBase\n path: string\n schemaPath: string\n}\n\nconst ElementContext = React.createContext<ElementContextType<Element>>({\n attributes: {},\n children: null,\n editorRef: null,\n element: {} as Element,\n fieldProps: {} as any,\n path: '',\n schemaPath: '',\n})\n\nexport const ElementProvider: React.FC<\n {\n childNodes: React.ReactNode\n } & ElementContextType<Element>\n> = (props) => {\n const { childNodes, children, ...rest } = props\n\n return (\n <ElementContext.Provider\n value={{\n ...rest,\n children: childNodes,\n }}\n >\n {children}\n </ElementContext.Provider>\n )\n}\n\nexport const useElement = <T,>(): ElementContextType<T> => {\n return React.useContext(ElementContext) as ElementContextType<T>\n}\n"],"names":["React","ElementContext","createContext","attributes","children","editorRef","element","fieldProps","path","schemaPath","ElementProvider","props","childNodes","rest","Provider","value","useElement","useContext"],"mappings":"AAAA;;AAIA,OAAOA,WAAW,QAAO;AAezB,MAAMC,+BAAiBD,MAAME,aAAa,CAA8B;IACtEC,YAAY,CAAC;IACbC,UAAU;IACVC,WAAW;IACXC,SAAS,CAAC;IACVC,YAAY,CAAC;IACbC,MAAM;IACNC,YAAY;AACd;AAEA,OAAO,MAAMC,kBAIT,CAACC;IACH,MAAM,EAAEC,UAAU,EAAER,QAAQ,EAAE,GAAGS,MAAM,GAAGF;IAE1C,qBACE,KAACV,eAAea,QAAQ;QACtBC,OAAO;YACL,GAAGF,IAAI;YACPT,UAAUQ;QACZ;kBAECR;;AAGP,EAAC;AAED,OAAO,MAAMY,aAAa;IACxB,OAAOhB,MAAMiB,UAAU,CAAChB;AAC1B,EAAC"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import type { FormFieldBase } from '
|
|
1
|
+
import type { FormFieldBase } from 'payload';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
type LeafButtonContextType = {
|
|
4
|
-
fieldProps:
|
|
4
|
+
fieldProps: {
|
|
5
5
|
name: string;
|
|
6
|
-
};
|
|
6
|
+
} & FormFieldBase;
|
|
7
7
|
path: string;
|
|
8
8
|
schemaPath: string;
|
|
9
9
|
};
|
|
10
|
-
export declare const LeafButtonProvider: React.FC<
|
|
10
|
+
export declare const LeafButtonProvider: React.FC<{
|
|
11
11
|
children: React.ReactNode;
|
|
12
|
-
}>;
|
|
12
|
+
} & LeafButtonContextType>;
|
|
13
13
|
export declare const useLeafButton: () => LeafButtonContextType;
|
|
14
14
|
export {};
|
|
15
15
|
//# sourceMappingURL=LeafButtonProvider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LeafButtonProvider.d.ts","sourceRoot":"","sources":["../../../src/field/providers/LeafButtonProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"LeafButtonProvider.d.ts","sourceRoot":"","sources":["../../../src/field/providers/LeafButtonProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAE5C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,KAAK,qBAAqB,GAAG;IAC3B,UAAU,EAAE;QACV,IAAI,EAAE,MAAM,CAAA;KACb,GAAG,aAAa,CAAA;IACjB,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAQD,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CACvC;IACE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,GAAG,qBAAqB,CAa1B,CAAA;AAED,eAAO,MAAM,aAAa,6BAGzB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/field/providers/LeafButtonProvider.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '
|
|
1
|
+
{"version":3,"sources":["../../../src/field/providers/LeafButtonProvider.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from 'payload'\n\nimport React from 'react'\n\ntype LeafButtonContextType = {\n fieldProps: {\n name: string\n } & FormFieldBase\n path: string\n schemaPath: string\n}\n\nconst LeafButtonContext = React.createContext<LeafButtonContextType>({\n fieldProps: {} as any,\n path: '',\n schemaPath: '',\n})\n\nexport const LeafButtonProvider: React.FC<\n {\n children: React.ReactNode\n } & LeafButtonContextType\n> = (props) => {\n const { children, ...rest } = props\n\n return (\n <LeafButtonContext.Provider\n value={{\n ...rest,\n }}\n >\n {children}\n </LeafButtonContext.Provider>\n )\n}\n\nexport const useLeafButton = () => {\n const path = React.useContext(LeafButtonContext)\n return path\n}\n"],"names":["React","LeafButtonContext","createContext","fieldProps","path","schemaPath","LeafButtonProvider","props","children","rest","Provider","value","useLeafButton","useContext"],"mappings":"AAAA;;AAIA,OAAOA,WAAW,QAAO;AAUzB,MAAMC,kCAAoBD,MAAME,aAAa,CAAwB;IACnEC,YAAY,CAAC;IACbC,MAAM;IACNC,YAAY;AACd;AAEA,OAAO,MAAMC,qBAIT,CAACC;IACH,MAAM,EAAEC,QAAQ,EAAE,GAAGC,MAAM,GAAGF;IAE9B,qBACE,KAACN,kBAAkBS,QAAQ;QACzBC,OAAO;YACL,GAAGF,IAAI;QACT;kBAECD;;AAGP,EAAC;AAED,OAAO,MAAMI,gBAAgB;IAC3B,MAAMR,OAAOJ,MAAMa,UAAU,CAACZ;IAC9B,OAAOG;AACT,EAAC"}
|
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
import type { FormFieldBase } from '
|
|
1
|
+
import type { FormFieldBase } from 'payload';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
type LeafContextType = {
|
|
4
4
|
attributes: Record<string, unknown>;
|
|
5
5
|
children: React.ReactNode;
|
|
6
6
|
editorRef: React.MutableRefObject<HTMLDivElement>;
|
|
7
|
-
fieldProps:
|
|
7
|
+
fieldProps: {
|
|
8
8
|
name: string;
|
|
9
|
-
};
|
|
9
|
+
} & FormFieldBase;
|
|
10
10
|
leaf: string;
|
|
11
11
|
path: string;
|
|
12
12
|
schemaPath: string;
|
|
13
13
|
};
|
|
14
|
-
export declare const LeafProvider: React.FC<
|
|
14
|
+
export declare const LeafProvider: React.FC<{
|
|
15
15
|
result: React.ReactNode;
|
|
16
|
-
}>;
|
|
16
|
+
} & LeafContextType>;
|
|
17
17
|
export declare const useLeaf: () => LeafContextType;
|
|
18
18
|
export {};
|
|
19
19
|
//# sourceMappingURL=LeafProvider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LeafProvider.d.ts","sourceRoot":"","sources":["../../../src/field/providers/LeafProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"LeafProvider.d.ts","sourceRoot":"","sources":["../../../src/field/providers/LeafProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAE5C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,KAAK,eAAe,GAAG;IACrB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACnC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAA;IACjD,UAAU,EAAE;QACV,IAAI,EAAE,MAAM,CAAA;KACb,GAAG,aAAa,CAAA;IACjB,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAYD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CACjC;IACE,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;CACxB,GAAG,eAAe,CAcpB,CAAA;AAED,eAAO,MAAM,OAAO,uBAGnB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/field/providers/LeafProvider.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '
|
|
1
|
+
{"version":3,"sources":["../../../src/field/providers/LeafProvider.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from 'payload'\n\nimport React from 'react'\n\ntype LeafContextType = {\n attributes: Record<string, unknown>\n children: React.ReactNode\n editorRef: React.MutableRefObject<HTMLDivElement>\n fieldProps: {\n name: string\n } & FormFieldBase\n leaf: string\n path: string\n schemaPath: string\n}\n\nconst LeafContext = React.createContext<LeafContextType>({\n attributes: {},\n children: null,\n editorRef: null,\n fieldProps: {} as any,\n leaf: '',\n path: '',\n schemaPath: '',\n})\n\nexport const LeafProvider: React.FC<\n {\n result: React.ReactNode\n } & LeafContextType\n> = (props) => {\n const { children, result, ...rest } = props\n\n return (\n <LeafContext.Provider\n value={{\n ...rest,\n children: result,\n }}\n >\n {children}\n </LeafContext.Provider>\n )\n}\n\nexport const useLeaf = () => {\n const path = React.useContext(LeafContext)\n return path\n}\n"],"names":["React","LeafContext","createContext","attributes","children","editorRef","fieldProps","leaf","path","schemaPath","LeafProvider","props","result","rest","Provider","value","useLeaf","useContext"],"mappings":"AAAA;;AAIA,OAAOA,WAAW,QAAO;AAczB,MAAMC,4BAAcD,MAAME,aAAa,CAAkB;IACvDC,YAAY,CAAC;IACbC,UAAU;IACVC,WAAW;IACXC,YAAY,CAAC;IACbC,MAAM;IACNC,MAAM;IACNC,YAAY;AACd;AAEA,OAAO,MAAMC,eAIT,CAACC;IACH,MAAM,EAAEP,QAAQ,EAAEQ,MAAM,EAAE,GAAGC,MAAM,GAAGF;IAEtC,qBACE,KAACV,YAAYa,QAAQ;QACnBC,OAAO;YACL,GAAGF,IAAI;YACPT,UAAUQ;QACZ;kBAECR;;AAGP,EAAC;AAED,OAAO,MAAMY,UAAU;IACrB,MAAMR,OAAOR,MAAMiB,UAAU,CAAChB;IAC9B,OAAOO;AACT,EAAC"}
|
package/dist/scss/app.scss
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
@import './colors.scss';
|
|
4
4
|
|
|
5
5
|
:root {
|
|
6
|
-
--base-px:
|
|
6
|
+
--base-px: 20;
|
|
7
7
|
--base-body-size: 13;
|
|
8
8
|
--base: calc((var(--base-px) / var(--base-body-size)) * 1rem);
|
|
9
9
|
|
|
@@ -21,6 +21,7 @@
|
|
|
21
21
|
--theme-baseline-body-size: #{$baseline-body-size};
|
|
22
22
|
--font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
|
|
23
23
|
sans-serif;
|
|
24
|
+
--font-serif: Georgia, 'Bitstream Charter', 'Charis SIL', Utopia, 'URW Bookman L', serif;
|
|
24
25
|
--font-mono: monospace;
|
|
25
26
|
|
|
26
27
|
--style-radius-s: #{$style-radius-s};
|
|
@@ -67,12 +68,6 @@ html {
|
|
|
67
68
|
@extend %body;
|
|
68
69
|
background: var(--theme-bg);
|
|
69
70
|
-webkit-font-smoothing: antialiased;
|
|
70
|
-
opacity: 0;
|
|
71
|
-
|
|
72
|
-
&[data-theme='dark'],
|
|
73
|
-
&[data-theme='light'] {
|
|
74
|
-
opacity: initial;
|
|
75
|
-
}
|
|
76
71
|
|
|
77
72
|
&[data-theme='dark'] {
|
|
78
73
|
--theme-bg: var(--theme-elevation-0);
|
|
@@ -111,12 +106,12 @@ body {
|
|
|
111
106
|
}
|
|
112
107
|
|
|
113
108
|
::selection {
|
|
114
|
-
background: var(--
|
|
109
|
+
background: var(--color-success-250);
|
|
115
110
|
color: var(--theme-base-800);
|
|
116
111
|
}
|
|
117
112
|
|
|
118
113
|
::-moz-selection {
|
|
119
|
-
background: var(--
|
|
114
|
+
background: var(--color-success-250);
|
|
120
115
|
color: var(--theme-base-800);
|
|
121
116
|
}
|
|
122
117
|
|