@publier/shell 4.5.1 → 4.6.0

package/dist/tailwind/loader.d.mts

@@ -10,7 +10,13 @@ interface ThemeYaml {
   name?: string;
   preset?: string;
   colors?: Record<string, string>;
-  typography?: Record<string, string>;
+  typography?: {
+    heading?: string;
+    body?: string;
+    mono?: string;
+    'body-weight'?: string | number;
+    'heading-weight'?: string | number;
+  };
   layout?: Record<string, string>;
   prose?: Record<string, string>;
   code?: Record<string, string>;

package/dist/tailwind/loader.mjs

@@ -1,2 +1,2 @@
-import{n as e,r as t,t as n}from"../presets-CYFX0GLA.mjs";import{tailwindComposeThemeCss as r,tailwindReadPresetCss as i,tailwindResolveTheme as a}from"@publier/native";import{fileURLToPath as o}from"node:url";const s=[`colors`,`typography`,`layout`,`prose`,`code`],c={colors:[`primary`,`primary-content`,`secondary`,`secondary-content`,`accent`,`accent-content`,`neutral`,`neutral-content`,`base-100`,`base-200`,`base-300`,`base-content`,`info`,`info-content`,`success`,`success-content`,`warning`,`warning-content`,`error`,`error-content`],typography:[`heading`,`body`,`mono`],layout:[`nav-height`,`sidebar-width`,`toc-width`,`page-max-width`],prose:[`content-gap-y`,`line-height`,`heading-line-height`],code:[`block-radius`,`inline-radius`,`inline-padding-y`,`inline-padding-x`]};function l(e){if(!e||typeof e!=`object`||Array.isArray(e))return{preset:void 0,overrides:{},overrideCss:``,errors:[]};let t=a(JSON.stringify(e));return{preset:t.preset??void 0,overrides:t.overrides,overrideCss:t.overrideCss,errors:t.errors.map(e=>({code:e.code,message:e.message,path:e.path}))}}function u(e){let t=Object.keys(e).sort();return t.length===0?``:`:root[data-theme="light"], :root[data-theme="dark"] {\n${t.map(t=>`\t${t}: ${e[t]};`).join(`
+import{n as e,r as t,t as n}from"../presets-CYFX0GLA.mjs";import{tailwindComposeThemeCss as r,tailwindReadPresetCss as i,tailwindResolveTheme as a}from"@publier/native";import{fileURLToPath as o}from"node:url";const s=[`colors`,`typography`,`layout`,`prose`,`code`],c={colors:[`primary`,`primary-content`,`secondary`,`secondary-content`,`accent`,`accent-content`,`neutral`,`neutral-content`,`base-100`,`base-200`,`base-300`,`base-content`,`info`,`info-content`,`success`,`success-content`,`warning`,`warning-content`,`error`,`error-content`],typography:[`heading`,`body`,`mono`,`body-weight`,`heading-weight`],layout:[`nav-height`,`sidebar-width`,`toc-width`,`page-max-width`],prose:[`content-gap-y`,`line-height`,`heading-line-height`],code:[`block-radius`,`inline-radius`,`inline-padding-y`,`inline-padding-x`]};function l(e){if(!e||typeof e!=`object`||Array.isArray(e))return{preset:void 0,overrides:{},overrideCss:``,errors:[]};let t=a(JSON.stringify(e));return{preset:t.preset??void 0,overrides:t.overrides,overrideCss:t.overrideCss,errors:t.errors.map(e=>({code:e.code,message:e.message,path:e.path}))}}function u(e){let t=Object.keys(e).sort();return t.length===0?``:`:root[data-theme="light"], :root[data-theme="dark"] {\n${t.map(t=>`\t${t}: ${e[t]};`).join(`
 `)}\n}\n`}function d(e,t){let n=l(e),r=t.defaultPreset;return n.preset!==void 0&&(t.isValidPreset(n.preset)?r=n.preset:n.errors.push({code:`unknown-preset`,message:`Unknown preset "${n.preset}". Theme will fall back to "${t.defaultPreset}".`,path:`preset`})),{...n,preset:r}}function f(e,t){return r(e,t)}const p=o(new URL(`./themes/`,import.meta.url));function m(e){return`${p}${e}.css`}async function h(e){return i(p,e)}export{n as AVAILABLE_THEMES,c as THEME_KEYS,s as THEME_SECTIONS,f as composeThemeCss,e as isValidPreset,t as listPresets,h as loadPresetCss,m as presetPath,u as renderOverrideCss,l as resolveTheme,d as resolveThemeWithPreset};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@publier/shell",
-  "version": "4.5.1",
+  "version": "4.6.0",
   "license": "UNLICENSED",
   "description": "Qwik + Astro docs layout for Publier sites.",
   "type": "module",
@@ -119,7 +119,7 @@
     "@github/details-menu-element": "^1.0.13",
     "@github/relative-time-element": "^5.3.1",
     "@github/tab-container-element": "^4.9.0",
-    "@publier/native": "7.0.1",
+    "@publier/native": "8.0.1",
     "@tailwindcss/typography": "^0.5.20",
     "astro-pagefind": "^2.0.1",
     "daisyui": "^5.7.22",

package/src/components/ui/feature-section.astro

@@ -25,7 +25,7 @@ const visualOrder = reverse ? 'md:order-first' : '';
 ---
 
 <section class={`py-14 md:py-20 ${cls ?? ''}`}>
-	<div class="max-w-6xl mx-auto px-6 grid gap-10 md:grid-cols-2 md:items-center">
+	<div class="max-w-6xl mx-auto px-6 grid grid-cols-1 gap-10 md:grid-cols-2 md:items-center">
 		<div>
 			{eyebrow && (
 				<span class="badge badge-outline badge-primary">{eyebrow}</span>

package/src/styles/base.css

@@ -83,6 +83,7 @@ h3,
 h4,
 h5,
 h6 {
+	font-family: var(--publier-font-heading, var(--font-body));
 	font-weight: var(--publier-font-weight-heading, 700);
 }
 
@@ -129,15 +130,43 @@ h6 {
  * H2s without needing a separate display font. */
 .prose {
 	font-size: 1.125rem;
-	line-height: 1.7;
+	line-height: var(--publier-prose-line-height, 1.7);
 }
-.prose > :where(h1):not(:where([class~="not-prose"] *)) {
+.prose > :where(h1):not(:where(.not-prose, [class~="not-prose"] *)) {
 	font-size: 2.25rem;
 	font-weight: var(--publier-font-weight-heading, 800);
-	line-height: 1.15;
+	line-height: var(--publier-prose-heading-line-height, 1.15);
 }
-.prose > :where(p):not(:where([class~="not-prose"] *)) {
-	line-height: 1.7;
+.prose > :where(p):not(:where(.not-prose, [class~="not-prose"] *)) {
+	line-height: var(--publier-prose-line-height, 1.7);
+}
+
+/* Keep typography's per-element rhythm when no override is supplied. The
+ * separate layer lets revert-layer recover those defaults without copying them. */
+@layer publier-theme {
+	.prose :where(h1, h2, h3, h4, h5, h6):not(:where(.not-prose, [class~="not-prose"] *)) {
+		line-height: var(--publier-prose-heading-line-height, revert-layer);
+	}
+	.prose > :where(:not(:first-child)):not(:where(.not-prose, [class~="not-prose"] *)) {
+		margin-block-start: var(--publier-prose-content-gap-y, revert-layer);
+	}
+	.prose > :where(:not(:last-child)):not(:where(.not-prose, [class~="not-prose"] *)) {
+		margin-block-end: var(--publier-prose-content-gap-y, revert-layer);
+	}
+	.prose :where(code):not(:where(pre code, .not-prose, [class~="not-prose"] *)) {
+		border-radius: var(--publier-code-inline-radius, revert-layer);
+		padding-block: var(--publier-code-inline-padding-y, revert-layer);
+		padding-inline: var(--publier-code-inline-padding-x, revert-layer);
+	}
+	.prose :where(pre):not(:where(.not-prose, [class~="not-prose"] *)) {
+		border-radius: var(--publier-code-block-radius, revert-layer);
+	}
+}
+
+/* Typography sets heading weights inside .prose; keep the shared font contract. */
+.prose :where(h1, h2, h3, h4, h5, h6):not(:where(.not-prose, [class~="not-prose"] *)) {
+	font-family: var(--publier-font-heading, var(--font-body));
+	font-weight: var(--publier-font-weight-heading, 700);
 }
 
 /* ─── Top-nav active link — brand-tinted highlight ─────────
@@ -738,6 +767,14 @@ header.alert[data-publier-banner] [data-publier-banner-dismiss] {
 }
 
 /* Documentation uses one primary header row; selectors and sections sit beside the brand. */
+[data-publier-top-nav] > .navbar {
+	min-height: var(--publier-nav-height, 4rem);
+}
+@media (width >= 80rem) {
+	aside[aria-label="Table of contents"] {
+		width: var(--publier-toc-width, 14rem);
+	}
+}
 [data-publier-docs-header] .navbar-start {
 	flex: 0 0 auto;
 	width: auto;
@@ -771,11 +808,11 @@ header.alert[data-publier-banner] [data-publier-banner-dismiss] {
 }
 [data-publier-docs-sidebar],
 aside[aria-label="Table of contents"] {
-	top: var(--publier-header-height, 4rem);
-	max-height: calc(100vh - var(--publier-header-height, 4rem));
+	top: var(--publier-header-height, var(--publier-nav-height, 4rem));
+	max-height: calc(100vh - var(--publier-header-height, var(--publier-nav-height, 4rem)));
 }
-body:has([data-publier-docs-header]) :is(h2, h3, h4)[id] {
-	scroll-margin-top: calc(var(--publier-header-height, 4rem) + 1rem);
+body:has([data-publier-docs-header]) :is(h1, h2, h3, h4, h5, h6)[id] {
+	scroll-margin-top: calc(var(--publier-header-height, var(--publier-nav-height, 4rem)) + 1rem);
 }
 
 /* Header controls remain stationary while the disclosure indicator changes. */

package/src/styles/expressive-code.css

@@ -12,12 +12,14 @@
  */
 
 .expressive-code {
+	--ec-brdRad: var(--publier-code-block-radius, 0.3rem);
+
 	/* Frame border — daisyUI base-300 plays the border role */
-	--ec-borderColor: var(--color-base-300);
+	--ec-brdCol: var(--color-base-300);
 
 	/* Tab bar background — subdued surface */
-	--ec-frm-tabBarBg: var(--color-base-300);
-	--ec-frm-tabBarBorderBottomColor: var(--color-base-300);
+	--ec-frm-edTabBarBg: var(--color-base-300);
+	--ec-frm-edTabBarBrdCol: var(--color-base-300);
 
 	/* Code area background — left to EC's own per-theme value.
 	 *
@@ -36,6 +38,6 @@
 	 * and binds it to `--font-sans` via the Fonts API). Customers can
 	 * still override at the theme level via `--publier-font-body` /
 	 * `--publier-font-mono`. */
-	--ec-codeFontFamily: var(--publier-font-mono, var(--font-mono));
-	--ec-uiFontFamily: var(--publier-font-body, var(--font-sans));
+	--ec-codeFontFml: var(--publier-font-mono, var(--font-mono));
+	--ec-uiFontFml: var(--publier-font-body, var(--font-sans));
 }

package/src/tailwind/preset.css

@@ -16,6 +16,8 @@
  * to Tailwind utilities via the `@theme` block.
  */
 
+@layer theme, base, components, utilities, publier-theme;
+
 @plugin "daisyui" {
 	themes: false;
 }