@chayns-components/core 5.0.0-beta.3 → 5.0.0-beta.36

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

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemContent.js","names":["ListItemContent","children","displayName"],"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;;AACA;;;;AAEA,MAAMA,eAAmB,GAAG;EAAA,IAAC;IAAEC;EAAF,CAAD;EAAA,oBACxB,6BAAC,sCAAD;IAAuB,SAAS,EAAC;EAAjC,GACKA,QADL,CADwB;AAAA,CAA5B;;AAMAD,eAAe,CAACE,WAAhB,GAA8B,iBAA9B;eAEeF,e"}

package/lib/components/list/list-item/list-item-content/ListItemContent.styles.d.ts

@@ -0,0 +1 @@
+export declare const StyledListItemContent: import("styled-components").StyledComponent<"div", any, {}, never>;

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

@@ -0,0 +1,24 @@
+"use strict";
+
+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) } })); }
+
+const StyledListItemContent = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    color: ", ";\n    padding: 9px 18px 8px 35px;\n"])), _ref => {
+  let {
+    theme
+  } = _ref;
+  return theme.text;
+});
+
+exports.StyledListItemContent = StyledListItemContent;
+//# sourceMappingURL=ListItemContent.styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemContent.styles.js","names":["StyledListItemContent","styled","div","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;;;;;;;;AAKO,MAAMA,qBAAqB,GAAGC,yBAAA,CAAOC,GAAV,2HACrB;EAAA,IAAC;IAAEC;EAAF,CAAD;EAAA,OAA2CA,KAAK,CAACC,IAAjD;AAAA,CADqB,CAA3B"}

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

@@ -0,0 +1,18 @@
+import { FC, MouseEventHandler, ReactNode, TouchEventHandler } from 'react';
+declare type ListItemHeadProps = {
+    hoverItem?: ReactNode;
+    icons?: string[];
+    images?: string[];
+    isAnyItemExpandable: boolean;
+    isExpandable: boolean;
+    isOpen: boolean;
+    onClick?: MouseEventHandler<HTMLDivElement>;
+    onLongPress?: TouchEventHandler<HTMLDivElement>;
+    rightElements?: [ReactNode, ...ReactNode[]];
+    subtitle?: ReactNode;
+    leftElements?: ReactNode;
+    shouldShowRoundImage?: boolean;
+    title: ReactNode;
+};
+declare const ListItemHead: FC<ListItemHeadProps>;
+export default ListItemHead;

package/lib/components/list/list-item/list-item-head/ListItemHead.js

@@ -0,0 +1,112 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Icon = _interopRequireDefault(require("../../../icon/Icon"));
+
+var _ListItemIcon = _interopRequireDefault(require("./list-item-icon/ListItemIcon"));
+
+var _ListItemImage = _interopRequireDefault(require("./list-item-image/ListItemImage"));
+
+var _ListItemHead = require("./ListItemHead.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 (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; }
+
+const ListItemHead = _ref => {
+  let {
+    hoverItem,
+    icons,
+    images,
+    isAnyItemExpandable,
+    isExpandable,
+    isOpen,
+    onClick,
+    onLongPress,
+    rightElements,
+    subtitle,
+    shouldShowRoundImage,
+    title,
+    leftElements
+  } = _ref;
+  const [shouldShowHoverItem, setShouldShowHoverItem] = (0, _react.useState)(false);
+  const longPressTimeoutRef = (0, _react.useRef)();
+  const handleMouseEnter = (0, _react.useCallback)(() => setShouldShowHoverItem(true), []);
+  const handleMouseLeave = (0, _react.useCallback)(() => setShouldShowHoverItem(false), []);
+  const handleTouchStart = (0, _react.useCallback)(event => {
+    longPressTimeoutRef.current = window.setTimeout(() => {
+      if (typeof onLongPress === 'function') {
+        onLongPress(event);
+      }
+    }, 400);
+  }, [onLongPress]);
+  const handleTouchEnd = (0, _react.useCallback)(() => {
+    clearTimeout(longPressTimeoutRef.current);
+  }, []);
+  const iconOrImageElement = (0, _react.useMemo)(() => {
+    if (icons) {
+      return /*#__PURE__*/_react.default.createElement(_ListItemIcon.default, {
+        icons: icons
+      });
+    }
+
+    if (images) {
+      return /*#__PURE__*/_react.default.createElement(_ListItemImage.default, {
+        images: images,
+        shouldShowRoundImage: !!shouldShowRoundImage
+      });
+    }
+
+    return undefined;
+  }, [icons, images, shouldShowRoundImage]);
+  return /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHead, {
+    className: "beta-chayns-list-item-head",
+    isClickable: typeof onClick === 'function' || isExpandable,
+    onClick: onClick,
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave,
+    onTouchStart: typeof onLongPress === 'function' ? handleTouchStart : undefined,
+    onTouchEnd: typeof onLongPress === 'function' ? handleTouchEnd : undefined
+  }, isAnyItemExpandable && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledMotionListItemHeadIndicator, {
+    animate: {
+      rotate: isOpen ? 90 : 0
+    },
+    initial: false,
+    transition: {
+      type: 'tween'
+    }
+  }, isExpandable && /*#__PURE__*/_react.default.createElement(_Icon.default, {
+    icons: ['fa fa-chevron-right']
+  })), leftElements, iconOrImageElement, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadContent, {
+    isIconOrImageGiven: iconOrImageElement !== undefined,
+    isOpen: isOpen
+  }, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitle, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleText, {
+    className: "ellipsis"
+  }, title), rightElements && rightElements.length > 1 && rightElements[0] && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTopRightElement, null, rightElements[0])), subtitle && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitle, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitleText, {
+    className: "ellipsis"
+  }, subtitle), rightElements && rightElements.length > 1 && rightElements[1] && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadBottomRightElement, null, rightElements[1]))), (rightElements === null || rightElements === void 0 ? void 0 : rightElements.length) === 1 && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadRightElement, null, rightElements[0]), hoverItem && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledMotionListItemHeadHoverItem, {
+    animate: {
+      marginLeft: shouldShowHoverItem ? 8 : 0,
+      opacity: shouldShowHoverItem ? 1 : 0,
+      width: shouldShowHoverItem ? 'auto' : 0
+    },
+    initial: false,
+    transition: {
+      duration: 0.15,
+      type: 'tween'
+    }
+  }, hoverItem));
+};
+
+ListItemHead.displayName = 'ListItemHead';
+var _default = ListItemHead;
+exports.default = _default;
+//# sourceMappingURL=ListItemHead.js.map

