payload-intl 0.0.1

package/README.md

@@ -0,0 +1,67 @@
+# Payload Intl Plugin
+
+A Payload CMS plugin for internationalization (i18n) message management.
+
+## Features
+
+- Manage translation messages through a user-friendly interface
+- Support for multiple locales
+- Tree and tab-based message organization
+- Import/export functionality
+- Copy messages between paths
+
+## Installation
+
+```bash
+# npm
+npm install payload-intl
+
+# pnpm
+pnpm add payload-intl
+
+```
+
+## Usage
+
+```typescript
+import { intlPlugin } from "payload-intl";
+
+export default buildConfig({
+  plugins: [
+    intlPlugin({
+      schema: {
+        // Your message schema
+      },
+    }),
+  ],
+});
+```
+
+Set up a storage adapter and disable `disablePayloadAccessControl` to ensure the translations are fetched directly from the storage provider.
+
+## Pain Points
+
+- Messages can have missing/wrong arguments
+- User does not know which arguments are required and how to use them
+- User does not know the purpose of a field or where it is used
+- Changing messages structure causes data loss
+
+## Development
+
+```bash
+# Install dependencies
+pnpm install
+
+# Start development server
+pnpm dev
+
+# Build the plugin
+pnpm build
+
+# Run tests
+pnpm test
+```
+
+## License
+
+MIT

package/dist/components/MessageController.d.ts

@@ -0,0 +1,14 @@
+import { TemplateVariable } from '../types.ts';
+import { MessageType } from '../utils/schema';
+import { MessageValidator } from '../utils/validate';
+interface MessageControllerProps {
+    type: MessageType;
+    label: string;
+    locale: string;
+    name: string;
+    className?: string;
+    variables: TemplateVariable[];
+    validate: MessageValidator;
+}
+export declare function MessageController({ type, name, variables, label, locale, validate, className, }: MessageControllerProps): React.ReactNode;
+export {};

package/dist/components/MessageController.js

@@ -0,0 +1,64 @@
+import { Controller as l } from "react-hook-form";
+import { useMessagesForm as s } from "@/context/messages-form";
+import { MessageInput as p } from "./inputs/MessageInput.js";
+import { RichTextInput as h } from "./inputs/RichTextInput.js";
+function B({
+  type: c,
+  name: n,
+  variables: m,
+  label: o,
+  locale: t,
+  validate: g,
+  className: u
+}) {
+  const { control: a } = s();
+  return c === "rich" ? /* @__PURE__ */ React.createElement(
+    l,
+    {
+      control: a,
+      name: n,
+      render: ({ field: r, fieldState: e }) => /* @__PURE__ */ React.createElement(
+        h,
+        {
+          className: u,
+          error: e.error,
+          label: o,
+          lang: t,
+          onChange: r.onChange,
+          onBlur: r.onBlur,
+          value: r.value || ""
+        }
+      ),
+      rules: {
+        required: !0
+      }
+    }
+  ) : /* @__PURE__ */ React.createElement(
+    l,
+    {
+      control: a,
+      name: n,
+      render: ({ field: r, fieldState: e }) => /* @__PURE__ */ React.createElement(
+        p,
+        {
+          label: o,
+          lang: t,
+          className: u,
+          value: r.value || "",
+          variables: m,
+          error: e.error,
+          onChange: r.onChange,
+          onBlur: r.onBlur
+        }
+      ),
+      rules: {
+        required: !0,
+        validate: g
+      }
+    }
+  );
+}
+export {
+  B as MessageController
+};
+//# sourceMappingURL=MessageController.js.map

package/dist/components/MessageController.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageController.js","sources":["../../src/components/MessageController.tsx"],"sourcesContent":["import type { TemplateVariable } from \"@/types\";\nimport type { MessageType } from \"@/utils/schema\";\nimport type { MessageValidator } from \"@/utils/validate\";\nimport { Controller } from \"react-hook-form\";\n\nimport { useMessagesForm } from \"@/context/messages-form\";\n\nimport { MessageInput } from \"./inputs/MessageInput\";\nimport { RichTextInput } from \"./inputs/RichTextInput\";\n\ninterface MessageControllerProps {\n  type: MessageType;\n  label: string;\n  locale: string;\n  name: string;\n  className?: string;\n  variables: TemplateVariable[];\n  validate: MessageValidator;\n}\n\nexport function MessageController({\n  type,\n  name,\n  variables,\n  label,\n  locale,\n  validate,\n  className,\n}: MessageControllerProps): React.ReactNode {\n  const { control } = useMessagesForm();\n\n  if (type === \"rich\") {\n    return (\n      <Controller\n        control={control}\n        name={name}\n        render={({ field, fieldState }) => (\n          <RichTextInput\n            className={className}\n            error={fieldState.error}\n            label={label}\n            lang={locale}\n            onChange={field.onChange}\n            onBlur={field.onBlur}\n            value={(field.value as unknown as string) || \"\"}\n          />\n        )}\n        rules={{\n          required: true,\n        }}\n      />\n    );\n  }\n\n  return (\n    <Controller\n      control={control}\n      name={name}\n      render={({ field, fieldState }) => (\n        <MessageInput\n          label={label}\n          lang={locale}\n          className={className}\n          value={(field.value as unknown as string) || \"\"}\n          variables={variables}\n          error={fieldState.error}\n          onChange={field.onChange}\n          onBlur={field.onBlur}\n        />\n      )}\n      rules={{\n        required: true,\n        validate,\n      }}\n    />\n  );\n}\n"],"names":["MessageController","type","name","variables","label","locale","validate","className","control","useMessagesForm","Controller","field","fieldState","RichTextInput","MessageInput"],"mappings":";;;;AAoBO,SAASA,EAAkB;AAAA,EAChC,MAAAC;AAAA,EACA,MAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,GAA4C;AAC1C,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA;AAEpB,SAAIR,MAAS,SAET,sBAAA;AAAA,IAACS;AAAA,IAAA;AAAA,MACC,SAAAF;AAAA,MACA,MAAAN;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAS,GAAO,YAAAC,QAChB,sBAAA;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,WAAAN;AAAA,UACA,OAAOK,EAAW;AAAA,UAClB,OAAAR;AAAA,UACA,MAAMC;AAAA,UACN,UAAUM,EAAM;AAAA,UAChB,QAAQA,EAAM;AAAA,UACd,OAAQA,EAAM,SAA+B;AAAA,QAAA;AAAA,MAAA;AAAA,MAGjD,OAAO;AAAA,QACL,UAAU;AAAA,MAAA;AAAA,IACZ;AAAA,EAAA,IAMJ,sBAAA;AAAA,IAACD;AAAA,IAAA;AAAA,MACC,SAAAF;AAAA,MACA,MAAAN;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAS,GAAO,YAAAC,QAChB,sBAAA;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,OAAAV;AAAA,UACA,MAAMC;AAAA,UACN,WAAAE;AAAA,UACA,OAAQI,EAAM,SAA+B;AAAA,UAC7C,WAAAR;AAAA,UACA,OAAOS,EAAW;AAAA,UAClB,UAAUD,EAAM;AAAA,UAChB,QAAQA,EAAM;AAAA,QAAA;AAAA,MAAA;AAAA,MAGlB,OAAO;AAAA,QACL,UAAU;AAAA,QACV,UAAAL;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN;"}

