@compositive/foundation/dist/surfaces/shadows/DropShadow.js

Compositive framework foundation package.

import { isNumber, isInstanceOf } from '@compositive/commons-predicates';
import { Spec } from '@compositive/commons-spec';
import '../../color/Color.js';
import '../../color/ColorContext.js';
import { black } from '../../color/colors.js';
import '@compositive/commons-sequences';
import { Shade } from '../../color/Shade.js';
import '../../color/contrast/getCIECAM02Contrast.js';
import 'chroma-js';
import '../../color/contrast/types.js';
import '../../color/UniformLightnessColorScale.js';
import '../../theming/ComputedTheme.js';
import '../../theming/Theme.js';
import 'react/jsx-runtime';
import '../../theming/ThemeContext.js';
import { Style } from '@compositive/primitives';
import 'react';
import '../../styling/resolveThemedStyleProperties.js';
import '../../styling/ThemedStyle.js';

const getShadowStyle = (elevation, tone) => {
    const blurRadius = elevation === 1 ? 3 : elevation * 2;
    const ambientShadow = {
        x: 0,
        y: elevation,
        blurRadius,
        color: tone.alpha((elevation + 10 + elevation / 9.38) / 100),
    };
    const directShadow = {
        x: 0,
        y: elevation < 10
            ? elevation % 2 === 0
                ? elevation - (elevation / 2 - 1)
                : elevation - (elevation - 1) / 2
            : elevation - 4,
        blurRadius,
        color: tone.alpha((24 - Math.round(elevation / 10)) / 100),
    };
    return new Style({ boxShadow: [ambientShadow, directShadow] });
};
class DropShadow extends Spec({
    elevation: isNumber,
    tone: isInstanceOf(Shade),
}) {
    constructor() {
        super(...arguments);
        this.type = "shadow";
    }
    process(parts, chain) {
        const { elevation = 0, tone = black } = this;
        return [
            elevation !== 0
                ? parts.addInnerStyles(getShadowStyle(elevation, tone))
                : parts,
            chain,
        ];
    }
}

export { DropShadow };
//# sourceMappingURL=DropShadow.js.map