@chayns-components/core 5.0.0-beta.8 → 5.0.0-beta.86

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (150) hide show
  1. package/README.md +3 -9
  2. package/lib/components/accordion/Accordion.d.ts +50 -8
  3. package/lib/components/accordion/Accordion.js +84 -83
  4. package/lib/components/accordion/Accordion.js.map +1 -1
  5. package/lib/components/accordion/Accordion.styles.d.ts +6 -5
  6. package/lib/components/accordion/Accordion.styles.js +67 -26
  7. package/lib/components/accordion/Accordion.styles.js.map +1 -1
  8. package/lib/components/accordion/accordion-body/AccordionBody.d.ts +13 -2
  9. package/lib/components/accordion/accordion-body/AccordionBody.js +19 -11
  10. package/lib/components/accordion/accordion-body/AccordionBody.js.map +1 -1
  11. package/lib/components/accordion/accordion-body/AccordionBody.styles.d.ts +4 -1
  12. package/lib/components/accordion/accordion-body/AccordionBody.styles.js +15 -10
  13. package/lib/components/accordion/accordion-body/AccordionBody.styles.js.map +1 -1
  14. package/lib/components/accordion/accordion-content/AccordionContent.d.ts +11 -3
  15. package/lib/components/accordion/accordion-content/AccordionContent.js +13 -11
  16. package/lib/components/accordion/accordion-content/AccordionContent.js.map +1 -1
  17. package/lib/components/accordion/accordion-content/AccordionContent.styles.d.ts +5 -4
  18. package/lib/components/accordion/accordion-content/AccordionContent.styles.js +25 -12
  19. package/lib/components/accordion/accordion-content/AccordionContent.styles.js.map +1 -1
  20. package/lib/components/accordion/accordion-group/AccordionGroup.d.ts +26 -0
  21. package/lib/components/accordion/accordion-group/AccordionGroup.js +57 -0
  22. package/lib/components/accordion/accordion-group/AccordionGroup.js.map +1 -0
  23. package/lib/components/accordion/accordion-head/AccordionHead.d.ts +9 -4
  24. package/lib/components/accordion/accordion-head/AccordionHead.js +83 -60
  25. package/lib/components/accordion/accordion-head/AccordionHead.js.map +1 -1
  26. package/lib/components/accordion/accordion-head/AccordionHead.styles.d.ts +11 -6
  27. package/lib/components/accordion/accordion-head/AccordionHead.styles.js +143 -35
  28. package/lib/components/accordion/accordion-head/AccordionHead.styles.js.map +1 -1
  29. package/lib/components/accordion/accordion-intro/AccordionIntro.d.ts +9 -0
  30. package/lib/components/accordion/accordion-intro/AccordionIntro.js +21 -0
  31. package/lib/components/accordion/accordion-intro/AccordionIntro.js.map +1 -0
  32. package/lib/components/accordion/accordion-intro/AccordionIntro.styles.d.ts +1 -0
  33. package/lib/components/accordion/accordion-intro/AccordionIntro.styles.js +13 -0
  34. package/lib/components/accordion/accordion-intro/AccordionIntro.styles.js.map +1 -0
  35. package/lib/components/accordion/utils.js +10 -12
  36. package/lib/components/accordion/utils.js.map +1 -1
  37. package/lib/components/badge/Badge.d.ts +9 -1
  38. package/lib/components/badge/Badge.js +12 -12
  39. package/lib/components/badge/Badge.js.map +1 -1
  40. package/lib/components/badge/Badge.styles.d.ts +4 -1
  41. package/lib/components/badge/Badge.styles.js +22 -15
  42. package/lib/components/badge/Badge.styles.js.map +1 -1
  43. package/lib/components/button/Button.d.ts +2 -2
  44. package/lib/components/button/Button.js +12 -20
  45. package/lib/components/button/Button.js.map +1 -1
  46. package/lib/components/button/Button.styles.d.ts +2 -0
  47. package/lib/components/button/Button.styles.js +47 -24
  48. package/lib/components/button/Button.styles.js.map +1 -1
  49. package/lib/components/checkbox/Checkbox.d.ts +25 -0
  50. package/lib/components/checkbox/Checkbox.js +44 -0
  51. package/lib/components/checkbox/Checkbox.js.map +1 -0
  52. package/lib/components/checkbox/Checkbox.styles.d.ts +6 -0
  53. package/lib/components/checkbox/Checkbox.styles.js +131 -0
  54. package/lib/components/checkbox/Checkbox.styles.js.map +1 -0
  55. package/lib/components/color-scheme-provider/ColorSchemeProvider.d.ts +7 -1
  56. package/lib/components/color-scheme-provider/ColorSchemeProvider.js +41 -78
  57. package/lib/components/color-scheme-provider/ColorSchemeProvider.js.map +1 -1
  58. package/lib/components/color-scheme-provider/font.d.ts +6 -0
  59. package/lib/components/color-scheme-provider/font.js +59 -0
  60. package/lib/components/color-scheme-provider/font.js.map +1 -0
  61. package/lib/components/context-menu/ContextMenu.d.ts +51 -0
  62. package/lib/components/context-menu/ContextMenu.js +155 -0
  63. package/lib/components/context-menu/ContextMenu.js.map +1 -0
  64. package/lib/components/context-menu/ContextMenu.styles.d.ts +1 -0
  65. package/lib/components/context-menu/ContextMenu.styles.js +13 -0
  66. package/lib/components/context-menu/ContextMenu.styles.js.map +1 -0
  67. package/lib/components/context-menu/constants/alignment.d.ts +8 -0
  68. package/lib/components/context-menu/constants/alignment.js +17 -0
  69. package/lib/components/context-menu/constants/alignment.js.map +1 -0
  70. package/lib/components/context-menu/context-menu-content/ContextMenuContent.d.ts +10 -0
  71. package/lib/components/context-menu/context-menu-content/ContextMenuContent.js +78 -0
  72. package/lib/components/context-menu/context-menu-content/ContextMenuContent.js.map +1 -0
  73. package/lib/components/context-menu/context-menu-content/ContextMenuContent.styles.d.ts +11 -0
  74. package/lib/components/context-menu/context-menu-content/ContextMenuContent.styles.js +117 -0
  75. package/lib/components/context-menu/context-menu-content/ContextMenuContent.styles.js.map +1 -0
  76. package/lib/components/grid-image/GridImage.d.ts +19 -0
  77. package/lib/components/grid-image/GridImage.js +46 -0
  78. package/lib/components/grid-image/GridImage.js.map +1 -0
  79. package/lib/components/grid-image/GridImage.styles.d.ts +21 -0
  80. package/lib/components/grid-image/GridImage.styles.js +105 -0
  81. package/lib/components/grid-image/GridImage.styles.js.map +1 -0
  82. package/lib/components/icon/Icon.d.ts +11 -3
  83. package/lib/components/icon/Icon.js +32 -30
  84. package/lib/components/icon/Icon.js.map +1 -1
  85. package/lib/components/icon/Icon.styles.d.ts +8 -1
  86. package/lib/components/icon/Icon.styles.js +64 -42
  87. package/lib/components/icon/Icon.styles.js.map +1 -1
  88. package/lib/components/icon/utils.js +2 -5
  89. package/lib/components/icon/utils.js.map +1 -1
  90. package/lib/components/input/Input.d.ts +37 -0
  91. package/lib/components/input/Input.js +77 -0
  92. package/lib/components/input/Input.js.map +1 -0
  93. package/lib/components/input/Input.styles.d.ts +7 -0
  94. package/lib/components/input/Input.styles.js +71 -0
  95. package/lib/components/input/Input.styles.js.map +1 -0
  96. package/lib/components/lazy-motion-wrapper/LazyMotionWrapper.d.ts +6 -0
  97. package/lib/components/lazy-motion-wrapper/LazyMotionWrapper.js +24 -0
  98. package/lib/components/lazy-motion-wrapper/LazyMotionWrapper.js.map +1 -0
  99. package/lib/components/list/List.d.ts +18 -0
  100. package/lib/components/list/List.js +56 -0
  101. package/lib/components/list/List.js.map +1 -0
  102. package/lib/components/list/list-item/ListItem.d.ts +67 -0
  103. package/lib/components/list/list-item/ListItem.js +90 -0
  104. package/lib/components/list/list-item/ListItem.js.map +1 -0
  105. package/lib/components/list/list-item/ListItem.styles.d.ts +6 -0
  106. package/lib/components/list/list-item/ListItem.styles.js +56 -0
  107. package/lib/components/list/list-item/ListItem.styles.js.map +1 -0
  108. package/lib/components/list/list-item/list-item-body/ListItemBody.d.ts +3 -0
  109. package/lib/components/list/list-item/list-item-body/ListItemBody.js +36 -0
  110. package/lib/components/list/list-item/list-item-body/ListItemBody.js.map +1 -0
  111. package/lib/components/list/list-item/list-item-body/ListItemBody.styles.d.ts +1 -0
  112. package/lib/components/list/list-item/list-item-body/ListItemBody.styles.js +14 -0
  113. package/lib/components/list/list-item/list-item-body/ListItemBody.styles.js.map +1 -0
  114. package/lib/components/list/list-item/list-item-content/ListItemContent.d.ts +3 -0
  115. package/lib/components/list/list-item/list-item-content/ListItemContent.js +21 -0
  116. package/lib/components/list/list-item/list-item-content/ListItemContent.js.map +1 -0
  117. package/lib/components/list/list-item/list-item-content/ListItemContent.styles.d.ts +1 -0
  118. package/lib/components/list/list-item/list-item-content/ListItemContent.styles.js +19 -0
  119. package/lib/components/list/list-item/list-item-content/ListItemContent.styles.js.map +1 -0
  120. package/lib/components/list/list-item/list-item-head/ListItemHead.d.ts +18 -0
  121. package/lib/components/list/list-item/list-item-head/ListItemHead.js +100 -0
  122. package/lib/components/list/list-item/list-item-head/ListItemHead.js.map +1 -0
  123. package/lib/components/list/list-item/list-item-head/ListItemHead.styles.d.ts +20 -0
  124. package/lib/components/list/list-item/list-item-head/ListItemHead.styles.js +110 -0
  125. package/lib/components/list/list-item/list-item-head/ListItemHead.styles.js.map +1 -0
  126. package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.d.ts +6 -0
  127. package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.js +23 -0
  128. package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.js.map +1 -0
  129. package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.d.ts +1 -0
  130. package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.js +32 -0
  131. package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.js.map +1 -0
  132. package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.d.ts +7 -0
  133. package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.js +44 -0
  134. package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.js.map +1 -0
  135. package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.d.ts +10 -0
  136. package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.js +52 -0
  137. package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.js.map +1 -0
  138. package/lib/hooks/uuid.d.ts +1 -0
  139. package/lib/hooks/uuid.js +14 -0
  140. package/lib/hooks/uuid.js.map +1 -0
  141. package/lib/index.d.ts +11 -0
  142. package/lib/index.js +76 -13
  143. package/lib/index.js.map +1 -1
  144. package/lib/types/chayns.d.ts +57 -0
  145. package/lib/types/chayns.js +14 -0
  146. package/lib/types/chayns.js.map +1 -0
  147. package/lib/utils/motion-features.d.ts +2 -0
  148. package/lib/utils/motion-features.js +10 -0
  149. package/lib/utils/motion-features.js.map +1 -0
  150. package/package.json +64 -62
