https://touying-typ.github.io/assets/js/038fe684.832272e7.js

1"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[2648],{59887:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>c,contentTitle:()=>l,default:()=>h,frontMatter:()=>r,metadata:()=>s,toc:()=>a});var i=n(85893),o=n(11151);const r={sidebar_position:3,description:"Make multiple blocks match the size of the tallest (or widest) sibling without expanding to fill the entire page.",toc_max_heading_level:2},l="lazy-layout",s={id:"reference/components/lazy-layout",title:"lazy-layout",description:"Make multiple blocks match the size of the tallest (or widest) sibling without expanding to fill the entire page.",source:"@site/docs/reference/components/lazy-layout.mdx",sourceDirName:"reference/components",slug:"/reference/components/lazy-layout",permalink:"/docs/reference/components/lazy-layout",draft:!1,unlisted:!1,tags:[],version:"current",sidebarPosition:3,frontMatter:{sidebar_position:3,description:"Make multiple blocks match the size of the tallest (or widest) sibling without expanding to fill the entire page.",toc_max_heading_level:2},sidebar:"tutorialSidebar",previous:{title:"lazy-h",permalink:"/docs/reference/components/lazy-h"},next:{title:"cols",permalink:"/docs/reference/components/cols"}},c={},a=[{value:"direction : <TypeLink></TypeLink> <Default><code>ttb</code></Default>",id:"direction",level:3},{value:"grid-size : <TypeLink></TypeLink> <Default><code>50pt</code></Default>",id:"grid-size",level:3},{value:"body : <TypeLink></TypeLink>",id:"body",level:3}];function d(e){const t={a:"a",code:"code",em:"em",h1:"h1",h3:"h3",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,o.a)(),...e.components},{Default:n,Param:r,Parameters:l,Signature:s,SignatureName:c,SignatureParam:a,SourceLink:d,TypeLink:h}=t;return n||u("Default",!0),r||u("Param",!0),l||u("Parameters",!0),s||u("Signature",!0),c||u("SignatureName",!0),a||u("SignatureParam",!0),d||u("SourceLink",!0),h||u("TypeLink",!0),(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(t.h1,{id:"lazy-layout",children:"lazy-layout"}),"\n",(0,i.jsx)(s,{children:(0,i.jsxs)("code",{children:[(0,i.jsx)(c,{children:"lazy-layout"}),"(",(0,i.jsxs)(a,{children:[(0,i.jsx)(t.a,{href:"#direction",children:"direction: ttb"}),", "]}),(0,i.jsxs)(a,{children:[(0,i.jsx)(t.a,{href:"#grid-size",children:"grid-size: 50pt"}),", "]}),(0,i.jsx)(a,{children:(0,i.jsx)(t.a,{href:"#body",children:"body"})}),")",(0,i.jsx)(d,{href:"https://github.com/touying-typ/touying/blob/main/src/components.typ#L129"})]})}),"\n",(0,i.jsx)(t.p,{children:"Make multiple blocks match the size of the tallest (or widest) sibling without\nexpanding to fill the entire page."}),"\n",(0,i.jsxs)(t.ul,{children:["\n",(0,i.jsxs)(t.li,{children:[(0,i.jsx)(t.code,{children:"direction: ttb"})," (default): equalizes block ",(0,i.jsx)(t.em,{children:"heights"})," via ",(0,i.jsx)(t.code,{children:"lazy-v"}),"."]}),"\n",(0,i.jsxs)(t.li,{children:[(0,i.jsx)(t.code,{children:"direction: ltr"}),": equalizes block ",(0,i.jsx)(t.em,{children:"widths"})," via ",(0,i.jsx)(t.code,{children:"lazy-h"}),"."]}),"\n"]}),"\n",(0,i.jsx)(t.p,{children:"If a column (or row) contains multiple lazy markers (stacked blocks), only the last\none is activated."}),"\n",(0,i.jsxs)(t.p,{children:["Use ",(0,i.jsx)(t.code,{children:"cols(lazy-layout: true)"})," as a convenient shorthand for the vertical case."]}),"\n",(0,i.jsx)(t.pre,{children:(0,i.jsx)(t.code,{className:"language-typ",children:"#lazy-layout(grid(\n  columns: (1fr, 1fr),\n  block(width: 100%)[\n    #lorem(10)\n    #lazy-v(1fr)\n    Bottom left.\n  ],\n  block(width: 100%)[\n    #lorem(20)\n    #lazy-v(1fr)\n    Bottom right.\n  ],\n))\n"})}),"\n",(0,i.jsxs)(l,{children:[(0,i.jsxs)(t.h3,{id:"direction",children:["direction : ",(0,i.jsx)(h,{type:"direction"})," ",(0,i.jsx)(n,{children:(0,i.jsx)(t.code,{children:"ttb"})})]}),(0,i.jsx)(r,{children:(0,i.jsxs)(t.p,{children:["The equalization axis (",(0,i.jsx)(t.code,{children:"ttb"}),"/",(0,i.jsx)(t.code,{children:"btt"})," for heights, ",(0,i.jsx)(t.code,{children:"ltr"}),"/",(0,i.jsx)(t.code,{children:"rtl"})," for widths). Default is ",(0,i.jsx)(t.code,{children:"ttb"}),"."]})}),(0,i.jsxs)(t.h3,{id:"grid-size",children:["grid-size : ",(0,i.jsx)(h,{type:"length"})," ",(0,i.jsx)(n,{children:(0,i.jsx)(t.code,{children:"50pt"})})]}),(0,i.jsx)(r,{children:(0,i.jsxs)(t.p,{children:["The quantization unit for grouping markers into the same column (vertical mode) or row (horizontal mode). Positions are floored to the nearest multiple of ",(0,i.jsx)(t.code,{children:"grid-size"})," before comparison, adding tolerance for sub-pixel differences. Default is ",(0,i.jsx)(t.code,{children:"50pt"}),"."]})}),(0,i.jsxs)(t.h3,{id:"body",children:["body : ",(0,i.jsx)(h,{type:"content"})]}),(0,i.jsx)(r,{children:(0,i.jsxs)(t.p,{children:["The content containing ",(0,i.jsx)(t.code,{children:"lazy-v"})," or ",(0,i.jsx)(t.code,{children:"lazy-h"})," markers."]})})]}),"\n",(0,i.jsxs)(t.p,{children:[(0,i.jsx)(t.strong,{children:"Returns:"})," ",(0,i.jsx)(h,{type:"content"})]})]})}function h(e={}){const{wrapper:t}={...(0,o.a)(),...e.components};return t?(0,i.jsx)(t,{...e,children:(0,i.jsx)(d,{...e})}):d(e)}function u(e,t){throw new Error("Expected "+(t?"component":"object")+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}},11151:(e,t,n)=>{n.d(t,{Z:()=>s,a:()=>l});var i=n(67294);const o={},r=i.createContext(o);function l(e){const t=i.useContext(r);return i.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}function s(e){let t;return t=e.disableParentContext?"function"==typeof e.components?e.components(o):e.components||o:l(e.components),i.createElement(r.Provider,{value:t},e.children)}}}]);