@chayns-components/core 5.0.0-beta.28 → 5.0.0-beta.288

package/lib/components/list/List.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/list/List.tsx"],"names":["ListContext","React","createContext","incrementExpandableItemCount","isAnyItemExpandable","openItemUuid","undefined","updateOpenItemUuid","displayName","List","children","setOpenItemUuid","expandableItemCount","setExpandableItemCount","uuid","shouldOnlyOpen","currentOpenItemUuid","count","providerValue"],"mappings":";;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;AASO,IAAMA,WAAW,gBAAGC,eAAMC,aAAN,CAAkC;AACzDC,EAAAA,4BAA4B,EAAE;AAAA,WAAM,YAAM,CAAE,CAAd;AAAA,GAD2B;AAEzDC,EAAAA,mBAAmB,EAAE,KAFoC;AAGzDC,EAAAA,YAAY,EAAEC,SAH2C;AAIzDC,EAAAA,kBAAkB,EAAE,8BAAM,CAAE;AAJ6B,CAAlC,CAApB;;;AAOPP,WAAW,CAACQ,WAAZ,GAA0B,aAA1B;;AASA,IAAMC,IAAmB,GAAG,SAAtBA,IAAsB,OAAkB;AAAA,MAAfC,QAAe,QAAfA,QAAe;;AAC1C,kBAAwC,qBAAuCJ,SAAvC,CAAxC;AAAA;AAAA,MAAOD,YAAP;AAAA,MAAqBM,eAArB;;AACA,mBAAsD,qBAAiB,CAAjB,CAAtD;AAAA;AAAA,MAAOC,mBAAP;AAAA,MAA4BC,sBAA5B;;AAEA,MAAMN,kBAAkB,GAAG,wBACvB,UAACO,IAAD,EAAmC;AAAA,oFAAP,EAAO;AAAA,QAA1BC,cAA0B,SAA1BA,cAA0B;;AAC/BJ,IAAAA,eAAe,CAAC,UAACK,mBAAD,EAAyB;AACrC,UAAIA,mBAAmB,KAAKF,IAAxB,IAAgCC,cAAc,KAAK,IAAvD,EAA6D;AACzD,eAAOT,SAAP;AACH;;AAED,aAAOQ,IAAP;AACH,KANc,CAAf;AAOH,GATsB,EAUvB,CAACH,eAAD,CAVuB,CAA3B;AAaA,MAAMR,4BAA4B,GAAG,wBAAY,YAAM;AACnDU,IAAAA,sBAAsB,CAAC,UAACI,KAAD;AAAA,aAAWA,KAAK,GAAG,CAAnB;AAAA,KAAD,CAAtB;AAEA,WAAO,YAAM;AACTJ,MAAAA,sBAAsB,CAAC,UAACI,KAAD;AAAA,eAAWA,KAAK,GAAG,CAAnB;AAAA,OAAD,CAAtB;AACH,KAFD;AAGH,GANoC,EAMlC,CAACJ,sBAAD,CANkC,CAArC;AAQA,MAAMK,aAAa,GAAG,oBAClB;AAAA,WAAO;AACHd,MAAAA,mBAAmB,EAAEQ,mBAAmB,GAAG,CADxC;AAEHL,MAAAA,kBAAkB,EAAlBA,kBAFG;AAGHF,MAAAA,YAAY,EAAZA,YAHG;AAIHF,MAAAA,4BAA4B,EAA5BA;AAJG,KAAP;AAAA,GADkB,EAOlB,CAACS,mBAAD,EAAsBT,4BAAtB,EAAoDE,YAApD,EAAkEE,kBAAlE,CAPkB,CAAtB;AAUA,sBAAO,6BAAC,WAAD,CAAa,QAAb;AAAsB,IAAA,KAAK,EAAEW;AAA7B,KAA6CR,QAA7C,CAAP;AACH,CApCD;;AAsCAD,IAAI,CAACD,WAAL,GAAmB,MAAnB;eAEeC,I","sourcesContent":["import React, { FC, ReactNode, useCallback, useMemo, useState } from 'react';\n\ninterface IListContext {\n    incrementExpandableItemCount: () => () => void;\n    isAnyItemExpandable: boolean;\n    openItemUuid: string | undefined;\n    updateOpenItemUuid: (uuid: string, options?: { shouldOnlyOpen?: boolean }) => void;\n}\n\nexport const ListContext = React.createContext<IListContext>({\n    incrementExpandableItemCount: () => () => {},\n    isAnyItemExpandable: false,\n    openItemUuid: undefined,\n    updateOpenItemUuid: () => {},\n});\n\nListContext.displayName = 'ListContext';\n\ntype ListProps = {\n    /**\n     * The items of the list\n     */\n    children: ReactNode;\n};\n\nconst List: FC<ListProps> = ({ children }) => {\n    const [openItemUuid, setOpenItemUuid] = useState<IListContext['openItemUuid']>(undefined);\n    const [expandableItemCount, setExpandableItemCount] = useState<number>(0);\n\n    const updateOpenItemUuid = useCallback<IListContext['updateOpenItemUuid']>(\n        (uuid, { shouldOnlyOpen } = {}) => {\n            setOpenItemUuid((currentOpenItemUuid) => {\n                if (currentOpenItemUuid === uuid && shouldOnlyOpen !== true) {\n                    return undefined;\n                }\n\n                return uuid;\n            });\n        },\n        [setOpenItemUuid]\n    );\n\n    const incrementExpandableItemCount = useCallback(() => {\n        setExpandableItemCount((count) => count + 1);\n\n        return () => {\n            setExpandableItemCount((count) => count - 1);\n        };\n    }, [setExpandableItemCount]);\n\n    const providerValue = useMemo<IListContext>(\n        () => ({\n            isAnyItemExpandable: expandableItemCount > 0,\n            updateOpenItemUuid,\n            openItemUuid,\n            incrementExpandableItemCount,\n        }),\n        [expandableItemCount, incrementExpandableItemCount, openItemUuid, updateOpenItemUuid]\n    );\n\n    return <ListContext.Provider value={providerValue}>{children}</ListContext.Provider>;\n};\n\nList.displayName = 'List';\n\nexport default List;\n"],"file":"List.js"}
+{"version":3,"file":"List.js","names":["_react","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","ListContext","exports","React","createContext","incrementExpandableItemCount","isAnyItemExpandable","openItemUuid","undefined","updateOpenItemUuid","displayName","List","_ref","children","setOpenItemUuid","useState","expandableItemCount","setExpandableItemCount","useCallback","uuid","shouldOnlyOpen","arguments","length","currentOpenItemUuid","count","providerValue","useMemo","createElement","Provider","value","_default"],"sources":["../../../src/components/list/List.tsx"],"sourcesContent":["import React, { FC, ReactNode, useCallback, useMemo, useState } from 'react';\n\ninterface IListContext {\n    incrementExpandableItemCount: () => () => void;\n    isAnyItemExpandable: boolean;\n    openItemUuid: string | undefined;\n    updateOpenItemUuid: (uuid: string, options?: { shouldOnlyOpen?: boolean }) => void;\n}\n\nexport const ListContext = React.createContext<IListContext>({\n    incrementExpandableItemCount: () => () => {},\n    isAnyItemExpandable: false,\n    openItemUuid: undefined,\n    updateOpenItemUuid: () => {},\n});\n\nListContext.displayName = 'ListContext';\n\ntype ListProps = {\n    /**\n     * The items of the list\n     */\n    children: ReactNode;\n};\n\nconst List: FC<ListProps> = ({ children }) => {\n    const [openItemUuid, setOpenItemUuid] = useState<IListContext['openItemUuid']>(undefined);\n    const [expandableItemCount, setExpandableItemCount] = useState<number>(0);\n\n    const updateOpenItemUuid = useCallback<IListContext['updateOpenItemUuid']>(\n        (uuid, { shouldOnlyOpen } = {}) => {\n            setOpenItemUuid((currentOpenItemUuid) => {\n                if (currentOpenItemUuid === uuid && shouldOnlyOpen !== true) {\n                    return undefined;\n                }\n\n                return uuid;\n            });\n        },\n        [setOpenItemUuid]\n    );\n\n    const incrementExpandableItemCount = useCallback(() => {\n        setExpandableItemCount((count) => count + 1);\n\n        return () => {\n            setExpandableItemCount((count) => count - 1);\n        };\n    }, [setExpandableItemCount]);\n\n    const providerValue = useMemo<IListContext>(\n        () => ({\n            isAnyItemExpandable: expandableItemCount > 0,\n            updateOpenItemUuid,\n            openItemUuid,\n            incrementExpandableItemCount,\n        }),\n        [expandableItemCount, incrementExpandableItemCount, openItemUuid, updateOpenItemUuid]\n    );\n\n    return <ListContext.Provider value={providerValue}>{children}</ListContext.Provider>;\n};\n\nList.displayName = 'List';\n\nexport default List;\n"],"mappings":"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"}

