@italia/dropdown 0.1.0-alpha.2 → 1.0.0-alpha.4

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 CHANGED
@@ -2,7 +2,13 @@
2
2
 
3
3
  Questo package contiene il web component `<it-dropdown>`, conforme agli standard del progetto e con stili Bootstrap Italia.
4
4
 
5
- ## Utilizzo
5
+ ## Installation
6
+
7
+ ```bash
8
+ npm i @italia/dropdown
9
+ ```
10
+
11
+ ## Usage
6
12
 
7
13
  ```
8
14
  <it-dropdown>
@@ -535,7 +535,7 @@
535
535
  {
536
536
  "kind": "variable",
537
537
  "name": "meta",
538
- "default": "{ title: 'Componenti/Dropdown', component: 'it-dropdown', tags: ['autodocs'], args: { label: 'Apri dropdown', disabled: false, alignment: undefined, variant: 'primary', size: undefined, 'it-role': undefined, dark: false, 'full-width': false, }, argTypes: { label: { control: 'text' }, disabled: { control: 'boolean' }, alignment: { control: 'select', options: [ 'top', 'right', 'bottom', 'left', 'top-start', 'top-end', 'right-start', 'right-end', 'bottom-start', 'bottom-end', 'left-start', 'left-end', ], }, variant: { control: 'select', options: ['primary', 'secondary', 'success', 'danger', 'warning', 'light', 'link'], }, size: { control: 'select', options: ['sm', 'lg'], }, 'it-role': { control: 'select', options: ['menu', 'list'], }, dark: { control: 'boolean' }, 'full-width': { control: 'boolean' }, }, decorators: [(Story) => html`<div style=${containerStyle}>${Story()}</div>`], parameters: { docs: { description: { component: ` <Description>Attiva o disattiva overlay contestuali per visualizzare liste di link ed altro ancora con questi menu a tendina.</Description> Per la creazione di un dropdown è necessario utilizzare il componente \\`<it-dropdown>\\` che può contenere al suo interno uno o più \\`<it-dropdown-item>\\`. È necessario specificare l'etichetta del menu tramite l'attributo \\`label\\`. È possibile specificare una variante tramite l'attributo \\`variant\\`, questa verrà applicata al pulsante di attivazione del menu. <div class=\"callout callout-success\"><div class=\"callout-inner\"><div class=\"callout-title\"><span class=\"text\">Accessibilità</span></div> <p>Lo standard <a href=\"https://www.w3.org/TR/wai-aria/\">WAI ARIA</a> definisce un widget con proprietà <a href=\"https://www.w3.org/TR/wai-aria/#menu\">\\`role=\"menu\"\\`</a>, specifica per i menu applicativi con link o azioni. Questi menu possono contenere solo voci di menu, voci di menu di caselle di controllo, voci di menu dei pulsanti di opzione, gruppi di pulsanti di opzione e sottomenu.</p> <p>I dropdown di **Dev Kit Italia** sono progettati per essere invece generici e applicabili a una varietà di situazioni. Per questo motivo, il componente \\`it-dropdown\\` ha come ruolo predefinito il ruolo \\`menu\\` e gestisce automaticamente il ruolo degli elementi interni, ma gli autori potranno modificare il ruolo del Dropdown generato da questo componente ad una semplice lista impostando l'attributo \\`it-role=\"list\"\\`.</p> <p>Questo componente comprende di base il supporto per la maggior parte delle interazioni standard del menu della tastiera, come la possibilità di spostarsi tra i singoli elementi \\`it-dropdown-item\\` usando i tasti freccia, e chiude il menu con il tasto ESC.</p> </div></div> `, }, }, }, } satisfies Meta<DropdownProps>"
538
+ "default": "{ title: 'Componenti/Dropdown', component: 'it-dropdown', tags: ['a11y-ok', 'web-component'], args: { label: 'Apri dropdown', disabled: false, alignment: undefined, variant: 'primary', size: undefined, 'it-role': undefined, dark: false, 'full-width': false, 'it-aria-label': undefined, }, argTypes: { label: { control: 'text', description: 'Testo del pulsante che apre il dropdown', }, disabled: { control: 'boolean', description: 'Disabilita il dropdown', table: { defaultValue: { summary: 'false' } }, }, alignment: { control: 'select', description: 'Posizionamento del menu rispetto al pulsante', options: [ 'top', 'right', 'bottom', 'left', 'top-start', 'top-end', 'right-start', 'right-end', 'bottom-start', 'bottom-end', 'left-start', 'left-end', ], type: 'string', table: { defaultValue: { summary: 'bottom-start' } }, }, variant: { control: 'select', description: 'Variante grafica del pulsante', options: ['primary', 'secondary', 'success', 'danger', 'warning', 'light', 'link'], type: 'string', table: { defaultValue: { summary: 'primary' } }, }, size: { control: 'select', description: 'Dimensione del pulsante', options: ['sm', 'lg'], type: 'string', table: {}, }, 'it-role': { control: 'select', description: 'Ruolo del pulsante (vedi la sezione Accessibilità)', options: ['menu', 'list'], type: 'string', table: { defaultValue: { summary: 'menu' } }, }, dark: { control: 'boolean', description: 'Stile scuro per il menu dropdown', table: { defaultValue: { summary: 'false' } }, }, 'full-width': { control: 'boolean', description: 'Imposta la larghezza del menu dropdown al 100% del contenitore', table: { defaultValue: { summary: 'false' } }, }, 'it-aria-label': { control: 'text', description: \"Valore per l'attributo `aria-label` del pulsante (obbligatorio per accessibilità se `label` è vuoto)\", type: 'string', }, }, parameters: { docs: { source: { excludeDecorators: true }, }, }, } satisfies Meta<DropdownProps>"
539
539
  },
540
540
  {
541
541
  "kind": "variable",
@@ -543,7 +543,7 @@
543
543
  "type": {
544
544
  "text": "Story"
545
545
  },
546
- "default": "{ render: (args) => html` <it-dropdown label=${args.label} ?disabled=${args.disabled} alignment=${ifDefined(args.alignment)} size=${ifDefined(args.size)} variant=${args.variant} it-role=${ifDefined(args['it-role'])} ?dark=${args.dark} ?full-width=${args['full-width']} > <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, parameters: { ...meta.parameters, docs: { source: { excludeDecorators: true }, canvas: { sourceState: 'shown' }, }, }, tags: ['!autodocs', '!dev'], }"
546
+ "default": "{ render: (args) => html` <it-dropdown label=${args.label} ?disabled=${args.disabled} alignment=${ifDefined(args.alignment)} size=${ifDefined(args.size)} variant=${args.variant} it-role=${ifDefined(args['it-role'])} ?dark=${args.dark} ?full-width=${args['full-width']} it-aria-label=${ifDefined(args['it-aria-label'])} > <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, tags: ['!autodocs', '!dev'], decorators: [(Story) => html`<div style=\"height:200px\">${Story()}</div>`], }"
547
547
  },
