@refrakt-md/lumina 0.33.0 → 0.35.0

package/index.css

@@ -5,144 +5,144 @@
  * Lumina's own CSS below is currently unlayered, which keeps it winning over the
  * (empty) skeleton layer — the per-file `@layer skin` re-bucketing lands in
  * WORK-438. */
-@import '@refrakt-md/skeleton';
+@import "@refrakt-md/skeleton";
 
 /* Design Tokens */
-@import './tokens/base.css';
-@import './tokens/dark.css';
+@import "./tokens/base.css";
+@import "./tokens/dark.css";
 
 /* Global Styles */
-@import './styles/global.css';
+@import "./styles/global.css";
 
 /* Element Overrides */
-@import './styles/elements/table.css';
-@import './styles/elements/blockquote.css';
-@import './styles/elements/code.css';
+@import "./styles/elements/table.css";
+@import "./styles/elements/blockquote.css";
+@import "./styles/elements/code.css";
 
 /* Layouts */
-@import './styles/layouts/mobile.css';
-@import './styles/layouts/default.css';
-@import './styles/layouts/docs.css';
-@import './styles/layouts/blog.css';
-@import './styles/layouts/on-this-page.css';
-@import './styles/layouts/search.css';
-@import './styles/layouts/theme-toggle.css';
-@import './styles/layouts/version-switcher.css';
-@import './styles/layouts/split.css';
-@import './styles/layouts/plan.css';
+@import "./styles/layouts/mobile.css";
+@import "./styles/layouts/default.css";
+@import "./styles/layouts/docs.css";
+@import "./styles/layouts/blog.css";
+@import "./styles/layouts/on-this-page.css";
+@import "./styles/layouts/search.css";
+@import "./styles/layouts/theme-toggle.css";
+@import "./styles/layouts/version-switcher.css";
+@import "./styles/layouts/split.css";
+@import "./styles/layouts/plan.css";
 
 /* Universal Rune Attributes */
-@import './styles/base/attributes.css';
+@import "./styles/base/attributes.css";
 
 /* Dimensions */
-@import './styles/dimensions/metadata.css';
-@import './styles/dimensions/density.css';
-@import './styles/dimensions/sections.css';
-@import './styles/dimensions/reading.css';
-@import './styles/dimensions/state.css';
-@import './styles/dimensions/media.css';
-@import './styles/dimensions/surfaces.css';
-@import './styles/dimensions/frame.css';
-@import './styles/dimensions/substrate.css';
-@import './styles/dimensions/cover.css';
+@import "./styles/dimensions/metadata.css";
+@import "./styles/dimensions/density.css";
+@import "./styles/dimensions/sections.css";
+@import "./styles/dimensions/reading.css";
+@import "./styles/dimensions/state.css";
+@import "./styles/dimensions/media.css";
+@import "./styles/dimensions/surfaces.css";
+@import "./styles/dimensions/frame.css";
+@import "./styles/dimensions/substrate.css";
+@import "./styles/dimensions/cover.css";
 /* guest-posture is wholly structural (pointer-events + a tab-strip display reset)
  * → @refrakt-md/skeleton (dimensions/guest-posture.css), promoted with the
  * tabs/codegroup structure it depends on (WORK-438). */
-@import './styles/dimensions/checklist.css';
-@import './styles/dimensions/sequence.css';
-@import './styles/dimensions/motion.css';
+@import "./styles/dimensions/checklist.css";
+@import "./styles/dimensions/sequence.css";
+@import "./styles/dimensions/motion.css";
 
 /* Runes */
