@department-of-veterans-affairs/component-library 54.5.0 → 54.5.2

package/dist/react-bindings/react-component-lib/createOverlayComponent.tsx

@@ -0,0 +1,142 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+
+import { OverlayEventDetail } from './interfaces';
+import { StencilReactForwardedRef, attachProps, dashToPascalCase, defineCustomElement, setRef } from './utils';
+
+interface OverlayElement extends HTMLElement {
+  present: () => Promise<void>;
+  dismiss: (data?: any, role?: string | undefined) => Promise<boolean>;
+}
+
+export interface ReactOverlayProps {
+  children?: React.ReactNode;
+  isOpen: boolean;
+  onDidDismiss?: (event: CustomEvent<OverlayEventDetail>) => void;
+  onDidPresent?: (event: CustomEvent<OverlayEventDetail>) => void;
+  onWillDismiss?: (event: CustomEvent<OverlayEventDetail>) => void;
+  onWillPresent?: (event: CustomEvent<OverlayEventDetail>) => void;
+}
+
+export const createOverlayComponent = <OverlayComponent extends object, OverlayType extends OverlayElement>(
+  tagName: string,
+  controller: { create: (options: any) => Promise<OverlayType> },
+  customElement?: any
+) => {
+  defineCustomElement(tagName, customElement);
+
+  const displayName = dashToPascalCase(tagName);
+  const didDismissEventName = `on${displayName}DidDismiss`;
+  const didPresentEventName = `on${displayName}DidPresent`;
+  const willDismissEventName = `on${displayName}WillDismiss`;
+  const willPresentEventName = `on${displayName}WillPresent`;
+
+  type Props = OverlayComponent &
+    ReactOverlayProps & {
+      forwardedRef?: StencilReactForwardedRef<OverlayType>;
+    };
+
+  let isDismissing = false;
+
+  class Overlay extends React.Component<Props> {
+    overlay?: OverlayType;
+    el!: HTMLDivElement;
+
+    constructor(props: Props) {
+      super(props);
+      if (typeof document !== 'undefined') {
+        this.el = document.createElement('div');
+      }
+      this.handleDismiss = this.handleDismiss.bind(this);
+    }
+
+    static get displayName() {
+      return displayName;
+    }
+
+    componentDidMount() {
+      if (this.props.isOpen) {
+        this.present();
+      }
+    }
+
+    componentWillUnmount() {
+      if (this.overlay) {
+        this.overlay.dismiss();
+      }
+    }
+
+    handleDismiss(event: CustomEvent<OverlayEventDetail<any>>) {
+      if (this.props.onDidDismiss) {
+        this.props.onDidDismiss(event);
+      }
+      setRef(this.props.forwardedRef, null);
+    }
+
+    shouldComponentUpdate(nextProps: Props) {
+      // Check if the overlay component is about to dismiss
+      if (this.overlay && nextProps.isOpen !== this.props.isOpen && nextProps.isOpen === false) {
+        isDismissing = true;
+      }
+
+      return true;
+    }
+
+    async componentDidUpdate(prevProps: Props) {
+      if (this.overlay) {
+        attachProps(this.overlay, this.props, prevProps);
+      }
+
+      if (prevProps.isOpen !== this.props.isOpen && this.props.isOpen === true) {
+        this.present(prevProps);
+      }
+      if (this.overlay && prevProps.isOpen !== this.props.isOpen && this.props.isOpen === false) {
+        await this.overlay.dismiss();
+        isDismissing = false;
+
+        /**
+         * Now that the overlay is dismissed
+         * we need to render again so that any
+         * inner components will be unmounted
+         */
+        this.forceUpdate();
+      }
+    }
+
+    async present(prevProps?: Props) {
+      const { children, isOpen, onDidDismiss, onDidPresent, onWillDismiss, onWillPresent, ...cProps } = this.props;
+      const elementProps = {
+        ...cProps,
+        ref: this.props.forwardedRef,
+        [didDismissEventName]: this.handleDismiss,
+        [didPresentEventName]: (e: CustomEvent) => this.props.onDidPresent && this.props.onDidPresent(e),
+        [willDismissEventName]: (e: CustomEvent) => this.props.onWillDismiss && this.props.onWillDismiss(e),
+        [willPresentEventName]: (e: CustomEvent) => this.props.onWillPresent && this.props.onWillPresent(e),
+      };
+
+      this.overlay = await controller.create({
+        ...elementProps,
+        component: this.el,
+        componentProps: {},
+      });
+
+      setRef(this.props.forwardedRef, this.overlay);
+      attachProps(this.overlay, elementProps, prevProps);
+
+      await this.overlay.present();
+    }
+
+    render() {
+      /**
+       * Continue to render the component even when
+       * overlay is dismissing otherwise component
+       * will be hidden before animation is done.
+       */
+      return ReactDOM.createPortal(this.props.isOpen || isDismissing ? this.props.children : null, this.el);
+    }
+  }
+
+  return React.forwardRef<OverlayType, Props>((props, ref) => {
+    return <Overlay {...props} forwardedRef={ref} />;
+  });
+};

package/dist/react-bindings/react-component-lib/index.d.ts

@@ -0,0 +1,2 @@
+export { createReactComponent } from './createComponent';
+export { createOverlayComponent } from './createOverlayComponent';

package/dist/react-bindings/react-component-lib/index.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.createOverlayComponent=exports.createReactComponent=void 0;var createComponent_1=require("./createComponent");Object.defineProperty(exports,"createReactComponent",{enumerable:!0,get:function(){return createComponent_1.createReactComponent}});var createOverlayComponent_1=require("./createOverlayComponent");Object.defineProperty(exports,"createOverlayComponent",{enumerable:!0,get:function(){return createOverlayComponent_1.createOverlayComponent}});

package/dist/react-bindings/react-component-lib/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":";;;AAAA,qDAAyD;AAAhD,uHAAA,oBAAoB,OAAA;AAC7B,mEAAkE;AAAzD,gIAAA,sBAAsB,OAAA"}

package/dist/react-bindings/react-component-lib/index.ts

@@ -0,0 +1,2 @@
+export { createReactComponent } from './createComponent';
+export { createOverlayComponent } from './createOverlayComponent';

package/dist/react-bindings/react-component-lib/interfaces.d.ts

@@ -0,0 +1,29 @@
+export interface EventEmitter<T = any> {
+    emit: (data?: T) => CustomEvent<T>;
+}
+export interface StyleReactProps {
+    class?: string;
+    className?: string;
+    style?: {
+        [key: string]: any;
+    };
+}
+export interface OverlayEventDetail<T = any> {
+    data?: T;
+    role?: string;
+}
+export interface OverlayInterface {
+    el: HTMLElement;
+    animated: boolean;
+    keyboardClose: boolean;
+    overlayIndex: number;
+    presented: boolean;
+    enterAnimation?: any;
+    leaveAnimation?: any;
+    didPresent: EventEmitter<void>;
+    willPresent: EventEmitter<void>;
+    willDismiss: EventEmitter<OverlayEventDetail>;
+    didDismiss: EventEmitter<OverlayEventDetail>;
+    present(): Promise<void>;
+    dismiss(data?: any, role?: string): Promise<boolean>;
+}

