@cbpds/web-components
Version:
Web components for the CBP Design System.
402 lines (394 loc) • 47.9 kB
JavaScript
/*!
* CPB Design System web components - built with Stencil
*/
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
const index = require('./index-cd71cbd5.js');
const utils = require('./utils-99c9e716.js');
const cbpButtonCss = ":root{--cbp-button-color:var(--cbp-color-text-lightest);--cbp-button-color-hover:var(--cbp-color-text-lightest);--cbp-button-color-focus:var(--cbp-color-text-lightest);--cbp-button-color-active:var(--cbp-color-text-lightest);--cbp-button-color-bg:var(--cbp-color-interactive-primary-dark);--cbp-button-color-bg-hover:var(--cbp-color-interactive-primary-darker);--cbp-button-color-bg-focus:var(--cbp-color-interactive-focus-dark);--cbp-button-color-bg-active:var(--cbp-color-interactive-active-dark);--cbp-button-color-border:var(--cbp-color-interactive-primary-dark);--cbp-button-color-border-hover:var(--cbp-color-interactive-primary-darker);--cbp-button-color-border-focus:var(--cbp-color-interactive-focus-dark);--cbp-button-color-border-active:var(--cbp-color-interactive-active-dark);--cbp-button-color-dark:var(--cbp-color-text-darkest);--cbp-button-color-hover-dark:var(--cbp-color-text-darkest);--cbp-button-color-focus-dark:var(--cbp-color-text-darkest);--cbp-button-color-active-dark:var(--cbp-color-text-darkest);--cbp-button-color-bg-dark:var(--cbp-color-interactive-primary-base);--cbp-button-color-bg-hover-dark:var(--cbp-color-interactive-primary-light);--cbp-button-color-bg-focus-dark:var(--cbp-color-interactive-focus-light);--cbp-button-color-bg-active-dark:var(--cbp-color-interactive-active-light);--cbp-button-color-border-dark:var(--cbp-color-interactive-primary-base);--cbp-button-color-border-hover-dark:var(--cbp-color-interactive-primary-light);--cbp-button-color-border-focus-dark:var(--cbp-color-interactive-focus-light);--cbp-button-color-border-active-dark:var(--cbp-color-interactive-active-light);--cbp-button-color-outline-focus:var(--cbp-color-white);--cbp-button-color-outline-focus-dark:var(--cbp-color-black);--cbp-button-focus-outline-width:var(--cbp-border-size-md);--cbp-button-padding:var(--cbp-space-2x);--cbp-button-border-width:var(--cbp-border-size-md);--cbp-button-border-style:solid;--cbp-button-border-radius:var(--cbp-border-radius-soft);--cbp-button-min-width:auto;--cbp-button-min-height:2.25rem;--cbp-button-width:auto;--cbp-button-height:auto;--cbp-button-gap:0 var(--cbp-space-2x)}[data-cbp-theme=light] cbp-button[context*=dark]:not(#fakeId),[data-cbp-theme=dark] cbp-button:not([context=dark-inverts]):not([context=light-always]):not(#fakeId){--cbp-button-color:var(--cbp-button-color-dark);--cbp-button-color-hover:var(--cbp-button-color-hover-dark);--cbp-button-color-focus:var(--cbp-button-color-focus-dark);--cbp-button-color-active:var(--cbp-button-color-active-dark);--cbp-button-color-bg:var(--cbp-button-color-bg-dark);--cbp-button-color-bg-hover:var(--cbp-button-color-bg-hover-dark);--cbp-button-color-bg-focus:var(--cbp-button-color-bg-focus-dark);--cbp-button-color-bg-active:var(--cbp-button-color-bg-active-dark);--cbp-button-color-border:var(--cbp-button-color-border-dark);--cbp-button-color-border-hover:var(--cbp-button-color-border-hover-dark);--cbp-button-color-border-focus:var(--cbp-button-color-border-focus-dark);--cbp-button-color-border-active:var(--cbp-button-color-border-active-dark);--cbp-button-color-outline-focus:var(--cbp-button-color-outline-focus-dark)}cbp-button{display:inline-block;width:var(--cbp-button-width);height:var(--cbp-button-height)}cbp-button button,cbp-button a{display:inline-flex;gap:var(--cbp-button-gap);align-items:center;justify-content:center;border-width:var(--cbp-button-border-width);border-style:solid;border-radius:var(--cbp-button-border-radius);font-weight:var(--cbp-font-weight-medium);text-transform:uppercase;letter-spacing:var(--cbp-letter-spacing-loose);text-decoration:none;padding:var(--cbp-button-padding);transition:all var(--cbp-motion-duration-shorter);min-width:var(--cbp-button-min-width);min-height:var(--cbp-button-min-height);width:var(--cbp-button-width);height:var(--cbp-button-height);white-space:nowrap;cursor:pointer;color:var(--cbp-button-color);background-color:var(--cbp-button-color-bg);border-color:var(--cbp-button-color-border);outline-color:var(--cbp-button-color-outline-focus);outline-style:solid;outline-width:0;outline-offset:calc(-1 * var(--cbp-space-1x))}cbp-button button:hover,cbp-button a:hover{--cbp-button-color:var(--cbp-button-color-hover);--cbp-button-color-bg:var(--cbp-button-color-bg-hover);--cbp-button-color-border:var(--cbp-button-color-border-hover)}cbp-button button:focus,cbp-button a:focus{--cbp-button-color:var(--cbp-button-color-focus);--cbp-button-color-bg:var(--cbp-button-color-bg-focus);--cbp-button-color-border:var(--cbp-button-color-border-focus);outline-width:var(--cbp-button-focus-outline-width)}cbp-button button:active,cbp-button a:active{--cbp-button-color:var(--cbp-button-color-active);--cbp-button-color-bg:var(--cbp-button-color-bg-active);--cbp-button-color-border:var(--cbp-button-color-border-active)}cbp-button[fill=solid]{--cbp-button-color:var(--cbp-color-text-lightest);--cbp-button-color-hover:var(--cbp-color-text-lightest);--cbp-button-color-dark:var(--cbp-color-text-darkest);--cbp-button-color-hover-dark:var(--cbp-color-text-darkest)}cbp-button[fill=solid][color=primary]{--cbp-button-color-bg:var(--cbp-color-interactive-primary-dark);--cbp-button-color-bg-hover:var(--cbp-color-interactive-primary-darker);--cbp-button-color-border:var(--cbp-color-interactive-primary-dark);--cbp-button-color-border-hover:var(--cbp-color-interactive-primary-darker);--cbp-button-color-bg-dark:var(--cbp-color-interactive-primary-light);--cbp-button-color-bg-hover-dark:var(--cbp-color-interactive-primary-lighter);--cbp-button-color-border-dark:var(--cbp-color-interactive-primary-light);--cbp-button-color-border-hover-dark:var(--cbp-color-interactive-primary-lighter)}cbp-button[fill=solid][color=secondary]{--cbp-button-color-bg:var(--cbp-color-interactive-secondary-dark);--cbp-button-color-bg-hover:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-border:var(--cbp-color-interactive-secondary-dark);--cbp-button-color-border-hover:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-bg-dark:var(--cbp-color-interactive-secondary-light);--cbp-button-color-bg-hover-dark:var(--cbp-color-interactive-secondary-lighter);--cbp-button-color-border-dark:var(--cbp-color-interactive-secondary-light);--cbp-button-color-border-hover-dark:var(--cbp-color-interactive-secondary-lighter)}cbp-button[fill=solid][color=tertiary]{--cbp-button-color-bg:var(--cbp-color-interactive-secondary-base);--cbp-button-color-bg-hover:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-border:var(--cbp-color-interactive-secondary-base);--cbp-button-color-border-hover:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-dark:var(--cbp-color-text-lightest);--cbp-button-color-bg-dark:var(--cbp-color-interactive-secondary-base);--cbp-button-color-bg-hover-dark:var(--cbp-color-interactive-secondary-lighter);--cbp-button-color-border-dark:var(--cbp-color-interactive-secondary-base);--cbp-button-color-border-hover-dark:var(--cbp-color-interactive-secondary-lighter)}cbp-button[fill=solid][color=danger]{--cbp-button-color-bg:var(--cbp-color-danger-dark);--cbp-button-color-bg-hover:var(--cbp-color-danger-darker);--cbp-button-color-border:var(--cbp-color-danger-dark);--cbp-button-color-border-hover:var(--cbp-color-danger-darker);--cbp-button-color-bg-dark:var(--cbp-color-danger-light);--cbp-button-color-bg-hover-dark:var(--cbp-color-danger-lighter);--cbp-button-color-border-dark:var(--cbp-color-danger-light);--cbp-button-color-border-hover-dark:var(--cbp-color-danger-lighter)}cbp-button[fill=solid]:has(button:disabled),cbp-button[fill=solid]:has(a[aria-disabled=true]){--cbp-button-color:var(--cbp-color-interactive-disabled-light);--cbp-button-color-hover:var(--cbp-button-color);--cbp-button-color-focus:var(--cbp-button-color);--cbp-button-color-active:var(--cbp-button-color);--cbp-button-color-bg:var(--cbp-color-interactive-disabled-dark);--cbp-button-color-bg-hover:var(--cbp-button-color-bg);--cbp-button-color-bg-focus:var(--cbp-button-color-bg);--cbp-button-color-bg-active:var(--cbp-button-color-bg);--cbp-button-color-border:var(--cbp-color-interactive-disabled-dark);--cbp-button-color-border-hover:var(--cbp-button-color-border);--cbp-button-color-border-focus:var(--cbp-button-color-border);--cbp-button-color-border-active:var(--cbp-button-color-border);--cbp-button-color-dark:var(--cbp-color-interactive-disabled-dark);--cbp-button-color-hover-dark:var(--cbp-button-color-dark);--cbp-button-color-focus-dark:var(--cbp-button-color-dark);--cbp-button-color-active-dark:var(--cbp-button-color-dark);--cbp-button-color-bg-dark:var(--cbp-color-interactive-disabled-light);--cbp-button-color-bg-hover-dark:var(--cbp-button-color-bg-dark);--cbp-button-color-bg-focus-dark:var(--cbp-button-color-bg-dark);--cbp-button-color-bg-active-dark:var(--cbp-button-color-bg-dark);--cbp-button-color-border-dark:var(--cbp-color-interactive-disabled-light);--cbp-button-color-border-hover-dark:var(--cbp-button-color-border-dark);--cbp-button-color-border-focus-dark:var(--cbp-button-color-border-dark);--cbp-button-color-border-active-dark:var(--cbp-button-color-border-dark)}cbp-button[fill=outline]{--cbp-button-color-bg:var(--cbp-color-white);--cbp-button-color-hover:var(--cbp-color-text-lightest);--cbp-button-color-bg-dark:var(--cbp-color-gray-cool-80);--cbp-button-color-hover-dark:var(--cbp-color-text-darkest)}cbp-button[fill=outline][color=primary]{--cbp-button-color:var(--cbp-color-interactive-primary-dark);--cbp-button-color-bg-hover:var(--cbp-color-interactive-primary-dark);--cbp-button-color-border:var(--cbp-color-interactive-primary-dark);--cbp-button-color-border-hover:var(--cbp-color-interactive-primary-dark);--cbp-button-color-dark:var(--cbp-color-interactive-primary-light);--cbp-button-color-bg-hover-dark:var(--cbp-color-interactive-primary-light);--cbp-button-color-border-dark:var(--cbp-color-interactive-primary-light);--cbp-button-color-border-hover-dark:var(--cbp-color-interactive-primary-light)}cbp-button[fill=outline][color=secondary]{--cbp-button-color:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-bg-hover:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-border:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-border-hover:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-dark:var(--cbp-color-interactive-secondary-lighter);--cbp-button-color-bg-hover-dark:var(--cbp-color-interactive-secondary-lighter);--cbp-button-color-border-dark:var(--cbp-color-interactive-secondary-lighter);--cbp-button-color-border-hover-dark:var(--cbp-color-interactive-secondary-lighter)}cbp-button[fill=outline][color=tertiary]{--cbp-button-color:var(--cbp-color-interactive-secondary-base);--cbp-button-color-bg-hover:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-border:var(--cbp-color-interactive-secondary-base);--cbp-button-color-border-hover:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-dark:var(--cbp-color-interactive-secondary-base);--cbp-button-color-bg-hover-dark:var(--cbp-color-interactive-secondary-lighter);--cbp-button-color-border-dark:var(--cbp-color-interactive-secondary-base);--cbp-button-color-border-hover-dark:var(--cbp-color-interactive-secondary-lighter)}cbp-button[fill=outline][color=danger]{--cbp-button-color:var(--cbp-color-danger-dark);--cbp-button-color-bg-hover:var(--cbp-color-danger-dark);--cbp-button-color-border:var(--cbp-color-danger-dark);--cbp-button-color-border-hover:var(--cbp-color-danger-darker);--cbp-button-color-dark:var(--cbp-color-danger-light);--cbp-button-color-bg-hover-dark:var(--cbp-color-danger-light);--cbp-button-color-border-dark:var(--cbp-color-danger-light);--cbp-button-color-border-hover-dark:var(--cbp-color-danger-light)}cbp-button[fill=outline]:has(button:disabled),cbp-button[fill=outline]:has(a[aria-disabled=true]){--cbp-button-color:var(--cbp-color-interactive-disabled-dark);--cbp-button-color-hover:var(--cbp-button-color);--cbp-button-color-focus:var(--cbp-button-color);--cbp-button-color-active:var(--cbp-button-color);--cbp-button-color-bg:var(--cbp-color-white);--cbp-button-color-bg-hover:var(--cbp-color-white);--cbp-button-color-bg-focus:var(--cbp-color-white);--cbp-button-color-bg-active:var(--cbp-color-white);--cbp-button-color-border:var(--cbp-color-interactive-disabled-dark);--cbp-button-color-border-hover:var(--cbp-button-color-border);--cbp-button-color-border-focus:var(--cbp-button-color-border);--cbp-button-color-border-active:var(--cbp-button-color-border);--cbp-button-color-dark:var(--cbp-color-interactive-disabled-light);--cbp-button-color-hover-dark:var(--cbp-button-color-dark);--cbp-button-color-focus-dark:var(--cbp-button-color-dark);--cbp-button-color-active-dark:var(--cbp-button-color-dark);--cbp-button-color-bg-dark:var(--cbp-color-gray-cool-80);--cbp-button-color-bg-hover-dark:var(--cbp-button-color-bg-dark);--cbp-button-color-bg-focus-dark:var(--cbp-button-color-bg-dark);--cbp-button-color-bg-active-dark:var(--cbp-button-color-bg-dark);--cbp-button-color-border-dark:var(--cbp-color-interactive-disabled-light);--cbp-button-color-border-hover-dark:var(--cbp-button-color-border-dark);--cbp-button-color-border-focus-dark:var(--cbp-button-color-border-dark);--cbp-button-color-border-active-dark:var(--cbp-button-color-border-dark)}cbp-button[fill=ghost]{--cbp-button-color-bg:transparent;--cbp-button-color-border:transparent;--cbp-button-color-bg-dark:transparent;--cbp-button-color-border-dark:transparent}cbp-button[fill=ghost][color=primary]{--cbp-button-color:var(--cbp-color-interactive-primary-dark);--cbp-button-color-hover:var(--cbp-color-text-lightest);--cbp-button-color-bg-hover:var(--cbp-color-interactive-primary-dark);--cbp-button-color-border-hover:var(--cbp-color-interactive-primary-dark);--cbp-button-color-dark:var(--cbp-color-interactive-primary-light);--cbp-button-color-hover-dark:var(--cbp-color-text-darkest);--cbp-button-color-bg-hover-dark:var(--cbp-color-interactive-primary-light);--cbp-button-color-border-hover-dark:var(--cbp-color-interactive-primary-light)}cbp-button[fill=ghost][color=secondary]{--cbp-button-color:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-hover:var(--cbp-color-text-lightest);--cbp-button-color-bg-hover:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-border-hover:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-dark:var(--cbp-color-interactive-secondary-lighter);--cbp-button-color-hover-dark:var(--cbp-color-text-darkest);--cbp-button-color-bg-hover-dark:var(--cbp-color-interactive-secondary-lighter);--cbp-button-color-border-hover-dark:var(--cbp-color-interactive-secondary-lighter)}cbp-button[fill=ghost][color=tertiary]{--cbp-button-color:var(--cbp-color-interactive-secondary-base);--cbp-button-color-hover:var(--cbp-color-text-lightest);--cbp-button-color-bg-hover:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-border-hover:var(--cbp-color-interactive-secondary-darker);--cbp-button-color-dark:var(--cbp-color-interactive-secondary-light);--cbp-button-color-hover-dark:var(--cbp-color-text-darkest);--cbp-button-color-bg-hover-dark:var(--cbp-color-interactive-secondary-lighter);--cbp-button-color-border-hover-dark:var(--cbp-color-interactive-secondary-lighter)}cbp-button[fill=ghost][color=danger]{--cbp-button-color:var(--cbp-color-danger-dark);--cbp-button-color-hover:var(--cbp-color-text-lightest);--cbp-button-color-bg-hover:var(--cbp-color-danger-dark);--cbp-button-color-border-hover:var(--cbp-color-danger-dark);--cbp-button-color-dark:var(--cbp-color-danger-light);--cbp-button-color-hover-dark:var(--cbp-color-text-darkest);--cbp-button-color-bg-hover-dark:var(--cbp-color-danger-light);--cbp-button-color-border-hover-dark:var(--cbp-color-danger-light)}cbp-button[fill=ghost]:has(button:disabled),cbp-button[fill=ghost]:has(a[aria-disabled=true]){--cbp-button-color:var(--cbp-color-interactive-disabled-dark);--cbp-button-color-hover:var(--cbp-button-color);--cbp-button-color-focus:var(--cbp-button-color);--cbp-button-color-active:var(--cbp-button-color);--cbp-button-color-bg-hover:transparent;--cbp-button-color-bg-focus:transparent;--cbp-button-color-bg-active:transparent;--cbp-button-color-border-hover:transparent;--cbp-button-color-border-focus:transparent;--cbp-button-color-border-active:transparent;--cbp-button-color-dark:var(--cbp-color-interactive-disabled-light);--cbp-button-color-hover-dark:var(--cbp-button-color-dark);--cbp-button-color-focus-dark:var(--cbp-button-color-dark);--cbp-button-color-active-dark:var(--cbp-button-color-dark);--cbp-button-color-bg-hover-dark:transparent;--cbp-button-color-bg-focus-dark:transparent;--cbp-button-color-bg-active-dark:transparent;--cbp-button-color-border-hover-dark:transparent;--cbp-button-color-border-focus-dark:transparent;--cbp-button-color-border-active-dark:transparent}cbp-button[variant=square] button,cbp-button[variant=square] a{--cbp-button-height:2.25rem;--cbp-button-width:var(--cbp-button-height);padding:unset;letter-spacing:unset}cbp-button[variant=cta] button,cbp-button[variant=cta] a{font-size:var(--cbp-font-size-heading-sm);padding-left:var(--cbp-space-4x);padding-right:var(--cbp-space-4x);min-height:3.25rem}cbp-button button:disabled,cbp-button a[aria-disabled=true]{font-style:italic;outline:0;cursor:not-allowed}";
const CbpButtonStyle0 = cbpButtonCss;
const CbpButton = class {
constructor(hostRef) {
index.registerInstance(this, hostRef);
this.buttonClick = index.createEvent(this, "buttonClick", 7);
this.componentLoad = index.createEvent(this, "componentLoad", 7);
this.tag = 'button';
this.type = 'button';
this.fill = 'solid';
this.color = 'primary';
this.variant = undefined;
this.controlId = utils.createNamespaceKey('cbp-button');
this.name = undefined;
this.value = undefined;
this.href = undefined;
this.rel = undefined;
this.target = undefined;
this.download = undefined;
this.width = undefined;
this.height = undefined;
this.pressed = undefined;
this.expanded = undefined;
this.controls = undefined;
this.targetProp = undefined;
this.accessibilityText = undefined;
this.disabled = undefined;
this.context = undefined;
this.sx = {};
}
handleClick(e) {
var _a;
if (this.controls) {
if (!this.controlTarget)
this.controlTarget = document.querySelector(`#${this.controls}`);
if (this.controlTarget) {
this.controlTarget[this.targetProp] = !this.controlTarget[this.targetProp];
}
else {
console.warn('cbp-button configuration error: the control target referenced by ID by the `control` property could not be found.');
}
}
(_a = this.buttonClick) === null || _a === void 0 ? void 0 : _a.emit({
host: this.host,
nativeElement: this.button,
nativeEvent: e,
controls: this.controls ? this.controls : null,
pressed: this.pressed,
expanded: this.expanded,
name: this.button.tagName == 'BUTTON' ? this.button.name : null,
value: this.button.tagName == 'BUTTON' ? this.button.value : null,
});
}
componentWillLoad() {
this.controlTarget = this.controls ? document.querySelector(`#${this.controls}`) : undefined;
if (typeof this.sx == 'string') {
this.sx = JSON.parse(this.sx) || {};
}
utils.setCSSProps(this.host, Object.assign({}, this.sx));
let hostattrs = utils.getElementAttrs(this.host);
this.persistedAttrs = Object.fromEntries(Object.entries(hostattrs).filter(([key]) => (key.includes('aria-') || key == 'role')));
}
componentDidLoad() {
if (!this.button) {
const slottedButton = (this.button = this.host.querySelector('button,a'));
if (slottedButton) {
this.button = slottedButton;
this.button.addEventListener('click', this.handleClick);
}
}
if (this.button) {
this.button.getAttribute('id')
? this.controlId = this.button.getAttribute('id')
: this.button.setAttribute('id', `${this.controlId}`);
if (this.disabled)
this.button.setAttribute('disabled', '');
}
utils.setCSSProps(this.button, {
'min-width': this.width,
'min-height': this.height,
});
for (const [key] of Object.entries(this.persistedAttrs)) {
this.host.removeAttribute(key);
}
this.componentLoad.emit({
host: this.host,
nativeElement: this.button,
name: this.button.tagName == 'BUTTON' ? this.button.name : null,
value: this.button.tagName == 'BUTTON' ? this.button.value : null,
});
}
render() {
const { type, name, value, disabled, rel, target, href, download } = this;
const attrs = this.tag === 'button'
? {
type,
name,
value,
disabled,
}
: {
download,
href,
rel,
target,
};
if (this.host.querySelector('[slot=cbp-button-custom]')) {
if (this.disabled)
this.button.setAttribute("disabled", '');
return (index.h(index.Host, { onClick: (e) => this.handleClick(e) }, index.h("slot", { name: "cbp-button-custom" })));
}
else if (this.tag === 'button') {
return (index.h(index.Host, { onClick: (e) => this.handleClick(e) }, index.h("button", Object.assign({}, this.persistedAttrs, attrs, { disabled: this.disabled, "aria-label": this.accessibilityText, "aria-pressed": this.pressed, "aria-expanded": this.expanded, "aria-controls": this.controls, ref: el => (this.button = el) }), index.h("slot", null))));
}
else {
return (index.h(index.Host, { onClick: (e) => this.handleClick(e) }, index.h("a", Object.assign({}, this.persistedAttrs, attrs, { "aria-label": this.accessibilityText, "aria-pressed": this.pressed, "aria-expanded": this.expanded, "aria-controls": this.controls, role: disabled ? 'link' : null, "aria-disabled": disabled ? 'true' : null, ref: el => (this.button = el) }), index.h("slot", null))));
}
}
get host() { return index.getElement(this); }
};
CbpButton.style = CbpButtonStyle0;
const cbpIconCss = ":root{--cbp-icon-color:currentColor;--cbp-icon-size:1rem}cbp-icon{display:inline-flex;align-items:center;justify-content:center;vertical-align:text-top}cbp-icon svg{width:var(--cbp-icon-size);height:var(--cbp-icon-size);fill:var(--cbp-icon-color);vertical-align:top}";
const CbpIconStyle0 = cbpIconCss;
const CbpIcon = class {
constructor(hostRef) {
index.registerInstance(this, hostRef);
this.icons = {
"address-book": {
name: 'address-book',
viewbox: "0 0 512 512",
path: "M96 0C60.7 0 32 28.7 32 64l0 384c0 35.3 28.7 64 64 64l288 0c35.3 0 64-28.7 64-64l0-384c0-35.3-28.7-64-64-64L96 0zM208 288l64 0c44.2 0 80 35.8 80 80c0 8.8-7.2 16-16 16l-192 0c-8.8 0-16-7.2-16-16c0-44.2 35.8-80 80-80zm-32-96a64 64 0 1 1 128 0 64 64 0 1 1 -128 0zM512 80c0-8.8-7.2-16-16-16s-16 7.2-16 16l0 64c0 8.8 7.2 16 16 16s16-7.2 16-16l0-64zM496 192c-8.8 0-16 7.2-16 16l0 64c0 8.8 7.2 16 16 16s16-7.2 16-16l0-64c0-8.8-7.2-16-16-16zm16 144c0-8.8-7.2-16-16-16s-16 7.2-16 16l0 64c0 8.8 7.2 16 16 16s16-7.2 16-16l0-64z",
},
"angle-down": {
name: "angle-down",
viewbox: "0 0 448 512",
path: "M201.4 342.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 274.7 86.6 137.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z",
},
"arrow-right": {
name: "arrow-right",
viewbox: "0 0 448 512",
path: "M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z",
},
"arrow-right-from-bracket": {
name: "arrow-right-from-bracket",
viewbox: "0 0 640 640",
path: "M224 160C241.7 160 256 145.7 256 128C256 110.3 241.7 96 224 96L160 96C107 96 64 139 64 192L64 448C64 501 107 544 160 544L224 544C241.7 544 256 529.7 256 512C256 494.3 241.7 480 224 480L160 480C142.3 480 128 465.7 128 448L128 192C128 174.3 142.3 160 160 160L224 160zM566.6 342.6C579.1 330.1 579.1 309.8 566.6 297.3L438.6 169.3C426.1 156.8 405.8 156.8 393.3 169.3C380.8 181.8 380.8 202.1 393.3 214.6L466.7 288L256 288C238.3 288 224 302.3 224 320C224 337.7 238.3 352 256 352L466.7 352L393.3 425.4C380.8 437.9 380.8 458.2 393.3 470.7C405.8 483.2 426.1 483.2 438.6 470.7L566.6 342.7z"
},
"bars": {
name: "bars",
viewbox: "0 0 448 512",
path: "M0 96C0 78.3 14.3 64 32 64H416c17.7 0 32 14.3 32 32s-14.3 32-32 32H32C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32H416c17.7 0 32 14.3 32 32s-14.3 32-32 32H32c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H416c17.7 0 32 14.3 32 32z",
},
'caret-down': {
name: "caret-down",
viewbox: "0 0 320 512",
path: "M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z",
},
'check': {
name: "check",
viewbox: "0 0 448 512",
path: "M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z",
},
"check-circle": {
name: 'check-circle',
viewbox: '0 0 512 512',
path: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM369 209L241 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L335 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z",
},
"chevron-right": {
name: "chevron-right",
viewbox: "0 0 320 512",
path: "M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z",
},
"circle-info": {
name: "circle-info",
viewbox: "0 0 512 512",
path: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z",
},
"circle-xmark": {
name: "circle-xmark",
viewbox: "0 0 512 512",
path: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM175 175c9.4-9.4 24.6-9.4 33.9 0l47 47 47-47c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9l-47 47 47 47c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0l-47-47-47 47c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l47-47-47-47c-9.4-9.4-9.4-24.6 0-33.9z",
},
"clock": {
name: "clock",
viewbox: "0 0 512 512",
path: "M256 0a256 256 0 1 1 0 512A256 256 0 1 1 256 0zM232 120l0 136c0 8 4 15.5 10.7 20l96 64c11 7.4 25.9 4.4 33.3-6.7s4.4-25.9-6.7-33.3L280 243.2 280 120c0-13.3-10.7-24-24-24s-24 10.7-24 24z"
},
"clone": {
name: "clone",
viewbox: "0 0 512 512",
path: "M288 448L64 448l0-224 64 0 0-64-64 0c-35.3 0-64 28.7-64 64L0 448c0 35.3 28.7 64 64 64l224 0c35.3 0 64-28.7 64-64l0-64-64 0 0 64zm-64-96l224 0c35.3 0 64-28.7 64-64l0-224c0-35.3-28.7-64-64-64L224 0c-35.3 0-64 28.7-64 64l0 224c0 35.3 28.7 64 64 64z"
},
"comment": {
name: "comment",
viewbox: "0 0 512 512",
path: "M512 240c0 114.9-114.6 208-256 208c-37.1 0-72.3-6.4-104.1-17.9c-11.9 8.7-31.3 20.6-54.3 30.6C73.6 471.1 44.7 480 16 480c-6.5 0-12.3-3.9-14.8-9.9c-2.5-6-1.1-12.8 3.4-17.4l0 0 0 0 0 0 0 0 .3-.3c.3-.3 .7-.7 1.3-1.4c1.1-1.2 2.8-3.1 4.9-5.7c4.1-5 9.6-12.4 15.2-21.6c10-16.6 19.5-38.4 21.4-62.9C17.7 326.8 0 285.1 0 240C0 125.1 114.6 32 256 32s256 93.1 256 208z",
},
"ellipsis-vertical": {
name: "ellipsis-vertical",
viewbox: "0 0 128 512",
path: "M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z",
},
"envelope": {
name: "eye",
viewbox: "0 0 512 512",
path: "M48 64C21.5 64 0 85.5 0 112c0 15.1 7.1 29.3 19.2 38.4L236.8 313.6c11.4 8.5 27 8.5 38.4 0L492.8 150.4c12.1-9.1 19.2-23.3 19.2-38.4c0-26.5-21.5-48-48-48H48zM0 176V384c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V176L294.4 339.2c-22.8 17.1-54 17.1-76.8 0L0 176z",
},
"exclamation-circle": {
name: "exclamation-circle",
viewbox: "0 0 512 512",
path: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24V264c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z",
},
"external-link-alt": {
name: "external-link-alt",
viewbox: "0 0 512 512",
path: "M432 320H400a16 16 0 0 0 -16 16V448H64V128H208a16 16 0 0 0 16-16V80a16 16 0 0 0 -16-16H48A48 48 0 0 0 0 112V464a48 48 0 0 0 48 48H400a48 48 0 0 0 48-48V336A16 16 0 0 0 432 320zM488 0h-128c-21.4 0-32.1 25.9-17 41l35.7 35.7L135 320.4a24 24 0 0 0 0 34L157.7 377a24 24 0 0 0 34 0L435.3 133.3 471 169c15 15 41 4.5 41-17V24A24 24 0 0 0 488 0z",
},
"eye": {
name: "envelope",
viewbox: "0 0 576 512",
path: "M288 32c-80.8 0-145.5 36.8-192.6 80.6C48.6 156 17.3 208 2.5 243.7c-3.3 7.9-3.3 16.7 0 24.6C17.3 304 48.6 356 95.4 399.4C142.5 443.2 207.2 480 288 480s145.5-36.8 192.6-80.6c46.8-43.5 78.1-95.4 93-131.1c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C433.5 68.8 368.8 32 288 32zM144 256a144 144 0 1 1 288 0 144 144 0 1 1 -288 0zm144-64c0 35.3-28.7 64-64 64c-7.1 0-13.9-1.2-20.3-3.3c-5.5-1.8-11.9 1.6-11.7 7.4c.3 6.9 1.3 13.8 3.2 20.7c13.7 51.2 66.4 81.6 117.6 67.9s81.6-66.4 67.9-117.6c-11.1-41.5-47.8-69.4-88.6-71.1c-5.8-.2-9.2 6.1-7.4 11.7c2.1 6.4 3.3 13.2 3.3 20.3z",
},
"eye-slash": {
name: "eye-slash",
viewbox: "0 0 640 512",
path: "M38.8 5.1C28.4-3.1 13.3-1.2 5.1 9.2S-1.2 34.7 9.2 42.9l592 464c10.4 8.2 25.5 6.3 33.7-4.1s6.3-25.5-4.1-33.7L525.6 386.7c39.6-40.6 66.4-86.1 79.9-118.4c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C465.5 68.8 400.8 32 320 32c-68.2 0-125 26.3-169.3 60.8L38.8 5.1zM223.1 149.5C248.6 126.2 282.7 112 320 112c79.5 0 144 64.5 144 144c0 24.9-6.3 48.3-17.4 68.7L408 294.5c8.4-19.3 10.6-41.4 4.8-63.3c-11.1-41.5-47.8-69.4-88.6-71.1c-5.8-.2-9.2 6.1-7.4 11.7c2.1 6.4 3.3 13.2 3.3 20.3c0 10.2-2.4 19.8-6.6 28.3l-90.3-70.8zM373 389.9c-16.4 6.5-34.3 10.1-53 10.1c-79.5 0-144-64.5-144-144c0-6.9 .5-13.6 1.4-20.2L83.1 161.5C60.3 191.2 44 220.8 34.5 243.7c-3.3 7.9-3.3 16.7 0 24.6c14.9 35.7 46.2 87.7 93 131.1C174.5 443.2 239.2 480 320 480c47.8 0 89.9-12.9 126.2-32.5L373 389.9z",
},
"file-lines": {
name: "file-lines",
viewbox: "0 0 384 512",
path: "M64 0C28.7 0 0 28.7 0 64L0 448c0 35.3 28.7 64 64 64l256 0c35.3 0 64-28.7 64-64l0-288-128 0c-17.7 0-32-14.3-32-32L224 0 64 0zM256 0l0 128 128 0L256 0zM112 256l160 0c8.8 0 16 7.2 16 16s-7.2 16-16 16l-160 0c-8.8 0-16-7.2-16-16s7.2-16 16-16zm0 64l160 0c8.8 0 16 7.2 16 16s-7.2 16-16 16l-160 0c-8.8 0-16-7.2-16-16s7.2-16 16-16zm0 64l160 0c8.8 0 16 7.2 16 16s-7.2 16-16 16l-160 0c-8.8 0-16-7.2-16-16s7.2-16 16-16z",
},
"globe": {
name: "globe",
viewbox: "0 0 512 512",
path: "M352 256c0 22.2-1.2 43.6-3.3 64l-185.3 0c-2.2-20.4-3.3-41.8-3.3-64s1.2-43.6 3.3-64l185.3 0c2.2 20.4 3.3 41.8 3.3 64zm28.8-64l123.1 0c5.3 20.5 8.1 41.9 8.1 64s-2.8 43.5-8.1 64l-123.1 0c2.1-20.6 3.2-42 3.2-64s-1.1-43.4-3.2-64zm112.6-32l-116.7 0c-10-63.9-29.8-117.4-55.3-151.6c78.3 20.7 142 77.5 171.9 151.6zm-149.1 0l-176.6 0c6.1-36.4 15.5-68.6 27-94.7c10.5-23.6 22.2-40.7 33.5-51.5C239.4 3.2 248.7 0 256 0s16.6 3.2 27.8 13.8c11.3 10.8 23 27.9 33.5 51.5c11.6 26 20.9 58.2 27 94.7zm-209 0L18.6 160C48.6 85.9 112.2 29.1 190.6 8.4C165.1 42.6 145.3 96.1 135.3 160zM8.1 192l123.1 0c-2.1 20.6-3.2 42-3.2 64s1.1 43.4 3.2 64L8.1 320C2.8 299.5 0 278.1 0 256s2.8-43.5 8.1-64zM194.7 446.6c-11.6-26-20.9-58.2-27-94.6l176.6 0c-6.1 36.4-15.5 68.6-27 94.6c-10.5 23.6-22.2 40.7-33.5 51.5C272.6 508.8 263.3 512 256 512s-16.6-3.2-27.8-13.8c-11.3-10.8-23-27.9-33.5-51.5zM135.3 352c10 63.9 29.8 117.4 55.3 151.6C112.2 482.9 48.6 426.1 18.6 352l116.7 0zm358.1 0c-30 74.1-93.6 130.9-171.9 151.6c25.5-34.2 45.2-87.7 55.3-151.6l116.7 0z",
},
"headset": {
name: "headset",
viewbox: "0 0 512 512",
path: "M256 48C141.1 48 48 141.1 48 256l0 40c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-40C0 114.6 114.6 0 256 0S512 114.6 512 256l0 144.1c0 48.6-39.4 88-88.1 88L313.6 488c-8.3 14.3-23.8 24-41.6 24l-32 0c-26.5 0-48-21.5-48-48s21.5-48 48-48l32 0c17.8 0 33.3 9.7 41.6 24l110.4 .1c22.1 0 40-17.9 40-40L464 256c0-114.9-93.1-208-208-208zM144 208l16 0c17.7 0 32 14.3 32 32l0 112c0 17.7-14.3 32-32 32l-16 0c-35.3 0-64-28.7-64-64l0-48c0-35.3 28.7-64 64-64zm224 0c35.3 0 64 28.7 64 64l0 48c0 35.3-28.7 64-64 64l-16 0c-17.7 0-32-14.3-32-32l0-112c0-17.7 14.3-32 32-32l16 0z",
},
"home": {
name: "home",
viewbox: "0 0 576 512",
path: "M575.8 255.5c0 18-15 32.1-32 32.1l-32 0 .7 160.2c0 2.7-.2 5.4-.5 8.1l0 16.2c0 22.1-17.9 40-40 40l-16 0c-1.1 0-2.2 0-3.3-.1c-1.4 .1-2.8 .1-4.2 .1L416 512l-24 0c-22.1 0-40-17.9-40-40l0-24 0-64c0-17.7-14.3-32-32-32l-64 0c-17.7 0-32 14.3-32 32l0 64 0 24c0 22.1-17.9 40-40 40l-24 0-31.9 0c-1.5 0-3-.1-4.5-.2c-1.2 .1-2.4 .2-3.6 .2l-16 0c-22.1 0-40-17.9-40-40l0-112c0-.9 0-1.9 .1-2.8l0-69.7-32 0c-18 0-32-14-32-32.1c0-9 3-17 10-24L266.4 8c7-7 15-8 22-8s15 2 21 7L564.8 231.5c8 7 12 15 11 24z"
},
"landmark": {
name: "landmark",
viewbox: "0 0 512 512",
path: "M240.1 4.2c9.8-5.6 21.9-5.6 31.8 0l171.8 98.1L448 104l0 .9 47.9 27.4c12.6 7.2 18.8 22 15.1 36s-16.4 23.8-30.9 23.8L32 192c-14.5 0-27.2-9.8-30.9-23.8s2.5-28.8 15.1-36L64 104.9l0-.9 4.4-1.6L240.1 4.2zM64 224l64 0 0 192 40 0 0-192 64 0 0 192 48 0 0-192 64 0 0 192 40 0 0-192 64 0 0 196.3c.6 .3 1.2 .7 1.8 1.1l48 32c11.7 7.8 17 22.4 12.9 35.9S494.1 512 480 512L32 512c-14.1 0-26.5-9.2-30.6-22.7s1.1-28.1 12.9-35.9l48-32c.6-.4 1.2-.7 1.8-1.1L64 224z",
},
"lock": {
name: "lock",
viewbox: "0 0 448 512",
path: "M144 144l0 48 160 0 0-48c0-44.2-35.8-80-80-80s-80 35.8-80 80zM80 192l0-48C80 64.5 144.5 0 224 0s144 64.5 144 144l0 48 16 0c35.3 0 64 28.7 64 64l0 192c0 35.3-28.7 64-64 64L64 512c-35.3 0-64-28.7-64-64L0 256c0-35.3 28.7-64 64-64l16 0z"
},
"magnifying-glass": {
name: "magnifying-glass",
viewbox: "0 0 512 512",
path: "M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z",
},
"minus": {
name: "minus",
viewbox: "0 0 448 512",
path: "M432 256c0 17.7-14.3 32-32 32L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l352 0c17.7 0 32 14.3 32 32z",
},
"pen-to-square": {
name: "pen-to-square",
viewbox: "0 0 512 512",
path: "M471.6 21.7c-21.9-21.9-57.3-21.9-79.2 0L362.3 51.7l97.9 97.9 30.1-30.1c21.9-21.9 21.9-57.3 0-79.2L471.6 21.7zm-299.2 220c-6.1 6.1-10.8 13.6-13.5 21.9l-29.6 88.8c-2.9 8.6-.6 18.1 5.8 24.6s15.9 8.7 24.6 5.8l88.8-29.6c8.2-2.7 15.7-7.4 21.9-13.5L437.7 172.3 339.7 74.3 172.4 241.7zM96 64C43 64 0 107 0 160L0 416c0 53 43 96 96 96l256 0c53 0 96-43 96-96l0-96c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 96c0 17.7-14.3 32-32 32L96 448c-17.7 0-32-14.3-32-32l0-256c0-17.7 14.3-32 32-32l96 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L96 64z",
},
"plus": {
name: "plus",
viewbox: "0 0 448 512",
path: "M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z",
},
"right-to-bracket": {
name: "right-to-bracket",
viewbox: "0 0 512 512",
path: "M217.9 105.9L340.7 228.7c7.2 7.2 11.3 17.1 11.3 27.3s-4.1 20.1-11.3 27.3L217.9 406.1c-6.4 6.4-15 9.9-24 9.9c-18.7 0-33.9-15.2-33.9-33.9l0-62.1L32 320c-17.7 0-32-14.3-32-32l0-64c0-17.7 14.3-32 32-32l128 0 0-62.1c0-18.7 15.2-33.9 33.9-33.9c9 0 17.6 3.6 24 9.9zM352 416l64 0c17.7 0 32-14.3 32-32l0-256c0-17.7-14.3-32-32-32l-64 0c-17.7 0-32-14.3-32-32s14.3-32 32-32l64 0c53 0 96 43 96 96l0 256c0 53-43 96-96 96l-64 0c-17.7 0-32-14.3-32-32s14.3-32 32-32z",
},
"right-from-bracket": {
name: "right-from-bracket",
viewbox: "0 0 512 512",
path: "M377.9 105.9L500.7 228.7c7.2 7.2 11.3 17.1 11.3 27.3s-4.1 20.1-11.3 27.3L377.9 406.1c-6.4 6.4-15 9.9-24 9.9c-18.7 0-33.9-15.2-33.9-33.9l0-62.1-128 0c-17.7 0-32-14.3-32-32l0-64c0-17.7 14.3-32 32-32l128 0 0-62.1c0-18.7 15.2-33.9 33.9-33.9c9 0 17.6 3.6 24 9.9zM160 96L96 96c-17.7 0-32 14.3-32 32l0 256c0 17.7 14.3 32 32 32l64 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-64 0c-53 0-96-43-96-96L0 128C0 75 43 32 96 32l64 0c17.7 0 32 14.3 32 32s-14.3 32-32 32z",
},
"rotate": {
name: "rotate",
viewbox: "0 0 640 640",
path: "M544.1 256L552 256C565.3 256 576 245.3 576 232L576 88C576 78.3 570.2 69.5 561.2 65.8C552.2 62.1 541.9 64.2 535 71L483.3 122.8C439 86.1 382 64 320 64C191 64 84.3 159.4 66.6 283.5C64.1 301 76.2 317.2 93.7 319.7C111.2 322.2 127.4 310 129.9 292.6C143.2 199.5 223.3 128 320 128C364.4 128 405.2 143 437.7 168.3L391 215C384.1 221.9 382.1 232.2 385.8 241.2C389.5 250.2 398.3 256 408 256L544.1 256zM573.5 356.5C576 339 563.8 322.8 546.4 320.3C529 317.8 512.7 330 510.2 347.4C496.9 440.4 416.8 511.9 320.1 511.9C275.7 511.9 234.9 496.9 202.4 471.6L249 425C255.9 418.1 257.9 407.8 254.2 398.8C250.5 389.8 241.7 384 232 384L88 384C74.7 384 64 394.7 64 408L64 552C64 561.7 69.8 570.5 78.8 574.2C87.8 577.9 98.1 575.8 105 569L156.8 517.2C201 553.9 258 576 320 576C449 576 555.7 480.6 573.4 356.5z"
},
"times": {
name: "times",
viewbox: "0 0 384 512",
path: "M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z",
},
"triangle-exclamation": {
name: "triangle-exclamation",
viewbox: "0 0 512 512",
path: "M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24V296c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z",
},
"up-right-from-square": {
name: "up-right-from-square",
viewbox: "0 0 512 512",
path: "M352 0c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9L370.7 96 201.4 265.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L416 141.3l41.4 41.4c9.2 9.2 22.9 11.9 34.9 6.9s19.8-16.6 19.8-29.6V32c0-17.7-14.3-32-32-32H352zM80 32C35.8 32 0 67.8 0 112V432c0 44.2 35.8 80 80 80H400c44.2 0 80-35.8 80-80V320c0-17.7-14.3-32-32-32s-32 14.3-32 32V432c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16V112c0-8.8 7.2-16 16-16H192c17.7 0 32-14.3 32-32s-14.3-32-32-32H80z",
},
"upload": {
name: "upload",
viewbox: "0 0 512 512",
path: "M288 109.3L288 352c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-242.7-73.4 73.4c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l128-128c12.5-12.5 32.8-12.5 45.3 0l128 128c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L288 109.3zM64 352l128 0c0 35.3 28.7 64 64 64s64-28.7 64-64l128 0c35.3 0 64 28.7 64 64l0 32c0 35.3-28.7 64-64 64L64 512c-35.3 0-64-28.7-64-64l0-32c0-35.3 28.7-64 64-64zM432 456a24 24 0 1 0 0-48 24 24 0 1 0 0 48z",
},
"book": {
name: "book",
viewbox: "0 0 448 512",
path: "M96 0C43 0 0 43 0 96V416c0 53 43 96 96 96H384h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V384c17.7 0 32-14.3 32-32V32c0-17.7-14.3-32-32-32H384 96zm0 384H352v64H96c-17.7 0-32-14.3-32-32s14.3-32 32-32zm32-240c0-8.8 7.2-16 16-16H336c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16zm16 48H336c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16s7.2-16 16-16z"
},
"circle": {
name: "circle",
viewbox: "0 0 512 512",
path: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512z"
},
"filter": {
name: "filter",
viewbox: "0 0 512 512",
path: "M3.9 54.9C10.5 40.9 24.5 32 40 32H472c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9V448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6V320.9L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z",
},
"sort-asc": {
name: "sort-asc",
viewbox: "0 0 576 512",
path: "M151.6 469.6C145.5 476.2 137 480 128 480s-17.5-3.8-23.6-10.4l-88-96c-11.9-13-11.1-33.3 2-45.2s33.3-11.1 45.2 2L96 365.7V64c0-17.7 14.3-32 32-32s32 14.3 32 32V365.7l32.4-35.4c11.9-13 32.2-13.9 45.2-2s13.9 32.2 2 45.2l-88 96zM320 32h32c17.7 0 32 14.3 32 32s-14.3 32-32 32H320c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 128h96c17.7 0 32 14.3 32 32s-14.3 32-32 32H320c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 128H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H320c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 128H544c17.7 0 32 14.3 32 32s-14.3 32-32 32H320c-17.7 0-32-14.3-32-32s14.3-32 32-32z",
},
"sort-desc": {
name: "sort-desc",
viewbox: "0 0 576 512",
path: "M151.6 469.6C145.5 476.2 137 480 128 480s-17.5-3.8-23.6-10.4l-88-96c-11.9-13-11.1-33.3 2-45.2s33.3-11.1 45.2 2L96 365.7V64c0-17.7 14.3-32 32-32s32 14.3 32 32V365.7l32.4-35.4c11.9-13 32.2-13.9 45.2-2s13.9 32.2 2 45.2l-88 96zM320 480c-17.7 0-32-14.3-32-32s14.3-32 32-32h32c17.7 0 32 14.3 32 32s-14.3 32-32 32H320zm0-128c-17.7 0-32-14.3-32-32s14.3-32 32-32h96c17.7 0 32 14.3 32 32s-14.3 32-32 32H320zm0-128c-17.7 0-32-14.3-32-32s14.3-32 32-32H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H320zm0-128c-17.7 0-32-14.3-32-32s14.3-32 32-32H544c17.7 0 32 14.3 32 32s-14.3 32-32 32H320z",
},
"square": {
name: "square",
viewbox: "0 0 448 512",
path: "M0 96C0 60.7 28.7 32 64 32H384c35.3 0 64 28.7 64 64V416c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V96z"
},
"star": {
name: "star",
viewbox: "0 0 576 512",
path: "M287.9 0c9.2 0 17.6 5.2 21.6 13.5l68.6 141.3 153.2 22.6c9 1.3 16.5 7.6 19.3 16.3s.5 18.1-5.9 24.5L433.6 328.4l26.2 155.6c1.5 9-2.2 18.1-9.7 23.5s-17.3 6-25.3 1.7l-137-73.2L151 509.1c-8.1 4.3-17.9 3.7-25.3-1.7s-11.2-14.5-9.7-23.5l26.2-155.6L31.1 218.2c-6.5-6.4-8.7-15.9-5.9-24.5s10.3-14.9 19.3-16.3l153.2-22.6L266.3 13.5C270.4 5.2 278.7 0 287.9 0zm0 79L235.4 187.2c-3.5 7.1-10.2 12.1-18.1 13.3L99 217.9 184.9 303c5.5 5.5 8.1 13.3 6.8 21L171.4 443.7l105.2-56.2c7.1-3.8 15.6-3.8 22.6 0l105.2 56.2L384.2 324.1c-1.3-7.7 1.2-15.5 6.8-21l85.9-85.1L358.6 200.5c-7.8-1.2-14.6-6.1-18.1-13.3L287.9 79z"
},
"star-solid": {
name: "star",
viewbox: "0 0 576 512",
path: "M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z",
},
"user": {
name: "user",
viewbox: "0 0 448 512",
path: "M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3C0 498.7 13.3 512 29.7 512H418.3c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304H178.3z",
},
};
this.name = undefined;
this.src = undefined;
this.size = undefined;
this.color = undefined;
this.rotate = undefined;
this.accessibilityText = undefined;
this.sx = {};
}
componentWillRender() {
if (typeof this.sx == 'string') {
this.sx = JSON.parse(this.sx) || {};
}
utils.setCSSProps(this.host, Object.assign({ "transform": this.rotate ? `rotate(${this.rotate}deg)` : undefined, "--cbp-icon-color": this.color, "--cbp-icon-size": this.size }, this.sx));
}
render() {
const Icon = this.name ? this.icons[this.name] : this.src || {};
if (this.name) {
return (index.h(index.Host, { key: '51be0ef0b1fe5a67f8b4a3b865826de0414f2f23' }, index.h("svg", { key: '5fa34bbc4ee44f1eacf5f6d46832b99997595e9e', xmlns: "http://www.w3.org/2000/svg", viewBox: (Icon === null || Icon === void 0 ? void 0 : Icon.viewbox) || "0 0 512 512", "aria-label": this.accessibilityText, role: !this.accessibilityText ? "presentation" : null, "aria-hidden": !this.accessibilityText ? "true" : null }, index.h("path", { key: '9174aa1b1b7ed4c974b855fa0864b473839f61e3', d: Icon === null || Icon === void 0 ? void 0 : Icon.path }))));
}
else {
index.h(index.Host, { key: 'f695ed85b51139ceac12597416f2f864eeb9daf9' }, index.h("slot", { key: 'eb2a107c65167fa0272077b83049c64fbfc7711f' }));
}
}
get host() { return index.getElement(this); }
};
CbpIcon.style = CbpIconStyle0;
exports.cbp_button = CbpButton;
exports.cbp_icon = CbpIcon;
//# sourceMappingURL=cbp-button_2.cjs.entry.js.map