ds-tis 1.0.0-beta.10
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/LICENSE +49 -0
- package/README.md +125 -0
- package/css/base/forced-colors.css +62 -0
- package/css/base/icons.css +73 -0
- package/css/base/index.css +4 -0
- package/css/base/reset.css +80 -0
- package/css/base/typography.css +211 -0
- package/css/components/accordion.css +153 -0
- package/css/components/alert.css +161 -0
- package/css/components/avatar.css +76 -0
- package/css/components/badge.css +83 -0
- package/css/components/breadcrumb.css +58 -0
- package/css/components/button.css +364 -0
- package/css/components/card.css +159 -0
- package/css/components/checkbox.css +296 -0
- package/css/components/combobox.css +330 -0
- package/css/components/divider.css +20 -0
- package/css/components/form-field.css +137 -0
- package/css/components/index.css +28 -0
- package/css/components/input.css +356 -0
- package/css/components/link.css +67 -0
- package/css/components/menu.css +246 -0
- package/css/components/modal.css +236 -0
- package/css/components/pagination.css +132 -0
- package/css/components/radio.css +280 -0
- package/css/components/select.css +399 -0
- package/css/components/skeleton.css +52 -0
- package/css/components/spinner.css +59 -0
- package/css/components/tabs.css +79 -0
- package/css/components/textarea.css +218 -0
- package/css/components/toggle.css +202 -0
- package/css/components/tooltip.css +116 -0
- package/css/design-system.css +13 -0
- package/css/tokens/generated/component.css +720 -0
- package/css/tokens/generated/foundation.css +282 -0
- package/css/tokens/generated/index.css +5 -0
- package/css/tokens/generated/theme-dark.css +243 -0
- package/css/tokens/generated/theme-light.css +244 -0
- package/css/tokens/index.css +6 -0
- package/css/utilities/elevation.css +24 -0
- package/css/utilities/index.css +2 -0
- package/css/utilities/layout.css +132 -0
- package/docs/agent-consumer-usage.en.md +322 -0
- package/docs/agent-consumer-usage.md +294 -0
- package/docs/api/adrs.json +186 -0
- package/docs/api/components.json +2071 -0
- package/docs/api/consumer-context.json +66 -0
- package/docs/api/foundations.json +94 -0
- package/docs/api/tokens.json +6839 -0
- package/docs/llms-full.txt +23699 -0
- package/docs/llms.txt +109 -0
- package/docs/templates/contact.html +364 -0
- package/docs/templates/dashboard.html +318 -0
- package/docs/templates/index.html +232 -0
- package/docs/templates/login.html +286 -0
- package/docs/templates/settings.html +365 -0
- package/docs/templates/signup.html +350 -0
- package/js/accordion.js +192 -0
- package/js/combobox.js +263 -0
- package/js/menu.js +301 -0
- package/js/modal.js +256 -0
- package/js/package.json +3 -0
- package/js/tabs.js +200 -0
- package/js/theme/apply.js +75 -0
- package/js/theme/brand-contrast-audit.js +133 -0
- package/js/theme/color.js +149 -0
- package/js/theme/config-schema.js +40 -0
- package/js/theme/contrast.js +76 -0
- package/js/theme/export.js +118 -0
- package/js/theme/index.js +21 -0
- package/js/theme/overlay.js +29 -0
- package/js/theme/package.json +3 -0
- package/js/theme/palette.js +103 -0
- package/js/theme/radius.js +76 -0
- package/js/theme/semantic-mapper.js +138 -0
- package/js/theme/typography.js +33 -0
- package/js/theme/url-state.js +52 -0
- package/js/tooltip.js +227 -0
- package/package.json +139 -0
|
@@ -0,0 +1,2071 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": "1.0.0-beta.10",
|
|
3
|
+
"count": 23,
|
|
4
|
+
"readinessLevels": {
|
|
5
|
+
"app-ready": {
|
|
6
|
+
"label": "App-ready",
|
|
7
|
+
"description": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados."
|
|
8
|
+
},
|
|
9
|
+
"composition": {
|
|
10
|
+
"label": "Composição",
|
|
11
|
+
"description": "Padrão público e estável cuja orquestração, navegação ou estado de negócio permanece sob responsabilidade da aplicação."
|
|
12
|
+
},
|
|
13
|
+
"experimental": {
|
|
14
|
+
"label": "Experimental",
|
|
15
|
+
"description": "Contrato ainda não concluiu o gate de runtime e consumo; pode mudar e não deve sustentar fluxo crítico sem avaliação explícita."
|
|
16
|
+
}
|
|
17
|
+
},
|
|
18
|
+
"behaviorModels": {
|
|
19
|
+
"native": {
|
|
20
|
+
"label": "HTML nativo",
|
|
21
|
+
"ds": "Entrega anatomia, visual, estados e orientação de semântica nativa.",
|
|
22
|
+
"consumer": "Controla dados, eventos e regras de negócio usando o elemento HTML adequado."
|
|
23
|
+
},
|
|
24
|
+
"presentation": {
|
|
25
|
+
"label": "Apresentação",
|
|
26
|
+
"ds": "Entrega anatomia visual, tokens e orientação semântica sem runtime de componente.",
|
|
27
|
+
"consumer": "Fornece conteúdo, contexto e qualquer ação de produto associada."
|
|
28
|
+
},
|
|
29
|
+
"consumer": {
|
|
30
|
+
"label": "Aplicação",
|
|
31
|
+
"ds": "Entrega a composição, anatomia e estados visuais públicos.",
|
|
32
|
+
"consumer": "Mantém a orquestração entre elementos, dados, navegação e regras de negócio."
|
|
33
|
+
},
|
|
34
|
+
"ds-runtime": {
|
|
35
|
+
"label": "Runtime do DS",
|
|
36
|
+
"ds": "Mantém o comportamento reutilizável de interação e acessibilidade por módulo público.",
|
|
37
|
+
"consumer": "Chama init após render, destroy ao desmontar, e fornece dados, eventos e regras de negócio."
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
"responsiveProfiles": {
|
|
41
|
+
"container": {
|
|
42
|
+
"label": "Container do consumidor",
|
|
43
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
44
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
45
|
+
},
|
|
46
|
+
"viewport-constrained": {
|
|
47
|
+
"label": "Limitado pela viewport",
|
|
48
|
+
"ds": "Aplica limites intrínsecos de largura/altura contra a viewport além de preservar o contrato do componente.",
|
|
49
|
+
"consumer": "Fornece conteúdo conciso e testa teclado, zoom e orientação no contexto real da aplicação."
|
|
50
|
+
},
|
|
51
|
+
"consumer-managed-horizontal": {
|
|
52
|
+
"label": "Coleção horizontal gerida pelo consumidor",
|
|
53
|
+
"ds": "Mantém itens, estados e navegação horizontal; não remove, resume nem reorganiza conteúdo por breakpoint.",
|
|
54
|
+
"consumer": "Decide redução de itens, overflow, wrapping ou composição alternativa conforme conteúdo e regra de produto."
|
|
55
|
+
},
|
|
56
|
+
"consumer-selectable-width": {
|
|
57
|
+
"label": "Largura selecionável pelo consumidor",
|
|
58
|
+
"ds": "Entrega variantes explícitas de largura quando documentadas; não as ativa automaticamente por viewport.",
|
|
59
|
+
"consumer": "Escolhe a variante ou largura no breakpoint do layout da aplicação."
|
|
60
|
+
}
|
|
61
|
+
},
|
|
62
|
+
"responsiveContract": {
|
|
63
|
+
"version": 1,
|
|
64
|
+
"model": "intrinsic-first",
|
|
65
|
+
"publicBreakpoints": [],
|
|
66
|
+
"testedViewports": [
|
|
67
|
+
{
|
|
68
|
+
"inlineSize": 320,
|
|
69
|
+
"blockSize": 568,
|
|
70
|
+
"context": "phone-portrait"
|
|
71
|
+
},
|
|
72
|
+
{
|
|
73
|
+
"inlineSize": 568,
|
|
74
|
+
"blockSize": 320,
|
|
75
|
+
"context": "phone-landscape"
|
|
76
|
+
},
|
|
77
|
+
{
|
|
78
|
+
"inlineSize": 1280,
|
|
79
|
+
"blockSize": 800,
|
|
80
|
+
"context": "desktop"
|
|
81
|
+
}
|
|
82
|
+
],
|
|
83
|
+
"rules": [
|
|
84
|
+
"Variants de size são escolhas explícitas de produto; não representam breakpoints automáticos.",
|
|
85
|
+
"O pacote não publica modificadores de breakpoint nem tokens de viewport.",
|
|
86
|
+
"O app consumidor mantém o layout da página, a densidade de conteúdo e qualquer troca de composição.",
|
|
87
|
+
"O smoke do tarball valida ausência de overflow horizontal do documento e limites de overlays na fixture de referência."
|
|
88
|
+
]
|
|
89
|
+
},
|
|
90
|
+
"runtimeModules": [
|
|
91
|
+
{
|
|
92
|
+
"level": "required",
|
|
93
|
+
"module": "ds-tis/accordion",
|
|
94
|
+
"init": "initAccordions",
|
|
95
|
+
"destroy": "destroyAccordions",
|
|
96
|
+
"exports": [
|
|
97
|
+
"initAccordions",
|
|
98
|
+
"destroyAccordions",
|
|
99
|
+
"openAccordionItem",
|
|
100
|
+
"closeAccordionItem"
|
|
101
|
+
],
|
|
102
|
+
"events": [
|
|
103
|
+
"ds-accordion-open",
|
|
104
|
+
"ds-accordion-close"
|
|
105
|
+
],
|
|
106
|
+
"notes": "Expand/collapse, teclado e modo single exigem init após render; chame destroy ao desmontar."
|
|
107
|
+
},
|
|
108
|
+
{
|
|
109
|
+
"level": "required",
|
|
110
|
+
"module": "ds-tis/combobox",
|
|
111
|
+
"init": "initComboboxes",
|
|
112
|
+
"destroy": "destroyComboboxes",
|
|
113
|
+
"exports": [
|
|
114
|
+
"initComboboxes",
|
|
115
|
+
"destroyComboboxes",
|
|
116
|
+
"syncComboboxState"
|
|
117
|
+
],
|
|
118
|
+
"events": [
|
|
119
|
+
"ds-combobox-change"
|
|
120
|
+
],
|
|
121
|
+
"notes": "Listbox, filtro, seleção e teclado exigem init após render; chame destroy ao desmontar."
|
|
122
|
+
},
|
|
123
|
+
{
|
|
124
|
+
"level": "required",
|
|
125
|
+
"module": "ds-tis/modal",
|
|
126
|
+
"init": "initModals",
|
|
127
|
+
"destroy": "destroyModals",
|
|
128
|
+
"exports": [
|
|
129
|
+
"initModals",
|
|
130
|
+
"destroyModals",
|
|
131
|
+
"openModal",
|
|
132
|
+
"closeModal"
|
|
133
|
+
],
|
|
134
|
+
"events": [
|
|
135
|
+
"ds-modal-open",
|
|
136
|
+
"ds-modal-close"
|
|
137
|
+
],
|
|
138
|
+
"notes": "Abertura, focus trap, Escape, inert e retorno de foco exigem init; chame destroy ao desmontar."
|
|
139
|
+
},
|
|
140
|
+
{
|
|
141
|
+
"level": "required",
|
|
142
|
+
"module": "ds-tis/menu",
|
|
143
|
+
"init": "initActionMenus",
|
|
144
|
+
"destroy": "destroyActionMenus",
|
|
145
|
+
"exports": [
|
|
146
|
+
"initActionMenus",
|
|
147
|
+
"destroyActionMenus",
|
|
148
|
+
"openActionMenu",
|
|
149
|
+
"closeActionMenu"
|
|
150
|
+
],
|
|
151
|
+
"events": [
|
|
152
|
+
"ds-menu-open",
|
|
153
|
+
"ds-menu-close"
|
|
154
|
+
],
|
|
155
|
+
"notes": "Action Menu exige init para abertura, teclado e retorno de foco; chame destroy ao desmontar."
|
|
156
|
+
},
|
|
157
|
+
{
|
|
158
|
+
"level": "required",
|
|
159
|
+
"module": "ds-tis/tabs",
|
|
160
|
+
"init": "initTabs",
|
|
161
|
+
"destroy": "destroyTabs",
|
|
162
|
+
"exports": [
|
|
163
|
+
"initTabs",
|
|
164
|
+
"destroyTabs",
|
|
165
|
+
"selectTab"
|
|
166
|
+
],
|
|
167
|
+
"events": [
|
|
168
|
+
"ds-tabs-change"
|
|
169
|
+
],
|
|
170
|
+
"notes": "Seleção, roving tabindex e sync de painéis exigem init após render; chame destroy ao desmontar."
|
|
171
|
+
},
|
|
172
|
+
{
|
|
173
|
+
"level": "required",
|
|
174
|
+
"module": "ds-tis/tooltip",
|
|
175
|
+
"init": "initTooltips",
|
|
176
|
+
"destroy": "destroyTooltips",
|
|
177
|
+
"exports": [
|
|
178
|
+
"initTooltips",
|
|
179
|
+
"destroyTooltips",
|
|
180
|
+
"showTooltip",
|
|
181
|
+
"hideTooltip"
|
|
182
|
+
],
|
|
183
|
+
"events": [
|
|
184
|
+
"ds-tooltip-show",
|
|
185
|
+
"ds-tooltip-hide"
|
|
186
|
+
],
|
|
187
|
+
"notes": "Hover, focus, Escape e hoverable content (WCAG 1.4.13) exigem init após render; chame destroy ao desmontar."
|
|
188
|
+
}
|
|
189
|
+
],
|
|
190
|
+
"components": [
|
|
191
|
+
{
|
|
192
|
+
"name": "Accordion",
|
|
193
|
+
"slug": "accordion",
|
|
194
|
+
"url": "docs/accordion.html",
|
|
195
|
+
"cssClass": "ds-accordion",
|
|
196
|
+
"cssFile": "css/components/accordion.css",
|
|
197
|
+
"cssOnly": false,
|
|
198
|
+
"readiness": "app-ready",
|
|
199
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
200
|
+
"responsibility": {
|
|
201
|
+
"model": "ds-runtime",
|
|
202
|
+
"label": "Runtime do DS",
|
|
203
|
+
"ds": "Mantém o comportamento reutilizável de interação e acessibilidade por módulo público.",
|
|
204
|
+
"consumer": "Chama init após render, destroy ao desmontar, e fornece dados, eventos e regras de negócio."
|
|
205
|
+
},
|
|
206
|
+
"responsive": {
|
|
207
|
+
"profile": "container",
|
|
208
|
+
"label": "Container do consumidor",
|
|
209
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
210
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
211
|
+
},
|
|
212
|
+
"runtime": {
|
|
213
|
+
"level": "required",
|
|
214
|
+
"module": "ds-tis/accordion",
|
|
215
|
+
"init": "initAccordions",
|
|
216
|
+
"destroy": "destroyAccordions",
|
|
217
|
+
"exports": [
|
|
218
|
+
"initAccordions",
|
|
219
|
+
"destroyAccordions",
|
|
220
|
+
"openAccordionItem",
|
|
221
|
+
"closeAccordionItem"
|
|
222
|
+
],
|
|
223
|
+
"events": [
|
|
224
|
+
"ds-accordion-open",
|
|
225
|
+
"ds-accordion-close"
|
|
226
|
+
],
|
|
227
|
+
"notes": "Expand/collapse, teclado e modo single exigem init após render; chame destroy ao desmontar."
|
|
228
|
+
},
|
|
229
|
+
"tokens": [
|
|
230
|
+
"ds-accordion-chevron-color-default",
|
|
231
|
+
"ds-accordion-chevron-color-disabled",
|
|
232
|
+
"ds-accordion-chevron-size-md",
|
|
233
|
+
"ds-accordion-chevron-stroke-width-md",
|
|
234
|
+
"ds-accordion-content-color-default",
|
|
235
|
+
"ds-accordion-content-color-disabled",
|
|
236
|
+
"ds-accordion-content-gap-md",
|
|
237
|
+
"ds-accordion-content-padding-bottom-md",
|
|
238
|
+
"ds-accordion-content-padding-x-md",
|
|
239
|
+
"ds-accordion-focus-ring-radius-default",
|
|
240
|
+
"ds-accordion-item-bg-default",
|
|
241
|
+
"ds-accordion-item-bg-disabled",
|
|
242
|
+
"ds-accordion-item-bg-hover",
|
|
243
|
+
"ds-accordion-item-border-color-default",
|
|
244
|
+
"ds-accordion-item-border-color-focus",
|
|
245
|
+
"ds-accordion-item-border-color-hover",
|
|
246
|
+
"ds-accordion-item-border-width-default",
|
|
247
|
+
"ds-accordion-item-radius-default",
|
|
248
|
+
"ds-accordion-leading-icon-color-default",
|
|
249
|
+
"ds-accordion-leading-icon-color-disabled",
|
|
250
|
+
"ds-accordion-leading-icon-size-md",
|
|
251
|
+
"ds-accordion-leading-icon-stroke-width-md",
|
|
252
|
+
"ds-accordion-trigger-content-color-default",
|
|
253
|
+
"ds-accordion-trigger-content-color-disabled",
|
|
254
|
+
"ds-accordion-trigger-gap-md",
|
|
255
|
+
"ds-accordion-trigger-height-md",
|
|
256
|
+
"ds-accordion-trigger-padding-x-md",
|
|
257
|
+
"ds-accordion-trigger-padding-y-md",
|
|
258
|
+
"ds-body-font-family-sans",
|
|
259
|
+
"ds-body-font-size-md",
|
|
260
|
+
"ds-body-font-size-sm",
|
|
261
|
+
"ds-body-font-weight-regular",
|
|
262
|
+
"ds-body-font-weight-semibold",
|
|
263
|
+
"ds-body-line-height-md",
|
|
264
|
+
"ds-body-line-height-sm",
|
|
265
|
+
"ds-focus-ring-color-default",
|
|
266
|
+
"ds-focus-ring-width",
|
|
267
|
+
"ds-motion-duration-fast",
|
|
268
|
+
"ds-motion-ease-default",
|
|
269
|
+
"ds-space-2xs"
|
|
270
|
+
],
|
|
271
|
+
"variants": [],
|
|
272
|
+
"figma": {
|
|
273
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
274
|
+
"page": "Accordion"
|
|
275
|
+
}
|
|
276
|
+
},
|
|
277
|
+
{
|
|
278
|
+
"name": "Button",
|
|
279
|
+
"slug": "button",
|
|
280
|
+
"url": "docs/button.html",
|
|
281
|
+
"cssClass": "ds-button",
|
|
282
|
+
"cssFile": "css/components/button.css",
|
|
283
|
+
"cssOnly": false,
|
|
284
|
+
"readiness": "app-ready",
|
|
285
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
286
|
+
"responsibility": {
|
|
287
|
+
"model": "native",
|
|
288
|
+
"label": "HTML nativo",
|
|
289
|
+
"ds": "Entrega anatomia, visual, estados e orientação de semântica nativa.",
|
|
290
|
+
"consumer": "Controla dados, eventos e regras de negócio usando o elemento HTML adequado."
|
|
291
|
+
},
|
|
292
|
+
"responsive": {
|
|
293
|
+
"profile": "consumer-selectable-width",
|
|
294
|
+
"label": "Largura selecionável pelo consumidor",
|
|
295
|
+
"ds": "Entrega variantes explícitas de largura quando documentadas; não as ativa automaticamente por viewport.",
|
|
296
|
+
"consumer": "Escolhe a variante ou largura no breakpoint do layout da aplicação."
|
|
297
|
+
},
|
|
298
|
+
"runtime": null,
|
|
299
|
+
"tokens": [
|
|
300
|
+
"ds-button-bg-brand-default",
|
|
301
|
+
"ds-button-bg-brand-disabled",
|
|
302
|
+
"ds-button-bg-brand-focus",
|
|
303
|
+
"ds-button-bg-brand-hover",
|
|
304
|
+
"ds-button-bg-brand-pressed",
|
|
305
|
+
"ds-button-bg-danger-default",
|
|
306
|
+
"ds-button-bg-danger-disabled",
|
|
307
|
+
"ds-button-bg-danger-focus",
|
|
308
|
+
"ds-button-bg-danger-hover",
|
|
309
|
+
"ds-button-bg-danger-pressed",
|
|
310
|
+
"ds-button-bg-ghost-hover",
|
|
311
|
+
"ds-button-bg-ghost-pressed",
|
|
312
|
+
"ds-button-bg-outline-hover",
|
|
313
|
+
"ds-button-bg-outline-pressed",
|
|
314
|
+
"ds-button-bg-success-default",
|
|
315
|
+
"ds-button-bg-success-disabled",
|
|
316
|
+
"ds-button-bg-success-focus",
|
|
317
|
+
"ds-button-bg-success-hover",
|
|
318
|
+
"ds-button-bg-success-pressed",
|
|
319
|
+
"ds-button-bg-toned-default",
|
|
320
|
+
"ds-button-bg-toned-disabled",
|
|
321
|
+
"ds-button-bg-toned-focus",
|
|
322
|
+
"ds-button-bg-toned-hover",
|
|
323
|
+
"ds-button-bg-toned-pressed",
|
|
324
|
+
"ds-button-border-color-outline-default",
|
|
325
|
+
"ds-button-border-color-outline-disabled",
|
|
326
|
+
"ds-button-border-color-outline-focus",
|
|
327
|
+
"ds-button-border-color-outline-hover",
|
|
328
|
+
"ds-button-border-color-outline-pressed",
|
|
329
|
+
"ds-button-border-width-default",
|
|
330
|
+
"ds-button-content-color-brand-default",
|
|
331
|
+
"ds-button-content-color-brand-disabled",
|
|
332
|
+
"ds-button-content-color-brand-focus",
|
|
333
|
+
"ds-button-content-color-brand-hover",
|
|
334
|
+
"ds-button-content-color-brand-pressed",
|
|
335
|
+
"ds-button-content-color-danger-default",
|
|
336
|
+
"ds-button-content-color-danger-disabled",
|
|
337
|
+
"ds-button-content-color-danger-focus",
|
|
338
|
+
"ds-button-content-color-danger-hover",
|
|
339
|
+
"ds-button-content-color-danger-pressed",
|
|
340
|
+
"ds-button-content-color-ghost-default",
|
|
341
|
+
"ds-button-content-color-ghost-disabled",
|
|
342
|
+
"ds-button-content-color-ghost-focus",
|
|
343
|
+
"ds-button-content-color-ghost-hover",
|
|
344
|
+
"ds-button-content-color-ghost-pressed",
|
|
345
|
+
"ds-button-content-color-outline-default",
|
|
346
|
+
"ds-button-content-color-outline-disabled",
|
|
347
|
+
"ds-button-content-color-outline-focus",
|
|
348
|
+
"ds-button-content-color-outline-hover",
|
|
349
|
+
"ds-button-content-color-outline-pressed",
|
|
350
|
+
"ds-button-content-color-success-default",
|
|
351
|
+
"ds-button-content-color-success-disabled",
|
|
352
|
+
"ds-button-content-color-success-focus",
|
|
353
|
+
"ds-button-content-color-success-hover",
|
|
354
|
+
"ds-button-content-color-success-pressed",
|
|
355
|
+
"ds-button-content-color-toned-default",
|
|
356
|
+
"ds-button-content-color-toned-disabled",
|
|
357
|
+
"ds-button-content-color-toned-focus",
|
|
358
|
+
"ds-button-content-color-toned-hover",
|
|
359
|
+
"ds-button-content-color-toned-pressed",
|
|
360
|
+
"ds-button-gap-lg",
|
|
361
|
+
"ds-button-gap-md",
|
|
362
|
+
"ds-button-gap-sm",
|
|
363
|
+
"ds-button-height-lg",
|
|
364
|
+
"ds-button-height-md",
|
|
365
|
+
"ds-button-height-sm",
|
|
366
|
+
"ds-button-icon-only-padding-lg",
|
|
367
|
+
"ds-button-icon-only-padding-md",
|
|
368
|
+
"ds-button-icon-only-padding-sm",
|
|
369
|
+
"ds-button-icon-only-width-lg",
|
|
370
|
+
"ds-button-icon-only-width-md",
|
|
371
|
+
"ds-button-icon-only-width-sm",
|
|
372
|
+
"ds-button-icon-size-lg",
|
|
373
|
+
"ds-button-icon-size-md",
|
|
374
|
+
"ds-button-icon-size-sm",
|
|
375
|
+
"ds-button-icon-stroke-width-lg",
|
|
376
|
+
"ds-button-icon-stroke-width-md",
|
|
377
|
+
"ds-button-icon-stroke-width-sm",
|
|
378
|
+
"ds-button-label-font-family-default",
|
|
379
|
+
"ds-button-label-font-size-lg",
|
|
380
|
+
"ds-button-label-font-size-md",
|
|
381
|
+
"ds-button-label-font-size-sm",
|
|
382
|
+
"ds-button-label-font-weight-default",
|
|
383
|
+
"ds-button-label-frame-padding-x-default",
|
|
384
|
+
"ds-button-label-letter-spacing-default",
|
|
385
|
+
"ds-button-label-line-height-lg",
|
|
386
|
+
"ds-button-label-line-height-md",
|
|
387
|
+
"ds-button-label-line-height-sm",
|
|
388
|
+
"ds-button-min-width-lg",
|
|
389
|
+
"ds-button-min-width-md",
|
|
390
|
+
"ds-button-min-width-sm",
|
|
391
|
+
"ds-button-padding-x-lg",
|
|
392
|
+
"ds-button-padding-x-md",
|
|
393
|
+
"ds-button-padding-x-sm",
|
|
394
|
+
"ds-button-padding-y-lg",
|
|
395
|
+
"ds-button-padding-y-md",
|
|
396
|
+
"ds-button-padding-y-sm",
|
|
397
|
+
"ds-button-radius-default",
|
|
398
|
+
"ds-focus-ring-color-default",
|
|
399
|
+
"ds-focus-ring-color-error",
|
|
400
|
+
"ds-focus-ring-color-success",
|
|
401
|
+
"ds-focus-ring-width",
|
|
402
|
+
"ds-motion-duration-fast",
|
|
403
|
+
"ds-motion-ease-default",
|
|
404
|
+
"ds-spinner-indicator-border-color-on-color",
|
|
405
|
+
"ds-spinner-track-border-color-on-color"
|
|
406
|
+
],
|
|
407
|
+
"variants": [
|
|
408
|
+
"brand",
|
|
409
|
+
"danger",
|
|
410
|
+
"disabled",
|
|
411
|
+
"full",
|
|
412
|
+
"ghost",
|
|
413
|
+
"icon-only",
|
|
414
|
+
"lg",
|
|
415
|
+
"loading",
|
|
416
|
+
"outline",
|
|
417
|
+
"sm",
|
|
418
|
+
"success",
|
|
419
|
+
"toned"
|
|
420
|
+
],
|
|
421
|
+
"figma": {
|
|
422
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
423
|
+
"page": "Button"
|
|
424
|
+
}
|
|
425
|
+
},
|
|
426
|
+
{
|
|
427
|
+
"name": "Input Text",
|
|
428
|
+
"slug": "input",
|
|
429
|
+
"url": "docs/input.html",
|
|
430
|
+
"cssClass": "ds-input",
|
|
431
|
+
"cssFile": "css/components/input.css",
|
|
432
|
+
"cssOnly": false,
|
|
433
|
+
"readiness": "app-ready",
|
|
434
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
435
|
+
"responsibility": {
|
|
436
|
+
"model": "native",
|
|
437
|
+
"label": "HTML nativo",
|
|
438
|
+
"ds": "Entrega anatomia, visual, estados e orientação de semântica nativa.",
|
|
439
|
+
"consumer": "Controla dados, eventos e regras de negócio usando o elemento HTML adequado."
|
|
440
|
+
},
|
|
441
|
+
"responsive": {
|
|
442
|
+
"profile": "container",
|
|
443
|
+
"label": "Container do consumidor",
|
|
444
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
445
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
446
|
+
},
|
|
447
|
+
"runtime": null,
|
|
448
|
+
"tokens": [
|
|
449
|
+
"ds-body-font-size-xs",
|
|
450
|
+
"ds-body-font-weight-bold",
|
|
451
|
+
"ds-body-font-weight-regular",
|
|
452
|
+
"ds-body-letter-spacing-normal",
|
|
453
|
+
"ds-body-line-height-xs",
|
|
454
|
+
"ds-field-bg-default",
|
|
455
|
+
"ds-field-bg-disabled",
|
|
456
|
+
"ds-field-bg-readonly",
|
|
457
|
+
"ds-field-border-color-default",
|
|
458
|
+
"ds-field-border-color-disabled",
|
|
459
|
+
"ds-field-border-color-error",
|
|
460
|
+
"ds-field-border-color-error-hover",
|
|
461
|
+
"ds-field-border-color-filled",
|
|
462
|
+
"ds-field-border-color-focus",
|
|
463
|
+
"ds-field-border-color-hover",
|
|
464
|
+
"ds-field-border-color-readonly",
|
|
465
|
+
"ds-field-border-width",
|
|
466
|
+
"ds-field-padding-y-lg",
|
|
467
|
+
"ds-field-padding-y-md",
|
|
468
|
+
"ds-field-padding-y-sm",
|
|
469
|
+
"ds-field-placeholder-color-default",
|
|
470
|
+
"ds-field-placeholder-color-disabled",
|
|
471
|
+
"ds-field-radius",
|
|
472
|
+
"ds-field-value-color-default",
|
|
473
|
+
"ds-field-value-color-disabled",
|
|
474
|
+
"ds-field-value-color-readonly",
|
|
475
|
+
"ds-focus-ring-color-default",
|
|
476
|
+
"ds-focus-ring-color-error",
|
|
477
|
+
"ds-focus-ring-color-readonly",
|
|
478
|
+
"ds-focus-ring-width",
|
|
479
|
+
"ds-form-field-helper-color-default",
|
|
480
|
+
"ds-form-field-helper-color-disabled",
|
|
481
|
+
"ds-form-field-label-color-default",
|
|
482
|
+
"ds-form-field-label-color-disabled",
|
|
483
|
+
"ds-form-field-label-color-readonly",
|
|
484
|
+
"ds-form-field-label-font-family-default",
|
|
485
|
+
"ds-form-field-label-font-size-default",
|
|
486
|
+
"ds-form-field-label-line-height-default",
|
|
487
|
+
"ds-form-field-label-row-gap-default",
|
|
488
|
+
"ds-form-field-required-color-default",
|
|
489
|
+
"ds-form-field-required-font-family-default",
|
|
490
|
+
"ds-form-field-required-font-size-default",
|
|
491
|
+
"ds-form-field-required-line-height-default",
|
|
492
|
+
"ds-form-field-stack-gap-default",
|
|
493
|
+
"ds-input-gap-lg",
|
|
494
|
+
"ds-input-gap-md",
|
|
495
|
+
"ds-input-gap-sm",
|
|
496
|
+
"ds-input-height-lg",
|
|
497
|
+
"ds-input-height-md",
|
|
498
|
+
"ds-input-height-sm",
|
|
499
|
+
"ds-input-icon-color-default",
|
|
500
|
+
"ds-input-icon-color-disabled",
|
|
501
|
+
"ds-input-icon-frame-padding-x-default",
|
|
502
|
+
"ds-input-icon-size-lg",
|
|
503
|
+
"ds-input-icon-size-md",
|
|
504
|
+
"ds-input-icon-size-sm",
|
|
505
|
+
"ds-input-icon-stroke-width-lg",
|
|
506
|
+
"ds-input-icon-stroke-width-md",
|
|
507
|
+
"ds-input-icon-stroke-width-sm",
|
|
508
|
+
"ds-input-padding-x-lg",
|
|
509
|
+
"ds-input-padding-x-md",
|
|
510
|
+
"ds-input-padding-x-sm",
|
|
511
|
+
"ds-input-text-font-family-default",
|
|
512
|
+
"ds-input-text-font-size-lg",
|
|
513
|
+
"ds-input-text-font-size-md",
|
|
514
|
+
"ds-input-text-font-size-sm",
|
|
515
|
+
"ds-input-text-font-weight-default",
|
|
516
|
+
"ds-input-text-frame-padding-x-default",
|
|
517
|
+
"ds-input-text-letter-spacing-default",
|
|
518
|
+
"ds-input-text-line-height-lg",
|
|
519
|
+
"ds-input-text-line-height-md",
|
|
520
|
+
"ds-input-text-line-height-sm",
|
|
521
|
+
"ds-motion-duration-fast",
|
|
522
|
+
"ds-motion-ease-default"
|
|
523
|
+
],
|
|
524
|
+
"variants": [
|
|
525
|
+
"disabled",
|
|
526
|
+
"error",
|
|
527
|
+
"filled",
|
|
528
|
+
"lg",
|
|
529
|
+
"md",
|
|
530
|
+
"readonly",
|
|
531
|
+
"sm"
|
|
532
|
+
],
|
|
533
|
+
"figma": {
|
|
534
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
535
|
+
"page": "Input Text"
|
|
536
|
+
}
|
|
537
|
+
},
|
|
538
|
+
{
|
|
539
|
+
"name": "Textarea",
|
|
540
|
+
"slug": "textarea",
|
|
541
|
+
"url": "docs/textarea.html",
|
|
542
|
+
"cssClass": "ds-textarea",
|
|
543
|
+
"cssFile": "css/components/textarea.css",
|
|
544
|
+
"cssOnly": false,
|
|
545
|
+
"readiness": "app-ready",
|
|
546
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
547
|
+
"responsibility": {
|
|
548
|
+
"model": "native",
|
|
549
|
+
"label": "HTML nativo",
|
|
550
|
+
"ds": "Entrega anatomia, visual, estados e orientação de semântica nativa.",
|
|
551
|
+
"consumer": "Controla dados, eventos e regras de negócio usando o elemento HTML adequado."
|
|
552
|
+
},
|
|
553
|
+
"responsive": {
|
|
554
|
+
"profile": "container",
|
|
555
|
+
"label": "Container do consumidor",
|
|
556
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
557
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
558
|
+
},
|
|
559
|
+
"runtime": null,
|
|
560
|
+
"tokens": [
|
|
561
|
+
"ds-body-font-size-xs",
|
|
562
|
+
"ds-body-font-weight-medium",
|
|
563
|
+
"ds-content-default",
|
|
564
|
+
"ds-feedback-error-content-default",
|
|
565
|
+
"ds-field-bg-default",
|
|
566
|
+
"ds-field-bg-disabled",
|
|
567
|
+
"ds-field-bg-readonly",
|
|
568
|
+
"ds-field-border-color-default",
|
|
569
|
+
"ds-field-border-color-disabled",
|
|
570
|
+
"ds-field-border-color-error",
|
|
571
|
+
"ds-field-border-color-error-hover",
|
|
572
|
+
"ds-field-border-color-filled",
|
|
573
|
+
"ds-field-border-color-focus",
|
|
574
|
+
"ds-field-border-color-hover",
|
|
575
|
+
"ds-field-border-color-readonly",
|
|
576
|
+
"ds-field-border-width",
|
|
577
|
+
"ds-field-padding-y-lg",
|
|
578
|
+
"ds-field-padding-y-md",
|
|
579
|
+
"ds-field-padding-y-sm",
|
|
580
|
+
"ds-field-placeholder-color-default",
|
|
581
|
+
"ds-field-placeholder-color-disabled",
|
|
582
|
+
"ds-field-radius",
|
|
583
|
+
"ds-field-value-color-default",
|
|
584
|
+
"ds-field-value-color-disabled",
|
|
585
|
+
"ds-field-value-color-readonly",
|
|
586
|
+
"ds-focus-ring-color-default",
|
|
587
|
+
"ds-focus-ring-color-error",
|
|
588
|
+
"ds-focus-ring-color-readonly",
|
|
589
|
+
"ds-focus-ring-width",
|
|
590
|
+
"ds-motion-duration-fast",
|
|
591
|
+
"ds-motion-ease-default",
|
|
592
|
+
"ds-textarea-field-min-height-lg",
|
|
593
|
+
"ds-textarea-field-min-height-md",
|
|
594
|
+
"ds-textarea-field-min-height-sm",
|
|
595
|
+
"ds-textarea-padding-x-lg",
|
|
596
|
+
"ds-textarea-padding-x-md",
|
|
597
|
+
"ds-textarea-padding-x-sm",
|
|
598
|
+
"ds-textarea-text-font-family-default",
|
|
599
|
+
"ds-textarea-text-font-size-lg",
|
|
600
|
+
"ds-textarea-text-font-size-md",
|
|
601
|
+
"ds-textarea-text-font-size-sm",
|
|
602
|
+
"ds-textarea-text-font-weight-default",
|
|
603
|
+
"ds-textarea-text-letter-spacing-default",
|
|
604
|
+
"ds-textarea-text-line-height-lg",
|
|
605
|
+
"ds-textarea-text-line-height-md",
|
|
606
|
+
"ds-textarea-text-line-height-sm"
|
|
607
|
+
],
|
|
608
|
+
"variants": [
|
|
609
|
+
"disabled",
|
|
610
|
+
"error",
|
|
611
|
+
"filled",
|
|
612
|
+
"lg",
|
|
613
|
+
"md",
|
|
614
|
+
"no-helper",
|
|
615
|
+
"no-label",
|
|
616
|
+
"readonly",
|
|
617
|
+
"sm"
|
|
618
|
+
],
|
|
619
|
+
"figma": {
|
|
620
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
621
|
+
"page": "Textarea"
|
|
622
|
+
}
|
|
623
|
+
},
|
|
624
|
+
{
|
|
625
|
+
"name": "Select",
|
|
626
|
+
"slug": "select",
|
|
627
|
+
"url": "docs/select.html",
|
|
628
|
+
"cssClass": "ds-select",
|
|
629
|
+
"cssFile": "css/components/select.css",
|
|
630
|
+
"cssOnly": false,
|
|
631
|
+
"readiness": "app-ready",
|
|
632
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
633
|
+
"responsibility": {
|
|
634
|
+
"model": "native",
|
|
635
|
+
"label": "HTML nativo",
|
|
636
|
+
"ds": "Entrega anatomia, visual, estados e orientação de semântica nativa.",
|
|
637
|
+
"consumer": "Controla dados, eventos e regras de negócio usando o elemento HTML adequado."
|
|
638
|
+
},
|
|
639
|
+
"responsive": {
|
|
640
|
+
"profile": "container",
|
|
641
|
+
"label": "Container do consumidor",
|
|
642
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
643
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
644
|
+
},
|
|
645
|
+
"runtime": null,
|
|
646
|
+
"tokens": [
|
|
647
|
+
"ds-body-font-size-xs",
|
|
648
|
+
"ds-body-font-weight-bold",
|
|
649
|
+
"ds-body-font-weight-regular",
|
|
650
|
+
"ds-body-letter-spacing-normal",
|
|
651
|
+
"ds-body-line-height-xs",
|
|
652
|
+
"ds-field-bg-default",
|
|
653
|
+
"ds-field-bg-disabled",
|
|
654
|
+
"ds-field-bg-readonly",
|
|
655
|
+
"ds-field-border-color-default",
|
|
656
|
+
"ds-field-border-color-disabled",
|
|
657
|
+
"ds-field-border-color-error",
|
|
658
|
+
"ds-field-border-color-error-hover",
|
|
659
|
+
"ds-field-border-color-filled",
|
|
660
|
+
"ds-field-border-color-focus",
|
|
661
|
+
"ds-field-border-color-hover",
|
|
662
|
+
"ds-field-border-color-readonly",
|
|
663
|
+
"ds-field-border-width",
|
|
664
|
+
"ds-field-padding-y-lg",
|
|
665
|
+
"ds-field-padding-y-md",
|
|
666
|
+
"ds-field-padding-y-sm",
|
|
667
|
+
"ds-field-placeholder-color-default",
|
|
668
|
+
"ds-field-placeholder-color-disabled",
|
|
669
|
+
"ds-field-radius",
|
|
670
|
+
"ds-field-value-color-default",
|
|
671
|
+
"ds-field-value-color-disabled",
|
|
672
|
+
"ds-field-value-color-readonly",
|
|
673
|
+
"ds-focus-ring-color-default",
|
|
674
|
+
"ds-focus-ring-color-error",
|
|
675
|
+
"ds-focus-ring-color-readonly",
|
|
676
|
+
"ds-focus-ring-width",
|
|
677
|
+
"ds-form-field-helper-color-default",
|
|
678
|
+
"ds-form-field-helper-color-disabled",
|
|
679
|
+
"ds-form-field-label-color-default",
|
|
680
|
+
"ds-form-field-label-font-family-default",
|
|
681
|
+
"ds-form-field-label-font-size-default",
|
|
682
|
+
"ds-form-field-label-line-height-default",
|
|
683
|
+
"ds-form-field-label-row-gap-default",
|
|
684
|
+
"ds-form-field-required-color-default",
|
|
685
|
+
"ds-form-field-required-font-family-default",
|
|
686
|
+
"ds-form-field-required-font-size-default",
|
|
687
|
+
"ds-form-field-required-line-height-default",
|
|
688
|
+
"ds-form-field-stack-gap-default",
|
|
689
|
+
"ds-motion-duration-fast",
|
|
690
|
+
"ds-motion-ease-default",
|
|
691
|
+
"ds-select-chevron-color-default",
|
|
692
|
+
"ds-select-chevron-color-disabled",
|
|
693
|
+
"ds-select-chevron-frame-padding-x-default",
|
|
694
|
+
"ds-select-chevron-size-lg",
|
|
695
|
+
"ds-select-chevron-size-md",
|
|
696
|
+
"ds-select-chevron-size-sm",
|
|
697
|
+
"ds-select-gap-lg",
|
|
698
|
+
"ds-select-gap-md",
|
|
699
|
+
"ds-select-gap-sm",
|
|
700
|
+
"ds-select-height-lg",
|
|
701
|
+
"ds-select-height-md",
|
|
702
|
+
"ds-select-height-sm",
|
|
703
|
+
"ds-select-icon-color-default",
|
|
704
|
+
"ds-select-icon-color-disabled",
|
|
705
|
+
"ds-select-icon-frame-padding-x-default",
|
|
706
|
+
"ds-select-icon-size-lg",
|
|
707
|
+
"ds-select-icon-size-md",
|
|
708
|
+
"ds-select-icon-size-sm",
|
|
709
|
+
"ds-select-icon-stroke-width-lg",
|
|
710
|
+
"ds-select-icon-stroke-width-md",
|
|
711
|
+
"ds-select-icon-stroke-width-sm",
|
|
712
|
+
"ds-select-padding-x-lg",
|
|
713
|
+
"ds-select-padding-x-md",
|
|
714
|
+
"ds-select-padding-x-sm",
|
|
715
|
+
"ds-select-text-font-family-default",
|
|
716
|
+
"ds-select-text-font-size-lg",
|
|
717
|
+
"ds-select-text-font-size-md",
|
|
718
|
+
"ds-select-text-font-size-sm",
|
|
719
|
+
"ds-select-text-font-weight-default",
|
|
720
|
+
"ds-select-text-frame-padding-x-default",
|
|
721
|
+
"ds-select-text-letter-spacing-default",
|
|
722
|
+
"ds-select-text-line-height-lg",
|
|
723
|
+
"ds-select-text-line-height-md",
|
|
724
|
+
"ds-select-text-line-height-sm"
|
|
725
|
+
],
|
|
726
|
+
"variants": [
|
|
727
|
+
"disabled",
|
|
728
|
+
"error",
|
|
729
|
+
"filled",
|
|
730
|
+
"lg",
|
|
731
|
+
"md",
|
|
732
|
+
"readonly",
|
|
733
|
+
"sm"
|
|
734
|
+
],
|
|
735
|
+
"figma": {
|
|
736
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
737
|
+
"page": "Select"
|
|
738
|
+
}
|
|
739
|
+
},
|
|
740
|
+
{
|
|
741
|
+
"name": "Combobox",
|
|
742
|
+
"slug": "combobox",
|
|
743
|
+
"url": "docs/combobox.html",
|
|
744
|
+
"cssClass": "ds-combobox",
|
|
745
|
+
"cssFile": "css/components/combobox.css",
|
|
746
|
+
"cssOnly": false,
|
|
747
|
+
"readiness": "app-ready",
|
|
748
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
749
|
+
"responsibility": {
|
|
750
|
+
"model": "ds-runtime",
|
|
751
|
+
"label": "Runtime do DS",
|
|
752
|
+
"ds": "Mantém o comportamento reutilizável de interação e acessibilidade por módulo público.",
|
|
753
|
+
"consumer": "Chama init após render, destroy ao desmontar, e fornece dados, eventos e regras de negócio."
|
|
754
|
+
},
|
|
755
|
+
"responsive": {
|
|
756
|
+
"profile": "container",
|
|
757
|
+
"label": "Container do consumidor",
|
|
758
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
759
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
760
|
+
},
|
|
761
|
+
"runtime": {
|
|
762
|
+
"level": "required",
|
|
763
|
+
"module": "ds-tis/combobox",
|
|
764
|
+
"init": "initComboboxes",
|
|
765
|
+
"destroy": "destroyComboboxes",
|
|
766
|
+
"exports": [
|
|
767
|
+
"initComboboxes",
|
|
768
|
+
"destroyComboboxes",
|
|
769
|
+
"syncComboboxState"
|
|
770
|
+
],
|
|
771
|
+
"events": [
|
|
772
|
+
"ds-combobox-change"
|
|
773
|
+
],
|
|
774
|
+
"notes": "Listbox, filtro, seleção e teclado exigem init após render; chame destroy ao desmontar."
|
|
775
|
+
},
|
|
776
|
+
"tokens": [
|
|
777
|
+
"ds-border-width-default",
|
|
778
|
+
"ds-combobox-height-lg",
|
|
779
|
+
"ds-combobox-height-md",
|
|
780
|
+
"ds-combobox-height-sm",
|
|
781
|
+
"ds-combobox-listbox-container-bg-default",
|
|
782
|
+
"ds-combobox-listbox-container-border-color-default",
|
|
783
|
+
"ds-combobox-listbox-container-gap-default",
|
|
784
|
+
"ds-combobox-listbox-container-padding-default",
|
|
785
|
+
"ds-combobox-listbox-container-radius-default",
|
|
786
|
+
"ds-combobox-option-bg-selected",
|
|
787
|
+
"ds-combobox-option-content-color-selected",
|
|
788
|
+
"ds-combobox-option-gap-default",
|
|
789
|
+
"ds-combobox-option-radius-default",
|
|
790
|
+
"ds-combobox-padding-x-lg",
|
|
791
|
+
"ds-combobox-padding-x-md",
|
|
792
|
+
"ds-combobox-padding-x-sm",
|
|
793
|
+
"ds-field-bg-default",
|
|
794
|
+
"ds-field-bg-disabled",
|
|
795
|
+
"ds-field-bg-readonly",
|
|
796
|
+
"ds-field-border-color-default",
|
|
797
|
+
"ds-field-border-color-disabled",
|
|
798
|
+
"ds-field-border-color-error",
|
|
799
|
+
"ds-field-border-color-error-hover",
|
|
800
|
+
"ds-field-border-color-filled",
|
|
801
|
+
"ds-field-border-color-focus",
|
|
802
|
+
"ds-field-border-color-hover",
|
|
803
|
+
"ds-field-border-color-readonly",
|
|
804
|
+
"ds-field-border-width",
|
|
805
|
+
"ds-field-padding-y-lg",
|
|
806
|
+
"ds-field-padding-y-md",
|
|
807
|
+
"ds-field-padding-y-sm",
|
|
808
|
+
"ds-field-placeholder-color-default",
|
|
809
|
+
"ds-field-placeholder-color-disabled",
|
|
810
|
+
"ds-field-radius",
|
|
811
|
+
"ds-field-value-color-default",
|
|
812
|
+
"ds-field-value-color-disabled",
|
|
813
|
+
"ds-field-value-color-readonly",
|
|
814
|
+
"ds-focus-ring-color-default",
|
|
815
|
+
"ds-focus-ring-color-error",
|
|
816
|
+
"ds-focus-ring-color-readonly",
|
|
817
|
+
"ds-focus-ring-width",
|
|
818
|
+
"ds-menu-item-bg-default",
|
|
819
|
+
"ds-menu-item-bg-disabled",
|
|
820
|
+
"ds-menu-item-bg-hover-default",
|
|
821
|
+
"ds-menu-item-content-color-default",
|
|
822
|
+
"ds-menu-item-content-color-disabled",
|
|
823
|
+
"ds-menu-item-content-color-hover",
|
|
824
|
+
"ds-menu-item-height-lg",
|
|
825
|
+
"ds-menu-item-height-md",
|
|
826
|
+
"ds-menu-item-height-sm",
|
|
827
|
+
"ds-menu-item-padding-x-lg",
|
|
828
|
+
"ds-menu-item-padding-x-md",
|
|
829
|
+
"ds-menu-item-padding-x-sm",
|
|
830
|
+
"ds-motion-duration-fast",
|
|
831
|
+
"ds-motion-ease-default",
|
|
832
|
+
"ds-select-chevron-color-default",
|
|
833
|
+
"ds-select-chevron-color-disabled",
|
|
834
|
+
"ds-select-chevron-frame-padding-x-default",
|
|
835
|
+
"ds-select-chevron-size-lg",
|
|
836
|
+
"ds-select-chevron-size-md",
|
|
837
|
+
"ds-select-chevron-size-sm",
|
|
838
|
+
"ds-select-chevron-stroke-width-lg",
|
|
839
|
+
"ds-select-chevron-stroke-width-md",
|
|
840
|
+
"ds-select-chevron-stroke-width-sm",
|
|
841
|
+
"ds-select-gap-lg",
|
|
842
|
+
"ds-select-gap-md",
|
|
843
|
+
"ds-select-gap-sm",
|
|
844
|
+
"ds-select-icon-color-default",
|
|
845
|
+
"ds-select-icon-color-disabled",
|
|
846
|
+
"ds-select-icon-frame-padding-x-default",
|
|
847
|
+
"ds-select-icon-size-lg",
|
|
848
|
+
"ds-select-icon-size-md",
|
|
849
|
+
"ds-select-icon-size-sm",
|
|
850
|
+
"ds-select-icon-stroke-width-lg",
|
|
851
|
+
"ds-select-icon-stroke-width-md",
|
|
852
|
+
"ds-select-icon-stroke-width-sm",
|
|
853
|
+
"ds-select-text-font-family-default",
|
|
854
|
+
"ds-select-text-font-size-lg",
|
|
855
|
+
"ds-select-text-font-size-md",
|
|
856
|
+
"ds-select-text-font-size-sm",
|
|
857
|
+
"ds-select-text-font-weight-default",
|
|
858
|
+
"ds-select-text-letter-spacing-default",
|
|
859
|
+
"ds-select-text-line-height-lg",
|
|
860
|
+
"ds-select-text-line-height-md",
|
|
861
|
+
"ds-select-text-line-height-sm",
|
|
862
|
+
"ds-shadow-overlay",
|
|
863
|
+
"ds-size-5xl",
|
|
864
|
+
"ds-space-2xs",
|
|
865
|
+
"ds-z-tooltip"
|
|
866
|
+
],
|
|
867
|
+
"variants": [
|
|
868
|
+
"disabled",
|
|
869
|
+
"error",
|
|
870
|
+
"filled",
|
|
871
|
+
"lg",
|
|
872
|
+
"md",
|
|
873
|
+
"open",
|
|
874
|
+
"readonly",
|
|
875
|
+
"sm"
|
|
876
|
+
],
|
|
877
|
+
"figma": {
|
|
878
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
879
|
+
"page": "Combobox"
|
|
880
|
+
}
|
|
881
|
+
},
|
|
882
|
+
{
|
|
883
|
+
"name": "Checkbox",
|
|
884
|
+
"slug": "checkbox",
|
|
885
|
+
"url": "docs/checkbox.html",
|
|
886
|
+
"cssClass": "ds-checkbox",
|
|
887
|
+
"cssFile": "css/components/checkbox.css",
|
|
888
|
+
"cssOnly": false,
|
|
889
|
+
"readiness": "app-ready",
|
|
890
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
891
|
+
"responsibility": {
|
|
892
|
+
"model": "native",
|
|
893
|
+
"label": "HTML nativo",
|
|
894
|
+
"ds": "Entrega anatomia, visual, estados e orientação de semântica nativa.",
|
|
895
|
+
"consumer": "Controla dados, eventos e regras de negócio usando o elemento HTML adequado."
|
|
896
|
+
},
|
|
897
|
+
"responsive": {
|
|
898
|
+
"profile": "container",
|
|
899
|
+
"label": "Container do consumidor",
|
|
900
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
901
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
902
|
+
},
|
|
903
|
+
"runtime": null,
|
|
904
|
+
"tokens": [
|
|
905
|
+
"ds-body-font-size-sm",
|
|
906
|
+
"ds-body-font-size-xs",
|
|
907
|
+
"ds-body-font-weight-bold",
|
|
908
|
+
"ds-body-font-weight-regular",
|
|
909
|
+
"ds-body-line-height-sm",
|
|
910
|
+
"ds-body-line-height-xs",
|
|
911
|
+
"ds-checkbox-box-border-color-unchecked-default",
|
|
912
|
+
"ds-checkbox-box-border-color-unchecked-disabled",
|
|
913
|
+
"ds-checkbox-box-border-color-unchecked-error",
|
|
914
|
+
"ds-checkbox-box-border-color-unchecked-hover",
|
|
915
|
+
"ds-checkbox-box-border-width-default",
|
|
916
|
+
"ds-checkbox-box-fill-checked-default",
|
|
917
|
+
"ds-checkbox-box-fill-checked-disabled",
|
|
918
|
+
"ds-checkbox-box-fill-checked-hover",
|
|
919
|
+
"ds-checkbox-box-fill-indeterminate-default",
|
|
920
|
+
"ds-checkbox-box-fill-indeterminate-disabled",
|
|
921
|
+
"ds-checkbox-box-fill-indeterminate-hover",
|
|
922
|
+
"ds-checkbox-box-fill-unchecked-default",
|
|
923
|
+
"ds-checkbox-box-fill-unchecked-disabled",
|
|
924
|
+
"ds-checkbox-box-fill-unchecked-hover",
|
|
925
|
+
"ds-checkbox-box-radius-default",
|
|
926
|
+
"ds-checkbox-box-size-lg",
|
|
927
|
+
"ds-checkbox-box-size-md",
|
|
928
|
+
"ds-checkbox-box-size-sm",
|
|
929
|
+
"ds-checkbox-content-gap-default",
|
|
930
|
+
"ds-checkbox-mark-fill-checked-default",
|
|
931
|
+
"ds-checkbox-mark-fill-checked-disabled",
|
|
932
|
+
"ds-checkbox-mark-fill-checked-hover",
|
|
933
|
+
"ds-checkbox-mark-fill-indeterminate-default",
|
|
934
|
+
"ds-checkbox-mark-fill-indeterminate-disabled",
|
|
935
|
+
"ds-checkbox-mark-fill-indeterminate-hover",
|
|
936
|
+
"ds-checkbox-target-gap-default",
|
|
937
|
+
"ds-checkbox-target-height-lg",
|
|
938
|
+
"ds-checkbox-target-height-md",
|
|
939
|
+
"ds-checkbox-target-height-sm",
|
|
940
|
+
"ds-focus-ring-color-default",
|
|
941
|
+
"ds-focus-ring-width",
|
|
942
|
+
"ds-form-field-description-color-default",
|
|
943
|
+
"ds-form-field-error-color-default",
|
|
944
|
+
"ds-form-field-error-font-size-default",
|
|
945
|
+
"ds-form-field-error-font-weight-default",
|
|
946
|
+
"ds-form-field-error-line-height-default",
|
|
947
|
+
"ds-form-field-helper-color-default",
|
|
948
|
+
"ds-form-field-label-color-default",
|
|
949
|
+
"ds-form-field-label-color-disabled",
|
|
950
|
+
"ds-form-field-label-font-family-default",
|
|
951
|
+
"ds-form-field-label-font-size-default",
|
|
952
|
+
"ds-form-field-label-line-height-default",
|
|
953
|
+
"ds-motion-duration-fast",
|
|
954
|
+
"ds-motion-ease-default",
|
|
955
|
+
"ds-size-sm",
|
|
956
|
+
"ds-space-hairline",
|
|
957
|
+
"ds-space-sm",
|
|
958
|
+
"ds-space-xs"
|
|
959
|
+
],
|
|
960
|
+
"variants": [
|
|
961
|
+
"error",
|
|
962
|
+
"lg",
|
|
963
|
+
"sm"
|
|
964
|
+
],
|
|
965
|
+
"figma": {
|
|
966
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
967
|
+
"page": "Checkbox"
|
|
968
|
+
}
|
|
969
|
+
},
|
|
970
|
+
{
|
|
971
|
+
"name": "Radio",
|
|
972
|
+
"slug": "radio",
|
|
973
|
+
"url": "docs/radio.html",
|
|
974
|
+
"cssClass": "ds-radio",
|
|
975
|
+
"cssFile": "css/components/radio.css",
|
|
976
|
+
"cssOnly": false,
|
|
977
|
+
"readiness": "app-ready",
|
|
978
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
979
|
+
"responsibility": {
|
|
980
|
+
"model": "native",
|
|
981
|
+
"label": "HTML nativo",
|
|
982
|
+
"ds": "Entrega anatomia, visual, estados e orientação de semântica nativa.",
|
|
983
|
+
"consumer": "Controla dados, eventos e regras de negócio usando o elemento HTML adequado."
|
|
984
|
+
},
|
|
985
|
+
"responsive": {
|
|
986
|
+
"profile": "container",
|
|
987
|
+
"label": "Container do consumidor",
|
|
988
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
989
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
990
|
+
},
|
|
991
|
+
"runtime": null,
|
|
992
|
+
"tokens": [
|
|
993
|
+
"ds-body-font-size-md",
|
|
994
|
+
"ds-body-font-size-sm",
|
|
995
|
+
"ds-body-font-size-xs",
|
|
996
|
+
"ds-body-font-weight-bold",
|
|
997
|
+
"ds-body-font-weight-regular",
|
|
998
|
+
"ds-body-line-height-2xs",
|
|
999
|
+
"ds-body-line-height-md",
|
|
1000
|
+
"ds-body-line-height-sm",
|
|
1001
|
+
"ds-body-line-height-xs",
|
|
1002
|
+
"ds-focus-ring-color-default",
|
|
1003
|
+
"ds-focus-ring-width",
|
|
1004
|
+
"ds-form-field-description-color-default",
|
|
1005
|
+
"ds-form-field-error-color-default",
|
|
1006
|
+
"ds-form-field-error-font-size-default",
|
|
1007
|
+
"ds-form-field-error-font-weight-default",
|
|
1008
|
+
"ds-form-field-error-line-height-default",
|
|
1009
|
+
"ds-form-field-helper-color-default",
|
|
1010
|
+
"ds-form-field-label-color-default",
|
|
1011
|
+
"ds-form-field-label-color-disabled",
|
|
1012
|
+
"ds-form-field-label-font-family-default",
|
|
1013
|
+
"ds-form-field-label-font-size-default",
|
|
1014
|
+
"ds-form-field-label-line-height-default",
|
|
1015
|
+
"ds-motion-duration-fast",
|
|
1016
|
+
"ds-motion-ease-default",
|
|
1017
|
+
"ds-radio-content-gap-default",
|
|
1018
|
+
"ds-radio-control-border-color-selected-default",
|
|
1019
|
+
"ds-radio-control-border-color-selected-hover",
|
|
1020
|
+
"ds-radio-control-border-color-unselected-default",
|
|
1021
|
+
"ds-radio-control-border-color-unselected-disabled",
|
|
1022
|
+
"ds-radio-control-border-color-unselected-error",
|
|
1023
|
+
"ds-radio-control-border-color-unselected-hover",
|
|
1024
|
+
"ds-radio-control-border-width-selected-default",
|
|
1025
|
+
"ds-radio-control-border-width-unselected-default",
|
|
1026
|
+
"ds-radio-control-fill-selected-default",
|
|
1027
|
+
"ds-radio-control-fill-selected-disabled",
|
|
1028
|
+
"ds-radio-control-fill-selected-hover",
|
|
1029
|
+
"ds-radio-control-fill-unselected-default",
|
|
1030
|
+
"ds-radio-control-fill-unselected-disabled",
|
|
1031
|
+
"ds-radio-control-fill-unselected-hover",
|
|
1032
|
+
"ds-radio-control-radius-default",
|
|
1033
|
+
"ds-radio-control-size-lg",
|
|
1034
|
+
"ds-radio-control-size-md",
|
|
1035
|
+
"ds-radio-control-size-sm",
|
|
1036
|
+
"ds-radio-dot-fill-selected-default",
|
|
1037
|
+
"ds-radio-dot-fill-selected-disabled",
|
|
1038
|
+
"ds-radio-dot-fill-selected-hover",
|
|
1039
|
+
"ds-radio-dot-radius-default",
|
|
1040
|
+
"ds-radio-dot-size-lg",
|
|
1041
|
+
"ds-radio-dot-size-md",
|
|
1042
|
+
"ds-radio-dot-size-sm",
|
|
1043
|
+
"ds-radio-target-gap-default",
|
|
1044
|
+
"ds-radio-target-height-lg",
|
|
1045
|
+
"ds-radio-target-height-md",
|
|
1046
|
+
"ds-radio-target-height-sm",
|
|
1047
|
+
"ds-radius-sm",
|
|
1048
|
+
"ds-size-sm",
|
|
1049
|
+
"ds-space-md",
|
|
1050
|
+
"ds-space-sm",
|
|
1051
|
+
"ds-space-xs"
|
|
1052
|
+
],
|
|
1053
|
+
"variants": [
|
|
1054
|
+
"error",
|
|
1055
|
+
"lg",
|
|
1056
|
+
"sm"
|
|
1057
|
+
],
|
|
1058
|
+
"figma": {
|
|
1059
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1060
|
+
"page": "Radio"
|
|
1061
|
+
}
|
|
1062
|
+
},
|
|
1063
|
+
{
|
|
1064
|
+
"name": "Toggle",
|
|
1065
|
+
"slug": "toggle",
|
|
1066
|
+
"url": "docs/toggle.html",
|
|
1067
|
+
"cssClass": "ds-toggle",
|
|
1068
|
+
"cssFile": "css/components/toggle.css",
|
|
1069
|
+
"cssOnly": false,
|
|
1070
|
+
"readiness": "app-ready",
|
|
1071
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
1072
|
+
"responsibility": {
|
|
1073
|
+
"model": "native",
|
|
1074
|
+
"label": "HTML nativo",
|
|
1075
|
+
"ds": "Entrega anatomia, visual, estados e orientação de semântica nativa.",
|
|
1076
|
+
"consumer": "Controla dados, eventos e regras de negócio usando o elemento HTML adequado."
|
|
1077
|
+
},
|
|
1078
|
+
"responsive": {
|
|
1079
|
+
"profile": "container",
|
|
1080
|
+
"label": "Container do consumidor",
|
|
1081
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
1082
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
1083
|
+
},
|
|
1084
|
+
"runtime": null,
|
|
1085
|
+
"tokens": [
|
|
1086
|
+
"ds-body-font-size-sm",
|
|
1087
|
+
"ds-body-font-size-xs",
|
|
1088
|
+
"ds-body-font-weight-bold",
|
|
1089
|
+
"ds-body-font-weight-regular",
|
|
1090
|
+
"ds-body-line-height-sm",
|
|
1091
|
+
"ds-body-line-height-xs",
|
|
1092
|
+
"ds-focus-ring-color-default",
|
|
1093
|
+
"ds-focus-ring-width",
|
|
1094
|
+
"ds-form-field-description-color-default",
|
|
1095
|
+
"ds-form-field-helper-color-default",
|
|
1096
|
+
"ds-form-field-label-color-default",
|
|
1097
|
+
"ds-form-field-label-color-disabled",
|
|
1098
|
+
"ds-form-field-label-font-family-default",
|
|
1099
|
+
"ds-form-field-label-font-size-default",
|
|
1100
|
+
"ds-form-field-label-line-height-default",
|
|
1101
|
+
"ds-motion-duration-fast",
|
|
1102
|
+
"ds-motion-ease-default",
|
|
1103
|
+
"ds-shadow-card",
|
|
1104
|
+
"ds-space-xs",
|
|
1105
|
+
"ds-toggle-content-gap-default",
|
|
1106
|
+
"ds-toggle-target-gap-default",
|
|
1107
|
+
"ds-toggle-target-height-lg",
|
|
1108
|
+
"ds-toggle-target-height-md",
|
|
1109
|
+
"ds-toggle-target-height-sm",
|
|
1110
|
+
"ds-toggle-thumb-fill-off-default",
|
|
1111
|
+
"ds-toggle-thumb-fill-off-disabled",
|
|
1112
|
+
"ds-toggle-thumb-fill-off-hover",
|
|
1113
|
+
"ds-toggle-thumb-fill-on-default",
|
|
1114
|
+
"ds-toggle-thumb-fill-on-disabled",
|
|
1115
|
+
"ds-toggle-thumb-fill-on-hover",
|
|
1116
|
+
"ds-toggle-thumb-inset-default",
|
|
1117
|
+
"ds-toggle-thumb-radius-default",
|
|
1118
|
+
"ds-toggle-thumb-size-lg",
|
|
1119
|
+
"ds-toggle-thumb-size-md",
|
|
1120
|
+
"ds-toggle-thumb-size-sm",
|
|
1121
|
+
"ds-toggle-track-border-color-off-default",
|
|
1122
|
+
"ds-toggle-track-border-color-off-disabled",
|
|
1123
|
+
"ds-toggle-track-border-color-off-hover",
|
|
1124
|
+
"ds-toggle-track-border-width-default",
|
|
1125
|
+
"ds-toggle-track-fill-off-default",
|
|
1126
|
+
"ds-toggle-track-fill-off-disabled",
|
|
1127
|
+
"ds-toggle-track-fill-off-hover",
|
|
1128
|
+
"ds-toggle-track-fill-on-default",
|
|
1129
|
+
"ds-toggle-track-fill-on-disabled",
|
|
1130
|
+
"ds-toggle-track-fill-on-hover",
|
|
1131
|
+
"ds-toggle-track-height-lg",
|
|
1132
|
+
"ds-toggle-track-height-md",
|
|
1133
|
+
"ds-toggle-track-height-sm",
|
|
1134
|
+
"ds-toggle-track-radius-default",
|
|
1135
|
+
"ds-toggle-track-width-lg",
|
|
1136
|
+
"ds-toggle-track-width-md",
|
|
1137
|
+
"ds-toggle-track-width-sm"
|
|
1138
|
+
],
|
|
1139
|
+
"variants": [
|
|
1140
|
+
"lg",
|
|
1141
|
+
"sm"
|
|
1142
|
+
],
|
|
1143
|
+
"figma": {
|
|
1144
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1145
|
+
"page": "Toggle"
|
|
1146
|
+
}
|
|
1147
|
+
},
|
|
1148
|
+
{
|
|
1149
|
+
"name": "Badge",
|
|
1150
|
+
"slug": "badge",
|
|
1151
|
+
"url": "docs/badge.html",
|
|
1152
|
+
"cssClass": "ds-badge",
|
|
1153
|
+
"cssFile": "css/components/badge.css",
|
|
1154
|
+
"cssOnly": false,
|
|
1155
|
+
"readiness": "app-ready",
|
|
1156
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
1157
|
+
"responsibility": {
|
|
1158
|
+
"model": "presentation",
|
|
1159
|
+
"label": "Apresentação",
|
|
1160
|
+
"ds": "Entrega anatomia visual, tokens e orientação semântica sem runtime de componente.",
|
|
1161
|
+
"consumer": "Fornece conteúdo, contexto e qualquer ação de produto associada."
|
|
1162
|
+
},
|
|
1163
|
+
"responsive": {
|
|
1164
|
+
"profile": "container",
|
|
1165
|
+
"label": "Container do consumidor",
|
|
1166
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
1167
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
1168
|
+
},
|
|
1169
|
+
"runtime": null,
|
|
1170
|
+
"tokens": [
|
|
1171
|
+
"ds-badge-bg-brand-solid",
|
|
1172
|
+
"ds-badge-bg-brand-subtle",
|
|
1173
|
+
"ds-badge-bg-error-solid",
|
|
1174
|
+
"ds-badge-bg-error-subtle",
|
|
1175
|
+
"ds-badge-bg-info-solid",
|
|
1176
|
+
"ds-badge-bg-info-subtle",
|
|
1177
|
+
"ds-badge-bg-neutral-default",
|
|
1178
|
+
"ds-badge-bg-success-solid",
|
|
1179
|
+
"ds-badge-bg-success-subtle",
|
|
1180
|
+
"ds-badge-bg-warning-solid",
|
|
1181
|
+
"ds-badge-bg-warning-subtle",
|
|
1182
|
+
"ds-badge-border-color-neutral-subtle",
|
|
1183
|
+
"ds-badge-border-width-default",
|
|
1184
|
+
"ds-badge-gap-default",
|
|
1185
|
+
"ds-badge-label-color-brand-solid",
|
|
1186
|
+
"ds-badge-label-color-brand-subtle",
|
|
1187
|
+
"ds-badge-label-color-error-solid",
|
|
1188
|
+
"ds-badge-label-color-error-subtle",
|
|
1189
|
+
"ds-badge-label-color-info-solid",
|
|
1190
|
+
"ds-badge-label-color-info-subtle",
|
|
1191
|
+
"ds-badge-label-color-neutral-solid",
|
|
1192
|
+
"ds-badge-label-color-neutral-subtle",
|
|
1193
|
+
"ds-badge-label-color-success-solid",
|
|
1194
|
+
"ds-badge-label-color-success-subtle",
|
|
1195
|
+
"ds-badge-label-color-warning-solid",
|
|
1196
|
+
"ds-badge-label-color-warning-subtle",
|
|
1197
|
+
"ds-badge-label-font-size-default",
|
|
1198
|
+
"ds-badge-label-font-weight-default",
|
|
1199
|
+
"ds-badge-label-line-height-default",
|
|
1200
|
+
"ds-badge-padding-x-default",
|
|
1201
|
+
"ds-badge-padding-y-default",
|
|
1202
|
+
"ds-badge-radius-default"
|
|
1203
|
+
],
|
|
1204
|
+
"variants": [
|
|
1205
|
+
"brand",
|
|
1206
|
+
"error",
|
|
1207
|
+
"info",
|
|
1208
|
+
"neutral",
|
|
1209
|
+
"solid",
|
|
1210
|
+
"subtle",
|
|
1211
|
+
"success",
|
|
1212
|
+
"warning"
|
|
1213
|
+
],
|
|
1214
|
+
"figma": {
|
|
1215
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1216
|
+
"page": "Badge"
|
|
1217
|
+
}
|
|
1218
|
+
},
|
|
1219
|
+
{
|
|
1220
|
+
"name": "Alert",
|
|
1221
|
+
"slug": "alert",
|
|
1222
|
+
"url": "docs/alert.html",
|
|
1223
|
+
"cssClass": "ds-alert",
|
|
1224
|
+
"cssFile": "css/components/alert.css",
|
|
1225
|
+
"cssOnly": false,
|
|
1226
|
+
"readiness": "app-ready",
|
|
1227
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
1228
|
+
"responsibility": {
|
|
1229
|
+
"model": "presentation",
|
|
1230
|
+
"label": "Apresentação",
|
|
1231
|
+
"ds": "Entrega anatomia visual, tokens e orientação semântica sem runtime de componente.",
|
|
1232
|
+
"consumer": "Fornece conteúdo, contexto e qualquer ação de produto associada."
|
|
1233
|
+
},
|
|
1234
|
+
"responsive": {
|
|
1235
|
+
"profile": "container",
|
|
1236
|
+
"label": "Container do consumidor",
|
|
1237
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
1238
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
1239
|
+
},
|
|
1240
|
+
"runtime": null,
|
|
1241
|
+
"tokens": [
|
|
1242
|
+
"ds-alert-bg-error-filled",
|
|
1243
|
+
"ds-alert-bg-error-subtle",
|
|
1244
|
+
"ds-alert-bg-info-filled",
|
|
1245
|
+
"ds-alert-bg-info-subtle",
|
|
1246
|
+
"ds-alert-bg-success-filled",
|
|
1247
|
+
"ds-alert-bg-success-subtle",
|
|
1248
|
+
"ds-alert-bg-warning-filled",
|
|
1249
|
+
"ds-alert-bg-warning-subtle",
|
|
1250
|
+
"ds-alert-border-color-error-subtle",
|
|
1251
|
+
"ds-alert-border-color-info-subtle",
|
|
1252
|
+
"ds-alert-border-color-success-subtle",
|
|
1253
|
+
"ds-alert-border-color-warning-subtle",
|
|
1254
|
+
"ds-alert-border-width-default",
|
|
1255
|
+
"ds-alert-close-icon-size-default",
|
|
1256
|
+
"ds-alert-close-icon-stroke-width-default",
|
|
1257
|
+
"ds-alert-content-gap-default",
|
|
1258
|
+
"ds-alert-description-color-error-filled",
|
|
1259
|
+
"ds-alert-description-color-info-filled",
|
|
1260
|
+
"ds-alert-description-color-subtle",
|
|
1261
|
+
"ds-alert-description-color-success-filled",
|
|
1262
|
+
"ds-alert-description-color-warning-filled",
|
|
1263
|
+
"ds-alert-description-font-size-default",
|
|
1264
|
+
"ds-alert-description-font-weight-default",
|
|
1265
|
+
"ds-alert-description-line-height-default",
|
|
1266
|
+
"ds-alert-gap-default",
|
|
1267
|
+
"ds-alert-icon-color-error-subtle",
|
|
1268
|
+
"ds-alert-icon-color-info-subtle",
|
|
1269
|
+
"ds-alert-icon-color-success-subtle",
|
|
1270
|
+
"ds-alert-icon-color-warning-subtle",
|
|
1271
|
+
"ds-alert-icon-size-default",
|
|
1272
|
+
"ds-alert-icon-stroke-width-default",
|
|
1273
|
+
"ds-alert-padding-default",
|
|
1274
|
+
"ds-alert-radius-default",
|
|
1275
|
+
"ds-alert-title-font-size-default",
|
|
1276
|
+
"ds-alert-title-font-weight-default",
|
|
1277
|
+
"ds-alert-title-line-height-default",
|
|
1278
|
+
"ds-focus-ring-color-default",
|
|
1279
|
+
"ds-focus-ring-width",
|
|
1280
|
+
"ds-motion-duration-fast",
|
|
1281
|
+
"ds-motion-ease-default",
|
|
1282
|
+
"ds-radius-sm"
|
|
1283
|
+
],
|
|
1284
|
+
"variants": [
|
|
1285
|
+
"error",
|
|
1286
|
+
"filled",
|
|
1287
|
+
"info",
|
|
1288
|
+
"subtle",
|
|
1289
|
+
"success",
|
|
1290
|
+
"warning"
|
|
1291
|
+
],
|
|
1292
|
+
"figma": {
|
|
1293
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1294
|
+
"page": "Alert"
|
|
1295
|
+
}
|
|
1296
|
+
},
|
|
1297
|
+
{
|
|
1298
|
+
"name": "Card",
|
|
1299
|
+
"slug": "card",
|
|
1300
|
+
"url": "docs/card.html",
|
|
1301
|
+
"cssClass": "ds-card",
|
|
1302
|
+
"cssFile": "css/components/card.css",
|
|
1303
|
+
"cssOnly": false,
|
|
1304
|
+
"readiness": "app-ready",
|
|
1305
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
1306
|
+
"responsibility": {
|
|
1307
|
+
"model": "presentation",
|
|
1308
|
+
"label": "Apresentação",
|
|
1309
|
+
"ds": "Entrega anatomia visual, tokens e orientação semântica sem runtime de componente.",
|
|
1310
|
+
"consumer": "Fornece conteúdo, contexto e qualquer ação de produto associada."
|
|
1311
|
+
},
|
|
1312
|
+
"responsive": {
|
|
1313
|
+
"profile": "container",
|
|
1314
|
+
"label": "Container do consumidor",
|
|
1315
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
1316
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
1317
|
+
},
|
|
1318
|
+
"runtime": null,
|
|
1319
|
+
"tokens": [
|
|
1320
|
+
"ds-card-bg-default",
|
|
1321
|
+
"ds-card-bg-elevated",
|
|
1322
|
+
"ds-card-body-color-default",
|
|
1323
|
+
"ds-card-body-font-size-default",
|
|
1324
|
+
"ds-card-body-font-weight-default",
|
|
1325
|
+
"ds-card-body-line-height-default",
|
|
1326
|
+
"ds-card-border-color-outlined",
|
|
1327
|
+
"ds-card-border-width-default",
|
|
1328
|
+
"ds-card-container-gap-default",
|
|
1329
|
+
"ds-card-container-padding-default",
|
|
1330
|
+
"ds-card-footer-gap-default",
|
|
1331
|
+
"ds-card-header-gap-default",
|
|
1332
|
+
"ds-card-interactive-border-color-default",
|
|
1333
|
+
"ds-card-interactive-border-color-hover",
|
|
1334
|
+
"ds-card-interactive-border-color-selected",
|
|
1335
|
+
"ds-card-interactive-border-width-default",
|
|
1336
|
+
"ds-card-interactive-border-width-selected",
|
|
1337
|
+
"ds-card-interactive-focus-ring-radius-default",
|
|
1338
|
+
"ds-card-radius-default",
|
|
1339
|
+
"ds-card-subtitle-color-default",
|
|
1340
|
+
"ds-card-subtitle-font-size-default",
|
|
1341
|
+
"ds-card-subtitle-font-weight-default",
|
|
1342
|
+
"ds-card-subtitle-line-height-default",
|
|
1343
|
+
"ds-card-title-color-default",
|
|
1344
|
+
"ds-card-title-font-size-default",
|
|
1345
|
+
"ds-card-title-font-weight-default",
|
|
1346
|
+
"ds-card-title-line-height-default",
|
|
1347
|
+
"ds-focus-ring-color-default",
|
|
1348
|
+
"ds-focus-ring-width",
|
|
1349
|
+
"ds-motion-duration-fast",
|
|
1350
|
+
"ds-motion-ease-default",
|
|
1351
|
+
"ds-shadow-card",
|
|
1352
|
+
"ds-size-layout-xs"
|
|
1353
|
+
],
|
|
1354
|
+
"variants": [
|
|
1355
|
+
"default",
|
|
1356
|
+
"elevated",
|
|
1357
|
+
"focus",
|
|
1358
|
+
"hover",
|
|
1359
|
+
"interactive",
|
|
1360
|
+
"outlined",
|
|
1361
|
+
"selected"
|
|
1362
|
+
],
|
|
1363
|
+
"figma": {
|
|
1364
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1365
|
+
"page": "Card"
|
|
1366
|
+
}
|
|
1367
|
+
},
|
|
1368
|
+
{
|
|
1369
|
+
"name": "Modal",
|
|
1370
|
+
"slug": "modal",
|
|
1371
|
+
"url": "docs/modal.html",
|
|
1372
|
+
"cssClass": "ds-modal",
|
|
1373
|
+
"cssFile": "css/components/modal.css",
|
|
1374
|
+
"cssOnly": false,
|
|
1375
|
+
"readiness": "app-ready",
|
|
1376
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
1377
|
+
"responsibility": {
|
|
1378
|
+
"model": "ds-runtime",
|
|
1379
|
+
"label": "Runtime do DS",
|
|
1380
|
+
"ds": "Mantém o comportamento reutilizável de interação e acessibilidade por módulo público.",
|
|
1381
|
+
"consumer": "Chama init após render, destroy ao desmontar, e fornece dados, eventos e regras de negócio."
|
|
1382
|
+
},
|
|
1383
|
+
"responsive": {
|
|
1384
|
+
"profile": "viewport-constrained",
|
|
1385
|
+
"label": "Limitado pela viewport",
|
|
1386
|
+
"ds": "Aplica limites intrínsecos de largura/altura contra a viewport além de preservar o contrato do componente.",
|
|
1387
|
+
"consumer": "Fornece conteúdo conciso e testa teclado, zoom e orientação no contexto real da aplicação."
|
|
1388
|
+
},
|
|
1389
|
+
"runtime": {
|
|
1390
|
+
"level": "required",
|
|
1391
|
+
"module": "ds-tis/modal",
|
|
1392
|
+
"init": "initModals",
|
|
1393
|
+
"destroy": "destroyModals",
|
|
1394
|
+
"exports": [
|
|
1395
|
+
"initModals",
|
|
1396
|
+
"destroyModals",
|
|
1397
|
+
"openModal",
|
|
1398
|
+
"closeModal"
|
|
1399
|
+
],
|
|
1400
|
+
"events": [
|
|
1401
|
+
"ds-modal-open",
|
|
1402
|
+
"ds-modal-close"
|
|
1403
|
+
],
|
|
1404
|
+
"notes": "Abertura, focus trap, Escape, inert e retorno de foco exigem init; chame destroy ao desmontar."
|
|
1405
|
+
},
|
|
1406
|
+
"tokens": [
|
|
1407
|
+
"ds-body-font-size-2xl",
|
|
1408
|
+
"ds-body-font-size-3xl",
|
|
1409
|
+
"ds-body-font-size-lg",
|
|
1410
|
+
"ds-body-font-size-md",
|
|
1411
|
+
"ds-body-font-size-sm",
|
|
1412
|
+
"ds-body-font-size-xl",
|
|
1413
|
+
"ds-body-font-weight-regular",
|
|
1414
|
+
"ds-body-font-weight-semibold",
|
|
1415
|
+
"ds-body-letter-spacing-normal",
|
|
1416
|
+
"ds-body-letter-spacing-tight",
|
|
1417
|
+
"ds-body-line-height-2xl",
|
|
1418
|
+
"ds-body-line-height-3xl",
|
|
1419
|
+
"ds-body-line-height-md",
|
|
1420
|
+
"ds-body-line-height-sm",
|
|
1421
|
+
"ds-body-line-height-xl",
|
|
1422
|
+
"ds-content-strong",
|
|
1423
|
+
"ds-focus-ring-color-default",
|
|
1424
|
+
"ds-focus-ring-width",
|
|
1425
|
+
"ds-modal-bg-default",
|
|
1426
|
+
"ds-modal-body-color-default",
|
|
1427
|
+
"ds-modal-close-color-default",
|
|
1428
|
+
"ds-modal-close-icon-size-lg",
|
|
1429
|
+
"ds-modal-close-icon-size-md",
|
|
1430
|
+
"ds-modal-close-icon-size-sm",
|
|
1431
|
+
"ds-modal-close-icon-stroke-width-default",
|
|
1432
|
+
"ds-modal-close-padding-lg",
|
|
1433
|
+
"ds-modal-close-padding-md",
|
|
1434
|
+
"ds-modal-close-padding-sm",
|
|
1435
|
+
"ds-modal-close-size-lg",
|
|
1436
|
+
"ds-modal-close-size-md",
|
|
1437
|
+
"ds-modal-close-size-sm",
|
|
1438
|
+
"ds-modal-container-gap-lg",
|
|
1439
|
+
"ds-modal-container-gap-md",
|
|
1440
|
+
"ds-modal-container-gap-sm",
|
|
1441
|
+
"ds-modal-container-padding-lg",
|
|
1442
|
+
"ds-modal-container-padding-md",
|
|
1443
|
+
"ds-modal-container-padding-sm",
|
|
1444
|
+
"ds-modal-description-color-default",
|
|
1445
|
+
"ds-modal-footer-gap-lg",
|
|
1446
|
+
"ds-modal-footer-gap-md",
|
|
1447
|
+
"ds-modal-footer-gap-sm",
|
|
1448
|
+
"ds-modal-header-gap-default",
|
|
1449
|
+
"ds-modal-heading-gap-default",
|
|
1450
|
+
"ds-modal-max-width-lg",
|
|
1451
|
+
"ds-modal-max-width-md",
|
|
1452
|
+
"ds-modal-max-width-sm",
|
|
1453
|
+
"ds-modal-overlay-bg-default",
|
|
1454
|
+
"ds-modal-overlay-padding-default",
|
|
1455
|
+
"ds-modal-overlay-z-index-default",
|
|
1456
|
+
"ds-modal-radius-default",
|
|
1457
|
+
"ds-modal-shadow-default",
|
|
1458
|
+
"ds-modal-title-color-default",
|
|
1459
|
+
"ds-motion-duration-fast",
|
|
1460
|
+
"ds-motion-ease-default",
|
|
1461
|
+
"ds-radius-sm",
|
|
1462
|
+
"ds-space-section-sm",
|
|
1463
|
+
"ds-space-sm"
|
|
1464
|
+
],
|
|
1465
|
+
"variants": [
|
|
1466
|
+
"lg",
|
|
1467
|
+
"md",
|
|
1468
|
+
"sm"
|
|
1469
|
+
],
|
|
1470
|
+
"figma": {
|
|
1471
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1472
|
+
"page": "Modal"
|
|
1473
|
+
}
|
|
1474
|
+
},
|
|
1475
|
+
{
|
|
1476
|
+
"name": "Tooltip",
|
|
1477
|
+
"slug": "tooltip",
|
|
1478
|
+
"url": "docs/tooltip.html",
|
|
1479
|
+
"cssClass": "ds-tooltip",
|
|
1480
|
+
"cssFile": "css/components/tooltip.css",
|
|
1481
|
+
"cssOnly": false,
|
|
1482
|
+
"readiness": "app-ready",
|
|
1483
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
1484
|
+
"responsibility": {
|
|
1485
|
+
"model": "ds-runtime",
|
|
1486
|
+
"label": "Runtime do DS",
|
|
1487
|
+
"ds": "Mantém o comportamento reutilizável de interação e acessibilidade por módulo público.",
|
|
1488
|
+
"consumer": "Chama init após render, destroy ao desmontar, e fornece dados, eventos e regras de negócio."
|
|
1489
|
+
},
|
|
1490
|
+
"responsive": {
|
|
1491
|
+
"profile": "viewport-constrained",
|
|
1492
|
+
"label": "Limitado pela viewport",
|
|
1493
|
+
"ds": "Aplica limites intrínsecos de largura/altura contra a viewport além de preservar o contrato do componente.",
|
|
1494
|
+
"consumer": "Fornece conteúdo conciso e testa teclado, zoom e orientação no contexto real da aplicação."
|
|
1495
|
+
},
|
|
1496
|
+
"runtime": {
|
|
1497
|
+
"level": "required",
|
|
1498
|
+
"module": "ds-tis/tooltip",
|
|
1499
|
+
"init": "initTooltips",
|
|
1500
|
+
"destroy": "destroyTooltips",
|
|
1501
|
+
"exports": [
|
|
1502
|
+
"initTooltips",
|
|
1503
|
+
"destroyTooltips",
|
|
1504
|
+
"showTooltip",
|
|
1505
|
+
"hideTooltip"
|
|
1506
|
+
],
|
|
1507
|
+
"events": [
|
|
1508
|
+
"ds-tooltip-show",
|
|
1509
|
+
"ds-tooltip-hide"
|
|
1510
|
+
],
|
|
1511
|
+
"notes": "Hover, focus, Escape e hoverable content (WCAG 1.4.13) exigem init após render; chame destroy ao desmontar."
|
|
1512
|
+
},
|
|
1513
|
+
"tokens": [
|
|
1514
|
+
"ds-size-layout-xs",
|
|
1515
|
+
"ds-space-3xl",
|
|
1516
|
+
"ds-space-sm",
|
|
1517
|
+
"ds-tooltip-arrow-depth-default",
|
|
1518
|
+
"ds-tooltip-arrow-fill-default",
|
|
1519
|
+
"ds-tooltip-content-fill-default",
|
|
1520
|
+
"ds-tooltip-content-padding-x-default",
|
|
1521
|
+
"ds-tooltip-content-padding-y-default",
|
|
1522
|
+
"ds-tooltip-content-radius-default",
|
|
1523
|
+
"ds-tooltip-label-color-default",
|
|
1524
|
+
"ds-tooltip-label-font-size-default",
|
|
1525
|
+
"ds-tooltip-label-font-weight-default",
|
|
1526
|
+
"ds-tooltip-label-line-height-default",
|
|
1527
|
+
"ds-z-tooltip"
|
|
1528
|
+
],
|
|
1529
|
+
"variants": [
|
|
1530
|
+
"bottom",
|
|
1531
|
+
"left",
|
|
1532
|
+
"right",
|
|
1533
|
+
"top"
|
|
1534
|
+
],
|
|
1535
|
+
"figma": {
|
|
1536
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1537
|
+
"page": "Tooltip"
|
|
1538
|
+
}
|
|
1539
|
+
},
|
|
1540
|
+
{
|
|
1541
|
+
"name": "Menu",
|
|
1542
|
+
"slug": "menu",
|
|
1543
|
+
"url": "docs/menu.html",
|
|
1544
|
+
"cssClass": "ds-menu",
|
|
1545
|
+
"cssFile": "css/components/menu.css",
|
|
1546
|
+
"cssOnly": false,
|
|
1547
|
+
"readiness": "app-ready",
|
|
1548
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
1549
|
+
"responsibility": {
|
|
1550
|
+
"model": "ds-runtime",
|
|
1551
|
+
"label": "Runtime do DS",
|
|
1552
|
+
"ds": "Mantém o comportamento reutilizável de interação e acessibilidade por módulo público.",
|
|
1553
|
+
"consumer": "Chama init após render, destroy ao desmontar, e fornece dados, eventos e regras de negócio."
|
|
1554
|
+
},
|
|
1555
|
+
"responsive": {
|
|
1556
|
+
"profile": "container",
|
|
1557
|
+
"label": "Container do consumidor",
|
|
1558
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
1559
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
1560
|
+
},
|
|
1561
|
+
"runtime": {
|
|
1562
|
+
"level": "required",
|
|
1563
|
+
"module": "ds-tis/menu",
|
|
1564
|
+
"init": "initActionMenus",
|
|
1565
|
+
"destroy": "destroyActionMenus",
|
|
1566
|
+
"exports": [
|
|
1567
|
+
"initActionMenus",
|
|
1568
|
+
"destroyActionMenus",
|
|
1569
|
+
"openActionMenu",
|
|
1570
|
+
"closeActionMenu"
|
|
1571
|
+
],
|
|
1572
|
+
"events": [
|
|
1573
|
+
"ds-menu-open",
|
|
1574
|
+
"ds-menu-close"
|
|
1575
|
+
],
|
|
1576
|
+
"notes": "Action Menu exige init para abertura, teclado e retorno de foco; chame destroy ao desmontar."
|
|
1577
|
+
},
|
|
1578
|
+
"tokens": [
|
|
1579
|
+
"ds-action-menu-overlay-gap-default",
|
|
1580
|
+
"ds-body-font-family-sans",
|
|
1581
|
+
"ds-body-font-size-sm",
|
|
1582
|
+
"ds-body-font-size-xs",
|
|
1583
|
+
"ds-body-font-weight-medium",
|
|
1584
|
+
"ds-body-font-weight-regular",
|
|
1585
|
+
"ds-body-font-weight-semibold",
|
|
1586
|
+
"ds-body-line-height-sm",
|
|
1587
|
+
"ds-body-line-height-xs",
|
|
1588
|
+
"ds-content-subtle",
|
|
1589
|
+
"ds-feedback-error-background-subtle",
|
|
1590
|
+
"ds-focus-ring-color-default",
|
|
1591
|
+
"ds-focus-ring-color-error",
|
|
1592
|
+
"ds-focus-ring-width",
|
|
1593
|
+
"ds-menu-focus-ring-radius-default",
|
|
1594
|
+
"ds-menu-item-bg-default",
|
|
1595
|
+
"ds-menu-item-bg-disabled",
|
|
1596
|
+
"ds-menu-item-bg-focused",
|
|
1597
|
+
"ds-menu-item-bg-hover-default",
|
|
1598
|
+
"ds-menu-item-content-color-default",
|
|
1599
|
+
"ds-menu-item-content-color-destructive",
|
|
1600
|
+
"ds-menu-item-content-color-disabled",
|
|
1601
|
+
"ds-menu-item-content-color-focused",
|
|
1602
|
+
"ds-menu-item-content-color-hover",
|
|
1603
|
+
"ds-menu-item-gap-lg",
|
|
1604
|
+
"ds-menu-item-gap-md",
|
|
1605
|
+
"ds-menu-item-gap-sm",
|
|
1606
|
+
"ds-menu-item-height-lg",
|
|
1607
|
+
"ds-menu-item-height-md",
|
|
1608
|
+
"ds-menu-item-height-sm",
|
|
1609
|
+
"ds-menu-item-icon-color-default",
|
|
1610
|
+
"ds-menu-item-icon-color-destructive",
|
|
1611
|
+
"ds-menu-item-icon-color-disabled",
|
|
1612
|
+
"ds-menu-item-icon-size-lg",
|
|
1613
|
+
"ds-menu-item-icon-size-md",
|
|
1614
|
+
"ds-menu-item-icon-size-sm",
|
|
1615
|
+
"ds-menu-item-icon-stroke-width-lg",
|
|
1616
|
+
"ds-menu-item-icon-stroke-width-md",
|
|
1617
|
+
"ds-menu-item-icon-stroke-width-sm",
|
|
1618
|
+
"ds-menu-item-meta-color-default",
|
|
1619
|
+
"ds-menu-item-meta-color-destructive",
|
|
1620
|
+
"ds-menu-item-meta-color-disabled",
|
|
1621
|
+
"ds-menu-item-padding-x-lg",
|
|
1622
|
+
"ds-menu-item-padding-x-md",
|
|
1623
|
+
"ds-menu-item-padding-x-sm",
|
|
1624
|
+
"ds-menu-item-radius-default",
|
|
1625
|
+
"ds-menu-surface-bg-default",
|
|
1626
|
+
"ds-menu-surface-border-color-default",
|
|
1627
|
+
"ds-menu-surface-border-width-default",
|
|
1628
|
+
"ds-menu-surface-gap-default",
|
|
1629
|
+
"ds-menu-surface-padding-default",
|
|
1630
|
+
"ds-menu-surface-radius-default",
|
|
1631
|
+
"ds-menu-surface-shadow-default",
|
|
1632
|
+
"ds-motion-duration-fast",
|
|
1633
|
+
"ds-motion-ease-default",
|
|
1634
|
+
"ds-size-5xl",
|
|
1635
|
+
"ds-size-layout-xs",
|
|
1636
|
+
"ds-space-2xs",
|
|
1637
|
+
"ds-space-md",
|
|
1638
|
+
"ds-space-sm",
|
|
1639
|
+
"ds-space-xs",
|
|
1640
|
+
"ds-z-tooltip"
|
|
1641
|
+
],
|
|
1642
|
+
"variants": [
|
|
1643
|
+
"full",
|
|
1644
|
+
"lg",
|
|
1645
|
+
"sm",
|
|
1646
|
+
"start"
|
|
1647
|
+
],
|
|
1648
|
+
"figma": {
|
|
1649
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1650
|
+
"page": "Menu"
|
|
1651
|
+
}
|
|
1652
|
+
},
|
|
1653
|
+
{
|
|
1654
|
+
"name": "Tabs",
|
|
1655
|
+
"slug": "tabs",
|
|
1656
|
+
"url": "docs/tabs.html",
|
|
1657
|
+
"cssClass": "ds-tabs",
|
|
1658
|
+
"cssFile": "css/components/tabs.css",
|
|
1659
|
+
"cssOnly": false,
|
|
1660
|
+
"readiness": "app-ready",
|
|
1661
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
1662
|
+
"responsibility": {
|
|
1663
|
+
"model": "ds-runtime",
|
|
1664
|
+
"label": "Runtime do DS",
|
|
1665
|
+
"ds": "Mantém o comportamento reutilizável de interação e acessibilidade por módulo público.",
|
|
1666
|
+
"consumer": "Chama init após render, destroy ao desmontar, e fornece dados, eventos e regras de negócio."
|
|
1667
|
+
},
|
|
1668
|
+
"responsive": {
|
|
1669
|
+
"profile": "consumer-managed-horizontal",
|
|
1670
|
+
"label": "Coleção horizontal gerida pelo consumidor",
|
|
1671
|
+
"ds": "Mantém itens, estados e navegação horizontal; não remove, resume nem reorganiza conteúdo por breakpoint.",
|
|
1672
|
+
"consumer": "Decide redução de itens, overflow, wrapping ou composição alternativa conforme conteúdo e regra de produto."
|
|
1673
|
+
},
|
|
1674
|
+
"runtime": {
|
|
1675
|
+
"level": "required",
|
|
1676
|
+
"module": "ds-tis/tabs",
|
|
1677
|
+
"init": "initTabs",
|
|
1678
|
+
"destroy": "destroyTabs",
|
|
1679
|
+
"exports": [
|
|
1680
|
+
"initTabs",
|
|
1681
|
+
"destroyTabs",
|
|
1682
|
+
"selectTab"
|
|
1683
|
+
],
|
|
1684
|
+
"events": [
|
|
1685
|
+
"ds-tabs-change"
|
|
1686
|
+
],
|
|
1687
|
+
"notes": "Seleção, roving tabindex e sync de painéis exigem init após render; chame destroy ao desmontar."
|
|
1688
|
+
},
|
|
1689
|
+
"tokens": [
|
|
1690
|
+
"ds-focus-ring-color-default",
|
|
1691
|
+
"ds-focus-ring-width",
|
|
1692
|
+
"ds-motion-duration-fast",
|
|
1693
|
+
"ds-motion-ease-default",
|
|
1694
|
+
"ds-overlay-default",
|
|
1695
|
+
"ds-tabs-focus-ring-radius-default",
|
|
1696
|
+
"ds-tabs-indicator-fill-active",
|
|
1697
|
+
"ds-tabs-indicator-height-default",
|
|
1698
|
+
"ds-tabs-item-indicator-gap-default",
|
|
1699
|
+
"ds-tabs-item-padding-top-default",
|
|
1700
|
+
"ds-tabs-item-padding-x-default",
|
|
1701
|
+
"ds-tabs-label-color-active",
|
|
1702
|
+
"ds-tabs-label-color-default",
|
|
1703
|
+
"ds-tabs-label-color-disabled",
|
|
1704
|
+
"ds-tabs-label-color-hover",
|
|
1705
|
+
"ds-tabs-label-font-size-default",
|
|
1706
|
+
"ds-tabs-label-font-weight-default",
|
|
1707
|
+
"ds-tabs-label-letter-spacing-default",
|
|
1708
|
+
"ds-tabs-label-line-height-default",
|
|
1709
|
+
"ds-tabs-list-border-width-default",
|
|
1710
|
+
"ds-tabs-panel-padding-y-default"
|
|
1711
|
+
],
|
|
1712
|
+
"variants": [
|
|
1713
|
+
"active"
|
|
1714
|
+
],
|
|
1715
|
+
"figma": {
|
|
1716
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1717
|
+
"page": "Tabs"
|
|
1718
|
+
}
|
|
1719
|
+
},
|
|
1720
|
+
{
|
|
1721
|
+
"name": "Breadcrumb",
|
|
1722
|
+
"slug": "breadcrumb",
|
|
1723
|
+
"url": "docs/breadcrumb.html",
|
|
1724
|
+
"cssClass": "ds-breadcrumb",
|
|
1725
|
+
"cssFile": "css/components/breadcrumb.css",
|
|
1726
|
+
"cssOnly": false,
|
|
1727
|
+
"readiness": "app-ready",
|
|
1728
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
1729
|
+
"responsibility": {
|
|
1730
|
+
"model": "native",
|
|
1731
|
+
"label": "HTML nativo",
|
|
1732
|
+
"ds": "Entrega anatomia, visual, estados e orientação de semântica nativa.",
|
|
1733
|
+
"consumer": "Controla dados, eventos e regras de negócio usando o elemento HTML adequado."
|
|
1734
|
+
},
|
|
1735
|
+
"responsive": {
|
|
1736
|
+
"profile": "consumer-managed-horizontal",
|
|
1737
|
+
"label": "Coleção horizontal gerida pelo consumidor",
|
|
1738
|
+
"ds": "Mantém itens, estados e navegação horizontal; não remove, resume nem reorganiza conteúdo por breakpoint.",
|
|
1739
|
+
"consumer": "Decide redução de itens, overflow, wrapping ou composição alternativa conforme conteúdo e regra de produto."
|
|
1740
|
+
},
|
|
1741
|
+
"runtime": null,
|
|
1742
|
+
"tokens": [
|
|
1743
|
+
"ds-breadcrumb-focus-ring-radius-default",
|
|
1744
|
+
"ds-breadcrumb-gap-default",
|
|
1745
|
+
"ds-breadcrumb-item-gap-default",
|
|
1746
|
+
"ds-breadcrumb-label-color-current",
|
|
1747
|
+
"ds-breadcrumb-label-color-link",
|
|
1748
|
+
"ds-breadcrumb-label-font-size-default",
|
|
1749
|
+
"ds-breadcrumb-label-font-weight-default",
|
|
1750
|
+
"ds-breadcrumb-label-letter-spacing-default",
|
|
1751
|
+
"ds-breadcrumb-label-line-height-default",
|
|
1752
|
+
"ds-breadcrumb-separator-font-size-default",
|
|
1753
|
+
"ds-breadcrumb-separator-font-weight-default",
|
|
1754
|
+
"ds-breadcrumb-separator-letter-spacing-default",
|
|
1755
|
+
"ds-breadcrumb-separator-line-height-default",
|
|
1756
|
+
"ds-content-subtle",
|
|
1757
|
+
"ds-focus-ring-color-default",
|
|
1758
|
+
"ds-focus-ring-width",
|
|
1759
|
+
"ds-link-content-active",
|
|
1760
|
+
"ds-link-content-hover"
|
|
1761
|
+
],
|
|
1762
|
+
"variants": [],
|
|
1763
|
+
"figma": {
|
|
1764
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1765
|
+
"page": "Breadcrumb"
|
|
1766
|
+
}
|
|
1767
|
+
},
|
|
1768
|
+
{
|
|
1769
|
+
"name": "Pagination",
|
|
1770
|
+
"slug": "pagination",
|
|
1771
|
+
"url": "docs/pagination.html",
|
|
1772
|
+
"cssClass": "ds-pagination",
|
|
1773
|
+
"cssFile": "css/components/pagination.css",
|
|
1774
|
+
"cssOnly": false,
|
|
1775
|
+
"readiness": "composition",
|
|
1776
|
+
"readinessNotes": "O DS entrega itens e estados; a aplicação mantém URL, carregamento e página atual.",
|
|
1777
|
+
"responsibility": {
|
|
1778
|
+
"model": "consumer",
|
|
1779
|
+
"label": "Aplicação",
|
|
1780
|
+
"ds": "Entrega a composição, anatomia e estados visuais públicos.",
|
|
1781
|
+
"consumer": "Mantém a orquestração entre elementos, dados, navegação e regras de negócio."
|
|
1782
|
+
},
|
|
1783
|
+
"responsive": {
|
|
1784
|
+
"profile": "consumer-managed-horizontal",
|
|
1785
|
+
"label": "Coleção horizontal gerida pelo consumidor",
|
|
1786
|
+
"ds": "Mantém itens, estados e navegação horizontal; não remove, resume nem reorganiza conteúdo por breakpoint.",
|
|
1787
|
+
"consumer": "Decide redução de itens, overflow, wrapping ou composição alternativa conforme conteúdo e regra de produto."
|
|
1788
|
+
},
|
|
1789
|
+
"runtime": null,
|
|
1790
|
+
"tokens": [
|
|
1791
|
+
"ds-focus-ring-color-default",
|
|
1792
|
+
"ds-focus-ring-width",
|
|
1793
|
+
"ds-motion-duration-fast",
|
|
1794
|
+
"ds-motion-ease-default",
|
|
1795
|
+
"ds-pagination-focus-ring-radius-default",
|
|
1796
|
+
"ds-pagination-gap-default",
|
|
1797
|
+
"ds-pagination-icon-color-default",
|
|
1798
|
+
"ds-pagination-icon-size-sm",
|
|
1799
|
+
"ds-pagination-icon-stroke-width-sm",
|
|
1800
|
+
"ds-pagination-item-bg-current",
|
|
1801
|
+
"ds-pagination-item-bg-default",
|
|
1802
|
+
"ds-pagination-item-bg-disabled",
|
|
1803
|
+
"ds-pagination-item-bg-hover",
|
|
1804
|
+
"ds-pagination-item-content-color-current",
|
|
1805
|
+
"ds-pagination-item-content-color-default",
|
|
1806
|
+
"ds-pagination-item-content-color-disabled",
|
|
1807
|
+
"ds-pagination-item-content-color-hover",
|
|
1808
|
+
"ds-pagination-item-font-family-default",
|
|
1809
|
+
"ds-pagination-item-font-size-lg",
|
|
1810
|
+
"ds-pagination-item-font-size-md",
|
|
1811
|
+
"ds-pagination-item-font-size-sm",
|
|
1812
|
+
"ds-pagination-item-font-weight-current",
|
|
1813
|
+
"ds-pagination-item-font-weight-default",
|
|
1814
|
+
"ds-pagination-item-height-lg",
|
|
1815
|
+
"ds-pagination-item-height-md",
|
|
1816
|
+
"ds-pagination-item-height-sm",
|
|
1817
|
+
"ds-pagination-item-line-height-lg",
|
|
1818
|
+
"ds-pagination-item-line-height-md",
|
|
1819
|
+
"ds-pagination-item-line-height-sm",
|
|
1820
|
+
"ds-pagination-item-min-width-lg",
|
|
1821
|
+
"ds-pagination-item-min-width-md",
|
|
1822
|
+
"ds-pagination-item-min-width-sm",
|
|
1823
|
+
"ds-pagination-item-radius-default",
|
|
1824
|
+
"ds-space-2xs"
|
|
1825
|
+
],
|
|
1826
|
+
"variants": [
|
|
1827
|
+
"lg",
|
|
1828
|
+
"sm"
|
|
1829
|
+
],
|
|
1830
|
+
"figma": {
|
|
1831
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1832
|
+
"page": "Pagination"
|
|
1833
|
+
}
|
|
1834
|
+
},
|
|
1835
|
+
{
|
|
1836
|
+
"name": "Avatar",
|
|
1837
|
+
"slug": "avatar",
|
|
1838
|
+
"url": "docs/avatar.html",
|
|
1839
|
+
"cssClass": "ds-avatar",
|
|
1840
|
+
"cssFile": "css/components/avatar.css",
|
|
1841
|
+
"cssOnly": false,
|
|
1842
|
+
"readiness": "app-ready",
|
|
1843
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
1844
|
+
"responsibility": {
|
|
1845
|
+
"model": "presentation",
|
|
1846
|
+
"label": "Apresentação",
|
|
1847
|
+
"ds": "Entrega anatomia visual, tokens e orientação semântica sem runtime de componente.",
|
|
1848
|
+
"consumer": "Fornece conteúdo, contexto e qualquer ação de produto associada."
|
|
1849
|
+
},
|
|
1850
|
+
"responsive": {
|
|
1851
|
+
"profile": "container",
|
|
1852
|
+
"label": "Container do consumidor",
|
|
1853
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
1854
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
1855
|
+
},
|
|
1856
|
+
"runtime": null,
|
|
1857
|
+
"tokens": [
|
|
1858
|
+
"ds-avatar-bg-default",
|
|
1859
|
+
"ds-avatar-content-color-default",
|
|
1860
|
+
"ds-avatar-icon-size-lg",
|
|
1861
|
+
"ds-avatar-icon-size-md",
|
|
1862
|
+
"ds-avatar-icon-size-sm",
|
|
1863
|
+
"ds-avatar-icon-stroke-width-lg",
|
|
1864
|
+
"ds-avatar-icon-stroke-width-md",
|
|
1865
|
+
"ds-avatar-icon-stroke-width-sm",
|
|
1866
|
+
"ds-avatar-initials-font-size-lg",
|
|
1867
|
+
"ds-avatar-initials-font-size-md",
|
|
1868
|
+
"ds-avatar-initials-font-size-sm",
|
|
1869
|
+
"ds-avatar-initials-font-weight-lg",
|
|
1870
|
+
"ds-avatar-initials-font-weight-md",
|
|
1871
|
+
"ds-avatar-initials-font-weight-sm",
|
|
1872
|
+
"ds-avatar-initials-line-height-lg",
|
|
1873
|
+
"ds-avatar-initials-line-height-md",
|
|
1874
|
+
"ds-avatar-initials-line-height-sm",
|
|
1875
|
+
"ds-avatar-radius-default",
|
|
1876
|
+
"ds-avatar-size-lg",
|
|
1877
|
+
"ds-avatar-size-md",
|
|
1878
|
+
"ds-avatar-size-sm",
|
|
1879
|
+
"ds-body-font-family-sans"
|
|
1880
|
+
],
|
|
1881
|
+
"variants": [
|
|
1882
|
+
"icon",
|
|
1883
|
+
"lg",
|
|
1884
|
+
"sm"
|
|
1885
|
+
],
|
|
1886
|
+
"figma": {
|
|
1887
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1888
|
+
"page": "Avatar"
|
|
1889
|
+
}
|
|
1890
|
+
},
|
|
1891
|
+
{
|
|
1892
|
+
"name": "Divider",
|
|
1893
|
+
"slug": "divider",
|
|
1894
|
+
"url": "docs/divider.html",
|
|
1895
|
+
"cssClass": "ds-divider",
|
|
1896
|
+
"cssFile": "css/components/divider.css",
|
|
1897
|
+
"cssOnly": false,
|
|
1898
|
+
"readiness": "app-ready",
|
|
1899
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
1900
|
+
"responsibility": {
|
|
1901
|
+
"model": "presentation",
|
|
1902
|
+
"label": "Apresentação",
|
|
1903
|
+
"ds": "Entrega anatomia visual, tokens e orientação semântica sem runtime de componente.",
|
|
1904
|
+
"consumer": "Fornece conteúdo, contexto e qualquer ação de produto associada."
|
|
1905
|
+
},
|
|
1906
|
+
"responsive": {
|
|
1907
|
+
"profile": "container",
|
|
1908
|
+
"label": "Container do consumidor",
|
|
1909
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
1910
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
1911
|
+
},
|
|
1912
|
+
"runtime": null,
|
|
1913
|
+
"tokens": [
|
|
1914
|
+
"ds-divider-line-color-default",
|
|
1915
|
+
"ds-divider-line-radius-default",
|
|
1916
|
+
"ds-divider-line-thickness-default",
|
|
1917
|
+
"ds-space-md"
|
|
1918
|
+
],
|
|
1919
|
+
"variants": [
|
|
1920
|
+
"vertical"
|
|
1921
|
+
],
|
|
1922
|
+
"figma": {
|
|
1923
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
1924
|
+
"page": "Divider"
|
|
1925
|
+
}
|
|
1926
|
+
},
|
|
1927
|
+
{
|
|
1928
|
+
"name": "Form Field",
|
|
1929
|
+
"slug": "form-field",
|
|
1930
|
+
"url": "docs/form-field.html",
|
|
1931
|
+
"cssClass": "ds-field",
|
|
1932
|
+
"cssFile": "css/components/form-field.css",
|
|
1933
|
+
"cssOnly": true,
|
|
1934
|
+
"readiness": "composition",
|
|
1935
|
+
"readinessNotes": "O DS entrega label, helper e erro; a aplicação mantém IDs, validação, valor e mensagens.",
|
|
1936
|
+
"responsibility": {
|
|
1937
|
+
"model": "consumer",
|
|
1938
|
+
"label": "Aplicação",
|
|
1939
|
+
"ds": "Entrega a composição, anatomia e estados visuais públicos.",
|
|
1940
|
+
"consumer": "Mantém a orquestração entre elementos, dados, navegação e regras de negócio."
|
|
1941
|
+
},
|
|
1942
|
+
"responsive": {
|
|
1943
|
+
"profile": "container",
|
|
1944
|
+
"label": "Container do consumidor",
|
|
1945
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
1946
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
1947
|
+
},
|
|
1948
|
+
"runtime": null,
|
|
1949
|
+
"tokens": [
|
|
1950
|
+
"ds-body-font-size-xs",
|
|
1951
|
+
"ds-body-font-weight-bold",
|
|
1952
|
+
"ds-body-font-weight-regular",
|
|
1953
|
+
"ds-body-line-height-xs",
|
|
1954
|
+
"ds-form-field-error-color-default",
|
|
1955
|
+
"ds-form-field-error-font-size-default",
|
|
1956
|
+
"ds-form-field-error-font-weight-default",
|
|
1957
|
+
"ds-form-field-error-gap-default",
|
|
1958
|
+
"ds-form-field-error-icon-color-default",
|
|
1959
|
+
"ds-form-field-error-icon-frame-padding-x-default",
|
|
1960
|
+
"ds-form-field-error-icon-size-default",
|
|
1961
|
+
"ds-form-field-error-line-height-default",
|
|
1962
|
+
"ds-form-field-error-padding-top-default",
|
|
1963
|
+
"ds-form-field-gap-default",
|
|
1964
|
+
"ds-form-field-helper-color-default",
|
|
1965
|
+
"ds-form-field-label-color-default",
|
|
1966
|
+
"ds-form-field-label-font-size-default",
|
|
1967
|
+
"ds-form-field-label-line-height-default",
|
|
1968
|
+
"ds-form-field-label-row-gap-default",
|
|
1969
|
+
"ds-form-field-required-color-default",
|
|
1970
|
+
"ds-form-field-required-font-size-default",
|
|
1971
|
+
"ds-form-field-required-line-height-default"
|
|
1972
|
+
],
|
|
1973
|
+
"variants": [
|
|
1974
|
+
"error",
|
|
1975
|
+
"no-helper",
|
|
1976
|
+
"no-label"
|
|
1977
|
+
],
|
|
1978
|
+
"figma": null
|
|
1979
|
+
},
|
|
1980
|
+
{
|
|
1981
|
+
"name": "Spinner",
|
|
1982
|
+
"slug": "spinner",
|
|
1983
|
+
"url": "docs/spinner.html",
|
|
1984
|
+
"cssClass": "ds-spinner",
|
|
1985
|
+
"cssFile": "css/components/spinner.css",
|
|
1986
|
+
"cssOnly": false,
|
|
1987
|
+
"readiness": "app-ready",
|
|
1988
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
1989
|
+
"responsibility": {
|
|
1990
|
+
"model": "presentation",
|
|
1991
|
+
"label": "Apresentação",
|
|
1992
|
+
"ds": "Entrega anatomia visual, tokens e orientação semântica sem runtime de componente.",
|
|
1993
|
+
"consumer": "Fornece conteúdo, contexto e qualquer ação de produto associada."
|
|
1994
|
+
},
|
|
1995
|
+
"responsive": {
|
|
1996
|
+
"profile": "container",
|
|
1997
|
+
"label": "Container do consumidor",
|
|
1998
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
1999
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
2000
|
+
},
|
|
2001
|
+
"runtime": null,
|
|
2002
|
+
"tokens": [
|
|
2003
|
+
"ds-motion-duration-slower",
|
|
2004
|
+
"ds-motion-ease-linear",
|
|
2005
|
+
"ds-opacity-disabled",
|
|
2006
|
+
"ds-spinner-indicator-border-color-default",
|
|
2007
|
+
"ds-spinner-indicator-border-color-on-color",
|
|
2008
|
+
"ds-spinner-radius-default",
|
|
2009
|
+
"ds-spinner-ring-stroke-width-default",
|
|
2010
|
+
"ds-spinner-size-lg",
|
|
2011
|
+
"ds-spinner-size-md",
|
|
2012
|
+
"ds-spinner-size-sm",
|
|
2013
|
+
"ds-spinner-track-border-color-default",
|
|
2014
|
+
"ds-spinner-track-border-color-on-color"
|
|
2015
|
+
],
|
|
2016
|
+
"variants": [
|
|
2017
|
+
"lg",
|
|
2018
|
+
"md",
|
|
2019
|
+
"on-color",
|
|
2020
|
+
"sm"
|
|
2021
|
+
],
|
|
2022
|
+
"figma": {
|
|
2023
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
2024
|
+
"page": "Spinner"
|
|
2025
|
+
}
|
|
2026
|
+
},
|
|
2027
|
+
{
|
|
2028
|
+
"name": "Skeleton",
|
|
2029
|
+
"slug": "skeleton",
|
|
2030
|
+
"url": "docs/skeleton.html",
|
|
2031
|
+
"cssClass": "ds-skeleton",
|
|
2032
|
+
"cssFile": "css/components/skeleton.css",
|
|
2033
|
+
"cssOnly": false,
|
|
2034
|
+
"readiness": "app-ready",
|
|
2035
|
+
"readinessNotes": "API pública recomendada para aplicações: anatomia, estados e responsabilidade de comportamento estão documentados.",
|
|
2036
|
+
"responsibility": {
|
|
2037
|
+
"model": "presentation",
|
|
2038
|
+
"label": "Apresentação",
|
|
2039
|
+
"ds": "Entrega anatomia visual, tokens e orientação semântica sem runtime de componente.",
|
|
2040
|
+
"consumer": "Fornece conteúdo, contexto e qualquer ação de produto associada."
|
|
2041
|
+
},
|
|
2042
|
+
"responsive": {
|
|
2043
|
+
"profile": "container",
|
|
2044
|
+
"label": "Container do consumidor",
|
|
2045
|
+
"ds": "Preserva anatomia, estados e interação na largura oferecida pelo container; não troca variants por viewport.",
|
|
2046
|
+
"consumer": "Define grid, largura, reflow e densidade da tela sem inventar modificadores responsivos do componente."
|
|
2047
|
+
},
|
|
2048
|
+
"runtime": null,
|
|
2049
|
+
"tokens": [
|
|
2050
|
+
"ds-skeleton-circle-fill-default",
|
|
2051
|
+
"ds-skeleton-circle-radius-default",
|
|
2052
|
+
"ds-skeleton-circle-size-default",
|
|
2053
|
+
"ds-skeleton-rectangle-fill-default",
|
|
2054
|
+
"ds-skeleton-rectangle-height-default",
|
|
2055
|
+
"ds-skeleton-rectangle-radius-default",
|
|
2056
|
+
"ds-skeleton-text-fill-default",
|
|
2057
|
+
"ds-skeleton-text-height-default",
|
|
2058
|
+
"ds-skeleton-text-radius-default"
|
|
2059
|
+
],
|
|
2060
|
+
"variants": [
|
|
2061
|
+
"circle",
|
|
2062
|
+
"rectangle",
|
|
2063
|
+
"text"
|
|
2064
|
+
],
|
|
2065
|
+
"figma": {
|
|
2066
|
+
"fileKey": "IE68amP9Hya5ieFw1rX8S8",
|
|
2067
|
+
"page": "Skeleton"
|
|
2068
|
+
}
|
|
2069
|
+
}
|
|
2070
|
+
]
|
|
2071
|
+
}
|