baseline-kit 5.0.0 → 5.2.0

package/dist/baseline-kit.css

@@ -2,7 +2,7 @@
 /* This file contains component styles and theme variables */
 
 /* Component Styles */
-:root{--bk-base:8px;--bk-zi:1;--bk-zio:2;--bk-transition-base:.18s ease;--bk-width-default:fit-content;--bk-height-default:fit-content;--bk-wf:100%;--bk-hf:100%;--bkbx-b:var(--bk-base);--bkbx-w:var(--bk-width-default);--bkbx-h:var(--bk-height-default);--bkbx-cl:var(--bk-box-color-line-theme,#a329a399);--bkbx-cf:var(--bk-box-color-flat-theme,#96f3);--bkbx-ct:var(--bk-box-color-text-theme,#a329a3e6);--bkbl-w:100%;--bkbl-h:100%;--bkbl-rt:0;--bkbl-rh:1px;--bkbl-cl:var(--bk-baseline-color-line-theme,#2929a326);--bkbl-cf:var(--bk-baseline-color-flat-theme,#667fff33);--bkgd-w:100vw;--bkgd-h:100vh;--bkgd-g:var(--bk-base);--bkgd-j:center;--bkgd-t:auto;--bkgd-pb:0;--bkgd-pi:0;--bkgd-cl:var(--bk-guide-color-line-theme,#2929a326);--bkgd-cp:var(--bk-guide-color-pattern-theme,#667fff33);--bkgd-ca:var(--bk-guide-color-auto-theme,#66ccff26);--bkgd-cf:var(--bk-guide-color-fixed-theme,#66ccff26);--bkpd-w:var(--bk-width-default);--bkpd-h:var(--bk-height-default);--bkpd-c:var(--bk-padder-color-theme,#6629a399);--bksp-w:var(--bk-wf);--bksp-h:var(--bk-hf);--bksp-cl:var(--bk-spacer-color-line-theme,#6629a399);--bksp-cf:var(--bk-spacer-color-flat-theme,#667fff33);--bksp-ct:var(--bk-spacer-color-text-theme,#6629a3)}.bas_4Emvv{pointer-events:none;width:var(--bkbl-w);height:var(--bkbl-h);contain:layout style paint;position:absolute;inset:0;overflow:hidden}.v_lNfeX{opacity:1;visibility:visible;transition:opacity var(--bk-transition-base), visibility 0s linear}.h_PbNDU{opacity:0;visibility:hidden;transition:opacity var(--bk-transition-base), visibility 0s linear .18s}.row_J1Wva{left:0;right:0;top:var(--bkbl-rt);height:var(--bkbl-rh);background-color:var(--bkbl-c);position:absolute}.ssr_PQAP-{box-sizing:border-box;z-index:1;pointer-events:none;display:grid;position:relative}.gde_4PKz3{box-sizing:border-box;width:var(--bkgd-w,100%);height:var(--bkgd-h,100%);max-width:var(--bkgd-mw,none);pointer-events:none;padding:var(--bkgd-pb,0) var(--bkgd-pi,0);margin-inline:auto;position:absolute;inset:0}.v_yAvN0{opacity:1;visibility:visible;transition:opacity var(--bk-transition-base), visibility 0s linear}.h_XcWcy{opacity:0;visibility:hidden;transition:opacity var(--bk-transition-base), visibility 0s linear .18s}.line_UaLjW{left:-.5px}.cols_ibtT4{column-gap:var(--bkgd-g);grid-template-rows:1fr;grid-template-columns:var(--bkgd-t);justify-content:var(--bkgd-j);width:var(--bk-wf);height:var(--bk-hf);contain:layout style paint;display:grid;position:absolute;inset:0;overflow:hidden}.col_QPSDI{min-width:0;width:var(--bk-wf);height:var(--bk-hf)}.col_QPSDI[data-variant=line]{background-color:var(--bkgd-cl);width:1px}.cols_ibtT4[data-variant=line]{background-image:repeating-linear-gradient(to right, var(--bkgd-line-color,var(--bkgd-cl)) 0 1px, transparent 1px var(--bkgd-line-period,1px));display:block}.col_QPSDI[data-variant=pattern]{background-color:var(--bkgd-cp)}.col_QPSDI[data-variant=auto]{background-color:var(--bkgd-ca);overflow:hidden}.col_QPSDI[data-variant=fixed]{background-color:var(--bkgd-cf)}.ssr_4UN4k{box-sizing:border-box;z-index:1;pointer-events:none;min-height:100px;display:grid;position:relative}.spr_syfhf{box-sizing:border-box;width:var(--bksp-w,100%);height:var(--bksp-h,auto);flex-shrink:0;margin:0;padding:0;display:block;position:relative}.line_nzGsp:after{content:"";border:1px solid var(--bksp-cl,#6629a399);z-index:calc(var(--bk-zi,1));position:absolute;inset:0}.flat_XJWHt{background-color:var(--bksp-cf,#667fff33)}.pad_NizuS{width:var(--bkpd-w,auto);height:var(--bkpd-h,auto);grid-template-rows:auto 1fr auto;grid-template-columns:auto 1fr auto;display:grid;position:relative}.lay_ZdQLz .line_7S7iI:after,.stk_X79YA .line_7S7iI:after{border:none}.v_dowAz:after{content:"";border:1px solid var(--bkpd-c,var(--bk-padder-color-theme));pointer-events:none;z-index:var(--bk-zi);position:absolute;inset:0}.box_sPqFs{width:var(--bkbx-w);height:var(--bkbx-h);position:relative}.v_ZrZ5j:after{content:"";border:1px solid var(--bkbx-cl);pointer-events:none;z-index:var(--bk-zi);position:absolute;inset:0}
+:root{--bk-base:8px;--bk-zi:1;--bk-zio:2;--bk-transition-base:.18s ease;--bk-width-default:fit-content;--bk-height-default:fit-content;--bk-wf:100%;--bk-hf:100%;--bkbx-b:var(--bk-base);--bkbx-w:var(--bk-width-default);--bkbx-h:var(--bk-height-default);--bkbx-cl:var(--bk-box-color-line-theme,#a329a399);--bkbx-cf:var(--bk-box-color-flat-theme,#96f3);--bkbx-ct:var(--bk-box-color-text-theme,#a329a3e6);--bkbl-w:100%;--bkbl-h:100%;--bkbl-rt:0;--bkbl-rh:1px;--bkbl-cl:var(--bk-baseline-color-line-theme,#2929a326);--bkbl-cf:var(--bk-baseline-color-flat-theme,#667fff33);--bkgd-w:100vw;--bkgd-h:100vh;--bkgd-g:var(--bk-base);--bkgd-j:center;--bkgd-t:auto;--bkgd-pb:0;--bkgd-pi:0;--bkgd-cl:var(--bk-guide-color-line-theme,#2929a326);--bkgd-cp:var(--bk-guide-color-pattern-theme,#667fff33);--bkgd-ca:var(--bk-guide-color-auto-theme,#66ccff26);--bkgd-cf:var(--bk-guide-color-fixed-theme,#66ccff26);--bkpd-w:var(--bk-width-default);--bkpd-h:var(--bk-height-default);--bkpd-c:var(--bk-padder-color-theme,#6629a399);--bksp-w:var(--bk-wf);--bksp-h:var(--bk-hf);--bksp-cl:var(--bk-spacer-color-line-theme,#6629a399);--bksp-cf:var(--bk-spacer-color-flat-theme,#667fff33);--bksp-ct:var(--bk-spacer-color-text-theme,#6629a3)}.bas_4Emvv{pointer-events:none;width:var(--bkbl-w);height:var(--bkbl-h);contain:layout style paint;position:absolute;inset:0;overflow:hidden}.v_lNfeX{opacity:1;visibility:visible;transition:opacity var(--bk-transition-base), visibility 0s linear}.h_PbNDU{opacity:0;visibility:hidden;transition:opacity var(--bk-transition-base), visibility 0s linear .18s}.row_J1Wva{left:0;right:0;top:var(--bkbl-rt);height:var(--bkbl-rh);background-color:var(--bkbl-c);position:absolute}.ssr_PQAP-{box-sizing:border-box;z-index:1;pointer-events:none}.gde_4PKz3{box-sizing:border-box;width:var(--bkgd-w,100%);height:var(--bkgd-h,100%);max-width:var(--bkgd-mw,none);pointer-events:none;padding:var(--bkgd-pb,0) var(--bkgd-pi,0);margin-inline:auto;position:absolute;inset:0}.v_yAvN0{opacity:1;visibility:visible;transition:opacity var(--bk-transition-base), visibility 0s linear}.h_XcWcy{opacity:0;visibility:hidden;transition:opacity var(--bk-transition-base), visibility 0s linear .18s}.line_UaLjW{left:-.5px}.cols_ibtT4{column-gap:var(--bkgd-g);grid-template-rows:1fr;grid-template-columns:var(--bkgd-t);justify-content:var(--bkgd-j);width:var(--bk-wf);height:var(--bk-hf);contain:layout style paint;display:grid;position:absolute;inset:0;overflow:hidden}.col_QPSDI{min-width:0;width:var(--bk-wf);height:var(--bk-hf)}.col_QPSDI[data-variant=line]{background-color:var(--bkgd-cl);width:1px}.cols_ibtT4[data-variant=line]{background-image:repeating-linear-gradient(to right, var(--bkgd-line-color,var(--bkgd-cl)) 0 1px, transparent 1px var(--bkgd-line-period,1px));display:block}.col_QPSDI[data-variant=pattern]{background-color:var(--bkgd-cp)}.col_QPSDI[data-variant=auto]{background-color:var(--bkgd-ca);overflow:hidden}.col_QPSDI[data-variant=fixed]{background-color:var(--bkgd-cf)}.ssr_4UN4k{box-sizing:border-box;z-index:1;pointer-events:none}.spr_syfhf{box-sizing:border-box;width:var(--bksp-w,100%);height:var(--bksp-h,auto);flex-shrink:0;margin:0;padding:0;display:block;position:relative}.line_nzGsp:after{content:"";border:1px solid var(--bksp-cl,#6629a399);z-index:calc(var(--bk-zi,1));position:absolute;inset:0}.flat_XJWHt{background-color:var(--bksp-cf,#667fff33)}.indicator_inw1x{color:var(--bksp-ct,#6629a3)}.pad_NizuS{width:var(--bkpd-w,auto);height:var(--bkpd-h,auto);text-box-trim:trim-both;text-box-edge:ex alphabetic;grid-template-rows:auto 1fr auto;grid-template-columns:auto 1fr auto;display:grid;position:relative}.content_xFX0U{text-box-trim:trim-both;text-box-edge:ex alphabetic}.v_dowAz:after{content:"";border:1px solid var(--bkpd-c,var(--bk-padder-color-theme));pointer-events:none;z-index:var(--bk-zi);position:absolute;inset:0}.box_sPqFs{width:var(--bkbx-w);height:var(--bkbx-h);text-box-trim:trim-both;text-box-edge:ex alphabetic;position:relative}.v_ZrZ5j:after{content:"";border:1px solid var(--bkbx-cl);pointer-events:none;z-index:var(--bk-zi);position:absolute;inset:0}
 
 
 /* Theme */
@@ -121,7 +121,10 @@
     --bk-box-color-text-theme: hsla(var(--bk-color-pink-primary), 0.9);
 
     --bk-guide-color-line-theme: hsla(var(--bk-color-white-primary), 0.1);
-    --bk-guide-color-pattern-theme: hsla(var(--bk-color-purple-secondary), 0.25);
+    --bk-guide-color-pattern-theme: hsla(
+      var(--bk-color-purple-secondary),
+      0.25
+    );
     --bk-guide-color-auto-theme: hsla(var(--bk-color-blue-secondary), 0.2);
     --bk-guide-color-fixed-theme: hsla(var(--bk-color-blue-secondary), 0.2);
 

package/dist/core.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./src-CMjyHjX5.cjs`);exports.ABSOLUTE_UNIT_CONVERSIONS=e.b,exports.DEFAULT_CONFIG=e.k,exports.GRID_ALIGNMENTS=e.T,exports.PADD_VARIANTS=e.E,exports.RELATIVE_UNITS=e.x,exports.calculateGuideTemplate=e.s,exports.calculateRowCount=e.v,exports.calculateSnappedSpacing=e.m,exports.clamp=e.y,exports.convertValue=e.S,exports.createBaselineDescriptor=e.i,exports.createBoxDescriptor=e.r,exports.createCSSVariables=e.D,exports.createGridSpanStyles=e.c,exports.createGuideConfig=e.a,exports.createGuideDescriptor=e.o,exports.createPadderDescriptor=e.t,exports.createSpacerDescriptor=e.n,exports.createStyleOverride=e.d,exports.cx=e.f,exports.formatValue=e.C,exports.isValidGuideColumnValue=e.l,exports.isValidGuidePattern=e.u,exports.mergeConfig=e.O,exports.normalizeValue=e.g,exports.normalizeValuePair=e._,exports.parsePadding=e.h,exports.parseUnit=e.w,exports.resolveDebugState=e.p;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./src-R5usYJol.cjs");exports.ABSOLUTE_UNIT_CONVERSIONS=e.b,exports.DEFAULT_CONFIG=e.k,exports.GRID_ALIGNMENTS=e.T,exports.PADD_VARIANTS=e.E,exports.RELATIVE_UNITS=e.x,exports.calculateGuideTemplate=e.s,exports.calculateRowCount=e.v,exports.calculateSnappedSpacing=e.m,exports.clamp=e.y,exports.convertValue=e.S,exports.createBaselineDescriptor=e.i,exports.createBoxDescriptor=e.r,exports.createCSSVariables=e.D,exports.createGridSpanStyles=e.c,exports.createGuideConfig=e.a,exports.createGuideDescriptor=e.o,exports.createPadderDescriptor=e.t,exports.createSpacerDescriptor=e.n,exports.createStyleOverride=e.d,exports.cx=e.f,exports.formatValue=e.C,exports.isValidGuideColumnValue=e.l,exports.isValidGuidePattern=e.u,exports.mergeConfig=e.O,exports.normalizeValue=e.g,exports.normalizeValuePair=e._,exports.parsePadding=e.h,exports.parseUnit=e.w,exports.resolveDebugState=e.p;

package/dist/core.d.ts

@@ -33,6 +33,7 @@ type PaddedVariant = (typeof PADD_VARIANTS)[number];
 type Variant = 'line' | 'flat' | 'pattern';
 type BaselineVariant = Exclude<Variant, 'pattern'>;
 type SnappingMode = 'none' | 'height' | 'clamp';
+type SnapEdge = 'top' | 'bottom';
 type DebuggingMode = 'none' | 'hidden' | 'visible';
 type BaseGuideConfig = {
     gap?: number | string;
@@ -94,15 +95,22 @@ type ConfigSchema = {
 
 declare const DEFAULT_CONFIG: ConfigSchema;
 
-type MergeConfigParams = {
-    parentConfig: ConfigSchema;
+type PartialColors<T> = T extends {
+    colors: infer Colors;
+} ? Omit<Partial<T>, 'colors'> & {
+    colors?: Partial<Colors>;
+} : Partial<T>;
+type ConfigOverrides = {
     base?: number;
-    baseline?: Partial<ConfigSchema['baseline']>;
-    guide?: Partial<ConfigSchema['guide']>;
-    spacer?: Partial<ConfigSchema['spacer']>;
-    box?: Partial<ConfigSchema['box']>;
+    baseline?: PartialColors<ConfigSchema['baseline']>;
+    guide?: PartialColors<ConfigSchema['guide']>;
+    spacer?: PartialColors<ConfigSchema['spacer']>;
+    box?: PartialColors<ConfigSchema['box']>;
     padder?: Partial<ConfigSchema['padder']>;
 };
+type MergeConfigParams = ConfigOverrides & {
+    parentConfig: ConfigSchema;
+};
 declare const mergeConfig: (params: MergeConfigParams) => ConfigSchema;
 type CSSVariablesParams = {
     base: number;
@@ -151,11 +159,19 @@ interface NormalizationOptions {
     context?: ConversionContext;
 }
 declare function normalizeValue(value: string | number | undefined, options?: NormalizationOptions): number;
-declare function normalizeValuePair(values: [string | number | undefined, string | number | undefined] | undefined, defaults: [number, number], options?: NormalizationOptions): [number, number];
+declare function normalizeValuePair(values: [
+    string | number | undefined,
+    string | number | undefined
+] | undefined, defaults: [number, number], options?: NormalizationOptions): [number, number];
 
 declare function parsePadding(spacing: SpacingProps): Padding;
 
-declare function calculateSnappedSpacing(height: number, base: number, initial: PaddingValue, snapping: SnappingMode): Padding;
+type SnappingOptions = {
+    mode: SnappingMode;
+    snapEdge?: SnapEdge;
+};
+type SnappingInput = SnappingMode | SnappingOptions;
+declare function calculateSnappedSpacing(height: number, base: number, initial: PaddingValue, snappingInput: SnappingInput): Padding;
 
 /**
  * Combines class names, filtering out falsy values.
@@ -341,4 +357,4 @@ interface PadderDescriptor {
 declare function createPadderDescriptor(params: PadderDescriptorParams): PadderDescriptor;
 
 export { ABSOLUTE_UNIT_CONVERSIONS, DEFAULT_CONFIG, GRID_ALIGNMENTS, PADD_VARIANTS, RELATIVE_UNITS, calculateGuideTemplate, calculateRowCount, calculateSnappedSpacing, clamp, convertValue, createBaselineDescriptor, createBoxDescriptor, createCSSVariables, createGridSpanStyles, createGuideConfig, createGuideDescriptor, createPadderDescriptor, createSpacerDescriptor, createStyleOverride, cx, formatValue, isValidGuideColumnValue, isValidGuidePattern, mergeConfig, normalizeValue, normalizeValuePair, parsePadding, parseUnit, resolveDebugState };
-export type { AutoConfig, BaselineDescriptor, BaselineDescriptorParams, BaselineVariant, BoxDescriptor, BoxDescriptorParams, ConfigSchema, ConversionContext, DebugState, DebuggingMode, FixedConfig, GridAlignment, GuideColumnValue, GuideColumnsPattern, GuideConfig, GuideConfigParams, GuideDescriptor, GuideDescriptorParams, GuideResult, GuideVariant, LineConfig, NormalizationOptions, PaddedVariant, PadderDescriptor, PadderDescriptorParams, Padding, PaddingValue, PatternConfig, SnappingMode, SpacerDescriptor, SpacerDescriptorParams, Spacing, SpacingProps, StyleOverrideParams, Variant };
+export type { AutoConfig, BaselineDescriptor, BaselineDescriptorParams, BaselineVariant, BoxDescriptor, BoxDescriptorParams, ConfigOverrides, ConfigSchema, ConversionContext, DebugState, DebuggingMode, FixedConfig, GridAlignment, GuideColumnValue, GuideColumnsPattern, GuideConfig, GuideConfigParams, GuideDescriptor, GuideDescriptorParams, GuideResult, GuideVariant, LineConfig, NormalizationOptions, PaddedVariant, PadderDescriptor, PadderDescriptorParams, Padding, PaddingValue, PatternConfig, SnapEdge, SnappingMode, SnappingOptions, SpacerDescriptor, SpacerDescriptorParams, Spacing, SpacingProps, StyleOverrideParams, Variant };

package/dist/core.mjs

@@ -1,2 +1,2 @@
-import { C as e, D as t, E as n, O as r, S as i, T as a, _ as o, a as s, b as c, c as l, d as u, f as d, g as f, h as p, i as m, k as h, l as g, m as _, n as v, o as y, p as b, r as x, s as S, t as C, u as w, v as T, w as E, x as D, y as O } from "./src-QHaSfgVe.js";
+import { C as e, D as t, E as n, O as r, S as i, T as a, _ as o, a as s, b as c, c as l, d as u, f as d, g as f, h as p, i as m, k as h, l as g, m as _, n as v, o as y, p as b, r as x, s as S, t as C, u as w, v as T, w as E, x as D, y as O } from "./src-D0nL1BwZ.js";
 export { c as ABSOLUTE_UNIT_CONVERSIONS, h as DEFAULT_CONFIG, a as GRID_ALIGNMENTS, n as PADD_VARIANTS, D as RELATIVE_UNITS, S as calculateGuideTemplate, T as calculateRowCount, _ as calculateSnappedSpacing, O as clamp, i as convertValue, m as createBaselineDescriptor, x as createBoxDescriptor, t as createCSSVariables, l as createGridSpanStyles, s as createGuideConfig, y as createGuideDescriptor, C as createPadderDescriptor, v as createSpacerDescriptor, u as createStyleOverride, d as cx, e as formatValue, g as isValidGuideColumnValue, w as isValidGuidePattern, r as mergeConfig, f as normalizeValue, o as normalizeValuePair, p as parsePadding, E as parseUnit, b as resolveDebugState };

package/dist/guide.cjs

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let c=require(`react`);c=s(c,1);let l=require(`react/jsx-runtime`);var u={base:8,baseline:{variant:`line`,debugging:`hidden`,colors:{line:`var(--bk-baseline-color-line-theme)`,flat:`var(--bk-baseline-color-flat-theme)`}},guide:{variant:`line`,debugging:`hidden`,colors:{line:`var(--bk-guide-color-line-theme)`,pattern:`var(--bk-guide-color-pattern-theme)`,auto:`var(--bk-guide-color-auto-theme)`,fixed:`var(--bk-guide-color-fixed-theme)`}},spacer:{variant:`line`,debugging:`hidden`,colors:{line:`var(--bk-spacer-color-line-theme)`,flat:`var(--bk-spacer-color-flat-theme)`,text:`var(--bk-spacer-color-text-theme)`}},box:{debugging:`hidden`,colors:{line:`var(--bk-box-color-line-theme)`,flat:`var(--bk-box-color-flat-theme)`,text:`var(--bk-box-color-text-theme)`}},padder:{debugging:`hidden`,color:`var(--bk-padder-color-theme)`}},d=[`baseline`,`guide`,`spacer`,`box`,`padder`],f=e=>{let{parentConfig:t,base:n}=e,r={};for(let n of d)r[n]={...t[n],...e[n]};return{base:n??t.base,...r}},p=e=>{let{base:t,baseline:n,guide:r,spacer:i,box:a,padder:o}=e;return{"--bk-base":`${t}px`,"--bkbl-cl":n.colors.line,"--bkbl-cf":n.colors.flat,"--bkgd-cl":r.colors.line,"--bkgd-cp":r.colors.pattern,"--bkgd-ca":r.colors.auto,"--bkgd-cf":r.colors.fixed,"--bksp-cl":i.colors.line,"--bksp-cf":i.colors.flat,"--bksp-ct":i.colors.text,"--bkbx-cl":a.colors.line,"--bkbx-cf":a.colors.flat,"--bkbx-ct":a.colors.text,"--bkpd-c":o.color}},m=c.createContext(u);m.displayName=`ConfigContext`;var h=()=>c.use(m);function g({children:e,base:t,baseline:n,guide:r,spacer:i,box:a,padder:o}){let s=h();return(0,l.jsx)(m,{value:c.useMemo(()=>f({parentConfig:s,base:t,baseline:n,guide:r,spacer:i,box:a,padder:o}),[s,t,n,r,i,a,o]),children:e})}function _(e){let t=e.trim().match(/^([+-]?[\d.]+)([a-zA-Z%]+)$/);return t?{value:parseFloat(t[1]),unit:t[2]}:null}function v(e,t){return e===void 0&&t!==void 0?`${t}px`:e===`auto`||typeof e==`string`&&/^(auto|100%|0|.*(fr|vh|vw|vmin|vmax|rem))$/.test(e)?String(e):typeof e==`number`?`${e}px`:e??``}var y={parentSize:0,viewportWidth:1920,viewportHeight:1080,rootFontSize:16,parentFontSize:16},b={px:1,in:96,cm:37.8,mm:3.78,pt:1.33,pc:16},x={em:e=>e.parentFontSize,rem:e=>e.rootFontSize,vh:e=>e.viewportHeight/100,vw:e=>e.viewportWidth/100,vmin:e=>Math.min(e.viewportWidth,e.viewportHeight)/100,vmax:e=>Math.max(e.viewportWidth,e.viewportHeight)/100,"%":e=>e.parentSize/100};function S(e,t){if(typeof e==`number`)return e;if(typeof e!=`string`)return null;let n=_(e);if(!n)return null;let{value:r,unit:i}=n;if(i in b)return r*b[i];if(i===`auto`)return null;let a=x[i];return a?r*a({...y,...t}):null}function C(e,t,n){return Math.min(Math.max(e,t),n)}function w(e,t={}){let{base:n=8,round:r=!0,clamp:i,context:a}=t;if(e===`auto`)return n;let o=null;if(typeof e==`number`?o=e:typeof e==`string`&&(o=S(e,a)??n),o===null&&(o=n),n<=0)return o;let s=r?Math.round(o/n)*n:o;return i===void 0?s:C(s,i.min??-1/0,i.max??1/0)}var T=(...e)=>e.filter(Boolean).join(` `).trim();function E(e,t){let n=e??t;return{isShown:n===`visible`,isHidden:n===`hidden`,isNone:n===`none`,debugging:n}}function D(e,t,n){let r=typeof e==`string`?e:e.key,i=typeof e==`string`?t:e.value,a=typeof e==`string`?n:e.defaultStyles,o=typeof e==`object`?e.skipDimensions:void 0;return o&&(o.fitContent?.includes(r)&&i===`fit-content`||o.auto?.includes(r)&&i===`auto`||o.fullSize?.includes(r)&&(i===`100%`||i===`100vh`||i===`100vw`))||i===a[r]?{}:{[r]:i}}var O=/^\d*\.?\d+(?:fr|px|%|em|rem|vh|vw|vmin|vmax|pt|pc|in|cm|mm)$/,k=e=>typeof e==`number`?Number.isFinite(e)&&e>=0:typeof e==`string`?e===`auto`||e===`100%`||O.test(e):!1,A=e=>Array.isArray(e)&&e.length>0&&e.every(k),j={template:`none`,columnsCount:0,calculatedGap:0,isValid:!1};function M(e,t,n){let r=t.variant??`line`,i=t.base??8,a=w(t.gap??0,{base:i,context:n});if(!e)return j;switch(r){case`line`:{let t=a===0?0:a-1,n=t+1,r=t===0?Math.max(1,Math.floor(e)+1):Math.max(1,Math.floor((e+1)/n)+1);return{template:`repeat(${r}, 1px)`,columnsCount:r,calculatedGap:a>0?a-1:a,isValid:!0}}case`pattern`:{if(!t.columns||!Array.isArray(t.columns)||!A(t.columns))return j;let e=t.columns.map(e=>typeof e==`number`?`${e}px`:e);return e.some(e=>e===`0`||e===`0px`)?j:{template:e.join(` `),columnsCount:e.length,calculatedGap:a,isValid:!0}}case`fixed`:{let e=typeof t.columns==`number`?t.columns:0;return e<1?j:{template:`repeat(${e}, ${t.columnWidth?v(t.columnWidth):`1fr`})`,columnsCount:e,calculatedGap:a,isValid:!0}}case`auto`:{let r=t.columnWidth??`auto`;if(r===`auto`)return{template:`repeat(auto-fill, minmax(0, 1fr))`,columnsCount:1,calculatedGap:a,isValid:!0};let i=typeof r==`number`?`${r}px`:r.toString(),o=S(i,n)??0,s=o>0?Math.max(1,Math.floor((e+a)/(o+a))):1;return{template:`repeat(auto-fill, ${i})`,columnsCount:s,calculatedGap:a,isValid:!0}}default:{let t=Math.max(1,Math.floor(e/(a+1))+1);return{template:`repeat(${t}, 1px)`,columnsCount:t,calculatedGap:a,isValid:!0}}}}function N({variant:e,base:t,gap:n,columns:r,columnWidth:i}){switch(e){case`line`:return{variant:`line`,gap:n,base:t};case`pattern`:if(r&&Array.isArray(r))return{variant:`pattern`,columns:r,gap:n,base:t};break;case`fixed`:if(r!==void 0){let e=typeof r==`number`?r:parseInt(String(r),10);return{variant:`fixed`,columns:isNaN(e)?12:e,columnWidth:i||`60px`,gap:n,base:t}}break}return{variant:`auto`,columnWidth:i||`1fr`,gap:n,base:t}}var P=(e,t)=>({"--bkgd-w":`100%`,"--bkgd-h":`100%`,"--bkgd-mw":`none`,"--bkgd-cw":`60px`,"--bkgd-gw":`24px`,"--bkgd-n":`12`,"--bkgd-b":`${e}px`,"--bkgd-cl":t,"--bkgd-g":`0`});function F(e){let{base:t,colors:n,variant:r,align:i,width:a,height:o,columnWidth:s,maxWidth:c,color:l,template:u,columnsCount:d,calculatedGap:f,isVisible:p}=e,m=P(t,n.line),h=[`--bkgd-w`,`--bkgd-h`],g=v(a??`100%`),_=v(o??`100%`),y={...D({key:`--bkgd-w`,value:g,defaultStyles:m,skipDimensions:{fullSize:h}}),...D({key:`--bkgd-h`,value:_,defaultStyles:m,skipDimensions:{fullSize:h}}),...D({key:`--bkgd-mw`,value:v(c||`none`),defaultStyles:m}),...D({key:`--bkgd-cw`,value:v(s||`60px`),defaultStyles:m}),...D({key:`--bkgd-n`,value:`${d}`,defaultStyles:m}),...D({key:`--bkgd-b`,value:`0`,defaultStyles:m}),...D({key:`--bkgd-cl`,value:l??n.line,defaultStyles:m}),...D({key:`--bkgd-g`,value:`${f}px`,defaultStyles:m}),...D({key:`--bkgd-j`,value:i||`center`,defaultStyles:m}),...u&&u!==`none`?{"--bkgd-t":u}:{}},b=(r&&r in n?n[r]:void 0)??n.line,x=r===`line`,S=[`gde`,p?`v`:`h`];return x&&S.push(`line`),x&&(y[`--bkgd-line-color`]=l??n.line,y[`--bkgd-line-period`]=`${f+1}px`),{containerStyle:y,columnColor:b,columnsCount:d,calculatedGap:f,template:u,isVisible:p,isLineVariant:x,classTokens:S}}function I(e){let t=h();return(0,c.useMemo)(()=>Object.assign({base:t.base},t[e]),[t,e])}function L(e,t){return(0,c.useMemo)(()=>E(e,t),[e,t])}var R=e=>{let t=null,n=null;return[(...r)=>{n=r,t!==null&&cancelAnimationFrame(t),t=requestAnimationFrame(()=>{e(...n),t=null,n=null})},()=>{t!==null&&(cancelAnimationFrame(t),t=null,n=null)}]};function z(e,t){let n={width:0,height:0},r=()=>{try{let r=e.getBoundingClientRect(),i={width:Math.round(r.width),height:Math.round(r.height)};(i.width!==n.width||i.height!==n.height)&&(n=i,t(i))}catch{}},[i,a]=R(r);r();let o=new ResizeObserver(i);return o.observe(e),{refresh:i,disconnect(){o.disconnect(),a()}}}var B={width:0,height:0};function V(e){let[t,n]=c.useState(B),r=c.useRef(null);c.useLayoutEffect(()=>{if(typeof window>`u`||!e.current)return;let t=z(e.current,e=>{n(t=>t.width===e.width&&t.height===e.height?t:e)});return r.current=t,()=>{t.disconnect(),r.current=null}},[e]);let i=c.useCallback(()=>{r.current?.refresh()},[]);return{...t,refresh:i}}function H(){return typeof window>`u`?{}:{viewportWidth:window.innerWidth,viewportHeight:window.innerHeight}}function U(e,t){let{width:n}=V(e);return c.useMemo(()=>M(n,t,H()),[t,n])}function W(){let[e,t]=(0,c.useState)(!1);return(0,c.useEffect)(()=>{t(!0)},[]),e}function G({children:e,fallback:t=null}){return W()?(0,l.jsx)(l.Fragment,{children:e}):(0,l.jsx)(l.Fragment,{children:t})}function K(...e){return Object.assign({},...e.filter(Boolean))}var q={gde:`gde_4PKz3`,v:`v_yAvN0`,h:`h_XcWcy`,line:`line_UaLjW`,cols:`cols_ibtT4`,col:`col_QPSDI`,ssr:`ssr_4UN4k`},J=c.memo(function({className:e,debugging:t,style:n,variant:r,align:i=`center`,gap:a,height:o,width:s,columns:c,columnWidth:u,maxWidth:d,color:f,children:p,ssrMode:m=!1,...h}){let g=I(`guide`),_=r??g.variant,v=typeof a==`number`?a:0,{isShown:y}=L(t,g.debugging);if(!y)return(0,l.jsx)(`div`,{className:T(q.gde,q.h,e),style:n,"data-testid":`guide`,"data-variant":_,"aria-hidden":`true`,...h,children:p});let b=(0,l.jsx)(`div`,{className:T(q.gde,q.h,q.ssr,e),style:{width:s??`100%`,height:o??`100%`,maxWidth:d??`none`,...n},"data-testid":`guide`,"data-variant":_,"aria-hidden":`true`,children:p});return m?b:(0,l.jsx)(G,{fallback:b,children:(0,l.jsx)(Y,{className:e,debugging:t,style:n,variant:_,align:i,gap:v,height:o,width:s,columns:c,columnWidth:u,maxWidth:d,color:f,...h,children:p})})}),Y=c.memo(function({className:e,debugging:t,style:n,variant:r,align:i=`center`,gap:a,height:o,width:s,columns:u,columnWidth:d,maxWidth:f,color:p,children:m,...h}){let g=I(`guide`),{isShown:_}=L(t,g.debugging),v=c.useRef(null);V(v);let y=r??g.variant,b=typeof a==`number`?a:0,{template:x,columnsCount:S,calculatedGap:C}=U(v,c.useMemo(()=>N({variant:y,base:g.base,gap:b,columns:u,columnWidth:d}),[y,g.base,b,u,d])),w=c.useMemo(()=>F({base:g.base,colors:g.colors,variant:y,align:i||`center`,width:s,height:o,columnWidth:d,maxWidth:f,color:p,template:x,columnsCount:S,calculatedGap:C,isVisible:_}),[g.base,g.colors,y,i,s,o,d,f,p,x,S,C,_]),E=c.useMemo(()=>K(w.containerStyle,n),[w.containerStyle,n]);return(0,l.jsxs)(`div`,{ref:v,"data-testid":`guide`,"aria-hidden":`true`,className:T(...w.classTokens.map(e=>q[e]),e),"data-variant":r,style:E,...h,children:[_&&(0,l.jsx)(`div`,{className:q.cols,"data-variant":r,children:!w.isLineVariant&&Array.from({length:w.columnsCount},(e,t)=>(0,l.jsx)(`div`,{className:q.col,"data-column-index":t,"data-variant":r,style:{backgroundColor:w.columnColor}},t))}),m]})});exports.Config=g,exports.Guide=J,exports.createCSSVariables=p,exports.mergeConfig=f;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,s)=>(s=n==null?{}:e(i(n)),o(r||!n||!n.__esModule||!a.call(n,`default`)?t(s,`default`,{value:n,enumerable:!0}):s,n));let c=require("react");c=s(c,1);let l=require("react/jsx-runtime");var u={base:8,baseline:{variant:`line`,debugging:`hidden`,colors:{line:`var(--bk-baseline-color-line-theme, hsla(240, 60%, 40%, 0.15))`,flat:`var(--bk-baseline-color-flat-theme, hsla(230, 100%, 70%, 0.2))`}},guide:{variant:`line`,debugging:`hidden`,colors:{line:`var(--bk-guide-color-line-theme, hsla(240, 60%, 40%, 0.15))`,pattern:`var(--bk-guide-color-pattern-theme, hsla(230, 100%, 70%, 0.2))`,auto:`var(--bk-guide-color-auto-theme, hsla(200, 100%, 70%, 0.15))`,fixed:`var(--bk-guide-color-fixed-theme, hsla(200, 100%, 70%, 0.15))`}},spacer:{variant:`line`,debugging:`hidden`,colors:{line:`var(--bk-spacer-color-line-theme, hsla(270, 60%, 40%, 0.6))`,flat:`var(--bk-spacer-color-flat-theme, hsla(230, 100%, 70%, 0.2))`,text:`var(--bk-spacer-color-text-theme, hsla(270, 60%, 40%, 1))`}},box:{debugging:`hidden`,colors:{line:`var(--bk-box-color-line-theme, hsla(300, 60%, 40%, 0.6))`,flat:`var(--bk-box-color-flat-theme, hsla(260, 100%, 70%, 0.2))`,text:`var(--bk-box-color-text-theme, hsla(300, 60%, 40%, 0.9))`}},padder:{debugging:`hidden`,color:`var(--bk-padder-color-theme, hsla(270, 60%, 40%, 0.6))`}},d=[`baseline`,`guide`,`spacer`,`box`,`padder`],f=e=>{let{parentConfig:t,base:n}=e,r={};for(let n of d){let i=e[n],a=t[n],o={...a,...i};i&&`colors`in i&&i.colors&&`colors`in a&&(o.colors={...a.colors,...i.colors}),r[n]=o}return{base:n??t.base,...r}},p=e=>{let{base:t,baseline:n,guide:r,spacer:i,box:a,padder:o}=e;return{"--bk-base":`${t}px`,"--bkbl-cl":n.colors.line,"--bkbl-cf":n.colors.flat,"--bkgd-cl":r.colors.line,"--bkgd-cp":r.colors.pattern,"--bkgd-ca":r.colors.auto,"--bkgd-cf":r.colors.fixed,"--bksp-cl":i.colors.line,"--bksp-cf":i.colors.flat,"--bksp-ct":i.colors.text,"--bkbx-cl":a.colors.line,"--bkbx-cf":a.colors.flat,"--bkbx-ct":a.colors.text,"--bkpd-c":o.color}},m=`__baseline_kit_config_context__`,h=globalThis,g=h[m]??(h[m]=c.createContext(u));g.displayName=`ConfigContext`;var _=()=>c.use(g);function v({children:e,base:t,baseline:n,guide:r,spacer:i,box:a,padder:o}){let s=_(),u=c.useMemo(()=>f({parentConfig:s,base:t,baseline:n,guide:r,spacer:i,box:a,padder:o}),[s,t,n,r,i,a,o]);return(0,l.jsx)(g,{value:u,children:e})}function y(e){let t=e.trim().match(/^([+-]?[\d.]+)([a-zA-Z%]+)$/);return t?{value:parseFloat(t[1]),unit:t[2]}:null}function b(e,t){return e===void 0&&t!==void 0?`${t}px`:e===`auto`||typeof e==`string`&&/^(auto|100%|0|.*(fr|vh|vw|vmin|vmax|rem))$/.test(e)?String(e):typeof e==`number`?`${e}px`:e??``}var x={parentSize:0,viewportWidth:1920,viewportHeight:1080,rootFontSize:16,parentFontSize:16},S={px:1,in:96,cm:37.8,mm:3.78,pt:1.33,pc:16},C={em:e=>e.parentFontSize,rem:e=>e.rootFontSize,vh:e=>e.viewportHeight/100,vw:e=>e.viewportWidth/100,vmin:e=>Math.min(e.viewportWidth,e.viewportHeight)/100,vmax:e=>Math.max(e.viewportWidth,e.viewportHeight)/100,"%":e=>e.parentSize/100};function w(e,t){if(typeof e==`number`)return e;if(typeof e!=`string`)return null;let n=y(e);if(!n)return null;let{value:r,unit:i}=n;if(i in S)return r*S[i];if(i===`auto`)return null;let a=C[i];return a?r*a({...x,...t}):null}function T(e,t,n){return Math.min(Math.max(e,t),n)}function E(e,t={}){let{base:n=8,round:r=!0,clamp:i,context:a}=t;if(e===`auto`)return n;let o=null;if(typeof e==`number`?o=e:typeof e==`string`&&(o=w(e,a)??n),o===null&&(o=n),n<=0)return o;let s=r?Math.round(o/n)*n:o;return i===void 0?s:T(s,i.min??-1/0,i.max??1/0)}var D=(...e)=>e.filter(Boolean).join(` `).trim();function O(e,t){let n=e??t;return{isShown:n===`visible`,isHidden:n===`hidden`,isNone:n===`none`,debugging:n}}function k(e,t,n){let r=typeof e==`string`?e:e.key,i=typeof e==`string`?t:e.value,a=typeof e==`string`?n:e.defaultStyles,o=typeof e==`object`?e.skipDimensions:void 0;return o&&(o.fitContent?.includes(r)&&i===`fit-content`||o.auto?.includes(r)&&i===`auto`||o.fullSize?.includes(r)&&(i===`100%`||i===`100vh`||i===`100vw`))||i===a[r]?{}:{[r]:i}}var A=/^\d*\.?\d+(?:fr|px|%|em|rem|vh|vw|vmin|vmax|pt|pc|in|cm|mm)$/,j=e=>typeof e==`number`?Number.isFinite(e)&&e>=0:typeof e==`string`?e===`auto`||e===`100%`||A.test(e):!1,M=e=>Array.isArray(e)&&e.length>0&&e.every(j),N={template:`none`,columnsCount:0,calculatedGap:0,isValid:!1};function P(e,t,n){let r=t.variant??`line`,i=t.base??8,a=E(t.gap??0,{base:i,context:n});if(!e)return N;switch(r){case`line`:{let t=a===0?0:a-1,n=t+1,r=t===0?Math.max(1,Math.floor(e)+1):Math.max(1,Math.floor((e+1)/n)+1);return{template:`repeat(${r}, 1px)`,columnsCount:r,calculatedGap:a>0?a-1:a,isValid:!0}}case`pattern`:{if(!t.columns||!Array.isArray(t.columns)||!M(t.columns))return N;let e=t.columns.map(e=>typeof e==`number`?`${e}px`:e);return e.some(e=>e===`0`||e===`0px`)?N:{template:e.join(` `),columnsCount:e.length,calculatedGap:a,isValid:!0}}case`fixed`:{let e=typeof t.columns==`number`?t.columns:0;return e<1?N:{template:`repeat(${e}, ${t.columnWidth?b(t.columnWidth):`1fr`})`,columnsCount:e,calculatedGap:a,isValid:!0}}case`auto`:{let r=t.columnWidth??`auto`;if(r===`auto`)return{template:`repeat(auto-fill, minmax(0, 1fr))`,columnsCount:1,calculatedGap:a,isValid:!0};let i=typeof r==`number`?`${r}px`:r.toString(),o=w(i,n)??0,s=o>0?Math.max(1,Math.floor((e+a)/(o+a))):1;return{template:`repeat(auto-fill, ${i})`,columnsCount:s,calculatedGap:a,isValid:!0}}default:{let t=Math.max(1,Math.floor(e/(a+1))+1);return{template:`repeat(${t}, 1px)`,columnsCount:t,calculatedGap:a,isValid:!0}}}}function F({variant:e,base:t,gap:n,columns:r,columnWidth:i}){switch(e){case`line`:return{variant:`line`,gap:n,base:t};case`pattern`:if(r&&Array.isArray(r))return{variant:`pattern`,columns:r,gap:n,base:t};break;case`fixed`:if(r!==void 0){let e=typeof r==`number`?r:parseInt(String(r),10);return{variant:`fixed`,columns:isNaN(e)?12:e,columnWidth:i||`60px`,gap:n,base:t}}}return{variant:`auto`,columnWidth:i||`1fr`,gap:n,base:t}}var I=(e,t)=>({"--bkgd-w":`100%`,"--bkgd-h":`100%`,"--bkgd-mw":`none`,"--bkgd-cw":`60px`,"--bkgd-gw":`24px`,"--bkgd-n":`12`,"--bkgd-b":`${e}px`,"--bkgd-cl":t,"--bkgd-g":`0`});function L(e){let{base:t,colors:n,variant:r,align:i,width:a,height:o,columnWidth:s,maxWidth:c,color:l,template:u,columnsCount:d,calculatedGap:f,isVisible:p}=e,m=I(t,n.line),h={"--bkgd-cl":l??n.line,"--bkgd-cp":l??n.pattern,"--bkgd-ca":l??n.auto,"--bkgd-cf":l??n.fixed,"--bkgd-w":b(a??`100%`),"--bkgd-h":b(o??`100%`),...k({key:`--bkgd-mw`,value:b(c||`none`),defaultStyles:m}),...k({key:`--bkgd-cw`,value:b(s||`60px`),defaultStyles:m}),...k({key:`--bkgd-n`,value:`${d}`,defaultStyles:m}),...k({key:`--bkgd-b`,value:`0`,defaultStyles:m}),...k({key:`--bkgd-cl`,value:l??n.line,defaultStyles:m}),...k({key:`--bkgd-g`,value:`${f}px`,defaultStyles:m}),...k({key:`--bkgd-j`,value:i||`center`,defaultStyles:m}),...u&&u!==`none`?{"--bkgd-t":u}:{}},g=l??(r&&r in n?n[r]:void 0)??n.line,_=r===`line`,v=[`gde`,p?`v`:`h`];return _&&v.push(`line`),_&&(h[`--bkgd-line-color`]=`var(--bkgd-cl)`,h[`--bkgd-line-period`]=`${f+1}px`),{containerStyle:h,columnColor:g,columnsCount:d,calculatedGap:f,template:u,isVisible:p,isLineVariant:_,classTokens:v}}function R(e){let t=_();return(0,c.useMemo)(()=>Object.assign({base:t.base},t[e]),[t,e])}function z(e,t){return(0,c.useMemo)(()=>O(e,t),[e,t])}var B=e=>{let t=null,n=null;return[(...r)=>{n=r,t!==null&&cancelAnimationFrame(t),t=requestAnimationFrame(()=>{e(...n),t=null,n=null})},()=>{t!==null&&(cancelAnimationFrame(t),t=null,n=null)}]};function V(e,t){let n={width:0,height:0},r=()=>{try{let r=e.getBoundingClientRect(),i={width:Math.round(r.width),height:Math.round(r.height)};(i.width!==n.width||i.height!==n.height)&&(n=i,t(i))}catch{}},[i,a]=B(r);r();let o=new ResizeObserver(i);return o.observe(e),{refresh:i,disconnect(){o.disconnect(),a()}}}var H={width:0,height:0};function U(e){let[t,n]=c.useState(H),r=c.useRef(null);c.useLayoutEffect(()=>{if(typeof window>`u`||!e.current)return;let t=V(e.current,e=>{n(t=>t.width===e.width&&t.height===e.height?t:e)});return r.current=t,()=>{t.disconnect(),r.current=null}},[e]);let i=c.useCallback(()=>{r.current?.refresh()},[]);return{...t,refresh:i}}function W(){return typeof window>`u`?{}:{viewportWidth:window.innerWidth,viewportHeight:window.innerHeight}}function G(e,t){let{width:n}=U(e);return c.useMemo(()=>P(n,t,W()),[t,n])}function K(){let[e,t]=(0,c.useState)(!1);return(0,c.useEffect)(()=>{t(!0)},[]),e}function q({children:e,fallback:t=null}){return K()?(0,l.jsx)(l.Fragment,{children:e}):(0,l.jsx)(l.Fragment,{children:t})}function J(...e){return Object.assign({},...e.filter(Boolean))}var Y={gde:`gde_4PKz3`,v:`v_yAvN0`,h:`h_XcWcy`,line:`line_UaLjW`,cols:`cols_ibtT4`,col:`col_QPSDI`,ssr:`ssr_4UN4k`},X=c.memo(function({className:e,debugging:t,style:n,variant:r,align:i=`center`,gap:a,height:o,width:s,columns:c,columnWidth:u,maxWidth:d,color:f,children:p,ssrMode:m=!1,...h}){let g=R(`guide`),_=r??g.variant,v=typeof a==`number`?a:0,{isShown:y}=z(t,g.debugging);if(!y)return(0,l.jsx)(`div`,{className:D(Y.gde,Y.h,e),style:n,"data-testid":`guide`,"data-variant":_,"aria-hidden":`true`,...h,children:p});let b=(0,l.jsx)(`div`,{className:D(Y.gde,Y.h,Y.ssr,e),style:{width:s??`100%`,height:o??`100%`,maxWidth:d??`none`,...n},"data-testid":`guide`,"data-variant":_,"aria-hidden":`true`,children:p});return m?b:(0,l.jsx)(q,{fallback:b,children:(0,l.jsx)(Z,{className:e,debugging:t,style:n,variant:_,align:i,gap:v,height:o,width:s,columns:c,columnWidth:u,maxWidth:d,color:f,...h,children:p})})}),Z=c.memo(function({className:e,debugging:t,style:n,variant:r,align:i=`center`,gap:a,height:o,width:s,columns:u,columnWidth:d,maxWidth:f,color:p,children:m,...h}){let g=R(`guide`),{isShown:_}=z(t,g.debugging),v=c.useRef(null);U(v);let y=r??g.variant,b=typeof a==`number`?a:0,{template:x,columnsCount:S,calculatedGap:C}=G(v,c.useMemo(()=>F({variant:y,base:g.base,gap:b,columns:u,columnWidth:d}),[y,g.base,b,u,d])),w=c.useMemo(()=>L({base:g.base,colors:g.colors,variant:y,align:i||`center`,width:s,height:o,columnWidth:d,maxWidth:f,color:p,template:x,columnsCount:S,calculatedGap:C,isVisible:_}),[g.base,g.colors,y,i,s,o,d,f,p,x,S,C,_]),T=c.useMemo(()=>J(w.containerStyle,n),[w.containerStyle,n]);return(0,l.jsxs)(`div`,{ref:v,"data-testid":`guide`,"aria-hidden":`true`,className:D(...w.classTokens.map(e=>Y[e]),e),"data-variant":r,style:T,...h,children:[_&&(0,l.jsx)(`div`,{className:Y.cols,"data-variant":r,children:!w.isLineVariant&&Array.from({length:w.columnsCount},(e,t)=>(0,l.jsx)(`div`,{className:Y.col,"data-column-index":t,"data-variant":r},t))}),m]})});exports.Config=v,exports.Guide=X,exports.createCSSVariables=p,exports.mergeConfig=f;
 //# sourceMappingURL=guide.cjs.map

package/dist/guide.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"guide.cjs","names":[],"sources":["../packages/core/src/config/defaults.ts","../packages/core/src/config/merge.ts","../packages/react/src/components/Config/Config.tsx","../packages/core/src/utils/parse.ts","../packages/core/src/utils/convert.ts","../packages/core/src/utils/math.ts","../packages/core/src/utils/normalize.ts","../packages/core/src/utils/merge.ts","../packages/core/src/validation/guide.ts","../packages/core/src/utils/grid.ts","../packages/core/src/descriptors/guide.ts","../packages/react/src/hooks/useConfig.ts","../packages/react/src/hooks/useDebug.ts","../packages/dom/src/timing.ts","../packages/dom/src/measure.ts","../packages/react/src/hooks/useMeasure.ts","../packages/dom/src/viewport.ts","../packages/react/src/hooks/useGuide.ts","../packages/react/src/hooks/useIsClient.ts","../packages/react/src/utils/ssr.tsx","../packages/react/src/utils/merge.ts","../packages/react/src/components/Guide/styles.module.css","../packages/react/src/components/Guide/Guide.tsx"],"sourcesContent":["import type { ConfigSchema } from './schema'\n\nexport const DEFAULT_CONFIG: ConfigSchema = {\n  base: 8,\n  baseline: {\n    variant: 'line',\n    debugging: 'hidden',\n    colors: {\n      line: 'var(--bk-baseline-color-line-theme)',\n      flat: 'var(--bk-baseline-color-flat-theme)',\n    },\n  },\n  guide: {\n    variant: 'line',\n    debugging: 'hidden',\n    colors: {\n      line: 'var(--bk-guide-color-line-theme)',\n      pattern: 'var(--bk-guide-color-pattern-theme)',\n      auto: 'var(--bk-guide-color-auto-theme)',\n      fixed: 'var(--bk-guide-color-fixed-theme)',\n    },\n  },\n  spacer: {\n    variant: 'line',\n    debugging: 'hidden',\n    colors: {\n      line: 'var(--bk-spacer-color-line-theme)',\n      flat: 'var(--bk-spacer-color-flat-theme)',\n      text: 'var(--bk-spacer-color-text-theme)',\n    },\n  },\n  box: {\n    debugging: 'hidden',\n    colors: {\n      line: 'var(--bk-box-color-line-theme)',\n      flat: 'var(--bk-box-color-flat-theme)',\n      text: 'var(--bk-box-color-text-theme)',\n    },\n  },\n  padder: {\n    debugging: 'hidden',\n    color: 'var(--bk-padder-color-theme)',\n  },\n} as const\n","import type { ConfigSchema } from './schema'\n\ntype MergeConfigParams = {\n  parentConfig: ConfigSchema\n  base?: number\n  baseline?: Partial<ConfigSchema['baseline']>\n  guide?: Partial<ConfigSchema['guide']>\n  spacer?: Partial<ConfigSchema['spacer']>\n  box?: Partial<ConfigSchema['box']>\n  padder?: Partial<ConfigSchema['padder']>\n}\n\nconst COMPONENT_KEYS = ['baseline', 'guide', 'spacer', 'box', 'padder'] as const\n\nexport const mergeConfig = (params: MergeConfigParams): ConfigSchema => {\n  const { parentConfig, base } = params\n  const merged = {} as Record<string, unknown>\n\n  for (const key of COMPONENT_KEYS) {\n    merged[key] = { ...parentConfig[key], ...params[key] }\n  }\n\n  return { base: base ?? parentConfig.base, ...merged } as ConfigSchema\n}\n\ntype CSSVariablesParams = {\n  base: number\n  baseline: ConfigSchema['baseline']\n  guide: ConfigSchema['guide']\n  spacer: ConfigSchema['spacer']\n  box: ConfigSchema['box']\n  padder: ConfigSchema['padder']\n}\n\nexport const createCSSVariables = (\n  params: CSSVariablesParams\n): Record<string, string> => {\n  const { base, baseline, guide, spacer, box, padder } = params\n  return {\n    '--bk-base': `${base}px`,\n    '--bkbl-cl': baseline.colors.line,\n    '--bkbl-cf': baseline.colors.flat,\n    '--bkgd-cl': guide.colors.line,\n    '--bkgd-cp': guide.colors.pattern,\n    '--bkgd-ca': guide.colors.auto,\n    '--bkgd-cf': guide.colors.fixed,\n    '--bksp-cl': spacer.colors.line,\n    '--bksp-cf': spacer.colors.flat,\n    '--bksp-ct': spacer.colors.text,\n    '--bkbx-cl': box.colors.line,\n    '--bkbx-cf': box.colors.flat,\n    '--bkbx-ct': box.colors.text,\n    '--bkpd-c': padder.color,\n  }\n}\n","import * as React from 'react'\nimport type { ConfigSchema } from '@baseline-kit/core/config/schema'\nimport { DEFAULT_CONFIG } from '@baseline-kit/core/config/defaults'\nimport {\n  mergeConfig,\n  createCSSVariables,\n} from '@baseline-kit/core/config/merge'\n\n// Re-export types that consumers need\nexport type { DebuggingMode } from '@baseline-kit/core/types'\nexport type { ConfigSchema } from '@baseline-kit/core/config/schema'\n\n// Create the context\nconst ConfigContext = React.createContext<ConfigSchema>(DEFAULT_CONFIG)\nConfigContext.displayName = 'ConfigContext'\n\n// Update to use React 19's use hook instead of useContext\nexport const useDefaultConfig = () => React.use(ConfigContext)\n\ntype ConfigProps = {\n  children: React.ReactNode\n  base?: number\n  baseline?: Partial<ConfigSchema['baseline']>\n  guide?: Partial<ConfigSchema['guide']>\n  spacer?: Partial<ConfigSchema['spacer']>\n  box?: Partial<ConfigSchema['box']>\n  padder?: Partial<ConfigSchema['padder']>\n}\n\n/**\n * Configuration provider for baseline-kit components.\n */\nexport function Config({\n  children,\n  base,\n  baseline,\n  guide,\n  spacer,\n  box,\n  padder,\n}: ConfigProps) {\n  const parentConfig = useDefaultConfig()\n\n  const value = React.useMemo(() => {\n    return mergeConfig({\n      parentConfig,\n      base,\n      baseline,\n      guide,\n      spacer,\n      box,\n      padder,\n    })\n  }, [parentConfig, base, baseline, guide, spacer, box, padder])\n\n  return <ConfigContext value={value}>{children}</ConfigContext>\n}\n\n// Re-export createCSSVariables and mergeConfig for consumers\nexport { createCSSVariables, mergeConfig }\n","export function parseUnit(\n  value: string\n): { value: number; unit: string } | null {\n  const match = value.trim().match(/^([+-]?[\\d.]+)([a-zA-Z%]+)$/)\n  if (!match) return null\n  const num = parseFloat(match[1])\n  const unit = match[2]\n  return { value: num, unit }\n}\n\nexport function formatValue(\n  value: string | number | undefined,\n  defaultValue?: number\n): string {\n  if (value === undefined && defaultValue !== undefined)\n    return `${defaultValue}px`\n  if (\n    value === 'auto' ||\n    (typeof value === 'string' &&\n      /^(auto|100%|0|.*(fr|vh|vw|vmin|vmax|rem))$/.test(value))\n  ) {\n    return String(value)\n  }\n  if (typeof value === 'number') return `${value}px`\n  return value ?? ''\n}\n","import { parseUnit } from './parse'\n\nexport interface ConversionContext {\n  parentSize?: number\n  viewportWidth?: number\n  viewportHeight?: number\n  rootFontSize?: number\n  parentFontSize?: number\n}\n\nconst DEFAULT_CONTEXT: Required<ConversionContext> = {\n  parentSize: 0,\n  viewportWidth: 1920,\n  viewportHeight: 1080,\n  rootFontSize: 16,\n  parentFontSize: 16,\n}\n\nexport const ABSOLUTE_UNIT_CONVERSIONS: Record<string, number> = {\n  px: 1,\n  in: 96,\n  cm: 37.8,\n  mm: 3.78,\n  pt: 1.33,\n  pc: 16,\n}\n\nexport const RELATIVE_UNITS: string[] = [\n  'em',\n  'rem',\n  'vh',\n  'vw',\n  'vmin',\n  'vmax',\n  '%',\n]\n\nconst RELATIVE_UNIT_RESOLVERS: Record<\n  string,\n  (ctx: Required<ConversionContext>) => number\n> = {\n  em: (ctx) => ctx.parentFontSize,\n  rem: (ctx) => ctx.rootFontSize,\n  vh: (ctx) => ctx.viewportHeight / 100,\n  vw: (ctx) => ctx.viewportWidth / 100,\n  vmin: (ctx) => Math.min(ctx.viewportWidth, ctx.viewportHeight) / 100,\n  vmax: (ctx) => Math.max(ctx.viewportWidth, ctx.viewportHeight) / 100,\n  '%': (ctx) => ctx.parentSize / 100,\n}\n\nexport function convertValue(\n  value: number | string | undefined,\n  context?: ConversionContext\n): number | null {\n  if (typeof value === 'number') return value\n  if (typeof value !== 'string') return null\n\n  const parsed = parseUnit(value)\n  if (!parsed) return null\n\n  const { value: num, unit } = parsed\n\n  if (unit in ABSOLUTE_UNIT_CONVERSIONS) {\n    return num * ABSOLUTE_UNIT_CONVERSIONS[unit]\n  }\n\n  if (unit === 'auto') return null\n\n  const resolver = RELATIVE_UNIT_RESOLVERS[unit]\n  if (resolver) {\n    const ctx = { ...DEFAULT_CONTEXT, ...context }\n    return num * resolver(ctx)\n  }\n\n  return null\n}\n","export function clamp(value: number, min: number, max: number): number {\n  return Math.min(Math.max(value, min), max)\n}\n\ntype RowCountParams = {\n  height?: number\n  top: number\n  bottom: number\n  base: number\n}\n\nexport function calculateRowCount(params: RowCountParams): number {\n  const { height, top, bottom, base } = params\n  const totalHeight = (height ?? 0) - (top + bottom)\n  return Math.max(1, Math.floor(totalHeight / base))\n}\n","import { convertValue, type ConversionContext } from './convert'\nimport { clamp } from './math'\n\nexport interface NormalizationOptions {\n  base?: number\n  round?: boolean\n  clamp?: { min?: number; max?: number }\n  suppressWarnings?: boolean\n  context?: ConversionContext\n}\n\nexport function normalizeValue(\n  value: string | number | undefined,\n  options: NormalizationOptions = {}\n): number {\n  const {\n    base = 8,\n    round: doRound = true,\n    clamp: clampOptions,\n    context,\n  } = options\n\n  if (value === 'auto') return base\n\n  let num: number | null = null\n  if (typeof value === 'number') {\n    num = value\n  } else if (typeof value === 'string') {\n    num = convertValue(value, context) ?? base\n  }\n  if (num === null) num = base\n\n  if (base <= 0) return num\n\n  const normalized = doRound ? Math.round(num / base) * base : num\n\n  return clampOptions !== undefined\n    ? clamp(\n        normalized,\n        clampOptions.min ?? -Infinity,\n        clampOptions.max ?? Infinity\n      )\n    : normalized\n}\n\nexport function normalizeValuePair(\n  values:\n    | [string | number | undefined, string | number | undefined]\n    | undefined,\n  defaults: [number, number],\n  options?: NormalizationOptions\n): [number, number] {\n  if (!values) return defaults\n\n  if (values[0] === undefined && values[1] === undefined) {\n    return defaults\n  }\n\n  const first =\n    values[0] !== undefined ? normalizeValue(values[0], options) : defaults[0]\n  const second =\n    values[1] !== undefined ? normalizeValue(values[1], options) : defaults[1]\n  return [first, second]\n}\n","import type { DebuggingMode } from '../types'\n\n/**\n * Combines class names, filtering out falsy values.\n * Lightweight alternative to clsx/classnames.\n */\nexport const cx = (\n  ...classes: Array<string | boolean | undefined | null>\n): string => classes.filter(Boolean).join(' ').trim()\n\n/**\n * Resolves component debug/visibility state from prop and config.\n * Pure function — framework-agnostic.\n */\nexport interface DebugState {\n  isShown: boolean\n  isHidden: boolean\n  isNone: boolean\n  debugging: DebuggingMode | undefined\n}\n\nexport function resolveDebugState(\n  debuggingProp?: DebuggingMode,\n  debuggingConfig?: DebuggingMode\n): DebugState {\n  const effective = debuggingProp ?? debuggingConfig\n  return {\n    isShown: effective === 'visible',\n    isHidden: effective === 'hidden',\n    isNone: effective === 'none',\n    debugging: effective,\n  }\n}\n\nexport type StyleOverrideParams = {\n  key: string\n  value: string\n  defaultStyles: Record<string, string>\n  skipDimensions?: {\n    fitContent?: string[]\n    auto?: string[]\n    fullSize?: string[]\n  }\n}\n\nexport function createStyleOverride(\n  params: StyleOverrideParams | string,\n  value?: string,\n  defaultStyles?: Record<string, string>\n): Record<string, string> {\n  const key = typeof params === 'string' ? params : params.key\n  const val = typeof params === 'string' ? value! : params.value\n  const defaults =\n    typeof params === 'string' ? defaultStyles! : params.defaultStyles\n  const skipDimensions =\n    typeof params === 'object' ? params.skipDimensions : undefined\n\n  if (skipDimensions) {\n    if (skipDimensions.fitContent?.includes(key) && val === 'fit-content') {\n      return {}\n    }\n    if (skipDimensions.auto?.includes(key) && val === 'auto') {\n      return {}\n    }\n    if (\n      skipDimensions.fullSize?.includes(key) &&\n      (val === '100%' || val === '100vh' || val === '100vw')\n    ) {\n      return {}\n    }\n  }\n\n  return val !== defaults[key] ? { [key]: val } : {}\n}\n","import type { GuideColumnsPattern, GuideColumnValue } from '../types'\n\nconst UNIT_PATTERN =\n  /^\\d*\\.?\\d+(?:fr|px|%|em|rem|vh|vw|vmin|vmax|pt|pc|in|cm|mm)$/\n\nexport const isValidGuideColumnValue = (\n  value: unknown\n): value is GuideColumnValue => {\n  if (typeof value === 'number') return Number.isFinite(value) && value >= 0\n  if (typeof value !== 'string') return false\n  return value === 'auto' || value === '100%' || UNIT_PATTERN.test(value)\n}\n\nexport const isValidGuidePattern = (\n  pattern: unknown\n): pattern is GuideColumnsPattern =>\n  Array.isArray(pattern) &&\n  pattern.length > 0 &&\n  pattern.every(isValidGuideColumnValue)\n","import type { GuideConfig, GuideColumnsPattern } from '../types'\nimport { isValidGuidePattern } from '../validation/guide'\nimport { normalizeValue } from './normalize'\nimport { formatValue } from './parse'\nimport { convertValue, type ConversionContext } from './convert'\n\nexport interface GuideResult {\n  template: string\n  columnsCount: number\n  calculatedGap: number\n  isValid: boolean\n}\n\nconst INVALID_RESULT: GuideResult = {\n  template: 'none',\n  columnsCount: 0,\n  calculatedGap: 0,\n  isValid: false,\n}\n\n/**\n * Pure calculation of grid template from container width and guide config.\n * Framework-agnostic — can be used outside React.\n *\n * Sizing note: the `line` variant still reports the number of pixel tracks as\n * metadata, but React renders line guides with a CSS gradient so dense grids do\n * not allocate one DOM node per line.\n */\nexport function calculateGuideTemplate(\n  width: number,\n  config: GuideConfig,\n  context?: ConversionContext\n): GuideResult {\n  const variant = config.variant ?? 'line'\n  const base = config.base ?? 8\n  const gap = normalizeValue(config.gap ?? 0, { base, context })\n\n  if (!width) return INVALID_RESULT\n\n  switch (variant) {\n    case 'line': {\n      const finalGap = gap === 0 ? 0 : gap - 1\n      const actualGapWithLine = finalGap + 1\n\n      const columns =\n        finalGap === 0\n          ? Math.max(1, Math.floor(width) + 1)\n          : Math.max(1, Math.floor((width + 1) / actualGapWithLine) + 1)\n\n      return {\n        template: `repeat(${columns}, 1px)`,\n        columnsCount: columns,\n        calculatedGap: gap > 0 ? gap - 1 : gap,\n        isValid: true,\n      }\n    }\n\n    case 'pattern': {\n      if (!config.columns || !Array.isArray(config.columns)) {\n        return INVALID_RESULT\n      }\n\n      if (!isValidGuidePattern(config.columns)) {\n        return INVALID_RESULT\n      }\n\n      const columnsArr = (config.columns as GuideColumnsPattern).map((col) =>\n        typeof col === 'number' ? `${col}px` : col\n      )\n\n      if (columnsArr.some((c) => c === '0' || c === '0px')) {\n        return INVALID_RESULT\n      }\n\n      return {\n        template: columnsArr.join(' '),\n        columnsCount: columnsArr.length,\n        calculatedGap: gap,\n        isValid: true,\n      }\n    }\n\n    case 'fixed': {\n      const colCount = typeof config.columns === 'number' ? config.columns : 0\n      if (colCount < 1) return INVALID_RESULT\n\n      const colWidth = config.columnWidth\n        ? formatValue(config.columnWidth)\n        : '1fr'\n\n      return {\n        template: `repeat(${colCount}, ${colWidth})`,\n        columnsCount: colCount,\n        calculatedGap: gap,\n        isValid: true,\n      }\n    }\n\n    case 'auto': {\n      const colWidth = config.columnWidth ?? 'auto'\n      if (colWidth === 'auto') {\n        return {\n          template: 'repeat(auto-fill, minmax(0, 1fr))',\n          columnsCount: 1,\n          calculatedGap: gap,\n          isValid: true,\n        }\n      }\n\n      const colWidthStr =\n        typeof colWidth === 'number' ? `${colWidth}px` : colWidth.toString()\n      const pxVal = convertValue(colWidthStr, context) ?? 0\n      const columns =\n        pxVal > 0 ? Math.max(1, Math.floor((width + gap) / (pxVal + gap))) : 1\n\n      return {\n        template: `repeat(auto-fill, ${colWidthStr})`,\n        columnsCount: columns,\n        calculatedGap: gap,\n        isValid: true,\n      }\n    }\n\n    default: {\n      const columns = Math.max(1, Math.floor(width / (gap + 1)) + 1)\n      return {\n        template: `repeat(${columns}, 1px)`,\n        columnsCount: columns,\n        calculatedGap: gap,\n        isValid: true,\n      }\n    }\n  }\n}\n\nexport const createGridSpanStyles = (\n  span?: number,\n  colSpan?: number,\n  rowSpan?: number\n): Record<string, string> => {\n  const gridStyles: Record<string, string> = {}\n\n  if (span !== undefined) {\n    gridStyles.gridColumn = `span ${span}`\n    gridStyles.gridRow = `span ${span}`\n  } else {\n    if (colSpan !== undefined) {\n      gridStyles.gridColumn = `span ${colSpan}`\n    }\n    if (rowSpan !== undefined) {\n      gridStyles.gridRow = `span ${rowSpan}`\n    }\n  }\n\n  return gridStyles\n}\n","import type { GuideVariant, GuideConfig } from '../types'\nimport { formatValue, createStyleOverride } from '../utils'\n\nexport interface GuideDescriptorParams {\n  base: number\n  colors: Record<GuideVariant, string>\n  variant: GuideVariant\n  align: string\n  width?: number | string\n  height?: number | string\n  columnWidth?: number | string\n  maxWidth?: number | string\n  color?: string\n  /** Pre-computed guide template result (from useGuide or calculateGuideTemplate) */\n  template: string\n  columnsCount: number\n  calculatedGap: number\n  isVisible: boolean\n}\n\nexport interface GuideDescriptor {\n  containerStyle: Record<string, string>\n  columnColor: string\n  columnsCount: number\n  calculatedGap: number\n  template: string\n  isVisible: boolean\n  isLineVariant: boolean\n  classTokens: string[]\n}\n\nexport interface GuideConfigParams {\n  variant: GuideVariant\n  base: number\n  gap: number\n  columns?: number | readonly (string | number | undefined | 'auto')[]\n  columnWidth?: number | string\n}\n\n/**\n * Creates a GuideConfig from component props.\n * Pure function — no React or DOM dependency.\n */\nexport function createGuideConfig({\n  variant,\n  base,\n  gap,\n  columns,\n  columnWidth,\n}: GuideConfigParams): GuideConfig {\n  switch (variant) {\n    case 'line':\n      return { variant: 'line', gap, base }\n    case 'pattern':\n      if (columns && Array.isArray(columns)) {\n        return {\n          variant: 'pattern',\n          columns: columns as readonly (string | number)[],\n          gap,\n          base,\n        }\n      }\n      break\n    case 'fixed':\n      if (columns !== undefined) {\n        const parsed =\n          typeof columns === 'number' ? columns : parseInt(String(columns), 10)\n        return {\n          variant: 'fixed',\n          columns: !isNaN(parsed) ? parsed : 12,\n          columnWidth: columnWidth || '60px',\n          gap,\n          base,\n        }\n      }\n      break\n  }\n  return { variant: 'auto', columnWidth: columnWidth || '1fr', gap, base }\n}\n\nconst GUIDE_DEFAULTS = (\n  base: number,\n  lineColor: string\n): Record<string, string> => ({\n  '--bkgd-w': '100%',\n  '--bkgd-h': '100%',\n  '--bkgd-mw': 'none',\n  '--bkgd-cw': '60px',\n  '--bkgd-gw': '24px',\n  '--bkgd-n': '12',\n  '--bkgd-b': `${base}px`,\n  '--bkgd-cl': lineColor,\n  '--bkgd-g': '0',\n})\n\n/**\n * Computes all styles and data needed to render a Guide component.\n * Pure function — framework-agnostic.\n */\nexport function createGuideDescriptor(\n  params: GuideDescriptorParams\n): GuideDescriptor {\n  const {\n    base,\n    colors,\n    variant,\n    align,\n    width,\n    height,\n    columnWidth,\n    maxWidth,\n    color,\n    template,\n    columnsCount,\n    calculatedGap,\n    isVisible,\n  } = params\n\n  const defaultStyles = GUIDE_DEFAULTS(base, colors.line)\n  const fullDimensions = ['--bkgd-w', '--bkgd-h']\n\n  const widthValue = formatValue(width ?? '100%')\n  const heightValue = formatValue(height ?? '100%')\n\n  const containerStyle: Record<string, string> = {\n    ...createStyleOverride({\n      key: '--bkgd-w',\n      value: widthValue,\n      defaultStyles,\n      skipDimensions: { fullSize: fullDimensions },\n    }),\n    ...createStyleOverride({\n      key: '--bkgd-h',\n      value: heightValue,\n      defaultStyles,\n      skipDimensions: { fullSize: fullDimensions },\n    }),\n    ...createStyleOverride({\n      key: '--bkgd-mw',\n      value: formatValue(maxWidth || 'none'),\n      defaultStyles,\n    }),\n    ...createStyleOverride({\n      key: '--bkgd-cw',\n      value: formatValue(columnWidth || '60px'),\n      defaultStyles,\n    }),\n    ...createStyleOverride({\n      key: '--bkgd-n',\n      value: `${columnsCount}`,\n      defaultStyles,\n    }),\n    ...createStyleOverride({ key: '--bkgd-b', value: '0', defaultStyles }),\n    ...createStyleOverride({\n      key: '--bkgd-cl',\n      value: color ?? colors.line,\n      defaultStyles,\n    }),\n    ...createStyleOverride({\n      key: '--bkgd-g',\n      value: `${calculatedGap}px`,\n      defaultStyles,\n    }),\n    ...createStyleOverride({\n      key: '--bkgd-j',\n      value: align || 'center',\n      defaultStyles,\n    }),\n    // CSS module resolves grid-template-columns from --bkgd-t, so the inline\n    // gridTemplateColumns property would be redundant.\n    ...(template && template !== 'none' ? { '--bkgd-t': template } : {}),\n  }\n\n  const columnColor =\n    (variant && variant in colors\n      ? colors[variant as keyof typeof colors]\n      : undefined) ?? colors.line\n\n  const isLineVariant = variant === 'line'\n  const classTokens = ['gde', isVisible ? 'v' : 'h']\n  if (isLineVariant) classTokens.push('line')\n\n  if (isLineVariant) {\n    containerStyle['--bkgd-line-color'] = color ?? colors.line\n    containerStyle['--bkgd-line-period'] = `${calculatedGap + 1}px`\n  }\n\n  return {\n    containerStyle,\n    columnColor,\n    columnsCount,\n    calculatedGap,\n    template,\n    isVisible,\n    isLineVariant,\n    classTokens,\n  }\n}\n","import { useMemo } from 'react'\nimport type { ConfigSchema } from '@baseline-kit/core/config/schema'\nimport { useDefaultConfig } from '../components/Config/Config'\n\n/** Type helper that merges base configuration with component-specific settings. */\nexport type ComponentConfig<K extends keyof ConfigSchema> = ConfigSchema[K] & {\n  base: number\n}\n\n/**\n * Hook for accessing component-specific theme configuration.\n */\nexport function useConfig<K extends keyof ConfigSchema>(\n  component: K\n): ComponentConfig<K> {\n  const defaultConfig = useDefaultConfig()\n  return useMemo(() => {\n    return Object.assign(\n      { base: defaultConfig.base },\n      defaultConfig[component]\n    ) as ComponentConfig<K>\n  }, [defaultConfig, component])\n}\n","import { useMemo } from 'react'\nimport { resolveDebugState } from '@baseline-kit/core/utils/merge'\nimport type { DebuggingMode } from '@baseline-kit/core/types'\n\n/**\n * Hook for managing component debug state and visibility.\n * Delegates to pure resolveDebugState in core.\n */\nexport function useDebug(\n  debuggingProp?: DebuggingMode,\n  debuggingConfig?: DebuggingMode\n) {\n  return useMemo(\n    () => resolveDebugState(debuggingProp, debuggingConfig),\n    [debuggingProp, debuggingConfig]\n  )\n}\n","export const debounce = <T extends (...args: unknown[]) => void>(\n  fn: T,\n  delay: number\n): [T, () => void] => {\n  let timer: ReturnType<typeof setTimeout> | null = null\n\n  const cancel = () => {\n    if (timer) {\n      clearTimeout(timer)\n      timer = null\n    }\n  }\n\n  const debounced = ((...args) => {\n    cancel()\n    timer = setTimeout(() => fn(...args), delay)\n  }) as T\n\n  return [debounced, cancel]\n}\n\nexport const rafThrottle = <T extends (...args: never[]) => void>(\n  fn: T\n): [T, () => void] => {\n  let rafId: number | null = null\n  let lastArgs: Parameters<T> | null = null\n\n  const cancel = () => {\n    if (rafId !== null) {\n      cancelAnimationFrame(rafId)\n      rafId = null\n      lastArgs = null\n    }\n  }\n\n  const throttled = (...args: Parameters<T>) => {\n    lastArgs = args\n\n    if (rafId !== null) {\n      cancelAnimationFrame(rafId)\n    }\n\n    rafId = requestAnimationFrame(() => {\n      fn(...lastArgs!)\n      rafId = null\n      lastArgs = null\n    })\n  }\n\n  return [throttled as T, cancel]\n}\n","/**\n * Element measurement observer.\n */\n\nimport { rafThrottle } from './timing'\n\nexport interface MeasureRect {\n  width: number\n  height: number\n}\n\nexport interface MeasureObserverHandle {\n  /** Force an immediate re-measure */\n  refresh(): void\n  /** Stop observing */\n  disconnect(): void\n}\n\n/**\n * Observes an element's dimensions via ResizeObserver.\n * Calls `onChange` with rounded width/height whenever the size changes.\n */\nexport function createMeasureObserver(\n  el: Element,\n  onChange: (rect: MeasureRect) => void\n): MeasureObserverHandle {\n  let prev: MeasureRect = { width: 0, height: 0 }\n\n  const measure = () => {\n    try {\n      const rect = el.getBoundingClientRect()\n      const next: MeasureRect = {\n        width: Math.round(rect.width),\n        height: Math.round(rect.height),\n      }\n      if (next.width !== prev.width || next.height !== prev.height) {\n        prev = next\n        onChange(next)\n      }\n    } catch {\n      // element may have been removed\n    }\n  }\n\n  const [throttledMeasure, cancelMeasure] = rafThrottle(measure)\n\n  // Initial measurement\n  measure()\n\n  const observer = new ResizeObserver(throttledMeasure)\n  observer.observe(el)\n\n  return {\n    refresh: throttledMeasure,\n    disconnect() {\n      observer.disconnect()\n      cancelMeasure()\n    },\n  }\n}\n","import * as React from 'react'\nimport { createMeasureObserver } from '@baseline-kit/dom/measure'\nimport type { MeasureRect } from '@baseline-kit/dom/measure'\n\nexport interface MeasureResult extends MeasureRect {\n  refresh: () => void\n}\n\nconst ZERO: MeasureRect = { width: 0, height: 0 }\n\n/**\n * Hook for measuring and tracking DOM element dimensions.\n * Thin wrapper around the imperative createMeasureObserver from @baseline-kit/dom.\n */\nexport function useMeasure(\n  ref: React.RefObject<HTMLElement | null>\n): MeasureResult {\n  const [dimensions, setDimensions] = React.useState<MeasureRect>(ZERO)\n  const handleRef = React.useRef<ReturnType<\n    typeof createMeasureObserver\n  > | null>(null)\n\n  React.useLayoutEffect(() => {\n    if (typeof window === 'undefined' || !ref.current) return\n\n    const handle = createMeasureObserver(ref.current, (rect) => {\n      setDimensions((prev) =>\n        prev.width === rect.width && prev.height === rect.height ? prev : rect\n      )\n    })\n    handleRef.current = handle\n\n    return () => {\n      handle.disconnect()\n      handleRef.current = null\n    }\n  }, [ref])\n\n  const refresh = React.useCallback(() => {\n    handleRef.current?.refresh()\n  }, [])\n\n  return { ...dimensions, refresh }\n}\n","import type { ConversionContext } from '@baseline-kit/core'\n\n/**\n * Returns the current browser viewport for vw/vh/vmin/vmax conversion.\n * Returns an empty object on the server so callers fall back to the\n * core defaults without crashing.\n */\nexport function getViewportContext(): Partial<ConversionContext> {\n  if (typeof window === 'undefined') return {}\n  return {\n    viewportWidth: window.innerWidth,\n    viewportHeight: window.innerHeight,\n  }\n}\n","import * as React from 'react'\nimport type { GuideConfig } from '@baseline-kit/core/types'\nimport { calculateGuideTemplate } from '@baseline-kit/core/utils/grid'\nimport { getViewportContext } from '@baseline-kit/dom/viewport'\nimport { useMeasure } from './useMeasure'\n\nexport type { GuideResult } from '@baseline-kit/core/utils/grid'\n\n/**\n * Hook for calculating grid layout parameters based on container dimensions.\n */\nexport function useGuide(\n  ref: React.RefObject<HTMLElement | null>,\n  config: GuideConfig\n) {\n  const { width } = useMeasure(ref)\n  return React.useMemo(\n    () => calculateGuideTemplate(width, config, getViewportContext()),\n    [config, width]\n  )\n}\n","import { useEffect, useState } from 'react'\n\n/**\n * Hook to determine if the code is running on the client side.\n */\nexport function useIsClient() {\n  const [isClient, setIsClient] = useState(false)\n\n  useEffect(() => {\n    setIsClient(true)\n  }, [])\n\n  return isClient\n}\n","/**\n * React-specific SSR utilities (ClientOnly component)\n */\nimport * as React from 'react'\nimport { useIsClient } from '../hooks/useIsClient'\n\ninterface ClientOnlyProps {\n  children: React.ReactNode\n  fallback?: React.ReactNode\n}\n\n/**\n * A utility component that only renders its children on the client side.\n * @internal Not part of the public API\n */\nexport function ClientOnly({ children, fallback = null }: ClientOnlyProps) {\n  const isClient = useIsClient()\n\n  if (!isClient) {\n    return <>{fallback}</>\n  }\n\n  return <>{children}</>\n}\n","import * as React from 'react'\n\n/**\n * Combines descriptor style records and React style objects.\n * Accepts Record<string, string> from descriptors and React.CSSProperties.\n */\nexport function mergeStyles(\n  ...styles: Array<Record<string, string> | React.CSSProperties | undefined>\n): React.CSSProperties {\n  return Object.assign({}, ...styles.filter(Boolean))\n}\n\n/**\n * Merges multiple React refs into a single callback ref.\n */\nexport function mergeRefs<T>(\n  ...refs: Array<React.Ref<T> | null | undefined>\n): React.RefCallback<T> {\n  return (node: T | null) => {\n    refs.forEach((ref) => {\n      if (!ref) return\n      if (typeof ref === 'function') {\n        ref(node)\n      } else {\n        Object.assign(ref, { current: node })\n      }\n    })\n  }\n}\n",".gde {\n  position: absolute;\n  inset: 0;\n  box-sizing: border-box;\n  width: var(--bkgd-w, 100%);\n  height: var(--bkgd-h, 100%);\n  max-width: var(--bkgd-mw, none);\n  margin-inline: auto;\n  pointer-events: none;\n  padding: var(--bkgd-pb, 0) var(--bkgd-pi, 0);\n}\n\n.v {\n  opacity: 1;\n  visibility: visible;\n  transition:\n    opacity var(--bk-transition-base),\n    visibility 0ms linear;\n}\n\n.h {\n  opacity: 0;\n  visibility: hidden;\n  transition:\n    opacity var(--bk-transition-base),\n    visibility 0ms linear 180ms;\n}\n\n.line {\n  left: -0.5px; /* Alignment correction for line variant */\n}\n\n.cols {\n  position: absolute;\n  inset: 0;\n  display: grid;\n  column-gap: var(--bkgd-g);\n  grid-template-rows: 1fr;\n  grid-template-columns: var(--bkgd-t);\n  justify-content: var(--bkgd-j);\n  width: var(--bk-wf);\n  height: var(--bk-hf);\n  overflow: hidden;\n  contain: layout style paint;\n}\n\n.col {\n  min-width: 0;\n  width: var(--bk-wf);\n  height: var(--bk-hf);\n}\n\n/* Variant-specific styles */\n.col[data-variant='line'] {\n  width: 1px;\n  background-color: var(--bkgd-cl);\n}\n\n.cols[data-variant='line'] {\n  display: block;\n  background-image: repeating-linear-gradient(\n    to right,\n    var(--bkgd-line-color, var(--bkgd-cl)) 0 1px,\n    transparent 1px var(--bkgd-line-period, 1px)\n  );\n}\n\n.col[data-variant='pattern'] {\n  background-color: var(--bkgd-cp);\n}\n\n.col[data-variant='auto'] {\n  background-color: var(--bkgd-ca);\n  overflow: hidden;\n}\n\n.col[data-variant='fixed'] {\n  background-color: var(--bkgd-cf);\n}\n\n/* Style for SSR rendering */\n.ssr {\n  box-sizing: border-box;\n  display: grid;\n  position: relative;\n  z-index: 1;\n  pointer-events: none;\n  min-height: 100px; /* Ensures a minimum height during SSR */\n}\n","import * as React from 'react'\nimport type { ComponentsProps } from '../types'\nimport { useConfig } from '../../hooks/useConfig'\nimport { useDebug } from '../../hooks/useDebug'\nimport { useMeasure } from '../../hooks/useMeasure'\nimport { useGuide } from '../../hooks/useGuide'\nimport { cx } from '@baseline-kit/core/utils/merge'\nimport {\n  createGuideDescriptor,\n  createGuideConfig,\n} from '@baseline-kit/core/descriptors/guide'\nimport type { GuideVariant, GuideConfig } from '@baseline-kit/core/types'\nimport { ClientOnly } from '../../utils/ssr'\nimport { mergeStyles } from '../../utils/merge'\nimport styles from './styles.module.css'\n\nexport type { GuideConfig }\n\nexport type GuideProps = {\n  align?: React.CSSProperties['justifyContent']\n  variant?: GuideVariant\n  columns?: number | readonly (string | number | undefined | 'auto')[]\n  columnWidth?: React.CSSProperties['width']\n  maxWidth?: React.CSSProperties['maxWidth']\n  color?: React.CSSProperties['color']\n  children?: React.ReactNode\n  gap?: number\n  ssrMode?: boolean\n} & ComponentsProps &\n  Omit<GuideConfig, 'columns' | 'columnWidth' | 'gap'>\n\nexport const Guide = React.memo(function Guide({\n  className,\n  debugging,\n  style,\n  variant: variantProp,\n  align = 'center',\n  gap: gapProp,\n  height,\n  width,\n  columns,\n  columnWidth,\n  maxWidth,\n  color,\n  children,\n  ssrMode = false,\n  ...props\n}: GuideProps) {\n  const config = useConfig('guide')\n  const variant = variantProp ?? config.variant\n  const gap = typeof gapProp === 'number' ? gapProp : 0\n  const { isShown } = useDebug(debugging, config.debugging)\n\n  if (!isShown) {\n    return (\n      <div\n        className={cx(styles.gde, styles.h, className)}\n        style={style}\n        data-testid=\"guide\"\n        data-variant={variant}\n        aria-hidden=\"true\"\n        {...props}\n      >\n        {children}\n      </div>\n    )\n  }\n\n  const ssrFallback = (\n    <div\n      className={cx(styles.gde, styles.h, styles.ssr, className)}\n      style={{\n        width: width ?? '100%',\n        height: height ?? '100%',\n        maxWidth: maxWidth ?? 'none',\n        ...style,\n      }}\n      data-testid=\"guide\"\n      data-variant={variant}\n      aria-hidden=\"true\"\n    >\n      {children}\n    </div>\n  )\n\n  if (ssrMode) {\n    return ssrFallback\n  }\n\n  return (\n    <ClientOnly fallback={ssrFallback}>\n      <GuideImpl\n        className={className}\n        debugging={debugging}\n        style={style}\n        variant={variant}\n        align={align}\n        gap={gap}\n        height={height}\n        width={width}\n        columns={columns}\n        columnWidth={columnWidth}\n        maxWidth={maxWidth}\n        color={color}\n        {...props}\n      >\n        {children}\n      </GuideImpl>\n    </ClientOnly>\n  )\n})\n\nconst GuideImpl = React.memo(function GuideImpl({\n  className,\n  debugging,\n  style,\n  variant,\n  align = 'center',\n  gap,\n  height,\n  width,\n  columns,\n  columnWidth,\n  maxWidth,\n  color,\n  children,\n  ...props\n}: GuideProps) {\n  const config = useConfig('guide')\n  const { isShown } = useDebug(debugging, config.debugging)\n  const containerRef = React.useRef<HTMLDivElement | null>(null)\n  useMeasure(containerRef)\n\n  const resolvedVariant = (variant ?? config.variant) as GuideVariant\n  const resolvedGap = typeof gap === 'number' ? gap : 0\n\n  const gridConfig = React.useMemo(\n    () =>\n      createGuideConfig({\n        variant: resolvedVariant,\n        base: config.base,\n        gap: resolvedGap,\n        columns,\n        columnWidth: columnWidth as number | string | undefined,\n      }),\n    [resolvedVariant, config.base, resolvedGap, columns, columnWidth]\n  )\n\n  const { template, columnsCount, calculatedGap } = useGuide(\n    containerRef,\n    gridConfig\n  )\n\n  const descriptor = React.useMemo(\n    () =>\n      createGuideDescriptor({\n        base: config.base,\n        colors: config.colors,\n        variant: resolvedVariant,\n        align: align || 'center',\n        width,\n        height,\n        columnWidth,\n        maxWidth,\n        color,\n        template,\n        columnsCount,\n        calculatedGap,\n        isVisible: isShown,\n      }),\n    [\n      config.base,\n      config.colors,\n      resolvedVariant,\n      align,\n      width,\n      height,\n      columnWidth,\n      maxWidth,\n      color,\n      template,\n      columnsCount,\n      calculatedGap,\n      isShown,\n    ]\n  )\n\n  const containerStyles = React.useMemo(\n    () => mergeStyles(descriptor.containerStyle, style),\n    [descriptor.containerStyle, style]\n  )\n\n  return (\n    <div\n      ref={containerRef}\n      data-testid=\"guide\"\n      aria-hidden=\"true\"\n      className={cx(...descriptor.classTokens.map((t) => styles[t]), className)}\n      data-variant={variant}\n      style={containerStyles}\n      {...props}\n    >\n      {isShown && (\n        <div className={styles.cols} data-variant={variant}>\n          {!descriptor.isLineVariant &&\n            Array.from({ length: descriptor.columnsCount }, (_, i) => (\n              <div\n                key={i}\n                className={styles.col}\n                data-column-index={i}\n                data-variant={variant}\n                style={{ backgroundColor: descriptor.columnColor }}\n              />\n            ))}\n        </div>\n      )}\n      {children}\n    </div>\n  )\n})\n"],"mappings":"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"}
+{"version":3,"file":"guide.cjs","names":[],"sources":["../packages/core/src/config/defaults.ts","../packages/core/src/config/merge.ts","../packages/react/src/components/Config/Config.tsx","../packages/core/src/utils/parse.ts","../packages/core/src/utils/convert.ts","../packages/core/src/utils/math.ts","../packages/core/src/utils/normalize.ts","../packages/core/src/utils/merge.ts","../packages/core/src/validation/guide.ts","../packages/core/src/utils/grid.ts","../packages/core/src/descriptors/guide.ts","../packages/react/src/hooks/useConfig.ts","../packages/react/src/hooks/useDebug.ts","../packages/dom/src/timing.ts","../packages/dom/src/measure.ts","../packages/react/src/hooks/useMeasure.ts","../packages/dom/src/viewport.ts","../packages/react/src/hooks/useGuide.ts","../packages/react/src/hooks/useIsClient.ts","../packages/react/src/utils/ssr.tsx","../packages/react/src/utils/merge.ts","../packages/react/src/components/Guide/styles.module.css","../packages/react/src/components/Guide/Guide.tsx"],"sourcesContent":["import type { ConfigSchema } from './schema'\n\nexport const DEFAULT_CONFIG: ConfigSchema = {\n  base: 8,\n  baseline: {\n    variant: 'line',\n    debugging: 'hidden',\n    colors: {\n      line: 'var(--bk-baseline-color-line-theme, hsla(240, 60%, 40%, 0.15))',\n      flat: 'var(--bk-baseline-color-flat-theme, hsla(230, 100%, 70%, 0.2))',\n    },\n  },\n  guide: {\n    variant: 'line',\n    debugging: 'hidden',\n    colors: {\n      line: 'var(--bk-guide-color-line-theme, hsla(240, 60%, 40%, 0.15))',\n      pattern: 'var(--bk-guide-color-pattern-theme, hsla(230, 100%, 70%, 0.2))',\n      auto: 'var(--bk-guide-color-auto-theme, hsla(200, 100%, 70%, 0.15))',\n      fixed: 'var(--bk-guide-color-fixed-theme, hsla(200, 100%, 70%, 0.15))',\n    },\n  },\n  spacer: {\n    variant: 'line',\n    debugging: 'hidden',\n    colors: {\n      line: 'var(--bk-spacer-color-line-theme, hsla(270, 60%, 40%, 0.6))',\n      flat: 'var(--bk-spacer-color-flat-theme, hsla(230, 100%, 70%, 0.2))',\n      text: 'var(--bk-spacer-color-text-theme, hsla(270, 60%, 40%, 1))',\n    },\n  },\n  box: {\n    debugging: 'hidden',\n    colors: {\n      line: 'var(--bk-box-color-line-theme, hsla(300, 60%, 40%, 0.6))',\n      flat: 'var(--bk-box-color-flat-theme, hsla(260, 100%, 70%, 0.2))',\n      text: 'var(--bk-box-color-text-theme, hsla(300, 60%, 40%, 0.9))',\n    },\n  },\n  padder: {\n    debugging: 'hidden',\n    color: 'var(--bk-padder-color-theme, hsla(270, 60%, 40%, 0.6))',\n  },\n} as const\n","import type { ConfigSchema } from './schema'\n\ntype PartialColors<T> = T extends { colors: infer Colors }\n  ? Omit<Partial<T>, 'colors'> & { colors?: Partial<Colors> }\n  : Partial<T>\n\nexport type ConfigOverrides = {\n  base?: number\n  baseline?: PartialColors<ConfigSchema['baseline']>\n  guide?: PartialColors<ConfigSchema['guide']>\n  spacer?: PartialColors<ConfigSchema['spacer']>\n  box?: PartialColors<ConfigSchema['box']>\n  padder?: Partial<ConfigSchema['padder']>\n}\n\ntype MergeConfigParams = ConfigOverrides & {\n  parentConfig: ConfigSchema\n}\n\nconst COMPONENT_KEYS = ['baseline', 'guide', 'spacer', 'box', 'padder'] as const\n\nexport const mergeConfig = (params: MergeConfigParams): ConfigSchema => {\n  const { parentConfig, base } = params\n  const merged = {} as Record<string, unknown>\n\n  for (const key of COMPONENT_KEYS) {\n    const override = params[key]\n    const inherited = parentConfig[key]\n    const next = { ...inherited, ...override } as Record<string, unknown>\n\n    if (\n      override &&\n      'colors' in override &&\n      override.colors &&\n      'colors' in inherited\n    ) {\n      next.colors = {\n        ...(inherited.colors as Record<string, string>),\n        ...(override.colors as Record<string, string>),\n      }\n    }\n\n    merged[key] = next\n  }\n\n  return { base: base ?? parentConfig.base, ...merged } as ConfigSchema\n}\n\ntype CSSVariablesParams = {\n  base: number\n  baseline: ConfigSchema['baseline']\n  guide: ConfigSchema['guide']\n  spacer: ConfigSchema['spacer']\n  box: ConfigSchema['box']\n  padder: ConfigSchema['padder']\n}\n\nexport const createCSSVariables = (\n  params: CSSVariablesParams\n): Record<string, string> => {\n  const { base, baseline, guide, spacer, box, padder } = params\n  return {\n    '--bk-base': `${base}px`,\n    '--bkbl-cl': baseline.colors.line,\n    '--bkbl-cf': baseline.colors.flat,\n    '--bkgd-cl': guide.colors.line,\n    '--bkgd-cp': guide.colors.pattern,\n    '--bkgd-ca': guide.colors.auto,\n    '--bkgd-cf': guide.colors.fixed,\n    '--bksp-cl': spacer.colors.line,\n    '--bksp-cf': spacer.colors.flat,\n    '--bksp-ct': spacer.colors.text,\n    '--bkbx-cl': box.colors.line,\n    '--bkbx-cf': box.colors.flat,\n    '--bkbx-ct': box.colors.text,\n    '--bkpd-c': padder.color,\n  }\n}\n","import * as React from 'react'\nimport type { ConfigSchema } from '@baseline-kit/core/config/schema'\nimport { DEFAULT_CONFIG } from '@baseline-kit/core/config/defaults'\nimport {\n  type ConfigOverrides,\n  mergeConfig,\n  createCSSVariables,\n} from '@baseline-kit/core/config/merge'\n\n// Re-export types that consumers need\nexport type { DebuggingMode } from '@baseline-kit/core/types'\nexport type { ConfigSchema } from '@baseline-kit/core/config/schema'\n\n// Root and guide are published as separate bundles. Keep their context\n// identity shared when an application imports both entry points.\nconst CONFIG_CONTEXT_KEY = '__baseline_kit_config_context__'\nconst contextStore = globalThis as typeof globalThis & {\n  [CONFIG_CONTEXT_KEY]?: React.Context<ConfigSchema>\n}\nconst ConfigContext =\n  contextStore[CONFIG_CONTEXT_KEY] ??\n  (contextStore[CONFIG_CONTEXT_KEY] = React.createContext(DEFAULT_CONFIG))\nConfigContext.displayName = 'ConfigContext'\n\n// Update to use React 19's use hook instead of useContext\nexport const useDefaultConfig = () => React.use(ConfigContext)\n\ntype ConfigProps = ConfigOverrides & {\n  children: React.ReactNode\n}\n\n/**\n * Configuration provider for baseline-kit components.\n */\nexport function Config({\n  children,\n  base,\n  baseline,\n  guide,\n  spacer,\n  box,\n  padder,\n}: ConfigProps) {\n  const parentConfig = useDefaultConfig()\n\n  const value = React.useMemo(() => {\n    return mergeConfig({\n      parentConfig,\n      base,\n      baseline,\n      guide,\n      spacer,\n      box,\n      padder,\n    })\n  }, [parentConfig, base, baseline, guide, spacer, box, padder])\n\n  return <ConfigContext value={value}>{children}</ConfigContext>\n}\n\n// Re-export createCSSVariables and mergeConfig for consumers\nexport { createCSSVariables, mergeConfig }\n","export function parseUnit(\n  value: string\n): { value: number; unit: string } | null {\n  const match = value.trim().match(/^([+-]?[\\d.]+)([a-zA-Z%]+)$/)\n  if (!match) return null\n  const num = parseFloat(match[1])\n  const unit = match[2]\n  return { value: num, unit }\n}\n\nexport function formatValue(\n  value: string | number | undefined,\n  defaultValue?: number\n): string {\n  if (value === undefined && defaultValue !== undefined)\n    return `${defaultValue}px`\n  if (\n    value === 'auto' ||\n    (typeof value === 'string' &&\n      /^(auto|100%|0|.*(fr|vh|vw|vmin|vmax|rem))$/.test(value))\n  ) {\n    return String(value)\n  }\n  if (typeof value === 'number') return `${value}px`\n  return value ?? ''\n}\n","import { parseUnit } from './parse'\n\nexport interface ConversionContext {\n  parentSize?: number\n  viewportWidth?: number\n  viewportHeight?: number\n  rootFontSize?: number\n  parentFontSize?: number\n}\n\nconst DEFAULT_CONTEXT: Required<ConversionContext> = {\n  parentSize: 0,\n  viewportWidth: 1920,\n  viewportHeight: 1080,\n  rootFontSize: 16,\n  parentFontSize: 16,\n}\n\nexport const ABSOLUTE_UNIT_CONVERSIONS: Record<string, number> = {\n  px: 1,\n  in: 96,\n  cm: 37.8,\n  mm: 3.78,\n  pt: 1.33,\n  pc: 16,\n}\n\nexport const RELATIVE_UNITS: string[] = [\n  'em',\n  'rem',\n  'vh',\n  'vw',\n  'vmin',\n  'vmax',\n  '%',\n]\n\nconst RELATIVE_UNIT_RESOLVERS: Record<\n  string,\n  (ctx: Required<ConversionContext>) => number\n> = {\n  em: (ctx) => ctx.parentFontSize,\n  rem: (ctx) => ctx.rootFontSize,\n  vh: (ctx) => ctx.viewportHeight / 100,\n  vw: (ctx) => ctx.viewportWidth / 100,\n  vmin: (ctx) => Math.min(ctx.viewportWidth, ctx.viewportHeight) / 100,\n  vmax: (ctx) => Math.max(ctx.viewportWidth, ctx.viewportHeight) / 100,\n  '%': (ctx) => ctx.parentSize / 100,\n}\n\nexport function convertValue(\n  value: number | string | undefined,\n  context?: ConversionContext\n): number | null {\n  if (typeof value === 'number') return value\n  if (typeof value !== 'string') return null\n\n  const parsed = parseUnit(value)\n  if (!parsed) return null\n\n  const { value: num, unit } = parsed\n\n  if (unit in ABSOLUTE_UNIT_CONVERSIONS) {\n    return num * ABSOLUTE_UNIT_CONVERSIONS[unit]\n  }\n\n  if (unit === 'auto') return null\n\n  const resolver = RELATIVE_UNIT_RESOLVERS[unit]\n  if (resolver) {\n    const ctx = { ...DEFAULT_CONTEXT, ...context }\n    return num * resolver(ctx)\n  }\n\n  return null\n}\n","export function clamp(value: number, min: number, max: number): number {\n  return Math.min(Math.max(value, min), max)\n}\n\ntype RowCountParams = {\n  height?: number\n  top: number\n  bottom: number\n  base: number\n}\n\nexport function calculateRowCount(params: RowCountParams): number {\n  const { height, top, bottom, base } = params\n  const totalHeight = (height ?? 0) - (top + bottom)\n  return Math.max(1, Math.floor(totalHeight / base))\n}\n","import { convertValue, type ConversionContext } from './convert'\nimport { clamp } from './math'\n\nexport interface NormalizationOptions {\n  base?: number\n  round?: boolean\n  clamp?: { min?: number; max?: number }\n  suppressWarnings?: boolean\n  context?: ConversionContext\n}\n\nexport function normalizeValue(\n  value: string | number | undefined,\n  options: NormalizationOptions = {}\n): number {\n  const {\n    base = 8,\n    round: doRound = true,\n    clamp: clampOptions,\n    context,\n  } = options\n\n  if (value === 'auto') return base\n\n  let num: number | null = null\n  if (typeof value === 'number') {\n    num = value\n  } else if (typeof value === 'string') {\n    num = convertValue(value, context) ?? base\n  }\n  if (num === null) num = base\n\n  if (base <= 0) return num\n\n  const normalized = doRound ? Math.round(num / base) * base : num\n\n  return clampOptions !== undefined\n    ? clamp(\n        normalized,\n        clampOptions.min ?? -Infinity,\n        clampOptions.max ?? Infinity\n      )\n    : normalized\n}\n\nexport function normalizeValuePair(\n  values:\n    [string | number | undefined, string | number | undefined] | undefined,\n  defaults: [number, number],\n  options?: NormalizationOptions\n): [number, number] {\n  if (!values) return defaults\n\n  if (values[0] === undefined && values[1] === undefined) {\n    return defaults\n  }\n\n  const first =\n    values[0] !== undefined ? normalizeValue(values[0], options) : defaults[0]\n  const second =\n    values[1] !== undefined ? normalizeValue(values[1], options) : defaults[1]\n  return [first, second]\n}\n","import type { DebuggingMode } from '../types'\n\n/**\n * Combines class names, filtering out falsy values.\n * Lightweight alternative to clsx/classnames.\n */\nexport const cx = (\n  ...classes: Array<string | boolean | undefined | null>\n): string => classes.filter(Boolean).join(' ').trim()\n\n/**\n * Resolves component debug/visibility state from prop and config.\n * Pure function — framework-agnostic.\n */\nexport interface DebugState {\n  isShown: boolean\n  isHidden: boolean\n  isNone: boolean\n  debugging: DebuggingMode | undefined\n}\n\nexport function resolveDebugState(\n  debuggingProp?: DebuggingMode,\n  debuggingConfig?: DebuggingMode\n): DebugState {\n  const effective = debuggingProp ?? debuggingConfig\n  return {\n    isShown: effective === 'visible',\n    isHidden: effective === 'hidden',\n    isNone: effective === 'none',\n    debugging: effective,\n  }\n}\n\nexport type StyleOverrideParams = {\n  key: string\n  value: string\n  defaultStyles: Record<string, string>\n  skipDimensions?: {\n    fitContent?: string[]\n    auto?: string[]\n    fullSize?: string[]\n  }\n}\n\nexport function createStyleOverride(\n  params: StyleOverrideParams | string,\n  value?: string,\n  defaultStyles?: Record<string, string>\n): Record<string, string> {\n  const key = typeof params === 'string' ? params : params.key\n  const val = typeof params === 'string' ? value! : params.value\n  const defaults =\n    typeof params === 'string' ? defaultStyles! : params.defaultStyles\n  const skipDimensions =\n    typeof params === 'object' ? params.skipDimensions : undefined\n\n  if (skipDimensions) {\n    if (skipDimensions.fitContent?.includes(key) && val === 'fit-content') {\n      return {}\n    }\n    if (skipDimensions.auto?.includes(key) && val === 'auto') {\n      return {}\n    }\n    if (\n      skipDimensions.fullSize?.includes(key) &&\n      (val === '100%' || val === '100vh' || val === '100vw')\n    ) {\n      return {}\n    }\n  }\n\n  return val !== defaults[key] ? { [key]: val } : {}\n}\n","import type { GuideColumnsPattern, GuideColumnValue } from '../types'\n\nconst UNIT_PATTERN =\n  /^\\d*\\.?\\d+(?:fr|px|%|em|rem|vh|vw|vmin|vmax|pt|pc|in|cm|mm)$/\n\nexport const isValidGuideColumnValue = (\n  value: unknown\n): value is GuideColumnValue => {\n  if (typeof value === 'number') return Number.isFinite(value) && value >= 0\n  if (typeof value !== 'string') return false\n  return value === 'auto' || value === '100%' || UNIT_PATTERN.test(value)\n}\n\nexport const isValidGuidePattern = (\n  pattern: unknown\n): pattern is GuideColumnsPattern =>\n  Array.isArray(pattern) &&\n  pattern.length > 0 &&\n  pattern.every(isValidGuideColumnValue)\n","import type { GuideConfig, GuideColumnsPattern } from '../types'\nimport { isValidGuidePattern } from '../validation/guide'\nimport { normalizeValue } from './normalize'\nimport { formatValue } from './parse'\nimport { convertValue, type ConversionContext } from './convert'\n\nexport interface GuideResult {\n  template: string\n  columnsCount: number\n  calculatedGap: number\n  isValid: boolean\n}\n\nconst INVALID_RESULT: GuideResult = {\n  template: 'none',\n  columnsCount: 0,\n  calculatedGap: 0,\n  isValid: false,\n}\n\n/**\n * Pure calculation of grid template from container width and guide config.\n * Framework-agnostic — can be used outside React.\n *\n * Sizing note: the `line` variant still reports the number of pixel tracks as\n * metadata, but React renders line guides with a CSS gradient so dense grids do\n * not allocate one DOM node per line.\n */\nexport function calculateGuideTemplate(\n  width: number,\n  config: GuideConfig,\n  context?: ConversionContext\n): GuideResult {\n  const variant = config.variant ?? 'line'\n  const base = config.base ?? 8\n  const gap = normalizeValue(config.gap ?? 0, { base, context })\n\n  if (!width) return INVALID_RESULT\n\n  switch (variant) {\n    case 'line': {\n      const finalGap = gap === 0 ? 0 : gap - 1\n      const actualGapWithLine = finalGap + 1\n\n      const columns =\n        finalGap === 0\n          ? Math.max(1, Math.floor(width) + 1)\n          : Math.max(1, Math.floor((width + 1) / actualGapWithLine) + 1)\n\n      return {\n        template: `repeat(${columns}, 1px)`,\n        columnsCount: columns,\n        calculatedGap: gap > 0 ? gap - 1 : gap,\n        isValid: true,\n      }\n    }\n\n    case 'pattern': {\n      if (!config.columns || !Array.isArray(config.columns)) {\n        return INVALID_RESULT\n      }\n\n      if (!isValidGuidePattern(config.columns)) {\n        return INVALID_RESULT\n      }\n\n      const columnsArr = (config.columns as GuideColumnsPattern).map((col) =>\n        typeof col === 'number' ? `${col}px` : col\n      )\n\n      if (columnsArr.some((c) => c === '0' || c === '0px')) {\n        return INVALID_RESULT\n      }\n\n      return {\n        template: columnsArr.join(' '),\n        columnsCount: columnsArr.length,\n        calculatedGap: gap,\n        isValid: true,\n      }\n    }\n\n    case 'fixed': {\n      const colCount = typeof config.columns === 'number' ? config.columns : 0\n      if (colCount < 1) return INVALID_RESULT\n\n      const colWidth = config.columnWidth\n        ? formatValue(config.columnWidth)\n        : '1fr'\n\n      return {\n        template: `repeat(${colCount}, ${colWidth})`,\n        columnsCount: colCount,\n        calculatedGap: gap,\n        isValid: true,\n      }\n    }\n\n    case 'auto': {\n      const colWidth = config.columnWidth ?? 'auto'\n      if (colWidth === 'auto') {\n        return {\n          template: 'repeat(auto-fill, minmax(0, 1fr))',\n          columnsCount: 1,\n          calculatedGap: gap,\n          isValid: true,\n        }\n      }\n\n      const colWidthStr =\n        typeof colWidth === 'number' ? `${colWidth}px` : colWidth.toString()\n      const pxVal = convertValue(colWidthStr, context) ?? 0\n      const columns =\n        pxVal > 0 ? Math.max(1, Math.floor((width + gap) / (pxVal + gap))) : 1\n\n      return {\n        template: `repeat(auto-fill, ${colWidthStr})`,\n        columnsCount: columns,\n        calculatedGap: gap,\n        isValid: true,\n      }\n    }\n\n    default: {\n      const columns = Math.max(1, Math.floor(width / (gap + 1)) + 1)\n      return {\n        template: `repeat(${columns}, 1px)`,\n        columnsCount: columns,\n        calculatedGap: gap,\n        isValid: true,\n      }\n    }\n  }\n}\n\nexport const createGridSpanStyles = (\n  span?: number,\n  colSpan?: number,\n  rowSpan?: number\n): Record<string, string> => {\n  const gridStyles: Record<string, string> = {}\n\n  if (span !== undefined) {\n    gridStyles.gridColumn = `span ${span}`\n    gridStyles.gridRow = `span ${span}`\n  } else {\n    if (colSpan !== undefined) {\n      gridStyles.gridColumn = `span ${colSpan}`\n    }\n    if (rowSpan !== undefined) {\n      gridStyles.gridRow = `span ${rowSpan}`\n    }\n  }\n\n  return gridStyles\n}\n","import type { GuideVariant, GuideConfig } from '../types'\nimport { formatValue, createStyleOverride } from '../utils'\n\nexport interface GuideDescriptorParams {\n  base: number\n  colors: Record<GuideVariant, string>\n  variant: GuideVariant\n  align: string\n  width?: number | string\n  height?: number | string\n  columnWidth?: number | string\n  maxWidth?: number | string\n  color?: string\n  /** Pre-computed guide template result (from useGuide or calculateGuideTemplate) */\n  template: string\n  columnsCount: number\n  calculatedGap: number\n  isVisible: boolean\n}\n\nexport interface GuideDescriptor {\n  containerStyle: Record<string, string>\n  columnColor: string\n  columnsCount: number\n  calculatedGap: number\n  template: string\n  isVisible: boolean\n  isLineVariant: boolean\n  classTokens: string[]\n}\n\nexport interface GuideConfigParams {\n  variant: GuideVariant\n  base: number\n  gap: number\n  columns?: number | readonly (string | number | undefined | 'auto')[]\n  columnWidth?: number | string\n}\n\n/**\n * Creates a GuideConfig from component props.\n * Pure function — no React or DOM dependency.\n */\nexport function createGuideConfig({\n  variant,\n  base,\n  gap,\n  columns,\n  columnWidth,\n}: GuideConfigParams): GuideConfig {\n  switch (variant) {\n    case 'line':\n      return { variant: 'line', gap, base }\n    case 'pattern':\n      if (columns && Array.isArray(columns)) {\n        return {\n          variant: 'pattern',\n          columns: columns as readonly (string | number)[],\n          gap,\n          base,\n        }\n      }\n      break\n    case 'fixed':\n      if (columns !== undefined) {\n        const parsed =\n          typeof columns === 'number' ? columns : parseInt(String(columns), 10)\n        return {\n          variant: 'fixed',\n          columns: !isNaN(parsed) ? parsed : 12,\n          columnWidth: columnWidth || '60px',\n          gap,\n          base,\n        }\n      }\n      break\n  }\n  return { variant: 'auto', columnWidth: columnWidth || '1fr', gap, base }\n}\n\nconst GUIDE_DEFAULTS = (\n  base: number,\n  lineColor: string\n): Record<string, string> => ({\n  '--bkgd-w': '100%',\n  '--bkgd-h': '100%',\n  '--bkgd-mw': 'none',\n  '--bkgd-cw': '60px',\n  '--bkgd-gw': '24px',\n  '--bkgd-n': '12',\n  '--bkgd-b': `${base}px`,\n  '--bkgd-cl': lineColor,\n  '--bkgd-g': '0',\n})\n\n/**\n * Computes all styles and data needed to render a Guide component.\n * Pure function — framework-agnostic.\n */\nexport function createGuideDescriptor(\n  params: GuideDescriptorParams\n): GuideDescriptor {\n  const {\n    base,\n    colors,\n    variant,\n    align,\n    width,\n    height,\n    columnWidth,\n    maxWidth,\n    color,\n    template,\n    columnsCount,\n    calculatedGap,\n    isVisible,\n  } = params\n\n  const defaultStyles = GUIDE_DEFAULTS(base, colors.line)\n  const containerStyle: Record<string, string> = {\n    // Config is wrapperless, so every guide color channel must travel with\n    // the consuming guide rather than relying on root CSS variables.\n    '--bkgd-cl': color ?? colors.line,\n    '--bkgd-cp': color ?? colors.pattern,\n    '--bkgd-ca': color ?? colors.auto,\n    '--bkgd-cf': color ?? colors.fixed,\n    // Always declare the containing-block default and preserve explicit CSS\n    // dimensions. A viewport size is not equivalent to 100% of the parent.\n    '--bkgd-w': formatValue(width ?? '100%'),\n    '--bkgd-h': formatValue(height ?? '100%'),\n    ...createStyleOverride({\n      key: '--bkgd-mw',\n      value: formatValue(maxWidth || 'none'),\n      defaultStyles,\n    }),\n    ...createStyleOverride({\n      key: '--bkgd-cw',\n      value: formatValue(columnWidth || '60px'),\n      defaultStyles,\n    }),\n    ...createStyleOverride({\n      key: '--bkgd-n',\n      value: `${columnsCount}`,\n      defaultStyles,\n    }),\n    ...createStyleOverride({ key: '--bkgd-b', value: '0', defaultStyles }),\n    ...createStyleOverride({\n      key: '--bkgd-cl',\n      value: color ?? colors.line,\n      defaultStyles,\n    }),\n    ...createStyleOverride({\n      key: '--bkgd-g',\n      value: `${calculatedGap}px`,\n      defaultStyles,\n    }),\n    ...createStyleOverride({\n      key: '--bkgd-j',\n      value: align || 'center',\n      defaultStyles,\n    }),\n    // CSS module resolves grid-template-columns from --bkgd-t, so the inline\n    // gridTemplateColumns property would be redundant.\n    ...(template && template !== 'none' ? { '--bkgd-t': template } : {}),\n  }\n\n  const columnColor =\n    color ??\n    (variant && variant in colors\n      ? colors[variant as keyof typeof colors]\n      : undefined) ??\n    colors.line\n\n  const isLineVariant = variant === 'line'\n  const classTokens = ['gde', isVisible ? 'v' : 'h']\n  if (isLineVariant) classTokens.push('line')\n\n  if (isLineVariant) {\n    containerStyle['--bkgd-line-color'] = 'var(--bkgd-cl)'\n    containerStyle['--bkgd-line-period'] = `${calculatedGap + 1}px`\n  }\n\n  return {\n    containerStyle,\n    columnColor,\n    columnsCount,\n    calculatedGap,\n    template,\n    isVisible,\n    isLineVariant,\n    classTokens,\n  }\n}\n","import { useMemo } from 'react'\nimport type { ConfigSchema } from '@baseline-kit/core/config/schema'\nimport { useDefaultConfig } from '../components/Config/Config'\n\n/** Type helper that merges base configuration with component-specific settings. */\nexport type ComponentConfig<K extends keyof ConfigSchema> = ConfigSchema[K] & {\n  base: number\n}\n\n/**\n * Hook for accessing component-specific theme configuration.\n */\nexport function useConfig<K extends keyof ConfigSchema>(\n  component: K\n): ComponentConfig<K> {\n  const defaultConfig = useDefaultConfig()\n  return useMemo(() => {\n    return Object.assign(\n      { base: defaultConfig.base },\n      defaultConfig[component]\n    ) as ComponentConfig<K>\n  }, [defaultConfig, component])\n}\n","import { useMemo } from 'react'\nimport { resolveDebugState } from '@baseline-kit/core/utils/merge'\nimport type { DebuggingMode } from '@baseline-kit/core/types'\n\n/**\n * Hook for managing component debug state and visibility.\n * Delegates to pure resolveDebugState in core.\n */\nexport function useDebug(\n  debuggingProp?: DebuggingMode,\n  debuggingConfig?: DebuggingMode\n) {\n  return useMemo(\n    () => resolveDebugState(debuggingProp, debuggingConfig),\n    [debuggingProp, debuggingConfig]\n  )\n}\n","export const debounce = <T extends (...args: unknown[]) => void>(\n  fn: T,\n  delay: number\n): [T, () => void] => {\n  let timer: ReturnType<typeof setTimeout> | null = null\n\n  const cancel = () => {\n    if (timer) {\n      clearTimeout(timer)\n      timer = null\n    }\n  }\n\n  const debounced = ((...args) => {\n    cancel()\n    timer = setTimeout(() => fn(...args), delay)\n  }) as T\n\n  return [debounced, cancel]\n}\n\nexport const rafThrottle = <T extends (...args: never[]) => void>(\n  fn: T\n): [T, () => void] => {\n  let rafId: number | null = null\n  let lastArgs: Parameters<T> | null = null\n\n  const cancel = () => {\n    if (rafId !== null) {\n      cancelAnimationFrame(rafId)\n      rafId = null\n      lastArgs = null\n    }\n  }\n\n  const throttled = (...args: Parameters<T>) => {\n    lastArgs = args\n\n    if (rafId !== null) {\n      cancelAnimationFrame(rafId)\n    }\n\n    rafId = requestAnimationFrame(() => {\n      fn(...lastArgs!)\n      rafId = null\n      lastArgs = null\n    })\n  }\n\n  return [throttled as T, cancel]\n}\n","/**\n * Element measurement observer.\n */\n\nimport { rafThrottle } from './timing'\n\nexport interface MeasureRect {\n  width: number\n  height: number\n}\n\nexport interface MeasureObserverHandle {\n  /** Force an immediate re-measure */\n  refresh(): void\n  /** Stop observing */\n  disconnect(): void\n}\n\n/**\n * Observes an element's dimensions via ResizeObserver.\n * Calls `onChange` with rounded width/height whenever the size changes.\n */\nexport function createMeasureObserver(\n  el: Element,\n  onChange: (rect: MeasureRect) => void\n): MeasureObserverHandle {\n  let prev: MeasureRect = { width: 0, height: 0 }\n\n  const measure = () => {\n    try {\n      const rect = el.getBoundingClientRect()\n      const next: MeasureRect = {\n        width: Math.round(rect.width),\n        height: Math.round(rect.height),\n      }\n      if (next.width !== prev.width || next.height !== prev.height) {\n        prev = next\n        onChange(next)\n      }\n    } catch {\n      // element may have been removed\n    }\n  }\n\n  const [throttledMeasure, cancelMeasure] = rafThrottle(measure)\n\n  // Initial measurement\n  measure()\n\n  const observer = new ResizeObserver(throttledMeasure)\n  observer.observe(el)\n\n  return {\n    refresh: throttledMeasure,\n    disconnect() {\n      observer.disconnect()\n      cancelMeasure()\n    },\n  }\n}\n","import * as React from 'react'\nimport { createMeasureObserver } from '@baseline-kit/dom/measure'\nimport type { MeasureRect } from '@baseline-kit/dom/measure'\n\nexport interface MeasureResult extends MeasureRect {\n  refresh: () => void\n}\n\nconst ZERO: MeasureRect = { width: 0, height: 0 }\n\n/**\n * Hook for measuring and tracking DOM element dimensions.\n * Thin wrapper around the imperative createMeasureObserver from @baseline-kit/dom.\n */\nexport function useMeasure(\n  ref: React.RefObject<HTMLElement | null>\n): MeasureResult {\n  const [dimensions, setDimensions] = React.useState<MeasureRect>(ZERO)\n  const handleRef = React.useRef<ReturnType<\n    typeof createMeasureObserver\n  > | null>(null)\n\n  React.useLayoutEffect(() => {\n    if (typeof window === 'undefined' || !ref.current) return\n\n    const handle = createMeasureObserver(ref.current, (rect) => {\n      setDimensions((prev) =>\n        prev.width === rect.width && prev.height === rect.height ? prev : rect\n      )\n    })\n    handleRef.current = handle\n\n    return () => {\n      handle.disconnect()\n      handleRef.current = null\n    }\n  }, [ref])\n\n  const refresh = React.useCallback(() => {\n    handleRef.current?.refresh()\n  }, [])\n\n  return { ...dimensions, refresh }\n}\n","import type { ConversionContext } from '@baseline-kit/core'\n\n/**\n * Returns the current browser viewport for vw/vh/vmin/vmax conversion.\n * Returns an empty object on the server so callers fall back to the\n * core defaults without crashing.\n */\nexport function getViewportContext(): Partial<ConversionContext> {\n  if (typeof window === 'undefined') return {}\n  return {\n    viewportWidth: window.innerWidth,\n    viewportHeight: window.innerHeight,\n  }\n}\n","import * as React from 'react'\nimport type { GuideConfig } from '@baseline-kit/core/types'\nimport { calculateGuideTemplate } from '@baseline-kit/core/utils/grid'\nimport { getViewportContext } from '@baseline-kit/dom/viewport'\nimport { useMeasure } from './useMeasure'\n\nexport type { GuideResult } from '@baseline-kit/core/utils/grid'\n\n/**\n * Hook for calculating grid layout parameters based on container dimensions.\n */\nexport function useGuide(\n  ref: React.RefObject<HTMLElement | null>,\n  config: GuideConfig\n) {\n  const { width } = useMeasure(ref)\n  return React.useMemo(\n    () => calculateGuideTemplate(width, config, getViewportContext()),\n    [config, width]\n  )\n}\n","import { useEffect, useState } from 'react'\n\n/**\n * Hook to determine if the code is running on the client side.\n */\nexport function useIsClient() {\n  const [isClient, setIsClient] = useState(false)\n\n  useEffect(() => {\n    setIsClient(true)\n  }, [])\n\n  return isClient\n}\n","/**\n * React-specific SSR utilities (ClientOnly component)\n */\nimport * as React from 'react'\nimport { useIsClient } from '../hooks/useIsClient'\n\ninterface ClientOnlyProps {\n  children: React.ReactNode\n  fallback?: React.ReactNode\n}\n\n/**\n * A utility component that only renders its children on the client side.\n * @internal Not part of the public API\n */\nexport function ClientOnly({ children, fallback = null }: ClientOnlyProps) {\n  const isClient = useIsClient()\n\n  if (!isClient) {\n    return <>{fallback}</>\n  }\n\n  return <>{children}</>\n}\n","import * as React from 'react'\n\n/**\n * Combines descriptor style records and React style objects.\n * Accepts Record<string, string> from descriptors and React.CSSProperties.\n */\nexport function mergeStyles(\n  ...styles: Array<Record<string, string> | React.CSSProperties | undefined>\n): React.CSSProperties {\n  return Object.assign({}, ...styles.filter(Boolean))\n}\n\n/**\n * Merges multiple React refs into a single callback ref.\n */\nexport function mergeRefs<T>(\n  ...refs: Array<React.Ref<T> | null | undefined>\n): React.RefCallback<T> {\n  return (node: T | null) => {\n    refs.forEach((ref) => {\n      if (!ref) return\n      if (typeof ref === 'function') {\n        ref(node)\n      } else {\n        Object.assign(ref, { current: node })\n      }\n    })\n  }\n}\n",".gde {\n  position: absolute;\n  inset: 0;\n  box-sizing: border-box;\n  width: var(--bkgd-w, 100%);\n  height: var(--bkgd-h, 100%);\n  max-width: var(--bkgd-mw, none);\n  margin-inline: auto;\n  pointer-events: none;\n  padding: var(--bkgd-pb, 0) var(--bkgd-pi, 0);\n}\n\n.v {\n  opacity: 1;\n  visibility: visible;\n  transition:\n    opacity var(--bk-transition-base),\n    visibility 0ms linear;\n}\n\n.h {\n  opacity: 0;\n  visibility: hidden;\n  transition:\n    opacity var(--bk-transition-base),\n    visibility 0ms linear 180ms;\n}\n\n.line {\n  left: -0.5px; /* Alignment correction for line variant */\n}\n\n.cols {\n  position: absolute;\n  inset: 0;\n  display: grid;\n  column-gap: var(--bkgd-g);\n  grid-template-rows: 1fr;\n  grid-template-columns: var(--bkgd-t);\n  justify-content: var(--bkgd-j);\n  width: var(--bk-wf);\n  height: var(--bk-hf);\n  overflow: hidden;\n  contain: layout style paint;\n}\n\n.col {\n  min-width: 0;\n  width: var(--bk-wf);\n  height: var(--bk-hf);\n}\n\n/* Variant-specific styles */\n.col[data-variant='line'] {\n  width: 1px;\n  background-color: var(--bkgd-cl);\n}\n\n.cols[data-variant='line'] {\n  display: block;\n  background-image: repeating-linear-gradient(\n    to right,\n    var(--bkgd-line-color, var(--bkgd-cl)) 0 1px,\n    transparent 1px var(--bkgd-line-period, 1px)\n  );\n}\n\n.col[data-variant='pattern'] {\n  background-color: var(--bkgd-cp);\n}\n\n.col[data-variant='auto'] {\n  background-color: var(--bkgd-ca);\n  overflow: hidden;\n}\n\n.col[data-variant='fixed'] {\n  background-color: var(--bkgd-cf);\n}\n\n/* Style for SSR rendering */\n.ssr {\n  box-sizing: border-box;\n  z-index: 1;\n  pointer-events: none;\n}\n","import * as React from 'react'\nimport type { ComponentsProps } from '../types'\nimport { useConfig } from '../../hooks/useConfig'\nimport { useDebug } from '../../hooks/useDebug'\nimport { useMeasure } from '../../hooks/useMeasure'\nimport { useGuide } from '../../hooks/useGuide'\nimport { cx } from '@baseline-kit/core/utils/merge'\nimport {\n  createGuideDescriptor,\n  createGuideConfig,\n} from '@baseline-kit/core/descriptors/guide'\nimport type { GuideVariant, GuideConfig } from '@baseline-kit/core/types'\nimport { ClientOnly } from '../../utils/ssr'\nimport { mergeStyles } from '../../utils/merge'\nimport styles from './styles.module.css'\n\nexport type { GuideConfig }\n\nexport type GuideProps = {\n  align?: React.CSSProperties['justifyContent']\n  variant?: GuideVariant\n  columns?: number | readonly (string | number | undefined | 'auto')[]\n  columnWidth?: React.CSSProperties['width']\n  maxWidth?: React.CSSProperties['maxWidth']\n  color?: React.CSSProperties['color']\n  children?: React.ReactNode\n  gap?: number\n  ssrMode?: boolean\n} & ComponentsProps &\n  Omit<GuideConfig, 'columns' | 'columnWidth' | 'gap'>\n\nexport const Guide = React.memo(function Guide({\n  className,\n  debugging,\n  style,\n  variant: variantProp,\n  align = 'center',\n  gap: gapProp,\n  height,\n  width,\n  columns,\n  columnWidth,\n  maxWidth,\n  color,\n  children,\n  ssrMode = false,\n  ...props\n}: GuideProps) {\n  const config = useConfig('guide')\n  const variant = variantProp ?? config.variant\n  const gap = typeof gapProp === 'number' ? gapProp : 0\n  const { isShown } = useDebug(debugging, config.debugging)\n\n  if (!isShown) {\n    return (\n      <div\n        className={cx(styles.gde, styles.h, className)}\n        style={style}\n        data-testid=\"guide\"\n        data-variant={variant}\n        aria-hidden=\"true\"\n        {...props}\n      >\n        {children}\n      </div>\n    )\n  }\n\n  const ssrFallback = (\n    <div\n      className={cx(styles.gde, styles.h, styles.ssr, className)}\n      style={{\n        width: width ?? '100%',\n        height: height ?? '100%',\n        maxWidth: maxWidth ?? 'none',\n        ...style,\n      }}\n      data-testid=\"guide\"\n      data-variant={variant}\n      aria-hidden=\"true\"\n    >\n      {children}\n    </div>\n  )\n\n  if (ssrMode) {\n    return ssrFallback\n  }\n\n  return (\n    <ClientOnly fallback={ssrFallback}>\n      <GuideImpl\n        className={className}\n        debugging={debugging}\n        style={style}\n        variant={variant}\n        align={align}\n        gap={gap}\n        height={height}\n        width={width}\n        columns={columns}\n        columnWidth={columnWidth}\n        maxWidth={maxWidth}\n        color={color}\n        {...props}\n      >\n        {children}\n      </GuideImpl>\n    </ClientOnly>\n  )\n})\n\nconst GuideImpl = React.memo(function GuideImpl({\n  className,\n  debugging,\n  style,\n  variant,\n  align = 'center',\n  gap,\n  height,\n  width,\n  columns,\n  columnWidth,\n  maxWidth,\n  color,\n  children,\n  ...props\n}: GuideProps) {\n  const config = useConfig('guide')\n  const { isShown } = useDebug(debugging, config.debugging)\n  const containerRef = React.useRef<HTMLDivElement | null>(null)\n  useMeasure(containerRef)\n\n  const resolvedVariant = (variant ?? config.variant) as GuideVariant\n  const resolvedGap = typeof gap === 'number' ? gap : 0\n\n  const gridConfig = React.useMemo(\n    () =>\n      createGuideConfig({\n        variant: resolvedVariant,\n        base: config.base,\n        gap: resolvedGap,\n        columns,\n        columnWidth: columnWidth as number | string | undefined,\n      }),\n    [resolvedVariant, config.base, resolvedGap, columns, columnWidth]\n  )\n\n  const { template, columnsCount, calculatedGap } = useGuide(\n    containerRef,\n    gridConfig\n  )\n\n  const descriptor = React.useMemo(\n    () =>\n      createGuideDescriptor({\n        base: config.base,\n        colors: config.colors,\n        variant: resolvedVariant,\n        align: align || 'center',\n        width,\n        height,\n        columnWidth,\n        maxWidth,\n        color,\n        template,\n        columnsCount,\n        calculatedGap,\n        isVisible: isShown,\n      }),\n    [\n      config.base,\n      config.colors,\n      resolvedVariant,\n      align,\n      width,\n      height,\n      columnWidth,\n      maxWidth,\n      color,\n      template,\n      columnsCount,\n      calculatedGap,\n      isShown,\n    ]\n  )\n\n  const containerStyles = React.useMemo(\n    () => mergeStyles(descriptor.containerStyle, style),\n    [descriptor.containerStyle, style]\n  )\n\n  return (\n    <div\n      ref={containerRef}\n      data-testid=\"guide\"\n      aria-hidden=\"true\"\n      className={cx(...descriptor.classTokens.map((t) => styles[t]), className)}\n      data-variant={variant}\n      style={containerStyles}\n      {...props}\n    >\n      {isShown && (\n        <div className={styles.cols} data-variant={variant}>\n          {!descriptor.isLineVariant &&\n            Array.from({ length: descriptor.columnsCount }, (_, i) => (\n              <div\n                key={i}\n                className={styles.col}\n                data-column-index={i}\n                data-variant={variant}\n              />\n            ))}\n        </div>\n      )}\n      {children}\n    </div>\n  )\n})\n"],"mappings":"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"}

package/dist/guide.css

@@ -1,2 +1,2 @@
-:root{--bk-base:8px;--bk-zi:1;--bk-zio:2;--bk-transition-base:.18s ease;--bk-width-default:fit-content;--bk-height-default:fit-content;--bk-wf:100%;--bk-hf:100%;--bkbx-b:var(--bk-base);--bkbx-w:var(--bk-width-default);--bkbx-h:var(--bk-height-default);--bkbx-cl:var(--bk-box-color-line-theme,#a329a399);--bkbx-cf:var(--bk-box-color-flat-theme,#96f3);--bkbx-ct:var(--bk-box-color-text-theme,#a329a3e6);--bkbl-w:100%;--bkbl-h:100%;--bkbl-rt:0;--bkbl-rh:1px;--bkbl-cl:var(--bk-baseline-color-line-theme,#2929a326);--bkbl-cf:var(--bk-baseline-color-flat-theme,#667fff33);--bkgd-w:100vw;--bkgd-h:100vh;--bkgd-g:var(--bk-base);--bkgd-j:center;--bkgd-t:auto;--bkgd-pb:0;--bkgd-pi:0;--bkgd-cl:var(--bk-guide-color-line-theme,#2929a326);--bkgd-cp:var(--bk-guide-color-pattern-theme,#667fff33);--bkgd-ca:var(--bk-guide-color-auto-theme,#66ccff26);--bkgd-cf:var(--bk-guide-color-fixed-theme,#66ccff26);--bkpd-w:var(--bk-width-default);--bkpd-h:var(--bk-height-default);--bkpd-c:var(--bk-padder-color-theme,#6629a399);--bksp-w:var(--bk-wf);--bksp-h:var(--bk-hf);--bksp-cl:var(--bk-spacer-color-line-theme,#6629a399);--bksp-cf:var(--bk-spacer-color-flat-theme,#667fff33);--bksp-ct:var(--bk-spacer-color-text-theme,#6629a3)}.gde_4PKz3{box-sizing:border-box;width:var(--bkgd-w,100%);height:var(--bkgd-h,100%);max-width:var(--bkgd-mw,none);pointer-events:none;padding:var(--bkgd-pb,0) var(--bkgd-pi,0);margin-inline:auto;position:absolute;inset:0}.v_yAvN0{opacity:1;visibility:visible;transition:opacity var(--bk-transition-base), visibility 0s linear}.h_XcWcy{opacity:0;visibility:hidden;transition:opacity var(--bk-transition-base), visibility 0s linear .18s}.line_UaLjW{left:-.5px}.cols_ibtT4{column-gap:var(--bkgd-g);grid-template-rows:1fr;grid-template-columns:var(--bkgd-t);justify-content:var(--bkgd-j);width:var(--bk-wf);height:var(--bk-hf);contain:layout style paint;display:grid;position:absolute;inset:0;overflow:hidden}.col_QPSDI{min-width:0;width:var(--bk-wf);height:var(--bk-hf)}.col_QPSDI[data-variant=line]{background-color:var(--bkgd-cl);width:1px}.cols_ibtT4[data-variant=line]{background-image:repeating-linear-gradient(to right, var(--bkgd-line-color,var(--bkgd-cl)) 0 1px, transparent 1px var(--bkgd-line-period,1px));display:block}.col_QPSDI[data-variant=pattern]{background-color:var(--bkgd-cp)}.col_QPSDI[data-variant=auto]{background-color:var(--bkgd-ca);overflow:hidden}.col_QPSDI[data-variant=fixed]{background-color:var(--bkgd-cf)}.ssr_4UN4k{box-sizing:border-box;z-index:1;pointer-events:none;min-height:100px;display:grid;position:relative}
+:root{--bk-base:8px;--bk-zi:1;--bk-zio:2;--bk-transition-base:.18s ease;--bk-width-default:fit-content;--bk-height-default:fit-content;--bk-wf:100%;--bk-hf:100%;--bkbx-b:var(--bk-base);--bkbx-w:var(--bk-width-default);--bkbx-h:var(--bk-height-default);--bkbx-cl:var(--bk-box-color-line-theme,#a329a399);--bkbx-cf:var(--bk-box-color-flat-theme,#96f3);--bkbx-ct:var(--bk-box-color-text-theme,#a329a3e6);--bkbl-w:100%;--bkbl-h:100%;--bkbl-rt:0;--bkbl-rh:1px;--bkbl-cl:var(--bk-baseline-color-line-theme,#2929a326);--bkbl-cf:var(--bk-baseline-color-flat-theme,#667fff33);--bkgd-w:100vw;--bkgd-h:100vh;--bkgd-g:var(--bk-base);--bkgd-j:center;--bkgd-t:auto;--bkgd-pb:0;--bkgd-pi:0;--bkgd-cl:var(--bk-guide-color-line-theme,#2929a326);--bkgd-cp:var(--bk-guide-color-pattern-theme,#667fff33);--bkgd-ca:var(--bk-guide-color-auto-theme,#66ccff26);--bkgd-cf:var(--bk-guide-color-fixed-theme,#66ccff26);--bkpd-w:var(--bk-width-default);--bkpd-h:var(--bk-height-default);--bkpd-c:var(--bk-padder-color-theme,#6629a399);--bksp-w:var(--bk-wf);--bksp-h:var(--bk-hf);--bksp-cl:var(--bk-spacer-color-line-theme,#6629a399);--bksp-cf:var(--bk-spacer-color-flat-theme,#667fff33);--bksp-ct:var(--bk-spacer-color-text-theme,#6629a3)}.gde_4PKz3{box-sizing:border-box;width:var(--bkgd-w,100%);height:var(--bkgd-h,100%);max-width:var(--bkgd-mw,none);pointer-events:none;padding:var(--bkgd-pb,0) var(--bkgd-pi,0);margin-inline:auto;position:absolute;inset:0}.v_yAvN0{opacity:1;visibility:visible;transition:opacity var(--bk-transition-base), visibility 0s linear}.h_XcWcy{opacity:0;visibility:hidden;transition:opacity var(--bk-transition-base), visibility 0s linear .18s}.line_UaLjW{left:-.5px}.cols_ibtT4{column-gap:var(--bkgd-g);grid-template-rows:1fr;grid-template-columns:var(--bkgd-t);justify-content:var(--bkgd-j);width:var(--bk-wf);height:var(--bk-hf);contain:layout style paint;display:grid;position:absolute;inset:0;overflow:hidden}.col_QPSDI{min-width:0;width:var(--bk-wf);height:var(--bk-hf)}.col_QPSDI[data-variant=line]{background-color:var(--bkgd-cl);width:1px}.cols_ibtT4[data-variant=line]{background-image:repeating-linear-gradient(to right, var(--bkgd-line-color,var(--bkgd-cl)) 0 1px, transparent 1px var(--bkgd-line-period,1px));display:block}.col_QPSDI[data-variant=pattern]{background-color:var(--bkgd-cp)}.col_QPSDI[data-variant=auto]{background-color:var(--bkgd-ca);overflow:hidden}.col_QPSDI[data-variant=fixed]{background-color:var(--bkgd-cf)}.ssr_4UN4k{box-sizing:border-box;z-index:1;pointer-events:none}
 /*$vite$:1*/

package/dist/guide.d.ts

@@ -1,4 +1,3 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 
 /**
@@ -84,15 +83,22 @@ type ConfigSchema = {
     };
 };
 
-type MergeConfigParams = {
-    parentConfig: ConfigSchema;
+type PartialColors<T> = T extends {
+    colors: infer Colors;
+} ? Omit<Partial<T>, 'colors'> & {
+    colors?: Partial<Colors>;
+} : Partial<T>;
+type ConfigOverrides = {
     base?: number;
-    baseline?: Partial<ConfigSchema['baseline']>;
-    guide?: Partial<ConfigSchema['guide']>;
-    spacer?: Partial<ConfigSchema['spacer']>;
-    box?: Partial<ConfigSchema['box']>;
+    baseline?: PartialColors<ConfigSchema['baseline']>;
+    guide?: PartialColors<ConfigSchema['guide']>;
+    spacer?: PartialColors<ConfigSchema['spacer']>;
+    box?: PartialColors<ConfigSchema['box']>;
     padder?: Partial<ConfigSchema['padder']>;
 };
+type MergeConfigParams = ConfigOverrides & {
+    parentConfig: ConfigSchema;
+};
 declare const mergeConfig: (params: MergeConfigParams) => ConfigSchema;
 type CSSVariablesParams = {
     base: number;
@@ -104,19 +110,13 @@ type CSSVariablesParams = {
 };
 declare const createCSSVariables: (params: CSSVariablesParams) => Record<string, string>;
 
-type ConfigProps = {
+type ConfigProps = ConfigOverrides & {
     children: React.ReactNode;
-    base?: number;
-    baseline?: Partial<ConfigSchema['baseline']>;
-    guide?: Partial<ConfigSchema['guide']>;
-    spacer?: Partial<ConfigSchema['spacer']>;
-    box?: Partial<ConfigSchema['box']>;
-    padder?: Partial<ConfigSchema['padder']>;
 };
 /**
  * Configuration provider for baseline-kit components.
  */
-declare function Config({ children, base, baseline, guide, spacer, box, padder, }: ConfigProps): react_jsx_runtime.JSX.Element;
+declare function Config({ children, base, baseline, guide, spacer, box, padder, }: ConfigProps): React.JSX.Element;
 
 /**
  * Common props shared across library components.
@@ -140,7 +140,7 @@ type GuideProps = {
     gap?: number;
     ssrMode?: boolean;
 } & ComponentsProps & Omit<GuideConfig, 'columns' | 'columnWidth' | 'gap'>;
-declare const Guide: React.NamedExoticComponent<GuideProps>;
+declare const Guide: React.MemoExoticComponent<({ className, debugging, style, variant: variantProp, align, gap: gapProp, height, width, columns, columnWidth, maxWidth, color, children, ssrMode, ...props }: GuideProps) => React.JSX.Element>;
 
 export { Config, Guide, createCSSVariables, mergeConfig };
 export type { ConfigSchema, DebuggingMode, GuideConfig, GuideProps, GuideVariant };