package/lib/components/list/list-item/list-item-head/ListItemHead.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemHead.js","names":["ListItemHead","hoverItem","icons","images","isAnyItemExpandable","isExpandable","isOpen","onClick","onLongPress","rightElements","subtitle","shouldShowRoundImage","title","leftElements","shouldShowHoverItem","setShouldShowHoverItem","useState","longPressTimeoutRef","useRef","handleMouseEnter","useCallback","handleMouseLeave","handleTouchStart","event","current","window","setTimeout","handleTouchEnd","clearTimeout","iconOrImageElement","useMemo","undefined","rotate","type","length","marginLeft","opacity","width","duration","displayName"],"sources":["../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport {\n    StyledListItemHead,\n    StyledListItemHeadBottomRightElement,\n    StyledListItemHeadContent,\n    StyledListItemHeadRightElement,\n    StyledListItemHeadSubtitle,\n    StyledListItemHeadSubtitleText,\n    StyledListItemHeadTitle,\n    StyledListItemHeadTitleText,\n    StyledListItemHeadTopRightElement,\n    StyledMotionListItemHeadHoverItem,\n    StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\n\ntype ListItemHeadProps = {\n    hoverItem?: ReactNode;\n    icons?: string[];\n    images?: string[];\n    isAnyItemExpandable: boolean;\n    isExpandable: boolean;\n    isOpen: boolean;\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    rightElements?: [ReactNode, ...ReactNode[]];\n    subtitle?: ReactNode;\n    leftElements?: ReactNode;\n    shouldShowRoundImage?: boolean;\n    title: ReactNode;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n    hoverItem,\n    icons,\n    images,\n    isAnyItemExpandable,\n    isExpandable,\n    isOpen,\n    onClick,\n    onLongPress,\n    rightElements,\n    subtitle,\n    shouldShowRoundImage,\n    title,\n    leftElements,\n}) => {\n    const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n\n    const longPressTimeoutRef = useRef<number>();\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 iconOrImageElement = useMemo(() => {\n        if (icons) {\n            return <ListItemIcon icons={icons} />;\n        }\n\n        if (images) {\n            return <ListItemImage images={images} shouldShowRoundImage={!!shouldShowRoundImage} />;\n        }\n\n        return undefined;\n    }, [icons, images, shouldShowRoundImage]);\n\n    return (\n        <StyledListItemHead\n            className=\"beta-chayns-list-item-head\"\n            isClickable={typeof onClick === 'function' || isExpandable}\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            {isAnyItemExpandable && (\n                <StyledMotionListItemHeadIndicator\n                    animate={{ rotate: isOpen ? 90 : 0 }}\n                    initial={false}\n                    transition={{ type: 'tween' }}\n                >\n                    {isExpandable && <Icon icons={['fa fa-chevron-right']} />}\n                </StyledMotionListItemHeadIndicator>\n            )}\n            {leftElements}\n            {iconOrImageElement}\n            <StyledListItemHeadContent\n                isIconOrImageGiven={iconOrImageElement !== undefined}\n                isOpen={isOpen}\n            >\n                <StyledListItemHeadTitle>\n                    <StyledListItemHeadTitleText className=\"ellipsis\">\n                        {title}\n                    </StyledListItemHeadTitleText>\n                    {rightElements && rightElements.length > 1 && rightElements[0] && (\n                        <StyledListItemHeadTopRightElement>\n                            {rightElements[0]}\n                        </StyledListItemHeadTopRightElement>\n                    )}\n                </StyledListItemHeadTitle>\n                {subtitle && (\n                    <StyledListItemHeadSubtitle>\n                        <StyledListItemHeadSubtitleText className=\"ellipsis\">\n                            {subtitle}\n                        </StyledListItemHeadSubtitleText>\n                        {rightElements && rightElements.length > 1 && rightElements[1] && (\n                            <StyledListItemHeadBottomRightElement>\n                                {rightElements[1]}\n                            </StyledListItemHeadBottomRightElement>\n                        )}\n                    </StyledListItemHeadSubtitle>\n                )}\n            </StyledListItemHeadContent>\n            {rightElements?.length === 1 && (\n                <StyledListItemHeadRightElement>{rightElements[0]}</StyledListItemHeadRightElement>\n            )}\n            {hoverItem && (\n                <StyledMotionListItemHeadHoverItem\n                    animate={{\n                        marginLeft: shouldShowHoverItem ? 8 : 0,\n                        opacity: shouldShowHoverItem ? 1 : 0,\n                        width: shouldShowHoverItem ? 'auto' : 0,\n                    }}\n                    initial={false}\n                    transition={{ duration: 0.15, type: 'tween' }}\n                >\n                    {hoverItem}\n                </StyledMotionListItemHeadHoverItem>\n            )}\n        </StyledListItemHead>\n    );\n};\n\nListItemHead.displayName = 'ListItemHead';\n\nexport default ListItemHead;\n"],"mappings":"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"}

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

