tabshift/payload
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: begins next / ui esm transform

Browse Source
This commit is contained in:
James
2024-03-07 09:02:56 -05:00
parent 83d9d98ba3
commit 694d5d92b7
11 changed files with 270 additions and 166 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/next/src/elements/LeaveWithoutSaving/index.tsx
View File

@@ -7,7 +7,7 @@ import { useTranslation } from '@payloadcms/ui/providers'
import React, { useCallback, useEffect } from 'react'
import './index.scss'
import { usePreventLeave } from './usePreventLeave'
import { usePreventLeave } from './usePreventLeave.js'
const modalSlug = 'leave-without-saving'

3
packages/next/tsconfig.json
View File

@@ -8,9 +8,6 @@
"rootDir": "./src" /* Specify the root folder within your source files. */,
"allowImportingTsExtensions": true,
"sourceMap": true,
"target": "ESNext",
"module": "ESNext",
"moduleResolution": "Bundler",
"paths": {
"@payloadcms/ui": ["../ui/src/exports/index.ts"],
"@payloadcms/ui/*": ["../ui/src/exports/*"],

28
packages/richtext-slate/src/field/enablePlugins.tsx Normal file
View File

@@ -0,0 +1,28 @@
import elementTypes from './elements/index.js'
import leafTypes from './leaves/index.js'
const addPluginReducer = (EditorWithPlugins, plugin) => {
if (typeof plugin === 'function') return plugin(EditorWithPlugins)
return EditorWithPlugins
}
const enablePlugins = (CreatedEditor, functions) =>
functions.reduce((CreatedEditorWithPlugins, func) => {
if (typeof func === 'object' && Array.isArray(func.plugins)) {
return func.plugins.reduce(addPluginReducer, CreatedEditorWithPlugins)
}
if (typeof func === 'string') {
if (elementTypes[func] && elementTypes[func].plugins) {
return elementTypes[func].plugins.reduce(addPluginReducer, CreatedEditorWithPlugins)
}
if (leafTypes[func] && leafTypes[func].plugins) {
return leafTypes[func].plugins.reduce(addPluginReducer, CreatedEditorWithPlugins)
}
}
return CreatedEditorWithPlugins
}, CreatedEditor)
export default enablePlugins

15
packages/richtext-slate/src/field/icons/headings/index.tsx Normal file
View File

@@ -0,0 +1,15 @@
import { H1 } from './H1/index.js'
import { H2 } from './H2/index.js'
import { H3 } from './H3/index.js'
import { H4 } from './H4/index.js'
import { H5 } from './H5/index.js'
import { H6 } from './H6/index.js'
export default {
H1,
H2,
H3,
H4,
H5,
H6,
}

2
packages/richtext-slate/src/field/leaves/bold/index.tsx
View File

@@ -15,5 +15,3 @@ export const bold: RichTextCustomLeaf = {
),
Leaf: Bold,
}
export default bold

25
packages/richtext-slate/src/field/mergeCustomFunctions.tsx Normal file
View File

@@ -0,0 +1,25 @@
export default (enabledFunctions, builtInFunctions) => {
const formattedEnabledFunctions = [...enabledFunctions]
if (enabledFunctions.indexOf('ul') > -1 || enabledFunctions.indexOf('ol') > -1) {
formattedEnabledFunctions.push('li')
}
return formattedEnabledFunctions.reduce((resultingFunctions, func) => {
if (typeof func === 'object' && func.name) {
return {
...resultingFunctions,
[func.name]: func,
}
}
if (typeof func === 'string' && builtInFunctions[func]) {
return {
...resultingFunctions,
[func]: builtInFunctions[func],
}
}
return resultingFunctions
}, {})
}

13
packages/ui/src/elements/NavGroup/index.tsx
View File

