@dnb/eufemia 9.19.0 → 9.20.0

package/cjs/components/breadcrumb/BreadcrumbItem.js

@@ -6,22 +6,12 @@ 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.default = BreadcrumbItem;
+exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -35,7 +25,7 @@ var _home = _interopRequireDefault(require("../../icons/home"));
 
 var _Context = _interopRequireDefault(require("../../shared/Context"));
 
-var _componentHelper = require("../../shared/component-helper");
+var _hooks = require("../../shared/hooks");
 
 var _excluded = ["text", "href", "icon", "onClick", "variant", "skeleton"];
 
@@ -43,12 +33,6 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 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; }
@@ -62,19 +46,19 @@ var defaultProps = {
   skeleton: null
 };
 
-function BreadcrumbItem(localProps) {
+var BreadcrumbItem = function BreadcrumbItem(localProps) {
   var context = _react.default.useContext(_Context.default);
 
   var homeText = context.translation.Breadcrumb.homeText;
 
-  var _extendPropsWithConte = (0, _componentHelper.extendPropsWithContext)(_objectSpread(_objectSpread({}, defaultProps), localProps), defaultProps, context === null || context === void 0 ? void 0 : context.BreadcrumbItem),
-      text = _extendPropsWithConte.text,
-      href = _extendPropsWithConte.href,
-      icon = _extendPropsWithConte.icon,
-      onClick = _extendPropsWithConte.onClick,
-      variant = _extendPropsWithConte.variant,
-      skeleton = _extendPropsWithConte.skeleton,
-      props = _objectWithoutProperties(_extendPropsWithConte, _excluded);
+  var _usePropsWithContext = (0, _hooks.usePropsWithContext)(localProps, defaultProps, context === null || context === void 0 ? void 0 : context.BreadcrumbItem),
+      text = _usePropsWithContext.text,
+      href = _usePropsWithContext.href,
+      icon = _usePropsWithContext.icon,
+      onClick = _usePropsWithContext.onClick,
+      variant = _usePropsWithContext.variant,
+      skeleton = _usePropsWithContext.skeleton,
+      props = _objectWithoutProperties(_usePropsWithContext, _excluded);
 
   var currentIcon = icon || variant === 'home' && _home.default || 'chevron_left';
   var currentText = text || variant === 'home' && homeText || '';
@@ -88,7 +72,6 @@ function BreadcrumbItem(localProps) {
     href: href,
     icon: currentIcon,
     icon_position: "left",
-    icon_: currentIcon,
     on_click: onClick,
     text: currentText,
     skeleton: skeleton
@@ -101,4 +84,7 @@ function BreadcrumbItem(localProps) {
     left: "0",
     "data-testid": "breadcrumb-item-text"
   }, currentText)));
-}
+};
+
+var _default = BreadcrumbItem;
+exports.default = _default;

package/cjs/components/button/Button.d.ts

@@ -1,15 +1,15 @@
 import * as React from 'react';
+import { SkeletonShow } from '../skeleton/Skeleton';
+import { IconPrimaryIcon } from '../icon-primary/IconPrimary';
 export type ButtonText = string | React.ReactNode;
 export type ButtonVariant =
   | 'primary'
   | 'secondary'
   | 'tertiary'
-  | 'signal';
+  | 'signal'
+  | 'unstyled';
 export type ButtonSize = 'default' | 'small' | 'medium' | 'large';
-export type ButtonIcon =
-  | string
-  | React.ReactNode
-  | ((...args: any[]) => any);
+export type ButtonIcon = IconPrimaryIcon;
 export type ButtonIconPosition = 'left' | 'right' | 'top';
 export type ButtonIconSize = string | number;
 export type ButtonTooltip =
@@ -26,7 +26,7 @@ export type ButtonTo = string | any | ((...args: any[]) => any);
 export type ButtonWrap = string | boolean;
 export type ButtonBounding = string | boolean;
 export type ButtonStretch = string | boolean;
-export type ButtonSkeleton = string | boolean;
+export type ButtonSkeleton = SkeletonShow;
 export type ButtonDisabled = string | boolean;
 export type ButtonChildren =
   | string
@@ -70,7 +70,11 @@ export type ButtonOnClick = string | ((...args: any[]) => any);
  * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
  */
 
