import * as React from "react";
import { PixelRatio } from "react-native";
import { useDeviceSize } from "../hooks";
export var SizableContext = React.createContext({
    width: 0,
    height: 0,
    wPer: function() {
        return 0;
    },
    hPer: function() {
        return 0;
    },
    scaleWidth: function() {
        return 0;
    },
    scaleHeight: function() {
        return 0;
    },
    scaleFont: function() {
        return 0;
    }
});
export var SizableProvider = function(_a) {
    var defaultDeviceSize = _a.defaultDeviceSize,
        rotate = _a.rotate,
        children = _a.children;
    var _b = useDeviceSize({
            rotate: rotate,
            defaultDeviceSize: defaultDeviceSize
        }),
        width = _b.width,
        height = _b.height,
        baseDeviceSize = _b.baseDeviceSize;
    var wPer = function(dp) {
        return PixelRatio.roundToNearestPixel((dp * width) / 100);
    };
    var hPer = function(dp) {
        return PixelRatio.roundToNearestPixel((dp * height) / 100);
    };
    var scaleWidth = function(dp) {
        return PixelRatio.roundToNearestPixel(
            (dp * width) / baseDeviceSize.width
        );
    };
    var scaleHeight = function(dp) {
        return PixelRatio.roundToNearestPixel(
            (dp * height) / baseDeviceSize.height
        );
    };
    var scaleFont = function(dp) {
        var scaleRatio = Math.max(
            width / baseDeviceSize.width,
            height / baseDeviceSize.height
        );
        return PixelRatio.roundToNearestPixel(dp * scaleRatio);
    };
    var value = {
        width: width,
        height: height,
        wPer: wPer,
        hPer: hPer,
        scaleWidth: scaleWidth,
        scaleHeight: scaleHeight,
        scaleFont: scaleFont
    };
    return (
        <SizableContext.Provider value={value}>
            {children}
        </SizableContext.Provider>
    );
};
