koylu-vampir-design 0.0.16

package/dist/Markets/MarketWheel.js

@@ -0,0 +1,117 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MarketWheel = void 0;
+const react_1 = __importDefault(require("react"));
+const react_native_1 = require("react-native");
+const Views_1 = require("../Views");
+const Typography_1 = require("../Typography");
+const Utils_1 = require("../Utils");
+const MarketWheel = ({ degree = 0, ready, disabled, onPress }) => {
+    const [current, rotateTo] = react_1.default.useState(0);
+    const animation = new react_native_1.Animated.Value(0);
+    const animationRef = react_1.default.useRef(animation);
+    react_1.default.useEffect(() => {
+        react_native_1.Animated.timing(animationRef.current, {
+            toValue: current,
+            duration: degree === -1 ? 7000 : 20000,
+            easing: degree === -1 ? react_native_1.Easing.inOut(react_native_1.Easing.linear) : react_native_1.Easing.out(react_native_1.Easing.exp),
+            useNativeDriver: true
+        }).start();
+    }, [current]);
+    react_1.default.useEffect(() => {
+        if (!disabled) {
+            if (degree === -1) {
+                rotateTo(current - 180);
+            }
+            else {
+                let turn = 0;
+                while ((degree + turn) <= (current + 720)) {
+                    turn += 360 * 3;
+                }
+                rotateTo(degree + turn);
+            }
+        }
+    }, [degree]);
+    const { width } = react_native_1.Dimensions.get("window");
+    const wheelSize = ready ? width * .8 : width * .3;
+    return (react_1.default.createElement(react_native_1.View, { style: styles.wrapper },
+        react_1.default.createElement(Views_1.TouchableView, { style: styles.relative, onPress: onPress, disabled: disabled },
+            react_1.default.createElement(react_native_1.Animated.Image, { style: [styles.wheel, { width: wheelSize, height: wheelSize }, !!disabled && styles.wheelDisabled, {
+                        transform: [{
+                                rotate: animationRef.current.interpolate({
+                                    inputRange: [0, 360],
+                                    outputRange: ["0deg", "360deg"]
+                                })
+                            }]
+                    }], source: Utils_1.Assets.getSource("image", "cark") }),
+            ready ? react_1.default.createElement(react_native_1.Image, { source: Utils_1.Assets.getSource("image", "carkHandle"), style: styles.handle }) :
+                react_1.default.createElement(react_native_1.View, { style: styles.watchButton },
+                    react_1.default.createElement(react_native_1.Text, { style: styles.watchButtonText }, "\u0130ZLE"))),
+        !ready && react_1.default.createElement(react_native_1.View, { style: styles.info },
+            react_1.default.createElement(Typography_1.Typography, null, "\u00DCCRETS\u0130Z K\u0131sa bir video izledikten sonra \u00E7ark\u0131 \u00E7evir, y\u00FCzlerce alt\u0131n ya da elmas kazan."))));
+};
+exports.MarketWheel = MarketWheel;
+const styles = react_native_1.StyleSheet.create({
+    wrapper: {
+        width: "100%",
+        flexDirection: "row",
+        marginBottom: 20,
+        position: "relative",
+        alignItems: "center",
+        justifyContent: "center"
+    },
+    relative: {
+        flexDirection: "row",
+        position: "relative",
+        alignItems: "center",
+        justifyContent: "center"
+    },
+    wheel: {
+        resizeMode: "contain"
+    },
+    wheelDisabled: {
+        opacity: 0.5
+    },
+    handle: {
+        position: "absolute",
+        left: "50%",
+        top: "50%",
+        marginTop: -50,
+        marginLeft: -43,
+        width: 90,
+        height: 90,
+        resizeMode: "contain"
+    },
+    watchButton: {
+        position: "absolute",
+        top: "38%",
+        marginLeft: "auto",
+        marginRight: "auto",
+        borderRadius: 16,
+        backgroundColor: "#072d39",
+        paddingHorizontal: 10,
+        paddingVertical: 6,
+        shadowColor: "#000000",
+        shadowOffset: {
+            width: 4,
+            height: 6
+        },
+        shadowOpacity: 0.25,
+        shadowRadius: 5,
+        elevation: 5
+    },
+    watchButtonText: {
+        color: "#ffffff",
+        fontSize: 16,
+        fontWeight: "bold",
+        textAlign: "center",
+        letterSpacing: 0.5
+    },
+    info: {
+        flex: 1,
+        marginLeft: 20
+    }
+});

