@chayns-components/core 5.0.0-beta.1173 → 5.0.0-beta.1175

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.
@@ -31,7 +31,7 @@ const StyledMotionDelayedDropdownContent = exports.StyledMotionDelayedDropdownCo
31
31
  pointer-events: none;
32
32
  z-index: -1;
33
33
  ` : (0, _styledComponents.css)`
34
- z-index: 4;
34
+ z-index: 5;
35
35
  `}
36
36
  `;
37
37
  //# sourceMappingURL=DelayedDropdownContent.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DelayedDropdownContent.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledMotionDelayedDropdownContent","exports","styled","motion","div","$coordinates","y","x","$transform","$shouldHideContent","css"],"sources":["../../../../../src/components/dropdown-body-wrapper/delayed-dropdown-content/DelayedDropdownContent.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\nimport { DropdownCoordinates, DropdownTransform } from '../../../types/dropdown';\n\ntype StyledMotionDelayedDropdownContentProps = WithTheme<{\n $shouldHideContent: boolean;\n $coordinates: DropdownCoordinates;\n $transform: DropdownTransform;\n}>;\n\nexport const StyledMotionDelayedDropdownContent = styled(\n motion.div,\n)<StyledMotionDelayedDropdownContentProps>`\n position: absolute;\n\n height: fit-content;\n width: fit-content;\n\n top: ${({ $coordinates }) => $coordinates.y}px;\n left: ${({ $coordinates }) => $coordinates.x}px;\n\n transform: ${({ $transform }) => `translate(${$transform.x}, ${$transform.y})`};\n\n ${({ $shouldHideContent }) =>\n $shouldHideContent\n ? css`\n visibility: hidden;\n pointer-events: none;\n z-index: -1;\n `\n : css`\n z-index: 4;\n `}\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAAgD,SAAAE,wBAAAC,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAH,uBAAA,YAAAA,CAAAC,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAUzC,MAAMkB,kCAAkC,GAAAC,OAAA,CAAAD,kCAAA,GAAG,IAAAE,yBAAM,EACpDC,aAAM,CAACC,GACX,CAA0C;AAC1C;AACA;AACA;AACA;AACA;AACA,WAAW,CAAC;EAAEC;AAAa,CAAC,KAAKA,YAAY,CAACC,CAAC;AAC/C,YAAY,CAAC;EAAED;AAAa,CAAC,KAAKA,YAAY,CAACE,CAAC;AAChD;AACA,iBAAiB,CAAC;EAAEC;AAAW,CAAC,KAAK,aAAaA,UAAU,CAACD,CAAC,KAAKC,UAAU,CAACF,CAAC,GAAG;AAClF;AACA,MAAM,CAAC;EAAEG;AAAmB,CAAC,KACrBA,kBAAkB,GACZ,IAAAC,qBAAG;AACjB;AACA;AACA;AACA,eAAe,GACD,IAAAA,qBAAG;AACjB;AACA,eAAe;AACf,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"DelayedDropdownContent.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledMotionDelayedDropdownContent","exports","styled","motion","div","$coordinates","y","x","$transform","$shouldHideContent","css"],"sources":["../../../../../src/components/dropdown-body-wrapper/delayed-dropdown-content/DelayedDropdownContent.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\nimport { DropdownCoordinates, DropdownTransform } from '../../../types/dropdown';\n\ntype StyledMotionDelayedDropdownContentProps = WithTheme<{\n $shouldHideContent: boolean;\n $coordinates: DropdownCoordinates;\n $transform: DropdownTransform;\n}>;\n\nexport const StyledMotionDelayedDropdownContent = styled(\n motion.div,\n)<StyledMotionDelayedDropdownContentProps>`\n position: absolute;\n\n height: fit-content;\n width: fit-content;\n\n top: ${({ $coordinates }) => $coordinates.y}px;\n left: ${({ $coordinates }) => $coordinates.x}px;\n\n transform: ${({ $transform }) => `translate(${$transform.x}, ${$transform.y})`};\n\n ${({ $shouldHideContent }) =>\n $shouldHideContent\n ? css`\n visibility: hidden;\n pointer-events: none;\n z-index: -1;\n `\n : css`\n z-index: 5;\n `}\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAAgD,SAAAE,wBAAAC,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAH,uBAAA,YAAAA,CAAAC,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAUzC,MAAMkB,kCAAkC,GAAAC,OAAA,CAAAD,kCAAA,GAAG,IAAAE,yBAAM,EACpDC,aAAM,CAACC,GACX,CAA0C;AAC1C;AACA;AACA;AACA;AACA;AACA,WAAW,CAAC;EAAEC;AAAa,CAAC,KAAKA,YAAY,CAACC,CAAC;AAC/C,YAAY,CAAC;EAAED;AAAa,CAAC,KAAKA,YAAY,CAACE,CAAC;AAChD;AACA,iBAAiB,CAAC;EAAEC;AAAW,CAAC,KAAK,aAAaA,UAAU,CAACD,CAAC,KAAKC,UAAU,CAACF,CAAC,GAAG;AAClF;AACA,MAAM,CAAC;EAAEG;AAAmB,CAAC,KACrBA,kBAAkB,GACZ,IAAAC,qBAAG;AACjB;AACA;AACA;AACA,eAAe,GACD,IAAAA,qBAAG;AACjB;AACA,eAAe;AACf,CAAC","ignoreList":[]}
