@vector-business-services/cristal-ds-web 0.11.0 → 0.13.0

package/dist/index.d.cts

@@ -1,5 +1,5 @@
 import * as react from 'react';
-import { ReactNode, InputHTMLAttributes, HTMLAttributes, ButtonHTMLAttributes, CSSProperties, SyntheticEvent, MouseEvent, RefObject } from 'react';
+import { ReactNode, InputHTMLAttributes, HTMLAttributes, ButtonHTMLAttributes, CSSProperties, RefObject, SyntheticEvent, MouseEvent } from 'react';
 import { AutoCompleteProps as AutoCompleteProps$1 } from 'primereact/autocomplete';
 import { CheckboxChangeEvent } from 'primereact/checkbox';
 import { ChipRemoveEvent } from 'primereact/chip';
@@ -111,6 +111,61 @@ interface CardProps extends HTMLAttributes<HTMLDivElement> {
 }
 declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
 
+/**
+ * Cor da série: os tokens de gráfico (color/chart/fill/<cor>/<tom>), na ordem fixa. Sem `color`,
+ * cada série pega a da sua posição; a cor acompanha a série, nunca a ordem. A quinary (ciano) fica
+ * de fora: clara demais sobre o fundo (1,75:1).
+ */
+type ChartColor = 'primary' | 'secondary' | 'tertiary' | 'quaternary';
+/** Tom da cor (o passo do token). Padrão: 600 na linha e 500 na barra, como no Figma. */
+type ChartTone = 100 | 200 | 300 | 400 | 500 | 600;
+/** Uma série: uma linha ou um conjunto de barras. */
+interface ChartSeries {
+    label: string;
+    /** Um valor por rótulo do eixo X; null deixa o ponto em branco. */
+    data: (number | null)[];
+    color?: ChartColor;
+    /** Tom da cor: nas barras empilhadas do Figma, partes de um total usam tons da mesma cor. */
+    tone?: ChartTone;
+    /** Eixo do valor: o da esquerda (padrão) ou o da direita (y2Axis). */
+    axis?: 'left' | 'right';
+}
+/** Escala de um eixo Y. */
+interface ChartAxis {
+    /** Texto de cada marca e do valor no tooltip (ex.: `(v) => \`R$ ${v}\``). */
+    format?: (value: number) => string;
+    min?: number;
+    max?: number;
+    /** Distância entre as marcas (ex.: 50). */
+    stepSize?: number;
+}
+interface ChartProps {
+    /** Linhas com área (Chart / Line) ou barras (Chart / Bar). Padrão: line. */
+    type?: 'line' | 'bar';
+    /** Barras empilhadas: as séries somam numa barra só por rótulo. */
+    stacked?: boolean;
+    /** Rótulos do eixo X, um por ponto. */
+    labels: string[];
+    /** As séries, até 4 cores (as de gráfico dos tokens). */
+    series: ChartSeries[];
+    /** Eixo da esquerda. */
+    yAxis?: ChartAxis;
+    /** Eixo da direita, para séries com `axis: 'right'`. */
+    y2Axis?: ChartAxis;
+    /** Título do card. Sem título nem ações, só o gráfico e a legenda, sem a caixa. */
+    title?: string;
+    /** Texto do ícone de ajuda (Question) ao lado do título, num Tooltip. */
+    help?: string;
+    helpLabel?: string;
+    /** Botões à direita do título (IconButton tertiary xsmall no Figma). */
+    actions?: ReactNode;
+    /** Altura da área do gráfico, com os eixos. Padrão: 266px, a do Figma. */
+    height?: number;
+    id?: string;
+    className?: string;
+}
+declare function Chart({ type, stacked, labels, series, yAxis, y2Axis, title, help, helpLabel, actions, height, id, className, }: ChartProps): react.JSX.Element;
+
 /** Label Position no Figma: lado da caixa em relação ao rótulo. */
 type CheckboxPosition = 'left' | 'right';
 /** Label Type no Figma: Default (uma linha, com reticências) e Full (quebra em várias linhas). */
@@ -216,6 +271,32 @@ interface DrawerProps {
 }
 declare function Drawer({ visible, onHide, title, subtitle, side, behavior, size, modal, onBack, backLabel, closeLabel, footer, children, id, className, }: DrawerProps): react.JSX.Element;
 
