@aurea-uds/native 0.10.1 → 0.12.1
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/README.md +10 -0
- package/dist/actions.d.ts +14 -5
- package/dist/actions.js +69 -20
- package/dist/busca.d.ts +9 -2
- package/dist/busca.js +14 -5
- package/dist/display.d.ts +0 -16
- package/dist/display.js +21 -7
- package/dist/icon-names.d.ts +14 -0
- package/dist/icon-names.js +3 -0
- package/dist/icon.d.ts +4 -4
- package/dist/index.d.ts +7 -6
- package/dist/index.js +2 -2
- package/dist/inputs.d.ts +10 -1
- package/dist/inputs.js +16 -8
- package/dist/layout.d.ts +19 -7
- package/dist/layout.js +40 -11
- package/dist/navigation.d.ts +4 -1
- package/dist/navigation.js +2 -2
- package/dist/numero.d.ts +3 -4
- package/dist/overlays.js +12 -5
- package/dist/rolagem.d.ts +8 -1
- package/dist/rolagem.js +7 -2
- package/dist/screen.d.ts +10 -0
- package/dist/screen.js +84 -2
- package/dist/strings.d.ts +3 -0
- package/dist/strings.js +4 -0
- package/dist/text.d.ts +38 -1
- package/dist/text.js +45 -4
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -862,6 +862,16 @@ const Logo = criarGlifo({fill: "none", stroke: "currentColor", strokeWidth: 2,
|
|
|
862
862
|
const ICONES = criarRegistroDeIcones({...OS_DO_APP, logo: Logo});
|
|
863
863
|
```
|
|
864
864
|
|
|
865
|
+
**O nome é checado pelo TypeScript** (desde a A-04): `<Icon name="chevron-down">`, com um traço
|
|
866
|
+
só, não compila, e a chave do registro também é conferida. Um glifo próprio entra declarando o
|
|
867
|
+
nome **uma vez**:
|
|
868
|
+
|
|
869
|
+
```tsx
|
|
870
|
+
declare module "@aurea-uds/native" {
|
|
871
|
+
interface AureaIconNames { logo: true }
|
|
872
|
+
}
|
|
873
|
+
```
|
|
874
|
+
|
|
865
875
|
## O que este pacote não faz
|
|
866
876
|
|
|
867
877
|
- **Não promete paridade** com a web. O React Native não tem `<p>`, cascata de tipografia,
|
package/dist/actions.d.ts
CHANGED
|
@@ -49,19 +49,28 @@ export interface ButtonProps extends Omit<PressableProps, "children" | "style">
|
|
|
49
49
|
* descreve: lá, um botão desabilitado some da ordem de foco e a explicação pendurada nele não é
|
|
50
50
|
* lida por ninguém. Aqui não há o dilema, então não há o par `aria-disabled` — um só basta.
|
|
51
51
|
*/
|
|
52
|
-
export declare function Button(
|
|
52
|
+
export declare function Button(props: ButtonProps): React.JSX.Element;
|
|
53
|
+
export interface LinkButtonProps extends Omit<ButtonProps, "appearance" | "fullWidth"> {
|
|
54
|
+
}
|
|
55
|
+
/** Botão-texto sem recuo nem caixa, alinhado com o texto em volta. O `LinkButton` do HeroUI. */
|
|
56
|
+
export declare function LinkButton(props: LinkButtonProps): React.JSX.Element;
|
|
53
57
|
export interface IconButtonProps extends Omit<ButtonProps, "children" | "leadingIcon" | "trailingIcon" | "fullWidth"> {
|
|
54
58
|
name: IconName;
|
|
55
59
|
/** **Obrigatório**: um botão que só tem glifo não tem texto para o leitor de tela anunciar. */
|
|
56
60
|
label: string;
|
|
57
61
|
}
|
|
58
62
|
/**
|
|
59
|
-
* Botão
|
|
63
|
+
* Botão REDONDO, só glifo.
|
|
60
64
|
*
|
|
61
|
-
* O raio
|
|
62
|
-
*
|
|
65
|
+
* O raio é o da cápsula (`radiusControl`, 999) num quadrado, e um quadrado com raio 999 é um
|
|
66
|
+
* círculo — o mesmo que o `.btn-icon` do core faz. Decisão do Victor, 25/09/2026 (ADR-0052): era
|
|
67
|
+
* `--radius-md`/`--radius-sm`, e o HeroUI 3.2.6 faz o botão só de ícone redondo.
|
|
63
68
|
*
|
|
64
69
|
* ⚠ **`label` é obrigatório no tipo**, e é a única prop deste pacote que obriga texto. Um ícone
|
|
65
70
|
* sozinho não diz nada a quem não o vê, e deixar isso opcional é o mesmo que deixá-lo vazio.
|
|
66
71
|
*/
|
|
67
|
-
export declare function IconButton(
|
|
72
|
+
export declare function IconButton(props: IconButtonProps): React.JSX.Element;
|
|
73
|
+
/** Fechado: sem `appearance` e sem `tone`, porque a cor é a do glifo. */
|
|
74
|
+
export interface ThemeToggleProps extends Omit<IconButtonProps, "name" | "label" | "onPress" | "appearance" | "tone"> {
|
|
75
|
+
}
|
|
76
|
+
export declare function ThemeToggle(props: ThemeToggleProps): React.JSX.Element;
|
package/dist/actions.js
CHANGED
|
@@ -25,7 +25,7 @@ import { Pressable, View } from "react-native";
|
|
|
25
25
|
import { criarFolha, REACAO_AO_TOQUE } from "./estilos.js";
|
|
26
26
|
import { Icon } from "./icon.js";
|
|
27
27
|
import { Text } from "./text.js";
|
|
28
|
-
import { useAureaTokens, useSobreAMarca } from "./theme.js";
|
|
28
|
+
import { useAureaStrings, useAureaTheme, useAureaTokens, useSobreAMarca } from "./theme.js";
|
|
29
29
|
const ALTURA = {
|
|
30
30
|
xs: "controlHXs", sm: "controlHSm", md: "controlHMd", lg: "controlHLg", xl: "controlHXl",
|
|
31
31
|
};
|
|
@@ -82,12 +82,24 @@ function pintar(t, tone) {
|
|
|
82
82
|
* sobre o amarelo, que é o único desenho que se enxerga nos dois temas;
|
|
83
83
|
* - **contornado e sem fundo** — contorno e letra viram a tinta.
|
|
84
84
|
*
|
|
85
|
-
*
|
|
86
|
-
*
|
|
85
|
+
* ~~⚠ **O tom pedido é IGNORADO aqui**~~ — **E7, 25/09/2026: no botão CHEIO com tom, ele vale.**
|
|
86
|
+
* O Victor quis as cores (confirmar em verde, "agora não" em vermelho). Medido antes, nos dois
|
|
87
|
+
* temas: a letra sobre o próprio fundo do botão passa sempre (sucesso 6,3 e 9,39; perigo 4,57 e
|
|
88
|
+
* 6,32), mas o FUNDO do botão contra o amarelo não se distingue (sucesso no escuro **1,00**,
|
|
89
|
+
* perigo 1,51, aviso 1,36; no claro perigo 2,50) — o formato sumiria. Então o botão cheio com tom
|
|
90
|
+
* mantém a cor dele e ganha **contorno na tinta do cartão** (4,54 contra o amarelo): a cor diz o
|
|
91
|
+
* que ele faz, o contorno diz onde ele está.
|
|
92
|
+
*
|
|
93
|
+
* ⚠ **No contornado e no sem fundo o tom continua ignorado**: ali a letra colorida fica direto
|
|
94
|
+
* sobre o amarelo, e nenhum tom passa de 4,5 — obedecer entregaria um botão ilegível. O neutro e
|
|
95
|
+
* o da marca também seguem na tinta (neutro 1,61; marca é amarelo no amarelo, 1,00).
|
|
87
96
|
*/
|
|
88
|
-
|
|
97
|
+
const TONS_COM_COR = new Set(["success", "danger", "warning", "info"]);
|
|
98
|
+
function pintarSobreAMarca(base, marca, tone, appearance) {
|
|
89
99
|
if (marca == null)
|
|
90
100
|
return base;
|
|
101
|
+
if (appearance === "solid" && TONS_COM_COR.has(tone))
|
|
102
|
+
return { ...base, contorno: marca.tinta };
|
|
91
103
|
return { solido: marca.tinta, texto: marca.fundo, sobre: marca.tinta };
|
|
92
104
|
}
|
|
93
105
|
const folha = criarFolha((t) => ({
|
|
@@ -107,7 +119,12 @@ const folha = criarFolha((t) => ({
|
|
|
107
119
|
// pinta fundo, borda e raio é a `caixa` interna, com a altura do token. O botão continua com
|
|
108
120
|
// 36 dp de desenho e passa a ter 44 de alvo — e o leitor de tela enxerga os 44, porque o
|
|
109
121
|
// elemento acessível é o `Pressable`, não um retângulo invisível ao lado dele.
|
|
110
|
-
|
|
122
|
+
// E2 (25/09/2026): SEM `alignSelf`. O botão obedece o pai, como no HeroUI Native (`button.css`
|
|
123
|
+
// não fixa alinhamento) e como o `.btn` da web num `.stack`. Era `alignSelf: "flex-start"`, e ele
|
|
124
|
+
// vencia o `alignItems: "center"` do pai: o botão do `EmptyState` ficava à esquerda com o resto
|
|
125
|
+
// no meio. ⚠ A consequência, decidida pelo Victor: numa coluna sem alinhamento o botão ESTICA,
|
|
126
|
+
// como na web. "Do tamanho do texto" se diz no pai — `Stack align="start"`.
|
|
127
|
+
alvo: { minHeight: t.size.targetMin, justifyContent: "center" },
|
|
111
128
|
alvoLargura: { alignSelf: "stretch" },
|
|
112
129
|
caixa: {
|
|
113
130
|
flexDirection: "row", alignItems: "center", justifyContent: "center",
|
|
@@ -127,52 +144,84 @@ const folha = criarFolha((t) => ({
|
|
|
127
144
|
* descreve: lá, um botão desabilitado some da ordem de foco e a explicação pendurada nele não é
|
|
128
145
|
* lida por ninguém. Aqui não há o dilema, então não há o par `aria-disabled` — um só basta.
|
|
129
146
|
*/
|
|
130
|
-
export function Button(
|
|
147
|
+
export function Button(props) {
|
|
148
|
+
return _jsx(CorpoDoBotao, { ...props });
|
|
149
|
+
}
|
|
150
|
+
/** O corpo do `Button`. `semRecuo` é só do `LinkButton`: sem recuo, sem borda e sem altura. */
|
|
151
|
+
function CorpoDoBotao({ children, appearance = "solid", tone = "neutral", size = "md", leadingIcon, trailingIcon, leading, trailing, icons, fullWidth = false, pressed, disabled, accessibilityLabel, semRecuo = false, ...rest }) {
|
|
131
152
|
const t = useAureaTokens();
|
|
132
153
|
const s = folha(t);
|
|
133
154
|
const marca = useSobreAMarca();
|
|
134
|
-
const cor = pintarSobreAMarca(pintar(t, tone), marca);
|
|
155
|
+
const cor = pintarSobreAMarca(pintar(t, tone), marca, tone, appearance);
|
|
135
156
|
const corDaBorda = marca?.tinta ?? t.color.border;
|
|
136
157
|
const caixa = React.useMemo(() => ({
|
|
137
158
|
height: t.size[ALTURA[size]],
|
|
138
159
|
paddingHorizontal: PADDING[size],
|
|
139
160
|
gap: GAP[size],
|
|
140
161
|
backgroundColor: appearance === "solid" ? cor.solido : "transparent",
|
|
141
|
-
borderColor: appearance === "outline" ? corDaBorda : "transparent",
|
|
162
|
+
borderColor: cor.contorno ?? (appearance === "outline" ? corDaBorda : "transparent"),
|
|
142
163
|
...(fullWidth ? { flex: 1 } : null),
|
|
143
|
-
|
|
164
|
+
// `.link-button__root` do HeroUI Native: `height: auto; padding: 0`, e o `.button__root` já
|
|
165
|
+
// tem `border-width: 0`. A borda transparente de 1 empurraria o texto 1 para dentro.
|
|
166
|
+
...(semRecuo ? { height: undefined, paddingHorizontal: 0, borderWidth: 0 } : null),
|
|
167
|
+
}), [t, size, appearance, cor.solido, cor.contorno, corDaBorda, fullWidth, semRecuo]);
|
|
144
168
|
const corDoTexto = appearance === "solid" ? cor.texto : cor.sobre;
|
|
145
169
|
return (_jsx(Pressable, { disabled: disabled, accessibilityRole: "button", accessibilityLabel: accessibilityLabel, accessibilityState: { disabled: !!disabled, ...(pressed === undefined ? null : { checked: pressed }) }, style: ({ pressed: tocando }) => [
|
|
146
170
|
s.alvo, fullWidth && s.alvoLargura,
|
|
147
171
|
tocando && s.pressionado, disabled && s.inerte,
|
|
148
172
|
], ...rest, children: _jsxs(View, { style: [s.caixa, caixa], children: [leading ?? null, leadingIcon ? _jsx(Icon, { name: leadingIcon, size: ICONE[size], color: corDoTexto, icons: icons }) : null, typeof children === "string"
|
|
149
|
-
|
|
173
|
+
// E1 (25/09/2026): entrelinha NORMAL (1,5), como o rótulo do botão do HeroUI Native
|
|
174
|
+
// (`button.css`: `line-height: var(--text-*--line-height)`). Era `none` (1,0), e o IBM
|
|
175
|
+
// Plex precisa de 1,3 em para caber inteiro (sobe 1,025 e desce 0,275): no Android o RN
|
|
176
|
+
// corta o que passa da linha, e a perna do g, do p e do ç sumia. Cabe em todo tamanho e
|
|
177
|
+
// densidade (medido): `xs`/`sm` têm linha de 21 e o menor botão mede 24 (compacto); os
|
|
178
|
+
// maiores têm linha de 24 e medem 32 ou mais.
|
|
179
|
+
? _jsx(Text, { size: FONTE[size], weight: 500, leading: "normal", style: { color: corDoTexto }, children: children })
|
|
150
180
|
: children, trailingIcon ? _jsx(Icon, { name: trailingIcon, size: ICONE[size], color: corDoTexto, icons: icons }) : null, trailing ?? null] }) }));
|
|
151
181
|
}
|
|
182
|
+
/** Botão-texto sem recuo nem caixa, alinhado com o texto em volta. O `LinkButton` do HeroUI. */
|
|
183
|
+
export function LinkButton(props) {
|
|
184
|
+
return _jsx(CorpoDoBotao, { ...props, appearance: "ghost", semRecuo: true });
|
|
185
|
+
}
|
|
152
186
|
/**
|
|
153
|
-
* Botão
|
|
187
|
+
* Botão REDONDO, só glifo.
|
|
154
188
|
*
|
|
155
|
-
* O raio
|
|
156
|
-
*
|
|
189
|
+
* O raio é o da cápsula (`radiusControl`, 999) num quadrado, e um quadrado com raio 999 é um
|
|
190
|
+
* círculo — o mesmo que o `.btn-icon` do core faz. Decisão do Victor, 25/09/2026 (ADR-0052): era
|
|
191
|
+
* `--radius-md`/`--radius-sm`, e o HeroUI 3.2.6 faz o botão só de ícone redondo.
|
|
157
192
|
*
|
|
158
193
|
* ⚠ **`label` é obrigatório no tipo**, e é a única prop deste pacote que obriga texto. Um ícone
|
|
159
194
|
* sozinho não diz nada a quem não o vê, e deixar isso opcional é o mesmo que deixá-lo vazio.
|
|
160
195
|
*/
|
|
161
|
-
export function IconButton(
|
|
196
|
+
export function IconButton(props) {
|
|
197
|
+
return _jsx(BotaoDeIcone, { ...props });
|
|
198
|
+
}
|
|
199
|
+
/** O corpo do `IconButton`. A cor própria do ícone (`corDoIcone`) é só do `ThemeToggle`: o
|
|
200
|
+
* `IconButton` público não tem cor solta, e dentro do cartão da marca ela não vale (a tinta vence). */
|
|
201
|
+
function BotaoDeIcone({ name, label, appearance = "ghost", tone = "neutral", size = "md", icons, pressed, disabled, corDoIcone, ...rest }) {
|
|
162
202
|
const t = useAureaTokens();
|
|
163
203
|
const s = folha(t);
|
|
164
204
|
const marca = useSobreAMarca();
|
|
165
|
-
const cor = pintarSobreAMarca(pintar(t, tone), marca);
|
|
205
|
+
const cor = pintarSobreAMarca(pintar(t, tone), marca, tone, appearance);
|
|
166
206
|
const corDaBorda = marca?.tinta ?? t.color.border;
|
|
167
207
|
const lado = t.size[ALTURA[size]];
|
|
168
208
|
const caixa = React.useMemo(() => ({
|
|
169
209
|
height: lado, width: lado, paddingHorizontal: 0,
|
|
170
|
-
borderRadius:
|
|
210
|
+
borderRadius: t.size.radiusControl,
|
|
171
211
|
backgroundColor: appearance === "solid" ? cor.solido : "transparent",
|
|
172
|
-
borderColor: appearance === "outline" ? corDaBorda : "transparent",
|
|
173
|
-
}), [t, lado, size, appearance, cor.solido, corDaBorda]);
|
|
212
|
+
borderColor: cor.contorno ?? (appearance === "outline" ? corDaBorda : "transparent"),
|
|
213
|
+
}), [t, lado, size, appearance, cor.solido, cor.contorno, corDaBorda]);
|
|
174
214
|
return (_jsx(Pressable, { disabled: disabled, accessibilityRole: "button", accessibilityLabel: label, accessibilityState: { disabled: !!disabled, ...(pressed === undefined ? null : { checked: pressed }) }, style: ({ pressed: tocando }) => [
|
|
175
|
-
|
|
215
|
+
// Largura FIXA, como o só-ícone do HeroUI (`.button--icon-only`: `w-10`): ele nunca estica,
|
|
216
|
+
// nem numa coluna sem alinhamento. O alvo é o maior entre o desenho e o `targetMin`.
|
|
217
|
+
s.alvo, { width: Math.max(lado, t.size.targetMin), alignItems: "center" },
|
|
176
218
|
tocando && s.pressionado, disabled && s.inerte,
|
|
177
|
-
], ...rest, children: _jsx(View, { style: [s.caixa, caixa], children: _jsx(Icon, { name: name, size: ICONE[size], color: appearance === "solid" ? cor.texto : cor.sobre
|
|
219
|
+
], ...rest, children: _jsx(View, { style: [s.caixa, caixa], children: _jsx(Icon, { name: name, size: ICONE[size], icons: icons, color: corDoIcone && !marca ? corDoIcone : appearance === "solid" ? cor.texto : cor.sobre }) }) }));
|
|
220
|
+
}
|
|
221
|
+
export function ThemeToggle(props) {
|
|
222
|
+
const { theme, toggleTheme } = useAureaTheme();
|
|
223
|
+
const t = useAureaTokens();
|
|
224
|
+
const s = useAureaStrings();
|
|
225
|
+
const escuro = theme === "dark";
|
|
226
|
+
return (_jsx(BotaoDeIcone, { ...props, name: escuro ? "light--filled" : "asleep--filled", label: escuro ? s.themeToLight : s.themeToDark, corDoIcone: escuro ? t.color.primary : t.color.foreground, onPress: toggleTheme }));
|
|
178
227
|
}
|
package/dist/busca.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { type StyleProp, type ViewStyle } from "react-native";
|
|
2
|
+
import { type TextInputProps, type StyleProp, type ViewStyle } from "react-native";
|
|
3
3
|
import { type IconName } from "./icon.js";
|
|
4
4
|
import { type AureaFieldSize } from "./inputs.js";
|
|
5
5
|
/** Uma linha do catálogo. **Mesma forma da web** (`ComboboxOption`), mais o `disabled` que o `Select` daqui já tinha. */
|
|
@@ -59,6 +59,13 @@ export interface ComboboxProps {
|
|
|
59
59
|
chevron?: IconName | false;
|
|
60
60
|
/** O glifo da lupa no campo da folha. Registre-o, ou passe `false`. */
|
|
61
61
|
searchIcon?: IconName | false;
|
|
62
|
+
/**
|
|
63
|
+
* O teclado do campo de busca da folha — E6, 25/09/2026. Para buscar um ANO ou um código, passe
|
|
64
|
+
* `"number-pad"`: sem isto abre o teclado de letras. É o `keyboardType` do `TextInput`, com o
|
|
65
|
+
* mesmo prefixo `search` do `searchPlaceholder` e do `searchIcon`, que também são do campo da
|
|
66
|
+
* folha e não do gatilho. Padrão: o teclado de texto.
|
|
67
|
+
*/
|
|
68
|
+
searchKeyboardType?: TextInputProps["keyboardType"];
|
|
62
69
|
style?: StyleProp<ViewStyle>;
|
|
63
70
|
testID?: string;
|
|
64
71
|
}
|
|
@@ -91,7 +98,7 @@ export interface ComboboxProps {
|
|
|
91
98
|
* na web e pela mesma razão do achado I1 da auditoria: um componente com a sua própria cópia do
|
|
92
99
|
* estado é a segunda fonte de verdade que ninguém sabe que existe.
|
|
93
100
|
*/
|
|
94
|
-
export declare function Combobox({ items, value, onValueChange, onSearchChange, searchDelay, loading, onEndReached, placeholder, searchPlaceholder, empty, clearable, draggable, disabled, size, chevron, searchIcon, style, testID, }: ComboboxProps): React.JSX.Element;
|
|
101
|
+
export declare function Combobox({ items, value, onValueChange, onSearchChange, searchDelay, loading, onEndReached, placeholder, searchPlaceholder, empty, clearable, draggable, disabled, size, chevron, searchIcon, searchKeyboardType, style, testID, }: ComboboxProps): React.JSX.Element;
|
|
95
102
|
export interface SearchFieldProps {
|
|
96
103
|
value?: string;
|
|
97
104
|
onChangeText?: (v: string) => void;
|
package/dist/busca.js
CHANGED
|
@@ -74,6 +74,7 @@ import { Spinner } from "./feedback.js";
|
|
|
74
74
|
import { Icon } from "./icon.js";
|
|
75
75
|
import { KeyboardAvoiding, useCampo } from "./inputs.js";
|
|
76
76
|
import { useReduceMotion } from "./movimento.js";
|
|
77
|
+
import { RecuoDaFolha } from "./screen.js";
|
|
77
78
|
import { Text } from "./text.js";
|
|
78
79
|
import { useAureaStrings, useAureaTokens, ForaDaMarca, usePeleSobreAMarca } from "./theme.js";
|
|
79
80
|
// As mesmas contas do `inputs.tsx`, e elas são repetidas AQUI de propósito: exportá-las de lá
|
|
@@ -130,7 +131,15 @@ const folha = criarFolha((t) => ({
|
|
|
130
131
|
// para abrir. `accessible={false}` no JSX porque o gatilho JÁ anuncia tudo: um segundo botão
|
|
131
132
|
// aqui seria a mesma informação duas vezes. O `Icon` sem rótulo já se esconde sozinho
|
|
132
133
|
// (`icon.tsx:104`), então não sobra nada para o leitor de tela tropeçar.
|
|
133
|
-
|
|
134
|
+
// E8 (25/09/2026): a seta tem a MESMA caixa de toque do X — `targetMin` (44) de altura mínima,
|
|
135
|
+
// conteúdo no meio —, e duas caixas iguais numa fila centralizada têm o mesmo centro, com ou
|
|
136
|
+
// sem o X. Era `height: "100%"`, e a fila `acoes` não tem altura: medido no Yoga 3 (o motor do
|
|
137
|
+
// RN), com a errata de compatibilidade (`Errata.All`) o 100% se resolvia errado — a seta ficava
|
|
138
|
+
// com 25 de altura e o centro dela 5 abaixo do centro do X e do campo, que é o que o app viu no
|
|
139
|
+
// Android. Nos outros modos o defeito some. Com a caixa igual, os três centros coincidem nas 18
|
|
140
|
+
// combinações medidas (3 erratas × campo de 32/36/40 × com e sem X), e o toque da seta sobe de
|
|
141
|
+
// 16 para 44 de altura.
|
|
142
|
+
setaToque: { minHeight: t.size.targetMin, justifyContent: "center" },
|
|
134
143
|
// A folha, com a mesma anatomia da do `Select` (`inputs.tsx:98-113`) — e é de propósito que
|
|
135
144
|
// sejam iguais: são o mesmo gesto, e duas folhas diferentes para o mesmo gesto é como uma
|
|
136
145
|
// biblioteca deixa de ter linguagem.
|
|
@@ -202,7 +211,7 @@ const folha = criarFolha((t) => ({
|
|
|
202
211
|
* na web e pela mesma razão do achado I1 da auditoria: um componente com a sua própria cópia do
|
|
203
212
|
* estado é a segunda fonte de verdade que ninguém sabe que existe.
|
|
204
213
|
*/
|
|
205
|
-
export function Combobox({ items, value, onValueChange, onSearchChange, searchDelay = ESPERA_PADRAO, loading, onEndReached, placeholder, searchPlaceholder, empty, clearable = true, draggable = true, disabled, size, chevron = "chevron--down", searchIcon = "search", style, testID, }) {
|
|
214
|
+
export function Combobox({ items, value, onValueChange, onSearchChange, searchDelay = ESPERA_PADRAO, loading, onEndReached, placeholder, searchPlaceholder, empty, clearable = true, draggable = true, disabled, size, chevron = "chevron--down", searchIcon = "search", searchKeyboardType, style, testID, }) {
|
|
206
215
|
const t = useAureaTokens();
|
|
207
216
|
const s = folha(t);
|
|
208
217
|
const peleDaMarca = usePeleSobreAMarca();
|
|
@@ -297,7 +306,7 @@ export function Combobox({ items, value, onValueChange, onSearchChange, searchDe
|
|
|
297
306
|
peleDaMarca,
|
|
298
307
|
inativo && s.desabilitado,
|
|
299
308
|
style,
|
|
300
|
-
], children: [_jsx(Pressable, { testID: testID, onPress: inativo ? undefined : () => setAberto(true), disabled: inativo, accessibilityRole: "button", accessibilityLabel: campo?.label, accessibilityHint: campo?.hint, accessibilityValue: { text: value?.label }, accessibilityState: { disabled: !!inativo, expanded: aberto }, style: s.gatilho, children: _jsx(Text, { size: tam === "sm" ? "xs" : tam === "lg" ? "base" : "md", tone: value ? "default" : "subtle", numberOfLines: 1, style: { flex: 1, minWidth: 0 }, children: value?.label ?? placeholder ?? "" }) }), _jsxs(View, { style: s.acoes, children: [clearable && value != null && !inativo && (_jsx(IconButton, { name: "close", label: strings.comboboxClear, appearance: "ghost", size: "sm", onPress: () => onValueChange?.(null), testID: testID ? `${testID}-limpar` : undefined })), chevron && (_jsx(Pressable, { accessible: false, disabled: inativo, style: s.setaToque, onPress: inativo ? undefined : () => setAberto(true), testID: testID ? `${testID}-seta` : undefined, children: _jsx(Icon, { name: chevron, size: "sm", color: t.color.subtleForeground }) }))] })] }), _jsx(ForaDaMarca, { children: _jsx(Modal, { visible: aberto, transparent: true, animationType: reduzir !== false ? "none" : "slide", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: fechar, children: _jsxs(KeyboardAvoiding, { style: s.fundoDaLista, children: [_jsx(Pressable, { style: s.fundoDeToque, onPress: fechar, accessible: false, testID: testID ? `${testID}-fundo` : undefined }), _jsxs(Animated.View, { style: [s.lista, { transform: [{ translateY: arrasto }] }], onLayout: (e) => { altura.current = e.nativeEvent.layout.height; },
|
|
309
|
+
], children: [_jsx(Pressable, { testID: testID, onPress: inativo ? undefined : () => setAberto(true), disabled: inativo, accessibilityRole: "button", accessibilityLabel: campo?.label, accessibilityHint: campo?.hint, accessibilityValue: { text: value?.label }, accessibilityState: { disabled: !!inativo, expanded: aberto }, style: s.gatilho, children: _jsx(Text, { size: tam === "sm" ? "xs" : tam === "lg" ? "base" : "md", tone: value ? "default" : "subtle", numberOfLines: 1, style: { flex: 1, minWidth: 0 }, children: value?.label ?? placeholder ?? "" }) }), _jsxs(View, { style: s.acoes, children: [clearable && value != null && !inativo && (_jsx(IconButton, { name: "close", label: strings.comboboxClear, appearance: "ghost", size: "sm", onPress: () => onValueChange?.(null), testID: testID ? `${testID}-limpar` : undefined })), chevron && (_jsx(Pressable, { accessible: false, disabled: inativo, style: s.setaToque, onPress: inativo ? undefined : () => setAberto(true), testID: testID ? `${testID}-seta` : undefined, children: _jsx(Icon, { name: chevron, size: "sm", color: t.color.subtleForeground }) }))] })] }), _jsx(ForaDaMarca, { children: _jsx(Modal, { visible: aberto, transparent: true, animationType: reduzir !== false ? "none" : "slide", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: fechar, children: _jsxs(KeyboardAvoiding, { style: s.fundoDaLista, children: [_jsx(Pressable, { style: s.fundoDeToque, onPress: fechar, accessible: false, testID: testID ? `${testID}-fundo` : undefined }), _jsxs(Animated.View, { style: [s.lista, { transform: [{ translateY: arrasto }] }], onLayout: (e) => { altura.current = e.nativeEvent.layout.height; }, children: [_jsx(View, { style: s.puxadorArea, ...(draggable ? gestos.panHandlers : null), accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", children: _jsx(View, { style: s.puxador }) }), _jsxs(View, { style: [s.grupo, { height: alturaDoTamanho(t, tam) }], ...(draggable ? gestos.panHandlers : null), children: [searchIcon && _jsx(Icon, { name: searchIcon, size: "sm", color: t.color.subtleForeground }), _jsx(TextInput, { testID: testID ? `${testID}-busca` : undefined, value: texto, onChangeText: digitar, placeholder: searchPlaceholder ?? strings.comboboxSearch, placeholderTextColor: t.color.subtleForeground,
|
|
301
310
|
// ⚠ `autoFocus` é o que faz a folha valer a pena: abrir um campo de busca e
|
|
302
311
|
// exigir um segundo toque para o teclado subir é um toque a mais em cada
|
|
303
312
|
// cadastro. O foco entra com a folha; o teclado vem junto.
|
|
@@ -307,7 +316,7 @@ export function Combobox({ items, value, onValueChange, onSearchChange, searchDe
|
|
|
307
316
|
// `returnKeyType="search"` troca o "enter" do teclado pela lupa. É pista de
|
|
308
317
|
// plataforma, não decoração: diz à pessoa que aquele campo é de busca antes de
|
|
309
318
|
// ela digitar a primeira letra.
|
|
310
|
-
returnKeyType: "search", style: [
|
|
319
|
+
returnKeyType: "search", keyboardType: searchKeyboardType, style: [
|
|
311
320
|
s.campoDeTexto,
|
|
312
321
|
{ fontSize: fonteDoTamanho(t, tam), fontFamily: t.font.ui[400],
|
|
313
322
|
color: t.color.foreground },
|
|
@@ -319,7 +328,7 @@ export function Combobox({ items, value, onValueChange, onSearchChange, searchDe
|
|
|
319
328
|
s.opcao,
|
|
320
329
|
item.value === value?.value && s.opcaoEscolhida,
|
|
321
330
|
item.disabled && s.desabilitado,
|
|
322
|
-
], children: _jsx(Text, { size: "md", weight: item.value === value?.value ? 600 : 400, children: item.label }) })) })] })] }) }) })] }));
|
|
331
|
+
], children: _jsx(Text, { size: "md", weight: item.value === value?.value ? 600 : 400, children: item.label }) })) }), _jsx(RecuoDaFolha, { comTeclado: true })] })] }) }) })] }));
|
|
323
332
|
}
|
|
324
333
|
// ── A DOBRA DE ACENTO, e por que ela é sondada em vez de presumida ───────────────────────────
|
|
325
334
|
// Buscar "acucar" tem de achar "açúcar" — num catálogo em português, exigir o acento certo é
|
package/dist/display.d.ts
CHANGED
|
@@ -57,22 +57,6 @@ export interface BadgeProps extends ViewProps {
|
|
|
57
57
|
invisible?: boolean;
|
|
58
58
|
children?: React.ReactNode;
|
|
59
59
|
}
|
|
60
|
-
/**
|
|
61
|
-
* A pílula pequena — rótulo, contagem ou ponto.
|
|
62
|
-
*
|
|
63
|
-
* ⚠ **Ancorado, o número é DECORATIVO para o leitor de tela.** Ele some da árvore, e quem carrega
|
|
64
|
-
* a informação é o rótulo de quem foi decorado. Sem isso o leitor anuncia *"sino, 8"* e a pessoa
|
|
65
|
-
* não sabe o que é o 8 — regra lida em três fontes de acessibilidade em 17/08/2026 e registrada
|
|
66
|
-
* no fonte da web. **Quem usa contagem ancorada escreve o rótulo do alvo**, sempre:
|
|
67
|
-
*
|
|
68
|
-
* <Badge count={8} anchor="top-end">
|
|
69
|
-
* <IconButton name="notification" label="Avisos, 8 não lidos" onPress={abrir} />
|
|
70
|
-
* </Badge>
|
|
71
|
-
*
|
|
72
|
-
* ⚠ **`image`/`imageAlt` da web NÃO atravessaram.** Nenhuma das sete telas do consumidor medido
|
|
73
|
-
* usa selo com miniatura, e prop sem consumidor é superfície pública para manter de graça. Volta
|
|
74
|
-
* quando houver tela que peça.
|
|
75
|
-
*/
|
|
76
60
|
export declare function Badge({ tone, emphasis, size, dot, count, max, showZero, leading, trailing, fit, anchor, badgeContent, invisible, children, style, ...rest }: BadgeProps): React.JSX.Element;
|
|
77
61
|
export type AureaStatusVariant = "neutral" | "online" | "offline" | "busy" | "away" | "success" | "warning" | "danger" | "info";
|
|
78
62
|
export interface StatusProps extends ViewProps {
|
package/dist/display.js
CHANGED
|
@@ -30,18 +30,27 @@ import { Text } from "./text.js";
|
|
|
30
30
|
import { useAureaStrings, useAureaTokens } from "./theme.js";
|
|
31
31
|
const folha = criarFolha((t) => ({
|
|
32
32
|
// ── Badge ──────────────────────────────────────────────────────────────────────────────────
|
|
33
|
-
//
|
|
34
|
-
//
|
|
33
|
+
// 🔴 AS MEDIDAS SÃO AS DO `Chip` DO HeroUI NATIVE (1.0.10, `chip.css`) — ordem do Victor de
|
|
34
|
+
// 25/09/2026: "se o HeroUI já tem, vamos usar as deles". Recheio, letra, linha e vão:
|
|
35
|
+
// sm 8 × 2 · letra 12 · linha 16 md 12 × 4 · letra 14 · linha 20
|
|
36
|
+
// lg 16 × 6 · letra 16 · linha 24 vão 4 entre ponto, texto e adornos
|
|
37
|
+
// Até a 0.10.1 eram `3px 9px` e `gap:6` crus, e o texto saía com entrelinha 1,0: no Android a
|
|
38
|
+
// perna do g e do p era cortada (a mesma causa do E1 no `Button`). A linha do HeroUI é ≥ 1,33 ×
|
|
39
|
+
// a letra, e o IBM Plex precisa de 1,3. O raio continua a cápsula da Aurea (identidade) e a
|
|
40
|
+
// borda continua nossa.
|
|
41
|
+
// ⚠ O `xs` NÃO existe no HeroUI (é o contador sobre ícone): fica a medida nossa, 16 de altura,
|
|
42
|
+
// agora com letra 12 e linha 16 para caber a letra inteira.
|
|
35
43
|
selo: {
|
|
36
|
-
flexDirection: "row", alignItems: "center", justifyContent: "center", gap:
|
|
37
|
-
|
|
44
|
+
flexDirection: "row", alignItems: "center", justifyContent: "center", gap: t.size.space1,
|
|
45
|
+
paddingVertical: t.size.space1, paddingHorizontal: t.size.space3,
|
|
38
46
|
borderWidth: t.size.borderWidth, borderRadius: t.size.radiusControl,
|
|
39
47
|
backgroundColor: t.color.secondary, borderColor: t.color.border,
|
|
40
48
|
},
|
|
41
49
|
selo_xs: { minHeight: t.size.space4, paddingVertical: 0, paddingHorizontal: t.size.space1, borderWidth: 0 },
|
|
42
|
-
selo_sm: {
|
|
50
|
+
selo_sm: { paddingVertical: t.size.space05, paddingHorizontal: t.size.space2 },
|
|
43
51
|
selo_md: {},
|
|
44
|
-
|
|
52
|
+
// 6 de recheio vertical: no HeroUI é `calc(var(--spacing) * 1.5)`, e `--spacing` é o `space1`.
|
|
53
|
+
selo_lg: { paddingVertical: t.size.space1 * 1.5, paddingHorizontal: t.size.space4 },
|
|
45
54
|
ponto: { width: t.size.space2, height: t.size.space2, borderRadius: t.size.radiusFull },
|
|
46
55
|
// `fit="content"` (R-01): o mesmo `alignSelf` que a âncora abaixo já usa para não esticar.
|
|
47
56
|
justo: { alignSelf: "flex-start" },
|
|
@@ -85,6 +94,11 @@ export const formatarContagem = (count, max = 99) => count > max ? `${max}+` : S
|
|
|
85
94
|
* usa selo com miniatura, e prop sem consumidor é superfície pública para manter de graça. Volta
|
|
86
95
|
* quando houver tela que peça.
|
|
87
96
|
*/
|
|
97
|
+
/** A letra e a linha do selo, do `Chip` do HeroUI Native (ver a folha). O token direto, e não o
|
|
98
|
+
* `size` do `Text`, que no telefone sobe um degrau (ADR-0050) — o HeroUI não sobe no chip. */
|
|
99
|
+
const LETRA_DO_SELO = (t, size) => size === "lg" ? { fontSize: t.size.textBase, lineHeight: t.size.space6 }
|
|
100
|
+
: size === "md" ? { fontSize: t.size.textSm, lineHeight: t.size.space5 }
|
|
101
|
+
: { fontSize: t.size.textXs, lineHeight: t.size.space4 };
|
|
88
102
|
export function Badge({ tone = "neutral", emphasis = "soft", size = "md", dot, count, max = 99, showZero, leading, trailing, fit = "auto", anchor, badgeContent, invisible, children, style, ...rest }) {
|
|
89
103
|
const t = useAureaTokens();
|
|
90
104
|
const s = folha(t);
|
|
@@ -123,7 +137,7 @@ export function Badge({ tone = "neutral", emphasis = "soft", size = "md", dot, c
|
|
|
123
137
|
style,
|
|
124
138
|
], ...(anchor ? { accessibilityElementsHidden: true,
|
|
125
139
|
importantForAccessibility: "no-hide-descendants" } : rest), children: [dot && !soPonto && _jsx(View, { style: [s.ponto, { backgroundColor: corDoTexto }] }), !soPonto && leading, typeof miolo === "string" || typeof miolo === "number"
|
|
126
|
-
? _jsx(Text, {
|
|
140
|
+
? _jsx(Text, { weight: 500, style: [LETRA_DO_SELO(t, size), { color: corDoTexto }], children: miolo })
|
|
127
141
|
: miolo, !soPonto && trailing] }));
|
|
128
142
|
if (!anchor)
|
|
129
143
|
return selo;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/** Os 2571 nomes do Carbon que a Aurea desenha, os mesmos na web e no nativo. */
|
|
2
|
+
export type CarbonIconName = "4K--filled" | "4K" | "AI-enabled-EDT" | "AI-enabled-PDLC" | "AI" | "API--1" | "ASM" | "BPMN-compensation--fill" | "BPMN-compensation--outline" | "BPMN-conditional--fill" | "BPMN-conditional--outline" | "BPMN-error--fill" | "BPMN-error--outline" | "BPMN-escalation--fill" | "BPMN-escalation--outline" | "BPMN-link--fill" | "BPMN-link--outline" | "C" | "CAD" | "CBL" | "CDA" | "CPlusPlus" | "CSV" | "DOC" | "DVR" | "Db2-Developer-Extension" | "GIF" | "HD--filled" | "HD" | "HDR" | "HTML--reference" | "HTML" | "HTTP" | "IP" | "ISO--filled" | "ISO--outline" | "ISO" | "JAVA" | "JCL" | "JPG" | "JSON--reference" | "JSON" | "KEY" | "MAC" | "MOV" | "MP3" | "MP4" | "MPEG" | "MPG2" | "PDF--reference" | "PDF" | "PLI" | "PNG" | "PPT" | "RAG" | "RAW" | "REXX" | "SAP" | "SDK" | "SLM" | "SQL" | "SVG" | "Serverless-Fleet" | "TIF" | "TSV" | "TXT--reference" | "TXT" | "URL" | "USB" | "VPN" | "WMV" | "XLS" | "XML" | "ZIP--reference" | "ZIP" | "accept-action--usage" | "accessibility--alt" | "accessibility--color--filled" | "accessibility--color" | "accessibility" | "account" | "accumulation--ice" | "accumulation--precipitation" | "accumulation--rain" | "accumulation--snow" | "action--definition" | "action--usage" | "activity" | "adapter-notification" | "add--alt" | "add--child-node" | "add--filled" | "add--large" | "add--parent-node" | "add--server" | "add-comment" | "add" | "agent-detached" | "aggregator--count-rows" | "aggregator--recalculation" | "agriculture-analytics" | "ai--observability" | "ai-agent-invocation" | "ai-business-impact-assessment" | "ai-financial-sustainability-check" | "ai-generate" | "ai-governance--lifecycle" | "ai-governance--tracked" | "ai-governance--untracked" | "ai-label" | "ai-launch" | "ai-recommend" | "airline--digital-gate" | "airline--manage-gates" | "airline--passenger-care" | "airline--rapid-board" | "airplay--filled" | "airplay" | "airport--01" | "airport--02" | "airport-location" | "alarm--add" | "alarm--subtract" | "alarm" | "align--horizontal-center" | "align--horizontal-left" | "align--horizontal-right" | "align--vertical-bottom" | "align--vertical-center" | "align--vertical-top" | "align-box--bottom-center" | "align-box--bottom-left" | "align-box--bottom-right" | "align-box--middle-center" | "align-box--middle-left" | "align-box--middle-right" | "align-box--top-center" | "align-box--top-left" | "align-box--top-right" | "analytics--custom" | "analytics--reference" | "analytics" | "anchor" | "aperture" | "api--key" | "api" | "app-connectivity" | "app" | "apple--dash" | "apple" | "application--mobile" | "application--virtual" | "application--web" | "application" | "apps" | "archive" | "area--custom" | "area-range--dashed" | "area-range--solid" | "area" | "arithmetic-mean" | "arithmetic-median" | "arrange--horizontal" | "arrange--vertical" | "arrange" | "array--booleans" | "array--date-time" | "array--dates" | "array--numbers" | "array--objects" | "array--strings" | "array--time" | "array-decimal" | "array-files" | "array-users" | "array" | "arrival" | "arrow--down-left" | "arrow--down-right" | "arrow--down" | "arrow--left" | "arrow--right" | "arrow--up-left" | "arrow--up-right" | "arrow--up" | "arrow-shift-down" | "arrows--horizontal" | "arrows--vertical" | "asleep--filled" | "asleep" | "assembly--cluster" | "assembly--reference" | "assembly" | "asset--confirm" | "asset--digital-twin" | "asset--view" | "asset-movement" | "asset" | "assignment-action--usage" | "asterisk" | "async" | "at" | "attachment" | "attribute--definition" | "attribute--usage" | "audio-console" | "augmented-reality" | "automatic" | "autoscaling" | "avro" | "awake" | "badge" | "baggage-claim" | "bank--vault" | "bar" | "barcode" | "bare-metal-server--01" | "bare-metal-server--02" | "bare-metal-server" | "base-document-set" | "basketball" | "bastion-host" | "bat" | "batch-job--step" | "batch-job" | "battery--charging" | "battery--empty" | "battery--error" | "battery--full" | "battery--half" | "battery--low" | "battery--quarter" | "battery--warning" | "bee-bat" | "bee" | "beta" | "bicycle" | "binding--01" | "binding--02" | "binoculars" | "bland-altman-plot" | "block-storage--alt" | "block-storage" | "blockchain" | "blog" | "bluetooth--off" | "bluetooth" | "book" | "bookmark--add" | "bookmark--filled" | "bookmark" | "boolean" | "boot-volume--alt" | "boot-volume" | "boot" | "border--bottom" | "border--full" | "border--left" | "border--none" | "border--right" | "border--top" | "bot" | "bottles--01--dash" | "bottles--01" | "bottles--02--dash" | "bottles--02" | "bottles--container" | "bottom-panel--close--filled" | "bottom-panel--close" | "bottom-panel--open--filled" | "bottom-panel--open" | "box--extra-large" | "box--large" | "box--medium" | "box--small" | "box-plot" | "box" | "brainstorm--filled" | "brainstorm" | "branch" | "breaking-change" | "brightness-contrast" | "bring-forward" | "bring-to-front" | "bsam-qsam-zedc" | "build--image" | "build--run" | "build-tool" | "building--electrical" | "building--insights-1" | "building--insights-2" | "building--insights-3" | "building" | "bullhorn" | "buoy" | "bus" | "business-metrics" | "business-processes" | "button--centered" | "button--flush-left" | "cabin-care--alert" | "cabin-care--alt" | "cabin-care" | "cafe" | "calculation--alt" | "calculation" | "calculator--check" | "calculator" | "calendar--add--alt" | "calendar--add" | "calendar--heat-map" | "calendar--settings" | "calendar--tools" | "calendar" | "calibrate" | "calls--all" | "calls--incoming" | "calls" | "camera--action" | "camera" | "campsite" | "car--front" | "car" | "carbon--ui-builder" | "carbon-accounting" | "carbon-for-AEM" | "carbon-for-ibm-dotcom" | "carbon-for-ibm-product" | "carbon-for-mobile" | "carbon-for-salesforce" | "carbon" | "caret--down" | "caret--left" | "caret--right" | "caret--sort--down" | "caret--sort--up" | "caret--sort" | "caret--up" | "carousel--horizontal" | "carousel--vertical" | "catalog--publish" | "catalog" | "categorical-palette" | "categories" | "category--add" | "category--and" | "category--new-each" | "category--new" | "category" | "cell-tower" | "center--circle" | "center--square" | "center-to-fit" | "certificate--check" | "certificate" | "change--catalog" | "change--circle" | "channels" | "character--decimal" | "character--fraction" | "character--integer" | "character--lower-case" | "character--negative-number" | "character--sentence-case" | "character--upper-case" | "character--whole-number" | "character-patterns" | "charging-station--filled" | "charging-station" | "chart--3D" | "chart--area-smooth" | "chart--area-stepper" | "chart--area" | "chart--average" | "chart--bar-floating" | "chart--bar-overlay" | "chart--bar-stacked" | "chart--bar-target" | "chart--bar" | "chart--bubble-packed" | "chart--bubble" | "chart--bullet" | "chart--candlestick" | "chart--cluster-bar" | "chart--column-floating" | "chart--column-target" | "chart--column" | "chart--combo-stacked" | "chart--combo" | "chart--custom" | "chart--donut" | "chart--dual-y-axis" | "chart--error-bar--alt" | "chart--error-bar" | "chart--evaluation" | "chart--high-low" | "chart--histogram" | "chart--line--data" | "chart--line-smooth" | "chart--line" | "chart--logistic-regression" | "chart--lollipop" | "chart--marimekko" | "chart--maximum" | "chart--median" | "chart--minimum" | "chart--multi-line" | "chart--multitype" | "chart--network" | "chart--parallel" | "chart--performance" | "chart--pie" | "chart--planning-waterfall" | "chart--point" | "chart--population" | "chart--radar" | "chart--radial" | "chart--relationship" | "chart--ring" | "chart--river" | "chart--rose" | "chart--scatter" | "chart--spiral" | "chart--stacked" | "chart--stepper" | "chart--sunburst" | "chart--t-sne" | "chart--treemap" | "chart--venn-diagram" | "chart--violin-plot" | "chart--waterfall" | "chart--win-loss" | "chat--launch" | "chat--off" | "chat--operational" | "chat-bot" | "chat" | "checkbox--checked--filled" | "checkbox--checked" | "checkbox--indeterminate--filled" | "checkbox--indeterminate" | "checkbox" | "checkmark--filled--error" | "checkmark--filled--warning" | "checkmark--filled" | "checkmark--outline--error" | "checkmark--outline--warning" | "checkmark--outline" | "checkmark" | "chemistry--reference" | "chemistry" | "chevron--down--outline" | "chevron--down" | "chevron--left" | "chevron--mini" | "chevron--right" | "chevron--sort--down" | "chevron--sort--up" | "chevron--sort" | "chevron--up--outline" | "chevron--up" | "child-node" | "chip" | "choices" | "choose-item" | "choropleth-map" | "cics--cmas" | "cics--db2-connection" | "cics--explorer" | "cics--program" | "cics--sit-overrides" | "cics--sit" | "cics--system-group" | "cics--transaction-server-zos" | "cics--wui-region" | "cics-region--alt" | "cics-region--routing" | "cics-region--target" | "cics-region" | "cicsplex" | "circle--filled" | "circle--outline" | "circle--solid" | "circle-dash" | "circle-packing" | "classic-batch" | "classification" | "classifier--language" | "clean" | "close--filled" | "close--large" | "close--outline" | "close" | "closed-caption--alt" | "closed-caption--filled" | "closed-caption" | "cloud--alerting" | "cloud--auditing" | "cloud--data-ops" | "cloud--download" | "cloud--infra-migration" | "cloud--logging" | "cloud--monitoring" | "cloud--offline" | "cloud--service-management" | "cloud--upload" | "cloud-app" | "cloud-ceiling" | "cloud-foundry--1" | "cloud-foundry--2" | "cloud-registry" | "cloud-satellite--config" | "cloud-satellite--link" | "cloud-satellite--services" | "cloud-satellite" | "cloud-services" | "cloud" | "cloudy" | "cobol-upgrade-advisor" | "code--hide" | "code--reference" | "code-block" | "code-signing-service" | "code" | "cognitive" | "collaborate" | "collapse--stripe" | "collapse--title-2" | "collapse--title" | "collapse-all" | "collapse-categories" | "color-palette" | "color-picker" | "color-switch" | "column--delete" | "column--insert" | "column-dependency" | "column" | "comments" | "commit-alt" | "commit" | "communication--unified" | "compare" | "compass" | "concept" | "condition--point" | "condition--wait-point" | "connect--recursive" | "connect--reference" | "connect--source" | "connect--target" | "connect" | "connection--receive" | "connection--send" | "connection--signal--alt" | "connection--two-way" | "connection--usage" | "connection-flow--usage" | "connection-signal--off" | "connection-signal" | "connection" | "constraint" | "construction" | "container--engine" | "container--image" | "container--runtime-monitor" | "container--runtime" | "container-image--pull" | "container-image--push-pull" | "container-image--push" | "container-registry" | "container-services" | "container-software" | "content-delivery-network" | "content-view" | "continue--filled" | "continue" | "continuous-deployment" | "continuous-integration" | "contrast" | "convert-to-cloud" | "cookie" | "copy--file" | "copy--link" | "copy--to-clipboard" | "copy" | "corn" | "corner" | "coronavirus" | "cost--total" | "cost" | "cough" | "coupling-facility-encryption" | "coupling-facility" | "course" | "covariate" | "create-link" | "credentials" | "crop-growth" | "crop-health" | "crop" | "cross-tab" | "crossroads" | "crowd-report--filled" | "crowd-report" | "cube-view" | "cube" | "currency--baht" | "currency--dollar" | "currency--euro" | "currency--lira" | "currency--pound" | "currency--ruble" | "currency--rupee" | "currency--shekel" | "currency--won" | "currency--yen" | "currency" | "cursor--1" | "cursor--2" | "curved-line--dashed" | "curved-line--solid" | "customer-service--filled" | "customer-service" | "customer" | "cut-out" | "cut" | "cyclist" | "dashboard--reference" | "dashboard" | "data--1" | "data--2" | "data--add" | "data--alert" | "data--base--alt" | "data--base" | "data--categorical" | "data--center" | "data--check" | "data--connected" | "data--error" | "data--format" | "data--reference" | "data--regular" | "data--set" | "data--structured" | "data--unreal" | "data--unstructured" | "data--view--alt" | "data--view" | "data-accessor" | "data-analytics" | "data-backup" | "data-bin" | "data-blob" | "data-class" | "data-collection" | "data-definition" | "data-dictionary" | "data-diode" | "data-enrichment--add" | "data-enrichment" | "data-glossary" | "data-player" | "data-quality-definition" | "data-refinery--reference" | "data-refinery" | "data-set-encryption" | "data-share" | "data-table--reference" | "data-table" | "data-vis--1" | "data-vis--2" | "data-vis--3" | "data-vis--4" | "data-volume--alt" | "data-volume" | "database--datastax" | "database--elastic" | "database--enterprise-db2" | "database--enterprisedb" | "database--etcd" | "database--messaging" | "database--mongodb" | "database--postgreSQL" | "database--rabbit" | "database--redis" | "datastore" | "db2--buffer-pool" | "db2--data-sharing-group" | "db2--database" | "debug" | "decision-node" | "decision-tree" | "decline" | "delay" | "delete" | "delivery--add" | "delivery--parcel" | "delivery--time" | "delivery-settings" | "delivery-truck" | "delivery" | "demo" | "departure" | "dependency" | "deploy-rules" | "deploy" | "deployment-canary" | "deployment-pattern" | "deployment-policy" | "deployment-unit--data" | "deployment-unit--execution" | "deployment-unit--installation" | "deployment-unit--presentation" | "deployment-unit--technical--data" | "deployment-unit--technical--execution" | "deployment-unit--technical--installation" | "deployment-unit--technical--presentation" | "desk--adjustable" | "development" | "devices--apps" | "devices" | "dew-point--filled" | "dew-point" | "dfsort-ibm-z-sort" | "diagram--reference" | "diagram" | "diamond--outline" | "diamond--solid" | "digital--identity" | "direct-link" | "direction--bear-right--01--filled" | "direction--bear-right--01" | "direction--bear-right--02--filled" | "direction--bear-right--02" | "direction--curve--filled" | "direction--curve" | "direction--fork--filled" | "direction--fork" | "direction--loop-left--filled" | "direction--loop-left" | "direction--loop-right--filled" | "direction--loop-right" | "direction--merge--filled" | "direction--merge" | "direction--right--01--filled" | "direction--right--01" | "direction--right--02--filled" | "direction--right--02" | "direction--rotary--first-right--filled" | "direction--rotary--first-right" | "direction--rotary--right--filled" | "direction--rotary--right" | "direction--rotary--straight--filled" | "direction--rotary--straight" | "direction--sharp-turn--filled" | "direction--sharp-turn" | "direction--straight--filled" | "direction--straight--right--filled" | "direction--straight--right" | "direction--straight" | "direction--u-turn--filled" | "direction--u-turn" | "directory-domain" | "disable-step" | "distribute--horizontal-center" | "distribute--horizontal-left" | "distribute--horizontal-right" | "distribute--vertical-bottom" | "distribute--vertical-center" | "distribute--vertical-top" | "dns-services" | "document--add" | "document--attachment" | "document--audio" | "document--blank" | "document--comment" | "document--configuration" | "document--download" | "document--epdf" | "document--export" | "document--horizontal" | "document--import" | "document--multiple-01" | "document--multiple-02" | "document--pdf" | "document--preliminary" | "document--processor" | "document--protected" | "document--requirements" | "document--security" | "document--signed" | "document--sketch" | "document--subject" | "document--subtract" | "document--tasks" | "document--unknown" | "document--unprotected" | "document--vertical" | "document--video" | "document--view" | "document--word-processor--reference" | "document--word-processor" | "document-sentiment" | "document-set" | "document" | "documentation" | "dog-walker" | "dot-mark" | "double-axis-chart--bar" | "double-axis-chart--column" | "double-chevron--left" | "double-chevron--right" | "double-integer" | "down-to-bottom" | "download" | "downstream" | "drag--horizontal" | "drag--vertical" | "draggable" | "draw" | "drill-back" | "drill-down" | "drill-through" | "drink--01" | "drink--02" | "driver-analysis" | "drone--delivery" | "drone--front" | "drone--video" | "drone" | "drop-photo--filled" | "drop-photo" | "drought" | "earth--americas--filled" | "earth--americas" | "earth--europe-africa--filled" | "earth--europe-africa" | "earth--filled" | "earth--southeast-asia--filled" | "earth--southeast-asia" | "earth" | "earthquake" | "edge-cluster" | "edge-device" | "edge-node--alt" | "edge-node" | "edge-service" | "edit--off" | "edit" | "edt-loop" | "education" | "element-picker" | "email--new" | "email--user" | "email" | "emissions-management" | "emissions" | "enable-step" | "encryption" | "energy--renewable" | "energy--report" | "energy--waste" | "enterprise" | "enumeration--definition" | "enumeration--usage" | "equal--approximately" | "equalizer" | "erase" | "error--filled" | "error--outline" | "error" | "event--change" | "event--incident" | "event--number" | "event--schedule" | "event--warning" | "event" | "events--alt" | "events" | "exam-mode" | "executable-program" | "execution-history" | "exit" | "expand-all" | "expand-categories" | "expand-screen--filled" | "expand-screen" | "explore" | "export" | "extensions" | "eyedropper" | "face--activated--add" | "face--activated--filled" | "face--activated" | "face--add" | "face--cool" | "face--dissatisfied--filled" | "face--dissatisfied" | "face--dizzy--filled" | "face--dizzy" | "face--mask" | "face--neutral--filled" | "face--neutral" | "face--pending--filled" | "face--pending" | "face--satisfied--filled" | "face--satisfied" | "face--wink--filled" | "face--wink" | "facility--group--alternate" | "facility--group" | "factor" | "fade" | "favorite--filled" | "favorite--half" | "favorite" | "feature-membership--filled" | "feature-membership" | "feature-picker" | "feature-typing" | "feedback-documentation" | "fetch-upload--cloud" | "fetch-upload" | "file--change" | "file--diff" | "file--storage" | "file--x" | "filter--edit" | "filter--remove" | "filter--reset" | "filter" | "finance" | "financial-assets" | "fingerprint-recognition" | "fire--fill" | "fire" | "firewall--classic" | "firewall" | "fish--multiple" | "fish" | "fit-to-height" | "fit-to-screen" | "fit-to-width" | "flag--filled" | "flag" | "flagging-taxi" | "flash--filled" | "flash--off--filled" | "flash--off" | "flash" | "flight--international" | "flight--roster" | "flight--schedule" | "floating-ip" | "flood--warning" | "flood" | "floorplan" | "flow--connection" | "flow--data" | "flow--modeler--reference" | "flow--modeler" | "flow--sequence" | "flow--stream--reference" | "flow--stream" | "flow-logs-vpc" | "flow" | "fog" | "folder--add" | "folder--details--reference" | "folder--details" | "folder--move-to" | "folder--off" | "folder--open" | "folder--parent" | "folder--shared" | "folder--tree" | "folder" | "folders" | "follow-up-work-order" | "for-loop" | "forecast--hail-30" | "forecast--hail" | "forecast--lightning-30" | "forecast--lightning" | "fork-node" | "fork" | "forum" | "forward--10" | "forward--30" | "forward--5" | "fragile" | "fragments" | "friendship" | "fruit-bowl" | "fuel-can" | "function--2" | "function-math" | "function" | "funnel--sequence" | "funnel--sort" | "game--console" | "game--wireless" | "gamification" | "gas-station--diesel" | "gas-station--eco" | "gas-station--filled" | "gas-station" | "gateway--api" | "gateway--mail" | "gateway--public" | "gateway--security" | "gateway--user-access" | "gateway--vpn" | "gateway" | "gears" | "gem--reference" | "gem" | "gender--female" | "gender--male" | "generate--pdf" | "gift" | "git--repo" | "global-filters" | "global-loan-and-trial" | "globe--private" | "globe" | "gradient" | "graph-aggregator" | "graphical-data-flow" | "grid" | "group--access" | "group--account" | "group--presentation" | "group--resource" | "group--security" | "group-objects--new" | "group-objects--save" | "group-objects" | "group" | "growth" | "gui--management" | "gui" | "hail" | "harbor" | "hardware-security-module" | "hashtag" | "haze--night" | "haze" | "heading" | "headphones" | "headset" | "health-cross" | "hearing" | "heat-map--02" | "heat-map--03" | "heat-map--stocks" | "heat-map" | "helicopter" | "helmet" | "help--filled" | "help-desk" | "help" | "hexagon--outline" | "hexagon--solid" | "hexagon--vertical--outline" | "hexagon--vertical--solid" | "history" | "home" | "horizontal-line--dashed" | "horizontal-line--solid" | "horizontal-view" | "hospital-bed" | "hospital" | "hotel" | "hourglass" | "humidity--alt" | "humidity" | "hurricane" | "hybrid-networking--alt" | "hybrid-networking" | "ibm--ai-on-z" | "ibm--aiops-insights" | "ibm--api-connect" | "ibm--app-connect-enterprise" | "ibm--application-and-discovery-delivery-intelligence" | "ibm--aspera" | "ibm--cloudant" | "ibm--content-cortex-repository" | "ibm--data-power" | "ibm--data-product-exchange" | "ibm--data-replication" | "ibm--databand" | "ibm--datastage" | "ibm--db2--alt" | "ibm--db2-warehouse" | "ibm--db2" | "ibm--deployable-architecture" | "ibm--devops-test" | "ibm--dynamic-route-server" | "ibm--elo--automotive-compliance" | "ibm--elo--engineering-insights" | "ibm--elo--method-composer" | "ibm--elo--publishing" | "ibm--engineering-lifecycle-mgmt" | "ibm--engineering-requirements-doors-next" | "ibm--engineering-systems-design-rhapsody-model-manager" | "ibm--engineering-systems-design-rhapsody-sn1" | "ibm--engineering-systems-design-rhapsody-sn2" | "ibm--engineering-systems-design-rhapsody" | "ibm--engineering-test-mgmt" | "ibm--engineering-workflow-mgmt" | "ibm--event-automation" | "ibm--event-endpoint-mgmt" | "ibm--event-processing" | "ibm--event-streams" | "ibm--gcm" | "ibm--global-storage-architecture" | "ibm--granite" | "ibm--ibv" | "ibm--instana" | "ibm--jrs" | "ibm--knowledge-catalog-premium" | "ibm--knowledge-catalog-standard" | "ibm--knowledge-catalog" | "ibm--launchpad-s4" | "ibm--lpa" | "ibm--lqe" | "ibm--machine-learning-for-zos" | "ibm--match-360" | "ibm--maximo-application-suite" | "ibm--mq" | "ibm--open-enterprise-languages" | "ibm--openshift-container-platform-on-vpc-for-regulated-industries" | "ibm--planning-analytics" | "ibm--power-vs-private-cloud" | "ibm--power-vs" | "ibm--power-with-vpc" | "ibm--private-path-services" | "ibm--process-mining" | "ibm--saas-console" | "ibm--sap-on-power" | "ibm--secure-infrastructure-on-vpc-for-regulated-industries" | "ibm--streamsets" | "ibm--telehealth" | "ibm--test-accelerator-for-z" | "ibm--toolchain" | "ibm--turbonomic" | "ibm--unstructured-data-processor" | "ibm--vpn-for-vpc" | "ibm--vsi-on-vpc-for-regulated-industries" | "ibm--wazi-deploy" | "ibm--webmethods-api-gateway" | "ibm--webmethods-api-studio" | "ibm--webmethods-b2b-integration" | "ibm--webmethods-developer-portal" | "ibm--webmethods-hybrid-integration" | "ibm--webmethods-integration-server" | "ibm--webmethods-integration" | "ibm--webmethods-managed-file-transfer" | "ibm-cloud--HSM" | "ibm-cloud--app-id" | "ibm-cloud--backup-and-recovery" | "ibm-cloud--backup-service-vpc" | "ibm-cloud--bare-metal-server" | "ibm-cloud--bare-metal-servers-vpc" | "ibm-cloud--citrix-daas" | "ibm-cloud--code-engine" | "ibm-cloud--continuous-delivery" | "ibm-cloud--databases" | "ibm-cloud--dedicated-host" | "ibm-cloud--direct-link-1--connect" | "ibm-cloud--direct-link-1--dedicated-hosting" | "ibm-cloud--direct-link-1--dedicated" | "ibm-cloud--direct-link-1--exchange" | "ibm-cloud--direct-link-2--connect" | "ibm-cloud--direct-link-2--dedicated-hosting" | "ibm-cloud--direct-link-2--dedicated" | "ibm-cloud--essential-security-and-observability-services" | "ibm-cloud--event-notification" | "ibm-cloud--event-streams" | "ibm-cloud--for-education" | "ibm-cloud--gate-keeper" | "ibm-cloud--hpc" | "ibm-cloud--hyper-protect-crypto-services" | "ibm-cloud--hyper-protect-dbaas" | "ibm-cloud--hyper-protect-vs" | "ibm-cloud--internet-services" | "ibm-cloud--ipsec-vpn" | "ibm-cloud--key-protect" | "ibm-cloud--kubernetes-service" | "ibm-cloud--logging" | "ibm-cloud--mass-data-migration" | "ibm-cloud--observability" | "ibm-cloud--pal" | "ibm-cloud--privileged-access-gateway" | "ibm-cloud--projects" | "ibm-cloud--resiliency" | "ibm-cloud--secrets-manager" | "ibm-cloud--security-compliance-center-workload-protection" | "ibm-cloud--security-compliance-center" | "ibm-cloud--security-groups" | "ibm-cloud--security" | "ibm-cloud--subnets" | "ibm-cloud--sysdig-secure" | "ibm-cloud--transit-gateway" | "ibm-cloud--virtual-server-classic" | "ibm-cloud--virtual-server-vpc" | "ibm-cloud--vpc-block-storage-snapshots" | "ibm-cloud--vpc-client-vpn" | "ibm-cloud--vpc-endpoints" | "ibm-cloud--vpc-file-storage" | "ibm-cloud--vpc-images" | "ibm-cloud--vpc" | "ibm-cloud-pak--MANTA-automated-data-lineage" | "ibm-cloud-pak--applications" | "ibm-cloud-pak--business-automation" | "ibm-cloud-pak--data" | "ibm-cloud-pak--integration" | "ibm-cloud-pak--multicloud-mgmt" | "ibm-cloud-pak--netezza" | "ibm-cloud-pak--network-automation" | "ibm-cloud-pak--security" | "ibm-cloud-pak--system" | "ibm-cloud-pak--watson-aiops" | "ibm-cloud" | "ibm-consulting-advantage--agent" | "ibm-consulting-advantage--application" | "ibm-consulting-advantage--assistant" | "ibm-devops--control" | "ibm-federated-api-management" | "ibm-hybrid-control-plane" | "ibm-partner-plus" | "ibm-quantum--safe-advisor" | "ibm-quantum--safe-explorer" | "ibm-quantum--safe-remediator" | "ibm-security--services" | "ibm-security" | "ibm-software--watsonx--data--analyze-and-process" | "ibm-software--watsonx--data--structured--enrichment" | "ibm-software--watsonx--data--structured--import" | "ibm-software--watsonx--data--unstructured--enrichment" | "ibm-software--watsonx--data--unstructured--import" | "ibm-software--watsonx--document--library" | "ibm-watson--assistant" | "ibm-watson--discovery" | "ibm-watson--knowledge-catalog" | "ibm-watson--knowledge-studio" | "ibm-watson--language-translator" | "ibm-watson--machine-learning" | "ibm-watson--natural-language-classifier" | "ibm-watson--natural-language-understanding" | "ibm-watson--openscale" | "ibm-watson--orders" | "ibm-watson--query" | "ibm-watson--speech-to-text" | "ibm-watson--studio" | "ibm-watson--text-to-speech" | "ibm-watson--tone-analyzer" | "ibm-watsonx--assistant" | "ibm-watsonx--code-assistant-for-enterprise-java-applications" | "ibm-watsonx--code-assistant-for-z--refactor" | "ibm-watsonx--code-assistant-for-z-understand" | "ibm-watsonx--code-assistant-for-z-validation-assistant" | "ibm-watsonx--code-assistant-for-z" | "ibm-watsonx--code-assistant" | "ibm-watsonx--orchestrate" | "ibm-z--cloud-mod-stack" | "ibm-z--environments-dev-sec-ops" | "ibm-z--open-editor" | "ibm-z--processor-capacity-reference" | "ibm-z-cloud--provisioning" | "ibm-z-os--ai-control-interface" | "ibm-z-os--containers" | "ibm-z-os--package-manager" | "ibm-z-os" | "ice--accretion" | "ice--vision" | "id-management" | "idea" | "identification" | "if--action" | "if--else" | "image--copy" | "image--medical" | "image--reference" | "image--search--alt" | "image--search" | "image-service" | "image-store--local" | "image" | "import-export" | "important" | "improve-relevance" | "in-progress--error" | "in-progress--warning" | "in-progress" | "incident-reporter" | "incomplete--cancel" | "incomplete--error" | "incomplete--warning" | "incomplete" | "increase-level" | "industry" | "infinity-symbol" | "information--disabled" | "information--filled" | "information--square--filled" | "information--square" | "information" | "infrastructure--classic" | "insert--page" | "insert-syntax" | "insert" | "inspection" | "instance--bx" | "instance--classic" | "instance--cx" | "instance--mx" | "instance--virtual" | "integration" | "intent-request--active" | "intent-request--create" | "intent-request--heal" | "intent-request--inactive" | "intent-request--scale-in" | "intent-request--scale-out" | "intent-request--uninstall" | "intent-request--upgrade" | "interactions" | "interface--definition--alt" | "interface--definition" | "interface--usage--1" | "interface--usage--alt" | "interface--usage" | "intersect" | "intrusion-prevention" | "inventory-management" | "iot--connect" | "iot--platform" | "item--definition" | "item--usage" | "job--daemon" | "job--run" | "join--full" | "join--inner--alt" | "join--inner" | "join--left-outer" | "join--left" | "join--outer" | "join--right-outer" | "join--right" | "join-node" | "js-error" | "jump-link" | "keep-dry" | "key--values" | "keyboard--off" | "keyboard" | "keychain" | "kiosk-device" | "kubelet" | "kubernetes--control-plane-node" | "kubernetes--ip-address" | "kubernetes--operator" | "kubernetes--pod" | "kubernetes--worker-node" | "kubernetes" | "label" | "language" | "laptop" | "lasso--polygon" | "lasso" | "launch" | "layers--external" | "layers" | "legend" | "letter--Aa" | "letter--Bb" | "letter--Cc" | "letter--Dd" | "letter--Ee" | "letter--Ff" | "letter--Gg" | "letter--Hh" | "letter--Ii" | "letter--Jj" | "letter--Kk" | "letter--Ll" | "letter--Mm" | "letter--Nn" | "letter--Oo" | "letter--Pp" | "letter--Qq" | "letter--Rr" | "letter--Ss" | "letter--Tt" | "letter--Uu" | "letter--Vv" | "letter--Ww" | "letter--Xx" | "letter--Yy" | "letter--Zz" | "license--draft" | "license--global" | "license--maintenance-draft" | "license--maintenance" | "license--third-party-draft" | "license--third-party" | "license" | "lifesaver" | "light--filled" | "light" | "lightning" | "line--thick" | "line--thin" | "link" | "linux--alt" | "linux--namespace" | "linux" | "list--boxes" | "list--bulleted" | "list--checked--mirror" | "list--checked" | "list--dropdown" | "list--numbered--mirror" | "list--numbered" | "list-tree" | "list" | "load-balancer--application" | "load-balancer--classic" | "load-balancer--global" | "load-balancer--listener" | "load-balancer--local" | "load-balancer--network" | "load-balancer--pool" | "load-balancer--vpc" | "location--company--filled" | "location--company" | "location--current" | "location--filled" | "location--group" | "location--hazard--filled" | "location--hazard" | "location--heart--filled" | "location--heart" | "location--info--filled" | "location--info" | "location--person--filled" | "location--person" | "location--save" | "location--star--filled" | "location--star" | "location--supplier" | "location" | "locked-and-blocked" | "locked" | "logical-partition" | "login" | "logo--angular" | "logo--ansible-community" | "logo--bluesky" | "logo--digg" | "logo--discord" | "logo--facebook" | "logo--figma" | "logo--flickr" | "logo--git" | "logo--github" | "logo--gitlab" | "logo--glassdoor" | "logo--instagram" | "logo--invision" | "logo--jupyter" | "logo--keybase" | "logo--kubernetes" | "logo--linkedin" | "logo--livestream" | "logo--mastodon" | "logo--medium" | "logo--model-context-protocol" | "logo--npm" | "logo--openshift" | "logo--pinterest" | "logo--python" | "logo--quora" | "logo--r-script" | "logo--react" | "logo--red-hat-ai-instructlab-on-ibm-cloud" | "logo--red-hat-ansible" | "logo--sketch" | "logo--skype" | "logo--slack" | "logo--snapchat" | "logo--svelte" | "logo--tumblr" | "logo--twitter" | "logo--vmware--alt" | "logo--vmware" | "logo--vue" | "logo--wechat" | "logo--x" | "logo--xing" | "logo--yelp" | "logo--youtube" | "logout" | "loop--alt" | "loop" | "mac--command" | "mac--option" | "mac--shift" | "machine-learning-model" | "machine-learning" | "magic-wand--filled" | "magic-wand" | "mail--all" | "mail--reply" | "manage-protection" | "managed-solutions" | "map--center" | "map--identify" | "map-boundary--vegetation" | "map-boundary" | "map" | "mapping--clear" | "mapping--hide" | "mapping--show" | "marginal" | "marine-warning" | "material-request" | "math-curve" | "maximize" | "media--library--filled" | "media--library" | "media-cast" | "medication--alert" | "medication--reminder" | "medication" | "menu" | "merge-node" | "merge" | "message-queue" | "meter--alt" | "meter" | "microphone--filled" | "microphone--off--filled" | "microphone--off" | "microphone" | "microscope" | "microservices--1" | "microservices--2" | "migrate--alt" | "migrate" | "milestone" | "military-camp" | "minimap-off" | "minimap-on" | "minimize" | "minus--plus" | "misuse--outline" | "misuse" | "mixed-rain-hail" | "ml-model--reference" | "mobile--add" | "mobile--audio" | "mobile--check" | "mobile--crash" | "mobile--download" | "mobile--event" | "mobile--landscape" | "mobile--request" | "mobile--session" | "mobile--view-orientation" | "mobile--view" | "mobile" | "mobility--services" | "model--alt" | "model--content--doc" | "model--foundation" | "model--reference" | "model--tuned" | "model-builder--reference" | "model-builder" | "model" | "modified--newest" | "modified--oldest" | "money" | "monster" | "monument" | "moon" | "moonrise" | "moonset" | "mostly-cloudy--night" | "mostly-cloudy" | "mountain" | "move" | "movement" | "multiuser-device" | "music--add" | "music--remove" | "music" | "mysql" | "name-space" | "naming-conventions" | "navaid--civil" | "navaid--dme" | "navaid--helipad" | "navaid--military-civil" | "navaid--military" | "navaid--ndb-dme" | "navaid--ndb" | "navaid--private" | "navaid--seaplane" | "navaid--tacan" | "navaid--vhfor" | "navaid--vor-dme" | "navaid--vor-tac" | "navaid--vor" | "need" | "network--1" | "network--2" | "network--3--reference" | "network--3" | "network--4--reference" | "network--4" | "network--admin-control" | "network--enterprise" | "network--overlay" | "network--public" | "network-interface" | "network-time-protocol" | "new-tab" | "next--filled" | "next--outline" | "no-image" | "no-ticket" | "nominal" | "non-certified" | "noodle-bowl" | "not-available" | "not-sent--filled" | "not-sent" | "notebook--reference" | "notebook" | "notification--filled" | "notification--new" | "notification--off--filled" | "notification--off" | "notification-counter" | "notification" | "notifications-paused" | "null-sign" | "number--0" | "number--1" | "number--2" | "number--3" | "number--4" | "number--5" | "number--6" | "number--7" | "number--8" | "number--9" | "number--small--0" | "number--small--1" | "number--small--2" | "number--small--3" | "number--small--4" | "number--small--5" | "number--small--6" | "number--small--7" | "number--small--8" | "number--small--9" | "object-storage--alt" | "object-storage" | "object" | "observed--hail" | "observed--lightning" | "offset--environmental" | "omega" | "opacity" | "open--stripe" | "open-panel--bottom" | "open-panel--filled--bottom" | "open-panel--filled--left" | "open-panel--filled--right" | "open-panel--filled--top" | "open-panel--left" | "open-panel--right" | "open-panel--top" | "operations--field" | "operations--record" | "orchestrate" | "order--server" | "order--storm" | "order--stratus" | "order-details" | "ordinal" | "outage" | "outlook-severe" | "overflow-menu--horizontal" | "overflow-menu--vertical" | "overlay" | "package--text-analysis" | "package-node" | "package" | "page--first" | "page--last" | "page-break" | "page-number" | "paint-brush--alt" | "paint-brush" | "palm-tree" | "pan--horizontal" | "pan--vertical" | "panel-expansion" | "paragraph" | "parameter" | "parent-child" | "parent-node" | "part--definition" | "part--usage" | "partition--auto" | "partition--collection" | "partition--repartition" | "partition--same" | "partition--specific" | "partly-cloudy--night" | "partly-cloudy" | "partnership" | "party-popper" | "passenger--drinks" | "passenger--plus" | "password" | "paste" | "pause--filled" | "pause--outline--filled" | "pause--outline" | "pause-future" | "pause-past" | "pause" | "payment--methods" | "pcn--e-node" | "pcn--military" | "pcn--p-node" | "pcn--z-node" | "pedestrian--family" | "pedestrian-child" | "pedestrian" | "pen--fountain" | "pen" | "pending--filled" | "pending" | "pentagon--down--outline" | "pentagon--down--solid" | "pentagon--left--outline" | "pentagon--left--solid" | "pentagon--outline" | "pentagon--right--outline" | "pentagon--right--solid" | "pentagon--solid" | "percentage--filled" | "percentage" | "perform--action" | "person--favorite" | "person" | "pest" | "phone--application" | "phone--block--filled" | "phone--block" | "phone--filled" | "phone--incoming--filled" | "phone--incoming" | "phone--ip" | "phone--off--filled" | "phone--off" | "phone--outgoing--filled" | "phone--outgoing" | "phone--settings" | "phone--voice--filled" | "phone--voice" | "phone" | "phrase-sentiment" | "picnic-area" | "piggy-bank--slot" | "piggy-bank" | "pills--add" | "pills--subtract" | "pills" | "pin--filled" | "pin" | "pipelines" | "pivot--horizontal" | "pivot--vertical" | "plan" | "plane--private" | "plane--sea" | "plane" | "platform-automation" | "platforms" | "play--filled--alt" | "play--filled" | "play--outline--filled" | "play--outline" | "play" | "playlist" | "plug--filled" | "plug" | "point-of-presence" | "point" | "police" | "policy" | "pop-in" | "popup" | "port--definition" | "port--input" | "port--output" | "port--usage" | "portfolio--management" | "portfolio" | "power-enterprise-pools-metered-capacity-integration" | "power-virtual-server-disaster-recovery-automation" | "power" | "pre-prod-environment" | "presentation-file" | "pressure--filled" | "pressure" | "previous--filled" | "previous--outline" | "pricing--consumption" | "pricing--container" | "pricing--quick-proposal" | "pricing--tailored" | "pricing--traditional" | "printer" | "priority--high" | "priority--low" | "private-network" | "process-automate" | "process" | "product" | "production-environment" | "production-service" | "program--action" | "program" | "progress-bar--round" | "progress-bar" | "promote" | "prompt-session" | "prompt-template" | "property-relationship" | "pull-request" | "punctuation-check" | "purchase" | "qiskit" | "qq-plot" | "qr-code" | "quadrant-plot" | "query-queue" | "query" | "question-answering" | "queued" | "quotes" | "radar--enhanced" | "radar--weather" | "radar" | "radio--combat" | "radio--push-to-talk" | "radio-button--checked" | "radio-button" | "radio" | "rain--drizzle" | "rain--heavy" | "rain--scattered--night" | "rain--scattered" | "rain-drop" | "rain" | "read-me" | "reading--glasses" | "receipt--verification" | "receipt" | "recently-viewed" | "recommend" | "recording--filled--alt" | "recording--filled" | "recording" | "recycle" | "red-hat-ai-instructlab-on-ibm-cloud" | "redefinition" | "redo" | "ref-evapotranspiration" | "reference-architecture" | "reflect--horizontal" | "reflect--vertical" | "refrigerant" | "reminder--medical" | "reminder" | "remote-connection" | "renew--alt" | "renew" | "repeat--one" | "repeat" | "replicate" | "reply--all" | "reply" | "repo--artifact" | "repo--source-code" | "report--chart" | "report--data" | "report--growth" | "report" | "request-quote" | "requirement--definition" | "requirement--usage" | "reset--alt" | "reset" | "restart" | "restaurant--fine" | "restaurant" | "result--draft" | "result--new" | "result--old" | "result" | "retry--failed" | "return" | "review" | "rewind--10" | "rewind--30" | "rewind--5" | "right-panel--close--filled" | "right-panel--close" | "right-panel--open--filled" | "right-panel--open" | "road--weather" | "road" | "roadmap" | "rocket" | "rotate--clockwise--alt--filled" | "rotate--clockwise--alt" | "rotate--clockwise--filled" | "rotate--clockwise" | "rotate--counterclockwise--alt--filled" | "rotate--counterclockwise--alt" | "rotate--counterclockwise--filled" | "rotate--counterclockwise" | "rotate" | "router--voice" | "router--wifi" | "router" | "row--collapse" | "row--delete" | "row--expand" | "row--insert" | "row" | "rss" | "rule--cancelled" | "rule--data-quality" | "rule--draft" | "rule--filled" | "rule--locked" | "rule--partial" | "rule--test" | "rule-grouping--data-quality" | "rule" | "ruler--alt" | "ruler" | "run--mirror" | "run-view-icon" | "run" | "running" | "sailboat--coastal" | "sailboat--offshore" | "sales-ops" | "sankey-diagram--alt" | "sankey-diagram" | "satellite--radar" | "satellite--weather" | "satellite" | "satisfy--definition" | "satisfy--usage" | "save--model" | "save" | "scale" | "scales--tipped" | "scales" | "scalpel" | "scan--alt" | "scan--disabled" | "scan" | "scatter-matrix" | "schematics" | "scis--control-tower" | "scis--transparent-supply" | "scooter--front" | "scooter" | "screen--off" | "screen-map--set" | "screen-map" | "screen" | "script--reference" | "script" | "search--advanced" | "search--locate--mirror" | "search--locate" | "search" | "security-services" | "security" | "select--01" | "select--02" | "select--window" | "send--alt--filled" | "send--alt" | "send--filled" | "send-action--usage" | "send-backward" | "send-to-back" | "send" | "sensor" | "sequential-palette" | "server--dns" | "server--proxy" | "server--time--usage" | "server--time" | "service-desk" | "service-id" | "service-levels" | "session-border-control" | "settings--adjust" | "settings--check" | "settings--edit" | "settings--services" | "settings--view" | "settings" | "shadow" | "shape--except" | "shape--exclude" | "shape--intersect" | "shape--join" | "shape--unite" | "shapes" | "share-knowledge" | "share" | "shield--alert" | "shipment--delivery" | "shopping--bag" | "shopping--cart--arrow-down" | "shopping--cart--arrow-up" | "shopping--cart--clear" | "shopping--cart--error" | "shopping--cart--minus" | "shopping--cart--plus" | "shopping--cart" | "shopping--catalog" | "show-data--cards" | "shrink-screen--filled" | "shrink-screen" | "shuffle" | "shuttle" | "side-panel--close--filled" | "side-panel--close" | "side-panel--open--filled" | "side-panel--open" | "sight" | "sigma" | "signal-strength" | "sim-card" | "skill-level--advanced" | "skill-level--basic" | "skill-level--intermediate" | "skill-level" | "skip--back--filled" | "skip--back--outline--filled" | "skip--back--outline--solid" | "skip--back--outline" | "skip--back--solid--filled" | "skip--back" | "skip--forward--filled" | "skip--forward--outline--filled" | "skip--forward--outline--solid" | "skip--forward--outline" | "skip--forward--solid--filled" | "skip--forward" | "sleet" | "slisor" | "smell" | "smoke" | "snooze" | "snow--blizzard" | "snow--heavy" | "snow--scattered--night" | "snow--scattered" | "snow-density" | "snow" | "snowflake" | "soccer" | "socket" | "software-resource--cluster" | "software-resource--reference" | "software-resource" | "soil-moisture--field" | "soil-moisture--global" | "soil-moisture" | "soil-temperature--field" | "soil-temperature--global" | "soil-temperature" | "solar-panel" | "sort--ascending" | "sort--descending" | "sort--remove" | "sorting-a-to-z" | "sorting-highest-to-lowest-number" | "sorting-lowest-to-highest-number" | "sorting-z-to-a" | "source-control" | "spell-check" | "split-screen" | "split" | "spray-paint" | "sprout" | "spyre-accelerator" | "square--outline" | "square--slash" | "square--solid" | "stack-limitation" | "stamp" | "star--filled" | "star--half" | "star--review" | "star" | "stay-inside" | "stem-leaf-plot" | "stethoscope" | "stickies" | "stop--filled--alt" | "stop--filled" | "stop--outline--filled" | "stop--outline" | "stop-sign--filled" | "stop-sign" | "stop" | "storage-pool" | "storage-request" | "store" | "storm-tracker" | "storm" | "strategy-play" | "stratus" | "strawberry" | "string-integer" | "string-text" | "subclassification" | "subdirectory" | "subflow--local" | "subflow" | "subject--definition" | "subject--usage" | "subnet-acl-rules" | "subsetting" | "subtract--alt" | "subtract--filled" | "subtract--large" | "subtract" | "succession--flow-connection" | "succession" | "summary--KPI--mirror" | "summary--KPI" | "sun" | "sunrise" | "sunset" | "support-vector-machine" | "surrogate--key-database" | "surrogate--key-flat-file" | "sustainability" | "swim" | "swimlane-d--vertical" | "switch-layer-2" | "switch-layer-3" | "switch" | "switcher" | "swot--filled" | "swot" | "sync-settings" | "sys-provision" | "sysplex--distributor" | "table--add" | "table--alias" | "table--built" | "table--shortcut" | "table--split" | "table-of-contents" | "table" | "tablet--landscape" | "tablet" | "tag--edit" | "tag--export" | "tag--group" | "tag--import" | "tag--none" | "tag" | "tank" | "target" | "task--add" | "task--approved" | "task--asset-view" | "task--blank" | "task--complete" | "task--edit" | "task--hold" | "task--location" | "task--progress" | "task--remove" | "task--settings" | "task--star" | "task--tools" | "task--view" | "task" | "taste" | "taxi" | "tcp-ip-service" | "temperature--celsius--alt" | "temperature--celsius" | "temperature--fahrenheit--alt" | "temperature--fahrenheit" | "temperature--feels-like" | "temperature--frigid" | "temperature--hot" | "temperature--inversion" | "temperature--max" | "temperature--min" | "temperature--water" | "temperature" | "template" | "tennis-ball" | "tennis" | "term--reference" | "term" | "terminal--3270" | "terminal" | "test-tool" | "text--align--center" | "text--align--justify" | "text--align--left" | "text--align--mixed" | "text--align--right" | "text--all-caps" | "text--bold" | "text--clear-format" | "text--color" | "text--creation" | "text--fill" | "text--font" | "text--footnote" | "text--highlight" | "text--indent--less" | "text--indent--more" | "text--indent" | "text--italic" | "text--kerning" | "text--leading" | "text--line-spacing" | "text--long-paragraph" | "text--new-line" | "text--scale" | "text--selection" | "text--short-paragraph" | "text--small-caps" | "text--strikethrough" | "text--subscript" | "text--superscript" | "text--tracking" | "text--underline" | "text--vertical-alignment" | "text--wrap" | "text-link--analysis" | "text-link" | "text-mining--applier" | "text-mining" | "theater" | "this-side-up" | "thumbnail--1" | "thumbnail--2" | "thumbs-down--filled" | "thumbs-down" | "thumbs-up--filled" | "thumbs-up-double--filled" | "thumbs-up-double" | "thumbs-up" | "thunderstorm--scattered--night" | "thunderstorm--scattered" | "thunderstorm--severe" | "thunderstorm--strong" | "thunderstorm" | "ticket" | "tides" | "time--filled" | "time-plot" | "time" | "timeline" | "timer" | "timing-belt" | "toggle--off--fill" | "toggle--on--fill" | "toggle-off" | "toggle-on" | "tool-box" | "tool-kit" | "tools--alt" | "tools" | "top-data-sets" | "top-programs" | "tornado-warning" | "tornado" | "touch--1--filled" | "touch--1-down--filled" | "touch--1-down" | "touch--1" | "touch--2--filled" | "touch--2" | "touch--interaction" | "tour" | "trace" | "traffic--event" | "traffic--flow-incident" | "traffic--flow" | "traffic--incident" | "traffic--weather-incident" | "traffic-cone" | "train--heart" | "train--profile" | "train--speed" | "train--ticket" | "train--time" | "train" | "tram" | "transform--binary" | "transform--code" | "transform--instructions" | "transform--language" | "transform--pipeline" | "transgender" | "translate" | "transmission-lte" | "transpose" | "trash-can" | "tree--fall-risk" | "tree-view--alt" | "tree-view" | "tree" | "triangle--down--outline" | "triangle--down--solid" | "triangle--left--outline" | "triangle--left--solid" | "triangle--outline" | "triangle--right--outline" | "triangle--right--solid" | "triangle--solid" | "trigger" | "trophy--filled" | "trophy" | "tropical-storm--model-tracks" | "tropical-storm--tracks" | "tropical-storm" | "tropical-warning" | "try-catch" | "tsq" | "tsunami" | "tuning" | "two-factor-authentication" | "two-person-lift" | "type-pattern" | "types" | "umbrella" | "undefined--filled" | "undefined" | "undo" | "unfold--open" | "ungroup-objects" | "unknown--filled" | "unknown" | "unlink" | "unlocked" | "unplug" | "unsaved" | "up-to-top" | "update-complete" | "update-now" | "upgrade" | "upload" | "upstream" | "usage--included-use-case" | "use-case--definition" | "use-case--usage" | "user--access-locked" | "user--access-unlocked" | "user--access" | "user--activity" | "user--admin" | "user--avatar--filled--alt" | "user--avatar--filled" | "user--avatar" | "user--certification" | "user--data" | "user--favorite--alt--filled" | "user--favorite--alt" | "user--favorite" | "user--feedback" | "user--filled" | "user--follow" | "user--identification" | "user--military" | "user--minus" | "user--multiple" | "user--online" | "user--profile" | "user--role" | "user--service-desk" | "user--service" | "user--settings" | "user--simulation" | "user--speaker" | "user--sponsor" | "user--x-ray" | "user-profile--alt" | "user" | "utility--expense" | "uv-index--alt" | "uv-index--filled" | "uv-index" | "value--variable--alt" | "value--variable" | "van" | "vegetation--asset" | "vegetation--encroachment" | "vegetation--height" | "vehicle--api" | "vehicle--connected" | "vehicle--insights" | "vehicle--services" | "version--major" | "version--minor" | "version--patch" | "version" | "vertical--fold" | "vertical-view" | "video--add" | "video--chat" | "video--filled" | "video--off--filled" | "video--off" | "video-player" | "video" | "view--filled" | "view--mode-1" | "view--mode-2" | "view--off--filled" | "view--off" | "view-next" | "view" | "vintage-mac" | "virtual-column--key" | "virtual-column" | "virtual-desktop" | "virtual-machine" | "virtual-private-cloud--alt" | "virtual-private-cloud" | "visual-inspection" | "visual-recognition" | "vlan--ibm" | "vlan" | "vmdk-disk" | "voice-activate" | "voice-mode" | "voicemail" | "volume--block-storage" | "volume--down--alt" | "volume--down--filled--alt" | "volume--down--filled" | "volume--down" | "volume--file-storage" | "volume--mute--filled" | "volume--mute" | "volume--object-storage" | "volume--up--alt" | "volume--up--filled--alt" | "volume--up--filled" | "volume--up" | "vpn--connection" | "vpn--policy" | "wallet" | "warning--alt--filled" | "warning--alt-inverted--filled" | "warning--alt-inverted" | "warning--alt" | "warning--diamond-fill" | "warning--diamond" | "warning--filled" | "warning--hex--filled" | "warning--hex" | "warning--multiple" | "warning--other" | "warning-square--filled" | "warning-square" | "warning" | "watch" | "watson--machine-learning" | "watson" | "watsonx-ai" | "watsonx-data" | "watsonx-governance" | "watsonx" | "wave-direction" | "wave-height" | "wave-period" | "waveform" | "weather-front--cold" | "weather-front--stationary" | "weather-front--warm" | "weather-station" | "web-services--cluster" | "web-services--container" | "web-services--definition" | "web-services--service" | "web-services--task-definition-version" | "web-services--task" | "webhook" | "websheet" | "wheat" | "while-loop" | "white-paper" | "wifi--controller" | "wifi--not-secure" | "wifi--off" | "wifi--secure" | "wifi-bridge--alt" | "wifi-bridge" | "wifi" | "wikis" | "wind-gusts" | "wind-power" | "wind-stream" | "windy--dust" | "windy--snow" | "windy--strong" | "windy" | "winter-warning" | "wintry-mix" | "wireless-checkout" | "word-cloud" | "workflow-automation" | "workspace--import" | "workspace" | "worship--christian" | "worship--jewish" | "worship--muslim" | "worship" | "x-axis" | "y-axis" | "z--lpar" | "z--systems" | "z-HyperLink" | "z-axis" | "zoom--area" | "zoom--fit" | "zoom--in-area" | "zoom--in" | "zoom--out-area" | "zoom--out" | "zoom--reset" | "zos--partition" | "zos--sysplex" | "zos";
|
|
3
|
+
/**
|
|
4
|
+
* Nomes que o APP acrescenta: um sprite próprio na web, um glifo de `criarGlifo` no nativo.
|
|
5
|
+
* Vazio de propósito. O app declara os seus uma vez, e só eles passam a valer:
|
|
6
|
+
*
|
|
7
|
+
* declare module "@aurea-uds/react" { // ou "@aurea-uds/native"
|
|
8
|
+
* interface AureaIconNames { marca: true }
|
|
9
|
+
* }
|
|
10
|
+
*/
|
|
11
|
+
export interface AureaIconNames {
|
|
12
|
+
}
|
|
13
|
+
/** Nome de ícone aceito: um do Carbon ou um que o app declarou em `AureaIconNames`. */
|
|
14
|
+
export type IconName = CarbonIconName | Extract<keyof AureaIconNames, string>;
|
package/dist/icon.d.ts
CHANGED
|
@@ -4,9 +4,10 @@ export type AureaIconComponent = (props: {
|
|
|
4
4
|
size?: number;
|
|
5
5
|
color?: string;
|
|
6
6
|
}) => React.ReactElement;
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
7
|
+
export type { IconName, CarbonIconName, AureaIconNames } from "./icon-names.js";
|
|
8
|
+
import type { IconName } from "./icon-names.js";
|
|
9
|
+
/** Parcial: o app registra só os que usa, e uma chave com erro de digitação reprova. */
|
|
10
|
+
export type AureaIconRegistry = Readonly<Partial<Record<IconName, AureaIconComponent>>>;
|
|
10
11
|
/**
|
|
11
12
|
* Declara o registro. É uma função de identidade tipada, e ela existe por um motivo prático:
|
|
12
13
|
* escrita como constante no módulo do app, a referência é estável — e um registro recriado a cada
|
|
@@ -118,4 +119,3 @@ export interface IconProps {
|
|
|
118
119
|
* um aviso nomeando o ícone e o caminho do import que resolve.
|
|
119
120
|
*/
|
|
120
121
|
export declare function Icon({ name, size, color, icons, label }: IconProps): React.JSX.Element | null;
|
|
121
|
-
export {};
|