npm - @laerdal/life-react-components - Versions diffs - 3.5.0 → 3.5.2-uss.hackathon - Mend

@laerdal/life-react-components 3.5.0 → 3.5.2-uss.hackathon

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.

Files changed (100) hide show

package/dist/Tooltips/TooltipOverflow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TooltipOverflow.js","names":["React","useResizeDetector","Tooltip","Size","TooltipOverflow","label","children","input","withArrow","maxWidth","width","value","size","Small","height","align","position","props","useState","textOverflowed","setTextOverflowed","focused","setFocused","targetRef","customW","customH","useEffect","checkIfOverflowed","over","current","offsetWidth","scrollWidth","onFocus","onBlur","removeEventListener","renderedCallback","useCallback","addEventListener"],"sources":["../../src/Tooltips/TooltipOverflow.tsx"],"sourcesContent":["\r\nimport * as React from 'react';\r\n\r\nimport { TooltipProps } from './TooltipTypes';\r\nimport { useResizeDetector } from 'react-resize-detector';\r\n\r\nimport { TooltipContainer, Tooltip } from './TooltipStyles';\r\nimport { Size } from '..';\r\n \r\ninterface TooltipOverflowProps extends TooltipProps {\r\n input?: React.MutableRefObject<HTMLInputElement \| null>;\r\n maxWidth?: string;\r\n width?: string;\r\n value?: string;\r\n}\r\n\r\n const TooltipOverflow = ({\r\n label, children,\r\n input,\r\n withArrow,\r\n maxWidth,\r\n width,\r\n value,\r\n size = Size.Small,\r\n height = 'auto',\r\n align = 'center', \r\n position = '~~top~~',\r\n ...props } : TooltipOverflowProps) => {\r\n\r\n const [textOverflowed, setTextOverflowed] = React.useState<boolean>(false);\r\n const [focused, setFocused] = React.useState<boolean>(false);\r\n const {width: customW, height: customH} = useResizeDetector({ targetRef: input });\r\n\r\n React.useEffect(() => {\r\n checkIfOverflowed();\r\n }, [customW, customH]);\r\n\r\n const checkIfOverflowed = () => {\r\n //adding +3 offset to offsetWidth, because sometimes when there is no overflow, scrollWidth can be equal to offsetWidth + 1\r\n const over = (input && !focused && input.current && input.current.offsetWidth + 3 < input.current.scrollWidth) ?? false;\r\n setTextOverflowed(over);\r\n };\r\n\r\n React.useEffect(() => {\r\n checkIfOverflowed();\r\n });\r\n\r\n const onFocus = () => {\r\n checkIfOverflowed();\r\n setFocused(true);\r\n };\r\n\r\n const onBlur = () => {\r\n setFocused(false);\r\n };\r\n\r\n React.useEffect(() => {\r\n return () => {\r\n if(input?.current)\r\n {\r\n input?.current.removeEventListener(\"focus\", onFocus);\r\n input?.current.removeEventListener(\"blur\", onBlur);\r\n }\r\n }\r\n }, []);\r\n\r\n const renderedCallback = React.useCallback(() => {\r\n if(input && input.current)\r\n {\r\n input.current.addEventListener(\"focus\", onFocus);\r\n input.current.addEventListener(\"blur\", onBlur);\r\n checkIfOverflowed();\r\n }\r\n }, []);\r\n \r\n return <div ref={renderedCallback}>{textOverflowed && <Tooltip align={align}\r\n height={height}\r\n role=\"tooltip\"\r\n maxWidth={maxWidth}\r\n width={width}\r\n size={size}\r\n withArrow={withArrow}\r\n position={position}\r\n {...props}>\r\n <span>\r\n {children} </span>\r\n </Tooltip> }</div>;\r\n };\r\n \r\n export default TooltipOverflow;\r\n"],"mappings":";;;;;;;AACA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAG9B,SAASC,iBAAiB,QAAQ,uBAAuB;AAEzD,SAA2BC,OAAO,QAAQ,iBAAiB;AAC3D,SAASC,IAAI,QAAQ,IAAI;AAAC;AAAA;AASzB,IAAMC,eAAe,GAAG,SAAlBA,eAAe,OAWmB;EAAA,IAVtCC,KAAK,QAALA,KAAK;IAAEC,QAAQ,QAARA,QAAQ;IACfC,KAAK,QAALA,KAAK;IACLC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,KAAK,QAALA,KAAK;IACLC,KAAK,QAALA,KAAK;IAAA,iBACLC,IAAI;IAAJA,IAAI,0BAAGT,IAAI,CAACU,KAAK;IAAA,mBACjBC,MAAM;IAANA,MAAM,4BAAG,MAAM;IAAA,kBACfC,KAAK;IAALA,KAAK,2BAAG,QAAQ;IAAA,qBAChBC,QAAQ;IAARA,QAAQ,8BAAG,~~KAAK~~;~~IACbC~~,KAAK;EAET,sBAA4CjB,KAAK,CAACkB,QAAQ,CAAU,KAAK,CAAC;IAAA;IAAnEC,cAAc;IAAEC,iBAAiB;EACxC,uBAA8BpB,KAAK,CAACkB,QAAQ,CAAU,KAAK,CAAC;IAAA;IAArDG,OAAO;IAAEC,UAAU;EAC1B,yBAA0CrB,iBAAiB,CAAC;MAAEsB,SAAS,EAAEhB;IAAM,CAAC,CAAC;IAAnEiB,OAAO,sBAAdd,KAAK;IAAmBe,OAAO,sBAAfX,MAAM;EAE7Bd,KAAK,CAAC0B,SAAS,CAAC,YAAM;IACpBC,iBAAiB,EAAE;EACrB,CAAC,EAAE,CAACH,OAAO,EAAEC,OAAO,CAAC,CAAC;EAEtB,IAAME,iBAAiB,GAAG,SAApBA,iBAAiB,GAAS;IAAA;IAC9B;IACA,IAAMC,IAAI,YAAIrB,KAAK,IAAI,CAACc,OAAO,IAAId,KAAK,CAACsB,OAAO,IAAItB,KAAK,CAACsB,OAAO,CAACC,WAAW,GAAG,CAAC,GAAGvB,KAAK,CAACsB,OAAO,CAACE,WAAW,yCAAK,KAAK;~~IACvHX~~,iBAAiB,CAACQ,IAAI,CAAC;EACzB,CAAC;EAED5B,KAAK,CAAC0B,SAAS,CAAC,YAAM;IACpBC,iBAAiB,EAAE;EACrB,CAAC,CAAC;EAEF,~~IAAMK~~,OAAO,GAAG,SAAVA,OAAO,GAAS;~~IACpBL~~,iBAAiB,EAAE;IACnBL,UAAU,CAAC,IAAI,CAAC;EAClB,CAAC;EAED,~~IAAMW~~,MAAM,GAAG,SAATA,MAAM,GAAS;~~IACnBX~~,UAAU,CAAC,KAAK,CAAC;EACnB,CAAC;EAEDtB,KAAK,CAAC0B,SAAS,CAAC,YAAM;IACpB,OAAO,YAAM;MACX,IAAGnB,KAAK,aAALA,KAAK,eAALA,KAAK,CAAEsB,OAAO,EACjB;QACEtB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEsB,OAAO,~~CAACK~~,mBAAmB,CAAC,OAAO,EAAEF,OAAO,CAAC;~~QACpDzB~~,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEsB,OAAO,~~CAACK~~,mBAAmB,CAAC,MAAM,EAAED,MAAM,CAAC;MACpD;IACF,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,IAAME,gBAAgB,~~GAAGnC~~,KAAK,~~CAACoC~~,WAAW,CAAC,YAAM;IAC/C,~~IAAG7B~~,KAAK,IAAIA,KAAK,CAACsB,OAAO,EACzB;MACEtB,KAAK,CAACsB,OAAO,~~CAACQ~~,gBAAgB,CAAC,OAAO,EAAEL,OAAO,CAAC;~~MAChDzB~~,KAAK,CAACsB,OAAO,~~CAACQ~~,gBAAgB,CAAC,MAAM,EAAEJ,MAAM,CAAC;~~MAC9CN~~,iBAAiB,EAAE;IACrB;EACF,CAAC,EAAE,EAAE,CAAC;EAEJ,oBAAO;IAAK,GAAG,~~EAAEQ~~,gBAAiB;IAAA,~~UAAEhB~~,cAAc,iBAAI,KAAC,OAAO;MAAC,KAAK,EAAEJ,KAAM;MACjE,MAAM,EAAED,MAAO;MACf,IAAI,EAAC,SAAS;MACd,QAAQ,EAAEL,QAAS;MACnB,KAAK,EAAEC,KAAM;MACb,IAAI,EAAEE,IAAK;MACX,SAAS,EAAEJ,SAAU;MACrB,QAAQ,EAAEQ;IAAS,GACfC,KAAK;MAAA,uBACR;QAAA,WACAX,QAAQ,EAAC,GAAC;MAAA;IAAO;EACX,EAAQ;AAC7B,CAAC;AAAC;~~EA5ECG~~,QAAQ;EACRC,KAAK;EACLC,KAAK;AAAA;~~AA4ER~~,eAAeP,eAAe"}
1	+ {"version":3,"file":"TooltipOverflow.js","names":["React","useResizeDetector","Tooltip","Size","TooltipOverflow","label","children","input","withArrow","maxWidth","width","value","size","Small","height","align","position","props","useState","textOverflowed","setTextOverflowed","focused","setFocused","targetRef","customW","customH","useEffect","checkIfOverflowed","over","current","offsetWidth","scrollWidth","id","console","log","onFocus","onBlur","removeEventListener","renderedCallback","useCallback","addEventListener"],"sources":["../../src/Tooltips/TooltipOverflow.tsx"],"sourcesContent":["\r\nimport * as React from 'react';\r\n\r\nimport { TooltipProps } from './TooltipTypes';\r\nimport { useResizeDetector } from 'react-resize-detector';\r\n\r\nimport { TooltipContainer, Tooltip } from './TooltipStyles';\r\nimport { Size } from '..';\r\n \r\ninterface TooltipOverflowProps extends TooltipProps {\r\n input?: React.MutableRefObject<HTMLInputElement \| null>;\r\n maxWidth?: string;\r\n width?: string;\r\n value?: string;\r\n}\r\n\r\n const TooltipOverflow = ({\r\n label, children,\r\n input,\r\n withArrow,\r\n maxWidth,\r\n width,\r\n value,\r\n size = Size.Small,\r\n height = 'auto',\r\n align = 'center', \r\n position = 'bottom',\r\n ...props } : TooltipOverflowProps) => {\r\n\r\n const [textOverflowed, setTextOverflowed] = React.useState<boolean>(false);\r\n const [focused, setFocused] = React.useState<boolean>(false);\r\n const {width: customW, height: customH} = useResizeDetector({ targetRef: input });\r\n\r\n React.useEffect(() => {\r\n checkIfOverflowed();\r\n }, [customW, customH]);\r\n\r\n const checkIfOverflowed = () => {\r\n //adding +3 offset to offsetWidth, because sometimes when there is no overflow, scrollWidth can be equal to offsetWidth + 1\r\n const over = (input && !focused && input.current && input.current.offsetWidth + 3 < input.current.scrollWidth) ?? false;\r\n if(input?.current?.id == \"overflowTest\")\r\n {\r\n console.log(input.current.offsetWidth);\r\n console.log(input.current.scrollWidth);\r\n console.log(input.current);\r\n }\r\n setTextOverflowed(over);\r\n };\r\n\r\n React.useEffect(() => {\r\n checkIfOverflowed();\r\n });\r\n\r\n const onFocus = () => {\r\n checkIfOverflowed();\r\n setFocused(true);\r\n };\r\n\r\n const onBlur = () => {\r\n setFocused(false);\r\n };\r\n\r\n React.useEffect(() => {\r\n return () => {\r\n if(input?.current)\r\n {\r\n input?.current.removeEventListener(\"focus\", onFocus);\r\n input?.current.removeEventListener(\"blur\", onBlur);\r\n }\r\n }\r\n }, []);\r\n\r\n const renderedCallback = React.useCallback(() => {\r\n if(input && input.current)\r\n {\r\n input.current.addEventListener(\"focus\", onFocus);\r\n input.current.addEventListener(\"blur\", onBlur);\r\n checkIfOverflowed();\r\n }\r\n }, []);\r\n \r\n return <div ref={renderedCallback}>{textOverflowed && <Tooltip align={align}\r\n height={height}\r\n role=\"tooltip\"\r\n maxWidth={maxWidth}\r\n width={width}\r\n size={size}\r\n withArrow={withArrow}\r\n position={position}\r\n {...props}>\r\n <span>\r\n {children} </span>\r\n </Tooltip> }</div>;\r\n };\r\n \r\n export default TooltipOverflow;\r\n"],"mappings":"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"}

package/dist/Tooltips/TooltipStyles.cjs CHANGED Viewed

@@ -18,7 +18,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 var distanceToEdge = function distanceToEdge(size) {
   return size == _types.Size.XSmall ? '8px' : !size || size == _types.Size.Small ? '12px' : '16px';
 };
-var Tooltip = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  pointer-events: none;\n  ", "\n  ", "\n    ", "\n    ", "\n    box-shadow: ", ";\n  box-sizing: border-box;\n\n  padding: ", ";\n  border-radius: 2px;\n  ", "\n  height: ", ";\n  max-width: ", ";\n  background: ", ";\n  position: absolute;\n  opacity: 0;\n  z-index: ", ";\n  ", "\n\n  ", "\n    ", "\n            \n    ", "\n\n\n&::after {\n    ", "\n    content: \"\";\n    position: absolute;\n    ", "\n\n    ", "\n    ", "\n\n    ", "\n\n    ", "\n    margin: -0.5px;\n    border-width: 4px;\n    border-style: solid;\n    border-color: ", " ", "\n      ", " ", ";\n  }\n\n  & > span {\n    word-wrap: break-word;\n    color: white;\n  }\n"])), function (props) {
+var Tooltip = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\n    pointer-events: none;\n    ", "\n    ", "\n    ", "\n    ", "\n    box-shadow: ", ";\n    box-sizing: border-box;\n    \n    padding: ", ";\n    border-radius: 2px;\n    ", "\n    height: ", ";\n    max-width: ", ";\n    background: ", ";\n    position: absolute; \n    opacity: 0; \n    z-index: ", ";\n    ", "\n\n    ", "\n    ", "\n            \n    ", "\n\n\n&::after {\n    ", "\n    content: \"\";\n    position: absolute;\n    ", "\n    \n    ", "\n    ", "\n\n    ", "\n\n    ", "\n    margin: -0.5px;\n    border-width: 4px;\n    border-style: solid;\n    border-color: ", " \n                    ", " \n                    ", " \n                    ", ";\n  }\n\n  & > span {\n    word-wrap: break-word;\n    color: white;\n  }\n\n"])), function (props) {
   return props.size == _types.Size.Small || props.size != _types.Size.Medium ? (0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.white) : '';
 }, function (props) {
   return props.size == _types.Size.XSmall ? (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.white) : '';
@@ -72,12 +72,12 @@ Tooltip.defaultProps = {
   align: 'center',
   position: 'bottom'
 };
-var TooltipTrigger = function TooltipTrigger(triggerType, delay) {
-  return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n"])), triggerType == 'hover' ? "&:hover ".concat(Tooltip, ", &:focus-within ").concat(Tooltip, ", &:focus ").concat(Tooltip, " {\n      opacity: 1;\n      transition: 0.5s;\n    transition-delay: ").concat(delay !== null && delay !== void 0 ? delay : '0.7s', ";\n    }") : "& ".concat(Tooltip, " {\n      transition: 0.5s;\n      transition-delay: ").concat(delay !== null && delay !== void 0 ? delay : '0s', ";\n    }\n  \n    &.show ").concat(Tooltip, " {\n      opacity: 1;\n    }\n  \n    &.hide ").concat(Tooltip, " {\n      opacity: 0;\n    }"));
+var TooltipTrigger = function TooltipTrigger(delay) {
+  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  \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 : '0.7s', Tooltip, delay !== null && delay !== void 0 ? delay : '0s', Tooltip, Tooltip);
 };
 exports.TooltipTrigger = TooltipTrigger;
-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) {
-  return TooltipTrigger(props.triggerType, props.delay);
+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) {
+  return TooltipTrigger(props.delay);
 }, _styles.focusStyles);
 exports.TooltipContainer = TooltipContainer;
 //# sourceMappingURL=TooltipStyles.cjs.map

