@amboss/design-system 1.15.2 → 1.15.4

package/build/cjs/src/components/Typography/StyledText/StyledText.js

@@ -0,0 +1,168 @@
+'use strict';
+
+var _styled = require('@emotion/styled/base');
+var React = require('react');
+var Text = require('../Text/Text.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var _styled__default = /*#__PURE__*/_interopDefault(_styled);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+const Italic = /*#__PURE__*/_styled__default.default("i", process.env.NODE_ENV === "production" ? {
+  target: "e1v2v1iq1"
+} : {
+  target: "e1v2v1iq1",
+  label: "Italic"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1jwcxx3",
+  styles: "font-style:italic"
+} : {
+  name: "1jwcxx3",
+  styles: "font-style:italic",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlN0eWxlZFRleHQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVNlIiwiZmlsZSI6IlN0eWxlZFRleHQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUZXh0IH0gZnJvbSBcIi4uL1RleHQvVGV4dFwiO1xuXG5leHBvcnQgdHlwZSBGb3JtYXR0ZWRFbGVtZW50UHJvcHMgPSB7XG4gIGtleTogc3RyaW5nO1xuICBjaGlsZHJlbjogc3RyaW5nIHwgUmVhY3QuUmVhY3ROb2RlW107XG59O1xuXG5jb25zdCBJdGFsaWMgPSBzdHlsZWQuaSh7IGZvbnRTdHlsZTogXCJpdGFsaWNcIiB9KTtcbmNvbnN0IEJvbGQgPSBzdHlsZWQuYih7IGZvbnRXZWlnaHQ6IFwiYm9sZGVyXCIgfSk7XG5cbmNvbnN0IENvbXBvbmVudHM6IFJlY29yZDxcbiAgc3RyaW5nLFxuICAocHJvcHM6IEZvcm1hdHRlZEVsZW1lbnRQcm9wcykgPT4gUmVhY3QuUmVhY3ROb2RlXG4+ID0ge1xuICBiOiAoeyBrZXksIGNoaWxkcmVuIH0pID0+IDxCb2xkIGtleT17a2V5fT57Y2hpbGRyZW59PC9Cb2xkPixcbiAgaTogKHsga2V5LCBjaGlsZHJlbiB9KSA9PiA8SXRhbGljIGtleT17a2V5fT57Y2hpbGRyZW59PC9JdGFsaWM+LFxuICBwOiAoeyBrZXksIGNoaWxkcmVuIH0pID0+IChcbiAgICA8VGV4dCBrZXk9e2tleX0gYXM9XCJwXCIgdmFyaWFudD1cInNlY29uZGFyeVwiPlxuICAgICAge2NoaWxkcmVufVxuICAgIDwvVGV4dD5cbiAgKSxcbiAgc21hbGw6ICh7IGtleSwgY2hpbGRyZW4gfSkgPT4gKFxuICAgIDxUZXh0IGtleT17a2V5fSBhcz1cInNwYW5cIiB2YXJpYW50PVwidGVydGlhcnlcIj5cbiAgICAgIHtjaGlsZHJlbn1cbiAgICA8L1RleHQ+XG4gICksXG4gIHN1cDogKHsga2V5LCBjaGlsZHJlbiB9KSA9PiA8c3VwIGtleT17a2V5fT57Y2hpbGRyZW59PC9zdXA+LFxuICBzdWI6ICh7IGtleSwgY2hpbGRyZW4gfSkgPT4gPHN1YiBrZXk9e2tleX0+e2NoaWxkcmVufTwvc3ViPixcbn07XG5cbmNvbnN0IGdldE5vZGVzID0gKFxuICBzdHJpbmc6IHN0cmluZ1xuKTogeyBlbGVtZW50TmFtZTogc3RyaW5nOyBwcmV2OiBzdHJpbmc7IG5vZGU6IHN0cmluZzsgbmV4dDogc3RyaW5nIH0gfCBudWxsID0+IHtcbiAgY29uc3QgZWxlbWVudE5hbWVzID0gT2JqZWN0LmtleXMoQ29tcG9uZW50cykuam9pbihcInxcIik7XG4gIGNvbnN0IGVsZW1lbnRSZWdleCA9IG5ldyBSZWdFeHAoYDwoJHtlbGVtZW50TmFtZXN9KT4uKjwvXFxcXDE+YCk7XG4gIGNvbnN0IGVsZW1lbnRNYXRjaCA9IGVsZW1lbnRSZWdleC5leGVjKHN0cmluZyk7XG5cbiAgaWYgKCFlbGVtZW50TWF0Y2gpIHtcbiAgICByZXR1cm4gbnVsbDtcbiAgfVxuXG4gIGNvbnN0IGVsZW1lbnROYW1lID0gZWxlbWVudE1hdGNoWzFdO1xuICBjb25zdCBvcGVuaW5nVGFnU3RhcnRJbmRleCA9IGVsZW1lbnRNYXRjaC5pbmRleDtcbiAgY29uc3Qgb3BlbmluZ1RhZ0VuZEluZGV4ID0gZWxlbWVudE1hdGNoLmluZGV4ICsgZWxlbWVudE5hbWUubGVuZ3RoICsgMjtcbiAgbGV0IG51bWJlck9wZW5UYWdzID0gMTtcblxuICBjb25zdCBlbGVtZW50VGFnc1JlZ2V4ID0gbmV3IFJlZ0V4cChcbiAgICBgKDwke2VsZW1lbnROYW1lfT4pfCg8LyR7ZWxlbWVudE5hbWV9PilgLFxuICAgIFwiZ1wiXG4gICk7XG4gIGxldCBjdXJyZW50VGFnTWF0Y2ggPSBlbGVtZW50VGFnc1JlZ2V4LmV4ZWMoc3RyaW5nKTtcbiAgbGV0IGNsb3NpbmdUYWdTdGFydEluZGV4O1xuICBsZXQgY2xvc2luZ1RhZ0VuZEluZGV4O1xuXG4gIGRvIHtcbiAgICBpZiAoY3VycmVudFRhZ01hdGNoLmluZGV4ID4gb3BlbmluZ1RhZ1N0YXJ0SW5kZXgpIHtcbiAgICAgIGlmIChjdXJyZW50VGFnTWF0Y2hbMV0pIHtcbiAgICAgICAgbnVtYmVyT3BlblRhZ3MgKz0gMTtcbiAgICAgIH0gZWxzZSBpZiAoY3VycmVudFRhZ01hdGNoWzJdKSB7XG4gICAgICAgIG51bWJlck9wZW5UYWdzIC09IDE7XG4gICAgICAgIGNsb3NpbmdUYWdTdGFydEluZGV4ID0gY3VycmVudFRhZ01hdGNoLmluZGV4O1xuICAgICAgICBjbG9zaW5nVGFnRW5kSW5kZXggPSBjbG9zaW5nVGFnU3RhcnRJbmRleCArIGN1cnJlbnRUYWdNYXRjaFsyXS5sZW5ndGg7XG4gICAgICB9XG4gICAgfVxuICAgIGN1cnJlbnRUYWdNYXRjaCA9IGVsZW1lbnRUYWdzUmVnZXguZXhlYyhzdHJpbmcpO1xuICAgIGlmICghY3VycmVudFRhZ01hdGNoKSBicmVhaztcbiAgfSB3aGlsZSAobnVtYmVyT3BlblRhZ3MgPiAwKTtcblxuICByZXR1cm4ge1xuICAgIGVsZW1lbnROYW1lLFxuICAgIHByZXY6IHN0cmluZy5zbGljZSgwLCBvcGVuaW5nVGFnU3RhcnRJbmRleCksXG4gICAgbm9kZTogc3RyaW5nLnNsaWNlKG9wZW5pbmdUYWdFbmRJbmRleCwgY2xvc2luZ1RhZ1N0YXJ0SW5kZXgpLFxuICAgIG5leHQ6IHN0cmluZy5zbGljZShjbG9zaW5nVGFnRW5kSW5kZXgpLFxuICB9O1xufTtcblxuZXhwb3J0IGNvbnN0IG1ha2VTdHlsZWRKU1ggPSAoXG4gIHN0cmluZzogc3RyaW5nXG4pOiBSZWFjdC5SZWFjdE5vZGVbXSB8IHN0cmluZyB8IG51bGwgPT4ge1xuICBpZiAoIXN0cmluZyB8fCBzdHJpbmcubGVuZ3RoIDwgMSkge1xuICAgIHJldHVybiBudWxsO1xuICB9XG5cbiAgY29uc3Qgbm9kZXMgPSBnZXROb2RlcyhzdHJpbmcpO1xuICBpZiAoIW5vZGVzKSB7XG4gICAgcmV0dXJuIHN0cmluZztcbiAgfVxuXG4gIGNvbnN0IHsgZWxlbWVudE5hbWUsIHByZXYsIG5vZGUsIG5leHQgfSA9IG5vZGVzO1xuXG4gIHJldHVybiBbXG4gICAgcHJldixcbiAgICBDb21wb25lbnRzW2VsZW1lbnROYW1lXSh7IGtleTogbm9kZSwgY2hpbGRyZW46IG1ha2VTdHlsZWRKU1gobm9kZSkgfSksXG4gICAgbWFrZVN0eWxlZEpTWChuZXh0KSxcbiAgXS5maWx0ZXIoKGkpID0+IGkgIT09IG51bGwgJiYgaSAhPT0gXCJcIiAmJiAhKEFycmF5LmlzQXJyYXkoaSkgJiYgIWkubGVuZ3RoKSk7XG59O1xuXG5leHBvcnQgdHlwZSBTdHlsZWRUZXh0UHJvcHMgPSB7XG4gIC8qIFRoZSBzdHJpbmdpZmllZCBtYXJrdXAgdG8gYmUgcmVuZGVyZWQgKi9cbiAgY2hpbGRyZW46IHN0cmluZztcbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI/OiBzdHJpbmc7XG59O1xuXG5leHBvcnQgZnVuY3Rpb24gU3R5bGVkVGV4dCh7XG4gIGNoaWxkcmVuLFxuICBcImRhdGEtZTJlLXRlc3QtaWRcIjogZGF0YUUyZVRlc3RJZCxcbn06IFN0eWxlZFRleHRQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIGlmICh0eXBlb2YgY2hpbGRyZW4gIT09IFwic3RyaW5nXCIpIHJldHVybiBjaGlsZHJlbjtcblxuICByZXR1cm4gKFxuICAgIDxzcGFuIGRhdGEtZTJlLXRlc3QtaWQ9e2RhdGFFMmVUZXN0SWR9IGRhdGEtZHMtaWQ9XCJTdHlsZWRUZXh0XCI+XG4gICAgICB7bWFrZVN0eWxlZEpTWChjaGlsZHJlbil9XG4gICAgPC9zcGFuPlxuICApO1xufVxuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const Bold = /*#__PURE__*/_styled__default.default("b", process.env.NODE_ENV === "production" ? {
+  target: "e1v2v1iq0"
+} : {
+  target: "e1v2v1iq0",
+  label: "Bold"
+})(process.env.NODE_ENV === "production" ? {
+  name: "d3kzo8",
+  styles: "font-weight:bolder"
+} : {
+  name: "d3kzo8",
+  styles: "font-weight:bolder",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlN0eWxlZFRleHQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVVhIiwiZmlsZSI6IlN0eWxlZFRleHQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUZXh0IH0gZnJvbSBcIi4uL1RleHQvVGV4dFwiO1xuXG5leHBvcnQgdHlwZSBGb3JtYXR0ZWRFbGVtZW50UHJvcHMgPSB7XG4gIGtleTogc3RyaW5nO1xuICBjaGlsZHJlbjogc3RyaW5nIHwgUmVhY3QuUmVhY3ROb2RlW107XG59O1xuXG5jb25zdCBJdGFsaWMgPSBzdHlsZWQuaSh7IGZvbnRTdHlsZTogXCJpdGFsaWNcIiB9KTtcbmNvbnN0IEJvbGQgPSBzdHlsZWQuYih7IGZvbnRXZWlnaHQ6IFwiYm9sZGVyXCIgfSk7XG5cbmNvbnN0IENvbXBvbmVudHM6IFJlY29yZDxcbiAgc3RyaW5nLFxuICAocHJvcHM6IEZvcm1hdHRlZEVsZW1lbnRQcm9wcykgPT4gUmVhY3QuUmVhY3ROb2RlXG4+ID0ge1xuICBiOiAoeyBrZXksIGNoaWxkcmVuIH0pID0+IDxCb2xkIGtleT17a2V5fT57Y2hpbGRyZW59PC9Cb2xkPixcbiAgaTogKHsga2V5LCBjaGlsZHJlbiB9KSA9PiA8SXRhbGljIGtleT17a2V5fT57Y2hpbGRyZW59PC9JdGFsaWM+LFxuICBwOiAoeyBrZXksIGNoaWxkcmVuIH0pID0+IChcbiAgICA8VGV4dCBrZXk9e2tleX0gYXM9XCJwXCIgdmFyaWFudD1cInNlY29uZGFyeVwiPlxuICAgICAge2NoaWxkcmVufVxuICAgIDwvVGV4dD5cbiAgKSxcbiAgc21hbGw6ICh7IGtleSwgY2hpbGRyZW4gfSkgPT4gKFxuICAgIDxUZXh0IGtleT17a2V5fSBhcz1cInNwYW5cIiB2YXJpYW50PVwidGVydGlhcnlcIj5cbiAgICAgIHtjaGlsZHJlbn1cbiAgICA8L1RleHQ+XG4gICksXG4gIHN1cDogKHsga2V5LCBjaGlsZHJlbiB9KSA9PiA8c3VwIGtleT17a2V5fT57Y2hpbGRyZW59PC9zdXA+LFxuICBzdWI6ICh7IGtleSwgY2hpbGRyZW4gfSkgPT4gPHN1YiBrZXk9e2tleX0+e2NoaWxkcmVufTwvc3ViPixcbn07XG5cbmNvbnN0IGdldE5vZGVzID0gKFxuICBzdHJpbmc6IHN0cmluZ1xuKTogeyBlbGVtZW50TmFtZTogc3RyaW5nOyBwcmV2OiBzdHJpbmc7IG5vZGU6IHN0cmluZzsgbmV4dDogc3RyaW5nIH0gfCBudWxsID0+IHtcbiAgY29uc3QgZWxlbWVudE5hbWVzID0gT2JqZWN0LmtleXMoQ29tcG9uZW50cykuam9pbihcInxcIik7XG4gIGNvbnN0IGVsZW1lbnRSZWdleCA9IG5ldyBSZWdFeHAoYDwoJHtlbGVtZW50TmFtZXN9KT4uKjwvXFxcXDE+YCk7XG4gIGNvbnN0IGVsZW1lbnRNYXRjaCA9IGVsZW1lbnRSZWdleC5leGVjKHN0cmluZyk7XG5cbiAgaWYgKCFlbGVtZW50TWF0Y2gpIHtcbiAgICByZXR1cm4gbnVsbDtcbiAgfVxuXG4gIGNvbnN0IGVsZW1lbnROYW1lID0gZWxlbWVudE1hdGNoWzFdO1xuICBjb25zdCBvcGVuaW5nVGFnU3RhcnRJbmRleCA9IGVsZW1lbnRNYXRjaC5pbmRleDtcbiAgY29uc3Qgb3BlbmluZ1RhZ0VuZEluZGV4ID0gZWxlbWVudE1hdGNoLmluZGV4ICsgZWxlbWVudE5hbWUubGVuZ3RoICsgMjtcbiAgbGV0IG51bWJlck9wZW5UYWdzID0gMTtcblxuICBjb25zdCBlbGVtZW50VGFnc1JlZ2V4ID0gbmV3IFJlZ0V4cChcbiAgICBgKDwke2VsZW1lbnROYW1lfT4pfCg8LyR7ZWxlbWVudE5hbWV9PilgLFxuICAgIFwiZ1wiXG4gICk7XG4gIGxldCBjdXJyZW50VGFnTWF0Y2ggPSBlbGVtZW50VGFnc1JlZ2V4LmV4ZWMoc3RyaW5nKTtcbiAgbGV0IGNsb3NpbmdUYWdTdGFydEluZGV4O1xuICBsZXQgY2xvc2luZ1RhZ0VuZEluZGV4O1xuXG4gIGRvIHtcbiAgICBpZiAoY3VycmVudFRhZ01hdGNoLmluZGV4ID4gb3BlbmluZ1RhZ1N0YXJ0SW5kZXgpIHtcbiAgICAgIGlmIChjdXJyZW50VGFnTWF0Y2hbMV0pIHtcbiAgICAgICAgbnVtYmVyT3BlblRhZ3MgKz0gMTtcbiAgICAgIH0gZWxzZSBpZiAoY3VycmVudFRhZ01hdGNoWzJdKSB7XG4gICAgICAgIG51bWJlck9wZW5UYWdzIC09IDE7XG4gICAgICAgIGNsb3NpbmdUYWdTdGFydEluZGV4ID0gY3VycmVudFRhZ01hdGNoLmluZGV4O1xuICAgICAgICBjbG9zaW5nVGFnRW5kSW5kZXggPSBjbG9zaW5nVGFnU3RhcnRJbmRleCArIGN1cnJlbnRUYWdNYXRjaFsyXS5sZW5ndGg7XG4gICAgICB9XG4gICAgfVxuICAgIGN1cnJlbnRUYWdNYXRjaCA9IGVsZW1lbnRUYWdzUmVnZXguZXhlYyhzdHJpbmcpO1xuICAgIGlmICghY3VycmVudFRhZ01hdGNoKSBicmVhaztcbiAgfSB3aGlsZSAobnVtYmVyT3BlblRhZ3MgPiAwKTtcblxuICByZXR1cm4ge1xuICAgIGVsZW1lbnROYW1lLFxuICAgIHByZXY6IHN0cmluZy5zbGljZSgwLCBvcGVuaW5nVGFnU3RhcnRJbmRleCksXG4gICAgbm9kZTogc3RyaW5nLnNsaWNlKG9wZW5pbmdUYWdFbmRJbmRleCwgY2xvc2luZ1RhZ1N0YXJ0SW5kZXgpLFxuICAgIG5leHQ6IHN0cmluZy5zbGljZShjbG9zaW5nVGFnRW5kSW5kZXgpLFxuICB9O1xufTtcblxuZXhwb3J0IGNvbnN0IG1ha2VTdHlsZWRKU1ggPSAoXG4gIHN0cmluZzogc3RyaW5nXG4pOiBSZWFjdC5SZWFjdE5vZGVbXSB8IHN0cmluZyB8IG51bGwgPT4ge1xuICBpZiAoIXN0cmluZyB8fCBzdHJpbmcubGVuZ3RoIDwgMSkge1xuICAgIHJldHVybiBudWxsO1xuICB9XG5cbiAgY29uc3Qgbm9kZXMgPSBnZXROb2RlcyhzdHJpbmcpO1xuICBpZiAoIW5vZGVzKSB7XG4gICAgcmV0dXJuIHN0cmluZztcbiAgfVxuXG4gIGNvbnN0IHsgZWxlbWVudE5hbWUsIHByZXYsIG5vZGUsIG5leHQgfSA9IG5vZGVzO1xuXG4gIHJldHVybiBbXG4gICAgcHJldixcbiAgICBDb21wb25lbnRzW2VsZW1lbnROYW1lXSh7IGtleTogbm9kZSwgY2hpbGRyZW46IG1ha2VTdHlsZWRKU1gobm9kZSkgfSksXG4gICAgbWFrZVN0eWxlZEpTWChuZXh0KSxcbiAgXS5maWx0ZXIoKGkpID0+IGkgIT09IG51bGwgJiYgaSAhPT0gXCJcIiAmJiAhKEFycmF5LmlzQXJyYXkoaSkgJiYgIWkubGVuZ3RoKSk7XG59O1xuXG5leHBvcnQgdHlwZSBTdHlsZWRUZXh0UHJvcHMgPSB7XG4gIC8qIFRoZSBzdHJpbmdpZmllZCBtYXJrdXAgdG8gYmUgcmVuZGVyZWQgKi9cbiAgY2hpbGRyZW46IHN0cmluZztcbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI/OiBzdHJpbmc7XG59O1xuXG5leHBvcnQgZnVuY3Rpb24gU3R5bGVkVGV4dCh7XG4gIGNoaWxkcmVuLFxuICBcImRhdGEtZTJlLXRlc3QtaWRcIjogZGF0YUUyZVRlc3RJZCxcbn06IFN0eWxlZFRleHRQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIGlmICh0eXBlb2YgY2hpbGRyZW4gIT09IFwic3RyaW5nXCIpIHJldHVybiBjaGlsZHJlbjtcblxuICByZXR1cm4gKFxuICAgIDxzcGFuIGRhdGEtZTJlLXRlc3QtaWQ9e2RhdGFFMmVUZXN0SWR9IGRhdGEtZHMtaWQ9XCJTdHlsZWRUZXh0XCI+XG4gICAgICB7bWFrZVN0eWxlZEpTWChjaGlsZHJlbil9XG4gICAgPC9zcGFuPlxuICApO1xufVxuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const Components = {
+  b: _ref => {
+    let {
+      key,
+      children
+    } = _ref;
+    return /*#__PURE__*/React__default.default.createElement(Bold, {
+      key: key
+    }, children);
+  },
+  i: _ref2 => {
+    let {
+      key,
+      children
+    } = _ref2;
+    return /*#__PURE__*/React__default.default.createElement(Italic, {
+      key: key
+    }, children);
+  },
+  p: _ref3 => {
+    let {
+      key,
+      children
+    } = _ref3;
+    return /*#__PURE__*/React__default.default.createElement(Text.Text, {
+      key: key,
+      as: "p",
+      variant: "secondary"
+    }, children);
+  },
+  small: _ref4 => {
+    let {
+      key,
+      children
+    } = _ref4;
+    return /*#__PURE__*/React__default.default.createElement(Text.Text, {
+      key: key,
+      as: "span",
+      variant: "tertiary"
+    }, children);
+  },
+  sup: _ref5 => {
+    let {
+      key,
+      children
+    } = _ref5;
+    return /*#__PURE__*/React__default.default.createElement("sup", {
+      key: key
+    }, children);
+  },
+  sub: _ref6 => {
+    let {
+      key,
+      children
+    } = _ref6;
+    return /*#__PURE__*/React__default.default.createElement("sub", {
+      key: key
+    }, children);
+  }
+};
+const getNodes = string => {
+  const elementNames = Object.keys(Components).join("|");
+  const elementRegex = new RegExp(`<(${elementNames})>.*</\\1>`);
+  const elementMatch = elementRegex.exec(string);
+  if (!elementMatch) {
+    return null;
+  }
+  const elementName = elementMatch[1];
+  const openingTagStartIndex = elementMatch.index;
+  const openingTagEndIndex = elementMatch.index + elementName.length + 2;
+  let numberOpenTags = 1;
+  const elementTagsRegex = new RegExp(`(<${elementName}>)|(</${elementName}>)`, "g");
+  let currentTagMatch = elementTagsRegex.exec(string);
+  let closingTagStartIndex;
+  let closingTagEndIndex;
+  do {
+    if (currentTagMatch.index > openingTagStartIndex) {
+      if (currentTagMatch[1]) {
+        numberOpenTags += 1;
+      } else if (currentTagMatch[2]) {
+        numberOpenTags -= 1;
+        closingTagStartIndex = currentTagMatch.index;
+        closingTagEndIndex = closingTagStartIndex + currentTagMatch[2].length;
+      }
+    }
+    currentTagMatch = elementTagsRegex.exec(string);
+    if (!currentTagMatch) break;
+  } while (numberOpenTags > 0);
+  return {
+    elementName,
+    prev: string.slice(0, openingTagStartIndex),
+    node: string.slice(openingTagEndIndex, closingTagStartIndex),
+    next: string.slice(closingTagEndIndex)
+  };
+};
+const makeStyledJSX = string => {
+  if (!string || string.length < 1) {
+    return null;
+  }
+  const nodes = getNodes(string);
+  if (!nodes) {
+    return string;
+  }
+  const {
+    elementName,
+    prev,
+    node,
+    next
+  } = nodes;
+  return [prev, Components[elementName]({
+    key: node,
+    children: makeStyledJSX(node)
+  }), makeStyledJSX(next)].filter(i => i !== null && i !== "" && !(Array.isArray(i) && !i.length));
+};
+function StyledText(_ref7) {
+  let {
+    children,
+    "data-e2e-test-id": dataE2eTestId
+  } = _ref7;
+  if (typeof children !== "string") return children;
+  return /*#__PURE__*/React__default.default.createElement("span", {
+    "data-e2e-test-id": dataE2eTestId,
+    "data-ds-id": "StyledText"
+  }, makeStyledJSX(children));
+}
+
+exports.StyledText = StyledText;
+exports.makeStyledJSX = makeStyledJSX;

package/build/cjs/src/components/Typography/Text/Text.js

@@ -0,0 +1,71 @@
+'use strict';
+
+var _styled = require('@emotion/styled/base');
+var isPropValid = require('@emotion/is-prop-valid');
+var mediaQueries = require('../../../shared/mediaQueries.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var _styled__default = /*#__PURE__*/_interopDefault(_styled);
+var isPropValid__default = /*#__PURE__*/_interopDefault(isPropValid);
+
+const defaultProps = {
+  size: "m",
+  weight: "normal",
+  transform: "none",
+  as: "p",
+  color: "primary",
+  align: "left",
+  hyphens: "none",
+  "data-e2e-test-id": undefined,
+  "data-ds-id": "Text"
+};
+const Text = /*#__PURE__*/_styled__default.default("p", process.env.NODE_ENV === "production" ? {
+  shouldForwardProp: prop => isPropValid__default.default(prop) && prop !== "transform",
+  target: "efktmsx0"
+} : {
+  shouldForwardProp: prop => isPropValid__default.default(prop) && prop !== "transform",
+  target: "efktmsx0",
+  label: "Text"
+})(_ref => {
+  let {
+    theme,
+    align,
+    weight,
+    size,
+    transform,
+    hyphens,
+    variant,
+    color
+  } = _ref;
+  return {
+    fontFamily: theme.variables.fontFamily.lato,
+    margin: 0,
+    textTransform: transform,
+    textAlign: align,
+    fontWeight: theme.variables.weight[weight],
+    color: theme.values.color.text[color].default,
+    // variant is deprecated and it should be deleted asap
+    ...(variant && {
+      color: theme.values.color.text[variant].default,
+      ...(variant === "primary" && {
+        color: theme.values.color.text.accent.default
+      }),
+      ...(variant === "secondary" && {
+        color: theme.values.color.text.primary.default
+      })
+    }),
+    fontSize: theme.variables.size.font.text[size],
+    lineHeight: theme.variables.size.lineHeight.text[size],
+    ...mediaQueries.mq({
+      hyphens: [hyphens, {
+        none: "none",
+        auto: "auto",
+        manual: "manual"
+      }]
+    })
+  };
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRleHQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTBDb0IiLCJmaWxlIjoiVGV4dC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkLCB7IENTU09iamVjdCB9IGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCBpc1Byb3BWYWxpZCBmcm9tIFwiQGVtb3Rpb24vaXMtcHJvcC12YWxpZFwiO1xuaW1wb3J0IHsgbXEgfSBmcm9tIFwiLi4vLi4vLi4vc2hhcmVkL21lZGlhUXVlcmllc1wiO1xuXG5pbXBvcnQge1xuICBUZXh0QWxpZ25tZW50LFxuICBUZXh0VmFyaWF0aW9ucyxcbiAgVGV4dENvbG9ycyxcbiAgVGV4dFNpemUsXG4gIE1RLFxuICBIeXBoZW5zLFxufSBmcm9tIFwiLi4vLi4vLi4vdHlwZXNcIjtcblxuZXhwb3J0IHR5cGUgVGV4dFByb3BzID0ge1xuICBjaGlsZHJlbjogUmVhY3QuUmVhY3ROb2RlO1xuICBzaXplPzogVGV4dFNpemU7XG4gIHdlaWdodD86IFwibm9ybWFsXCIgfCBcImJvbGRcIiB8IFwiYmxhY2tcIiB8IFwiaW5oZXJpdFwiO1xuICB0cmFuc2Zvcm0/OiBcIm5vbmVcIiB8IFwiY2FwaXRhbGl6ZVwiIHwgXCJ1cHBlcmNhc2VcIiB8IFwibG93ZXJjYXNlXCI7XG4gIGFzPzogXCJwXCIgfCBcInNwYW5cIjtcbiAgLyoqIEBkZXByZWNhdGVkIHZhcmlhbnQgcHJvcGVydHkgaXMgZGVwcmVjYXRlZCBub3cuIFBsZWFzZSB1c2UgY29sb3IgcHJvcC4gKi9cbiAgdmFyaWFudD86IFRleHRWYXJpYXRpb25zO1xuICBjb2xvcj86IFRleHRDb2xvcnM7XG4gIGFsaWduPzogVGV4dEFsaWdubWVudDtcbiAgaHlwaGVucz86IEh5cGhlbnMgfCBNUTxIeXBoZW5zPjtcbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI/OiBzdHJpbmc7XG4gIC8qKiBAaWdub3JlICovXG4gIFwiZGF0YS1kcy1pZFwiPzogc3RyaW5nO1xufTtcblxuY29uc3QgZGVmYXVsdFByb3BzOiBQYXJ0aWFsPFRleHRQcm9wcz4gPSB7XG4gIHNpemU6IFwibVwiLFxuICB3ZWlnaHQ6IFwibm9ybWFsXCIsXG4gIHRyYW5zZm9ybTogXCJub25lXCIsXG4gIGFzOiBcInBcIixcbiAgY29sb3I6IFwicHJpbWFyeVwiLFxuICBhbGlnbjogXCJsZWZ0XCIsXG4gIGh5cGhlbnM6IFwibm9uZVwiLFxuICBcImRhdGEtZTJlLXRlc3QtaWRcIjogdW5kZWZpbmVkLFxuICBcImRhdGEtZHMtaWRcIjogXCJUZXh0XCIsXG59O1xuXG5leHBvcnQgY29uc3QgVGV4dCA9IHN0eWxlZChcInBcIiwge1xuICBzaG91bGRGb3J3YXJkUHJvcDogKHByb3A6IHN0cmluZykgPT5cbiAgICBpc1Byb3BWYWxpZChwcm9wKSAmJiBwcm9wICE9PSBcInRyYW5zZm9ybVwiLFxufSk8VGV4dFByb3BzPihcbiAgKHsgdGhlbWUsIGFsaWduLCB3ZWlnaHQsIHNpemUsIHRyYW5zZm9ybSwgaHlwaGVucywgdmFyaWFudCwgY29sb3IgfSkgPT5cbiAgICAoe1xuICAgICAgZm9udEZhbWlseTogdGhlbWUudmFyaWFibGVzLmZvbnRGYW1pbHkubGF0byxcbiAgICAgIG1hcmdpbjogMCxcbiAgICAgIHRleHRUcmFuc2Zvcm06IHRyYW5zZm9ybSxcbiAgICAgIHRleHRBbGlnbjogYWxpZ24sXG4gICAgICBmb250V2VpZ2h0OiB0aGVtZS52YXJpYWJsZXMud2VpZ2h0W3dlaWdodF0sXG4gICAgICBjb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLnRleHRbY29sb3JdLmRlZmF1bHQsXG5cbiAgICAgIC8vIHZhcmlhbnQgaXMgZGVwcmVjYXRlZCBhbmQgaXQgc2hvdWxkIGJlIGRlbGV0ZWQgYXNhcFxuICAgICAgLi4uKHZhcmlhbnQgJiYge1xuICAgICAgICBjb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLnRleHRbdmFyaWFudF0uZGVmYXVsdCxcbiAgICAgICAgLi4uKHZhcmlhbnQgPT09IFwicHJpbWFyeVwiICYmIHtcbiAgICAgICAgICBjb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLnRleHQuYWNjZW50LmRlZmF1bHQsXG4gICAgICAgIH0pLFxuICAgICAgICAuLi4odmFyaWFudCA9PT0gXCJzZWNvbmRhcnlcIiAmJiB7XG4gICAgICAgICAgY29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci50ZXh0LnByaW1hcnkuZGVmYXVsdCxcbiAgICAgICAgfSksXG4gICAgICB9KSxcblxuICAgICAgZm9udFNpemU6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmZvbnQudGV4dFtzaXplXSxcbiAgICAgIGxpbmVIZWlnaHQ6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmxpbmVIZWlnaHQudGV4dFtzaXplXSxcbiAgICAgIC4uLm1xKHtcbiAgICAgICAgaHlwaGVuczogW2h5cGhlbnMsIHsgbm9uZTogXCJub25lXCIsIGF1dG86IFwiYXV0b1wiLCBtYW51YWw6IFwibWFudWFsXCIgfV0sXG4gICAgICB9KSxcbiAgICB9IGFzIENTU09iamVjdClcbik7XG5cblRleHQuZGVmYXVsdFByb3BzID0gZGVmYXVsdFByb3BzO1xuIl19 */");
+Text.defaultProps = defaultProps;
+
+exports.Text = Text;

package/build/cjs/src/components/Typography/TextClamped/TextClamped.js

@@ -0,0 +1,54 @@
+'use strict';
+
+var _extends = require('@babel/runtime/helpers/extends');
+var _styled = require('@emotion/styled/base');
+var React = require('react');
+var Text = require('../Text/Text.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var _extends__default = /*#__PURE__*/_interopDefault(_extends);
+var _styled__default = /*#__PURE__*/_interopDefault(_styled);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const defaultProps = {
+  lines: 1,
+  size: "m"
+};
+const Container = /*#__PURE__*/_styled__default.default("span", process.env.NODE_ENV === "production" ? {
+  target: "e7ey0cg0"
+} : {
+  target: "e7ey0cg0",
+  label: "Container"
+})(_ref => {
+  let {
+    lines,
+    theme,
+    size
+  } = _ref;
+  return {
+    display: "-webkit-box",
+    "-webkit-box-orient": "vertical",
+    overflow: "hidden",
+    WebkitLineClamp: lines,
+    maxHeight: lines * parseInt(theme.variables.size.lineHeight.text[size], 10)
+  };
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRleHRDbGFtcGVkLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFla0IiLCJmaWxlIjoiVGV4dENsYW1wZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgcmVhY3QvanN4LXByb3BzLW5vLXNwcmVhZGluZyAqL1xuaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUZXh0LCBUZXh0UHJvcHMgfSBmcm9tIFwiLi4vVGV4dC9UZXh0XCI7XG5cbmV4cG9ydCB0eXBlIFRleHRDbGFtcGVkUHJvcHMgPSBUZXh0UHJvcHMgJiB7XG4gIC8qKiBUaGUgbWF4aW11bSBudW1iZXIgb2YgbGluZXMuIERlZmF1bHQgaXMgMS4gKi9cbiAgbGluZXM/OiBudW1iZXI7XG59O1xuXG5jb25zdCBkZWZhdWx0UHJvcHM6IFBhcnRpYWw8VGV4dENsYW1wZWRQcm9wcz4gPSB7XG4gIGxpbmVzOiAxLFxuICBzaXplOiBcIm1cIixcbn07XG5cbmNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC5zcGFuPFRleHRDbGFtcGVkUHJvcHM+KCh7IGxpbmVzLCB0aGVtZSwgc2l6ZSB9KSA9PiAoe1xuICBkaXNwbGF5OiBcIi13ZWJraXQtYm94XCIsXG4gIFwiLXdlYmtpdC1ib3gtb3JpZW50XCI6IFwidmVydGljYWxcIixcbiAgb3ZlcmZsb3c6IFwiaGlkZGVuXCIsXG4gIFdlYmtpdExpbmVDbGFtcDogbGluZXMsXG4gIG1heEhlaWdodDogbGluZXMgKiBwYXJzZUludCh0aGVtZS52YXJpYWJsZXMuc2l6ZS5saW5lSGVpZ2h0LnRleHRbc2l6ZV0sIDEwKSxcbn0pKTtcblxuZXhwb3J0IGZ1bmN0aW9uIFRleHRDbGFtcGVkKHByb3BzOiBUZXh0Q2xhbXBlZFByb3BzKTogUmVhY3QuUmVhY3RFbGVtZW50IHtcbiAgY29uc3Qge1xuICAgIGxpbmVzLFxuICAgIGNoaWxkcmVuLFxuICAgIFwiZGF0YS1lMmUtdGVzdC1pZFwiOiBkYXRhRTJlVGVzdElkLFxuICAgIC4uLnRleHRQcm9wc1xuICB9ID0gcHJvcHM7XG5cbiAgcmV0dXJuIChcbiAgICA8VGV4dFxuICAgICAgZGF0YS1lMmUtdGVzdC1pZD17ZGF0YUUyZVRlc3RJZH1cbiAgICAgIGRhdGEtZHMtaWQ9XCJUZXh0Q2xhbXBlZFwiXG4gICAgICB7Li4udGV4dFByb3BzfVxuICAgID5cbiAgICAgIDxDb250YWluZXIgbGluZXM9e2xpbmVzfSBzaXplPXt0ZXh0UHJvcHMuc2l6ZX0+XG4gICAgICAgIHtjaGlsZHJlbn1cbiAgICAgIDwvQ29udGFpbmVyPlxuICAgIDwvVGV4dD5cbiAgKTtcbn1cblxuVGV4dENsYW1wZWQuZGVmYXVsdFByb3BzID0gZGVmYXVsdFByb3BzO1xuIl19 */");
+function TextClamped(props) {
+  const {
+    lines,
+    children,
+    "data-e2e-test-id": dataE2eTestId,
+    ...textProps
+  } = props;
+  return /*#__PURE__*/React__default.default.createElement(Text.Text, _extends__default.default({
+    "data-e2e-test-id": dataE2eTestId,
+    "data-ds-id": "TextClamped"
+  }, textProps), /*#__PURE__*/React__default.default.createElement(Container, {
+    lines: lines,
+    size: textProps.size
+  }, children));
+}
+TextClamped.defaultProps = defaultProps;
+
+exports.TextClamped = TextClamped;

package/build/cjs/src/components/VirtualScrollList/VirtualScrollList.js

@@ -0,0 +1,116 @@
+'use strict';
+
+var _styled = require('@emotion/styled/base');
+var React = require('react');
+var VirtualScrollListReducer = require('./VirtualScrollListReducer.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var _styled__default = /*#__PURE__*/_interopDefault(_styled);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const StyledContainer = /*#__PURE__*/_styled__default.default("div", process.env.NODE_ENV === "production" ? {
+  target: "ebr5g6s1"
+} : {
+  target: "ebr5g6s1",
+  label: "StyledContainer"
+})(_ref => {
+  let {
+    maxHeight
+  } = _ref;
+  return {
+    overflow: "auto",
+    width: "100%",
+    height: "100%",
+    maxHeight
+  };
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlZpcnR1YWxTY3JvbGxMaXN0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLd0IiLCJmaWxlIjoiVmlydHVhbFNjcm9sbExpc3QudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgUmVhY3QsIHsgdXNlUmVmLCB1c2VSZWR1Y2VyLCB1c2VMYXlvdXRFZmZlY3QsIHVzZUVmZmVjdCB9IGZyb20gXCJyZWFjdFwiO1xuXG5pbXBvcnQgeyBWaXJ0dWFsU2Nyb2xsUmVkdWNlciB9IGZyb20gXCIuL1ZpcnR1YWxTY3JvbGxMaXN0UmVkdWNlclwiO1xuXG5jb25zdCBTdHlsZWRDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8VmlydHVhbFNjcm9sbExpc3RQcm9wcz4+KFxuICAoeyBtYXhIZWlnaHQgfSkgPT4gKHtcbiAgICBvdmVyZmxvdzogXCJhdXRvXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGhlaWdodDogXCIxMDAlXCIsXG4gICAgbWF4SGVpZ2h0LFxuICB9KVxuKTtcblxuY29uc3QgU3R5bGVkU2Nyb2xsYWJsZUNvbnRlbnQgPSBzdHlsZWQuZGl2PHsgbWF4Q29udGVudEhlaWdodDogbnVtYmVyIH0+KFxuICAoeyBtYXhDb250ZW50SGVpZ2h0IH0pID0+ICh7XG4gICAgb3ZlcmZsb3c6IFwiaGlkZGVuXCIsXG4gICAgYm94U2l6aW5nOiBcImJvcmRlci1ib3hcIixcbiAgICBoZWlnaHQ6IG1heENvbnRlbnRIZWlnaHQsXG4gIH0pXG4pO1xuXG5leHBvcnQgdHlwZSBWaXJ0dWFsU2Nyb2xsTGlzdFByb3BzID0ge1xuICBcImRhdGEtZTJlLXRlc3QtaWRcIj86IHN0cmluZztcbiAgbWF4SGVpZ2h0OiBudW1iZXI7XG4gIGl0ZW1IZWlnaHQ6IG51bWJlcjtcbiAgaXRlbUFtb3VudDogbnVtYmVyO1xuICBlbXB0eVN0YXRlOiAoKSA9PiBSZWFjdC5SZWFjdE5vZGU7XG4gIGl0ZW1JblZpZXc6IG51bWJlcjtcbiAgaXRlbVRlbXBsYXRlOiAoaW5kZXg6IG51bWJlcikgPT4gUmVhY3QuUmVhY3ROb2RlO1xufTtcblxuY29uc3Qgb3ZlcnNjYW4gPSAxMDtcblxuZXhwb3J0IGZ1bmN0aW9uIFZpcnR1YWxTY3JvbGxMaXN0KHtcbiAgbWF4SGVpZ2h0LFxuICBpdGVtSGVpZ2h0LFxuICBpdGVtQW1vdW50LFxuICBlbXB0eVN0YXRlID0gKCkgPT4gbnVsbCxcbiAgaXRlbUluVmlldyxcbiAgaXRlbVRlbXBsYXRlLFxuICBcImRhdGEtZTJlLXRlc3QtaWRcIjogZGF0YUUyZVRlc3RJZCxcbn06IFZpcnR1YWxTY3JvbGxMaXN0UHJvcHMpOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBzY3JvbGxhYmxlQ29udGFpbmVyUmVmID0gdXNlUmVmKG51bGwpO1xuICBjb25zdCB2aWV3cG9ydFJlZiA9IHVzZVJlZihudWxsKTtcblxuICBjb25zdCBbXG4gICAge1xuICAgICAgc2Nyb2xsZWRJdGVtQ291bnQsXG4gICAgICBhbW91bnRPZkl0ZW1zSW5WaWV3LFxuICAgICAgc2Nyb2xsZWRJblB4LFxuICAgICAgbWF4Q29udGVudEhlaWdodCA9IG1heEhlaWdodCxcbiAgICAgIHJlY29tbWVuZGVkU2Nyb2xsUG9zaXRpb24sXG4gICAgfSxcbiAgICBkaXNwYXRjaCxcbiAgXSA9IHVzZVJlZHVjZXIoVmlydHVhbFNjcm9sbFJlZHVjZXIsIHt9KTtcblxuICB1c2VMYXlvdXRFZmZlY3QoKCkgPT4ge1xuICAgIGRpc3BhdGNoKHsgdHlwZTogXCJyZXNldFwiLCBpdGVtSGVpZ2h0LCBtYXhIZWlnaHQsIG92ZXJzY2FuIH0pO1xuICAgIHNjcm9sbGFibGVDb250YWluZXJSZWYuY3VycmVudC5zY3JvbGxUb3AgPSAwO1xuICB9LCBbaXRlbUhlaWdodCwgaXRlbUFtb3VudCwgbWF4SGVpZ2h0XSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBkaXNwYXRjaCh7XG4gICAgICB0eXBlOiBcInJlY29tbWVuZFNjcm9sbFBvc2l0aW9uXCIsXG4gICAgICBzY3JvbGxUb3A6IHNjcm9sbGFibGVDb250YWluZXJSZWYuY3VycmVudC5zY3JvbGxUb3AsXG4gICAgICBpdGVtVG9CZUluVmlldzogaXRlbUluVmlldyxcbiAgICB9KTtcbiAgfSwgW2l0ZW1JblZpZXddKTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmIChyZWNvbW1lbmRlZFNjcm9sbFBvc2l0aW9uID09PSBudWxsKSByZXR1cm47XG5cbiAgICBzY3JvbGxhYmxlQ29udGFpbmVyUmVmLmN1cnJlbnQuc2Nyb2xsVG9wID0gcmVjb21tZW5kZWRTY3JvbGxQb3NpdGlvbjtcbiAgfSwgW3JlY29tbWVuZGVkU2Nyb2xsUG9zaXRpb25dKTtcbiAgdXNlTGF5b3V0RWZmZWN0KCgpID0+IHtcbiAgICBpZiAoIXZpZXdwb3J0UmVmLmN1cnJlbnQpIHJldHVybjtcbiAgICBkaXNwYXRjaCh7XG4gICAgICB0eXBlOiBcInVwZGF0ZVZpZXdwb3J0XCIsXG4gICAgICB2aWV3cG9ydE5vZGU6IHZpZXdwb3J0UmVmLmN1cnJlbnQsXG4gICAgICBpdGVtQW1vdW50LFxuICAgIH0pO1xuICB9LCBbaXRlbUFtb3VudCwgc2Nyb2xsZWRJdGVtQ291bnRdKTtcblxuICBjb25zdCBpdGVtQ291bnRUb0JlUmVuZGVyZWQgPSBNYXRoLm1pbihcbiAgICBNYXRoLm1heCgwLCBpdGVtQW1vdW50IC0gc2Nyb2xsZWRJdGVtQ291bnQpLFxuICAgIGFtb3VudE9mSXRlbXNJblZpZXdcbiAgKTtcblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRDb250YWluZXJcbiAgICAgIHJlZj17c2Nyb2xsYWJsZUNvbnRhaW5lclJlZn1cbiAgICAgIG1heEhlaWdodD17bWF4SGVpZ2h0fVxuICAgICAgc3R5bGU9e3sgbWF4SGVpZ2h0IH19XG4gICAgICBkYXRhLWUyZS10ZXN0LWlkPXtkYXRhRTJlVGVzdElkfVxuICAgICAgZGF0YS1kcy1pZD1cIlZpcnR1YWxTY3JvbGxMaXN0XCJcbiAgICAgIG9uU2Nyb2xsPXsoZTogUmVhY3QuVUlFdmVudDxIVE1MRWxlbWVudD4pID0+IHtcbiAgICAgICAgZGlzcGF0Y2goe1xuICAgICAgICAgIHR5cGU6IFwic2Nyb2xsXCIsXG4gICAgICAgICAgc2Nyb2xsVG9wOiBlLmN1cnJlbnRUYXJnZXQuc2Nyb2xsVG9wLFxuICAgICAgICB9KTtcbiAgICAgIH19XG4gICAgPlxuICAgICAge2l0ZW1BbW91bnQgPT09IDAgPyAoXG4gICAgICAgIGVtcHR5U3RhdGUoKVxuICAgICAgKSA6IChcbiAgICAgICAgPFN0eWxlZFNjcm9sbGFibGVDb250ZW50IG1heENvbnRlbnRIZWlnaHQ9e21heENvbnRlbnRIZWlnaHR9PlxuICAgICAgICAgIDxkaXZcbiAgICAgICAgICAgIHJlZj17dmlld3BvcnRSZWZ9XG4gICAgICAgICAgICBzdHlsZT17e1xuICAgICAgICAgICAgICB0cmFuc2Zvcm06IGB0cmFuc2xhdGVZKCR7c2Nyb2xsZWRJblB4fXB4YCxcbiAgICAgICAgICAgIH19XG4gICAgICAgICAgPlxuICAgICAgICAgICAgeyEhaXRlbUNvdW50VG9CZVJlbmRlcmVkICYmXG4gICAgICAgICAgICAgIG5ldyBBcnJheShpdGVtQ291bnRUb0JlUmVuZGVyZWQpXG4gICAgICAgICAgICAgICAgLmZpbGwoMClcbiAgICAgICAgICAgICAgICAubWFwKChfLCBpbmRleCkgPT4gaXRlbVRlbXBsYXRlKHNjcm9sbGVkSXRlbUNvdW50ICsgaW5kZXgpKX1cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC9TdHlsZWRTY3JvbGxhYmxlQ29udGVudD5cbiAgICAgICl9XG4gICAgPC9TdHlsZWRDb250YWluZXI+XG4gICk7XG59XG4iXX0= */");
+const StyledScrollableContent = /*#__PURE__*/_styled__default.default("div", process.env.NODE_ENV === "production" ? {
+  target: "ebr5g6s0"
+} : {
+  target: "ebr5g6s0",
+  label: "StyledScrollableContent"
+})(_ref2 => {
+  let {
+    maxContentHeight
+  } = _ref2;
+  return {
+    overflow: "hidden",
+    boxSizing: "border-box",
+    height: maxContentHeight
+  };
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlZpcnR1YWxTY3JvbGxMaXN0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFjZ0MiLCJmaWxlIjoiVmlydHVhbFNjcm9sbExpc3QudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgUmVhY3QsIHsgdXNlUmVmLCB1c2VSZWR1Y2VyLCB1c2VMYXlvdXRFZmZlY3QsIHVzZUVmZmVjdCB9IGZyb20gXCJyZWFjdFwiO1xuXG5pbXBvcnQgeyBWaXJ0dWFsU2Nyb2xsUmVkdWNlciB9IGZyb20gXCIuL1ZpcnR1YWxTY3JvbGxMaXN0UmVkdWNlclwiO1xuXG5jb25zdCBTdHlsZWRDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8VmlydHVhbFNjcm9sbExpc3RQcm9wcz4+KFxuICAoeyBtYXhIZWlnaHQgfSkgPT4gKHtcbiAgICBvdmVyZmxvdzogXCJhdXRvXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGhlaWdodDogXCIxMDAlXCIsXG4gICAgbWF4SGVpZ2h0LFxuICB9KVxuKTtcblxuY29uc3QgU3R5bGVkU2Nyb2xsYWJsZUNvbnRlbnQgPSBzdHlsZWQuZGl2PHsgbWF4Q29udGVudEhlaWdodDogbnVtYmVyIH0+KFxuICAoeyBtYXhDb250ZW50SGVpZ2h0IH0pID0+ICh7XG4gICAgb3ZlcmZsb3c6IFwiaGlkZGVuXCIsXG4gICAgYm94U2l6aW5nOiBcImJvcmRlci1ib3hcIixcbiAgICBoZWlnaHQ6IG1heENvbnRlbnRIZWlnaHQsXG4gIH0pXG4pO1xuXG5leHBvcnQgdHlwZSBWaXJ0dWFsU2Nyb2xsTGlzdFByb3BzID0ge1xuICBcImRhdGEtZTJlLXRlc3QtaWRcIj86IHN0cmluZztcbiAgbWF4SGVpZ2h0OiBudW1iZXI7XG4gIGl0ZW1IZWlnaHQ6IG51bWJlcjtcbiAgaXRlbUFtb3VudDogbnVtYmVyO1xuICBlbXB0eVN0YXRlOiAoKSA9PiBSZWFjdC5SZWFjdE5vZGU7XG4gIGl0ZW1JblZpZXc6IG51bWJlcjtcbiAgaXRlbVRlbXBsYXRlOiAoaW5kZXg6IG51bWJlcikgPT4gUmVhY3QuUmVhY3ROb2RlO1xufTtcblxuY29uc3Qgb3ZlcnNjYW4gPSAxMDtcblxuZXhwb3J0IGZ1bmN0aW9uIFZpcnR1YWxTY3JvbGxMaXN0KHtcbiAgbWF4SGVpZ2h0LFxuICBpdGVtSGVpZ2h0LFxuICBpdGVtQW1vdW50LFxuICBlbXB0eVN0YXRlID0gKCkgPT4gbnVsbCxcbiAgaXRlbUluVmlldyxcbiAgaXRlbVRlbXBsYXRlLFxuICBcImRhdGEtZTJlLXRlc3QtaWRcIjogZGF0YUUyZVRlc3RJZCxcbn06IFZpcnR1YWxTY3JvbGxMaXN0UHJvcHMpOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBzY3JvbGxhYmxlQ29udGFpbmVyUmVmID0gdXNlUmVmKG51bGwpO1xuICBjb25zdCB2aWV3cG9ydFJlZiA9IHVzZVJlZihudWxsKTtcblxuICBjb25zdCBbXG4gICAge1xuICAgICAgc2Nyb2xsZWRJdGVtQ291bnQsXG4gICAgICBhbW91bnRPZkl0ZW1zSW5WaWV3LFxuICAgICAgc2Nyb2xsZWRJblB4LFxuICAgICAgbWF4Q29udGVudEhlaWdodCA9IG1heEhlaWdodCxcbiAgICAgIHJlY29tbWVuZGVkU2Nyb2xsUG9zaXRpb24sXG4gICAgfSxcbiAgICBkaXNwYXRjaCxcbiAgXSA9IHVzZVJlZHVjZXIoVmlydHVhbFNjcm9sbFJlZHVjZXIsIHt9KTtcblxuICB1c2VMYXlvdXRFZmZlY3QoKCkgPT4ge1xuICAgIGRpc3BhdGNoKHsgdHlwZTogXCJyZXNldFwiLCBpdGVtSGVpZ2h0LCBtYXhIZWlnaHQsIG92ZXJzY2FuIH0pO1xuICAgIHNjcm9sbGFibGVDb250YWluZXJSZWYuY3VycmVudC5zY3JvbGxUb3AgPSAwO1xuICB9LCBbaXRlbUhlaWdodCwgaXRlbUFtb3VudCwgbWF4SGVpZ2h0XSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBkaXNwYXRjaCh7XG4gICAgICB0eXBlOiBcInJlY29tbWVuZFNjcm9sbFBvc2l0aW9uXCIsXG4gICAgICBzY3JvbGxUb3A6IHNjcm9sbGFibGVDb250YWluZXJSZWYuY3VycmVudC5zY3JvbGxUb3AsXG4gICAgICBpdGVtVG9CZUluVmlldzogaXRlbUluVmlldyxcbiAgICB9KTtcbiAgfSwgW2l0ZW1JblZpZXddKTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmIChyZWNvbW1lbmRlZFNjcm9sbFBvc2l0aW9uID09PSBudWxsKSByZXR1cm47XG5cbiAgICBzY3JvbGxhYmxlQ29udGFpbmVyUmVmLmN1cnJlbnQuc2Nyb2xsVG9wID0gcmVjb21tZW5kZWRTY3JvbGxQb3NpdGlvbjtcbiAgfSwgW3JlY29tbWVuZGVkU2Nyb2xsUG9zaXRpb25dKTtcbiAgdXNlTGF5b3V0RWZmZWN0KCgpID0+IHtcbiAgICBpZiAoIXZpZXdwb3J0UmVmLmN1cnJlbnQpIHJldHVybjtcbiAgICBkaXNwYXRjaCh7XG4gICAgICB0eXBlOiBcInVwZGF0ZVZpZXdwb3J0XCIsXG4gICAgICB2aWV3cG9ydE5vZGU6IHZpZXdwb3J0UmVmLmN1cnJlbnQsXG4gICAgICBpdGVtQW1vdW50LFxuICAgIH0pO1xuICB9LCBbaXRlbUFtb3VudCwgc2Nyb2xsZWRJdGVtQ291bnRdKTtcblxuICBjb25zdCBpdGVtQ291bnRUb0JlUmVuZGVyZWQgPSBNYXRoLm1pbihcbiAgICBNYXRoLm1heCgwLCBpdGVtQW1vdW50IC0gc2Nyb2xsZWRJdGVtQ291bnQpLFxuICAgIGFtb3VudE9mSXRlbXNJblZpZXdcbiAgKTtcblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRDb250YWluZXJcbiAgICAgIHJlZj17c2Nyb2xsYWJsZUNvbnRhaW5lclJlZn1cbiAgICAgIG1heEhlaWdodD17bWF4SGVpZ2h0fVxuICAgICAgc3R5bGU9e3sgbWF4SGVpZ2h0IH19XG4gICAgICBkYXRhLWUyZS10ZXN0LWlkPXtkYXRhRTJlVGVzdElkfVxuICAgICAgZGF0YS1kcy1pZD1cIlZpcnR1YWxTY3JvbGxMaXN0XCJcbiAgICAgIG9uU2Nyb2xsPXsoZTogUmVhY3QuVUlFdmVudDxIVE1MRWxlbWVudD4pID0+IHtcbiAgICAgICAgZGlzcGF0Y2goe1xuICAgICAgICAgIHR5cGU6IFwic2Nyb2xsXCIsXG4gICAgICAgICAgc2Nyb2xsVG9wOiBlLmN1cnJlbnRUYXJnZXQuc2Nyb2xsVG9wLFxuICAgICAgICB9KTtcbiAgICAgIH19XG4gICAgPlxuICAgICAge2l0ZW1BbW91bnQgPT09IDAgPyAoXG4gICAgICAgIGVtcHR5U3RhdGUoKVxuICAgICAgKSA6IChcbiAgICAgICAgPFN0eWxlZFNjcm9sbGFibGVDb250ZW50IG1heENvbnRlbnRIZWlnaHQ9e21heENvbnRlbnRIZWlnaHR9PlxuICAgICAgICAgIDxkaXZcbiAgICAgICAgICAgIHJlZj17dmlld3BvcnRSZWZ9XG4gICAgICAgICAgICBzdHlsZT17e1xuICAgICAgICAgICAgICB0cmFuc2Zvcm06IGB0cmFuc2xhdGVZKCR7c2Nyb2xsZWRJblB4fXB4YCxcbiAgICAgICAgICAgIH19XG4gICAgICAgICAgPlxuICAgICAgICAgICAgeyEhaXRlbUNvdW50VG9CZVJlbmRlcmVkICYmXG4gICAgICAgICAgICAgIG5ldyBBcnJheShpdGVtQ291bnRUb0JlUmVuZGVyZWQpXG4gICAgICAgICAgICAgICAgLmZpbGwoMClcbiAgICAgICAgICAgICAgICAubWFwKChfLCBpbmRleCkgPT4gaXRlbVRlbXBsYXRlKHNjcm9sbGVkSXRlbUNvdW50ICsgaW5kZXgpKX1cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC9TdHlsZWRTY3JvbGxhYmxlQ29udGVudD5cbiAgICAgICl9XG4gICAgPC9TdHlsZWRDb250YWluZXI+XG4gICk7XG59XG4iXX0= */");
+const overscan = 10;
+function VirtualScrollList(_ref3) {
+  let {
+    maxHeight,
+    itemHeight,
+    itemAmount,
+    emptyState = () => null,
+    itemInView,
+    itemTemplate,
+    "data-e2e-test-id": dataE2eTestId
+  } = _ref3;
+  const scrollableContainerRef = React.useRef(null);
+  const viewportRef = React.useRef(null);
+  const [{
+    scrolledItemCount,
+    amountOfItemsInView,
+    scrolledInPx,
+    maxContentHeight = maxHeight,
+    recommendedScrollPosition
+  }, dispatch] = React.useReducer(VirtualScrollListReducer.VirtualScrollReducer, {});
+  React.useLayoutEffect(() => {
+    dispatch({
+      type: "reset",
+      itemHeight,
+      maxHeight,
+      overscan
+    });
+    scrollableContainerRef.current.scrollTop = 0;
+  }, [itemHeight, itemAmount, maxHeight]);
+  React.useEffect(() => {
+    dispatch({
+      type: "recommendScrollPosition",
+      scrollTop: scrollableContainerRef.current.scrollTop,
+      itemToBeInView: itemInView
+    });
+  }, [itemInView]);
+  React.useEffect(() => {
+    if (recommendedScrollPosition === null) return;
+    scrollableContainerRef.current.scrollTop = recommendedScrollPosition;
+  }, [recommendedScrollPosition]);
+  React.useLayoutEffect(() => {
+    if (!viewportRef.current) return;
+    dispatch({
+      type: "updateViewport",
+      viewportNode: viewportRef.current,
+      itemAmount
+    });
+  }, [itemAmount, scrolledItemCount]);
+  const itemCountToBeRendered = Math.min(Math.max(0, itemAmount - scrolledItemCount), amountOfItemsInView);
+  return /*#__PURE__*/React__default.default.createElement(StyledContainer, {
+    ref: scrollableContainerRef,
+    maxHeight: maxHeight,
+    style: {
+      maxHeight
+    },
+    "data-e2e-test-id": dataE2eTestId,
+    "data-ds-id": "VirtualScrollList",
+    onScroll: e => {
+      dispatch({
+        type: "scroll",
+        scrollTop: e.currentTarget.scrollTop
+      });
+    }
+  }, itemAmount === 0 ? emptyState() : /*#__PURE__*/React__default.default.createElement(StyledScrollableContent, {
+    maxContentHeight: maxContentHeight
+  }, /*#__PURE__*/React__default.default.createElement("div", {
+    ref: viewportRef,
+    style: {
+      transform: `translateY(${scrolledInPx}px`
+    }
+  }, !!itemCountToBeRendered && new Array(itemCountToBeRendered).fill(0).map((_, index) => itemTemplate(scrolledItemCount + index)))));
+}
+
+exports.VirtualScrollList = VirtualScrollList;

package/build/cjs/src/components/VirtualScrollList/VirtualScrollListReducer.js

@@ -0,0 +1,131 @@
+'use strict';
+
+const findClosestOffsetIndex = (arr, val) => {
+  let start = 0;
+  let end = arr.length - 1;
+  let mid = Math.floor((start + end) / 2);
+  while (start <= end) {
+    mid = Math.floor((start + end) / 2);
+    if (arr[mid].amount === val) {
+      return mid;
+    }
+    if (val < arr[mid].amount) {
+      end = mid - 1;
+    } else {
+      start = mid + 1;
+    }
+  }
+  return mid;
+};
+const getMaxHeight = function (maxAmountOfItems, offsets) {
+  let lastItemHeight = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+  const amountOfOffsets = Math.min(offsets.length, maxAmountOfItems);
+  const maxOffset = offsets[amountOfOffsets - 1]?.amount || 0;
+  const result = maxOffset + lastItemHeight;
+  return result;
+};
+const reduceScroll = (prevState, scrollTop) => {
+  const {
+    topOffsets,
+    overscan: tolerance
+  } = prevState;
+  const scrolledItemCount = Math.max(0, findClosestOffsetIndex(topOffsets, scrollTop) - tolerance / 2);
+  const scrolledInPx = topOffsets[scrolledItemCount]?.amount || 0;
+  return {
+    ...prevState,
+    scrolledItemCount,
+    scrolledInPx
+  };
+};
+const reduceUpdateViewport = (prevState, viewportNode, itemAmount) => {
+  const {
+    topOffsets = [],
+    scrolledInPx,
+    scrolledItemCount,
+    avgItemHeight,
+    lastItemHeight,
+    maxHeight,
+    overscan: tolerance
+  } = prevState;
+  const newTopOffsets = [...topOffsets];
+  let updatedLastItemHeight = lastItemHeight;
+  Array.from(viewportNode.children).forEach((child, i) => {
+    newTopOffsets[i + scrolledItemCount] = {
+      amount: scrolledInPx + child.offsetTop,
+      isInterpolated: false
+    };
+    if (i + scrolledItemCount === itemAmount - 1 && !lastItemHeight) {
+      updatedLastItemHeight = child.getBoundingClientRect().height;
+    }
+  });
+  for (let i = 0; i < itemAmount; i += 1) {
+    if (!newTopOffsets[i] || newTopOffsets[i].isInterpolated) {
+      newTopOffsets[i] = {
+        amount: newTopOffsets[i - 1].amount + avgItemHeight,
+        isInterpolated: true
+      };
+    }
+  }
+  const newAvgItemHeight = Math.max(avgItemHeight, viewportNode.getBoundingClientRect().height / (viewportNode.childElementCount || 1));
+  const maxContentHeight = getMaxHeight(itemAmount, newTopOffsets, updatedLastItemHeight);
+  return {
+    ...prevState,
+    lastItemHeight: updatedLastItemHeight,
+    avgItemHeight,
+    topOffsets: newTopOffsets,
+    amountOfItemsInView: Math.round(maxHeight / newAvgItemHeight) + tolerance,
+    maxContentHeight
+  };
+};
+const reduceReset = (prevState, itemHeight, maxHeight, overscan) => ({
+  ...prevState,
+  lastItemHeight: null,
+  topOffsets: [{
+    amount: 0,
+    isInterpolated: false
+  }],
+  scrolledInPx: 0,
+  scrolledItemCount: 0,
+  maxHeight,
+  avgItemHeight: itemHeight,
+  overscan
+});
+const reduceRecommendScrollPosition = (prevState, scrollTop, itemToBeInView) => {
+  const {
+    topOffsets,
+    maxHeight
+  } = prevState;
+  if (!topOffsets) return prevState;
+  const bottomOfTarget = topOffsets[itemToBeInView + 1]?.amount;
+  const topOfTarget = topOffsets[itemToBeInView]?.amount;
+  let recommendedScrollPosition = null;
+  if (topOfTarget < scrollTop) {
+    recommendedScrollPosition = topOfTarget;
+  }
+  if (bottomOfTarget >= scrollTop + maxHeight) {
+    recommendedScrollPosition = bottomOfTarget - maxHeight;
+  }
+  if (itemToBeInView === topOffsets.length - 1) {
+    recommendedScrollPosition = topOffsets[itemToBeInView].amount;
+  }
+  return {
+    ...prevState,
+    recommendedScrollPosition
+  };
+};
+const VirtualScrollReducer = (prevState, action) => {
+  switch (action.type) {
+    case "reset":
+      return reduceReset(prevState, action.itemHeight, action.maxHeight, action.overscan);
+    case "scroll":
+      return reduceScroll(prevState, action.scrollTop);
+    case "updateViewport":
+      return reduceUpdateViewport(prevState, action.viewportNode, action.itemAmount);
+    case "recommendScrollPosition":
+      return reduceRecommendScrollPosition(prevState, action.scrollTop, action.itemToBeInView);
+    default:
+      throw new Error();
+  }
+};
+
+exports.VirtualScrollReducer = VirtualScrollReducer;