@gov-design-system-ce/components 4.2.8 → 4.2.9

package/dist/core/p-d8264763.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as a,h as s,H as t,g as e}from"./p-DT2tslUp.js";import{g as c,b as o}from"./p-BBOh2pxy.js";import{c as d}from"./p-vN03FcXN.js";import{v as n}from"./p-CDIRBJsi.js";import{c as r}from"./p-CgDnDrq5.js";import{d as h}from"./p-CQvUntGY.js";import"./p-DNztiAH0.js";var l;(function(i){i["HORIZONTAL"]="horizontal";i["VERTICAL"]="vertical"})(l||(l={}));const f={root:"gov-card",header:"gov-card__header",arrow:"gov-card__arrow",inner:"gov-card__inner",img:"gov-card__img",icon:"gov-card__icon",content:"gov-card__content",footer:"gov-card__footer"};var b;(function(i){i["A"]="a";i["DIV"]="div"})(b||(b={}));const v=class{constructor(s){i(this,s);this.govToggle=a(this,"gov-toggle");this.hydrated=false;this.direction="vertical";this.collapsible=false;this.clickable=false;this.open=true;this.h=c(this.host);this.headlineId=d("GovCardHeadline");this.contentId=d("GovCardContent")}async componentDidRender(){if(r()){await h(500);await this.validateAccessibility()}}connectedCallback(){this.hydrated=true}render(){const i=this.href?b.A:b.DIV;return s(t,{key:"f82c40e7efa575ba9d64bd8caa0209403ffc20fb",class:this.h.classes(f.root),open:this.open,collapsible:o(this.collapsible),clickable:this.clickable,direction:this.direction,hydrated:this.hydrated},this.collapsible?s("button",{id:this.headlineId,class:f.header,"aria-label":this.accessibleTriggerLabel,"aria-labelledby":this.accessibleTriggerLabelledBy,"aria-expanded":o(this.open),"aria-controls":this.contentId,onClick:this.onClickHandler.bind(this)},s("slot",{name:"headline"}),s("gov-icon",{class:f.arrow,name:"chevron-down",type:"components"})):this.h.hasSlot("headline")?s("div",{class:f.header},s("slot",{name:"headline"})):null,s(i,{key:"2df6c292a0cfc9804826bb607dc27936f7ab00f8",href:this.href,target:this.target,id:this.contentId,"aria-hidden":this.collapsible?o(!this.open):undefined,hidden:this.collapsible?!this.open:undefined,"aria-labelledby":this.collapsible?this.headlineId:undefined,class:f.inner},this.h.hasSlot("img")&&s("div",{key:"0c237bd7dd87b4f3a5842615e47666cbe2118d02",class:f.img},s("slot",{key:"b4e7582ca06d9dec6b6b55b51d50cb14671268cd",name:"img"})),this.h.hasSlot("icon")&&s("div",{key:"eb0c31816aea23cfcc25335a8b2493f21da0cd3b",class:f.icon},s("slot",{key:"2dead413f83bd5ca42d277b8696d44e566b83f26",name:"icon"})),s("div",{key:"52461c6aaf6344c2d4486fbf381bd49a570a1b02",class:f.content},s("slot",{key:"7e629cf403a3de59bd9740ffbd11686de793074b"})),this.h.hasSlot("footer")&&s("div",{key:"61dac1a4fc6e08c7bc8a3783987f001e8abb1c51",class:f.footer},s("slot",{key:"cacb424a31b54a7eb463ec993c606aa85e0af2a0",name:"footer"}))))}onClickHandler(i){i.stopPropagation();if(this.collapsible){this.open=!this.open;this.govToggle.emit({open:this.open,element:this.host})}}async validateAccessibility(){if(this.collapsible){n(this.accessibleTriggerLabel,this.accessibleTriggerLabelledBy,f.root,this.host)}}get host(){return e(this)}};export{v as gov_card};
+//# sourceMappingURL=p-d8264763.entry.js.map

