@vibes.diy/base 14.3.203 → 14.3.205
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/components/StyleControls.js +27 -32
- package/components/StyleControls.js.map +1 -1
- package/components/vibe-menu/cards/CodeTabRow.js +1 -1
- package/components/vibe-menu/cards/CodeTabRow.js.map +1 -1
- package/components/vibe-menu/code-tabs.js +1 -1
- package/components/vibe-menu/code-tabs.js.map +1 -1
- package/components/vibe-menu/index.d.ts +0 -2
- package/components/vibe-menu/index.js +0 -2
- package/components/vibe-menu/index.js.map +1 -1
- package/components/vibe-menu/menu-state.js +1 -1
- package/components/vibe-menu/menu-state.js.map +1 -1
- package/components/vibe-menu/parts/Composer.d.ts +14 -1
- package/components/vibe-menu/parts/Composer.js +35 -7
- package/components/vibe-menu/parts/Composer.js.map +1 -1
- package/components/vibe-menu/parts/MomentLine.js +3 -3
- package/components/vibe-menu/parts/MomentLine.js.map +1 -1
- package/components/vibe-menu/parts/use-composer-draft.js +7 -2
- package/components/vibe-menu/parts/use-composer-draft.js.map +1 -1
- package/components/vibe-menu/vibe-menu.styles.d.ts +1 -1
- package/components/vibe-menu/vibe-menu.styles.js +21 -0
- package/components/vibe-menu/vibe-menu.styles.js.map +1 -1
- package/package.json +5 -5
- package/components/vibe-menu/parts/LookRestyleSection.d.ts +0 -51
- package/components/vibe-menu/parts/LookRestyleSection.js +0 -290
- package/components/vibe-menu/parts/LookRestyleSection.js.map +0 -1
- package/components/vibe-menu/parts/countdown.d.ts +0 -7
- package/components/vibe-menu/parts/countdown.js +0 -26
- package/components/vibe-menu/parts/countdown.js.map +0 -1
|
@@ -1,290 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { PICK_COUNTDOWN_MS, countdownDigit, useCountdownDigit } from "./countdown.js";
|
|
3
|
-
export const LOOK_RESTYLE_COPY = Object.freeze({
|
|
4
|
-
title: "New looks for your app",
|
|
5
|
-
aside: "Same features, new look",
|
|
6
|
-
idle: "Four fresh looks for this app, painted from its latest picture.",
|
|
7
|
-
now: "Your app now",
|
|
8
|
-
nowSub: "From your latest version",
|
|
9
|
-
loading: "Dreaming up new looks…",
|
|
10
|
-
loadingSub: "Every button and label stays; colour and type get a fresh take.",
|
|
11
|
-
counting: "Tap again to cancel",
|
|
12
|
-
all: "All looks",
|
|
13
|
-
compareNow: "Now",
|
|
14
|
-
sent: (name) => `Restyling in ${name}…`,
|
|
15
|
-
sentSub: "Same features, new look. It lands in your app in a moment.",
|
|
16
|
-
failed: "A fresh set of looks is one tap away.",
|
|
17
|
-
retry: "Paint new looks",
|
|
18
|
-
creditsShort: "Add credits and four fresh looks for this app are one scroll away.",
|
|
19
|
-
noScreenshot: "New looks for your app appear here once its first picture is taken.",
|
|
20
|
-
region: "New looks",
|
|
21
|
-
});
|
|
22
|
-
export function lookTileLabel(look, digit) {
|
|
23
|
-
const face = `${look.mode === "dark" ? "dark" : "light"}, ${look.fontLabel} headings`;
|
|
24
|
-
return digit === undefined ? `${look.name}: ${face}` : `${look.name}: restyling in ${digit}. ${LOOK_RESTYLE_COPY.counting}.`;
|
|
25
|
-
}
|
|
26
|
-
export const LOOK_RESTYLE_CSS = `
|
|
27
|
-
[data-vibe-menu] .vm-lr { display: flex; flex-direction: column; gap: var(--space-14); margin: var(--space-24) 0 var(--space-16); padding-top: var(--space-16); border-top: var(--stroke-rule) solid var(--line-hairline); container: vm-lr / inline-size; }
|
|
28
|
-
[data-vibe-menu] .vm-lr-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-8); padding: 0 var(--space-2); }
|
|
29
|
-
[data-vibe-menu] .vm-lr-title { font: 600 17px/1.3 var(--font-display); color: var(--ink); }
|
|
30
|
-
[data-vibe-menu] .vm-lr-aside { font: 400 12px/1.3 var(--font-display); color: var(--muted); white-space: nowrap; }
|
|
31
|
-
[data-vibe-menu] .vm-lr-sub { margin-top: var(--space-2); font: 400 13px/1.4 var(--font-display); color: var(--muted); }
|
|
32
|
-
[data-vibe-menu] .vm-lr-note { padding: var(--space-10) var(--space-12); border: var(--stroke-rule) solid var(--line-card); border-radius: var(--radius-moment); background: var(--card-bg); font: 400 13px/1.4 var(--font-display); color: var(--ink); }
|
|
33
|
-
[data-vibe-menu] .vm-lr-retry { margin-top: var(--space-8); height: 32px; padding: 0 var(--space-14); border-radius: var(--radius-full); border: var(--stroke-rule) solid var(--line-card); background: var(--accent); color: var(--on-accent); font: 700 13px/1 var(--font-display); cursor: pointer; }
|
|
34
|
-
[data-vibe-menu] .vm-lr-now { display: flex; align-items: center; gap: var(--space-12); }
|
|
35
|
-
[data-vibe-menu] .vm-lr-now-pic { flex: none; width: 72px; aspect-ratio: 1; border: var(--stroke-rule) solid var(--line-card); border-radius: var(--radius-switch); overflow: hidden; background: var(--card-bg); }
|
|
36
|
-
[data-vibe-menu] .vm-lr-pic { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
|
|
37
|
-
[data-vibe-menu] .vm-lr-now-text b { display: block; font: 700 14px/1.3 var(--font-display); color: var(--ink); }
|
|
38
|
-
[data-vibe-menu] .vm-lr-now-text span { display: block; margin-top: var(--space-2); font: 400 13px/1.4 var(--font-display); color: var(--muted); }
|
|
39
|
-
[data-vibe-menu] .vm-lr-status { display: flex; align-items: center; gap: var(--space-8); font: 600 14px/1.3 var(--font-display); color: var(--ink); }
|
|
40
|
-
[data-vibe-menu] .vm-lr-status::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: var(--radius-full); background: var(--accent); color: var(--on-accent); border: var(--stroke-rule) solid var(--line-card); animation: vm-lr-pulse 1.4s ease-in-out infinite; }
|
|
41
|
-
@keyframes vm-lr-pulse { 50% { transform: scale(0.6); } }
|
|
42
|
-
[data-vibe-menu] .vm-lr-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-12) var(--space-10); }
|
|
43
|
-
@container vm-lr (min-width: 600px) {
|
|
44
|
-
/* Wide (Code mode on a desktop): four across, each tile capped so the row stays a glance, not a wall. */
|
|
45
|
-
[data-vibe-menu] .vm-lr-grid { grid-template-columns: repeat(4, minmax(0, 232px)); justify-content: start; }
|
|
46
|
-
[data-vibe-menu] .vm-lr-now-pic { width: 96px; }
|
|
47
|
-
[data-vibe-menu] .vm-lr-big { max-width: 320px; }
|
|
48
|
-
}
|
|
49
|
-
[data-vibe-menu] .vm-lr-cell { position: relative; min-width: 0; }
|
|
50
|
-
[data-vibe-menu] .vm-lr-tile { position: relative; display: block; width: 100%; min-height: 44px; padding: 0; aspect-ratio: 3 / 4; border: var(--stroke-rule) solid var(--line-card); border-radius: var(--radius-switch); overflow: hidden; background: var(--card-bg); cursor: pointer; touch-action: manipulation; }
|
|
51
|
-
[data-vibe-menu] .vm-lr-tile[data-on="true"] { outline: var(--stroke-focus) solid var(--accent); outline-offset: 2px; }
|
|
52
|
-
[data-vibe-menu] .vm-lr-tile[aria-disabled="true"] { cursor: default; }
|
|
53
|
-
[data-vibe-menu] .vm-lr[data-counting] .vm-lr-cell:not([data-on="true"]) .vm-lr-tile { opacity: 0.55; }
|
|
54
|
-
[data-vibe-menu] .vm-lr[data-sent] .vm-lr-cell:not([data-on="true"]) .vm-lr-tile { opacity: 0.35; }
|
|
55
|
-
[data-vibe-menu] .vm-lr-ghost .vm-lr-tile { cursor: default; }
|
|
56
|
-
[data-vibe-menu] .vm-lr-ghost .vm-lr-pic { filter: grayscale(1); opacity: 0.35; }
|
|
57
|
-
[data-vibe-menu] .vm-lr-ghost .vm-lr-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, var(--card-bg) 50%, transparent 70%); background-size: 250% 100%; animation: vm-lr-sweep 1.6s linear infinite; }
|
|
58
|
-
@keyframes vm-lr-sweep { from { background-position: 120% 0; } to { background-position: -120% 0; } }
|
|
59
|
-
[data-vibe-menu] .vm-lr-count-big { position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none; background: color-mix(in srgb, var(--card-bg) 30%, transparent); }
|
|
60
|
-
[data-vibe-menu] .vm-lr-count-big span { display: grid; place-items: center; width: 64px; height: 64px; border-radius: var(--radius-full); border: var(--stroke-rule) solid var(--line-card); background: var(--accent); color: var(--on-accent); font: 700 32px/1 var(--font-display); font-variant-numeric: tabular-nums; }
|
|
61
|
-
[data-vibe-menu] .vm-lr-count-big b, [data-vibe-menu] .vm-lr-count b { font: inherit; animation: vm-lr-tick 240ms ease-out; }
|
|
62
|
-
@keyframes vm-lr-tick { from { transform: scale(1.35); } to { transform: scale(1); } }
|
|
63
|
-
[data-vibe-menu] .vm-lr-count { position: absolute; top: 10px; right: 10px; display: grid; place-items: center; width: 36px; height: 36px; border-radius: var(--radius-full); border: var(--stroke-rule) solid var(--line-card); background: var(--accent); color: var(--on-accent); font: 700 17px/1 var(--font-display); font-variant-numeric: tabular-nums; pointer-events: none; }
|
|
64
|
-
[data-vibe-menu] .vm-lr-grow { position: absolute; right: 6px; bottom: 6px; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border-radius: var(--radius-full); border: var(--stroke-rule) solid var(--line-card); background: var(--card-bg); color: var(--ink); cursor: pointer; }
|
|
65
|
-
[data-vibe-menu] .vm-lr-grow svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
|
|
66
|
-
[data-vibe-menu] .vm-lr-cap { margin-top: var(--space-6); padding: 0 var(--space-2); min-width: 0; }
|
|
67
|
-
[data-vibe-menu] .vm-lr-cap b { display: block; font: 700 13px/1.25 var(--font-display); color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
68
|
-
[data-vibe-menu] .vm-lr-font { display: block; margin-top: var(--space-2); font-size: 15px; line-height: 1.2; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
69
|
-
[data-vibe-menu] .vm-lr-big { position: relative; }
|
|
70
|
-
[data-vibe-menu] .vm-lr-big .vm-lr-tile { aspect-ratio: 390 / 600; }
|
|
71
|
-
[data-vibe-menu] .vm-lr-bigbar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-8); margin-bottom: var(--space-10); }
|
|
72
|
-
[data-vibe-menu] .vm-lr-back { flex: none; white-space: nowrap; height: 32px; padding: 0 var(--space-12); border-radius: var(--radius-full); border: var(--stroke-rule) solid var(--line-card); background: transparent; color: var(--ink); font: 700 12px/1 var(--font-display); letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer; }
|
|
73
|
-
[data-vibe-menu] .vm-lr-inset { position: absolute; left: 10px; bottom: 10px; width: 64px; aspect-ratio: 3 / 4; border: var(--stroke-rule) solid var(--line-card); border-radius: var(--radius-meter); overflow: hidden; background: var(--card-bg); pointer-events: none; }
|
|
74
|
-
[data-vibe-menu] .vm-lr-inset em { position: absolute; left: 0; right: 0; bottom: 0; padding: 2px 0; font: 700 10px/1.2 var(--font-display); font-style: normal; text-align: center; color: var(--ink); background: var(--card-bg); border-top: var(--stroke-rule) solid var(--line-card); }
|
|
75
|
-
[data-vibe-menu] .vm-lr-live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
|
|
76
|
-
@media (prefers-reduced-motion: reduce) {
|
|
77
|
-
[data-vibe-menu] .vm-lr-ghost .vm-lr-tile::after, [data-vibe-menu] .vm-lr-status::before, [data-vibe-menu] .vm-lr-count-big b, [data-vibe-menu] .vm-lr-count b { animation: none; }
|
|
78
|
-
}
|
|
79
|
-
`;
|
|
80
|
-
function scrollParentOf(el) {
|
|
81
|
-
let at = el.parentElement;
|
|
82
|
-
while (at !== null) {
|
|
83
|
-
const overflow = getComputedStyle(at).overflowY;
|
|
84
|
-
if (overflow === "auto" || overflow === "scroll")
|
|
85
|
-
return at;
|
|
86
|
-
at = at.parentElement;
|
|
87
|
-
}
|
|
88
|
-
return undefined;
|
|
89
|
-
}
|
|
90
|
-
function useScrollDownIntent(ref, onWanted) {
|
|
91
|
-
const wantedRef = React.useRef(onWanted);
|
|
92
|
-
wantedRef.current = onWanted;
|
|
93
|
-
const armed = onWanted !== undefined;
|
|
94
|
-
React.useEffect(() => {
|
|
95
|
-
const el = ref.current;
|
|
96
|
-
if (armed === false || el === null)
|
|
97
|
-
return;
|
|
98
|
-
const parent = scrollParentOf(el);
|
|
99
|
-
const host = parent ?? document.documentElement;
|
|
100
|
-
function top() {
|
|
101
|
-
return parent === undefined ? window.scrollY : parent.scrollTop;
|
|
102
|
-
}
|
|
103
|
-
const startTop = top();
|
|
104
|
-
let touchY;
|
|
105
|
-
let fired = false;
|
|
106
|
-
function fire() {
|
|
107
|
-
if (fired)
|
|
108
|
-
return;
|
|
109
|
-
fired = true;
|
|
110
|
-
wantedRef.current?.();
|
|
111
|
-
}
|
|
112
|
-
function onWheel(e) {
|
|
113
|
-
if (e.deltaY > 0)
|
|
114
|
-
fire();
|
|
115
|
-
}
|
|
116
|
-
function onScroll() {
|
|
117
|
-
if (top() > startTop)
|
|
118
|
-
fire();
|
|
119
|
-
}
|
|
120
|
-
function onTouchStart(e) {
|
|
121
|
-
touchY = e.touches[0]?.clientY;
|
|
122
|
-
}
|
|
123
|
-
function onTouchMove(e) {
|
|
124
|
-
const y = e.touches[0]?.clientY;
|
|
125
|
-
if (touchY !== undefined && y !== undefined && y < touchY - 8)
|
|
126
|
-
fire();
|
|
127
|
-
}
|
|
128
|
-
const opts = { passive: true };
|
|
129
|
-
host.addEventListener("wheel", onWheel, opts);
|
|
130
|
-
host.addEventListener("touchstart", onTouchStart, opts);
|
|
131
|
-
host.addEventListener("touchmove", onTouchMove, opts);
|
|
132
|
-
if (parent === undefined)
|
|
133
|
-
window.addEventListener("scroll", onScroll, opts);
|
|
134
|
-
else
|
|
135
|
-
parent.addEventListener("scroll", onScroll, opts);
|
|
136
|
-
return () => {
|
|
137
|
-
host.removeEventListener("wheel", onWheel);
|
|
138
|
-
host.removeEventListener("touchstart", onTouchStart);
|
|
139
|
-
host.removeEventListener("touchmove", onTouchMove);
|
|
140
|
-
if (parent === undefined)
|
|
141
|
-
window.removeEventListener("scroll", onScroll);
|
|
142
|
-
else
|
|
143
|
-
parent.removeEventListener("scroll", onScroll);
|
|
144
|
-
};
|
|
145
|
-
}, [ref, armed]);
|
|
146
|
-
}
|
|
147
|
-
function GrowGlyph() {
|
|
148
|
-
return (React.createElement("svg", { viewBox: "0 0 24 24", "aria-hidden": "true", focusable: "false" },
|
|
149
|
-
React.createElement("polyline", { points: "15 3 21 3 21 9" }),
|
|
150
|
-
React.createElement("polyline", { points: "9 21 3 21 3 15" }),
|
|
151
|
-
React.createElement("line", { x1: "21", y1: "3", x2: "14", y2: "10" }),
|
|
152
|
-
React.createElement("line", { x1: "3", y1: "21", x2: "10", y2: "14" })));
|
|
153
|
-
}
|
|
154
|
-
function NowRow(props) {
|
|
155
|
-
return (React.createElement("div", { className: "vm-lr-now" },
|
|
156
|
-
React.createElement("div", { className: "vm-lr-now-pic" }, props.src === undefined ? null : React.createElement("img", { className: "vm-lr-pic", src: props.src, alt: "Your app as it looks now" })),
|
|
157
|
-
React.createElement("div", { className: "vm-lr-now-text" },
|
|
158
|
-
React.createElement("b", null, LOOK_RESTYLE_COPY.now),
|
|
159
|
-
React.createElement("span", null, LOOK_RESTYLE_COPY.nowSub))));
|
|
160
|
-
}
|
|
161
|
-
function Caption(props) {
|
|
162
|
-
return (React.createElement("div", { className: "vm-lr-cap" },
|
|
163
|
-
React.createElement("b", null, props.look.name),
|
|
164
|
-
React.createElement("span", { className: "vm-lr-font", style: { fontFamily: props.look.fontFamily } }, props.look.fontLabel)));
|
|
165
|
-
}
|
|
166
|
-
function LookTile(props) {
|
|
167
|
-
const { view, index, digit } = props;
|
|
168
|
-
const look = view.looks[index];
|
|
169
|
-
if (look === undefined)
|
|
170
|
-
return null;
|
|
171
|
-
const counting = view.choosing?.index === index;
|
|
172
|
-
const picked = view.picked === index;
|
|
173
|
-
const on = picked || counting;
|
|
174
|
-
const locked = view.phase === "sent";
|
|
175
|
-
function tap() {
|
|
176
|
-
if (locked)
|
|
177
|
-
return;
|
|
178
|
-
if (counting)
|
|
179
|
-
view.onCancel?.();
|
|
180
|
-
else
|
|
181
|
-
view.onChoose?.(index);
|
|
182
|
-
}
|
|
183
|
-
return (React.createElement("div", { className: "vm-lr-cell", "data-on": on },
|
|
184
|
-
React.createElement("div", { style: { position: "relative" } },
|
|
185
|
-
React.createElement("button", { type: "button", role: "radio", "aria-checked": on, "aria-label": lookTileLabel(look, counting ? digit : undefined), "aria-disabled": locked, className: "vm-lr-tile", "data-on": on, "data-testid": "look-restyle-tile", onClick: tap },
|
|
186
|
-
look.src === undefined ? null : React.createElement("img", { className: "vm-lr-pic", src: look.src, alt: "", draggable: false }),
|
|
187
|
-
counting && digit !== undefined ? (React.createElement("span", { className: "vm-lr-count-big", "data-testid": "look-restyle-countdown", "aria-hidden": "true" },
|
|
188
|
-
React.createElement("span", null,
|
|
189
|
-
React.createElement("b", { key: digit }, digit)))) : null),
|
|
190
|
-
locked ? null : (React.createElement("button", { type: "button", className: "vm-lr-grow", "aria-label": `See ${look.name} big`, onClick: () => view.onBig?.(index) },
|
|
191
|
-
React.createElement(GrowGlyph, null)))),
|
|
192
|
-
React.createElement(Caption, { look: look })));
|
|
193
|
-
}
|
|
194
|
-
function GhostTile(props) {
|
|
195
|
-
return (React.createElement("div", { className: "vm-lr-cell vm-lr-ghost" },
|
|
196
|
-
React.createElement("div", { className: "vm-lr-tile", "aria-hidden": "true" }, props.src === undefined ? null : React.createElement("img", { className: "vm-lr-pic", src: props.src, alt: "", draggable: false })),
|
|
197
|
-
React.createElement("div", { className: "vm-lr-cap" }, "\u00A0")));
|
|
198
|
-
}
|
|
199
|
-
function BigView(props) {
|
|
200
|
-
const { view, index, digit } = props;
|
|
201
|
-
const look = view.looks[index];
|
|
202
|
-
if (look === undefined)
|
|
203
|
-
return null;
|
|
204
|
-
const counting = view.choosing?.index === index;
|
|
205
|
-
return (React.createElement("div", { className: "vm-lr-big" },
|
|
206
|
-
React.createElement("div", { className: "vm-lr-bigbar" },
|
|
207
|
-
React.createElement(Caption, { look: look }),
|
|
208
|
-
React.createElement("button", { type: "button", className: "vm-lr-back", onClick: () => view.onBig?.(undefined) }, LOOK_RESTYLE_COPY.all)),
|
|
209
|
-
React.createElement("button", { type: "button", role: "radio", "aria-checked": counting, "aria-label": lookTileLabel(look, counting ? digit : undefined), className: "vm-lr-tile", "data-on": counting, "data-testid": "look-restyle-big", onClick: () => (counting ? view.onCancel?.() : view.onChoose?.(index)) },
|
|
210
|
-
look.src === undefined ? null : React.createElement("img", { className: "vm-lr-pic", src: look.src, alt: "", draggable: false }),
|
|
211
|
-
view.now === undefined ? null : (React.createElement("span", { className: "vm-lr-inset" },
|
|
212
|
-
React.createElement("img", { className: "vm-lr-pic", src: view.now, alt: "" }),
|
|
213
|
-
React.createElement("em", null, LOOK_RESTYLE_COPY.compareNow))),
|
|
214
|
-
counting && digit !== undefined ? (React.createElement("span", { className: "vm-lr-count", "data-testid": "look-restyle-countdown", "aria-hidden": "true" },
|
|
215
|
-
React.createElement("b", { key: digit }, digit))) : null)));
|
|
216
|
-
}
|
|
217
|
-
function Head(props) {
|
|
218
|
-
const { view } = props;
|
|
219
|
-
if (view.phase === "sent" && view.picked !== undefined) {
|
|
220
|
-
return (React.createElement("div", null,
|
|
221
|
-
React.createElement("div", { className: "vm-lr-title" }, LOOK_RESTYLE_COPY.sent(view.looks[view.picked]?.name ?? "")),
|
|
222
|
-
React.createElement("div", { className: "vm-lr-sub" }, LOOK_RESTYLE_COPY.sentSub)));
|
|
223
|
-
}
|
|
224
|
-
if (view.phase === "loading") {
|
|
225
|
-
return (React.createElement("div", null,
|
|
226
|
-
React.createElement("div", { className: "vm-lr-status", role: "status" }, LOOK_RESTYLE_COPY.loading),
|
|
227
|
-
React.createElement("div", { className: "vm-lr-sub" }, LOOK_RESTYLE_COPY.loadingSub)));
|
|
228
|
-
}
|
|
229
|
-
return (React.createElement("div", null,
|
|
230
|
-
React.createElement("div", { className: "vm-lr-head" },
|
|
231
|
-
React.createElement("span", { className: "vm-lr-title" }, LOOK_RESTYLE_COPY.title),
|
|
232
|
-
React.createElement("span", { className: "vm-lr-aside" }, view.choosing === undefined ? LOOK_RESTYLE_COPY.aside : LOOK_RESTYLE_COPY.counting)),
|
|
233
|
-
view.phase === "idle" ? React.createElement("div", { className: "vm-lr-sub" }, LOOK_RESTYLE_COPY.idle) : null));
|
|
234
|
-
}
|
|
235
|
-
function Body(props) {
|
|
236
|
-
const { view, digit } = props;
|
|
237
|
-
switch (view.phase) {
|
|
238
|
-
case "no-screenshot":
|
|
239
|
-
return React.createElement("div", { className: "vm-lr-note" }, LOOK_RESTYLE_COPY.noScreenshot);
|
|
240
|
-
case "credits-short":
|
|
241
|
-
return (React.createElement(React.Fragment, null,
|
|
242
|
-
React.createElement(NowRow, { src: view.now }),
|
|
243
|
-
React.createElement("div", { className: "vm-lr-note" }, LOOK_RESTYLE_COPY.creditsShort)));
|
|
244
|
-
case "failed":
|
|
245
|
-
return (React.createElement(React.Fragment, null,
|
|
246
|
-
React.createElement(NowRow, { src: view.now }),
|
|
247
|
-
React.createElement("div", { className: "vm-lr-note" },
|
|
248
|
-
LOOK_RESTYLE_COPY.failed,
|
|
249
|
-
React.createElement("div", null,
|
|
250
|
-
React.createElement("button", { type: "button", className: "vm-lr-retry", onClick: () => view.onRetry?.() }, LOOK_RESTYLE_COPY.retry)))));
|
|
251
|
-
case "idle":
|
|
252
|
-
return React.createElement(NowRow, { src: view.now });
|
|
253
|
-
case "loading":
|
|
254
|
-
return (React.createElement(React.Fragment, null,
|
|
255
|
-
React.createElement(NowRow, { src: view.now }),
|
|
256
|
-
React.createElement("div", { className: "vm-lr-grid", "aria-hidden": "true" }, [0, 1, 2, 3].map((i) => (React.createElement(GhostTile, { key: i, src: view.now }))))));
|
|
257
|
-
case "ready":
|
|
258
|
-
case "sent":
|
|
259
|
-
if (view.big !== undefined && view.phase === "ready")
|
|
260
|
-
return React.createElement(BigView, { view: view, index: view.big, digit: digit });
|
|
261
|
-
return (React.createElement(React.Fragment, null,
|
|
262
|
-
React.createElement(NowRow, { src: view.now }),
|
|
263
|
-
React.createElement("div", { className: "vm-lr-grid", role: "radiogroup", "aria-label": LOOK_RESTYLE_COPY.title }, view.looks.map((look, i) => (React.createElement(LookTile, { key: `${i}-${look.name}`, view: view, index: i, digit: digit }))))));
|
|
264
|
-
}
|
|
265
|
-
}
|
|
266
|
-
function FontLinks(props) {
|
|
267
|
-
const urls = [...new Set(props.looks.flatMap((l) => (l.fontUrl === undefined ? [] : [l.fontUrl])))];
|
|
268
|
-
return (React.createElement(React.Fragment, null, urls.map((href) => (React.createElement("link", { key: href, rel: "stylesheet", href: href })))));
|
|
269
|
-
}
|
|
270
|
-
export function LookRestyleSection(props) {
|
|
271
|
-
const { view } = props;
|
|
272
|
-
const ref = React.useRef(null);
|
|
273
|
-
useScrollDownIntent(ref, view.phase === "idle" ? view.onWanted : undefined);
|
|
274
|
-
const onOpenRef = React.useRef(view.onOpen);
|
|
275
|
-
onOpenRef.current = view.onOpen;
|
|
276
|
-
React.useEffect(() => {
|
|
277
|
-
onOpenRef.current?.();
|
|
278
|
-
}, []);
|
|
279
|
-
const digit = useCountdownDigit(view.choosing?.endsAtMs);
|
|
280
|
-
const name = view.choosing === undefined ? undefined : view.looks[view.choosing.index]?.name;
|
|
281
|
-
return (React.createElement("section", { ref: ref, className: "vm-lr", "aria-label": LOOK_RESTYLE_COPY.region, "data-testid": "look-restyle", "data-phase": view.phase, "data-counting": view.choosing === undefined ? undefined : "", "data-sent": view.phase === "sent" ? "" : undefined },
|
|
282
|
-
React.createElement("style", null, LOOK_RESTYLE_CSS),
|
|
283
|
-
React.createElement(FontLinks, { looks: view.looks }),
|
|
284
|
-
React.createElement(Head, { view: view }),
|
|
285
|
-
React.createElement(Body, { view: view, digit: digit }),
|
|
286
|
-
React.createElement("span", { className: "vm-lr-live", role: "status", "aria-live": "polite" }, name === undefined || digit === undefined ? "" : `${name}: restyling in ${digit}.`)));
|
|
287
|
-
}
|
|
288
|
-
export const LOOK_RESTYLE_COUNTDOWN_MS = PICK_COUNTDOWN_MS;
|
|
289
|
-
export { countdownDigit as lookRestyleCountdownDigit };
|
|
290
|
-
//# sourceMappingURL=LookRestyleSection.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"LookRestyleSection.js","sourceRoot":"","sources":["../../../../jsr/components/vibe-menu/parts/LookRestyleSection.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
export interface PickChoosing {
|
|
2
|
-
readonly index: number;
|
|
3
|
-
readonly endsAtMs: number;
|
|
4
|
-
}
|
|
5
|
-
export declare const PICK_COUNTDOWN_MS = 3000;
|
|
6
|
-
export declare function countdownDigit(msLeft: number): number;
|
|
7
|
-
export declare function useCountdownDigit(endsAtMs: number | undefined): number | undefined;
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
export const PICK_COUNTDOWN_MS = 3000;
|
|
3
|
-
export function countdownDigit(msLeft) {
|
|
4
|
-
const steps = Math.round(PICK_COUNTDOWN_MS / 1000);
|
|
5
|
-
return Math.min(steps, Math.max(1, Math.ceil(msLeft / 1000)));
|
|
6
|
-
}
|
|
7
|
-
export function useCountdownDigit(endsAtMs) {
|
|
8
|
-
const [digit, setDigit] = React.useState(undefined);
|
|
9
|
-
React.useLayoutEffect(() => {
|
|
10
|
-
if (endsAtMs === undefined)
|
|
11
|
-
return;
|
|
12
|
-
let timer;
|
|
13
|
-
const tick = () => {
|
|
14
|
-
const left = endsAtMs - Date.now();
|
|
15
|
-
setDigit({ endsAtMs, digit: countdownDigit(left) });
|
|
16
|
-
if (left > 0)
|
|
17
|
-
timer = setTimeout(tick, left % 1000 || 1000);
|
|
18
|
-
};
|
|
19
|
-
tick();
|
|
20
|
-
return () => clearTimeout(timer);
|
|
21
|
-
}, [endsAtMs]);
|
|
22
|
-
if (endsAtMs === undefined)
|
|
23
|
-
return undefined;
|
|
24
|
-
return digit?.endsAtMs === endsAtMs ? digit.digit : countdownDigit(PICK_COUNTDOWN_MS);
|
|
25
|
-
}
|
|
26
|
-
//# sourceMappingURL=countdown.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"countdown.js","sourceRoot":"","sources":["../../../../jsr/components/vibe-menu/parts/countdown.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAiB/B,MAAM,CAAC,MAAM,iBAAiB,GAAG,IAAI,CAAC;AAGtC,MAAM,UAAU,cAAc,CAAC,MAAc;IAC3C,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;IACnD,OAAO,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;AAChE,CAAC;AAID,MAAM,UAAU,iBAAiB,CAAC,QAA4B;IAC5D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAoE,SAAS,CAAC,CAAC;IACvH,KAAK,CAAC,eAAe,CAAC,GAAG,EAAE;QACzB,IAAI,QAAQ,KAAK,SAAS;YAAE,OAAO;QACnC,IAAI,KAAgD,CAAC;QACrD,MAAM,IAAI,GAAG,GAAS,EAAE;YACtB,MAAM,IAAI,GAAG,QAAQ,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;YACnC,QAAQ,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YACpD,IAAI,IAAI,GAAG,CAAC;gBAAE,KAAK,GAAG,UAAU,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,IAAI,IAAI,CAAC,CAAC;QAC9D,CAAC,CAAC;QACF,IAAI,EAAE,CAAC;QACP,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IACf,IAAI,QAAQ,KAAK,SAAS;QAAE,OAAO,SAAS,CAAC;IAC7C,OAAO,KAAK,EAAE,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC;AACxF,CAAC"}
|