@govbr-ds/webcomponents 2.0.0-next.14 → 2.0.0-next.16
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/dist/cjs/br-avatar.cjs.entry.js +2 -2
- package/dist/cjs/br-avatar.cjs.entry.js.map +1 -1
- package/dist/cjs/br-button_2.cjs.entry.js +3 -3
- package/dist/cjs/br-button_2.cjs.entry.js.map +1 -1
- package/dist/cjs/br-checkbox.cjs.entry.js +2 -2
- package/dist/cjs/br-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/br-dropdown.cjs.entry.js +2 -2
- package/dist/cjs/br-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/br-input.cjs.entry.js +2 -2
- package/dist/cjs/br-input.cjs.entry.js.map +1 -1
- package/dist/cjs/br-item.cjs.entry.js +3 -3
- package/dist/cjs/br-item.cjs.entry.js.map +1 -1
- package/dist/cjs/br-list.cjs.entry.js +2 -2
- package/dist/cjs/br-list.cjs.entry.js.map +1 -1
- package/dist/cjs/br-loading.cjs.entry.js +3 -3
- package/dist/cjs/br-loading.cjs.entry.js.map +1 -1
- package/dist/cjs/br-message.cjs.entry.js +3 -3
- package/dist/cjs/br-message.cjs.entry.js.map +1 -1
- package/dist/cjs/br-radio.cjs.entry.js +41 -37
- package/dist/cjs/br-radio.cjs.entry.js.map +1 -1
- package/dist/cjs/br-switch.cjs.entry.js +3 -3
- package/dist/cjs/br-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/br-textarea.cjs.entry.js +158 -0
- package/dist/cjs/br-textarea.cjs.entry.js.map +1 -0
- package/dist/cjs/{index-fb4e9eaf.js → index-a1cc4aa4.js} +7 -2
- package/dist/cjs/index-a1cc4aa4.js.map +1 -0
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/webcomponents.cjs.js +2 -2
- package/dist/collection/collection-manifest.json +2 -1
- package/dist/collection/components/avatar/avatar.css +54 -19
- package/dist/collection/components/button/button.css +68 -19
- package/dist/collection/components/checkbox/checkbox.css +54 -19
- package/dist/collection/components/dropdown/dropdown.css +54 -19
- package/dist/collection/components/icon/icon.css +54 -19
- package/dist/collection/components/input/input.css +54 -19
- package/dist/collection/components/item/item.css +54 -19
- package/dist/collection/components/item/item.js +1 -1
- package/dist/collection/components/item/item.js.map +1 -1
- package/dist/collection/components/list/list.css +54 -19
- package/dist/collection/components/loading/loading.css +68 -19
- package/dist/collection/components/loading/loading.js +1 -1
- package/dist/collection/components/loading/loading.js.map +1 -1
- package/dist/collection/components/message/message.css +54 -19
- package/dist/collection/components/message/message.js +1 -1
- package/dist/collection/components/message/message.js.map +1 -1
- package/dist/collection/components/radio/radio.css +54 -19
- package/dist/collection/components/radio/radio.js +43 -62
- package/dist/collection/components/radio/radio.js.map +1 -1
- package/dist/collection/components/switch/switch.css +54 -19
- package/dist/collection/components/switch/switch.js +1 -1
- package/dist/collection/components/switch/switch.js.map +1 -1
- package/dist/collection/components/textarea/textarea.css +504 -0
- package/dist/collection/components/textarea/textarea.js +566 -0
- package/dist/collection/components/textarea/textarea.js.map +1 -0
- package/dist/collection/pages/radio/radio.js +1 -1
- package/dist/collection/pages/textarea/textarea.js +19 -0
- package/dist/collection/scripts/menu.js +22 -18
- package/dist/collection/utils/unique-id-generator.js +9 -0
- package/dist/collection/utils/unique-id-generator.js.map +1 -0
- package/dist/components/br-avatar.js +3 -3
- package/dist/components/br-avatar.js.map +1 -1
- package/dist/components/br-button.js +1 -1
- package/dist/components/br-checkbox.js +2 -2
- package/dist/components/br-checkbox.js.map +1 -1
- package/dist/components/br-dropdown.js +2 -2
- package/dist/components/br-dropdown.js.map +1 -1
- package/dist/components/br-icon.js +1 -1
- package/dist/components/br-input.js +4 -4
- package/dist/components/br-input.js.map +1 -1
- package/dist/components/br-item.js +3 -3
- package/dist/components/br-item.js.map +1 -1
- package/dist/components/br-list.js +2 -2
- package/dist/components/br-list.js.map +1 -1
- package/dist/components/br-loading.js +3 -3
- package/dist/components/br-loading.js.map +1 -1
- package/dist/components/br-message.js +5 -5
- package/dist/components/br-message.js.map +1 -1
- package/dist/components/br-radio.js +45 -40
- package/dist/components/br-radio.js.map +1 -1
- package/dist/components/br-switch.js +3 -3
- package/dist/components/br-switch.js.map +1 -1
- package/dist/components/br-textarea.d.ts +11 -0
- package/dist/components/br-textarea.js +181 -0
- package/dist/components/br-textarea.js.map +1 -0
- package/dist/components/index.d.ts +2 -0
- package/dist/components/index.js +2 -1
- package/dist/components/index.js.map +1 -1
- package/dist/components/{p-87afe26f.js → p-215ac56c.js} +3 -3
- package/dist/components/{p-87afe26f.js.map → p-215ac56c.js.map} +1 -1
- package/dist/components/{p-698e7a18.js → p-62a01df5.js} +3 -2
- package/dist/{esm/index-c7037515.js.map → components/p-62a01df5.js.map} +1 -1
- package/dist/components/p-6eb1a607.js +138 -0
- package/dist/components/{p-5769e796.js.map → p-6eb1a607.js.map} +1 -1
- package/dist/esm/br-avatar.entry.js +2 -2
- package/dist/esm/br-avatar.entry.js.map +1 -1
- package/dist/esm/br-button_2.entry.js +3 -3
- package/dist/esm/br-button_2.entry.js.map +1 -1
- package/dist/esm/br-checkbox.entry.js +2 -2
- package/dist/esm/br-checkbox.entry.js.map +1 -1
- package/dist/esm/br-dropdown.entry.js +2 -2
- package/dist/esm/br-dropdown.entry.js.map +1 -1
- package/dist/esm/br-input.entry.js +2 -2
- package/dist/esm/br-input.entry.js.map +1 -1
- package/dist/esm/br-item.entry.js +3 -3
- package/dist/esm/br-item.entry.js.map +1 -1
- package/dist/esm/br-list.entry.js +2 -2
- package/dist/esm/br-list.entry.js.map +1 -1
- package/dist/esm/br-loading.entry.js +3 -3
- package/dist/esm/br-loading.entry.js.map +1 -1
- package/dist/esm/br-message.entry.js +3 -3
- package/dist/esm/br-message.entry.js.map +1 -1
- package/dist/esm/br-radio.entry.js +41 -37
- package/dist/esm/br-radio.entry.js.map +1 -1
- package/dist/esm/br-switch.entry.js +3 -3
- package/dist/esm/br-switch.entry.js.map +1 -1
- package/dist/esm/br-textarea.entry.js +154 -0
- package/dist/esm/br-textarea.entry.js.map +1 -0
- package/dist/esm/{index-c7037515.js → index-cad6e6c3.js} +7 -2
- package/dist/esm/index-cad6e6c3.js.map +1 -0
- package/dist/esm/loader.js +3 -3
- package/dist/esm/webcomponents.js +3 -3
- package/dist/types/components/radio/radio.d.ts +18 -23
- package/dist/types/components/textarea/textarea.d.ts +157 -0
- package/dist/types/components.d.ts +193 -12
- package/dist/types/utils/unique-id-generator.d.ts +1 -0
- package/dist/webcomponents/p-35f43cf0.entry.js +2 -0
- package/dist/webcomponents/p-35f43cf0.entry.js.map +1 -0
- package/dist/webcomponents/p-3bbf9a07.entry.js +2 -0
- package/dist/webcomponents/p-3bbf9a07.entry.js.map +1 -0
- package/dist/webcomponents/p-70216f4a.entry.js +13 -0
- package/dist/webcomponents/{p-dde91d20.entry.js.map → p-70216f4a.entry.js.map} +1 -1
- package/dist/webcomponents/p-7ef2814e.entry.js +2 -0
- package/dist/webcomponents/p-7ef2814e.entry.js.map +1 -0
- package/dist/webcomponents/p-8030cff4.entry.js +2 -0
- package/dist/webcomponents/p-8030cff4.entry.js.map +1 -0
- package/dist/webcomponents/p-80726c0b.entry.js +2 -0
- package/dist/webcomponents/p-80726c0b.entry.js.map +1 -0
- package/dist/webcomponents/{p-6849daee.js → p-8dfeb926.js} +3 -3
- package/dist/webcomponents/p-8dfeb926.js.map +1 -0
- package/dist/webcomponents/p-a80407ae.entry.js +2 -0
- package/dist/webcomponents/{p-8efc22a3.entry.js.map → p-a80407ae.entry.js.map} +1 -1
- package/dist/webcomponents/p-a9efcaff.entry.js +2 -0
- package/dist/webcomponents/p-a9efcaff.entry.js.map +1 -0
- package/dist/webcomponents/p-c8bf074f.entry.js +2 -0
- package/dist/webcomponents/p-c8bf074f.entry.js.map +1 -0
- package/dist/webcomponents/p-d3bb77aa.entry.js +2 -0
- package/dist/webcomponents/{p-9dbe247e.entry.js.map → p-d3bb77aa.entry.js.map} +1 -1
- package/dist/webcomponents/p-e24e46e9.entry.js +2 -0
- package/dist/webcomponents/{p-c36696c6.entry.js.map → p-e24e46e9.entry.js.map} +1 -1
- package/dist/webcomponents/p-ee647c4a.entry.js +2 -0
- package/dist/webcomponents/{p-ac16ee58.entry.js.map → p-ee647c4a.entry.js.map} +1 -1
- package/dist/webcomponents/webcomponents.esm.js +1 -1
- package/dist/webcomponents/webcomponents.esm.js.map +1 -1
- package/hydrate/index.js +240 -62
- package/hydrate/index.mjs +240 -62
- package/package.json +1 -1
- package/vscode-data.json +50 -5
- package/dist/cjs/index-fb4e9eaf.js.map +0 -1
- package/dist/components/p-5769e796.js +0 -138
- package/dist/components/p-698e7a18.js.map +0 -1
- package/dist/webcomponents/p-0f6e2ddc.entry.js +0 -2
- package/dist/webcomponents/p-0f6e2ddc.entry.js.map +0 -1
- package/dist/webcomponents/p-14f1c8e6.entry.js +0 -2
- package/dist/webcomponents/p-14f1c8e6.entry.js.map +0 -1
- package/dist/webcomponents/p-198082b6.entry.js +0 -2
- package/dist/webcomponents/p-198082b6.entry.js.map +0 -1
- package/dist/webcomponents/p-6849daee.js.map +0 -1
- package/dist/webcomponents/p-867bba23.entry.js +0 -2
- package/dist/webcomponents/p-867bba23.entry.js.map +0 -1
- package/dist/webcomponents/p-8efc22a3.entry.js +0 -2
- package/dist/webcomponents/p-9dbe247e.entry.js +0 -2
- package/dist/webcomponents/p-a5a079d8.entry.js +0 -2
- package/dist/webcomponents/p-a5a079d8.entry.js.map +0 -1
- package/dist/webcomponents/p-ac16ee58.entry.js +0 -2
- package/dist/webcomponents/p-c36696c6.entry.js +0 -2
- package/dist/webcomponents/p-dde91d20.entry.js +0 -13
- package/dist/webcomponents/p-f01f1e6b.entry.js +0 -2
- package/dist/webcomponents/p-f01f1e6b.entry.js.map +0 -1
|
@@ -24,11 +24,6 @@ strong {
|
|
|
24
24
|
font-weight: bolder;
|
|
25
25
|
}
|
|
26
26
|
|
|
27
|
-
code {
|
|
28
|
-
font-family: monospace;
|
|
29
|
-
font-size: 1em;
|
|
30
|
-
}
|
|
31
|
-
|
|
32
27
|
small {
|
|
33
28
|
font-size: 80%;
|
|
34
29
|
}
|
|
@@ -38,7 +33,8 @@ img {
|
|
|
38
33
|
}
|
|
39
34
|
|
|
40
35
|
button,
|
|
41
|
-
input
|
|
36
|
+
input,
|
|
37
|
+
textarea {
|
|
42
38
|
font-family: inherit;
|
|
43
39
|
font-size: 100%;
|
|
44
40
|
line-height: var(--font-line-height-medium);
|
|
@@ -82,6 +78,10 @@ progress {
|
|
|
82
78
|
vertical-align: baseline;
|
|
83
79
|
}
|
|
84
80
|
|
|
81
|
+
textarea {
|
|
82
|
+
overflow: auto;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
85
|
[type=checkbox],
|
|
86
86
|
[type=radio] {
|
|
87
87
|
box-sizing: border-box;
|
|
@@ -139,6 +139,17 @@ progress {
|
|
|
139
139
|
width: auto;
|
|
140
140
|
}
|
|
141
141
|
|
|
142
|
+
.container {
|
|
143
|
+
--grid-margin: var(--grid-portrait-margin);
|
|
144
|
+
--grid-maxwidth: var(--grid-portrait-maxwidth);
|
|
145
|
+
margin-left: auto;
|
|
146
|
+
margin-right: auto;
|
|
147
|
+
max-width: var(--grid-maxwidth);
|
|
148
|
+
padding-left: var(--grid-margin);
|
|
149
|
+
padding-right: var(--grid-margin);
|
|
150
|
+
width: 100%;
|
|
151
|
+
}
|
|
152
|
+
|
|
142
153
|
.row {
|
|
143
154
|
--grid-gutter: var(--grid-portrait-gutter);
|
|
144
155
|
display: flex;
|
|
@@ -148,24 +159,52 @@ progress {
|
|
|
148
159
|
}
|
|
149
160
|
|
|
150
161
|
@media (min-width: 576px) {
|
|
162
|
+
.container {
|
|
163
|
+
--grid-margin: var(--grid-tablet-margin);
|
|
164
|
+
}
|
|
151
165
|
.row {
|
|
152
166
|
--grid-gutter: var(--grid-tablet-gutter);
|
|
153
167
|
}
|
|
168
|
+
.container {
|
|
169
|
+
--grid-maxwidth: calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin));
|
|
170
|
+
}
|
|
154
171
|
}
|
|
155
172
|
@media (min-width: 992px) {
|
|
173
|
+
.container {
|
|
174
|
+
--grid-margin: var(--grid-tablet-margin);
|
|
175
|
+
}
|
|
156
176
|
.row {
|
|
157
177
|
--grid-gutter: var(--grid-tablet-gutter);
|
|
158
178
|
}
|
|
179
|
+
.container {
|
|
180
|
+
--grid-maxwidth: calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin));
|
|
181
|
+
}
|
|
159
182
|
}
|
|
160
183
|
@media (min-width: 1280px) {
|
|
184
|
+
.container {
|
|
185
|
+
--grid-margin: var(--grid-desktop-margin);
|
|
186
|
+
}
|
|
161
187
|
.row {
|
|
162
188
|
--grid-gutter: var(--grid-desktop-gutter);
|
|
163
189
|
}
|
|
190
|
+
.container {
|
|
191
|
+
--grid-maxwidth: calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin));
|
|
192
|
+
}
|
|
164
193
|
}
|
|
165
194
|
@media (min-width: 1600px) {
|
|
195
|
+
.container {
|
|
196
|
+
--grid-margin: var(--grid-tv-margin);
|
|
197
|
+
}
|
|
166
198
|
.row {
|
|
167
199
|
--grid-gutter: var(--grid-tv-gutter);
|
|
168
200
|
}
|
|
201
|
+
.container {
|
|
202
|
+
--grid-maxwidth: calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin));
|
|
203
|
+
}
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
.mt-1 {
|
|
207
|
+
margin-top: var(--spacing-scale-half) !important;
|
|
169
208
|
}
|
|
170
209
|
|
|
171
210
|
.mr-1 {
|
|
@@ -180,6 +219,10 @@ progress {
|
|
|
180
219
|
margin-bottom: var(--spacing-scale-2x) !important;
|
|
181
220
|
}
|
|
182
221
|
|
|
222
|
+
.pt-half {
|
|
223
|
+
padding-top: var(--spacing-scale-half) !important;
|
|
224
|
+
}
|
|
225
|
+
|
|
183
226
|
.py-3 {
|
|
184
227
|
padding-bottom: var(--spacing-scale-2x) !important;
|
|
185
228
|
padding-top: var(--spacing-scale-2x) !important;
|
|
@@ -295,6 +338,7 @@ label,
|
|
|
295
338
|
}
|
|
296
339
|
|
|
297
340
|
input,
|
|
341
|
+
textarea,
|
|
298
342
|
.input {
|
|
299
343
|
color: var(--color-light);
|
|
300
344
|
font-size: var(--font-size-scale-up-01);
|
|
@@ -303,19 +347,6 @@ input,
|
|
|
303
347
|
margin-bottom: var(--spacing-scale-half);
|
|
304
348
|
}
|
|
305
349
|
|
|
306
|
-
code,
|
|
307
|
-
.code {
|
|
308
|
-
background: var(--gray-5);
|
|
309
|
-
border-radius: 4px;
|
|
310
|
-
color: var(--gray-80);
|
|
311
|
-
display: inline-block;
|
|
312
|
-
font-family: monospace;
|
|
313
|
-
font-size: var(--font-size-scale-base);
|
|
314
|
-
font-weight: var(--font-weight-medium);
|
|
315
|
-
line-height: var(--font-line-height-low);
|
|
316
|
-
padding: var(--spacing-scale-half);
|
|
317
|
-
}
|
|
318
|
-
|
|
319
350
|
.text-pure-0 {
|
|
320
351
|
color: var(--pure-0) !important;
|
|
321
352
|
}
|
|
@@ -338,6 +369,10 @@ code,
|
|
|
338
369
|
white-space: nowrap !important;
|
|
339
370
|
}
|
|
340
371
|
|
|
372
|
+
.text-base {
|
|
373
|
+
font-size: var(--font-size-scale-base) !important;
|
|
374
|
+
}
|
|
375
|
+
|
|
341
376
|
.highlight {
|
|
342
377
|
background: var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));
|
|
343
378
|
color: var(--status-highlight-text);
|
|
@@ -24,11 +24,6 @@ strong {
|
|
|
24
24
|
font-weight: bolder;
|
|
25
25
|
}
|
|
26
26
|
|
|
27
|
-
code {
|
|
28
|
-
font-family: monospace;
|
|
29
|
-
font-size: 1em;
|
|
30
|
-
}
|
|
31
|
-
|
|
32
27
|
small {
|
|
33
28
|
font-size: 80%;
|
|
34
29
|
}
|
|
@@ -38,7 +33,8 @@ img {
|
|
|
38
33
|
}
|
|
39
34
|
|
|
40
35
|
button,
|
|
41
|
-
input
|
|
36
|
+
input,
|
|
37
|
+
textarea {
|
|
42
38
|
font-family: inherit;
|
|
43
39
|
font-size: 100%;
|
|
44
40
|
line-height: var(--font-line-height-medium);
|
|
@@ -82,6 +78,10 @@ progress {
|
|
|
82
78
|
vertical-align: baseline;
|
|
83
79
|
}
|
|
84
80
|
|
|
81
|
+
textarea {
|
|
82
|
+
overflow: auto;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
85
|
[type=checkbox],
|
|
86
86
|
[type=radio] {
|
|
87
87
|
box-sizing: border-box;
|
|
@@ -139,6 +139,17 @@ progress {
|
|
|
139
139
|
width: auto;
|
|
140
140
|
}
|
|
141
141
|
|
|
142
|
+
.container {
|
|
143
|
+
--grid-margin: var(--grid-portrait-margin);
|
|
144
|
+
--grid-maxwidth: var(--grid-portrait-maxwidth);
|
|
145
|
+
margin-left: auto;
|
|
146
|
+
margin-right: auto;
|
|
147
|
+
max-width: var(--grid-maxwidth);
|
|
148
|
+
padding-left: var(--grid-margin);
|
|
149
|
+
padding-right: var(--grid-margin);
|
|
150
|
+
width: 100%;
|
|
151
|
+
}
|
|
152
|
+
|
|
142
153
|
.row {
|
|
143
154
|
--grid-gutter: var(--grid-portrait-gutter);
|
|
144
155
|
display: flex;
|
|
@@ -148,24 +159,52 @@ progress {
|
|
|
148
159
|
}
|
|
149
160
|
|
|
150
161
|
@media (min-width: 576px) {
|
|
162
|
+
.container {
|
|
163
|
+
--grid-margin: var(--grid-tablet-margin);
|
|
164
|
+
}
|
|
151
165
|
.row {
|
|
152
166
|
--grid-gutter: var(--grid-tablet-gutter);
|
|
153
167
|
}
|
|
168
|
+
.container {
|
|
169
|
+
--grid-maxwidth: calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin));
|
|
170
|
+
}
|
|
154
171
|
}
|
|
155
172
|
@media (min-width: 992px) {
|
|
173
|
+
.container {
|
|
174
|
+
--grid-margin: var(--grid-tablet-margin);
|
|
175
|
+
}
|
|
156
176
|
.row {
|
|
157
177
|
--grid-gutter: var(--grid-tablet-gutter);
|
|
158
178
|
}
|
|
179
|
+
.container {
|
|
180
|
+
--grid-maxwidth: calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin));
|
|
181
|
+
}
|
|
159
182
|
}
|
|
160
183
|
@media (min-width: 1280px) {
|
|
184
|
+
.container {
|
|
185
|
+
--grid-margin: var(--grid-desktop-margin);
|
|
186
|
+
}
|
|
161
187
|
.row {
|
|
162
188
|
--grid-gutter: var(--grid-desktop-gutter);
|
|
163
189
|
}
|
|
190
|
+
.container {
|
|
191
|
+
--grid-maxwidth: calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin));
|
|
192
|
+
}
|
|
164
193
|
}
|
|
165
194
|
@media (min-width: 1600px) {
|
|
195
|
+
.container {
|
|
196
|
+
--grid-margin: var(--grid-tv-margin);
|
|
197
|
+
}
|
|
166
198
|
.row {
|
|
167
199
|
--grid-gutter: var(--grid-tv-gutter);
|
|
168
200
|
}
|
|
201
|
+
.container {
|
|
202
|
+
--grid-maxwidth: calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin));
|
|
203
|
+
}
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
.mt-1 {
|
|
207
|
+
margin-top: var(--spacing-scale-half) !important;
|
|
169
208
|
}
|
|
170
209
|
|
|
171
210
|
.mr-1 {
|
|
@@ -180,6 +219,10 @@ progress {
|
|
|
180
219
|
margin-bottom: var(--spacing-scale-2x) !important;
|
|
181
220
|
}
|
|
182
221
|
|
|
222
|
+
.pt-half {
|
|
223
|
+
padding-top: var(--spacing-scale-half) !important;
|
|
224
|
+
}
|
|
225
|
+
|
|
183
226
|
.py-3 {
|
|
184
227
|
padding-bottom: var(--spacing-scale-2x) !important;
|
|
185
228
|
padding-top: var(--spacing-scale-2x) !important;
|
|
@@ -295,6 +338,7 @@ label,
|
|
|
295
338
|
}
|
|
296
339
|
|
|
297
340
|
input,
|
|
341
|
+
textarea,
|
|
298
342
|
.input {
|
|
299
343
|
color: var(--color-light);
|
|
300
344
|
font-size: var(--font-size-scale-up-01);
|
|
@@ -303,19 +347,6 @@ input,
|
|
|
303
347
|
margin-bottom: var(--spacing-scale-half);
|
|
304
348
|
}
|
|
305
349
|
|
|
306
|
-
code,
|
|
307
|
-
.code {
|
|
308
|
-
background: var(--gray-5);
|
|
309
|
-
border-radius: 4px;
|
|
310
|
-
color: var(--gray-80);
|
|
311
|
-
display: inline-block;
|
|
312
|
-
font-family: monospace;
|
|
313
|
-
font-size: var(--font-size-scale-base);
|
|
314
|
-
font-weight: var(--font-weight-medium);
|
|
315
|
-
line-height: var(--font-line-height-low);
|
|
316
|
-
padding: var(--spacing-scale-half);
|
|
317
|
-
}
|
|
318
|
-
|
|
319
350
|
.text-pure-0 {
|
|
320
351
|
color: var(--pure-0) !important;
|
|
321
352
|
}
|
|
@@ -338,6 +369,10 @@ code,
|
|
|
338
369
|
white-space: nowrap !important;
|
|
339
370
|
}
|
|
340
371
|
|
|
372
|
+
.text-base {
|
|
373
|
+
font-size: var(--font-size-scale-base) !important;
|
|
374
|
+
}
|
|
375
|
+
|
|
341
376
|
.highlight {
|
|
342
377
|
background: var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));
|
|
343
378
|
color: var(--status-highlight-text);
|
|
@@ -24,11 +24,6 @@ strong {
|
|
|
24
24
|
font-weight: bolder;
|
|
25
25
|
}
|
|
26
26
|
|
|
27
|
-
code {
|
|
28
|
-
font-family: monospace;
|
|
29
|
-
font-size: 1em;
|
|
30
|
-
}
|
|
31
|
-
|
|
32
27
|
small {
|
|
33
28
|
font-size: 80%;
|
|
34
29
|
}
|
|
@@ -38,7 +33,8 @@ img {
|
|
|
38
33
|
}
|
|
39
34
|
|
|
40
35
|
button,
|
|
41
|
-
input
|
|
36
|
+
input,
|
|
37
|
+
textarea {
|
|
42
38
|
font-family: inherit;
|
|
43
39
|
font-size: 100%;
|
|
44
40
|
line-height: var(--font-line-height-medium);
|
|
@@ -82,6 +78,10 @@ progress {
|
|
|
82
78
|
vertical-align: baseline;
|
|
83
79
|
}
|
|
84
80
|
|
|
81
|
+
textarea {
|
|
82
|
+
overflow: auto;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
85
|
[type=checkbox],
|
|
86
86
|
[type=radio] {
|
|
87
87
|
box-sizing: border-box;
|
|
@@ -139,6 +139,17 @@ progress {
|
|
|
139
139
|
width: auto;
|
|
140
140
|
}
|
|
141
141
|
|
|
142
|
+
.container {
|
|
143
|
+
--grid-margin: var(--grid-portrait-margin);
|
|
144
|
+
--grid-maxwidth: var(--grid-portrait-maxwidth);
|
|
145
|
+
margin-left: auto;
|
|
146
|
+
margin-right: auto;
|
|
147
|
+
max-width: var(--grid-maxwidth);
|
|
148
|
+
padding-left: var(--grid-margin);
|
|
149
|
+
padding-right: var(--grid-margin);
|
|
150
|
+
width: 100%;
|
|
151
|
+
}
|
|
152
|
+
|
|
142
153
|
.row {
|
|
143
154
|
--grid-gutter: var(--grid-portrait-gutter);
|
|
144
155
|
display: flex;
|
|
@@ -148,24 +159,52 @@ progress {
|
|
|
148
159
|
}
|
|
149
160
|
|
|
150
161
|
@media (min-width: 576px) {
|
|
162
|
+
.container {
|
|
163
|
+
--grid-margin: var(--grid-tablet-margin);
|
|
164
|
+
}
|
|
151
165
|
.row {
|
|
152
166
|
--grid-gutter: var(--grid-tablet-gutter);
|
|
153
167
|
}
|
|
168
|
+
.container {
|
|
169
|
+
--grid-maxwidth: calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin));
|
|
170
|
+
}
|
|
154
171
|
}
|
|
155
172
|
@media (min-width: 992px) {
|
|
173
|
+
.container {
|
|
174
|
+
--grid-margin: var(--grid-tablet-margin);
|
|
175
|
+
}
|
|
156
176
|
.row {
|
|
157
177
|
--grid-gutter: var(--grid-tablet-gutter);
|
|
158
178
|
}
|
|
179
|
+
.container {
|
|
180
|
+
--grid-maxwidth: calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin));
|
|
181
|
+
}
|
|
159
182
|
}
|
|
160
183
|
@media (min-width: 1280px) {
|
|
184
|
+
.container {
|
|
185
|
+
--grid-margin: var(--grid-desktop-margin);
|
|
186
|
+
}
|
|
161
187
|
.row {
|
|
162
188
|
--grid-gutter: var(--grid-desktop-gutter);
|
|
163
189
|
}
|
|
190
|
+
.container {
|
|
191
|
+
--grid-maxwidth: calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin));
|
|
192
|
+
}
|
|
164
193
|
}
|
|
165
194
|
@media (min-width: 1600px) {
|
|
195
|
+
.container {
|
|
196
|
+
--grid-margin: var(--grid-tv-margin);
|
|
197
|
+
}
|
|
166
198
|
.row {
|
|
167
199
|
--grid-gutter: var(--grid-tv-gutter);
|
|
168
200
|
}
|
|
201
|
+
.container {
|
|
202
|
+
--grid-maxwidth: calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin));
|
|
203
|
+
}
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
.mt-1 {
|
|
207
|
+
margin-top: var(--spacing-scale-half) !important;
|
|
169
208
|
}
|
|
170
209
|
|
|
171
210
|
.mr-1 {
|
|
@@ -180,6 +219,10 @@ progress {
|
|
|
180
219
|
margin-bottom: var(--spacing-scale-2x) !important;
|
|
181
220
|
}
|
|
182
221
|
|
|
222
|
+
.pt-half {
|
|
223
|
+
padding-top: var(--spacing-scale-half) !important;
|
|
224
|
+
}
|
|
225
|
+
|
|
183
226
|
.py-3 {
|
|
184
227
|
padding-bottom: var(--spacing-scale-2x) !important;
|
|
185
228
|
padding-top: var(--spacing-scale-2x) !important;
|
|
@@ -295,6 +338,7 @@ label,
|
|
|
295
338
|
}
|
|
296
339
|
|
|
297
340
|
input,
|
|
341
|
+
textarea,
|
|
298
342
|
.input {
|
|
299
343
|
color: var(--color-light);
|
|
300
344
|
font-size: var(--font-size-scale-up-01);
|
|
@@ -303,19 +347,6 @@ input,
|
|
|
303
347
|
margin-bottom: var(--spacing-scale-half);
|
|
304
348
|
}
|
|
305
349
|
|
|
306
|
-
code,
|
|
307
|
-
.code {
|
|
308
|
-
background: var(--gray-5);
|
|
309
|
-
border-radius: 4px;
|
|
310
|
-
color: var(--gray-80);
|
|
311
|
-
display: inline-block;
|
|
312
|
-
font-family: monospace;
|
|
313
|
-
font-size: var(--font-size-scale-base);
|
|
314
|
-
font-weight: var(--font-weight-medium);
|
|
315
|
-
line-height: var(--font-line-height-low);
|
|
316
|
-
padding: var(--spacing-scale-half);
|
|
317
|
-
}
|
|
318
|
-
|
|
319
350
|
.text-pure-0 {
|
|
320
351
|
color: var(--pure-0) !important;
|
|
321
352
|
}
|
|
@@ -338,6 +369,10 @@ code,
|
|
|
338
369
|
white-space: nowrap !important;
|
|
339
370
|
}
|
|
340
371
|
|
|
372
|
+
.text-base {
|
|
373
|
+
font-size: var(--font-size-scale-base) !important;
|
|
374
|
+
}
|
|
375
|
+
|
|
341
376
|
.highlight {
|
|
342
377
|
background: var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));
|
|
343
378
|
color: var(--status-highlight-text);
|
|
@@ -156,7 +156,7 @@ export class Item {
|
|
|
156
156
|
const TagType = this.getTagType();
|
|
157
157
|
const attributes = this.getAttributes();
|
|
158
158
|
const classList = this.getCssClassMap();
|
|
159
|
-
return (h(Host, { key: '
|
|
159
|
+
return (h(Host, { key: 'f81b3dfcc8a48125bad6cf90e3afed1cb1ba608d' }, h(TagType, Object.assign({ key: 'cfee9c8bdeee487a334dde46f0683f2399266ecb', class: classList }, attributes, { onClick: this.handleClick }), this.hasSlotStart || this.hasSlotEnd ? (h("div", { class: "row align-items-center" }, this.hasSlotStart && (h("div", { class: "col-auto" }, h("slot", { name: "start" }))), h("div", { class: "col" }, h("slot", null)), this.hasSlotEnd && (h("div", { class: "col-auto" }, h("slot", { name: "end" }))))) : (h("slot", null)))));
|
|
160
160
|
}
|
|
161
161
|
static get is() { return "br-item"; }
|
|
162
162
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"item.js","sourceRoot":"","sources":["../../../src/components/item/item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, h } from '@stencil/core'\nimport { Attributes } from '../../utils/inherited-attributes'\nimport { CssClassMap } from '../../utils/interfaces'\n\n/**\n * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/item?tab=designer).\n *\n * @slot default - Área de conteúdo, podendo conter qualquer componente, exceto botões primários e componentes relacionados à navegação (como carrosséis, paginações, abas, menus, etc.).\n *\n * @slot start - Área de recursos visuais, podendo conter elementos como ícones, avatares e mídias.\n *\n * @slot end - Área de recursos complementares, podendo conter componentes interativos, metadados e informações adicionais.\n */\n@Component({\n tag: 'br-item',\n styleUrl: 'item.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Item {\n /**\n * Referência ao elemento host do componente.\n * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.\n */\n @Element() el: HTMLBrItemElement\n\n @AttachInternals() elementInternals: ElementInternals\n\n /**\n * Desativa o item, tornando-o não interativo.\n */\n @Prop({ reflect: true }) disabled: boolean = false\n\n /**\n * Indica se o item está no estado ativo.\n * Se definido como verdadeiro, o item será exibido como ativo.\n */\n @Prop({ reflect: true }) isActive: boolean = false\n\n /**\n * Indica se o item está no estado selecionado.\n * Se definido como verdadeiro, o item será exibido como selecionado.\n */\n @Prop({ reflect: true }) isSelected: boolean = false\n\n /**\n * Marca o item como interativo, permitindo que toda a superfície do item seja clicável.\n */\n @Prop({ reflect: true }) isInteractive: boolean = false\n\n /**\n * URL ou caminho para o qual o usuário será direcionado ao clicar no item. Quando definido, o item será renderizado como um link.\n */\n @Prop({ reflect: true }) href?: string\n\n /**\n * Define o alvo do link quando `href` está presente. Pode ser:\n * - `_blank` para abrir em uma nova aba,\n * - `_self` para abrir na mesma aba,\n * - `_parent` para abrir na aba pai,\n * - `_top` para abrir na aba superior.\n */\n @Prop({ reflect: true }) target?: '_blank' | '_self' | '_parent' | '_top'\n\n /**\n * Quando definido como `true`, o item será tratado como um botão.\n */\n @Prop({ reflect: true }) isButton: boolean = false\n\n /**\n * Tipo do botão, aplicável apenas se `isButton` for `true`. Pode ser:\n * - `'submit'` para enviar um formulário,\n * - `'reset'` para redefinir um formulário,\n * - `'button'` para um botão padrão.\n */\n @Prop({ reflect: true, mutable: true }) type: 'submit' | 'reset' | 'button'\n\n /**\n * Define um valor associado ao br-item quando renderizado como um botão, utilizado em contextos de formulário.\n */\n @Prop({ reflect: true }) value?: string\n\n /**\n * Ajusta a densidade, alterando o espaçamento interno para um visual mais compacto ou mais expandido.\n */\n @Prop({ reflect: true }) density: 'large' | 'middle' | 'small'\n\n // Propriedade interna para verificar a presença de conteúdo no slot default\n @State() hasSlotDefault: boolean = false\n\n @State() hasSlotStart: boolean = false\n\n @State() hasSlotEnd: boolean = false\n\n // Propriedade interna para armazenar o valor selecionado\n @State() selectedValue: boolean = false\n\n @Listen('brDidCheckedChange', { target: 'document' })\n handleChange(event: Event) {\n const target = event.target as HTMLElement\n\n if (this.el.contains(target)) {\n this.updateItemSelectionState()\n }\n }\n\n /**\n * Evento customizado emitido quando o item é clicado, aplicável apenas se o item for um botão (`<button>`).\n * Pode ser utilizado para ações personalizadas, exceto quando o item está desativado.\n */\n @Event({ composed: true, cancelable: true, bubbles: true }) brDidClick: EventEmitter\n\n /**\n * Evento customizado aplicável para todos os tipos de elementos (`div`, `button`, `a`), emitido quando o item é selecionado e desde que a propriedade `isInteractive` esteja presente.\n */\n @Event({ bubbles: true, composed: true }) brDidSelect: EventEmitter<{ selected: boolean }>\n\n /**\n * Emite um evento quando o componente é conectado ao DOM.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#connectedcallback) para mais detalhes.\n */\n @Event() brDidConnect: EventEmitter<void>\n connectedCallback() {\n this.brDidConnect.emit()\n }\n\n /**\n * Emite um evento antes que o componente seja carregado pela primeira vez.\n * Utilize este evento para realizar tarefas de inicialização antes do componente ser exibido.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillload) para mais detalhes.\n */\n @Event() brWillLoad: EventEmitter<void>\n componentWillLoad() {\n this.hasSlotContentDefault()\n this.hasSlotStart = this.hasSlotContent('start')\n this.hasSlotEnd = this.hasSlotContent('end')\n this.selectedValue = this.isSelected\n if (this.isButton) {\n this.type = this.type || 'button'\n }\n this.updateItemSelectionState()\n this.brWillLoad.emit()\n }\n\n /**\n * Emite um evento após o componente ter sido carregado pela primeira vez.\n * Utilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.\n */\n @Event() brDidLoad: EventEmitter<void>\n componentDidLoad() {\n this.updateCheckboxes()\n this.brDidLoad.emit()\n }\n\n /**\n * Emite um evento antes do componente ser renderizado.\n * Utilize este evento para preparar o componente antes de sua renderização.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillrender) para mais detalhes.\n */\n @Event() brWillRender: EventEmitter<void>\n componentWillRender() {\n this.brWillRender.emit()\n }\n\n /**\n * Emite um evento após o componente ter sido renderizado.\n * Utilize este evento para executar ações que devem ocorrer após a renderização do componente.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidrender) para mais detalhes.\n */\n @Event() brDidRender: EventEmitter<void>\n componentDidRender() {\n this.brDidRender.emit()\n }\n\n /**\n * Emite um evento para indicar se o componente deve ser atualizado ou não.\n * Este evento é chamado antes de qualquer atualização do componente para decidir se a atualização deve prosseguir.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentshouldupdate) para mais detalhes.\n */\n @Event() brShouldUpdate: EventEmitter<void>\n componentShouldUpdate() {\n this.brShouldUpdate.emit()\n }\n\n /**\n * Emite um evento antes de o componente ser atualizado.\n * Utilize este evento para realizar ações preparatórias antes da atualização do componente.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillupdate) para mais detalhes.\n */\n @Event() brWillUpdate: EventEmitter<void>\n componentWillUpdate() {\n this.brWillUpdate.emit()\n }\n\n /**\n * Emite um evento após o componente ter sido atualizado.\n * Utilize este evento para realizar ações após a atualização do componente.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidupdate) para mais detalhes.\n */\n @Event() brDidUpdate: EventEmitter<void>\n componentDidUpdate() {\n this.brDidUpdate.emit()\n }\n\n /**\n * Emite um evento quando o componente é desconectado do DOM.\n * Utilize este evento para realizar a limpeza ou outras ações necessárias quando o componente é removido.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#disconnectedcallback) para mais detalhes.\n */\n @Event() brDidDisconnect: EventEmitter<void>\n disconnectedCallback() {\n this.brDidDisconnect.emit()\n }\n\n /**\n * Emite um evento quando o componente é associado ou removido de um `<form>`.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formassociatedcallback) para mais detalhes.\n *\n * @param form - Dados do formulário associado.\n */\n @Event() brFormAssociatedCallback: EventEmitter<FormData>\n formAssociatedCallback(form: FormData) {\n this.brFormAssociatedCallback.emit(form)\n }\n\n /**\n * Emite um evento quando o estado `disabled` do componente muda dentro de um `<form>`.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formdisabledcallback) para mais informações.\n *\n * @param disabled - Novo estado `disabled` do componente dentro do formulário.\n */\n @Event() brFormDisabledCallback: EventEmitter<boolean>\n formDisabledCallback(disabled: boolean) {\n this.brFormDisabledCallback.emit(disabled)\n }\n\n /**\n * Emite um evento quando um `<form>` é resetado.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formresetcallback) para mais detalhes.\n */\n @Event() brFormResetCallback: EventEmitter<void>\n formResetCallback() {\n this.brFormResetCallback.emit()\n }\n\n /**\n * Emite um evento quando o navegador preenche automaticamente os campos de um `<form>`.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formstaterestorecallback) para mais informações.\n *\n * @param state - Estado restaurado do formulário.\n * @param _mode - Modo de preenchimento automático do navegador.\n */\n @Event() brFormStateRestoreCallback: EventEmitter<[state: string, _mode: string]>\n formStateRestoreCallback(state: string, _mode: string) {\n this.brFormStateRestoreCallback.emit([state, _mode])\n }\n\n private hasSlotContentDefault(): any {\n this.hasSlotDefault = this.el.innerHTML !== ''\n }\n\n private hasSlotContent(slotName: string): boolean {\n return this.el.querySelector(`[slot=\"${slotName}\"]`) !== null\n }\n\n private getCssClassMap(): CssClassMap {\n return {\n 'br-item': true,\n disabled: this.disabled,\n active: this.isActive,\n selected: this.selectedValue,\n 'py-3': this.density === 'middle',\n 'py-4': this.density === 'small',\n }\n }\n\n private readonly inheritedAttributes: Attributes = {}\n\n private getTagType(): string {\n if (this.isButton) {\n return 'button'\n }\n if (this.href?.length > 0) {\n return 'a'\n }\n return 'div'\n }\n\n private getAttributes() {\n const TagType = this.getTagType()\n const baseAttributes =\n TagType === 'button' ? { type: this.type, value: this.value } : { href: this.href, target: this.target }\n\n return {\n ...baseAttributes,\n 'aria-disabled': this.disabled ? 'true' : null,\n 'aria-current': this.isActive ? 'true' : null,\n 'data-toggle': this.isInteractive ? 'selection' : null,\n ...this.inheritedAttributes,\n }\n }\n\n private updateItemSelectionState() {\n const checkboxes = Array.from(this.el.querySelectorAll('br-checkbox'))\n const radios = Array.from(this.el.querySelectorAll('br-radio'))\n\n let isAnyCheckboxChecked = false\n let isAnyRadioSelected = false\n\n if (checkboxes.length > 0) {\n isAnyCheckboxChecked = checkboxes.some((cb) => cb.checked)\n }\n if (radios.length > 0) {\n isAnyRadioSelected = radios.some((radio) => radio.checked)\n }\n\n this.selectedValue = isAnyCheckboxChecked || isAnyRadioSelected\n }\n\n // Função para verificar se o clique foi dentro do slot do item.\n private isClickInsideInteractiveElement(target: HTMLElement): boolean {\n const interactiveSelectors = 'br-checkbox, br-radio, br-input, br-button, br-select, br-textarea'\n const interactiveElements = this.el.querySelectorAll(interactiveSelectors)\n return Array.from(interactiveElements).some((el) => el.contains(target) || target === el)\n }\n\n private updateCheckboxes() {\n const checkboxes = Array.from(this.el.querySelectorAll('br-checkbox'))\n\n checkboxes.forEach((checkbox) => {\n checkbox.checked = this.selectedValue\n })\n }\n\n private readonly handleClick = (event: MouseEvent) => {\n const clickedElement = event.target as HTMLElement\n\n if (this.disabled) {\n event.preventDefault()\n event.stopPropagation()\n }\n\n if (this.isButton) {\n this.brDidClick.emit()\n } else if (this.isInteractive && !this.isClickInsideInteractiveElement(clickedElement)) {\n this.selectedValue = !this.selectedValue\n this.brDidSelect.emit({ selected: this.selectedValue })\n this.updateCheckboxes()\n }\n event.stopPropagation()\n }\n\n render() {\n const TagType = this.getTagType()\n const attributes = this.getAttributes()\n const classList = this.getCssClassMap()\n return (\n <Host>\n <TagType class={classList} {...attributes} onClick={this.handleClick}>\n {this.hasSlotStart || this.hasSlotEnd ? (\n <div class=\"row align-items-center\">\n {this.hasSlotStart && (\n <div class=\"col-auto\">\n <slot name=\"start\"></slot>\n </div>\n )}\n\n <div class=\"col\">\n <slot></slot>\n </div>\n\n {this.hasSlotEnd && (\n <div class=\"col-auto\">\n <slot name=\"end\"></slot>\n </div>\n )}\n </div>\n ) : (\n <slot></slot>\n )}\n </TagType>\n </Host>\n )\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"item.js","sourceRoot":"","sources":["../../../src/components/item/item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, h } from '@stencil/core'\nimport { Attributes } from '../../utils/inherited-attributes'\nimport { CssClassMap } from '../../utils/interfaces'\n/**\n * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/item?tab=designer).\n *\n * @slot default - Área de conteúdo, podendo conter qualquer componente, exceto botões primários e componentes relacionados à navegação (como carrosséis, paginações, abas, menus, etc.).\n *\n * @slot start - Área de recursos visuais, podendo conter elementos como ícones, avatares e mídias.\n *\n * @slot end - Área de recursos complementares, podendo conter componentes interativos, metadados e informações adicionais.\n */\n@Component({\n tag: 'br-item',\n styleUrl: 'item.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Item {\n /**\n * Referência ao elemento host do componente.\n * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.\n */\n @Element() el: HTMLBrItemElement\n\n @AttachInternals() elementInternals: ElementInternals\n\n /**\n * Desativa o item, tornando-o não interativo.\n */\n @Prop({ reflect: true }) disabled: boolean = false\n\n /**\n * Indica se o item está no estado ativo.\n * Se definido como verdadeiro, o item será exibido como ativo.\n */\n @Prop({ reflect: true }) isActive: boolean = false\n\n /**\n * Indica se o item está no estado selecionado.\n * Se definido como verdadeiro, o item será exibido como selecionado.\n */\n @Prop({ reflect: true }) isSelected: boolean = false\n\n /**\n * Marca o item como interativo, permitindo que toda a superfície do item seja clicável.\n */\n @Prop({ reflect: true }) isInteractive: boolean = false\n\n /**\n * URL ou caminho para o qual o usuário será direcionado ao clicar no item. Quando definido, o item será renderizado como um link.\n */\n @Prop({ reflect: true }) href?: string\n\n /**\n * Define o alvo do link quando `href` está presente. Pode ser:\n * - `_blank` para abrir em uma nova aba,\n * - `_self` para abrir na mesma aba,\n * - `_parent` para abrir na aba pai,\n * - `_top` para abrir na aba superior.\n */\n @Prop({ reflect: true }) target?: '_blank' | '_self' | '_parent' | '_top'\n\n /**\n * Quando definido como `true`, o item será tratado como um botão.\n */\n @Prop({ reflect: true }) isButton: boolean = false\n\n /**\n * Tipo do botão, aplicável apenas se `isButton` for `true`. Pode ser:\n * - `'submit'` para enviar um formulário,\n * - `'reset'` para redefinir um formulário,\n * - `'button'` para um botão padrão.\n */\n @Prop({ reflect: true, mutable: true }) type: 'submit' | 'reset' | 'button'\n\n /**\n * Define um valor associado ao br-item quando renderizado como um botão, utilizado em contextos de formulário.\n */\n @Prop({ reflect: true }) value?: string\n\n /**\n * Ajusta a densidade, alterando o espaçamento interno para um visual mais compacto ou mais expandido.\n */\n @Prop({ reflect: true }) density: 'large' | 'middle' | 'small'\n\n // Propriedade interna para verificar a presença de conteúdo no slot default\n @State() hasSlotDefault: boolean = false\n\n @State() hasSlotStart: boolean = false\n\n @State() hasSlotEnd: boolean = false\n\n // Propriedade interna para armazenar o valor selecionado\n @State() selectedValue: boolean = false\n\n @Listen('brDidCheckedChange', { target: 'document' })\n handleChange(event: Event) {\n const target = event.target as HTMLElement\n\n if (this.el.contains(target)) {\n this.updateItemSelectionState()\n }\n }\n\n /**\n * Evento customizado emitido quando o item é clicado, aplicável apenas se o item for um botão (`<button>`).\n * Pode ser utilizado para ações personalizadas, exceto quando o item está desativado.\n */\n @Event({ composed: true, cancelable: true, bubbles: true }) brDidClick: EventEmitter\n\n /**\n * Evento customizado aplicável para todos os tipos de elementos (`div`, `button`, `a`), emitido quando o item é selecionado e desde que a propriedade `isInteractive` esteja presente.\n */\n @Event({ bubbles: true, composed: true }) brDidSelect: EventEmitter<{ selected: boolean }>\n\n /**\n * Emite um evento quando o componente é conectado ao DOM.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#connectedcallback) para mais detalhes.\n */\n @Event() brDidConnect: EventEmitter<void>\n connectedCallback() {\n this.brDidConnect.emit()\n }\n\n /**\n * Emite um evento antes que o componente seja carregado pela primeira vez.\n * Utilize este evento para realizar tarefas de inicialização antes do componente ser exibido.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillload) para mais detalhes.\n */\n @Event() brWillLoad: EventEmitter<void>\n componentWillLoad() {\n this.hasSlotContentDefault()\n this.hasSlotStart = this.hasSlotContent('start')\n this.hasSlotEnd = this.hasSlotContent('end')\n this.selectedValue = this.isSelected\n if (this.isButton) {\n this.type = this.type || 'button'\n }\n this.updateItemSelectionState()\n this.brWillLoad.emit()\n }\n\n /**\n * Emite um evento após o componente ter sido carregado pela primeira vez.\n * Utilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.\n */\n @Event() brDidLoad: EventEmitter<void>\n componentDidLoad() {\n this.updateCheckboxes()\n this.brDidLoad.emit()\n }\n\n /**\n * Emite um evento antes do componente ser renderizado.\n * Utilize este evento para preparar o componente antes de sua renderização.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillrender) para mais detalhes.\n */\n @Event() brWillRender: EventEmitter<void>\n componentWillRender() {\n this.brWillRender.emit()\n }\n\n /**\n * Emite um evento após o componente ter sido renderizado.\n * Utilize este evento para executar ações que devem ocorrer após a renderização do componente.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidrender) para mais detalhes.\n */\n @Event() brDidRender: EventEmitter<void>\n componentDidRender() {\n this.brDidRender.emit()\n }\n\n /**\n * Emite um evento para indicar se o componente deve ser atualizado ou não.\n * Este evento é chamado antes de qualquer atualização do componente para decidir se a atualização deve prosseguir.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentshouldupdate) para mais detalhes.\n */\n @Event() brShouldUpdate: EventEmitter<void>\n componentShouldUpdate() {\n this.brShouldUpdate.emit()\n }\n\n /**\n * Emite um evento antes de o componente ser atualizado.\n * Utilize este evento para realizar ações preparatórias antes da atualização do componente.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillupdate) para mais detalhes.\n */\n @Event() brWillUpdate: EventEmitter<void>\n componentWillUpdate() {\n this.brWillUpdate.emit()\n }\n\n /**\n * Emite um evento após o componente ter sido atualizado.\n * Utilize este evento para realizar ações após a atualização do componente.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidupdate) para mais detalhes.\n */\n @Event() brDidUpdate: EventEmitter<void>\n componentDidUpdate() {\n this.brDidUpdate.emit()\n }\n\n /**\n * Emite um evento quando o componente é desconectado do DOM.\n * Utilize este evento para realizar a limpeza ou outras ações necessárias quando o componente é removido.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#disconnectedcallback) para mais detalhes.\n */\n @Event() brDidDisconnect: EventEmitter<void>\n disconnectedCallback() {\n this.brDidDisconnect.emit()\n }\n\n /**\n * Emite um evento quando o componente é associado ou removido de um `<form>`.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formassociatedcallback) para mais detalhes.\n *\n * @param form - Dados do formulário associado.\n */\n @Event() brFormAssociatedCallback: EventEmitter<FormData>\n formAssociatedCallback(form: FormData) {\n this.brFormAssociatedCallback.emit(form)\n }\n\n /**\n * Emite um evento quando o estado `disabled` do componente muda dentro de um `<form>`.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formdisabledcallback) para mais informações.\n *\n * @param disabled - Novo estado `disabled` do componente dentro do formulário.\n */\n @Event() brFormDisabledCallback: EventEmitter<boolean>\n formDisabledCallback(disabled: boolean) {\n this.brFormDisabledCallback.emit(disabled)\n }\n\n /**\n * Emite um evento quando um `<form>` é resetado.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formresetcallback) para mais detalhes.\n */\n @Event() brFormResetCallback: EventEmitter<void>\n formResetCallback() {\n this.brFormResetCallback.emit()\n }\n\n /**\n * Emite um evento quando o navegador preenche automaticamente os campos de um `<form>`.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formstaterestorecallback) para mais informações.\n *\n * @param state - Estado restaurado do formulário.\n * @param _mode - Modo de preenchimento automático do navegador.\n */\n @Event() brFormStateRestoreCallback: EventEmitter<[state: string, _mode: string]>\n formStateRestoreCallback(state: string, _mode: string) {\n this.brFormStateRestoreCallback.emit([state, _mode])\n }\n\n private hasSlotContentDefault(): any {\n this.hasSlotDefault = this.el.innerHTML !== ''\n }\n\n private hasSlotContent(slotName: string): boolean {\n return this.el.querySelector(`[slot=\"${slotName}\"]`) !== null\n }\n\n private getCssClassMap(): CssClassMap {\n return {\n 'br-item': true,\n disabled: this.disabled,\n active: this.isActive,\n selected: this.selectedValue,\n 'py-3': this.density === 'middle',\n 'py-4': this.density === 'small',\n }\n }\n\n private readonly inheritedAttributes: Attributes = {}\n\n private getTagType(): string {\n if (this.isButton) {\n return 'button'\n }\n if (this.href?.length > 0) {\n return 'a'\n }\n return 'div'\n }\n\n private getAttributes() {\n const TagType = this.getTagType()\n const baseAttributes =\n TagType === 'button' ? { type: this.type, value: this.value } : { href: this.href, target: this.target }\n\n return {\n ...baseAttributes,\n 'aria-disabled': this.disabled ? 'true' : null,\n 'aria-current': this.isActive ? 'true' : null,\n 'data-toggle': this.isInteractive ? 'selection' : null,\n ...this.inheritedAttributes,\n }\n }\n\n private updateItemSelectionState() {\n const checkboxes = Array.from(this.el.querySelectorAll('br-checkbox'))\n const radios = Array.from(this.el.querySelectorAll('br-radio'))\n\n let isAnyCheckboxChecked = false\n let isAnyRadioSelected = false\n\n if (checkboxes.length > 0) {\n isAnyCheckboxChecked = checkboxes.some((cb) => cb.checked)\n }\n if (radios.length > 0) {\n isAnyRadioSelected = radios.some((radio) => radio.checked)\n }\n\n this.selectedValue = isAnyCheckboxChecked || isAnyRadioSelected\n }\n\n // Função para verificar se o clique foi dentro do slot do item.\n private isClickInsideInteractiveElement(target: HTMLElement): boolean {\n const interactiveSelectors = 'br-checkbox, br-radio, br-input, br-button, br-select, br-textarea'\n const interactiveElements = this.el.querySelectorAll(interactiveSelectors)\n return Array.from(interactiveElements).some((el) => el.contains(target) || target === el)\n }\n\n private updateCheckboxes() {\n const checkboxes = Array.from(this.el.querySelectorAll('br-checkbox'))\n\n checkboxes.forEach((checkbox) => {\n checkbox.checked = this.selectedValue\n })\n }\n\n private readonly handleClick = (event: MouseEvent) => {\n const clickedElement = event.target as HTMLElement\n\n if (this.disabled) {\n event.preventDefault()\n event.stopPropagation()\n }\n\n if (this.isButton) {\n this.brDidClick.emit()\n } else if (this.isInteractive && !this.isClickInsideInteractiveElement(clickedElement)) {\n this.selectedValue = !this.selectedValue\n this.brDidSelect.emit({ selected: this.selectedValue })\n this.updateCheckboxes()\n }\n event.stopPropagation()\n }\n\n render() {\n const TagType = this.getTagType()\n const attributes = this.getAttributes()\n const classList = this.getCssClassMap()\n return (\n <Host>\n <TagType class={classList} {...attributes} onClick={this.handleClick}>\n {this.hasSlotStart || this.hasSlotEnd ? (\n <div class=\"row align-items-center\">\n {this.hasSlotStart && (\n <div class=\"col-auto\">\n <slot name=\"start\"></slot>\n </div>\n )}\n\n <div class=\"col\">\n <slot></slot>\n </div>\n\n {this.hasSlotEnd && (\n <div class=\"col-auto\">\n <slot name=\"end\"></slot>\n </div>\n )}\n </div>\n ) : (\n <slot></slot>\n )}\n </TagType>\n </Host>\n )\n }\n}\n"]}
|