package/lib/components/list/list-item/ListItem.d.ts

@@ -1,5 +1,5 @@
 import { FC, MouseEventHandler, ReactNode, TouchEventHandler } from 'react';
-declare type ListItemProps = {
+type ListItemProps = {
     /**
      * The content of the `ListItem` body. When the `ListItem` has children,
      * it can be opened and also gets an icon as an indicator automatically.
@@ -26,6 +26,10 @@ declare type ListItemProps = {
      * This can be used to automatically expand the `ListItem` during the first render.
      */
     isDefaultOpen?: boolean;
+    /**
+     * This overrides the internal opening state of the item and makes it controlled.
+     */
+    isOpen?: boolean;
     /**
      * Function to be executed when the header of the `ListItem` was clicked
      */
@@ -35,6 +39,11 @@ declare type ListItemProps = {
      * 400 milliseconds.
      */
     onLongPress?: TouchEventHandler<HTMLDivElement>;
+    /**
+     * Elements that are displayed on the left side of the header. If multiple
+     * elements are specified, they are displayed one aside the other.
+     */
+    leftElements?: [ReactNode, ...ReactNode[]];
     /**
      * Elements that are displayed on the right side of the header. If multiple
      * elements are specified, they are displayed one below the other.

package/lib/components/list/list-item/ListItem.js

@@ -1,73 +1,61 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _framerMotion = require("framer-motion");
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _uuid = require("../../../hooks/uuid");
-
 var _List = require("../List");
-
 var _ListItemBody = _interopRequireDefault(require("./list-item-body/ListItemBody"));
-
 var _ListItemHead = _interopRequireDefault(require("./list-item-head/ListItemHead"));
-
 var _ListItem = require("./ListItem.styles");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-var ListItem = function ListItem(_ref) {
-  var children = _ref.children,
-      hoverItem = _ref.hoverItem,
-      icons = _ref.icons,
-      images = _ref.images,
-      isDefaultOpen = _ref.isDefaultOpen,
-      onClick = _ref.onClick,
-      onLongPress = _ref.onLongPress,
-      rightElements = _ref.rightElements,
-      subtitle = _ref.subtitle,
-      shouldShowRoundImage = _ref.shouldShowRoundImage,
-      title = _ref.title;
-
-  var _useContext = (0, _react.useContext)(_List.ListContext),
-      incrementExpandableItemCount = _useContext.incrementExpandableItemCount,
-      isAnyItemExpandable = _useContext.isAnyItemExpandable,
-      openItemUuid = _useContext.openItemUuid,
-      updateOpenItemUuid = _useContext.updateOpenItemUuid;
-
-  var uuid = (0, _uuid.useUuid)();
-  var isExpandable = children !== undefined;
-  var isOpen = openItemUuid === uuid;
-  var handleHeadClick = (0, _react.useCallback)(function (event) {
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const ListItem = _ref => {
+  let {
+    children,
+    hoverItem,
+    icons,
+    images,
+    isDefaultOpen,
+    isOpen,
+    onClick,
+    onLongPress,
+    leftElements,
+    rightElements,
+    subtitle,
+    shouldShowRoundImage,
+    title
+  } = _ref;
+  const {
+    incrementExpandableItemCount,
+    isAnyItemExpandable,
+    openItemUuid,
+    updateOpenItemUuid
+  } = (0, _react.useContext)(_List.ListContext);
+  const uuid = (0, _uuid.useUuid)();
+  const isExpandable = children !== undefined;
+  const isItemOpen = isOpen !== null && isOpen !== void 0 ? isOpen : openItemUuid === uuid;
+  const handleHeadClick = (0, _react.useCallback)(event => {
     if (isExpandable) {
       updateOpenItemUuid(uuid);
     }
-
     if (typeof onClick === 'function') {
       onClick(event);
     }
   }, [isExpandable, onClick, updateOpenItemUuid, uuid]);
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     if (isExpandable) {
       // The incrementExpandableItemCount function returns an cleanup
       // function to decrement expandableItemCount if component unmounts
       return incrementExpandableItemCount();
     }
-
     return undefined;
   }, [incrementExpandableItemCount, isExpandable]);
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     if (isDefaultOpen) {
       updateOpenItemUuid(uuid, {
         shouldOnlyOpen: true
@@ -77,26 +65,27 @@ var ListItem = function ListItem(_ref) {
   return /*#__PURE__*/_react.default.createElement(_ListItem.StyledListItem, {
     className: "beta-chayns-list-item",
     isClickable: typeof onClick === 'function' || isExpandable,
-    isOpen: isOpen
+    isOpen: isItemOpen
   }, /*#__PURE__*/_react.default.createElement(_ListItemHead.default, {
     hoverItem: hoverItem,
     icons: icons,
     images: images,
     isAnyItemExpandable: isAnyItemExpandable,
     isExpandable: isExpandable,
-    isOpen: isOpen,
+    isOpen: isItemOpen,
     onClick: handleHeadClick,
     onLongPress: onLongPress,
+    leftElements: leftElements,
     rightElements: rightElements,
     subtitle: subtitle,
     shouldShowRoundImage: shouldShowRoundImage,
     title: title
   }), /*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
     initial: false
-  }, isExpandable && isOpen && /*#__PURE__*/_react.default.createElement(_ListItemBody.default, null, children)));
+  }, isExpandable && isItemOpen && /*#__PURE__*/_react.default.createElement(_ListItemBody.default, {
+    id: uuid
+  }, children)));
 };