package/dist/Tooltips/TooltipStyles.cjs.map CHANGED Viewed

	@@ -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","maxWidth","primary_800","Z_INDEXES","tooltip","position","withArrow","defaultProps","TooltipTrigger","~~triggerType","~~delay","css","TooltipContainer","focusStyles"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\r\nimport { Size } from '../types';\r\nimport { BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles } from '../styles';\r\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\r\nimport { Z_INDEXES } from '../styles/z-indexes';\r\n\r\nconst distanceToEdge = (size: Size \| undefined) => {\r\n return size == Size.XSmall ? '8px' : !size \|\| size == Size.Small ? '12px' : '16px';\r\n};\r\n\r\nexport const Tooltip = styled.div<{\r\n withArrow?: boolean;\r\n size?: Size;\r\n height?: string;\r\n maxWidth?: string;\r\n align?: 'start' \| 'end' \| 'center' \| undefined;\r\n position?: 'top' \| 'right' \| 'bottom' \| 'left' \| undefined;\r\n width?: string;\r\n}>`\r\n pointer-events: none;\r\n ${(props) => (props.size == Size.Small \|\| props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\r\n ${(props) => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\r\n ${(props) => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\r\n ${(props) => (props.align == 'center' ? 'text-align: center;' : '')}\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n box-sizing: border-box;\r\n\r\n padding: ${(props) => (props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px')};\r\n border-radius: 2px;\r\n ${(props) => (props.width ? `width: ${props.width};` : 'width: max-content;')}\r\n height: ${(props) => props.height};\r\n max-width: ${(props) => props.maxWidth ?? '34em'};\r\n background: ${COLORS.primary_800};\r\n position: absolute;\r\n opacity: 0;\r\n z-index: ${Z_INDEXES.tooltip};\r\n ${(props) => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\r\n\r\n ${(props) => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\r\n ${(props) => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\r\n \r\n ${(props) =>\r\n props.position == 'left' \|\| props.position == 'right'\r\n ? ''\r\n : props.align == 'start'\r\n ? 'left: 0%;'\r\n : props.align == 'end'\r\n ? 'right: 0%;'\r\n : 'left: 50%; transform: translateX(-50%);'}\r\n\r\n\r\n&::after {\r\n ${(props) => (!props.withArrow ? 'display: none;' : '')}\r\n content: \"\";\r\n position: absolute;\r\n ${(props) => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\r\n\r\n ${(props) => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\r\n ${(props) => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\r\n\r\n ${(props) =>\r\n props.position == 'left' \|\| props.position == 'right'~~\r\n~~ ? ''\r\n : props.align == 'start'~~\r\n~~ ? `left: ${distanceToEdge(props.size)}~~;`\r\n~~ : props.align == 'end'~~\r\n~~ ? `right: ${distanceToEdge(props.size)}~~;`\r\n~~ : 'left: 50%;'}\r\n\r\n ${(props) => (props.position == 'left' ? '' : 'margin-left: -5px;')}\r\n margin: -0.5px;\r\n border-width: 4px;\r\n border-style: solid;\r\n border-color: ${(props) => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} ${(props) => (props.position == 'right' ? COLORS.primary_800 : 'transparent')}\r\n ${(props) => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} ${(props) => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\r\n }\r\n\r\n & > span {\r\n word-wrap: break-word;\r\n color: white;\r\n }\r\n`;\r\n\r\nTooltip.defaultProps = {\r\n withArrow: false,\r\n size: Size.Small,\r\n height: 'auto',\r\n align: 'center',\r\n position: 'bottom',\r\n};\r\n\r\nexport const TooltipTrigger = (~~triggerType: 'hover' \| 'click',~~ delay?: string) => css`\r\n ${~~triggerType == 'hover'~~\r\n ~~? `&:~~hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\r\n opacity: 1;\r\n transition: 0.5s;\r\n transition-delay: ${delay ?? '0.7s'};\r\n }`\r\n : `& ${Tooltip} {\r\n transition: 0.5s;\r\n transition-delay: ${delay ?? '0s'};\r\n }\r\n \r\n &.show ${Tooltip} {\r\n opacity: 1;\r\n }\r\n \r\n &.hide ${Tooltip} {\r\n opacity: 0;\r\n }`}\r\n`;\r\n\r\nexport const TooltipContainer = styled.div<{ ~~triggerType: 'hover' \| 'click',~~ delay?: string }>`\r\n display: inline-block;\r\n position: relative;\r\n\r\n ${(props) => TooltipTrigger(props.~~triggerType, props.~~delay)}\r\n\r\n &:focus {\r\n ${focusStyles}\r\n }\r\n`;\r\n"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AACA;AACA;~~AAAgD~~;AAAA;AAAA;~~AAEhD~~,IAAMA,cAAc,GAAG,SAAjBA,cAAc,CAAIC,IAAsB,EAAK;EACjD,OAAOA,IAAI,IAAIC,WAAI,CAACC,MAAM,GAAG,KAAK,~~GAAG~~,CAACF,IAAI,IAAIA,IAAI,IAAIC,WAAI,CAACE,KAAK,~~GAAG~~,MAAM,GAAG,MAAM;~~AACpF~~,CAAC;AAEM,IAAMC,OAAO,GAAGC,yBAAM,CAACC,GAAG,~~4tBAU7B~~,~~UAACC~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACP,IAAI,IAAIC,WAAI,CAACE,KAAK,IAAII,KAAK,CAACP,IAAI,IAAIC,WAAI,CAACO,MAAM,GAAG,IAAAC,6BAAiB,EAACC,0BAAkB,CAACC,OAAO,EAAEC,cAAM,CAACC,KAAK,CAAC,GAAG,EAAE;AAAA,CAAC,~~EACrI~~,~~UAACN~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACP,IAAI,IAAIC,WAAI,CAACC,MAAM,~~GAAG~~,IAAAY,8BAAkB,EAACJ,0BAAkB,CAACC,OAAO,EAAEC,cAAM,CAACC,KAAK,CAAC,GAAG,EAAE;AAAA,CAAC,~~EACxG~~,~~UAACN~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACP,IAAI,IAAIC,WAAI,CAACO,MAAM,GAAG,IAAAO,6BAAiB,EAACL,0BAAkB,CAACC,OAAO,EAAEC,cAAM,CAACC,KAAK,CAAC,GAAG,EAAE;AAAA,CAAC,~~EACzG~~,~~UAACN~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACS,KAAK,IAAI,QAAQ,GAAG,qBAAqB,GAAG,EAAE;AAAA,CAAC,~~EACrDC~~,kBAAU,CAACC,YAAY,~~EAG5B~~,~~UAACX~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACP,IAAI,IAAIC,WAAI,CAACC,MAAM,GAAG,SAAS,GAAGK,KAAK,CAACP,IAAI,IAAIC,WAAI,CAACO,MAAM,GAAG,UAAU,GAAG,UAAU;AAAA,~~CAAC~~,~~EAEjH~~,~~UAACD,~~KAAK;EAAA,~~OAAMA~~,KAAK,CAACY,KAAK,oBAAaZ,KAAK,CAACY,KAAK,SAAM,qBAAqB;AAAA,~~CAAC~~,~~EACnE~~,~~UAACZ,~~KAAK;EAAA,~~OAAKA~~,KAAK,CAACa,MAAM;AAAA,~~GACpB~~,~~UAACb~~,KAAK;EAAA;EAAA,~~0BAAKA~~,KAAK,CAACc,QAAQ,6DAAI,MAAM;AAAA,~~GAClCT~~,cAAM,CAACU,WAAW,EAGrBC,mBAAS,CAACC,OAAO,EAC1B,~~UAACjB~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACkB,QAAQ,IAAI,KAAK,GAAG,eAAe,GAAGlB,KAAK,CAACkB,QAAQ,IAAI,QAAQ,GAAG,YAAY,GAAG,EAAE;AAAA,CAAC,~~EAEvG~~,~~UAAClB~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACkB,QAAQ,IAAI,MAAM,GAAG,4DAA4D,GAAG,EAAE;AAAA,CAAC,EACvG,~~UAAClB~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACkB,QAAQ,IAAI,OAAO,GAAG,qDAAqD,GAAG,EAAE;AAAA,CAAC,~~EAEnG~~,~~UAAClB~~,KAAK;EAAA,~~OACRA~~,KAAK,CAACkB,QAAQ,IAAI,MAAM,IAAIlB,KAAK,CAACkB,QAAQ,IAAI,OAAO,GACjD,EAAE,GACFlB,KAAK,CAACS,KAAK,IAAI,OAAO,GACtB,WAAW,GACXT,KAAK,CAACS,KAAK,IAAI,KAAK,GACpB,YAAY,GACZ,yCAAyC;AAAA,~~GAI3C~~,~~UAACT~~,KAAK;EAAA,~~OAAM~~,CAACA,KAAK,CAACmB,SAAS,GAAG,gBAAgB,GAAG,EAAE;AAAA,CAAC,~~EAGrD~~,~~UAACnB~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACkB,QAAQ,IAAI,KAAK,GAAG,YAAY,GAAGlB,KAAK,CAACkB,QAAQ,IAAI,QAAQ,GAAG,eAAe,GAAG,EAAE;AAAA,CAAC,~~EAEvG~~,~~UAAClB~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACkB,QAAQ,IAAI,OAAO,GAAG,uDAAuD,GAAG,EAAE;AAAA,CAAC,~~EACrG~~,~~UAAClB~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACkB,QAAQ,IAAI,MAAM,GAAG,sDAAsD,GAAG,EAAE;AAAA,CAAC,~~EAEnG~~,~~UAAClB~~,KAAK;EAAA,~~OACNA~~,KAAK,CAACkB,QAAQ,IAAI,MAAM,IAAIlB,KAAK,CAACkB,QAAQ,IAAI,OAAO,~~GACjD~~,EAAE,~~GACFlB~~,KAAK,CAACS,KAAK,IAAI,OAAO,~~mBACbjB~~,cAAc,CAACQ,KAAK,CAACP,IAAI,CAAC,~~SACnCO~~,KAAK,CAACS,KAAK,IAAI,KAAK,~~oBACVjB~~,cAAc,CAACQ,KAAK,CAACP,IAAI,CAAC,~~SACpC~~,YAAY;AAAA,~~GAEhB~~,~~UAACO~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACkB,QAAQ,IAAI,MAAM,GAAG,EAAE,GAAG,oBAAoB;AAAA,CAAC,~~EAInD~~,~~UAAClB~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACkB,QAAQ,IAAI,KAAK,GAAGb,cAAM,CAACU,WAAW,GAAG,aAAa;AAAA,CAAC,~~EAAI~~,~~UAACf~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACkB,QAAQ,IAAI,OAAO,GAAGb,cAAM,CAACU,WAAW,GAAG,aAAa;AAAA,CAAC,~~EACpK~~,~~UAACf~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACkB,QAAQ,IAAI,QAAQ,GAAGb,cAAM,CAACU,WAAW,GAAG,aAAa;AAAA,CAAC,~~EAAI~~,~~UAACf~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACkB,QAAQ,IAAI,MAAM,GAAGb,cAAM,CAACU,WAAW,GAAG,aAAa;AAAA,CAAC,~~CAOjK~~;AAAC;AAEFlB,OAAO,CAACuB,YAAY,GAAG;EACrBD,SAAS,EAAE,KAAK;EAChB1B,IAAI,EAAEC,WAAI,CAACE,KAAK;EAChBiB,MAAM,EAAE,MAAM;EACdJ,KAAK,EAAE,QAAQ;EACfS,QAAQ,EAAE;AACZ,CAAC;AAEM,IAAMG,cAAc,GAAG,SAAjBA,cAAc,CAAIC,~~WAA8B,EAAEC,~~KAAc;EAAA,WAAKC,qBAAG,~~iGACjFF~~,~~WAAW,IAAI,~~OAAO,~~qBACTzB~~,OAAO,~~8BAAoBA~~,OAAO,~~uBAAaA~~,~~OAAO,mFAG/C0B,~~KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,MAAM,~~4BAE5B1B~~,OAAO,~~kEAEQ0B~~,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,IAAI,~~sCAG1B1B~~,OAAO,~~0DAIPA~~,OAAO~~,iCAEd~~;AAAA,~~CACL~~;AAAC;AAEK,~~IAAM4B~~,gBAAgB,~~GAAG3B~~,yBAAM,CAACC,GAAG,~~iLAItC~~,~~UAACC~~,KAAK;EAAA,~~OAAKqB~~,cAAc,CAACrB,KAAK,CAACsB,~~WAAW,EAAEtB,~~KAAK,~~CAACuB,KAAK,~~CAAC;AAAA,~~GAGvDG~~,mBAAW,CAEhB;AAAC"}
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","maxWidth","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';\r\nimport { Size } from '../types';\r\nimport {BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\r\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\r\nimport {Z_INDEXES} from '../styles/z-indexes';\r\n\r\nconst distanceToEdge = (size: Size \| undefined) => {\r\n return size == Size.XSmall ? '8px' : (!size \|\| size == Size.Small) ? '12px' : '16px';\r\n}\r\n\r\nexport const Tooltip = styled.div<{\r\n withArrow?: boolean;\r\n size?: Size;\r\n height?: string;\r\n maxWidth?: string;\r\n align?: 'start' \| 'end' \| 'center' \| undefined;\r\n position?: 'top' \| 'right' \| 'bottom' \| 'left' \| undefined;\r\n width?: string;\r\n}>`\r\n\r\n pointer-events: none;\r\n ${props => (props.size == Size.Small \|\| props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\r\n ${props => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\r\n ${props => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\r\n ${props => (props.align == 'center' ? 'text-align: center;' : '')}\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n box-sizing: border-box;\r\n \r\n padding: ${props => props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px'};\r\n border-radius: 2px;\r\n ${props => props.width ? `width: ${props.width};` : 'width: max-content;'}\r\n height: ${props => props.height};\r\n max-width: ${props => props.maxWidth ?? '34em'};\r\n background: ${COLORS.primary_800};\r\n position: absolute; \r\n opacity: 0; \r\n z-index: ${Z_INDEXES.tooltip};\r\n ${props => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\r\n\r\n ${props => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\r\n ${props => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\r\n \r\n ${props =>\r\n props.position == 'left' \|\| props.position == 'right'\r\n ? ''\r\n : props.align == 'start'\r\n ? 'left: 0%;'\r\n : props.align == 'end'\r\n ? 'right: 0%;'\r\n : 'left: 50%; transform: translateX(-50%);'}\r\n\r\n\r\n&::after {\r\n ${props => (!props.withArrow ? 'display: none;' : '')}\r\n content: \"\";\r\n position: absolute;\r\n ${props => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\r\n \r\n ${props => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\r\n ${props => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\r\n\r\n ${props =>\r\n props.position == 'left' \|\| props.position == 'right' ? '' : \r\n props.align == 'start' ? `left: ${distanceToEdge(props.size)};` : props.align == 'end' ? `right: ${distanceToEdge(props.size)};` : 'left: 50%;'}\r\n\r\n ${props => (props.position == 'left' ? '' : 'margin-left: -5px;')}\r\n margin: -0.5px;\r\n border-width: 4px;\r\n border-style: solid;\r\n border-color: ${props => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} \r\n ${props => (props.position == 'right' ? COLORS.primary_800 : 'transparent')} \r\n ${props => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} \r\n ${props => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\r\n }\r\n\r\n & > span {\r\n word-wrap: break-word;\r\n color: white;\r\n }\r\n\r\n`;\r\n\r\nTooltip.defaultProps = {\r\n withArrow: false,\r\n size: Size.Small,\r\n height: 'auto',\r\n align: 'center',\r\n position: 'bottom'\r\n}\r\n\r\nexport const TooltipTrigger = (delay?: string) => css`\r\n &.hover {\r\n &:hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\r\n opacity: 1;\r\n transition: 0.5s;\r\n transition-delay: ${delay ?? '0.7s'};\r\n }\r\n }\r\n\r\n \r\n &.click ${Tooltip} {\r\n transition: 0.5s;\r\n transition-delay: ${delay ?? '0s'};\r\n }\r\n\r\n &.click.show ${Tooltip} {\r\n opacity: 1;\r\n }\r\n\r\n &.click.hide ${Tooltip} {\r\n opacity: 0;\r\n }\r\n\r\n`;\r\n\r\nexport const TooltipContainer = styled.div<{delay?: string}>`\r\n display: inline-block;\r\n position: relative;\r\n\r\n ${props => TooltipTrigger(props.delay)}\r\n \r\n &:focus{\r\n ${focusStyles}\r\n }\r\n`;\r\n"],"mappings":"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"}

package/dist/Tooltips/TooltipStyles.d.ts CHANGED Viewed

@@ -8,8 +8,7 @@ export declare const Tooltip: import("styled-components").StyledComponent<"div",
     position?: 'top' | 'right' | 'bottom' | 'left' | undefined;
     width?: string | undefined;
 }, never>;
-export declare const TooltipTrigger: (triggerType: 'hover' | 'click', delay?: string) => import("styled-components").FlattenSimpleInterpolation;
+export declare const TooltipTrigger: (delay?: string) => import("styled-components").FlattenSimpleInterpolation;
 export declare const TooltipContainer: import("styled-components").StyledComponent<"div", any, {
-    triggerType: 'hover' | 'click';
     delay?: string | undefined;
 }, never>;

package/dist/Tooltips/TooltipStyles.js CHANGED Viewed

@@ -8,7 +8,7 @@ import { Z_INDEXES } from '../styles/z-indexes';
 var distanceToEdge = function distanceToEdge(size) {
   return size == Size.XSmall ? '8px' : !size || size == Size.Small ? '12px' : '16px';
 };
-export var Tooltip = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  pointer-events: none;\n  ", "\n  ", "\n    ", "\n    ", "\n    box-shadow: ", ";\n  box-sizing: border-box;\n\n  padding: ", ";\n  border-radius: 2px;\n  ", "\n  height: ", ";\n  max-width: ", ";\n  background: ", ";\n  position: absolute;\n  opacity: 0;\n  z-index: ", ";\n  ", "\n\n  ", "\n    ", "\n            \n    ", "\n\n\n&::after {\n    ", "\n    content: \"\";\n    position: absolute;\n    ", "\n\n    ", "\n    ", "\n\n    ", "\n\n    ", "\n    margin: -0.5px;\n    border-width: 4px;\n    border-style: solid;\n    border-color: ", " ", "\n      ", " ", ";\n  }\n\n  & > span {\n    word-wrap: break-word;\n    color: white;\n  }\n"])), function (props) {
+export var Tooltip = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n    pointer-events: none;\n    ", "\n    ", "\n    ", "\n    ", "\n    box-shadow: ", ";\n    box-sizing: border-box;\n    \n    padding: ", ";\n    border-radius: 2px;\n    ", "\n    height: ", ";\n    max-width: ", ";\n    background: ", ";\n    position: absolute; \n    opacity: 0; \n    z-index: ", ";\n    ", "\n\n    ", "\n    ", "\n            \n    ", "\n\n\n&::after {\n    ", "\n    content: \"\";\n    position: absolute;\n    ", "\n    \n    ", "\n    ", "\n\n    ", "\n\n    ", "\n    margin: -0.5px;\n    border-width: 4px;\n    border-style: solid;\n    border-color: ", " \n                    ", " \n                    ", " \n                    ", ";\n  }\n\n  & > span {\n    word-wrap: break-word;\n    color: white;\n  }\n\n"])), function (props) {
   return props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '';
 }, function (props) {
   return props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '';
@@ -61,10 +61,10 @@ Tooltip.defaultProps = {
   align: 'center',
   position: 'bottom'
 };
-export var TooltipTrigger = function TooltipTrigger(triggerType, delay) {
-  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n"])), triggerType == 'hover' ? "&:hover ".concat(Tooltip, ", &:focus-within ").concat(Tooltip, ", &:focus ").concat(Tooltip, " {\n      opacity: 1;\n      transition: 0.5s;\n    transition-delay: ").concat(delay !== null && delay !== void 0 ? delay : '0.7s', ";\n    }") : "& ".concat(Tooltip, " {\n      transition: 0.5s;\n      transition-delay: ").concat(delay !== null && delay !== void 0 ? delay : '0s', ";\n    }\n  \n    &.show ").concat(Tooltip, " {\n      opacity: 1;\n    }\n  \n    &.hide ").concat(Tooltip, " {\n      opacity: 0;\n    }"));
+export var TooltipTrigger = function TooltipTrigger(delay) {
+  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  \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 : '0.7s', Tooltip, delay !== null && delay !== void 0 ? delay : '0s', Tooltip, Tooltip);
 };
-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) {
-  return TooltipTrigger(props.triggerType, props.delay);
+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) {
+  return TooltipTrigger(props.delay);
 }, focusStyles);
 //# sourceMappingURL=TooltipStyles.js.map

