@feedmepos/mf-miniprogram-v2 0.2.8-dev.8 → 0.2.8

package/dist/{BrandFontPicker-VX2LAN2w.js → BrandFontPicker-Ud9cZQm1.js}

@@ -1,5 +1,5 @@
 import { defineComponent as te, ref as n, computed as F, watch as G, resolveComponent as I, openBlock as s, createElementBlock as u, withKeys as L, withModifiers as N, createElementVNode as a, toDisplayString as k, createVNode as P, withCtx as J, normalizeStyle as E, withDirectives as K, vModelText as q, Fragment as S, renderList as oe, createCommentVNode as v, unref as T, createBlock as ae, createTextVNode as W, nextTick as le } from "vue";
-import { G as V, f as ne, b as p, l as se } from "./useBrandKit-CKn1fm2o.js";
+import { G as V, f as ne, b as p, l as se } from "./useBrandKit-DDqx19_h.js";
 import { _ as re } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const xe = "data:image/png;base64,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", ue = ["onKeydown"], ie = { class: "font-picker__label" }, de = ["disabled", "aria-label", "aria-expanded"], ce = ["onKeydown", "aria-label"], ve = {
   key: 0,

package/dist/BrandKitView-n5K3qyUW.js

@@ -0,0 +1,276 @@
+import { defineComponent as O, ref as S, computed as z, onMounted as V, onScopeDispose as G, resolveComponent as y, openBlock as l, createElementBlock as r, createElementVNode as t, unref as a, createTextVNode as p, createBlock as f, Teleport as Y, toDisplayString as c, createCommentVNode as d, createVNode as b, withCtx as k, normalizeStyle as _, normalizeClass as J, Fragment as g, renderList as C, withDirectives as D, vModelText as K } from "vue";
+import { _ as j, B as q } from "./BrandFontPicker-Ud9cZQm1.js";
+import { useRouter as Q, onBeforeRouteLeave as W } from "vue-router";
+import { useDialog as X, useSnackbar as ee } from "@feedmepos/ui-library";
+import { a as te, C as M, t as $, F as ae, u as se, i as oe } from "./useBrandKit-DDqx19_h.js";
+import { _ as ne } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const E = "data:image/svg+xml,%3csvg%20preserveAspectRatio='none'%20overflow='visible'%20style='display:%20block;'%20width='14.9999'%20height='13.75'%20viewBox='0%200%2014.9999%2013.75'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Group%201197147821'%3e%3cpath%20id='Ellipse%201329'%20d='M12.5%206.875C12.5%203.42322%209.84169%200.625%206.5625%200.625C3.28331%200.625%200.625%203.42322%200.625%206.875C0.625%2010.3268%203.28331%2013.125%206.5625%2013.125'%20stroke='%23B2B3B6'%20stroke-width='1.25'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cg%20id='Group%201197147762'%3e%3cpath%20id='Line%20297'%20d='M10.4952%206.53566C10.2511%206.2916%2010.2511%205.89592%2010.4953%205.65189C10.7394%205.40785%2011.1352%205.40787%2011.3793%205.65193L10.9372%206.0938L10.4952%206.53566ZM13.0982%207.37064C13.3423%207.6147%2013.3423%208.01038%2013.0982%208.25441C12.854%208.49845%2012.4583%208.49843%2012.2142%208.25437L12.6562%207.8125L13.0982%207.37064ZM10.9372%206.0938L11.3793%205.65193L13.0982%207.37064L12.6562%207.8125L12.2142%208.25437L10.4952%206.53566L10.9372%206.0938Z'%20fill='%23B2B3B6'/%3e%3cpath%20id='Line%20298'%20d='M13.0982%208.25433C12.8542%208.49841%2012.4584%208.49846%2012.2143%208.25444C11.9701%208.01042%2011.9701%207.61475%2012.2141%207.37067L12.6562%207.8125L13.0982%208.25433ZM13.9328%205.65201C14.1769%205.40793%2014.5727%205.40788%2014.8168%205.6519C15.0609%205.89592%2015.061%206.29159%2014.8169%206.53567L14.3749%206.09384L13.9328%205.65201ZM12.6562%207.8125L12.2141%207.37067L13.9328%205.65201L14.3749%206.09384L14.8169%206.53567L13.0982%208.25433L12.6562%207.8125Z'%20fill='%23B2B3B6'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e", le = { class: "portal-page bg-portal-bg-canvas text-portal-text-primary" }, re = { class: "portal-page-inner brand-page" }, ie = { class: "portal-page-heading" }, de = { class: "brand-help" }, ue = { class: "brand-actions" }, pe = {
+  key: 0,
+  class: "brand-unsaved"
+}, ce = {
+  key: 1,
+  class: "portal-notice"
+}, ve = {
+  key: 2,
+  class: "portal-loading",
+  role: "status"
+}, be = {
+  key: 3,
+  role: "alert",
+  class: "portal-section portal-error"
+}, me = {
+  key: 4,
+  role: "status"
+}, ge = { class: "portal-section" }, he = { class: "portal-section-head" }, ye = { class: "brand-reset-content fm-typo-en-body-lg-600" }, fe = { class: "brand-color-grid" }, ke = ["value", "aria-label", "disabled", "onInput"], _e = { class: "brand-field-label" }, Ce = ["onUpdate:modelValue", "aria-label", "aria-invalid", "disabled"], Be = {
+  key: 0,
+  class: "portal-error"
+}, xe = { class: "brand-advanced" }, Le = { class: "brand-role-grid" }, we = ["value", "aria-label", "disabled", "onInput"], Fe = ["onUpdate:modelValue", "aria-label", "aria-invalid", "disabled"], Ae = { class: "portal-section" }, Ie = { class: "portal-section-head" }, Se = { class: "brand-reset-content fm-typo-en-body-lg-600" }, Ve = { class: "brand-font-grid" }, De = /* @__PURE__ */ O({
+  __name: "BrandKitView",
+  setup(Ke) {
+    const e = se(), v = te(), B = X(), T = ee(), x = S(!1), R = Q(), u = S(!1), L = ["primary", "secondary", "accent", "background.base", "text.primary"], N = L.map((n) => M.find((s) => s.path === n)), P = M.filter((n) => !L.includes(n.path)), w = z(
+      () => !v.value || !e.state.loaded || e.state.loading || e.state.saving || e.hasInvalidColor.value || e.dirtyCount.value === 0
+    ), h = (n) => !!(e.state.colors[n] && !oe(e.state.colors[n]));
+    function F(n, s) {
+      e.state.colors[n] = s.target.value, u.value = !1;
+    }
+    function A(n) {
+      e.resetToDefault(n), u.value = !1;
+    }
+    function U() {
+      B.open({
+        title: "Save the live Brand Kit?",
+        message: "Colors and fonts are shared business settings. Apps using this kit pick up the change immediately. This does not build or publish application code.",
+        dismissAway: !0,
+        primaryActions: { text: "Save Brand Kit", close: !0 },
+        secondaryActions: { text: "Cancel", close: !0 }
+      }).onPrimary(() => {
+        e.save().then(() => {
+          u.value = !0;
+        }).catch(() => {
+          u.value = !1;
+        });
+      });
+    }
+    V(() => {
+      x.value = !0, e.load();
+    });
+    function I(n) {
+      !e.dirtyCount.value && !e.state.saving || (n.preventDefault(), n.returnValue = "");
+    }
+    return V(() => window.addEventListener("beforeunload", I)), G(() => window.removeEventListener("beforeunload", I)), W((n) => e.state.saving ? !1 : e.dirtyCount.value ? (B.open({
+      title: "Discard unsaved Brand Kit changes?",
+      message: "Your live Brand Kit has not changed. Leave this page and discard the changes you have not saved?",
+      dismissAway: !0,
+      primaryActions: { text: "Discard and leave", close: !0 },
+      secondaryActions: { text: "Keep editing", close: !0 }
+    }).onPrimary(() => {
+      e.discardEdits(), R.push(n);
+    }), !1) : !0), (n, s) => {
+      const Z = y("FmIcon"), m = y("FmButton"), H = y("FmCircularProgress");
+      return l(), r("div", le, [
+        t("div", re, [
+          t("header", ie, [
+            s[7] || (s[7] = t("div", null, [
+              t("p", { class: "portal-eyebrow" }, "Applies to every surface"),
+              t("h1", null, "Your Business Identity")
+            ], -1)),
+            t("div", de, [
+              s[6] || (s[6] = t("span", null, "Need help on brand kit?", -1)),
+              t("button", {
+                class: "brand-ask-remy",
+                type: "button",
+                onClick: s[0] || (s[0] = (o) => a(T).open({ message: "Coming soon" }, 3e3))
+              }, [...s[5] || (s[5] = [
+                t("img", {
+                  src: j,
+                  alt: "",
+                  width: "20",
+                  height: "20"
+                }, null, -1),
+                p(" Ask Remy ", -1)
+              ])])
+            ])
+          ]),
+          x.value ? (l(), f(Y, {
+            key: 0,
+            to: "#portal-page-actions"
+          }, [
+            t("div", ue, [
+              a(e).dirtyCount.value ? (l(), r("span", pe, c(a(e).dirtyCount.value) + " unsaved", 1)) : d("", !0),
+              b(m, {
+                label: "Save",
+                disabled: w.value,
+                loading: a(e).state.saving,
+                onClick: U
+              }, {
+                default: k(() => [
+                  t("span", {
+                    class: J(["brand-save-content fm-typo-en-body-lg-600", { invisible: a(e).state.saving }]),
+                    style: _({ color: w.value ? "var(--fm-color-neutral-gray-200)" : "var(--fm-color-neutral-white)" })
+                  }, [
+                    b(Z, {
+                      name: "save",
+                      "aria-hidden": "true",
+                      style: { color: "inherit", fontSize: "20px", width: "20px", height: "20px", lineHeight: "20px", flex: "0 0 20px" }
+                    }),
+                    s[8] || (s[8] = p(" Save ", -1))
+                  ], 6)
+                ]),
+                _: 1
+              }, 8, ["disabled", "loading"])
+            ])
+          ])) : d("", !0),
+          a(v) ? d("", !0) : (l(), r("p", ce, " You can view this Brand Kit, but need Brand Kit management permission to save changes. ")),
+          a(e).state.loading ? (l(), r("div", ve, [
+            b(H, { size: "xl" }),
+            s[9] || (s[9] = p("Loading Brand Kit… ", -1))
+          ])) : d("", !0),
+          a(e).state.error ? (l(), r("div", be, [
+            t("p", null, c(a(e).state.error), 1),
+            a(e).state.loaded ? d("", !0) : (l(), f(m, {
+              key: 0,
+              label: "Try again",
+              variant: "secondary",
+              onClick: s[1] || (s[1] = (o) => a(e).load(!0))
+            }))
+          ])) : d("", !0),
+          u.value && !a(e).dirtyCount.value && !a(e).state.error ? (l(), r("p", me, " Brand Kit saved. Apps using this kit can now pick up the changes. ")) : d("", !0),
+          a(e).state.loaded && !a(e).state.loading ? (l(), r(g, { key: 5 }, [
+            t("section", ge, [
+              t("div", he, [
+                s[11] || (s[11] = t("div", null, [
+                  t("h2", null, "Colors"),
+                  t("p", { class: "portal-description" }, "The colors that represent your brand identity.")
+                ], -1)),
+                b(m, {
+                  label: "Reset to default",
+                  class: "brand-reset-button",
+                  variant: "tertiary",
+                  disabled: !a(v) || a(e).state.saving || a(e).colorsAreDefault.value,
+                  onClick: s[2] || (s[2] = (o) => A("colors"))
+                }, {
+                  default: k(() => [
+                    t("span", ye, [
+                      t("span", {
+                        class: "brand-reset-icon",
+                        style: _({ maskImage: `url(${JSON.stringify(a(E))})` }),
+                        "aria-hidden": "true"
+                      }, null, 4),
+                      s[10] || (s[10] = p(" Reset to default ", -1))
+                    ])
+                  ]),
+                  _: 1
+                }, 8, ["disabled"])
+              ]),
+              t("div", fe, [
+                (l(!0), r(g, null, C(a(N), (o) => (l(), r("label", {
+                  key: o.path,
+                  class: "brand-color-card"
+                }, [
+                  t("input", {
+                    type: "color",
+                    value: a($)(a(e).state.colors[o.path] ?? ""),
+                    "aria-label": `${o.label} color picker`,
+                    disabled: a(e).state.saving,
+                    onInput: (i) => F(o.path, i)
+                  }, null, 40, ke),
+                  t("span", _e, c(o.path === "background.base" ? "Background" : o.path === "text.primary" ? "Text" : o.label), 1),
+                  D(t("input", {
+                    "onUpdate:modelValue": (i) => a(e).state.colors[o.path] = i,
+                    class: "brand-value",
+                    "aria-label": `${o.path} hex color`,
+                    "aria-invalid": h(o.path),
+                    disabled: a(e).state.saving,
+                    placeholder: "App default",
+                    spellcheck: "false"
+                  }, null, 8, Ce), [
+                    [K, a(e).state.colors[o.path]]
+                  ]),
+                  h(o.path) ? (l(), r("small", Be, "Enter a hex color")) : d("", !0)
+                ]))), 128))
+              ]),
+              t("details", xe, [
+                s[12] || (s[12] = t("summary", null, [
+                  p("More color roles "),
+                  t("span", null, "Keep control of text, surfaces and status colors")
+                ], -1)),
+                s[13] || (s[13] = t("p", { class: "portal-description" }, " Each role is saved independently. Changing a brand color does not automatically replace text or status colors. ", -1)),
+                t("div", Le, [
+                  (l(!0), r(g, null, C(a(P), (o) => (l(), r("label", {
+                    key: o.path
+                  }, [
+                    t("span", null, c(o.group) + " · " + c(o.label), 1),
+                    t("div", null, [
+                      t("input", {
+                        type: "color",
+                        value: a($)(a(e).state.colors[o.path] ?? ""),
+                        "aria-label": `${o.path} color picker`,
+                        disabled: a(e).state.saving,
+                        onInput: (i) => F(o.path, i)
+                      }, null, 40, we),
+                      D(t("input", {
+                        "onUpdate:modelValue": (i) => a(e).state.colors[o.path] = i,
+                        "aria-label": `${o.path} hex color`,
+                        "aria-invalid": h(o.path),
+                        disabled: a(e).state.saving,
+                        class: "brand-value",
+                        placeholder: "App default",
+                        spellcheck: "false"
+                      }, null, 8, Fe), [
+                        [K, a(e).state.colors[o.path]]
+                      ])
+                    ]),
+                    t("small", null, c(o.hint), 1)
+                  ]))), 128))
+                ])
+              ])
+            ]),
+            t("section", Ae, [
+              t("div", Ie, [
+                s[15] || (s[15] = t("div", null, [
+                  t("h2", null, "Typeface"),
+                  t("p", { class: "portal-description" }, "Fonts used in your interfaces.")
+                ], -1)),
+                b(m, {
+                  label: "Reset to default",
+                  class: "brand-reset-button",
+                  variant: "tertiary",
+                  disabled: !a(v) || a(e).state.saving || a(e).fontsAreDefault.value,
+                  onClick: s[3] || (s[3] = (o) => A("fonts"))
+                }, {
+                  default: k(() => [
+                    t("span", Se, [
+                      t("span", {
+                        class: "brand-reset-icon",
+                        style: _({ maskImage: `url(${JSON.stringify(a(E))})` }),
+                        "aria-hidden": "true"
+                      }, null, 4),
+                      s[14] || (s[14] = p(" Reset to default ", -1))
+                    ])
+                  ]),
+                  _: 1
+                }, 8, ["disabled"])
+              ]),
+              t("div", Ve, [
+                (l(!0), r(g, null, C(a(ae), (o) => (l(), f(q, {
+                  key: o.path,
+                  modelValue: a(e).state.fonts[o.path],
+                  "onUpdate:modelValue": [
+                    (i) => a(e).state.fonts[o.path] = i,
+                    s[4] || (s[4] = (i) => u.value = !1)
+                  ],
+                  label: o.label === "Heading" ? "Headings" : o.label,
+                  disabled: !a(v) || a(e).state.saving
+                }, null, 8, ["modelValue", "onUpdate:modelValue", "label", "disabled"]))), 128))
+              ]),
+              s[16] || (s[16] = t("p", { class: "portal-description brand-font-help" }, "Supported by Google Fonts", -1))
+            ])
+          ], 64)) : d("", !0)
+        ])
+      ]);
+    };
+  }
+}), Pe = /* @__PURE__ */ ne(De, [["__scopeId", "data-v-08bc09ca"]]);
+export {
+  Pe as default
+};