@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.
Files changed (144) hide show
  1. package/README.md +3 -9
  2. package/lib/components/accordion/Accordion.d.ts +47 -9
  3. package/lib/components/accordion/Accordion.js +83 -87
  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 +8 -4
  24. package/lib/components/accordion/accordion-head/AccordionHead.js +79 -64
  25. package/lib/components/accordion/accordion-head/AccordionHead.js.map +1 -1
  26. package/lib/components/accordion/accordion-head/AccordionHead.styles.d.ts +10 -5
  27. package/lib/components/accordion/accordion-head/AccordionHead.styles.js +142 -32
  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 +154 -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 +75 -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/list/List.d.ts +18 -0
  97. package/lib/components/list/List.js +54 -0
  98. package/lib/components/list/List.js.map +1 -0
  99. package/lib/components/list/list-item/ListItem.d.ts +67 -0
  100. package/lib/components/list/list-item/ListItem.js +90 -0
  101. package/lib/components/list/list-item/ListItem.js.map +1 -0
  102. package/lib/components/list/list-item/ListItem.styles.d.ts +6 -0
  103. package/lib/components/list/list-item/ListItem.styles.js +56 -0
  104. package/lib/components/list/list-item/ListItem.styles.js.map +1 -0
  105. package/lib/components/list/list-item/list-item-body/ListItemBody.d.ts +3 -0
  106. package/lib/components/list/list-item/list-item-body/ListItemBody.js +36 -0
  107. package/lib/components/list/list-item/list-item-body/ListItemBody.js.map +1 -0
  108. package/lib/components/list/list-item/list-item-body/ListItemBody.styles.d.ts +1 -0
  109. package/lib/components/list/list-item/list-item-body/ListItemBody.styles.js +14 -0
  110. package/lib/components/list/list-item/list-item-body/ListItemBody.styles.js.map +1 -0
  111. package/lib/components/list/list-item/list-item-content/ListItemContent.d.ts +3 -0
  112. package/lib/components/list/list-item/list-item-content/ListItemContent.js +21 -0
  113. package/lib/components/list/list-item/list-item-content/ListItemContent.js.map +1 -0
  114. package/lib/components/list/list-item/list-item-content/ListItemContent.styles.d.ts +1 -0
  115. package/lib/components/list/list-item/list-item-content/ListItemContent.styles.js +19 -0
  116. package/lib/components/list/list-item/list-item-content/ListItemContent.styles.js.map +1 -0
  117. package/lib/components/list/list-item/list-item-head/ListItemHead.d.ts +18 -0
  118. package/lib/components/list/list-item/list-item-head/ListItemHead.js +100 -0
  119. package/lib/components/list/list-item/list-item-head/ListItemHead.js.map +1 -0
  120. package/lib/components/list/list-item/list-item-head/ListItemHead.styles.d.ts +20 -0
  121. package/lib/components/list/list-item/list-item-head/ListItemHead.styles.js +110 -0
  122. package/lib/components/list/list-item/list-item-head/ListItemHead.styles.js.map +1 -0
  123. package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.d.ts +6 -0
  124. package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.js +23 -0
  125. package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.js.map +1 -0
  126. package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.d.ts +1 -0
  127. package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.js +32 -0
  128. package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.js.map +1 -0
  129. package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.d.ts +7 -0
  130. package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.js +44 -0
  131. package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.js.map +1 -0
  132. package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.d.ts +10 -0
  133. package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.js +52 -0
  134. package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.js.map +1 -0
  135. package/lib/hooks/uuid.d.ts +1 -0
  136. package/lib/hooks/uuid.js +14 -0
  137. package/lib/hooks/uuid.js.map +1 -0
  138. package/lib/index.d.ts +10 -0
  139. package/lib/index.js +69 -13
  140. package/lib/index.js.map +1 -1
  141. package/lib/types/chayns.d.ts +57 -0
  142. package/lib/types/chayns.js +14 -0
  143. package/lib/types/chayns.js.map +1 -0
  144. package/package.json +64 -62
@@ -4,17 +4,22 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.StyledMotionAccordionBody = void 0;
7
-
8
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 StyledMotionAccordionBody = (0, _styledComponents.default)(_framerMotion.motion.div)`
12
+ overflow: hidden;
9
13
 
10
- var _styledComponents = _interopRequireDefault(require("styled-components"));
11
-
12
- var _templateObject;
13
-
14
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
-
16
- function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
17
-
18
- var StyledMotionAccordionBody = (0, _styledComponents.default)(_framerMotion.motion.div)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n overflow: hidden;\n"])));
14
+ ${_ref => {
15
+ let {
16
+ maxHeight
17
+ } = _ref;
18
+ return typeof maxHeight === 'number' && (0, _styledComponents.css)`
19
+ max-height: ${maxHeight}px;
20
+ overflow-y: scroll;
21
+ `;
22
+ }}
23
+ `;
19
24
  exports.StyledMotionAccordionBody = StyledMotionAccordionBody;