package/dist/components/MessagesForm.d.ts

@@ -0,0 +1,11 @@
+import { DeepPartial, Locales, Messages, MessagesSchema, RichTextEditorOptions, Translations } from '../types.ts';
+interface MessagesFormProps {
+    locales: Locales;
+    schema: MessagesSchema;
+    tabs?: boolean;
+    values: Translations<DeepPartial<Messages>>;
+    endpointUrl: string;
+    richTextEditorOptions?: RichTextEditorOptions;
+}
+export declare function MessagesForm({ locales, schema, tabs, values, endpointUrl, richTextEditorOptions, }: MessagesFormProps): React.ReactNode;
+export {};

package/dist/components/MessagesForm.js

@@ -0,0 +1,91 @@
+"use client";
+import { useStepNav as N, Button as R } from "@payloadcms/ui";
+import { isEqual as S } from "lodash-es";
+import { useEffect as M, useState as x } from "react";
+import { useForm as y } from "react-hook-form";
+import { toast as f } from "sonner";
+import { MessagesFormProvider as T } from "@/context/messages-form";
+import { cn as d } from "@/utils/cn";
+import { MessageField as j } from "./layout/MessageField.js";
+import { MessagesTabs as F } from "./layout/MessagesTabs.js";
+import { MessagesTree as p } from "./layout/MessagesTree.js";
+function J({
+  locales: g,
+  schema: a,
+  tabs: r = !1,
+  values: c,
+  endpointUrl: h,
+  richTextEditorOptions: u
+}) {
+  const { setStepNav: n } = N();
+  M(() => {
+    n([{ label: "Intl Messages", url: "/intl" }]);
+  }, [n]);
+  const s = y({
+    defaultValues: c,
+    reValidateMode: "onChange"
+  }), [m, b] = x(Object.keys(a)[0]), E = async (e) => {
+    const t = f.loading("Saving..."), v = Object.entries(e).reduce((o, [i, l]) => S(l, c[i]) ? o : {
+      ...o,
+      [i]: l
+    }, {});
+    await fetch(h, {
+      method: "PUT",
+      body: JSON.stringify(v)
+    }), s.reset(e), f.success("Saved", { id: t });
+  };
+  return /* @__PURE__ */ React.createElement(
+    T,
+    {
+      form: s,
+      locales: g,
+      richTextEditorOptions: u
+    },
+    /* @__PURE__ */ React.createElement(
+      "form",
+      {
+        className: "flex h-[calc(100vh-var(--app-header-height))] flex-col",
+        onSubmit: s.handleSubmit(E)
+      },
+      /* @__PURE__ */ React.createElement("div", { className: "sticky top-0 z-10 bg-background" }, /* @__PURE__ */ React.createElement("header", { className: "mb-6 flex items-center justify-between gap-4" }, /* @__PURE__ */ React.createElement("h1", { className: "text-4xl" }, "Messages"), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React.createElement(
+        R,
+        {
+          className: "my-0",
+          type: "submit",
+          disabled: !s.formState.isDirty
+        },
+        "Save"
+      ))), r && /* @__PURE__ */ React.createElement(
+        F,
+        {
+          schema: a,
+          activeTab: m,
+          setActiveTab: b
+        }
+      )),
+      /* @__PURE__ */ React.createElement("div", { id: "messages-form-content", className: "overflow-y-auto pt-8 pb-16" }, !r && /* @__PURE__ */ React.createElement(p, { path: "", schema: a, nestingLevel: 0 }), r && Object.entries(a).map(([e, t]) => typeof t == "string" ? /* @__PURE__ */ React.createElement(
+        j,
+        {
+          schema: t,
+          key: e,
+          className: d({ hidden: m !== e }),
+          messageKey: e,
+          path: e
+        }
+      ) : /* @__PURE__ */ React.createElement(
+        p,
+        {
+          className: d({ hidden: m !== e }),
+          key: e,
+          path: e,
+          schema: t,
+          nestingLevel: 0
+        }
+      )))
+    )
+  );
+}
+export {
+  J as MessagesForm
+};
+//# sourceMappingURL=MessagesForm.js.map