@@ -0,0 +1,20 @@
+export declare const StyledListItemHead: import("styled-components").StyledComponent<"div", any, {
+    isClickable: boolean;
+} & {
+    theme: import("../../../color-scheme-provider/ColorSchemeProvider").Theme;
+}, never>;
+export declare const StyledMotionListItemHeadIndicator: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, {}, never>;
+declare type StyledListItemHeadContentProps = {
+    isIconOrImageGiven: boolean;
+    isOpen: boolean;
+};
+export declare const StyledListItemHeadContent: import("styled-components").StyledComponent<"div", any, StyledListItemHeadContentProps, never>;
+export declare const StyledListItemHeadTitle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledListItemHeadTitleText: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const StyledListItemHeadSubtitle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledListItemHeadSubtitleText: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const StyledListItemHeadTopRightElement: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledListItemHeadBottomRightElement: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledListItemHeadRightElement: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledMotionListItemHeadHoverItem: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, {}, never>;
+export {};

package/lib/components/list/list-item/list-item-head/ListItemHead.styles.js

@@ -0,0 +1,79 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledMotionListItemHeadIndicator = exports.StyledMotionListItemHeadHoverItem = exports.StyledListItemHeadTopRightElement = exports.StyledListItemHeadTitleText = exports.StyledListItemHeadTitle = exports.StyledListItemHeadSubtitleText = exports.StyledListItemHeadSubtitle = exports.StyledListItemHeadRightElement = exports.StyledListItemHeadContent = exports.StyledListItemHeadBottomRightElement = exports.StyledListItemHead = void 0;
+
+var _framerMotion = require("framer-motion");
+
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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) } })); }
+
+const StyledListItemHead = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    align-items: center;\n    color: ", ";\n    display: flex;\n    height: 64px;\n    padding: 12px 9px;\n\n    ", "\n"])), _ref => {
+  let {
+    theme
+  } = _ref;
+  return theme.text;
+}, _ref2 => {
+  let {
+    isClickable
+  } = _ref2;
+  return isClickable && (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n            cursor: pointer;\n        "])));
+});
+
+exports.StyledListItemHead = StyledListItemHead;
+const StyledMotionListItemHeadIndicator = (0, _styledComponents.default)(_framerMotion.motion.div)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    height: 26px;\n    justify-content: center;\n    width: 26px;\n"])));
+exports.StyledMotionListItemHeadIndicator = StyledMotionListItemHeadIndicator;
+
+const StyledListItemHeadContent = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    display: flex;\n    flex: 1 1 auto;\n    flex-direction: column;\n    font-weight: ", ";\n    justify-content: center;\n    line-height: normal;\n    margin-left: ", ";\n    min-width: 0;\n"])), _ref3 => {
+  let {
+    isOpen
+  } = _ref3;
+  return isOpen ? 'bold' : 'normal';
+}, _ref4 => {
+  let {
+    isIconOrImageGiven
+  } = _ref4;
+  return isIconOrImageGiven ? '10px' : undefined;
+});
+
+exports.StyledListItemHeadContent = StyledListItemHeadContent;
+
+const StyledListItemHeadTitle = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n"])));
+
+exports.StyledListItemHeadTitle = StyledListItemHeadTitle;
+
+const StyledListItemHeadTitleText = _styledComponents.default.span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    flex: 1 1 auto;\n    min-width: 0;\n"])));
+
+exports.StyledListItemHeadTitleText = StyledListItemHeadTitleText;
+
+const StyledListItemHeadSubtitle = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n    margin-top: 2px;\n    opacity: 0.75;\n"])));
+
+exports.StyledListItemHeadSubtitle = StyledListItemHeadSubtitle;
+
+const StyledListItemHeadSubtitleText = _styledComponents.default.span(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n"])));
+
+exports.StyledListItemHeadSubtitleText = StyledListItemHeadSubtitleText;
+
+const StyledListItemHeadTopRightElement = _styledComponents.default.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n    flex: 0 0 auto;\n    font-size: 85%;\n    margin-left: 8px;\n    opacity: 0.75;\n"])));
+
+exports.StyledListItemHeadTopRightElement = StyledListItemHeadTopRightElement;
+
+const StyledListItemHeadBottomRightElement = _styledComponents.default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n    flex: 0 0 auto;\n    margin-left: 8px;\n    font-size: 85%;\n"])));
+
+exports.StyledListItemHeadBottomRightElement = StyledListItemHeadBottomRightElement;
+
+const StyledListItemHeadRightElement = _styledComponents.default.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n    flex: 0 0 auto;\n    margin-left: 8px;\n"])));
+
+exports.StyledListItemHeadRightElement = StyledListItemHeadRightElement;
+const StyledMotionListItemHeadHoverItem = (0, _styledComponents.default)(_framerMotion.motion.div)(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n    overflow: hidden;\n"])));
+exports.StyledMotionListItemHeadHoverItem = StyledMotionListItemHeadHoverItem;
+//# sourceMappingURL=ListItemHead.styles.js.map

package/lib/components/list/list-item/list-item-head/ListItemHead.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemHead.styles.js","names":["StyledListItemHead","styled","div","theme","text","isClickable","css","StyledMotionListItemHeadIndicator","motion","StyledListItemHeadContent","isOpen","isIconOrImageGiven","undefined","StyledListItemHeadTitle","StyledListItemHeadTitleText","span","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledListItemHeadTopRightElement","StyledListItemHeadBottomRightElement","StyledListItemHeadRightElement","StyledMotionListItemHeadHoverItem"],"sources":["../../../../../src/components/list/list-item/list-item-head/ListItemHead.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemHeadProps = WithTheme<{\n    isClickable: boolean;\n}>;\n\nexport const StyledListItemHead = styled.div<StyledListItemHeadProps>`\n    align-items: center;\n    color: ${({ theme }: StyledListItemHeadProps) => theme.text};\n    display: flex;\n    height: 64px;\n    padding: 12px 9px;\n\n    ${({ isClickable }) =>\n        isClickable &&\n        css`\n            cursor: pointer;\n        `}\n`;\n\nexport const StyledMotionListItemHeadIndicator = styled(motion.div)`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    height: 26px;\n    justify-content: center;\n    width: 26px;\n`;\n\ntype StyledListItemHeadContentProps = {\n    isIconOrImageGiven: boolean;\n    isOpen: boolean;\n};\n\nexport const StyledListItemHeadContent = styled.div<StyledListItemHeadContentProps>`\n    display: flex;\n    flex: 1 1 auto;\n    flex-direction: column;\n    font-weight: ${({ isOpen }) => (isOpen ? 'bold' : 'normal')};\n    justify-content: center;\n    line-height: normal;\n    margin-left: ${({ isIconOrImageGiven }) => (isIconOrImageGiven ? '10px' : undefined)};\n    min-width: 0;\n`;\n\nexport const StyledListItemHeadTitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n`;\n\nexport const StyledListItemHeadTitleText = styled.span`\n    flex: 1 1 auto;\n    min-width: 0;\n`;\n\nexport const StyledListItemHeadSubtitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n    margin-top: 2px;\n    opacity: 0.75;\n`;\n\nexport const StyledListItemHeadSubtitleText = styled.span`\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n`;\n\nexport const StyledListItemHeadTopRightElement = styled.div`\n    flex: 0 0 auto;\n    font-size: 85%;\n    margin-left: 8px;\n    opacity: 0.75;\n`;\n\nexport const StyledListItemHeadBottomRightElement = styled.div`\n    flex: 0 0 auto;\n    margin-left: 8px;\n    font-size: 85%;\n`;\n\nexport const StyledListItemHeadRightElement = styled.div`\n    flex: 0 0 auto;\n    margin-left: 8px;\n`;\n\nexport const StyledMotionListItemHeadHoverItem = styled(motion.div)`\n    overflow: hidden;\n`;\n"],"mappings":";;;;;;;AAAA;;AACA;;;;;;;;;;AAOO,MAAMA,kBAAkB,GAAGC,yBAAA,CAAOC,GAAV,+LAElB;EAAA,IAAC;IAAEC;EAAF,CAAD;EAAA,OAAwCA,KAAK,CAACC,IAA9C;AAAA,CAFkB,EAOzB;EAAA,IAAC;IAAEC;EAAF,CAAD;EAAA,OACEA,WAAW,QACXC,qBADW,gHADb;AAAA,CAPyB,CAAxB;;;AAcA,MAAMC,iCAAiC,GAAG,IAAAN,yBAAA,EAAOO,oBAAA,CAAON,GAAd,CAAH,+MAAvC;;;AAcA,MAAMO,yBAAyB,GAAGR,yBAAA,CAAOC,GAAV,2QAInB;EAAA,IAAC;IAAEQ;EAAF,CAAD;EAAA,OAAiBA,MAAM,GAAG,MAAH,GAAY,QAAnC;AAAA,CAJmB,EAOnB;EAAA,IAAC;IAAEC;EAAF,CAAD;EAAA,OAA6BA,kBAAkB,GAAG,MAAH,GAAYC,SAA3D;AAAA,CAPmB,CAA/B;;;;AAWA,MAAMC,uBAAuB,GAAGZ,yBAAA,CAAOC,GAAV,4JAA7B;;;;AAMA,MAAMY,2BAA2B,GAAGb,yBAAA,CAAOc,IAAV,iHAAjC;;;;AAKA,MAAMC,0BAA0B,GAAGf,yBAAA,CAAOC,GAAV,sMAAhC;;;;AAQA,MAAMe,8BAA8B,GAAGhB,yBAAA,CAAOc,IAAV,sIAApC;;;;AAMA,MAAMG,iCAAiC,GAAGjB,yBAAA,CAAOC,GAAV,8JAAvC;;;;AAOA,MAAMiB,oCAAoC,GAAGlB,yBAAA,CAAOC,GAAV,4IAA1C;;;;AAMA,MAAMkB,8BAA8B,GAAGnB,yBAAA,CAAOC,GAAV,uHAApC;;;AAKA,MAAMmB,iCAAiC,GAAG,IAAApB,yBAAA,EAAOO,oBAAA,CAAON,GAAd,CAAH,kGAAvC"}

package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+declare type ListItemIconProps = {
+    icons: string[];
+};
+declare const ListItemIcon: React.FC<ListItemIconProps>;
+export default ListItemIcon;

package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Icon = _interopRequireDefault(require("../../../../icon/Icon"));
+
+var _ListItemIcon = require("./ListItemIcon.styles");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const ListItemIcon = _ref => {
+  let {
+    icons
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement(_ListItemIcon.StyledListItemIcon, null, /*#__PURE__*/_react.default.createElement(_Icon.default, {
+    icons: icons,
+    size: 22
+  }));
+};
+
+ListItemIcon.displayName = 'ListItemIcon';
+var _default = ListItemIcon;
+exports.default = _default;
+//# sourceMappingURL=ListItemIcon.js.map

package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemIcon.js","names":["ListItemIcon","icons","displayName"],"sources":["../../../../../../src/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.tsx"],"sourcesContent":["import React from 'react';\nimport Icon from '../../../../icon/Icon';\nimport { StyledListItemIcon } from './ListItemIcon.styles';\n\ntype ListItemIconProps = {\n    icons: string[];\n};\n\nconst ListItemIcon: React.FC<ListItemIconProps> = ({ icons }) => {\n    return (\n        <StyledListItemIcon>\n            <Icon icons={icons} size={22} />\n        </StyledListItemIcon>\n    );\n};\n\nListItemIcon.displayName = 'ListItemIcon';\n\nexport default ListItemIcon;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAMA,MAAMA,YAAyC,GAAG,QAAe;EAAA,IAAd;IAAEC;EAAF,CAAc;EAC7D,oBACI,6BAAC,gCAAD,qBACI,6BAAC,aAAD;IAAM,KAAK,EAAEA,KAAb;IAAoB,IAAI,EAAE;EAA1B,EADJ,CADJ;AAKH,CAND;;AAQAD,YAAY,CAACE,WAAb,GAA2B,cAA3B;eAEeF,Y"}

package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.d.ts

@@ -0,0 +1 @@
+export declare const StyledListItemIcon: import("styled-components").StyledComponent<"div", any, {}, never>;

package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledListItemIcon = 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) } })); }
+
+const StyledListItemIcon = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    align-items: center;\n    background-color: rgba(", ", 0.1);\n    box-shadow: 0 0 0 1px rgba(", ", 0.08)\n        inset;\n    display: flex;\n    flex: 0 0 auto;\n    height: 40px;\n    justify-content: center;\n    margin-right: 10px;\n    width: 40px;\n"])), _ref => {
+  let {
+    theme
+  } = _ref;
+  return theme['text-rgb'];
+}, _ref2 => {
+  let {
+    theme
+  } = _ref2;
+  return theme['009-rgb'];
+});
+
+exports.StyledListItemIcon = StyledListItemIcon;
+//# sourceMappingURL=ListItemIcon.styles.js.map