548
548
  {
549
549
  "kind": "variable",
@@ -551,15 +551,15 @@
551
551
  "type": {
552
552
  "text": "Story"
553
553
  },
554
- "default": "{ name: 'Dropdown button varianti', render: () => html` <it-dropdown label=\"Primario\" variant=\"primary\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> <it-dropdown label=\"Secondario\" variant=\"secondary\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> <it-dropdown label=\"Success\" variant=\"success\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> <it-dropdown label=\"Danger\" variant=\"danger\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, decorators: [(Story) => html`<div style=\"${containerStyle}gap:0.5rem;flex-wrap:wrap;display:flex\">${Story()}</div>`], argTypes: { ...disabledControls() }, parameters: { ...meta.parameters, docs: { source: { excludeDecorators: true }, description: { story: 'Ovviamente sono disponibili tutte le varianti già disponibili per i pulsanti. Di seguito, un esempio di utilizzo con le varianti `primary`, `secondary`, `success` e `danger`.', }, }, }, }"
554
+ "default": "{ render: () => html` <it-dropdown label=\"Apri dropdown\" variant=\"primary\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> <it-dropdown label=\"Apri dropdown\" variant=\"secondary\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> <it-dropdown label=\"Apri dropdown\" variant=\"success\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> <it-dropdown label=\"Apri dropdown\" variant=\"danger\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, decorators: [(Story) => html`<div style=\"${containerStyle}gap:0.5rem;flex-wrap:wrap\">${Story()}</div>`], argTypes: { ...disabledControls() }, }"
555
555
  },
556
556
  {
557
557
  "kind": "variable",
558
- "name": "Direzioni",
558
+ "name": "Posizionamento",
559
559
  "type": {
560
560
  "text": "Story"
561
561
  },
562
- "default": "{ render: () => html` <it-dropdown label=\"Giù\" alignment=\"bottom-start\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> <it-dropdown label=\"Su\" alignment=\"top-start\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> <it-dropdown label=\"Sinistra\" alignment=\"left\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> <it-dropdown label=\"Destra\" alignment=\"right\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, decorators: [ (Story) => html`<div style=\"${containerStyle}gap:2rem;flex-wrap:wrap;align-items:space-between;justify-content:center;flex-direction:column;\" > ${Story()} </div>`, ], argTypes: { ...disabledControls() }, parameters: { ...meta.parameters, docs: { source: { excludeDecorators: true }, description: { story: `Per aprire le voci di menu in direzioni diverse, è possibile utilizzare l'attributo \\`alignment\\` con i valori \\`top\\`, \\`right\\`, \\`bottom\\`, \\`left\\`, \\`top-start\\`, \\`top-end\\`, \\`right-start\\`, \\`right-end\\`, \\`bottom-start\\`, \\`bottom-end\\`, \\`left-start\\` e \\`left-end\\`. I valori \\`top\\`, \\`right\\`, \\`bottom\\` e \\`left\\` aprono il menu in direzioni standard, centrate rispetto al trigger, mentre i valori \\`top-start\\`, \\`top-end\\`, \\`right-start\\`, \\`right-end\\`, \\`bottom-start\\`, \\`bottom-end\\`, \\`left-start\\` e \\`left-end\\` permettono di specificare la posizione esatta del menu rispetto al trigger. `, }, }, }, }"
562
+ "default": "{ render: () => html` <it-dropdown label=\"Apri dropdown\" alignment=\"bottom-start\" style=\"grid-column:2\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> <it-dropdown label=\"Apri dropup\" alignment=\"top-start\" style=\"grid-row:3;grid-column:2\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> <it-dropdown label=\"Apri dropstart\" alignment=\"left\" style=\"grid-row:2;grid-column:3\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> <it-dropdown label=\"Apri dropend\" alignment=\"right\" style=\"grid-row:2;grid-column:1\"> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, decorators: [(Story) => html`<div style=\"display:grid;gap:.5rem;grid:1fr 1fr 1fr/1fr 1fr 1fr;\">${Story()}</div>`], argTypes: { ...disabledControls() }, }"
563
563
  },
564
564
  {
565
565
  "kind": "variable",
@@ -567,7 +567,7 @@
567
567
  "type": {
568
568
  "text": "Story"
569
569
  },
570
- "default": "{ name: 'Menu con voci attive', render: (args) => html` <it-dropdown label=${args.label} variant=${args.variant}> <it-dropdown-item href=\"#\" active>Attivo</it-dropdown-item> <it-dropdown-item href=\"#\">Non attivo</it-dropdown-item> <it-dropdown-item href=\"#\">Non attivo</it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, parameters: { ...meta.parameters, docs: { source: { excludeDecorators: true }, description: { story: `Aggiungere l'attributo active agli elementi del dropdown che si vogliono mostrare come attivi. Per questioni di accessibilità il componente aggiungerà automaticamente <span class=\"visually-hidden\"> attivo</span> in coda al testo degli elementi attivi.`, }, }, }, }"
570
+ "default": "{ render: (args) => html` <it-dropdown label=${args.label} variant=${args.variant}> <it-dropdown-item href=\"#\" active>Attivo</it-dropdown-item> <it-dropdown-item href=\"#\">Non attivo</it-dropdown-item> <it-dropdown-item href=\"#\">Non attivo</it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, decorators: [(Story) => html`<div style=${containerStyle}>${Story()}</div>`], }"
571
571
  },
572
572
  {
573
573
  "kind": "variable",
@@ -575,7 +575,7 @@
575
575
  "type": {
576
576
  "text": "Story"
577
577
  },
578
- "default": "{ name: 'Menu disabilitato', args: { disabled: true }, render: (args) => html` <it-dropdown label=${args.label} ?disabled=${args.disabled} variant=${args.variant}> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, parameters: { ...meta.parameters, docs: { source: { excludeDecorators: true }, description: { story: `Aggiungere l'attributo \\`disabled\\` al dropdown per **disabilitarlo** completamente.`, }, }, }, }"
578
+ "default": "{ args: { disabled: true }, render: (args) => html` <it-dropdown label=${args.label} ?disabled=${args.disabled} variant=${args.variant}> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, }"
579
579
  },
580
580
  {
581
581
  "kind": "variable",
@@ -583,7 +583,7 @@
583
583
  "type": {
584
584
  "text": "Story"
585
585
  },
586
- "default": "{ name: 'Menu con voci disabilitate', render: (args) => html` <it-dropdown label=${args.label} variant=${args.variant}> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\" disabled>Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, parameters: { ...meta.parameters, docs: { source: { excludeDecorators: true }, description: { story: `Aggiungere l'attributo \\`disabled\\` agli elementi del dropdown che si vogliono mostrare come **disabilitati**.`, }, }, }, }"
586
+ "default": "{ render: (args) => html` <it-dropdown label=${args.label} variant=${args.variant}> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\" disabled>Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, decorators: [(Story) => html`<div style=${containerStyle}>${Story()}</div>`], }"
587
587
  },
588
588
  {
589
589
  "kind": "variable",
@@ -591,7 +591,7 @@
591
591
  "type": {
592
592
  "text": "Story"
593
593
  },
594
- "default": "{ name: 'Menu con intestazioni e separatori', render: (args) => html` <it-dropdown label=\"Item con separatore e header\" variant=${args.variant}> <h4 slot=\"header\" class=\"link-list-heading dropdown-header\">Intestazione</h4> <it-dropdown-item href=\"#\">Prima voce</it-dropdown-item> <it-dropdown-item separator></it-dropdown-item> <it-dropdown-item href=\"#\">Dopo separatore</it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['variant']) }, parameters: { ...meta.parameters, docs: { source: { excludeDecorators: true }, description: { story: `All'interno del menu dropdown possono essere inseriti header e separatori.`, }, }, }, }"
594
+ "default": "{ render: (args) => html` <it-dropdown label=\"Apri dropdown\" variant=${args.variant}> <h4 slot=\"header\" class=\"link-list-heading dropdown-header\">Intestazione</h4> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item separator></it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['variant']) }, decorators: [(Story) => html`<div style=${containerStyle}>${Story()}</div>`], }"
595
595
  },
