@dnb/eufemia 9.32.1 → 9.34.0

package/fragments/drawer-list/DrawerListPortal.js

@@ -18,7 +18,7 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
-import { warn, isInsideScrollView } from '../../shared/component-helper';
+import { warn, getClosestScrollViewElement } from '../../shared/component-helper';
 
 var DrawerListPortal = function (_React$PureComponent) {
   _inherits(DrawerListPortal, _React$PureComponent);
@@ -154,6 +154,14 @@ var DrawerListPortal = function (_React$PureComponent) {
           width = window.innerWidth;
         }
 
+        if (top < 0) {
+          top = 0;
+        }
+
+        if (left < 0) {
+          left = 0;
+        }
+
         var style = {
           width: width,
           '--drawer-list-width': "".concat(width / 16, "rem"),
@@ -175,21 +183,18 @@ var DrawerListPortal = function (_React$PureComponent) {
       }
 
       this.setPosition = function () {
-        clearTimeout(_this2._ddt);
-        _this2._ddt = setTimeout(function () {
+        clearTimeout(_this2.positionTimeout);
+        _this2.positionTimeout = setTimeout(function () {
           if (_this2.props.opened) {
             _this2.setState({
               random: Date.now()
             });
           }
-        }, 30);
+        }, 200);
       };
 
-      this.customElem = isInsideScrollView(this.props.rootRef.current, true);
-
-      if (this.customElem) {
-        this.customElem.addEventListener('scroll', this.setPosition);
-      }
+      this.customElem = getClosestScrollViewElement(this.props.rootRef.current) || window;
+      this.customElem.addEventListener('scroll', this.setPosition);
 
       try {
         this.resizeObserver = new ResizeObserver(this.setPosition);
@@ -201,7 +206,7 @@ var DrawerListPortal = function (_React$PureComponent) {
   }, {
     key: "removePositionObserver",
     value: function removePositionObserver() {
-      clearTimeout(this._ddt);
+      clearTimeout(this.positionTimeout);
 
       if (typeof window !== 'undefined' && this.setPosition) {
         if (this.customElem) {

package/fragments/drawer-list/DrawerListProvider.js

@@ -30,7 +30,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import keycode from 'keycode';
 import Context from '../../shared/Context';
-import { warn, isTrue, roundToNearest, isInsideScrollView, detectOutsideClick, dispatchCustomElementEvent, getPreviousSibling } from '../../shared/component-helper';
+import { warn, isTrue, roundToNearest, getClosestScrollViewElement, detectOutsideClick, dispatchCustomElementEvent, getPreviousSibling } from '../../shared/component-helper';
 import { getOffsetTop, getOffsetLeft, hasSelectedText, getSelectedElement } from '../../shared/helpers';
 import { getData, normalizeData, findClosest, getSelectedItemValue, parseContentTitle, getEventData, prepareStartupState, prepareDerivedState, drawerListPropTypes, drawerListDefaultProps, drawerListProviderPropTypes, drawerListProviderDefaultProps } from './DrawerListHelpers';
 import DrawerListContext from './DrawerListContext';
@@ -62,6 +62,35 @@ var DrawerListProvider = function (_React$PureComponent) {
       }
     });
 
+    _defineProperty(_assertThisInitialized(_this), "correctHiddenView", function () {
+      if (!_this._refShell.current || !_this._refUl.current) {
+        return;
+      }
+
+      try {
+        var spaceToLeft = getOffsetLeft(_this._refUl.current);
+
+        var spaceToRight = window.innerWidth - (getOffsetLeft(_this._refUl.current) + _this._refUl.current.offsetWidth);
+
+        var triangleStyle = _this._refTriangle.current.style;
+        var shellStyle = _this._refShell.current.style;
+
+        if (spaceToLeft < 0) {
+          shellStyle.transform = "translateX(".concat(Math.abs(spaceToLeft / 16), "rem)");
+          triangleStyle.right = "".concat(Math.abs(spaceToLeft / 16), "rem");
+        } else if (spaceToRight < 0) {
+          shellStyle.transform = "translateX(".concat(spaceToRight / 16, "rem)");
+          triangleStyle.left = "".concat(Math.abs(spaceToRight / 16), "rem");
+        } else {
+          if (shellStyle.transform) {
+            shellStyle.transform = '';
+            triangleStyle.left = 'auto';
+            triangleStyle.right = 'auto';
+          }
+        }
+      } catch (e) {}
+    });
+
     _defineProperty(_assertThisInitialized(_this), "scrollToItem", function (active_item) {
       var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
           _ref$scrollTo = _ref.scrollTo,
@@ -178,7 +207,7 @@ var DrawerListProvider = function (_React$PureComponent) {
       if (wrapper_element !== _this.state.wrapper_element) {
         _this.setState({
           wrapper_element: wrapper_element
-        }, _this.setOutsideClickObserver);
+        });
       }
 
       return _assertThisInitialized(_this);
@@ -621,6 +650,8 @@ var DrawerListProvider = function (_React$PureComponent) {
         });
 
         var delayHandler = function delayHandler() {
+          _this.removeObservers();
+
           _this.setState({
             hidden: true,
             isOpen: false
@@ -633,8 +664,6 @@ var DrawerListProvider = function (_React$PureComponent) {
           DrawerListProvider.isOpen = false;
 
           _this.setActiveState(false);
-
-          _this.removeObservers();
         };
 
         if (isTrue(_this.props.no_animation)) {
@@ -812,9 +841,9 @@ var DrawerListProvider = function (_React$PureComponent) {
       clearTimeout(this._showTimeout);
       clearTimeout(this._hideTimeout);
       clearTimeout(this._scrollTimeout);
-      clearTimeout(this._ddTimeout);
-      this.setActiveState(false);
+      clearTimeout(this._directionTimeout);
       this.removeObservers();
+      this.setActiveState(false);
     }
   }, {
     key: "refreshScrollObserver",
@@ -928,7 +957,7 @@ var DrawerListProvider = function (_React$PureComponent) {
       var customElem = typeof observer_element === 'string' ? document.querySelector(observer_element) : null;
 
       if (!customElem) {
-        customElem = isInsideScrollView(this._refRoot.current, true);
+        customElem = getClosestScrollViewElement(this._refRoot.current);
       }
 
       this.removeDirectionObserver();
@@ -984,22 +1013,22 @@ var DrawerListProvider = function (_React$PureComponent) {
         } catch (e) {
           warn('List could not set onResize:', e);
         }
+
+        _this6.correctHiddenView();
       };
 
       this.setDirection = function (e) {
-        clearTimeout(_this6._ddTimeout);
-        _this6._ddTimeout = setTimeout(renderDirection, 30);
-
-        if (useDrawer && e.type === 'resize') {
-          if (!_this6._bodyLockIsEnabled && (window.innerWidth / 16 <= 40 || window.innerHeight / 16 <= 40)) {
-            _this6.enableBodyLock();
-          } else if (_this6._bodyLockIsEnabled && !useBodyLock) {
-            _this6.disableBodyLock();
-          }
-        }
+        clearTimeout(_this6._directionTimeout);
+        _this6._directionTimeout = setTimeout(renderDirection, 50);
 
         if (e.type === 'resize') {
-          _this6.correctHiddenView();
+          if (useDrawer) {
+            if (!_this6._bodyLockIsEnabled && (window.innerWidth / 16 <= 40 || window.innerHeight / 16 <= 40)) {
+              _this6.enableBodyLock();
+            } else if (_this6._bodyLockIsEnabled && !useBodyLock) {
+              _this6.disableBodyLock();
+            }
+          }
         }
       };
 
@@ -1018,35 +1047,9 @@ var DrawerListProvider = function (_React$PureComponent) {
         this.enableBodyLock();
       }
 
-      this.correctHiddenView();
       this.refreshScrollObserver();
       renderDirection();
     }
-  }, {
-    key: "correctHiddenView",
-    value: function correctHiddenView() {
-      try {
-        var ui = this._refUl.current;
-        var spaceToLeft = getOffsetLeft(ui);
-        var spaceToRight = window.innerWidth - (getOffsetLeft(ui) + ui.offsetWidth);
-        var tri = this._refTriangle.current.style;
-        var shell = this._refShell.current.style;
-
-        if (spaceToLeft < 0) {
-          shell.transform = "translateX(".concat(Math.abs(spaceToLeft), "px)");
-          tri.right = "".concat(Math.abs(spaceToLeft), "px");
-        } else if (spaceToRight < 0) {
-          shell.transform = "translateX(".concat(spaceToRight, "px)");
-          tri.left = "".concat(Math.abs(spaceToRight), "px");
-        } else {
-          if (shell.transform) {
-            shell.transform = '';
-            tri.left = 'auto';
-            tri.right = 'auto';
-          }
-        }
-      } catch (e) {}
-    }
   }, {
     key: "findItemByValue",
     value: function findItemByValue(value) {
@@ -1093,7 +1096,7 @@ var DrawerListProvider = function (_React$PureComponent) {
     key: "removeDirectionObserver",
     value: function removeDirectionObserver() {
       this.disableBodyLock();
-      clearTimeout(this._ddTimeout);
+      clearTimeout(this._directionTimeout);
 
       if (typeof window !== 'undefined' && this.setDirection) {
         var _this$_rootElem;

package/fragments/drawer-list/style/_drawer-list.scss

@@ -68,6 +68,11 @@
 
   &__portal__style {
     position: absolute;
+    transition: all 300ms var(--easing-default);
+
+    html[data-visual-test] & {
+      animation-duration: 1ms !important;
+    }
 
     // higher than modal --modal-z-index:
     z-index: 3200;
@@ -137,9 +142,14 @@
   &--scroll &__options {
     min-height: 2rem;
     max-height: 70vh;
+    transition: max-height 300ms var(--easing-default);
 
     @include scrollY(auto);
   }
+  html[data-visual-test] &--scroll &__options,
+  &--scroll#{&}--no-animation &__options {
+    animation-duration: 1ms !important;
+  }
   &--opened &__options {
     scroll-behavior: smooth;
   }

package/icons/hierarchy.d.ts

@@ -0,0 +1,2 @@
+export default hierarchy;
+declare function hierarchy(props: any): JSX.Element;

package/icons/hierarchy.js

@@ -0,0 +1,30 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+
+var _g, _defs;
+
+import React from 'react';
+
+var hierarchy = function hierarchy(props) {
+  return React.createElement("svg", _extends({
+    width: 16,
+    height: 16,
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), _g || (_g = React.createElement("g", {
+    clipPath: "url(#a)"
+  }, React.createElement("path", {
+    d: "M3.333 10.333V9.4c0-.515.418-.933.934-.933h7.466c.516 0 .934.418.934.933v.933M8 5.667v2.8M2.5 15h1.667a1.5 1.5 0 0 0 1.5-1.5v-1.667a1.5 1.5 0 0 0-1.5-1.5H2.5a1.5 1.5 0 0 0-1.5 1.5V13.5A1.5 1.5 0 0 0 2.5 15Zm4.667-9.333h1.666a1.5 1.5 0 0 0 1.5-1.5V2.5a1.5 1.5 0 0 0-1.5-1.5H7.167a1.5 1.5 0 0 0-1.5 1.5v1.667a1.5 1.5 0 0 0 1.5 1.5ZM11.833 15H13.5a1.5 1.5 0 0 0 1.5-1.5v-1.667a1.5 1.5 0 0 0-1.5-1.5h-1.667a1.5 1.5 0 0 0-1.5 1.5V13.5a1.5 1.5 0 0 0 1.5 1.5Z",
+    stroke: "#000",
+    strokeWidth: 1.5,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }))), _defs || (_defs = React.createElement("defs", null, React.createElement("clipPath", {
+    id: "a"
+  }, React.createElement("path", {
+    fill: "#fff",
+    d: "M0 0h16v16H0z"
+  })))));
+};
+
+export default hierarchy;

package/icons/hierarchy_medium.d.ts

@@ -0,0 +1,2 @@
+export default hierarchy_medium;
+declare function hierarchy_medium(props: any): JSX.Element;

package/icons/hierarchy_medium.js

@@ -0,0 +1,30 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+
+var _g, _defs;
+
+import React from 'react';
+
+var hierarchy_medium = function hierarchy_medium(props) {
+  return React.createElement("svg", _extends({
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), _g || (_g = React.createElement("g", {
+    clipPath: "url(#a)"
+  }, React.createElement("path", {
+    d: "M4.667 15.667V14.2c0-.81.656-1.467 1.466-1.467h11.734c.81 0 1.466.657 1.466 1.467v1.467M12 8.333v4.4M3.357 23h2.62a2.357 2.357 0 0 0 2.356-2.357v-2.62a2.357 2.357 0 0 0-2.357-2.356H3.357A2.357 2.357 0 0 0 1 18.024v2.619A2.357 2.357 0 0 0 3.357 23ZM10.69 8.333h2.62a2.357 2.357 0 0 0 2.357-2.357V3.357A2.357 2.357 0 0 0 13.31 1h-2.62a2.357 2.357 0 0 0-2.357 2.357v2.62a2.357 2.357 0 0 0 2.357 2.356ZM18.024 23h2.619A2.357 2.357 0 0 0 23 20.643v-2.62a2.357 2.357 0 0 0-2.357-2.356h-2.62a2.357 2.357 0 0 0-2.356 2.357v2.619A2.357 2.357 0 0 0 18.024 23Z",
+    stroke: "#000",
+    strokeWidth: 1.5,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }))), _defs || (_defs = React.createElement("defs", null, React.createElement("clipPath", {
+    id: "a"
+  }, React.createElement("path", {
+    fill: "#fff",
+    d: "M0 0h24v24H0z"
+  })))));
+};
+
+export default hierarchy_medium;

package/icons/icons-meta.json

@@ -3469,5 +3469,47 @@
     "name": "newspaper",
     "variant": "secondary",
     "category": "objects"
+  },
+  "layout_card_medium": {
+    "tags": [],
+    "created": 1666351885521,
+    "name": "layout_card",
+    "variant": "secondary",
+    "category": "essentials"
+  },
+  "layout_card": {
+    "tags": [],
+    "created": 1666351885645,
+    "name": "layout_card",
+    "variant": "secondary",
+    "category": "essentials"
+  },
+  "unlock_medium": {
+    "tags": [],
+    "created": 1666351885767,
+    "name": "unlock",
+    "variant": "secondary",
+    "category": "essentials"
+  },
+  "unlock": {
+    "tags": [],
+    "created": 1666351885890,
+    "name": "unlock",
+    "variant": "secondary",
+    "category": "essentials"
+  },
+  "hierarchy_medium": {
+    "tags": [],
+    "created": 1666351886001,
+    "name": "hierarchy",
+    "variant": "secondary",
+    "category": "essentials"
+  },
+  "hierarchy": {
+    "tags": [],
+    "created": 1666351886132,
+    "name": "hierarchy",
+    "variant": "secondary",
+    "category": "essentials"
   }
 }

package/icons/icons-pdf.lock

@@ -6420,5 +6420,83 @@
     "bundleName": "secondary_icons",
     "created": 1663768090352,
     "updated": 1663768090352
+  },
+  "layout_card_medium.pdf": {
+    "iconName": "layout_card_medium",
+    "name": "layout_card",
+    "category": "essentials",
+    "url": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/af914888-1310-4595-b8c0-365e97f6c7c9",
+    "id": "4744:13",
+    "slug": "878548076e6ef92a3736f0e3597fb7be",
+    "size": "24",
+    "variant": "secondary",
+    "bundleName": "secondary_icons_medium",
+    "created": 1666351889579,
+    "updated": 1666351889579
+  },
+  "layout_card.pdf": {
+    "iconName": "layout_card",
+    "name": "layout_card",
+    "category": "essentials",
+    "url": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/bd884801-d03e-4def-9bc0-503dd699ce43",
+    "id": "4744:15",
+    "slug": "878548076e6ef92a3736f0e3597fb7be",
+    "size": "16",
+    "variant": "secondary",
+    "bundleName": "secondary_icons",
+    "created": 1666351889697,
+    "updated": 1666351889697
+  },
+  "unlock_medium.pdf": {
+    "iconName": "unlock_medium",
+    "name": "unlock",
+    "category": "essentials",
+    "url": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/acb072aa-b2a0-4c99-9554-6ee38aa9f365",
+    "id": "4744:21",
+    "slug": "878548076e6ef92a3736f0e3597fb7be",
+    "size": "24",
+    "variant": "secondary",
+    "bundleName": "secondary_icons_medium",
+    "created": 1666351889818,
+    "updated": 1666351889818
+  },
+  "unlock.pdf": {
+    "iconName": "unlock",
+    "name": "unlock",
+    "category": "essentials",
+    "url": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/a6a7c816-74cc-4165-93ff-75b5b966959f",
+    "id": "4744:23",
+    "slug": "878548076e6ef92a3736f0e3597fb7be",
+    "size": "16",
+    "variant": "secondary",
+    "bundleName": "secondary_icons",
+    "created": 1666351889953,
+    "updated": 1666351889953
+  },
+  "hierarchy_medium.pdf": {
+    "iconName": "hierarchy_medium",
+    "name": "hierarchy",
+    "category": "essentials",
+    "url": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/2a957b22-0bad-41cf-a55d-4ba4c8ada7b4",
+    "id": "4744:47",
+    "slug": "878548076e6ef92a3736f0e3597fb7be",
+    "size": "24",
+    "variant": "secondary",
+    "bundleName": "secondary_icons_medium",
+    "created": 1666351890074,
+    "updated": 1666351890074
+  },
+  "hierarchy.pdf": {
+    "iconName": "hierarchy",
+    "name": "hierarchy",
+    "category": "essentials",
+    "url": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/ea30469c-a1ab-40d8-b088-539b9f9a3520",
+    "id": "4744:49",
+    "slug": "878548076e6ef92a3736f0e3597fb7be",
+    "size": "16",
+    "variant": "secondary",
+    "bundleName": "secondary_icons",
+    "created": 1666351890205,
+    "updated": 1666351890205
   }
 }

package/icons/icons-svg.lock

@@ -6420,5 +6420,83 @@
     "bundleName": "secondary_icons",
     "created": 1663767965177,
     "updated": 1663767965177
+  },
+  "layout_card_medium.svg": {
+    "iconName": "layout_card_medium",
+    "name": "layout_card",
+    "category": "essentials",
+    "url": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/43a984d2-4d83-4f91-a038-60eb3a51b3ae",
+    "id": "4744:13",
+    "slug": "878548076e6ef92a3736f0e3597fb7be",
+    "size": "24",
+    "variant": "secondary",
+    "bundleName": "secondary_icons_medium",
+    "created": 1666351885521,
+    "updated": 1666351885521
+  },
+  "layout_card.svg": {
+    "iconName": "layout_card",
+    "name": "layout_card",
+    "category": "essentials",
+    "url": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/58bc6acc-56af-4ced-93cf-bb8f5f1604bc",
+    "id": "4744:15",
+    "slug": "878548076e6ef92a3736f0e3597fb7be",
+    "size": "16",
+    "variant": "secondary",
+    "bundleName": "secondary_icons",
+    "created": 1666351885645,
+    "updated": 1666351885645
+  },
+  "unlock_medium.svg": {
+    "iconName": "unlock_medium",
+    "name": "unlock",
+    "category": "essentials",
+    "url": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/2d2e88fd-216e-47c3-9033-f76062572c95",
+    "id": "4744:21",
+    "slug": "878548076e6ef92a3736f0e3597fb7be",
+    "size": "24",
+    "variant": "secondary",
+    "bundleName": "secondary_icons_medium",
+    "created": 1666351885767,
+    "updated": 1666351885767
+  },
+  "unlock.svg": {
+    "iconName": "unlock",
+    "name": "unlock",
+    "category": "essentials",
+    "url": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/b2129ae6-bd76-468b-b145-0b3190566d31",
+    "id": "4744:23",
+    "slug": "878548076e6ef92a3736f0e3597fb7be",
+    "size": "16",
+    "variant": "secondary",
+    "bundleName": "secondary_icons",
+    "created": 1666351885890,
+    "updated": 1666351885890
+  },
+  "hierarchy_medium.svg": {
+    "iconName": "hierarchy_medium",
+    "name": "hierarchy",
+    "category": "essentials",
+    "url": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/07b979b3-820b-4614-9a4d-d20f0204cf5d",
+    "id": "4744:47",
+    "slug": "878548076e6ef92a3736f0e3597fb7be",
+    "size": "24",
+    "variant": "secondary",
+    "bundleName": "secondary_icons_medium",
+    "created": 1666351886001,
+    "updated": 1666351886001
+  },
+  "hierarchy.svg": {
+    "iconName": "hierarchy",
+    "name": "hierarchy",
+    "category": "essentials",
+    "url": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/images/b1ab83cf-f61b-41f4-8833-f060c6a7da8c",
+    "id": "4744:49",
+    "slug": "878548076e6ef92a3736f0e3597fb7be",
+    "size": "16",
+    "variant": "secondary",
+    "bundleName": "secondary_icons",
+    "created": 1666351886132,
+    "updated": 1666351886132
   }
 }

package/icons/index.d.ts

@@ -282,6 +282,8 @@ import heart_rate from "./heart_rate.js";
 import heart_rate_medium from "./heart_rate_medium.js";
 import hide from "./hide.js";
 import hide_medium from "./hide_medium.js";
+import hierarchy from "./hierarchy.js";
+import hierarchy_medium from "./hierarchy_medium.js";
 import history from "./history.js";
 import history_medium from "./history_medium.js";
 import home from "./home.js";
@@ -312,6 +314,8 @@ import language from "./language.js";
 import language_medium from "./language_medium.js";
 import launch from "./launch.js";
 import launch_medium from "./launch_medium.js";
+import layout_card from "./layout_card.js";
+import layout_card_medium from "./layout_card_medium.js";
 import leaf from "./leaf.js";
 import leaf_medium from "./leaf_medium.js";
 import lightbulb from "./lightbulb.js";
@@ -493,6 +497,8 @@ import travel from "./travel.js";
 import travel_medium from "./travel_medium.js";
 import undo from "./undo.js";
 import undo_medium from "./undo_medium.js";
+import unlock from "./unlock.js";
+import unlock_medium from "./unlock_medium.js";
 import upload from "./upload.js";
 import upload_medium from "./upload_medium.js";
 import user_feedback from "./user_feedback.js";
@@ -519,4 +525,4 @@ import widget_android from "./widget_android.js";
 import widget_android_medium from "./widget_android_medium.js";
 import widget_ios from "./widget_ios.js";
 import widget_ios_medium from "./widget_ios_medium.js";
-export { above_the_line, above_the_line_medium, account, account_card, account_card_medium, account_in, account_in_medium, account_medium, account_out, account_out_medium, account_percent, account_percent_medium, add, add_circled, add_circled_medium, add_medium, ainvoice, ainvoice_medium, ambulance, ambulance_medium, animal_print, animal_print_medium, apple_watch, apple_watch_medium, arrow_down, arrow_down_medium, arrow_left, arrow_left_medium, arrow_right, arrow_right_medium, arrow_up, arrow_up_medium, attachment, attachment_medium, baby, baby_medium, bandage, bandage_medium, bank, bank_medium, bankid, bankid_medium, bankid_mobile, bankid_mobile_medium, bankid_qr, bankid_qr_medium, bell, bell_medium, bicycle, bicycle_medium, boat, boat_medium, bookmark, bookmark_medium, bowling, bowling_medium, brickwall, brickwall_medium, broken_chain, broken_chain_medium, brush, brush_medium, bsu, bsu_medium, bubble, bubble_medium, building_construction, building_construction_medium, calculator, calculator_medium, calendar, calendar_cancel, calendar_cancel_medium, calendar_medium, camera, camera_medium, camper_trailer, camper_trailer_medium, car_1, car_1_medium, car_2, car_2_medium, caravan, caravan_medium, card, card_in, card_in_medium, card_medium, card_out, card_out_medium, card_with_padlock, card_with_padlock_medium, cat, cat_medium, chain, chain_medium, charger, charger_medium, chat, chat_medium, chatbot, chatbot_medium, check, check_medium, chevron_down, chevron_down_medium, chevron_left, chevron_left_medium, chevron_right, chevron_right_medium, chevron_up, chevron_up_medium, chip, chip_medium, clock, clock_medium, close, close_medium, cloud, cloud_download, cloud_download_medium, cloud_medium, cloud_rain, cloud_rain_medium, cloud_sync, cloud_sync_medium, cloud_transfer, cloud_transfer_medium, cloud_upload, cloud_upload_medium, cog, cog_medium, coins_1, coins_1_medium, coins_2, coins_2_medium, coins_3, coins_3_medium, compose, compose_medium, confetti, confetti_medium, contacts, contacts_medium, cookie, cookie_medium, copy, copy_medium, credit_note, credit_note_medium, currency, currency_medium, customer_service, customer_service_medium, deleted_invoice, deleted_invoice_medium, diamond, diamond_medium, digipass, digipass_medium, digipost, digipost_medium, dismiss_keyboard, dismiss_keyboard_medium, document, document_add, document_add_medium, document_contract, document_contract_medium, document_csv, document_csv_medium, document_loupe, document_loupe_medium, document_medium, document_pdf, document_pdf_medium, document_rejected, document_rejected_medium, document_signing, document_signing_medium, document_txt, document_txt_medium, document_warning, document_warning_medium, document_word, document_word_medium, document_xls, document_xls_medium, dog, dog_medium, download, download_medium, edit, edit_medium, einvoice, einvoice_medium, email, email_medium, equities_and_mutual_funds, equities_and_mutual_funds_medium, exclamation, exclamation_circled, exclamation_circled_medium, exclamation_medium, exclamation_triangle, exclamation_triangle_medium, facebook, facebook_medium, factory, factory_medium, file, file_add, file_add_medium, file_contract, file_contract_medium, file_csv, file_csv_medium, file_jpg, file_jpg_medium, file_loupe, file_loupe_medium, file_medium, file_pdf, file_pdf_medium, file_png, file_png_medium, file_ppt, file_ppt_medium, file_rejected, file_rejected_medium, file_signing, file_signing_medium, file_txt, file_txt_medium, file_warning, file_warning_medium, file_word, file_word_medium, file_xls, file_xls_medium, file_xml, file_xml_medium, filter, filter_medium, first_aid, first_aid_medium, fish, fish_medium, flying_money, flying_money_medium, folder, folder_medium, fridge, fridge_medium, fullscreen, fullscreen_medium, fund_in, fund_out, funds, funds_in, funds_in_medium, funds_medium, funds_out, funds_out_medium, globe, globe_medium, grabber, grabber_medium, graph_decrease, graph_decrease_medium, graph_increase, graph_increase_medium, hamburger, hamburger_medium, hand_money, hand_money_medium, hanger, hanger_medium, heart, heart_medium, heart_rate, heart_rate_medium, hide, hide_medium, history, history_medium, home, home_medium, horse, horse_medium, hourglass, hourglass_medium, house_1, house_1_medium, house_2, house_2_medium, house_value, house_value_medium, information, information_bubble, information_bubble_medium, information_circled, information_circled_medium, information_medium, instagram, instagram_medium, insurance, insurance_medium, kid_number, kid_number_medium, language, language_medium, launch, launch_medium, leaf, leaf_medium, lightbulb, lightbulb_medium, linkedin, linkedin_medium, list, list_medium, loan, loan_in, loan_in_medium, loan_medium, loan_out, loan_out_medium, location, location_medium, log_in, log_in_medium, log_out, log_out_medium, loupe, loupe_medium, mastercard, mastercard_card, mastercard_card_medium, mastercard_medium, megaphone, megaphone_medium, microphone, microphone_medium, minimize, minimize_medium, mobilephone, mobilephone_medium, more, more_medium, more_vertical, more_vertical_medium, motorcycle, motorcycle_medium, move, move_medium, news, news_medium, newspaper, newspaper_medium, office_buildings, office_buildings_medium, oil, oil_medium, owl, owl_medium, padlock, padlock_medium, paperclip, paperclip_medium, paragraph, paragraph_medium, pause, pause_medium, pay_from, pay_from_medium, pension, pension_medium, people_1, people_1_medium, people_2, people_2_medium, person, person_medium, person_shield, person_shield_medium, phone, phone_medium, photo, photo_medium, pin, pin_code, pin_code_medium, pin_medium, plant, plant_medium, play, play_medium, podcast, podcast_medium, printer, printer_medium, products_account_percent_medium, profile, profile_medium, progress, progress_medium, question, question_circled, question_circled_medium, question_medium, recurring, recurring_medium, redo, redo_medium, ref_number, ref_number_medium, refresh, refresh_medium, reply, reply_medium, reset, reset_medium, restaurant, restaurant_medium, return_1, return_1_medium, save, save_medium, savings_account, savings_account_in, savings_account_in_medium, savings_account_medium, savings_account_out, savings_account_out_medium, scissors, scissors_medium, scooter, scooter_medium, send, send_medium, share_android, share_android_medium, share_ios, share_ios_medium, shield, shield_medium, shopping_cart, shopping_cart_medium, snowmobile, snowmobile_medium, sort, sort_medium, speedometer, speedometer_medium, split, split_medium, star, star_medium, stocks, stocks_medium, stop, stop_medium, stopwatch, stopwatch_medium, subtract, subtract_circled, subtract_circled_medium, subtract_medium, support, support_medium, swap, swap_medium, tag, tag_medium, thumbs_down, thumbs_down_medium, thumbs_up, thumbs_up_medium, tractor, tractor_medium, trailer, trailer_medium, train, train_medium, transfer, transfer_medium, transfer_to, transfer_to_medium, trash, trash_medium, travel, travel_medium, undo, undo_medium, upload, upload_medium, user_feedback, user_feedback_medium, video, video_medium, view, view_medium, vintage_car, vintage_car_medium, volume_off, volume_off_medium, volume_on, volume_on_medium, wallet, wallet_medium, wearables, wearables_medium, web, web_medium, wheelchair, wheelchair_medium, widget_android, widget_android_medium, widget_ios, widget_ios_medium };
+export { above_the_line, above_the_line_medium, account, account_card, account_card_medium, account_in, account_in_medium, account_medium, account_out, account_out_medium, account_percent, account_percent_medium, add, add_circled, add_circled_medium, add_medium, ainvoice, ainvoice_medium, ambulance, ambulance_medium, animal_print, animal_print_medium, apple_watch, apple_watch_medium, arrow_down, arrow_down_medium, arrow_left, arrow_left_medium, arrow_right, arrow_right_medium, arrow_up, arrow_up_medium, attachment, attachment_medium, baby, baby_medium, bandage, bandage_medium, bank, bank_medium, bankid, bankid_medium, bankid_mobile, bankid_mobile_medium, bankid_qr, bankid_qr_medium, bell, bell_medium, bicycle, bicycle_medium, boat, boat_medium, bookmark, bookmark_medium, bowling, bowling_medium, brickwall, brickwall_medium, broken_chain, broken_chain_medium, brush, brush_medium, bsu, bsu_medium, bubble, bubble_medium, building_construction, building_construction_medium, calculator, calculator_medium, calendar, calendar_cancel, calendar_cancel_medium, calendar_medium, camera, camera_medium, camper_trailer, camper_trailer_medium, car_1, car_1_medium, car_2, car_2_medium, caravan, caravan_medium, card, card_in, card_in_medium, card_medium, card_out, card_out_medium, card_with_padlock, card_with_padlock_medium, cat, cat_medium, chain, chain_medium, charger, charger_medium, chat, chat_medium, chatbot, chatbot_medium, check, check_medium, chevron_down, chevron_down_medium, chevron_left, chevron_left_medium, chevron_right, chevron_right_medium, chevron_up, chevron_up_medium, chip, chip_medium, clock, clock_medium, close, close_medium, cloud, cloud_download, cloud_download_medium, cloud_medium, cloud_rain, cloud_rain_medium, cloud_sync, cloud_sync_medium, cloud_transfer, cloud_transfer_medium, cloud_upload, cloud_upload_medium, cog, cog_medium, coins_1, coins_1_medium, coins_2, coins_2_medium, coins_3, coins_3_medium, compose, compose_medium, confetti, confetti_medium, contacts, contacts_medium, cookie, cookie_medium, copy, copy_medium, credit_note, credit_note_medium, currency, currency_medium, customer_service, customer_service_medium, deleted_invoice, deleted_invoice_medium, diamond, diamond_medium, digipass, digipass_medium, digipost, digipost_medium, dismiss_keyboard, dismiss_keyboard_medium, document, document_add, document_add_medium, document_contract, document_contract_medium, document_csv, document_csv_medium, document_loupe, document_loupe_medium, document_medium, document_pdf, document_pdf_medium, document_rejected, document_rejected_medium, document_signing, document_signing_medium, document_txt, document_txt_medium, document_warning, document_warning_medium, document_word, document_word_medium, document_xls, document_xls_medium, dog, dog_medium, download, download_medium, edit, edit_medium, einvoice, einvoice_medium, email, email_medium, equities_and_mutual_funds, equities_and_mutual_funds_medium, exclamation, exclamation_circled, exclamation_circled_medium, exclamation_medium, exclamation_triangle, exclamation_triangle_medium, facebook, facebook_medium, factory, factory_medium, file, file_add, file_add_medium, file_contract, file_contract_medium, file_csv, file_csv_medium, file_jpg, file_jpg_medium, file_loupe, file_loupe_medium, file_medium, file_pdf, file_pdf_medium, file_png, file_png_medium, file_ppt, file_ppt_medium, file_rejected, file_rejected_medium, file_signing, file_signing_medium, file_txt, file_txt_medium, file_warning, file_warning_medium, file_word, file_word_medium, file_xls, file_xls_medium, file_xml, file_xml_medium, filter, filter_medium, first_aid, first_aid_medium, fish, fish_medium, flying_money, flying_money_medium, folder, folder_medium, fridge, fridge_medium, fullscreen, fullscreen_medium, fund_in, fund_out, funds, funds_in, funds_in_medium, funds_medium, funds_out, funds_out_medium, globe, globe_medium, grabber, grabber_medium, graph_decrease, graph_decrease_medium, graph_increase, graph_increase_medium, hamburger, hamburger_medium, hand_money, hand_money_medium, hanger, hanger_medium, heart, heart_medium, heart_rate, heart_rate_medium, hide, hide_medium, hierarchy, hierarchy_medium, history, history_medium, home, home_medium, horse, horse_medium, hourglass, hourglass_medium, house_1, house_1_medium, house_2, house_2_medium, house_value, house_value_medium, information, information_bubble, information_bubble_medium, information_circled, information_circled_medium, information_medium, instagram, instagram_medium, insurance, insurance_medium, kid_number, kid_number_medium, language, language_medium, launch, launch_medium, layout_card, layout_card_medium, leaf, leaf_medium, lightbulb, lightbulb_medium, linkedin, linkedin_medium, list, list_medium, loan, loan_in, loan_in_medium, loan_medium, loan_out, loan_out_medium, location, location_medium, log_in, log_in_medium, log_out, log_out_medium, loupe, loupe_medium, mastercard, mastercard_card, mastercard_card_medium, mastercard_medium, megaphone, megaphone_medium, microphone, microphone_medium, minimize, minimize_medium, mobilephone, mobilephone_medium, more, more_medium, more_vertical, more_vertical_medium, motorcycle, motorcycle_medium, move, move_medium, news, news_medium, newspaper, newspaper_medium, office_buildings, office_buildings_medium, oil, oil_medium, owl, owl_medium, padlock, padlock_medium, paperclip, paperclip_medium, paragraph, paragraph_medium, pause, pause_medium, pay_from, pay_from_medium, pension, pension_medium, people_1, people_1_medium, people_2, people_2_medium, person, person_medium, person_shield, person_shield_medium, phone, phone_medium, photo, photo_medium, pin, pin_code, pin_code_medium, pin_medium, plant, plant_medium, play, play_medium, podcast, podcast_medium, printer, printer_medium, products_account_percent_medium, profile, profile_medium, progress, progress_medium, question, question_circled, question_circled_medium, question_medium, recurring, recurring_medium, redo, redo_medium, ref_number, ref_number_medium, refresh, refresh_medium, reply, reply_medium, reset, reset_medium, restaurant, restaurant_medium, return_1, return_1_medium, save, save_medium, savings_account, savings_account_in, savings_account_in_medium, savings_account_medium, savings_account_out, savings_account_out_medium, scissors, scissors_medium, scooter, scooter_medium, send, send_medium, share_android, share_android_medium, share_ios, share_ios_medium, shield, shield_medium, shopping_cart, shopping_cart_medium, snowmobile, snowmobile_medium, sort, sort_medium, speedometer, speedometer_medium, split, split_medium, star, star_medium, stocks, stocks_medium, stop, stop_medium, stopwatch, stopwatch_medium, subtract, subtract_circled, subtract_circled_medium, subtract_medium, support, support_medium, swap, swap_medium, tag, tag_medium, thumbs_down, thumbs_down_medium, thumbs_up, thumbs_up_medium, tractor, tractor_medium, trailer, trailer_medium, train, train_medium, transfer, transfer_medium, transfer_to, transfer_to_medium, trash, trash_medium, travel, travel_medium, undo, undo_medium, unlock, unlock_medium, upload, upload_medium, user_feedback, user_feedback_medium, video, video_medium, view, view_medium, vintage_car, vintage_car_medium, volume_off, volume_off_medium, volume_on, volume_on_medium, wallet, wallet_medium, wearables, wearables_medium, web, web_medium, wheelchair, wheelchair_medium, widget_android, widget_android_medium, widget_ios, widget_ios_medium };