package/dist/components/MessagesForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessagesForm.js","sources":["../../src/components/MessagesForm.tsx"],"sourcesContent":["\"use client\";\n\nimport type { FormValues } from \"@/context/messages-form\";\nimport type {\n  DeepPartial,\n  Locales,\n  Messages,\n  MessagesSchema,\n  RichTextEditorOptions,\n  Translations,\n} from \"@/types\";\nimport { Button, useStepNav } from \"@payloadcms/ui\";\nimport { isEqual } from \"lodash-es\";\nimport { useEffect, useState } from \"react\";\nimport { useForm } from \"react-hook-form\";\nimport { toast } from \"sonner\";\n\nimport { MessagesFormProvider } from \"@/context/messages-form\";\nimport { cn } from \"@/utils/cn\";\n\nimport { MessageField } from \"./layout/MessageField\";\nimport { MessagesTabs } from \"./layout/MessagesTabs\";\nimport { MessagesTree } from \"./layout/MessagesTree\";\n\ninterface MessagesFormProps {\n  locales: Locales;\n  schema: MessagesSchema;\n  tabs?: boolean;\n  values: Translations<DeepPartial<Messages>>;\n  endpointUrl: string;\n  richTextEditorOptions?: RichTextEditorOptions;\n}\n\nexport function MessagesForm({\n  locales,\n  schema,\n  tabs = false,\n  values,\n  endpointUrl,\n  richTextEditorOptions,\n}: MessagesFormProps): React.ReactNode {\n  const { setStepNav } = useStepNav();\n  useEffect(() => {\n    setStepNav([{ label: \"Intl Messages\", url: \"/intl\" }]);\n  }, [setStepNav]);\n\n  const form = useForm<FormValues>({\n    defaultValues: values,\n    reValidateMode: \"onChange\",\n  });\n  const [activeTab, setActiveTab] = useState(Object.keys(schema)[0]);\n\n  const handleSubmit = async (currentValues: FormValues) => {\n    const toastId = toast.loading(\"Saving...\");\n    const changes = Object.entries(currentValues).reduce<\n      Translations<Messages>\n    >((acc, [locale, value]) => {\n      const hasChanged = !isEqual(value, values[locale]);\n      if (!hasChanged) {\n        return acc;\n      }\n      return {\n        ...acc,\n        [locale]: value,\n      };\n    }, {});\n\n    await fetch(endpointUrl, {\n      method: \"PUT\",\n      body: JSON.stringify(changes),\n    });\n\n    form.reset(currentValues);\n    toast.success(\"Saved\", { id: toastId });\n  };\n\n  return (\n    <MessagesFormProvider\n      form={form}\n      locales={locales}\n      richTextEditorOptions={richTextEditorOptions}\n    >\n      <form\n        className=\"flex h-[calc(100vh-var(--app-header-height))] flex-col\"\n        onSubmit={form.handleSubmit(handleSubmit)}\n      >\n        <div className=\"sticky top-0 z-10 bg-background\">\n          <header className=\"mb-6 flex items-center justify-between gap-4\">\n            <h1 className=\"text-4xl\">Messages</h1>\n            <div className=\"flex items-center gap-2\">\n              <Button\n                className=\"my-0\"\n                type=\"submit\"\n                disabled={!form.formState.isDirty}\n              >\n                Save\n              </Button>\n            </div>\n          </header>\n          {tabs && (\n            <MessagesTabs\n              schema={schema}\n              activeTab={activeTab}\n              setActiveTab={setActiveTab}\n            />\n          )}\n        </div>\n\n        <div id=\"messages-form-content\" className=\"overflow-y-auto pt-8 pb-16\">\n          {!tabs && <MessagesTree path=\"\" schema={schema} nestingLevel={0} />}\n          {tabs &&\n            Object.entries(schema).map(([key, value]) => {\n              if (typeof value === \"string\") {\n                return (\n                  <MessageField\n                    schema={value}\n                    key={key}\n                    className={cn({ hidden: activeTab !== key })}\n                    messageKey={key}\n                    path={key}\n                  />\n                );\n              }\n              return (\n                <MessagesTree\n                  className={cn({ hidden: activeTab !== key })}\n                  key={key}\n                  path={key}\n                  schema={value}\n                  nestingLevel={0}\n                />\n              );\n            })}\n        </div>\n      </form>\n    </MessagesFormProvider>\n  );\n}\n"],"names":["MessagesForm","locales","schema","tabs","values","endpointUrl","richTextEditorOptions","setStepNav","useStepNav","useEffect","form","useForm","activeTab","setActiveTab","useState","handleSubmit","currentValues","toastId","toast","changes","acc","locale","value","isEqual","MessagesFormProvider","Button","MessagesTabs","MessagesTree","key","MessageField","cn"],"mappings":";;;;;;;;;;;AAiCO,SAASA,EAAa;AAAA,EAC3B,SAAAC;AAAA,EACA,QAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,uBAAAC;AACF,GAAuC;AACrC,QAAM,EAAE,YAAAC,EAAA,IAAeC,EAAA;AACvB,EAAAC,EAAU,MAAM;AACd,IAAAF,EAAW,CAAC,EAAE,OAAO,iBAAiB,KAAK,QAAA,CAAS,CAAC;AAAA,EACvD,GAAG,CAACA,CAAU,CAAC;AAEf,QAAMG,IAAOC,EAAoB;AAAA,IAC/B,eAAeP;AAAA,IACf,gBAAgB;AAAA,EAAA,CACjB,GACK,CAACQ,GAAWC,CAAY,IAAIC,EAAS,OAAO,KAAKZ,CAAM,EAAE,CAAC,CAAC,GAE3Da,IAAe,OAAOC,MAA8B;AACxD,UAAMC,IAAUC,EAAM,QAAQ,WAAW,GACnCC,IAAU,OAAO,QAAQH,CAAa,EAAE,OAE5C,CAACI,GAAK,CAACC,GAAQC,CAAK,MACAC,EAAQD,GAAOlB,EAAOiB,CAAM,CAAC,IAExCD,IAEF;AAAA,MACL,GAAGA;AAAA,MACH,CAACC,CAAM,GAAGC;AAAA,IAAA,GAEX,CAAA,CAAE;AAEL,UAAM,MAAMjB,GAAa;AAAA,MACvB,QAAQ;AAAA,MACR,MAAM,KAAK,UAAUc,CAAO;AAAA,IAAA,CAC7B,GAEDT,EAAK,MAAMM,CAAa,GACxBE,EAAM,QAAQ,SAAS,EAAE,IAAID,GAAS;AAAA,EACxC;AAEA,SACE,sBAAA;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,MAAAd;AAAA,MACA,SAAAT;AAAA,MACA,uBAAAK;AAAA,IAAA;AAAA,IAEA,sBAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,UAAUI,EAAK,aAAaK,CAAY;AAAA,MAAA;AAAA,0CAEvC,OAAA,EAAI,WAAU,kCAAA,GACb,sBAAA,cAAC,YAAO,WAAU,+CAAA,GAChB,sBAAA,cAAC,MAAA,EAAG,WAAU,WAAA,GAAW,UAAQ,GACjC,sBAAA,cAAC,OAAA,EAAI,WAAU,0BAAA,GACb,sBAAA;AAAA,QAACU;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,MAAK;AAAA,UACL,UAAU,CAACf,EAAK,UAAU;AAAA,QAAA;AAAA,QAC3B;AAAA,MAAA,CAGH,CACF,GACCP,KACC,sBAAA;AAAA,QAACuB;AAAA,QAAA;AAAA,UACC,QAAAxB;AAAA,UACA,WAAAU;AAAA,UACA,cAAAC;AAAA,QAAA;AAAA,MAAA,CAGN;AAAA,MAEA,sBAAA,cAAC,OAAA,EAAI,IAAG,yBAAwB,WAAU,6BAAA,GACvC,CAACV,KAAQ,sBAAA,cAACwB,GAAA,EAAa,MAAK,IAAG,QAAAzB,GAAgB,cAAc,EAAA,CAAG,GAChEC,KACC,OAAO,QAAQD,CAAM,EAAE,IAAI,CAAC,CAAC0B,GAAKN,CAAK,MACjC,OAAOA,KAAU,WAEjB,sBAAA;AAAA,QAACO;AAAA,QAAA;AAAA,UACC,QAAQP;AAAA,UACR,KAAAM;AAAA,UACA,WAAWE,EAAG,EAAE,QAAQlB,MAAcgB,GAAK;AAAA,UAC3C,YAAYA;AAAA,UACZ,MAAMA;AAAA,QAAA;AAAA,MAAA,IAKV,sBAAA;AAAA,QAACD;AAAA,QAAA;AAAA,UACC,WAAWG,EAAG,EAAE,QAAQlB,MAAcgB,GAAK;AAAA,UAC3C,KAAAA;AAAA,UACA,MAAMA;AAAA,UACN,QAAQN;AAAA,UACR,cAAc;AAAA,QAAA;AAAA,MAAA,CAGnB,CACL;AAAA,IAAA;AAAA,EACF;AAGN;"}