-
 ListItem.displayName = 'ListItem';
-var _default = ListItem;
-exports.default = _default;
+var _default = exports.default = ListItem;
 //# sourceMappingURL=ListItem.js.map

package/lib/components/list/list-item/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/list/list-item/ListItem.tsx"],"names":["ListItem","children","hoverItem","icons","images","isDefaultOpen","onClick","onLongPress","rightElements","subtitle","shouldShowRoundImage","title","ListContext","incrementExpandableItemCount","isAnyItemExpandable","openItemUuid","updateOpenItemUuid","uuid","isExpandable","undefined","isOpen","handleHeadClick","event","shouldOnlyOpen","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AASA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AA0DA,IAAMA,QAA2B,GAAG,SAA9BA,QAA8B,OAY9B;AAAA,MAXFC,QAWE,QAXFA,QAWE;AAAA,MAVFC,SAUE,QAVFA,SAUE;AAAA,MATFC,KASE,QATFA,KASE;AAAA,MARFC,MAQE,QARFA,MAQE;AAAA,MAPFC,aAOE,QAPFA,aAOE;AAAA,MANFC,OAME,QANFA,OAME;AAAA,MALFC,WAKE,QALFA,WAKE;AAAA,MAJFC,aAIE,QAJFA,aAIE;AAAA,MAHFC,QAGE,QAHFA,QAGE;AAAA,MAFFC,oBAEE,QAFFA,oBAEE;AAAA,MADFC,KACE,QADFA,KACE;;AACF,oBACI,uBAAWC,iBAAX,CADJ;AAAA,MAAQC,4BAAR,eAAQA,4BAAR;AAAA,MAAsCC,mBAAtC,eAAsCA,mBAAtC;AAAA,MAA2DC,YAA3D,eAA2DA,YAA3D;AAAA,MAAyEC,kBAAzE,eAAyEA,kBAAzE;;AAGA,MAAMC,IAAI,GAAG,oBAAb;AAEA,MAAMC,YAAY,GAAGjB,QAAQ,KAAKkB,SAAlC;AACA,MAAMC,MAAM,GAAGL,YAAY,KAAKE,IAAhC;AAEA,MAAMI,eAAe,GAAG,wBACpB,UAACC,KAAD,EAAW;AACP,QAAIJ,YAAJ,EAAkB;AACdF,MAAAA,kBAAkB,CAACC,IAAD,CAAlB;AACH;;AAED,QAAI,OAAOX,OAAP,KAAmB,UAAvB,EAAmC;AAC/BA,MAAAA,OAAO,CAACgB,KAAD,CAAP;AACH;AACJ,GATmB,EAUpB,CAACJ,YAAD,EAAeZ,OAAf,EAAwBU,kBAAxB,EAA4CC,IAA5C,CAVoB,CAAxB;AAaA,wBAAU,YAAM;AACZ,QAAIC,YAAJ,EAAkB;AACd;AACA;AACA,aAAOL,4BAA4B,EAAnC;AACH;;AAED,WAAOM,SAAP;AACH,GARD,EAQG,CAACN,4BAAD,EAA+BK,YAA/B,CARH;AAUA,wBAAU,YAAM;AACZ,QAAIb,aAAJ,EAAmB;AACfW,MAAAA,kBAAkB,CAACC,IAAD,EAAO;AAAEM,QAAAA,cAAc,EAAE;AAAlB,OAAP,CAAlB;AACH;AACJ,GAJD,EAIG,CAAClB,aAAD,EAAgBW,kBAAhB,EAAoCC,IAApC,CAJH;AAMA,sBACI,6BAAC,wBAAD;AACI,IAAA,SAAS,EAAC,uBADd;AAEI,IAAA,WAAW,EAAE,OAAOX,OAAP,KAAmB,UAAnB,IAAiCY,YAFlD;AAGI,IAAA,MAAM,EAAEE;AAHZ,kBAKI,6BAAC,qBAAD;AACI,IAAA,SAAS,EAAElB,SADf;AAEI,IAAA,KAAK,EAAEC,KAFX;AAGI,IAAA,MAAM,EAAEC,MAHZ;AAII,IAAA,mBAAmB,EAAEU,mBAJzB;AAKI,IAAA,YAAY,EAAEI,YALlB;AAMI,IAAA,MAAM,EAAEE,MANZ;AAOI,IAAA,OAAO,EAAEC,eAPb;AAQI,IAAA,WAAW,EAAEd,WARjB;AASI,IAAA,aAAa,EAAEC,aATnB;AAUI,IAAA,QAAQ,EAAEC,QAVd;AAWI,IAAA,oBAAoB,EAAEC,oBAX1B;AAYI,IAAA,KAAK,EAAEC;AAZX,IALJ,eAmBI,6BAAC,6BAAD;AAAiB,IAAA,OAAO,EAAE;AAA1B,KACKO,YAAY,IAAIE,MAAhB,iBAA0B,6BAAC,qBAAD,QAAenB,QAAf,CAD/B,CAnBJ,CADJ;AAyBH,CA3ED;;AA6EAD,QAAQ,CAACwB,WAAT,GAAuB,UAAvB;eAEexB,Q","sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, {\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useContext,\n    useEffect,\n} from 'react';\nimport { useUuid } from '../../../hooks/uuid';\nimport { ListContext } from '../List';\nimport ListItemBody from './list-item-body/ListItemBody';\nimport ListItemHead from './list-item-head/ListItemHead';\nimport { StyledListItem } from './ListItem.styles';\n\ntype ListItemProps = {\n    /**\n     * The content of the `ListItem` body. When the `ListItem` has children,\n     * it can be opened and also gets an icon as an indicator automatically.\n     */\n    children?: ReactNode;\n    /**\n     * Element that is displayed when hovering over the `ListItem` on the right\n     * side. On mobile devices, this element is not displayed.\n     */\n    hoverItem?: ReactNode;\n    /**\n     * The FontAwesome or tobit icons to render like an image on the left side\n     * of the header. Multiple icons are stacked. See the `Icon` component\n     * documentation for more information.\n     */\n    icons?: string[];\n    /**\n     * A list of image URLs that are displayed on the left side of the header.\n     * If multiple URLs are passed, the image is assembled from the first three\n     * image URLs as a puzzle.\n     */\n    images?: string[];\n    /**\n     * This can be used to automatically expand the `ListItem` during the first render.\n     */\n    isDefaultOpen?: boolean;\n    /**\n     * Function to be executed when the header of the `ListItem` was clicked\n     */\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Function to be executed when the header of the `ListItem` is pressed for\n     * 400 milliseconds.\n     */\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    /**\n     * Elements that are displayed on the right side of the header. If multiple\n     * elements are specified, they are displayed one below the other.\n     */\n    rightElements?: [ReactNode, ...ReactNode[]];\n    /**\n     * Images of users should always be displayed in a round shape. Therefore\n     * this property can be set to true.\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Subtitle of the `ListItem` displayed in the head below the title\n     */\n    subtitle?: ReactNode;\n    /**\n     * Title of the `ListItem` displayed in the head\n     */\n    title: ReactNode;\n};\n\nconst ListItem: FC<ListItemProps> = ({\n    children,\n    hoverItem,\n    icons,\n    images,\n    isDefaultOpen,\n    onClick,\n    onLongPress,\n    rightElements,\n    subtitle,\n    shouldShowRoundImage,\n    title,\n}) => {\n    const { incrementExpandableItemCount, isAnyItemExpandable, openItemUuid, updateOpenItemUuid } =\n        useContext(ListContext);\n\n    const uuid = useUuid();\n\n    const isExpandable = children !== undefined;\n    const isOpen = openItemUuid === uuid;\n\n    const handleHeadClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n        (event) => {\n            if (isExpandable) {\n                updateOpenItemUuid(uuid);\n            }\n\n            if (typeof onClick === 'function') {\n                onClick(event);\n            }\n        },\n        [isExpandable, onClick, updateOpenItemUuid, uuid]\n    );\n\n    useEffect(() => {\n        if (isExpandable) {\n            // The incrementExpandableItemCount function returns an cleanup\n            // function to decrement expandableItemCount if component unmounts\n            return incrementExpandableItemCount();\n        }\n\n        return undefined;\n    }, [incrementExpandableItemCount, isExpandable]);\n\n    useEffect(() => {\n        if (isDefaultOpen) {\n            updateOpenItemUuid(uuid, { shouldOnlyOpen: true });\n        }\n    }, [isDefaultOpen, updateOpenItemUuid, uuid]);\n\n    return (\n        <StyledListItem\n            className=\"beta-chayns-list-item\"\n            isClickable={typeof onClick === 'function' || isExpandable}\n            isOpen={isOpen}\n        >\n            <ListItemHead\n                hoverItem={hoverItem}\n                icons={icons}\n                images={images}\n                isAnyItemExpandable={isAnyItemExpandable}\n                isExpandable={isExpandable}\n                isOpen={isOpen}\n                onClick={handleHeadClick}\n                onLongPress={onLongPress}\n                rightElements={rightElements}\n                subtitle={subtitle}\n                shouldShowRoundImage={shouldShowRoundImage}\n                title={title}\n            />\n            <AnimatePresence initial={false}>\n                {isExpandable && isOpen && <ListItemBody>{children}</ListItemBody>}\n            </AnimatePresence>\n        </StyledListItem>\n    );\n};\n\nListItem.displayName = 'ListItem';\n\nexport default ListItem;\n"],"file":"ListItem.js"}
+{"version":3,"file":"ListItem.js","names":["_framerMotion","require","_react","_interopRequireWildcard","_uuid","_List","_ListItemBody","_interopRequireDefault","_ListItemHead","_ListItem","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","ListItem","_ref","children","hoverItem","icons","images","isDefaultOpen","isOpen","onClick","onLongPress","leftElements","rightElements","subtitle","shouldShowRoundImage","title","incrementExpandableItemCount","isAnyItemExpandable","openItemUuid","updateOpenItemUuid","useContext","ListContext","uuid","useUuid","isExpandable","undefined","isItemOpen","handleHeadClick","useCallback","event","useEffect","shouldOnlyOpen","createElement","StyledListItem","className","isClickable","AnimatePresence","initial","id","displayName","_default","exports"],"sources":["../../../../src/components/list/list-item/ListItem.tsx"],"sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, {\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useContext,\n    useEffect,\n} from 'react';\nimport { useUuid } from '../../../hooks/uuid';\nimport { ListContext } from '../List';\nimport ListItemBody from './list-item-body/ListItemBody';\nimport ListItemHead from './list-item-head/ListItemHead';\nimport { StyledListItem } from './ListItem.styles';\n\ntype ListItemProps = {\n    /**\n     * The content of the `ListItem` body. When the `ListItem` has children,\n     * it can be opened and also gets an icon as an indicator automatically.\n     */\n    children?: ReactNode;\n    /**\n     * Element that is displayed when hovering over the `ListItem` on the right\n     * side. On mobile devices, this element is not displayed.\n     */\n    hoverItem?: ReactNode;\n    /**\n     * The FontAwesome or tobit icons to render like an image on the left side\n     * of the header. Multiple icons are stacked. See the `Icon` component\n     * documentation for more information.\n     */\n    icons?: string[];\n    /**\n     * A list of image URLs that are displayed on the left side of the header.\n     * If multiple URLs are passed, the image is assembled from the first three\n     * image URLs as a puzzle.\n     */\n    images?: string[];\n    /**\n     * This can be used to automatically expand the `ListItem` during the first render.\n     */\n    isDefaultOpen?: boolean;\n    /**\n     * This overrides the internal opening state of the item and makes it controlled.\n     */\n    isOpen?: boolean;\n    /**\n     * Function to be executed when the header of the `ListItem` was clicked\n     */\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Function to be executed when the header of the `ListItem` is pressed for\n     * 400 milliseconds.\n     */\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    /**\n     * Elements that are displayed on the left side of the header. If multiple\n     * elements are specified, they are displayed one aside the other.\n     */\n    leftElements?: [ReactNode, ...ReactNode[]];\n    /**\n     * Elements that are displayed on the right side of the header. If multiple\n     * elements are specified, they are displayed one below the other.\n     */\n    rightElements?: [ReactNode, ...ReactNode[]];\n    /**\n     * Images of users should always be displayed in a round shape. Therefore\n     * this property can be set to true.\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Subtitle of the `ListItem` displayed in the head below the title\n     */\n    subtitle?: ReactNode;\n    /**\n     * Title of the `ListItem` displayed in the head\n     */\n    title: ReactNode;\n};\n\nconst ListItem: FC<ListItemProps> = ({\n    children,\n    hoverItem,\n    icons,\n    images,\n    isDefaultOpen,\n    isOpen,\n    onClick,\n    onLongPress,\n    leftElements,\n    rightElements,\n    subtitle,\n    shouldShowRoundImage,\n    title,\n}) => {\n    const { incrementExpandableItemCount, isAnyItemExpandable, openItemUuid, updateOpenItemUuid } =\n        useContext(ListContext);\n\n    const uuid = useUuid();\n\n    const isExpandable = children !== undefined;\n    const isItemOpen = isOpen ?? openItemUuid === uuid;\n\n    const handleHeadClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n        (event) => {\n            if (isExpandable) {\n                updateOpenItemUuid(uuid);\n            }\n\n            if (typeof onClick === 'function') {\n                onClick(event);\n            }\n        },\n        [isExpandable, onClick, updateOpenItemUuid, uuid]\n    );\n\n    useEffect(() => {\n        if (isExpandable) {\n            // The incrementExpandableItemCount function returns an cleanup\n            // function to decrement expandableItemCount if component unmounts\n            return incrementExpandableItemCount();\n        }\n\n        return undefined;\n    }, [incrementExpandableItemCount, isExpandable]);\n\n    useEffect(() => {\n        if (isDefaultOpen) {\n            updateOpenItemUuid(uuid, { shouldOnlyOpen: true });\n        }\n    }, [isDefaultOpen, updateOpenItemUuid, uuid]);\n\n    return (\n        <StyledListItem\n            className=\"beta-chayns-list-item\"\n            isClickable={typeof onClick === 'function' || isExpandable}\n            isOpen={isItemOpen}\n        >\n            <ListItemHead\n                hoverItem={hoverItem}\n                icons={icons}\n                images={images}\n                isAnyItemExpandable={isAnyItemExpandable}\n                isExpandable={isExpandable}\n                isOpen={isItemOpen}\n                onClick={handleHeadClick}\n                onLongPress={onLongPress}\n                leftElements={leftElements}\n                rightElements={rightElements}\n                subtitle={subtitle}\n                shouldShowRoundImage={shouldShowRoundImage}\n                title={title}\n            />\n            <AnimatePresence initial={false}>\n                {isExpandable && isItemOpen && <ListItemBody id={uuid}>{children}</ListItemBody>}\n            </AnimatePresence>\n        </StyledListItem>\n    );\n};\n\nListItem.displayName = 'ListItem';\n\nexport default ListItem;\n"],"mappings":"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"}

package/lib/components/list/list-item/ListItem.styles.js

@@ -1,38 +1,55 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.StyledListItem = void 0;
-
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-
-var _templateObject, _templateObject2, _templateObject3;
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-var StyledListItem = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    ", "\n\n    transition: background-color 0.3s ease;\n\n    ", "\n\n    :not(:last-child) {\n        border-bottom: 1px solid ", ";\n    }\n"])), function (_ref) {
-  var isOpen = _ref.isOpen;
-  return isOpen && (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n            background-color: rgba(", ", 0.85);\n        "])), function (_ref2) {
-    var theme = _ref2.theme;
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const StyledListItem = exports.StyledListItem = _styledComponents.default.div`
+    ${_ref => {
+  let {
+    isOpen
+  } = _ref;
+  return isOpen && (0, _styledComponents.css)`
+            background-color: rgba(${_ref2 => {
+    let {
+      theme
+    } = _ref2;
     return theme['100-rgb'];
-  });
-}, function (_ref3) {
-  var isClickable = _ref3.isClickable;
-  return isClickable && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n            :hover {\n                background-color: rgba(\n                    ", ",\n                    0.85\n                );\n            }\n        "])), function (_ref4) {
-    var theme = _ref4.theme;
+  }}, 0.85);
+        `;
+}}
+
+    transition: background-color 0.3s ease;
+
+    ${_ref3 => {
+  let {
+    isClickable
+  } = _ref3;
+  return isClickable && (0, _styledComponents.css)`
+            :hover {
+                background-color: rgba(
+                    ${_ref4 => {
+    let {
+      theme
+    } = _ref4;
     return theme['100-rgb'];
-  });
-}, function (_ref5) {
-  var theme = _ref5.theme;
+  }},
+                    0.85
+                );
+            }
+        `;
+}}
+
+    :not(:last-child) {
+        border-bottom: 1px solid ${_ref5 => {
+  let {
+    theme
+  } = _ref5;
   return theme.headline;
-});
-
-exports.StyledListItem = StyledListItem;
+}};
+    }
+`;
 //# sourceMappingURL=ListItem.styles.js.map

