@adukiorg/anza 0.4.1 → 0.4.3

package/src/core/ui/define/element.js

@@ -2,7 +2,7 @@ import { BaseElement } from '../base.js';
 import { scheduleFrame, yieldTask } from '../schedule.js';
 import { router } from '../../router/index.js';
 import { specRegistry, internalsMap, initializedMap, pendingUpdatesMap, updateScheduledMap, assetCache } from './state.js';
-import { preloadResources } from './utils.js';
+import { preloadResources, createTemplateFragment } from './utils.js';
 import { createComponentContext } from './proxy.js';
 
 // Platform lifecycle method names that must never be overridden by spec.methods.
@@ -63,12 +63,62 @@ export function element(tag, spec, base) {
     ? new URL(spec.template, base).href
     : null;
 
-  // Initiate resource fetching exactly once per component registration (R-06)
+  // Defer resource preloading until first mount or HMR rebind for cold-start performance
+  const hasUrls = (styleUrls.length > 0) || (templateUrl !== null);
   let resolved = null;
-  let resourcesPromise = preloadResources(tag, styleUrls, templateUrl, spec.template, spec.style).then(res => {
-    resolved = res;
-    return res;
-  });
+  let resourcesPromise = null;
+
+  const getResources = () => {
+    if (!resourcesPromise) {
+      resourcesPromise = preloadResources(tag, styleUrls, templateUrl, spec.template, spec.style).then(res => {
+        resolved = res;
+        return res;
+      });
+    }
+    return resourcesPromise;
+  };
+
+  const isLazy = spec.lazy === true && hasUrls;
+
+  if (!isLazy) {
+    if (!hasUrls) {
+      // Compile synchronously immediately to support synchronous connectedCallback (unit tests and static components)
+      const supportsSheets =
+        typeof CSSStyleSheet !== 'undefined' &&
+        'adoptedStyleSheets' in Document.prototype &&
+        'adoptedStyleSheets' in ShadowRoot.prototype;
+
+      let templateNode = null;
+      let stylesheets = [];
+      let cssTextAcc = '';
+
+      if (spec.template) {
+        templateNode = createTemplateFragment(spec.template);
+      }
+      if (spec.style) {
+        const inlineStyles = Array.isArray(spec.style) ? spec.style : [spec.style];
+        for (const style of inlineStyles) {
+          if (supportsSheets) {
+            const sheet = new CSSStyleSheet();
+            sheet.replaceSync(style);
+            stylesheets.push(sheet);
+          } else {
+            cssTextAcc += style + '\n';
+          }
+        }
+      }
+      resolved = {
+        templateNode,
+        stylesheets,
+        cssText: cssTextAcc.trim() ? cssTextAcc : null,
+        tagsDescriptor: null
+      };
+      resourcesPromise = Promise.resolve(resolved);
+    } else {
+      // Start eager preloading immediately
+      getResources();
+    }
+  }
 
   // Handle hot reloading of constructable stylesheets (one global listener per unique styleUrl - R-05)
   if (styleUrls.length > 0 && typeof window !== 'undefined') {
@@ -175,7 +225,7 @@ export function element(tag, spec, base) {
       // Wait for resolved resources to compile (synchronously if already cached)
       let res = resolved;
       if (!res) {
-        res = await resourcesPromise;
+        res = await getResources();
       }
       const { templateNode, stylesheets, cssText, tagsDescriptor } = res;
 
@@ -269,7 +319,7 @@ export function element(tag, spec, base) {
       // 3. Clone new template
       let res = resolved;
       if (!res) {
-        res = await resourcesPromise;
+        res = await getResources();
       }
       const { templateNode, stylesheets, cssText, tagsDescriptor } = res;
 

package/src/core/ui/define/orchestrator.js

@@ -10,7 +10,7 @@ let dispose = null; // One-word module-level disposer variable (RT-11)
 export function initOrchestrator() {
   if (typeof window !== 'undefined') {
     dispose?.();
-    dispose = router.on('found', async ({ tag, params, query, hash, chain, direction }) => {
+    dispose = router.on('found', async ({ tag, params, query, hash, chain, via, container, direction }) => {
       // Resolve the top-level layout element in the chain
       const topTag = chain && chain.length > 0 ? chain[0].tag : tag;
       const topParams = chain && chain.length > 0 ? chain[0].params : params;
@@ -23,9 +23,9 @@ export function initOrchestrator() {
       const spec = specRegistry.get(topTag.toLowerCase());
       // Resolve the render target: the last container in the `via` chain, or
       // the legacy single `container`. Without either there is nothing to mount.
-      const target = (Array.isArray(spec?.via) && spec.via.length)
+      const target = container ?? ((Array.isArray(spec?.via) && spec.via.length)
         ? spec.via[spec.via.length - 1]
-        : spec?.container;
+        : spec?.container);
       if (!spec || !target) {
         console.warn('[Orchestrator] Early return: missing spec or target');
         return;
@@ -35,7 +35,11 @@ export function initOrchestrator() {
       // The interceptor's cascade has already ensured the chain is mounted.
       const containerEl = router.getContainer(target);
       if (!containerEl) {
-        console.warn(`Target container "${target}" not found in DOM for element <${topTag}>`);
+        console.warn(
+          `[Orchestrator] Container "${target}" is not mounted — cannot render <${topTag}>.\n` +
+          `Make sure dock('${target}', { parent: '...' }) is declared and imported before this page.\n` +
+          `Full via chain expected: ${JSON.stringify(spec?.via ?? [])}`
+        );
         return;
       }
 

package/src/core/ui/defs/dock.js

@@ -24,24 +24,34 @@ const CONTAIN = ':host { contain: layout; display: block; }';
  * @param {string} [config.tag] - tag name; defaults to `dock-<name>`.
  * @param {string} [config.parent='body'] - parent dock key in the graph.
  * @param {object} [config.template] - { html, css, shadow }.
+ * @param {string|object} [config.notfound] - fallback rendered when a 404
+ *   lands in this dock. Pass a raw HTML string or { html } object.
+ *   The deepest configured dock wins at runtime.
  * @param {string} [base] - import.meta.url of the caller (file templates).
  */
 export function dock(name, config = {}, base) {
   const tag = config.tag ?? `dock-${name}`;
   const parent = config.parent ?? 'main';
 
+  // Statically register the layout container in the graph with a null element
+  router.registerContainer(name, null, parent, tag);
+
   const spec = translate(config);
 
   // Default passthrough template — a dock is a shell around its slotted content.
   if (spec.template == null) spec.template = '<slot></slot>';
   // Prepend containment styling to whatever the dock declares.
-  spec.style = spec.style ? `${CONTAIN}\n${spec.style}` : CONTAIN;
+  if (spec.style != null) {
+    spec.style = Array.isArray(spec.style) ? [CONTAIN, ...spec.style] : [CONTAIN, spec.style];
+  } else {
+    spec.style = CONTAIN;
+  }
 
   // Register in the graph on connect, unregister on disconnect. Wrap any
   // user-supplied connect/disconnect rather than clobbering them.
   const userMount = spec.mount;
   spec.mount = (ctx) => {
-    router.registerContainer(name, ctx.el, parent);
+    router.registerContainer(name, ctx.el, parent, tag);
     return userMount?.(ctx);
   };
   const userUnmount = spec.unmount;
@@ -62,6 +72,13 @@ export function dock(name, config = {}, base) {
   if (Cls && !Cls.prototype.swapView) {
     Object.defineProperty(Cls.prototype, 'swapView', { value: swap, configurable: true });
   }
+
+  // Store user-supplied notfound template on the class as a static property.
+  // intercept.js reads Cls.notfound when rendering 404 fallbacks.
+  if (Cls && config.notfound != null) {
+    const nf = config.notfound;
+    Cls.notfound = typeof nf === 'string' ? nf : (nf?.html ?? null);
+  }
 }
 
 /**
@@ -104,26 +121,22 @@ async function swap(el, options = {}) {
     }
   }
 
+  // Only use element-scoped view transitions. If the browser doesn't support
+  // this.startViewTransition (Chrome < 147), fall back to a direct synchronous
+  // swap. Document-level startViewTransition() captures the entire page and
+  // causes the sidebar/header to flicker — we never want that.
   if (typeof this.startViewTransition === 'function') {
     try {
+      // Assign a named view-transition so CSS can target this element's
+      // group explicitly, keeping the root group stable.
+      this.style.viewTransitionName = 'dock-swap';
       this._tx = this.startViewTransition(go);
       await this._tx.finished;
     } catch (err) {
       if (err?.name !== 'AbortError') console.warn('[Native UI] dock scoped VT aborted:', err);
     } finally {
       this._tx = null;
-      restore();
-    }
-    return;
-  }
-
-  if (typeof document !== 'undefined' && typeof document.startViewTransition === 'function') {
-    try {
-      const vt = document.startViewTransition(go);
-      await vt.finished;
-    } catch (err) {
-      if (err?.name !== 'AbortError') console.warn('[Native UI] dock document VT aborted:', err);
-    } finally {
+      this.style.viewTransitionName = '';
       restore();
     }
     return;

package/src/core/ui/defs/page.js

@@ -1,10 +1,14 @@
 /**
  * src/core/ui/defs/page.js
  *
- * `page(route, config, base)` — a route-bound navigable unit. Maps a URL
- * pattern to a custom element, declares the ordered container chain (`via`) the
- * router traverses to reach the render target, and gates the boot sequence on
- * the element's definition so a hard refresh waits for it.
+ * `page(route, config, base)` — a route-bound navigable unit. Maps one or more
+ * URL patterns to a custom element, declares the ordered container chain (`via`)
+ * the router traverses to reach the render target, and gates the boot sequence
+ * on the element's definition so a hard refresh waits for it.
+ *
+ * Route may now be a single string or an array of strings:
+ *   page('/blog', config)
+ *   page(['/blog', '/blog/:slug'], config)
  *
  * Source: definations.md §3, tasks.md Phase 6
  */
@@ -12,17 +16,17 @@
 import { router } from '../../router/index.js';
 import { gate } from '../../router/boot.js';
 import { element } from '../define/element.js';
-import { specRegistry } from '../define/state.js';
 import { translate } from './spec.js';
 
 /**
- * @param {string} route - URL pattern, e.g. '/profile/:id'.
+ * @param {string | string[]} route - URL pattern(s), e.g. '/blog' or ['/blog', '/blog/:slug'].
  * @param {object} config - page definition.
  * @param {string} config.tag - custom element tag (must contain a hyphen).
  * @param {string[]} [config.via] - ordered container chain, root-to-leaf.
  * @param {string} [config.container] - single container (back-compat for via).
- * @param {object} [config.props] - reactive props.
- * @param {string[]} [config.query] - query params to map onto props.
+ * @param {object} [config.props] - generic reactive props.
+ * @param {Array<{name:string, type:Function}>} [config.params] - path param contract.
+ * @param {Array<{name:string, type:Function}>} [config.query] - query param contract.
  * @param {Function} [config.guard] - route-scoped navigation guard.
  * @param {object} [config.on] - lifecycle hooks (load, connect, disconnect, change).
  * @param {string} [base] - import.meta.url of the caller (file templates).
@@ -30,10 +34,14 @@ import { translate } from './spec.js';
 export function page(route, config, base) {
   const tag = config.tag;
   if (!tag) {
-    console.error(`[Native UI] page('${route}') is missing a 'tag'.`);
+    const routeStr = Array.isArray(route) ? route.join(', ') : route;
+    console.error(`[Native UI] page('${routeStr}') is missing a 'tag'.`);
     return;
   }
 
+  // Normalise the route into an array of patterns.
+  const routes = Array.isArray(route) ? route : [route];
+
   // Normalise the container chain. The render target is the last container.
   const via = Array.isArray(config.via) && config.via.length
     ? config.via
@@ -42,48 +50,86 @@ export function page(route, config, base) {
 
   const spec = translate(config, { visual: true });
   // Carry routing metadata on the spec so the orchestrator can resolve the
-  // render target and cast query params (specRegistry is populated by element()).
+  // render target and cast params/query (specRegistry is populated by element()).
   spec.via = via;
   spec.container = target;
-  if (config.query) spec.query = config.query;
+  spec.lazy = true;
+
+  // Store the typed params/query contract on the spec for use by intercept.js.
+  // Each entry: { name: string, cast: 'string' | 'number' }
+  if (Array.isArray(config.params)) {
+    spec.params = config.params.map(p => ({
+      name: p.name,
+      cast: p.type === Number ? 'number' : 'string',
+    }));
+  }
+  if (Array.isArray(config.query)) {
+    spec.query = config.query.map(q => ({
+      name: q.name,
+      cast: q.type === Number ? 'number' : 'string',
+    }));
+  }
 
   element(tag, spec, base);
 
-  // Register the route. Keep both `via` (full chain) and `container` (target)
-  // in meta so the interceptor cascade and orchestrator both work.
-  router.register(route, tag, {
-    ...config.meta,
-    via,
-    container: target
-  });
+  // Register all route patterns under the same tag.
+  // Keep both `via` (full chain) and `container` (target) in meta so the
+  // interceptor cascade and orchestrator both work.
+  for (const pattern of routes) {
+    router.register(pattern, tag, {
+      ...config.meta,
+      via,
+      container: target,
+    });
+  }
+
+  // Dev-time guard: verify every container in `via` has been registered in
+  // the graph by a dock() call. Deferred via queueMicrotask so that all
+  // synchronous dock() declarations in the same module bundle run first —
+  // this prevents false positives from import order within a single file.
+  if (typeof queueMicrotask !== 'undefined') {
+    queueMicrotask(() => {
+      for (const name of via) {
+        if (name !== 'main' && !router.hasContainer(name)) {
+          console.error(
+            `[Native UI] <${tag}> declares via:'${name}' but dock('${name}', ...) has not been called.\n` +
+            `Import the file containing dock('${name}', ...) before this page definition, or add dock('${name}', { parent: '...' }).`
+          );
+        }
+      }
+    });
+  }
 
   // Hold the initial match until this element is defined (hard-refresh safety).
   if (typeof customElements !== 'undefined') {
     gate(customElements.whenDefined(tag));
   }
 
-  // Route-scoped guard: only runs when the destination matches this route.
+  // Route-scoped guard: registers once and matches any of the declared patterns.
   if (typeof config.guard === 'function') {
-    registerGuard(route, config.guard);
+    registerGuard(routes, config.guard);
   }
 }
 
 /** Adds a global guard that delegates to `fn` only for matching destinations. */
-function registerGuard(route, fn) {
-  let pattern = null;
+function registerGuard(patterns, fn) {
   const Pattern = typeof URLPattern !== 'undefined' ? URLPattern : null;
-  if (Pattern) {
-    try {
-      pattern = route.startsWith('http') ? new Pattern(route) : new Pattern({ pathname: route });
-    } catch (_) { pattern = null; }
-  }
+  const compiled = Pattern
+    ? patterns.map(p => {
+        try {
+          return p.startsWith('http') ? new Pattern(p) : new Pattern({ pathname: p });
+        } catch (_) { return null; }
+      }).filter(Boolean)
+    : [];
 
   router.guard(async (destination, controller) => {
-    if (pattern) {
+    if (compiled.length > 0) {
       let url = destination?.url;
       try { url = new URL(url, globalThis.location?.href).href; } catch (_) {}
-      if (!pattern.test(url)) return null; // not this route — allow
+      const matches = compiled.some(pat => pat.test(url));
+      if (!matches) return null; // not this route — allow
     }
     return fn(destination, controller);
   });
 }
+

package/src/core/ui/defs/spec.js

@@ -24,9 +24,20 @@ const HOOKS = new Set(['load', 'connect', 'disconnect', 'change']);
 
 /**
  * Collects the route-derived params currently set on an element, keyed by the
- * declared prop names. Used to hand `on.load`/`on.connect` a `{ params }` bag.
+ * declared param names from the contract array.
+ * Used to hand `on.load`/`on.connect` a `{ params }` bag.
+ *
+ * @param {HTMLElement} el
+ * @param {Array<{name:string, cast:string}>} [paramDecls] - from spec.params
+ * @param {object} [props] - legacy props map fallback
  */
-function paramsOf(el, props) {
+function paramsOf(el, paramDecls, props) {
+  // New contract: ordered array with first/last getters.
+  if (Array.isArray(paramDecls) && paramDecls.length > 0) {
+    const arr = paramDecls.map(({ name }) => el[name] ?? null);
+    return makeAccessorArray(arr, paramDecls.map(d => d.name));
+  }
+  // Legacy fallback: collect from props keys.
   const out = {};
   if (props) {
     for (const key of Object.keys(props)) out[key] = el[key];
@@ -34,6 +45,44 @@ function paramsOf(el, props) {
   return out;
 }
 
+/**
+ * Collects the route-derived query values currently set on an element.
+ * Returns an ordered array with first/last getters.
+ *
+ * @param {HTMLElement} el
+ * @param {Array<{name:string, cast:string}>} [queryDecls]
+ */
+function queryOf(el, queryDecls) {
+  if (!Array.isArray(queryDecls) || queryDecls.length === 0) return [];
+  const arr = queryDecls.map(({ name }) => el[name] ?? null);
+  return makeAccessorArray(arr, queryDecls.map(d => d.name));
+}
+
+/**
+ * Wraps a plain array with non-enumerable `first` and `last` getters and a
+ * keyed named-accessor map so callers can use both positional and named access.
+ *
+ * @param {any[]} values
+ * @param {string[]} names
+ */
+function makeAccessorArray(values, names) {
+  const arr = [...values];
+  Object.defineProperties(arr, {
+    first: { get() { return arr[0] ?? null; }, enumerable: false },
+    last:  { get() { return arr[arr.length - 1] ?? null; }, enumerable: false },
+  });
+  // Named getters: arr.slug === arr[0] if slug was the first param
+  names.forEach((name, i) => {
+    if (!(name in arr)) {
+      Object.defineProperty(arr, name, {
+        get() { return arr[i] ?? null; },
+        enumerable: false,
+      });
+    }
+  });
+  return arr;
+}
+
 /**
  * Translates a declarative definition config into an `element()` spec.
  *
@@ -44,20 +93,37 @@ function paramsOf(el, props) {
  */
 export function translate(config, opts = {}) {
   const spec = {};
-  const tpl = config.template ?? {};
+  let html = null;
+  let css = null;
+  let shadow = 'open';
+
+  if (config.template != null) {
+    if (typeof config.template === 'object') {
+      html = config.template.html;
+      css = config.template.css;
+      shadow = config.template.shadow ?? 'open';
+    } else if (typeof config.template === 'string') {
+      html = config.template;
+    }
+  }
+
+  if (config.style != null) {
+    css = config.style;
+  }
 
-  // Template + style + shadow mode. `element()` takes html/css as separate
-  // string fields (inline source or a resolvable file path) and a shadow mode.
-  if (tpl.html != null) spec.template = tpl.html;
-  if (tpl.css != null) spec.style = tpl.css;
-  spec.mode = tpl.shadow === 'closed' ? 'closed' : 'open';
-  if (tpl.shadow === false) {
+  if (html != null) spec.template = html;
+  if (css != null) spec.style = css;
+  spec.mode = shadow === 'closed' ? 'closed' : 'open';
+  if (shadow === false) {
     console.warn('[Native UI] Light DOM (shadow: false) is not supported by the element factory; falling back to open shadow root.');
   }
 
   if (config.props) spec.props = config.props;
   if (config.form) spec.form = config.form;
-  if (config.query) spec.query = config.query;
+
+  // New contract: params and query are typed arrays — handled by page.js and
+  // stored on the spec. No action needed here; intercept.js reads spec.params
+  // and spec.query directly from specRegistry at navigation time.
 
   // Install all `on` entries (helpers + hooks) and explicit `methods` as
   // instance methods, so a hook body can call `this.<helper>()`.
@@ -74,7 +140,11 @@ export function translate(config, opts = {}) {
     spec.mount = async (ctx) => {
       const el = ctx.el;
       if (on.load) {
-        await on.load.call(el, { params: paramsOf(el, config.props), ...ctx });
+        // Provide the full contract-aware context bag.
+        // spec.params / spec.query are set by page.js before element() is called.
+        const params = paramsOf(el, spec.params, config.props);
+        const query  = queryOf(el, spec.query);
+        await on.load.call(el, { params, query, raw: ctx.raw ?? null, ...ctx });
       }
       if (on.connect) {
         await on.connect.call(el, ctx);

package/src/elements/data/list/style.css

@@ -27,7 +27,7 @@
   padding: var(--space-3) var(--space-4);
   border-bottom: var(--space-px) solid var(--color-border-default);
   box-sizing: border-box;
-  transition: background-color var(--duration-fast) var(--ease-out);
+  /* transition: background-color var(--duration-fast) var(--ease-out); */
 }
 
 ::slotted(ui-list-item:last-child), ::slotted(div[role="listitem"]:last-child) {

package/src/elements/data/table/index.js

@@ -2,7 +2,8 @@
  * src/elements/data/table/index.js
  *
  * Data Element: <ui-table>
- * Responsive data table layout wrapping native standard <table> tags and attaching
+ * Responsive data table layout wrapping native standard <div class="table-wrap">
+  <table> tags and attaching
  * complete semantic design token styles using slotted tree CSS.
  *
  * Source: doc 04 — Web Components §3, doc 05 — Native UI Primitives §3

package/src/elements/data/table/style.css

@@ -33,7 +33,7 @@
 
 ::slotted(tr) {
   border-bottom: var(--space-px) solid var(--color-border-default);
-  transition: background-color var(--duration-fast) var(--ease-out);
+  /* transition: background-color var(--duration-fast) var(--ease-out); */
 }
 
 ::slotted(tr:last-child) {

package/src/elements/feedback/alert/style.css

@@ -38,7 +38,7 @@ button {
   display: none;
   align-items: center;
   justify-content: center;
-  transition: opacity var(--duration-fast) var(--ease-out);
+  /* transition: opacity var(--duration-fast) var(--ease-out); */
 }
 
 button:hover {

package/src/styles/base.css

@@ -8,33 +8,32 @@
 
 @layer base {
   :root {
-    font-family: var(--font-sans);
-    font-size: var(--font-size-base);
+    font-family: var(--font-sans, system-ui, -apple-system, sans-serif);
+    font-size: var(--font-size-base, 1rem);
     color-scheme: light dark;
   }
 
   body {
-    background-color: var(--color-surface-page);
-    color: var(--color-content-primary);
+    background-color: var(--background);
+    color: var(--text-color);
     min-height: 100vh;
-    font-weight: var(--font-weight-regular);
-    line-height: var(--line-height-normal);
-    transition: background-color 220ms var(--ease-out), color 180ms var(--ease-out);
+    font-weight: var(--font-weight-regular, 400);
+    line-height: var(--line-height-normal, 1.5);
+    /* transition: background-color 220ms var(--ease-out, ease-out), color 180ms var(--ease-out, ease-out); */
   }
 
   /* Typography Defaults */
   h1, h2, h3, h4, h5, h6 {
-    font-family: var(--font-sans);
-    color: var(--color-content-primary);
+    font-family: var(--font-sans, system-ui, -apple-system, sans-serif);
+    color: var(--text-color);
     font-weight: var(--font-weight-semibold);
-    line-height: var(--line-height-tight);
-    letter-spacing: var(--letter-spacing-tight);
+    line-height: var(--line-height-tight, 1.25);
   }
 
-  h1 { font-size: var(--font-size-3xl); margin-bottom: var(--space-4); }
-  h2 { font-size: var(--font-size-2xl); margin-bottom: var(--space-3); }
-  h3 { font-size: var(--font-size-xl); margin-bottom: var(--space-2); }
-  h4 { font-size: var(--font-size-lg); }
+  h1 { font-size: var(--font-size-3xl, 2.25rem); margin-bottom: var(--space-4); }
+  h2 { font-size: var(--font-size-2xl, 1.875rem); margin-bottom: var(--space-3); }
+  h3 { font-size: var(--font-size-xl, 1.5rem); margin-bottom: var(--space-2); }
+  h4 { font-size: var(--font-size-lg, 1.25rem); }
   
   p {
     margin-bottom: var(--space-4);
@@ -42,25 +41,26 @@
   }
 
   a {
-    color: var(--color-content-link);
+    color: var(--color-interactive);
     text-decoration: none;
-    transition: color var(--duration-fast) var(--ease-out);
+    transition: opacity var(--duration-fast, 120ms) var(--ease-out, ease-out);
   }
 
   a:hover {
-    color: var(--color-interactive-hover);
+    opacity: 0.85;
     text-decoration: underline;
   }
 
   /* Selection highlight styles */
   ::selection {
     background-color: var(--color-interactive);
-    color: var(--color-content-inverse);
+    color: var(--color-surface-page);
   }
 
-  /* Custom high-contrast visual focus-ring */
+
+  /* Custom visual focus-ring */
   :focus-visible {
-    outline: 2px solid var(--color-border-focus);
+    outline: 2px solid var(--color-interactive);
     outline-offset: 2px;
   }
 
@@ -79,3 +79,4 @@
     min-height: 100vh;
   }
 }
+

package/src/styles/reset.css

@@ -11,8 +11,6 @@
   *::before,
   *::after {
     box-sizing: border-box;
-    margin: 0;
-    padding: 0;
   }
 
   html,

package/src/tokens/index.css

@@ -11,9 +11,6 @@
 @import './primitives/spacing.css';
 @import './primitives/typography.css';
 @import './primitives/motion.css';
-@import './primitives/radius.css';
-@import './primitives/shadow.css';
-@import './primitives/zindex.css';
 
 /* 2. Registered (Houdini Typed Properties for Animation) */
 @import './registered/colors.css';
@@ -23,5 +20,5 @@
 @import './semantic/light.css';
 @import './semantic/dark.css';
 @import './semantic/contrast.css';
-@import './semantic/components.css';
 @import './semantic/transitions.css';
+