@lunejs/admin-ui 0.1.5 → 0.2.1

package/dist/lib/translate/components/product-form/custom-fields/translate-product-custom-fields.js

@@ -1,8 +1,8 @@
-import { jsx as i, Fragment as b } from "react/jsx-runtime";
-import { isLast as e, isFirst as f } from "../../../../../packages/lune-common/dist/index.js";
+import { jsx as s, Fragment as V, jsxs as b } from "react/jsx-runtime";
+import { isLast as r, isFirst as T } from "../../../../../packages/lune-common/dist/index.js";
 import "react";
 import "../../../../../packages/lune-ui/dist/node_modules/@radix-ui/react-accordion/dist/index.js";
-import { cn as a } from "../../../../../packages/lune-ui/dist/lib/utils.js";
+import { cn as l } from "../../../../../packages/lune-ui/dist/lib/utils.js";
 import "../../../../../packages/lune-ui/dist/node_modules/@radix-ui/react-alert-dialog/dist/index.js";
 import "../../../../../packages/lune-ui/dist/node_modules/@radix-ui/react-avatar/dist/index.js";
 import "../../../../../packages/lune-ui/dist/node_modules/@radix-ui/react-separator/dist/index.js";
@@ -32,88 +32,120 @@ import "../../../../../packages/lune-ui/dist/node_modules/@radix-ui/react-toggle
 import "../../../../../packages/lune-ui/dist/components/toggle-group.js";
 import "../../../../../packages/lune-ui/dist/node_modules/@radix-ui/react-tooltip/dist/index.js";
 import "../../../../../packages/lune-ui/dist/form/form.js";