package/dist/react-bindings/react-component-lib/interfaces.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});

package/dist/react-bindings/react-component-lib/interfaces.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["interfaces.ts"],"names":[],"mappings":""}

package/dist/react-bindings/react-component-lib/interfaces.ts

@@ -0,0 +1,34 @@
+// General types important to applications using stencil built components
+export interface EventEmitter<T = any> {
+  emit: (data?: T) => CustomEvent<T>;
+}
+
+export interface StyleReactProps {
+  class?: string;
+  className?: string;
+  style?: { [key: string]: any };
+}
+
+export interface OverlayEventDetail<T = any> {
+  data?: T;
+  role?: string;
+}
+
+export interface OverlayInterface {
+  el: HTMLElement;
+  animated: boolean;
+  keyboardClose: boolean;
+  overlayIndex: number;
+  presented: boolean;
+
+  enterAnimation?: any;
+  leaveAnimation?: any;
+
+  didPresent: EventEmitter<void>;
+  willPresent: EventEmitter<void>;
+  willDismiss: EventEmitter<OverlayEventDetail>;
+  didDismiss: EventEmitter<OverlayEventDetail>;
+
+  present(): Promise<void>;
+  dismiss(data?: any, role?: string): Promise<boolean>;
+}

package/dist/react-bindings/react-component-lib/utils/attachProps.d.ts

@@ -0,0 +1,16 @@
+export declare const attachProps: (node: HTMLElement, newProps: any, oldProps?: any) => void;
+export declare const getClassName: (classList: DOMTokenList, newProps: any, oldProps: any) => string;
+/**
+ * Transforms a React event name to a browser event name.
+ */
+export declare const transformReactEventName: (eventNameSuffix: string) => string;
+/**
+ * Checks if an event is supported in the current execution environment.
+ * @license Modernizr 3.0.0pre (Custom Build) | MIT
+ */
+export declare const isCoveredByReact: (eventNameSuffix: string) => boolean;
+export declare const syncEvent: (node: Element & {
+    __events?: {
+        [key: string]: ((e: Event) => any) | undefined;
+    };
+}, eventName: string, newEventHandler?: (e: Event) => any) => void;

package/dist/react-bindings/react-component-lib/utils/attachProps.js

@@ -0,0 +1,2 @@
+/*! For license information please see attachProps.js.LICENSE.txt */
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.syncEvent=exports.isCoveredByReact=exports.transformReactEventName=exports.getClassName=exports.attachProps=void 0;var case_1=require("./case"),attachProps=function(e,t,a){if(void 0===a&&(a={}),e instanceof Element){var r=(0,exports.getClassName)(e.classList,t,a);""!==r&&(e.className=r),Object.keys(t).forEach(function(a){if("children"!==a&&"style"!==a&&"ref"!==a&&"class"!==a&&"className"!==a&&"forwardedRef"!==a)if(0===a.indexOf("on")&&a[2]===a[2].toUpperCase()){var r=a.substring(2),s=r[0].toLowerCase()+r.substring(1);(0,exports.isCoveredByReact)(s)||(0,exports.syncEvent)(e,s,t[a])}else e[a]=t[a],"string"==typeof t[a]&&e.setAttribute((0,case_1.camelToDashCase)(a),t[a])})}};exports.attachProps=attachProps;var getClassName=function(e,t,a){var r=t.className||t.class,s=a.className||a.class,n=arrayToMap(e),o=arrayToMap(r?r.split(" "):[]),c=arrayToMap(s?s.split(" "):[]),i=[];return n.forEach(function(e){o.has(e)?(i.push(e),o.delete(e)):c.has(e)||i.push(e)}),o.forEach(function(e){return i.push(e)}),i.join(" ")};exports.getClassName=getClassName;var transformReactEventName=function(e){return"doubleclick"===e?"dblclick":e};exports.transformReactEventName=transformReactEventName;var isCoveredByReact=function(e){if("undefined"==typeof document)return!0;var t="on"+(0,exports.transformReactEventName)(e),a=t in document;if(!a){var r=document.createElement("div");r.setAttribute(t,"return;"),a="function"==typeof r[t]}return a};exports.isCoveredByReact=isCoveredByReact;var syncEvent=function(e,t,a){var r=e.__events||(e.__events={}),s=r[t];s&&e.removeEventListener(t,s),e.addEventListener(t,r[t]=function(e){a&&a.call(this,e)})};exports.syncEvent=syncEvent;var arrayToMap=function(e){var t=new Map;return e.forEach(function(e){return t.set(e,e)}),t};

package/dist/react-bindings/react-component-lib/utils/attachProps.js.LICENSE.txt

@@ -0,0 +1,4 @@
+/**
+ * Checks if an event is supported in the current execution environment.
+ * @license Modernizr 3.0.0pre (Custom Build) | MIT
+ */

package/dist/react-bindings/react-component-lib/utils/attachProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"attachProps.js","sourceRoot":"","sources":["attachProps.ts"],"names":[],"mappings":"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"}

package/dist/react-bindings/react-component-lib/utils/attachProps.ts

