@dnb/eufemia 10.73.2 → 10.74.0

package/cjs/shared/component-helper.d.ts

@@ -1,53 +1,50 @@
 /**
- * Check if device is touch device or not
+ * Component helpers
+ *
  */
-export function isTouchDevice(): boolean;
-export function defineNavigator(): void;
-export function isObject(item: any): boolean;
-export function extendDeep(target?: {}, ...sources: any[]): {};
-export function toCapitalized(str: any): any;
-export function convertStatusToStateOnly(status: any, state: any): any;
-export function getStatusState(status: any): boolean;
-export function combineLabelledBy(...params: any[]): any;
-export function combineDescribedBy(...params: any[]): any;
-export function combineDetails(...params: any[]): any;
-export function findElementInChildren(children: any, find: any): any;
-export function escapeRegexChars(str: any): any;
-export function removeUndefinedProps(object: any): any;
-export { InteractionInvalidation } from "./helpers/InteractionInvalidation";
-export { assignPropsWithContext } from "./helpers/assignPropsWithContext";
-export { filterProps } from "./helpers/filterProps";
-export function validateDOMAttributes(props: any, params: any): any;
-export function processChildren(props: any): any;
-export function extendGracefully(...objects: any[]): any;
-export function isTrue(value: any): boolean;
-export function dispatchCustomElementEvent(src: any, eventName: any, eventObjectOrig: any): any;
-export function toCamelCase(s: any): any;
-export function toPascalCase(s: any): any;
-export function toSnakeCase(str: any): any;
-export function toKebabCase(str: any): any;
-export function detectOutsideClick(ignoreElements: any, onSuccess: Function, options?: any): DetectOutsideClickClass;
-export class DetectOutsideClickClass {
-    constructor(ignoreElements: any, onSuccess: any, options?: {});
-    handleClickOutside: (event: any) => void;
-    keydownCallback: (event: any) => void;
-    keyupCallback: (event: any) => void;
-    remove(): void;
-    checkOutsideClick: ({ event, ignoreElements }: {
-        event: any;
-        ignoreElements: any;
-    }, onSuccess?: any) => void;
-}
-export function checkIfHasScrollbar(elem: any): boolean;
-export function makeUniqueId(prefix?: string, length?: number): string;
-export function slugify(s: any): string;
-export function matchAll(string: any, regex: any): any[];
-export function isChildOfElement(element: HTMLElement, target: HTMLElement, callback?: Function): HTMLElement | null;
-export function roundToNearest(num: any, target: any): any;
-export function getClosestScrollViewElement(currentElement: any): Element;
-export function convertJsxToString(elements: any, separator?: any, transformWord?: any): any;
+import React from 'react';
 import keycode from './keycode';
-import { getPreviousSibling } from './helpers/getPreviousSibling';
 import { warn } from './helpers';
+import { getPreviousSibling } from './helpers/getPreviousSibling';
+export * from './legacy/component-helper-legacy';
+export { InteractionInvalidation } from './helpers/InteractionInvalidation';
+export { extendPropsWithContext, extendPropsWithContextInClassComponent, } from './helpers/extendPropsWithContext';
+export { assignPropsWithContext } from './helpers/assignPropsWithContext';
+export { filterProps } from './helpers/filterProps';
 export { keycode, getPreviousSibling, warn };