package/dist/components/actions/JsonImport.d.ts

@@ -0,0 +1 @@
+export declare function JsonImport(): import("react").JSX.Element;

package/dist/components/actions/Move.d.ts

@@ -0,0 +1,3 @@
+export interface MoveProps {
+}
+export declare function Move({}: MoveProps): import("react").JSX.Element;

package/dist/components/inputs/InputWrapper.d.ts

@@ -0,0 +1,7 @@
+import { FieldError } from 'react-hook-form';
+export interface InputWrapperProps {
+    label: string;
+    error: FieldError | undefined;
+    className?: string;
+}
+export declare function InputWrapper({ label, error, className, children, }: React.PropsWithChildren<InputWrapperProps>): import("react").JSX.Element;

package/dist/components/inputs/InputWrapper.js

@@ -0,0 +1,23 @@
+import { FieldLabel as l } from "@payloadcms/ui";
+import { cn as t } from "@/utils/cn";
+function o({
+  label: a,
+  error: e,
+  className: r,
+  children: c
+}) {
+  return /* @__PURE__ */ React.createElement("div", { className: t("flex flex-col gap-1", r) }, /* @__PURE__ */ React.createElement(
+    "fieldset",
+    {
+      className: t("mx-0 rounded-md focus-within:border-elevation-400", {
+        "border-error bg-error": e
+      })
+    },
+    /* @__PURE__ */ React.createElement("legend", { className: "-ml-2 px-1.5 text-base" }, /* @__PURE__ */ React.createElement(l, { label: a })),
+    c
+  ), /* @__PURE__ */ React.createElement("p", { className: "text-base text-error" }, e?.message));
+}
+export {
+  o as InputWrapper
+};
+//# sourceMappingURL=InputWrapper.js.map

package/dist/components/inputs/InputWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputWrapper.js","sources":["../../../src/components/inputs/InputWrapper.tsx"],"sourcesContent":["import type { FieldError } from \"react-hook-form\";\nimport { FieldLabel } from \"@payloadcms/ui\";\n\nimport { cn } from \"@/utils/cn\";\n\nexport interface InputWrapperProps {\n  label: string;\n  error: FieldError | undefined;\n  className?: string;\n}\n\nexport function InputWrapper({\n  label,\n  error,\n  className,\n  children,\n}: React.PropsWithChildren<InputWrapperProps>) {\n  return (\n    <div className={cn(\"flex flex-col gap-1\", className)}>\n      <fieldset\n        className={cn(\"mx-0 rounded-md focus-within:border-elevation-400\", {\n          \"border-error bg-error\": error,\n        })}\n      >\n        <legend className=\"-ml-2 px-1.5 text-base\">\n          <FieldLabel label={label} />\n        </legend>\n        {children}\n      </fieldset>\n      <p className=\"text-base text-error\">{error?.message}</p>\n    </div>\n  );\n}\n"],"names":["InputWrapper","label","error","className","children","cn","FieldLabel"],"mappings":";;AAWO,SAASA,EAAa;AAAA,EAC3B,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AACF,GAA+C;AAC7C,6CACG,OAAA,EAAI,WAAWC,EAAG,uBAAuBF,CAAS,KACjD,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWE,EAAG,qDAAqD;AAAA,QACjE,yBAAyBH;AAAA,MAAA,CAC1B;AAAA,IAAA;AAAA,wCAEA,UAAA,EAAO,WAAU,4BAChB,sBAAA,cAACI,GAAA,EAAW,OAAAL,GAAc,CAC5B;AAAA,IACCG;AAAA,EAAA,GAEH,sBAAA,cAAC,KAAA,EAAE,WAAU,uBAAA,GAAwBF,GAAO,OAAQ,CACtD;AAEJ;"}

package/dist/components/inputs/MessageInput.d.ts

