@laerdal/life-react-components 3.4.3 → 3.5.1-uss.hackathon

package/dist/esm/Accordion/AccordionMenuItem.js

@@ -0,0 +1,70 @@
+import _pt from "prop-types";
+import React from 'react';
+import { COLORS, ComponentM, ComponentS } from '..';
+import { SystemIcons } from '../icons';
+import { AccordionItemContainer, ItemBodyContainer, ItemHeaderContainer } from './styles';
+
+const AccordionMenuItem = props => {
+  const {
+    id,
+    onSelect,
+    isActive,
+    title,
+    icon,
+    disabled,
+    isLast
+  } = props;
+  const supressFocusRef = React.useRef(null);
+  const [tabbedHere, setTabbedHere] = React.useState(false);
+  React.useEffect(() => {
+    !!disabled && setTabbedHere(false);
+  }, [disabled]);
+  return /*#__PURE__*/React.createElement(AccordionItemContainer, {
+    id: id,
+    displaySeparator: !isActive && !isLast
+  }, /*#__PURE__*/React.createElement(ItemHeaderContainer, {
+    tabIndex: !disabled ? 0 : -1,
+    onClick: () => {
+      if (!disabled) {
+        onSelect(id);
+      }
+    },
+    onKeyDown: e => {
+      if (e.key == 'Enter') onSelect(id);
+    },
+    onBlur: () => {
+      setTabbedHere(false);
+      supressFocusRef.current = false;
+    },
+    onFocus: () => {
+      if (!disabled) {
+        if (!supressFocusRef.current) setTabbedHere(true);else supressFocusRef.current = false;
+      }
+    },
+    onMouseDown: () => {
+      if (!disabled && !tabbedHere) supressFocusRef.current = true;
+    },
+    tabbedHere: tabbedHere,
+    isActive: isActive,
+    isDisabled: disabled ?? false
+  }, icon && /*#__PURE__*/React.cloneElement(icon, {
+    size: '24px'
+  }), /*#__PURE__*/React.createElement(ComponentM, {
+    className: "headerLabel",
+    color: isActive ? COLORS.neutral_800 : disabled ? COLORS.neutral_300 : COLORS.neutral_600
+  }, title), isActive ? /*#__PURE__*/React.createElement(SystemIcons.ChevronUp, {
+    color: COLORS.neutral_800,
+    size: "20px"
+  }) : /*#__PURE__*/React.createElement(SystemIcons.ChevronDown, {
+    color: COLORS.neutral_600,
+    size: "20px"
+  })), isActive && /*#__PURE__*/React.createElement(ItemBodyContainer, null, /*#__PURE__*/React.createElement(ComponentS, null, props.children)));
+};
+
+AccordionMenuItem.propTypes = {
+  onSelect: _pt.func.isRequired,
+  isActive: _pt.bool.isRequired,
+  isLast: _pt.bool.isRequired
+};
+export default AccordionMenuItem;
+//# sourceMappingURL=AccordionMenuItem.js.map

package/dist/esm/Accordion/AccordionMenuItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Accordion/AccordionMenuItem.tsx"],"names":["React","COLORS","ComponentM","ComponentS","SystemIcons","AccordionItemContainer","ItemBodyContainer","ItemHeaderContainer","AccordionMenuItem","props","id","onSelect","isActive","title","icon","disabled","isLast","supressFocusRef","useRef","tabbedHere","setTabbedHere","useState","useEffect","e","key","current","cloneElement","size","neutral_800","neutral_300","neutral_600","children"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport { COLORS, ComponentM, ComponentS } from '..';\r\nimport { SystemIcons } from '../icons';\r\nimport { AccordionItemProps } from './AccordionMenu';\r\nimport { AccordionItemContainer, HeaderIconContainer, ItemBodyContainer, ItemHeaderContainer } from './styles';\r\n\r\nexport interface AccordionItemPropsInner extends AccordionItemProps {\r\n  onSelect: (id: string) => void;\r\n  isActive: boolean;\r\n  isLast: boolean;\r\n}\r\n\r\nconst AccordionMenuItem: React.FunctionComponent<AccordionItemPropsInner> = (props: AccordionItemPropsInner) => {\r\n  const { id, onSelect, isActive, title, icon, disabled, isLast } = props;\r\n\r\n  const supressFocusRef = React.useRef<any>(null);\r\n  const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\r\n\r\n  React.useEffect(() => {\r\n    !!disabled && setTabbedHere(false);\r\n  }, [disabled]);\r\n\r\n  return (\r\n    <AccordionItemContainer id={id} displaySeparator={!isActive && !isLast}>\r\n      <ItemHeaderContainer\r\n        tabIndex={!disabled ? 0 : -1}\r\n        onClick={() => {\r\n          if (!disabled) {\r\n            onSelect(id);\r\n          }\r\n        }}\r\n        onKeyDown={(e: any) => {\r\n          if(e.key == 'Enter')\r\n            onSelect(id);\r\n        }}\r\n        onBlur={() => {\r\n          setTabbedHere(false);\r\n          supressFocusRef.current = false;\r\n        }}\r\n        onFocus={() => {\r\n          if(!disabled) {\r\n            if (!supressFocusRef.current) setTabbedHere(true);\r\n            else supressFocusRef.current = false;\r\n          }\r\n        }}\r\n        onMouseDown={() => {\r\n          if (!disabled && !tabbedHere) supressFocusRef.current = true;\r\n        }}\r\n        tabbedHere={tabbedHere}\r\n        isActive={isActive}\r\n        isDisabled={disabled ?? false}>\r\n        {icon && React.cloneElement(icon as React.ReactElement, { size: '24px' })}\r\n        <ComponentM className=\"headerLabel\" color={isActive ? COLORS.neutral_800 : disabled ? COLORS.neutral_300 : COLORS.neutral_600}>{title}</ComponentM>\r\n        {isActive ? <SystemIcons.ChevronUp color={COLORS.neutral_800} size=\"20px\" /> : <SystemIcons.ChevronDown color={COLORS.neutral_600} size=\"20px\" />}\r\n      </ItemHeaderContainer>\r\n      {isActive && (\r\n        <ItemBodyContainer>\r\n          <ComponentS>{props.children}</ComponentS>\r\n        </ItemBodyContainer>\r\n      )}\r\n    </AccordionItemContainer>\r\n  );\r\n};\r\n\r\nexport default AccordionMenuItem;\r\n"],"file":"AccordionMenuItem.js"}

