@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: 'aaa5758cab00ce86aa2c8d9cfa8a02a3401e644b' }, h("section", { key: '7ac737d8a7c90a4193c6a7d4a47c7ddac7010056', "aria-label": "Official website of the United States government" }, h("div", { key: 'fc4537bc52aa0b9eea88127310af764e6606866d', class: "cbp-banner__title" }, h("img", { key: '8226ea062f08e174966b2e2f3b840882339866d9', 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: '55f025882f887440d67f0580e31df018ab69247b' }, h("span", { key: '42824e7449b470836868e0d107526ff17322af01' }, "Official website of the United States government."), h("cbp-button", { key: '6318d21af4547a6f274c5debc3f4a0dcba6a2dd7', 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: '40d36a0465f58919b48b1aaa2301ad37b95901bd', name: "chevron-right", size: "var(--cbp-space-3x)" })))), h("div", { key: 'bf9655b32a0e3ccec59c290c0d0f6c4ab9a88231', class: "cbp-usa-banner-content", id: "gov-banner" }, h("div", { key: 'd7c647c6466c3baafb2865a93b62efe6c71d1f8f' }, h("cbp-icon", { key: 'eb223a6a3079146a177023b765e947e31d3872c4', class: "cbp-banner-content-icon", color: "var(--cbp-color-info-light)", name: "landmark", size: "1.25rem" }), h("div", { key: '62ad47d1421b758268031a4d9a76367fbcb3adb8' }, h("strong", { key: '6402d7dd94e67d1b72e7a1a0139d9c1b68bc9185' }, "Official websites use .gov"), h("p", { key: '5005ad33f8f5536b1558109901caf74fa980bf99' }, "A ", h("strong", { key: '5c52df0e6590a932f530888f8b1d09f9f1abf7c4' }, ".gov"), " website belongs to an official government organization in the United States."))), h("div", { key: '00e9d3747a26d6a38087f062d6979d5c249a700c' }, h("cbp-icon", { key: '519a081fb439d61ec364578b0a7357b0135989c3', class: "cbp-banner-content-icon", color: "var(--cbp-color-info-light)", name: "lock", size: "1.25rem" }), h("div", { key: '17b2f04b9604a3295c23a1dd6710eaae911aa3f2' }, h("strong", { key: '4dd0a987602c556d7526b555133701f56e28a43a' }, "Secure .gov websites use HTTPS"), h("p", { key: 'fe04f22053101a811d998f383850b8c6bf65e06e' }, "A ", h("strong", { key: '74bf1ad2a356a74d98419ba79696cd2477c6ab9d' }, "lock"), " (", h("cbp-icon", { key: '6b74aa41ba548bf0059fa098edc86e65e1eed479', name: "lock", size: "var(--cbp-space-3x)", accessibilityText: "lock icon" }), ") or ", h("strong", { key: '74835c193c832527a0673515328c1e5a778a19db' }, "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