596
596
  {
597
597
  "kind": "variable",
@@ -599,7 +599,7 @@
599
599
  "type": {
600
600
  "text": "Story"
601
601
  },
602
- "default": "{ name: 'Menu con voci grandi', render: (args) => html` <it-dropdown label=${args.label} variant=${args.variant}> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\" large>Grande</it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, parameters: { ...meta.parameters, docs: { source: { excludeDecorators: true }, description: { story: `Per aumentare la dimensione degli elementi contenuti nel dropdown è sufficiente aggiungere agli stessi l'attributo \\`large\\`.`, }, }, }, }"
602
+ "default": "{ render: (args) => html` <it-dropdown label=${args.label} variant=${args.variant}> <it-dropdown-item href=\"#\" large>Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\" large>Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\" large>Azione 3</it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, decorators: [(Story) => html`<div style=${containerStyle}>${Story()}</div>`], }"
603
603
  },
604
604
  {
605
605
  "kind": "variable",
@@ -607,7 +607,7 @@
607
607
  "type": {
608
608
  "text": "Story"
609
609
  },
610
- "default": "{ name: 'Menu a tutta larghezza', args: { 'full-width': true }, render: (args) => html` <it-dropdown label=${args.label} ?disabled=${args.disabled} alignment=${ifDefined(args.alignment)} size=${ifDefined(args.size)} variant=${ifDefined(args.variant)} it-role=${ifDefined(args['it-role'])} ?dark=${args.dark} ?full-width=${args['full-width']} style=\"width: 100%;\" > <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, decorators: [(Story) => html`<div style=\"${containerStyle}min-width:300px\">${Story()}</div>`], parameters: { ...meta.parameters, docs: { source: { excludeDecorators: true }, description: { story: `Per ottenere un dropdown menu largo quanto l’elemento che contiene il dropdown button è sufficiente aggiungere l'attributo \\`full-width\\`. I link e testi contenuti al suo interno saranno disposti in orizzontale.`, }, }, }, }"
610
+ "default": "{ args: { 'full-width': true }, render: (args) => html` <it-dropdown label=${args.label} ?disabled=${args.disabled} alignment=${ifDefined(args.alignment)} size=${ifDefined(args.size)} variant=${ifDefined(args.variant)} it-role=${ifDefined(args['it-role'])} ?dark=${args.dark} ?full-width=${args['full-width']} style=\"width: 100%;\" it-aria-label=${ifDefined(args['it-aria-label'])} > <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, decorators: [(Story) => html`<div style=\"${containerStyle}height:100px;min-width:300px\">${Story()}</div>`], }"
611
611
  },
612
612
  {
613
613
  "kind": "variable",
@@ -615,7 +615,7 @@
615
615
  "type": {
616
616
  "text": "Story"
617
617
  },
618
- "default": "{ name: 'Menu con icona a destra', render: (args) => html` <it-dropdown label=${args.label} variant=${args.variant}> <it-dropdown-item href=\"#\"> Azione 1 <it-icon slot=\"suffix\" name=\"it-star-outline\" size=\"sm\" color=\"primary\"></it-icon> </it-dropdown-item> <it-dropdown-item href=\"#\"> Azione 2 <it-icon slot=\"suffix\" name=\"it-star-outline\" size=\"sm\" color=\"primary\"></it-icon> </it-dropdown-item> <it-dropdown-item href=\"#\"> Azione 3 <it-icon slot=\"suffix\" name=\"it-star-outline\" size=\"sm\" color=\"primary\"></it-icon> </it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, parameters: { ...meta.parameters, docs: { source: { excludeDecorators: true }, description: { story: `Agli elementi contenuti nel menu può essere aggiunta un’icona illustrativa allineata a destra utilizzando lo slot \\`suffix\\``, }, }, }, }"
618
+ "default": "{ render: (args) => html` <it-dropdown label=${args.label} variant=${args.variant}> <it-dropdown-item href=\"#\"> Azione 1 <it-icon slot=\"suffix\" name=\"it-star-outline\" size=\"sm\" color=\"primary\"></it-icon> </it-dropdown-item> <it-dropdown-item href=\"#\"> Azione 2 <it-icon slot=\"suffix\" name=\"it-star-outline\" size=\"sm\" color=\"primary\"></it-icon> </it-dropdown-item> <it-dropdown-item href=\"#\"> Azione 3 <it-icon slot=\"suffix\" name=\"it-star-outline\" size=\"sm\" color=\"primary\"></it-icon> </it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, decorators: [(Story) => html`<div style=${containerStyle}>${Story()}</div>`], }"
619
619
  },
620
620
  {
621
621
  "kind": "variable",
@@ -623,7 +623,7 @@
623
623
  "type": {
624
624
  "text": "Story"
625
625
  },
626
- "default": "{ name: 'Menu con icona a sinistra', render: (args) => html` <it-dropdown label=${args.label} variant=${args.variant}> <it-dropdown-item href=\"#\"> <it-icon slot=\"prefix\" name=\"it-star-outline\" size=\"sm\" color=\"primary\"></it-icon> Azione 1 </it-dropdown-item> <it-dropdown-item href=\"#\"> <it-icon slot=\"prefix\" name=\"it-star-outline\" size=\"sm\" color=\"primary\"></it-icon> Azione 2 </it-dropdown-item> <it-dropdown-item href=\"#\"> <it-icon slot=\"prefix\" name=\"it-star-outline\" size=\"sm\" color=\"primary\"></it-icon> Azione 3 </it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, parameters: { ...meta.parameters, docs: { source: { excludeDecorators: true }, description: { story: `Agli elementi contenuti nel menu può essere aggiunta un’icona illustrativa allineata a sinistra utilizzando lo slot \\`prefix\\``, }, }, }, }"
626
+ "default": "{ render: (args) => html` <it-dropdown label=${args.label} variant=${args.variant}> <it-dropdown-item href=\"#\"> <it-icon slot=\"prefix\" name=\"it-star-outline\" size=\"sm\" color=\"primary\"></it-icon> Azione 1 </it-dropdown-item> <it-dropdown-item href=\"#\"> <it-icon slot=\"prefix\" name=\"it-star-outline\" size=\"sm\" color=\"primary\"></it-icon> Azione 2 </it-dropdown-item> <it-dropdown-item href=\"#\"> <it-icon slot=\"prefix\" name=\"it-star-outline\" size=\"sm\" color=\"primary\"></it-icon> Azione 3 </it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, decorators: [(Story) => html`<div style=${containerStyle}>${Story()}</div>`], }"
627
627
  },
