@noctuatech/uswds 1.1.8 → 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/lib/button/button.element.ts +55 -40
- package/src/lib/button/button.stories.ts +6 -0
- package/src/lib/file-input/file-input-preview/file-input-preview.element.ts +1 -1
- package/src/lib/icon/icon-types.ts +36 -42
- package/src/lib/icon/icon.element.ts +6 -7
- package/target/lib/button/button.element.d.ts +3 -2
- package/target/lib/button/button.element.js +25 -17
- package/target/lib/button/button.element.js.map +1 -1
- package/target/lib/button/button.stories.js +1 -1
- package/target/lib/button/button.stories.js.map +1 -1
- package/target/lib/icon/icon-types.d.ts +1 -1
- package/target/lib/icon/icon-types.js +36 -42
- package/target/lib/icon/icon-types.js.map +1 -1
- package/target/lib/icon/icon.element.d.ts +1 -1
- package/target/lib/icon/icon.element.js +6 -10
- package/target/lib/icon/icon.element.js.map +1 -1
package/package.json
CHANGED
|
@@ -1,4 +1,7 @@
|
|
|
1
|
-
import
|
|
1
|
+
import "@joist/templating/define.js";
|
|
2
|
+
|
|
3
|
+
import { attr, css, element, html, listen } from "@joist/element";
|
|
4
|
+
import { bind } from "@joist/templating";
|
|
2
5
|
|
|
3
6
|
declare global {
|
|
4
7
|
interface HTMLElementTagNameMap {
|
|
@@ -30,9 +33,10 @@ export type ButtonVariant = (typeof BUTTON_VARIANTS)[number];
|
|
|
30
33
|
border-bottom-right-radius: 0.25rem;
|
|
31
34
|
border-top-left-radius: 0.25rem;
|
|
32
35
|
border-bottom-left-radius: 0.25rem;
|
|
36
|
+
overflow: hidden;
|
|
33
37
|
}
|
|
34
38
|
|
|
35
|
-
button {
|
|
39
|
+
button, a {
|
|
36
40
|
box-sizing: border-box;
|
|
37
41
|
font-size: 1.06rem;
|
|
38
42
|
line-height: 0.9;
|
|
@@ -43,10 +47,6 @@ export type ButtonVariant = (typeof BUTTON_VARIANTS)[number];
|
|
|
43
47
|
appearance: none;
|
|
44
48
|
align-items: center;
|
|
45
49
|
border: 0;
|
|
46
|
-
border-top-right-radius: inherit;
|
|
47
|
-
border-bottom-right-radius: inherit;
|
|
48
|
-
border-top-left-radius: inherit;
|
|
49
|
-
border-bottom-left-radius: inherit;
|
|
50
50
|
cursor: pointer;
|
|
51
51
|
-moz-column-gap: 0.5rem;
|
|
52
52
|
column-gap: 0.5rem;
|
|
@@ -67,111 +67,125 @@ export type ButtonVariant = (typeof BUTTON_VARIANTS)[number];
|
|
|
67
67
|
}
|
|
68
68
|
}
|
|
69
69
|
|
|
70
|
-
button:visited {
|
|
70
|
+
:is(button, a):visited {
|
|
71
71
|
color: white;
|
|
72
72
|
}
|
|
73
73
|
|
|
74
|
-
button:hover {
|
|
74
|
+
:is(button, a):hover {
|
|
75
75
|
color: white;
|
|
76
76
|
background-color: #1a4480;
|
|
77
77
|
border-bottom: 0;
|
|
78
78
|
text-decoration: none;
|
|
79
79
|
}
|
|
80
80
|
|
|
81
|
-
button:active {
|
|
81
|
+
:is(button, a):active {
|
|
82
82
|
color: white;
|
|
83
83
|
background-color: #162e51;
|
|
84
84
|
}
|
|
85
85
|
|
|
86
|
-
button:not([disabled]):focus {
|
|
86
|
+
:is(button, a):not([disabled]):focus {
|
|
87
87
|
outline-offset: 0.25rem;
|
|
88
88
|
}
|
|
89
89
|
|
|
90
|
-
button:disabled {
|
|
90
|
+
:is(button, a):disabled {
|
|
91
91
|
color: #454545;
|
|
92
92
|
background-color: #c9c9c9;
|
|
93
93
|
cursor: not-allowed;
|
|
94
94
|
opacity: 1;
|
|
95
95
|
}
|
|
96
96
|
|
|
97
|
-
button:disabled:hover,
|
|
98
|
-
button:disabled:active,
|
|
99
|
-
button:disabled:focus {
|
|
97
|
+
:is(button, a):disabled:hover,
|
|
98
|
+
:is(button, a):disabled:active,
|
|
99
|
+
:is(button, a):disabled:focus {
|
|
100
100
|
color: #454545;
|
|
101
101
|
background-color: #c9c9c9;
|
|
102
102
|
}
|
|
103
103
|
|
|
104
|
-
button:focus {
|
|
104
|
+
:is(button, a):focus {
|
|
105
105
|
outline: 0.25rem solid #2491ff;
|
|
106
106
|
outline-offset: 0;
|
|
107
107
|
}
|
|
108
108
|
|
|
109
109
|
/** Secondary */
|
|
110
|
-
:host([variant="secondary"]) button {
|
|
110
|
+
:host([variant="secondary"]) :is(button, a) {
|
|
111
111
|
color: #fff;
|
|
112
112
|
background-color: #d83933;
|
|
113
113
|
}
|
|
114
114
|
|
|
115
|
-
:host([variant="secondary"]) button:hover {
|
|
115
|
+
:host([variant="secondary"]) :is(button, a):hover {
|
|
116
116
|
background-color: #b50909;
|
|
117
117
|
}
|
|
118
118
|
|
|
119
|
-
:host([variant="secondary"]) button:active {
|
|
119
|
+
:host([variant="secondary"]) :is(button, a):active {
|
|
120
120
|
background-color: #8b0a03;
|
|
121
121
|
}
|
|
122
122
|
|
|
123
123
|
/** cool */
|
|
124
|
-
:host([variant="cool"]) button {
|
|
124
|
+
:host([variant="cool"]) :is(button, a) {
|
|
125
125
|
color: #1b1b1b;
|
|
126
126
|
background-color: #00bde3;
|
|
127
127
|
}
|
|
128
128
|
|
|
129
|
-
:host([variant="cool"]) button:hover {
|
|
129
|
+
:host([variant="cool"]) :is(button, a):hover {
|
|
130
130
|
background-color: #28a0cb;
|
|
131
131
|
}
|
|
132
132
|
|
|
133
|
-
:host([variant="cool"]) button:active {
|
|
133
|
+
:host([variant="cool"]) :is(button, a):active {
|
|
134
134
|
color: #fff;
|
|
135
135
|
background-color: #07648d;
|
|
136
136
|
}
|
|
137
137
|
|
|
138
138
|
/** warm */
|
|
139
|
-
:host([variant="warm"]) button {
|
|
139
|
+
:host([variant="warm"]) :is(button, a) {
|
|
140
140
|
color: #1b1b1b;
|
|
141
141
|
background-color: #fa9441;
|
|
142
142
|
}
|
|
143
143
|
|
|
144
|
-
:host([variant="warm"]) button:hover {
|
|
144
|
+
:host([variant="warm"]) :is(button, a):hover {
|
|
145
145
|
color: #fff;
|
|
146
146
|
background-color: #c05600;
|
|
147
147
|
}
|
|
148
148
|
|
|
149
|
-
:host([variant="warm"]) button:active {
|
|
149
|
+
:host([variant="warm"]) :is(button, a):active {
|
|
150
150
|
color: #fff;
|
|
151
151
|
background-color: #775540;
|
|
152
152
|
}
|
|
153
153
|
|
|
154
154
|
/** outline */
|
|
155
|
-
:host([variant="outline"]) button {
|
|
155
|
+
:host([variant="outline"]) :is(button, a) {
|
|
156
156
|
background-color: transparent;
|
|
157
157
|
box-shadow: inset 0 0 0 2px #005ea2;
|
|
158
158
|
color: #005ea2;
|
|
159
159
|
}
|
|
160
160
|
|
|
161
|
-
:host([variant="outline"]) button:hover {
|
|
161
|
+
:host([variant="outline"]) :is(button, a):hover {
|
|
162
162
|
box-shadow: inset 0 0 0 2px #1a4480;
|
|
163
163
|
color: #1a4480;
|
|
164
164
|
}
|
|
165
165
|
|
|
166
|
-
:host([variant="outline"]) button:active {
|
|
166
|
+
:host([variant="outline"]) :is(button, a):active {
|
|
167
167
|
box-shadow: inset 0 0 0 2px #162e51;
|
|
168
168
|
color: #162e51;
|
|
169
169
|
}
|
|
170
170
|
`,
|
|
171
171
|
html`
|
|
172
|
-
<
|
|
173
|
-
<
|
|
174
|
-
|
|
172
|
+
<j-if bind="href">
|
|
173
|
+
<template>
|
|
174
|
+
<j-props>
|
|
175
|
+
<a $href="href" $disabled="disabled" $target="target">
|
|
176
|
+
<slot></slot>
|
|
177
|
+
</a>
|
|
178
|
+
</j-props>
|
|
179
|
+
</template>
|
|
180
|
+
|
|
181
|
+
<template else>
|
|
182
|
+
<j-props>
|
|
183
|
+
<button tabindex="0" $type="type" $disabled="disabled" $value="value">
|
|
184
|
+
<slot></slot>
|
|
185
|
+
</button>
|
|
186
|
+
</j-props>
|
|
187
|
+
</template>
|
|
188
|
+
</j-if>
|
|
175
189
|
`,
|
|
176
190
|
],
|
|
177
191
|
})
|
|
@@ -179,36 +193,37 @@ export class USAButtonElement extends HTMLElement {
|
|
|
179
193
|
static formAssociated = true;
|
|
180
194
|
|
|
181
195
|
@attr()
|
|
196
|
+
@bind()
|
|
182
197
|
accessor type: "button" | "submit" | "reset" = "button";
|
|
183
198
|
|
|
184
199
|
@attr()
|
|
200
|
+
@bind()
|
|
185
201
|
accessor disabled = false;
|
|
186
202
|
|
|
187
203
|
@attr()
|
|
188
204
|
accessor variant: ButtonVariant = "primary";
|
|
189
205
|
|
|
190
206
|
@attr()
|
|
207
|
+
@bind()
|
|
191
208
|
accessor value = "";
|
|
192
209
|
|
|
210
|
+
@attr()
|
|
211
|
+
@bind()
|
|
212
|
+
accessor href = "";
|
|
213
|
+
|
|
214
|
+
@attr()
|
|
215
|
+
@bind()
|
|
216
|
+
accessor target = "";
|
|
217
|
+
|
|
193
218
|
accessor tabIndex = 0;
|
|
194
219
|
|
|
195
220
|
#internals = this.attachInternals();
|
|
196
|
-
#button = query("button");
|
|
197
|
-
|
|
198
|
-
@ready()
|
|
199
|
-
onReady() {
|
|
200
|
-
this.#button({ autofocus: this.autofocus });
|
|
201
|
-
}
|
|
202
221
|
|
|
203
222
|
@listen("click")
|
|
204
223
|
onInternalClick() {
|
|
205
224
|
this.#handleForm();
|
|
206
225
|
}
|
|
207
226
|
|
|
208
|
-
attributeChangedCallback() {
|
|
209
|
-
this.#button({ type: this.type, disabled: this.disabled });
|
|
210
|
-
}
|
|
211
|
-
|
|
212
227
|
#handleForm() {
|
|
213
228
|
const { form } = this.#internals;
|
|
214
229
|
|
|
@@ -16,6 +16,12 @@ const meta = {
|
|
|
16
16
|
i === BUTTON_VARIANTS.length - 1 ? "" : "\n\n"
|
|
17
17
|
}`,
|
|
18
18
|
)}
|
|
19
|
+
${BUTTON_VARIANTS.map(
|
|
20
|
+
(variant, i) =>
|
|
21
|
+
html`<usa-button href="#" variant=${variant}>Hello World (Link)</usa-button> ${
|
|
22
|
+
i === BUTTON_VARIANTS.length - 1 ? "" : "\n\n"
|
|
23
|
+
}`,
|
|
24
|
+
)}
|
|
19
25
|
<usa-button disabled>Disabled</usa-button>
|
|
20
26
|
</div>
|
|
21
27
|
`;
|
|
@@ -4,19 +4,19 @@ export const ICON_TYPES = [
|
|
|
4
4
|
"account_balance",
|
|
5
5
|
"account_box",
|
|
6
6
|
"account_circle",
|
|
7
|
-
"add",
|
|
8
|
-
"add_circle",
|
|
9
7
|
"add_circle_outline",
|
|
8
|
+
"add_circle",
|
|
9
|
+
"add",
|
|
10
10
|
"alarm",
|
|
11
11
|
"alternate_email",
|
|
12
12
|
"announcement",
|
|
13
|
+
"api",
|
|
13
14
|
"arrow_back",
|
|
14
15
|
"arrow_downward",
|
|
15
16
|
"arrow_drop_down",
|
|
16
17
|
"arrow_drop_up",
|
|
17
18
|
"arrow_forward",
|
|
18
19
|
"arrow_upward",
|
|
19
|
-
"api",
|
|
20
20
|
"assessment",
|
|
21
21
|
"attach_file",
|
|
22
22
|
"attach_money",
|
|
@@ -32,21 +32,23 @@ export const ICON_TYPES = [
|
|
|
32
32
|
"camping",
|
|
33
33
|
"cancel",
|
|
34
34
|
"chat",
|
|
35
|
-
"check",
|
|
36
35
|
"check_box_outline_blank",
|
|
37
|
-
"check_circle",
|
|
38
36
|
"check_circle_outline",
|
|
37
|
+
"check_circle",
|
|
38
|
+
"check",
|
|
39
39
|
"checkroom",
|
|
40
|
+
"chevron_left",
|
|
41
|
+
"chevron_right",
|
|
40
42
|
"clean_hands",
|
|
41
|
-
"clothes",
|
|
42
43
|
"close",
|
|
43
44
|
"closed_caption",
|
|
45
|
+
"clothes",
|
|
44
46
|
"cloud",
|
|
45
47
|
"code",
|
|
46
48
|
"comment",
|
|
47
49
|
"connect_without_contact",
|
|
48
|
-
"construction",
|
|
49
50
|
"construction_worker",
|
|
51
|
+
"construction",
|
|
50
52
|
"contact_page",
|
|
51
53
|
"content_copy",
|
|
52
54
|
"coronavirus",
|
|
@@ -54,11 +56,11 @@ export const ICON_TYPES = [
|
|
|
54
56
|
"deck",
|
|
55
57
|
"delete",
|
|
56
58
|
"device_thermostat",
|
|
57
|
-
"directions",
|
|
58
59
|
"directions_bike",
|
|
59
60
|
"directions_bus",
|
|
60
61
|
"directions_car",
|
|
61
62
|
"directions_walk",
|
|
63
|
+
"directions",
|
|
62
64
|
"do_not_disturb",
|
|
63
65
|
"do_not_touch",
|
|
64
66
|
"drag_handle",
|
|
@@ -66,15 +68,16 @@ export const ICON_TYPES = [
|
|
|
66
68
|
"edit",
|
|
67
69
|
"electrical_services",
|
|
68
70
|
"emoji_events",
|
|
69
|
-
"error",
|
|
70
71
|
"error_outline",
|
|
72
|
+
"error",
|
|
71
73
|
"event",
|
|
72
74
|
"expand_less",
|
|
73
75
|
"expand_more",
|
|
76
|
+
"facebook",
|
|
74
77
|
"fast_forward",
|
|
75
78
|
"fast_rewind",
|
|
76
|
-
"favorite",
|
|
77
79
|
"favorite_border",
|
|
80
|
+
"favorite",
|
|
78
81
|
"fax",
|
|
79
82
|
"file_download",
|
|
80
83
|
"file_present",
|
|
@@ -84,19 +87,21 @@ export const ICON_TYPES = [
|
|
|
84
87
|
"fingerprint",
|
|
85
88
|
"first_page",
|
|
86
89
|
"flag",
|
|
90
|
+
"flickr",
|
|
87
91
|
"flight",
|
|
88
92
|
"flooding",
|
|
89
|
-
"folder",
|
|
90
93
|
"folder_open",
|
|
94
|
+
"folder",
|
|
91
95
|
"format_quote",
|
|
92
96
|
"format_size",
|
|
93
97
|
"forum",
|
|
98
|
+
"github",
|
|
94
99
|
"grid_view",
|
|
95
100
|
"group_add",
|
|
96
101
|
"groups",
|
|
97
102
|
"hearing",
|
|
98
|
-
"help",
|
|
99
103
|
"help_outline",
|
|
104
|
+
"help",
|
|
100
105
|
"highlight_off",
|
|
101
106
|
"history",
|
|
102
107
|
"home",
|
|
@@ -106,18 +111,20 @@ export const ICON_TYPES = [
|
|
|
106
111
|
"hurricane",
|
|
107
112
|
"identification",
|
|
108
113
|
"image",
|
|
109
|
-
"info",
|
|
110
114
|
"info_outline",
|
|
115
|
+
"info",
|
|
111
116
|
"insights",
|
|
117
|
+
"instagram",
|
|
112
118
|
"keyboard",
|
|
113
119
|
"label",
|
|
114
120
|
"language",
|
|
115
121
|
"last_page",
|
|
116
122
|
"launch",
|
|
117
|
-
"lightbulb",
|
|
118
123
|
"lightbulb_outline",
|
|
119
|
-
"
|
|
124
|
+
"lightbulb",
|
|
120
125
|
"link_off",
|
|
126
|
+
"link",
|
|
127
|
+
"linkedin",
|
|
121
128
|
"list",
|
|
122
129
|
"local_cafe",
|
|
123
130
|
"local_fire_department",
|
|
@@ -133,14 +140,14 @@ export const ICON_TYPES = [
|
|
|
133
140
|
"local_taxi",
|
|
134
141
|
"location_city",
|
|
135
142
|
"location_on",
|
|
136
|
-
"lock",
|
|
137
143
|
"lock_open",
|
|
138
144
|
"lock_outline",
|
|
145
|
+
"lock",
|
|
139
146
|
"login",
|
|
140
147
|
"logout",
|
|
141
148
|
"loop",
|
|
142
|
-
"mail",
|
|
143
149
|
"mail_outline",
|
|
150
|
+
"mail",
|
|
144
151
|
"map",
|
|
145
152
|
"masks",
|
|
146
153
|
"medical_services",
|
|
@@ -150,14 +157,14 @@ export const ICON_TYPES = [
|
|
|
150
157
|
"more_vert",
|
|
151
158
|
"my_location",
|
|
152
159
|
"navigate_before",
|
|
153
|
-
"navigate_next",
|
|
154
160
|
"navigate_far_before",
|
|
155
161
|
"navigate_far_next",
|
|
162
|
+
"navigate_next",
|
|
156
163
|
"near_me",
|
|
157
|
-
"notifications",
|
|
158
164
|
"notifications_active",
|
|
159
165
|
"notifications_none",
|
|
160
166
|
"notifications_off",
|
|
167
|
+
"notifications",
|
|
161
168
|
"park",
|
|
162
169
|
"people",
|
|
163
170
|
"person",
|
|
@@ -171,14 +178,13 @@ export const ICON_TYPES = [
|
|
|
171
178
|
"radio_button_unchecked",
|
|
172
179
|
"rain",
|
|
173
180
|
"reduce_capacity",
|
|
174
|
-
"remove",
|
|
175
181
|
"remove_circle",
|
|
182
|
+
"remove",
|
|
176
183
|
"report",
|
|
177
184
|
"restaurant",
|
|
178
185
|
"rss_feed",
|
|
179
186
|
"safety_divider",
|
|
180
187
|
"sanitizer",
|
|
181
|
-
"severe_weather",
|
|
182
188
|
"save_alt",
|
|
183
189
|
"schedule",
|
|
184
190
|
"school",
|
|
@@ -188,10 +194,11 @@ export const ICON_TYPES = [
|
|
|
188
194
|
"send",
|
|
189
195
|
"sentiment_dissatisfied",
|
|
190
196
|
"sentiment_neutral",
|
|
191
|
-
"sentiment_satisfied",
|
|
192
197
|
"sentiment_satisfied_alt",
|
|
198
|
+
"sentiment_satisfied",
|
|
193
199
|
"sentiment_very_dissatisfied",
|
|
194
200
|
"settings",
|
|
201
|
+
"severe_weather",
|
|
195
202
|
"share",
|
|
196
203
|
"shield",
|
|
197
204
|
"shopping_basket",
|
|
@@ -200,12 +207,12 @@ export const ICON_TYPES = [
|
|
|
200
207
|
"social_distance",
|
|
201
208
|
"sort_arrow",
|
|
202
209
|
"spellcheck",
|
|
203
|
-
"star",
|
|
204
210
|
"star_half",
|
|
205
211
|
"star_outline",
|
|
212
|
+
"star",
|
|
206
213
|
"store",
|
|
207
|
-
"support",
|
|
208
214
|
"support_agent",
|
|
215
|
+
"support",
|
|
209
216
|
"text_fields",
|
|
210
217
|
"thumb_down_alt",
|
|
211
218
|
"thumb_up_alt",
|
|
@@ -217,39 +224,26 @@ export const ICON_TYPES = [
|
|
|
217
224
|
"translate",
|
|
218
225
|
"trending_down",
|
|
219
226
|
"trending_up",
|
|
227
|
+
"twitter",
|
|
220
228
|
"undo",
|
|
221
229
|
"unfold_less",
|
|
222
230
|
"unfold_more",
|
|
223
231
|
"update",
|
|
224
232
|
"upload_file",
|
|
225
|
-
"verified",
|
|
226
233
|
"verified_user",
|
|
227
|
-
"
|
|
234
|
+
"verified",
|
|
228
235
|
"visibility_off",
|
|
236
|
+
"visibility",
|
|
229
237
|
"volume_off",
|
|
230
238
|
"warning",
|
|
231
239
|
"wash",
|
|
232
240
|
"wifi",
|
|
233
241
|
"work",
|
|
242
|
+
"x",
|
|
243
|
+
"youtube",
|
|
234
244
|
"zoom_in",
|
|
235
245
|
"zoom_out_map",
|
|
236
246
|
"zoom_out",
|
|
237
|
-
"visibility",
|
|
238
|
-
"home",
|
|
239
|
-
"print",
|
|
240
|
-
"search",
|
|
241
|
-
"check_circle",
|
|
242
|
-
"warning",
|
|
243
|
-
"info",
|
|
244
|
-
"cancel",
|
|
245
|
-
"check_circle",
|
|
246
|
-
"warning",
|
|
247
|
-
"info",
|
|
248
|
-
"cancel",
|
|
249
|
-
"help",
|
|
250
|
-
"people",
|
|
251
|
-
"mail",
|
|
252
|
-
"support",
|
|
253
247
|
] as const;
|
|
254
248
|
|
|
255
249
|
export type USAIcon = (typeof ICON_TYPES)[number];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { inject, injectable
|
|
1
|
+
import { inject, injectable } from "@joist/di";
|
|
2
2
|
import { attr, css, element } from "@joist/element";
|
|
3
3
|
|
|
4
4
|
import { IconService } from "../services/icon.service.js";
|
|
@@ -41,12 +41,6 @@ export class USAIconElement extends HTMLElement {
|
|
|
41
41
|
#icon = inject(IconService);
|
|
42
42
|
#injected = false;
|
|
43
43
|
|
|
44
|
-
@injected()
|
|
45
|
-
onInjected() {
|
|
46
|
-
this.#injected = true;
|
|
47
|
-
this.#updateIcon();
|
|
48
|
-
}
|
|
49
|
-
|
|
50
44
|
attributeChangedCallback(_: string, newVal: string, oldVal: string) {
|
|
51
45
|
if (this.#injected) {
|
|
52
46
|
if (newVal !== oldVal) {
|
|
@@ -55,6 +49,11 @@ export class USAIconElement extends HTMLElement {
|
|
|
55
49
|
}
|
|
56
50
|
}
|
|
57
51
|
|
|
52
|
+
connectedCallback() {
|
|
53
|
+
this.#injected = true;
|
|
54
|
+
this.#updateIcon();
|
|
55
|
+
}
|
|
56
|
+
|
|
58
57
|
async #updateIcon() {
|
|
59
58
|
const icon = this.#icon();
|
|
60
59
|
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import "@joist/templating/define.js";
|
|
1
2
|
declare global {
|
|
2
3
|
interface HTMLElementTagNameMap {
|
|
3
4
|
"usa-button": USAButtonElement;
|
|
@@ -12,8 +13,8 @@ export declare class USAButtonElement extends HTMLElement {
|
|
|
12
13
|
accessor disabled: boolean;
|
|
13
14
|
accessor variant: ButtonVariant;
|
|
14
15
|
accessor value: string;
|
|
16
|
+
accessor href: string;
|
|
17
|
+
accessor target: string;
|
|
15
18
|
accessor tabIndex: number;
|
|
16
|
-
onReady(): void;
|
|
17
19
|
onInternalClick(): void;
|
|
18
|
-
attributeChangedCallback(): void;
|
|
19
20
|
}
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { __esDecorate, __runInitializers } from "tslib";
|
|
2
|
-
import
|
|
2
|
+
import "@joist/templating/define.js";
|
|
3
|
+
import { attr, css, element, html, listen } from "@joist/element";
|
|
4
|
+
import { bind } from "@joist/templating";
|
|
3
5
|
export const BUTTON_VARIANTS = [
|
|
4
6
|
"primary",
|
|
5
7
|
"secondary",
|
|
@@ -15,8 +17,8 @@ let USAButtonElement = (() => {
|
|
|
15
17
|
delegatesFocus: true,
|
|
16
18
|
},
|
|
17
19
|
shadowDom: [
|
|
18
|
-
css `:host{display:inline-block;border-top-right-radius:.25rem;border-bottom-right-radius:.25rem;border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}button{box-sizing:border-box;font-size:1.06rem;line-height:.9;color:#fff;background-color:#005ea2;-webkit-appearance:none;-moz-appearance:none;appearance:none;align-items:center;border:0;
|
|
19
|
-
html `<button tabindex="0"><slot></slot></button>`,
|
|
20
|
+
css `:host{display:inline-block;border-top-right-radius:.25rem;border-bottom-right-radius:.25rem;border-top-left-radius:.25rem;border-bottom-left-radius:.25rem;overflow:hidden}a,button{box-sizing:border-box;font-size:1.06rem;line-height:.9;color:#fff;background-color:#005ea2;-webkit-appearance:none;-moz-appearance:none;appearance:none;align-items:center;border:0;cursor:pointer;-moz-column-gap:0.5rem;column-gap:.5rem;display:inline-flex;font-weight:700;justify-content:center;padding:.75rem 1.25rem;text-align:center;text-decoration:none;width:100%;height:100%;cursor:pointer}@media all and (min-width:30em){:host{width:auto}}:is(button,a):visited{color:#fff}:is(button,a):hover{color:#fff;background-color:#1a4480;border-bottom:0;text-decoration:none}:is(button,a):active{color:#fff;background-color:#162e51}:is(button,a):not([disabled]):focus{outline-offset:0.25rem}:is(button,a):disabled{color:#454545;background-color:#c9c9c9;cursor:not-allowed;opacity:1}:is(button,a):disabled:active,:is(button,a):disabled:focus,:is(button,a):disabled:hover{color:#454545;background-color:#c9c9c9}:is(button,a):focus{outline:.25rem solid #2491ff;outline-offset:0}:host([variant=secondary]) :is(button,a){color:#fff;background-color:#d83933}:host([variant=secondary]) :is(button,a):hover{background-color:#b50909}:host([variant=secondary]) :is(button,a):active{background-color:#8b0a03}:host([variant=cool]) :is(button,a){color:#1b1b1b;background-color:#00bde3}:host([variant=cool]) :is(button,a):hover{background-color:#28a0cb}:host([variant=cool]) :is(button,a):active{color:#fff;background-color:#07648d}:host([variant=warm]) :is(button,a){color:#1b1b1b;background-color:#fa9441}:host([variant=warm]) :is(button,a):hover{color:#fff;background-color:#c05600}:host([variant=warm]) :is(button,a):active{color:#fff;background-color:#775540}:host([variant=outline]) :is(button,a){background-color:transparent;box-shadow:inset 0 0 0 2px #005ea2;color:#005ea2}:host([variant=outline]) :is(button,a):hover{box-shadow:inset 0 0 0 2px #1a4480;color:#1a4480}:host([variant=outline]) :is(button,a):active{box-shadow:inset 0 0 0 2px #162e51;color:#162e51}`,
|
|
21
|
+
html `<j-if bind="href"><template><j-props><a $href="href" $disabled="disabled" $target="target"><slot></slot></a></j-props></template><template else><j-props><button tabindex="0" $type="type" $disabled="disabled" $value="value"><slot></slot></button></j-props></template></j-if>`,
|
|
20
22
|
],
|
|
21
23
|
})];
|
|
22
24
|
let _classDescriptor;
|
|
@@ -36,23 +38,30 @@ let USAButtonElement = (() => {
|
|
|
36
38
|
let _value_decorators;
|
|
37
39
|
let _value_initializers = [];
|
|
38
40
|
let _value_extraInitializers = [];
|
|
39
|
-
let
|
|
41
|
+
let _href_decorators;
|
|
42
|
+
let _href_initializers = [];
|
|
43
|
+
let _href_extraInitializers = [];
|
|
44
|
+
let _target_decorators;
|
|
45
|
+
let _target_initializers = [];
|
|
46
|
+
let _target_extraInitializers = [];
|
|
40
47
|
let _onInternalClick_decorators;
|
|
41
48
|
var USAButtonElement = class extends _classSuper {
|
|
42
49
|
static { _classThis = this; }
|
|
43
50
|
static {
|
|
44
51
|
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
|
|
45
|
-
_type_decorators = [attr()];
|
|
46
|
-
_disabled_decorators = [attr()];
|
|
52
|
+
_type_decorators = [attr(), bind()];
|
|
53
|
+
_disabled_decorators = [attr(), bind()];
|
|
47
54
|
_variant_decorators = [attr()];
|
|
48
|
-
_value_decorators = [attr()];
|
|
49
|
-
|
|
55
|
+
_value_decorators = [attr(), bind()];
|
|
56
|
+
_href_decorators = [attr(), bind()];
|
|
57
|
+
_target_decorators = [attr(), bind()];
|
|
50
58
|
_onInternalClick_decorators = [listen("click")];
|
|
51
59
|
__esDecorate(this, 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);
|
|
52
60
|
__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);
|
|
53
61
|
__esDecorate(this, 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);
|
|
54
62
|
__esDecorate(this, 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);
|
|
55
|
-
__esDecorate(this, null,
|
|
63
|
+
__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);
|
|
64
|
+
__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);
|
|
56
65
|
__esDecorate(this, 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);
|
|
57
66
|
__esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
|
|
58
67
|
USAButtonElement = _classThis = _classDescriptor.value;
|
|
@@ -71,20 +80,19 @@ let USAButtonElement = (() => {
|
|
|
71
80
|
#value_accessor_storage = (__runInitializers(this, _variant_extraInitializers), __runInitializers(this, _value_initializers, ""));
|
|
72
81
|
get value() { return this.#value_accessor_storage; }
|
|
73
82
|
set value(value) { this.#value_accessor_storage = value; }
|
|
74
|
-
#
|
|
83
|
+
#href_accessor_storage = (__runInitializers(this, _value_extraInitializers), __runInitializers(this, _href_initializers, ""));
|
|
84
|
+
get href() { return this.#href_accessor_storage; }
|
|
85
|
+
set href(value) { this.#href_accessor_storage = value; }
|
|
86
|
+
#target_accessor_storage = (__runInitializers(this, _href_extraInitializers), __runInitializers(this, _target_initializers, ""));
|
|
87
|
+
get target() { return this.#target_accessor_storage; }
|
|
88
|
+
set target(value) { this.#target_accessor_storage = value; }
|
|
89
|
+
#tabIndex_accessor_storage = (__runInitializers(this, _target_extraInitializers), 0);
|
|
75
90
|
get tabIndex() { return this.#tabIndex_accessor_storage; }
|
|
76
91
|
set tabIndex(value) { this.#tabIndex_accessor_storage = value; }
|
|
77
92
|
#internals = this.attachInternals();
|
|
78
|
-
#button = query("button");
|
|
79
|
-
onReady() {
|
|
80
|
-
this.#button({ autofocus: this.autofocus });
|
|
81
|
-
}
|
|
82
93
|
onInternalClick() {
|
|
83
94
|
this.#handleForm();
|
|
84
95
|
}
|
|
85
|
-
attributeChangedCallback() {
|
|
86
|
-
this.#button({ type: this.type, disabled: this.disabled });
|
|
87
|
-
}
|
|
88
96
|
#handleForm() {
|
|
89
97
|
const { form } = this.#internals;
|
|
90
98
|
if (form) {
|
|
@@ -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,
|
|
1
|
+
{"version":3,"file":"button.element.js","sourceRoot":"","sources":["../../../src/lib/button/button.element.ts"],"names":[],"mappings":"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"}
|
|
@@ -5,7 +5,7 @@ const meta = {
|
|
|
5
5
|
title: "usa-button",
|
|
6
6
|
tags: ["autodocs"],
|
|
7
7
|
render() {
|
|
8
|
-
return html `<div style="display:inline-flex;flex-direction:column;gap:1rem">${BUTTON_VARIANTS.map((variant, i) => html `<usa-button variant="${variant}">Hello World</usa-button>${i === BUTTON_VARIANTS.length - 1 ? "" : "\n\n"}`)}<usa-button disabled="disabled">Disabled</usa-button></div>`;
|
|
8
|
+
return html `<div style="display:inline-flex;flex-direction:column;gap:1rem">${BUTTON_VARIANTS.map((variant, i) => html `<usa-button variant="${variant}">Hello World</usa-button>${i === BUTTON_VARIANTS.length - 1 ? "" : "\n\n"}`)} ${BUTTON_VARIANTS.map((variant, i) => html `<usa-button href="#" variant="${variant}">Hello World (Link)</usa-button>${i === BUTTON_VARIANTS.length - 1 ? "" : "\n\n"}`)}<usa-button disabled="disabled">Disabled</usa-button></div>`;
|
|
9
9
|
},
|
|
10
10
|
argTypes: {},
|
|
11
11
|
args: {},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.stories.js","sourceRoot":"","sources":["../../../src/lib/button/button.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAE3B,OAAO,EAAE,eAAe,EAAyB,MAAM,qBAAqB,CAAC;AAE7E,kFAAkF;AAClF,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,YAAY;IACnB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,MAAM;QACJ,OAAO,IAAI,CAAA;;UAEL,eAAe,CAAC,GAAG,CACnB,CAAC,OAAO,EAAE,CAAC,EAAE,EAAE,CACb,IAAI,CAAA,uBAAuB,OAAO,6BAChC,CAAC,KAAK,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAC1C,EAAE,CACL;;;KAGJ,CAAC;IACJ,CAAC;IACD,QAAQ,EAAE,EAAE;IACZ,IAAI,EAAE,EAAE;CACwB,CAAC;AAEnC,eAAe,IAAI,CAAC;AAIpB,wFAAwF;AACxF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE;CACT,CAAC"}
|
|
1
|
+
{"version":3,"file":"button.stories.js","sourceRoot":"","sources":["../../../src/lib/button/button.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAE3B,OAAO,EAAE,eAAe,EAAyB,MAAM,qBAAqB,CAAC;AAE7E,kFAAkF;AAClF,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,YAAY;IACnB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,MAAM;QACJ,OAAO,IAAI,CAAA;;UAEL,eAAe,CAAC,GAAG,CACnB,CAAC,OAAO,EAAE,CAAC,EAAE,EAAE,CACb,IAAI,CAAA,uBAAuB,OAAO,6BAChC,CAAC,KAAK,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAC1C,EAAE,CACL;UACC,eAAe,CAAC,GAAG,CACnB,CAAC,OAAO,EAAE,CAAC,EAAE,EAAE,CACb,IAAI,CAAA,gCAAgC,OAAO,oCACzC,CAAC,KAAK,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAC1C,EAAE,CACL;;;KAGJ,CAAC;IACJ,CAAC;IACD,QAAQ,EAAE,EAAE;IACZ,IAAI,EAAE,EAAE;CACwB,CAAC;AAEnC,eAAe,IAAI,CAAC;AAIpB,wFAAwF;AACxF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE;CACT,CAAC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export declare const ICON_TYPES: readonly ["accessibility_new", "accessible_forward", "account_balance", "account_box", "account_circle", "
|
|
1
|
+
export declare const ICON_TYPES: readonly ["accessibility_new", "accessible_forward", "account_balance", "account_box", "account_circle", "add_circle_outline", "add_circle", "add", "alarm", "alternate_email", "announcement", "api", "arrow_back", "arrow_downward", "arrow_drop_down", "arrow_drop_up", "arrow_forward", "arrow_upward", "assessment", "attach_file", "attach_money", "autorenew", "backpack", "bathtub", "bedding", "bookmark", "bug_report", "build", "calendar_today", "campaign", "camping", "cancel", "chat", "check_box_outline_blank", "check_circle_outline", "check_circle", "check", "checkroom", "chevron_left", "chevron_right", "clean_hands", "close", "closed_caption", "clothes", "cloud", "code", "comment", "connect_without_contact", "construction_worker", "construction", "contact_page", "content_copy", "coronavirus", "credit_card", "deck", "delete", "device_thermostat", "directions_bike", "directions_bus", "directions_car", "directions_walk", "directions", "do_not_disturb", "do_not_touch", "drag_handle", "eco", "edit", "electrical_services", "emoji_events", "error_outline", "error", "event", "expand_less", "expand_more", "facebook", "fast_forward", "fast_rewind", "favorite_border", "favorite", "fax", "file_download", "file_present", "file_upload", "filter_alt", "filter_list", "fingerprint", "first_page", "flag", "flickr", "flight", "flooding", "folder_open", "folder", "format_quote", "format_size", "forum", "github", "grid_view", "group_add", "groups", "hearing", "help_outline", "help", "highlight_off", "history", "home", "hospital", "hotel", "hourglass_empty", "hurricane", "identification", "image", "info_outline", "info", "insights", "instagram", "keyboard", "label", "language", "last_page", "launch", "lightbulb_outline", "lightbulb", "link_off", "link", "linkedin", "list", "local_cafe", "local_fire_department", "local_gas_station", "local_grocery_store", "local_hospital", "local_laundry_service", "local_library", "local_offer", "local_parking", "local_pharmacy", "local_police", "local_taxi", "location_city", "location_on", "lock_open", "lock_outline", "lock", "login", "logout", "loop", "mail_outline", "mail", "map", "masks", "medical_services", "menu", "military_tech", "more_horiz", "more_vert", "my_location", "navigate_before", "navigate_far_before", "navigate_far_next", "navigate_next", "near_me", "notifications_active", "notifications_none", "notifications_off", "notifications", "park", "people", "person", "pets", "phone", "photo_camera", "print", "priority_high", "public", "push_pin", "radio_button_unchecked", "rain", "reduce_capacity", "remove_circle", "remove", "report", "restaurant", "rss_feed", "safety_divider", "sanitizer", "save_alt", "schedule", "school", "science", "search", "security", "send", "sentiment_dissatisfied", "sentiment_neutral", "sentiment_satisfied_alt", "sentiment_satisfied", "sentiment_very_dissatisfied", "settings", "severe_weather", "share", "shield", "shopping_basket", "snow", "soap", "social_distance", "sort_arrow", "spellcheck", "star_half", "star_outline", "star", "store", "support_agent", "support", "text_fields", "thumb_down_alt", "thumb_up_alt", "timer", "toggle_off", "toggle_on", "topic", "tornado", "translate", "trending_down", "trending_up", "twitter", "undo", "unfold_less", "unfold_more", "update", "upload_file", "verified_user", "verified", "visibility_off", "visibility", "volume_off", "warning", "wash", "wifi", "work", "x", "youtube", "zoom_in", "zoom_out_map", "zoom_out"];
|
|
2
2
|
export type USAIcon = (typeof ICON_TYPES)[number];
|
|
@@ -4,19 +4,19 @@ export const ICON_TYPES = [
|
|
|
4
4
|
"account_balance",
|
|
5
5
|
"account_box",
|
|
6
6
|
"account_circle",
|
|
7
|
-
"add",
|
|
8
|
-
"add_circle",
|
|
9
7
|
"add_circle_outline",
|
|
8
|
+
"add_circle",
|
|
9
|
+
"add",
|
|
10
10
|
"alarm",
|
|
11
11
|
"alternate_email",
|
|
12
12
|
"announcement",
|
|
13
|
+
"api",
|
|
13
14
|
"arrow_back",
|
|
14
15
|
"arrow_downward",
|
|
15
16
|
"arrow_drop_down",
|
|
16
17
|
"arrow_drop_up",
|
|
17
18
|
"arrow_forward",
|
|
18
19
|
"arrow_upward",
|
|
19
|
-
"api",
|
|
20
20
|
"assessment",
|
|
21
21
|
"attach_file",
|
|
22
22
|
"attach_money",
|
|
@@ -32,21 +32,23 @@ export const ICON_TYPES = [
|
|
|
32
32
|
"camping",
|
|
33
33
|
"cancel",
|
|
34
34
|
"chat",
|
|
35
|
-
"check",
|
|
36
35
|
"check_box_outline_blank",
|
|
37
|
-
"check_circle",
|
|
38
36
|
"check_circle_outline",
|
|
37
|
+
"check_circle",
|
|
38
|
+
"check",
|
|
39
39
|
"checkroom",
|
|
40
|
+
"chevron_left",
|
|
41
|
+
"chevron_right",
|
|
40
42
|
"clean_hands",
|
|
41
|
-
"clothes",
|
|
42
43
|
"close",
|
|
43
44
|
"closed_caption",
|
|
45
|
+
"clothes",
|
|
44
46
|
"cloud",
|
|
45
47
|
"code",
|
|
46
48
|
"comment",
|
|
47
49
|
"connect_without_contact",
|
|
48
|
-
"construction",
|
|
49
50
|
"construction_worker",
|
|
51
|
+
"construction",
|
|
50
52
|
"contact_page",
|
|
51
53
|
"content_copy",
|
|
52
54
|
"coronavirus",
|
|
@@ -54,11 +56,11 @@ export const ICON_TYPES = [
|
|
|
54
56
|
"deck",
|
|
55
57
|
"delete",
|
|
56
58
|
"device_thermostat",
|
|
57
|
-
"directions",
|
|
58
59
|
"directions_bike",
|
|
59
60
|
"directions_bus",
|
|
60
61
|
"directions_car",
|
|
61
62
|
"directions_walk",
|
|
63
|
+
"directions",
|
|
62
64
|
"do_not_disturb",
|
|
63
65
|
"do_not_touch",
|
|
64
66
|
"drag_handle",
|
|
@@ -66,15 +68,16 @@ export const ICON_TYPES = [
|
|
|
66
68
|
"edit",
|
|
67
69
|
"electrical_services",
|
|
68
70
|
"emoji_events",
|
|
69
|
-
"error",
|
|
70
71
|
"error_outline",
|
|
72
|
+
"error",
|
|
71
73
|
"event",
|
|
72
74
|
"expand_less",
|
|
73
75
|
"expand_more",
|
|
76
|
+
"facebook",
|
|
74
77
|
"fast_forward",
|
|
75
78
|
"fast_rewind",
|
|
76
|
-
"favorite",
|
|
77
79
|
"favorite_border",
|
|
80
|
+
"favorite",
|
|
78
81
|
"fax",
|
|
79
82
|
"file_download",
|
|
80
83
|
"file_present",
|
|
@@ -84,19 +87,21 @@ export const ICON_TYPES = [
|
|
|
84
87
|
"fingerprint",
|
|
85
88
|
"first_page",
|
|
86
89
|
"flag",
|
|
90
|
+
"flickr",
|
|
87
91
|
"flight",
|
|
88
92
|
"flooding",
|
|
89
|
-
"folder",
|
|
90
93
|
"folder_open",
|
|
94
|
+
"folder",
|
|
91
95
|
"format_quote",
|
|
92
96
|
"format_size",
|
|
93
97
|
"forum",
|
|
98
|
+
"github",
|
|
94
99
|
"grid_view",
|
|
95
100
|
"group_add",
|
|
96
101
|
"groups",
|
|
97
102
|
"hearing",
|
|
98
|
-
"help",
|
|
99
103
|
"help_outline",
|
|
104
|
+
"help",
|
|
100
105
|
"highlight_off",
|
|
101
106
|
"history",
|
|
102
107
|
"home",
|
|
@@ -106,18 +111,20 @@ export const ICON_TYPES = [
|
|
|
106
111
|
"hurricane",
|
|
107
112
|
"identification",
|
|
108
113
|
"image",
|
|
109
|
-
"info",
|
|
110
114
|
"info_outline",
|
|
115
|
+
"info",
|
|
111
116
|
"insights",
|
|
117
|
+
"instagram",
|
|
112
118
|
"keyboard",
|
|
113
119
|
"label",
|
|
114
120
|
"language",
|
|
115
121
|
"last_page",
|
|
116
122
|
"launch",
|
|
117
|
-
"lightbulb",
|
|
118
123
|
"lightbulb_outline",
|
|
119
|
-
"
|
|
124
|
+
"lightbulb",
|
|
120
125
|
"link_off",
|
|
126
|
+
"link",
|
|
127
|
+
"linkedin",
|
|
121
128
|
"list",
|
|
122
129
|
"local_cafe",
|
|
123
130
|
"local_fire_department",
|
|
@@ -133,14 +140,14 @@ export const ICON_TYPES = [
|
|
|
133
140
|
"local_taxi",
|
|
134
141
|
"location_city",
|
|
135
142
|
"location_on",
|
|
136
|
-
"lock",
|
|
137
143
|
"lock_open",
|
|
138
144
|
"lock_outline",
|
|
145
|
+
"lock",
|
|
139
146
|
"login",
|
|
140
147
|
"logout",
|
|
141
148
|
"loop",
|
|
142
|
-
"mail",
|
|
143
149
|
"mail_outline",
|
|
150
|
+
"mail",
|
|
144
151
|
"map",
|
|
145
152
|
"masks",
|
|
146
153
|
"medical_services",
|
|
@@ -150,14 +157,14 @@ export const ICON_TYPES = [
|
|
|
150
157
|
"more_vert",
|
|
151
158
|
"my_location",
|
|
152
159
|
"navigate_before",
|
|
153
|
-
"navigate_next",
|
|
154
160
|
"navigate_far_before",
|
|
155
161
|
"navigate_far_next",
|
|
162
|
+
"navigate_next",
|
|
156
163
|
"near_me",
|
|
157
|
-
"notifications",
|
|
158
164
|
"notifications_active",
|
|
159
165
|
"notifications_none",
|
|
160
166
|
"notifications_off",
|
|
167
|
+
"notifications",
|
|
161
168
|
"park",
|
|
162
169
|
"people",
|
|
163
170
|
"person",
|
|
@@ -171,14 +178,13 @@ export const ICON_TYPES = [
|
|
|
171
178
|
"radio_button_unchecked",
|
|
172
179
|
"rain",
|
|
173
180
|
"reduce_capacity",
|
|
174
|
-
"remove",
|
|
175
181
|
"remove_circle",
|
|
182
|
+
"remove",
|
|
176
183
|
"report",
|
|
177
184
|
"restaurant",
|
|
178
185
|
"rss_feed",
|
|
179
186
|
"safety_divider",
|
|
180
187
|
"sanitizer",
|
|
181
|
-
"severe_weather",
|
|
182
188
|
"save_alt",
|
|
183
189
|
"schedule",
|
|
184
190
|
"school",
|
|
@@ -188,10 +194,11 @@ export const ICON_TYPES = [
|
|
|
188
194
|
"send",
|
|
189
195
|
"sentiment_dissatisfied",
|
|
190
196
|
"sentiment_neutral",
|
|
191
|
-
"sentiment_satisfied",
|
|
192
197
|
"sentiment_satisfied_alt",
|
|
198
|
+
"sentiment_satisfied",
|
|
193
199
|
"sentiment_very_dissatisfied",
|
|
194
200
|
"settings",
|
|
201
|
+
"severe_weather",
|
|
195
202
|
"share",
|
|
196
203
|
"shield",
|
|
197
204
|
"shopping_basket",
|
|
@@ -200,12 +207,12 @@ export const ICON_TYPES = [
|
|
|
200
207
|
"social_distance",
|
|
201
208
|
"sort_arrow",
|
|
202
209
|
"spellcheck",
|
|
203
|
-
"star",
|
|
204
210
|
"star_half",
|
|
205
211
|
"star_outline",
|
|
212
|
+
"star",
|
|
206
213
|
"store",
|
|
207
|
-
"support",
|
|
208
214
|
"support_agent",
|
|
215
|
+
"support",
|
|
209
216
|
"text_fields",
|
|
210
217
|
"thumb_down_alt",
|
|
211
218
|
"thumb_up_alt",
|
|
@@ -217,38 +224,25 @@ export const ICON_TYPES = [
|
|
|
217
224
|
"translate",
|
|
218
225
|
"trending_down",
|
|
219
226
|
"trending_up",
|
|
227
|
+
"twitter",
|
|
220
228
|
"undo",
|
|
221
229
|
"unfold_less",
|
|
222
230
|
"unfold_more",
|
|
223
231
|
"update",
|
|
224
232
|
"upload_file",
|
|
225
|
-
"verified",
|
|
226
233
|
"verified_user",
|
|
227
|
-
"
|
|
234
|
+
"verified",
|
|
228
235
|
"visibility_off",
|
|
236
|
+
"visibility",
|
|
229
237
|
"volume_off",
|
|
230
238
|
"warning",
|
|
231
239
|
"wash",
|
|
232
240
|
"wifi",
|
|
233
241
|
"work",
|
|
242
|
+
"x",
|
|
243
|
+
"youtube",
|
|
234
244
|
"zoom_in",
|
|
235
245
|
"zoom_out_map",
|
|
236
246
|
"zoom_out",
|
|
237
|
-
"visibility",
|
|
238
|
-
"home",
|
|
239
|
-
"print",
|
|
240
|
-
"search",
|
|
241
|
-
"check_circle",
|
|
242
|
-
"warning",
|
|
243
|
-
"info",
|
|
244
|
-
"cancel",
|
|
245
|
-
"check_circle",
|
|
246
|
-
"warning",
|
|
247
|
-
"info",
|
|
248
|
-
"cancel",
|
|
249
|
-
"help",
|
|
250
|
-
"people",
|
|
251
|
-
"mail",
|
|
252
|
-
"support",
|
|
253
247
|
];
|
|
254
248
|
//# sourceMappingURL=icon-types.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-types.js","sourceRoot":"","sources":["../../../src/lib/icon/icon-types.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,mBAAmB;IACnB,oBAAoB;IACpB,iBAAiB;IACjB,aAAa;IACb,gBAAgB;IAChB,
|
|
1
|
+
{"version":3,"file":"icon-types.js","sourceRoot":"","sources":["../../../src/lib/icon/icon-types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { __esDecorate, __runInitializers } from "tslib";
|
|
2
|
-
import { inject, injectable
|
|
2
|
+
import { inject, injectable } from "@joist/di";
|
|
3
3
|
import { attr, css, element } from "@joist/element";
|
|
4
4
|
import { IconService } from "../services/icon.service.js";
|
|
5
5
|
let USAIconElement = (() => {
|
|
@@ -15,34 +15,26 @@ let USAIconElement = (() => {
|
|
|
15
15
|
let _classExtraInitializers = [];
|
|
16
16
|
let _classThis;
|
|
17
17
|
let _classSuper = HTMLElement;
|
|
18
|
-
let _instanceExtraInitializers = [];
|
|
19
18
|
let _icon_decorators;
|
|
20
19
|
let _icon_initializers = [];
|
|
21
20
|
let _icon_extraInitializers = [];
|
|
22
|
-
let _onInjected_decorators;
|
|
23
21
|
var USAIconElement = class extends _classSuper {
|
|
24
22
|
static { _classThis = this; }
|
|
25
23
|
static {
|
|
26
24
|
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
|
|
27
25
|
_icon_decorators = [attr()];
|
|
28
|
-
_onInjected_decorators = [injected()];
|
|
29
26
|
__esDecorate(this, null, _icon_decorators, { kind: "accessor", name: "icon", static: false, private: false, access: { has: obj => "icon" in obj, get: obj => obj.icon, set: (obj, value) => { obj.icon = value; } }, metadata: _metadata }, _icon_initializers, _icon_extraInitializers);
|
|
30
|
-
__esDecorate(this, null, _onInjected_decorators, { kind: "method", name: "onInjected", static: false, private: false, access: { has: obj => "onInjected" in obj, get: obj => obj.onInjected }, metadata: _metadata }, null, _instanceExtraInitializers);
|
|
31
27
|
__esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
|
|
32
28
|
USAIconElement = _classThis = _classDescriptor.value;
|
|
33
29
|
if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
34
30
|
__runInitializers(_classThis, _classExtraInitializers);
|
|
35
31
|
}
|
|
36
|
-
#icon_accessor_storage =
|
|
32
|
+
#icon_accessor_storage = __runInitializers(this, _icon_initializers, "accessibility_new");
|
|
37
33
|
get icon() { return this.#icon_accessor_storage; }
|
|
38
34
|
set icon(value) { this.#icon_accessor_storage = value; }
|
|
39
35
|
ariaHidden = (__runInitializers(this, _icon_extraInitializers), "true");
|
|
40
36
|
#icon = inject(IconService);
|
|
41
37
|
#injected = false;
|
|
42
|
-
onInjected() {
|
|
43
|
-
this.#injected = true;
|
|
44
|
-
this.#updateIcon();
|
|
45
|
-
}
|
|
46
38
|
attributeChangedCallback(_, newVal, oldVal) {
|
|
47
39
|
if (this.#injected) {
|
|
48
40
|
if (newVal !== oldVal) {
|
|
@@ -50,6 +42,10 @@ let USAIconElement = (() => {
|
|
|
50
42
|
}
|
|
51
43
|
}
|
|
52
44
|
}
|
|
45
|
+
connectedCallback() {
|
|
46
|
+
this.#injected = true;
|
|
47
|
+
this.#updateIcon();
|
|
48
|
+
}
|
|
53
49
|
async #updateIcon() {
|
|
54
50
|
const icon = this.#icon();
|
|
55
51
|
if (this.shadowRoot) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.element.js","sourceRoot":"","sources":["../../../src/lib/icon/icon.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,
|
|
1
|
+
{"version":3,"file":"icon.element.js","sourceRoot":"","sources":["../../../src/lib/icon/icon.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEpD,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;IA+B7C,cAAc;4BAtB1B,OAAO,CAAC;YACP,OAAO,EAAE,UAAU;YACnB,SAAS,EAAE;gBACT,GAAG,CAAA;;;;;;;;;;;;;KAaF;aACF;SACF,CAAC,EACD,UAAU,CAAC;YACV,IAAI,EAAE,cAAc;SACrB,CAAC;;;;sBACkC,WAAW;;;;8BAAnB,SAAQ,WAAW;;;;gCAC5C,IAAI,EAAE;YACP,iKAAS,IAAI,6BAAJ,IAAI,mFAAgC;YAF/C,6KAmCC;;;YAnCY,uDAAc;;QAEzB,qEAAyB,mBAAmB,EAAC;QAA7C,IAAS,IAAI,0CAAgC;QAA7C,IAAS,IAAI,gDAAgC;QAE7C,UAAU,sDAAkB,MAAM,EAAC;QAEnC,KAAK,GAAG,MAAM,CAAC,WAAW,CAAC,CAAC;QAC5B,SAAS,GAAG,KAAK,CAAC;QAElB,wBAAwB,CAAC,CAAS,EAAE,MAAc,EAAE,MAAc;YAChE,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;gBACnB,IAAI,MAAM,KAAK,MAAM,EAAE,CAAC;oBACtB,IAAI,CAAC,WAAW,EAAE,CAAC;gBACrB,CAAC;YACH,CAAC;QACH,CAAC;QAED,iBAAiB;YACf,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;YACtB,IAAI,CAAC,WAAW,EAAE,CAAC;QACrB,CAAC;QAED,KAAK,CAAC,WAAW;YACf,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC;YAE1B,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;gBACpB,MAAM,WAAW,GAAG,MAAM,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;gBAElD,IAAI,IAAI,CAAC,UAAU,CAAC,iBAAiB,EAAE,CAAC;oBACtC,IAAI,CAAC,UAAU,CAAC,iBAAiB,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;gBAC7D,CAAC;qBAAM,CAAC;oBACN,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;gBACtC,CAAC;YACH,CAAC;QACH,CAAC;;;;SAlCU,cAAc"}
|