package/dist/core/p-d8264763.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["CardDirection","CardClass","root","header","arrow","inner","img","icon","content","footer","Tags","GovCard","constructor","hostRef","this","hydrated","direction","collapsible","clickable","open","h","govHost","host","headlineId","createID","contentId","componentDidRender","canValidateWcagOnRender","delay","validateAccessibility","connectedCallback","render","Tag","href","A","DIV","Host","key","class","classes","booleanString","id","accessibleTriggerLabel","accessibleTriggerLabelledBy","onClick","onClickHandler","bind","name","type","hasSlot","target","undefined","hidden","e","stopPropagation","govToggle","emit","element","validateAccessibleLabel"],"sources":["../../../packages/core/src/components/gov-card/constants.ts","../../../packages/core/src/components/gov-card/gov-card.tsx"],"sourcesContent":["import {ValueOf} from \"../../types/interfaces\";\n\nexport enum CardDirection {\n\tHORIZONTAL = 'horizontal',\n\tVERTICAL = 'vertical',\n}\nexport type CardDirectionType = `${ValueOf<typeof CardDirection>}`\n\nexport const CardClass = {\n\troot: 'gov-card',\n\theader: 'gov-card__header',\n\tarrow: 'gov-card__arrow',\n\tinner: 'gov-card__inner',\n\timg: 'gov-card__img',\n\ticon: 'gov-card__icon',\n\tcontent: 'gov-card__content',\n\tfooter: 'gov-card__footer',\n}\n","import {Component, Element, Event, EventEmitter, h, Host, Method, Prop} from '@stencil/core'\nimport {CardClass, CardDirectionType} from './constants'\nimport {booleanString, govHost} from '../../helpers/Dom/template'\nimport {GovHost} from '../../helpers/Dom/template.types'\nimport {createID} from '../../utils/string.utils'\nimport {validateAccessibleLabel} from '../../helpers/Validate/wcag'\nimport {canValidateWcagOnRender} from '../../helpers/Dom/win'\nimport {delay} from '../../utils/utils'\nimport {GovCardChangeEvent} from './interfaces'\nimport {ButtonTargetType} from \"../gov-button/button/constants\";\n\nenum Tags {\n\tA = \"a\",\n\tDIV = \"div\",\n}\n\n@Component({\n\ttag: 'gov-card',\n})\nexport class GovCard {\n\tprivate h: GovHost\n\tprivate readonly headlineId: string\n\tprivate readonly contentId: string\n\tprivate hydrated = false\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t\tthis.headlineId = createID('GovCardHeadline')\n\t\tthis.contentId = createID('GovCardContent')\n\t}\n\n\t@Element() host: HTMLGovCardElement\n\n\t/**\n\t * Card direction\n\t */\n\t@Prop() readonly direction: CardDirectionType = \"vertical\"\n\t/**\n\t * Defines weather the card can be collapsible\n\t */\n\t@Prop() readonly collapsible: boolean = false\n\t/**\n\t * Defines weather the card can be clickable with hover effect\n\t */\n\t@Prop() readonly clickable: boolean = false\n\t/**\n\t * Defines whether the card is open or closed\n\t */\n\t@Prop({reflect: true, mutable: true}) open = true\n\t/**\n\t * Link on whole card\n\t */\n\t@Prop({reflect: true}) readonly href: string\n\t/**\n\t * Same as original parameter\n\t * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-target\n\t */\n\t@Prop() readonly target?: ButtonTargetType\n\t/**\n\t * Adds accessible label for the collapsible button that is only shown for screen readers.\n\t */\n\t@Prop({attribute: 'accessible-label'}) accessibleTriggerLabel: string\n\t/**\n\t * A string of identifiers that indicate alternative label elements for collapsible card\n\t */\n\t@Prop({attribute: 'accessible-labelledby'}) accessibleTriggerLabelledBy: string\n\t/**\n\t * Called when the card toggle state changes\n\t */\n\t@Event({eventName: 'gov-toggle'}) govToggle: EventEmitter<GovCardChangeEvent>\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateAccessibility()\n\t\t}\n\t}\n\n\tconnectedCallback() {\n\t\tthis.hydrated = true\n\t}\n\n\trender() {\n\t\tconst Tag = this.href ? Tags.A : Tags.DIV\n\n\t\treturn (\n\t\t\t<Host class={this.h.classes(CardClass.root)} open={this.open}\n\t\t\t\t  collapsible={booleanString(this.collapsible)}\n\t\t\t\t  clickable={this.clickable}\n\t\t\t\t  direction={this.direction} hydrated={this.hydrated}>\n\t\t\t\t{this.collapsible ? (\n\t\t\t\t\t<button\n\t\t\t\t\t\tid={this.headlineId}\n\t\t\t\t\t\tclass={CardClass.header}\n\t\t\t\t\t\taria-label={this.accessibleTriggerLabel}\n\t\t\t\t\t\taria-labelledby={this.accessibleTriggerLabelledBy}\n\t\t\t\t\t\taria-expanded={booleanString(this.open)}\n\t\t\t\t\t\taria-controls={this.contentId}\n\t\t\t\t\t\tonClick={this.onClickHandler.bind(this)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<slot name=\"headline\"/>\n\t\t\t\t\t\t<gov-icon class={CardClass.arrow} name=\"chevron-down\" type=\"components\"></gov-icon>\n\t\t\t\t\t</button>\n\t\t\t\t) : this.h.hasSlot(\"headline\") ? (\n\t\t\t\t\t<div class={CardClass.header}>\n\t\t\t\t\t\t<slot name=\"headline\"/>\n\t\t\t\t\t</div>\n\t\t\t\t) : null}\n\n\t\t\t\t<Tag href={this.href}\n\t\t\t\t\t target={this.target}\n\t\t\t\t\t id={this.contentId}\n\t\t\t\t\t aria-hidden={this.collapsible ? booleanString(!this.open) : undefined}\n\t\t\t\t\t hidden={this.collapsible ? !this.open : undefined}\n\t\t\t\t\t aria-labelledby={this.collapsible ? this.headlineId : undefined}\n\t\t\t\t\t class={CardClass.inner}>\n\n\t\t\t\t\t{this.h.hasSlot('img') && (\n\t\t\t\t\t\t<div class={CardClass.img}>\n\t\t\t\t\t\t\t<slot name=\"img\"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{this.h.hasSlot('icon') && (\n\t\t\t\t\t\t<div class={CardClass.icon}>\n\t\t\t\t\t\t\t<slot name=\"icon\"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<div class={CardClass.content}>\n\t\t\t\t\t\t<slot/>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{this.h.hasSlot('footer') && (\n\t\t\t\t\t\t<div class={CardClass.footer}>\n\t\t\t\t\t\t\t<slot name=\"footer\"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</Tag>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onClickHandler(e) {\n\t\te.stopPropagation()\n\t\tif (this.collapsible) {\n\t\t\tthis.open = !this.open\n\t\t\tthis.govToggle.emit({open: this.open, element: this.host})\n\t\t}\n\t}\n\n\t/**\n\t * Validate the accessible attributes of the component\n\t */\n\t@Method()\n\tasync validateAccessibility(): Promise<void> {\n\t\tif (this.collapsible) {\n\t\t\tvalidateAccessibleLabel(this.accessibleTriggerLabel, this.accessibleTriggerLabelledBy, CardClass.root, this.host)\n\t\t}\n\t}\n}\n"],"mappings":"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","ignoreList":[]}