@department-of-veterans-affairs/component-library 47.0.0 → 47.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/1185.app.bundle.js +1 -1
- package/dist/1279.app.bundle.js +1 -1
- package/dist/139.app.bundle.js +1 -0
- package/dist/1652.app.bundle.js +1 -1
- package/dist/2108.app.bundle.js +1 -1
- package/dist/2305.app.bundle.js +1 -1
- package/dist/2843.app.bundle.js +1 -1
- package/dist/3389.app.bundle.js +1 -1
- package/dist/3476.app.bundle.js +1 -1
- package/dist/3499.app.bundle.js +1 -1
- package/dist/360.app.bundle.js +1 -1
- package/dist/3661.app.bundle.js +1 -1
- package/dist/383.app.bundle.js +1 -1
- package/dist/4104.app.bundle.js +1 -1
- package/dist/4181.app.bundle.js +1 -1
- package/dist/4317.app.bundle.js +1 -1
- package/dist/4437.app.bundle.js +1 -1
- package/dist/4818.app.bundle.js +1 -1
- package/dist/4846.app.bundle.js +1 -1
- package/dist/4859.app.bundle.js +1 -1
- package/dist/5154.app.bundle.js +1 -1
- package/dist/5232.app.bundle.js +1 -1
- package/dist/529.app.bundle.js +1 -1
- package/dist/5434.app.bundle.js +1 -1
- package/dist/5669.app.bundle.js +1 -1
- package/dist/569.app.bundle.js +1 -1
- package/dist/6166.app.bundle.js +1 -1
- package/dist/6171.app.bundle.js +1 -1
- package/dist/6205.app.bundle.js +1 -1
- package/dist/6391.app.bundle.js +1 -1
- package/dist/6569.app.bundle.js +1 -1
- package/dist/6596.app.bundle.js +1 -1
- package/dist/6734.app.bundle.js +1 -1
- package/dist/6874.app.bundle.js +1 -1
- package/dist/6998.app.bundle.js +1 -1
- package/dist/7375.app.bundle.js +1 -1
- package/dist/7454.app.bundle.js +1 -1
- package/dist/753.app.bundle.js +1 -1
- package/dist/{7061.app.bundle.js → 7760.app.bundle.js} +1 -1
- package/dist/783.app.bundle.js +1 -1
- package/dist/8214.app.bundle.js +1 -1
- package/dist/8509.app.bundle.js +1 -1
- package/dist/8716.app.bundle.js +1 -1
- package/dist/876.app.bundle.js +1 -1
- package/dist/9262.app.bundle.js +1 -1
- package/dist/934.app.bundle.js +1 -1
- package/dist/9370.app.bundle.js +1 -1
- package/dist/9398.app.bundle.js +1 -1
- package/dist/9727.app.bundle.js +1 -1
- package/dist/9893.app.bundle.js +1 -1
- package/dist/app.bundle.js +1 -1
- package/dist/components/types/components.d.ts +45 -2
- package/dist/components/utils.js +1 -1
- package/dist/components/va-accordion-item.js +1 -1
- package/dist/components/va-file-input-multiple.js +1 -1
- package/dist/components/va-file-input2.js +1 -1
- package/dist/components/va-header-minimal.js +1 -1
- package/dist/components/va-icon2.js +1 -1
- package/dist/components/va-link-action.js +1 -1
- package/dist/components/va-loading-indicator.js +1 -1
- package/dist/components/va-minimal-footer.js +1 -1
- package/dist/components/va-modal2.js +1 -1
- package/dist/components/va-need-help.js +1 -1
- package/dist/components/va-official-gov-banner2.js +1 -1
- package/dist/components/va-omb-info.js +1 -1
- package/dist/components/va-on-this-page.js +1 -1
- package/dist/components/va-privacy-agreement.js +1 -1
- package/dist/components/va-process-list-item.js +1 -1
- package/dist/components/va-process-list.js +1 -1
- package/dist/components/va-progress-bar.js +1 -1
- package/dist/components/va-radio-option.js +1 -1
- package/dist/components/va-radio.js +1 -1
- package/dist/components/va-search-input.js +1 -1
- package/dist/components/va-select2.js +1 -1
- package/dist/components/va-statement-of-truth.js +1 -1
- package/dist/components/va-summary-box.js +1 -1
- package/dist/components/va-table-inner2.js +1 -1
- package/dist/components/va-table.js +1 -1
- package/package.json +2 -2
- package/dist/5254.app.bundle.js +0 -1
|
@@ -536,6 +536,10 @@ export namespace Components {
|
|
|
536
536
|
* Sets the input to required and renders the (*Required) text.
|
|
537
537
|
*/
|
|
538
538
|
"required"?: boolean;
|
|
539
|
+
/**
|
|
540
|
+
* Custom instructional message in the file input.
|
|
541
|
+
*/
|
|
542
|
+
"uploadMessage"?: HTMLElement;
|
|
539
543
|
}
|
|
540
544
|
/**
|
|
541
545
|
* A component that manages multiple file inputs, allowing users to upload several files.
|
|
@@ -1435,6 +1439,10 @@ export namespace Components {
|
|
|
1435
1439
|
interface VaSummaryBox {
|
|
1436
1440
|
}
|
|
1437
1441
|
interface VaTable {
|
|
1442
|
+
/**
|
|
1443
|
+
* Is the table sortable
|
|
1444
|
+
*/
|
|
1445
|
+
"sortable": boolean;
|
|
1438
1446
|
/**
|
|
1439
1447
|
* Convert to a stacked table when screen size is small True by default, must specify if false if this is unwanted
|
|
1440
1448
|
*/
|
|
@@ -1444,7 +1452,7 @@ export namespace Components {
|
|
|
1444
1452
|
*/
|
|
1445
1453
|
"tableTitle"?: string;
|
|
1446
1454
|
/**
|
|
1447
|
-
*
|
|
1455
|
+
* The type of table
|
|
1448
1456
|
*/
|
|
1449
1457
|
"tableType"?: 'borderless';
|
|
1450
1458
|
}
|
|
@@ -1459,6 +1467,10 @@ export namespace Components {
|
|
|
1459
1467
|
*/
|
|
1460
1468
|
"cols"?: number;
|
|
1461
1469
|
"rows"?: number;
|
|
1470
|
+
/**
|
|
1471
|
+
* Is this a sortable table
|
|
1472
|
+
*/
|
|
1473
|
+
"sortable"?: boolean;
|
|
1462
1474
|
/**
|
|
1463
1475
|
* If true convert to a stacked table when screen size is small
|
|
1464
1476
|
*/
|
|
@@ -1865,6 +1877,10 @@ export interface VaStatementOfTruthCustomEvent<T> extends CustomEvent<T> {
|
|
|
1865
1877
|
detail: T;
|
|
1866
1878
|
target: HTMLVaStatementOfTruthElement;
|
|
1867
1879
|
}
|
|
1880
|
+
export interface VaTableInnerCustomEvent<T> extends CustomEvent<T> {
|
|
1881
|
+
detail: T;
|
|
1882
|
+
target: HTMLVaTableInnerElement;
|
|
1883
|
+
}
|
|
1868
1884
|
export interface VaTelephoneCustomEvent<T> extends CustomEvent<T> {
|
|
1869
1885
|
detail: T;
|
|
1870
1886
|
target: HTMLVaTelephoneElement;
|
|
@@ -2806,12 +2822,23 @@ declare global {
|
|
|
2806
2822
|
prototype: HTMLVaTableElement;
|
|
2807
2823
|
new (): HTMLVaTableElement;
|
|
2808
2824
|
};
|
|
2825
|
+
interface HTMLVaTableInnerElementEventMap {
|
|
2826
|
+
"sortTable": any;
|
|
2827
|
+
}
|
|
2809
2828
|
/**
|
|
2810
2829
|
* @componentName Table
|
|
2811
2830
|
* @maturityCategory use
|
|
2812
2831
|
* @maturityLevel best_practice
|
|
2813
2832
|
*/
|
|
2814
2833
|
interface HTMLVaTableInnerElement extends Components.VaTableInner, HTMLStencilElement {
|
|
2834
|
+
addEventListener<K extends keyof HTMLVaTableInnerElementEventMap>(type: K, listener: (this: HTMLVaTableInnerElement, ev: VaTableInnerCustomEvent<HTMLVaTableInnerElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
2835
|
+
addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
2836
|
+
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
2837
|
+
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
2838
|
+
removeEventListener<K extends keyof HTMLVaTableInnerElementEventMap>(type: K, listener: (this: HTMLVaTableInnerElement, ev: VaTableInnerCustomEvent<HTMLVaTableInnerElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
|
|
2839
|
+
removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
2840
|
+
removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
2841
|
+
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
|
|
2815
2842
|
}
|
|
2816
2843
|
var HTMLVaTableInnerElement: {
|
|
2817
2844
|
prototype: HTMLVaTableInnerElement;
|
|
@@ -3575,6 +3602,10 @@ declare namespace LocalJSX {
|
|
|
3575
3602
|
* Sets the input to required and renders the (*Required) text.
|
|
3576
3603
|
*/
|
|
3577
3604
|
"required"?: boolean;
|
|
3605
|
+
/**
|
|
3606
|
+
* Custom instructional message in the file input.
|
|
3607
|
+
*/
|
|
3608
|
+
"uploadMessage"?: HTMLElement;
|
|
3578
3609
|
}
|
|
3579
3610
|
/**
|
|
3580
3611
|
* A component that manages multiple file inputs, allowing users to upload several files.
|
|
@@ -4614,6 +4645,10 @@ declare namespace LocalJSX {
|
|
|
4614
4645
|
interface VaSummaryBox {
|
|
4615
4646
|
}
|
|
4616
4647
|
interface VaTable {
|
|
4648
|
+
/**
|
|
4649
|
+
* Is the table sortable
|
|
4650
|
+
*/
|
|
4651
|
+
"sortable"?: boolean;
|
|
4617
4652
|
/**
|
|
4618
4653
|
* Convert to a stacked table when screen size is small True by default, must specify if false if this is unwanted
|
|
4619
4654
|
*/
|
|
@@ -4623,7 +4658,7 @@ declare namespace LocalJSX {
|
|
|
4623
4658
|
*/
|
|
4624
4659
|
"tableTitle"?: string;
|
|
4625
4660
|
/**
|
|
4626
|
-
*
|
|
4661
|
+
* The type of table
|
|
4627
4662
|
*/
|
|
4628
4663
|
"tableType"?: 'borderless';
|
|
4629
4664
|
}
|
|
@@ -4637,7 +4672,15 @@ declare namespace LocalJSX {
|
|
|
4637
4672
|
* The number of columns in the table
|
|
4638
4673
|
*/
|
|
4639
4674
|
"cols"?: number;
|
|
4675
|
+
/**
|
|
4676
|
+
* Fires when the component is closed by clicking on the close icon. This fires only when closeable is true.
|
|
4677
|
+
*/
|
|
4678
|
+
"onSortTable"?: (event: VaTableInnerCustomEvent<any>) => void;
|
|
4640
4679
|
"rows"?: number;
|
|
4680
|
+
/**
|
|
4681
|
+
* Is this a sortable table
|
|
4682
|
+
*/
|
|
4683
|
+
"sortable"?: boolean;
|
|
4641
4684
|
/**
|
|
4642
4685
|
* If true convert to a stacked table when screen size is small
|
|
4643
4686
|
*/
|
package/dist/components/utils.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{Build}from"@stencil/core/internal/client";function getSlottedNodes(e,t){const r=e.shadowRoot.querySelector("slot").assignedNodes();return null!==t?Array.from(r).filter((e=>e.nodeName.toLowerCase()===t)):Array.from(r)}function consoleDevError(e){Build.isDev&&!Build.isTesting&&console.error(e)}function plurality(e){return 1===e?"":"s"}function getCharacterMessage(e,t){if(void 0===e||""===e)return`${t} character${plurality(t)} allowed`;let r;if(e.length<=t){const n=t-e.length;r=`${n} character${plurality(n)} left`}else{const n=e.length-t;r=`${n} character${plurality(n)} over limit`}return r}function makeArray(e,t){return Array.from({length:t-e+1},((t,r)=>e+r))}const isElement=e=>e&&"object"==typeof e&&1===e.nodeType;function select(e,t){if("string"!=typeof e)return[];if(!t||!isElement(t))return[];const r=t.shadowRoot.querySelectorAll(e);return Array.from(r)}function selectOrMatches(e,t){const r=select(e,t);return"string"!=typeof e||isElement(t)&&t.matches(e)&&r.push(t),r}const Sanitizer={_entity:/[&<>"'/]/g,_entities:{"&":"&","<":"<",">":">",'"':""","'":"'","/":"/"},getEntity:function(e){return Sanitizer._entities[e]},escapeHTML:function(e){for(var t="",r=0;r<e.length;r++)if(t+=e[r],r+1<arguments.length){var n=arguments[r+1]||"";t+=String(n).replace(Sanitizer._entity,Sanitizer.getEntity)}return t}};function getHeaderLevel(e){let t=null;return t="string"==typeof e?parseInt(e,10):Math.floor(e),t>=1&&t<=6?`h${t}`:null}export{Sanitizer as S,getHeaderLevel as a,getCharacterMessage as b,consoleDevError as c,getSlottedNodes as g,makeArray as m,selectOrMatches as s};
|
|
1
|
+
import{Build}from"@stencil/core/internal/client";function isNumeric(e){return!Number.isNaN(parseFloat(e))}function getSlottedNodes(e,t){const r=e.shadowRoot.querySelector("slot").assignedNodes();return null!==t?Array.from(r).filter((e=>e.nodeName.toLowerCase()===t)):Array.from(r)}function consoleDevError(e){Build.isDev&&!Build.isTesting&&console.error(e)}function plurality(e){return 1===e?"":"s"}function getCharacterMessage(e,t){if(void 0===e||""===e)return`${t} character${plurality(t)} allowed`;let r;if(e.length<=t){const n=t-e.length;r=`${n} character${plurality(n)} left`}else{const n=e.length-t;r=`${n} character${plurality(n)} over limit`}return r}function makeArray(e,t){return Array.from({length:t-e+1},((t,r)=>e+r))}const isElement=e=>e&&"object"==typeof e&&1===e.nodeType;function select(e,t){if("string"!=typeof e)return[];if(!t||!isElement(t))return[];const r=t.shadowRoot.querySelectorAll(e);return Array.from(r)}function selectOrMatches(e,t){const r=select(e,t);return"string"!=typeof e||isElement(t)&&t.matches(e)&&r.push(t),r}const Sanitizer={_entity:/[&<>"'/]/g,_entities:{"&":"&","<":"<",">":">",'"':""","'":"'","/":"/"},getEntity:function(e){return Sanitizer._entities[e]},escapeHTML:function(e){for(var t="",r=0;r<e.length;r++)if(t+=e[r],r+1<arguments.length){var n=arguments[r+1]||"";t+=String(n).replace(Sanitizer._entity,Sanitizer.getEntity)}return t}};function getHeaderLevel(e){let t=null;return t="string"==typeof e?parseInt(e,10):Math.floor(e),t>=1&&t<=6?`h${t}`:null}export{Sanitizer as S,getHeaderLevel as a,getCharacterMessage as b,consoleDevError as c,getSlottedNodes as g,isNumeric as i,makeArray as m,selectOrMatches as s};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement,HTMLElement,createEvent,h,Host}from"@stencil/core/internal/client";import{g as getSlottedNodes}from"./utils.js";import{c as classnames}from"./index2.js";const vaAccordionItemCss='button:not([disabled]):focus,select:not([disabled]):focus,a:not([disabled]):focus,h1:focus,input:not([disabled]):focus,textarea:not([disabled]):focus,#form-question [role=\'option\']:focus{outline:2px solid var(--vads-color-action-focus-on-light);outline-offset:2px}.usa-accordion{margin-bottom:0;margin-top:0;list-style-type:none;padding-left:0;color:#1b1b1b;margin:0;padding:0;width:100%;font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:1.5}.usa-accordion>li{margin-bottom:0;max-width:unset}.usa-accordion>ul li ul{list-style:disc}.usa-accordion>ul li ul>li>ul{list-style:circle}.usa-accordion>ul li ul>li>ul>li>ul{list-style:square}.usa-accordion+.usa-accordion,.usa-accordion+.usa-accordion--bordered{margin-top:0.5rem}.usa-accordion--bordered .usa-accordion__content{border-bottom:0.25rem solid #f0f0f0;border-left:0.25rem solid #f0f0f0;border-right:0.25rem solid #f0f0f0;padding-bottom:1rem}.usa-accordion--bordered .usa-accordion__heading{margin-bottom:0}.usa-accordion__heading,.usa-prose .usa-accordion__heading{font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:0.9;margin:0}.usa-accordion__heading:not(:first-child),.usa-prose .usa-accordion__heading:not(:first-child){margin-top:0.5rem}.usa-accordion__content{color:#1b1b1b;background-color:white;margin-top:0;overflow:auto;padding:1rem 1.25rem calc(1rem - 0.25rem) 1.25rem}.usa-accordion__content>*:first-child{margin-top:0}.usa-accordion__content>*:last-child{margin-bottom:0}.usa-accordion__button{color:#005ea2;text-decoration:underline;background-color:transparent;border:0;border-radius:0;-webkit-box-shadow:none;box-shadow:none;font-weight:normal;-ms-flex-pack:normal;justify-content:normal;text-align:left;margin:0;padding:0;color:#1b1b1b;background-color:#f0f0f0;background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);background-repeat:no-repeat;background-position:right 1.25rem center;background-size:1.5rem;cursor:pointer;display:inline-block;font-weight:700;margin:0;padding:1rem 3.5rem 1rem 1.25rem;text-decoration:none;width:100%}.usa-accordion__button:visited{color:#54278f}.usa-accordion__button:hover{color:#1a4480}.usa-accordion__button:active{color:#162e51}.usa-accordion__button:focus{outline:0.25rem solid #2491ff;outline-offset:0rem}.usa-accordion__button:hover,.usa-accordion__button.usa-button--hover,.usa-accordion__button:disabled:hover,.usa-accordion__button[aria-disabled=true]:hover,.usa-accordion__button:disabled.usa-button--hover,.usa-accordion__button[aria-disabled=true].usa-button--hover,.usa-accordion__button:active,.usa-accordion__button.usa-button--active,.usa-accordion__button:disabled:active,.usa-accordion__button[aria-disabled=true]:active,.usa-accordion__button:disabled.usa-button--active,.usa-accordion__button[aria-disabled=true].usa-button--active,.usa-accordion__button:disabled:focus,.usa-accordion__button[aria-disabled=true]:focus,.usa-accordion__button:disabled.usa-focus,.usa-accordion__button[aria-disabled=true].usa-focus,.usa-accordion__button:disabled,.usa-accordion__button[aria-disabled=true],.usa-accordion__button.usa-button--disabled{background-color:transparent;-webkit-box-shadow:none;box-shadow:none;text-decoration:underline}.usa-accordion__button.usa-button--hover{color:#1a4480}.usa-accordion__button.usa-button--active{color:#162e51}.usa-accordion__button:disabled,.usa-accordion__button[aria-disabled=true],.usa-accordion__button:disabled:hover,.usa-accordion__button[aria-disabled=true]:hover,.usa-accordion__button[aria-disabled=true]:focus{color:#757575}@media (forced-colors: active){.usa-accordion__button:disabled,.usa-accordion__button[aria-disabled=true],.usa-accordion__button:disabled:hover,.usa-accordion__button[aria-disabled=true]:hover,.usa-accordion__button[aria-disabled=true]:focus{color:GrayText}}.usa-accordion__button:hover{color:#1b1b1b;background-color:#dfe1e2;background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);background-repeat:no-repeat;text-decoration:none}@media (forced-colors: active){.usa-accordion__button{border:2px solid transparent;position:relative}.usa-accordion__button::before{background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E");background-repeat:no-repeat;background-position:center center;background-size:1.5rem 1.5rem;display:inline-block;height:1.5rem;width:1.5rem;height:100%;position:absolute;right:1.25rem;top:0;content:""}@supports ((-webkit-mask: url("")) or (mask: url(""))){.usa-accordion__button::before{background:none;background-color:ButtonText;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);-webkit-mask-position:center center;mask-position:center center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:1.5rem 1.5rem;mask-size:1.5rem 1.5rem}}}.usa-accordion__button[aria-expanded=false]{background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);background-repeat:no-repeat;background-size:1.5rem}.usa-accordion__button[aria-expanded=false]:hover{background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);background-repeat:no-repeat}@media (forced-colors: active){.usa-accordion__button[aria-expanded=false]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E");background-repeat:no-repeat;background-position:center center;background-size:1.5rem 1.5rem;display:inline-block;height:1.5rem;width:1.5rem;height:100%;position:absolute;right:1.25rem;top:0}@supports ((-webkit-mask: url("")) or (mask: url(""))){.usa-accordion__button[aria-expanded=false]::before{background:none;background-color:ButtonText;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);-webkit-mask-position:center center;mask-position:center center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:1.5rem 1.5rem;mask-size:1.5rem 1.5rem}}}:host{display:block}:host(:not(:last-child)){margin-bottom:0.5rem}:host(:last-child){margin-bottom:0.3125rem}button{font:inherit;line-height:1.15}::slotted([slot=headline]){display:none}::slotted([slot=icon]),::slotted([slot=subheader-icon]){width:0.625rem;margin-right:0.938rem}::slotted([slot=subheader-icon]){margin-top:0.2rem}.va-accordion__header,.va-accordion__subheader{display:block}.va-accordion__header ::slotted([slot=icon]),.va-accordion__subheader ::slotted([slot=subheader-icon]){margin-right:15px;width:inherit;vertical-align:text-top}.va-accordion__subheader{font-weight:400;font-size:16px;line-height:26px;margin-top:2px}.usa-prose>::slotted(p){line-height:1.5;max-width:64ex}@media print{:host(:not([open])) #content,:host([open=false]) #content{display:block}}:host(:not([open])) #content,:host([open=false]) #content{display:none}',VaAccordionItemStyle0=vaAccordionItemCss,VaAccordionItem$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.accordionItemToggled=createEvent(this,"accordionItemToggled",7),this.expandButton=null,this.header=void 0,this.subheader=null,this.open=!1,this.level=2,this.bordered=!1,this.slotHeader=null,this.slotTag=null}toggleOpen(t){this.accordionItemToggled.emit(t)}populateStateValues(){getSlottedNodes(this.el,null).forEach((t=>{this.slotHeader=t.innerHTML,this.slotTag=t.tagName.toLowerCase()}))}componentDidLoad(){this.el.id&&this.el.id===window.location.hash.slice(1)&&this.expandButton&&(this.open=!0,this.el.setAttribute("open","true"),this.el.scrollIntoView())}render(){const{bordered:t,header:e,subheader:o,level:a,open:r}=this,n=classnames({"usa-accordion--bordered":t});return h(Host,null,h("div",{class:n},h((()=>{const t=this.el.querySelector('[slot="headline"]'),n=null==t?void 0:t.innerHTML,i=t&&t.tagName.includes("H")?t.tagName.toLowerCase():`h${a}`;return h(i,{class:"usa-accordion__heading"},h("button",{type:"button",class:"usa-accordion__button","aria-expanded":r?"true":"false","aria-controls":"content",onClick:this.toggleOpen.bind(this),ref:t=>{this.expandButton=t},part:"accordion-header"},h("span",{class:"va-accordion__header"},h("slot",{name:"icon"}),this.slotHeader||e||n),this.subheader&&h("span",{class:"va-accordion__subheader"},h("slot",{name:"subheader-icon"}),o)))}),null),h("slot",{name:"headline",onSlotchange:()=>this.populateStateValues()}),h("div",{id:"content",class:"usa-accordion__content usa-prose",hidden:!r,part:"accordion-content"},h("slot",null))))}get el(){return this}static get style(){return VaAccordionItemStyle0}},[1,"va-accordion-item",{header:[1],subheader:[1],open:[4],level:[2],bordered:[4],slotHeader:[32],slotTag:[32]}]);function defineCustomElement$1(){"undefined"!=typeof customElements&&["va-accordion-item"].forEach((t=>{"va-accordion-item"===t&&(customElements.get(t)||customElements.define(t,VaAccordionItem$1))}))}const VaAccordionItem=VaAccordionItem$1,defineCustomElement=defineCustomElement$1;export{VaAccordionItem,defineCustomElement};
|
|
1
|
+
import{proxyCustomElement,HTMLElement,createEvent,h,Host}from"@stencil/core/internal/client";import{g as getSlottedNodes}from"./utils.js";import{c as classnames}from"./index2.js";const vaAccordionItemCss='button:not([disabled]):focus,select:not([disabled]):focus,a:not([disabled]):focus,h1:focus,input:not([disabled]):focus,textarea:not([disabled]):focus,#form-question [role=\'option\']:focus{outline:2px solid var(--vads-color-action-focus-on-light);outline-offset:2px}.usa-accordion{margin-bottom:0;margin-top:0;list-style-type:none;padding-left:0;color:#1b1b1b;margin:0;padding:0;width:100%;font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:1.5}.usa-accordion>li{margin-bottom:0;max-width:unset}.usa-accordion>ul li ul{list-style:disc}.usa-accordion>ul li ul>li>ul{list-style:circle}.usa-accordion>ul li ul>li>ul>li>ul{list-style:square}.usa-accordion+.usa-accordion,.usa-accordion+.usa-accordion--bordered{margin-top:0.5rem}.usa-accordion--bordered .usa-accordion__content{border-bottom:0.25rem solid #f0f0f0;border-left:0.25rem solid #f0f0f0;border-right:0.25rem solid #f0f0f0;padding-bottom:1rem}.usa-accordion--bordered .usa-accordion__heading{margin-bottom:0}.usa-accordion__heading,.usa-prose .usa-accordion__heading{font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:0.9;margin:0}.usa-accordion__heading:not(:first-child),.usa-prose .usa-accordion__heading:not(:first-child){margin-top:0.5rem}.usa-accordion__content{color:#1b1b1b;background-color:white;margin-top:0;overflow:auto;padding:1rem 1.25rem calc(1rem - 0.25rem) 1.25rem}.usa-accordion__content>*:first-child{margin-top:0}.usa-accordion__content>*:last-child{margin-bottom:0}.usa-accordion__button{color:#005ea2;text-decoration:underline;background-color:transparent;border:0;border-radius:0;-webkit-box-shadow:none;box-shadow:none;font-weight:normal;-ms-flex-pack:normal;justify-content:normal;text-align:left;margin:0;padding:0;color:#1b1b1b;background-color:#f0f0f0;background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);background-repeat:no-repeat;background-position:right 1.25rem center;background-size:1.5rem;cursor:pointer;display:inline-block;font-weight:700;margin:0;padding:1rem 3.5rem 1rem 1.25rem;text-decoration:none;width:100%}.usa-accordion__button:visited{color:#54278f}.usa-accordion__button:hover{color:#1a4480}.usa-accordion__button:active{color:#162e51}.usa-accordion__button:focus{outline:0.25rem solid #2491ff;outline-offset:0rem}.usa-accordion__button:hover,.usa-accordion__button.usa-button--hover,.usa-accordion__button:disabled:hover,.usa-accordion__button[aria-disabled=true]:hover,.usa-accordion__button:disabled.usa-button--hover,.usa-accordion__button[aria-disabled=true].usa-button--hover,.usa-accordion__button:active,.usa-accordion__button.usa-button--active,.usa-accordion__button:disabled:active,.usa-accordion__button[aria-disabled=true]:active,.usa-accordion__button:disabled.usa-button--active,.usa-accordion__button[aria-disabled=true].usa-button--active,.usa-accordion__button:disabled:focus,.usa-accordion__button[aria-disabled=true]:focus,.usa-accordion__button:disabled.usa-focus,.usa-accordion__button[aria-disabled=true].usa-focus,.usa-accordion__button:disabled,.usa-accordion__button[aria-disabled=true],.usa-accordion__button.usa-button--disabled{background-color:transparent;-webkit-box-shadow:none;box-shadow:none;text-decoration:underline}.usa-accordion__button.usa-button--hover{color:#1a4480}.usa-accordion__button.usa-button--active{color:#162e51}.usa-accordion__button:disabled,.usa-accordion__button[aria-disabled=true],.usa-accordion__button:disabled:hover,.usa-accordion__button[aria-disabled=true]:hover,.usa-accordion__button[aria-disabled=true]:focus{color:#757575}@media (forced-colors: active){.usa-accordion__button:disabled,.usa-accordion__button[aria-disabled=true],.usa-accordion__button:disabled:hover,.usa-accordion__button[aria-disabled=true]:hover,.usa-accordion__button[aria-disabled=true]:focus{color:GrayText}}.usa-accordion__button:hover{color:#1b1b1b;background-color:#dfe1e2;background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);background-repeat:no-repeat;text-decoration:none}@media (forced-colors: active){.usa-accordion__button{border:2px solid transparent;position:relative}.usa-accordion__button::before{background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E");background-repeat:no-repeat;background-position:center center;background-size:1.5rem 1.5rem;display:inline-block;height:1.5rem;width:1.5rem;height:100%;position:absolute;right:1.25rem;top:0;content:""}@supports ((-webkit-mask: url("")) or (mask: url(""))){.usa-accordion__button::before{background:none;background-color:ButtonText;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13H5v-2h14v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);-webkit-mask-position:center center;mask-position:center center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:1.5rem 1.5rem;mask-size:1.5rem 1.5rem}}}.usa-accordion__button[aria-expanded=false]{background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);background-repeat:no-repeat;background-size:1.5rem}.usa-accordion__button[aria-expanded=false]:hover{background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);background-repeat:no-repeat}@media (forced-colors: active){.usa-accordion__button[aria-expanded=false]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E");background-repeat:no-repeat;background-position:center center;background-size:1.5rem 1.5rem;display:inline-block;height:1.5rem;width:1.5rem;height:100%;position:absolute;right:1.25rem;top:0}@supports ((-webkit-mask: url("")) or (mask: url(""))){.usa-accordion__button[aria-expanded=false]::before{background:none;background-color:ButtonText;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));mask-image:url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%3Cpath d%3D%22M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z%22%2F%3E%3C%2Fsvg%3E"), linear-gradient(transparent, transparent);-webkit-mask-position:center center;mask-position:center center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:1.5rem 1.5rem;mask-size:1.5rem 1.5rem}}}:host{display:block}:host(:not(:last-child)){margin-bottom:0.5rem}:host(:last-child){margin-bottom:0.3125rem}button{font:inherit;line-height:1.15}::slotted([slot=headline]){display:none}::slotted([slot=icon]),::slotted([slot=subheader-icon]){width:0.625rem;margin-right:0.938rem}::slotted([slot=subheader-icon]){margin-top:0.2rem}.va-accordion__header,.va-accordion__subheader{display:block}.va-accordion__header ::slotted([slot=icon]),.va-accordion__subheader ::slotted([slot=subheader-icon]){margin-right:15px;width:inherit;vertical-align:text-top}.va-accordion__subheader{font-weight:400;font-size:16px;line-height:26px;margin-top:2px}.usa-prose>::slotted(p){line-height:1.5;max-width:64ex}:host(:not([open])) #content,:host([open=false]) #content{display:none}@media print{:host(:not([open])) #content,:host([open=false]) #content{display:block}}',VaAccordionItemStyle0=vaAccordionItemCss,VaAccordionItem$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.accordionItemToggled=createEvent(this,"accordionItemToggled",7),this.expandButton=null,this.header=void 0,this.subheader=null,this.open=!1,this.level=2,this.bordered=!1,this.slotHeader=null,this.slotTag=null}toggleOpen(t){this.accordionItemToggled.emit(t)}populateStateValues(){getSlottedNodes(this.el,null).forEach((t=>{this.slotHeader=t.innerHTML,this.slotTag=t.tagName.toLowerCase()}))}componentDidLoad(){this.el.id&&this.el.id===window.location.hash.slice(1)&&this.expandButton&&(this.open=!0,this.el.setAttribute("open","true"),this.el.scrollIntoView())}render(){const{bordered:t,header:e,subheader:o,level:a,open:r}=this,n=classnames({"usa-accordion--bordered":t});return h(Host,null,h("div",{class:n},h((()=>{const t=this.el.querySelector('[slot="headline"]'),n=null==t?void 0:t.innerHTML,i=t&&t.tagName.includes("H")?t.tagName.toLowerCase():`h${a}`;return h(i,{class:"usa-accordion__heading"},h("button",{type:"button",class:"usa-accordion__button","aria-expanded":r?"true":"false","aria-controls":"content",onClick:this.toggleOpen.bind(this),ref:t=>{this.expandButton=t},part:"accordion-header"},h("span",{class:"va-accordion__header"},h("slot",{name:"icon"}),this.slotHeader||e||n),this.subheader&&h("span",{class:"va-accordion__subheader"},h("slot",{name:"subheader-icon"}),o)))}),null),h("slot",{name:"headline",onSlotchange:()=>this.populateStateValues()}),h("div",{id:"content",class:"usa-accordion__content usa-prose",hidden:!r,part:"accordion-content"},h("slot",null))))}get el(){return this}static get style(){return VaAccordionItemStyle0}},[1,"va-accordion-item",{header:[1],subheader:[1],open:[4],level:[2],bordered:[4],slotHeader:[32],slotTag:[32]}]);function defineCustomElement$1(){"undefined"!=typeof customElements&&["va-accordion-item"].forEach((t=>{"va-accordion-item"===t&&(customElements.get(t)||customElements.define(t,VaAccordionItem$1))}))}const VaAccordionItem=VaAccordionItem$1,defineCustomElement=defineCustomElement$1;export{VaAccordionItem,defineCustomElement};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement,HTMLElement,createEvent,h,Host}from"@stencil/core/internal/client";import"./i18n-setup.js";import"./contacts.js";import{d as defineCustomElement$7}from"./va-button2.js";import{d as defineCustomElement$6}from"./va-button-icon2.js";import{d as defineCustomElement$5}from"./va-card2.js";import{d as defineCustomElement$4}from"./va-file-input2.js";import{d as defineCustomElement$3}from"./va-icon2.js";import{d as defineCustomElement$2}from"./va-modal2.js";import{i as instance}from"./i18next.js";const vaFileInputMultipleCss='button:not([disabled]):focus,select:not([disabled]):focus,a:not([disabled]):focus,h1:focus,input:not([disabled]):focus,textarea:not([disabled]):focus,#form-question [role=\'option\']:focus{outline:2px solid var(--vads-color-action-focus-on-light);outline-offset:2px}h1{margin-top:0}h1,h2,h3,h4,h5,h6{margin-bottom:0;margin-top:0;clear:both}*+h1,*+h2,*+h3,*+h4,*+h5,*+h6{margin-top:1.5em}h1+*,h2+*,h3+*,h4+*,h5+*,h6+*{margin-top:1em}h1{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:2.44rem;line-height:1.2;font-weight:700}h2{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:1.95rem;line-height:1.2;font-weight:700}h3{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:1.34rem;line-height:1.2;font-weight:700}h4{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:0.98rem;line-height:1.2;font-weight:700}h5{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:0.91rem;line-height:1.2;font-weight:700}h6{font-family:Source Sans Pro Web, Helvetica Neue, Helvetica, Roboto, Arial, sans-serif;font-size:0.87rem;line-height:1.1;font-weight:normal;letter-spacing:0.025em;text-transform:uppercase}h1,h2,h3,h4,h5{font-family:Bitter, Georgia, Cambria, "Times New Roman", Times, serif;font-weight:700}h6{font-family:"Source Sans Pro", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;font-weight:700}h1{margin-top:0;font-size:2.5rem}h2{font-size:1.875rem}h3{font-size:1.25rem}h4{font-size:1.0625rem}h5{font-size:0.9375rem}h6{font-size:0.9375rem}@media (max-width: 481px){h1{font-size:30px}h2{font-size:24px}}h6{margin:0.5em 0 0;text-transform:none;font-weight:700}@media (max-width: 481px){h1{font-size:30px}h2{font-size:24px}}h6{margin:0.5em 0 0;text-transform:none;font-weight:700}:host legend :is(h1,h2,h3,h4,h5,h6),:host label :is(h1,h2,h3,h4,h5,h6){display:inline;margin:0px}:host legend :is(h1,h2,h3,h4,h5),:host label :is(h1,h2,h3,h4,h5){font-family:var(--font-serif)}:host h1+*,:host h2+*,:host h3+*,:host h4+*,:host h5+*,:host h6+*{margin-top:unset}:host #form-question{margin-bottom:1rem}@import \'~@department-of-veterans-affairs/css-library/dist/stylesheets/base/headings.css\';:host legend :is(h1,h2,h3,h4,h5,h6),:host label :is(h1,h2,h3,h4,h5,h6){display:inline;margin:0px}:host legend :is(h1,h2,h3,h4,h5),:host label :is(h1,h2,h3,h4,h5){font-family:var(--font-serif)}:host h1+*,:host h2+*,:host h3+*,:host h4+*,:host h5+*,:host h6+*{margin-top:unset}:host #form-question{margin-bottom:1rem}.usa-hint{font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:1.3}.usa-label{font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:1.3;display:block;font-weight:normal;margin-top:1.5rem;max-width:30rem}.usa-label--error{font-weight:700;margin-top:0}.usa-label--required{color:#b50909}.usa-hint{color:#71767a}.usa-hint--required{color:#b50909}.usa-sr-only{position:absolute;left:-999em;right:auto}.usa-error-message{padding-bottom:0.25rem;padding-top:0.25rem;color:#b50909;display:block;font-weight:700}.usa-error-message{font-size:1.06rem}:host([error]:not([error=""])){border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}:host([error]:not([error=""])[use-forms-pattern=multiple]){border-left:none}:host([error]:not([error=""])[use-forms-pattern=multiple]) .input-wrap{border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}@media screen and (min-width: 1008px){:host([error]:not([error=""])){margin-left:-0.9rem}:host([error]:not([error=""])[use-forms-pattern=multiple]) .input-wrap{margin-left:-0.9rem}}@media screen and (max-width: 1008px){:host([error]:not([error=""])[use-forms-pattern=multiple]){padding-left:0}}[hidden]{display:none}:host{display:block;font-family:var(--font-source-sans);font-size:16.96px;}:host .label-header{color:var(--vads-color-base);font-weight:var(--font-weight-normal)}:host .label-header-tag{margin:0;display:inline-block}:host .file-input-wrapper{display:block;max-width:30rem;width:100%;position:relative;margin:8px 0}:host .file-input{cursor:pointer;height:100%;width:100%;max-width:none;top:0;left:0;z-index:1;margin:0;position:absolute;text-indent:-999em;-webkit-box-sizing:border-box;box-sizing:border-box}:host .file-input-target{border:1px dashed var(--vads-color-action-border-base-active-on-dark);display:block;margin-top:0.3125rem;position:relative;text-align:center;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}:host .file-input-target.file-input-target-error{border:2px dashed var(--vads-color-secondary-dark)}:host .file-input-box{background:var(--vads-color-white);height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:2}:host .file-input-instructions{font-size:1.06rem;padding:1.25rem 0.625rem;pointer-events:none;position:relative;z-index:3}:host .file-input-choose-text{color:var(--vads-color-link);text-decoration:underline;font-weight:var(--font-weight-normal)}:host .file-icon{color:var(--vads-color-primary-alt-darkest)}:host .selected-files-wrapper{background-color:var(--vads-color-primary-lighter);border:1px solid var(--vads-color-base-light)}:host .selected-files-label{color:var(--vads-color-base);font-weight:var(--font-weight-bold);font-size:1.06rem;border-bottom:1px solid var(--vads-color-white);margin-bottom:8px;padding:8px}:host .va-card{margin:8px}:host .file-label{color:var(--vads-color-base);font-weight:var(--font-weight-bold);font-size:1.06rem;padding:0 8px;display:block;width:100%;word-wrap:break-word;word-break:break-word;overflow:hidden}:host #input-error-message{padding:0 8px;width:100%}:host .file-size-label{color:var(--vads-color-base-dark);font-weight:var(--font-weight-normal);font-size:1.06rem;padding:0 8px;display:block}:host .file-info-section{border-bottom:1px solid var(--vads-color-base-lighter);padding:0 8px 8px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .file-button-section{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-direction:row;flex-direction:row}:host .file-button-section>va-button-icon{font-size:1.06rem}@media screen and (max-width: 481px){:host .file-button-section{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start}}:host .additional-info-slot{padding-bottom:16px}:host .vads-u-line-height--2{line-height:1.15}:host .thumbnail-container{height:40px;width:40px;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}:host .thumbnail-preview{max-width:40px;width:auto;max-height:40px;height:auto}:host .thumbnail-error{color:#b21d38}:host(.has-error){border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}@media screen and (min-width: 1008px){:host(.has-error){margin-left:-0.9rem}}.required{color:var(--vads-color-secondary-dark);margin-left:0.25rem}.usa-error-message{font-size:1.06rem}:host([error]:not([error=""])){border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}:host([error]:not([error=""])[use-forms-pattern=multiple]){border-left:none}:host([error]:not([error=""])[use-forms-pattern=multiple]) .input-wrap{border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}@media screen and (min-width: 1008px){:host([error]:not([error=""])){margin-left:-0.9rem}:host([error]:not([error=""])[use-forms-pattern=multiple]) .input-wrap{margin-left:-0.9rem}}@media screen and (max-width: 1008px){:host([error]:not([error=""])[use-forms-pattern=multiple]){padding-left:0}}:host.has-error{border-left:0.25rem solid #b50909;padding-left:1rem}:host .outer-wrap{background-color:var(--vads-color-primary-lighter);border:1px solid var(--vads-color-base-light);display:block;max-width:30rem;width:100%;position:relative;margin:8px 0}:host .outer-wrap va-file-input:last-child{padding:0 8px}:host va-file-input:not(:last-child){border-bottom:1px solid var(--vads-color-white)}:host va-file-input.has-error{border-left:none;padding-left:0}@media screen and (min-width: 1008px){:host va-file-input.has-error{margin-left:0}}',VaFileInputMultipleStyle0=vaFileInputMultipleCss,VaFileInputMultiple$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.vaMultipleChange=createEvent(this,"vaMultipleChange",7),this.fileKeyCounter=0,this.additionalSlot=null,this.renderLabelOrHeader=(e,t,i)=>{const o=t?h("span",{class:"required"}," ",instance.t("required")):null;return i&&i>=1&&i<=6?h("div",{class:"label-header"},h(`h${i}`,{htmlFor:"fileInputField",part:"label",class:"label-header-tag"},e,o)):h("div",{class:"label-header"},h("span",{part:"label",class:"usa-label"},e),o)},this.hasErrors=()=>this.errors.some((e=>!!e)),this.label=void 0,this.name=void 0,this.required=!1,this.accept=void 0,this.errors=[],this.hint=void 0,this.enableAnalytics=!1,this.headerSize=void 0,this.files=[{key:0,file:null,content:null}]}findFileByKey(e){return this.files.find((t=>t.key===e))}isEmpty(){return null===this.files[0].file}setSlotContent(){const e=this.el.shadowRoot.querySelector("slot");this.additionalSlot||(this.additionalSlot=e?e.assignedElements({flatten:!0}):[]),null==e||e.remove()}getAdditionalContent(){return this.additionalSlot.map((e=>e.cloneNode(!0)))}handleChange(e,t,i){const o=e.detail.files[0];if(o){const e=this.findFileByKey(t);e.file?e.file=o:(e.file=o,e.content=this.getAdditionalContent(),this.fileKeyCounter++,this.files.push({file:null,key:this.fileKeyCounter,content:null}))}else{this.files.splice(i,1);const e=this.el.shadowRoot.querySelector("#statusMessage");e.textContent="",setTimeout((()=>{e.textContent="File removed."}),1e3)}this.vaMultipleChange.emit({files:this.files.map((e=>e.file)).filter((e=>!!e))}),this.files=Array.of(...this.files)}componentDidRender(){const e=this.el.shadowRoot.querySelectorAll("va-file-input");this.setSlotContent(),e.forEach(((e,t)=>{this.files[t].content&&this.files[t].content.forEach((t=>e.append(t)))}))}render(){const{label:e,required:t,headerSize:i,hint:o,files:r,name:s,accept:a,errors:n,enableAnalytics:l}=this,d=this.isEmpty()?"":"outer-wrap",m=this.hasErrors()?"has-error":"";return h(Host,{key:"af7427e886d01affb931a59db070773af9ec4bf6",class:m},e&&this.renderLabelOrHeader(e,t,i),o&&h("div",{key:"ed07b915f544da437498eb9cdf576e49696b2f00",class:"usa-hint",id:"input-hint-message"},o),h("div",{key:"edfb6730639935c14cac0a1354c1b2c4c8ad1cf5",class:d},h("div",{key:"daf2a66eac7cd43d46fa1fd9b68034a0f4ede021",class:"usa-sr-only","aria-live":"polite",id:"statusMessage"}),!this.isEmpty()&&h("div",{key:"2aa2b95c19f8d5f4fff169a5a0b723fdbb775c99",class:"selected-files-label"},"Selected files"),r.map(((i,r)=>h("va-file-input",{key:i.key,headless:!0,label:e,hint:o,name:`${s}-${i.key}`,accept:a,required:t,error:n[r],onVaChange:e=>this.handleChange(e,i.key,r),"enable-analytics":l})))),h("slot",{key:"66b602ad8c45c9db6debfe099ed30a8a9f5540a3"}))}get el(){return this}static get style(){return VaFileInputMultipleStyle0}},[1,"va-file-input-multiple",{label:[1],name:[1],required:[4],accept:[1],errors:[16],hint:[1],enableAnalytics:[4,"enable-analytics"],headerSize:[2,"header-size"],files:[32]}]);function defineCustomElement$1(){"undefined"!=typeof customElements&&["va-file-input-multiple","va-button","va-button-icon","va-card","va-file-input","va-icon","va-modal"].forEach((e=>{switch(e){case"va-file-input-multiple":customElements.get(e)||customElements.define(e,VaFileInputMultiple$1);break;case"va-button":customElements.get(e)||defineCustomElement$7();break;case"va-button-icon":customElements.get(e)||defineCustomElement$6();break;case"va-card":customElements.get(e)||defineCustomElement$5();break;case"va-file-input":customElements.get(e)||defineCustomElement$4();break;case"va-icon":customElements.get(e)||defineCustomElement$3();break;case"va-modal":customElements.get(e)||defineCustomElement$2()}}))}const VaFileInputMultiple=VaFileInputMultiple$1,defineCustomElement=defineCustomElement$1;export{VaFileInputMultiple,defineCustomElement};
|
|
1
|
+
import{proxyCustomElement,HTMLElement,createEvent,h,Host}from"@stencil/core/internal/client";import"./i18n-setup.js";import"./contacts.js";import{d as defineCustomElement$7}from"./va-button2.js";import{d as defineCustomElement$6}from"./va-button-icon2.js";import{d as defineCustomElement$5}from"./va-card2.js";import{d as defineCustomElement$4}from"./va-file-input2.js";import{d as defineCustomElement$3}from"./va-icon2.js";import{d as defineCustomElement$2}from"./va-modal2.js";import{i as instance}from"./i18next.js";const vaFileInputMultipleCss='button:not([disabled]):focus,select:not([disabled]):focus,a:not([disabled]):focus,h1:focus,input:not([disabled]):focus,textarea:not([disabled]):focus,#form-question [role=\'option\']:focus{outline:2px solid var(--vads-color-action-focus-on-light);outline-offset:2px}h1{margin-top:0}h1,h2,h3,h4,h5,h6{margin-bottom:0;margin-top:0;clear:both}*+h1,*+h2,*+h3,*+h4,*+h5,*+h6{margin-top:1.5em}h1+*,h2+*,h3+*,h4+*,h5+*,h6+*{margin-top:1em}h1{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:2.44rem;line-height:1.2;font-weight:700}h2{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:1.95rem;line-height:1.2;font-weight:700}h3{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:1.34rem;line-height:1.2;font-weight:700}h4{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:0.98rem;line-height:1.2;font-weight:700}h5{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:0.91rem;line-height:1.2;font-weight:700}h6{font-family:Source Sans Pro Web, Helvetica Neue, Helvetica, Roboto, Arial, sans-serif;font-size:0.87rem;line-height:1.1;font-weight:normal;letter-spacing:0.025em;text-transform:uppercase}h1,h2,h3,h4,h5{font-family:Bitter, Georgia, Cambria, "Times New Roman", Times, serif;font-weight:700}h6{font-family:"Source Sans Pro", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;font-weight:700}h1{margin-top:0;font-size:2.5rem}h2{font-size:1.875rem}h3{font-size:1.25rem}h4{font-size:1.0625rem}h5{font-size:0.9375rem}h6{font-size:0.9375rem}@media (max-width: 481px){h1{font-size:30px}h2{font-size:24px}}h6{margin:0.5em 0 0;text-transform:none;font-weight:700}@media (max-width: 481px){h1{font-size:30px}h2{font-size:24px}}h6{margin:0.5em 0 0;text-transform:none;font-weight:700}:host legend :is(h1,h2,h3,h4,h5,h6),:host label :is(h1,h2,h3,h4,h5,h6){display:inline;margin:0px}:host legend :is(h1,h2,h3,h4,h5),:host label :is(h1,h2,h3,h4,h5){font-family:var(--font-serif)}:host h1+*,:host h2+*,:host h3+*,:host h4+*,:host h5+*,:host h6+*{margin-top:unset}:host #form-question{margin-bottom:1rem}@import \'~@department-of-veterans-affairs/css-library/dist/stylesheets/base/headings.css\';:host legend :is(h1,h2,h3,h4,h5,h6),:host label :is(h1,h2,h3,h4,h5,h6){display:inline;margin:0px}:host legend :is(h1,h2,h3,h4,h5),:host label :is(h1,h2,h3,h4,h5){font-family:var(--font-serif)}:host h1+*,:host h2+*,:host h3+*,:host h4+*,:host h5+*,:host h6+*{margin-top:unset}:host #form-question{margin-bottom:1rem}.usa-hint{font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:1.3}.usa-label{font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:1.3;display:block;font-weight:normal;margin-top:1.5rem;max-width:30rem}.usa-label--error{font-weight:700;margin-top:0}.usa-label--required{color:#b50909}.usa-hint{color:#71767a}.usa-hint--required{color:#b50909}.usa-sr-only{position:absolute;left:-999em;right:auto}.usa-error-message{padding-bottom:0.25rem;padding-top:0.25rem;color:#b50909;display:block;font-weight:700}.usa-error-message{font-size:1.06rem}:host([error]:not([error=""])){border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}:host([error]:not([error=""])[use-forms-pattern=multiple]){border-left:none}:host([error]:not([error=""])[use-forms-pattern=multiple]) .input-wrap{border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}@media screen and (min-width: 1008px){:host([error]:not([error=""])){margin-left:-0.9rem}:host([error]:not([error=""])[use-forms-pattern=multiple]) .input-wrap{margin-left:-0.9rem}}@media screen and (max-width: 1008px){:host([error]:not([error=""])[use-forms-pattern=multiple]){padding-left:0}}[hidden]{display:none}:host{display:block;font-family:var(--font-source-sans);font-size:16.96px;}:host .label-header{color:var(--vads-color-base);font-weight:var(--font-weight-normal)}:host .label-header-tag{margin:0;display:inline-block}:host .file-input-wrapper{display:block;max-width:30rem;width:100%;position:relative;margin:8px 0}:host .file-input{cursor:pointer;height:100%;width:100%;max-width:none;top:0;left:0;z-index:1;margin:0;position:absolute;text-indent:-999em;-webkit-box-sizing:border-box;box-sizing:border-box}:host .file-input-target{border:1px dashed var(--vads-color-action-border-base-active-on-dark);display:block;margin-top:0.3125rem;position:relative;text-align:center;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}:host .file-input-target.file-input-target-error{border:2px dashed var(--vads-color-secondary-dark)}:host .file-input-box{background:var(--vads-color-white);height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:2}:host .file-input-instructions{font-size:1.06rem;padding:1.25rem 0.625rem;pointer-events:none;position:relative;z-index:3}:host .file-input-choose-text{color:var(--vads-color-link);text-decoration:underline;font-weight:var(--font-weight-normal)}:host .file-icon{color:var(--vads-color-primary-alt-darkest)}:host .selected-files-wrapper{background-color:var(--vads-color-primary-lighter);border:1px solid var(--vads-color-base-light)}:host .selected-files-label{color:var(--vads-color-base);font-weight:var(--font-weight-bold);font-size:1.06rem;border-bottom:1px solid var(--vads-color-white);margin-bottom:8px;padding:8px}:host .va-card{margin:8px}:host .file-label{color:var(--vads-color-base);font-weight:var(--font-weight-bold);font-size:1.06rem;padding:0 8px;display:block;width:100%;word-wrap:break-word;word-break:break-word;overflow:hidden}:host #input-error-message{padding:0 8px;width:100%}:host .file-size-label{color:var(--vads-color-base-dark);font-weight:var(--font-weight-normal);font-size:1.06rem;padding:0 8px;display:block}:host .file-info-section{border-bottom:1px solid var(--vads-color-base-lighter);padding:0 8px 8px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .file-button-section{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-direction:row;flex-direction:row}:host .file-button-section>va-button-icon{font-size:1.06rem}@media screen and (max-width: 481px){:host .file-button-section{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start}}:host .additional-info-slot{padding-bottom:16px}:host .vads-u-line-height--2{line-height:1.15}:host .thumbnail-container{height:40px;width:40px;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}:host .thumbnail-preview{max-width:40px;width:auto;max-height:40px;height:auto}:host .thumbnail-error{color:#b21d38}:host(.has-error){border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}@media screen and (min-width: 1008px){:host(.has-error){margin-left:-0.9rem}}.required{color:var(--vads-color-secondary-dark);margin-left:0.25rem}.usa-error-message{font-size:1.06rem}:host([error]:not([error=""])){border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}:host([error]:not([error=""])[use-forms-pattern=multiple]){border-left:none}:host([error]:not([error=""])[use-forms-pattern=multiple]) .input-wrap{border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}@media screen and (min-width: 1008px){:host([error]:not([error=""])){margin-left:-0.9rem}:host([error]:not([error=""])[use-forms-pattern=multiple]) .input-wrap{margin-left:-0.9rem}}@media screen and (max-width: 1008px){:host([error]:not([error=""])[use-forms-pattern=multiple]){padding-left:0}}:host.has-error{border-left:0.25rem solid #b50909;padding-left:1rem}:host .outer-wrap{background-color:var(--vads-color-primary-lighter);border:1px solid var(--vads-color-base-light);display:block;max-width:30rem;width:100%;position:relative;margin:8px 0}:host .outer-wrap va-file-input:last-child{padding:0 8px}:host va-file-input:not(:last-child){border-bottom:1px solid var(--vads-color-white)}:host va-file-input.has-error{border-left:none;padding-left:0}@media screen and (min-width: 1008px){:host va-file-input.has-error{margin-left:0}}',VaFileInputMultipleStyle0=vaFileInputMultipleCss,VaFileInputMultiple$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.vaMultipleChange=createEvent(this,"vaMultipleChange",7),this.fileKeyCounter=0,this.additionalSlot=null,this.additionalFileUploadMessage=h("span",null,"Drag an additional file here or"," ",h("span",{class:"file-input-choose-text"},"choose from folder")),this.renderLabelOrHeader=(e,t,i)=>{const o=t?h("span",{class:"required"}," ",instance.t("required")):null;return i&&i>=1&&i<=6?h("div",{class:"label-header"},h(`h${i}`,{htmlFor:"fileInputField",part:"label",class:"label-header-tag"},e,o)):h("div",{class:"label-header"},h("span",{part:"label",class:"usa-label"},e),o)},this.hasErrors=()=>this.errors.some((e=>!!e)),this.label=void 0,this.name=void 0,this.required=!1,this.accept=void 0,this.errors=[],this.hint=void 0,this.enableAnalytics=!1,this.headerSize=void 0,this.files=[{key:0,file:null,content:null}]}findFileByKey(e){return this.files.find((t=>t.key===e))}isEmpty(){return null===this.files[0].file}setSlotContent(){const e=this.el.shadowRoot.querySelector("slot");this.additionalSlot||(this.additionalSlot=e?e.assignedElements({flatten:!0}):[]),null==e||e.remove()}getAdditionalContent(){return this.additionalSlot.map((e=>e.cloneNode(!0)))}handleChange(e,t,i){const o=e.detail.files[0];if(o){const e=this.findFileByKey(t);e.file?e.file=o:(e.file=o,e.content=this.getAdditionalContent(),this.fileKeyCounter++,this.files.push({file:null,key:this.fileKeyCounter,content:null}))}else{this.files.splice(i,1);const e=this.el.shadowRoot.querySelector("#statusMessage");e.textContent="",setTimeout((()=>{e.textContent="File removed."}),1e3)}this.vaMultipleChange.emit({files:this.files.map((e=>e.file)).filter((e=>!!e))}),this.files=Array.of(...this.files)}componentDidRender(){const e=this.el.shadowRoot.querySelectorAll("va-file-input");this.setSlotContent(),e.forEach(((e,t)=>{this.files[t].content&&this.files[t].content.forEach((t=>e.append(t)))}))}render(){const{label:e,required:t,headerSize:i,hint:o,files:r,name:s,accept:a,errors:n,enableAnalytics:l}=this,d=this.isEmpty()?"":"outer-wrap",m=this.hasErrors()?"has-error":"";return h(Host,{key:"a8a817cb7e2718f6c6bcdf31503af729867fc552",class:m},e&&this.renderLabelOrHeader(e,t,i),o&&h("div",{key:"77fb6bbd6e452c8abf85388e00d1ebb3bb701183",class:"usa-hint",id:"input-hint-message"},o),h("div",{key:"cce39ee8e2ace984ea161e5d5feaeffe9840e018",class:d},h("div",{key:"46a6193ea81f4fa47f6b72d665500a8b635cbe5d",class:"usa-sr-only","aria-live":"polite",id:"statusMessage"}),!this.isEmpty()&&h("div",{key:"25daac841e11efb380dd92649e8fa3af5a0eb4c2",class:"selected-files-label"},"Selected files"),r.map(((i,r)=>h("va-file-input",Object.assign({key:i.key,headless:!0,label:e,hint:o,name:`${s}-${i.key}`,accept:a,required:t},r>0?{uploadMessage:this.additionalFileUploadMessage}:{},{error:n[r],onVaChange:e=>this.handleChange(e,i.key,r),"enable-analytics":l}))))),h("slot",{key:"70f3d447cf4a89237ad1d4a771895be79354bdd8"}))}get el(){return this}static get style(){return VaFileInputMultipleStyle0}},[1,"va-file-input-multiple",{label:[1],name:[1],required:[4],accept:[1],errors:[16],hint:[1],enableAnalytics:[4,"enable-analytics"],headerSize:[2,"header-size"],files:[32]}]);function defineCustomElement$1(){"undefined"!=typeof customElements&&["va-file-input-multiple","va-button","va-button-icon","va-card","va-file-input","va-icon","va-modal"].forEach((e=>{switch(e){case"va-file-input-multiple":customElements.get(e)||customElements.define(e,VaFileInputMultiple$1);break;case"va-button":customElements.get(e)||defineCustomElement$7();break;case"va-button-icon":customElements.get(e)||defineCustomElement$6();break;case"va-card":customElements.get(e)||defineCustomElement$5();break;case"va-file-input":customElements.get(e)||defineCustomElement$4();break;case"va-icon":customElements.get(e)||defineCustomElement$3();break;case"va-modal":customElements.get(e)||defineCustomElement$2()}}))}const VaFileInputMultiple=VaFileInputMultiple$1,defineCustomElement=defineCustomElement$1;export{VaFileInputMultiple,defineCustomElement};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement,HTMLElement,createEvent,h,Host,Fragment}from"@stencil/core/internal/client";import"./i18n-setup.js";import"./contacts.js";import{s as selectOrMatches,S as Sanitizer}from"./utils.js";import{d as defineCustomElement$5}from"./va-button2.js";import{d as defineCustomElement$4}from"./va-button-icon2.js";import{d as defineCustomElement$3}from"./va-card2.js";import{d as defineCustomElement$2}from"./va-icon2.js";import{d as defineCustomElement$1}from"./va-modal2.js";import{i as instance}from"./i18next.js";const PREFIX="usa",DROPZONE_CLASS="usa-file-input",DROPZONE=".usa-file-input",INPUT_CLASS="usa-file-input__input",TARGET_CLASS="usa-file-input__target",INPUT=`.${INPUT_CLASS}`,BOX_CLASS="usa-file-input__box",INSTRUCTIONS_CLASS="usa-file-input__instructions",PREVIEW_CLASS="usa-file-input__preview",PREVIEW_HEADING_CLASS="usa-file-input__preview-heading",DISABLED_CLASS="usa-file-input--disabled",CHOOSE_CLASS="usa-file-input__choose",ACCEPTED_FILE_MESSAGE_CLASS="usa-file-input__accepted-files-message",DRAG_TEXT_CLASS="usa-file-input__drag-text",DRAG_CLASS="usa-file-input--drag",LOADING_CLASS="is-loading",INVALID_FILE_CLASS="has-invalid-file",GENERIC_PREVIEW_CLASS_NAME="usa-file-input__preview-image",GENERIC_PREVIEW_CLASS="usa-file-input__preview-image--generic",PDF_PREVIEW_CLASS="usa-file-input__preview-image--pdf",WORD_PREVIEW_CLASS="usa-file-input__preview-image--word",VIDEO_PREVIEW_CLASS="usa-file-input__preview-image--video",EXCEL_PREVIEW_CLASS="usa-file-input__preview-image--excel",SR_ONLY_CLASS="usa-sr-only",SPACER_GIF="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";let TYPE_IS_VALID=Boolean(!0),DEFAULT_ARIA_LABEL_TEXT="",DEFAULT_FILE_STATUS_TEXT="";const getFileInputContext=e=>{const t=e.closest(DROPZONE);if(!t)throw new Error(`Element is missing outer ${DROPZONE}`);const i=t.querySelector(INPUT);return{dropZoneEl:t,inputEl:i}},disable=e=>{const{dropZoneEl:t,inputEl:i}=getFileInputContext(e);i.disabled=!0,t.classList.add(DISABLED_CLASS)},ariaDisable=e=>{const{dropZoneEl:t}=getFileInputContext(e);t.classList.add(DISABLED_CLASS)},enable=e=>{const{dropZoneEl:t,inputEl:i}=getFileInputContext(e);i.disabled=!1,t.classList.remove(DISABLED_CLASS),t.removeAttribute("aria-disabled")},replaceName=e=>{const t=e.charCodeAt(0);return 32===t?"-":t>=65&&t<=90?`img_${e.toLowerCase()}`:`__000${t.toString(16).slice(-4)}`},makeSafeForID=e=>e.replace(/[^a-z0-9]/g,replaceName),createUniqueID=e=>`${e}-${Math.floor(Date.now()/1e3)}`,getItemsLabel=e=>e.hasAttribute("multiple")?"files":"file",createTargetArea=e=>{const t=document.createElement("div"),i=document.createElement("div"),a=document.createElement("div");return e.classList.remove(DROPZONE_CLASS),e.classList.add(INPUT_CLASS),t.classList.add(DROPZONE_CLASS),a.classList.add(BOX_CLASS),i.classList.add(TARGET_CLASS),i.prepend(a),e.parentNode.insertBefore(i,e),e.parentNode.insertBefore(t,i),i.appendChild(e),t.appendChild(i),i},createVisibleInstructions=e=>{const t=e.closest(DROPZONE),i=getItemsLabel(e),a=document.createElement("div"),s=`Drag ${i} here or`,o="choose from folder";return DEFAULT_ARIA_LABEL_TEXT=`${s} ${o}`,a.classList.add(INSTRUCTIONS_CLASS),a.setAttribute("aria-hidden","true"),e.setAttribute("aria-label",DEFAULT_ARIA_LABEL_TEXT),a.innerHTML=Sanitizer.escapeHTML(`<span class="${DRAG_TEXT_CLASS}">${s}</span> <span class="${CHOOSE_CLASS}">${o}</span>`),e.parentNode.insertBefore(a,e),(/rv:11.0/i.test(navigator.userAgent)||/Edge\/\d./i.test(navigator.userAgent))&&(t.querySelector(`.${DRAG_TEXT_CLASS}`).outerHTML=""),a},createSROnlyStatus=e=>{const t=document.createElement("div"),i=getItemsLabel(e),a=e.closest(DROPZONE),s=e.closest(`.${TARGET_CLASS}`);DEFAULT_FILE_STATUS_TEXT=`No ${i} selected.`,t.classList.add("usa-sr-only"),t.setAttribute("aria-live","polite"),t.textContent=DEFAULT_FILE_STATUS_TEXT,a.insertBefore(t,s)},enhanceFileInput=e=>{const t=e.hasAttribute("aria-disabled")||e.hasAttribute("disabled"),i=createTargetArea(e),a=createVisibleInstructions(e),{dropZoneEl:s}=getFileInputContext(e);return t?s.classList.add(DISABLED_CLASS):createSROnlyStatus(e),{instructions:a,dropTarget:i}},removeOldPreviews=(e,t)=>{const i=e.querySelectorAll(`.${PREVIEW_CLASS}`),a=e.querySelector(`.${PREVIEW_HEADING_CLASS}`),s=e.querySelector(`.${ACCEPTED_FILE_MESSAGE_CLASS}`);a&&(a.outerHTML=""),s&&(s.outerHTML="",e.classList.remove("has-invalid-file")),null!==i&&(t&&t.removeAttribute("hidden"),Array.prototype.forEach.call(i,(e=>{e.parentNode.removeChild(e)})))},updateStatusMessage=(e,t,i)=>{const a=e;let s=DEFAULT_FILE_STATUS_TEXT;1===t.length?s=`You have selected the file: ${i}`:t.length>1&&(s=`You have selected ${t.length} files: ${i.join(", ")}`),setTimeout((()=>{a.textContent=s}),1e3)},addPreviewHeading=(e,t)=>{const i=document.createElement("div"),a=e.closest(`.${TARGET_CLASS}`),s=a.querySelector(`.${INSTRUCTIONS_CLASS}`);let o="Change file",n="";1===t.length?n=Sanitizer.escapeHTML(`Selected file <span class="usa-file-input__choose">${o}</span>`):t.length>1&&(o="Change files",n=Sanitizer.escapeHTML(`${t.length} files selected <span class="usa-file-input__choose">${o}</span>`)),s.setAttribute("hidden","true"),i.classList.add(PREVIEW_HEADING_CLASS),i.innerHTML=n,a.insertBefore(i,s),e.setAttribute("aria-label",o)},handleChange=(e,t,i,a)=>{const s=t.getAttribute("multiple")?e.target.files:[e.target.files[0]],o=a.closest(".usa-file-input").querySelector(".usa-sr-only"),n=[];removeOldPreviews(a,i);for(let e=0;e<s.length;e+=1){const t=new FileReader,o=s[e].name;let r;n.push(o),t.onloadstart=function(){var e;e=o.replace(/[^a-z0-9]/g,replaceName),r=`${e}-${Math.floor(Date.now()/1e3)}`,i.insertAdjacentHTML("afterend",Sanitizer.escapeHTML(`<div class="${PREVIEW_CLASS}" aria-hidden="true">\n <img id="${r}" src="${SPACER_GIF}" alt="" class="usa-file-input__preview-image is-loading"/>${o}\n <div>`))},t.onloadend=function(){const e=a.querySelector(`#${r}`);o.indexOf(".pdf")>0?e.setAttribute("onerror",`this.onerror=null;this.src="${SPACER_GIF}"; this.classList.add("${PDF_PREVIEW_CLASS}")`):o.indexOf(".doc")>0||o.indexOf(".pages")>0?e.setAttribute("onerror",`this.onerror=null;this.src="${SPACER_GIF}"; this.classList.add("${WORD_PREVIEW_CLASS}")`):o.indexOf(".xls")>0||o.indexOf(".numbers")>0?e.setAttribute("onerror",`this.onerror=null;this.src="${SPACER_GIF}"; this.classList.add("${EXCEL_PREVIEW_CLASS}")`):o.indexOf(".mov")>0||o.indexOf(".mp4")>0?e.setAttribute("onerror",`this.onerror=null;this.src="${SPACER_GIF}"; this.classList.add("${VIDEO_PREVIEW_CLASS}")`):e.setAttribute("onerror",`this.onerror=null;this.src="${SPACER_GIF}"; this.classList.add("${GENERIC_PREVIEW_CLASS}")`),e.classList.remove("is-loading"),e.src=t.result},s[e]&&t.readAsDataURL(s[e])}0===s.length?t.setAttribute("aria-label",DEFAULT_ARIA_LABEL_TEXT):addPreviewHeading(t,s),updateStatusMessage(o,s,n)},preventInvalidFiles=(e,t,i,a)=>{const s=t.getAttribute("accept");a.classList.remove("has-invalid-file");const o=(e,t)=>{let i=!1;return e.indexOf(t)>=0&&(i=!0),i};if(s){const n=s.split(","),r=document.createElement("div");let l=!0;const d=e.target.files||e.dataTransfer.files;for(let e=0;e<d.length;e+=1){const t=d[e];if(!l)break;for(let e=0;e<n.length;e+=1){const i=n[e];if(l=t.name.indexOf(i)>0||o(t.type,i.replace(/\*/g,"")),l){TYPE_IS_VALID=!0;break}}}l||(removeOldPreviews(a,i),t.value="",a.insertBefore(r,t),r.textContent=t.dataset.errormessage||"This is not a valid file type.",r.classList.add(ACCEPTED_FILE_MESSAGE_CLASS),a.classList.add("has-invalid-file"),TYPE_IS_VALID=!1,e.preventDefault(),e.stopPropagation())}},handleUpload=(e,t,i,a)=>{preventInvalidFiles(e,t,i,a),!0===TYPE_IS_VALID&&handleChange(e,t,i,a)},fileInput={init(e){selectOrMatches(DROPZONE,e).forEach((e=>{const{instructions:t,dropTarget:i}=enhanceFileInput(e);i.addEventListener("dragover",(function(){this.classList.add(DRAG_CLASS)}),!1),i.addEventListener("dragleave",(function(){this.classList.remove(DRAG_CLASS)}),!1),i.addEventListener("drop",(function(a){a.preventDefault(),this.classList.remove(DRAG_CLASS);const s=a.dataTransfer;if(a.target.files=s.files,s.files.length>1)return;handleUpload(a,e,t,i);const o=new CustomEvent("change",{detail:{files:s.files}});e.dispatchEvent(o)}),!1),e.addEventListener("input",(a=>handleUpload(a,e,t,i)),!1)}))},teardown(e){selectOrMatches(INPUT,e).forEach((e=>{const t=e.parentElement.parentElement;t.parentElement.replaceChild(e,t),e.className=DROPZONE_CLASS}))},getFileInputContext:getFileInputContext,disable:disable,ariaDisable:ariaDisable,enable:enable},extensionToMimeType={".txt":"text/plain",".pdf":"application/pdf",".doc":"application/msword",".docx":"application/vnd.openxmlformats-officedocument.wordprocessingml.document",".odt":"application/vnd.oasis.opendocument.text",".rtf":"application/rtf",".csv":"text/csv",".xls":"application/vnd.ms-excel",".xlsx":"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",".ppt":"application/vnd.ms-powerpoint",".pptx":"application/vnd.openxmlformats-officedocument.presentationml.presentation",".jpg":"image/jpeg",".jpeg":"image/jpeg",".png":"image/png",".gif":"image/gif",".bmp":"image/bmp",".webp":"image/webp",".tif":"image/tiff",".tiff":"image/tiff",".svg":"image/svg+xml",".mp3":"audio/mpeg",".wav":"audio/wav",".ogg":"audio/ogg",".m4a":"audio/mp4",".aac":"audio/aac",".mp4":"video/mp4",".avi":"video/x-msvideo",".mov":"video/quicktime",".wmv":"video/x-ms-wmv",".flv":"video/x-flv",".mkv":"video/x-matroska",".webm":"video/webm",".zip":"application/zip",".rar":"application/x-rar-compressed",".7z":"application/x-7z-compressed",".tar":"application/x-tar",".gz":"application/gzip",".json":"application/json",".xml":"application/xml",".html":"text/html",".htm":"text/html",".css":"text/css",".js":"application/javascript"},vaFileInputCss='button:not([disabled]):focus,select:not([disabled]):focus,a:not([disabled]):focus,h1:focus,input:not([disabled]):focus,textarea:not([disabled]):focus,#form-question [role=\'option\']:focus{outline:2px solid var(--vads-color-action-focus-on-light);outline-offset:2px}h1{margin-top:0}h1,h2,h3,h4,h5,h6{margin-bottom:0;margin-top:0;clear:both}*+h1,*+h2,*+h3,*+h4,*+h5,*+h6{margin-top:1.5em}h1+*,h2+*,h3+*,h4+*,h5+*,h6+*{margin-top:1em}h1{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:2.44rem;line-height:1.2;font-weight:700}h2{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:1.95rem;line-height:1.2;font-weight:700}h3{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:1.34rem;line-height:1.2;font-weight:700}h4{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:0.98rem;line-height:1.2;font-weight:700}h5{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:0.91rem;line-height:1.2;font-weight:700}h6{font-family:Source Sans Pro Web, Helvetica Neue, Helvetica, Roboto, Arial, sans-serif;font-size:0.87rem;line-height:1.1;font-weight:normal;letter-spacing:0.025em;text-transform:uppercase}h1,h2,h3,h4,h5{font-family:Bitter, Georgia, Cambria, "Times New Roman", Times, serif;font-weight:700}h6{font-family:"Source Sans Pro", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;font-weight:700}h1{margin-top:0;font-size:2.5rem}h2{font-size:1.875rem}h3{font-size:1.25rem}h4{font-size:1.0625rem}h5{font-size:0.9375rem}h6{font-size:0.9375rem}@media (max-width: 481px){h1{font-size:30px}h2{font-size:24px}}h6{margin:0.5em 0 0;text-transform:none;font-weight:700}@media (max-width: 481px){h1{font-size:30px}h2{font-size:24px}}h6{margin:0.5em 0 0;text-transform:none;font-weight:700}:host legend :is(h1,h2,h3,h4,h5,h6),:host label :is(h1,h2,h3,h4,h5,h6){display:inline;margin:0px}:host legend :is(h1,h2,h3,h4,h5),:host label :is(h1,h2,h3,h4,h5){font-family:var(--font-serif)}:host h1+*,:host h2+*,:host h3+*,:host h4+*,:host h5+*,:host h6+*{margin-top:unset}:host #form-question{margin-bottom:1rem}.usa-hint{font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:1.3}.usa-label{font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:1.3;display:block;font-weight:normal;margin-top:1.5rem;max-width:30rem}.usa-label--error{font-weight:700;margin-top:0}.usa-label--required{color:#b50909}.usa-hint{color:#71767a}.usa-hint--required{color:#b50909}.usa-sr-only{position:absolute;left:-999em;right:auto}.usa-error-message{padding-bottom:0.25rem;padding-top:0.25rem;color:#b50909;display:block;font-weight:700}.usa-error-message{font-size:1.06rem}:host([error]:not([error=""])){border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}:host([error]:not([error=""])[use-forms-pattern=multiple]){border-left:none}:host([error]:not([error=""])[use-forms-pattern=multiple]) .input-wrap{border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}@media screen and (min-width: 1008px){:host([error]:not([error=""])){margin-left:-0.9rem}:host([error]:not([error=""])[use-forms-pattern=multiple]) .input-wrap{margin-left:-0.9rem}}@media screen and (max-width: 1008px){:host([error]:not([error=""])[use-forms-pattern=multiple]){padding-left:0}}[hidden]{display:none}:host{display:block;font-family:var(--font-source-sans);font-size:16.96px;}:host .label-header{color:var(--vads-color-base);font-weight:var(--font-weight-normal)}:host .label-header-tag{margin:0;display:inline-block}:host .file-input-wrapper{display:block;max-width:30rem;width:100%;position:relative;margin:8px 0}:host .file-input{cursor:pointer;height:100%;width:100%;max-width:none;top:0;left:0;z-index:1;margin:0;position:absolute;text-indent:-999em;-webkit-box-sizing:border-box;box-sizing:border-box}:host .file-input-target{border:1px dashed var(--vads-color-action-border-base-active-on-dark);display:block;margin-top:0.3125rem;position:relative;text-align:center;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}:host .file-input-target.file-input-target-error{border:2px dashed var(--vads-color-secondary-dark)}:host .file-input-box{background:var(--vads-color-white);height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:2}:host .file-input-instructions{font-size:1.06rem;padding:1.25rem 0.625rem;pointer-events:none;position:relative;z-index:3}:host .file-input-choose-text{color:var(--vads-color-link);text-decoration:underline;font-weight:var(--font-weight-normal)}:host .file-icon{color:var(--vads-color-primary-alt-darkest)}:host .selected-files-wrapper{background-color:var(--vads-color-primary-lighter);border:1px solid var(--vads-color-base-light)}:host .selected-files-label{color:var(--vads-color-base);font-weight:var(--font-weight-bold);font-size:1.06rem;border-bottom:1px solid var(--vads-color-white);margin-bottom:8px;padding:8px}:host .va-card{margin:8px}:host .file-label{color:var(--vads-color-base);font-weight:var(--font-weight-bold);font-size:1.06rem;padding:0 8px;display:block;width:100%;word-wrap:break-word;word-break:break-word;overflow:hidden}:host #input-error-message{padding:0 8px;width:100%}:host .file-size-label{color:var(--vads-color-base-dark);font-weight:var(--font-weight-normal);font-size:1.06rem;padding:0 8px;display:block}:host .file-info-section{border-bottom:1px solid var(--vads-color-base-lighter);padding:0 8px 8px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .file-button-section{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-direction:row;flex-direction:row}:host .file-button-section>va-button-icon{font-size:1.06rem}@media screen and (max-width: 481px){:host .file-button-section{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start}}:host .additional-info-slot{padding-bottom:16px}:host .vads-u-line-height--2{line-height:1.15}:host .thumbnail-container{height:40px;width:40px;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}:host .thumbnail-preview{max-width:40px;width:auto;max-height:40px;height:auto}:host .thumbnail-error{color:#b21d38}:host(.has-error){border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}@media screen and (min-width: 1008px){:host(.has-error){margin-left:-0.9rem}}.required{color:var(--vads-color-secondary-dark);margin-left:0.25rem}',VaFileInputStyle0=vaFileInputCss,VaFileInput=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.vaChange=createEvent(this,"vaChange",7),this.componentLibraryAnalytics=createEvent(this,"component-library-analytics",7),this.uploadStatus="idle",this.handleChange=e=>{const t=e.target;t.files&&t.files.length>0&&this.handleFile(t.files[0]),t.value=""},this.handleDrop=e=>{e.preventDefault(),e.stopPropagation();const t=e.dataTransfer.files;t.length>0&&this.handleFile(t[0])},this.handleFile=e=>{if(this.accept){const t=this.normalizeAcceptProp(this.accept);if(!this.isAcceptedFileType(e.type,t))return this.removeFile(!1),void(this.internalError="This is not a valid file type.")}this.file=e,this.vaChange.emit({files:[this.file]}),this.uploadStatus="success",this.internalError=null,this.generateFileContents(this.file),this.updateStatusMessage(`You have selected the file: ${this.file.name}`),this.el.focus(),this.enableAnalytics&&this.componentLibraryAnalytics.emit({componentName:"va-file-input",action:"change",details:{label:this.label}})},this.removeFile=(e=!0)=>{this.closeModal(),this.uploadStatus="idle",this.internalError=null,e&&this.vaChange.emit({files:[]}),this.file=null,this.updateStatusMessage("File removed. No file selected."),this.el.focus()},this.openModal=()=>{this.el.shadowRoot.querySelector("va-modal").setAttribute("status","warning"),this.showModal=!0},this.closeModal=()=>{this.showModal=!1,setTimeout((()=>{this.fileInputRef.focus()}),0)},this.closeModalAndKeepFile=()=>{this.showModal=!1,setTimeout((()=>{var e;null===(e=this.el.shadowRoot.querySelector("#delete"))||void 0===e||e.shadowRoot.querySelector("button").focus()}),0)},this.changeFile=()=>{this.fileInputRef&&this.fileInputRef.click()},this.formatFileSize=e=>{const t=["B","KB","MB","GB","TB"];if(0===e)return"0 B";const i=Math.floor(Math.log(e)/Math.log(1024));return 0===i?`${e} ${t[i]}`:`${(e/Math.pow(1024,i)).toFixed(i<2?0:1)} ${t[i]}`},this.normalizeAcceptProp=e=>e.split(",").map((e=>(e=e.trim()).startsWith(".")?extensionToMimeType[e]:e)),this.isAcceptedFileType=(e,t)=>{for(const i of t){if(i===e)return!0;if(i.endsWith("/*")&&e.startsWith(i.slice(0,-1)))return!0}return!1},this.renderLabelOrHeader=(e,t,i)=>{const a=t?h("span",{class:"required"}," ",instance.t("required")):null;return h("div",{class:"label-header"},i&&i>=1&&i<=6?h(`h${i}`,{htmlFor:"fileInputField",part:"label",class:"label-header-tag"},e,a):h("label",{htmlFor:"fileInputField",part:"label",class:"usa-label"},e,a))},this.file=void 0,this.fileContents=void 0,this.internalError=void 0,this.showModal=!1,this.label=void 0,this.name=void 0,this.buttonText=void 0,this.required=!1,this.accept=void 0,this.error=void 0,this.hint=void 0,this.enableAnalytics=!1,this.headerSize=void 0,this.headless=!1}updateStatusMessage(e){setTimeout((()=>{const t=this.el.shadowRoot.querySelector("#statusMessage");t&&(t.textContent=e)}),1e3)}generateFileContents(e){if(!e)return;const t=new FileReader;this.fileType=e.type,t.onloadend=()=>{this.fileContents=t.result},this.fileType&&("application/pdf"===this.fileType||this.fileType.startsWith("image/"))&&t.readAsDataURL(e)}componentDidLoad(){fileInput.init(this.el)}connectedCallback(){this.el.addEventListener("change",this.handleChange)}disconnectedCallback(){this.el.removeEventListener("change",this.handleChange)}render(){const{label:e,name:t,required:i,accept:a,error:s,hint:o,file:n,uploadStatus:r,headerSize:l,fileContents:d,fileType:c,headless:f}=this,p=this.error||this.internalError,m=`${o?"input-hint-message":""} ${p?"input-error-message":""}`.trim()||null,u=("file-input-target "+(p?"file-input-target-error":"")).trim();let b=h("div",{key:"a01e616b023996b1e430db4d555a5cfb57da40e5",class:"thumbnail-container"},h("svg",{key:"a6d59732d8473f2ed2c3fd51b6f038f0f299ae39",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 384 512",fill:"#07648d",width:"40px",height:"40px"},h("path",{key:"add0b444331deffab5324e255259f66acee5b61f",d:"M224 136V0H24C10.7 0 0 10.7 0 24v464c0 13.3 10.7 24 24 24h336c13.3 0 24-10.7 24-24V160H248c-13.2 0-24-10.8-24-24zm160-14.1v6.1H256V0h6.1c6.4 0 12.5 2.5 17 7l97.9 98c4.5 4.5 7 10.6 7 16.9z"})));s?b=h("div",{key:"33beee8e31cb693aae331274b44f9a5df9b4ed6a",class:"thumbnail-container"},h("va-icon",{key:"1f4fd0237a037cc056d91955e8c75b75634c74bc",icon:"error",size:3,class:"thumbnail-preview thumbnail-error"})):d&&(c.startsWith("image/")?b=h("div",{key:"a23e881670ca55216d6625df51050ba4183c8414",class:"thumbnail-container","aria-hidden":"true"},h("img",{key:"a81a90cf213dc62e81454de7efc629baa258a850",class:"thumbnail-preview",src:d,alt:"image"})):"application/pdf"===c&&(b=h("div",{key:"9c243dcd577b144340612cb7e4456c00fc8e83b4",class:"thumbnail-container","aria-hidden":"true"},h("object",{key:"abe62891232567a0a49cef9d12846e7efe012ecb",class:"thumbnail-preview",data:d,type:"application/pdf"}))));let g=f?"headless-selected-files-wrapper":"selected-files-wrapper";const v="usa-hint"+(f?" usa-sr-only":"");return h(Host,{key:"a4db25a88485ed629f402f02eb82578cc1e8170f",class:{"has-error":!!p}},h("span",{key:"9f261a935232ecbdf87a00fcbcc89e64d4a9bf5b",class:{"usa-sr-only":!!f}},e&&this.renderLabelOrHeader(e,i,l)),o&&h("div",{key:"d2d65b768b601e22292924ae0835817fb1df30d0",class:v,id:"input-hint-message"},o),h("div",{key:"198358215e291200de6df7998ae3f74ef8a15772",class:"file-input-wrapper",onDrop:this.handleDrop},h("input",{key:"adbb43a169d798d6781974b5ce362d1ff88d48f2",id:"fileInputField",class:"file-input",style:{visibility:"success"===this.uploadStatus?"hidden":"unset"},type:"file",ref:e=>this.fileInputRef=e,name:t,accept:a,"aria-describedby":m,onChange:this.handleChange}),"idle"===r&&h("div",{key:"8ae66fa7bc3b641ae13a62038e9a3492a04df7df"},h("span",{key:"36c7bf30c35b9713cef61a269e4e4ec41ee80e7b",id:"file-input-error-alert",role:"alert"},p&&h(Fragment,{key:"0ad1ccd9feca840ebe79d406bfd42db947396798"},h("span",{key:"1c009370c174b95954b1a143f446ef84e73480a9",class:"usa-sr-only"},instance.t("error")),h("span",{key:"b027cb5e4e52d61b6d0f7a3f639a692ce5215c26",class:"usa-error-message"},p))),h("div",{key:"74c9f6323c9f9665f7cbf28af6d859d7ab30bdcd",class:"usa-sr-only","aria-live":"polite",id:"statusMessage"}),h("div",{key:"0808a878db5ff66e295924c387c05aa36fd66829",class:u},h("div",{key:"d1446d2551b594447ab3fd3970aa805262464690",class:"file-input-box"}),h("div",{key:"93656cba26f9e4f3c31259f619fe420aa4db2239",class:"file-input-instructions"},h("span",{key:"1f7fa2649fcc4df3c74e4e115317dea3ea934501",class:"file-input-drag-text"},"Drag files here or"," "),h("span",{key:"ebe7f9449c87acfbe337233f526debb7286f46c6",class:"file-input-choose-text"},"choose from folder")))),"idle"!==r&&h("div",{key:"1ba201a6e8977f12c61e4879efff431cafe00e91",class:g},!f&&h("div",{key:"f968f10be58a63653e870e2dd98ee70024ddfa37",class:"selected-files-label"},"Selected files"),h("div",{key:"ad11ac7134af92335d6fa0b403dd341aa777d098",class:"usa-sr-only","aria-live":"polite",id:"statusMessage"}),h("va-card",{key:"3aff1f1bb0e2fb5765beb04820df1a5183f61c38",class:"va-card"},h("div",{key:"631b52dcd1e33f9c9e052b2be7c6abfb5173d922",class:"file-info-section"},b,h("div",{key:"d3e68e809269e673ef7258ed77ef456e3b0141b7",class:"file-info-group vads-u-line-height--2"},h("span",{key:"68d94c44d52375236161fee06ee84820a8e564a8",class:"file-label"},n.name),h("span",{key:"f3bb8867dc544661f8cc8c5f33d5b57908c09839",id:"input-error-message",role:"alert"},p&&h(Fragment,{key:"d73828c7e49da11c17c571fdfc2ed8c0637a119c"},h("span",{key:"20d7d2aa16fb2e02b6152d1316177c80e6bededa",class:"usa-sr-only"},instance.t("error")),h("span",{key:"a0311edf43faddc81d751fcf3b758e41036e7a77",class:"usa-error-message"},p))),h("span",{key:"b6091ec3cedae8704b0365b2f0e48bdf2a9402c9",class:"file-size-label"},this.formatFileSize(n.size)))),n&&h("div",{key:"1cdfff9d744fc368f371599b33b22f4788ef0b00"},h("div",{key:"485836e73fe72b3932fc1656702fc831ddab6de0",class:"additional-info-slot"},h("slot",{key:"808ab16d495d92879eacc120834a717823f36b37"})),h("div",{key:"a24dd3732aadc2893eefc1105b8368b224501587",class:"file-button-section"},h("va-button-icon",{key:"8c9e7751e25529f7ef7e1db65104bef01ecf5126",buttonType:"change-file",onClick:this.changeFile,label:"Change file","aria-label":"change file "+n.name}),h("va-button-icon",{key:"2bb6e989624cac3756b1e3a4f5f79ec432bc042d",id:"delete",buttonType:"delete",onClick:this.openModal,"aria-label":"delete file "+n.name,label:"Delete"})),h("va-modal",{key:"96b445468a91fc70dbd2870e3e6d3ea092675b95",modalTitle:"Delete this file?",visible:this.showModal,primaryButtonText:"Yes, remove this",secondaryButtonText:"No, keep this",onCloseEvent:this.closeModal,onPrimaryButtonClick:()=>this.removeFile(!0),onSecondaryButtonClick:this.closeModalAndKeepFile},"We'll remove the uploaded document ",h("span",{key:"877d1341cbe1ec6daba1f6d74646dd2915621d14",class:"file-label"},n.name)))))))}get el(){return this}static get style(){return VaFileInputStyle0}},[1,"va-file-input",{label:[1],name:[1],buttonText:[1,"button-text"],required:[4],accept:[1],error:[1],hint:[1],enableAnalytics:[4,"enable-analytics"],headerSize:[2,"header-size"],headless:[4],file:[32],fileContents:[32],internalError:[32],showModal:[32]}]);function defineCustomElement(){"undefined"!=typeof customElements&&["va-file-input","va-button","va-button-icon","va-card","va-icon","va-modal"].forEach((e=>{switch(e){case"va-file-input":customElements.get(e)||customElements.define(e,VaFileInput);break;case"va-button":customElements.get(e)||defineCustomElement$5();break;case"va-button-icon":customElements.get(e)||defineCustomElement$4();break;case"va-card":customElements.get(e)||defineCustomElement$3();break;case"va-icon":customElements.get(e)||defineCustomElement$2();break;case"va-modal":customElements.get(e)||defineCustomElement$1()}}))}export{VaFileInput as V,defineCustomElement as d};
|
|
1
|
+
import{proxyCustomElement,HTMLElement,createEvent,h,Host,Fragment}from"@stencil/core/internal/client";import"./i18n-setup.js";import"./contacts.js";import{s as selectOrMatches,S as Sanitizer}from"./utils.js";import{d as defineCustomElement$5}from"./va-button2.js";import{d as defineCustomElement$4}from"./va-button-icon2.js";import{d as defineCustomElement$3}from"./va-card2.js";import{d as defineCustomElement$2}from"./va-icon2.js";import{d as defineCustomElement$1}from"./va-modal2.js";import{i as instance}from"./i18next.js";const PREFIX="usa",DROPZONE_CLASS="usa-file-input",DROPZONE=".usa-file-input",INPUT_CLASS="usa-file-input__input",TARGET_CLASS="usa-file-input__target",INPUT=`.${INPUT_CLASS}`,BOX_CLASS="usa-file-input__box",INSTRUCTIONS_CLASS="usa-file-input__instructions",PREVIEW_CLASS="usa-file-input__preview",PREVIEW_HEADING_CLASS="usa-file-input__preview-heading",DISABLED_CLASS="usa-file-input--disabled",CHOOSE_CLASS="usa-file-input__choose",ACCEPTED_FILE_MESSAGE_CLASS="usa-file-input__accepted-files-message",DRAG_TEXT_CLASS="usa-file-input__drag-text",DRAG_CLASS="usa-file-input--drag",LOADING_CLASS="is-loading",INVALID_FILE_CLASS="has-invalid-file",GENERIC_PREVIEW_CLASS_NAME="usa-file-input__preview-image",GENERIC_PREVIEW_CLASS="usa-file-input__preview-image--generic",PDF_PREVIEW_CLASS="usa-file-input__preview-image--pdf",WORD_PREVIEW_CLASS="usa-file-input__preview-image--word",VIDEO_PREVIEW_CLASS="usa-file-input__preview-image--video",EXCEL_PREVIEW_CLASS="usa-file-input__preview-image--excel",SR_ONLY_CLASS="usa-sr-only",SPACER_GIF="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";let TYPE_IS_VALID=Boolean(!0),DEFAULT_ARIA_LABEL_TEXT="",DEFAULT_FILE_STATUS_TEXT="";const getFileInputContext=e=>{const t=e.closest(DROPZONE);if(!t)throw new Error(`Element is missing outer ${DROPZONE}`);const i=t.querySelector(INPUT);return{dropZoneEl:t,inputEl:i}},disable=e=>{const{dropZoneEl:t,inputEl:i}=getFileInputContext(e);i.disabled=!0,t.classList.add(DISABLED_CLASS)},ariaDisable=e=>{const{dropZoneEl:t}=getFileInputContext(e);t.classList.add(DISABLED_CLASS)},enable=e=>{const{dropZoneEl:t,inputEl:i}=getFileInputContext(e);i.disabled=!1,t.classList.remove(DISABLED_CLASS),t.removeAttribute("aria-disabled")},replaceName=e=>{const t=e.charCodeAt(0);return 32===t?"-":t>=65&&t<=90?`img_${e.toLowerCase()}`:`__000${t.toString(16).slice(-4)}`},makeSafeForID=e=>e.replace(/[^a-z0-9]/g,replaceName),createUniqueID=e=>`${e}-${Math.floor(Date.now()/1e3)}`,getItemsLabel=e=>e.hasAttribute("multiple")?"files":"file",createTargetArea=e=>{const t=document.createElement("div"),i=document.createElement("div"),a=document.createElement("div");return e.classList.remove(DROPZONE_CLASS),e.classList.add(INPUT_CLASS),t.classList.add(DROPZONE_CLASS),a.classList.add(BOX_CLASS),i.classList.add(TARGET_CLASS),i.prepend(a),e.parentNode.insertBefore(i,e),e.parentNode.insertBefore(t,i),i.appendChild(e),t.appendChild(i),i},createVisibleInstructions=e=>{const t=e.closest(DROPZONE),i=getItemsLabel(e),a=document.createElement("div"),s=`Drag ${i} here or`,o="choose from folder";return DEFAULT_ARIA_LABEL_TEXT=`${s} ${o}`,a.classList.add(INSTRUCTIONS_CLASS),a.setAttribute("aria-hidden","true"),e.setAttribute("aria-label",DEFAULT_ARIA_LABEL_TEXT),a.innerHTML=Sanitizer.escapeHTML(`<span class="${DRAG_TEXT_CLASS}">${s}</span> <span class="${CHOOSE_CLASS}">${o}</span>`),e.parentNode.insertBefore(a,e),(/rv:11.0/i.test(navigator.userAgent)||/Edge\/\d./i.test(navigator.userAgent))&&(t.querySelector(`.${DRAG_TEXT_CLASS}`).outerHTML=""),a},createSROnlyStatus=e=>{const t=document.createElement("div"),i=getItemsLabel(e),a=e.closest(DROPZONE),s=e.closest(`.${TARGET_CLASS}`);DEFAULT_FILE_STATUS_TEXT=`No ${i} selected.`,t.classList.add("usa-sr-only"),t.setAttribute("aria-live","polite"),t.textContent=DEFAULT_FILE_STATUS_TEXT,a.insertBefore(t,s)},enhanceFileInput=e=>{const t=e.hasAttribute("aria-disabled")||e.hasAttribute("disabled"),i=createTargetArea(e),a=createVisibleInstructions(e),{dropZoneEl:s}=getFileInputContext(e);return t?s.classList.add(DISABLED_CLASS):createSROnlyStatus(e),{instructions:a,dropTarget:i}},removeOldPreviews=(e,t)=>{const i=e.querySelectorAll(`.${PREVIEW_CLASS}`),a=e.querySelector(`.${PREVIEW_HEADING_CLASS}`),s=e.querySelector(`.${ACCEPTED_FILE_MESSAGE_CLASS}`);a&&(a.outerHTML=""),s&&(s.outerHTML="",e.classList.remove("has-invalid-file")),null!==i&&(t&&t.removeAttribute("hidden"),Array.prototype.forEach.call(i,(e=>{e.parentNode.removeChild(e)})))},updateStatusMessage=(e,t,i)=>{const a=e;let s=DEFAULT_FILE_STATUS_TEXT;1===t.length?s=`You have selected the file: ${i}`:t.length>1&&(s=`You have selected ${t.length} files: ${i.join(", ")}`),setTimeout((()=>{a.textContent=s}),1e3)},addPreviewHeading=(e,t)=>{const i=document.createElement("div"),a=e.closest(`.${TARGET_CLASS}`),s=a.querySelector(`.${INSTRUCTIONS_CLASS}`);let o="Change file",n="";1===t.length?n=Sanitizer.escapeHTML(`Selected file <span class="usa-file-input__choose">${o}</span>`):t.length>1&&(o="Change files",n=Sanitizer.escapeHTML(`${t.length} files selected <span class="usa-file-input__choose">${o}</span>`)),s.setAttribute("hidden","true"),i.classList.add(PREVIEW_HEADING_CLASS),i.innerHTML=n,a.insertBefore(i,s),e.setAttribute("aria-label",o)},handleChange=(e,t,i,a)=>{const s=t.getAttribute("multiple")?e.target.files:[e.target.files[0]],o=a.closest(".usa-file-input").querySelector(".usa-sr-only"),n=[];removeOldPreviews(a,i);for(let e=0;e<s.length;e+=1){const t=new FileReader,o=s[e].name;let r;n.push(o),t.onloadstart=function(){var e;e=o.replace(/[^a-z0-9]/g,replaceName),r=`${e}-${Math.floor(Date.now()/1e3)}`,i.insertAdjacentHTML("afterend",Sanitizer.escapeHTML(`<div class="${PREVIEW_CLASS}" aria-hidden="true">\n <img id="${r}" src="${SPACER_GIF}" alt="" class="usa-file-input__preview-image is-loading"/>${o}\n <div>`))},t.onloadend=function(){const e=a.querySelector(`#${r}`);o.indexOf(".pdf")>0?e.setAttribute("onerror",`this.onerror=null;this.src="${SPACER_GIF}"; this.classList.add("${PDF_PREVIEW_CLASS}")`):o.indexOf(".doc")>0||o.indexOf(".pages")>0?e.setAttribute("onerror",`this.onerror=null;this.src="${SPACER_GIF}"; this.classList.add("${WORD_PREVIEW_CLASS}")`):o.indexOf(".xls")>0||o.indexOf(".numbers")>0?e.setAttribute("onerror",`this.onerror=null;this.src="${SPACER_GIF}"; this.classList.add("${EXCEL_PREVIEW_CLASS}")`):o.indexOf(".mov")>0||o.indexOf(".mp4")>0?e.setAttribute("onerror",`this.onerror=null;this.src="${SPACER_GIF}"; this.classList.add("${VIDEO_PREVIEW_CLASS}")`):e.setAttribute("onerror",`this.onerror=null;this.src="${SPACER_GIF}"; this.classList.add("${GENERIC_PREVIEW_CLASS}")`),e.classList.remove("is-loading"),e.src=t.result},s[e]&&t.readAsDataURL(s[e])}0===s.length?t.setAttribute("aria-label",DEFAULT_ARIA_LABEL_TEXT):addPreviewHeading(t,s),updateStatusMessage(o,s,n)},preventInvalidFiles=(e,t,i,a)=>{const s=t.getAttribute("accept");a.classList.remove("has-invalid-file");const o=(e,t)=>{let i=!1;return e.indexOf(t)>=0&&(i=!0),i};if(s){const n=s.split(","),r=document.createElement("div");let l=!0;const d=e.target.files||e.dataTransfer.files;for(let e=0;e<d.length;e+=1){const t=d[e];if(!l)break;for(let e=0;e<n.length;e+=1){const i=n[e];if(l=t.name.indexOf(i)>0||o(t.type,i.replace(/\*/g,"")),l){TYPE_IS_VALID=!0;break}}}l||(removeOldPreviews(a,i),t.value="",a.insertBefore(r,t),r.textContent=t.dataset.errormessage||"This is not a valid file type.",r.classList.add(ACCEPTED_FILE_MESSAGE_CLASS),a.classList.add("has-invalid-file"),TYPE_IS_VALID=!1,e.preventDefault(),e.stopPropagation())}},handleUpload=(e,t,i,a)=>{preventInvalidFiles(e,t,i,a),!0===TYPE_IS_VALID&&handleChange(e,t,i,a)},fileInput={init(e){selectOrMatches(DROPZONE,e).forEach((e=>{const{instructions:t,dropTarget:i}=enhanceFileInput(e);i.addEventListener("dragover",(function(){this.classList.add(DRAG_CLASS)}),!1),i.addEventListener("dragleave",(function(){this.classList.remove(DRAG_CLASS)}),!1),i.addEventListener("drop",(function(a){a.preventDefault(),this.classList.remove(DRAG_CLASS);const s=a.dataTransfer;if(a.target.files=s.files,s.files.length>1)return;handleUpload(a,e,t,i);const o=new CustomEvent("change",{detail:{files:s.files}});e.dispatchEvent(o)}),!1),e.addEventListener("input",(a=>handleUpload(a,e,t,i)),!1)}))},teardown(e){selectOrMatches(INPUT,e).forEach((e=>{const t=e.parentElement.parentElement;t.parentElement.replaceChild(e,t),e.className=DROPZONE_CLASS}))},getFileInputContext:getFileInputContext,disable:disable,ariaDisable:ariaDisable,enable:enable},extensionToMimeType={".txt":"text/plain",".pdf":"application/pdf",".doc":"application/msword",".docx":"application/vnd.openxmlformats-officedocument.wordprocessingml.document",".odt":"application/vnd.oasis.opendocument.text",".rtf":"application/rtf",".csv":"text/csv",".xls":"application/vnd.ms-excel",".xlsx":"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",".ppt":"application/vnd.ms-powerpoint",".pptx":"application/vnd.openxmlformats-officedocument.presentationml.presentation",".jpg":"image/jpeg",".jpeg":"image/jpeg",".png":"image/png",".gif":"image/gif",".bmp":"image/bmp",".webp":"image/webp",".tif":"image/tiff",".tiff":"image/tiff",".svg":"image/svg+xml",".mp3":"audio/mpeg",".wav":"audio/wav",".ogg":"audio/ogg",".m4a":"audio/mp4",".aac":"audio/aac",".mp4":"video/mp4",".avi":"video/x-msvideo",".mov":"video/quicktime",".wmv":"video/x-ms-wmv",".flv":"video/x-flv",".mkv":"video/x-matroska",".webm":"video/webm",".zip":"application/zip",".rar":"application/x-rar-compressed",".7z":"application/x-7z-compressed",".tar":"application/x-tar",".gz":"application/gzip",".json":"application/json",".xml":"application/xml",".html":"text/html",".htm":"text/html",".css":"text/css",".js":"application/javascript"},vaFileInputCss='button:not([disabled]):focus,select:not([disabled]):focus,a:not([disabled]):focus,h1:focus,input:not([disabled]):focus,textarea:not([disabled]):focus,#form-question [role=\'option\']:focus{outline:2px solid var(--vads-color-action-focus-on-light);outline-offset:2px}h1{margin-top:0}h1,h2,h3,h4,h5,h6{margin-bottom:0;margin-top:0;clear:both}*+h1,*+h2,*+h3,*+h4,*+h5,*+h6{margin-top:1.5em}h1+*,h2+*,h3+*,h4+*,h5+*,h6+*{margin-top:1em}h1{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:2.44rem;line-height:1.2;font-weight:700}h2{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:1.95rem;line-height:1.2;font-weight:700}h3{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:1.34rem;line-height:1.2;font-weight:700}h4{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:0.98rem;line-height:1.2;font-weight:700}h5{font-family:Merriweather Web, Georgia, Cambria, Times New Roman, Times, serif;font-size:0.91rem;line-height:1.2;font-weight:700}h6{font-family:Source Sans Pro Web, Helvetica Neue, Helvetica, Roboto, Arial, sans-serif;font-size:0.87rem;line-height:1.1;font-weight:normal;letter-spacing:0.025em;text-transform:uppercase}h1,h2,h3,h4,h5{font-family:Bitter, Georgia, Cambria, "Times New Roman", Times, serif;font-weight:700}h6{font-family:"Source Sans Pro", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;font-weight:700}h1{margin-top:0;font-size:2.5rem}h2{font-size:1.875rem}h3{font-size:1.25rem}h4{font-size:1.0625rem}h5{font-size:0.9375rem}h6{font-size:0.9375rem}@media (max-width: 481px){h1{font-size:30px}h2{font-size:24px}}h6{margin:0.5em 0 0;text-transform:none;font-weight:700}@media (max-width: 481px){h1{font-size:30px}h2{font-size:24px}}h6{margin:0.5em 0 0;text-transform:none;font-weight:700}:host legend :is(h1,h2,h3,h4,h5,h6),:host label :is(h1,h2,h3,h4,h5,h6){display:inline;margin:0px}:host legend :is(h1,h2,h3,h4,h5),:host label :is(h1,h2,h3,h4,h5){font-family:var(--font-serif)}:host h1+*,:host h2+*,:host h3+*,:host h4+*,:host h5+*,:host h6+*{margin-top:unset}:host #form-question{margin-bottom:1rem}.usa-hint{font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:1.3}.usa-label{font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:1.3;display:block;font-weight:normal;margin-top:1.5rem;max-width:30rem}.usa-label--error{font-weight:700;margin-top:0}.usa-label--required{color:#b50909}.usa-hint{color:#71767a}.usa-hint--required{color:#b50909}.usa-sr-only{position:absolute;left:-999em;right:auto}.usa-error-message{padding-bottom:0.25rem;padding-top:0.25rem;color:#b50909;display:block;font-weight:700}.usa-error-message{font-size:1.06rem}:host([error]:not([error=""])){border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}:host([error]:not([error=""])[use-forms-pattern=multiple]){border-left:none}:host([error]:not([error=""])[use-forms-pattern=multiple]) .input-wrap{border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}@media screen and (min-width: 1008px){:host([error]:not([error=""])){margin-left:-0.9rem}:host([error]:not([error=""])[use-forms-pattern=multiple]) .input-wrap{margin-left:-0.9rem}}@media screen and (max-width: 1008px){:host([error]:not([error=""])[use-forms-pattern=multiple]){padding-left:0}}[hidden]{display:none}:host{display:block;font-family:var(--font-source-sans);font-size:16.96px;}:host .label-header{color:var(--vads-color-base);font-weight:var(--font-weight-normal)}:host .label-header-tag{margin:0;display:inline-block}:host .file-input-wrapper{display:block;max-width:30rem;width:100%;position:relative;margin:8px 0}:host .file-input{cursor:pointer;height:100%;width:100%;max-width:none;top:0;left:0;z-index:1;margin:0;position:absolute;text-indent:-999em;-webkit-box-sizing:border-box;box-sizing:border-box}:host .file-input-target{border:1px dashed var(--vads-color-action-border-base-active-on-dark);display:block;margin-top:0.3125rem;position:relative;text-align:center;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}:host .file-input-target.file-input-target-error{border:2px dashed var(--vads-color-secondary-dark)}:host .file-input-box{background:var(--vads-color-white);height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:2}:host .file-input-instructions{font-size:1.06rem;padding:1.25rem 0.625rem;pointer-events:none;position:relative;z-index:3}:host .file-input-choose-text{color:var(--vads-color-link);text-decoration:underline;font-weight:var(--font-weight-normal)}:host .file-icon{color:var(--vads-color-primary-alt-darkest)}:host .selected-files-wrapper{background-color:var(--vads-color-primary-lighter);border:1px solid var(--vads-color-base-light)}:host .selected-files-label{color:var(--vads-color-base);font-weight:var(--font-weight-bold);font-size:1.06rem;border-bottom:1px solid var(--vads-color-white);margin-bottom:8px;padding:8px}:host .va-card{margin:8px}:host .file-label{color:var(--vads-color-base);font-weight:var(--font-weight-bold);font-size:1.06rem;padding:0 8px;display:block;width:100%;word-wrap:break-word;word-break:break-word;overflow:hidden}:host #input-error-message{padding:0 8px;width:100%}:host .file-size-label{color:var(--vads-color-base-dark);font-weight:var(--font-weight-normal);font-size:1.06rem;padding:0 8px;display:block}:host .file-info-section{border-bottom:1px solid var(--vads-color-base-lighter);padding:0 8px 8px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .file-button-section{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-direction:row;flex-direction:row}:host .file-button-section>va-button-icon{font-size:1.06rem}@media screen and (max-width: 481px){:host .file-button-section{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start}}:host .additional-info-slot{padding-bottom:16px}:host .vads-u-line-height--2{line-height:1.15}:host .thumbnail-container{height:40px;width:40px;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}:host .thumbnail-preview{max-width:40px;width:auto;max-height:40px;height:auto}:host .thumbnail-error{color:#b21d38}:host(.has-error){border-left:0.25rem solid #b50909;padding-left:1rem;position:relative}@media screen and (min-width: 1008px){:host(.has-error){margin-left:-0.9rem}}.required{color:var(--vads-color-secondary-dark);margin-left:0.25rem}',VaFileInputStyle0=vaFileInputCss,VaFileInput=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.vaChange=createEvent(this,"vaChange",7),this.componentLibraryAnalytics=createEvent(this,"component-library-analytics",7),this.uploadStatus="idle",this.handleChange=e=>{const t=e.target;t.files&&t.files.length>0&&this.handleFile(t.files[0]),t.value=""},this.handleDrop=e=>{e.preventDefault(),e.stopPropagation();const t=e.dataTransfer.files;t.length>0&&this.handleFile(t[0])},this.handleFile=e=>{if(this.accept){const t=this.normalizeAcceptProp(this.accept);if(!this.isAcceptedFileType(e.type,t))return this.removeFile(!1),void(this.internalError="This is not a valid file type.")}this.file=e,this.vaChange.emit({files:[this.file]}),this.uploadStatus="success",this.internalError=null,this.generateFileContents(this.file),this.updateStatusMessage(`You have selected the file: ${this.file.name}`),this.el.focus(),this.enableAnalytics&&this.componentLibraryAnalytics.emit({componentName:"va-file-input",action:"change",details:{label:this.label}})},this.removeFile=(e=!0)=>{this.closeModal(),this.uploadStatus="idle",this.internalError=null,e&&this.vaChange.emit({files:[]}),this.file=null,this.updateStatusMessage("File removed. No file selected."),this.el.focus()},this.openModal=()=>{this.el.shadowRoot.querySelector("va-modal").setAttribute("status","warning"),this.showModal=!0},this.closeModal=()=>{this.showModal=!1,setTimeout((()=>{this.fileInputRef.focus()}),0)},this.closeModalAndKeepFile=()=>{this.showModal=!1,setTimeout((()=>{var e;null===(e=this.el.shadowRoot.querySelector("#delete"))||void 0===e||e.shadowRoot.querySelector("button").focus()}),0)},this.changeFile=()=>{this.fileInputRef&&this.fileInputRef.click()},this.formatFileSize=e=>{const t=["B","KB","MB","GB","TB"];if(0===e)return"0 B";const i=Math.floor(Math.log(e)/Math.log(1024));return 0===i?`${e} ${t[i]}`:`${(e/Math.pow(1024,i)).toFixed(i<2?0:1)} ${t[i]}`},this.normalizeAcceptProp=e=>e.split(",").map((e=>(e=e.trim()).startsWith(".")?extensionToMimeType[e]:e)),this.isAcceptedFileType=(e,t)=>{for(const i of t){if(i===e)return!0;if(i.endsWith("/*")&&e.startsWith(i.slice(0,-1)))return!0}return!1},this.renderLabelOrHeader=(e,t,i)=>{const a=t?h("span",{class:"required"}," ",instance.t("required")):null;return h("div",{class:"label-header"},i&&i>=1&&i<=6?h(`h${i}`,{htmlFor:"fileInputField",part:"label",class:"label-header-tag"},e,a):h("label",{htmlFor:"fileInputField",part:"label",class:"usa-label"},e,a))},this.file=void 0,this.fileContents=void 0,this.internalError=void 0,this.showModal=!1,this.label=void 0,this.name=void 0,this.buttonText=void 0,this.required=!1,this.accept=void 0,this.error=void 0,this.hint=void 0,this.uploadMessage=h("span",null,"Drag a file here or"," ",h("span",{class:"file-input-choose-text"},"choose from folder")),this.enableAnalytics=!1,this.headerSize=void 0,this.headless=!1}updateStatusMessage(e){setTimeout((()=>{const t=this.el.shadowRoot.querySelector("#statusMessage");t&&(t.textContent=e)}),1e3)}generateFileContents(e){if(!e)return;const t=new FileReader;this.fileType=e.type,t.onloadend=()=>{this.fileContents=t.result},this.fileType&&("application/pdf"===this.fileType||this.fileType.startsWith("image/"))&&t.readAsDataURL(e)}componentDidLoad(){fileInput.init(this.el)}connectedCallback(){this.el.addEventListener("change",this.handleChange)}disconnectedCallback(){this.el.removeEventListener("change",this.handleChange)}render(){const{label:e,name:t,required:i,accept:a,error:s,hint:o,file:n,uploadStatus:r,headerSize:l,fileContents:d,fileType:c,headless:f}=this,p=this.error||this.internalError,m=`${o?"input-hint-message":""} ${p?"input-error-message":""}`.trim()||null,u=("file-input-target "+(p?"file-input-target-error":"")).trim();let b=h("div",{key:"f4efe850c008ab64ddce7fe9a24af6fc95a0fc4b",class:"thumbnail-container"},h("svg",{key:"ca50cbcb9e94089e246b8e72a2c1908ffe3d2d44",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 384 512",fill:"#07648d",width:"40px",height:"40px"},h("path",{key:"e43b249e159dfefa7f53b5188f7a20b0d724d346",d:"M224 136V0H24C10.7 0 0 10.7 0 24v464c0 13.3 10.7 24 24 24h336c13.3 0 24-10.7 24-24V160H248c-13.2 0-24-10.8-24-24zm160-14.1v6.1H256V0h6.1c6.4 0 12.5 2.5 17 7l97.9 98c4.5 4.5 7 10.6 7 16.9z"})));s?b=h("div",{key:"ea54954fc330a13cf7cfec36722282df37f2e15b",class:"thumbnail-container"},h("va-icon",{key:"6dddfbd186a927a8c556f2da28a0214a0c3f7624",icon:"error",size:3,class:"thumbnail-preview thumbnail-error"})):d&&(c.startsWith("image/")?b=h("div",{key:"7f3fe63624b01cce7e9d33d20f14d59689da84a7",class:"thumbnail-container","aria-hidden":"true"},h("img",{key:"8bd651dd44c1d798ae6ce2eb0feb16da4793a086",class:"thumbnail-preview",src:d,alt:"image"})):"application/pdf"===c&&(b=h("div",{key:"8d087cbde5bff25766f7e80731b1c5bd27471b31",class:"thumbnail-container","aria-hidden":"true"},h("object",{key:"d45791644e8bef6890909aa1591f24bef329c1db",class:"thumbnail-preview",data:d,type:"application/pdf"}))));let g=f?"headless-selected-files-wrapper":"selected-files-wrapper";const v="usa-hint"+(f?" usa-sr-only":"");return h(Host,{key:"d0e47840af74f890728a2ca5facec2ad5fa56f51",class:{"has-error":!!p}},h("span",{key:"72790b6eeeb07df2d48f4ef6fd87dd73ed061b83",class:{"usa-sr-only":!!f}},e&&this.renderLabelOrHeader(e,i,l)),o&&h("div",{key:"41ee2ddbc3994315e3c2feb2ed6f40e9412260f8",class:v,id:"input-hint-message"},o),h("div",{key:"12c49ce9be06fc8625cdcf8f65de71c683a19093",class:"file-input-wrapper",onDrop:this.handleDrop},h("input",{key:"ea917dcd3adcb7792e20f683353488f53f97a94e",id:"fileInputField",class:"file-input",style:{visibility:"success"===this.uploadStatus?"hidden":"unset"},type:"file",ref:e=>this.fileInputRef=e,name:t,accept:a,"aria-describedby":m,onChange:this.handleChange}),"idle"===r&&h("div",{key:"57b73beafe3b6ec26ec8bf6ad5617c031b02a320"},h("span",{key:"199924b0ce1bf24d012718d126bf022f537393d4",id:"file-input-error-alert",role:"alert"},p&&h(Fragment,{key:"9c57c57fe6baf82a7f984657c5f7c715021816c6"},h("span",{key:"50cd13ee3ef6afbcd7020690749a9913e1ea90c3",class:"usa-sr-only"},instance.t("error")),h("span",{key:"7a2e5db4b6edc1e2a8b4c643f67f152b15df78f3",class:"usa-error-message"},p))),h("div",{key:"d428fd93fd798fa3e9a9f5605107b06fc17d5fcd",class:"usa-sr-only","aria-live":"polite",id:"statusMessage"}),h("div",{key:"8cc4a43455dce87a5ccdeb79498c48322b429773",class:u},h("div",{key:"5a4a707fdb3cf91356ec59617f61a396b39da049",class:"file-input-box"}),h("div",{key:"4b5886eaa37427fa7897e4fb1331f2dbf314b013",class:"file-input-instructions"},this.uploadMessage))),"idle"!==r&&h("div",{key:"9885243904f099eb7901d7490c5ea63547953ef3",class:g},!f&&h("div",{key:"24d06dfcf0cc583b7390aac10ded0f4f57b4b6b6",class:"selected-files-label"},"Selected files"),h("div",{key:"88e903e8df0626ccd3af40176cf42e8deb6ad47b",class:"usa-sr-only","aria-live":"polite",id:"statusMessage"}),h("va-card",{key:"67919c49005a1ac3411f78452290b4734b66ed4c",class:"va-card"},h("div",{key:"1b4f3bff8d791f30fbc216a1ac400dd4a14ed68a",class:"file-info-section"},b,h("div",{key:"3d99079487a2796c4bfc30df33e6325d91c98b9d",class:"file-info-group vads-u-line-height--2"},h("span",{key:"14d7df5fe386314dec02ab86523f43b40dbad45b",class:"file-label"},n.name),h("span",{key:"f0410c747f60ca9a597f73cf5a6bdff28e85184f",id:"input-error-message",role:"alert"},p&&h(Fragment,{key:"c6341ba5aad0dd82aa56ee3a1c1977e2c3afe1ad"},h("span",{key:"2282720f34dde57db83f6ec8ba670cceaa3f2c72",class:"usa-sr-only"},instance.t("error")),h("span",{key:"42b0cf671595d6773518b5d23a44a68882ffc728",class:"usa-error-message"},p))),h("span",{key:"b78fa91b6a65d1d13b017ddb99271686f9575ed3",class:"file-size-label"},this.formatFileSize(n.size)))),n&&h("div",{key:"07a826aa3127bbf1b05b963bc5792ec0f1afae56"},h("div",{key:"76972f72d4cec3ad57a3ad8d4de70635fed013aa",class:"additional-info-slot"},h("slot",{key:"497921cd3c784fccf2178875deaec25a27b8b784"})),h("div",{key:"d221b374e98e22cfb66f6969febdd5493d40b25c",class:"file-button-section"},h("va-button-icon",{key:"3f467dd2bdb637f533f248603929ae125a733a7d",buttonType:"change-file",onClick:this.changeFile,label:"Change file","aria-label":"change file "+n.name}),h("va-button-icon",{key:"711226c396d9423b9f9dd33c3fa6575f85cf71e0",id:"delete",buttonType:"delete",onClick:this.openModal,"aria-label":"delete file "+n.name,label:"Delete"})),h("va-modal",{key:"606b379912bb80e7297514497bba4f812ed6ea3d",modalTitle:"Delete this file?",visible:this.showModal,primaryButtonText:"Yes, remove this",secondaryButtonText:"No, keep this",onCloseEvent:this.closeModal,onPrimaryButtonClick:()=>this.removeFile(!0),onSecondaryButtonClick:this.closeModalAndKeepFile},"We'll remove the uploaded document ",h("span",{key:"87562d064af3433dad2fd4bb2e3bbe4a3903a69f",class:"file-label"},n.name)))))))}get el(){return this}static get style(){return VaFileInputStyle0}},[1,"va-file-input",{label:[1],name:[1],buttonText:[1,"button-text"],required:[4],accept:[1],error:[1],hint:[1],uploadMessage:[16],enableAnalytics:[4,"enable-analytics"],headerSize:[2,"header-size"],headless:[4],file:[32],fileContents:[32],internalError:[32],showModal:[32]}]);function defineCustomElement(){"undefined"!=typeof customElements&&["va-file-input","va-button","va-button-icon","va-card","va-icon","va-modal"].forEach((e=>{switch(e){case"va-file-input":customElements.get(e)||customElements.define(e,VaFileInput);break;case"va-button":customElements.get(e)||defineCustomElement$5();break;case"va-button-icon":customElements.get(e)||defineCustomElement$4();break;case"va-card":customElements.get(e)||defineCustomElement$3();break;case"va-icon":customElements.get(e)||defineCustomElement$2();break;case"va-modal":customElements.get(e)||defineCustomElement$1()}}))}export{VaFileInput as V,defineCustomElement as d};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{d as defineCustomElement$7}from"./va-button2.js";import{d as defineCustomElement$6}from"./va-crisis-line-modal2.js";import{d as defineCustomElement$5}from"./va-icon2.js";import{d as defineCustomElement$4}from"./va-modal2.js";import{d as defineCustomElement$3}from"./va-official-gov-banner2.js";import{d as defineCustomElement$2}from"./va-telephone2.js";const vaSealSvg="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1Ny42IDM1LjIiIHJvbGU9ImltZyI+PHRpdGxlPlZBPC90aXRsZT48ZyBmaWxsPSIjRkZGIj48cGF0aCBkPSJNMTEuMSAzNS4yTDAgMGg4LjZsNC4yIDE0LjljMS4yIDQuMiAyLjIgOC4yIDMuMSAxMi42aC4xYy45LTQuMiAxLjktOC40IDMuMS0xMi40TDIzLjUgMGg4LjNMMjAuMiAzNS4yaC05LjF6TTM2LjYgMjYuMmwtMi41IDloLThMMzYuNiAwaDEwLjJsMTAuOCAzNS4yaC04LjVsLTIuNy05aC05Ljh6bTguOC02bC0yLjItNy41Yy0uNi0yLjEtMS4yLTQuNy0xLjctNi44aC0uMWMtLjUgMi4xLTEgNC44LTEuNiA2LjhsLTIgNy41aDcuNnoiPjwvcGF0aD48L2c+PC9zdmc+",vaHeaderMinimalCss=".va-header{display:-ms-flexbox;display:flex;margin-left:auto;margin-right:auto;max-width:1000px;background-color:var(--vads-color-primary-darker);color:var(--vads-button-color-text-primary-alt-on-light);-ms-flex-align:center;align-items:center;padding:10px 8px;line-height:22px}@media (min-width: 481px){.va-header{padding:10px 16px}}.va-logo-link:focus{outline:2px solid var(--vads-color-action-focus-on-light)}.va-logo{margin-right:8px;min-height:30px;min-width:48px}@media (min-width: 481px){.va-logo{margin-right:16px}}.header-container{padding-left:8px;border-left:1px solid var(--vads-color-white)}@media (min-width: 481px){.header-container{padding-left:16px}}.header-container h1,.header-container .header{font-size:20px;margin:0;font-weight:700}.header-container h2,.header-container .subheader{font-size:20px;margin:0;font-weight:100}@media (min-width: 1008px){va-crisis-line-modal::part(button){position:absolute;right:0;bottom:-5px}}",VaHeaderMinimalStyle0=vaHeaderMinimalCss,VaHeaderMinimal$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.shifted=!1,this.header=void 0,this.subheader=void 0,this.enableHeadings=!1}trackShiftKey(e){this.shifted=e.shiftKey}trapFocus(){var e;const a=null===(e=this.el)||void 0===e?void 0:e.shadowRoot.querySelector("va-crisis-line-modal").shadowRoot.querySelector("va-modal"),t=null==a?void 0:a.getAttribute("visible");if(null!==t&&"false"!==t){let e;const t=this.shifted?".last-focusable-child":".va-modal-close";e=this.shifted?null==a?void 0:a.querySelector(t):null==a?void 0:a.shadowRoot.querySelector(t),null==e||e.focus()}}render(){const{header:e,subheader:a,enableHeadings:t}=this;return h(Host,{key:"
|
|
1
|
+
import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{d as defineCustomElement$7}from"./va-button2.js";import{d as defineCustomElement$6}from"./va-crisis-line-modal2.js";import{d as defineCustomElement$5}from"./va-icon2.js";import{d as defineCustomElement$4}from"./va-modal2.js";import{d as defineCustomElement$3}from"./va-official-gov-banner2.js";import{d as defineCustomElement$2}from"./va-telephone2.js";const vaSealSvg="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1Ny42IDM1LjIiIHJvbGU9ImltZyI+PHRpdGxlPlZBPC90aXRsZT48ZyBmaWxsPSIjRkZGIj48cGF0aCBkPSJNMTEuMSAzNS4yTDAgMGg4LjZsNC4yIDE0LjljMS4yIDQuMiAyLjIgOC4yIDMuMSAxMi42aC4xYy45LTQuMiAxLjktOC40IDMuMS0xMi40TDIzLjUgMGg4LjNMMjAuMiAzNS4yaC05LjF6TTM2LjYgMjYuMmwtMi41IDloLThMMzYuNiAwaDEwLjJsMTAuOCAzNS4yaC04LjVsLTIuNy05aC05Ljh6bTguOC02bC0yLjItNy41Yy0uNi0yLjEtMS4yLTQuNy0xLjctNi44aC0uMWMtLjUgMi4xLTEgNC44LTEuNiA2LjhsLTIgNy41aDcuNnoiPjwvcGF0aD48L2c+PC9zdmc+",vaHeaderMinimalCss=".va-header{display:-ms-flexbox;display:flex;margin-left:auto;margin-right:auto;max-width:1000px;background-color:var(--vads-color-primary-darker);color:var(--vads-button-color-text-primary-alt-on-light);-ms-flex-align:center;align-items:center;padding:10px 8px;line-height:22px}@media (min-width: 481px){.va-header{padding:10px 16px}}.va-logo-link:focus{outline:2px solid var(--vads-color-action-focus-on-light)}.va-logo{margin-right:8px;min-height:30px;min-width:48px}@media (min-width: 481px){.va-logo{margin-right:16px}}.header-container{padding-left:8px;border-left:1px solid var(--vads-color-white)}@media (min-width: 481px){.header-container{padding-left:16px}}.header-container h1,.header-container .header{font-size:20px;margin:0;font-weight:700}.header-container h2,.header-container .subheader{font-size:20px;margin:0;font-weight:100}@media (min-width: 1008px){va-crisis-line-modal::part(button){position:absolute;right:0;bottom:-5px}}",VaHeaderMinimalStyle0=vaHeaderMinimalCss,VaHeaderMinimal$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.shifted=!1,this.header=void 0,this.subheader=void 0,this.enableHeadings=!1}trackShiftKey(e){this.shifted=e.shiftKey}trapFocus(){var e;const a=null===(e=this.el)||void 0===e?void 0:e.shadowRoot.querySelector("va-crisis-line-modal").shadowRoot.querySelector("va-modal"),t=null==a?void 0:a.getAttribute("visible");if(null!==t&&"false"!==t){let e;const t=this.shifted?".last-focusable-child":".va-modal-close";e=this.shifted?null==a?void 0:a.querySelector(t):null==a?void 0:a.shadowRoot.querySelector(t),null==e||e.focus()}}render(){const{header:e,subheader:a,enableHeadings:t}=this;return h(Host,{key:"2fda023320e4c67cf4499d221b64bbdd43ba7a9c",role:"banner"},h("va-official-gov-banner",{key:"814588d93f585aa79a1da23d869a495a41dfcce7"}),h("va-crisis-line-modal",{key:"7ef4cbcbb4d050a94fab4c0ddec5eaa76446100c"}),h("div",{key:"bb39421fce96aedb363fe905a924f92f9c730dff",onFocusin:()=>this.trapFocus(),class:"va-header"},h("a",{key:"ae823a972c086c318a2e0220d44c15bc812255e0",href:"/",title:"Go to VA.gov",class:"va-logo-link"},h("img",{key:"adc6bcbae885ad66fb4f7f1888e4864ae70424fa",class:"va-logo",src:vaSealSvg,alt:"VA logo and Seal, U.S. Department of Veterans Affairs"})),h("div",{key:"ba9380c5b5c6ac47a802ca68df24b332562e835f",class:"header-container"},t?h("h1",null,e):h("div",{class:"header"},e),a&&(t?h("h2",null,a):h("div",{class:"subheader"},a)))))}get el(){return this}static get style(){return VaHeaderMinimalStyle0}},[1,"va-header-minimal",{header:[1],subheader:[1],enableHeadings:[4,"enable-headings"],shifted:[32]},[[8,"keydown","trackShiftKey"]]]);function defineCustomElement$1(){"undefined"!=typeof customElements&&["va-header-minimal","va-button","va-crisis-line-modal","va-icon","va-modal","va-official-gov-banner","va-telephone"].forEach((e=>{switch(e){case"va-header-minimal":customElements.get(e)||customElements.define(e,VaHeaderMinimal$1);break;case"va-button":customElements.get(e)||defineCustomElement$7();break;case"va-crisis-line-modal":customElements.get(e)||defineCustomElement$6();break;case"va-icon":customElements.get(e)||defineCustomElement$5();break;case"va-modal":customElements.get(e)||defineCustomElement$4();break;case"va-official-gov-banner":customElements.get(e)||defineCustomElement$3();break;case"va-telephone":customElements.get(e)||defineCustomElement$2()}}))}const VaHeaderMinimal=VaHeaderMinimal$1,defineCustomElement=defineCustomElement$1;export{VaHeaderMinimal,defineCustomElement};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{c as classnames}from"./index2.js";import{c as consoleDevError}from"./utils.js";const vaIconCss=".usa-icon{display:inline-block;fill:currentColor;height:1em;position:relative;width:1em}.usa-icon--size-3{height:1.5rem;width:1.5rem}.usa-icon--size-4{height:2rem;width:2rem}.usa-icon--size-5{height:2.5rem;width:2.5rem}.usa-icon--size-6{height:3rem;width:3rem}.usa-icon--size-7{height:3.5rem;width:3.5rem}.usa-icon--size-8{height:4rem;width:4rem}.usa-icon--size-9{height:4.5rem;width:4.5rem}:host{display:inline-block;line-height:0;vertical-align:bottom}",VaIconStyle0=vaIconCss,VaIcon=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.icon=void 0,this.size=void 0,this.srtext=void 0}getSize(){return this.size&&![3,4,5,6,7,8,9].includes(this.size)?(consoleDevError("Size must be an integer between 3 and 9, inclusive."),null):this.size}render(){const{icon:e,srtext:i}=this,t=this.getSize(),s=classnames({"usa-icon":!0,[`usa-icon--size-${t}`]:!!t}),n=`/img/sprite.svg#${e}`;return h(Host,{key:"
|
|
1
|
+
import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{c as classnames}from"./index2.js";import{c as consoleDevError}from"./utils.js";const vaIconCss=".usa-icon{display:inline-block;fill:currentColor;height:1em;position:relative;width:1em}.usa-icon--size-3{height:1.5rem;width:1.5rem}.usa-icon--size-4{height:2rem;width:2rem}.usa-icon--size-5{height:2.5rem;width:2.5rem}.usa-icon--size-6{height:3rem;width:3rem}.usa-icon--size-7{height:3.5rem;width:3.5rem}.usa-icon--size-8{height:4rem;width:4rem}.usa-icon--size-9{height:4.5rem;width:4.5rem}:host{display:inline-block;line-height:0;vertical-align:bottom}",VaIconStyle0=vaIconCss,VaIcon=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.icon=void 0,this.size=void 0,this.srtext=void 0}getSize(){return this.size&&![3,4,5,6,7,8,9].includes(this.size)?(consoleDevError("Size must be an integer between 3 and 9, inclusive."),null):this.size}render(){const{icon:e,srtext:i}=this,t=this.getSize(),s=classnames({"usa-icon":!0,[`usa-icon--size-${t}`]:!!t}),n=`/img/sprite.svg#${e}`;return h(Host,{key:"fc516da55de8afb4ca293689bb6c1b3aa2f9b70d"},h("svg",{key:"46ce0f4656e7b4742a7080e0b739e4ac3c1f616b",class:s,"aria-labelledby":i?"icon-title":null,"aria-hidden":i?null:"true",focusable:"false",role:"img"},i&&h("title",{key:"a0c1c2740f2d72e88c137eb4ac0162152e3ecc15",id:"icon-title"},i),h("use",{key:"5a2aa61e34ff9753b538d8f9517dac6c0b65c62b",href:n})))}static get assetsDirs(){return["../img"]}static get style(){return VaIconStyle0}},[1,"va-icon",{icon:[1],size:[2],srtext:[1]}]);function defineCustomElement(){"undefined"!=typeof customElements&&["va-icon"].forEach((e=>{"va-icon"===e&&(customElements.get(e)||customElements.define(e,VaIcon))}))}export{VaIcon as V,defineCustomElement as d};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement,HTMLElement,createEvent,h,Host}from"@stencil/core/internal/client";import{c as classnames}from"./index2.js";import{d as defineCustomElement$2}from"./va-icon2.js";const vaLinkActionCss="/* From the USWDS styles: */\n/* https://github.com/uswds/uswds/blob/3dc296ec56cd621fe52d918701fd94621d96a198/src/stylesheets/core/mixins/_focus.scss#L12-L13 */\nbutton:not([disabled]):focus,\nselect:not([disabled]):focus,\na:not([disabled]):focus,\nh1:focus,\ninput:not([disabled]):focus,\ntextarea:not([disabled]):focus,\n#form-question\n[role='option']:focus {\n outline: 2px solid var(--vads-color-action-focus-on-light);\n outline-offset: 2px;\n}\n\n\na {\n text-decoration: none;\n color: var(--vads-color-link);\n -webkit-transition-duration: 0.3s;\n transition-duration: 0.3s;\n -webkit-transition-timing-function: ease-in-out;\n transition-timing-function: ease-in-out;\n -webkit-transition-property: color, background-color, border-color;\n transition-property: color, background-color, border-color;\n}\n\na:hover {\n background-color: rgba(0, 0, 0, 0.05);\n color: inherit;\n}\n\na:visited {\n color: var(--vads-color-link-visited);\n}\n\n.sr-only {\n border: 0;\n clip: rect(0, 0, 0, 0);\n -webkit-clip-path: inset(50%);\n clip-path: inset(50%);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute !important;\n width: 1px;\n /* Workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=1241631 */\n word-wrap: normal !important;\n}\n\n\n:host {\n display: -ms-inline-flexbox;\n display: inline-flex;\n}\n\n:host a {\n display: -ms-inline-flexbox;\n display: inline-flex;\n -ms-flex-align: start;\n align-items: flex-start;\n cursor: pointer;\n text-decoration: underline;\n font-weight: 700;\n font-size: 1.06rem;\n padding: 0.5rem 0;\n &:active {\n outline: 2px solid var(--vads-color-action-focus-on-light);\n outline-offset: 2px;\n }\n}\n\n:host a.va-link--primary,\n:host a.va-link--secondary {\n &:hover, &:active {\n color: var(--vads-color-link) !important;\n }\n}\n\n:host a.va-link--reverse {\n color: var(--vads-color-white);\n\n &:hover, &:active {\n color: var(--vads-color-action-focus-on-light);\n background-color: transparent;\n }\n}\n\n:host a.va-link--reverse va-icon {\n &:hover, &:active {\n background-color: var(--vads-color-action-focus-on-light);\n }\n}\n\n.link-icon--left {\n margin-right: 8px;\n vertical-align: baseline;\n position: relative;\n}\n\n.link-icon {\n border-radius: 50%;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -ms-flex-align: center;\n align-items: center;\n -ms-flex-pack: center;\n justify-content: center;\n color: white;\n -webkit-transition-duration: 0.3s;\n transition-duration: 0.3s;\n -webkit-transition-timing-function: ease-in-out;\n transition-timing-function: ease-in-out;\n -webkit-transition-property: color, background-color, border-color;\n transition-property: color, background-color, border-color;\n}\n\n.va-link--primary {\n va-icon {\n background-color: var(--vads-color-success-dark);\n }\n}\n\n.va-link--secondary {\n va-icon {\n background-color: var(--vads-color-primary);\n }\n}\n\n.link-icon--reverse {\n background-color: var(--vads-color-white);\n color: var(--vads-color-black);\n}\n\n:host a.va-link--reverse:hover va-icon,\n:host a.va-link--reverse:active va-icon {\n background-color: var(--vads-color-action-focus-on-light) !important;\n}\n\n.link-text {\n display: inline-block;\n vertical-align: top;\n max-width: calc(100% - 24px);\n white-space: pre-wrap;\n}",VaLinkActionStyle0=vaLinkActionCss,VaLinkAction$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.componentLibraryAnalytics=createEvent(this,"component-library-analytics",7),this.handleClick=n=>{if(!this.disableAnalytics){const n={componentName:"va-link-action",action:"click",details:{label:this.text,destination:this.href,origin:window.location.href}};this.componentLibraryAnalytics.emit(n)}},this.disableAnalytics=!1,this.href=void 0,this.text=void 0,this.messageAriaDescribedby=void 0,this.type="primary",this.label=void 0,this.isSingleLine=!0}componentDidLoad(){this.checkTextLines()}checkTextLines(){if(this.linkRef){const n=getComputedStyle(this.linkRef),e=parseFloat(n.lineHeight),i=this.linkRef.clientHeight;this.isSingleLine=i<=e}}render(){const{handleClick:n,href:e,text:i,messageAriaDescribedby:o,type:t,label:a}=this,s=classnames({"va-link--reverse":"reverse"===t,"va-link--primary":"primary"===t,"va-link--secondary":"secondary"===t}),r=classnames("link-icon--left","link-icon",{"link-icon--reverse":"reverse"===t});return h(Host,{key:"
|
|
1
|
+
import{proxyCustomElement,HTMLElement,createEvent,h,Host}from"@stencil/core/internal/client";import{c as classnames}from"./index2.js";import{d as defineCustomElement$2}from"./va-icon2.js";const vaLinkActionCss="/* From the USWDS styles: */\n/* https://github.com/uswds/uswds/blob/3dc296ec56cd621fe52d918701fd94621d96a198/src/stylesheets/core/mixins/_focus.scss#L12-L13 */\nbutton:not([disabled]):focus,\nselect:not([disabled]):focus,\na:not([disabled]):focus,\nh1:focus,\ninput:not([disabled]):focus,\ntextarea:not([disabled]):focus,\n#form-question\n[role='option']:focus {\n outline: 2px solid var(--vads-color-action-focus-on-light);\n outline-offset: 2px;\n}\n\n\na {\n text-decoration: none;\n color: var(--vads-color-link);\n -webkit-transition-duration: 0.3s;\n transition-duration: 0.3s;\n -webkit-transition-timing-function: ease-in-out;\n transition-timing-function: ease-in-out;\n -webkit-transition-property: color, background-color, border-color;\n transition-property: color, background-color, border-color;\n}\n\na:hover {\n background-color: rgba(0, 0, 0, 0.05);\n color: inherit;\n}\n\na:visited {\n color: var(--vads-color-link-visited);\n}\n\n.sr-only {\n border: 0;\n clip: rect(0, 0, 0, 0);\n -webkit-clip-path: inset(50%);\n clip-path: inset(50%);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute !important;\n width: 1px;\n /* Workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=1241631 */\n word-wrap: normal !important;\n}\n\n\n:host {\n display: -ms-inline-flexbox;\n display: inline-flex;\n}\n\n:host a {\n display: -ms-inline-flexbox;\n display: inline-flex;\n -ms-flex-align: start;\n align-items: flex-start;\n cursor: pointer;\n text-decoration: underline;\n font-weight: 700;\n font-size: 1.06rem;\n padding: 0.5rem 0;\n &:active {\n outline: 2px solid var(--vads-color-action-focus-on-light);\n outline-offset: 2px;\n }\n}\n\n:host a.va-link--primary,\n:host a.va-link--secondary {\n &:hover, &:active {\n color: var(--vads-color-link) !important;\n }\n}\n\n:host a.va-link--reverse {\n color: var(--vads-color-white);\n\n &:hover, &:active {\n color: var(--vads-color-action-focus-on-light);\n background-color: transparent;\n }\n}\n\n:host a.va-link--reverse va-icon {\n &:hover, &:active {\n background-color: var(--vads-color-action-focus-on-light);\n }\n}\n\n.link-icon--left {\n margin-right: 8px;\n vertical-align: baseline;\n position: relative;\n}\n\n.link-icon {\n border-radius: 50%;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -ms-flex-align: center;\n align-items: center;\n -ms-flex-pack: center;\n justify-content: center;\n color: white;\n -webkit-transition-duration: 0.3s;\n transition-duration: 0.3s;\n -webkit-transition-timing-function: ease-in-out;\n transition-timing-function: ease-in-out;\n -webkit-transition-property: color, background-color, border-color;\n transition-property: color, background-color, border-color;\n}\n\n.va-link--primary {\n va-icon {\n background-color: var(--vads-color-success-dark);\n }\n}\n\n.va-link--secondary {\n va-icon {\n background-color: var(--vads-color-primary);\n }\n}\n\n.link-icon--reverse {\n background-color: var(--vads-color-white);\n color: var(--vads-color-black);\n}\n\n:host a.va-link--reverse:hover va-icon,\n:host a.va-link--reverse:active va-icon {\n background-color: var(--vads-color-action-focus-on-light) !important;\n}\n\n.link-text {\n display: inline-block;\n vertical-align: top;\n max-width: calc(100% - 24px);\n white-space: pre-wrap;\n}",VaLinkActionStyle0=vaLinkActionCss,VaLinkAction$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.componentLibraryAnalytics=createEvent(this,"component-library-analytics",7),this.handleClick=n=>{if(!this.disableAnalytics){const n={componentName:"va-link-action",action:"click",details:{label:this.text,destination:this.href,origin:window.location.href}};this.componentLibraryAnalytics.emit(n)}},this.disableAnalytics=!1,this.href=void 0,this.text=void 0,this.messageAriaDescribedby=void 0,this.type="primary",this.label=void 0,this.isSingleLine=!0}componentDidLoad(){this.checkTextLines()}checkTextLines(){if(this.linkRef){const n=getComputedStyle(this.linkRef),e=parseFloat(n.lineHeight),i=this.linkRef.clientHeight;this.isSingleLine=i<=e}}render(){const{handleClick:n,href:e,text:i,messageAriaDescribedby:o,type:t,label:a}=this,s=classnames({"va-link--reverse":"reverse"===t,"va-link--primary":"primary"===t,"va-link--secondary":"secondary"===t}),r=classnames("link-icon--left","link-icon",{"link-icon--reverse":"reverse"===t});return h(Host,{key:"fd6c872313ebfb4fffaa986164c09ebf11858723"},h("a",{key:"2ede8fdc58a04aa1b1a5bd0386faf7e9d3356ab0",href:e,class:s,"aria-label":a,"aria-describedby":o?"link-description":null,onClick:n,ref:n=>this.linkRef=n},h("va-icon",{key:"54e6c9a3a52efe5d9282ed6e293bca959b3099bb",class:r,icon:"chevron_right",size:3}),h("span",{key:"4435241c28e020b2cc3eb063d10a01ee9204789b",class:"link-text"},i)),o&&h("span",{key:"e65377e343d8302a17b55a511084aeec1f524ca0",id:"link-description",class:"sr-only"},o))}static get watchers(){return{text:["checkTextLines"]}}static get style(){return VaLinkActionStyle0}},[1,"va-link-action",{disableAnalytics:[4,"disable-analytics"],href:[1],text:[1],messageAriaDescribedby:[1,"message-aria-describedby"],type:[1],label:[1],isSingleLine:[32]},void 0,{text:["checkTextLines"]}]);function defineCustomElement$1(){"undefined"!=typeof customElements&&["va-link-action","va-icon"].forEach((n=>{switch(n){case"va-link-action":customElements.get(n)||customElements.define(n,VaLinkAction$1);break;case"va-icon":customElements.get(n)||defineCustomElement$2()}}))}const VaLinkAction=VaLinkAction$1,defineCustomElement=defineCustomElement$1;export{VaLinkAction,defineCustomElement};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement,HTMLElement,createEvent,h,Host}from"@stencil/core/internal/client";var isChromatic=function(t){const e=t||"undefined"!=typeof window&&window;return!(!e||!e.navigator.userAgent.match(/Chromatic/)&&!e.location.href.match(/chromatic=true/))};const vaLoadingIndicatorCss=":host{display:block;font-size:1.06rem;text-align:center}.loading-indicator{display:block;height:4rem;margin-top:1rem}.loading-indicator:after{content:' ';display:inline-block;width:2.1875rem;height:2.1875rem;margin:1px;border-radius:50%;border:8px solid var(--vads-color-primary);border-color:var(--vads-color-primary) transparent var(--vads-color-primary)\n transparent;-webkit-animation:spin 1.5s linear infinite;animation:spin 1.5s linear infinite}.loading-indicator.chromatic:after{-webkit-animation:none;animation:none}.loading-indicator:focus{outline:none}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}",VaLoadingIndicatorStyle0=vaLoadingIndicatorCss,VaLoadingIndicator$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.componentLibraryAnalytics=createEvent(this,"component-library-analytics",7),this.loadingStartTime=null,this.observer=null,this.message=void 0,this.label="Loading",this.setFocus=!1,this.enableAnalytics=!1}componentDidLoad(){this.setFocus&&this.spinner&&this.spinner.focus(),this.loadingStartTime=Date.now();const t=this.el.parentNode;this.observer=new MutationObserver((e=>{for(const
|
|
1
|
+
import{proxyCustomElement,HTMLElement,createEvent,h,Host}from"@stencil/core/internal/client";var isChromatic=function(t){const e=t||"undefined"!=typeof window&&window;return!(!e||!e.navigator.userAgent.match(/Chromatic/)&&!e.location.href.match(/chromatic=true/))};const vaLoadingIndicatorCss=":host{display:block;font-size:1.06rem;text-align:center}.loading-indicator{display:block;height:4rem;margin-top:1rem}.loading-indicator:after{content:' ';display:inline-block;width:2.1875rem;height:2.1875rem;margin:1px;border-radius:50%;border:8px solid var(--vads-color-primary);border-color:var(--vads-color-primary) transparent var(--vads-color-primary)\n transparent;-webkit-animation:spin 1.5s linear infinite;animation:spin 1.5s linear infinite}.loading-indicator.chromatic:after{-webkit-animation:none;animation:none}.loading-indicator:focus{outline:none}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}",VaLoadingIndicatorStyle0=vaLoadingIndicatorCss,VaLoadingIndicator$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.componentLibraryAnalytics=createEvent(this,"component-library-analytics",7),this.loadingStartTime=null,this.observer=null,this.message=void 0,this.label="Loading",this.setFocus=!1,this.enableAnalytics=!1}componentDidLoad(){this.setFocus&&this.spinner&&this.spinner.focus(),this.loadingStartTime=Date.now();const t=this.el.parentNode;this.observer=new MutationObserver((e=>{for(const i of e)if("childList"===i.type){const e=Array.from(i.removedNodes.values()).filter((t=>{var e;return"va-loading-indicator"===(null===(e=null==t?void 0:t.tagName)||void 0===e?void 0:e.toLowerCase())})).length>0;if(this.enableAnalytics&&e){const e=new CustomEvent("component-library-analytics",{bubbles:!0,composed:!0,detail:{componentName:"va-loading-indicator",action:"displayed",details:{displayTime:Date.now()-this.loadingStartTime,message:this.message}}});t.dispatchEvent(e)}}})),this.observer.observe(t,{childList:!0})}render(){const{message:t,label:e}=this;let i="loading-indicator";return isChromatic()&&(i+=" chromatic"),h(Host,{key:"031f6f3cfa824a27a3518d03715c560228d16943","aria-live":"polite"},h("div",{key:"b6857718a452f32978809f124a383f66b702f7b1",ref:t=>this.spinner=t,class:i,role:"progressbar","aria-label":e,"aria-valuetext":t,tabindex:"-1"}),t)}get el(){return this}static get style(){return VaLoadingIndicatorStyle0}},[1,"va-loading-indicator",{message:[1],label:[1],setFocus:[4,"set-focus"],enableAnalytics:[4,"enable-analytics"]}]);function defineCustomElement$1(){"undefined"!=typeof customElements&&["va-loading-indicator"].forEach((t=>{"va-loading-indicator"===t&&(customElements.get(t)||customElements.define(t,VaLoadingIndicator$1))}))}const VaLoadingIndicator=VaLoadingIndicator$1,defineCustomElement=defineCustomElement$1;export{VaLoadingIndicator,defineCustomElement};
|