@payloadcms/plugin-seo 3.0.0-beta.1 → 3.0.0-beta.100

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 (97) 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.d.ts +2 -0
  11. package/dist/exports/types.d.ts.map +1 -0
  12. package/dist/exports/types.js +3 -0
  13. package/dist/exports/types.js.map +1 -0
  14. package/dist/fields/MetaDescription/MetaDescriptionComponent.d.ts +8 -0
  15. package/dist/fields/MetaDescription/MetaDescriptionComponent.d.ts.map +1 -0
  16. package/dist/fields/MetaDescription/MetaDescriptionComponent.js +151 -0
  17. package/dist/fields/MetaDescription/MetaDescriptionComponent.js.map +1 -0
  18. package/dist/fields/MetaDescription/index.d.ts +12 -0
  19. package/dist/fields/MetaDescription/index.d.ts.map +1 -0
  20. package/dist/fields/MetaDescription/index.js +20 -0
  21. package/dist/fields/MetaDescription/index.js.map +1 -0
  22. package/dist/fields/MetaImage/MetaImageComponent.d.ts +8 -0
  23. package/dist/fields/MetaImage/MetaImageComponent.d.ts.map +1 -0
  24. package/dist/fields/MetaImage/MetaImageComponent.js +159 -0
  25. package/dist/fields/MetaImage/MetaImageComponent.js.map +1 -0
  26. package/dist/fields/MetaImage/index.d.ts +13 -0
  27. package/dist/fields/MetaImage/index.d.ts.map +1 -0
  28. package/dist/fields/MetaImage/index.js +23 -0
  29. package/dist/fields/MetaImage/index.js.map +1 -0
  30. package/dist/fields/MetaTitle/MetaTitleComponent.d.ts +9 -0
  31. package/dist/fields/MetaTitle/MetaTitleComponent.d.ts.map +1 -0
  32. package/dist/fields/MetaTitle/MetaTitleComponent.js +153 -0
  33. package/dist/fields/MetaTitle/MetaTitleComponent.js.map +1 -0
  34. package/dist/fields/MetaTitle/index.d.ts +12 -0
  35. package/dist/fields/MetaTitle/index.d.ts.map +1 -0
  36. package/dist/fields/MetaTitle/index.js +20 -0
  37. package/dist/fields/MetaTitle/index.js.map +1 -0
  38. package/dist/fields/Overview/OverviewComponent.d.ts +10 -0
  39. package/dist/fields/Overview/OverviewComponent.d.ts.map +1 -0
  40. package/dist/fields/Overview/OverviewComponent.js +60 -0
  41. package/dist/fields/Overview/OverviewComponent.js.map +1 -0
  42. package/dist/fields/Overview/index.d.ts +26 -0
  43. package/dist/fields/Overview/index.d.ts.map +1 -0
  44. package/dist/fields/Overview/index.js +22 -0
  45. package/dist/fields/Overview/index.js.map +1 -0
  46. package/dist/fields/Preview/PreviewComponent.d.ts +10 -0
  47. package/dist/fields/Preview/PreviewComponent.d.ts.map +1 -0
  48. package/dist/fields/Preview/PreviewComponent.js +106 -0
  49. package/dist/fields/Preview/PreviewComponent.js.map +1 -0
  50. package/dist/fields/Preview/index.d.ts +24 -0
  51. package/dist/fields/Preview/index.d.ts.map +1 -0
  52. package/dist/fields/Preview/index.js +22 -0
  53. package/dist/fields/Preview/index.js.map +1 -0
  54. package/dist/fields/index.scss +1 -1
  55. package/dist/index.d.ts +3 -4
  56. package/dist/index.d.ts.map +1 -1
  57. package/dist/index.js +58 -89
  58. package/dist/index.js.map +1 -1
  59. package/dist/translations/index.d.ts +69 -0
  60. package/dist/translations/index.d.ts.map +1 -1
  61. package/dist/translations/index.js +66 -0
  62. package/dist/translations/index.js.map +1 -1
  63. package/dist/translations/it.json +22 -0
  64. package/dist/translations/ru.json +22 -0
  65. package/dist/translations/uk.json +22 -0
  66. package/dist/types.d.ts +19 -14
  67. package/dist/types.d.ts.map +1 -1
  68. package/dist/types.js.map +1 -1
  69. package/dist/ui/LengthIndicator.d.ts.map +1 -1
  70. package/dist/ui/LengthIndicator.js +62 -41
  71. package/dist/ui/LengthIndicator.js.map +1 -1
  72. package/dist/ui/Pill.js +7 -3
  73. package/dist/ui/Pill.js.map +1 -1
  74. package/package.json +58 -33
  75. package/dist/fields/MetaDescription.d.ts +0 -9
  76. package/dist/fields/MetaDescription.d.ts.map +0 -1
  77. package/dist/fields/MetaDescription.js +0 -117
  78. package/dist/fields/MetaDescription.js.map +0 -1
  79. package/dist/fields/MetaImage.d.ts +0 -8
  80. package/dist/fields/MetaImage.d.ts.map +0 -1
  81. package/dist/fields/MetaImage.js +0 -121
  82. package/dist/fields/MetaImage.js.map +0 -1
  83. package/dist/fields/MetaTitle.d.ts +0 -9
  84. package/dist/fields/MetaTitle.d.ts.map +0 -1
  85. package/dist/fields/MetaTitle.js +0 -118
  86. package/dist/fields/MetaTitle.js.map +0 -1
  87. package/dist/ui/Overview.d.ts +0 -3
  88. package/dist/ui/Overview.d.ts.map +0 -1
  89. package/dist/ui/Overview.js +0 -51
  90. package/dist/ui/Overview.js.map +0 -1
  91. package/dist/ui/Preview.d.ts +0 -8
  92. package/dist/ui/Preview.d.ts.map +0 -1
  93. package/dist/ui/Preview.js +0 -79
  94. package/dist/ui/Preview.js.map +0 -1
  95. package/src/index.tsx +0 -293
  96. package/types.d.ts +0 -1
  97. package/types.js +0 -1
