@noctuatech/uswds 0.0.8 → 0.0.9

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 (61) hide show
  1. package/README.md +2 -2
  2. package/package.json +2 -1
  3. package/src/lib/define.ts +2 -1
  4. package/src/lib/file-input/{file-input-preview.element.ts → file-input-preview/file-input-preview.element.ts} +20 -17
  5. package/src/lib/file-input/file-input.element.ts +22 -18
  6. package/src/lib/modal/modal.element.ts +5 -23
  7. package/src/lib/summary-box/summary-box.element.ts +35 -0
  8. package/src/lib/summary-box/summary-box.stories.ts +24 -0
  9. package/src/lib/summary-box/summary-box.test.ts +15 -0
  10. package/src/lib.ts +2 -0
  11. package/target/lib/button/button.element.d.ts +3 -0
  12. package/target/lib/button/button.element.js +27 -3
  13. package/target/lib/button/button.element.js.map +1 -1
  14. package/target/lib/define.d.ts +4 -0
  15. package/target/lib/define.js +4 -0
  16. package/target/lib/define.js.map +1 -1
  17. package/target/lib/file-input/file-input-preview.element.js +1 -1
  18. package/target/lib/file-input/file-input-preview.element.js.map +1 -1
  19. package/target/lib/file-input/file-input.element.js +30 -16
  20. package/target/lib/file-input/file-input.element.js.map +1 -1
  21. package/target/lib/file-input/file-input.stories.js +0 -2
  22. package/target/lib/file-input/file-input.stories.js.map +1 -1
  23. package/target/lib/input/input.element.d.ts +1 -0
  24. package/target/lib/input/input.element.js +12 -8
  25. package/target/lib/input/input.element.js.map +1 -1
  26. package/target/lib/modal/modal-close/modal-close.element.d.ts +8 -0
  27. package/target/lib/modal/modal-close/modal-close.element.js +78 -0
  28. package/target/lib/modal/modal-close/modal-close.element.js.map +1 -0
  29. package/target/lib/modal/modal-close/modal-close.test.d.ts +1 -0
  30. package/target/lib/modal/modal-close/modal-close.test.js +11 -0
  31. package/target/lib/modal/modal-close/modal-close.test.js.map +1 -0
  32. package/target/lib/modal/modal-heading/modal-heading.element.d.ts +7 -0
  33. package/target/lib/modal/modal-heading/modal-heading.element.js +50 -0
  34. package/target/lib/modal/modal-heading/modal-heading.element.js.map +1 -0
  35. package/target/lib/modal/modal-heading/modal-heading.test.d.ts +1 -0
  36. package/target/lib/modal/modal-heading/modal-heading.test.js +11 -0
  37. package/target/lib/modal/modal-heading/modal-heading.test.js.map +1 -0
  38. package/target/lib/modal/modal.element.d.ts +13 -0
  39. package/target/lib/modal/modal.element.js +96 -0
  40. package/target/lib/modal/modal.element.js.map +1 -0
  41. package/target/lib/modal/modal.stories.d.ts +12 -0
  42. package/target/lib/modal/modal.stories.js +34 -0
  43. package/target/lib/modal/modal.stories.js.map +1 -0
  44. package/target/lib/modal/modal.test.d.ts +3 -0
  45. package/target/lib/modal/modal.test.js +21 -0
  46. package/target/lib/modal/modal.test.js.map +1 -0
  47. package/target/lib/summary-box/summary-box.element.d.ts +7 -0
  48. package/target/lib/summary-box/summary-box.element.js +47 -0
  49. package/target/lib/summary-box/summary-box.element.js.map +1 -0
  50. package/target/lib/summary-box/summary-box.stories.d.ts +12 -0
  51. package/target/lib/summary-box/summary-box.stories.js +17 -0
  52. package/target/lib/summary-box/summary-box.stories.js.map +1 -0
  53. package/target/lib/summary-box/summary-box.test.d.ts +1 -0
  54. package/target/lib/summary-box/summary-box.test.js +11 -0
  55. package/target/lib/summary-box/summary-box.test.js.map +1 -0
  56. package/target/lib.d.ts +4 -0
  57. package/target/lib.js +4 -0
  58. package/target/lib.js.map +1 -1
  59. package/assets/css/global.css +0 -21
  60. package/assets/uswds.min.js +0 -1
  61. /package/src/lib/file-input/{file-input-preview.test.ts → file-input-preview/file-input-preview.test.ts} +0 -0
package/README.md CHANGED
@@ -23,10 +23,10 @@ npm i @noctuatech/uswds
23
23
  }
24
24
  </style>
25
25
 
26
- <script src="/node_modules/@noctuatech/uswds@latest/assets/uswds.min.js"></script>
26
+ <script src="/node_modules/@noctuatech/uswds/assets/uswds.min.js"></script>
27
27
 
28
28
  <usa-config
