UNPKG

@cbpds/web-components

Version:
5 lines 1.93 kB
/*! * CPB Design System web components - built with Stencil */ import{p as t,H as i,h as s,c as e}from"./p-c5a784ab.js";import{s as n}from"./p-9c1b2f31.js";const o="cbp-flex:not([hidden]){display:flex}cbp-flex:not([hidden])[display=inline-flex]{display:inline-flex}";const a=o;const c=t(class t extends i{constructor(){super();this.__registerHost();this.display="flex";this.wrap=undefined;this.direction="row";this.alignItems="stretch";this.alignContent="stretch";this.justifyContent="flex-start";this.gap=undefined;this.breakpoint=undefined;this.contentBreakpoint=undefined;this.sx={}}handleBreakpointChange(t){t.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)||{}}n(this.host,Object.assign({display:this.display,"flex-wrap":this.wrap,"flex-direction":this.direction,"align-items":this.alignItems,"align-content":this.alignContent,"justify-content":this.justifyContent,gap:this.gap},this.sx))}componentDidLoad(){if(this.breakpoint){const t=window===null||window===void 0?void 0:window.matchMedia(`(max-width: ${this.breakpoint})`);if(t){t.addEventListener("change",(t=>this.handleBreakpointChange(t)));this.handleBreakpointChange(t)}}}render(){return s(e,{key:"c0ec96cb045ca893162f6a96621365f13f81505c"},s("slot",{key:"f29b9312200bf368a580e4552472d85b2a6bf100"}))}get host(){return this}static get style(){return a}},[4,"cbp-flex",{display:[513],wrap:[1],direction:[1],alignItems:[1,"align-items"],alignContent:[1,"align-content"],justifyContent:[1,"justify-content"],gap:[1],breakpoint:[1],contentBreakpoint:[1,"content-breakpoint"],sx:[8]}]);function h(){if(typeof customElements==="undefined"){return}const t=["cbp-flex"];t.forEach((t=>{switch(t){case"cbp-flex":if(!customElements.get(t)){customElements.define(t,c)}break}}))}export{c as C,h as d}; //# sourceMappingURL=p-0034159b.js.map