@laerdal/life-react-components 2.1.1-dev.15 → 2.1.1-dev.16
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/dist/GlobalNavigationBar/desktop/RightSideNav.cjs +8 -6
- package/dist/GlobalNavigationBar/desktop/RightSideNav.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/RightSideNav.js +8 -6
- package/dist/GlobalNavigationBar/desktop/RightSideNav.js.map +1 -1
- package/dist/Tooltips/TooltipStyles.cjs +1 -1
- package/dist/Tooltips/TooltipStyles.cjs.map +1 -1
- package/dist/Tooltips/TooltipStyles.js +1 -1
- package/dist/Tooltips/TooltipStyles.js.map +1 -1
- package/dist/Tooltips/TooltipTypes.cjs +0 -5
- package/dist/Tooltips/TooltipTypes.cjs.map +1 -1
- package/dist/Tooltips/TooltipTypes.d.ts +2 -0
- package/dist/Tooltips/TooltipTypes.js +0 -5
- package/dist/Tooltips/TooltipTypes.js.map +1 -1
- package/dist/Tooltips/TooltipWrapper.cjs +48 -1
- package/dist/Tooltips/TooltipWrapper.cjs.map +1 -1
- package/dist/Tooltips/TooltipWrapper.d.ts +1 -1
- package/dist/Tooltips/TooltipWrapper.js +50 -2
- package/dist/Tooltips/TooltipWrapper.js.map +1 -1
- package/package.json +1 -1
|
@@ -50,16 +50,18 @@ var RightSideNav = function RightSideNav(_ref) {
|
|
|
50
50
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(NavContainer, {
|
|
51
51
|
children: [items === null || items === void 0 ? void 0 : items.reverse().map(function (no) {
|
|
52
52
|
return getNavItem(no);
|
|
53
|
-
}), action && !action.tooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledButton, {
|
|
53
|
+
}), action && !action.tooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledButton, _objectSpread(_objectSpread({
|
|
54
54
|
variant: "secondary",
|
|
55
|
-
onClick: action === null || action === void 0 ? void 0 : action.action
|
|
55
|
+
onClick: action === null || action === void 0 ? void 0 : action.action
|
|
56
|
+
}, action), {}, {
|
|
56
57
|
children: action.label
|
|
57
|
-
}), action && !!action.tooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltips.TooltipWrapper, _objectSpread(_objectSpread({}, action.tooltip), {}, {
|
|
58
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledButton, {
|
|
58
|
+
})), action && !!action.tooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltips.TooltipWrapper, _objectSpread(_objectSpread({}, action.tooltip), {}, {
|
|
59
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledButton, _objectSpread(_objectSpread({
|
|
59
60
|
variant: "secondary",
|
|
60
|
-
onClick: action === null || action === void 0 ? void 0 : action.action
|
|
61
|
+
onClick: action === null || action === void 0 ? void 0 : action.action
|
|
62
|
+
}, action), {}, {
|
|
61
63
|
children: action.label
|
|
62
|
-
})
|
|
64
|
+
}))
|
|
63
65
|
}))]
|
|
64
66
|
});
|
|
65
67
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightSideNav.cjs","names":["NavContainer","styled","div","BREAKPOINTS","MEDIUM","LARGE","StyledButton","Button","ComponentMStyling","ComponentTextStyle","Bold","RightSideNav","items","action","getNavItem","item","disabled","label","NavLink","to","defaultOnMouseDownHandler","e","reverse","map","no","tooltip"],"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../../NavItem';\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\nimport {Button} from '../../Button';\nimport {ComponentMStyling} from '../../styles';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\nimport {Tooltip, TooltipWrapper} from \"../../Tooltips\";\n\nconst NavContainer = styled.div`\n display: none;\n margin: auto 0 auto auto;\n align-items: center;\n height: 56px;\n\n a {\n text-decoration: none;\n }\n\n ${BREAKPOINTS.MEDIUM} {\n display: flex;\n }\n\n ${BREAKPOINTS.LARGE} {\n height: 64px;\n }\n\n button,\n div {\n &:hover {\n cursor: pointer;\n }\n }\n`;\n\nconst StyledButton = styled(Button)`\n height: 40px;\n margin: 0 8px;\n\n ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n items?: MenuNavigationItemTypeItem[];\n action?: MenuButton;\n};\n\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\n const getNavItem = (item: MenuNavigationItemTypeItem) => {\n if (item?.disabled) {\n return (\n <NavItem as={Button} className=\"disabled\" key={item?.label}>\n {item?.label}\n </NavItem>\n );\n } else {\n return (\n <NavItem\n as={NavLink}\n to={item?.to || ''}\n key={item?.label}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\n {item?.label}\n </NavItem>\n );\n }\n };\n return (\n <NavContainer>\n {items?.reverse().map(no => getNavItem(no))}\n\n {\n action && !action.tooltip &&\n <StyledButton variant=\"secondary\" onClick={action?.action}>\n {action.label}\n </StyledButton>\n }\n {\n action && !!action.tooltip &&\n <TooltipWrapper {...action.tooltip}>\n <StyledButton variant=\"secondary\" onClick={action?.action}>\n {action.label}\n </StyledButton>\n </TooltipWrapper>\n }\n\n </NavContainer>\n );\n};\n\nexport default RightSideNav;\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AAAuD;AAAA;AAAA;AAAA;AAAA;AAAA;AAEvD,IAAMA,YAAY,GAAGC,yBAAM,CAACC,GAAG,0WAU3BC,mBAAW,CAACC,MAAM,EAIlBD,mBAAW,CAACE,KAAK,CAUpB;AAED,IAAMC,YAAY,GAAG,IAAAL,yBAAM,EAACM,cAAM,CAAC,qIAI/B,IAAAC,yBAAiB,EAACC,0BAAkB,CAACC,IAAI,EAAE,OAAO,CAAC,CACtD;AAOD,IAAMC,YAAY,GAAG,SAAfA,YAAY,OAA0D;EAAA,IAArDC,KAAK,QAALA,KAAK;IAAEC,MAAM,QAANA,MAAM;EAClC,IAAMC,UAAU,GAAG,SAAbA,UAAU,CAAIC,IAAgC,EAAK;IACvD,IAAIA,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAEC,QAAQ,EAAE;MAClB,oBACE,qBAAC,gBAAO;QAAC,EAAE,EAAET,cAAO;QAAC,SAAS,EAAC,UAAU;QAAA,UACtCQ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE;MAAK,GADiCF,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,KAAK,CAEhD;IAEd,CAAC,MAAM;MACL,oBACE,qBAAC,gBAAO;QACN,EAAE,EAAEC,uBAAQ;QACZ,EAAE,EAAE,CAAAH,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEI,EAAE,KAAI,EAAG;QAEnB,WAAW,EAAEC,iCAA0B;QACvC,OAAO,EAAE,iBAACC,CAAkB;UAAA,OAAKN,IAAI,CAACF,MAAM,IAAIE,IAAI,CAACF,MAAM,CAACQ,CAAC,CAAC;QAAA,CAAC;QAAA,UAC9DN,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE;MAAK,GAHPF,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,KAAK,CAIR;IAEd;EACF,CAAC;
|
|
1
|
+
{"version":3,"file":"RightSideNav.cjs","names":["NavContainer","styled","div","BREAKPOINTS","MEDIUM","LARGE","StyledButton","Button","ComponentMStyling","ComponentTextStyle","Bold","RightSideNav","items","action","getNavItem","item","disabled","label","NavLink","to","defaultOnMouseDownHandler","e","reverse","map","no","tooltip"],"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../../NavItem';\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\nimport {Button} from '../../Button';\nimport {ComponentMStyling} from '../../styles';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\nimport {Tooltip, TooltipWrapper} from \"../../Tooltips\";\n\nconst NavContainer = styled.div`\n display: none;\n margin: auto 0 auto auto;\n align-items: center;\n height: 56px;\n\n a {\n text-decoration: none;\n }\n\n ${BREAKPOINTS.MEDIUM} {\n display: flex;\n }\n\n ${BREAKPOINTS.LARGE} {\n height: 64px;\n }\n\n button,\n div {\n &:hover {\n cursor: pointer;\n }\n }\n`;\n\nconst StyledButton = styled(Button)`\n height: 40px;\n margin: 0 8px;\n\n ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n items?: MenuNavigationItemTypeItem[];\n action?: MenuButton;\n};\n\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\n const getNavItem = (item: MenuNavigationItemTypeItem) => {\n if (item?.disabled) {\n return (\n <NavItem as={Button} className=\"disabled\" key={item?.label}>\n {item?.label}\n </NavItem>\n );\n } else {\n return (\n <NavItem\n as={NavLink}\n to={item?.to || ''}\n key={item?.label}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\n {item?.label}\n </NavItem>\n );\n }\n };\n\n return (\n <NavContainer>\n {items?.reverse().map(no => getNavItem(no))}\n\n {\n action && !action.tooltip &&\n <StyledButton variant=\"secondary\" onClick={action?.action} {...action}>\n {action.label}\n </StyledButton>\n }\n {\n action && !!action.tooltip &&\n <TooltipWrapper {...action.tooltip}>\n <StyledButton variant=\"secondary\" onClick={action?.action} {...action}>\n {action.label}\n </StyledButton>\n </TooltipWrapper>\n }\n\n </NavContainer>\n );\n};\n\nexport default RightSideNav;\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AAAuD;AAAA;AAAA;AAAA;AAAA;AAAA;AAEvD,IAAMA,YAAY,GAAGC,yBAAM,CAACC,GAAG,0WAU3BC,mBAAW,CAACC,MAAM,EAIlBD,mBAAW,CAACE,KAAK,CAUpB;AAED,IAAMC,YAAY,GAAG,IAAAL,yBAAM,EAACM,cAAM,CAAC,qIAI/B,IAAAC,yBAAiB,EAACC,0BAAkB,CAACC,IAAI,EAAE,OAAO,CAAC,CACtD;AAOD,IAAMC,YAAY,GAAG,SAAfA,YAAY,OAA0D;EAAA,IAArDC,KAAK,QAALA,KAAK;IAAEC,MAAM,QAANA,MAAM;EAClC,IAAMC,UAAU,GAAG,SAAbA,UAAU,CAAIC,IAAgC,EAAK;IACvD,IAAIA,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAEC,QAAQ,EAAE;MAClB,oBACE,qBAAC,gBAAO;QAAC,EAAE,EAAET,cAAO;QAAC,SAAS,EAAC,UAAU;QAAA,UACtCQ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE;MAAK,GADiCF,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,KAAK,CAEhD;IAEd,CAAC,MAAM;MACL,oBACE,qBAAC,gBAAO;QACN,EAAE,EAAEC,uBAAQ;QACZ,EAAE,EAAE,CAAAH,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEI,EAAE,KAAI,EAAG;QAEnB,WAAW,EAAEC,iCAA0B;QACvC,OAAO,EAAE,iBAACC,CAAkB;UAAA,OAAKN,IAAI,CAACF,MAAM,IAAIE,IAAI,CAACF,MAAM,CAACQ,CAAC,CAAC;QAAA,CAAC;QAAA,UAC9DN,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE;MAAK,GAHPF,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,KAAK,CAIR;IAEd;EACF,CAAC;EAED,oBACE,sBAAC,YAAY;IAAA,WACVL,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEU,OAAO,EAAE,CAACC,GAAG,CAAC,UAAAC,EAAE;MAAA,OAAIV,UAAU,CAACU,EAAE,CAAC;IAAA,EAAC,EAGzCX,MAAM,IAAI,CAACA,MAAM,CAACY,OAAO,iBACzB,qBAAC,YAAY;MAAC,OAAO,EAAC,WAAW;MAAC,OAAO,EAAEZ,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEA;IAAO,GAAKA,MAAM;MAAA,UAClEA,MAAM,CAACI;IAAK,GACA,EAGfJ,MAAM,IAAI,CAAC,CAACA,MAAM,CAACY,OAAO,iBACxB,qBAAC,wBAAc,kCAAKZ,MAAM,CAACY,OAAO;MAAA,uBAChC,qBAAC,YAAY;QAAC,OAAO,EAAC,WAAW;QAAC,OAAO,EAAEZ,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEA;MAAO,GAAKA,MAAM;QAAA,UAClEA,MAAM,CAACI;MAAK;IACA,GACA;EAAA,EAGR;AAEnB,CAAC;AAAC;EA/CAL,KAAK;AAAA;AAAA,eAiDQD,YAAY;AAAA"}
|
|
@@ -42,16 +42,18 @@ var RightSideNav = function RightSideNav(_ref) {
|
|
|
42
42
|
return /*#__PURE__*/_jsxs(NavContainer, {
|
|
43
43
|
children: [items === null || items === void 0 ? void 0 : items.reverse().map(function (no) {
|
|
44
44
|
return getNavItem(no);
|
|
45
|
-
}), action && !action.tooltip && /*#__PURE__*/_jsx(StyledButton, {
|
|
45
|
+
}), action && !action.tooltip && /*#__PURE__*/_jsx(StyledButton, _objectSpread(_objectSpread({
|
|
46
46
|
variant: "secondary",
|
|
47
|
-
onClick: action === null || action === void 0 ? void 0 : action.action
|
|
47
|
+
onClick: action === null || action === void 0 ? void 0 : action.action
|
|
48
|
+
}, action), {}, {
|
|
48
49
|
children: action.label
|
|
49
|
-
}), action && !!action.tooltip && /*#__PURE__*/_jsx(TooltipWrapper, _objectSpread(_objectSpread({}, action.tooltip), {}, {
|
|
50
|
-
children: /*#__PURE__*/_jsx(StyledButton, {
|
|
50
|
+
})), action && !!action.tooltip && /*#__PURE__*/_jsx(TooltipWrapper, _objectSpread(_objectSpread({}, action.tooltip), {}, {
|
|
51
|
+
children: /*#__PURE__*/_jsx(StyledButton, _objectSpread(_objectSpread({
|
|
51
52
|
variant: "secondary",
|
|
52
|
-
onClick: action === null || action === void 0 ? void 0 : action.action
|
|
53
|
+
onClick: action === null || action === void 0 ? void 0 : action.action
|
|
54
|
+
}, action), {}, {
|
|
53
55
|
children: action.label
|
|
54
|
-
})
|
|
56
|
+
}))
|
|
55
57
|
}))]
|
|
56
58
|
});
|
|
57
59
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightSideNav.js","names":["React","styled","NavLink","NavItem","BREAKPOINTS","ComponentTextStyle","Button","ComponentMStyling","defaultOnMouseDownHandler","TooltipWrapper","NavContainer","div","MEDIUM","LARGE","StyledButton","Bold","RightSideNav","items","action","getNavItem","item","disabled","label","to","e","reverse","map","no","tooltip"],"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../../NavItem';\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\nimport {Button} from '../../Button';\nimport {ComponentMStyling} from '../../styles';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\nimport {Tooltip, TooltipWrapper} from \"../../Tooltips\";\n\nconst NavContainer = styled.div`\n display: none;\n margin: auto 0 auto auto;\n align-items: center;\n height: 56px;\n\n a {\n text-decoration: none;\n }\n\n ${BREAKPOINTS.MEDIUM} {\n display: flex;\n }\n\n ${BREAKPOINTS.LARGE} {\n height: 64px;\n }\n\n button,\n div {\n &:hover {\n cursor: pointer;\n }\n }\n`;\n\nconst StyledButton = styled(Button)`\n height: 40px;\n margin: 0 8px;\n\n ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n items?: MenuNavigationItemTypeItem[];\n action?: MenuButton;\n};\n\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\n const getNavItem = (item: MenuNavigationItemTypeItem) => {\n if (item?.disabled) {\n return (\n <NavItem as={Button} className=\"disabled\" key={item?.label}>\n {item?.label}\n </NavItem>\n );\n } else {\n return (\n <NavItem\n as={NavLink}\n to={item?.to || ''}\n key={item?.label}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\n {item?.label}\n </NavItem>\n );\n }\n };\n return (\n <NavContainer>\n {items?.reverse().map(no => getNavItem(no))}\n\n {\n action && !action.tooltip &&\n <StyledButton variant=\"secondary\" onClick={action?.action}>\n {action.label}\n </StyledButton>\n }\n {\n action && !!action.tooltip &&\n <TooltipWrapper {...action.tooltip}>\n <StyledButton variant=\"secondary\" onClick={action?.action}>\n {action.label}\n </StyledButton>\n </TooltipWrapper>\n }\n\n </NavContainer>\n );\n};\n\nexport default RightSideNav;\n"],"mappings":";;;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,OAAO,QAAO,kBAAkB;AAExC,SAAQC,OAAO,QAAO,eAAe;AACrC,SAAQC,WAAW,EAAEC,kBAAkB,QAAO,cAAc;AAC5D,SAAQC,MAAM,QAAO,cAAc;AACnC,SAAQC,iBAAiB,QAAO,cAAc;AAC9C,SAAQC,yBAAyB,QAAO,cAAc;AAEtD,SAAiBC,cAAc,QAAO,gBAAgB;AAAC;AAAA;AAEvD,IAAMC,YAAY,GAAGT,MAAM,CAACU,GAAG,4VAU3BP,WAAW,CAACQ,MAAM,EAIlBR,WAAW,CAACS,KAAK,CAUpB;AAED,IAAMC,YAAY,GAAGb,MAAM,CAACK,MAAM,CAAC,uHAI/BC,iBAAiB,CAACF,kBAAkB,CAACU,IAAI,EAAE,OAAO,CAAC,CACtD;AAOD,IAAMC,YAAY,GAAG,SAAfA,YAAY,OAA0D;EAAA,IAArDC,KAAK,QAALA,KAAK;IAAEC,MAAM,QAANA,MAAM;EAClC,IAAMC,UAAU,GAAG,SAAbA,UAAU,CAAIC,IAAgC,EAAK;IACvD,IAAIA,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAEC,QAAQ,EAAE;MAClB,oBACE,KAAC,OAAO;QAAC,EAAE,EAAEf,MAAO;QAAC,SAAS,EAAC,UAAU;QAAA,UACtCc,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE;MAAK,GADiCF,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,KAAK,CAEhD;IAEd,CAAC,MAAM;MACL,oBACE,KAAC,OAAO;QACN,EAAE,EAAEpB,OAAQ;QACZ,EAAE,EAAE,CAAAkB,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEG,EAAE,KAAI,EAAG;QAEnB,WAAW,EAAEf,yBAA0B;QACvC,OAAO,EAAE,iBAACgB,CAAkB;UAAA,OAAKJ,IAAI,CAACF,MAAM,IAAIE,IAAI,CAACF,MAAM,CAACM,CAAC,CAAC;QAAA,CAAC;QAAA,UAC9DJ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE;MAAK,GAHPF,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,KAAK,CAIR;IAEd;EACF,CAAC;
|
|
1
|
+
{"version":3,"file":"RightSideNav.js","names":["React","styled","NavLink","NavItem","BREAKPOINTS","ComponentTextStyle","Button","ComponentMStyling","defaultOnMouseDownHandler","TooltipWrapper","NavContainer","div","MEDIUM","LARGE","StyledButton","Bold","RightSideNav","items","action","getNavItem","item","disabled","label","to","e","reverse","map","no","tooltip"],"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../../NavItem';\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\nimport {Button} from '../../Button';\nimport {ComponentMStyling} from '../../styles';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\nimport {Tooltip, TooltipWrapper} from \"../../Tooltips\";\n\nconst NavContainer = styled.div`\n display: none;\n margin: auto 0 auto auto;\n align-items: center;\n height: 56px;\n\n a {\n text-decoration: none;\n }\n\n ${BREAKPOINTS.MEDIUM} {\n display: flex;\n }\n\n ${BREAKPOINTS.LARGE} {\n height: 64px;\n }\n\n button,\n div {\n &:hover {\n cursor: pointer;\n }\n }\n`;\n\nconst StyledButton = styled(Button)`\n height: 40px;\n margin: 0 8px;\n\n ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n items?: MenuNavigationItemTypeItem[];\n action?: MenuButton;\n};\n\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\n const getNavItem = (item: MenuNavigationItemTypeItem) => {\n if (item?.disabled) {\n return (\n <NavItem as={Button} className=\"disabled\" key={item?.label}>\n {item?.label}\n </NavItem>\n );\n } else {\n return (\n <NavItem\n as={NavLink}\n to={item?.to || ''}\n key={item?.label}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\n {item?.label}\n </NavItem>\n );\n }\n };\n\n return (\n <NavContainer>\n {items?.reverse().map(no => getNavItem(no))}\n\n {\n action && !action.tooltip &&\n <StyledButton variant=\"secondary\" onClick={action?.action} {...action}>\n {action.label}\n </StyledButton>\n }\n {\n action && !!action.tooltip &&\n <TooltipWrapper {...action.tooltip}>\n <StyledButton variant=\"secondary\" onClick={action?.action} {...action}>\n {action.label}\n </StyledButton>\n </TooltipWrapper>\n }\n\n </NavContainer>\n );\n};\n\nexport default RightSideNav;\n"],"mappings":";;;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,OAAO,QAAO,kBAAkB;AAExC,SAAQC,OAAO,QAAO,eAAe;AACrC,SAAQC,WAAW,EAAEC,kBAAkB,QAAO,cAAc;AAC5D,SAAQC,MAAM,QAAO,cAAc;AACnC,SAAQC,iBAAiB,QAAO,cAAc;AAC9C,SAAQC,yBAAyB,QAAO,cAAc;AAEtD,SAAiBC,cAAc,QAAO,gBAAgB;AAAC;AAAA;AAEvD,IAAMC,YAAY,GAAGT,MAAM,CAACU,GAAG,4VAU3BP,WAAW,CAACQ,MAAM,EAIlBR,WAAW,CAACS,KAAK,CAUpB;AAED,IAAMC,YAAY,GAAGb,MAAM,CAACK,MAAM,CAAC,uHAI/BC,iBAAiB,CAACF,kBAAkB,CAACU,IAAI,EAAE,OAAO,CAAC,CACtD;AAOD,IAAMC,YAAY,GAAG,SAAfA,YAAY,OAA0D;EAAA,IAArDC,KAAK,QAALA,KAAK;IAAEC,MAAM,QAANA,MAAM;EAClC,IAAMC,UAAU,GAAG,SAAbA,UAAU,CAAIC,IAAgC,EAAK;IACvD,IAAIA,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAEC,QAAQ,EAAE;MAClB,oBACE,KAAC,OAAO;QAAC,EAAE,EAAEf,MAAO;QAAC,SAAS,EAAC,UAAU;QAAA,UACtCc,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE;MAAK,GADiCF,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,KAAK,CAEhD;IAEd,CAAC,MAAM;MACL,oBACE,KAAC,OAAO;QACN,EAAE,EAAEpB,OAAQ;QACZ,EAAE,EAAE,CAAAkB,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEG,EAAE,KAAI,EAAG;QAEnB,WAAW,EAAEf,yBAA0B;QACvC,OAAO,EAAE,iBAACgB,CAAkB;UAAA,OAAKJ,IAAI,CAACF,MAAM,IAAIE,IAAI,CAACF,MAAM,CAACM,CAAC,CAAC;QAAA,CAAC;QAAA,UAC9DJ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE;MAAK,GAHPF,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,KAAK,CAIR;IAEd;EACF,CAAC;EAED,oBACE,MAAC,YAAY;IAAA,WACVL,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEQ,OAAO,EAAE,CAACC,GAAG,CAAC,UAAAC,EAAE;MAAA,OAAIR,UAAU,CAACQ,EAAE,CAAC;IAAA,EAAC,EAGzCT,MAAM,IAAI,CAACA,MAAM,CAACU,OAAO,iBACzB,KAAC,YAAY;MAAC,OAAO,EAAC,WAAW;MAAC,OAAO,EAAEV,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEA;IAAO,GAAKA,MAAM;MAAA,UAClEA,MAAM,CAACI;IAAK,GACA,EAGfJ,MAAM,IAAI,CAAC,CAACA,MAAM,CAACU,OAAO,iBACxB,KAAC,cAAc,kCAAKV,MAAM,CAACU,OAAO;MAAA,uBAChC,KAAC,YAAY;QAAC,OAAO,EAAC,WAAW;QAAC,OAAO,EAAEV,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEA;MAAO,GAAKA,MAAM;QAAA,UAClEA,MAAM,CAACI;MAAK;IACA,GACA;EAAA,EAGR;AAEnB,CAAC;AAAC;EA/CAL,KAAK;AAAA;AAiDP,eAAeD,YAAY"}
|
|
@@ -70,7 +70,7 @@ Tooltip.defaultProps = {
|
|
|
70
70
|
position: 'bottom'
|
|
71
71
|
};
|
|
72
72
|
var TooltipTrigger = function TooltipTrigger(delay) {
|
|
73
|
-
return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n &:hover ", ", &:focus-within ", ", &:focus ", " {\n
|
|
73
|
+
return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n &.hover {\n &:hover ", ", &:focus-within ", ", &:focus ", " {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ", ";\n }\n }\n\n &.click ", " {\n transition: 0.5s;\n transition-delay: ", ";\n }\n\n &.click.show ", " {\n opacity: 1;\n }\n\n &.click.hide ", " {\n opacity: 0;\n }\n\n"])), Tooltip, Tooltip, Tooltip, delay !== null && delay !== void 0 ? delay : '1s', Tooltip, delay !== null && delay !== void 0 ? delay : '0s', Tooltip, Tooltip);
|
|
74
74
|
};
|
|
75
75
|
exports.TooltipTrigger = TooltipTrigger;
|
|
76
76
|
var TooltipContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-block;\n position: relative;\n\n ", "\n \n &:focus{\n ", "\n }\n"])), function (props) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipStyles.cjs","names":["distanceToEdge","size","Size","XSmall","Small","Tooltip","styled","div","props","Medium","ComponentSStyling","ComponentTextStyle","Regular","COLORS","white","ComponentXSStyling","ComponentMStyling","align","BOXSHADOWS","BOXSHADOW_L2","width","height","primary_800","Z_INDEXES","tooltip","position","withArrow","defaultProps","TooltipTrigger","delay","css","TooltipContainer","focusStyles"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types';\nimport {BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst distanceToEdge = (size: Size | undefined) => {\n return size == Size.XSmall ? '8px' : (!size || size == Size.Small) ? '12px' : '16px';\n}\n\nexport const Tooltip = styled.div<{\n withArrow?: boolean;\n size?: Size;\n height?: string;\n align?: 'start' | 'end' | 'center' | undefined;\n position?: 'top' | 'right' | 'bottom' | 'left' | undefined;\n width?: string;\n}>`\n\n pointer-events: none;\n ${props => (props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.align == 'center' ? 'text-align: center;' : '')}\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n \n padding: ${props => props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px'};\n border-radius: 2px;\n ${props => props.width ? `width: ${props.width};` : 'width: max-content;'}\n height: ${props => props.height};\n max-width: 34em;\n background: ${COLORS.primary_800};\n position: absolute; \n opacity: 0; \n z-index: ${Z_INDEXES.tooltip};\n ${props => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\n\n ${props => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\n ${props => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\n \n ${props =>\n props.position == 'left' || props.position == 'right'\n ? ''\n : props.align == 'start'\n ? 'left: 0%;'\n : props.align == 'end'\n ? 'right: 0%;'\n : 'left: 50%; transform: translateX(-50%);'}\n\n\n&::after {\n ${props => (!props.withArrow ? 'display: none;' : '')}\n content: \"\";\n position: absolute;\n ${props => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\n \n ${props => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n ${props => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n\n ${props =>\n props.position == 'left' || props.position == 'right' ? '' : \n props.align == 'start' ? `left: ${distanceToEdge(props.size)};` : props.align == 'end' ? `right: ${distanceToEdge(props.size)};` : 'left: 50%;'}\n\n ${props => (props.position == 'left' ? '' : 'margin-left: -5px;')}\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ${props => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'right' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\n }\n`;\n\nTooltip.defaultProps = {\n withArrow: false,\n size: Size.Small,\n height: 'auto',\n align: 'center',\n position: 'bottom'\n}\n\nexport const TooltipTrigger = (delay?: string) => css`\n &:hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\n
|
|
1
|
+
{"version":3,"file":"TooltipStyles.cjs","names":["distanceToEdge","size","Size","XSmall","Small","Tooltip","styled","div","props","Medium","ComponentSStyling","ComponentTextStyle","Regular","COLORS","white","ComponentXSStyling","ComponentMStyling","align","BOXSHADOWS","BOXSHADOW_L2","width","height","primary_800","Z_INDEXES","tooltip","position","withArrow","defaultProps","TooltipTrigger","delay","css","TooltipContainer","focusStyles"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types';\nimport {BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst distanceToEdge = (size: Size | undefined) => {\n return size == Size.XSmall ? '8px' : (!size || size == Size.Small) ? '12px' : '16px';\n}\n\nexport const Tooltip = styled.div<{\n withArrow?: boolean;\n size?: Size;\n height?: string;\n align?: 'start' | 'end' | 'center' | undefined;\n position?: 'top' | 'right' | 'bottom' | 'left' | undefined;\n width?: string;\n}>`\n\n pointer-events: none;\n ${props => (props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.align == 'center' ? 'text-align: center;' : '')}\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n \n padding: ${props => props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px'};\n border-radius: 2px;\n ${props => props.width ? `width: ${props.width};` : 'width: max-content;'}\n height: ${props => props.height};\n max-width: 34em;\n background: ${COLORS.primary_800};\n position: absolute; \n opacity: 0; \n z-index: ${Z_INDEXES.tooltip};\n ${props => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\n\n ${props => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\n ${props => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\n \n ${props =>\n props.position == 'left' || props.position == 'right'\n ? ''\n : props.align == 'start'\n ? 'left: 0%;'\n : props.align == 'end'\n ? 'right: 0%;'\n : 'left: 50%; transform: translateX(-50%);'}\n\n\n&::after {\n ${props => (!props.withArrow ? 'display: none;' : '')}\n content: \"\";\n position: absolute;\n ${props => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\n \n ${props => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n ${props => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n\n ${props =>\n props.position == 'left' || props.position == 'right' ? '' : \n props.align == 'start' ? `left: ${distanceToEdge(props.size)};` : props.align == 'end' ? `right: ${distanceToEdge(props.size)};` : 'left: 50%;'}\n\n ${props => (props.position == 'left' ? '' : 'margin-left: -5px;')}\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ${props => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'right' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\n }\n`;\n\nTooltip.defaultProps = {\n withArrow: false,\n size: Size.Small,\n height: 'auto',\n align: 'center',\n position: 'bottom'\n}\n\nexport const TooltipTrigger = (delay?: string) => css`\n &.hover {\n &:hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ${delay ?? '1s'};\n }\n }\n\n &.click ${Tooltip} {\n transition: 0.5s;\n transition-delay: ${delay ?? '0s'};\n }\n\n &.click.show ${Tooltip} {\n opacity: 1;\n }\n\n &.click.hide ${Tooltip} {\n opacity: 0;\n }\n\n`;\n\nexport const TooltipContainer = styled.div<{delay?: string}>`\n display: inline-block;\n position: relative;\n\n ${props => TooltipTrigger(props.delay)}\n \n &:focus{\n ${focusStyles}\n }\n`;\n"],"mappings":"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"}
|
|
@@ -59,7 +59,7 @@ Tooltip.defaultProps = {
|
|
|
59
59
|
position: 'bottom'
|
|
60
60
|
};
|
|
61
61
|
export var TooltipTrigger = function TooltipTrigger(delay) {
|
|
62
|
-
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n &:hover ", ", &:focus-within ", ", &:focus ", " {\n
|
|
62
|
+
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n &.hover {\n &:hover ", ", &:focus-within ", ", &:focus ", " {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ", ";\n }\n }\n\n &.click ", " {\n transition: 0.5s;\n transition-delay: ", ";\n }\n\n &.click.show ", " {\n opacity: 1;\n }\n\n &.click.hide ", " {\n opacity: 0;\n }\n\n"])), Tooltip, Tooltip, Tooltip, delay !== null && delay !== void 0 ? delay : '1s', Tooltip, delay !== null && delay !== void 0 ? delay : '0s', Tooltip, Tooltip);
|
|
63
63
|
};
|
|
64
64
|
export var TooltipContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: inline-block;\n position: relative;\n\n ", "\n \n &:focus{\n ", "\n }\n"])), function (props) {
|
|
65
65
|
return TooltipTrigger(props.delay);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipStyles.js","names":["styled","css","Size","BOXSHADOWS","COLORS","ComponentTextStyle","focusStyles","ComponentMStyling","ComponentSStyling","ComponentXSStyling","Z_INDEXES","distanceToEdge","size","XSmall","Small","Tooltip","div","props","Medium","Regular","white","align","BOXSHADOW_L2","width","height","primary_800","tooltip","position","withArrow","defaultProps","TooltipTrigger","delay","TooltipContainer"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types';\nimport {BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst distanceToEdge = (size: Size | undefined) => {\n return size == Size.XSmall ? '8px' : (!size || size == Size.Small) ? '12px' : '16px';\n}\n\nexport const Tooltip = styled.div<{\n withArrow?: boolean;\n size?: Size;\n height?: string;\n align?: 'start' | 'end' | 'center' | undefined;\n position?: 'top' | 'right' | 'bottom' | 'left' | undefined;\n width?: string;\n}>`\n\n pointer-events: none;\n ${props => (props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.align == 'center' ? 'text-align: center;' : '')}\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n \n padding: ${props => props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px'};\n border-radius: 2px;\n ${props => props.width ? `width: ${props.width};` : 'width: max-content;'}\n height: ${props => props.height};\n max-width: 34em;\n background: ${COLORS.primary_800};\n position: absolute; \n opacity: 0; \n z-index: ${Z_INDEXES.tooltip};\n ${props => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\n\n ${props => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\n ${props => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\n \n ${props =>\n props.position == 'left' || props.position == 'right'\n ? ''\n : props.align == 'start'\n ? 'left: 0%;'\n : props.align == 'end'\n ? 'right: 0%;'\n : 'left: 50%; transform: translateX(-50%);'}\n\n\n&::after {\n ${props => (!props.withArrow ? 'display: none;' : '')}\n content: \"\";\n position: absolute;\n ${props => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\n \n ${props => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n ${props => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n\n ${props =>\n props.position == 'left' || props.position == 'right' ? '' : \n props.align == 'start' ? `left: ${distanceToEdge(props.size)};` : props.align == 'end' ? `right: ${distanceToEdge(props.size)};` : 'left: 50%;'}\n\n ${props => (props.position == 'left' ? '' : 'margin-left: -5px;')}\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ${props => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'right' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\n }\n`;\n\nTooltip.defaultProps = {\n withArrow: false,\n size: Size.Small,\n height: 'auto',\n align: 'center',\n position: 'bottom'\n}\n\nexport const TooltipTrigger = (delay?: string) => css`\n &:hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\n
|
|
1
|
+
{"version":3,"file":"TooltipStyles.js","names":["styled","css","Size","BOXSHADOWS","COLORS","ComponentTextStyle","focusStyles","ComponentMStyling","ComponentSStyling","ComponentXSStyling","Z_INDEXES","distanceToEdge","size","XSmall","Small","Tooltip","div","props","Medium","Regular","white","align","BOXSHADOW_L2","width","height","primary_800","tooltip","position","withArrow","defaultProps","TooltipTrigger","delay","TooltipContainer"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types';\nimport {BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst distanceToEdge = (size: Size | undefined) => {\n return size == Size.XSmall ? '8px' : (!size || size == Size.Small) ? '12px' : '16px';\n}\n\nexport const Tooltip = styled.div<{\n withArrow?: boolean;\n size?: Size;\n height?: string;\n align?: 'start' | 'end' | 'center' | undefined;\n position?: 'top' | 'right' | 'bottom' | 'left' | undefined;\n width?: string;\n}>`\n\n pointer-events: none;\n ${props => (props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.align == 'center' ? 'text-align: center;' : '')}\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n \n padding: ${props => props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px'};\n border-radius: 2px;\n ${props => props.width ? `width: ${props.width};` : 'width: max-content;'}\n height: ${props => props.height};\n max-width: 34em;\n background: ${COLORS.primary_800};\n position: absolute; \n opacity: 0; \n z-index: ${Z_INDEXES.tooltip};\n ${props => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\n\n ${props => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\n ${props => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\n \n ${props =>\n props.position == 'left' || props.position == 'right'\n ? ''\n : props.align == 'start'\n ? 'left: 0%;'\n : props.align == 'end'\n ? 'right: 0%;'\n : 'left: 50%; transform: translateX(-50%);'}\n\n\n&::after {\n ${props => (!props.withArrow ? 'display: none;' : '')}\n content: \"\";\n position: absolute;\n ${props => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\n \n ${props => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n ${props => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n\n ${props =>\n props.position == 'left' || props.position == 'right' ? '' : \n props.align == 'start' ? `left: ${distanceToEdge(props.size)};` : props.align == 'end' ? `right: ${distanceToEdge(props.size)};` : 'left: 50%;'}\n\n ${props => (props.position == 'left' ? '' : 'margin-left: -5px;')}\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ${props => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'right' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\n }\n`;\n\nTooltip.defaultProps = {\n withArrow: false,\n size: Size.Small,\n height: 'auto',\n align: 'center',\n position: 'bottom'\n}\n\nexport const TooltipTrigger = (delay?: string) => css`\n &.hover {\n &:hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ${delay ?? '1s'};\n }\n }\n\n &.click ${Tooltip} {\n transition: 0.5s;\n transition-delay: ${delay ?? '0s'};\n }\n\n &.click.show ${Tooltip} {\n opacity: 1;\n }\n\n &.click.hide ${Tooltip} {\n opacity: 0;\n }\n\n`;\n\nexport const TooltipContainer = styled.div<{delay?: string}>`\n display: inline-block;\n position: relative;\n\n ${props => TooltipTrigger(props.delay)}\n \n &:focus{\n ${focusStyles}\n }\n`;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipTypes.cjs","names":[],"sources":["../../src/Tooltips/TooltipTypes.tsx"],"sourcesContent":["import { Size } from \"../types\";\n\n/**\n * Types for the table.\n */\n export interface TooltipProps extends React.HTMLAttributes<HTMLDivElement> {\n\n label?: string;\n withArrow?: boolean;\n width?: string;\n size?: Size;\n delay?: string;\n tabIndex?: number;\n height?: string;\n align? : 'start' | 'end' | 'center' | undefined;\n position? : 'top' | 'right' | 'bottom' | 'left' | undefined;\n children?: React.ReactNode;\n }
|
|
1
|
+
{"version":3,"file":"TooltipTypes.cjs","names":[],"sources":["../../src/Tooltips/TooltipTypes.tsx"],"sourcesContent":["import { Size } from \"../types\";\n\n/**\n * Types for the table.\n */\n export interface TooltipProps extends React.HTMLAttributes<HTMLDivElement> {\n\n label?: string;\n withArrow?: boolean;\n width?: string;\n size?: Size;\n delay?: string;\n tabIndex?: number;\n height?: string;\n align? : 'start' | 'end' | 'center' | undefined;\n position? : 'top' | 'right' | 'bottom' | 'left' | undefined;\n children?: React.ReactNode;\n trigger?: 'hover' | 'click';\n hideAfter?: number;\n }\n"],"mappings":""}
|
|
@@ -13,4 +13,6 @@ export interface TooltipProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
13
13
|
align?: 'start' | 'end' | 'center' | undefined;
|
|
14
14
|
position?: 'top' | 'right' | 'bottom' | 'left' | undefined;
|
|
15
15
|
children?: React.ReactNode;
|
|
16
|
+
trigger?: 'hover' | 'click';
|
|
17
|
+
hideAfter?: number;
|
|
16
18
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipTypes.js","names":[],"sources":["../../src/Tooltips/TooltipTypes.tsx"],"sourcesContent":["import { Size } from \"../types\";\n\n/**\n * Types for the table.\n */\n export interface TooltipProps extends React.HTMLAttributes<HTMLDivElement> {\n\n label?: string;\n withArrow?: boolean;\n width?: string;\n size?: Size;\n delay?: string;\n tabIndex?: number;\n height?: string;\n align? : 'start' | 'end' | 'center' | undefined;\n position? : 'top' | 'right' | 'bottom' | 'left' | undefined;\n children?: React.ReactNode;\n }
|
|
1
|
+
{"version":3,"file":"TooltipTypes.js","names":[],"sources":["../../src/Tooltips/TooltipTypes.tsx"],"sourcesContent":["import { Size } from \"../types\";\n\n/**\n * Types for the table.\n */\n export interface TooltipProps extends React.HTMLAttributes<HTMLDivElement> {\n\n label?: string;\n withArrow?: boolean;\n width?: string;\n size?: Size;\n delay?: string;\n tabIndex?: number;\n height?: string;\n align? : 'start' | 'end' | 'center' | undefined;\n position? : 'top' | 'right' | 'bottom' | 'left' | undefined;\n children?: React.ReactNode;\n trigger?: 'hover' | 'click';\n hideAfter?: number;\n }\n"],"mappings":""}
|
|
@@ -7,12 +7,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
});
|
|
8
8
|
exports.default = void 0;
|
|
9
9
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
10
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
10
11
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
11
12
|
var React = _interopRequireWildcard(require("react"));
|
|
12
13
|
var _TooltipStyles = require("./TooltipStyles");
|
|
13
14
|
var _ = require("..");
|
|
14
15
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
-
var _excluded = ["label", "children", "withArrow", "tabIndex", "size", "height", "delay", "align", "position"];
|
|
16
|
+
var _excluded = ["label", "children", "withArrow", "tabIndex", "size", "height", "delay", "align", "position", "trigger", "hideAfter"];
|
|
16
17
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
17
18
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
18
19
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
@@ -32,10 +33,56 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
|
|
|
32
33
|
align = _ref$align === void 0 ? 'center' : _ref$align,
|
|
33
34
|
_ref$position = _ref.position,
|
|
34
35
|
position = _ref$position === void 0 ? 'bottom' : _ref$position,
|
|
36
|
+
_ref$trigger = _ref.trigger,
|
|
37
|
+
trigger = _ref$trigger === void 0 ? 'hover' : _ref$trigger,
|
|
38
|
+
_ref$hideAfter = _ref.hideAfter,
|
|
39
|
+
hideAfter = _ref$hideAfter === void 0 ? 5000 : _ref$hideAfter,
|
|
35
40
|
props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
41
|
+
var _React$useState = React.useState(false),
|
|
42
|
+
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
|
|
43
|
+
showTooltip = _React$useState2[0],
|
|
44
|
+
setShowTooltip = _React$useState2[1];
|
|
45
|
+
var timeoutRef = (0, React.useRef)();
|
|
46
|
+
var ref = (0, _.useClickOutsideRef)(function () {
|
|
47
|
+
return setShowTooltip(false);
|
|
48
|
+
});
|
|
49
|
+
var handleClick = function handleClick(e) {
|
|
50
|
+
var _ref$current;
|
|
51
|
+
if (ref !== null && ref !== void 0 && (_ref$current = ref.current) !== null && _ref$current !== void 0 && _ref$current.contains(e === null || e === void 0 ? void 0 : e.target)) {
|
|
52
|
+
setShowTooltip(true);
|
|
53
|
+
timeoutRef.current && clearTimeout(timeoutRef.current);
|
|
54
|
+
timeoutRef.current = setTimeout(function () {
|
|
55
|
+
return setShowTooltip(false);
|
|
56
|
+
}, hideAfter);
|
|
57
|
+
}
|
|
58
|
+
};
|
|
59
|
+
var handleButtonDown = function handleButtonDown(e) {
|
|
60
|
+
if ((e === null || e === void 0 ? void 0 : e.key) === 'Enter' || (e === null || e === void 0 ? void 0 : e.key) === ' ') {
|
|
61
|
+
setShowTooltip(true);
|
|
62
|
+
timeoutRef.current && clearTimeout(timeoutRef.current);
|
|
63
|
+
timeoutRef.current = setTimeout(function () {
|
|
64
|
+
return setShowTooltip(false);
|
|
65
|
+
}, hideAfter);
|
|
66
|
+
}
|
|
67
|
+
};
|
|
68
|
+
(0, React.useEffect)(function () {
|
|
69
|
+
if (trigger == 'click') {
|
|
70
|
+
var _ref$current2;
|
|
71
|
+
document.addEventListener('mousedown', handleClick);
|
|
72
|
+
ref === null || ref === void 0 ? void 0 : (_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.addEventListener('keydown', handleButtonDown);
|
|
73
|
+
return function () {
|
|
74
|
+
var _ref$current3;
|
|
75
|
+
document.removeEventListener('mousedown', handleClick);
|
|
76
|
+
ref === null || ref === void 0 ? void 0 : (_ref$current3 = ref.current) === null || _ref$current3 === void 0 ? void 0 : _ref$current3.removeEventListener('keydown', handleButtonDown);
|
|
77
|
+
};
|
|
78
|
+
}
|
|
79
|
+
}, [trigger]);
|
|
80
|
+
var cls = "".concat(trigger, " ").concat(trigger === 'click' ? showTooltip ? 'show' : 'hide' : '');
|
|
36
81
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TooltipStyles.TooltipContainer, {
|
|
82
|
+
ref: ref,
|
|
37
83
|
delay: delay,
|
|
38
84
|
tabIndex: tabIndex,
|
|
85
|
+
className: cls,
|
|
39
86
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TooltipStyles.Tooltip, _objectSpread(_objectSpread({
|
|
40
87
|
align: align,
|
|
41
88
|
height: height,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipWrapper.cjs","names":["TooltipWrapper","label","children","withArrow","tabIndex","size","Size","Small","height","delay","undefined","align","position","props"],"sources":["../../src/Tooltips/TooltipWrapper.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"TooltipWrapper.cjs","names":["TooltipWrapper","label","children","withArrow","tabIndex","size","Size","Small","height","delay","undefined","align","position","trigger","hideAfter","props","React","useState","showTooltip","setShowTooltip","timeoutRef","useRef","ref","useClickOutsideRef","handleClick","e","current","contains","target","clearTimeout","setTimeout","handleButtonDown","key","useEffect","document","addEventListener","removeEventListener","cls"],"sources":["../../src/Tooltips/TooltipWrapper.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {TooltipProps} from './TooltipTypes';\n\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\nimport {Size, useClickOutsideRef} from '..';\nimport {useEffect, useRef} from \"react\";\n\nconst TooltipWrapper = ({\n label, children,\n withArrow,\n tabIndex,\n size = Size.Small,\n height = 'auto',\n delay = undefined,\n align = 'center',\n position = 'bottom',\n trigger = 'hover',\n hideAfter = 5000,\n ...props\n }: TooltipProps) => {\n\n const [showTooltip, setShowTooltip] = React.useState(false);\n const timeoutRef = useRef<any>();\n\n const ref = useClickOutsideRef(() => setShowTooltip(false));\n\n const handleClick = (e?: MouseEvent) => {\n if (ref?.current?.contains(e?.target as Node)) {\n setShowTooltip(true)\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n const handleButtonDown = (e?: KeyboardEvent) => {\n if (e?.key === 'Enter' || e?.key === ' ') {\n setShowTooltip(true);\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n\n useEffect(() => {\n if (trigger == 'click') {\n document.addEventListener('mousedown', handleClick);\n ref?.current?.addEventListener('keydown', handleButtonDown);\n\n return () => {\n document.removeEventListener('mousedown', handleClick);\n ref?.current?.removeEventListener('keydown', handleButtonDown);\n };\n }\n }, [trigger])\n\n const cls = `${trigger} ${trigger === 'click' ? showTooltip ? 'show' : 'hide' : ''}`;\n return <TooltipContainer ref={ref}\n delay={delay}\n tabIndex={tabIndex}\n className={cls}>\n <Tooltip align={align}\n height={height}\n role=\"tooltip\"\n size={size}\n withArrow={withArrow}\n position={position}\n {...props}>\n {label}\n </Tooltip>\n {children}\n </TooltipContainer>;\n};\n\nexport default TooltipWrapper;\n"],"mappings":";;;;;;;;;;;AAAA;AAIA;AACA;AAA4C;AAAA;AAAA;AAAA;AAAA;AAAA;AAG5C,IAAMA,cAAc,GAAG,SAAjBA,cAAc,OAYwB;EAAA,IAXlBC,KAAK,QAALA,KAAK;IAAEC,QAAQ,QAARA,QAAQ;IACfC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAGC,MAAI,CAACC,KAAK;IAAA,mBACjBC,MAAM;IAANA,MAAM,4BAAG,MAAM;IAAA,kBACfC,KAAK;IAALA,KAAK,2BAAGC,SAAS;IAAA,kBACjBC,KAAK;IAALA,KAAK,2BAAG,QAAQ;IAAA,qBAChBC,QAAQ;IAARA,QAAQ,8BAAG,QAAQ;IAAA,oBACnBC,OAAO;IAAPA,OAAO,6BAAG,OAAO;IAAA,sBACjBC,SAAS;IAATA,SAAS,+BAAG,IAAI;IACbC,KAAK;EAGhC,sBAAsCC,KAAK,CAACC,QAAQ,CAAC,KAAK,CAAC;IAAA;IAApDC,WAAW;IAAEC,cAAc;EAClC,IAAMC,UAAU,GAAG,IAAAC,YAAM,GAAO;EAEhC,IAAMC,GAAG,GAAG,IAAAC,oBAAkB,EAAC;IAAA,OAAMJ,cAAc,CAAC,KAAK,CAAC;EAAA,EAAC;EAE3D,IAAMK,WAAW,GAAG,SAAdA,WAAW,CAAIC,CAAc,EAAK;IAAA;IACtC,IAAIH,GAAG,aAAHA,GAAG,+BAAHA,GAAG,CAAEI,OAAO,yCAAZ,aAAcC,QAAQ,CAACF,CAAC,aAADA,CAAC,uBAADA,CAAC,CAAEG,MAAM,CAAS,EAAE;MAC7CT,cAAc,CAAC,IAAI,CAAC;MACpBC,UAAU,CAACM,OAAO,IAAIG,YAAY,CAACT,UAAU,CAACM,OAAO,CAAC;MACtDN,UAAU,CAACM,OAAO,GAAGI,UAAU,CAAC;QAAA,OAAMX,cAAc,CAAC,KAAK,CAAC;MAAA,GAAEL,SAAS,CAAC;IACzE;EACF,CAAC;EACD,IAAMiB,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIN,CAAiB,EAAK;IAC9C,IAAI,CAAAA,CAAC,aAADA,CAAC,uBAADA,CAAC,CAAEO,GAAG,MAAK,OAAO,IAAI,CAAAP,CAAC,aAADA,CAAC,uBAADA,CAAC,CAAEO,GAAG,MAAK,GAAG,EAAE;MACxCb,cAAc,CAAC,IAAI,CAAC;MACpBC,UAAU,CAACM,OAAO,IAAIG,YAAY,CAACT,UAAU,CAACM,OAAO,CAAC;MACtDN,UAAU,CAACM,OAAO,GAAGI,UAAU,CAAC;QAAA,OAAMX,cAAc,CAAC,KAAK,CAAC;MAAA,GAAEL,SAAS,CAAC;IACzE;EACF,CAAC;EAED,IAAAmB,eAAS,EAAC,YAAM;IACd,IAAIpB,OAAO,IAAI,OAAO,EAAE;MAAA;MACtBqB,QAAQ,CAACC,gBAAgB,CAAC,WAAW,EAAEX,WAAW,CAAC;MACnDF,GAAG,aAAHA,GAAG,wCAAHA,GAAG,CAAEI,OAAO,kDAAZ,cAAcS,gBAAgB,CAAC,SAAS,EAAEJ,gBAAgB,CAAC;MAE3D,OAAO,YAAM;QAAA;QACXG,QAAQ,CAACE,mBAAmB,CAAC,WAAW,EAAEZ,WAAW,CAAC;QACtDF,GAAG,aAAHA,GAAG,wCAAHA,GAAG,CAAEI,OAAO,kDAAZ,cAAcU,mBAAmB,CAAC,SAAS,EAAEL,gBAAgB,CAAC;MAChE,CAAC;IACH;EACF,CAAC,EAAE,CAAClB,OAAO,CAAC,CAAC;EAEb,IAAMwB,GAAG,aAAMxB,OAAO,cAAIA,OAAO,KAAK,OAAO,GAAGK,WAAW,GAAG,MAAM,GAAG,MAAM,GAAG,EAAE,CAAE;EACpF,oBAAO,sBAAC,+BAAgB;IAAC,GAAG,EAAEI,GAAI;IACT,KAAK,EAAEb,KAAM;IACb,QAAQ,EAAEL,QAAS;IACnB,SAAS,EAAEiC,GAAI;IAAA,wBACtC,qBAAC,sBAAO;MAAC,KAAK,EAAE1B,KAAM;MACb,MAAM,EAAEH,MAAO;MACf,IAAI,EAAC,SAAS;MACd,IAAI,EAAEH,IAAK;MACX,SAAS,EAAEF,SAAU;MACrB,QAAQ,EAAES;IAAS,GACfG,KAAK;MAAA,UACfd;IAAK,GACE,EACTC,QAAQ;EAAA,EACQ;AACrB,CAAC;AAAC,eAEaF,cAAc;AAAA"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { TooltipProps } from './TooltipTypes';
|
|
2
|
-
declare const TooltipWrapper: ({ label, children, withArrow, tabIndex, size, height, delay, align, position, ...props }: TooltipProps) => JSX.Element;
|
|
2
|
+
declare const TooltipWrapper: ({ label, children, withArrow, tabIndex, size, height, delay, align, position, trigger, hideAfter, ...props }: TooltipProps) => JSX.Element;
|
|
3
3
|
export default TooltipWrapper;
|
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
|
-
var _excluded = ["label", "children", "withArrow", "tabIndex", "size", "height", "delay", "align", "position"];
|
|
4
|
+
var _excluded = ["label", "children", "withArrow", "tabIndex", "size", "height", "delay", "align", "position", "trigger", "hideAfter"];
|
|
4
5
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
5
6
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6
7
|
import * as React from 'react';
|
|
7
8
|
import { TooltipContainer, Tooltip } from './TooltipStyles';
|
|
8
|
-
import { Size } from '..';
|
|
9
|
+
import { Size, useClickOutsideRef } from '..';
|
|
10
|
+
import { useEffect, useRef } from "react";
|
|
9
11
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
12
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
11
13
|
var TooltipWrapper = function TooltipWrapper(_ref) {
|
|
@@ -23,10 +25,56 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
|
|
|
23
25
|
align = _ref$align === void 0 ? 'center' : _ref$align,
|
|
24
26
|
_ref$position = _ref.position,
|
|
25
27
|
position = _ref$position === void 0 ? 'bottom' : _ref$position,
|
|
28
|
+
_ref$trigger = _ref.trigger,
|
|
29
|
+
trigger = _ref$trigger === void 0 ? 'hover' : _ref$trigger,
|
|
30
|
+
_ref$hideAfter = _ref.hideAfter,
|
|
31
|
+
hideAfter = _ref$hideAfter === void 0 ? 5000 : _ref$hideAfter,
|
|
26
32
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
33
|
+
var _React$useState = React.useState(false),
|
|
34
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
35
|
+
showTooltip = _React$useState2[0],
|
|
36
|
+
setShowTooltip = _React$useState2[1];
|
|
37
|
+
var timeoutRef = useRef();
|
|
38
|
+
var ref = useClickOutsideRef(function () {
|
|
39
|
+
return setShowTooltip(false);
|
|
40
|
+
});
|
|
41
|
+
var handleClick = function handleClick(e) {
|
|
42
|
+
var _ref$current;
|
|
43
|
+
if (ref !== null && ref !== void 0 && (_ref$current = ref.current) !== null && _ref$current !== void 0 && _ref$current.contains(e === null || e === void 0 ? void 0 : e.target)) {
|
|
44
|
+
setShowTooltip(true);
|
|
45
|
+
timeoutRef.current && clearTimeout(timeoutRef.current);
|
|
46
|
+
timeoutRef.current = setTimeout(function () {
|
|
47
|
+
return setShowTooltip(false);
|
|
48
|
+
}, hideAfter);
|
|
49
|
+
}
|
|
50
|
+
};
|
|
51
|
+
var handleButtonDown = function handleButtonDown(e) {
|
|
52
|
+
if ((e === null || e === void 0 ? void 0 : e.key) === 'Enter' || (e === null || e === void 0 ? void 0 : e.key) === ' ') {
|
|
53
|
+
setShowTooltip(true);
|
|
54
|
+
timeoutRef.current && clearTimeout(timeoutRef.current);
|
|
55
|
+
timeoutRef.current = setTimeout(function () {
|
|
56
|
+
return setShowTooltip(false);
|
|
57
|
+
}, hideAfter);
|
|
58
|
+
}
|
|
59
|
+
};
|
|
60
|
+
useEffect(function () {
|
|
61
|
+
if (trigger == 'click') {
|
|
62
|
+
var _ref$current2;
|
|
63
|
+
document.addEventListener('mousedown', handleClick);
|
|
64
|
+
ref === null || ref === void 0 ? void 0 : (_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.addEventListener('keydown', handleButtonDown);
|
|
65
|
+
return function () {
|
|
66
|
+
var _ref$current3;
|
|
67
|
+
document.removeEventListener('mousedown', handleClick);
|
|
68
|
+
ref === null || ref === void 0 ? void 0 : (_ref$current3 = ref.current) === null || _ref$current3 === void 0 ? void 0 : _ref$current3.removeEventListener('keydown', handleButtonDown);
|
|
69
|
+
};
|
|
70
|
+
}
|
|
71
|
+
}, [trigger]);
|
|
72
|
+
var cls = "".concat(trigger, " ").concat(trigger === 'click' ? showTooltip ? 'show' : 'hide' : '');
|
|
27
73
|
return /*#__PURE__*/_jsxs(TooltipContainer, {
|
|
74
|
+
ref: ref,
|
|
28
75
|
delay: delay,
|
|
29
76
|
tabIndex: tabIndex,
|
|
77
|
+
className: cls,
|
|
30
78
|
children: [/*#__PURE__*/_jsx(Tooltip, _objectSpread(_objectSpread({
|
|
31
79
|
align: align,
|
|
32
80
|
height: height,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipWrapper.js","names":["React","TooltipContainer","Tooltip","Size","TooltipWrapper","label","children","withArrow","tabIndex","size","Small","height","delay","undefined","align","position","props"],"sources":["../../src/Tooltips/TooltipWrapper.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"TooltipWrapper.js","names":["React","TooltipContainer","Tooltip","Size","useClickOutsideRef","useEffect","useRef","TooltipWrapper","label","children","withArrow","tabIndex","size","Small","height","delay","undefined","align","position","trigger","hideAfter","props","useState","showTooltip","setShowTooltip","timeoutRef","ref","handleClick","e","current","contains","target","clearTimeout","setTimeout","handleButtonDown","key","document","addEventListener","removeEventListener","cls"],"sources":["../../src/Tooltips/TooltipWrapper.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {TooltipProps} from './TooltipTypes';\n\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\nimport {Size, useClickOutsideRef} from '..';\nimport {useEffect, useRef} from \"react\";\n\nconst TooltipWrapper = ({\n label, children,\n withArrow,\n tabIndex,\n size = Size.Small,\n height = 'auto',\n delay = undefined,\n align = 'center',\n position = 'bottom',\n trigger = 'hover',\n hideAfter = 5000,\n ...props\n }: TooltipProps) => {\n\n const [showTooltip, setShowTooltip] = React.useState(false);\n const timeoutRef = useRef<any>();\n\n const ref = useClickOutsideRef(() => setShowTooltip(false));\n\n const handleClick = (e?: MouseEvent) => {\n if (ref?.current?.contains(e?.target as Node)) {\n setShowTooltip(true)\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n const handleButtonDown = (e?: KeyboardEvent) => {\n if (e?.key === 'Enter' || e?.key === ' ') {\n setShowTooltip(true);\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n\n useEffect(() => {\n if (trigger == 'click') {\n document.addEventListener('mousedown', handleClick);\n ref?.current?.addEventListener('keydown', handleButtonDown);\n\n return () => {\n document.removeEventListener('mousedown', handleClick);\n ref?.current?.removeEventListener('keydown', handleButtonDown);\n };\n }\n }, [trigger])\n\n const cls = `${trigger} ${trigger === 'click' ? showTooltip ? 'show' : 'hide' : ''}`;\n return <TooltipContainer ref={ref}\n delay={delay}\n tabIndex={tabIndex}\n className={cls}>\n <Tooltip align={align}\n height={height}\n role=\"tooltip\"\n size={size}\n withArrow={withArrow}\n position={position}\n {...props}>\n {label}\n </Tooltip>\n {children}\n </TooltipContainer>;\n};\n\nexport default TooltipWrapper;\n"],"mappings":"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"}
|