@dnb/eufemia 10.0.0 → 10.2.0

package/cjs/components/heading/HeadingCounter.d.ts

@@ -1,18 +1,42 @@
-export function initCounter(props?: any): any;
-export class Counter {
-    constructor(props?: any);
-    level: number;
-    entry: number;
+/**
+ * Web Heading Counter Instance
+ *
+ */
+import { HeadingAllProps, InternalHeadingLevel } from './Heading';
+export declare type HeadingCounter = Counter;
+export declare type HeadingDebugCounter = boolean | (() => void);
+export declare type ContextCounter = {
+    level: InternalHeadingLevel;
+    entry: InternalHeadingLevel;
+    countHeadings: number;
+    _initCount: number;
+    _isReady: boolean;
+    isGlobal?: boolean;
+};
+export declare const initCounter: (props?: CounterProps) => Counter;
+export declare type CounterGroup = HeadingAllProps['group'];
+export declare type CounterChildren = HeadingAllProps['children'];
+export declare type CounterProps = {
+    isGlobal?: boolean;
+    group?: CounterGroup;
+    children?: CounterChildren;
+    counter?: CounterProps;
+};
+export declare class Counter {
+    level: InternalHeadingLevel;
+    entry: InternalHeadingLevel;
+    lastResetLevel: InternalHeadingLevel;
     _isReady: boolean;
     countHeadings: number;
     _initCount: number;
     isGlobal: boolean;
     isHeading: boolean;
     bypassChecks: boolean;
-    contextCounter: any;
+    contextCounter: ContextCounter;
     reports: any[];
-    group: any;
-    children: any;
+    group: CounterGroup;
+    children: CounterChildren;
+    constructor(props?: CounterProps);
     report(...str: any[]): void;
     useLastReport(): any;
     enableBypassChecks(): void;
@@ -20,23 +44,23 @@ export class Counter {
     getLevel(): number;
     hasEntryLevel(): boolean;
     hasCorrection(): boolean;
-    setEntryLevel(level?: any): void;
+    setEntryLevel(level?: InternalHeadingLevel): void;
     isInContext(): boolean;
-    setContextCounter(contextCounter: any): void;
-    skipMakeMeReady(): void;
+    setContextCounter(contextCounter: ContextCounter): void;
     windup(): void;
     teardown(): void;
-    makeMeReady(): void;
+    makeMeReady({ level }?: {
+        level?: InternalHeadingLevel;
+    }): void;
     factorCheck({ action, level, current, report }: {
         action: any;
         level: any;
         current: any;
         report: any;
     }): any;
-    setLevel(level: any, action?: string): void;
+    setLevel(level: InternalHeadingLevel, action?: string): void;
     increment(): void;
     decrement(): void;
     force(level?: number): void;
     reset(toLevel?: any): void;
-    lastResetLevel: any;
 }

package/cjs/components/heading/HeadingCounter.js

@@ -19,7 +19,11 @@ const initCounter = function () {
     });
   }
 
-  return props && props.counter || new Counter(props);
+  if (props !== null && props !== void 0 && props.counter) {
+    return props.counter;
+  }
+
+  return new Counter(props);
 };
 
 exports.initCounter = initCounter;
