@payloadcms/plugin-seo 3.0.0-canary.f83d96a → 3.0.0-canary.ff8c8fd

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 (70) hide show
  1. package/dist/exports/client.d.ts +6 -0
  2. package/dist/exports/client.d.ts.map +1 -0
  3. package/dist/exports/client.js +7 -0
  4. package/dist/exports/client.js.map +1 -0
  5. package/dist/exports/fields.d.ts +6 -0
  6. package/dist/exports/fields.d.ts.map +1 -0
  7. package/dist/exports/fields.js +7 -0
  8. package/dist/exports/fields.js.map +1 -0
  9. package/dist/fields/MetaDescription/MetaDescriptionComponent.d.ts +8 -0
  10. package/dist/fields/MetaDescription/MetaDescriptionComponent.d.ts.map +1 -0
  11. package/dist/fields/{MetaDescription.js → MetaDescription/MetaDescriptionComponent.js} +27 -14
  12. package/dist/fields/MetaDescription/MetaDescriptionComponent.js.map +1 -0
  13. package/dist/fields/MetaDescription/index.d.ts +12 -0
  14. package/dist/fields/MetaDescription/index.d.ts.map +1 -0
  15. package/dist/fields/MetaDescription/index.js +20 -0
  16. package/dist/fields/MetaDescription/index.js.map +1 -0
  17. package/dist/fields/MetaImage/MetaImageComponent.d.ts +8 -0
  18. package/dist/fields/MetaImage/MetaImageComponent.d.ts.map +1 -0
  19. package/dist/fields/{MetaImage.js → MetaImage/MetaImageComponent.js} +32 -16
  20. package/dist/fields/MetaImage/MetaImageComponent.js.map +1 -0
  21. package/dist/fields/MetaImage/index.d.ts +13 -0
  22. package/dist/fields/MetaImage/index.d.ts.map +1 -0
  23. package/dist/fields/MetaImage/index.js +23 -0
  24. package/dist/fields/MetaImage/index.js.map +1 -0
  25. package/dist/fields/MetaTitle/MetaTitleComponent.d.ts +9 -0
  26. package/dist/fields/MetaTitle/MetaTitleComponent.d.ts.map +1 -0
  27. package/dist/fields/{MetaTitle.js → MetaTitle/MetaTitleComponent.js} +28 -15
  28. package/dist/fields/MetaTitle/MetaTitleComponent.js.map +1 -0
  29. package/dist/fields/MetaTitle/index.d.ts +12 -0
  30. package/dist/fields/MetaTitle/index.d.ts.map +1 -0
  31. package/dist/fields/MetaTitle/index.js +20 -0
  32. package/dist/fields/MetaTitle/index.js.map +1 -0
  33. package/dist/fields/Overview/OverviewComponent.d.ts +10 -0
  34. package/dist/fields/Overview/OverviewComponent.d.ts.map +1 -0
  35. package/dist/{ui/Overview.js → fields/Overview/OverviewComponent.js} +7 -4
  36. package/dist/fields/Overview/OverviewComponent.js.map +1 -0
  37. package/dist/fields/Overview/index.d.ts +26 -0
  38. package/dist/fields/Overview/index.d.ts.map +1 -0
  39. package/dist/fields/Overview/index.js +22 -0
  40. package/dist/fields/Overview/index.js.map +1 -0
  41. package/dist/fields/Preview/PreviewComponent.d.ts +10 -0
  42. package/dist/fields/Preview/PreviewComponent.d.ts.map +1 -0
  43. package/dist/{ui/Preview.js → fields/Preview/PreviewComponent.js} +15 -8
  44. package/dist/fields/Preview/PreviewComponent.js.map +1 -0
  45. package/dist/fields/Preview/index.d.ts +24 -0
  46. package/dist/fields/Preview/index.d.ts.map +1 -0
  47. package/dist/fields/Preview/index.js +22 -0
  48. package/dist/fields/Preview/index.js.map +1 -0
  49. package/dist/index.d.ts.map +1 -1
  50. package/dist/index.js +44 -111
  51. package/dist/index.js.map +1 -1
  52. package/dist/types.d.ts +14 -9
  53. package/dist/types.d.ts.map +1 -1
  54. package/dist/types.js.map +1 -1
  55. package/package.json +25 -15
  56. package/dist/fields/MetaDescription.d.ts +0 -9
  57. package/dist/fields/MetaDescription.d.ts.map +0 -1
  58. package/dist/fields/MetaDescription.js.map +0 -1
  59. package/dist/fields/MetaImage.d.ts +0 -8
  60. package/dist/fields/MetaImage.d.ts.map +0 -1
  61. package/dist/fields/MetaImage.js.map +0 -1
  62. package/dist/fields/MetaTitle.d.ts +0 -9
  63. package/dist/fields/MetaTitle.d.ts.map +0 -1
  64. package/dist/fields/MetaTitle.js.map +0 -1
  65. package/dist/ui/Overview.d.ts +0 -3
  66. package/dist/ui/Overview.d.ts.map +0 -1
  67. package/dist/ui/Overview.js.map +0 -1
  68. package/dist/ui/Preview.d.ts +0 -8
  69. package/dist/ui/Preview.d.ts.map +0 -1
  70. package/dist/ui/Preview.js.map +0 -1
