@payloadcms/plugin-seo 3.0.0-canary.0d307b1 → 3.0.0-canary.12a836c

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/dist/defaults.js.map +1 -1
  2. package/dist/exports/client.d.ts +6 -0
  3. package/dist/exports/client.d.ts.map +1 -0
  4. package/dist/exports/client.js +7 -0
  5. package/dist/exports/client.js.map +1 -0
  6. package/dist/exports/fields.d.ts +6 -0
  7. package/dist/exports/fields.d.ts.map +1 -0
  8. package/dist/exports/fields.js +7 -0
  9. package/dist/exports/fields.js.map +1 -0
  10. package/dist/exports/types.js.map +1 -1
  11. package/dist/fields/MetaDescription/MetaDescriptionComponent.d.ts +8 -0
  12. package/dist/fields/MetaDescription/MetaDescriptionComponent.d.ts.map +1 -0
  13. package/dist/fields/{MetaDescription.js → MetaDescription/MetaDescriptionComponent.js} +22 -15
  14. package/dist/fields/MetaDescription/MetaDescriptionComponent.js.map +1 -0
  15. package/dist/fields/MetaDescription/index.d.ts +12 -0
  16. package/dist/fields/MetaDescription/index.d.ts.map +1 -0
  17. package/dist/fields/MetaDescription/index.js +20 -0
  18. package/dist/fields/MetaDescription/index.js.map +1 -0
  19. package/dist/fields/MetaImage/MetaImageComponent.d.ts +8 -0
  20. package/dist/fields/MetaImage/MetaImageComponent.d.ts.map +1 -0
  21. package/dist/fields/{MetaImage.js → MetaImage/MetaImageComponent.js} +26 -16
  22. package/dist/fields/MetaImage/MetaImageComponent.js.map +1 -0
  23. package/dist/fields/MetaImage/index.d.ts +13 -0
  24. package/dist/fields/MetaImage/index.d.ts.map +1 -0
  25. package/dist/fields/MetaImage/index.js +23 -0
  26. package/dist/fields/MetaImage/index.js.map +1 -0
  27. package/dist/fields/MetaTitle/MetaTitleComponent.d.ts +9 -0
  28. package/dist/fields/MetaTitle/MetaTitleComponent.d.ts.map +1 -0
  29. package/dist/fields/{MetaTitle.js → MetaTitle/MetaTitleComponent.js} +23 -16
  30. package/dist/fields/MetaTitle/MetaTitleComponent.js.map +1 -0
  31. package/dist/fields/MetaTitle/index.d.ts +12 -0
  32. package/dist/fields/MetaTitle/index.d.ts.map +1 -0
  33. package/dist/fields/MetaTitle/index.js +20 -0
  34. package/dist/fields/MetaTitle/index.js.map +1 -0
  35. package/dist/fields/Overview/OverviewComponent.d.ts +10 -0
  36. package/dist/fields/Overview/OverviewComponent.d.ts.map +1 -0
  37. package/dist/{ui/Overview.js → fields/Overview/OverviewComponent.js} +7 -4
  38. package/dist/fields/Overview/OverviewComponent.js.map +1 -0
  39. package/dist/fields/Overview/index.d.ts +26 -0
  40. package/dist/fields/Overview/index.d.ts.map +1 -0
  41. package/dist/fields/Overview/index.js +22 -0
  42. package/dist/fields/Overview/index.js.map +1 -0
  43. package/dist/fields/Preview/PreviewComponent.d.ts +10 -0
  44. package/dist/fields/Preview/PreviewComponent.d.ts.map +1 -0
  45. package/dist/{ui/Preview.js → fields/Preview/PreviewComponent.js} +10 -6
  46. package/dist/fields/Preview/PreviewComponent.js.map +1 -0
  47. package/dist/fields/Preview/index.d.ts +24 -0
  48. package/dist/fields/Preview/index.d.ts.map +1 -0
  49. package/dist/fields/Preview/index.js +22 -0
  50. package/dist/fields/Preview/index.js.map +1 -0
  51. package/dist/index.d.ts.map +1 -1
  52. package/dist/index.js +33 -111
  53. package/dist/index.js.map +1 -1
  54. package/dist/translations/index.d.ts +22 -0
  55. package/dist/translations/index.d.ts.map +1 -1
  56. package/dist/translations/index.js +22 -0
  57. package/dist/translations/index.js.map +1 -1
  58. package/dist/translations/ru.json +22 -0
  59. package/dist/types.d.ts +8 -8
  60. package/dist/types.d.ts.map +1 -1
  61. package/dist/types.js.map +1 -1
  62. package/dist/ui/LengthIndicator.js.map +1 -1
  63. package/dist/ui/Pill.js.map +1 -1
  64. package/package.json +25 -15
  65. package/dist/fields/MetaDescription.d.ts +0 -9
  66. package/dist/fields/MetaDescription.d.ts.map +0 -1
  67. package/dist/fields/MetaDescription.js.map +0 -1
  68. package/dist/fields/MetaImage.d.ts +0 -8
  69. package/dist/fields/MetaImage.d.ts.map +0 -1
  70. package/dist/fields/MetaImage.js.map +0 -1
  71. package/dist/fields/MetaTitle.d.ts +0 -9
  72. package/dist/fields/MetaTitle.d.ts.map +0 -1
  73. package/dist/fields/MetaTitle.js.map +0 -1
  74. package/dist/ui/Overview.d.ts +0 -3
  75. package/dist/ui/Overview.d.ts.map +0 -1
  76. package/dist/ui/Overview.js.map +0 -1
  77. package/dist/ui/Preview.d.ts +0 -8
  78. package/dist/ui/Preview.d.ts.map +0 -1
  79. package/dist/ui/Preview.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/defaults.ts"],"sourcesContent":["export const defaults = {\n description: {\n maxLength: 150,\n minLength: 100,\n },\n title: {\n maxLength: 60,\n minLength: 50,\n },\n}\n"],"names":["defaults","description","maxLength","minLength","title"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,OAAO,MAAMA,WAAW;IACtBC,aAAa;QACXC,WAAW;QACXC,WAAW;IACb;IACAC,OAAO;QACLF,WAAW;QACXC,WAAW;IACb;AACF,EAAC"}