package/dist/esm/Accordion/ContentAccordion.js

@@ -0,0 +1,238 @@
+import _pt from "prop-types";
+import React from 'react';
+import styled from 'styled-components';
+import { Size } from '../types';
+import { SystemIcons } from '../icons';
+import { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';
+import { COLORS } from '../styles';
+import { Z_INDEXES } from '../styles/z-indexes';
+const ContentAccordionWrapper = styled.div`
+  width: 100%;
+  position: relative;
+
+
+  .content-accordion-item {
+    display: flex;
+    flex-direction: column;
+    border-top: 1px solid ${COLORS.neutral_100};
+
+    .item-header {
+      display: flex;
+      align-items: center;
+      box-sizing: border-box;
+      min-height: 48px;
+      color: ${COLORS.neutral_600};
+      cursor: pointer;
+
+      &:hover {
+        color: ${COLORS.primary_700};
+        background-color: ${COLORS.primary_20};
+        z-index: ${Z_INDEXES.hover};
+      }
+
+      &:focus {
+        box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2E7FA1;
+        background-color: ${COLORS.white};
+        z-index: ${Z_INDEXES.focus};
+        outline: none;
+      }
+
+      &:active {
+        color: ${COLORS.primary_800};
+        background-color: ${COLORS.primary_100};
+        box-shadow: none;
+        z-index: ${Z_INDEXES.active};
+      }
+
+      .item-header-icon,
+      .item-header-icon svg {
+        width: 24px;
+        height: 24px;
+      }
+
+      .item-header-text {
+      }
+    }
+
+    .item-content {
+      display: none;
+      flex-direction: column;
+
+      .item-content-header {
+
+      }
+
+      .item-content-body {
+
+      }
+
+      .item-content-footer {
+      }
+    }
+
+    &.active {
+      .item-content {
+        display: flex;
+      }
+    }
+
+    &.disabled {
+      .item-header {
+        color: ${COLORS.neutral_300};
+        cursor: not-allowed;
+        pointer-events: none;
+      }
+    }
+  }
+
+  .content-accordion-item:last-child {
+    border-bottom: 1px solid ${COLORS.neutral_100};
+  }
+
+  &.small {
+    min-width: 320px;
+    max-width: 528px;
+
+    .item-header {
+      gap: 8px;
+      padding: 0 8px;
+      ${ComponentSStyling(ComponentTextStyle.Regular, null)}
+    }
+
+    .item-content {
+      padding: 0 8px 16px 40px;
+      gap: 8px;
+
+      .item-content-header {
+        ${ComponentSStyling(ComponentTextStyle.Bold, null)}
+      }
+
+      .item-content-body {
+        ${ComponentSStyling(ComponentTextStyle.Regular, null)}
+      }
+    }
+  }
+
+
+  &.medium {
+    min-width: 344px;
+    max-width: 584px;
+
+    .item-header {
+      gap: 12px;
+      padding: 0 12px;
+      ${ComponentMStyling(ComponentTextStyle.Regular, null)}
+    }
+
+    .item-content {
+      padding: 8px 12px 24px 48px;
+      gap: 12px;
+
+      .item-content-header {
+        ${ComponentMStyling(ComponentTextStyle.Bold, null)}
+      }
+
+      .item-content-body {
+        ${ComponentMStyling(ComponentTextStyle.Regular, null)}
+      }
+
+    }
+  }
+
+  &.large {
+    min-width: 384px;
+    max-width: 656px;
+
+    .item-header {
+      gap: 16px;
+      padding: 0 16px;
+      ${ComponentLStyling(ComponentTextStyle.Regular, null)}
+    }
+
+    .item-content {
+      padding: 16px 16px 32px 56px;
+      gap: 16px;
+
+      .item-content-header {
+        ${ComponentLStyling(ComponentTextStyle.Bold, null)}
+      }
+
+      .item-content-body {
+        ${ComponentLStyling(ComponentTextStyle.Regular, null)}
+      }
+    }
+  }
+`;
+export const ContentAccordion = props => {
+  const [opened, setOpened] = React.useState([]);
+  React.useEffect(() => {
+    if (props.multi) {
+      setOpened(props.items.filter(item => item.active).map(item => item.key));
+    } else {
+      let active = props.items.find(item => !!item.active)?.key;
+
+      if (active) {
+        setOpened([active]);
+      }
+    }
+  }, [props.items, props.multi]);
+
+  const onItemClick = item => {
+    if (item.disabled) return;
+
+    if (opened.includes(item.key)) {
+      setOpened(opened.filter(key => key !== item.key));
+    } else {
+      if (props.multi) {
+        setOpened([...opened, item.key]);
+      } else {
+        setOpened([item.key]);
+      }
+    }
+  };
+
+  const renderItem = item => {
+    const isActive = opened.includes(item.key);
+    return /*#__PURE__*/React.createElement("div", {
+      key: item.key,
+      id: `item_${item.key}`,
+      className: 'content-accordion-item'.concat(isActive ? ' active' : '').concat(item.disabled ? ' disabled' : '')
+    }, /*#__PURE__*/React.createElement("div", {
+      className: 'item-header',
+      tabIndex: !item.disabled ? 0 : undefined,
+      onMouseDown: e => e.preventDefault(),
+      onClick: () => !item.disabled && onItemClick(item),
+      onKeyPress: event => event.key === 'Enter' && onItemClick(item)
+    }, /*#__PURE__*/React.createElement("div", {
+      className: 'item-header-icon'
+    }, props.multi ? isActive ? /*#__PURE__*/React.createElement(SystemIcons.Minus, null) : /*#__PURE__*/React.createElement(SystemIcons.Plus, null) : isActive ? /*#__PURE__*/React.createElement(SystemIcons.ChevronDown, null) : /*#__PURE__*/React.createElement(SystemIcons.ChevronRight, null)), /*#__PURE__*/React.createElement("div", {
+      className: 'item-header-text'
+    }, item.title)), /*#__PURE__*/React.createElement("div", {
+      className: 'item-content'
+    }, item.header && /*#__PURE__*/React.createElement("div", {
+      className: 'item-content-header'
+    }, item.header), /*#__PURE__*/React.createElement("div", {
+      className: 'item-content-body'
+    }, item.body), item.footer && /*#__PURE__*/React.createElement("div", {
+      className: 'item-content-footer'
+    }, item.footer)));
+  };
+
+  return /*#__PURE__*/React.createElement(ContentAccordionWrapper, {
+    className: 'content-accordion'.concat(` ${props.size ?? Size.Medium}`)
+  }, props.items.map(item => renderItem(item)));
+};
+ContentAccordion.propTypes = {
+  items: _pt.arrayOf(_pt.shape({
+    key: _pt.string.isRequired,
+    title: _pt.string.isRequired,
+    header: _pt.string,
+    body: _pt.any.isRequired,
+    footer: _pt.any,
+    disabled: _pt.bool,
+    active: _pt.bool
+  })).isRequired,
+  multi: _pt.bool
+};
+export default ContentAccordion;
+//# sourceMappingURL=ContentAccordion.js.map

package/dist/esm/Accordion/ContentAccordion.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Accordion/ContentAccordion.tsx"],"names":["React","styled","Size","SystemIcons","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","Z_INDEXES","ContentAccordionWrapper","div","neutral_100","neutral_600","primary_700","primary_20","hover","white","focus","primary_800","primary_100","active","neutral_300","Regular","Bold","ContentAccordion","props","opened","setOpened","useState","useEffect","multi","items","filter","item","map","key","find","onItemClick","disabled","includes","renderItem","isActive","concat","undefined","e","preventDefault","event","title","header","body","footer","size","Medium"],"mappings":";AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,IAAR,QAAmB,UAAnB;AACA,SAAQC,WAAR,QAA0B,UAA1B;AACA,SAAQC,iBAAR,EAA2BC,iBAA3B,EAA8CC,iBAA9C,EAAiEC,kBAAjE,QAA0F,sBAA1F;AACA,SAAQC,MAAR,QAAqB,WAArB;AACA,SAAQC,SAAR,QAAwB,qBAAxB;AAGA,MAAMC,uBAAuB,GAAGT,MAAM,CAACU,GAAI;AAC3C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,4BAA4BH,MAAM,CAACI,WAAY;AAC/C;AACA;AACA;AACA;AACA;AACA;AACA,eAAeJ,MAAM,CAACK,WAAY;AAClC;AACA;AACA;AACA,iBAAiBL,MAAM,CAACM,WAAY;AACpC,4BAA4BN,MAAM,CAACO,UAAW;AAC9C,mBAAmBN,SAAS,CAACO,KAAM;AACnC;AACA;AACA;AACA;AACA,4BAA4BR,MAAM,CAACS,KAAM;AACzC,mBAAmBR,SAAS,CAACS,KAAM;AACnC;AACA;AACA;AACA;AACA,iBAAiBV,MAAM,CAACW,WAAY;AACpC,4BAA4BX,MAAM,CAACY,WAAY;AAC/C;AACA,mBAAmBX,SAAS,CAACY,MAAO;AACpC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiBb,MAAM,CAACc,WAAY;AACpC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+BAA+Bd,MAAM,CAACI,WAAY;AAClD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,QAAQN,iBAAiB,CAACC,kBAAkB,CAACgB,OAApB,EAA6B,IAA7B,CAAmC;AAC5D;AACA;AACA;AACA;AACA;AACA;AACA;AACA,UAAUjB,iBAAiB,CAACC,kBAAkB,CAACiB,IAApB,EAA0B,IAA1B,CAAgC;AAC3D;AACA;A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","sourcesContent":["import React from 'react'\r\nimport styled from 'styled-components';\r\nimport {Size} from '../types';\r\nimport {SystemIcons} from '../icons';\r\nimport {ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle} from '../styles/typography';\r\nimport {COLORS} from '../styles';\r\nimport {Z_INDEXES} from '../styles/z-indexes';\r\n\r\n\r\nconst ContentAccordionWrapper = styled.div`\r\n  width: 100%;\r\n  position: relative;\r\n\r\n\r\n  .content-accordion-item {\r\n    display: flex;\r\n    flex-direction: column;\r\n    border-top: 1px solid ${COLORS.neutral_100};\r\n\r\n    .item-header {\r\n      display: flex;\r\n      align-items: center;\r\n      box-sizing: border-box;\r\n      min-height: 48px;\r\n      color: ${COLORS.neutral_600};\r\n      cursor: pointer;\r\n\r\n      &:hover {\r\n        color: ${COLORS.primary_700};\r\n        background-color: ${COLORS.primary_20};\r\n        z-index: ${Z_INDEXES.hover};\r\n      }\r\n\r\n      &:focus {\r\n        box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2E7FA1;\r\n        background-color: ${COLORS.white};\r\n        z-index: ${Z_INDEXES.focus};\r\n        outline: none;\r\n      }\r\n\r\n      &:active {\r\n        color: ${COLORS.primary_800};\r\n        background-color: ${COLORS.primary_100};\r\n        box-shadow: none;\r\n        z-index: ${Z_INDEXES.active};\r\n      }\r\n\r\n      .item-header-icon,\r\n      .item-header-icon svg {\r\n        width: 24px;\r\n        height: 24px;\r\n      }\r\n\r\n      .item-header-text {\r\n      }\r\n    }\r\n\r\n    .item-content {\r\n      display: none;\r\n      flex-direction: column;\r\n\r\n      .item-content-header {\r\n\r\n      }\r\n\r\n      .item-content-body {\r\n\r\n      }\r\n\r\n      .item-content-footer {\r\n      }\r\n    }\r\n\r\n    &.active {\r\n      .item-content {\r\n        display: flex;\r\n      }\r\n    }\r\n\r\n    &.disabled {\r\n      .item-header {\r\n        color: ${COLORS.neutral_300};\r\n        cursor: not-allowed;\r\n        pointer-events: none;\r\n      }\r\n    }\r\n  }\r\n\r\n  .content-accordion-item:last-child {\r\n    border-bottom: 1px solid ${COLORS.neutral_100};\r\n  }\r\n\r\n  &.small {\r\n    min-width: 320px;\r\n    max-width: 528px;\r\n\r\n    .item-header {\r\n      gap: 8px;\r\n      padding: 0 8px;\r\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\r\n    }\r\n\r\n    .item-content {\r\n      padding: 0 8px 16px 40px;\r\n      gap: 8px;\r\n\r\n      .item-content-header {\r\n        ${ComponentSStyling(ComponentTextStyle.Bold, null)}\r\n      }\r\n\r\n      .item-content-body {\r\n        ${ComponentSStyling(ComponentTextStyle.Regular, null)}\r\n      }\r\n    }\r\n  }\r\n\r\n\r\n  &.medium {\r\n    min-width: 344px;\r\n    max-width: 584px;\r\n\r\n    .item-header {\r\n      gap: 12px;\r\n      padding: 0 12px;\r\n      ${ComponentMStyling(ComponentTextStyle.Regular, null)}\r\n    }\r\n\r\n    .item-content {\r\n      padding: 8px 12px 24px 48px;\r\n      gap: 12px;\r\n\r\n      .item-content-header {\r\n        ${ComponentMStyling(ComponentTextStyle.Bold, null)}\r\n      }\r\n\r\n      .item-content-body {\r\n        ${ComponentMStyling(ComponentTextStyle.Regular, null)}\r\n      }\r\n\r\n    }\r\n  }\r\n\r\n  &.large {\r\n    min-width: 384px;\r\n    max-width: 656px;\r\n\r\n    .item-header {\r\n      gap: 16px;\r\n      padding: 0 16px;\r\n      ${ComponentLStyling(ComponentTextStyle.Regular, null)}\r\n    }\r\n\r\n    .item-content {\r\n      padding: 16px 16px 32px 56px;\r\n      gap: 16px;\r\n\r\n      .item-content-header {\r\n        ${ComponentLStyling(ComponentTextStyle.Bold, null)}\r\n      }\r\n\r\n      .item-content-body {\r\n        ${ComponentLStyling(ComponentTextStyle.Regular, null)}\r\n      }\r\n    }\r\n  }\r\n`;\r\n\r\nexport interface ContentAccordionItem {\r\n  key: string;\r\n  title: string;\r\n  header?: string;\r\n  body: any;\r\n  footer?: any;\r\n  disabled?: boolean;\r\n  active?: boolean;\r\n}\r\n\r\nexport interface ContentAccordionProps {\r\n  items: ContentAccordionItem[];\r\n  multi?: boolean;\r\n  size?: Size;\r\n}\r\n\r\nexport const ContentAccordion: React.FunctionComponent<ContentAccordionProps> = (props) => {\r\n\r\n  const [opened, setOpened] = React.useState<string[]>([]);\r\n\r\n  React.useEffect(() => {\r\n    if (props.multi) {\r\n      setOpened(props.items.filter(item => item.active).map(item => item.key));\r\n    } else {\r\n      let active = props.items.find(item => !!item.active)?.key;\r\n      if (active) {\r\n        setOpened([active]);\r\n      }\r\n    }\r\n  }, [props.items, props.multi]);\r\n\r\n  const onItemClick = (item: ContentAccordionItem) => {\r\n    if (item.disabled) return;\r\n    if (opened.includes(item.key)) {\r\n      setOpened(opened.filter(key => key !== item.key));\r\n    } else {\r\n      if (props.multi) {\r\n        setOpened([...opened, item.key]);\r\n      } else {\r\n        setOpened([item.key]);\r\n      }\r\n    }\r\n  }\r\n\r\n  const renderItem = (item: ContentAccordionItem) => {\r\n    const isActive = opened.includes(item.key);\r\n\r\n    return (\r\n      <div key={item.key}\r\n           id={`item_${item.key}`}\r\n           className={'content-accordion-item'.concat(isActive ? ' active' : '').concat(item.disabled ? ' disabled' : '')}>\r\n        <div className={'item-header'}\r\n             tabIndex={!item.disabled ? 0 : undefined}\r\n             onMouseDown={e => e.preventDefault()}\r\n             onClick={() => !item.disabled && onItemClick(item)}\r\n             onKeyPress={event => event.key === 'Enter' && onItemClick(item)}>\r\n          <div className={'item-header-icon'}>\r\n            {\r\n              props.multi\r\n                ? isActive\r\n                  ? <SystemIcons.Minus/>\r\n                  : <SystemIcons.Plus/>\r\n                : isActive\r\n                  ? <SystemIcons.ChevronDown/>\r\n                  : <SystemIcons.ChevronRight/>\r\n            }\r\n          </div>\r\n          <div className={'item-header-text'}>\r\n            {item.title}\r\n          </div>\r\n        </div>\r\n        <div className={'item-content'}>\r\n          {\r\n            item.header &&\r\n            <div className={'item-content-header'}>\r\n              {item.header}\r\n            </div>\r\n          }\r\n          <div className={'item-content-body'}>\r\n            {item.body}\r\n          </div>\r\n          {\r\n            item.footer &&\r\n            <div className={'item-content-footer'}>\r\n              {item.footer}\r\n            </div>\r\n          }\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <ContentAccordionWrapper className={'content-accordion'.concat(` ${props.size ?? Size.Medium}`)}>\r\n      {props.items.map(item => renderItem(item))}\r\n    </ContentAccordionWrapper>\r\n  );\r\n};\r\n\r\nexport default ContentAccordion;\r\n"],"file":"ContentAccordion.js"}

package/dist/esm/Accordion/ContentAccordionItem.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=ContentAccordionItem.js.map

package/dist/esm/Accordion/ContentAccordionItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"ContentAccordionItem.js"}

package/dist/esm/Accordion/__tests__/AccordionMenu.test.js

@@ -0,0 +1,53 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import 'jest-styled-components';
+import { COLORS } from '../../styles';
+import AccordionMenu from '../AccordionMenu';
+const accordionItems = [{
+  id: 'test1_id',
+  title: 'Item label with text 1',
+  children: /*#__PURE__*/React.createElement("div", null, "content test1")
+}, {
+  id: 'test2_id',
+  title: 'Item label with text 2',
+  children: /*#__PURE__*/React.createElement("div", null, "content test2")
+}];
+describe('<AccordionMenu />', () => {
+  it('Check correct text placed on labels', async () => {
+    const {
+      queryByText
+    } = render( /*#__PURE__*/React.createElement(AccordionMenu, {
+      items: accordionItems,
+      onSelect: () => {}
+    }));
+    expect(queryByText('Item label with text 1')).toBeDefined();
+    expect(queryByText('Item label with text 2')).toBeDefined();
+    expect(queryByText('content test1')).toBeNull();
+  });
+  it('Check item label element color and label', async () => {
+    const {
+      container
+    } = render( /*#__PURE__*/React.createElement(AccordionMenu, {
+      items: accordionItems,
+      onSelect: () => {}
+    }));
+    const headerItem = container.querySelector('#test2_id');
+    expect(headerItem).toBeDefined();
+    expect(headerItem?.children[0]).toHaveStyleRule('background', COLORS.neutral_20);
+    expect(headerItem?.textContent).toContain('Item label with text 2');
+  });
+  it('Check expanded item text', async () => {
+    const {
+      container
+    } = render( /*#__PURE__*/React.createElement(AccordionMenu, {
+      items: accordionItems,
+      onSelect: () => {},
+      selectedItems: ['test1_id']
+    }));
+    const headerItem = container.querySelector('#test1_id'); //check item expanded
+
+    expect(headerItem?.children[1]).toBeDefined();
+    expect(headerItem?.children[1]?.textContent).toContain('content test1');
+  });
+});
+//# sourceMappingURL=AccordionMenu.test.js.map

package/dist/esm/Accordion/__tests__/AccordionMenu.test.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/Accordion/__tests__/AccordionMenu.test.tsx"],"names":["React","render","COLORS","AccordionMenu","accordionItems","id","title","children","describe","it","queryByText","expect","toBeDefined","toBeNull","container","headerItem","querySelector","toHaveStyleRule","neutral_20","textContent","toContain"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,MAAT,QAAuB,wBAAvB;AACA,OAAO,wBAAP;AACA,SAASC,MAAT,QAAuB,cAAvB;AACA,OAAOC,aAAP,MAA0B,kBAA1B;AAEA,MAAMC,cAAc,GAAG,CACrB;AACEC,EAAAA,EAAE,EAAE,UADN;AAEEC,EAAAA,KAAK,EAAE,wBAFT;AAGEC,EAAAA,QAAQ,eAAE;AAHZ,CADqB,EAMrB;AACEF,EAAAA,EAAE,EAAE,UADN;AAEEC,EAAAA,KAAK,EAAE,wBAFT;AAGEC,EAAAA,QAAQ,eAAE;AAHZ,CANqB,CAAvB;AAaAC,QAAQ,CAAC,mBAAD,EAAsB,MAAM;AAClCC,EAAAA,EAAE,CAAC,qCAAD,EAAwC,YAAY;AACpD,UAAM;AAAEC,MAAAA;AAAF,QAAkBT,MAAM,eAAC,oBAAC,aAAD;AAAe,MAAA,KAAK,EAAEG,cAAtB;AAAsC,MAAA,QAAQ,EAAE,MAAM,CAAE;AAAxD,MAAD,CAA9B;AACAO,IAAAA,MAAM,CAACD,WAAW,CAAC,wBAAD,CAAZ,CAAN,CAA8CE,WAA9C;AACAD,IAAAA,MAAM,CAACD,WAAW,CAAC,wBAAD,CAAZ,CAAN,CAA8CE,WAA9C;AACAD,IAAAA,MAAM,CAACD,WAAW,CAAC,eAAD,CAAZ,CAAN,CAAqCG,QAArC;AACD,GALC,CAAF;AAOAJ,EAAAA,EAAE,CAAC,0CAAD,EAA6C,YAAY;AACzD,UAAM;AAAEK,MAAAA;AAAF,QAAgBb,MAAM,eAAC,oBAAC,aAAD;AAAe,MAAA,KAAK,EAAEG,cAAtB;AAAsC,MAAA,QAAQ,EAAE,MAAM,CAAE;AAAxD,MAAD,CAA5B;AACA,UAAMW,UAAU,GAAGD,SAAS,CAACE,aAAV,CAAwB,WAAxB,CAAnB;AACAL,IAAAA,MAAM,CAACI,UAAD,CAAN,CAAmBH,WAAnB;AACAD,IAAAA,MAAM,CAACI,UAAU,EAAER,QAAZ,CAAqB,CAArB,CAAD,CAAN,CAAgCU,eAAhC,CAAgD,YAAhD,EAA8Df,MAAM,CAACgB,UAArE;AACAP,IAAAA,MAAM,CAACI,UAAU,EAAEI,WAAb,CAAN,CAAgCC,SAAhC,CAA0C,wBAA1C;AACD,GANC,CAAF;AAQAX,EAAAA,EAAE,CAAC,0BAAD,EAA6B,YAAY;AACzC,UAAM;AAAEK,MAAAA;AAAF,QAAgBb,MAAM,eAAC,oBAAC,aAAD;AAAe,MAAA,KAAK,EAAEG,cAAtB;AAAsC,MAAA,QAAQ,EAAE,MAAM,CAAE,CAAxD;AAA0D,MAAA,aAAa,EAAE,CAAC,UAAD;AAAzE,MAAD,CAA5B;AACA,UAAMW,UAAU,GAAGD,SAAS,CAACE,aAAV,CAAwB,WAAxB,CAAnB,CAFyC,CAGzC;;AACAL,IAAAA,MAAM,CAACI,UAAU,EAAER,QAAZ,CAAqB,CAArB,CAAD,CAAN,CAAgCK,WAAhC;AACAD,IAAAA,MAAM,CAACI,UAAU,EAAER,QAAZ,CAAqB,CAArB,GAAyBY,WAA1B,CAAN,CAA6CC,SAA7C,CAAuD,eAAvD;AACD,GANC,CAAF;AAOD,CAvBO,CAAR","sourcesContent":["import React from 'react';\r\nimport { render } from '@testing-library/react';\r\nimport 'jest-styled-components';\r\nimport { COLORS } from '../../styles';\r\nimport AccordionMenu from '../AccordionMenu';\r\n\r\nconst accordionItems = [\r\n  {\r\n    id: 'test1_id',\r\n    title: 'Item label with text 1',\r\n    children: <div>content test1</div>,\r\n  },\r\n  {\r\n    id: 'test2_id',\r\n    title: 'Item label with text 2',\r\n    children: <div>content test2</div>,\r\n  },\r\n];\r\n\r\ndescribe('<AccordionMenu />', () => {\r\n  it('Check correct text placed on labels', async () => {\r\n    const { queryByText } = render(<AccordionMenu items={accordionItems} onSelect={() => {}}></AccordionMenu>);\r\n    expect(queryByText('Item label with text 1')).toBeDefined();\r\n    expect(queryByText('Item label with text 2')).toBeDefined();\r\n    expect(queryByText('content test1')).toBeNull();\r\n  });\r\n\r\n  it('Check item label element color and label', async () => {\r\n    const { container } = render(<AccordionMenu items={accordionItems} onSelect={() => {}}></AccordionMenu>);\r\n    const headerItem = container.querySelector('#test2_id');\r\n    expect(headerItem).toBeDefined();\r\n    expect(headerItem?.children[0]).toHaveStyleRule('background', COLORS.neutral_20);\r\n    expect(headerItem?.textContent).toContain('Item label with text 2');\r\n  });\r\n\r\n  it('Check expanded item text', async () => {\r\n    const { container } = render(<AccordionMenu items={accordionItems} onSelect={() => {}} selectedItems={['test1_id']}></AccordionMenu>);\r\n    const headerItem = container.querySelector('#test1_id');\r\n    //check item expanded\r\n    expect(headerItem?.children[1]).toBeDefined();\r\n    expect(headerItem?.children[1]?.textContent).toContain('content test1');\r\n  });\r\n});\r\n"],"file":"AccordionMenu.test.js"}