package/dist/Tooltips/TooltipStyles.js.map CHANGED Viewed

	@@ -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","maxWidth","primary_800","tooltip","position","withArrow","defaultProps","TooltipTrigger","~~triggerType","~~delay","TooltipContainer"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\r\nimport { Size } from '../types';\r\nimport { BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles } from '../styles';\r\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\r\nimport { Z_INDEXES } from '../styles/z-indexes';\r\n\r\nconst distanceToEdge = (size: Size \| undefined) => {\r\n return size == Size.XSmall ? '8px' : !size \|\| size == Size.Small ? '12px' : '16px';\r\n};\r\n\r\nexport const Tooltip = styled.div<{\r\n withArrow?: boolean;\r\n size?: Size;\r\n height?: string;\r\n maxWidth?: string;\r\n align?: 'start' \| 'end' \| 'center' \| undefined;\r\n position?: 'top' \| 'right' \| 'bottom' \| 'left' \| undefined;\r\n width?: string;\r\n}>`\r\n pointer-events: none;\r\n ${(props) => (props.size == Size.Small \|\| props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\r\n ${(props) => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\r\n ${(props) => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\r\n ${(props) => (props.align == 'center' ? 'text-align: center;' : '')}\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n box-sizing: border-box;\r\n\r\n padding: ${(props) => (props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px')};\r\n border-radius: 2px;\r\n ${(props) => (props.width ? `width: ${props.width};` : 'width: max-content;')}\r\n height: ${(props) => props.height};\r\n max-width: ${(props) => props.maxWidth ?? '34em'};\r\n background: ${COLORS.primary_800};\r\n position: absolute;\r\n opacity: 0;\r\n z-index: ${Z_INDEXES.tooltip};\r\n ${(props) => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\r\n\r\n ${(props) => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\r\n ${(props) => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\r\n \r\n ${(props) =>\r\n props.position == 'left' \|\| props.position == 'right'\r\n ? ''\r\n : props.align == 'start'\r\n ? 'left: 0%;'\r\n : props.align == 'end'\r\n ? 'right: 0%;'\r\n : 'left: 50%; transform: translateX(-50%);'}\r\n\r\n\r\n&::after {\r\n ${(props) => (!props.withArrow ? 'display: none;' : '')}\r\n content: \"\";\r\n position: absolute;\r\n ${(props) => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\r\n\r\n ${(props) => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\r\n ${(props) => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\r\n\r\n ${(props) =>\r\n props.position == 'left' \|\| props.position == 'right'~~\r\n~~ ? ''\r\n : props.align == 'start'~~\r\n~~ ? `left: ${distanceToEdge(props.size)}~~;`\r\n~~ : props.align == 'end'~~\r\n~~ ? `right: ${distanceToEdge(props.size)}~~;`\r\n~~ : 'left: 50%;'}\r\n\r\n ${(props) => (props.position == 'left' ? '' : 'margin-left: -5px;')}\r\n margin: -0.5px;\r\n border-width: 4px;\r\n border-style: solid;\r\n border-color: ${(props) => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} ${(props) => (props.position == 'right' ? COLORS.primary_800 : 'transparent')}\r\n ${(props) => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} ${(props) => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\r\n }\r\n\r\n & > span {\r\n word-wrap: break-word;\r\n color: white;\r\n }\r\n`;\r\n\r\nTooltip.defaultProps = {\r\n withArrow: false,\r\n size: Size.Small,\r\n height: 'auto',\r\n align: 'center',\r\n position: 'bottom',\r\n};\r\n\r\nexport const TooltipTrigger = (~~triggerType: 'hover' \| 'click',~~ delay?: string) => css`\r\n ${~~triggerType == 'hover'~~\r\n ~~? `&:~~hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\r\n opacity: 1;\r\n transition: 0.5s;\r\n transition-delay: ${delay ?? '0.7s'};\r\n }`\r\n : `& ${Tooltip} {\r\n transition: 0.5s;\r\n transition-delay: ${delay ?? '0s'};\r\n }\r\n \r\n &.show ${Tooltip} {\r\n opacity: 1;\r\n }\r\n \r\n &.hide ${Tooltip} {\r\n opacity: 0;\r\n }`}\r\n`;\r\n\r\nexport const TooltipContainer = styled.div<{ ~~triggerType: 'hover' \| 'click',~~ delay?: string }>`\r\n display: inline-block;\r\n position: relative;\r\n\r\n ${(props) => TooltipTrigger(props.~~triggerType, props.~~delay)}\r\n\r\n &:focus {\r\n ${focusStyles}\r\n }\r\n`;\r\n"],"mappings":";;AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,IAAI,QAAQ,UAAU;AAC/B,~~SAASC~~,UAAU,EAAEC,MAAM,EAAEC,kBAAkB,EAAEC,WAAW,~~QAAQ~~,WAAW;~~AAC/E~~,SAASC,iBAAiB,EAAEC,iBAAiB,EAAEC,kBAAkB,QAAQ,sBAAsB;AAC/F,~~SAASC~~,SAAS,~~QAAQ~~,qBAAqB;~~AAE/C~~,IAAMC,cAAc,GAAG,SAAjBA,cAAc,CAAIC,IAAsB,EAAK;EACjD,OAAOA,IAAI,IAAIV,IAAI,CAACW,MAAM,GAAG,KAAK,~~GAAG~~,CAACD,IAAI,IAAIA,IAAI,IAAIV,IAAI,CAACY,KAAK,~~GAAG~~,MAAM,GAAG,MAAM;~~AACpF~~,CAAC;AAED,OAAO,IAAMC,OAAO,GAAGf,MAAM,CAACgB,GAAG,~~8sBAU7B~~,~~UAACC~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACL,IAAI,IAAIV,IAAI,CAACY,KAAK,IAAIG,KAAK,CAACL,IAAI,IAAIV,IAAI,CAACgB,MAAM,GAAGV,iBAAiB,CAACH,kBAAkB,CAACc,OAAO,EAAEf,MAAM,CAACgB,KAAK,CAAC,GAAG,EAAE;AAAA,CAAC,~~EACrI~~,~~UAACH~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACL,IAAI,IAAIV,IAAI,CAACW,MAAM,~~GAAGJ~~,kBAAkB,CAACJ,kBAAkB,CAACc,OAAO,EAAEf,MAAM,CAACgB,KAAK,CAAC,GAAG,EAAE;AAAA,CAAC,~~EACxG~~,~~UAACH~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACL,IAAI,IAAIV,IAAI,CAACgB,MAAM,GAAGX,iBAAiB,CAACF,kBAAkB,CAACc,OAAO,EAAEf,MAAM,CAACgB,KAAK,CAAC,GAAG,EAAE;AAAA,CAAC,~~EACzG~~,~~UAACH~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACI,KAAK,IAAI,QAAQ,GAAG,qBAAqB,GAAG,EAAE;AAAA,CAAC,~~EACrDlB~~,UAAU,CAACmB,YAAY,~~EAG5B~~,~~UAACL~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACL,IAAI,IAAIV,IAAI,CAACW,MAAM,GAAG,SAAS,GAAGI,KAAK,CAACL,IAAI,IAAIV,IAAI,CAACgB,MAAM,GAAG,UAAU,GAAG,UAAU;AAAA,~~CAAC~~,~~EAEjH~~,~~UAACD,~~KAAK;EAAA,~~OAAMA~~,KAAK,CAACM,KAAK,oBAAaN,KAAK,CAACM,KAAK,SAAM,qBAAqB;AAAA,~~CAAC~~,~~EACnE~~,~~UAACN,~~KAAK;EAAA,~~OAAKA~~,KAAK,CAACO,MAAM;AAAA,~~GACpB~~,~~UAACP~~,KAAK;EAAA;EAAA,~~0BAAKA~~,KAAK,CAACQ,QAAQ,6DAAI,MAAM;AAAA,~~GAClCrB~~,MAAM,CAACsB,WAAW,EAGrBhB,SAAS,CAACiB,OAAO,EAC1B,~~UAACV~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACW,QAAQ,IAAI,KAAK,GAAG,eAAe,GAAGX,KAAK,CAACW,QAAQ,IAAI,QAAQ,GAAG,YAAY,GAAG,EAAE;AAAA,CAAC,~~EAEvG~~,~~UAACX~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACW,QAAQ,IAAI,MAAM,GAAG,4DAA4D,GAAG,EAAE;AAAA,CAAC,EACvG,~~UAACX~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACW,QAAQ,IAAI,OAAO,GAAG,qDAAqD,GAAG,EAAE;AAAA,CAAC,~~EAEnG~~,~~UAACX~~,KAAK;EAAA,~~OACRA~~,KAAK,CAACW,QAAQ,IAAI,MAAM,IAAIX,KAAK,CAACW,QAAQ,IAAI,OAAO,GACjD,EAAE,GACFX,KAAK,CAACI,KAAK,IAAI,OAAO,GACtB,WAAW,GACXJ,KAAK,CAACI,KAAK,IAAI,KAAK,GACpB,YAAY,GACZ,yCAAyC;AAAA,~~GAI3C~~,~~UAACJ~~,KAAK;EAAA,~~OAAM~~,CAACA,KAAK,CAACY,SAAS,GAAG,gBAAgB,GAAG,EAAE;AAAA,CAAC,~~EAGrD~~,~~UAACZ~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACW,QAAQ,IAAI,KAAK,GAAG,YAAY,GAAGX,KAAK,CAACW,QAAQ,IAAI,QAAQ,GAAG,eAAe,GAAG,EAAE;AAAA,CAAC,~~EAEvG~~,~~UAACX~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACW,QAAQ,IAAI,OAAO,GAAG,uDAAuD,GAAG,EAAE;AAAA,CAAC,~~EACrG~~,~~UAACX~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACW,QAAQ,IAAI,MAAM,GAAG,sDAAsD,GAAG,EAAE;AAAA,CAAC,~~EAEnG~~,~~UAACX~~,KAAK;EAAA,~~OACNA~~,KAAK,CAACW,QAAQ,IAAI,MAAM,IAAIX,KAAK,CAACW,QAAQ,IAAI,OAAO,~~GACjD~~,EAAE,~~GACFX~~,KAAK,CAACI,KAAK,IAAI,OAAO,~~mBACbV~~,cAAc,CAACM,KAAK,CAACL,IAAI,CAAC,~~SACnCK~~,KAAK,CAACI,KAAK,IAAI,KAAK,~~oBACVV~~,cAAc,CAACM,KAAK,CAACL,IAAI,CAAC,~~SACpC~~,YAAY;AAAA,~~GAEhB~~,~~UAACK~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACW,QAAQ,IAAI,MAAM,GAAG,EAAE,GAAG,oBAAoB;AAAA,CAAC,~~EAInD~~,~~UAACX~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACW,QAAQ,IAAI,KAAK,GAAGxB,MAAM,CAACsB,WAAW,GAAG,aAAa;AAAA,CAAC,~~EAAI~~,~~UAACT~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACW,QAAQ,IAAI,OAAO,GAAGxB,MAAM,CAACsB,WAAW,GAAG,aAAa;AAAA,CAAC,~~EACpK~~,~~UAACT~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACW,QAAQ,IAAI,QAAQ,GAAGxB,MAAM,CAACsB,WAAW,GAAG,aAAa;AAAA,CAAC,~~EAAI~~,~~UAACT~~,KAAK;EAAA,~~OAAMA~~,KAAK,CAACW,QAAQ,IAAI,MAAM,GAAGxB,MAAM,CAACsB,WAAW,GAAG,aAAa;AAAA,CAAC,~~CAOjK~~;AAEDX,OAAO,CAACe,YAAY,GAAG;EACrBD,SAAS,EAAE,KAAK;EAChBjB,IAAI,EAAEV,IAAI,CAACY,KAAK;EAChBU,MAAM,EAAE,MAAM;EACdH,KAAK,EAAE,QAAQ;EACfO,QAAQ,EAAE;AACZ,CAAC;AAED,OAAO,IAAMG,cAAc,GAAG,SAAjBA,cAAc,CAAIC,~~WAA8B,EAAEC,~~KAAc;EAAA,~~OAAKhC~~,GAAG,~~kFACjF+B~~,~~WAAW,IAAI,~~OAAO,~~qBACTjB~~,OAAO,~~8BAAoBA~~,OAAO,~~uBAAaA~~,~~OAAO,mFAG/CkB,~~KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,MAAM,~~4BAE5BlB~~,OAAO,~~kEAEQkB~~,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,IAAI,~~sCAG1BlB~~,OAAO,~~0DAIPA~~,OAAO~~,iCAEd~~;AAAA,~~CACL~~;AAED,OAAO,~~IAAMmB~~,gBAAgB,~~GAAGlC~~,MAAM,CAACgB,GAAG,~~mKAItC~~,~~UAACC~~,KAAK;EAAA,~~OAAKc~~,cAAc,CAACd,KAAK,CAACe,~~WAAW,EAAEf,~~KAAK,~~CAACgB,KAAK,~~CAAC;AAAA,~~GAGvD3B~~,WAAW,CAEhB"}
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","maxWidth","primary_800","tooltip","position","withArrow","defaultProps","TooltipTrigger","delay","TooltipContainer"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\r\nimport { Size } from '../types';\r\nimport {BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\r\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\r\nimport {Z_INDEXES} from '../styles/z-indexes';\r\n\r\nconst distanceToEdge = (size: Size \| undefined) => {\r\n return size == Size.XSmall ? '8px' : (!size \|\| size == Size.Small) ? '12px' : '16px';\r\n}\r\n\r\nexport const Tooltip = styled.div<{\r\n withArrow?: boolean;\r\n size?: Size;\r\n height?: string;\r\n maxWidth?: string;\r\n align?: 'start' \| 'end' \| 'center' \| undefined;\r\n position?: 'top' \| 'right' \| 'bottom' \| 'left' \| undefined;\r\n width?: string;\r\n}>`\r\n\r\n pointer-events: none;\r\n ${props => (props.size == Size.Small \|\| props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\r\n ${props => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\r\n ${props => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\r\n ${props => (props.align == 'center' ? 'text-align: center;' : '')}\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n box-sizing: border-box;\r\n \r\n padding: ${props => props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px'};\r\n border-radius: 2px;\r\n ${props => props.width ? `width: ${props.width};` : 'width: max-content;'}\r\n height: ${props => props.height};\r\n max-width: ${props => props.maxWidth ?? '34em'};\r\n background: ${COLORS.primary_800};\r\n position: absolute; \r\n opacity: 0; \r\n z-index: ${Z_INDEXES.tooltip};\r\n ${props => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\r\n\r\n ${props => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\r\n ${props => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\r\n \r\n ${props =>\r\n props.position == 'left' \|\| props.position == 'right'\r\n ? ''\r\n : props.align == 'start'\r\n ? 'left: 0%;'\r\n : props.align == 'end'\r\n ? 'right: 0%;'\r\n : 'left: 50%; transform: translateX(-50%);'}\r\n\r\n\r\n&::after {\r\n ${props => (!props.withArrow ? 'display: none;' : '')}\r\n content: \"\";\r\n position: absolute;\r\n ${props => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\r\n \r\n ${props => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\r\n ${props => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\r\n\r\n ${props =>\r\n props.position == 'left' \|\| props.position == 'right' ? '' : \r\n props.align == 'start' ? `left: ${distanceToEdge(props.size)};` : props.align == 'end' ? `right: ${distanceToEdge(props.size)};` : 'left: 50%;'}\r\n\r\n ${props => (props.position == 'left' ? '' : 'margin-left: -5px;')}\r\n margin: -0.5px;\r\n border-width: 4px;\r\n border-style: solid;\r\n border-color: ${props => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} \r\n ${props => (props.position == 'right' ? COLORS.primary_800 : 'transparent')} \r\n ${props => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} \r\n ${props => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\r\n }\r\n\r\n & > span {\r\n word-wrap: break-word;\r\n color: white;\r\n }\r\n\r\n`;\r\n\r\nTooltip.defaultProps = {\r\n withArrow: false,\r\n size: Size.Small,\r\n height: 'auto',\r\n align: 'center',\r\n position: 'bottom'\r\n}\r\n\r\nexport const TooltipTrigger = (delay?: string) => css`\r\n &.hover {\r\n &:hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\r\n opacity: 1;\r\n transition: 0.5s;\r\n transition-delay: ${delay ?? '0.7s'};\r\n }\r\n }\r\n\r\n \r\n &.click ${Tooltip} {\r\n transition: 0.5s;\r\n transition-delay: ${delay ?? '0s'};\r\n }\r\n\r\n &.click.show ${Tooltip} {\r\n opacity: 1;\r\n }\r\n\r\n &.click.hide ${Tooltip} {\r\n opacity: 0;\r\n }\r\n\r\n`;\r\n\r\nexport const TooltipContainer = styled.div<{delay?: string}>`\r\n display: inline-block;\r\n position: relative;\r\n\r\n ${props => TooltipTrigger(props.delay)}\r\n \r\n &:focus{\r\n ${focusStyles}\r\n }\r\n`;\r\n"],"mappings":"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"}

