@noctuatech/uswds 0.0.7 → 0.0.8

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.
Files changed (51) hide show
  1. package/README.md +6 -6
  2. package/assets/img/4c-lg-on-black.svg +10 -0
  3. package/assets/uswds.min.js +1 -1
  4. package/package.json +2 -2
  5. package/src/lib/button/button.element.ts +16 -1
  6. package/src/lib/define.ts +5 -0
  7. package/src/lib/file-input/file-input.element.ts +13 -5
  8. package/src/lib/file-input/file-input.stories.ts +0 -2
  9. package/src/lib/input/input.element.ts +11 -8
  10. package/src/lib/modal/modal-close/modal-close.element.ts +55 -0
  11. package/src/lib/modal/modal-close/modal-close.test.ts +15 -0
  12. package/src/lib/modal/modal-heading/modal-heading.element.ts +38 -0
  13. package/src/lib/modal/modal-heading/modal-heading.test.ts +15 -0
  14. package/src/lib/modal/modal.element.ts +103 -0
  15. package/src/lib/modal/modal.stories.ts +41 -0
  16. package/src/lib/modal/modal.test.ts +25 -0
  17. package/src/lib/radio/radio.element.ts +1 -4
  18. package/src/lib/select/select.element.ts +1 -0
  19. package/src/lib/step-indicator/step/step-indicator-step.element.ts +110 -0
  20. package/src/lib/step-indicator/step/step-indicator-step.test.ts +15 -0
  21. package/src/lib/step-indicator/step-indicator.element.ts +24 -0
  22. package/src/lib/step-indicator/step-indicator.stories.ts +49 -0
  23. package/src/lib/step-indicator/step-indicator.test.ts +21 -0
  24. package/src/lib.ts +5 -0
  25. package/target/lib/define.d.ts +2 -0
  26. package/target/lib/define.js +2 -0
  27. package/target/lib/define.js.map +1 -1
  28. package/target/lib/file-input/file-input.element.js +1 -0
  29. package/target/lib/file-input/file-input.element.js.map +1 -1
  30. package/target/lib/radio/radio.element.js +1 -4
  31. package/target/lib/radio/radio.element.js.map +1 -1
  32. package/target/lib/select/select.element.js +1 -0
  33. package/target/lib/select/select.element.js.map +1 -1
  34. package/target/lib/step-indicator/step/step-indicator-step.element.d.ts +7 -0
  35. package/target/lib/step-indicator/step/step-indicator-step.element.js +122 -0
  36. package/target/lib/step-indicator/step/step-indicator-step.element.js.map +1 -0
  37. package/target/lib/step-indicator/step/step-indicator-step.test.d.ts +1 -0
  38. package/target/lib/step-indicator/step/step-indicator-step.test.js +11 -0
  39. package/target/lib/step-indicator/step/step-indicator-step.test.js.map +1 -0
  40. package/target/lib/step-indicator/step-indicator.element.d.ts +7 -0
  41. package/target/lib/step-indicator/step-indicator.element.js +36 -0
  42. package/target/lib/step-indicator/step-indicator.element.js.map +1 -0
  43. package/target/lib/step-indicator/step-indicator.stories.d.ts +21 -0
  44. package/target/lib/step-indicator/step-indicator.stories.js +42 -0
  45. package/target/lib/step-indicator/step-indicator.stories.js.map +1 -0
  46. package/target/lib/step-indicator/step-indicator.test.d.ts +1 -0
  47. package/target/lib/step-indicator/step-indicator.test.js +17 -0
  48. package/target/lib/step-indicator/step-indicator.test.js.map +1 -0
  49. package/target/lib.d.ts +2 -0
  50. package/target/lib.js +2 -0
  51. package/target/lib.js.map +1 -1
