@laerdal/life-react-components 3.4.2 → 3.5.0

package/dist/js/Accordion/ContentAccordion.js

@@ -0,0 +1,151 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ContentAccordion = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _types = require("../types");
+
+var _icons = require("../icons");
+
+var _typography = require("../styles/typography");
+
+var _styles = require("../styles");
+
+var _zIndexes = require("../styles/z-indexes");
+
+var _templateObject;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+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."); }
+
+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); }
+
+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; }
+
+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; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+var ContentAccordionWrapper = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 100%;\n  position: relative;\n\n\n  .content-accordion-item {\n    display: flex;\n    flex-direction: column;\n    border-top: 1px solid ", ";\n\n    .item-header {\n      display: flex;\n      align-items: center;\n      box-sizing: border-box;\n      min-height: 48px;\n      color: ", ";\n      cursor: pointer;\n\n      &:hover {\n        color: ", ";\n        background-color: ", ";\n        z-index: ", ";\n      }\n\n      &:focus {\n        box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2E7FA1;\n        background-color: ", ";\n        z-index: ", ";\n        outline: none;\n      }\n\n      &:active {\n        color: ", ";\n        background-color: ", ";\n        box-shadow: none;\n        z-index: ", ";\n      }\n\n      .item-header-icon,\n      .item-header-icon svg {\n        width: 24px;\n        height: 24px;\n      }\n\n      .item-header-text {\n      }\n    }\n\n    .item-content {\n      display: none;\n      flex-direction: column;\n\n      .item-content-header {\n\n      }\n\n      .item-content-body {\n\n      }\n\n      .item-content-footer {\n      }\n    }\n\n    &.active {\n      .item-content {\n        display: flex;\n      }\n    }\n\n    &.disabled {\n      .item-header {\n        color: ", ";\n        cursor: not-allowed;\n        pointer-events: none;\n      }\n    }\n  }\n\n  .content-accordion-item:last-child {\n    border-bottom: 1px solid ", ";\n  }\n\n  &.small {\n    min-width: 320px;\n    max-width: 528px;\n\n    .item-header {\n      gap: 8px;\n      padding: 0 8px;\n      ", "\n    }\n\n    .item-content {\n      padding: 0 8px 16px 40px;\n      gap: 8px;\n\n      .item-content-header {\n        ", "\n      }\n\n      .item-content-body {\n        ", "\n      }\n    }\n  }\n\n\n  &.medium {\n    min-width: 344px;\n    max-width: 584px;\n\n    .item-header {\n      gap: 12px;\n      padding: 0 12px;\n      ", "\n    }\n\n    .item-content {\n      padding: 8px 12px 24px 48px;\n      gap: 12px;\n\n      .item-content-header {\n        ", "\n      }\n\n      .item-content-body {\n        ", "\n      }\n\n    }\n  }\n\n  &.large {\n    min-width: 384px;\n    max-width: 656px;\n\n    .item-header {\n      gap: 16px;\n      padding: 0 16px;\n      ", "\n    }\n\n    .item-content {\n      padding: 16px 16px 32px 56px;\n      gap: 16px;\n\n      .item-content-header {\n        ", "\n      }\n\n      .item-content-body {\n        ", "\n      }\n    }\n  }\n"])), _styles.COLORS.neutral_100, _styles.COLORS.neutral_600, _styles.COLORS.primary_700, _styles.COLORS.primary_20, _zIndexes.Z_INDEXES.hover, _styles.COLORS.white, _zIndexes.Z_INDEXES.focus, _styles.COLORS.primary_800, _styles.COLORS.primary_100, _zIndexes.Z_INDEXES.active, _styles.COLORS.neutral_300, _styles.COLORS.neutral_100, (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Regular, null), (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Bold, null), (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Regular, null), (0, _typography.ComponentMStyling)(_typography.ComponentTextStyle.Regular, null), (0, _typography.ComponentMStyling)(_typography.ComponentTextStyle.Bold, null), (0, _typography.ComponentMStyling)(_typography.ComponentTextStyle.Regular, null), (0, _typography.ComponentLStyling)(_typography.ComponentTextStyle.Regular, null), (0, _typography.ComponentLStyling)(_typography.ComponentTextStyle.Bold, null), (0, _typography.ComponentLStyling)(_typography.ComponentTextStyle.Regular, null));
+
+var ContentAccordion = function ContentAccordion(props) {
+  var _props$size;
+
+  var _React$useState = _react.default.useState([]),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      opened = _React$useState2[0],
+      setOpened = _React$useState2[1];
+
+  _react.default.useEffect(function () {
+    if (props.multi) {
+      setOpened(props.items.filter(function (item) {
+        return item.active;
+      }).map(function (item) {
+        return item.key;
+      }));
+    } else {
+      var _props$items$find;
+
+      var active = (_props$items$find = props.items.find(function (item) {
+        return !!item.active;
+      })) === null || _props$items$find === void 0 ? void 0 : _props$items$find.key;
+
+      if (active) {
+        setOpened([active]);
+      }
+    }
+  }, [props.items, props.multi]);
+
+  var onItemClick = function onItemClick(item) {
+    if (item.disabled) return;
+
+    if (opened.includes(item.key)) {
+      setOpened(opened.filter(function (key) {
+        return key !== item.key;
+      }));
+    } else {
+      if (props.multi) {
+        setOpened([].concat(_toConsumableArray(opened), [item.key]));
+      } else {
+        setOpened([item.key]);
+      }
+    }
+  };
+
+  var renderItem = function renderItem(item) {
+    var isActive = opened.includes(item.key);
+    return /*#__PURE__*/_react.default.createElement("div", {
+      key: item.key,
+      id: "item_".concat(item.key),
+      className: 'content-accordion-item'.concat(isActive ? ' active' : '').concat(item.disabled ? ' disabled' : '')
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: 'item-header',
+      tabIndex: !item.disabled ? 0 : undefined,
+      onMouseDown: function onMouseDown(e) {
+        return e.preventDefault();
+      },
+      onClick: function onClick() {
+        return !item.disabled && onItemClick(item);
+      },
+      onKeyPress: function onKeyPress(event) {
+        return event.key === 'Enter' && onItemClick(item);
+      }
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: 'item-header-icon'
+    }, props.multi ? isActive ? /*#__PURE__*/_react.default.createElement(_icons.SystemIcons.Minus, null) : /*#__PURE__*/_react.default.createElement(_icons.SystemIcons.Plus, null) : isActive ? /*#__PURE__*/_react.default.createElement(_icons.SystemIcons.ChevronDown, null) : /*#__PURE__*/_react.default.createElement(_icons.SystemIcons.ChevronRight, null)), /*#__PURE__*/_react.default.createElement("div", {
+      className: 'item-header-text'
+    }, item.title)), /*#__PURE__*/_react.default.createElement("div", {
+      className: 'item-content'
+    }, item.header && /*#__PURE__*/_react.default.createElement("div", {
+      className: 'item-content-header'
+    }, item.header), /*#__PURE__*/_react.default.createElement("div", {
+      className: 'item-content-body'
+    }, item.body), item.footer && /*#__PURE__*/_react.default.createElement("div", {
+      className: 'item-content-footer'
+    }, item.footer)));
+  };
+
+  return /*#__PURE__*/_react.default.createElement(ContentAccordionWrapper, {
+    className: 'content-accordion'.concat(" ".concat((_props$size = props.size) !== null && _props$size !== void 0 ? _props$size : _types.Size.Medium))
+  }, props.items.map(function (item) {
+    return renderItem(item);
+  }));
+};
+
+exports.ContentAccordion = ContentAccordion;
+ContentAccordion.propTypes = {
+  items: _propTypes.default.arrayOf(_propTypes.default.shape({
+    key: _propTypes.default.string.isRequired,
+    title: _propTypes.default.string.isRequired,
+    header: _propTypes.default.string,
+    body: _propTypes.default.any.isRequired,
+    footer: _propTypes.default.any,
+    disabled: _propTypes.default.bool,
+    active: _propTypes.default.bool
+  })).isRequired,
+  multi: _propTypes.default.bool
+};
+var _default = ContentAccordion;
+exports.default = _default;
+//# sourceMappingURL=ContentAccordion.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Accordion/ContentAccordion.tsx"],"names":["ContentAccordionWrapper","styled","div","COLORS","neutral_100","neutral_600","primary_700","primary_20","Z_INDEXES","hover","white","focus","primary_800","primary_100","active","neutral_300","ComponentTextStyle","Regular","Bold","ContentAccordion","props","React","useState","opened","setOpened","useEffect","multi","items","filter","item","map","key","find","onItemClick","disabled","includes","renderItem","isActive","concat","undefined","e","preventDefault","event","title","header","body","footer","size","Size","Medium"],"mappings":"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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/js/Accordion/ContentAccordionItem.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=ContentAccordionItem.js.map

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

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

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