package/lib/components/list/list-item/ListItem.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/list/list-item/ListItem.styles.ts"],"names":["StyledListItem","styled","div","isOpen","css","theme","isClickable","headline"],"mappings":";;;;;;;;;AAAA;;;;;;;;;;AAQO,IAAMA,cAAc,GAAGC,0BAAOC,GAAV,uNACrB;AAAA,MAAGC,MAAH,QAAGA,MAAH;AAAA,SACEA,MAAM,QACNC,qBADM,oIAEuB;AAAA,QAAGC,KAAH,SAAGA,KAAH;AAAA,WAAoCA,KAAK,CAAC,SAAD,CAAzC;AAAA,GAFvB,CADR;AAAA,CADqB,EASrB;AAAA,MAAGC,WAAH,SAAGA,WAAH;AAAA,SACEA,WAAW,QACXF,qBADW,0OAIG;AAAA,QAAGC,KAAH,SAAGA,KAAH;AAAA,WAAoCA,KAAK,CAAC,SAAD,CAAzC;AAAA,GAJH,CADb;AAAA,CATqB,EAqBQ;AAAA,MAAGA,KAAH,SAAGA,KAAH;AAAA,SAAoCA,KAAK,CAACE,QAA1C;AAAA,CArBR,CAApB","sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemProps = WithTheme<{\n    isClickable: boolean;\n    isOpen: boolean;\n}>;\n\nexport const StyledListItem = styled.div<StyledListItemProps>`\n    ${({ isOpen }) =>\n        isOpen &&\n        css`\n            background-color: rgba(${({ theme }: StyledListItemProps) => theme['100-rgb']}, 0.85);\n        `}\n\n    transition: background-color 0.3s ease;\n\n    ${({ isClickable }) =>\n        isClickable &&\n        css`\n            :hover {\n                background-color: rgba(\n                    ${({ theme }: StyledListItemProps) => theme['100-rgb']},\n                    0.85\n                );\n            }\n        `}\n\n    :not(:last-child) {\n        border-bottom: 1px solid ${({ theme }: StyledListItemProps) => theme.headline};\n    }\n`;\n"],"file":"ListItem.styles.js"}
+{"version":3,"file":"ListItem.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledListItem","exports","styled","div","_ref","isOpen","css","_ref2","theme","_ref3","isClickable","_ref4","_ref5","headline"],"sources":["../../../../src/components/list/list-item/ListItem.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemProps = WithTheme<{\n    isClickable: boolean;\n    isOpen: boolean;\n}>;\n\nexport const StyledListItem = styled.div<StyledListItemProps>`\n    ${({ isOpen }) =>\n        isOpen &&\n        css`\n            background-color: rgba(${({ theme }: StyledListItemProps) => theme['100-rgb']}, 0.85);\n        `}\n\n    transition: background-color 0.3s ease;\n\n    ${({ isClickable }) =>\n        isClickable &&\n        css`\n            :hover {\n                background-color: rgba(\n                    ${({ theme }: StyledListItemProps) => theme['100-rgb']},\n                    0.85\n                );\n            }\n        `}\n\n    :not(:last-child) {\n        border-bottom: 1px solid ${({ theme }: StyledListItemProps) => theme.headline};\n    }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAQzC,MAAMY,cAAc,GAAAC,OAAA,CAAAD,cAAA,GAAGE,yBAAM,CAACC,GAAyB;AAC9D,MAAMC,IAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,IAAA;EAAA,OACTC,MAAM,IACN,IAAAC,qBAAG,CAAC;AACZ,qCAAqCC,KAAA;IAAA,IAAC;MAAEC;IAA2B,CAAC,GAAAD,KAAA;IAAA,OAAKC,KAAK,CAAC,SAAS,CAAC;EAAA,CAAC;AAC1F,SAAS;AAAA,CAAC;AACV;AACA;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,KAAA;EAAA,OACdC,WAAW,IACX,IAAAJ,qBAAG,CAAC;AACZ;AACA;AACA,sBAAsBK,KAAA;IAAA,IAAC;MAAEH;IAA2B,CAAC,GAAAG,KAAA;IAAA,OAAKH,KAAK,CAAC,SAAS,CAAC;EAAA,CAAC;AAC3E;AACA;AACA;AACA,SAAS;AAAA,CAAC;AACV;AACA;AACA,mCAAmCI,KAAA;EAAA,IAAC;IAAEJ;EAA2B,CAAC,GAAAI,KAAA;EAAA,OAAKJ,KAAK,CAACK,QAAQ;AAAA,CAAC;AACtF;AACA,CAAC"}