628
628
  {
629
629
  "kind": "variable",
@@ -631,7 +631,7 @@
631
631
  "type": {
632
632
  "text": "Story"
633
633
  },
634
- "default": "{ name: 'Menu scuro', args: { dark: true }, render: (args) => html` <it-dropdown label=${args.label} variant=${args.variant} dark> <h4 slot=\"header\" class=\"link-list-heading dropdown-header\">Intestazione</h4> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item separator></it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, parameters: { ...meta.parameters, docs: { source: { excludeDecorators: true }, description: { story: `Aggiungendo l'attributo \\`dark\\` al dropdown si ottiene una versione con un colore primario scuro. Link ed elementi interni vengono declinati di conseguenza.`, }, }, }, }"
634
+ "default": "{ args: { dark: true }, render: (args) => html` <it-dropdown label=${args.label} variant=${args.variant} dark> <h4 slot=\"header\" class=\"link-list-heading dropdown-header\">Intestazione</h4> <it-dropdown-item href=\"#\">Azione 1</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 2</it-dropdown-item> <it-dropdown-item href=\"#\">Azione 3</it-dropdown-item> </it-dropdown> `, argTypes: { ...disabledControls(['label', 'variant']) }, decorators: [(Story) => html`<div style=\"${containerStyle}height:220px\">${Story()}</div>`], }"
635
635
  }
636
636
  ],
637
637
  "exports": [
@@ -661,9 +661,9 @@
661
661
  },
662
662
  {
663
663
  "kind": "js",
664
- "name": "Direzioni",
664
+ "name": "Posizionamento",
665
665
  "declaration": {
666
- "name": "Direzioni",
666
+ "name": "Posizionamento",
667
667
  "module": "stories/it-dropdown.stories.ts"
668
668
  }
669
669
  },
package/dist/src/index.js CHANGED
@@ -1,8 +1,8 @@
1
1
  export { ItDropdown } from './it-dropdown.js';
2
2
  export { ItDropdownItem } from './it-dropdown-item.js';
3
- import '../form-control-ddGGHusp.js';
3
+ import '../index-xHyGEzqz.js';
4
4
  import 'lit/directive.js';
5
- import 'lit/decorators.js';
6
5
  import 'lit';
6
+ import 'lit/decorators.js';
7
7
  import 'lit/directives/if-defined.js';
8
8
  //# sourceMappingURL=index.js.map
@@ -1,4 +1,4 @@
1
- import { _ as __decorate, a as __metadata, B as BaseComponent } from '../form-control-ddGGHusp.js';
1
+ import { _ as __decorate, a as __metadata, B as BaseComponent } from '../index-xHyGEzqz.js';
2
2
  import { css, html } from 'lit';
3
3
  import { property, customElement } from 'lit/decorators.js';
4
4
  import { ifDefined } from 'lit/directives/if-defined.js';