@@ -0,0 +1,101 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+require("jest-styled-components");
+
+var _styles = require("../../styles");
+
+var _AccordionMenu = _interopRequireDefault(require("../AccordionMenu"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+
+var accordionItems = [{
+  id: 'test1_id',
+  title: 'Item label with text 1',
+  children: /*#__PURE__*/_react.default.createElement("div", null, "content test1")
+}, {
+  id: 'test2_id',
+  title: 'Item label with text 2',
+  children: /*#__PURE__*/_react.default.createElement("div", null, "content test2")
+}];
+describe('<AccordionMenu />', function () {
+  it('Check correct text placed on labels', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+    var _render, queryByText;
+
+    return regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            _render = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_AccordionMenu.default, {
+              items: accordionItems,
+              onSelect: function onSelect() {}
+            })), queryByText = _render.queryByText;
+            expect(queryByText('Item label with text 1')).toBeDefined();
+            expect(queryByText('Item label with text 2')).toBeDefined();
+            expect(queryByText('content test1')).toBeNull();
+
+          case 4:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  })));
+  it('Check item label element color and label', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+    var _render2, container, headerItem;
+
+    return regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) {
+        switch (_context2.prev = _context2.next) {
+          case 0:
+            _render2 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_AccordionMenu.default, {
+              items: accordionItems,
+              onSelect: function onSelect() {}
+            })), container = _render2.container;
+            headerItem = container.querySelector('#test2_id');
+            expect(headerItem).toBeDefined();
+            expect(headerItem === null || headerItem === void 0 ? void 0 : headerItem.children[0]).toHaveStyleRule('background', _styles.COLORS.neutral_20);
+            expect(headerItem === null || headerItem === void 0 ? void 0 : headerItem.textContent).toContain('Item label with text 2');
+
+          case 5:
+          case "end":
+            return _context2.stop();
+        }
+      }
+    }, _callee2);
+  })));
+  it('Check expanded item text', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
+    var _headerItem$children$;
+
+    var _render3, container, headerItem;
+
+    return regeneratorRuntime.wrap(function _callee3$(_context3) {
+      while (1) {
+        switch (_context3.prev = _context3.next) {
+          case 0:
+            _render3 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_AccordionMenu.default, {
+              items: accordionItems,
+              onSelect: function onSelect() {},
+              selectedItems: ['test1_id']
+            })), container = _render3.container;
+            headerItem = container.querySelector('#test1_id'); //check item expanded
+
+            expect(headerItem === null || headerItem === void 0 ? void 0 : headerItem.children[1]).toBeDefined();
+            expect(headerItem === null || headerItem === void 0 ? void 0 : (_headerItem$children$ = headerItem.children[1]) === null || _headerItem$children$ === void 0 ? void 0 : _headerItem$children$.textContent).toContain('content test1');
+
+          case 4:
+          case "end":
+            return _context3.stop();
+        }
+      }
+    }, _callee3);
+  })));
+});
+//# sourceMappingURL=AccordionMenu.test.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/Accordion/__tests__/AccordionMenu.test.tsx"],"names":["accordionItems","id","title","children","describe","it","queryByText","expect","toBeDefined","toBeNull","container","headerItem","querySelector","toHaveStyleRule","COLORS","neutral_20","textContent","toContain"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEA,IAAMA,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,YAAM;AAClCC,EAAAA,EAAE,CAAC,qCAAD,uEAAwC;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA,sBAChB,kCAAO,6BAAC,sBAAD;AAAe,cAAA,KAAK,EAAEL,cAAtB;AAAsC,cAAA,QAAQ,EAAE,oBAAM,CAAE;AAAxD,cAAP,CADgB,EAChCM,WADgC,WAChCA,WADgC;AAExCC,YAAAA,MAAM,CAACD,WAAW,CAAC,wBAAD,CAAZ,CAAN,CAA8CE,WAA9C;AACAD,YAAAA,MAAM,CAACD,WAAW,CAAC,wBAAD,CAAZ,CAAN,CAA8CE,WAA9C;AACAD,YAAAA,MAAM,CAACD,WAAW,CAAC,eAAD,CAAZ,CAAN,CAAqCG,QAArC;;AAJwC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAAxC,GAAF;AAOAJ,EAAAA,EAAE,CAAC,0CAAD,uEAA6C;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA,uBACvB,kCAAO,6BAAC,sBAAD;AAAe,cAAA,KAAK,EAAEL,cAAtB;AAAsC,cAAA,QAAQ,EAAE,oBAAM,CAAE;AAAxD,cAAP,CADuB,EACrCU,SADqC,YACrCA,SADqC;AAEvCC,YAAAA,UAFuC,GAE1BD,SAAS,CAACE,aAAV,CAAwB,WAAxB,CAF0B;AAG7CL,YAAAA,MAAM,CAACI,UAAD,CAAN,CAAmBH,WAAnB;AACAD,YAAAA,MAAM,CAACI,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAER,QAAZ,CAAqB,CAArB,CAAD,CAAN,CAAgCU,eAAhC,CAAgD,YAAhD,EAA8DC,eAAOC,UAArE;AACAR,YAAAA,MAAM,CAACI,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEK,WAAb,CAAN,CAAgCC,SAAhC,CAA0C,wBAA1C;;AAL6C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAA7C,GAAF;AAQAZ,EAAAA,EAAE,CAAC,0BAAD,uEAA6B;AAAA;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA,uBACP,kCAAO,6BAAC,sBAAD;AAAe,cAAA,KAAK,EAAEL,cAAtB;AAAsC,cAAA,QAAQ,EAAE,oBAAM,CAAE,CAAxD;AAA0D,cAAA,aAAa,EAAE,CAAC,UAAD;AAAzE,cAAP,CADO,EACrBU,SADqB,YACrBA,SADqB;AAEvBC,YAAAA,UAFuB,GAEVD,SAAS,CAACE,aAAV,CAAwB,WAAxB,CAFU,EAG7B;;AACAL,YAAAA,MAAM,CAACI,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAER,QAAZ,CAAqB,CAArB,CAAD,CAAN,CAAgCK,WAAhC;AACAD,YAAAA,MAAM,CAACI,UAAD,aAACA,UAAD,gDAACA,UAAU,CAAER,QAAZ,CAAqB,CAArB,CAAD,0DAAC,sBAAyBa,WAA1B,CAAN,CAA6CC,SAA7C,CAAuD,eAAvD;;AAL6B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAA7B,GAAF;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/js/Accordion/__tests__/ContetnAccordion.test.js