package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemIcon.styles.js","names":["StyledListItemIcon","styled","div","theme"],"sources":["../../../../../../src/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport type { WithTheme } from '../../../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemIconProps = WithTheme<unknown>;\n\nexport const StyledListItemIcon = styled.div`\n    align-items: center;\n    background-color: rgba(${({ theme }: StyledListItemIconProps) => theme['text-rgb']}, 0.1);\n    box-shadow: 0 0 0 1px rgba(${({ theme }: StyledListItemIconProps) => theme['009-rgb']}, 0.08)\n        inset;\n    display: flex;\n    flex: 0 0 auto;\n    height: 40px;\n    justify-content: center;\n    margin-right: 10px;\n    width: 40px;\n`;\n"],"mappings":";;;;;;;AAAA;;;;;;;;AAKO,MAAMA,kBAAkB,GAAGC,yBAAA,CAAOC,GAAV,2UAEF;EAAA,IAAC;IAAEC;EAAF,CAAD;EAAA,OAAwCA,KAAK,CAAC,UAAD,CAA7C;AAAA,CAFE,EAGE;EAAA,IAAC;IAAEA;EAAF,CAAD;EAAA,OAAwCA,KAAK,CAAC,SAAD,CAA7C;AAAA,CAHF,CAAxB"}

