@cbpds/web-components/dist/cbp-web-components/p-da0f0e41.entry.js

Web components for the CBP Design System.

/*!
 * CPB Design System web components - built with Stencil
 */
import{r as e,h as t,a as i,g as r}from"./p-436f46fe.js";import{s as a}from"./p-93ade441.js";const p=":root{--cbp-form-field-wrapper-padding-start:var(--cbp-form-field-padding-inline);--cbp-form-field-wrapper-padding-end:var(--cbp-form-field-padding-inline);--cbp-form-field-overlay-start-width:0;--cbp-form-field-overlay-end-width:0;--cbp-form-field-attached-button-width:0}cbp-form-field-wrapper{position:relative;display:flex;gap:var(--cbp-space-4x)}cbp-form-field-wrapper .cbp-form-field-wrapper-shrinkwrap{position:relative;display:block;flex-basis:100%}cbp-form-field-wrapper .cbp-form-field-wrapper-shrinkwrap input:not(#fakeId){padding-inline-start:calc(var(--cbp-form-field-overlay-start-width) + var(--cbp-form-field-wrapper-padding-start));padding-inline-end:calc(var(--cbp-form-field-overlay-end-width) + var(--cbp-form-field-wrapper-padding-end))}cbp-form-field-wrapper .cbp-form-field-wrapper-shrinkwrap [slot]{position:absolute;inset-block-start:0;display:inline-flex;align-items:center;height:100%;color:var(--cbp-form-field-color)}cbp-form-field-wrapper .cbp-form-field-wrapper-shrinkwrap [slot=cbp-form-field-overlay-start]{inset-inline-start:var(--cbp-space-2x);font-weight:var(--cbp-font-weight-bold);font-style:italic}cbp-form-field-wrapper .cbp-form-field-wrapper-shrinkwrap [slot=cbp-form-field-overlay-end]{inset-inline-end:calc(var(--cbp-form-field-attached-button-width) + var(--cbp-space-2x));font-style:italic}cbp-form-field-wrapper .cbp-form-field-wrapper-shrinkwrap [slot=cbp-form-field-attached-button]{--cbp-button-border-radius:0 var(--cbp-border-radius-soft) var(--cbp-border-radius-soft) 0;inset-inline-end:0}cbp-form-field-wrapper .cbp-form-field-wrapper-shrinkwrap [slot=cbp-form-field-attached-button] cbp-segmented-button-group cbp-button:first-child{--cbp-button-border-radius:0}cbp-form-field-wrapper [slot=cbp-form-field-unattached-buttons]{display:flex;gap:var(--cbp-space-4x)}";const d=p;const s=class{constructor(t){e(this,t);this.visible=false}getSizeInfo(){this.visible=!!this.host.offsetWidth;if(this.visible){if(this.observer)this.observer.disconnect();this.overlayStartWidth=this.overlayStart?this.overlayStart.offsetWidth+8:0;this.overlayEndWidth=this.overlayEnd?this.overlayEnd.offsetWidth+8:0;this.attachedButtonWidth=this.attachedButton?this.attachedButton.offsetWidth:0;this.overlayEndWidth=this.overlayEndWidth+this.attachedButtonWidth;a(this.host,{"--cbp-form-field-overlay-start-width":`${this.overlayStartWidth}px`,"--cbp-form-field-overlay-end-width":`${this.overlayEndWidth}px`,"--cbp-form-field-attached-button-width":`${this.attachedButtonWidth}px`})}else if(!this.observer){this.observer=new ResizeObserver((()=>{this.getSizeInfo()}));this.observer.observe(this.host)}}componentWillLoad(){this.parent=this.host.closest("cbp-form-field");this.formField=this.host.querySelector("input,select,textarea");this.attachedButton=this.host.querySelector("[slot=cbp-form-field-attached-button] cbp-button");this.overlayStart=this.host.querySelector("[slot=cbp-form-field-overlay-start]");this.overlayEnd=this.host.querySelector("[slot=cbp-form-field-overlay-end]")}componentDidLoad(){this.getSizeInfo();let e="";const t=["overlayStart","overlayEnd"];t.forEach((t=>{if(this[t]){let i=`${t}ID`;if(this[t].getAttribute("id")){i=this[t].getAttribute("id")}else{i=`${this.parent.fieldId}-${t}`;this[t].setAttribute("id",`${i}`)}e?e+=` ${i}`:e=i}}));if(e){let t=this.formField.getAttribute("aria-describedby");t?this.formField.setAttribute("aria-describedby",`${t} ${e}`):this.formField.setAttribute("aria-describedby",`${e}`)}}render(){return t(i,{key:"785ae85e842f97af3ed0c0bfde8483fbd36a78f3"},t("div",{key:"c2e04db3dfa8d28c639c03916170ba04c82df0cb",class:"cbp-form-field-wrapper-shrinkwrap"},t("slot",{key:"258ab2cae61ac8d99113d5a58c12009b14e2d9d3",name:"cbp-form-field-overlay-start"}),t("slot",{key:"8ecf048c75b53d40412bb6ceaf2519b16c778902"}),t("slot",{key:"8ce0a866f81e2146b582822977db857de91982f5",name:"cbp-form-field-overlay-end"}),t("slot",{key:"83c5f82b8867ab76314569d86373c2e278b4a7a5",name:"cbp-form-field-attached-button"})),t("slot",{key:"eaee9113688709084969c6317c101d1819e7e55e",name:"cbp-form-field-unattached-buttons"}))}get host(){return r(this)}};s.style=d;export{s as cbp_form_field_wrapper};
//# sourceMappingURL=p-da0f0e41.entry.js.map