@@ -0,0 +1,103 @@
1
+ import { attr, css, element, html, listen, query } from "@joist/element";
2
+
3
+ declare global {
4
+ interface HTMLElementTagNameMap {
5
+ "usa-modal": USAModalElement;
6
+ }
7
+ }
8
+
9
+ @element({
10
+ tagName: "usa-modal",
11
+ shadowDom: [
12
+ css`
13
+ * {
14
+ box-sizing: border-box;
15
+ }
16
+
17
+ :host {
18
+ display: contents;
19
+ }
20
+
21
+ dialog {
22
+ border: none;
23
+ font-size: 1.06rem;
24
+ line-height: 1.5;
25
+ border-radius: 0.5rem;
26
+ background: #fff;
27
+ color: #1b1b1b;
28
+ max-width: 30rem;
29
+ padding-top: 4rem;
30
+ padding-left: 4rem;
31
+ padding-right: 4rem;
32
+ padding-bottom: 2rem;
33
+ position: relative;
34
+ width: 100%;
35
+ }
36
+
37
+ ::backdrop {
38
+ background: rgba(0, 0, 0, 0.7);
39
+ }
40
+ `,
41
+ html`
42
+ <dialog>
43
+ <slot></slot>
44
+ </dialog>
45
+ `,
46
+ ],
47
+ })
48
+ export class USAModalElement extends HTMLElement {
49
+ @attr()
50
+ accessor open = false;
51
+
52
+ #dialog = query("dialog");
53
+
54
+ connectedCallback() {
55
+ if (this.open) {
56
+ this.openModal();
57
+ }
58
+ }
59
+
60
+ openModal() {
61
+ const dialog = this.#dialog();
62
+
63
+ dialog.showModal();
64
+ }
65
+
66
+ closeModal() {
67
+ const dialog = this.#dialog();
68
+
69
+ dialog.close();
70
+ }
71
+
72
+ @listen("click", () => document.body)
73
+ onGlobalModalAction(e: Event) {
74
+ if (e.target instanceof Element) {
75
+ const modalTarget = e.target.getAttribute("modal-target");
76
+
77
+ if (modalTarget === this.id) {
78
+ this.openModal();
79
+ }
80
+ }
81
+ }
82
+
83
+ @listen("click", (host) => host)
84
+ onModalAction(e: Event) {
85
+ if (e.target instanceof Element) {
86
+ const action = e.target.getAttribute("modal-action");
87
+
88
+ switch (action) {
89
+ case "confirm":
90
+ this.closeModal();
91
+ break;
92
+
93
+ case "cancel":
94
+ this.closeModal();
95
+ break;
96
+
97
+ case "close":
98
+ this.closeModal();
99
+ break;
100
+ }
101
+ }
102
+ }
103
+ }
@@ -0,0 +1,41 @@
1
+ import type { Meta, StoryObj } from "@storybook/web-components";
2
+ import { html } from "lit";
3
+
4
+ import type { USAModalElement } from "./modal.element.js";
5
+
6
+ // More on how to set up stories at: https://storybook.js.org/docs/writing-stories
7
+ const meta = {
8
+ title: "usa-modal",
9
+ tags: ["autodocs"],
10
+ render() {
11
+ return html`
12
+ <usa-button modal-target="mymodal">Open Modal</usa-button>
13
+
14
+ <usa-modal id="mymodal">
15
+ <usa-modal-close></usa-modal-close>
16
+
17
+ <usa-modal-heading>
18
+ Are you sure you want to continue?
19
+ </usa-modal-heading>
20
+
21
+ <usa-input placeholder="foo@email.com" autofocus>
22
+ Enter your email to continue
23
+ </usa-input>
24
+
25
+ <usa-button modal-action="confirm">Yes I am sure</usa-button>
26
+ <usa-button modal-action="cancel" variant="outline">Cancel</usa-button>
27
+ </usa-modal>
28
+ `;
29
+ },
30
+ argTypes: {},
31
+ args: {},
32
+ } satisfies Meta<USAModalElement>;
33
+
34
+ export default meta;
35
+
36
+ type Story = StoryObj<USAModalElement>;
37
+
38
+ // More on writing stories with args: https://storybook.js.org/docs/writing-stories/args
39
+ export const Primary: Story = {
40
+ args: {},
41
+ };
@@ -0,0 +1,25 @@
1
+ import "./modal.element.js";
2
+ import "./modal-heading/modal-heading.element.js";
3
+ import "./modal-close/modal-close.element.js";
4
+
5
+ import { fixture, html, assert } from "@open-wc/testing";
6
+
7
+ import { USAModalElement } from "./modal.element.js";
8
+
9
+ describe("usa-modal", () => {
10
+ it("should be accessible", async () => {
11
+ const modal = await fixture<USAModalElement>(html`
12
+ <usa-modal open>
13
+ <usa-modal-close></usa-modal-close>
14
+
15
+ <usa-modal-heading>
16
+ Are you sure you want to continue?
17
+ </usa-modal-heading>
18
+
19
+ <p>This is some other example of content</p>
20
+ </usa-modal>
21
+ `);
22
+
23
+ return assert.isAccessible(modal);
24
+ });
25
+ });
@@ -17,6 +17,7 @@ declare global {
17
17
  flex-direction: column;
18
18
  gap: 1rem;
19
19
  max-width: 30rem;
20
+ margin-bottom: 1.5rem;
20
21
  }
21
22
 
