diff --git a/stories/Components/Tooltip.stories.tsx b/stories/Components/Tooltip.stories.tsx
index 3222dd23..65a143c0 100644
--- a/stories/Components/Tooltip.stories.tsx
+++ b/stories/Components/Tooltip.stories.tsx
@@ -207,7 +207,7 @@ const EsempiInterattiviWithHooks = ({ placement, text }: TooltipProps) => {
};
export const EsempiInterattivi: Story = {
- render: (placement, text) => ,
+ render: (args) => ,
parameters: {
layout: 'centered'
},
@@ -219,6 +219,9 @@ export const EsempiInterattivi: Story = {
placement: {
control: 'select',
options: ['top', 'bottom', 'left', 'right']
+ },
+ text: {
+ control: 'text'
}
}
};
diff --git a/stories/Documentation/Tooltip.mdx b/stories/Documentation/Tooltip.mdx
index 197d4542..cdb9f807 100644
--- a/stories/Documentation/Tooltip.mdx
+++ b/stories/Documentation/Tooltip.mdx
@@ -10,30 +10,29 @@ import * as TooltipStories from '../Components/Tooltip.stories';
## Documentazione ed esempi per aggiungere tooltip personalizzati
I Tooltip di reactstrap con CSS e JavaScript utilizzano CSS3 per animazioni e la libreria `Popper.js` per il corretto posizionamento.
-
-
-
-
- Accessibiltà: I tooltip funzionano sia con la tastiera che per gli utenti dotati di tecnologia assistiva.
-
-
- È importante aggiungere tooltip solo ad elementi HTML che sono tradizionalmente attivabili da tastiera e
- interattivi (link, bottoni, o elementi di form).
-
-
- Sebbene arbitrariamente gli elementi HTML (come <span>
) possano essere resi attivabili tramite
- l’attributo
- tabindex="0"
, ciò aggiungerà interruzioni di tabulazioni potenzialmente dannose per gli utenti che usano
- la tastiera per navigare. Inoltre, la maggior parte delle tecnologie assistive in questa situazione non annuncia il
- tooltip come ci si potrebbe invece attendere.
-
-
- Infine, non fare affidamento esclusivamente sull’evento “mouse over” come innesco del tooltip, in quanto ciò
- renderà impossibile l’attivazione per gli utenti che usano la tastiera per navigare.
-
-
+
+
+
+ Accessibilità
+
+
+ I tooltip funzionano sia con la tastiera che per gli utenti dotati di tecnologia assistiva.
+ È importante aggiungere tooltip solo ad elementi HTML che sono tradizionalmente attivabili da tastiera e
+ interattivi (link, bottoni, o elementi di form).
+
+ Sebbene arbitrariamente gli elementi HTML (come <span>
) possano essere resi attivabili tramite
+ l’attributo
+ tabindex="0"
, ciò aggiungerà interruzioni di tabulazioni potenzialmente dannose per gli utenti che usano
+ la tastiera per navigare. Inoltre, la maggior parte delle tecnologie assistive in questa situazione non annuncia il
+ tooltip come ci si potrebbe invece attendere.
+
+ Infine, non fare affidamento esclusivamente sull’evento “mouse over” come innesco del tooltip, in quanto ciò
+ renderà impossibile l’attivazione per gli utenti che usano la tastiera per navigare.
+
+
+
### Esempio interattivo