UNPKG

@cbpds/web-components

Version:
5 lines 1.8 kB
/*! * CPB Design System web components - built with Stencil */ import{r as i,h as t,a as s,g as e}from"./p-8d4a80f0.js";import{s as d}from"./p-93ade441.js";const n="cbp-grid:not([hidden]){display:grid;max-width:100%}";const h=n;const o=class{constructor(t){i(this,t);this.display="grid";this.gridTemplateAreas=undefined;this.gridTemplateColumns=undefined;this.gridTemplateRows=undefined;this.gridAutoFlow=undefined;this.gridAutoColumns=undefined;this.gridAutoRows=undefined;this.alignItems=undefined;this.justifyItems=undefined;this.alignContent=undefined;this.justifyContent=undefined;this.gap=undefined;this.breakpoint=undefined;this.sx={}}handleBreakpointChange(i){i.matches?this.host.style.setProperty("display","block"):this.host.style.setProperty("display",this.display)}componentWillLoad(){if(typeof this.sx=="string"){this.sx=JSON.parse(this.sx)||{}}d(this.host,Object.assign({display:this.display,"grid-template-areas":this.gridTemplateAreas,"grid-template-columns":this.gridTemplateColumns,"grid-template-rows":this.gridTemplateRows,"grid-auto-flow":this.gridAutoFlow,"grid-auto-columns":this.gridAutoColumns,"grid-auto-rows":this.gridAutoRows,"align-content":this.alignContent,"justify-content":this.justifyContent,"align-items":this.alignItems,"justify-items":this.justifyItems,"grid-gap":this.gap},this.sx))}componentDidLoad(){if(this.breakpoint){const i=window===null||window===void 0?void 0:window.matchMedia(`(max-width: ${this.breakpoint})`);if(i){i.addEventListener("change",(i=>this.handleBreakpointChange(i)));this.handleBreakpointChange(i)}}}render(){return t(s,{key:"124f9682096bcac1a5a772f450f6e8e59767bb8e"},t("slot",{key:"4f06047960bcb9abd97ce1f4e973018893c5d320"}))}get host(){return e(this)}};o.style=h;export{o as cbp_grid}; //# sourceMappingURL=p-2e56d9a7.entry.js.map