payload-intl 0.0.3 → 0.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (68) hide show
  1. package/dist/components/MessageController.js +29 -28
  2. package/dist/components/MessageController.js.map +1 -1
  3. package/dist/components/MessagesForm.js +92 -77
  4. package/dist/components/MessagesForm.js.map +1 -1
  5. package/dist/components/actions/JsonImport.d.ts +1 -1
  6. package/dist/components/actions/JsonImport.js +57 -51
  7. package/dist/components/actions/JsonImport.js.map +1 -1
  8. package/dist/components/actions/Move.d.ts +1 -1
  9. package/dist/components/inputs/InputWrapper.d.ts +1 -1
  10. package/dist/components/inputs/InputWrapper.js +24 -18
  11. package/dist/components/inputs/InputWrapper.js.map +1 -1
  12. package/dist/components/inputs/MessageInput.d.ts +1 -1
  13. package/dist/components/inputs/MessageInput.js +26 -25
  14. package/dist/components/inputs/MessageInput.js.map +1 -1
  15. package/dist/components/inputs/RichTextInput.js +62 -58
  16. package/dist/components/inputs/RichTextInput.js.map +1 -1
  17. package/dist/components/inputs/toolbar/AlignmentControls.d.ts +1 -1
  18. package/dist/components/inputs/toolbar/AlignmentControls.js +47 -44
  19. package/dist/components/inputs/toolbar/AlignmentControls.js.map +1 -1
  20. package/dist/components/inputs/toolbar/BlockElementSelect.d.ts +1 -1
  21. package/dist/components/inputs/toolbar/BlockElementSelect.js +60 -54
  22. package/dist/components/inputs/toolbar/BlockElementSelect.js.map +1 -1
  23. package/dist/components/inputs/toolbar/LinkEditor.d.ts +1 -1
  24. package/dist/components/inputs/toolbar/LinkEditor.js +182 -170
  25. package/dist/components/inputs/toolbar/LinkEditor.js.map +1 -1
  26. package/dist/components/inputs/toolbar/MarkControls.d.ts +1 -1
  27. package/dist/components/inputs/toolbar/MarkControls.js +29 -28
  28. package/dist/components/inputs/toolbar/MarkControls.js.map +1 -1
  29. package/dist/components/inputs/toolbar/RichTextToolbar.d.ts +1 -1
  30. package/dist/components/inputs/toolbar/RichTextToolbar.js +29 -26
  31. package/dist/components/inputs/toolbar/RichTextToolbar.js.map +1 -1
  32. package/dist/components/inputs/variables/VariableChip.d.ts +1 -1
  33. package/dist/components/inputs/variables/VariableChip.js +55 -49
  34. package/dist/components/inputs/variables/VariableChip.js.map +1 -1
  35. package/dist/components/inputs/variables/VariableSuggestion.d.ts +1 -1
  36. package/dist/components/inputs/variables/VariableSuggestion.js +24 -23
  37. package/dist/components/inputs/variables/VariableSuggestion.js.map +1 -1
  38. package/dist/components/inputs/variables/editors/DateVariableEditor.d.ts +1 -1
  39. package/dist/components/inputs/variables/editors/PluralVariableEditor.d.ts +1 -1
  40. package/dist/components/inputs/variables/editors/PluralVariableEditor.js +151 -122
  41. package/dist/components/inputs/variables/editors/PluralVariableEditor.js.map +1 -1
  42. package/dist/components/inputs/variables/editors/SelectVariableEditor.d.ts +1 -1
  43. package/dist/components/inputs/variables/editors/SelectVariableEditor.js +33 -29
  44. package/dist/components/inputs/variables/editors/SelectVariableEditor.js.map +1 -1
  45. package/dist/components/inputs/variables/editors/TagVariableEditor.d.ts +1 -1
  46. package/dist/components/inputs/variables/editors/TagVariableEditor.js +13 -12
  47. package/dist/components/inputs/variables/editors/TagVariableEditor.js.map +1 -1
  48. package/dist/components/inputs/variables/editors/TimeVariableEditor.d.ts +1 -1
  49. package/dist/components/inputs/variables/pickers/NumericVariablePicker.d.ts +1 -1
  50. package/dist/components/inputs/variables/pickers/NumericVariablePicker.js +40 -36
  51. package/dist/components/inputs/variables/pickers/NumericVariablePicker.js.map +1 -1
  52. package/dist/components/inputs/variables/pickers/TemporalElementEditor.d.ts +1 -1
  53. package/dist/components/layout/MessageField.js +42 -38
  54. package/dist/components/layout/MessageField.js.map +1 -1
  55. package/dist/components/layout/MessagesTabs.js +31 -30
  56. package/dist/components/layout/MessagesTabs.js.map +1 -1
  57. package/dist/components/layout/MessagesTree.js +52 -51
  58. package/dist/components/layout/MessagesTree.js.map +1 -1
  59. package/dist/context/messages-form.d.ts +1 -1
  60. package/dist/context/messages-form.js +12 -11
  61. package/dist/context/messages-form.js.map +1 -1
  62. package/dist/exports/link.d.ts +1 -1
  63. package/dist/exports/link.js +11 -10
  64. package/dist/exports/link.js.map +1 -1
  65. package/dist/exports/view.d.ts +1 -1
  66. package/dist/exports/view.js +43 -40
  67. package/dist/exports/view.js.map +1 -1
  68. package/package.json +1 -1
