Add runtime skin contract and docs

2026-03-20 11:22:03 +08:00
parent 5c9eb84c63
commit 246851a68e
9 changed files with 1053 additions and 1 deletions
@@ -0,0 +1,41 @@
+export const skinNames = ["minimal", "glass", "pixel"] as const;
+export type SkinName = (typeof skinNames)[number];
+
+export const defaultSkin: SkinName = "minimal";
+
+export const skinDetails = {
+  minimal: {
+    label: "Minimal",
+    note: "Restrained surfaces and low-ornament defaults"
+  },
+  glass: {
+    label: "Glass",
+    note: "Translucent layers, brighter edges, and blurred panels"
+  },
+  pixel: {
+    label: "Pixel",
+    note: "Hard edges, crisp borders, and stepped shadows"
+  }
+} as const satisfies Record<SkinName, { label: string; note: string }>;
+
+function getTargetElement(root?: HTMLElement) {
+  if (root) {
+    return root;
+  }
+
+  if (typeof document === "undefined") {
+    return undefined;
+  }
+
+  return document.documentElement;
+}
+
+export function setSkin(skin: SkinName, root?: HTMLElement) {
+  const target = getTargetElement(root);
+
+  if (!target) {
+    return;
+  }
+
+  target.dataset.skin = skin;
+}