-import { useWatch as h } from "../../../../../node_modules/react-hook-form/dist/index.esm.js";
-import { CustomFieldType as V } from "../../../../api/codegen/graphql.js";
-import { isTranslatable as T } from "../../../../custom-fields/utils/custom-field.utils.js";
-import { TranslateFormRowData as u } from "../../form/translate-form-row-data.js";
-import { TranslateInput as c } from "../../form/translate-input.js";
-import { TranslateTextarea as v } from "../../form/translate-textarea.js";
-import { useTranslateProductFormContext as C } from "../use-form/use-translate-product-form.js";
-const pt = ({ product: d }) => {
-  const o = C(), n = h({ defaultValue: o.formState.defaultValues }), s = d.customFieldEntries.filter(
-    (t) => T(t.definition.type)
+import { useWatch as f } from "../../../../../node_modules/react-hook-form/dist/index.esm.js";
+import { CustomFieldType as m } from "../../../../api/codegen/graphql.js";
+import { isTranslatable as v } from "../../../../custom-fields/utils/custom-field.utils.js";
+import { TranslateFormRowData as d } from "../../form/translate-form-row-data.js";
+import { TranslateInput as p } from "../../form/translate-input.js";
+import { TranslateRichText as y } from "../../form/translate-rich-text.js";
+import { TranslateTextarea as C } from "../../form/translate-textarea.js";
+import { useTranslateProductFormContext as E } from "../use-form/use-translate-product-form.js";
+const dt = ({ product: g }) => {
+  const i = E(), a = f({ defaultValue: i.formState.defaultValues }), n = g.customFieldEntries.filter(
+    (t) => v(t.definition.type)
   );
-  return /* @__PURE__ */ i(b, { children: s.map(
-    (t, l) => t.definition.isList ? t.value.map((m, r) => /* @__PURE__ */ i(
-      u,
+  return /* @__PURE__ */ s(V, { children: n.map(
+    (t, u) => t.definition.isList ? t.value.map((o, e) => /* @__PURE__ */ s(
+      d,
       {
-        field: f(r) ? t.definition.name : "",
-        reference: m,
+        field: T(e) ? t.definition.name : "",
+        reference: o,
         className: {
-          row: a(
-            !e(r, t.value) && "border-0!",
-            e(r, t.value) && e(l, s) && "border-0!"
+          row: l(
+            !r(e, t.value) && "border-0!",
+            r(e, t.value) && r(u, n) && "border-0!"
           ),
-          referenceCell: a(!e(r, t.value) && "border-b")
+          referenceCell: l(!r(e, t.value) && "border-b")
         },
-        children: /* @__PURE__ */ i(
-          c,
+        children: /* @__PURE__ */ s(
+          p,
           {
-            defaultValue: n.customFields?.[t.id][r],
-            className: a(
-              !e(r, t.value) && "border-b",
-              e(r, t.value) && e(l, s) && "ring-0! lg:[&:has(input:focus-visible)]:ring-primary/50! lg:[&:has(input:focus-visible)]:ring-[1px]!"
+            defaultValue: a.customFields?.[t.id][e],
+            className: l(
+              !r(e, t.value) && "border-b",
+              r(e, t.value) && r(u, n) && "ring-0! lg:[&:has(input:focus-visible)]:ring-primary/50! lg:[&:has(input:focus-visible)]:ring-[1px]!"
             ),
             label: "English",
-            onChange: (g) => {
-              const F = g.target.value, p = o.getValues("customFields")[t.id];
-              p[r] = F, o.setValue("customFields", {
-                ...o.getValues("customFields"),
-                [t.id]: p
+            onChange: (F) => {
+              const h = F.target.value, c = i.getValues("customFields")[t.id];
+              c[e] = h, i.setValue("customFields", {
+                ...i.getValues("customFields"),
+                [t.id]: c
               });
             }
           }
         )
       },
-      t.definition.id + r
-    )) : /* @__PURE__ */ i(
-      u,
+      t.definition.id + e
+    )) : /* @__PURE__ */ b(
+      d,
       {
+        richText: t.definition.type === m.RichText,
         field: t.definition.name,
         reference: t.value,
-        className: a(e(l, s) && "border-b-0"),
-        children: t.definition.type === V.SingleLineText ? /* @__PURE__ */ i(
-          c,
-          {
-            defaultValue: n.customFields?.[t.id],
-            label: "English",
-            onChange: (m) => {
-              const r = m.target.value;
-              o.setValue("customFields", {
-                ...o.getValues("customFields"),
-                [t.id]: r
-              });
+        className: l(r(u, n) && "border-b-0"),
+        children: [
+          t.definition.type === m.SingleLineText && /* @__PURE__ */ s(
+            p,
+            {
+              defaultValue: a.customFields?.[t.id],
+              label: "English",
+              onChange: (o) => {
+                const e = o.target.value;
+                i.setValue("customFields", {
+                  ...i.getValues("customFields"),
+                  [t.id]: e
+                });
+              }
             }
-          }
-        ) : /* @__PURE__ */ i(
-          v,
-          {
-            defaultValue: n.customFields?.[t.id],
-            label: "English",
-            onChange: (m) => {
-              const r = m.target.value;
-              o.setValue("customFields", {
-                ...o.getValues("customFields"),
-                [t.id]: r
-              });
+          ),
+          t.definition.type === m.MultiLineText && /* @__PURE__ */ s(
+            C,
+            {
+              defaultValue: a.customFields?.[t.id],
+              label: "English",
+              onChange: (o) => {
+                const e = o.target.value;
+                i.setValue("customFields", {
+                  ...i.getValues("customFields"),
+                  [t.id]: e
+                });
+              }
             }
-          }
-        )
+          ),
+          t.definition.type === m.RichText && /* @__PURE__ */ s(
+            y,
+            {
+              defaultValue: a.customFields?.[t.id],
+              label: "English",
+              onChange: (o) => {
+                i.setValue("customFields", {
+                  ...i.getValues("customFields"),
+                  [t.id]: o
+                });
+              }
+            }
+          ),
+          t.definition.type === m.Url && /* @__PURE__ */ s(
+            p,
+            {
+              defaultValue: a.customFields?.[t.id],
+              label: "English",
+              onChange: (o) => {
+                const e = o.target.value;
+                i.setValue("customFields", {
+                  ...i.getValues("customFields"),
+                  [t.id]: e
+                });
+              }
+            }
+          )
+        ]
       },
       t.definition.id
     )
   ) });
 };
 export {
-  pt as TranslateProductCustomField
+  dt as TranslateProductCustomField
 };

package/dist/lib/translate/components/product-form/translate-product-form.js

@@ -35,23 +35,23 @@ import "../../../../packages/lune-ui/dist/node_modules/@radix-ui/react-tooltip/d
 import { Form as b } from "../../../../packages/lune-ui/dist/form/form.js";
 import { H4 as x } from "../../../../packages/lune-ui/dist/typography/h4.js";
 import { isTranslatable as u } from "../../../custom-fields/utils/custom-field.utils.js";
-import { ImagePlaceholder as g } from "../../../../shared/components/placeholders/image-placeholder.js";
-import { TranslateFormHeader as T } from "../form/translate-form-header.js";
+import { ImagePlaceholder as T } from "../../../../shared/components/placeholders/image-placeholder.js";
+import { TranslateFormHeader as g } from "../form/translate-form-header.js";
 import { TranslateFormRowData as s } from "../form/translate-form-row-data.js";
 import { TranslateFormSeparator as a } from "../form/translate-form-separator.js";
 import { TranslateInput as N } from "../form/translate-input.js";
-import { TranslateTextarea as v } from "../form/translate-textarea.js";
-import { LocaleSelector as F } from "../locale-selector/locale-selector.js";
+import { TranslateRichText as F } from "../form/translate-rich-text.js";
+import { LocaleSelector as v } from "../locale-selector/locale-selector.js";
 import { TranslateProductCustomField as C } from "./custom-fields/translate-product-custom-fields.js";
 import { TranslateOptions as w } from "./options/translate-product-options.js";
 import { ReplaceProductSheet as S } from "./replace-product/replace-product-sheet.js";
 import { TranslateProductFormSubmitButton as j } from "./submit-button/translate-product-form-submit-button.js";
 import { useTranslateProductForm as P } from "./use-form/use-translate-product-form.js";
 const Ce = ({ product: r }) => {
-  const o = P(r), i = !!r.options.length, l = !!r.customFieldEntries.filter(
-    (m) => u(m.definition.type)
+  const i = P(r), m = !!r.options.length, l = !!r.customFieldEntries.filter(
+    (o) => u(o.definition.type)
   ).length;
-  return /* @__PURE__ */ e(b, { ...o, children: /* @__PURE__ */ t("form", { onSubmit: o.onSubmit, className: "w-full border-l", children: [
+  return /* @__PURE__ */ e(b, { ...i, children: /* @__PURE__ */ t("form", { onSubmit: i.onSubmit, className: "w-full border-l", children: [
     /* @__PURE__ */ t("header", { className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between w-full p-4 border-b", children: [
       /* @__PURE__ */ t("div", { className: "flex items-center gap-3", children: [
         r.assets.items?.[0]?.source ? /* @__PURE__ */ e(
@@ -62,7 +62,7 @@ const Ce = ({ product: r }) => {
             className: "shrink-0 size-10 sm:size-9 rounded-sm object-cover"
           }
         ) : /* @__PURE__ */ e(
-          g,
+          T,
           {
             className: "shrink-0 size-10 sm:size-9 rounded-sm object-cover",
             initial: r.name
@@ -72,40 +72,41 @@ const Ce = ({ product: r }) => {
       ] }),
       /* @__PURE__ */ t("div", { className: "flex flex-col sm:flex-row items-center gap-3", children: [
         /* @__PURE__ */ e(S, {}),
-        /* @__PURE__ */ e(F, {}),
+        /* @__PURE__ */ e(v, {}),
         /* @__PURE__ */ e(j, { product: r })
       ] })
     ] }),
     /* @__PURE__ */ e("div", { className: "p-4 sm:h-[calc(100vh-69px-69px-32px)] overflow-y-auto", children: /* @__PURE__ */ t(p, { className: "pb-0", children: [
       /* @__PURE__ */ e("div", { className: "flex items-center justify-between px-4", children: /* @__PURE__ */ e(c, { children: "General" }) }),
-      /* @__PURE__ */ e(f, { className: "p-0 border-t lg:border-t-0", children: /* @__PURE__ */ t(d, { children: [
-        /* @__PURE__ */ e(T, {}),
+      /* @__PURE__ */ e(f, { className: "p-0 border-t lg:border-t-0", children: /* @__PURE__ */ t(d, { className: "table-fixed", children: [
+        /* @__PURE__ */ e(g, {}),
         /* @__PURE__ */ t(h, { children: [
           /* @__PURE__ */ e(s, { field: "Name", reference: r.name, children: /* @__PURE__ */ e(
             N,
             {
               label: "English",
-              ...o.register("name"),
-              onChange: (m) => o.setValue("name", m.target.value)
+              ...i.register("name"),
+              onChange: (o) => i.setValue("name", o.target.value)
             }
           ) }),
           /* @__PURE__ */ e(
             s,
             {
+              richText: !0,
               field: "Description",
               reference: r.description,
-              className: n(!i && "border-b-0"),
+              className: n(!m && "border-b-0"),
               children: /* @__PURE__ */ e(
-                v,
+                F,
                 {
                   label: "English",
-                  ...o.register("description"),
-                  onChange: (m) => o.setValue("description", m.target.value)
+                  ...i.register("description"),
+                  onChange: (o) => i.setValue("description", o)
                 }
               )
             }
           ),
-          i && /* @__PURE__ */ e(a, { text: "Options" }),
+          m && /* @__PURE__ */ e(a, { text: "Options" }),
           /* @__PURE__ */ e(w, { product: r }),
           l && /* @__PURE__ */ e(a, { text: "Custom fields", className: "border-t!" }),
           /* @__PURE__ */ e(C, { product: r })