-export interface ButtonProps extends React.HTMLProps<HTMLElement> {
+export interface ButtonProps
+  extends Omit<
+    React.HTMLProps<HTMLElement>,
+    'disabled' | 'size' | 'title' | 'wrap'
+  > {
   /**
    * The content of the button can be a string or a React Element.
    */

package/cjs/components/icon-primary/IconPrimary.d.ts

@@ -53,7 +53,8 @@ export type IconPrimaryChildren =
  * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
  */
 
-export interface IconPrimaryProps extends React.HTMLProps<HTMLElement> {
+export interface IconPrimaryProps
+  extends Omit<React.HTMLProps<HTMLElement>, 'size'> {
   /**
    * <em>(required)</em> a React SVG Component or the icon name (in case we use `IconPrimary` or `dnb-icon-primary`).
    */

package/cjs/components/info-card/InfoCard.js

@@ -47,7 +47,7 @@ var _SkeletonHelper = require("../skeleton/SkeletonHelper");
 
 var _Context = _interopRequireDefault(require("../../shared/Context"));
 
-var _componentHelper = require("../../shared/component-helper");
+var _hooks = require("../../shared/hooks");
 
 var _excluded = ["alt", "centered", "title", "skeleton", "className", "icon", "src", "imgProps", "text", "onClose", "onAccept", "closeButtonText", "acceptButtonText", "closeButtonAttributes", "acceptButtonAttributes"];
 
@@ -83,28 +83,28 @@ var defaultProps = {
 };
 exports.defaultProps = defaultProps;
 
-function InfoCard(localProps) {
+var InfoCard = function InfoCard(localProps) {
   var _IconPrimary;
 
   var context = _react.default.useContext(_Context.default);
 
-  var _extendPropsWithConte = (0, _componentHelper.extendPropsWithContext)(_objectSpread(_objectSpread({}, defaultProps), localProps)),
-      alt = _extendPropsWithConte.alt,
-      centered = _extendPropsWithConte.centered,
-      title = _extendPropsWithConte.title,
-      skeleton = _extendPropsWithConte.skeleton,
-      className = _extendPropsWithConte.className,
-      icon = _extendPropsWithConte.icon,
-      src = _extendPropsWithConte.src,
-      imgProps = _extendPropsWithConte.imgProps,
-      text = _extendPropsWithConte.text,
-      onClose = _extendPropsWithConte.onClose,
-      onAccept = _extendPropsWithConte.onAccept,
-      closeButtonText = _extendPropsWithConte.closeButtonText,
-      acceptButtonText = _extendPropsWithConte.acceptButtonText,
-      closeButtonAttributes = _extendPropsWithConte.closeButtonAttributes,
-      acceptButtonAttributes = _extendPropsWithConte.acceptButtonAttributes,
-      props = _objectWithoutProperties(_extendPropsWithConte, _excluded);
+  var _usePropsWithContext = (0, _hooks.usePropsWithContext)(_objectSpread(_objectSpread({}, defaultProps), localProps)),
+      alt = _usePropsWithContext.alt,
+      centered = _usePropsWithContext.centered,
+      title = _usePropsWithContext.title,
+      skeleton = _usePropsWithContext.skeleton,
+      className = _usePropsWithContext.className,
+      icon = _usePropsWithContext.icon,
+      src = _usePropsWithContext.src,
+      imgProps = _usePropsWithContext.imgProps,
+      text = _usePropsWithContext.text,
+      onClose = _usePropsWithContext.onClose,
+      onAccept = _usePropsWithContext.onAccept,
+      closeButtonText = _usePropsWithContext.closeButtonText,
+      acceptButtonText = _usePropsWithContext.acceptButtonText,
+      closeButtonAttributes = _usePropsWithContext.closeButtonAttributes,
+      acceptButtonAttributes = _usePropsWithContext.acceptButtonAttributes,
+      props = _objectWithoutProperties(_usePropsWithContext, _excluded);
 
   var skeletonClasses = (0, _SkeletonHelper.createSkeletonClass)('shape', skeleton, context);
   var spacingClasses = (0, _SpacingHelper.createSpacingClasses)(props);
@@ -137,14 +137,14 @@ function InfoCard(localProps) {
       className: 'dnb-info-card--buttons' + (centered ? " dnb-info-card--buttons-centered" : "")
     }, !acceptButtonIsHidden && _react.default.createElement(_Button.default, _extends({
       type: "button",
-      "data-testid": "into-card-accept-button",
+      "data-testid": "info-card-accept-button",
       variant: "secondary",
       right: !centered && 'small',
       on_click: onAccept,
       text: acceptButtonText
     }, acceptButtonAttributes)), !closeButtonIsHidden && _react.default.createElement(_Button.default, _extends({
       type: "button",
-      "data-testid": "into-card-close-button",
+      "data-testid": "info-card-close-button",
       variant: "tertiary",
       top: centered && 'small',
       on_click: onClose,
@@ -174,7 +174,7 @@ function InfoCard(localProps) {
       "data-testid": "info-card-icon"
     }));
   }
-}
+};
 
 var _default = InfoCard;
 exports.default = _default;

package/cjs/components/pagination/Pagination.d.ts

@@ -128,7 +128,7 @@ export interface PaginationProps extends React.HTMLProps<HTMLElement> {
   skeleton?: PaginationSkeleton;
 
   /**
-   * If set to `infinity`, then the pagination bar will be now shown and but infinity scrolling will do the content presentation. Defaults to `pagination`.
+   * If set to `infinity`, then the pagination bar will be now shown and but infinity scrolling will do the content presentation. For more information, check out the <a href="https://eufemia.dnb.no/uilib/components/pagination/infinity-scroller">Infinity Scroller</a>. Defaults to `pagination`.
    */
   mode?: PaginationMode;
 
@@ -214,7 +214,7 @@ export interface PaginationProps extends React.HTMLProps<HTMLElement> {
   is_loading_text?: string;
 
   /**
-   * Used during infinity mode. If `use_load_button` is set to true, then a button is show on the bottom. If the `startup_page` is higher than 1, . Defaults to `Vis mer innhold`.
+   * Used during infinity mode. If `use_load_button` is set to true, then a button is show on the bottom. If the `startup_page` is higher than 1. Defaults to `Vis mer innhold`.
    */
   load_button_text?: string;
 
@@ -406,7 +406,7 @@ export interface PaginationInstanceProps {
   skeleton?: PaginationInstanceSkeleton;
 
   /**
-   * If set to `infinity`, then the pagination bar will be now shown and but infinity scrolling will do the content presentation. Defaults to `pagination`.
+   * If set to `infinity`, then the pagination bar will be now shown and but infinity scrolling will do the content presentation. For more information, check out the <a href="https://eufemia.dnb.no/uilib/components/pagination/infinity-scroller">Infinity Scroller</a>. Defaults to `pagination`.
    */
   mode?: PaginationInstanceMode;
 
@@ -492,7 +492,7 @@ export interface PaginationInstanceProps {
   is_loading_text?: string;
 
   /**
-   * Used during infinity mode. If `use_load_button` is set to true, then a button is show on the bottom. If the `startup_page` is higher than 1, . Defaults to `Vis mer innhold`.
+   * Used during infinity mode. If `use_load_button` is set to true, then a button is show on the bottom. If the `startup_page` is higher than 1. Defaults to `Vis mer innhold`.
    */
   load_button_text?: string;
 
@@ -686,7 +686,7 @@ export interface InfinityMarkerProps {
   skeleton?: InfinityMarkerSkeleton;
 
   /**
-   * If set to `infinity`, then the pagination bar will be now shown and but infinity scrolling will do the content presentation. Defaults to `pagination`.
+   * If set to `infinity`, then the pagination bar will be now shown and but infinity scrolling will do the content presentation. For more information, check out the <a href="https://eufemia.dnb.no/uilib/components/pagination/infinity-scroller">Infinity Scroller</a>. Defaults to `pagination`.
    */
   mode?: InfinityMarkerMode;
 
@@ -772,7 +772,7 @@ export interface InfinityMarkerProps {
   is_loading_text?: string;
 
   /**
-   * Used during infinity mode. If `use_load_button` is set to true, then a button is show on the bottom. If the `startup_page` is higher than 1, . Defaults to `Vis mer innhold`.
+   * Used during infinity mode. If `use_load_button` is set to true, then a button is show on the bottom. If the `startup_page` is higher than 1. Defaults to `Vis mer innhold`.
    */
   load_button_text?: string;
 

package/cjs/components/pagination/Pagination.js

@@ -267,13 +267,13 @@ var PaginationInstance = function (_React$PureComponent2) {
           var pageNumber = _ref.pageNumber;
           return pageNumber === currentPage;
         })) === null || _items$find === void 0 ? void 0 : _items$find.content;
-        return _react.default.createElement(_react.default.Fragment, null, this.context.pagination.mode === 'infinity' && typeof children !== 'function' && children, _react.default.createElement("div", mainParams, _react.default.createElement(_PaginationBar.default, {
+        return _react.default.createElement("div", mainParams, _react.default.createElement(_PaginationBar.default, {
           contentRef: this._contentRef
         }, children), items.length > 0 && _react.default.createElement(PaginationContent, {
           ref: this._contentRef
         }, content || _react.default.createElement(_PaginationHelpers.PaginationIndicator, {
           indicator_element: indicator_element || fallback_element
-        }))));
+        })));
       }
 
       return _InfinityScroller || (_InfinityScroller = _react.default.createElement(_PaginationInfinity.default, null));

package/cjs/components/skeleton/Skeleton.d.ts

@@ -39,10 +39,10 @@ export type SkeletonChildren =
   | string
   | ((...args: any[]) => any)
   | React.ReactNode;
-
 /**
  * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
  */
+
 export interface SkeletonProps extends React.HTMLProps<HTMLElement> {
   /**
    * Use `true` to enable/show the skeleton for the component used inside. Defaults to `false`.

package/cjs/components/skeleton/SkeletonHelper.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { SkeletonShow } from './Skeleton';
 export interface AutoSizeProps {
   __element?: React.ReactNode;
   children?: React.ReactNode;
@@ -20,7 +21,7 @@ export interface SkeletonContextProps {
 }
 export const createSkeletonClass: (
   method: 'shape' | 'font',
-  skeleton: boolean,
+  skeleton: SkeletonShow,
   context?: SkeletonContextProps
 ) => React.HTMLProps<HTMLElement>;
 export interface skeletonDOMAttributesContext {

package/cjs/components/step-indicator/StepIndicatorTriggerButton.js

@@ -122,6 +122,8 @@ var StepIndicatorTriggerButton = function (_React$PureComponent) {
     key: "componentDidMount",
     value: function componentDidMount() {
       this._heightAnim.setElement(this._buttonRef.current);
+
+      this._prevStep = this.context.activeStep;
     }
   }, {
     key: "componentWillUnmount",
@@ -134,12 +136,10 @@ var StepIndicatorTriggerButton = function (_React$PureComponent) {
       if (this._prevStep !== this.context.activeStep) {
         var toHeight = this._heightAnim.getUnknownHeight();
 
-        this._heightAnim.adjustFrom(height);
-
         this._heightAnim.adjustTo(height, toHeight);
-      }
 
-      this._prevStep = this.context.activeStep;
+        this._prevStep = this.context.activeStep;
+      }
     }
   }, {
     key: "render",

package/cjs/components/tag/Tag.js

@@ -6,16 +6,6 @@ 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", {
@@ -35,6 +25,8 @@ var _Context = _interopRequireDefault(require("../../shared/Context"));
 
 var _componentHelper = require("../../shared/component-helper");
 
+var _hooks = require("../../shared/hooks");
+
 var _TagGroup = _interopRequireDefault(require("./TagGroup"));
 
 var _TagContext = require("./TagContext");
@@ -47,12 +39,6 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 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; }
@@ -76,15 +62,15 @@ var Tag = function Tag(localProps) {
 
   var tagGroupContext = _react.default.useContext(_TagContext.TagGroupContext);
 
-  var _extendPropsWithConte = (0, _componentHelper.extendPropsWithContext)(_objectSpread(_objectSpread({}, defaultProps), localProps), defaultProps, context === null || context === void 0 ? void 0 : (_context$translation = context.translation) === null || _context$translation === void 0 ? void 0 : _context$translation.Tag, context === null || context === void 0 ? void 0 : context.Tag, tagGroupContext),
-      className = _extendPropsWithConte.className,
-      skeleton = _extendPropsWithConte.skeleton,
-      children = _extendPropsWithConte.children,
-      text = _extendPropsWithConte.text,
-      onClick = _extendPropsWithConte.onClick,
-      onDelete = _extendPropsWithConte.onDelete,
-      omitOnKeyUpDeleteEvent = _extendPropsWithConte.omitOnKeyUpDeleteEvent,
-      props = _objectWithoutProperties(_extendPropsWithConte, _excluded);
+  var _usePropsWithContext = (0, _hooks.usePropsWithContext)(localProps, defaultProps, context === null || context === void 0 ? void 0 : (_context$translation = context.translation) === null || _context$translation === void 0 ? void 0 : _context$translation.Tag, context === null || context === void 0 ? void 0 : context.Tag, tagGroupContext),
+      className = _usePropsWithContext.className,
+      skeleton = _usePropsWithContext.skeleton,
+      children = _usePropsWithContext.children,
+      text = _usePropsWithContext.text,
+      onClick = _usePropsWithContext.onClick,
+      onDelete = _usePropsWithContext.onDelete,
+      omitOnKeyUpDeleteEvent = _usePropsWithContext.omitOnKeyUpDeleteEvent,
+      props = _objectWithoutProperties(_usePropsWithContext, _excluded);
 
   var content = text || children;
   var isClickable = !!onClick;
@@ -102,13 +88,15 @@ var Tag = function Tag(localProps) {
     }
   };
 
+  var buttonAttr = props;
+
   if (!isInteractive) {
-    props.element = 'span';
-    props.type = '';
+    buttonAttr.element = 'span';
+    buttonAttr.type = '';
   }
 
   if (isRemovable) {
-    props.icon = getDeleteIcon();
+    buttonAttr.icon = getDeleteIcon();
   }
 
   if (!tagGroupContext) {
@@ -127,7 +115,7 @@ var Tag = function Tag(localProps) {
     onKeyUp: isRemovable && !omitOnKeyUpDeleteEvent ? function (e) {
       return handleKeyUp(e);
     } : undefined
-  }, props));
+  }, buttonAttr));
 
   function getDeleteIcon() {
     return _IconPrimary || (_IconPrimary = _react.default.createElement(_IconPrimary2.default, {

package/cjs/components/tag/TagGroup.js

@@ -6,18 +6,10 @@ 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.symbol.description.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.symbol.description.js");
-
 require("core-js/modules/es.symbol.iterator.js");
 
 require("core-js/modules/es.array.iterator.js");
@@ -51,7 +43,7 @@ var _SpacingHelper = require("../space/SpacingHelper");
 
 var _Context = _interopRequireDefault(require("../../shared/Context"));
 
-var _componentHelper = require("../../shared/component-helper");
+var _hooks = require("../../shared/hooks");
 
 var _TagContext = require("./TagContext");
 
@@ -73,12 +65,6 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-function 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; }
@@ -90,14 +76,14 @@ var defaultProps = {
 };
 exports.defaultProps = defaultProps;
 
-function TagGroup(localProps) {
+var TagGroup = function TagGroup(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.TagGroup),
-      label = _extendPropsWithConte.label,
-      className = _extendPropsWithConte.className,
-      childrenProp = _extendPropsWithConte.children,
-      props = _objectWithoutProperties(_extendPropsWithConte, _excluded);
+  var _usePropsWithContext = (0, _hooks.usePropsWithContext)(localProps, defaultProps, context === null || context === void 0 ? void 0 : context.TagGroup),
+      label = _usePropsWithContext.label,
+      className = _usePropsWithContext.className,
+      childrenProp = _usePropsWithContext.children,
+      props = _objectWithoutProperties(_usePropsWithContext, _excluded);
 
   var children = childrenProp;
 
@@ -110,14 +96,14 @@ function TagGroup(localProps) {
   var spacingClasses = (0, _SpacingHelper.createSpacingClasses)(props);
   return _react.default.createElement(_TagContext.TagGroupContext.Provider, {
     value: props
-  }, _react.default.createElement("div", _extends({
+  }, _react.default.createElement("span", _extends({
     className: (0, _classnames.default)('dnb-tag__group', spacingClasses, className),
     "data-testid": "tag-group"
   }, props), _react.default.createElement("span", {
     "data-testid": "tag-group-label",
     className: "dnb-sr-only"
   }, label), children));
-}
+};
 
 var _default = TagGroup;
 exports.default = _default;