package/dist/Markets/index.d.ts

@@ -0,0 +1,5 @@
+export { MarketInfo } from "./MarketInfo";
+export { MarketCard } from "./MarketCard";
+export { MarketProduct } from "./MarketProduct";
+export { MarketWheel } from "./MarketWheel";
+//# sourceMappingURL=index.d.ts.map

package/dist/Markets/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Markets/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}

package/dist/Markets/index.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MarketWheel = exports.MarketProduct = exports.MarketCard = exports.MarketInfo = void 0;
+var MarketInfo_1 = require("./MarketInfo");
+Object.defineProperty(exports, "MarketInfo", { enumerable: true, get: function () { return MarketInfo_1.MarketInfo; } });
+var MarketCard_1 = require("./MarketCard");
+Object.defineProperty(exports, "MarketCard", { enumerable: true, get: function () { return MarketCard_1.MarketCard; } });
+var MarketProduct_1 = require("./MarketProduct");
+Object.defineProperty(exports, "MarketProduct", { enumerable: true, get: function () { return MarketProduct_1.MarketProduct; } });
+var MarketWheel_1 = require("./MarketWheel");
+Object.defineProperty(exports, "MarketWheel", { enumerable: true, get: function () { return MarketWheel_1.MarketWheel; } });

package/dist/Menus/MenuItem copy.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { StyleProp, GestureResponderEvent } from "react-native";
+declare type Props = {
+    style?: StyleProp<any>;
+    iconName?: string;
+    iconFont?: string;
+    color?: string;
+    onPress?: (event?: GestureResponderEvent) => void;
+};
+export declare const MenuItem: React.FC<Props>;
+export {};
+//# sourceMappingURL=MenuItem%20copy.d.ts.map

package/dist/Menus/MenuItem copy.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem copy.d.ts","sourceRoot":"","sources":["../../src/Menus/MenuItem copy.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAML,SAAS,EACT,qBAAqB,EAEtB,MAAM,cAAc,CAAC;AAOtB,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;CACnD,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA8BpC,CAAC"}

package/dist/Menus/MenuItem copy.js

@@ -0,0 +1,34 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenuItem = void 0;
+const react_1 = __importDefault(require("react"));
+const react_native_1 = require("react-native");
+const Buttons_1 = require("../Buttons");
+const Typography_1 = require("../Typography");
+const Icon_1 = require("../Utils/Icon");
+const Themes_1 = require("../Themes");
+const MenuItem = ({ children, style, color, onPress, iconName, }) => {
+    const { baseTextColor } = Themes_1.useColors();
+    const textColor = color ? color : baseTextColor;
+    return (react_1.default.createElement(Buttons_1.TouchableView, { onPress: onPress, wrapperStyle: [styles.wrapper, style], style: styles.container },
+        !!iconName && (react_1.default.createElement(Icon_1.Icon, { name: iconName, color: textColor, font: "MaterialIcons", style: styles.icon, size: 26 })),
+        react_1.default.createElement(Typography_1.Typography, { size: "large", color: textColor }, children)));
+};
+exports.MenuItem = MenuItem;
+const styles = react_native_1.StyleSheet.create({
+    wrapper: {
+        paddingHorizontal: 20,
+        paddingVertical: 8,
+        marginRight: "auto",
+    },
+    container: {
+        flexDirection: "row",
+        alignItems: "center",
+    },
+    icon: {
+        marginRight: 15,
+    },
+});

package/dist/Menus/MenuItem.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import { GestureResponderEvent, StyleProp } from "react-native";
+declare type Props = {
+    style?: StyleProp<any>;
+    iconName?: string;
+    iconFont?: string;
+    color?: string;
+    badge?: string;
+    feature?: boolean;
+    onPress?: (event?: GestureResponderEvent) => void;
+};
+export declare const MenuItem: React.FC<Props>;
+export {};
+//# sourceMappingURL=MenuItem.d.ts.map