@@ -0,0 +1,77 @@
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 _LazyMotionWrapper = _interopRequireDefault(require("../lazy-motion-wrapper/LazyMotionWrapper"));
9
+ var _Input = require("./Input.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 Input = _ref => {
14
+ let {
15
+ isDisabled,
16
+ onBlur,
17
+ onChange,
18
+ onFocus,
19
+ onKeyDown,
20
+ placeholder,
21
+ type = 'text',
22
+ value
23
+ } = _ref;
24
+ const [hasValue, setHasValue] = (0, _react.useState)(typeof value === 'string' && value !== '');
25
+ const handleInputFieldChange = (0, _react.useCallback)(event => {
26
+ setHasValue(event.target.value !== '');
27
+ if (typeof onChange === 'function') {
28
+ onChange(event);
29
+ }
30
+ }, [onChange]);
31
+ (0, _react.useEffect)(() => {
32
+ if (typeof value === 'string') {
33
+ setHasValue(value !== '');
34
+ }
35
+ }, [value]);
36
+ const labelPosition = (0, _react.useMemo)(() => {
37
+ if (hasValue) {
38
+ return {
39
+ bottom: -8,
40
+ right: -6
41
+ };
42
+ }
43
+ return {
44
+ left: 0,
45
+ top: 0
46
+ };
47
+ }, [hasValue]);
48
+ return /*#__PURE__*/_react.default.createElement(_LazyMotionWrapper.default, null, /*#__PURE__*/_react.default.createElement(_Input.StyledInput, {
49
+ className: "beta-chayns-input",
50
+ isDisabled: isDisabled
51
+ }, /*#__PURE__*/_react.default.createElement(_Input.StyledInputContent, null, /*#__PURE__*/_react.default.createElement(_Input.StyledInputField, {
52
+ disabled: isDisabled,
53
+ onBlur: onBlur,
54
+ onChange: handleInputFieldChange,
55
+ onFocus: onFocus,
56
+ onKeyDown: onKeyDown,
57
+ value: value,
58
+ type: type
59
+ }), /*#__PURE__*/_react.default.createElement(_Input.StyledMotionInputLabel, {
60
+ animate: {
61
+ scale: hasValue ? 0.6 : 1
62
+ },
63
+ layout: true,
64
+ style: {
65
+ ...labelPosition,
66
+ originX: 1,
67
+ originY: 1
68
+ },
69
+ transition: {
70
+ type: 'tween'
71
+ }
72
+ }, placeholder))));
73
+ };
74
+ Input.displayName = 'Input';
75
+ var _default = Input;
76
+ exports.default = _default;
77
+ //# sourceMappingURL=Input.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Input.js","names":["_react","_interopRequireWildcard","require","_LazyMotionWrapper","_interopRequireDefault","_Input","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","Input","_ref","isDisabled","onBlur","onChange","onFocus","onKeyDown","placeholder","type","value","hasValue","setHasValue","useState","handleInputFieldChange","useCallback","event","target","useEffect","labelPosition","useMemo","bottom","right","left","top","createElement","StyledInput","className","StyledInputContent","StyledInputField","disabled","StyledMotionInputLabel","animate","scale","layout","style","originX","originY","transition","displayName","_default","exports"],"sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n ChangeEventHandler,\n FC,\n FocusEventHandler,\n HTMLInputTypeAttribute,\n KeyboardEventHandler,\n useCallback,\n useEffect,\n useMemo,\n useState,\n} from 'react';\nimport LazyMotionWrapper from '../lazy-motion-wrapper/LazyMotionWrapper';\nimport {\n StyledInput,\n StyledInputContent,\n StyledInputField,\n StyledMotionInputLabel,\n} from './Input.styles';\n\nexport type InputProps = {\n /**\n * Disables the input so that it cannot be changed anymore\n */\n isDisabled?: boolean;\n /**\n * Function that is executed when the input field loses focus\n */\n onBlur?: FocusEventHandler<HTMLInputElement>;\n /**\n * Function that is executed when the text of the input changes\n */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Function that is executed when the input field is focused\n */\n onFocus?: FocusEventHandler<HTMLInputElement>;\n /**\n * Function that is executed when a letter is pressed\n */\n onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n /**\n * Placeholder for the input field\n */\n placeholder?: string;\n /**\n * Input type set for input element (e.g. 'text', 'number' or 'password')\n */\n type?: HTMLInputTypeAttribute;\n /**\n * Value if the input field should be controlled\n */\n value?: string;\n};\n\nconst Input: FC<InputProps> = ({\n isDisabled,\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n placeholder,\n type = 'text',\n value,\n}) => {\n const [hasValue, setHasValue] = useState(typeof value === 'string' && value !== '');\n\n const handleInputFieldChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n setHasValue(event.target.value !== '');\n\n if (typeof onChange === 'function') {\n onChange(event);\n }\n },\n [onChange]\n );\n\n useEffect(() => {\n if (typeof value === 'string') {\n setHasValue(value !== '');\n }\n }, [value]);\n\n const labelPosition = useMemo(() => {\n if (hasValue) {\n return { bottom: -8, right: -6 };\n }\n\n return { left: 0, top: 0 };\n }, [hasValue]);\n\n return (\n <LazyMotionWrapper>\n <StyledInput className=\"beta-chayns-input\" isDisabled={isDisabled}>\n <StyledInputContent>\n <StyledInputField\n disabled={isDisabled}\n onBlur={onBlur}\n onChange={handleInputFieldChange}\n onFocus={onFocus}\n onKeyDown={onKeyDown}\n value={value}\n type={type}\n />\n <StyledMotionInputLabel\n animate={{ scale: hasValue ? 0.6 : 1 }}\n layout\n style={{ ...labelPosition, originX: 1, originY: 1 }}\n transition={{ type: 'tween' }}\n >\n {placeholder}\n </StyledMotionInputLabel>\n </StyledInputContent>\n </StyledInput>\n </LazyMotionWrapper>\n );\n};\n\nInput.displayName = 'Input';\n\nexport default Input;\n"],"mappings":"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"}
@@ -0,0 +1,7 @@
1
+ import type { InputProps } from './Input';
2
+ export declare const StyledInput: import("styled-components").StyledComponent<"div", any, Pick<InputProps, "isDisabled"> & {
3
+ theme: import("../color-scheme-provider/ColorSchemeProvider").Theme;
4
+ }, never>;
5
+ export declare const StyledInputContent: import("styled-components").StyledComponent<"div", any, {}, never>;
6
+ export declare const StyledInputField: import("styled-components").StyledComponent<"input", any, {}, never>;
7
+ export declare const StyledMotionInputLabel: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLLabelElement, import("framer-motion").HTMLMotionProps<"label">>, any, {}, never>;
@@ -0,0 +1,71 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.StyledMotionInputLabel = exports.StyledInputField = exports.StyledInputContent = exports.StyledInput = void 0;
7
+ var _framerMotion = require("framer-motion");
8
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
9
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
+ const StyledInput = _styledComponents.default.div`
11
+ align-items: center;
12
+ background-color: ${_ref => {
13
+ let {
14
+ theme
15
+ } = _ref;
16
+ return theme['100'];
17
+ }};
18
+ border: 1px solid rgba(160, 160, 160, 0.3);
19
+ border-radius: 3px;
20
+ color: ${_ref2 => {
21
+ let {
22
+ theme
23
+ } = _ref2;
24
+ return theme['006'];
25
+ }};
26
+ display: flex;
27
+ justify-content: space-between;
28
+ min-height: 42px;
29
+ opacity: ${_ref3 => {
30
+ let {
31
+ isDisabled
32
+ } = _ref3;
33
+ return isDisabled ? 0.5 : 1;
34
+ }};
35
+ padding: 8px 10px;
36
+ transition: opacity 0.3s ease;
37
+ width: 100%;
38
+
39
+ &:not(&:first-child) {
40
+ margin-top: 8px;
41
+ }
42
+ `;
43
+ exports.StyledInput = StyledInput;
44
+ const StyledInputContent = _styledComponents.default.div`
45
+ display: flex;
46
+ flex: 1 1 auto;
47
+ flex-direction: column;
48
+ position: relative;
49
+ min-width: 0;
50
+ `;
51
+ exports.StyledInputContent = StyledInputContent;
52
+ const StyledInputField = _styledComponents.default.input`
53
+ background: none;
54
+ border: none;
55
+ color: ${_ref4 => {
56
+ let {
57
+ theme
58
+ } = _ref4;
59
+ return theme.text;
60
+ }};
61
+ padding: 0;
62
+ `;
63
+ exports.StyledInputField = StyledInputField;
64
+ const StyledMotionInputLabel = (0, _styledComponents.default)(_framerMotion.m.label)`
65
+ line-height: 1.15;
66
+ pointer-events: none;
67
+ position: absolute;
68
+ user-select: none;
69
+ `;
70
+ exports.StyledMotionInputLabel = StyledMotionInputLabel;
71
+ //# sourceMappingURL=Input.styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Input.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireDefault","obj","__esModule","default","StyledInput","styled","div","_ref","theme","_ref2","_ref3","isDisabled","exports","StyledInputContent","StyledInputField","input","_ref4","text","StyledMotionInputLabel","m","label"],"sources":["../../../src/components/input/Input.styles.ts"],"sourcesContent":["import { m } from 'framer-motion';\nimport styled from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { InputProps } from './Input';\n\ntype StyledInputProps = WithTheme<Pick<InputProps, 'isDisabled'>>;\n\nexport const StyledInput = styled.div<StyledInputProps>`\n align-items: center;\n background-color: ${({ theme }: StyledInputProps) => theme['100']};\n border: 1px solid rgba(160, 160, 160, 0.3);\n border-radius: 3px;\n color: ${({ theme }: StyledInputProps) => theme['006']};\n display: flex;\n justify-content: space-between;\n min-height: 42px;\n opacity: ${({ isDisabled }) => (isDisabled ? 0.5 : 1)};\n padding: 8px 10px;\n transition: opacity 0.3s ease;\n width: 100%;\n\n &:not(&:first-child) {\n margin-top: 8px;\n }\n`;\n\nexport const StyledInputContent = styled.div`\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n position: relative;\n min-width: 0;\n`;\n\nexport const StyledInputField = styled.input`\n background: none;\n border: none;\n color: ${({ theme }: StyledInputProps) => theme.text};\n padding: 0;\n`;\n\nexport const StyledMotionInputLabel = styled(m.label)`\n line-height: 1.15;\n pointer-events: none;\n position: absolute;\n user-select: none;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAAuC,SAAAE,uBAAAC,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAMhC,MAAMG,WAAW,GAAGC,yBAAM,CAACC,GAAsB;AACxD;AACA,wBAAwBC,IAAA;EAAA,IAAC;IAAEC;EAAwB,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,KAAK,CAAC;AAAA,CAAC;AACtE;AACA;AACA,aAAaC,KAAA;EAAA,IAAC;IAAED;EAAwB,CAAC,GAAAC,KAAA;EAAA,OAAKD,KAAK,CAAC,KAAK,CAAC;AAAA,CAAC;AAC3D;AACA;AACA;AACA,eAAeE,KAAA;EAAA,IAAC;IAAEC;EAAW,CAAC,GAAAD,KAAA;EAAA,OAAMC,UAAU,GAAG,GAAG,GAAG,CAAC;AAAA,CAAE;AAC1D;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAACC,OAAA,CAAAR,WAAA,GAAAA,WAAA;AAEK,MAAMS,kBAAkB,GAAGR,yBAAM,CAACC,GAAI;AAC7C;AACA;AACA;AACA;AACA;AACA,CAAC;AAACM,OAAA,CAAAC,kBAAA,GAAAA,kBAAA;AAEK,MAAMC,gBAAgB,GAAGT,yBAAM,CAACU,KAAM;AAC7C;AACA;AACA,aAAaC,KAAA;EAAA,IAAC;IAAER;EAAwB,CAAC,GAAAQ,KAAA;EAAA,OAAKR,KAAK,CAACS,IAAI;AAAA,CAAC;AACzD;AACA,CAAC;AAACL,OAAA,CAAAE,gBAAA,GAAAA,gBAAA;AAEK,MAAMI,sBAAsB,GAAG,IAAAb,yBAAM,EAACc,eAAC,CAACC,KAAK,CAAE;AACtD;AACA;AACA;AACA;AACA,CAAC;AAACR,OAAA,CAAAM,sBAAA,GAAAA,sBAAA"}
@@ -0,0 +1,6 @@
1
+ import { FC, ReactNode } from 'react';
2
+ export type LazyMotionWrapperProps = {
3
+ children: ReactNode;
4
+ };
5
+ declare const LazyMotionWrapper: FC<LazyMotionWrapperProps>;
6
+ export default LazyMotionWrapper;
@@ -0,0 +1,24 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _framerMotion = require("framer-motion");
8
+ var _react = _interopRequireDefault(require("react"));
9
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
+ 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); }
11
+ 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; }
12
+ const loadFeatures = () => Promise.resolve().then(() => _interopRequireWildcard(require('../../utils/motion-features'))).then(res => res.default);
13
+ const LazyMotionWrapper = _ref => {
14
+ let {
15
+ children
16
+ } = _ref;
17
+ return /*#__PURE__*/_react.default.createElement(_framerMotion.LazyMotion, {
18
+ features: loadFeatures
19
+ }, children);
20
+ };
21
+ LazyMotionWrapper.displayName = 'LazyMotionWrapper';
22
+ var _default = LazyMotionWrapper;
23
+ exports.default = _default;
24
+ //# sourceMappingURL=LazyMotionWrapper.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"LazyMotionWrapper.js","names":["_framerMotion","require","_react","_interopRequireDefault","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","_interopRequireWildcard","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","loadFeatures","Promise","resolve","then","res","LazyMotionWrapper","_ref","children","createElement","LazyMotion","features","displayName","_default","exports"],"sources":["../../../src/components/lazy-motion-wrapper/LazyMotionWrapper.tsx"],"sourcesContent":["import { LazyMotion } from 'framer-motion';\nimport React, { FC, ReactNode } from 'react';\n\nexport type LazyMotionWrapperProps = {\n children: ReactNode;\n};\n\nconst loadFeatures = () => import('../../utils/motion-features').then((res) => res.default);\n\nconst LazyMotionWrapper: FC<LazyMotionWrapperProps> = ({ children }) => (\n <LazyMotion features={loadFeatures}>{children}</LazyMotion>\n);\n\nLazyMotionWrapper.displayName = 'LazyMotionWrapper';\n\nexport default LazyMotionWrapper;\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAA6C,SAAAE,uBAAAC,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAI,wBAAAR,GAAA,EAAAI,WAAA,SAAAA,WAAA,IAAAJ,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAS,KAAA,GAAAN,wBAAA,CAAAC,WAAA,OAAAK,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAV,GAAA,YAAAS,KAAA,CAAAE,GAAA,CAAAX,GAAA,SAAAY,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAjB,GAAA,QAAAiB,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAApB,GAAA,EAAAiB,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAhB,GAAA,EAAAiB,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAjB,GAAA,CAAAiB,GAAA,SAAAL,MAAA,CAAAV,OAAA,GAAAF,GAAA,MAAAS,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAtB,GAAA,EAAAY,MAAA,YAAAA,MAAA;AAM7C,MAAMW,YAAY,GAAGA,CAAA,KAAMC,OAAA,CAAAC,OAAA,GAAAC,IAAA,OAAAlB,uBAAA,CAAAX,OAAA,CAAO,6BAA6B,IAAE6B,IAAI,CAAEC,GAAG,IAAKA,GAAG,CAACzB,OAAO,CAAC;AAE3F,MAAM0B,iBAA6C,GAAGC,IAAA;EAAA,IAAC;IAAEC;EAAS,CAAC,GAAAD,IAAA;EAAA,oBAC/D/B,MAAA,CAAAI,OAAA,CAAA6B,aAAA,CAACnC,aAAA,CAAAoC,UAAU;IAACC,QAAQ,EAAEV;EAAa,GAAEO,QAAQ,CAAc;AAAA,CAC9D;AAEDF,iBAAiB,CAACM,WAAW,GAAG,mBAAmB;AAAC,IAAAC,QAAA,GAErCP,iBAAiB;AAAAQ,OAAA,CAAAlC,OAAA,GAAAiC,QAAA"}
@@ -0,0 +1,18 @@
1
+ import React, { FC, ReactNode } from 'react';
2
+ interface IListContext {
3
+ incrementExpandableItemCount: () => () => void;
4
+ isAnyItemExpandable: boolean;
5
+ openItemUuid: string | undefined;
6
+ updateOpenItemUuid: (uuid: string, options?: {
7
+ shouldOnlyOpen?: boolean;
8
+ }) => void;
9
+ }
10
+ export declare const ListContext: React.Context<IListContext>;
11
+ type ListProps = {
12
+ /**
13
+ * The items of the list
14
+ */
15
+ children: ReactNode;
16
+ };
17
+ declare const List: FC<ListProps>;
18
+ export default List;
@@ -0,0 +1,56 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = exports.ListContext = void 0;
7
+ var _react = _interopRequireWildcard(require("react"));
8
+ var _LazyMotionWrapper = _interopRequireDefault(require("../lazy-motion-wrapper/LazyMotionWrapper"));
9
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
+ 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); }
11
+ 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; }
12
+ const ListContext = /*#__PURE__*/_react.default.createContext({
13
+ incrementExpandableItemCount: () => () => {},
14
+ isAnyItemExpandable: false,
15
+ openItemUuid: undefined,
16
+ updateOpenItemUuid: () => {}
17
+ });
18
+ exports.ListContext = ListContext;
19
+ ListContext.displayName = 'ListContext';
20
+ const List = _ref => {
21
+ let {
22
+ children
23
+ } = _ref;
24
+ const [openItemUuid, setOpenItemUuid] = (0, _react.useState)(undefined);
25
+ const [expandableItemCount, setExpandableItemCount] = (0, _react.useState)(0);
26
+ const updateOpenItemUuid = (0, _react.useCallback)(function (uuid) {
27
+ let {
28
+ shouldOnlyOpen
29
+ } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
30
+ setOpenItemUuid(currentOpenItemUuid => {
31
+ if (currentOpenItemUuid === uuid && shouldOnlyOpen !== true) {
32
+ return undefined;
33
+ }
34
+ return uuid;
35
+ });
36
+ }, [setOpenItemUuid]);
37
+ const incrementExpandableItemCount = (0, _react.useCallback)(() => {
38
+ setExpandableItemCount(count => count + 1);
39
+ return () => {
40
+ setExpandableItemCount(count => count - 1);
41
+ };
42
+ }, [setExpandableItemCount]);
43
+ const providerValue = (0, _react.useMemo)(() => ({
44
+ isAnyItemExpandable: expandableItemCount > 0,
45
+ updateOpenItemUuid,
46
+ openItemUuid,
47
+ incrementExpandableItemCount
48
+ }), [expandableItemCount, incrementExpandableItemCount, openItemUuid, updateOpenItemUuid]);
49
+ return /*#__PURE__*/_react.default.createElement(_LazyMotionWrapper.default, null, /*#__PURE__*/_react.default.createElement(ListContext.Provider, {
50
+ value: providerValue
51
+ }, children));
52
+ };
53
+ List.displayName = 'List';
54
+ var _default = List;
55
+ exports.default = _default;
56
+ //# sourceMappingURL=List.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"List.js","names":["_react","_interopRequireWildcard","require","_LazyMotionWrapper","_interopRequireDefault","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","ListContext","React","createContext","incrementExpandableItemCount","isAnyItemExpandable","openItemUuid","undefined","updateOpenItemUuid","exports","displayName","List","_ref","children","setOpenItemUuid","useState","expandableItemCount","setExpandableItemCount","useCallback","uuid","shouldOnlyOpen","arguments","length","currentOpenItemUuid","count","providerValue","useMemo","createElement","Provider","value","_default"],"sources":["../../../src/components/list/List.tsx"],"sourcesContent":["import React, { FC, ReactNode, useCallback, useMemo, useState } from 'react';\nimport LazyMotionWrapper from '../lazy-motion-wrapper/LazyMotionWrapper';\n\ninterface IListContext {\n incrementExpandableItemCount: () => () => void;\n isAnyItemExpandable: boolean;\n openItemUuid: string | undefined;\n updateOpenItemUuid: (uuid: string, options?: { shouldOnlyOpen?: boolean }) => void;\n}\n\nexport const ListContext = React.createContext<IListContext>({\n incrementExpandableItemCount: () => () => {},\n isAnyItemExpandable: false,\n openItemUuid: undefined,\n updateOpenItemUuid: () => {},\n});\n\nListContext.displayName = 'ListContext';\n\ntype ListProps = {\n /**\n * The items of the list\n */\n children: ReactNode;\n};\n\nconst List: FC<ListProps> = ({ children }) => {\n const [openItemUuid, setOpenItemUuid] = useState<IListContext['openItemUuid']>(undefined);\n const [expandableItemCount, setExpandableItemCount] = useState<number>(0);\n\n const updateOpenItemUuid = useCallback<IListContext['updateOpenItemUuid']>(\n (uuid, { shouldOnlyOpen } = {}) => {\n setOpenItemUuid((currentOpenItemUuid) => {\n if (currentOpenItemUuid === uuid && shouldOnlyOpen !== true) {\n return undefined;\n }\n\n return uuid;\n });\n },\n [setOpenItemUuid]\n );\n\n const incrementExpandableItemCount = useCallback(() => {\n setExpandableItemCount((count) => count + 1);\n\n return () => {\n setExpandableItemCount((count) => count - 1);\n };\n }, [setExpandableItemCount]);\n\n const providerValue = useMemo<IListContext>(\n () => ({\n isAnyItemExpandable: expandableItemCount > 0,\n updateOpenItemUuid,\n openItemUuid,\n incrementExpandableItemCount,\n }),\n [expandableItemCount, incrementExpandableItemCount, openItemUuid, updateOpenItemUuid]\n );\n\n return (\n <LazyMotionWrapper>\n <ListContext.Provider value={providerValue}>{children}</ListContext.Provider>\n </LazyMotionWrapper>\n );\n};\n\nList.displayName = 'List';\n\nexport default List;\n"],"mappings":"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"}
@@ -0,0 +1,67 @@
1
+ import { FC, MouseEventHandler, ReactNode, TouchEventHandler } from 'react';
2
+ type ListItemProps = {
3
+ /**
4
+ * The content of the `ListItem` body. When the `ListItem` has children,
5
+ * it can be opened and also gets an icon as an indicator automatically.
6
+ */
7
+ children?: ReactNode;
8
+ /**
9
+ * Element that is displayed when hovering over the `ListItem` on the right
10
+ * side. On mobile devices, this element is not displayed.
11
+ */
12
+ hoverItem?: ReactNode;
13
+ /**
14
+ * The FontAwesome or tobit icons to render like an image on the left side
15
+ * of the header. Multiple icons are stacked. See the `Icon` component
16
+ * documentation for more information.
17
+ */
18
+ icons?: string[];
19
+ /**
20
+ * A list of image URLs that are displayed on the left side of the header.
21
+ * If multiple URLs are passed, the image is assembled from the first three
22
+ * image URLs as a puzzle.
23
+ */
24
+ images?: string[];
25
+ /**
26
+ * This can be used to automatically expand the `ListItem` during the first render.
27
+ */
28
+ isDefaultOpen?: boolean;
29
+ /**
30
+ * This overrides the internal opening state of the item and makes it controlled.
31
+ */
32
+ isOpen?: boolean;
33
+ /**
34
+ * Function to be executed when the header of the `ListItem` was clicked
35
+ */
36
+ onClick?: MouseEventHandler<HTMLDivElement>;
37
+ /**
38
+ * Function to be executed when the header of the `ListItem` is pressed for
39
+ * 400 milliseconds.
40
+ */
41
+ onLongPress?: TouchEventHandler<HTMLDivElement>;
42
+ /**
43
+ * Elements that are displayed on the left side of the header. If multiple
44
+ * elements are specified, they are displayed one aside the other.
45
+ */
46
+ leftElements?: [ReactNode, ...ReactNode[]];
47
+ /**
48
+ * Elements that are displayed on the right side of the header. If multiple
49
+ * elements are specified, they are displayed one below the other.
50
+ */
51
+ rightElements?: [ReactNode, ...ReactNode[]];
52
+ /**
53
+ * Images of users should always be displayed in a round shape. Therefore
54
+ * this property can be set to true.
55
+ */
56
+ shouldShowRoundImage?: boolean;
57
+ /**
58
+ * Subtitle of the `ListItem` displayed in the head below the title
59
+ */
60
+ subtitle?: ReactNode;
61
+ /**
62
+ * Title of the `ListItem` displayed in the head
63
+ */
64
+ title: ReactNode;
65
+ };
66
+ declare const ListItem: FC<ListItemProps>;
67
+ export default ListItem;
@@ -0,0 +1,90 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _framerMotion = require("framer-motion");
8
+ var _react = _interopRequireWildcard(require("react"));
9
+ var _uuid = require("../../../hooks/uuid");
10
+ var _List = require("../List");
11
+ var _ListItemBody = _interopRequireDefault(require("./list-item-body/ListItemBody"));
12
+ var _ListItemHead = _interopRequireDefault(require("./list-item-head/ListItemHead"));
13
+ var _ListItem = require("./ListItem.styles");
14
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
+ 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); }
16
+ 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; }
17
+ const ListItem = _ref => {
18
+ let {
19
+ children,
20
+ hoverItem,
21
+ icons,
22
+ images,
23
+ isDefaultOpen,
24
+ isOpen,
25
+ onClick,
26
+ onLongPress,
27
+ leftElements,
28
+ rightElements,
29
+ subtitle,
30
+ shouldShowRoundImage,
31
+ title
32
+ } = _ref;
33
+ const {
34
+ incrementExpandableItemCount,
35
+ isAnyItemExpandable,
36
+ openItemUuid,
37
+ updateOpenItemUuid
38
+ } = (0, _react.useContext)(_List.ListContext);
39
+ const uuid = (0, _uuid.useUuid)();
40
+ const isExpandable = children !== undefined;
41
+ const isItemOpen = isOpen !== null && isOpen !== void 0 ? isOpen : openItemUuid === uuid;
42
+ const handleHeadClick = (0, _react.useCallback)(event => {
43
+ if (isExpandable) {
44
+ updateOpenItemUuid(uuid);
45
+ }
46
+ if (typeof onClick === 'function') {
47
+ onClick(event);
48
+ }
49
+ }, [isExpandable, onClick, updateOpenItemUuid, uuid]);
50
+ (0, _react.useEffect)(() => {
51
+ if (isExpandable) {
52
+ // The incrementExpandableItemCount function returns an cleanup
53
+ // function to decrement expandableItemCount if component unmounts
54
+ return incrementExpandableItemCount();
55
+ }
56
+ return undefined;
57
+ }, [incrementExpandableItemCount, isExpandable]);
58
+ (0, _react.useEffect)(() => {
59
+ if (isDefaultOpen) {
60
+ updateOpenItemUuid(uuid, {
61
+ shouldOnlyOpen: true
62
+ });
63
+ }
64
+ }, [isDefaultOpen, updateOpenItemUuid, uuid]);
65
+ return /*#__PURE__*/_react.default.createElement(_ListItem.StyledListItem, {
66
+ className: "beta-chayns-list-item",
67
+ isClickable: typeof onClick === 'function' || isExpandable,
68
+ isOpen: isItemOpen
69
+ }, /*#__PURE__*/_react.default.createElement(_ListItemHead.default, {
70
+ hoverItem: hoverItem,
71
+ icons: icons,
72
+ images: images,
73
+ isAnyItemExpandable: isAnyItemExpandable,
74
+ isExpandable: isExpandable,
75
+ isOpen: isItemOpen,
76
+ onClick: handleHeadClick,
77
+ onLongPress: onLongPress,
78
+ leftElements: leftElements,
79
+ rightElements: rightElements,
80
+ subtitle: subtitle,
81
+ shouldShowRoundImage: shouldShowRoundImage,
82
+ title: title
83
+ }), /*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
84
+ initial: false
85
+ }, isExpandable && isItemOpen && /*#__PURE__*/_react.default.createElement(_ListItemBody.default, null, children)));
86
+ };
87
+ ListItem.displayName = 'ListItem';
88
+ var _default = ListItem;
89
+ exports.default = _default;
90
+ //# sourceMappingURL=ListItem.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ListItem.js","names":["_framerMotion","require","_react","_interopRequireWildcard","_uuid","_List","_ListItemBody","_interopRequireDefault","_ListItemHead","_ListItem","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","ListItem","_ref","children","hoverItem","icons","images","isDefaultOpen","isOpen","onClick","onLongPress","leftElements","rightElements","subtitle","shouldShowRoundImage","title","incrementExpandableItemCount","isAnyItemExpandable","openItemUuid","updateOpenItemUuid","useContext","ListContext","uuid","useUuid","isExpandable","undefined","isItemOpen","handleHeadClick","useCallback","event","useEffect","shouldOnlyOpen","createElement","StyledListItem","className","isClickable","AnimatePresence","initial","displayName","_default","exports"],"sources":["../../../../src/components/list/list-item/ListItem.tsx"],"sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, {\n FC,\n MouseEventHandler,\n ReactNode,\n TouchEventHandler,\n useCallback,\n useContext,\n useEffect,\n} from 'react';\nimport { useUuid } from '../../../hooks/uuid';\nimport { ListContext } from '../List';\nimport ListItemBody from './list-item-body/ListItemBody';\nimport ListItemHead from './list-item-head/ListItemHead';\nimport { StyledListItem } from './ListItem.styles';\n\ntype ListItemProps = {\n /**\n * The content of the `ListItem` body. When the `ListItem` has children,\n * it can be opened and also gets an icon as an indicator automatically.\n */\n children?: ReactNode;\n /**\n * Element that is displayed when hovering over the `ListItem` on the right\n * side. On mobile devices, this element is not displayed.\n */\n hoverItem?: ReactNode;\n /**\n * The FontAwesome or tobit icons to render like an image on the left side\n * of the header. Multiple icons are stacked. See the `Icon` component\n * documentation for more information.\n */\n icons?: string[];\n /**\n * A list of image URLs that are displayed on the left side of the header.\n * If multiple URLs are passed, the image is assembled from the first three\n * image URLs as a puzzle.\n */\n images?: string[];\n /**\n * This can be used to automatically expand the `ListItem` during the first render.\n */\n isDefaultOpen?: boolean;\n /**\n * This overrides the internal opening state of the item and makes it controlled.\n */\n isOpen?: boolean;\n /**\n * Function to be executed when the header of the `ListItem` was clicked\n */\n onClick?: MouseEventHandler<HTMLDivElement>;\n /**\n * Function to be executed when the header of the `ListItem` is pressed for\n * 400 milliseconds.\n */\n onLongPress?: TouchEventHandler<HTMLDivElement>;\n /**\n * Elements that are displayed on the left side of the header. If multiple\n * elements are specified, they are displayed one aside the other.\n */\n leftElements?: [ReactNode, ...ReactNode[]];\n /**\n * Elements that are displayed on the right side of the header. If multiple\n * elements are specified, they are displayed one below the other.\n */\n rightElements?: [ReactNode, ...ReactNode[]];\n /**\n * Images of users should always be displayed in a round shape. Therefore\n * this property can be set to true.\n */\n shouldShowRoundImage?: boolean;\n /**\n * Subtitle of the `ListItem` displayed in the head below the title\n */\n subtitle?: ReactNode;\n /**\n * Title of the `ListItem` displayed in the head\n */\n title: ReactNode;\n};\n\nconst ListItem: FC<ListItemProps> = ({\n children,\n hoverItem,\n icons,\n images,\n isDefaultOpen,\n isOpen,\n onClick,\n onLongPress,\n leftElements,\n rightElements,\n subtitle,\n shouldShowRoundImage,\n title,\n}) => {\n const { incrementExpandableItemCount, isAnyItemExpandable, openItemUuid, updateOpenItemUuid } =\n useContext(ListContext);\n\n const uuid = useUuid();\n\n const isExpandable = children !== undefined;\n const isItemOpen = isOpen ?? openItemUuid === uuid;\n\n const handleHeadClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n (event) => {\n if (isExpandable) {\n updateOpenItemUuid(uuid);\n }\n\n if (typeof onClick === 'function') {\n onClick(event);\n }\n },\n [isExpandable, onClick, updateOpenItemUuid, uuid]\n );\n\n useEffect(() => {\n if (isExpandable) {\n // The incrementExpandableItemCount function returns an cleanup\n // function to decrement expandableItemCount if component unmounts\n return incrementExpandableItemCount();\n }\n\n return undefined;\n }, [incrementExpandableItemCount, isExpandable]);\n\n useEffect(() => {\n if (isDefaultOpen) {\n updateOpenItemUuid(uuid, { shouldOnlyOpen: true });\n }\n }, [isDefaultOpen, updateOpenItemUuid, uuid]);\n\n return (\n <StyledListItem\n className=\"beta-chayns-list-item\"\n isClickable={typeof onClick === 'function' || isExpandable}\n isOpen={isItemOpen}\n >\n <ListItemHead\n hoverItem={hoverItem}\n icons={icons}\n images={images}\n isAnyItemExpandable={isAnyItemExpandable}\n isExpandable={isExpandable}\n isOpen={isItemOpen}\n onClick={handleHeadClick}\n onLongPress={onLongPress}\n leftElements={leftElements}\n rightElements={rightElements}\n subtitle={subtitle}\n shouldShowRoundImage={shouldShowRoundImage}\n title={title}\n />\n <AnimatePresence initial={false}>\n {isExpandable && isItemOpen && <ListItemBody>{children}</ListItemBody>}\n </AnimatePresence>\n </StyledListItem>\n );\n};\n\nListItem.displayName = 'ListItem';\n\nexport default ListItem;\n"],"mappings":"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"}
@@ -0,0 +1,6 @@
1
+ export declare const StyledListItem: import("styled-components").StyledComponent<"div", any, {
2
+ isClickable: boolean;
3
+ isOpen: boolean;
4
+ } & {
5
+ theme: import("../../color-scheme-provider/ColorSchemeProvider").Theme;
6
+ }, never>;
@@ -0,0 +1,56 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.StyledListItem = void 0;
7
+ var _styledComponents = _interopRequireWildcard(require("styled-components"));
8
+ 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); }
9
+ 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; }
10
+ const StyledListItem = _styledComponents.default.div`
11
+ ${_ref => {
12
+ let {
13
+ isOpen
14
+ } = _ref;
15
+ return isOpen && (0, _styledComponents.css)`
16
+ background-color: rgba(${_ref2 => {
17
+ let {
18
+ theme
19
+ } = _ref2;
20
+ return theme['100-rgb'];
21
+ }}, 0.85);
22
+ `;
23
+ }}
24
+
25
+ transition: background-color 0.3s ease;
26
+
27
+ ${_ref3 => {
28
+ let {
29
+ isClickable
30
+ } = _ref3;
31
+ return isClickable && (0, _styledComponents.css)`
32
+ :hover {
33
+ background-color: rgba(
34
+ ${_ref4 => {
35
+ let {
36
+ theme
37
+ } = _ref4;
38
+ return theme['100-rgb'];
39
+ }},
40
+ 0.85
41
+ );
42
+ }
43
+ `;
44
+ }}
45
+
46
+ :not(:last-child) {
47
+ border-bottom: 1px solid ${_ref5 => {
48
+ let {
49
+ theme
50
+ } = _ref5;
51
+ return theme.headline;
52
+ }};
53
+ }
54
+ `;
55
+ exports.StyledListItem = StyledListItem;
56
+ //# sourceMappingURL=ListItem.styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ListItem.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","StyledListItem","styled","div","_ref","isOpen","css","_ref2","theme","_ref3","isClickable","_ref4","_ref5","headline","exports"],"sources":["../../../../src/components/list/list-item/ListItem.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemProps = WithTheme<{\n isClickable: boolean;\n isOpen: boolean;\n}>;\n\nexport const StyledListItem = styled.div<StyledListItemProps>`\n ${({ isOpen }) =>\n isOpen &&\n css`\n background-color: rgba(${({ theme }: StyledListItemProps) => theme['100-rgb']}, 0.85);\n `}\n\n transition: background-color 0.3s ease;\n\n ${({ isClickable }) =>\n isClickable &&\n css`\n :hover {\n background-color: rgba(\n ${({ theme }: StyledListItemProps) => theme['100-rgb']},\n 0.85\n );\n }\n `}\n\n :not(:last-child) {\n border-bottom: 1px solid ${({ theme }: StyledListItemProps) => theme.headline};\n }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAC,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAH,wBAAAO,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAG,KAAA,GAAAR,wBAAA,CAAAC,WAAA,OAAAO,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAJ,GAAA,YAAAG,KAAA,CAAAE,GAAA,CAAAL,GAAA,SAAAM,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAX,GAAA,QAAAW,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAd,GAAA,EAAAW,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAV,GAAA,EAAAW,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAX,GAAA,CAAAW,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAF,GAAA,MAAAG,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAhB,GAAA,EAAAM,MAAA,YAAAA,MAAA;AAQzC,MAAMW,cAAc,GAAGC,yBAAM,CAACC,GAAyB;AAC9D,MAAMC,IAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,IAAA;EAAA,OACTC,MAAM,IACN,IAAAC,qBAAG,CAAC;AACZ,qCAAqCC,KAAA;IAAA,IAAC;MAAEC;IAA2B,CAAC,GAAAD,KAAA;IAAA,OAAKC,KAAK,CAAC,SAAS,CAAC;EAAA,CAAC;AAC1F,SAAS;AAAA,CAAC;AACV;AACA;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,KAAA;EAAA,OACdC,WAAW,IACX,IAAAJ,qBAAG,CAAC;AACZ;AACA;AACA,sBAAsBK,KAAA;IAAA,IAAC;MAAEH;IAA2B,CAAC,GAAAG,KAAA;IAAA,OAAKH,KAAK,CAAC,SAAS,CAAC;EAAA,CAAC;AAC3E;AACA;AACA;AACA,SAAS;AAAA,CAAC;AACV;AACA;AACA,mCAAmCI,KAAA;EAAA,IAAC;IAAEJ;EAA2B,CAAC,GAAAI,KAAA;EAAA,OAAKJ,KAAK,CAACK,QAAQ;AAAA,CAAC;AACtF;AACA,CAAC;AAACC,OAAA,CAAAb,cAAA,GAAAA,cAAA"}
@@ -0,0 +1,3 @@
1
+ import { FC } from 'react';
2
+ declare const ListItemBody: FC;
3
+ export default ListItemBody;
@@ -0,0 +1,36 @@
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 _ListItemBody = require("./ListItemBody.styles");
9
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
+ const ListItemBody = _ref => {
11
+ let {
12
+ children
13
+ } = _ref;
14
+ return /*#__PURE__*/_react.default.createElement(_ListItemBody.StyledMotionListItemBody, {
15
+ animate: {
16
+ height: 'auto',
17
+ opacity: 1
18
+ },
19
+ className: "beta-chayns-list-item-body",
20
+ exit: {
21
+ height: 0,
22
+ opacity: 0
23
+ },
24
+ initial: {
25
+ height: 0,
26
+ opacity: 0
27
+ },
28
+ transition: {
29
+ type: 'tween'
30
+ }
31
+ }, children);
32
+ };
33
+ ListItemBody.displayName = 'ListItemBody';
34
+ var _default = ListItemBody;
35
+ exports.default = _default;
36
+ //# sourceMappingURL=ListItemBody.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ListItemBody.js","names":["_react","_interopRequireDefault","require","_ListItemBody","obj","__esModule","default","ListItemBody","_ref","children","createElement","StyledMotionListItemBody","animate","height","opacity","className","exit","initial","transition","type","displayName","_default","exports"],"sources":["../../../../../src/components/list/list-item/list-item-body/ListItemBody.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { StyledMotionListItemBody } from './ListItemBody.styles';\n\nconst ListItemBody: FC = ({ children }) => (\n <StyledMotionListItemBody\n animate={{ height: 'auto', opacity: 1 }}\n className=\"beta-chayns-list-item-body\"\n exit={{ height: 0, opacity: 0 }}\n initial={{ height: 0, opacity: 0 }}\n transition={{ type: 'tween' }}\n >\n {children}\n </StyledMotionListItemBody>\n);\n\nListItemBody.displayName = 'ListItemBody';\n\nexport default ListItemBody;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AAAiE,SAAAD,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAEjE,MAAMG,YAAgB,GAAGC,IAAA;EAAA,IAAC;IAAEC;EAAS,CAAC,GAAAD,IAAA;EAAA,oBAClCR,MAAA,CAAAM,OAAA,CAAAI,aAAA,CAACP,aAAA,CAAAQ,wBAAwB;IACrBC,OAAO,EAAE;MAAEC,MAAM,EAAE,MAAM;MAAEC,OAAO,EAAE;IAAE,CAAE;IACxCC,SAAS,EAAC,4BAA4B;IACtCC,IAAI,EAAE;MAAEH,MAAM,EAAE,CAAC;MAAEC,OAAO,EAAE;IAAE,CAAE;IAChCG,OAAO,EAAE;MAAEJ,MAAM,EAAE,CAAC;MAAEC,OAAO,EAAE;IAAE,CAAE;IACnCI,UAAU,EAAE;MAAEC,IAAI,EAAE;IAAQ;EAAE,GAE7BV,QAAQ,CACc;AAAA,CAC9B;AAEDF,YAAY,CAACa,WAAW,GAAG,cAAc;AAAC,IAAAC,QAAA,GAE3Bd,YAAY;AAAAe,OAAA,CAAAhB,OAAA,GAAAe,QAAA"}
@@ -0,0 +1 @@
1
+ export declare const StyledMotionListItemBody: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, {}, never>;