@krizaka/ui 3.21.0 → 3.22.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/README.md +1 -0
- package/dist/app-shell.js +1 -1
- package/dist/argument-card.js +3 -3
- package/dist/{chunk-5MH64NIL.js → chunk-2L67YTNV.js} +2 -2
- package/dist/chunk-AQSZJJAJ.js +126 -0
- package/dist/chunk-AQSZJJAJ.js.map +1 -0
- package/dist/{chunk-3GODX3D6.js → chunk-QDXV544C.js} +2 -2
- package/dist/chunk-QDXV544C.js.map +1 -0
- package/dist/chunk-R6NK6ZNY.js +1080 -0
- package/dist/chunk-R6NK6ZNY.js.map +1 -0
- package/dist/{chunk-LIPK4UCS.js → chunk-YCIBJ6OQ.js} +140 -209
- package/dist/chunk-YCIBJ6OQ.js.map +1 -0
- package/dist/comparison-table.d.ts +44 -0
- package/dist/comparison-table.js +84 -0
- package/dist/comparison-table.js.map +1 -0
- package/dist/data-table.js +19 -1066
- package/dist/data-table.js.map +1 -1
- package/dist/date-picker.js +3 -3
- package/dist/genui.d.ts +219 -0
- package/dist/genui.js +506 -0
- package/dist/genui.js.map +1 -0
- package/dist/index.d.ts +17 -24
- package/dist/index.js +1 -1
- package/dist/marketing-layout.js +1 -1
- package/dist/marketing-layout.js.map +1 -1
- package/dist/media-grid.js +43 -151
- package/dist/media-grid.js.map +1 -1
- package/dist/meta-row.d.ts +54 -0
- package/dist/meta-row.js +35 -0
- package/dist/meta-row.js.map +1 -0
- package/dist/native.d.ts +25 -16
- package/dist/native.js +493 -520
- package/dist/native.js.map +1 -1
- package/dist/nav-bar.js +2 -2
- package/dist/page-hero.js +3 -3
- package/dist/site-footer.js +2 -2
- package/dist/skip-link.js +1 -1
- package/dist/step-showcase.d.ts +62 -0
- package/dist/step-showcase.js +227 -0
- package/dist/step-showcase.js.map +1 -0
- package/package.json +61 -4
- package/registry/achievement.json +1 -1
- package/registry/action-bar.json +1 -1
- package/registry/activity-feed.json +1 -1
- package/registry/alert.json +1 -1
- package/registry/app-shell.json +1 -1
- package/registry/argument-card.json +1 -1
- package/registry/audio-player.json +1 -1
- package/registry/auth-layout.json +1 -1
- package/registry/avatar.json +1 -1
- package/registry/badge.json +1 -1
- package/registry/button.json +1 -1
- package/registry/card-grid.json +1 -1
- package/registry/card.json +1 -1
- package/registry/catalogue-page.json +1 -1
- package/registry/changelog-page.json +1 -1
- package/registry/chat.json +1 -1
- package/registry/checkbox.json +1 -1
- package/registry/chip-link.json +1 -1
- package/registry/chip.json +1 -1
- package/registry/choice-grid.json +1 -1
- package/registry/code-block.json +1 -1
- package/registry/combobox.json +1 -1
- package/registry/command.json +1 -1
- package/registry/comparison-table.json +207 -0
- package/registry/component-page.json +1 -1
- package/registry/confirm-button.json +1 -1
- package/registry/contact-page.json +1 -1
- package/registry/continue-prompt.json +1 -1
- package/registry/countdown.json +1 -1
- package/registry/cta-panel.json +1 -1
- package/registry/dashboard-layout.json +1 -1
- package/registry/data-table.json +1 -1
- package/registry/date-picker.json +1 -1
- package/registry/decision-list.json +1 -1
- package/registry/description-list.json +1 -1
- package/registry/detail-layout.json +1 -1
- package/registry/dialog.json +1 -1
- package/registry/docs-article-page.json +1 -1
- package/registry/docs-hub-page.json +1 -1
- package/registry/docs-layout.json +1 -1
- package/registry/document-viewer.json +1 -1
- package/registry/dropdown-menu.json +1 -1
- package/registry/empty-state.json +1 -1
- package/registry/error-page.json +1 -1
- package/registry/examples/comparison-table/versus.d.ts +4 -0
- package/registry/examples/comparison-table/versus.js +28 -0
- package/registry/examples/comparison-table/versus.tsx +20 -0
- package/registry/examples/dialog/native/sheet.dark.png +0 -0
- package/registry/examples/dialog/native/sheet.light.png +0 -0
- package/registry/examples/genui/streaming.d.ts +4 -0
- package/registry/examples/genui/streaming.js +18 -0
- package/registry/examples/genui/streaming.tsx +14 -0
- package/registry/examples/genui/table.d.ts +4 -0
- package/registry/examples/genui/table.js +19 -0
- package/registry/examples/genui/table.tsx +14 -0
- package/registry/examples/meta-row/native/video.d.ts +4 -0
- package/registry/examples/meta-row/native/video.dark.png +0 -0
- package/registry/examples/meta-row/native/video.js +11 -0
- package/registry/examples/meta-row/native/video.light.png +0 -0
- package/registry/examples/meta-row/native/video.tsx +5 -0
- package/registry/examples/meta-row/status.d.ts +4 -0
- package/registry/examples/meta-row/status.js +12 -0
- package/registry/examples/meta-row/status.tsx +7 -0
- package/registry/examples/meta-row/video.d.ts +4 -0
- package/registry/examples/meta-row/video.js +12 -0
- package/registry/examples/meta-row/video.tsx +7 -0
- package/registry/examples/step-showcase/desktop.d.ts +4 -0
- package/registry/examples/step-showcase/desktop.js +24 -0
- package/registry/examples/step-showcase/desktop.tsx +19 -0
- package/registry/examples/step-showcase/phone.d.ts +4 -0
- package/registry/examples/step-showcase/phone.js +24 -0
- package/registry/examples/step-showcase/phone.tsx +19 -0
- package/registry/field.json +1 -1
- package/registry/file-upload.json +1 -1
- package/registry/filter-bar.json +1 -1
- package/registry/force-update-screen.json +1 -1
- package/registry/form.json +1 -1
- package/registry/gallery-page.json +1 -1
- package/registry/genui.json +409 -0
- package/registry/glow-card.json +1 -1
- package/registry/goal-gauge.json +1 -1
- package/registry/how-it-works-page.json +1 -1
- package/registry/image-cropper.json +1 -1
- package/registry/index.json +130 -4
- package/registry/iso.json +1 -1
- package/registry/kanban.json +1 -1
- package/registry/kbd.json +1 -1
- package/registry/landing-page.json +1 -1
- package/registry/landscape.json +1 -1
- package/registry/legal-page.json +1 -1
- package/registry/link-card.json +1 -1
- package/registry/list.json +1 -1
- package/registry/loader.json +1 -1
- package/registry/longform-page.json +1 -1
- package/registry/maintenance-screen.json +1 -1
- package/registry/map.json +2 -2
- package/registry/markdown.json +1 -1
- package/registry/marketing-layout.json +1 -1
- package/registry/marquee.json +1 -1
- package/registry/mascot-quote.json +1 -1
- package/registry/mascot-state.json +1 -1
- package/registry/mascots.json +1 -1
- package/registry/match-dialog.json +1 -1
- package/registry/media-capture.json +1 -1
- package/registry/media-grid.json +1 -1
- package/registry/meta-row.json +215 -0
- package/registry/meter.json +1 -1
- package/registry/nav-bar.json +13 -13
- package/registry/number-ticker.json +1 -1
- package/registry/page-header.json +1 -1
- package/registry/page-hero.json +1 -1
- package/registry/page.json +1 -1
- package/registry/pagination.json +1 -1
- package/registry/photo-grid.json +1 -1
- package/registry/pointer-light.json +1 -1
- package/registry/popover.json +1 -1
- package/registry/pricing-page.json +1 -1
- package/registry/product-page.json +1 -1
- package/registry/profile-card.json +1 -1
- package/registry/progress.json +1 -1
- package/registry/promise-card.json +1 -1
- package/registry/radio-group.json +1 -1
- package/registry/recipes.json +1 -1
- package/registry/scroll-stage.json +1 -1
- package/registry/search-field.json +1 -1
- package/registry/section-backdrop.json +1 -1
- package/registry/separator.json +1 -1
- package/registry/settings-layout.json +1 -1
- package/registry/showcase.json +1 -1
- package/registry/site-footer.json +13 -13
- package/registry/sites.json +1 -1
- package/registry/skeleton.json +1 -1
- package/registry/skip-link.json +2 -2
- package/registry/slider.json +1 -1
- package/registry/slot.json +1 -1
- package/registry/spinner.json +1 -1
- package/registry/split-view.json +1 -1
- package/registry/stage-banner.json +1 -1
- package/registry/stat.json +1 -1
- package/registry/status-page.json +1 -1
- package/registry/step-progress.json +1 -1
- package/registry/step-showcase.json +296 -0
- package/registry/stepper.json +1 -1
- package/registry/swipe-deck.json +1 -1
- package/registry/switch.json +1 -1
- package/registry/tabs.json +1 -1
- package/registry/tag-input.json +1 -1
- package/registry/tag-selector.json +1 -1
- package/registry/terminal-replay.json +1 -1
- package/registry/theme.json +1 -1
- package/registry/toast.json +1 -1
- package/registry/toc.json +1 -1
- package/registry/tooltip.json +1 -1
- package/registry/tree-view.json +1 -1
- package/registry/update-prompt.json +1 -1
- package/registry/verified-badge.json +1 -1
- package/registry/vertical-video.json +1 -1
- package/registry/video-player.json +1 -1
- package/registry/video-trimmer.json +1 -1
- package/registry/virtual.json +1 -1
- package/dist/chunk-3GODX3D6.js.map +0 -1
- package/dist/chunk-LIPK4UCS.js.map +0 -1
- /package/dist/{chunk-5MH64NIL.js.map → chunk-2L67YTNV.js.map} +0 -0
|
@@ -2,29 +2,27 @@
|
|
|
2
2
|
|
|
3
3
|
// src/marks/akinaza-geometry.ts
|
|
4
4
|
import { marks } from "@krizaka/tokens/native";
|
|
5
|
+
var forest = marks.akinaza[0][1];
|
|
5
6
|
var copper = marks.akinaza[marks.akinaza.length - 1][1];
|
|
6
7
|
var AKINAZA = {
|
|
7
8
|
viewBox: "0 0 400 400",
|
|
8
9
|
croppedViewBox: "80 80 240 240",
|
|
9
10
|
center: 200,
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
/** The
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
/** A window each side, in light. */
|
|
21
|
-
windows: "M154 196 H168 V212 H154 Z M232 196 H246 V212 H232 Z",
|
|
22
|
-
gradient: { x1: 140, y1: 300, x2: 276, y2: 108, stops: marks.akinaza },
|
|
11
|
+
forest,
|
|
12
|
+
copper,
|
|
13
|
+
log: "M197 110 L290 203 A96 96 0 1 1 197 110 Z",
|
|
14
|
+
/** The fresh face of the cut: a copper band along the chord. */
|
|
15
|
+
cut: "M197 110 L290 203 A96 96 0 0 1 289.1 219.1 L180.9 110.9 A96 96 0 0 1 197 110 Z",
|
|
16
|
+
/** The year rings, in light, inside the band. */
|
|
17
|
+
rings: { cx: 194, cy: 206, r: [52, 28], width: 7, opacity: 0.42 },
|
|
18
|
+
heart: { cx: 194, cy: 206, r: 16, inner: 5.4 },
|
|
19
|
+
highlight: "#fff7ed",
|
|
20
|
+
gradient: { x1: 110, y1: 300, x2: 290, y2: 100, stops: marks.akinaza },
|
|
23
21
|
/** A coin: one node on the orbit, that turns with it. */
|
|
24
22
|
node: { r: 9, at: [200, 40] },
|
|
25
23
|
glow: { color: copper, opacity: 0.16 },
|
|
26
|
-
/** The door's breathing light (web), in the copper. */
|
|
27
24
|
pulse: { color: copper, low: 0.3, high: 0.65 },
|
|
25
|
+
motion: { spin: 32, breath: 3.8 },
|
|
28
26
|
orbit: { r: 160, dash: "8 8", width: 1.5 },
|
|
29
27
|
ring: { r: 134, width: 1 }
|
|
30
28
|
};
|
|
@@ -38,107 +36,99 @@ function useIds(prefix, keys) {
|
|
|
38
36
|
}
|
|
39
37
|
var a11y = (title) => title ? { role: "img", "aria-label": title } : { "aria-hidden": true };
|
|
40
38
|
var withAlpha = (hex, opacity) => `${hex}${Math.round(opacity * 255).toString(16).padStart(2, "0")}`;
|
|
39
|
+
var familyMotion = (prefix, { spin, breath, color, low, high }) => `
|
|
40
|
+
.${prefix}-orbit { transform-origin: 200px 200px; animation: ${prefix}-orbit ${spin}s linear infinite; }
|
|
41
|
+
.${prefix}-core { transform-box: fill-box; transform-origin: center; animation: ${prefix}-core ${breath}s ease-in-out infinite; }
|
|
42
|
+
@keyframes ${prefix}-orbit { to { transform: rotate(360deg); } }
|
|
43
|
+
@keyframes ${prefix}-core {
|
|
44
|
+
0%, 100% { filter: drop-shadow(0 0 6px ${withAlpha(color, low)}); opacity: .92; }
|
|
45
|
+
50% { filter: drop-shadow(0 0 16px ${withAlpha(color, high)}); opacity: 1; }
|
|
46
|
+
}
|
|
47
|
+
@media (prefers-reduced-motion: reduce) { .${prefix}-orbit, .${prefix}-core { animation: none; } }
|
|
48
|
+
`;
|
|
41
49
|
|
|
42
50
|
// src/marks/AkinazaLogo.tsx
|
|
43
51
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
44
|
-
var CSS =
|
|
45
|
-
.akm-orbit { transform-origin: 200px 200px; animation: akm-orbit 32s linear infinite; }
|
|
46
|
-
.akm-door { animation: akm-door 3.8s ease-in-out infinite; }
|
|
47
|
-
@keyframes akm-orbit { to { transform: rotate(360deg); } }
|
|
48
|
-
@keyframes akm-door {
|
|
49
|
-
0%, 100% { filter: drop-shadow(0 0 4px ${withAlpha(AKINAZA.pulse.color, AKINAZA.pulse.low)}); }
|
|
50
|
-
50% { filter: drop-shadow(0 0 14px ${withAlpha(AKINAZA.pulse.color, AKINAZA.pulse.high)}); }
|
|
51
|
-
}
|
|
52
|
-
@media (prefers-reduced-motion: reduce) { .akm-orbit, .akm-door { animation: none; } }
|
|
53
|
-
`;
|
|
52
|
+
var CSS = familyMotion("akm", { ...AKINAZA.motion, ...AKINAZA.pulse });
|
|
54
53
|
function AkinazaLogo({ size = 32, animated = true, title, className }) {
|
|
55
|
-
const id = useIds("akm", ["
|
|
56
|
-
const
|
|
54
|
+
const id = useIds("akm", ["glow"]);
|
|
55
|
+
const m = (cls) => animated ? `akm-${cls}` : void 0;
|
|
57
56
|
return /* @__PURE__ */ jsxs("svg", { width: size, height: size, viewBox: size < 48 ? AKINAZA.croppedViewBox : AKINAZA.viewBox, fill: "none", xmlns: "http://www.w3.org/2000/svg", className, ...a11y(title), children: [
|
|
58
57
|
/* @__PURE__ */ jsx("style", { children: CSS }),
|
|
59
|
-
/* @__PURE__ */
|
|
60
|
-
/* @__PURE__ */ jsx("
|
|
61
|
-
/* @__PURE__ */ jsx("
|
|
62
|
-
|
|
63
|
-
/* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: AKINAZA.glow.color, stopOpacity: AKINAZA.glow.opacity }),
|
|
64
|
-
/* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: AKINAZA.glow.color, stopOpacity: "0" })
|
|
65
|
-
] })
|
|
66
|
-
] }),
|
|
58
|
+
/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("radialGradient", { id: id.glow, cx: "50%", cy: "50%", r: "50%", children: [
|
|
59
|
+
/* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: AKINAZA.glow.color, stopOpacity: AKINAZA.glow.opacity }),
|
|
60
|
+
/* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: AKINAZA.glow.color, stopOpacity: "0" })
|
|
61
|
+
] }) }),
|
|
67
62
|
size >= 48 ? /* @__PURE__ */ jsx("circle", { cx: AKINAZA.center, cy: AKINAZA.center, r: "190", fill: `url(#${id.glow})` }) : null,
|
|
68
63
|
/* @__PURE__ */ jsx("circle", { cx: AKINAZA.center, cy: AKINAZA.center, r: AKINAZA.ring.r, stroke: neutral("--kz-border-default", 30), strokeWidth: AKINAZA.ring.width, opacity: ".35" }),
|
|
69
|
-
/* @__PURE__ */ jsxs("g", { className:
|
|
64
|
+
/* @__PURE__ */ jsxs("g", { className: m("orbit"), children: [
|
|
70
65
|
/* @__PURE__ */ jsx("circle", { cx: AKINAZA.center, cy: AKINAZA.center, r: AKINAZA.orbit.r, stroke: neutral("--kz-border-strong", 40), strokeWidth: AKINAZA.orbit.width, strokeDasharray: AKINAZA.orbit.dash, opacity: ".6" }),
|
|
71
|
-
/* @__PURE__ */ jsx("circle", { cx: AKINAZA.node.at[0], cy: AKINAZA.node.at[1], r: AKINAZA.node.r, fill })
|
|
66
|
+
/* @__PURE__ */ jsx("circle", { cx: AKINAZA.node.at[0], cy: AKINAZA.node.at[1], r: AKINAZA.node.r, fill: AKINAZA.copper })
|
|
72
67
|
] }),
|
|
73
|
-
/* @__PURE__ */ jsx("path", { d: AKINAZA.
|
|
74
|
-
/* @__PURE__ */ jsx("path", { d: AKINAZA.
|
|
75
|
-
/* @__PURE__ */ jsx("
|
|
76
|
-
/* @__PURE__ */
|
|
77
|
-
|
|
68
|
+
/* @__PURE__ */ jsx("path", { d: AKINAZA.log, fill: AKINAZA.forest }),
|
|
69
|
+
/* @__PURE__ */ jsx("path", { d: AKINAZA.cut, fill: AKINAZA.copper }),
|
|
70
|
+
AKINAZA.rings.r.map((r) => /* @__PURE__ */ jsx("circle", { cx: AKINAZA.rings.cx, cy: AKINAZA.rings.cy, r, stroke: AKINAZA.highlight, strokeOpacity: AKINAZA.rings.opacity, strokeWidth: AKINAZA.rings.width }, r)),
|
|
71
|
+
/* @__PURE__ */ jsxs("g", { className: m("core"), children: [
|
|
72
|
+
/* @__PURE__ */ jsx("circle", { cx: AKINAZA.heart.cx, cy: AKINAZA.heart.cy, r: AKINAZA.heart.r, fill: AKINAZA.copper }),
|
|
73
|
+
/* @__PURE__ */ jsx("circle", { cx: AKINAZA.heart.cx, cy: AKINAZA.heart.cy, r: AKINAZA.heart.inner, fill: AKINAZA.highlight })
|
|
74
|
+
] })
|
|
78
75
|
] });
|
|
79
76
|
}
|
|
80
77
|
|
|
81
78
|
// src/marks/kachizaka-geometry.ts
|
|
82
79
|
import { marks as marks2 } from "@krizaka/tokens/native";
|
|
80
|
+
var cobalt = marks2.kachizaka[0][1];
|
|
83
81
|
var gold = marks2.kachizaka[marks2.kachizaka.length - 1][1];
|
|
84
82
|
var KACHIZAKA = {
|
|
85
83
|
viewBox: "0 0 400 400",
|
|
86
84
|
croppedViewBox: "80 80 240 240",
|
|
87
85
|
center: 200,
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
/** The
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
86
|
+
cobalt,
|
|
87
|
+
gold,
|
|
88
|
+
/** The steps: second (left, cut top-left), first (centre, both top corners cut, in gold), third (right, cut top-right). */
|
|
89
|
+
steps: {
|
|
90
|
+
second: "M102 240 L122 220 H162 V296 H102 Z",
|
|
91
|
+
first: "M170 192 L188 174 H212 L230 192 V296 H170 Z",
|
|
92
|
+
third: "M238 248 H278 L298 268 V296 H238 Z"
|
|
93
|
+
},
|
|
94
|
+
/** The lit node over the winner: a gold diamond (half-diagonal 22, softened by a 6-unit round stroke), its light inside. */
|
|
95
|
+
node: { d: "M200 102 L222 124 L200 146 L178 124 Z", light: "M200 116.1 L207.9 124 L200 131.9 L192.1 124 Z", soften: 6 },
|
|
96
|
+
highlight: "#fffbea",
|
|
97
|
+
gradient: { x1: 110, y1: 300, x2: 290, y2: 100, stops: marks2.kachizaka },
|
|
99
98
|
/** The ball: one node on the orbit, that turns with it. */
|
|
100
|
-
|
|
99
|
+
ball: { r: 9, at: [200, 40] },
|
|
101
100
|
glow: { color: gold, opacity: 0.18 },
|
|
102
|
-
/** The seal's breathing shadow (web), in the gold. */
|
|
103
101
|
pulse: { color: gold, low: 0.35, high: 0.75 },
|
|
102
|
+
motion: { spin: 28, breath: 3.2 },
|
|
104
103
|
orbit: { r: 160, dash: "8 8", width: 1.5 },
|
|
105
104
|
ring: { r: 134, width: 1 }
|
|
106
105
|
};
|
|
107
106
|
|
|
108
107
|
// src/marks/KachizakaLogo.tsx
|
|
109
108
|
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
110
|
-
var CSS2 =
|
|
111
|
-
.kzm-orbit { transform-origin: 200px 200px; animation: kzm-orbit 28s linear infinite; }
|
|
112
|
-
.kzm-seal { transform-box: fill-box; transform-origin: center; animation: kzm-seal 3.2s ease-in-out infinite; }
|
|
113
|
-
@keyframes kzm-orbit { to { transform: rotate(360deg); } }
|
|
114
|
-
@keyframes kzm-seal {
|
|
115
|
-
0%, 100% { transform: scale(1); filter: drop-shadow(0 0 4px ${withAlpha(KACHIZAKA.pulse.color, KACHIZAKA.pulse.low)}); }
|
|
116
|
-
50% { transform: scale(1.06); filter: drop-shadow(0 0 12px ${withAlpha(KACHIZAKA.pulse.color, KACHIZAKA.pulse.high)}); }
|
|
117
|
-
}
|
|
118
|
-
@media (prefers-reduced-motion: reduce) { .kzm-orbit, .kzm-seal { animation: none; } }
|
|
119
|
-
`;
|
|
109
|
+
var CSS2 = familyMotion("kcm", { ...KACHIZAKA.motion, ...KACHIZAKA.pulse });
|
|
120
110
|
function KachizakaLogo({ size = 32, animated = true, title, className }) {
|
|
121
|
-
const id = useIds("
|
|
122
|
-
const
|
|
111
|
+
const id = useIds("kcm", ["glow"]);
|
|
112
|
+
const m = (cls) => animated ? `kcm-${cls}` : void 0;
|
|
123
113
|
return /* @__PURE__ */ jsxs2("svg", { width: size, height: size, viewBox: size < 48 ? KACHIZAKA.croppedViewBox : KACHIZAKA.viewBox, fill: "none", xmlns: "http://www.w3.org/2000/svg", className, ...a11y(title), children: [
|
|
124
114
|
/* @__PURE__ */ jsx2("style", { children: CSS2 }),
|
|
125
|
-
/* @__PURE__ */
|
|
126
|
-
/* @__PURE__ */ jsx2("
|
|
127
|
-
/* @__PURE__ */
|
|
128
|
-
|
|
129
|
-
/* @__PURE__ */ jsx2("stop", { offset: "100%", stopColor: KACHIZAKA.glow.color, stopOpacity: "0" })
|
|
130
|
-
] })
|
|
131
|
-
] }),
|
|
115
|
+
/* @__PURE__ */ jsx2("defs", { children: /* @__PURE__ */ jsxs2("radialGradient", { id: id.glow, cx: "50%", cy: "50%", r: "50%", children: [
|
|
116
|
+
/* @__PURE__ */ jsx2("stop", { offset: "0%", stopColor: KACHIZAKA.glow.color, stopOpacity: KACHIZAKA.glow.opacity }),
|
|
117
|
+
/* @__PURE__ */ jsx2("stop", { offset: "100%", stopColor: KACHIZAKA.glow.color, stopOpacity: "0" })
|
|
118
|
+
] }) }),
|
|
132
119
|
size >= 48 ? /* @__PURE__ */ jsx2("circle", { cx: KACHIZAKA.center, cy: KACHIZAKA.center, r: "190", fill: `url(#${id.glow})` }) : null,
|
|
133
120
|
/* @__PURE__ */ jsx2("circle", { cx: KACHIZAKA.center, cy: KACHIZAKA.center, r: KACHIZAKA.ring.r, stroke: neutral("--kz-border-default", 30), strokeWidth: KACHIZAKA.ring.width, opacity: ".35" }),
|
|
134
|
-
/* @__PURE__ */ jsxs2("g", { className:
|
|
121
|
+
/* @__PURE__ */ jsxs2("g", { className: m("orbit"), children: [
|
|
135
122
|
/* @__PURE__ */ jsx2("circle", { cx: KACHIZAKA.center, cy: KACHIZAKA.center, r: KACHIZAKA.orbit.r, stroke: neutral("--kz-border-strong", 40), strokeWidth: KACHIZAKA.orbit.width, strokeDasharray: KACHIZAKA.orbit.dash, opacity: ".6" }),
|
|
136
|
-
/* @__PURE__ */ jsx2("circle", { cx: KACHIZAKA.
|
|
123
|
+
/* @__PURE__ */ jsx2("circle", { cx: KACHIZAKA.ball.at[0], cy: KACHIZAKA.ball.at[1], r: KACHIZAKA.ball.r, fill: KACHIZAKA.gold })
|
|
137
124
|
] }),
|
|
138
|
-
/* @__PURE__ */ jsx2("path", { d: KACHIZAKA.
|
|
139
|
-
/* @__PURE__ */ jsx2("path", { d: KACHIZAKA.
|
|
140
|
-
/* @__PURE__ */ jsx2("path", { d: KACHIZAKA.
|
|
141
|
-
/* @__PURE__ */
|
|
125
|
+
/* @__PURE__ */ jsx2("path", { d: KACHIZAKA.steps.second, fill: KACHIZAKA.cobalt }),
|
|
126
|
+
/* @__PURE__ */ jsx2("path", { d: KACHIZAKA.steps.first, fill: KACHIZAKA.gold }),
|
|
127
|
+
/* @__PURE__ */ jsx2("path", { d: KACHIZAKA.steps.third, fill: KACHIZAKA.cobalt }),
|
|
128
|
+
/* @__PURE__ */ jsxs2("g", { className: m("core"), children: [
|
|
129
|
+
/* @__PURE__ */ jsx2("path", { d: KACHIZAKA.node.d, fill: KACHIZAKA.gold, stroke: KACHIZAKA.gold, strokeWidth: KACHIZAKA.node.soften, strokeLinejoin: "round" }),
|
|
130
|
+
/* @__PURE__ */ jsx2("path", { d: KACHIZAKA.node.light, fill: KACHIZAKA.highlight })
|
|
131
|
+
] })
|
|
142
132
|
] });
|
|
143
133
|
}
|
|
144
134
|
|
|
@@ -344,50 +334,36 @@ var YASAKIA = {
|
|
|
344
334
|
viewBox: "0 0 400 400",
|
|
345
335
|
croppedViewBox: "80 80 240 240",
|
|
346
336
|
center: 200,
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
337
|
+
bubble: { cx: 200, cy: 200, r: 86 },
|
|
338
|
+
/** The two tails, out of the bubble at 115°–160° and, turned 180° about the centre, at 295°–340°. */
|
|
339
|
+
tails: [
|
|
340
|
+
"M163.7 277.9 Q138 294 106 304 Q124 270 119.2 229.4 Z",
|
|
341
|
+
"M236.3 122.1 Q262 106 294 96 Q276 130 280.8 170.6 Z"
|
|
351
342
|
],
|
|
352
|
-
/** The
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
lens: { d: "M200 112.6 A80 80 0 0 1 200 255.4 A80 80 0 0 1 200 112.6 Z", y1: 112.6, y2: 255.4 },
|
|
343
|
+
/** The spark: a diamond of light (half-diagonal 24, softened by a 6-unit round stroke). */
|
|
344
|
+
spark: { d: "M200 176 L224 200 L200 224 L176 200 Z", soften: 6 },
|
|
345
|
+
highlight: "#f0fdfa",
|
|
356
346
|
gradient: { x1: 110, y1: 300, x2: 290, y2: 100, stops: marks6.yasakia },
|
|
357
|
-
/** The
|
|
358
|
-
|
|
359
|
-
/** The pair: two nodes on the orbit, opposite each other, that turn with it. */
|
|
360
|
-
pair: { r: 8, at: [[40, 200], [360, 200]] },
|
|
347
|
+
/** The two people: one node on the orbit, that turns with it. */
|
|
348
|
+
node: { r: 9, at: [200, 40] },
|
|
361
349
|
glow: { color: turquoise, opacity: 0.16 },
|
|
362
|
-
/** The core's breathing shadow (web), in the mark's turquoise. */
|
|
363
350
|
pulse: { color: turquoise, low: 0.3, high: 0.6 },
|
|
351
|
+
motion: { spin: 30, breath: 3.2 },
|
|
364
352
|
orbit: { r: 160, dash: "8 8", width: 1.5 },
|
|
365
353
|
ring: { r: 134, width: 1 }
|
|
366
354
|
};
|
|
367
355
|
|
|
368
356
|
// src/marks/YasakiaLogo.tsx
|
|
369
357
|
import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
370
|
-
var CSS6 =
|
|
371
|
-
.yzm-orbit { transform-origin: 200px 200px; animation: yzm-orbit 30s linear infinite; }
|
|
372
|
-
.yzm-core { transform-box: fill-box; transform-origin: center; animation: yzm-core 3.2s ease-in-out infinite; }
|
|
373
|
-
@keyframes yzm-orbit { to { transform: rotate(360deg); } }
|
|
374
|
-
@keyframes yzm-core {
|
|
375
|
-
0%, 100% { filter: drop-shadow(0 0 6px ${withAlpha(YASAKIA.pulse.color, YASAKIA.pulse.low)}); opacity: .9; }
|
|
376
|
-
50% { filter: drop-shadow(0 0 14px ${withAlpha(YASAKIA.pulse.color, YASAKIA.pulse.high)}); opacity: 1; }
|
|
377
|
-
}
|
|
378
|
-
@media (prefers-reduced-motion: reduce) { .yzm-orbit, .yzm-core { animation: none; } }
|
|
379
|
-
`;
|
|
358
|
+
var CSS6 = familyMotion("yzm", { ...YASAKIA.motion, ...YASAKIA.pulse });
|
|
380
359
|
function YasakiaLogo({ size = 32, animated = true, title, className }) {
|
|
381
|
-
const id = useIds("yzm", ["gradient", "
|
|
360
|
+
const id = useIds("yzm", ["gradient", "glow"]);
|
|
382
361
|
const fill = `url(#${id.gradient})`;
|
|
362
|
+
const m = (cls) => animated ? `yzm-${cls}` : void 0;
|
|
383
363
|
return /* @__PURE__ */ jsxs6("svg", { width: size, height: size, viewBox: size < 48 ? YASAKIA.croppedViewBox : YASAKIA.viewBox, fill: "none", xmlns: "http://www.w3.org/2000/svg", className, ...a11y(title), children: [
|
|
384
364
|
/* @__PURE__ */ jsx6("style", { children: CSS6 }),
|
|
385
365
|
/* @__PURE__ */ jsxs6("defs", { children: [
|
|
386
366
|
/* @__PURE__ */ jsx6("linearGradient", { id: id.gradient, gradientUnits: "userSpaceOnUse", x1: YASAKIA.gradient.x1, y1: YASAKIA.gradient.y1, x2: YASAKIA.gradient.x2, y2: YASAKIA.gradient.y2, children: YASAKIA.gradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx6("stop", { offset, stopColor: color }, offset)) }),
|
|
387
|
-
/* @__PURE__ */ jsxs6("linearGradient", { id: id.light, gradientUnits: "userSpaceOnUse", x1: "0", y1: YASAKIA.lens.y1, x2: "0", y2: YASAKIA.lens.y2, children: [
|
|
388
|
-
/* @__PURE__ */ jsx6("stop", { offset: "0%", stopColor: YASAKIA.highlight.color, stopOpacity: YASAKIA.highlight.from }),
|
|
389
|
-
/* @__PURE__ */ jsx6("stop", { offset: "100%", stopColor: YASAKIA.highlight.color, stopOpacity: YASAKIA.highlight.to })
|
|
390
|
-
] }),
|
|
391
367
|
/* @__PURE__ */ jsxs6("radialGradient", { id: id.glow, cx: "50%", cy: "50%", r: "50%", children: [
|
|
392
368
|
/* @__PURE__ */ jsx6("stop", { offset: "0%", stopColor: YASAKIA.glow.color, stopOpacity: YASAKIA.glow.opacity }),
|
|
393
369
|
/* @__PURE__ */ jsx6("stop", { offset: "100%", stopColor: YASAKIA.glow.color, stopOpacity: "0" })
|
|
@@ -395,19 +371,13 @@ function YasakiaLogo({ size = 32, animated = true, title, className }) {
|
|
|
395
371
|
] }),
|
|
396
372
|
size >= 48 ? /* @__PURE__ */ jsx6("circle", { cx: YASAKIA.center, cy: YASAKIA.center, r: "190", fill: `url(#${id.glow})` }) : null,
|
|
397
373
|
/* @__PURE__ */ jsx6("circle", { cx: YASAKIA.center, cy: YASAKIA.center, r: YASAKIA.ring.r, stroke: neutral("--kz-border-default", 30), strokeWidth: YASAKIA.ring.width, opacity: ".35" }),
|
|
398
|
-
/* @__PURE__ */ jsxs6("g", { className:
|
|
374
|
+
/* @__PURE__ */ jsxs6("g", { className: m("orbit"), children: [
|
|
399
375
|
/* @__PURE__ */ jsx6("circle", { cx: YASAKIA.center, cy: YASAKIA.center, r: YASAKIA.orbit.r, stroke: neutral("--kz-border-strong", 40), strokeWidth: YASAKIA.orbit.width, strokeDasharray: YASAKIA.orbit.dash, opacity: ".6" }),
|
|
400
|
-
|
|
376
|
+
/* @__PURE__ */ jsx6("circle", { cx: YASAKIA.node.at[0], cy: YASAKIA.node.at[1], r: YASAKIA.node.r, fill })
|
|
401
377
|
] }),
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
i === 0 ? /* @__PURE__ */ jsx6("path", { d: `${v.body} ${v.tail}`, fill: YASAKIA.shade.color, opacity: YASAKIA.shade.opacity }) : null
|
|
406
|
-
] }, v.body)),
|
|
407
|
-
/* @__PURE__ */ jsxs6("g", { className: animated ? "yzm-core" : void 0, children: [
|
|
408
|
-
/* @__PURE__ */ jsx6("path", { d: YASAKIA.lens.d, fill }),
|
|
409
|
-
/* @__PURE__ */ jsx6("path", { d: YASAKIA.lens.d, fill: `url(#${id.light})` })
|
|
410
|
-
] })
|
|
378
|
+
/* @__PURE__ */ jsx6("circle", { cx: YASAKIA.bubble.cx, cy: YASAKIA.bubble.cy, r: YASAKIA.bubble.r, fill }),
|
|
379
|
+
/* @__PURE__ */ jsx6("path", { d: YASAKIA.tails.join(" "), fill }),
|
|
380
|
+
/* @__PURE__ */ jsx6("g", { className: m("core"), children: /* @__PURE__ */ jsx6("path", { d: YASAKIA.spark.d, fill: YASAKIA.highlight, stroke: YASAKIA.highlight, strokeWidth: YASAKIA.spark.soften, strokeLinejoin: "round" }) })
|
|
411
381
|
] });
|
|
412
382
|
}
|
|
413
383
|
var YazakiaLogo = YasakiaLogo;
|
|
@@ -419,72 +389,58 @@ var YOMIZAKA = {
|
|
|
419
389
|
viewBox: "0 0 400 400",
|
|
420
390
|
croppedViewBox: "80 80 240 240",
|
|
421
391
|
center: 200,
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
/**
|
|
392
|
+
stroke: 22,
|
|
393
|
+
/** The brow: two soft arcs that meet over the beak — calm, never a sharp V. */
|
|
394
|
+
brow: "M106 153 C130 125 176 129 200 159 C224 129 270 125 294 153",
|
|
395
|
+
/** The two lenses (rings at the family stroke). */
|
|
396
|
+
lenses: [
|
|
397
|
+
{ cx: 146, cy: 223, r: 40 },
|
|
398
|
+
{ cx: 254, cy: 223, r: 40 }
|
|
399
|
+
],
|
|
400
|
+
/** The pupils, glancing down-right (reading): the lit cores. */
|
|
401
|
+
pupils: [
|
|
402
|
+
{ cx: 154, cy: 229, r: 15, inner: 5.1 },
|
|
403
|
+
{ cx: 262, cy: 229, r: 15, inner: 5.1 }
|
|
404
|
+
],
|
|
405
|
+
highlight: "#f4f5ff",
|
|
406
|
+
gradient: { x1: 110, y1: 300, x2: 290, y2: 100, stops: marks7.yomizaka },
|
|
407
|
+
/** One node, a page, rides the orbit. */
|
|
438
408
|
node: { r: 9, at: [200, 40] },
|
|
439
409
|
glow: { color: indigo, opacity: 0.18 },
|
|
440
|
-
/** The lens' breathing shadow (web), in the indigo. */
|
|
441
410
|
pulse: { color: indigo, low: 0.3, high: 0.6 },
|
|
411
|
+
motion: { spin: 32, breath: 3.6 },
|
|
442
412
|
orbit: { r: 160, dash: "8 8", width: 1.5 },
|
|
443
413
|
ring: { r: 134, width: 1 }
|
|
444
414
|
};
|
|
445
415
|
|
|
446
416
|
// src/marks/YomizakaLogo.tsx
|
|
447
417
|
import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
448
|
-
var CSS7 =
|
|
449
|
-
.ymm-orbit { transform-origin: 200px 200px; animation: ymm-orbit 32s linear infinite; }
|
|
450
|
-
.ymm-scan { animation: ymm-scan 3.6s cubic-bezier(.45,0,.55,1) infinite; }
|
|
451
|
-
.ymm-lens { transform-box: fill-box; transform-origin: center; animation: ymm-lens 3.6s ease-in-out infinite; }
|
|
452
|
-
@keyframes ymm-orbit { to { transform: rotate(360deg); } }
|
|
453
|
-
@keyframes ymm-scan { 0% { transform: translateY(0); opacity: 0; } 12%, 80% { opacity: 1; } 100% { transform: translateY(${YOMIZAKA.scan.travel}px); opacity: 0; } }
|
|
454
|
-
@keyframes ymm-lens {
|
|
455
|
-
0%, 100% { filter: drop-shadow(0 0 6px ${withAlpha(YOMIZAKA.pulse.color, YOMIZAKA.pulse.low)}); }
|
|
456
|
-
50% { filter: drop-shadow(0 0 16px ${withAlpha(YOMIZAKA.pulse.color, YOMIZAKA.pulse.high)}); }
|
|
457
|
-
}
|
|
458
|
-
@media (prefers-reduced-motion: reduce) { .ymm-orbit, .ymm-scan, .ymm-lens { animation: none; } .ymm-scan { opacity: 0; } }
|
|
459
|
-
`;
|
|
418
|
+
var CSS7 = familyMotion("ymm", { ...YOMIZAKA.motion, ...YOMIZAKA.pulse });
|
|
460
419
|
function YomizakaLogo({ size = 32, animated = true, title, className }) {
|
|
461
|
-
const id = useIds("ymm", ["gradient", "
|
|
420
|
+
const id = useIds("ymm", ["gradient", "glow"]);
|
|
462
421
|
const fill = `url(#${id.gradient})`;
|
|
422
|
+
const m = (cls) => animated ? `ymm-${cls}` : void 0;
|
|
463
423
|
return /* @__PURE__ */ jsxs7("svg", { width: size, height: size, viewBox: size < 48 ? YOMIZAKA.croppedViewBox : YOMIZAKA.viewBox, fill: "none", xmlns: "http://www.w3.org/2000/svg", className, ...a11y(title), children: [
|
|
464
424
|
/* @__PURE__ */ jsx7("style", { children: CSS7 }),
|
|
465
425
|
/* @__PURE__ */ jsxs7("defs", { children: [
|
|
466
426
|
/* @__PURE__ */ jsx7("linearGradient", { id: id.gradient, gradientUnits: "userSpaceOnUse", x1: YOMIZAKA.gradient.x1, y1: YOMIZAKA.gradient.y1, x2: YOMIZAKA.gradient.x2, y2: YOMIZAKA.gradient.y2, children: YOMIZAKA.gradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx7("stop", { offset, stopColor: color }, offset)) }),
|
|
467
|
-
/* @__PURE__ */ jsx7("linearGradient", { id: id.core, x1: "50%", y1: "100%", x2: "50%", y2: "0%", children: YOMIZAKA.coreGradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx7("stop", { offset, stopColor: color }, offset)) }),
|
|
468
427
|
/* @__PURE__ */ jsxs7("radialGradient", { id: id.glow, cx: "50%", cy: "50%", r: "50%", children: [
|
|
469
428
|
/* @__PURE__ */ jsx7("stop", { offset: "0%", stopColor: YOMIZAKA.glow.color, stopOpacity: YOMIZAKA.glow.opacity }),
|
|
470
429
|
/* @__PURE__ */ jsx7("stop", { offset: "100%", stopColor: YOMIZAKA.glow.color, stopOpacity: "0" })
|
|
471
|
-
] })
|
|
472
|
-
/* @__PURE__ */ jsx7("clipPath", { id: id.page, children: /* @__PURE__ */ jsx7("path", { d: YOMIZAKA.page }) })
|
|
430
|
+
] })
|
|
473
431
|
] }),
|
|
474
432
|
size >= 48 ? /* @__PURE__ */ jsx7("circle", { cx: YOMIZAKA.center, cy: YOMIZAKA.center, r: "190", fill: `url(#${id.glow})` }) : null,
|
|
475
433
|
/* @__PURE__ */ jsx7("circle", { cx: YOMIZAKA.center, cy: YOMIZAKA.center, r: YOMIZAKA.ring.r, stroke: neutral("--kz-border-default", 30), strokeWidth: YOMIZAKA.ring.width, opacity: ".35" }),
|
|
476
|
-
/* @__PURE__ */ jsxs7("g", { className:
|
|
434
|
+
/* @__PURE__ */ jsxs7("g", { className: m("orbit"), children: [
|
|
477
435
|
/* @__PURE__ */ jsx7("circle", { cx: YOMIZAKA.center, cy: YOMIZAKA.center, r: YOMIZAKA.orbit.r, stroke: neutral("--kz-border-strong", 40), strokeWidth: YOMIZAKA.orbit.width, strokeDasharray: YOMIZAKA.orbit.dash, opacity: ".6" }),
|
|
478
436
|
/* @__PURE__ */ jsx7("circle", { cx: YOMIZAKA.node.at[0], cy: YOMIZAKA.node.at[1], r: YOMIZAKA.node.r, fill })
|
|
479
437
|
] }),
|
|
480
|
-
/* @__PURE__ */ jsx7("path", { d: YOMIZAKA.
|
|
481
|
-
/* @__PURE__ */ jsx7("
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
/* @__PURE__ */ jsx7("circle", { cx: YOMIZAKA.lens.glint.cx, cy: YOMIZAKA.lens.glint.cy, r: YOMIZAKA.lens.glint.r, fill: YOMIZAKA.highlight })
|
|
487
|
-
] })
|
|
438
|
+
/* @__PURE__ */ jsx7("path", { d: YOMIZAKA.brow, stroke: fill, strokeWidth: YOMIZAKA.stroke, strokeLinecap: "round", strokeLinejoin: "round" }),
|
|
439
|
+
YOMIZAKA.lenses.map((l) => /* @__PURE__ */ jsx7("circle", { cx: l.cx, cy: l.cy, r: l.r, stroke: fill, strokeWidth: YOMIZAKA.stroke }, l.cx)),
|
|
440
|
+
/* @__PURE__ */ jsx7("g", { className: m("core"), children: YOMIZAKA.pupils.map((p) => /* @__PURE__ */ jsxs7("g", { children: [
|
|
441
|
+
/* @__PURE__ */ jsx7("circle", { cx: p.cx, cy: p.cy, r: p.r, fill }),
|
|
442
|
+
/* @__PURE__ */ jsx7("circle", { cx: p.cx, cy: p.cy, r: p.inner, fill: YOMIZAKA.highlight })
|
|
443
|
+
] }, p.cx)) })
|
|
488
444
|
] });
|
|
489
445
|
}
|
|
490
446
|
|
|
@@ -496,70 +452,45 @@ var YORORIS = {
|
|
|
496
452
|
viewBox: "0 0 400 400",
|
|
497
453
|
croppedViewBox: "80 80 240 240",
|
|
498
454
|
center: 200,
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
/**
|
|
505
|
-
|
|
506
|
-
vein: { color: "#fbf6ea", opacity: 0.45, width: 3, dash: "2 14" },
|
|
507
|
-
/** The stem, from the junction down. */
|
|
508
|
-
stem: "M200 244 L200 312",
|
|
509
|
-
stroke: 30,
|
|
510
|
-
gradient: { x1: 110, y1: 300, x2: 290, y2: 100, stops: marks8.yororis },
|
|
511
|
-
/** The core's warm light: from the mark's sand (below) to a light sand (above). */
|
|
512
|
-
coreGradient: { stops: [["0%", sand], ["100%", "#e6c993"]] },
|
|
513
|
-
/** The core, held in the hollow of the leaves (not on the junction): the one who is listened to. It breathes. */
|
|
514
|
-
core: { cx: 200, cy: 184, r: 32, inner: 11 },
|
|
455
|
+
stroke: 22,
|
|
456
|
+
sand,
|
|
457
|
+
sage,
|
|
458
|
+
/** The two hands: arcs of a circle r 92 centred (200, 162), from 196° to 104° and from 76° to −16°; open at the bottom and the top. */
|
|
459
|
+
hands: "M111.6 136.6 A92 92 0 0 0 177.7 251.3 M222.3 251.3 A92 92 0 0 0 288.4 136.6",
|
|
460
|
+
/** The warm core, held inside the hands. */
|
|
461
|
+
core: { cx: 200, cy: 176, r: 30, inner: 10.2 },
|
|
515
462
|
highlight: "#fbf6ea",
|
|
516
|
-
|
|
517
|
-
moment:
|
|
463
|
+
gradient: { x1: 110, y1: 300, x2: 290, y2: 100, stops: marks8.yororis },
|
|
464
|
+
/** The moment: one node on the orbit — it comes round, then it goes. */
|
|
465
|
+
node: { r: 9, at: [200, 40] },
|
|
518
466
|
glow: { color: sage, opacity: 0.18 },
|
|
519
|
-
/** The core's breathing shadow (web), in the core's warm sand. */
|
|
520
467
|
pulse: { color: sand, low: 0.3, high: 0.6 },
|
|
468
|
+
motion: { spin: 36, breath: 4.2 },
|
|
521
469
|
orbit: { r: 160, dash: "8 8", width: 1.5 },
|
|
522
470
|
ring: { r: 134, width: 1 }
|
|
523
471
|
};
|
|
524
472
|
|
|
525
473
|
// src/marks/YororisLogo.tsx
|
|
526
474
|
import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
527
|
-
var CSS8 =
|
|
528
|
-
.yrm-orbit { transform-origin: 200px 200px; animation: yrm-orbit 36s linear infinite; }
|
|
529
|
-
.yrm-vein { animation: yrm-vein 4.8s linear infinite; }
|
|
530
|
-
.yrm-core { transform-box: fill-box; transform-origin: center; animation: yrm-core 4.2s ease-in-out infinite; }
|
|
531
|
-
@keyframes yrm-orbit { to { transform: rotate(360deg); } }
|
|
532
|
-
@keyframes yrm-vein { to { stroke-dashoffset: 64; } }
|
|
533
|
-
@keyframes yrm-core {
|
|
534
|
-
0%, 100% { filter: drop-shadow(0 0 6px ${withAlpha(YORORIS.pulse.color, YORORIS.pulse.low)}); opacity: .9; }
|
|
535
|
-
50% { filter: drop-shadow(0 0 16px ${withAlpha(YORORIS.pulse.color, YORORIS.pulse.high)}); opacity: 1; }
|
|
536
|
-
}
|
|
537
|
-
@media (prefers-reduced-motion: reduce) { .yrm-orbit, .yrm-vein, .yrm-core { animation: none; } }
|
|
538
|
-
`;
|
|
475
|
+
var CSS8 = familyMotion("yrm", { ...YORORIS.motion, ...YORORIS.pulse });
|
|
539
476
|
function YororisLogo({ size = 32, animated = true, title, className }) {
|
|
540
|
-
const id = useIds("yrm", ["
|
|
541
|
-
const
|
|
477
|
+
const id = useIds("yrm", ["glow"]);
|
|
478
|
+
const m = (cls) => animated ? `yrm-${cls}` : void 0;
|
|
542
479
|
return /* @__PURE__ */ jsxs8("svg", { width: size, height: size, viewBox: size < 48 ? YORORIS.croppedViewBox : YORORIS.viewBox, fill: "none", xmlns: "http://www.w3.org/2000/svg", className, ...a11y(title), children: [
|
|
543
480
|
/* @__PURE__ */ jsx8("style", { children: CSS8 }),
|
|
544
|
-
/* @__PURE__ */
|
|
545
|
-
/* @__PURE__ */ jsx8("
|
|
546
|
-
/* @__PURE__ */ jsx8("
|
|
547
|
-
|
|
548
|
-
/* @__PURE__ */ jsx8("stop", { offset: "0%", stopColor: YORORIS.glow.color, stopOpacity: YORORIS.glow.opacity }),
|
|
549
|
-
/* @__PURE__ */ jsx8("stop", { offset: "100%", stopColor: YORORIS.glow.color, stopOpacity: "0" })
|
|
550
|
-
] })
|
|
551
|
-
] }),
|
|
481
|
+
/* @__PURE__ */ jsx8("defs", { children: /* @__PURE__ */ jsxs8("radialGradient", { id: id.glow, cx: "50%", cy: "50%", r: "50%", children: [
|
|
482
|
+
/* @__PURE__ */ jsx8("stop", { offset: "0%", stopColor: YORORIS.glow.color, stopOpacity: YORORIS.glow.opacity }),
|
|
483
|
+
/* @__PURE__ */ jsx8("stop", { offset: "100%", stopColor: YORORIS.glow.color, stopOpacity: "0" })
|
|
484
|
+
] }) }),
|
|
552
485
|
size >= 48 ? /* @__PURE__ */ jsx8("circle", { cx: YORORIS.center, cy: YORORIS.center, r: "190", fill: `url(#${id.glow})` }) : null,
|
|
553
486
|
/* @__PURE__ */ jsx8("circle", { cx: YORORIS.center, cy: YORORIS.center, r: YORORIS.ring.r, stroke: neutral("--kz-border-default", 30), strokeWidth: YORORIS.ring.width, opacity: ".35" }),
|
|
554
|
-
/* @__PURE__ */ jsxs8("g", { className:
|
|
487
|
+
/* @__PURE__ */ jsxs8("g", { className: m("orbit"), children: [
|
|
555
488
|
/* @__PURE__ */ jsx8("circle", { cx: YORORIS.center, cy: YORORIS.center, r: YORORIS.orbit.r, stroke: neutral("--kz-border-strong", 40), strokeWidth: YORORIS.orbit.width, strokeDasharray: YORORIS.orbit.dash, opacity: ".6" }),
|
|
556
|
-
/* @__PURE__ */ jsx8("circle", { cx: YORORIS.
|
|
489
|
+
/* @__PURE__ */ jsx8("circle", { cx: YORORIS.node.at[0], cy: YORORIS.node.at[1], r: YORORIS.node.r, fill: YORORIS.sage })
|
|
557
490
|
] }),
|
|
558
|
-
/* @__PURE__ */ jsx8("path", { d: YORORIS.
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
/* @__PURE__ */ jsxs8("g", { className: animated ? "yrm-core" : void 0, children: [
|
|
562
|
-
/* @__PURE__ */ jsx8("circle", { cx: YORORIS.core.cx, cy: YORORIS.core.cy, r: YORORIS.core.r, fill: `url(#${id.core})` }),
|
|
491
|
+
/* @__PURE__ */ jsx8("path", { d: YORORIS.hands, stroke: YORORIS.sage, strokeWidth: YORORIS.stroke, strokeLinecap: "round" }),
|
|
492
|
+
/* @__PURE__ */ jsxs8("g", { className: m("core"), children: [
|
|
493
|
+
/* @__PURE__ */ jsx8("circle", { cx: YORORIS.core.cx, cy: YORORIS.core.cy, r: YORORIS.core.r, fill: YORORIS.sand }),
|
|
563
494
|
/* @__PURE__ */ jsx8("circle", { cx: YORORIS.core.cx, cy: YORORIS.core.cy, r: YORORIS.core.inner, fill: YORORIS.highlight })
|
|
564
495
|
] })
|
|
565
496
|
] });
|
|
@@ -590,4 +521,4 @@ export {
|
|
|
590
521
|
YororisLogo,
|
|
591
522
|
ProductLogo
|
|
592
523
|
};
|
|
593
|
-
//# sourceMappingURL=chunk-
|
|
524
|
+
//# sourceMappingURL=chunk-YCIBJ6OQ.js.map
|