@noctuatech/uswds 0.0.28 → 0.0.30

package/target/lib/input-mask/input-mask.element.js

@@ -0,0 +1,106 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { attr, css, element, html, listen } from "@joist/element";
+import { PATTERN_CHARS, PatternChar, REG_EXPS, format } from "./format.js";
+let USAInputMaskElement = (() => {
+    let _classDecorators = [element({
+            tagName: "usa-input-mask",
+            shadowDom: [
+                css `
+      :host {
+        display: contents;
+      }
+    `,
+                html `<slot></slot>`,
+            ],
+        })];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = HTMLElement;
+    let _instanceExtraInitializers = [];
+    let _mask_decorators;
+    let _mask_initializers = [];
+    let _mask_extraInitializers = [];
+    let _onInput_decorators;
+    let _onKeyDown_decorators;
+    var USAInputMaskElement = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _mask_decorators = [attr()];
+            _onInput_decorators = [listen("input")];
+            _onKeyDown_decorators = [listen("keydown")];
+            __esDecorate(this, null, _mask_decorators, { kind: "accessor", name: "mask", static: false, private: false, access: { has: obj => "mask" in obj, get: obj => obj.mask, set: (obj, value) => { obj.mask = value; } }, metadata: _metadata }, _mask_initializers, _mask_extraInitializers);
+            __esDecorate(this, null, _onInput_decorators, { kind: "method", name: "onInput", static: false, private: false, access: { has: obj => "onInput" in obj, get: obj => obj.onInput }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(this, null, _onKeyDown_decorators, { kind: "method", name: "onKeyDown", static: false, private: false, access: { has: obj => "onKeyDown" in obj, get: obj => obj.onKeyDown }, metadata: _metadata }, null, _instanceExtraInitializers);
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            USAInputMaskElement = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+        #mask_accessor_storage = (__runInitializers(this, _instanceExtraInitializers), __runInitializers(this, _mask_initializers, ""));
+        get mask() { return this.#mask_accessor_storage; }
+        set mask(value) { this.#mask_accessor_storage = value; }
+        connectedCallback() {
+            for (const input of this.querySelectorAll("[mask]")) {
+                const { formatted } = format(input.value, this.#getMaskFor(input));
+                if (formatted) {
+                    input.value = formatted;
+                }
+            }
+        }
+        onInput(e) {
+            const input = e.target;
+            const selectionStart = input.selectionStart || 0;
+            const prev = input.value;
+            const mask = this.#getMaskFor(input);
+            const { formatted } = format(input.value, mask);
+            input.value = formatted;
+            const offset = input.value.length - prev.length;
+            const maskChar = mask[selectionStart - 1];
+            // check if the current value is not a space for characters and has an offset greater then 0
+            if (maskChar && !PATTERN_CHARS.includes(maskChar) && offset > 0) {
+                input.selectionStart = selectionStart + offset;
+                input.selectionEnd = selectionStart + offset;
+            }
+            else {
+                input.selectionStart = selectionStart;
+                input.selectionEnd = selectionStart;
+            }
+        }
+        onKeyDown(e) {
+            const input = e.target;
+            const mask = this.#getMaskFor(input);
+            const patternChar = mask[input.selectionStart || 0];
+            if (e.key.length === 1 && /^[a-z0-9]/i.test(e.key)) {
+                // check that the key is a single character and that it is a letter or number
+                if (input.value.length >= mask.length) {
+                    // prevent default once value is the same as the mask length
+                    e.preventDefault();
+                }
+                else if (patternChar === PatternChar.Number) {
+                    if (!REG_EXPS.Numbers.test(e.key)) {
+                        // if pattern char specifies number and is not
+                        e.preventDefault();
+                    }
+                }
+                else if (patternChar === PatternChar.Letter) {
+                    if (!REG_EXPS.Letters.test(e.key)) {
+                        // if pattern char specifies letter and is not
+                        e.preventDefault();
+                    }
+                }
+            }
+        }
+        #getMaskFor(input) {
+            return this.mask || input.getAttribute("mask") || "";
+        }
+        constructor() {
+            super(...arguments);
+            __runInitializers(this, _mask_extraInitializers);
+        }
+    };
+    return USAInputMaskElement = _classThis;
+})();
+export { USAInputMaskElement };
+//# sourceMappingURL=input-mask.element.js.map

package/target/lib/input-mask/input-mask.element.js.map

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

package/target/lib/input-mask/input-mask.stories.d.ts

@@ -0,0 +1,14 @@
+import type { StoryObj } from "@storybook/web-components";
+import type { USAInputMaskElement } from "./input-mask.element.js";
+declare const meta: {
+    title: string;
+    tags: string[];
+    render(args: USAInputMaskElement): import("lit-html").TemplateResult<1>;
+    argTypes: {};
+    args: {
+        mask: string;
+    };
+};
+export default meta;
+type Story = StoryObj<USAInputMaskElement>;
+export declare const Primary: Story;

package/target/lib/input-mask/input-mask.stories.js

@@ -0,0 +1,30 @@
+import { html } from "lit";
+// More on how to set up stories at: https://storybook.js.org/docs/writing-stories
+const meta = {
+    title: "input-mask",
+    tags: ["autodocs"],
+    render(args) {
+        return html `
+      <usa-input-mask>
+        <usa-input
+          name="phone"
+          placeholder=${args.mask}
+          autocomplete="off"
+          mask=${args.mask}
+        >
+          Phone:
+        </usa-input>
+      </usa-input-mask>
+    `;
+    },
+    argTypes: {},
+    args: {
+        mask: "(999) 999-9999",
+    },
+};
+export default meta;
+// More on writing stories with args: https://storybook.js.org/docs/writing-stories/args
+export const Primary = {
+    args: {},
+};
+//# sourceMappingURL=input-mask.stories.js.map

package/target/lib/input-mask/input-mask.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-mask.stories.js","sourceRoot":"","sources":["../../../src/lib/input-mask/input-mask.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAI3B,kFAAkF;AAClF,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,YAAY;IACnB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,MAAM,CAAC,IAAI;QACT,OAAO,IAAI,CAAA;;;;wBAIS,IAAI,CAAC,IAAI;;iBAEhB,IAAI,CAAC,IAAI;;;;;KAKrB,CAAC;IACJ,CAAC;IACD,QAAQ,EAAE,EAAE;IACZ,IAAI,EAAE;QACJ,IAAI,EAAE,gBAAgB;KACvB;CACkC,CAAC;AAEtC,eAAe,IAAI,CAAC;AAIpB,wFAAwF;AACxF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE;CACT,CAAC"}

package/target/lib/input-mask/input-mask.test.d.ts

@@ -0,0 +1,2 @@
+import "./input-mask.element.js";
+import "../input/input.element.js";

package/target/lib/input-mask/input-mask.test.js

@@ -0,0 +1,89 @@
+import "./input-mask.element.js";
+import "../input/input.element.js";
+import { assert, fixture, html } from "@open-wc/testing";
+import { format } from "./format.js";
+describe("format", () => {
+    it("should retrn the correct raw value", () => {
+        assert.deepEqual(format("(123) 456 7890", "(***) ***-****"), {
+            raw: "1234567890",
+            formatted: "(123) 456-7890",
+        });
+    });
+    it("should return a formatted phone number (***) ***-****", () => {
+        assert.deepEqual(format("1234567890", "(***) ***-****"), {
+            raw: "1234567890",
+            formatted: "(123) 456-7890",
+        });
+    });
+    it("should return a formatted phone number ***-***-****", () => {
+        assert.deepEqual(format("1234567890", "***-***-****"), {
+            raw: "1234567890",
+            formatted: "123-456-7890",
+        });
+    });
+    it("should only allow numbers", () => {
+        assert.deepEqual(format("304213abcd", "999-999-9999"), {
+            raw: "304213abcd",
+            formatted: "304-213-",
+        });
+    });
+    it("should only allow a mix of letters and numbers", () => {
+        assert.deepEqual(format("C94749", "A-99999"), {
+            raw: "C94749",
+            formatted: "C-94749",
+        });
+    });
+});
+describe("usa-input-mask", () => {
+    it("should format default value", async () => {
+        const el = await fixture(html `
+      <usa-input-mask mask="(999) 999-9999">
+        <input name="phone" value="1234567890" mask />
+      </usa-input-mask>
+    `);
+        const input = el.querySelector("input");
+        assert.equal(input?.value, "(123) 456-7890");
+    });
+    it("should update value when on input event", async () => {
+        const el = await fixture(html `
+      <usa-input-mask>
+        <input name="phone" mask="(999) 999-9999" />
+      </usa-input-mask>
+    `);
+        const input = el.querySelector("input");
+        if (input) {
+            input.value = "8888888888";
+            input.dispatchEvent(new Event("input", { bubbles: true }));
+        }
+        assert.equal(input?.value, "(888) 888-8888");
+    });
+});
+describe("usa-input-mask with usa-input", () => {
+    it("should format default value", async () => {
+        const el = await fixture(html `
+      <usa-input-mask mask="(999) 999-9999">
+        <usa-input name="phone" value="1234567890" id="TEST" mask></usa-input>
+      </usa-input-mask>
+    `);
+        const input = el.querySelector("usa-input");
+        assert.equal(input?.value, "(123) 456-7890");
+    });
+    it("should update value when on input event", async () => {
+        const el = await fixture(html `
+      <usa-input-mask>
+        <usa-input
+          name="phone"
+          value="1234567890"
+          mask="(999) 999-9999"
+        ></usa-input>
+      </usa-input-mask>
+    `);
+        const input = el.querySelector("usa-input");
+        if (input) {
+            input.value = "8888888888";
+            input.dispatchEvent(new Event("input", { bubbles: true }));
+        }
+        assert.equal(input?.value, "(888) 888-8888");
+    });
+});
+//# sourceMappingURL=input-mask.test.js.map

package/target/lib/input-mask/input-mask.test.js.map

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

package/target/lib/input-mask/maskable.element.d.ts

@@ -0,0 +1,5 @@
+export interface MaskableElement extends HTMLElement {
+    value: string;
+    selectionStart: number | null;
+    selectionEnd: number | null;
+}

package/target/lib/input-mask/maskable.element.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=maskable.element.js.map

package/target/lib/input-mask/maskable.element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"maskable.element.js","sourceRoot":"","sources":["../../../src/lib/input-mask/maskable.element.ts"],"names":[],"mappings":""}

package/target/lib/link/link.element.d.ts

@@ -0,0 +1,13 @@
+declare global {
+    interface HTMLElementTagNameMap {
+        "usa-link": USALinkElement;
+    }
+}
+export declare class USALinkElement extends HTMLElement {
+    #private;
+    accessor href: string;
+    accessor target: "_blank" | "_parent" | "_self" | "_top" | "";
+    accessor title: string;
+    accessor disabled: boolean;
+    attributeChangedCallback(attr: string): void;
+}

package/target/lib/link/link.element.js

@@ -0,0 +1,93 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { attr, css, element, html, query } from "@joist/element";
+let USALinkElement = (() => {
+    let _classDecorators = [element({
+            tagName: "usa-link",
+            shadowDom: [
+                css `
+      :host {
+        display: inline-flex;
+        color: #005ea2;
+        text-decoration: underline;
+      }
+
+      a {
+        color: inherit;
+        text-decoration: inherit;
+        display: inherit;
+      }
+    `,
+                html `
+      <a>
+        <slot></slot>
+      </a>
+    `,
+            ],
+        })];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = HTMLElement;
+    let _href_decorators;
+    let _href_initializers = [];
+    let _href_extraInitializers = [];
+    let _target_decorators;
+    let _target_initializers = [];
+    let _target_extraInitializers = [];
+    let _title_decorators;
+    let _title_initializers = [];
+    let _title_extraInitializers = [];
+    let _disabled_decorators;
+    let _disabled_initializers = [];
+    let _disabled_extraInitializers = [];
+    var USALinkElement = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _href_decorators = [attr()];
+            _target_decorators = [attr()];
+            _title_decorators = [attr()];
+            _disabled_decorators = [attr({
+                    observed: false,
+                })];
+            __esDecorate(this, null, _href_decorators, { kind: "accessor", name: "href", static: false, private: false, access: { has: obj => "href" in obj, get: obj => obj.href, set: (obj, value) => { obj.href = value; } }, metadata: _metadata }, _href_initializers, _href_extraInitializers);
+            __esDecorate(this, null, _target_decorators, { kind: "accessor", name: "target", static: false, private: false, access: { has: obj => "target" in obj, get: obj => obj.target, set: (obj, value) => { obj.target = value; } }, metadata: _metadata }, _target_initializers, _target_extraInitializers);
+            __esDecorate(this, null, _title_decorators, { kind: "accessor", name: "title", static: false, private: false, access: { has: obj => "title" in obj, get: obj => obj.title, set: (obj, value) => { obj.title = value; } }, metadata: _metadata }, _title_initializers, _title_extraInitializers);
+            __esDecorate(this, null, _disabled_decorators, { kind: "accessor", name: "disabled", static: false, private: false, access: { has: obj => "disabled" in obj, get: obj => obj.disabled, set: (obj, value) => { obj.disabled = value; } }, metadata: _metadata }, _disabled_initializers, _disabled_extraInitializers);
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            USALinkElement = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+        #href_accessor_storage = __runInitializers(this, _href_initializers, "");
+        get href() { return this.#href_accessor_storage; }
+        set href(value) { this.#href_accessor_storage = value; }
+        #target_accessor_storage = (__runInitializers(this, _href_extraInitializers), __runInitializers(this, _target_initializers, ""));
+        get target() { return this.#target_accessor_storage; }
+        set target(value) { this.#target_accessor_storage = value; }
+        #title_accessor_storage = (__runInitializers(this, _target_extraInitializers), __runInitializers(this, _title_initializers, ""));
+        get title() { return this.#title_accessor_storage; }
+        set title(value) { this.#title_accessor_storage = value; }
+        #disabled_accessor_storage = (__runInitializers(this, _title_extraInitializers), __runInitializers(this, _disabled_initializers, false));
+        get disabled() { return this.#disabled_accessor_storage; }
+        set disabled(value) { this.#disabled_accessor_storage = value; }
+        #anchor = (__runInitializers(this, _disabled_extraInitializers), query("a"));
+        attributeChangedCallback(attr) {
+            const anchor = this.#anchor();
+            switch (attr) {
+                case "href":
+                    anchor.href = this.href;
+                    break;
+                case "target":
+                    anchor.target = this.target;
+                    break;
+                case "title":
+                    anchor.target = this.title;
+                    break;
+            }
+        }
+    };
+    return USALinkElement = _classThis;
+})();
+export { USALinkElement };
+//# sourceMappingURL=link.element.js.map

package/target/lib/link/link.element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.element.js","sourceRoot":"","sources":["../../../src/lib/link/link.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;IA+BpD,cAAc;4BAvB1B,OAAO,CAAC;YACP,OAAO,EAAE,UAAU;YACnB,SAAS,EAAE;gBACT,GAAG,CAAA;;;;;;;;;;;;KAYF;gBACD,IAAI,CAAA;;;;KAIH;aACF;SACF,CAAC;;;;sBACkC,WAAW;;;;;;;;;;;;;8BAAnB,SAAQ,WAAW;;;;gCAC5C,IAAI,EAAE;kCAGN,IAAI,EAAE;iCAGN,IAAI,EAAE;oCAGN,IAAI,CAAC;oBACJ,QAAQ,EAAE,KAAK;iBAChB,CAAC;YAVF,iKAAS,IAAI,6BAAJ,IAAI,mFAAM;YAGnB,uKAAS,MAAM,6BAAN,MAAM,uFAAoD;YAGnE,oKAAS,KAAK,6BAAL,KAAK,qFAAM;YAKpB,6KAAS,QAAQ,6BAAR,QAAQ,2FAAS;YAb5B,6KAkCC;;;YAlCY,uDAAc;;QAEzB,qEAAgB,EAAE,EAAC;QAAnB,IAAS,IAAI,0CAAM;QAAnB,IAAS,IAAI,gDAAM;QAGnB,4HAAgE,EAAE,GAAC;QAAnE,IAAS,MAAM,4CAAoD;QAAnE,IAAS,MAAM,kDAAoD;QAGnE,4HAAiB,EAAE,GAAC;QAApB,IAAS,KAAK,2CAAM;QAApB,IAAS,KAAK,iDAAM;QAKpB,iIAAoB,KAAK,GAAC;QAA1B,IAAS,QAAQ,8CAAS;QAA1B,IAAS,QAAQ,oDAAS;QAE1B,OAAO,0DAAG,KAAK,CAAC,GAAG,CAAC,EAAC;QAErB,wBAAwB,CAAC,IAAY;YACnC,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,EAAE,CAAC;YAE9B,QAAQ,IAAI,EAAE,CAAC;gBACb,KAAK,MAAM;oBACT,MAAM,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;oBACxB,MAAM;gBAER,KAAK,QAAQ;oBACX,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;oBAC5B,MAAM;gBAER,KAAK,OAAO;oBACV,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC;oBAC3B,MAAM;YACV,CAAC;QACH,CAAC;;;;SAjCU,cAAc"}

package/target/lib/link/link.stories.d.ts

@@ -0,0 +1,16 @@
+import type { StoryObj } from "@storybook/web-components";
+import type { USALinkElement } from "./link.element.js";
+declare const meta: {
+    title: string;
+    tags: string[];
+    render(args: USALinkElement): import("lit-html").TemplateResult<1>;
+    argTypes: {
+        href: {
+            type: "string";
+        };
+    };
+    args: {};
+};
+export default meta;
+type Story = StoryObj<USALinkElement>;
+export declare const Primary: Story;

package/target/lib/link/link.stories.js

@@ -0,0 +1,23 @@
+import { html } from "lit";
+// More on how to set up stories at: https://storybook.js.org/docs/writing-stories
+const meta = {
+    title: "usa-link",
+    tags: ["autodocs"],
+    render(args) {
+        return html `<usa-link href="${args.href}">Hello World</usa-link>`;
+    },
+    argTypes: {
+        href: {
+            type: "string",
+        },
+    },
+    args: {},
+};
+export default meta;
+// More on writing stories with args: https://storybook.js.org/docs/writing-stories/args
+export const Primary = {
+    args: {
+        href: "www.google.com",
+    },
+};
+//# sourceMappingURL=link.stories.js.map

package/target/lib/link/link.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.stories.js","sourceRoot":"","sources":["../../../src/lib/link/link.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAI3B,kFAAkF;AAClF,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,UAAU;IACjB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,MAAM,CAAC,IAAI;QACT,OAAO,IAAI,CAAA,mBAAmB,IAAI,CAAC,IAAI,0BAA0B,CAAC;IACpE,CAAC;IACD,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,IAAI,EAAE,QAAQ;SACf;KACF;IACD,IAAI,EAAE,EAAE;CACsB,CAAC;AAEjC,eAAe,IAAI,CAAC;AAIpB,wFAAwF;AACxF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,IAAI,EAAE,gBAAgB;KACvB;CACF,CAAC"}

package/target/lib/modal/modal-close/modal-close.element.d.ts

@@ -0,0 +1,8 @@
+declare global {
+    interface HTMLElementTagNameMap {
+        "usa-modal-close": USAModalCloseElement;
+    }
+}
+export declare class USAModalCloseElement extends HTMLElement {
+    accessor modalAction: string;
+}

package/target/lib/modal/modal-close/modal-close.element.js

@@ -0,0 +1,76 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { attr, css, element, html } from "@joist/element";
+let USAModalCloseElement = (() => {
+    let _classDecorators = [element({
+            tagName: "usa-modal-close",
+            shadowDom: [
+                css `
+      * {
+        box-sizing: border-box;
+      }
+
+      :host {
+        display: block;
+        position: absolute;
+        top: 1rem;
+        right: 1rem;
+      }
+
+      button {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: none;
+        border: none;
+        cursor: pointer;
+        height: 100%;
+        width: 100%;
+        border-radius: 100%;
+        padding: 0;
+        margin: 0;
+      }
+
+      button:focus {
+        outline: 0.25rem solid #2491ff;
+        outline-offset: 0;
+      }
+    `,
+                html `
+      <button aria-label="close modal">
+        <usa-icon icon="close"></usa-icon>
+      </button>
+    `,
+            ],
+        })];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = HTMLElement;
+    let _modalAction_decorators;
+    let _modalAction_initializers = [];
+    let _modalAction_extraInitializers = [];
+    var USAModalCloseElement = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _modalAction_decorators = [attr({
+                    name: "modal-action",
+                })];
+            __esDecorate(this, null, _modalAction_decorators, { kind: "accessor", name: "modalAction", static: false, private: false, access: { has: obj => "modalAction" in obj, get: obj => obj.modalAction, set: (obj, value) => { obj.modalAction = value; } }, metadata: _metadata }, _modalAction_initializers, _modalAction_extraInitializers);
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            USAModalCloseElement = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+        #modalAction_accessor_storage = __runInitializers(this, _modalAction_initializers, "close");
+        get modalAction() { return this.#modalAction_accessor_storage; }
+        set modalAction(value) { this.#modalAction_accessor_storage = value; }
+        constructor() {
+            super(...arguments);
+            __runInitializers(this, _modalAction_extraInitializers);
+        }
+    };
+    return USAModalCloseElement = _classThis;
+})();
+export { USAModalCloseElement };
+//# sourceMappingURL=modal-close.element.js.map

package/target/lib/modal/modal-close/modal-close.element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal-close.element.js","sourceRoot":"","sources":["../../../../src/lib/modal/modal-close/modal-close.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;IAiD7C,oBAAoB;4BAzChC,OAAO,CAAC;YACP,OAAO,EAAE,iBAAiB;YAC1B,SAAS,EAAE;gBACT,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA8BF;gBACD,IAAI,CAAA;;;;KAIH;aACF;SACF,CAAC;;;;sBACwC,WAAW;;;;oCAAnB,SAAQ,WAAW;;;;uCAClD,IAAI,CAAC;oBACJ,IAAI,EAAE,cAAc;iBACrB,CAAC;YACF,sLAAS,WAAW,6BAAX,WAAW,iGAAW;YAJjC,6KAKC;;;YALY,uDAAoB;;QAI/B,mFAAuB,OAAO,EAAC;QAA/B,IAAS,WAAW,iDAAW;QAA/B,IAAS,WAAW,uDAAW;;;;;;;;SAJpB,oBAAoB"}

package/target/lib/modal/modal-close/modal-close.test.d.ts

@@ -0,0 +1 @@
+import "./modal-close.element.js";

package/target/lib/modal/modal-close/modal-close.test.js

@@ -0,0 +1,11 @@
+import "./modal-close.element.js";
+import { assert, fixture, html } from "@open-wc/testing";
+describe("usa-modal-close", () => {
+    it("should be accessible", async () => {
+        const modalClose = await fixture(html `
+      <usa-modal-close>Hello World</usa-modal-close>
+    `);
+        return assert.isAccessible(modalClose);
+    });
+});
+//# sourceMappingURL=modal-close.test.js.map

package/target/lib/modal/modal-close/modal-close.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal-close.test.js","sourceRoot":"","sources":["../../../../src/lib/modal/modal-close/modal-close.test.ts"],"names":[],"mappings":"AAAA,OAAO,0BAA0B,CAAC;AAElC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAIzD,QAAQ,CAAC,iBAAiB,EAAE,GAAG,EAAE;IAC/B,EAAE,CAAC,sBAAsB,EAAE,KAAK,IAAI,EAAE;QACpC,MAAM,UAAU,GAAG,MAAM,OAAO,CAAuB,IAAI,CAAA;;KAE1D,CAAC,CAAC;QAEH,OAAO,MAAM,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;IACzC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/target/lib/modal/modal-heading/modal-heading.element.d.ts

@@ -0,0 +1,7 @@
+declare global {
+    interface HTMLElementTagNameMap {
+        "usa-modal-heading": USAModalHeadingElement;
+    }
+}
+export declare class USAModalHeadingElement extends HTMLElement {
+}

package/target/lib/modal/modal-heading/modal-heading.element.js

@@ -0,0 +1,50 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { css, element, html } from "@joist/element";
+let USAModalHeadingElement = (() => {
+    let _classDecorators = [element({
+            tagName: "usa-modal-heading",
+            shadowDom: [
+                css `
+      :host {
+        font-family:
+          Merriweather Web,
+          Georgia,
+          Cambria,
+          Times New Roman,
+          Times,
+          serif !important;
+
+        font-size: 1.22rem;
+      }
+
+      h2 {
+        margin-top: 0;
+        line-height: 1.4;
+        font-size: 1.45rem;
+      }
+    `,
+                html `
+      <h2>
+        <slot></slot>
+      </h2>
+    `,
+            ],
+        })];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = HTMLElement;
+    var USAModalHeadingElement = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            USAModalHeadingElement = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+    };
+    return USAModalHeadingElement = _classThis;
+})();
+export { USAModalHeadingElement };
+//# sourceMappingURL=modal-heading.element.js.map

package/target/lib/modal/modal-heading/modal-heading.element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal-heading.element.js","sourceRoot":"","sources":["../../../../src/lib/modal/modal-heading/modal-heading.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;IAqCvC,sBAAsB;4BA7BlC,OAAO,CAAC;YACP,OAAO,EAAE,mBAAmB;YAC5B,SAAS,EAAE;gBACT,GAAG,CAAA;;;;;;;;;;;;;;;;;;KAkBF;gBACD,IAAI,CAAA;;;;KAIH;aACF;SACF,CAAC;;;;sBAC0C,WAAW;sCAAnB,SAAQ,WAAW;;;;YAAvD,6KAA0D;;;YAA7C,uDAAsB;;;;;SAAtB,sBAAsB"}

package/target/lib/modal/modal-heading/modal-heading.test.d.ts

@@ -0,0 +1 @@
+import "./modal-heading.element.js";

package/target/lib/modal/modal-heading/modal-heading.test.js

@@ -0,0 +1,11 @@
+import "./modal-heading.element.js";
+import { assert, fixture, html } from "@open-wc/testing";
+describe("usa-modal-heading", () => {
+    it("should be accessible", async () => {
+        const modalHeading = await fixture(html `
+      <usa-modal-heading>Hello World</usa-modal-heading>
+    `);
+        return assert.isAccessible(modalHeading);
+    });
+});
+//# sourceMappingURL=modal-heading.test.js.map

package/target/lib/modal/modal-heading/modal-heading.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal-heading.test.js","sourceRoot":"","sources":["../../../../src/lib/modal/modal-heading/modal-heading.test.ts"],"names":[],"mappings":"AAAA,OAAO,4BAA4B,CAAC;AAEpC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAIzD,QAAQ,CAAC,mBAAmB,EAAE,GAAG,EAAE;IACjC,EAAE,CAAC,sBAAsB,EAAE,KAAK,IAAI,EAAE;QACpC,MAAM,YAAY,GAAG,MAAM,OAAO,CAAyB,IAAI,CAAA;;KAE9D,CAAC,CAAC;QAEH,OAAO,MAAM,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;IAC3C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/target/lib/modal/modal.element.d.ts

@@ -0,0 +1,13 @@
+declare global {
+    interface HTMLElementTagNameMap {
+        "usa-modal": USAModalElement;
+    }
+}
+export declare class USAModalElement extends HTMLElement {
+    #private;
+    modalAction: null | string;
+    openModal(): void;
+    closeModal(): void;
+    onGlobalModalAction(e: Event): void;
+    onModalAction(e: Event): void;
+}