From 9f7213f4d247f85359c54492ca8b7d2ea49f52b0 Mon Sep 17 00:00:00 2001 From: relghali Date: Sat, 29 Aug 2026 07:05:09 +0300 Subject: [PATCH 1/4] Added devcontainer Configuration --- .devcontainer/devcontainer.json | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .devcontainer/devcontainer.json diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json new file mode 100644 index 00000000..b7ccacd2 --- /dev/null +++ b/.devcontainer/devcontainer.json @@ -0,0 +1,5 @@ +{ + "name": "Build Checkpoint", + "image": "oven/bun:1.3", + "postCreateCommand": "apt-get update && apt-get install -y python3 make g++" +} \ No newline at end of file From b351a9b603c69317819e0a5093b73c0d9fc09d9c Mon Sep 17 00:00:00 2001 From: relghali Date: Fri, 4 Sep 2026 16:49:58 +0000 Subject: [PATCH 2/4] Remove duplicated light/dark token tables in v2 mapping --- packages/ui/src/theme/v2/mapping.ts | 247 ++++++++++++---------------- 1 file changed, 103 insertions(+), 144 deletions(-) diff --git a/packages/ui/src/theme/v2/mapping.ts b/packages/ui/src/theme/v2/mapping.ts index e019fa46..631d0252 100644 --- a/packages/ui/src/theme/v2/mapping.ts +++ b/packages/ui/src/theme/v2/mapping.ts @@ -3,162 +3,121 @@ import { V2_AVATAR_DARK, V2_AVATAR_LIGHT } from "./avatar" const ref = (name: string): V2ColorValue => `var(--${name})` -const lightAgentTokens: Record = { - "v2-agent-plan-solid": ref("v2-pink-800"), - "v2-agent-plan-border": "rgba(200, 61, 139, 0.20)", - "v2-agent-plan-background": "rgba(253, 236, 243, 0.10)", - "v2-agent-build-solid": ref("v2-blue-800"), - "v2-agent-build-border": "rgba(44, 71, 200, 0.20)", - "v2-agent-build-background": "rgba(236, 241, 254, 0.10)", - "v2-agent-explore-solid": ref("v2-yellow-900"), - "v2-agent-explore-border": "rgba(203, 159, 52, 0.20)", - "v2-agent-explore-background": "rgba(254, 250, 236, 0.1)", - "v2-agent-review-solid": ref("v2-green-800"), - "v2-agent-writer-solid": ref("v2-purple-700"), -} +/** A token's value in the light theme paired with its value in the dark theme. */ +type V2Pair = readonly [light: V2ColorValue, dark: V2ColorValue] -const darkAgentTokens: Record = { - "v2-agent-plan-solid": ref("v2-pink-400"), - "v2-agent-plan-border": "rgba(247, 153, 198, 0.20)", - "v2-agent-plan-background": "rgba(170, 53, 118, 0.05)", - "v2-agent-build-solid": ref("v2-blue-300"), - "v2-agent-build-border": "rgba(162, 188, 255, 0.20)", - "v2-agent-build-background": "rgba(38, 63, 169, 0.05)", - "v2-agent-explore-solid": ref("v2-yellow-300"), - "v2-agent-explore-border": "rgba(243, 218, 155, 0.20)", - "v2-agent-explore-background": "rgba(172, 136, 51, 0.05)", - "v2-agent-review-solid": ref("v2-green-300"), - "v2-agent-writer-solid": ref("v2-purple-400"), -} +const pick = (table: Record, index: 0 | 1): Record => + Object.fromEntries(Object.entries(table).map(([token, pair]) => [token, pair[index]])) -const light: Record = { - "v2-background-bg-base": ref("v2-grey-100"), - "v2-background-bg-deep": ref("v2-grey-200"), - "v2-background-bg-layer-01": ref("v2-grey-300"), - "v2-background-bg-layer-02": ref("v2-grey-400"), - "v2-background-bg-layer-03": ref("v2-grey-500"), - "v2-background-bg-layer-04": ref("v2-grey-600"), - "v2-background-bg-inverse": ref("v2-grey-1000"), - "v2-background-bg-contrast": ref("v2-grey-900"), - "v2-background-bg-button-neutral": ref("v2-grey-100"), - "v2-background-bg-accent": ref("v2-blue-600"), - "v2-text-text-inverse": ref("v2-grey-100"), - "v2-text-text-contrast": ref("v2-grey-100"), - "v2-text-text-accent": ref("v2-blue-600"), - "v2-text-text-accent-hover": ref("v2-blue-700"), - "v2-text-text-code-accent": ref("v2-blue-900"), - "v2-border-border-muted": ref("v2-alpha-dark-8"), - "v2-border-border-base": ref("v2-alpha-dark-10"), - "v2-border-border-strong": ref("v2-alpha-dark-20"), - "v2-border-border-inverse": ref("v2-grey-1000"), - "v2-border-border-focus": ref("v2-blue-500"), - "v2-overlay-simple-overlay-hover": ref("v2-alpha-dark-4"), - "v2-overlay-simple-overlay-pressed": ref("v2-alpha-dark-8"), - "v2-overlay-simple-overlay-contrast-hover": ref("v2-alpha-light-12"), - "v2-overlay-simple-overlay-contrast-pressed": ref("v2-alpha-light-24"), - "v2-overlay-simple-overlay-scrim": ref("v2-alpha-dark-40"), - "v2-overlay-gradient-depth-overlay-depth-top": ref("v2-alpha-light-100"), - "v2-overlay-gradient-depth-overlay-depth-bot": ref("v2-alpha-light-0"), - "v2-overlay-simple-tab-active-scrim": "#fafafa00", - "v2-overlay-simple-tab-hover-scrim": "#eeeeee00", - "v2-overlay-simple-tab-scrim": "#fafafa00", - "v2-state-bg-success": ref("v2-green-100"), - "v2-state-fg-success": ref("v2-green-800"), - "v2-state-border-success": ref("v2-green-300"), - "v2-state-bg-warning": ref("v2-yellow-100"), - "v2-state-fg-warning": ref("v2-yellow-800"), - "v2-state-border-warning": ref("v2-yellow-300"), - "v2-state-bg-danger": ref("v2-red-100"), - "v2-state-fg-danger": ref("v2-red-800"), - "v2-state-border-danger": ref("v2-red-300"), - "v2-state-bg-info": ref("v2-blue-100"), - "v2-state-fg-info": ref("v2-blue-800"), - "v2-state-border-info": ref("v2-blue-300"), - ...lightAgentTokens, - ...V2_AVATAR_LIGHT, - "v2-elevation-raised": +const coreTokens = { + "v2-background-bg-base": [ref("v2-grey-100"), ref("v2-grey-1000")], + "v2-background-bg-deep": [ref("v2-grey-200"), ref("v2-grey-1100")], + "v2-background-bg-layer-01": [ref("v2-grey-300"), ref("v2-grey-800")], + "v2-background-bg-layer-02": [ref("v2-grey-400"), ref("v2-grey-600")], + "v2-background-bg-layer-03": [ref("v2-grey-500"), ref("v2-grey-500")], + "v2-background-bg-layer-04": [ref("v2-grey-600"), ref("v2-grey-400")], + "v2-background-bg-inverse": [ref("v2-grey-1000"), ref("v2-grey-100")], + "v2-background-bg-contrast": [ref("v2-grey-900"), ref("v2-grey-700")], + "v2-background-bg-button-neutral": [ref("v2-grey-100"), ref("v2-alpha-light-6")], + "v2-background-bg-accent": [ref("v2-blue-600"), ref("v2-blue-600")], + "v2-text-text-inverse": [ref("v2-grey-100"), ref("v2-grey-1000")], + "v2-text-text-contrast": [ref("v2-grey-100"), ref("v2-grey-100")], + "v2-text-text-accent": [ref("v2-blue-600"), ref("v2-blue-400")], + "v2-text-text-accent-hover": [ref("v2-blue-700"), ref("v2-blue-300")], + "v2-text-text-code-accent": [ref("v2-blue-900"), ref("v2-blue-400")], + "v2-border-border-muted": [ref("v2-alpha-dark-8"), ref("v2-alpha-light-8")], + "v2-border-border-base": [ref("v2-alpha-dark-10"), ref("v2-alpha-light-10")], + "v2-border-border-strong": [ref("v2-alpha-dark-20"), ref("v2-alpha-light-20")], + "v2-border-border-inverse": [ref("v2-grey-1000"), ref("v2-grey-100")], + "v2-border-border-focus": [ref("v2-blue-500"), ref("v2-blue-500")], + "v2-overlay-simple-overlay-hover": [ref("v2-alpha-dark-4"), ref("v2-alpha-light-6")], + "v2-overlay-simple-overlay-pressed": [ref("v2-alpha-dark-8"), ref("v2-alpha-light-10")], + "v2-overlay-simple-overlay-contrast-hover": [ref("v2-alpha-light-12"), ref("v2-alpha-dark-24")], + "v2-overlay-simple-overlay-contrast-pressed": [ref("v2-alpha-light-24"), ref("v2-alpha-dark-40")], + "v2-overlay-simple-overlay-scrim": [ref("v2-alpha-dark-40"), ref("v2-alpha-dark-60")], + "v2-overlay-gradient-depth-overlay-depth-top": [ref("v2-alpha-light-100"), ref("v2-alpha-light-100")], + "v2-overlay-gradient-depth-overlay-depth-bot": [ref("v2-alpha-light-0"), ref("v2-alpha-light-0")], + "v2-overlay-simple-tab-active-scrim": ["#fafafa00", "#24242400"], + "v2-overlay-simple-tab-hover-scrim": ["#eeeeee00", "#3a3a3a00"], + "v2-overlay-simple-tab-scrim": ["#fafafa00", "#08080800"], + "v2-state-bg-success": [ref("v2-green-100"), ref("v2-green-1200")], + "v2-state-fg-success": [ref("v2-green-800"), ref("v2-green-500")], + "v2-state-border-success": [ref("v2-green-300"), ref("v2-green-900")], + "v2-state-bg-warning": [ref("v2-yellow-100"), ref("v2-yellow-1200")], + "v2-state-fg-warning": [ref("v2-yellow-800"), ref("v2-yellow-500")], + "v2-state-border-warning": [ref("v2-yellow-300"), ref("v2-yellow-900")], + "v2-state-bg-danger": [ref("v2-red-100"), ref("v2-red-1200")], + "v2-state-fg-danger": [ref("v2-red-800"), ref("v2-red-500")], + "v2-state-border-danger": [ref("v2-red-300"), ref("v2-red-900")], + "v2-state-bg-info": [ref("v2-blue-100"), ref("v2-blue-1200")], + "v2-state-fg-info": [ref("v2-blue-800"), ref("v2-blue-500")], + "v2-state-border-info": [ref("v2-blue-300"), ref("v2-blue-900")], +} satisfies Record + +const agentTokens = { + "v2-agent-plan-solid": [ref("v2-pink-800"), ref("v2-pink-400")], + "v2-agent-plan-border": ["rgba(200, 61, 139, 0.20)", "rgba(247, 153, 198, 0.20)"], + "v2-agent-plan-background": ["rgba(253, 236, 243, 0.10)", "rgba(170, 53, 118, 0.05)"], + "v2-agent-build-solid": [ref("v2-blue-800"), ref("v2-blue-300")], + "v2-agent-build-border": ["rgba(44, 71, 200, 0.20)", "rgba(162, 188, 255, 0.20)"], + "v2-agent-build-background": ["rgba(236, 241, 254, 0.10)", "rgba(38, 63, 169, 0.05)"], + "v2-agent-explore-solid": [ref("v2-yellow-900"), ref("v2-yellow-300")], + "v2-agent-explore-border": ["rgba(203, 159, 52, 0.20)", "rgba(243, 218, 155, 0.20)"], + "v2-agent-explore-background": ["rgba(254, 250, 236, 0.1)", "rgba(172, 136, 51, 0.05)"], + "v2-agent-review-solid": [ref("v2-green-800"), ref("v2-green-300")], + "v2-agent-writer-solid": [ref("v2-purple-700"), ref("v2-purple-400")], +} satisfies Record + +const elevationTokens = { + "v2-elevation-raised": [ "0px 2px 4px 0px var(--v2-alpha-dark-4), 0px 1px 2px -1px var(--v2-alpha-dark-8), 0px 0px 0px 0.5px var(--v2-alpha-dark-12), 0px 0px 0px 0px var(--v2-alpha-dark-0)", - "v2-elevation-floating": + "0px 2px 4px 0px var(--v2-alpha-dark-30), 0px 1px 2px 0px var(--v2-alpha-dark-30), 0px 0px 0px 0.5px var(--v2-alpha-light-16), 0px -0.5px 0px 0px var(--v2-alpha-light-6)", + ], + "v2-elevation-floating": [ "0px 8px 16px 0px var(--v2-alpha-dark-4), 0px 4px 8px 0px var(--v2-alpha-dark-8), 0px 0px 0px 0.5px var(--v2-alpha-dark-12), 0px 0px 0px 0px var(--v2-alpha-dark-0)", - "v2-elevation-overlay": + "0px 8px 16px 0px var(--v2-alpha-dark-30), 0px 4px 8px 0px var(--v2-alpha-dark-30), 0px 0px 0px 0.5px var(--v2-alpha-light-16), 0px -0.5px 0px 0px var(--v2-alpha-light-6)", + ], + "v2-elevation-overlay": [ "0px 16px 32px 0px var(--v2-alpha-dark-4), 0px 8px 16px 0px var(--v2-alpha-dark-8), 0px 0px 0px 0.5px var(--v2-alpha-dark-12), 0px 0px 0px 0px var(--v2-alpha-dark-0)", - "v2-elevation-button-neutral": + "0px 16px 32px 0px var(--v2-alpha-dark-30), 0px 8px 16px 0px var(--v2-alpha-dark-30), 0px 0px 0px 0.5px var(--v2-alpha-light-16), 0px -0.5px 0px 0px var(--v2-alpha-light-6)", + ], + "v2-elevation-button-neutral": [ "0px 1px 1.5px 0px var(--v2-alpha-dark-10), 0px 0px 0px 0.5px var(--v2-alpha-dark-14), 0px 0px 0px 0px var(--v2-alpha-dark-0)", - "v2-elevation-button-contrast": + "0px 1px 2px 0px var(--v2-alpha-dark-40), 0px 0px 0px 0.5px var(--v2-alpha-light-20), 0px -0.5px 0px 0px var(--v2-alpha-light-10)", + ], + "v2-elevation-button-contrast": [ "0px 1px 1.5px 0px var(--v2-alpha-dark-20), 0px 0px 0px 0.5px var(--v2-grey-800), inset 0px 1px 2px 0px var(--v2-alpha-light-14), inset 0px -1px 2px 0px var(--v2-alpha-dark-6), 0px 0px 0px 0px var(--v2-alpha-dark-0)", - "v2-elevation-elements": "0px 0.5px 0.5px 0px var(--v2-alpha-dark-40)", - "v2-elevation-switch-off": + "0px 1px 2px 0px var(--v2-alpha-dark-40), 0px 0px 0px 0.5px var(--v2-alpha-light-40), inset 0px 0px 0px 0px var(--v2-alpha-light-0), inset 0px 0px 0px 0px var(--v2-alpha-light-0), 0px -0.5px 0px 0px var(--v2-alpha-light-30)", + ], + "v2-elevation-elements": [ + "0px 0.5px 0.5px 0px var(--v2-alpha-dark-40)", + "0px 0.5px 0.5px 0px var(--v2-alpha-dark-40)", + ], + "v2-elevation-switch-off": [ "inset 0px 1px 1px 0px var(--v2-alpha-dark-8), inset 0px 0.5px 0.5px 0px var(--v2-alpha-dark-8), inset 0px 0px 0px 0.5px var(--v2-alpha-dark-10)", - "v2-elevation-switch-on": + "inset 0px -0.5px 0px 0px var(--v2-alpha-light-10), inset 0px 0px 0px 0px var(--v2-alpha-light-0), inset 0px 0px 0px 0.5px var(--v2-alpha-light-16)", + ], + "v2-elevation-switch-on": [ "inset 0px 2px 2px 0px var(--v2-alpha-dark-10), inset 0px 1px 1px 0px var(--v2-alpha-dark-10), inset 0px 0px 0px 0.5px var(--v2-alpha-dark-20)", - "v2-illustration-illustration-layer-01": ref("v2-grey-300"), - "v2-illustration-illustration-layer-02": ref("v2-grey-400"), - "v2-illustration-illustration-layer-03": ref("v2-grey-500"), + "inset 0px -0.5px 0px 0px var(--v2-alpha-light-10), inset 0px 0px 0px 0px var(--v2-alpha-light-0), inset 0px 0px 0px 0.5px var(--v2-alpha-light-16)", + ], + "v2-illustration-illustration-layer-01": [ref("v2-grey-300"), ref("v2-grey-900")], + "v2-illustration-illustration-layer-02": [ref("v2-grey-400"), ref("v2-grey-800")], + "v2-illustration-illustration-layer-03": [ref("v2-grey-500"), ref("v2-grey-700")], +} satisfies Record + +const light: Record = { + ...pick(coreTokens, 0), + ...pick(agentTokens, 0), + ...V2_AVATAR_LIGHT, + ...pick(elevationTokens, 0), } const dark: Record = { - "v2-background-bg-base": ref("v2-grey-1000"), - "v2-background-bg-deep": ref("v2-grey-1100"), - "v2-background-bg-layer-01": ref("v2-grey-800"), - "v2-background-bg-layer-02": ref("v2-grey-600"), - "v2-background-bg-layer-03": ref("v2-grey-500"), - "v2-background-bg-layer-04": ref("v2-grey-400"), - "v2-background-bg-inverse": ref("v2-grey-100"), - "v2-background-bg-contrast": ref("v2-grey-700"), - "v2-background-bg-button-neutral": ref("v2-alpha-light-6"), - "v2-background-bg-accent": ref("v2-blue-600"), - "v2-text-text-inverse": ref("v2-grey-1000"), - "v2-text-text-contrast": ref("v2-grey-100"), - "v2-text-text-accent": ref("v2-blue-400"), - "v2-text-text-accent-hover": ref("v2-blue-300"), - "v2-text-text-code-accent": ref("v2-blue-400"), - "v2-border-border-muted": ref("v2-alpha-light-8"), - "v2-border-border-base": ref("v2-alpha-light-10"), - "v2-border-border-strong": ref("v2-alpha-light-20"), - "v2-border-border-inverse": ref("v2-grey-100"), - "v2-border-border-focus": ref("v2-blue-500"), - "v2-overlay-simple-overlay-hover": ref("v2-alpha-light-6"), - "v2-overlay-simple-overlay-pressed": ref("v2-alpha-light-10"), - "v2-overlay-simple-overlay-contrast-hover": ref("v2-alpha-dark-24"), - "v2-overlay-simple-overlay-contrast-pressed": ref("v2-alpha-dark-40"), - "v2-overlay-simple-overlay-scrim": ref("v2-alpha-dark-60"), - "v2-overlay-gradient-depth-overlay-depth-top": ref("v2-alpha-light-100"), - "v2-overlay-gradient-depth-overlay-depth-bot": ref("v2-alpha-light-0"), - "v2-overlay-simple-tab-active-scrim": "#24242400", - "v2-overlay-simple-tab-hover-scrim": "#3a3a3a00", - "v2-overlay-simple-tab-scrim": "#08080800", - "v2-state-bg-success": ref("v2-green-1200"), - "v2-state-fg-success": ref("v2-green-500"), - "v2-state-border-success": ref("v2-green-900"), - "v2-state-bg-warning": ref("v2-yellow-1200"), - "v2-state-fg-warning": ref("v2-yellow-500"), - "v2-state-border-warning": ref("v2-yellow-900"), - "v2-state-bg-danger": ref("v2-red-1200"), - "v2-state-fg-danger": ref("v2-red-500"), - "v2-state-border-danger": ref("v2-red-900"), - "v2-state-bg-info": ref("v2-blue-1200"), - "v2-state-fg-info": ref("v2-blue-500"), - "v2-state-border-info": ref("v2-blue-900"), - ...darkAgentTokens, + ...pick(coreTokens, 1), + ...pick(agentTokens, 1), ...V2_AVATAR_DARK, - "v2-elevation-raised": - "0px 2px 4px 0px var(--v2-alpha-dark-30), 0px 1px 2px 0px var(--v2-alpha-dark-30), 0px 0px 0px 0.5px var(--v2-alpha-light-16), 0px -0.5px 0px 0px var(--v2-alpha-light-6)", - "v2-elevation-floating": - "0px 8px 16px 0px var(--v2-alpha-dark-30), 0px 4px 8px 0px var(--v2-alpha-dark-30), 0px 0px 0px 0.5px var(--v2-alpha-light-16), 0px -0.5px 0px 0px var(--v2-alpha-light-6)", - "v2-elevation-overlay": - "0px 16px 32px 0px var(--v2-alpha-dark-30), 0px 8px 16px 0px var(--v2-alpha-dark-30), 0px 0px 0px 0.5px var(--v2-alpha-light-16), 0px -0.5px 0px 0px var(--v2-alpha-light-6)", - "v2-elevation-button-neutral": - "0px 1px 2px 0px var(--v2-alpha-dark-40), 0px 0px 0px 0.5px var(--v2-alpha-light-20), 0px -0.5px 0px 0px var(--v2-alpha-light-10)", - "v2-elevation-button-contrast": - "0px 1px 2px 0px var(--v2-alpha-dark-40), 0px 0px 0px 0.5px var(--v2-alpha-light-40), inset 0px 0px 0px 0px var(--v2-alpha-light-0), inset 0px 0px 0px 0px var(--v2-alpha-light-0), 0px -0.5px 0px 0px var(--v2-alpha-light-30)", - "v2-elevation-elements": "0px 0.5px 0.5px 0px var(--v2-alpha-dark-40)", - "v2-elevation-switch-off": - "inset 0px -0.5px 0px 0px var(--v2-alpha-light-10), inset 0px 0px 0px 0px var(--v2-alpha-light-0), inset 0px 0px 0px 0.5px var(--v2-alpha-light-16)", - "v2-elevation-switch-on": - "inset 0px -0.5px 0px 0px var(--v2-alpha-light-10), inset 0px 0px 0px 0px var(--v2-alpha-light-0), inset 0px 0px 0px 0.5px var(--v2-alpha-light-16)", - "v2-illustration-illustration-layer-01": ref("v2-grey-900"), - "v2-illustration-illustration-layer-02": ref("v2-grey-800"), - "v2-illustration-illustration-layer-03": ref("v2-grey-700"), + ...pick(elevationTokens, 1), } export function mapV2Semantics(isDark: boolean): Record { @@ -167,4 +126,4 @@ export function mapV2Semantics(isDark: boolean): Record { export function mergeV2Tokens(...layers: Record[]): Record { return Object.assign({}, ...layers) -} +} \ No newline at end of file From a39dcdd2a2065ba827d322e12ef998acf66c57b4 Mon Sep 17 00:00:00 2001 From: relghali Date: Fri, 4 Sep 2026 16:50:43 +0000 Subject: [PATCH 3/4] Add tests covering v2 semantic token resolution --- packages/ui/src/theme/v2/mapping.test.ts | 67 ++++++++++++++++++++++++ 1 file changed, 67 insertions(+) create mode 100644 packages/ui/src/theme/v2/mapping.test.ts diff --git a/packages/ui/src/theme/v2/mapping.test.ts b/packages/ui/src/theme/v2/mapping.test.ts new file mode 100644 index 00000000..e0dd8920 --- /dev/null +++ b/packages/ui/src/theme/v2/mapping.test.ts @@ -0,0 +1,67 @@ +import { describe, expect, test } from "bun:test" +import { mapV2Semantics, mergeV2Tokens } from "./mapping" + +const light = mapV2Semantics(false) +const dark = mapV2Semantics(true) + +describe("mapV2Semantics", () => { + test("selects the light map when isDark is false", () => { + expect(light["v2-background-bg-base"]).toBe("var(--v2-grey-100)") + }) + + test("selects the dark map when isDark is true", () => { + expect(dark["v2-background-bg-base"]).toBe("var(--v2-grey-1000)") + }) + + test("light and dark define exactly the same tokens", () => { + expect(Object.keys(light).sort()).toEqual(Object.keys(dark).sort()) + }) + + test("resolves paired values independently per theme", () => { + // Tokens whose two halves differ: guards against one theme + // being derived from the other's column. + expect(light["v2-text-text-accent"]).toBe("var(--v2-blue-600)") + expect(dark["v2-text-text-accent"]).toBe("var(--v2-blue-400)") + expect(light["v2-border-border-muted"]).toBe("var(--v2-alpha-dark-8)") + expect(dark["v2-border-border-muted"]).toBe("var(--v2-alpha-light-8)") + }) + + test("preserves tokens that are intentionally identical across themes", () => { + expect(light["v2-background-bg-layer-03"]).toBe(dark["v2-background-bg-layer-03"]) + expect(light["v2-elevation-elements"]).toBe(dark["v2-elevation-elements"]) + }) + + test("includes literal (non-var) values verbatim", () => { + expect(light["v2-overlay-simple-tab-scrim"]).toBe("#fafafa00") + expect(dark["v2-overlay-simple-tab-scrim"]).toBe("#08080800") + expect(light["v2-agent-plan-border"]).toBe("rgba(200, 61, 139, 0.20)") + }) + + test("merges agent and avatar token layers into both themes", () => { + expect(light["v2-agent-writer-solid"]).toBe("var(--v2-purple-700)") + expect(dark["v2-agent-writer-solid"]).toBe("var(--v2-purple-400)") + expect(light["v2-avatar-bg-orange"]).toBe("#ee7330ff") + expect(dark["v2-avatar-bg-orange"]).toBe("#723d22ff") + }) + + test("preserves long composite shadow values", () => { + expect(light["v2-elevation-raised"]).toBe( + "0px 2px 4px 0px var(--v2-alpha-dark-4), 0px 1px 2px -1px var(--v2-alpha-dark-8), 0px 0px 0px 0.5px var(--v2-alpha-dark-12), 0px 0px 0px 0px var(--v2-alpha-dark-0)", + ) + }) + + test("defines every token as a non-empty string", () => { + for (const [token, value] of Object.entries({ ...light, ...dark })) { + expect(typeof value, token).toBe("string") + expect(value.length, token).toBeGreaterThan(0) + } + }) +}) + +describe("mergeV2Tokens", () => { + test("applies later layers over earlier ones", () => { + const merged = mergeV2Tokens(light, { "v2-background-bg-base": "#000000ff" }) + expect(merged["v2-background-bg-base"]).toBe("#000000ff") + expect(merged["v2-text-text-accent"]).toBe(light["v2-text-text-accent"]) + }) +}) \ No newline at end of file From d0c5b50066344ea25e403a32be8a7e6483d1b6b9 Mon Sep 17 00:00:00 2001 From: relghali Date: Fri, 4 Sep 2026 18:13:24 +0000 Subject: [PATCH 4/4] Add curl, xz-utils, git, and gh to dev container --- .devcontainer/devcontainer.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json index b7ccacd2..e88eaf84 100644 --- a/.devcontainer/devcontainer.json +++ b/.devcontainer/devcontainer.json @@ -1,5 +1,5 @@ { "name": "Build Checkpoint", "image": "oven/bun:1.3", - "postCreateCommand": "apt-get update && apt-get install -y python3 make g++" + "postCreateCommand": "apt-get update && apt-get install -y python3 make g++ curl xz-utils ca-certificates git && curl -fsSL https://qlty.sh | bash" } \ No newline at end of file