package/lib/components/list/list-item/list-item-body/ListItemBody.d.ts

@@ -1,3 +1,6 @@
 import { FC } from 'react';
-declare const ListItemBody: FC;
+interface ListItemBodyProps {
+    id: string;
+}
+declare const ListItemBody: FC<ListItemBodyProps>;
 export default ListItemBody;

package/lib/components/list/list-item/list-item-body/ListItemBody.js

@@ -4,18 +4,36 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
+var _react = _interopRequireWildcard(require("react"));
 var _ListItemBody = require("./ListItemBody.styles");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var ListItemBody = function ListItemBody(_ref) {
-  var children = _ref.children;
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const ListItemBody = _ref => {
+  let {
+    children,
+    id
+  } = _ref;
+  const containerRef = (0, _react.useRef)(null);
+  const [height, setHeight] = (0, _react.useState)('auto');
+  (0, _react.useEffect)(() => {
+    if (containerRef.current) {
+      const resizeObserver = new ResizeObserver(entries => {
+        if (entries && entries[0]) {
+          const observedHeight = entries[0].contentRect.height;
+          setHeight(observedHeight);
+        }
+      });
+      resizeObserver.observe(containerRef.current);
+      return () => {
+        resizeObserver.disconnect();
+      };
+    }
+    return () => {};
+  }, []);
   return /*#__PURE__*/_react.default.createElement(_ListItemBody.StyledMotionListItemBody, {
+    key: id,
     animate: {
-      height: 'auto',
+      height,
       opacity: 1
     },
     className: "beta-chayns-list-item-body",
@@ -30,10 +48,10 @@ var ListItemBody = function ListItemBody(_ref) {
     transition: {
       type: 'tween'
     }
-  }, children);
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    ref: containerRef
+  }, children));
 };
