design-react-kit 5.2.0 → 5.4.0

package/dist/types/Icon/assets/ItUser.d.ts

@@ -1,8 +1,4 @@
 import * as React from 'react';
 import { SVGProps } from 'react';
-interface SVGRProps {
-    title?: string;
-    titleId?: string;
-}
+import { SVGRProps } from '.';
 export declare const component: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => React.JSX.Element;
-export {};

package/dist/types/Icon/assets/ItVideo.d.ts

@@ -1,8 +1,4 @@
 import * as React from 'react';
 import { SVGProps } from 'react';
-interface SVGRProps {
-    title?: string;
-    titleId?: string;
-}
+import { SVGRProps } from '.';
 export declare const component: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => React.JSX.Element;
-export {};

package/dist/types/Icon/assets/ItVimeo.d.ts

@@ -1,8 +1,4 @@
 import * as React from 'react';
 import { SVGProps } from 'react';
-interface SVGRProps {
-    title?: string;
-    titleId?: string;
-}
+import { SVGRProps } from '.';
 export declare const component: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => React.JSX.Element;
-export {};

package/dist/types/Icon/assets/ItVimeoSquare.d.ts

@@ -1,8 +1,4 @@
 import * as React from 'react';
 import { SVGProps } from 'react';
-interface SVGRProps {
-    title?: string;
-    titleId?: string;
-}
+import { SVGRProps } from '.';
 export declare const component: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => React.JSX.Element;
-export {};

package/dist/types/Icon/assets/ItWarning.d.ts

@@ -1,8 +1,4 @@
 import * as React from 'react';
 import { SVGProps } from 'react';
-interface SVGRProps {
-    title?: string;
-    titleId?: string;
-}
+import { SVGRProps } from '.';
 export declare const component: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => React.JSX.Element;
-export {};

package/dist/types/Icon/assets/ItWarningCircle.d.ts

@@ -1,8 +1,4 @@
 import * as React from 'react';
 import { SVGProps } from 'react';
-interface SVGRProps {
-    title?: string;
-    titleId?: string;
-}
+import { SVGRProps } from '.';
 export declare const component: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => React.JSX.Element;
-export {};

package/dist/types/Icon/assets/ItWhatsapp.d.ts

@@ -1,8 +1,4 @@
 import * as React from 'react';
 import { SVGProps } from 'react';
-interface SVGRProps {
-    title?: string;
-    titleId?: string;
-}
+import { SVGRProps } from '.';
 export declare const component: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => React.JSX.Element;
-export {};

package/dist/types/Icon/assets/ItWhatsappSquare.d.ts

@@ -1,8 +1,4 @@
 import * as React from 'react';
 import { SVGProps } from 'react';
-interface SVGRProps {
-    title?: string;
-    titleId?: string;
-}
+import { SVGRProps } from '.';
 export declare const component: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => React.JSX.Element;
-export {};

package/dist/types/Icon/assets/ItWifi.d.ts

@@ -1,8 +1,4 @@
 import * as React from 'react';
 import { SVGProps } from 'react';
-interface SVGRProps {
-    title?: string;
-    titleId?: string;
-}
+import { SVGRProps } from '.';
 export declare const component: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => React.JSX.Element;
-export {};

package/dist/types/Icon/assets/ItYoutube.d.ts

@@ -1,8 +1,4 @@
 import * as React from 'react';
 import { SVGProps } from 'react';
-interface SVGRProps {
-    title?: string;
-    titleId?: string;
-}
+import { SVGRProps } from '.';
 export declare const component: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => React.JSX.Element;
-export {};

package/dist/types/Icon/assets/ItZoomIn.d.ts

@@ -1,8 +1,4 @@
 import * as React from 'react';
 import { SVGProps } from 'react';
-interface SVGRProps {
-    title?: string;
-    titleId?: string;
-}
+import { SVGRProps } from '.';
 export declare const component: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => React.JSX.Element;
-export {};

package/dist/types/Icon/assets/ItZoomOut.d.ts

@@ -1,8 +1,4 @@
 import * as React from 'react';
 import { SVGProps } from 'react';
-interface SVGRProps {
-    title?: string;
-    titleId?: string;
-}
+import { SVGRProps } from '.';
 export declare const component: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => React.JSX.Element;
-export {};

package/dist/types/Icon/assets/index.d.ts

@@ -3,4 +3,8 @@ export type IconName = keyof typeof iconList;
 export declare const loadIcon: (name: IconName) => Promise<typeof import("./ItAndroidSquare")>;
 export declare function isBundledIcon(name: string): name is IconName;
 export declare const allIcons: string[];
+export interface SVGRProps {
+    title?: string;
+    titleId?: string;
+}
 export {};

package/dist/types/Modal/Modal.d.ts

