@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
149 lines • 4.29 kB
JavaScript
import { Children, Fragment, createElement, isValidElement } from 'react';
import clsx from 'clsx';
import Space from "../space/Space.js";
import { createSpacing, isValidSpaceProp, removeSpaceProps } from "../space/SpacingUtils.js";
import { jsx as _jsx } from "react/jsx-runtime";
export const omitSpacingProps = removeSpaceProps;
export function pickSpacingProps(props) {
const obj = {};
for (const key in props) {
if (isValidSpaceProp(key) && typeof props[key] !== 'undefined') {
obj[key] = props[key];
}
}
return obj;
}
export function getSpaceValue(type, element) {
var _elementProps$type;
if (!isValidElement(element)) {
return undefined;
}
const elementProps = element.props || {};
return (_elementProps$type = elementProps?.[type]) !== null && _elementProps$type !== void 0 ? _elementProps$type : typeof elementProps?.space === 'object' ? elementProps.space[type] : undefined;
}
export function isHeadingElement(element) {
return isValidElement(element) && element?.type?._isHeadingElement === true;
}
export function getSpaceVariant(element) {
if (isValidElement(element)) {
var _props;
if (element?.type === Fragment) {
return 'children';
}
const check = element?.type?._supportsSpacingProps;
if (typeof check !== 'undefined') {
return check;
}
const keys = ['space', 'top', 'right', 'bottom', 'left'];
const props = (_props = element?.props) !== null && _props !== void 0 ? _props : {};
if (keys.some(key => key in props)) {
return true;
}
}
return undefined;
}
export function renderWithSpacing(element, spaceProps) {
const variant = getSpaceVariant(element);
const {
wrapInSpace = true
} = spaceProps;
if (variant === false) {
return element;
}
if (variant === 'passthrough') {
const childElement = element;
const children = childElement?.props?.children;
const childKey = childElement?.key;
const childProps = childElement?.props || {};
return Children.toArray(children).map((child, i) => {
const wrapped = wrapWithSpace({
element: child,
spaceProps,
wrapInSpace
});
return createElement(childElement.type, {
...childProps,
key: childKey ? `${childKey}-${i}` : `${i}`
}, wrapped);
});
}
if (variant === 'children') {
return Children.toArray(element).map(child => {
const children = child?.props?.children;
const childKey = child?.key;
const childProps = child?.props || {};
return Children.toArray(children).map((element, i) => {
return createElement(child.type, {
...childProps,
key: childKey ? `${childKey}-${i}` : i
}, wrapWithSpace({
element: element,
spaceProps,
wrapInSpace
}));
});
});
}
return wrapWithSpace({
element,
spaceProps,
variant,
wrapInSpace
});
}
function isIntrinsicElement(element) {
return isValidElement(element) && typeof element.type === 'string';
}
function wrapWithSpace({
element,
spaceProps,
variant = null,
wrapInSpace = true
}) {
const resolvedVariant = variant !== null && variant !== void 0 ? variant : getSpaceVariant(element);
const {
wrapInSpace: _,
key,
...props
} = spaceProps;
if (resolvedVariant === true) {
return createElement(element.type, {
...element.props,
key,
...props
});
}
if (resolvedVariant === 'children') {
return renderWithSpacing(element, spaceProps);
}
if (!wrapInSpace && isIntrinsicElement(element)) {
return cloneIntrinsicElementWithSpacing(element, spaceProps);
}
return _jsx(Space, {
...props,
children: element
}, key);
}
function cloneIntrinsicElementWithSpacing(element, {
wrapInSpace,
className,
style,
...spaceProps
}) {
if (!isValidElement(element)) {
return element;
}
const elementProps = element.props || {};
const spacing = createSpacing(spaceProps);
return createElement(element.type, {
...element.props,
key: spaceProps.key,
className: clsx(elementProps?.className, ...spacing.className, className),
style: {
...elementProps?.style,
...spacing.style,
...style
}
});
}
//# sourceMappingURL=utils.js.map