1
+ {"version":3,"sources":["../src/defaults.ts"],"sourcesContent":["export const defaults = {\n description: {\n maxLength: 150,\n minLength: 100,\n },\n title: {\n maxLength: 60,\n minLength: 50,\n },\n}\n"],"names":["defaults","description","maxLength","minLength","title"],"mappings":"AAAA,OAAO,MAAMA,WAAW;IACtBC,aAAa;QACXC,WAAW;QACXC,WAAW;IACb;IACAC,OAAO;QACLF,WAAW;QACXC,WAAW;IACb;AACF,EAAC"}
@@ -0,0 +1,6 @@
1
+ export { MetaDescriptionComponent } from '../fields/MetaDescription/MetaDescriptionComponent.js';
2
+ export { MetaImageComponent } from '../fields/MetaImage/MetaImageComponent.js';
3
+ export { MetaTitleComponent } from '../fields/MetaTitle/MetaTitleComponent.js';
4
+ export { OverviewComponent } from '../fields/Overview/OverviewComponent.js';
5
+ export { PreviewComponent } from '../fields/Preview/PreviewComponent.js';
6
+ //# sourceMappingURL=client.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../src/exports/client.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,uDAAuD,CAAA;AAChG,OAAO,EAAE,kBAAkB,EAAE,MAAM,2CAA2C,CAAA;AAC9E,OAAO,EAAE,kBAAkB,EAAE,MAAM,2CAA2C,CAAA;AAC9E,OAAO,EAAE,iBAAiB,EAAE,MAAM,yCAAyC,CAAA;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,uCAAuC,CAAA"}
@@ -0,0 +1,7 @@
1
+ export { MetaDescriptionComponent } from '../fields/MetaDescription/MetaDescriptionComponent.js';
2
+ export { MetaImageComponent } from '../fields/MetaImage/MetaImageComponent.js';
3
+ export { MetaTitleComponent } from '../fields/MetaTitle/MetaTitleComponent.js';
4
+ export { OverviewComponent } from '../fields/Overview/OverviewComponent.js';
5
+ export { PreviewComponent } from '../fields/Preview/PreviewComponent.js';
6
+
7
+ //# sourceMappingURL=client.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/exports/client.ts"],"sourcesContent":["export { MetaDescriptionComponent } from '../fields/MetaDescription/MetaDescriptionComponent.js'\nexport { MetaImageComponent } from '../fields/MetaImage/MetaImageComponent.js'\nexport { MetaTitleComponent } from '../fields/MetaTitle/MetaTitleComponent.js'\nexport { OverviewComponent } from '../fields/Overview/OverviewComponent.js'\nexport { PreviewComponent } from '../fields/Preview/PreviewComponent.js'\n"],"names":["MetaDescriptionComponent","MetaImageComponent","MetaTitleComponent","OverviewComponent","PreviewComponent"],"mappings":"AAAA,SAASA,wBAAwB,QAAQ,wDAAuD;AAChG,SAASC,kBAAkB,QAAQ,4CAA2C;AAC9E,SAASC,kBAAkB,QAAQ,4CAA2C;AAC9E,SAASC,iBAAiB,QAAQ,0CAAyC;AAC3E,SAASC,gBAAgB,QAAQ,wCAAuC"}
@@ -0,0 +1,6 @@
1
+ export { MetaDescriptionField } from '../fields/MetaDescription/index.js';
2
+ export { MetaImageField } from '../fields/MetaImage/index.js';
3
+ export { MetaTitleField } from '../fields/MetaTitle/index.js';
4
+ export { OverviewField } from '../fields/Overview/index.js';
5
+ export { PreviewField } from '../fields/Preview/index.js';
6
+ //# sourceMappingURL=fields.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"fields.d.ts","sourceRoot":"","sources":["../../src/exports/fields.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,oCAAoC,CAAA;AACzE,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAA;AAC7D,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAA;AAC7D,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAC3D,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAA"}
@@ -0,0 +1,7 @@
1
+ export { MetaDescriptionField } from '../fields/MetaDescription/index.js';
2
+ export { MetaImageField } from '../fields/MetaImage/index.js';
3
+ export { MetaTitleField } from '../fields/MetaTitle/index.js';
4
+ export { OverviewField } from '../fields/Overview/index.js';
5
+ export { PreviewField } from '../fields/Preview/index.js';
6
+
7
+ //# sourceMappingURL=fields.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/exports/fields.ts"],"sourcesContent":["export { MetaDescriptionField } from '../fields/MetaDescription/index.js'\nexport { MetaImageField } from '../fields/MetaImage/index.js'\nexport { MetaTitleField } from '../fields/MetaTitle/index.js'\nexport { OverviewField } from '../fields/Overview/index.js'\nexport { PreviewField } from '../fields/Preview/index.js'\n"],"names":["MetaDescriptionField","MetaImageField","MetaTitleField","OverviewField","PreviewField"],"mappings":"AAAA,SAASA,oBAAoB,QAAQ,qCAAoC;AACzE,SAASC,cAAc,QAAQ,+BAA8B;AAC7D,SAASC,cAAc,QAAQ,+BAA8B;AAC7D,SAASC,aAAa,QAAQ,8BAA6B;AAC3D,SAASC,YAAY,QAAQ,6BAA4B"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/exports/types.ts"],"sourcesContent":["export type {\n GenerateDescription,\n GenerateImage,\n GenerateTitle,\n GenerateURL,\n Meta,\n SEOPluginConfig,\n} from '../types.js'\n"],"names":[],"rangeMappings":"","mappings":"AAAA,WAOoB"}
1
+ {"version":3,"sources":["../../src/exports/types.ts"],"sourcesContent":["export type {\n GenerateDescription,\n GenerateImage,\n GenerateTitle,\n GenerateURL,\n Meta,\n SEOPluginConfig,\n} from '../types.js'\n"],"names":[],"mappings":"AAAA,WAOoB"}
@@ -0,0 +1,8 @@
1
+ import type { TextareaFieldProps } from 'payload';
2
+ import React from 'react';
3
+ type MetaDescriptionProps = {
4
+ hasGenerateDescriptionFn: boolean;
5
+ } & TextareaFieldProps;
6
+ export declare const MetaDescriptionComponent: React.FC<MetaDescriptionProps>;
7
+ export {};
8
+ //# sourceMappingURL=MetaDescriptionComponent.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MetaDescriptionComponent.d.ts","sourceRoot":"","sources":["../../../src/fields/MetaDescription/MetaDescriptionComponent.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAYjD,OAAO,KAAsB,MAAM,OAAO,CAAA;AAU1C,KAAK,oBAAoB,GAAG;IAC1B,wBAAwB,EAAE,OAAO,CAAA;CAClC,GAAG,kBAAkB,CAAA;AAEtB,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAqInE,CAAA"}
@@ -1,19 +1,19 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { FieldLabel, TextareaInput, useAllFormFields, useDocumentInfo, useField, useFieldProps, useLocale, useTranslation } from '@payloadcms/ui';
3
+ import { FieldLabel, TextareaInput, useDocumentInfo, useField, useFieldProps, useForm, useLocale, useTranslation } from '@payloadcms/ui';
4
4
  import React, { useCallback } from 'react';