@@ -1,121 +0,0 @@
1
- 'use client';
2
- import { UploadInput } from '@payloadcms/ui/fields/Upload';
3
- import { FieldLabel } from '@payloadcms/ui/forms/FieldLabel';
4
- import { useAllFormFields } from '@payloadcms/ui/forms/Form';
5
- import { useField } from '@payloadcms/ui/forms/useField';
6
- import { useConfig } from '@payloadcms/ui/providers/Config';
7
- import { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo';
8
- import { useLocale } from '@payloadcms/ui/providers/Locale';
9
- import { useTranslation } from '@payloadcms/ui/providers/Translation';
10
- import React, { useCallback } from 'react';
11
- import { Pill } from '../ui/Pill.js';
12
- export const MetaImage = (props)=>{
13
- const { CustomLabel, hasGenerateImageFn, labelProps, relationTo, required } = props || {};
14
- const field = useField(props);
15
- const { t } = useTranslation();
16
- const locale = useLocale();
17
- const [fields] = useAllFormFields();
18
- const docInfo = useDocumentInfo();
19
- const { errorMessage, setValue, showError, value } = field;
20
- const regenerateImage = useCallback(async ()=>{
21
- if (!hasGenerateImageFn) return;
22
- const genImageResponse = await fetch('/api/plugin-seo/generate-image', {
23
- body: JSON.stringify({
24
- ...docInfo,
25
- doc: {
26
- ...fields
27
- },
28
- locale: typeof locale === 'object' ? locale?.code : locale
29
- }),
30
- credentials: 'include',
31
- headers: {
32
- 'Content-Type': 'application/json'
33
- },
34
- method: 'POST'
35
- });
36
- const { result: generatedImage } = await genImageResponse.json();
37
- setValue(generatedImage || '');
38
- }, [
39
- fields,
40
- setValue,
41
- hasGenerateImageFn,
42
- locale,
43
- docInfo
44
- ]);
45
- const hasImage = Boolean(value);
46
- const config = useConfig();
47
- const { collections, routes: { api } = {}, serverURL } = config;
48
- const collection = collections?.find((coll)=>coll.slug === relationTo) || undefined;
49
- return /*#__PURE__*/ React.createElement("div", {
50
- style: {
51
- marginBottom: '20px'
52
- }
53
- }, /*#__PURE__*/ React.createElement("div", {
54
- style: {
55
- marginBottom: '5px',
56
- position: 'relative'
57
- }
58
- }, /*#__PURE__*/ React.createElement("div", {
59
- className: "plugin-seo__field"
60
- }, CustomLabel !== undefined ? CustomLabel : /*#__PURE__*/ React.createElement(FieldLabel, labelProps || {}), required && /*#__PURE__*/ React.createElement("span", {
61
- style: {
62
- color: 'var(--theme-error-500)',
63
- marginLeft: '5px'
64
- }
65
- }, "*"), hasGenerateImageFn && /*#__PURE__*/ React.createElement(React.Fragment, null, "  —  ", /*#__PURE__*/ React.createElement("button", {
66
- onClick: regenerateImage,
67
- style: {
68
- background: 'none',
69
- backgroundColor: 'transparent',
70
- border: 'none',
71
- color: 'currentcolor',
72
- cursor: 'pointer',
73
- padding: 0,
74
- textDecoration: 'underline'
75
- },
76
- type: "button"
77
- }, t('plugin-seo:autoGenerate')))), hasGenerateImageFn && /*#__PURE__*/ React.createElement("div", {
78
- style: {
79
- color: '#9A9A9A'
80
- }
81
- }, t('plugin-seo:imageAutoGenerationTip'))), /*#__PURE__*/ React.createElement("div", {
82
- style: {
83
- marginBottom: '10px',
84
- position: 'relative'
85
- }
86
- }, /*#__PURE__*/ React.createElement(UploadInput, {
87
- CustomError: errorMessage,
88
- api: api,
89
- collection: collection,
90
- filterOptions: {},
91
- label: undefined,
92
- onChange: (incomingImage)=>{
93
- if (incomingImage !== null) {
94
- const { id: incomingID } = incomingImage;
95
- setValue(incomingID);
96
- } else {
97
- setValue(null);
98
- }
99
- },
100
- relationTo: relationTo,
101
- required: required,
102
- serverURL: serverURL,
103
- showError: showError,
104
- style: {
105
- marginBottom: 0
106
- },
107
- value: value
108
- })), /*#__PURE__*/ React.createElement("div", {
109
- style: {
110
- alignItems: 'center',
111
- display: 'flex',
112
- width: '100%'
113
- }
114
- }, /*#__PURE__*/ React.createElement(Pill, {
115
- backgroundColor: hasImage ? 'green' : 'red',
116
- color: "white",
117
- label: hasImage ? t('plugin-seo:good') : t('plugin-seo:noImage')
118
- })));
119
- };
120
-
121
- //# sourceMappingURL=MetaImage.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/fields/MetaImage.tsx"],"sourcesContent":["'use client'\n\nimport type { UploadInputProps } from '@payloadcms/ui/fields/Upload'\nimport type { FieldType, Options } from '@payloadcms/ui/forms/useField'\n\nimport { UploadInput } from '@payloadcms/ui/fields/Upload'\nimport { FieldLabel } from '@payloadcms/ui/forms/FieldLabel'\nimport { useAllFormFields } from '@payloadcms/ui/forms/Form'\nimport { useField } from '@payloadcms/ui/forms/useField'\nimport { useConfig } from '@payloadcms/ui/providers/Config'\nimport { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo'\nimport { useLocale } from '@payloadcms/ui/providers/Locale'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport React, { useCallback } from 'react'\n\nimport type { GenerateImage } from '../types.js'\n\nimport { Pill } from '../ui/Pill.js'\n\n// eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents\ntype MetaImageProps = UploadInputProps & {\n hasGenerateImageFn: boolean\n}\n\nexport const MetaImage: React.FC<MetaImageProps> = (props) => {\n const { CustomLabel, hasGenerateImageFn, labelProps, relationTo, required } = props || {}\n\n const field: FieldType<string> = useField(props as Options)\n\n const { t } = useTranslation()\n\n const locale = useLocale()\n const [fields] = useAllFormFields()\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: { ...fields },\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 { result: generatedImage } = await genImageResponse.json()\n\n setValue(generatedImage || '')\n }, [fields, setValue, hasGenerateImageFn, locale, docInfo])\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 {CustomLabel !== undefined ? CustomLabel : <FieldLabel {...(labelProps || {})} />}\n {required && (\n <span\n style={{\n color: 'var(--theme-error-500)',\n marginLeft: '5px',\n }}\n >\n *\n </span>\n )}\n {hasGenerateImageFn && (\n <React.Fragment>\n &nbsp; &mdash; &nbsp;\n <button\n onClick={regenerateImage}\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 CustomError={errorMessage}\n api={api}\n collection={collection}\n 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":["UploadInput","FieldLabel","useAllFormFields","useField","useConfig","useDocumentInfo","useLocale","useTranslation","React","useCallback","Pill","MetaImage","props","CustomLabel","hasGenerateImageFn","labelProps","relationTo","required","field","t","locale","fields","docInfo","errorMessage","setValue","showError","value","regenerateImage","genImageResponse","fetch","body","JSON","stringify","doc","code","credentials","headers","method","result","generatedImage","json","hasImage","Boolean","config","collections","routes","api","serverURL","collection","find","coll","slug","undefined","div","style","marginBottom","position","className","span","color","marginLeft","Fragment","button","onClick","background","backgroundColor","border","cursor","padding","textDecoration","type","CustomError","filterOptions","label","onChange","incomingImage","id","incomingID","alignItems","display","width"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
@@ -1,9 +0,0 @@
1
- import type { FormFieldBase } from '@payloadcms/ui/fields/shared';
2
- import React from 'react';
3
- import './index.scss';
4
- type MetaTitleProps = FormFieldBase & {
5
- hasGenerateTitleFn: boolean;
6
- };
7
- export declare const MetaTitle: React.FC<MetaTitleProps>;
8
- export {};
9
- //# sourceMappingURL=MetaTitle.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"MetaTitle.d.ts","sourceRoot":"","sources":["../../src/fields/MetaTitle.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAA;AAYjE,OAAO,KAAsB,MAAM,OAAO,CAAA;AAM1C,OAAO,cAAc,CAAA;AAKrB,KAAK,cAAc,GAAG,aAAa,GAAG;IACpC,kBAAkB,EAAE,OAAO,CAAA;CAC5B,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA+H9C,CAAA"}
@@ -1,118 +0,0 @@
1
- 'use client';
2
- import { TextInput } from '@payloadcms/ui/fields/Text';
3
- import { FieldLabel } from '@payloadcms/ui/forms/FieldLabel';
4
- import { useFieldProps } from '@payloadcms/ui/forms/FieldPropsProvider';
5
- import { useAllFormFields } from '@payloadcms/ui/forms/Form';
6
- import { useField } from '@payloadcms/ui/forms/useField';
7
- import { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo';
8
- import { useLocale } from '@payloadcms/ui/providers/Locale';
9
- import { useTranslation } from '@payloadcms/ui/providers/Translation';
10
- import React, { useCallback } from 'react';
11
- import { defaults } from '../defaults.js';
12
- import { LengthIndicator } from '../ui/LengthIndicator.js';
13
- import './index.scss';
14
- const { maxLength, minLength } = defaults.title;
15
- export const MetaTitle = (props)=>{
16
- const { CustomLabel, hasGenerateTitleFn, labelProps, path, required } = props || {};
17
- const { path: pathFromContext } = useFieldProps();
18
- const { t } = useTranslation();
19
- const field = useField({
20
- path
21
- });
22
- const locale = useLocale();
23
- const [fields] = useAllFormFields();
24
- const docInfo = useDocumentInfo();
25
- const { errorMessage, setValue, showError, value } = field;
26
- const regenerateTitle = useCallback(async ()=>{
27
- if (!hasGenerateTitleFn) return;
28
- const genTitleResponse = await fetch('/api/plugin-seo/generate-title', {
29
- body: JSON.stringify({
30
- ...docInfo,
31
- doc: {
32
- ...fields
33
- },
34
- locale: typeof locale === 'object' ? locale?.code : locale
35
- }),
36
- credentials: 'include',
37
- headers: {
38
- 'Content-Type': 'application/json'
39
- },
40
- method: 'POST'
41
- });
42
- const { result: generatedTitle } = await genTitleResponse.json();
43
- setValue(generatedTitle || '');
44
- }, [
45
- fields,
46
- setValue,
47
- hasGenerateTitleFn,
48
- locale,
49
- docInfo
50
- ]);
51
- return /*#__PURE__*/ React.createElement("div", {
52
- style: {
53
- marginBottom: '20px'
54
- }
55
- }, /*#__PURE__*/ React.createElement("div", {
56
- style: {
57
- marginBottom: '5px',
58
- position: 'relative'
59
- }
60
- }, /*#__PURE__*/ React.createElement("div", {
61
- className: "plugin-seo__field"
62
- }, CustomLabel !== undefined ? CustomLabel : /*#__PURE__*/ React.createElement(FieldLabel, labelProps || {}), required && /*#__PURE__*/ React.createElement("span", {
63
- style: {
64
- color: 'var(--theme-error-500)',
65
- marginLeft: '5px'
66
- }
67
- }, "*"), hasGenerateTitleFn && /*#__PURE__*/ React.createElement(React.Fragment, null, "  —  ", /*#__PURE__*/ React.createElement("button", {
68
- onClick: regenerateTitle,
69
- style: {
70
- background: 'none',
71
- backgroundColor: 'transparent',
72
- border: 'none',
73
- color: 'currentcolor',
74
- cursor: 'pointer',
75
- padding: 0,
76
- textDecoration: 'underline'
77
- },
78
- type: "button"
79
- }, t('plugin-seo:autoGenerate')))), /*#__PURE__*/ React.createElement("div", {
80
- style: {
81
- color: '#9A9A9A'
82
- }
83
- }, t('plugin-seo:lengthTipTitle', {
84
- maxLength,
85
- minLength
86
- }), /*#__PURE__*/ React.createElement("a", {
87
- href: "https://developers.google.com/search/docs/advanced/appearance/title-link#page-titles",
88
- rel: "noopener noreferrer",
89
- target: "_blank"
90
- }, t('plugin-seo:bestPractices')), ".")), /*#__PURE__*/ React.createElement("div", {
91
- style: {
92
- marginBottom: '10px',
93
- position: 'relative'
94
- }
95
- }, /*#__PURE__*/ React.createElement(TextInput, {
96
- CustomError: errorMessage,
97
- onChange: setValue,
98
- path: pathFromContext,
99
- required: required,
100
- showError: showError,
101
- style: {
102
- marginBottom: 0
103
- },
104
- value: value
105
- })), /*#__PURE__*/ React.createElement("div", {
106
- style: {
107
- alignItems: 'center',
108
- display: 'flex',
109
- width: '100%'
110
- }
111
- }, /*#__PURE__*/ React.createElement(LengthIndicator, {
112
- maxLength: maxLength,
113
- minLength: minLength,
114
- text: value
115
- })));
116
- };
117
-
118
- //# sourceMappingURL=MetaTitle.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/fields/MetaTitle.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '@payloadcms/ui/fields/shared'\nimport type { Options } from '@payloadcms/ui/forms/useField'\nimport type { FieldType } from '@payloadcms/ui/forms/useField'\n\nimport { TextInput } from '@payloadcms/ui/fields/Text'\nimport { FieldLabel } from '@payloadcms/ui/forms/FieldLabel'\nimport { useFieldProps } from '@payloadcms/ui/forms/FieldPropsProvider'\nimport { useAllFormFields } from '@payloadcms/ui/forms/Form'\nimport { useField } from '@payloadcms/ui/forms/useField'\nimport { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo'\nimport { useLocale } from '@payloadcms/ui/providers/Locale'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport React, { useCallback } from 'react'\n\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\n// eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents\ntype MetaTitleProps = FormFieldBase & {\n hasGenerateTitleFn: boolean\n}\n\nexport const MetaTitle: React.FC<MetaTitleProps> = (props) => {\n const { CustomLabel, hasGenerateTitleFn, labelProps, path, required } = props || {}\n const { path: pathFromContext } = useFieldProps()\n\n const { t } = useTranslation()\n\n const field: FieldType<string> = useField({\n path,\n } as Options)\n\n const locale = useLocale()\n const [fields] = useAllFormFields()\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: { ...fields },\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 }, [fields, setValue, hasGenerateTitleFn, locale, docInfo])\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 {CustomLabel !== undefined ? CustomLabel : <FieldLabel {...(labelProps || {})} />}\n {required && (\n <span\n style={{\n color: 'var(--theme-error-500)',\n marginLeft: '5px',\n }}\n >\n *\n </span>\n )}\n {hasGenerateTitleFn && (\n <React.Fragment>\n &nbsp; &mdash; &nbsp;\n <button\n onClick={regenerateTitle}\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 CustomError={errorMessage}\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":["TextInput","FieldLabel","useFieldProps","useAllFormFields","useField","useDocumentInfo","useLocale","useTranslation","React","useCallback","defaults","LengthIndicator","maxLength","minLength","title","MetaTitle","props","CustomLabel","hasGenerateTitleFn","labelProps","path","required","pathFromContext","t","field","locale","fields","docInfo","errorMessage","setValue","showError","value","regenerateTitle","genTitleResponse","fetch","body","JSON","stringify","doc","code","credentials","headers","method","result","generatedTitle","json","div","style","marginBottom","position","className","undefined","span","color","marginLeft","Fragment","button","onClick","background","backgroundColor","border","cursor","padding","textDecoration","type","a","href","rel","target","CustomError","onChange","alignItems","display","width","text"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AAMA,SAASA,SAAS,QAAQ,6BAA4B;AACtD,SAASC,UAAU,QAAQ,kCAAiC;AAC5D,SAASC,aAAa,QAAQ,0CAAyC;AACvE,SAASC,gBAAgB,QAAQ,4BAA2B;AAC5D,SAASC,QAAQ,QAAQ,gCAA+B;AACxD,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,cAAc,QAAQ,uCAAsC;AACrE,OAAOC,SAASC,WAAW,QAAQ,QAAO;AAI1C,SAASC,QAAQ,QAAQ,iBAAgB;AACzC,SAASC,eAAe,QAAQ,2BAA0B;AAC1D,OAAO,eAAc;AAErB,MAAM,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGH,SAASI,KAAK;AAO/C,OAAO,MAAMC,YAAsC,CAACC;IAClD,MAAM,EAAEC,WAAW,EAAEC,kBAAkB,EAAEC,UAAU,EAAEC,IAAI,EAAEC,QAAQ,EAAE,GAAGL,SAAS,CAAC;IAClF,MAAM,EAAEI,MAAME,eAAe,EAAE,GAAGpB;IAElC,MAAM,EAAEqB,CAAC,EAAE,GAAGhB;IAEd,MAAMiB,QAA2BpB,SAAS;QACxCgB;IACF;IAEA,MAAMK,SAASnB;IACf,MAAM,CAACoB,OAAO,GAAGvB;IACjB,MAAMwB,UAAUtB;IAEhB,MAAM,EAAEuB,YAAY,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,KAAK,EAAE,GAAGP;IAErD,MAAMQ,kBAAkBvB,YAAY;QAClC,IAAI,CAACS,oBAAoB;QAEzB,MAAMe,mBAAmB,MAAMC,MAAM,kCAAkC;YACrEC,MAAMC,KAAKC,SAAS,CAAC;gBACnB,GAAGV,OAAO;gBACVW,KAAK;oBAAE,GAAGZ,MAAM;gBAAC;gBACjBD,QAAQ,OAAOA,WAAW,WAAWA,QAAQc,OAAOd;YACtD;YACAe,aAAa;YACbC,SAAS;gBACP,gBAAgB;YAClB;YACAC,QAAQ;QACV;QAEA,MAAM,EAAEC,QAAQC,cAAc,EAAE,GAAG,MAAMX,iBAAiBY,IAAI;QAE9DhB,SAASe,kBAAkB;IAC7B,GAAG;QAAClB;QAAQG;QAAUX;QAAoBO;QAAQE;KAAQ;IAE1D,qBACE,oBAACmB;QACCC,OAAO;YACLC,cAAc;QAChB;qBAEA,oBAACF;QACCC,OAAO;YACLC,cAAc;YACdC,UAAU;QACZ;qBAEA,oBAACH;QAAII,WAAU;OACZjC,gBAAgBkC,YAAYlC,4BAAc,oBAAChB,YAAgBkB,cAAc,CAAC,IAC1EE,0BACC,oBAAC+B;QACCL,OAAO;YACLM,OAAO;YACPC,YAAY;QACd;OACD,MAIFpC,oCACC,oBAACV,MAAM+C,QAAQ,QAAC,uBAEd,oBAACC;QACCC,SAASzB;QACTe,OAAO;YACLW,YAAY;YACZC,iBAAiB;YACjBC,QAAQ;YACRP,OAAO;YACPQ,QAAQ;YACRC,SAAS;YACTC,gBAAgB;QAClB;QACAC,MAAK;OAEJzC,EAAE,6CAKX,oBAACuB;QACCC,OAAO;YACLM,OAAO;QACT;OAEC9B,EAAE,6BAA6B;QAAEX;QAAWC;IAAU,kBACvD,oBAACoD;QACCC,MAAK;QACLC,KAAI;QACJC,QAAO;OAEN7C,EAAE,8BACD,qBAIR,oBAACuB;QACCC,OAAO;YACLC,cAAc;YACdC,UAAU;QACZ;qBAEA,oBAACjD;QACCqE,aAAazC;QACb0C,UAAUzC;QACVT,MAAME;QACND,UAAUA;QACVS,WAAWA;QACXiB,OAAO;YACLC,cAAc;QAChB;QACAjB,OAAOA;uBAGX,oBAACe;QACCC,OAAO;YACLwB,YAAY;YACZC,SAAS;YACTC,OAAO;QACT;qBAEA,oBAAC9D;QAAgBC,WAAWA;QAAWC,WAAWA;QAAW6D,MAAM3C;;AAI3E,EAAC"}
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- export declare const Overview: React.FC;
3
- //# sourceMappingURL=Overview.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Overview.d.ts","sourceRoot":"","sources":["../../src/ui/Overview.tsx"],"names":[],"mappings":"AAMA,OAAO,KAA2C,MAAM,OAAO,CAAA;AAS/D,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAoD5B,CAAA"}
@@ -1,51 +0,0 @@
1
- 'use client';
2
- import { useAllFormFields, useForm } from '@payloadcms/ui/forms/Form';
3
- import { useTranslation } from '@payloadcms/ui/providers/Translation';
4
- import React, { useCallback, useEffect, useState } from 'react';
5
- import { defaults } from '../defaults.js';
6
- const { description: { maxLength: maxDesc, minLength: minDesc }, title: { maxLength: maxTitle, minLength: minTitle } } = defaults;
7
- export const Overview = ()=>{
8
- const { // dispatchFields,
9
- getFields } = useForm();
10
- const [{ 'meta.description': { value: metaDesc } = {}, 'meta.image': { value: metaImage } = {}, 'meta.title': { value: metaTitle } = {} }] = useAllFormFields();
11
- const { t } = useTranslation();
12
- const [titleIsValid, setTitleIsValid] = useState();
13
- const [descIsValid, setDescIsValid] = useState();
14
- const [imageIsValid, setImageIsValid] = useState();
15
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
16
- const resetAll = useCallback(()=>{
17
- const fields = getFields();
18
- const fieldsWithoutMeta = fields;
19
- fieldsWithoutMeta['meta.title'].value = '';
20
- fieldsWithoutMeta['meta.description'].value = '';
21
- fieldsWithoutMeta['meta.image'].value = '';
22
- // dispatchFields(fieldsWithoutMeta);
23
- }, [
24
- getFields
25
- ]);
26
- useEffect(()=>{
27
- if (typeof metaTitle === 'string') setTitleIsValid(metaTitle.length >= minTitle && metaTitle.length <= maxTitle);
28
- if (typeof metaDesc === 'string') setDescIsValid(metaDesc.length >= minDesc && metaDesc.length <= maxDesc);
29
- setImageIsValid(Boolean(metaImage));
30
- }, [
31
- metaTitle,
32
- metaDesc,
33
- metaImage
34
- ]);
35
- const testResults = [
36
- titleIsValid,
37
- descIsValid,
38
- imageIsValid
39
- ];
40
- const numberOfPasses = testResults.filter(Boolean).length;
41
- return /*#__PURE__*/ React.createElement("div", {
42
- style: {
43
- marginBottom: '20px'
44
- }
45
- }, /*#__PURE__*/ React.createElement("div", null, t('plugin-seo:checksPassing', {
46
- current: numberOfPasses,
47
- max: testResults.length
48
- })));
49
- };
50
-
51
- //# sourceMappingURL=Overview.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/ui/Overview.tsx"],"sourcesContent":["'use client'\n\nimport type { FormField } from 'payload/types'\n\nimport { useAllFormFields, useForm } from '@payloadcms/ui/forms/Form'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport { defaults } from '../defaults.js'\n\nconst {\n description: { maxLength: maxDesc, minLength: minDesc },\n title: { maxLength: maxTitle, minLength: minTitle },\n} = defaults\n\nexport const Overview: React.FC = () => {\n const {\n // dispatchFields,\n getFields,\n } = useForm()\n\n const [\n {\n 'meta.description': { value: metaDesc } = {} as FormField,\n 'meta.image': { value: metaImage } = {} as FormField,\n 'meta.title': { value: metaTitle } = {} as FormField,\n },\n ] = useAllFormFields()\n const { t } = useTranslation()\n\n const [titleIsValid, setTitleIsValid] = useState<boolean | undefined>()\n const [descIsValid, setDescIsValid] = useState<boolean | undefined>()\n const [imageIsValid, setImageIsValid] = useState<boolean | undefined>()\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const resetAll = useCallback(() => {\n const fields = getFields()\n const fieldsWithoutMeta = fields\n fieldsWithoutMeta['meta.title'].value = ''\n fieldsWithoutMeta['meta.description'].value = ''\n fieldsWithoutMeta['meta.image'].value = ''\n // dispatchFields(fieldsWithoutMeta);\n }, [getFields])\n\n useEffect(() => {\n if (typeof metaTitle === 'string')\n setTitleIsValid(metaTitle.length >= minTitle && metaTitle.length <= maxTitle)\n if (typeof metaDesc === 'string')\n setDescIsValid(metaDesc.length >= minDesc && metaDesc.length <= maxDesc)\n setImageIsValid(Boolean(metaImage))\n }, [metaTitle, metaDesc, metaImage])\n\n const testResults = [titleIsValid, descIsValid, imageIsValid]\n\n const numberOfPasses = testResults.filter(Boolean).length\n\n return (\n <div\n style={{\n marginBottom: '20px',\n }}\n >\n <div>\n {t('plugin-seo:checksPassing', { current: numberOfPasses, max: testResults.length })}\n </div>\n </div>\n )\n}\n"],"names":["useAllFormFields","useForm","useTranslation","React","useCallback","useEffect","useState","defaults","description","maxLength","maxDesc","minLength","minDesc","title","maxTitle","minTitle","Overview","getFields","value","metaDesc","metaImage","metaTitle","t","titleIsValid","setTitleIsValid","descIsValid","setDescIsValid","imageIsValid","setImageIsValid","resetAll","fields","fieldsWithoutMeta","length","Boolean","testResults","numberOfPasses","filter","div","style","marginBottom","current","max"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AAIA,SAASA,gBAAgB,EAAEC,OAAO,QAAQ,4BAA2B;AACrE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,OAAOC,SAASC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AAE/D,SAASC,QAAQ,QAAQ,iBAAgB;AAEzC,MAAM,EACJC,aAAa,EAAEC,WAAWC,OAAO,EAAEC,WAAWC,OAAO,EAAE,EACvDC,OAAO,EAAEJ,WAAWK,QAAQ,EAAEH,WAAWI,QAAQ,EAAE,EACpD,GAAGR;AAEJ,OAAO,MAAMS,WAAqB;IAChC,MAAM,EACJ,mBAAmB;IACnBC,SAAS,EACV,GAAGhB;IAEJ,MAAM,CACJ,EACE,oBAAoB,EAAEiB,OAAOC,QAAQ,EAAE,GAAG,CAAC,CAAc,EACzD,cAAc,EAAED,OAAOE,SAAS,EAAE,GAAG,CAAC,CAAc,EACpD,cAAc,EAAEF,OAAOG,SAAS,EAAE,GAAG,CAAC,CAAc,EACrD,CACF,GAAGrB;IACJ,MAAM,EAAEsB,CAAC,EAAE,GAAGpB;IAEd,MAAM,CAACqB,cAAcC,gBAAgB,GAAGlB;IACxC,MAAM,CAACmB,aAAaC,eAAe,GAAGpB;IACtC,MAAM,CAACqB,cAAcC,gBAAgB,GAAGtB;IAExC,6DAA6D;IAC7D,MAAMuB,WAAWzB,YAAY;QAC3B,MAAM0B,SAASb;QACf,MAAMc,oBAAoBD;QAC1BC,iBAAiB,CAAC,aAAa,CAACb,KAAK,GAAG;QACxCa,iBAAiB,CAAC,mBAAmB,CAACb,KAAK,GAAG;QAC9Ca,iBAAiB,CAAC,aAAa,CAACb,KAAK,GAAG;IACxC,qCAAqC;IACvC,GAAG;QAACD;KAAU;IAEdZ,UAAU;QACR,IAAI,OAAOgB,cAAc,UACvBG,gBAAgBH,UAAUW,MAAM,IAAIjB,YAAYM,UAAUW,MAAM,IAAIlB;QACtE,IAAI,OAAOK,aAAa,UACtBO,eAAeP,SAASa,MAAM,IAAIpB,WAAWO,SAASa,MAAM,IAAItB;QAClEkB,gBAAgBK,QAAQb;IAC1B,GAAG;QAACC;QAAWF;QAAUC;KAAU;IAEnC,MAAMc,cAAc;QAACX;QAAcE;QAAaE;KAAa;IAE7D,MAAMQ,iBAAiBD,YAAYE,MAAM,CAACH,SAASD,MAAM;IAEzD,qBACE,oBAACK;QACCC,OAAO;YACLC,cAAc;QAChB;qBAEA,oBAACF,aACEf,EAAE,4BAA4B;QAAEkB,SAASL;QAAgBM,KAAKP,YAAYF,MAAM;IAAC;AAI1F,EAAC"}
@@ -1,8 +0,0 @@
1
- import type { UIField } from 'payload/types';
2
- import React from 'react';
3
- type PreviewProps = UIField & {
4
- hasGenerateURLFn: boolean;
5
- };
6
- export declare const Preview: React.FC<PreviewProps>;
7
- export {};
8
- //# sourceMappingURL=Preview.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Preview.d.ts","sourceRoot":"","sources":["../../src/ui/Preview.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAa,OAAO,EAAE,MAAM,eAAe,CAAA;AAMvD,OAAO,KAA8B,MAAM,OAAO,CAAA;AAKlD,KAAK,YAAY,GAAG,OAAO,GAAG;IAC5B,gBAAgB,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CA+F1C,CAAA"}
@@ -1,79 +0,0 @@
1
- 'use client';
2
- import { useAllFormFields } from '@payloadcms/ui/forms/Form';
3
- import { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo';
4
- import { useLocale } from '@payloadcms/ui/providers/Locale';
5
- import { useTranslation } from '@payloadcms/ui/providers/Translation';
6
- import React, { useEffect, useState } from 'react';
7
- export const Preview = ({ hasGenerateURLFn })=>{
8
- const { t } = useTranslation();
9
- const locale = useLocale();
10
- const [fields] = useAllFormFields();
11
- const docInfo = useDocumentInfo();
12
- const { 'meta.description': { value: metaDescription } = {}, 'meta.title': { value: metaTitle } = {} } = fields;
13
- const [href, setHref] = useState();
14
- useEffect(()=>{
15
- const getHref = async ()=>{
16
- const genURLResponse = await fetch('/api/plugin-seo/generate-url', {
17
- body: JSON.stringify({
18
- ...docInfo,
19
- doc: {
20
- ...fields
21
- },
22
- locale: typeof locale === 'object' ? locale?.code : locale
23
- }),
24
- credentials: 'include',
25
- headers: {
26
- 'Content-Type': 'application/json'
27
- },
28
- method: 'POST'
29
- });
30
- const { result: newHref } = await genURLResponse.json();
31
- setHref(newHref);
32
- };
33
- if (hasGenerateURLFn && !href) {
34
- void getHref();
35
- }
36
- }, [
37
- fields,
38
- href,
39
- locale,
40
- docInfo,
41
- hasGenerateURLFn
42
- ]);
43
- return /*#__PURE__*/ React.createElement("div", null, /*#__PURE__*/ React.createElement("div", null, t('plugin-seo:preview')), /*#__PURE__*/ React.createElement("div", {
44
- style: {
45
- color: '#9A9A9A',
46
- marginBottom: '5px'
47
- }
48
- }, t('plugin-seo:previewDescription')), /*#__PURE__*/ React.createElement("div", {
49
- style: {
50
- background: 'var(--theme-elevation-50)',
51
- borderRadius: '5px',
52
- boxShadow: '0px 0px 10px rgba(0, 0, 0, 0.1)',
53
- maxWidth: '600px',
54
- padding: '20px',
55
- pointerEvents: 'none',
56
- width: '100%'
57
- }
58
- }, /*#__PURE__*/ React.createElement("div", null, /*#__PURE__*/ React.createElement("a", {
59
- href: href,
60
- style: {
61
- textDecoration: 'none'
62
- }
63
- }, href || 'https://...')), /*#__PURE__*/ React.createElement("h4", {
64
- style: {
65
- margin: 0
66
- }
67
- }, /*#__PURE__*/ React.createElement("a", {
68
- href: "/",
69
- style: {
70
- textDecoration: 'none'
71
- }
72
- }, metaTitle)), /*#__PURE__*/ React.createElement("p", {
73
- style: {
74
- margin: 0
75
- }
76
- }, metaDescription)));
77
- };
78
-
79
- //# sourceMappingURL=Preview.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/ui/Preview.tsx"],"sourcesContent":["'use client'\n\nimport type { FormField, UIField } from 'payload/types'\n\nimport { useAllFormFields } from '@payloadcms/ui/forms/Form'\nimport { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo'\nimport { useLocale } from '@payloadcms/ui/providers/Locale'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport React, { useEffect, useState } from 'react'\n\nimport type { GenerateURL } from '../types.js'\n\n// eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents\ntype PreviewProps = UIField & {\n hasGenerateURLFn: boolean\n}\n\nexport const Preview: React.FC<PreviewProps> = ({ hasGenerateURLFn }) => {\n const { t } = useTranslation()\n\n const locale = useLocale()\n const [fields] = useAllFormFields()\n const docInfo = useDocumentInfo()\n\n const {\n 'meta.description': { value: metaDescription } = {} as FormField,\n 'meta.title': { value: metaTitle } = {} as FormField,\n } = fields\n\n const [href, setHref] = useState<string>()\n\n useEffect(() => {\n const getHref = async () => {\n const genURLResponse = await fetch('/api/plugin-seo/generate-url', {\n body: JSON.stringify({\n ...docInfo,\n doc: { ...fields },\n locale: typeof locale === 'object' ? locale?.code : locale,\n } satisfies Parameters<GenerateURL>[0]),\n credentials: 'include',\n headers: {\n 'Content-Type': 'application/json',\n },\n method: 'POST',\n })\n\n const { result: newHref } = await genURLResponse.json()\n\n setHref(newHref)\n }\n\n if (hasGenerateURLFn && !href) {\n void getHref()\n }\n }, [fields, href, locale, docInfo, hasGenerateURLFn])\n\n return (\n <div>\n <div>{t('plugin-seo:preview')}</div>\n <div\n style={{\n color: '#9A9A9A',\n marginBottom: '5px',\n }}\n >\n {t('plugin-seo:previewDescription')}\n </div>\n <div\n style={{\n background: 'var(--theme-elevation-50)',\n borderRadius: '5px',\n boxShadow: '0px 0px 10px rgba(0, 0, 0, 0.1)',\n maxWidth: '600px',\n padding: '20px',\n pointerEvents: 'none',\n width: '100%',\n }}\n >\n <div>\n <a\n href={href}\n style={{\n textDecoration: 'none',\n }}\n >\n {href || 'https://...'}\n </a>\n </div>\n <h4\n style={{\n margin: 0,\n }}\n >\n <a\n href=\"/\"\n style={{\n textDecoration: 'none',\n }}\n >\n {metaTitle as string}\n </a>\n </h4>\n <p\n style={{\n margin: 0,\n }}\n >\n {metaDescription as string}\n </p>\n </div>\n </div>\n )\n}\n"],"names":["useAllFormFields","useDocumentInfo","useLocale","useTranslation","React","useEffect","useState","Preview","hasGenerateURLFn","t","locale","fields","docInfo","value","metaDescription","metaTitle","href","setHref","getHref","genURLResponse","fetch","body","JSON","stringify","doc","code","credentials","headers","method","result","newHref","json","div","style","color","marginBottom","background","borderRadius","boxShadow","maxWidth","padding","pointerEvents","width","a","textDecoration","h4","margin","p"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AAIA,SAASA,gBAAgB,QAAQ,4BAA2B;AAC5D,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,cAAc,QAAQ,uCAAsC;AACrE,OAAOC,SAASC,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AASlD,OAAO,MAAMC,UAAkC,CAAC,EAAEC,gBAAgB,EAAE;IAClE,MAAM,EAAEC,CAAC,EAAE,GAAGN;IAEd,MAAMO,SAASR;IACf,MAAM,CAACS,OAAO,GAAGX;IACjB,MAAMY,UAAUX;IAEhB,MAAM,EACJ,oBAAoB,EAAEY,OAAOC,eAAe,EAAE,GAAG,CAAC,CAAc,EAChE,cAAc,EAAED,OAAOE,SAAS,EAAE,GAAG,CAAC,CAAc,EACrD,GAAGJ;IAEJ,MAAM,CAACK,MAAMC,QAAQ,GAAGX;IAExBD,UAAU;QACR,MAAMa,UAAU;YACd,MAAMC,iBAAiB,MAAMC,MAAM,gCAAgC;gBACjEC,MAAMC,KAAKC,SAAS,CAAC;oBACnB,GAAGX,OAAO;oBACVY,KAAK;wBAAE,GAAGb,MAAM;oBAAC;oBACjBD,QAAQ,OAAOA,WAAW,WAAWA,QAAQe,OAAOf;gBACtD;gBACAgB,aAAa;gBACbC,SAAS;oBACP,gBAAgB;gBAClB;gBACAC,QAAQ;YACV;YAEA,MAAM,EAAEC,QAAQC,OAAO,EAAE,GAAG,MAAMX,eAAeY,IAAI;YAErDd,QAAQa;QACV;QAEA,IAAItB,oBAAoB,CAACQ,MAAM;YAC7B,KAAKE;QACP;IACF,GAAG;QAACP;QAAQK;QAAMN;QAAQE;QAASJ;KAAiB;IAEpD,qBACE,oBAACwB,2BACC,oBAACA,aAAKvB,EAAE,sCACR,oBAACuB;QACCC,OAAO;YACLC,OAAO;YACPC,cAAc;QAChB;OAEC1B,EAAE,iDAEL,oBAACuB;QACCC,OAAO;YACLG,YAAY;YACZC,cAAc;YACdC,WAAW;YACXC,UAAU;YACVC,SAAS;YACTC,eAAe;YACfC,OAAO;QACT;qBAEA,oBAACV,2BACC,oBAACW;QACC3B,MAAMA;QACNiB,OAAO;YACLW,gBAAgB;QAClB;OAEC5B,QAAQ,+BAGb,oBAAC6B;QACCZ,OAAO;YACLa,QAAQ;QACV;qBAEA,oBAACH;QACC3B,MAAK;QACLiB,OAAO;YACLW,gBAAgB;QAClB;OAEC7B,2BAGL,oBAACgC;QACCd,OAAO;YACLa,QAAQ;QACV;OAEChC;AAKX,EAAC"}