@dnb/eufemia 9.26.1 → 9.29.0

package/cjs/shared/helpers/withSnakeCaseProps.d.ts

@@ -0,0 +1,40 @@
+import React from 'react';
+/**
+ * withSnakeCaseProps is a HOC for function components
+ * it will return a React Component where all snake_case props gets converted to camelCase
+ *
+ * Use the same for TypeScript types by using: ToSnakeCase
+ *
+ * @param Base the original function or class
+ * @returns extended function or class
+ */
+export declare function withSnakeCaseProps<TBase, P>(Base: React.FunctionComponent<P> & TBase): typeof Base;
+/**
+ * withSnakeCaseProps is a HOC for classes
+ * it will return a React Component where all snake_case props gets converted to camelCase
+ *
+ * Use the same for TypeScript types by using: ToSnakeCase
+ *
+ * @param Base the original function or class
+ * @returns extended function or class
+ */
+export declare function classWithSnakeCaseProps<TBase extends React.ComponentClass>(Base: TBase): typeof Base;
+export declare function convertSnakeCaseProps<P>(props: P): P;
+/**
+ * Convert recursively Types from camelCase to snake_case
+ *
+ * Use it like so:
+ * OriginalProps & ToSnakeCase<OriginalProps>
+ *
+ * Disclaimer: Be careful using these with required props
+ * - ToSnakeCase makes the required camelCase props also required in snake_case
+ * - ToSnakeCasePartial removes required for the snake_case props
+ *
+ */
+export declare type ToSnakeCasePartial<T> = Partial<ToSnakeCase<T>>;
+export declare type ToSnakeCase<T> = T extends object ? {
+    [K in keyof T as ConvertCamelToSnakeCase<K & string>]: T[K] | ToSnakeCase<T[K]>;
+} : T;
+export declare type IncludeSnakeCase<T> = Partial<T> & ToSnakeCasePartial<T>;
+declare type ConvertCamelToSnakeCase<S extends string> = S extends `${infer T}${infer U}` ? `${T extends Capitalize<T> ? '_' : ''}${Lowercase<T>}${ConvertCamelToSnakeCase<U>}` : S;
+export {};

package/cjs/shared/helpers/withSnakeCaseProps.js

@@ -0,0 +1,168 @@
+"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.get-prototype-of.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.reflect.construct.js");
+
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.symbol.js");
+
+require("core-js/modules/es.array.filter.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");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.classWithSnakeCaseProps = classWithSnakeCaseProps;
+exports.convertSnakeCaseProps = convertSnakeCaseProps;
+exports.withSnakeCaseProps = withSnakeCaseProps;
+
+require("core-js/modules/es.object.freeze.js");
+
+require("core-js/modules/es.function.name.js");
+
+require("core-js/modules/es.array.concat.js");
+
+require("core-js/modules/es.array.includes.js");
+
+require("core-js/modules/es.string.includes.js");
+
+require("core-js/modules/es.regexp.exec.js");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _componentHelper = require("../component-helper");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+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 _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+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 withSnakeCaseProps(Base) {
+  var Component = Base;
+
+  var Derived = function Derived(props) {
+    return _react.default.createElement(Component, Object.freeze(convertSnakeCaseProps(props)));
+  };
+
+  Object.defineProperty(Derived, 'name', {
+    value: Base.name
+  });
+
+  for (var name in Base) {
+    Object.defineProperty(Derived, name, {
+      value: Base[name]
+    });
+  }
+
+  return Derived;
+}
+
+function classWithSnakeCaseProps(Base) {
+  var Component = Base;
+
+  var Derived = function (_Base) {
+    _inherits(Derived, _Base);
+
+    var _super = _createSuper(Derived);
+
+    function Derived() {
+      var _this;
+
+      _classCallCheck(this, Derived);
+
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+
+      _this = _super.call.apply(_super, [this].concat(args));
+
+      _defineProperty(_assertThisInitialized(_this), "_prevProps", void 0);
+
+      _defineProperty(_assertThisInitialized(_this), "_elem", void 0);
+
+      return _this;
+    }
+
+    _createClass(Derived, [{
+      key: "componentDidMount",
+      value: function componentDidMount() {}
+    }, {
+      key: "render",
+      value: function render() {
+        if (this.props !== this._prevProps) {
+          this._prevProps = this.props;
+          this._elem = _react.default.createElement(Component, Object.freeze(convertSnakeCaseProps(this.props)));
+        }
+
+        return this._elem;
+      }
+    }]);
+
+    return Derived;
+  }(Base);
+
+  Object.defineProperty(Derived, 'name', {
+    value: Base.name
+  });
+  Object.defineProperty(Derived, 'displayName', {
+    value: Base.displayName || Base.name
+  });
+  return Derived;
+}
+
+function convertSnakeCaseProps(props) {
+  var newProps = _objectSpread({}, props);
+
+  for (var key in props) {
+    if (key.includes('_') && /^[a-z]+/.test(key) && !/[A-Z]/.test(key)) {
+      newProps[(0, _componentHelper.toCamelCase)(key)] = props[key];
+      delete newProps[key];
+    }
+  }
+
+  return newProps;
+}

