@cbpds/web-components/dist/components/cbp-structured-list.js

Web components for the CBP Design System.

/*!
 * CPB Design System web components - built with Stencil
 */
import{p as r,H as t,h as c,c as o}from"./p-c5a784ab.js";import{s as e}from"./p-9c1b2f31.js";const s=":root{--cbp-structured-list-item-padding:var(--cbp-space-4x);--cbp-structured-list-color-background:var(--cbp-color-white);--cbp-structured-list-color-background-dark:var(--cbp-color-gray-cool-80);--cbp-structured-list-color-striped-background:var(--cbp-color-gray-cool-4);--cbp-structured-list-color-striped-background-dark:var(--cbp-color-gray-cool-90);--cbp-structured-list-color-background-hover:var(--cbp-color-gray-cool-10);--cbp-structured-list-color-background-hover-dark:var(--cbp-color-black);--cbp-structured-list-color:var(--cbp-color-text-darkest);--cbp-structured-list-color-dark:var(--cbp-color-text-lightest);--cbp-structured-list-border-color:var(--cbp-color-gray-cool-30);--cbp-structured-list-border-color-dark:var(--cbp-color-gray-cool-50);--cbp-structured-list-header-color-background:var(--cbp-color-gray-cool-30);--cbp-structured-list-header-color-background-dark:var(--cbp-color-gray-cool-60);--cbp-structured-list-header-color:var(--cbp-color-text-darkest);--cbp-structured-list-header-color-dark:var(--cbp-color-text-lightest);--cbp-structured-list-footer-color-background:var(--cbp-color-gray-cool-70);--cbp-structured-list-footer-color-background-dark:var(--cbp-color-gray-cool-5);--cbp-structured-list-footer-color:var(--cbp-color-text-lightest);--cbp-structured-list-footer-color-dark:var(--cbp-color-text-darkest);--cbp-structured-list-item-padding:var(--cbp-space-4x);--cbp-structured-list-item-color-background-danger:var(--cbp-color-danger-lighter);--cbp-structured-list-item-color-background-danger-dark:var(--cbp-color-danger-darker);--cbp-structured-list-item-color-background-selected:var(--cbp-color-interactive-selected-light);--cbp-structured-list-item-color-background-selected-dark:var(--cbp-color-interactive-selected-dark)}[data-cbp-theme=light] cbp-structured-list[context*=dark]:not([context=light-always]),[data-cbp-theme=dark] cbp-structured-list:not([context=dark-inverts]):not([context=light-always]){--cbp-structured-list-color-background:var(--cbp-structured-list-color-background-dark);--cbp-structured-list-color-striped-background:var(--cbp-structured-list-color-striped-background-dark);--cbp-structured-list-color-background-hover:var(--cbp-structured-list-color-background-hover-dark);--cbp-structured-list-color:var(--cbp-structured-list-color-dark);--cbp-structured-list-border-color:var(--cbp-structured-list-border-color-dark);--cbp-structured-list-header-color-background:var(--cbp-structured-list-header-color-background-dark);--cbp-structured-list-header-color:var(--cbp-structured-list-header-color-dark);--cbp-structured-list-footer-color-background:var(--cbp-structured-list-footer-color-background-dark);--cbp-structured-list-footer-color:var(--cbp-structured-list-footer-color-dark);--cbp-structured-list-item-color-background-danger:var(--cbp-structured-list-item-color-background-danger-dark);--cbp-structured-list-item-color-background-selected:var(--cbp-structured-list-item-color-background-selected-dark)}cbp-structured-list{display:block;background-color:var(--cbp-structured-list-color-background);color:var(--cbp-structured-list-color);}cbp-structured-list [slot=cbp-structured-list-header]{color:var(--cbp-structured-list-header-color);background-color:var(--cbp-structured-list-header-color-background);font-style:italic;display:flex;align-items:center;padding:var(--cbp-space-3x);min-height:var(--cbp-space-13x);font-weight:var(--cbp-font-weight-bold)}cbp-structured-list [slot=cbp-structured-list-header] *:only-child{flex-basis:100%}cbp-structured-list[striped] [role=list]>*:nth-child(even){background-color:var(--cbp-structured-list-color-striped-background)}cbp-structured-list div[role=list]>*{display:block;padding:var(--cbp-structured-list-item-padding);border-bottom-style:solid;border-bottom-width:var(--cbp-border-size-md);border-bottom-color:var(--cbp-structured-list-border-color)}cbp-structured-list div[role=list]>*:hover{background-color:var(--cbp-structured-list-color-background-hover) !important}cbp-structured-list div[role=list]:only-child>*:first-child{border-top:var(--cbp-border-size-md) solid var(--cbp-structured-list-border-color)}cbp-structured-list[selectable] [slot=cbp-structured-list-header]{gap:var(--cbp-space-4x)}cbp-structured-list[selectable] cbp-structured-list-item{display:flex;flex-direction:row;align-items:center;gap:var(--cbp-space-4x)}cbp-structured-list cbp-structured-list-item[selected]{--cbp-structured-list-color-background:var(--cbp-color-interactive-selected-light);--cbp-structured-list-border-color:var(--cbp-color-gray-cool-30);--cbp-structured-list-color-background-dark:var(--cbp-color-interactive-selected-dark);--cbp-structured-list-border-color-dark:var(--cbp-color-gray-cool-50)}cbp-structured-list cbp-structured-list-item[selected]:hover{--cbp-structured-list-color-background:var(--cbp-color-gray-cool-10);--cbp-structured-list-border-color:var(--cbp-color-gray-cool-30);--cbp-structured-list-color-background-dark:var(--cbp-color-gray-cool-90);--cbp-structured-list-border-color-dark:var(--cbp-color-gray-cool-50)}cbp-structured-list cbp-structured-list-item{display:block}cbp-structured-list cbp-structured-list-item[color=danger]:not([selected]){background-color:var(--cbp-structured-list-item-color-background-danger)}cbp-structured-list cbp-structured-list-item[selected]{background-color:var(--cbp-structured-list-item-color-background-selected)}";const d=s;const l=r(class r extends t{constructor(){super();this.__registerHost();this.accessibilityText=undefined;this.headerId=undefined;this.striped=undefined;this.selectable=undefined;this.context=undefined;this.sx={}}componentWillLoad(){if(typeof this.sx=="string"){this.sx=JSON.parse(this.sx)||{}}e(this.host,Object.assign({},this.sx))}render(){return c(o,{key:"82ff077980627118b9d383e54cbbdf4152f4f3bb"},c("slot",{key:"afd2064f3e2d19f8af712ab9a995136560181285",name:"cbp-structured-list-header"}),c("div",{key:"2f3e0e1de346796a43438b1f37ce8074a8b192fa",role:"list","aria-label":this.accessibilityText,"aria-describedby":this.headerId},c("slot",{key:"c32976dfc7b74adb2b693b73e969d28d15848302"})),c("slot",{key:"5e566754bf457c62929293d923585b7ddbb532fd",name:"cbp-structured-list-footer"}))}get host(){return this}static get style(){return d}},[4,"cbp-structured-list",{accessibilityText:[1,"accessibility-text"],headerId:[1,"header-id"],striped:[516],selectable:[516],context:[513],sx:[8]}]);function u(){if(typeof customElements==="undefined"){return}const r=["cbp-structured-list"];r.forEach((r=>{switch(r){case"cbp-structured-list":if(!customElements.get(r)){customElements.define(r,l)}break}}))}const a=l;const b=u;export{a as CbpStructuredList,b as defineCustomElement};
//# sourceMappingURL=cbp-structured-list.js.map