@cbpds/web-components
Version:
Web components for the CBP Design System.
51 lines (50 loc) • 4.2 kB
JavaScript
/*!
* CPB Design System web components - built with Stencil
*/
import { Host, h } from "@stencil/core";
export class CbpUsaBanner {
constructor() {
this.open = false;
}
handleClick() {
this.open = !this.open;
}
render() {
return (h(Host, { key: '528a4ea5f7e558608448c95e92026849aab9307d' }, h("section", { key: '171d2635d091135566b859c36089b523d7437204', "aria-label": "Official website of the United States government" }, h("div", { key: '1a2a9205e3187637149f715d6e6f01dd96a9870a', class: "cbp-banner__title" }, h("img", { key: '6694e1fdfba383186177c021da90cc4001c1c6f6', src: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAALCAMAAABBPP0LAAAAG1BMVEUdM7EeNLIeM7HgQCDaPh/bPh/bPx/////bPyBEby41AAAAUElEQVQI123MNw4CABDEwD3jC/9/MQ1BQrgeOSkIqYe2o2FZtthXgQLgbHVMZdlsfUQFQnHtjP1+8BUhBDKOqtmfot6ojqPzR7TjdU+f6vkED+IDPhTBcMAAAAAASUVORK5CYII=", height: "11", width: "16", "aria-hidden": "true", alt: "" }), h("span", { key: '51001fe48bb83baf82fd6b3a4a133e24bab7cc14' }, h("span", { key: '966dd32ff1f7e6f1dd7f9e7e1774c9ea9f0af554' }, "Official website of the United States government."), h("cbp-button", { key: '1b375c00764876736d30afda0ec2709c6af370ac', class: "cbp-usa-banner-expand", fill: "ghost", "target-prop": "open", controls: "gov-banner", expanded: `${this.open}`, onClick: () => this.handleClick() }, "Here is how you know ", h("cbp-icon", { key: '546656ef42697e882ca8aa0399c060b4756c9aa5', name: "chevron-right", size: "var(--cbp-space-3x)" })))), h("div", { key: '3b2d6a2809a57d80ba4e61b189ad3683ef1285d9', class: "cbp-usa-banner-content", id: "gov-banner" }, h("div", { key: '432d1502e865e2f229112345421824e0076516c2' }, h("cbp-icon", { key: 'c290aa75620ef797bc9534dc0cb01814bf98e4c7', class: "cbp-banner-content-icon", color: "var(--cbp-color-info-light)", name: "landmark", size: "1.25rem" }), h("div", { key: 'b2437f706e9192045577d9d660e25aa6be4761a9' }, h("strong", { key: 'ea9284c2922c196dab57caee6b05e4e68573b4d3' }, "Official websites use .gov"), h("p", { key: '1c91e73c398cae8459b18db8c72ec43ef4b901cf' }, "A ", h("strong", { key: 'd33cf0cb336a6da08a4f96dd9e3c2d1e3714440b' }, ".gov"), " website belongs to an official government organization in the United States."))), h("div", { key: 'b026c6551e7014c95f9decb8d22228fcd95fceae' }, h("cbp-icon", { key: '25e263b03aaad7f7df89a681d052d50a749f51ec', class: "cbp-banner-content-icon", color: "var(--cbp-color-info-light)", name: "lock", size: "1.25rem" }), h("div", { key: '5536757471fa7e7c895025ae7a2a7c78e2705c7d' }, h("strong", { key: 'd547d63ca5f7993930378dd3da793ea5bfe99f63' }, "Secure .gov websites use HTTPS"), h("p", { key: '63f8a631ec21f36831705e574e061000a85cdd3d' }, "A ", h("strong", { key: '105667d41a4a85c349a581527e39ba11edc44f6f' }, "lock"), " (", h("cbp-icon", { key: '0260de8c686b08ec8d76c390ce42f3033a42cb7d', name: "lock", size: "var(--cbp-space-3x)", accessibilityText: "lock icon" }), ") or ", h("strong", { key: 'd84beb1ac80aa146ac4c03226b2e7a0402fdf67f' }, "https://"), " means you've safely connected to the .gov website. Share sensitive information only on official, secure websites.")))))));
}
static get is() { return "cbp-usa-banner"; }
static get originalStyleUrls() {
return {
"$": ["cbp-usa-banner.scss"]
};
}
static get styleUrls() {
return {
"$": ["cbp-usa-banner.css"]
};
}
static get properties() {
return {
"open": {
"type": "boolean",
"mutable": false,
"complexType": {
"original": "boolean",
"resolved": "boolean",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": "Specifies that the banner is open. Primarily used for internal component logic."
},
"attribute": "open",
"reflect": true,
"defaultValue": "false"
}
};
}
static get elementRef() { return "host"; }
}
//# sourceMappingURL=cbp-usa-banner.js.map