design-react-kit 5.5.1 → 5.6.0
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/CHANGELOG.md +18 -0
- package/dist/Alert/Alert.cjs.map +1 -1
- package/dist/Alert/Alert.js.map +1 -1
- package/dist/Autocomplete/Autocomplete.cjs +3 -1
- package/dist/Autocomplete/Autocomplete.cjs.map +1 -1
- package/dist/Autocomplete/Autocomplete.js +2 -2
- package/dist/Autocomplete/Autocomplete.js.map +1 -1
- package/dist/BackToTop/BackToTop.cjs +1 -1
- package/dist/BackToTop/BackToTop.cjs.map +1 -1
- package/dist/BackToTop/BackToTop.js +1 -1
- package/dist/BackToTop/BackToTop.js.map +1 -1
- package/dist/BottomNav/BottomNavItem.cjs +1 -1
- package/dist/BottomNav/BottomNavItem.cjs.map +1 -1
- package/dist/Callout/CalloutMoreFooter.cjs +1 -1
- package/dist/Callout/CalloutMoreFooter.cjs.map +1 -1
- package/dist/Card/CardCategory.cjs +1 -1
- package/dist/Card/CardCategory.cjs.map +1 -1
- package/dist/Card/CardCategory.js +3 -3
- package/dist/Card/CardCategory.js.map +1 -1
- package/dist/Card/CardReadMore.cjs +1 -1
- package/dist/Card/CardReadMore.cjs.map +1 -1
- package/dist/Collapse/Collapse.cjs +1 -1
- package/dist/Collapse/Collapse.cjs.map +1 -1
- package/dist/Collapse/Collapse.js +3 -3
- package/dist/Collapse/Collapse.js.map +1 -1
- package/dist/Dimmer/Dimmer.cjs +1 -1
- package/dist/Dimmer/Dimmer.cjs.map +1 -1
- package/dist/Dropdown/Dropdown.cjs.map +1 -1
- package/dist/Dropdown/Dropdown.js +1 -1
- package/dist/Dropdown/Dropdown.js.map +1 -1
- package/dist/Dropdown/DropdownToggle.cjs +1 -1
- package/dist/Dropdown/DropdownToggle.cjs.map +1 -1
- package/dist/Forward/Forward.cjs.map +1 -1
- package/dist/Forward/Forward.js.map +1 -1
- package/dist/GoBack/GoBack.cjs +1 -1
- package/dist/GoBack/GoBack.cjs.map +1 -1
- package/dist/Grid/GridItemTextWrapper.cjs.map +1 -1
- package/dist/Grid/GridItemTextWrapper.js.map +1 -1
- package/dist/Grid/index.cjs.map +1 -1
- package/dist/Header/HeaderBrand.cjs +1 -1
- package/dist/Header/HeaderBrand.cjs.map +1 -1
- package/dist/Header/HeaderSearch.cjs +1 -1
- package/dist/Header/HeaderSearch.cjs.map +1 -1
- package/dist/Header/HeaderToggler.cjs.map +1 -1
- package/dist/Header/HeaderToggler.js +1 -1
- package/dist/Header/HeaderToggler.js.map +1 -1
- package/dist/Icon/Icon.cjs +1 -1
- package/dist/Icon/Icon.cjs.map +1 -1
- package/dist/Icon/Icon.js +3 -3
- package/dist/Icon/Icon.js.map +1 -1
- package/dist/Icon/assets/index.cjs.map +1 -1
- package/dist/Input/Input.cjs +1 -1
- package/dist/Input/Input.cjs.map +1 -1
- package/dist/Input/Input.js +13 -6
- package/dist/Input/Input.js.map +1 -1
- package/dist/Input/InputContainer.cjs.map +1 -1
- package/dist/Input/InputContainer.js.map +1 -1
- package/dist/Input/TextArea.cjs +1 -1
- package/dist/Input/TextArea.cjs.map +1 -1
- package/dist/Input/TextArea.js.map +1 -1
- package/dist/Input/utils.cjs +1 -1
- package/dist/Input/utils.cjs.map +1 -1
- package/dist/Input/utils.js +1 -2
- package/dist/Input/utils.js.map +1 -1
- package/dist/List/List.cjs.map +1 -1
- package/dist/List/List.js.map +1 -1
- package/dist/List/ListItem.cjs.map +1 -1
- package/dist/List/ListItem.js +2 -2
- package/dist/List/ListItem.js.map +1 -1
- package/dist/Megamenu/MegamenuItem.cjs +1 -1
- package/dist/Megamenu/MegamenuItem.cjs.map +1 -1
- package/dist/Modal/ModalHeader.cjs +1 -1
- package/dist/Modal/ModalHeader.cjs.map +1 -1
- package/dist/NavScroll/types.cjs.map +1 -1
- package/dist/Notification/NotificationContent.cjs +1 -1
- package/dist/Notification/NotificationContent.cjs.map +1 -1
- package/dist/Notification/core.cjs +1 -1
- package/dist/Notification/core.cjs.map +1 -1
- package/dist/Notification/index.cjs +1 -1
- package/dist/Notification/index.cjs.map +1 -1
- package/dist/Rating/Rating.cjs +1 -1
- package/dist/Rating/Rating.cjs.map +1 -1
- package/dist/ResponsiveImage/ResponsiveImage.cjs.map +1 -1
- package/dist/ResponsiveImage/ResponsiveImage.js.map +1 -1
- package/dist/Skiplink/Skiplink.cjs.map +1 -1
- package/dist/Skiplink/Skiplink.js.map +1 -1
- package/dist/Skiplink/SkiplinkItem.cjs.map +1 -1
- package/dist/Stepper/StepperHeaderElement.cjs +1 -1
- package/dist/Stepper/StepperHeaderElement.cjs.map +1 -1
- package/dist/Stepper/StepperHeaderElement.js +3 -5
- package/dist/Stepper/StepperHeaderElement.js.map +1 -1
- package/dist/Tab/TabNav.cjs +2 -0
- package/dist/Tab/TabNav.cjs.map +1 -0
- package/dist/Tab/TabNav.js +63 -0
- package/dist/Tab/TabNav.js.map +1 -0
- package/dist/Tab/TabNavItem.cjs +2 -0
- package/dist/Tab/TabNavItem.cjs.map +1 -0
- package/dist/Tab/TabNavItem.js +7 -0
- package/dist/Tab/TabNavItem.js.map +1 -0
- package/dist/Tab/TabNavLink.cjs +2 -0
- package/dist/Tab/TabNavLink.cjs.map +1 -0
- package/dist/Tab/TabNavLink.js +7 -0
- package/dist/Tab/TabNavLink.js.map +1 -0
- package/dist/Tab/TabPanel.cjs +2 -0
- package/dist/Tab/TabPanel.cjs.map +1 -0
- package/dist/Tab/TabPanel.js +7 -0
- package/dist/Tab/TabPanel.js.map +1 -0
- package/dist/Timeline/TimelinePin.cjs +1 -1
- package/dist/Timeline/TimelinePin.cjs.map +1 -1
- package/dist/Timeline/TimelinePin.js +1 -1
- package/dist/Timeline/TimelinePin.js.map +1 -1
- package/dist/Toggle/Toggle.cjs.map +1 -1
- package/dist/Toggle/Toggle.js.map +1 -1
- package/dist/Toolbar/ToolbarItem.cjs +1 -1
- package/dist/Toolbar/ToolbarItem.cjs.map +1 -1
- package/dist/index.cjs +3 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +6 -2
- package/dist/index.js.map +1 -1
- package/dist/track-focus.cjs.map +1 -1
- package/dist/track-focus.js.map +1 -1
- package/dist/types/Icon/Icon.d.ts +1 -1
- package/dist/types/NavScroll/types.d.ts +2 -2
- package/dist/types/Stepper/StepperHeaderElement.d.ts +4 -4
- package/dist/types/Tab/TabNav.d.ts +24 -0
- package/dist/types/Tab/TabNavItem.d.ts +8 -0
- package/dist/types/Tab/TabNavLink.d.ts +8 -0
- package/dist/types/Tab/TabPanel.d.ts +8 -0
- package/dist/types/index.d.ts +11 -3
- package/package.json +5 -3
- package/src/Alert/Alert.tsx +1 -2
- package/src/Autocomplete/Autocomplete.tsx +70 -69
- package/src/BackToTop/BackToTop.tsx +2 -1
- package/src/Card/CardCategory.tsx +17 -4
- package/src/Collapse/Collapse.tsx +8 -12
- package/src/Dropdown/Dropdown.tsx +4 -6
- package/src/Forward/Forward.tsx +3 -3
- package/src/Grid/GridItemTextWrapper.tsx +7 -1
- package/src/Header/HeaderToggler.tsx +2 -2
- package/src/Icon/Icon.tsx +22 -4
- package/src/Icon/assets/index.ts +1 -1
- package/src/Input/Input.tsx +13 -7
- package/src/Input/InputContainer.tsx +0 -1
- package/src/Input/TextArea.tsx +1 -4
- package/src/Input/utils.tsx +1 -2
- package/src/List/List.tsx +1 -8
- package/src/List/ListItem.tsx +24 -33
- package/src/NavScroll/types.ts +2 -2
- package/src/ResponsiveImage/ResponsiveImage.tsx +13 -7
- package/src/Skiplink/Skiplink.tsx +12 -7
- package/src/Skiplink/SkiplinkItem.tsx +1 -1
- package/src/Stepper/StepperHeaderElement.tsx +8 -10
- package/src/Tab/TabNav.tsx +111 -0
- package/src/Tab/TabNavItem.tsx +14 -0
- package/src/Tab/TabNavLink.tsx +14 -0
- package/src/Tab/TabPanel.tsx +14 -0
- package/src/Timeline/TimelinePin.tsx +2 -2
- package/src/Toggle/Toggle.tsx +1 -1
- package/src/index.ts +9 -5
- package/src/track-focus.js +14 -15
|
@@ -9,19 +9,17 @@ const variants = {
|
|
|
9
9
|
// @deprecated
|
|
10
10
|
'steppers-index': 'steppers-index'
|
|
11
11
|
};
|
|
12
|
-
export const StepperHeaderElement = ({ tag = 'li', variant, appendIcon, prependIcon,
|
|
12
|
+
export const StepperHeaderElement = ({ tag = 'li', variant, appendIcon, prependIcon, appendIconTitle, prependIconTitle, noLine, stepperNumber, testId, children, className, ...attributes }) => {
|
|
13
13
|
const Tag = tag;
|
|
14
14
|
const wrapperClasses = classNames(variant ? variants[variant] : '', className, {
|
|
15
15
|
'no-line': noLine
|
|
16
16
|
});
|
|
17
17
|
const iconClass = classNames('icon', 'steppers-success');
|
|
18
18
|
const spanClass = classNames('steppers-number');
|
|
19
|
-
const iconToAppend = appendIcon || icon;
|
|
20
|
-
const iconToPrepend = prependIcon || iconName;
|
|
21
19
|
return (React.createElement(Tag, { ...attributes, className: wrapperClasses, "data-testid": testId },
|
|
22
|
-
|
|
20
|
+
prependIcon && React.createElement(Icon, { icon: prependIcon, title: prependIconTitle }),
|
|
23
21
|
stepperNumber && React.createElement("span", { className: spanClass }, stepperNumber),
|
|
24
22
|
children,
|
|
25
|
-
|
|
23
|
+
appendIcon && React.createElement(Icon, { icon: appendIcon, title: appendIconTitle, className: iconClass })));
|
|
26
24
|
};
|
|
27
25
|
//# sourceMappingURL=StepperHeaderElement.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StepperHeaderElement.js","sourceRoot":"","sources":["../../src/Stepper/StepperHeaderElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAC1E,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,MAAM,QAAQ,GAAG;IACf,SAAS,EAAE,WAAW;IACtB,MAAM,EAAE,QAAQ;IAChB,IAAI,EAAE,MAAM;IACZ,MAAM,EAAE,gBAAgB;IACxB,cAAc;IACd,gBAAgB,EAAE,gBAAgB;CAC1B,CAAC;AA+BX,MAAM,CAAC,MAAM,oBAAoB,GAAkC,CAAC,EAClE,GAAG,GAAG,IAAI,EACV,OAAO,EACP,UAAU,EACV,WAAW,EACX,
|
|
1
|
+
{"version":3,"file":"StepperHeaderElement.js","sourceRoot":"","sources":["../../src/Stepper/StepperHeaderElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAC1E,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,MAAM,QAAQ,GAAG;IACf,SAAS,EAAE,WAAW;IACtB,MAAM,EAAE,QAAQ;IAChB,IAAI,EAAE,MAAM;IACZ,MAAM,EAAE,gBAAgB;IACxB,cAAc;IACd,gBAAgB,EAAE,gBAAgB;CAC1B,CAAC;AA+BX,MAAM,CAAC,MAAM,oBAAoB,GAAkC,CAAC,EAClE,GAAG,GAAG,IAAI,EACV,OAAO,EACP,UAAU,EACV,WAAW,EACX,eAAe,EACf,gBAAgB,EAChB,MAAM,EACN,aAAa,EACb,MAAM,EACN,QAAQ,EACR,SAAS,EACT,GAAG,UAAU,EACd,EAAE,EAAE;IACH,MAAM,GAAG,GAAG,GAAG,CAAC;IAChB,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,SAAS,EAAE;QAC7E,SAAS,EAAE,MAAM;KAClB,CAAC,CAAC;IACH,MAAM,SAAS,GAAG,UAAU,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IACzD,MAAM,SAAS,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IAEhD,OAAO,CACL,oBAAC,GAAG,OAAK,UAAU,EAAE,SAAS,EAAE,cAAc,iBAAe,MAAM;QAChE,WAAW,IAAI,oBAAC,IAAI,IAAC,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,gBAAgB,GAAI;QACnE,aAAa,IAAI,8BAAM,SAAS,EAAE,SAAS,IAAG,aAAa,CAAQ;QACnE,QAAQ;QACR,UAAU,IAAI,oBAAC,IAAI,IAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,eAAe,EAAE,SAAS,EAAE,SAAS,GAAI,CACnF,CACP,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var h=Object.create;var i=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var P=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty;var A=(e,a)=>{for(var r in a)i(e,r,{get:a[r],enumerable:!0})},d=(e,a,r,c)=>{if(a&&typeof a=="object"||typeof a=="function")for(let l of D(a))!x.call(e,l)&&l!==r&&i(e,l,{get:()=>a[l],enumerable:!(c=y(a,l))||c.enumerable});return e};var m=(e,a,r)=>(r=e!=null?h(P(e)):{},d(a||!e||!e.__esModule?i(r,"default",{value:e,enumerable:!0}):r,e)),L=e=>d(i({},"__esModule",{value:!0}),e);var H={};A(H,{TabNav:()=>S});module.exports=L(H);var v=m(require("classnames"),1),f=m(require("react"),1),T=require("react-bootstrap"),S=({className:e,vertical:a=!1,dark:r=!1,card:c=!1,tag:l="ul",testId:g,...E})=>{let N=l,p=(0,f.useRef)(),k=(0,v.default)(e,"nav-tabs",{"nav-tabs-vertical":a},{"nav-dark":r},{"nav-tabs-cards":c}),s=0,u=-1,b=(o,w=!1)=>{let t=p.current?.querySelectorAll(".nav-link");if(t){for(let n=0;n<t.length;n++)t[n].ariaSelected==="true"&&(u=n),!w&&document.activeElement===t[n]&&(s=n),t[n].ariaSelected="false";switch(o.key){case"ArrowLeft":case"ArrowUp":o.stopPropagation(),o.preventDefault(),s-1<0&&(s=t.length),s=(s-1)%t.length;break;case"ArrowRight":case"ArrowDown":o.stopPropagation(),o.preventDefault(),s=(s+1)%t.length;break;case"Enter":o.stopPropagation(),o.preventDefault(),t[s].click();break;case"Tab":break;default:return}t[s].ariaDisabled==="true"?b(o,!0):(t[s].focus({preventScroll:!0}),setTimeout(()=>{t[u].ariaSelected="true"},300))}};return f.default.createElement(T.Nav,{ref:p,as:N,className:k,"data-testid":g,...E,onKeyDown:b})};0&&(module.exports={TabNav});
|
|
2
|
+
//# sourceMappingURL=TabNav.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Tab/TabNav.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport React, { ElementType, FC, useRef } from 'react';\nimport { Nav, NavProps } from 'react-bootstrap';\n\nexport interface TabNavProps extends NavProps {\n /** Utilizzarlo in caso di utilizzo di componenti personalizzati\n * @default ul\n */\n tag?: ElementType;\n /** Classi aggiuntive da usare per il componente Tab */\n className?: string;\n /** Imposta l'orientameno delle tab in verticale\n * @default false\n */\n vertical?: boolean;\n /** Imposta la tab con sfondo scuro\n * @default false\n */\n dark?: boolean;\n /** Imposta la tab con design tipo card\n * @default false\n */\n card?: boolean;\n testId?: string;\n}\n\nexport const TabNav: FC<TabNavProps> = ({\n className,\n vertical = false,\n dark = false,\n card = false,\n tag = 'ul',\n testId,\n ...attributes\n}) => {\n const Tag = tag;\n const rootRef = useRef<HTMLInputElement>();\n\n const classes = classNames(\n className,\n 'nav-tabs',\n { 'nav-tabs-vertical': vertical },\n { 'nav-dark': dark },\n { 'nav-tabs-cards': card }\n );\n let currentTabIndex = 0;\n let activeTabIndex = -1;\n\n // Ugly workaround to keep Bootstrap Italia behaviour\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>, disabled: boolean = false) => {\n const queriedElements = rootRef.current?.querySelectorAll('.nav-link');\n if (queriedElements) {\n for (let i = 0; i < queriedElements.length; i++) {\n if (queriedElements[i].ariaSelected === 'true') {\n activeTabIndex = i;\n }\n // Disabled elements ignore current focused tab\n if (!disabled && document.activeElement === queriedElements[i]) {\n currentTabIndex = i;\n }\n queriedElements[i].ariaSelected = 'false';\n }\n switch (event.key) {\n case 'ArrowLeft':\n case 'ArrowUp':\n event.stopPropagation();\n event.preventDefault();\n if (currentTabIndex - 1 < 0) {\n currentTabIndex = queriedElements.length;\n }\n currentTabIndex = (currentTabIndex - 1) % queriedElements.length;\n break;\n case 'ArrowRight':\n case 'ArrowDown':\n event.stopPropagation();\n event.preventDefault();\n currentTabIndex = (currentTabIndex + 1) % queriedElements.length;\n break;\n case 'Enter':\n event.stopPropagation();\n event.preventDefault();\n (queriedElements[currentTabIndex] as HTMLElement).click();\n break;\n case 'Tab':\n break;\n default:\n return;\n }\n if (queriedElements[currentTabIndex].ariaDisabled === 'true') {\n handleKeyDown(event, true);\n } else {\n (queriedElements[currentTabIndex] as HTMLElement).focus({ preventScroll: true });\n setTimeout(() => {\n queriedElements[activeTabIndex].ariaSelected = 'true';\n }, 300);\n }\n }\n };\n\n return (\n <Nav\n ref={rootRef}\n as={Tag}\n className={classes}\n data-testid={testId}\n {...attributes}\n onKeyDown={handleKeyDown}\n ></Nav>\n );\n};\n"],"mappings":"0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,YAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAuB,2BACvBC,EAA+C,sBAC/CC,EAA8B,2BAwBjBJ,EAA0B,CAAC,CACtC,UAAAK,EACA,SAAAC,EAAW,GACX,KAAAC,EAAO,GACP,KAAAC,EAAO,GACP,IAAAC,EAAM,KACN,OAAAC,EACA,GAAGC,CACL,IAAM,CACJ,IAAMC,EAAMH,EACNI,KAAU,UAAyB,EAEnCC,KAAU,EAAAC,SACdV,EACA,WACA,CAAE,oBAAqBC,CAAS,EAChC,CAAE,WAAYC,CAAK,EACnB,CAAE,iBAAkBC,CAAK,CAC3B,EACIQ,EAAkB,EAClBC,EAAiB,GAIfC,EAAgB,CAACC,EAAyCC,EAAoB,KAAU,CAC5F,IAAMC,EAAkBR,EAAQ,SAAS,iBAAiB,WAAW,EACrE,GAAIQ,EAAiB,CACnB,QAASC,EAAI,EAAGA,EAAID,EAAgB,OAAQC,IACtCD,EAAgBC,CAAC,EAAE,eAAiB,SACtCL,EAAiBK,GAGf,CAACF,GAAY,SAAS,gBAAkBC,EAAgBC,CAAC,IAC3DN,EAAkBM,GAEpBD,EAAgBC,CAAC,EAAE,aAAe,QAEpC,OAAQH,EAAM,IAAK,CACjB,IAAK,YACL,IAAK,UACHA,EAAM,gBAAgB,EACtBA,EAAM,eAAe,EACjBH,EAAkB,EAAI,IACxBA,EAAkBK,EAAgB,QAEpCL,GAAmBA,EAAkB,GAAKK,EAAgB,OAC1D,MACF,IAAK,aACL,IAAK,YACHF,EAAM,gBAAgB,EACtBA,EAAM,eAAe,EACrBH,GAAmBA,EAAkB,GAAKK,EAAgB,OAC1D,MACF,IAAK,QACHF,EAAM,gBAAgB,EACtBA,EAAM,eAAe,EACpBE,EAAgBL,CAAe,EAAkB,MAAM,EACxD,MACF,IAAK,MACH,MACF,QACE,MACJ,CACIK,EAAgBL,CAAe,EAAE,eAAiB,OACpDE,EAAcC,EAAO,EAAI,GAExBE,EAAgBL,CAAe,EAAkB,MAAM,CAAE,cAAe,EAAK,CAAC,EAC/E,WAAW,IAAM,CACfK,EAAgBJ,CAAc,EAAE,aAAe,MACjD,EAAG,GAAG,EAEV,CACF,EAEA,OACE,EAAAM,QAAA,cAAC,OACC,IAAKV,EACL,GAAID,EACJ,UAAWE,EACX,cAAaJ,EACZ,GAAGC,EACJ,UAAWO,EACZ,CAEL","names":["TabNav_exports","__export","TabNav","__toCommonJS","import_classnames","import_react","import_react_bootstrap","className","vertical","dark","card","tag","testId","attributes","Tag","rootRef","classes","classNames","currentTabIndex","activeTabIndex","handleKeyDown","event","disabled","queriedElements","i","React"]}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import classNames from 'classnames';
|
|
2
|
+
import React, { useRef } from 'react';
|
|
3
|
+
import { Nav } from 'react-bootstrap';
|
|
4
|
+
export const TabNav = ({ className, vertical = false, dark = false, card = false, tag = 'ul', testId, ...attributes }) => {
|
|
5
|
+
const Tag = tag;
|
|
6
|
+
const rootRef = useRef();
|
|
7
|
+
const classes = classNames(className, 'nav-tabs', { 'nav-tabs-vertical': vertical }, { 'nav-dark': dark }, { 'nav-tabs-cards': card });
|
|
8
|
+
let currentTabIndex = 0;
|
|
9
|
+
let activeTabIndex = -1;
|
|
10
|
+
// Ugly workaround to keep Bootstrap Italia behaviour
|
|
11
|
+
const handleKeyDown = (event, disabled = false) => {
|
|
12
|
+
const queriedElements = rootRef.current?.querySelectorAll('.nav-link');
|
|
13
|
+
if (queriedElements) {
|
|
14
|
+
for (let i = 0; i < queriedElements.length; i++) {
|
|
15
|
+
if (queriedElements[i].ariaSelected === 'true') {
|
|
16
|
+
activeTabIndex = i;
|
|
17
|
+
}
|
|
18
|
+
// Disabled elements ignore current focused tab
|
|
19
|
+
if (!disabled && document.activeElement === queriedElements[i]) {
|
|
20
|
+
currentTabIndex = i;
|
|
21
|
+
}
|
|
22
|
+
queriedElements[i].ariaSelected = 'false';
|
|
23
|
+
}
|
|
24
|
+
switch (event.key) {
|
|
25
|
+
case 'ArrowLeft':
|
|
26
|
+
case 'ArrowUp':
|
|
27
|
+
event.stopPropagation();
|
|
28
|
+
event.preventDefault();
|
|
29
|
+
if (currentTabIndex - 1 < 0) {
|
|
30
|
+
currentTabIndex = queriedElements.length;
|
|
31
|
+
}
|
|
32
|
+
currentTabIndex = (currentTabIndex - 1) % queriedElements.length;
|
|
33
|
+
break;
|
|
34
|
+
case 'ArrowRight':
|
|
35
|
+
case 'ArrowDown':
|
|
36
|
+
event.stopPropagation();
|
|
37
|
+
event.preventDefault();
|
|
38
|
+
currentTabIndex = (currentTabIndex + 1) % queriedElements.length;
|
|
39
|
+
break;
|
|
40
|
+
case 'Enter':
|
|
41
|
+
event.stopPropagation();
|
|
42
|
+
event.preventDefault();
|
|
43
|
+
queriedElements[currentTabIndex].click();
|
|
44
|
+
break;
|
|
45
|
+
case 'Tab':
|
|
46
|
+
break;
|
|
47
|
+
default:
|
|
48
|
+
return;
|
|
49
|
+
}
|
|
50
|
+
if (queriedElements[currentTabIndex].ariaDisabled === 'true') {
|
|
51
|
+
handleKeyDown(event, true);
|
|
52
|
+
}
|
|
53
|
+
else {
|
|
54
|
+
queriedElements[currentTabIndex].focus({ preventScroll: true });
|
|
55
|
+
setTimeout(() => {
|
|
56
|
+
queriedElements[activeTabIndex].ariaSelected = 'true';
|
|
57
|
+
}, 300);
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
};
|
|
61
|
+
return (React.createElement(Nav, { ref: rootRef, as: Tag, className: classes, "data-testid": testId, ...attributes, onKeyDown: handleKeyDown }));
|
|
62
|
+
};
|
|
63
|
+
//# sourceMappingURL=TabNav.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TabNav.js","sourceRoot":"","sources":["../../src/Tab/TabNav.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var I=Object.create;var m=Object.defineProperty;var i=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var N=Object.getPrototypeOf,T=Object.prototype.hasOwnProperty;var d=(t,e)=>{for(var a in e)m(t,a,{get:e[a],enumerable:!0})},s=(t,e,a,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of v(e))!T.call(t,r)&&r!==a&&m(t,r,{get:()=>e[r],enumerable:!(o=i(e,r))||o.enumerable});return t};var l=(t,e,a)=>(a=t!=null?I(N(t)):{},s(e||!t||!t.__esModule?m(a,"default",{value:t,enumerable:!0}):a,t)),P=t=>s(m({},"__esModule",{value:!0}),t);var c={};d(c,{TabNavItem:()=>b});module.exports=P(c);var p=l(require("react"),1),n=require("react-bootstrap"),b=({tag:t="li",testId:e,...a})=>{let o=t;return p.default.createElement(n.Nav.Item,{as:o,role:"presentation","data-testid":e,...a})};0&&(module.exports={TabNavItem});
|
|
2
|
+
//# sourceMappingURL=TabNavItem.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Tab/TabNavItem.tsx"],"sourcesContent":["import React, { ElementType, FC } from 'react';\nimport { Nav, NavItemProps } from 'react-bootstrap';\n\nexport interface TabNavItemProps extends NavItemProps {\n /** Utilizzarlo in caso di utilizzo di componenti personalizzati */\n tag?: ElementType;\n testId?: string;\n}\n\nexport const TabNavItem: FC<TabNavItemProps> = ({ tag = 'li', testId, ...attributes }) => {\n const Tag = tag;\n\n return <Nav.Item as={Tag} role='presentation' data-testid={testId} {...attributes}></Nav.Item>;\n};\n"],"mappings":"0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,gBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAuC,sBACvCC,EAAkC,2BAQrBH,EAAkC,CAAC,CAAE,IAAAI,EAAM,KAAM,OAAAC,EAAQ,GAAGC,CAAW,IAAM,CACxF,IAAMC,EAAMH,EAEZ,OAAO,EAAAI,QAAA,cAAC,MAAI,KAAJ,CAAS,GAAID,EAAK,KAAK,eAAe,cAAaF,EAAS,GAAGC,EAAY,CACrF","names":["TabNavItem_exports","__export","TabNavItem","__toCommonJS","import_react","import_react_bootstrap","tag","testId","attributes","Tag","React"]}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Nav } from 'react-bootstrap';
|
|
3
|
+
export const TabNavItem = ({ tag = 'li', testId, ...attributes }) => {
|
|
4
|
+
const Tag = tag;
|
|
5
|
+
return React.createElement(Nav.Item, { as: Tag, role: 'presentation', "data-testid": testId, ...attributes });
|
|
6
|
+
};
|
|
7
|
+
//# sourceMappingURL=TabNavItem.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TabNavItem.js","sourceRoot":"","sources":["../../src/Tab/TabNavItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAC/C,OAAO,EAAE,GAAG,EAAgB,MAAM,iBAAiB,CAAC;AAQpD,MAAM,CAAC,MAAM,UAAU,GAAwB,CAAC,EAAE,GAAG,GAAG,IAAI,EAAE,MAAM,EAAE,GAAG,UAAU,EAAE,EAAE,EAAE;IACvF,MAAM,GAAG,GAAG,GAAG,CAAC;IAEhB,OAAO,oBAAC,GAAG,CAAC,IAAI,IAAC,EAAE,EAAE,GAAG,EAAE,IAAI,EAAC,cAAc,iBAAc,MAAM,KAAM,UAAU,GAAa,CAAC;AACjG,CAAC,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var k=Object.create;var i=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var N=Object.getPrototypeOf,m=Object.prototype.hasOwnProperty;var T=(t,a)=>{for(var e in a)i(t,e,{get:a[e],enumerable:!0})},o=(t,a,e,r)=>{if(a&&typeof a=="object"||typeof a=="function")for(let n of L(a))!m.call(t,n)&&n!==e&&i(t,n,{get:()=>a[n],enumerable:!(r=v(a,n))||r.enumerable});return t};var d=(t,a,e)=>(e=t!=null?k(N(t)):{},o(a||!t||!t.__esModule?i(e,"default",{value:t,enumerable:!0}):e,t)),P=t=>o(i({},"__esModule",{value:!0}),t);var c={};T(c,{TabNavLink:()=>b});module.exports=P(c);var s=d(require("react"),1),p=require("react-bootstrap"),b=({tag:t,testId:a,...e})=>{let r=t;return s.default.createElement(p.Nav.Link,{as:r,"data-testid":a,...e})};0&&(module.exports={TabNavLink});
|
|
2
|
+
//# sourceMappingURL=TabNavLink.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Tab/TabNavLink.tsx"],"sourcesContent":["import React, { ElementType, FC } from 'react';\nimport { Nav, NavLinkProps } from 'react-bootstrap';\n\nexport interface TabNavLinkProps extends NavLinkProps {\n /** Utilizzarlo in caso di utilizzo di componenti personalizzati */\n tag?: ElementType;\n testId?: string;\n}\n\nexport const TabNavLink: FC<TabNavLinkProps> = ({ tag, testId, ...attributes }) => {\n const Tag = tag;\n\n return <Nav.Link as={Tag} data-testid={testId} {...attributes}></Nav.Link>;\n};\n"],"mappings":"0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,gBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAuC,sBACvCC,EAAkC,2BAQrBH,EAAkC,CAAC,CAAE,IAAAI,EAAK,OAAAC,EAAQ,GAAGC,CAAW,IAAM,CACjF,IAAMC,EAAMH,EAEZ,OAAO,EAAAI,QAAA,cAAC,MAAI,KAAJ,CAAS,GAAID,EAAK,cAAaF,EAAS,GAAGC,EAAY,CACjE","names":["TabNavLink_exports","__export","TabNavLink","__toCommonJS","import_react","import_react_bootstrap","tag","testId","attributes","Tag","React"]}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Nav } from 'react-bootstrap';
|
|
3
|
+
export const TabNavLink = ({ tag, testId, ...attributes }) => {
|
|
4
|
+
const Tag = tag;
|
|
5
|
+
return React.createElement(Nav.Link, { as: Tag, "data-testid": testId, ...attributes });
|
|
6
|
+
};
|
|
7
|
+
//# sourceMappingURL=TabNavLink.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TabNavLink.js","sourceRoot":"","sources":["../../src/Tab/TabNavLink.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAC/C,OAAO,EAAE,GAAG,EAAgB,MAAM,iBAAiB,CAAC;AAQpD,MAAM,CAAC,MAAM,UAAU,GAAwB,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,UAAU,EAAE,EAAE,EAAE;IAChF,MAAM,GAAG,GAAG,GAAG,CAAC;IAEhB,OAAO,oBAAC,GAAG,CAAC,IAAI,IAAC,EAAE,EAAE,GAAG,iBAAe,MAAM,KAAM,UAAU,GAAa,CAAC;AAC7E,CAAC,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var T=Object.create;var n=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var C=Object.getPrototypeOf,d=Object.prototype.hasOwnProperty;var P=(t,e)=>{for(var r in e)n(t,r,{get:e[r],enumerable:!0})},s=(t,e,r,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of b(e))!d.call(t,a)&&a!==r&&n(t,a,{get:()=>e[a],enumerable:!(o=m(e,a))||o.enumerable});return t};var c=(t,e,r)=>(r=t!=null?T(C(t)):{},s(e||!t||!t.__esModule?n(r,"default",{value:t,enumerable:!0}):r,t)),f=t=>s(n({},"__esModule",{value:!0}),t);var x={};P(x,{TabContainer:()=>g});module.exports=f(x);var p=c(require("react"),1),i=require("react-bootstrap"),g=({tag:t,testId:e,...r})=>{let o=t;return p.default.createElement(i.Tab.Container,{as:o,"data-testid":e,...r})};0&&(module.exports={TabContainer});
|
|
2
|
+
//# sourceMappingURL=TabPanel.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Tab/TabPanel.tsx"],"sourcesContent":["import React, { ElementType, FC } from 'react';\nimport { NavProps, Tab } from 'react-bootstrap';\n\nexport interface TabsProps extends NavProps {\n /** Utilizzarlo in caso di utilizzo di componenti personalizzati */\n tag?: ElementType;\n testId?: string;\n}\n\nexport const TabContainer: FC<TabsProps> = ({ tag, testId, ...attributes }) => {\n const Tag = tag;\n\n return <Tab.Container as={Tag} data-testid={testId} {...attributes}></Tab.Container>;\n};\n"],"mappings":"0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,kBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAuC,sBACvCC,EAA8B,2BAQjBH,EAA8B,CAAC,CAAE,IAAAI,EAAK,OAAAC,EAAQ,GAAGC,CAAW,IAAM,CAC7E,IAAMC,EAAMH,EAEZ,OAAO,EAAAI,QAAA,cAAC,MAAI,UAAJ,CAAc,GAAID,EAAK,cAAaF,EAAS,GAAGC,EAAY,CACtE","names":["TabPanel_exports","__export","TabContainer","__toCommonJS","import_react","import_react_bootstrap","tag","testId","attributes","Tag","React"]}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Tab } from 'react-bootstrap';
|
|
3
|
+
export const TabContainer = ({ tag, testId, ...attributes }) => {
|
|
4
|
+
const Tag = tag;
|
|
5
|
+
return React.createElement(Tab.Container, { as: Tag, "data-testid": testId, ...attributes });
|
|
6
|
+
};
|
|
7
|
+
//# sourceMappingURL=TabPanel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TabPanel.js","sourceRoot":"","sources":["../../src/Tab/TabPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAC/C,OAAO,EAAY,GAAG,EAAE,MAAM,iBAAiB,CAAC;AAQhD,MAAM,CAAC,MAAM,YAAY,GAAkB,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,UAAU,EAAE,EAAE,EAAE;IAC5E,MAAM,GAAG,GAAG,GAAG,CAAC;IAEhB,OAAO,oBAAC,GAAG,CAAC,SAAS,IAAC,EAAE,EAAE,GAAG,iBAAe,MAAM,KAAM,UAAU,GAAkB,CAAC;AACvF,CAAC,CAAC"}
|