+/** Type no Figma: Plain (rótulo curto, uma linha) e Rich (texto de até 300px, quebra linha). */
+type TooltipType = 'plain' | 'rich';
+type TooltipPosition = 'top' | 'bottom' | 'left' | 'right';
+interface TooltipProps {
+    /** Elemento que mostra o tooltip: ref, elemento ou seletor CSS. */
+    target: RefObject<HTMLElement | null> | HTMLElement | string;
+    /** Texto do tooltip (Label no Plain, Text no Rich). */
+    content: ReactNode;
+    type?: TooltipType;
+    /** Lado do alvo. O Prime inverte o lado se faltar espaço na tela. */
+    position?: TooltipPosition;
+    /** O que abre o tooltip; o padrão abre no hover e no foco do teclado. */
+    event?: 'hover' | 'focus' | 'both';
+    showDelay?: number;
+    hideDelay?: number;
+    disabled?: boolean;
+    /**
+     * Liga o texto ao alvo como descrição (aria-describedby). Padrão: true. Use false quando o texto
+     * já é o nome do alvo (como no IconButton), para o leitor de tela não ler duas vezes.
+     */
+    describe?: boolean;
+    id?: string;
+    className?: string;
+}
+declare function Tooltip({ target, content, type, position, event, showDelay, hideDelay, disabled, describe, id, className, }: TooltipProps): react.JSX.Element;
+
 /**
  * Hierarchy no Figma: Primary (Filled), Secondary (Tonal), Tertiary (Outlined) e Other (Icon),
  * que aqui é `ghost`: só o ícone, com fundo no hover.
@@ -230,6 +311,13 @@ interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>,
     icon: ReactNode;
     /** Obrigatório: o botão não tem texto, então é isso que o leitor de tela anuncia. */
     'aria-label': string;
+    /**
+     * Tooltip do botão. Padrão: o próprio `aria-label`, para quem vê saber o que o ícone faz. Um
+     * texto diferente vira também a descrição do botão; `false` tira o tooltip.
+     */
+    tooltip?: ReactNode | false;
+    /** Lado do tooltip. Padrão: bottom. */
+    tooltipPosition?: TooltipPosition;
 }
 declare const IconButton: react.ForwardRefExoticComponent<IconButtonProps & react.RefAttributes<HTMLButtonElement>>;
 
@@ -499,9 +587,17 @@ interface PageHeaderProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'>
     segmentControl?: ReactNode;
     /** Botões das ferramentas (Show Buttons no Figma), 8px entre eles. */
     actions?: ReactNode;
-    /** Mostra o botão de expandir, o último das ferramentas. */
-    onExpand?: () => void;
+    /**
+     * Mostra o botão de expandir, o último das ferramentas. Recebe o novo estado: true ao expandir,
+     * false ao recolher.
+     */
+    onExpand?: (expanded: boolean) => void;
+    /** Expandido (controlado). Sem ele, o PageHeader alterna sozinho a cada clique. */
+    expanded?: boolean;
+    /** Nome do botão recolhido (ArrowsOutSimple). */
     expandLabel?: string;
+    /** Nome do botão expandido (ArrowsInSimple). */
+    collapseLabel?: string;
     /** Abas abaixo do título (Show Tabs no Figma). */
     tabs?: PageHeaderTab[];
     /** Aba ativa (controlado). Sem ela, o PageHeader controla sozinho. */
@@ -736,26 +832,5 @@ interface ToastProps {
 }
 declare const Toast: react.ForwardRefExoticComponent<ToastProps & react.RefAttributes<ToastHandle>>;
 