-export { extendPropsWithContext, extendPropsWithContextInClassComponent } from "./helpers/extendPropsWithContext";
+export declare const validateDOMAttributes: (props: any, params: any) => any;
+/** @deprecated Can be removed in v11 */
+export declare const extendGracefully: (...objects: any[]) => any;
+export declare function isObject(item: any): boolean;
+export declare function extendDeep(target?: {}, ...sources: any[]): {};
+export declare const isTrue: (value: any) => boolean;
+export declare const dispatchCustomElementEvent: (src: any, eventName: any, eventObjectOrig?: any) => any;
+export declare const toCamelCase: (s: any) => any;
+export declare const toPascalCase: (s: any) => any;
+export declare const toSnakeCase: (str: any) => any;
+export declare const toKebabCase: (str: any) => any;
+export declare function toCapitalized(str: any): any;
+export declare const makeUniqueId: (prefix?: string, length?: number) => string;
+export declare const slugify: (s: any) => string;
+export declare const matchAll: (string: any, regex: any) => any[];
+/**
+ * Check if an element exists in its children
+ * If it finds it, the child "element" of target will be returned.
+ *
+ * @param {HTMLElement} element The DOM Element to find
+ * @param {HTMLElement} target The DOM Element that should contain "element"
+ * @param {function} callback (optional)
+ * @returns {HTMLElement | null} Returns the found child of all existing dom elements inside of "target"
+ */
+export declare const isChildOfElement: (element: any, target: any, callback?: any) => any;
+export declare const roundToNearest: (num: any, target: any) => any;
+export declare const getClosestScrollViewElement: (currentElement: any) => Element;
+export declare function convertJsxToString(elements: React.ReactNode | React.ReactNode[], separator?: string, transformWord?: (element: React.ReactElement) => React.ReactElement<unknown>): string;
+export declare function convertStatusToStateOnly(status: any, state: any): any;
+export declare function getStatusState(status: any): boolean;
+export declare function combineLabelledBy(...params: any[]): any;
+export declare function combineDescribedBy(...params: any[]): any;
+export declare function combineDetails(...params: any[]): any;
+export declare function findElementInChildren(children: any, find: any): any;
+export declare function escapeRegexChars(str: any): any;
+export declare function removeUndefinedProps(object: any): any;

package/cjs/shared/component-helper.js