package/dist/Menus/MenuItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../src/Menus/MenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,qBAAqB,EAAE,SAAS,EAAyB,MAAM,cAAc,CAAC;AAMvF,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;CACnD,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAqCpC,CAAC"}

package/dist/Menus/MenuItem.js

@@ -0,0 +1,63 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenuItem = void 0;
+const react_1 = __importDefault(require("react"));
+const react_native_1 = require("react-native");
+const Views_1 = require("../Views");
+const Typography_1 = require("../Typography");
+const Utils_1 = require("../Utils");
+const Themes_1 = require("../Themes");
+const MenuItem = ({ children, style, color, onPress, feature, iconName, iconFont = "MaterialIcons", badge }) => {
+    const { baseTextColor } = Themes_1.useColors();
+    const textColor = color ? color : baseTextColor;
+    return (react_1.default.createElement(Views_1.TouchableView, { onPress: onPress, wrapperStyle: [styles.wrapper, feature && styles.borderWrapper, style], style: [styles.container, feature && styles.border] },
+        !!iconName && (react_1.default.createElement(Utils_1.Icon, { name: iconName, color: textColor, font: iconFont, style: styles.icon, size: 18 })),
+        react_1.default.createElement(Typography_1.Typography, { size: 14, color: textColor, bold: feature, style: [feature && { textDecorationLine: "underline" }] }, children),
+        !!badge && react_1.default.createElement(react_native_1.View, { style: styles.badge },
+            react_1.default.createElement(react_native_1.Text, { style: styles.badgeText }, badge))));
+};
+exports.MenuItem = MenuItem;
+const styles = react_native_1.StyleSheet.create({
+    wrapper: {
+        paddingHorizontal: 20,
+        paddingVertical: 8,
+        marginRight: "auto"
+    },
+    borderWrapper: { marginRight: -10, marginLeft: -10 },
+    container: {
+        flexDirection: "row",
+        alignItems: "center"
+    },
+    border: {
+        flex: 1,
+        width: "100%",
+        borderWidth: 1,
+        borderColor: "#dcc20744",
+        backgroundColor: "#dcc20718",
+        paddingVertical: 10,
+        borderRadius: 8,
+        paddingHorizontal: 10
+    },
+    icon: {
+        marginRight: 15
+    },
+    badge: {
+        backgroundColor: "red",
+        marginLeft: "auto",
+        flexDirection: "row",
+        alignItems: "center",
+        justifyContent: "center",
+        width: 16,
+        height: 16,
+        borderRadius: 16
+    },
+    badgeText: {
+        color: "#ffffff",
+        fontSize: 11,
+        paddingLeft: 1,
+        fontWeight: "bold"
+    }
+});

package/dist/Menus/MenuLabel.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import { StyleProp } from "react-native";
+declare type Props = {
+    style?: StyleProp<any>;
+    color?: string;
+    iconName?: string;
+    rightText?: string;
+};
+export declare const MenuLabel: React.FC<Props>;
+export {};
+//# sourceMappingURL=MenuLabel.d.ts.map

package/dist/Menus/MenuLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuLabel.d.ts","sourceRoot":"","sources":["../../src/Menus/MenuLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAoB,MAAM,cAAc,CAAC;AAK3D,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA+BpC,CAAC"}

package/dist/Menus/MenuLabel.js