@@ -0,0 +1,151 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ContentAccordion = _interopRequireDefault(require("../ContentAccordion"));
+
+var _react2 = require("@testing-library/react");
+
+var _types = require("../../types");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+describe('ContentAccordion', function () {
+  var 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.'
+  }];
+  var 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.default.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.default.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.default.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.default.createElement("span", null)
+  }];
+  it('should render items in correct state', function () {
+    var wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_ContentAccordion.default, {
+      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', function () {
+    var wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_ContentAccordion.default, {
+      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', function () {
+    var wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_ContentAccordion.default, {
+      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', function () {
+    var wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_ContentAccordion.default, {
+      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', function () {
+    var wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_ContentAccordion.default, {
+      items: contentAccordionItemsWithBodyAndHeaderAndFooter,
+      size: _types.Size.Small
+    }));
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion small').length).toBe(1);
+  });
+  it('should set correct size class name for medium accordion', function () {
+    var wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_ContentAccordion.default, {
+      items: contentAccordionItemsWithBodyAndHeaderAndFooter,
+      size: _types.Size.Medium
+    }));
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion medium').length).toBe(1);
+  });
+  it('should set correct size class name for large accordion', function () {
+    var wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_ContentAccordion.default, {
+      items: contentAccordionItemsWithBodyAndHeaderAndFooter,
+      size: _types.Size.Large
+    }));
+    expect(wrapper.baseElement.getElementsByClassName('content-accordion large').length).toBe(1);
+  });
+  it('should change active state when item header is clicked', function () {
+    var wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_ContentAccordion.default, {
+      items: contentAccordionItemsWithBody,
+      multi: false
+    }));
+    var itemHeader = wrapper.baseElement.getElementsByClassName('item-header')[3];
+
+    _react2.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', function () {
+    var wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_ContentAccordion.default, {
+      items: contentAccordionItemsWithBody,
+      multi: false
+    }));
+    var itemHeader = wrapper.baseElement.getElementsByClassName('item-header')[2];
+
+    _react2.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', function () {
+    var wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_ContentAccordion.default, {
+      items: contentAccordionItemsWithBody,
+      multi: true
+    }));
+    var itemHeader = wrapper.baseElement.getElementsByClassName('item-header')[3];
+
+    _react2.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/js/Accordion/__tests__/ContetnAccordion.test.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/Accordion/__tests__/ContetnAccordion.test.tsx"],"names":["describe","contentAccordionItemsWithBody","key","title","body","active","disabled","contentAccordionItemsWithBodyAndHeaderAndFooter","header","footer","it","wrapper","expect","baseElement","getElementsByClassName","length","toBe","id","Size","Small","Medium","Large","itemHeader","fireEvent","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/js/Accordion/index.d.ts

