@wix/design-system/dist/esm/Text/RawText.js

@wix/design-system

import React, { useMemo } from 'react';
import { st, classes } from './Text.st.css.js';
import { WixStyleReactMaskingContext } from '../WixStyleReactMaskingProvider/context';
const getStyleDataAttributes = (styleAttributes) => Object.keys(styleAttributes).reduce((acc, styleKey) => {
    acc[`data-${styleKey}`] = styleAttributes[styleKey];
    return acc;
}, {});
export const RawTextDefaultProps = {
    size: 'medium',
    secondary: false,
    skin: 'standard',
    light: false,
    weight: 'thin',
    tagName: 'span',
    listStyle: 'checkmark',
    widows: false,
    overflowWrap: 'normal',
};
const RawText = React.forwardRef(({ size = RawTextDefaultProps.size, secondary = RawTextDefaultProps.secondary, skin = RawTextDefaultProps.skin, light = RawTextDefaultProps.light, weight = RawTextDefaultProps.weight, tagName = RawTextDefaultProps.tagName, children, ellipsis, appendTo, flip, fixed, placement, maxWidth, zIndex, showTooltip, listStyle = RawTextDefaultProps.listStyle, id, widows = RawTextDefaultProps.widows, suffix, overflowWrap = RawTextDefaultProps.overflowWrap, renderChildren, renderElement, ...rest }, ref) => {
    const { dataHook, className, ...textProps } = rest;
    const styleAttributes = {
        size,
        secondary,
        skin,
        light,
        weight,
        widows,
        'list-style': listStyle,
        'overflow-wrap': overflowWrap,
    };
    const styleDataAttributes = getStyleDataAttributes(styleAttributes);
    const childrenWidows = useMemo(() => {
        if (!widows || typeof children !== 'string' || !children) {
            return children;
        }
        const textArray = children.split(' ');
        if (textArray.length <= 2)
            return children;
        const arrLength = textArray.length;
        const newChildrenArr = textArray.slice(0, arrLength - 2);
        newChildrenArr.push(textArray[arrLength - 2] + '\u00A0' + textArray[arrLength - 1]);
        return newChildrenArr.join(' ');
    }, [children, widows]);
    return (React.createElement(WixStyleReactMaskingContext.Consumer, null, ({ maskingClassNames }) => {
        const element = React.createElement(tagName, {
            ref,
            id,
            ...textProps,
            'data-hook': dataHook,
            'data-mask': !!maskingClassNames,
            className: st(classes.root, styleAttributes, className, maskingClassNames),
            ...styleDataAttributes,
        }, renderChildren({ text: childrenWidows, suffix }));
        return renderElement({
            element,
            suffix,
        });
    }));
});
RawText.displayName = 'Text';
export default RawText;
//# sourceMappingURL=RawText.js.map