-/** Type no Figma: Plain (rótulo curto, uma linha) e Rich (texto de até 300px, quebra linha). */
-type TooltipType = 'plain' | 'rich';
-type TooltipPosition = 'top' | 'bottom' | 'left' | 'right';
-interface TooltipProps {
-    /** Elemento que mostra o tooltip: ref, elemento ou seletor CSS. */
-    target: RefObject<HTMLElement | null> | HTMLElement | string;
-    /** Texto do tooltip (Label no Plain, Text no Rich). */
-    content: ReactNode;
-    type?: TooltipType;
-    /** Lado do alvo. O Prime inverte o lado se faltar espaço na tela. */
-    position?: TooltipPosition;
-    /** O que abre o tooltip; o padrão abre no hover e no foco do teclado. */
-    event?: 'hover' | 'focus' | 'both';
-    showDelay?: number;
-    hideDelay?: number;
-    disabled?: boolean;
-    id?: string;
-    className?: string;
-}
-declare function Tooltip({ target, content, type, position, event, showDelay, hideDelay, disabled, id, className, }: TooltipProps): react.JSX.Element;
-
-export { Accordion, AccordionTab, AutoComplete, Badge, Button, Card, Checkbox, Chip, Divider, Drawer, IconButton, Input, Menu, MenuPrincipal, Menubar, Message, Modal, MultiSelect, PageHeader, Paginator, Panel, Radio, ScrollPanel, SegmentControl, Select, Switch, TabPanel, Tabs, Tag, Toast, Tooltip };
-export type { AccordionProps, AccordionTabProps, AutoCompleteProps, AutoCompleteSize, AutoCompleteVariant, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, CardPadding, CardProps, CheckboxLabelSize, CheckboxPosition, CheckboxProps, ChipProps, ChipSize, ChipVariant, DividerOrientation, DividerProps, DividerVariant, DrawerBehavior, DrawerProps, DrawerSide, DrawerSize, IconButtonProps, IconButtonSize, IconButtonVariant, InputProps, InputSize, InputVariant, MenuDensity, MenuHandle, MenuItem, MenuPrincipalEntry, MenuPrincipalGroup, MenuPrincipalHandle, MenuPrincipalItem, MenuPrincipalProps, MenuProps, MenubarProps, MenubarTool, MenubarUser, MessageProps, MessageType, ModalProps, ModalSize, MultiSelectDensity, MultiSelectProps, MultiSelectSize, MultiSelectVariant, PageHeaderProps, PageHeaderTab, PageHeaderVariant, PaginatorPageChangeEvent, PaginatorProps, PanelProps, RadioLabelSize, RadioProps, ScrollPanelProps, SegmentControlOption, SegmentControlProps, SegmentControlVariant, SelectProps, SelectSize, SelectVariant, SwitchLabelPosition, SwitchProps, SwitchSize, TabPanelProps, TabsProps, TagProps, TagSize, TagVariant, ToastHandle, ToastMessage, ToastPosition, ToastProps, ToastType, TooltipPosition, TooltipProps, TooltipType };
+export { Accordion, AccordionTab, AutoComplete, Badge, Button, Card, Chart, Checkbox, Chip, Divider, Drawer, IconButton, Input, Menu, MenuPrincipal, Menubar, Message, Modal, MultiSelect, PageHeader, Paginator, Panel, Radio, ScrollPanel, SegmentControl, Select, Switch, TabPanel, Tabs, Tag, Toast, Tooltip };
+export type { AccordionProps, AccordionTabProps, AutoCompleteProps, AutoCompleteSize, AutoCompleteVariant, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, CardPadding, CardProps, ChartAxis, ChartColor, ChartProps, ChartSeries, CheckboxLabelSize, CheckboxPosition, CheckboxProps, ChipProps, ChipSize, ChipVariant, DividerOrientation, DividerProps, DividerVariant, DrawerBehavior, DrawerProps, DrawerSide, DrawerSize, IconButtonProps, IconButtonSize, IconButtonVariant, InputProps, InputSize, InputVariant, MenuDensity, MenuHandle, MenuItem, MenuPrincipalEntry, MenuPrincipalGroup, MenuPrincipalHandle, MenuPrincipalItem, MenuPrincipalProps, MenuProps, MenubarProps, MenubarTool, MenubarUser, MessageProps, MessageType, ModalProps, ModalSize, MultiSelectDensity, MultiSelectProps, MultiSelectSize, MultiSelectVariant, PageHeaderProps, PageHeaderTab, PageHeaderVariant, PaginatorPageChangeEvent, PaginatorProps, PanelProps, RadioLabelSize, RadioProps, ScrollPanelProps, SegmentControlOption, SegmentControlProps, SegmentControlVariant, SelectProps, SelectSize, SelectVariant, SwitchLabelPosition, SwitchProps, SwitchSize, TabPanelProps, TabsProps, TagProps, TagSize, TagVariant, ToastHandle, ToastMessage, ToastPosition, ToastProps, ToastType, TooltipPosition, TooltipProps, TooltipType };

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as react from 'react';
-import { ReactNode, InputHTMLAttributes, HTMLAttributes, ButtonHTMLAttributes, CSSProperties, SyntheticEvent, MouseEvent, RefObject } from 'react';
+import { ReactNode, InputHTMLAttributes, HTMLAttributes, ButtonHTMLAttributes, CSSProperties, RefObject, SyntheticEvent, MouseEvent } from 'react';
 import { AutoCompleteProps as AutoCompleteProps$1 } from 'primereact/autocomplete';
 import { CheckboxChangeEvent } from 'primereact/checkbox';
 import { ChipRemoveEvent } from 'primereact/chip';
