@massimo-cassandro/minimo 1.41.4 → 1.41.6

package/src/components/modal-alert/modal-alert.js

@@ -10,7 +10,7 @@ import warningIcon from './svg/warning.svg?inline';
 import errorIcon from './svg/error.svg?inline';
 import dangerIcon from './svg/danger.svg?inline';
 
-// backward compatibility: legacy snake_case param names mapped to their camelCase equivalent
+// retrocompatibilità: i vecchi nomi di parametro snake_case sono mappati sul rispettivo equivalente camelCase
 const legacyParamNames = {
   extra_class: 'extraClass',
   heading_class: 'headingClass',
@@ -31,7 +31,7 @@ const legacyParamNames = {
 
 const defaults = {
 
-  // settings applied to all dialog types; can be overridden per type
+  // impostazioni applicate a tutti i tipi di dialog; sovrascrivibili per tipo
   globals: {
     extraClass: null,
     onOpen: null,
@@ -49,7 +49,7 @@ const defaults = {
     useAltIcon: false,
     type: null,
 
-    // extra btn markup, ignored on confirm
+    // markup del pulsante extra, ignorato su confirm
     extraBtn: null,
     extraBtnFocus: true
   },
@@ -76,7 +76,7 @@ const defaults = {
     okBtnClass: 'btn btn-warning',
     icon: warningIcon,
     altIcon: dangerIcon,
-    useAltIcon: false // when true, uses altIcon (danger) instead of the default warning icon
+    useAltIcon: false // se true, usa altIcon (danger) invece dell'icona warning predefinita
   },
   info: {
     type: 'info',
@@ -90,79 +90,79 @@ const defaults = {
     title: 'Confermi?',
     okBtnText: 'OK',
     cancelBtnText: 'Annulla',
-    cancelBtnFocus: true, // false to give focus to the ok button
+    cancelBtnFocus: true, // false per dare il focus al pulsante ok
     okBtnClass: classnames('btn', styles.btnConfirm),
     cancelBtnClass: classnames('btn', styles.btnConfirm, styles.btnHollow),
     icon: confirmIcon,
     altIcon: warningIcon,
-    useAltIcon: false // when true, uses altIcon (warning) instead of the default confirm icon
+    useAltIcon: false // se true, usa altIcon (warning) invece dell'icona confirm predefinita
   }
 
 };
 
 /**
  * @typedef {Object} ModalAlertParams
- * @property {string} [type] - Dialog type: `success`, `error`, `warning`, `info`, or `confirm`.
- * @property {string | null} [title] - title text
- * @property {string | null} [mes] - text message (plain or html) (default: null)
- * @property {((arg?: *) => void) | null} [callback] - optional callback dialog after user choice (default: null)
- * @property {number | null} [timer] - timer for autoclose (ms). `null` for disable (default: null, except type 'success' which defaults to 4000)
- * @property {(() => void) | null} [onOpen] - optional callback on dialog open (default: null)
- * @property {(() => void) | null} [onClose] - optional callback on dialog close (default: null)
- * @property {string | null} [extraClass] - optional dialog extra class (default: null)
- * @property {string} [okBtnText] - text for 'ok' button (default: 'OK')
- * @property {string} [okBtnClass] - alternative class for 'ok' button. It replaces the default one
- * @property {string} [cancelBtnText] - text for 'cancel' button (default: 'Annulla', type 'confirm' only)
- * @property {string} [cancelBtnClass] - alternative class for 'cancel' button. It replaces the default one
- * @property {boolean} [cancelBtnFocus] - true if the cancel button should be focused when the dialog box opens. It has no effect if an extraBtn is set (default: true, type 'confirm' only)
- * @property {string | null} [headingClass] - optional extra class for heading (default: null)
- * @property {DomBuilderItem | null} [extraBtn] - optional extra button (as domBuilder object) (default: null)
- * @property {boolean} [extraBtnFocus] - true if the extra button should be focused when the dialog box opens (overrides any focus assigned to the 'cancel' button) (default: true)
- * @property {boolean} [animation] - if true, dialog will be animated (default: true)
- * @property {boolean} [showMarks] - if true, mark iconswill be showed (default: true)
- * @property {string | null} [textClass] - optional extra class for text (default: null)
- * @property {string | null} [icon] - Icon markup used for the dialog; defaults to the type's icon.
- * @property {string | null} [altIcon] - Alternate icon markup, used instead of `icon` when `useAltIcon` is `true`.
- * @property {boolean} [useAltIcon] - When `true`, uses `altIcon` instead of `icon` (e.g. the `danger` icon on a `warning` dialog, or the `warning` icon on a `confirm` dialog). (default: false)
+ * @property {string} [type] - Tipo di dialog: `success`, `error`, `warning`, `info` o `confirm`.
+ * @property {string | null} [title] - testo del titolo
+ * @property {string | null} [mes] - messaggio di testo (semplice o html) (default: null)
+ * @property {((arg?: *) => void) | null} [callback] - callback opzionale invocata dopo la scelta dell'utente (default: null)
+ * @property {number | null} [timer] - timer di chiusura automatica (ms). `null` per disattivarlo (default: null, tranne il tipo 'success' che ha 4000)
+ * @property {(() => void) | null} [onOpen] - callback opzionale all'apertura del dialog (default: null)
+ * @property {(() => void) | null} [onClose] - callback opzionale alla chiusura del dialog (default: null)
+ * @property {string | null} [extraClass] - classe extra opzionale del dialog (default: null)
+ * @property {string} [okBtnText] - testo del pulsante 'ok' (default: 'OK')
+ * @property {string} [okBtnClass] - classe alternativa per il pulsante 'ok'. Sostituisce quella predefinita
+ * @property {string} [cancelBtnText] - testo del pulsante 'cancel' (default: 'Annulla', solo tipo 'confirm')
+ * @property {string} [cancelBtnClass] - classe alternativa per il pulsante 'cancel'. Sostituisce quella predefinita
+ * @property {boolean} [cancelBtnFocus] - true se il pulsante cancel deve ricevere il focus all'apertura del dialog. Non ha effetto se è impostato un extraBtn (default: true, solo tipo 'confirm')
+ * @property {string | null} [headingClass] - classe extra opzionale per il titolo (default: null)
+ * @property {DomBuilderItem | null} [extraBtn] - pulsante extra opzionale (come oggetto domBuilder) (default: null)
+ * @property {boolean} [extraBtnFocus] - true se il pulsante extra deve ricevere il focus all'apertura del dialog (ha la precedenza sul focus assegnato al pulsante 'cancel') (default: true)
+ * @property {boolean} [animation] - se true, il dialog viene animato (default: true)
+ * @property {boolean} [showMarks] - se true, vengono mostrate le icone (default: true)
+ * @property {string | null} [textClass] - classe extra opzionale per il testo (default: null)
+ * @property {string | null} [icon] - Markup dell'icona usata per il dialog; di default è l'icona del tipo.
+ * @property {string | null} [altIcon] - Markup dell'icona alternativa, usata al posto di `icon` quando `useAltIcon` è `true`.
+ * @property {boolean} [useAltIcon] - Se `true`, usa `altIcon` al posto di `icon` (ad es. l'icona `danger` su un dialog `warning`, o l'icona `warning` su un dialog `confirm`) (default: false)
  */
 
 /**
- * Renders and opens a modal alert dialog.
+ * Renderizza e apre un dialog modale di alert.
  *
- * Backward compatibility: legacy snake_case parameter names (`extra_class`, `heading_class`,
+ * Retrocompatibilità: i vecchi nomi di parametro snake_case (`extra_class`, `heading_class`,
  * `text_class`, `extra_btn`, `extra_btn_selector`, `extra_btn_focus`, `ok_btn_text`,
  * `ok_btn_class`, `cancel_btn_text`, `cancel_btn_class`, `cancel_focus`, `use_warning_icon`)
- * are still accepted and internally mapped to their camelCase equivalent, see `legacyParamNames`.
+ * sono ancora accettati e internamente mappati sul rispettivo equivalente camelCase, vedi `legacyParamNames`.
  *
- * The base param type below is intentionally `object` (not `ModalAlertParams`): TypeScript only
- * expands dotted `@param` properties (needed for editor IntelliSense to list each property) when
- * the base type is the literal `object`; a named typedef there would error (TS8032).
- * @param {object} [params] - Dialog parameters (merged with defaults by type). (default: {})
- * @param {string} [params.type] - Dialog type: `success`, `error`, `warning`, `info`, or `confirm`.
- * @param {string | null} [params.extraClass] - optional dialog extra class (default: null)
- * @param {(() => void) | null} [params.onOpen] - optional callback on dialog open (default: null)
- * @param {(() => void) | null} [params.onClose] - optional callback on dialog close (default: null)
- * @param {boolean} [params.animation] - if true, dialog will be animated (default: true)
- * @param {boolean} [params.showMarks] - if true, mark icons will be showed (default: true)
- * @param {((arg?: *) => void) | null} [params.callback] - optional callback dialog after user choice (default: null)
- * @param {number | null} [params.timer] - timer for autoclose (ms). `null` for disable (default: null, except type 'success' which defaults to 4000)
- * @param {string | null} [params.title] - title text
- * @param {string | null} [params.mes] - text message (plain or html) (default: null)
- * @param {string | null} [params.headingClass] - optional extra class for heading (default: null)
- * @param {string | null} [params.textClass] - optional extra class for text (default: null)
- * @param {string | null} [params.icon] - Icon markup used for the dialog; defaults to the type's icon.
- * @param {string | null} [params.altIcon] - Alternate icon markup, used instead of `icon` when `useAltIcon` is `true`.
- * @param {boolean} [params.useAltIcon] - When `true`, uses `altIcon` instead of `icon` (e.g. the `danger` icon on a `warning` dialog, or the `warning` icon on a `confirm` dialog). (default: false)
- * @param {DomBuilderItem | null} [params.extraBtn] - optional extra button (as domBuilder object) (default: null)
- * @param {boolean} [params.extraBtnFocus] - true if the extra button should be focused when the dialog box opens (overrides any focus assigned to the 'cancel' button) (default: true)
- * @param {string} [params.okBtnText] - text for 'ok' button (default: 'OK')
- * @param {string} [params.okBtnClass] - alternative class for 'ok' button. It replaces the default one
- * @param {string} [params.cancelBtnText] - text for 'cancel' button (default: 'Annulla', type 'confirm' only)
- * @param {string} [params.cancelBtnClass] - alternative class for 'cancel' button. It replaces the default one
- * @param {boolean} [params.cancelBtnFocus] - true if the cancel button should be focused when the dialog box opens. It has no effect if an extraBtn is set (default: true, type 'confirm' only)
- * @returns {Promise<string | boolean | undefined>} Resolves when the dialog closes. If the
- *   dismissing button has a `data-malert-result` attribute, that string is used; otherwise, for
- *   `confirm` dialogs, resolves `true`/`false` for the OK/Cancel button; otherwise `undefined`.
+ * Il tipo base del parametro qui sotto è volutamente `object` (non `ModalAlertParams`): TypeScript
+ * espande le proprietà `@param` con notazione puntata (necessarie perché IntelliSense dell'editor elenchi
+ * ogni proprietà) solo quando il tipo base è il letterale `object`; un typedef con nome darebbe errore (TS8032).
+ * @param {object} [params] - Parametri del dialog (uniti ai default in base al tipo) (default: {})
+ * @param {string} [params.type] - Tipo di dialog: `success`, `error`, `warning`, `info` o `confirm`.
+ * @param {string | null} [params.extraClass] - classe extra opzionale del dialog (default: null)
+ * @param {(() => void) | null} [params.onOpen] - callback opzionale all'apertura del dialog (default: null)
+ * @param {(() => void) | null} [params.onClose] - callback opzionale alla chiusura del dialog (default: null)
+ * @param {boolean} [params.animation] - se true, il dialog viene animato (default: true)
+ * @param {boolean} [params.showMarks] - se true, vengono mostrate le icone (default: true)
+ * @param {((arg?: *) => void) | null} [params.callback] - callback opzionale invocata dopo la scelta dell'utente (default: null)
+ * @param {number | null} [params.timer] - timer di chiusura automatica (ms). `null` per disattivarlo (default: null, tranne il tipo 'success' che ha 4000)
+ * @param {string | null} [params.title] - testo del titolo
+ * @param {string | null} [params.mes] - messaggio di testo (semplice o html) (default: null)
+ * @param {string | null} [params.headingClass] - classe extra opzionale per il titolo (default: null)
+ * @param {string | null} [params.textClass] - classe extra opzionale per il testo (default: null)
+ * @param {string | null} [params.icon] - Markup dell'icona usata per il dialog; di default è l'icona del tipo.
+ * @param {string | null} [params.altIcon] - Markup dell'icona alternativa, usata al posto di `icon` quando `useAltIcon` è `true`.
+ * @param {boolean} [params.useAltIcon] - Se `true`, usa `altIcon` al posto di `icon` (ad es. l'icona `danger` su un dialog `warning`, o l'icona `warning` su un dialog `confirm`) (default: false)
+ * @param {DomBuilderItem | null} [params.extraBtn] - pulsante extra opzionale (come oggetto domBuilder) (default: null)
+ * @param {boolean} [params.extraBtnFocus] - true se il pulsante extra deve ricevere il focus all'apertura del dialog (ha la precedenza sul focus assegnato al pulsante 'cancel') (default: true)
+ * @param {string} [params.okBtnText] - testo del pulsante 'ok' (default: 'OK')
+ * @param {string} [params.okBtnClass] - classe alternativa per il pulsante 'ok'. Sostituisce quella predefinita
+ * @param {string} [params.cancelBtnText] - testo del pulsante 'cancel' (default: 'Annulla', solo tipo 'confirm')
+ * @param {string} [params.cancelBtnClass] - classe alternativa per il pulsante 'cancel'. Sostituisce quella predefinita
+ * @param {boolean} [params.cancelBtnFocus] - true se il pulsante cancel deve ricevere il focus all'apertura del dialog. Non ha effetto se è impostato un extraBtn (default: true, solo tipo 'confirm')
+ * @returns {Promise<string | boolean | undefined>} Si risolve alla chiusura del dialog. Se il
+ *   pulsante che lo chiude ha un attributo `data-malert-result`, viene usata quella stringa; altrimenti, per i
+ *   dialog `confirm`, si risolve con `true`/`false` per il pulsante OK/Annulla; altrimenti con `undefined`.
  */
 export function modalAlert(params = {}) {
 
@@ -173,7 +173,7 @@ export function modalAlert(params = {}) {
       // garbage collection
       document.querySelector('.modal-alert')?.remove();
 
-      // backward compatibility: map legacy snake_case keys to their camelCase equivalent
+      // retrocompatibilità: mappa le vecchie chiavi snake_case sul rispettivo equivalente camelCase
       const rawParams = /** @type {Record<string, any>} */ (params);
       Object.entries(legacyParamNames).forEach(([legacyKey, newKey]) => {
         if(legacyKey in rawParams && !(newKey in rawParams)) {
@@ -189,7 +189,7 @@ export function modalAlert(params = {}) {
         ...params
       });
 
-      // backwards compatibility: 'danger' is an alias for 'error'
+      // retrocompatibilità: 'danger' è un alias di 'error'
       if(params.type === 'danger') {
         params.type = 'error';
       }
@@ -325,9 +325,11 @@ export function modalAlert(params = {}) {
           params.onClose();
         }
 
-        // If present, the resolved/callback argument is `btn.dataset.malertResult`
-        // Otherwise, if the modal type is `confirm`, it is `true` for the OK button, `false` for the Cancel button
-        // Otherwise, for all other modal types, it is `undefined`
+        /*
+          Se presente, l'argomento risolto/della callback è `btn.dataset.malertResult`
+          Altrimenti, se il tipo di modale è `confirm`, è `true` per il pulsante OK, `false` per il pulsante Annulla
+          Altrimenti, per tutti gli altri tipi di modale, è `undefined`
+        */
         let arg;
         if(btn) {
           if(btn.dataset?.malertResult) {

package/src/components/modal-alert/modal-alert.minimo.tokens.mjs

@@ -127,7 +127,7 @@ export default {
         $value: '#fff'
       },
 
-      // =>> settings for confirm button
+      // =>> impostazioni del pulsante di conferma
       btn: {
         bg: {
           $value: '{malert.confirm.bg}',

package/src/components/modal-popup/modal-popup.js

@@ -8,7 +8,7 @@ import * as styles from './modal-popup.module.css';
 // https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement
 
 
-// TODO test iframe mode
+// TODO testare la modalità iframe
 
 /** @type {HTMLDialogElement | undefined} */
 let dialogEl;
@@ -28,8 +28,8 @@ function closeDialog(el) {
 }
 
 /**
- * Wraps a single domBuilder object (not an array, not a DOM Node) into an array,
- * so `content`/`headerContent`/`footerContent` can be handled uniformly with domBuilder arrays.
+ * Racchiude in un array un singolo oggetto domBuilder (non un array, non un Node DOM),
+ * così che `content`/`headerContent`/`footerContent` possano essere gestiti in modo uniforme con gli array domBuilder.
  * @param {*} value
  * @returns {*}
  */
@@ -41,7 +41,7 @@ function normalizeContentParam(value) {
 }
 
 /**
- * @param {*} value - a non-null `content`/`headerContent`/`footerContent` value
+ * @param {*} value - un valore non nullo di `content`/`headerContent`/`footerContent`
  * @returns {'domBuilder' | 'node' | 'function' | 'html'}
  */
 function getContentKind(value) {
@@ -58,9 +58,9 @@ function getContentKind(value) {
 }
 
 /**
- * Resolves the `content`/`children` domBuilder props for a `headerContent`/`footerContent` value.
- * The `function` kind is not handled here: it is invoked separately, from the item's `callback`,
- * once the container element exists.
+ * Risolve le proprietà domBuilder `content`/`children` per un valore di `headerContent`/`footerContent`.
+ * Il tipo `function` non viene gestito qui: viene invocato separatamente, dalla `callback` dell'elemento,
+ * una volta che l'elemento contenitore esiste.
  * @param {*} value
  * @returns {{content: string | Node | null, children: DomBuilderItem[] | undefined}}
  */
@@ -77,50 +77,50 @@ function getDomBuilderContentProps(value) {
 
 /**
  * modalPopup
- * Opens a popup dialog with the given content.
+ * Apre un dialog popup con il contenuto indicato.
  *
- * Content can be provided as:
- *  - a domBuilder array, plain text, or HTML (via `content`)
- *  - content loaded via Ajax (via `ajaxUrl` and `ajaxCallback`)
- *  - an iframe (via `iframeUrl`)
+ * Il contenuto può essere fornito come:
+ *  - un array domBuilder, testo semplice o HTML (tramite `content`)
+ *  - contenuto caricato via Ajax (tramite `ajaxUrl` e `ajaxCallback`)
+ *  - un iframe (tramite `iframeUrl`)
  *
- * When multiple options conflict, the first applicable one in the list above takes precedence.
+ * Quando più opzioni sono in conflitto, ha la precedenza la prima applicabile nell'elenco qui sopra.
  *
  * @param {Object} params
- * @param {string | null} [params.dialogExtraClassName=null] - Extra class added to the dialog element. (default: null)
- * @param {string | DomBuilderItem | DomBuilderItem[] | Node | ((container: HTMLElement) => void) | null} [params.content=null] - Plain text, HTML, a domBuilder object, a domBuilder array, a DOM node (appended as-is), or a function invoked with the content container element to populate it directly (`content(dialogContentEl)`). (default: null)
- * @param {string | null} [params.contentExtraClassName=null] - Extra class added to the content wrapper. (default: null)
- * @param {HTMLElement | null} [params.triggerElement=null] - Optional element that triggered the popup; when set, `aria-haspopup`, `aria-controls` and `aria-expanded` are managed on it. (default: null)
- * @param {boolean} [params.addFocus=true] - if true, dialog receives focus after opening (default: true)
- * @param {string | null} [params.headerExtraClassName=null] - Extra class added to the header wrapper. (default: null)
- * @param {string | null} [params.footerExtraClassName=null] - Extra class added to the footer wrapper. (default: null)
- * @param {string | number | null} [params.dialogWidth=null] - optional dialog width value - if set, overrides main css custom prop (default: null)
- * @param {string | number | null} [params.dialogMinWidth=null] - optional dialog min-width value - if set, overrides main css custom prop (default: null)
- * @param {string | number | null} [params.dialogMaxWidth=null] - optional dialog max-width value - if set, overrides main css custom prop (default: null)
- * @param {string | number | null} [params.dialogHeight=null] - optional dialog height value - if set, overrides main css custom prop (default: null)
- * @param {string | number | null} [params.dialogMinHeight=null] - optional dialog min-height value - if set, overrides main css custom prop (default: null)
- * @param {string | number | null} [params.dialogMaxHeight=null] - optional dialog max-height value - if set, overrides main css custom prop (default: null)
- * @param {string | number | null} [params.dialogContentPadding=null] - optional dialog content padding value - if set, overrides main css custom prop (default: null)
- * @param {string | null} [params.iframeUrl=null] - URL to load in an iframe. (default: null)
- * @param {string | null} [params.ajaxUrl=null] - URL for Ajax content loading. (default: null)
- * @param {((el: HTMLDialogElement) => void) | null} [params.openCallback=null] - Called with the dialog element after opening, receives the dialog element (`openCallback(dialogEl)`). (default: null)
- * @param {((el: HTMLDialogElement) => void) | null} [params.closeCallback=null] - Called with the dialog element just before it is removed, receives the dialog element (`closeCallback(dialogEl)`). NB: `dialogEl` is removed immediately after closing. (default: null)
- * @param {((data: *, el: Element) => void) | null} [params.ajaxCallback=null] - Called with the Ajax response and the content element. (default: null)
- * @param {boolean} [params.addScrollbarPadding=false] - Adds right padding to compensate for the scrollbar. (default: false)
- * @param {string | DomBuilderItem | DomBuilderItem[] | Node | ((container: HTMLElement) => void) | null} [params.headerContent=null] - Header content: plain text, HTML, a domBuilder object, a domBuilder array, a DOM node, or a function invoked with the header container element to populate it directly. (default: null)
- * @param {string | DomBuilderItem | DomBuilderItem[] | Node | ((container: HTMLElement) => void) | null} [params.footerContent=null] - Footer content: same accepted types as `headerContent`, invoked with the footer container element. (default: null)
- * @returns {HTMLDialogElement} The dialog element.
+ * @param {string | null} [params.dialogExtraClassName=null] - Classe extra aggiunta all'elemento dialog (default: null)
+ * @param {string | DomBuilderItem | DomBuilderItem[] | Node | ((container: HTMLElement) => void) | null} [params.content=null] - Testo semplice, HTML, un oggetto domBuilder, un array domBuilder, un nodo DOM (aggiunto così com'è) o una funzione invocata con l'elemento contenitore del contenuto per popolarlo direttamente (`content(dialogContentEl)`) (default: null)
+ * @param {string | null} [params.contentExtraClassName=null] - Classe extra aggiunta al wrapper del contenuto (default: null)
+ * @param {HTMLElement | null} [params.triggerElement=null] - Elemento opzionale che ha attivato il popup; se impostato, su di esso vengono gestiti `aria-haspopup`, `aria-controls` e `aria-expanded` (default: null)
+ * @param {boolean} [params.addFocus=true] - se true, il dialog riceve il focus dopo l'apertura (default: true)
+ * @param {string | null} [params.headerExtraClassName=null] - Classe extra aggiunta al wrapper dell'header (default: null)
+ * @param {string | null} [params.footerExtraClassName=null] - Classe extra aggiunta al wrapper del footer (default: null)
+ * @param {string | number | null} [params.dialogWidth=null] - valore opzionale della larghezza del dialog - se impostato, sovrascrive la custom prop css principale (default: null)
+ * @param {string | number | null} [params.dialogMinWidth=null] - valore opzionale della larghezza minima del dialog - se impostato, sovrascrive la custom prop css principale (default: null)
+ * @param {string | number | null} [params.dialogMaxWidth=null] - valore opzionale della larghezza massima del dialog - se impostato, sovrascrive la custom prop css principale (default: null)
+ * @param {string | number | null} [params.dialogHeight=null] - valore opzionale dell'altezza del dialog - se impostato, sovrascrive la custom prop css principale (default: null)
+ * @param {string | number | null} [params.dialogMinHeight=null] - valore opzionale dell'altezza minima del dialog - se impostato, sovrascrive la custom prop css principale (default: null)
+ * @param {string | number | null} [params.dialogMaxHeight=null] - valore opzionale dell'altezza massima del dialog - se impostato, sovrascrive la custom prop css principale (default: null)
+ * @param {string | number | null} [params.dialogContentPadding=null] - valore opzionale del padding del contenuto del dialog - se impostato, sovrascrive la custom prop css principale (default: null)
+ * @param {string | null} [params.iframeUrl=null] - URL da caricare in un iframe (default: null)
+ * @param {string | null} [params.ajaxUrl=null] - URL per il caricamento del contenuto via Ajax (default: null)
+ * @param {((el: HTMLDialogElement) => void) | null} [params.openCallback=null] - Chiamata dopo l'apertura, riceve l'elemento dialog (`openCallback(dialogEl)`) (default: null)
+ * @param {((el: HTMLDialogElement) => void) | null} [params.closeCallback=null] - Chiamata subito prima della rimozione del dialog, riceve l'elemento dialog (`closeCallback(dialogEl)`). NB: `dialogEl` viene rimosso subito dopo la chiusura (default: null)
+ * @param {((data: *, el: Element) => void) | null} [params.ajaxCallback=null] - Chiamata con la risposta Ajax e l'elemento del contenuto (default: null)
+ * @param {boolean} [params.addScrollbarPadding=false] - Aggiunge padding destro per compensare la scrollbar (default: false)
+ * @param {string | DomBuilderItem | DomBuilderItem[] | Node | ((container: HTMLElement) => void) | null} [params.headerContent=null] - Contenuto dell'header: testo semplice, HTML, un oggetto domBuilder, un array domBuilder, un nodo DOM o una funzione invocata con l'elemento contenitore dell'header per popolarlo direttamente (default: null)
+ * @param {string | DomBuilderItem | DomBuilderItem[] | Node | ((container: HTMLElement) => void) | null} [params.footerContent=null] - Contenuto del footer: stessi tipi accettati di `headerContent`, invocata con l'elemento contenitore del footer (default: null)
+ * @returns {HTMLDialogElement} L'elemento dialog.
  */
 
 export function modalPopup({
 
-  /** dialog extra class */
+  /** classe extra del dialog */
   dialogExtraClassName = null,
 
-  /** extra classname added to dialogInner */
+  /** classe extra aggiunta a dialogInner */
   contentExtraClassName = null,
 
-  /** optional values for main custom props overriding */
+  /** valori opzionali per sovrascrivere le custom props principali */
   dialogWidth     = null,
   dialogMinWidth  = null,
   dialogMaxWidth  = null,
@@ -131,14 +131,14 @@ export function modalPopup({
 
   addFocus = true,
 
-  /** iframe url */
+  /** url dell'iframe */
   iframeUrl = null,
 
-  /** content: plain text, html, domBuilder object/array, DOM node, or function(container) */
+  /** content: testo semplice, html, oggetto/array domBuilder, nodo DOM o function(container) */
   content = null,
 
-  /** Ajax url and callback.
-   * The callback is invoked with the response data and the content container element
+  /** url e callback Ajax.
+   * La callback viene invocata con i dati della risposta e l'elemento contenitore del contenuto
    * (`ajaxCallback(data, dialogContentEl)`)
   */
   ajaxUrl = null,
@@ -146,21 +146,21 @@ export function modalPopup({
 
   openCallback = null,
   closeCallback = null,
-  addScrollbarPadding = false, // adds extra right padding to compensate for the scrollbar
+  addScrollbarPadding = false, // aggiunge padding destro extra per compensare la scrollbar
 
-  /** header content: plain text, HTML, domBuilder object/array, DOM node, or function(container) */
+  /** contenuto dell'header: testo semplice, HTML, oggetto/array domBuilder, nodo DOM o function(container) */
   headerContent = null,
 
-  /** extra classname added to header */
+  /** classe extra aggiunta all'header */
   headerExtraClassName = null,
 
-  /** footer content: plain text, HTML, domBuilder object/array, DOM node, or function(container) */
+  /** contenuto del footer: testo semplice, HTML, oggetto/array domBuilder, nodo DOM o function(container) */
   footerContent = null,
 
-  /** extra classname added to footer */
+  /** classe extra aggiunta al footer */
   footerExtraClassName = null,
 
-  /** element that triggered the popup: if set, `aria-haspopup`, `aria-controls` and `aria-expanded` are managed on it */
+  /** elemento che ha attivato il popup: se impostato, su di esso vengono gestiti `aria-haspopup`, `aria-controls` e `aria-expanded` */
   triggerElement = null,
 
 }) {
@@ -170,7 +170,7 @@ export function modalPopup({
     throw '[modalContent] parametri `content`, `ajaxUrl`/ `ajaxCallback` e `iframeUrl` mancanti';
   }
 
-  // allow a single domBuilder object (in addition to a domBuilder array) by wrapping it in an array
+  // consente un singolo oggetto domBuilder (oltre a un array domBuilder) racchiudendolo in un array
   content = normalizeContentParam(content);
   headerContent = normalizeContentParam(headerContent);
   footerContent = normalizeContentParam(footerContent);
@@ -188,10 +188,10 @@ export function modalPopup({
 
 
 
-  // capture for use in the ajax callback closure (ajaxUrl is non-null when mode === 'ajax')
+  // catturato per l'uso nella closure della callback ajax (ajaxUrl non è null quando mode === 'ajax')
   const safeAjaxUrl = /** @type {string} */ (ajaxUrl);
 
-  // fine tuning custom props
+  // regolazione fine delle custom props
   /** @type {Record<string, string | number | null>} */
   const cpropsValues = {
     dialogWidth,
@@ -221,7 +221,7 @@ export function modalPopup({
     }
   });
 
-  // ids for aria-controls (trigger → dialog) and aria-labelledby (dialog → header), generated only when needed
+  // id per aria-controls (trigger → dialog) e aria-labelledby (dialog → header), generati solo quando servono
   const dialogId = triggerElement != null ? `mpopup-${crypto.randomUUID()}` : null;
   const headerId = headerContent != null ? `mpopup-header-${crypto.randomUUID()}` : null;
 
@@ -322,19 +322,19 @@ export function modalPopup({
     }
   ], document.body);
 
-  // snapshot: dialogEl could be overwritten by a subsequent modalPopup call
+  // snapshot: dialogEl potrebbe essere sovrascritto da una successiva chiamata a modalPopup
   const thisDialog = /** @type {HTMLDialogElement} */ (dialogEl);
 
   if(openCallback) {
     openCallback(thisDialog);
   }
 
-  // close button listener
+  // listener del pulsante di chiusura
   thisDialog.querySelector(`.${styles.closeButton}`)?.addEventListener('click', () => {
     closeDialog(thisDialog);
   }, false);
 
-  // // Esc and backdrop click
+  // // Esc e click sul backdrop
   // thisDialog.addEventListener('cancel', (e) => {
   //   e.preventDefault();
   //   closeDialog(thisDialog);

package/src/components/overlay/overlay.js

@@ -2,9 +2,9 @@
 import './overlay.css';
 
 /**
- * Appends an overlay `div` to the given context element.
+ * Aggiunge un `div` overlay all'elemento di contesto indicato.
  * @param {Element} [context=document.body] (default: document.body)
- * @param {boolean} [scroll_lock=false] - When true, locks body scroll via `overflow-hidden`. (default: false)
+ * @param {boolean} [scroll_lock=false] - Se true, blocca lo scroll del body tramite `overflow-hidden` (default: false)
  * @returns {void}
  */
 export function overlay(context = document.body, scroll_lock = false) {
@@ -15,7 +15,7 @@ export function overlay(context = document.body, scroll_lock = false) {
 }
 
 /**
- * Removes the overlay element from the given context and re-enables body scroll.
+ * Rimuove l'elemento overlay dal contesto indicato e riabilita lo scroll del body.
  * @param {Element} [context=document.body] (default: document.body)
  * @returns {void}
  */

package/src/components/sf-macro/readme.md

@@ -1,7 +1,7 @@
 # sf-macro
 
 
-## Usage
+## Utilizzo
 
 ```javascript
 import { sf_macro } from '@minimo/components/sf-macro/sf-macro.js';

package/src/components/sf-macro/sf-macro.js

@@ -8,25 +8,27 @@ import './sf-macro.css';
 // di sf-macro.css qui sopra (questione lasciata in sospeso).
 
 /**
- * Initialises Symfony macro collection fields (repeatable fieldsets).
+ * Inizializza i campi collection macro di Symfony (fieldset ripetibili).
  * @param {Object} [options={}] (default: {})
- * @param {string} [options.wrapper_selector='.sf-macro-wrapper'] - Selector for the outer wrapper element. (default: '.sf-macro-wrapper')
- * @param {string} [options.row_selector='.sf-macro-riga'] - Selector for each repeatable row. (default: '.sf-macro-riga')
- * @param {string} [options.closeBtnClass='sf-macro-close-btn'] - Class name of the row-remove button. (default: 'sf-macro-close-btn')
- * @param {string} [options.addBtnClass='sf-macro-riga-add'] - Class name of the row-add button. (default: 'sf-macro-riga-add')
- * @param {string} [options.containerClass='sf-macro-container'] - Class name of the rows container. (default: 'sf-macro-container')
- * @param {((newRow: Element | null, addBtn: Element | null) => void) | null} [options.add_callback=null] - Called after a row is added; receives the new row and the add button. (default: null)
- * @param {((row: Element | null, closeBtn: Element | null) => boolean | Promise<boolean>) | null} [options.preDelCallback=null] - Called when the row-remove button is pressed, before the row is removed; receives the row and the close button. May return a Promise (e.g. to await a confirm dialog): the row is removed only if the resolved value is not `false`. (default: null)
- * @param {((row: Element | null, closeBtn: Element | null) => void) | null} [options.del_callback=null] - Called after a row is removed; receives the removed row (now detached) and the close button. (default: null)
- * @param {boolean} [options.insertAtTop=false] - When true, new rows are inserted at the top. (default: false)
+ * @param {string} [options.wrapper_selector='.sf-macro-wrapper'] - Selettore dell'elemento wrapper esterno. (default: '.sf-macro-wrapper')
+ * @param {string} [options.row_selector='.sf-macro-riga'] - Selettore di ogni riga ripetibile. (default: '.sf-macro-riga')
+ * @param {string} [options.closeBtnClass='sf-macro-close-btn'] - Nome della classe del pulsante di rimozione riga. (default: 'sf-macro-close-btn')
+ * @param {string} [options.addBtnClass='sf-macro-riga-add'] - Nome della classe del pulsante di aggiunta riga. (default: 'sf-macro-riga-add')
+ * @param {string} [options.containerClass='sf-macro-container'] - Nome della classe del contenitore delle righe. (default: 'sf-macro-container')
+ * @param {((newRow: Element | null, addBtn: Element | null) => void) | null} [options.add_callback=null] - Chiamata dopo l'aggiunta di una riga; riceve la nuova riga e il pulsante di aggiunta. (default: null)
+ * @param {((row: Element | null, closeBtn: Element | null) => boolean | Promise<boolean>) | null} [options.preDelCallback=null] - Chiamata alla pressione del pulsante di rimozione riga, prima che la riga venga rimossa; riceve la riga e il pulsante di chiusura. Può restituire una Promise (ad es. per attendere una finestra di conferma): la riga viene rimossa solo se il valore risolto non è `false`. (default: null)
+ * @param {((row: Element | null, closeBtn: Element | null) => void) | null} [options.del_callback=null] - Chiamata dopo la rimozione di una riga; riceve la riga rimossa (ormai scollegata) e il pulsante di chiusura. (default: null)
+ * @param {boolean} [options.insertAtTop=false] - Se true, le nuove righe vengono inserite in cima. (default: false)
  * @returns {void}
  */
 export function sf_macro({
   wrapper_selector = '.sf-macro-wrapper',
   row_selector = '.sf-macro-riga',
-  // Change closeBtnClass/addBtnClass/containerClass only if you don't want to use
-  // the default sf-macro.css: unused default classes are not stripped by this
-  // component, that cleanup is delegated to PurgeCSS (or equivalent) downstream.
+  /*
+    Modificare closeBtnClass/addBtnClass/containerClass solo se non si vuole usare
+    il file sf-macro.css predefinito: le classi predefinite inutilizzate non vengono rimosse da questo
+    componente, la pulizia è delegata a valle a PurgeCSS (o equivalente).
+  */
   closeBtnClass = 'sf-macro-close-btn',
   addBtnClass = 'sf-macro-riga-add',
   containerClass = 'sf-macro-container',
@@ -36,13 +38,15 @@ export function sf_macro({
   insertAtTop = false
 }={}) {
 
-  // Single delegated listener: resolves the nearest wrapper_selector ancestor
-  // of the click target at click time, instead of binding one listener per
-  // wrapper found at init time. This is required for wrapper_selector to be
-  // shared by nested wrapper instances (the nearest one always wins, with no
-  // propagation to outer ones) and to work on wrappers created dynamically
-  // after this call (e.g. a nested wrapper inside a newly added row), which
-  // would otherwise never get their own listener.
+  /*
+    Singolo listener delegato: risolve al momento del click l'antenato wrapper_selector
+    più vicino al target del click, invece di collegare un listener per ogni
+    wrapper trovato in fase di init. È necessario perché wrapper_selector possa essere
+    condiviso da istanze di wrapper annidate (vince sempre la più vicina, senza
+    propagazione a quelle esterne) e perché funzioni sui wrapper creati dinamicamente
+    dopo questa chiamata (ad es. un wrapper annidato in una riga appena aggiunta), che
+    altrimenti non riceverebbero mai un proprio listener.
+  */
   document.addEventListener('click', e => {
     const target = /** @type {HTMLElement} */ (e.target);
 
@@ -89,9 +93,9 @@ export function sf_macro({
       if(preDelCallback && typeof preDelCallback === 'function') {
         const pre_del_result = preDelCallback(riga, action_btn);
 
-        // Supports both a sync boolean and an async (Promise-returning)
-        // preDelCallback (e.g. awaiting a confirm dialog) without requiring
-        // the caller to manage the row removal itself.
+        // Supporta sia un preDelCallback sincrono che restituisce un booleano sia uno asincrono
+        // (che restituisce una Promise, ad es. in attesa di una finestra di conferma) senza richiedere
+        // che il chiamante gestisca da sé la rimozione della riga.
         if(pre_del_result instanceof Promise) {
           pre_del_result.then(ok => {
             if(ok !== false) remove_row();