@@ -0,0 +1,125 @@
+import { camelToDashCase } from './case';
+
+export const attachProps = (node: HTMLElement, newProps: any, oldProps: any = {}) => {
+  // some test frameworks don't render DOM elements, so we test here to make sure we are dealing with DOM first
+  if (node instanceof Element) {
+    // add any classes in className to the class list
+    const className = getClassName(node.classList, newProps, oldProps);
+    if (className !== '') {
+      node.className = className;
+    }
+
+    Object.keys(newProps).forEach((name) => {
+      if (
+        name === 'children' ||
+        name === 'style' ||
+        name === 'ref' ||
+        name === 'class' ||
+        name === 'className' ||
+        name === 'forwardedRef'
+      ) {
+        return;
+      }
+      if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {
+        const eventName = name.substring(2);
+        const eventNameLc = eventName[0].toLowerCase() + eventName.substring(1);
+
+        if (!isCoveredByReact(eventNameLc)) {
+          syncEvent(node, eventNameLc, newProps[name]);
+        }
+      } else {
+        (node as any)[name] = newProps[name];
+        const propType = typeof newProps[name];
+        if (propType === 'string') {
+          node.setAttribute(camelToDashCase(name), newProps[name]);
+        }
+      }
+    });
+  }
+};
+
+export const getClassName = (classList: DOMTokenList, newProps: any, oldProps: any) => {
+  const newClassProp: string = newProps.className || newProps.class;
+  const oldClassProp: string = oldProps.className || oldProps.class;
+  // map the classes to Maps for performance
+  const currentClasses = arrayToMap(classList);
+  const incomingPropClasses = arrayToMap(newClassProp ? newClassProp.split(' ') : []);
+  const oldPropClasses = arrayToMap(oldClassProp ? oldClassProp.split(' ') : []);
+  const finalClassNames: string[] = [];
+  // loop through each of the current classes on the component
+  // to see if it should be a part of the classNames added
+  currentClasses.forEach((currentClass) => {
+    if (incomingPropClasses.has(currentClass)) {
+      // add it as its already included in classnames coming in from newProps
+      finalClassNames.push(currentClass);
+      incomingPropClasses.delete(currentClass);
+    } else if (!oldPropClasses.has(currentClass)) {
+      // add it as it has NOT been removed by user
+      finalClassNames.push(currentClass);
+    }
+  });
+  incomingPropClasses.forEach((s) => finalClassNames.push(s));
+  return finalClassNames.join(' ');
+};
+
+/**
+ * Transforms a React event name to a browser event name.
+ */
+export const transformReactEventName = (eventNameSuffix: string) => {
+  switch (eventNameSuffix) {
+    case 'doubleclick':
+      return 'dblclick';
+  }
+  return eventNameSuffix;
+};
+
+/**
+ * Checks if an event is supported in the current execution environment.
+ * @license Modernizr 3.0.0pre (Custom Build) | MIT
+ */
+export const isCoveredByReact = (eventNameSuffix: string) => {
+  if (typeof document === 'undefined') {
+    return true;
+  } else {
+    const eventName = 'on' + transformReactEventName(eventNameSuffix);
+    let isSupported = eventName in document;
+
+    if (!isSupported) {
+      const element = document.createElement('div');
+      element.setAttribute(eventName, 'return;');
+      isSupported = typeof (element as any)[eventName] === 'function';
+    }
+
+    return isSupported;
+  }
+};
+
+export const syncEvent = (
+  node: Element & { __events?: { [key: string]: ((e: Event) => any) | undefined } },
+  eventName: string,
+  newEventHandler?: (e: Event) => any
+) => {
+  const eventStore = node.__events || (node.__events = {});
+  const oldEventHandler = eventStore[eventName];
+
+  // Remove old listener so they don't double up.
+  if (oldEventHandler) {
+    node.removeEventListener(eventName, oldEventHandler);
+  }
+
+  // Bind new listener.
+  node.addEventListener(
+    eventName,
+    (eventStore[eventName] = function handler(e: Event) {
+      if (newEventHandler) {
+        newEventHandler.call(this, e);
+      }
+    })
+  );
+};
+
+const arrayToMap = (arr: string[] | DOMTokenList) => {
+  const map = new Map<string, string>();
+  (arr as string[]).forEach((s: string) => map.set(s, s));
+  return map;
+};

package/dist/react-bindings/react-component-lib/utils/case.d.ts

@@ -0,0 +1,2 @@
+export declare const dashToPascalCase: (str: string) => string;
+export declare const camelToDashCase: (str: string) => string;

package/dist/react-bindings/react-component-lib/utils/case.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.camelToDashCase=exports.dashToPascalCase=void 0;var dashToPascalCase=function(a){return a.toLowerCase().split("-").map(function(a){return a.charAt(0).toUpperCase()+a.slice(1)}).join("")};exports.dashToPascalCase=dashToPascalCase;var camelToDashCase=function(a){return a.replace(/([A-Z])/g,function(a){return"-".concat(a[0].toLowerCase())})};exports.camelToDashCase=camelToDashCase;

package/dist/react-bindings/react-component-lib/utils/case.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"case.js","sourceRoot":"","sources":["case.ts"],"names":[],"mappings":";;;AAAO,IAAM,gBAAgB,GAAG,UAAC,GAAW;IAC1C,OAAA,GAAG;SACA,WAAW,EAAE;SACb,KAAK,CAAC,GAAG,CAAC;SACV,GAAG,CAAC,UAAC,OAAO,IAAK,OAAA,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,EAAlD,CAAkD,CAAC;SACpE,IAAI,CAAC,EAAE,CAAC;AAJX,CAIW,CAAC;AALD,QAAA,gBAAgB,oBAKf;AACP,IAAM,eAAe,GAAG,UAAC,GAAW,IAAK,OAAA,GAAG,CAAC,OAAO,CAAC,UAAU,EAAE,UAAC,CAAS,IAAK,OAAA,WAAI,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,CAAE,EAAxB,CAAwB,CAAC,EAAhE,CAAgE,CAAC;AAApG,QAAA,eAAe,mBAAqF"}

package/dist/react-bindings/react-component-lib/utils/case.ts

@@ -0,0 +1,7 @@
+export const dashToPascalCase = (str: string) =>
+  str
+    .toLowerCase()
+    .split('-')
+    .map((segment) => segment.charAt(0).toUpperCase() + segment.slice(1))
+    .join('');
+export const camelToDashCase = (str: string) => str.replace(/([A-Z])/g, (m: string) => `-${m[0].toLowerCase()}`);

package/dist/react-bindings/react-component-lib/utils/dev.d.ts

@@ -0,0 +1,2 @@
+export declare const isDevMode: () => boolean;
+export declare const deprecationWarning: (key: string, message: string) => void;

package/dist/react-bindings/react-component-lib/utils/dev.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.deprecationWarning=exports.isDevMode=void 0;var isDevMode=function(){return process&&process.env&&"development"===process.env.NODE_ENV};exports.isDevMode=isDevMode;var warnings={},deprecationWarning=function(e,n){(0,exports.isDevMode)()&&(warnings[e]||(console.warn(n),warnings[e]=!0))};exports.deprecationWarning=deprecationWarning;

package/dist/react-bindings/react-component-lib/utils/dev.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dev.js","sourceRoot":"","sources":["dev.ts"],"names":[],"mappings":";;;AAAO,IAAM,SAAS,GAAG;IACvB,OAAO,OAAO,IAAI,OAAO,CAAC,GAAG,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,aAAa,CAAC;AAC1E,CAAC,CAAC;AAFW,QAAA,SAAS,aAEpB;AAEF,IAAM,QAAQ,GAA+B,EAAE,CAAC;AAEzC,IAAM,kBAAkB,GAAG,UAAC,GAAW,EAAE,OAAe;IAC7D,IAAI,IAAA,iBAAS,GAAE,EAAE,CAAC;QAChB,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YACnB,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACtB,QAAQ,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;QACvB,CAAC;IACH,CAAC;AACH,CAAC,CAAC;AAPW,QAAA,kBAAkB,sBAO7B"}

package/dist/react-bindings/react-component-lib/utils/dev.ts