@@ -111,6 +111,61 @@ interface CardProps extends HTMLAttributes<HTMLDivElement> {
 }
 declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
 
+/**
+ * Cor da série: os tokens de gráfico (color/chart/fill/<cor>/<tom>), na ordem fixa. Sem `color`,
+ * cada série pega a da sua posição; a cor acompanha a série, nunca a ordem. A quinary (ciano) fica
+ * de fora: clara demais sobre o fundo (1,75:1).
+ */
+type ChartColor = 'primary' | 'secondary' | 'tertiary' | 'quaternary';
+/** Tom da cor (o passo do token). Padrão: 600 na linha e 500 na barra, como no Figma. */
+type ChartTone = 100 | 200 | 300 | 400 | 500 | 600;
+/** Uma série: uma linha ou um conjunto de barras. */
+interface ChartSeries {
+    label: string;
+    /** Um valor por rótulo do eixo X; null deixa o ponto em branco. */
+    data: (number | null)[];
+    color?: ChartColor;
+    /** Tom da cor: nas barras empilhadas do Figma, partes de um total usam tons da mesma cor. */
+    tone?: ChartTone;
+    /** Eixo do valor: o da esquerda (padrão) ou o da direita (y2Axis). */
+    axis?: 'left' | 'right';
+}
+/** Escala de um eixo Y. */
+interface ChartAxis {
+    /** Texto de cada marca e do valor no tooltip (ex.: `(v) => \`R$ ${v}\``). */
+    format?: (value: number) => string;
+    min?: number;
+    max?: number;
+    /** Distância entre as marcas (ex.: 50). */
+    stepSize?: number;
+}
+interface ChartProps {
+    /** Linhas com área (Chart / Line) ou barras (Chart / Bar). Padrão: line. */
+    type?: 'line' | 'bar';
+    /** Barras empilhadas: as séries somam numa barra só por rótulo. */
+    stacked?: boolean;
+    /** Rótulos do eixo X, um por ponto. */
+    labels: string[];
+    /** As séries, até 4 cores (as de gráfico dos tokens). */
+    series: ChartSeries[];
+    /** Eixo da esquerda. */
+    yAxis?: ChartAxis;
+    /** Eixo da direita, para séries com `axis: 'right'`. */
+    y2Axis?: ChartAxis;
+    /** Título do card. Sem título nem ações, só o gráfico e a legenda, sem a caixa. */
+    title?: string;
+    /** Texto do ícone de ajuda (Question) ao lado do título, num Tooltip. */
+    help?: string;
+    helpLabel?: string;
+    /** Botões à direita do título (IconButton tertiary xsmall no Figma). */
+    actions?: ReactNode;
+    /** Altura da área do gráfico, com os eixos. Padrão: 266px, a do Figma. */
+    height?: number;
+    id?: string;
+    className?: string;
+}
+declare function Chart({ type, stacked, labels, series, yAxis, y2Axis, title, help, helpLabel, actions, height, id, className, }: ChartProps): react.JSX.Element;
+
 /** Label Position no Figma: lado da caixa em relação ao rótulo. */
 type CheckboxPosition = 'left' | 'right';
 /** Label Type no Figma: Default (uma linha, com reticências) e Full (quebra em várias linhas). */
@@ -216,6 +271,32 @@ interface DrawerProps {
 }
 declare function Drawer({ visible, onHide, title, subtitle, side, behavior, size, modal, onBack, backLabel, closeLabel, footer, children, id, className, }: DrawerProps): react.JSX.Element;
 
