@stephen-netu/design-system 0.2.1 → 0.2.2
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/b0-app-shell/clarification-overlay/ClarificationOverlay.svelte +10 -2
- package/dist/b0-app-shell/clarification-overlay/ClarificationOverlay.svelte.d.ts.map +1 -1
- package/dist/b0-app-shell/{command-bar/CommandBar.svelte → global-command-bar/GlobalCommandBar.svelte} +75 -75
- package/dist/b0-app-shell/{command-bar/CommandBar.svelte.d.ts → global-command-bar/GlobalCommandBar.svelte.d.ts} +6 -6
- package/dist/b0-app-shell/global-command-bar/GlobalCommandBar.svelte.d.ts.map +1 -0
- package/dist/b0-app-shell/index.d.ts +1 -1
- package/dist/b0-app-shell/index.d.ts.map +1 -1
- package/dist/b0-app-shell/index.js +1 -1
- package/dist/d0-data-viz/CheckpointPill.svelte +7 -2
- package/dist/d0-data-viz/CheckpointPill.svelte.d.ts.map +1 -1
- package/dist/d0-data-viz/theme-integration.d.ts +3 -3
- package/dist/d0-data-viz/theme-integration.js +3 -3
- package/dist/d0-data-viz/theme-integration.test.js +41 -0
- package/dist/demos/BspSizingInfographic.svelte +3 -32
- package/dist/editor/CodeEditor.test.js +38 -0
- package/dist/editor/FindReplaceDialog.svelte +32 -32
- package/dist/editor/MarkdownEditor.svelte +71 -58
- package/dist/editor/MarkdownEditor.svelte.d.ts.map +1 -1
- package/dist/editor/MarkdownEditor.test.js +38 -0
- package/dist/editor/components/CorrectionTooltip.svelte +0 -1
- package/dist/entity-graph-view/WorldView.svelte +1 -1
- package/dist/fabric/ai/ChatPanel.svelte +31 -31
- package/dist/fabric/ai/ResearchPanel.svelte +6 -3
- package/dist/fabric/ai/ResearchPanel.svelte.d.ts.map +1 -1
- package/dist/fabric/index.d.ts +4 -5
- package/dist/fabric/index.d.ts.map +1 -1
- package/dist/fabric/index.js +3 -3
- package/dist/fabric/input/{CommandBar.svelte → AppHeaderBar.svelte} +13 -13
- package/dist/fabric/input/{CommandBar.svelte.d.ts → AppHeaderBar.svelte.d.ts} +5 -5
- package/dist/fabric/input/AppHeaderBar.svelte.d.ts.map +1 -0
- package/dist/fabric/input/{CommandBar.test.js → AppHeaderBar.test.js} +9 -9
- package/dist/fabric/input/index.d.ts +2 -2
- package/dist/fabric/input/index.d.ts.map +1 -1
- package/dist/fabric/input/index.js +1 -1
- package/dist/fabric/layout/KanbanBoard.svelte +25 -155
- package/dist/fabric/layout/KanbanBoard.svelte.d.ts +2 -26
- package/dist/fabric/layout/KanbanBoard.svelte.d.ts.map +1 -1
- package/dist/fabric/layout/KanbanBoard.test.js +125 -10
- package/dist/fabric/layout/KanbanCard.svelte +27 -223
- package/dist/fabric/layout/KanbanCard.svelte.d.ts +2 -19
- package/dist/fabric/layout/KanbanCard.svelte.d.ts.map +1 -1
- package/dist/fabric/layout/KanbanColumn.svelte +41 -275
- package/dist/fabric/layout/KanbanColumn.svelte.d.ts +2 -22
- package/dist/fabric/layout/KanbanColumn.svelte.d.ts.map +1 -1
- package/dist/fabric/layout/index.d.ts +2 -5
- package/dist/fabric/layout/index.d.ts.map +1 -1
- package/dist/fabric/layout/index.js +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +4 -2
- package/dist/l0-layout/SectionSplitter.svelte +5 -5
- package/dist/l0-layout/block-writer/BlockItem.svelte +6 -4
- package/dist/l0-layout/card/CompactCard.svelte +4 -3
- package/dist/l0-layout/grant/GrantCard.svelte +15 -5
- package/dist/l0-layout/grant/GrantCard.svelte.d.ts.map +1 -1
- package/dist/l0-layout/index.d.ts +2 -0
- package/dist/l0-layout/index.d.ts.map +1 -1
- package/dist/l0-layout/index.js +1 -0
- package/dist/l0-layout/kanban/KanbanBoard.svelte +246 -29
- package/dist/l0-layout/kanban/KanbanBoard.svelte.d.ts +28 -2
- package/dist/l0-layout/kanban/KanbanBoard.svelte.d.ts.map +1 -1
- package/dist/l0-layout/kanban/KanbanCard.svelte +175 -150
- package/dist/l0-layout/kanban/KanbanCard.svelte.d.ts +16 -18
- package/dist/l0-layout/kanban/KanbanCard.svelte.d.ts.map +1 -1
- package/dist/l0-layout/kanban/KanbanColumn.svelte +152 -78
- package/dist/l0-layout/kanban/KanbanColumn.svelte.d.ts +28 -7
- package/dist/l0-layout/kanban/KanbanColumn.svelte.d.ts.map +1 -1
- package/dist/l0-layout/kanban/index.d.ts +6 -0
- package/dist/l0-layout/kanban/index.d.ts.map +1 -0
- package/dist/l0-layout/kanban/index.js +3 -0
- package/dist/n0-node-graph/Node.svelte +2 -2
- package/dist/n0-node-graph/NodePalette.svelte +2 -2
- package/dist/n1-flow-canvas/graph-state.test.js +69 -0
- package/dist/n1-flow-canvas/utils.test.js +116 -0
- package/dist/n3-force-graph/GraphTooltip.svelte +2 -2
- package/dist/n4-adaptive-manifold/AdaptiveManifold.svelte +12 -11
- package/dist/n4-adaptive-manifold/AdaptiveManifold.svelte.d.ts.map +1 -1
- package/dist/n4-adaptive-manifold/classifier.test.js +104 -0
- package/dist/n4-adaptive-manifold/n4-tokens.css +2 -2
- package/dist/p0-primitives/ThemeProvider.svelte +10 -11
- package/dist/p0-primitives/ThemeProvider.svelte.d.ts +1 -1
- package/dist/p0-primitives/ThemeProvider.svelte.d.ts.map +1 -1
- package/dist/p0-primitives/canvas-theme.d.ts +12 -0
- package/dist/p0-primitives/canvas-theme.d.ts.map +1 -1
- package/dist/p0-primitives/canvas-theme.js +10 -0
- package/dist/p0-primitives/index.d.ts +2 -1
- package/dist/p0-primitives/index.d.ts.map +1 -1
- package/dist/p0-primitives/index.js +1 -0
- package/dist/p0-primitives/theme-context.d.ts +9 -0
- package/dist/p0-primitives/theme-context.d.ts.map +1 -0
- package/dist/p0-primitives/theme-context.js +8 -0
- package/dist/p0-primitives/tokens/tokens.css +22 -11
- package/dist/p0-primitives/utils/index.d.ts +2 -2
- package/dist/p0-primitives/utils/index.d.ts.map +1 -1
- package/dist/s0-state/SyncStatus.svelte +1 -1
- package/dist/s0-state/ThemeStore.svelte.d.ts +3 -2
- package/dist/s0-state/ThemeStore.svelte.d.ts.map +1 -1
- package/dist/s0-state/ThemeStore.svelte.js +20 -1
- package/dist/s0-state/index.d.ts +0 -1
- package/dist/s0-state/index.d.ts.map +1 -1
- package/dist/s0-state/index.js +1 -0
- package/dist/s0-state/modal-stack-store.svelte.d.ts +25 -0
- package/dist/s0-state/modal-stack-store.svelte.d.ts.map +1 -1
- package/dist/s0-state/modal-stack-store.svelte.js +19 -0
- package/dist/showcase/Showcase.svelte +43 -34
- package/dist/showcase/Showcase.svelte.d.ts.map +1 -1
- package/dist/spatial/BspTilingCanvas.svelte +5 -5
- package/dist/spatial/BspTilingSimulation.test.js +88 -0
- package/dist/spatial/CameraController.test.js +120 -0
- package/dist/spatial/ForceCanvas.svelte +18 -13
- package/dist/spatial/ForceCanvas.svelte.d.ts.map +1 -1
- package/dist/spatial/ForceSimulation.svelte.d.ts.map +1 -1
- package/dist/spatial/ForceSimulation.svelte.js +32 -21
- package/dist/spatial/LodRenderer.svelte +14 -1
- package/dist/spatial/LodRenderer.svelte.d.ts.map +1 -1
- package/dist/spatial/SnapZoomCamera.svelte +23 -13
- package/dist/spatial/SnapZoomCamera.svelte.d.ts.map +1 -1
- package/dist/spatial/ZoneTiler.svelte +3 -2
- package/dist/spatial/d3-types.d.ts +31 -0
- package/dist/spatial/d3-types.d.ts.map +1 -0
- package/dist/spatial/d3-types.js +19 -0
- package/dist/ssr-import-clean.test.js +37 -0
- package/dist/t0-transport/fs.d.ts +12 -0
- package/dist/t0-transport/fs.d.ts.map +1 -0
- package/dist/t0-transport/fs.js +55 -0
- package/dist/t0-transport/index.d.ts +1 -0
- package/dist/t0-transport/index.d.ts.map +1 -1
- package/dist/t0-transport/index.js +1 -0
- package/dist/t0-transport/invoke.d.ts.map +1 -1
- package/dist/t0-transport/invoke.js +5 -2
- package/dist/t0-transport/quality.d.ts +12 -3
- package/dist/t0-transport/quality.d.ts.map +1 -1
- package/dist/t0-transport/quality.js +17 -4
- package/dist/t0-transport/substrate.svelte.d.ts +27 -0
- package/dist/t0-transport/substrate.svelte.d.ts.map +1 -0
- package/dist/t0-transport/substrate.svelte.js +49 -0
- package/dist/u0-primitives/LockIndicator.svelte +1 -1
- package/dist/u0-primitives/VerticalToolbar.svelte +1 -1
- package/dist/u0-primitives/accordion/Accordion.svelte +10 -9
- package/dist/u0-primitives/accordion/Accordion.svelte.d.ts +0 -7
- package/dist/u0-primitives/accordion/Accordion.svelte.d.ts.map +1 -1
- package/dist/u0-primitives/accordion/Accordion.test.js +5 -5
- package/dist/u0-primitives/badge/Badge.test.js +10 -10
- package/dist/u0-primitives/badge/ValidityBadge.test.js +9 -9
- package/dist/u0-primitives/button/Button.svelte +3 -1
- package/dist/u0-primitives/button/Button.svelte.d.ts +1 -0
- package/dist/u0-primitives/button/Button.svelte.d.ts.map +1 -1
- package/dist/u0-primitives/button/Button.test.js +11 -11
- package/dist/u0-primitives/card/Card.svelte +26 -20
- package/dist/u0-primitives/card/Card.svelte.d.ts.map +1 -1
- package/dist/u0-primitives/command-palette/CommandPalette.svelte +27 -0
- package/dist/u0-primitives/command-palette/CommandPalette.svelte.d.ts.map +1 -1
- package/dist/u0-primitives/command-palette/commandStore.svelte.d.ts.map +1 -1
- package/dist/u0-primitives/command-palette/commandStore.svelte.js +2 -1
- package/dist/u0-primitives/dropdown/Dropdown.test.js +1 -1
- package/dist/u0-primitives/index.d.ts +2 -0
- package/dist/u0-primitives/index.d.ts.map +1 -1
- package/dist/u0-primitives/index.js +1 -0
- package/dist/u0-primitives/input/Input.svelte +9 -0
- package/dist/u0-primitives/input/Input.svelte.d.ts.map +1 -1
- package/dist/u0-primitives/input/Input.test.js +1 -1
- package/dist/u0-primitives/modal/Modal.svelte +46 -23
- package/dist/u0-primitives/modal/Modal.svelte.d.ts.map +1 -1
- package/dist/u0-primitives/modal/Modal.test.js +63 -15
- package/dist/u0-primitives/rsvp/RsvpReader.svelte +8 -8
- package/dist/u0-primitives/rsvp/RsvpReader.svelte.d.ts.map +1 -1
- package/dist/u0-primitives/steps/Steps.svelte +2 -2
- package/dist/u0-primitives/surface-state/SurfaceState.svelte +190 -0
- package/dist/u0-primitives/surface-state/SurfaceState.svelte.d.ts +15 -0
- package/dist/u0-primitives/surface-state/SurfaceState.svelte.d.ts.map +1 -0
- package/dist/u0-primitives/toggle/Toggle.svelte +12 -2
- package/dist/u0-primitives/tooltip/Tooltip.test.js +12 -12
- package/dist/v0-diagrams/MarkmapDiagram.test.js +49 -0
- package/dist/v0-diagrams/MermaidDiagram.svelte +21 -9
- package/dist/v0-diagrams/MermaidDiagram.svelte.d.ts.map +1 -1
- package/dist/v0-diagrams/MermaidDiagram.test.js +40 -0
- package/package.json +50 -24
- package/src/n4-adaptive-manifold/n4-tokens.css +2 -2
- package/src/p0-primitives/tokens/tokens.css +22 -11
- package/src/p0-primitives/tokens/tokens.json +13 -2
- package/dist/b0-app-shell/command-bar/CommandBar.svelte.d.ts.map +0 -1
- package/dist/fabric/input/CommandBar.svelte.d.ts.map +0 -1
- package/dist/stores/vaultStore.svelte +0 -14
- package/dist/stores/vaultStore.svelte.d.ts +0 -24
- package/dist/stores/vaultStore.svelte.d.ts.map +0 -1
- package/dist/tauri/index.d.ts +0 -3
- package/dist/tauri/index.d.ts.map +0 -1
- package/dist/tauri/index.js +0 -11
|
@@ -18,10 +18,11 @@
|
|
|
18
18
|
ResolvedThemeColors,
|
|
19
19
|
NodeIndicatorState,
|
|
20
20
|
PhaseTheme,
|
|
21
|
+
NodeLayout,
|
|
21
22
|
} from './types.js';
|
|
22
23
|
import { DEFAULT_LAYOUT_PREFERENCES } from './types.js';
|
|
23
24
|
import { resolvePhaseTheme, DEFAULT_PHASE_THEME } from './phase-theme.js';
|
|
24
|
-
import
|
|
25
|
+
import { getCanvasTheme } from '../p0-primitives/canvas-theme';
|
|
25
26
|
import { LayoutOrchestrator } from './orchestrator.js';
|
|
26
27
|
import { ManifoldProvider } from './providers/manifold-provider.js';
|
|
27
28
|
import { GravitationalProvider } from './providers/gravitational-provider.js';
|
|
@@ -90,18 +91,18 @@
|
|
|
90
91
|
|
|
91
92
|
let containerEl: HTMLDivElement | undefined = $state(undefined);
|
|
92
93
|
let colors: ResolvedThemeColors = $state({
|
|
93
|
-
canvasBg:
|
|
94
|
-
nodeActive:
|
|
95
|
-
nodeIdle:
|
|
94
|
+
canvasBg: getCanvasTheme().bg,
|
|
95
|
+
nodeActive: getCanvasTheme().nodeBorder,
|
|
96
|
+
nodeIdle: getCanvasTheme().nodeText,
|
|
96
97
|
nodeBlocked: '#f39c12',
|
|
97
|
-
nodeCompleted:
|
|
98
|
+
nodeCompleted: getCanvasTheme().nodeText,
|
|
98
99
|
nodeCritical: '#c0392b',
|
|
99
|
-
nodeBg:
|
|
100
|
-
nodeBorder:
|
|
101
|
-
nodeText:
|
|
102
|
-
edgeColor:
|
|
103
|
-
edgeActive:
|
|
104
|
-
pulseColor:
|
|
100
|
+
nodeBg: getCanvasTheme().node,
|
|
101
|
+
nodeBorder: getCanvasTheme().edgeFade,
|
|
102
|
+
nodeText: getCanvasTheme().nodeText,
|
|
103
|
+
edgeColor: getCanvasTheme().edgeFade,
|
|
104
|
+
edgeActive: getCanvasTheme().nodeBorder,
|
|
105
|
+
pulseColor: getCanvasTheme().nodeBorder,
|
|
105
106
|
pulseCritical: '#c0392b',
|
|
106
107
|
});
|
|
107
108
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AdaptiveManifold.svelte.d.ts","sourceRoot":"","sources":["../../src/n4-adaptive-manifold/AdaptiveManifold.svelte.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EACR,gBAAgB,EAEhB,eAAe,EACf,oBAAoB,EACpB,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EAGjB,kBAAkB,
|
|
1
|
+
{"version":3,"file":"AdaptiveManifold.svelte.d.ts","sourceRoot":"","sources":["../../src/n4-adaptive-manifold/AdaptiveManifold.svelte.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EACR,gBAAgB,EAEhB,eAAe,EACf,oBAAoB,EACpB,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EAGjB,kBAAkB,EAGnB,MAAM,YAAY,CAAC;AAapB,UAAU,KAAK;IACb,QAAQ,EAAE,gBAAgB,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,WAAW,CAAC,EAAE,iBAAiB,CAAC;IAChC,aAAa,CAAC,EAAE,iBAAiB,CAAC;IAClC,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,eAAe,KAAK,IAAI,CAAC;IACzD,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC1D,YAAY,CAAC,EAAE,CAAC,UAAU,EAAE,gBAAgB,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7D,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC/C,eAAe,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAmkCH,QAAA,MAAM,gBAAgB;;;;;MAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}
|
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
import { describe, it, expect } from 'vitest';
|
|
2
|
+
import { classifyTopology, computeMetrics, STABILITY_TICKS } from './classifier';
|
|
3
|
+
import { EASING_FUNCTIONS, TransitionAnimator } from './transition';
|
|
4
|
+
function makeSnapshot(nodes, edges) {
|
|
5
|
+
return {
|
|
6
|
+
nodes: nodes.map((id) => ({ id, label: id, weight: 1, type: 'default' })),
|
|
7
|
+
edges: edges.map((e, i) => ({ id: `e-${i}`, source: e.source, target: e.target })),
|
|
8
|
+
};
|
|
9
|
+
}
|
|
10
|
+
describe('n4-adaptive-manifold/classifier', () => {
|
|
11
|
+
it('recommends manifold for any graph', () => {
|
|
12
|
+
const snapshot = makeSnapshot(['a', 'b', 'c'], [{ source: 'a', target: 'b' }]);
|
|
13
|
+
const result = classifyTopology(snapshot);
|
|
14
|
+
expect(result.recommended).toBe('manifold');
|
|
15
|
+
expect(result.confidence).toBe(1.0);
|
|
16
|
+
});
|
|
17
|
+
it('returns empty metrics for empty snapshot', () => {
|
|
18
|
+
const snapshot = makeSnapshot([], []);
|
|
19
|
+
const metrics = computeMetrics(snapshot);
|
|
20
|
+
expect(metrics.nodeCount).toBe(0);
|
|
21
|
+
expect(metrics.edgeCount).toBe(0);
|
|
22
|
+
expect(metrics.edgeDensity).toBe(0);
|
|
23
|
+
});
|
|
24
|
+
it('computes correct node/edge counts', () => {
|
|
25
|
+
const snapshot = makeSnapshot(['a', 'b', 'c'], [
|
|
26
|
+
{ source: 'a', target: 'b' },
|
|
27
|
+
{ source: 'b', target: 'c' },
|
|
28
|
+
]);
|
|
29
|
+
const metrics = computeMetrics(snapshot);
|
|
30
|
+
expect(metrics.nodeCount).toBe(3);
|
|
31
|
+
expect(metrics.edgeCount).toBe(2);
|
|
32
|
+
expect(metrics.edgeDensity).toBeCloseTo(2 / 3);
|
|
33
|
+
});
|
|
34
|
+
it('detects cycles in directed graph', () => {
|
|
35
|
+
const snapshot = makeSnapshot(['a', 'b', 'c'], [
|
|
36
|
+
{ source: 'a', target: 'b' },
|
|
37
|
+
{ source: 'b', target: 'c' },
|
|
38
|
+
{ source: 'c', target: 'a' },
|
|
39
|
+
]);
|
|
40
|
+
const metrics = computeMetrics(snapshot);
|
|
41
|
+
expect(metrics.cycleCount).toBeGreaterThan(0);
|
|
42
|
+
});
|
|
43
|
+
it('counts roots (in-degree 0)', () => {
|
|
44
|
+
const snapshot = makeSnapshot(['a', 'b', 'c'], [
|
|
45
|
+
{ source: 'a', target: 'b' },
|
|
46
|
+
{ source: 'a', target: 'c' },
|
|
47
|
+
]);
|
|
48
|
+
const metrics = computeMetrics(snapshot);
|
|
49
|
+
expect(metrics.rootCount).toBe(1);
|
|
50
|
+
});
|
|
51
|
+
it('computes max depth via BFS from roots', () => {
|
|
52
|
+
const snapshot = makeSnapshot(['a', 'b', 'c', 'd'], [
|
|
53
|
+
{ source: 'a', target: 'b' },
|
|
54
|
+
{ source: 'b', target: 'c' },
|
|
55
|
+
{ source: 'c', target: 'd' },
|
|
56
|
+
]);
|
|
57
|
+
const metrics = computeMetrics(snapshot);
|
|
58
|
+
expect(metrics.maxDepth).toBe(3);
|
|
59
|
+
});
|
|
60
|
+
it('counts connected components', () => {
|
|
61
|
+
const snapshot = makeSnapshot(['a', 'b', 'c', 'd'], [
|
|
62
|
+
{ source: 'a', target: 'b' },
|
|
63
|
+
{ source: 'c', target: 'd' },
|
|
64
|
+
]);
|
|
65
|
+
const metrics = computeMetrics(snapshot);
|
|
66
|
+
expect(metrics.componentCount).toBe(2);
|
|
67
|
+
});
|
|
68
|
+
it('tracks max cluster size', () => {
|
|
69
|
+
const snapshot = makeSnapshot(['a', 'b', 'c', 'd'], [
|
|
70
|
+
{ source: 'a', target: 'b' },
|
|
71
|
+
{ source: 'b', target: 'c' },
|
|
72
|
+
{ source: 'd', target: 'd' },
|
|
73
|
+
]);
|
|
74
|
+
const metrics = computeMetrics(snapshot);
|
|
75
|
+
expect(metrics.maxClusterSize).toBe(3);
|
|
76
|
+
});
|
|
77
|
+
it('STABILITY_TICKS is 3', () => {
|
|
78
|
+
expect(STABILITY_TICKS).toBe(3);
|
|
79
|
+
});
|
|
80
|
+
});
|
|
81
|
+
describe('n4-adaptive-manifold/transition', () => {
|
|
82
|
+
it('EASING_FUNCTIONS contains expected names', () => {
|
|
83
|
+
expect(EASING_FUNCTIONS).toHaveProperty('linear');
|
|
84
|
+
expect(EASING_FUNCTIONS).toHaveProperty('easeInOutCubic');
|
|
85
|
+
expect(EASING_FUNCTIONS).toHaveProperty('easeOutExpo');
|
|
86
|
+
expect(EASING_FUNCTIONS).toHaveProperty('spring');
|
|
87
|
+
});
|
|
88
|
+
it('linear easing returns t unchanged', () => {
|
|
89
|
+
expect(EASING_FUNCTIONS.linear(0)).toBe(0);
|
|
90
|
+
expect(EASING_FUNCTIONS.linear(0.5)).toBe(0.5);
|
|
91
|
+
expect(EASING_FUNCTIONS.linear(1)).toBe(1);
|
|
92
|
+
});
|
|
93
|
+
it('easeInOutCubic is clamped to [0,1]', () => {
|
|
94
|
+
expect(EASING_FUNCTIONS.easeInOutCubic(0)).toBe(0);
|
|
95
|
+
expect(EASING_FUNCTIONS.easeInOutCubic(1)).toBe(1);
|
|
96
|
+
expect(EASING_FUNCTIONS.easeInOutCubic(0.5)).toBeCloseTo(0.5);
|
|
97
|
+
});
|
|
98
|
+
it('TransitionAnimator cancels without error', () => {
|
|
99
|
+
const animator = new TransitionAnimator();
|
|
100
|
+
expect(animator.active).toBe(false);
|
|
101
|
+
animator.cancel();
|
|
102
|
+
expect(animator.active).toBe(false);
|
|
103
|
+
});
|
|
104
|
+
});
|
|
@@ -66,10 +66,10 @@
|
|
|
66
66
|
|
|
67
67
|
/* ── Kind accents (overridden by consuming apps) ───────────────────────── */
|
|
68
68
|
--n4-kind-task: var(--color-accent, #b87333);
|
|
69
|
-
--n4-kind-agent: var(--
|
|
69
|
+
--n4-kind-agent: var(--expert-sovereign, #b87333);
|
|
70
70
|
--n4-kind-signal: var(--color-status-info, #2980b9);
|
|
71
71
|
--n4-kind-capability: var(--color-accent-secondary, #d4a574);
|
|
72
|
-
--n4-kind-intent: var(--
|
|
72
|
+
--n4-kind-intent: var(--expert-atelier, #b87333);
|
|
73
73
|
--n4-kind-subtask: color-mix(in srgb, var(--color-accent, #b87333) 60%, transparent);
|
|
74
74
|
--n4-kind-note: var(--color-text-primary, #e8e0d0);
|
|
75
75
|
--n4-kind-concept: var(--color-accent-secondary, #d4a574);
|
|
@@ -4,13 +4,12 @@
|
|
|
4
4
|
*
|
|
5
5
|
* Runtime theme management for KOS Design System.
|
|
6
6
|
* Provides light/dark/auto modes and custom theme overrides.
|
|
7
|
-
*
|
|
7
|
+
* Receives theme store via Svelte context (set by s0-state or app layer).
|
|
8
8
|
*
|
|
9
9
|
* @package @kos/design-system/p0-primitives
|
|
10
10
|
*/
|
|
11
11
|
import type { Snippet } from 'svelte';
|
|
12
|
-
import {
|
|
13
|
-
import { themeStore, initThemeStore, type ThemeName } from '../s0-state/ThemeStore.svelte';
|
|
12
|
+
import { getThemeStore, THEME_STORE_KEY, type ThemeName, type ThemeStoreLike } from './theme-context';
|
|
14
13
|
|
|
15
14
|
export type ThemeMode = 'light' | 'dark' | 'auto';
|
|
16
15
|
|
|
@@ -81,7 +80,7 @@
|
|
|
81
80
|
|
|
82
81
|
let { mode, theme, children }: Props = $props();
|
|
83
82
|
|
|
84
|
-
|
|
83
|
+
const store = getThemeStore();
|
|
85
84
|
|
|
86
85
|
const THEME_MAP: Record<Exclude<ThemeMode, 'auto'>, ThemeName> = {
|
|
87
86
|
dark: 'dark',
|
|
@@ -97,7 +96,7 @@
|
|
|
97
96
|
}
|
|
98
97
|
|
|
99
98
|
$effect(() => {
|
|
100
|
-
|
|
99
|
+
store.setTheme(resolveMode());
|
|
101
100
|
});
|
|
102
101
|
|
|
103
102
|
function generateCSSVariables(t: ThemeConfig | undefined): string {
|
|
@@ -165,10 +164,10 @@
|
|
|
165
164
|
|
|
166
165
|
<div
|
|
167
166
|
class="theme-provider"
|
|
168
|
-
class:mode-dark={
|
|
169
|
-
class:mode-light={
|
|
170
|
-
data-theme={
|
|
171
|
-
data-theme-mode={
|
|
167
|
+
class:mode-dark={store.theme === 'dark'}
|
|
168
|
+
class:mode-light={store.theme === 'light'}
|
|
169
|
+
data-theme={store.theme}
|
|
170
|
+
data-theme-mode={store.theme}
|
|
172
171
|
style={customStyles}
|
|
173
172
|
>
|
|
174
173
|
{@render children()}
|
|
@@ -176,8 +175,8 @@
|
|
|
176
175
|
|
|
177
176
|
<style>
|
|
178
177
|
.theme-provider {
|
|
179
|
-
color: var(--color-text-primary
|
|
180
|
-
background: var(--color-bg-primary
|
|
178
|
+
color: var(--color-text-primary);
|
|
179
|
+
background: var(--color-bg-primary);
|
|
181
180
|
font-family: var(--font-sans, 'Outfit', system-ui, sans-serif);
|
|
182
181
|
}
|
|
183
182
|
</style>
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*
|
|
4
4
|
* Runtime theme management for KOS Design System.
|
|
5
5
|
* Provides light/dark/auto modes and custom theme overrides.
|
|
6
|
-
*
|
|
6
|
+
* Receives theme store via Svelte context (set by s0-state or app layer).
|
|
7
7
|
*
|
|
8
8
|
* @package @kos/design-system/p0-primitives
|
|
9
9
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeProvider.svelte.d.ts","sourceRoot":"","sources":["../../src/p0-primitives/ThemeProvider.svelte.ts"],"names":[],"mappings":"AAGA;;;;;;;;KAQK;AACL,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"ThemeProvider.svelte.d.ts","sourceRoot":"","sources":["../../src/p0-primitives/ThemeProvider.svelte.ts"],"names":[],"mappings":"AAGA;;;;;;;;KAQK;AACL,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAIpC,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;AAElD,MAAM,WAAW,WAAW;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAE9B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,UAAU,KAAK;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAqGH,QAAA,MAAM,aAAa,2CAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}
|
|
@@ -1,3 +1,13 @@
|
|
|
1
|
+
interface SeverityPalette {
|
|
2
|
+
critical: string;
|
|
3
|
+
major: string;
|
|
4
|
+
minor: string;
|
|
5
|
+
}
|
|
6
|
+
interface QuaternionPalette {
|
|
7
|
+
i: string;
|
|
8
|
+
j: string;
|
|
9
|
+
k: string;
|
|
10
|
+
}
|
|
1
11
|
interface CanvasTheme {
|
|
2
12
|
bg: string;
|
|
3
13
|
node: string;
|
|
@@ -7,6 +17,8 @@ interface CanvasTheme {
|
|
|
7
17
|
edgeLine: string;
|
|
8
18
|
edgeFade: string;
|
|
9
19
|
focus: string;
|
|
20
|
+
severity: SeverityPalette;
|
|
21
|
+
quaternion: QuaternionPalette;
|
|
10
22
|
}
|
|
11
23
|
/**
|
|
12
24
|
* Get the current canvas theme by reading CSS custom properties.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"canvas-theme.d.ts","sourceRoot":"","sources":["../../src/p0-primitives/canvas-theme.ts"],"names":[],"mappings":"AAWA,UAAU,WAAW;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"canvas-theme.d.ts","sourceRoot":"","sources":["../../src/p0-primitives/canvas-theme.ts"],"names":[],"mappings":"AAWA,UAAU,eAAe;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,UAAU,iBAAiB;IACzB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,UAAU,WAAW;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,eAAe,CAAC;IAC1B,UAAU,EAAE,iBAAiB,CAAC;CAC/B;AAYD;;;GAGG;AACH,wBAAgB,cAAc,IAAI,WAAW,CAqB5C;AAED,YAAY,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -32,5 +32,15 @@ export function getCanvasTheme() {
|
|
|
32
32
|
edgeLine: resolveCssVar('--color-accent', '#b87333'),
|
|
33
33
|
edgeFade: resolveCssVar('--color-accent-muted', '#5a4a30'),
|
|
34
34
|
focus: resolveCssVar('--color-warning', '#d4943a'),
|
|
35
|
+
severity: {
|
|
36
|
+
critical: resolveCssVar('--color-status-error', '#c14a4a'),
|
|
37
|
+
major: resolveCssVar('--color-warning', '#d4a04c'),
|
|
38
|
+
minor: resolveCssVar('--color-text-tertiary', '#6b6558'),
|
|
39
|
+
},
|
|
40
|
+
quaternion: {
|
|
41
|
+
i: resolveCssVar('--accent-hover', '#d4892f'),
|
|
42
|
+
j: resolveCssVar('--color-success', '#4fa8a2'),
|
|
43
|
+
k: resolveCssVar('--color-warning', '#d4a04c'),
|
|
44
|
+
},
|
|
35
45
|
};
|
|
36
46
|
}
|
|
@@ -2,7 +2,8 @@ export * from './types/index';
|
|
|
2
2
|
export * from './utils/index';
|
|
3
3
|
export { getCanvasTheme } from './canvas-theme';
|
|
4
4
|
export { default as ThemeProvider } from './ThemeProvider.svelte';
|
|
5
|
+
export { provideThemeStore, THEME_STORE_KEY } from './theme-context';
|
|
6
|
+
export type { ThemeName, ThemeStoreLike } from './theme-context';
|
|
5
7
|
export type { ThemeMode, ThemeConfig } from './ThemeProvider.svelte';
|
|
6
8
|
export { createTheme, defaultLightTheme, defaultDarkTheme, brassAccentTheme } from './theme';
|
|
7
|
-
export type { ThemeName } from '../s0-state/ThemeStore.svelte';
|
|
8
9
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/p0-primitives/index.ts"],"names":[],"mappings":"AAIA,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAGhD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/p0-primitives/index.ts"],"names":[],"mappings":"AAIA,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAGhD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACrE,YAAY,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjE,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -6,4 +6,5 @@ export * from './utils/index';
|
|
|
6
6
|
export { getCanvasTheme } from './canvas-theme';
|
|
7
7
|
// Theme system
|
|
8
8
|
export { default as ThemeProvider } from './ThemeProvider.svelte';
|
|
9
|
+
export { provideThemeStore, THEME_STORE_KEY } from './theme-context';
|
|
9
10
|
export { createTheme, defaultLightTheme, defaultDarkTheme, brassAccentTheme } from './theme';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export type ThemeName = 'dark' | 'light' | 'control-room';
|
|
2
|
+
export interface ThemeStoreLike {
|
|
3
|
+
theme: ThemeName;
|
|
4
|
+
setTheme(t: ThemeName): void;
|
|
5
|
+
}
|
|
6
|
+
export declare const THEME_STORE_KEY: unique symbol;
|
|
7
|
+
export declare function provideThemeStore(store: ThemeStoreLike): void;
|
|
8
|
+
export declare function getThemeStore(): ThemeStoreLike;
|
|
9
|
+
//# sourceMappingURL=theme-context.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"theme-context.d.ts","sourceRoot":"","sources":["../../src/p0-primitives/theme-context.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,cAAc,CAAC;AAE1D,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;CAC9B;AAED,eAAO,MAAM,eAAe,eAA4B,CAAC;AAEzD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI,CAE7D;AAED,wBAAgB,aAAa,IAAI,cAAc,CAE9C"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { getContext, setContext } from 'svelte';
|
|
2
|
+
export const THEME_STORE_KEY = Symbol('kos-theme-store');
|
|
3
|
+
export function provideThemeStore(store) {
|
|
4
|
+
setContext(THEME_STORE_KEY, store);
|
|
5
|
+
}
|
|
6
|
+
export function getThemeStore() {
|
|
7
|
+
return getContext(THEME_STORE_KEY);
|
|
8
|
+
}
|
|
@@ -28,14 +28,22 @@
|
|
|
28
28
|
--color-card-text-secondary: #a8a08c;
|
|
29
29
|
--color-card-text-tertiary: #6b6558;
|
|
30
30
|
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
--
|
|
36
|
-
--
|
|
37
|
-
--
|
|
38
|
-
--
|
|
31
|
+
/* --- Accent (default: brass, user-controllable via --accent-*) --- */
|
|
32
|
+
--accent-primary: #b87333;
|
|
33
|
+
--accent-hover: #d4892f;
|
|
34
|
+
--accent-active: #8a5526;
|
|
35
|
+
--accent-glow: rgba(184, 115, 51, 0.28);
|
|
36
|
+
--accent-muted: rgba(184, 115, 51, 0.16);
|
|
37
|
+
--accent-subtle: rgba(184, 115, 51, 0.08);
|
|
38
|
+
--accent-faint: rgba(184, 115, 51, 0.04);
|
|
39
|
+
--color-accent: var(--accent-primary);
|
|
40
|
+
--color-accent-hover: var(--accent-hover);
|
|
41
|
+
--color-accent-active: var(--accent-active);
|
|
42
|
+
--color-accent-glow: var(--accent-glow);
|
|
43
|
+
--color-accent-muted: var(--accent-muted);
|
|
44
|
+
--color-accent-subtle: var(--accent-subtle);
|
|
45
|
+
--color-accent-faint: var(--accent-faint);
|
|
46
|
+
--color-accent-secondary: #d4a574; /* Companion warm tone (n4 kind colors) */
|
|
39
47
|
|
|
40
48
|
/* Overlay levels — white opacity ramps for borders, backgrounds, hover states */
|
|
41
49
|
--overlay-white-02: rgba(255, 255, 255, 0.02);
|
|
@@ -59,9 +67,10 @@
|
|
|
59
67
|
--overlay-accent-50: rgba(184, 115, 51, 0.50);
|
|
60
68
|
--overlay-accent-55: rgba(184, 115, 51, 0.55);
|
|
61
69
|
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
70
|
+
/* Overlay levels — status color opacity ramps */
|
|
71
|
+
--overlay-success-06: rgba(79, 168, 162, 0.06);
|
|
72
|
+
--overlay-warning-06: rgba(245, 192, 48, 0.06);
|
|
73
|
+
--overlay-error-06: rgba(193, 74, 74, 0.06);
|
|
65
74
|
|
|
66
75
|
/* Cell background for band/offer tables */
|
|
67
76
|
--color-bg-cell: #121518;
|
|
@@ -78,7 +87,9 @@
|
|
|
78
87
|
--color-success: #4fa8a2;
|
|
79
88
|
--color-warning: #d4a04c;
|
|
80
89
|
--color-error: #c14a4a;
|
|
90
|
+
--color-error-bg: rgba(193, 74, 74, 0.10);
|
|
81
91
|
--color-info: #5b8db8;
|
|
92
|
+
--color-neutral: #6b6558; /* Inactive / archival (e.g. compost phase) */
|
|
82
93
|
|
|
83
94
|
/* --- Semantic (presence) --- */
|
|
84
95
|
--color-online: #4fa8a2;
|
|
@@ -5,9 +5,9 @@ export declare function cn(...classes: (string | undefined | null | false)[]): s
|
|
|
5
5
|
/**
|
|
6
6
|
* Debounce function
|
|
7
7
|
*/
|
|
8
|
-
export declare function debounce<T extends (...args:
|
|
8
|
+
export declare function debounce<T extends (...args: unknown[]) => unknown>(fn: T, delay: number): (...args: Parameters<T>) => void;
|
|
9
9
|
/**
|
|
10
10
|
* Throttle function
|
|
11
11
|
*/
|
|
12
|
-
export declare function throttle<T extends (...args:
|
|
12
|
+
export declare function throttle<T extends (...args: unknown[]) => unknown>(fn: T, limit: number): (...args: Parameters<T>) => void;
|
|
13
13
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/p0-primitives/utils/index.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,wBAAgB,EAAE,CAAC,GAAG,OAAO,EAAE,CAAC,MAAM,GAAG,SAAS,GAAG,IAAI,GAAG,KAAK,CAAC,EAAE,GAAG,MAAM,CAE5E;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,CAAC,GAAG,IAAI,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/p0-primitives/utils/index.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,wBAAgB,EAAE,CAAC,GAAG,OAAO,EAAE,CAAC,MAAM,GAAG,SAAS,GAAG,IAAI,GAAG,KAAK,CAAC,EAAE,GAAG,MAAM,CAE5E;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,OAAO,EAChE,EAAE,EAAE,CAAC,EACL,KAAK,EAAE,MAAM,GACZ,CAAC,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,CAMlC;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,OAAO,EAChE,EAAE,EAAE,CAAC,EACL,KAAK,EAAE,MAAM,GACZ,CAAC,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,CASlC"}
|
|
@@ -263,7 +263,7 @@
|
|
|
263
263
|
}
|
|
264
264
|
|
|
265
265
|
.action-danger {
|
|
266
|
-
background: var(--color-error-
|
|
266
|
+
background: var(--color-error-bg, rgba(193, 74, 74, 0.10));
|
|
267
267
|
color: var(--color-error, #c0392b);
|
|
268
268
|
border-color: var(--color-error, #c0392b);
|
|
269
269
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
import type { ThemeName } from '../p0-primitives/theme-context';
|
|
2
|
+
export type { ThemeName } from '../p0-primitives/theme-context';
|
|
2
3
|
declare class ThemeStore {
|
|
3
4
|
#private;
|
|
4
5
|
get theme(): ThemeName;
|
|
@@ -7,6 +8,6 @@ declare class ThemeStore {
|
|
|
7
8
|
syncFromDOM(): void;
|
|
8
9
|
}
|
|
9
10
|
export declare const themeStore: ThemeStore;
|
|
11
|
+
export declare function provideThemeStoreContext(): void;
|
|
10
12
|
export declare function initThemeStore(): void;
|
|
11
|
-
export {};
|
|
12
13
|
//# sourceMappingURL=ThemeStore.svelte.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeStore.svelte.d.ts","sourceRoot":"","sources":["../../src/s0-state/ThemeStore.svelte.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ThemeStore.svelte.d.ts","sourceRoot":"","sources":["../../src/s0-state/ThemeStore.svelte.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAChE,YAAY,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAyBhE,cAAM,UAAU;;IAGd,IAAI,KAAK,IAAI,SAAS,CAErB;IAED,QAAQ,CAAC,CAAC,EAAE,SAAS,GAAG,IAAI;IAS5B,WAAW,IAAI,IAAI;IAMnB,WAAW,IAAI,IAAI;CAMpB;AAED,eAAO,MAAM,UAAU,YAAmB,CAAC;AAE3C,wBAAgB,wBAAwB,IAAI,IAAI,CAE/C;AAED,wBAAgB,cAAc,IAAI,IAAI,CAOrC"}
|
|
@@ -1,4 +1,19 @@
|
|
|
1
|
-
|
|
1
|
+
/**
|
|
2
|
+
* ThemeStore — Module-scope singleton for theme state (F-29).
|
|
3
|
+
*
|
|
4
|
+
* Instantiated once at module scope. Reads localStorage during import
|
|
5
|
+
* (safely guarded by hasLocalStorage()). Bundlers keep the instantiation
|
|
6
|
+
* at import time, so this module is NOT SSR-inert.
|
|
7
|
+
*
|
|
8
|
+
* @module s0-state/ThemeStore
|
|
9
|
+
* @example
|
|
10
|
+
* ```ts
|
|
11
|
+
* import { themeStore } from '@kos/design-system/s0-state';
|
|
12
|
+
* themeStore.setTheme('light');
|
|
13
|
+
* ```
|
|
14
|
+
*/
|
|
15
|
+
import { setContext, onMount } from 'svelte';
|
|
16
|
+
import { THEME_STORE_KEY } from '../p0-primitives/theme-context';
|
|
2
17
|
const STORAGE_KEY = 'kos-theme';
|
|
3
18
|
function hasLocalStorage() {
|
|
4
19
|
try {
|
|
@@ -51,7 +66,11 @@ class ThemeStore {
|
|
|
51
66
|
}
|
|
52
67
|
}
|
|
53
68
|
export const themeStore = new ThemeStore();
|
|
69
|
+
export function provideThemeStoreContext() {
|
|
70
|
+
setContext(THEME_STORE_KEY, themeStore);
|
|
71
|
+
}
|
|
54
72
|
export function initThemeStore() {
|
|
73
|
+
provideThemeStoreContext();
|
|
55
74
|
onMount(() => {
|
|
56
75
|
themeStore.syncFromDOM();
|
|
57
76
|
const stored = getStoredTheme();
|
package/dist/s0-state/index.d.ts
CHANGED
|
@@ -6,5 +6,4 @@ export { createVirtualList, createVirtualGrid, createPreloader, calculateGridLay
|
|
|
6
6
|
export { default as SyncStatus } from './SyncStatus.svelte';
|
|
7
7
|
export type { SyncStatusState, SyncStatusAction } from './SyncStatus.svelte';
|
|
8
8
|
export type { ModalData } from './modal-stack-store.svelte';
|
|
9
|
-
export type { ThemeName } from './ThemeStore.svelte';
|
|
10
9
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/s0-state/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAC1C,YAAY,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACtE,YAAY,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAGhD,OAAO,EACL,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EACf,mBAAmB,EACnB,KAAK,iBAAiB,EACtB,KAAK,WAAW,EAChB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,cAAc,GACpB,MAAM,WAAW,CAAC;AAGnB,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,YAAY,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAG7E,YAAY,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/s0-state/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAC1C,YAAY,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACtE,YAAY,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAGhD,OAAO,EACL,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EACf,mBAAmB,EACnB,KAAK,iBAAiB,EACtB,KAAK,WAAW,EAChB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,cAAc,GACpB,MAAM,WAAW,CAAC;AAGnB,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,YAAY,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAG7E,YAAY,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC"}
|
package/dist/s0-state/index.js
CHANGED
|
@@ -5,3 +5,4 @@ export { createDerived } from './derived';
|
|
|
5
5
|
export { createVirtualList, createVirtualGrid, createPreloader, calculateGridLayout, } from './virtual';
|
|
6
6
|
// New from NNJAS port - Sync status component
|
|
7
7
|
export { default as SyncStatus } from './SyncStatus.svelte';
|
|
8
|
+
// Theme management — subpath only (module-scope singleton)
|
|
@@ -23,20 +23,45 @@
|
|
|
23
23
|
* const activeModal = modalStackStore.active;
|
|
24
24
|
* const stackDepth = modalStackStore.depth;
|
|
25
25
|
*/
|
|
26
|
+
/**
|
|
27
|
+
* ModalStackStore — Module-scope singleton for modal stacking (F-29).
|
|
28
|
+
*
|
|
29
|
+
* Instantiated once at module scope. Holds the visible-modal stack and
|
|
30
|
+
* the logical modal stack. Consumers register/unregister modals at
|
|
31
|
+
* mount/unmount time via the Modal component.
|
|
32
|
+
*
|
|
33
|
+
* @module s0-state/modal-stack-store
|
|
34
|
+
* @example
|
|
35
|
+
* ```ts
|
|
36
|
+
* import { modalStackStore } from '@kos/design-system/s0-state';
|
|
37
|
+
* console.log(modalStackStore.depth);
|
|
38
|
+
* ```
|
|
39
|
+
*/
|
|
26
40
|
export interface ModalData {
|
|
27
41
|
id: string;
|
|
28
42
|
props?: Record<string, unknown>;
|
|
29
43
|
onClose?: () => void;
|
|
30
44
|
}
|
|
45
|
+
export interface VisibleModal {
|
|
46
|
+
id: string;
|
|
47
|
+
zIndex: number;
|
|
48
|
+
onClose: () => void;
|
|
49
|
+
}
|
|
31
50
|
declare class ModalStackStore {
|
|
32
51
|
private stack;
|
|
52
|
+
private visibleModals;
|
|
33
53
|
get active(): ModalData | null;
|
|
34
54
|
get depth(): number;
|
|
35
55
|
get all(): readonly ModalData[];
|
|
56
|
+
get topmost(): VisibleModal | null;
|
|
57
|
+
get visibleIds(): readonly string[];
|
|
36
58
|
push(modal: ModalData): void;
|
|
37
59
|
pop(): void;
|
|
38
60
|
closeAll(): void;
|
|
39
61
|
removeById(id: string): void;
|
|
62
|
+
register(modal: VisibleModal): () => void;
|
|
63
|
+
unregister(id: string): void;
|
|
64
|
+
isTopmost(id: string): boolean;
|
|
40
65
|
}
|
|
41
66
|
export declare const modalStackStore: ModalStackStore;
|
|
42
67
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"modal-stack-store.svelte.d.ts","sourceRoot":"","sources":["../../src/s0-state/modal-stack-store.svelte.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,cAAM,eAAe;IACnB,OAAO,CAAC,KAAK,CAA2B;
|
|
1
|
+
{"version":3,"file":"modal-stack-store.svelte.d.ts","sourceRoot":"","sources":["../../src/s0-state/modal-stack-store.svelte.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH;;;;;;;;;;;;;GAaG;AAEH,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,cAAM,eAAe;IACnB,OAAO,CAAC,KAAK,CAA2B;IACxC,OAAO,CAAC,aAAa,CAA8B;IAEnD,IAAI,MAAM,IAAI,SAAS,GAAG,IAAI,CAG7B;IAED,IAAI,KAAK,IAAI,MAAM,CAElB;IAED,IAAI,GAAG,IAAI,SAAS,SAAS,EAAE,CAE9B;IAED,IAAI,OAAO,IAAI,YAAY,GAAG,IAAI,CAGjC;IAED,IAAI,UAAU,IAAI,SAAS,MAAM,EAAE,CAElC;IAED,IAAI,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI;IAI5B,GAAG,IAAI,IAAI;IAOX,QAAQ,IAAI,IAAI;IAMhB,UAAU,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI;IAQ5B,QAAQ,CAAC,KAAK,EAAE,YAAY,GAAG,MAAM,IAAI;IAKzC,UAAU,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI;IAI5B,SAAS,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO;CAG/B;AAED,eAAO,MAAM,eAAe,iBAAwB,CAAC"}
|
|
@@ -25,6 +25,7 @@
|
|
|
25
25
|
*/
|
|
26
26
|
class ModalStackStore {
|
|
27
27
|
stack = $state([]);
|
|
28
|
+
visibleModals = $state([]);
|
|
28
29
|
get active() {
|
|
29
30
|
if (this.stack.length === 0)
|
|
30
31
|
return null;
|
|
@@ -36,6 +37,14 @@ class ModalStackStore {
|
|
|
36
37
|
get all() {
|
|
37
38
|
return this.stack;
|
|
38
39
|
}
|
|
40
|
+
get topmost() {
|
|
41
|
+
if (this.visibleModals.length === 0)
|
|
42
|
+
return null;
|
|
43
|
+
return this.visibleModals[this.visibleModals.length - 1];
|
|
44
|
+
}
|
|
45
|
+
get visibleIds() {
|
|
46
|
+
return this.visibleModals.map((modal) => modal.id);
|
|
47
|
+
}
|
|
39
48
|
push(modal) {
|
|
40
49
|
this.stack = [...this.stack, modal];
|
|
41
50
|
}
|
|
@@ -59,5 +68,15 @@ class ModalStackStore {
|
|
|
59
68
|
this.stack = this.stack.filter(m => m.id !== id);
|
|
60
69
|
removing.onClose?.();
|
|
61
70
|
}
|
|
71
|
+
register(modal) {
|
|
72
|
+
this.visibleModals = [...this.visibleModals, modal];
|
|
73
|
+
return () => this.unregister(modal.id);
|
|
74
|
+
}
|
|
75
|
+
unregister(id) {
|
|
76
|
+
this.visibleModals = this.visibleModals.filter((modal) => modal.id !== id);
|
|
77
|
+
}
|
|
78
|
+
isTopmost(id) {
|
|
79
|
+
return this.topmost?.id === id;
|
|
80
|
+
}
|
|
62
81
|
}
|
|
63
82
|
export const modalStackStore = new ModalStackStore();
|