@refrakt-md/lumina 0.8.4 → 0.9.0

package/base.css

@@ -24,3 +24,13 @@
 
 /* Universal Rune Attributes */
 @import './styles/base/attributes.css';
+
+/* Dimensions */
+@import './styles/dimensions/metadata.css';
+@import './styles/dimensions/density.css';
+@import './styles/dimensions/sections.css';
+@import './styles/dimensions/state.css';
+@import './styles/dimensions/media.css';
+@import './styles/dimensions/surfaces.css';
+@import './styles/dimensions/checklist.css';
+@import './styles/dimensions/sequence.css';

package/contracts/structures.json

@@ -11,9 +11,9 @@
 				"{content}"
 			],
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-accordion__header",
+					"selector": ".rf-accordion__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -209,6 +209,71 @@
 				"{content}"
 			]
 		},
+		"Blog": {
+			"block": "blog",
+			"root": ".rf-blog",
+			"dataRune": "blog",
+			"childOrder": [
+				"{content:content}"
+			],
+			"modifiers": {
+				"layout": {
+					"source": "meta",
+					"default": "list",
+					"classPattern": ".rf-blog--{value}",
+					"dataAttribute": "data-layout"
+				},
+				"sort": {
+					"source": "meta",
+					"default": "date-desc",
+					"dataAttribute": "data-sort"
+				},
+				"filter": {
+					"source": "meta",
+					"dataAttribute": "data-filter"
+				},
+				"limit": {
+					"source": "meta",
+					"dataAttribute": "data-limit"
+				},
+				"folder": {
+					"source": "meta",
+					"dataAttribute": "data-folder"
+				}
+			},
+			"elements": {
+				"content": {
+					"tag": "div",
+					"selector": ".rf-blog__content",
+					"source": "contentWrapper"
+				},
+				"preamble": {
+					"tag": "header",
+					"selector": ".rf-blog__preamble",
+					"source": "autoLabel"
+				},
+				"eyebrow": {
+					"tag": "eyebrow",
+					"selector": ".rf-blog__eyebrow",
+					"source": "autoLabel"
+				},
+				"headline": {
+					"tag": "headline",
+					"selector": ".rf-blog__headline",
+					"source": "autoLabel"
+				},
+				"blurb": {
+					"tag": "blurb",
+					"selector": ".rf-blog__blurb",
+					"source": "autoLabel"
+				},
+				"image": {
+					"tag": "image",
+					"selector": ".rf-blog__image",
+					"source": "autoLabel"
+				}
+			}
+		},
 		"Budget": {
 			"block": "budget",
 			"root": ".rf-budget",
@@ -697,9 +762,9 @@
 				"{content}"
 			],
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-tabs__header",
+					"selector": ".rf-tabs__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -849,9 +914,9 @@
 				}
 			},
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-reveal__header",
+					"selector": ".rf-reveal__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -885,6 +950,50 @@
 				"{content}"
 			]
 		},
+		"Juxtapose": {
+			"block": "juxtapose",
+			"root": ".rf-juxtapose",
+			"dataRune": "juxtapose",
+			"childOrder": [
+				"{content}"
+			],
+			"modifiers": {
+				"variant": {
+					"source": "meta",
+					"default": "slider",
+					"classPattern": ".rf-juxtapose--{value}",
+					"dataAttribute": "data-variant"
+				},
+				"orientation": {
+					"source": "meta",
+					"default": "vertical",
+					"dataAttribute": "data-orientation"
+				},
+				"position": {
+					"source": "meta",
+					"default": "50",
+					"dataAttribute": "data-position"
+				},
+				"duration": {
+					"source": "meta",
+					"default": "1000",
+					"dataAttribute": "data-duration"
+				}
+			},
+			"inlineStyles": {
+				"position": "--jx-position",
+				"duration": "--jx-duration"
+			}
+		},
+		"JuxtaposePanel": {
+			"block": "juxtapose-panel",
+			"root": ".rf-juxtapose-panel",
+			"dataRune": "juxtapose-panel",
+			"parent": "Juxtapose",
+			"childOrder": [
+				"{content}"
+			]
+		},
 		"Diagram": {
 			"block": "diagram",
 			"root": ".rf-diagram",
@@ -893,6 +1002,33 @@
 				"{content}"
 			]
 		},
