@ui5/webcomponents-react/wrappers/internal/utils.js

React Wrapper for UI5 Web Components and additional components

import { getCustomElementsScopingSuffix, getEffectiveScopingSuffixForTag, getScopedVarName } from '@ui5/webcomponents-base/dist/CustomElementsScope.js';
import { Children, cloneElement, Fragment } from 'react';
export function flattenFragments(children, depth = 1) {
  const flatChildren = [];
  const removeFragments = (element, level = 0, key = []) => {
    if (!element) {
      return;
    }
    if (Array.isArray(element)) {
      Children.toArray(element).forEach((child, index) => {
        removeFragments(child, level + 1, [...key, index]);
      });
      return;
    }
    if (element.type === Fragment && level <= depth) {
      Children.toArray(element.props?.children).forEach((item, index) => {
        removeFragments(item, level + 1, [...key, index]);
      });
    } else if (typeof element === 'string' || typeof element === 'number') {
      flatChildren.push(element);
    } else {
      flatChildren.push(/*#__PURE__*/cloneElement(element, {
        key: key.join('.')
      }));
    }
  };
  removeFragments(children);
  return flatChildren;
}
export function getUi5TagWithSuffix(baseTagName) {
  const tagNameSuffix = getEffectiveScopingSuffixForTag(baseTagName);
  return tagNameSuffix ? `${baseTagName}-${tagNameSuffix}` : baseTagName;
}
export const isSSR = () => typeof window === 'undefined';
export function trimAndRemoveSpaces(value) {
  return value.trim().replace(/\s\s+/g, ' ');
}

/**
 * @deprecated: will be removed in next minor release. Internal ui5 CSS vars are now defined on the host, making scoping redundant.
 */
export const cssVarVersionInfoPrefix = getScopedVarName('--_ui5_').replace('--_ui5_', '');
export function getTagNameWithoutScopingSuffix(tagName) {
  const tagNameSuffix = getCustomElementsScopingSuffix();
  return tagNameSuffix ? tagName.replace(`-${tagNameSuffix.toUpperCase()}`, '') : tagName;
}