@@ -8,7 +8,7 @@ export interface ModalProps extends HTMLAttributes<HTMLElement> {
     autoFocus?: boolean;
     size?: string;
     /** Funzione da chiamare quando l'utente clicca sul backdrop. Valore di default: undefined. */
-    toggle?: React.KeyboardEventHandler<any> | React.MouseEventHandler<any>;
+    toggle?: React.KeyboardEventHandler<unknown> | React.MouseEventHandler<unknown>;
     keyboard?: boolean;
     backdrop?: boolean | 'static';
     /**

package/dist/types/Modal/ModalHeader.d.ts

@@ -8,7 +8,7 @@ export interface ModalHeaderProps extends HTMLAttributes<HTMLElement> {
     /** Componente che contenitore per l'header. Valore di default: div. */
     wrapTag?: React.ElementType;
     /** Funzione da passare al tasto di chiusura nell'intestazione. Quando questa funzione non è presente il tasto di chiusura non viene mostrato. Valore di default: undefined */
-    toggle?: React.MouseEventHandler<any>;
+    toggle?: React.MouseEventHandler<unknown>;
     /** Indica il nome dell'icona da utilizzare nel titolo. */
     icon?: string;
     /** Classi da aggiungere al nodo contenitore. */

package/dist/types/NavScroll/debounce.d.ts

@@ -1 +1 @@
-export declare const debounce: (callback: Function, wait: number) => (...args: unknown[]) => void;
+export declare const debounce: (callback: CallableFunction, wait: number) => (...args: unknown[]) => void;

package/dist/types/Progress/Progress.d.ts

@@ -1,4 +1,4 @@
-import { FC, HTMLAttributes, ElementType } from 'react';
+import { ElementType, FC, HTMLAttributes } from 'react';
 export interface ProgressProps extends HTMLAttributes<HTMLElement> {
     /** Utilizzarlo in caso di utilizzo di componenti personalizzati */
     tag?: ElementType;

package/dist/types/ResponsiveImage/ResponsiveImage.d.ts

@@ -7,5 +7,7 @@ export interface ResponsiveImageProps extends HTMLAttributes<HTMLImageElement> {
     /** Il titolo dell'immagine */
     title?: string;
     testId?: string;
+    /** Indica se l'immagine deve essere considerata proporzionata */
+    proportioned?: boolean;
 }
 export declare const ResponsiveImage: FC<ResponsiveImageProps>;

package/dist/types/Stepper/StepperHeader.d.ts

@@ -1,4 +1,4 @@
-import { FC, HTMLAttributes, ElementType } from 'react';
+import { ElementType, FC, HTMLAttributes } from 'react';
 export interface StepperHeaderProps extends HTMLAttributes<HTMLElement> {
     /** Utilizzarlo in caso di utilizzo di componenti personalizzati */
     tag?: ElementType;

package/dist/types/Timeline/TimelinePin.d.ts

@@ -1,4 +1,4 @@
-import { FC, HTMLAttributes } from 'react';
+import { ElementType, FC, HTMLAttributes } from 'react';
 export interface TimelinePinProps extends HTMLAttributes<HTMLElement> {
     /** Classi aggiuntive da usare per il componente TimelinePin */
     className?: string;
@@ -9,6 +9,10 @@ export interface TimelinePinProps extends HTMLAttributes<HTMLElement> {
      * @deprecated. Utilizzare `iconName`.
      * */
     icon?: string;
+    /**
+     * Titolo dell'icona all'interno del TimelinePin.
+     * */
+    iconTitle?: string;
     /** Etichetta da associare all'elemento */
     label: string;
     /** Quando abilitato indica che l'evento TimelinePin è collocato nel presente (azzurro) */
@@ -17,6 +21,8 @@ export interface TimelinePinProps extends HTMLAttributes<HTMLElement> {
     nowText?: string;
     /** Quando abilitato indica che l'evento TimelinePin è collocato nel passato (blu scuro) */
     past?: boolean;
+    /** Tag del pin da utilizzare a seconda della struttura */
+    tag?: ElementType;
     testId?: string;
 }
 export declare const TimelinePin: FC<TimelinePinProps>;

package/dist/utils.cjs

@@ -1,2 +1,2 @@
-"use strict";var c=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var a=Object.prototype.hasOwnProperty;var p=(n,o)=>{for(var e in o)c(n,e,{get:o[e],enumerable:!0})},y=(n,o,e,t)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of l(o))!a.call(n,r)&&r!==e&&c(n,r,{get:()=>o[r],enumerable:!(t=f(o,r))||t.enumerable});return n};var u=n=>y(c({},"__esModule",{value:!0}),n);var A={};p(A,{flushMessageCache:()=>k,logError:()=>s,mapToCssModules:()=>d,noop:()=>T,notifyDeprecation:()=>x,omit:()=>w,pick:()=>g});module.exports=u(A);var T=()=>{},s=n=>{typeof console<"u"&&(console.error?console.error(n):console.log(n))},k=()=>{for(let n in i)delete i[n]},i={},x=(n,o={once:!0})=>{o.once?i[n]||(s(n),i[n]=1):s(n)};function d(n,o){let e=n??"";return o?e.split(" ").map(t=>o[t]??t).join(" "):e}function g(n,o){let e=Array.isArray(o)?o:[o],t={};for(let r of e)r in n&&(t[r]=n[r]);return t}function w(n,o){let e=new Set(Array.isArray(o)?o:[o]),t={};for(let r in n)e.has(r)||(t[r]=n[r]);return t}0&&(module.exports={flushMessageCache,logError,mapToCssModules,noop,notifyDeprecation,omit,pick});
+"use strict";var c=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var a=Object.prototype.hasOwnProperty;var p=(n,o)=>{for(var t in o)c(n,t,{get:o[t],enumerable:!0})},y=(n,o,t,e)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of l(o))!a.call(n,r)&&r!==t&&c(n,r,{get:()=>o[r],enumerable:!(e=f(o,r))||e.enumerable});return n};var u=n=>y(c({},"__esModule",{value:!0}),n);var A={};p(A,{flushMessageCache:()=>k,logError:()=>s,mapToCssModules:()=>d,noop:()=>T,notifyDeprecation:()=>x,omit:()=>w,pick:()=>g});module.exports=u(A);var T=()=>{},s=n=>{typeof console<"u"&&(console.error?console.error(n):console.log(n))},k=()=>{for(let n in i)delete i[n]},i={},x=(n,o={once:!0})=>{o.once?i[n]||(s(n),i[n]=1):s(n)};function d(n,o){let t=n??"";return o?t.split(" ").map(e=>o[e]??e).join(" "):t}function g(n,o){let t=Array.isArray(o)?o:[o],e={};for(let r of t)r in n&&(e[r]=n[r]);return e}function w(n,o){let t=new Set(Array.isArray(o)?o:[o]),e={};for(let r in n)t.has(r)||(e[r]=n[r]);return e}0&&(module.exports={flushMessageCache,logError,mapToCssModules,noop,notifyDeprecation,omit,pick});
 //# sourceMappingURL=utils.cjs.map

package/dist/utils.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils.tsx"],"sourcesContent":["export const noop = () => {};\n\nexport const logError = (message: string) => {\n  if (typeof console !== 'undefined') {\n    if (console.error) {\n      console.error(message);\n    } else {\n      console.log(message);\n    }\n  }\n};\n\n// @internal Used for testing purposes only\nexport const flushMessageCache = () => {\n  for (const key in messages) {\n    delete messages[key];\n  }\n};\n\nconst messages: Record<string, 1> = {};\nexport const notifyDeprecation = (message: string, options: { once: boolean } = { once: true }) => {\n  if (!options.once) {\n    logError(message);\n  } else {\n    if (!messages[message]) {\n      logError(message);\n      messages[message] = 1;\n    }\n  }\n};\n\nexport function mapToCssModules(className: string | null, cssModules?: Record<string, string>) {\n  let finalClassNames = className == null ? '' : className;\n  if (!cssModules) {\n    return finalClassNames;\n  }\n  return finalClassNames\n    .split(' ')\n    .map((klass) => cssModules[klass] ?? klass)\n    .join(' ');\n}\n\ntype UnknownObject = Record<string, unknown>;\n\nexport function pick<T extends UnknownObject>(obj: T, keys: keyof T | Array<keyof T>): Partial<T> {\n  const keysArray = Array.isArray(keys) ? keys : [keys];\n  const newObj: Partial<T> = {};\n  for (const key of keysArray) {\n    if (key in obj) {\n      newObj[key] = obj[key];\n    }\n  }\n  return newObj;\n}\n\nexport function omit<T extends UnknownObject>(obj: T, keys: keyof T | Array<keyof T>): Partial<T> {\n  const keysLookup = new Set(Array.isArray(keys) ? keys : [keys]);\n\n  const newObj: Partial<T> = {};\n  for (const key in obj) {\n    if (!keysLookup.has(key)) {\n      newObj[key] = obj[key];\n    }\n  }\n  return newObj;\n}\n"],"mappings":"yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,uBAAAE,EAAA,aAAAC,EAAA,oBAAAC,EAAA,SAAAC,EAAA,sBAAAC,EAAA,SAAAC,EAAA,SAAAC,IAAA,eAAAC,EAAAT,GAAO,IAAMK,EAAO,IAAM,CAAC,EAEdF,EAAYO,GAAoB,CACvC,OAAO,QAAY,MACjB,QAAQ,MACV,QAAQ,MAAMA,CAAO,EAErB,QAAQ,IAAIA,CAAO,EAGzB,EAGaR,EAAoB,IAAM,CACrC,QAAWS,KAAOC,EAChB,OAAOA,EAASD,CAAG,CAEvB,EAEMC,EAA8B,CAAC,EACxBN,EAAoB,CAACI,EAAiBG,EAA6B,CAAE,KAAM,EAAK,IAAM,CAC5FA,EAAQ,KAGND,EAASF,CAAO,IACnBP,EAASO,CAAO,EAChBE,EAASF,CAAO,EAAI,GAJtBP,EAASO,CAAO,CAOpB,EAEO,SAASN,EAAgBU,EAA0BC,EAAqC,CAC7F,IAAIC,EAAkBF,GAAoB,GAC1C,OAAKC,EAGEC,EACJ,MAAM,GAAG,EACT,IAAKC,GAAUF,EAAWE,CAAK,GAAKA,CAAK,EACzC,KAAK,GAAG,EALFD,CAMX,CAIO,SAASR,EAA8BU,EAAQC,EAA4C,CAChG,IAAMC,EAAY,MAAM,QAAQD,CAAI,EAAIA,EAAO,CAACA,CAAI,EAC9CE,EAAqB,CAAC,EAC5B,QAAWV,KAAOS,EACZT,KAAOO,IACTG,EAAOV,CAAG,EAAIO,EAAIP,CAAG,GAGzB,OAAOU,CACT,CAEO,SAASd,EAA8BW,EAAQC,EAA4C,CAChG,IAAMG,EAAa,IAAI,IAAI,MAAM,QAAQH,CAAI,EAAIA,EAAO,CAACA,CAAI,CAAC,EAExDE,EAAqB,CAAC,EAC5B,QAAWV,KAAOO,EACXI,EAAW,IAAIX,CAAG,IACrBU,EAAOV,CAAG,EAAIO,EAAIP,CAAG,GAGzB,OAAOU,CACT","names":["utils_exports","__export","flushMessageCache","logError","mapToCssModules","noop","notifyDeprecation","omit","pick","__toCommonJS","message","key","messages","options","className","cssModules","finalClassNames","klass","obj","keys","keysArray","newObj","keysLookup"]}
+{"version":3,"sources":["../src/utils.tsx"],"sourcesContent":["export const noop = () => {};\n\nexport const logError = (message: string) => {\n  if (typeof console !== 'undefined') {\n    if (console.error) {\n      console.error(message);\n    } else {\n      console.log(message);\n    }\n  }\n};\n\n// @internal Used for testing purposes only\nexport const flushMessageCache = () => {\n  for (const key in messages) {\n    delete messages[key];\n  }\n};\n\nconst messages: Record<string, 1> = {};\nexport const notifyDeprecation = (message: string, options: { once: boolean } = { once: true }) => {\n  if (!options.once) {\n    logError(message);\n  } else {\n    if (!messages[message]) {\n      logError(message);\n      messages[message] = 1;\n    }\n  }\n};\n\nexport function mapToCssModules(className: string | null, cssModules?: Record<string, string>) {\n  const finalClassNames = className == null ? '' : className;\n  if (!cssModules) {\n    return finalClassNames;\n  }\n  return finalClassNames\n    .split(' ')\n    .map((klass) => cssModules[klass] ?? klass)\n    .join(' ');\n}\n\ntype UnknownObject = Record<string, unknown>;\n\nexport function pick<T extends UnknownObject>(obj: T, keys: keyof T | Array<keyof T>): Partial<T> {\n  const keysArray = Array.isArray(keys) ? keys : [keys];\n  const newObj: Partial<T> = {};\n  for (const key of keysArray) {\n    if (key in obj) {\n      newObj[key] = obj[key];\n    }\n  }\n  return newObj;\n}\n\nexport function omit<T extends UnknownObject>(obj: T, keys: keyof T | Array<keyof T>): Partial<T> {\n  const keysLookup = new Set(Array.isArray(keys) ? keys : [keys]);\n\n  const newObj: Partial<T> = {};\n  for (const key in obj) {\n    if (!keysLookup.has(key)) {\n      newObj[key] = obj[key];\n    }\n  }\n  return newObj;\n}\n"],"mappings":"yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,uBAAAE,EAAA,aAAAC,EAAA,oBAAAC,EAAA,SAAAC,EAAA,sBAAAC,EAAA,SAAAC,EAAA,SAAAC,IAAA,eAAAC,EAAAT,GAAO,IAAMK,EAAO,IAAM,CAAC,EAEdF,EAAYO,GAAoB,CACvC,OAAO,QAAY,MACjB,QAAQ,MACV,QAAQ,MAAMA,CAAO,EAErB,QAAQ,IAAIA,CAAO,EAGzB,EAGaR,EAAoB,IAAM,CACrC,QAAWS,KAAOC,EAChB,OAAOA,EAASD,CAAG,CAEvB,EAEMC,EAA8B,CAAC,EACxBN,EAAoB,CAACI,EAAiBG,EAA6B,CAAE,KAAM,EAAK,IAAM,CAC5FA,EAAQ,KAGND,EAASF,CAAO,IACnBP,EAASO,CAAO,EAChBE,EAASF,CAAO,EAAI,GAJtBP,EAASO,CAAO,CAOpB,EAEO,SAASN,EAAgBU,EAA0BC,EAAqC,CAC7F,IAAMC,EAAkBF,GAAoB,GAC5C,OAAKC,EAGEC,EACJ,MAAM,GAAG,EACT,IAAKC,GAAUF,EAAWE,CAAK,GAAKA,CAAK,EACzC,KAAK,GAAG,EALFD,CAMX,CAIO,SAASR,EAA8BU,EAAQC,EAA4C,CAChG,IAAMC,EAAY,MAAM,QAAQD,CAAI,EAAIA,EAAO,CAACA,CAAI,EAC9CE,EAAqB,CAAC,EAC5B,QAAWV,KAAOS,EACZT,KAAOO,IACTG,EAAOV,CAAG,EAAIO,EAAIP,CAAG,GAGzB,OAAOU,CACT,CAEO,SAASd,EAA8BW,EAAQC,EAA4C,CAChG,IAAMG,EAAa,IAAI,IAAI,MAAM,QAAQH,CAAI,EAAIA,EAAO,CAACA,CAAI,CAAC,EAExDE,EAAqB,CAAC,EAC5B,QAAWV,KAAOO,EACXI,EAAW,IAAIX,CAAG,IACrBU,EAAOV,CAAG,EAAIO,EAAIP,CAAG,GAGzB,OAAOU,CACT","names":["utils_exports","__export","flushMessageCache","logError","mapToCssModules","noop","notifyDeprecation","omit","pick","__toCommonJS","message","key","messages","options","className","cssModules","finalClassNames","klass","obj","keys","keysArray","newObj","keysLookup"]}

package/dist/utils.js

@@ -28,7 +28,7 @@ export const notifyDeprecation = (message, options = { once: true }) => {
     }
 };
 export function mapToCssModules(className, cssModules) {
-    let finalClassNames = className == null ? '' : className;
+    const finalClassNames = className == null ? '' : className;
     if (!cssModules) {
         return finalClassNames;
     }

package/dist/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,IAAI,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;AAE7B,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,OAAe,EAAE,EAAE;IAC1C,IAAI,OAAO,OAAO,KAAK,WAAW,EAAE,CAAC;QACnC,IAAI,OAAO,CAAC,KAAK,EAAE,CAAC;YAClB,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QACzB,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;QACvB,CAAC;IACH,CAAC;AACH,CAAC,CAAC;AAEF,2CAA2C;AAC3C,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACpC,KAAK,MAAM,GAAG,IAAI,QAAQ,EAAE,CAAC;QAC3B,OAAO,QAAQ,CAAC,GAAG,CAAC,CAAC;IACvB,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,QAAQ,GAAsB,EAAE,CAAC;AACvC,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,OAAe,EAAE,UAA6B,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE;IAChG,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;QAClB,QAAQ,CAAC,OAAO,CAAC,CAAC;IACpB,CAAC;SAAM,CAAC;QACN,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC;YACvB,QAAQ,CAAC,OAAO,CAAC,CAAC;YAClB,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;QACxB,CAAC;IACH,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,UAAU,eAAe,CAAC,SAAwB,EAAE,UAAmC;IAC3F,IAAI,eAAe,GAAG,SAAS,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;IACzD,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,OAAO,eAAe,CAAC;IACzB,CAAC;IACD,OAAO,eAAe;SACnB,KAAK,CAAC,GAAG,CAAC;SACV,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;SAC1C,IAAI,CAAC,GAAG,CAAC,CAAC;AACf,CAAC;AAID,MAAM,UAAU,IAAI,CAA0B,GAAM,EAAE,IAA8B;IAClF,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IACtD,MAAM,MAAM,GAAe,EAAE,CAAC;IAC9B,KAAK,MAAM,GAAG,IAAI,SAAS,EAAE,CAAC;QAC5B,IAAI,GAAG,IAAI,GAAG,EAAE,CAAC;YACf,MAAM,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC;QACzB,CAAC;IACH,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,MAAM,UAAU,IAAI,CAA0B,GAAM,EAAE,IAA8B;IAClF,MAAM,UAAU,GAAG,IAAI,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;IAEhE,MAAM,MAAM,GAAe,EAAE,CAAC;IAC9B,KAAK,MAAM,GAAG,IAAI,GAAG,EAAE,CAAC;QACtB,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;YACzB,MAAM,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC;QACzB,CAAC;IACH,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,IAAI,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;AAE7B,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,OAAe,EAAE,EAAE;IAC1C,IAAI,OAAO,OAAO,KAAK,WAAW,EAAE,CAAC;QACnC,IAAI,OAAO,CAAC,KAAK,EAAE,CAAC;YAClB,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QACzB,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;QACvB,CAAC;IACH,CAAC;AACH,CAAC,CAAC;AAEF,2CAA2C;AAC3C,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACpC,KAAK,MAAM,GAAG,IAAI,QAAQ,EAAE,CAAC;QAC3B,OAAO,QAAQ,CAAC,GAAG,CAAC,CAAC;IACvB,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,QAAQ,GAAsB,EAAE,CAAC;AACvC,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,OAAe,EAAE,UAA6B,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE;IAChG,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;QAClB,QAAQ,CAAC,OAAO,CAAC,CAAC;IACpB,CAAC;SAAM,CAAC;QACN,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC;YACvB,QAAQ,CAAC,OAAO,CAAC,CAAC;YAClB,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;QACxB,CAAC;IACH,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,UAAU,eAAe,CAAC,SAAwB,EAAE,UAAmC;IAC3F,MAAM,eAAe,GAAG,SAAS,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;IAC3D,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,OAAO,eAAe,CAAC;IACzB,CAAC;IACD,OAAO,eAAe;SACnB,KAAK,CAAC,GAAG,CAAC;SACV,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;SAC1C,IAAI,CAAC,GAAG,CAAC,CAAC;AACf,CAAC;AAID,MAAM,UAAU,IAAI,CAA0B,GAAM,EAAE,IAA8B;IAClF,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IACtD,MAAM,MAAM,GAAe,EAAE,CAAC;IAC9B,KAAK,MAAM,GAAG,IAAI,SAAS,EAAE,CAAC;QAC5B,IAAI,GAAG,IAAI,GAAG,EAAE,CAAC;YACf,MAAM,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC;QACzB,CAAC;IACH,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,MAAM,UAAU,IAAI,CAA0B,GAAM,EAAE,IAA8B;IAClF,MAAM,UAAU,GAAG,IAAI,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;IAEhE,MAAM,MAAM,GAAe,EAAE,CAAC;IAC9B,KAAK,MAAM,GAAG,IAAI,GAAG,EAAE,CAAC;QACtB,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;YACzB,MAAM,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC;QACzB,CAAC;IACH,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC"}

package/package.json

@@ -24,7 +24,7 @@
   "bugs": {
     "url": "https://github.com/italia/design-react-kit/issues"
   },
-  "version": "5.2.0",
+  "version": "5.4.0",
   "license": "BSD-3",
   "type": "module",
   "module": "./dist/index.js",
@@ -54,8 +54,7 @@
     "build": "tsup && tsc",
     "test": "jest ./src ./test --passWithNoTests",
     "test:ci": "jest ./src ./test --passWithNoTests --runInBand --ci",
-    "lint": "npx eslint src stories test --ext js,ts,tsx,jsx",
-    "lint:staged": "npx eslint --ext js,ts,tsx,jsx",
+    "lint": "npx eslint .",
     "prepare": "tsup && tsc && husky install",
     "format-code": "npx prettier . --write",
     "storybook:serve": "storybook dev -p 9001",
@@ -66,18 +65,20 @@
     "postversion": "echo \"You can now publish your version using 'git push --follow-tags'\""
   },
   "peerDependencies": {
-    "bootstrap-italia": "2.8.8",
+    "bootstrap-italia": "2.11.0",
     "react": ">=18.2.0"
   },
   "browserslist": [
     "extends browserslist-config-design-italia"
   ],
   "lint-staged": {
-    "./{src,stories,test}/**/*.{js,ts,tsx,jsx,mdx}": "yarn lint:staged"
+    "./{src,stories,test}/**/*.{js,ts,tsx,jsx,mdx}": "yarn lint"
   },
   "devDependencies": {
+    "@babel/preset-react": "^7.24.7",
     "@commitlint/cli": "^18.4.3",
     "@commitlint/config-conventional": "^18.4.3",
+    "@eslint/js": "^9.10.0",
     "@storybook/addon-a11y": "^8.0.5",
     "@storybook/addon-docs": "^8.0.5",
     "@storybook/addon-essentials": "^8.0.5",
@@ -96,20 +97,21 @@
     "@types/react": "^18.2.75",
     "@types/react-dom": "^18.2.24",
     "@types/react-transition-group": "^4.4.10",
-    "bootstrap-italia": "^2.9.0",
+    "bootstrap-italia": "^2.11.0",
     "browserslist-config-design-italia": "^1.0.0",
-    "eslint": "^8.57.0",
-    "eslint-config-react-app": "^7.0.1",
+    "eslint": "^9.10.0",
     "eslint-plugin-mdx": "^3.1.5",
     "eslint-plugin-prettier": "^5.1.3",
-    "eslint-plugin-storybook": "^0.8.0",
+    "eslint-plugin-react-refresh": "^0.4.11",
+    "globals": "^15.9.0",
     "husky": "^8.0.1",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
-    "lint-staged": "^13.0.3",
+    "lint-staged": "15.2.10",
     "prettier": "^3.2.5",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-layout-masonry": "^1.2.0",
     "sass": "^1.75.0",
     "storybook": "^8.0.5",
     "ts-jest": "^29.1.2",
@@ -118,6 +120,7 @@
     "typeface-lora": "^1.1.13",
     "typeface-roboto-mono": "^1.1.13",
     "typescript": "^5.4.5",
+    "typescript-eslint": "^8.4.0",
     "vite": "^5.2.7"
   },
   "dependencies": {

package/src/Accordion/AccordionBody.tsx

@@ -1,9 +1,9 @@
+import classNames from 'classnames';
 import React, { ElementType, PropsWithChildren, useCallback, useState } from 'react';
-import type { TransitionProps } from 'react-transition-group/Transition';
 import { Transition } from 'react-transition-group';
-import classNames from 'classnames';
-import { pick, omit } from '../utils';
+import type { TransitionProps } from 'react-transition-group/Transition';
 import { TransitionTimeouts, TransitionsKeys } from '../transitions';
+import { omit, pick } from '../utils';
 
 export type AccordionBodyProps = Partial<TransitionProps> & {
   tag?: ElementType;
@@ -64,7 +64,7 @@ export const AccordionBody = ({
   const onExiting = useCallback(
     (node: HTMLElement) => {
       // getting this variable triggers a reflow
-      // @ts-expect-error
+      // @ts-expect-error variabile non usata
       // eslint-disable-next-line @typescript-eslint/no-unused-vars
       const _unused = node.offsetHeight;
       setHeight(0);

package/src/Alert/Alert.tsx

@@ -24,7 +24,7 @@ export interface AlertProps extends HTMLAttributes<HTMLElement> {
    * @default true
    */
   isOpen?: boolean;
-  toggle?: MouseEventHandler<any>;
+  toggle?: MouseEventHandler<unknown>;
   testId?: string;
 }
 

package/src/Avatar/AvatarGroupContainer.tsx

@@ -1,18 +1,15 @@
-import React, { FC, HTMLAttributes, ElementType } from 'react';
 import classNames from 'classnames';
+import React, { ElementType, FC, HTMLAttributes } from 'react';
 
 export interface AvatarGroupContainerProps extends HTMLAttributes<HTMLUListElement> {
   /** Utilizzarlo in caso di utilizzo di componenti personalizzati */
   tag?: ElementType;
-  /** Classi aggiuntive da usare per il componente interno AvatarGroupContainer */
-  className?: string;
   /** Classi aggiuntive da usare per il componente più esterno di AvatarGroupContainer */
   wrapperClassName?: string;
   testId?: string;
 }
 
 export const AvatarGroupContainer: FC<AvatarGroupContainerProps> = ({
-  className,
   tag = 'ul',
   wrapperClassName,
   testId,

package/src/Avatar/AvatarIcon.tsx

@@ -1,5 +1,5 @@
-import React, { FC, HTMLAttributes, ElementType, Ref } from 'react';
 import classNames from 'classnames';
+import React, { ElementType, FC, HTMLAttributes, Ref } from 'react';
 
 export interface AvatarIconProps extends HTMLAttributes<HTMLElement> {
   /**
@@ -36,7 +36,8 @@ export const AvatarIcon: FC<AvatarIconProps> = ({
   const Tag = tag;
   const typeClass = classNames('avatar', {
     [`size-${size}`]: size,
-    [`avatar-${color}`]: color
+    [`avatar-${color}`]: color,
+    className
   });
   if (href) {
     return (

package/src/Avatar/AvatarPresence.tsx

@@ -1,5 +1,5 @@
-import React, { FC, HTMLAttributes, ElementType } from 'react';
 import classNames from 'classnames';
+import React, { ElementType, FC, HTMLAttributes } from 'react';
 
 export interface AvatarPresenceProps extends HTMLAttributes<HTMLElement> {
   /** Utilizzarlo in caso di utilizzo di componenti personalizzati */
@@ -19,8 +19,12 @@ export const AvatarPresence: FC<AvatarPresenceProps> = ({
   ...attributes
 }) => {
   const Tag = tag;
-  const typeClass = classNames('avatar-presence', {
-    presence
-  });
+  const typeClass = classNames(
+    'avatar-presence',
+    {
+      presence
+    },
+    className
+  );
   return <Tag {...attributes} className={typeClass} data-testid={testId} />;
 };

package/src/Avatar/AvatarStatus.tsx

@@ -1,5 +1,5 @@
-import React, { FC, HTMLAttributes, ElementType } from 'react';
 import classNames from 'classnames';
+import React, { ElementType, FC, HTMLAttributes } from 'react';
 
 export interface AvatarStatusProps extends HTMLAttributes<HTMLElement> {
   /** Utilizzarlo in caso di utilizzo di componenti personalizzati */
@@ -13,8 +13,12 @@ export interface AvatarStatusProps extends HTMLAttributes<HTMLElement> {
 
 export const AvatarStatus: FC<AvatarStatusProps> = ({ className, tag = 'div', status, testId, ...attributes }) => {
   const Tag = tag;
-  const typeClass = classNames('avatar-status', {
-    status
-  });
+  const typeClass = classNames(
+    'avatar-status',
+    {
+      status
+    },
+    className
+  );
   return <Tag {...attributes} className={typeClass} data-testid={testId} />;
 };

package/src/Card/CardCategory.tsx

@@ -10,33 +10,42 @@ export interface CardCategoryProps extends HTMLAttributes<HTMLElement> {
   date?: string;
   /** Se usato come link, passare l'URL target. */
   href?: string;
+  /** Descrizione della data (es. 'Data evento') */
+  dateDescription?: string;
+  /** Descrizione del testo (es. 'Titolo evento') */
+  textDescription?: string;
+  /** Titolo dell' icona */
+  iconTitle?: string;
   /** Da utilizzare al posto di url quando la gestione del click è in JS */
   onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
   testId?: string;
 }
 
-export const CardCategory: FC<CardCategoryProps> = ({ iconName, date, href, onClick, testId, children, ...rest }) => {
+export const CardCategory: FC<CardCategoryProps> = ({ iconName, iconTitle, date, href, onClick, testId, children, textDescription, dateDescription, ...rest }) => {
   const classes = classNames({
     'category-top': date || ' ',
     'categoryicon-top': iconName
   });
   // Simple category link
   const categoryLink = !iconName && (
-    <a href={href} className='category' onClick={onClick}>
-      {children}
-    </a>
+    <>
+      {textDescription && <span className="visually-hidden">{textDescription}</span>}
+      <a href={href} className='category' onClick={onClick}>
+        {children}
+      </a>
+    </>
   );
   const categoryDate = date && <span className='data'>{date}</span>;
   // Category with icon
   const categoryText = iconName && <span className='text'>{children}</span>;
-  const categoryIcon = iconName && <Icon icon={iconName} />;
+  const categoryIcon = iconName && <Icon icon={iconName} title={iconTitle} />;
 
   return (
     <div className={classes} {...rest} data-testid={testId}>
       {categoryLink}
       {categoryIcon}
-      {categoryText}
-      {categoryDate}
+      {categoryText && textDescription && <span className="visually-hidden">{textDescription}</span>}{categoryText}
+      {dateDescription && <span className="visually-hidden">{dateDescription}</span>}{categoryDate}
     </div>
   );
 };

package/src/Dimmer/Dimmer.tsx

@@ -1,15 +1,17 @@
-import React, { FC, HTMLAttributes } from 'react';
 import classNames from 'classnames';
+import React, { FC, HTMLAttributes } from 'react';
 
 import { Icon } from '../Icon/Icon';
 
 export interface DimmerProps extends HTMLAttributes<HTMLElement> {
-  /** Il nome dell'icona da mostrare. Per una lista completa vedi: @TODO-URL */
+  /** Il nome dell'icona da mostrare */
   icon?: string;
   /** Le varianti di colore definite in Bootstrap Italia */
-  color?: 'success' | 'warning' | 'danger' | 'note' | 'important' | string;
+  color?: 'primary' | 'secondary';
   /** Classi aggiuntive da usare per il componente Dimmer */
   className?: string;
+  /** Mostra il wrapper */
+  show?: boolean;
   /**
    * Classi aggiuntive da usare per il componente contenitore del Dimmer
    * Per replicare il comportamento precedente, in cui `className` veniva applicato anche al wrapper,
@@ -19,20 +21,28 @@ export interface DimmerProps extends HTMLAttributes<HTMLElement> {
   testId?: string;
 }
 
-export const Dimmer: FC<DimmerProps> = ({ icon, color, className, wrapperClassName, testId, ...attributes }) => {
-  const { children, ...rest } = attributes;
-  const classes = classNames('dimmer', wrapperClassName === true ? className : wrapperClassName, {
-    [`dimmer-${color}`]: color
-  });
-  const innerClasses = classNames('dimmer-inner', className);
-  const dimmerIcon = icon && (
-    <div className='dimmer-icon'>
-      <Icon icon={icon} />
-    </div>
-  );
+export const Dimmer: FC<DimmerProps> = ({
+  icon,
+  color,
+  className,
+  show = true,
+  wrapperClassName,
+  testId,
+  ...attributes
+}) => {
+  const { children, ...rest } = attributes,
+    classes = classNames('dimmer fade', { show: show }, wrapperClassName === true ? className : wrapperClassName, {
+      [`dimmer-${color}`]: color
+    }),
+    innerClasses = classNames('dimmer-inner', className),
+    dimmerIcon = icon && (
+      <div className='dimmer-icon'>
+        <Icon icon={icon} />
+      </div>
+    );
 
   return (
-    <div className={classes} {...rest} style={{ display: 'flex' }} data-testid={testId}>
+    <div className={classes} {...rest} data-testid={testId} aria-hidden={show ? undefined : true}>
       <div className={innerClasses} {...rest}>
         {dimmerIcon}
         {children}

package/src/Dimmer/DimmerButtons.tsx

@@ -1,9 +1,7 @@
-import React, { FC, HTMLAttributes } from 'react';
 import classNames from 'classnames';
+import React, { FC, HTMLAttributes } from 'react';
 
 export interface DimmerButtonsProps extends HTMLAttributes<HTMLElement> {
-  /** Le varianti di colore definite in Bootstrap Italia per il componente Dimmer */
-  color?: 'primary' | string;
   /** Classi aggiuntive da usare per il componente Dimmer */
   className?: string;
   /** Da utilizzare in presenza di un singolo bottone: quando abilitato ne centra il contenuto. */
@@ -16,7 +14,6 @@ export interface DimmerButtonsProps extends HTMLAttributes<HTMLElement> {
 }
 
 export const DimmerButtons: FC<DimmerButtonsProps> = ({
-  color,
   className,
   single = false,
   dark = true,

package/src/Dropdown/Dropdown.tsx

@@ -1,5 +1,5 @@
-import React, { ElementType, FC, HTMLAttributes } from 'react';
 import classNames from 'classnames';
+import React, { ElementType, FC, HTMLAttributes } from 'react';
 import { Dropdown as BSDRopdown } from 'reactstrap';
 export interface DropdownProps extends HTMLAttributes<HTMLElement> {
   tag?: ElementType;
@@ -14,7 +14,6 @@ export interface DropdownProps extends HTMLAttributes<HTMLElement> {
 export const Dropdown: FC<DropdownProps> = ({
   className,
   testId,
-  tag,
   children,
   inNavbar,
   textCenter,

package/src/FontLoader/FontLoader.tsx

@@ -17,6 +17,7 @@ const defaultFonts = [
 export function useFontLoader({ fonts }: FontLoaderProps) {
   useEffect(() => {
     if (typeof window !== 'undefined') {
+      // eslint-disable-next-line @typescript-eslint/no-require-imports
       const WebFont = require('webfontloader');
       WebFont.load({
         custom: {