'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var polished = require('polished');
var styled = require('styled-components');

const extractCSSVarName = (cssVar) => cssVar.substring(4, cssVar.length - 1);
const isUsingCssVar = (colorAlias) => colorAlias.startsWith('var(');
const getColorAliasValue = (colorAlias) => {
    if (isUsingCssVar(colorAlias)) {
        const varName = extractCSSVarName(colorAlias);
        return String(polished.cssVar(varName, '#000000'));
    }
    return colorAlias;
};
const getDarkenColor = (darkenKey, alias) => (props) => {
    try {
        const darkenValue = getColorAliasValue(String(props.theme.mode === 'dark'
            ? props.theme.alias.dark[darkenKey]
            : props.theme.alias.light[darkenKey]));
        const colorAlias = getColorAlias(alias, props.theme);
        if (typeof colorAlias !== 'string')
            throw new Error('Invalid alias');
        const colorValue = getColorAliasValue(colorAlias);
        return polished.darken(darkenValue, colorValue);
    }
    catch (error) {
        console.warn(error);
        return getColorAlias(alias, props.theme);
    }
};
const getLightenColor = (lightenKey, alias) => (props) => {
    try {
        const lightenValue = getColorAliasValue(String(props.theme.mode === 'dark'
            ? props.theme.alias.dark[lightenKey]
            : props.theme.alias.light[lightenKey]));
        const colorAlias = getColorAlias(alias, props.theme);
        if (typeof colorAlias !== 'string')
            throw new Error('Invalid alias');
        const colorValue = getColorAliasValue(colorAlias);
        return polished.lighten(lightenValue, colorValue);
    }
    catch (error) {
        console.warn(error);
        return getColorAlias(alias, props.theme);
    }
};
const transparentizeAliasColor = (darkenKey, alias) => (props) => {
    try {
        const transparentAmount = typeof darkenKey === 'number'
            ? darkenKey
            : getColorAliasValue(String(props.theme.mode === 'dark'
                ? props.theme.alias.dark[darkenKey]
                : props.theme.alias.light[darkenKey]));
        const colorAlias = getColorAlias(alias, props.theme);
        if (typeof colorAlias !== 'string')
            throw new Error('Invalid alias');
        const colorValue = getColorAliasValue(colorAlias);
        return polished.rgba(colorValue, Number(transparentAmount));
    }
    catch (error) {
        console.warn(error);
        return getColorAlias(alias, props.theme);
    }
};
const getFontSize = (fontSize) => {
    return styled.css `
    ${(props) => {
        const font = props.theme.font[fontSize];
        return `
        font-size: ${font.fontSize};
        line-height: ${font.lineHeight};
      `;
    }}
  `;
};
const getColorAlias = (alias, theme) => {
    if (theme) {
        return theme.mode === 'dark'
            ? theme.alias.dark[alias]
            : theme.alias.light[alias];
    }
    else {
        return (props) => {
            return props.theme.mode === 'dark'
                ? props.theme.alias.dark[alias]
                : props.theme.alias.light[alias];
        };
    }
};
const noop = () => { };
const slugify = (string) => string.toLowerCase().replace(/[^a-z0-9]/g, '-');
const unitJSX = null;
const getDefaultTransition = (element = 'all') => {
    return styled.css `
    transition: ${({ theme }) => `${element} ${theme.motion.speed.defaultS} ${theme.motion.easing.easeDefault}`};
  `;
};
/**
 *
 * Use this function for getting spacing values from the theme.
 * @param values {SpacingKey}
 * 's00' => 0px;
 * 's01' => 4px;
 * 's02' => 8px;
 * 's03' => 12px;
 * 's04' => 16px;
 * 's05' => 24px;
 * 's06' => 32px;
 * 's07' => 40px;
 * 's08' => 56px;
 * 's09' => 64px;
 * 's10' => 80px;
 */
const getSpacing = (...values) => (props) => {
    if (values.length > 4)
        console.warn('You added to many values');
    const spacing = props.theme.spacing;
    return values.reduce((acc, curr) => `${acc} ${spacing[curr]}`, '');
};
/**
 * Use this curried function for appending a string to the data-testid or data-trackid
 * provided to the component. This makes it easier to add those values the wrapper
 * element and sub-elements that a complex component might have.
 * @param id: the data-testid or data-trackid provided to the component
 * @returns function: (addon: string): string
 */
const getId = (id) => {
    return (addon) => id && addon ? `${id}-${addon}` : id ? id : undefined;
};
/**
 * Use this function for asserting if the value is undefined | null
 * @param value: string | number | undefined | null | readonly string[]
 * @returns {boolean}
 */
function isDifferentFromUndefinedOrNull(value) {
    return value !== undefined && value !== null;
}
const getComponentRoot = (componentRoot) => {
    let rootElem;
    if (!componentRoot) {
        rootElem =
            document.getElementById('main') ||
                document.getElementById('react-root') ||
                document.getElementById('root');
    }
    else {
        rootElem =
            typeof componentRoot === 'string'
                ? document.getElementById(componentRoot)
                : componentRoot;
    }
    return rootElem !== null ? rootElem : document.body;
};
const getFocusableElements = (content) => {
    return [
        ...(content
            ? content.querySelectorAll('a, button, input, textarea, select, details,[tabindex]:not([tabindex="-1"])')
            : []),
    ].filter((el) => !el.hasAttribute('disabled'));
};
const isDarkMode = (mode) => mode === 'dark';
const isLightMode = (mode) => mode === 'light';
const getModifiedColorByThemeMode = (lightenKey, alias) => (props) => {
    const darkMode = isDarkMode(props.theme.mode);
    try {
        const amount = getColorAliasValue(String(darkMode
            ? props.theme.alias.dark[lightenKey]
            : props.theme.alias.light[lightenKey]));
        const colorAlias = getColorAlias(alias, props.theme);
        if (typeof colorAlias !== 'string')
            throw new Error('Invalid alias');
        const colorValue = getColorAliasValue(colorAlias);
        return darkMode
            ? polished.lighten(amount, colorValue)
            : polished.darken(amount, colorValue);
    }
    catch (error) {
        console.warn(error);
        return getColorAlias(alias, props.theme);
    }
};
/**
 * Returns a predicate filter function to filter out a transient props
 * @param transientProps array of string keys.
 */
const convertToTransientProps = (transientProps) => {
    return (prop) => !transientProps.includes(prop);
};

exports.convertToTransientProps = convertToTransientProps;
exports.extractCSSVarName = extractCSSVarName;
exports.getColorAlias = getColorAlias;
exports.getColorAliasValue = getColorAliasValue;
exports.getComponentRoot = getComponentRoot;
exports.getDarkenColor = getDarkenColor;
exports.getDefaultTransition = getDefaultTransition;
exports.getFocusableElements = getFocusableElements;
exports.getFontSize = getFontSize;
exports.getId = getId;
exports.getLightenColor = getLightenColor;
exports.getModifiedColorByThemeMode = getModifiedColorByThemeMode;
exports.getSpacing = getSpacing;
exports.isDarkMode = isDarkMode;
exports.isDifferentFromUndefinedOrNull = isDifferentFromUndefinedOrNull;
exports.isLightMode = isLightMode;
exports.isUsingCssVar = isUsingCssVar;
exports.noop = noop;
exports.slugify = slugify;
exports.transparentizeAliasColor = transparentizeAliasColor;
exports.unitJSX = unitJSX;