22
23
  label {
@@ -75,10 +76,6 @@ declare global {
75
76
  slot {
76
77
  display: flex;
77
78
  }
78
-
79
- slot#main {
80
- margin-bottom: 0.5rem;
81
- }
82
79
  `,
83
80
  html`<slot id="main"></slot>`,
84
81
  ],
@@ -25,6 +25,7 @@ declare global {
25
25
  position: relative;
26
26
  width: 100%;
27
27
  max-width: 30rem;
28
+ margin-bottom: 1.5rem;
28
29
  }
29
30
 
30
31
  select {
@@ -0,0 +1,110 @@
1
+ import { css, element, html } from "@joist/element";
2
+
3
+ declare global {
4
+ interface HTMLElementTagNameMap {
5
+ "usa-step": USAStepIndicatorStepElement;
6
+ }
7
+ }
8
+
9
+ @element({
10
+ tagName: "usa-step",
11
+ shadowDom: [
12
+ css`
13
+ :host {
14
+ color: #5c5c5c;
15
+ display: block;
16
+ flex: 1 1 0%;
17
+ position: relative;
18
+ counter-increment: usa-step-indicator;
19
+ }
20
+
21
+ :host([state="complete"]) {
22
+ color: #162e51;
23
+ }
24
+
25
+ :host([state="complete"])::before {
26
+ background-color: #162e51;
27
+ }
28
+
29
+ :host([state="current"]) {
30
+ color: #005ea2;
31
+ font-weight: bold;
32
+ }
33
+
34
+ :host([state="current"])::before {
35
+ background-color: #005ea2;
36
+ }
37
+
38
+ :host:before {
39
+ background-color: #919191;
40
+ content: "";
41
+ display: block;
42
+ height: 0.5rem;
43
+ }
44
+
45
+ .label {
46
+ display: block;
47
+ font-size: 1.06rem;
48
+ margin-top: 0.5rem;
49
+ padding-right: 2rem;
50
+ text-align: left;
51
+ }
52
+
53
+ :host([counter][state="complete"])::after {
54
+ background-color: #162e51;
55
+ box-shadow: 0 0 0 0.25rem #fff;
56
+ color: #fff;
57
+ }
58
+
59
+ :host([counter][state="current"])::after {
60
+ background-color: #005ea2;
61
+ box-shadow: 0 0 0 0.25rem #fff;
62
+ color: #fff;
63
+ }
64
+
65
+ :host([counter]) .label {
66
+ margin-top: 1.5rem;
67
+ }
68
+
69
+ :host([counter]):after {
70
+ content: counter(usa-step-indicator);
71
+ height: 2.5rem;
72
+ border-radius: 99rem;
73
+ width: 2.5rem;
74
+ background-color: #fff;
75
+ box-shadow:
76
+ inset 0 0 0 0.25rem #919191,
77
+ 0 0 0 0.25rem #fff;
78
+ color: #5c5c5c;
79
+ display: flex;
80
+ align-items: center;
81
+ justify-content: center;
82
+ font-weight: 700;
83
+ left: 0;
84
+ line-height: 0.9;
85
+ padding: calc((2.5rem - 2ex * 0.9) * 0.5);
86
+ position: absolute;
87
+ z-index: 100;
88
+ top: 0;
89
+ transform: translateY(-40%);
90
+ box-sizing: border-box;
91
+ }
92
+
93
+ :host([counter="small"]):after {
94
+ height: 1.5rem;
95
+ width: 1.5rem;
96
+ font-size: 0.93rem;
97
+ }
98
+
99
+ :host([counter]:last-child):before {
100
+ width: 0;
101
+ }
102
+ `,
103
+ html`
104
+ <div class="label">
105
+ <slot></slot>
106
+ </div>
107
+ `,
108
+ ],
109
+ })
110
+ export class USAStepIndicatorStepElement extends HTMLElement {}
@@ -0,0 +1,15 @@
1
+ import "./step-indicator-step.element.js";
2
+
3
+ import { fixture, html, assert } from "@open-wc/testing";
4
+
5
+ import { USAStepIndicatorStepElement } from "./step-indicator-step.element.js";
6
+
7
+ describe("usa-step", () => {
8
+ it("should be accessible", async () => {
9
+ const stepIndicatorStep = await fixture<USAStepIndicatorStepElement>(html`
10
+ <usa-step>Hello World</usa-step>
11
+ `);
12
+
13
+ return assert.isAccessible(stepIndicatorStep);
14
+ });
15
+ });
@@ -0,0 +1,24 @@
1
+ import { css, element, html } from "@joist/element";
2
+
3
+ declare global {
4
+ interface HTMLElementTagNameMap {
5
+ "usa-step-indicator": USAStepIndicatorElement;
6
+ }
7
+ }
8
+
9
+ @element({
10
+ tagName: "usa-step-indicator",
11
+ shadowDom: [
12
+ css`
13
+ :host {
14
+ display: flex;
15
+ gap: 2px;
16
+ counter-reset: usa-step-indicator;
17
+ padding-top: 1rem;
18
+ margin-bottom: 1rem;
19
+ }
20
+ `,
21
+ html`<slot></slot>`,
22
+ ],
23
+ })
24
+ export class USAStepIndicatorElement extends HTMLElement {}
@@ -0,0 +1,49 @@
1
+ import type { Meta, StoryObj } from "@storybook/web-components";
2
+ import { html } from "lit";
3
+
4
+ import type { USAStepIndicatorElement } from "./step-indicator.element.js";
5
+
6
+ // More on how to set up stories at: https://storybook.js.org/docs/writing-stories
7
+ const meta = {
8
+ title: "usa-step-indicator",
9
+ tags: ["autodocs"],
10
+ render(args) {
11
+ return html`
12
+ <usa-step-indicator>
13
+ <usa-step state="complete" counter=${args.counter}>
14
+ Personal information
15
+ </usa-step>
16
+
17
+ <usa-step state="complete" counter=${args.counter}>
18
+ Household status
19
+ </usa-step>
20
+
21
+ <usa-step state="current" counter=${args.counter}>
22
+ Supporting documents
23
+ </usa-step>
24
+
25
+ <usa-step counter=${args.counter}>Signature</usa-step>
26
+
27
+ <usa-step counter=${args.counter}>Review and submit</usa-step>
28
+ </usa-step-indicator>
29
+ `;
30
+ },
31
+ argTypes: {
32
+ counter: {
33
+ control: "select",
34
+ options: ["on", "small"],
35
+ },
36
+ },
37
+ args: {
38
+ counter: "on",
39
+ },
40
+ } satisfies Meta<USAStepIndicatorElement & { counter: string }>;
41
+
42
+ export default meta;
43
+
44
+ type Story = StoryObj<USAStepIndicatorElement>;
45
+
46
+ // More on writing stories with args: https://storybook.js.org/docs/writing-stories/args
47
+ export const Primary: Story = {
48
+ args: {},
49
+ };
@@ -0,0 +1,21 @@
1
+ import "./step-indicator.element.js";
2
+
3
+ import { fixture, html, assert } from "@open-wc/testing";
4
+
5
+ import { USAStepIndicatorElement } from "./step-indicator.element.js";
6
+
7
+ describe("usa-step-indicator", () => {
8
+ it("should be accessible", async () => {
9
+ const stepIndicator = await fixture<USAStepIndicatorElement>(html`
10
+ <usa-step-indicator>
11
+ <usa-step state="complete" counter="on">Personal information</usa-step>
12
+ <usa-step state="complete" counter="on">Household status</usa-step>
13
+ <usa-step state="current" counter="on">Supporting documents</usa-step>
14
+ <usa-step counter="on">Signature</usa-step>
15
+ <usa-step counter="on">Review and submit</usa-step>
16
+ </usa-step-indicator>
17
+ `);
18
+
19
+ return assert.isAccessible(stepIndicator);
20
+ });
21
+ });
package/src/lib.ts CHANGED
@@ -13,3 +13,8 @@ export { USASelecOptionElement } from "./lib/select/select-option.element.js";
13
13
  export { USATagElement } from "./lib/tag/tag.element.js";
14
14
  export { USAAccordionElement } from "./lib/accordion/accordion.element.js";
15
15
  export { USASideNavElement } from "./lib/side-nav/side-nav.element.js";
16
+ export { USAStepIndicatorElement } from "./lib/step-indicator/step-indicator.element.js";
17
+ export { USAStepIndicatorStepElement } from "./lib/step-indicator/step/step-indicator-step.element.js";
18
+ export { USAModalElement } from "./lib/modal/modal.element.js";
19
+ export { USAModalCloseElement } from "./lib/modal/modal-close/modal-close.element.js";
20
+ export { USAModalHeadingElement } from "./lib/modal/modal-heading/modal-heading.element.js";
@@ -16,3 +16,5 @@ import "./select/select-option.element.js";
16
16
  import "./tag/tag.element.js";
17
17
  import "./accordion/accordion.element.js";
18
18
  import "./side-nav/side-nav.element.js";
19
+ import "./step-indicator/step-indicator.element.js";
20
+ import "./step-indicator/step/step-indicator-step.element.js";
@@ -16,4 +16,6 @@ import "./select/select-option.element.js";
16
16
  import "./tag/tag.element.js";
17
17
  import "./accordion/accordion.element.js";
18
18
  import "./side-nav/side-nav.element.js";
19
+ import "./step-indicator/step-indicator.element.js";
20
+ import "./step-indicator/step/step-indicator-step.element.js";
19
21
  //# sourceMappingURL=define.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"define.js","sourceRoot":"","sources":["../../src/lib/define.ts"],"names":[],"mappings":"AAAA,OAAO,4BAA4B,CAAC;AACpC,OAAO,0BAA0B,CAAC;AAClC,OAAO,4BAA4B,CAAC;AACpC,OAAO,gCAAgC,CAAC;AACxC,OAAO,sCAAsC,CAAC;AAC9C,OAAO,oCAAoC,CAAC;AAC5C,OAAO,4CAA4C,CAAC;AACpD,OAAO,wBAAwB,CAAC;AAChC,OAAO,0BAA0B,CAAC;AAClC,OAAO,oCAAoC,CAAC;AAC5C,OAAO,wBAAwB,CAAC;AAChC,OAAO,0BAA0B,CAAC;AAClC,OAAO,iCAAiC,CAAC;AACzC,OAAO,4BAA4B,CAAC;AACpC,OAAO,mCAAmC,CAAC;AAC3C,OAAO,sBAAsB,CAAC;AAC9B,OAAO,kCAAkC,CAAC;AAC1C,OAAO,gCAAgC,CAAC"}
1
+ {"version":3,"file":"define.js","sourceRoot":"","sources":["../../src/lib/define.ts"],"names":[],"mappings":"AAAA,OAAO,4BAA4B,CAAC;AACpC,OAAO,0BAA0B,CAAC;AAClC,OAAO,4BAA4B,CAAC;AACpC,OAAO,gCAAgC,CAAC;AACxC,OAAO,sCAAsC,CAAC;AAC9C,OAAO,oCAAoC,CAAC;AAC5C,OAAO,4CAA4C,CAAC;AACpD,OAAO,wBAAwB,CAAC;AAChC,OAAO,0BAA0B,CAAC;AAClC,OAAO,oCAAoC,CAAC;AAC5C,OAAO,wBAAwB,CAAC;AAChC,OAAO,0BAA0B,CAAC;AAClC,OAAO,iCAAiC,CAAC;AACzC,OAAO,4BAA4B,CAAC;AACpC,OAAO,mCAAmC,CAAC;AAC3C,OAAO,sBAAsB,CAAC;AAC9B,OAAO,kCAAkC,CAAC;AAC1C,OAAO,gCAAgC,CAAC;AACxC,OAAO,4CAA4C,CAAC;AACpD,OAAO,sDAAsD,CAAC"}
@@ -17,6 +17,7 @@ let USAFileInputElement = (() => {
17
17
  display: block;
18
18
  max-width: 30rem;
19
19
  position: relative;
20
+ margin-bottom: 1.5rem;
20
21
  }
21
22
 
22
23
  label {
@@ -1 +1 @@
1
- {"version":3,"file":"file-input.element.js","sourceRoot":"","sources":["../../../src/lib/file-input/file-input.element.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"file-input.element.js","sourceRoot":"","sources":["../../../src/lib/file-input/file-input.element.ts"],"names":[],"mappings":"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"}
@@ -11,6 +11,7 @@ let USARadioElement = (() => {
11
11
  flex-direction: column;
12
12
  gap: 1rem;
13
13
  max-width: 30rem;
14
+ margin-bottom: 1.5rem;
14
15
  }
15
16
 
16
17
  label {
@@ -69,10 +70,6 @@ let USARadioElement = (() => {
69
70
  slot {
70
71
  display: flex;
71
72
  }
72
-
73
- slot#main {
74
- margin-bottom: 0.5rem;
75
- }
76
73
  `,
77
74
  html `<slot id="main"></slot>`,
78
75
  ],