package/dist/esm/Accordion/__tests__/ContetnAccordion.test.js

@@ -0,0 +1,137 @@
+import React from 'react';
+import ContentAccordion from '../ContentAccordion';
+import { fireEvent, render } from '@testing-library/react';
+import { Size } from '../../types';
+describe('ContentAccordion', () => {
+  const contentAccordionItemsWithBody = [{
+    key: '1',
+    title: 'Item 1',
+    body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.'
+  }, {
+    key: '2',
+    title: 'Item 2',
+    body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    active: true
+  }, {
+    key: '3',
+    title: 'Item 3',
+    body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    disabled: true
+  }, {
+    key: '4',
+    title: 'Item 4',
+    body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.'
+  }];
+  const contentAccordionItemsWithBodyAndHeaderAndFooter = [{
+    key: '1',
+    title: 'Item 1',
+    body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    header: 'Header 1',
+    footer: /*#__PURE__*/React.createElement("span", null)
+  }, {
+    key: '2',
+    title: 'Item 2',
+    body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    header: 'Header 2',
+    footer: /*#__PURE__*/React.createElement("span", null)
+  }, {
+    key: '3',
+    title: 'Item 3',
+    body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    header: 'Header 3',
+    footer: /*#__PURE__*/React.createElement("span", null),
+    disabled: true
+  }, {
+    key: '4',
+    title: 'Item 4',
+    body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    header: 'Header 4',
+    footer: /*#__PURE__*/React.createElement("span", null)
+  }];
+  it('should render items in correct state', () => {
+    const wrapper = render( /*#__PURE__*/React.createElement(ContentAccordion, {
+      items: contentAccordionItemsWithBody
+    }));
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item').length).toBe(4);
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item disabled').length).toBe(1);
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item disabled')[0].id).toBe('item_3');
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active').length).toBe(1);
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active')[0].id).toBe('item_2');
+  });
+  it('should not render header if not provided', () => {
+    const wrapper = render( /*#__PURE__*/React.createElement(ContentAccordion, {
+      items: contentAccordionItemsWithBody
+    }));
+    expect(wrapper.baseElement.getElementsByClassName('item-content-body').length).toBe(4);
+    expect(wrapper.baseElement.getElementsByClassName('item-content-header').length).toBe(0);
+  });
+  it('should not render footer if not provided', () => {
+    const wrapper = render( /*#__PURE__*/React.createElement(ContentAccordion, {
+      items: contentAccordionItemsWithBody
+    }));
+    expect(wrapper.baseElement.getElementsByClassName('item-content-body').length).toBe(4);
+    expect(wrapper.baseElement.getElementsByClassName('item-content-footer').length).toBe(0);
+  });
+  it('should render body, header, and footer if all are provided', () => {
+    const wrapper = render( /*#__PURE__*/React.createElement(ContentAccordion, {
+      items: contentAccordionItemsWithBodyAndHeaderAndFooter
+    }));
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item').length).toBe(4);
+    expect(wrapper.baseElement.getElementsByClassName('item-content-body').length).toBe(4);
+    expect(wrapper.baseElement.getElementsByClassName('item-content-header').length).toBe(4);
+    expect(wrapper.baseElement.getElementsByClassName('item-content-footer').length).toBe(4);
+  });
+  it('should set correct size class name for small accordion', () => {
+    const wrapper = render( /*#__PURE__*/React.createElement(ContentAccordion, {
+      items: contentAccordionItemsWithBodyAndHeaderAndFooter,
+      size: Size.Small
+    }));
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion small').length).toBe(1);
+  });
+  it('should set correct size class name for medium accordion', () => {
+    const wrapper = render( /*#__PURE__*/React.createElement(ContentAccordion, {
+      items: contentAccordionItemsWithBodyAndHeaderAndFooter,
+      size: Size.Medium
+    }));
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion medium').length).toBe(1);
+  });
+  it('should set correct size class name for large accordion', () => {
+    const wrapper = render( /*#__PURE__*/React.createElement(ContentAccordion, {
+      items: contentAccordionItemsWithBodyAndHeaderAndFooter,
+      size: Size.Large
+    }));
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion large').length).toBe(1);
+  });
+  it('should change active state when item header is clicked', () => {
+    const wrapper = render( /*#__PURE__*/React.createElement(ContentAccordion, {
+      items: contentAccordionItemsWithBody,
+      multi: false
+    }));
+    const itemHeader = wrapper.baseElement.getElementsByClassName('item-header')[3];
+    fireEvent.click(itemHeader);
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active').length).toBe(1);
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active')[0].id).toBe('item_4');
+  });
+  it('should not change active state when disabled item header is clicked', () => {
+    const wrapper = render( /*#__PURE__*/React.createElement(ContentAccordion, {
+      items: contentAccordionItemsWithBody,
+      multi: false
+    }));
+    const itemHeader = wrapper.baseElement.getElementsByClassName('item-header')[2];
+    fireEvent.click(itemHeader);
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active').length).toBe(1);
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active')[0].id).toBe('item_2');
+  });
+  it('should append active items if multi property is true', () => {
+    const wrapper = render( /*#__PURE__*/React.createElement(ContentAccordion, {
+      items: contentAccordionItemsWithBody,
+      multi: true
+    }));
+    const itemHeader = wrapper.baseElement.getElementsByClassName('item-header')[3];
+    fireEvent.click(itemHeader);
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active').length).toBe(2);
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active')[0].id).toBe('item_2');
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active')[1].id).toBe('item_4');
+  });
+});
+//# sourceMappingURL=ContetnAccordion.test.js.map