29
- spritesheet="/node_modules/@noctuatech/uswds@latest/assets/img/sprite.svg"
29
+ spritesheet="/node_modules/@noctuatech/uswds/assets/img/sprite.svg"
30
30
  >
31
31
  <usa-alert type="info">
32
32
  <h3 slot="heading">Informative status</h3>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@noctuatech/uswds",
3
- "version": "0.0.8",
3
+ "version": "0.0.9",
4
4
  "type": "module",
5
5
  "workspaces": [
6
6
  "packages/**"
@@ -102,6 +102,7 @@
102
102
  "@storybook/web-components-vite": "^8.4.4",
103
103
  "@types/mocha": "^10.0.7",
104
104
  "@types/node": "^22.0.0",
105
+ "@uswds/uswds": "^3.10.0",
105
106
  "@web/test-runner": "^0.19.0",
106
107
  "browser-sync": "^3.0.3",
107
108
  "husky": "^9.0.11",
package/src/lib/define.ts CHANGED
@@ -4,7 +4,7 @@ import "./button/button.element.js";
4
4
  import "./checkbox/checkbox.element.js";
5
5
  import "./description/description.element.js";
6
6
  import "./file-input/file-input.element.js";
7
- import "./file-input/file-input-preview.element.js";
7
+ import "./file-input/file-input-preview/file-input-preview.element.js";
8
8
  import "./icon/icon.element.js";
9
9
  import "./input/input.element.js";
10
10
  import "./input-mask/input-mask.element.js";
@@ -16,6 +16,7 @@ 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 "./summary-box/summary-box.element.js";
19
20
  import "./step-indicator/step-indicator.element.js";
20
21
  import "./step-indicator/step/step-indicator-step.element.js";
21
22
  import "./modal/modal.element.js";
@@ -61,14 +61,23 @@ declare global {
61
61
  margin-top: 1px;
62
62
  }
63
63
  `,
64
- html`<slot class="preview-heading"></slot>`,
64
+ html`
65
+ <template>
66
+ <div class="preview-item">
67
+ <img height="40" width="40" aria-hidden="true" />
68
+ </div>
69
+ </template>
70
+
71
+ <slot class="preview-heading"></slot>
72
+ `,
65
73
  ],
66
74
  })
67
75
  export class USAFileInputPreviewElement extends HTMLElement {
68
76
  @observe()
69
77
  accessor files: FileList | null = null;
70
78
 
71
- #items = new Map<string, HTMLElement>();
79
+ #items = new Map<string, Element>();
80
+ #template = query("template");
72
81
 
73
82
  connectedCallback() {
74
83
  this.onChange();
@@ -76,7 +85,9 @@ export class USAFileInputPreviewElement extends HTMLElement {
76
85
 
77
86
  @effect()
78
87
  onChange() {
79
- if (this.files) {
88
+ const template = this.#template();
89
+
90
+ if (this.files && this.files.length) {
80
91
  this.hidden = false;
81
92
 
82
93
  let names = new Set<string>();
@@ -85,13 +96,15 @@ export class USAFileInputPreviewElement extends HTMLElement {
85
96
  names.add(file.name);
86
97
 
87
98
  if (!this.#items.has(file.name)) {
88
- const item = document.createElement("div");
99
+ const clone = template.content.cloneNode(true);
100
+ const item = clone.childNodes[1] as Element;
101
+
89
102
  item.id = file.name;
90
- item.className = "preview-item";
91
103
 
92
- const img = createImagePreview(file);
104
+ const img = item.querySelector("img")!;
105
+ img.src = URL.createObjectURL(file);
93
106
 
94
- item.append(img, document.createTextNode(file.name));
107
+ item.append(document.createTextNode(file.name));
95
108
 
96
109
  this.shadowRoot!.append(item);
97
110
  this.#items.set(file.name, item);
@@ -109,13 +122,3 @@ export class USAFileInputPreviewElement extends HTMLElement {
109
122
  }
110
123
  }
111
124
  }
112
-
113
- function createImagePreview(file: File) {
114
- const img = new Image();
115
- img.height = 40;
116
- img.width = 40;
117
- img.src = URL.createObjectURL(file);
118
- img.ariaHidden = "true";
119
-
120
- return img;
121
- }
@@ -1,6 +1,3 @@
1
- import "./file-input-preview.element.js";
2
- import "../link/link.element.js";
3
-
4
1
  import { attr, css, element, html, listen, query } from "@joist/element";
5
2
  import { effect, observe } from "@joist/observable";
6
3
 
@@ -39,7 +36,7 @@ declare global {
39
36
  width: 100%;
40
37
  z-index: 1;
41
38
  bottom: 0;
42
- top: 1.85rem;
39
+ top: 0;
43
40
  }
44
41
 
45
42
  input:focus {
@@ -47,7 +44,7 @@ declare global {
47
44
  outline-offset: 0;
48
45
  }
49
46
 
50
- label slot {
47
+ label slot.label {
51
48
  font-size: 1.06rem;
52
49
  line-height: 1.3;
53
50
  display: block;
@@ -67,22 +64,29 @@ declare global {
67
64
  align-items: center;
68
65
  justify-content: center;
69
66
  }
67
+
68
+ .container {
69
+ position: relative;
70
+ }
70
71
  `,
71
72
  html`
72
73
  <label>
73
- <slot></slot>
74
- <input type="file" />
75
- </label>
74
+ <slot class="label"></slot>
75
+
76
+ <div class="container">
77
+ <input type="file" />
76
78
 
77
- <div class="box" tabindex="0">
78
- <slot name="description">
79
- Drag file here or <usa-link>choose from folder</usa-link>
80
- </slot>
81
- </div>
79
+ <div class="box">
80
+ <slot name="description">
81
+ Drag file here or <usa-link>choose from folder</usa-link>
82
+ </slot>
83
+ </div>
82
84
 
83
- <usa-file-input-preview>
84
- Selected file <usa-link>Change file</usa-link>
85
- </usa-file-input-preview>
85
+ <usa-file-input-preview>
86
+ Selected file <usa-link>Change file</usa-link>
87
+ </usa-file-input-preview>
88
+ </div>
89
+ </label>
86
90
  `,
87
91
  ],
