baseline-kit 2.0.1 → 3.0.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 +258 -102
- package/dist/README.md +258 -102
- package/dist/baseline-kit.css +151 -0
- package/dist/components/Baseline/Baseline.d.ts +4 -5
- package/dist/components/Box/Box.d.ts +16 -5
- package/dist/components/Config/Config.d.ts +60 -17
- package/dist/components/Config/defaults.d.ts +2 -2
- package/dist/components/Config/index.d.ts +1 -1
- package/dist/components/Guide/Guide.d.ts +21 -12
- package/dist/components/Guide/index.d.ts +0 -6
- package/dist/components/Guide/types.d.ts +1 -1
- package/dist/components/Layout/Layout.d.ts +10 -6
- package/dist/components/Padder/Padder.d.ts +13 -7
- package/dist/components/Spacer/Spacer.d.ts +40 -11
- package/dist/components/Stack/Stack.d.ts +15 -8
- package/dist/components/index.d.ts +4 -3
- package/dist/components/styles/index.d.ts +11 -0
- package/dist/components/types.d.ts +3 -3
- package/dist/hooks/useBaseline.d.ts +13 -18
- package/dist/hooks/useConfig.d.ts +3 -8
- package/dist/hooks/useDebug.d.ts +1 -6
- package/dist/hooks/useGuide.d.ts +2 -7
- package/dist/hooks/useIsClient.d.ts +6 -0
- package/dist/hooks/useVirtual.d.ts +0 -5
- package/dist/index.cjs +1 -31
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +25 -3
- package/dist/index.mjs +1557 -1542
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/styles.d.ts +6 -0
- package/dist/theme/dark.css +67 -0
- package/dist/theme/default.css +82 -0
- package/dist/theme/tokens.css +82 -0
- package/dist/theme.css +142 -0
- package/dist/theme.d.ts +6 -0
- package/dist/utils/convert.d.ts +0 -22
- package/dist/utils/grid.d.ts +22 -0
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/math.d.ts +20 -36
- package/dist/utils/merge.d.ts +54 -5
- package/dist/utils/normalize.d.ts +0 -35
- package/dist/utils/parse.d.ts +0 -34
- package/dist/utils/snapping.d.ts +0 -5
- package/dist/utils/ssr.d.ts +26 -0
- package/dist/utils/timing.d.ts +0 -5
- package/package.json +81 -39
package/dist/index.cjs
CHANGED
|
@@ -1,32 +1,2 @@
|
|
|
1
|
-
"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={};/**
|
|
2
|
-
* @license React
|
|
3
|
-
* react-jsx-runtime.production.js
|
|
4
|
-
*
|
|
5
|
-
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
6
|
-
*
|
|
7
|
-
* This source code is licensed under the MIT license found in the
|
|
8
|
-
* LICENSE file in the root directory of this source tree.
|
|
9
|
-
*/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={};/**
|
|
10
|
-
* @license React
|
|
11
|
-
* react-jsx-runtime.development.js
|
|
12
|
-
*
|
|
13
|
-
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
14
|
-
*
|
|
15
|
-
* This source code is licensed under the MIT license found in the
|
|
16
|
-
* LICENSE file in the root directory of this source tree.
|
|
17
|
-
*/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(`
|
|
18
|
-
at`)?" (<anonymous>)":-1<u.stack.indexOf("@")?"@unknown:0:0":""}return`
|
|
19
|
-
`+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(`
|
|
20
|
-
`),te=ne.split(`
|
|
21
|
-
`);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=`
|
|
22
|
-
`+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:
|
|
23
|
-
let props = %s;
|
|
24
|
-
<%s {...props} />
|
|
25
|
-
React keys must be passed directly to JSX without using spread:
|
|
26
|
-
let props = %s;
|
|
27
|
-
<%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=`
|
|
28
|
-
|
|
29
|
-
Check the render method of \``+u+"`."),c||(t=e(t))&&(c=`
|
|
30
|
-
|
|
31
|
-
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"&<.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;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("react/jsx-runtime"),W=require("react");function ye(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const s=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,s.get?s:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const l=ye(W),ve={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)"},xe={line:"var(--bk-baseline-color-line-theme)",flat:"var(--bk-baseline-color-flat-theme)"},we={line:"var(--bk-spacer-color-line-theme)",flat:"var(--bk-spacer-color-flat-theme)",text:"var(--bk-spacer-color-text-theme)"},Se={line:"var(--bk-box-color-line-theme)",flat:"var(--bk-box-color-flat-theme)",text:"var(--bk-box-color-text-theme)"},Ce={line:"var(--bk-stack-color-line-theme)",flat:"var(--bk-stack-color-flat-theme)",text:"var(--bk-stack-color-text-theme)"},Me={line:"var(--bk-layout-color-line-theme)",flat:"var(--bk-layout-color-flat-theme)",text:"var(--bk-layout-color-text-theme)"},Re="var(--bk-padder-color-theme)",je={base:8,baseline:{variant:"line",debugging:"hidden",colors:xe},guide:{variant:"line",debugging:"hidden",colors:ve},spacer:{variant:"line",debugging:"hidden",colors:we},box:{debugging:"hidden",colors:Se},stack:{debugging:"hidden",colors:Ce},layout:{debugging:"hidden",colors:Me},padder:{debugging:"hidden",color:Re}},se=l.createContext(je);se.displayName="ConfigContext";const fe=()=>l.use(se),$e=e=>{const{parentConfig:t,base:n,baseline:s,guide:o,spacer:r,box:i,stack:a,layout:c,padder:d}=e;return{base:n??t.base,baseline:{...t.baseline,...s},guide:{...t.guide,...o},spacer:{...t.spacer,...r},box:{...t.box,...i},stack:{...t.stack,...a},layout:{...t.layout,...c},padder:{...t.padder,...d}}};function P({children:e,base:t,stack:n,baseline:s,guide:o,layout:r,spacer:i,box:a,padder:c}){const d=fe(),b=l.useMemo(()=>$e({parentConfig:d,base:t,baseline:s,guide:o,spacer:i,box:a,stack:n,layout:r,padder:c}),[d,t,s,o,i,a,n,r,c]);return f.jsx(se,{value:b,children:e})}function Ee(e){const t=e.trim().match(/^([+-]?[\d.]+)([a-zA-Z%]+)$/);if(!t)return null;const n=parseFloat(t[1]),s=t[2];return{value:n,unit:s}}function O(e,t){return e===void 0&&t!==void 0?`${t}px`:e==="auto"||typeof e=="string"&&/^(auto|100%|0|.*(fr|vh|vw|vmin|vmax|rem))$/.test(e)?String(e):typeof e=="number"?`${e}px`:e??""}const Ve={parentSize:0,viewportWidth:typeof window<"u"?window.innerWidth:1920,viewportHeight:typeof window<"u"?window.innerHeight:1080,rootFontSize:16,parentFontSize:16},ie={px:1,in:96,cm:37.8,mm:3.78,pt:1.33,pc:16},Oe=["em","rem","vh","vw","vmin","vmax","%"];function be(e,t){if(typeof e=="number")return e;if(typeof e!="string")return null;const n=Ee(e);if(!n)return null;const{value:s,unit:o}=n;if(o in ie)return s*ie[o];if(o==="auto")return null;if(Oe.includes(o)){const r={...Ve,...t};switch(o){case"em":return s*r.parentFontSize;case"rem":return s*r.rootFontSize;case"vh":return s/100*r.viewportHeight;case"vw":return s/100*r.viewportWidth;case"vmin":return s/100*Math.min(r.viewportWidth,r.viewportHeight);case"vmax":return s/100*Math.max(r.viewportWidth,r.viewportHeight);case"%":return s/100*r.parentSize;default:return null}}return null}function Ge(e,t,n){return Math.min(Math.max(e,t),n)}function _e(e){const{height:t,top:n,bottom:s,base:o}=e,r=(t??0)-(n+s);return Math.max(1,Math.floor(r/o))}function oe(e,t={}){const{base:n=8,round:s=!0,clamp:o,suppressWarnings:r=!1}=t;if(e==="auto")return n;let i=null;if(typeof e=="number")i=e;else if(typeof e=="string"){const d=be(e);d===null?(r||console.error(`Failed to convert "${e}" to pixels. Falling back to base ${n}.`),i=n):i=d}i===null&&(i=n);const a=s?Math.round(i/n)*n:i,c=o!==void 0?Ge(a,o.min??-1/0,o.max??1/0):a;return!r&&c!==i&&console.warn(`Normalized ${i} to ${c} to match base ${n}px.`),c}function me(e,t,n){if(!e||e[0]===void 0&&e[1]===void 0)return t;const s=e[0]!==void 0?oe(e[0],n):t[0],o=e[1]!==void 0?oe(e[1],n):t[1];return[s,o]}function Z(e){if("padding"in e&&e.padding!=null)return De(e.padding);const t="block"in e&&e.block!=null?Ae(e.block):{top:0,bottom:0},n="inline"in e&&e.inline!=null?Le(e.inline):{left:0,right:0};return{top:t.top,right:n.right,bottom:t.bottom,left:n.left}}function De(e){if(typeof e=="number")return{top:e,right:e,bottom:e,left:e};if(Array.isArray(e)){if(e.length===2){const[t,n]=e;return{top:t,right:n,bottom:t,left:n}}if(e.length>=4){const[t,n,s,o]=e;return{top:t??0,right:n??0,bottom:s??0,left:o??0}}}if(typeof e=="object"&&!Array.isArray(e)){const t=e.top??0,n=e.bottom??0,s=e.left??0,o=e.right??0;return{top:t,right:o,bottom:n,left:s}}return{top:0,right:0,bottom:0,left:0}}function Ae(e){if(typeof e=="number")return{top:e,bottom:e};if(Array.isArray(e)){const[t,n]=e;return{top:t??0,bottom:n??0}}return typeof e=="object"?{top:e.start??0,bottom:e.end??0}:{top:0,bottom:0}}function Le(e){if(typeof e=="number")return{left:e,right:e};if(Array.isArray(e)){const[t,n]=e;return{left:t??0,right:n??0}}return typeof e=="object"?{left:e.start??0,right:e.end??0}:{left:0,right:0}}function Ie(e,t,n,s){const o=Z({padding:n});if(s==="none")return o;if(s==="height"){const r=e%t;r!==0&&(o.bottom+=t-r)}if(s==="clamp"){o.top=o.top%t;const r=e%t;r!==0&&(o.bottom+=t-r),o.bottom=o.bottom%t}return o}const Ne=(e,t,n)=>{const s={};return e!==void 0?(s.gridColumn=`span ${e}`,s.gridRow=`span ${e}`):(t!==void 0&&(s.gridColumn=`span ${t}`),n!==void 0&&(s.gridRow=`span ${n}`)),s},z=(...e)=>e.filter(Boolean).join(" ").trim(),X=(...e)=>Object.assign({},...e.filter(t=>t!==void 0));function Be(e,t){if(e)if(typeof e=="function")e(t);else try{Object.assign(e,{current:t})}catch(n){console.error("Error assigning ref:",n)}}function ge(...e){return t=>{e.forEach(n=>{Be(n,t)})}}function y(e,t,n){var a,c,d;const s=typeof e=="string"?e:e.key,o=typeof e=="string"?t:e.value,r=typeof e=="string"?n:e.defaultStyles,i=typeof e=="object"?e.skipDimensions:void 0;if(i){if((a=i.fitContent)!=null&&a.includes(s)&&o==="fit-content")return{};if((c=i.auto)!=null&&c.includes(s)&&o==="auto")return{};if((d=i.fullSize)!=null&&d.includes(s)&&(o==="100%"||o==="100vh"||o==="100vw"))return{}}return o!==r[s]?{[s]:o}:{}}const he=e=>{let t=null,n=null;return(...o)=>{n=o,t!==null&&cancelAnimationFrame(t),t=requestAnimationFrame(()=>{e(...n),t=null,n=null})}};function We(){const[e,t]=W.useState(!1);return W.useEffect(()=>{t(!0)},[]),e}const re=typeof window>"u";function ze(e,t){if(re)return t;try{return e()}catch{return t}}function K(e,t,n){return!e||re?t:n}function pe({children:e,fallback:t=null}){return We()?f.jsx(f.Fragment,{children:e}):f.jsx(f.Fragment,{children:t})}function J(e){const[t,n]=l.useState({width:0,height:0}),s=l.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};n(a=>a.width===i.width&&a.height===i.height?a:i)}catch{n({width:0,height:0})}},[e]),o=l.useMemo(()=>he(s),[s]);return l.useLayoutEffect(()=>{typeof window>"u"||s()},[s]),l.useLayoutEffect(()=>{if(typeof window>"u"||!e.current)return;const r=new ResizeObserver(()=>{o()});return r.observe(e.current),()=>{r.disconnect()}},[e,o]),{...t,refresh:o}}function Fe({totalLines:e,lineHeight:t,containerRef:n,buffer:s=0}){const o=W.useMemo(()=>typeof s=="number"?s:parseInt(s,10)||0,[s]),r=W.useCallback(()=>{const b=n.current;if(!b)return{start:0,end:e};if(b.closest(".block"))return{start:0,end:e};const M=b.getBoundingClientRect().top+window.scrollY,v=Math.max(0,window.scrollY-M-o),m=v+window.innerHeight+o*2,w=Math.max(0,Math.floor(v/t)),p=Math.min(e,Math.ceil(m/t));return{start:w,end:p}},[e,t,n,o]),[i,a]=W.useState(r);He(["scroll","resize"],()=>{d()});const c=W.useCallback(()=>{a(b=>{const u=r();return b.start!==u.start||b.end!==u.end?u:b})},[r]),d=W.useMemo(()=>he(c),[c]);return W.useLayoutEffect(()=>{const b=n.current;if(!b)return;const u=new IntersectionObserver(d,{threshold:0});return u.observe(b),d(),()=>{u.disconnect()}},[n,r,d]),i}function He(e,t){const n=W.useCallback(t,[t]);W.useLayoutEffect(()=>{const s=()=>n();return e.forEach(o=>window.addEventListener(o,s)),()=>e.forEach(o=>window.removeEventListener(o,s))},[e,n])}function Q(e,{base:t=8,snapping:n="none",spacing:s={},warnOnMisalignment:o=!1}={}){if(t<1)throw new Error("Base must be >= 1 for baseline alignment.");const{height:r}=J(e),i=l.useRef(!1),a=l.useRef(!1);return l.useMemo(()=>{const c=Z({padding:s}),d=r%t===0;if(!d&&o&&process.env.NODE_ENV==="development"&&(a.current||(console.warn(`[useBaseline] Element height (${r}px) is not aligned with base (${t}px).`),a.current=!0)),n==="none")return{padding:c,isAligned:d,height:r};if(i.current)return{padding:c,isAligned:d,height:r};const b=Ie(r,t,c,n);return i.current=!0,{padding:b,isAligned:d,height:r}},[t,n,s,o,r])}const Te="spr_zbcF6",Ue="line_qHW69",qe="flat_gqixr",ae={spr:Te,line:Ue,flat:qe},Xe=(e,t,n,s)=>({"--bksw":"100%","--bksh":"100%","--bksb":`${e}px`,"--bksct":t,"--bkscf":n,"--bkscl":s}),Ye=(e,t,n,s)=>{if(!e||!t)return null;const o=typeof n=="number"?n:0,r=typeof s=="number"?s:0;return f.jsxs(f.Fragment,{children:[r!==0&&f.jsx("span",{children:t(r,"height")},"height"),o!==0&&f.jsx("span",{children:t(o,"width")},"width")]})},ke=l.memo(function({height:t,width:n,indicatorNode:s,debugging:o,variant:r,base:i,color:a,className:c,style:d,children:b,ssrMode:u=!1,...M}){const v=l.useRef(null),m=H("spacer"),{isShown:w}=U(o,m.debugging),p=r??m.variant,h=i??m.base,[G,S]=l.useState(!1);l.useEffect(()=>{S(!0)},[]);const[x,R]=l.useMemo(()=>me([n,t],[0,0],{base:h,suppressWarnings:!0}),[n,t,h]),A=K(G&&!u,!1,w&&s!==void 0),g=l.useMemo(()=>A?Ye(w,s,x,R):null,[A,w,s,x,R]),V=l.useMemo(()=>Xe(h,m.colors.text,m.colors.flat,m.colors.line),[h,m.colors]),D=l.useMemo(()=>{const k=O(R||"100%"),N=O(x||"100%"),_=`${h}px`,E=["--bksw","--bksh"],L={...y({key:"--bksh",value:k,defaultStyles:V,skipDimensions:{fullSize:E}}),...y({key:"--bksw",value:N,defaultStyles:V,skipDimensions:{fullSize:E}}),"--bksb":_,...y({key:"--bksct",value:a??m.colors.text,defaultStyles:V}),...y({key:"--bkscl",value:a??m.colors.line,defaultStyles:V}),...y({key:"--bkscf",value:a??m.colors.flat,defaultStyles:V})};return X(L,d)},[x,R,a,h,m.colors,V,d]);return f.jsxs("div",{ref:v,"data-testid":"spacer",className:z(ae.spr,w&&ae[p],c),"data-variant":p,"data-height":typeof R=="number"?`${R}px`:R,style:D,...M,children:[g,b]})}),Ze="pad_w2-sL",Ke="v_lhGBy",ne={pad:Ze,v:Ke},Pe=(e,t,n,s)=>{const o={};return e!=="fit-content"&&(o["--bkpw"]=O(e||"fit-content")),t!=="fit-content"&&(o["--bkph"]=O(t||"fit-content")),o["--bkpb"]=`${n}px`,o["--bkpc"]=s,o},Je=(e,t)=>{const{top:n,right:s,bottom:o,left:r}=t,i={};return e||((n>0||o>0)&&(i.paddingBlock=`${n}px ${o}px`),(r>0||s>0)&&(i.paddingInline=`${r}px ${s}px`)),i},Qe=(e,t,n)=>{const s=e||"line",o=t||"none",r=(i,a)=>f.jsx(ke,{variant:s,debugging:a===0||i===0?"none":o,indicatorNode:n,height:a!=="100%"?a:void 0,width:i!=="100%"?i:void 0});return r.displayName="PadderSpacer",r},ee=l.memo(l.forwardRef(function({children:t,className:n,debugging:s,height:o,indicatorNode:r,style:i,width:a,ssrMode:c=!1,...d},b){const u=H("padder"),{variant:M}=H("spacer"),v=l.useMemo(()=>Z(d),[d]),{isShown:m,isNone:w,debugging:p}=U(s,u.debugging),h=!w,[G,S]=l.useState(!1);l.useEffect(()=>{S(!0)},[]);const x=l.useRef(null),R=Q(x,{base:u.base,snapping:"height",spacing:v,warnOnMisalignment:!w}),A={padding:{top:v.top||0,right:v.right||0,bottom:v.bottom||0,left:v.left||0}},{padding:g}=K(G&&!c,A,R),V=ge(b,x),D=l.useMemo(()=>{const N=Pe(a,o,u.base,u.color),_=Je(h,{top:g.top,right:g.right,bottom:g.bottom,left:g.left});return X({...N,..._},i)},[a,o,u.base,u.color,h,g.top,g.right,g.bottom,g.left,i]),k=l.useMemo(()=>Qe(M,p,r),[M,p,r]);return h?f.jsxs("div",{ref:V,"data-testid":"padder",className:z(ne.pad,m&&ne.v,n),style:D,children:[f.jsxs(f.Fragment,{children:[g.top>=0&&f.jsx("div",{style:{gridColumn:"1 / -1"},children:k("100%",g.top)}),g.left>=0&&f.jsx("div",{style:{gridRow:"2 / 3"},children:k(g.left,"100%")})]}),f.jsx("div",{style:{gridRow:"2 / 3",gridColumn:"2 / 3"},children:t}),f.jsxs(f.Fragment,{children:[g.right>=0&&f.jsx("div",{style:{gridRow:"2 / 3"},children:k(g.right,"100%")}),g.bottom>=0&&f.jsx("div",{style:{gridColumn:"1 / -1"},children:k("100%",g.bottom)})]})]}):f.jsx("div",{ref:V,"data-testid":"padder",className:z(ne.pad,n),style:D,children:t})})),et="lay_5cMu5",tt="v_dprVE",le={lay:et,v:tt},nt=e=>({"--bklw":"auto","--bklh":"auto","--bklcl":e.line,"--bklcf":e.flat,"--bklci":e.text}),ce=e=>typeof e=="number"?`repeat(${e}, 1fr)`:typeof e=="string"?e:Array.isArray(e)?e.map(t=>typeof t=="number"?`${t}px`:t).join(" "):"repeat(auto-fill, minmax(100px, 1fr))",ot=(e,t,n)=>{const s={};return e!==void 0&&(s.gap=O(e)),t!==void 0&&(s.rowGap=O(t)),n!==void 0&&(s.columnGap=O(n)),s},st=l.memo(function({alignContent:t,alignItems:n,children:s,className:o,columns:r="repeat(auto-fill, minmax(100px, 1fr))",columnGap:i,debugging:a,gap:c,height:d,indicatorNode:b,justifyContent:u,justifyItems:M,rowGap:v,rows:m,style:w,variant:p,width:h,ssrMode:G=!1,...S}){const x=H("layout"),{isShown:R,debugging:A}=U(a,x.debugging),[g,V]=l.useState(!1);l.useEffect(()=>{V(!0)},[]);const D=l.useRef(null),k=l.useMemo(()=>Z(S),[S]),N=Q(D,{base:x.base,snapping:"height",spacing:k,warnOnMisalignment:!0}),_={padding:{top:k.top||0,right:k.right||0,bottom:k.bottom||0,left:k.left||0}},{padding:E}=K(g&&!G,_,N),L=l.useMemo(()=>ce(r),[r]),C=l.useMemo(()=>m?ce(m):"auto",[m]),$=l.useMemo(()=>nt(x.colors),[x.colors]),j=l.useMemo(()=>ot(c,v,i),[c,v,i]),I=l.useMemo(()=>{const B=O(h||"auto"),Y=O(d||"auto"),q=["--bklw","--bklh"];return X({...y({key:"--bklw",value:B,defaultStyles:$,skipDimensions:{auto:q}}),...y({key:"--bklh",value:Y,defaultStyles:$,skipDimensions:{auto:q}}),...y({key:"--bklcl",value:x.colors.line,defaultStyles:$}),...y({key:"--bklcf",value:x.colors.flat,defaultStyles:$}),...y({key:"--bklci",value:x.colors.text,defaultStyles:$}),...L!=="repeat(auto-fill, minmax(100px, 1fr))"&&{"--bklgtc":L},...C!=="auto"&&{"--bklgtr":C},...M&&{"--bklji":M},...n&&{"--bklai":n},...u&&{"--bkljc":u},...t&&{"--bklac":t},...j},w)},[L,C,M,n,u,t,h,d,x.colors,$,w,j]);return f.jsx(P,{spacer:{variant:p??"line"},children:f.jsx(ee,{ref:D,className:R?le.v:"",block:[E.top,E.bottom],...b?{indicatorNode:b}:{},inline:[E.left,E.right],debugging:A,width:h,height:d,ssrMode:G,children:f.jsx("div",{"data-testid":"layout",className:z(o,le.lay),style:I,...S&&Object.keys(S).length>0?Object.fromEntries(Object.entries(S).filter(([B])=>B!=="ssrMode")):{},children:s})})})}),rt="box_rDCRX",it="v_0MMHD",ue={box:rt,v:it},at=(e,t)=>({"--bkboxw":"auto","--bkboxh":"auto","--bkboxc":t,"--bkboxb":`${e}px`}),lt=({width:e,height:t,base:n,lineColor:s,defaultStyles:o})=>{const r=O(e||"fit-content"),i=O(t||"fit-content"),a=["--bkboxw","--bkboxh"];return{...y({key:"--bkboxw",value:r,defaultStyles:o,skipDimensions:{fitContent:a}}),...y({key:"--bkboxh",value:i,defaultStyles:o,skipDimensions:{fitContent:a}}),...y({key:"--bkboxb",value:`${n}px`,defaultStyles:o}),...y({key:"--bkboxc",value:s,defaultStyles:o})}},ct=l.memo(l.forwardRef(function({children:t,snapping:n="clamp",debugging:s,className:o,colSpan:r,rowSpan:i,span:a,width:c,height:d,style:b,ssrMode:u=!1,...M},v){const m=H("box"),{isShown:w,debugging:p}=U(s,m.debugging),[h,G]=l.useState(!1);l.useEffect(()=>{G(!0)},[]);const S=l.useRef(null),{top:x,bottom:R,left:A,right:g}=Z(M),V=Q(S,{base:m.base,snapping:n,spacing:{top:x,bottom:R,left:A,right:g},warnOnMisalignment:p!=="none"}),D={padding:{top:x||0,right:g||0,bottom:R||0,left:A||0}},{padding:k}=K(h&&!u,D,V),N=l.useMemo(()=>Ne(a,r,i),[r,i,a]),_=l.useMemo(()=>at(m.base,m.colors.line),[m.base,m.colors.line]),E=l.useMemo(()=>{const L=lt({width:c,height:d,base:m.base,lineColor:m.colors.line,defaultStyles:_});return X(L,b)},[m.base,m.colors.line,c,d,_,b]);return f.jsx("div",{ref:ge(v,S),"data-testid":"box",className:z(ue.box,w&&ue.v,o),style:X(E,N),children:f.jsx(P,{base:1,spacer:{variant:"flat"},children:f.jsx(ee,{block:[k.top,k.bottom],inline:[k.left,k.right],width:"fit-content",height:d,debugging:p,ssrMode:u,children:t})})})})),ut="stk_l-58l",dt="v_-k3qw",de={stk:ut,v:dt},ft={x:"row",y:"column","-x":"row-reverse","-y":"column-reverse"},bt=e=>({"--bkkw":"auto","--bkkh":"auto","--bkkcl":e.line,"--bkkcf":e.flat,"--bkkci":e.text}),mt=(e,t,n)=>({rowGap:n!==void 0?n:e,columnGap:n!==void 0?n:t}),gt=l.memo(function({align:t="flex-start",children:n,className:s,columnGap:o,debugging:r,direction:i="row",gap:a,height:c,indicatorNode:d,justify:b="flex-start",rowGap:u,style:M,variant:v,width:m,ssrMode:w=!1,...p}){const h=H("stack"),{isShown:G,debugging:S}=U(r,h.debugging),[x,R]=l.useState(!1);l.useEffect(()=>{R(!0)},[]);const A=l.useRef(null),{top:g,right:V,bottom:D,left:k}=Z({...p}),N=Q(A,{base:h.base,snapping:"height",spacing:{top:g,right:V,bottom:D,left:k},warnOnMisalignment:S!=="none"}),_={padding:{top:g||0,right:V||0,bottom:D||0,left:k||0}},{padding:E}=K(x&&!w,_,N),L=l.useMemo(()=>{const I=u!==void 0?Number(u):void 0,B=o!==void 0?Number(o):void 0,Y=a!==void 0?Number(a):void 0;return mt(I,B,Y)},[u,o,a]),C=l.useMemo(()=>bt(h.colors),[h.colors]),$=l.useMemo(()=>{const I=O(m||"auto"),B=O(c||"auto"),Y=ft[i]||i,q=["--bkkw","--bkkh"],te={...y({key:"--bkkw",value:I,defaultStyles:C,skipDimensions:{auto:q}}),...y({key:"--bkkh",value:B,defaultStyles:C,skipDimensions:{auto:q}}),...y({key:"--bkkcl",value:h.colors.line,defaultStyles:C}),...y({key:"--bkkcf",value:h.colors.flat,defaultStyles:C}),...y({key:"--bkkci",value:h.colors.text,defaultStyles:C})};return X({flexDirection:Y,justifyContent:b,alignItems:t,width:m,height:c},L,te,M)},[i,b,t,m,c,h.colors.line,h.colors.flat,h.colors.text,C,L,M]),j=S==="none"?{...$,paddingBlock:`${E.top}px ${E.bottom}px`,paddingInline:`${E.left}px ${E.right}px`}:$;return f.jsx(P,{spacer:{variant:v??"line"},children:f.jsx(ee,{ref:A,block:[E.top,E.bottom],inline:[E.left,E.right],debugging:S,indicatorNode:d,width:m,height:c,ssrMode:w,children:f.jsx("div",{"data-testid":"stack",className:z(s,de.stk,G&&de.v),style:j,...p,children:n})})})}),ht="gde_-Naxo",pt="line_-VS-e",kt="cols_8lD6D",yt="col_rlbsL",vt="ssr_VGvpO",F={gde:ht,line:pt,cols:kt,col:yt,ssr:vt},xt=e=>{const{variant:t,base:n,gap:s,columns:o,columnWidth:r}=e;switch(t){case"line":return{variant:"line",gap:s,base:n};case"pattern":if(o&&Array.isArray(o))return{variant:"pattern",columns:o,gap:s,base:n};break;case"fixed":if(o!==void 0){const i=typeof o=="number"?o:parseInt(String(o),10);return{variant:"fixed",columns:isNaN(i)?12:i,columnWidth:r||"60px",gap:s,base:n}}break}return{variant:"auto",columnWidth:r||"1fr",gap:s,base:n}},wt=(e,t)=>({"--bkgw":"auto","--bkgh":"auto","--bkgmw":"none","--bkgcw":"60px","--bkggw":"24px","--bkgc":"12","--bkgb":`${e}px`,"--bkgcl":t,"--bkgg":"0"}),St=l.memo(function({className:t,debugging:n,style:s,variant:o,align:r="center",gap:i,height:a,width:c,columns:d,columnWidth:b,maxWidth:u,color:M,children:v,ssrMode:m=!1,...w}){const p=H("guide"),h=o??p.variant,G=typeof i=="number"?i:0,{isShown:S}=U(n,p.debugging);if(!S)return f.jsx("div",{className:z(F.g,F.h,t),style:s,"data-testid":"guide","data-variant":h,...w,children:v});const x=f.jsx("div",{className:z(F.g,F.h,F.ssr,t),style:{width:c||"100%",height:a||"100%",maxWidth:u||"none",...s},"data-testid":"guide","data-variant":h,children:v});return f.jsx(pe,{fallback:x,children:f.jsx(Ct,{className:t,debugging:n,style:s,variant:h,align:r,gap:G,height:a,width:c,columns:d,columnWidth:b,maxWidth:u,color:M,ssrMode:m,...w,children:v})})}),Ct=l.memo(function({className:t,debugging:n,style:s,variant:o,align:r="center",gap:i,height:a,width:c,columns:d,columnWidth:b,maxWidth:u,color:M,children:v,ssrMode:m=!1,...w}){const p=H("guide"),{isShown:h}=U(n,p.debugging),G=l.useRef(null),{width:S,height:x,refresh:R}=J(G);l.useEffect(()=>{const j=()=>{R()};return window.addEventListener("resize",j),()=>{window.removeEventListener("resize",j)}},[R]);const A=l.useMemo(()=>{const j=o,I=typeof i=="number"?i:0;return xt({variant:j,base:p.base,gap:I,columns:d,columnWidth:b})},[o,p.base,i,d,b]),{template:g,columnsCount:V,calculatedGap:D}=$t(G,A),k=l.useMemo(()=>wt(p.base,p.colors.line),[p.base,p.colors.line]),N=l.useMemo(()=>{const j=O(c||S||"auto"),I=O(a||x||"auto"),B=O(u||"none"),Y=O(b||"60px"),q=["--bkgw","--bkgh"],te={...y({key:"--bkgw",value:j,defaultStyles:k,skipDimensions:{auto:q}}),...y({key:"--bkgh",value:I,defaultStyles:k,skipDimensions:{auto:q}}),...y({key:"--bkgmw",value:B,defaultStyles:k}),...y({key:"--bkgcw",value:Y,defaultStyles:k}),...y({key:"--bkgc",value:`${V}`,defaultStyles:k}),...y({key:"--bkgb",value:"0",defaultStyles:k}),...y({key:"--bkgcl",value:M??p.colors.line,defaultStyles:k}),...y({key:"--bkgg",value:`${D}px`,defaultStyles:k}),...y({key:"--bkgj",value:r||"center",defaultStyles:k}),...g&&g!=="none"?{"--bkgt":g}:{},...g&&g!=="none"?{gridTemplateColumns:g}:{}};return X(te,s)},[c,a,u,b,V,M,g,D,S,x,p.colors.line,k,s,r]),_=()=>{const j=typeof i=="number"?i:0,I=j===0?0:j-1,B=I+1;return{finalGap:I,actualGapWithLine:B}},{finalGap:E,actualGapWithLine:L}=_(),C=typeof c=="number"?c:S||1024;let $;return E===0?$=Math.floor(C)+1:o==="line"?$=Math.max(1,Math.floor((C+1)/L)+1):$=Math.max(1,Math.floor(C/L)+1),f.jsxs("div",{ref:G,"data-testid":"guide",className:z(F.gde,t,h?F.v:F.h,o==="line"&&F.line),"data-variant":o,style:N,...w,children:[h&&f.jsx("div",{className:F.cols,"data-variant":o,children:Array.from({length:$},(j,I)=>{const B=p.colors[o]??p.colors.line;return f.jsx("div",{className:F.col,"data-column-index":I,"data-variant":o,style:{backgroundColor:B}},I)})}),v]})}),Mt=/^\d*\.?\d+(?:fr|px|%|em|rem|vh|vw|vmin|vmax|pt|pc|in|cm|mm)$/,Rt=e=>typeof e=="number"?Number.isFinite(e)&&e>=0:typeof e!="string"?!1:e==="auto"||e==="100%"||Mt.test(e),jt=e=>Array.isArray(e)&&e.length>0&&e.every(Rt);function $t(e,t){const{width:n}=J(e),s=l.useRef(!1);return l.useMemo(()=>{const o=t.variant??"line",r=t.base??8,i=oe(t.gap??0,{base:r});if(!n)return{template:"none",columnsCount:0,calculatedGap:0,isValid:!1};try{switch(o){case"line":{const a=i===0?0:i-1,c=a+1;let d;return a===0?d=Math.max(1,Math.floor(n)+1):d=Math.max(1,Math.floor((n+1)/c)+1),{template:`repeat(${d}, 1px)`,columnsCount:d,calculatedGap:i>0?i-1:i,isValid:!0}}case"pattern":{if(!t.columns||!Array.isArray(t.columns))throw new Error("Missing or invalid pattern columns");if(!jt(t.columns))throw new Error('Invalid "pattern" columns array');const a=t.columns.map(c=>typeof c=="number"?`${c}px`:c);return a.some(c=>c==="0"||c==="0px")?{template:"none",columnsCount:0,calculatedGap:0,isValid:!1}:{template:a.join(" "),columnsCount:a.length,calculatedGap:i,isValid:!0}}case"fixed":{const a=typeof t.columns=="number"?t.columns:0;if(a<1)throw new Error(`Invalid columns count: ${a}`);const c=t.columnWidth?O(t.columnWidth):"1fr";return{template:`repeat(${a}, ${c})`,columnsCount:a,calculatedGap:i,isValid:!0}}case"auto":{const a=t.columnWidth??"auto";if(a==="auto")return{template:"repeat(auto-fill, minmax(0, 1fr))",columnsCount:1,calculatedGap:i,isValid:!0};const c=typeof a=="number"?`${a}px`:a.toString(),d=be(c)??0,b=d>0?Math.max(1,Math.floor((n+i)/(d+i))):1;return{template:`repeat(auto-fill, ${c})`,columnsCount:b,calculatedGap:i,isValid:!0}}default:{s.current||(console.warn(`[useGuide] Unknown variant "${o}". Falling back to "line".`),s.current=!0);const a=Math.max(1,Math.floor(n/(i+1))+1);return{template:`repeat(${a}, 1px)`,columnsCount:a,calculatedGap:i,isValid:!0}}}}catch(a){return console.warn("Error in useGuide:",a),{template:"none",columnsCount:0,calculatedGap:0,isValid:!1}}},[t,n])}function H(e){const t=fe();return W.useMemo(()=>Object.assign({base:t.base},t[e]),[t,e])}function U(e,t){return W.useMemo(()=>{const n=e??t;return{isShown:n==="visible",isHidden:n==="hidden",isNone:n==="none",debugging:n}},[e,t])}const Et="bas_e-SXr",Vt="row_q-FZb",Ot="ssr_W1N5g",T={bas:Et,row:Vt,ssr:Ot},Gt=(e,t,n)=>({"--bkbw":"100%","--bkbh":"100%","--bkbb":`${e}px`,"--bkbcl":t,"--bkbcf":n}),_t=e=>{const{index:t,base:n,variant:s,chosenColor:o,lineColor:r,flatColor:i}=e;return{"--bkrt":t===0?"0px":`${t*n}px`,"--bkrh":s==="line"?"1px":`${n}px`,"--bkbc":o||(s==="line"?r:i)}},Dt=l.memo(function({className:t,debugging:n,style:s,variant:o,height:r,width:i,base:a,color:c,ssrMode:d=!1,...b}){const u=H("baseline"),{isShown:M}=U(n,u.debugging),v=l.useRef(null),{width:m,height:w,refresh:p}=J(v);l.useEffect(()=>{const C=()=>{p()};return window.addEventListener("resize",C),()=>{window.removeEventListener("resize",C)}},[p]);const[h,G]=l.useMemo(()=>me([i,r],[m,w]),[i,r,m,w]),{top:S,right:x,bottom:R,left:A}=l.useMemo(()=>Z(b),[b]),g=l.useMemo(()=>{const C=[S,x,R,A].map($=>$?`${$}px`:"0").join(" ");return C!=="0 0 0 0"?C:void 0},[S,x,R,A]),V=l.useMemo(()=>{const C=a||u.base;return _e({height:G,top:S,bottom:R,base:C})},[G,S,R,a,u.base]),{start:D,end:k}=Fe({totalLines:V,lineHeight:a||u.base,containerRef:v,buffer:160}),N=c||(o==="line"?u.colors.line:u.colors.flat),_=l.useMemo(()=>Gt(a||u.base,u.colors.line,u.colors.flat),[a,u.colors.line,u.colors.flat,u.base]),E=l.useMemo(()=>{const C=O(i||"100%"),$=O(r||"100%"),j=["--bkbw","--bkbh"];return X({...y({key:"--bkbw",value:C,defaultStyles:_,skipDimensions:{fullSize:j}}),...y({key:"--bkbh",value:$,defaultStyles:_,skipDimensions:{fullSize:j}}),...y({key:"--bkbb",value:`${a}px`,defaultStyles:_}),...y({key:"--bkbcl",value:c||u.colors.line,defaultStyles:_}),...y({key:"--bkbcf",value:c||u.colors.flat,defaultStyles:_}),...g&&{padding:g}},s)},[i,r,a,c,u.colors.line,u.colors.flat,g,_,s]),L=l.useCallback(C=>{const $=o,j=a||u.base;return _t({index:C,base:j,variant:$,chosenColor:N,lineColor:u.colors.line,flatColor:u.colors.flat})},[a,o,N,u.colors.line,u.colors.flat,u.base]);return f.jsx("div",{ref:v,"data-testid":"baseline",className:z(T.bas,M?T.v:T.h,t),style:E,...b,children:M&&Array.from({length:k-D},(C,$)=>{const j=$+D;return f.jsx("div",{className:T.row,"data-row-index":j,style:L(j)},j)})})}),At=l.memo(function({className:t,debugging:n,style:s,variant:o,height:r,width:i,base:a,color:c,ssrMode:d=!1,...b}){const u=H("baseline"),M=o??u.variant,v=a??u.base,{isShown:m}=U(n,u.debugging);if(!m)return f.jsx("div",{className:z(T.b,T.h,t),style:s,"data-testid":"baseline",...b});const w=f.jsx("div",{className:z(T.b,T.h,T.ssr,t),style:{width:i||"100%",height:r||"100%",...s},"data-testid":"baseline"});return f.jsx(pe,{fallback:w,children:f.jsx(Dt,{className:t,debugging:n,style:s,variant:M,height:r,width:i,base:v,color:c,ssrMode:d,...b})})});exports.Baseline=At;exports.Box=ct;exports.Config=P;exports.Guide=St;exports.Layout=st;exports.Padder=ee;exports.Spacer=ke;exports.Stack=gt;exports.isSSR=re;exports.safeClientValue=ze;
|
|
32
2
|
//# sourceMappingURL=index.cjs.map
|