@@ -0,0 +1,3 @@
+export { default as AccordionMenu } from './AccordionMenu';
+export { default as AccordionMenuItem } from './AccordionMenu';
+export { AccordionMenuWrapper } from './styles';

package/dist/js/Accordion/index.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "AccordionMenu", {
+  enumerable: true,
+  get: function get() {
+    return _AccordionMenu.default;
+  }
+});
+Object.defineProperty(exports, "AccordionMenuItem", {
+  enumerable: true,
+  get: function get() {
+    return _AccordionMenu.default;
+  }
+});
+Object.defineProperty(exports, "AccordionMenuWrapper", {
+  enumerable: true,
+  get: function get() {
+    return _styles.AccordionMenuWrapper;
+  }
+});
+
+var _AccordionMenu = _interopRequireDefault(require("./AccordionMenu"));
+
+var _styles = require("./styles");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Accordion/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEA","sourcesContent":["export { default as AccordionMenu } from './AccordionMenu';\r\nexport { default as AccordionMenuItem } from './AccordionMenu';\r\nexport { AccordionMenuWrapper } from './styles';\r\n"],"file":"index.js"}

package/dist/js/Accordion/styles.d.ts

@@ -0,0 +1,11 @@
+export declare const AccordionMenuWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const AccordionItemContainer: import("styled-components").StyledComponent<"div", any, {
+    displaySeparator: boolean;
+}, never>;
+export declare const ItemHeaderContainer: import("styled-components").StyledComponent<"div", any, {
+    isDisabled: boolean;
+    isActive: boolean;
+    tabbedHere: boolean;
+}, never>;
+export declare const HeaderIconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ItemBodyContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/js/Accordion/styles.js