20
25
  //# sourceMappingURL=AccordionBody.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/accordion/accordion-body/AccordionBody.styles.ts"],"names":["StyledMotionAccordionBody","motion","div"],"mappings":";;;;;;;AAAA;;AACA;;;;;;;;AAEO,IAAMA,yBAAyB,GAAG,+BAAOC,qBAAOC,GAAd,CAAH,8FAA/B","sourcesContent":["import { motion } from 'framer-motion';\nimport styled from 'styled-components';\n\nexport const StyledMotionAccordionBody = styled(motion.div)`\n overflow: hidden;\n`;\n"],"file":"AccordionBody.styles.js"}
1
+ {"version":3,"file":"AccordionBody.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","StyledMotionAccordionBody","styled","motion","div","_ref","maxHeight","css","exports"],"sources":["../../../../src/components/accordion/accordion-body/AccordionBody.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { AccordionBodyProps } from './AccordionBody';\n\ntype StyledMotionAccordionBodyProps = Pick<AccordionBodyProps, 'maxHeight'>;\n\nexport const StyledMotionAccordionBody = styled(motion.div)<StyledMotionAccordionBodyProps>`\n overflow: hidden;\n\n ${({ maxHeight }) =>\n typeof maxHeight === 'number' &&\n css`\n max-height: ${maxHeight}px;\n overflow-y: scroll;\n `}\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAAgD,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,SAAAF,wBAAAM,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;AAKzC,MAAMW,yBAAyB,GAAG,IAAAC,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAAkC;AAC5F;AACA;AACA,MAAMC,IAAA;EAAA,IAAC;IAAEC;EAAU,CAAC,GAAAD,IAAA;EAAA,OACZ,OAAOC,SAAS,KAAK,QAAQ,IAC7B,IAAAC,qBAAG,CAAC;AACZ,0BAA0BD,SAAU;AACpC;AACA,SAAS;AAAA,CAAC;AACV,CAAC;AAACE,OAAA,CAAAP,yBAAA,GAAAA,yBAAA"}
@@ -1,9 +1,17 @@
1
- import { FC, ReactNode } from 'react';
2
- declare type AccordionContentProps = {
1
+ import { FC, ReactNode, UIEvent } from 'react';
2
+ export type AccordionContentProps = {
3
3
  /**
4
- * The content of the accordion body
4
+ * The content of the accordion content element
5
5
  */
6
6
  children: ReactNode;
7
+ /**
8
+ * Maximum height of the element. This automatically makes the content of the element scrollable.
9
+ */
10
+ maxHeight?: number;
11
+ /**
12
+ * Function that is executed when the element will be scrolled
13
+ */
14
+ onScroll?: (event: UIEvent<HTMLDivElement>) => void;
7
15
  };
8
16
  declare const AccordionContent: FC<AccordionContentProps>;
9
17
  export default AccordionContent;
@@ -4,26 +4,28 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
-
8
7
  var _react = _interopRequireDefault(require("react"));
9
-
10
8
  var _Accordion = require("../Accordion");
11
-
12
9
  var _AccordionContent = require("./AccordionContent.styles");
13
-
14
10
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
-
16
- var AccordionContent = function AccordionContent(_ref) {
17
- var children = _ref.children;
18
- return /*#__PURE__*/_react.default.createElement(_Accordion.AccordionContext.Consumer, null, function (_ref2) {
19
- var isWrapped = _ref2.isWrapped;
11
+ const AccordionContent = _ref => {
12
+ let {
13
+ children,
14
+ maxHeight,
15
+ onScroll
16
+ } = _ref;
17
+ return /*#__PURE__*/_react.default.createElement(_Accordion.AccordionContext.Consumer, null, _ref2 => {
18
+ let {
19
+ isWrapped
20
+ } = _ref2;
20
21
  return /*#__PURE__*/_react.default.createElement(_AccordionContent.StyledAccordionContent, {
21
22
  className: "beta-chayns-accordion-content",
22
- isWrapped: isWrapped
23
+ isWrapped: isWrapped,
24
+ maxHeight: maxHeight,
25
+ onScroll: onScroll
23
26
  }, children);
24
27
  });
25
28
  };
26
-
27
29
  AccordionContent.displayName = 'AccordionContent';
28
30
  var _default = AccordionContent;
29
31
  exports.default = _default;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/accordion/accordion-content/AccordionContent.tsx"],"names":["AccordionContent","children","isWrapped","displayName"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AASA,IAAMA,gBAA2C,GAAG,SAA9CA,gBAA8C;AAAA,MAAGC,QAAH,QAAGA,QAAH;AAAA,sBAChD,6BAAC,2BAAD,CAAkB,QAAlB,QACK;AAAA,QAAGC,SAAH,SAAGA,SAAH;AAAA,wBACG,6BAAC,wCAAD;AAAwB,MAAA,SAAS,EAAC,+BAAlC;AAAkE,MAAA,SAAS,EAAEA;AAA7E,OACKD,QADL,CADH;AAAA,GADL,CADgD;AAAA,CAApD;;AAUAD,gBAAgB,CAACG,WAAjB,GAA+B,kBAA/B;eAEeH,gB","sourcesContent":["import React, { FC, ReactNode } from 'react';\nimport { AccordionContext } from '../Accordion';\nimport { StyledAccordionContent } from './AccordionContent.styles';\n\ntype AccordionContentProps = {\n /**\n * The content of the accordion body\n */\n children: ReactNode;\n};\n\nconst AccordionContent: FC<AccordionContentProps> = ({ children }) => (\n <AccordionContext.Consumer>\n {({ isWrapped }) => (\n <StyledAccordionContent className=\"beta-chayns-accordion-content\" isWrapped={isWrapped}>\n {children}\n </StyledAccordionContent>\n )}\n </AccordionContext.Consumer>\n);\n\nAccordionContent.displayName = 'AccordionContent';\n\nexport default AccordionContent;\n"],"file":"AccordionContent.js"}
1
+ {"version":3,"file":"AccordionContent.js","names":["_react","_interopRequireDefault","require","_Accordion","_AccordionContent","obj","__esModule","default","AccordionContent","_ref","children","maxHeight","onScroll","createElement","AccordionContext","Consumer","_ref2","isWrapped","StyledAccordionContent","className","displayName","_default","exports"],"sources":["../../../../src/components/accordion/accordion-content/AccordionContent.tsx"],"sourcesContent":["import React, { FC, ReactNode, UIEvent } from 'react';\nimport { AccordionContext } from '../Accordion';\nimport { StyledAccordionContent } from './AccordionContent.styles';\n\nexport type AccordionContentProps = {\n /**\n * The content of the accordion content element\n */\n children: ReactNode;\n /**\n * Maximum height of the element. This automatically makes the content of the element scrollable.\n */\n maxHeight?: number;\n /**\n * Function that is executed when the element will be scrolled\n */\n onScroll?: (event: UIEvent<HTMLDivElement>) => void;\n};\n\nconst AccordionContent: FC<AccordionContentProps> = ({ children, maxHeight, onScroll }) => (\n <AccordionContext.Consumer>\n {({ isWrapped }) => (\n <StyledAccordionContent\n className=\"beta-chayns-accordion-content\"\n isWrapped={isWrapped}\n maxHeight={maxHeight}\n onScroll={onScroll}\n >\n {children}\n </StyledAccordionContent>\n )}\n </AccordionContext.Consumer>\n);\n\nAccordionContent.displayName = 'AccordionContent';\n\nexport default AccordionContent;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AAAmE,SAAAD,uBAAAI,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAiBnE,MAAMG,gBAA2C,GAAGC,IAAA;EAAA,IAAC;IAAEC,QAAQ;IAAEC,SAAS;IAAEC;EAAS,CAAC,GAAAH,IAAA;EAAA,oBAClFT,MAAA,CAAAO,OAAA,CAAAM,aAAA,CAACV,UAAA,CAAAW,gBAAgB,CAACC,QAAQ,QACrBC,KAAA;IAAA,IAAC;MAAEC;IAAU,CAAC,GAAAD,KAAA;IAAA,oBACXhB,MAAA,CAAAO,OAAA,CAAAM,aAAA,CAACT,iBAAA,CAAAc,sBAAsB;MACnBC,SAAS,EAAC,+BAA+B;MACzCF,SAAS,EAAEA,SAAU;MACrBN,SAAS,EAAEA,SAAU;MACrBC,QAAQ,EAAEA;IAAS,GAElBF,QAAQ,CACY;EAAA,CAC5B,CACuB;AAAA,CAC/B;AAEDF,gBAAgB,CAACY,WAAW,GAAG,kBAAkB;AAAC,IAAAC,QAAA,GAEnCb,gBAAgB;AAAAc,OAAA,CAAAf,OAAA,GAAAc,QAAA"}
@@ -1,5 +1,6 @@
1
- declare type StyledAccordionContentProps = {
1
+ import type { AccordionContentProps } from './AccordionContent';
2
+ export declare const StyledAccordionContent: import("styled-components").StyledComponent<"div", any, {
2
3
  isWrapped: boolean;
3
- };
4
- export declare const StyledAccordionContent: import("styled-components").StyledComponent<"div", any, StyledAccordionContentProps, never>;
5
- export {};
4
+ } & {
5
+ theme: import("../../color-scheme-provider/ColorSchemeProvider").Theme;
6
+ } & Pick<AccordionContentProps, "maxHeight">, never>;
@@ -4,19 +4,32 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.StyledAccordionContent = void 0;
7
-
8
- var _styledComponents = _interopRequireDefault(require("styled-components"));
9
-
10
- var _templateObject;
11
-
12
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
-
14
- function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
15
-
16
- var StyledAccordionContent = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n padding: ", ";\n"])), function (_ref) {
17
- var isWrapped = _ref.isWrapped;
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 StyledAccordionContent = _styledComponents.default.div`
11
+ color: ${_ref => {
12
+ let {
13
+ theme
14
+ } = _ref;
15
+ return theme.text;
16
+ }};
17
+ padding: ${_ref2 => {
18
+ let {
19
+ isWrapped
20
+ } = _ref2;
18
21
  return isWrapped ? '0 9px 18px 26px' : '0 9px 9px 10px';
19
- });
22
+ }};
20
23
 
24
+ ${_ref3 => {
25
+ let {
26
+ maxHeight
27
+ } = _ref3;
28
+ return typeof maxHeight === 'number' && (0, _styledComponents.css)`
29
+ max-height: ${maxHeight}px;
30
+ overflow-y: scroll;
31
+ `;
32
+ }}
33
+ `;
21
34
  exports.StyledAccordionContent = StyledAccordionContent;
22
35
  //# sourceMappingURL=AccordionContent.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/accordion/accordion-content/AccordionContent.styles.ts"],"names":["StyledAccordionContent","styled","div","isWrapped"],"mappings":";;;;;;;AAAA;;;;;;;;AAMO,IAAMA,sBAAsB,GAAGC,0BAAOC,GAAV,4FACpB;AAAA,MAAGC,SAAH,QAAGA,SAAH;AAAA,SAAoBA,SAAS,GAAG,iBAAH,GAAuB,gBAApD;AAAA,CADoB,CAA5B","sourcesContent":["import styled from 'styled-components';\n\ntype StyledAccordionContentProps = {\n isWrapped: boolean;\n};\n\nexport const StyledAccordionContent = styled.div<StyledAccordionContentProps>`\n padding: ${({ isWrapped }) => (isWrapped ? '0 9px 18px 26px' : '0 9px 9px 10px')};\n`;\n"],"file":"AccordionContent.styles.js"}
1
+ {"version":3,"file":"AccordionContent.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","StyledAccordionContent","styled","div","_ref","theme","text","_ref2","isWrapped","_ref3","maxHeight","css","exports"],"sources":["../../../../src/components/accordion/accordion-content/AccordionContent.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\nimport type { AccordionContentProps } from './AccordionContent';\n\ntype StyledAccordionContentProps = WithTheme<{\n isWrapped: boolean;\n}> &\n Pick<AccordionContentProps, 'maxHeight'>;\n\nexport const StyledAccordionContent = styled.div<StyledAccordionContentProps>`\n color: ${({ theme }: StyledAccordionContentProps) => theme.text};\n padding: ${({ isWrapped }) => (isWrapped ? '0 9px 18px 26px' : '0 9px 9px 10px')};\n\n ${({ maxHeight }) =>\n typeof maxHeight === 'number' &&\n css`\n max-height: ${maxHeight}px;\n overflow-y: scroll;\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;AASzC,MAAMW,sBAAsB,GAAGC,yBAAM,CAACC,GAAiC;AAC9E,aAAaC,IAAA;EAAA,IAAC;IAAEC;EAAmC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAACC,IAAI;AAAA,CAAC;AACpE,eAAeC,KAAA;EAAA,IAAC;IAAEC;EAAU,CAAC,GAAAD,KAAA;EAAA,OAAMC,SAAS,GAAG,iBAAiB,GAAG,gBAAgB;AAAA,CAAE;AACrF;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAU,CAAC,GAAAD,KAAA;EAAA,OACZ,OAAOC,SAAS,KAAK,QAAQ,IAC7B,IAAAC,qBAAG,CAAC;AACZ,0BAA0BD,SAAU;AACpC;AACA,SAAS;AAAA,CAAC;AACV,CAAC;AAACE,OAAA,CAAAX,sBAAA,GAAAA,sBAAA"}
@@ -0,0 +1,26 @@
1
+ import React, { FC, ReactNode } from 'react';
2
+ type IUpdateOpenAccordionUuid = (uuid: string, options?: {
3
+ shouldOnlyOpen?: boolean;
4
+ }) => void;
5
+ interface IAccordionGroupContext {
6
+ openAccordionUuid: string | undefined;
7
+ updateOpenAccordionUuid?: IUpdateOpenAccordionUuid;
8
+ }
9
+ export declare const AccordionGroupContext: React.Context<IAccordionGroupContext>;
10
+ type AccordionGroupProps = {
11
+ /**
12
+ * The Accordions that should be grouped. Accordions with the same group are
13
+ * automatically closed when an `Accordion` of the group is opened.
14
+ */
15
+ children: ReactNode;
16
+ /**
17
+ * Function that is executed when all accordions in group are closed.
18
+ */
19
+ onClose?: VoidFunction;
20
+ /**
21
+ * Function that is executed when any accordion in group will be opened.
22
+ */
23
+ onOpen?: VoidFunction;
24
+ };
25
+ declare const AccordionGroup: FC<AccordionGroupProps>;
26
+ export default AccordionGroup;
@@ -0,0 +1,57 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = exports.AccordionGroupContext = void 0;
7
+ var _react = _interopRequireWildcard(require("react"));
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 AccordionGroupContext = /*#__PURE__*/_react.default.createContext({
11
+ openAccordionUuid: undefined,
12
+ updateOpenAccordionUuid: undefined
13
+ });
14
+ exports.AccordionGroupContext = AccordionGroupContext;
15
+ AccordionGroupContext.displayName = 'AccordionGroupContext';
16
+ const AccordionGroup = _ref => {
17
+ let {
18
+ children,
19
+ onClose,
20
+ onOpen
21
+ } = _ref;
22
+ const [openAccordionUuid, setOpenAccordionUuid] = (0, _react.useState)(undefined);
23
+ const isInitialRenderRef = (0, _react.useRef)(true);
24
+ const updateOpenAccordionUuid = (0, _react.useCallback)(function (uuid) {
25
+ let {
26
+ shouldOnlyOpen
27
+ } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
28
+ setOpenAccordionUuid(currentOpenAccordionUuid => {
29
+ if (currentOpenAccordionUuid === uuid && shouldOnlyOpen !== true) {
30
+ return undefined;
31
+ }
32
+ return uuid;
33
+ });
34
+ }, [setOpenAccordionUuid]);
35
+ (0, _react.useEffect)(() => {
36
+ if (isInitialRenderRef.current) {
37
+ isInitialRenderRef.current = false;
38
+ } else if (typeof openAccordionUuid === 'string') {
39
+ if (typeof onOpen === 'function') {
40
+ onOpen();
41
+ }
42
+ } else if (typeof onClose === 'function') {
43
+ onClose();
44
+ }
45
+ }, [onClose, onOpen, openAccordionUuid]);
46
+ const providerValue = (0, _react.useMemo)(() => ({
47
+ openAccordionUuid,
48
+ updateOpenAccordionUuid
49
+ }), [openAccordionUuid, updateOpenAccordionUuid]);
50
+ return /*#__PURE__*/_react.default.createElement(AccordionGroupContext.Provider, {
51
+ value: providerValue
52
+ }, children);
53
+ };
54
+ AccordionGroup.displayName = 'AccordionGroup';
55
+ var _default = AccordionGroup;
56
+ exports.default = _default;
57
+ //# sourceMappingURL=AccordionGroup.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AccordionGroup.js","names":["_react","_interopRequireWildcard","require","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","AccordionGroupContext","React","createContext","openAccordionUuid","undefined","updateOpenAccordionUuid","exports","displayName","AccordionGroup","_ref","children","onClose","onOpen","setOpenAccordionUuid","useState","isInitialRenderRef","useRef","useCallback","uuid","shouldOnlyOpen","arguments","length","currentOpenAccordionUuid","useEffect","current","providerValue","useMemo","createElement","Provider","value","_default"],"sources":["../../../../src/components/accordion/accordion-group/AccordionGroup.tsx"],"sourcesContent":["import React, { FC, ReactNode, useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\ntype IUpdateOpenAccordionUuid = (uuid: string, options?: { shouldOnlyOpen?: boolean }) => void;\n\ninterface IAccordionGroupContext {\n openAccordionUuid: string | undefined;\n updateOpenAccordionUuid?: IUpdateOpenAccordionUuid;\n}\n\nexport const AccordionGroupContext = React.createContext<IAccordionGroupContext>({\n openAccordionUuid: undefined,\n updateOpenAccordionUuid: undefined,\n});\n\nAccordionGroupContext.displayName = 'AccordionGroupContext';\n\ntype AccordionGroupProps = {\n /**\n * The Accordions that should be grouped. Accordions with the same group are\n * automatically closed when an `Accordion` of the group is opened.\n */\n children: ReactNode;\n /**\n * Function that is executed when all accordions in group are closed.\n */\n onClose?: VoidFunction;\n /**\n * Function that is executed when any accordion in group will be opened.\n */\n onOpen?: VoidFunction;\n};\n\nconst AccordionGroup: FC<AccordionGroupProps> = ({ children, onClose, onOpen }) => {\n const [openAccordionUuid, setOpenAccordionUuid] =\n useState<IAccordionGroupContext['openAccordionUuid']>(undefined);\n\n const isInitialRenderRef = useRef(true);\n\n const updateOpenAccordionUuid = useCallback<IUpdateOpenAccordionUuid>(\n (uuid, { shouldOnlyOpen } = {}) => {\n setOpenAccordionUuid((currentOpenAccordionUuid) => {\n if (currentOpenAccordionUuid === uuid && shouldOnlyOpen !== true) {\n return undefined;\n }\n\n return uuid;\n });\n },\n [setOpenAccordionUuid]\n );\n\n useEffect(() => {\n if (isInitialRenderRef.current) {\n isInitialRenderRef.current = false;\n } else if (typeof openAccordionUuid === 'string') {\n if (typeof onOpen === 'function') {\n onOpen();\n }\n } else if (typeof onClose === 'function') {\n onClose();\n }\n }, [onClose, onOpen, openAccordionUuid]);\n\n const providerValue = useMemo<IAccordionGroupContext>(\n () => ({\n openAccordionUuid,\n updateOpenAccordionUuid,\n }),\n [openAccordionUuid, updateOpenAccordionUuid]\n );\n\n return (\n <AccordionGroupContext.Provider value={providerValue}>\n {children}\n </AccordionGroupContext.Provider>\n );\n};\n\nAccordionGroup.displayName = 'AccordionGroup';\n\nexport default AccordionGroup;\n"],"mappings":"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"}
@@ -1,13 +1,17 @@
1
- import { FC, MouseEventHandler, ReactNode } from 'react';
2
- declare type AccordionHeadProps = {
1
+ import { ChangeEventHandler, FC, MouseEventHandler, ReactNode } from 'react';
2
+ type AccordionHeadProps = {
3
3
  icon?: string;
4
4
  isOpen: boolean;
5
5
  isFixed: boolean;
6
6
  isTitleGreyed: boolean;
7
7
  isWrapped: boolean;
8
8
  onClick: MouseEventHandler<HTMLDivElement>;
9
- right?: ReactNode;
10
- title: ReactNode;
9
+ onSearchChange?: ChangeEventHandler<HTMLInputElement>;
10
+ rightElement?: ReactNode;
11
+ searchIcon?: string[];
12
+ searchPlaceholder?: string;
13
+ title: string;
14
+ titleElement?: ReactNode;
11
15
  };
12
16
  declare const AccordionHead: FC<AccordionHeadProps>;
13
17
  export default AccordionHead;
@@ -1,69 +1,45 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
4
-
5
3
  Object.defineProperty(exports, "__esModule", {
6
4
  value: true
7
5
  });
8
6
  exports.default = void 0;
9
-
10
7
  var _framerMotion = require("framer-motion");
11
-
12
8
  var _react = _interopRequireWildcard(require("react"));
13
-
14
9
  var _Icon = _interopRequireDefault(require("../../icon/Icon"));
15
-
16
- var _AccordionHead = require("./AccordionHead.styles");
17
-
18
10
  var _utils = require("../utils");
19
-
11
+ var _AccordionHead = require("./AccordionHead.styles");
20
12
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
21
-
22
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
23
-
24
- 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; }
25
-
26
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
27
-
28
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
29
-
30
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
31
-
32
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
33
-
34
- function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
35
-
36
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
37
-
38
- var AccordionHead = function AccordionHead(_ref) {
39
- var icon = _ref.icon,
40
- isOpen = _ref.isOpen,
41
- isFixed = _ref.isFixed,
42
- isTitleGreyed = _ref.isTitleGreyed,
43
- isWrapped = _ref.isWrapped,
44
- onClick = _ref.onClick,
45
- right = _ref.right,
46
- title = _ref.title;
47
-
48
- var _useState = (0, _react.useState)({
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 AccordionHead = _ref => {
16
+ let {
17
+ icon,
18
+ isOpen,
19
+ isFixed,
20
+ isTitleGreyed,
21
+ isWrapped,
22
+ onClick,
23
+ onSearchChange,
24
+ rightElement,
25
+ searchIcon,
26
+ searchPlaceholder,
27
+ title,
28
+ titleElement
29
+ } = _ref;
30
+ const [headHeight, setHeadHeight] = (0, _react.useState)({
49
31
  closed: isWrapped ? 40 : 33,
50
32
  open: isWrapped ? 40 : 33
51
- }),
52
- _useState2 = _slicedToArray(_useState, 2),
53
- headHeight = _useState2[0],
54
- setHeadHeight = _useState2[1];
55
-
56
- var titleWrapperRef = (0, _react.useRef)(null);
57
- (0, _react.useEffect)(function () {
58
- if (typeof title === 'string') {
59
- var _titleWrapperRef$curr, _titleWrapperRef$curr2;
60
-
61
- setHeadHeight((0, _utils.getAccordionHeadHeight)({
62
- isWrapped: isWrapped,
63
- title: title,
64
- width: ((_titleWrapperRef$curr = (_titleWrapperRef$curr2 = titleWrapperRef.current) === null || _titleWrapperRef$curr2 === void 0 ? void 0 : _titleWrapperRef$curr2.clientWidth) !== null && _titleWrapperRef$curr !== void 0 ? _titleWrapperRef$curr : 0) - 10
65
- }));
66
- }
33
+ });
34
+ const titleWrapperRef = (0, _react.useRef)(null);
35
+ const hasSearchIcon = Array.isArray(searchIcon);
36
+ (0, _react.useEffect)(() => {
37
+ var _titleWrapperRef$curr, _titleWrapperRef$curr2;
38
+ setHeadHeight((0, _utils.getAccordionHeadHeight)({
39
+ isWrapped,
40
+ title,
41
+ width: ((_titleWrapperRef$curr = (_titleWrapperRef$curr2 = titleWrapperRef.current) === null || _titleWrapperRef$curr2 === void 0 ? void 0 : _titleWrapperRef$curr2.clientWidth) !== null && _titleWrapperRef$curr !== void 0 ? _titleWrapperRef$curr : 0) - 10
42
+ }));
67
43
  }, [isWrapped, title]);
68
44
  return /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledMotionAccordionHead, {
69
45
  animate: {
@@ -79,35 +55,74 @@ var AccordionHead = function AccordionHead(_ref) {
79
55
  onClick: !isFixed ? onClick : undefined
80
56
  }, /*#__PURE__*/_react.default.createElement(_Icon.default, {
81
57
  icons: [isFixed ? 'fa fa-horizontal-rule' : icon !== null && icon !== void 0 ? icon : 'fa fa-chevron-right']
82
- })), /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledMotionTitleWrapper, {
58
+ })), /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledMotionContentWrapper, {
83
59
  animate: {
84
60
  opacity: isTitleGreyed ? 0.5 : 1
85
61
  },
86
62
  initial: false,
87
63
  onClick: !isFixed ? onClick : undefined,
88
64
  ref: titleWrapperRef
89
- }, /*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
65
+ }, /*#__PURE__*/_react.default.createElement(_framerMotion.LayoutGroup, null, /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledMotionTitleWrapper, null, /*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
90
66
  initial: false
91
67
  }, /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledMotionTitle, {
92
68
  animate: {
93
- opacity: 1,
94
69
  scale: 1
95
70
  },
96
- exit: {
97
- opacity: 0,
98
- position: 'absolute',
99
- scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3
100
- },
101
71
  initial: {
102
- opacity: 0,
103
72
  scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3
104
73
  },
105
74
  isOpen: isOpen,
106
75
  isWrapped: isWrapped,
107
76
  key: isOpen && !isWrapped ? 'accordionHeadTitleBig' : 'accordionHeadTitle'
108
- }, title))), right && /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledRightWrapper, null, right));
77
+ }, title))), titleElement && /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledMotionTitleElementWrapper, {
78
+ layout: true
79
+ }, titleElement))), (typeof onSearchChange === 'function' || rightElement) && /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledRightWrapper, null, /*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
80
+ initial: false
81
+ }, typeof onSearchChange === 'function' && isOpen ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledMotionRightInput, {
82
+ animate: {
83
+ opacity: 1,
84
+ width: '165px'
85
+ },
86
+ autoComplete: "off",
87
+ exit: {
88
+ opacity: 0,
89
+ width: 0
90
+ },
91
+ hasIcon: hasSearchIcon,
92
+ initial: {
93
+ opacity: 0,
94
+ width: 0
95
+ },
96
+ key: "rightInput",
97
+ onChange: onSearchChange,
98
+ placeholder: searchPlaceholder,
99
+ type: "text"
100
+ }), hasSearchIcon && /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledMotionRightInputIconWrapper, {
101
+ animate: {
102
+ opacity: 1
103
+ },
104
+ exit: {
105
+ opacity: 0
106
+ },
107
+ initial: {
108
+ opacity: 0
109
+ },
110
+ key: "rightInputIcon"
111
+ }, /*#__PURE__*/_react.default.createElement(_Icon.default, {
112
+ icons: searchIcon
113
+ }))) : /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledMotionRightElementWrapper, {
114
+ animate: {
115
+ opacity: 1
116
+ },
117
+ exit: {
118
+ opacity: 0
119
+ },
120
+ initial: {
121
+ opacity: 0
122
+ },
123
+ key: "rightElementWrapper"
124
+ }, rightElement))));
109
125
  };
110
-
111
126
  AccordionHead.displayName = 'AccordionHead';
112
127
  var _default = AccordionHead;
113
128
  exports.default = _default;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"names":["AccordionHead","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","right","title","closed","open","headHeight","setHeadHeight","titleWrapperRef","width","current","clientWidth","height","rotate","undefined","opacity","scale","position","displayName"],"mappings":"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","sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, { FC, MouseEventHandler, ReactNode, useEffect, useRef, useState } from 'react';\nimport Icon from '../../icon/Icon';\nimport {\n StyledMotionAccordionHead,\n StyledMotionIconWrapper,\n StyledMotionTitle,\n StyledRightWrapper,\n StyledMotionTitleWrapper,\n} from './AccordionHead.styles';\nimport { getAccordionHeadHeight } from '../utils';\n\ntype AccordionHeadProps = {\n icon?: string;\n isOpen: boolean;\n isFixed: boolean;\n isTitleGreyed: boolean;\n isWrapped: boolean;\n onClick: MouseEventHandler<HTMLDivElement>;\n right?: ReactNode;\n title: ReactNode;\n};\n\ninterface HeadHeight {\n closed: number;\n open: number;\n}\n\nconst AccordionHead: FC<AccordionHeadProps> = ({\n icon,\n isOpen,\n isFixed,\n isTitleGreyed,\n isWrapped,\n onClick,\n right,\n title,\n}) => {\n const [headHeight, setHeadHeight] = useState<HeadHeight>({\n closed: isWrapped ? 40 : 33,\n open: isWrapped ? 40 : 33,\n });\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (typeof title === 'string') {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n })\n );\n }\n }, [isWrapped, title]);\n\n return (\n <StyledMotionAccordionHead\n animate={{ height: isOpen ? headHeight.open : headHeight.closed }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: isOpen || isFixed ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n >\n <Icon icons={[isFixed ? 'fa fa-horizontal-rule' : icon ?? 'fa fa-chevron-right']} />\n </StyledMotionIconWrapper>\n <StyledMotionTitleWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n ref={titleWrapperRef}\n >\n <AnimatePresence initial={false}>\n <StyledMotionTitle\n animate={{ opacity: 1, scale: 1 }}\n exit={{\n opacity: 0,\n position: 'absolute',\n scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3,\n }}\n initial={{ opacity: 0, scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n isOpen={isOpen}\n isWrapped={isWrapped}\n key={isOpen && !isWrapped ? 'accordionHeadTitleBig' : 'accordionHeadTitle'}\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {right && <StyledRightWrapper>{right}</StyledRightWrapper>}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"file":"AccordionHead.js"}
1
+ {"version":3,"file":"AccordionHead.js","names":["_framerMotion","require","_react","_interopRequireWildcard","_Icon","_interopRequireDefault","_utils","_AccordionHead","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","AccordionHead","_ref","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchIcon","searchPlaceholder","title","titleElement","headHeight","setHeadHeight","useState","closed","open","titleWrapperRef","useRef","hasSearchIcon","Array","isArray","useEffect","_titleWrapperRef$curr","_titleWrapperRef$curr2","getAccordionHeadHeight","width","current","clientWidth","createElement","StyledMotionAccordionHead","animate","height","className","initial","StyledMotionIconWrapper","rotate","undefined","icons","StyledMotionContentWrapper","opacity","ref","LayoutGroup","StyledMotionTitleWrapper","AnimatePresence","StyledMotionTitle","scale","StyledMotionTitleElementWrapper","layout","StyledRightWrapper","Fragment","StyledMotionRightInput","autoComplete","exit","hasIcon","onChange","placeholder","type","StyledMotionRightInputIconWrapper","StyledMotionRightElementWrapper","displayName","_default","exports"],"sources":["../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'framer-motion';\nimport React, {\n ChangeEventHandler,\n FC,\n MouseEventHandler,\n ReactNode,\n useEffect,\n useRef,\n useState,\n} from 'react';\nimport Icon from '../../icon/Icon';\nimport { getAccordionHeadHeight } from '../utils';\nimport {\n StyledMotionAccordionHead,\n StyledMotionContentWrapper,\n StyledMotionIconWrapper,\n StyledMotionRightElementWrapper,\n StyledMotionRightInput,\n StyledMotionRightInputIconWrapper,\n StyledMotionTitle,\n StyledMotionTitleElementWrapper,\n StyledMotionTitleWrapper,\n StyledRightWrapper,\n} from './AccordionHead.styles';\n\ntype AccordionHeadProps = {\n icon?: string;\n isOpen: boolean;\n isFixed: boolean;\n isTitleGreyed: boolean;\n isWrapped: boolean;\n onClick: MouseEventHandler<HTMLDivElement>;\n onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n rightElement?: ReactNode;\n searchIcon?: string[];\n searchPlaceholder?: string;\n title: string;\n titleElement?: ReactNode;\n};\n\ninterface HeadHeight {\n closed: number;\n open: number;\n}\n\nconst AccordionHead: FC<AccordionHeadProps> = ({\n icon,\n isOpen,\n isFixed,\n isTitleGreyed,\n isWrapped,\n onClick,\n onSearchChange,\n rightElement,\n searchIcon,\n searchPlaceholder,\n title,\n titleElement,\n}) => {\n const [headHeight, setHeadHeight] = useState<HeadHeight>({\n closed: isWrapped ? 40 : 33,\n open: isWrapped ? 40 : 33,\n });\n\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n const hasSearchIcon = Array.isArray(searchIcon);\n\n useEffect(() => {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n })\n );\n }, [isWrapped, title]);\n\n return (\n <StyledMotionAccordionHead\n animate={{ height: isOpen ? headHeight.open : headHeight.closed }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: isOpen || isFixed ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n >\n <Icon icons={[isFixed ? 'fa fa-horizontal-rule' : icon ?? 'fa fa-chevron-right']} />\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n ref={titleWrapperRef}\n >\n <LayoutGroup>\n <StyledMotionTitleWrapper>\n <AnimatePresence initial={false}>\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n isOpen={isOpen}\n isWrapped={isWrapped}\n key={\n isOpen && !isWrapped\n ? 'accordionHeadTitleBig'\n : 'accordionHeadTitle'\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper layout>\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper>\n <AnimatePresence initial={false}>\n {typeof onSearchChange === 'function' && isOpen ? (\n <>\n <StyledMotionRightInput\n animate={{ opacity: 1, width: '165px' }}\n autoComplete=\"off\"\n exit={{ opacity: 0, width: 0 }}\n hasIcon={hasSearchIcon}\n initial={{ opacity: 0, width: 0 }}\n key=\"rightInput\"\n onChange={onSearchChange}\n placeholder={searchPlaceholder}\n type=\"text\"\n />\n {hasSearchIcon && (\n <StyledMotionRightInputIconWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key=\"rightInputIcon\"\n >\n <Icon icons={searchIcon} />\n </StyledMotionRightInputIconWrapper>\n )}\n </>\n ) : (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key=\"rightElementWrapper\"\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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"}
@@ -1,14 +1,19 @@
1
- import type { MouseEventHandler } from 'react';
2
- declare type StyledMotionAccordionHeadProps = {
3
- onClick?: MouseEventHandler<HTMLDivElement>;
4
- };
5
- export declare const StyledMotionAccordionHead: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, StyledMotionAccordionHeadProps, never>;
1
+ export declare const StyledMotionAccordionHead: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, {}, never>;
6
2
  export declare const StyledMotionIconWrapper: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, {}, never>;
3
+ export declare const StyledMotionContentWrapper: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, {}, never>;
7
4
  export declare const StyledMotionTitleWrapper: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, {}, never>;
8
5
  interface StyledMotionTitleProps {
9
6
  isOpen: boolean;
10
7
  isWrapped: boolean;
11
8
  }
12
9
  export declare const StyledMotionTitle: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, StyledMotionTitleProps, never>;
10
+ export declare const StyledMotionTitleElementWrapper: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, {}, never>;
13
11
  export declare const StyledRightWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
12
+ export declare const StyledMotionRightElementWrapper: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, {}, never>;
13
+ export declare const StyledMotionRightInput: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLInputElement, import("framer-motion").HTMLMotionProps<"input">>, any, {
14
+ hasIcon: boolean;
15
+ } & {
16
+ theme: import("../../color-scheme-provider/ColorSchemeProvider").Theme;
17
+ }, never>;
18
+ export declare const StyledMotionRightInputIconWrapper: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, any, {}, never>;
14
19
  export {};