@@ -0,0 +1,10 @@
+import { TemplateVariable } from '../../types.ts';
+import { InputWrapperProps } from './InputWrapper';
+export interface MessageInputProps extends InputWrapperProps {
+    value: string;
+    lang: string;
+    variables: TemplateVariable[];
+    onChange: (value: string) => void;
+    onBlur: () => void;
+}
+export declare function MessageInput({ label, value, lang, error, variables, onChange, onBlur, className, }: MessageInputProps): import("react").JSX.Element;

package/dist/components/inputs/MessageInput.js

@@ -0,0 +1,52 @@
+import { useEditor as m, EditorContent as c } from "@tiptap/react";
+import d from "@tiptap/starter-kit";
+import { parseIcuToProseMirrorJSON as p } from "@/utils/icu-tranform";
+import { InputWrapper as u } from "./InputWrapper.js";
+import { VariableMention as b } from "./variables/extension.js";
+function h({
+  label: e,
+  value: t,
+  lang: r,
+  error: o,
+  variables: a,
+  onChange: i,
+  onBlur: l,
+  className: s
+}) {
+  const n = m({
+    immediatelyRender: !1,
+    content: p(t),
+    extensions: [
+      d.configure({
+        blockquote: !1,
+        bulletList: !1,
+        codeBlock: !1,
+        heading: !1,
+        horizontalRule: !1,
+        listItem: !1,
+        orderedList: !1,
+        bold: !1,
+        italic: !1,
+        link: !1,
+        underline: !1,
+        strike: !1,
+        code: !1
+      }),
+      b(a)
+    ],
+    onUpdate: ({ editor: f }) => i(f.getText())
+  });
+  return /* @__PURE__ */ React.createElement(u, { label: e, error: o, className: s }, /* @__PURE__ */ React.createElement(
+    c,
+    {
+      className: "tiptap-editor min-h-8",
+      editor: n,
+      lang: r,
+      onBlur: l
+    }
+  ));
+}
+export {
+  h as MessageInput
+};
+//# sourceMappingURL=MessageInput.js.map

package/dist/components/inputs/MessageInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageInput.js","sources":["../../../src/components/inputs/MessageInput.tsx"],"sourcesContent":["import type { TemplateVariable } from \"@/types\";\nimport { EditorContent, useEditor } from \"@tiptap/react\";\nimport StarterKit from \"@tiptap/starter-kit\";\n\nimport { parseIcuToProseMirrorJSON } from \"@/utils/icu-tranform\";\n\nimport type { InputWrapperProps } from \"./InputWrapper\";\nimport { InputWrapper } from \"./InputWrapper\";\nimport { VariableMention } from \"./variables/extension\";\n\nexport interface MessageInputProps extends InputWrapperProps {\n  value: string;\n  lang: string;\n  variables: TemplateVariable[];\n  onChange: (value: string) => void;\n  onBlur: () => void;\n}\n\n// TODO add variable editor (style, options, etc)\n// TODO add tooltip to show all variables\n\nexport function MessageInput({\n  label,\n  value,\n  lang,\n  error,\n  variables,\n  onChange,\n  onBlur,\n  className,\n}: MessageInputProps) {\n  const editor = useEditor({\n    immediatelyRender: false,\n    content: parseIcuToProseMirrorJSON(value),\n    extensions: [\n      StarterKit.configure({\n        blockquote: false,\n        bulletList: false,\n        codeBlock: false,\n        heading: false,\n        horizontalRule: false,\n        listItem: false,\n        orderedList: false,\n        bold: false,\n        italic: false,\n        link: false,\n        underline: false,\n        strike: false,\n        code: false,\n      }),\n      VariableMention(variables),\n    ],\n    onUpdate: ({ editor }) => onChange(editor.getText()),\n  });\n\n  return (\n    <InputWrapper label={label} error={error} className={className}>\n      <EditorContent\n        className=\"tiptap-editor min-h-8\"\n        editor={editor}\n        lang={lang}\n        onBlur={onBlur}\n      />\n    </InputWrapper>\n  );\n}\n"],"names":["MessageInput","label","value","lang","error","variables","onChange","onBlur","className","editor","useEditor","parseIcuToProseMirrorJSON","StarterKit","VariableMention","InputWrapper","EditorContent"],"mappings":";;;;;AAqBO,SAASA,EAAa;AAAA,EAC3B,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AACF,GAAsB;AACpB,QAAMC,IAASC,EAAU;AAAA,IACvB,mBAAmB;AAAA,IACnB,SAASC,EAA0BT,CAAK;AAAA,IACxC,YAAY;AAAA,MACVU,EAAW,UAAU;AAAA,QACnB,YAAY;AAAA,QACZ,YAAY;AAAA,QACZ,WAAW;AAAA,QACX,SAAS;AAAA,QACT,gBAAgB;AAAA,QAChB,UAAU;AAAA,QACV,aAAa;AAAA,QACb,MAAM;AAAA,QACN,QAAQ;AAAA,QACR,MAAM;AAAA,QACN,WAAW;AAAA,QACX,QAAQ;AAAA,QACR,MAAM;AAAA,MAAA,CACP;AAAA,MACDC,EAAgBR,CAAS;AAAA,IAAA;AAAA,IAE3B,UAAU,CAAC,EAAE,QAAAI,QAAaH,EAASG,EAAO,QAAA,CAAS;AAAA,EAAA,CACpD;AAED,SACE,sBAAA,cAACK,GAAA,EAAa,OAAAb,GAAc,OAAAG,GAAc,WAAAI,KACxC,sBAAA;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,QAAAN;AAAA,MACA,MAAAN;AAAA,MACA,QAAAI;AAAA,IAAA;AAAA,EAAA,CAEJ;AAEJ;"}

package/dist/components/inputs/RichTextInput.d.ts

@@ -0,0 +1,8 @@
+import { InputWrapperProps } from './InputWrapper';
+export interface RichTextInputProps extends InputWrapperProps {
+    value: string;
+    lang: string;
+    onChange: (value: string) => void;
+    onBlur: () => void;
+}
+export declare function RichTextInput({ error, label, lang, onBlur, onChange, value, className, }: RichTextInputProps): React.ReactNode;