package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+declare type ListItemImageProps = {
+    images: string[];
+    shouldShowRoundImage: boolean;
+};
+declare const ListItemImage: React.FC<ListItemImageProps>;
+export default ListItemImage;

package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.js

@@ -0,0 +1,55 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _GridImage = _interopRequireDefault(require("../../../../grid-image/GridImage"));
+
+var _ListItemImage = require("./ListItemImage.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 (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; }
+
+const ListItemImage = _ref => {
+  let {
+    images,
+    shouldShowRoundImage
+  } = _ref;
+  const [hasLoadedImage, setHasLoadedImage] = (0, _react.useState)(false);
+  const handleImageLoaded = (0, _react.useCallback)(() => {
+    setHasLoadedImage(true);
+  }, []);
+
+  if (images && images[0] && images[1] && images[2]) {
+    const gridImages = [images[0], images[1], images[2]];
+    return /*#__PURE__*/_react.default.createElement(_GridImage.default, {
+      images: gridImages,
+      shouldShowRoundImage: shouldShowRoundImage,
+      size: 40
+    });
+  }
+
+  if (images && images[0]) {
+    return /*#__PURE__*/_react.default.createElement(_ListItemImage.StyledListItemHeadImageWrapper, {
+      shouldShowRoundImage: shouldShowRoundImage
+    }, /*#__PURE__*/_react.default.createElement(_ListItemImage.StyledListItemHeadImage, {
+      isHidden: !hasLoadedImage,
+      onLoad: handleImageLoaded,
+      src: images[0]
+    }));
+  }
+
+  return null;
+};
+
+ListItemImage.displayName = 'ListItemImage';
+var _default = ListItemImage;
+exports.default = _default;
+//# sourceMappingURL=ListItemImage.js.map

package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemImage.js","names":["ListItemImage","images","shouldShowRoundImage","hasLoadedImage","setHasLoadedImage","useState","handleImageLoaded","useCallback","gridImages","displayName"],"sources":["../../../../../../src/components/list/list-item/list-item-head/list-item-image/ListItemImage.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport GridImage from '../../../../grid-image/GridImage';\nimport { StyledListItemHeadImage, StyledListItemHeadImageWrapper } from './ListItemImage.styles';\n\ntype ListItemImageProps = {\n    images: string[];\n    shouldShowRoundImage: boolean;\n};\n\nconst ListItemImage: React.FC<ListItemImageProps> = ({ images, shouldShowRoundImage }) => {\n    const [hasLoadedImage, setHasLoadedImage] = useState(false);\n    const handleImageLoaded = useCallback(() => {\n        setHasLoadedImage(true);\n    }, []);\n\n    if (images && images[0] && images[1] && images[2]) {\n        const gridImages = [images[0], images[1], images[2]];\n\n        return (\n            <GridImage images={gridImages} shouldShowRoundImage={shouldShowRoundImage} size={40} />\n        );\n    }\n\n    if (images && images[0]) {\n        return (\n            <StyledListItemHeadImageWrapper shouldShowRoundImage={shouldShowRoundImage}>\n                <StyledListItemHeadImage\n                    isHidden={!hasLoadedImage}\n                    onLoad={handleImageLoaded}\n                    src={images[0]}\n                />\n            </StyledListItemHeadImageWrapper>\n        );\n    }\n\n    return null;\n};\n\nListItemImage.displayName = 'ListItemImage';\n\nexport default ListItemImage;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;;;;;AAOA,MAAMA,aAA2C,GAAG,QAAsC;EAAA,IAArC;IAAEC,MAAF;IAAUC;EAAV,CAAqC;EACtF,MAAM,CAACC,cAAD,EAAiBC,iBAAjB,IAAsC,IAAAC,eAAA,EAAS,KAAT,CAA5C;EACA,MAAMC,iBAAiB,GAAG,IAAAC,kBAAA,EAAY,MAAM;IACxCH,iBAAiB,CAAC,IAAD,CAAjB;EACH,CAFyB,EAEvB,EAFuB,CAA1B;;EAIA,IAAIH,MAAM,IAAIA,MAAM,CAAC,CAAD,CAAhB,IAAuBA,MAAM,CAAC,CAAD,CAA7B,IAAoCA,MAAM,CAAC,CAAD,CAA9C,EAAmD;IAC/C,MAAMO,UAAU,GAAG,CAACP,MAAM,CAAC,CAAD,CAAP,EAAYA,MAAM,CAAC,CAAD,CAAlB,EAAuBA,MAAM,CAAC,CAAD,CAA7B,CAAnB;IAEA,oBACI,6BAAC,kBAAD;MAAW,MAAM,EAAEO,UAAnB;MAA+B,oBAAoB,EAAEN,oBAArD;MAA2E,IAAI,EAAE;IAAjF,EADJ;EAGH;;EAED,IAAID,MAAM,IAAIA,MAAM,CAAC,CAAD,CAApB,EAAyB;IACrB,oBACI,6BAAC,6CAAD;MAAgC,oBAAoB,EAAEC;IAAtD,gBACI,6BAAC,sCAAD;MACI,QAAQ,EAAE,CAACC,cADf;MAEI,MAAM,EAAEG,iBAFZ;MAGI,GAAG,EAAEL,MAAM,CAAC,CAAD;IAHf,EADJ,CADJ;EASH;;EAED,OAAO,IAAP;AACH,CA3BD;;AA6BAD,aAAa,CAACS,WAAd,GAA4B,eAA5B;eAEeT,a"}

package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.d.ts

@@ -0,0 +1,10 @@
+export declare const StyledListItemHeadImageWrapper: import("styled-components").StyledComponent<"div", any, {
+    shouldShowRoundImage?: boolean | undefined;
+} & {
+    theme: import("../../../../color-scheme-provider/ColorSchemeProvider").Theme;
+}, never>;
+declare type StyledListItemHeadImageProps = {
+    isHidden: boolean;
+};
+export declare const StyledListItemHeadImage: import("styled-components").StyledComponent<"img", any, StyledListItemHeadImageProps, never>;
+export {};

package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledListItemHeadImageWrapper = exports.StyledListItemHeadImage = void 0;
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _templateObject, _templateObject2;
+
+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) } })); }
+
+const StyledListItemHeadImageWrapper = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    background-color: rgba(\n        ", ",\n        0.1\n    );\n    border-radius: ", ";\n    box-shadow: 0 0 0 1px\n        rgba(", ", 0.08) inset;\n    flex: 0 0 auto;\n    height: 40px;\n    overflow: hidden;\n    transition: border-radius 0.3s ease;\n    width: 40px;\n"])), _ref => {
+  let {
+    theme
+  } = _ref;
+  return theme['text-rgb'];
+}, _ref2 => {
+  let {
+    shouldShowRoundImage
+  } = _ref2;
+  return shouldShowRoundImage ? '50%' : undefined;
+}, _ref3 => {
+  let {
+    theme
+  } = _ref3;
+  return theme['009-rgb'];
+});
+
+exports.StyledListItemHeadImageWrapper = StyledListItemHeadImageWrapper;
+
+const StyledListItemHeadImage = _styledComponents.default.img(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    height: 100%;\n    object-fit: cover;\n    opacity: ", ";\n    transition: opacity 0.4s ease;\n    width: 100%;\n"])), _ref4 => {
+  let {
+    isHidden
+  } = _ref4;
+  return isHidden ? 0 : 1;
+});
+
+exports.StyledListItemHeadImage = StyledListItemHeadImage;
+//# sourceMappingURL=ListItemImage.styles.js.map