@@ -1,12 +1,14 @@
'use client'
import React, { useEffect, useState } from 'react'
import AnimateHeightWithDefault from 'react-animate-height'
import AnimateHeightImport from 'react-animate-height'
import { Chevron } from '../../icons/Chevron'
import { usePreferences } from '../../providers/Preferences'
import { useNav } from '../Nav/context'
import { Chevron } from '../../icons/Chevron/index.js'
import { usePreferences } from '../../providers/Preferences/index.js'
import { useNav } from '../Nav/context.js'
import './index.scss'
const { default: AnimateHeight } = AnimateHeightImport
const baseClass = 'nav-group'
type Props = {
@@ -14,9 +16,6 @@ type Props = {
label: string
}
// @ts-expect-error trust me it works
const AnimateHeight = AnimateHeightWithDefault || AnimateHeightWithDefault.default
const NavGroup: React.FC<Props> = ({ children, label }) => {
const [collapsed, setCollapsed] = useState(true)
const [animate, setAnimate] = useState(false)

42
packages/ui/src/forms/Form/index.tsx
View File

@@ -3,26 +3,26 @@ import type { Field, FormState } from 'payload/types'
/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
import isDeepEqual from 'deep-equal'
import { useRouter } from 'next/navigation'
import { useRouter } from 'next/navigation.js'
import { serialize } from 'object-to-formdata'
import { wait } from 'payload/utilities'
import QueryString from 'qs'
import React, { useCallback, useEffect, useReducer, useRef, useState } from 'react'
import { toast } from 'react-toastify'
import type { Context as FormContextType, GetDataByPath, Props, SubmitOptions } from './types'
import type { Context as FormContextType, GetDataByPath, Props, SubmitOptions } from './types.d.ts'
import { useFormQueryParams } from '../..'
import { useDebouncedEffect } from '../../hooks/useDebouncedEffect'
import useThrottledEffect from '../../hooks/useThrottledEffect'
import { useAuth } from '../../providers/Auth'
import { useConfig } from '../../providers/Config'
import { useDocumentInfo } from '../../providers/DocumentInfo'
import { useLocale } from '../../providers/Locale'
import { useOperation } from '../../providers/OperationProvider'
import { useTranslation } from '../../providers/Translation'
import { requests } from '../../utilities/api'
import { getFormState } from '../../utilities/getFormState'
import { useFormQueryParams } from '../../providers/FormQueryParams/index.js'
import { useDebouncedEffect } from '../../hooks/useDebouncedEffect.js'
import useThrottledEffect from '../../hooks/useThrottledEffect.js'
import { useAuth } from '../../providers/Auth/index.js'
import { useConfig } from '../../providers/Config/index.js'
import { useDocumentInfo } from '../../providers/DocumentInfo/index.js'
import { useLocale } from '../../providers/Locale/index.js'
import { useOperation } from '../../providers/OperationProvider/index.js'
import { useTranslation } from '../../providers/Translation/index.js'
import { requests } from '../../utilities/api.js'
import { getFormState } from '../../utilities/getFormState.js'
import {
FormContext,
FormFieldsContext,
@@ -30,14 +30,14 @@ import {
ModifiedContext,
ProcessingContext,
SubmittedContext,
} from './context'
import errorMessages from './errorMessages'
import { fieldReducer } from './fieldReducer'
import getDataByPathFunc from './getDataByPath'
import getSiblingDataFunc from './getSiblingData'
import initContextState from './initContextState'
import { mergeServerFormState } from './mergeServerFormState'
import reduceFieldsToValues from './reduceFieldsToValues'
} from './context.js'
import errorMessages from './errorMessages.js'
import { fieldReducer } from './fieldReducer.js'
import getDataByPathFunc from './getDataByPath.js'
import getSiblingDataFunc from './getSiblingData.js'
import initContextState from './initContextState.js'
import { mergeServerFormState } from './mergeServerFormState.js'
import reduceFieldsToValues from './reduceFieldsToValues.js'
const baseClass = 'form'

3
packages/ui/tsconfig.json
View File

@@ -4,9 +4,6 @@
"composite": true, // Make sure typescript knows that this module depends on their references
"noEmit": false /* Do not emit outputs. */,
"emitDeclarationOnly": true,
"target": "ESNext",
"module": "ESNext",
"moduleResolution": "Bundler",
"esModuleInterop": true,
"outDir": "./dist" /* Specify an output folder for all emitted files. */,
"rootDir": "./src" /* Specify the root folder within your source files. */

218
test/buildConfigWithDefaults.ts
View File

@@ -6,30 +6,30 @@ import type { Config, SanitizedConfig } from '../packages/payload/src/config/typ
import { mongooseAdapter } from '../packages/db-mongodb/src'
import { postgresAdapter } from '../packages/db-postgres/src'
import { buildConfig as buildPayloadConfig } from '../packages/payload/src/config/build'
import {
AlignFeature,
BlockQuoteFeature,
BlocksFeature,
BoldFeature,
CheckListFeature,
HeadingFeature,
IndentFeature,
InlineCodeFeature,
ItalicFeature,
LinkFeature,
OrderedListFeature,
ParagraphFeature,
RelationshipFeature,
StrikethroughFeature,
SubscriptFeature,
SuperscriptFeature,
TreeViewFeature,
UnderlineFeature,
UnorderedListFeature,
UploadFeature,
lexicalEditor,
} from '../packages/richtext-lexical/src'
// import { slateEditor } from '../packages/richtext-slate/src'
// import {
// AlignFeature,
// BlockQuoteFeature,
// BlocksFeature,
// BoldFeature,
// CheckListFeature,
// HeadingFeature,
// IndentFeature,
// InlineCodeFeature,
// ItalicFeature,
// LinkFeature,
// OrderedListFeature,
// ParagraphFeature,
// RelationshipFeature,
// StrikethroughFeature,
// SubscriptFeature,
// SuperscriptFeature,
// TreeViewFeature,
// UnderlineFeature,
// UnorderedListFeature,
// UploadFeature,
// lexicalEditor,
// } from '../packages/richtext-lexical/src'
import { slateEditor } from '../packages/richtext-slate/src'
// process.env.PAYLOAD_DATABASE = 'postgres'
@@ -66,42 +66,9 @@ export function buildConfigWithDefaults(testConfig?: Partial<Config>): Promise<S
const config: Config = {
db: databaseAdapters[process.env.PAYLOAD_DATABASE || 'mongoose'],
secret: 'TEST_SECRET',
// editor: slateEditor({
// admin: {
// upload: {
// collections: {
// media: {
// fields: [
// {
// name: 'alt',
// type: 'text',
// },
// ],
// },
// },
// },
// },
// }),
editor: lexicalEditor({
features: [
ParagraphFeature(),
RelationshipFeature(),
LinkFeature({
fields: [
{
name: 'description',
type: 'text',
},
],
}),
CheckListFeature(),
UnorderedListFeature(),
OrderedListFeature(),
AlignFeature(),
BlockQuoteFeature(),
BoldFeature(),
ItalicFeature(),
UploadFeature({
editor: slateEditor({
admin: {
upload: {
collections: {
media: {
fields: [
@@ -112,56 +79,89 @@ export function buildConfigWithDefaults(testConfig?: Partial<Config>): Promise<S
],
},
},
}),
UnderlineFeature(),
StrikethroughFeature(),
SubscriptFeature(),
SuperscriptFeature(),
InlineCodeFeature(),
TreeViewFeature(),
HeadingFeature(),
IndentFeature(),
BlocksFeature({
blocks: [
{
slug: 'myBlock',
fields: [
{
name: 'someText',
type: 'text',
},
{
name: 'someTextRequired',
type: 'text',
required: true,
},
{
name: 'radios',
type: 'radio',
options: [
{
label: 'Option 1',
value: 'option1',
},
{
label: 'Option 2',
value: 'option2',
},
{
label: 'Option 3',
value: 'option3',
},
],
validate: (value) => {
return value !== 'option2' ? true : 'Cannot be option2'
},
},
],
},
],
}),
],
},
},
}),
// editor: lexicalEditor({
// features: [
// ParagraphFeature(),
// RelationshipFeature(),
// LinkFeature({
// fields: [
// {
// name: 'description',
// type: 'text',
// },
// ],
// }),
// CheckListFeature(),
// UnorderedListFeature(),
// OrderedListFeature(),
// AlignFeature(),
// BlockQuoteFeature(),
// BoldFeature(),
// ItalicFeature(),
// UploadFeature({
// collections: {
// media: {
// fields: [
// {
// name: 'alt',
// type: 'text',
// },
// ],
// },
// },
// }),
// UnderlineFeature(),
// StrikethroughFeature(),
// SubscriptFeature(),
// SuperscriptFeature(),
// InlineCodeFeature(),
// TreeViewFeature(),
// HeadingFeature(),
// IndentFeature(),
// BlocksFeature({
// blocks: [
// {
// slug: 'myBlock',
// fields: [
// {
// name: 'someText',
// type: 'text',
// },
// {
// name: 'someTextRequired',
// type: 'text',
// required: true,
// },
// {
// name: 'radios',
// type: 'radio',
// options: [
// {
// label: 'Option 1',
// value: 'option1',
// },
// {
// label: 'Option 2',
// value: 'option2',
// },
// {
// label: 'Option 3',
// value: 'option3',
// },
// ],
// validate: (value) => {
// return value !== 'option2' ? true : 'Cannot be option2'
// },
// },
// ],
// },
// ],
// }),
// ],
// }),
sharp,
telemetry: false,
...testConfig,

85
tsconfig.json
View File

@@ -10,7 +10,11 @@
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"jsx": "preserve",
"lib": ["dom", "dom.iterable", "esnext"],
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"noEmit": true,
"outDir": "./dist",
"resolveJsonModule": true,
@@ -18,7 +22,11 @@
"skipLibCheck": true,
"sourceMap": true,
"strict": false,
"types": ["jest", "node", "@types/jest"],
"types": [
"jest",
"node",
"@types/jest"
],
"incremental": true,
"isolatedModules": true,
"plugins": [
@@ -27,28 +35,65 @@
}
],
"paths": {
"payload": ["./packages/payload/src"],
"payload/*": ["./packages/payload/src/exports/*"],
"@payloadcms/db-mongodb": ["./packages/db-mongodb/src"],
"@payloadcms/richtext-lexical": ["./packages/richtext-lexical/src"],
"@payloadcms/plugin-cloud": ["./packages/plugin-cloud/src"],
"@payloadcms/plugin-cloud-storage": ["./packages/plugin-cloud-storage/src"],
"@payloadcms/ui": ["./packages/ui/src/exports/index.ts"],
"@payloadcms/ui/*": ["./packages/ui/src/exports/*"],
"@payloadcms/ui/scss": ["./packages/ui/src/scss/styles.scss"],
"@payloadcms/ui/scss/app.scss": ["./packages/ui/src/scss/app.scss"],
"@payloadcms/translations": ["./packages/translations/src/exports/index.ts"],
"payload": [
"./packages/payload/src"
],
"payload/*": [
"./packages/payload/src/exports/*"
],
"@payloadcms/db-mongodb": [
"./packages/db-mongodb/src"
],
"@payloadcms/richtext-lexical": [
"./packages/richtext-lexical/src"
],
"@payloadcms/plugin-cloud": [
"./packages/plugin-cloud/src"
],
"@payloadcms/plugin-cloud-storage": [
"./packages/plugin-cloud-storage/src"
],
"@payloadcms/ui": [
"./packages/ui/src/exports/index.ts"
],
"@payloadcms/ui/*": [
"./packages/ui/src/exports/*"
],
"@payloadcms/ui/scss": [
"./packages/ui/src/scss/styles.scss"
],
"@payloadcms/ui/scss/app.scss": [
"./packages/ui/src/scss/app.scss"
],
"@payloadcms/translations": [
"./packages/translations/src/exports/index.ts"
],
"@payloadcms/translations/client": [
"./packages/translations/src/_generatedFiles_/client/index.ts"
],
"@payloadcms/translations/api": ["./packages/translations/src/_generatedFiles_/api/index.ts"],
"@payloadcms/next/*": ["./packages/next/src/*"],
"@payloadcms/next": ["./packages/next/src/exports/*"],
"@payloadcms/graphql": ["./packages/graphql/src"],
"@payload-config": ["./test/_community/config.ts"]
"@payloadcms/translations/api": [
"./packages/translations/src/_generatedFiles_/api/index.ts"
],
"@payloadcms/next/*": [
"./packages/next/src/*"
],
"@payloadcms/next": [
"./packages/next/src/exports/*"
],
"@payloadcms/graphql": [
"./packages/graphql/src"
],
"@payload-config": [
"./test/_community/config.ts"
]
}
},
"exclude": ["dist", "build", "temp", "node_modules"],
"exclude": [
"dist",
"build",
"temp",
"node_modules"
],
"composite": true,
"references": [
{
@@ -116,4 +161,4 @@
"app/**/*.tsx",
"scripts/**/*.ts"
]
}
}