+/** Type no Figma: Plain (rótulo curto, uma linha) e Rich (texto de até 300px, quebra linha). */
+type TooltipType = 'plain' | 'rich';
+type TooltipPosition = 'top' | 'bottom' | 'left' | 'right';
+interface TooltipProps {
+    /** Elemento que mostra o tooltip: ref, elemento ou seletor CSS. */
+    target: RefObject<HTMLElement | null> | HTMLElement | string;
+    /** Texto do tooltip (Label no Plain, Text no Rich). */
+    content: ReactNode;
+    type?: TooltipType;
+    /** Lado do alvo. O Prime inverte o lado se faltar espaço na tela. */
+    position?: TooltipPosition;
+    /** O que abre o tooltip; o padrão abre no hover e no foco do teclado. */
+    event?: 'hover' | 'focus' | 'both';
+    showDelay?: number;
+    hideDelay?: number;
+    disabled?: boolean;
+    /**
+     * Liga o texto ao alvo como descrição (aria-describedby). Padrão: true. Use false quando o texto
+     * já é o nome do alvo (como no IconButton), para o leitor de tela não ler duas vezes.
+     */
+    describe?: boolean;
+    id?: string;
+    className?: string;
+}
+declare function Tooltip({ target, content, type, position, event, showDelay, hideDelay, disabled, describe, id, className, }: TooltipProps): react.JSX.Element;
+
 /**
  * Hierarchy no Figma: Primary (Filled), Secondary (Tonal), Tertiary (Outlined) e Other (Icon),
  * que aqui é `ghost`: só o ícone, com fundo no hover.
@@ -230,6 +311,13 @@ interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>,
     icon: ReactNode;
     /** Obrigatório: o botão não tem texto, então é isso que o leitor de tela anuncia. */
     'aria-label': string;
+    /**
+     * Tooltip do botão. Padrão: o próprio `aria-label`, para quem vê saber o que o ícone faz. Um
+     * texto diferente vira também a descrição do botão; `false` tira o tooltip.
+     */
+    tooltip?: ReactNode | false;
+    /** Lado do tooltip. Padrão: bottom. */
+    tooltipPosition?: TooltipPosition;
 }
 declare const IconButton: react.ForwardRefExoticComponent<IconButtonProps & react.RefAttributes<HTMLButtonElement>>;
 
@@ -499,9 +587,17 @@ interface PageHeaderProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'>
     segmentControl?: ReactNode;
     /** Botões das ferramentas (Show Buttons no Figma), 8px entre eles. */
     actions?: ReactNode;
-    /** Mostra o botão de expandir, o último das ferramentas. */
-    onExpand?: () => void;
+    /**
+     * Mostra o botão de expandir, o último das ferramentas. Recebe o novo estado: true ao expandir,
+     * false ao recolher.
+     */
+    onExpand?: (expanded: boolean) => void;
+    /** Expandido (controlado). Sem ele, o PageHeader alterna sozinho a cada clique. */
+    expanded?: boolean;
+    /** Nome do botão recolhido (ArrowsOutSimple). */
     expandLabel?: string;
+    /** Nome do botão expandido (ArrowsInSimple). */
+    collapseLabel?: string;
     /** Abas abaixo do título (Show Tabs no Figma). */
     tabs?: PageHeaderTab[];
     /** Aba ativa (controlado). Sem ela, o PageHeader controla sozinho. */
@@ -736,26 +832,5 @@ interface ToastProps {
 }
 declare const Toast: react.ForwardRefExoticComponent<ToastProps & react.RefAttributes<ToastHandle>>;
 
