@cbpds/web-components/dist/components/p-3facb62e.js

Web components for the CBP Design System.

/*!
 * CPB Design System web components - built with Stencil
 */
import{p as e,H as i,h as t,c as n}from"./p-9caf8482.js";import{s}from"./p-9c1b2f31.js";const d=":root{--cbp-flex-linearized-margin:0}cbp-flex:not([hidden]){display:flex}cbp-flex:not([hidden])[display=inline-flex]{display:inline-flex}cbp-flex:not([hidden]).cbp-flex-linearized{display:block !important}cbp-flex:not([hidden]).cbp-flex-linearized>*{margin-block-end:var(--cbp-flex-linearized-margin)}";const l=d;const o=e(class e 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(e){e.matches?this.host.classList.add("cbp-flex-linearized"):this.host.classList.remove("cbp-flex-linearized")}componentWillLoad(){var e;if(typeof this.sx=="string"){this.sx=JSON.parse(this.sx)||{}}s(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,"--cbp-flex-linearized-margin":this.gap!=undefined?(e=this.gap.split(" "))===null||e===void 0?void 0:e[0]:undefined},this.sx))}componentDidLoad(){if(this.breakpoint){const e=window===null||window===void 0?void 0:window.matchMedia(`(max-width: ${this.breakpoint})`);if(e){e.addEventListener("change",(e=>this.handleBreakpointChange(e)));this.handleBreakpointChange(e)}}}render(){return t(n,{key:"fdb7a14b3d02594f182eefbeb92d3c50ba8f006f"},t("slot",{key:"af9652912b7528de4aa3ccbcb227d1b7b94e7d1e"}))}get host(){return this}static get style(){return l}},[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 a(){if(typeof customElements==="undefined"){return}const e=["cbp-flex"];e.forEach((e=>{switch(e){case"cbp-flex":if(!customElements.get(e)){customElements.define(e,o)}break}}))}export{o as C,a as d};
//# sourceMappingURL=p-3facb62e.js.map