package/dist/components/inputs/RichTextInput.js

@@ -0,0 +1,81 @@
+import f from "@tiptap/extension-blockquote";
+import c from "@tiptap/extension-bold";
+import s from "@tiptap/extension-code-block";
+import d from "@tiptap/extension-document";
+import g from "@tiptap/extension-hard-break";
+import u from "@tiptap/extension-heading";
+import h from "@tiptap/extension-highlight";
+import T from "@tiptap/extension-horizontal-rule";
+import k from "@tiptap/extension-italic";
+import x from "@tiptap/extension-link";
+import { BulletList as R, OrderedList as E, ListItem as L, ListKeymap as y } from "@tiptap/extension-list";
+import B from "@tiptap/extension-paragraph";
+import H from "@tiptap/extension-strike";
+import b from "@tiptap/extension-text";
+import C from "@tiptap/extension-text-align";
+import I from "@tiptap/extension-typography";
+import N from "@tiptap/extension-underline";
+import { UndoRedo as O, TrailingNode as U } from "@tiptap/extensions";
+import { useEditor as q, EditorContent as w } from "@tiptap/react";
+import { useMessagesForm as M } from "@/context/messages-form";
+import { InputWrapper as S } from "./InputWrapper.js";
+import { RichTextToolbar as z } from "./toolbar/RichTextToolbar.js";
+function mo({
+  error: e,
+  label: t,
+  lang: i,
+  onBlur: m,
+  onChange: n,
+  value: p,
+  className: a
+}) {
+  const { richTextEditorOptions: o } = M();
+  console.log(o);
+  const r = q({
+    content: p,
+    extensions: [
+      d,
+      ...o?.heading !== !1 ? [u.configure(o?.heading)] : [],
+      B,
+      b,
+      g,
+      T,
+      f,
+      s,
+      R,
+      E,
+      L,
+      x.configure({
+        openOnClick: !1,
+        enableClickSelection: !0
+      }),
+      c,
+      k,
+      H,
+      N,
+      I,
+      h,
+      C.configure({
+        types: ["heading", "paragraph", "blockquote"]
+      }),
+      O,
+      U,
+      y
+    ],
+    immediatelyRender: !1,
+    onUpdate: ({ editor: l }) => n?.(l.getHTML())
+  });
+  return /* @__PURE__ */ React.createElement(S, { label: t, error: e, className: a }, /* @__PURE__ */ React.createElement(z, { className: "mb-3 w-full min-w-max", editor: r }), /* @__PURE__ */ React.createElement(
+    w,
+    {
+      className: "tiptap-editor min-h-8",
+      editor: r,
+      lang: i,
+      onBlur: m
+    }
+  ));
+}
+export {
+  mo as RichTextInput
+};
+//# sourceMappingURL=RichTextInput.js.map