-/** Type no Figma: Plain (rótulo curto, uma linha) e Rich (texto de até 300px, quebra linha). */
-type TooltipType = 'plain' | 'rich';
-type TooltipPosition = 'top' | 'bottom' | 'left' | 'right';
-interface TooltipProps {
-    /** Elemento que mostra o tooltip: ref, elemento ou seletor CSS. */
-    target: RefObject<HTMLElement | null> | HTMLElement | string;
-    /** Texto do tooltip (Label no Plain, Text no Rich). */
-    content: ReactNode;
-    type?: TooltipType;
-    /** Lado do alvo. O Prime inverte o lado se faltar espaço na tela. */
-    position?: TooltipPosition;
-    /** O que abre o tooltip; o padrão abre no hover e no foco do teclado. */
-    event?: 'hover' | 'focus' | 'both';
-    showDelay?: number;
-    hideDelay?: number;
-    disabled?: boolean;
-    id?: string;
-    className?: string;
-}
-declare function Tooltip({ target, content, type, position, event, showDelay, hideDelay, disabled, id, className, }: TooltipProps): react.JSX.Element;
-
-export { Accordion, AccordionTab, AutoComplete, Badge, Button, Card, Checkbox, Chip, Divider, Drawer, IconButton, Input, Menu, MenuPrincipal, Menubar, Message, Modal, MultiSelect, PageHeader, Paginator, Panel, Radio, ScrollPanel, SegmentControl, Select, Switch, TabPanel, Tabs, Tag, Toast, Tooltip };
-export type { AccordionProps, AccordionTabProps, AutoCompleteProps, AutoCompleteSize, AutoCompleteVariant, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, CardPadding, CardProps, CheckboxLabelSize, CheckboxPosition, CheckboxProps, ChipProps, ChipSize, ChipVariant, DividerOrientation, DividerProps, DividerVariant, DrawerBehavior, DrawerProps, DrawerSide, DrawerSize, IconButtonProps, IconButtonSize, IconButtonVariant, InputProps, InputSize, InputVariant, MenuDensity, MenuHandle, MenuItem, MenuPrincipalEntry, MenuPrincipalGroup, MenuPrincipalHandle, MenuPrincipalItem, MenuPrincipalProps, MenuProps, MenubarProps, MenubarTool, MenubarUser, MessageProps, MessageType, ModalProps, ModalSize, MultiSelectDensity, MultiSelectProps, MultiSelectSize, MultiSelectVariant, PageHeaderProps, PageHeaderTab, PageHeaderVariant, PaginatorPageChangeEvent, PaginatorProps, PanelProps, RadioLabelSize, RadioProps, ScrollPanelProps, SegmentControlOption, SegmentControlProps, SegmentControlVariant, SelectProps, SelectSize, SelectVariant, SwitchLabelPosition, SwitchProps, SwitchSize, TabPanelProps, TabsProps, TagProps, TagSize, TagVariant, ToastHandle, ToastMessage, ToastPosition, ToastProps, ToastType, TooltipPosition, TooltipProps, TooltipType };
+export { Accordion, AccordionTab, AutoComplete, Badge, Button, Card, Chart, Checkbox, Chip, Divider, Drawer, IconButton, Input, Menu, MenuPrincipal, Menubar, Message, Modal, MultiSelect, PageHeader, Paginator, Panel, Radio, ScrollPanel, SegmentControl, Select, Switch, TabPanel, Tabs, Tag, Toast, Tooltip };
+export type { AccordionProps, AccordionTabProps, AutoCompleteProps, AutoCompleteSize, AutoCompleteVariant, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, CardPadding, CardProps, ChartAxis, ChartColor, ChartProps, ChartSeries, CheckboxLabelSize, CheckboxPosition, CheckboxProps, ChipProps, ChipSize, ChipVariant, DividerOrientation, DividerProps, DividerVariant, DrawerBehavior, DrawerProps, DrawerSide, DrawerSize, IconButtonProps, IconButtonSize, IconButtonVariant, InputProps, InputSize, InputVariant, MenuDensity, MenuHandle, MenuItem, MenuPrincipalEntry, MenuPrincipalGroup, MenuPrincipalHandle, MenuPrincipalItem, MenuPrincipalProps, MenuProps, MenubarProps, MenubarTool, MenubarUser, MessageProps, MessageType, ModalProps, ModalSize, MultiSelectDensity, MultiSelectProps, MultiSelectSize, MultiSelectVariant, PageHeaderProps, PageHeaderTab, PageHeaderVariant, PaginatorPageChangeEvent, PaginatorProps, PanelProps, RadioLabelSize, RadioProps, ScrollPanelProps, SegmentControlOption, SegmentControlProps, SegmentControlVariant, SelectProps, SelectSize, SelectVariant, SwitchLabelPosition, SwitchProps, SwitchSize, TabPanelProps, TabsProps, TagProps, TagSize, TagVariant, ToastHandle, ToastMessage, ToastPosition, ToastProps, ToastType, TooltipPosition, TooltipProps, TooltipType };