@@ -0,0 +1,14 @@
+export const isDevMode = () => {
+  return process && process.env && process.env.NODE_ENV === 'development';
+};
+
+const warnings: { [key: string]: boolean } = {};
+
+export const deprecationWarning = (key: string, message: string) => {
+  if (isDevMode()) {
+    if (!warnings[key]) {
+      console.warn(message);
+      warnings[key] = true;
+    }
+  }
+};

package/dist/react-bindings/react-component-lib/utils/index.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { StyleReactProps } from '../interfaces';
+export type StencilReactExternalProps<PropType, ElementType> = PropType & Omit<React.HTMLAttributes<ElementType>, 'style'> & StyleReactProps;
+export type StencilReactForwardedRef<T> = ((instance: T | null) => void) | React.MutableRefObject<T | null> | null;
+export declare const setRef: (ref: StencilReactForwardedRef<any> | React.Ref<any> | undefined, value: any) => void;
+export declare const mergeRefs: (...refs: (StencilReactForwardedRef<any> | React.Ref<any> | undefined)[]) => React.RefCallback<any>;
+export declare const createForwardRef: <PropType, ElementType>(ReactComponent: any, displayName: string) => React.ForwardRefExoticComponent<React.PropsWithoutRef<PropType & Omit<React.HTMLAttributes<ElementType>, "style"> & StyleReactProps> & React.RefAttributes<ElementType>>;
+export declare const defineCustomElement: (tagName: string, customElement: any) => void;
+export * from './attachProps';
+export * from './case';

package/dist/react-bindings/react-component-lib/utils/index.js

@@ -0,0 +1 @@
+"use strict";var __assign=this&&this.__assign||function(){return __assign=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var o in t=arguments[r])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},__assign.apply(this,arguments)},__createBinding=this&&this.__createBinding||(Object.create?function(e,t,r,n){void 0===n&&(n=r);var o=Object.getOwnPropertyDescriptor(t,r);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,n,o)}:function(e,t,r,n){void 0===n&&(n=r),e[n]=t[r]}),__exportStar=this&&this.__exportStar||function(e,t){for(var r in e)"default"===r||Object.prototype.hasOwnProperty.call(t,r)||__createBinding(t,e,r)},__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.defineCustomElement=exports.createForwardRef=exports.mergeRefs=exports.setRef=void 0;var react_1=__importDefault(require("react")),setRef=function(e,t){"function"==typeof e?e(t):null!=e&&(e.current=t)};exports.setRef=setRef;var mergeRefs=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return function(t){e.forEach(function(e){(0,exports.setRef)(e,t)})}};exports.mergeRefs=mergeRefs;var createForwardRef=function(e,t){var r=function(t,r){return react_1.default.createElement(e,__assign({},t,{forwardedRef:r}))};return r.displayName=t,react_1.default.forwardRef(r)};exports.createForwardRef=createForwardRef;var defineCustomElement=function(e,t){void 0===t||"undefined"==typeof customElements||customElements.get(e)||customElements.define(e,t)};exports.defineCustomElement=defineCustomElement,__exportStar(require("./attachProps"),exports),__exportStar(require("./case"),exports);

package/dist/react-bindings/react-component-lib/utils/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAWnB,IAAM,MAAM,GAAG,UAAC,GAA+D,EAAE,KAAU;IAChG,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE,CAAC;QAC9B,GAAG,CAAC,KAAK,CAAC,CAAC;IACb,CAAC;SAAM,IAAI,GAAG,IAAI,IAAI,EAAE,CAAC;QACvB,gDAAgD;QAC/C,GAAmC,CAAC,OAAO,GAAG,KAAK,CAAC;IACvD,CAAC;AACH,CAAC,CAAC;AAPW,QAAA,MAAM,UAOjB;AAEK,IAAM,SAAS,GAAG;IACvB,cAAuE;SAAvE,UAAuE,EAAvE,qBAAuE,EAAvE,IAAuE;QAAvE,yBAAuE;;IAEvE,OAAO,UAAC,KAAU;QAChB,IAAI,CAAC,OAAO,CAAC,UAAC,GAAG;YACf,IAAA,cAAM,EAAC,GAAG,EAAE,KAAK,CAAC,CAAC;QACrB,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;AACJ,CAAC,CAAC;AARW,QAAA,SAAS,aAQpB;AAEK,IAAM,gBAAgB,GAAG,UAAwB,cAAmB,EAAE,WAAmB;IAC9F,IAAM,UAAU,GAAG,UACjB,KAAuD,EACvD,GAA0C;QAE1C,OAAO,8BAAC,cAAc,eAAK,KAAK,IAAE,YAAY,EAAE,GAAG,IAAI,CAAC;IAC1D,CAAC,CAAC;IACF,UAAU,CAAC,WAAW,GAAG,WAAW,CAAC;IAErC,OAAO,eAAK,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC;AACtC,CAAC,CAAC;AAVW,QAAA,gBAAgB,oBAU3B;AAEK,IAAM,mBAAmB,GAAG,UAAC,OAAe,EAAE,aAAkB;IACrE,IAAI,aAAa,KAAK,SAAS,IAAI,OAAO,cAAc,KAAK,WAAW,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;QACzG,cAAc,CAAC,MAAM,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;IAChD,CAAC;AACH,CAAC,CAAC;AAJW,QAAA,mBAAmB,uBAI9B;AAEF,gDAA8B;AAC9B,yCAAuB"}

package/dist/react-bindings/react-component-lib/utils/index.tsx

@@ -0,0 +1,50 @@
+import React from 'react';
+
+import type { StyleReactProps } from '../interfaces';
+
+export type StencilReactExternalProps<PropType, ElementType> = PropType &
+  Omit<React.HTMLAttributes<ElementType>, 'style'> &
+  StyleReactProps;
+
+// This will be replaced with React.ForwardedRef when react-output-target is upgraded to React v17
+export type StencilReactForwardedRef<T> = ((instance: T | null) => void) | React.MutableRefObject<T | null> | null;
+
+export const setRef = (ref: StencilReactForwardedRef<any> | React.Ref<any> | undefined, value: any) => {
+  if (typeof ref === 'function') {
+    ref(value);
+  } else if (ref != null) {
+    // Cast as a MutableRef so we can assign current
+    (ref as React.MutableRefObject<any>).current = value;
+  }
+};
+
+export const mergeRefs = (
+  ...refs: (StencilReactForwardedRef<any> | React.Ref<any> | undefined)[]
+): React.RefCallback<any> => {
+  return (value: any) => {
+    refs.forEach((ref) => {
+      setRef(ref, value);
+    });
+  };
+};
+
+export const createForwardRef = <PropType, ElementType>(ReactComponent: any, displayName: string) => {
+  const forwardRef = (
+    props: StencilReactExternalProps<PropType, ElementType>,
+    ref: StencilReactForwardedRef<ElementType>
+  ) => {
+    return <ReactComponent {...props} forwardedRef={ref} />;
+  };
+  forwardRef.displayName = displayName;
+
+  return React.forwardRef(forwardRef);
+};
+
+export const defineCustomElement = (tagName: string, customElement: any) => {
+  if (customElement !== undefined && typeof customElements !== 'undefined' && !customElements.get(tagName)) {
+    customElements.define(tagName, customElement);
+  }
+};
+
+export * from './attachProps';
+export * from './case';