@@ -32,6 +36,8 @@ class Counter {
 
     _defineProperty(this, "entry", 0);
 
+    _defineProperty(this, "lastResetLevel", null);
+
     _defineProperty(this, "_isReady", false);
 
     _defineProperty(this, "countHeadings", 0);
@@ -48,6 +54,10 @@ class Counter {
 
     _defineProperty(this, "reports", []);
 
+    _defineProperty(this, "group", null);
+
+    _defineProperty(this, "children", null);
+
     props = props || {};
 
     if (props.group) {
@@ -97,7 +107,7 @@ class Counter {
 
   setEntryLevel() {
     let level = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-    this.entry = parseFloat(level) || 1;
+    this.entry = parseFloat(String(level)) || 1;
   }
 
   isInContext() {
@@ -108,13 +118,6 @@ class Counter {
     this.contextCounter = contextCounter;
   }
 
-  skipMakeMeReady() {
-    this._isReady = true;
-    this.entry = 1;
-    this.level = 1;
-    this.contextCounter.entry = 2;
-  }
-
   windup() {
     this.contextCounter.countHeadings++;
   }
@@ -129,6 +132,10 @@ class Counter {
   }
 
   makeMeReady() {
+    let {
+      level
+    } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
     if (!this.hasCorrection()) {
       if (this.contextCounter.level > 1) {
         this.level = this.contextCounter.level;
@@ -139,7 +146,7 @@ class Counter {
       } else if (!this.contextCounter._isReady) {
         this.contextCounter._isReady = true;
 
-        if (!this.bypassChecks) {
+        if (!this.bypassChecks && !level) {
           this.level = 1;
         }
       }
@@ -191,19 +198,15 @@ class Counter {
     var _globalSyncCounter$cu;
 
     let action = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'set';
-    level = parseFloat(level);
+    level = parseFloat(String(level));
     const report = [];
 
-    if (!this._isReady && this.level === 1 && (!_HeadingHelpers.globalSyncCounter.current || _HeadingHelpers.globalSyncCounter.current.level < 2)) {
-      return;
-    }
-
     if (((_globalSyncCounter$cu = _HeadingHelpers.globalSyncCounter.current) === null || _globalSyncCounter$cu === void 0 ? void 0 : _globalSyncCounter$cu.level) > 0) {
       level = this.factorCheck({
-        report,
         action,
         level,
-        current: _HeadingHelpers.globalSyncCounter.current.level
+        current: _HeadingHelpers.globalSyncCounter.current.level,
+        report
       });
     }
 

package/cjs/components/heading/HeadingHelpers.d.ts

@@ -1,27 +1,49 @@
-export function resetAllLevels(): void;
-export function resetLevels(level: any, { overwriteContext }?: {
+/**
+ * Web Heading Counter
+ *
+ */
+import { HeadingAllProps, InternalHeadingLevel } from './Heading';
+import { HeadingCounter } from './HeadingCounter';
+declare type GlobalSyncCounter = {
+    current: HeadingCounter;
+};
+declare type GlobalHeadingCounter = {
+    current: HeadingCounter;
+};
+export declare const globalSyncCounter: GlobalSyncCounter;
+export declare const globalHeadingCounter: GlobalHeadingCounter;
+declare type CorrectInternalHeadingLevel = {
+    counter: HeadingCounter;
+    level: InternalHeadingLevel;
+    ref?: HeadingAllProps;
+    reset?: HeadingAllProps['reset'];
+    inherit?: boolean;
+    increase?: boolean;
+    decrease?: boolean;
+    source?: HeadingAllProps['children'];
+    bypassChecks?: boolean;
+    isRerender?: boolean;
+    debug?: HeadingAllProps['debug'];
+};
+export declare const correctInternalHeadingLevel: ({ counter, level, ref, reset, inherit, increase, decrease, source, bypassChecks, isRerender, debug, }: CorrectInternalHeadingLevel) => import("./HeadingCounter").Counter;
+export declare function resetAllLevels(): void;
+export declare const globalResetNextTime: {
+    current: GlobalNextLevel;
+};
+export declare function resetLevels(level: InternalHeadingLevel, { overwriteContext }?: {
     overwriteContext?: boolean;
 }): void;
-export function setNextLevel(level: any, { overwriteContext }?: {
+declare type GlobalNextLevel = {
+    level: InternalHeadingLevel;
+    overwriteContext: boolean;
+};
+export declare const globalNextLevel: {
+    current: GlobalNextLevel;
+};
+export declare function setNextLevel(level: InternalHeadingLevel, { overwriteContext }?: {
     overwriteContext?: boolean;
 }): void;
-export function windupHeadings(): void;
-export function teardownHeadings(): void;
-export function debugCounter(counter: any): string;
-export const globalSyncCounter: React.RefObject<any>;
-export const globalHeadingCounter: React.RefObject<any>;
-export function correctHeadingLevel({ counter, level, ref, reset, inherit, increase, decrease, source, bypassChecks, debug, }: {
-    counter: any;
-    level: any;
-    ref?: any;
-    reset?: any;
-    inherit?: any;
-    increase?: boolean;
-    decrease?: boolean;
-    source?: any;
-    bypassChecks?: boolean;
-    debug?: any;
-}): any;
-export const globalResetNextTime: React.RefObject<any>;
-export const globalNextLevel: React.RefObject<any>;
-import React from "react";
+export declare function windupHeadings(): void;
+export declare function teardownHeadings(): void;
+export declare function debugCounter(counter: any): string;
+export {};

package/cjs/components/heading/HeadingHelpers.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.correctHeadingLevel = void 0;
+exports.correctInternalHeadingLevel = void 0;
 exports.debugCounter = debugCounter;
 exports.globalSyncCounter = exports.globalResetNextTime = exports.globalNextLevel = exports.globalHeadingCounter = void 0;
 exports.resetAllLevels = resetAllLevels;
@@ -12,23 +12,21 @@ exports.setNextLevel = setNextLevel;
 exports.teardownHeadings = teardownHeadings;
 exports.windupHeadings = windupHeadings;
 
-var _react = _interopRequireDefault(require("react"));
-
 var _componentHelper = require("../../shared/component-helper");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-const globalSyncCounter = _react.default.createRef();
-
+const globalSyncCounter = {
+  current: null
+};
 exports.globalSyncCounter = globalSyncCounter;
-
-const globalHeadingCounter = _react.default.createRef(null);
-
+const globalHeadingCounter = {
+  current: null
+};
 exports.globalHeadingCounter = globalHeadingCounter;
+const refs = {
+  current: null
+};
 
-const refs = _react.default.createRef();
-
-const correctHeadingLevel = _ref => {
+const correctInternalHeadingLevel = _ref => {
   let {
     counter,
     level,
@@ -39,6 +37,7 @@ const correctHeadingLevel = _ref => {
     decrease = false,
     source = null,
     bypassChecks = false,
+    isRerender = false,
     debug = null
   } = _ref;
 
@@ -57,7 +56,11 @@ const correctHeadingLevel = _ref => {
   const update = level => {
     var _globalHeadingCounter;
 
-    counter.makeMeReady();
+    if (!isRerender) {
+      counter.makeMeReady({
+        level
+      });
+    }
 
     if (inherit) {
       if (globalSyncCounter.current) {
@@ -83,7 +86,7 @@ const correctHeadingLevel = _ref => {
     }
   };
 
-  let skipThisTime = false;
+  let skipUpdateFromProp = false;
 
   const canBeManipulatedNextTime = overwriteContext => {
     return counter.contextCounter.isGlobal || counter.contextCounter.entry === 1 || overwriteContext;
@@ -99,7 +102,7 @@ const correctHeadingLevel = _ref => {
     if (canBeManipulatedNextTime(overwriteContext) || counter.lastResetLevel === resetLevel) {
       counter.makeMeReady();
       counter.reset(resetLevel);
-      skipThisTime = true;
+      skipUpdateFromProp = true;
     }
   } else if (globalNextLevel.current) {
     const {
@@ -112,12 +115,12 @@ const correctHeadingLevel = _ref => {
       counter.enableBypassChecks();
       update(nextLevel);
       counter.disableBypassChecks();
-      skipThisTime = true;
+      skipUpdateFromProp = true;
     }
   }
 
-  if (!skipThisTime) {
-    if (reset === true || reset === 'true' || parseFloat(reset) > -1) {
+  if (!skipUpdateFromProp) {
+    if (reset === true || parseFloat(String(reset)) > -1) {
       counter.reset(reset);
     } else {
       update(level);
@@ -145,7 +148,7 @@ const correctHeadingLevel = _ref => {
   return counter;
 };
 
-exports.correctHeadingLevel = correctHeadingLevel;
+exports.correctInternalHeadingLevel = correctInternalHeadingLevel;
 
 function report(debug, source) {
   for (var _len = arguments.length, reports = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
@@ -173,8 +176,9 @@ function resetAllLevels() {
   teardownHeadings();
 }
 
-const globalResetNextTime = _react.default.createRef(false);
-
+const globalResetNextTime = {
+  current: null
+};
 exports.globalResetNextTime = globalResetNextTime;
 
 function resetLevels(level) {
@@ -187,8 +191,9 @@ function resetLevels(level) {
   };
 }
 
-const globalNextLevel = _react.default.createRef(null);
-
+const globalNextLevel = {
+  current: null
+};
 exports.globalNextLevel = globalNextLevel;
 
 function setNextLevel(level) {

package/cjs/components/heading/HeadingProvider.d.ts

@@ -1,12 +1,9 @@
-import * as React from 'react';
-import type { HeadingProps } from './Heading';
-export interface HeadingProviderProps
-  extends React.HTMLProps<HTMLElement>,
-    HeadingProps {}
-export default class HeadingProvider extends React.Component<
-  HeadingProviderProps,
-  any
-> {
-  static defaultProps: object;
-  render(): JSX.Element;
-}
+/**
+ * Web Heading Provider
+ *
+ */
+import React from 'react';
+import { HeadingProps } from './Heading';
+export declare type HeadingProviderProps = HeadingProps;
+export declare type HeadingProviderAllProps = HeadingProviderProps & React.HTMLProps<HTMLElement>;
+export default function HeadingProvider(props: HeadingProviderAllProps): JSX.Element;

package/cjs/components/heading/HeadingProvider.js

@@ -3,12 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = HeadingProvider;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _componentHelper = require("../../shared/component-helper");
 
 var _HeadingContext = _interopRequireDefault(require("./HeadingContext"));
@@ -25,33 +23,10 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 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; }
 
-class HeadingProvider extends _react.default.PureComponent {
-  static getDerivedStateFromProps(props, state) {
-    if (state._listenForPropChanges) {
-      const level = parseFloat(props.level);
-
-      if (state.prevLevel !== props.level && level > 0 && level !== state.level || props.relevel) {
-        var _state$context$headin, _state$context$headin2;
-
-        const {
-          level: newLevel
-        } = (0, _HeadingHelpers.correctHeadingLevel)({
-          counter: state.counter,
-          level,
-          bypassChecks: (0, _componentHelper.isTrue)(props.skip_correction) || (0, _componentHelper.isTrue)((_state$context$headin = state.context.heading) === null || _state$context$headin === void 0 ? void 0 : _state$context$headin.skip_correction),
-          source: props.text || props.children,
-          debug: props.debug || ((_state$context$headin2 = state.context.heading) === null || _state$context$headin2 === void 0 ? void 0 : _state$context$headin2.debug)
-        });
-        state.level = state.prevLevel = newLevel;
-      }
-
-      state._listenForPropChanges = true;
-      return state;
-    }
-  }
+function HeadingProvider(props) {
+  const context = _react.default.useContext(_HeadingContext.default);
 
-  constructor(props, context) {
-    super(props);
+  const [state, setState] = _react.default.useState(() => {
     const state = {
       context,
       _listenForPropChanges: true
@@ -70,10 +45,10 @@ class HeadingProvider extends _react.default.PureComponent {
       state.counter.setContextCounter(_HeadingHelpers.globalHeadingCounter.current);
     }
 
-    state.counter = (0, _HeadingHelpers.correctHeadingLevel)({
-      ref: props,
+    state.counter = (0, _HeadingHelpers.correctInternalHeadingLevel)({
       counter: state.counter,
-      level: parseFloat(props.level),
+      ref: props,
+      level: parseFloat(String(props.level)),
       inherit: (0, _componentHelper.isTrue)(props.inherit),
       reset: props.reset,
       increase: (0, _componentHelper.isTrue)(props.increase) || (0, _componentHelper.isTrue)(props.up),
@@ -84,64 +59,46 @@ class HeadingProvider extends _react.default.PureComponent {
     });
     _HeadingHelpers.globalSyncCounter.current = state.counter;
     state.level = state.counter.level;
-    state.prevLevel = state.newProps.level || state.counter.level;
-    this.state = state;
-  }
+    state.prevLevel = parseFloat(String(state.newProps.level)) || state.counter.level;
+    return state;
+  });
+
+  _react.default.useEffect(() => {
+    const level = parseFloat(String(props.level));
+
+    if (state.prevLevel !== props.level && level > 0 && level !== state.level) {
+      var _state$context$headin, _state$context$headin2;
+
+      const {
+        level: newLevel
+      } = (0, _HeadingHelpers.correctInternalHeadingLevel)({
+        counter: state.counter,
+        level,
+        bypassChecks: (0, _componentHelper.isTrue)(props.skip_correction) || (0, _componentHelper.isTrue)((_state$context$headin = state.context.heading) === null || _state$context$headin === void 0 ? void 0 : _state$context$headin.skip_correction),
+        source: props.text || props.children,
+        debug: props.debug || ((_state$context$headin2 = state.context.heading) === null || _state$context$headin2 === void 0 ? void 0 : _state$context$headin2.debug)
+      });
+      state.level = state.prevLevel = newLevel;
+      setState(_objectSpread({}, state));
+    }
+  }, [props.level]);
 
-  componentDidMount() {
+  _react.default.useEffect(() => {
     (0, _HeadingHelpers.windupHeadings)();
-  }
-
-  componentWillUnmount() {
-    (0, _HeadingHelpers.teardownHeadings)();
-  }
-
-  render() {
-    return _react.default.createElement(_HeadingContext.default.Provider, {
-      value: {
-        heading: _objectSpread(_objectSpread({}, this.state.newProps), this.state)
-      }
-    }, this.state.newProps.debug_counter && _react.default.createElement("span", {
-      className: "dnb-heading__context"
-    }, _react.default.createElement("span", {
-      className: "dnb-heading__debug"
-    }, "Context:", ' ', _react.default.createElement("span", {
-      className: "dnb-code"
-    }, (0, _HeadingHelpers.debugCounter)(this.state.counter))), this.props.children) || this.props.children);
-  }
-
-}
-
-exports.default = HeadingProvider;
-
-_defineProperty(HeadingProvider, "contextType", _HeadingContext.default);
-
-_defineProperty(HeadingProvider, "defaultProps", {
-  id: null,
-  group: null,
-  level: null,
-  increase: null,
-  decrease: null,
-  up: null,
-  down: null,
-  inherit: null,
-  counter: null,
-  reset: null,
-  text: null,
-  children: null
-});
+    return () => {
+      (0, _HeadingHelpers.teardownHeadings)();
+    };
+  }, []);
 
-process.env.NODE_ENV !== "production" ? HeadingProvider.propTypes = {
-  id: _propTypes.default.string,
-  group: _propTypes.default.string,
-  level: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
-  increase: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool]),
-  decrease: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool]),
-  up: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool]),
-  down: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool]),
-  inherit: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool]),
-  counter: _propTypes.default.any,
-  reset: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string, _propTypes.default.bool]),
-  text: _propTypes.default.any,
-  children: _propTypes.default.any
-} : void 0;
+  return _react.default.createElement(_HeadingContext.default.Provider, {
+    value: {
+      heading: _objectSpread(_objectSpread({}, state.newProps), state)
+    }
+  }, state.newProps.debug_counter && _react.default.createElement("span", {
+    className: "dnb-heading__context"
+  }, _react.default.createElement("span", {
+    className: "dnb-heading__debug"
+  }, "Context:", ' ', _react.default.createElement("span", {
+    className: "dnb-code"
+  }, (0, _HeadingHelpers.debugCounter)(state.counter))), props.children) || props.children);
+}

package/cjs/components/height-animation/HeightAnimation.d.ts

@@ -29,5 +29,5 @@ export declare type HeightAnimationProps = {
      */
     innerRef?: React.RefObject<HTMLElement>;
 } & useHeightAnimationOptions;
-export declare type HeightAnimationAllProps = HeightAnimationProps & SpacingProps & React.HTMLProps<HTMLElement>;
+export declare type HeightAnimationAllProps = HeightAnimationProps & SpacingProps & Omit<React.HTMLProps<HTMLElement>, 'ref'>;
 export default function HeightAnimation({ open, animate, keepInDOM, showOverflow, element, duration, className, innerRef, children, onInit, onOpen, onAnimationEnd, ...rest }: HeightAnimationAllProps): JSX.Element;

package/cjs/components/icon/Icon.d.ts

@@ -12,7 +12,7 @@ export type IconAttributes = string | Record<string, unknown>;
 export type IconChildren = React.ReactNode | ((...args: any[]) => any);
 export type IconColor = string;
 export interface IconProps
-  extends React.HTMLProps<HTMLElement>,
+  extends Omit<React.HTMLProps<HTMLElement>, 'ref'>,
     SpacingProps {
   /**
    * <em>(required)</em> a React SVG Component or the icon name (in case we use `IconPrimary` or `dnb-icon-primary`).

package/cjs/components/icon/Icon.js

@@ -424,7 +424,7 @@ const prerenderIcon = function () {
     const mod = (listOfIcons.dnbIcons ? listOfIcons.dnbIcons : listOfIcons)[icon];
     return mod && mod.default ? mod.default : mod;
   } catch (e) {
-    new _errorHelper.ErrorHandler(`Icon '${icon}' did not exist!`);
+    (0, _errorHelper.ErrorHandler)(`Icon '${icon}' did not exist!`);
     return null;
   }
 };

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

@@ -2,7 +2,7 @@ import * as React from 'react';
 import type { IconProps } from '../Icon';
 export interface IconPrimaryProps
   extends IconProps,
-    Omit<React.HTMLProps<HTMLElement>, 'size'> {}
+    Omit<React.HTMLProps<HTMLElement>, 'size' | 'ref'> {}
 export default class IconPrimary extends React.Component<
   IconPrimaryProps,
   any

package/cjs/components/info-card/style/dnb-info-card.css

@@ -11,7 +11,6 @@
   position: relative;
   padding: 1rem;
   overflow: hidden;
-  max-width: 60ch;
   background: var(--color-white);
   box-shadow: var(--shadow-default);
 }
@@ -36,6 +35,7 @@
 .dnb-info-card__content {
   flex-direction: column;
   margin-top: 0.1875rem;
+  max-width: 70ch;
 }
 .dnb-info-card--centered .dnb-info-card__content {
   margin-top: 0;

package/cjs/components/info-card/style/dnb-info-card.min.css

@@ -1 +1 @@
-.dnb-info-card{background:var(--color-white);box-shadow:var(--shadow-default);display:flex;flex-direction:row;max-width:60ch;overflow:hidden;padding:1rem;position:relative}.dnb-info-card:after{border:1px solid var(--color-black-8);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.dnb-info-card,.dnb-info-card:after{border-radius:.25rem}.dnb-info-card--centered{align-items:center;flex-direction:column;text-align:center}.dnb-info-card__content{flex-direction:column;margin-top:.1875rem}.dnb-info-card--centered .dnb-info-card__content{margin-top:0}.dnb-info-card__icon{color:var(--color-emerald-green)}.dnb-info-card__image{height:4rem;width:4rem}.dnb-info-card__buttons{display:flex;flex-flow:row wrap}.dnb-info-card--centered .dnb-info-card__buttons{align-items:center;flex-direction:column;text-align:center}
+.dnb-info-card{background:var(--color-white);box-shadow:var(--shadow-default);display:flex;flex-direction:row;overflow:hidden;padding:1rem;position:relative}.dnb-info-card:after{border:1px solid var(--color-black-8);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.dnb-info-card,.dnb-info-card:after{border-radius:.25rem}.dnb-info-card--centered{align-items:center;flex-direction:column;text-align:center}.dnb-info-card__content{flex-direction:column;margin-top:.1875rem;max-width:70ch}.dnb-info-card--centered .dnb-info-card__content{margin-top:0}.dnb-info-card__icon{color:var(--color-emerald-green)}.dnb-info-card__image{height:4rem;width:4rem}.dnb-info-card__buttons{display:flex;flex-flow:row wrap}.dnb-info-card--centered .dnb-info-card__buttons{align-items:center;flex-direction:column;text-align:center}

package/cjs/components/info-card/style/dnb-info-card.scss

@@ -13,7 +13,6 @@
   padding: 1rem;
 
   overflow: hidden;
-  max-width: 60ch;
 
   background: var(--color-white);
 
@@ -41,6 +40,7 @@
   &__content {
     flex-direction: column;
     margin-top: 0.1875rem;
+    max-width: 70ch;
   }
 
   &--centered &__content {

package/cjs/components/input/Input.d.ts

@@ -30,7 +30,7 @@ export type InputSubmitButtonIcon =
   | ((...args: any[]) => any);
 export type InputChildren = React.ReactNode | ((...args: any[]) => any);
 export interface InputProps
-  extends React.HTMLProps<HTMLElement>,
+  extends Omit<React.HTMLProps<HTMLElement>, 'ref'>,
     SpacingProps {
   /**
    * Choose between `text`, `number`, `email`, `password`, `url`, `tel` and `search`.
@@ -175,7 +175,7 @@ export interface InputProps
   /**
    * By providing a React.ref we can get the internally used input element (DOM). E.g. `inner_ref={myRef}` by using `React.createRef()` or `React.useRef()`.
    */
-  inner_ref?: any;
+  inner_ref?: React.Ref;
   readOnly?: boolean;
 
   /**