payload-intl 0.3.0 → 1.1.0

package/dist/components/inputs/variables/editors/PluralVariableEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"PluralVariableEditor.js","sources":["../../../../../src/components/inputs/variables/editors/PluralVariableEditor.tsx"],"sourcesContent":["import type { PluralElement } from \"@/types\";\nimport { TYPE } from \"@formatjs/icu-messageformat-parser\";\nimport { IconX } from \"@tabler/icons-react\";\nimport { Popover } from \"radix-ui\";\nimport { Fragment, useImperativeHandle, useMemo } from \"react\";\nimport { Controller, useFieldArray, useForm } from \"react-hook-form\";\n\nimport { cn } from \"@/utils/cn\";\nimport { parseICUMessage, serializeICUMessage } from \"@/utils/icu-tranform\";\n\nconst NAMED_PLURAL_OPTIONS = [\"zero\", \"one\", \"two\", \"few\", \"many\"] as const;\n\nexport interface PluralVariableEditorProps {\n  variableName: string;\n  element: PluralElement | undefined;\n  ref: React.Ref<{ getValue: () => string }>;\n}\n\n// TODO add support for selectordinal (\"pluralType\": \"ordinal\")\n\nexport function PluralVariableEditor({\n  variableName,\n  element,\n  ref,\n}: PluralVariableEditorProps) {\n  const config = useMemo<{\n    offset: number;\n    options: { name: string; content: string }[];\n    other: string;\n  }>(() => {\n    const { other, ...options } = element?.options ?? {};\n    return {\n      offset: element?.offset ?? 0,\n      options: Object.entries(options).map(([name, option]) => ({\n        name,\n        content: serializeICUMessage(option.value),\n      })),\n      other: serializeICUMessage(other ? other.value : []),\n    };\n  }, [element]);\n\n  const { control, register, getValues } = useForm<{\n    offset: number;\n    options: { name: string; content: string }[];\n    other: string;\n    customValue?: number;\n  }>({\n    defaultValues: config,\n  });\n\n  useImperativeHandle(ref, () => ({\n    getValue: () => {\n      const values = getValues();\n      const updatedElement: PluralElement = {\n        type: TYPE.plural,\n        value: variableName,\n        offset: values.offset,\n        pluralType: element?.pluralType ?? \"cardinal\",\n        options: Object.fromEntries(\n          values.options.map(({ name, content }) => [\n            name,\n            { value: parseICUMessage(content) },\n          ]),\n        ),\n      };\n      return serializeICUMessage([updatedElement]);\n    },\n  }));\n\n  const options = useFieldArray({\n    control,\n    name: \"options\",\n  });\n\n  return (\n    <div className=\"flex flex-col gap-3\">\n      <fieldset className=\"mx-0 grid grid-cols-[3rem_8rem_1.5rem] gap-y-2 rounded-md border border-border px-2 pr-0\">\n        <legend>Options</legend>\n        {options.fields.map((field, index) => (\n          <Fragment key={field.id}>\n            <label htmlFor={`options.${index}`}>{field.name}</label>\n            {/* // TODO add support for variable mentions */}\n            <input\n              className=\"focus:outline-none\"\n              type=\"text\"\n              {...register(`options.${index}.content`, { required: true })}\n            />\n            <button\n              className=\"ml-auto flex cursor-pointer items-center justify-center border-none bg-transparent p-0 hover:text-error\"\n              type=\"button\"\n              onClick={() => options.remove(index)}\n            >\n              <IconX size={16} />\n            </button>\n          </Fragment>\n        ))}\n\n        <>\n          <label htmlFor=\"other\">other</label>\n          {/* // TODO add support for variable mentions */}\n          <input\n            type=\"text\"\n            className=\"col-span-2 focus:outline-none\"\n            {...register(\"other\", { required: true })}\n          />\n        </>\n      </fieldset>\n      <div className=\"grid grid-cols-2 items-center gap-2\">\n        <label className=\"flex items-center gap-3 pl-2\">\n          offset\n          <input\n            className=\"w-8 text-center\"\n            type=\"numeric\"\n            placeholder=\"0\"\n            {...register(\"offset\")}\n          />\n        </label>\n        <Popover.Root>\n          <Popover.Trigger>Add Option</Popover.Trigger>\n          <Popover.Portal>\n            <Popover.Content\n              sideOffset={4}\n              className=\"z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border border-border bg-elevation-50 shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95\"\n            >\n              <div className=\"flex flex-col\">\n                {NAMED_PLURAL_OPTIONS.filter((option) =>\n                  options.fields.every((field) => field.name !== option),\n                ).map((option) => (\n                  <Popover.Close\n                    key={option}\n                    className={cn(\n                      \"cursor-pointer border-none bg-transparent px-1 hover:bg-elevation-250\",\n                    )}\n                    onClick={() => {\n                      // TODO ensure the fields are always in the same order as staticPluralOptions\n                      options.append(\n                        {\n                          name: option,\n                          content: \"\",\n                        },\n                        {\n                          shouldFocus: true,\n                        },\n                      );\n                    }}\n                  >\n                    {option}\n                  </Popover.Close>\n                ))}\n              </div>\n\n              <div className=\"flex items-center justify-between gap-2 border-t border-border p-2\">\n                <label htmlFor=\"customValue\">custom</label>\n                <Controller\n                  control={control}\n                  name=\"customValue\"\n                  render={({ field }) => (\n                    // eslint-disable-next-line jsx-a11y/control-has-associated-label\n                    <input\n                      type=\"numeric\"\n                      className=\"w-8 rounded-sm border-transparent text-center focus:border-border focus:outline-none\"\n                      placeholder=\"=0\"\n                      min={0}\n                      value={field.value ?? \"\"}\n                      onChange={({ currentTarget: { value } }) => {\n                        const number = Number(value);\n                        if (isNaN(number)) return;\n                        if (number < 0) return;\n                        field.onChange(number);\n                      }}\n                      onKeyDown={(e) => {\n                        if (e.key !== \"Enter\") return;\n                        if (field.value === undefined) return;\n                        const isUnique = !options.fields.some(\n                          (existingField) =>\n                            existingField.name === `=${field.value}`,\n                        );\n                        if (!isUnique) return; // TODO maybe show error?\n                        options.append(\n                          {\n                            name: `=${field.value}`,\n                            content: \"\",\n                          },\n                          {\n                            shouldFocus: true,\n                          },\n                        );\n                        field.onChange(undefined);\n                      }}\n                    />\n                  )}\n                />\n              </div>\n            </Popover.Content>\n          </Popover.Portal>\n        </Popover.Root>\n      </div>\n    </div>\n  );\n}\n"],"names":["NAMED_PLURAL_OPTIONS","PluralVariableEditor","variableName","element","ref","config","useMemo","other","options","name","option","serializeICUMessage","control","register","getValues","useForm","useImperativeHandle","values","updatedElement","TYPE","content","parseICUMessage","useFieldArray","jsxs","jsx","field","index","Fragment","IconX","Popover","cn","Controller","value","number","e","existingField"],"mappings":"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"}
+{"version":3,"file":"PluralVariableEditor.js","sources":["../../../../../src/components/inputs/variables/editors/PluralVariableEditor.tsx"],"sourcesContent":["import { TYPE } from '@formatjs/icu-messageformat-parser';\nimport { IconX } from '@tabler/icons-react';\nimport { Popover } from 'radix-ui';\nimport { Fragment, useImperativeHandle, useMemo } from 'react';\nimport { Controller, useFieldArray, useForm } from 'react-hook-form';\nimport type { PluralElement } from '@/types';\n\nimport { cn } from '@/utils/cn';\nimport { parseICUMessage, serializeICUMessage } from '@/utils/icu-tranform';\n\nconst NAMED_PLURAL_OPTIONS = ['zero', 'one', 'two', 'few', 'many'] as const;\n\nexport interface PluralVariableEditorProps {\n  variableName: string;\n  element: PluralElement | undefined;\n  ref: React.Ref<{ getValue: () => string }>;\n}\n\n// TODO add support for selectordinal (\"pluralType\": \"ordinal\")\n\nexport function PluralVariableEditor({\n  variableName,\n  element,\n  ref,\n}: PluralVariableEditorProps) {\n  const config = useMemo<{\n    offset: number;\n    options: { name: string; content: string }[];\n    other: string;\n  }>(() => {\n    const { other, ...options } = element?.options ?? {};\n    return {\n      offset: element?.offset ?? 0,\n      options: Object.entries(options).map(([name, option]) => ({\n        name,\n        content: serializeICUMessage(option.value),\n      })),\n      other: serializeICUMessage(other ? other.value : []),\n    };\n  }, [element]);\n\n  const { control, register, getValues } = useForm<{\n    offset: number;\n    options: { name: string; content: string }[];\n    other: string;\n    customValue?: number;\n  }>({\n    defaultValues: config,\n  });\n\n  useImperativeHandle(ref, () => ({\n    getValue: () => {\n      const values = getValues();\n      const updatedElement: PluralElement = {\n        type: TYPE.plural,\n        value: variableName,\n        offset: values.offset,\n        pluralType: element?.pluralType ?? 'cardinal',\n        options: Object.fromEntries(\n          values.options.map(({ name, content }) => [\n            name,\n            { value: parseICUMessage(content) },\n          ]),\n        ),\n      };\n      return serializeICUMessage([updatedElement]);\n    },\n  }));\n\n  const options = useFieldArray({\n    control,\n    name: 'options',\n  });\n\n  return (\n    <div className=\"flex flex-col gap-3\">\n      <fieldset className=\"mx-0 grid grid-cols-[3rem_8rem_1.5rem] gap-y-2 rounded-md border border-border px-2 pr-0\">\n        <legend>Options</legend>\n        {options.fields.map((field, index) => (\n          <Fragment key={field.id}>\n            <label htmlFor={`options.${index}`}>{field.name}</label>\n            {/* // TODO add support for variable mentions */}\n            <input\n              className=\"focus:outline-none\"\n              type=\"text\"\n              {...register(`options.${index}.content`, { required: true })}\n            />\n            <button\n              className=\"ml-auto flex cursor-pointer items-center justify-center border-none bg-transparent p-0 hover:text-error\"\n              onClick={() => options.remove(index)}\n              type=\"button\"\n            >\n              <IconX size={16} />\n            </button>\n          </Fragment>\n        ))}\n\n        <>\n          <label htmlFor=\"other\">other</label>\n          {/* // TODO add support for variable mentions */}\n          <input\n            className=\"col-span-2 focus:outline-none\"\n            type=\"text\"\n            {...register('other', { required: true })}\n          />\n        </>\n      </fieldset>\n      <div className=\"grid grid-cols-2 items-center gap-2\">\n        <label className=\"flex items-center gap-3 pl-2\">\n          offset\n          <input\n            className=\"w-8 text-center\"\n            placeholder=\"0\"\n            type=\"numeric\"\n            {...register('offset')}\n          />\n        </label>\n        <Popover.Root>\n          <Popover.Trigger>Add Option</Popover.Trigger>\n          <Popover.Portal>\n            <Popover.Content\n              className=\"data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-y-auto overflow-x-hidden rounded-md border border-border bg-elevation-50 shadow-md data-[state=closed]:animate-out data-[state=open]:animate-in\"\n              sideOffset={4}\n            >\n              <div className=\"flex flex-col\">\n                {NAMED_PLURAL_OPTIONS.filter((option) =>\n                  options.fields.every((field) => field.name !== option),\n                ).map((option) => (\n                  <Popover.Close\n                    className={cn(\n                      'cursor-pointer border-none bg-transparent px-1 hover:bg-elevation-250',\n                    )}\n                    key={option}\n                    onClick={() => {\n                      // TODO ensure the fields are always in the same order as staticPluralOptions\n                      options.append(\n                        {\n                          name: option,\n                          content: '',\n                        },\n                        {\n                          shouldFocus: true,\n                        },\n                      );\n                    }}\n                  >\n                    {option}\n                  </Popover.Close>\n                ))}\n              </div>\n\n              <div className=\"flex items-center justify-between gap-2 border-border border-t p-2\">\n                <label htmlFor=\"customValue\">custom</label>\n                <Controller\n                  control={control}\n                  name=\"customValue\"\n                  render={({ field }) => (\n                    <input\n                      className=\"w-8 rounded-sm border-transparent text-center focus:border-border focus:outline-none\"\n                      min={0}\n                      onChange={({ currentTarget: { value } }) => {\n                        const number = Number(value);\n                        if (isNaN(number)) return;\n                        if (number < 0) return;\n                        field.onChange(number);\n                      }}\n                      onKeyDown={(e) => {\n                        if (e.key !== 'Enter') return;\n                        if (field.value === undefined) return;\n                        const isUnique = !options.fields.some(\n                          (existingField) =>\n                            existingField.name === `=${field.value}`,\n                        );\n                        if (!isUnique) return; // TODO maybe show error?\n                        options.append(\n                          {\n                            name: `=${field.value}`,\n                            content: '',\n                          },\n                          {\n                            shouldFocus: true,\n                          },\n                        );\n                        field.onChange(undefined);\n                      }}\n                      placeholder=\"=0\"\n                      type=\"numeric\"\n                      value={field.value ?? ''}\n                    />\n                  )}\n                />\n              </div>\n            </Popover.Content>\n          </Popover.Portal>\n        </Popover.Root>\n      </div>\n    </div>\n  );\n}\n"],"names":["NAMED_PLURAL_OPTIONS","PluralVariableEditor","variableName","element","ref","config","useMemo","other","options","name","option","serializeICUMessage","control","register","getValues","useForm","useImperativeHandle","values","updatedElement","TYPE","content","parseICUMessage","useFieldArray","jsxs","jsx","field","index","Fragment","IconX","Popover","cn","Controller","value","number","e","existingField"],"mappings":";;;;;;;;AAUA,MAAMA,IAAuB,CAAC,QAAQ,OAAO,OAAO,OAAO,MAAM;AAU1D,SAASC,EAAqB;AAAA,EACnC,cAAAC;AAAA,EACA,SAAAC;AAAA,EACA,KAAAC;AACF,GAA8B;AAC5B,QAAMC,IAASC,EAIZ,MAAM;AACP,UAAM,EAAE,OAAAC,GAAO,GAAGC,MAAYL,GAAS,WAAW,CAAA;AAClD,WAAO;AAAA,MACL,QAAQA,GAAS,UAAU;AAAA,MAC3B,SAAS,OAAO,QAAQK,CAAO,EAAE,IAAI,CAAC,CAACC,GAAMC,CAAM,OAAO;AAAA,QACxD,MAAAD;AAAA,QACA,SAASE,EAAoBD,EAAO,KAAK;AAAA,MAAA,EACzC;AAAA,MACF,OAAOC,EAAoBJ,IAAQA,EAAM,QAAQ,CAAA,CAAE;AAAA,IAAA;AAAA,EAEvD,GAAG,CAACJ,CAAO,CAAC,GAEN,EAAE,SAAAS,GAAS,UAAAC,GAAU,WAAAC,EAAA,IAAcC,EAKtC;AAAA,IACD,eAAeV;AAAA,EAAA,CAChB;AAED,EAAAW,EAAoBZ,GAAK,OAAO;AAAA,IAC9B,UAAU,MAAM;AACd,YAAMa,IAASH,EAAA,GACTI,IAAgC;AAAA,QACpC,MAAMC,EAAK;AAAA,QACX,OAAOjB;AAAA,QACP,QAAQe,EAAO;AAAA,QACf,YAAYd,GAAS,cAAc;AAAA,QACnC,SAAS,OAAO;AAAA,UACdc,EAAO,QAAQ,IAAI,CAAC,EAAE,MAAAR,GAAM,SAAAW,QAAc;AAAA,YACxCX;AAAA,YACA,EAAE,OAAOY,EAAgBD,CAAO,EAAA;AAAA,UAAE,CACnC;AAAA,QAAA;AAAA,MACH;AAEF,aAAOT,EAAoB,CAACO,CAAc,CAAC;AAAA,IAC7C;AAAA,EAAA,EACA;AAEF,QAAMV,IAAUc,EAAc;AAAA,IAC5B,SAAAV;AAAA,IACA,MAAM;AAAA,EAAA,CACP;AAED,SACE,gBAAAW,EAAC,OAAA,EAAI,WAAU,uBACb,UAAA;AAAA,IAAA,gBAAAA,EAAC,YAAA,EAAS,WAAU,4FAClB,UAAA;AAAA,MAAA,gBAAAC,EAAC,YAAO,UAAA,UAAA,CAAO;AAAA,MACdhB,EAAQ,OAAO,IAAI,CAACiB,GAAOC,MAC1B,gBAAAH,EAACI,GAAA,EACC,UAAA;AAAA,QAAA,gBAAAH,EAAC,WAAM,SAAS,WAAWE,CAAK,IAAK,YAAM,MAAK;AAAA,QAEhD,gBAAAF;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACJ,GAAGX,EAAS,WAAWa,CAAK,YAAY,EAAE,UAAU,IAAM;AAAA,UAAA;AAAA,QAAA;AAAA,QAE7D,gBAAAF;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,SAAS,MAAMhB,EAAQ,OAAOkB,CAAK;AAAA,YACnC,MAAK;AAAA,YAEL,UAAA,gBAAAF,EAACI,GAAA,EAAM,MAAM,GAAA,CAAI;AAAA,UAAA;AAAA,QAAA;AAAA,MACnB,KAdaH,EAAM,EAerB,CACD;AAAA,MAED,gBAAAF,EAAAI,GAAA,EACE,UAAA;AAAA,QAAA,gBAAAH,EAAC,SAAA,EAAM,SAAQ,SAAQ,UAAA,SAAK;AAAA,QAE5B,gBAAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACJ,GAAGX,EAAS,SAAS,EAAE,UAAU,IAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MAC1C,EAAA,CACF;AAAA,IAAA,GACF;AAAA,IACA,gBAAAU,EAAC,OAAA,EAAI,WAAU,uCACb,UAAA;AAAA,MAAA,gBAAAA,EAAC,SAAA,EAAM,WAAU,gCAA+B,UAAA;AAAA,QAAA;AAAA,QAE9C,gBAAAC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,aAAY;AAAA,YACZ,MAAK;AAAA,YACJ,GAAGX,EAAS,QAAQ;AAAA,UAAA;AAAA,QAAA;AAAA,MACvB,GACF;AAAA,MACA,gBAAAU,EAACM,EAAQ,MAAR,EACC,UAAA;AAAA,QAAA,gBAAAL,EAACK,EAAQ,SAAR,EAAgB,UAAA,aAAA,CAAU;AAAA,QAC3B,gBAAAL,EAACK,EAAQ,QAAR,EACC,UAAA,gBAAAN;AAAA,UAACM,EAAQ;AAAA,UAAR;AAAA,YACC,WAAU;AAAA,YACV,YAAY;AAAA,YAEZ,UAAA;AAAA,cAAA,gBAAAL,EAAC,OAAA,EAAI,WAAU,iBACZ,UAAAxB,EAAqB;AAAA,gBAAO,CAACU,MAC5BF,EAAQ,OAAO,MAAM,CAACiB,MAAUA,EAAM,SAASf,CAAM;AAAA,cAAA,EACrD,IAAI,CAACA,MACL,gBAAAc;AAAA,gBAACK,EAAQ;AAAA,gBAAR;AAAA,kBACC,WAAWC;AAAA,oBACT;AAAA,kBAAA;AAAA,kBAGF,SAAS,MAAM;AAEb,oBAAAtB,EAAQ;AAAA,sBACN;AAAA,wBACE,MAAME;AAAA,wBACN,SAAS;AAAA,sBAAA;AAAA,sBAEX;AAAA,wBACE,aAAa;AAAA,sBAAA;AAAA,oBACf;AAAA,kBAEJ;AAAA,kBAEC,UAAAA;AAAA,gBAAA;AAAA,gBAdIA;AAAA,cAAA,CAgBR,GACH;AAAA,cAEA,gBAAAa,EAAC,OAAA,EAAI,WAAU,sEACb,UAAA;AAAA,gBAAA,gBAAAC,EAAC,SAAA,EAAM,SAAQ,eAAc,UAAA,UAAM;AAAA,gBACnC,gBAAAA;AAAA,kBAACO;AAAA,kBAAA;AAAA,oBACC,SAAAnB;AAAA,oBACA,MAAK;AAAA,oBACL,QAAQ,CAAC,EAAE,OAAAa,EAAA,MACT,gBAAAD;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,WAAU;AAAA,wBACV,KAAK;AAAA,wBACL,UAAU,CAAC,EAAE,eAAe,EAAE,OAAAQ,EAAA,QAAc;AAC1C,gCAAMC,IAAS,OAAOD,CAAK;AAC3B,0BAAI,MAAMC,CAAM,KACZA,IAAS,KACbR,EAAM,SAASQ,CAAM;AAAA,wBACvB;AAAA,wBACA,WAAW,CAACC,MAAM;AAOhB,0BANIA,EAAE,QAAQ,WACVT,EAAM,UAAU,UACFjB,EAAQ,OAAO;AAAA,4BAC/B,CAAC2B,MACCA,EAAc,SAAS,IAAIV,EAAM,KAAK;AAAA,0BAAA,MAG1CjB,EAAQ;AAAA,4BACN;AAAA,8BACE,MAAM,IAAIiB,EAAM,KAAK;AAAA,8BACrB,SAAS;AAAA,4BAAA;AAAA,4BAEX;AAAA,8BACE,aAAa;AAAA,4BAAA;AAAA,0BACf,GAEFA,EAAM,SAAS,MAAS;AAAA,wBAC1B;AAAA,wBACA,aAAY;AAAA,wBACZ,MAAK;AAAA,wBACL,OAAOA,EAAM,SAAS;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACxB;AAAA,gBAAA;AAAA,cAEJ,EAAA,CACF;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA,EACF,CACF;AAAA,MAAA,EAAA,CACF;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/inputs/variables/editors/SelectVariableEditor.js

@@ -1,17 +1,17 @@
-import { jsx as t, jsxs as f } from "react/jsx-runtime";
+import { jsx as s, jsxs as f } from "react/jsx-runtime";
 import { useMemo as d, useEffect as x } from "react";
 import { useForm as g, useFieldArray as v } from "react-hook-form";
 import { serializeICUMessage as n, parseICUMessage as b } from "../../../../utils/icu-tranform.js";
-function M({
-  element: s,
+function F({
+  element: t,
   onUpdate: a
 }) {
   const r = d(
-    () => Object.entries(s.options).map(([e, o]) => ({
+    () => Object.entries(t.options).map(([e, o]) => ({
       name: e,
       content: n(o.value)
     })),
-    [s]
+    [t]
   ), { control: i, register: l, getValues: c } = g({
     defaultValues: { options: r }
   }), { fields: m } = v({
@@ -20,7 +20,7 @@ function M({
   });
   return x(() => () => {
     const e = c(), o = {
-      ...s,
+      ...t,
       options: Object.fromEntries(
         e.options.map(({ name: p, content: u }) => [
           p,
@@ -29,9 +29,16 @@ function M({
       )
     };
     a(n([o]));
-  }, []), /* @__PURE__ */ t("div", { className: "flex flex-col gap-2 p-3", children: m.map((e, o) => /* @__PURE__ */ f("div", { className: "flex flex-col gap-1", children: [
-    /* @__PURE__ */ t("label", { className: "text-sm font-medium", children: e.name }),
-    /* @__PURE__ */ t(
+  }, []), /* @__PURE__ */ s("div", { className: "flex flex-col gap-2 p-3", children: m.map((e, o) => /* @__PURE__ */ f("div", { className: "flex flex-col gap-1", children: [
+    /* @__PURE__ */ s(
+      "label",
+      {
+        className: "font-medium text-sm",
+        htmlFor: `options.${o}.content`,
+        children: e.name
+      }
+    ),
+    /* @__PURE__ */ s(
       "input",
       {
         className: "focus:outline-none",
@@ -41,6 +48,6 @@ function M({
   ] }, e.name)) });
 }
 export {
-  M as SelectVariableEditor
+  F as SelectVariableEditor
 };
 //# sourceMappingURL=SelectVariableEditor.js.map

package/dist/components/inputs/variables/editors/SelectVariableEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectVariableEditor.js","sources":["../../../../../src/components/inputs/variables/editors/SelectVariableEditor.tsx"],"sourcesContent":["import type { SelectElement } from \"@/types\";\nimport { useEffect, useMemo } from \"react\";\nimport { useFieldArray, useForm } from \"react-hook-form\";\n\nimport { parseICUMessage, serializeICUMessage } from \"@/utils/icu-tranform\";\n\nexport interface SelectVariableEditorProps {\n  element: SelectElement;\n  onUpdate: (value: string) => void;\n}\n\nexport function SelectVariableEditor({\n  element,\n  onUpdate,\n}: SelectVariableEditorProps) {\n  const options = useMemo<{ name: string; content: string }[]>(\n    () =>\n      Object.entries(element.options).map(([name, option]) => ({\n        name,\n        content: serializeICUMessage(option.value),\n      })),\n    [element],\n  );\n\n  const { control, register, getValues } = useForm<{\n    options: { name: string; content: string }[];\n  }>({\n    defaultValues: { options },\n  });\n  const { fields } = useFieldArray({\n    control,\n    name: \"options\",\n  });\n\n  useEffect(() => {\n    return () => {\n      const values = getValues();\n      const updatedElement: SelectElement = {\n        ...element,\n        options: Object.fromEntries(\n          values.options.map(({ name, content }) => [\n            name,\n            { value: parseICUMessage(content) },\n          ]),\n        ),\n      };\n      onUpdate(serializeICUMessage([updatedElement]));\n    };\n  }, []);\n\n  return (\n    <div className=\"flex flex-col gap-2 p-3\">\n      {fields.map((field, index) => (\n        <div key={field.name} className=\"flex flex-col gap-1\">\n          <label className=\"text-sm font-medium\">{field.name}</label>\n          {/* // TODO add support for variable mentions */}\n          <input\n            className=\"focus:outline-none\"\n            {...register(`options.${index}.content`)}\n          />\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"names":["SelectVariableEditor","element","onUpdate","options","useMemo","name","option","serializeICUMessage","control","register","getValues","useForm","fields","useFieldArray","useEffect","values","updatedElement","content","parseICUMessage","jsx","field","index","jsxs"],"mappings":";;;;AAWO,SAASA,EAAqB;AAAA,EACnC,SAAAC;AAAA,EACA,UAAAC;AACF,GAA8B;AAC5B,QAAMC,IAAUC;AAAA,IACd,MACE,OAAO,QAAQH,EAAQ,OAAO,EAAE,IAAI,CAAC,CAACI,GAAMC,CAAM,OAAO;AAAA,MACvD,MAAAD;AAAA,MACA,SAASE,EAAoBD,EAAO,KAAK;AAAA,IAAA,EACzC;AAAA,IACJ,CAACL,CAAO;AAAA,EAAA,GAGJ,EAAE,SAAAO,GAAS,UAAAC,GAAU,WAAAC,EAAA,IAAcC,EAEtC;AAAA,IACD,eAAe,EAAE,SAAAR,EAAA;AAAA,EAAQ,CAC1B,GACK,EAAE,QAAAS,EAAA,IAAWC,EAAc;AAAA,IAC/B,SAAAL;AAAA,IACA,MAAM;AAAA,EAAA,CACP;AAED,SAAAM,EAAU,MACD,MAAM;AACX,UAAMC,IAASL,EAAA,GACTM,IAAgC;AAAA,MACpC,GAAGf;AAAA,MACH,SAAS,OAAO;AAAA,QACdc,EAAO,QAAQ,IAAI,CAAC,EAAE,MAAAV,GAAM,SAAAY,QAAc;AAAA,UACxCZ;AAAA,UACA,EAAE,OAAOa,EAAgBD,CAAO,EAAA;AAAA,QAAE,CACnC;AAAA,MAAA;AAAA,IACH;AAEF,IAAAf,EAASK,EAAoB,CAACS,CAAc,CAAC,CAAC;AAAA,EAChD,GACC,CAAA,CAAE,GAGH,gBAAAG,EAAC,OAAA,EAAI,WAAU,2BACZ,UAAAP,EAAO,IAAI,CAACQ,GAAOC,MAClB,gBAAAC,EAAC,OAAA,EAAqB,WAAU,uBAC9B,UAAA;AAAA,IAAA,gBAAAH,EAAC,SAAA,EAAM,WAAU,uBAAuB,UAAAC,EAAM,MAAK;AAAA,IAEnD,gBAAAD;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACT,GAAGV,EAAS,WAAWY,CAAK,UAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACzC,EAAA,GANQD,EAAM,IAOhB,CACD,GACH;AAEJ;"}
+{"version":3,"file":"SelectVariableEditor.js","sources":["../../../../../src/components/inputs/variables/editors/SelectVariableEditor.tsx"],"sourcesContent":["import { useEffect, useMemo } from 'react';\nimport { useFieldArray, useForm } from 'react-hook-form';\nimport type { SelectElement } from '@/types';\n\nimport { parseICUMessage, serializeICUMessage } from '@/utils/icu-tranform';\n\nexport interface SelectVariableEditorProps {\n  element: SelectElement;\n  onUpdate: (value: string) => void;\n}\n\nexport function SelectVariableEditor({\n  element,\n  onUpdate,\n}: SelectVariableEditorProps) {\n  const options = useMemo<{ name: string; content: string }[]>(\n    () =>\n      Object.entries(element.options).map(([name, option]) => ({\n        name,\n        content: serializeICUMessage(option.value),\n      })),\n    [element],\n  );\n\n  const { control, register, getValues } = useForm<{\n    options: { name: string; content: string }[];\n  }>({\n    defaultValues: { options },\n  });\n  const { fields } = useFieldArray({\n    control,\n    name: 'options',\n  });\n\n  // biome-ignore lint/correctness/useExhaustiveDependencies: useEffectEvent\n  useEffect(() => {\n    return () => {\n      const values = getValues();\n      const updatedElement: SelectElement = {\n        ...element,\n        options: Object.fromEntries(\n          values.options.map(({ name, content }) => [\n            name,\n            { value: parseICUMessage(content) },\n          ]),\n        ),\n      };\n      onUpdate(serializeICUMessage([updatedElement]));\n    };\n  }, []);\n\n  return (\n    <div className=\"flex flex-col gap-2 p-3\">\n      {fields.map((field, index) => (\n        <div className=\"flex flex-col gap-1\" key={field.name}>\n          <label\n            className=\"font-medium text-sm\"\n            htmlFor={`options.${index}.content`}\n          >\n            {field.name}\n          </label>\n          {/* // TODO add support for variable mentions */}\n          <input\n            className=\"focus:outline-none\"\n            {...register(`options.${index}.content`)}\n          />\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"names":["SelectVariableEditor","element","onUpdate","options","useMemo","name","option","serializeICUMessage","control","register","getValues","useForm","fields","useFieldArray","useEffect","values","updatedElement","content","parseICUMessage","jsx","field","index","jsxs"],"mappings":";;;;AAWO,SAASA,EAAqB;AAAA,EACnC,SAAAC;AAAA,EACA,UAAAC;AACF,GAA8B;AAC5B,QAAMC,IAAUC;AAAA,IACd,MACE,OAAO,QAAQH,EAAQ,OAAO,EAAE,IAAI,CAAC,CAACI,GAAMC,CAAM,OAAO;AAAA,MACvD,MAAAD;AAAA,MACA,SAASE,EAAoBD,EAAO,KAAK;AAAA,IAAA,EACzC;AAAA,IACJ,CAACL,CAAO;AAAA,EAAA,GAGJ,EAAE,SAAAO,GAAS,UAAAC,GAAU,WAAAC,EAAA,IAAcC,EAEtC;AAAA,IACD,eAAe,EAAE,SAAAR,EAAA;AAAA,EAAQ,CAC1B,GACK,EAAE,QAAAS,EAAA,IAAWC,EAAc;AAAA,IAC/B,SAAAL;AAAA,IACA,MAAM;AAAA,EAAA,CACP;AAGD,SAAAM,EAAU,MACD,MAAM;AACX,UAAMC,IAASL,EAAA,GACTM,IAAgC;AAAA,MACpC,GAAGf;AAAA,MACH,SAAS,OAAO;AAAA,QACdc,EAAO,QAAQ,IAAI,CAAC,EAAE,MAAAV,GAAM,SAAAY,QAAc;AAAA,UACxCZ;AAAA,UACA,EAAE,OAAOa,EAAgBD,CAAO,EAAA;AAAA,QAAE,CACnC;AAAA,MAAA;AAAA,IACH;AAEF,IAAAf,EAASK,EAAoB,CAACS,CAAc,CAAC,CAAC;AAAA,EAChD,GACC,CAAA,CAAE,GAGH,gBAAAG,EAAC,OAAA,EAAI,WAAU,2BACZ,UAAAP,EAAO,IAAI,CAACQ,GAAOC,MAClB,gBAAAC,EAAC,OAAA,EAAI,WAAU,uBACb,UAAA;AAAA,IAAA,gBAAAH;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,SAAS,WAAWE,CAAK;AAAA,QAExB,UAAAD,EAAM;AAAA,MAAA;AAAA,IAAA;AAAA,IAGT,gBAAAD;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACT,GAAGV,EAAS,WAAWY,CAAK,UAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACzC,EAAA,GAXwCD,EAAM,IAYhD,CACD,GACH;AAEJ;"}

package/dist/components/inputs/variables/editors/TagVariableEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagVariableEditor.js","sources":["../../../../../src/components/inputs/variables/editors/TagVariableEditor.tsx"],"sourcesContent":["import type { TagElement } from \"@/types\";\nimport { useEffect, useMemo } from \"react\";\nimport { useForm } from \"react-hook-form\";\n\nimport { parseICUMessage, serializeICUMessage } from \"@/utils/icu-tranform\";\n\nexport interface TagVariableEditorProps {\n  element: TagElement;\n  onUpdate: (value: string) => void;\n}\n\nexport function TagVariableEditor({\n  element,\n  onUpdate,\n}: TagVariableEditorProps) {\n  const content = useMemo<string>(\n    () => serializeICUMessage(element.children),\n    [element],\n  );\n\n  const { register, getValues } = useForm<{ content: string }>({\n    defaultValues: { content },\n  });\n\n  useEffect(() => {\n    return () => {\n      const { content } = getValues();\n      // TODO find better solution for this\n      const updatedElement: TagElement = {\n        ...element,\n        children: parseICUMessage(content),\n      };\n      onUpdate(serializeICUMessage([updatedElement]));\n    };\n  }, []);\n\n  // TODO add support for variable mentions\n  return (\n    <textarea\n      className=\"p-3 focus:outline-none\"\n      {...register(\"content\")}\n      rows={1}\n    />\n  );\n}\n"],"names":["TagVariableEditor","element","onUpdate","content","useMemo","serializeICUMessage","register","getValues","useForm","useEffect","updatedElement","parseICUMessage","jsx"],"mappings":";;;;AAWO,SAASA,EAAkB;AAAA,EAChC,SAAAC;AAAA,EACA,UAAAC;AACF,GAA2B;AACzB,QAAMC,IAAUC;AAAA,IACd,MAAMC,EAAoBJ,EAAQ,QAAQ;AAAA,IAC1C,CAACA,CAAO;AAAA,EAAA,GAGJ,EAAE,UAAAK,GAAU,WAAAC,EAAA,IAAcC,EAA6B;AAAA,IAC3D,eAAe,EAAE,SAAAL,EAAA;AAAA,EAAQ,CAC1B;AAED,SAAAM,EAAU,MACD,MAAM;AACX,UAAM,EAAE,SAAAN,EAAAA,IAAYI,EAAA,GAEdG,IAA6B;AAAA,MACjC,GAAGT;AAAA,MACH,UAAUU,EAAgBR,CAAO;AAAA,IAAA;AAEnC,IAAAD,EAASG,EAAoB,CAACK,CAAc,CAAC,CAAC;AAAA,EAChD,GACC,CAAA,CAAE,GAIH,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACT,GAAGN,EAAS,SAAS;AAAA,MACtB,MAAM;AAAA,IAAA;AAAA,EAAA;AAGZ;"}
+{"version":3,"file":"TagVariableEditor.js","sources":["../../../../../src/components/inputs/variables/editors/TagVariableEditor.tsx"],"sourcesContent":["import { useEffect, useMemo } from 'react';\nimport { useForm } from 'react-hook-form';\nimport type { TagElement } from '@/types';\n\nimport { parseICUMessage, serializeICUMessage } from '@/utils/icu-tranform';\n\nexport interface TagVariableEditorProps {\n  element: TagElement;\n  onUpdate: (value: string) => void;\n}\n\nexport function TagVariableEditor({\n  element,\n  onUpdate,\n}: TagVariableEditorProps) {\n  const content = useMemo<string>(\n    () => serializeICUMessage(element.children),\n    [element],\n  );\n\n  const { register, getValues } = useForm<{ content: string }>({\n    defaultValues: { content },\n  });\n\n  // biome-ignore lint/correctness/useExhaustiveDependencies: useEffectEvent\n  useEffect(() => {\n    return () => {\n      const { content } = getValues();\n      // TODO find better solution for this\n      const updatedElement: TagElement = {\n        ...element,\n        children: parseICUMessage(content),\n      };\n      onUpdate(serializeICUMessage([updatedElement]));\n    };\n  }, []);\n\n  // TODO add support for variable mentions\n  return (\n    <textarea\n      className=\"p-3 focus:outline-none\"\n      {...register('content')}\n      rows={1}\n    />\n  );\n}\n"],"names":["TagVariableEditor","element","onUpdate","content","useMemo","serializeICUMessage","register","getValues","useForm","useEffect","updatedElement","parseICUMessage","jsx"],"mappings":";;;;AAWO,SAASA,EAAkB;AAAA,EAChC,SAAAC;AAAA,EACA,UAAAC;AACF,GAA2B;AACzB,QAAMC,IAAUC;AAAA,IACd,MAAMC,EAAoBJ,EAAQ,QAAQ;AAAA,IAC1C,CAACA,CAAO;AAAA,EAAA,GAGJ,EAAE,UAAAK,GAAU,WAAAC,EAAA,IAAcC,EAA6B;AAAA,IAC3D,eAAe,EAAE,SAAAL,EAAA;AAAA,EAAQ,CAC1B;AAGD,SAAAM,EAAU,MACD,MAAM;AACX,UAAM,EAAE,SAAAN,EAAAA,IAAYI,EAAA,GAEdG,IAA6B;AAAA,MACjC,GAAGT;AAAA,MACH,UAAUU,EAAgBR,CAAO;AAAA,IAAA;AAEnC,IAAAD,EAASG,EAAoB,CAACK,CAAc,CAAC,CAAC;AAAA,EAChD,GACC,CAAA,CAAE,GAIH,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACT,GAAGN,EAAS,SAAS;AAAA,MACtB,MAAM;AAAA,IAAA;AAAA,EAAA;AAGZ;"}

package/dist/components/inputs/variables/extension.js.map

@@ -1 +1 @@
-{"version":3,"file":"extension.js","sources":["../../../../src/components/inputs/variables/extension.ts"],"sourcesContent":["import type { TemplateVariable, VariableMentionNodeAttrs } from \"@/types\";\nimport type { VirtualElement } from \"@floating-ui/dom\";\nimport type { MentionOptions } from \"@tiptap/extension-mention\";\nimport type { Attribute, Editor } from \"@tiptap/react\";\nimport type { SuggestionKeyDownProps } from \"@tiptap/suggestion\";\nimport { computePosition, flip, shift } from \"@floating-ui/dom\";\nimport Mention from \"@tiptap/extension-mention\";\nimport {\n  posToDOMRect,\n  ReactNodeViewRenderer,\n  ReactRenderer,\n} from \"@tiptap/react\";\n\nimport { formatVariableLabel } from \"@/utils/format\";\nimport { isTagElement, isTemporalElement } from \"@/utils/guards\";\nimport { serializeICUMessage } from \"@/utils/icu-tranform\";\n\nimport type { VariableSuggestionProps } from \"./VariableSuggestion\";\nimport { VariableChip } from \"./VariableChip\";\nimport { VariableSuggestion } from \"./VariableSuggestion\";\n\nexport function VariableMention(variables: TemplateVariable[]) {\n  return Mention.extend<\n    MentionOptions<VariableMentionNodeAttrs, VariableMentionNodeAttrs>\n  >({\n    name: \"variable\",\n    addNodeView: () => ReactNodeViewRenderer(VariableChip),\n    addAttributes: () =>\n      ({\n        name: { default: null },\n        icu: { default: null },\n        label: { default: null },\n      }) satisfies Record<keyof VariableMentionNodeAttrs, Attribute>,\n    renderText: ({ node }) => node.attrs.icu,\n  }).configure({\n    HTMLAttributes: {\n      class: \"variable\",\n    },\n    suggestions: [\n      createSuggestion(\"@\", variables),\n      createSuggestion(\n        \"{\",\n        variables.filter((variable) => !isTagElement(variable)),\n      ),\n      createSuggestion(\n        \"<\",\n        variables.filter((variable) => isTagElement(variable)),\n      ),\n    ],\n  });\n}\n\nfunction createSuggestion(\n  char: string,\n  variables: TemplateVariable[],\n): MentionOptions<\n  VariableMentionNodeAttrs,\n  VariableMentionNodeAttrs\n>[\"suggestion\"] {\n  const items = variables.map((variable) => ({\n    name: variable.value,\n    label: formatVariableLabel(variable),\n    icu: serializeICUMessage([variable]),\n  }));\n\n  function updatePosition(editor: Editor, element: HTMLElement): void {\n    const virtualElement: VirtualElement = {\n      getBoundingClientRect: () =>\n        posToDOMRect(\n          editor.view,\n          editor.state.selection.from,\n          editor.state.selection.to,\n        ),\n    };\n\n    void computePosition(virtualElement, element, {\n      placement: \"bottom-start\",\n      strategy: \"absolute\",\n      middleware: [shift(), flip()],\n    }).then(({ x, y, strategy }) => {\n      element.style.width = \"max-content\";\n      element.style.position = strategy;\n      element.style.left = `${x}px`;\n      element.style.top = `${y}px`;\n    });\n  }\n\n  return {\n    char,\n    items: ({ query }) =>\n      items.filter((item) =>\n        item.name.toLowerCase().startsWith(query.toLowerCase()),\n      ),\n    render: () => {\n      let component: ReactRenderer<\n        { onKeyDown(props: SuggestionKeyDownProps): boolean },\n        VariableSuggestionProps\n      >;\n\n      const scrollableElement = document.getElementById(\n        \"messages-form-content\",\n      );\n\n      return {\n        onStart: (props) => {\n          component = new ReactRenderer<\n            { onKeyDown(props: SuggestionKeyDownProps): boolean },\n            VariableSuggestionProps\n          >(VariableSuggestion, {\n            props,\n            editor: props.editor,\n          });\n\n          if (!props.clientRect) return;\n\n          scrollableElement!.style.overflow = \"hidden\";\n\n          const element = component.element;\n          element.style.position = \"absolute\";\n          document.body.appendChild(element);\n\n          updatePosition(props.editor, element);\n        },\n\n        onUpdate(props) {\n          component.updateProps(props);\n\n          if (!props.clientRect) return;\n\n          updatePosition(props.editor, component.element);\n        },\n\n        onKeyDown(props) {\n          if (props.event.key === \"Escape\") {\n            component.destroy();\n            return true;\n          }\n          if (!component.ref) return false;\n\n          return component.ref.onKeyDown(props);\n        },\n\n        onExit() {\n          component.element.remove();\n          component.destroy();\n          scrollableElement!.style.overflow = \"\";\n        },\n      };\n    },\n  };\n}\n"],"names":["VariableMention","variables","Mention","ReactNodeViewRenderer","VariableChip","node","createSuggestion","variable","isTagElement","char","items","formatVariableLabel","serializeICUMessage","updatePosition","editor","element","computePosition","posToDOMRect","shift","flip","x","y","strategy","query","item","component","scrollableElement","props","ReactRenderer","VariableSuggestion"],"mappings":"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"}
+{"version":3,"file":"extension.js","sources":["../../../../src/components/inputs/variables/extension.ts"],"sourcesContent":["import type { VirtualElement } from '@floating-ui/dom';\nimport { computePosition, flip, shift } from '@floating-ui/dom';\nimport type { MentionOptions } from '@tiptap/extension-mention';\nimport Mention from '@tiptap/extension-mention';\nimport type { Attribute, Editor } from '@tiptap/react';\nimport {\n  posToDOMRect,\n  ReactNodeViewRenderer,\n  ReactRenderer,\n} from '@tiptap/react';\nimport type { SuggestionKeyDownProps } from '@tiptap/suggestion';\nimport type { TemplateVariable, VariableMentionNodeAttrs } from '@/types';\n\nimport { formatVariableLabel } from '@/utils/format';\nimport { isTagElement, isTemporalElement } from '@/utils/guards';\nimport { serializeICUMessage } from '@/utils/icu-tranform';\nimport { VariableChip } from './VariableChip';\nimport type { VariableSuggestionProps } from './VariableSuggestion';\nimport { VariableSuggestion } from './VariableSuggestion';\n\nexport function VariableMention(variables: TemplateVariable[]) {\n  return Mention.extend<\n    MentionOptions<VariableMentionNodeAttrs, VariableMentionNodeAttrs>\n  >({\n    name: 'variable',\n    addNodeView: () => ReactNodeViewRenderer(VariableChip),\n    addAttributes: () =>\n      ({\n        name: { default: null },\n        icu: { default: null },\n        label: { default: null },\n      }) satisfies Record<keyof VariableMentionNodeAttrs, Attribute>,\n    renderText: ({ node }) => node.attrs.icu,\n  }).configure({\n    HTMLAttributes: {\n      class: 'variable',\n    },\n    suggestions: [\n      createSuggestion('@', variables),\n      createSuggestion(\n        '{',\n        variables.filter((variable) => !isTagElement(variable)),\n      ),\n      createSuggestion(\n        '<',\n        variables.filter((variable) => isTagElement(variable)),\n      ),\n    ],\n  });\n}\n\nfunction createSuggestion(\n  char: string,\n  variables: TemplateVariable[],\n): MentionOptions<\n  VariableMentionNodeAttrs,\n  VariableMentionNodeAttrs\n>['suggestion'] {\n  const items = variables.map((variable) => ({\n    name: variable.value,\n    label: formatVariableLabel(variable),\n    icu: serializeICUMessage([variable]),\n  }));\n\n  function updatePosition(editor: Editor, element: HTMLElement): void {\n    const virtualElement: VirtualElement = {\n      getBoundingClientRect: () =>\n        posToDOMRect(\n          editor.view,\n          editor.state.selection.from,\n          editor.state.selection.to,\n        ),\n    };\n\n    void computePosition(virtualElement, element, {\n      placement: 'bottom-start',\n      strategy: 'absolute',\n      middleware: [shift(), flip()],\n    }).then(({ x, y, strategy }) => {\n      element.style.width = 'max-content';\n      element.style.position = strategy;\n      element.style.left = `${x}px`;\n      element.style.top = `${y}px`;\n    });\n  }\n\n  return {\n    char,\n    items: ({ query }) =>\n      items.filter((item) =>\n        item.name.toLowerCase().startsWith(query.toLowerCase()),\n      ),\n    render: () => {\n      let component: ReactRenderer<\n        { onKeyDown(props: SuggestionKeyDownProps): boolean },\n        VariableSuggestionProps\n      >;\n\n      const scrollableElement = document.getElementById(\n        'messages-form-content',\n      );\n\n      return {\n        onStart: (props) => {\n          component = new ReactRenderer<\n            { onKeyDown(props: SuggestionKeyDownProps): boolean },\n            VariableSuggestionProps\n          >(VariableSuggestion, {\n            props,\n            editor: props.editor,\n          });\n\n          if (!props.clientRect) return;\n\n          scrollableElement!.style.overflow = 'hidden';\n\n          const element = component.element;\n          element.style.position = 'absolute';\n          document.body.appendChild(element);\n\n          updatePosition(props.editor, element);\n        },\n\n        onUpdate(props) {\n          component.updateProps(props);\n\n          if (!props.clientRect) return;\n\n          updatePosition(props.editor, component.element);\n        },\n\n        onKeyDown(props) {\n          if (props.event.key === 'Escape') {\n            component.destroy();\n            return true;\n          }\n          if (!component.ref) return false;\n\n          return component.ref.onKeyDown(props);\n        },\n\n        onExit() {\n          component.element.remove();\n          component.destroy();\n          scrollableElement!.style.overflow = '';\n        },\n      };\n    },\n  };\n}\n"],"names":["VariableMention","variables","Mention","ReactNodeViewRenderer","VariableChip","node","createSuggestion","variable","isTagElement","char","items","formatVariableLabel","serializeICUMessage","updatePosition","editor","element","computePosition","posToDOMRect","shift","flip","x","y","strategy","query","item","component","scrollableElement","props","ReactRenderer","VariableSuggestion"],"mappings":"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"}

package/dist/components/inputs/variables/pickers/NumericVariablePicker.js

@@ -22,15 +22,15 @@ function E({
     /* @__PURE__ */ a(
       l.Root,
       {
-        type: "single",
         className: "flex bg-elevation-100",
         onValueChange: (r) => u(r),
+        type: "single",
         value: o,
         children: v.map((r) => /* @__PURE__ */ a(
           l.Item,
           {
+            className: "flex-1 border-none data-[state=off]:cursor-pointer data-[state=on]:bg-elevation-800 data-[state=on]:text-elevation-0 data-[state=off]:opacity-50 data-[state=off]:hover:opacity-100",
             value: r,
-            className: "flex-1 border-none data-[state=off]:cursor-pointer data-[state=off]:opacity-50 data-[state=off]:hover:opacity-100 data-[state=on]:bg-elevation-800 data-[state=on]:text-elevation-0",
             children: r
           },
           r
@@ -40,9 +40,9 @@ function E({
     /* @__PURE__ */ a("div", { className: "p-3", children: o === "plural" && /* @__PURE__ */ a(
       d,
       {
-        variableName: e.value,
         element: i(e) ? e : void 0,
-        ref: t
+        ref: t,
+        variableName: e.value
       }
     ) })
   ] });

package/dist/components/inputs/variables/pickers/NumericVariablePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumericVariablePicker.js","sources":["../../../../../src/components/inputs/variables/pickers/NumericVariablePicker.tsx"],"sourcesContent":["import type { NumberElement, PluralElement } from \"@/types\";\nimport { ToggleGroup } from \"radix-ui\";\nimport { useEffect, useRef, useState } from \"react\";\n\nimport { isNumberElement, isPluralElement } from \"@/utils/guards\";\n\nimport { PluralVariableEditor } from \"../editors/PluralVariableEditor\";\n\nconst NUMERIC_TYPES = [\n  \"number\",\n  \"plural\",\n  // \"selectordinal\"\n] as const;\n\ntype NumericType = (typeof NUMERIC_TYPES)[number];\n\nexport interface NumericVariablePickerProps {\n  element: NumberElement | PluralElement;\n  onUpdate: (value: string) => void;\n}\n\nexport function NumericVariablePicker({\n  element,\n  onUpdate,\n}: NumericVariablePickerProps) {\n  const [type, setType] = useState<NumericType | undefined>(() => {\n    if (isNumberElement(element)) return \"number\";\n    if (isPluralElement(element)) return \"plural\";\n    return undefined;\n  });\n  const getValueRef = useRef<{ getValue: () => string }>(null);\n\n  useEffect(() => {\n    return () => {\n      if (!getValueRef.current) return;\n      onUpdate(getValueRef.current.getValue());\n    };\n  }, []);\n\n  return (\n    <div className=\"\">\n      <ToggleGroup.Root\n        type=\"single\"\n        className=\"flex bg-elevation-100\"\n        onValueChange={(value) => setType(value as NumericType)}\n        value={type}\n      >\n        {NUMERIC_TYPES.map((type) => (\n          <ToggleGroup.Item\n            key={type}\n            value={type}\n            className=\"flex-1 border-none data-[state=off]:cursor-pointer data-[state=off]:opacity-50 data-[state=off]:hover:opacity-100 data-[state=on]:bg-elevation-800 data-[state=on]:text-elevation-0\"\n          >\n            {type}\n          </ToggleGroup.Item>\n        ))}\n      </ToggleGroup.Root>\n\n      <div className=\"p-3\">\n        {type === \"plural\" && (\n          <PluralVariableEditor\n            variableName={element.value}\n            element={isPluralElement(element) ? element : undefined}\n            ref={getValueRef}\n          />\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["NUMERIC_TYPES","NumericVariablePicker","element","onUpdate","type","setType","useState","isNumberElement","isPluralElement","getValueRef","useRef","useEffect","jsxs","jsx","ToggleGroup","value","PluralVariableEditor"],"mappings":";;;;;AAQA,MAAMA,IAAgB;AAAA,EACpB;AAAA,EACA;AAAA;AAEF;AASO,SAASC,EAAsB;AAAA,EACpC,SAAAC;AAAA,EACA,UAAAC;AACF,GAA+B;AAC7B,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAkC,MAAM;AAC9D,QAAIC,EAAgBL,CAAO,EAAG,QAAO;AACrC,QAAIM,EAAgBN,CAAO,EAAG,QAAO;AAAA,EAEvC,CAAC,GACKO,IAAcC,EAAmC,IAAI;AAE3D,SAAAC,EAAU,MACD,MAAM;AACX,IAAKF,EAAY,WACjBN,EAASM,EAAY,QAAQ,UAAU;AAAA,EACzC,GACC,CAAA,CAAE,GAGH,gBAAAG,EAAC,OAAA,EAAI,WAAU,IACb,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC,EAAY;AAAA,MAAZ;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,eAAe,CAACC,MAAUV,EAAQU,CAAoB;AAAA,QACtD,OAAOX;AAAA,QAEN,UAAAJ,EAAc,IAAI,CAACI,MAClB,gBAAAS;AAAA,UAACC,EAAY;AAAA,UAAZ;AAAA,YAEC,OAAOV;AAAAA,YACP,WAAU;AAAA,YAET,UAAAA;AAAAA,UAAA;AAAA,UAJIA;AAAAA,QAAA,CAMR;AAAA,MAAA;AAAA,IAAA;AAAA,IAGH,gBAAAS,EAAC,OAAA,EAAI,WAAU,OACZ,gBAAS,YACR,gBAAAA;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,cAAcd,EAAQ;AAAA,QACtB,SAASM,EAAgBN,CAAO,IAAIA,IAAU;AAAA,QAC9C,KAAKO;AAAA,MAAA;AAAA,IAAA,EACP,CAEJ;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"NumericVariablePicker.js","sources":["../../../../../src/components/inputs/variables/pickers/NumericVariablePicker.tsx"],"sourcesContent":["import { ToggleGroup } from 'radix-ui';\nimport { useEffect, useRef, useState } from 'react';\nimport type { NumberElement, PluralElement } from '@/types';\n\nimport { isNumberElement, isPluralElement } from '@/utils/guards';\n\nimport { PluralVariableEditor } from '../editors/PluralVariableEditor';\n\nconst NUMERIC_TYPES = [\n  'number',\n  'plural',\n  // \"selectordinal\"\n] as const;\n\ntype NumericType = (typeof NUMERIC_TYPES)[number];\n\nexport interface NumericVariablePickerProps {\n  element: NumberElement | PluralElement;\n  onUpdate: (value: string) => void;\n}\n\nexport function NumericVariablePicker({\n  element,\n  onUpdate,\n}: NumericVariablePickerProps) {\n  const [type, setType] = useState<NumericType | undefined>(() => {\n    if (isNumberElement(element)) return 'number';\n    if (isPluralElement(element)) return 'plural';\n    return undefined;\n  });\n  const getValueRef = useRef<{ getValue: () => string }>(null);\n\n  // biome-ignore lint/correctness/useExhaustiveDependencies: useEffectEvent\n  useEffect(() => {\n    return () => {\n      if (!getValueRef.current) return;\n      onUpdate(getValueRef.current.getValue());\n    };\n  }, []);\n\n  return (\n    <div className=\"\">\n      <ToggleGroup.Root\n        className=\"flex bg-elevation-100\"\n        onValueChange={(value) => setType(value as NumericType)}\n        type=\"single\"\n        value={type}\n      >\n        {NUMERIC_TYPES.map((type) => (\n          <ToggleGroup.Item\n            className=\"flex-1 border-none data-[state=off]:cursor-pointer data-[state=on]:bg-elevation-800 data-[state=on]:text-elevation-0 data-[state=off]:opacity-50 data-[state=off]:hover:opacity-100\"\n            key={type}\n            value={type}\n          >\n            {type}\n          </ToggleGroup.Item>\n        ))}\n      </ToggleGroup.Root>\n\n      <div className=\"p-3\">\n        {type === 'plural' && (\n          <PluralVariableEditor\n            element={isPluralElement(element) ? element : undefined}\n            ref={getValueRef}\n            variableName={element.value}\n          />\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["NUMERIC_TYPES","NumericVariablePicker","element","onUpdate","type","setType","useState","isNumberElement","isPluralElement","getValueRef","useRef","useEffect","jsxs","jsx","ToggleGroup","value","PluralVariableEditor"],"mappings":";;;;;AAQA,MAAMA,IAAgB;AAAA,EACpB;AAAA,EACA;AAAA;AAEF;AASO,SAASC,EAAsB;AAAA,EACpC,SAAAC;AAAA,EACA,UAAAC;AACF,GAA+B;AAC7B,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAkC,MAAM;AAC9D,QAAIC,EAAgBL,CAAO,EAAG,QAAO;AACrC,QAAIM,EAAgBN,CAAO,EAAG,QAAO;AAAA,EAEvC,CAAC,GACKO,IAAcC,EAAmC,IAAI;AAG3D,SAAAC,EAAU,MACD,MAAM;AACX,IAAKF,EAAY,WACjBN,EAASM,EAAY,QAAQ,UAAU;AAAA,EACzC,GACC,CAAA,CAAE,GAGH,gBAAAG,EAAC,OAAA,EAAI,WAAU,IACb,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC,EAAY;AAAA,MAAZ;AAAA,QACC,WAAU;AAAA,QACV,eAAe,CAACC,MAAUV,EAAQU,CAAoB;AAAA,QACtD,MAAK;AAAA,QACL,OAAOX;AAAA,QAEN,UAAAJ,EAAc,IAAI,CAACI,MAClB,gBAAAS;AAAA,UAACC,EAAY;AAAA,UAAZ;AAAA,YACC,WAAU;AAAA,YAEV,OAAOV;AAAAA,YAEN,UAAAA;AAAAA,UAAA;AAAA,UAHIA;AAAAA,QAAA,CAKR;AAAA,MAAA;AAAA,IAAA;AAAA,IAGH,gBAAAS,EAAC,OAAA,EAAI,WAAU,OACZ,gBAAS,YACR,gBAAAA;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,SAASR,EAAgBN,CAAO,IAAIA,IAAU;AAAA,QAC9C,KAAKO;AAAA,QACL,cAAcP,EAAQ;AAAA,MAAA;AAAA,IAAA,EACxB,CAEJ;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/layout/MessageField.js

@@ -21,11 +21,11 @@ function w({
       c,
       {
         className: l,
-        type: e.type,
-        variables: e.variables,
         locale: r[0],
         name: [r[0], t, s].join("."),
-        validate: m
+        type: e.type,
+        validate: m,
+        variables: e.variables
       }
     ) : /* @__PURE__ */ i(
       "div",
@@ -38,12 +38,12 @@ function w({
           c,
           {
             className: "flex-1",
-            type: e.type,
             label: a.toUpperCase(),
             locale: a,
-            variables: e.variables,
             name: [a, t, s].join("."),
-            validate: m
+            type: e.type,
+            validate: m,
+            variables: e.variables
           },
           a
         ))

package/dist/components/layout/MessageField.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessageField.js","sources":["../../../src/components/layout/MessageField.tsx"],"sourcesContent":["import type { MessageSchema } from \"@/types\";\nimport { useMemo } from \"react\";\n\nimport { useMessagesForm } from \"@/context/messages-form\";\nimport { cn } from \"@/utils/cn\";\nimport { parseMessageSchema } from \"@/utils/schema\";\nimport { createValidator } from \"@/utils/validate\";\n\nimport { MessageController } from \"../MessageController\";\n\ninterface MessageFieldProps {\n  schema: MessageSchema;\n  messageKey: string;\n  path: string;\n  className?: string;\n}\n\nexport function MessageField({\n  schema,\n  messageKey,\n  path,\n  className,\n}: MessageFieldProps): React.ReactNode {\n  const { locales } = useMessagesForm();\n\n  const config = useMemo(() => parseMessageSchema(schema), [schema]);\n\n  const validator = useMemo(\n    () => createValidator(config.variables),\n    [config.variables],\n  );\n\n  return (\n    <div className={cn(\"\", className)}>\n      {config.description && <p>{config.description}</p>}\n\n      {locales.length === 1 ? (\n        <MessageController\n          className={className}\n          type={config.type}\n          variables={config.variables}\n          locale={locales[0]}\n          name={[locales[0], path, messageKey].join(\".\")}\n          validate={validator}\n        />\n      ) : (\n        <div\n          className={cn(\"-mx-3 flex min-w-0 gap-4 px-3\", {\n            \"overflow-x-auto\": config.type === \"icu\",\n            // \"flex-col\": config.type === \"rich\",\n          })}\n        >\n          {locales.map((locale) => (\n            <MessageController\n              key={locale}\n              className=\"flex-1\"\n              type={config.type}\n              label={locale.toUpperCase()}\n              locale={locale}\n              variables={config.variables}\n              name={[locale, path, messageKey].join(\".\")}\n              validate={validator}\n            />\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["MessageField","schema","messageKey","path","className","locales","useMessagesForm","config","useMemo","parseMessageSchema","validator","createValidator","cn","jsx","MessageController","locale"],"mappings":";;;;;;;AAiBO,SAASA,EAAa;AAAA,EAC3B,QAAAC;AAAA,EACA,YAAAC;AAAA,EACA,MAAAC;AAAA,EACA,WAAAC;AACF,GAAuC;AACrC,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA,GAEdC,IAASC,EAAQ,MAAMC,EAAmBR,CAAM,GAAG,CAACA,CAAM,CAAC,GAE3DS,IAAYF;AAAA,IAChB,MAAMG,EAAgBJ,EAAO,SAAS;AAAA,IACtC,CAACA,EAAO,SAAS;AAAA,EAAA;AAGnB,2BACG,OAAA,EAAI,WAAWK,EAAG,IAAIR,CAAS,GAC7B,UAAA;AAAA,IAAAG,EAAO,eAAe,gBAAAM,EAAC,KAAA,EAAG,UAAAN,EAAO,aAAY;AAAA,IAE7CF,EAAQ,WAAW,IAClB,gBAAAQ;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAAV;AAAA,QACA,MAAMG,EAAO;AAAA,QACb,WAAWA,EAAO;AAAA,QAClB,QAAQF,EAAQ,CAAC;AAAA,QACjB,MAAM,CAACA,EAAQ,CAAC,GAAGF,GAAMD,CAAU,EAAE,KAAK,GAAG;AAAA,QAC7C,UAAUQ;AAAA,MAAA;AAAA,IAAA,IAGZ,gBAAAG;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWD,EAAG,iCAAiC;AAAA,UAC7C,mBAAmBL,EAAO,SAAS;AAAA;AAAA,QAAA,CAEpC;AAAA,QAEA,UAAAF,EAAQ,IAAI,CAACU,MACZ,gBAAAF;AAAA,UAACC;AAAA,UAAA;AAAA,YAEC,WAAU;AAAA,YACV,MAAMP,EAAO;AAAA,YACb,OAAOQ,EAAO,YAAA;AAAA,YACd,QAAAA;AAAA,YACA,WAAWR,EAAO;AAAA,YAClB,MAAM,CAACQ,GAAQZ,GAAMD,CAAU,EAAE,KAAK,GAAG;AAAA,YACzC,UAAUQ;AAAA,UAAA;AAAA,UAPLK;AAAA,QAAA,CASR;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GAEJ;AAEJ;"}
+{"version":3,"file":"MessageField.js","sources":["../../../src/components/layout/MessageField.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { useMessagesForm } from '@/context/messages-form';\nimport type { MessageSchema } from '@/types';\nimport { cn } from '@/utils/cn';\nimport { parseMessageSchema } from '@/utils/schema';\nimport { createValidator } from '@/utils/validate';\n\nimport { MessageController } from '../MessageController';\n\ninterface MessageFieldProps {\n  schema: MessageSchema;\n  messageKey: string;\n  path: string;\n  className?: string;\n}\n\nexport function MessageField({\n  schema,\n  messageKey,\n  path,\n  className,\n}: MessageFieldProps): React.ReactNode {\n  const { locales } = useMessagesForm();\n\n  const config = useMemo(() => parseMessageSchema(schema), [schema]);\n\n  const validator = useMemo(\n    () => createValidator(config.variables),\n    [config.variables],\n  );\n\n  return (\n    <div className={cn('', className)}>\n      {config.description && <p>{config.description}</p>}\n\n      {locales.length === 1 ? (\n        <MessageController\n          className={className}\n          locale={locales[0]}\n          name={[locales[0], path, messageKey].join('.')}\n          type={config.type}\n          validate={validator}\n          variables={config.variables}\n        />\n      ) : (\n        <div\n          className={cn('-mx-3 flex min-w-0 gap-4 px-3', {\n            'overflow-x-auto': config.type === 'icu',\n            // \"flex-col\": config.type === \"rich\",\n          })}\n        >\n          {locales.map((locale) => (\n            <MessageController\n              className=\"flex-1\"\n              key={locale}\n              label={locale.toUpperCase()}\n              locale={locale}\n              name={[locale, path, messageKey].join('.')}\n              type={config.type}\n              validate={validator}\n              variables={config.variables}\n            />\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["MessageField","schema","messageKey","path","className","locales","useMessagesForm","config","useMemo","parseMessageSchema","validator","createValidator","cn","jsx","MessageController","locale"],"mappings":";;;;;;;AAgBO,SAASA,EAAa;AAAA,EAC3B,QAAAC;AAAA,EACA,YAAAC;AAAA,EACA,MAAAC;AAAA,EACA,WAAAC;AACF,GAAuC;AACrC,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA,GAEdC,IAASC,EAAQ,MAAMC,EAAmBR,CAAM,GAAG,CAACA,CAAM,CAAC,GAE3DS,IAAYF;AAAA,IAChB,MAAMG,EAAgBJ,EAAO,SAAS;AAAA,IACtC,CAACA,EAAO,SAAS;AAAA,EAAA;AAGnB,2BACG,OAAA,EAAI,WAAWK,EAAG,IAAIR,CAAS,GAC7B,UAAA;AAAA,IAAAG,EAAO,eAAe,gBAAAM,EAAC,KAAA,EAAG,UAAAN,EAAO,aAAY;AAAA,IAE7CF,EAAQ,WAAW,IAClB,gBAAAQ;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAAV;AAAA,QACA,QAAQC,EAAQ,CAAC;AAAA,QACjB,MAAM,CAACA,EAAQ,CAAC,GAAGF,GAAMD,CAAU,EAAE,KAAK,GAAG;AAAA,QAC7C,MAAMK,EAAO;AAAA,QACb,UAAUG;AAAA,QACV,WAAWH,EAAO;AAAA,MAAA;AAAA,IAAA,IAGpB,gBAAAM;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWD,EAAG,iCAAiC;AAAA,UAC7C,mBAAmBL,EAAO,SAAS;AAAA;AAAA,QAAA,CAEpC;AAAA,QAEA,UAAAF,EAAQ,IAAI,CAACU,MACZ,gBAAAF;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YAEV,OAAOC,EAAO,YAAA;AAAA,YACd,QAAAA;AAAA,YACA,MAAM,CAACA,GAAQZ,GAAMD,CAAU,EAAE,KAAK,GAAG;AAAA,YACzC,MAAMK,EAAO;AAAA,YACb,UAAUG;AAAA,YACV,WAAWH,EAAO;AAAA,UAAA;AAAA,UANbQ;AAAA,QAAA,CAQR;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GAEJ;AAEJ;"}

package/dist/components/layout/MessagesTabs.js

@@ -18,18 +18,18 @@ function N({
   return /* @__PURE__ */ s(
     "div",
     {
+      className: "overflow-x-auto text-nowrap border-border border-b-2 px-4",
       role: "tablist",
-      className: "overflow-x-auto border-b-2 border-border px-4 text-nowrap",
       children: Object.keys(m).map((r) => /* @__PURE__ */ s(
         p,
         {
-          size: "large",
+          buttonStyle: o === r ? "pill" : "tab",
           className: f(
             "my-0 rounded-b-none text-lg",
             i(r) ? o === r ? "bg-error" : "text-error" : void 0
           ),
-          buttonStyle: o === r ? "pill" : "tab",
           onClick: () => n(r),
+          size: "large",
           type: "button",
           children: x(r)
         },

package/dist/components/layout/MessagesTabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessagesTabs.js","sources":["../../../src/components/layout/MessagesTabs.tsx"],"sourcesContent":["import type { MessagesSchema } from \"@/types\";\nimport { Button } from \"@payloadcms/ui\";\nimport { get } from \"lodash-es\";\nimport { useCallback } from \"react\";\nimport { useFormState } from \"react-hook-form\";\n\nimport { useMessagesForm } from \"@/context/messages-form\";\nimport { cn } from \"@/utils/cn\";\nimport { toWords } from \"@/utils/format\";\n\ninterface MessagesTabsProps {\n  schema: MessagesSchema;\n  activeTab: string | undefined;\n  setActiveTab: (tab: string) => void;\n}\n\n// TODO add hash for current tab to url\nexport function MessagesTabs({\n  schema,\n  activeTab,\n  setActiveTab,\n}: MessagesTabsProps): React.ReactNode {\n  const { locales, control } = useMessagesForm();\n  const { errors } = useFormState({ control });\n\n  const hasErrors = useCallback(\n    (key: string) => {\n      return locales.some((locale) => get(errors, [locale, key]) !== undefined);\n    },\n    [errors, locales],\n  );\n\n  return (\n    <div\n      role=\"tablist\"\n      className=\"overflow-x-auto border-b-2 border-border px-4 text-nowrap\"\n    >\n      {Object.keys(schema).map((key) => (\n        <Button\n          key={key}\n          size=\"large\"\n          className={cn(\n            \"my-0 rounded-b-none text-lg\",\n            hasErrors(key)\n              ? activeTab === key\n                ? \"bg-error\"\n                : \"text-error\"\n              : undefined,\n          )}\n          buttonStyle={activeTab === key ? \"pill\" : \"tab\"}\n          onClick={() => setActiveTab(key)}\n          type=\"button\"\n        >\n          {toWords(key)}\n        </Button>\n      ))}\n    </div>\n  );\n}\n"],"names":["MessagesTabs","schema","activeTab","setActiveTab","locales","control","useMessagesForm","errors","useFormState","hasErrors","useCallback","key","locale","get","jsx","Button","cn"],"mappings":";;;;;;;;AAiBO,SAASA,EAAa;AAAA,EAC3B,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AACF,GAAuC;AACrC,QAAM,EAAE,SAAAC,GAAS,SAAAC,EAAA,IAAYC,EAAA,GACvB,EAAE,QAAAC,EAAA,IAAWC,EAAa,EAAE,SAAAH,GAAS,GAErCI,IAAYC;AAAA,IAChB,CAACC,MACQP,EAAQ,KAAK,CAACQ,MAAWC,EAAIN,GAAQ,CAACK,GAAQD,CAAG,CAAC,MAAM,MAAS;AAAA,IAE1E,CAACJ,GAAQH,CAAO;AAAA,EAAA;AAGlB,SACE,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MAET,iBAAO,KAAKb,CAAM,EAAE,IAAI,CAACU,MACxB,gBAAAG;AAAA,QAACC;AAAA,QAAA;AAAA,UAEC,MAAK;AAAA,UACL,WAAWC;AAAA,YACT;AAAA,YACAP,EAAUE,CAAG,IACTT,MAAcS,IACZ,aACA,eACF;AAAA,UAAA;AAAA,UAEN,aAAaT,MAAcS,IAAM,SAAS;AAAA,UAC1C,SAAS,MAAMR,EAAaQ,CAAG;AAAA,UAC/B,MAAK;AAAA,UAEJ,YAAQA,CAAG;AAAA,QAAA;AAAA,QAdPA;AAAA,MAAA,CAgBR;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"MessagesTabs.js","sources":["../../../src/components/layout/MessagesTabs.tsx"],"sourcesContent":["import { Button } from '@payloadcms/ui';\nimport { get } from 'lodash-es';\nimport { useCallback } from 'react';\nimport { useFormState } from 'react-hook-form';\nimport { useMessagesForm } from '@/context/messages-form';\nimport type { MessagesSchema } from '@/types';\nimport { cn } from '@/utils/cn';\nimport { toWords } from '@/utils/format';\n\ninterface MessagesTabsProps {\n  schema: MessagesSchema;\n  activeTab: string | undefined;\n  setActiveTab: (tab: string) => void;\n}\n\n// TODO add hash for current tab to url\nexport function MessagesTabs({\n  schema,\n  activeTab,\n  setActiveTab,\n}: MessagesTabsProps): React.ReactNode {\n  const { locales, control } = useMessagesForm();\n  const { errors } = useFormState({ control });\n\n  const hasErrors = useCallback(\n    (key: string) => {\n      return locales.some((locale) => get(errors, [locale, key]) !== undefined);\n    },\n    [errors, locales],\n  );\n\n  return (\n    <div\n      className=\"overflow-x-auto text-nowrap border-border border-b-2 px-4\"\n      role=\"tablist\"\n    >\n      {Object.keys(schema).map((key) => (\n        <Button\n          buttonStyle={activeTab === key ? 'pill' : 'tab'}\n          className={cn(\n            'my-0 rounded-b-none text-lg',\n            hasErrors(key)\n              ? activeTab === key\n                ? 'bg-error'\n                : 'text-error'\n              : undefined,\n          )}\n          key={key}\n          onClick={() => setActiveTab(key)}\n          size=\"large\"\n          type=\"button\"\n        >\n          {toWords(key)}\n        </Button>\n      ))}\n    </div>\n  );\n}\n"],"names":["MessagesTabs","schema","activeTab","setActiveTab","locales","control","useMessagesForm","errors","useFormState","hasErrors","useCallback","key","locale","get","jsx","Button","cn"],"mappings":";;;;;;;;AAgBO,SAASA,EAAa;AAAA,EAC3B,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AACF,GAAuC;AACrC,QAAM,EAAE,SAAAC,GAAS,SAAAC,EAAA,IAAYC,EAAA,GACvB,EAAE,QAAAC,EAAA,IAAWC,EAAa,EAAE,SAAAH,GAAS,GAErCI,IAAYC;AAAA,IAChB,CAACC,MACQP,EAAQ,KAAK,CAACQ,MAAWC,EAAIN,GAAQ,CAACK,GAAQD,CAAG,CAAC,MAAM,MAAS;AAAA,IAE1E,CAACJ,GAAQH,CAAO;AAAA,EAAA;AAGlB,SACE,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,MAAK;AAAA,MAEJ,iBAAO,KAAKb,CAAM,EAAE,IAAI,CAACU,MACxB,gBAAAG;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,aAAab,MAAcS,IAAM,SAAS;AAAA,UAC1C,WAAWK;AAAA,YACT;AAAA,YACAP,EAAUE,CAAG,IACTT,MAAcS,IACZ,aACA,eACF;AAAA,UAAA;AAAA,UAGN,SAAS,MAAMR,EAAaQ,CAAG;AAAA,UAC/B,MAAK;AAAA,UACL,MAAK;AAAA,UAEJ,YAAQA,CAAG;AAAA,QAAA;AAAA,QALPA;AAAA,MAAA,CAOR;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/layout/MessagesTree.js

@@ -43,9 +43,9 @@ function j({
             b,
             {
               className: "min-w-0",
-              schema: s,
               messageKey: r,
-              path: o
+              path: o,
+              schema: s
             },
             r
           ) : /* @__PURE__ */ e(

package/dist/components/layout/MessagesTree.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessagesTree.js","sources":["../../../src/components/layout/MessagesTree.tsx"],"sourcesContent":["import type { Messages } from \"@/types\";\nimport { Collapsible } from \"@payloadcms/ui\";\nimport { get } from \"lodash-es\";\nimport { useCallback } from \"react\";\nimport { useFormState } from \"react-hook-form\";\n\nimport { useMessagesForm } from \"@/context/messages-form\";\nimport { cn } from \"@/utils/cn\";\nimport { toWords } from \"@/utils/format\";\n\nimport { MessageField } from \"./MessageField\";\n\ninterface MessagesTreeProps {\n  path: string;\n  nestingLevel: number;\n  schema: Messages;\n  className?: string;\n}\n\n// TODO fix sticky position on single locale form\n\nexport function MessagesTree({\n  path,\n  schema,\n  nestingLevel = 0,\n  className,\n}: MessagesTreeProps): React.ReactNode {\n  const { control, locales } = useMessagesForm();\n  const { errors } = useFormState({ control });\n\n  const hasErrors = useCallback(\n    (key: string) => {\n      return locales.some(\n        (locale) => get(errors, [locale, path, key].join(\".\")) !== undefined,\n      );\n    },\n    [errors, locales, path],\n  );\n\n  return (\n    <div className={cn(\"grid gap-6\", className)}>\n      {Object.entries(schema).map(([key, value]) => (\n        <div\n          key={key}\n          className=\"grid min-w-0\"\n          style={\n            {\n              [\"--nesting-level\"]: nestingLevel,\n            } as React.CSSProperties\n          }\n        >\n          <Collapsible\n            className=\"messages-tree-collapsible min-w-0\"\n            header={\n              <span\n                className={cn(\"text-xl\", {\n                  \"text-error\": hasErrors(key),\n                })}\n              >\n                {toWords(key)}\n              </span>\n            }\n          >\n            {typeof value === \"string\" ? (\n              <MessageField\n                className=\"min-w-0\"\n                schema={value}\n                key={key}\n                messageKey={key}\n                path={path}\n              />\n            ) : (\n              <MessagesTree\n                nestingLevel={nestingLevel + 1}\n                path={[path, key].join(\".\")}\n                schema={value}\n              />\n            )}\n          </Collapsible>\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"names":["MessagesTree","path","schema","nestingLevel","className","control","locales","useMessagesForm","errors","useFormState","hasErrors","useCallback","key","locale","get","cn","value","jsx","Collapsible","MessageField"],"mappings":";;;;;;;;;AAqBO,SAASA,EAAa;AAAA,EAC3B,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,WAAAC;AACF,GAAuC;AACrC,QAAM,EAAE,SAAAC,GAAS,SAAAC,EAAA,IAAYC,EAAA,GACvB,EAAE,QAAAC,EAAA,IAAWC,EAAa,EAAE,SAAAJ,GAAS,GAErCK,IAAYC;AAAA,IAChB,CAACC,MACQN,EAAQ;AAAA,MACb,CAACO,MAAWC,EAAIN,GAAQ,CAACK,GAAQZ,GAAMW,CAAG,EAAE,KAAK,GAAG,CAAC,MAAM;AAAA,IAAA;AAAA,IAG/D,CAACJ,GAAQF,GAASL,CAAI;AAAA,EAAA;AAGxB,2BACG,OAAA,EAAI,WAAWc,EAAG,cAAcX,CAAS,GACvC,UAAA,OAAO,QAAQF,CAAM,EAAE,IAAI,CAAC,CAACU,GAAKI,CAAK,MACtC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MAEC,WAAU;AAAA,MACV,OACE;AAAA,QACG,mBAAoBd;AAAA,MAAA;AAAA,MAIzB,UAAA,gBAAAc;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,QACE,gBAAAD;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWF,EAAG,WAAW;AAAA,gBACvB,cAAcL,EAAUE,CAAG;AAAA,cAAA,CAC5B;AAAA,cAEA,YAAQA,CAAG;AAAA,YAAA;AAAA,UAAA;AAAA,UAIf,UAAA,OAAOI,KAAU,WAChB,gBAAAC;AAAA,YAACE;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,QAAQH;AAAA,cAER,YAAYJ;AAAA,cACZ,MAAAX;AAAA,YAAA;AAAA,YAFKW;AAAA,UAAA,IAKP,gBAAAK;AAAA,YAACjB;AAAA,YAAA;AAAA,cACC,cAAcG,IAAe;AAAA,cAC7B,MAAM,CAACF,GAAMW,CAAG,EAAE,KAAK,GAAG;AAAA,cAC1B,QAAQI;AAAA,YAAA;AAAA,UAAA;AAAA,QACV;AAAA,MAAA;AAAA,IAEJ;AAAA,IAnCKJ;AAAA,EAAA,CAqCR,GACH;AAEJ;"}
+{"version":3,"file":"MessagesTree.js","sources":["../../../src/components/layout/MessagesTree.tsx"],"sourcesContent":["import { Collapsible } from '@payloadcms/ui';\nimport { get } from 'lodash-es';\nimport { useCallback } from 'react';\nimport { useFormState } from 'react-hook-form';\nimport { useMessagesForm } from '@/context/messages-form';\nimport type { Messages } from '@/types';\nimport { cn } from '@/utils/cn';\nimport { toWords } from '@/utils/format';\n\nimport { MessageField } from './MessageField';\n\ninterface MessagesTreeProps {\n  path: string;\n  nestingLevel: number;\n  schema: Messages;\n  className?: string;\n}\n\n// TODO fix sticky position on single locale form\n\nexport function MessagesTree({\n  path,\n  schema,\n  nestingLevel = 0,\n  className,\n}: MessagesTreeProps): React.ReactNode {\n  const { control, locales } = useMessagesForm();\n  const { errors } = useFormState({ control });\n\n  const hasErrors = useCallback(\n    (key: string) => {\n      return locales.some(\n        (locale) => get(errors, [locale, path, key].join('.')) !== undefined,\n      );\n    },\n    [errors, locales, path],\n  );\n\n  return (\n    <div className={cn('grid gap-6', className)}>\n      {Object.entries(schema).map(([key, value]) => (\n        <div\n          className=\"grid min-w-0\"\n          key={key}\n          style={\n            {\n              ['--nesting-level']: nestingLevel,\n            } as React.CSSProperties\n          }\n        >\n          <Collapsible\n            className=\"messages-tree-collapsible min-w-0\"\n            header={\n              <span\n                className={cn('text-xl', {\n                  'text-error': hasErrors(key),\n                })}\n              >\n                {toWords(key)}\n              </span>\n            }\n          >\n            {typeof value === 'string' ? (\n              <MessageField\n                className=\"min-w-0\"\n                key={key}\n                messageKey={key}\n                path={path}\n                schema={value}\n              />\n            ) : (\n              <MessagesTree\n                nestingLevel={nestingLevel + 1}\n                path={[path, key].join('.')}\n                schema={value}\n              />\n            )}\n          </Collapsible>\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"names":["MessagesTree","path","schema","nestingLevel","className","control","locales","useMessagesForm","errors","useFormState","hasErrors","useCallback","key","locale","get","cn","value","jsx","Collapsible","MessageField"],"mappings":";;;;;;;;;AAoBO,SAASA,EAAa;AAAA,EAC3B,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,WAAAC;AACF,GAAuC;AACrC,QAAM,EAAE,SAAAC,GAAS,SAAAC,EAAA,IAAYC,EAAA,GACvB,EAAE,QAAAC,EAAA,IAAWC,EAAa,EAAE,SAAAJ,GAAS,GAErCK,IAAYC;AAAA,IAChB,CAACC,MACQN,EAAQ;AAAA,MACb,CAACO,MAAWC,EAAIN,GAAQ,CAACK,GAAQZ,GAAMW,CAAG,EAAE,KAAK,GAAG,CAAC,MAAM;AAAA,IAAA;AAAA,IAG/D,CAACJ,GAAQF,GAASL,CAAI;AAAA,EAAA;AAGxB,2BACG,OAAA,EAAI,WAAWc,EAAG,cAAcX,CAAS,GACvC,UAAA,OAAO,QAAQF,CAAM,EAAE,IAAI,CAAC,CAACU,GAAKI,CAAK,MACtC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MAEV,OACE;AAAA,QACG,mBAAoBd;AAAA,MAAA;AAAA,MAIzB,UAAA,gBAAAc;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,QACE,gBAAAD;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWF,EAAG,WAAW;AAAA,gBACvB,cAAcL,EAAUE,CAAG;AAAA,cAAA,CAC5B;AAAA,cAEA,YAAQA,CAAG;AAAA,YAAA;AAAA,UAAA;AAAA,UAIf,UAAA,OAAOI,KAAU,WAChB,gBAAAC;AAAA,YAACE;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cAEV,YAAYP;AAAA,cACZ,MAAAX;AAAA,cACA,QAAQe;AAAA,YAAA;AAAA,YAHHJ;AAAA,UAAA,IAMP,gBAAAK;AAAA,YAACjB;AAAA,YAAA;AAAA,cACC,cAAcG,IAAe;AAAA,cAC7B,MAAM,CAACF,GAAMW,CAAG,EAAE,KAAK,GAAG;AAAA,cAC1B,QAAQI;AAAA,YAAA;AAAA,UAAA;AAAA,QACV;AAAA,MAAA;AAAA,IAEJ;AAAA,IAlCKJ;AAAA,EAAA,CAoCR,GACH;AAEJ;"}

package/dist/const.js

@@ -0,0 +1,14 @@
+const t = {
+  setMessages: {
+    path: "/intl-plugin",
+    method: "put"
+  },
+  getMessages: {
+    path: "/intl-plugin/:locale",
+    method: "get"
+  }
+};
+export {
+  t as ENDPOINT_CONFIG
+};
+//# sourceMappingURL=const.js.map

package/dist/const.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"const.js","sources":["../src/const.ts"],"sourcesContent":["import type { Endpoint } from 'payload';\n\nexport const ENDPOINT_CONFIG = {\n  setMessages: {\n    path: '/intl-plugin',\n    method: 'put',\n  },\n  getMessages: {\n    path: '/intl-plugin/:locale',\n    method: 'get',\n  },\n} satisfies Record<string, Pick<Endpoint, 'path' | 'method'>>;\n"],"names":["ENDPOINT_CONFIG"],"mappings":"AAEO,MAAMA,IAAkB;AAAA,EAC7B,aAAa;AAAA,IACX,MAAM;AAAA,IACN,QAAQ;AAAA,EAAA;AAAA,EAEV,aAAa;AAAA,IACX,MAAM;AAAA,IACN,QAAQ;AAAA,EAAA;AAEZ;"}

package/dist/context/messages-form.js.map

@@ -1 +1 @@
-{"version":3,"file":"messages-form.js","sources":["../../src/context/messages-form.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Locales, Messages, Translations } from \"@/types\";\nimport type { UseFormReturn } from \"react-hook-form\";\nimport { createContext, use } from \"react\";\nimport { FormProvider, useFormContext } from \"react-hook-form\";\n\nexport type FormValues = Translations<Messages>;\n\nconst MessagesFormContext = createContext<{\n  locales: Locales;\n}>({\n  locales: [\"en\"],\n});\n\ninterface MessagesFormProviderProps {\n  locales: Locales;\n  form: UseFormReturn<FormValues>;\n}\n\nexport function MessagesFormProvider({\n  locales,\n  form,\n  children,\n}: React.PropsWithChildren<MessagesFormProviderProps>) {\n  return (\n    <MessagesFormContext value={{ locales }}>\n      <FormProvider {...form}>{children}</FormProvider>\n    </MessagesFormContext>\n  );\n}\n\nexport const useMessagesForm = () => {\n  const context = use(MessagesFormContext);\n  const form = useFormContext<FormValues>();\n  return {\n    ...context,\n    ...form,\n  };\n};\n"],"names":["MessagesFormContext","createContext","MessagesFormProvider","locales","form","children","jsx","FormProvider","useMessagesForm","context","use","useFormContext"],"mappings":";;;;AASA,MAAMA,IAAsBC,EAEzB;AAAA,EACD,SAAS,CAAC,IAAI;AAChB,CAAC;AAOM,SAASC,EAAqB;AAAA,EACnC,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AACF,GAAuD;AACrD,SACE,gBAAAC,EAACN,GAAA,EAAoB,OAAO,EAAE,SAAAG,EAAA,GAC5B,UAAA,gBAAAG,EAACC,GAAA,EAAc,GAAGH,GAAO,UAAAC,EAAA,CAAS,EAAA,CACpC;AAEJ;AAEO,MAAMG,IAAkB,MAAM;AACnC,QAAMC,IAAUC,EAAIV,CAAmB,GACjCI,IAAOO,EAAA;AACb,SAAO;AAAA,IACL,GAAGF;AAAA,IACH,GAAGL;AAAA,EAAA;AAEP;"}
+{"version":3,"file":"messages-form.js","sources":["../../src/context/messages-form.tsx"],"sourcesContent":["'use client';\n\nimport { createContext, use } from 'react';\nimport type { UseFormReturn } from 'react-hook-form';\nimport { FormProvider, useFormContext } from 'react-hook-form';\nimport type { Locales, Messages, Translations } from '@/types';\n\nexport type FormValues = Translations<Messages>;\n\nconst MessagesFormContext = createContext<{\n  locales: Locales;\n}>({\n  locales: ['en'],\n});\n\ninterface MessagesFormProviderProps {\n  locales: Locales;\n  form: UseFormReturn<FormValues>;\n}\n\nexport function MessagesFormProvider({\n  locales,\n  form,\n  children,\n}: React.PropsWithChildren<MessagesFormProviderProps>) {\n  return (\n    <MessagesFormContext value={{ locales }}>\n      <FormProvider {...form}>{children}</FormProvider>\n    </MessagesFormContext>\n  );\n}\n\nexport const useMessagesForm = () => {\n  const context = use(MessagesFormContext);\n  const form = useFormContext<FormValues>();\n  return {\n    ...context,\n    ...form,\n  };\n};\n"],"names":["MessagesFormContext","createContext","MessagesFormProvider","locales","form","children","jsx","FormProvider","useMessagesForm","context","use","useFormContext"],"mappings":";;;;AASA,MAAMA,IAAsBC,EAEzB;AAAA,EACD,SAAS,CAAC,IAAI;AAChB,CAAC;AAOM,SAASC,EAAqB;AAAA,EACnC,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AACF,GAAuD;AACrD,SACE,gBAAAC,EAACN,GAAA,EAAoB,OAAO,EAAE,SAAAG,EAAA,GAC5B,UAAA,gBAAAG,EAACC,GAAA,EAAc,GAAGH,GAAO,UAAAC,EAAA,CAAS,EAAA,CACpC;AAEJ;AAEO,MAAMG,IAAkB,MAAM;AACnC,QAAMC,IAAUC,EAAIV,CAAmB,GACjCI,IAAOO,EAAA;AACb,SAAO;AAAA,IACL,GAAGF;AAAA,IACH,GAAGL;AAAA,EAAA;AAEP;"}

package/dist/endpoints/get-messages.js

@@ -1,13 +1,13 @@
-import { fetchMessages as a } from "../requests/fetchMessages.js";
-const n = {
-  handler: async (e) => {
-    const { locale: s } = e.routeParams, t = await a(e.payload, s);
-    return Response.json(t);
-  },
-  method: "get",
-  path: "/intl-plugin/:locale"
+import { ENDPOINT_CONFIG as a } from "../const.js";
+import { fetchMessages as t } from "../requests/fetchMessages.js";
+const c = {
+  ...a.getMessages,
+  handler: async (s) => {
+    const { locale: e } = s.routeParams, o = await t(s.payload, e);
+    return Response.json(o);
+  }
 };
 export {
-  n as getMessagesEndpoint
+  c as getMessagesEndpoint
 };
 //# sourceMappingURL=get-messages.js.map

package/dist/endpoints/get-messages.js.map

@@ -1 +1 @@
-{"version":3,"file":"get-messages.js","sources":["../../src/endpoints/get-messages.ts"],"sourcesContent":["import type { Endpoint, PayloadRequest } from \"payload\";\n\nimport { fetchMessages } from \"../requests/fetchMessages\";\n\nexport const getMessagesEndpoint: Endpoint = {\n  handler: async (req: PayloadRequest) => {\n    const { locale } = req.routeParams as { locale: string };\n    const messages = await fetchMessages(req.payload, locale);\n    return Response.json(messages);\n  },\n  method: \"get\",\n  path: \"/intl-plugin/:locale\",\n};\n"],"names":["getMessagesEndpoint","req","locale","messages","fetchMessages"],"mappings":";AAIO,MAAMA,IAAgC;AAAA,EAC3C,SAAS,OAAOC,MAAwB;AACtC,UAAM,EAAE,QAAAC,MAAWD,EAAI,aACjBE,IAAW,MAAMC,EAAcH,EAAI,SAASC,CAAM;AACxD,WAAO,SAAS,KAAKC,CAAQ;AAAA,EAC/B;AAAA,EACA,QAAQ;AAAA,EACR,MAAM;AACR;"}
+{"version":3,"file":"get-messages.js","sources":["../../src/endpoints/get-messages.ts"],"sourcesContent":["import type { Endpoint, PayloadRequest } from 'payload';\nimport { ENDPOINT_CONFIG } from '@/const';\nimport { fetchMessages } from '../requests/fetchMessages';\n\nexport const getMessagesEndpoint: Endpoint = {\n  ...ENDPOINT_CONFIG.getMessages,\n  handler: async (req: PayloadRequest) => {\n    const { locale } = req.routeParams as { locale: string };\n    const messages = await fetchMessages(req.payload, locale);\n    return Response.json(messages);\n  },\n};\n"],"names":["getMessagesEndpoint","ENDPOINT_CONFIG","req","locale","messages","fetchMessages"],"mappings":";;AAIO,MAAMA,IAAgC;AAAA,EAC3C,GAAGC,EAAgB;AAAA,EACnB,SAAS,OAAOC,MAAwB;AACtC,UAAM,EAAE,QAAAC,MAAWD,EAAI,aACjBE,IAAW,MAAMC,EAAcH,EAAI,SAASC,CAAM;AACxD,WAAO,SAAS,KAAKC,CAAQ;AAAA,EAC/B;AACF;"}

package/dist/endpoints/set-messages.js

@@ -1,47 +1,47 @@
-import { getSupportedLocales as p, getPluginContext as d } from "../utils/config.js";
-const f = {
-  handler: async (a) => {
-    const { user: c } = await a.payload.auth({ headers: a.headers });
+import { ENDPOINT_CONFIG as d } from "../const.js";
+import { getSupportedLocales as p, getPluginContext as f } from "../utils/config.js";
+const g = {
+  ...d.setMessages,
+  handler: async (o) => {
+    const { user: c } = await o.payload.auth({ headers: o.headers });
     if (!c)
       throw new Error("Unauthorized");
-    const e = await a.json?.();
-    if (!e)
+    const t = await o.json?.();
+    if (!t)
       throw new Error("No data provided");
     const l = p(
-      a.payload.config.localization
-    ), { collectionSlug: n } = d(a.payload.config);
-    for (const o of l) {
-      const s = e[o];
-      if (!s) continue;
-      const t = new File(
-        [JSON.stringify(s)],
-        `${o}-${Date.now()}.json`,
+      o.payload.config.localization
+    ), { collectionSlug: s } = f(o.payload.config);
+    for (const a of l) {
+      const n = t[a];
+      if (!n) continue;
+      const e = new File(
+        [JSON.stringify(n)],
+        `${a}-${Date.now()}.json`,
         {
           type: "application/json"
         }
       ), i = {
-        name: t.name,
-        data: Buffer.from(await t.arrayBuffer()),
-        mimetype: t.type,
-        size: t.size
-      }, { docs: r } = await a.payload.update({
-        collection: n,
+        name: e.name,
+        data: Buffer.from(await e.arrayBuffer()),
+        mimetype: e.type,
+        size: e.size
+      }, { docs: r } = await o.payload.update({
+        collection: s,
         data: {},
         file: i,
-        where: { locale: { equals: o } }
+        where: { locale: { equals: a } }
       });
-      r.length === 0 && await a.payload.create({
-        collection: n,
-        data: { locale: o },
+      r.length === 0 && await o.payload.create({
+        collection: s,
+        data: { locale: a },
         file: i
       });
     }
     return Response.json({ success: !0 });
-  },
-  method: "put",
-  path: "/intl-plugin"
+  }
 };
 export {
-  f as setMessagesEndpoint
+  g as setMessagesEndpoint
 };
 //# sourceMappingURL=set-messages.js.map

package/dist/endpoints/set-messages.js.map

@@ -1 +1 @@
-{"version":3,"file":"set-messages.js","sources":["../../src/endpoints/set-messages.ts"],"sourcesContent":["import type { Messages, Translations } from \"@/types\";\nimport type { Endpoint, File, PayloadRequest } from \"payload\";\n\nimport { getPluginContext, getSupportedLocales } from \"@/utils/config\";\n\nexport const setMessagesEndpoint: Endpoint = {\n  handler: async (req: PayloadRequest) => {\n    const { user } = await req.payload.auth({ headers: req.headers });\n    if (!user) {\n      throw new Error(\"Unauthorized\");\n    }\n\n    const data = (await req.json?.()) as Translations<Messages> | undefined;\n    if (!data) {\n      throw new Error(\"No data provided\");\n    }\n\n    const supportedLocales = getSupportedLocales(\n      req.payload.config.localization,\n    );\n    const { collectionSlug } = getPluginContext(req.payload.config);\n\n    for (const locale of supportedLocales) {\n      const messages = data[locale];\n      if (!messages) continue;\n\n      const rawFile = new File(\n        [JSON.stringify(messages)],\n        `${locale}-${Date.now()}.json`,\n        {\n          type: \"application/json\",\n        },\n      );\n\n      const file: File = {\n        name: rawFile.name,\n        data: Buffer.from(await rawFile.arrayBuffer()),\n        mimetype: rawFile.type,\n        size: rawFile.size,\n      };\n\n      const { docs } = await req.payload.update({\n        collection: collectionSlug,\n        data: {},\n        file,\n        where: { locale: { equals: locale } },\n      });\n      if (docs.length === 0) {\n        await req.payload.create({\n          collection: collectionSlug,\n          data: { locale },\n          file,\n        });\n      }\n    }\n\n    return Response.json({ success: true });\n  },\n  method: \"put\",\n  path: \"/intl-plugin\",\n};\n"],"names":["setMessagesEndpoint","req","user","data","supportedLocales","getSupportedLocales","collectionSlug","getPluginContext","locale","messages","rawFile","file","docs"],"mappings":";AAKO,MAAMA,IAAgC;AAAA,EAC3C,SAAS,OAAOC,MAAwB;AACtC,UAAM,EAAE,MAAAC,MAAS,MAAMD,EAAI,QAAQ,KAAK,EAAE,SAASA,EAAI,SAAS;AAChE,QAAI,CAACC;AACH,YAAM,IAAI,MAAM,cAAc;AAGhC,UAAMC,IAAQ,MAAMF,EAAI,OAAA;AACxB,QAAI,CAACE;AACH,YAAM,IAAI,MAAM,kBAAkB;AAGpC,UAAMC,IAAmBC;AAAA,MACvBJ,EAAI,QAAQ,OAAO;AAAA,IAAA,GAEf,EAAE,gBAAAK,EAAA,IAAmBC,EAAiBN,EAAI,QAAQ,MAAM;AAE9D,eAAWO,KAAUJ,GAAkB;AACrC,YAAMK,IAAWN,EAAKK,CAAM;AAC5B,UAAI,CAACC,EAAU;AAEf,YAAMC,IAAU,IAAI;AAAA,QAClB,CAAC,KAAK,UAAUD,CAAQ,CAAC;AAAA,QACzB,GAAGD,CAAM,IAAI,KAAK,KAAK;AAAA,QACvB;AAAA,UACE,MAAM;AAAA,QAAA;AAAA,MACR,GAGIG,IAAa;AAAA,QACjB,MAAMD,EAAQ;AAAA,QACd,MAAM,OAAO,KAAK,MAAMA,EAAQ,aAAa;AAAA,QAC7C,UAAUA,EAAQ;AAAA,QAClB,MAAMA,EAAQ;AAAA,MAAA,GAGV,EAAE,MAAAE,EAAA,IAAS,MAAMX,EAAI,QAAQ,OAAO;AAAA,QACxC,YAAYK;AAAA,QACZ,MAAM,CAAA;AAAA,QACN,MAAAK;AAAA,QACA,OAAO,EAAE,QAAQ,EAAE,QAAQH,IAAO;AAAA,MAAE,CACrC;AACD,MAAII,EAAK,WAAW,KAClB,MAAMX,EAAI,QAAQ,OAAO;AAAA,QACvB,YAAYK;AAAA,QACZ,MAAM,EAAE,QAAAE,EAAA;AAAA,QACR,MAAAG;AAAA,MAAA,CACD;AAAA,IAEL;AAEA,WAAO,SAAS,KAAK,EAAE,SAAS,IAAM;AAAA,EACxC;AAAA,EACA,QAAQ;AAAA,EACR,MAAM;AACR;"}
+{"version":3,"file":"set-messages.js","sources":["../../src/endpoints/set-messages.ts"],"sourcesContent":["import type { Endpoint, File, PayloadRequest } from 'payload';\nimport { ENDPOINT_CONFIG } from '@/const';\nimport type { Messages, Translations } from '@/types';\nimport { getPluginContext, getSupportedLocales } from '@/utils/config';\n\nexport const setMessagesEndpoint: Endpoint = {\n  ...ENDPOINT_CONFIG.setMessages,\n  handler: async (req: PayloadRequest) => {\n    const { user } = await req.payload.auth({ headers: req.headers });\n    if (!user) {\n      throw new Error('Unauthorized');\n    }\n\n    const data = (await req.json?.()) as Translations<Messages> | undefined;\n    if (!data) {\n      throw new Error('No data provided');\n    }\n\n    const supportedLocales = getSupportedLocales(\n      req.payload.config.localization,\n    );\n    const { collectionSlug } = getPluginContext(req.payload.config);\n\n    for (const locale of supportedLocales) {\n      const messages = data[locale];\n      if (!messages) continue;\n\n      const rawFile = new File(\n        [JSON.stringify(messages)],\n        `${locale}-${Date.now()}.json`,\n        {\n          type: 'application/json',\n        },\n      );\n\n      const file: File = {\n        name: rawFile.name,\n        data: Buffer.from(await rawFile.arrayBuffer()),\n        mimetype: rawFile.type,\n        size: rawFile.size,\n      };\n\n      const { docs } = await req.payload.update({\n        collection: collectionSlug,\n        data: {},\n        file,\n        where: { locale: { equals: locale } },\n      });\n      if (docs.length === 0) {\n        await req.payload.create({\n          collection: collectionSlug,\n          data: { locale },\n          file,\n        });\n      }\n    }\n\n    return Response.json({ success: true });\n  },\n};\n"],"names":["setMessagesEndpoint","ENDPOINT_CONFIG","req","user","data","supportedLocales","getSupportedLocales","collectionSlug","getPluginContext","locale","messages","rawFile","file","docs"],"mappings":";;AAKO,MAAMA,IAAgC;AAAA,EAC3C,GAAGC,EAAgB;AAAA,EACnB,SAAS,OAAOC,MAAwB;AACtC,UAAM,EAAE,MAAAC,MAAS,MAAMD,EAAI,QAAQ,KAAK,EAAE,SAASA,EAAI,SAAS;AAChE,QAAI,CAACC;AACH,YAAM,IAAI,MAAM,cAAc;AAGhC,UAAMC,IAAQ,MAAMF,EAAI,OAAA;AACxB,QAAI,CAACE;AACH,YAAM,IAAI,MAAM,kBAAkB;AAGpC,UAAMC,IAAmBC;AAAA,MACvBJ,EAAI,QAAQ,OAAO;AAAA,IAAA,GAEf,EAAE,gBAAAK,EAAA,IAAmBC,EAAiBN,EAAI,QAAQ,MAAM;AAE9D,eAAWO,KAAUJ,GAAkB;AACrC,YAAMK,IAAWN,EAAKK,CAAM;AAC5B,UAAI,CAACC,EAAU;AAEf,YAAMC,IAAU,IAAI;AAAA,QAClB,CAAC,KAAK,UAAUD,CAAQ,CAAC;AAAA,QACzB,GAAGD,CAAM,IAAI,KAAK,KAAK;AAAA,QACvB;AAAA,UACE,MAAM;AAAA,QAAA;AAAA,MACR,GAGIG,IAAa;AAAA,QACjB,MAAMD,EAAQ;AAAA,QACd,MAAM,OAAO,KAAK,MAAMA,EAAQ,aAAa;AAAA,QAC7C,UAAUA,EAAQ;AAAA,QAClB,MAAMA,EAAQ;AAAA,MAAA,GAGV,EAAE,MAAAE,EAAA,IAAS,MAAMX,EAAI,QAAQ,OAAO;AAAA,QACxC,YAAYK;AAAA,QACZ,MAAM,CAAA;AAAA,QACN,MAAAK;AAAA,QACA,OAAO,EAAE,QAAQ,EAAE,QAAQH,IAAO;AAAA,MAAE,CACrC;AACD,MAAII,EAAK,WAAW,KAClB,MAAMX,EAAI,QAAQ,OAAO;AAAA,QACvB,YAAYK;AAAA,QACZ,MAAM,EAAE,QAAAE,EAAA;AAAA,QACR,MAAAG;AAAA,MAAA,CACD;AAAA,IAEL;AAEA,WAAO,SAAS,KAAK,EAAE,SAAS,IAAM;AAAA,EACxC;AACF;"}

package/dist/exports/link.js.map

@@ -1 +1 @@
-{"version":3,"file":"link.js","sources":["../../src/exports/link.tsx"],"sourcesContent":["import type { PayloadRequest } from \"payload\";\nimport { Button } from \"@payloadcms/ui\";\nimport { IconWorld } from \"@tabler/icons-react\";\n\nimport { type MessagesGuard } from \"@/types\";\n\nexport interface MessagesLinkProps {\n  access?: MessagesGuard;\n  req: PayloadRequest;\n}\n\nexport async function MessagesLink({\n  access = () => true,\n  req,\n}: MessagesLinkProps) {\n  const hasAccess = await access(req);\n  if (!hasAccess) return null;\n\n  return (\n    <Button\n      buttonStyle=\"tab\"\n      el=\"link\"\n      to={`${req.payload.getAdminURL()}/intl`}\n    >\n      <IconWorld />\n    </Button>\n  );\n}\n"],"names":["MessagesLink","access","req","jsx","Button","IconWorld"],"mappings":";;;AAWA,eAAsBA,EAAa;AAAA,EACjC,QAAAC,IAAS,MAAM;AAAA,EACf,KAAAC;AACF,GAAsB;AAEpB,SADkB,MAAMD,EAAOC,CAAG,IAIhC,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAY;AAAA,MACZ,IAAG;AAAA,MACH,IAAI,GAAGF,EAAI,QAAQ,aAAa;AAAA,MAEhC,4BAACG,GAAA,CAAA,CAAU;AAAA,IAAA;AAAA,EAAA,IARQ;AAWzB;"}
+{"version":3,"file":"link.js","sources":["../../src/exports/link.tsx"],"sourcesContent":["import { Button } from '@payloadcms/ui';\nimport { IconWorld } from '@tabler/icons-react';\nimport type { PayloadRequest } from 'payload';\n\nimport type { MessagesGuard } from '@/types';\n\nexport interface MessagesLinkProps {\n  access?: MessagesGuard;\n  req: PayloadRequest;\n}\n\nexport async function MessagesLink({\n  access = () => true,\n  req,\n}: MessagesLinkProps) {\n  const hasAccess = await access(req);\n  if (!hasAccess) return null;\n\n  return (\n    <Button\n      buttonStyle=\"tab\"\n      el=\"link\"\n      to={`${req.payload.getAdminURL()}/intl`}\n    >\n      <IconWorld />\n    </Button>\n  );\n}\n"],"names":["MessagesLink","access","req","jsx","Button","IconWorld"],"mappings":";;;AAWA,eAAsBA,EAAa;AAAA,EACjC,QAAAC,IAAS,MAAM;AAAA,EACf,KAAAC;AACF,GAAsB;AAEpB,SADkB,MAAMD,EAAOC,CAAG,IAIhC,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAY;AAAA,MACZ,IAAG;AAAA,MACH,IAAI,GAAGF,EAAI,QAAQ,aAAa;AAAA,MAEhC,4BAACG,GAAA,CAAA,CAAU;AAAA,IAAA;AAAA,EAAA,IARQ;AAWzB;"}