@@ -1,49 +1,53 @@
1
+ import { jsxs as s, jsx as a } from "react/jsx-runtime";
1
2
  import { ToggleGroup as l } from "radix-ui";
2
- import { useState as i, useRef as c, useEffect as s } from "react";
3
- import { isNumberElement as m, isPluralElement as o } from "@formatjs/icu-messageformat-parser";
4
- import { PluralVariableEditor as f } from "../editors/PluralVariableEditor.js";
5
- const p = [
3
+ import { useState as f, useRef as c, useEffect as m } from "react";
4
+ import { isNumberElement as p, isPluralElement as i } from "@formatjs/icu-messageformat-parser";
5
+ import { PluralVariableEditor as d } from "../editors/PluralVariableEditor.js";
6
+ const v = [
6
7
  "number",
7
8
  "plural"
8
9
  // "selectordinal"
9
10
  ];
10
- function R({
11
+ function E({
11
12
  element: e,
12
13
  onUpdate: n
13
14
  }) {
14
- const [r, u] = i(() => {
15
- if (m(e)) return "number";
16
- if (o(e)) return "plural";
17
- }), a = c(null);
18
- return s(() => () => {
19
- a.current && n(a.current.getValue());
20
- }, []), /* @__PURE__ */ React.createElement("div", { className: "" }, /* @__PURE__ */ React.createElement(
21
- l.Root,
22
- {
23
- type: "single",
24
- className: "flex bg-elevation-100",
25
- onValueChange: (t) => u(t),
26
- value: r
27
- },
28
- p.map((t) => /* @__PURE__ */ React.createElement(
29
- l.Item,
15
+ const [o, u] = f(() => {
16
+ if (p(e)) return "number";
17
+ if (i(e)) return "plural";
18
+ }), t = c(null);
19
+ return m(() => () => {
20
+ t.current && n(t.current.getValue());
21
+ }, []), /* @__PURE__ */ s("div", { className: "", children: [
22
+ /* @__PURE__ */ a(
23
+ l.Root,
30
24
  {
31
- key: t,
32
- value: t,
33
- 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"
34
- },
35
- t
36
- ))
37
- ), /* @__PURE__ */ React.createElement("div", { className: "p-3" }, r === "plural" && /* @__PURE__ */ React.createElement(
38
- f,
39
- {
40
- variableName: e.value,
41
- element: o(e) ? e : void 0,
42
- ref: a
43
- }
44
- )));
25
+ type: "single",
26
+ className: "flex bg-elevation-100",
27
+ onValueChange: (r) => u(r),
28
+ value: o,
29
+ children: v.map((r) => /* @__PURE__ */ a(
30
+ l.Item,
31
+ {
32
+ value: r,
33
+ 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",
34
+ children: r
35
+ },
36
+ r
37
+ ))
38
+ }
39
+ ),
40
+ /* @__PURE__ */ a("div", { className: "p-3", children: o === "plural" && /* @__PURE__ */ a(
41
+ d,
42
+ {
43
+ variableName: e.value,
44
+ element: i(e) ? e : void 0,
45
+ ref: t
46
+ }
47
+ ) })
48
+ ] });
45
49
  }
46
50
  export {
47
- R as NumericVariablePicker
51
+ E as NumericVariablePicker
48
52
  };
49
53
  //# sourceMappingURL=NumericVariablePicker.js.map
@@ -1 +1 @@
1
- {"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\";\n\nimport type { NumberElement, PluralElement } from \"@/types\";\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","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,sBAAA,cAAC,OAAA,EAAI,WAAU,GAAA,GACb,sBAAA;AAAA,IAACG,EAAY;AAAA,IAAZ;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MACV,eAAe,CAACC,MAAUR,EAAQQ,CAAoB;AAAA,MACtD,OAAOT;AAAA,IAAA;AAAA,IAENJ,EAAc,IAAI,CAACI,MAClB,sBAAA;AAAA,MAACQ,EAAY;AAAA,MAAZ;AAAA,QACC,KAAKR;AAAAA,QACL,OAAOA;AAAAA,QACP,WAAU;AAAA,MAAA;AAAA,MAETA;AAAAA,IAAA,CAEJ;AAAA,EAAA,GAGH,sBAAA,cAAC,OAAA,EAAI,WAAU,MAAA,GACZA,MAAS,YACR,sBAAA;AAAA,IAACU;AAAA,IAAA;AAAA,MACC,cAAcZ,EAAQ;AAAA,MACtB,SAASM,EAAgBN,CAAO,IAAIA,IAAU;AAAA,MAC9C,KAAKO;AAAA,IAAA;AAAA,EAAA,CAGX,CACF;AAEJ;"}
1
+ {"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\";\n\nimport type { NumberElement, PluralElement } from \"@/types\";\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;"}
@@ -3,4 +3,4 @@ export interface TemporalElementEditorProps {
3
3
  element: DateElement | TimeElement;
4
4
  onUpdate: (value: string) => void;
5
5
  }
6
- export declare function TemporalElementEditor({ element, onUpdate, }: TemporalElementEditorProps): import("react").JSX.Element;
6
+ export declare function TemporalElementEditor({ element, onUpdate, }: TemporalElementEditorProps): import("react/jsx-runtime").JSX.Element;
@@ -1,46 +1,50 @@
1
- import { useMemo as s } from "react";
2
- import { useMessagesForm as c } from "../../context/messages-form.js";
3
- import { cn as p } from "../../utils/cn.js";
1
+ import { jsxs as c, jsx as a } from "react/jsx-runtime";
2
+ import { useMemo as n } from "react";
3
+ import { useMessagesForm as d } from "../../context/messages-form.js";
4
+ import { cn as f } from "../../utils/cn.js";
4
5
  import { toWords as v } from "../../utils/format.js";
5
- import { parseMessageSchema as f } from "../../utils/schema.js";
6
- import { createValidator as d } from "../../utils/validate.js";
7
- import { MessageController as n } from "../MessageController.js";
8
- function y({
9
- schema: o,
10
- messageKey: r,
11
- path: l,
12
- className: i
6
+ import { parseMessageSchema as x } from "../../utils/schema.js";
7
+ import { createValidator as b } from "../../utils/validate.js";
8
+ import { MessageController as p } from "../MessageController.js";
9
+ function F({
10
+ schema: s,
11
+ messageKey: i,
12
+ path: t,
13
+ className: l
13
14
  }) {
14
- const { locales: a } = c(), e = s(() => f(o), [o]), m = s(
15
- () => d(e.variables),
15
+ const { locales: r } = d(), e = n(() => x(s), [s]), m = n(
16
+ () => b(e.variables),
16
17
  [e.variables]
17
18
  );
18
- return /* @__PURE__ */ React.createElement("div", { className: p("", i) }, e.description && /* @__PURE__ */ React.createElement("p", null, e.description), a.length === 1 ? /* @__PURE__ */ React.createElement(
19
- n,
20
- {
21
- className: i,
22
- type: e.type,
23
- variables: e.variables,
24
- label: v(r),
25
- locale: a[0],
26
- name: [a[0], l, r].join("."),
27
- validate: m
28
- }
29
- ) : /* @__PURE__ */ React.createElement("div", { className: "-mx-3 flex min-w-0 gap-4 overflow-x-auto overscroll-x-none px-3" }, a.map((t) => /* @__PURE__ */ React.createElement(
30
- n,
31
- {
32
- key: t,
33
- className: "flex-1",
34
- type: e.type,
35
- label: t.toUpperCase(),
36
- locale: t,
37
- variables: e.variables,
38
- name: [t, l, r].join("."),
39
- validate: m
40
- }
41
- ))));
19
+ return /* @__PURE__ */ c("div", { className: f("", l), children: [
20
+ e.description && /* @__PURE__ */ a("p", { children: e.description }),
21
+ r.length === 1 ? /* @__PURE__ */ a(
22
+ p,
23
+ {
24
+ className: l,
25
+ type: e.type,
26
+ variables: e.variables,
27
+ label: v(i),
28
+ locale: r[0],
29
+ name: [r[0], t, i].join("."),
30
+ validate: m
31
+ }
32
+ ) : /* @__PURE__ */ a("div", { className: "-mx-3 flex min-w-0 gap-4 overflow-x-auto overscroll-x-none px-3", children: r.map((o) => /* @__PURE__ */ a(
33
+ p,
34
+ {
35
+ className: "flex-1",
36
+ type: e.type,
37
+ label: o.toUpperCase(),
38
+ locale: o,
39
+ variables: e.variables,
40
+ name: [o, t, i].join("."),
41
+ validate: m
42
+ },
43
+ o
44
+ )) })
45
+ ] });
42
46
  }
43
47
  export {
44
- y as MessageField
48
+ F as MessageField
45
49
  };
46
50
  //# sourceMappingURL=MessageField.js.map
@@ -1 +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 { toWords } from \"@/utils/format\";\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 label={toWords(messageKey)}\n locale={locales[0]}\n name={[locales[0], path, messageKey].join(\".\")}\n validate={validator}\n />\n ) : (\n <div className=\"-mx-3 flex min-w-0 gap-4 overflow-x-auto overscroll-x-none px-3\">\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","MessageController","toWords","locale"],"mappings":";;;;;;;AAkBO,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,6CACG,OAAA,EAAI,WAAWK,EAAG,IAAIR,CAAS,EAAA,GAC7BG,EAAO,eAAe,sBAAA,cAAC,WAAGA,EAAO,WAAY,GAE7CF,EAAQ,WAAW,IAClB,sBAAA;AAAA,IAACQ;AAAA,IAAA;AAAA,MACC,WAAAT;AAAA,MACA,MAAMG,EAAO;AAAA,MACb,WAAWA,EAAO;AAAA,MAClB,OAAOO,EAAQZ,CAAU;AAAA,MACzB,QAAQG,EAAQ,CAAC;AAAA,MACjB,MAAM,CAACA,EAAQ,CAAC,GAAGF,GAAMD,CAAU,EAAE,KAAK,GAAG;AAAA,MAC7C,UAAUQ;AAAA,IAAA;AAAA,EAAA,wCAGX,OAAA,EAAI,WAAU,qEACZL,EAAQ,IAAI,CAACU,MACZ,sBAAA;AAAA,IAACF;AAAA,IAAA;AAAA,MACC,KAAKE;AAAA,MACL,WAAU;AAAA,MACV,MAAMR,EAAO;AAAA,MACb,OAAOQ,EAAO,YAAA;AAAA,MACd,QAAAA;AAAA,MACA,WAAWR,EAAO;AAAA,MAClB,MAAM,CAACQ,GAAQZ,GAAMD,CAAU,EAAE,KAAK,GAAG;AAAA,MACzC,UAAUQ;AAAA,IAAA;AAAA,EAAA,CAEb,CACH,CAEJ;AAEJ;"}
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 { toWords } from \"@/utils/format\";\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 label={toWords(messageKey)}\n locale={locales[0]}\n name={[locales[0], path, messageKey].join(\".\")}\n validate={validator}\n />\n ) : (\n <div className=\"-mx-3 flex min-w-0 gap-4 overflow-x-auto overscroll-x-none px-3\">\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","toWords","locale"],"mappings":";;;;;;;;AAkBO,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,OAAOQ,EAAQb,CAAU;AAAA,QACzB,QAAQG,EAAQ,CAAC;AAAA,QACjB,MAAM,CAACA,EAAQ,CAAC,GAAGF,GAAMD,CAAU,EAAE,KAAK,GAAG;AAAA,QAC7C,UAAUQ;AAAA,MAAA;AAAA,IAAA,sBAGX,OAAA,EAAI,WAAU,mEACZ,UAAAL,EAAQ,IAAI,CAACW,MACZ,gBAAAH;AAAA,MAACC;AAAA,MAAA;AAAA,QAEC,WAAU;AAAA,QACV,MAAMP,EAAO;AAAA,QACb,OAAOS,EAAO,YAAA;AAAA,QACd,QAAAA;AAAA,QACA,WAAWT,EAAO;AAAA,QAClB,MAAM,CAACS,GAAQb,GAAMD,CAAU,EAAE,KAAK,GAAG;AAAA,QACzC,UAAUQ;AAAA,MAAA;AAAA,MAPLM;AAAA,IAAA,CASR,EAAA,CACH;AAAA,EAAA,GAEJ;AAEJ;"}
@@ -1,43 +1,44 @@
1
- import { Button as c } from "@payloadcms/ui";
2
- import { get as i } from "lodash-es";
3
- import { useCallback as p } from "react";
4
- import { useFormState as b } from "react-hook-form";
1
+ import { jsx as s } from "react/jsx-runtime";
2
+ import { Button as p } from "@payloadcms/ui";
3
+ import { get as c } from "lodash-es";
4
+ import { useCallback as b } from "react";
5
+ import { useFormState as d } from "react-hook-form";
5
6
  import { useMessagesForm as u } from "../../context/messages-form.js";
6
- import { cn as d } from "../../utils/cn.js";
7
- import { toWords as f } from "../../utils/format.js";
8
- function M({
9
- schema: s,
7
+ import { cn as f } from "../../utils/cn.js";
8
+ import { toWords as x } from "../../utils/format.js";
9
+ function N({
10
+ schema: m,
10
11
  activeTab: o,
11
- setActiveTab: m
12
+ setActiveTab: n
12
13
  }) {
13
- const { locales: t, control: a } = u(), { errors: e } = b({ control: a }), n = p(
14
- (r) => t.some((l) => i(e, [l, r]) !== void 0),
14
+ const { locales: t, control: l } = u(), { errors: e } = d({ control: l }), i = b(
15
+ (r) => t.some((a) => c(e, [a, r]) !== void 0),
15
16
  [e, t]
16
17
  );
17
- return /* @__PURE__ */ React.createElement(
18
+ return /* @__PURE__ */ s(
18
19
  "div",
19
20
  {
20
21
  role: "tablist",
21
- className: "overflow-x-auto border-b-2 border-border px-4 text-nowrap"
22
- },
23
- Object.keys(s).map((r) => /* @__PURE__ */ React.createElement(
24
- c,
25
- {
26
- key: r,
27
- size: "large",
28
- className: d(
29
- "my-0 rounded-b-none text-lg",
30
- n(r) ? o === r ? "bg-error" : "text-error" : void 0
31
- ),
32
- buttonStyle: o === r ? "pill" : "tab",
33
- onClick: () => m(r),
34
- type: "button"
35
- },
36
- f(r)
37
- ))
22
+ className: "overflow-x-auto border-b-2 border-border px-4 text-nowrap",
23
+ children: Object.keys(m).map((r) => /* @__PURE__ */ s(
24
+ p,
25
+ {
26
+ size: "large",
27
+ className: f(
28
+ "my-0 rounded-b-none text-lg",
29
+ i(r) ? o === r ? "bg-error" : "text-error" : void 0
30
+ ),
31
+ buttonStyle: o === r ? "pill" : "tab",
32
+ onClick: () => n(r),
33
+ type: "button",
34
+ children: x(r)
35
+ },
36
+ r
37
+ ))
38
+ }
38
39
  );
39
40
  }
40
41
  export {
41
- M as MessagesTabs
42
+ N as MessagesTabs
42
43
  };
43
44
  //# sourceMappingURL=MessagesTabs.js.map
@@ -1 +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","Button","cn","toWords"],"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,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,IAAA;AAAA,IAET,OAAO,KAAKH,CAAM,EAAE,IAAI,CAACU,MACxB,sBAAA;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,KAAAH;AAAA,QACA,MAAK;AAAA,QACL,WAAWI;AAAA,UACT;AAAA,UACAN,EAAUE,CAAG,IACTT,MAAcS,IACZ,aACA,eACF;AAAA,QAAA;AAAA,QAEN,aAAaT,MAAcS,IAAM,SAAS;AAAA,QAC1C,SAAS,MAAMR,EAAaQ,CAAG;AAAA,QAC/B,MAAK;AAAA,MAAA;AAAA,MAEJK,EAAQL,CAAG;AAAA,IAAA,CAEf;AAAA,EAAA;AAGP;"}
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;"}
@@ -1,67 +1,68 @@
1
- import { Collapsible as p } from "@payloadcms/ui";
2
- import { get as g } from "lodash-es";
3
- import { useCallback as f } from "react";
4
- import { useFormState as d } from "react-hook-form";
5
- import { useMessagesForm as E } from "../../context/messages-form.js";
1
+ import { jsx as e } from "react/jsx-runtime";
2
+ import { Collapsible as d } from "@payloadcms/ui";
3
+ import { get as f } from "lodash-es";
4
+ import { useCallback as g } from "react";
5
+ import { useFormState as h } from "react-hook-form";
6
+ import { useMessagesForm as x } from "../../context/messages-form.js";
6
7
  import { cn as a } from "../../utils/cn.js";
7
- import { toWords as R } from "../../utils/format.js";
8
- import { MessageField as N } from "./MessageField.js";
9
- function b({
10
- path: t,
11
- schema: c,
12
- nestingLevel: s = 0,
13
- className: i
8
+ import { toWords as N } from "../../utils/format.js";
9
+ import { MessageField as b } from "./MessageField.js";
10
+ function j({
11
+ path: o,
12
+ schema: l,
13
+ nestingLevel: m = 0,
14
+ className: n
14
15
  }) {
15
- const { control: l, locales: m } = E(), { errors: o } = d({ control: l }), n = f(
16
- (e) => m.some(
17
- (r) => g(o, [r, t, e].join(".")) !== void 0
16
+ const { control: c, locales: i } = x(), { errors: t } = h({ control: c }), p = g(
17
+ (r) => i.some(
18
+ (s) => f(t, [s, o, r].join(".")) !== void 0
18
19
  ),
19
- [o, m, t]
20
+ [t, i, o]
20
21
  );
21
- return /* @__PURE__ */ React.createElement("div", { className: a("grid gap-6", i) }, Object.entries(c).map(([e, r]) => /* @__PURE__ */ React.createElement(
22
+ return /* @__PURE__ */ e("div", { className: a("grid gap-6", n), children: Object.entries(l).map(([r, s]) => /* @__PURE__ */ e(
22
23
  "div",
23
24
  {
24
- key: e,
25
25
  className: "grid min-w-0",
26
26
  style: {
27
- "--nesting-level": s
28
- }
29
- },
30
- /* @__PURE__ */ React.createElement(
31
- p,
32
- {
33
- className: "messages-tree-collapsible min-w-0",
34
- header: /* @__PURE__ */ React.createElement(
35
- "span",
36
- {
37
- className: a("text-xl", {
38
- "text-error": n(e)
39
- })
40
- },
41
- R(e)
42
- )
27
+ "--nesting-level": m
43
28
  },
44
- typeof r == "string" ? /* @__PURE__ */ React.createElement(
45
- N,
46
- {
47
- className: "min-w-0",
48
- schema: r,
49
- key: e,
50
- messageKey: e,
51
- path: t
52
- }
53
- ) : /* @__PURE__ */ React.createElement(
54
- b,
29
+ children: /* @__PURE__ */ e(
30
+ d,
55
31
  {
56
- nestingLevel: s + 1,
57
- path: [t, e].join("."),
58
- schema: r
32
+ className: "messages-tree-collapsible min-w-0",
33
+ header: /* @__PURE__ */ e(
34
+ "span",
35
+ {
36
+ className: a("text-xl", {
37
+ "text-error": p(r)
38
+ }),
39
+ children: N(r)
40
+ }
41
+ ),
42
+ children: typeof s == "string" ? /* @__PURE__ */ e(
43
+ b,
44
+ {
45
+ className: "min-w-0",
46
+ schema: s,
47
+ messageKey: r,
48
+ path: o
49
+ },
50
+ r
51
+ ) : /* @__PURE__ */ e(
52
+ j,
53
+ {
54
+ nestingLevel: m + 1,
55
+ path: [o, r].join("."),
56
+ schema: s
57
+ }
58
+ )
59
59
  }
60
60
  )
61
- )
62
- )));
61
+ },
62
+ r
63
+ )) });
63
64
  }
64
65
  export {
65
- b as MessagesTree
66
+ j as MessagesTree
66
67
  };
67
68
  //# sourceMappingURL=MessagesTree.js.map
@@ -1 +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\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","Collapsible","toWords","MessageField"],"mappings":";;;;;;;;AAmBO,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,6CACG,OAAA,EAAI,WAAWc,EAAG,cAAcX,CAAS,EAAA,GACvC,OAAO,QAAQF,CAAM,EAAE,IAAI,CAAC,CAACU,GAAKI,CAAK,MACtC,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAJ;AAAA,MACA,WAAU;AAAA,MACV,OACE;AAAA,QACG,mBAAoBT;AAAA,MAAA;AAAA,IACvB;AAAA,IAGF,sBAAA;AAAA,MAACc;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,QACE,sBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWF,EAAG,WAAW;AAAA,cACvB,cAAcL,EAAUE,CAAG;AAAA,YAAA,CAC5B;AAAA,UAAA;AAAA,UAEAM,EAAQN,CAAG;AAAA,QAAA;AAAA,MACd;AAAA,MAGD,OAAOI,KAAU,WAChB,sBAAA;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,QAAQH;AAAA,UACR,KAAAJ;AAAA,UACA,YAAYA;AAAA,UACZ,MAAAX;AAAA,QAAA;AAAA,MAAA,IAGF,sBAAA;AAAA,QAACD;AAAA,QAAA;AAAA,UACC,cAAcG,IAAe;AAAA,UAC7B,MAAM,CAACF,GAAMW,CAAG,EAAE,KAAK,GAAG;AAAA,UAC1B,QAAQI;AAAA,QAAA;AAAA,MAAA;AAAA,IACV;AAAA,EAEJ,CAEH,CACH;AAEJ;"}
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\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":";;;;;;;;;AAmBO,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;"}
@@ -6,7 +6,7 @@ interface MessagesFormProviderProps {
6
6
  form: UseFormReturn<FormValues>;
7
7
  richTextEditorOptions?: RichTextEditorOptions;
8
8
  }
9
- export declare function MessagesFormProvider({ locales, form, richTextEditorOptions, children, }: React.PropsWithChildren<MessagesFormProviderProps>): import("react").JSX.Element;
9
+ export declare function MessagesFormProvider({ locales, form, richTextEditorOptions, children, }: React.PropsWithChildren<MessagesFormProviderProps>): import("react/jsx-runtime").JSX.Element;
10
10
  export declare const useMessagesForm: () => {
11
11
  watch: import('react-hook-form').UseFormWatch<FormValues>;
12
12
  getValues: import('react-hook-form').UseFormGetValues<FormValues>;
@@ -1,26 +1,27 @@
1
1
  "use client";
2
- import { createContext as n, useContext as c } from "react";
3
- import { FormProvider as m, useFormContext as a } from "react-hook-form";
4
- const o = n({
2
+ import { jsx as r } from "react/jsx-runtime";
3
+ import { createContext as m, useContext as c } from "react";
4
+ import { FormProvider as i, useFormContext as u } from "react-hook-form";
5
+ const t = m({
5
6
  locales: ["en"]
6
7
  });
7
8
  function l({
8
9
  locales: e,
9
- form: t,
10
- richTextEditorOptions: r,
11
- children: s
10
+ form: o,
11
+ richTextEditorOptions: s,
12
+ children: n
12
13
  }) {
13
- return /* @__PURE__ */ React.createElement(o.Provider, { value: { locales: e, richTextEditorOptions: r } }, /* @__PURE__ */ React.createElement(m, { ...t }, s));
14
+ return /* @__PURE__ */ r(t.Provider, { value: { locales: e, richTextEditorOptions: s }, children: /* @__PURE__ */ r(i, { ...o, children: n }) });
14
15
  }
15
- const x = () => {
16
- const e = c(o), t = a();
16
+ const F = () => {
17
+ const e = c(t), o = u();
17
18
  return {
18
19
  ...e,
19
- ...t
20
+ ...o
20
21
  };
21
22
  };
22
23
  export {
23
24
  l as MessagesFormProvider,
24
- x as useMessagesForm
25
+ F as useMessagesForm
25
26
  };
26
27
  //# sourceMappingURL=messages-form.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"messages-form.js","sources":["../../src/context/messages-form.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n Locales,\n Messages,\n RichTextEditorOptions,\n Translations,\n} from \"@/types\";\nimport type { UseFormReturn } from \"react-hook-form\";\nimport { createContext, useContext } from \"react\";\nimport { FormProvider, useFormContext } from \"react-hook-form\";\n\nexport type FormValues = Translations<Messages>;\n\nconst MessagesFormContext = createContext<{\n locales: Locales;\n richTextEditorOptions?: RichTextEditorOptions;\n}>({\n locales: [\"en\"],\n});\n\ninterface MessagesFormProviderProps {\n locales: Locales;\n form: UseFormReturn<FormValues>;\n richTextEditorOptions?: RichTextEditorOptions;\n}\n\nexport function MessagesFormProvider({\n locales,\n form,\n richTextEditorOptions,\n children,\n}: React.PropsWithChildren<MessagesFormProviderProps>) {\n return (\n <MessagesFormContext.Provider value={{ locales, richTextEditorOptions }}>\n <FormProvider {...form}>{children}</FormProvider>\n </MessagesFormContext.Provider>\n );\n}\n\nexport const useMessagesForm = () => {\n const context = useContext(MessagesFormContext);\n const form = useFormContext<FormValues>();\n return {\n ...context,\n ...form,\n };\n};\n"],"names":["MessagesFormContext","createContext","MessagesFormProvider","locales","form","richTextEditorOptions","children","FormProvider","useMessagesForm","context","useContext","useFormContext"],"mappings":";;;AAcA,MAAMA,IAAsBC,EAGzB;AAAA,EACD,SAAS,CAAC,IAAI;AAChB,CAAC;AAQM,SAASC,EAAqB;AAAA,EACnC,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,uBAAAC;AAAA,EACA,UAAAC;AACF,GAAuD;AACrD,SACE,sBAAA,cAACN,EAAoB,UAApB,EAA6B,OAAO,EAAE,SAAAG,GAAS,uBAAAE,EAAA,EAAsB,GACpE,sBAAA,cAACE,GAAA,EAAc,GAAGH,EAAA,GAAOE,CAAS,CACpC;AAEJ;AAEO,MAAME,IAAkB,MAAM;AACnC,QAAMC,IAAUC,EAAWV,CAAmB,GACxCI,IAAOO,EAAA;AACb,SAAO;AAAA,IACL,GAAGF;AAAA,IACH,GAAGL;AAAA,EAAA;AAEP;"}
1
+ {"version":3,"file":"messages-form.js","sources":["../../src/context/messages-form.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n Locales,\n Messages,\n RichTextEditorOptions,\n Translations,\n} from \"@/types\";\nimport type { UseFormReturn } from \"react-hook-form\";\nimport { createContext, useContext } from \"react\";\nimport { FormProvider, useFormContext } from \"react-hook-form\";\n\nexport type FormValues = Translations<Messages>;\n\nconst MessagesFormContext = createContext<{\n locales: Locales;\n richTextEditorOptions?: RichTextEditorOptions;\n}>({\n locales: [\"en\"],\n});\n\ninterface MessagesFormProviderProps {\n locales: Locales;\n form: UseFormReturn<FormValues>;\n richTextEditorOptions?: RichTextEditorOptions;\n}\n\nexport function MessagesFormProvider({\n locales,\n form,\n richTextEditorOptions,\n children,\n}: React.PropsWithChildren<MessagesFormProviderProps>) {\n return (\n <MessagesFormContext.Provider value={{ locales, richTextEditorOptions }}>\n <FormProvider {...form}>{children}</FormProvider>\n </MessagesFormContext.Provider>\n );\n}\n\nexport const useMessagesForm = () => {\n const context = useContext(MessagesFormContext);\n const form = useFormContext<FormValues>();\n return {\n ...context,\n ...form,\n };\n};\n"],"names":["MessagesFormContext","createContext","MessagesFormProvider","locales","form","richTextEditorOptions","children","jsx","FormProvider","useMessagesForm","context","useContext","useFormContext"],"mappings":";;;;AAcA,MAAMA,IAAsBC,EAGzB;AAAA,EACD,SAAS,CAAC,IAAI;AAChB,CAAC;AAQM,SAASC,EAAqB;AAAA,EACnC,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,uBAAAC;AAAA,EACA,UAAAC;AACF,GAAuD;AACrD,SACE,gBAAAC,EAACP,EAAoB,UAApB,EAA6B,OAAO,EAAE,SAAAG,GAAS,uBAAAE,EAAA,GAC9C,UAAA,gBAAAE,EAACC,GAAA,EAAc,GAAGJ,GAAO,UAAAE,GAAS,GACpC;AAEJ;AAEO,MAAMG,IAAkB,MAAM;AACnC,QAAMC,IAAUC,EAAWX,CAAmB,GACxCI,IAAOQ,EAAA;AACb,SAAO;AAAA,IACL,GAAGF;AAAA,IACH,GAAGN;AAAA,EAAA;AAEP;"}
@@ -4,4 +4,4 @@ export interface MessagesLinkProps {
4
4
  access?: MessagesGuard;
5
5
  req: PayloadRequest;
6
6
  }
7
- export declare function MessagesLink({ access, req, }: MessagesLinkProps): Promise<import("react").JSX.Element | null>;
7
+ export declare function MessagesLink({ access, req, }: MessagesLinkProps): Promise<import("react/jsx-runtime").JSX.Element | null>;
@@ -1,20 +1,21 @@
1
- import { Button as n } from "@payloadcms/ui";
2
- import { IconWorld as a } from "@tabler/icons-react";
3
- async function r({
4
- access: e = () => !0,
1
+ import { jsx as n } from "react/jsx-runtime";
2
+ import { Button as r } from "@payloadcms/ui";
3
+ import { IconWorld as s } from "@tabler/icons-react";
4
+ async function l({
5
+ access: o = () => !0,
5
6
  req: t
6
7
  }) {
7
- return await e(t) ? /* @__PURE__ */ React.createElement(
8
- n,
8
+ return await o(t) ? /* @__PURE__ */ n(
9
+ r,
9
10
  {
10
11
  buttonStyle: "tab",
11
12
  el: "link",
12
- to: `${t.payload.getAdminURL()}/intl`
13
- },
14
- /* @__PURE__ */ React.createElement(a, null)
13
+ to: `${t.payload.getAdminURL()}/intl`,
14
+ children: /* @__PURE__ */ n(s, {})
15
+ }
15
16
  ) : null;
16
17
  }
17
18
  export {
18
- r as MessagesLink
19
+ l as MessagesLink
19
20
  };
20
21
  //# sourceMappingURL=link.js.map
@@ -1 +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","Button","IconWorld"],"mappings":";;AAWA,eAAsBA,EAAa;AAAA,EACjC,QAAAC,IAAS,MAAM;AAAA,EACf,KAAAC;AACF,GAAsB;AAEpB,SADkB,MAAMD,EAAOC,CAAG,IAIhC,sBAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAY;AAAA,MACZ,IAAG;AAAA,MACH,IAAI,GAAGD,EAAI,QAAQ,aAAa;AAAA,IAAA;AAAA,wCAE/BE,GAAA,IAAU;AAAA,EAAA,IARQ;AAWzB;"}
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;"}
@@ -7,4 +7,4 @@ export interface MessagesViewProps {
7
7
  access: MessagesGuard;
8
8
  richTextEditorOptions?: RichTextEditorOptions;
9
9
  }
10
- export declare function MessagesView({ access, initPageResult, locales, params, payload, schema, searchParams, tabs, richTextEditorOptions, }: AdminViewServerProps & MessagesViewProps): Promise<import("react").JSX.Element>;
10
+ export declare function MessagesView({ access, initPageResult, locales, params, payload, schema, searchParams, tabs, richTextEditorOptions, }: AdminViewServerProps & MessagesViewProps): Promise<import("react/jsx-runtime").JSX.Element>;