@@ -493,6 +493,7 @@ var styles = css`/***************************** 1 ******************************
493
493
  }
494
494
 
495
495
  :host {
496
+ --bs-dropdown-animation-speed: \$dropdown-menu-animation-speed;
496
497
  display: block;
497
498
  }
498
499
 
@@ -598,7 +599,7 @@ li span,
598
599
  justify-content: space-between;
599
600
  }
600
601
  .list-item.right-icon .icon {
601
- transition: transform 0.3s;
602
+ transition: transform var(--bs-dropdown-animation-speed);
602
603
  }
603
604
  .list-item.right-icon .icon.secondary {
604
605
  color: var(--bs-icon-secondary);
@@ -1 +1 @@
1
- {"version":3,"file":"it-dropdown-item.js","sources":["../../../src/it-dropdown-item.ts"],"sourcesContent":["import { BaseComponent } from '@italia/globals';\nimport { html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport styles from './dropdown-item.scss';\n\n@customElement('it-dropdown-item')\nexport class ItDropdownItem extends BaseComponent {\n static styles = styles;\n\n @property({ type: String }) label = '';\n\n @property({ type: String }) value = '';\n\n @property({ type: String }) href?: string;\n\n @property({ type: Boolean, reflect: true }) active = false;\n\n @property({ type: Boolean, reflect: true }) large = false;\n\n @property({ type: Boolean, reflect: true }) separator = false;\n\n @property({ type: Boolean, reflect: true }) dark = false;\n\n @property({ type: Boolean, attribute: 'full-width', reflect: true }) fullWidth = false;\n\n @property({ type: String, attribute: 'it-role' }) itRole?: string;\n\n @property({ type: Boolean, reflect: true }) disabled?: boolean;\n\n public getFocusableElement(): HTMLElement | null {\n return this.shadowRoot?.querySelector('a, button') ?? null;\n }\n\n handlePress(event: KeyboardEvent | MouseEvent) {\n if (this.disabled) event.preventDefault();\n }\n\n override render() {\n if (this.separator) {\n return html`<li><span class=\"divider\" role=\"separator\"></span></li>`;\n }\n\n const itemClasses = this.composeClass({\n dark: this.dark,\n fw: this.fullWidth,\n });\n\n const linkClasses = this.composeClass('list-item', 'dropdown-item', {\n disabled: this.disabled,\n active: this.active,\n large: this.large,\n });\n\n const content = html`\n <slot name=\"prefix\"></slot>\n <slot>${this.label}${this.active ? html`<span class=\"visually-hidden\"> attivo</span>` : null}</slot>\n <slot name=\"suffix\"></slot>\n `;\n\n return html`\n <li\n role=\"${ifDefined(\n this.itRole === 'menuitem' || this.itRole === 'option' || this.itRole === 'treeitem' ? 'none' : undefined,\n )}\"\n class=${ifDefined(itemClasses || undefined)}\n >\n ${this.href\n ? html`<a\n class=${linkClasses}\n part=\"focusable\"\n href=${this.href}\n role=${ifDefined(this.itRole)}\n aria-disabled=${ifDefined(this.disabled || undefined)}\n @keydown=${this.handlePress}\n @click=${this.handlePress}\n ><span>${content}</span></a\n >`\n : html`<span class=\"dropdown-item-text\">${content}</span>`}\n </li>\n `;\n }\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"it-dropdown-item.js","sources":["../../../src/it-dropdown-item.ts"],"sourcesContent":["import { BaseComponent } from '@italia/globals';\nimport { html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport styles from './dropdown-item.scss';\n\n@customElement('it-dropdown-item')\nexport class ItDropdownItem extends BaseComponent {\n static styles = styles;\n\n @property({ type: String }) label = '';\n\n @property({ type: String }) value = '';\n\n @property({ type: String }) href?: string;\n\n @property({ type: Boolean, reflect: true }) active = false;\n\n @property({ type: Boolean, reflect: true }) large = false;\n\n @property({ type: Boolean, reflect: true }) separator = false;\n\n @property({ type: Boolean, reflect: true }) dark = false;\n\n @property({ type: Boolean, attribute: 'full-width', reflect: true }) fullWidth = false;\n\n @property({ type: String, attribute: 'it-role' }) itRole?: string;\n\n @property({ type: Boolean, reflect: true }) disabled?: boolean;\n\n public getFocusableElement(): HTMLElement | null {\n return this.shadowRoot?.querySelector('a, button') ?? null;\n }\n\n handlePress(event: KeyboardEvent | MouseEvent) {\n if (this.disabled) event.preventDefault();\n }\n\n override render() {\n if (this.separator) {\n return html`<li><span class=\"divider\" role=\"separator\"></span></li>`;\n }\n\n const itemClasses = this.composeClass({\n dark: this.dark,\n fw: this.fullWidth,\n });\n\n const linkClasses = this.composeClass('list-item', 'dropdown-item', {\n disabled: this.disabled,\n active: this.active,\n large: this.large,\n });\n\n const content = html`\n <slot name=\"prefix\"></slot>\n <slot>${this.label}${this.active ? html`<span class=\"visually-hidden\"> attivo</span>` : null}</slot>\n <slot name=\"suffix\"></slot>\n `;\n\n return html`\n <li\n role=\"${ifDefined(\n this.itRole === 'menuitem' || this.itRole === 'option' || this.itRole === 'treeitem' ? 'none' : undefined,\n )}\"\n class=${ifDefined(itemClasses || undefined)}\n >\n ${this.href\n ? html`<a\n class=${linkClasses}\n part=\"focusable\"\n href=${this.href}\n role=${ifDefined(this.itRole)}\n aria-disabled=${ifDefined(this.disabled || undefined)}\n @keydown=${this.handlePress}\n @click=${this.handlePress}\n ><span>${content}</span></a\n >`\n : html`<span class=\"dropdown-item-text\">${content}</span>`}\n </li>\n `;\n }\n}\n"],"names":[],"mappings":"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"}
@@ -5,6 +5,8 @@ export declare class ItDropdown extends BaseComponent {
5
5
  static styles: import("lit").CSSResultGroup;
6
6
  static shadowRootOptions: {
7
7
  delegatesFocus: boolean;
8
+ clonable?: boolean;
9
+ customElementRegistry?: CustomElementRegistry;
8
10
  mode: ShadowRootMode;
9
11
  serializable?: boolean;
10
12
  slotAssignment?: SlotAssignmentMode;
@@ -1 +1 @@
1
- {"version":3,"file":"it-dropdown.d.ts","sourceRoot":"","sources":["../../src/it-dropdown.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAA8B,MAAM,iBAAiB,CAAC;AAO5E,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACxB,KAAK,OAAO,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC;AAEpF,qBACa,UAAW,SAAQ,aAAa;IAC3C,MAAM,CAAC,MAAM,+BAAU;IAEvB,OAAgB,iBAAiB;;;;;MAG/B;IAE0B,KAAK,CAAC,EAAE,MAAM,CAAC;IAEC,QAAQ,UAAS;IAEjC,IAAI,CAAC,EAAE,IAAI,CAAC;IAEZ,OAAO,CAAC,EAAE,OAAO,CAAa;IAE9B,SAAS,EAAE,MAAM,CAAkB;IAElC,IAAI,UAAS;IAE2B,SAAS,UAAS;IAErC,MAAM,EAAE,MAAM,CAAU;IAElB,WAAW,EAAE,MAAM,CAAM;IAExE,OAAO,CAAC,YAAY,CAAS;IAEtC,OAAO,CAAC,SAAS,CAAkC;IAEnD,OAAO,CAAC,OAAO,CAAuC;IAE3B,OAAO,CAAC,OAAO,CAAmB;IAE7D,OAAO,CAAC,QAAQ,CAAwC;IAExD,OAAO,KAAK,UAAU,GAErB;IAED,OAAO,CAAC,eAAe,CAGrB;IAEF,OAAO,CAAC,cAAc,CAEpB;IAEF,OAAO,CAAC,eAAe,CAErB;IAEF,OAAO,KAAK,UAAU,GAKrB;IAED,OAAO,CAAC,sBAAsB;IAY9B,OAAO,CAAC,UAAU,CAqDhB;cAEiB,OAAO;IAK1B,MAAM;CAsEP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
1
+ {"version":3,"file":"it-dropdown.d.ts","sourceRoot":"","sources":["../../src/it-dropdown.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAA8B,MAAM,iBAAiB,CAAC;AAO5E,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACxB,KAAK,OAAO,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC;AAEpF,qBACa,UAAW,SAAQ,aAAa;IAC3C,MAAM,CAAC,MAAM,+BAAU;IAEvB,OAAgB,iBAAiB;;;;;;;MAG/B;IAE0B,KAAK,CAAC,EAAE,MAAM,CAAC;IAEC,QAAQ,UAAS;IAEjC,IAAI,CAAC,EAAE,IAAI,CAAC;IAEZ,OAAO,CAAC,EAAE,OAAO,CAAa;IAE9B,SAAS,EAAE,MAAM,CAAkB;IAElC,IAAI,UAAS;IAE2B,SAAS,UAAS;IAErC,MAAM,EAAE,MAAM,CAAU;IAElB,WAAW,EAAE,MAAM,CAAM;IAExE,OAAO,CAAC,YAAY,CAAS;IAEtC,OAAO,CAAC,SAAS,CAAkC;IAEnD,OAAO,CAAC,OAAO,CAAuC;IAE3B,OAAO,CAAC,OAAO,CAAmB;IAE7D,OAAO,CAAC,QAAQ,CAAwC;IAExD,OAAO,KAAK,UAAU,GAErB;IAED,OAAO,CAAC,eAAe,CAGrB;IAEF,OAAO,CAAC,cAAc,CAEpB;IAEF,OAAO,CAAC,eAAe,CAErB;IAEF,OAAO,KAAK,UAAU,GAKrB;IAED,OAAO,CAAC,sBAAsB;IAY9B,OAAO,CAAC,UAAU,CAqDhB;cAEiB,OAAO;IAK1B,MAAM;CAiEP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
@@ -1,4 +1,4 @@
1
- import { _ as __decorate, a as __metadata, B as BaseComponent } from '../form-control-ddGGHusp.js';
1
+ import { _ as __decorate, a as __metadata, B as BaseComponent } from '../index-xHyGEzqz.js';
2
2
  import { css, LitElement, nothing, html } from 'lit';
3
3
  import { property, state, query, customElement } from 'lit/decorators.js';
4
4
  import { ifDefined } from 'lit/directives/if-defined.js';
@@ -768,6 +768,7 @@ var styles = css`/***************************** 1 ******************************
768
768
  :host {
769
769
  position: relative;
770
770
  display: inline-block;
771
+ --bs-dropdown-animation-speed: 0.3s;
771
772
  --bs-icon-default: currentColor;
772
773
  }
773
774
 
@@ -776,14 +777,26 @@ it-popover {
776
777
  display: inline-flex;
777
778
  }
778
779
 
779
- .dropdown-toggle-icon.top {
780
+ .dropdown-toggle .icon-expand.top {
780
781
  transform: scaleY(-1);
781
782
  }
782
- .dropdown-toggle-icon.left {
783
+ .dropdown-toggle .icon-expand.left {
783
784
  transform: rotate(90deg);
784
785
  }
785
- .dropdown-toggle-icon.right {
786
+ .dropdown-toggle .icon-expand.right {
786
787
  transform: rotate(-90deg);
788
+ }
789
+ .dropdown-toggle[it-aria-expanded] .icon-expand {
790
+ transform: scaleY(-1);
791
+ }
792
+ .dropdown-toggle[it-aria-expanded] .icon-expand.top {
793
+ transform: scaleY(1);
794
+ }
795
+ .dropdown-toggle[it-aria-expanded] .icon-expand.left {
796
+ transform: rotate(-90deg);
797
+ }
798
+ .dropdown-toggle[it-aria-expanded] .icon-expand.right {
799
+ transform: rotate(90deg);
787
800
  }`;
788
801
 
789
802
  let ItDropdown = class ItDropdown extends BaseComponent {
@@ -850,7 +863,7 @@ let ItDropdown = class ItDropdown extends BaseComponent {
850
863
  this._ariaNav.handleKeyDown(event);
851
864
  };
852
865
  if (['ArrowDown', 'ArrowUp'].includes(event.key)) {
853
- if (!this._popoverOpen && currentIndex === -1) {
866
+ if (!this.disabled && !this._popoverOpen && currentIndex === -1) {
854
867
  this.addEventListener('it-popover-open', handle, { once: true });
855
868
  this._popoverOpen = true;
856
869
  return;
@@ -899,7 +912,7 @@ let ItDropdown = class ItDropdown extends BaseComponent {
899
912
  <it-button
900
913
  id=${this._buttonId}
901
914
  slot="trigger"
902
- ?it-aria-disabled="${this.disabled}"
915
+ ?disabled="${this.disabled}"
903
916
  type="button"
904
917
  variant=${ifDefined(this.variant)}
905
918
  size=${ifDefined(this.size)}
@@ -912,18 +925,13 @@ let ItDropdown = class ItDropdown extends BaseComponent {
912
925
  it-aria-controls=${this._popoverOpen ? this._menuId : nothing}
913
926
  >
914
927
  ${this.alignment.startsWith('left')
915
- ? html `<it-icon
916
- name=${this._popoverOpen ? 'it-collapse' : 'it-expand'}
917
- class="dropdown-toggle-icon left"
918
- size="sm"
919
- exportparts="icon"
920
- ></it-icon>`
928
+ ? html `<it-icon name="it-expand" class="icon-expand left" size="sm" exportparts="icon"></it-icon>`
921
929
  : ''}
922
930
  ${this.label}
923
931
  ${!this.alignment.startsWith('left')
924
932
  ? html `<it-icon
925
- name=${this._popoverOpen ? 'it-collapse' : 'it-expand'}
926
- class=${this.composeClass('dropdown-toggle-icon', {
933
+ name="it-expand"
934
+ class=${this.composeClass('icon-expand', {
927
935
  right: this.alignment.startsWith('right'),
928
936
  top: this.alignment.startsWith('top'),
929
937
  })}
@@ -1 +1 @@
1
- {"version":3,"file":"it-dropdown.js","sources":["../../../globals/dist/src/controllers/aria-keyboard-list-controller.js","../../../src/it-dropdown.ts"],"sourcesContent":["class AriaKeyboardListController {\n constructor(host) {\n this.host = host;\n this.host.addController(this);\n }\n setConfig(config) {\n this.config = config;\n }\n hostDisconnected() {\n this.host.removeController(this);\n }\n // eslint-disable-next-line class-methods-use-this\n getActiveElement() {\n let active = document.activeElement;\n while (active && active.shadowRoot && active.shadowRoot.activeElement) {\n active = active.shadowRoot.activeElement;\n }\n return active;\n }\n handleKeyDown(event) {\n if (!this.config)\n return;\n const items = this.config.getItems();\n const currentIndex = items.indexOf(this.getActiveElement());\n switch (event.key) {\n case 'ArrowDown':\n // case 'ArrowRight':\n event.preventDefault();\n if (items.length && currentIndex < items.length - 1)\n this.config.setActive(currentIndex < 0 ? 0 : currentIndex + 1);\n break;\n case 'ArrowUp':\n // case 'ArrowLeft':\n event.preventDefault();\n if (items.length)\n this.config.setActive(currentIndex < 0 ? items.length - 1 : currentIndex - 1);\n break;\n case 'Home':\n event.preventDefault();\n if (items.length)\n this.config.setActive(0);\n break;\n case 'End':\n event.preventDefault();\n if (items.length)\n this.config.setActive(items.length - 1);\n break;\n case 'Escape':\n event.preventDefault();\n this.config.closeMenu();\n break;\n default:\n break;\n }\n }\n}\nexport default AriaKeyboardListController;\n//# sourceMappingURL=aria-keyboard-list-controller.js.map","/* eslint-disable lit-a11y/list */\nimport { BaseComponent, AriaKeyboardListController } from '@italia/globals';\nimport { html, LitElement, nothing } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport styles from './dropdown.scss';\nimport { type ItDropdownItem } from './it-dropdown-item.js';\n\ntype Size = 'sm' | 'lg';\ntype Variant = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'light';\n\n@customElement('it-dropdown')\nexport class ItDropdown extends BaseComponent {\n static styles = styles;\n\n static override shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n @property({ type: String }) label?: string;\n\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n @property({ type: String }) size?: Size;\n\n @property({ type: String }) variant?: Variant = 'primary';\n\n @property({ type: String }) alignment: string = 'bottom-start';\n\n @property({ type: Boolean }) dark = false;\n\n @property({ type: Boolean, attribute: 'full-width', reflect: true }) fullWidth = false;\n\n @property({ type: String, attribute: 'it-role' }) itRole: string = 'menu';\n\n @property({ type: String, attribute: 'it-aria-label' }) itAriaLabel: string = '';\n\n @state() private _popoverOpen = false;\n\n private _buttonId = this.generateId('it-dropdown');\n\n private _menuId = this.generateId('it-dropdown-menu');\n\n @query('slot:not([name])') private _slotEl!: HTMLSlotElement;\n\n private _ariaNav = new AriaKeyboardListController(this);\n\n private get _triggerEl(): HTMLElement | null {\n return this.shadowRoot?.getElementById(this._buttonId) ?? null;\n }\n\n private _onTriggerClick = () => {\n if (this.disabled) return;\n this._popoverOpen = !this._popoverOpen;\n };\n\n private _onPopoverOpen = () => {\n this._popoverOpen = true;\n };\n\n private _onPopoverClose = () => {\n this._popoverOpen = false;\n };\n\n private get _menuItems() {\n if (!this._slotEl) return [];\n return this._slotEl\n .assignedElements({ flatten: true })\n .filter((el) => el.tagName === 'IT-DROPDOWN-ITEM') as ItDropdownItem[];\n }\n\n private _setChildrenProperties() {\n for (const item of this._menuItems) {\n item.dark = this.dark;\n item.fullWidth = this.fullWidth;\n\n if (this.itRole === 'menu') item.itRole = 'menuitem';\n else if (this.itRole === 'listbox') item.itRole = 'option';\n else if (this.itRole === 'tree') item.itRole = 'treeitem';\n else item.itRole = undefined;\n }\n }\n\n private _onKeyDown = (event: KeyboardEvent) => {\n const items = this._menuItems.map((item) => item.getFocusableElement()).filter((el) => !!el);\n const active = this.getActiveElement<ItDropdownItem>();\n if (!active) return;\n\n const currentIndex = items.indexOf(active);\n\n if (event.key === 'Tab') {\n if (event.shiftKey && currentIndex === -1) {\n this._popoverOpen = false;\n }\n if (!event.shiftKey && currentIndex === items.length - 1) {\n this._popoverOpen = false;\n }\n if (active.ariaDisabled) {\n // as of the day of this implementation, tabbing through disabled items doesn't work natively\n // maybe because of some web components behavior\n if (event.shiftKey) {\n this._ariaNav.handleKeyDown(new KeyboardEvent('keydown', { ...event, key: 'ArrowUp' }));\n } else {\n this._ariaNav.handleKeyDown(new KeyboardEvent('keydown', { ...event, key: 'ArrowDown' }));\n }\n }\n }\n\n const handle = () => {\n this._ariaNav.setConfig({\n getItems: () => items,\n setActive: (idx) => items[idx]?.focus(),\n closeMenu: () => {\n this.addEventListener(\n 'it-popover-close',\n () => {\n this._triggerEl?.focus();\n },\n { once: true, capture: true },\n );\n this._popoverOpen = false;\n },\n trigger: this._triggerEl,\n });\n\n this._ariaNav.handleKeyDown(event);\n };\n\n if (['ArrowDown', 'ArrowUp'].includes(event.key)) {\n if (!this._popoverOpen && currentIndex === -1) {\n this.addEventListener('it-popover-open', handle, { once: true });\n this._popoverOpen = true;\n return;\n }\n }\n handle();\n };\n\n protected override updated() {\n this._setChildrenProperties();\n }\n\n // https://github.com/primefaces/primeng/issues/14851 for conditional aria controls\n render() {\n return html`\n <it-popover\n placement=${this.alignment}\n @it-popover-open=${this._onPopoverOpen}\n @it-popover-close=${this._onPopoverClose}\n exportparts=\"focusable, icon, button\"\n ?open=${this._popoverOpen}\n >\n <it-button\n id=${this._buttonId}\n slot=\"trigger\"\n ?it-aria-disabled=\"${this.disabled}\"\n type=\"button\"\n variant=${ifDefined(this.variant)}\n size=${ifDefined(this.size)}\n @click=${this._onTriggerClick}\n @keydown=${{ handleEvent: this._onKeyDown, capture: true }}\n class=\"dropdown-toggle\"\n it-aria-label=${ifDefined(this.itAriaLabel ? this.itAriaLabel : undefined)}\n exportparts=\"focusable, button\"\n it-aria-haspopup=\"${this.itRole === 'list' ? 'true' : this.itRole}\"\n it-aria-controls=${this._popoverOpen ? this._menuId : nothing}\n >\n ${this.alignment.startsWith('left')\n ? html`<it-icon\n name=${this._popoverOpen ? 'it-collapse' : 'it-expand'}\n class=\"dropdown-toggle-icon left\"\n size=\"sm\"\n exportparts=\"icon\"\n ></it-icon>`\n : ''}\n ${this.label}\n ${!this.alignment.startsWith('left')\n ? html`<it-icon\n name=${this._popoverOpen ? 'it-collapse' : 'it-expand'}\n class=${this.composeClass('dropdown-toggle-icon', {\n right: this.alignment.startsWith('right'),\n top: this.alignment.startsWith('top'),\n })}\n exportparts=\"icon\"\n size=\"sm\"\n ></it-icon>`\n : ''}\n </it-button>\n <div\n slot=\"content\"\n class=\"${this.composeClass('dropdown-menu', {\n show: this._popoverOpen,\n dark: this.dark,\n 'full-width': this.fullWidth,\n })}\"\n aria-labelledby=${this._buttonId}\n >\n <div class=\"link-list-wrapper\">\n <slot name=\"header\"></slot>\n <ul\n id=${this._menuId}\n class=\"link-list\"\n role=${ifDefined(this.itRole !== 'list' ? this.itRole : undefined)}\n @keydown=${{ handleEvent: this._onKeyDown, capture: true }}\n aria-orientation=${ifDefined(this.fullWidth ? 'horizontal' : undefined)}\n >\n <slot @slotchange=${this._setChildrenProperties}></slot>\n </ul>\n </div>\n </div>\n </it-popover>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'it-dropdown': ItDropdown;\n }\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"it-dropdown.js","sources":["../../../globals/dist/src/controllers/aria-keyboard-list-controller.js","../../../src/it-dropdown.ts"],"sourcesContent":["class AriaKeyboardListController {\n constructor(host) {\n this.host = host;\n this.host.addController(this);\n }\n setConfig(config) {\n this.config = config;\n }\n hostDisconnected() {\n this.host.removeController(this);\n }\n // eslint-disable-next-line class-methods-use-this\n getActiveElement() {\n let active = document.activeElement;\n while (active && active.shadowRoot && active.shadowRoot.activeElement) {\n active = active.shadowRoot.activeElement;\n }\n return active;\n }\n handleKeyDown(event) {\n if (!this.config)\n return;\n const items = this.config.getItems();\n const currentIndex = items.indexOf(this.getActiveElement());\n switch (event.key) {\n case 'ArrowDown':\n // case 'ArrowRight':\n event.preventDefault();\n if (items.length && currentIndex < items.length - 1)\n this.config.setActive(currentIndex < 0 ? 0 : currentIndex + 1);\n break;\n case 'ArrowUp':\n // case 'ArrowLeft':\n event.preventDefault();\n if (items.length)\n this.config.setActive(currentIndex < 0 ? items.length - 1 : currentIndex - 1);\n break;\n case 'Home':\n event.preventDefault();\n if (items.length)\n this.config.setActive(0);\n break;\n case 'End':\n event.preventDefault();\n if (items.length)\n this.config.setActive(items.length - 1);\n break;\n case 'Escape':\n event.preventDefault();\n this.config.closeMenu();\n break;\n default:\n break;\n }\n }\n}\nexport default AriaKeyboardListController;\n//# sourceMappingURL=aria-keyboard-list-controller.js.map","/* eslint-disable lit-a11y/list */\nimport { BaseComponent, AriaKeyboardListController } from '@italia/globals';\nimport { html, LitElement, nothing } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport styles from './dropdown.scss';\nimport { type ItDropdownItem } from './it-dropdown-item.js';\n\ntype Size = 'sm' | 'lg';\ntype Variant = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'light';\n\n@customElement('it-dropdown')\nexport class ItDropdown extends BaseComponent {\n static styles = styles;\n\n static override shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n @property({ type: String }) label?: string;\n\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n @property({ type: String }) size?: Size;\n\n @property({ type: String }) variant?: Variant = 'primary';\n\n @property({ type: String }) alignment: string = 'bottom-start';\n\n @property({ type: Boolean }) dark = false;\n\n @property({ type: Boolean, attribute: 'full-width', reflect: true }) fullWidth = false;\n\n @property({ type: String, attribute: 'it-role' }) itRole: string = 'menu';\n\n @property({ type: String, attribute: 'it-aria-label' }) itAriaLabel: string = '';\n\n @state() private _popoverOpen = false;\n\n private _buttonId = this.generateId('it-dropdown');\n\n private _menuId = this.generateId('it-dropdown-menu');\n\n @query('slot:not([name])') private _slotEl!: HTMLSlotElement;\n\n private _ariaNav = new AriaKeyboardListController(this);\n\n private get _triggerEl(): HTMLElement | null {\n return this.shadowRoot?.getElementById(this._buttonId) ?? null;\n }\n\n private _onTriggerClick = () => {\n if (this.disabled) return;\n this._popoverOpen = !this._popoverOpen;\n };\n\n private _onPopoverOpen = () => {\n this._popoverOpen = true;\n };\n\n private _onPopoverClose = () => {\n this._popoverOpen = false;\n };\n\n private get _menuItems() {\n if (!this._slotEl) return [];\n return this._slotEl\n .assignedElements({ flatten: true })\n .filter((el) => el.tagName === 'IT-DROPDOWN-ITEM') as ItDropdownItem[];\n }\n\n private _setChildrenProperties() {\n for (const item of this._menuItems) {\n item.dark = this.dark;\n item.fullWidth = this.fullWidth;\n\n if (this.itRole === 'menu') item.itRole = 'menuitem';\n else if (this.itRole === 'listbox') item.itRole = 'option';\n else if (this.itRole === 'tree') item.itRole = 'treeitem';\n else item.itRole = undefined;\n }\n }\n\n private _onKeyDown = (event: KeyboardEvent) => {\n const items = this._menuItems.map((item) => item.getFocusableElement()).filter((el) => !!el);\n const active = this.getActiveElement<ItDropdownItem>();\n if (!active) return;\n\n const currentIndex = items.indexOf(active);\n\n if (event.key === 'Tab') {\n if (event.shiftKey && currentIndex === -1) {\n this._popoverOpen = false;\n }\n if (!event.shiftKey && currentIndex === items.length - 1) {\n this._popoverOpen = false;\n }\n if (active.ariaDisabled) {\n // as of the day of this implementation, tabbing through disabled items doesn't work natively\n // maybe because of some web components behavior\n if (event.shiftKey) {\n this._ariaNav.handleKeyDown(new KeyboardEvent('keydown', { ...event, key: 'ArrowUp' }));\n } else {\n this._ariaNav.handleKeyDown(new KeyboardEvent('keydown', { ...event, key: 'ArrowDown' }));\n }\n }\n }\n\n const handle = () => {\n this._ariaNav.setConfig({\n getItems: () => items,\n setActive: (idx) => items[idx]?.focus(),\n closeMenu: () => {\n this.addEventListener(\n 'it-popover-close',\n () => {\n this._triggerEl?.focus();\n },\n { once: true, capture: true },\n );\n this._popoverOpen = false;\n },\n trigger: this._triggerEl,\n });\n\n this._ariaNav.handleKeyDown(event);\n };\n\n if (['ArrowDown', 'ArrowUp'].includes(event.key)) {\n if (!this.disabled && !this._popoverOpen && currentIndex === -1) {\n this.addEventListener('it-popover-open', handle, { once: true });\n this._popoverOpen = true;\n return;\n }\n }\n handle();\n };\n\n protected override updated() {\n this._setChildrenProperties();\n }\n\n // https://github.com/primefaces/primeng/issues/14851 for conditional aria controls\n render() {\n return html`\n <it-popover\n placement=${this.alignment}\n @it-popover-open=${this._onPopoverOpen}\n @it-popover-close=${this._onPopoverClose}\n exportparts=\"focusable, icon, button\"\n ?open=${this._popoverOpen}\n >\n <it-button\n id=${this._buttonId}\n slot=\"trigger\"\n ?disabled=\"${this.disabled}\"\n type=\"button\"\n variant=${ifDefined(this.variant)}\n size=${ifDefined(this.size)}\n @click=${this._onTriggerClick}\n @keydown=${{ handleEvent: this._onKeyDown, capture: true }}\n class=\"dropdown-toggle\"\n it-aria-label=${ifDefined(this.itAriaLabel ? this.itAriaLabel : undefined)}\n exportparts=\"focusable, button\"\n it-aria-haspopup=\"${this.itRole === 'list' ? 'true' : this.itRole}\"\n it-aria-controls=${this._popoverOpen ? this._menuId : nothing}\n >\n ${this.alignment.startsWith('left')\n ? html`<it-icon name=\"it-expand\" class=\"icon-expand left\" size=\"sm\" exportparts=\"icon\"></it-icon>`\n : ''}\n ${this.label}\n ${!this.alignment.startsWith('left')\n ? html`<it-icon\n name=\"it-expand\"\n class=${this.composeClass('icon-expand', {\n right: this.alignment.startsWith('right'),\n top: this.alignment.startsWith('top'),\n })}\n exportparts=\"icon\"\n size=\"sm\"\n ></it-icon>`\n : ''}\n </it-button>\n <div\n slot=\"content\"\n class=\"${this.composeClass('dropdown-menu', {\n show: this._popoverOpen,\n dark: this.dark,\n 'full-width': this.fullWidth,\n })}\"\n aria-labelledby=${this._buttonId}\n >\n <div class=\"link-list-wrapper\">\n <slot name=\"header\"></slot>\n <ul\n id=${this._menuId}\n class=\"link-list\"\n role=${ifDefined(this.itRole !== 'list' ? this.itRole : undefined)}\n @keydown=${{ handleEvent: this._onKeyDown, capture: true }}\n aria-orientation=${ifDefined(this.fullWidth ? 'horizontal' : undefined)}\n >\n <slot @slotchange=${this._setChildrenProperties}></slot>\n </ul>\n </div>\n </div>\n </it-popover>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'it-dropdown': ItDropdown;\n }\n}\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@italia/dropdown",
3
3
  "description": "Web component it-dropdown del Design system .italia",
4
- "version": "0.1.0-alpha.2",
4
+ "version": "1.0.0-alpha.4",
5
5
  "publishConfig": {
6
6
  "access": "public"
7
7
  },
@@ -35,12 +35,9 @@
35
35
  "custom-elements.json"
36
36
  ],
37
37
  "dependencies": {
38
- "bootstrap-italia": "github:italia/bootstrap-italia#5ca55d534319deb559e1860fb0bc121113a78ebf",
38
+ "bootstrap-italia": "github:italia/bootstrap-italia#ba6eddb24194f44d1080deb24701e0603457d176",
39
39
  "lit": "^3.3.0",
40
- "@italia/button": "^0.1.0-alpha.2",
41
- "@italia/globals": "^0.1.0-alpha.2",
42
- "@italia/icon": "^0.1.0-alpha.2",
43
- "@italia/popover": "^0.1.0-alpha.2"
40
+ "@italia/globals": "^1.0.0-alpha.4"
44
41
  },
45
42
  "devDependencies": {
46
43
  "@custom-elements-manifest/analyzer": "^0.10.3",
@@ -55,9 +52,17 @@
55
52
  "sass": "^1.89.0",
56
53
  "tslib": "^2.6.3",
57
54
  "typescript": "^5.5.3",
55
+ "@italia/button": "^1.0.0-alpha.4",
56
+ "@italia/icon": "^1.0.0-alpha.4",
57
+ "@italia/popover": "^1.0.0-alpha.4",
58
58
  "@italia/test-config": "^0.0.0",
59
59
  "@italia/typescript-config": "^0.0.0"
60
60
  },
61
+ "peerDependencies": {
62
+ "@italia/button": "^1.0.0-alpha.4",
63
+ "@italia/icon": "^1.0.0-alpha.4",
64
+ "@italia/popover": "^1.0.0-alpha.4"
65
+ },
61
66
  "customElements": "custom-elements.json",
62
67
  "scripts": {
63
68
  "analyze": "cem analyze --litelement --exclude dist",