@@ -0,0 +1,52 @@
+"use strict";
+
+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); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ItemBodyContainer = exports.HeaderIconContainer = exports.ItemHeaderContainer = exports.AccordionItemContainer = exports.AccordionMenuWrapper = void 0;
+
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
+var _styles = require("../styles");
+
+var _zIndexes = require("../styles/z-indexes");
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+
+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); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+var AccordionMenuWrapper = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  min-width: 320px;\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n"])));
+
+exports.AccordionMenuWrapper = AccordionMenuWrapper;
+
+var AccordionItemContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  border-bottom: ", ";\n"])), function (props) {
+  return props.displaySeparator ? "1px solid ".concat(_styles.COLORS.neutral_100) : '';
+});
+
+exports.AccordionItemContainer = AccordionItemContainer;
+var disabledState = (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  background: ", "!important;\n  color: ", ";\n  pointer-events: none;\n  svg {\n    color: ", "!important;\n  }\n"])), _styles.COLORS.white, _styles.COLORS.neutral_300, _styles.COLORS.neutral_300);
+
+var ItemHeaderContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 12px 16px 11px 16px;\n  cursor: pointer;\n  background: ", ";\n  cursor: ", ";\n  svg:last-child {\n    margin-left: auto;\n  }\n  outline: none;\n  ", "\n\n  ", "\n  :hover {\n    background: ", ";\n  }\n\n  :hover .headerLabel {\n    color: ", ";\n  }\n\n  :active .headerLabel {\n    color: ", ";\n  }\n\n  :hover svg {\n    color: ", ";\n  }\n\n  :active svg {\n    color: ", ";\n  }\n\n  :active {\n    background: ", ";\n  }\n"])), _styles.COLORS.neutral_20, function (props) {
+  return props.isDisabled ? 'not-allowed' : 'pointer';
+}, function (props) {
+  return props.tabbedHere ? (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    z-index: ", ";\n    box-shadow: 0px 4px 12px ", ", 0px 0px 8px ", ";"])), _zIndexes.Z_INDEXES.focus, _styles.COLORS.primary_500, _styles.COLORS.primary_500) : '';
+}, function (props) {
+  return props.isDisabled ? disabledState : '';
+}, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.COLORS.primary_800, _styles.COLORS.primary_700, _styles.COLORS.primary_800, _styles.COLORS.primary_100);
+
+exports.ItemHeaderContainer = ItemHeaderContainer;
+
+var HeaderIconContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  margin-left: auto;\n"])));
+
+exports.HeaderIconContainer = HeaderIconContainer;
+
+var ItemBodyContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  padding: 0px 16px;\n  margin: 12px 0;\n  background: ", ";\n"])), _styles.COLORS.white);
+
+exports.ItemBodyContainer = ItemBodyContainer;
+//# sourceMappingURL=styles.js.map

