@feedmepos/mf-miniprogram-v2 0.2.8-dev.2 → 0.2.8-dev.20
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.
- package/dist/{App-C8Vn8LvE.js → App-dgkwfArX.js} +337 -338
- package/dist/{BrandFontPicker-JHyoGusq.js → BrandFontPicker-CF3O3meB.js} +1 -1
- package/dist/BrandKitView-CdLMBZKd.js +276 -0
- package/dist/ControlPlaneView-fc2wIqfk.js +27162 -0
- package/dist/{EcosystemView-XP9IZ9wn.js → EcosystemView-DHtS5IDN.js} +115 -93
- package/dist/MobileProjectDialog-Bt6r-bHC.js +446 -0
- package/dist/MobileProjectsView-Dvj7YKlO.js +237 -0
- package/dist/ModuleCenterView-t8rhd419.js +283 -0
- package/dist/ModuleDetailView-CcqJ4Hfu.js +296 -0
- package/dist/{PagesView-DzDqCd8N.js → PagesView-D0RMTyqw.js} +2 -2
- package/dist/{PlatformUnavailableView-CdHjkolw.js → PlatformUnavailableView-OHEJAztd.js} +1 -1
- package/dist/{PortalSettingsView-Df5jChmi.js → PortalSettingsView-B68s6fiS.js} +3 -3
- package/dist/StatusBadge.vue_vue_type_script_setup_true_lang-DMm_s9ua.js +41 -0
- package/dist/TemplateCenterView-Cpr39Y5S.js +515 -0
- package/dist/{WorkspaceEntryView-DQkYJWdf.js → WorkspaceEntryView-gM7RX5BV.js} +2 -2
- package/dist/app.js +15 -15
- package/dist/{controlPlane-sXaC6pAh.js → controlPlane-DR5ykj4d.js} +8 -8
- package/dist/{adminAccess-D2K-L-Vt.js → localPreference-Do4VKtxT.js} +35 -35
- package/dist/package.json +1 -1
- package/dist/{portalContext-DV-6uUwp.js → portalContext-BeKN8Bcx.js} +2 -2
- package/dist/portalNavigation-DLcC7Koh.js +43 -0
- package/dist/{routes-CeuodIgg.js → routes-B9oMJsaM.js} +45 -27
- package/dist/style.css +1 -1
- package/dist/{useBrandKit-CXLIXo5j.js → useBrandKit-MkgkEuIX.js} +265 -233
- package/dist/useModuleCatalog-Daw8KA--.js +147 -0
- package/package.json +1 -1
- package/dist/AppTemplatePicker.vue_vue_type_script_setup_true_lang-LE_aKvfg.js +0 -198
- package/dist/BrandKitView-Dlt_ifI0.js +0 -249
- package/dist/ControlPlaneView-qDA8RgiR.js +0 -25317
- package/dist/MobileProjectsView-aAyHV5G-.js +0 -333
- package/dist/ModuleCenterView-C6mCPATr.js +0 -147
- package/dist/ModuleDetailView-CSfMF0Uo.js +0 -189
- package/dist/StatusBadge.vue_vue_type_script_setup_true_lang-CMgQ0bd_.js +0 -30
- package/dist/TemplateCenterView-DrWImUYO.js +0 -425
- package/dist/portalNavigation-C29ihtq_.js +0 -38
- package/dist/useModuleCatalog-Cep-pzWO.js +0 -124
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
import { defineComponent as E, resolveComponent as g, openBlock as p, createElementBlock as v, createVNode as M, createElementVNode as x, normalizeClass as P, toDisplayString as w, createCommentVNode as b, createBlock as _, shallowReadonly as c, ref as m } from "vue";
|
|
2
|
+
import { a as C } from "./routes-B9oMJsaM.js";
|
|
3
|
+
import { c as F, e as $, f as L } from "./controlPlane-DR5ykj4d.js";
|
|
4
|
+
function R(e, t) {
|
|
5
|
+
const n = t.trim().toLowerCase();
|
|
6
|
+
return e.filter((r) => n ? [r.name, r.description ?? "", r.slot ?? "", ...r.labels ?? []].join(" ").toLowerCase().includes(n) : !0);
|
|
7
|
+
}
|
|
8
|
+
function S(e) {
|
|
9
|
+
const t = e.replace(/([a-z0-9])([A-Z])/g, "$1 $2");
|
|
10
|
+
return t.charAt(0).toUpperCase() + t.slice(1);
|
|
11
|
+
}
|
|
12
|
+
function z(e) {
|
|
13
|
+
return e.slot ?? `__ungrouped-component:${e.name}`;
|
|
14
|
+
}
|
|
15
|
+
function U(e) {
|
|
16
|
+
const t = /* @__PURE__ */ new Map(), n = [];
|
|
17
|
+
for (const o of e) {
|
|
18
|
+
const a = o.group ?? null;
|
|
19
|
+
let l = t.get(a);
|
|
20
|
+
l || (l = /* @__PURE__ */ new Map(), t.set(a, l), n.push(a));
|
|
21
|
+
const s = z(o);
|
|
22
|
+
let d = l.get(s);
|
|
23
|
+
d || (d = {
|
|
24
|
+
key: s,
|
|
25
|
+
slot: o.slot,
|
|
26
|
+
label: o.componentLabel ?? (o.slot ? S(o.slot) : o.styleLabel ?? o.description ?? o.name),
|
|
27
|
+
styles: []
|
|
28
|
+
}, l.set(s, d)), d.styles.push(o);
|
|
29
|
+
}
|
|
30
|
+
return [...n].sort((o, a) => o === a ? 0 : o === null ? 1 : a === null ? -1 : o.localeCompare(a)).map((o) => ({ group: o, components: [...t.get(o).values()] }));
|
|
31
|
+
}
|
|
32
|
+
function A(e) {
|
|
33
|
+
const t = e.components.length, n = e.components.reduce((r, o) => r + o.styles.length, 0);
|
|
34
|
+
return `${t} component${t === 1 ? "" : "s"} · ${n} style${n === 1 ? "" : "s"}`;
|
|
35
|
+
}
|
|
36
|
+
function G(e, t) {
|
|
37
|
+
const n = /* @__PURE__ */ new Map();
|
|
38
|
+
let r = 0;
|
|
39
|
+
for (const l of e) {
|
|
40
|
+
const s = l[t];
|
|
41
|
+
s ? n.set(s, (n.get(s) ?? 0) + 1) : r += 1;
|
|
42
|
+
}
|
|
43
|
+
const o = [...n.entries()].sort((l, s) => l[0].localeCompare(s[0])).map(([l, s]) => ({ value: l, count: s }));
|
|
44
|
+
return { total: o.reduce((l, s) => l + s.count, 0), chips: o, unsetCount: r };
|
|
45
|
+
}
|
|
46
|
+
function J(e) {
|
|
47
|
+
const t = e.slot ? ` It is published to fill the ${e.slot} slot.` : "";
|
|
48
|
+
return `Use the block-swap skill. Put the library module ${e.id} on the page, replacing whatever currently fills its slot.${t} Its source is already in this workspace at src/components/library/${e.name}/. Copy that directory to src/components/blocks/${e.name}/ and point the view there — the library directory is delivered per workspace and is not committed, so a view importing from it builds in the workspace and fails the release build. Tell me which page you changed.`;
|
|
49
|
+
}
|
|
50
|
+
function K(e, t) {
|
|
51
|
+
if (!e.includes("</head>")) return e;
|
|
52
|
+
const n = JSON.stringify(t).replace(/</g, "\\u003c");
|
|
53
|
+
return e.replace("</head>", `<script>window.__FM_PREVIEW_MODULE__=${n}<\/script></head>`);
|
|
54
|
+
}
|
|
55
|
+
function T(e, t) {
|
|
56
|
+
if (!e.includes("</head>")) return e;
|
|
57
|
+
const n = JSON.stringify(t).replace(/</g, "\\u003c");
|
|
58
|
+
return e.replace("</head>", `<script>window.__FM_PREVIEW_MODULES__=${n}<\/script></head>`);
|
|
59
|
+
}
|
|
60
|
+
const B = { class: "flex min-h-0 flex-1 flex-col items-center justify-center gap-8 p-24 text-center" }, I = {
|
|
61
|
+
key: 0,
|
|
62
|
+
class: "m-0 max-w-[46ch] fm-typo-en-body-sm-400 text-portal-text-muted"
|
|
63
|
+
}, W = /* @__PURE__ */ E({
|
|
64
|
+
__name: "ModuleEmptyState",
|
|
65
|
+
props: {
|
|
66
|
+
icon: {},
|
|
67
|
+
title: {},
|
|
68
|
+
message: {},
|
|
69
|
+
actionLabel: {},
|
|
70
|
+
tone: {}
|
|
71
|
+
},
|
|
72
|
+
emits: ["action"],
|
|
73
|
+
setup(e) {
|
|
74
|
+
return (t, n) => {
|
|
75
|
+
const r = g("FmIcon"), o = g("FmButton");
|
|
76
|
+
return p(), v("div", B, [
|
|
77
|
+
M(r, {
|
|
78
|
+
name: e.icon,
|
|
79
|
+
size: "xl",
|
|
80
|
+
color: e.tone === "error" ? "typo-warning" : "neutral-gray-300"
|
|
81
|
+
}, null, 8, ["name", "color"]),
|
|
82
|
+
x("p", {
|
|
83
|
+
class: P(["m-0 fm-typo-en-body-md-600", e.tone === "error" ? "text-fm-color-typo-warning" : "text-fm-color-typo-secondary"])
|
|
84
|
+
}, w(e.title), 3),
|
|
85
|
+
e.message ? (p(), v("p", I, w(e.message), 1)) : b("", !0),
|
|
86
|
+
e.actionLabel ? (p(), _(o, {
|
|
87
|
+
key: 1,
|
|
88
|
+
size: "md",
|
|
89
|
+
variant: "secondary",
|
|
90
|
+
label: e.actionLabel,
|
|
91
|
+
onClick: n[0] || (n[0] = (a) => t.$emit("action"))
|
|
92
|
+
}, null, 8, ["label"])) : b("", !0)
|
|
93
|
+
]);
|
|
94
|
+
};
|
|
95
|
+
}
|
|
96
|
+
}), u = m(null), f = m(null), y = m(!1), k = m(null), h = m(null);
|
|
97
|
+
let i = null;
|
|
98
|
+
async function D() {
|
|
99
|
+
f.value = null, y.value = !1;
|
|
100
|
+
try {
|
|
101
|
+
const e = await F(C.componentLibraryCatalog());
|
|
102
|
+
u.value = e.components ?? [];
|
|
103
|
+
} catch (e) {
|
|
104
|
+
const t = $(e);
|
|
105
|
+
u.value = [], t.includes("no component library has been published") ? y.value = !0 : f.value = t || "Could not load the module library.";
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
async function N() {
|
|
109
|
+
h.value = null;
|
|
110
|
+
try {
|
|
111
|
+
k.value = await L(C.componentLibraryPreview());
|
|
112
|
+
} catch (e) {
|
|
113
|
+
h.value = $(e) || "Could not load the preview document.";
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
function Z() {
|
|
117
|
+
function e(n = !1) {
|
|
118
|
+
return !n && (u.value !== null || i) ? i ?? Promise.resolve() : (i = Promise.all([D(), N()]).then(() => {
|
|
119
|
+
}).finally(() => {
|
|
120
|
+
i = null;
|
|
121
|
+
}), i);
|
|
122
|
+
}
|
|
123
|
+
function t(n) {
|
|
124
|
+
var r;
|
|
125
|
+
return ((r = u.value) == null ? void 0 : r.find((o) => o.name === n)) ?? null;
|
|
126
|
+
}
|
|
127
|
+
return {
|
|
128
|
+
entries: c(u),
|
|
129
|
+
loadError: c(f),
|
|
130
|
+
unpublished: c(y),
|
|
131
|
+
previewDocument: c(k),
|
|
132
|
+
previewError: c(h),
|
|
133
|
+
load: e,
|
|
134
|
+
find: t
|
|
135
|
+
};
|
|
136
|
+
}
|
|
137
|
+
export {
|
|
138
|
+
W as _,
|
|
139
|
+
A as a,
|
|
140
|
+
K as b,
|
|
141
|
+
R as f,
|
|
142
|
+
U as g,
|
|
143
|
+
T as i,
|
|
144
|
+
J as m,
|
|
145
|
+
G as s,
|
|
146
|
+
Z as u
|
|
147
|
+
};
|
package/package.json
CHANGED
|
@@ -1,198 +0,0 @@
|
|
|
1
|
-
import { defineComponent as k, computed as x, openBlock as a, createElementBlock as l, createStaticVNode as m, createCommentVNode as p, createElementVNode as e, createVNode as b, toDisplayString as h, Fragment as w, renderList as _, normalizeClass as y } from "vue";
|
|
2
|
-
function K(t) {
|
|
3
|
-
return t === "active" ? "success" : t === "needs_attention" ? "warning" : "neutral";
|
|
4
|
-
}
|
|
5
|
-
function O(t) {
|
|
6
|
-
return t === "active" ? "Active" : t === "needs_attention" ? "Needs attention" : "Archived";
|
|
7
|
-
}
|
|
8
|
-
function X(t) {
|
|
9
|
-
return t === "succeeded" ? "success" : t === "failed" ? "error" : t === "queued" || t === "running" ? "info" : "neutral";
|
|
10
|
-
}
|
|
11
|
-
function Y(t) {
|
|
12
|
-
switch (t) {
|
|
13
|
-
case "queued":
|
|
14
|
-
return "Queued";
|
|
15
|
-
case "running":
|
|
16
|
-
return "Running";
|
|
17
|
-
case "succeeded":
|
|
18
|
-
return "Built";
|
|
19
|
-
case "failed":
|
|
20
|
-
return "Build failed";
|
|
21
|
-
default:
|
|
22
|
-
return "No build yet";
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
function Z(t) {
|
|
26
|
-
switch (t) {
|
|
27
|
-
case "ready":
|
|
28
|
-
return "Ready";
|
|
29
|
-
case "provisioning":
|
|
30
|
-
return "Setting up";
|
|
31
|
-
case "failed":
|
|
32
|
-
return "Setup failed";
|
|
33
|
-
default:
|
|
34
|
-
return "Not set up";
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
const C = ["preview", "published", "rolled_back"];
|
|
38
|
-
function tt(t) {
|
|
39
|
-
return C.includes(t.status);
|
|
40
|
-
}
|
|
41
|
-
function et(t) {
|
|
42
|
-
return t.is_live === 1 ? "Live" : t.build_status === "queued" || t.build_status === "running" ? "Building" : t.build_status === "failed" ? "Failed" : t.build_status === "succeeded" ? "Ready" : "Draft";
|
|
43
|
-
}
|
|
44
|
-
function rt(t) {
|
|
45
|
-
return t.is_live === 1 ? "primary" : t.build_status === "succeeded" ? "success" : t.build_status === "queued" || t.build_status === "running" ? "info" : t.build_status === "failed" ? "error" : "neutral";
|
|
46
|
-
}
|
|
47
|
-
const A = {
|
|
48
|
-
key: 0,
|
|
49
|
-
viewBox: "0 0 56 96",
|
|
50
|
-
class: "h-[72px] w-[42px] shrink-0 rounded-[6px] border border-portal-border-default bg-portal-bg-default",
|
|
51
|
-
"aria-hidden": "true",
|
|
52
|
-
focusable: "false"
|
|
53
|
-
}, E = {
|
|
54
|
-
key: 0,
|
|
55
|
-
fill: "currentColor",
|
|
56
|
-
class: "text-fm-color-neutral-gray-300"
|
|
57
|
-
}, B = {
|
|
58
|
-
key: 1,
|
|
59
|
-
fill: "currentColor",
|
|
60
|
-
class: "text-fm-color-neutral-gray-300"
|
|
61
|
-
}, L = {
|
|
62
|
-
key: 2,
|
|
63
|
-
fill: "currentColor",
|
|
64
|
-
class: "text-fm-color-neutral-gray-300"
|
|
65
|
-
}, v = /* @__PURE__ */ k({
|
|
66
|
-
__name: "AppTemplateThumbnail",
|
|
67
|
-
props: {
|
|
68
|
-
restaurantStyle: {}
|
|
69
|
-
},
|
|
70
|
-
setup(t) {
|
|
71
|
-
const d = t, u = x(
|
|
72
|
-
() => d.restaurantStyle === "qsr" || d.restaurantStyle === "coffee" || d.restaurantStyle === "tea"
|
|
73
|
-
);
|
|
74
|
-
return (g, o) => u.value ? (a(), l("svg", A, [
|
|
75
|
-
t.restaurantStyle === "qsr" ? (a(), l("g", E, [...o[0] || (o[0] = [
|
|
76
|
-
m('<rect x="6" y="7" width="44" height="6" rx="3"></rect><rect x="6" y="18" width="19" height="18" rx="2"></rect><rect x="31" y="18" width="19" height="18" rx="2"></rect><rect x="6" y="40" width="19" height="18" rx="2"></rect><rect x="31" y="40" width="19" height="18" rx="2"></rect><rect x="6" y="62" width="19" height="18" rx="2"></rect><rect x="31" y="62" width="19" height="18" rx="2"></rect><rect x="6" y="85" width="44" height="7" rx="3.5" class="text-fm-color-neutral-gray-400"></rect>', 8)
|
|
77
|
-
])])) : t.restaurantStyle === "coffee" ? (a(), l("g", B, [...o[1] || (o[1] = [
|
|
78
|
-
m('<rect x="6" y="7" width="44" height="30" rx="3"></rect><rect x="6" y="43" width="26" height="4" rx="2"></rect><rect x="6" y="53" width="44" height="12" rx="2"></rect><rect x="6" y="69" width="44" height="12" rx="2"></rect><rect x="6" y="87" width="18" height="4" rx="2"></rect>', 5)
|
|
79
|
-
])])) : (a(), l("g", L, [...o[2] || (o[2] = [
|
|
80
|
-
m('<rect x="6" y="7" width="44" height="5" rx="2.5"></rect><rect x="6" y="17" width="44" height="9" rx="2"></rect><rect x="6" y="28" width="9" height="4" rx="2" class="text-fm-color-neutral-gray-400"></rect><rect x="18" y="28" width="9" height="4" rx="2" class="text-fm-color-neutral-gray-400"></rect><rect x="30" y="28" width="9" height="4" rx="2" class="text-fm-color-neutral-gray-400"></rect><rect x="6" y="38" width="44" height="9" rx="2"></rect><rect x="6" y="49" width="9" height="4" rx="2" class="text-fm-color-neutral-gray-400"></rect><rect x="18" y="49" width="9" height="4" rx="2" class="text-fm-color-neutral-gray-400"></rect><rect x="6" y="59" width="44" height="9" rx="2"></rect><rect x="6" y="70" width="9" height="4" rx="2" class="text-fm-color-neutral-gray-400"></rect><rect x="18" y="70" width="9" height="4" rx="2" class="text-fm-color-neutral-gray-400"></rect><rect x="30" y="70" width="9" height="4" rx="2" class="text-fm-color-neutral-gray-400"></rect><rect x="6" y="80" width="44" height="9" rx="2"></rect>', 13)
|
|
81
|
-
])]))
|
|
82
|
-
])) : p("", !0);
|
|
83
|
-
}
|
|
84
|
-
}), N = {
|
|
85
|
-
key: 0,
|
|
86
|
-
class: "rounded-lg border border-portal-border-default bg-portal-bg-default p-16"
|
|
87
|
-
}, T = { class: "mt-12 flex items-start gap-12" }, q = { class: "min-w-0 max-w-[640px] flex-1" }, $ = { class: "m-0 fm-typo-en-body-md-600 text-portal-text-primary" }, D = { class: "m-0 mt-4 fm-typo-en-body-sm-400 text-portal-text-muted" }, R = {
|
|
88
|
-
key: 1,
|
|
89
|
-
class: "rounded-lg border border-portal-border-default bg-portal-bg-default p-16"
|
|
90
|
-
}, P = { class: "mt-12 max-w-[640px]" }, F = {
|
|
91
|
-
key: 0,
|
|
92
|
-
class: "m-0 mb-8 fm-typo-en-body-sm-600 uppercase tracking-wide text-portal-text-muted"
|
|
93
|
-
}, I = { class: "flex flex-col gap-8" }, j = ["aria-checked", "disabled", "onClick"], z = {
|
|
94
|
-
key: 0,
|
|
95
|
-
class: "h-[6px] w-[6px] rounded-full bg-portal-bg-default"
|
|
96
|
-
}, H = { class: "min-w-0 max-w-[640px] flex-1" }, M = { class: "flex flex-wrap items-center gap-8" }, Q = { class: "fm-typo-en-body-md-600 text-portal-text-primary" }, U = {
|
|
97
|
-
key: 0,
|
|
98
|
-
class: "rounded-full bg-portal-bg-canvas px-8 py-[2px] fm-typo-en-body-sm-400 text-portal-text-muted"
|
|
99
|
-
}, W = { class: "mt-4 block fm-typo-en-body-sm-400 text-portal-text-muted" }, st = /* @__PURE__ */ k({
|
|
100
|
-
__name: "AppTemplatePicker",
|
|
101
|
-
props: {
|
|
102
|
-
templates: {},
|
|
103
|
-
modelValue: {},
|
|
104
|
-
disabled: { type: Boolean }
|
|
105
|
-
},
|
|
106
|
-
emits: ["update:modelValue"],
|
|
107
|
-
setup(t, { emit: d }) {
|
|
108
|
-
const u = t, g = d, o = x(() => u.templates.length > 1), f = x(() => u.templates.length === 1 ? u.templates[0] : null), S = x(() => {
|
|
109
|
-
const c = [], n = /* @__PURE__ */ new Map();
|
|
110
|
-
for (const r of u.templates) {
|
|
111
|
-
if (!r.industries.length) {
|
|
112
|
-
c.push(r);
|
|
113
|
-
continue;
|
|
114
|
-
}
|
|
115
|
-
for (const i of r.industries) {
|
|
116
|
-
const s = n.get(i) ?? [];
|
|
117
|
-
s.push(r), n.set(i, s);
|
|
118
|
-
}
|
|
119
|
-
}
|
|
120
|
-
return [
|
|
121
|
-
...c.length ? [{ label: null, templates: c }] : [],
|
|
122
|
-
...[...n.entries()].sort(([r], [i]) => r.localeCompare(i)).map(([r, i]) => ({ label: r, templates: i }))
|
|
123
|
-
];
|
|
124
|
-
});
|
|
125
|
-
function V(c) {
|
|
126
|
-
u.disabled || g("update:modelValue", c);
|
|
127
|
-
}
|
|
128
|
-
return (c, n) => f.value ? (a(), l("section", N, [
|
|
129
|
-
n[0] || (n[0] = e("p", { class: "m-0 fm-typo-en-body-md-600 text-portal-text-primary" }, "App template", -1)),
|
|
130
|
-
e("div", T, [
|
|
131
|
-
b(v, {
|
|
132
|
-
"restaurant-style": f.value.restaurantStyle
|
|
133
|
-
}, null, 8, ["restaurant-style"]),
|
|
134
|
-
e("div", q, [
|
|
135
|
-
e("p", $, h(f.value.label), 1),
|
|
136
|
-
e("p", D, h(f.value.description), 1)
|
|
137
|
-
])
|
|
138
|
-
])
|
|
139
|
-
])) : o.value ? (a(), l("section", R, [
|
|
140
|
-
n[1] || (n[1] = e("p", { class: "m-0 fm-typo-en-body-md-600 text-portal-text-primary" }, "App template", -1)),
|
|
141
|
-
n[2] || (n[2] = e("p", { class: "m-0 mt-4 fm-typo-en-body-sm-400 text-portal-text-muted" }, " Choose how this app looks and works for your customers. This cannot be changed after setup. ", -1)),
|
|
142
|
-
e("div", P, [
|
|
143
|
-
(a(!0), l(w, null, _(S.value, (r, i) => (a(), l("div", {
|
|
144
|
-
key: r.label ?? "__general",
|
|
145
|
-
role: "radiogroup",
|
|
146
|
-
"aria-label": "App template",
|
|
147
|
-
class: y(i === 0 ? "" : "mt-16")
|
|
148
|
-
}, [
|
|
149
|
-
r.label ? (a(), l("p", F, h(r.label), 1)) : p("", !0),
|
|
150
|
-
e("div", I, [
|
|
151
|
-
(a(!0), l(w, null, _(r.templates, (s) => (a(), l("button", {
|
|
152
|
-
key: s.id,
|
|
153
|
-
type: "button",
|
|
154
|
-
role: "radio",
|
|
155
|
-
"aria-checked": t.modelValue === s.id,
|
|
156
|
-
disabled: t.disabled,
|
|
157
|
-
class: y([
|
|
158
|
-
"flex w-full cursor-pointer items-start gap-12 rounded-lg border p-12 text-left transition disabled:cursor-not-allowed disabled:opacity-60",
|
|
159
|
-
t.modelValue === s.id ? "border-fm-color-primary bg-fm-color-primary-50" : "border-fm-color-neutral-gray-200 bg-fm-color-neutral-white hover:border-fm-color-neutral-gray-300"
|
|
160
|
-
]),
|
|
161
|
-
onClick: (G) => V(s.id)
|
|
162
|
-
}, [
|
|
163
|
-
e("span", {
|
|
164
|
-
class: y([
|
|
165
|
-
"mt-[2px] flex h-16 w-16 shrink-0 items-center justify-center rounded-full border",
|
|
166
|
-
t.modelValue === s.id ? "border-fm-color-primary bg-fm-color-primary" : "border-fm-color-neutral-gray-300 bg-fm-color-neutral-white"
|
|
167
|
-
])
|
|
168
|
-
}, [
|
|
169
|
-
t.modelValue === s.id ? (a(), l("span", z)) : p("", !0)
|
|
170
|
-
], 2),
|
|
171
|
-
b(v, {
|
|
172
|
-
"restaurant-style": s.restaurantStyle
|
|
173
|
-
}, null, 8, ["restaurant-style"]),
|
|
174
|
-
e("span", H, [
|
|
175
|
-
e("span", M, [
|
|
176
|
-
e("span", Q, h(s.label), 1),
|
|
177
|
-
s.default ? (a(), l("span", U, " Default ")) : p("", !0)
|
|
178
|
-
]),
|
|
179
|
-
e("span", W, h(s.description), 1)
|
|
180
|
-
])
|
|
181
|
-
], 10, j))), 128))
|
|
182
|
-
])
|
|
183
|
-
], 2))), 128))
|
|
184
|
-
])
|
|
185
|
-
])) : p("", !0);
|
|
186
|
-
}
|
|
187
|
-
});
|
|
188
|
-
export {
|
|
189
|
-
st as _,
|
|
190
|
-
rt as a,
|
|
191
|
-
et as b,
|
|
192
|
-
O as c,
|
|
193
|
-
X as d,
|
|
194
|
-
Y as e,
|
|
195
|
-
Z as p,
|
|
196
|
-
tt as r,
|
|
197
|
-
K as s
|
|
198
|
-
};
|
|
@@ -1,249 +0,0 @@
|
|
|
1
|
-
import { defineComponent as H, ref as K, computed as z, onMounted as S, onScopeDispose as M, resolveComponent as y, openBlock as l, createElementBlock as r, createElementVNode as t, unref as a, createTextVNode as m, createBlock as _, Teleport as O, toDisplayString as p, createCommentVNode as d, createVNode as c, withCtx as Y, normalizeClass as G, normalizeStyle as j, Fragment as b, renderList as f, withDirectives as A, vModelText as I } from "vue";
|
|
2
|
-
import { _ as q, B as J } from "./BrandFontPicker-JHyoGusq.js";
|
|
3
|
-
import { useRouter as Q, onBeforeRouteLeave as W } from "vue-router";
|
|
4
|
-
import { useDialog as X, useSnackbar as Z } from "@feedmepos/ui-library";
|
|
5
|
-
import { a as ee, C as D, t as E, F as te, u as ae, i as se } from "./useBrandKit-CXLIXo5j.js";
|
|
6
|
-
import { _ as oe } from "./_plugin-vue_export-helper-CHgC5LLL.js";
|
|
7
|
-
const ne = { class: "portal-page bg-portal-bg-canvas text-portal-text-primary" }, le = { class: "portal-page-inner brand-page" }, re = { class: "portal-page-heading" }, ie = { class: "brand-help" }, de = { class: "brand-actions" }, ue = {
|
|
8
|
-
key: 0,
|
|
9
|
-
class: "brand-unsaved"
|
|
10
|
-
}, pe = {
|
|
11
|
-
key: 1,
|
|
12
|
-
class: "portal-notice"
|
|
13
|
-
}, ce = {
|
|
14
|
-
key: 2,
|
|
15
|
-
class: "portal-loading",
|
|
16
|
-
role: "status"
|
|
17
|
-
}, ve = {
|
|
18
|
-
key: 3,
|
|
19
|
-
role: "alert",
|
|
20
|
-
class: "portal-section portal-error"
|
|
21
|
-
}, me = {
|
|
22
|
-
key: 4,
|
|
23
|
-
role: "status"
|
|
24
|
-
}, be = { class: "portal-section" }, he = { class: "portal-section-head" }, ge = { class: "brand-color-grid" }, ye = ["value", "aria-label", "disabled", "onInput"], _e = { class: "brand-field-label" }, fe = ["onUpdate:modelValue", "aria-label", "aria-invalid", "disabled"], ke = {
|
|
25
|
-
key: 0,
|
|
26
|
-
class: "portal-error"
|
|
27
|
-
}, xe = { class: "brand-advanced" }, Ce = { class: "brand-role-grid" }, Be = ["value", "aria-label", "disabled", "onInput"], we = ["onUpdate:modelValue", "aria-label", "aria-invalid", "disabled"], Fe = { class: "portal-section" }, Ve = { class: "portal-section-head" }, Ke = { class: "brand-font-grid" }, Se = /* @__PURE__ */ H({
|
|
28
|
-
__name: "BrandKitView",
|
|
29
|
-
setup(Ae) {
|
|
30
|
-
const e = ae(), h = ee(), k = X(), L = Z(), x = K(!1), T = Q(), u = K(!1), C = ["primary", "secondary", "accent", "background.base", "text.primary"], $ = C.map((n) => D.find((s) => s.path === n)), P = D.filter((n) => !C.includes(n.path)), B = z(
|
|
31
|
-
() => !h.value || !e.state.loaded || e.state.loading || e.state.saving || e.hasInvalidColor.value || e.dirtyCount.value === 0
|
|
32
|
-
), g = (n) => !!(e.state.colors[n] && !se(e.state.colors[n]));
|
|
33
|
-
function w(n, s) {
|
|
34
|
-
e.state.colors[n] = s.target.value, u.value = !1;
|
|
35
|
-
}
|
|
36
|
-
function F(n) {
|
|
37
|
-
n === "colors" ? e.state.colors = { ...e.state.savedColors } : e.state.fonts = { ...e.state.savedFonts }, u.value = !1;
|
|
38
|
-
}
|
|
39
|
-
function U() {
|
|
40
|
-
k.open({
|
|
41
|
-
title: "Save the live Brand Kit?",
|
|
42
|
-
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.",
|
|
43
|
-
dismissAway: !0,
|
|
44
|
-
primaryActions: { text: "Save Brand Kit", close: !0 },
|
|
45
|
-
secondaryActions: { text: "Cancel", close: !0 }
|
|
46
|
-
}).onPrimary(() => {
|
|
47
|
-
e.save().then(() => {
|
|
48
|
-
u.value = !0;
|
|
49
|
-
}).catch(() => {
|
|
50
|
-
u.value = !1;
|
|
51
|
-
});
|
|
52
|
-
});
|
|
53
|
-
}
|
|
54
|
-
S(() => {
|
|
55
|
-
x.value = !0, e.load();
|
|
56
|
-
});
|
|
57
|
-
function V(n) {
|
|
58
|
-
!e.dirtyCount.value && !e.state.saving || (n.preventDefault(), n.returnValue = "");
|
|
59
|
-
}
|
|
60
|
-
return S(() => window.addEventListener("beforeunload", V)), M(() => window.removeEventListener("beforeunload", V)), W((n) => e.state.saving ? !1 : e.dirtyCount.value ? (k.open({
|
|
61
|
-
title: "Discard unsaved Brand Kit changes?",
|
|
62
|
-
message: "Your live Brand Kit has not changed. Leave this page and discard the changes you have not saved?",
|
|
63
|
-
dismissAway: !0,
|
|
64
|
-
primaryActions: { text: "Discard and leave", close: !0 },
|
|
65
|
-
secondaryActions: { text: "Keep editing", close: !0 }
|
|
66
|
-
}).onPrimary(() => {
|
|
67
|
-
e.discardEdits(), T.push(n);
|
|
68
|
-
}), !1) : !0), (n, s) => {
|
|
69
|
-
const N = y("FmIcon"), v = y("FmButton"), R = y("FmCircularProgress");
|
|
70
|
-
return l(), r("div", ne, [
|
|
71
|
-
t("div", le, [
|
|
72
|
-
t("header", re, [
|
|
73
|
-
s[7] || (s[7] = t("div", null, [
|
|
74
|
-
t("p", { class: "portal-eyebrow" }, "Applies to every surface"),
|
|
75
|
-
t("h1", null, "Your Business Identity")
|
|
76
|
-
], -1)),
|
|
77
|
-
t("div", ie, [
|
|
78
|
-
s[6] || (s[6] = t("span", null, "Need help on brand kit?", -1)),
|
|
79
|
-
t("button", {
|
|
80
|
-
class: "brand-ask-remy",
|
|
81
|
-
type: "button",
|
|
82
|
-
onClick: s[0] || (s[0] = (o) => a(L).open({ message: "Coming soon" }, 3e3))
|
|
83
|
-
}, [...s[5] || (s[5] = [
|
|
84
|
-
t("img", {
|
|
85
|
-
src: q,
|
|
86
|
-
alt: "",
|
|
87
|
-
width: "20",
|
|
88
|
-
height: "20"
|
|
89
|
-
}, null, -1),
|
|
90
|
-
m(" Ask Remy ", -1)
|
|
91
|
-
])])
|
|
92
|
-
])
|
|
93
|
-
]),
|
|
94
|
-
x.value ? (l(), _(O, {
|
|
95
|
-
key: 0,
|
|
96
|
-
to: "#portal-page-actions"
|
|
97
|
-
}, [
|
|
98
|
-
t("div", de, [
|
|
99
|
-
a(e).dirtyCount.value ? (l(), r("span", ue, p(a(e).dirtyCount.value) + " unsaved", 1)) : d("", !0),
|
|
100
|
-
c(v, {
|
|
101
|
-
label: "Save",
|
|
102
|
-
disabled: B.value,
|
|
103
|
-
loading: a(e).state.saving,
|
|
104
|
-
onClick: U
|
|
105
|
-
}, {
|
|
106
|
-
default: Y(() => [
|
|
107
|
-
t("span", {
|
|
108
|
-
class: G(["brand-save-content fm-typo-en-body-lg-600", { invisible: a(e).state.saving }])
|
|
109
|
-
}, [
|
|
110
|
-
c(N, {
|
|
111
|
-
name: "save",
|
|
112
|
-
"aria-hidden": "true",
|
|
113
|
-
style: j({ color: B.value ? "#c7c7cc" : "#ffffff", fontSize: "20px", width: "20px", height: "20px", lineHeight: "20px", flex: "0 0 20px" })
|
|
114
|
-
}, null, 8, ["style"]),
|
|
115
|
-
s[8] || (s[8] = m(" Save ", -1))
|
|
116
|
-
], 2)
|
|
117
|
-
]),
|
|
118
|
-
_: 1
|
|
119
|
-
}, 8, ["disabled", "loading"])
|
|
120
|
-
])
|
|
121
|
-
])) : d("", !0),
|
|
122
|
-
a(h) ? d("", !0) : (l(), r("p", pe, " You can view this Brand Kit, but need Brand Kit management permission to save changes. ")),
|
|
123
|
-
a(e).state.loading ? (l(), r("div", ce, [
|
|
124
|
-
c(R, { size: "xl" }),
|
|
125
|
-
s[9] || (s[9] = m("Loading Brand Kit… ", -1))
|
|
126
|
-
])) : d("", !0),
|
|
127
|
-
a(e).state.error ? (l(), r("div", ve, [
|
|
128
|
-
t("p", null, p(a(e).state.error), 1),
|
|
129
|
-
a(e).state.loaded ? d("", !0) : (l(), _(v, {
|
|
130
|
-
key: 0,
|
|
131
|
-
label: "Try again",
|
|
132
|
-
variant: "secondary",
|
|
133
|
-
onClick: s[1] || (s[1] = (o) => a(e).load(!0))
|
|
134
|
-
}))
|
|
135
|
-
])) : d("", !0),
|
|
136
|
-
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),
|
|
137
|
-
a(e).state.loaded && !a(e).state.loading ? (l(), r(b, { key: 5 }, [
|
|
138
|
-
t("section", be, [
|
|
139
|
-
t("div", he, [
|
|
140
|
-
s[10] || (s[10] = t("div", null, [
|
|
141
|
-
t("h2", null, "Colors"),
|
|
142
|
-
t("p", { class: "portal-description" }, "The colors that represent your brand identity.")
|
|
143
|
-
], -1)),
|
|
144
|
-
c(v, {
|
|
145
|
-
label: "Reset unsaved colors",
|
|
146
|
-
variant: "tertiary",
|
|
147
|
-
disabled: a(e).state.saving,
|
|
148
|
-
onClick: s[2] || (s[2] = (o) => F("colors"))
|
|
149
|
-
}, null, 8, ["disabled"])
|
|
150
|
-
]),
|
|
151
|
-
t("div", ge, [
|
|
152
|
-
(l(!0), r(b, null, f(a($), (o) => (l(), r("label", {
|
|
153
|
-
key: o.path,
|
|
154
|
-
class: "brand-color-card"
|
|
155
|
-
}, [
|
|
156
|
-
t("input", {
|
|
157
|
-
type: "color",
|
|
158
|
-
value: a(E)(a(e).state.colors[o.path] ?? ""),
|
|
159
|
-
"aria-label": `${o.label} color picker`,
|
|
160
|
-
disabled: a(e).state.saving,
|
|
161
|
-
onInput: (i) => w(o.path, i)
|
|
162
|
-
}, null, 40, ye),
|
|
163
|
-
t("span", _e, p(o.path === "background.base" ? "Background" : o.path === "text.primary" ? "Text" : o.label), 1),
|
|
164
|
-
A(t("input", {
|
|
165
|
-
"onUpdate:modelValue": (i) => a(e).state.colors[o.path] = i,
|
|
166
|
-
class: "brand-value",
|
|
167
|
-
"aria-label": `${o.path} hex color`,
|
|
168
|
-
"aria-invalid": g(o.path),
|
|
169
|
-
disabled: a(e).state.saving,
|
|
170
|
-
placeholder: "App default",
|
|
171
|
-
spellcheck: "false"
|
|
172
|
-
}, null, 8, fe), [
|
|
173
|
-
[I, a(e).state.colors[o.path]]
|
|
174
|
-
]),
|
|
175
|
-
g(o.path) ? (l(), r("small", ke, "Enter a hex color")) : d("", !0)
|
|
176
|
-
]))), 128))
|
|
177
|
-
]),
|
|
178
|
-
t("details", xe, [
|
|
179
|
-
s[11] || (s[11] = t("summary", null, [
|
|
180
|
-
m("More color roles "),
|
|
181
|
-
t("span", null, "Keep control of text, surfaces and status colors")
|
|
182
|
-
], -1)),
|
|
183
|
-
s[12] || (s[12] = t("p", { class: "portal-description" }, " Each role is saved independently. Changing a brand color does not automatically replace text or status colors. ", -1)),
|
|
184
|
-
t("div", Ce, [
|
|
185
|
-
(l(!0), r(b, null, f(a(P), (o) => (l(), r("label", {
|
|
186
|
-
key: o.path
|
|
187
|
-
}, [
|
|
188
|
-
t("span", null, p(o.group) + " · " + p(o.label), 1),
|
|
189
|
-
t("div", null, [
|
|
190
|
-
t("input", {
|
|
191
|
-
type: "color",
|
|
192
|
-
value: a(E)(a(e).state.colors[o.path] ?? ""),
|
|
193
|
-
"aria-label": `${o.path} color picker`,
|
|
194
|
-
disabled: a(e).state.saving,
|
|
195
|
-
onInput: (i) => w(o.path, i)
|
|
196
|
-
}, null, 40, Be),
|
|
197
|
-
A(t("input", {
|
|
198
|
-
"onUpdate:modelValue": (i) => a(e).state.colors[o.path] = i,
|
|
199
|
-
"aria-label": `${o.path} hex color`,
|
|
200
|
-
"aria-invalid": g(o.path),
|
|
201
|
-
disabled: a(e).state.saving,
|
|
202
|
-
class: "brand-value",
|
|
203
|
-
placeholder: "App default",
|
|
204
|
-
spellcheck: "false"
|
|
205
|
-
}, null, 8, we), [
|
|
206
|
-
[I, a(e).state.colors[o.path]]
|
|
207
|
-
])
|
|
208
|
-
]),
|
|
209
|
-
t("small", null, p(o.hint), 1)
|
|
210
|
-
]))), 128))
|
|
211
|
-
])
|
|
212
|
-
])
|
|
213
|
-
]),
|
|
214
|
-
t("section", Fe, [
|
|
215
|
-
t("div", Ve, [
|
|
216
|
-
s[13] || (s[13] = t("div", null, [
|
|
217
|
-
t("h2", null, "Typeface"),
|
|
218
|
-
t("p", { class: "portal-description" }, "Fonts used in your interfaces.")
|
|
219
|
-
], -1)),
|
|
220
|
-
c(v, {
|
|
221
|
-
label: "Reset unsaved fonts",
|
|
222
|
-
variant: "tertiary",
|
|
223
|
-
disabled: a(e).state.saving,
|
|
224
|
-
onClick: s[3] || (s[3] = (o) => F("fonts"))
|
|
225
|
-
}, null, 8, ["disabled"])
|
|
226
|
-
]),
|
|
227
|
-
t("div", Ke, [
|
|
228
|
-
(l(!0), r(b, null, f(a(te), (o) => (l(), _(J, {
|
|
229
|
-
key: o.path,
|
|
230
|
-
modelValue: a(e).state.fonts[o.path],
|
|
231
|
-
"onUpdate:modelValue": [
|
|
232
|
-
(i) => a(e).state.fonts[o.path] = i,
|
|
233
|
-
s[4] || (s[4] = (i) => u.value = !1)
|
|
234
|
-
],
|
|
235
|
-
label: o.label === "Heading" ? "Headings" : o.label,
|
|
236
|
-
disabled: !a(h) || a(e).state.saving
|
|
237
|
-
}, null, 8, ["modelValue", "onUpdate:modelValue", "label", "disabled"]))), 128))
|
|
238
|
-
]),
|
|
239
|
-
s[14] || (s[14] = t("p", { class: "portal-description brand-font-help" }, "Supported by Google Fonts", -1))
|
|
240
|
-
])
|
|
241
|
-
], 64)) : d("", !0)
|
|
242
|
-
])
|
|
243
|
-
]);
|
|
244
|
-
};
|
|
245
|
-
}
|
|
246
|
-
}), Pe = /* @__PURE__ */ oe(Se, [["__scopeId", "data-v-69311627"]]);
|
|
247
|
-
export {
|
|
248
|
-
Pe as default
|
|
249
|
-
};
|