@chayns-components/core 5.0.0-beta.9 → 5.0.0-beta.98
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -9
- package/lib/components/accordion/Accordion.d.ts +47 -9
- package/lib/components/accordion/Accordion.js +83 -87
- package/lib/components/accordion/Accordion.js.map +1 -1
- package/lib/components/accordion/Accordion.styles.d.ts +6 -5
- package/lib/components/accordion/Accordion.styles.js +67 -26
- package/lib/components/accordion/Accordion.styles.js.map +1 -1
- package/lib/components/accordion/accordion-body/AccordionBody.d.ts +13 -2
- package/lib/components/accordion/accordion-body/AccordionBody.js +19 -11
- package/lib/components/accordion/accordion-body/AccordionBody.js.map +1 -1
- package/lib/components/accordion/accordion-body/AccordionBody.styles.d.ts +4 -1
- package/lib/components/accordion/accordion-body/AccordionBody.styles.js +15 -10
- package/lib/components/accordion/accordion-body/AccordionBody.styles.js.map +1 -1
- package/lib/components/accordion/accordion-content/AccordionContent.d.ts +11 -3
- package/lib/components/accordion/accordion-content/AccordionContent.js +13 -11
- package/lib/components/accordion/accordion-content/AccordionContent.js.map +1 -1
- package/lib/components/accordion/accordion-content/AccordionContent.styles.d.ts +5 -4
- package/lib/components/accordion/accordion-content/AccordionContent.styles.js +25 -12
- package/lib/components/accordion/accordion-content/AccordionContent.styles.js.map +1 -1
- package/lib/components/accordion/accordion-group/AccordionGroup.d.ts +26 -0
- package/lib/components/accordion/accordion-group/AccordionGroup.js +57 -0
- package/lib/components/accordion/accordion-group/AccordionGroup.js.map +1 -0
- package/lib/components/accordion/accordion-head/AccordionHead.d.ts +8 -4
- package/lib/components/accordion/accordion-head/AccordionHead.js +79 -64
- package/lib/components/accordion/accordion-head/AccordionHead.js.map +1 -1
- package/lib/components/accordion/accordion-head/AccordionHead.styles.d.ts +10 -5
- package/lib/components/accordion/accordion-head/AccordionHead.styles.js +142 -32
- package/lib/components/accordion/accordion-head/AccordionHead.styles.js.map +1 -1
- package/lib/components/accordion/accordion-intro/AccordionIntro.d.ts +9 -0
- package/lib/components/accordion/accordion-intro/AccordionIntro.js +21 -0
- package/lib/components/accordion/accordion-intro/AccordionIntro.js.map +1 -0
- package/lib/components/accordion/accordion-intro/AccordionIntro.styles.d.ts +1 -0
- package/lib/components/accordion/accordion-intro/AccordionIntro.styles.js +13 -0
- package/lib/components/accordion/accordion-intro/AccordionIntro.styles.js.map +1 -0
- package/lib/components/accordion/utils.js +10 -12
- package/lib/components/accordion/utils.js.map +1 -1
- package/lib/components/badge/Badge.d.ts +9 -1
- package/lib/components/badge/Badge.js +12 -12
- package/lib/components/badge/Badge.js.map +1 -1
- package/lib/components/badge/Badge.styles.d.ts +4 -1
- package/lib/components/badge/Badge.styles.js +22 -15
- package/lib/components/badge/Badge.styles.js.map +1 -1
- package/lib/components/button/Button.d.ts +2 -2
- package/lib/components/button/Button.js +12 -20
- package/lib/components/button/Button.js.map +1 -1
- package/lib/components/button/Button.styles.d.ts +2 -0
- package/lib/components/button/Button.styles.js +47 -24
- package/lib/components/button/Button.styles.js.map +1 -1
- package/lib/components/checkbox/Checkbox.d.ts +25 -0
- package/lib/components/checkbox/Checkbox.js +44 -0
- package/lib/components/checkbox/Checkbox.js.map +1 -0
- package/lib/components/checkbox/Checkbox.styles.d.ts +6 -0
- package/lib/components/checkbox/Checkbox.styles.js +131 -0
- package/lib/components/checkbox/Checkbox.styles.js.map +1 -0
- package/lib/components/color-scheme-provider/ColorSchemeProvider.d.ts +7 -1
- package/lib/components/color-scheme-provider/ColorSchemeProvider.js +41 -78
- package/lib/components/color-scheme-provider/ColorSchemeProvider.js.map +1 -1
- package/lib/components/color-scheme-provider/font.d.ts +6 -0
- package/lib/components/color-scheme-provider/font.js +59 -0
- package/lib/components/color-scheme-provider/font.js.map +1 -0
- package/lib/components/context-menu/ContextMenu.d.ts +51 -0
- package/lib/components/context-menu/ContextMenu.js +154 -0
- package/lib/components/context-menu/ContextMenu.js.map +1 -0
- package/lib/components/context-menu/ContextMenu.styles.d.ts +1 -0
- package/lib/components/context-menu/ContextMenu.styles.js +13 -0
- package/lib/components/context-menu/ContextMenu.styles.js.map +1 -0
- package/lib/components/context-menu/constants/alignment.d.ts +8 -0
- package/lib/components/context-menu/constants/alignment.js +17 -0
- package/lib/components/context-menu/constants/alignment.js.map +1 -0
- package/lib/components/context-menu/context-menu-content/ContextMenuContent.d.ts +10 -0
- package/lib/components/context-menu/context-menu-content/ContextMenuContent.js +78 -0
- package/lib/components/context-menu/context-menu-content/ContextMenuContent.js.map +1 -0
- package/lib/components/context-menu/context-menu-content/ContextMenuContent.styles.d.ts +11 -0
- package/lib/components/context-menu/context-menu-content/ContextMenuContent.styles.js +117 -0
- package/lib/components/context-menu/context-menu-content/ContextMenuContent.styles.js.map +1 -0
- package/lib/components/grid-image/GridImage.d.ts +19 -0
- package/lib/components/grid-image/GridImage.js +46 -0
- package/lib/components/grid-image/GridImage.js.map +1 -0
- package/lib/components/grid-image/GridImage.styles.d.ts +21 -0
- package/lib/components/grid-image/GridImage.styles.js +105 -0
- package/lib/components/grid-image/GridImage.styles.js.map +1 -0
- package/lib/components/icon/Icon.d.ts +11 -3
- package/lib/components/icon/Icon.js +32 -30
- package/lib/components/icon/Icon.js.map +1 -1
- package/lib/components/icon/Icon.styles.d.ts +8 -1
- package/lib/components/icon/Icon.styles.js +64 -42
- package/lib/components/icon/Icon.styles.js.map +1 -1
- package/lib/components/icon/utils.js +2 -5
- package/lib/components/icon/utils.js.map +1 -1
- package/lib/components/input/Input.d.ts +37 -0
- package/lib/components/input/Input.js +75 -0
- package/lib/components/input/Input.js.map +1 -0
- package/lib/components/input/Input.styles.d.ts +7 -0
- package/lib/components/input/Input.styles.js +71 -0
- package/lib/components/input/Input.styles.js.map +1 -0
- package/lib/components/list/List.d.ts +18 -0
- package/lib/components/list/List.js +54 -0
- package/lib/components/list/List.js.map +1 -0
- package/lib/components/list/list-item/ListItem.d.ts +67 -0
- package/lib/components/list/list-item/ListItem.js +90 -0
- package/lib/components/list/list-item/ListItem.js.map +1 -0
- package/lib/components/list/list-item/ListItem.styles.d.ts +6 -0
- package/lib/components/list/list-item/ListItem.styles.js +56 -0
- package/lib/components/list/list-item/ListItem.styles.js.map +1 -0
- package/lib/components/list/list-item/list-item-body/ListItemBody.d.ts +3 -0
- package/lib/components/list/list-item/list-item-body/ListItemBody.js +36 -0
- package/lib/components/list/list-item/list-item-body/ListItemBody.js.map +1 -0
- package/lib/components/list/list-item/list-item-body/ListItemBody.styles.d.ts +1 -0
- package/lib/components/list/list-item/list-item-body/ListItemBody.styles.js +14 -0
- package/lib/components/list/list-item/list-item-body/ListItemBody.styles.js.map +1 -0
- package/lib/components/list/list-item/list-item-content/ListItemContent.d.ts +3 -0
- package/lib/components/list/list-item/list-item-content/ListItemContent.js +21 -0
- package/lib/components/list/list-item/list-item-content/ListItemContent.js.map +1 -0
- package/lib/components/list/list-item/list-item-content/ListItemContent.styles.d.ts +1 -0
- package/lib/components/list/list-item/list-item-content/ListItemContent.styles.js +19 -0
- package/lib/components/list/list-item/list-item-content/ListItemContent.styles.js.map +1 -0
- package/lib/components/list/list-item/list-item-head/ListItemHead.d.ts +18 -0
- package/lib/components/list/list-item/list-item-head/ListItemHead.js +100 -0
- package/lib/components/list/list-item/list-item-head/ListItemHead.js.map +1 -0
- package/lib/components/list/list-item/list-item-head/ListItemHead.styles.d.ts +20 -0
- package/lib/components/list/list-item/list-item-head/ListItemHead.styles.js +110 -0
- package/lib/components/list/list-item/list-item-head/ListItemHead.styles.js.map +1 -0
- package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.d.ts +6 -0
- package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.js +23 -0
- package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.js.map +1 -0
- package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.d.ts +1 -0
- package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.js +32 -0
- package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.js.map +1 -0
- package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.d.ts +7 -0
- package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.js +44 -0
- package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.js.map +1 -0
- package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.d.ts +10 -0
- package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.js +52 -0
- package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.js.map +1 -0
- package/lib/hooks/uuid.d.ts +1 -0
- package/lib/hooks/uuid.js +14 -0
- package/lib/hooks/uuid.js.map +1 -0
- package/lib/index.d.ts +10 -0
- package/lib/index.js +69 -13
- package/lib/index.js.map +1 -1
- package/lib/types/chayns.d.ts +57 -0
- package/lib/types/chayns.js +14 -0
- package/lib/types/chayns.js.map +1 -0
- package/package.json +64 -62
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _Icon = _interopRequireDefault(require("../../../icon/Icon"));
|
|
9
|
+
var _ListItemIcon = _interopRequireDefault(require("./list-item-icon/ListItemIcon"));
|
|
10
|
+
var _ListItemImage = _interopRequireDefault(require("./list-item-image/ListItemImage"));
|
|
11
|
+
var _ListItemHead = require("./ListItemHead.styles");
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
+
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); }
|
|
14
|
+
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; }
|
|
15
|
+
const ListItemHead = _ref => {
|
|
16
|
+
let {
|
|
17
|
+
hoverItem,
|
|
18
|
+
icons,
|
|
19
|
+
images,
|
|
20
|
+
isAnyItemExpandable,
|
|
21
|
+
isExpandable,
|
|
22
|
+
isOpen,
|
|
23
|
+
onClick,
|
|
24
|
+
onLongPress,
|
|
25
|
+
rightElements,
|
|
26
|
+
subtitle,
|
|
27
|
+
shouldShowRoundImage,
|
|
28
|
+
title,
|
|
29
|
+
leftElements
|
|
30
|
+
} = _ref;
|
|
31
|
+
const [shouldShowHoverItem, setShouldShowHoverItem] = (0, _react.useState)(false);
|
|
32
|
+
const longPressTimeoutRef = (0, _react.useRef)();
|
|
33
|
+
const handleMouseEnter = (0, _react.useCallback)(() => setShouldShowHoverItem(true), []);
|
|
34
|
+
const handleMouseLeave = (0, _react.useCallback)(() => setShouldShowHoverItem(false), []);
|
|
35
|
+
const handleTouchStart = (0, _react.useCallback)(event => {
|
|
36
|
+
longPressTimeoutRef.current = window.setTimeout(() => {
|
|
37
|
+
if (typeof onLongPress === 'function') {
|
|
38
|
+
onLongPress(event);
|
|
39
|
+
}
|
|
40
|
+
}, 400);
|
|
41
|
+
}, [onLongPress]);
|
|
42
|
+
const handleTouchEnd = (0, _react.useCallback)(() => {
|
|
43
|
+
clearTimeout(longPressTimeoutRef.current);
|
|
44
|
+
}, []);
|
|
45
|
+
const iconOrImageElement = (0, _react.useMemo)(() => {
|
|
46
|
+
if (icons) {
|
|
47
|
+
return /*#__PURE__*/_react.default.createElement(_ListItemIcon.default, {
|
|
48
|
+
icons: icons
|
|
49
|
+
});
|
|
50
|
+
}
|
|
51
|
+
if (images) {
|
|
52
|
+
return /*#__PURE__*/_react.default.createElement(_ListItemImage.default, {
|
|
53
|
+
images: images,
|
|
54
|
+
shouldShowRoundImage: !!shouldShowRoundImage
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
return undefined;
|
|
58
|
+
}, [icons, images, shouldShowRoundImage]);
|
|
59
|
+
return /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHead, {
|
|
60
|
+
className: "beta-chayns-list-item-head",
|
|
61
|
+
isClickable: typeof onClick === 'function' || isExpandable,
|
|
62
|
+
onClick: onClick,
|
|
63
|
+
onMouseEnter: handleMouseEnter,
|
|
64
|
+
onMouseLeave: handleMouseLeave,
|
|
65
|
+
onTouchStart: typeof onLongPress === 'function' ? handleTouchStart : undefined,
|
|
66
|
+
onTouchEnd: typeof onLongPress === 'function' ? handleTouchEnd : undefined
|
|
67
|
+
}, isAnyItemExpandable && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledMotionListItemHeadIndicator, {
|
|
68
|
+
animate: {
|
|
69
|
+
rotate: isOpen ? 90 : 0
|
|
70
|
+
},
|
|
71
|
+
initial: false,
|
|
72
|
+
transition: {
|
|
73
|
+
type: 'tween'
|
|
74
|
+
}
|
|
75
|
+
}, isExpandable && /*#__PURE__*/_react.default.createElement(_Icon.default, {
|
|
76
|
+
icons: ['fa fa-chevron-right']
|
|
77
|
+
})), leftElements, iconOrImageElement, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadContent, {
|
|
78
|
+
isIconOrImageGiven: iconOrImageElement !== undefined,
|
|
79
|
+
isOpen: isOpen
|
|
80
|
+
}, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitle, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleText, {
|
|
81
|
+
className: "ellipsis"
|
|
82
|
+
}, 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, {
|
|
83
|
+
className: "ellipsis"
|
|
84
|
+
}, 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, {
|
|
85
|
+
animate: {
|
|
86
|
+
marginLeft: shouldShowHoverItem ? 8 : 0,
|
|
87
|
+
opacity: shouldShowHoverItem ? 1 : 0,
|
|
88
|
+
width: shouldShowHoverItem ? 'auto' : 0
|
|
89
|
+
},
|
|
90
|
+
initial: false,
|
|
91
|
+
transition: {
|
|
92
|
+
duration: 0.15,
|
|
93
|
+
type: 'tween'
|
|
94
|
+
}
|
|
95
|
+
}, hoverItem));
|
|
96
|
+
};
|
|
97
|
+
ListItemHead.displayName = 'ListItemHead';
|
|
98
|
+
var _default = ListItemHead;
|
|
99
|
+
exports.default = _default;
|
|
100
|
+
//# sourceMappingURL=ListItemHead.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ListItemHead.js","names":["_react","_interopRequireWildcard","require","_Icon","_interopRequireDefault","_ListItemIcon","_ListItemImage","_ListItemHead","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","ListItemHead","_ref","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","createElement","undefined","StyledListItemHead","className","isClickable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","StyledMotionListItemHeadIndicator","animate","rotate","initial","transition","type","StyledListItemHeadContent","isIconOrImageGiven","StyledListItemHeadTitle","StyledListItemHeadTitleText","length","StyledListItemHeadTopRightElement","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledListItemHeadBottomRightElement","StyledListItemHeadRightElement","StyledMotionListItemHeadHoverItem","marginLeft","opacity","width","duration","displayName","_default","exports"],"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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"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export declare const StyledListItemHead: import("styled-components").StyledComponent<"div", any, {
|
|
2
|
+
isClickable: boolean;
|
|
3
|
+
} & {
|
|
4
|
+
theme: import("../../../color-scheme-provider/ColorSchemeProvider").Theme;
|
|
5
|
+
}, never>;
|
|
6
|
+
export declare const StyledMotionListItemHeadIndicator: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, {}, never>;
|
|
7
|
+
type StyledListItemHeadContentProps = {
|
|
8
|
+
isIconOrImageGiven: boolean;
|
|
9
|
+
isOpen: boolean;
|
|
10
|
+
};
|
|
11
|
+
export declare const StyledListItemHeadContent: import("styled-components").StyledComponent<"div", any, StyledListItemHeadContentProps, never>;
|
|
12
|
+
export declare const StyledListItemHeadTitle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
13
|
+
export declare const StyledListItemHeadTitleText: import("styled-components").StyledComponent<"span", any, {}, never>;
|
|
14
|
+
export declare const StyledListItemHeadSubtitle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
15
|
+
export declare const StyledListItemHeadSubtitleText: import("styled-components").StyledComponent<"span", any, {}, never>;
|
|
16
|
+
export declare const StyledListItemHeadTopRightElement: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
17
|
+
export declare const StyledListItemHeadBottomRightElement: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
18
|
+
export declare const StyledListItemHeadRightElement: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
19
|
+
export declare const StyledMotionListItemHeadHoverItem: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, {}, never>;
|
|
20
|
+
export {};
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.StyledMotionListItemHeadIndicator = exports.StyledMotionListItemHeadHoverItem = exports.StyledListItemHeadTopRightElement = exports.StyledListItemHeadTitleText = exports.StyledListItemHeadTitle = exports.StyledListItemHeadSubtitleText = exports.StyledListItemHeadSubtitle = exports.StyledListItemHeadRightElement = exports.StyledListItemHeadContent = exports.StyledListItemHeadBottomRightElement = exports.StyledListItemHead = void 0;
|
|
7
|
+
var _framerMotion = require("framer-motion");
|
|
8
|
+
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
9
|
+
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); }
|
|
10
|
+
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; }
|
|
11
|
+
const StyledListItemHead = _styledComponents.default.div`
|
|
12
|
+
align-items: center;
|
|
13
|
+
color: ${_ref => {
|
|
14
|
+
let {
|
|
15
|
+
theme
|
|
16
|
+
} = _ref;
|
|
17
|
+
return theme.text;
|
|
18
|
+
}};
|
|
19
|
+
display: flex;
|
|
20
|
+
height: 64px;
|
|
21
|
+
padding: 12px 9px;
|
|
22
|
+
|
|
23
|
+
${_ref2 => {
|
|
24
|
+
let {
|
|
25
|
+
isClickable
|
|
26
|
+
} = _ref2;
|
|
27
|
+
return isClickable && (0, _styledComponents.css)`
|
|
28
|
+
cursor: pointer;
|
|
29
|
+
`;
|
|
30
|
+
}}
|
|
31
|
+
`;
|
|
32
|
+
exports.StyledListItemHead = StyledListItemHead;
|
|
33
|
+
const StyledMotionListItemHeadIndicator = (0, _styledComponents.default)(_framerMotion.motion.div)`
|
|
34
|
+
align-items: center;
|
|
35
|
+
display: flex;
|
|
36
|
+
flex: 0 0 auto;
|
|
37
|
+
height: 26px;
|
|
38
|
+
justify-content: center;
|
|
39
|
+
width: 26px;
|
|
40
|
+
`;
|
|
41
|
+
exports.StyledMotionListItemHeadIndicator = StyledMotionListItemHeadIndicator;
|
|
42
|
+
const StyledListItemHeadContent = _styledComponents.default.div`
|
|
43
|
+
display: flex;
|
|
44
|
+
flex: 1 1 auto;
|
|
45
|
+
flex-direction: column;
|
|
46
|
+
font-weight: ${_ref3 => {
|
|
47
|
+
let {
|
|
48
|
+
isOpen
|
|
49
|
+
} = _ref3;
|
|
50
|
+
return isOpen ? 'bold' : 'normal';
|
|
51
|
+
}};
|
|
52
|
+
justify-content: center;
|
|
53
|
+
line-height: normal;
|
|
54
|
+
margin-left: ${_ref4 => {
|
|
55
|
+
let {
|
|
56
|
+
isIconOrImageGiven
|
|
57
|
+
} = _ref4;
|
|
58
|
+
return isIconOrImageGiven ? '10px' : undefined;
|
|
59
|
+
}};
|
|
60
|
+
min-width: 0;
|
|
61
|
+
`;
|
|
62
|
+
exports.StyledListItemHeadContent = StyledListItemHeadContent;
|
|
63
|
+
const StyledListItemHeadTitle = _styledComponents.default.div`
|
|
64
|
+
align-items: center;
|
|
65
|
+
display: flex;
|
|
66
|
+
justify-content: space-between;
|
|
67
|
+
`;
|
|
68
|
+
exports.StyledListItemHeadTitle = StyledListItemHeadTitle;
|
|
69
|
+
const StyledListItemHeadTitleText = _styledComponents.default.span`
|
|
70
|
+
flex: 1 1 auto;
|
|
71
|
+
min-width: 0;
|
|
72
|
+
`;
|
|
73
|
+
exports.StyledListItemHeadTitleText = StyledListItemHeadTitleText;
|
|
74
|
+
const StyledListItemHeadSubtitle = _styledComponents.default.div`
|
|
75
|
+
align-items: center;
|
|
76
|
+
display: flex;
|
|
77
|
+
justify-content: space-between;
|
|
78
|
+
margin-top: 2px;
|
|
79
|
+
opacity: 0.75;
|
|
80
|
+
`;
|
|
81
|
+
exports.StyledListItemHeadSubtitle = StyledListItemHeadSubtitle;
|
|
82
|
+
const StyledListItemHeadSubtitleText = _styledComponents.default.span`
|
|
83
|
+
flex: 1 1 auto;
|
|
84
|
+
font-size: 85%;
|
|
85
|
+
min-width: 0;
|
|
86
|
+
`;
|
|
87
|
+
exports.StyledListItemHeadSubtitleText = StyledListItemHeadSubtitleText;
|
|
88
|
+
const StyledListItemHeadTopRightElement = _styledComponents.default.div`
|
|
89
|
+
flex: 0 0 auto;
|
|
90
|
+
font-size: 85%;
|
|
91
|
+
margin-left: 8px;
|
|
92
|
+
opacity: 0.75;
|
|
93
|
+
`;
|
|
94
|
+
exports.StyledListItemHeadTopRightElement = StyledListItemHeadTopRightElement;
|
|
95
|
+
const StyledListItemHeadBottomRightElement = _styledComponents.default.div`
|
|
96
|
+
flex: 0 0 auto;
|
|
97
|
+
margin-left: 8px;
|
|
98
|
+
font-size: 85%;
|
|
99
|
+
`;
|
|
100
|
+
exports.StyledListItemHeadBottomRightElement = StyledListItemHeadBottomRightElement;
|
|
101
|
+
const StyledListItemHeadRightElement = _styledComponents.default.div`
|
|
102
|
+
flex: 0 0 auto;
|
|
103
|
+
margin-left: 8px;
|
|
104
|
+
`;
|
|
105
|
+
exports.StyledListItemHeadRightElement = StyledListItemHeadRightElement;
|
|
106
|
+
const StyledMotionListItemHeadHoverItem = (0, _styledComponents.default)(_framerMotion.motion.div)`
|
|
107
|
+
overflow: hidden;
|
|
108
|
+
`;
|
|
109
|
+
exports.StyledMotionListItemHeadHoverItem = StyledMotionListItemHeadHoverItem;
|
|
110
|
+
//# sourceMappingURL=ListItemHead.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ListItemHead.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","StyledListItemHead","styled","div","_ref","theme","text","_ref2","isClickable","css","exports","StyledMotionListItemHeadIndicator","motion","StyledListItemHeadContent","_ref3","isOpen","_ref4","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":"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"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _Icon = _interopRequireDefault(require("../../../../icon/Icon"));
|
|
9
|
+
var _ListItemIcon = require("./ListItemIcon.styles");
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
+
const ListItemIcon = _ref => {
|
|
12
|
+
let {
|
|
13
|
+
icons
|
|
14
|
+
} = _ref;
|
|
15
|
+
return /*#__PURE__*/_react.default.createElement(_ListItemIcon.StyledListItemIcon, null, /*#__PURE__*/_react.default.createElement(_Icon.default, {
|
|
16
|
+
icons: icons,
|
|
17
|
+
size: 22
|
|
18
|
+
}));
|
|
19
|
+
};
|
|
20
|
+
ListItemIcon.displayName = 'ListItemIcon';
|
|
21
|
+
var _default = ListItemIcon;
|
|
22
|
+
exports.default = _default;
|
|
23
|
+
//# sourceMappingURL=ListItemIcon.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ListItemIcon.js","names":["_react","_interopRequireDefault","require","_Icon","_ListItemIcon","obj","__esModule","default","ListItemIcon","_ref","icons","createElement","StyledListItemIcon","size","displayName","_default","exports"],"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,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,KAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,aAAA,GAAAF,OAAA;AAA2D,SAAAD,uBAAAI,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAM3D,MAAMG,YAAyC,GAAGC,IAAA,IAAe;EAAA,IAAd;IAAEC;EAAM,CAAC,GAAAD,IAAA;EACxD,oBACIT,MAAA,CAAAO,OAAA,CAAAI,aAAA,CAACP,aAAA,CAAAQ,kBAAkB,qBACfZ,MAAA,CAAAO,OAAA,CAAAI,aAAA,CAACR,KAAA,CAAAI,OAAI;IAACG,KAAK,EAAEA,KAAM;IAACG,IAAI,EAAE;EAAG,EAAG,CACf;AAE7B,CAAC;AAEDL,YAAY,CAACM,WAAW,GAAG,cAAc;AAAC,IAAAC,QAAA,GAE3BP,YAAY;AAAAQ,OAAA,CAAAT,OAAA,GAAAQ,QAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const StyledListItemIcon: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.StyledListItemIcon = void 0;
|
|
7
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
8
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
9
|
+
const StyledListItemIcon = _styledComponents.default.div`
|
|
10
|
+
align-items: center;
|
|
11
|
+
background-color: rgba(${_ref => {
|
|
12
|
+
let {
|
|
13
|
+
theme
|
|
14
|
+
} = _ref;
|
|
15
|
+
return theme['text-rgb'];
|
|
16
|
+
}}, 0.1);
|
|
17
|
+
box-shadow: 0 0 0 1px rgba(${_ref2 => {
|
|
18
|
+
let {
|
|
19
|
+
theme
|
|
20
|
+
} = _ref2;
|
|
21
|
+
return theme['009-rgb'];
|
|
22
|
+
}}, 0.08)
|
|
23
|
+
inset;
|
|
24
|
+
display: flex;
|
|
25
|
+
flex: 0 0 auto;
|
|
26
|
+
height: 40px;
|
|
27
|
+
justify-content: center;
|
|
28
|
+
margin-right: 10px;
|
|
29
|
+
width: 40px;
|
|
30
|
+
`;
|
|
31
|
+
exports.StyledListItemIcon = StyledListItemIcon;
|
|
32
|
+
//# sourceMappingURL=ListItemIcon.styles.js.map
|
package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ListItemIcon.styles.js","names":["_styledComponents","_interopRequireDefault","require","obj","__esModule","default","StyledListItemIcon","styled","div","_ref","theme","_ref2","exports"],"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,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAKhC,MAAMG,kBAAkB,GAAGC,yBAAM,CAACC,GAAI;AAC7C;AACA,6BAA6BC,IAAA;EAAA,IAAC;IAAEC;EAA+B,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,UAAU,CAAC;AAAA,CAAC;AACvF,iCAAiCC,KAAA;EAAA,IAAC;IAAED;EAA+B,CAAC,GAAAC,KAAA;EAAA,OAAKD,KAAK,CAAC,SAAS,CAAC;AAAA,CAAC;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAACE,OAAA,CAAAN,kBAAA,GAAAA,kBAAA"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _GridImage = _interopRequireDefault(require("../../../../grid-image/GridImage"));
|
|
9
|
+
var _ListItemImage = require("./ListItemImage.styles");
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
+
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); }
|
|
12
|
+
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; }
|
|
13
|
+
const ListItemImage = _ref => {
|
|
14
|
+
let {
|
|
15
|
+
images,
|
|
16
|
+
shouldShowRoundImage
|
|
17
|
+
} = _ref;
|
|
18
|
+
const [hasLoadedImage, setHasLoadedImage] = (0, _react.useState)(false);
|
|
19
|
+
const handleImageLoaded = (0, _react.useCallback)(() => {
|
|
20
|
+
setHasLoadedImage(true);
|
|
21
|
+
}, []);
|
|
22
|
+
if (images && images[0] && images[1] && images[2]) {
|
|
23
|
+
const gridImages = [images[0], images[1], images[2]];
|
|
24
|
+
return /*#__PURE__*/_react.default.createElement(_GridImage.default, {
|
|
25
|
+
images: gridImages,
|
|
26
|
+
shouldShowRoundImage: shouldShowRoundImage,
|
|
27
|
+
size: 40
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
if (images && images[0]) {
|
|
31
|
+
return /*#__PURE__*/_react.default.createElement(_ListItemImage.StyledListItemHeadImageWrapper, {
|
|
32
|
+
shouldShowRoundImage: shouldShowRoundImage
|
|
33
|
+
}, /*#__PURE__*/_react.default.createElement(_ListItemImage.StyledListItemHeadImage, {
|
|
34
|
+
isHidden: !hasLoadedImage,
|
|
35
|
+
onLoad: handleImageLoaded,
|
|
36
|
+
src: images[0]
|
|
37
|
+
}));
|
|
38
|
+
}
|
|
39
|
+
return null;
|
|
40
|
+
};
|
|
41
|
+
ListItemImage.displayName = 'ListItemImage';
|
|
42
|
+
var _default = ListItemImage;
|
|
43
|
+
exports.default = _default;
|
|
44
|
+
//# sourceMappingURL=ListItemImage.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ListItemImage.js","names":["_react","_interopRequireWildcard","require","_GridImage","_interopRequireDefault","_ListItemImage","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","ListItemImage","_ref","images","shouldShowRoundImage","hasLoadedImage","setHasLoadedImage","useState","handleImageLoaded","useCallback","gridImages","createElement","size","StyledListItemHeadImageWrapper","StyledListItemHeadImage","isHidden","onLoad","src","displayName","_default","exports"],"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":"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"}
|
package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.d.ts
ADDED
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export declare const StyledListItemHeadImageWrapper: import("styled-components").StyledComponent<"div", any, {
|
|
2
|
+
shouldShowRoundImage?: boolean | undefined;
|
|
3
|
+
} & {
|
|
4
|
+
theme: import("../../../../color-scheme-provider/ColorSchemeProvider").Theme;
|
|
5
|
+
}, never>;
|
|
6
|
+
type StyledListItemHeadImageProps = {
|
|
7
|
+
isHidden: boolean;
|
|
8
|
+
};
|
|
9
|
+
export declare const StyledListItemHeadImage: import("styled-components").StyledComponent<"img", any, StyledListItemHeadImageProps, never>;
|
|
10
|
+
export {};
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.StyledListItemHeadImageWrapper = exports.StyledListItemHeadImage = void 0;
|
|
7
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
8
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
9
|
+
const StyledListItemHeadImageWrapper = _styledComponents.default.div`
|
|
10
|
+
background-color: rgba(
|
|
11
|
+
${_ref => {
|
|
12
|
+
let {
|
|
13
|
+
theme
|
|
14
|
+
} = _ref;
|
|
15
|
+
return theme['text-rgb'];
|
|
16
|
+
}},
|
|
17
|
+
0.1
|
|
18
|
+
);
|
|
19
|
+
border-radius: ${_ref2 => {
|
|
20
|
+
let {
|
|
21
|
+
shouldShowRoundImage
|
|
22
|
+
} = _ref2;
|
|
23
|
+
return shouldShowRoundImage ? '50%' : undefined;
|
|
24
|
+
}};
|
|
25
|
+
box-shadow: 0 0 0 1px
|
|
26
|
+
rgba(${_ref3 => {
|
|
27
|
+
let {
|
|
28
|
+
theme
|
|
29
|
+
} = _ref3;
|
|
30
|
+
return theme['009-rgb'];
|
|
31
|
+
}}, 0.08) inset;
|
|
32
|
+
flex: 0 0 auto;
|
|
33
|
+
height: 40px;
|
|
34
|
+
overflow: hidden;
|
|
35
|
+
transition: border-radius 0.3s ease;
|
|
36
|
+
width: 40px;
|
|
37
|
+
`;
|
|
38
|
+
exports.StyledListItemHeadImageWrapper = StyledListItemHeadImageWrapper;
|
|
39
|
+
const StyledListItemHeadImage = _styledComponents.default.img`
|
|
40
|
+
height: 100%;
|
|
41
|
+
object-fit: cover;
|
|
42
|
+
opacity: ${_ref4 => {
|
|
43
|
+
let {
|
|
44
|
+
isHidden
|
|
45
|
+
} = _ref4;
|
|
46
|
+
return isHidden ? 0 : 1;
|
|
47
|
+
}};
|
|
48
|
+
transition: opacity 0.4s ease;
|
|
49
|
+
width: 100%;
|
|
50
|
+
`;
|
|
51
|
+
exports.StyledListItemHeadImage = StyledListItemHeadImage;
|
|
52
|
+
//# sourceMappingURL=ListItemImage.styles.js.map
|
package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ListItemImage.styles.js","names":["_styledComponents","_interopRequireDefault","require","obj","__esModule","default","StyledListItemHeadImageWrapper","styled","div","_ref","theme","_ref2","shouldShowRoundImage","undefined","_ref3","exports","StyledListItemHeadImage","img","_ref4","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,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAOhC,MAAMG,8BAA8B,GAAGC,yBAAM,CAACC,GAAyC;AAC9F;AACA,UAAUC,IAAA;EAAA,IAAC;IAAEC;EAA2C,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,UAAU,CAAC;AAAA,CAAC;AAChF;AACA;AACA,qBAAqBC,KAAA;EAAA,IAAC;IAAEC;EAAqB,CAAC,GAAAD,KAAA;EAAA,OAAMC,oBAAoB,GAAG,KAAK,GAAGC,SAAS;AAAA,CAAE;AAC9F;AACA,eAAeC,KAAA;EAAA,IAAC;IAAEJ;EAA2C,CAAC,GAAAI,KAAA;EAAA,OAAKJ,KAAK,CAAC,SAAS,CAAC;AAAA,CAAC;AACpF;AACA;AACA;AACA;AACA;AACA,CAAC;AAACK,OAAA,CAAAT,8BAAA,GAAAA,8BAAA;AAMK,MAAMU,uBAAuB,GAAGT,yBAAM,CAACU,GAAkC;AAChF;AACA;AACA,eAAeC,KAAA;EAAA,IAAC;IAAEC;EAAS,CAAC,GAAAD,KAAA;EAAA,OAAMC,QAAQ,GAAG,CAAC,GAAG,CAAC;AAAA,CAAE;AACpD;AACA;AACA,CAAC;AAACJ,OAAA,CAAAC,uBAAA,GAAAA,uBAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const useUuid: () => string;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useUuid = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var _uuid = require("uuid");
|
|
9
|
+
const useUuid = () => {
|
|
10
|
+
const [uuid] = (0, _react.useState)((0, _uuid.v4)());
|
|
11
|
+
return uuid;
|
|
12
|
+
};
|
|
13
|
+
exports.useUuid = useUuid;
|
|
14
|
+
//# sourceMappingURL=uuid.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"uuid.js","names":["_react","require","_uuid","useUuid","uuid","useState","uuidV4","exports"],"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,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AAEO,MAAME,OAAO,GAAGA,CAAA,KAAM;EACzB,MAAM,CAACC,IAAI,CAAC,GAAG,IAAAC,eAAQ,EAAC,IAAAC,QAAM,GAAE,CAAC;EAEjC,OAAOF,IAAI;AACf,CAAC;AAACG,OAAA,CAAAJ,OAAA,GAAAA,OAAA"}
|
package/lib/index.d.ts
CHANGED
|
@@ -1,6 +1,16 @@
|
|
|
1
1
|
export { default as Accordion } from './components/accordion/Accordion';
|
|
2
2
|
export { default as AccordionContent } from './components/accordion/accordion-content/AccordionContent';
|
|
3
|
+
export { default as AccordionGroup } from './components/accordion/accordion-group/AccordionGroup';
|
|
4
|
+
export { default as AccordionIntro } from './components/accordion/accordion-intro/AccordionIntro';
|
|
3
5
|
export { default as Badge } from './components/badge/Badge';
|
|
4
6
|
export { default as Button } from './components/button/Button';
|
|
7
|
+
export { default as Checkbox } from './components/checkbox/Checkbox';
|
|
5
8
|
export { default as ColorSchemeProvider } from './components/color-scheme-provider/ColorSchemeProvider';
|
|
9
|
+
export type { WithTheme } from './components/color-scheme-provider/ColorSchemeProvider';
|
|
10
|
+
export { default as ContextMenu } from './components/context-menu/ContextMenu';
|
|
11
|
+
export { default as GridImage } from './components/grid-image/GridImage';
|
|
6
12
|
export { default as Icon } from './components/icon/Icon';
|
|
13
|
+
export { default as Input } from './components/input/Input';
|
|
14
|
+
export { default as List } from './components/list/List';
|
|
15
|
+
export { default as ListItemContent } from './components/list/list-item/list-item-content/ListItemContent';
|
|
16
|
+
export { default as ListItem } from './components/list/list-item/ListItem';
|