-@import './styles/runes/accordion.css';
-@import './styles/runes/annotate.css';
-@import './styles/runes/audio.css';
-@import './styles/runes/api.css';
-@import './styles/runes/card.css';
-@import './styles/runes/badge.css';
-@import './styles/runes/bar.css';
-@import './styles/runes/bento.css';
-@import './styles/runes/blog.css';
-@import './styles/runes/bond.css';
-@import './styles/runes/breadcrumb.css';
-@import './styles/runes/budget.css';
-@import './styles/runes/cast.css';
-@import './styles/runes/character.css';
-@import './styles/runes/collection.css';
-@import './styles/runes/relationships.css';
-@import './styles/runes/aggregate.css';
-@import './styles/runes/file-ref.css';
-@import './styles/runes/progress.css';
-@import './styles/runes/changelog.css';
-@import './styles/runes/chart.css';
-@import './styles/runes/compare.css';
-@import './styles/runes/comparison.css';
-@import './styles/runes/conversation.css';
-@import './styles/runes/cta.css';
-@import './styles/runes/datatable.css';
-@import './styles/runes/details.css';
-@import './styles/runes/drawer.css';
-@import './styles/runes/diagram.css';
-@import './styles/runes/diff.css';
-@import './styles/runes/codegroup.css';
-@import './styles/runes/snippet.css';
-@import './styles/runes/embed.css';
-@import './styles/runes/expand.css';
-@import './styles/runes/event.css';
-@import './styles/runes/faction.css';
-@import './styles/runes/feature.css';
-@import './styles/runes/figure.css';
-@import './styles/runes/placeholder.css';
-@import './styles/runes/gallery.css';
-@import './styles/runes/carousel.css';
-@import './styles/runes/form.css';
-@import './styles/runes/grid.css';
-@import './styles/runes/hero.css';
-@import './styles/runes/hint.css';
-@import './styles/runes/howto.css';
-@import './styles/runes/juxtapose.css';
-@import './styles/runes/lore.css';
-@import './styles/runes/itinerary.css';
-@import './styles/runes/map.css';
-@import './styles/runes/mockup.css';
-@import './styles/runes/nav.css';
-@import './styles/runes/organization.css';
-@import './styles/runes/page-section.css';
-@import './styles/runes/pagination.css';
-@import './styles/runes/playlist.css';
-@import './styles/runes/plot.css';
-@import './styles/runes/preview.css';
-@import './styles/runes/pricing.css';
-@import './styles/runes/sandbox.css';
-@import './styles/runes/realm.css';
-@import './styles/runes/recipe.css';
-@import './styles/runes/reveal.css';
-@import './styles/runes/section.css';
-@import './styles/runes/sidenote.css';
-@import './styles/runes/steps.css';
-@import './styles/runes/storyboard.css';
-@import './styles/runes/symbol.css';
-@import './styles/runes/tabs.css';
-@import './styles/runes/testimonial.css';
-@import './styles/runes/timeline.css';
-@import './styles/runes/toc.css';
-@import './styles/runes/track.css';
-@import './styles/runes/xref.css';
-@import './styles/runes/swatch.css';
-@import './styles/runes/palette.css';
-@import './styles/runes/typography.css';
-@import './styles/runes/spacing.css';
-@import './styles/runes/design-context.css';
-@import './styles/runes/pullquote.css';
-@import './styles/runes/textblock.css';
-@import './styles/runes/mediatext.css';
-@import './styles/runes/tint.css';
-@import './styles/runes/showcase.css';
-@import './styles/runes/bg.css';
-@import './styles/runes/spec.css';
-@import './styles/runes/work.css';
-@import './styles/runes/bug.css';
-@import './styles/runes/decision.css';
-@import './styles/runes/milestone.css';
-@import './styles/runes/plan-ref.css';
-@import './styles/runes/plan-history.css';
-@import './styles/runes/plan-progress.css';
+@import "./styles/runes/accordion.css";
+@import "./styles/runes/annotate.css";
+@import "./styles/runes/audio.css";
+@import "./styles/runes/api.css";
+@import "./styles/runes/card.css";
+@import "./styles/runes/badge.css";
+@import "./styles/runes/bar.css";
+@import "./styles/runes/bento.css";
+@import "./styles/runes/blog.css";
+@import "./styles/runes/bond.css";
+@import "./styles/runes/breadcrumb.css";
+@import "./styles/runes/budget.css";
+@import "./styles/runes/cast.css";
+@import "./styles/runes/character.css";
+@import "./styles/runes/collection.css";
+@import "./styles/runes/relationships.css";
+@import "./styles/runes/aggregate.css";
+@import "./styles/runes/file-ref.css";
+@import "./styles/runes/progress.css";
+@import "./styles/runes/changelog.css";
+@import "./styles/runes/chart.css";
+@import "./styles/runes/compare.css";
+@import "./styles/runes/comparison.css";
+@import "./styles/runes/conversation.css";
+@import "./styles/runes/cta.css";
+@import "./styles/runes/datatable.css";
+@import "./styles/runes/details.css";
+@import "./styles/runes/drawer.css";
+@import "./styles/runes/diagram.css";
+@import "./styles/runes/diff.css";
+@import "./styles/runes/codegroup.css";
+@import "./styles/runes/snippet.css";
+@import "./styles/runes/embed.css";
+@import "./styles/runes/expand.css";
+@import "./styles/runes/event.css";
+@import "./styles/runes/faction.css";
+@import "./styles/runes/feature.css";
+@import "./styles/runes/figure.css";
+@import "./styles/runes/placeholder.css";
+@import "./styles/runes/gallery.css";
+@import "./styles/runes/carousel.css";
+@import "./styles/runes/form.css";
+@import "./styles/runes/grid.css";
+@import "./styles/runes/hero.css";
+@import "./styles/runes/hint.css";
+@import "./styles/runes/howto.css";
+@import "./styles/runes/juxtapose.css";
+@import "./styles/runes/lore.css";
+@import "./styles/runes/itinerary.css";
+@import "./styles/runes/map.css";
+@import "./styles/runes/mockup.css";
+@import "./styles/runes/nav.css";
+@import "./styles/runes/organization.css";
+@import "./styles/runes/page-section.css";
+@import "./styles/runes/pagination.css";
+@import "./styles/runes/playlist.css";
+@import "./styles/runes/plot.css";
+@import "./styles/runes/preview.css";
+@import "./styles/runes/pricing.css";
+@import "./styles/runes/sandbox.css";
+@import "./styles/runes/realm.css";
+@import "./styles/runes/recipe.css";
+@import "./styles/runes/reveal.css";
+@import "./styles/runes/section.css";
+@import "./styles/runes/sidenote.css";
+@import "./styles/runes/steps.css";
+@import "./styles/runes/storyboard.css";
+@import "./styles/runes/symbol.css";
+@import "./styles/runes/tabs.css";
+@import "./styles/runes/testimonial.css";
+@import "./styles/runes/timeline.css";
+@import "./styles/runes/toc.css";
+@import "./styles/runes/track.css";
+@import "./styles/runes/xref.css";
+@import "./styles/runes/swatch.css";
+@import "./styles/runes/palette.css";
+@import "./styles/runes/typography.css";
+@import "./styles/runes/spacing.css";
+@import "./styles/runes/design-context.css";
+@import "./styles/runes/pullquote.css";
+@import "./styles/runes/textblock.css";
+@import "./styles/runes/mediatext.css";
+@import "./styles/runes/tint.css";
+@import "./styles/runes/showcase.css";
+@import "./styles/runes/bg.css";
+@import "./styles/runes/spec.css";
+@import "./styles/runes/work.css";
+@import "./styles/runes/bug.css";
+@import "./styles/runes/decision.css";
+@import "./styles/runes/milestone.css";
+@import "./styles/runes/plan-ref.css";
+@import "./styles/runes/plan-history.css";
+@import "./styles/runes/plan-progress.css";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@refrakt-md/lumina",
   "description": "Lumina theme for refrakt.md — design tokens, CSS, identity transform, and layout configs",
