najm-kit 2.6.0 → 2.6.1

package/CHANGELOG.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## 2.6.1
+
+- Fixed the non-card `NPageHeader` bleed never taking effect. 2.6.0 cancelled the page padding with the Tailwind utilities `-mt-[var(--najm-section-gap,0px)]` and `-mx-[var(--najm-page-gutter,0px)]`, which only work if the consuming app's Tailwind build happens to emit those arbitrary classes — they exist nowhere but inside this package's bundle, so a consumer could load a stylesheet without them and the header stayed exactly where it was. The offsets are inline styles now and no longer depend on the consumer's CSS pipeline.
+
 ## 2.6.0
 
 - Added `NThemePresets`, and wired it into `NThemeCustomizer` through `presets`, `selectedPresetId`, `presetsStatus`, `savedDesign`, `onPresetSelect`, `onPresetSave`, `onPresetDelete`, and `presetLabels`. The picker renders only when a host supplies both `presets` and `onPresetSelect`. It is presentational: the host owns where presets live and what saving one means, and selecting a row hands the design back so it can be previewed before anything is stored. Each row draws a swatch strip from the design's own `sidebar`, `primary`, `secondary`, `accent`, and `background` tokens; the selected row's check sits left in the success colour and per-row delete sits right. Omit `onPresetSave` or `onPresetDelete` to hide those controls. Deleting is pointer-only — Radix owns roving focus inside the listbox.

package/dist/index.mjs

@@ -2450,7 +2450,12 @@ function NPageHeader({
   const breakpointClasses = responsiveClasses[mobileBreakpoint];
   const isCard = card ?? recipe?.card ?? bordered === true;
   const recipeRadius = resolveRadiusValue(recipe?.radius);
-  const recipeStyle = recipeRadius || recipe?.borderWidth ? {
+  const bleedStyle = isCard ? void 0 : {
+    marginTop: "calc(var(--najm-section-gap, 0px) * -1)",
+    marginInline: "calc(var(--najm-page-gutter, 0px) * -1)"
+  };
+  const recipeStyle = recipeRadius || recipe?.borderWidth || bleedStyle ? {
+    ...bleedStyle,
     ...recipeRadius ? { borderRadius: recipeRadius } : {},
     ...recipe?.borderWidth ? { borderWidth: recipe.borderWidth } : {}
   } : void 0;
@@ -2464,14 +2469,6 @@ function NPageHeader({
       className: cn(
         isCard ? cn("rounded-xl bg-card text-card-foreground shadow-none", surfaceBorderClasses(true)) : cn(
           "border-b bg-background text-foreground",
-          /**
-           * A non-card header is a full-bleed top bar, so it cancels the
-           * page padding NPageLayout published. Without this it floats
-           * below and inside that padding, and its bottom rule never meets
-           * the sidebar header's. The 0px fallbacks keep the header inert
-           * when it is used outside NPageLayout.
-           */
-          "-mt-[var(--najm-section-gap,0px)] -mx-[var(--najm-page-gutter,0px)]",
           surfaceBorderClasses(true, "bottom").replace("najm-border-b", "najm-border-b")
         ),
         className

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "najm-kit",
-  "version": "2.6.0",
+  "version": "2.6.1",
   "license": "MIT",
   "type": "module",
   "description": "Reusable React UI component package for Najm framework",