orbital-ds 0.6.2 → 0.7.0

package/dist/ui/sidebar.js

@@ -421,7 +421,7 @@ function SidebarMenuItem({ className, ...props }) {
   );
 }
 const sidebarMenuButtonVariants = cva(
-  "peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-(--ds-sidebar-item-radius) px-3 py-2 text-left text-sm ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground [&_svg]:size-4 [&_svg]:shrink-0 [&>span:last-child]:truncate",
+  "peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-(--ds-sidebar-item-radius) px-3 py-2 text-left text-sm ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:mx-auto group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground [&_svg]:size-4 [&_svg]:shrink-0 [&>span:last-child]:truncate",
   {
     variants: {
       variant: {

package/dist/ui/tooltip.js

@@ -48,7 +48,7 @@ function TooltipContent({
           ...props,
           children: [
             children,
-            /* @__PURE__ */ jsx(TooltipPrimitive.Arrow, { className: "z-(--ds-z-overlay) size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground data-[side=left]:translate-x-[-1.5px] data-[side=right]:translate-x-[1.5px]" })
+            /* @__PURE__ */ jsx(TooltipPrimitive.Arrow, { "data-slot": "tooltip-arrow", className: "z-(--ds-z-overlay) size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground data-[side=left]:translate-x-[-1.5px] data-[side=right]:translate-x-[1.5px]" })
           ]
         }
       )

package/docs/CONTRACT.md

@@ -77,7 +77,7 @@ Los define la estructura con un valor neutro; un tema los sobrescribe si quiere.
 | Capas | `--ds-z-raised`, `--ds-z-sticky`, `--ds-z-sidebar` (sobre la cabecera sticky), `--ds-z-overlay` |
 | Movimiento | `--ds-motion-fast`, `--ds-motion-base`, `--ds-motion-slow`, `--ds-motion-blink` |
 | Foco | `--ds-ring-width` |
-| Sidebar | `--ds-sidebar-rail-w` (ancho del lateral contraído; por defecto `4rem`) |
+| Lateral | `--ds-sidebar-icon`, `--ds-sidebar-icon-stroke` (iconos), `--ds-sidebar-rail-w` (ancho contraído), `--ds-sidebar-rail-item` (tecla del raíl), `--ds-sidebar-logo` (logo y avatar), `--ds-sidebar-sep-inset` (separadores; negativo = de borde a borde). **Todo tema los define** (contrato) |
 | Velo | `--color-scrim` |
 | **Materiales** | `--ds-card-backdrop`, `--ds-overlay-backdrop`, `--ds-field-backdrop`, `--ds-sidebar-backdrop` (un `backdrop-filter` completo; por defecto `none`) y `--ds-page-backdrop` (un `background-image` para el fondo de la página; por defecto `none`) |
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "orbital-ds",
-  "version": "0.6.2",
+  "version": "0.7.0",
   "description": "Sistema de diseño genérico: estructura común + temas con personalidad (qratia, zyro) + ~60 componentes sobre Base UI y Tailwind v4, con contrato verificable y legible por agentes.",
   "keywords": [
     "design-system",
@@ -49,14 +49,6 @@
     "./contract.json": "./contract.json",
     "./components.manifest.json": "./components.manifest.json"
   },
-  "scripts": {
-    "build": "tsup && node scripts/build-css.mjs",
-    "dev": "tsup --watch --onSuccess \"node scripts/copy-css.mjs\"",
-    "typecheck": "tsc --noEmit",
-    "verify": "pnpm check:ds && pnpm typecheck && pnpm build",
-    "manifest": "node scripts/manifest.mjs",
-    "check:ds": "node scripts/doctor.mjs"
-  },
   "peerDependencies": {
     "@base-ui/react": ">=1.9",
     "class-variance-authority": ">=0.7",
@@ -138,5 +130,13 @@
   "bin": {
     "orbital-ds-doctor": "./scripts/doctor.mjs",
     "orbital-ds-init": "./scripts/init.mjs"
+  },
+  "scripts": {
+    "build": "tsup && node scripts/build-css.mjs",
+    "dev": "tsup --watch --onSuccess \"node scripts/copy-css.mjs\"",
+    "typecheck": "tsc --noEmit",
+    "verify": "pnpm check:ds && pnpm typecheck && pnpm build",
+    "manifest": "node scripts/manifest.mjs",
+    "check:ds": "node scripts/doctor.mjs"
   }
-}
+}

package/scripts/doctor.mjs

@@ -207,6 +207,35 @@ for (const f of themeFiles) {
         const r = ratio(over(fg, fondo), fondo);
         if (r < 4.5) errors.push(`tema ${tema} (${piel}): ${estado} sobre ${estado}-soft = ${r.toFixed(2)}:1 (mínimo 4.5:1)`);
       }
+
+      // Pares principales de texto sobre su superficie. AA (4.5:1) es el mínimo exigible; las
+      // excepciones deben estar declaradas en `<tema>.meta.json` → `a11y.exceptions` ("fg/bg").
+      // AAA (7:1) es el objetivo del texto del cuerpo: solo avisa, y solo con `--aaa`.
+      const PARES = [
+        ['foreground', 'background'], ['card-foreground', 'card'], ['popover-foreground', 'popover'],
+        ['primary-foreground', 'primary'], ['secondary-foreground', 'secondary'],
+        ['muted-foreground', 'background'], ['muted-foreground', 'card'],
+        ['sidebar-foreground', 'sidebar'], ['sidebar-primary-foreground', 'sidebar-primary'],
+        ['destructive-foreground', 'destructive'],
+      ];
+      let excepciones = [];
+      try { excepciones = JSON.parse(read(join(themesDir, `${tema}.meta.json`))).a11y?.exceptions ?? []; } catch { /* sin ficha: lo avisa 1b */ }
+      const blanco = { r: 255, g: 255, b: 255, a: 1 };
+      for (const [fgName, bgName] of PARES) {
+        const fgRaw = vars[fgName] && parseColor(vars[fgName]);
+        const bgRaw = vars[bgName] && parseColor(vars[bgName]);
+        if (!fgRaw || !bgRaw) continue;
+        const bg = over(bgRaw, over(lienzo, blanco));
+        const r = ratio(over(fgRaw, bg), bg);
+        const par = `${fgName}/${bgName}`;
+        if (r < 4.5) {
+          const msg = `tema ${tema} (${piel}): ${par} = ${r.toFixed(2)}:1 (mínimo AA 4.5:1)`;
+          if (excepciones.includes(par)) warnings.push(`${msg} — excepción declarada en la ficha`);
+          else errors.push(`${msg}; corrígelo o decláralo en ${tema}.meta.json → a11y.exceptions`);
+        } else if (process.argv.includes('--aaa') && r < 7 && (par === 'foreground/background' || par === 'card-foreground/card')) {
+          warnings.push(`tema ${tema} (${piel}): ${par} = ${r.toFixed(2)}:1 (objetivo AAA 7:1 para el texto del cuerpo)`);
+        }
+      }
     }
   }
 }