package/dist/esm/Accordion/__tests__/ContetnAccordion.test.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/Accordion/__tests__/ContetnAccordion.test.tsx"],"names":["React","ContentAccordion","fireEvent","render","Size","describe","contentAccordionItemsWithBody","key","title","body","active","disabled","contentAccordionItemsWithBodyAndHeaderAndFooter","header","footer","it","wrapper","expect","baseElement","getElementsByClassName","length","toBe","id","Small","Medium","Large","itemHeader","click"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport ContentAccordion from '../ContentAccordion';\r\nimport {fireEvent, render} from '@testing-library/react';\r\nimport {Size} from '../../types';\r\n\r\ndescribe('ContentAccordion', () => {\r\n  const contentAccordionItemsWithBody = [\r\n    {\r\n      key: '1',\r\n      title: 'Item 1',\r\n      body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.'\r\n    },\r\n    {\r\n      key: '2',\r\n      title: 'Item 2',\r\n      body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\r\n      active: true\r\n    },\r\n    {\r\n      key: '3',\r\n      title: 'Item 3',\r\n      body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\r\n      disabled: true\r\n    },\r\n    {\r\n      key: '4',\r\n      title: 'Item 4',\r\n      body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.'\r\n    }\r\n  ];\r\n\r\n  const contentAccordionItemsWithBodyAndHeaderAndFooter = [\r\n    {\r\n      key: '1',\r\n      title: 'Item 1',\r\n      body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\r\n      header: 'Header 1',\r\n      footer: <span/>,\r\n    },\r\n    {\r\n      key: '2',\r\n      title: 'Item 2',\r\n      body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\r\n      header: 'Header 2',\r\n      footer: <span/>,\r\n    },\r\n    {\r\n      key: '3',\r\n      title: 'Item 3',\r\n      body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\r\n      header: 'Header 3',\r\n      footer: <span/>,\r\n      disabled: true\r\n    },\r\n    {\r\n      key: '4',\r\n      title: 'Item 4',\r\n      body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\r\n      header: 'Header 4',\r\n      footer: <span/>,\r\n    }\r\n  ];\r\n\r\n  it('should render items in correct state', () => {\r\n    const wrapper = render(<ContentAccordion items={contentAccordionItemsWithBody}/>);\r\n\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item').length).toBe(4);\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item disabled').length).toBe(1);\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item disabled')[0].id).toBe('item_3');\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active').length).toBe(1);\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active')[0].id).toBe('item_2');\r\n  });\r\n\r\n  it('should not render header if not provided', () => {\r\n    const wrapper = render(<ContentAccordion items={contentAccordionItemsWithBody}/>);\r\n\r\n    expect(wrapper.baseElement.getElementsByClassName('item-content-body').length).toBe(4);\r\n    expect(wrapper.baseElement.getElementsByClassName('item-content-header').length).toBe(0);\r\n  });\r\n\r\n  it('should not render footer if not provided', () => {\r\n    const wrapper = render(<ContentAccordion items={contentAccordionItemsWithBody}/>);\r\n\r\n    expect(wrapper.baseElement.getElementsByClassName('item-content-body').length).toBe(4);\r\n    expect(wrapper.baseElement.getElementsByClassName('item-content-footer').length).toBe(0);\r\n  });\r\n\r\n  it('should render body, header, and footer if all are provided', () => {\r\n    const wrapper = render(<ContentAccordion items={contentAccordionItemsWithBodyAndHeaderAndFooter}/>);\r\n\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item').length).toBe(4);\r\n    expect(wrapper.baseElement.getElementsByClassName('item-content-body').length).toBe(4);\r\n    expect(wrapper.baseElement.getElementsByClassName('item-content-header').length).toBe(4);\r\n    expect(wrapper.baseElement.getElementsByClassName('item-content-footer').length).toBe(4);\r\n  });\r\n\r\n  it('should set correct size class name for small accordion', () => {\r\n    const wrapper = render(<ContentAccordion items={contentAccordionItemsWithBodyAndHeaderAndFooter}\r\n                                             size={Size.Small}/>);\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion small').length).toBe(1);\r\n  });\r\n\r\n  it('should set correct size class name for medium accordion', () => {\r\n    const wrapper = render(<ContentAccordion items={contentAccordionItemsWithBodyAndHeaderAndFooter}\r\n                                             size={Size.Medium}/>);\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion medium').length).toBe(1);\r\n  });\r\n\r\n  it('should set correct size class name for large accordion', () => {\r\n    const wrapper = render(<ContentAccordion items={contentAccordionItemsWithBodyAndHeaderAndFooter}\r\n                                             size={Size.Large}/>);\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion large').length).toBe(1);\r\n  });\r\n\r\n  it('should change active state when item header is clicked', () => {\r\n    const wrapper = render(<ContentAccordion items={contentAccordionItemsWithBody} multi={false}/>);\r\n    const itemHeader = wrapper.baseElement.getElementsByClassName('item-header')[3];\r\n\r\n    fireEvent.click(itemHeader);\r\n\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active').length).toBe(1);\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active')[0].id).toBe('item_4');\r\n  });\r\n\r\n  it('should not change active state when disabled item header is clicked', () => {\r\n    const wrapper = render(<ContentAccordion items={contentAccordionItemsWithBody} multi={false}/>);\r\n    const itemHeader = wrapper.baseElement.getElementsByClassName('item-header')[2];\r\n\r\n    fireEvent.click(itemHeader);\r\n\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active').length).toBe(1);\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active')[0].id).toBe('item_2');\r\n  });\r\n\r\n  it('should append active items if multi property is true', () => {\r\n    const wrapper = render(<ContentAccordion items={contentAccordionItemsWithBody} multi={true}/>);\r\n    const itemHeader = wrapper.baseElement.getElementsByClassName('item-header')[3];\r\n\r\n    fireEvent.click(itemHeader);\r\n\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active').length).toBe(2);\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active')[0].id).toBe('item_2');\r\n    expect(wrapper.baseElement.getElementsByClassName('content-accordion-item active')[1].id).toBe('item_4');\r\n  });\r\n\r\n});\r\n"],"file":"ContetnAccordion.test.js"}

package/dist/esm/Accordion/index.js

@@ -0,0 +1,4 @@
+export { default as AccordionMenu } from './AccordionMenu';
+export { default as AccordionMenuItem } from './AccordionMenu';
+export { AccordionMenuWrapper } from './styles';
+//# sourceMappingURL=index.js.map

package/dist/esm/Accordion/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Accordion/index.ts"],"names":["default","AccordionMenu","AccordionMenuItem","AccordionMenuWrapper"],"mappings":"AAAA,SAASA,OAAO,IAAIC,aAApB,QAAyC,iBAAzC;AACA,SAASD,OAAO,IAAIE,iBAApB,QAA6C,iBAA7C;AACA,SAASC,oBAAT,QAAqC,UAArC","sourcesContent":["export { default as AccordionMenu } from './AccordionMenu';\r\nexport { default as AccordionMenuItem } from './AccordionMenu';\r\nexport { AccordionMenuWrapper } from './styles';\r\n"],"file":"index.js"}