@storybook/addon-ondevice-controls/dist/components/color-picker/utils.js

Display storybook controls on your device.

import tinycolor from 'tinycolor2';
import { PanResponder } from 'react-native';
/**
 * Converts color to hsv representation.
 * @param {string} color any color representation - name, hexa, rgb
 * @return {object} { h: number, s: number, v: number } object literal
 */
export function toHsv(color) {
    return tinycolor(color).toHsv();
}
/**
 * Converts hsv object to hexa color string.
 * @param {object} hsv { h: number, s: number, v: number } object literal
 * @return {string} color in hexa representation
 */
export function fromHsv(hsv) {
    return tinycolor(hsv).toHexString();
}
const fn = () => true;
/**
 * Simplified pan responder wrapper.
 */
export function createPanResponder({ onStart = fn, onMove = fn, onEnd = fn, }) {
    return PanResponder.create({
        onStartShouldSetPanResponder: fn,
        onStartShouldSetPanResponderCapture: fn,
        onMoveShouldSetPanResponder: fn,
        onMoveShouldSetPanResponderCapture: fn,
        onPanResponderTerminationRequest: fn,
        onPanResponderGrant: (evt, state) => {
            return onStart({ x: evt.nativeEvent.pageX, y: evt.nativeEvent.pageY }, evt, state);
        },
        onPanResponderMove: (evt, state) => {
            return onMove({ x: evt.nativeEvent.pageX, y: evt.nativeEvent.pageY }, evt, state);
        },
        onPanResponderRelease: (evt, state) => {
            return onEnd({ x: evt.nativeEvent.pageX, y: evt.nativeEvent.pageY }, evt, state);
        },
    });
}