package/cjs/shared/interfaces.d.ts

@@ -8,3 +8,16 @@ export interface ISpacingElementProps {
     left?: SpaceTypes;
 }
 export declare type SpaceTypes = string | boolean | number;
+export declare type DataAttributeTypes = {
+    /**
+     * When using HTMLAttributes on object to define props,
+     * we need not get data-* attributes as valid types:
+     *
+     * triggerAttributes={{
+     *   'data-testid': 'html-selector'
+     * }}
+     *
+     * Effects: triggerAttributes, closeButtonAttributes
+     */
+    'data-testid'?: string;
+};

package/cjs/shared/locales/en-GB.d.ts

@@ -34,7 +34,7 @@ declare var _default: {
             reset_button_text: string;
         };
         Anchor: {
-            target_blank_title: string;
+            targetBlankTitle: string;
         };
         GlobalStatus: {
             default_title: string;
@@ -66,6 +66,7 @@ declare var _default: {
             show_all: string;
             show_options_sr: string;
             aria_live_options: string;
+            selected_sr: string;
             indicator_label: string;
         };
         Modal: {
@@ -107,8 +108,8 @@ declare var _default: {
             step_title: string;
         };
         Slider: {
-            add_title: string;
-            subtract_title: string;
+            addTitle: string;
+            subtractTitle: string;
         };
         PaymentCard: {
             text_card_number: string;

package/cjs/shared/locales/en-GB.js

@@ -40,7 +40,7 @@ var _default = {
       reset_button_text: 'Reset'
     },
     Anchor: {
-      target_blank_title: 'Opens a new Window'
+      targetBlankTitle: 'Opens a new Window'
     },
     GlobalStatus: {
       default_title: 'An error has occurred',
@@ -72,6 +72,7 @@ var _default = {
       show_all: 'Show everything',
       show_options_sr: 'Browse options, close with esc button',
       aria_live_options: '%s options',
+      selected_sr: 'Selected:',
       indicator_label: 'Getting data ...'
     },
     Modal: {
@@ -113,8 +114,8 @@ var _default = {
       step_title: 'Step %step of %count'
     },
     Slider: {
-      add_title: 'Increase (%s)',
-      subtract_title: 'Decrease (%s)'
+      addTitle: 'Increase (%s)',
+      subtractTitle: 'Decrease (%s)'
     },
     PaymentCard: {
       text_card_number: 'Card number',

package/cjs/shared/locales/en-US.d.ts

@@ -35,7 +35,7 @@ declare var _default: {
             backToText: string;
         };
         Anchor: {
-            target_blank_title: string;
+            targetBlankTitle: string;
         };
         GlobalStatus: {
             default_title: string;
@@ -67,6 +67,7 @@ declare var _default: {
             show_all: string;
             show_options_sr: string;
             aria_live_options: string;
+            selected_sr: string;
             indicator_label: string;
         };
         Modal: {
@@ -108,8 +109,8 @@ declare var _default: {
             step_title: string;
         };
         Slider: {
-            add_title: string;
-            subtract_title: string;
+            addTitle: string;
+            subtractTitle: string;
         };
         PaymentCard: {
             text_card_number: string;

package/cjs/shared/locales/index.d.ts

@@ -34,7 +34,7 @@ declare var _default: {
             reset_button_text: string;
         };
         Anchor: {
-            target_blank_title: string;
+            targetBlankTitle: string;
         };
         GlobalStatus: {
             default_title: string;
@@ -66,6 +66,7 @@ declare var _default: {
             show_all: string;
             show_options_sr: string;
             aria_live_options: string;
+            selected_sr: string;
             indicator_label: string;
         };
         Modal: {
@@ -107,8 +108,8 @@ declare var _default: {
             step_title: string;
         };
         Slider: {
-            add_title: string;
-            subtract_title: string;
+            addTitle: string;
+            subtractTitle: string;
         };
         PaymentCard: {
             text_card_number: string;
@@ -154,7 +155,7 @@ declare var _default: {
             reset_button_text: string;
         };
         Anchor: {
-            target_blank_title: string;
+            targetBlankTitle: string;
         };
         GlobalStatus: {
             default_title: string;
@@ -186,6 +187,7 @@ declare var _default: {
             show_all: string;
             show_options_sr: string;
             aria_live_options: string;
+            selected_sr: string;
             indicator_label: string;
         };
         Modal: {
@@ -227,8 +229,8 @@ declare var _default: {
             step_title: string;
         };
         Slider: {
-            add_title: string;
-            subtract_title: string;
+            addTitle: string;
+            subtractTitle: string;
         };
         PaymentCard: {
             text_card_number: string;

package/cjs/shared/locales/nb-NO.d.ts

@@ -34,7 +34,7 @@ declare var _default: {
             reset_button_text: string;
         };
         Anchor: {
-            target_blank_title: string;
+            targetBlankTitle: string;
         };
         GlobalStatus: {
             default_title: string;
@@ -66,6 +66,7 @@ declare var _default: {
             show_all: string;
             show_options_sr: string;
             aria_live_options: string;
+            selected_sr: string;
             indicator_label: string;
         };
         Modal: {
@@ -107,8 +108,8 @@ declare var _default: {
             step_title: string;
         };
         Slider: {
-            add_title: string;
-            subtract_title: string;
+            addTitle: string;
+            subtractTitle: string;
         };
         PaymentCard: {
             text_card_number: string;

package/cjs/shared/locales/nb-NO.js

@@ -40,7 +40,7 @@ var _default = {
       reset_button_text: 'Tilbakestill'
     },
     Anchor: {
-      target_blank_title: 'Åpner et nytt vindu'
+      targetBlankTitle: 'Åpner et nytt vindu'
     },
     GlobalStatus: {
       default_title: 'En feil har skjedd',
@@ -72,6 +72,7 @@ var _default = {
       show_all: 'Vis alt',
       show_options_sr: 'Bla gjennom alternativer, lukk med esc knappen',
       aria_live_options: '%s alternativer',
+      selected_sr: 'Valgt:',
       indicator_label: 'Henter data ...'
     },
     Modal: {
@@ -113,8 +114,8 @@ var _default = {
       step_title: 'Steg %step av %count'
     },
     Slider: {
-      add_title: 'Øk (%s)',
-      subtract_title: 'Reduser (%s)'
+      addTitle: 'Øk (%s)',
+      subtractTitle: 'Reduser (%s)'
     },
     PaymentCard: {
       text_card_number: 'Kortnummer',

package/cjs/shared/useMediaQuery.d.ts

@@ -1 +1,3 @@
-export default function useMediaQuery(props: any): boolean;
+import type { MediaQueryProps } from './MediaQueryUtils';
+export type { MediaQueryProps };
+export default function useMediaQuery(props: MediaQueryProps): boolean;

package/cjs/shared/useTranslation.d.ts

@@ -1,28 +1,7 @@
 export function getTranslation(id: any, params: any): JSX.Element;
 export default function useTranslation(id: any, params: any): any;
 export class Translation extends React.PureComponent<any, any, any> {
-    static contextType: React.Context<{
-        translation: any;
-        updateTranslation: (locale: any, translation: any) => void;
-        getTranslation: (props: any) => any;
-        locale: any;
-        locales: any;
-        skeleton: any;
-        Button: {};
-        Avatar: {};
-        AvatarGroup: {};
-        Breadcrumb: {};
-        BreadcrumbItem: {};
-        InfoCard: {};
-        Tag: {};
-        TagGroup: {};
-        Timeline: {};
-        TimelineItem: {};
-        VisuallyHidden: {};
-        Drawer: {};
-        Dialog: {};
-        NumberFormat: {};
-    }>;
+    static contextType: React.Context<import("./Context").ContextProps>;
     static propTypes: {
         id: PropTypes.Requireable<string>;
         children: PropTypes.Requireable<string>;