@dnb/eufemia 9.18.0 → 9.19.0

package/CHANGELOG.md

@@ -3,6 +3,40 @@
 All notable changes to @dnb/eufemia will be documented in this file. See
 [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [9.19.0](https://github.com/dnbexperience/eufemia/compare/v9.18.0...v9.19.0) (2022-01-26)
+
+
+### Bug Fixes
+
+* add "unstyled" as a button variant ([8cb0712](https://github.com/dnbexperience/eufemia/commit/8cb07126120e1013d7784bc3b88de2b2b6bbd7cc))
+* added export of Bar in Pagination ([#1200](https://github.com/dnbexperience/eufemia/issues/1200)) ([f148786](https://github.com/dnbexperience/eufemia/commit/f148786cad324f55ce34a91df811b1b14eccbf62))
+* **Avatar:** improve accessibility ([#1213](https://github.com/dnbexperience/eufemia/issues/1213)) ([3a456c5](https://github.com/dnbexperience/eufemia/commit/3a456c54c18cf1337357229c268f019302d5d527))
+* **Breadcrumb:** forward props in BreadcrumbItem to span as well ([#1188](https://github.com/dnbexperience/eufemia/issues/1188)) ([17a1de0](https://github.com/dnbexperience/eufemia/commit/17a1de0b361bffa667c9bd3fe88fb202951aaf91))
+* **Breadcrumb:** improve accessibility ([#1189](https://github.com/dnbexperience/eufemia/issues/1189)) ([59825b8](https://github.com/dnbexperience/eufemia/commit/59825b88d99148d5e26a8f638ad39507e4661bc3))
+* **build:** break build when step fails ([cb436d3](https://github.com/dnbexperience/eufemia/commit/cb436d3e5b33ba0bee91aad549efb476393ad93f))
+* **CodeHighlighting:** ensure a scrollbar is shown when not enough space is available ([634df1b](https://github.com/dnbexperience/eufemia/commit/634df1bcf437c388b3bca223d02057cbe542ab8d))
+* **DrawerList:** ensure DrawerList is unsetting its global attributes on unmount ([d64ccf8](https://github.com/dnbexperience/eufemia/commit/d64ccf8dbffe358955a236db136778e9c7f25bec))
+* fix circular dependency issue for Timeline and Avatar ([439ccc3](https://github.com/dnbexperience/eufemia/commit/439ccc3ec8ce612b790e71fc14664283a751251f))
+* fix rendering of DatePickerFooter when show_reset_button is provided ([#1197](https://github.com/dnbexperience/eufemia/issues/1197)) ([d7d4507](https://github.com/dnbexperience/eufemia/commit/d7d45078508378383d1d2c3415cb13e4867759ce))
+* fix reset_button_text property of DatePicker ([#1196](https://github.com/dnbexperience/eufemia/issues/1196)) ([e50fb6f](https://github.com/dnbexperience/eufemia/commit/e50fb6f56b9b3f0b7e808315419f1da4b53c8f03))
+* fixed global context bug that removed component props ([#1193](https://github.com/dnbexperience/eufemia/issues/1193)) ([82be98c](https://github.com/dnbexperience/eufemia/commit/82be98cb8da63376f1f9a9550479b44df0cb928c))
+* **Tag:** fix circular dependency issue when bundling UMD modules with Rollup.js ([d155f7c](https://github.com/dnbexperience/eufemia/commit/d155f7c4740c3afc950f8e2b8cd9cb5494c3e7ec))
+* **Tag:** remove data-prop from TagGroup ([#1225](https://github.com/dnbexperience/eufemia/issues/1225)) ([72e4207](https://github.com/dnbexperience/eufemia/commit/72e4207835d6882a796b83aac3c96c3d0b36fbc0))
+* **Tag:** remove tag group warnings in tests ([#1214](https://github.com/dnbexperience/eufemia/issues/1214)) ([16bd840](https://github.com/dnbexperience/eufemia/commit/16bd8403fa7673962afa9309cb2f089569a5406b))
+* **Tag:** update delete icon ([#1224](https://github.com/dnbexperience/eufemia/issues/1224)) ([fe5c766](https://github.com/dnbexperience/eufemia/commit/fe5c7660bcd79fce3af48b41444dd3738d527890))
+
+
+### Features
+
+* add Avatar component ([#1191](https://github.com/dnbexperience/eufemia/issues/1191)) ([6a30523](https://github.com/dnbexperience/eufemia/commit/6a30523484c2802069e64b716ff2d61e6dc64338))
+* add AvatarGroup component ([#1195](https://github.com/dnbexperience/eufemia/issues/1195)) ([ae5ef7d](https://github.com/dnbexperience/eufemia/commit/ae5ef7d758314b189640e00690f78e40a825cf38))
+* add InfoCard component ([5db0cbc](https://github.com/dnbexperience/eufemia/commit/5db0cbce2c73949d2b80d8cd9b96da5579708bba))
+* add TagGroup component ([#1208](https://github.com/dnbexperience/eufemia/issues/1208)) ([781007d](https://github.com/dnbexperience/eufemia/commit/781007de4ce30cf47def8f750956e280f1633956))
+* add TimeLine component ([#1186](https://github.com/dnbexperience/eufemia/issues/1186)) ([255a14e](https://github.com/dnbexperience/eufemia/commit/255a14ea0e1037468f9d757564b1ce658d341c52))
+* remove type="module" in order omit the "fullySpecified" spec ([b424e08](https://github.com/dnbexperience/eufemia/commit/b424e0882fd091afa61a27340c0a0f7f0010f4e7))
+* **Tag:** Add onClick prop ([db68b30](https://github.com/dnbexperience/eufemia/commit/db68b3059cf53093effbf584ef0f9d1edfacfefe))
+* **Tag:** add onDelete-prop ([#1217](https://github.com/dnbexperience/eufemia/issues/1217)) ([2f1642b](https://github.com/dnbexperience/eufemia/commit/2f1642b080d257474a4c56681eb0ad45807bfe1e))
+
 # [9.18.0](https://github.com/dnbexperience/eufemia/compare/v9.17.2...v9.18.0) (2021-12-16)
 
 

package/cjs/components/Avatar.d.ts

@@ -0,0 +1,14 @@
+/**
+ * ATTENTION: This file is auto generated by using "prepareTemplates".
+ * Do not change the content!
+ *
+ */
+
+/**
+ * Library Index avatar to autogenerate all the components and extensions
+ * Used by "prepareAvatars"
+ */
+
+import Avatar from './avatar/Avatar'
+export * from './avatar/Avatar'
+export default Avatar

package/cjs/components/Avatar.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); }
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+require("core-js/modules/web.dom-collections.for-each.js");
+
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.symbol.js");
+
+require("core-js/modules/es.symbol.description.js");
+
+require("core-js/modules/es.symbol.iterator.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports.default = void 0;
+
+var _Avatar = _interopRequireWildcard(require("./avatar/Avatar"));
+
+Object.keys(_Avatar).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Avatar[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Avatar[key];
+    }
+  });
+});
+
+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; }
+
+var _default = _Avatar.default;
+exports.default = _default;

package/cjs/components/InfoCard.d.ts

@@ -0,0 +1,14 @@
+/**
+ * ATTENTION: This file is auto generated by using "prepareTemplates".
+ * Do not change the content!
+ *
+ */
+
+/**
+ * Library Index info-card to autogenerate all the components and extensions
+ * Used by "prepareInfoCards"
+ */
+
+import InfoCard from './info-card/InfoCard'
+export * from './info-card/InfoCard'
+export default InfoCard

package/cjs/components/InfoCard.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); }
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+require("core-js/modules/web.dom-collections.for-each.js");
+
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.symbol.js");
+
+require("core-js/modules/es.symbol.description.js");
+
+require("core-js/modules/es.symbol.iterator.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports.default = void 0;
+
+var _InfoCard = _interopRequireWildcard(require("./info-card/InfoCard"));
+
+Object.keys(_InfoCard).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _InfoCard[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _InfoCard[key];
+    }
+  });
+});
+
+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; }
+
+var _default = _InfoCard.default;
+exports.default = _default;

package/cjs/components/Timeline.d.ts

@@ -0,0 +1,14 @@
+/**
+ * ATTENTION: This file is auto generated by using "prepareTemplates".
+ * Do not change the content!
+ *
+ */
+
+/**
+ * Library Index timeline to autogenerate all the components and extensions
+ * Used by "prepareTimelines"
+ */
+
+import Timeline from './timeline/Timeline'
+export * from './timeline/Timeline'
+export default Timeline

package/cjs/components/Timeline.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); }
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+require("core-js/modules/web.dom-collections.for-each.js");
+
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.symbol.js");
+
+require("core-js/modules/es.symbol.description.js");
+
+require("core-js/modules/es.symbol.iterator.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports.default = void 0;
+
+var _Timeline = _interopRequireWildcard(require("./timeline/Timeline"));
+
+Object.keys(_Timeline).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Timeline[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Timeline[key];
+    }
+  });
+});
+
+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; }
+
+var _default = _Timeline.default;
+exports.default = _default;

package/cjs/components/autocomplete/Autocomplete.d.ts

@@ -440,7 +440,7 @@ export interface AutocompleteProps extends React.HTMLProps<HTMLElement> {
   input_element?: AutocompleteInputElement;
 
   /**
-   * The data we want to fill the list with. Provide the data as a `JSON string`, `array` or `object` in these <a href="/uilib/components/fragments/drawer-list/info#data-structure">data structure</a>. <br /> If you don&#39;t have to define a `value`, you can also send in a `function` which will be called once the user opens the DrawerList.
+   * <em>(required)</em> the data we want to fill the list with. Provide the data as a `JSON string`, `array` or `object` in these <a href="/uilib/components/fragments/drawer-list/info#data-structure">data structure</a>. <br /> If you don&#39;t have to define a `value`, you can also send in a `function` which will be called once the user opens the DrawerList.
    */
   data?: AutocompleteData;
 
@@ -513,7 +513,7 @@ export interface AutocompleteProps extends React.HTMLProps<HTMLElement> {
   className?: string;
 
   /**
-   * The data we want to fill the list with. Provide the data as a `JSON string`, `array` or `object` in these <a href="/uilib/components/fragments/drawer-list/info#data-structure">data structure</a>. <br /> If you don&#39;t have to define a `value`, you can also send in a `function` which will be called once the user opens the DrawerList.
+   * <em>(required)</em> the data we want to fill the list with. Provide the data as a `JSON string`, `array` or `object` in these <a href="/uilib/components/fragments/drawer-list/info#data-structure">data structure</a>. <br /> If you don&#39;t have to define a `value`, you can also send in a `function` which will be called once the user opens the DrawerList.
    */
   children?: AutocompleteChildren;
   custom_element?: Object;

package/cjs/components/avatar/Avatar.js

@@ -0,0 +1,149 @@
+"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); }
+
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.array.index-of.js");
+
+require("core-js/modules/es.symbol.js");
+
+require("core-js/modules/es.array.filter.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+require("core-js/modules/web.dom-collections.for-each.js");
+
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+
+require("core-js/modules/es.object.assign.js");
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.symbol.description.js");
+
+require("core-js/modules/es.symbol.iterator.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "AvatarGroup", {
+  enumerable: true,
+  get: function get() {
+    return _AvatarGroup.default;
+  }
+});
+exports.defaultProps = exports.default = void 0;
+
+require("core-js/modules/es.array.concat.js");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _SpacingHelper = require("../space/SpacingHelper");
+
+var _SkeletonHelper = require("../skeleton/SkeletonHelper");
+
+var _Img = _interopRequireDefault(require("../../elements/Img"));
+
+var _Context = _interopRequireDefault(require("../../shared/Context"));
+
+var _componentHelper = require("../../shared/component-helper");
+
+var _AvatarGroup = _interopRequireWildcard(require("./AvatarGroup"));
+
+var _excluded = ["alt", "className", "children", "size", "skeleton", "variant", "src", "imgProps"];
+
+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 _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+var defaultProps = {
+  alt: null,
+  className: null,
+  size: 'medium',
+  src: null,
+  imgProps: null,
+  variant: 'primary',
+  skeleton: false,
+  children: null
+};
+exports.defaultProps = defaultProps;
+
+function Avatar(localProps) {
+  var context = _react.default.useContext(_Context.default);
+
+  var avatarGroupContext = _react.default.useContext(_AvatarGroup.AvatarGroupContext);
+
+  var _extendPropsWithConte = (0, _componentHelper.extendPropsWithContext)(_objectSpread(_objectSpread({}, defaultProps), localProps), defaultProps, context === null || context === void 0 ? void 0 : context.Avatar, avatarGroupContext),
+      alt = _extendPropsWithConte.alt,
+      className = _extendPropsWithConte.className,
+      childrenProp = _extendPropsWithConte.children,
+      size = _extendPropsWithConte.size,
+      skeleton = _extendPropsWithConte.skeleton,
+      variant = _extendPropsWithConte.variant,
+      src = _extendPropsWithConte.src,
+      imgProps = _extendPropsWithConte.imgProps,
+      props = _objectWithoutProperties(_extendPropsWithConte, _excluded);
+
+  var children = null;
+  var skeletonClasses = (0, _SkeletonHelper.createSkeletonClass)('shape', skeleton, context);
+  var spacingClasses = (0, _SpacingHelper.createSpacingClasses)(props);
+  var childrenIsString = typeof childrenProp === 'string';
+
+  if (src || imgProps) {
+    var imageProps = _objectSpread({
+      src: src,
+      alt: alt
+    }, imgProps);
+
+    children = _react.default.createElement(_Img.default, imageProps);
+  } else if (childrenIsString) {
+    var firstLetterUpperCase = childrenProp.charAt(0).toUpperCase();
+    children = _react.default.createElement("span", {
+      "data-testid": "avatar-text",
+      "aria-hidden": true
+    }, firstLetterUpperCase);
+  } else {
+    children = childrenProp;
+  }
+
+  if (!avatarGroupContext) {
+    (0, _componentHelper.warn)("Avatar group required: An Avatar requires an Avatar.Group with label description as a parent component. This is to ensure correct semantic and accessibility.");
+  }
+
+  return _react.default.createElement("span", _extends({
+    className: (0, _classnames.default)("dnb-avatar dnb-avatar--".concat(variant || 'primary', " dnb-avatar--size-").concat(size || 'medium'), skeletonClasses, spacingClasses, className),
+    "data-testid": "avatar"
+  }, props), childrenIsString && _react.default.createElement("span", {
+    "data-testid": "avatar-label",
+    className: "dnb-sr-only"
+  }, childrenProp), children);
+}
+
+Avatar.Group = _AvatarGroup.default;
+var _default = Avatar;
+exports.default = _default;

package/cjs/components/avatar/AvatarGroup.js

@@ -0,0 +1,131 @@
+"use strict";
+
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.array.index-of.js");
+
+require("core-js/modules/es.symbol.js");
+
+require("core-js/modules/es.array.filter.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+require("core-js/modules/web.dom-collections.for-each.js");
+
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+
+require("core-js/modules/es.object.assign.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultProps = exports.default = exports.AvatarGroupContext = void 0;
+
+require("core-js/modules/es.array.map.js");
+
+require("core-js/modules/es.array.slice.js");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _SpacingHelper = require("../space/SpacingHelper");
+
+var _Context = _interopRequireDefault(require("../../shared/Context"));
+
+var _componentHelper = require("../../shared/component-helper");
+
+var _excluded = ["label", "className", "children", "size", "maxElements", "variant"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+var defaultProps = {
+  label: null,
+  className: null,
+  maxElements: 4,
+  size: 'medium',
+  children: null,
+  variant: 'primary'
+};
+exports.defaultProps = defaultProps;
+
+var AvatarGroupContext = _react.default.createContext(null);
+
+exports.AvatarGroupContext = AvatarGroupContext;
+
+function AvatarGroup(localProps) {
+  var context = _react.default.useContext(_Context.default);
+
+  var _extendPropsWithConte = (0, _componentHelper.extendPropsWithContext)(_objectSpread(_objectSpread({}, defaultProps), localProps), defaultProps, context === null || context === void 0 ? void 0 : context.AvatarGroup),
+      label = _extendPropsWithConte.label,
+      className = _extendPropsWithConte.className,
+      childrenProp = _extendPropsWithConte.children,
+      size = _extendPropsWithConte.size,
+      maxElementsProp = _extendPropsWithConte.maxElements,
+      variant = _extendPropsWithConte.variant,
+      props = _objectWithoutProperties(_extendPropsWithConte, _excluded);
+
+  var maxElements = maxElementsProp && maxElementsProp > 0 ? maxElementsProp : 4;
+  var children = childrenProp;
+  var numOfHiddenAvatars = 0;
+
+  if (Array.isArray(childrenProp)) {
+    var total = childrenProp.length;
+
+    if (total > maxElements) {
+      numOfHiddenAvatars = total - maxElements + 1;
+    }
+
+    children = childrenProp.slice(0, total - numOfHiddenAvatars).map(function (child, i) {
+      var appliedSize = child.props.size ? child.props.size : size;
+      var appliedVariant = child.props.variant ? child.props.variant : variant;
+      return _react.default.cloneElement(child, {
+        size: appliedSize,
+        variant: appliedVariant,
+        style: _objectSpread(_objectSpread({}, child.props.style), {}, {
+          zIndex: total - i
+        }),
+        key: i
+      });
+    });
+  }
+
+  var spacingClasses = (0, _SpacingHelper.createSpacingClasses)(props);
+  return _react.default.createElement(AvatarGroupContext.Provider, {
+    value: props
+  }, _react.default.createElement("span", _extends({
+    className: (0, _classnames.default)('dnb-avatar__group', spacingClasses, className),
+    "data-testid": "avatar-group"
+  }, props), _react.default.createElement("span", {
+    "data-testid": "avatar-group-label",
+    className: "dnb-sr-only"
+  }, label), children, numOfHiddenAvatars ? _react.default.createElement(ElementsHidden, {
+    size: size
+  }, "+", numOfHiddenAvatars) : null));
+}
+
+function ElementsHidden(props) {
+  var size = props.size,
+      children = props.children;
+  return _react.default.createElement("span", {
+    className: "dnb-avatar__group--elements-left dnb-avatar__group--elements-left--size-".concat(size || 'medium'),
+    "data-testid": "elements-left"
+  }, children);
+}
+
+var _default = AvatarGroup;
+exports.default = _default;

package/cjs/components/avatar/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Component Entry
+ *
+ */
+
+import Avatar from './Avatar'
+export default Avatar
+export * from './Avatar'

package/cjs/components/avatar/index.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); }
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+require("core-js/modules/web.dom-collections.for-each.js");
+
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.symbol.js");
+
+require("core-js/modules/es.symbol.description.js");
+
+require("core-js/modules/es.symbol.iterator.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports.default = void 0;
+
+var _Avatar = _interopRequireWildcard(require("./Avatar"));
+
+Object.keys(_Avatar).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Avatar[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Avatar[key];
+    }
+  });
+});
+
+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; }
+
+var _default = _Avatar.default;
+exports.default = _default;