baseline-kit 2.0.0 → 2.0.1

package/README.md

@@ -71,7 +71,6 @@ function App() {
       {/* Box with baseline alignment */}
       <Box
         block={[2, 5]}
-        inline={1}
         debugging="visible"
       >
         <h1>Content Aligned to the Grid</h1>
@@ -91,7 +90,7 @@ The base unit is the foundation of Baseline Kit's spacing system. All measuremen
 unit:
 
 ```tsx
-<Config base={8}>     // Sets 8px as the base unit
+<Config base={8}> // Sets 8px as the base unit
   <Layout
     block={17}        // Will be rounded to 16px (2 * base)
     inline={22}       // Will be rounded to 24px (3 * base)
@@ -210,7 +209,6 @@ The Config component provides theme and debugging settings to all child componen
 ```tsx
 <Box
   block={[2, 5]}         // Vertical padding in base units (auto-adjusted for baseline)
-  inline={1}             // Horizontal padding in base units
   span={2}               // Grid column span when used in Layout
   snapping="height"      // "none", "height", or "clamp"
   debugging="visible"    // Show alignment guides

package/dist/README.md

@@ -71,7 +71,6 @@ function App() {
       {/* Box with baseline alignment */}
       <Box
         block={[2, 5]}
-        inline={1}
         debugging="visible"
       >
         <h1>Content Aligned to the Grid</h1>
@@ -91,7 +90,7 @@ The base unit is the foundation of Baseline Kit's spacing system. All measuremen
 unit:
 
 ```tsx
-<Config base={8}>     // Sets 8px as the base unit
+<Config base={8}> // Sets 8px as the base unit
   <Layout
     block={17}        // Will be rounded to 16px (2 * base)
     inline={22}       // Will be rounded to 24px (3 * base)
@@ -210,7 +209,6 @@ The Config component provides theme and debugging settings to all child componen
 ```tsx
 <Box
   block={[2, 5]}         // Vertical padding in base units (auto-adjusted for baseline)
-  inline={1}             // Horizontal padding in base units
   span={2}               // Grid column span when used in Layout
   snapping="height"      // "none", "height", or "clamp"
   debugging="visible"    // Show alignment guides

package/dist/components/Baseline/Baseline.d.ts

@@ -3,6 +3,7 @@
  * @description Horizontal grid overlay for baseline alignment
  * @module components
  */
+import * as React from 'react';
 import { ComponentsProps } from '@components';
 import { Variant } from '../types';
 export type BaselineVariant = Exclude<Variant, 'pattern'>;
@@ -45,4 +46,4 @@ export type BaselineProps = {
  * />
  * ```
  */
-export declare const Baseline: import("react").NamedExoticComponent<BaselineProps>;
+export declare const Baseline: React.NamedExoticComponent<BaselineProps>;

package/dist/components/Box/Box.d.ts

@@ -23,7 +23,7 @@ export type SnappingMode = 'none' | 'height' | 'clamp';
  * - Offers configurable snapping modes for fine-grained alignment control
  * - Includes debug overlays for visual alignment verification
  *
- * By default, Box uses "fit-content" for both width and height unless explicitly specified.
+ * By default, Box uses "auto" for both width and height unless explicitly specified.
  *
  * @example
  * ```tsx

package/dist/components/Config/Config.d.ts

@@ -22,7 +22,7 @@ type Colors = {
     /** Color for flat surface visuals */
     flat: string;
     /** Color for measurement indicators */
-    indice: string;
+    text: string;
 };
 /** Complete configuration schema for baseline-kit. */
 export type Config = {

package/dist/components/Guide/Guide.d.ts

@@ -3,6 +3,7 @@
  * @description Visual grid overlay component for alignment and debugging
  * @module components
  */
+import * as React from 'react';
 import { AutoConfig, FixedConfig, LineConfig, PatternConfig } from './types';
 import type { ComponentsProps } from '../types';
 /** Merged configuration types that support various grid layout strategies */
@@ -57,4 +58,4 @@ export type GuideProps = {
  * />
  * ```
  */
-export declare const Guide: import("react").NamedExoticComponent<GuideProps>;
+export declare const Guide: React.NamedExoticComponent<GuideProps>;

package/dist/components/Layout/Layout.d.ts

@@ -41,7 +41,7 @@ export type LayoutProps = {
  * - Offers comprehensive alignment controls
  * - Provides debug overlays for visual verification
  *
- * When no explicit dimensions are provided, Layout defaults to "fit-content"
+ * When no explicit dimensions are provided, Layout defaults to "auto"
  * for both width and height.
  *
  * @example

package/dist/components/Spacer/Spacer.d.ts

@@ -5,13 +5,6 @@
  */
 import * as React from 'react';
 import { ComponentsProps, Variant } from '../types';
-/**
- * Function signature for custom measurement indicators.
- *
- * @param value - The measurement in pixels
- * @param dimension - Which dimension is being measured ('width' | 'height')
- * @returns React node to display as the indicator
- */
 export type IndicatorNode = (value: number, dimension: 'width' | 'height') => React.ReactNode;
 export type SpacerProps = {
     /** Render function for custom measurement display */
@@ -23,33 +16,4 @@ export type SpacerProps = {
     /** Color override for visual indicators */
     color?: string;
 } & ComponentsProps;
-/**
- * A flexible layout element that adds precise vertical or horizontal spacing.
- *
- * @remarks
- * Spacer provides:
- * - Consistent spacing in layouts
- * - Optional measurement indicators for debugging
- * - Multiple visual styles for different debugging needs
- * - Automatic dimension normalization
- *
- * @example
- * ```tsx
- * // Basic vertical spacing
- * <Spacer
- *   height="24px"
- *   base={8}
- * />
- *
- * // Custom style with indicators
- * <Spacer
- *   width="32px"
- *   height="100%"
- *   base={4}
- *   color="#ff0000"
- *   debugging="visible"
- *   indicatorNode={(value, dim) => `${dim}: ${value}px`}
- * />
- * ```
- */
 export declare const Spacer: React.NamedExoticComponent<SpacerProps>;

package/dist/components/Stack/Stack.d.ts

@@ -13,9 +13,9 @@ export type StackProps = {
     justify?: React.CSSProperties['justifyContent'];
     /** Alignment on cross axis */
     align?: React.CSSProperties['alignItems'];
-    /** Container width (defaults to "fit-content") */
+    /** Container width (defaults to "auto") */
     width?: React.CSSProperties['width'];
-    /** Container height (defaults to "fit-content") */
+    /** Container height (defaults to "auto") */
     height?: React.CSSProperties['height'];
     /** Custom measurement indicator renderer */
     indicatorNode?: IndicatorNode;
@@ -34,7 +34,7 @@ export type StackProps = {
  * - Includes visual debug overlays
  *
  * Key features:
- * - Automatic dimension management (defaults to fit-content)
+ * - Automatic dimension management (defaults to auto)
  * - Direct padding application in non-debug mode
  * - Comprehensive alignment controls
  * - Theme-aware debug visuals

package/dist/hooks/useBaseline.d.ts

@@ -1,72 +1,60 @@
-/**
- * @file useBaseline Hook
- * @description Manages baseline grid alignment calculations
- * @module hooks
- */
 import { RefObject } from 'react';
-import { SnappingMode, Padding } from '@components';
+import type { SnappingMode, Padding } from '@components';
 export interface BaselineOptions {
-    /** Base unit for alignment calculations (default: 8) */
     base?: number;
-    /** Alignment strategy to apply (default: 'none') */
+    /** Snapping strategy: 'none' | 'height' | 'clamp'. */
     snapping?: SnappingMode;
-    /** Initial spacing configuration */
+    /** Initial padding config.  e.g. { top: 10, bottom: 20 } or just 8, etc. */
     spacing?: Partial<Padding> | number;
-    /** Enable console warnings for misalignments */
+    /** Whether to warn in the console if the measured height is not a multiple of base. */
     warnOnMisalignment?: boolean;
 }
 export interface BaselineResult {
-    /** Final adjusted padding values */
     padding: Padding;
-    /** Whether the measured height is a multiple of base */
     isAligned: boolean;
-    /** Raw measured height in pixels */
     height: number;
 }
 /**
- * Hook for managing baseline grid alignment in components.
- *
- * @remarks
- * This hook handles the complex calculations needed to maintain baseline grid
- * alignment, including:
- * - Measuring element dimensions
- * - Calculating padding adjustments
- * - Snapping values to the grid
- * - Warning about misalignments
+ *  Hook for managing baseline grid alignment in components.
  *
- * Different snapping modes affect how spacing is adjusted:
- * - 'none': Uses raw spacing values without adjustment
- * - 'height': Adjusts only the final height to align
- * - 'clamp': Adjusts both height and spacing values
+ *  @remarks
+ *  This hook handles the complex calculations needed to maintain baseline grid
+ *  alignment, including:
+ *    ▪	Measuring element dimensions
+ *    ▪	Calculating padding adjustments
+ *    ▪	Potentially snapping values to ensure multiples of the base
+ *    ▪	Warning about misalignments in development
  *
- * @param ref - Reference to the DOM element to measure
- * @param options - Configuration options for alignment behavior
- * @returns Object containing adjusted padding, alignment status, and height
+ *  Different snapping modes affect how spacing is adjusted:
+ *    ▪	'none': Uses raw spacing values without adjustment
+ *    ▪	'height': Adjusts only the final (bottom) padding to align
+ *    ▪	'clamp': Adjusts top and bottom to align
  *
- * @example
- * ```tsx
- * function MyComponent() {
- *   const ref = useRef<HTMLDivElement>(null);
- *   const { padding, isAligned } = useBaseline(ref, {
- *     base: 8,
- *     snapping: 'height',
- *     spacing: { top: 10, bottom: 20 }
- *   });
+ *  @param ref Reference to the DOM element
+ *  @param options Configuration options for alignment behavior
+ *  @returns Object with adjusted padding, alignment status, and height
  *
- *   return (
- *     <div
- *       ref={ref}
- *       style={{
- *         paddingTop: padding.top,
- *         paddingBottom: padding.bottom
- *       }}
- *     >
- *       Content
- *     </div>
- *   );
- * }
- * ```
+ *  @example
+ *  function MyComponent() {
+ *  const ref = useRef<HTMLDivElement>(null)
+ *  const { padding, isAligned } = useBaseline(ref, {
+ *  base: 8,
+ *  snapping: 'height',
+ *  spacing: { top: 10, bottom: 20 },
+ *  warnOnMisalignment: true,
+ *  })
  *
- * @throws {Error} if base is less than 1
+ *  return (
+ *  <div
+ *    ref={ref}
+ *    style={{
+ *      paddingTop: padding.top,
+ *      paddingBottom: padding.bottom,
+ *    }}
+ *  >
+ *    Content
+ *  </div>
+ *  )
+ *  }
  */
 export declare function useBaseline(ref: RefObject<HTMLElement | null>, { base, snapping, spacing, warnOnMisalignment, }?: BaselineOptions): BaselineResult;

package/dist/hooks/useMeasure.d.ts

@@ -1,9 +1,4 @@
-/**
- * @file useMeasure Hook
- * @description Tracks element dimensions using ResizeObserver
- * @module hooks
- */
-import { RefObject } from 'react';
+import * as React from 'react';
 export interface MeasureResult {
     /** Measured width in pixels */
     width: number;
@@ -15,18 +10,9 @@ export interface MeasureResult {
 /**
  * Hook for measuring and tracking DOM element dimensions.
  *
- * @remarks
- * Provides responsive element measurements using ResizeObserver, with:
- * - Performance optimization via RAF throttling
- * - Cache to prevent unnecessary updates
- * - Error handling and recovery
- * - Manual refresh capability
- *
- * The hook automatically:
- * - Initializes with 0x0 dimensions
- * - Updates on element resize
- * - Cleans up observers on unmount
- * - Rounds dimensions to whole pixels
+ * Provides responsive element measurements using ResizeObserver,
+ * with performance optimization (via RAF throttling), error handling,
+ * and a manual refresh method.
  *
  * @param ref - Reference to the DOM element to measure
  * @returns Current dimensions and refresh function
@@ -34,7 +20,7 @@ export interface MeasureResult {
  * @example
  * ```tsx
  * function ResponsiveBox() {
- *   const ref = useRef<HTMLDivElement>(null);
+ *   const ref = React.useRef<HTMLDivElement>(null);
  *   const { width, height, refresh } = useMeasure(ref);
  *
  *   return (
@@ -46,4 +32,4 @@ export interface MeasureResult {
  * }
  * ```
  */
-export declare function useMeasure(ref: RefObject<HTMLElement | null>): MeasureResult;
+export declare function useMeasure(ref: React.RefObject<HTMLElement | null>): MeasureResult;

package/dist/index.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=require("react");function dt(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const s=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,s.get?s:{enumerable:!0,get:()=>e[r]})}}return n.default=e,Object.freeze(n)}const w=dt(E);var ce={exports:{}},re={};/**
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const I=require("react");function dt(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const a=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(n,o,a.get?a:{enumerable:!0,get:()=>e[o]})}}return n.default=e,Object.freeze(n)}const f=dt(I);var be={exports:{}},ae={};/**
  * @license React
  * react-jsx-runtime.production.js
  *
@@ -6,7 +6,7 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */var Le;function mt(){if(Le)return re;Le=1;var e=Symbol.for("react.transitional.element"),n=Symbol.for("react.fragment");function r(s,i,o){var a=null;if(o!==void 0&&(a=""+o),i.key!==void 0&&(a=""+i.key),"key"in i){o={};for(var f in i)f!=="key"&&(o[f]=i[f])}else o=i;return i=o.ref,{$$typeof:e,type:s,key:a,ref:i!==void 0?i:null,props:o}}return re.Fragment=n,re.jsx=r,re.jsxs=r,re}var oe={};/**
+ */var Ye;function bt(){if(Ye)return ae;Ye=1;var e=Symbol.for("react.transitional.element"),n=Symbol.for("react.fragment");function o(a,s,r){var i=null;if(r!==void 0&&(i=""+r),s.key!==void 0&&(i=""+s.key),"key"in s){r={};for(var d in s)d!=="key"&&(r[d]=s[d])}else r=s;return s=r.ref,{$$typeof:e,type:a,key:i,ref:s!==void 0?s:null,props:r}}return ae.Fragment=n,ae.jsx=o,ae.jsxs=o,ae}var ie={};/**
  * @license React
  * react-jsx-runtime.development.js
  *
@@ -14,19 +14,19 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */var ze;function bt(){return ze||(ze=1,process.env.NODE_ENV!=="production"&&function(){function e(t){if(t==null)return null;if(typeof t=="function")return t.$$typeof===ct?null:t.displayName||t.name||null;if(typeof t=="string")return t;switch(t){case M:return"Fragment";case S:return"Portal";case $:return"Profiler";case O:return"StrictMode";case W:return"Suspense";case q:return"SuspenseList"}if(typeof t=="object")switch(typeof t.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),t.$$typeof){case L:return(t.displayName||"Context")+".Provider";case P:return(t._context.displayName||"Context")+".Consumer";case N:var c=t.render;return t=t.displayName,t||(t=c.displayName||c.name||"",t=t!==""?"ForwardRef("+t+")":"ForwardRef"),t;case X:return c=t.displayName||null,c!==null?c:e(t.type)||"Memo";case ge:c=t._payload,t=t._init;try{return e(t(c))}catch{}}return null}function n(t){return""+t}function r(t){try{n(t);var c=!1}catch{c=!0}if(c){c=console;var u=c.error,v=typeof Symbol=="function"&&Symbol.toStringTag&&t[Symbol.toStringTag]||t.constructor.name||"Object";return u.call(c,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",v),n(t)}}function s(){}function i(){if(te===0){Oe=console.log,je=console.info,$e=console.warn,Me=console.error,Ne=console.group,Ve=console.groupCollapsed,Ge=console.groupEnd;var t={configurable:!0,enumerable:!0,value:s,writable:!0};Object.defineProperties(console,{info:t,log:t,warn:t,error:t,group:t,groupCollapsed:t,groupEnd:t})}te++}function o(){if(te--,te===0){var t={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:Q({},t,{value:Oe}),info:Q({},t,{value:je}),warn:Q({},t,{value:$e}),error:Q({},t,{value:Me}),group:Q({},t,{value:Ne}),groupCollapsed:Q({},t,{value:Ve}),groupEnd:Q({},t,{value:Ge})})}0>te&&console.error("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}function a(t){if(pe===void 0)try{throw Error()}catch(u){var c=u.stack.trim().match(/\n( *(at )?)/);pe=c&&c[1]||"",Pe=-1<u.stack.indexOf(`
+ */var Fe;function mt(){return Fe||(Fe=1,process.env.NODE_ENV!=="production"&&function(){function e(t){if(t==null)return null;if(typeof t=="function")return t.$$typeof===ct?null:t.displayName||t.name||null;if(typeof t=="string")return t;switch(t){case V:return"Fragment";case E:return"Portal";case R:return"Profiler";case j:return"StrictMode";case T:return"Suspense";case P:return"SuspenseList"}if(typeof t=="object")switch(typeof t.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),t.$$typeof){case O:return(t.displayName||"Context")+".Provider";case y:return(t._context.displayName||"Context")+".Consumer";case w:var c=t.render;return t=t.displayName,t||(t=c.displayName||c.name||"",t=t!==""?"ForwardRef("+t+")":"ForwardRef"),t;case B:return c=t.displayName||null,c!==null?c:e(t.type)||"Memo";case L:c=t._payload,t=t._init;try{return e(t(c))}catch{}}return null}function n(t){return""+t}function o(t){try{n(t);var c=!1}catch{c=!0}if(c){c=console;var u=c.error,S=typeof Symbol=="function"&&Symbol.toStringTag&&t[Symbol.toStringTag]||t.constructor.name||"Object";return u.call(c,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",S),n(t)}}function a(){}function s(){if(re===0){Me=console.log,$e=console.info,Ne=console.warn,Ve=console.error,Ge=console.group,Le=console.groupCollapsed,Be=console.groupEnd;var t={configurable:!0,enumerable:!0,value:a,writable:!0};Object.defineProperties(console,{info:t,log:t,warn:t,error:t,group:t,groupCollapsed:t,groupEnd:t})}re++}function r(){if(re--,re===0){var t={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:ee({},t,{value:Me}),info:ee({},t,{value:$e}),warn:ee({},t,{value:Ne}),error:ee({},t,{value:Ve}),group:ee({},t,{value:Ge}),groupCollapsed:ee({},t,{value:Le}),groupEnd:ee({},t,{value:Be})})}0>re&&console.error("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}function i(t){if(ke===void 0)try{throw Error()}catch(u){var c=u.stack.trim().match(/\n( *(at )?)/);ke=c&&c[1]||"",Pe=-1<u.stack.indexOf(`
     at`)?" (<anonymous>)":-1<u.stack.indexOf("@")?"@unknown:0:0":""}return`
-`+pe+t+Pe}function f(t,c){if(!t||ve)return"";var u=xe.get(t);if(u!==void 0)return u;ve=!0,u=Error.prepareStackTrace,Error.prepareStackTrace=void 0;var v=null;v=J.H,J.H=null,i();try{var V={DetermineComponentFrameRoot:function(){try{if(c){var z=function(){throw Error()};if(Object.defineProperty(z.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(z,[])}catch(U){var le=U}Reflect.construct(t,[],z)}else{try{z.call()}catch(U){le=U}t.call(z.prototype)}}else{try{throw Error()}catch(U){le=U}(z=t())&&typeof z.catch=="function"&&z.catch(function(){})}}catch(U){if(U&&le&&typeof U.stack=="string")return[U.stack,le.stack]}return[null,null]}};V.DetermineComponentFrameRoot.displayName="DetermineComponentFrameRoot";var j=Object.getOwnPropertyDescriptor(V.DetermineComponentFrameRoot,"name");j&&j.configurable&&Object.defineProperty(V.DetermineComponentFrameRoot,"name",{value:"DetermineComponentFrameRoot"});var b=V.DetermineComponentFrameRoot(),B=b[0],K=b[1];if(B&&K){var G=B.split(`
-`),Z=K.split(`
-`);for(b=j=0;j<G.length&&!G[j].includes("DetermineComponentFrameRoot");)j++;for(;b<Z.length&&!Z[b].includes("DetermineComponentFrameRoot");)b++;if(j===G.length||b===Z.length)for(j=G.length-1,b=Z.length-1;1<=j&&0<=b&&G[j]!==Z[b];)b--;for(;1<=j&&0<=b;j--,b--)if(G[j]!==Z[b]){if(j!==1||b!==1)do if(j--,b--,0>b||G[j]!==Z[b]){var ne=`
-`+G[j].replace(" at new "," at ");return t.displayName&&ne.includes("<anonymous>")&&(ne=ne.replace("<anonymous>",t.displayName)),typeof t=="function"&&xe.set(t,ne),ne}while(1<=j&&0<=b);break}}}finally{ve=!1,J.H=v,o(),Error.prepareStackTrace=u}return G=(G=t?t.displayName||t.name:"")?a(G):"",typeof t=="function"&&xe.set(t,G),G}function d(t){if(t==null)return"";if(typeof t=="function"){var c=t.prototype;return f(t,!(!c||!c.isReactComponent))}if(typeof t=="string")return a(t);switch(t){case W:return a("Suspense");case q:return a("SuspenseList")}if(typeof t=="object")switch(t.$$typeof){case N:return t=f(t.render,!1),t;case X:return d(t.type);case ge:c=t._payload,t=t._init;try{return d(t(c))}catch{}}return""}function l(){var t=J.A;return t===null?null:t.getOwner()}function g(t){if(Ae.call(t,"key")){var c=Object.getOwnPropertyDescriptor(t,"key").get;if(c&&c.isReactWarning)return!1}return t.key!==void 0}function x(t,c){function u(){We||(We=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",c))}u.isReactWarning=!0,Object.defineProperty(t,"key",{get:u,configurable:!0})}function m(){var t=e(this.type);return Ie[t]||(Ie[t]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),t=this.props.ref,t!==void 0?t:null}function h(t,c,u,v,V,j){return u=j.ref,t={$$typeof:_,type:t,key:c,props:j,_owner:V},(u!==void 0?u:null)!==null?Object.defineProperty(t,"ref",{enumerable:!1,get:m}):Object.defineProperty(t,"ref",{enumerable:!1,value:null}),t._store={},Object.defineProperty(t._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(t,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.freeze&&(Object.freeze(t.props),Object.freeze(t)),t}function A(t,c,u,v,V,j){if(typeof t=="string"||typeof t=="function"||t===M||t===$||t===O||t===W||t===q||t===lt||typeof t=="object"&&t!==null&&(t.$$typeof===ge||t.$$typeof===X||t.$$typeof===L||t.$$typeof===P||t.$$typeof===N||t.$$typeof===ut||t.getModuleId!==void 0)){var b=c.children;if(b!==void 0)if(v)if(he(b)){for(v=0;v<b.length;v++)y(b[v],t);Object.freeze&&Object.freeze(b)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else y(b,t)}else b="",(t===void 0||typeof t=="object"&&t!==null&&Object.keys(t).length===0)&&(b+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports."),t===null?v="null":he(t)?v="array":t!==void 0&&t.$$typeof===_?(v="<"+(e(t.type)||"Unknown")+" />",b=" Did you accidentally export a JSX literal instead of a component?"):v=typeof t,console.error("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",v,b);if(Ae.call(c,"key")){b=e(t);var B=Object.keys(c).filter(function(G){return G!=="key"});v=0<B.length?"{key: someKey, "+B.join(": ..., ")+": ...}":"{key: someKey}",Be[b+v]||(B=0<B.length?"{"+B.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
+`+ke+t+Pe}function d(t,c){if(!t||ye)return"";var u=we.get(t);if(u!==void 0)return u;ye=!0,u=Error.prepareStackTrace,Error.prepareStackTrace=void 0;var S=null;S=Q.H,Q.H=null,s();try{var U={DetermineComponentFrameRoot:function(){try{if(c){var Z=function(){throw Error()};if(Object.defineProperty(Z.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(Z,[])}catch(q){var de=q}Reflect.construct(t,[],Z)}else{try{Z.call()}catch(q){de=q}t.call(Z.prototype)}}else{try{throw Error()}catch(q){de=q}(Z=t())&&typeof Z.catch=="function"&&Z.catch(function(){})}}catch(q){if(q&&de&&typeof q.stack=="string")return[q.stack,de.stack]}return[null,null]}};U.DetermineComponentFrameRoot.displayName="DetermineComponentFrameRoot";var G=Object.getOwnPropertyDescriptor(U.DetermineComponentFrameRoot,"name");G&&G.configurable&&Object.defineProperty(U.DetermineComponentFrameRoot,"name",{value:"DetermineComponentFrameRoot"});var p=U.DetermineComponentFrameRoot(),H=p[0],ne=p[1];if(H&&ne){var z=H.split(`
+`),te=ne.split(`
+`);for(p=G=0;G<z.length&&!z[G].includes("DetermineComponentFrameRoot");)G++;for(;p<te.length&&!te[p].includes("DetermineComponentFrameRoot");)p++;if(G===z.length||p===te.length)for(G=z.length-1,p=te.length-1;1<=G&&0<=p&&z[G]!==te[p];)p--;for(;1<=G&&0<=p;G--,p--)if(z[G]!==te[p]){if(G!==1||p!==1)do if(G--,p--,0>p||z[G]!==te[p]){var se=`
+`+z[G].replace(" at new "," at ");return t.displayName&&se.includes("<anonymous>")&&(se=se.replace("<anonymous>",t.displayName)),typeof t=="function"&&we.set(t,se),se}while(1<=G&&0<=p);break}}}finally{ye=!1,Q.H=S,r(),Error.prepareStackTrace=u}return z=(z=t?t.displayName||t.name:"")?i(z):"",typeof t=="function"&&we.set(t,z),z}function g(t){if(t==null)return"";if(typeof t=="function"){var c=t.prototype;return d(t,!(!c||!c.isReactComponent))}if(typeof t=="string")return i(t);switch(t){case T:return i("Suspense");case P:return i("SuspenseList")}if(typeof t=="object")switch(t.$$typeof){case w:return t=d(t.render,!1),t;case B:return g(t.type);case L:c=t._payload,t=t._init;try{return g(t(c))}catch{}}return""}function l(){var t=Q.A;return t===null?null:t.getOwner()}function m(t){if(Ae.call(t,"key")){var c=Object.getOwnPropertyDescriptor(t,"key").get;if(c&&c.isReactWarning)return!1}return t.key!==void 0}function x(t,c){function u(){We||(We=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",c))}u.isReactWarning=!0,Object.defineProperty(t,"key",{get:u,configurable:!0})}function b(){var t=e(this.type);return Ue[t]||(Ue[t]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),t=this.props.ref,t!==void 0?t:null}function v(t,c,u,S,U,G){return u=G.ref,t={$$typeof:C,type:t,key:c,props:G,_owner:U},(u!==void 0?u:null)!==null?Object.defineProperty(t,"ref",{enumerable:!1,get:b}):Object.defineProperty(t,"ref",{enumerable:!1,value:null}),t._store={},Object.defineProperty(t._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(t,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.freeze&&(Object.freeze(t.props),Object.freeze(t)),t}function A(t,c,u,S,U,G){if(typeof t=="string"||typeof t=="function"||t===V||t===R||t===j||t===T||t===P||t===F||typeof t=="object"&&t!==null&&(t.$$typeof===L||t.$$typeof===B||t.$$typeof===O||t.$$typeof===y||t.$$typeof===w||t.$$typeof===ut||t.getModuleId!==void 0)){var p=c.children;if(p!==void 0)if(S)if(xe(p)){for(S=0;S<p.length;S++)$(p[S],t);Object.freeze&&Object.freeze(p)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else $(p,t)}else p="",(t===void 0||typeof t=="object"&&t!==null&&Object.keys(t).length===0)&&(p+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports."),t===null?S="null":xe(t)?S="array":t!==void 0&&t.$$typeof===C?(S="<"+(e(t.type)||"Unknown")+" />",p=" Did you accidentally export a JSX literal instead of a component?"):S=typeof t,console.error("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",S,p);if(Ae.call(c,"key")){p=e(t);var H=Object.keys(c).filter(function(z){return z!=="key"});S=0<H.length?"{key: someKey, "+H.join(": ..., ")+": ...}":"{key: someKey}",ze[p+S]||(H=0<H.length?"{"+H.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`,v,b,B,b),Be[b+v]=!0)}if(b=null,u!==void 0&&(r(u),b=""+u),g(c)&&(r(c.key),b=""+c.key),"key"in c){u={};for(var K in c)K!=="key"&&(u[K]=c[K])}else u=c;return b&&x(u,typeof t=="function"?t.displayName||t.name||"Unknown":t),h(t,b,j,V,l(),u)}function y(t,c){if(typeof t=="object"&&t&&t.$$typeof!==ft){if(he(t))for(var u=0;u<t.length;u++){var v=t[u];p(v)&&C(v,c)}else if(p(t))t._store&&(t._store.validated=1);else if(t===null||typeof t!="object"?u=null:(u=Te&&t[Te]||t["@@iterator"],u=typeof u=="function"?u:null),typeof u=="function"&&u!==t.entries&&(u=u.call(t),u!==t))for(;!(t=u.next()).done;)p(t.value)&&C(t.value,c)}}function p(t){return typeof t=="object"&&t!==null&&t.$$typeof===_}function C(t,c){if(t._store&&!t._store.validated&&t.key==null&&(t._store.validated=1,c=R(c),!Ue[c])){Ue[c]=!0;var u="";t&&t._owner!=null&&t._owner!==l()&&(u=null,typeof t._owner.tag=="number"?u=e(t._owner.type):typeof t._owner.name=="string"&&(u=t._owner.name),u=" It was passed a child from "+u+".");var v=J.getCurrentStack;J.getCurrentStack=function(){var V=d(t.type);return v&&(V+=v()||""),V},console.error('Each child in a list should have a unique "key" prop.%s%s See https://react.dev/link/warning-keys for more information.',c,u),J.getCurrentStack=v}}function R(t){var c="",u=l();return u&&(u=e(u.type))&&(c=`
+  <%s key={someKey} {...props} />`,S,p,H,p),ze[p+S]=!0)}if(p=null,u!==void 0&&(o(u),p=""+u),m(c)&&(o(c.key),p=""+c.key),"key"in c){u={};for(var ne in c)ne!=="key"&&(u[ne]=c[ne])}else u=c;return p&&x(u,typeof t=="function"?t.displayName||t.name||"Unknown":t),v(t,p,G,U,l(),u)}function $(t,c){if(typeof t=="object"&&t&&t.$$typeof!==ft){if(xe(t))for(var u=0;u<t.length;u++){var S=t[u];h(S)&&M(S,c)}else if(h(t))t._store&&(t._store.validated=1);else if(t===null||typeof t!="object"?u=null:(u=fe&&t[fe]||t["@@iterator"],u=typeof u=="function"?u:null),typeof u=="function"&&u!==t.entries&&(u=u.call(t),u!==t))for(;!(t=u.next()).done;)h(t.value)&&M(t.value,c)}}function h(t){return typeof t=="object"&&t!==null&&t.$$typeof===C}function M(t,c){if(t._store&&!t._store.validated&&t.key==null&&(t._store.validated=1,c=N(c),!Ie[c])){Ie[c]=!0;var u="";t&&t._owner!=null&&t._owner!==l()&&(u=null,typeof t._owner.tag=="number"?u=e(t._owner.type):typeof t._owner.name=="string"&&(u=t._owner.name),u=" It was passed a child from "+u+".");var S=Q.getCurrentStack;Q.getCurrentStack=function(){var U=g(t.type);return S&&(U+=S()||""),U},console.error('Each child in a list should have a unique "key" prop.%s%s See https://react.dev/link/warning-keys for more information.',c,u),Q.getCurrentStack=S}}function N(t){var c="",u=l();return u&&(u=e(u.type))&&(c=`
 
 Check the render method of \``+u+"`."),c||(t=e(t))&&(c=`
 
-Check the top-level render call using <`+t+">."),c}var k=E,_=Symbol.for("react.transitional.element"),S=Symbol.for("react.portal"),M=Symbol.for("react.fragment"),O=Symbol.for("react.strict_mode"),$=Symbol.for("react.profiler"),P=Symbol.for("react.consumer"),L=Symbol.for("react.context"),N=Symbol.for("react.forward_ref"),W=Symbol.for("react.suspense"),q=Symbol.for("react.suspense_list"),X=Symbol.for("react.memo"),ge=Symbol.for("react.lazy"),lt=Symbol.for("react.offscreen"),Te=Symbol.iterator,ct=Symbol.for("react.client.reference"),J=k.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,Ae=Object.prototype.hasOwnProperty,Q=Object.assign,ut=Symbol.for("react.client.reference"),he=Array.isArray,te=0,Oe,je,$e,Me,Ne,Ve,Ge;s.__reactDisabledLog=!0;var pe,Pe,ve=!1,xe=new(typeof WeakMap=="function"?WeakMap:Map),ft=Symbol.for("react.client.reference"),We,Ie={},Be={},Ue={};oe.Fragment=M,oe.jsx=function(t,c,u,v,V){return A(t,c,u,!1,v,V)},oe.jsxs=function(t,c,u,v,V){return A(t,c,u,!0,v,V)}}()),oe}var Ye;function gt(){return Ye||(Ye=1,process.env.NODE_ENV==="production"?ce.exports=mt():ce.exports=bt()),ce.exports}var T=gt();function Qe(e){const n=e.trim().match(/^([+-]?[\d.]+)([a-zA-Z%]+)$/);if(!n)return null;const r=parseFloat(n[1]),s=n[2];return{value:r,unit:s}}function ue(e,n){return e===void 0&&n!==void 0?`${n}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??""}const ht={parentSize:0,viewportWidth:typeof window<"u"?window.innerWidth:1920,viewportHeight:typeof window<"u"?window.innerHeight:1080,rootFontSize:16,parentFontSize:16},fe={px:1,in:96,cm:37.8,mm:3.78,pt:1.33,pc:16},ke=["em","rem","vh","vw","vmin","vmax","%"];function de(e,n){if(typeof e=="number")return e;if(typeof e!="string")return null;const r=Qe(e);if(!r)return null;const{value:s,unit:i}=r;if(i in fe)return s*fe[i];if(i==="auto")return null;if(ke.includes(i)){const o={...ht,...n};switch(i){case"em":return s*o.parentFontSize;case"rem":return s*o.rootFontSize;case"vh":return s/100*o.viewportHeight;case"vw":return s/100*o.viewportWidth;case"vmin":return s/100*Math.min(o.viewportWidth,o.viewportHeight);case"vmax":return s/100*Math.max(o.viewportWidth,o.viewportHeight);case"%":return s/100*o.parentSize;default:return null}}return null}function pt(e,n,r){const s=(r==null?void 0:r.round)??!0,i=e===void 0?0:typeof e=="number"?e:de(e)??0;return`${(s?Math.round(i):i)%n}px`}function Ze(e,n,r){return Math.min(Math.max(e,n),r)}function vt(e,n=0){if(n>=0)return Number((Math.round(e*10**n)/10**n).toFixed(n));{const r=10**Math.abs(n);return Math.round(e/r)*r}}function ie(e,n={}){const{base:r=8,round:s=!0,clamp:i,suppressWarnings:o=!1}=n;if(e==="auto")return r;let a=null;if(typeof e=="number")a=e;else if(typeof e=="string"){const l=de(e);l===null?(o||console.error(`Failed to convert "${e}" to pixels. Falling back to base ${r}.`),a=r):a=l}a===null&&(a=r);const f=s?Math.round(a/r)*r:a,d=i!==void 0?Ze(f,i.min??-1/0,i.max??1/0):f;return!o&&d!==a&&console.warn(`Normalized ${a} to ${d} to match base ${r}px.`),d}function Ee(e,n,r){if(!e)return n;const s=e[0]!==void 0?ie(e[0],r):n[0],i=e[1]!==void 0?ie(e[1],r):n[1];return[s,i]}function Y(e){if("padding"in e&&e.padding!=null)return xt(e.padding);const n="block"in e&&e.block!=null?yt(e.block):{top:0,bottom:0},r="inline"in e&&e.inline!=null?kt(e.inline):{left:0,right:0};return{top:n.top,right:r.right,bottom:n.bottom,left:r.left}}function xt(e){if(typeof e=="number")return{top:e,right:e,bottom:e,left:e};if(Array.isArray(e)){if(e.length===2){const[n,r]=e;return{top:n,right:r,bottom:n,left:r}}if(e.length>=4){const[n,r,s,i]=e;return{top:n??0,right:r??0,bottom:s??0,left:i??0}}}if(typeof e=="object"&&!Array.isArray(e)){const n=e.top??0,r=e.bottom??0,s=e.left??0,i=e.right??0;return{top:n,right:i,bottom:r,left:s}}return{top:0,right:0,bottom:0,left:0}}function yt(e){if(typeof e=="number")return{top:e,bottom:e};if(Array.isArray(e)){const[n,r]=e;return{top:n??0,bottom:r??0}}return typeof e=="object"?{top:e.start??0,bottom:e.end??0}:{top:0,bottom:0}}function kt(e){if(typeof e=="number")return{left:e,right:e};if(Array.isArray(e)){const[n,r]=e;return{left:n??0,right:r??0}}return typeof e=="object"?{left:e.start??0,right:e.end??0}:{left:0,right:0}}function Ke(e,n,r,s){const i=Y({padding:r});if(s==="none")return i;if(s==="height"){const o=e%n;o!==0&&(i.bottom+=n-o)}if(s==="clamp"){i.top=i.top%n;const o=e%n;o!==0&&(i.bottom+=n-o),i.bottom=i.bottom%n}return i}const F=(...e)=>e.filter(Boolean).join(" ").trim(),I=(...e)=>Object.assign({},...e.filter(n=>n!==void 0));function Et(e,n){if(e)if(typeof e=="function")e(n);else try{Object.assign(e,{current:n})}catch(r){console.error("Error assigning ref:",r)}}function we(...e){return n=>{e.forEach(r=>{Et(r,n)})}}const wt=(e,n)=>{let r=null;return(...s)=>{r&&clearTimeout(r),r=setTimeout(()=>e(...s),n)}},Se=e=>{let n=null;return(...r)=>{n||(n=requestAnimationFrame(()=>{e(...r),n=null}))}};function se(e){const[n,r]=E.useState({width:0,height:0}),s=E.useRef({width:0,height:0}),i=E.useRef(!1),o=E.useCallback(()=>{if(!(!e.current||i.current))try{const d=e.current.getBoundingClientRect(),l={width:Math.round(d.width),height:Math.round(d.height)};(s.current.width!==l.width||s.current.height!==l.height)&&(s.current=l,r(l))}catch(d){i.current=!0,console.error("Error measuring element:",d),(n.width!==0||n.height!==0)&&r({width:0,height:0})}},[e,n]),a=E.useRef(Se(o));E.useLayoutEffect(()=>{if(typeof window>"u"||!e.current)return;const d=new ResizeObserver(()=>{a.current()});return d.observe(e.current),o(),()=>{d.disconnect(),i.current=!1}},[e,o]);const f=E.useCallback(()=>{i.current=!1,o()},[o]);return{...n,refresh:f}}function et({totalLines:e,lineHeight:n,containerRef:r,buffer:s=0}){const i=typeof s=="number"?s:parseInt(s,10)||0,o=E.useCallback(()=>{const l=r.current;if(!l)return{start:0,end:e};if(l.closest(".content-block"))return{start:0,end:e};const x=l.getBoundingClientRect().top+window.scrollY,m=Math.max(0,window.scrollY-x-i),h=m+window.innerHeight+i*2,A=Math.max(0,Math.floor(m/n)),y=Math.min(e,Math.ceil(h/n));return{start:A,end:y}},[e,n,r,i]),[a,f]=E.useState(o);St(["scroll","resize"],()=>{d()});const d=Se(()=>f(o()));return E.useLayoutEffect(()=>{const l=r.current;if(!l)return;const g=new IntersectionObserver(d,{threshold:0});return g.observe(l),d(),()=>{g.disconnect()}},[r,o,d]),a}function St(e,n){E.useLayoutEffect(()=>(e.forEach(r=>window.addEventListener(r,n,{passive:!0})),()=>{e.forEach(r=>window.removeEventListener(r,n))}),[e,n])}function ae(e,{base:n=8,snapping:r="none",spacing:s={},warnOnMisalignment:i=!1}={}){if(n<1)throw new Error("Base must be >= 1 for baseline alignment.");const{height:o}=se(e);return E.useMemo(()=>{const a=typeof s=="number"?{top:s,right:s,bottom:s,left:s}:{top:s.top??0,right:s.right??0,bottom:s.bottom??0,left:s.left??0},f=o%n===0;if(r==="none")return!f&&i&&process.env.NODE_ENV==="development"&&console.warn(`Element height (${o}px) is not a multiple of base (${n}px).`),{padding:a,isAligned:f,height:o};const d=r==="height"||r==="clamp"?Ke(o,n,a,r):a;return!f&&i&&process.env.NODE_ENV==="development"&&console.warn(`[useBaseline] Element height (${o}px) is not aligned with base (${n}px).`),{padding:d,isAligned:f,height:o}},[n,r,s,o,i])}function tt(e,n){const{width:r}=se(e);return E.useMemo(()=>{const s=n.variant??"line",i=ie(n.gap??0,{base:1});if(!r)return{template:"none",columnsCount:0,calculatedGap:0,isValid:!1};try{switch(s){case"line":{const o=Math.max(1,Math.floor(r/(i+1))+1);return{template:`repeat(${o}, 1px)`,columnsCount:o,calculatedGap:i,isValid:!0}}case"pattern":{if(!st(n.columns))throw new Error('Invalid "pattern" columns array');const o=n.columns.map(a=>typeof a=="number"?`${a}px`:a);return o.some(a=>a==="0"||a==="0px")?{template:"none",columnsCount:0,calculatedGap:0,isValid:!1}:{template:o.join(" "),columnsCount:o.length,calculatedGap:i,isValid:!0}}case"fixed":{const o=typeof n.columns=="number"?n.columns:0;if(o<1)throw new Error(`Invalid columns count: ${o}`);const a=n.columnWidth?ue(n.columnWidth):"1fr";return{template:`repeat(${o}, ${a})`,columnsCount:o,calculatedGap:i,isValid:!0}}case"auto":{const o=n.columnWidth??"auto";if(o==="auto")return{template:"repeat(auto-fit, minmax(0, 1fr))",columnsCount:1,calculatedGap:i,isValid:!0};const a=typeof o=="number"?`${o}px`:o.toString(),f=de(a)??0,d=f>0?Math.max(1,Math.floor((r+i)/(f+i))):1;return{template:`repeat(auto-fit, minmax(${a}, 1fr))`,columnsCount:d,calculatedGap:i,isValid:!0}}default:{console.warn(`[useGuide] Unknown variant "${s}". Falling back to "line".`);const o=Math.max(1,Math.floor(r/(i+1))+1);return{template:`repeat(${o}, 1px)`,columnsCount:o,calculatedGap:i,isValid:!0}}}}catch(o){return console.warn("Error in useGuide:",o),{template:"none",columnsCount:0,calculatedGap:0,isValid:!1}}},[n,r])}function H(e){const n=Re();return E.useMemo(()=>Object.assign({base:n.base},n[e]),[n,e])}function D(e,n){return E.useMemo(()=>{const r=e??n;return{isShown:r==="visible",isHidden:r==="hidden",isNone:r==="none",debugging:r}},[e,n])}const Ct={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)"},Rt={line:"var(--bk-baseline-color-line-theme)",flat:"var(--bk-baseline-color-flat-theme)"},_t={line:"var(--bk-spacer-color-line-theme)",flat:"var(--bk-spacer-color-flat-theme)",indice:"var(--bk-spacer-color-indice-theme)"},Tt={line:"var(--bk-box-color-line-theme)",flat:"var(--bk-box-color-flat-theme)",indice:"var(--bk-box-color-indice-theme)"},At={line:"var(--bk-stack-color-line-theme)",flat:"var(--bk-stack-color-flat-theme)",indice:"var(--bk-stack-color-indice-theme)"},Ot={line:"var(--bk-layout-color-line-theme)",flat:"var(--bk-layout-color-flat-theme)",indice:"var(--bk-layout-color-indice-theme)"},jt="var(--bk-padder-color-theme)",nt={base:8,baseline:{variant:"line",debugging:"hidden",colors:Rt},guide:{variant:"line",debugging:"hidden",colors:Ct},spacer:{variant:"line",debugging:"hidden",colors:_t},box:{debugging:"hidden",colors:Tt},stack:{debugging:"hidden",colors:At},layout:{debugging:"hidden",colors:Ot},padder:{debugging:"hidden",color:jt}},Ce=w.createContext(null);Ce.displayName="ConfigContext";const Re=()=>w.use(Ce)??nt,rt=({base:e,baseline:n,guide:r,stack:s,spacer:i,layout:o,box:a,padder:f})=>({"--bk-base":`${e}px`,"--bk-baseline-color-line":n.colors.line,"--bk-baseline-color-flat":n.colors.flat,"--bk-guide-color-line":r.colors.line,"--bk-guide-color-pattern":r.colors.pattern,"--bk-guide-color-auto":r.colors.auto,"--bk-guide-color-fixed":r.colors.fixed,"--bk-spacer-color-line":i.colors.line,"--bk-spacer-color-flat":i.colors.flat,"--bk-spacer-color-indice":i.colors.indice,"--bk-box-color-line":a.colors.line,"--bk-box-color-flat":a.colors.flat,"--bk-box-color-indice":a.colors.indice,"--bk-stack-color-line":s.colors.line,"--bk-stack-color-flat":s.colors.flat,"--bk-stack-color-indice":s.colors.indice,"--bk-layout-color-line":o.colors.line,"--bk-layout-color-flat":o.colors.flat,"--bk-layout-color-indice":o.colors.indice,"--bk-padder-color":f.color});function me({children:e,base:n,stack:r,baseline:s,guide:i,layout:o,spacer:a,box:f,padder:d}){const l=Re(),g=w.useMemo(()=>{const x={base:n??l.base,baseline:{...l.baseline,...s},guide:{...l.guide,...i},spacer:{...l.spacer,...a},box:{...l.box,...f},stack:{...l.stack,...r},layout:{...l.layout,...o},padder:{...l.padder,...d}};return{...x,cssVariables:rt(x)}},[n,l.base,l.baseline,l.guide,l.spacer,l.box,l.stack,l.layout,l.padder,s,i,a,f,r,o,d]);return T.jsx(Ce,{value:g,children:e})}const $t="spacer_Wdw6F",Mt="line_lUa33",Nt="flat_zXVQF",Fe={spacer:$t,line:Mt,flat:Nt},ot=w.memo(function({height:n,width:r,indicatorNode:s,debugging:i,variant:o,base:a,color:f,className:d,style:l,...g}){const x=w.useRef(null),m=H("spacer"),{isShown:h}=D(i,m.debugging),A=o??m.variant,y=a??m.base,[p,C]=Ee([r,n],[0,0],{base:y,suppressWarnings:!0}),R=ue(p||"100%"),k=ue(C||"100%"),_=w.useMemo(()=>!h||!s?null:[C!==0&&T.jsx("span",{children:s(C,"height")},"height"),p!==0&&T.jsx("span",{children:s(p,"width")},"width")].filter(Boolean),[h,s,C,p]),S=w.useMemo(()=>{const M={"--bk-spacer-height":k,"--bk-spacer-width":R,"--bk-spacer-base":`${y}px`,"--bk-spacer-color-indice":f??m.colors.indice,"--bk-spacer-color-line":f??m.colors.line,"--bk-spacer-color-flat":f??m.colors.flat};return I(M,l)},[k,R,y,f,m.colors,l]);return T.jsx("div",{ref:x,className:F(Fe.spacer,h&&Fe[A],d),"data-testid":"spacer","data-variant":A,style:S,...g,children:_})}),Vt="padder_HhtrA",Gt="visible_PJmPU",He={padder:Vt,visible:Gt},be=w.memo(w.forwardRef(function({children:n,className:r,debugging:s,height:i,indicatorNode:o,style:a,width:f,...d},l){const g=H("padder"),x=w.useMemo(()=>Y(d),[d]),{isShown:m,isNone:h,debugging:A}=D(s,g.debugging),y=!h,p=w.useRef(null),{padding:{top:C,left:R,bottom:k,right:_}}=ae(p,{base:g.base,snapping:"height",spacing:x,warnOnMisalignment:!h}),S=we(l,p),M=w.useMemo(()=>I({"--bk-padder-width":f??"fit-content","--bk-padder-height":i??"fit-content","--bk-padder-base":`${g.base}px`,"--bk-padder-color":g.color,...y?{}:{paddingBlock:`${C}px ${k}px`,paddingInline:`${R}px ${_}px`}},a),[f,i,g.base,g.color,y,C,_,k,R,a]),O=($,P)=>T.jsx(ot,{debugging:A,indicatorNode:o,height:P,width:$});return T.jsxs("div",{ref:S,className:F(He.padder,m&&He.visible,r),"data-testid":"padder",style:M,children:[y&&T.jsxs(T.Fragment,{children:[C>0&&O("100%",C),R>0&&O(R,"100%")]}),n,y&&T.jsxs(T.Fragment,{children:[k>0&&O("100%",k),_>0&&O(_,"100%")]})]})})),Pt="layout_Re9ui",Wt="visible_plo0X",De={layout:Pt,visible:Wt};function qe(e){return typeof e=="number"?`repeat(${e}, 1fr)`:typeof e=="string"?e:Array.isArray(e)?e.map(n=>typeof n=="number"?`${n}px`:n).join(" "):"repeat(auto-fit, minmax(100px, 1fr))"}const It=w.memo(function({children:n,columns:r,rows:s,rowGap:i,columnGap:o,gap:a,height:f,width:d,indicatorNode:l,justifyItems:g,alignItems:x,justifyContent:m,alignContent:h,className:A,variant:y,style:p,debugging:C,...R}){const k=H("layout"),{isShown:_}=D(C,k.debugging),S=w.useRef(null),M=w.useMemo(()=>Y(R),[R]),{padding:O}=ae(S,{base:k.base,snapping:"height",spacing:M,warnOnMisalignment:!0}),$=w.useMemo(()=>qe(r),[r]),P=w.useMemo(()=>s?qe(s):"auto",[s]),L=w.useMemo(()=>({rowGap:i,columnGap:o,...a!==void 0&&{gap:a}}),[i,o,a]),N=w.useMemo(()=>I({display:"grid",gridTemplateColumns:$,gridTemplateRows:P,rowGap:i,columnGap:o,justifyItems:g,alignItems:x,justifyContent:m,alignContent:h,width:d,height:f,"--bk-layout-color-line":k.colors.line,"--bk-layout-color-flat":k.colors.flat,"--bk-layout-color-indice":k.colors.indice},p),[$,P,i,o,g,x,m,h,d,f,k.colors.line,k.colors.flat,k.colors.indice,p]);return T.jsx(me,{spacer:{variant:y},children:T.jsx(be,{ref:S,"data-testid":"layout",block:[O.top,O.bottom],indicatorNode:l,inline:[O.left,O.right],debugging:C,width:d,height:f,children:T.jsx("div",{className:F(A,De.layout,_&&De.visible),style:I(N,L),children:n})})})}),Bt="box_LHy8B",Ut="visible_VOFS8",Xe={box:Bt,visible:Ut},Lt=w.memo(w.forwardRef(function({children:n,snapping:r="clamp",debugging:s,className:i,colSpan:o,rowSpan:a,span:f,width:d,height:l,style:g,...x},m){const h=H("box"),{isShown:A,debugging:y}=D(s,h.debugging),p=w.useRef(null),{top:C,bottom:R,left:k,right:_}=Y(x),{padding:S}=ae(p,{base:h.base,snapping:r,spacing:{top:C,bottom:R,left:k,right:_},warnOnMisalignment:y!=="none"}),M=w.useMemo(()=>{const $={};return f!==void 0?($.gridColumn=`span ${f}`,$.gridRow=`span ${f}`):(o!==void 0&&($.gridColumn=`span ${o}`),a!==void 0&&($.gridRow=`span ${a}`)),$},[o,a,f]),O=w.useMemo(()=>I({"--bk-box-width":d,"--bk-box-height":l,"--bk-box-base":`${h.base}px`,"--bk-box-color-line":h.colors.line},g),[h.base,h.colors.line,l,g,d]);return T.jsx("div",{ref:we(m,p),"data-testid":"box",className:F(Xe.box,A&&Xe.visible,i),style:I(O,M),children:T.jsx(me,{base:1,spacer:{variant:"flat",colors:{flat:"var(--bk-box-color-flat-theme)",line:"var(--bk-box-color-line-theme)",indice:"var(--bk-box-color-indice-theme)"}},children:T.jsx(be,{block:[S.top,S.bottom],inline:[S.left,S.right],width:d,height:l,debugging:y,children:n})})})})),zt="stack_sXiLu",Yt="visible_0IBG0",Je={stack:zt,visible:Yt},Ft=w.memo(function({align:n="stretch",children:r,className:s,columnGap:i,debugging:o,direction:a="row",gap:f,height:d,indicatorNode:l,justify:g="flex-start",rowGap:x,style:m,variant:h,width:A,...y}){const p=H("stack"),{isShown:C,debugging:R}=D(o,p.debugging),k=w.useRef(null),_=w.useMemo(()=>Y(y),[y]),{padding:S}=ae(k,{base:p.base,snapping:"height",spacing:_,warnOnMisalignment:!0}),M=w.useMemo(()=>({rowGap:x,columnGap:i,...f!==void 0&&{gap:f}}),[x,i,f]),O=w.useMemo(()=>I({display:"flex",flexDirection:a,justifyContent:g,alignItems:n,width:A||"fit-content",height:d||"fit-content","--bk-stack-color-line":p.colors.line,"--bk-stack-color-flat":p.colors.flat,"--bk-stack-color-indice":p.colors.indice},M,m),[a,g,n,A,d,p.colors.line,p.colors.flat,p.colors.indice,M,m]),$=R==="none"?{...O,paddingBlock:`${S.top}px ${S.bottom}px`,paddingInline:`${S.left}px ${S.right}px`}:O;return T.jsx(me,{spacer:{variant:h},children:T.jsx(be,{ref:k,"data-testid":"padder",block:[S.top,S.bottom],inline:[S.left,S.right],debugging:R,indicatorNode:l,width:A,height:d,children:T.jsx("div",{"data-testid":"stack",className:F(s,Je.stack,C&&Je.visible),style:$,...y,children:r})})})}),Ht="guide_gY3kY",Dt="line_xcGxq",qt="columns_eQm6d",Xt="column_mYoBn",ee={guide:Ht,line:Dt,columns:qt,column:Xt},Jt=E.memo(function({className:n,debugging:r,style:s,variant:i,align:o="start",gap:a,height:f,width:d,columns:l,columnWidth:g,...x}){const m=H("guide"),h=i??m.variant,{isShown:A}=D(r,m.debugging),y=E.useRef(null),{width:p,height:C}=se(y),{top:R,right:k,bottom:_,left:S}=E.useMemo(()=>Y(x),[x]),M=E.useMemo(()=>{const N=ie(a);return{line:{variant:"line",gap:N-1,base:m.base},auto:g?{variant:"auto",columnWidth:g,gap:N,base:m.base}:null,pattern:Array.isArray(l)?{variant:"pattern",columns:l,gap:N,base:m.base}:null,fixed:typeof l=="number"?{variant:"fixed",columns:l,columnWidth:g,gap:N,base:m.base}:null}[h]??{variant:"line",gap:N-1,base:m.base}},[a,m.base,g,l,h]),{template:O,columnsCount:$,calculatedGap:P}=tt(y,M),L=E.useMemo(()=>{const N={"--bk-guide-gap":`${P}px`,"--bk-guide-justify":o,"--bk-guide-color-line":m.colors.line,"--bk-guide-color-pattern":m.colors.pattern,"--bk-guide-padding-block":`${R}px ${_}px`,"--bk-guide-padding-inline":`${S}px ${k}px`,"--bk-guide-template":O,"--bk-guide-width":(d??p)||"100vw","--bk-guide-height":(f??C)||"100vh"};return I(N,s)},[P,o,m.colors.line,m.colors.pattern,R,_,S,k,O,d,p,f,C,s]);return T.jsx("div",{ref:y,className:F(ee.guide,n,A?ee.visible:ee.hidden,h==="line"&&ee.line),"data-testid":"guide","data-variant":h,style:L,...x,children:A&&T.jsx("div",{className:ee.columns,"data-variant":h,children:Array.from({length:$},(N,W)=>{const q=m.colors[h]??m.colors.line;return T.jsx("div",{className:ee.column,"data-column-index":W,"data-variant":h,style:{backgroundColor:q}},W)})})})}),Qt=/^\d*\.?\d+(?:fr|px|%|em|rem|vh|vw|vmin|vmax|pt|pc|in|cm|mm)$/,it=e=>typeof e=="number"?Number.isFinite(e)&&e>=0:typeof e!="string"?!1:e==="auto"||e==="100%"||Qt.test(e),st=e=>Array.isArray(e)&&e.length>0&&e.every(it),Zt=e=>{const n=[...Object.keys(fe),...ke];return typeof e=="number"||typeof e=="string"&&n.some(r=>e.endsWith(r))},Kt=e=>typeof e=="string"&&at.includes(e),_e=e=>typeof e=="object"&&e!==null,en=e=>_e(e)&&e.variant==="line",tn=e=>_e(e)&&"columns"in e&&!("variant"in e),nn=e=>_e(e)&&"columnWidth"in e&&!("variant"in e)&&!("columns"in e),rn="baseline_CUi4a",ye={baseline:rn},on=E.memo(function({className:n,debugging:r,style:s,variant:i,height:o,width:a,base:f,...d}){const l=H("baseline"),g=i??l.variant,x=f??l.base,{isShown:m}=D(r,l.debugging),h=E.useRef(null),{width:A,height:y}=se(h),[p,C]=E.useMemo(()=>Ee([a,o],[A,y]),[a,o,A,y]),{top:R,right:k,bottom:_,left:S}=E.useMemo(()=>Y(d),[d]),M=E.useMemo(()=>{const W=(C??0)-(R+_);return Math.max(1,Math.floor(W/x))},[C,R,_,x]),{start:O,end:$}=et({totalLines:M,lineHeight:x,containerRef:h,buffer:160}),P=g==="line"?l.colors.line:l.colors.flat,L=E.useMemo(()=>I({"--bk-baseline-width":p,padding:`${R}px ${k}px ${_}px ${S}px`,position:"absolute",inset:0,pointerEvents:"none",overflow:"hidden",height:`${C}px`},s),[p,R,k,_,S,C,s]),N=E.useCallback(W=>I({top:`${W*x}px`,left:0,right:0,height:g==="line"?"1px":`${x}px`,backgroundColor:P,position:"absolute"}),[x,g,P]);return T.jsx("div",{ref:h,"data-testid":"baseline",className:F(ye.baseline,m?ye.visible:ye.hidden,n),style:L,...d,children:m&&Array.from({length:$-O},(W,q)=>{const X=q+O;return T.jsx("div",{"data-row-index":X,style:N(X)},X)})})}),at=["start","center","end"],sn=["line","flat"];exports.ABSOLUTE_UNIT_CONVERSIONS=fe;exports.Baseline=on;exports.Box=Lt;exports.Config=me;exports.DEFAULT_CONFIG=nt;exports.GRID_ALIGNMENTS=at;exports.Guide=Jt;exports.Layout=It;exports.PADD_VARIANTS=sn;exports.Padder=be;exports.RELATIVE_UNITS=ke;exports.Spacer=ot;exports.Stack=Ft;exports.calculateSnappedSpacing=Ke;exports.clamp=Ze;exports.convertValue=de;exports.createCSSVariables=rt;exports.debounce=wt;exports.formatValue=ue;exports.isAutoCalculatedGuide=nn;exports.isGuideAlignment=Kt;exports.isGuideColumnConfig=tn;exports.isGuideLineConfig=en;exports.isGuideValue=Zt;exports.isValidGuideColumnValue=it;exports.isValidGuidePattern=st;exports.mergeClasses=F;exports.mergeRefs=we;exports.mergeStyles=I;exports.moduloize=pt;exports.normalizeValue=ie;exports.normalizeValuePair=Ee;exports.parsePadding=Y;exports.parseUnit=Qe;exports.rafThrottle=Se;exports.round=vt;exports.useBaseline=ae;exports.useConfig=H;exports.useDebug=D;exports.useDefaultConfig=Re;exports.useGuide=tt;exports.useMeasure=se;exports.useVirtual=et;
+Check the top-level render call using <`+t+">."),c}var k=I,C=Symbol.for("react.transitional.element"),E=Symbol.for("react.portal"),V=Symbol.for("react.fragment"),j=Symbol.for("react.strict_mode"),R=Symbol.for("react.profiler"),y=Symbol.for("react.consumer"),O=Symbol.for("react.context"),w=Symbol.for("react.forward_ref"),T=Symbol.for("react.suspense"),P=Symbol.for("react.suspense_list"),B=Symbol.for("react.memo"),L=Symbol.for("react.lazy"),F=Symbol.for("react.offscreen"),fe=Symbol.iterator,ct=Symbol.for("react.client.reference"),Q=k.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,Ae=Object.prototype.hasOwnProperty,ee=Object.assign,ut=Symbol.for("react.client.reference"),xe=Array.isArray,re=0,Me,$e,Ne,Ve,Ge,Le,Be;a.__reactDisabledLog=!0;var ke,Pe,ye=!1,we=new(typeof WeakMap=="function"?WeakMap:Map),ft=Symbol.for("react.client.reference"),We,Ue={},ze={},Ie={};ie.Fragment=V,ie.jsx=function(t,c,u,S,U){return A(t,c,u,!1,S,U)},ie.jsxs=function(t,c,u,S,U){return A(t,c,u,!0,S,U)}}()),ie}var He;function gt(){return He||(He=1,process.env.NODE_ENV==="production"?be.exports=bt():be.exports=mt()),be.exports}var _=gt();function Ke(e){const n=e.trim().match(/^([+-]?[\d.]+)([a-zA-Z%]+)$/);if(!n)return null;const o=parseFloat(n[1]),a=n[2];return{value:o,unit:a}}function W(e,n){return e===void 0&&n!==void 0?`${n}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??""}const ht={parentSize:0,viewportWidth:typeof window<"u"?window.innerWidth:1920,viewportHeight:typeof window<"u"?window.innerHeight:1080,rootFontSize:16,parentFontSize:16},ge={px:1,in:96,cm:37.8,mm:3.78,pt:1.33,pc:16},Se=["em","rem","vh","vw","vmin","vmax","%"];function he(e,n){if(typeof e=="number")return e;if(typeof e!="string")return null;const o=Ke(e);if(!o)return null;const{value:a,unit:s}=o;if(s in ge)return a*ge[s];if(s==="auto")return null;if(Se.includes(s)){const r={...ht,...n};switch(s){case"em":return a*r.parentFontSize;case"rem":return a*r.rootFontSize;case"vh":return a/100*r.viewportHeight;case"vw":return a/100*r.viewportWidth;case"vmin":return a/100*Math.min(r.viewportWidth,r.viewportHeight);case"vmax":return a/100*Math.max(r.viewportWidth,r.viewportHeight);case"%":return a/100*r.parentSize;default:return null}}return null}function pt(e,n,o){const a=(o==null?void 0:o.round)??!0,s=e===void 0?0:typeof e=="number"?e:he(e)??0;return`${(a?Math.round(s):s)%n}px`}function Qe(e,n,o){return Math.min(Math.max(e,n),o)}function vt(e,n=0){if(n>=0)return Number((Math.round(e*10**n)/10**n).toFixed(n));{const o=10**Math.abs(n);return Math.round(e/o)*o}}function le(e,n={}){const{base:o=8,round:a=!0,clamp:s,suppressWarnings:r=!1}=n;if(e==="auto")return o;let i=null;if(typeof e=="number")i=e;else if(typeof e=="string"){const l=he(e);l===null?(r||console.error(`Failed to convert "${e}" to pixels. Falling back to base ${o}.`),i=o):i=l}i===null&&(i=o);const d=a?Math.round(i/o)*o:i,g=s!==void 0?Qe(d,s.min??-1/0,s.max??1/0):d;return!r&&g!==i&&console.warn(`Normalized ${i} to ${g} to match base ${o}px.`),g}function Ce(e,n,o){if(!e||e[0]===void 0&&e[1]===void 0)return n;const a=e[0]!==void 0?le(e[0],o):n[0],s=e[1]!==void 0?le(e[1],o):n[1];return[a,s]}function X(e){if("padding"in e&&e.padding!=null)return xt(e.padding);const n="block"in e&&e.block!=null?kt(e.block):{top:0,bottom:0},o="inline"in e&&e.inline!=null?yt(e.inline):{left:0,right:0};return{top:n.top,right:o.right,bottom:n.bottom,left:o.left}}function xt(e){if(typeof e=="number")return{top:e,right:e,bottom:e,left:e};if(Array.isArray(e)){if(e.length===2){const[n,o]=e;return{top:n,right:o,bottom:n,left:o}}if(e.length>=4){const[n,o,a,s]=e;return{top:n??0,right:o??0,bottom:a??0,left:s??0}}}if(typeof e=="object"&&!Array.isArray(e)){const n=e.top??0,o=e.bottom??0,a=e.left??0,s=e.right??0;return{top:n,right:s,bottom:o,left:a}}return{top:0,right:0,bottom:0,left:0}}function kt(e){if(typeof e=="number")return{top:e,bottom:e};if(Array.isArray(e)){const[n,o]=e;return{top:n??0,bottom:o??0}}return typeof e=="object"?{top:e.start??0,bottom:e.end??0}:{top:0,bottom:0}}function yt(e){if(typeof e=="number")return{left:e,right:e};if(Array.isArray(e)){const[n,o]=e;return{left:n??0,right:o??0}}return typeof e=="object"?{left:e.start??0,right:e.end??0}:{left:0,right:0}}function et(e,n,o,a){const s=X({padding:o});if(a==="none")return s;if(a==="height"){const r=e%n;r!==0&&(s.bottom+=n-r)}if(a==="clamp"){s.top=s.top%n;const r=e%n;r!==0&&(s.bottom+=n-r),s.bottom=s.bottom%n}return s}const D=(...e)=>e.filter(Boolean).join(" ").trim(),Y=(...e)=>Object.assign({},...e.filter(n=>n!==void 0));function wt(e,n){if(e)if(typeof e=="function")e(n);else try{Object.assign(e,{current:n})}catch(o){console.error("Error assigning ref:",o)}}function Re(...e){return n=>{e.forEach(o=>{wt(o,n)})}}const Et=(e,n)=>{let o=null;const a=()=>{o&&(clearTimeout(o),o=null)};return[(...r)=>{a(),o=setTimeout(()=>e(...r),n)},a]},_e=e=>{let n=null,o=null;return(...s)=>{o=s,n!==null&&cancelAnimationFrame(n),n=requestAnimationFrame(()=>{e(...o),n=null,o=null})}};function ce(e){const[n,o]=f.useState({width:0,height:0}),a=f.useCallback(()=>{if(e.current)try{const r=e.current.getBoundingClientRect(),i={width:r?Math.round(r.width):0,height:r?Math.round(r.height):0};o(d=>d.width===i.width&&d.height===i.height?d:i)}catch{o({width:0,height:0})}},[e]),s=f.useMemo(()=>_e(a),[a]);return f.useLayoutEffect(()=>{a()},[a]),f.useLayoutEffect(()=>{if(!e.current)return;const r=new ResizeObserver(()=>{s()});return r.observe(e.current),()=>{r.disconnect()}},[e,s]),{...n,refresh:s}}function tt({totalLines:e,lineHeight:n,containerRef:o,buffer:a=0}){const s=I.useMemo(()=>typeof a=="number"?a:parseInt(a,10)||0,[a]),r=I.useCallback(()=>{const m=o.current;if(!m)return{start:0,end:e};if(m.closest(".block"))return{start:0,end:e};const b=m.getBoundingClientRect().top+window.scrollY,v=Math.max(0,window.scrollY-b-s),A=v+window.innerHeight+s*2,$=Math.max(0,Math.floor(v/n)),h=Math.min(e,Math.ceil(A/n));return{start:$,end:h}},[e,n,o,s]),[i,d]=I.useState(r);St(["scroll","resize"],()=>{l()});const g=I.useCallback(()=>{d(m=>{const x=r();return m.start!==x.start||m.end!==x.end?x:m})},[r]),l=I.useMemo(()=>_e(g),[g]);return I.useLayoutEffect(()=>{const m=o.current;if(!m)return;const x=new IntersectionObserver(l,{threshold:0});return x.observe(m),l(),()=>{x.disconnect()}},[o,r,l]),i}function St(e,n){const o=I.useCallback(n,[n]);I.useLayoutEffect(()=>{const a=()=>o();return e.forEach(s=>window.addEventListener(s,a)),()=>e.forEach(s=>window.removeEventListener(s,a))},[e,o])}function ue(e,{base:n=8,snapping:o="none",spacing:a={},warnOnMisalignment:s=!1}={}){if(n<1)throw new Error("Base must be >= 1 for baseline alignment.");const{height:r}=ce(e),i=I.useRef(!1);return I.useMemo(()=>{const d=X({padding:a}),g=r%n===0;if(!g&&s&&process.env.NODE_ENV==="development"&&console.warn(`[useBaseline] Element height (${r}px) is not aligned with base (${n}px).`),o==="none")return{padding:d,isAligned:g,height:r};if(i.current)return{padding:d,isAligned:g,height:r};const l=et(r,n,d,o);return i.current=!0,{padding:l,isAligned:g,height:r}},[n,o,a,s,r])}function nt(e,n){const{width:o}=ce(e);return I.useMemo(()=>{const a=n.variant??"line",s=le(n.gap??0,{base:1});if(!o)return{template:"none",columnsCount:0,calculatedGap:0,isValid:!1};try{switch(a){case"line":{const r=Math.max(1,Math.floor(o/(s+1))+1);return{template:`repeat(${r}, 1px)`,columnsCount:r,calculatedGap:s,isValid:!0}}case"pattern":{if(!it(n.columns))throw new Error('Invalid "pattern" columns array');const r=n.columns.map(i=>typeof i=="number"?`${i}px`:i);return r.some(i=>i==="0"||i==="0px")?{template:"none",columnsCount:0,calculatedGap:0,isValid:!1}:{template:r.join(" "),columnsCount:r.length,calculatedGap:s,isValid:!0}}case"fixed":{const r=typeof n.columns=="number"?n.columns:0;if(r<1)throw new Error(`Invalid columns count: ${r}`);const i=n.columnWidth?W(n.columnWidth):"1fr";return{template:`repeat(${r}, ${i})`,columnsCount:r,calculatedGap:s,isValid:!0}}case"auto":{const r=n.columnWidth??"auto";if(r==="auto")return{template:"repeat(auto-fit, minmax(0, 1fr))",columnsCount:1,calculatedGap:s,isValid:!0};const i=typeof r=="number"?`${r}px`:r.toString(),d=he(i)??0,g=d>0?Math.max(1,Math.floor((o+s)/(d+s))):1;return{template:`repeat(auto-fit, minmax(${i}, 1fr))`,columnsCount:g,calculatedGap:s,isValid:!0}}default:{console.warn(`[useGuide] Unknown variant "${a}". Falling back to "line".`);const r=Math.max(1,Math.floor(o/(s+1))+1);return{template:`repeat(${r}, 1px)`,columnsCount:r,calculatedGap:s,isValid:!0}}}}catch(r){return console.warn("Error in useGuide:",r),{template:"none",columnsCount:0,calculatedGap:0,isValid:!1}}},[n,o])}function J(e){const n=je();return I.useMemo(()=>Object.assign({base:n.base},n[e]),[n,e])}function K(e,n){return I.useMemo(()=>{const o=e??n;return{isShown:o==="visible",isHidden:o==="hidden",isNone:o==="none",debugging:o}},[e,n])}const Ct={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)"},Rt={line:"var(--bk-baseline-color-line-theme)",flat:"var(--bk-baseline-color-flat-theme)"},_t={line:"var(--bk-spacer-color-line-theme)",flat:"var(--bk-spacer-color-flat-theme)",text:"var(--bk-spacer-color-text-theme)"},Ot={line:"var(--bk-box-color-line-theme)",flat:"var(--bk-box-color-flat-theme)",text:"var(--bk-box-color-text-theme)"},jt={line:"var(--bk-stack-color-line-theme)",flat:"var(--bk-stack-color-flat-theme)",text:"var(--bk-stack-color-text-theme)"},Tt={line:"var(--bk-layout-color-line-theme)",flat:"var(--bk-layout-color-flat-theme)",text:"var(--bk-layout-color-text-theme)"},At="var(--bk-padder-color-theme)",ot={base:8,baseline:{variant:"line",debugging:"hidden",colors:Rt},guide:{variant:"line",debugging:"hidden",colors:Ct},spacer:{variant:"line",debugging:"hidden",colors:_t},box:{debugging:"hidden",colors:Ot},stack:{debugging:"hidden",colors:jt},layout:{debugging:"hidden",colors:Tt},padder:{debugging:"hidden",color:At}},Oe=f.createContext(null);Oe.displayName="ConfigContext";const je=()=>f.use(Oe)??ot,rt=({base:e,baseline:n,guide:o,stack:a,spacer:s,layout:r,box:i,padder:d})=>({"--bkb":`${e}px`,"--bkbcl":n.colors.line,"--bkbcf":n.colors.flat,"--bkgcl":o.colors.line,"--bkgcp":o.colors.pattern,"--bkgca":o.colors.auto,"--bkgcf":o.colors.fixed,"--bkscl":s.colors.line,"--bkscf":s.colors.flat,"--bksci":s.colors.text,"--bkxcl":i.colors.line,"--bkxcf":i.colors.flat,"--bkxci":i.colors.text,"--bkkcl":a.colors.line,"--bkkcf":a.colors.flat,"--bkkci":a.colors.text,"--bklcl":r.colors.line,"--bklcf":r.colors.flat,"--bklci":r.colors.text,"--bkpc":d.color});function pe({children:e,base:n,stack:o,baseline:a,guide:s,layout:r,spacer:i,box:d,padder:g}){const l=je(),m=f.useMemo(()=>{const x={base:n??l.base,baseline:{...l.baseline,...a},guide:{...l.guide,...s},spacer:{...l.spacer,...i},box:{...l.box,...d},stack:{...l.stack,...o},layout:{...l.layout,...r},padder:{...l.padder,...g}};return{...x,cssVariables:rt(x)}},[n,l.base,l.baseline,l.guide,l.spacer,l.box,l.stack,l.layout,l.padder,a,s,i,d,o,r,g]);return _.jsx(Oe,{value:m,children:e})}const Mt="spr_4aLVm",$t="line_lUa33",Nt="flat_zXVQF",qe={spr:Mt,line:$t,flat:Nt},st=f.memo(function({height:n,width:o,indicatorNode:a,debugging:s,variant:r,base:i,color:d,className:g,style:l,...m}){const x=f.useRef(null),b=J("spacer"),{isShown:v}=K(s,b.debugging),A=r??b.variant,$=i??b.base,[h,M]=Ce([o,n],[0,0],{base:$,suppressWarnings:!0}),N=f.useMemo(()=>!v||!a?null:[M!==0&&_.jsx("span",{children:a(M,"height")},"height"),h!==0&&_.jsx("span",{children:a(h,"width")},"width")].filter(Boolean),[v,a,M,h]),k=f.useMemo(()=>({"--bksh":"100%","--bksw":"100%","--bksb":`${b.base}px`,"--bksci":"var(--bk-spacer-color-text-theme)","--bkscl":"var(--bk-spacer-color-line-theme)","--bkscf":"var(--bk-spacer-color-flat-theme)"}),[b.base]),C=f.useCallback((V,j)=>(V==="--bksw"||V==="--bksh")&&j==="100%"?{}:j!==k[V]?{[V]:j}:{},[k]),E=f.useMemo(()=>{const V=W(M||"100%"),j=W(h||"100%"),R=`${i||b.base}px`,y={...C("--bksh",V),...C("--bksw",j),...C("--bksb",R),...C("--bksci",d??b.colors.text),...C("--bkscl",d??b.colors.line),...C("--bkscf",d??b.colors.flat)};return Y(y,l)},[C,M,h,b.base,d,b.colors.text,b.colors.line,b.colors.flat,l]);return _.jsx("div",{ref:x,"data-testid":"spacer",className:D(qe.spr,v&&qe[A],g),"data-variant":A,style:E,...m,children:N})}),Vt="pad_I0i9S",Gt="v_E0FRN",Ee={pad:Vt,v:Gt},ve=f.memo(f.forwardRef(function({children:n,className:o,debugging:a,height:s,indicatorNode:r,style:i,width:d,...g},l){const m=J("padder"),{variant:x}=J("spacer"),b=f.useMemo(()=>X(g),[g]),{isShown:v,isNone:A,debugging:$}=K(a,m.debugging),h=!A,M=f.useRef(null),{padding:{top:N,left:k,bottom:C,right:E}}=ue(M,{base:m.base,snapping:"height",spacing:b,warnOnMisalignment:!A}),V=Re(l,M),j=f.useMemo(()=>{const y={};return d!=="fit-content"&&(y["--bkpw"]=W(d||"fit-content")),s!=="fit-content"&&(y["--bkph"]=W(s||"fit-content")),m.base!==8&&(y["--bkpb"]=`${m.base}px`),m.color!=="var(--bk-padder-color-theme)"&&(y["--bkpc"]=m.color),h||((N>0||C>0)&&(y.paddingBlock=`${N}px ${C}px`),(k>0||E>0)&&(y.paddingInline=`${k}px ${E}px`)),Y(y,i)},[d,s,m.base,m.color,h,N,E,C,k,i]),R=(y,O)=>_.jsx(st,{variant:x,debugging:$,indicatorNode:r,height:O!=="100%"?O:void 0,width:y!=="100%"?y:void 0});return h?_.jsxs("div",{ref:V,"data-testid":"padder",className:D(Ee.pad,v&&Ee.v,o),style:j,children:[_.jsxs(_.Fragment,{children:[N>0&&_.jsx("div",{style:{gridColumn:"1 / -1"},children:R("100%",N)}),k>0&&_.jsx("div",{style:{gridRow:"2 / 3"},children:R(k,"100%")})]}),_.jsx("div",{style:{gridRow:"2 / 3",gridColumn:"2 / 3"},children:n}),_.jsxs(_.Fragment,{children:[E>0&&_.jsx("div",{style:{gridRow:"2 / 3"},children:R(E,"100%")}),C>0&&_.jsx("div",{style:{gridColumn:"1 / -1"},children:R("100%",C)})]})]}):_.jsx("div",{ref:V,"data-testid":"padder",className:D(Ee.pad,o),style:j,children:n})})),Lt="lay_yGGkG",Bt="v_uVoBP",De={lay:Lt,v:Bt};function Je(e){return typeof e=="number"?`repeat(${e}, 1fr)`:typeof e=="string"?e:Array.isArray(e)?e.map(n=>typeof n=="number"?`${n}px`:n).join(" "):"repeat(auto-fit, minmax(100px, 1fr))"}const Pt=f.memo(function({children:n,columns:o,rows:a,rowGap:s,columnGap:r,gap:i,height:d,width:g,indicatorNode:l,justifyItems:m,alignItems:x,justifyContent:b,alignContent:v,className:A,variant:$,style:h,debugging:M,...N}){const k=J("layout"),{isShown:C}=K(M,k.debugging),E=f.useRef(null),V=f.useMemo(()=>X(N),[N]),{padding:j}=ue(E,{base:k.base,snapping:"height",spacing:V,warnOnMisalignment:!0}),R=f.useMemo(()=>Je(o),[o]),y=f.useMemo(()=>a?Je(a):"auto",[a]),O=f.useMemo(()=>({"--bklw":"auto","--bklh":"auto","--bklcl":k.colors.line,"--bklcf":k.colors.flat,"--bklci":k.colors.text}),[k.colors.line,k.colors.flat,k.colors.text]),w=f.useCallback((B,L)=>(B==="--bklw"||B==="--bklh")&&L==="auto"?{}:L!==O[B]?{[B]:L}:{},[O]),T=f.useMemo(()=>({...i!==void 0&&{gap:W(i)},...s!==void 0&&{rowGap:W(s)},...r!==void 0&&{columnGap:W(r)}}),[i,s,r]),P=f.useMemo(()=>{const B=W(g||"auto"),L=W(d||"auto");return Y({...w("--bklw",B),...w("--bklh",L),...w("--bklcl",k.colors.line),...w("--bklcf",k.colors.flat),...w("--bklci",k.colors.text),...R!=="repeat(auto-fit, minmax(100px, 1fr))"&&{"--bklgtc":R},...y!=="auto"&&{"--bklgtr":y},...m&&{"--bklji":m},...x&&{"--bklai":x},...b&&{"--bkljc":b},...v&&{"--bklac":v},...T},h)},[R,y,m,x,b,v,g,d,k.colors.line,k.colors.flat,k.colors.text,w,h,T]);return _.jsx(pe,{spacer:{variant:$??"line"},children:_.jsx(ve,{ref:E,className:C?De.v:"",block:[j.top,j.bottom],indicatorNode:l,inline:[j.left,j.right],debugging:M,width:g,height:d,children:_.jsx("div",{"data-testid":"layout",className:D(A,De.lay),style:P,children:n})})})}),Wt="box_LHy8B",Ut="v_q3Ozc",Xe={box:Wt,v:Ut},zt=f.memo(f.forwardRef(function({children:n,snapping:o="clamp",debugging:a,className:s,colSpan:r,rowSpan:i,span:d,width:g,height:l,style:m,...x},b){const v=J("box"),{isShown:A,debugging:$}=K(a,v.debugging),h=f.useRef(null),{top:M,bottom:N,left:k,right:C}=X(x),{padding:E}=ue(h,{base:v.base,snapping:o,spacing:{top:M,bottom:N,left:k,right:C},warnOnMisalignment:$!=="none"}),V=f.useMemo(()=>{const O={};return d!==void 0?(O.gridColumn=`span ${d}`,O.gridRow=`span ${d}`):(r!==void 0&&(O.gridColumn=`span ${r}`),i!==void 0&&(O.gridRow=`span ${i}`)),O},[r,i,d]),j=f.useMemo(()=>({"--bkxw":"fit-content","--bkxh":"fit-content","--bkxb":`${v.base}px`,"--bkxcl":v.colors.line}),[v.base,v.colors.line]),R=f.useCallback((O,w)=>(O==="--bkxw"||O==="--bkxh")&&w==="fit-content"?{}:w!==j[O]?{[O]:w}:{},[j]),y=f.useMemo(()=>{const O=W(g||"fit-content"),w=W(l||"fit-content"),T={...R("--bkxw",O),...R("--bkxh",w),...R("--bkxb",`${v.base}px`),...R("--bkxcl",v.colors.line)};return Y(T,m)},[v.base,v.colors.line,g,l,R,m]);return _.jsx("div",{ref:Re(b,h),"data-testid":"box",className:D(Xe.box,A&&Xe.v,s),style:Y(y,V),children:_.jsx(pe,{base:1,spacer:{variant:"flat"},children:_.jsx(ve,{block:[E.top,E.bottom],inline:[E.left,E.right],width:"fit-content",height:l,debugging:$,children:n})})})})),It="stk_4t2AU",Yt="v_Uwir6",Ze={stk:It,v:Yt},Ft=f.memo(function({align:n="flex-start",children:o,className:a,columnGap:s,debugging:r,direction:i="row",gap:d,height:g,indicatorNode:l,justify:m="flex-start",rowGap:x,style:b,variant:v,width:A,...$}){const h=J("stack"),{isShown:M,debugging:N}=K(r,h.debugging),k=f.useRef(null),C=f.useMemo(()=>X($),[$]),{padding:E}=ue(k,{base:h.base,snapping:"height",spacing:C,warnOnMisalignment:!0}),V=f.useMemo(()=>({rowGap:x,columnGap:s,...d!==void 0&&{gap:d}}),[x,s,d]),j=f.useMemo(()=>({"--bkkw":"auto","--bkkh":"auto","--bkkcl":h.colors.line,"--bkkcf":h.colors.flat,"--bkkci":h.colors.text}),[h.colors.line,h.colors.flat,h.colors.text]),R=f.useCallback((w,T)=>w==="--bkkw"&&T==="auto"?{}:w==="--bkkh"&&T==="auto"?{}:T!==j[w]?{[w]:T}:{},[j]),y=f.useMemo(()=>{const w=W(A||"auto"),T=W(g||"auto"),P={...R("--bkkw",w),...R("--bkkh",T),...R("--bkkcl",h.colors.line),...R("--bkkcf",h.colors.flat),...R("--bkkci",h.colors.text)};return Y({flexDirection:i,justifyContent:m,alignItems:n,width:A,height:g},V,P,b)},[i,m,n,A,g,h.colors.line,h.colors.flat,h.colors.text,R,V,b]),O=N==="none"?{...y,paddingBlock:`${E.top}px ${E.bottom}px`,paddingInline:`${E.left}px ${E.right}px`}:y;return _.jsx(pe,{spacer:{variant:v??"line"},children:_.jsx(ve,{ref:k,className:M?Ze.v:"",block:[E.top,E.bottom],inline:[E.left,E.right],debugging:N,indicatorNode:l,width:A,height:g,children:_.jsx("div",{"data-testid":"stack",className:D(a,Ze.stk),style:O,...$,children:o})})})}),Ht="gde_eT-MH",qt="line_xcGxq",Dt="cols_LoPVp",Jt="col_ZgTMC",oe={gde:Ht,line:qt,cols:Dt,col:Jt},Xt=f.memo(function({className:n,debugging:o,style:a,variant:s,align:r="start",gap:i,height:d,width:g,columns:l,columnWidth:m,...x}){const b=J("guide"),v=s??b.variant,{isShown:A}=K(o,b.debugging),$=f.useRef(null),{width:h,height:M}=ce($),{top:N,right:k,bottom:C,left:E}=f.useMemo(()=>X(x),[x]),V=f.useMemo(()=>{const L=le(i);return{line:{variant:"line",gap:L-1,base:b.base},auto:m?{variant:"auto",columnWidth:m,gap:L,base:b.base}:null,pattern:Array.isArray(l)?{variant:"pattern",columns:l,gap:L,base:b.base}:null,fixed:typeof l=="number"?{variant:"fixed",columns:l,columnWidth:m,gap:L,base:b.base}:null}[v]??{variant:"line",gap:L-1,base:b.base}},[i,b.base,m,l,v]),{template:j,columnsCount:R,calculatedGap:y}=nt($,V),O=f.useMemo(()=>({"--bkgg":`${y}px`,"--bkgj":"start","--bkgcl":b.colors.line,"--bkgcp":b.colors.pattern,"--bkgw":"100vw","--bkgh":"100vh"}),[y,b.colors.line,b.colors.pattern]),w=f.useCallback((L,F)=>L==="--bkgw"&&F==="100vw"||L==="--bkgh"&&F==="100vh"?{}:F!==O[L]?{[L]:F}:{},[O]),T={"--bkgg":`${y}px`,"--bkgj":r,"--bkgcl":b.colors.line,"--bkgcp":b.colors.pattern,"--bkgpb":`${N}px ${C}px`,"--bkgpi":`${E}px ${k}px`,"--bkgt":j,"--bkgw":W(g??h,0)||"100vw","--bkgh":W(d??M,0)||"100vh"},P={...w("--bkgw",T["--bkgw"]),...w("--bkgh",T["--bkgh"]),...w("--bkgj",r),...w("--bkgcl",b.colors.line),...w("--bkgcp",b.colors.pattern),...w("--bkgg",`${y}px`)},B=Y(T,P,a);return _.jsx("div",{ref:$,"data-testid":"guide",className:D(oe.gde,n,A?oe.v:oe.h,v==="line"&&oe.line),"data-variant":v,style:B,...x,children:A&&_.jsx("div",{className:oe.cols,"data-variant":v,children:Array.from({length:R},(L,F)=>{const fe=b.colors[v]??b.colors.line;return _.jsx("div",{className:oe.col,"data-column-index":F,"data-variant":v,style:{backgroundColor:fe}},F)})})})}),Zt=/^\d*\.?\d+(?:fr|px|%|em|rem|vh|vw|vmin|vmax|pt|pc|in|cm|mm)$/,at=e=>typeof e=="number"?Number.isFinite(e)&&e>=0:typeof e!="string"?!1:e==="auto"||e==="100%"||Zt.test(e),it=e=>Array.isArray(e)&&e.length>0&&e.every(at),Kt=e=>{const n=[...Object.keys(ge),...Se];return typeof e=="number"||typeof e=="string"&&n.some(o=>e.endsWith(o))},Qt=e=>typeof e=="string"&&lt.includes(e),Te=e=>typeof e=="object"&&e!==null,en=e=>Te(e)&&e.variant==="line",tn=e=>Te(e)&&"columns"in e&&!("variant"in e),nn=e=>Te(e)&&"columnWidth"in e&&!("variant"in e)&&!("columns"in e),on="bas_qAJSK",rn="row_y6My5",me={bas:on,row:rn},sn=f.memo(function({className:n,debugging:o,style:a,variant:s,height:r,width:i,base:d,...g}){const l=J("baseline"),m=s??l.variant,x=d??l.base,{isShown:b}=K(o,l.debugging),v=f.useRef(null),{width:A,height:$}=ce(v),[h,M]=f.useMemo(()=>Ce([i,r],[A,$]),[i,r,A,$]),{top:N,right:k,bottom:C,left:E}=f.useMemo(()=>X(g),[g]),V=f.useMemo(()=>{const T=(M??0)-(N+C);return Math.max(1,Math.floor(T/x))},[M,N,C,x]),{start:j,end:R}=tt({totalLines:V,lineHeight:x,containerRef:v,buffer:160}),y=m==="line"?l.colors.line:l.colors.flat,O=f.useMemo(()=>{const T=[N,k,C,E].map(P=>P?`${P}px`:"0").join(" ");return Y({"--bkbw":i?`${h}px`:"100%","--bkbh":r?`${M}px`:"100%",...T!=="0 0 0 0"&&{padding:T}},a)},[N,k,C,E,i,h,r,M,a]),w=f.useCallback(T=>{const P=m==="line"?"1px":`${x}px`,B=m==="line"?l.colors.line:l.colors.flat;return Y({"--bkrt":`${T*x}px`,...P!=="1px"&&{"--bkrh":P},...y!==B&&{"--bkbcl":y}})},[x,m,y,l.colors.line,l.colors.flat]);return _.jsx("div",{ref:v,"data-testid":"baseline",className:D(me.bas,b?me.v:me.h,n),style:O,...g,children:b&&Array.from({length:R-j},(T,P)=>{const B=P+j;return _.jsx("div",{className:me.row,"data-row-index":B,style:w(B)},B)})})}),lt=["start","center","end"],an=["line","flat"];exports.ABSOLUTE_UNIT_CONVERSIONS=ge;exports.Baseline=sn;exports.Box=zt;exports.Config=pe;exports.DEFAULT_CONFIG=ot;exports.GRID_ALIGNMENTS=lt;exports.Guide=Xt;exports.Layout=Pt;exports.PADD_VARIANTS=an;exports.Padder=ve;exports.RELATIVE_UNITS=Se;exports.Spacer=st;exports.Stack=Ft;exports.calculateSnappedSpacing=et;exports.clamp=Qe;exports.convertValue=he;exports.createCSSVariables=rt;exports.debounce=Et;exports.formatValue=W;exports.isAutoCalculatedGuide=nn;exports.isGuideAlignment=Qt;exports.isGuideColumnConfig=tn;exports.isGuideLineConfig=en;exports.isGuideValue=Kt;exports.isValidGuideColumnValue=at;exports.isValidGuidePattern=it;exports.mergeClasses=D;exports.mergeRefs=Re;exports.mergeStyles=Y;exports.moduloize=pt;exports.normalizeValue=le;exports.normalizeValuePair=Ce;exports.parsePadding=X;exports.parseUnit=Ke;exports.rafThrottle=_e;exports.round=vt;exports.useBaseline=ue;exports.useConfig=J;exports.useDebug=K;exports.useDefaultConfig=je;exports.useGuide=nt;exports.useMeasure=ce;exports.useVirtual=tt;
 //# sourceMappingURL=index.cjs.map