package/dist/js/Accordion/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Accordion/styles.ts"],"names":["AccordionMenuWrapper","styled","div","AccordionItemContainer","props","displaySeparator","COLORS","neutral_100","disabledState","css","white","neutral_300","ItemHeaderContainer","neutral_20","isDisabled","tabbedHere","Z_INDEXES","focus","primary_500","primary_20","primary_700","primary_800","primary_100","HeaderIconContainer","ItemBodyContainer"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;;;;;;;;;AAEO,IAAMA,oBAAoB,GAAGC,0BAAOC,GAAV,oKAA1B;;;;AAOA,IAAMC,sBAAsB,GAAGF,0BAAOC,GAAV,0LAKhB,UAACE,KAAD;AAAA,SAAYA,KAAK,CAACC,gBAAN,uBAAsCC,eAAOC,WAA7C,IAA6D,EAAzE;AAAA,CALgB,CAA5B;;;AAQP,IAAMC,aAAa,OAAGC,qBAAH,6LACHH,eAAOI,KADJ,EAERJ,eAAOK,WAFC,EAKNL,eAAOK,WALD,CAAnB;;AASO,IAAMC,mBAAmB,GAAGX,0BAAOC,GAAV,mlBAOhBI,eAAOO,UAPS,EAQpB,UAACT,KAAD;AAAA,SAAYA,KAAK,CAACU,UAAN,GAAmB,aAAnB,GAAmC,SAA/C;AAAA,CARoB,EAa5B,UAAAV,KAAK;AAAA,SAAIA,KAAK,CAACW,UAAN,OAAmBN,qBAAnB,mJACEO,oBAAUC,KADZ,EAEkBX,eAAOY,WAFzB,EAEqDZ,eAAOY,WAF5D,IAE6E,EAFjF;AAAA,CAbuB,EAiB5B,UAACd,KAAD;AAAA,SAAYA,KAAK,CAACU,UAAN,GAAmBN,aAAnB,GAAmC,EAA/C;AAAA,CAjB4B,EAmBdF,eAAOa,UAnBO,EAuBnBb,eAAOc,WAvBY,EA2BnBd,eAAOe,WA3BY,EA+BnBf,eAAOc,WA/BY,EAmCnBd,eAAOe,WAnCY,EAuCdf,eAAOgB,WAvCO,CAAzB;;;;AA2CA,IAAMC,mBAAmB,GAAGtB,0BAAOC,GAAV,+FAAzB;;;;AAIA,IAAMsB,iBAAiB,GAAGvB,0BAAOC,GAAV,wIAGdI,eAAOI,KAHO,CAAvB","sourcesContent":["import styled, { css } from 'styled-components';\r\nimport { COLORS } from '../styles';\r\nimport { Z_INDEXES } from '../styles/z-indexes';\r\n\r\nexport const AccordionMenuWrapper = styled.div`\r\n  min-width: 320px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n`;\r\n\r\nexport const AccordionItemContainer = styled.div<{ displaySeparator: boolean; }>`\r\n  width: 100%;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n  border-bottom: ${(props) => (props.displaySeparator ? `1px solid ${COLORS.neutral_100}` : '')};\r\n`;\r\n\r\nconst disabledState = css`\r\n  background: ${COLORS.white}!important;\r\n  color: ${COLORS.neutral_300};\r\n  pointer-events: none;\r\n  svg {\r\n    color: ${COLORS.neutral_300}!important;\r\n  }\r\n`;\r\n\r\nexport const ItemHeaderContainer = styled.div<{ isDisabled: boolean, isActive: boolean, tabbedHere: boolean }>`\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  padding: 12px 16px 11px 16px;\r\n  cursor: pointer;\r\n  background: ${COLORS.neutral_20};\r\n  cursor: ${(props) => (props.isDisabled ? 'not-allowed' : 'pointer')};\r\n  svg:last-child {\r\n    margin-left: auto;\r\n  }\r\n  outline: none;\r\n  ${props => props.tabbedHere ? css`\r\n    z-index: ${Z_INDEXES.focus};\r\n    box-shadow: 0px 4px 12px ${COLORS.primary_500}, 0px 0px 8px ${COLORS.primary_500};` : ''}\r\n\r\n  ${(props) => (props.isDisabled ? disabledState : '')}\r\n  :hover {\r\n    background: ${COLORS.primary_20};\r\n  }\r\n\r\n  :hover .headerLabel {\r\n    color: ${COLORS.primary_700};\r\n  }\r\n\r\n  :active .headerLabel {\r\n    color: ${COLORS.primary_800};\r\n  }\r\n\r\n  :hover svg {\r\n    color: ${COLORS.primary_700};\r\n  }\r\n\r\n  :active svg {\r\n    color: ${COLORS.primary_800};\r\n  }\r\n\r\n  :active {\r\n    background: ${COLORS.primary_100};\r\n  }\r\n`;\r\n\r\nexport const HeaderIconContainer = styled.div`\r\n  margin-left: auto;\r\n`;\r\n\r\nexport const ItemBodyContainer = styled.div`\r\n  padding: 0px 16px;\r\n  margin: 12px 0;\r\n  background: ${COLORS.white};\r\n`;\r\n"],"file":"styles.js"}