baseline-kit 2.0.0 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +127 -105
- package/dist/README.md +127 -105
- package/dist/components/Baseline/Baseline.d.ts +29 -6
- package/dist/components/Box/Box.d.ts +27 -6
- package/dist/components/Config/Config.d.ts +52 -9
- package/dist/components/Guide/Guide.d.ts +37 -13
- package/dist/components/Layout/Layout.d.ts +21 -7
- package/dist/components/Padder/Padder.d.ts +24 -7
- package/dist/components/Spacer/Spacer.d.ts +32 -35
- package/dist/components/Stack/Stack.d.ts +27 -11
- package/dist/components/types.d.ts +1 -1
- package/dist/hooks/useBaseline.d.ts +34 -51
- package/dist/hooks/useConfig.d.ts +0 -5
- package/dist/hooks/useDebug.d.ts +1 -6
- package/dist/hooks/useGuide.d.ts +2 -7
- package/dist/hooks/useMeasure.d.ts +6 -20
- package/dist/hooks/useVirtual.d.ts +0 -5
- package/dist/index.cjs +11 -11
- package/dist/index.cjs.map +1 -1
- package/dist/index.mjs +1665 -1100
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/theme.css +140 -0
- package/dist/utils/convert.d.ts +0 -5
- package/dist/utils/grid.d.ts +22 -0
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/math.d.ts +26 -5
- package/dist/utils/merge.d.ts +54 -5
- package/dist/utils/parse.d.ts +0 -5
- package/dist/utils/snapping.d.ts +0 -5
- package/dist/utils/ssr.d.ts +33 -0
- package/dist/utils/timing.d.ts +2 -7
- package/package.json +43 -32
package/dist/index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const K=require("react");function $t(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const r=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(n,o,r.get?r:{enumerable:!0,get:()=>e[o]})}}return n.default=e,Object.freeze(n)}const c=$t(K);var ye={exports:{}},be={};/**
|
|
2
2
|
* @license React
|
|
3
3
|
* react-jsx-runtime.production.js
|
|
4
4
|
*
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*
|
|
7
7
|
* This source code is licensed under the MIT license found in the
|
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
|
9
|
-
*/var
|
|
9
|
+
*/var Je;function Vt(){if(Je)return be;Je=1;var e=Symbol.for("react.transitional.element"),n=Symbol.for("react.fragment");function o(r,s,a){var l=null;if(a!==void 0&&(l=""+a),s.key!==void 0&&(l=""+s.key),"key"in s){a={};for(var i in s)i!=="key"&&(a[i]=s[i])}else a=s;return s=a.ref,{$$typeof:e,type:r,key:l,ref:s!==void 0?s:null,props:a}}return be.Fragment=n,be.jsx=o,be.jsxs=o,be}var me={};/**
|
|
10
10
|
* @license React
|
|
11
11
|
* react-jsx-runtime.development.js
|
|
12
12
|
*
|
|
@@ -14,19 +14,19 @@
|
|
|
14
14
|
*
|
|
15
15
|
* This source code is licensed under the MIT license found in the
|
|
16
16
|
* LICENSE file in the root directory of this source tree.
|
|
17
|
-
*/var
|
|
18
|
-
at`)?" (<anonymous>)":-1<
|
|
19
|
-
`+
|
|
20
|
-
`),
|
|
21
|
-
`);for(
|
|
22
|
-
`+
|
|
17
|
+
*/var Ze;function Gt(){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===J?null:t.displayName||t.name||null;if(typeof t=="string")return t;switch(t){case D:return"Fragment";case P:return"Portal";case O:return"Profiler";case k:return"StrictMode";case W:return"Suspense";case v: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 E:return(t.displayName||"Context")+".Provider";case I:return(t._context.displayName||"Context")+".Consumer";case H:var f=t.render;return t=t.displayName,t||(t=f.displayName||f.name||"",t=t!==""?"ForwardRef("+t+")":"ForwardRef"),t;case z:return f=t.displayName||null,f!==null?f:e(t.type)||"Memo";case B:f=t._payload,t=t._init;try{return e(t(f))}catch{}}return null}function n(t){return""+t}function o(t){try{n(t);var f=!1}catch{f=!0}if(f){f=console;var d=f.error,C=typeof Symbol=="function"&&Symbol.toStringTag&&t[Symbol.toStringTag]||t.constructor.name||"Object";return d.call(f,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",C),n(t)}}function r(){}function s(){if(X===0){Ie=console.log,Be=console.info,Pe=console.warn,We=console.error,ze=console.group,He=console.groupCollapsed,Le=console.groupEnd;var t={configurable:!0,enumerable:!0,value:r,writable:!0};Object.defineProperties(console,{info:t,log:t,warn:t,error:t,group:t,groupCollapsed:t,groupEnd:t})}X++}function a(){if(X--,X===0){var t={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:L({},t,{value:Ie}),info:L({},t,{value:Be}),warn:L({},t,{value:Pe}),error:L({},t,{value:We}),group:L({},t,{value:ze}),groupCollapsed:L({},t,{value:He}),groupEnd:L({},t,{value:Le})})}0>X&&console.error("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}function l(t){if(Ce===void 0)try{throw Error()}catch(d){var f=d.stack.trim().match(/\n( *(at )?)/);Ce=f&&f[1]||"",Ue=-1<d.stack.indexOf(`
|
|
18
|
+
at`)?" (<anonymous>)":-1<d.stack.indexOf("@")?"@unknown:0:0":""}return`
|
|
19
|
+
`+Ce+t+Ue}function i(t,f){if(!t||Re)return"";var d=_e.get(t);if(d!==void 0)return d;Re=!0,d=Error.prepareStackTrace,Error.prepareStackTrace=void 0;var C=null;C=_.H,_.H=null,s();try{var U={DetermineComponentFrameRoot:function(){try{if(f){var ae=function(){throw Error()};if(Object.defineProperty(ae.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(ae,[])}catch(te){var pe=te}Reflect.construct(t,[],ae)}else{try{ae.call()}catch(te){pe=te}t.call(ae.prototype)}}else{try{throw Error()}catch(te){pe=te}(ae=t())&&typeof ae.catch=="function"&&ae.catch(function(){})}}catch(te){if(te&&pe&&typeof te.stack=="string")return[te.stack,pe.stack]}return[null,null]}};U.DetermineComponentFrameRoot.displayName="DetermineComponentFrameRoot";var $=Object.getOwnPropertyDescriptor(U.DetermineComponentFrameRoot,"name");$&&$.configurable&&Object.defineProperty(U.DetermineComponentFrameRoot,"name",{value:"DetermineComponentFrameRoot"});var y=U.DetermineComponentFrameRoot(),ee=y[0],ue=y[1];if(ee&&ue){var F=ee.split(`
|
|
20
|
+
`),ce=ue.split(`
|
|
21
|
+
`);for(y=$=0;$<F.length&&!F[$].includes("DetermineComponentFrameRoot");)$++;for(;y<ce.length&&!ce[y].includes("DetermineComponentFrameRoot");)y++;if($===F.length||y===ce.length)for($=F.length-1,y=ce.length-1;1<=$&&0<=y&&F[$]!==ce[y];)y--;for(;1<=$&&0<=y;$--,y--)if(F[$]!==ce[y]){if($!==1||y!==1)do if($--,y--,0>y||F[$]!==ce[y]){var de=`
|
|
22
|
+
`+F[$].replace(" at new "," at ");return t.displayName&&de.includes("<anonymous>")&&(de=de.replace("<anonymous>",t.displayName)),typeof t=="function"&&_e.set(t,de),de}while(1<=$&&0<=y);break}}}finally{Re=!1,_.H=C,a(),Error.prepareStackTrace=d}return F=(F=t?t.displayName||t.name:"")?l(F):"",typeof t=="function"&&_e.set(t,F),F}function u(t){if(t==null)return"";if(typeof t=="function"){var f=t.prototype;return i(t,!(!f||!f.isReactComponent))}if(typeof t=="string")return l(t);switch(t){case W:return l("Suspense");case v:return l("SuspenseList")}if(typeof t=="object")switch(t.$$typeof){case H:return t=i(t.render,!1),t;case z:return u(t.type);case B:f=t._payload,t=t._init;try{return u(t(f))}catch{}}return""}function m(){var t=_.A;return t===null?null:t.getOwner()}function p(t){if(Y.call(t,"key")){var f=Object.getOwnPropertyDescriptor(t,"key").get;if(f&&f.isReactWarning)return!1}return t.key!==void 0}function b(t,f){function d(){Fe||(Fe=!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)",f))}d.isReactWarning=!0,Object.defineProperty(t,"key",{get:d,configurable:!0})}function M(){var t=e(this.type);return Ye[t]||(Ye[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 S(t,f,d,C,U,$){return d=$.ref,t={$$typeof:R,type:t,key:f,props:$,_owner:U},(d!==void 0?d: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 h(t,f,d,C,U,$){if(typeof t=="string"||typeof t=="function"||t===D||t===O||t===k||t===W||t===v||t===A||typeof t=="object"&&t!==null&&(t.$$typeof===B||t.$$typeof===z||t.$$typeof===E||t.$$typeof===I||t.$$typeof===H||t.$$typeof===Z||t.getModuleId!==void 0)){var y=f.children;if(y!==void 0)if(C)if(q(y)){for(C=0;C<y.length;C++)j(y[C],t);Object.freeze&&Object.freeze(y)}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 j(y,t)}else y="",(t===void 0||typeof t=="object"&&t!==null&&Object.keys(t).length===0)&&(y+=" 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?C="null":q(t)?C="array":t!==void 0&&t.$$typeof===R?(C="<"+(e(t.type)||"Unknown")+" />",y=" Did you accidentally export a JSX literal instead of a component?"):C=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",C,y);if(Y.call(f,"key")){y=e(t);var ee=Object.keys(f).filter(function(F){return F!=="key"});C=0<ee.length?"{key: someKey, "+ee.join(": ..., ")+": ...}":"{key: someKey}",qe[y+C]||(ee=0<ee.length?"{"+ee.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
|
|
23
23
|
let props = %s;
|
|
24
24
|
<%s {...props} />
|
|
25
25
|
React keys must be passed directly to JSX without using spread:
|
|
26
26
|
let props = %s;
|
|
27
|
-
<%s key={someKey} {...props} />`,
|
|
27
|
+
<%s key={someKey} {...props} />`,C,y,ee,y),qe[y+C]=!0)}if(y=null,d!==void 0&&(o(d),y=""+d),p(f)&&(o(f.key),y=""+f.key),"key"in f){d={};for(var ue in f)ue!=="key"&&(d[ue]=f[ue])}else d=f;return y&&b(d,typeof t=="function"?t.displayName||t.name||"Unknown":t),S(t,y,$,U,m(),d)}function j(t,f){if(typeof t=="object"&&t&&t.$$typeof!==Nt){if(q(t))for(var d=0;d<t.length;d++){var C=t[d];T(C)&&g(C,f)}else if(T(t))t._store&&(t._store.validated=1);else if(t===null||typeof t!="object"?d=null:(d=Q&&t[Q]||t["@@iterator"],d=typeof d=="function"?d:null),typeof d=="function"&&d!==t.entries&&(d=d.call(t),d!==t))for(;!(t=d.next()).done;)T(t.value)&&g(t.value,f)}}function T(t){return typeof t=="object"&&t!==null&&t.$$typeof===R}function g(t,f){if(t._store&&!t._store.validated&&t.key==null&&(t._store.validated=1,f=V(f),!Xe[f])){Xe[f]=!0;var d="";t&&t._owner!=null&&t._owner!==m()&&(d=null,typeof t._owner.tag=="number"?d=e(t._owner.type):typeof t._owner.name=="string"&&(d=t._owner.name),d=" It was passed a child from "+d+".");var C=_.getCurrentStack;_.getCurrentStack=function(){var U=u(t.type);return C&&(U+=C()||""),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.',f,d),_.getCurrentStack=C}}function V(t){var f="",d=m();return d&&(d=e(d.type))&&(f=`
|
|
28
28
|
|
|
29
|
-
Check the render method of \``+
|
|
29
|
+
Check the render method of \``+d+"`."),f||(t=e(t))&&(f=`
|
|
30
30
|
|
|
31
|
-
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;
|
|
31
|
+
Check the top-level render call using <`+t+">."),f}var N=K,R=Symbol.for("react.transitional.element"),P=Symbol.for("react.portal"),D=Symbol.for("react.fragment"),k=Symbol.for("react.strict_mode"),O=Symbol.for("react.profiler"),I=Symbol.for("react.consumer"),E=Symbol.for("react.context"),H=Symbol.for("react.forward_ref"),W=Symbol.for("react.suspense"),v=Symbol.for("react.suspense_list"),z=Symbol.for("react.memo"),B=Symbol.for("react.lazy"),A=Symbol.for("react.offscreen"),Q=Symbol.iterator,J=Symbol.for("react.client.reference"),_=N.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,Y=Object.prototype.hasOwnProperty,L=Object.assign,Z=Symbol.for("react.client.reference"),q=Array.isArray,X=0,Ie,Be,Pe,We,ze,He,Le;r.__reactDisabledLog=!0;var Ce,Ue,Re=!1,_e=new(typeof WeakMap=="function"?WeakMap:Map),Nt=Symbol.for("react.client.reference"),Fe,Ye={},qe={},Xe={};me.Fragment=D,me.jsx=function(t,f,d,C,U){return h(t,f,d,!1,C,U)},me.jsxs=function(t,f,d,C,U){return h(t,f,d,!0,C,U)}}()),me}var Ke;function Dt(){return Ke||(Ke=1,process.env.NODE_ENV==="production"?ye.exports=Vt():ye.exports=Gt()),ye.exports}var w=Dt();function ot(e){const n=e.trim().match(/^([+-]?[\d.]+)([a-zA-Z%]+)$/);if(!n)return null;const o=parseFloat(n[1]),r=n[2];return{value:o,unit:r}}function G(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 It={parentSize:0,viewportWidth:typeof window<"u"?window.innerWidth:1920,viewportHeight:typeof window<"u"?window.innerHeight:1080,rootFontSize:16,parentFontSize:16},ve={px:1,in:96,cm:37.8,mm:3.78,pt:1.33,pc:16},Me=["em","rem","vh","vw","vmin","vmax","%"];function Se(e,n){if(typeof e=="number")return e;if(typeof e!="string")return null;const o=ot(e);if(!o)return null;const{value:r,unit:s}=o;if(s in ve)return r*ve[s];if(s==="auto")return null;if(Me.includes(s)){const a={...It,...n};switch(s){case"em":return r*a.parentFontSize;case"rem":return r*a.rootFontSize;case"vh":return r/100*a.viewportHeight;case"vw":return r/100*a.viewportWidth;case"vmin":return r/100*Math.min(a.viewportWidth,a.viewportHeight);case"vmax":return r/100*Math.max(a.viewportWidth,a.viewportHeight);case"%":return r/100*a.parentSize;default:return null}}return null}function Bt(e,n,o){const r=(o==null?void 0:o.round)??!0,s=e===void 0?0:typeof e=="number"?e:Se(e)??0;return`${(r?Math.round(s):s)%n}px`}function rt(e,n,o){return Math.min(Math.max(e,n),o)}function Pt(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 st(e){const{height:n,top:o,bottom:r,base:s}=e,a=(n??0)-(o+r);return Math.max(1,Math.floor(a/s))}function xe(e,n={}){const{base:o=8,round:r=!0,clamp:s,suppressWarnings:a=!1}=n;if(e==="auto")return o;let l=null;if(typeof e=="number")l=e;else if(typeof e=="string"){const m=Se(e);m===null?(a||console.error(`Failed to convert "${e}" to pixels. Falling back to base ${o}.`),l=o):l=m}l===null&&(l=o);const i=r?Math.round(l/o)*o:l,u=s!==void 0?rt(i,s.min??-1/0,s.max??1/0):i;return!a&&u!==l&&console.warn(`Normalized ${l} to ${u} to match base ${o}px.`),u}function Te(e,n,o){if(!e||e[0]===void 0&&e[1]===void 0)return n;const r=e[0]!==void 0?xe(e[0],o):n[0],s=e[1]!==void 0?xe(e[1],o):n[1];return[r,s]}function le(e){if("padding"in e&&e.padding!=null)return Wt(e.padding);const n="block"in e&&e.block!=null?zt(e.block):{top:0,bottom:0},o="inline"in e&&e.inline!=null?Ht(e.inline):{left:0,right:0};return{top:n.top,right:o.right,bottom:n.bottom,left:o.left}}function Wt(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,r,s]=e;return{top:n??0,right:o??0,bottom:r??0,left:s??0}}}if(typeof e=="object"&&!Array.isArray(e)){const n=e.top??0,o=e.bottom??0,r=e.left??0,s=e.right??0;return{top:n,right:s,bottom:o,left:r}}return{top:0,right:0,bottom:0,left:0}}function zt(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 Ht(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 at(e,n,o,r){const s=le({padding:o});if(r==="none")return s;if(r==="height"){const a=e%n;a!==0&&(s.bottom+=n-a)}if(r==="clamp"){s.top=s.top%n;const a=e%n;a!==0&&(s.bottom+=n-a),s.bottom=s.bottom%n}return s}const lt=(e,n,o)=>{const r={};return e!==void 0?(r.gridColumn=`span ${e}`,r.gridRow=`span ${e}`):(n!==void 0&&(r.gridColumn=`span ${n}`),o!==void 0&&(r.gridRow=`span ${o}`)),r},ne=(...e)=>e.filter(Boolean).join(" ").trim(),oe=(...e)=>Object.assign({},...e.filter(n=>n!==void 0));function Lt(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 Ae(...e){return n=>{e.forEach(o=>{Lt(o,n)})}}function x(e,n,o){var i,u,m;const r=typeof e=="string"?e:e.key,s=typeof e=="string"?n:e.value,a=typeof e=="string"?o:e.defaultStyles,l=typeof e=="object"?e.skipDimensions:void 0;if(l){if((i=l.fitContent)!=null&&i.includes(r)&&s==="fit-content")return{};if((u=l.auto)!=null&&u.includes(r)&&s==="auto")return{};if((m=l.fullSize)!=null&&m.includes(r)&&(s==="100%"||s==="100vh"||s==="100vw"))return{}}return s!==a[r]?{[r]:s}:{}}const Ut=(e,n)=>{let o=null;const r=()=>{o&&(clearTimeout(o),o=null)};return[(...a)=>{r(),o=setTimeout(()=>e(...a),n)},r]},Ne=e=>{let n=null,o=null;return(...s)=>{o=s,n!==null&&cancelAnimationFrame(n),n=requestAnimationFrame(()=>{e(...o),n=null,o=null})}},$e=typeof window>"u",it={width:1024,height:768};function Ft(e,n){if($e)return n;try{return e()}catch{return n}}function re(e,n,o){return!e||$e?n:o}function ge(e){const[n,o]=c.useState({width:0,height:0}),r=c.useCallback(()=>{if(e.current)try{const a=e.current.getBoundingClientRect(),l={width:a?Math.round(a.width):0,height:a?Math.round(a.height):0};o(i=>i.width===l.width&&i.height===l.height?i:l)}catch{o({width:0,height:0})}},[e]),s=c.useMemo(()=>Ne(r),[r]);return c.useLayoutEffect(()=>{r()},[r]),c.useLayoutEffect(()=>{if(!e.current)return;const a=new ResizeObserver(()=>{s()});return a.observe(e.current),()=>{a.disconnect()}},[e,s]),{...n,refresh:s}}function ct({totalLines:e,lineHeight:n,containerRef:o,buffer:r=0}){const s=K.useMemo(()=>typeof r=="number"?r:parseInt(r,10)||0,[r]),a=K.useCallback(()=>{const p=o.current;if(!p)return{start:0,end:e};if(p.closest(".block"))return{start:0,end:e};const M=p.getBoundingClientRect().top+window.scrollY,S=Math.max(0,window.scrollY-M-s),h=S+window.innerHeight+s*2,j=Math.max(0,Math.floor(S/n)),T=Math.min(e,Math.ceil(h/n));return{start:j,end:T}},[e,n,o,s]),[l,i]=K.useState(a);Yt(["scroll","resize"],()=>{m()});const u=K.useCallback(()=>{i(p=>{const b=a();return p.start!==b.start||p.end!==b.end?b:p})},[a]),m=K.useMemo(()=>Ne(u),[u]);return K.useLayoutEffect(()=>{const p=o.current;if(!p)return;const b=new IntersectionObserver(m,{threshold:0});return b.observe(p),m(),()=>{b.disconnect()}},[o,a,m]),l}function Yt(e,n){const o=K.useCallback(n,[n]);K.useLayoutEffect(()=>{const r=()=>o();return e.forEach(s=>window.addEventListener(s,r)),()=>e.forEach(s=>window.removeEventListener(s,r))},[e,o])}function he(e,{base:n=8,snapping:o="none",spacing:r={},warnOnMisalignment:s=!1}={}){if(n<1)throw new Error("Base must be >= 1 for baseline alignment.");const{height:a}=ge(e),l=c.useRef(!1),i=c.useRef(!1);return c.useMemo(()=>{const u=le({padding:r}),m=a%n===0;if(!m&&s&&process.env.NODE_ENV==="development"&&(i.current||(console.warn(`[useBaseline] Element height (${a}px) is not aligned with base (${n}px).`),i.current=!0)),o==="none")return{padding:u,isAligned:m,height:a};if(l.current)return{padding:u,isAligned:m,height:a};const p=at(a,n,u,o);return l.current=!0,{padding:p,isAligned:m,height:a}},[n,o,r,s,a])}function ut(e,n){const{width:o}=ge(e),r=c.useRef(!1);return c.useMemo(()=>{const s=n.variant??"line",a=n.base??8,l=xe(n.gap??0,{base:a});if(!o)return{template:"none",columnsCount:0,calculatedGap:0,isValid:!1};try{switch(s){case"line":{const i=Math.max(1,Math.floor(o/(l+1))+1);return{template:`repeat(${i}, 1px)`,columnsCount:i,calculatedGap:l,isValid:!0}}case"pattern":{if(!Ot(n.columns))throw new Error('Invalid "pattern" columns array');const i=n.columns.map(u=>typeof u=="number"?`${u}px`:u);return i.some(u=>u==="0"||u==="0px")?{template:"none",columnsCount:0,calculatedGap:0,isValid:!1}:{template:i.join(" "),columnsCount:i.length,calculatedGap:l,isValid:!0}}case"fixed":{const i=typeof n.columns=="number"?n.columns:0;if(i<1)throw new Error(`Invalid columns count: ${i}`);const u=n.columnWidth?G(n.columnWidth):"1fr";return{template:`repeat(${i}, ${u})`,columnsCount:i,calculatedGap:l,isValid:!0}}case"auto":{const i=n.columnWidth??"auto";if(i==="auto")return{template:"repeat(auto-fit, minmax(0, 1fr))",columnsCount:1,calculatedGap:l,isValid:!0};const u=typeof i=="number"?`${i}px`:i.toString(),m=Se(u)??0,p=m>0?Math.max(1,Math.floor((o+l)/(m+l))):1;return{template:`repeat(auto-fit, minmax(${u}, 1fr))`,columnsCount:p,calculatedGap:l,isValid:!0}}default:{r.current||(console.warn(`[useGuide] Unknown variant "${s}". Falling back to "line".`),r.current=!0);const i=Math.max(1,Math.floor(o/(l+1))+1);return{template:`repeat(${i}, 1px)`,columnsCount:i,calculatedGap:l,isValid:!0}}}}catch(i){return console.warn("Error in useGuide:",i),{template:"none",columnsCount:0,calculatedGap:0,isValid:!1}}},[n,o])}function se(e){const n=Ge();return K.useMemo(()=>Object.assign({base:n.base},n[e]),[n,e])}function ie(e,n){return K.useMemo(()=>{const o=e??n;return{isShown:o==="visible",isHidden:o==="hidden",isNone:o==="none",debugging:o}},[e,n])}const qt={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)"},Xt={line:"var(--bk-baseline-color-line-theme)",flat:"var(--bk-baseline-color-flat-theme)"},Jt={line:"var(--bk-spacer-color-line-theme)",flat:"var(--bk-spacer-color-flat-theme)",text:"var(--bk-spacer-color-text-theme)"},Zt={line:"var(--bk-box-color-line-theme)",flat:"var(--bk-box-color-flat-theme)",text:"var(--bk-box-color-text-theme)"},Kt={line:"var(--bk-stack-color-line-theme)",flat:"var(--bk-stack-color-flat-theme)",text:"var(--bk-stack-color-text-theme)"},Qt={line:"var(--bk-layout-color-line-theme)",flat:"var(--bk-layout-color-flat-theme)",text:"var(--bk-layout-color-text-theme)"},en="var(--bk-padder-color-theme)",ft={base:8,baseline:{variant:"line",debugging:"hidden",colors:Xt},guide:{variant:"line",debugging:"hidden",colors:qt},spacer:{variant:"line",debugging:"hidden",colors:Jt},box:{debugging:"hidden",colors:Zt},stack:{debugging:"hidden",colors:Kt},layout:{debugging:"hidden",colors:Qt},padder:{debugging:"hidden",color:en}},Ve=c.createContext(ft);Ve.displayName="ConfigContext";const Ge=()=>c.use(Ve),tn=e=>{const{base:n,baseline:o,guide:r,stack:s,spacer:a,layout:l,box:i,padder:u}=e;return{"--bkb":`${n}px`,"--bkbcl":o.colors.line,"--bkbcf":o.colors.flat,"--bkgcl":r.colors.line,"--bkgcp":r.colors.pattern,"--bkgca":r.colors.auto,"--bkgcf":r.colors.fixed,"--bkscl":a.colors.line,"--bkscf":a.colors.flat,"--bksci":a.colors.text,"--bkxcl":i.colors.line,"--bkxcf":i.colors.flat,"--bkxci":i.colors.text,"--bkkcl":s.colors.line,"--bkkcf":s.colors.flat,"--bkkci":s.colors.text,"--bklcl":l.colors.line,"--bklcf":l.colors.flat,"--bklci":l.colors.text,"--bkpc":u.color}},dt=e=>{const{parentConfig:n,base:o,baseline:r,guide:s,spacer:a,box:l,stack:i,layout:u,padder:m}=e;return{base:o??n.base,baseline:{...n.baseline,...r},guide:{...n.guide,...s},spacer:{...n.spacer,...a},box:{...n.box,...l},stack:{...n.stack,...i},layout:{...n.layout,...u},padder:{...n.padder,...m}}};function we({children:e,base:n,stack:o,baseline:r,guide:s,layout:a,spacer:l,box:i,padder:u}){const m=Ge(),p=c.useMemo(()=>dt({parentConfig:m,base:n,baseline:r,guide:s,spacer:l,box:i,stack:o,layout:a,padder:u}),[m,n,r,s,l,i,o,a,u]);return w.jsx(Ve,{value:p,children:e})}const nn="spr_zbcF6",on="line_qHW69",rn="flat_gqixr",Qe={spr:nn,line:on,flat:rn},bt=(e,n,o,r)=>({"--bksw":"100%","--bksh":"100%","--bksb":`${e}px`,"--bksci":n,"--bkscl":r,"--bkscf":o}),mt=(e,n,o,r)=>{if(!e||!n)return null;const s=typeof o=="number"?o:0,a=typeof r=="number"?r:0;return w.jsxs(w.Fragment,{children:[a!==0&&w.jsx("span",{children:n(a,"height")},"height"),s!==0&&w.jsx("span",{children:n(s,"width")},"width")]})},gt=c.memo(function({height:n,width:o,indicatorNode:r,debugging:s,variant:a,base:l,color:i,className:u,style:m,children:p,ssrMode:b=!1,...M}){const S=c.useRef(null),h=se("spacer"),{isShown:j}=ie(s,h.debugging),T=a??h.variant,g=l??h.base,[V,N]=c.useState(!1);c.useEffect(()=>{N(!0)},[]);const[R,P]=c.useMemo(()=>Te([o,n],[0,0],{base:g,suppressWarnings:!0}),[o,n,g]),D=re(V&&!b,!1,j&&r!==void 0),k=c.useMemo(()=>D?mt(j,r,R,P):null,[D,j,r,R,P]),O=c.useMemo(()=>bt(g,h.colors.text,h.colors.flat,h.colors.line),[g,h.colors]),I=c.useMemo(()=>{const E=G(P||"100%"),H=G(R||"100%"),W=`${g}px`,v=["--bksw","--bksh"],z={...x({key:"--bksh",value:E,defaultStyles:O,skipDimensions:{fullSize:v}}),...x({key:"--bksw",value:H,defaultStyles:O,skipDimensions:{fullSize:v}}),"--bksb":W,...x({key:"--bksci",value:i??h.colors.text,defaultStyles:O}),...x({key:"--bkscl",value:i??h.colors.line,defaultStyles:O}),...x({key:"--bkscf",value:i??h.colors.flat,defaultStyles:O})};return oe(z,m)},[R,P,i,g,h.colors,O,m]);return w.jsxs("div",{ref:S,"data-testid":"spacer",className:ne(Qe.spr,j&&Qe[T],u),"data-variant":T,style:I,...M,children:[k,p]})}),sn="pad_w2-sL",an="v_lhGBy",je={pad:sn,v:an},ht=(e,n,o,r)=>{const s={};return e!=="fit-content"&&(s["--bkpw"]=G(e||"fit-content")),n!=="fit-content"&&(s["--bkph"]=G(n||"fit-content")),o!==8&&(s["--bkpb"]=`${o}px`),r!=="var(--bk-padder-color-theme)"&&(s["--bkpc"]=r),s},pt=(e,n)=>{const{top:o,right:r,bottom:s,left:a}=n,l={};return e||((o>0||s>0)&&(l.paddingBlock=`${o}px ${s}px`),(a>0||r>0)&&(l.paddingInline=`${a}px ${r}px`)),l},yt=(e,n,o)=>{const r=e||"line",s=n||"none",a=(l,i)=>w.jsx(gt,{variant:r,debugging:i===0||l===0?"none":s,indicatorNode:o,height:i!=="100%"?i:void 0,width:l!=="100%"?l:void 0});return a.displayName="PadderSpacer",a},Ee=c.memo(c.forwardRef(function({children:n,className:o,debugging:r,height:s,indicatorNode:a,style:l,width:i,ssrMode:u=!1,...m},p){const b=se("padder"),{variant:M}=se("spacer"),S=c.useMemo(()=>le(m),[m]),{isShown:h,isNone:j,debugging:T}=ie(r,b.debugging),g=!j,[V,N]=c.useState(!1);c.useEffect(()=>{N(!0)},[]);const R=c.useRef(null),P=he(R,{base:b.base,snapping:"height",spacing:S,warnOnMisalignment:!j}),D={padding:{top:S.top||0,right:S.right||0,bottom:S.bottom||0,left:S.left||0}},{padding:k}=re(V&&!u,D,P),O=Ae(p,R),I=c.useMemo(()=>{const H=ht(i,s,b.base,b.color),W=pt(g,{top:k.top,right:k.right,bottom:k.bottom,left:k.left});return oe({...H,...W},l)},[i,s,b.base,b.color,g,k.top,k.right,k.bottom,k.left,l]),E=c.useMemo(()=>yt(M,T,a),[M,T,a]);return g?w.jsxs("div",{ref:O,"data-testid":"padder",className:ne(je.pad,h&&je.v,o),style:I,children:[w.jsxs(w.Fragment,{children:[k.top>=0&&w.jsx("div",{style:{gridColumn:"1 / -1"},children:E("100%",k.top)}),k.left>=0&&w.jsx("div",{style:{gridRow:"2 / 3"},children:E(k.left,"100%")})]}),w.jsx("div",{style:{gridRow:"2 / 3",gridColumn:"2 / 3"},children:n}),w.jsxs(w.Fragment,{children:[k.right>=0&&w.jsx("div",{style:{gridRow:"2 / 3"},children:E(k.right,"100%")}),k.bottom>=0&&w.jsx("div",{style:{gridColumn:"1 / -1"},children:E("100%",k.bottom)})]})]}):w.jsx("div",{ref:O,"data-testid":"padder",className:ne(je.pad,o),style:I,children:n})})),ln="lay_5cMu5",cn="v_dprVE",et={lay:ln,v:cn},kt=e=>({"--bklw":"auto","--bklh":"auto","--bklcl":e.line,"--bklcf":e.flat,"--bklci":e.text}),Oe=e=>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))",vt=(e,n,o)=>{const r={};return e!==void 0&&(r.gap=G(e)),n!==void 0&&(r.rowGap=G(n)),o!==void 0&&(r.columnGap=G(o)),r},un=c.memo(function({alignContent:n,alignItems:o,children:r,className:s,columns:a="repeat(auto-fit, minmax(100px, 1fr))",columnGap:l,debugging:i,gap:u,height:m,indicatorNode:p,justifyContent:b,justifyItems:M,rowGap:S,rows:h,style:j,variant:T,width:g,ssrMode:V=!1,...N}){const R=se("layout"),{isShown:P,debugging:D}=ie(i,R.debugging),[k,O]=c.useState(!1);c.useEffect(()=>{O(!0)},[]);const I=c.useRef(null),E=c.useMemo(()=>le(N),[N]),H=he(I,{base:R.base,snapping:"height",spacing:E,warnOnMisalignment:!0}),W={padding:{top:E.top||0,right:E.right||0,bottom:E.bottom||0,left:E.left||0}},{padding:v}=re(k&&!V,W,H),z=c.useMemo(()=>Oe(a),[a]),B=c.useMemo(()=>h?Oe(h):"auto",[h]),A=c.useMemo(()=>kt(R.colors),[R.colors]),Q=c.useMemo(()=>vt(u,S,l),[u,S,l]),J=c.useMemo(()=>{const _=G(g||"auto"),Y=G(m||"auto"),L=["--bklw","--bklh"];return oe({...x({key:"--bklw",value:_,defaultStyles:A,skipDimensions:{auto:L}}),...x({key:"--bklh",value:Y,defaultStyles:A,skipDimensions:{auto:L}}),...x({key:"--bklcl",value:R.colors.line,defaultStyles:A}),...x({key:"--bklcf",value:R.colors.flat,defaultStyles:A}),...x({key:"--bklci",value:R.colors.text,defaultStyles:A}),...z!=="repeat(auto-fit, minmax(100px, 1fr))"&&{"--bklgtc":z},...B!=="auto"&&{"--bklgtr":B},...M&&{"--bklji":M},...o&&{"--bklai":o},...b&&{"--bkljc":b},...n&&{"--bklac":n},...Q},j)},[z,B,M,o,b,n,g,m,R.colors,A,j,Q]);return w.jsx(we,{spacer:{variant:T??"line"},children:w.jsx(Ee,{ref:I,className:P?et.v:"",block:[v.top,v.bottom],...p?{indicatorNode:p}:{},inline:[v.left,v.right],debugging:D,width:g,height:m,ssrMode:V,children:w.jsx("div",{"data-testid":"layout",className:ne(s,et.lay),style:J,...N&&Object.keys(N).length>0?Object.fromEntries(Object.entries(N).filter(([_])=>_!=="ssrMode")):{},children:r})})})}),fn="box_rDCRX",dn="v_0MMHD",tt={box:fn,v:dn},xt=(e,n)=>({"--bkxw":"fit-content","--bkxh":"fit-content","--bkxb":`${e}px`,"--bkxcl":n}),St=({width:e,height:n,base:o,lineColor:r,defaultStyles:s})=>{const a=G(e||"fit-content"),l=G(n||"fit-content"),i=["--bkxw","--bkxh"];return{...x({key:"--bkxw",value:a,defaultStyles:s,skipDimensions:{fitContent:i}}),...x({key:"--bkxh",value:l,defaultStyles:s,skipDimensions:{fitContent:i}}),...x({key:"--bkxb",value:`${o}px`,defaultStyles:s}),...x({key:"--bkxcl",value:r,defaultStyles:s})}},bn=c.memo(c.forwardRef(function({children:n,snapping:o="clamp",debugging:r,className:s,colSpan:a,rowSpan:l,span:i,width:u,height:m,style:p,ssrMode:b=!1,...M},S){const h=se("box"),{isShown:j,debugging:T}=ie(r,h.debugging),[g,V]=c.useState(!1);c.useEffect(()=>{V(!0)},[]);const N=c.useRef(null),{top:R,bottom:P,left:D,right:k}=le(M),O=he(N,{base:h.base,snapping:o,spacing:{top:R,bottom:P,left:D,right:k},warnOnMisalignment:T!=="none"}),I={padding:{top:R||0,right:k||0,bottom:P||0,left:D||0}},{padding:E}=re(g&&!b,I,O),H=c.useMemo(()=>lt(i,a,l),[a,l,i]),W=c.useMemo(()=>xt(h.base,h.colors.line),[h.base,h.colors.line]),v=c.useMemo(()=>{const z=St({width:u,height:m,base:h.base,lineColor:h.colors.line,defaultStyles:W});return oe(z,p)},[h.base,h.colors.line,u,m,W,p]);return w.jsx("div",{ref:Ae(S,N),"data-testid":"box",className:ne(tt.box,j&&tt.v,s),style:oe(v,H),children:w.jsx(we,{base:1,spacer:{variant:"flat"},children:w.jsx(Ee,{block:[E.top,E.bottom],inline:[E.left,E.right],width:"fit-content",height:m,debugging:T,ssrMode:b,children:n})})})})),mn="stk_l-58l",gn="v_-k3qw",nt={stk:mn,v:gn},wt={x:"row",y:"column","-x":"row-reverse","-y":"column-reverse"},Et=e=>({"--bkkw":"auto","--bkkh":"auto","--bkkcl":e.line,"--bkkcf":e.flat,"--bkkci":e.text}),Ct=(e,n,o)=>({rowGap:o!==void 0?o:e,columnGap:o!==void 0?o:n}),hn=c.memo(function({align:n="flex-start",children:o,className:r,columnGap:s,debugging:a,direction:l="row",gap:i,height:u,indicatorNode:m,justify:p="flex-start",rowGap:b,style:M,variant:S,width:h,ssrMode:j=!1,...T}){const g=se("stack"),{isShown:V,debugging:N}=ie(a,g.debugging),[R,P]=c.useState(!1);c.useEffect(()=>{P(!0)},[]);const D=c.useRef(null),{top:k,right:O,bottom:I,left:E}=le({...T}),H=he(D,{base:g.base,snapping:"height",spacing:{top:k,right:O,bottom:I,left:E},warnOnMisalignment:N!=="none"}),W={padding:{top:k||0,right:O||0,bottom:I||0,left:E||0}},{padding:v}=re(R&&!j,W,H),z=c.useMemo(()=>{const J=b!==void 0?Number(b):void 0,_=s!==void 0?Number(s):void 0,Y=i!==void 0?Number(i):void 0;return Ct(J,_,Y)},[b,s,i]),B=c.useMemo(()=>Et(g.colors),[g.colors]),A=c.useMemo(()=>{const J=G(h||"auto"),_=G(u||"auto"),Y=wt[l]||l,L=["--bkkw","--bkkh"],Z={...x({key:"--bkkw",value:J,defaultStyles:B,skipDimensions:{auto:L}}),...x({key:"--bkkh",value:_,defaultStyles:B,skipDimensions:{auto:L}}),...x({key:"--bkkcl",value:g.colors.line,defaultStyles:B}),...x({key:"--bkkcf",value:g.colors.flat,defaultStyles:B}),...x({key:"--bkkci",value:g.colors.text,defaultStyles:B})};return oe({flexDirection:Y,justifyContent:p,alignItems:n,width:h,height:u},z,Z,M)},[l,p,n,h,u,g.colors.line,g.colors.flat,g.colors.text,B,z,M]),Q=N==="none"?{...A,paddingBlock:`${v.top}px ${v.bottom}px`,paddingInline:`${v.left}px ${v.right}px`}:A;return w.jsx(we,{spacer:{variant:S??"line"},children:w.jsx(Ee,{ref:D,className:V?nt.v:"",block:[v.top,v.bottom],inline:[v.left,v.right],debugging:N,indicatorNode:m,width:h,height:u,ssrMode:j,children:w.jsx("div",{"data-testid":"stack",className:ne(r,nt.stk),style:Q,...T,children:o})})})}),pn="gde_-Naxo",yn="line_-VS-e",kn="cols_8lD6D",vn="col_rlbsL",fe={gde:pn,line:yn,cols:kn,col:vn},Rt=e=>{const{variant:n,base:o,gap:r,columns:s,columnWidth:a}=e;return{line:{variant:"line",gap:r-1,base:o},auto:a?{variant:"auto",columnWidth:a,gap:r,base:o}:null,pattern:Array.isArray(s)?{variant:"pattern",columns:s,gap:r,base:o}:null,fixed:typeof s=="number"?{variant:"fixed",columns:s,columnWidth:a,gap:r,base:o}:null}[n]??{variant:"line",gap:r-1,base:o}},_t=(e,n)=>({"--bkgw":"auto","--bkgh":"auto","--bkgmw":"none","--bkgcw":"60px","--bkggw":"24px","--bkgc":"12","--bkgb":`${e}px`,"--bkgcl":n}),xn=c.memo(function({className:n,debugging:o,style:r,variant:s,align:a="start",gap:l,height:i,width:u,columns:m,columnWidth:p,gutterWidth:b,maxWidth:M,color:S,children:h,ssrMode:j=!1,...T}){const g=se("guide"),V=s??g.variant,N=typeof l=="number"?l:g.base,[R,P]=c.useState(!1);c.useEffect(()=>{P(!0)},[]);const D=c.useRef(null),k=ge(D),O=re(R&&!j,{width:1024,height:768,refresh:()=>{}},k),{width:I,height:E}=O,{isShown:H}=ie(o,g.debugging),W=c.useMemo(()=>Rt({variant:V,base:g.base,gap:N,columns:m,columnWidth:p}),[V,g.base,N,m,p]),{template:v,columnsCount:z,calculatedGap:B}=ut(D,W),A=c.useMemo(()=>_t(g.base,g.colors.line),[g.base,g.colors.line]),Q=c.useMemo(()=>{const J=G(u||I||"auto"),_=G(i||E||"auto"),Y=G(M||"none"),L=G(p||"60px"),Z=G(b||"24px"),q=["--bkgw","--bkgh"],X={...x({key:"--bkgw",value:J,defaultStyles:A,skipDimensions:{auto:q}}),...x({key:"--bkgh",value:_,defaultStyles:A,skipDimensions:{auto:q}}),...x({key:"--bkgmw",value:Y,defaultStyles:A}),...x({key:"--bkgcw",value:L,defaultStyles:A}),...x({key:"--bkggw",value:Z,defaultStyles:A}),...x({key:"--bkgc",value:`${z}`,defaultStyles:A}),...x({key:"--bkgb",value:`${g.base}px`,defaultStyles:A}),...x({key:"--bkgcl",value:S??g.colors.line,defaultStyles:A}),"--bkgg":`${B}px`,...v&&v!=="none"?{"--bkgt":v}:{},...v&&v!=="none"?{gridTemplateColumns:v}:{},...B?{gap:`${B}px`}:{},justifyContent:a};return oe(X,r)},[u,i,M,p,b,z,S,v,B,I,E,g.base,g.colors.line,A,r,a]);return w.jsxs("div",{ref:D,"data-testid":"guide",className:ne(fe.gde,n,H?fe.v:fe.h,V==="line"&&fe.line),"data-variant":V,style:Q,...T,children:[H&&w.jsx("div",{className:fe.cols,"data-variant":V,children:Array.from({length:z},(J,_)=>{const Y=g.colors[V]??g.colors.line;return w.jsx("div",{className:fe.col,"data-column-index":_,"data-variant":V,style:{backgroundColor:Y}},_)})}),h]})}),Sn=/^\d*\.?\d+(?:fr|px|%|em|rem|vh|vw|vmin|vmax|pt|pc|in|cm|mm)$/,jt=e=>typeof e=="number"?Number.isFinite(e)&&e>=0:typeof e!="string"?!1:e==="auto"||e==="100%"||Sn.test(e),Ot=e=>Array.isArray(e)&&e.length>0&&e.every(jt),wn=e=>{const n=[...Object.keys(ve),...Me];return typeof e=="number"||typeof e=="string"&&n.some(o=>e.endsWith(o))},En=e=>typeof e=="string"&&At.includes(e),De=e=>typeof e=="object"&&e!==null,Cn=e=>De(e)&&e.variant==="line",Rn=e=>De(e)&&"columns"in e&&!("variant"in e),_n=e=>De(e)&&"columnWidth"in e&&!("variant"in e)&&!("columns"in e),jn="bas_e-SXr",On="row_q-FZb",ke={bas:jn,row:On},Mt=(e,n,o)=>({"--bkbw":"100%","--bkbh":"100%","--bkbb":`${e}px`,"--bkbcl":n,"--bkbcf":o}),Tt=e=>{const{index:n,base:o,variant:r,chosenColor:s,lineColor:a,flatColor:l}=e;return{"--bkrt":n===0?"0px":`${n*o}px`,"--bkrh":r==="line"?"1px":`${o}px`,"--bkbc":s||(r==="line"?a:l)}},Mn=c.memo(function({className:n,debugging:o,style:r,variant:s,height:a,width:l,base:i,color:u,ssrMode:m=!1,...p}){const b=se("baseline"),M=s??b.variant,S=i??b.base,{isShown:h}=ie(o,b.debugging),j=c.useRef(null),[T,g]=c.useState(!1),V=ge(j);c.useEffect(()=>{g(!0)},[]);const N=re(T,it,V),{width:R,height:P}=N,[D,k]=c.useMemo(()=>Te([l,a],[R,P]),[l,a,R,P]),{top:O,right:I,bottom:E,left:H}=c.useMemo(()=>le(p),[p]),W=c.useMemo(()=>{const Z=[O,I,E,H].map(q=>q?`${q}px`:"0").join(" ");return Z!=="0 0 0 0"?Z:void 0},[O,I,E,H]),v=c.useMemo(()=>st({height:k,top:O,bottom:E,base:S}),[k,O,E,S]),z=ct({totalLines:v,lineHeight:S,containerRef:j,buffer:160}),B={start:0,end:Math.min(10,v)},{start:A,end:Q}=re(T&&!m,B,z),J=u||(M==="line"?b.colors.line:b.colors.flat),_=c.useMemo(()=>Mt(S,b.colors.line,b.colors.flat),[S,b.colors.line,b.colors.flat]),Y=c.useMemo(()=>{const Z=G(l||"100%"),q=G(a||"100%"),X=["--bkbw","--bkbh"];return oe({...x({key:"--bkbw",value:Z,defaultStyles:_,skipDimensions:{fullSize:X}}),...x({key:"--bkbh",value:q,defaultStyles:_,skipDimensions:{fullSize:X}}),...x({key:"--bkbb",value:`${S}px`,defaultStyles:_}),...x({key:"--bkbcl",value:u||b.colors.line,defaultStyles:_}),...x({key:"--bkbcf",value:u||b.colors.flat,defaultStyles:_}),...W&&{padding:W}},r)},[l,a,S,u,b.colors.line,b.colors.flat,W,_,r]),L=c.useCallback(Z=>Tt({index:Z,base:S,variant:M,chosenColor:J,lineColor:b.colors.line,flatColor:b.colors.flat}),[S,M,J,b.colors.line,b.colors.flat]);return w.jsx("div",{ref:j,"data-testid":"baseline",className:ne(ke.bas,h?ke.v:ke.h,n),style:Y,...p,children:h&&Array.from({length:Q-A},(Z,q)=>{const X=q+A;return w.jsx("div",{className:ke.row,"data-row-index":X,style:L(X)},X)})})}),At=["start","center","end"],Tn=["line","flat"];exports.ABSOLUTE_UNIT_CONVERSIONS=ve;exports.Baseline=Mn;exports.Box=bn;exports.Config=we;exports.DEFAULT_CONFIG=ft;exports.DIRECTION_AXIS=wt;exports.GRID_ALIGNMENTS=At;exports.Guide=xn;exports.Layout=un;exports.PADD_VARIANTS=Tn;exports.Padder=Ee;exports.RELATIVE_UNITS=Me;exports.SSR_DIMENSIONS=it;exports.Spacer=gt;exports.Stack=hn;exports.calculateRowCount=st;exports.calculateSnappedSpacing=at;exports.clamp=rt;exports.convertValue=Se;exports.createBaselineRowStyle=Tt;exports.createBoxCustomStyles=St;exports.createCSSVariables=tn;exports.createDefaultBaselineStyles=Mt;exports.createDefaultBoxStyles=xt;exports.createDefaultGuideStyles=_t;exports.createDefaultLayoutStyles=kt;exports.createDefaultSpacerStyles=bt;exports.createDefaultStackStyles=Et;exports.createDirectPaddingStyles=pt;exports.createGridConfig=Rt;exports.createGridGapStyles=vt;exports.createGridSpanStyles=lt;exports.createPadderContainerStyles=ht;exports.createRenderSpacerFn=yt;exports.createStackGapStyles=Ct;exports.createStyleOverride=x;exports.debounce=Ut;exports.formatValue=G;exports.generateMeasurements=mt;exports.getGridTemplate=Oe;exports.hydratedValue=re;exports.isAutoCalculatedGuide=_n;exports.isGuideAlignment=En;exports.isGuideColumnConfig=Rn;exports.isGuideLineConfig=Cn;exports.isGuideValue=wn;exports.isSSR=$e;exports.isValidGuideColumnValue=jt;exports.isValidGuidePattern=Ot;exports.mergeClasses=ne;exports.mergeConfig=dt;exports.mergeRefs=Ae;exports.mergeStyles=oe;exports.moduloize=Bt;exports.normalizeValue=xe;exports.normalizeValuePair=Te;exports.parsePadding=le;exports.parseUnit=ot;exports.rafThrottle=Ne;exports.round=Pt;exports.safeClientValue=Ft;exports.useBaseline=he;exports.useConfig=se;exports.useDebug=ie;exports.useDefaultConfig=Ge;exports.useGuide=ut;exports.useMeasure=ge;exports.useVirtual=ct;
|
|
32
32
|
//# sourceMappingURL=index.cjs.map
|