-
 ListItemBody.displayName = 'ListItemBody';
-var _default = ListItemBody;
-exports.default = _default;
+var _default = exports.default = ListItemBody;
 //# sourceMappingURL=ListItemBody.js.map

package/lib/components/list/list-item/list-item-body/ListItemBody.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/list/list-item/list-item-body/ListItemBody.tsx"],"names":["ListItemBody","children","height","opacity","type","displayName"],"mappings":";;;;;;;AAAA;;AACA;;;;AAEA,IAAMA,YAAgB,GAAG,SAAnBA,YAAmB;AAAA,MAAGC,QAAH,QAAGA,QAAH;AAAA,sBACrB,6BAAC,sCAAD;AACI,IAAA,OAAO,EAAE;AAAEC,MAAAA,MAAM,EAAE,MAAV;AAAkBC,MAAAA,OAAO,EAAE;AAA3B,KADb;AAEI,IAAA,SAAS,EAAC,4BAFd;AAGI,IAAA,IAAI,EAAE;AAAED,MAAAA,MAAM,EAAE,CAAV;AAAaC,MAAAA,OAAO,EAAE;AAAtB,KAHV;AAII,IAAA,OAAO,EAAE;AAAED,MAAAA,MAAM,EAAE,CAAV;AAAaC,MAAAA,OAAO,EAAE;AAAtB,KAJb;AAKI,IAAA,UAAU,EAAE;AAAEC,MAAAA,IAAI,EAAE;AAAR;AALhB,KAOKH,QAPL,CADqB;AAAA,CAAzB;;AAYAD,YAAY,CAACK,WAAb,GAA2B,cAA3B;eAEeL,Y","sourcesContent":["import React, { FC } from 'react';\nimport { StyledMotionListItemBody } from './ListItemBody.styles';\n\nconst ListItemBody: FC = ({ children }) => (\n    <StyledMotionListItemBody\n        animate={{ height: 'auto', opacity: 1 }}\n        className=\"beta-chayns-list-item-body\"\n        exit={{ height: 0, opacity: 0 }}\n        initial={{ height: 0, opacity: 0 }}\n        transition={{ type: 'tween' }}\n    >\n        {children}\n    </StyledMotionListItemBody>\n);\n\nListItemBody.displayName = 'ListItemBody';\n\nexport default ListItemBody;\n"],"file":"ListItemBody.js"}
+{"version":3,"file":"ListItemBody.js","names":["_react","_interopRequireWildcard","require","_ListItemBody","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","ListItemBody","_ref","children","id","containerRef","useRef","height","setHeight","useState","useEffect","current","resizeObserver","ResizeObserver","entries","observedHeight","contentRect","observe","disconnect","createElement","StyledMotionListItemBody","key","animate","opacity","className","exit","initial","transition","type","ref","displayName","_default","exports"],"sources":["../../../../../src/components/list/list-item/list-item-body/ListItemBody.tsx"],"sourcesContent":["import React, { FC, useEffect, useRef, useState } from 'react';\nimport { StyledMotionListItemBody } from './ListItemBody.styles';\n\ninterface ListItemBodyProps {\n    id: string;\n}\n\nconst ListItemBody: FC<ListItemBodyProps> = ({ children, id }) => {\n    const containerRef = useRef<HTMLDivElement | null>(null);\n    const [height, setHeight] = useState<number | 'auto'>('auto');\n\n    useEffect(() => {\n        if (containerRef.current) {\n            const resizeObserver = new ResizeObserver((entries) => {\n                if (entries && entries[0]) {\n                    const observedHeight = entries[0].contentRect.height;\n                    setHeight(observedHeight);\n                }\n            });\n\n            resizeObserver.observe(containerRef.current);\n\n            return () => {\n                resizeObserver.disconnect();\n            };\n        }\n\n        return () => {};\n    }, []);\n\n    return (\n        <StyledMotionListItemBody\n            key={id}\n            animate={{ height, opacity: 1 }}\n            className=\"beta-chayns-list-item-body\"\n            exit={{ height: 0, opacity: 0 }}\n            initial={{ height: 0, opacity: 0 }}\n            transition={{ type: 'tween' }}\n        >\n            <div ref={containerRef}>{children}</div>\n        </StyledMotionListItemBody>\n    );\n};\n\nListItemBody.displayName = 'ListItemBody';\n\nexport default ListItemBody;\n"],"mappings":"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"}