@@ -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"}
@@ -0,0 +1,8 @@
1
+ import type { TextareaFieldProps } from 'payload';
2
+ import React from 'react';
3
+ type MetaDescriptionProps = {
4
+ readonly 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,QAAQ,CAAC,wBAAwB,EAAE,OAAO,CAAA;CAC3C,GAAG,kBAAkB,CAAA;AAEtB,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA4InE,CAAA"}
@@ -2,29 +2,34 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
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
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 ()=>{
20
20
  if (!hasGenerateDescriptionFn) return;
21
21
  const genDescriptionResponse = await fetch('/api/plugin-seo/generate-description', {
22
22
  body: JSON.stringify({
23
- ...docInfo,
24
- doc: {
25
- ...getData()
26
- },
27
- locale: typeof locale === 'object' ? locale?.code : locale
23
+ id: docInfo.id,
24
+ slug: docInfo.slug,
25
+ doc: getData(),
26
+ docPermissions: docInfo.docPermissions,
27
+ hasPublishPermission: docInfo.hasPublishPermission,
28
+ hasSavePermission: docInfo.hasSavePermission,
29
+ initialData: docInfo.initialData,
30
+ initialState: docInfo.initialState,
31
+ locale: typeof locale === 'object' ? locale?.code : locale,
32
+ title: docInfo.title
28
33
  }),
29
34
  credentials: 'include',
30
35
  headers: {
@@ -56,7 +61,8 @@ export const MetaDescription = (props)=>{
56
61
  className: "plugin-seo__field",
57
62
  children: [
58
63
  /*#__PURE__*/ _jsx(FieldLabel, {
59
- CustomLabel: CustomLabel,
64
+ Label: Label,
65
+ field: null,
60
66
  label: label,
61
67
  ...labelProps || {}
62
68
  }),
@@ -64,7 +70,9 @@ export const MetaDescription = (props)=>{
64
70
  children: [
65
71
  "  —  ",
66
72
  /*#__PURE__*/ _jsx("button", {
67
- onClick: regenerateDescription,
73
+ onClick: ()=>{
74
+ void regenerateDescription();
75
+ },
68
76
  style: {
69
77
  background: 'none',
70
78
  backgroundColor: 'transparent',
@@ -106,7 +114,12 @@ export const MetaDescription = (props)=>{
106
114
  position: 'relative'
107
115
  },
108
116
  children: /*#__PURE__*/ _jsx(TextareaInput, {
109
- CustomError: errorMessage,
117
+ Error: {
118
+ type: 'client',
119
+ Component: null,
120
+ RenderedComponent: errorMessage
121
+ },
122
+ label: label,
110
123
  onChange: setValue,
111
124
  path: pathFromContext,
112
125
  required: required,
@@ -133,4 +146,4 @@ export const MetaDescription = (props)=>{
133
146
  });
134
147
  };
135
148
 
136
- //# sourceMappingURL=MetaDescription.js.map
149
+ //# 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 readonly 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 id: docInfo.id,\n slug: docInfo.slug,\n doc: getData(),\n docPermissions: docInfo.docPermissions,\n hasPublishPermission: docInfo.hasPublishPermission,\n hasSavePermission: docInfo.hasSavePermission,\n initialData: docInfo.initialData,\n initialState: docInfo.initialState,\n locale: typeof locale === 'object' ? locale?.code : locale,\n title: docInfo.title,\n } satisfies Omit<Parameters<GenerateDescription>[0], 'req'>),\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} field={null} 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","id","slug","doc","docPermissions","hasPublishPermission","hasSavePermission","initialData","initialState","code","title","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":"AAAA;;AAKA,SACEA,UAAU,EACVC,aAAa,EACbC,eAAe,EACfC,QAAQ,EACRC,aAAa,EACbC,OAAO,EACPC,SAAS,EACTC,cAAc,QACT,iBAAgB;AACvB,OAAOC,SAASC,WAAW,QAAQ,QAAO;AAK1C,SAASC,QAAQ,QAAQ,oBAAmB;AAC5C,SAASC,eAAe,QAAQ,8BAA6B;AAE7D,MAAM,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGH,SAASI,WAAW;AAMrD,OAAO,MAAMC,2BAA2D,CAACC;IACvE,MAAM,EACJC,OAAO,EACLC,OAAO,EACLC,YAAY,EAAEC,KAAK,EAAE,EACtB,EACDC,KAAK,EACLC,QAAQ,EACT,EACDC,wBAAwB,EACxBC,UAAU,EACX,GAAGR;IACJ,MAAM,EAAES,MAAMC,eAAe,EAAE,GAAGtB;IAElC,MAAM,EAAEuB,CAAC,EAAE,GAAGpB;IAEd,MAAMqB,SAAStB;IACf,MAAM,EAAEuB,OAAO,EAAE,GAAGxB;IACpB,MAAMyB,UAAU5B;IAEhB,MAAMe,QAA2Bd,SAAS;QACxCsB,MAAMC;IACR;IAEA,MAAM,EAAEK,YAAY,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,KAAK,EAAE,GAAGjB;IAErD,MAAMkB,wBAAwB1B,YAAY;QACxC,IAAI,CAACc,0BAA0B;QAE/B,MAAMa,yBAAyB,MAAMC,MAAM,wCAAwC;YACjFC,MAAMC,KAAKC,SAAS,CAAC;gBACnBC,IAAIX,QAAQW,EAAE;gBACdC,MAAMZ,QAAQY,IAAI;gBAClBC,KAAKd;gBACLe,gBAAgBd,QAAQc,cAAc;gBACtCC,sBAAsBf,QAAQe,oBAAoB;gBAClDC,mBAAmBhB,QAAQgB,iBAAiB;gBAC5CC,aAAajB,QAAQiB,WAAW;gBAChCC,cAAclB,QAAQkB,YAAY;gBAClCpB,QAAQ,OAAOA,WAAW,WAAWA,QAAQqB,OAAOrB;gBACpDsB,OAAOpB,QAAQoB,KAAK;YACtB;YACAC,aAAa;YACbC,SAAS;gBACP,gBAAgB;YAClB;YACAC,QAAQ;QACV;QAEA,MAAM,EAAEC,QAAQC,oBAAoB,EAAE,GAAG,MAAMnB,uBAAuBoB,IAAI;QAE1ExB,SAASuB,wBAAwB;IACnC,GAAG;QAAChC;QAA0BO;QAASD;QAASD;QAAQI;KAAS;IAEjE,qBACE,MAACyB;QACCC,OAAO;YACLC,cAAc;QAChB;;0BAEA,MAACF;gBACCC,OAAO;oBACLC,cAAc;oBACdC,UAAU;gBACZ;;kCAEA,MAACH;wBAAII,WAAU;;0CACb,KAAC7D;gCAAWoB,OAAOA;gCAAOH,OAAO;gCAAMI,OAAOA;gCAAQ,GAAIG,cAAc,CAAC,CAAC;;4BACzED,0CACC,MAACf,MAAMsD,QAAQ;;oCAAC;kDAEd,KAACC;wCACCC,SAAS;4CACP,KAAK7B;wCACP;wCACAuB,OAAO;4CACLO,YAAY;4CACZC,iBAAiB;4CACjBC,QAAQ;4CACRC,OAAO;4CACPC,QAAQ;4CACRC,SAAS;4CACTC,gBAAgB;wCAClB;wCACAC,MAAK;kDAEJ7C,EAAE;;;;;;kCAKX,MAAC8B;wBACCC,OAAO;4BACLU,OAAO;wBACT;;4BAECzC,EAAE,mCAAmC;gCAAEf;gCAAWC;4BAAU;0CAC7D,KAAC4D;gCACCC,MAAK;gCACLC,KAAI;gCACJC,QAAO;0CAENjD,EAAE;;;;;;0BAIT,KAAC8B;gBACCC,OAAO;oBACLC,cAAc;oBACdC,UAAU;gBACZ;0BAEA,cAAA,KAAC3D;oBACC4E,OAAO;wBACLL,MAAM;wBACNM,WAAW;wBACXC,mBAAmBhD;oBACrB;oBACAV,OAAOA;oBACP2D,UAAUhD;oBACVP,MAAMC;oBACNJ,UAAUA;oBACVW,WAAWA;oBACXyB,OAAO;wBACLC,cAAc;oBAChB;oBACAzB,OAAOA;;;0BAGX,KAACuB;gBACCC,OAAO;oBACLuB,YAAY;oBACZC,SAAS;oBACTC,OAAO;gBACT;0BAEA,cAAA,KAACxE;oBAAgBC,WAAWA;oBAAWC,WAAWA;oBAAWuE,MAAMlD;;;;;AAI3E,EAAC"}
@@ -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
+ readonly 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,QAAQ,CAAC,kBAAkB,EAAE,OAAO,CAAA;CACrC,GAAG,gBAAgB,CAAA;AAEpB,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA6JvD,CAAA"}
@@ -1,11 +1,15 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { FieldLabel, UploadInput, useConfig, useDocumentInfo, useField, useForm, 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
15
  const { getData } = useForm();
@@ -15,11 +19,16 @@ export const MetaImage = (props)=>{
15
19
  if (!hasGenerateImageFn) return;
16
20
  const genImageResponse = await fetch('/api/plugin-seo/generate-image', {
17
21
  body: JSON.stringify({
18
- ...docInfo,
19
- doc: {
20
- ...getData()
21
- },
22
- locale: typeof locale === 'object' ? locale?.code : locale
22
+ id: docInfo.id,
23
+ slug: docInfo.slug,
24
+ doc: getData(),
25
+ docPermissions: docInfo.docPermissions,
26
+ hasPublishPermission: docInfo.hasPublishPermission,
27
+ hasSavePermission: docInfo.hasSavePermission,
28
+ initialData: docInfo.initialData,
29
+ initialState: docInfo.initialState,
30
+ locale: typeof locale === 'object' ? locale?.code : locale,
31
+ title: docInfo.title
23
32
  }),
24
33
  credentials: 'include',
25
34
  headers: {
@@ -27,7 +36,7 @@ export const MetaImage = (props)=>{
27
36
  },
28
37
  method: 'POST'
29
38
  });
30
- const { result: generatedImage } = await genImageResponse.json();
39
+ const generatedImage = await genImageResponse.text();
31
40
  setValue(generatedImage || '');
32
41
  }, [
33
42
  hasGenerateImageFn,
@@ -37,7 +46,7 @@ export const MetaImage = (props)=>{
37
46
  setValue
38
47
  ]);
39
48
  const hasImage = Boolean(value);
40
- const config = useConfig();
49
+ const { config } = useConfig();
41
50
  const { collections, routes: { api } = {}, serverURL } = config;
42
51
  const collection = collections?.find((coll)=>coll.slug === relationTo) || undefined;
43
52
  return /*#__PURE__*/ _jsxs("div", {
@@ -55,7 +64,8 @@ export const MetaImage = (props)=>{
55
64
  className: "plugin-seo__field",
56
65
  children: [
57
66
  /*#__PURE__*/ _jsx(FieldLabel, {
58
- CustomLabel: CustomLabel,
67
+ Label: Label,
68
+ field: null,
59
69
  label: label,
60
70
  ...labelProps || {}
61
71
  }),
@@ -63,7 +73,9 @@ export const MetaImage = (props)=>{
63
73
  children: [
64
74
  "  —  ",
65
75
  /*#__PURE__*/ _jsx("button", {
66
- onClick: regenerateImage,
76
+ onClick: ()=>{
77
+ void regenerateImage();
78
+ },
67
79
  style: {
68
80
  background: 'none',
69
81
  backgroundColor: 'transparent',
@@ -94,7 +106,11 @@ export const MetaImage = (props)=>{
94
106
  position: 'relative'
95
107
  },
96
108
  children: /*#__PURE__*/ _jsx(UploadInput, {
97
- CustomError: errorMessage,
109
+ Error: {
110
+ type: 'client',
111
+ Component: null,
112
+ RenderedComponent: errorMessage
113
+ },
98
114
  api: api,
99
115
  collection: collection,
100
116
  filterOptions: field.filterOptions,
@@ -133,4 +149,4 @@ export const MetaImage = (props)=>{
133
149
  });
134
150
  };
135
151
 
136
- //# sourceMappingURL=MetaImage.js.map
152
+ //# 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 readonly 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 id: docInfo.id,\n slug: docInfo.slug,\n doc: getData(),\n docPermissions: docInfo.docPermissions,\n hasPublishPermission: docInfo.hasPublishPermission,\n hasSavePermission: docInfo.hasSavePermission,\n initialData: docInfo.initialData,\n initialState: docInfo.initialState,\n locale: typeof locale === 'object' ? locale?.code : locale,\n title: docInfo.title,\n } satisfies Omit<Parameters<GenerateImage>[0], 'req'>),\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} field={null} 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","id","slug","doc","docPermissions","hasPublishPermission","hasSavePermission","initialData","initialState","code","title","credentials","headers","method","generatedImage","text","hasImage","Boolean","config","collections","routes","api","serverURL","collection","find","coll","undefined","div","style","marginBottom","position","className","Fragment","button","onClick","background","backgroundColor","border","color","cursor","padding","textDecoration","type","Error","Component","RenderedComponent","filterOptions","onChange","incomingImage","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
+ readonly 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,QAAQ,CAAC,kBAAkB,EAAE,OAAO,CAAA;CACrC,GAAG,cAAc,CAAA;AAElB,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA6IvD,CAAA"}
@@ -2,16 +2,16 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
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
17
  const { getData } = useForm();
@@ -21,11 +21,16 @@ export const MetaTitle = (props)=>{
21
21
  if (!hasGenerateTitleFn) return;
22
22
  const genTitleResponse = await fetch('/api/plugin-seo/generate-title', {
23
23
  body: JSON.stringify({
24
- ...docInfo,
25
- doc: {
26
- ...getData()
27
- },
28
- locale: typeof locale === 'object' ? locale?.code : locale
24
+ id: docInfo.id,
25
+ slug: docInfo.slug,
26
+ doc: getData(),
27
+ docPermissions: docInfo.docPermissions,
28
+ hasPublishPermission: docInfo.hasPublishPermission,
29
+ hasSavePermission: docInfo.hasSavePermission,
30
+ initialData: docInfo.initialData,
31
+ initialState: docInfo.initialState,
32
+ locale: typeof locale === 'object' ? locale?.code : locale,
33
+ title: docInfo.title
29
34
  }),
30
35
  credentials: 'include',
31
36
  headers: {
@@ -57,7 +62,8 @@ export const MetaTitle = (props)=>{
57
62
  className: "plugin-seo__field",
58
63
  children: [
59
64
  /*#__PURE__*/ _jsx(FieldLabel, {
60
- CustomLabel: CustomLabel,
65
+ Label: Label,
66
+ field: null,
61
67
  label: label,
62
68
  ...labelProps || {}
63
69
  }),
@@ -65,7 +71,9 @@ export const MetaTitle = (props)=>{
65
71
  children: [
66
72
  "  —  ",
67
73
  /*#__PURE__*/ _jsx("button", {
68
- onClick: regenerateTitle,
74
+ onClick: ()=>{
75
+ void regenerateTitle();
76
+ },
69
77
  style: {
70
78
  background: 'none',
71
79
  backgroundColor: 'transparent',
@@ -108,7 +116,12 @@ export const MetaTitle = (props)=>{
108
116
  position: 'relative'
109
117
  },
110
118
  children: /*#__PURE__*/ _jsx(TextInput, {
111
- CustomError: errorMessage,
119
+ Error: {
120
+ type: 'client',
121
+ Component: null,
122
+ RenderedComponent: errorMessage
123
+ },
124
+ label: label,
112
125
  onChange: setValue,
113
126
  path: pathFromContext,
114
127
  required: required,
@@ -135,4 +148,4 @@ export const MetaTitle = (props)=>{
135
148
  });
136
149
  };
137
150
 
138
- //# sourceMappingURL=MetaTitle.js.map
151
+ //# 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 readonly 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 id: docInfo.id,\n slug: docInfo.slug,\n doc: getData(),\n docPermissions: docInfo.docPermissions,\n hasPublishPermission: docInfo.hasPublishPermission,\n hasSavePermission: docInfo.hasSavePermission,\n initialData: docInfo.initialData,\n initialState: docInfo.initialState,\n locale: typeof locale === 'object' ? locale?.code : locale,\n title: docInfo.title,\n } satisfies Omit<Parameters<GenerateTitle>[0], 'req'>),\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} field={null} 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","id","slug","doc","docPermissions","hasPublishPermission","hasSavePermission","initialData","initialState","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"}
@@ -2,12 +2,15 @@
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
3
  import { useAllFormFields, useForm, useTranslation } from '@payloadcms/ui';
4
4
  import React, { useCallback, useEffect, useState } from 'react';
5
- import { defaults } from '../defaults.js';
5
+ import { defaults } from '../../defaults.js';
6
6
  const { description: { maxLength: maxDesc, minLength: minDesc }, title: { maxLength: maxTitle, minLength: minTitle } } = defaults;
7
- export const Overview = ()=>{
7
+ export const OverviewComponent = ({ descriptionPath: descriptionPathFromContext, imagePath: imagePathFromContext, titlePath: titlePathFromContext })=>{
8
8
  const { // dispatchFields,
9
9
  getFields } = useForm();
10
- const [{ 'meta.description': { value: metaDesc } = {}, 'meta.image': { value: metaImage } = {}, 'meta.title': { value: metaTitle } = {} }] = useAllFormFields();
10
+ const descriptionPath = descriptionPathFromContext || 'meta.description';
11
+ const titlePath = titlePathFromContext || 'meta.title';
12
+ const imagePath = imagePathFromContext || 'meta.image';
13
+ const [{ [descriptionPath]: { value: metaDesc } = {}, [imagePath]: { value: metaImage } = {}, [titlePath]: { value: metaTitle } = {} }] = useAllFormFields();
11
14
  const { t } = useTranslation();
12
15
  const [titleIsValid, setTitleIsValid] = useState();
13
16
  const [descIsValid, setDescIsValid] = useState();
@@ -51,4 +54,4 @@ export const Overview = ()=>{
51
54
  });
52
55
  };
53
56
 
54
- //# sourceMappingURL=Overview.js.map
57
+ //# sourceMappingURL=OverviewComponent.js.map