package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemImage.styles.js","names":["StyledListItemHeadImageWrapper","styled","div","theme","shouldShowRoundImage","undefined","StyledListItemHeadImage","img","isHidden"],"sources":["../../../../../../src/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport type { WithTheme } from '../../../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemHeadImageWrapperProps = WithTheme<{\n    shouldShowRoundImage?: boolean;\n}>;\n\nexport const StyledListItemHeadImageWrapper = styled.div<StyledListItemHeadImageWrapperProps>`\n    background-color: rgba(\n        ${({ theme }: StyledListItemHeadImageWrapperProps) => theme['text-rgb']},\n        0.1\n    );\n    border-radius: ${({ shouldShowRoundImage }) => (shouldShowRoundImage ? '50%' : undefined)};\n    box-shadow: 0 0 0 1px\n        rgba(${({ theme }: StyledListItemHeadImageWrapperProps) => theme['009-rgb']}, 0.08) inset;\n    flex: 0 0 auto;\n    height: 40px;\n    overflow: hidden;\n    transition: border-radius 0.3s ease;\n    width: 40px;\n`;\n\ntype StyledListItemHeadImageProps = {\n    isHidden: boolean;\n};\n\nexport const StyledListItemHeadImage = styled.img<StyledListItemHeadImageProps>`\n    height: 100%;\n    object-fit: cover;\n    opacity: ${({ isHidden }) => (isHidden ? 0 : 1)};\n    transition: opacity 0.4s ease;\n    width: 100%;\n`;\n"],"mappings":";;;;;;;AAAA;;;;;;;;AAOO,MAAMA,8BAA8B,GAAGC,yBAAA,CAAOC,GAAV,0VAEjC;EAAA,IAAC;IAAEC;EAAF,CAAD;EAAA,OAAoDA,KAAK,CAAC,UAAD,CAAzD;AAAA,CAFiC,EAKtB;EAAA,IAAC;IAAEC;EAAF,CAAD;EAAA,OAA+BA,oBAAoB,GAAG,KAAH,GAAWC,SAA9D;AAAA,CALsB,EAO5B;EAAA,IAAC;IAAEF;EAAF,CAAD;EAAA,OAAoDA,KAAK,CAAC,SAAD,CAAzD;AAAA,CAP4B,CAApC;;;;AAmBA,MAAMG,uBAAuB,GAAGL,yBAAA,CAAOM,GAAV,+LAGrB;EAAA,IAAC;IAAEC;EAAF,CAAD;EAAA,OAAmBA,QAAQ,GAAG,CAAH,GAAO,CAAlC;AAAA,CAHqB,CAA7B"}