+		"Tint": {
+			"block": "tint",
+			"root": ".rf-tint",
+			"dataRune": "tint",
+			"parent": "*",
+			"childOrder": [
+				"{content}"
+			]
+		},
+		"Bg": {
+			"block": "bg",
+			"root": ".rf-bg",
+			"dataRune": "bg",
+			"parent": "*",
+			"childOrder": [
+				"{content}"
+			]
+		},
+		"Region": {
+			"block": "region",
+			"root": ".rf-region",
+			"dataRune": "region",
+			"parent": "Layout",
+			"childOrder": [
+				"{content}"
+			]
+		},
 		"Sandbox": {
 			"block": "sandbox",
 			"root": ".rf-sandbox",
@@ -948,9 +1084,9 @@
 				}
 			},
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-hero__header",
+					"selector": ".rf-hero__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -1009,9 +1145,9 @@
 				}
 			},
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-cta__header",
+					"selector": ".rf-cta__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -1064,9 +1200,9 @@
 				}
 			},
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-bento__header",
+					"selector": ".rf-bento__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -1177,9 +1313,9 @@
 				}
 			},
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-feature__header",
+					"selector": ".rf-feature__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -1220,6 +1356,15 @@
 				}
 			}
 		},
+		"Definition": {
+			"block": "definition",
+			"root": ".rf-definition",
+			"dataRune": "definition",
+			"parent": "Feature",
+			"childOrder": [
+				"{content}"
+			]
+		},
 		"Steps": {
 			"block": "steps",
 			"root": ".rf-steps",
@@ -1228,9 +1373,9 @@
 				"{content}"
 			],
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-steps__header",
+					"selector": ".rf-steps__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -1310,9 +1455,9 @@
 				"{content}"
 			],
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-pricing__header",
+					"selector": ".rf-pricing__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -1392,9 +1537,9 @@
 				"{content}"
 			],
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-comparison__header",
+					"selector": ".rf-comparison__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -1542,9 +1687,9 @@
 			},
 			"elements": {
 				"header": {
-					"tag": "header",
+					"tag": "div",
 					"selector": ".rf-symbol__header",
-					"source": "autoLabel"
+					"source": "structure"
 				},
 				"kind-badge": {
 					"tag": "span",
@@ -1584,6 +1729,11 @@
 					"selector": ".rf-symbol__body",
 					"source": "contentWrapper"
 				},
+				"preamble": {
+					"tag": "header",
+					"selector": ".rf-symbol__preamble",
+					"source": "autoLabel"
+				},
 				"eyebrow": {
 					"tag": "eyebrow",
 					"selector": ".rf-symbol__eyebrow",
@@ -1632,9 +1782,9 @@
 				"{content}"
 			],
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-changelog__header",
+					"selector": ".rf-changelog__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -2241,9 +2391,9 @@
 					"selector": ".rf-event__content",
 					"source": "contentWrapper"
 				},
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-event__header",
+					"selector": ".rf-event__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -2290,9 +2440,9 @@
 				}
 			},
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-itinerary__header",
+					"selector": ".rf-itinerary__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -2413,9 +2563,9 @@
 				}
 			},
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-cast__header",
+					"selector": ".rf-cast__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -2457,9 +2607,9 @@
 				"{content}"
 			],
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-organization__header",
+					"selector": ".rf-organization__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -2500,9 +2650,9 @@
 				}
 			},
 			"elements": {
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-timeline__header",
+					"selector": ".rf-timeline__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -2676,6 +2826,12 @@
 					"classPattern": ".rf-preview--{value}",
 					"dataAttribute": "data-title"
 				}
+			},
+			"contextModifiers": {
+				"feature": {
+					"suffix": "in-feature",
+					"selector": ".rf-preview--in-feature"
+				}
 			}
 		},
 		"Mockup": {
@@ -2748,9 +2904,9 @@
 					"selector": ".rf-howto__content",
 					"source": "contentWrapper"
 				},
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-howto__header",
+					"selector": ".rf-howto__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -2792,17 +2948,14 @@
 				},
 				"prepTime": {
 					"source": "meta",
-					"classPattern": ".rf-recipe--{value}",
 					"dataAttribute": "data-prep-time"
 				},
 				"cookTime": {
 					"source": "meta",
-					"classPattern": ".rf-recipe--{value}",
 					"dataAttribute": "data-cook-time"
 				},
 				"servings": {
 					"source": "meta",
-					"classPattern": ".rf-recipe--{value}",
 					"dataAttribute": "data-servings"
 				},
 				"difficulty": {
@@ -2857,9 +3010,9 @@
 					"parent": "meta",
 					"condition": "difficulty"
 				},
