@payload-enchants/translator 0.0.1-alpha.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Ritsu / Sasha Rakhmatulin
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,193 @@
+# Translator plugin for Payload 3.0 (beta)
+
+## Install
+
+`pnpm add @payload-enchants/translator`
+
+## Video
+
+https://github.com/r1tsuu/payload-plugin-translator/assets/64744993/d39aeba4-bafc-4c3b-838e-9abc5cf1d64a
+
+## Features:
+
+1. A flexible structure with [resolvers](https://github.com/r1tsuu/payload-plugin-translator/tree/6d0c8098467f9b5e757bf9fd8cfe63ff5da68d5b/plugin/src/resolvers) that allows you to apply any kind of transformation to your localizated data.
+2. Can be used not only from the admin panel, but within Local API as well. [Example of the hook](#example-of-the-hook-that-uses-local-operation-to-copy-the-doc-data-to-other-locales) that automatically fills the other locales data on create
+3. Out of the box supports 3 resolvers - Copy, Google Translate, OpenAI and your own can be written easily.
+4. Works with any nested document structure and 2 Rich Text editor adapters - Lexical and Slate.
+
+## Usage:
+
+```ts
+import { buildConfig } from 'payload/config';
+import { translator } from '@payload-enchants/translator';
+import { copyResolver } from '@payload-enchants/translator/resolvers/copy';
+import { googleResolver } from '@payload-enchants/translator/resolvers/google';
+import { openAIResolver } from '@payload-enchants/translator/resolvers/openAI';
+
+export default buildConfig({
+  plugins: [
+    translator({
+      // collections with the enabled translator in the admin UI
+      collections: ['posts', 'small-posts'],
+      // globals with the enabled translator in the admin UI
+      globals: [],
+      // add resolvers that you want to include, examples on how to write your own in ./plugin/src/resolvers
+      resolvers: [
+        copyResolver(),
+        googleResolver({
+          apiKey: process.env.GOOGLE_API_KEY!,
+        }),
+        openAIResolver({
+          apiKey: process.env.OPENAI_KEY!,
+        }),
+      ],
+    }),
+  ],
+});
+```
+
+## Resolvers
+
+### OpenAI
+
+#### Config:
+
+```ts
+export type OpenAIResolverConfig = {
+  apiKey: string; // API key
+  chunkLength?: number; // How many texts to include into 1 request, default: 100
+  model?: string; // model, default: 'gpt-3.5-turbo'
+  promt?: OpenAIPrompt; // custom prompt
+};
+```
+
+### Custom prompt:
+
+```ts
+export type OpenAIPrompt = (args: {
+  localeFrom: string;
+  localeTo: string;
+  texts: string[];
+}) => string;
+
+// Default
+const defaultPromt: OpenAIPrompt = ({ localeFrom, localeTo, texts }) => {
+  return `Translate me the following array: ${JSON.stringify(texts)} in locale=${localeFrom} to locale ${localeTo}, respond me with the same array structure`;
+};
+```
+
+### Google
+
+#### Config:
+
+```ts
+export type GoogleResolverConfig = {
+  apiKey: string; // API key
+  chunkLength?: number; / /How many texts to include into 1 request, default: 100
+};
+```
+
+### Writing your own
+
+```ts
+import type { TranslateResolver } from '@payload-enchants/translator/resolvers/types';
+
+const myResolver: TranslateResolver = {
+  key: 'my',
+  resolve: async (args) => {
+    const { localeFrom, localeTo, req, texts } = args;
+    // here you can apply any kind of transformation to incoming texts, could be as well API call to a service.
+    const transformed = texts.map((each) => `${each} translated to ${localeTo}`);
+
+    return {
+      success: true,
+      translatedTexts: transformed,
+    };
+  },
+};
+
+export default buildConfig({
+  plugins: [
+    payloadPluginTranslator({
+      collections: ['posts', 'small-posts'],
+      globals: [],
+      resolvers: [myResolver],
+    }),
+  ],
+  // apply translations that will be used for your resolver in the admin UI
+  i18n: {
+    supportedLanguages: { en },
+    translations: {
+      en: {
+        'plugin-translator': {
+          resolver_my_buttonLabel: 'Google Translate',
+          resolver_my_errorMessage: 'An error occurred when trying to translate the data',
+          resolver_my_modalTitle: 'Choose the locale to translate from',
+          resolver_my_submitButtonLabelEmpty: 'Translate only empty fields',
+          resolver_my_submitButtonLabelFull: 'Translate all',
+          resolver_my_successMessage: 'Successfully translated. Press "Save" to apply the changes.',
+        },
+      },
+    },
+  },
+});
+```
+
+## Using the Local API
+
+```ts
+import { translateOperation } from '@payload-enchants/translator';
+
+const translateResult = await translateOperation({
+  collectionSlug: 'posts', // or globalSlug if globals,
+  emptyOnly: false, // optional, should translate all the fields values or only fields that are empty, by default false.
+  id: postDefaultLocale.id, // pass the doc id if it's a collection
+  locale: 'de', // locale to translate to
+  localeFrom: 'en', // locale to translate from
+  payload, // payload instance, you can get it with getPayload or req.payload in hooks
+  req, // PayloadRequest, can be used instead of payload, more appreciable than payload if you have it
+  overrideAccess: false, //
+  resolver: 'copy', // pass resolver key
+  update: true, // optional, should update immediately or just return the translated result, default false
+  data: {}, // Optional, if you want to translate from your data passed here instead of the current doc, should be in "localeFrom" locale, for example { title: "Hello" }
+});
+```
+
+### Example of the hook that uses local operation to copy the doc data to other locales
+
+```ts
+import type { CollectionAfterChangeHook } from 'payload/types';
+import { translateOperation } from '@payload-enchants/translator';
+
+export const copyOtherLocales: CollectionAfterChangeHook = async ({
+  collection,
+  doc,
+  operation,
+  req,
+}) => {
+  if (operation !== 'create') return;
+
+  const locale = req.locale;
+
+  if (!locale || !req.payload.config.localization) return;
+
+  const otherLocales = req.payload.config.localization.locales.filter(
+    (each) => each.code !== locale,
+  );
+
+  const { id } = doc;
+
+  for (const { code } of otherLocales) {
+    await translateOperation({
+      collectionSlug: collection.slug,
+      data: doc,
+      id,
+      locale: code,
+      localeFrom: locale,
+      req,
+      resolver: 'copy',
+      update: true,
+    });
+  }
+};
+```

package/dist/client/api/index.d.ts

@@ -0,0 +1,8 @@
+import type { TranslateEndpointArgs, TranslateResult } from '../../translate/types';
+export declare const createClient: ({ api, serverURL }: {
+    api: string;
+    serverURL: string;
+}) => {
+    translate: (args: TranslateEndpointArgs) => Promise<TranslateResult>;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/client/api/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/client/api/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAEpF,eAAO,MAAM,YAAY,uBAAwB;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAA;CAAE;sBAClD,qBAAqB,KAAG,QAAQ,eAAe,CAAC;CAwBhF,CAAC"}

package/dist/client/api/index.js

@@ -0,0 +1,28 @@
+export const createClient = ({ api, serverURL })=>{
+    const translate = async (args)=>{
+        try {
+            const response = await fetch(`${serverURL}${api}/translator/translate`, {
+                body: JSON.stringify(args),
+                credentials: 'include',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                method: 'POST'
+            });
+            if (!response.ok) return {
+                success: false
+            };
+            return response.json();
+        } catch (e) {
+            if (e instanceof Error) console.error(e.message);
+            return {
+                success: false
+            };
+        }
+    };
+    return {
+        translate
+    };
+};
+
+//# sourceMappingURL=index.js.map

package/dist/client/api/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/client/api/index.ts"],"sourcesContent":["import type { TranslateEndpointArgs, TranslateResult } from '../../translate/types';\r\n\r\nexport const createClient = ({ api, serverURL }: { api: string; serverURL: string }) => {\r\n  const translate = async (args: TranslateEndpointArgs): Promise<TranslateResult> => {\r\n    try {\r\n      const response = await fetch(`${serverURL}${api}/translator/translate`, {\r\n        body: JSON.stringify(args),\r\n        credentials: 'include',\r\n        headers: {\r\n          'Content-Type': 'application/json',\r\n        },\r\n        method: 'POST',\r\n      });\r\n\r\n      if (!response.ok) return { success: false };\r\n\r\n      return response.json();\r\n    } catch (e) {\r\n      if (e instanceof Error) console.error(e.message);\r\n\r\n      return { success: false };\r\n    }\r\n  };\r\n\r\n  return {\r\n    translate,\r\n  };\r\n};\r\n"],"names":["createClient","api","serverURL","translate","args","response","fetch","body","JSON","stringify","credentials","headers","method","ok","success","json","e","Error","console","error","message"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAEA,OAAO,MAAMA,eAAe,CAAC,EAAEC,GAAG,EAAEC,SAAS,EAAsC;IACjF,MAAMC,YAAY,OAAOC;QACvB,IAAI;YACF,MAAMC,WAAW,MAAMC,MAAM,CAAC,EAAEJ,UAAU,EAAED,IAAI,qBAAqB,CAAC,EAAE;gBACtEM,MAAMC,KAAKC,SAAS,CAACL;gBACrBM,aAAa;gBACbC,SAAS;oBACP,gBAAgB;gBAClB;gBACAC,QAAQ;YACV;YAEA,IAAI,CAACP,SAASQ,EAAE,EAAE,OAAO;gBAAEC,SAAS;YAAM;YAE1C,OAAOT,SAASU,IAAI;QACtB,EAAE,OAAOC,GAAG;YACV,IAAIA,aAAaC,OAAOC,QAAQC,KAAK,CAACH,EAAEI,OAAO;YAE/C,OAAO;gBAAEN,SAAS;YAAM;QAC1B;IACF;IAEA,OAAO;QACLX;IACF;AACF,EAAE"}

package/dist/client/components/CustomSaveButton/CustomSaveButton.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" resolution-mode="require"/>
+import './styles.scss';
+export declare const CustomSaveButton: () => import("react").JSX.Element;
+//# sourceMappingURL=CustomSaveButton.d.ts.map

package/dist/client/components/CustomSaveButton/CustomSaveButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomSaveButton.d.ts","sourceRoot":"","sources":["../../../../src/client/components/CustomSaveButton/CustomSaveButton.tsx"],"names":[],"mappings":";AAEA,OAAO,eAAe,CAAC;AAWvB,eAAO,MAAM,gBAAgB,mCAoB5B,CAAC"}

package/dist/client/components/CustomSaveButton/CustomSaveButton.js

@@ -0,0 +1,22 @@
+'use client';
+import './styles.scss';
+import { DefaultSaveButton } from '@payloadcms/ui/elements/Save';
+import { useConfig } from '@payloadcms/ui/providers/Config';
+import { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo';
+import { TranslatorProvider } from '../../providers/Translator/TranslatorProvider';
+import { ResolverButton } from '../ResolverButton';
+import { TranslatorModal } from '../TranslatorModal';
+export const CustomSaveButton = ()=>{
+    const config = useConfig();
+    const { globalSlug, id } = useDocumentInfo();
+    const resolvers = config.admin?.custom?.translator?.resolvers ?? [];
+    if (!id && !globalSlug) return /*#__PURE__*/ React.createElement(DefaultSaveButton, null);
+    return /*#__PURE__*/ React.createElement(TranslatorProvider, null, /*#__PURE__*/ React.createElement("div", {
+        className: 'translator__custom-save-button'
+    }, /*#__PURE__*/ React.createElement(TranslatorModal, null), resolvers.map((resolver)=>/*#__PURE__*/ React.createElement(ResolverButton, {
+            key: resolver.key,
+            resolver: resolver
+        })), /*#__PURE__*/ React.createElement(DefaultSaveButton, null)));
+};
+
+//# sourceMappingURL=CustomSaveButton.js.map

package/dist/client/components/CustomSaveButton/CustomSaveButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/components/CustomSaveButton/CustomSaveButton.tsx"],"sourcesContent":["'use client';\r\n\r\nimport './styles.scss';\r\n\r\nimport { DefaultSaveButton } from '@payloadcms/ui/elements/Save';\r\nimport { useConfig } from '@payloadcms/ui/providers/Config';\r\nimport { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo';\r\n\r\nimport type { TranslateResolver } from '../../../resolvers/types';\r\nimport { TranslatorProvider } from '../../providers/Translator/TranslatorProvider';\r\nimport { ResolverButton } from '../ResolverButton';\r\nimport { TranslatorModal } from '../TranslatorModal';\r\n\r\nexport const CustomSaveButton = () => {\r\n  const config = useConfig();\r\n\r\n  const { globalSlug, id } = useDocumentInfo();\r\n\r\n  const resolvers = (config.admin?.custom?.translator?.resolvers as TranslateResolver[]) ?? [];\r\n\r\n  if (!id && !globalSlug) return <DefaultSaveButton />;\r\n\r\n  return (\r\n    <TranslatorProvider>\r\n      <div className={'translator__custom-save-button'}>\r\n        <TranslatorModal />\r\n        {resolvers.map((resolver) => (\r\n          <ResolverButton key={resolver.key} resolver={resolver} />\r\n        ))}\r\n        <DefaultSaveButton />\r\n      </div>\r\n    </TranslatorProvider>\r\n  );\r\n};\r\n"],"names":["DefaultSaveButton","useConfig","useDocumentInfo","TranslatorProvider","ResolverButton","TranslatorModal","CustomSaveButton","config","globalSlug","id","resolvers","admin","custom","translator","div","className","map","resolver","key"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AAEA,OAAO,gBAAgB;AAEvB,SAASA,iBAAiB,QAAQ,+BAA+B;AACjE,SAASC,SAAS,QAAQ,kCAAkC;AAC5D,SAASC,eAAe,QAAQ,wCAAwC;AAGxE,SAASC,kBAAkB,QAAQ,gDAAgD;AACnF,SAASC,cAAc,QAAQ,oBAAoB;AACnD,SAASC,eAAe,QAAQ,qBAAqB;AAErD,OAAO,MAAMC,mBAAmB;IAC9B,MAAMC,SAASN;IAEf,MAAM,EAAEO,UAAU,EAAEC,EAAE,EAAE,GAAGP;IAE3B,MAAMQ,YAAY,AAACH,OAAOI,KAAK,EAAEC,QAAQC,YAAYH,aAAqC,EAAE;IAE5F,IAAI,CAACD,MAAM,CAACD,YAAY,qBAAO,oBAACR;IAEhC,qBACE,oBAACG,wCACC,oBAACW;QAAIC,WAAW;qBACd,oBAACV,wBACAK,UAAUM,GAAG,CAAC,CAACC,yBACd,oBAACb;YAAec,KAAKD,SAASC,GAAG;YAAED,UAAUA;2BAE/C,oBAACjB;AAIT,EAAE"}

package/dist/client/components/CustomSaveButton/index.d.ts

@@ -0,0 +1,2 @@
+export * from './CustomSaveButton';
+//# sourceMappingURL=index.d.ts.map

package/dist/client/components/CustomSaveButton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/client/components/CustomSaveButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC"}

package/dist/client/components/CustomSaveButton/index.js

@@ -0,0 +1,3 @@
+export * from './CustomSaveButton';
+
+//# sourceMappingURL=index.js.map

package/dist/client/components/CustomSaveButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/components/CustomSaveButton/index.ts"],"sourcesContent":["export * from './CustomSaveButton';\r\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,qBAAqB"}

package/dist/client/components/CustomSaveButton/styles.scss

@@ -0,0 +1,5 @@
+.translator__custom-save-button {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}

package/dist/client/components/LocaleLabel/LocaleLabel.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" resolution-mode="require"/>
+import type { Locale } from 'payload/config';
+export declare const LocaleLabel: ({ locale }: {
+    locale: Locale;
+}) => import("react").JSX.Element;
+//# sourceMappingURL=LocaleLabel.d.ts.map

package/dist/client/components/LocaleLabel/LocaleLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LocaleLabel.d.ts","sourceRoot":"","sources":["../../../../src/client/components/LocaleLabel/LocaleLabel.tsx"],"names":[],"mappings":";AAGA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAI7C,eAAO,MAAM,WAAW,eAAgB;IAAE,MAAM,EAAE,MAAM,CAAA;CAAE,gCAczD,CAAC"}

package/dist/client/components/LocaleLabel/LocaleLabel.js

@@ -0,0 +1,19 @@
+import { getTranslation } from '@payloadcms/translations';
+import { Chevron } from '@payloadcms/ui/icons/Chevron';
+import { useTranslation } from '@payloadcms/ui/providers/Translation';
+const baseClass = 'localizer-button';
+export const LocaleLabel = ({ locale })=>{
+    const { i18n, t } = useTranslation();
+    return /*#__PURE__*/ React.createElement("div", {
+        "aria-label": t('general:locale'),
+        className: baseClass
+    }, /*#__PURE__*/ React.createElement("div", {
+        className: `${baseClass}__label`
+    }, `${t('general:locale')}:`), "  ", /*#__PURE__*/ React.createElement("span", {
+        className: `${baseClass}__current-label`
+    }, `${getTranslation(locale.label, i18n)}`), " ", /*#__PURE__*/ React.createElement(Chevron, {
+        className: `${baseClass}__chevron`
+    }));
+};
+
+//# sourceMappingURL=LocaleLabel.js.map

package/dist/client/components/LocaleLabel/LocaleLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/components/LocaleLabel/LocaleLabel.tsx"],"sourcesContent":["import { getTranslation } from '@payloadcms/translations';\r\nimport { Chevron } from '@payloadcms/ui/icons/Chevron';\r\nimport { useTranslation } from '@payloadcms/ui/providers/Translation';\r\nimport type { Locale } from 'payload/config';\r\n\r\nconst baseClass = 'localizer-button';\r\n\r\nexport const LocaleLabel = ({ locale }: { locale: Locale }) => {\r\n  const { i18n, t } = useTranslation();\r\n\r\n  return (\r\n    <div aria-label={t('general:locale')} className={baseClass}>\r\n      <div className={`${baseClass}__label`}>{`${t('general:locale')}:`}</div>\r\n      &nbsp;&nbsp;\r\n      <span className={`${baseClass}__current-label`}>\r\n        {`${getTranslation(locale.label, i18n)}`}\r\n      </span>\r\n      &nbsp;\r\n      <Chevron className={`${baseClass}__chevron`} />\r\n    </div>\r\n  );\r\n};\r\n"],"names":["getTranslation","Chevron","useTranslation","baseClass","LocaleLabel","locale","i18n","t","div","aria-label","className","span","label"],"rangeMappings":";;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,cAAc,QAAQ,2BAA2B;AAC1D,SAASC,OAAO,QAAQ,+BAA+B;AACvD,SAASC,cAAc,QAAQ,uCAAuC;AAGtE,MAAMC,YAAY;AAElB,OAAO,MAAMC,cAAc,CAAC,EAAEC,MAAM,EAAsB;IACxD,MAAM,EAAEC,IAAI,EAAEC,CAAC,EAAE,GAAGL;IAEpB,qBACE,oBAACM;QAAIC,cAAYF,EAAE;QAAmBG,WAAWP;qBAC/C,oBAACK;QAAIE,WAAW,CAAC,EAAEP,UAAU,OAAO,CAAC;OAAG,CAAC,EAAEI,EAAE,kBAAkB,CAAC,CAAC,GAAO,oBAExE,oBAACI;QAAKD,WAAW,CAAC,EAAEP,UAAU,eAAe,CAAC;OAC3C,CAAC,EAAEH,eAAeK,OAAOO,KAAK,EAAEN,MAAM,CAAC,GACnC,mBAEP,oBAACL;QAAQS,WAAW,CAAC,EAAEP,UAAU,SAAS,CAAC;;AAGjD,EAAE"}

package/dist/client/components/LocaleLabel/index.d.ts

@@ -0,0 +1,2 @@
+export * from './LocaleLabel';
+//# sourceMappingURL=index.d.ts.map

package/dist/client/components/LocaleLabel/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/client/components/LocaleLabel/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC"}

package/dist/client/components/LocaleLabel/index.js

@@ -0,0 +1,3 @@
+export * from './LocaleLabel';
+
+//# sourceMappingURL=index.js.map

package/dist/client/components/LocaleLabel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/components/LocaleLabel/index.ts"],"sourcesContent":["export * from './LocaleLabel';\r\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,gBAAgB"}

package/dist/client/components/ResolverButton/ResolverButton.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" resolution-mode="require"/>
+import type { TranslateResolver } from '../../../resolvers/types';
+export declare const ResolverButton: ({ resolver: { key: resolverKey }, }: {
+    resolver: TranslateResolver;
+}) => import("react").JSX.Element;
+//# sourceMappingURL=ResolverButton.d.ts.map

package/dist/client/components/ResolverButton/ResolverButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResolverButton.d.ts","sourceRoot":"","sources":["../../../../src/client/components/ResolverButton/ResolverButton.tsx"],"names":[],"mappings":";AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAGlE,eAAO,MAAM,cAAc,wCAExB;IACD,QAAQ,EAAE,iBAAiB,CAAC;CAC7B,gCAYA,CAAC"}

package/dist/client/components/ResolverButton/ResolverButton.js

@@ -0,0 +1,16 @@
+import { Button } from '@payloadcms/ui/elements';
+import { useTranslation } from '@payloadcms/ui/providers/Translation';
+import { useTranslator } from '../../providers/Translator/context';
+export const ResolverButton = ({ resolver: { key: resolverKey } })=>{
+    const { openTranslator } = useTranslator();
+    const { t } = useTranslation();
+    const handleClick = ()=>openTranslator({
+            resolverKey
+        });
+    return /*#__PURE__*/ React.createElement(Button, {
+        onClick: handleClick,
+        size: "small"
+    }, t(`plugin-translator:resolver_${resolverKey}_buttonLabel`));
+};
+
+//# sourceMappingURL=ResolverButton.js.map

package/dist/client/components/ResolverButton/ResolverButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/components/ResolverButton/ResolverButton.tsx"],"sourcesContent":["import { Button } from '@payloadcms/ui/elements';\r\nimport { useTranslation } from '@payloadcms/ui/providers/Translation';\r\n\r\nimport type { TranslateResolver } from '../../../resolvers/types';\r\nimport { useTranslator } from '../../providers/Translator/context';\r\n\r\nexport const ResolverButton = ({\r\n  resolver: { key: resolverKey },\r\n}: {\r\n  resolver: TranslateResolver;\r\n}) => {\r\n  const { openTranslator } = useTranslator();\r\n\r\n  const { t } = useTranslation();\r\n\r\n  const handleClick = () => openTranslator({ resolverKey });\r\n\r\n  return (\r\n    <Button onClick={handleClick} size='small'>\r\n      {t(`plugin-translator:resolver_${resolverKey}_buttonLabel`)}\r\n    </Button>\r\n  );\r\n};\r\n"],"names":["Button","useTranslation","useTranslator","ResolverButton","resolver","key","resolverKey","openTranslator","t","handleClick","onClick","size"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAAA,SAASA,MAAM,QAAQ,0BAA0B;AACjD,SAASC,cAAc,QAAQ,uCAAuC;AAGtE,SAASC,aAAa,QAAQ,qCAAqC;AAEnE,OAAO,MAAMC,iBAAiB,CAAC,EAC7BC,UAAU,EAAEC,KAAKC,WAAW,EAAE,EAG/B;IACC,MAAM,EAAEC,cAAc,EAAE,GAAGL;IAE3B,MAAM,EAAEM,CAAC,EAAE,GAAGP;IAEd,MAAMQ,cAAc,IAAMF,eAAe;YAAED;QAAY;IAEvD,qBACE,oBAACN;QAAOU,SAASD;QAAaE,MAAK;OAChCH,EAAE,CAAC,2BAA2B,EAAEF,YAAY,YAAY,CAAC;AAGhE,EAAE"}

package/dist/client/components/ResolverButton/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ResolverButton';
+//# sourceMappingURL=index.d.ts.map

package/dist/client/components/ResolverButton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/client/components/ResolverButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC"}

package/dist/client/components/ResolverButton/index.js

@@ -0,0 +1,3 @@
+export * from './ResolverButton';
+
+//# sourceMappingURL=index.js.map

package/dist/client/components/ResolverButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/components/ResolverButton/index.ts"],"sourcesContent":["export * from './ResolverButton';\r\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,mBAAmB"}

package/dist/client/components/TranslatorModal/Content.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" resolution-mode="require"/>
+export declare const Content: () => import("react").JSX.Element;
+//# sourceMappingURL=Content.d.ts.map

package/dist/client/components/TranslatorModal/Content.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Content.d.ts","sourceRoot":"","sources":["../../../../src/client/components/TranslatorModal/Content.tsx"],"names":[],"mappings":";AAOA,eAAO,MAAM,OAAO,mCAwDnB,CAAC"}

package/dist/client/components/TranslatorModal/Content.js

@@ -0,0 +1,42 @@
+import { getTranslation } from '@payloadcms/translations';
+import { Button, Popup, PopupList } from '@payloadcms/ui/elements';
+import { useTranslation } from '@payloadcms/ui/providers/Translation';
+import { useTranslator } from '../../providers/Translator/context';
+import { LocaleLabel } from '../LocaleLabel';
+export const Content = ()=>{
+    const { localeToTranslateFrom: localeCodeToTranslateFrom, localesOptions, resolverT, setLocaleToTranslateFrom, submit } = useTranslator();
+    const { i18n } = useTranslation();
+    const localeToTranslateFrom = localesOptions.find((each)=>each.code === localeCodeToTranslateFrom);
+    return /*#__PURE__*/ React.createElement("div", {
+        className: 'translator__content'
+    }, /*#__PURE__*/ React.createElement("h2", null, resolverT('modalTitle')), localeToTranslateFrom && /*#__PURE__*/ React.createElement(Popup, {
+        button: /*#__PURE__*/ React.createElement(LocaleLabel, {
+            locale: localeToTranslateFrom
+        }),
+        horizontalAlign: "center",
+        render: ({ close })=>/*#__PURE__*/ React.createElement(PopupList.ButtonGroup, null, localesOptions.map((option)=>{
+                const label = getTranslation(option.label, i18n);
+                return /*#__PURE__*/ React.createElement(PopupList.Button, {
+                    active: option.code === localeCodeToTranslateFrom,
+                    key: option.code,
+                    onClick: ()=>{
+                        setLocaleToTranslateFrom(option.code);
+                        close();
+                    }
+                }, label, label !== option.code && ` (${option.code})`);
+            })),
+        verticalAlign: "bottom"
+    }), /*#__PURE__*/ React.createElement("div", {
+        className: 'translator__buttons'
+    }, /*#__PURE__*/ React.createElement(Button, {
+        onClick: ()=>submit({
+                emptyOnly: false
+            })
+    }, resolverT('submitButtonLabelFull')), /*#__PURE__*/ React.createElement(Button, {
+        onClick: ()=>submit({
+                emptyOnly: true
+            })
+    }, resolverT('submitButtonLabelEmpty'))));
+};
+
+//# sourceMappingURL=Content.js.map

package/dist/client/components/TranslatorModal/Content.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/components/TranslatorModal/Content.tsx"],"sourcesContent":["import { getTranslation } from '@payloadcms/translations';\r\nimport { Button, Popup, PopupList } from '@payloadcms/ui/elements';\r\nimport { useTranslation } from '@payloadcms/ui/providers/Translation';\r\n\r\nimport { useTranslator } from '../../providers/Translator/context';\r\nimport { LocaleLabel } from '../LocaleLabel';\r\n\r\nexport const Content = () => {\r\n  const {\r\n    localeToTranslateFrom: localeCodeToTranslateFrom,\r\n    localesOptions,\r\n    resolverT,\r\n    setLocaleToTranslateFrom,\r\n    submit,\r\n  } = useTranslator();\r\n\r\n  const { i18n } = useTranslation();\r\n\r\n  const localeToTranslateFrom = localesOptions.find(\r\n    (each) => each.code === localeCodeToTranslateFrom,\r\n  );\r\n\r\n  return (\r\n    <div className={'translator__content'}>\r\n      <h2>{resolverT('modalTitle')}</h2>\r\n      {localeToTranslateFrom && (\r\n        <Popup\r\n          button={<LocaleLabel locale={localeToTranslateFrom} />}\r\n          horizontalAlign='center'\r\n          render={({ close }) => (\r\n            <PopupList.ButtonGroup>\r\n              {localesOptions.map((option) => {\r\n                const label = getTranslation(option.label, i18n);\r\n\r\n                return (\r\n                  <PopupList.Button\r\n                    active={option.code === localeCodeToTranslateFrom}\r\n                    key={option.code}\r\n                    onClick={() => {\r\n                      setLocaleToTranslateFrom(option.code);\r\n                      close();\r\n                    }}\r\n                  >\r\n                    {label}\r\n                    {label !== option.code && ` (${option.code})`}\r\n                  </PopupList.Button>\r\n                );\r\n              })}\r\n            </PopupList.ButtonGroup>\r\n          )}\r\n          verticalAlign='bottom'\r\n        />\r\n      )}\r\n      <div className={'translator__buttons'}>\r\n        <Button onClick={() => submit({ emptyOnly: false })}>\r\n          {resolverT('submitButtonLabelFull')}\r\n        </Button>\r\n        <Button onClick={() => submit({ emptyOnly: true })}>\r\n          {resolverT('submitButtonLabelEmpty')}\r\n        </Button>\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n"],"names":["getTranslation","Button","Popup","PopupList","useTranslation","useTranslator","LocaleLabel","Content","localeToTranslateFrom","localeCodeToTranslateFrom","localesOptions","resolverT","setLocaleToTranslateFrom","submit","i18n","find","each","code","div","className","h2","button","locale","horizontalAlign","render","close","ButtonGroup","map","option","label","active","key","onClick","verticalAlign","emptyOnly"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,cAAc,QAAQ,2BAA2B;AAC1D,SAASC,MAAM,EAAEC,KAAK,EAAEC,SAAS,QAAQ,0BAA0B;AACnE,SAASC,cAAc,QAAQ,uCAAuC;AAEtE,SAASC,aAAa,QAAQ,qCAAqC;AACnE,SAASC,WAAW,QAAQ,iBAAiB;AAE7C,OAAO,MAAMC,UAAU;IACrB,MAAM,EACJC,uBAAuBC,yBAAyB,EAChDC,cAAc,EACdC,SAAS,EACTC,wBAAwB,EACxBC,MAAM,EACP,GAAGR;IAEJ,MAAM,EAAES,IAAI,EAAE,GAAGV;IAEjB,MAAMI,wBAAwBE,eAAeK,IAAI,CAC/C,CAACC,OAASA,KAAKC,IAAI,KAAKR;IAG1B,qBACE,oBAACS;QAAIC,WAAW;qBACd,oBAACC,YAAIT,UAAU,gBACdH,uCACC,oBAACN;QACCmB,sBAAQ,oBAACf;YAAYgB,QAAQd;;QAC7Be,iBAAgB;QAChBC,QAAQ,CAAC,EAAEC,KAAK,EAAE,iBAChB,oBAACtB,UAAUuB,WAAW,QACnBhB,eAAeiB,GAAG,CAAC,CAACC;gBACnB,MAAMC,QAAQ7B,eAAe4B,OAAOC,KAAK,EAAEf;gBAE3C,qBACE,oBAACX,UAAUF,MAAM;oBACf6B,QAAQF,OAAOX,IAAI,KAAKR;oBACxBsB,KAAKH,OAAOX,IAAI;oBAChBe,SAAS;wBACPpB,yBAAyBgB,OAAOX,IAAI;wBACpCQ;oBACF;mBAECI,OACAA,UAAUD,OAAOX,IAAI,IAAI,CAAC,EAAE,EAAEW,OAAOX,IAAI,CAAC,CAAC,CAAC;YAGnD;QAGJgB,eAAc;sBAGlB,oBAACf;QAAIC,WAAW;qBACd,oBAAClB;QAAO+B,SAAS,IAAMnB,OAAO;gBAAEqB,WAAW;YAAM;OAC9CvB,UAAU,yCAEb,oBAACV;QAAO+B,SAAS,IAAMnB,OAAO;gBAAEqB,WAAW;YAAK;OAC7CvB,UAAU;AAKrB,EAAE"}

package/dist/client/components/TranslatorModal/TranslatorModal.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" resolution-mode="require"/>
+import './styles.scss';
+export declare const TranslatorModal: () => import("react").JSX.Element | undefined;
+//# sourceMappingURL=TranslatorModal.d.ts.map

package/dist/client/components/TranslatorModal/TranslatorModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TranslatorModal.d.ts","sourceRoot":"","sources":["../../../../src/client/components/TranslatorModal/TranslatorModal.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AAOvB,eAAO,MAAM,eAAe,+CAkB3B,CAAC"}

package/dist/client/components/TranslatorModal/TranslatorModal.js

@@ -0,0 +1,21 @@
+import './styles.scss';
+import { Modal } from '@payloadcms/ui/elements';
+import { useTranslator } from '../../providers/Translator/context';
+import { Content } from './Content';
+export const TranslatorModal = ()=>{
+    const { closeTranslator, modalSlug, resolver } = useTranslator();
+    if (!resolver) return;
+    return /*#__PURE__*/ React.createElement(Modal, {
+        className: 'translator__modal',
+        slug: modalSlug
+    }, /*#__PURE__*/ React.createElement("div", {
+        className: 'translator__wrapper'
+    }, /*#__PURE__*/ React.createElement("span", {
+        "aria-label": "Close",
+        className: 'translator__close',
+        onClick: closeTranslator,
+        role: "button"
+    }), /*#__PURE__*/ React.createElement(Content, null)));
+};
+
+//# sourceMappingURL=TranslatorModal.js.map

package/dist/client/components/TranslatorModal/TranslatorModal.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/components/TranslatorModal/TranslatorModal.tsx"],"sourcesContent":["import './styles.scss';\r\n\r\nimport { Modal } from '@payloadcms/ui/elements';\r\n\r\nimport { useTranslator } from '../../providers/Translator/context';\r\nimport { Content } from './Content';\r\n\r\nexport const TranslatorModal = () => {\r\n  const { closeTranslator, modalSlug, resolver } = useTranslator();\r\n\r\n  if (!resolver) return;\r\n\r\n  return (\r\n    <Modal className={'translator__modal'} slug={modalSlug}>\r\n      <div className={'translator__wrapper'}>\r\n        <span\r\n          aria-label='Close'\r\n          className={'translator__close'}\r\n          onClick={closeTranslator}\r\n          role='button'\r\n        />\r\n        <Content />\r\n      </div>\r\n    </Modal>\r\n  );\r\n};\r\n"],"names":["Modal","useTranslator","Content","TranslatorModal","closeTranslator","modalSlug","resolver","className","slug","div","span","aria-label","onClick","role"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":"AAAA,OAAO,gBAAgB;AAEvB,SAASA,KAAK,QAAQ,0BAA0B;AAEhD,SAASC,aAAa,QAAQ,qCAAqC;AACnE,SAASC,OAAO,QAAQ,YAAY;AAEpC,OAAO,MAAMC,kBAAkB;IAC7B,MAAM,EAAEC,eAAe,EAAEC,SAAS,EAAEC,QAAQ,EAAE,GAAGL;IAEjD,IAAI,CAACK,UAAU;IAEf,qBACE,oBAACN;QAAMO,WAAW;QAAqBC,MAAMH;qBAC3C,oBAACI;QAAIF,WAAW;qBACd,oBAACG;QACCC,cAAW;QACXJ,WAAW;QACXK,SAASR;QACTS,MAAK;sBAEP,oBAACX;AAIT,EAAE"}

package/dist/client/components/TranslatorModal/index.d.ts

@@ -0,0 +1,2 @@
+export * from './TranslatorModal';
+//# sourceMappingURL=index.d.ts.map

package/dist/client/components/TranslatorModal/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/client/components/TranslatorModal/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/dist/client/components/TranslatorModal/index.js

@@ -0,0 +1,3 @@
+export * from './TranslatorModal';
+
+//# sourceMappingURL=index.js.map

package/dist/client/components/TranslatorModal/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/components/TranslatorModal/index.ts"],"sourcesContent":["export * from './TranslatorModal';\r\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,oBAAoB"}

package/dist/client/components/TranslatorModal/styles.scss

@@ -0,0 +1,76 @@
+.translator {
+  &__modal {
+    display: flex;
+    position: relative;
+    justify-content: center;
+    align-items: center;
+    width: fit-content;
+    height: fit-content;
+  }
+
+  &__wrapper {
+    display: flex;
+    position: relative;
+    flex-direction: column;
+    gap: var(--base);
+    z-index: 1;
+    background: var(--theme-elevation-50);
+    padding: 50px;
+  }
+
+  &__content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: var(--base);
+    max-width: 400px;
+
+    h2 {
+      margin: 0;
+      text-align: center;
+    }
+  }
+
+  &__buttons {
+    display: flex;
+    justify-content: center;
+    gap: 10px;
+    width: 100%;
+
+    button {
+      margin: 0;
+    }
+  }
+
+  &__close {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    transition: 0.25s;
+    cursor: pointer;
+    width: 32px;
+    height: 32px;
+
+    &:hover {
+      opacity: 0.6;
+    }
+
+    &:before,
+    &:after {
+      position: absolute;
+      left: 15px;
+      background-color: var(--theme-elevation-800);
+      width: 2px;
+      height: 33px;
+      content: ' ';
+    }
+
+    &:before {
+      transform: rotate(45deg);
+    }
+
+    &:after {
+      transform: rotate(-45deg);
+    }
+  }
+}