package/dist/Tooltips/TooltipWrapper.cjs CHANGED Viewed

@@ -78,12 +78,11 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
       };
     }
   }, [trigger]);
-  var cls = "".concat(trigger === 'click' ? showTooltip ? 'show' : 'hide' : '');
+  var cls = "".concat(trigger, " ").concat(trigger === 'click' ? showTooltip ? 'show' : 'hide' : '');
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TooltipStyles.TooltipContainer, {
     ref: ref,
     delay: delay,
     tabIndex: tabIndex,
-    triggerType: trigger,
     className: cls,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TooltipStyles.Tooltip, _objectSpread(_objectSpread({
       align: align,

package/dist/Tooltips/TooltipWrapper.cjs.map CHANGED Viewed

	@@ -1 +1 @@
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';\r\n\r\nimport {TooltipProps} from './TooltipTypes';\r\n\r\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\r\nimport {useClickOutsideRef} from '../common';\r\nimport {useEffect, useRef} from \"react\";\r\nimport {Size} from \"../types\";\r\n\r\nconst TooltipWrapper = ({\r\n label, children,\r\n withArrow,\r\n tabIndex,\r\n size = Size.Small,\r\n height = 'auto',\r\n delay = undefined,\r\n align = 'center',\r\n position = 'bottom',\r\n trigger = 'hover',\r\n hideAfter = 5000,\r\n ...props\r\n }: TooltipProps) => {\r\n\r\n const [showTooltip, setShowTooltip] = React.useState(false);\r\n const timeoutRef = useRef<any>();\r\n\r\n const ref = useClickOutsideRef(() => setShowTooltip(false));\r\n\r\n const handleClick = (e?: MouseEvent) => {\r\n if (ref?.current?.contains(e?.target as Node)) {\r\n setShowTooltip(true)\r\n timeoutRef.current && clearTimeout(timeoutRef.current);\r\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\r\n }\r\n }\r\n const handleButtonDown = (e?: KeyboardEvent) => {\r\n if (e?.key === 'Enter' \|\| e?.key === ' ') {\r\n setShowTooltip(true);\r\n timeoutRef.current && clearTimeout(timeoutRef.current);\r\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n if (trigger == 'click') {\r\n document.addEventListener('mousedown', handleClick);\r\n ref?.current?.addEventListener('keydown', handleButtonDown);\r\n\r\n return () => {\r\n document.removeEventListener('mousedown', handleClick);\r\n ref?.current?.removeEventListener('keydown', handleButtonDown);\r\n };\r\n }\r\n }, [trigger])\r\n\r\n const cls = `${trigger === 'click' ? showTooltip ? 'show' : 'hide' : ''}`;\r\n return <TooltipContainer ref={ref}\r\n delay={delay}\r\n tabIndex={tabIndex}\r\n ~~triggerType={trigger}\r\n~~ className={cls}>\r\n <Tooltip align={align}\r\n height={height}\r\n role=\"tooltip\"\r\n size={size}\r\n withArrow={withArrow}\r\n position={position}\r\n {...props}>\r\n {label}\r\n </Tooltip>\r\n {children}\r\n </TooltipContainer>;\r\n};\r\n\r\nexport default TooltipWrapper;\r\n"],"mappings":";;;;;;;;;;;AAAA;AAIA;AACA;AAEA;AAA8B;AAAA;AAAA;AAAA;AAAA;AAAA;AAE9B,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,WAAI,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,0BAAkB,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,KAAK,OAAO,GAAGK,WAAW,GAAG,MAAM,GAAG,MAAM,GAAG,EAAE,CAAE;~~EACzE~~,oBAAO,sBAAC,+BAAgB;IAAC,GAAG,EAAEI,GAAI;IACT,KAAK,EAAEb,KAAM;IACb,QAAQ,EAAEL,QAAS;IACnB,~~WAAW,EAAES,OAAQ;IACrB,~~SAAS,~~EAAEwB~~,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	+ {"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';\r\n\r\nimport {TooltipProps} from './TooltipTypes';\r\n\r\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\r\nimport {useClickOutsideRef} from '../common';\r\nimport {useEffect, useRef} from \"react\";\r\nimport {Size} from \"../types\";\r\n\r\nconst TooltipWrapper = ({\r\n label, children,\r\n withArrow,\r\n tabIndex,\r\n size = Size.Small,\r\n height = 'auto',\r\n delay = undefined,\r\n align = 'center',\r\n position = 'bottom',\r\n trigger = 'hover',\r\n hideAfter = 5000,\r\n ...props\r\n }: TooltipProps) => {\r\n\r\n const [showTooltip, setShowTooltip] = React.useState(false);\r\n const timeoutRef = useRef<any>();\r\n\r\n const ref = useClickOutsideRef(() => setShowTooltip(false));\r\n\r\n const handleClick = (e?: MouseEvent) => {\r\n if (ref?.current?.contains(e?.target as Node)) {\r\n setShowTooltip(true)\r\n timeoutRef.current && clearTimeout(timeoutRef.current);\r\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\r\n }\r\n }\r\n const handleButtonDown = (e?: KeyboardEvent) => {\r\n if (e?.key === 'Enter' \|\| e?.key === ' ') {\r\n setShowTooltip(true);\r\n timeoutRef.current && clearTimeout(timeoutRef.current);\r\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n if (trigger == 'click') {\r\n document.addEventListener('mousedown', handleClick);\r\n ref?.current?.addEventListener('keydown', handleButtonDown);\r\n\r\n return () => {\r\n document.removeEventListener('mousedown', handleClick);\r\n ref?.current?.removeEventListener('keydown', handleButtonDown);\r\n };\r\n }\r\n }, [trigger])\r\n\r\n const cls = `${trigger} ${trigger === 'click' ? showTooltip ? 'show' : 'hide' : ''}`;\r\n return <TooltipContainer ref={ref}\r\n delay={delay}\r\n tabIndex={tabIndex}\r\n className={cls}>\r\n <Tooltip align={align}\r\n height={height}\r\n role=\"tooltip\"\r\n size={size}\r\n withArrow={withArrow}\r\n position={position}\r\n {...props}>\r\n {label}\r\n </Tooltip>\r\n {children}\r\n </TooltipContainer>;\r\n};\r\n\r\nexport default TooltipWrapper;\r\n"],"mappings":"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"}

package/dist/Tooltips/TooltipWrapper.js CHANGED Viewed

@@ -70,12 +70,11 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
       };
     }
   }, [trigger]);