package/dist/components/inputs/RichTextInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RichTextInput.js","sources":["../../../src/components/inputs/RichTextInput.tsx"],"sourcesContent":["import Blockquote from \"@tiptap/extension-blockquote\";\nimport Bold from \"@tiptap/extension-bold\";\nimport CodeBlock from \"@tiptap/extension-code-block\";\nimport Document from \"@tiptap/extension-document\";\nimport HardBreak from \"@tiptap/extension-hard-break\";\nimport Heading from \"@tiptap/extension-heading\";\nimport Highlight from \"@tiptap/extension-highlight\";\nimport HorizontalRule from \"@tiptap/extension-horizontal-rule\";\nimport Italic from \"@tiptap/extension-italic\";\nimport Link from \"@tiptap/extension-link\";\nimport {\n  BulletList,\n  ListItem,\n  ListKeymap,\n  OrderedList,\n} from \"@tiptap/extension-list\";\nimport Paragraph from \"@tiptap/extension-paragraph\";\nimport Strike from \"@tiptap/extension-strike\";\nimport Text from \"@tiptap/extension-text\";\nimport TextAlign from \"@tiptap/extension-text-align\";\nimport Typography from \"@tiptap/extension-typography\";\nimport Underline from \"@tiptap/extension-underline\";\nimport { TrailingNode, UndoRedo } from \"@tiptap/extensions\";\nimport { EditorContent, useEditor } from \"@tiptap/react\";\n\nimport { useMessagesForm } from \"@/context/messages-form\";\n\nimport type { InputWrapperProps } from \"./InputWrapper\";\nimport { InputWrapper } from \"./InputWrapper\";\nimport { RichTextToolbar } from \"./toolbar/RichTextToolbar\";\n\nexport interface RichTextInputProps extends InputWrapperProps {\n  value: string;\n  lang: string;\n  onChange: (value: string) => void;\n  onBlur: () => void;\n}\n\nexport function RichTextInput({\n  error,\n  label,\n  lang,\n  onBlur,\n  onChange,\n  value,\n  className,\n}: RichTextInputProps): React.ReactNode {\n  const { richTextEditorOptions } = useMessagesForm();\n  console.log(richTextEditorOptions);\n  const editor = useEditor({\n    content: value,\n    extensions: [\n      Document,\n      ...(richTextEditorOptions?.heading !== false\n        ? [Heading.configure(richTextEditorOptions?.heading)]\n        : []),\n      Paragraph,\n      Text,\n      HardBreak,\n      HorizontalRule,\n      Blockquote,\n      CodeBlock,\n      BulletList,\n      OrderedList,\n      ListItem,\n      Link.configure({\n        openOnClick: false,\n        enableClickSelection: true,\n      }),\n      Bold,\n      Italic,\n      Strike,\n      Underline,\n      Typography,\n      Highlight,\n      TextAlign.configure({\n        types: [\"heading\", \"paragraph\", \"blockquote\"],\n      }),\n      UndoRedo,\n      TrailingNode,\n      ListKeymap,\n    ],\n    immediatelyRender: false,\n    onUpdate: ({ editor }) => onChange?.(editor.getHTML()),\n  });\n\n  return (\n    <InputWrapper label={label} error={error} className={className}>\n      <RichTextToolbar className=\"mb-3 w-full min-w-max\" editor={editor} />\n      <EditorContent\n        className=\"tiptap-editor min-h-8\"\n        editor={editor}\n        lang={lang}\n        onBlur={onBlur}\n      />\n    </InputWrapper>\n  );\n}\n"],"names":["RichTextInput","error","label","lang","onBlur","onChange","value","className","richTextEditorOptions","useMessagesForm","editor","useEditor","Document","Heading","Paragraph","Text","HardBreak","HorizontalRule","Blockquote","CodeBlock","BulletList","OrderedList","ListItem","Link","Bold","Italic","Strike","Underline","Typography","Highlight","TextAlign","UndoRedo","TrailingNode","ListKeymap","InputWrapper","RichTextToolbar","EditorContent"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsCO,SAASA,GAAc;AAAA,EAC5B,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AACF,GAAwC;AACtC,QAAM,EAAE,uBAAAC,EAAA,IAA0BC,EAAA;AAClC,UAAQ,IAAID,CAAqB;AACjC,QAAME,IAASC,EAAU;AAAA,IACvB,SAASL;AAAA,IACT,YAAY;AAAA,MACVM;AAAA,MACA,GAAIJ,GAAuB,YAAY,KACnC,CAACK,EAAQ,UAAUL,GAAuB,OAAO,CAAC,IAClD,CAAA;AAAA,MACJM;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC,EAAK,UAAU;AAAA,QACb,aAAa;AAAA,QACb,sBAAsB;AAAA,MAAA,CACvB;AAAA,MACDC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC,EAAU,UAAU;AAAA,QAClB,OAAO,CAAC,WAAW,aAAa,YAAY;AAAA,MAAA,CAC7C;AAAA,MACDC;AAAA,MACAC;AAAA,MACAC;AAAA,IAAA;AAAA,IAEF,mBAAmB;AAAA,IACnB,UAAU,CAAC,EAAE,QAAAvB,QAAaL,IAAWK,EAAO,QAAA,CAAS;AAAA,EAAA,CACtD;AAED,SACE,sBAAA,cAACwB,GAAA,EAAa,OAAAhC,GAAc,OAAAD,GAAc,WAAAM,yCACvC4B,GAAA,EAAgB,WAAU,yBAAwB,QAAAzB,EAAA,CAAgB,GACnE,sBAAA;AAAA,IAAC0B;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,QAAA1B;AAAA,MACA,MAAAP;AAAA,MACA,QAAAC;AAAA,IAAA;AAAA,EAAA,CAEJ;AAEJ;"}

package/dist/components/inputs/toolbar/AlignmentControls.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/react';
+export interface AlignmentControlsProps {
+    editor: Editor | null;
+}
+export declare function AlignmentControls({ editor }: AlignmentControlsProps): import("react").JSX.Element;

package/dist/components/inputs/toolbar/AlignmentControls.js

@@ -0,0 +1,59 @@
+import { IconAlignLeft as c, IconAlignCenter as g, IconAlignRight as u } from "@tabler/icons-react";
+import { useEditorState as d } from "@tiptap/react";
+import { Toolbar as t } from "radix-ui";
+function v({ editor: n }) {
+  const { value: a, disabled: r } = d({
+    editor: n,
+    selector: (e) => {
+      const i = e.editor?.getAttributes("paragraph"), l = e.editor?.getAttributes("heading"), s = e.editor?.getAttributes("blockquote");
+      return {
+        disabled: e.editor?.isActive("bulletList") || e.editor?.isActive("orderedList"),
+        value: i?.textAlign || l?.textAlign || s?.textAlign
+      };
+    }
+  }) ?? { value: "left" }, o = (e) => {
+    n && n.chain().focus().setTextAlign(e).run();
+  };
+  return /* @__PURE__ */ React.createElement(
+    t.ToggleGroup,
+    {
+      type: "single",
+      className: "flex items-center",
+      "aria-label": "Text alignment",
+      value: a,
+      onValueChange: o,
+      disabled: r
+    },
+    /* @__PURE__ */ React.createElement(
+      t.ToggleItem,
+      {
+        className: "inline-flex h-7 flex-shrink-0 flex-grow-0 basis-auto cursor-pointer items-center justify-center rounded border-none bg-transparent px-2 leading-none hover:bg-elevation-250 focus:relative focus:outline data-[state=on]:bg-elevation-600 data-[state=on]:text-elevation-0",
+        value: "left",
+        "aria-label": "Left aligned"
+      },
+      /* @__PURE__ */ React.createElement(c, { size: 16 })
+    ),
+    /* @__PURE__ */ React.createElement(
+      t.ToggleItem,
+      {
+        className: "inline-flex h-7 flex-shrink-0 flex-grow-0 basis-auto cursor-pointer items-center justify-center rounded border-none bg-transparent px-2 leading-none hover:bg-elevation-250 focus:relative focus:outline data-[state=on]:bg-elevation-600 data-[state=on]:text-elevation-0",
+        value: "center",
+        "aria-label": "Center aligned"
+      },
+      /* @__PURE__ */ React.createElement(g, { size: 16 })
+    ),
+    /* @__PURE__ */ React.createElement(
+      t.ToggleItem,
+      {
+        className: "inline-flex h-7 flex-shrink-0 flex-grow-0 basis-auto cursor-pointer items-center justify-center rounded border-none bg-transparent px-2 leading-none hover:bg-elevation-250 focus:relative focus:outline data-[state=on]:bg-elevation-600 data-[state=on]:text-elevation-0",
+        value: "right",
+        "aria-label": "Right aligned"
+      },
+      /* @__PURE__ */ React.createElement(u, { size: 16 })
+    )
+  );
+}
+export {
+  v as AlignmentControls
+};
+//# sourceMappingURL=AlignmentControls.js.map

package/dist/components/inputs/toolbar/AlignmentControls.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlignmentControls.js","sources":["../../../../src/components/inputs/toolbar/AlignmentControls.tsx"],"sourcesContent":["import type { Editor } from \"@tiptap/react\";\nimport {\n  IconAlignCenter,\n  IconAlignLeft,\n  IconAlignRight,\n} from \"@tabler/icons-react\";\nimport { useEditorState } from \"@tiptap/react\";\nimport { Toolbar } from \"radix-ui\";\n\nexport interface AlignmentControlsProps {\n  editor: Editor | null;\n}\n\nexport function AlignmentControls({ editor }: AlignmentControlsProps) {\n  const { value, disabled } = useEditorState<{\n    value: string;\n    disabled?: boolean;\n  }>({\n    editor,\n    selector: (state) => {\n      const attrs = state.editor?.getAttributes(\"paragraph\");\n      const headingAttrs = state.editor?.getAttributes(\"heading\");\n      const blockquoteAttrs = state.editor?.getAttributes(\"blockquote\");\n\n      return {\n        disabled:\n          state.editor?.isActive(\"bulletList\") ||\n          state.editor?.isActive(\"orderedList\"),\n        value:\n          attrs?.textAlign ||\n          headingAttrs?.textAlign ||\n          blockquoteAttrs?.textAlign,\n      };\n    },\n  }) ?? { value: \"left\" };\n\n  const handleChange = (value: string) => {\n    if (!editor) return;\n    editor.chain().focus().setTextAlign(value).run();\n  };\n\n  return (\n    <Toolbar.ToggleGroup\n      type=\"single\"\n      className=\"flex items-center\"\n      aria-label=\"Text alignment\"\n      value={value}\n      onValueChange={handleChange}\n      disabled={disabled}\n    >\n      <Toolbar.ToggleItem\n        className=\"inline-flex h-7 flex-shrink-0 flex-grow-0 basis-auto cursor-pointer items-center justify-center rounded border-none bg-transparent px-2 leading-none hover:bg-elevation-250 focus:relative focus:outline data-[state=on]:bg-elevation-600 data-[state=on]:text-elevation-0\"\n        value=\"left\"\n        aria-label=\"Left aligned\"\n      >\n        <IconAlignLeft size={16} />\n      </Toolbar.ToggleItem>\n      <Toolbar.ToggleItem\n        className=\"inline-flex h-7 flex-shrink-0 flex-grow-0 basis-auto cursor-pointer items-center justify-center rounded border-none bg-transparent px-2 leading-none hover:bg-elevation-250 focus:relative focus:outline data-[state=on]:bg-elevation-600 data-[state=on]:text-elevation-0\"\n        value=\"center\"\n        aria-label=\"Center aligned\"\n      >\n        <IconAlignCenter size={16} />\n      </Toolbar.ToggleItem>\n      <Toolbar.ToggleItem\n        className=\"inline-flex h-7 flex-shrink-0 flex-grow-0 basis-auto cursor-pointer items-center justify-center rounded border-none bg-transparent px-2 leading-none hover:bg-elevation-250 focus:relative focus:outline data-[state=on]:bg-elevation-600 data-[state=on]:text-elevation-0\"\n        value=\"right\"\n        aria-label=\"Right aligned\"\n      >\n        <IconAlignRight size={16} />\n      </Toolbar.ToggleItem>\n    </Toolbar.ToggleGroup>\n  );\n}\n"],"names":["AlignmentControls","editor","value","disabled","useEditorState","state","attrs","headingAttrs","blockquoteAttrs","handleChange","Toolbar","IconAlignLeft","IconAlignCenter","IconAlignRight"],"mappings":";;;AAaO,SAASA,EAAkB,EAAE,QAAAC,KAAkC;AACpE,QAAM,EAAE,OAAAC,GAAO,UAAAC,EAAA,IAAaC,EAGzB;AAAA,IACD,QAAAH;AAAA,IACA,UAAU,CAACI,MAAU;AACnB,YAAMC,IAAQD,EAAM,QAAQ,cAAc,WAAW,GAC/CE,IAAeF,EAAM,QAAQ,cAAc,SAAS,GACpDG,IAAkBH,EAAM,QAAQ,cAAc,YAAY;AAEhE,aAAO;AAAA,QACL,UACEA,EAAM,QAAQ,SAAS,YAAY,KACnCA,EAAM,QAAQ,SAAS,aAAa;AAAA,QACtC,OACEC,GAAO,aACPC,GAAc,aACdC,GAAiB;AAAA,MAAA;AAAA,IAEvB;AAAA,EAAA,CACD,KAAK,EAAE,OAAO,OAAA,GAETC,IAAe,CAACP,MAAkB;AACtC,IAAKD,KACLA,EAAO,QAAQ,MAAA,EAAQ,aAAaC,CAAK,EAAE,IAAA;AAAA,EAC7C;AAEA,SACE,sBAAA;AAAA,IAACQ,EAAQ;AAAA,IAAR;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MACV,cAAW;AAAA,MACX,OAAAR;AAAA,MACA,eAAeO;AAAA,MACf,UAAAN;AAAA,IAAA;AAAA,IAEA,sBAAA;AAAA,MAACO,EAAQ;AAAA,MAAR;AAAA,QACC,WAAU;AAAA,QACV,OAAM;AAAA,QACN,cAAW;AAAA,MAAA;AAAA,MAEX,sBAAA,cAACC,GAAA,EAAc,MAAM,GAAA,CAAI;AAAA,IAAA;AAAA,IAE3B,sBAAA;AAAA,MAACD,EAAQ;AAAA,MAAR;AAAA,QACC,WAAU;AAAA,QACV,OAAM;AAAA,QACN,cAAW;AAAA,MAAA;AAAA,MAEX,sBAAA,cAACE,GAAA,EAAgB,MAAM,GAAA,CAAI;AAAA,IAAA;AAAA,IAE7B,sBAAA;AAAA,MAACF,EAAQ;AAAA,MAAR;AAAA,QACC,WAAU;AAAA,QACV,OAAM;AAAA,QACN,cAAW;AAAA,MAAA;AAAA,MAEX,sBAAA,cAACG,GAAA,EAAe,MAAM,GAAA,CAAI;AAAA,IAAA;AAAA,EAC5B;AAGN;"}

package/dist/components/inputs/toolbar/BlockElementSelect.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/react';
+export interface BlockElementSelectProps {
+    editor: Editor | null;
+}
+export declare function BlockElementSelect({ editor }: BlockElementSelectProps): import("react").JSX.Element;