@refrakt-md/lumina 0.5.1 → 0.7.0

package/dist/config.d.ts

@@ -1,3 +1,3 @@
 /** Lumina theme configuration — extends base with icon SVGs */
-export declare const luminaConfig: import("@refrakt-md/theme-base").ThemeConfig;
+export declare const luminaConfig: import("@refrakt-md/transform").ThemeConfig;
 //# sourceMappingURL=config.d.ts.map

package/dist/config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../src/config.ts"],"names":[],"mappings":"AAGA,+DAA+D;AAC/D,eAAO,MAAM,YAAY,8CAUvB,CAAC"}
+{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../src/config.ts"],"names":[],"mappings":"AAIA,+DAA+D;AAC/D,eAAO,MAAM,YAAY,6CAUvB,CAAC"}

package/dist/config.js

@@ -1,4 +1,5 @@
-import { baseConfig, mergeThemeConfig } from '@refrakt-md/theme-base';
+import { baseConfig } from '@refrakt-md/runes';
+import { mergeThemeConfig } from '@refrakt-md/transform';
 import { icons as lucideIcons } from './icons.js';
 /** Lumina theme configuration — extends base with icon SVGs */
 export const luminaConfig = mergeThemeConfig(baseConfig, {

package/dist/config.js.map

@@ -1 +1 @@
-{"version":3,"file":"config.js","sourceRoot":"","sources":["../src/config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,YAAY,CAAC;AAElD,+DAA+D;AAC/D,MAAM,CAAC,MAAM,YAAY,GAAG,gBAAgB,CAAC,UAAU,EAAE;IACxD,KAAK,EAAE;QACN,IAAI,EAAE;YACL,IAAI,EAAE,4SAA4S;YAClT,OAAO,EAAE,iXAAiX;YAC1X,OAAO,EAAE,uSAAuS;YAChT,KAAK,EAAE,qRAAqR;SAC5R;QACD,MAAM,EAAE,WAAW;KACnB;CACD,CAAC,CAAC"}
+{"version":3,"file":"config.js","sourceRoot":"","sources":["../src/config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,YAAY,CAAC;AAElD,+DAA+D;AAC/D,MAAM,CAAC,MAAM,YAAY,GAAG,gBAAgB,CAAC,UAAU,EAAE;IACxD,KAAK,EAAE;QACN,IAAI,EAAE;YACL,IAAI,EAAE,4SAA4S;YAClT,OAAO,EAAE,iXAAiX;YAC1X,OAAO,EAAE,uSAAuS;YAChT,KAAK,EAAE,qRAAqR;SAC5R;QACD,MAAM,EAAE,WAAW;KACnB;CACD,CAAC,CAAC"}

package/index.css

@@ -17,14 +17,20 @@
 @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/version-switcher.css';
 
 /* Runes */
 @import './styles/runes/accordion.css';
 @import './styles/runes/annotate.css';
 @import './styles/runes/api.css';
 @import './styles/runes/bento.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/changelog.css';
 @import './styles/runes/chart.css';
 @import './styles/runes/compare.css';
@@ -38,6 +44,7 @@
 @import './styles/runes/codegroup.css';
 @import './styles/runes/embed.css';
 @import './styles/runes/event.css';
+@import './styles/runes/faction.css';
 @import './styles/runes/feature.css';
 @import './styles/runes/figure.css';
 @import './styles/runes/form.css';
@@ -45,13 +52,17 @@
 @import './styles/runes/hero.css';
 @import './styles/runes/hint.css';
 @import './styles/runes/howto.css';
+@import './styles/runes/lore.css';
+@import './styles/runes/itinerary.css';
 @import './styles/runes/map.css';
 @import './styles/runes/nav.css';
 @import './styles/runes/organization.css';
 @import './styles/runes/page-section.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/sidenote.css';
@@ -67,3 +78,6 @@
 @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';

package/manifest.json

@@ -9,5 +9,17 @@
     "attribute": "data-theme",
     "values": { "dark": "dark", "light": "light" },
     "systemPreference": true
+  },
+  "layouts": {
+    "default": {
+      "regions": ["header", "footer"]
+    },
+    "docs": {
+      "regions": ["header", "nav", "sidebar", "footer"],
+      "requiredRegions": ["nav"]
+    },
+    "blog": {
+      "regions": ["header", "sidebar", "footer"]
+    }
   }
 }

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.5.1",
+  "version": "0.7.0",
   "type": "module",
   "license": "MIT",
   "repository": {
@@ -46,10 +46,10 @@
     "build": "tsc"
   },
   "dependencies": {
-    "@refrakt-md/theme-base": "0.5.1",
-    "@refrakt-md/transform": "0.5.1",
-    "@refrakt-md/types": "0.5.1",
-    "@refrakt-md/svelte": "0.5.1"
+    "@refrakt-md/runes": "0.7.0",
+    "@refrakt-md/transform": "0.7.0",
+    "@refrakt-md/types": "0.7.0",
+    "@refrakt-md/svelte": "0.7.0"
   },
   "peerDependencies": {
     "svelte": "^5.0.0",

package/styles/layouts/blog.css

@@ -7,9 +7,18 @@
 .rf-blog-header__inner {
 	display: flex;
 	align-items: center;
-	justify-content: space-between;
+	gap: 1rem;
 	padding: 1.125rem 1.5rem;
 }
+.rf-blog-header__inner .rf-search-trigger {
+	margin-left: auto;
+}
+.rf-blog-header__inner p ~ p {
+	order: 1;
+}
+.rf-blog-header__inner .rf-mobile-menu-btn {
+	order: 2;
+}
 .rf-blog-header p {
 	margin: 0;
 	line-height: 1;

package/styles/layouts/default.css

@@ -5,9 +5,18 @@
 .rf-header__inner {
 	display: flex;
 	align-items: center;
-	justify-content: space-between;
+	gap: 1rem;
 	padding: 1.125rem 1.5rem;
 }
+.rf-header__inner .rf-search-trigger {
+	margin-left: auto;
+}
+.rf-header__inner p ~ p {
+	order: 1;
+}
+.rf-header__inner .rf-mobile-menu-btn {
+	order: 2;
+}
 .rf-header p {
 	margin: 0;
 	line-height: 1;

package/styles/layouts/docs.css

@@ -13,9 +13,18 @@
 .rf-docs-header__inner {
 	display: flex;
 	align-items: center;
-	justify-content: space-between;
+	gap: 1rem;
 	padding: 1.125rem 1.5rem;
 }
+.rf-docs-header__inner .rf-search-trigger {
+	margin-left: auto;
+}
+.rf-docs-header__inner p ~ p {
+	order: 1;
+}
+.rf-docs-header__inner .rf-mobile-menu-btn {
+	order: 2;
+}
 .rf-docs-header p {
 	margin: 0;
 	line-height: 1;
@@ -88,6 +97,41 @@
 	padding: 0 2.5rem;
 	--rf-content-padding: 2.5rem;
 }
+.rf-docs-content__inner--has-toc {
+	display: flex;
+	gap: 6rem;
+	max-width: calc(60rem + 220px + 6rem);
+}
+.rf-docs-content__inner--has-toc .rf-docs-content__body {
+	flex: 1;
+	min-width: 0;
+}
+
+/* ---- "On this page" sidebar ---- */
+.rf-docs-toc {
+	width: 220px;
+	flex-shrink: 0;
+	position: sticky;
+	top: 5.75rem;
+	align-self: flex-start;
+	max-height: calc(100vh - 5.75rem);
+	overflow-y: auto;
+	padding: 0 1.25rem;
+}
+.rf-docs-toc::-webkit-scrollbar {
+	width: 0;
+}
+
+/* ---- Smooth scroll with fixed-header offset ---- */
+html:has(.rf-docs-header) {
+	scroll-behavior: smooth;
+	scroll-padding-top: 5rem;
+}
+@media (prefers-reduced-motion: reduce) {
+	html:has(.rf-docs-header) {
+		scroll-behavior: auto;
+	}
+}
 
 /* ---- Mobile toolbar (hidden on desktop) ---- */
 .rf-docs-toolbar {
@@ -130,6 +174,17 @@
 	font-weight: 500;
 }
 
+/* ---- Hide TOC on medium screens ---- */
+@media (max-width: 1100px) {
+	.rf-docs-toc {
+		display: none;
+	}
+	.rf-docs-content__inner--has-toc {
+		display: block;
+		max-width: 60rem;
+	}
+}
+
 /* ---- Mobile overrides ---- */
 @media (max-width: 768px) {
 	.rf-docs-header {

package/styles/layouts/mobile.css

@@ -74,11 +74,13 @@
 	padding: 1rem 1.5rem;
 }
 
+/* Panel opens via data-open attribute (set by mobile-menu behavior) */
+.rf-mobile-panel[data-open] {
+	display: block;
+}
+
 @media (max-width: 768px) {
 	.rf-mobile-menu-btn {
 		display: block;
 	}
-	.rf-mobile-panel {
-		display: block;
-	}
 }

package/styles/layouts/on-this-page.css

@@ -0,0 +1,48 @@
+/* On This Page — TOC sidebar navigation */
+
+.rf-on-this-page {
+	font-size: 0.8rem;
+}
+
+.rf-on-this-page__title {
+	font-size: 0.7rem;
+	font-weight: 600;
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+	color: var(--rf-color-muted, #64748b);
+	margin: 0 0 0.75rem;
+}
+
+.rf-on-this-page__list {
+	list-style: none;
+	margin: 0;
+	padding: 0;
+}
+
+.rf-on-this-page__item {
+	border-left: 2px solid transparent;
+}
+
+.rf-on-this-page__item[data-level="3"] {
+	padding-left: 0.75rem;
+}
+
+.rf-on-this-page__item a {
+	display: block;
+	padding: 0.25rem 0.75rem;
+	color: var(--rf-color-muted, #64748b);
+	text-decoration: none;
+	line-height: 1.4;
+}
+
+.rf-on-this-page__item a:hover {
+	color: var(--rf-color-text, #1a1a2e);
+}
+
+.rf-on-this-page__item[data-active] {
+	border-left-color: var(--rf-color-primary, #0ea5e9);
+}
+
+.rf-on-this-page__item[data-active] a {
+	color: var(--rf-color-primary, #0ea5e9);
+}

package/styles/layouts/search.css

@@ -0,0 +1,210 @@
+/* Search trigger button */
+.rf-search-trigger {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.5rem;
+	padding: 0.375rem 0.625rem 0.375rem 0.5rem;
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-full);
+	background: var(--rf-color-surface);
+	color: var(--rf-color-muted);
+	font-size: 0.8rem;
+	font-family: var(--rf-font-sans);
+	cursor: pointer;
+	transition: border-color 0.15s, color 0.15s, background 0.15s;
+	line-height: 1;
+	white-space: nowrap;
+	flex-shrink: 0;
+}
+.rf-search-trigger:hover {
+	border-color: var(--rf-color-primary);
+	color: var(--rf-color-text);
+	background: var(--rf-color-surface-hover);
+}
+.rf-search-trigger svg {
+	width: 16px;
+	height: 16px;
+	flex-shrink: 0;
+}
+.rf-search-trigger__label {
+	pointer-events: none;
+}
+.rf-search-trigger__kbd {
+	display: inline-flex;
+	align-items: center;
+	padding: 0.125rem 0.375rem;
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-sm);
+	background: var(--rf-color-bg);
+	font-family: var(--rf-font-sans);
+	font-size: 0.7rem;
+	line-height: 1.2;
+	color: var(--rf-color-muted);
+}
+
+/* Search dialog */
+.rf-search-dialog {
+	position: fixed;
+	top: 15vh;
+	left: 50%;
+	transform: translateX(-50%);
+	width: min(560px, calc(100vw - 2rem));
+	max-height: 70vh;
+	margin: 0;
+	padding: 0;
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-lg);
+	background: var(--rf-color-bg);
+	box-shadow: var(--rf-shadow-lg);
+	overflow: hidden;
+	font-family: var(--rf-font-sans);
+}
+.rf-search-dialog[open] {
+	display: flex;
+	flex-direction: column;
+}
+.rf-search-dialog::backdrop {
+	background: rgba(0, 0, 0, 0.4);
+}
+
+/* Dialog header */
+.rf-search-dialog__header {
+	display: flex;
+	align-items: center;
+	gap: 0.75rem;
+	padding: 0.875rem 1rem;
+	border-bottom: 1px solid var(--rf-color-border);
+}
+.rf-search-dialog__icon {
+	flex-shrink: 0;
+	color: var(--rf-color-muted);
+}
+.rf-search-dialog__input {
+	flex: 1;
+	border: none;
+	outline: none;
+	background: transparent;
+	font-size: 1rem;
+	font-family: var(--rf-font-sans);
+	color: var(--rf-color-text);
+}
+.rf-search-dialog__input::placeholder {
+	color: var(--rf-color-muted);
+}
+/* Hide native search clear button */
+.rf-search-dialog__input::-webkit-search-cancel-button {
+	display: none;
+}
+.rf-search-dialog__esc {
+	display: inline-flex;
+	align-items: center;
+	padding: 0.125rem 0.375rem;
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-sm);
+	background: var(--rf-color-surface);
+	font-family: var(--rf-font-sans);
+	font-size: 0.7rem;
+	color: var(--rf-color-muted);
+	flex-shrink: 0;
+}
+
+/* Dialog body */
+.rf-search-dialog__body {
+	flex: 1;
+	overflow-y: auto;
+	overscroll-behavior: contain;
+}
+
+/* Results */
+.rf-search-dialog__results {
+	padding: 0.5rem;
+}
+.rf-search-result {
+	display: block;
+	padding: 0.625rem 0.75rem;
+	border-radius: var(--rf-radius-md);
+	text-decoration: none;
+	color: var(--rf-color-text);
+	cursor: pointer;
+}
+.rf-search-result:hover,
+.rf-search-result[data-active] {
+	background: var(--rf-color-surface-hover);
+}
+.rf-search-result__title {
+	display: block;
+	font-weight: 500;
+	font-size: 0.875rem;
+	line-height: 1.4;
+	margin-bottom: 0.125rem;
+}
+.rf-search-result__excerpt {
+	display: block;
+	font-size: 0.8rem;
+	line-height: 1.5;
+	color: var(--rf-color-muted);
+}
+.rf-search-result__excerpt mark {
+	background: var(--rf-color-primary-100);
+	color: var(--rf-color-primary-700);
+	border-radius: 2px;
+	padding: 0 1px;
+}
+
+/* Empty / unavailable state */
+.rf-search-dialog__empty {
+	text-align: center;
+	padding: 2rem 1rem;
+	font-size: 0.875rem;
+	color: var(--rf-color-muted);
+}
+
+/* Footer */
+.rf-search-dialog__footer {
+	display: flex;
+	align-items: center;
+	gap: 1rem;
+	padding: 0.5rem 1rem;
+	border-top: 1px solid var(--rf-color-border);
+	font-size: 0.7rem;
+	color: var(--rf-color-muted);
+}
+.rf-search-dialog__footer kbd {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	min-width: 1.25rem;
+	padding: 0 0.25rem;
+	border: 1px solid var(--rf-color-border);
+	border-radius: 3px;
+	background: var(--rf-color-surface);
+	font-family: var(--rf-font-sans);
+	font-size: 0.65rem;
+	line-height: 1.4;
+}
+
+/* Mobile */
+@media (max-width: 768px) {
+	.rf-search-trigger__label,
+	.rf-search-trigger__kbd {
+		display: none;
+	}
+	.rf-search-trigger {
+		padding: 0.375rem;
+		border-radius: var(--rf-radius-sm);
+	}
+	.rf-search-dialog[open] {
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		transform: none;
+		width: 100%;
+		max-height: 100vh;
+		border-radius: 0;
+		border: none;
+	}
+	.rf-search-dialog__footer {
+		display: none;
+	}
+}

package/styles/layouts/version-switcher.css

@@ -0,0 +1,45 @@
+/* Version Switcher — page-level version dropdown */
+
+.rf-version-switcher {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.5rem;
+	margin-bottom: 1.5rem;
+	font-size: 0.85rem;
+}
+
+.rf-version-switcher__label {
+	color: var(--rf-color-muted);
+	font-weight: 500;
+	font-size: 0.8rem;
+	text-transform: uppercase;
+	letter-spacing: 0.03em;
+}
+
+.rf-version-switcher__select {
+	appearance: none;
+	-webkit-appearance: none;
+	background: var(--rf-color-surface);
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-sm, 0.25rem);
+	color: var(--rf-color-text);
+	font-size: 0.85rem;
+	font-family: inherit;
+	padding: 0.3rem 2rem 0.3rem 0.6rem;
+	cursor: pointer;
+	line-height: 1.4;
+	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
+	background-repeat: no-repeat;
+	background-position: right 0.5rem center;
+	transition: border-color 150ms ease, box-shadow 150ms ease;
+}
+
+.rf-version-switcher__select:hover {
+	border-color: var(--rf-color-primary);
+}
+
+.rf-version-switcher__select:focus-visible {
+	outline: none;
+	border-color: var(--rf-color-primary);
+	box-shadow: 0 0 0 2px var(--rf-color-primary-100, rgba(14, 165, 233, 0.15));
+}

package/styles/runes/bond.css

@@ -0,0 +1,77 @@
+/* Bond */
+.rf-bond {
+	display: flex;
+	align-items: center;
+	gap: 1rem;
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-lg);
+	padding: 1rem 1.5rem;
+	margin: 1rem 0;
+}
+.rf-bond > span[property="from"],
+.rf-bond > span[property="to"] {
+	font-weight: 600;
+	font-size: 1rem;
+	color: var(--rf-color-heading);
+	white-space: nowrap;
+}
+.rf-bond__connector {
+	display: flex;
+	align-items: center;
+	flex-shrink: 0;
+}
+.rf-bond__arrow {
+	display: inline-block;
+	width: 2rem;
+	height: 2px;
+	background: var(--rf-color-border);
+	position: relative;
+}
+.rf-bond__arrow::after {
+	content: '';
+	position: absolute;
+	right: -1px;
+	top: 50%;
+	transform: translateY(-50%);
+	border: 4px solid transparent;
+	border-left: 6px solid var(--rf-color-border);
+}
+.rf-bond[data-bidirectional="true"] .rf-bond__arrow::before {
+	content: '';
+	position: absolute;
+	left: -1px;
+	top: 50%;
+	transform: translateY(-50%);
+	border: 4px solid transparent;
+	border-right: 6px solid var(--rf-color-border);
+}
+.rf-bond__body {
+	flex: 1;
+	font-size: 0.875rem;
+	color: var(--rf-color-muted);
+}
+
+/* Status variants */
+.rf-bond--active .rf-bond__arrow,
+.rf-bond--active .rf-bond__arrow::after {
+	border-left-color: var(--rf-color-primary);
+}
+.rf-bond--active .rf-bond__arrow {
+	background: var(--rf-color-primary);
+}
+.rf-bond--active[data-bidirectional="true"] .rf-bond__arrow::before {
+	border-right-color: var(--rf-color-primary);
+}
+
+.rf-bond[data-status="broken"] .rf-bond__arrow {
+	background: repeating-linear-gradient(
+		90deg,
+		var(--rf-color-muted) 0,
+		var(--rf-color-muted) 4px,
+		transparent 4px,
+		transparent 8px
+	);
+}
+.rf-bond[data-status="broken"] {
+	opacity: 0.6;
+}