@@ -0,0 +1,43 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenuLabel = void 0;
+const react_1 = __importDefault(require("react"));
+const react_native_1 = require("react-native");
+const Typography_1 = require("../Typography");
+const Utils_1 = require("../Utils");
+const Themes_1 = require("../Themes");
+exports.MenuLabel = react_1.default.memo(({ children, style, color, rightText, iconName, }) => {
+    const { baseTextColor } = Themes_1.useColors();
+    const textColor = color ? color : baseTextColor;
+    return (react_1.default.createElement(react_native_1.View, { style: styles.container },
+        !!iconName && (react_1.default.createElement(Utils_1.Icon, { name: iconName, color: textColor, font: "MaterialIcons", style: styles.icon, size: 26 })),
+        react_1.default.createElement(Typography_1.Typography, { color: textColor, style: styles.text }, children),
+        !!rightText && (react_1.default.createElement(Typography_1.Typography, { color: textColor, style: [styles.text, styles.right] }, rightText))));
+});
+const styles = react_native_1.StyleSheet.create({
+    wrapper: {
+        marginRight: "auto",
+    },
+    container: {
+        paddingHorizontal: 20,
+        paddingTop: 8,
+        flexDirection: "row",
+        alignItems: "center",
+    },
+    icon: {
+        marginRight: 15,
+    },
+    text: {
+        fontWeight: "600",
+        opacity: 0.4,
+        fontSize: 12,
+        marginTop: 10,
+        marginBottom: 10,
+    },
+    right: {
+        marginLeft: "auto",
+    },
+});

package/dist/Menus/MenuLable.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { StyleProp, GestureResponderEvent } from "react-native";
+declare type Props = {
+    style?: StyleProp<any>;
+    iconName?: string;
+    iconFont?: string;
+    color?: string;
+    onPress?: (event?: GestureResponderEvent) => void;
+};
+export declare const MenuItem: React.FC<Props>;
+export {};
+//# sourceMappingURL=MenuLable.d.ts.map

package/dist/Menus/MenuLable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuLable.d.ts","sourceRoot":"","sources":["../../src/Menus/MenuLable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAML,SAAS,EACT,qBAAqB,EAEtB,MAAM,cAAc,CAAC;AAOtB,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;CACnD,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA8BpC,CAAC"}

package/dist/Menus/MenuLable.js

@@ -0,0 +1,34 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenuItem = void 0;
+const react_1 = __importDefault(require("react"));
+const react_native_1 = require("react-native");
+const Buttons_1 = require("../Buttons");
+const Typography_1 = require("../Typography");
+const Icon_1 = require("../Utils/Icon");
+const Themes_1 = require("../Themes");
+const MenuItem = ({ children, style, color, onPress, iconName, }) => {
+    const { baseTextColor } = Themes_1.useColors();
+    const textColor = color ? color : baseTextColor;
+    return (react_1.default.createElement(Buttons_1.TouchableView, { onPress: onPress, wrapperStyle: [styles.wrapper, style], style: styles.container },
+        !!iconName && (react_1.default.createElement(Icon_1.Icon, { name: iconName, color: textColor, font: "MaterialIcons", style: styles.icon, size: 26 })),
+        react_1.default.createElement(Typography_1.Typography, { size: "large", color: textColor }, children)));
+};
+exports.MenuItem = MenuItem;
+const styles = react_native_1.StyleSheet.create({
+    wrapper: {
+        paddingHorizontal: 20,
+        paddingVertical: 8,
+        marginRight: "auto",
+    },
+    container: {
+        flexDirection: "row",
+        alignItems: "center",
+    },
+    icon: {
+        marginRight: 15,
+    },
+});

package/dist/Menus/MenuOptions.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+import { GestureResponderEvent, StyleProp } from "react-native";
+declare type ItemValueType = string | number | boolean | null;
+declare type OptionItem = {
+    label: string;
+    value: ItemValueType;
+};
+declare type Props = {
+    style?: StyleProp<any>;
+    iconName?: string;
+    iconFont?: string;
+    color?: string;
+    badge?: string;
+    feature?: boolean;
+    value?: ItemValueType;
+    options?: Array<OptionItem>;
+    onPress?: (event?: GestureResponderEvent) => void;
+    onChange?: (value?: ItemValueType) => void;
+};
+export declare const MenuOptions: React.FC<Props>;
+export {};
+//# sourceMappingURL=MenuOptions.d.ts.map

package/dist/Menus/MenuOptions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuOptions.d.ts","sourceRoot":"","sources":["../../src/Menus/MenuOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,qBAAqB,EAAE,SAAS,EAA0B,MAAM,cAAc,CAAC;AAMxF,aAAK,aAAa,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,IAAI,CAAC;AAGtD,aAAK,UAAU,GAAG;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,aAAa,CAAA;CACrB,CAAA;AAGD,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,OAAO,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAClD,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,aAAa,KAAK,IAAI,CAAC;CAC5C,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAiDvC,CAAC"}