package/lib/hooks/uuid.d.ts

@@ -0,0 +1 @@
+export declare const useUuid: () => string;

package/lib/hooks/uuid.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useUuid = void 0;
+
+var _react = require("react");
+
+var _uuid = require("uuid");
+
+const useUuid = () => {
+  const [uuid] = (0, _react.useState)((0, _uuid.v4)());
+  return uuid;
+};
+
+exports.useUuid = useUuid;
+//# sourceMappingURL=uuid.js.map

package/lib/hooks/uuid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"uuid.js","names":["useUuid","uuid","useState","uuidV4"],"sources":["../../src/hooks/uuid.ts"],"sourcesContent":["import { useState } from 'react';\nimport { v4 as uuidV4 } from 'uuid';\n\nexport const useUuid = () => {\n    const [uuid] = useState(uuidV4());\n\n    return uuid;\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEO,MAAMA,OAAO,GAAG,MAAM;EACzB,MAAM,CAACC,IAAD,IAAS,IAAAC,eAAA,EAAS,IAAAC,QAAA,GAAT,CAAf;EAEA,OAAOF,IAAP;AACH,CAJM"}

package/lib/index.d.ts

@@ -1,5 +1,13 @@
 export { default as Accordion } from './components/accordion/Accordion';
+export { default as AccordionContent } from './components/accordion/accordion-content/AccordionContent';
+export { default as AccordionGroup } from './components/accordion/accordion-group/AccordionGroup';
+export { default as AccordionIntro } from './components/accordion/accordion-intro/AccordionIntro';
 export { default as Badge } from './components/badge/Badge';
 export { default as Button } from './components/button/Button';
 export { default as ColorSchemeProvider } from './components/color-scheme-provider/ColorSchemeProvider';
+export { default as ContextMenu } from './components/context-menu/ContextMenu';
+export { default as GridImage } from './components/grid-image/GridImage';
 export { default as Icon } from './components/icon/Icon';
+export { default as List } from './components/list/List';
+export { default as ListItemContent } from './components/list/list-item/list-item-content/ListItemContent';
+export { default as ListItem } from './components/list/list-item/ListItem';