88
92
  })
@@ -133,14 +137,14 @@ export class USAFileInputElement extends HTMLElement {
133
137
 
134
138
  const formData = new FormData();
135
139
 
136
- if (input.files) {
140
+ if (input.files && input.files.length) {
137
141
  box.style.display = "none";
138
142
 
139
143
  for (let file of input.files) {
140
144
  formData.append(this.name, file);
141
145
  }
142
146
  } else {
143
- box.style.display = "block";
147
+ box.style.display = "flex";
144
148
  }
145
149
 
146
150
  this.#internals.setFormValue(formData);
@@ -1,4 +1,4 @@
1
- import { attr, css, element, html, listen, query } from "@joist/element";
1
+ import { css, element, html, listen, query } from "@joist/element";
2
2
 
3
3
  declare global {
4
4
  interface HTMLElementTagNameMap {
@@ -30,7 +30,6 @@ declare global {
30
30
  padding-left: 4rem;
31
31
  padding-right: 4rem;
32
32
  padding-bottom: 2rem;
33
- position: relative;
34
33
  width: 100%;
35
34
  }
36
35
 
@@ -46,17 +45,10 @@ declare global {
46
45
  ],
47
46
  })
48
47
  export class USAModalElement extends HTMLElement {
49
- @attr()
50
- accessor open = false;
48
+ modalAction: null | string = null;
51
49
 
52
50
  #dialog = query("dialog");
53
51
 
54
- connectedCallback() {
55
- if (this.open) {
56
- this.openModal();
57
- }
58
- }
59
-
60
52
  openModal() {
61
53
  const dialog = this.#dialog();
62
54
 
@@ -83,21 +75,11 @@ export class USAModalElement extends HTMLElement {
83
75
  @listen("click", (host) => host)
84
76
  onModalAction(e: Event) {
85
77
  if (e.target instanceof Element) {
86
- const action = e.target.getAttribute("modal-action");
78
+ this.modalAction = e.target.getAttribute("modal-action");
87
79
 
88
- switch (action) {
89
- case "confirm":
90
- this.closeModal();
91
- break;
80
+ this.closeModal();
92
81
 
93
- case "cancel":
94
- this.closeModal();
95
- break;
96
-
97
- case "close":
98
- this.closeModal();
99
- break;
100
- }
82
+ this.dispatchEvent(new Event("usa::modal::close"));
101
83
  }
102
84
  }
103
85
  }
@@ -0,0 +1,35 @@
1
+ import { css, element, html } from "@joist/element";
2
+
3
+ declare global {
4
+ interface HTMLElementTagNameMap {
5
+ "usa-summary-box": USASummaryBoxElement;
6
+ }
7
+ }
8
+
9
+ @element({
10
+ tagName: "usa-summary-box",
11
+ shadowDom: [
12
+ css`
13
+ :host {
14
+ font-family:
15
+ Source Sans Pro Web,
16
+ Helvetica Neue,
17
+ Helvetica,
18
+ Roboto,
19
+ Arial,
20
+ sans-serif;
21
+ font-size: 1.06rem;
22
+ line-height: 1.5;
23
+ color: #1b1b1b;
24
+ background-color: #e7f6f8;
25
+ border-radius: 0.25rem;
26
+ border: 1px #99deea solid;
27
+ padding: 1.5rem;
28
+ position: relative;
29
+ display: block;
30
+ }
31
+ `,
32
+ html` <slot></slot> `,
33
+ ],
34
+ })
35
+ export class USASummaryBoxElement extends HTMLElement {}
@@ -0,0 +1,24 @@
1
+ import type { Meta, StoryObj } from "@storybook/web-components";
2
+ import { html } from "lit";
3
+
4
+ import type { USASummaryBoxElement } from "./summary-box.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-summary-box",
9
+ tags: ["autodocs"],
10
+ render(args) {
11
+ return html` <usa-summary-box> Hello World </usa-summary-box>`;
12
+ },
13
+ argTypes: {},
14
+ args: {},
15
+ } satisfies Meta<USASummaryBoxElement>;
16
+
17
+ export default meta;
18
+
19
+ type Story = StoryObj<USASummaryBoxElement>;
20
+
21
+ // More on writing stories with args: https://storybook.js.org/docs/writing-stories/args
22
+ export const Primary: Story = {
23
+ args: {},
24
+ };
@@ -0,0 +1,15 @@
1
+ import "./summary-box.element.js";
2
+
3
+ import { fixture, html, assert } from "@open-wc/testing";
4
+
5
+ import { USASummaryBoxElement } from "./summary-box.element.js";
6
+
7
+ describe("usa-summary-box", () => {
8
+ it("should be accessible", async () => {
9
+ const summaryBox = await fixture<USASummaryBoxElement>(html`
10
+ <usa-summary-box>Hello World</usa-summary-box>
11
+ `);
12
+
13
+ return assert.isAccessible(summaryBox);
14
+ });
15
+ });
package/src/lib.ts CHANGED
@@ -13,8 +13,10 @@ 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 { USASummaryBoxElement } from "./lib/summary-box/summary-box.element.js";
16
17
  export { USAStepIndicatorElement } from "./lib/step-indicator/step-indicator.element.js";
17
18
  export { USAStepIndicatorStepElement } from "./lib/step-indicator/step/step-indicator-step.element.js";
18
19
  export { USAModalElement } from "./lib/modal/modal.element.js";
19
20
  export { USAModalCloseElement } from "./lib/modal/modal-close/modal-close.element.js";
20
21
  export { USAModalHeadingElement } from "./lib/modal/modal-heading/modal-heading.element.js";
22
+
@@ -11,6 +11,9 @@ export declare class USAButtonElement extends HTMLElement {
11
11
  accessor type: "button" | "submit" | "reset";
12
12
  accessor disabled: boolean;
13
13
  accessor variant: ButtonVariant;
14
+ accessor value: string;
15
+ accessor tabIndex: number;
16
+ onReady(): void;
14
17
  onKeyDown(e: KeyboardEvent): void;
15
18
  onInternalClick(): void;
16
19
  attributeChangedCallback(): void;
@@ -1,5 +1,5 @@
1
1
  import { __classPrivateFieldGet, __classPrivateFieldSet, __esDecorate, __runInitializers, __setFunctionName } from "tslib";
2
- import { attr, css, element, html, listen, query } from "@joist/element";
2
+ import { attr, css, element, html, listen, query, ready } from "@joist/element";
3
3
  export const BUTTON_VARIANTS = [
4
4
  "primary",
5
5
  "secondary",
@@ -8,9 +8,13 @@ export const BUTTON_VARIANTS = [
8
8
  "outline",
9
9
  ];
10
10
  let USAButtonElement = (() => {
11
- var _USAButtonElement_instances, _USAButtonElement_internals, _USAButtonElement_button, _USAButtonElement_handleForm, _USAButtonElement_type_accessor_storage, _USAButtonElement_disabled_accessor_storage, _USAButtonElement_variant_accessor_storage;
11
+ var _USAButtonElement_instances, _USAButtonElement_internals, _USAButtonElement_button, _USAButtonElement_handleForm, _USAButtonElement_type_accessor_storage, _USAButtonElement_disabled_accessor_storage, _USAButtonElement_variant_accessor_storage, _USAButtonElement_value_accessor_storage, _USAButtonElement_tabIndex_accessor_storage;
12
12
  let _classDecorators = [element({
13
13
  tagName: "usa-button",
14
+ shadowDomOpts: {
15
+ mode: "open",
16
+ delegatesFocus: true,
17
+ },
14
18
  shadowDom: [
15
19
  css `
16
20
  :host {
@@ -177,6 +181,10 @@ let USAButtonElement = (() => {
177
181
  let _variant_decorators;
178
182
  let _variant_initializers = [];
179
183
  let _variant_extraInitializers = [];
184
+ let _value_decorators;
185
+ let _value_initializers = [];
186
+ let _value_extraInitializers = [];
187
+ let _onReady_decorators;
180
188
  let _onKeyDown_decorators;
181
189
  let _onInternalClick_decorators;
182
190
  var USAButtonElement = _classThis = class extends _classSuper {
@@ -186,7 +194,9 @@ let USAButtonElement = (() => {
186
194
  _USAButtonElement_type_accessor_storage.set(this, (__runInitializers(this, _instanceExtraInitializers), __runInitializers(this, _type_initializers, "button")));
187
195
  _USAButtonElement_disabled_accessor_storage.set(this, (__runInitializers(this, _type_extraInitializers), __runInitializers(this, _disabled_initializers, false)));
188
196
  _USAButtonElement_variant_accessor_storage.set(this, (__runInitializers(this, _disabled_extraInitializers), __runInitializers(this, _variant_initializers, "primary")));
189
- _USAButtonElement_internals.set(this, (__runInitializers(this, _variant_extraInitializers), this.attachInternals()));
197
+ _USAButtonElement_value_accessor_storage.set(this, (__runInitializers(this, _variant_extraInitializers), __runInitializers(this, _value_initializers, "")));
198
+ _USAButtonElement_tabIndex_accessor_storage.set(this, (__runInitializers(this, _value_extraInitializers), 0));
199
+ _USAButtonElement_internals.set(this, this.attachInternals());
190
200
  _USAButtonElement_button.set(this, query("button"));
191
201
  }
192
202
  get type() { return __classPrivateFieldGet(this, _USAButtonElement_type_accessor_storage, "f"); }
@@ -195,6 +205,14 @@ let USAButtonElement = (() => {
195
205
  set disabled(value) { __classPrivateFieldSet(this, _USAButtonElement_disabled_accessor_storage, value, "f"); }
196
206
  get variant() { return __classPrivateFieldGet(this, _USAButtonElement_variant_accessor_storage, "f"); }
197
207
  set variant(value) { __classPrivateFieldSet(this, _USAButtonElement_variant_accessor_storage, value, "f"); }
208
+ get value() { return __classPrivateFieldGet(this, _USAButtonElement_value_accessor_storage, "f"); }
209
+ set value(value) { __classPrivateFieldSet(this, _USAButtonElement_value_accessor_storage, value, "f"); }
210
+ get tabIndex() { return __classPrivateFieldGet(this, _USAButtonElement_tabIndex_accessor_storage, "f"); }
211
+ set tabIndex(value) { __classPrivateFieldSet(this, _USAButtonElement_tabIndex_accessor_storage, value, "f"); }
212
+ onReady() {
213
+ const input = __classPrivateFieldGet(this, _USAButtonElement_button, "f").call(this);
214
+ input.autofocus = this.autofocus;
215
+ }
198
216
  onKeyDown(e) {
199
217
  if (this.type === "submit") {
200
218
  if (e.key.toUpperCase() === "ENTER") {
@@ -217,6 +235,8 @@ let USAButtonElement = (() => {
217
235
  _USAButtonElement_type_accessor_storage = new WeakMap();
218
236
  _USAButtonElement_disabled_accessor_storage = new WeakMap();
219
237
  _USAButtonElement_variant_accessor_storage = new WeakMap();
238
+ _USAButtonElement_value_accessor_storage = new WeakMap();
239
+ _USAButtonElement_tabIndex_accessor_storage = new WeakMap();
220
240
  _USAButtonElement_handleForm = function _USAButtonElement_handleForm() {
221
241
  const { form } = __classPrivateFieldGet(this, _USAButtonElement_internals, "f");
222
242
  if (form) {
@@ -238,11 +258,15 @@ let USAButtonElement = (() => {
238
258
  _type_decorators = [attr()];
239
259
  _disabled_decorators = [attr()];
240
260
  _variant_decorators = [attr()];
261
+ _value_decorators = [attr()];
262
+ _onReady_decorators = [ready()];
241
263
  _onKeyDown_decorators = [listen("keydown", () => document.body)];
242
264
  _onInternalClick_decorators = [listen("click")];
243
265
  __esDecorate(_classThis, null, _type_decorators, { kind: "accessor", name: "type", static: false, private: false, access: { has: obj => "type" in obj, get: obj => obj.type, set: (obj, value) => { obj.type = value; } }, metadata: _metadata }, _type_initializers, _type_extraInitializers);
244
266
  __esDecorate(_classThis, 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);
245
267
  __esDecorate(_classThis, null, _variant_decorators, { kind: "accessor", name: "variant", static: false, private: false, access: { has: obj => "variant" in obj, get: obj => obj.variant, set: (obj, value) => { obj.variant = value; } }, metadata: _metadata }, _variant_initializers, _variant_extraInitializers);
268
+ __esDecorate(_classThis, null, _value_decorators, { kind: "accessor", name: "value", static: false, private: false, access: { has: obj => "value" in obj, get: obj => obj.value, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, _value_initializers, _value_extraInitializers);
269
+ __esDecorate(_classThis, null, _onReady_decorators, { kind: "method", name: "onReady", static: false, private: false, access: { has: obj => "onReady" in obj, get: obj => obj.onReady }, metadata: _metadata }, null, _instanceExtraInitializers);
246
270
  __esDecorate(_classThis, 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);
247
271
  __esDecorate(_classThis, null, _onInternalClick_decorators, { kind: "method", name: "onInternalClick", static: false, private: false, access: { has: obj => "onInternalClick" in obj, get: obj => obj.onInternalClick }, metadata: _metadata }, null, _instanceExtraInitializers);
248
272
  __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
@@ -1 +1 @@
1
- {"version":3,"file":"button.element.js","sourceRoot":"","sources":["../../../src/lib/button/button.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAQzE,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,SAAS;IACT,WAAW;IACX,MAAM;IACN,MAAM;IACN,SAAS;CACD,CAAC;IA8JE,gBAAgB;;4BA1J5B,OAAO,CAAC;YACP,OAAO,EAAE,YAAY;YACrB,SAAS,EAAE;gBACT,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA+IF;gBACD,IAAI,CAAA;;;;KAIH;aACF;SACF,CAAC;;;;sBACoC,WAAW;;;;;;;;;;;;;6CAAnB,SAAQ,WAAW;;;;YAItC,mDAJE,mDAAgB,8CAIoB,QAAQ,IAAC;YAG/C,yJAAW,KAAK,IAAC;YAGjB,2JAAyB,SAAS,IAAC;YAE5C,4FAAa,IAAI,CAAC,eAAe,EAAE,GAAC;YACpC,mCAAU,KAAK,CAAC,QAAQ,CAAC,EAAC;QAsC5B,CAAC;QA/CC,IAAS,IAAI,yFAA2C;QAAxD,IAAS,IAAI,8FAA2C;QAGxD,IAAS,QAAQ,6FAAS;QAA1B,IAAS,QAAQ,kGAAS;QAG1B,IAAS,OAAO,4FAA4B;QAA5C,IAAS,OAAO,iGAA4B;QAM5C,SAAS,CAAC,CAAgB;YACxB,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;gBAC3B,IAAI,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,KAAK,OAAO,EAAE,CAAC;oBACpC,uBAAA,IAAI,iEAAY,MAAhB,IAAI,CAAc,CAAC;gBACrB,CAAC;YACH,CAAC;QACH,CAAC;QAGD,eAAe;YACb,uBAAA,IAAI,iEAAY,MAAhB,IAAI,CAAc,CAAC;QACrB,CAAC;QAED,wBAAwB;YACtB,MAAM,MAAM,GAAG,uBAAA,IAAI,gCAAQ,MAAZ,IAAI,CAAU,CAAC;YAC9B,MAAM,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;YACxB,MAAM,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;QAClC,CAAC;;;;;;;;;QAGC,MAAM,EAAE,IAAI,EAAE,GAAG,uBAAA,IAAI,mCAAW,CAAC;QAEjC,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;gBAC3B,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;gBAC7C,GAAG,CAAC,IAAI,GAAG,QAAQ,CAAC;gBACpB,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;gBAEjB,GAAG,CAAC,KAAK,EAAE,CAAC;gBACZ,GAAG,CAAC,MAAM,EAAE,CAAC;YACf,CAAC;iBAAM,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;gBACjC,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,CAAC;QACH,CAAC;IACH,CAAC;;;;4BA/CA,IAAI,EAAE;gCAGN,IAAI,EAAE;+BAGN,IAAI,EAAE;iCAMN,MAAM,CAAC,SAAS,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC;uCAStC,MAAM,CAAC,OAAO,CAAC;QApBhB,uKAAS,IAAI,6BAAJ,IAAI,mFAA2C;QAGxD,mLAAS,QAAQ,6BAAR,QAAQ,2FAAS;QAG1B,gLAAS,OAAO,6BAAP,OAAO,yFAA4B;QAM5C,oLAAA,SAAS,6DAMR;QAGD,sMAAA,eAAe,6DAEd;QA3BH,6KAmDC;;;;IAlDQ,yBAAc,GAAG,IAAI,AAAP,CAAQ;;QADlB,uDAAgB;;;;SAAhB,gBAAgB"}
1
+ {"version":3,"file":"button.element.js","sourceRoot":"","sources":["../../../src/lib/button/button.element.ts"],"names":[],"mappings":"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"}
@@ -16,5 +16,9 @@ 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 "./summary-box/summary-box.element.js";
19
20
  import "./step-indicator/step-indicator.element.js";
20
21
  import "./step-indicator/step/step-indicator-step.element.js";
22
+ import "./modal/modal.element.js";
23
+ import "./modal/modal-close/modal-close.element.js";
24
+ import "./modal/modal-heading/modal-heading.element.js";
@@ -16,6 +16,10 @@ 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 "./summary-box/summary-box.element.js";
19
20
  import "./step-indicator/step-indicator.element.js";
20
21
  import "./step-indicator/step/step-indicator-step.element.js";
22
+ import "./modal/modal.element.js";
23
+ import "./modal/modal-close/modal-close.element.js";
24
+ import "./modal/modal-heading/modal-heading.element.js";
21
25
  //# 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;AACxC,OAAO,4CAA4C,CAAC;AACpD,OAAO,sDAAsD,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,sCAAsC,CAAC;AAC9C,OAAO,4CAA4C,CAAC;AACpD,OAAO,sDAAsD,CAAC;AAC9D,OAAO,0BAA0B,CAAC;AAClC,OAAO,4CAA4C,CAAC;AACpD,OAAO,gDAAgD,CAAC"}
@@ -81,7 +81,7 @@ let USAFileInputPreviewElement = (() => {
81
81
  this.onChange();
82
82
  }
83
83
  onChange() {
84
- if (this.files) {
84
+ if (this.files && this.files.length) {
85
85
  this.hidden = false;
86
86
  let names = new Set();
87
87
  for (let file of this.files) {
@@ -1 +1 @@
1
- {"version":3,"file":"file-input-preview.element.js","sourceRoot":"","sources":["../../../src/lib/file-input/file-input-preview.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAS,MAAM,gBAAgB,CAAC;AAC3D,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;IAiEvC,0BAA0B;;4BAzDtC,OAAO,CAAC;YACP,OAAO,EAAE,wBAAwB;YACjC,SAAS,EAAE;gBACT,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAkDF;gBACD,IAAI,CAAA,uCAAuC;aAC5C;SACF,CAAC;;;;sBAC8C,WAAW;;;;;;uDAAnB,SAAQ,WAAW;;;YAEhD,8DAFE,mDAA0B,+CAEH,IAAI,IAAC;YAEvC,gGAAS,IAAI,GAAG,EAAuB,GAAC;QAwC1C,CAAC;QA1CC,IAAS,KAAK,oGAAyB;QAAvC,IAAS,KAAK,yGAAyB;QAIvC,iBAAiB;YACf,IAAI,CAAC,QAAQ,EAAE,CAAC;QAClB,CAAC;QAGD,QAAQ;YACN,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;gBACf,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;gBAEpB,IAAI,KAAK,GAAG,IAAI,GAAG,EAAU,CAAC;gBAE9B,KAAK,IAAI,IAAI,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;oBAC5B,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;oBAErB,IAAI,CAAC,uBAAA,IAAI,yCAAO,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;wBAChC,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;wBAC3C,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC;wBACpB,IAAI,CAAC,SAAS,GAAG,cAAc,CAAC;wBAEhC,MAAM,GAAG,GAAG,kBAAkB,CAAC,IAAI,CAAC,CAAC;wBAErC,IAAI,CAAC,MAAM,CAAC,GAAG,EAAE,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;wBAErD,IAAI,CAAC,UAAW,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;wBAC9B,uBAAA,IAAI,yCAAO,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;oBACnC,CAAC;gBACH,CAAC;gBAED,KAAK,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,uBAAA,IAAI,yCAAO,EAAE,CAAC;oBACrC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;wBACrB,IAAI,CAAC,MAAM,EAAE,CAAC;wBACd,uBAAA,IAAI,yCAAO,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;oBAC3B,CAAC;gBACH,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;YACrB,CAAC;QACH,CAAC;;;;;;;6BA1CA,OAAO,EAAE;gCAST,MAAM,EAAE;QART,0KAAS,KAAK,6BAAL,KAAK,qFAAyB;QASvC,iLAAA,QAAQ,6DAgCP;QA3CH,6KA4CC;;;QA5CY,uDAA0B;;;;SAA1B,0BAA0B;AA8CvC,SAAS,kBAAkB,CAAC,IAAU;IACpC,MAAM,GAAG,GAAG,IAAI,KAAK,EAAE,CAAC;IACxB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC;IAChB,GAAG,CAAC,KAAK,GAAG,EAAE,CAAC;IACf,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;IACpC,GAAG,CAAC,UAAU,GAAG,MAAM,CAAC;IAExB,OAAO,GAAG,CAAC;AACb,CAAC"}
1
+ {"version":3,"file":"file-input-preview.element.js","sourceRoot":"","sources":["../../../src/lib/file-input/file-input-preview.element.ts"],"names":[],"mappings":"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"}
@@ -26,15 +26,20 @@ let USAFileInputElement = (() => {
26
26
 
27
27
  input {
28
28
  cursor: pointer;
29
- height: 100%;
30
29
  left: 0;
31
30
  margin: 0;
32
31
  max-width: none;
33
32
  position: absolute;
34
33
  text-indent: -999em;
35
- top: 0;
36
34
  width: 100%;
37
35
  z-index: 1;
36
+ bottom: 0;
37
+ top: 0;
38
+ }
39
+
40
+ input:focus {
41
+ outline: 0.25rem solid #2491ff;
42
+ outline-offset: 0;
38
43
  }
39
44
 
40
45
  label slot {
@@ -47,30 +52,39 @@ let USAFileInputElement = (() => {
47
52
 
48
53
  .box {
49
54
  border: 1px dashed #adadad;
50
- display: block;
55
+ display: flex;
51
56
  font-size: 0.93rem;
52
57
  position: relative;
53
58
  text-align: center;
54
59
  width: 100%;
55
60
  max-width: 30rem;
56
- padding: 2rem 1rem;
61
+ height: 5.2rem;
62
+ align-items: center;
63
+ justify-content: center;
64
+ }
65
+
66
+ .container {
67
+ position: relative;
57
68
  }
58
69
  `,
59
70
  html `
60
71
  <label>
61
72
  <slot></slot>
62
- <input type="file" />
63
- </label>
64
73
 
65
- <div class="box">
66
- <slot name="description">
67
- Drag file here or <usa-link>choose from folder</usa-link>
68
- </slot>
69
- </div>
74
+ <div class="container">
75
+ <input type="file" />
70
76
 
71
- <usa-file-input-preview>
72
- Selected file <usa-link>Change file</usa-link>
73
- </usa-file-input-preview>
77
+ <div class="box">
78
+ <slot name="description">
79
+ Drag file here or <usa-link>choose from folder</usa-link>
80
+ </slot>
81
+ </div>
82
+
83
+ <usa-file-input-preview>
84
+ Selected file <usa-link>Change file</usa-link>
85
+ </usa-file-input-preview>
86
+ </div>
87
+ </label>
74
88
  `,
75
89
  ],
76
90
  })];
@@ -132,14 +146,14 @@ let USAFileInputElement = (() => {
132
146
  const preview = __classPrivateFieldGet(this, _USAFileInputElement_preview, "f").call(this);
133
147
  preview.files = input.files;
134
148
  const formData = new FormData();
135
- if (input.files) {
149
+ if (input.files && input.files.length) {
136
150
  box.style.display = "none";
137
151
  for (let file of input.files) {
138
152
  formData.append(this.name, file);
139
153
  }
140
154
  }
141
155
  else {
142
- box.style.display = "block";
156
+ box.style.display = "flex";
143
157
  }
144
158
  __classPrivateFieldGet(this, _USAFileInputElement_internals, "f").setFormValue(formData);
145
159
  }
@@ -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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"}
@@ -19,8 +19,6 @@ const meta = {
19
19
  </div>
20
20
  </usa-file-input>
21
21
 
22
- <br />
23
-
24
22
  <usa-button type="submit">SUBMIT</usa-button>
25
23
  </form>
26
24
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"file-input.stories.js","sourceRoot":"","sources":["../../../src/lib/file-input/file-input.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAI3B,kFAAkF;AAClF,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,gBAAgB;IACvB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,MAAM,CAAC,IAAI;QACT,SAAS,QAAQ,CAAC,CAAQ;YACxB,CAAC,CAAC,cAAc,EAAE,CAAC;YAEnB,MAAM,IAAI,GAAG,IAAI,QAAQ,CAAC,CAAC,CAAC,MAAyB,CAAC,CAAC;YAEvD,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC;QACrC,CAAC;QAED,OAAO,IAAI,CAAA;sBACO,QAAQ;;;;;;;;;;;;;KAazB,CAAC;IACJ,CAAC;IACD,QAAQ,EAAE,EAAE;IACZ,IAAI,EAAE,EAAE;CAC2B,CAAC;AAEtC,eAAe,IAAI,CAAC;AAIpB,wFAAwF;AACxF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE;CACT,CAAC"}
1
+ {"version":3,"file":"file-input.stories.js","sourceRoot":"","sources":["../../../src/lib/file-input/file-input.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAI3B,kFAAkF;AAClF,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,gBAAgB;IACvB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,MAAM,CAAC,IAAI;QACT,SAAS,QAAQ,CAAC,CAAQ;YACxB,CAAC,CAAC,cAAc,EAAE,CAAC;YAEnB,MAAM,IAAI,GAAG,IAAI,QAAQ,CAAC,CAAC,CAAC,MAAyB,CAAC,CAAC;YAEvD,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC;QACrC,CAAC;QAED,OAAO,IAAI,CAAA;sBACO,QAAQ;;;;;;;;;;;KAWzB,CAAC;IACJ,CAAC;IACD,QAAQ,EAAE,EAAE;IACZ,IAAI,EAAE,EAAE;CAC2B,CAAC;AAEtC,eAAe,IAAI,CAAC;AAIpB,wFAAwF;AACxF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE;CACT,CAAC"}
@@ -13,6 +13,7 @@ export declare class USATextInputElement extends HTMLElement implements Maskable
13
13
  accessor value: string;
14
14
  get selectionStart(): number | null;
15
15
  setSelectionRange(start: number, end: number): void;
16
+ onReady(): void;
16
17
  onChange(): void;
17
18
  onInputChange(): void;
18
19
  attributeChangedCallback(attr: string): void;