package/lib/components/list/list-item/list-item-body/ListItemBody.styles.js

@@ -4,17 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.StyledMotionListItemBody = void 0;
-
 var _framerMotion = require("framer-motion");
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-var _templateObject;
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-var StyledMotionListItemBody = (0, _styledComponents.default)(_framerMotion.motion.div)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    overflow: hidden;\n"])));
-exports.StyledMotionListItemBody = StyledMotionListItemBody;
+const StyledMotionListItemBody = exports.StyledMotionListItemBody = (0, _styledComponents.default)(_framerMotion.motion.div)`
+    overflow: hidden;
+`;
 //# sourceMappingURL=ListItemBody.styles.js.map

package/lib/components/list/list-item/list-item-body/ListItemBody.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/list/list-item/list-item-body/ListItemBody.styles.ts"],"names":["StyledMotionListItemBody","motion","div"],"mappings":";;;;;;;AAAA;;AACA;;;;;;;;AAEO,IAAMA,wBAAwB,GAAG,+BAAOC,qBAAOC,GAAd,CAAH,8FAA9B","sourcesContent":["import { motion } from 'framer-motion';\nimport styled from 'styled-components';\n\nexport const StyledMotionListItemBody = styled(motion.div)`\n    overflow: hidden;\n`;\n"],"file":"ListItemBody.styles.js"}
+{"version":3,"file":"ListItemBody.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireDefault","obj","__esModule","default","StyledMotionListItemBody","exports","styled","motion","div"],"sources":["../../../../../src/components/list/list-item/list-item-body/ListItemBody.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled from 'styled-components';\n\nexport const StyledMotionListItemBody = styled(motion.div)`\n    overflow: hidden;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAAuC,SAAAE,uBAAAC,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAEhC,MAAMG,wBAAwB,GAAAC,OAAA,CAAAD,wBAAA,GAAG,IAAAE,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAAE;AAC3D;AACA,CAAC"}