@@ -11,7 +11,6 @@ var _ListItemIcon = _interopRequireDefault(require("./list-item-icon/ListItemIco
11
11
  var _ListItemImage = _interopRequireDefault(require("./list-item-image/ListItemImage"));
12
12
  var _ListItemRightElements = _interopRequireDefault(require("./list-item-right-elements/ListItemRightElements"));
13
13
  var _ListItemHead = require("./ListItemHead.styles");
14
- var _reactResizeDetector = require("react-resize-detector");
15
14
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
16
15
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
17
16
  const ListItemHead = ({
@@ -40,33 +39,23 @@ const ListItemHead = ({
40
39
  setShouldEnableTooltip
41
40
  }) => {
42
41
  const [shouldShowHoverItem, setShouldShowHoverItem] = (0, _react.useState)(false);
43
- const [, setIsFirstRender] = (0, _react.useState)(false);
42
+ const titleWrapperRef = (0, _react.useRef)(null);
44
43
  const longPressTimeoutRef = (0, _react.useRef)();
45
44
  const shouldShowSubtitleRow = subtitle || typeof subtitle === 'string';
46
45
  const shouldShowMultilineTitle = (0, _react.useMemo)(() => !subtitle, [subtitle]);
47
- const handleShowTooltipResize = (0, _react.useCallback)(data => {
48
- var _data$entry;
49
- const el = (_data$entry = data.entry) === null || _data$entry === void 0 ? void 0 : _data$entry.target;
46
+ const handleShowTooltipResize = (0, _react.useCallback)(entries => {
47
+ var _entries$;
48
+ const el = (_entries$ = entries[0]) === null || _entries$ === void 0 ? void 0 : _entries$.target;
50
49
  if (!el) return;
51
50
  setShouldEnableTooltip(el.scrollWidth > el.clientWidth);
52
51
  }, [setShouldEnableTooltip]);
53
- const {
54
- ref: titleRef
55
- } = (0, _reactResizeDetector.useResizeDetector)({
56
- onResize: handleShowTooltipResize,
57
- skipOnMount: true
58
- });
59
- const {
60
- ref: ellipsisTitleRef
61
- } = (0, _reactResizeDetector.useResizeDetector)({
62
- onResize: handleShowTooltipResize,
63
- skipOnMount: true
64
- });
65
-
66
- // This is used to trigger a rerender, so the head height can be calculated
67
52
  (0, _react.useEffect)(() => {
68
- setIsFirstRender(true);
69
- }, []);
53
+ const element = titleWrapperRef === null || titleWrapperRef === void 0 ? void 0 : titleWrapperRef.current;
54
+ if (!element) return undefined;
55
+ const resizeObserver = new ResizeObserver(handleShowTooltipResize);
56
+ resizeObserver.observe(element);
57
+ return () => resizeObserver.disconnect();
58
+ }, [handleShowTooltipResize]);
70
59
  const handleMouseEnter = (0, _react.useCallback)(() => setShouldShowHoverItem(true), []);
71
60
  const handleMouseLeave = (0, _react.useCallback)(() => setShouldShowHoverItem(false), []);
72
61
  const handleTouchStart = (0, _react.useCallback)(event => {
@@ -148,39 +137,10 @@ const ListItemHead = ({
148
137
  })), leftElements, iconOrImageElement), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadContent, {
149
138
  $isIconOrImageGiven: iconOrImageElement !== undefined,
150
139
  $isOpen: isOpen
151
- }, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitle, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleContent, null, isOpen ? /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleText, {
152
- key: "title",
153
- ref: titleRef,
154
- $shouldShowMultilineTitle: shouldShowMultilineTitle,
155
- initial: {
156
- opacity: 0
157
- },
158
- animate: {
159
- opacity: 1
160
- },
161
- exit: {
162
- opacity: 0
163
- },
164
- transition: {
165
- duration: 0.4
166
- }
167
- }, title) : /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleText, {
168
- key: "ellipsisTitle",
169
- $isEllipsis: true,
170
- ref: ellipsisTitleRef,
171
- $shouldShowMultilineTitle: shouldShowMultilineTitle,
172
- initial: {
173
- opacity: 0
174
- },
175
- animate: {
176
- opacity: 1
177
- },
178
- exit: {
179
- opacity: 0
180
- },
181
- transition: {
182
- duration: 0.3
183
- }
140
+ }, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitle, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleContent, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleText, {
141
+ $isEllipsis: !isOpen,
142
+ ref: titleWrapperRef,
143
+ $shouldShowMultilineTitle: shouldShowMultilineTitle
184
144
  }, title), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleElement, null, titleElement))), shouldShowSubtitleRow && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitle, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitleText, {
185
145
  $isOpen: isOpen
186
146
  }, subtitle))), rightElements && /*#__PURE__*/_react.default.createElement(_ListItemRightElements.default, {
@@ -1 +1 @@
1
- {"version":3,"file":"ListItemHead.js","names":["_react","_interopRequireWildcard","require","_accordion","_Icon","_interopRequireDefault","_ListItemIcon","_ListItemImage","_ListItemRightElements","_ListItemHead","_reactResizeDetector","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItemHead","careOfLocationId","cornerImage","hoverItem","icons","imageBackground","images","isAnyItemExpandable","isExpandable","isOpen","isTitleGreyed","leftElements","onClick","onLongPress","rightElements","shouldHideImageOrIconBackground","shouldHideIndicator","shouldOpenImageOnClick","shouldShowRoundImageOrIcon","subtitle","shouldForceHover","title","titleElement","setShouldEnableTooltip","shouldShowHoverItem","setShouldShowHoverItem","useState","setIsFirstRender","longPressTimeoutRef","useRef","shouldShowSubtitleRow","shouldShowMultilineTitle","useMemo","handleShowTooltipResize","useCallback","data","_data$entry","el","entry","target","scrollWidth","clientWidth","ref","titleRef","useResizeDetector","onResize","skipOnMount","ellipsisTitleRef","useEffect","handleMouseEnter","handleMouseLeave","handleTouchStart","event","current","window","setTimeout","handleTouchEnd","clearTimeout","shouldPreventRightElementClick","bottom","getElementClickEvent","center","top","iconOrImageElement","createElement","shouldHideBackground","shouldShowRoundIcon","shouldShowRoundImage","undefined","StyledListItemHead","layout","animate","opacity","initial","transition","duration","type","className","$isClickable","$isAnyItemExpandable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","StyledListItemHeadLeftWrapper","StyledMotionListItemHeadIndicator","rotate","StyledListItemHeadContent","$isIconOrImageGiven","$isOpen","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleText","key","$shouldShowMultilineTitle","exit","$isEllipsis","StyledListItemHeadTitleElement","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledMotionListItemHeadHoverItemWrapper","marginLeft","width","StyledMotionListItemHeadHoverItem","displayName","_default","exports"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n CSSProperties,\n FC,\n MouseEventHandler,\n ReactNode,\n TouchEventHandler,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport type { IListItemRightElements } from '../../../../types/list';\nimport { getElementClickEvent } from '../../../../utils/accordion';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport ListItemRightElements from './list-item-right-elements/ListItemRightElements';\nimport {\n StyledListItemHead,\n StyledListItemHeadContent,\n StyledListItemHeadLeftWrapper,\n StyledListItemHeadSubtitle,\n StyledListItemHeadSubtitleText,\n StyledListItemHeadTitle,\n StyledListItemHeadTitleContent,\n StyledListItemHeadTitleElement,\n StyledListItemHeadTitleText,\n StyledMotionListItemHeadHoverItem,\n StyledMotionListItemHeadHoverItemWrapper,\n StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\nimport { ResizePayload, useResizeDetector } from 'react-resize-detector';\n\ntype ListItemHeadProps = {\n careOfLocationId?: number;\n cornerImage?: string;\n hoverItem?: ReactNode;\n icons?: string[];\n imageBackground?: CSSProperties['background'];\n images?: string[];\n isAnyItemExpandable: boolean;\n isExpandable: boolean;\n isOpen: boolean;\n isTitleGreyed?: boolean;\n leftElements?: ReactNode;\n onClick?: MouseEventHandler<HTMLDivElement>;\n onLongPress?: TouchEventHandler<HTMLDivElement>;\n rightElements?: IListItemRightElements;\n shouldHideImageOrIconBackground?: boolean;\n shouldHideIndicator?: boolean;\n shouldOpenImageOnClick: boolean;\n shouldShowRoundImageOrIcon?: boolean;\n subtitle?: ReactNode;\n title: ReactNode;\n titleElement?: ReactNode;\n shouldForceHover?: boolean;\n setShouldEnableTooltip: (value: boolean) => void;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n careOfLocationId,\n cornerImage,\n hoverItem,\n icons,\n imageBackground,\n images,\n isAnyItemExpandable,\n isExpandable,\n isOpen,\n isTitleGreyed,\n leftElements,\n onClick,\n onLongPress,\n rightElements,\n shouldHideImageOrIconBackground,\n shouldHideIndicator,\n shouldOpenImageOnClick,\n shouldShowRoundImageOrIcon,\n subtitle,\n shouldForceHover,\n title,\n titleElement,\n setShouldEnableTooltip,\n}) => {\n const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n const [, setIsFirstRender] = useState(false);\n\n const longPressTimeoutRef = useRef<number>();\n\n const shouldShowSubtitleRow = subtitle || typeof subtitle === 'string';\n\n const shouldShowMultilineTitle = useMemo(() => !subtitle, [subtitle]);\n\n const handleShowTooltipResize = useCallback(\n (data: ResizePayload) => {\n const el = data.entry?.target;\n if (!el) return;\n setShouldEnableTooltip(el.scrollWidth > el.clientWidth);\n },\n [setShouldEnableTooltip],\n );\n\n const { ref: titleRef } = useResizeDetector<HTMLDivElement>({\n onResize: handleShowTooltipResize,\n skipOnMount: true,\n });\n const { ref: ellipsisTitleRef } = useResizeDetector<HTMLDivElement>({\n onResize: handleShowTooltipResize,\n skipOnMount: true,\n });\n\n // This is used to trigger a rerender, so the head height can be calculated\n useEffect(() => {\n setIsFirstRender(true);\n }, []);\n\n const handleMouseEnter = useCallback(() => setShouldShowHoverItem(true), []);\n\n const handleMouseLeave = useCallback(() => setShouldShowHoverItem(false), []);\n\n const handleTouchStart = useCallback<TouchEventHandler<HTMLDivElement>>(\n (event) => {\n longPressTimeoutRef.current = window.setTimeout(() => {\n if (typeof onLongPress === 'function') {\n onLongPress(event);\n }\n }, 400);\n },\n [onLongPress],\n );\n\n const handleTouchEnd = useCallback(() => {\n clearTimeout(longPressTimeoutRef.current);\n }, []);\n\n const shouldPreventRightElementClick = useMemo(() => {\n if (!rightElements) return false;\n\n if (\n typeof rightElements === 'object' &&\n ('bottom' in rightElements || 'center' in rightElements || 'top' in rightElements)\n ) {\n if (rightElements.bottom && getElementClickEvent(rightElements.bottom)) {\n return true;\n }\n\n if (rightElements.center && getElementClickEvent(rightElements.center)) {\n return true;\n }\n\n if (rightElements.top && getElementClickEvent(rightElements.top)) {\n return true;\n }\n } else {\n return getElementClickEvent(rightElements as ReactNode);\n }\n\n return false;\n }, [rightElements]);\n\n const iconOrImageElement = useMemo(() => {\n if (icons) {\n return (\n <ListItemIcon\n icons={icons}\n shouldHideBackground={!!shouldHideImageOrIconBackground}\n shouldShowRoundIcon={!!shouldShowRoundImageOrIcon}\n />\n );\n }\n\n if (images) {\n return (\n <ListItemImage\n imageBackground={imageBackground}\n careOfLocationId={careOfLocationId}\n cornerImage={cornerImage}\n images={images}\n shouldOpenImageOnClick={shouldOpenImageOnClick}\n shouldHideBackground={!!shouldHideImageOrIconBackground}\n shouldShowRoundImage={!!shouldShowRoundImageOrIcon}\n />\n );\n }\n\n return undefined;\n }, [\n careOfLocationId,\n cornerImage,\n icons,\n imageBackground,\n images,\n shouldHideImageOrIconBackground,\n shouldOpenImageOnClick,\n shouldShowRoundImageOrIcon,\n ]);\n\n return (\n <StyledListItemHead\n layout\n animate={{\n opacity: isTitleGreyed ? 0.5 : 1,\n }}\n initial={false}\n transition={{ duration: 0.2, type: 'tween' }}\n className=\"beta-chayns-list-item-head\"\n $isClickable={typeof onClick === 'function' || isExpandable}\n $isAnyItemExpandable={isAnyItemExpandable}\n onClick={onClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onTouchStart={typeof onLongPress === 'function' ? handleTouchStart : undefined}\n onTouchEnd={typeof onLongPress === 'function' ? handleTouchEnd : undefined}\n >\n <StyledListItemHeadLeftWrapper>\n {isAnyItemExpandable && (\n <StyledMotionListItemHeadIndicator\n animate={{ rotate: isOpen ? 90 : 0 }}\n initial={false}\n transition={{ type: 'tween' }}\n >\n {isExpandable && !shouldHideIndicator && (\n <Icon icons={['fa fa-chevron-right']} />\n )}\n </StyledMotionListItemHeadIndicator>\n )}\n {leftElements}\n {iconOrImageElement}\n </StyledListItemHeadLeftWrapper>\n <StyledListItemHeadContent\n $isIconOrImageGiven={iconOrImageElement !== undefined}\n $isOpen={isOpen}\n >\n <StyledListItemHeadTitle>\n <StyledListItemHeadTitleContent>\n {isOpen ? (\n <StyledListItemHeadTitleText\n key=\"title\"\n ref={titleRef}\n $shouldShowMultilineTitle={shouldShowMultilineTitle}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.4 }}\n >\n {title}\n </StyledListItemHeadTitleText>\n ) : (\n <StyledListItemHeadTitleText\n key=\"ellipsisTitle\"\n $isEllipsis\n ref={ellipsisTitleRef}\n $shouldShowMultilineTitle={shouldShowMultilineTitle}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.3 }}\n >\n {title}\n </StyledListItemHeadTitleText>\n )}\n <StyledListItemHeadTitleElement>\n {titleElement}\n </StyledListItemHeadTitleElement>\n </StyledListItemHeadTitleContent>\n </StyledListItemHeadTitle>\n {shouldShowSubtitleRow && (\n <StyledListItemHeadSubtitle>\n <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n {subtitle}\n </StyledListItemHeadSubtitleText>\n </StyledListItemHeadSubtitle>\n )}\n </StyledListItemHeadContent>\n {rightElements && (\n <ListItemRightElements\n rightElements={rightElements}\n shouldPreventRightElementClick={shouldPreventRightElementClick}\n />\n )}\n {hoverItem && (\n <StyledMotionListItemHeadHoverItemWrapper\n className=\"beta-chayns-list-item-hover-item\"\n animate={{\n marginLeft: shouldForceHover || shouldShowHoverItem ? 8 : 0,\n opacity: shouldForceHover || shouldShowHoverItem ? 1 : 0,\n width: shouldForceHover || shouldShowHoverItem ? 'auto' : 0,\n }}\n initial={false}\n transition={{ duration: 0.15, type: 'tween' }}\n >\n <StyledMotionListItemHeadHoverItem>\n {hoverItem}\n </StyledMotionListItemHeadHoverItem>\n </StyledMotionListItemHeadHoverItemWrapper>\n )}\n </StyledListItemHead>\n );\n};\n\nListItemHead.displayName = 'ListItemHead';\n\nexport default ListItemHead;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"ListItemHead.js","names":["_react","_interopRequireWildcard","require","_accordion","_Icon","_interopRequireDefault","_ListItemIcon","_ListItemImage","_ListItemRightElements","_ListItemHead","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItemHead","careOfLocationId","cornerImage","hoverItem","icons","imageBackground","images","isAnyItemExpandable","isExpandable","isOpen","isTitleGreyed","leftElements","onClick","onLongPress","rightElements","shouldHideImageOrIconBackground","shouldHideIndicator","shouldOpenImageOnClick","shouldShowRoundImageOrIcon","subtitle","shouldForceHover","title","titleElement","setShouldEnableTooltip","shouldShowHoverItem","setShouldShowHoverItem","useState","titleWrapperRef","useRef","longPressTimeoutRef","shouldShowSubtitleRow","shouldShowMultilineTitle","useMemo","handleShowTooltipResize","useCallback","entries","_entries$","el","target","scrollWidth","clientWidth","useEffect","element","current","undefined","resizeObserver","ResizeObserver","observe","disconnect","handleMouseEnter","handleMouseLeave","handleTouchStart","event","window","setTimeout","handleTouchEnd","clearTimeout","shouldPreventRightElementClick","bottom","getElementClickEvent","center","top","iconOrImageElement","createElement","shouldHideBackground","shouldShowRoundIcon","shouldShowRoundImage","StyledListItemHead","layout","animate","opacity","initial","transition","duration","type","className","$isClickable","$isAnyItemExpandable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","StyledListItemHeadLeftWrapper","StyledMotionListItemHeadIndicator","rotate","StyledListItemHeadContent","$isIconOrImageGiven","$isOpen","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleText","$isEllipsis","ref","$shouldShowMultilineTitle","StyledListItemHeadTitleElement","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledMotionListItemHeadHoverItemWrapper","marginLeft","width","StyledMotionListItemHeadHoverItem","displayName","_default","exports"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n CSSProperties,\n FC,\n MouseEventHandler,\n ReactNode,\n TouchEventHandler,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport type { IListItemRightElements } from '../../../../types/list';\nimport { getElementClickEvent } from '../../../../utils/accordion';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport ListItemRightElements from './list-item-right-elements/ListItemRightElements';\nimport {\n StyledListItemHead,\n StyledListItemHeadContent,\n StyledListItemHeadLeftWrapper,\n StyledListItemHeadSubtitle,\n StyledListItemHeadSubtitleText,\n StyledListItemHeadTitle,\n StyledListItemHeadTitleContent,\n StyledListItemHeadTitleElement,\n StyledListItemHeadTitleText,\n StyledMotionListItemHeadHoverItem,\n StyledMotionListItemHeadHoverItemWrapper,\n StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\n\ntype ListItemHeadProps = {\n careOfLocationId?: number;\n cornerImage?: string;\n hoverItem?: ReactNode;\n icons?: string[];\n imageBackground?: CSSProperties['background'];\n images?: string[];\n isAnyItemExpandable: boolean;\n isExpandable: boolean;\n isOpen: boolean;\n isTitleGreyed?: boolean;\n leftElements?: ReactNode;\n onClick?: MouseEventHandler<HTMLDivElement>;\n onLongPress?: TouchEventHandler<HTMLDivElement>;\n rightElements?: IListItemRightElements;\n shouldHideImageOrIconBackground?: boolean;\n shouldHideIndicator?: boolean;\n shouldOpenImageOnClick: boolean;\n shouldShowRoundImageOrIcon?: boolean;\n subtitle?: ReactNode;\n title: ReactNode;\n titleElement?: ReactNode;\n shouldForceHover?: boolean;\n setShouldEnableTooltip: (value: boolean) => void;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n careOfLocationId,\n cornerImage,\n hoverItem,\n icons,\n imageBackground,\n images,\n isAnyItemExpandable,\n isExpandable,\n isOpen,\n isTitleGreyed,\n leftElements,\n onClick,\n onLongPress,\n rightElements,\n shouldHideImageOrIconBackground,\n shouldHideIndicator,\n shouldOpenImageOnClick,\n shouldShowRoundImageOrIcon,\n subtitle,\n shouldForceHover,\n title,\n titleElement,\n setShouldEnableTooltip,\n}) => {\n const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n const longPressTimeoutRef = useRef<number>();\n\n const shouldShowSubtitleRow = subtitle || typeof subtitle === 'string';\n\n const shouldShowMultilineTitle = useMemo(() => !subtitle, [subtitle]);\n\n const handleShowTooltipResize = useCallback(\n (entries: ResizeObserverEntry[]) => {\n const el = entries[0]?.target;\n if (!el) return;\n setShouldEnableTooltip(el.scrollWidth > el.clientWidth);\n },\n [setShouldEnableTooltip],\n );\n\n useEffect(() => {\n const element = titleWrapperRef?.current;\n if (!element) return undefined;\n\n const resizeObserver = new ResizeObserver(handleShowTooltipResize);\n resizeObserver.observe(element);\n\n return () => resizeObserver.disconnect();\n }, [handleShowTooltipResize]);\n\n const handleMouseEnter = useCallback(() => setShouldShowHoverItem(true), []);\n\n const handleMouseLeave = useCallback(() => setShouldShowHoverItem(false), []);\n\n const handleTouchStart = useCallback<TouchEventHandler<HTMLDivElement>>(\n (event) => {\n longPressTimeoutRef.current = window.setTimeout(() => {\n if (typeof onLongPress === 'function') {\n onLongPress(event);\n }\n }, 400);\n },\n [onLongPress],\n );\n\n const handleTouchEnd = useCallback(() => {\n clearTimeout(longPressTimeoutRef.current);\n }, []);\n\n const shouldPreventRightElementClick = useMemo(() => {\n if (!rightElements) return false;\n\n if (\n typeof rightElements === 'object' &&\n ('bottom' in rightElements || 'center' in rightElements || 'top' in rightElements)\n ) {\n if (rightElements.bottom && getElementClickEvent(rightElements.bottom)) {\n return true;\n }\n\n if (rightElements.center && getElementClickEvent(rightElements.center)) {\n return true;\n }\n\n if (rightElements.top && getElementClickEvent(rightElements.top)) {\n return true;\n }\n } else {\n return getElementClickEvent(rightElements as ReactNode);\n }\n\n return false;\n }, [rightElements]);\n\n const iconOrImageElement = useMemo(() => {\n if (icons) {\n return (\n <ListItemIcon\n icons={icons}\n shouldHideBackground={!!shouldHideImageOrIconBackground}\n shouldShowRoundIcon={!!shouldShowRoundImageOrIcon}\n />\n );\n }\n\n if (images) {\n return (\n <ListItemImage\n imageBackground={imageBackground}\n careOfLocationId={careOfLocationId}\n cornerImage={cornerImage}\n images={images}\n shouldOpenImageOnClick={shouldOpenImageOnClick}\n shouldHideBackground={!!shouldHideImageOrIconBackground}\n shouldShowRoundImage={!!shouldShowRoundImageOrIcon}\n />\n );\n }\n\n return undefined;\n }, [\n careOfLocationId,\n cornerImage,\n icons,\n imageBackground,\n images,\n shouldHideImageOrIconBackground,\n shouldOpenImageOnClick,\n shouldShowRoundImageOrIcon,\n ]);\n\n return (\n <StyledListItemHead\n layout\n animate={{\n opacity: isTitleGreyed ? 0.5 : 1,\n }}\n initial={false}\n transition={{ duration: 0.2, type: 'tween' }}\n className=\"beta-chayns-list-item-head\"\n $isClickable={typeof onClick === 'function' || isExpandable}\n $isAnyItemExpandable={isAnyItemExpandable}\n onClick={onClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onTouchStart={typeof onLongPress === 'function' ? handleTouchStart : undefined}\n onTouchEnd={typeof onLongPress === 'function' ? handleTouchEnd : undefined}\n >\n <StyledListItemHeadLeftWrapper>\n {isAnyItemExpandable && (\n <StyledMotionListItemHeadIndicator\n animate={{ rotate: isOpen ? 90 : 0 }}\n initial={false}\n transition={{ type: 'tween' }}\n >\n {isExpandable && !shouldHideIndicator && (\n <Icon icons={['fa fa-chevron-right']} />\n )}\n </StyledMotionListItemHeadIndicator>\n )}\n {leftElements}\n {iconOrImageElement}\n </StyledListItemHeadLeftWrapper>\n <StyledListItemHeadContent\n $isIconOrImageGiven={iconOrImageElement !== undefined}\n $isOpen={isOpen}\n >\n <StyledListItemHeadTitle>\n <StyledListItemHeadTitleContent>\n <StyledListItemHeadTitleText\n $isEllipsis={!isOpen}\n ref={titleWrapperRef}\n $shouldShowMultilineTitle={shouldShowMultilineTitle}\n >\n {title}\n </StyledListItemHeadTitleText>\n <StyledListItemHeadTitleElement>\n {titleElement}\n </StyledListItemHeadTitleElement>\n </StyledListItemHeadTitleContent>\n </StyledListItemHeadTitle>\n {shouldShowSubtitleRow && (\n <StyledListItemHeadSubtitle>\n <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n {subtitle}\n </StyledListItemHeadSubtitleText>\n </StyledListItemHeadSubtitle>\n )}\n </StyledListItemHeadContent>\n {rightElements && (\n <ListItemRightElements\n rightElements={rightElements}\n shouldPreventRightElementClick={shouldPreventRightElementClick}\n />\n )}\n {hoverItem && (\n <StyledMotionListItemHeadHoverItemWrapper\n className=\"beta-chayns-list-item-hover-item\"\n animate={{\n marginLeft: shouldForceHover || shouldShowHoverItem ? 8 : 0,\n opacity: shouldForceHover || shouldShowHoverItem ? 1 : 0,\n width: shouldForceHover || shouldShowHoverItem ? 'auto' : 0,\n }}\n initial={false}\n transition={{ duration: 0.15, type: 'tween' }}\n >\n <StyledMotionListItemHeadHoverItem>\n {hoverItem}\n </StyledMotionListItemHeadHoverItem>\n </StyledMotionListItemHeadHoverItemWrapper>\n )}\n </StyledListItemHead>\n );\n};\n\nListItemHead.displayName = 'ListItemHead';\n\nexport default ListItemHead;\n"],"mappings":"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","ignoreList":[]}
@@ -6,13 +6,14 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.useContainer = exports.ContainerAnchor = void 0;
7
7
  var _react = require("react");
8
8
  let ContainerAnchor = exports.ContainerAnchor = /*#__PURE__*/function (ContainerAnchor) {
9
- ContainerAnchor["TAPP"] = ".tapp";
10
9
  ContainerAnchor["BODY"] = "body";
11
10
  ContainerAnchor["DIALOG"] = ".dialog-inner";
12
11
  ContainerAnchor["PAGE"] = ".page-provider";
12
+ ContainerAnchor["TAPP"] = ".tapp";
13
+ ContainerAnchor["WALLET"] = ".wallet";
13
14
  return ContainerAnchor;
14
15
  }({});
15
- const DEFAULT_CONTAINER_ANCHORS = [ContainerAnchor.DIALOG, ContainerAnchor.PAGE, ContainerAnchor.TAPP, ContainerAnchor.BODY];
16
+ const DEFAULT_CONTAINER_ANCHORS = [ContainerAnchor.WALLET, ContainerAnchor.DIALOG, ContainerAnchor.PAGE, ContainerAnchor.TAPP, ContainerAnchor.BODY];
16
17
  const useContainer = ({
17
18
  ref,
18
19
  anchorElement,
@@ -1 +1 @@
1
- {"version":3,"file":"container.js","names":["_react","require","ContainerAnchor","exports","DEFAULT_CONTAINER_ANCHORS","DIALOG","PAGE","TAPP","BODY","useContainer","ref","anchorElement","container","anchors","newContainer","setNewContainer","useState","undefined","useEffect","el","current","element","closest","join","Element"],"sources":["../../../src/hooks/container.ts"],"sourcesContent":["import { MutableRefObject, useEffect, useState } from 'react';\n\nexport enum ContainerAnchor {\n TAPP = '.tapp',\n BODY = 'body',\n DIALOG = '.dialog-inner',\n PAGE = '.page-provider',\n}\n\nconst DEFAULT_CONTAINER_ANCHORS = [\n ContainerAnchor.DIALOG,\n ContainerAnchor.PAGE,\n ContainerAnchor.TAPP,\n ContainerAnchor.BODY,\n];\n\ninterface UseContainerProps {\n ref?: MutableRefObject<HTMLDivElement | HTMLLabelElement | HTMLSpanElement | null>;\n anchorElement?: Element;\n container?: Element | null;\n anchors?: ContainerAnchor[];\n}\n\nexport const useContainer = ({\n ref,\n anchorElement,\n container,\n anchors = DEFAULT_CONTAINER_ANCHORS,\n}: UseContainerProps) => {\n const [newContainer, setNewContainer] = useState<Element | undefined>(container ?? undefined);\n\n // Get the closest container if none is set\n useEffect(() => {\n let el = anchorElement as HTMLElement;\n\n if (ref?.current) {\n el = ref.current as HTMLElement;\n }\n\n if (!container) {\n const element = el.closest(anchors?.join(', '));\n\n setNewContainer(element ?? undefined);\n }\n }, [anchors, container, anchorElement, ref]);\n\n useEffect(() => {\n if (container instanceof Element) {\n setNewContainer(container);\n }\n }, [container]);\n\n return newContainer;\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAA8D,IAElDC,eAAe,GAAAC,OAAA,CAAAD,eAAA,0BAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;AAO3B,MAAME,yBAAyB,GAAG,CAC9BF,eAAe,CAACG,MAAM,EACtBH,eAAe,CAACI,IAAI,EACpBJ,eAAe,CAACK,IAAI,EACpBL,eAAe,CAACM,IAAI,CACvB;AASM,MAAMC,YAAY,GAAGA,CAAC;EACzBC,GAAG;EACHC,aAAa;EACbC,SAAS;EACTC,OAAO,GAAGT;AACK,CAAC,KAAK;EACrB,MAAM,CAACU,YAAY,EAAEC,eAAe,CAAC,GAAG,IAAAC,eAAQ,EAAsBJ,SAAS,IAAIK,SAAS,CAAC;;EAE7F;EACA,IAAAC,gBAAS,EAAC,MAAM;IACZ,IAAIC,EAAE,GAAGR,aAA4B;IAErC,IAAID,GAAG,aAAHA,GAAG,eAAHA,GAAG,CAAEU,OAAO,EAAE;MACdD,EAAE,GAAGT,GAAG,CAACU,OAAsB;IACnC;IAEA,IAAI,CAACR,SAAS,EAAE;MACZ,MAAMS,OAAO,GAAGF,EAAE,CAACG,OAAO,CAACT,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEU,IAAI,CAAC,IAAI,CAAC,CAAC;MAE/CR,eAAe,CAACM,OAAO,IAAIJ,SAAS,CAAC;IACzC;EACJ,CAAC,EAAE,CAACJ,OAAO,EAAED,SAAS,EAAED,aAAa,EAAED,GAAG,CAAC,CAAC;EAE5C,IAAAQ,gBAAS,EAAC,MAAM;IACZ,IAAIN,SAAS,YAAYY,OAAO,EAAE;MAC9BT,eAAe,CAACH,SAAS,CAAC;IAC9B;EACJ,CAAC,EAAE,CAACA,SAAS,CAAC,CAAC;EAEf,OAAOE,YAAY;AACvB,CAAC;AAACX,OAAA,CAAAM,YAAA,GAAAA,YAAA","ignoreList":[]}
1
+ {"version":3,"file":"container.js","names":["_react","require","ContainerAnchor","exports","DEFAULT_CONTAINER_ANCHORS","WALLET","DIALOG","PAGE","TAPP","BODY","useContainer","ref","anchorElement","container","anchors","newContainer","setNewContainer","useState","undefined","useEffect","el","current","element","closest","join","Element"],"sources":["../../../src/hooks/container.ts"],"sourcesContent":["import { MutableRefObject, useEffect, useState } from 'react';\n\nexport enum ContainerAnchor {\n BODY = 'body',\n DIALOG = '.dialog-inner',\n PAGE = '.page-provider',\n TAPP = '.tapp',\n WALLET = '.wallet',\n}\n\nconst DEFAULT_CONTAINER_ANCHORS = [\n ContainerAnchor.WALLET,\n ContainerAnchor.DIALOG,\n ContainerAnchor.PAGE,\n ContainerAnchor.TAPP,\n ContainerAnchor.BODY,\n];\n\ninterface UseContainerProps {\n ref?: MutableRefObject<HTMLDivElement | HTMLLabelElement | HTMLSpanElement | null>;\n anchorElement?: Element;\n container?: Element | null;\n anchors?: ContainerAnchor[];\n}\n\nexport const useContainer = ({\n ref,\n anchorElement,\n container,\n anchors = DEFAULT_CONTAINER_ANCHORS,\n}: UseContainerProps) => {\n const [newContainer, setNewContainer] = useState<Element | undefined>(container ?? undefined);\n\n // Get the closest container if none is set\n useEffect(() => {\n let el = anchorElement as HTMLElement;\n\n if (ref?.current) {\n el = ref.current as HTMLElement;\n }\n\n if (!container) {\n const element = el.closest(anchors?.join(', '));\n\n setNewContainer(element ?? undefined);\n }\n }, [anchors, container, anchorElement, ref]);\n\n useEffect(() => {\n if (container instanceof Element) {\n setNewContainer(container);\n }\n }, [container]);\n\n return newContainer;\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAA8D,IAElDC,eAAe,GAAAC,OAAA,CAAAD,eAAA,0BAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;AAQ3B,MAAME,yBAAyB,GAAG,CAC9BF,eAAe,CAACG,MAAM,EACtBH,eAAe,CAACI,MAAM,EACtBJ,eAAe,CAACK,IAAI,EACpBL,eAAe,CAACM,IAAI,EACpBN,eAAe,CAACO,IAAI,CACvB;AASM,MAAMC,YAAY,GAAGA,CAAC;EACzBC,GAAG;EACHC,aAAa;EACbC,SAAS;EACTC,OAAO,GAAGV;AACK,CAAC,KAAK;EACrB,MAAM,CAACW,YAAY,EAAEC,eAAe,CAAC,GAAG,IAAAC,eAAQ,EAAsBJ,SAAS,IAAIK,SAAS,CAAC;;EAE7F;EACA,IAAAC,gBAAS,EAAC,MAAM;IACZ,IAAIC,EAAE,GAAGR,aAA4B;IAErC,IAAID,GAAG,aAAHA,GAAG,eAAHA,GAAG,CAAEU,OAAO,EAAE;MACdD,EAAE,GAAGT,GAAG,CAACU,OAAsB;IACnC;IAEA,IAAI,CAACR,SAAS,EAAE;MACZ,MAAMS,OAAO,GAAGF,EAAE,CAACG,OAAO,CAACT,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEU,IAAI,CAAC,IAAI,CAAC,CAAC;MAE/CR,eAAe,CAACM,OAAO,IAAIJ,SAAS,CAAC;IACzC;EACJ,CAAC,EAAE,CAACJ,OAAO,EAAED,SAAS,EAAED,aAAa,EAAED,GAAG,CAAC,CAAC;EAE5C,IAAAQ,gBAAS,EAAC,MAAM;IACZ,IAAIN,SAAS,YAAYY,OAAO,EAAE;MAC9BT,eAAe,CAACH,SAAS,CAAC;IAC9B;EACJ,CAAC,EAAE,CAACA,SAAS,CAAC,CAAC;EAEf,OAAOE,YAAY;AACvB,CAAC;AAACZ,OAAA,CAAAO,YAAA,GAAAA,YAAA","ignoreList":[]}
@@ -24,7 +24,7 @@ export const StyledMotionDelayedDropdownContent = styled(motion.div)`
24
24
  pointer-events: none;
25
25
  z-index: -1;
26
26
  ` : css`
27
- z-index: 4;
27
+ z-index: 5;
28
28
  `}
29
29
  `;
30
30
  //# sourceMappingURL=DelayedDropdownContent.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DelayedDropdownContent.styles.js","names":["motion","styled","css","StyledMotionDelayedDropdownContent","div","$coordinates","y","x","$transform","$shouldHideContent"],"sources":["../../../../../src/components/dropdown-body-wrapper/delayed-dropdown-content/DelayedDropdownContent.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\nimport { DropdownCoordinates, DropdownTransform } from '../../../types/dropdown';\n\ntype StyledMotionDelayedDropdownContentProps = WithTheme<{\n $shouldHideContent: boolean;\n $coordinates: DropdownCoordinates;\n $transform: DropdownTransform;\n}>;\n\nexport const StyledMotionDelayedDropdownContent = styled(\n motion.div,\n)<StyledMotionDelayedDropdownContentProps>`\n position: absolute;\n\n height: fit-content;\n width: fit-content;\n\n top: ${({ $coordinates }) => $coordinates.y}px;\n left: ${({ $coordinates }) => $coordinates.x}px;\n\n transform: ${({ $transform }) => `translate(${$transform.x}, ${$transform.y})`};\n\n ${({ $shouldHideContent }) =>\n $shouldHideContent\n ? css`\n visibility: hidden;\n pointer-events: none;\n z-index: -1;\n `\n : css`\n z-index: 4;\n `}\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAU/C,OAAO,MAAMC,kCAAkC,GAAGF,MAAM,CACpDD,MAAM,CAACI,GACX,CAA0C;AAC1C;AACA;AACA;AACA;AACA;AACA,WAAW,CAAC;EAAEC;AAAa,CAAC,KAAKA,YAAY,CAACC,CAAC;AAC/C,YAAY,CAAC;EAAED;AAAa,CAAC,KAAKA,YAAY,CAACE,CAAC;AAChD;AACA,iBAAiB,CAAC;EAAEC;AAAW,CAAC,KAAK,aAAaA,UAAU,CAACD,CAAC,KAAKC,UAAU,CAACF,CAAC,GAAG;AAClF;AACA,MAAM,CAAC;EAAEG;AAAmB,CAAC,KACrBA,kBAAkB,GACZP,GAAG;AACjB;AACA;AACA;AACA,eAAe,GACDA,GAAG;AACjB;AACA,eAAe;AACf,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"DelayedDropdownContent.styles.js","names":["motion","styled","css","StyledMotionDelayedDropdownContent","div","$coordinates","y","x","$transform","$shouldHideContent"],"sources":["../../../../../src/components/dropdown-body-wrapper/delayed-dropdown-content/DelayedDropdownContent.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\nimport { DropdownCoordinates, DropdownTransform } from '../../../types/dropdown';\n\ntype StyledMotionDelayedDropdownContentProps = WithTheme<{\n $shouldHideContent: boolean;\n $coordinates: DropdownCoordinates;\n $transform: DropdownTransform;\n}>;\n\nexport const StyledMotionDelayedDropdownContent = styled(\n motion.div,\n)<StyledMotionDelayedDropdownContentProps>`\n position: absolute;\n\n height: fit-content;\n width: fit-content;\n\n top: ${({ $coordinates }) => $coordinates.y}px;\n left: ${({ $coordinates }) => $coordinates.x}px;\n\n transform: ${({ $transform }) => `translate(${$transform.x}, ${$transform.y})`};\n\n ${({ $shouldHideContent }) =>\n $shouldHideContent\n ? css`\n visibility: hidden;\n pointer-events: none;\n z-index: -1;\n `\n : css`\n z-index: 5;\n `}\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAU/C,OAAO,MAAMC,kCAAkC,GAAGF,MAAM,CACpDD,MAAM,CAACI,GACX,CAA0C;AAC1C;AACA;AACA;AACA;AACA;AACA,WAAW,CAAC;EAAEC;AAAa,CAAC,KAAKA,YAAY,CAACC,CAAC;AAC/C,YAAY,CAAC;EAAED;AAAa,CAAC,KAAKA,YAAY,CAACE,CAAC;AAChD;AACA,iBAAiB,CAAC;EAAEC;AAAW,CAAC,KAAK,aAAaA,UAAU,CAACD,CAAC,KAAKC,UAAU,CAACF,CAAC,GAAG;AAClF;AACA,MAAM,CAAC;EAAEG;AAAmB,CAAC,KACrBA,kBAAkB,GACZP,GAAG;AACjB;AACA;AACA;AACA,eAAe,GACDA,GAAG;AACjB;AACA,eAAe;AACf,CAAC","ignoreList":[]}
@@ -5,7 +5,6 @@ import ListItemIcon from './list-item-icon/ListItemIcon';
5
5
  import ListItemImage from './list-item-image/ListItemImage';
6
6
  import ListItemRightElements from './list-item-right-elements/ListItemRightElements';
7
7
  import { StyledListItemHead, StyledListItemHeadContent, StyledListItemHeadLeftWrapper, StyledListItemHeadSubtitle, StyledListItemHeadSubtitleText, StyledListItemHeadTitle, StyledListItemHeadTitleContent, StyledListItemHeadTitleElement, StyledListItemHeadTitleText, StyledMotionListItemHeadHoverItem, StyledMotionListItemHeadHoverItemWrapper, StyledMotionListItemHeadIndicator } from './ListItemHead.styles';
8
- import { useResizeDetector } from 'react-resize-detector';
9
8
  const ListItemHead = ({
10
9
  careOfLocationId,
11
10
  cornerImage,
@@ -32,32 +31,22 @@ const ListItemHead = ({
32
31
  setShouldEnableTooltip
33
32
  }) => {
34
33
  const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);
35
- const [, setIsFirstRender] = useState(false);
34
+ const titleWrapperRef = useRef(null);
36
35
  const longPressTimeoutRef = useRef();
37
36
  const shouldShowSubtitleRow = subtitle || typeof subtitle === 'string';
38
37
  const shouldShowMultilineTitle = useMemo(() => !subtitle, [subtitle]);
39
- const handleShowTooltipResize = useCallback(data => {
40
- const el = data.entry?.target;
38
+ const handleShowTooltipResize = useCallback(entries => {
39
+ const el = entries[0]?.target;
41
40
  if (!el) return;
42
41
  setShouldEnableTooltip(el.scrollWidth > el.clientWidth);
43
42
  }, [setShouldEnableTooltip]);
44
- const {
45
- ref: titleRef
46
- } = useResizeDetector({
47
- onResize: handleShowTooltipResize,
48
- skipOnMount: true
49
- });
50
- const {
51
- ref: ellipsisTitleRef
52
- } = useResizeDetector({
53
- onResize: handleShowTooltipResize,
54
- skipOnMount: true
55
- });
56
-
57
- // This is used to trigger a rerender, so the head height can be calculated
58
43
  useEffect(() => {
59
- setIsFirstRender(true);
60
- }, []);
44
+ const element = titleWrapperRef?.current;
45
+ if (!element) return undefined;
46
+ const resizeObserver = new ResizeObserver(handleShowTooltipResize);
47
+ resizeObserver.observe(element);
48
+ return () => resizeObserver.disconnect();
49
+ }, [handleShowTooltipResize]);
61
50
  const handleMouseEnter = useCallback(() => setShouldShowHoverItem(true), []);
62
51
  const handleMouseLeave = useCallback(() => setShouldShowHoverItem(false), []);
63
52
  const handleTouchStart = useCallback(event => {
@@ -139,39 +128,10 @@ const ListItemHead = ({
139
128
  })), leftElements, iconOrImageElement), /*#__PURE__*/React.createElement(StyledListItemHeadContent, {
140
129
  $isIconOrImageGiven: iconOrImageElement !== undefined,
141
130
  $isOpen: isOpen
142
- }, /*#__PURE__*/React.createElement(StyledListItemHeadTitle, null, /*#__PURE__*/React.createElement(StyledListItemHeadTitleContent, null, isOpen ? /*#__PURE__*/React.createElement(StyledListItemHeadTitleText, {
143
- key: "title",
144
- ref: titleRef,
145
- $shouldShowMultilineTitle: shouldShowMultilineTitle,
146
- initial: {
147
- opacity: 0
148
- },
149
- animate: {
150
- opacity: 1
151
- },
152
- exit: {
153
- opacity: 0
154
- },
155
- transition: {
156
- duration: 0.4
157
- }
158
- }, title) : /*#__PURE__*/React.createElement(StyledListItemHeadTitleText, {
159
- key: "ellipsisTitle",
160
- $isEllipsis: true,
161
- ref: ellipsisTitleRef,
162
- $shouldShowMultilineTitle: shouldShowMultilineTitle,
163
- initial: {
164
- opacity: 0
165
- },
166
- animate: {
167
- opacity: 1
168
- },
169
- exit: {
170
- opacity: 0
171
- },
172
- transition: {
173
- duration: 0.3
174
- }
131
+ }, /*#__PURE__*/React.createElement(StyledListItemHeadTitle, null, /*#__PURE__*/React.createElement(StyledListItemHeadTitleContent, null, /*#__PURE__*/React.createElement(StyledListItemHeadTitleText, {
132
+ $isEllipsis: !isOpen,
133
+ ref: titleWrapperRef,
134
+ $shouldShowMultilineTitle: shouldShowMultilineTitle
175
135
  }, title), /*#__PURE__*/React.createElement(StyledListItemHeadTitleElement, null, titleElement))), shouldShowSubtitleRow && /*#__PURE__*/React.createElement(StyledListItemHeadSubtitle, null, /*#__PURE__*/React.createElement(StyledListItemHeadSubtitleText, {
176
136
  $isOpen: isOpen
177
137
  }, subtitle))), rightElements && /*#__PURE__*/React.createElement(ListItemRightElements, {
@@ -1 +1 @@
1
- {"version":3,"file":"ListItemHead.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","getElementClickEvent","Icon","ListItemIcon","ListItemImage","ListItemRightElements","StyledListItemHead","StyledListItemHeadContent","StyledListItemHeadLeftWrapper","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleElement","StyledListItemHeadTitleText","StyledMotionListItemHeadHoverItem","StyledMotionListItemHeadHoverItemWrapper","StyledMotionListItemHeadIndicator","useResizeDetector","ListItemHead","careOfLocationId","cornerImage","hoverItem","icons","imageBackground","images","isAnyItemExpandable","isExpandable","isOpen","isTitleGreyed","leftElements","onClick","onLongPress","rightElements","shouldHideImageOrIconBackground","shouldHideIndicator","shouldOpenImageOnClick","shouldShowRoundImageOrIcon","subtitle","shouldForceHover","title","titleElement","setShouldEnableTooltip","shouldShowHoverItem","setShouldShowHoverItem","setIsFirstRender","longPressTimeoutRef","shouldShowSubtitleRow","shouldShowMultilineTitle","handleShowTooltipResize","data","el","entry","target","scrollWidth","clientWidth","ref","titleRef","onResize","skipOnMount","ellipsisTitleRef","handleMouseEnter","handleMouseLeave","handleTouchStart","event","current","window","setTimeout","handleTouchEnd","clearTimeout","shouldPreventRightElementClick","bottom","center","top","iconOrImageElement","createElement","shouldHideBackground","shouldShowRoundIcon","shouldShowRoundImage","undefined","layout","animate","opacity","initial","transition","duration","type","className","$isClickable","$isAnyItemExpandable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","rotate","$isIconOrImageGiven","$isOpen","key","$shouldShowMultilineTitle","exit","$isEllipsis","marginLeft","width","displayName"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n CSSProperties,\n FC,\n MouseEventHandler,\n ReactNode,\n TouchEventHandler,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport type { IListItemRightElements } from '../../../../types/list';\nimport { getElementClickEvent } from '../../../../utils/accordion';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport ListItemRightElements from './list-item-right-elements/ListItemRightElements';\nimport {\n StyledListItemHead,\n StyledListItemHeadContent,\n StyledListItemHeadLeftWrapper,\n StyledListItemHeadSubtitle,\n StyledListItemHeadSubtitleText,\n StyledListItemHeadTitle,\n StyledListItemHeadTitleContent,\n StyledListItemHeadTitleElement,\n StyledListItemHeadTitleText,\n StyledMotionListItemHeadHoverItem,\n StyledMotionListItemHeadHoverItemWrapper,\n StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\nimport { ResizePayload, useResizeDetector } from 'react-resize-detector';\n\ntype ListItemHeadProps = {\n careOfLocationId?: number;\n cornerImage?: string;\n hoverItem?: ReactNode;\n icons?: string[];\n imageBackground?: CSSProperties['background'];\n images?: string[];\n isAnyItemExpandable: boolean;\n isExpandable: boolean;\n isOpen: boolean;\n isTitleGreyed?: boolean;\n leftElements?: ReactNode;\n onClick?: MouseEventHandler<HTMLDivElement>;\n onLongPress?: TouchEventHandler<HTMLDivElement>;\n rightElements?: IListItemRightElements;\n shouldHideImageOrIconBackground?: boolean;\n shouldHideIndicator?: boolean;\n shouldOpenImageOnClick: boolean;\n shouldShowRoundImageOrIcon?: boolean;\n subtitle?: ReactNode;\n title: ReactNode;\n titleElement?: ReactNode;\n shouldForceHover?: boolean;\n setShouldEnableTooltip: (value: boolean) => void;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n careOfLocationId,\n cornerImage,\n hoverItem,\n icons,\n imageBackground,\n images,\n isAnyItemExpandable,\n isExpandable,\n isOpen,\n isTitleGreyed,\n leftElements,\n onClick,\n onLongPress,\n rightElements,\n shouldHideImageOrIconBackground,\n shouldHideIndicator,\n shouldOpenImageOnClick,\n shouldShowRoundImageOrIcon,\n subtitle,\n shouldForceHover,\n title,\n titleElement,\n setShouldEnableTooltip,\n}) => {\n const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n const [, setIsFirstRender] = useState(false);\n\n const longPressTimeoutRef = useRef<number>();\n\n const shouldShowSubtitleRow = subtitle || typeof subtitle === 'string';\n\n const shouldShowMultilineTitle = useMemo(() => !subtitle, [subtitle]);\n\n const handleShowTooltipResize = useCallback(\n (data: ResizePayload) => {\n const el = data.entry?.target;\n if (!el) return;\n setShouldEnableTooltip(el.scrollWidth > el.clientWidth);\n },\n [setShouldEnableTooltip],\n );\n\n const { ref: titleRef } = useResizeDetector<HTMLDivElement>({\n onResize: handleShowTooltipResize,\n skipOnMount: true,\n });\n const { ref: ellipsisTitleRef } = useResizeDetector<HTMLDivElement>({\n onResize: handleShowTooltipResize,\n skipOnMount: true,\n });\n\n // This is used to trigger a rerender, so the head height can be calculated\n useEffect(() => {\n setIsFirstRender(true);\n }, []);\n\n const handleMouseEnter = useCallback(() => setShouldShowHoverItem(true), []);\n\n const handleMouseLeave = useCallback(() => setShouldShowHoverItem(false), []);\n\n const handleTouchStart = useCallback<TouchEventHandler<HTMLDivElement>>(\n (event) => {\n longPressTimeoutRef.current = window.setTimeout(() => {\n if (typeof onLongPress === 'function') {\n onLongPress(event);\n }\n }, 400);\n },\n [onLongPress],\n );\n\n const handleTouchEnd = useCallback(() => {\n clearTimeout(longPressTimeoutRef.current);\n }, []);\n\n const shouldPreventRightElementClick = useMemo(() => {\n if (!rightElements) return false;\n\n if (\n typeof rightElements === 'object' &&\n ('bottom' in rightElements || 'center' in rightElements || 'top' in rightElements)\n ) {\n if (rightElements.bottom && getElementClickEvent(rightElements.bottom)) {\n return true;\n }\n\n if (rightElements.center && getElementClickEvent(rightElements.center)) {\n return true;\n }\n\n if (rightElements.top && getElementClickEvent(rightElements.top)) {\n return true;\n }\n } else {\n return getElementClickEvent(rightElements as ReactNode);\n }\n\n return false;\n }, [rightElements]);\n\n const iconOrImageElement = useMemo(() => {\n if (icons) {\n return (\n <ListItemIcon\n icons={icons}\n shouldHideBackground={!!shouldHideImageOrIconBackground}\n shouldShowRoundIcon={!!shouldShowRoundImageOrIcon}\n />\n );\n }\n\n if (images) {\n return (\n <ListItemImage\n imageBackground={imageBackground}\n careOfLocationId={careOfLocationId}\n cornerImage={cornerImage}\n images={images}\n shouldOpenImageOnClick={shouldOpenImageOnClick}\n shouldHideBackground={!!shouldHideImageOrIconBackground}\n shouldShowRoundImage={!!shouldShowRoundImageOrIcon}\n />\n );\n }\n\n return undefined;\n }, [\n careOfLocationId,\n cornerImage,\n icons,\n imageBackground,\n images,\n shouldHideImageOrIconBackground,\n shouldOpenImageOnClick,\n shouldShowRoundImageOrIcon,\n ]);\n\n return (\n <StyledListItemHead\n layout\n animate={{\n opacity: isTitleGreyed ? 0.5 : 1,\n }}\n initial={false}\n transition={{ duration: 0.2, type: 'tween' }}\n className=\"beta-chayns-list-item-head\"\n $isClickable={typeof onClick === 'function' || isExpandable}\n $isAnyItemExpandable={isAnyItemExpandable}\n onClick={onClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onTouchStart={typeof onLongPress === 'function' ? handleTouchStart : undefined}\n onTouchEnd={typeof onLongPress === 'function' ? handleTouchEnd : undefined}\n >\n <StyledListItemHeadLeftWrapper>\n {isAnyItemExpandable && (\n <StyledMotionListItemHeadIndicator\n animate={{ rotate: isOpen ? 90 : 0 }}\n initial={false}\n transition={{ type: 'tween' }}\n >\n {isExpandable && !shouldHideIndicator && (\n <Icon icons={['fa fa-chevron-right']} />\n )}\n </StyledMotionListItemHeadIndicator>\n )}\n {leftElements}\n {iconOrImageElement}\n </StyledListItemHeadLeftWrapper>\n <StyledListItemHeadContent\n $isIconOrImageGiven={iconOrImageElement !== undefined}\n $isOpen={isOpen}\n >\n <StyledListItemHeadTitle>\n <StyledListItemHeadTitleContent>\n {isOpen ? (\n <StyledListItemHeadTitleText\n key=\"title\"\n ref={titleRef}\n $shouldShowMultilineTitle={shouldShowMultilineTitle}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.4 }}\n >\n {title}\n </StyledListItemHeadTitleText>\n ) : (\n <StyledListItemHeadTitleText\n key=\"ellipsisTitle\"\n $isEllipsis\n ref={ellipsisTitleRef}\n $shouldShowMultilineTitle={shouldShowMultilineTitle}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.3 }}\n >\n {title}\n </StyledListItemHeadTitleText>\n )}\n <StyledListItemHeadTitleElement>\n {titleElement}\n </StyledListItemHeadTitleElement>\n </StyledListItemHeadTitleContent>\n </StyledListItemHeadTitle>\n {shouldShowSubtitleRow && (\n <StyledListItemHeadSubtitle>\n <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n {subtitle}\n </StyledListItemHeadSubtitleText>\n </StyledListItemHeadSubtitle>\n )}\n </StyledListItemHeadContent>\n {rightElements && (\n <ListItemRightElements\n rightElements={rightElements}\n shouldPreventRightElementClick={shouldPreventRightElementClick}\n />\n )}\n {hoverItem && (\n <StyledMotionListItemHeadHoverItemWrapper\n className=\"beta-chayns-list-item-hover-item\"\n animate={{\n marginLeft: shouldForceHover || shouldShowHoverItem ? 8 : 0,\n opacity: shouldForceHover || shouldShowHoverItem ? 1 : 0,\n width: shouldForceHover || shouldShowHoverItem ? 'auto' : 0,\n }}\n initial={false}\n transition={{ duration: 0.15, type: 'tween' }}\n >\n <StyledMotionListItemHeadHoverItem>\n {hoverItem}\n </StyledMotionListItemHeadHoverItem>\n </StyledMotionListItemHeadHoverItemWrapper>\n )}\n </StyledListItemHead>\n );\n};\n\nListItemHead.displayName = 'ListItemHead';\n\nexport default ListItemHead;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"ListItemHead.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","getElementClickEvent","Icon","ListItemIcon","ListItemImage","ListItemRightElements","StyledListItemHead","StyledListItemHeadContent","StyledListItemHeadLeftWrapper","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleElement","StyledListItemHeadTitleText","StyledMotionListItemHeadHoverItem","StyledMotionListItemHeadHoverItemWrapper","StyledMotionListItemHeadIndicator","ListItemHead","careOfLocationId","cornerImage","hoverItem","icons","imageBackground","images","isAnyItemExpandable","isExpandable","isOpen","isTitleGreyed","leftElements","onClick","onLongPress","rightElements","shouldHideImageOrIconBackground","shouldHideIndicator","shouldOpenImageOnClick","shouldShowRoundImageOrIcon","subtitle","shouldForceHover","title","titleElement","setShouldEnableTooltip","shouldShowHoverItem","setShouldShowHoverItem","titleWrapperRef","longPressTimeoutRef","shouldShowSubtitleRow","shouldShowMultilineTitle","handleShowTooltipResize","entries","el","target","scrollWidth","clientWidth","element","current","undefined","resizeObserver","ResizeObserver","observe","disconnect","handleMouseEnter","handleMouseLeave","handleTouchStart","event","window","setTimeout","handleTouchEnd","clearTimeout","shouldPreventRightElementClick","bottom","center","top","iconOrImageElement","createElement","shouldHideBackground","shouldShowRoundIcon","shouldShowRoundImage","layout","animate","opacity","initial","transition","duration","type","className","$isClickable","$isAnyItemExpandable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","rotate","$isIconOrImageGiven","$isOpen","$isEllipsis","ref","$shouldShowMultilineTitle","marginLeft","width","displayName"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n CSSProperties,\n FC,\n MouseEventHandler,\n ReactNode,\n TouchEventHandler,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport type { IListItemRightElements } from '../../../../types/list';\nimport { getElementClickEvent } from '../../../../utils/accordion';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport ListItemRightElements from './list-item-right-elements/ListItemRightElements';\nimport {\n StyledListItemHead,\n StyledListItemHeadContent,\n StyledListItemHeadLeftWrapper,\n StyledListItemHeadSubtitle,\n StyledListItemHeadSubtitleText,\n StyledListItemHeadTitle,\n StyledListItemHeadTitleContent,\n StyledListItemHeadTitleElement,\n StyledListItemHeadTitleText,\n StyledMotionListItemHeadHoverItem,\n StyledMotionListItemHeadHoverItemWrapper,\n StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\n\ntype ListItemHeadProps = {\n careOfLocationId?: number;\n cornerImage?: string;\n hoverItem?: ReactNode;\n icons?: string[];\n imageBackground?: CSSProperties['background'];\n images?: string[];\n isAnyItemExpandable: boolean;\n isExpandable: boolean;\n isOpen: boolean;\n isTitleGreyed?: boolean;\n leftElements?: ReactNode;\n onClick?: MouseEventHandler<HTMLDivElement>;\n onLongPress?: TouchEventHandler<HTMLDivElement>;\n rightElements?: IListItemRightElements;\n shouldHideImageOrIconBackground?: boolean;\n shouldHideIndicator?: boolean;\n shouldOpenImageOnClick: boolean;\n shouldShowRoundImageOrIcon?: boolean;\n subtitle?: ReactNode;\n title: ReactNode;\n titleElement?: ReactNode;\n shouldForceHover?: boolean;\n setShouldEnableTooltip: (value: boolean) => void;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n careOfLocationId,\n cornerImage,\n hoverItem,\n icons,\n imageBackground,\n images,\n isAnyItemExpandable,\n isExpandable,\n isOpen,\n isTitleGreyed,\n leftElements,\n onClick,\n onLongPress,\n rightElements,\n shouldHideImageOrIconBackground,\n shouldHideIndicator,\n shouldOpenImageOnClick,\n shouldShowRoundImageOrIcon,\n subtitle,\n shouldForceHover,\n title,\n titleElement,\n setShouldEnableTooltip,\n}) => {\n const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n const longPressTimeoutRef = useRef<number>();\n\n const shouldShowSubtitleRow = subtitle || typeof subtitle === 'string';\n\n const shouldShowMultilineTitle = useMemo(() => !subtitle, [subtitle]);\n\n const handleShowTooltipResize = useCallback(\n (entries: ResizeObserverEntry[]) => {\n const el = entries[0]?.target;\n if (!el) return;\n setShouldEnableTooltip(el.scrollWidth > el.clientWidth);\n },\n [setShouldEnableTooltip],\n );\n\n useEffect(() => {\n const element = titleWrapperRef?.current;\n if (!element) return undefined;\n\n const resizeObserver = new ResizeObserver(handleShowTooltipResize);\n resizeObserver.observe(element);\n\n return () => resizeObserver.disconnect();\n }, [handleShowTooltipResize]);\n\n const handleMouseEnter = useCallback(() => setShouldShowHoverItem(true), []);\n\n const handleMouseLeave = useCallback(() => setShouldShowHoverItem(false), []);\n\n const handleTouchStart = useCallback<TouchEventHandler<HTMLDivElement>>(\n (event) => {\n longPressTimeoutRef.current = window.setTimeout(() => {\n if (typeof onLongPress === 'function') {\n onLongPress(event);\n }\n }, 400);\n },\n [onLongPress],\n );\n\n const handleTouchEnd = useCallback(() => {\n clearTimeout(longPressTimeoutRef.current);\n }, []);\n\n const shouldPreventRightElementClick = useMemo(() => {\n if (!rightElements) return false;\n\n if (\n typeof rightElements === 'object' &&\n ('bottom' in rightElements || 'center' in rightElements || 'top' in rightElements)\n ) {\n if (rightElements.bottom && getElementClickEvent(rightElements.bottom)) {\n return true;\n }\n\n if (rightElements.center && getElementClickEvent(rightElements.center)) {\n return true;\n }\n\n if (rightElements.top && getElementClickEvent(rightElements.top)) {\n return true;\n }\n } else {\n return getElementClickEvent(rightElements as ReactNode);\n }\n\n return false;\n }, [rightElements]);\n\n const iconOrImageElement = useMemo(() => {\n if (icons) {\n return (\n <ListItemIcon\n icons={icons}\n shouldHideBackground={!!shouldHideImageOrIconBackground}\n shouldShowRoundIcon={!!shouldShowRoundImageOrIcon}\n />\n );\n }\n\n if (images) {\n return (\n <ListItemImage\n imageBackground={imageBackground}\n careOfLocationId={careOfLocationId}\n cornerImage={cornerImage}\n images={images}\n shouldOpenImageOnClick={shouldOpenImageOnClick}\n shouldHideBackground={!!shouldHideImageOrIconBackground}\n shouldShowRoundImage={!!shouldShowRoundImageOrIcon}\n />\n );\n }\n\n return undefined;\n }, [\n careOfLocationId,\n cornerImage,\n icons,\n imageBackground,\n images,\n shouldHideImageOrIconBackground,\n shouldOpenImageOnClick,\n shouldShowRoundImageOrIcon,\n ]);\n\n return (\n <StyledListItemHead\n layout\n animate={{\n opacity: isTitleGreyed ? 0.5 : 1,\n }}\n initial={false}\n transition={{ duration: 0.2, type: 'tween' }}\n className=\"beta-chayns-list-item-head\"\n $isClickable={typeof onClick === 'function' || isExpandable}\n $isAnyItemExpandable={isAnyItemExpandable}\n onClick={onClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onTouchStart={typeof onLongPress === 'function' ? handleTouchStart : undefined}\n onTouchEnd={typeof onLongPress === 'function' ? handleTouchEnd : undefined}\n >\n <StyledListItemHeadLeftWrapper>\n {isAnyItemExpandable && (\n <StyledMotionListItemHeadIndicator\n animate={{ rotate: isOpen ? 90 : 0 }}\n initial={false}\n transition={{ type: 'tween' }}\n >\n {isExpandable && !shouldHideIndicator && (\n <Icon icons={['fa fa-chevron-right']} />\n )}\n </StyledMotionListItemHeadIndicator>\n )}\n {leftElements}\n {iconOrImageElement}\n </StyledListItemHeadLeftWrapper>\n <StyledListItemHeadContent\n $isIconOrImageGiven={iconOrImageElement !== undefined}\n $isOpen={isOpen}\n >\n <StyledListItemHeadTitle>\n <StyledListItemHeadTitleContent>\n <StyledListItemHeadTitleText\n $isEllipsis={!isOpen}\n ref={titleWrapperRef}\n $shouldShowMultilineTitle={shouldShowMultilineTitle}\n >\n {title}\n </StyledListItemHeadTitleText>\n <StyledListItemHeadTitleElement>\n {titleElement}\n </StyledListItemHeadTitleElement>\n </StyledListItemHeadTitleContent>\n </StyledListItemHeadTitle>\n {shouldShowSubtitleRow && (\n <StyledListItemHeadSubtitle>\n <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n {subtitle}\n </StyledListItemHeadSubtitleText>\n </StyledListItemHeadSubtitle>\n )}\n </StyledListItemHeadContent>\n {rightElements && (\n <ListItemRightElements\n rightElements={rightElements}\n shouldPreventRightElementClick={shouldPreventRightElementClick}\n />\n )}\n {hoverItem && (\n <StyledMotionListItemHeadHoverItemWrapper\n className=\"beta-chayns-list-item-hover-item\"\n animate={{\n marginLeft: shouldForceHover || shouldShowHoverItem ? 8 : 0,\n opacity: shouldForceHover || shouldShowHoverItem ? 1 : 0,\n width: shouldForceHover || shouldShowHoverItem ? 'auto' : 0,\n }}\n initial={false}\n transition={{ duration: 0.15, type: 'tween' }}\n >\n <StyledMotionListItemHeadHoverItem>\n {hoverItem}\n </StyledMotionListItemHeadHoverItem>\n </StyledMotionListItemHeadHoverItemWrapper>\n )}\n </StyledListItemHead>\n );\n};\n\nListItemHead.displayName = 'ListItemHead';\n\nexport default ListItemHead;\n"],"mappings":"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","ignoreList":[]}
@@ -1,12 +1,13 @@
1
1
  import { useEffect, useState } from 'react';
2
2
  export let ContainerAnchor = /*#__PURE__*/function (ContainerAnchor) {
3
- ContainerAnchor["TAPP"] = ".tapp";
4
3
  ContainerAnchor["BODY"] = "body";
5
4
  ContainerAnchor["DIALOG"] = ".dialog-inner";
6
5
  ContainerAnchor["PAGE"] = ".page-provider";
6
+ ContainerAnchor["TAPP"] = ".tapp";
7
+ ContainerAnchor["WALLET"] = ".wallet";
7
8
  return ContainerAnchor;
8
9
  }({});
9
- const DEFAULT_CONTAINER_ANCHORS = [ContainerAnchor.DIALOG, ContainerAnchor.PAGE, ContainerAnchor.TAPP, ContainerAnchor.BODY];
10
+ const DEFAULT_CONTAINER_ANCHORS = [ContainerAnchor.WALLET, ContainerAnchor.DIALOG, ContainerAnchor.PAGE, ContainerAnchor.TAPP, ContainerAnchor.BODY];
10
11
  export const useContainer = ({
11
12
  ref,
12
13
  anchorElement,
@@ -1 +1 @@
1
- {"version":3,"file":"container.js","names":["useEffect","useState","ContainerAnchor","DEFAULT_CONTAINER_ANCHORS","DIALOG","PAGE","TAPP","BODY","useContainer","ref","anchorElement","container","anchors","newContainer","setNewContainer","undefined","el","current","element","closest","join","Element"],"sources":["../../../src/hooks/container.ts"],"sourcesContent":["import { MutableRefObject, useEffect, useState } from 'react';\n\nexport enum ContainerAnchor {\n TAPP = '.tapp',\n BODY = 'body',\n DIALOG = '.dialog-inner',\n PAGE = '.page-provider',\n}\n\nconst DEFAULT_CONTAINER_ANCHORS = [\n ContainerAnchor.DIALOG,\n ContainerAnchor.PAGE,\n ContainerAnchor.TAPP,\n ContainerAnchor.BODY,\n];\n\ninterface UseContainerProps {\n ref?: MutableRefObject<HTMLDivElement | HTMLLabelElement | HTMLSpanElement | null>;\n anchorElement?: Element;\n container?: Element | null;\n anchors?: ContainerAnchor[];\n}\n\nexport const useContainer = ({\n ref,\n anchorElement,\n container,\n anchors = DEFAULT_CONTAINER_ANCHORS,\n}: UseContainerProps) => {\n const [newContainer, setNewContainer] = useState<Element | undefined>(container ?? undefined);\n\n // Get the closest container if none is set\n useEffect(() => {\n let el = anchorElement as HTMLElement;\n\n if (ref?.current) {\n el = ref.current as HTMLElement;\n }\n\n if (!container) {\n const element = el.closest(anchors?.join(', '));\n\n setNewContainer(element ?? undefined);\n }\n }, [anchors, container, anchorElement, ref]);\n\n useEffect(() => {\n if (container instanceof Element) {\n setNewContainer(container);\n }\n }, [container]);\n\n return newContainer;\n};\n"],"mappings":"AAAA,SAA2BA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAE7D,WAAYC,eAAe,0BAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;AAO3B,MAAMC,yBAAyB,GAAG,CAC9BD,eAAe,CAACE,MAAM,EACtBF,eAAe,CAACG,IAAI,EACpBH,eAAe,CAACI,IAAI,EACpBJ,eAAe,CAACK,IAAI,CACvB;AASD,OAAO,MAAMC,YAAY,GAAGA,CAAC;EACzBC,GAAG;EACHC,aAAa;EACbC,SAAS;EACTC,OAAO,GAAGT;AACK,CAAC,KAAK;EACrB,MAAM,CAACU,YAAY,EAAEC,eAAe,CAAC,GAAGb,QAAQ,CAAsBU,SAAS,IAAII,SAAS,CAAC;;EAE7F;EACAf,SAAS,CAAC,MAAM;IACZ,IAAIgB,EAAE,GAAGN,aAA4B;IAErC,IAAID,GAAG,EAAEQ,OAAO,EAAE;MACdD,EAAE,GAAGP,GAAG,CAACQ,OAAsB;IACnC;IAEA,IAAI,CAACN,SAAS,EAAE;MACZ,MAAMO,OAAO,GAAGF,EAAE,CAACG,OAAO,CAACP,OAAO,EAAEQ,IAAI,CAAC,IAAI,CAAC,CAAC;MAE/CN,eAAe,CAACI,OAAO,IAAIH,SAAS,CAAC;IACzC;EACJ,CAAC,EAAE,CAACH,OAAO,EAAED,SAAS,EAAED,aAAa,EAAED,GAAG,CAAC,CAAC;EAE5CT,SAAS,CAAC,MAAM;IACZ,IAAIW,SAAS,YAAYU,OAAO,EAAE;MAC9BP,eAAe,CAACH,SAAS,CAAC;IAC9B;EACJ,CAAC,EAAE,CAACA,SAAS,CAAC,CAAC;EAEf,OAAOE,YAAY;AACvB,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"container.js","names":["useEffect","useState","ContainerAnchor","DEFAULT_CONTAINER_ANCHORS","WALLET","DIALOG","PAGE","TAPP","BODY","useContainer","ref","anchorElement","container","anchors","newContainer","setNewContainer","undefined","el","current","element","closest","join","Element"],"sources":["../../../src/hooks/container.ts"],"sourcesContent":["import { MutableRefObject, useEffect, useState } from 'react';\n\nexport enum ContainerAnchor {\n BODY = 'body',\n DIALOG = '.dialog-inner',\n PAGE = '.page-provider',\n TAPP = '.tapp',\n WALLET = '.wallet',\n}\n\nconst DEFAULT_CONTAINER_ANCHORS = [\n ContainerAnchor.WALLET,\n ContainerAnchor.DIALOG,\n ContainerAnchor.PAGE,\n ContainerAnchor.TAPP,\n ContainerAnchor.BODY,\n];\n\ninterface UseContainerProps {\n ref?: MutableRefObject<HTMLDivElement | HTMLLabelElement | HTMLSpanElement | null>;\n anchorElement?: Element;\n container?: Element | null;\n anchors?: ContainerAnchor[];\n}\n\nexport const useContainer = ({\n ref,\n anchorElement,\n container,\n anchors = DEFAULT_CONTAINER_ANCHORS,\n}: UseContainerProps) => {\n const [newContainer, setNewContainer] = useState<Element | undefined>(container ?? undefined);\n\n // Get the closest container if none is set\n useEffect(() => {\n let el = anchorElement as HTMLElement;\n\n if (ref?.current) {\n el = ref.current as HTMLElement;\n }\n\n if (!container) {\n const element = el.closest(anchors?.join(', '));\n\n setNewContainer(element ?? undefined);\n }\n }, [anchors, container, anchorElement, ref]);\n\n useEffect(() => {\n if (container instanceof Element) {\n setNewContainer(container);\n }\n }, [container]);\n\n return newContainer;\n};\n"],"mappings":"AAAA,SAA2BA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAE7D,WAAYC,eAAe,0BAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;AAQ3B,MAAMC,yBAAyB,GAAG,CAC9BD,eAAe,CAACE,MAAM,EACtBF,eAAe,CAACG,MAAM,EACtBH,eAAe,CAACI,IAAI,EACpBJ,eAAe,CAACK,IAAI,EACpBL,eAAe,CAACM,IAAI,CACvB;AASD,OAAO,MAAMC,YAAY,GAAGA,CAAC;EACzBC,GAAG;EACHC,aAAa;EACbC,SAAS;EACTC,OAAO,GAAGV;AACK,CAAC,KAAK;EACrB,MAAM,CAACW,YAAY,EAAEC,eAAe,CAAC,GAAGd,QAAQ,CAAsBW,SAAS,IAAII,SAAS,CAAC;;EAE7F;EACAhB,SAAS,CAAC,MAAM;IACZ,IAAIiB,EAAE,GAAGN,aAA4B;IAErC,IAAID,GAAG,EAAEQ,OAAO,EAAE;MACdD,EAAE,GAAGP,GAAG,CAACQ,OAAsB;IACnC;IAEA,IAAI,CAACN,SAAS,EAAE;MACZ,MAAMO,OAAO,GAAGF,EAAE,CAACG,OAAO,CAACP,OAAO,EAAEQ,IAAI,CAAC,IAAI,CAAC,CAAC;MAE/CN,eAAe,CAACI,OAAO,IAAIH,SAAS,CAAC;IACzC;EACJ,CAAC,EAAE,CAACH,OAAO,EAAED,SAAS,EAAED,aAAa,EAAED,GAAG,CAAC,CAAC;EAE5CV,SAAS,CAAC,MAAM;IACZ,IAAIY,SAAS,YAAYU,OAAO,EAAE;MAC9BP,eAAe,CAACH,SAAS,CAAC;IAC9B;EACJ,CAAC,EAAE,CAACA,SAAS,CAAC,CAAC;EAEf,OAAOE,YAAY;AACvB,CAAC","ignoreList":[]}
@@ -1,9 +1,10 @@
1
1
  import { MutableRefObject } from 'react';
2
2
  export declare enum ContainerAnchor {
3
- TAPP = ".tapp",
4
3
  BODY = "body",
5
4
  DIALOG = ".dialog-inner",
6
- PAGE = ".page-provider"
5
+ PAGE = ".page-provider",
6
+ TAPP = ".tapp",
7
+ WALLET = ".wallet"
7
8
  }
8
9
  interface UseContainerProps {
9
10
  ref?: MutableRefObject<HTMLDivElement | HTMLLabelElement | HTMLSpanElement | null>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@chayns-components/core",
3
- "version": "5.0.0-beta.1173",
3
+ "version": "5.0.0-beta.1175",
4
4
  "description": "A set of beautiful React components for developing your own applications with chayns.",
5
5
  "sideEffects": false,
6
6
  "browserslist": [
@@ -73,7 +73,6 @@
73
73
  "@chayns/colors": "^2.0.0",
74
74
  "@chayns/uac-service": "~0.0.58",
75
75
  "clsx": "^2.1.1",
76
- "react-resize-detector": "^12.1.0",
77
76
  "uuid": "^10.0.0"
78
77
  },
79
78
  "peerDependencies": {
@@ -86,5 +85,5 @@
86
85
  "publishConfig": {
87
86
  "access": "public"
88
87
  },
89
- "gitHead": "8f50953689840c348169f8b0856114ce5b18c695"
88
+ "gitHead": "94d81c96405e6cb3140ac01b5446b5f3fffc9ccc"
90
89
  }