-  var cls = "".concat(trigger === 'click' ? showTooltip ? 'show' : 'hide' : '');
+  var cls = "".concat(trigger, " ").concat(trigger === 'click' ? showTooltip ? 'show' : 'hide' : '');
   return /*#__PURE__*/_jsxs(TooltipContainer, {
     ref: ref,
     delay: delay,
     tabIndex: tabIndex,
-    triggerType: trigger,
     className: cls,
     children: [/*#__PURE__*/_jsx(Tooltip, _objectSpread(_objectSpread({
       align: align,

package/dist/Tooltips/TooltipWrapper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TooltipWrapper.js","names":["React","TooltipContainer","Tooltip","useClickOutsideRef","useEffect","useRef","Size","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';\r\n\r\nimport {TooltipProps} from './TooltipTypes';\r\n\r\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\r\nimport {useClickOutsideRef} from '../common';\r\nimport {useEffect, useRef} from \"react\";\r\nimport {Size} from \"../types\";\r\n\r\nconst TooltipWrapper = ({\r\n label, children,\r\n withArrow,\r\n tabIndex,\r\n size = Size.Small,\r\n height = 'auto',\r\n delay = undefined,\r\n align = 'center',\r\n position = 'bottom',\r\n trigger = 'hover',\r\n hideAfter = 5000,\r\n ...props\r\n }: TooltipProps) => {\r\n\r\n const [showTooltip, setShowTooltip] = React.useState(false);\r\n const timeoutRef = useRef<any>();\r\n\r\n const ref = useClickOutsideRef(() => setShowTooltip(false));\r\n\r\n const handleClick = (e?: MouseEvent) => {\r\n if (ref?.current?.contains(e?.target as Node)) {\r\n setShowTooltip(true)\r\n timeoutRef.current && clearTimeout(timeoutRef.current);\r\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\r\n }\r\n }\r\n const handleButtonDown = (e?: KeyboardEvent) => {\r\n if (e?.key === 'Enter' \|\| e?.key === ' ') {\r\n setShowTooltip(true);\r\n timeoutRef.current && clearTimeout(timeoutRef.current);\r\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n if (trigger == 'click') {\r\n document.addEventListener('mousedown', handleClick);\r\n ref?.current?.addEventListener('keydown', handleButtonDown);\r\n\r\n return () => {\r\n document.removeEventListener('mousedown', handleClick);\r\n ref?.current?.removeEventListener('keydown', handleButtonDown);\r\n };\r\n }\r\n }, [trigger])\r\n\r\n const cls = `${trigger === 'click' ? showTooltip ? 'show' : 'hide' : ''}`;\r\n return <TooltipContainer ref={ref}\r\n delay={delay}\r\n tabIndex={tabIndex}\r\n ~~triggerType={trigger}\r\n~~ className={cls}>\r\n <Tooltip align={align}\r\n height={height}\r\n role=\"tooltip\"\r\n size={size}\r\n withArrow={withArrow}\r\n position={position}\r\n {...props}>\r\n {label}\r\n </Tooltip>\r\n {children}\r\n </TooltipContainer>;\r\n};\r\n\r\nexport default TooltipWrapper;\r\n"],"mappings":"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~~EACzE~~,oBAAO,MAAC,gBAAgB;IAAC,GAAG,EAAEG,GAAI;IACT,KAAK,EAAEX,KAAM;IACb,QAAQ,EAAEJ,QAAS;IACnB,~~WAAW,EAAEQ,OAAQ;IACrB,~~SAAS,~~EAAEoB~~,GAAI;IAAA,wBACtC,KAAC,OAAO;MAAC,KAAK,EAAEtB,KAAM;MACb,MAAM,EAAEH,MAAO;MACf,IAAI,EAAC,SAAS;MACd,IAAI,EAAEF,IAAK;MACX,SAAS,EAAEF,SAAU;MACrB,QAAQ,EAAEQ;IAAS,GACfG,KAAK;MAAA,UACfb;IAAK,GACE,EACTC,QAAQ;EAAA,EACQ;AACrB,CAAC;AAED,eAAeF,cAAc"}
1	+ {"version":3,"file":"TooltipWrapper.js","names":["React","TooltipContainer","Tooltip","useClickOutsideRef","useEffect","useRef","Size","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';\r\n\r\nimport {TooltipProps} from './TooltipTypes';\r\n\r\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\r\nimport {useClickOutsideRef} from '../common';\r\nimport {useEffect, useRef} from \"react\";\r\nimport {Size} from \"../types\";\r\n\r\nconst TooltipWrapper = ({\r\n label, children,\r\n withArrow,\r\n tabIndex,\r\n size = Size.Small,\r\n height = 'auto',\r\n delay = undefined,\r\n align = 'center',\r\n position = 'bottom',\r\n trigger = 'hover',\r\n hideAfter = 5000,\r\n ...props\r\n }: TooltipProps) => {\r\n\r\n const [showTooltip, setShowTooltip] = React.useState(false);\r\n const timeoutRef = useRef<any>();\r\n\r\n const ref = useClickOutsideRef(() => setShowTooltip(false));\r\n\r\n const handleClick = (e?: MouseEvent) => {\r\n if (ref?.current?.contains(e?.target as Node)) {\r\n setShowTooltip(true)\r\n timeoutRef.current && clearTimeout(timeoutRef.current);\r\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\r\n }\r\n }\r\n const handleButtonDown = (e?: KeyboardEvent) => {\r\n if (e?.key === 'Enter' \|\| e?.key === ' ') {\r\n setShowTooltip(true);\r\n timeoutRef.current && clearTimeout(timeoutRef.current);\r\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n if (trigger == 'click') {\r\n document.addEventListener('mousedown', handleClick);\r\n ref?.current?.addEventListener('keydown', handleButtonDown);\r\n\r\n return () => {\r\n document.removeEventListener('mousedown', handleClick);\r\n ref?.current?.removeEventListener('keydown', handleButtonDown);\r\n };\r\n }\r\n }, [trigger])\r\n\r\n const cls = `${trigger} ${trigger === 'click' ? showTooltip ? 'show' : 'hide' : ''}`;\r\n return <TooltipContainer ref={ref}\r\n delay={delay}\r\n tabIndex={tabIndex}\r\n className={cls}>\r\n <Tooltip align={align}\r\n height={height}\r\n role=\"tooltip\"\r\n size={size}\r\n withArrow={withArrow}\r\n position={position}\r\n {...props}>\r\n {label}\r\n </Tooltip>\r\n {children}\r\n </TooltipContainer>;\r\n};\r\n\r\nexport default TooltipWrapper;\r\n"],"mappings":"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"}

package/dist/icons/index.cjs CHANGED Viewed

@@ -34,7 +34,7 @@ var getSize = function getSize(size) {
   }
 };
 exports.getSize = getSize;
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  ", "\n"])), (0, _TooltipStyles.TooltipTrigger)('hover'));
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  ", "\n"])), (0, _TooltipStyles.TooltipTrigger)());
 var renderIcon = function renderIcon(children, tooltip, tooltipId) {
   return tooltip ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(Container, {
     children: [children, /*#__PURE__*/(0, _jsxRuntime.jsx)(_TooltipStyles.Tooltip, {

package/dist/icons/index.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs","names":["getSize","size","indexOf","Container","styled","div","TooltipTrigger","renderIcon","children","tooltip","tooltipId","gTagsRegex","RegExp","fillColorRegex","formatSvgString","text","color","replace","replaceAll","SystemIcon","ContentIcon"],"sources":["../../src/icons/index.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { Tooltip, TooltipTrigger } from '../Tooltips/TooltipStyles';\r\n\r\nexport type BaseProps = {\r\n children?: any;\r\n tooltip?: string;\r\n tooltipId?: string;\r\n}\r\n\r\nexport interface IconProps extends Omit<React.AriaAttributes, 'className' \| 'color' \| 'size' \| 'label'> {\r\n label?: string;\r\n className?: string;\r\n color?: string;\r\n size?: string;\r\n viewBox?: string;\r\n};\r\n\r\n/*\r\n Retrieves the size of the icon.\r\n * @param size - Original size which was passed to the icon.\r\n * @returns Numeric value indicating the size of the icon.\r\n /\r\nexport const getSize = (size: string) => {\r\n if (typeof size === 'string' && size.indexOf('px') === -1) {\r\n return `${size}px`;\r\n } else {\r\n return size;\r\n }\r\n};\r\n\r\nconst Container = styled.div`\r\n position: relative;\r\n ${TooltipTrigger(~~'hover'~~)}\r\n`;\r\n\r\nconst renderIcon = (children: React.ReactNode, tooltip?: string, tooltipId?: string) => {\r\n return tooltip ? (\r\n <Container>\r\n {children}\r\n <Tooltip id={tooltipId}>{tooltip}</Tooltip>\r\n </Container>\r\n ) : (\r\n <>\r\n {children}\r\n </>\r\n );\r\n}\r\n\r\nconst gTagsRegex = new RegExp(/<g [A-Za-z\\W\\D]>/,'g'); // matches <g id = \".....\">\r\nconst fillColorRegex = new RegExp(/fill=\"#[A-F0-9]\"/,'g'); // matches fill=\"#1F1F1F\"\r\n\r\nexport const formatSvgString = (text: string, color: string): string => {\r\n return text.replace(gTagsRegex, '')\r\n .replaceAll('</g>','')\r\n .replace(fillColorRegex, `fill=\"${color}\"`);\r\n}\r\n\r\nexport const SystemIcon: React.FunctionComponent<BaseProps> = ({ children, tooltip = '', tooltipId = '' }) => {\r\n return renderIcon(children, tooltip, tooltipId);\r\n};\r\n\r\nexport const ContentIcon: React.FunctionComponent<BaseProps> = ({ children, tooltip = '', tooltipId = '' }) => {\r\n return renderIcon(children, tooltip, tooltipId);\r\n};\r\n\r\nexport as ContentIcons from './contenticons';\r\nexport * as SystemIcons from './systemicons';\r\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AAAoE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcnE;;AAED;AACA;AACA;AACA;AACA;AACO,IAAMA,OAAO,GAAG,SAAVA,OAAO,CAAIC,IAAY,EAAK;EACvC,IAAI,OAAOA,IAAI,KAAK,QAAQ,IAAIA,IAAI,CAACC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE;IACzD,iBAAUD,IAAI;EAChB,CAAC,MAAM;IACL,OAAOA,IAAI;EACb;AACF,CAAC;AAAC;AAEF,IAAME,SAAS,GAAGC,yBAAM,CAACC,GAAG,qHAExB,IAAAC,6BAAc,~~EAAC~~,~~OAAO,CAAC,CAC1B~~;AAED,IAAMC,UAAU,GAAG,SAAbA,UAAU,CAAIC,QAAyB,EAAEC,OAAgB,EAAEC,SAAkB,EAAK;EACtF,OAAOD,OAAO,gBACZ,sBAAC,SAAS;IAAA,WACPD,QAAQ,eACT,qBAAC,sBAAO;MAAC,EAAE,EAAEE,SAAU;MAAA,UAAED;IAAO,EAAW;EAAA,EACjC,gBAEZ;IAAA,UACGD;EAAQ,EAEZ;AACH,CAAC;AAED,IAAMG,UAAU,GAAG,IAAIC,MAAM,CAAC,mBAAmB,EAAC,GAAG,CAAC,CAAC,CAAC;AACxD,IAAMC,cAAc,GAAG,IAAID,MAAM,CAAC,mBAAmB,EAAC,GAAG,CAAC,CAAC,CAAC;;AAErD,IAAME,eAAe,GAAG,SAAlBA,eAAe,CAAIC,IAAY,EAAEC,KAAa,EAAa;EACtE,OAAOD,IAAI,CAACE,OAAO,CAACN,UAAU,EAAE,EAAE,CAAC,CACvBO,UAAU,CAAC,MAAM,EAAC,EAAE,CAAC,CACrBD,OAAO,CAACJ,cAAc,mBAAWG,KAAK,QAAI;AACxD,CAAC;AAAA;AAEM,IAAMG,UAA8C,GAAG,SAAjDA,UAA8C,OAAmD;EAAA,IAA7CX,QAAQ,QAARA,QAAQ;IAAA,oBAAEC,OAAO;IAAPA,OAAO,6BAAG,EAAE;IAAA,sBAAEC,SAAS;IAATA,SAAS,+BAAG,EAAE;EACrG,OAAOH,UAAU,CAACC,QAAQ,EAAEC,OAAO,EAAEC,SAAS,CAAC;AACjD,CAAC;AAAC;AAAA;EAvDAF,QAAQ;EACRC,OAAO;EACPC,SAAS;AAAA;AAuDJ,IAAMU,WAA+C,GAAG,SAAlDA,WAA+C,QAAmD;EAAA,IAA7CZ,QAAQ,SAARA,QAAQ;IAAA,sBAAEC,OAAO;IAAPA,OAAO,8BAAG,EAAE;IAAA,wBAAEC,SAAS;IAATA,SAAS,gCAAG,EAAE;EACtG,OAAOH,UAAU,CAACC,QAAQ,EAAEC,OAAO,EAAEC,SAAS,CAAC;AACjD,CAAC;AAAC;AAAA;EA3DAF,QAAQ;EACRC,OAAO;EACPC,SAAS;AAAA"}
1	+ {"version":3,"file":"index.cjs","names":["getSize","size","indexOf","Container","styled","div","TooltipTrigger","renderIcon","children","tooltip","tooltipId","gTagsRegex","RegExp","fillColorRegex","formatSvgString","text","color","replace","replaceAll","SystemIcon","ContentIcon"],"sources":["../../src/icons/index.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { Tooltip, TooltipTrigger } from '../Tooltips/TooltipStyles';\r\n\r\nexport type BaseProps = {\r\n children?: any;\r\n tooltip?: string;\r\n tooltipId?: string;\r\n}\r\n\r\nexport interface IconProps extends Omit<React.AriaAttributes, 'className' \| 'color' \| 'size' \| 'label'> {\r\n label?: string;\r\n className?: string;\r\n color?: string;\r\n size?: string;\r\n viewBox?: string;\r\n};\r\n\r\n/*\r\n Retrieves the size of the icon.\r\n * @param size - Original size which was passed to the icon.\r\n * @returns Numeric value indicating the size of the icon.\r\n /\r\nexport const getSize = (size: string) => {\r\n if (typeof size === 'string' && size.indexOf('px') === -1) {\r\n return `${size}px`;\r\n } else {\r\n return size;\r\n }\r\n};\r\n\r\nconst Container = styled.div`\r\n position: relative;\r\n ${TooltipTrigger()}\r\n`;\r\n\r\nconst renderIcon = (children: React.ReactNode, tooltip?: string, tooltipId?: string) => {\r\n return tooltip ? (\r\n <Container>\r\n {children}\r\n <Tooltip id={tooltipId}>{tooltip}</Tooltip>\r\n </Container>\r\n ) : (\r\n <>\r\n {children}\r\n </>\r\n );\r\n}\r\n\r\nconst gTagsRegex = new RegExp(/<g [A-Za-z\\W\\D]>/,'g'); // matches <g id = \".....\">\r\nconst fillColorRegex = new RegExp(/fill=\"#[A-F0-9]\"/,'g'); // matches fill=\"#1F1F1F\"\r\n\r\nexport const formatSvgString = (text: string, color: string): string => {\r\n return text.replace(gTagsRegex, '')\r\n .replaceAll('</g>','')\r\n .replace(fillColorRegex, `fill=\"${color}\"`);\r\n}\r\n\r\nexport const SystemIcon: React.FunctionComponent<BaseProps> = ({ children, tooltip = '', tooltipId = '' }) => {\r\n return renderIcon(children, tooltip, tooltipId);\r\n};\r\n\r\nexport const ContentIcon: React.FunctionComponent<BaseProps> = ({ children, tooltip = '', tooltipId = '' }) => {\r\n return renderIcon(children, tooltip, tooltipId);\r\n};\r\n\r\nexport as ContentIcons from './contenticons';\r\nexport * as SystemIcons from './systemicons';\r\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AAAoE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcnE;;AAED;AACA;AACA;AACA;AACA;AACO,IAAMA,OAAO,GAAG,SAAVA,OAAO,CAAIC,IAAY,EAAK;EACvC,IAAI,OAAOA,IAAI,KAAK,QAAQ,IAAIA,IAAI,CAACC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE;IACzD,iBAAUD,IAAI;EAChB,CAAC,MAAM;IACL,OAAOA,IAAI;EACb;AACF,CAAC;AAAC;AAEF,IAAME,SAAS,GAAGC,yBAAM,CAACC,GAAG,qHAExB,IAAAC,6BAAc,GAAE,CACnB;AAED,IAAMC,UAAU,GAAG,SAAbA,UAAU,CAAIC,QAAyB,EAAEC,OAAgB,EAAEC,SAAkB,EAAK;EACtF,OAAOD,OAAO,gBACZ,sBAAC,SAAS;IAAA,WACPD,QAAQ,eACT,qBAAC,sBAAO;MAAC,EAAE,EAAEE,SAAU;MAAA,UAAED;IAAO,EAAW;EAAA,EACjC,gBAEZ;IAAA,UACGD;EAAQ,EAEZ;AACH,CAAC;AAED,IAAMG,UAAU,GAAG,IAAIC,MAAM,CAAC,mBAAmB,EAAC,GAAG,CAAC,CAAC,CAAC;AACxD,IAAMC,cAAc,GAAG,IAAID,MAAM,CAAC,mBAAmB,EAAC,GAAG,CAAC,CAAC,CAAC;;AAErD,IAAME,eAAe,GAAG,SAAlBA,eAAe,CAAIC,IAAY,EAAEC,KAAa,EAAa;EACtE,OAAOD,IAAI,CAACE,OAAO,CAACN,UAAU,EAAE,EAAE,CAAC,CACvBO,UAAU,CAAC,MAAM,EAAC,EAAE,CAAC,CACrBD,OAAO,CAACJ,cAAc,mBAAWG,KAAK,QAAI;AACxD,CAAC;AAAA;AAEM,IAAMG,UAA8C,GAAG,SAAjDA,UAA8C,OAAmD;EAAA,IAA7CX,QAAQ,QAARA,QAAQ;IAAA,oBAAEC,OAAO;IAAPA,OAAO,6BAAG,EAAE;IAAA,sBAAEC,SAAS;IAATA,SAAS,+BAAG,EAAE;EACrG,OAAOH,UAAU,CAACC,QAAQ,EAAEC,OAAO,EAAEC,SAAS,CAAC;AACjD,CAAC;AAAC;AAAA;EAvDAF,QAAQ;EACRC,OAAO;EACPC,SAAS;AAAA;AAuDJ,IAAMU,WAA+C,GAAG,SAAlDA,WAA+C,QAAmD;EAAA,IAA7CZ,QAAQ,SAARA,QAAQ;IAAA,sBAAEC,OAAO;IAAPA,OAAO,8BAAG,EAAE;IAAA,wBAAEC,SAAS;IAATA,SAAS,gCAAG,EAAE;EACtG,OAAOH,UAAU,CAACC,QAAQ,EAAEC,OAAO,EAAEC,SAAS,CAAC;AACjD,CAAC;AAAC;AAAA;EA3DAF,QAAQ;EACRC,OAAO;EACPC,SAAS;AAAA"}

package/dist/icons/index.js CHANGED Viewed

@@ -21,7 +21,7 @@ export var getSize = function getSize(size) {
     return size;
   }
 };
-var Container = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: relative;\n  ", "\n"])), TooltipTrigger('hover'));
+var Container = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: relative;\n  ", "\n"])), TooltipTrigger());
 var renderIcon = function renderIcon(children, tooltip, tooltipId) {
   return tooltip ? /*#__PURE__*/_jsxs(Container, {
     children: [children, /*#__PURE__*/_jsx(Tooltip, {

package/dist/icons/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":["React","styled","Tooltip","TooltipTrigger","getSize","size","indexOf","Container","div","renderIcon","children","tooltip","tooltipId","gTagsRegex","RegExp","fillColorRegex","formatSvgString","text","color","replace","replaceAll","SystemIcon","ContentIcon","ContentIcons","SystemIcons"],"sources":["../../src/icons/index.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { Tooltip, TooltipTrigger } from '../Tooltips/TooltipStyles';\r\n\r\nexport type BaseProps = {\r\n children?: any;\r\n tooltip?: string;\r\n tooltipId?: string;\r\n}\r\n\r\nexport interface IconProps extends Omit<React.AriaAttributes, 'className' \| 'color' \| 'size' \| 'label'> {\r\n label?: string;\r\n className?: string;\r\n color?: string;\r\n size?: string;\r\n viewBox?: string;\r\n};\r\n\r\n/*\r\n Retrieves the size of the icon.\r\n * @param size - Original size which was passed to the icon.\r\n * @returns Numeric value indicating the size of the icon.\r\n /\r\nexport const getSize = (size: string) => {\r\n if (typeof size === 'string' && size.indexOf('px') === -1) {\r\n return `${size}px`;\r\n } else {\r\n return size;\r\n }\r\n};\r\n\r\nconst Container = styled.div`\r\n position: relative;\r\n ${TooltipTrigger(~~'hover'~~)}\r\n`;\r\n\r\nconst renderIcon = (children: React.ReactNode, tooltip?: string, tooltipId?: string) => {\r\n return tooltip ? (\r\n <Container>\r\n {children}\r\n <Tooltip id={tooltipId}>{tooltip}</Tooltip>\r\n </Container>\r\n ) : (\r\n <>\r\n {children}\r\n </>\r\n );\r\n}\r\n\r\nconst gTagsRegex = new RegExp(/<g [A-Za-z\\W\\D]>/,'g'); // matches <g id = \".....\">\r\nconst fillColorRegex = new RegExp(/fill=\"#[A-F0-9]\"/,'g'); // matches fill=\"#1F1F1F\"\r\n\r\nexport const formatSvgString = (text: string, color: string): string => {\r\n return text.replace(gTagsRegex, '')\r\n .replaceAll('</g>','')\r\n .replace(fillColorRegex, `fill=\"${color}\"`);\r\n}\r\n\r\nexport const SystemIcon: React.FunctionComponent<BaseProps> = ({ children, tooltip = '', tooltipId = '' }) => {\r\n return renderIcon(children, tooltip, tooltipId);\r\n};\r\n\r\nexport const ContentIcon: React.FunctionComponent<BaseProps> = ({ children, tooltip = '', tooltipId = '' }) => {\r\n return renderIcon(children, tooltip, tooltipId);\r\n};\r\n\r\nexport as ContentIcons from './contenticons';\r\nexport * as SystemIcons from './systemicons';\r\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAASC,OAAO,EAAEC,cAAc,QAAQ,2BAA2B;AAAC;AAAA;AAAA;AAcnE;;AAED;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAO,CAAIC,IAAY,EAAK;EACvC,IAAI,OAAOA,IAAI,KAAK,QAAQ,IAAIA,IAAI,CAACC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE;IACzD,iBAAUD,IAAI;EAChB,CAAC,MAAM;IACL,OAAOA,IAAI;EACb;AACF,CAAC;AAED,IAAME,SAAS,GAAGN,MAAM,CAACO,GAAG,uGAExBL,cAAc,~~CAAC~~,~~OAAO,CAAC,CAC1B~~;AAED,IAAMM,UAAU,GAAG,SAAbA,UAAU,CAAIC,QAAyB,EAAEC,OAAgB,EAAEC,SAAkB,EAAK;EACtF,OAAOD,OAAO,gBACZ,MAAC,SAAS;IAAA,WACPD,QAAQ,eACT,KAAC,OAAO;MAAC,EAAE,EAAEE,SAAU;MAAA,UAAED;IAAO,EAAW;EAAA,EACjC,gBAEZ;IAAA,UACGD;EAAQ,EAEZ;AACH,CAAC;AAED,IAAMG,UAAU,GAAG,IAAIC,MAAM,CAAC,mBAAmB,EAAC,GAAG,CAAC,CAAC,CAAC;AACxD,IAAMC,cAAc,GAAG,IAAID,MAAM,CAAC,mBAAmB,EAAC,GAAG,CAAC,CAAC,CAAC;;AAE5D,OAAO,IAAME,eAAe,GAAG,SAAlBA,eAAe,CAAIC,IAAY,EAAEC,KAAa,EAAa;EACtE,OAAOD,IAAI,CAACE,OAAO,CAACN,UAAU,EAAE,EAAE,CAAC,CACvBO,UAAU,CAAC,MAAM,EAAC,EAAE,CAAC,CACrBD,OAAO,CAACJ,cAAc,mBAAWG,KAAK,QAAI;AACxD,CAAC;AAED,OAAO,IAAMG,UAA8C,GAAG,SAAjDA,UAA8C,OAAmD;EAAA,IAA7CX,QAAQ,QAARA,QAAQ;IAAA,oBAAEC,OAAO;IAAPA,OAAO,6BAAG,EAAE;IAAA,sBAAEC,SAAS;IAATA,SAAS,+BAAG,EAAE;EACrG,OAAOH,UAAU,CAACC,QAAQ,EAAEC,OAAO,EAAEC,SAAS,CAAC;AACjD,CAAC;AAAC;EAvDAF,QAAQ;EACRC,OAAO;EACPC,SAAS;AAAA;AAuDX,OAAO,IAAMU,WAA+C,GAAG,SAAlDA,WAA+C,QAAmD;EAAA,IAA7CZ,QAAQ,SAARA,QAAQ;IAAA,sBAAEC,OAAO;IAAPA,OAAO,8BAAG,EAAE;IAAA,wBAAEC,SAAS;IAATA,SAAS,gCAAG,EAAE;EACtG,OAAOH,UAAU,CAACC,QAAQ,EAAEC,OAAO,EAAEC,SAAS,CAAC;AACjD,CAAC;AAAC;EA3DAF,QAAQ;EACRC,OAAO;EACPC,SAAS;AAAA;AAAA,+BA2DoB,gBAAgB;AAAA,0BAAnCW,YAAY;AAAA,8BACK,eAAe;AAAA,yBAAhCC,WAAW"}
1	+ {"version":3,"file":"index.js","names":["React","styled","Tooltip","TooltipTrigger","getSize","size","indexOf","Container","div","renderIcon","children","tooltip","tooltipId","gTagsRegex","RegExp","fillColorRegex","formatSvgString","text","color","replace","replaceAll","SystemIcon","ContentIcon","ContentIcons","SystemIcons"],"sources":["../../src/icons/index.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { Tooltip, TooltipTrigger } from '../Tooltips/TooltipStyles';\r\n\r\nexport type BaseProps = {\r\n children?: any;\r\n tooltip?: string;\r\n tooltipId?: string;\r\n}\r\n\r\nexport interface IconProps extends Omit<React.AriaAttributes, 'className' \| 'color' \| 'size' \| 'label'> {\r\n label?: string;\r\n className?: string;\r\n color?: string;\r\n size?: string;\r\n viewBox?: string;\r\n};\r\n\r\n/*\r\n Retrieves the size of the icon.\r\n * @param size - Original size which was passed to the icon.\r\n * @returns Numeric value indicating the size of the icon.\r\n /\r\nexport const getSize = (size: string) => {\r\n if (typeof size === 'string' && size.indexOf('px') === -1) {\r\n return `${size}px`;\r\n } else {\r\n return size;\r\n }\r\n};\r\n\r\nconst Container = styled.div`\r\n position: relative;\r\n ${TooltipTrigger()}\r\n`;\r\n\r\nconst renderIcon = (children: React.ReactNode, tooltip?: string, tooltipId?: string) => {\r\n return tooltip ? (\r\n <Container>\r\n {children}\r\n <Tooltip id={tooltipId}>{tooltip}</Tooltip>\r\n </Container>\r\n ) : (\r\n <>\r\n {children}\r\n </>\r\n );\r\n}\r\n\r\nconst gTagsRegex = new RegExp(/<g [A-Za-z\\W\\D]>/,'g'); // matches <g id = \".....\">\r\nconst fillColorRegex = new RegExp(/fill=\"#[A-F0-9]\"/,'g'); // matches fill=\"#1F1F1F\"\r\n\r\nexport const formatSvgString = (text: string, color: string): string => {\r\n return text.replace(gTagsRegex, '')\r\n .replaceAll('</g>','')\r\n .replace(fillColorRegex, `fill=\"${color}\"`);\r\n}\r\n\r\nexport const SystemIcon: React.FunctionComponent<BaseProps> = ({ children, tooltip = '', tooltipId = '' }) => {\r\n return renderIcon(children, tooltip, tooltipId);\r\n};\r\n\r\nexport const ContentIcon: React.FunctionComponent<BaseProps> = ({ children, tooltip = '', tooltipId = '' }) => {\r\n return renderIcon(children, tooltip, tooltipId);\r\n};\r\n\r\nexport as ContentIcons from './contenticons';\r\nexport * as SystemIcons from './systemicons';\r\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAASC,OAAO,EAAEC,cAAc,QAAQ,2BAA2B;AAAC;AAAA;AAAA;AAcnE;;AAED;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAO,CAAIC,IAAY,EAAK;EACvC,IAAI,OAAOA,IAAI,KAAK,QAAQ,IAAIA,IAAI,CAACC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE;IACzD,iBAAUD,IAAI;EAChB,CAAC,MAAM;IACL,OAAOA,IAAI;EACb;AACF,CAAC;AAED,IAAME,SAAS,GAAGN,MAAM,CAACO,GAAG,uGAExBL,cAAc,EAAE,CACnB;AAED,IAAMM,UAAU,GAAG,SAAbA,UAAU,CAAIC,QAAyB,EAAEC,OAAgB,EAAEC,SAAkB,EAAK;EACtF,OAAOD,OAAO,gBACZ,MAAC,SAAS;IAAA,WACPD,QAAQ,eACT,KAAC,OAAO;MAAC,EAAE,EAAEE,SAAU;MAAA,UAAED;IAAO,EAAW;EAAA,EACjC,gBAEZ;IAAA,UACGD;EAAQ,EAEZ;AACH,CAAC;AAED,IAAMG,UAAU,GAAG,IAAIC,MAAM,CAAC,mBAAmB,EAAC,GAAG,CAAC,CAAC,CAAC;AACxD,IAAMC,cAAc,GAAG,IAAID,MAAM,CAAC,mBAAmB,EAAC,GAAG,CAAC,CAAC,CAAC;;AAE5D,OAAO,IAAME,eAAe,GAAG,SAAlBA,eAAe,CAAIC,IAAY,EAAEC,KAAa,EAAa;EACtE,OAAOD,IAAI,CAACE,OAAO,CAACN,UAAU,EAAE,EAAE,CAAC,CACvBO,UAAU,CAAC,MAAM,EAAC,EAAE,CAAC,CACrBD,OAAO,CAACJ,cAAc,mBAAWG,KAAK,QAAI;AACxD,CAAC;AAED,OAAO,IAAMG,UAA8C,GAAG,SAAjDA,UAA8C,OAAmD;EAAA,IAA7CX,QAAQ,QAARA,QAAQ;IAAA,oBAAEC,OAAO;IAAPA,OAAO,6BAAG,EAAE;IAAA,sBAAEC,SAAS;IAATA,SAAS,+BAAG,EAAE;EACrG,OAAOH,UAAU,CAACC,QAAQ,EAAEC,OAAO,EAAEC,SAAS,CAAC;AACjD,CAAC;AAAC;EAvDAF,QAAQ;EACRC,OAAO;EACPC,SAAS;AAAA;AAuDX,OAAO,IAAMU,WAA+C,GAAG,SAAlDA,WAA+C,QAAmD;EAAA,IAA7CZ,QAAQ,SAARA,QAAQ;IAAA,sBAAEC,OAAO;IAAPA,OAAO,8BAAG,EAAE;IAAA,wBAAEC,SAAS;IAATA,SAAS,gCAAG,EAAE;EACtG,OAAOH,UAAU,CAACC,QAAQ,EAAEC,OAAO,EAAEC,SAAS,CAAC;AACjD,CAAC;AAAC;EA3DAF,QAAQ;EACRC,OAAO;EACPC,SAAS;AAAA;AAAA,+BA2DoB,gBAAgB;AAAA,0BAAnCW,YAAY;AAAA,8BACK,eAAe;AAAA,yBAAhCC,WAAW"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@laerdal/life-react-components",
-  "version": "3.5.0",
+  "version": "3.5.2-uss.hackathon",
   "private": false,
   "author": "Erik Martirosyan <erik.martirosyan@laerdal.com>",
   "contributors": [],