koylu-vampir-design 1.0.25 → 1.0.26

package/dist/Buttons/GiftFrame.d.ts

@@ -4,6 +4,7 @@ declare type Props = {
     selected?: boolean;
     onPress: (event?: GestureResponderEvent) => void;
     gift: string;
+    size?: number;
 };
 export declare const GiftFrame: React.FC<Props>;
 export {};

package/dist/Buttons/GiftFrame.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GiftFrame.d.ts","sourceRoot":"","sources":["../../src/Buttons/GiftFrame.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,qBAAqB,EAKtB,MAAM,cAAc,CAAC;AAKtB,aAAK,KAAK,GAAG;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjD,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA0BrC,CAAC"}
+{"version":3,"file":"GiftFrame.d.ts","sourceRoot":"","sources":["../../src/Buttons/GiftFrame.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,qBAAqB,EAKtB,MAAM,cAAc,CAAC;AAKtB,aAAK,KAAK,GAAG;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjD,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAkCrC,CAAC"}

package/dist/Buttons/GiftFrame.js

@@ -8,19 +8,20 @@ const react_1 = __importDefault(require("react"));
 const react_native_1 = require("react-native");
 const Views_1 = require("../Views");
 const Utils_1 = require("../Utils");
-const GiftFrame = ({ selected, onPress, gift }) => {
+const GiftFrame = ({ selected, onPress, gift, size = 70, }) => {
     const renderIcon = () => {
         if (!gift.indexOf("a-")) {
             console.log("SRC", Utils_1.Assets.getSource("gift", gift));
-            return (react_1.default.createElement(react_native_1.Image, { source: Utils_1.Assets.getSource("gift", gift, "small"), accessibilityLabel: gift.replace("a-", ""), style: styles.giftImage }));
+            return (react_1.default.createElement(react_native_1.Image, { source: Utils_1.Assets.getSource("gift", gift, "small"), accessibilityLabel: gift.replace("a-", ""), style: [styles.giftImage, { width: size - 15, height: size - 15 }] }));
         }
         return react_1.default.createElement(react_native_1.Text, { style: styles.giftText }, gift);
     };
     return (react_1.default.createElement(Views_1.TouchableView, { out: selected, onPress: onPress, style: [
             styles.giftFrameWrapper,
+            { width: size, height: size },
             selected ? styles.giftFrameWrapperSelected : {},
         ] },
-        react_1.default.createElement(react_native_1.View, { style: styles.giftFrame }, renderIcon())));
+        react_1.default.createElement(react_native_1.View, { style: [styles.giftFrame, { width: size - 10, height: size - 10 }] }, renderIcon())));
 };
 exports.GiftFrame = GiftFrame;
 const styles = react_native_1.StyleSheet.create({

package/dist/Buttons/MenuButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuButton.d.ts","sourceRoot":"","sources":["../../src/Buttons/MenuButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAc,qBAAqB,EAAE,SAAS,EAAoB,MAAM,cAAc,CAAC;AAK9F,oBAAY,eAAe,GAAG;IAC5B,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,WAAW,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IAC7B,SAAS,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IAC3B,SAAS,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjD,WAAW,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,EAAE,GAAG,GAAG,CAAC,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;CAC7E,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAwGhD,CAAC"}
+{"version":3,"file":"MenuButton.d.ts","sourceRoot":"","sources":["../../src/Buttons/MenuButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAEL,qBAAqB,EACrB,SAAS,EAGV,MAAM,cAAc,CAAC;AAKtB,oBAAY,eAAe,GAAG;IAC5B,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,WAAW,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IAC7B,SAAS,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IAC3B,SAAS,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjD,WAAW,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,EAAE,GAAG,GAAG,CAAC,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;CAC7E,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAsGhD,CAAC"}

package/dist/Buttons/MenuButton.js

@@ -9,7 +9,7 @@ const react_native_1 = require("react-native");
 const Views_1 = require("../Views");
 const Icon_1 = require("../Utils/Icon");
 const Themes_1 = require("../Themes");
-const MenuButton = ({ children, style = {}, size, iconStyle, onPress, onLongPress, textStyle, iconFamily, type, buttonStyle, selected, icon, disabled, out = true, rightComponent }) => {
+const MenuButton = ({ children, style = {}, size, iconStyle, onPress, onLongPress, textStyle, iconFamily, type, buttonStyle, selected, icon, disabled, out = true, rightComponent, }) => {
     const buttonStyles = [styles.button];
     const textStyles = [styles.text];
     const iconStyles = [styles.icon];
@@ -69,7 +69,7 @@ const MenuButton = ({ children, style = {}, size, iconStyle, onPress, onLongPres
     }
     return (react_1.default.createElement(Views_1.TouchableView, { out: out, style: [...buttonStyles, style, disabled && styles.disabled], wrapperStyle: {
             marginLeft: style.marginLeft,
-            marginRight: style.marginRight
+            marginRight: style.marginRight,
         }, disabled: disabled, onPress: onPress, onLongPress: onLongPress },
         icon && (react_1.default.createElement(Icon_1.Icon, { name: icon, color: "#ffffff", font: iconFamily || "IconIon", size: 16, style: [...iconStyles, iconStyle] })),
         react_1.default.createElement(react_native_1.Text, { style: [...textStyles, textStyle] }, children),
@@ -95,61 +95,61 @@ const styles = react_native_1.StyleSheet.create({
         shadowColor: "#000000",
         shadowOffset: {
             width: 4,
-            height: 6
+            height: 6,
         },
         shadowOpacity: 0.25,
         shadowRadius: 5,
-        elevation: 5
+        elevation: 5,
     },
     lightBlue: {
         backgroundColor: "#4BC3F6",
         width: "auto",
-        height: 44
+        height: 44,
     },
     disabled: {
         backgroundColor: "#aaaaaa",
         borderColor: "#cccccc",
         shadowOpacity: 0,
         shadowRadius: 0,
-        elevation: 0
+        elevation: 0,
     },
     icon: {
         width: 18,
         height: 18,
         marginRight: 6,
-        marginLeft: 0
+        marginLeft: 0,
     },
     text: {
         color: "white",
         textAlign: "center",
         fontFamily: "Righteous-Regular",
         fontSize: 14,
-        fontWeight: "bold"
+        fontWeight: "bold",
     },
     lightBlueText: {
         fontSize: 13,
-        color: "#ffffff"
+        color: "#ffffff",
     },
     outline: {
         backgroundColor: "#88888833",
         borderColor: "#ee7461",
         borderWidth: 3,
-        shadowOpacity: 0
+        shadowOpacity: 0,
     },
     outlineText: {
-        color: "#ee7461"
+        color: "#ee7461",
     },
     medium: {
         height: 44,
         width: "auto",
-        paddingHorizontal: 25
+        paddingHorizontal: 25,
     },
     small: {
         height: 28,
         width: "auto",
-        paddingHorizontal: 20
+        paddingHorizontal: 20,
     },
     smallText: {
-        fontSize: 13
-    }
+        fontSize: 13,
+    },
 });

package/dist/Markets/MarketInfo.d.ts

@@ -3,13 +3,17 @@ import React from "react";
 declare type Props = {
     gold: number;
     diamond: number;
+    ticket: number;
     gifts: number;
+    style: any;
     goldIcon: ImageSourcePropType;
     diamondIcon: ImageSourcePropType;
+    ticketIcon: ImageSourcePropType;
     giftIcon: ImageSourcePropType;
     titleText?: string;
     myGoldsText?: string;
     myDiamondsText?: string;
+    myTicketsText?: string;
     myGiftsText?: string;
 };
 export declare const MarketInfo: React.FC<Props & ViewProps>;

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

@@ -1 +1 @@
-{"version":3,"file":"MarketInfo.d.ts","sourceRoot":"","sources":["../../src/Markets/MarketInfo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAS,mBAAmB,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAC;AACvF,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,aAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,mBAAmB,CAAC;IAC9B,WAAW,EAAE,mBAAmB,CAAC;IACjC,QAAQ,EAAE,mBAAmB,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;CAEtB,CAAA;AACD,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,GAAG,SAAS,CA4BlD,CAAC"}
+{"version":3,"file":"MarketInfo.d.ts","sourceRoot":"","sources":["../../src/Markets/MarketInfo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,mBAAmB,EAGnB,SAAS,EACV,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,aAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,GAAG,CAAC;IACX,QAAQ,EAAE,mBAAmB,CAAC;IAC9B,WAAW,EAAE,mBAAmB,CAAC;IACjC,UAAU,EAAE,mBAAmB,CAAC;IAChC,QAAQ,EAAE,mBAAmB,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AACF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,GAAG,SAAS,CA8ClD,CAAC"}

package/dist/Markets/MarketInfo.js

@@ -7,9 +7,9 @@ exports.MarketInfo = void 0;
 const react_native_1 = require("react-native");
 const react_1 = __importDefault(require("react"));
 const Typography_1 = require("../Typography");
-const MarketInfo = ({ gold, diamond, gifts, goldIcon, diamondIcon, giftIcon, titleText = "Hesabım", myGoldsText = "Altınlarım:", myDiamondsText = "Elmaslarım:", myGiftsText = "Hediyelerim:" }) => {
-    return react_1.default.createElement(react_native_1.View, { style: styles.info },
-        react_1.default.createElement(Typography_1.Typography, { bold: true, style: styles.title }, titleText),
+const MarketInfo = ({ gold, diamond, gifts, style, ticket, goldIcon, diamondIcon, ticketIcon, giftIcon, titleText, myGoldsText = "Altınlarım:", myDiamondsText = "Elmaslarım:", myTicketsText = "Elmaslarım:", myGiftsText = "Hediyelerim:", }) => {
+    return (react_1.default.createElement(react_native_1.View, { style: [styles.info, style] },
+        !!titleText && (react_1.default.createElement(Typography_1.Typography, { bold: true, style: styles.title }, titleText)),
         react_1.default.createElement(react_native_1.View, { style: styles.line },
             react_1.default.createElement(Typography_1.Typography, { style: styles.label }, myGoldsText),
             react_1.default.createElement(Typography_1.Typography, { bold: true }, gold),
@@ -18,37 +18,41 @@ const MarketInfo = ({ gold, diamond, gifts, goldIcon, diamondIcon, giftIcon, tit
             react_1.default.createElement(Typography_1.Typography, { style: styles.label }, myDiamondsText),
             react_1.default.createElement(Typography_1.Typography, { bold: true }, diamond),
             react_1.default.createElement(react_native_1.Image, { style: styles.image, source: diamondIcon })),
+        react_1.default.createElement(react_native_1.View, { style: styles.line },
+            react_1.default.createElement(Typography_1.Typography, { style: styles.label }, myTicketsText),
+            react_1.default.createElement(Typography_1.Typography, { bold: true }, ticket),
+            react_1.default.createElement(react_native_1.Image, { style: styles.image, source: ticketIcon })),
         react_1.default.createElement(react_native_1.View, { style: styles.line },
             react_1.default.createElement(Typography_1.Typography, { style: styles.label }, myGiftsText),
             react_1.default.createElement(Typography_1.Typography, { bold: true }, gifts),
-            react_1.default.createElement(react_native_1.Image, { style: styles.image, source: giftIcon })));
+            react_1.default.createElement(react_native_1.Image, { style: styles.image, source: giftIcon }))));
 };
 exports.MarketInfo = MarketInfo;
 const styles = react_native_1.StyleSheet.create({
     info: {
         flex: 1,
-        padding: 20
+        padding: 20,
     },
     line: {
-        paddingVertical: 4,
-        paddingHorizontal: 10,
-        borderRadius: 8,
-        backgroundColor: "#00000020",
+        paddingVertical: 0,
+        borderBottomColor: "#e0e0e022",
+        borderBottomWidth: 1,
+        paddingHorizontal: 0,
         flexDirection: "row",
         alignItems: "center",
-        marginBottom: 10
+        marginBottom: 10,
     },
     label: {
-        marginRight: "auto"
+        marginRight: "auto",
     },
     title: {
         textAlign: "center",
-        marginBottom: 20
+        marginBottom: 20,
     },
     image: {
         width: 30,
         height: 30,
         marginLeft: 10,
-        resizeMode: "contain"
-    }
+        resizeMode: "contain",
+    },
 });

package/dist/Menus/MenuOptions.d.ts

@@ -12,6 +12,7 @@ declare type Props = {
     color?: string;
     badge?: string;
     feature?: boolean;
+    disabled?: boolean;
     value?: ItemValueType;
     options?: Array<OptionItem>;
     onPress?: (event?: GestureResponderEvent) => void;

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

@@ -1 +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,CAkDvC,CAAC"}
+{"version":3,"file":"MenuOptions.d.ts","sourceRoot":"","sources":["../../src/Menus/MenuOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EACL,qBAAqB,EACrB,SAAS,EAIV,MAAM,cAAc,CAAC;AAMtB,aAAK,aAAa,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,IAAI,CAAC;AAEtD,aAAK,UAAU,GAAG;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,aAAa,CAAC;CACtB,CAAC;AAEF,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,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,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,CAmFvC,CAAC"}

package/dist/Menus/MenuOptions.js

@@ -10,24 +10,34 @@ 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 MenuOptions = ({ children, style, color, onPress, feature, iconName, disabled, iconFont = "MaterialIcons", badge, value, options, onChange, }) => {
     const { baseTextColor } = Themes_1.useColors();
     const textColor = color ? color : baseTextColor;
     const setValue = (value) => {
+        if (disabled) {
+            return;
+        }
         onChange && onChange(value);
     };
-    return (react_1.default.createElement(react_native_1.View, { style: [styles.wrapper, styles.container, feature && styles.border, style] },
+    return (react_1.default.createElement(react_native_1.View, { style: [
+            styles.wrapper,
+            styles.container,
+            feature && styles.border,
+            disabled && { opacity: 0.5 },
+            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)),
+        !!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(react_native_1.View, { accessibilityElementsHidden: true },
             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], accessibilityState: { selected: isActive }, wrapperStyle: styles.valueWrapper, key: key },
-                react_1.default.createElement(react_native_1.Text, { style: [styles.valueText, isActive && styles.valueTextActive] }, item.label));
-        }))));
+        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), disabled: disabled, style: [styles.value, isActive && styles.valueActive], accessibilityState: { selected: isActive }, 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({
@@ -38,7 +48,7 @@ const styles = react_native_1.StyleSheet.create({
     container: {
         flexDirection: "row",
         alignItems: "center",
-        flexWrap: "wrap"
+        flexWrap: "wrap",
     },
     border: {
         flex: 1,
@@ -48,10 +58,10 @@ const styles = react_native_1.StyleSheet.create({
         paddingVertical: 10,
         marginHorizontal: 10,
         borderRadius: 8,
-        paddingHorizontal: 10
+        paddingHorizontal: 10,
     },
     icon: {
-        marginRight: 0
+        marginRight: 0,
     },
     flex: {
         flex: 1,
@@ -64,13 +74,13 @@ const styles = react_native_1.StyleSheet.create({
         justifyContent: "center",
         width: 16,
         height: 16,
-        borderRadius: 16
+        borderRadius: 16,
     },
     badgeText: {
         color: "#ffffff",
         fontSize: 11,
         paddingLeft: 1,
-        fontWeight: "bold"
+        fontWeight: "bold",
     },
     values: {
         marginLeft: -3,
@@ -81,7 +91,7 @@ const styles = react_native_1.StyleSheet.create({
     valueWrapper: {
         flex: 1,
         alignItems: "stretch",
-        justifyContent: "center"
+        justifyContent: "center",
     },
     value: {
         backgroundColor: "transparent",
@@ -100,14 +110,14 @@ const styles = react_native_1.StyleSheet.create({
         fontSize: 11,
         paddingLeft: 1,
         fontWeight: "bold",
-        textAlign: "center"
+        textAlign: "center",
     },
     valueActive: {
         backgroundColor: "#00B3FF",
         borderColor: "#00B3FF",
-        borderWidth: 1
+        borderWidth: 1,
     },
     valueTextActive: {
         color: "#ffffff",
-    }
+    },
 });

package/dist/Menus/MenuUserItem.d.ts

@@ -3,10 +3,12 @@ import { ImageSourcePropType, StyleProp } from "react-native";
 declare type Props = {
     style?: StyleProp<any>;
     avatarStyle?: StyleProp<any>;
+    icon?: string;
     userName: string;
     avatar: ImageSourcePropType;
     color?: string;
     isOnline?: boolean;
+    onNamePress?: () => void;
 };
 export declare const MenuUserItemComponent: React.FC<Props>;
 export declare const MenuUserItem: React.FC<Props>;

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

@@ -1 +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"}
+{"version":3,"file":"MenuUserItem.d.ts","sourceRoot":"","sources":["../../src/Menus/MenuUserItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,mBAAmB,EACnB,SAAS,EAIV,MAAM,cAAc,CAAC;AAKtB,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,WAAW,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,mBAAmB,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAqDjD,CAAC;AAmCF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAqC,CAAC"}

package/dist/Menus/MenuUserItem.js

@@ -9,13 +9,18 @@ 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 MenuUserItemComponent = ({ children, color, isOnline, avatar, icon, style, onNamePress, avatarStyle, userName, }) => {
     const { baseTextColor } = Themes_1.useColors();
     const textColor = color ? color : baseTextColor;
+    const _renerContent = () => {
+        return (react_1.default.createElement(react_1.default.Fragment, null,
+            !!icon && (react_1.default.createElement(Typography_1.Typography, { size: 14, style: styles.icon }, icon)),
+            !!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)));
+    };
     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),
+        !!onNamePress ? (react_1.default.createElement(react_native_1.TouchableOpacity, { onPress: onNamePress, style: { flex: 1, flexDirection: "row" } }, _renerContent())) : (_renerContent()),
         children));
 };
 exports.MenuUserItemComponent = MenuUserItemComponent;
@@ -34,6 +39,9 @@ const styles = react_native_1.StyleSheet.create({
         marginRight: 8,
         borderRadius: 5,
     },
+    icon: {
+        marginRight: 10,
+    },
     name: {
         flex: 1,
     },

package/dist/Messages/MessageList.js

@@ -106,7 +106,7 @@ const styles = react_native_1.StyleSheet.create({
     },
     flatList: {
         paddingHorizontal: 8,
-        backgroundColor: "#E2D2EE",
+        backgroundColor: "#ffffff66",
         borderRadius: 16,
     },
     flatListDark: {
@@ -144,7 +144,7 @@ const styles = react_native_1.StyleSheet.create({
     //    backgroundColor: "rgba(162,157,157,0.4)",
     },
     messageUserCenter: {
-        alignSelf: "center",
+        //alignSelf: "center",
         paddingLeft: 30,
     },
     messageUserView: {
@@ -154,9 +154,9 @@ const styles = react_native_1.StyleSheet.create({
         marginRight: 6,
     },
     messageUser: {
-        lineHeight: 14,
+        lineHeight: 18,
         color: "#ffffff",
-        fontSize: 10,
+        fontSize: 14,
         paddingVertical: 2,
         paddingHorizontal: 8,
     },
@@ -173,8 +173,8 @@ const styles = react_native_1.StyleSheet.create({
     },
     messageTextCenter: {
         paddingHorizontal: 20,
-        alignSelf: "center",
-        textAlign: "center",
+        //    alignSelf: "center",
+        //    textAlign: "center",
     },
     messageNumber: {
         backgroundColor: "rgba(42,40,40,0.4)",
@@ -193,7 +193,8 @@ const styles = react_native_1.StyleSheet.create({
         color: "#ffffff",
         textAlign: "center",
         fontWeight: "bold",
-        fontSize: 12,
+        fontSize: 14,
+        lineHeight: 16,
     },
     lightText: {
         color: "#cecece",

package/dist/Navbars/UserBar.d.ts

@@ -9,6 +9,7 @@ declare type Props = {
     onMenuPress?: (event?: GestureResponderEvent) => void;
     onUserPress?: (event?: GestureResponderEvent) => void;
     onMarketPress?: (event?: GestureResponderEvent) => void;
+    renderStartButton?: (any: any) => void;
 };
 export declare const UserBar: React.FC<Props>;
 export {};

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

@@ -1 +1 @@
-{"version":3,"file":"UserBar.d.ts","sourceRoot":"","sources":["../../src/Navbars/UserBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAGL,qBAAqB,EAGrB,SAAS,EAGV,MAAM,cAAc,CAAC;AAMtB,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,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,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,CA0GnC,CAAC"}
+{"version":3,"file":"UserBar.d.ts","sourceRoot":"","sources":["../../src/Navbars/UserBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAGL,qBAAqB,EAGrB,SAAS,EAGV,MAAM,cAAc,CAAC;AAatB,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,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,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;IACxD,iBAAiB,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,IAAI,CAAC;CACnC,CAAC;AAKF,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAuHnC,CAAC"}

package/dist/Navbars/UserBar.js

@@ -12,7 +12,7 @@ const Typography_1 = require("../Typography");
 const react_native_safe_area_context_1 = require("react-native-safe-area-context");
 const goldIcon = require("../assets/images/gold.png");
 const diamondIcon = require("../assets/images/diamond.png");
-const UserBar = ({ user, onMenuPress, badge, onUserPress, onMarketPress }) => {
+const UserBar = ({ user, onMenuPress, badge, onUserPress, onMarketPress, renderStartButton, }) => {
     const animation = new react_native_1.Animated.Value(-200);
     const animationRef = react_1.default.useRef(animation);
     const baseTextColor = "#ffffff";
@@ -28,7 +28,7 @@ const UserBar = ({ user, onMenuPress, badge, onUserPress, onMarketPress }) => {
             delay: 400,
             duration: 600,
             useNativeDriver: true,
-            easing: react_native_1.Easing.out(react_native_1.Easing.back(1))
+            easing: react_native_1.Easing.out(react_native_1.Easing.back(1)),
         }).start();
     }, []);
     const translateY = animationRef.current;
@@ -36,7 +36,7 @@ const UserBar = ({ user, onMenuPress, badge, onUserPress, onMarketPress }) => {
     return (react_1.default.createElement(react_native_1.Animated.View, { style: [
             styles.wrapper,
             { transform: [{ translateY }] },
-            apperence ? styles[apperence] : {}
+            apperence ? styles[apperence] : {},
         ] },
         react_1.default.createElement(react_native_1.View, { style: [styles.safeArea, { marginTop: insets.top + 50 }] },
             react_1.default.createElement(Utils_1.Stack, { type: "horizontal", style: { alignItems: "center", paddingRight: 10 }, space: "none" },
@@ -49,6 +49,10 @@ const UserBar = ({ user, onMenuPress, badge, onUserPress, onMarketPress }) => {
                     react_1.default.createElement(Typography_1.Typography, { color: baseTextColor, size: nameSize, style: { maxWidth: 150, flex: 0 } }, user.name)),
                 react_1.default.createElement(Utils_1.Flex, null),
                 react_1.default.createElement(Views_1.TouchableView, { out: true, onPress: onMarketPress, style: styles.pressables },
+                    !gold &&
+                        !diamond &&
+                        !!renderStartButton &&
+                        renderStartButton(user),
                     !!gold && (react_1.default.createElement(react_1.default.Fragment, null,
                         react_1.default.createElement(react_native_1.Image, { source: goldIcon, style: styles.icon, accessibilityLabel: "Alt\u0131nlar\u0131n:" }),
                         react_1.default.createElement(Typography_1.Typography, { color: baseTextColor }, gold))),
@@ -63,22 +67,22 @@ const styles = react_native_1.StyleSheet.create({
         borderBottomLeftRadius: 32,
         borderBottomRightRadius: 32,
         paddingBottom: 2,
-        marginTop: -50
+        marginTop: -50,
     },
     isAdmin: {
         borderColor: "#FF242E99",
         borderWidth: 2,
         marginLeft: -2,
-        marginRight: -2
+        marginRight: -2,
     },
     isMod: {
         borderColor: "#ffff00AA",
         borderWidth: 2,
         marginLeft: -2,
-        marginRight: -2
+        marginRight: -2,
     },
     safeArea: {
-        flexDirection: "column"
+        flexDirection: "column",
     },
     avatarBorder: {
         marginLeft: -5,
@@ -91,19 +95,19 @@ const styles = react_native_1.StyleSheet.create({
     avatar: {
         height: 34,
         width: 34,
-        backgroundColor: "#00000033"
+        backgroundColor: "#00000033",
     },
     pressables: {
         flexDirection: "row",
         alignItems: "center",
         flexWrap: "nowrap",
-        padding: 10
+        padding: 10,
     },
     icon: {
         height: 20,
         width: 24,
         margin: 5,
-        resizeMode: "contain"
+        resizeMode: "contain",
     },
     badge: {
         backgroundColor: "red",
@@ -117,6 +121,6 @@ const styles = react_native_1.StyleSheet.create({
         marginRight: -6,
         position: "relative",
         top: -5,
-        left: -5
-    }
+        left: -5,
+    },
 });

package/dist/Players/PlayerPreview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PlayerPreview.d.ts","sourceRoot":"","sources":["../../src/Players/PlayerPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAKY,SAAS,EAC3B,MAAM,cAAc,CAAC;AAKtB,aAAK,KAAK,GAAG;IACX,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACnB,QAAQ,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;CAClC,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAiOzC,CAAC"}
+{"version":3,"file":"PlayerPreview.d.ts","sourceRoot":"","sources":["../../src/Players/PlayerPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAML,SAAS,EACV,MAAM,cAAc,CAAC;AAKtB,aAAK,KAAK,GAAG;IACX,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACnB,QAAQ,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC;CACnC,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA4OzC,CAAC"}

package/dist/Players/PlayerPreview.js

@@ -28,8 +28,8 @@ const react_native_1 = require("react-native");
 const react_native_linear_gradient_1 = __importDefault(require("react-native-linear-gradient"));
 const Animatable = __importStar(require("react-native-animatable"));
 const Utils_1 = require("../Utils");
-const PlayerPreview = ({ alwaysGift, tempGift, bg, bc, name, number, style, deadAvatar, role, customName, frame, roles = [], deadBg, userData = {} }) => {
-    const { alwaysFirstActive, alwaysLastActive, primaryRoleActive, customNameActive, customFrame, customFrameActive, frameActive, primaryRole } = userData;
+const PlayerPreview = ({ alwaysGift, tempGift, bg, bc, name, number, style, deadAvatar, role, customName, frame, roles = [], deadBg, userData = {}, }) => {
+    const { alwaysFirstActive, alwaysLastActive, primaryRoleActive, customNameActive, customFrame, customFrameActive, frameActive, primaryRole, } = userData;
     let colors = ["#71a6d6", "#56C0BE", "#6b9fcb"];
     let borderColor = "";
     const gold = parseFloat(userData.gold) || 0;
@@ -37,9 +37,10 @@ const PlayerPreview = ({ alwaysGift, tempGift, bg, bc, name, number, style, dead
     const isWhiteBorder = userData.isAnonymous === false;
     const isGoldBorder = gold > 80000;
     const isGoldGift = gold > 120000;
+    const isGoldGift2 = gold > 500000;
     const isDiamondBorder = diamond > 0;
     const isDiamondTheme = diamond > 10;
-    isGoldBorder && (colors = ['#71a6d6', '#56C0BE', '#efd979']);
+    isGoldBorder && (colors = ["#71a6d6", "#56C0BE", "#efd979"]);
     isWhiteBorder && (borderColor = "#ffffff");
     if (isDiamondBorder) {
         colors[0] = "#a7abff";
@@ -61,7 +62,7 @@ const PlayerPreview = ({ alwaysGift, tempGift, bg, bc, name, number, style, dead
         borderColor = bc;
     }
     if (deadBg) {
-        colors = ['#292929cc', '#00000044', '#292929cc'];
+        colors = ["#292929cc", "#00000044", "#292929cc"];
         borderColor = isWhiteBorder ? "#ffffff" : "";
     }
     const gifts = [];
@@ -78,23 +79,20 @@ const PlayerPreview = ({ alwaysGift, tempGift, bg, bc, name, number, style, dead
         gifts.push(userData.alwaysGift);
     }
     if (isGoldGift && gifts.length < 2) {
-        gifts.push('✨');
+        gifts.push(isGoldGift2 ? "🌟" : "✨");
     }
     if (isDiamondTheme && gifts.length < 2) {
-        gifts.push('💎');
+        gifts.push("💎");
     }
     const giftIndex = !!gifts ? gifts.length : 0;
     let giftsArray = !!gifts
-        ? Object.keys(gifts)
-            .sort()
-            .reverse()
-            .slice(0, 2)
+        ? Object.keys(gifts).sort().reverse().slice(0, 2)
         : [];
-    giftsArray = gifts ? giftsArray.map(time => gifts[time]).reverse() : [];
+    giftsArray = gifts ? giftsArray.map((time) => gifts[time]).reverse() : [];
     const selectedRole = role
-        ? roles.filter(item => item.key === role)[0]
+        ? roles.filter((item) => item.key === role)[0]
         : primaryRoleActive
-            ? roles.filter(item => item.key === primaryRole)[0]
+            ? roles.filter((item) => item.key === primaryRole)[0]
             : null;
     const selectedNumber = number
         ? number
@@ -114,19 +112,19 @@ const PlayerPreview = ({ alwaysGift, tempGift, bg, bc, name, number, style, dead
                 fontWeight: "bold",
                 textShadowColor: "rgba(0, 0, 0, 0.1)",
                 textShadowOffset: { width: 1, height: 1 },
-                textShadowRadius: 5
+                textShadowRadius: 5,
             };
         }
     }
     const deadAnimRef = react_1.default.useRef(null);
     const avatarSource = Utils_1.Assets.getSource("avatar", userData.avatar);
     const renderContent = () => {
-        return react_1.default.createElement(react_1.default.Fragment, null,
+        return (react_1.default.createElement(react_1.default.Fragment, null,
             react_1.default.createElement(react_native_1.Text, { style: [styles.name, userNameColor], numberOfLines: 1 }, userName),
             deadAvatar ? (react_1.default.createElement(Animatable.View, { animation: "slideInUp", ref: deadAnimRef },
                 react_1.default.createElement(react_native_1.Image, { source: Utils_1.Assets.getSource("tombStone", deadAvatar), style: [
                         styles.deadAvatar,
-                        selectedRole ? { bottom: 12, height: "80%" } : {}
+                        selectedRole ? { bottom: 12, height: "80%" } : {},
                     ] }))) : (react_1.default.createElement(react_native_1.Image, { source: avatarSource, style: styles.avatar })),
             !!giftsArray.length && (react_1.default.createElement(react_native_1.View, { style: styles.gifts }, giftsArray.map((item, key) => {
                 return item.indexOf("a") === 0 ? (react_1.default.createElement(Animatable.Image, { animation: "bounceIn", duration: 2000, source: Utils_1.Assets.getSource("gift", item), useNativeDriver: true, key: `${key}`, style: styles.giftImage })) : (react_1.default.createElement(Animatable.Text, { animation: "bounceIn", useNativeDriver: true, duration: 2000, key: key + giftIndex, style: styles.gift }, item));
@@ -135,10 +133,9 @@ const PlayerPreview = ({ alwaysGift, tempGift, bg, bc, name, number, style, dead
                 react_1.default.createElement(react_native_1.Text, { style: styles.numberText, accessibilityLabel: `${selectedNumber} numara` }, selectedNumber ? selectedNumber : "5")),
             selectedRole && (react_1.default.createElement(react_native_1.View, { style: styles.roleBar },
                 react_1.default.createElement(Animatable.Image, { accessibilityLabel: role, useNativeDriver: true, animation: "slideInUp", style: styles.roleImage, source: Utils_1.Assets.getSource("role", selectedRole.key) }),
-                react_1.default.createElement(Animatable.Text, { useNativeDriver: true, animation: "slideInUp", delay: 100, style: styles.roleName }, selectedRole.name))));
+                react_1.default.createElement(Animatable.Text, { useNativeDriver: true, animation: "slideInUp", delay: 100, style: styles.roleName }, selectedRole.name)))));
     };
-    return react_1.default.createElement(react_native_1.View, { style: [styles.wrapper, !!borderColor && { borderColor }, style] }, (!deadBg && frame !== null && (frame || frameActive)) ? react_1.default.createElement(react_native_1.ImageBackground, { source: Utils_1.Assets.getSource("frame", frame || userData.frame), style: styles.profile, imageStyle: styles.profileBgImage }, renderContent()) :
-        react_1.default.createElement(react_native_linear_gradient_1.default, { style: styles.profile, colors: colors, start: { x: 1, y: 0 } }, renderContent()));
+    return (react_1.default.createElement(react_native_1.View, { style: [styles.wrapper, !!borderColor && { borderColor }, style] }, !deadBg && frame !== null && (frame || frameActive) ? (react_1.default.createElement(react_native_1.ImageBackground, { source: Utils_1.Assets.getSource("frame", frame || userData.frame), style: styles.profile, imageStyle: styles.profileBgImage }, renderContent())) : (react_1.default.createElement(react_native_linear_gradient_1.default, { style: styles.profile, colors: colors, start: { x: 1, y: 0 } }, renderContent()))));
 };
 exports.PlayerPreview = PlayerPreview;
 const styles = react_native_1.StyleSheet.create({
@@ -162,7 +159,7 @@ const styles = react_native_1.StyleSheet.create({
         height: 150,
         borderRadius: 20,
         resizeMode: "cover",
-        overflow: "hidden"
+        overflow: "hidden",
     },
     profileBgImage: {
         borderRadius: 6,
@@ -173,7 +170,7 @@ const styles = react_native_1.StyleSheet.create({
         lineHeight: 32,
         fontSize: 13,
         fontWeight: "bold",
-        textAlign: "center"
+        textAlign: "center",
     },
     avatar: {
         width: 80,
@@ -182,29 +179,29 @@ const styles = react_native_1.StyleSheet.create({
         marginRight: "auto",
         borderRadius: 5,
         backgroundColor: "#ffffff",
-        resizeMode: "contain"
+        resizeMode: "contain",
     },
     deadAvatar: {
         width: 110,
         height: 116,
         marginLeft: "auto",
         marginRight: "auto",
-        backgroundColor: "transparent"
+        backgroundColor: "transparent",
     },
     gifts: {
         position: "absolute",
         right: 0,
         bottom: "20%",
         marginTop: -11,
-        zIndex: 10
+        zIndex: 10,
     },
     gift: {
         fontSize: 36,
-        marginTop: -10
+        marginTop: -10,
     },
     container: {
         backgroundColor: "#232323",
-        flex: 1
+        flex: 1,
     },
     number: {
         position: "absolute",
@@ -216,17 +213,17 @@ const styles = react_native_1.StyleSheet.create({
         height: 20,
         borderRadius: 13,
         alignItems: "center",
-        justifyContent: "center"
+        justifyContent: "center",
     },
     numberText: {
         color: "#343434",
         fontWeight: "700",
         fontSize: 14,
-        lineHeight: 16
+        lineHeight: 16,
     },
     giftImage: {
         width: 42,
-        height: 42
+        height: 42,
     },
     roleBar: {
         backgroundColor: "#ffffff",
@@ -234,19 +231,19 @@ const styles = react_native_1.StyleSheet.create({
         justifyContent: "center",
         height: 30,
         marginTop: "auto",
-        flexDirection: "row"
+        flexDirection: "row",
     },
     roleImage: {
         height: 20,
         width: 20,
         resizeMode: "contain",
         tintColor: "#3e7938",
-        marginHorizontal: 2
+        marginHorizontal: 2,
     },
     roleName: {
         color: "#206a1d",
         marginHorizontal: 2,
         fontSize: 12,
-        fontWeight: "700"
-    }
+        fontWeight: "700",
+    },
 });

package/dist/Roles/RoleInfoBox.d.ts

@@ -4,6 +4,7 @@ declare type Props = {
     icon?: ImageSourcePropType;
     title?: string;
     team?: string;
+    iconButton?: () => React.ReactElement;
     fontSize?: number;
     teamText?: string;
     style?: StyleProp<any>;

package/dist/Roles/RoleInfoBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RoleInfoBox.d.ts","sourceRoot":"","sources":["../../src/Roles/RoleInfoBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAS,mBAAmB,EAAE,SAAS,EAAoB,MAAM,cAAc,CAAC;AAIvF,aAAK,KAAK,GAAG;IACX,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA+BvC,CAAC"}
+{"version":3,"file":"RoleInfoBox.d.ts","sourceRoot":"","sources":["../../src/Roles/RoleInfoBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAEL,mBAAmB,EACnB,SAAS,EAGV,MAAM,cAAc,CAAC;AAItB,aAAK,KAAK,GAAG;IACX,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,KAAK,CAAC,YAAY,CAAC;IACtC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAwCvC,CAAC"}

package/dist/Roles/RoleInfoBox.js

@@ -8,36 +8,44 @@ const react_1 = __importDefault(require("react"));
 const react_native_1 = require("react-native");
 const Typography_1 = require("../Typography");
 const Themes_1 = require("../Themes");
-const RoleInfoBox = ({ children, icon, team, title, teamText = "Takım", fontSize = 14, style }) => {
+const RoleInfoBox = ({ children, icon, team, title, iconButton, teamText = "Takım", fontSize = 14, style, }) => {
     const { baseTextColor } = Themes_1.useColors();
     return (react_1.default.createElement(react_native_1.View, { style: [styles.base, style] },
-        !!icon && (react_1.default.createElement(react_native_1.Image, { source: icon, style: [styles.icon, { tintColor: baseTextColor }] })),
-        react_1.default.createElement(react_native_1.View, { style: styles.info },
+        !!icon && (react_1.default.createElement(react_native_1.View, { style: styles.iconWrapper },
+            react_1.default.createElement(react_native_1.Image, { source: icon, style: [styles.icon, { tintColor: baseTextColor }] }),
             !!title && (react_1.default.createElement(Typography_1.Typography, { bold: true, size: fontSize + 5, style: styles.name }, title)),
+            !!iconButton && iconButton())),
+        react_1.default.createElement(react_native_1.View, { style: styles.info },
             react_1.default.createElement(Typography_1.Typography, { style: styles.description, size: fontSize }, children),
-            !!team && react_1.default.createElement(Typography_1.Typography, { bold: true, size: fontSize },
+            !!team && (react_1.default.createElement(Typography_1.Typography, { bold: true, size: fontSize },
                 teamText,
                 ": ",
-                team))));
+                team)))));
 };
 exports.RoleInfoBox = RoleInfoBox;
 const styles = react_native_1.StyleSheet.create({
     base: {
         flexDirection: "row",
-        marginBottom: 40
+        marginBottom: 40,
     },
     icon: {
         width: 64,
         height: 64,
-        marginRight: 16,
-        resizeMode: "contain"
+        alignSelf: "center",
+        resizeMode: "contain",
     },
-    info: { flex: 1 },
+    info: { flex: 1, justifyContent: "center", paddingVertical: 10 },
     name: {
         fontFamily: "Righteous-Regular",
-        marginBottom: 5
+        textAlign: "center",
+    },
+    iconWrapper: {
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        marginRight: 10,
     },
     description: {
-        marginBottom: 5
-    }
+        marginBottom: 5,
+    },
 });

package/dist/Screens/ScreenBase.d.ts

@@ -14,6 +14,8 @@ export declare type ScreenBaseProps = {
     onAccept?: (any: any) => void;
     onLeftPress?: (any: any) => void;
     leftButtonIcon?: string;
+    leftButtonColor?: string;
+    leftButtonIconColor?: string;
     leftButtonFont?: string;
     leftButtonLabel?: string;
     renderHeader?: React.Component | React.FC | JSX.Element | string | number;

package/dist/Screens/ScreenBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScreenBase.d.ts","sourceRoot":"","sources":["../../src/Screens/ScreenBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAEL,mBAAmB,EAEnB,SAAS,EAGV,MAAM,cAAc,CAAC;AAOtB,oBAAY,eAAe,GAAG;IAC5B,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,YAAY,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IAC9B,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,IAAI,CAAC;IACvB,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,IAAI,CAAC;IACzB,WAAW,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,IAAI,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,EAAE,GAAG,GAAG,CAAC,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;CAC3E,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAqGhD,CAAC"}
+{"version":3,"file":"ScreenBase.d.ts","sourceRoot":"","sources":["../../src/Screens/ScreenBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAEL,mBAAmB,EAEnB,SAAS,EAGV,MAAM,cAAc,CAAC;AAOtB,oBAAY,eAAe,GAAG;IAC5B,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,YAAY,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IAC9B,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,IAAI,CAAC;IACvB,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,IAAI,CAAC;IACzB,WAAW,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,IAAI,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,EAAE,GAAG,GAAG,CAAC,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;CAC3E,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAyGhD,CAAC"}

package/dist/Screens/ScreenBase.js

@@ -11,7 +11,7 @@ const ScreenFooter_1 = require("./ScreenFooter");
 const ScreenHeader_1 = require("./ScreenHeader");
 const Themes_1 = require("../Themes");
 const react_native_safe_area_context_1 = require("react-native-safe-area-context");
-const ScreenBase = ({ children, style, contentStyle = {}, icon, title, onBack, background, scrollable, transparent, onAccept, noPaddings, renderHeader, acceptText, onLeftPress, leftButtonIcon, leftButtonLabel, leftButtonFont, }) => {
+const ScreenBase = ({ children, style, contentStyle = {}, icon, title, onBack, background, scrollable, transparent, onAccept, noPaddings, renderHeader, acceptText, onLeftPress, leftButtonIcon, leftButtonColor, leftButtonIconColor, leftButtonLabel, leftButtonFont, }) => {
     const { dimBackgroundColorTransparent } = Themes_1.useColors();
     const insets = react_native_safe_area_context_1.useSafeAreaInsets();
     const renderContent = () => {
@@ -50,6 +50,8 @@ const ScreenBase = ({ children, style, contentStyle = {}, icon, title, onBack, b
                         leftButtonIcon,
                         leftButtonFont,
                         leftButtonLabel,
+                        leftButtonColor,
+                        leftButtonIconColor,
                     }), title)) : null)),
             react_1.default.createElement(ScreenFooter_1.ScreenFooter, { onBack: onBack, onAccept: onAccept, acceptText: acceptText })));
     };

package/dist/Screens/ScreenHeader.d.ts

@@ -6,6 +6,8 @@ declare type Props = {
     onLeftPress?: (any: any) => void;
     leftButtonIcon?: string;
     leftButtonFont?: string;
+    leftButtonColor?: string;
+    leftButtonIconColor?: string;
     leftButtonLabel?: string;
 };
 export declare const ScreenHeader: React.FC<Props>;

package/dist/Screens/ScreenHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScreenHeader.d.ts","sourceRoot":"","sources":["../../src/Screens/ScreenHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAS,mBAAmB,EAAE,SAAS,EAA0B,MAAM,cAAc,CAAC;AAI7F,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,WAAW,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,IAAI,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA2BxC,CAAC"}
+{"version":3,"file":"ScreenHeader.d.ts","sourceRoot":"","sources":["../../src/Screens/ScreenHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAEL,mBAAmB,EACnB,SAAS,EAIV,MAAM,cAAc,CAAC;AAItB,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACvB,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,WAAW,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,IAAI,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAyCxC,CAAC"}

package/dist/Screens/ScreenHeader.js

@@ -8,7 +8,7 @@ const react_1 = __importDefault(require("react"));
 const react_native_1 = require("react-native");
 const Buttons_1 = require("../Buttons");
 const Utils_1 = require("../Utils");
-const ScreenHeader = ({ children, style, icon, onLeftPress, leftButtonIcon, leftButtonFont, leftButtonLabel }) => {
+const ScreenHeader = ({ children, style, icon, onLeftPress, leftButtonIcon, leftButtonFont, leftButtonLabel, leftButtonColor, leftButtonIconColor, }) => {
     if (!children && !icon) {
         return null;
     }
@@ -17,8 +17,11 @@ const ScreenHeader = ({ children, style, icon, onLeftPress, leftButtonIcon, left
             react_1.default.createElement(react_native_1.View, { style: styles.title },
                 !!icon && react_1.default.createElement(react_native_1.Image, { source: icon, style: styles.titleIcon }),
                 react_1.default.createElement(react_native_1.Text, { style: styles.titleText }, children))),
-        !!onLeftPress && (react_1.default.createElement(Buttons_1.FabButton, { style: styles.leftButton, onPress: onLeftPress, accessibilityLabel: leftButtonLabel },
-            react_1.default.createElement(Utils_1.Icon, { name: leftButtonIcon, size: 20, font: leftButtonFont })))));
+        !!onLeftPress && (react_1.default.createElement(Buttons_1.FabButton, { style: [
+                styles.leftButton,
+                leftButtonColor && { backgroundColor: leftButtonColor },
+            ], onPress: onLeftPress, accessibilityLabel: leftButtonLabel },
+            react_1.default.createElement(Utils_1.Icon, { name: leftButtonIcon, size: 20, color: leftButtonIconColor, font: leftButtonFont })))));
 };
 exports.ScreenHeader = ScreenHeader;
 const styles = react_native_1.StyleSheet.create({
@@ -27,18 +30,18 @@ const styles = react_native_1.StyleSheet.create({
         top: 0,
         left: 0,
         right: 0,
-        flexDirection: "row"
+        flexDirection: "row",
     },
     leftButton: {
         zIndex: 2,
         left: 0,
-        top: 3
+        top: 3,
     },
     titleWrapper: {
         position: "absolute",
         left: 0,
         right: 0,
-        top: 0
+        top: 0,
     },
     title: {
         backgroundColor: "#00B3FF",
@@ -54,24 +57,24 @@ const styles = react_native_1.StyleSheet.create({
         shadowColor: "#000000",
         shadowOffset: {
             width: 4,
-            height: 6
+            height: 6,
         },
         shadowOpacity: 0.25,
         shadowRadius: 5,
-        elevation: 5
+        elevation: 5,
     },
     titleIcon: {
         marginRight: 8,
         width: 20,
         height: 20,
         resizeMode: "contain",
-        tintColor: "#ffffff"
+        tintColor: "#ffffff",
     },
     titleText: {
         color: "#ffffff",
         fontWeight: "bold",
         fontFamily: "Righteous-Regular",
         fontSize: 16,
-        lineHeight: 22
-    }
+        lineHeight: 22,
+    },
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "koylu-vampir-design",
-  "version": "1.0.25",
+  "version": "1.0.26",
   "description": "Design System for Koylu Vampir Game",
   "keywords": [
     "react-native",