-  "version": "0.33.0",
+  "version": "0.35.0",
   "type": "module",
   "license": "MIT",
   "repository": {
@@ -86,10 +86,10 @@
     "generate-tokens": "node scripts/generate-tokens.mjs"
   },
   "dependencies": {
-    "@refrakt-md/runes": "0.33.0",
-    "@refrakt-md/skeleton": "0.33.0",
-    "@refrakt-md/transform": "0.33.0",
-    "@refrakt-md/types": "0.33.0"
+    "@refrakt-md/runes": "0.35.0",
+    "@refrakt-md/skeleton": "0.35.0",
+    "@refrakt-md/transform": "0.35.0",
+    "@refrakt-md/types": "0.35.0"
   },
   "devDependencies": {
     "postcss": "^8.4.0"

package/presets.json

@@ -1,15 +1,63 @@
 {
-	"name": "@refrakt-md/lumina",
-	"refrakt": ">=0.24 <0.26",
-	"presets": [
-		{ "id": "niwaki", "title": "Niwaki", "scope": "syntax", "module": "./dist/presets/niwaki.js" },
-		{ "id": "tideline", "title": "Tideline", "scope": "palette", "module": "./dist/presets/tideline.js", "tunedFor": ["@refrakt-md/lumina"] },
-		{ "id": "nord", "title": "Nord", "scope": "palette", "module": "./dist/presets/nord.js", "tunedFor": ["@refrakt-md/lumina"] },
-		{ "id": "dracula", "title": "Dracula", "scope": "palette", "module": "./dist/presets/dracula.js", "tunedFor": ["@refrakt-md/lumina"] },
-		{ "id": "solarized", "title": "Solarized", "scope": "palette", "module": "./dist/presets/solarized.js", "tunedFor": ["@refrakt-md/lumina"] },
-		{ "id": "catppuccin", "title": "Catppuccin", "scope": "palette", "module": "./dist/presets/catppuccin.js", "tunedFor": ["@refrakt-md/lumina"] },
-		{ "id": "gruvbox", "title": "Gruvbox", "scope": "palette", "module": "./dist/presets/gruvbox.js", "tunedFor": ["@refrakt-md/lumina"] },
-		{ "id": "one-dark", "title": "One Dark", "scope": "palette", "module": "./dist/presets/one-dark.js", "tunedFor": ["@refrakt-md/lumina"] },
-		{ "id": "tokyo-night", "title": "Tokyo Night", "scope": "palette", "module": "./dist/presets/tokyo-night.js", "tunedFor": ["@refrakt-md/lumina"] }
-	]
+  "name": "@refrakt-md/lumina",
+  "refrakt": ">=0.24 <0.26",
+  "presets": [
+    { "id": "niwaki", "title": "Niwaki", "scope": "syntax", "module": "./dist/presets/niwaki.js" },
+    {
+      "id": "tideline",
+      "title": "Tideline",
+      "scope": "palette",
+      "module": "./dist/presets/tideline.js",
+      "tunedFor": ["@refrakt-md/lumina"]
+    },
+    {
+      "id": "nord",
+      "title": "Nord",
+      "scope": "palette",
+      "module": "./dist/presets/nord.js",
+      "tunedFor": ["@refrakt-md/lumina"]
+    },
+    {
+      "id": "dracula",
+      "title": "Dracula",
+      "scope": "palette",
+      "module": "./dist/presets/dracula.js",
+      "tunedFor": ["@refrakt-md/lumina"]
+    },
+    {
+      "id": "solarized",
+      "title": "Solarized",
+      "scope": "palette",
+      "module": "./dist/presets/solarized.js",
+      "tunedFor": ["@refrakt-md/lumina"]
+    },
+    {
+      "id": "catppuccin",
+      "title": "Catppuccin",
+      "scope": "palette",
+      "module": "./dist/presets/catppuccin.js",
+      "tunedFor": ["@refrakt-md/lumina"]
+    },
+    {
+      "id": "gruvbox",
+      "title": "Gruvbox",
+      "scope": "palette",
+      "module": "./dist/presets/gruvbox.js",
+      "tunedFor": ["@refrakt-md/lumina"]
+    },
+    {
+      "id": "one-dark",
+      "title": "One Dark",
+      "scope": "palette",
+      "module": "./dist/presets/one-dark.js",
+      "tunedFor": ["@refrakt-md/lumina"]
+    },
+    {
+      "id": "tokyo-night",
+      "title": "Tokyo Night",
+      "scope": "palette",
+      "module": "./dist/presets/tokyo-night.js",
+      "tunedFor": ["@refrakt-md/lumina"]
+    }
+  ]
 }

package/styles/base/attributes.css

@@ -1,28 +1,47 @@
 @layer skin {
-/* Universal Rune Attributes — spacing & inset
+	/* Universal Rune Attributes — spacing & inset
  *
  * Compound attribute selectors [data-rune][data-*] give specificity (0,2,0):
  *   - Overrides rune defaults like .rf-itinerary { margin: 2rem 0 } at (0,1,0)
  *   - Overridden by layout-level rules in default.css at (0,2,1)
  *   - Per-rune overrides (e.g. showcase) win via source order (loaded after) */
 
-/* ── Spacing — vertical rhythm ─────────────────────────────────────── */
+	/* ── Spacing — vertical rhythm ─────────────────────────────────────── */
 
-[data-rune][data-spacing="flush"]   { margin-top: 0; margin-bottom: 0; }
-[data-rune][data-spacing="tight"]   { margin-top: var(--rf-spacing-section-tight, 1.5rem); margin-bottom: var(--rf-spacing-section-tight, 1.5rem); }
-[data-rune][data-spacing="loose"]   { margin-top: var(--rf-spacing-section-loose, 8rem); margin-bottom: var(--rf-spacing-section-loose, 8rem); }
-[data-rune][data-spacing="breathe"] { margin-top: var(--rf-spacing-section-breathe, 12rem); margin-bottom: var(--rf-spacing-section-breathe, 12rem); }
+	[data-rune][data-spacing="flush"] {
+		margin-top: 0;
+		margin-bottom: 0;
+	}
+	[data-rune][data-spacing="tight"] {
+		margin-top: var(--rf-spacing-section-tight, 1.5rem);
+		margin-bottom: var(--rf-spacing-section-tight, 1.5rem);
+	}
+	[data-rune][data-spacing="loose"] {
+		margin-top: var(--rf-spacing-section-loose, 8rem);
+		margin-bottom: var(--rf-spacing-section-loose, 8rem);
+	}
+	[data-rune][data-spacing="breathe"] {
+		margin-top: var(--rf-spacing-section-breathe, 12rem);
+		margin-bottom: var(--rf-spacing-section-breathe, 12rem);
+	}
 
-/* ── Inset — horizontal padding ────────────────────────────────────── */
+	/* ── Inset — horizontal padding ────────────────────────────────────── */
 
-[data-rune][data-inset="flush"]   { padding-inline: 0; }
-[data-rune][data-inset="tight"]   { padding-inline: var(--rf-inset-tight, 1rem); }
-[data-rune][data-inset="loose"]   { padding-inline: var(--rf-inset-loose, 4rem); }
-[data-rune][data-inset="breathe"] { padding-inline: var(--rf-inset-breathe, 8rem); }
+	[data-rune][data-inset="flush"] {
+		padding-inline: 0;
+	}
+	[data-rune][data-inset="tight"] {
+		padding-inline: var(--rf-inset-tight, 1rem);
+	}
+	[data-rune][data-inset="loose"] {
+		padding-inline: var(--rf-inset-loose, 4rem);
+	}
+	[data-rune][data-inset="breathe"] {
+		padding-inline: var(--rf-inset-breathe, 8rem);
+	}
 
-/* The `elevation` axis (SPEC-107) — depth-ladder chrome (fill / border / radius
+	/* The `elevation` axis (SPEC-107) — depth-ladder chrome (fill / border / radius
  * / resting shadow) — is mapped by value in dimensions/surfaces.css. The old
  * SPEC-086 shadow scale (none/sm/md/lg) is superseded; the engine maps those
  * deprecated aliases onto the ladder before they reach the DOM. */
-
 }

package/styles/dimensions/checklist.css

@@ -1,52 +1,51 @@
 @layer skin {
-/* === Checklist — skin ===
+	/* === Checklist — skin ===
  * The indicator chrome (fill, border, radius, box-shadow) and the item text
  * treatment per state. The indicator gutter + box placement/size live in
  * @refrakt-md/skeleton (dimensions/checklist.css). */
 
-/* Indicator base chrome. */
-[data-checked]::before {
-	border-radius: var(--rf-radius-sm, 0.25rem);
-	border: 2px solid var(--rf-color-border);
-	background: transparent;
-}
-
-/* Checked — filled with checkmark */
-[data-checked="checked"]::before {
-	background: var(--rf-color-primary);
-	border-color: var(--rf-color-primary);
-}
-
-[data-checked="checked"] {
-	color: var(--rf-color-muted);
-}
-
-/* Active — primary colour with emphasis */
-[data-checked="active"]::before {
-	border-color: var(--rf-color-primary);
-	background: var(--rf-color-primary);
-	box-shadow: 0 0 0 3px color-mix(in oklch, var(--rf-color-primary) 20%, transparent);
-}
-
-[data-checked="active"] {
-	color: var(--rf-color-primary);
-	font-weight: var(--rf-weight-semibold);
-}
-
-/* Skipped — muted with strikethrough */
-[data-checked="skipped"]::before {
-	background: var(--rf-color-muted);
-	border-color: var(--rf-color-muted);
-}
-
-[data-checked="skipped"] {
-	text-decoration: line-through;
-	color: var(--rf-color-muted);
-}
-
-/* Unchecked — empty indicator (inherits base styling) */
-[data-checked="unchecked"]::before {
-	background: transparent;
-}
-
+	/* Indicator base chrome. */
+	[data-checked]::before {
+		border-radius: var(--rf-radius-sm, 0.25rem);
+		border: 2px solid var(--rf-color-border);
+		background: transparent;
+	}
+
+	/* Checked — filled with checkmark */
+	[data-checked="checked"]::before {
+		background: var(--rf-color-primary);
+		border-color: var(--rf-color-primary);
+	}
+
+	[data-checked="checked"] {
+		color: var(--rf-color-muted);
+	}
+
+	/* Active — primary colour with emphasis */
+	[data-checked="active"]::before {
+		border-color: var(--rf-color-primary);
+		background: var(--rf-color-primary);
+		box-shadow: 0 0 0 3px color-mix(in oklch, var(--rf-color-primary) 20%, transparent);
+	}
+
+	[data-checked="active"] {
+		color: var(--rf-color-primary);
+		font-weight: var(--rf-weight-semibold);
+	}
+
+	/* Skipped — muted with strikethrough */
+	[data-checked="skipped"]::before {
+		background: var(--rf-color-muted);
+		border-color: var(--rf-color-muted);
+	}
+
+	[data-checked="skipped"] {
+		text-decoration: line-through;
+		color: var(--rf-color-muted);
+	}
+
+	/* Unchecked — empty indicator (inherits base styling) */
+	[data-checked="unchecked"]::before {
+		background: transparent;
+	}
 }