@@ -3,7 +3,42 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.DetectOutsideClickClass = void 0;
+var _exportNames = {
+  validateDOMAttributes: true,
+  extendGracefully: true,
+  isObject: true,
+  extendDeep: true,
+  isTrue: true,
+  dispatchCustomElementEvent: true,
+  toCamelCase: true,
+  toPascalCase: true,
+  toSnakeCase: true,
+  toKebabCase: true,
+  toCapitalized: true,
+  makeUniqueId: true,
+  slugify: true,
+  matchAll: true,
+  isChildOfElement: true,
+  roundToNearest: true,
+  getClosestScrollViewElement: true,
+  convertJsxToString: true,
+  convertStatusToStateOnly: true,
+  getStatusState: true,
+  combineLabelledBy: true,
+  combineDescribedBy: true,
+  combineDetails: true,
+  findElementInChildren: true,
+  escapeRegexChars: true,
+  removeUndefinedProps: true,
+  keycode: true,
+  warn: true,
+  getPreviousSibling: true,
+  InteractionInvalidation: true,
+  extendPropsWithContext: true,
+  extendPropsWithContextInClassComponent: true,
+  assignPropsWithContext: true,
+  filterProps: true
+};
 Object.defineProperty(exports, "InteractionInvalidation", {
   enumerable: true,
   get: function () {
@@ -16,14 +51,12 @@ Object.defineProperty(exports, "assignPropsWithContext", {
     return _assignPropsWithContext.assignPropsWithContext;
   }
 });
-exports.checkIfHasScrollbar = void 0;
 exports.combineDescribedBy = combineDescribedBy;
 exports.combineDetails = combineDetails;
 exports.combineLabelledBy = combineLabelledBy;
-exports.convertJsxToString = void 0;
+exports.convertJsxToString = convertJsxToString;
 exports.convertStatusToStateOnly = convertStatusToStateOnly;
-exports.defineNavigator = defineNavigator;
-exports.dispatchCustomElementEvent = exports.detectOutsideClick = void 0;
+exports.dispatchCustomElementEvent = void 0;
 exports.escapeRegexChars = escapeRegexChars;
 exports.extendDeep = extendDeep;
 exports.extendGracefully = void 0;
@@ -56,7 +89,6 @@ Object.defineProperty(exports, "getPreviousSibling", {
 exports.getStatusState = getStatusState;
 exports.isChildOfElement = void 0;
 exports.isObject = isObject;
-exports.isTouchDevice = isTouchDevice;
 exports.isTrue = void 0;
 Object.defineProperty(exports, "keycode", {
   enumerable: true,
@@ -64,7 +96,7 @@ Object.defineProperty(exports, "keycode", {
     return _keycode.default;
   }
 });
-exports.processChildren = exports.matchAll = exports.makeUniqueId = void 0;
+exports.matchAll = exports.makeUniqueId = void 0;
 exports.removeUndefinedProps = removeUndefinedProps;
 exports.toCamelCase = exports.slugify = exports.roundToNearest = void 0;
 exports.toCapitalized = toCapitalized;
@@ -84,6 +116,18 @@ var _whatInput = _interopRequireDefault(require("what-input"));
 var _helpers = require("./helpers");
 var _getPreviousSibling = require("./helpers/getPreviousSibling");
 var _Eufemia = require("./Eufemia");
+var _componentHelperLegacy = require("./legacy/component-helper-legacy");
+Object.keys(_componentHelperLegacy).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _componentHelperLegacy[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _componentHelperLegacy[key];
+    }
+  });
+});
 var _InteractionInvalidation = require("./helpers/InteractionInvalidation");
 var _extendPropsWithContext = require("./helpers/extendPropsWithContext");
 var _assignPropsWithContext = require("./helpers/assignPropsWithContext");
@@ -96,45 +140,7 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 (0, _Eufemia.init)();
 _whatInput.default.specificKeys([9]);
-defineNavigator();
-function isTouchDevice() {
-  if (typeof document !== 'undefined') {
-    let intent = false;
-    try {
-      intent = document.documentElement.getAttribute('data-whatintent');
-    } catch (e) {}
-    return intent === 'touch';
-  }
-  return false;
-}
-function defineNavigator() {
-  const handleNavigator = () => {
-    if (typeof document === 'undefined' || typeof window === 'undefined' || typeof navigator === 'undefined') {
-      return;
-    }
-    try {
-      if (!(typeof window !== 'undefined' && window.IS_TEST)) {
-        if (navigator.platform.match(new RegExp(_helpers.PLATFORM_MAC)) !== null) {
-          document.documentElement.setAttribute('data-os', 'mac');
-        } else if (navigator.platform.match(new RegExp(_helpers.PLATFORM_WIN)) !== null) {
-          document.documentElement.setAttribute('data-os', 'win');
-        } else if (navigator.platform.match(new RegExp(_helpers.PLATFORM_LINUX)) !== null) {
-          document.documentElement.setAttribute('data-os', 'linux');
-        }
-      } else {
-        document.documentElement.setAttribute('data-os', 'other');
-      }
-    } catch (e) {
-      (0, _helpers.warn)(e);
-    }
-    document.removeEventListener('DOMContentLoaded', handleNavigator);
-  };
-  if (typeof document !== 'undefined' && document.readyState === 'loading') {
-    document.addEventListener('DOMContentLoaded', handleNavigator);
-  } else {
-    handleNavigator();
-  }
-}
+(0, _componentHelperLegacy.defineNavigator)();
 const validateDOMAttributes = (props, params) => {
   if (props && props.attributes) {
     let attr = props.attributes;
@@ -201,48 +207,6 @@ const validateDOMAttributes = (props, params) => {
   return params;
 };
 exports.validateDOMAttributes = validateDOMAttributes;
-const processChildren = props => {
-  if (!props) {
-    return null;
-  }
-  if (typeof global !== 'undefined' && Array.isArray(global.registeredElements) && global.registeredElements.length > 0) {
-    let cache = null;
-    Object.entries(props).reverse().map(_ref2 => {
-      let [key, cb] = _ref2;
-      if (key.includes('render_') && /^render_/.test(key)) {
-        if (typeof cb === 'function') {
-          if (cache) {
-            if (Object.isFrozen(props)) {
-              props = _objectSpread({}, props);
-            }
-            props.children = cache;
-          }
-          return cache = _react.default.createElement(_react.default.Fragment, {
-            key: key
-          }, cb(props));
-        }
-      }
-      return null;
-    }).filter(Boolean);
-    if (cache) {
-      return cache;
-    }
-  }
-  const res = typeof props.children === 'function' ? props.children(props) : props.children;
-  if (Array.isArray(res)) {
-    const onlyTexts = res.reduce((pV, cV) => {
-      if (typeof cV === 'string' || typeof cV === 'number') {
-        pV.push(cV);
-      }
-      return pV;
-    }, []);
-    if (onlyTexts.length === res.length && onlyTexts.length > 0) {
-      return onlyTexts.join('');
-    }
-  }
-  return res;
-};
-exports.processChildren = processChildren;
 const extendGracefully = function () {
   let first = {};
   for (var _len = arguments.length, objects = new Array(_len), _key = 0; _key < _len; _key++) {
@@ -257,8 +221,8 @@ const extendGracefully = function () {
   }
   return objects.reduce((acc1, object) => {
     if (object) {
-      acc1 = Object.assign(acc1, Object.entries(object).reduce((acc2, _ref3) => {
-        let [key, value] = _ref3;
+      acc1 = Object.assign(acc1, Object.entries(object).reduce((acc2, _ref2) => {
+        let [key, value] = _ref2;
         if (value !== null) {
           if (typeof value === 'object') {
             value = extendGracefully(acc1[key] || {}, value);
@@ -310,7 +274,8 @@ const isTrue = value => {
   return false;
 };
 exports.isTrue = isTrue;
-const dispatchCustomElementEvent = (src, eventName, eventObjectOrig) => {
+const dispatchCustomElementEvent = function (src, eventName) {
+  let eventObjectOrig = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : undefined;
   let ret = undefined;
   const eventObject = _objectSpread(_objectSpread({}, eventObjectOrig && eventObjectOrig.event || {}), eventObjectOrig);
   if (eventObject && eventObject.attributes && eventObject.event) {
@@ -381,107 +346,6 @@ exports.toKebabCase = toKebabCase;
 function toCapitalized(str) {
   return typeof str === 'string' ? str.toLowerCase().split('').map((char, index, arr) => index === 0 || arr[index - 1] === ' ' || arr[index - 1] === '-' ? char.toUpperCase() : char).join('') : str;
 }
-const detectOutsideClick = (ignoreElements, onSuccess, options) => new DetectOutsideClickClass(ignoreElements, onSuccess, options);
-exports.detectOutsideClick = detectOutsideClick;
-class DetectOutsideClickClass {
-  constructor(_ignoreElements, _onSuccess) {
-    let options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-    _defineProperty(this, "checkOutsideClick", function (_ref4) {
-      let {
-        event,
-        ignoreElements
-      } = _ref4;
-      let onSuccess = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-      try {
-        const currentElement = event.target;
-        if ((currentElement === null || currentElement === void 0 ? void 0 : currentElement.tagName) === 'HTML' && (event.pageX > document.documentElement.clientWidth - 40 || event.pageY > document.documentElement.clientHeight - 40)) {
-          return;
-        }
-        if (checkIfHasScrollbar(currentElement)) {
-          return;
-        }
-        for (let i = 0, elem, l = ignoreElements.length; i < l; ++i) {
-          const ignoreElement = ignoreElements[i] && 'current' in ignoreElements[i] ? ignoreElements[i].current : ignoreElements[i];
-          elem = currentElement;
-          if (!ignoreElements[i]) {
-            continue;
-          }
-          do {
-            if (elem === ignoreElement) {
-              return;
-            }
-            elem = elem && elem.parentNode;
-          } while (elem);
-        }
-        if (typeof onSuccess === 'function') {
-          onSuccess();
-        }
-      } catch (e) {
-        (0, _helpers.warn)(e);
-      }
-    });
-    if (!this.handleClickOutside && typeof document !== 'undefined' && typeof window !== 'undefined') {
-      if (!Array.isArray(_ignoreElements)) {
-        _ignoreElements = [_ignoreElements];
-      }
-      this.handleClickOutside = event => {
-        this.checkOutsideClick({
-          event,
-          ignoreElements: _ignoreElements
-        }, () => typeof _onSuccess === 'function' && _onSuccess({
-          event
-        }));
-      };
-      document.addEventListener('mousedown', this.handleClickOutside);
-      this.keydownCallback = event => {
-        const keyCode = (0, _keycode.default)(event);
-        if (keyCode === 'esc') {
-          window.removeEventListener('keydown', this.keydownCallback);
-          if (typeof _onSuccess === 'function') {
-            _onSuccess({
-              event
-            });
-          }
-        }
-      };
-      window.addEventListener('keydown', this.keydownCallback);
-      if (options.includedKeys) {
-        this.keyupCallback = event => {
-          const keyCode = (0, _keycode.default)(event);
-          if (options.includedKeys.includes(keyCode) && typeof this.handleClickOutside === 'function') {
-            this.handleClickOutside(event, () => {
-              if (this.keyupCallback) window.removeEventListener('keyup', this.keyupCallback);
-            });
-          }
-        };
-        window.addEventListener('keyup', this.keyupCallback);
-      }
-    }
-  }
-  remove() {
-    if (this.handleClickOutside && typeof document !== 'undefined') {
-      document.removeEventListener('mousedown', this.handleClickOutside);
-      this.handleClickOutside = null;
-    }
-    if (this.keydownCallback && typeof window !== 'undefined') {
-      window.removeEventListener('keydown', this.keydownCallback);
-      this.keydownCallback = null;
-    }
-    if (this.keyupCallback && typeof window !== 'undefined') {
-      window.removeEventListener('keyup', this.keyupCallback);
-      this.keyupCallback = null;
-    }
-  }
-}
-exports.DetectOutsideClickClass = DetectOutsideClickClass;
-const checkIfHasScrollbar = elem => {
-  return elem && (elem.scrollHeight > elem.offsetHeight || elem.scrollWidth > elem.offsetWidth) && overflowIsScrollable(elem);
-};
-exports.checkIfHasScrollbar = checkIfHasScrollbar;
-const overflowIsScrollable = elem => {
-  const style = typeof window !== 'undefined' ? window.getComputedStyle(elem) : {};
-  return /scroll|auto/i.test((style.overflow || '') + (style.overflowX || '') + (style.overflowY || ''));
-};
 const makeUniqueId = function () {
   let prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'id-';
   let length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 8;
@@ -532,7 +396,7 @@ const getClosestScrollViewElement = currentElement => {
   return (0, _getPreviousSibling.getPreviousSibling)('.dnb-scroll-view', currentElement);
 };
 exports.getClosestScrollViewElement = getClosestScrollViewElement;
-const convertJsxToString = function (elements) {
+function convertJsxToString(elements) {
   let separator = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
   let transformWord = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : undefined;
   if (!Array.isArray(elements)) {
@@ -543,27 +407,34 @@ const convertJsxToString = function (elements) {
       if (transformWord) {
         word = transformWord(word);
       }
-      if (typeof word.props.children === 'string') {
-        word = word.props.children.trim();
-      } else if (Array.isArray(word.props.children)) {
+      if (Array.isArray(word.props.children)) {
         word = word.props.children.reduce((acc, word) => {
           if (typeof word !== 'string') {
-            word = process(word, separator, transformWord);
+            word = process(word);
           }
           if (typeof word === 'string') {
             acc = (acc + (separator || '') + word).trim();
           }
           return acc;
         }, '');
+      } else if (word.props.children) {
+        word = word.props.children;
+        if (typeof word !== 'string') {
+          word = process(word);
+        }
+        if (typeof word === 'string') {
+          word = word.trim();
+        } else {
+          return undefined;
+        }
       } else {
-        return null;
+        return undefined;
       }
     }
     return word;
   };
-  return elements.map(word => process(word)).filter(Boolean).join(separator).trim();
-};
-exports.convertJsxToString = convertJsxToString;
+  return Array.from(elements).map(word => process(word)).filter(Boolean).join(separator).trim();
+}
 function convertStatusToStateOnly(status, state) {
   return status ? state : null;
 }