package/lib/components/list/list-item/list-item-content/ListItemContent.js

@@ -4,21 +4,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _ListItemContent = require("./ListItemContent.styles");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var ListItemContent = function ListItemContent(_ref) {
-  var children = _ref.children;
+const ListItemContent = _ref => {
+  let {
+    children
+  } = _ref;
   return /*#__PURE__*/_react.default.createElement(_ListItemContent.StyledListItemContent, {
     className: "beta-chayns-list-item-content"
   }, children);
 };
-
 ListItemContent.displayName = 'ListItemContent';
-var _default = ListItemContent;
-exports.default = _default;
+var _default = exports.default = ListItemContent;
 //# sourceMappingURL=ListItemContent.js.map

package/lib/components/list/list-item/list-item-content/ListItemContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/list/list-item/list-item-content/ListItemContent.tsx"],"names":["ListItemContent","children","displayName"],"mappings":";;;;;;;AAAA;;AACA;;;;AAEA,IAAMA,eAAmB,GAAG,SAAtBA,eAAsB;AAAA,MAAGC,QAAH,QAAGA,QAAH;AAAA,sBACxB,6BAAC,sCAAD;AAAuB,IAAA,SAAS,EAAC;AAAjC,KACKA,QADL,CADwB;AAAA,CAA5B;;AAMAD,eAAe,CAACE,WAAhB,GAA8B,iBAA9B;eAEeF,e","sourcesContent":["import React, { FC } from 'react';\nimport { StyledListItemContent } from './ListItemContent.styles';\n\nconst ListItemContent: FC = ({ children }) => (\n    <StyledListItemContent className=\"beta-chayns-list-item-content\">\n        {children}\n    </StyledListItemContent>\n);\n\nListItemContent.displayName = 'ListItemContent';\n\nexport default ListItemContent;\n"],"file":"ListItemContent.js"}
+{"version":3,"file":"ListItemContent.js","names":["_react","_interopRequireDefault","require","_ListItemContent","obj","__esModule","default","ListItemContent","_ref","children","createElement","StyledListItemContent","className","displayName","_default","exports"],"sources":["../../../../../src/components/list/list-item/list-item-content/ListItemContent.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { StyledListItemContent } from './ListItemContent.styles';\n\nconst ListItemContent: FC = ({ children }) => (\n    <StyledListItemContent className=\"beta-chayns-list-item-content\">\n        {children}\n    </StyledListItemContent>\n);\n\nListItemContent.displayName = 'ListItemContent';\n\nexport default ListItemContent;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAD,OAAA;AAAiE,SAAAD,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAEjE,MAAMG,eAAmB,GAAGC,IAAA;EAAA,IAAC;IAAEC;EAAS,CAAC,GAAAD,IAAA;EAAA,oBACrCR,MAAA,CAAAM,OAAA,CAAAI,aAAA,CAACP,gBAAA,CAAAQ,qBAAqB;IAACC,SAAS,EAAC;EAA+B,GAC3DH,QACkB,CAAC;AAAA,CAC3B;AAEDF,eAAe,CAACM,WAAW,GAAG,iBAAiB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAT,OAAA,GAEjCC,eAAe"}

package/lib/components/list/list-item/list-item-content/ListItemContent.styles.js

@@ -4,19 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.StyledListItemContent = void 0;
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-var _templateObject;
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-var StyledListItemContent = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    color: ", ";\n    padding: 9px 18px 8px 35px;\n"])), function (_ref) {
-  var theme = _ref.theme;
+const StyledListItemContent = exports.StyledListItemContent = _styledComponents.default.div`
+    color: ${_ref => {
+  let {
+    theme
+  } = _ref;
   return theme.text;
-});
-
-exports.StyledListItemContent = StyledListItemContent;
+}};
+    padding: 9px 18px 8px 35px;
+`;
 //# sourceMappingURL=ListItemContent.styles.js.map

package/lib/components/list/list-item/list-item-content/ListItemContent.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/list/list-item/list-item-content/ListItemContent.styles.ts"],"names":["StyledListItemContent","styled","div","theme","text"],"mappings":";;;;;;;AAAA;;;;;;;;AAKO,IAAMA,qBAAqB,GAAGC,0BAAOC,GAAV,2HACrB;AAAA,MAAGC,KAAH,QAAGA,KAAH;AAAA,SAA2CA,KAAK,CAACC,IAAjD;AAAA,CADqB,CAA3B","sourcesContent":["import styled from 'styled-components';\nimport type { WithTheme } from '../../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemContentProps = WithTheme<unknown>;\n\nexport const StyledListItemContent = styled.div`\n    color: ${({ theme }: StyledListItemContentProps) => theme.text};\n    padding: 9px 18px 8px 35px;\n`;\n"],"file":"ListItemContent.styles.js"}
+{"version":3,"file":"ListItemContent.styles.js","names":["_styledComponents","_interopRequireDefault","require","obj","__esModule","default","StyledListItemContent","exports","styled","div","_ref","theme","text"],"sources":["../../../../../src/components/list/list-item/list-item-content/ListItemContent.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport type { WithTheme } from '../../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemContentProps = WithTheme<unknown>;\n\nexport const StyledListItemContent = styled.div`\n    color: ${({ theme }: StyledListItemContentProps) => theme.text};\n    padding: 9px 18px 8px 35px;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAKhC,MAAMG,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAGE,yBAAM,CAACC,GAAI;AAChD,aAAaC,IAAA;EAAA,IAAC;IAAEC;EAAkC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAACC,IAAI;AAAA,CAAC;AACnE;AACA,CAAC"}

package/lib/components/list/list-item/list-item-head/ListItemHead.d.ts

@@ -1,5 +1,5 @@
 import { FC, MouseEventHandler, ReactNode, TouchEventHandler } from 'react';
-declare type ListItemHeadProps = {
+type ListItemHeadProps = {
     hoverItem?: ReactNode;
     icons?: string[];
     images?: string[];
@@ -10,6 +10,7 @@ declare type ListItemHeadProps = {
     onLongPress?: TouchEventHandler<HTMLDivElement>;
     rightElements?: [ReactNode, ...ReactNode[]];
     subtitle?: ReactNode;
+    leftElements?: ReactNode;
     shouldShowRoundImage?: boolean;
     title: ReactNode;
 };