@celestia-island/hikari 0.50.4 → 0.51.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@celestia-island/hikari",
-  "version": "0.50.4",
+  "version": "0.51.1",
   "private": false,
   "type": "module",
   "description": "Hikari Vue 3 component library — production-grade UI components based on shittim-chest design system",

package/src/styles/index.scss

@@ -21,6 +21,7 @@
 // import them granularly only for legacy compositions. The previous
 // version of this file re-exported packages/theme + packages/components
 // through paths that escape the npm package and did not compile.
+@use "./reset.scss";
 @use "./theme/channels.scss";
 @use "./theme/scale.scss";
 @use "./admin-tokens.scss";

package/src/styles/reset.scss

@@ -0,0 +1,60 @@
+/* ── Host reset (L2) ────────────────────────────────────────────────────
+ * The base normalization every hikari host needs and none of them should
+ * have to hand-roll. Component sheets self-declare their critical box
+ * geometry (`.hk-input-element`'s border-box, borders, appearance), but
+ * the wrappers and the native controls they contain still inherit the
+ * UA's default typography chain — measured 2026-09-14 in the flasher on
+ * hikari 0.49: without a host reset the sign-in fields render ~100px
+ * (min-height 2.5rem plus UA line-height/font inflation of the in-flow
+ * content), with one exactly ~40px. The chest webui historically rode
+ * UnoCSS with preflight planned around it; hosts without a utility
+ * layer had nothing. This sheet is that nothing: preflight-equivalent,
+ * token-aware, and part of the canonical composition (index.scss).
+ *
+ * Order: FIRST in the composition. It only ever lowers UA defaults;
+ * component sheets and host styles override it by specificity/order. */
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgb(var(--color-border, 120 120 120) / 40%);
+}
+
+html {
+  line-height: 1.5;
+}
+
+body {
+  margin: 0;
+  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans CJK SC', sans-serif);
+}
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  margin: 0;
+  padding: 0;
+  font: inherit;
+  line-height: inherit;
+  color: inherit;
+  background: none;
+}
+
+button,
+[type='button'],
+[type='reset'],
+[type='submit'] {
+  cursor: pointer;
+}
+
+img,
+svg,
+canvas {
+  display: block;
+  max-width: 100%;
+}

package/src/styles/resetSheet.test.ts

@@ -0,0 +1,43 @@
+import { readFileSync } from "node:fs";
+import { dirname, resolve } from "node:path";
+import { fileURLToPath } from "node:url";
+
+import { describe, expect, it } from "vitest";
+
+/**
+ * Host-reset composition guard.
+ *
+ * reset.scss is the base normalization every hikari host needs (measured
+ * 2026-09-14 in the flasher: without it the UA typography chain inflates
+ * the component wrappers — sign-in fields ~100px vs ~40px with it). Hosts
+ * that historically rode a utility-layer preflight (chest: UnoCSS, with
+ * preflight later disabled) no longer need a hand-rolled equivalent.
+ *
+ * The contract under test: the canonical composition (index.scss) loads
+ * the reset FIRST, and the reset actually normalizes the native control
+ * typography chain — the exact rules the flasher regression hinged on.
+ */
+
+const stylesDir = resolve(dirname(fileURLToPath(import.meta.url)));
+
+function read(path: string): string {
+  return readFileSync(resolve(stylesDir, path), "utf8").replace(/\r\n/g, "\n");
+}
+
+describe("host reset sheet", () => {
+  it("loads first in the canonical composition", () => {
+    const index = read("index.scss");
+    const first = index.match(/^@use "([^"]+)";/m)?.[1];
+    expect(first).toBe("./reset.scss");
+  });
+
+  it("normalizes the native control typography chain", () => {
+    const reset = read("reset.scss");
+    for (const selector of ["button,", "input,", "textarea"]) {
+      expect(reset).toContain(selector);
+    }
+    expect(reset).toContain("font: inherit");
+    expect(reset).toContain("line-height: inherit");
+    expect(reset).toContain("box-sizing: border-box");
+  });
+});