package/index.js

@@ -1 +1 @@
-import Modal from"./Modal";import"../core/src/i18n/i18n-setup.mjs";export{Modal};
+import Modal from"./Modal";export{Modal};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@department-of-veterans-affairs/component-library",
   "description": "VA.gov component library. Includes React and web components.",
-  "version": "54.5.0",
+  "version": "54.5.2",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -19,9 +19,8 @@
   "types": "dist/components/types/index.d.ts",
   "module": "src/main.js",
   "dependencies": {
-    "@department-of-veterans-affairs/react-components": "28.2.0",
-    "@department-of-veterans-affairs/web-components": "22.5.0",
-    "@stencil/react-output-target": "1.2.0",
+    "@department-of-veterans-affairs/react-components": "28.2.2",
+    "@department-of-veterans-affairs/web-components": "22.5.1",
     "i18next": "25.6.0",
     "i18next-browser-languagedetector": "8.2.0",
     "react-focus-on": "3.5.4",

package/Modal.unit.spec.js

@@ -1 +0,0 @@
-"use strict";var _react=_interopRequireDefault(require("react")),_sinon=_interopRequireDefault(require("sinon")),_enzyme=require("enzyme"),_chai=require("chai"),_testHelpers=require("./test-helpers"),_Modal=_interopRequireDefault(require("./Modal.jsx"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}describe("<Modal/>",function(){it("should render",function(){var e=(0,_enzyme.mount)(_react.default.createElement(_Modal.default,{id:"modal",title:"Modal title",visible:!0,onClose:function(){}},"Modal contents"));(0,_chai.expect)(e.text()).to.contain("Modal contents"),e.unmount()}),it("should have an <h1> as the heading",function(){var e=(0,_enzyme.mount)(_react.default.createElement(_Modal.default,{title:"Modal title",visible:!0,onClose:function(){}},"Some content"));(0,_chai.expect)(e.find("h1").text()).to.equal("Modal title"),e.unmount()}),describe("event listeners",function(){var e,t=function(e,t){return e.filter(function(e){return e.firstArg===t})};before(function(){_sinon.default.spy(global.document,"addEventListener"),_sinon.default.spy(global.document,"removeEventListener")}),after(function(){global.document.addEventListener.restore(),global.document.removeEventListener.restore()}),it("should set up a keydown and a click listener",function(){e=(0,_enzyme.mount)(_react.default.createElement(_Modal.default,{id:"modal",title:"Modal title",visible:!0,clickToClose:!0,onClose:function(){}},"Modal contents"));var n=global.document.addEventListener.getCalls();(0,_chai.expect)(t(n,"keydown").length).to.be.at.least(1),(0,_chai.expect)(t(n,"click").length).to.be.at.least(1)}),it("should tear down keydown and click listeners when the modal is closed",function(){e.unmount();var n=global.document.removeEventListener.getCalls();(0,_chai.expect)(t(n,"keydown").length).to.be.at.least(1),(0,_chai.expect)(t(n,"click").length).to.be.at.least(1)})}),it("should pass aXe check",function(){return(0,_testHelpers.axeCheck)(_react.default.createElement(_Modal.default,{id:"modal",title:"aXe Check",visible:!0,onClose:function(){}}))}),describe("programmatic focus",function(){var e;before(function(){e=document.createElement("div"),global.document.body.appendChild(e)}),after(function(){global.document.body.removeChild(e)}),it("should open with focus assigned to the close button",function(){var t=(0,_enzyme.mount)(_react.default.createElement(_Modal.default,{id:"modal",title:"Programmatic focus",visible:!0,onClose:function(){}},_react.default.createElement("button",{id:"first-button"},"First button"),_react.default.createElement("button",{id:"second-button"},"Second button")),{attachTo:e});(0,_chai.expect)(global.document.activeElement.className).to.equal("va-modal-close"),t.unmount()}),it("should open with focus assigned to the first button when the close button is turned off",function(){var t=(0,_enzyme.mount)(_react.default.createElement(_Modal.default,{id:"modal",title:"Programmatic focus",visible:!0,hideCloseButton:!0,onClose:function(){}},_react.default.createElement("button",{id:"first-button"},"First button"),_react.default.createElement("button",{id:"second-button"},"Second button")),{attachTo:e});(0,_chai.expect)(global.document.activeElement.id).to.equal("first-button"),t.unmount()}),it("should start on the first element matching initialFocusSelector if specified",function(){var t=(0,_enzyme.mount)(_react.default.createElement(_Modal.default,{id:"modal",title:"My modal",visible:!0,hideCloseButton:!0,onClose:function(){},initialFocusSelector:"#second-button"},_react.default.createElement("button",{id:"first-button"},"First button"),_react.default.createElement("button",{id:"second-button"},"Second button")),{attachTo:e});(0,_chai.expect)(global.document.activeElement.id).to.equal("second-button"),t.unmount()}),it("should include the title in the close button aria label if given",function(){var t=(0,_enzyme.mount)(_react.default.createElement(_Modal.default,{id:"modal",title:"Programmatic focus",visible:!0,onClose:function(){}},_react.default.createElement("button",{id:"first-button"},"First button"),_react.default.createElement("button",{id:"second-button"},"Second button")),{attachTo:e});(0,_chai.expect)(global.document.activeElement.ariaLabel).to.equal("close Programmatic focus modal"),t.unmount()}),it("should not include the title in the close button aria label when not given",function(){var t=(0,_enzyme.mount)(_react.default.createElement(_Modal.default,{id:"modal",visible:!0,onClose:function(){}},_react.default.createElement("button",{id:"first-button"},"First button"),_react.default.createElement("button",{id:"second-button"},"Second button")),{attachTo:e});(0,_chai.expect)(global.document.activeElement.ariaLabel).to.equal("close modal"),t.unmount()})}),describe("analytics event",function(){it("should be triggered when modal is visible",function(){var e=_sinon.default.spy();global.document.body.addEventListener("component-library-analytics",e);var t=(0,_enzyme.mount)(_react.default.createElement(_Modal.default,{id:"modal",visible:!0,clickToClose:!0,onClose:function(){}},"Modal contents"));(0,_chai.expect)(e.calledWith(_sinon.default.match.has("detail",{componentName:"Modal",action:"show",details:{status:void 0,title:void 0,primaryButtonText:void 0,secondaryButtonText:void 0},version:_sinon.default.match.string}))).to.be.true,global.document.body.removeEventListener("component-library-analytics",e),t.unmount()}),it("should include title when present",function(){var e=_sinon.default.spy();global.document.body.addEventListener("component-library-analytics",e);var t=(0,_enzyme.mount)(_react.default.createElement(_Modal.default,{id:"modal",visible:!0,title:"My modal title",clickToClose:!0,onClose:function(){}},"Modal contents"));(0,_chai.expect)(e.calledWith(_sinon.default.match.has("detail",{componentName:"Modal",action:"show",details:{status:void 0,title:"My modal title",primaryButtonText:void 0,secondaryButtonText:void 0},version:_sinon.default.match.string}))).to.be.true,global.document.body.removeEventListener("component-library-analytics",e),t.unmount()})})});

package/dist/components/p-169f3a43.js

@@ -1 +0,0 @@
-import{p as proxyCustomElement,H,d as createEvent,f as forceUpdate,h,c as Host}from"./p-ef5c0d66.js";import"./p-6a3cf3d7.js";import{i as instance}from"./p-a836c3e1.js";const iconHttpsSvg="data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjY0IiB2aWV3Qm94PSIwIDAgNjQgNjQiIHdpZHRoPSI2NCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtMzIgMGMxNy42NzMgMCAzMiAxNC4zMjcgMzIgMzJzLTE0LjMyNyAzMi0zMiAzMi0zMi0xNC4zMjctMzItMzIgMTQuMzI3LTMyIDMyLTMyem0wIDEuMjA4Yy0xNy4wMDYgMC0zMC43OTIgMTMuNzg2LTMwLjc5MiAzMC43OTJzMTMuNzg2IDMwLjc5MiAzMC43OTIgMzAuNzkyIDMwLjc5Mi0xMy43ODYgMzAuNzkyLTMwLjc5Mi0xMy43ODYtMzAuNzkyLTMwLjc5Mi0zMC43OTJ6bTAgMTguODg2YTcuMjQ1IDcuMjQ1IDAgMCAxIDcuMjQ1IDcuMjQ1djMuMTAzaC41MmMuODYgMCAxLjU1Ny42OTggMS41NTcgMS41NTh2OS4zMjJjMCAuODYtLjY5NyAxLjU1OC0xLjU1NyAxLjU1OGgtMTUuNTNjLS44NiAwLTEuNTU3LS42OTctMS41NTctMS41NTh2LTkuMzIyYzAtLjg2LjY5Ny0xLjU1OCAxLjU1Ny0xLjU1OGguNTJ2LTMuMTAyYTcuMjQ1IDcuMjQ1IDAgMCAxIDcuMjQ1LTcuMjQ2em0wIDMuMTAzYTQuMTQyIDQuMTQyIDAgMCAwIC00LjE0MiA0LjE0MnYzLjEwM2g4LjI4NHYtMy4xMDJhNC4xNDIgNC4xNDIgMCAwIDAgLTQuMTQyLTQuMTQzeiIgZmlsbD0iIzcxOWYyYSIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+",iconDotGovSvg="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjY0IiBoZWlnaHQ9IjY0IiB2aWV3Qm94PSIwIDAgNjQgNjQiPjx0aXRsZT5pY29uLWRvdC1nb3Y8L3RpdGxlPjxwYXRoIGZpbGw9IiMyMzc4QzMiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTMyIDBjMTcuNjczIDAgMzIgMTQuMzI3IDMyIDMyIDAgMTcuNjczLTE0LjMyNyAzMi0zMiAzMkMxNC4zMjcgNjQgMCA0OS42NzMgMCAzMiAwIDE0LjMyNyAxNC4zMjcgMCAzMiAwem0wIDEuMjA4QzE0Ljk5NCAxLjIwOCAxLjIwOCAxNC45OTQgMS4yMDggMzJTMTQuOTk0IDYyLjc5MiAzMiA2Mi43OTIgNjIuNzkyIDQ5LjAwNiA2Mi43OTIgMzIgNDkuMDA2IDEuMjA4IDMyIDEuMjA4em0xMC41OSAzOC44NThhLjg1Ny44NTcgMCAwIDEgLjg4Mi44MjJ2MS42NDJIMTguODg2di0xLjY0MmEuODU3Ljg1NyAwIDAgMSAuODgyLS44MjJINDIuNTl6TTI1LjQ0MyAyNy43NzR2OS44MjloMS42NDJ2LTkuODNoMy4yNzN2OS44M0gzMnYtOS44M2gzLjI3MnY5LjgzaDEuNjQzdi05LjgzaDMuMjcydjkuODNoLjc2YS44NTcuODU3IDAgMCAxIC44ODIuODIxdi44MjFoLTIxLjN2LS44MDlhLjg1Ny44NTcgMCAwIDEgLjg4LS44MmguNzYydi05Ljg0MmgzLjI3MnptNS43MzYtOC4xODhsMTIuMjkzIDQuOTE1djEuNjQyaC0xLjYzYS44NTcuODU3IDAgMCAxLS44ODIuODIySDIxLjQxYS44NTcuODU3IDAgMCAxLS44ODItLjgyMmgtMS42NDJ2LTEuNjQybDEyLjI5My00LjkxNXoiLz48L3N2Zz4=",vaOfficialGovBannerCss='p,a,ol,ul,li,dl,dt,dd,form,label,button{font-family:Source Sans Pro Web, "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans;font-size:1.06rem;line-height:1.5}:host{display:block}.banner{background-color:#f0f0f0;font-size:12px;line-height:1.5;padding-bottom:0}.accordion{color:#1b1b1b;line-height:1.5;list-style-type:none;margin:0;padding:0;width:100%}.grid-col-fill{-ms-flex:1 1 0%;flex:1 1 0%;min-width:1px}.grid-col-auto,.grid-col-fill{-ms-flex:0 1 auto;flex:0 1 auto;width:auto;max-width:100%}.grid-row{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-left:-0.469rem;margin-right:-0.469rem;margin-top:0;margin-bottom:0}.col{-ms-flex-align:start;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex:0 0 46%;flex:0 0 46%;padding-left:0.469rem;padding-right:0.469rem}@media (max-width: 767px){.col{-ms-flex:unset;flex:unset}}#header{padding-bottom:6px;padding-top:6px;position:relative}#header.expanded .header-action{display:none}@media (max-width: 767px){#header{min-height:32px}#header.expanded{padding-right:56px}}.inner{margin-left:auto;margin-right:auto;max-width:1024px;padding-left:16px;padding-right:16px;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:start;align-items:flex-start;padding-right:0}.header-flag{float:left;margin-right:8px;width:16px}.header-text{font-size:12px;margin-bottom:2px;margin-right:5px;margin-top:2px;line-height:1.1}.header-action{color:#005ea2;font-size:12px;line-height:1.1;margin-bottom:0;margin-top:2px;text-decoration:underline}@media (min-width: 768px){.header-action{display:none}}button:not([disabled]):focus{outline:2px solid var(--vads-color-action-focus-on-light)}button[aria-expanded=false],button[aria-expanded=true]{background-image:none}@media (max-width: 767px){button{width:100%}}button{border:0;color:#005ea2;font-size:12px;margin:0;margin-left:0.313rem;padding-left:0;padding-right:0;position:relative}@media (max-width: 767px){button{-webkit-font-smoothing:inherit;background-color:transparent;border:0;border-radius:0;-webkit-box-shadow:none;box-shadow:none;margin:0;margin-bottom:-4px;text-align:left;left:0;position:absolute;bottom:0;top:0;color:#005ea2;display:block;height:auto;line-height:1.1;padding:0;text-decoration:none;width:100%}}button:hover{color:#1a4480;cursor:pointer}.button-text{position:absolute;left:-999em;right:auto;text-decoration:underline}@media (min-width: 768px){.button-text{position:static;display:inline}}@media (max-width: 767px){#header .header-action::after,#header.expanded .header-action::after{background-color:#005ea2}#header.expanded .header-action::after,#header .header-action::after{background:0 0;background-color:#005ea2;-webkit-mask: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%22M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z%22%2F%3E%3C%2Fsvg%3E") no-repeat center/contain;mask: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%22M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z%22%2F%3E%3C%2Fsvg%3E") no-repeat center/contain;display:inline-block;height:18px;width:18px;content:"";vertical-align:middle;margin-left:2px}}@media (min-width: 768px){button::after,button:hover::after{background-color:#005ea2;position:absolute}button::after,#header.expanded button::after{background:0 0;background-color:#005ea2;display:inline-block;height:18px;width:18px;content:"";vertical-align:middle;margin-left:2px;top:-1px}button::after{-webkit-mask: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%22M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z%22%2F%3E%3C%2Fsvg%3E") no-repeat center/contain;mask: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%22M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z%22%2F%3E%3C%2Fsvg%3E") no-repeat center/contain}#header.expanded button::after{-webkit-mask: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%22m12 8-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z%22%2F%3E%3C%2Fsvg%3E") no-repeat center/contain;mask: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%22m12 8-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z%22%2F%3E%3C%2Fsvg%3E") no-repeat center/contain}}@media (max-width: 767px){button[aria-expanded=true]:after{bottom:0;top:0;position:absolute;right:0}@supports ((-webkit-mask: url()) or (mask: url())){button[aria-expanded=true]::after{background:0 0;background-color:#005ea2 !important;-webkit-mask: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 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z%22%2F%3E%3C%2Fsvg%3E") no-repeat center/24px 24px;mask: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 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z%22%2F%3E%3C%2Fsvg%3E") no-repeat center/24px 24px}}button[aria-expanded=true]::after,button[aria-expanded=true]:before{position:absolute;content:"";height:48px;width:48px;bottom:0;top:0;right:0}button[aria-expanded=true]::after{background:0 0;background-color:#005ea2;-webkit-mask: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 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z%22%2F%3E%3C%2Fsvg%3E") no-repeat center/contain;mask: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 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z%22%2F%3E%3C%2Fsvg%3E") no-repeat center/contain;display:inline-block;height:48px;width:48px;content:"";vertical-align:middle;margin-left:0}button[aria-expanded=true]:before{background-color:#dfe1e2;display:block}}button::after{position:absolute}.content{margin-left:auto;margin-right:auto;max-width:1024px;background-color:transparent;font-size:16px;overflow:hidden;padding:24px 32px 16px 16px}.content img{-ms-flex-negative:0;flex-shrink:0;margin-right:8px;width:45px}.content .media-block{-ms-flex:1 1 0%;flex:1 1 0%}.content svg{height:1.5ex;width:1.21875ex}.content p{margin-top:0;-webkit-margin-after:1em;margin-block-end:1em}',VaOfficialGovBannerStyle0=vaOfficialGovBannerCss,VaOfficialGovBanner=proxyCustomElement(class extends H{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.componentLibraryAnalytics=createEvent(this,"component-library-analytics",7),this.handleClick=()=>{var e,t,a;const i=null===(e=this.el.shadowRoot)||void 0===e?void 0:e.querySelector(".content"),o=null===(t=this.el.shadowRoot)||void 0===t?void 0:t.querySelector("button"),n=null===(a=this.el.shadowRoot)||void 0===a?void 0:a.querySelector("div#header");if(o.setAttribute("aria-expanded","true"===o.getAttribute("aria-expanded")?"false":"true"),n.classList.toggle("expanded"),i.hidden?i.removeAttribute("hidden"):i.setAttribute("hidden","true"),!this.disableAnalytics){const e={componentName:"va-official-gov-banner",action:"true"===o.getAttribute("aria-expanded")?"expand":"collapse"};this.componentLibraryAnalytics.emit(e)}},this.govSiteExplanationText=()=>{var e;const t=null===(e=this.el.shadowRoot)||void 0===e?void 0:e.querySelector(".gov-site-explanation-text");if(t){const e=instance.t("gov-site-explanation",{tld:this.tld});e&&(t.innerHTML=e.replace(`.${this.tld}`,`<strong>.${this.tld}</strong>`))}},this.govSiteLockText=()=>{var e;const t=null===(e=this.el.shadowRoot)||void 0===e?void 0:e.querySelector(".gov-site-lock-text");let a=instance.t("gov-site-lock",{image:"SVG",tld:this.tld});a=a.replace("SVG",'(&nbsp;<span class="icon-lock"><svg xmlns="http://www.w3.org/2000/svg" width="52" height="64" viewBox="0 0 52 64" role="img" aria-labelledby="banner-lock-description" focusable="false">\n    <title id="banner-lock-title">Lock</title>\n    <desc id="banner-lock-description">Locked padlock icon</desc>\n    <path fill="#000000" fill-rule="evenodd" d="M26 0c10.493 0 19 8.507 19 19v9h3a4 4 0 0 1 4 4v28a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V32a4 4 0 0 1 4-4h3v-9C7 8.507 15.507 0 26 0zm0 8c-5.979 0-10.843 4.77-10.996 10.712L15 19v9h22v-9c0-6.075-4.925-11-11-11z"></path>\n    </svg></span>&nbsp;)'),a=a.replace("lock","<strong>lock</strong>"),a=a.replace("candado","<strong>candado</strong>"),a=a.replace("https://","<strong>https://</strong>"),t&&(t.innerHTML=a)},this.disableAnalytics=!1,this.tld="gov"}connectedCallback(){instance.on("languageChanged",()=>{forceUpdate(this.el)})}disconnectedCallback(){instance.off("languageChanged")}componentDidLoad(){this.govSiteExplanationText(),this.govSiteLockText()}render(){const{tld:e}=this;if("gov"===e||"mil"===e)return h(Host,{key:"87c94f819bedd589bf5453ba1c5d27120343241b"},h("div",{key:"39702c2c31eaa09c111e97d6081f6890725df283",class:"banner"},h("div",{key:"25f6b9f1fb101022f7df9040ac5317f4ef480c96",class:"accordion"},h("div",{key:"ee29058c66774758a5c2ce115be630f750566899",id:"header"},h("div",{key:"ffa496519054b0e8104b4ad97b859bd0c3e1193b",class:"inner"},h("div",{key:"402a5ea25f5fbc423a93e65afba9f7cc61ddf28b",class:"grid-col-auto"},h("img",{key:"1fbd820480e6e69c03e175565e28a52dac1fe613",role:"presentation",class:"header-flag",src:"https://s3-us-gov-west-1.amazonaws.com/content.www.va.gov/img/tiny-usa-flag.png",alt:""})),h("div",{key:"6ef48abb781dcd4de16b63e2a2850cb12648db52",class:"grid-col-fill","aria-hidden":"true"},h("p",{key:"5ff464b67bbec74f0a099fc5d6209657591a9774",class:"header-text"},instance.t("gov-site-label")),h("p",{key:"efea58389527a679fcf62fa463fe8e4d4f4ffe15",class:"header-action"},instance.t("gov-site-button"))),h("button",{key:"06977b9e3e1c7953f0d8e29d8902b8b7ee60ba95",onClick:this.handleClick,type:"button","aria-expanded":"false","aria-controls":"official-gov-banner"},h("span",{key:"99ea65054c7956c7140431b2c494b3b3cbf086f2",class:"button-text"},instance.t("gov-site-button"))))),h("div",{key:"e7bc27c4abe992ea6f52c727fcfc2ad4d6953697",class:"content",id:"official-gov-banner",hidden:!0},h("div",{key:"deebbcc4c4c21993bd680fae450c82df191520de",class:"grid-row"},h("div",{key:"6bf9816f8610e25bcca221a4ca78ba1476cea6a2",class:"col"},h("img",{key:"18db25b612a24bd797f16be4988c41ff5b92413a",src:iconDotGovSvg,role:"presentation",alt:""}),h("div",{key:"76cb154498c3a226ba25b9f35941998d5fa4b55b",class:"media-block"},h("p",{key:"67df93f4a0a57da991b24df97f7e561980615697"},h("strong",{key:"cee655729b121135a163c6d2fe857485b4186090"},instance.t("gov-site-website",{tld:e})),h("br",{key:"ad226e949d9e92d63b781f08c89d4aa3fef16495"}),h("span",{key:"2172a6c3402103a17e04b3e49e85804bd3a81f70",class:"gov-site-explanation-text"},this.govSiteExplanationText())))),h("div",{key:"e1b45eee5c7ba32c00e99f3e4cbbff1e68b9e983",class:"col"},h("img",{key:"571116a66a4e5b9eba917a6b6fd24046bb0a4125",src:iconHttpsSvg,role:"presentation",alt:""}),h("div",{key:"811a7296897918eb94171e8a44290287047fda78",class:"media-block"},h("p",{key:"79951b6559346e63548bca7a7c96f71293e42dbd"},h("strong",{key:"089ad9c2ac53c6d8da5af416ee89bdd7bd59243f"},instance.t("gov-site-https",{tld:e})),h("br",{key:"1b54dd3abeb051dd0b97dfd6c616024b30eb0dd5"}),h("span",{key:"f8a88e83bcac877a3649d1b20f81dd9c808bc9cc",class:"gov-site-lock-text"},this.govSiteLockText())))))))))}get el(){return this}static get style(){return VaOfficialGovBannerStyle0}},[1,"va-official-gov-banner",{disableAnalytics:[4,"disable-analytics"],tld:[1]}]);function defineCustomElement(){"undefined"!=typeof customElements&&["va-official-gov-banner"].forEach(e=>{"va-official-gov-banner"===e&&(customElements.get(e)||customElements.define(e,VaOfficialGovBanner))})}export{VaOfficialGovBanner as V,defineCustomElement as d};

package/dist/components/p-1cee576c.js

@@ -1 +0,0 @@
-import{p as proxyCustomElement,H,h,c as Host}from"./p-ef5c0d66.js";import{d as defineCustomElement$1}from"./p-9cd6282d.js";const vaCardCss=':host{display:block;position:relative;border:1px solid var(--vads-color-gray-medium);background-color:var(--vads-color-white);font-size:1rem;padding:var(--vads-spacing-2)}:host([show-shadow]:not([show-shadow=false])),:host([show-shadow]:not([show-shadow=false])[background]:not([background=false])){-webkit-box-shadow:1px 1px 5px 1px rgba(0, 0, 0, 0.32);box-shadow:1px 1px 5px 1px rgba(0, 0, 0, 0.32);border:1px solid var(--vads-color-gray-medium);background-color:var(--vads-color-white)}:host([background]:not([background=false])){background-color:var(--vads-color-base-lightest);border:none}.va-card__icon-wrapper{position:absolute;top:0;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);z-index:2;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;margin-bottom:0}.va-card__icon-circle{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;background-color:var(--vads-color-primary-darker);border-radius:50%;width:56px;height:56px;-webkit-box-shadow:0 2px 6px rgba(0, 0, 0, 0.08);box-shadow:0 2px 6px rgba(0, 0, 0, 0.08)}.va-card__icon-circle va-icon{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;color:var(--vads-color-white)}:host([icon-name]:not([icon-name=""])){padding-top:var(--vads-spacing-4);margin-top:28px}',VaCardStyle0=vaCardCss,VaCard=proxyCustomElement(class extends H{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.showShadow=!1,this.background=!1,this.iconName=void 0}render(){return h(Host,{key:"14a3fb82620d7d18233e2519004bfa8b97416f29"},this.iconName&&h("div",{key:"a8112c0220937e722b88b45bce48bcee1d44cfaa",class:"va-card__icon-wrapper"},h("span",{key:"231f85a062cebe5cfdd7b4615db58e38c3c6bbfb",class:"va-card__icon-circle"},h("va-icon",{key:"43a6cee8f2283328806b63a31be0b151e3b68521",icon:this.iconName,size:5}))),h("slot",{key:"de83322bc4051afb4b4a0c7a27387e2367a2003f"}))}static get style(){return VaCardStyle0}},[1,"va-card",{showShadow:[4,"show-shadow"],background:[4],iconName:[1,"icon-name"]}]);function defineCustomElement(){"undefined"!=typeof customElements&&["va-card","va-icon"].forEach(e=>{switch(e){case"va-card":customElements.get(e)||customElements.define(e,VaCard);break;case"va-icon":customElements.get(e)||defineCustomElement$1()}})}export{VaCard as V,defineCustomElement as d};