UNPKG

@oxyhq/services

Version:

OxyHQ Expo/React Native SDK — UI components, screens, and native features

85 lines (82 loc) 2.25 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = overlay; exports.isAnimatedValue = void 0; var _reactNative = require("react-native"); // Simple hex color manipulation without color package const hexToRgb = hex => { const r = parseInt(hex.slice(1, 3), 16); const g = parseInt(hex.slice(3, 5), 16); const b = parseInt(hex.slice(5, 7), 16); return [r, g, b]; }; const rgbToHex = (r, g, b) => { return `#${[r, g, b].map(x => { const hex = Math.round(x).toString(16); return hex.length === 1 ? '0' + hex : hex; }).join('')}`; }; const mixColors = (color1, color2, ratio) => { const [r1, g1, b1] = hexToRgb(color1); const [r2, g2, b2] = hexToRgb(color2); const r = r1 + (r2 - r1) * ratio; const g = g1 + (g2 - g1) * ratio; const b = b1 + (b2 - b1) * ratio; return rgbToHex(r, g, b); }; const isAnimatedValue = it => it instanceof _reactNative.Animated.Value; exports.isAnimatedValue = isAnimatedValue; function overlay(elevation, surfaceColor = '#121212') { if (isAnimatedValue(elevation)) { const inputRange = [0, 1, 2, 3, 8, 24]; // @ts-expect-error: TS doesn't seem to refine the type correctly return elevation.interpolate({ inputRange, outputRange: inputRange.map(elevation => { return calculateColor(surfaceColor, elevation); }) }); } // @ts-expect-error: TS doesn't seem to refine the type correctly return calculateColor(surfaceColor, elevation); } function calculateColor(surfaceColor, elevation = 1) { let overlayTransparency; if (elevation >= 1 && elevation <= 24) { overlayTransparency = elevationOverlayTransparency[elevation]; } else if (elevation > 24) { overlayTransparency = elevationOverlayTransparency[24]; } else { overlayTransparency = elevationOverlayTransparency[1]; } return mixColors(surfaceColor, '#FFFFFF', overlayTransparency * 0.01); } const elevationOverlayTransparency = { 1: 5, 2: 7, 3: 8, 4: 9, 5: 10, 6: 11, 7: 11.5, 8: 12, 9: 12.5, 10: 13, 11: 13.5, 12: 14, 13: 14.25, 14: 14.5, 15: 14.75, 16: 15, 17: 15.12, 18: 15.24, 19: 15.36, 20: 15.48, 21: 15.6, 22: 15.72, 23: 15.84, 24: 16 }; //# sourceMappingURL=overlay.js.map