UNPKG

@dash-ui/layout

Version:

A framework-agnostic layout library written in Dash

3 lines (2 loc) 10.4 kB
function t(){return t=Object.assign?Object.assign.bind():function(t){for(var e=1;arguments.length>e;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},t.apply(this,arguments)}function e(t){return{width:t}}function n(t){return{height:t}}function i(t){return{maxWidth:t}}function r(t){return{maxHeight:t}}function a(t){return{minWidth:t}}function s(t){return{minHeight:t}}function l(t){return{width:t,height:t}}function o(t){return e=>{var{pad:n}=e;return{padding:Array.isArray(t)?t.map((t=>n[t])).join(" "):n[t]}}}function u(t){var[e,n]=t;return t=>{var{borderWidth:i,color:r}=t;return{borderWidth:Array.isArray(e)?e.map((t=>i[t])).join(" "):i[e],borderStyle:"solid",borderColor:r[n]}}}function p(t){return e=>{var{radius:n}=e;return{borderRadius:Array.isArray(t)?t.map((t=>n[t])).join(" "):n[t]}}}function f(t){var e,n,i,r;return Array.isArray(t)?{"@supports (inset: 10px)":{inset:t.map(G).join(" ")},"@supports not (inset: 10px)":{top:t[0],right:null!==(e=t[1])&&void 0!==e?e:t[0],bottom:null!==(n=t[2])&&void 0!==n?n:t[0],left:null!==(i=null!==(r=t[3])&&void 0!==r?r:t[1])&&void 0!==i?i:t[0]}}:{"@supports (inset: 10px)":{inset:t},"@supports not (inset: 10px)":{top:t,right:t,bottom:t,left:t}}}function d(t){return{flexBasis:t}}function y(t){return{flexGrow:Number(t)}}function m(t){return{order:t}}function g(t){return{flexShrink:Number(t)}}function c(t){return e=>{var{gap:n}=e;return{gridGap:Array.isArray(t)?t.map((t=>n[t])).join(" "):n[t]+" "+n[t],gap:Array.isArray(t)?t.map((t=>n[t])).join(" "):n[t]+" "+n[t]}}}function b(t){return G(t)}function h(t){return{gridTemplateRows:(Array.isArray(t)?t:["repeat("+t+",minmax(0,1fr))"]).map(b).join(" ")}}function j(t){return G(t)}function v(t){return{gridTemplateColumns:(Array.isArray(t)?t:["repeat("+t+",minmax(0,1fr))"]).map(j).join(" ")}}function x(t){return{gridColumnStart:t}}function S(t){return{gridColumnEnd:t}}function C(t){return{gridRowStart:t}}function I(t){return{gridRowEnd:t}}function z(t){return{gridTemplateColumns:"repeat(auto-fit, minmax("+G(t)+", 1fr))"}}function w(t){return{margin:t}}function k(t){return e=>{var{pad:n}=e;return{margin:Array.isArray(t)?t.map((t=>String(t).startsWith("-")?""+n[t]:"calc(-1 * "+n[t]+")")).join(" ")+"!important":String(t).startsWith("-")?n[t]+"!important":"calc(-1 * "+n[t]+")!important"}}}function A(b,j){var A=R(b),G=H(b,j||{}),T=A({display:G.variants({flex:{display:"flex"},inlineFlex:{display:"inline-flex"},grid:{display:"grid"},inlineGrid:{display:"inlineGrid"},block:{display:"block"},inlineBlock:{display:"inline-block"},inline:{display:"inline"},table:{display:"table"},tableCell:{display:"table-cell"},tableRowGroup:{display:"table-row-group"},tableRow:{display:"table-row"},tableColumn:{display:"table-column"},tableColumnGroup:{display:"table-column-group"},tableHeader:{display:"table-header"},tableHeaderGroup:{display:"table-header-group"},tableFooterGroup:{display:"table-footer-group"},listItem:{display:"list-item"},contents:{display:"contents"},runIn:{display:"run-in"},none:{display:"none"},inherit:{display:"inherit"},initial:{display:"initial"},unset:{display:"unset"},revert:{display:"revert"}}),position:G.variants({absolute:{position:"absolute"},relative:{position:"relative"},fixed:{position:"fixed"},sticky:{position:"sticky"},static:{position:"static"},inherit:{position:"inherit"},initial:{position:"initial"},unset:{position:"unset"},revert:{position:"revert"}}),width:G.lazy(e),height:G.lazy(n),maxWidth:G.lazy(i),maxHeight:G.lazy(r),minWidth:G.lazy(a),minHeight:G.lazy(s),size:G.lazy(l),pad:G.lazy(o),bg:G.variants(W(b.tokens.color,((t,e)=>(t[e]={backgroundColor:b.tokens.color[e]},t)),{})),border:G.lazy(u),shadow:G.variants(W(b.tokens.shadow,((t,e)=>(t[e]={boxShadow:b.tokens.shadow[e]},t)),{})),radius:G.lazy(p),inset:G.lazy(f),z:G.variants(W(b.tokens.zIndex,((t,e)=>(t[e]={zIndex:b.tokens.zIndex[e]},t)),{}))},{atomic:1}),X=G.variants({start:{"@supports (align-items: start)":{alignItems:"start"},"@supports not (align-items: start)":{alignItems:"flex-start"}},end:{"@supports (align-items: end)":{alignItems:"end"},"@supports not (align-items: end)":{alignItems:"flex-end"}},center:{alignItems:"center"},baseline:{alignItems:"baseline"},stretch:{alignItems:"stretch"},normal:{alignItems:"normal"},inherit:{alignItems:"inherit"},initial:{alignItems:"initial"},unset:{alignItems:"unset"},revert:{alignItems:"revert"}}),Y=G.variants({start:{"@supports (justify-items: start)":{justifyItems:"start"},"@supports not (justify-items: start)":{justifyItems:"flex-start"}},end:{"@supports (justify-items: end)":{justifyItems:"end"},"@supports not (justify-items: end)":{justifyItems:"flex-end"}},center:{justifyItems:"center"},baseline:{justifyItems:"baseline"},stretch:{justifyItems:"stretch"},normal:{justifyItems:"normal"},inherit:{justifyItems:"inherit"},initial:{justifyItems:"initial"},unset:{justifyItems:"unset"},revert:{justifyItems:"revert"}}),L=G.variants({start:{"@supports (justify-content: start)":{justifyContent:"start"},"@supports not (justify-content: start)":{justifyContent:"flex-start"}},end:{"@supports (justify-content: end)":{justifyContent:"end"},"@supports not (justify-content: end)":{justifyContent:"flex-end"}},center:{justifyContent:"center"},around:{justifyContent:"space-around"},between:{justifyContent:"space-between"},evenly:{justifyContent:"space-evenly"},baseline:{justifyContent:"baseline"},stretch:{justifyContent:"stretch"},normal:{justifyContent:"normal"},inherit:{justifyContent:"inherit"},initial:{justifyContent:"initial"},unset:{justifyContent:"unset"},revert:{justifyContent:"revert"}}),O=G.variants({start:{"@supports (align-content: start)":{alignContent:"start"},"@supports not (align-content: start)":{alignContent:"flex-start"}},end:{"@supports (align-content: end)":{alignContent:"end"},"@supports not (align-content: end)":{alignContent:"flex-end"}},center:{alignContent:"center"},around:{alignContent:"space-around"},between:{alignContent:"space-between"},evenly:{alignContent:"space-evenly"},baseline:{alignContent:"baseline"},stretch:{alignContent:"stretch"},normal:{alignContent:"normal"},inherit:{alignContent:"inherit"},initial:{alignContent:"initial"},unset:{alignContent:"unset"},revert:{alignContent:"revert"}}),D=G.variants({start:{"@supports (align-self: start)":{alignSelf:"start"},"@supports not (align-self: start)":{alignSelf:"flex-start"}},end:{"@supports (align-self: end)":{alignSelf:"end"},"@supports not (align-self: end)":{alignSelf:"flex-end"}},center:{alignSelf:"center"},baseline:{alignSelf:"baseline"},stretch:{alignSelf:"stretch"},auto:{alignSelf:"auto"},normal:{alignSelf:"normal"},inherit:{alignSelf:"inherit"},initial:{alignSelf:"initial"},unset:{alignSelf:"unset"},revert:{alignSelf:"revert"}}),E=G.variants({start:{"@supports (justify-self: start)":{justifySelf:"start"},"@supports not (justify-self: start)":{justifySelf:"flex-start"}},end:{"@supports (justify-self: end)":{justifySelf:"end"},"@supports not (justify-self: end)":{justifySelf:"flex-end"}},center:{justifySelf:"center"},around:{justifySelf:"space-around"},between:{justifySelf:"space-between"},evenly:{justifySelf:"space-evenly"},baseline:{justifySelf:"baseline"},stretch:{justifySelf:"stretch"},auto:{justifySelf:"auto"},normal:{justifySelf:"normal"},inherit:{justifySelf:"inherit"},initial:{justifySelf:"initial"},unset:{justifySelf:"unset"},revert:{justifySelf:"revert"}}),N=A(t({align:D,basis:G.lazy(d),distribute:E,grow:G.lazy(y),order:G.lazy(m),shrink:G.lazy(g)},T.styles),{atomic:1}),B=A(t({default:G.one({display:"flex",flexWrap:"wrap",justifyContent:"flex-start","& > *":{flexShrink:0}}),gap:G.variants(W(b.tokens.gap,((t,e)=>{var n=b.tokens.gap;return t[e]={"@supports (display: flex) and (gap: 1em)":{gap:n[e]},"@supports not (display: flex) and (gap: 1em)":{marginTop:"calc(-1 * "+n[e]+")!important",marginLeft:"calc(-1 * "+n[e]+")!important","& > *":{marginTop:n[e]+"!important",marginLeft:n[e]+"!important"}}},t}),{})),distribute:L,align:X},T.styles),{atomic:1}),F=A({default:G.one({display:"grid"}),inline:G.one({display:"inline-grid"}),alignX:Y,alignY:X,distributeX:L,distributeY:O,gap:G.lazy(c),rows:G.lazy(h)},{atomic:1}),P=A(t({cols:G.lazy(v)},F.styles,T.styles),{atomic:1});return{alignItems:X,justifyItems:Y,justifyContent:L,alignContent:O,alignSelf:D,justifySelf:E,box:T,inline:B,flexItem:N,grid:P,gridItem:A(t({distribute:E,align:D,colStart:G.lazy(x),colEnd:G.lazy(S),rowStart:G.lazy(C),rowEnd:G.lazy(I)},T.styles),{atomic:1}),autoGrid:A(t({itemWidth:G.lazy(z)},F.styles),{atomic:1}),hstack:A(t({default:G.one({display:"flex",flexDirection:"row","& > *":{flexShrink:0}}),reversed:G.one({flexDirection:"row-reverse"}),gap:G.variants(W(b.tokens.gap,((t,e)=>{var n=b.tokens.gap,i={"& > * + *":{marginLeft:n[e]+"!important"}};return t[e]=(""+e).startsWith("-")?i:{"@supports (display: flex) and (gap: 1em)":{gap:n[e]},"@supports not (display: flex) and (gap: 1em)":i},t}),{})),distribute:L,align:X},T.styles),{atomic:1}),vstack:A(t({default:G.one({display:"flex",flexDirection:"column","& > *":{flexShrink:0}}),reversed:G.one({flexDirection:"column-reverse"}),gap:G.variants(W(b.tokens.gap,((t,e)=>{var n=b.tokens.gap,i={"& > * + *":{marginTop:n[e]+"!important"}};return t[e]=(e+"").startsWith("-")?i:{"@supports (display: flex) and (gap: 1em)":{gap:n[e]},"@supports not (display: flex) and (gap: 1em)":i},t}),{})),distribute:L,align:X},T.styles),{atomic:1}),zstack:A(t({default:G.one({display:"grid","> *":{gridArea:"1/1/1/1"}}),inline:P.styles.inline,alignX:Y,alignY:X,distributeX:L,distributeY:O,center:G.one({alignItems:"center",justifyItems:"center"})},T.styles),{atomic:1}),overlay:A(t({default:G.one({position:"absolute"}),offset:G.lazy(w),placement:G.variants({top:{top:0,left:"50%",transform:"translateX(-50%)"},right:{right:0,top:"50%",transform:"translateY(-50%)"},bottom:{bottom:0,left:"50%",transform:"translateX(-50%)"},left:{left:0,top:"50%",transform:"translateY(-50%)"},center:{top:"50%",left:"50%",transform:"translate(-50%, -50%)"},topRight:{top:0,right:0},topLeft:{top:0,left:0},bottomRight:{bottom:0,right:0},bottomLeft:{bottom:0,left:0}})},T.styles),{atomic:1}),bleed:A(t({amount:G.lazy(k)},T.styles),{atomic:1})}}function W(t,e,n){return T(t).reduce(e,n)}function G(t){return isNaN(t)||0===t?t:t+"px"}import R from"@dash-ui/compound";import H from"@dash-ui/responsive";var T=Object.keys;export{A as default}; //# sourceMappingURL=index.mjs.map