package/dist/Menus/MenuOptions.js

@@ -0,0 +1,114 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenuOptions = void 0;
+const react_1 = __importDefault(require("react"));
+const react_native_1 = require("react-native");
+const Views_1 = require("../Views");
+const Typography_1 = require("../Typography");
+const Utils_1 = require("../Utils");
+const Themes_1 = require("../Themes");
+const MenuOptions = ({ children, style, color, onPress, feature, iconName, iconFont = "MaterialIcons", badge, value, options, onChange, }) => {
+    const { baseTextColor } = Themes_1.useColors();
+    const textColor = color ? color : baseTextColor;
+    const setValue = (value) => {
+        onChange && onChange(value);
+    };
+    return (react_1.default.createElement(react_native_1.View, { style: [styles.wrapper, styles.container, feature && styles.border, style] },
+        react_1.default.createElement(Typography_1.Typography, { size: 14, color: textColor, bold: feature, style: [feature && { textDecorationLine: "underline" }] }, children),
+        !!badge && react_1.default.createElement(react_native_1.View, { style: styles.badge },
+            react_1.default.createElement(react_native_1.Text, { style: styles.badgeText }, badge)),
+        react_1.default.createElement(react_native_1.View, { style: styles.flex }),
+        !!iconName && (react_1.default.createElement(Utils_1.Icon, { name: iconName, color: textColor, font: iconFont, style: styles.icon, size: 18 })),
+        react_1.default.createElement(react_native_1.View, { style: styles.values }, !!options && options.map((item, key) => {
+            const isActive = item.value === value;
+            return react_1.default.createElement(Views_1.TouchableView, { onPress: () => setValue(item.value), style: [styles.value, isActive && styles.valueActive], wrapperStyle: styles.valueWrapper, key: key },
+                react_1.default.createElement(react_native_1.Text, { style: [styles.valueText, isActive && styles.valueTextActive] }, item.label));
+        }))));
+};
+exports.MenuOptions = MenuOptions;
+const styles = react_native_1.StyleSheet.create({
+    wrapper: {
+        paddingHorizontal: 20,
+        paddingVertical: 8,
+    },
+    container: {
+        flexDirection: "row",
+        alignItems: "center",
+        flexWrap: "wrap"
+    },
+    border: {
+        flex: 1,
+        borderWidth: 1,
+        borderColor: "#dcc20744",
+        backgroundColor: "#dcc20718",
+        paddingVertical: 10,
+        marginHorizontal: 10,
+        borderRadius: 8,
+        paddingHorizontal: 10
+    },
+    icon: {
+        marginRight: 0
+    },
+    flex: {
+        flex: 1,
+    },
+    badge: {
+        backgroundColor: "red",
+        marginLeft: "auto",
+        flexDirection: "row",
+        alignItems: "center",
+        justifyContent: "center",
+        width: 16,
+        height: 16,
+        borderRadius: 16
+    },
+    badgeText: {
+        color: "#ffffff",
+        fontSize: 11,
+        paddingLeft: 1,
+        fontWeight: "bold"
+    },
+    values: {
+        marginLeft: -3,
+        flexDirection: "row",
+        alignItems: "stretch",
+        paddingTop: 10,
+    },
+    valueWrapper: {
+        flex: 1,
+        alignItems: "stretch",
+        justifyContent: "center"
+    },
+    value: {
+        backgroundColor: "transparent",
+        borderColor: "#00B3FF",
+        borderWidth: 1,
+        marginLeft: 3,
+        flexDirection: "row",
+        alignItems: "center",
+        justifyContent: "center",
+        paddingHorizontal: 8,
+        paddingVertical: 8,
+        borderRadius: 3,
+    },
+    valueText: {
+        color: "#00B3FF",
+        fontSize: 11,
+        paddingLeft: 1,
+        borderBottomWidth: 1,
+        borderColor: "white",
+        fontWeight: "bold",
+        textAlign: "center"
+    },
+    valueActive: {
+        backgroundColor: "#00B3FF",
+        borderColor: "#00B3FF",
+        borderWidth: 1
+    },
+    valueTextActive: {
+        color: "#ffffff",
+    }
+});

