@justai/cuts 0.77.0 → 0.78.0
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/package.json +1 -1
- package/src/Toolbar.astro +58 -28
package/package.json
CHANGED
package/src/Toolbar.astro
CHANGED
|
@@ -8,7 +8,6 @@
|
|
|
8
8
|
//
|
|
9
9
|
// <Toolbar sectionsLabel={t.chromeSections} profileLabel={t.chromeProfile}
|
|
10
10
|
// kernelLabel={t.chromeApp} postsLabel={t.chromePosts}>
|
|
11
|
-
// <svg slot="kernelIcon" .../>
|
|
12
11
|
// <LangPicker slot="langPicker" current={lang} locales={locales} ... />
|
|
13
12
|
// </Toolbar>
|
|
14
13
|
//
|
|
@@ -16,11 +15,23 @@
|
|
|
16
15
|
// data-coupled ones are slots):
|
|
17
16
|
// • BackToZone — takes no props → internalised here (the persona no longer imports it).
|
|
18
17
|
// • the three nav aria-labels — resolved strings (like every other cut: Posts, LangPicker) → props.
|
|
19
|
-
// •
|
|
20
|
-
//
|
|
21
|
-
//
|
|
22
|
-
//
|
|
23
|
-
//
|
|
18
|
+
// • THE FOUR POSITIONS SAY FOUR DIFFERENT KINDS OF THING, and that is the whole design of the row:
|
|
19
|
+
// home is where you came FROM, the mark is WHO, the bolt is WHAT IT DOES, the bubble is what it
|
|
20
|
+
// SAYS. Neither of the middle two is a per-persona drawing any more, and the reason is not
|
|
21
|
+
// tidiness — an icon that repeats the identity spends the row's only distinction on something the
|
|
22
|
+
// row has already said two places to its left, and then neither icon means anything.
|
|
23
|
+
// • kernelIcon — GONE. It was a per-persona glyph (⚡ / clock / globe …) in a slot with NO fallback,
|
|
24
|
+
// which is the worst shape a slot can have: omit it and the persona shipped a live, invisible tap
|
|
25
|
+
// target. It is always the bolt now, drawn here.
|
|
26
|
+
// The kernel is the only section whose CONTENT differs between personas, which is exactly why its
|
|
27
|
+
// LABEL must not — otherwise there is nothing stable to navigate by, and somebody moving from qr
|
|
28
|
+
// to lendcam has to re-learn the row. A bolt is a state ("something runs here"), not a picture of
|
|
29
|
+
// a subject; a clock is true for one persona and a lie in the next.
|
|
30
|
+
// • profileIcon — OPTIONAL, and the DEFAULT is now the persona's own face rather than a generic
|
|
31
|
+
// bust: `avatar` (default `/icon.svg`) is the ecosystem's one-face path, the same one persona.yml
|
|
32
|
+
// declares and the registry stores. The bust is gone rather than demoted — a fallback that renders
|
|
33
|
+
// something plausible is how thirteen of fifteen personas wore nobody's face for months with
|
|
34
|
+
// nothing red anywhere. Pass the slot when an inline SVG is wanted instead of an <img>.
|
|
24
35
|
// Note what a mark cannot do: an <img> ignores `currentColor`, so `.active`'s accent never reaches
|
|
25
36
|
// it. It is not replaced with anything: the title strip already closes on this cut and opens off
|
|
26
37
|
// it, and a mark is an identity rather than a UI state. Slot presence adds `.tb-mark`, which the
|
|
@@ -67,9 +78,24 @@ interface Props {
|
|
|
67
78
|
// thing — names or sections, not one of each — so the API says so out loud.
|
|
68
79
|
kernelTitle?: string;
|
|
69
80
|
postsTitle?: string;
|
|
81
|
+
|
|
82
|
+
// queries: toolbar shows a generic person icon · the profile icon is not my persona ·
|
|
83
|
+
// how do I put my own mark in the toolbar · avatar
|
|
84
|
+
//
|
|
85
|
+
// THE PERSONA'S OWN FACE, BY DEFAULT RATHER THAN BY DECISION.
|
|
86
|
+
//
|
|
87
|
+
// This used to be a slot with a generic bust behind it, so a persona showed its own mark only if
|
|
88
|
+
// somebody remembered to pass one — and thirteen of fifteen never did. But the shell already knows
|
|
89
|
+
// where a persona's face is: ONE icon, everywhere, at `/icon.svg`. `persona.yml` declares it, the
|
|
90
|
+
// registry stores it, the catalog draws it. There was nothing to decide; there was only something
|
|
91
|
+
// to look up.
|
|
92
|
+
//
|
|
93
|
+
// The `profileIcon` slot still wins when a persona passes one — an inline SVG can take
|
|
94
|
+
// `currentColor` where an <img> cannot, which is why qr passes its mark rather than pointing at it.
|
|
95
|
+
avatar?: string;
|
|
70
96
|
}
|
|
71
97
|
import BackToZone from "./BackToZone.astro";
|
|
72
|
-
const { sectionsLabel, profileLabel, kernelLabel, postsLabel, home = true, files = true, filesLabel = "Files", kernelTitle, postsTitle } = Astro.props;
|
|
98
|
+
const { sectionsLabel, profileLabel, kernelLabel, postsLabel, home = true, files = true, filesLabel = "Files", kernelTitle, postsTitle, avatar = "/icon.svg" } = Astro.props;
|
|
73
99
|
import AuthMount from "./AuthMount.astro";
|
|
74
100
|
---
|
|
75
101
|
|
|
@@ -81,31 +107,35 @@ import AuthMount from "./AuthMount.astro";
|
|
|
81
107
|
<div class="tb-left">
|
|
82
108
|
{home && <BackToZone />}
|
|
83
109
|
<nav class="tb-nav-group" aria-label={sectionsLabel}>
|
|
84
|
-
{/*
|
|
85
|
-
|
|
86
|
-
for the same reason `kernelIcon` is: the face belongs to the persona, not to the shell.
|
|
110
|
+
{/* THE PROFILE ICON IS THE PERSONA'S OWN FACE. Always — the founder's rule, and app.zone and
|
|
111
|
+
qr had already settled it while thirteen siblings still showed a generic bust.
|
|
87
112
|
|
|
88
|
-
The
|
|
89
|
-
|
|
90
|
-
|
|
113
|
+
The bust is gone rather than demoted. A fallback that renders something plausible is how a
|
|
114
|
+
persona ships wearing nobody's face for months: nothing is broken, nothing is red, and the
|
|
115
|
+
only reader who notices is somebody comparing two personas side by side. `/icon.svg` is
|
|
116
|
+
not a guess — it is the ecosystem's one-face rule, the same path `persona.yml` declares
|
|
117
|
+
and the registry stores.
|
|
91
118
|
|
|
92
|
-
`tb-mark` is set
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
href="#profile"
|
|
98
|
-
aria-label={profileLabel}
|
|
99
|
-
title={profileLabel}
|
|
100
|
-
>
|
|
101
|
-
{Astro.slots.has("profileIcon") ? (
|
|
102
|
-
<slot name="profileIcon" />
|
|
103
|
-
) : (
|
|
104
|
-
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>
|
|
105
|
-
)}
|
|
119
|
+
`tb-mark` is set whichever way the face arrives, because it is what the sizing rule looks
|
|
120
|
+
for: a mark runs to the edge of its viewBox and a glyph does not, so they need different
|
|
121
|
+
boxes to put the same ink on screen. */}
|
|
122
|
+
<a class="tb-nav tb-mark" id="navProfile" href="#profile" aria-label={profileLabel} title={profileLabel}>
|
|
123
|
+
{Astro.slots.has("profileIcon") ? <slot name="profileIcon" /> : <img src={avatar} alt="" width="19" height="19" loading="lazy" decoding="async" />}
|
|
106
124
|
</a>
|
|
125
|
+
{/* THE KERNEL IS ALWAYS THE BOLT. The founder's rule, and it is the shell's to draw rather
|
|
126
|
+
than the persona's to remember.
|
|
127
|
+
|
|
128
|
+
It was a bare `<slot name="kernelIcon" />` with NO fallback, which is the worst shape a
|
|
129
|
+
slot can have: a persona that passed nothing shipped a live, invisible tap target where
|
|
130
|
+
every sibling showed a mark — no error, no warning, and visible only beside another
|
|
131
|
+
persona. Fourteen of fifteen passed their own drawing instead, so the row said something
|
|
132
|
+
different in every repo about the same thing.
|
|
133
|
+
|
|
134
|
+
The bolt says WHAT THE SECTION IS — the persona's one job, its live surface — and the
|
|
135
|
+
profile icon two places to the left already says WHO. An icon that repeats the identity
|
|
136
|
+
spends the row's only distinction on a thing the row has already said. */}
|
|
107
137
|
<a class="tb-nav" id="navKernel" href="#kernel" aria-label={kernelLabel} title={kernelLabel}>
|
|
108
|
-
<
|
|
138
|
+
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12.9 3L5.7 13.35h5.4L10.2 21l8.1-10.8h-5.4l.9-7.2z"/></svg>
|
|
109
139
|
</a>
|
|
110
140
|
<a class="tb-nav" id="navPosts" href="#posts" aria-label={postsLabel} title={postsLabel}>
|
|
111
141
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.4 8.4 0 0 1-9 8.3 9.6 9.6 0 0 1-4-.9L3 21l1.1-5A8.4 8.4 0 1 1 21 11.5z"/></svg>
|