-				"header": {
+				"preamble": {
 					"tag": "header",
-					"selector": ".rf-recipe__header",
+					"selector": ".rf-recipe__preamble",
 					"source": "autoLabel"
 				},
 				"eyebrow": {
@@ -2914,7 +3067,7 @@
 			"root": ".rf-playlist",
 			"dataRune": "playlist",
 			"childOrder": [
-				"header",
+				"meta",
 				"{content}"
 			],
 			"modifiers": {
@@ -2948,19 +3101,56 @@
 				"collapse": {
 					"source": "meta",
 					"dataAttribute": "data-collapse"
+				},
+				"artist": {
+					"source": "meta",
+					"dataAttribute": "data-artist"
+				},
+				"hasPlayer": {
+					"source": "meta",
+					"dataAttribute": "data-has-player"
+				},
+				"id": {
+					"source": "meta",
+					"dataAttribute": "data-id"
 				}
 			},
 			"elements": {
-				"header": {
+				"meta": {
 					"tag": "div",
-					"selector": ".rf-playlist__header",
+					"selector": ".rf-playlist__meta",
 					"source": "structure"
 				},
 				"type-badge": {
 					"tag": "span",
 					"selector": ".rf-playlist__type-badge",
 					"source": "structure",
-					"parent": "header"
+					"parent": "meta"
+				},
+				"preamble": {
+					"tag": "header",
+					"selector": ".rf-playlist__preamble",
+					"source": "autoLabel"
+				},
+				"eyebrow": {
+					"tag": "eyebrow",
+					"selector": ".rf-playlist__eyebrow",
+					"source": "autoLabel"
+				},
+				"headline": {
+					"tag": "headline",
+					"selector": ".rf-playlist__headline",
+					"source": "autoLabel"
+				},
+				"blurb": {
+					"tag": "blurb",
+					"selector": ".rf-playlist__blurb",
+					"source": "autoLabel"
+				},
+				"image": {
+					"tag": "image",
+					"selector": ".rf-playlist__image",
+					"source": "autoLabel"
 				},
 				"media": {
 					"tag": "media",

package/index.css

@@ -25,12 +25,23 @@
 /* Universal Rune Attributes */
 @import './styles/base/attributes.css';
 
+/* Dimensions */
+@import './styles/dimensions/metadata.css';
+@import './styles/dimensions/density.css';
+@import './styles/dimensions/sections.css';
+@import './styles/dimensions/state.css';
+@import './styles/dimensions/media.css';
+@import './styles/dimensions/surfaces.css';
+@import './styles/dimensions/checklist.css';
+@import './styles/dimensions/sequence.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/bento.css';
+@import './styles/runes/blog.css';
 @import './styles/runes/bond.css';
 @import './styles/runes/breadcrumb.css';
 @import './styles/runes/budget.css';
@@ -58,6 +69,7 @@
 @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';
@@ -82,6 +94,7 @@
 @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';
@@ -93,3 +106,12 @@
 @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/backlog.css';
+@import './styles/runes/decision-log.css';
+@import './styles/runes/plan-progress.css';
+@import './styles/runes/plan-activity.css';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@refrakt-md/lumina",
   "description": "Lumina theme for refrakt.md — design tokens, CSS, identity transform, and framework adapters",
-  "version": "0.8.4",
+  "version": "0.9.0",
   "type": "module",
   "license": "MIT",
   "repository": {
@@ -51,15 +51,15 @@
     "build": "tsc"
   },
   "dependencies": {
-    "@refrakt-md/runes": "0.8.4",
-    "@refrakt-md/transform": "0.8.4",
-    "@refrakt-md/types": "0.8.4",
-    "@refrakt-md/svelte": "0.8.4"
+    "@refrakt-md/runes": "0.9.0",
+    "@refrakt-md/transform": "0.9.0",
+    "@refrakt-md/types": "0.9.0",
+    "@refrakt-md/svelte": "0.9.0"
   },
   "peerDependencies": {
     "svelte": "^5.0.0",
     "@sveltejs/kit": "^2.0.0",
-    "@refrakt-md/html": "0.8.4"
+    "@refrakt-md/html": "0.9.0"
   },
   "devDependencies": {
     "postcss": "^8.4.0"

package/styles/dimensions/checklist.css

@@ -0,0 +1,81 @@
+/* === Checklist: universal checkbox item styling === */
+
+/* All checklist items get left padding for the indicator */
+[data-checked] {
+	position: relative;
+	padding-left: 1.75rem;
+	list-style: none;
+	margin-left: -1.5rem;
+}
+
+/* Indicator base — positioned left of text */
+[data-checked]::before {
+	content: '';
+	position: absolute;
+	left: 0.125rem;
+	top: 0.5em;
+	width: 1rem;
+	height: 1rem;
+	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-success);
+	border-color: var(--rf-color-success);
+}
+
+[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: 600;
+}
+
+/* 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;
+}
+
+/* === Density interaction === */
+
+/* Compact: tighter spacing */
+[data-density="compact"] [data-checked] {
+	padding-left: 1.5rem;
+}
+
+[data-density="compact"] [data-checked]::before {
+	width: 0.75rem;
+	height: 0.75rem;
+}
+
+/* Minimal: indicators only, no text */
+[data-density="minimal"] [data-checked] {
+	font-size: 0;
+	padding-left: 0;
+	display: inline-block;
+	width: 1rem;
+	height: 1rem;
+}