package/dist/Menus/MenuUserItem.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import { ImageSourcePropType, StyleProp } from "react-native";
+declare type Props = {
+    style?: StyleProp<any>;
+    avatarStyle?: StyleProp<any>;
+    userName: string;
+    avatar: ImageSourcePropType;
+    color?: string;
+    isOnline?: boolean;
+};
+export declare const MenuUserItemComponent: React.FC<Props>;
+export declare const MenuUserItem: React.FC<Props>;
+export {};
+//# sourceMappingURL=MenuUserItem.d.ts.map

package/dist/Menus/MenuUserItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuUserItem.d.ts","sourceRoot":"","sources":["../../src/Menus/MenuUserItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,mBAAmB,EAAE,SAAS,EAAoB,MAAM,cAAc,CAAC;AAKhF,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,WAAW,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,mBAAmB,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA4BjD,CAAC;AAgCF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAqC,CAAC"}

package/dist/Menus/MenuUserItem.js

@@ -0,0 +1,51 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenuUserItem = exports.MenuUserItemComponent = void 0;
+const react_1 = __importDefault(require("react"));
+const react_native_1 = require("react-native");
+const Utils_1 = require("../Utils");
+const Typography_1 = require("../Typography");
+const Themes_1 = require("../Themes");
+const MenuUserItemComponent = ({ children, color, isOnline, avatar, style, avatarStyle, userName, }) => {
+    const { baseTextColor } = Themes_1.useColors();
+    const textColor = color ? color : baseTextColor;
+    return (react_1.default.createElement(react_native_1.View, { style: [styles.wrapper, style] },
+        !!avatar && (react_1.default.createElement(Utils_1.FadeImage, { opacity: 0.1, source: avatar, style: [styles.avatar, avatarStyle] })),
+        !!isOnline && react_1.default.createElement(react_native_1.View, { style: styles.isOnline }),
+        react_1.default.createElement(Typography_1.Typography, { size: 14, color: textColor, style: styles.name }, userName),
+        children));
+};
+exports.MenuUserItemComponent = MenuUserItemComponent;
+const styles = react_native_1.StyleSheet.create({
+    wrapper: {
+        paddingHorizontal: 20,
+        paddingVertical: 8,
+        marginRight: "auto",
+        flexDirection: "row",
+        alignItems: "center",
+    },
+    avatar: {
+        backgroundColor: "#000000",
+        height: 20,
+        width: 20,
+        marginRight: 8,
+        borderRadius: 5,
+    },
+    name: {
+        flex: 1,
+    },
+    isOnline: {
+        width: 10,
+        height: 10,
+        backgroundColor: "#00ee55",
+        borderRadius: 8,
+        borderWidth: 2,
+        borderColor: "#666666",
+        marginLeft: -12,
+        marginRight: 3,
+    },
+});
+exports.MenuUserItem = react_1.default.memo(exports.MenuUserItemComponent);

package/dist/Menus/UserBar.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import { StyleProp, GestureResponderEvent, ImageSourcePropType } from "react-native";
+declare type Props = {
+    style?: StyleProp<any>;
+    user: {
+        [key: string]: any;
+    };
+    avatar: ImageSourcePropType;
+    onMenuPress?: (event?: GestureResponderEvent) => void;
+    onUserPress?: (event?: GestureResponderEvent) => void;
+    onMarketPress?: (event?: GestureResponderEvent) => void;
+};
+export declare const UserBar: React.FC<Props>;
+export {};
+//# sourceMappingURL=UserBar.d.ts.map

package/dist/Menus/UserBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserBar.d.ts","sourceRoot":"","sources":["../../src/Menus/UserBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAML,SAAS,EACT,qBAAqB,EACrB,mBAAmB,EACpB,MAAM,cAAc,CAAC;AAOtB,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,IAAI,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC;IAC7B,MAAM,EAAE,mBAAmB,CAAC;IAC5B,WAAW,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACtD,WAAW,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACtD,aAAa,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;CACzD,CAAC;AAKF,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA2EnC,CAAC"}