@@ -1 +1 @@
1
- {"version":3,"file":"radio.element.js","sourceRoot":"","sources":["../../../src/lib/radio/radio.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;IAqFrD,eAAe;;4BA3E3B,OAAO,CAAC;YACP,OAAO,EAAE,WAAW;YACpB,SAAS,EAAE;gBACT,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAoEF;gBACD,IAAI,CAAA,yBAAyB;aAC9B;SACF,CAAC;;;;sBACmC,WAAW;;;;;;;;;;;;;4CAAnB,SAAQ,WAAW;;;YAIrC,mDAJE,mDAAe,+CAIT,EAAE,IAAC;YAGX,iJAAO,EAAE,IAAC;YAKV,kJAAQ,KAAK,IAAC;YAMvB,yFAAa,IAAI,CAAC,eAAe,EAAE,GAAC;QAoCtC,CAAC;QAlDC,IAAS,KAAK,yFAAM;QAApB,IAAS,KAAK,8FAAM;QAGpB,IAAS,IAAI,wFAAM;QAAnB,IAAS,IAAI,6FAAM;QAKnB,IAAS,KAAK,yFAAS;QAAvB,IAAS,KAAK,8FAAS;QAEvB,IAAI,MAAM;YACR,OAAO,IAAI,CAAC,UAAW,CAAC;QAC1B,CAAC;QAKD,QAAQ,CAAC,CAAQ;YACf,IAAI,CAAC,CAAC,MAAM,YAAY,gBAAgB,EAAE,CAAC;gBACzC,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC;oBACrB,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;oBAC5B,uBAAA,IAAI,kCAAW,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;gBAC/C,CAAC;YACH,CAAC;QACH,CAAC;QAED,iBAAiB;YACf,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;gBACf,uBAAA,IAAI,kCAAW,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YAC3C,CAAC;QACH,CAAC;QAED,wBAAwB;YACtB,KAAK,IAAI,KAAK,IAAI,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,EAAE,CAAC;gBACnE,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC;gBAC3C,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;YACzB,CAAC;QACH,CAAC;QAGD,aAAa,CAAC,CAAQ;YACpB,CAAC,CAAC,eAAe,EAAE,CAAC;YAEpB,MAAM,MAAM,GAAG,CAAC,CAAC,MAA+B,CAAC;YAEjD,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC;YAC7C,MAAM,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;YAExB,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACnC,CAAC;;;;;;;;;6BAlDA,IAAI,EAAE;4BAGN,IAAI,EAAE;6BAGN,IAAI,CAAC;gBACJ,QAAQ,EAAE,KAAK;aAChB,CAAC;gCASD,MAAM,CAAC,QAAQ,CAAC;qCAuBhB,MAAM,CAAC,2BAA2B,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC;QAvChD,0KAAS,KAAK,6BAAL,KAAK,qFAAM;QAGpB,uKAAS,IAAI,6BAAJ,IAAI,mFAAM;QAKnB,0KAAS,KAAK,6BAAL,KAAK,qFAAS;QASvB,iLAAA,QAAQ,6DAOP;QAgBD,gMAAA,aAAa,6DASZ;QArDH,6KAsDC;;;;IArDQ,yBAAc,GAAG,IAAI,AAAP,CAAQ;;QADlB,uDAAe;;;;SAAf,eAAe"}
1
+ {"version":3,"file":"radio.element.js","sourceRoot":"","sources":["../../../src/lib/radio/radio.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;IAkFrD,eAAe;;4BAxE3B,OAAO,CAAC;YACP,OAAO,EAAE,WAAW;YACpB,SAAS,EAAE;gBACT,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAiEF;gBACD,IAAI,CAAA,yBAAyB;aAC9B;SACF,CAAC;;;;sBACmC,WAAW;;;;;;;;;;;;;4CAAnB,SAAQ,WAAW;;;YAIrC,mDAJE,mDAAe,+CAIT,EAAE,IAAC;YAGX,iJAAO,EAAE,IAAC;YAKV,kJAAQ,KAAK,IAAC;YAMvB,yFAAa,IAAI,CAAC,eAAe,EAAE,GAAC;QAoCtC,CAAC;QAlDC,IAAS,KAAK,yFAAM;QAApB,IAAS,KAAK,8FAAM;QAGpB,IAAS,IAAI,wFAAM;QAAnB,IAAS,IAAI,6FAAM;QAKnB,IAAS,KAAK,yFAAS;QAAvB,IAAS,KAAK,8FAAS;QAEvB,IAAI,MAAM;YACR,OAAO,IAAI,CAAC,UAAW,CAAC;QAC1B,CAAC;QAKD,QAAQ,CAAC,CAAQ;YACf,IAAI,CAAC,CAAC,MAAM,YAAY,gBAAgB,EAAE,CAAC;gBACzC,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC;oBACrB,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;oBAC5B,uBAAA,IAAI,kCAAW,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;gBAC/C,CAAC;YACH,CAAC;QACH,CAAC;QAED,iBAAiB;YACf,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;gBACf,uBAAA,IAAI,kCAAW,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YAC3C,CAAC;QACH,CAAC;QAED,wBAAwB;YACtB,KAAK,IAAI,KAAK,IAAI,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,EAAE,CAAC;gBACnE,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC;gBAC3C,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;YACzB,CAAC;QACH,CAAC;QAGD,aAAa,CAAC,CAAQ;YACpB,CAAC,CAAC,eAAe,EAAE,CAAC;YAEpB,MAAM,MAAM,GAAG,CAAC,CAAC,MAA+B,CAAC;YAEjD,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC;YAC7C,MAAM,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;YAExB,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACnC,CAAC;;;;;;;;;6BAlDA,IAAI,EAAE;4BAGN,IAAI,EAAE;6BAGN,IAAI,CAAC;gBACJ,QAAQ,EAAE,KAAK;aAChB,CAAC;gCASD,MAAM,CAAC,QAAQ,CAAC;qCAuBhB,MAAM,CAAC,2BAA2B,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC;QAvChD,0KAAS,KAAK,6BAAL,KAAK,qFAAM;QAGpB,uKAAS,IAAI,6BAAJ,IAAI,mFAAM;QAKnB,0KAAS,KAAK,6BAAL,KAAK,qFAAS;QASvB,iLAAA,QAAQ,6DAOP;QAgBD,gMAAA,aAAa,6DASZ;QArDH,6KAsDC;;;;IArDQ,yBAAc,GAAG,IAAI,AAAP,CAAQ;;QADlB,uDAAe;;;;SAAf,eAAe"}
@@ -19,6 +19,7 @@ let USASelectElement = (() => {
19
19
  position: relative;
20
20
  width: 100%;
21
21
  max-width: 30rem;
22
+ margin-bottom: 1.5rem;
22
23
  }
23
24
 
24
25
  select {
@@ -1 +1 @@
1
- {"version":3,"file":"select.element.js","sourceRoot":"","sources":["../../../src/lib/select/select.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;IAsE5D,gBAAgB;;4BA5D5B,OAAO,CAAC;YACP,OAAO,EAAE,YAAY;YACrB,SAAS,EAAE;gBACT,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA2CF;gBACD,IAAI,CAAA;;;;;;;;;;KAUH;aACF;SACF,CAAC;;;;sBACoC,WAAW;;;;;;;;;;6CAAnB,SAAQ,WAAW;;;YAItC,oDAJE,mDAAgB,+CAIV,EAAE,IAAC;YAGX,kJAAO,EAAE,IAAC;YAEnB,sFAAU,KAAK,CAAC,QAAQ,CAAC,GAAC;YAC1B,sCAAa,IAAI,CAAC,eAAe,EAAE,EAAC;QA0BtC,CAAC;QAhCC,IAAS,KAAK,0FAAM;QAApB,IAAS,KAAK,+FAAM;QAGpB,IAAS,IAAI,yFAAM;QAAnB,IAAS,IAAI,8FAAM;QAKnB,iBAAiB;YACf,MAAM,MAAM,GAAG,uBAAA,IAAI,gCAAQ,MAAZ,IAAI,CAAU,CAAC;YAC9B,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;YAC1B,MAAM,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;YAExB,uBAAA,IAAI,mCAAW,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC3C,CAAC;QAGD,cAAc;YACZ,MAAM,MAAM,GAAG,uBAAA,IAAI,gCAAQ,MAAZ,IAAI,CAAU,CAAC;YAE9B,uBAAA,IAAI,mCAAW,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC7C,CAAC;QAGD,aAAa,CAAC,CAAQ;YACpB,MAAM,MAAM,GAAG,CAAC,CAAC,MAA+B,CAAC;YAEjD,CAAC,CAAC,eAAe,EAAE,CAAC;YAEpB,MAAM,MAAM,GAAG,uBAAA,IAAI,gCAAQ,MAAZ,IAAI,CAAU,CAAC;YAC9B,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QAC/B,CAAC;;;;;;;;;6BAhCA,IAAI,EAAE;4BAGN,IAAI,EAAE;sCAcN,MAAM,CAAC,QAAQ,CAAC;qCAOhB,MAAM,CAAC,4BAA4B,CAAC;QAvBrC,0KAAS,KAAK,6BAAL,KAAK,qFAAM;QAGpB,uKAAS,IAAI,6BAAJ,IAAI,mFAAM;QAcnB,mMAAA,cAAc,6DAIb;QAGD,gMAAA,aAAa,6DAOZ;QAnCH,6KAoCC;;;;IAnCQ,yBAAc,GAAG,IAAI,AAAP,CAAQ;;QADlB,uDAAgB;;;;SAAhB,gBAAgB"}
1
+ {"version":3,"file":"select.element.js","sourceRoot":"","sources":["../../../src/lib/select/select.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;IAuE5D,gBAAgB;;4BA7D5B,OAAO,CAAC;YACP,OAAO,EAAE,YAAY;YACrB,SAAS,EAAE;gBACT,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA4CF;gBACD,IAAI,CAAA;;;;;;;;;;KAUH;aACF;SACF,CAAC;;;;sBACoC,WAAW;;;;;;;;;;6CAAnB,SAAQ,WAAW;;;YAItC,oDAJE,mDAAgB,+CAIV,EAAE,IAAC;YAGX,kJAAO,EAAE,IAAC;YAEnB,sFAAU,KAAK,CAAC,QAAQ,CAAC,GAAC;YAC1B,sCAAa,IAAI,CAAC,eAAe,EAAE,EAAC;QA0BtC,CAAC;QAhCC,IAAS,KAAK,0FAAM;QAApB,IAAS,KAAK,+FAAM;QAGpB,IAAS,IAAI,yFAAM;QAAnB,IAAS,IAAI,8FAAM;QAKnB,iBAAiB;YACf,MAAM,MAAM,GAAG,uBAAA,IAAI,gCAAQ,MAAZ,IAAI,CAAU,CAAC;YAC9B,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;YAC1B,MAAM,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;YAExB,uBAAA,IAAI,mCAAW,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC3C,CAAC;QAGD,cAAc;YACZ,MAAM,MAAM,GAAG,uBAAA,IAAI,gCAAQ,MAAZ,IAAI,CAAU,CAAC;YAE9B,uBAAA,IAAI,mCAAW,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC7C,CAAC;QAGD,aAAa,CAAC,CAAQ;YACpB,MAAM,MAAM,GAAG,CAAC,CAAC,MAA+B,CAAC;YAEjD,CAAC,CAAC,eAAe,EAAE,CAAC;YAEpB,MAAM,MAAM,GAAG,uBAAA,IAAI,gCAAQ,MAAZ,IAAI,CAAU,CAAC;YAC9B,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QAC/B,CAAC;;;;;;;;;6BAhCA,IAAI,EAAE;4BAGN,IAAI,EAAE;sCAcN,MAAM,CAAC,QAAQ,CAAC;qCAOhB,MAAM,CAAC,4BAA4B,CAAC;QAvBrC,0KAAS,KAAK,6BAAL,KAAK,qFAAM;QAGpB,uKAAS,IAAI,6BAAJ,IAAI,mFAAM;QAcnB,mMAAA,cAAc,6DAIb;QAGD,gMAAA,aAAa,6DAOZ;QAnCH,6KAoCC;;;;IAnCQ,yBAAc,GAAG,IAAI,AAAP,CAAQ;;QADlB,uDAAgB;;;;SAAhB,gBAAgB"}
@@ -0,0 +1,7 @@
1
+ declare global {
2
+ interface HTMLElementTagNameMap {
3
+ "usa-step": USAStepIndicatorStepElement;
4
+ }
5
+ }
6
+ export declare class USAStepIndicatorStepElement extends HTMLElement {
7
+ }
@@ -0,0 +1,122 @@
1
+ import { __esDecorate, __runInitializers, __setFunctionName } from "tslib";
2
+ import { css, element, html } from "@joist/element";
3
+ let USAStepIndicatorStepElement = (() => {
4
+ let _classDecorators = [element({
5
+ tagName: "usa-step",
6
+ shadowDom: [
7
+ css `
8
+ :host {
9
+ color: #5c5c5c;
10
+ display: block;
11
+ flex: 1 1 0%;
12
+ position: relative;
13
+ counter-increment: usa-step-indicator;
14
+ }
15
+
16
+ :host([state="complete"]) {
17
+ color: #162e51;
18
+ }
19
+
20
+ :host([state="complete"])::before {
21
+ background-color: #162e51;
22
+ }
23
+
24
+ :host([state="current"]) {
25
+ color: #005ea2;
26
+ font-weight: bold;
27
+ }
28
+
29
+ :host([state="current"])::before {
30
+ background-color: #005ea2;
31
+ }
32
+
33
+ :host:before {
34
+ background-color: #919191;
35
+ content: "";
36
+ display: block;
37
+ height: 0.5rem;
38
+ }
39
+
40
+ .label {
41
+ display: block;
42
+ font-size: 1.06rem;
43
+ margin-top: 0.5rem;
44
+ padding-right: 2rem;
45
+ text-align: left;
46
+ }
47
+
48
+ :host([counter][state="complete"])::after {
49
+ background-color: #162e51;
50
+ box-shadow: 0 0 0 0.25rem #fff;
51
+ color: #fff;
52
+ }
53
+
54
+ :host([counter][state="current"])::after {
55
+ background-color: #005ea2;
56
+ box-shadow: 0 0 0 0.25rem #fff;
57
+ color: #fff;
58
+ }
59
+
60
+ :host([counter]) .label {
61
+ margin-top: 1.5rem;
62
+ }
63
+
64
+ :host([counter]):after {
65
+ content: counter(usa-step-indicator);
66
+ height: 2.5rem;
67
+ border-radius: 99rem;
68
+ width: 2.5rem;
69
+ background-color: #fff;
70
+ box-shadow:
71
+ inset 0 0 0 0.25rem #919191,
72
+ 0 0 0 0.25rem #fff;
73
+ color: #5c5c5c;
74
+ display: flex;
75
+ align-items: center;
76
+ justify-content: center;
77
+ font-weight: 700;
78
+ left: 0;
79
+ line-height: 0.9;
80
+ padding: calc((2.5rem - 2ex * 0.9) * 0.5);
81
+ position: absolute;
82
+ z-index: 100;
83
+ top: 0;
84
+ transform: translateY(-40%);
85
+ box-sizing: border-box;
86
+ }
87
+
88
+ :host([counter="small"]):after {
89
+ height: 1.5rem;
90
+ width: 1.5rem;
91
+ font-size: 0.93rem;
92
+ }
93
+
94
+ :host([counter]:last-child):before {
95
+ width: 0;
96
+ }
97
+ `,
98
+ html `
99
+ <div class="label">
100
+ <slot></slot>
101
+ </div>
102
+ `,
103
+ ],
104
+ })];
105
+ let _classDescriptor;
106
+ let _classExtraInitializers = [];
107
+ let _classThis;
108
+ let _classSuper = HTMLElement;
109
+ var USAStepIndicatorStepElement = _classThis = class extends _classSuper {
110
+ };
111
+ __setFunctionName(_classThis, "USAStepIndicatorStepElement");
112
+ (() => {
113
+ const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
114
+ __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
115
+ USAStepIndicatorStepElement = _classThis = _classDescriptor.value;
116
+ if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
117
+ __runInitializers(_classThis, _classExtraInitializers);
118
+ })();
119
+ return USAStepIndicatorStepElement = _classThis;
120
+ })();
121
+ export { USAStepIndicatorStepElement };
122
+ //# sourceMappingURL=step-indicator-step.element.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"step-indicator-step.element.js","sourceRoot":"","sources":["../../../../src/lib/step-indicator/step/step-indicator-step.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;IA6GvC,2BAA2B;4BArGvC,OAAO,CAAC;YACP,OAAO,EAAE,UAAU;YACnB,SAAS,EAAE;gBACT,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA0FF;gBACD,IAAI,CAAA;;;;KAIH;aACF;SACF,CAAC;;;;sBAC+C,WAAW;wDAAnB,SAAQ,WAAW;;;;;QAA5D,6KAA+D;;;QAAlD,uDAA2B;;;;SAA3B,2BAA2B"}
@@ -0,0 +1 @@
1
+ import "./step-indicator-step.element.js";