5
- import { defaults } from '../defaults.js';
6
- import { LengthIndicator } from '../ui/LengthIndicator.js';
5
+ import { defaults } from '../../defaults.js';
6
+ import { LengthIndicator } from '../../ui/LengthIndicator.js';
7
7
  const { maxLength, minLength } = defaults.description;
8
- export const MetaDescription = (props)=>{
9
- const { CustomLabel, hasGenerateDescriptionFn, label, labelProps, path, required } = props;
8
+ export const MetaDescriptionComponent = (props)=>{
9
+ const { field: { admin: { components: { Label } }, label, required }, hasGenerateDescriptionFn, labelProps } = props;
10
10
  const { path: pathFromContext } = useFieldProps();
11
11
  const { t } = useTranslation();
12
12
  const locale = useLocale();
13
- const [fields] = useAllFormFields();
13
+ const { getData } = useForm();
14
14
  const docInfo = useDocumentInfo();
15
15
  const field = useField({
16
- path
16
+ path: pathFromContext
17
17
  });
18
18
  const { errorMessage, setValue, showError, value } = field;
19
19
  const regenerateDescription = useCallback(async ()=>{
@@ -22,7 +22,7 @@ export const MetaDescription = (props)=>{
22
22
  body: JSON.stringify({
23
23
  ...docInfo,
24
24
  doc: {
25
- ...fields
25
+ ...getData()
26
26
  },
27
27
  locale: typeof locale === 'object' ? locale?.code : locale
28
28
  }),
@@ -35,11 +35,11 @@ export const MetaDescription = (props)=>{
35
35
  const { result: generatedDescription } = await genDescriptionResponse.json();
36
36
  setValue(generatedDescription || '');
37
37
  }, [
38
- fields,
39
- setValue,
40
38
  hasGenerateDescriptionFn,
39
+ docInfo,
40
+ getData,
41
41
  locale,
42
- docInfo
42
+ setValue
43
43
  ]);
44
44
  return /*#__PURE__*/ _jsxs("div", {
45
45
  style: {
@@ -56,7 +56,7 @@ export const MetaDescription = (props)=>{
56
56
  className: "plugin-seo__field",
57
57
  children: [
58
58
  /*#__PURE__*/ _jsx(FieldLabel, {
59
- CustomLabel: CustomLabel,
59
+ Label: Label,
60
60
  label: label,
61
61
  ...labelProps || {}
62
62
  }),
@@ -64,7 +64,9 @@ export const MetaDescription = (props)=>{
64
64
  children: [
65
65
  "  —  ",
66
66
  /*#__PURE__*/ _jsx("button", {
67
- onClick: regenerateDescription,
67
+ onClick: ()=>{
68
+ void regenerateDescription();
69
+ },
68
70
  style: {
69
71
  background: 'none',
70
72
  backgroundColor: 'transparent',
@@ -106,7 +108,12 @@ export const MetaDescription = (props)=>{
106
108
  position: 'relative'
107
109
  },
108
110
  children: /*#__PURE__*/ _jsx(TextareaInput, {
109
- CustomError: errorMessage,
111
+ Error: {
112
+ type: 'client',
113
+ Component: null,
114
+ RenderedComponent: errorMessage
115
+ },
116
+ label: label,
110
117
  onChange: setValue,
111
118
  path: pathFromContext,
112
119
  required: required,
@@ -133,4 +140,4 @@ export const MetaDescription = (props)=>{
133
140
  });
134
141
  };
135
142
 
136
- //# sourceMappingURL=MetaDescription.js.map
143
+ //# sourceMappingURL=MetaDescriptionComponent.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/fields/MetaDescription/MetaDescriptionComponent.tsx"],"sourcesContent":["'use client'\n\nimport type { FieldType, Options } from '@payloadcms/ui'\nimport type { TextareaFieldProps } from 'payload'\n\nimport {\n FieldLabel,\n TextareaInput,\n useDocumentInfo,\n useField,\n useFieldProps,\n useForm,\n useLocale,\n useTranslation,\n} from '@payloadcms/ui'\nimport React, { useCallback } from 'react'\n\nimport type { PluginSEOTranslationKeys, PluginSEOTranslations } from '../../translations/index.js'\nimport type { GenerateDescription } from '../../types.js'\n\nimport { defaults } from '../../defaults.js'\nimport { LengthIndicator } from '../../ui/LengthIndicator.js'\n\nconst { maxLength, minLength } = defaults.description\n\ntype MetaDescriptionProps = {\n hasGenerateDescriptionFn: boolean\n} & TextareaFieldProps\n\nexport const MetaDescriptionComponent: React.FC<MetaDescriptionProps> = (props) => {\n const {\n field: {\n admin: {\n components: { Label },\n },\n label,\n required,\n },\n hasGenerateDescriptionFn,\n labelProps,\n } = props\n const { path: pathFromContext } = useFieldProps()\n\n const { t } = useTranslation<PluginSEOTranslations, PluginSEOTranslationKeys>()\n\n const locale = useLocale()\n const { getData } = useForm()\n const docInfo = useDocumentInfo()\n\n const field: FieldType<string> = useField({\n path: pathFromContext,\n } as Options)\n\n const { errorMessage, setValue, showError, value } = field\n\n const regenerateDescription = useCallback(async () => {\n if (!hasGenerateDescriptionFn) return\n\n const genDescriptionResponse = await fetch('/api/plugin-seo/generate-description', {\n body: JSON.stringify({\n ...docInfo,\n doc: { ...getData() },\n locale: typeof locale === 'object' ? locale?.code : locale,\n } satisfies Parameters<GenerateDescription>[0]),\n credentials: 'include',\n headers: {\n 'Content-Type': 'application/json',\n },\n method: 'POST',\n })\n\n const { result: generatedDescription } = await genDescriptionResponse.json()\n\n setValue(generatedDescription || '')\n }, [hasGenerateDescriptionFn, docInfo, getData, locale, setValue])\n\n return (\n <div\n style={{\n marginBottom: '20px',\n }}\n >\n <div\n style={{\n marginBottom: '5px',\n position: 'relative',\n }}\n >\n <div className=\"plugin-seo__field\">\n <FieldLabel Label={Label} label={label} {...(labelProps || {})} />\n {hasGenerateDescriptionFn && (\n <React.Fragment>\n &nbsp; &mdash; &nbsp;\n <button\n onClick={() => {\n void regenerateDescription()\n }}\n style={{\n background: 'none',\n backgroundColor: 'transparent',\n border: 'none',\n color: 'currentcolor',\n cursor: 'pointer',\n padding: 0,\n textDecoration: 'underline',\n }}\n type=\"button\"\n >\n {t('plugin-seo:autoGenerate')}\n </button>\n </React.Fragment>\n )}\n </div>\n <div\n style={{\n color: '#9A9A9A',\n }}\n >\n {t('plugin-seo:lengthTipDescription', { maxLength, minLength })}\n <a\n href=\"https://developers.google.com/search/docs/advanced/appearance/snippet#meta-descriptions\"\n rel=\"noopener noreferrer\"\n target=\"_blank\"\n >\n {t('plugin-seo:bestPractices')}\n </a>\n </div>\n </div>\n <div\n style={{\n marginBottom: '10px',\n position: 'relative',\n }}\n >\n <TextareaInput\n Error={{\n type: 'client',\n Component: null,\n RenderedComponent: errorMessage,\n }}\n label={label}\n onChange={setValue}\n path={pathFromContext}\n required={required}\n showError={showError}\n style={{\n marginBottom: 0,\n }}\n value={value}\n />\n </div>\n <div\n style={{\n alignItems: 'center',\n display: 'flex',\n width: '100%',\n }}\n >\n <LengthIndicator maxLength={maxLength} minLength={minLength} text={value} />\n </div>\n </div>\n )\n}\n"],"names":["FieldLabel","TextareaInput","useDocumentInfo","useField","useFieldProps","useForm","useLocale","useTranslation","React","useCallback","defaults","LengthIndicator","maxLength","minLength","description","MetaDescriptionComponent","props","field","admin","components","Label","label","required","hasGenerateDescriptionFn","labelProps","path","pathFromContext","t","locale","getData","docInfo","errorMessage","setValue","showError","value","regenerateDescription","genDescriptionResponse","fetch","body","JSON","stringify","doc","code","credentials","headers","method","result","generatedDescription","json","div","style","marginBottom","position","className","Fragment","button","onClick","background","backgroundColor","border","color","cursor","padding","textDecoration","type","a","href","rel","target","Error","Component","RenderedComponent","onChange","alignItems","display","width","text"],"mappings":"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"}
@@ -0,0 +1,12 @@
1
+ import type { TextareaField } from 'payload';
2
+ interface FieldFunctionProps {
3
+ /**
4
+ * Tell the component if the generate function is available as configured in the plugin config
5
+ */
6
+ hasGenerateFn?: boolean;
7
+ overrides?: Partial<TextareaField>;
8
+ }
9
+ type FieldFunction = ({ hasGenerateFn, overrides }: FieldFunctionProps) => TextareaField;
10
+ export declare const MetaDescriptionField: FieldFunction;
11
+ export {};
12
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/MetaDescription/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAE5C,UAAU,kBAAkB;IAC1B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAA;CACnC;AAED,KAAK,aAAa,GAAG,CAAC,EAAE,aAAa,EAAE,SAAS,EAAE,EAAE,kBAAkB,KAAK,aAAa,CAAA;AAExF,eAAO,MAAM,oBAAoB,EAAE,aAiBlC,CAAA"}
@@ -0,0 +1,20 @@
1
+ export const MetaDescriptionField = ({ hasGenerateFn = false, overrides })=>{
2
+ return {
3
+ name: 'description',
4
+ type: 'textarea',
5
+ admin: {
6
+ components: {
7
+ Field: {
8
+ clientProps: {
9
+ hasGenerateDescriptionFn: hasGenerateFn
10
+ },
11
+ path: '@payloadcms/plugin-seo/client#MetaDescriptionComponent'
12
+ }
13
+ }
14
+ },
15
+ localized: true,
16
+ ...overrides ?? {}
17
+ };
18
+ };
19
+
20
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/fields/MetaDescription/index.ts"],"sourcesContent":["import type { TextareaField } from 'payload'\n\ninterface FieldFunctionProps {\n /**\n * Tell the component if the generate function is available as configured in the plugin config\n */\n hasGenerateFn?: boolean\n overrides?: Partial<TextareaField>\n}\n\ntype FieldFunction = ({ hasGenerateFn, overrides }: FieldFunctionProps) => TextareaField\n\nexport const MetaDescriptionField: FieldFunction = ({ hasGenerateFn = false, overrides }) => {\n return {\n name: 'description',\n type: 'textarea',\n admin: {\n components: {\n Field: {\n clientProps: {\n hasGenerateDescriptionFn: hasGenerateFn,\n },\n path: '@payloadcms/plugin-seo/client#MetaDescriptionComponent',\n },\n },\n },\n localized: true,\n ...((overrides as unknown as TextareaField) ?? {}),\n }\n}\n"],"names":["MetaDescriptionField","hasGenerateFn","overrides","name","type","admin","components","Field","clientProps","hasGenerateDescriptionFn","path","localized"],"mappings":"AAYA,OAAO,MAAMA,uBAAsC,CAAC,EAAEC,gBAAgB,KAAK,EAAEC,SAAS,EAAE;IACtF,OAAO;QACLC,MAAM;QACNC,MAAM;QACNC,OAAO;YACLC,YAAY;gBACVC,OAAO;oBACLC,aAAa;wBACXC,0BAA0BR;oBAC5B;oBACAS,MAAM;gBACR;YACF;QACF;QACAC,WAAW;QACX,GAAI,AAACT,aAA0C,CAAC,CAAC;IACnD;AACF,EAAC"}
@@ -0,0 +1,8 @@
1
+ import type { UploadFieldProps } from '@payloadcms/ui';
2
+ import React from 'react';
3
+ type MetaImageProps = {
4
+ hasGenerateImageFn: boolean;
5
+ } & UploadFieldProps;
6
+ export declare const MetaImageComponent: React.FC<MetaImageProps>;
7
+ export {};
8
+ //# sourceMappingURL=MetaImageComponent.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MetaImageComponent.d.ts","sourceRoot":"","sources":["../../../src/fields/MetaImage/MetaImageComponent.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAsB,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAa1E,OAAO,KAAsB,MAAM,OAAO,CAAA;AAO1C,KAAK,cAAc,GAAG;IACpB,kBAAkB,EAAE,OAAO,CAAA;CAC5B,GAAG,gBAAgB,CAAA;AAEpB,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAsJvD,CAAA"}
@@ -1,14 +1,18 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { FieldLabel, UploadInput, useAllFormFields, useConfig, useDocumentInfo, useField, useLocale, useTranslation } from '@payloadcms/ui';
3
+ import { FieldLabel, UploadInput, useConfig, useDocumentInfo, useField, useFieldProps, useForm, useLocale, useTranslation } from '@payloadcms/ui';
4
4
  import React, { useCallback } from 'react';
5
- import { Pill } from '../ui/Pill.js';
6
- export const MetaImage = (props)=>{
7
- const { CustomLabel, hasGenerateImageFn, label, labelProps, relationTo, required } = props || {};
8
- const field = useField(props);
5
+ import { Pill } from '../../ui/Pill.js';
6
+ export const MetaImageComponent = (props)=>{
7
+ const { field: { admin: { components: { Label } }, label, relationTo, required }, hasGenerateImageFn, labelProps } = props || {};
8
+ const { path: pathFromContext } = useFieldProps();
9
+ const field = useField({
10
+ ...props,
11
+ path: pathFromContext
12
+ });
9
13
  const { t } = useTranslation();
10
14
  const locale = useLocale();
11
- const [fields] = useAllFormFields();
15
+ const { getData } = useForm();
12
16
  const docInfo = useDocumentInfo();
13
17
  const { errorMessage, setValue, showError, value } = field;
14
18
  const regenerateImage = useCallback(async ()=>{
@@ -17,7 +21,7 @@ export const MetaImage = (props)=>{
17
21
  body: JSON.stringify({
18
22
  ...docInfo,
19
23
  doc: {
20
- ...fields
24
+ ...getData()
21
25
  },
22
26
  locale: typeof locale === 'object' ? locale?.code : locale
23
27
  }),
@@ -27,17 +31,17 @@ export const MetaImage = (props)=>{
27
31
  },
28
32
  method: 'POST'
29
33
  });
30
- const { result: generatedImage } = await genImageResponse.json();
34
+ const generatedImage = await genImageResponse.text();
31
35
  setValue(generatedImage || '');
32
36
  }, [
33
- fields,
34
- setValue,
35
37
  hasGenerateImageFn,
38
+ docInfo,
39
+ getData,
36
40
  locale,
37
- docInfo
41
+ setValue
38
42
  ]);
39
43
  const hasImage = Boolean(value);
40
- const config = useConfig();
44
+ const { config } = useConfig();
41
45
  const { collections, routes: { api } = {}, serverURL } = config;
42
46
  const collection = collections?.find((coll)=>coll.slug === relationTo) || undefined;
43
47
  return /*#__PURE__*/ _jsxs("div", {
@@ -55,7 +59,7 @@ export const MetaImage = (props)=>{
55
59
  className: "plugin-seo__field",
56
60
  children: [
57
61
  /*#__PURE__*/ _jsx(FieldLabel, {
58
- CustomLabel: CustomLabel,
62
+ Label: Label,
59
63
  label: label,
60
64
  ...labelProps || {}
61
65
  }),
@@ -63,7 +67,9 @@ export const MetaImage = (props)=>{
63
67
  children: [
64
68
  "  —  ",
65
69
  /*#__PURE__*/ _jsx("button", {
66
- onClick: regenerateImage,
70
+ onClick: ()=>{
71
+ void regenerateImage();
72
+ },
67
73
  style: {
68
74
  background: 'none',
69
75
  backgroundColor: 'transparent',
@@ -94,7 +100,11 @@ export const MetaImage = (props)=>{
94
100
  position: 'relative'
95
101
  },
96
102
  children: /*#__PURE__*/ _jsx(UploadInput, {
97
- CustomError: errorMessage,
103
+ Error: {
104
+ type: 'client',
105
+ Component: null,
106
+ RenderedComponent: errorMessage
107
+ },
98
108
  api: api,
99
109
  collection: collection,
100
110
  filterOptions: field.filterOptions,
@@ -133,4 +143,4 @@ export const MetaImage = (props)=>{
133
143
  });
134
144
  };
135
145
 
136
- //# sourceMappingURL=MetaImage.js.map
146
+ //# sourceMappingURL=MetaImageComponent.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/fields/MetaImage/MetaImageComponent.tsx"],"sourcesContent":["'use client'\n\nimport type { FieldType, Options, UploadFieldProps } from '@payloadcms/ui'\n\nimport {\n FieldLabel,\n UploadInput,\n useConfig,\n useDocumentInfo,\n useField,\n useFieldProps,\n useForm,\n useLocale,\n useTranslation,\n} from '@payloadcms/ui'\nimport React, { useCallback } from 'react'\n\nimport type { PluginSEOTranslationKeys, PluginSEOTranslations } from '../../translations/index.js'\nimport type { GenerateImage } from '../../types.js'\n\nimport { Pill } from '../../ui/Pill.js'\n\ntype MetaImageProps = {\n hasGenerateImageFn: boolean\n} & UploadFieldProps\n\nexport const MetaImageComponent: React.FC<MetaImageProps> = (props) => {\n const {\n field: {\n admin: {\n components: { Label },\n },\n label,\n relationTo,\n required,\n },\n hasGenerateImageFn,\n labelProps,\n } = props || {}\n const { path: pathFromContext } = useFieldProps()\n\n const field: FieldType<string> = useField({ ...props, path: pathFromContext } as Options)\n\n const { t } = useTranslation<PluginSEOTranslations, PluginSEOTranslationKeys>()\n\n const locale = useLocale()\n const { getData } = useForm()\n const docInfo = useDocumentInfo()\n\n const { errorMessage, setValue, showError, value } = field\n\n const regenerateImage = useCallback(async () => {\n if (!hasGenerateImageFn) return\n\n const genImageResponse = await fetch('/api/plugin-seo/generate-image', {\n body: JSON.stringify({\n ...docInfo,\n doc: { ...getData() },\n locale: typeof locale === 'object' ? locale?.code : locale,\n } satisfies Parameters<GenerateImage>[0]),\n credentials: 'include',\n headers: {\n 'Content-Type': 'application/json',\n },\n method: 'POST',\n })\n\n const generatedImage = await genImageResponse.text()\n\n setValue(generatedImage || '')\n }, [hasGenerateImageFn, docInfo, getData, locale, setValue])\n\n const hasImage = Boolean(value)\n\n const { config } = useConfig()\n\n const { collections, routes: { api } = {}, serverURL } = config\n\n const collection = collections?.find((coll) => coll.slug === relationTo) || undefined\n\n return (\n <div\n style={{\n marginBottom: '20px',\n }}\n >\n <div\n style={{\n marginBottom: '5px',\n position: 'relative',\n }}\n >\n <div className=\"plugin-seo__field\">\n <FieldLabel Label={Label} label={label} {...(labelProps || {})} />\n {hasGenerateImageFn && (\n <React.Fragment>\n &nbsp; &mdash; &nbsp;\n <button\n onClick={() => {\n void regenerateImage()\n }}\n style={{\n background: 'none',\n backgroundColor: 'transparent',\n border: 'none',\n color: 'currentcolor',\n cursor: 'pointer',\n padding: 0,\n textDecoration: 'underline',\n }}\n type=\"button\"\n >\n {t('plugin-seo:autoGenerate')}\n </button>\n </React.Fragment>\n )}\n </div>\n {hasGenerateImageFn && (\n <div\n style={{\n color: '#9A9A9A',\n }}\n >\n {t('plugin-seo:imageAutoGenerationTip')}\n </div>\n )}\n </div>\n <div\n style={{\n marginBottom: '10px',\n position: 'relative',\n }}\n >\n <UploadInput\n Error={{\n type: 'client',\n Component: null,\n RenderedComponent: errorMessage,\n }}\n api={api}\n collection={collection}\n filterOptions={field.filterOptions}\n label={undefined}\n onChange={(incomingImage) => {\n if (incomingImage !== null) {\n const { id: incomingID } = incomingImage\n setValue(incomingID)\n } else {\n setValue(null)\n }\n }}\n relationTo={relationTo}\n required={required}\n serverURL={serverURL}\n showError={showError}\n style={{\n marginBottom: 0,\n }}\n value={value}\n />\n </div>\n <div\n style={{\n alignItems: 'center',\n display: 'flex',\n width: '100%',\n }}\n >\n <Pill\n backgroundColor={hasImage ? 'green' : 'red'}\n color=\"white\"\n label={hasImage ? t('plugin-seo:good') : t('plugin-seo:noImage')}\n />\n </div>\n </div>\n )\n}\n"],"names":["FieldLabel","UploadInput","useConfig","useDocumentInfo","useField","useFieldProps","useForm","useLocale","useTranslation","React","useCallback","Pill","MetaImageComponent","props","field","admin","components","Label","label","relationTo","required","hasGenerateImageFn","labelProps","path","pathFromContext","t","locale","getData","docInfo","errorMessage","setValue","showError","value","regenerateImage","genImageResponse","fetch","body","JSON","stringify","doc","code","credentials","headers","method","generatedImage","text","hasImage","Boolean","config","collections","routes","api","serverURL","collection","find","coll","slug","undefined","div","style","marginBottom","position","className","Fragment","button","onClick","background","backgroundColor","border","color","cursor","padding","textDecoration","type","Error","Component","RenderedComponent","filterOptions","onChange","incomingImage","id","incomingID","alignItems","display","width"],"mappings":"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"}
@@ -0,0 +1,13 @@
1
+ import type { UploadField } from 'payload';
2
+ interface FieldFunctionProps {
3
+ /**
4
+ * Tell the component if the generate function is available as configured in the plugin config
5
+ */
6
+ hasGenerateFn?: boolean;
7
+ overrides?: Partial<UploadField>;
8
+ relationTo: string;
9
+ }
10
+ type FieldFunction = ({ hasGenerateFn, overrides }: FieldFunctionProps) => UploadField;
11
+ export declare const MetaImageField: FieldFunction;
12
+ export {};
13
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/MetaImage/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAE1C,UAAU,kBAAkB;IAC1B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAA;IAChC,UAAU,EAAE,MAAM,CAAA;CACnB;AAED,KAAK,aAAa,GAAG,CAAC,EAAE,aAAa,EAAE,SAAS,EAAE,EAAE,kBAAkB,KAAK,WAAW,CAAA;AAEtF,eAAO,MAAM,cAAc,EAAE,aAoB5B,CAAA"}
@@ -0,0 +1,23 @@
1
+ export const MetaImageField = ({ hasGenerateFn = false, overrides, relationTo })=>{
2
+ return {
3
+ name: 'image',
4
+ type: 'upload',
5
+ admin: {
6
+ components: {
7
+ Field: {
8
+ clientProps: {
9
+ hasGenerateImageFn: hasGenerateFn
10
+ },
11
+ path: '@payloadcms/plugin-seo/client#MetaImageComponent'
12
+ }
13
+ },
14
+ description: 'Maximum upload file size: 12MB. Recommended file size for images is <500KB.'
15
+ },
16
+ label: 'Meta Image',
17
+ localized: true,
18
+ relationTo,
19
+ ...overrides ?? {}
20
+ };
21
+ };
22
+
23
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/fields/MetaImage/index.ts"],"sourcesContent":["import type { UploadField } from 'payload'\n\ninterface FieldFunctionProps {\n /**\n * Tell the component if the generate function is available as configured in the plugin config\n */\n hasGenerateFn?: boolean\n overrides?: Partial<UploadField>\n relationTo: string\n}\n\ntype FieldFunction = ({ hasGenerateFn, overrides }: FieldFunctionProps) => UploadField\n\nexport const MetaImageField: FieldFunction = ({ hasGenerateFn = false, overrides, relationTo }) => {\n return {\n name: 'image',\n type: 'upload',\n admin: {\n components: {\n Field: {\n clientProps: {\n hasGenerateImageFn: hasGenerateFn,\n },\n path: '@payloadcms/plugin-seo/client#MetaImageComponent',\n },\n },\n description: 'Maximum upload file size: 12MB. Recommended file size for images is <500KB.',\n },\n label: 'Meta Image',\n localized: true,\n relationTo,\n ...((overrides as unknown as UploadField) ?? {}),\n }\n}\n"],"names":["MetaImageField","hasGenerateFn","overrides","relationTo","name","type","admin","components","Field","clientProps","hasGenerateImageFn","path","description","label","localized"],"mappings":"AAaA,OAAO,MAAMA,iBAAgC,CAAC,EAAEC,gBAAgB,KAAK,EAAEC,SAAS,EAAEC,UAAU,EAAE;IAC5F,OAAO;QACLC,MAAM;QACNC,MAAM;QACNC,OAAO;YACLC,YAAY;gBACVC,OAAO;oBACLC,aAAa;wBACXC,oBAAoBT;oBACtB;oBACAU,MAAM;gBACR;YACF;YACAC,aAAa;QACf;QACAC,OAAO;QACPC,WAAW;QACXX;QACA,GAAI,AAACD,aAAwC,CAAC,CAAC;IACjD;AACF,EAAC"}
@@ -0,0 +1,9 @@
1
+ import type { TextFieldProps } from 'payload';
2
+ import React from 'react';
3
+ import '../index.scss';
4
+ type MetaTitleProps = {
5
+ hasGenerateTitleFn: boolean;
6
+ } & TextFieldProps;
7
+ export declare const MetaTitleComponent: React.FC<MetaTitleProps>;
8
+ export {};
9
+ //# sourceMappingURL=MetaTitleComponent.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MetaTitleComponent.d.ts","sourceRoot":"","sources":["../../../src/fields/MetaTitle/MetaTitleComponent.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAY7C,OAAO,KAAsB,MAAM,OAAO,CAAA;AAO1C,OAAO,eAAe,CAAA;AAItB,KAAK,cAAc,GAAG;IACpB,kBAAkB,EAAE,OAAO,CAAA;CAC5B,GAAG,cAAc,CAAA;AAElB,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAsIvD,CAAA"}
@@ -1,20 +1,20 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { FieldLabel, TextInput, useAllFormFields, useDocumentInfo, useField, useFieldProps, useLocale, useTranslation } from '@payloadcms/ui';
3
+ import { FieldLabel, TextInput, useDocumentInfo, useField, useFieldProps, useForm, useLocale, useTranslation } from '@payloadcms/ui';
4
4
  import React, { useCallback } from 'react';
5
- import { defaults } from '../defaults.js';
6
- import { LengthIndicator } from '../ui/LengthIndicator.js';
7
- import './index.scss';
5
+ import { defaults } from '../../defaults.js';
6
+ import { LengthIndicator } from '../../ui/LengthIndicator.js';
7
+ import '../index.scss';
8
8
  const { maxLength, minLength } = defaults.title;
9
- export const MetaTitle = (props)=>{
10
- const { CustomLabel, hasGenerateTitleFn, label, labelProps, path, required } = props || {};
9
+ export const MetaTitleComponent = (props)=>{
10
+ const { field: { admin: { components: { Label } }, label, required }, hasGenerateTitleFn, labelProps } = props || {};
11
11
  const { path: pathFromContext } = useFieldProps();
12
12
  const { t } = useTranslation();
13
13
  const field = useField({
14
- path
14
+ path: pathFromContext
15
15
  });
16
16
  const locale = useLocale();
17
- const [fields] = useAllFormFields();
17
+ const { getData } = useForm();
18
18
  const docInfo = useDocumentInfo();
19
19
  const { errorMessage, setValue, showError, value } = field;
20
20
  const regenerateTitle = useCallback(async ()=>{
@@ -23,7 +23,7 @@ export const MetaTitle = (props)=>{
23
23
  body: JSON.stringify({
24
24
  ...docInfo,
25
25
  doc: {
26
- ...fields
26
+ ...getData()
27
27
  },
28
28
  locale: typeof locale === 'object' ? locale?.code : locale
29
29
  }),
@@ -36,11 +36,11 @@ export const MetaTitle = (props)=>{
36
36
  const { result: generatedTitle } = await genTitleResponse.json();
37
37
  setValue(generatedTitle || '');
38
38
  }, [
39
- fields,
40
- setValue,
41
39
  hasGenerateTitleFn,
40
+ docInfo,
41
+ getData,
42
42
  locale,
43
- docInfo
43
+ setValue
44
44
  ]);
45
45
  return /*#__PURE__*/ _jsxs("div", {
46
46
  style: {
@@ -57,7 +57,7 @@ export const MetaTitle = (props)=>{
57
57
  className: "plugin-seo__field",
58
58
  children: [
59
59
  /*#__PURE__*/ _jsx(FieldLabel, {
60
- CustomLabel: CustomLabel,
60
+ Label: Label,
61
61
  label: label,
62
62
  ...labelProps || {}
63
63
  }),
@@ -65,7 +65,9 @@ export const MetaTitle = (props)=>{
65
65
  children: [
66
66
  "  —  ",
67
67
  /*#__PURE__*/ _jsx("button", {
68
- onClick: regenerateTitle,
68
+ onClick: ()=>{
69
+ void regenerateTitle();
70
+ },
69
71
  style: {
70
72
  background: 'none',
71
73
  backgroundColor: 'transparent',
@@ -108,7 +110,12 @@ export const MetaTitle = (props)=>{
108
110
  position: 'relative'
109
111
  },
110
112
  children: /*#__PURE__*/ _jsx(TextInput, {
111
- CustomError: errorMessage,
113
+ Error: {
114
+ type: 'client',
115
+ Component: null,
116
+ RenderedComponent: errorMessage
117
+ },
118
+ label: label,
112
119
  onChange: setValue,
113
120
  path: pathFromContext,
114
121
  required: required,
@@ -135,4 +142,4 @@ export const MetaTitle = (props)=>{
135
142
  });
136
143
  };
137
144
 
138
- //# sourceMappingURL=MetaTitle.js.map
145
+ //# sourceMappingURL=MetaTitleComponent.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/fields/MetaTitle/MetaTitleComponent.tsx"],"sourcesContent":["'use client'\n\nimport type { FieldType, Options } from '@payloadcms/ui'\nimport type { TextFieldProps } from 'payload'\n\nimport {\n FieldLabel,\n TextInput,\n useDocumentInfo,\n useField,\n useFieldProps,\n useForm,\n useLocale,\n useTranslation,\n} from '@payloadcms/ui'\nimport React, { useCallback } from 'react'\n\nimport type { PluginSEOTranslationKeys, PluginSEOTranslations } from '../../translations/index.js'\nimport type { GenerateTitle } from '../../types.js'\n\nimport { defaults } from '../../defaults.js'\nimport { LengthIndicator } from '../../ui/LengthIndicator.js'\nimport '../index.scss'\n\nconst { maxLength, minLength } = defaults.title\n\ntype MetaTitleProps = {\n hasGenerateTitleFn: boolean\n} & TextFieldProps\n\nexport const MetaTitleComponent: React.FC<MetaTitleProps> = (props) => {\n const {\n field: {\n admin: {\n components: { Label },\n },\n label,\n required,\n },\n hasGenerateTitleFn,\n labelProps,\n } = props || {}\n const { path: pathFromContext } = useFieldProps()\n\n const { t } = useTranslation<PluginSEOTranslations, PluginSEOTranslationKeys>()\n\n const field: FieldType<string> = useField({\n path: pathFromContext,\n } as Options)\n\n const locale = useLocale()\n const { getData } = useForm()\n const docInfo = useDocumentInfo()\n\n const { errorMessage, setValue, showError, value } = field\n\n const regenerateTitle = useCallback(async () => {\n if (!hasGenerateTitleFn) return\n\n const genTitleResponse = await fetch('/api/plugin-seo/generate-title', {\n body: JSON.stringify({\n ...docInfo,\n doc: { ...getData() },\n locale: typeof locale === 'object' ? locale?.code : locale,\n } satisfies Parameters<GenerateTitle>[0]),\n credentials: 'include',\n headers: {\n 'Content-Type': 'application/json',\n },\n method: 'POST',\n })\n\n const { result: generatedTitle } = await genTitleResponse.json()\n\n setValue(generatedTitle || '')\n }, [hasGenerateTitleFn, docInfo, getData, locale, setValue])\n\n return (\n <div\n style={{\n marginBottom: '20px',\n }}\n >\n <div\n style={{\n marginBottom: '5px',\n position: 'relative',\n }}\n >\n <div className=\"plugin-seo__field\">\n <FieldLabel Label={Label} label={label} {...(labelProps || {})} />\n {hasGenerateTitleFn && (\n <React.Fragment>\n &nbsp; &mdash; &nbsp;\n <button\n onClick={() => {\n void regenerateTitle()\n }}\n style={{\n background: 'none',\n backgroundColor: 'transparent',\n border: 'none',\n color: 'currentcolor',\n cursor: 'pointer',\n padding: 0,\n textDecoration: 'underline',\n }}\n type=\"button\"\n >\n {t('plugin-seo:autoGenerate')}\n </button>\n </React.Fragment>\n )}\n </div>\n <div\n style={{\n color: '#9A9A9A',\n }}\n >\n {t('plugin-seo:lengthTipTitle', { maxLength, minLength })}\n <a\n href=\"https://developers.google.com/search/docs/advanced/appearance/title-link#page-titles\"\n rel=\"noopener noreferrer\"\n target=\"_blank\"\n >\n {t('plugin-seo:bestPractices')}\n </a>\n .\n </div>\n </div>\n <div\n style={{\n marginBottom: '10px',\n position: 'relative',\n }}\n >\n <TextInput\n Error={{\n type: 'client',\n Component: null,\n RenderedComponent: errorMessage,\n }}\n label={label}\n onChange={setValue}\n path={pathFromContext}\n required={required}\n showError={showError}\n style={{\n marginBottom: 0,\n }}\n value={value}\n />\n </div>\n <div\n style={{\n alignItems: 'center',\n display: 'flex',\n width: '100%',\n }}\n >\n <LengthIndicator maxLength={maxLength} minLength={minLength} text={value} />\n </div>\n </div>\n )\n}\n"],"names":["FieldLabel","TextInput","useDocumentInfo","useField","useFieldProps","useForm","useLocale","useTranslation","React","useCallback","defaults","LengthIndicator","maxLength","minLength","title","MetaTitleComponent","props","field","admin","components","Label","label","required","hasGenerateTitleFn","labelProps","path","pathFromContext","t","locale","getData","docInfo","errorMessage","setValue","showError","value","regenerateTitle","genTitleResponse","fetch","body","JSON","stringify","doc","code","credentials","headers","method","result","generatedTitle","json","div","style","marginBottom","position","className","Fragment","button","onClick","background","backgroundColor","border","color","cursor","padding","textDecoration","type","a","href","rel","target","Error","Component","RenderedComponent","onChange","alignItems","display","width","text"],"mappings":"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"}
@@ -0,0 +1,12 @@
1
+ import type { TextField } from 'payload';
2
+ interface FieldFunctionProps {
3
+ /**
4
+ * Tell the component if the generate function is available as configured in the plugin config
5
+ */
6
+ hasGenerateFn?: boolean;
7
+ overrides?: Partial<TextField>;
8
+ }
9
+ type FieldFunction = ({ hasGenerateFn, overrides }: FieldFunctionProps) => TextField;
10
+ export declare const MetaTitleField: FieldFunction;
11
+ export {};
12
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/MetaTitle/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAExC,UAAU,kBAAkB;IAC1B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAA;CAC/B;AAED,KAAK,aAAa,GAAG,CAAC,EAAE,aAAa,EAAE,SAAS,EAAE,EAAE,kBAAkB,KAAK,SAAS,CAAA;AAEpF,eAAO,MAAM,cAAc,EAAE,aAiB5B,CAAA"}
@@ -0,0 +1,20 @@
1
+ export const MetaTitleField = ({ hasGenerateFn = false, overrides })=>{
2
+ return {
3
+ name: 'title',
4
+ type: 'text',
5
+ admin: {
6
+ components: {
7
+ Field: {
8
+ clientProps: {
9
+ hasGenerateTitleFn: hasGenerateFn
10
+ },
11
+ path: '@payloadcms/plugin-seo/client#MetaTitleComponent'
12
+ }
13
+ }
14
+ },
15
+ localized: true,
16
+ ...overrides ?? {}
17
+ };
18
+ };
19
+
20
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/fields/MetaTitle/index.ts"],"sourcesContent":["import type { TextField } from 'payload'\n\ninterface FieldFunctionProps {\n /**\n * Tell the component if the generate function is available as configured in the plugin config\n */\n hasGenerateFn?: boolean\n overrides?: Partial<TextField>\n}\n\ntype FieldFunction = ({ hasGenerateFn, overrides }: FieldFunctionProps) => TextField\n\nexport const MetaTitleField: FieldFunction = ({ hasGenerateFn = false, overrides }) => {\n return {\n name: 'title',\n type: 'text',\n admin: {\n components: {\n Field: {\n clientProps: {\n hasGenerateTitleFn: hasGenerateFn,\n },\n path: '@payloadcms/plugin-seo/client#MetaTitleComponent',\n },\n },\n },\n localized: true,\n ...((overrides as unknown as TextField) ?? {}),\n }\n}\n"],"names":["MetaTitleField","hasGenerateFn","overrides","name","type","admin","components","Field","clientProps","hasGenerateTitleFn","path","localized"],"mappings":"AAYA,OAAO,MAAMA,iBAAgC,CAAC,EAAEC,gBAAgB,KAAK,EAAEC,SAAS,EAAE;IAChF,OAAO;QACLC,MAAM;QACNC,MAAM;QACNC,OAAO;YACLC,YAAY;gBACVC,OAAO;oBACLC,aAAa;wBACXC,oBAAoBR;oBACtB;oBACAS,MAAM;gBACR;YACF;QACF;QACAC,WAAW;QACX,GAAI,AAACT,aAAsC,CAAC,CAAC;IAC/C;AACF,EAAC"}
@@ -0,0 +1,10 @@
1
+ import type { UIField } from 'payload';
2
+ import React from 'react';
3
+ type OverviewProps = {
4
+ descriptionPath?: string;
5
+ imagePath?: string;
6
+ titlePath?: string;
7
+ } & UIField;
8
+ export declare const OverviewComponent: React.FC<OverviewProps>;
9
+ export {};
10
+ //# sourceMappingURL=OverviewComponent.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"OverviewComponent.d.ts","sourceRoot":"","sources":["../../../src/fields/Overview/OverviewComponent.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAa,OAAO,EAAE,MAAM,SAAS,CAAA;AAGjD,OAAO,KAA2C,MAAM,OAAO,CAAA;AAW/D,KAAK,aAAa,GAAG;IACnB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,GAAG,OAAO,CAAA;AAEX,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA4DrD,CAAA"}