@meatech/payblend_app_ui_component 1.1.37 → 1.1.39

package/.trunk/trunk.yaml

@@ -7,7 +7,7 @@ cli:
 plugins:
   sources:
     - id: trunk
-      ref: v1.7.3
+      ref: v1.7.4
       uri: https://github.com/trunk-io/plugins
 # Many linters and tools depend on runtimes - configure them here. (https://docs.trunk.io/runtimes)
 runtimes:
@@ -17,7 +17,7 @@ runtimes:
 # This is the section where you manage your linters. (https://docs.trunk.io/check/configuration)
 lint:
   enabled:
-    - checkov@3.2.490
+    - checkov@3.2.493
     - git-diff-check
     - osv-scanner@2.2.4
     - oxipng@9.1.5

package/components/Inputs/SelectField.tsx

@@ -157,7 +157,7 @@ export const SelectField = ({
         onPress={handleToggleModal}
         style={[styles.selectInput, selectFieldStyle, selectFieldBorderStyle]}>
         <View style={styles.textWrapper}>
-          <Text color="tertiary" style={selectFieldTextStyle}>
+          <Text color={currentValue ? "tertiary" : "placeholder"} style={selectFieldTextStyle}>
             {currentValue
               ? currentValue.label
                 ? currentValue.label

package/components/Switch/Switch.tsx

@@ -25,25 +25,21 @@ export const Switch: React.FC<SwitchProps> = ({
   const resMinWidth = pw(2);
 
   const switchTranslate = useSharedValue(0);
-  const [active, setActive] = useState<boolean>(isEnabled || false);
 
-  const progress = useDerivedValue(() => withTiming(active ? resMaxWidth : 0));
-
-  useEffect(() => {
-    setActive(isEnabled as boolean);
-  }, [isEnabled]);
+  const progress = useDerivedValue(() => withTiming(isEnabled ? resMaxWidth : 0));
+  console.log('isEnabled', isEnabled);
 
   const containerStyle = size
     ? styleBySize[size] || styleBySize.medium
     : styleBySize.medium;
 
   useEffect(() => {
-    if (active) {
+    if (isEnabled) {
       switchTranslate.value = resMaxWidth;
     } else {
       switchTranslate.value = resMinWidth;
     }
-  }, [active, switchTranslate, resMaxWidth, resMinWidth]);
+  }, [isEnabled, switchTranslate, resMaxWidth, resMinWidth]);
 
   const customSpringStyles = useAnimatedStyle(() => ({
     transform: [
@@ -72,9 +68,8 @@ export const Switch: React.FC<SwitchProps> = ({
   });
 
   const _onSwitch = async () => {
-    const switchValue = !active;
-    setActive(switchValue);
-    onSwitch && onSwitch(switchValue);
+    if (disabled) return;
+    onSwitch && onSwitch(!isEnabled);
   };
 
   return (

package/components/Text/styles.tsx

@@ -5,6 +5,7 @@ export const colorsText: Record<string, string> = {
   secondary: colors.neutral[90],
   tertiary: colors.neutral[80],
   disabled: colors.neutral[60],
+  placeholder: colors.neutral[60],
   error: colors.red[90],
   success: colors.green[90],
   warning: colors.orange[90],

package/dist/components/Inputs/SelectField.js

@@ -86,7 +86,7 @@ const SelectField = ({ value, label, labelColor = 'tertiary', listData, size = '
         label && (React.createElement(Text, { color: labelColor, size: size }, label)),
         React.createElement(Pressable, { disabled: disabled, onPress: handleToggleModal, style: [styles.selectInput, selectFieldStyle, selectFieldBorderStyle] },
             React.createElement(View, { style: styles.textWrapper },
-                React.createElement(Text, { color: "tertiary", style: selectFieldTextStyle }, currentValue
+                React.createElement(Text, { color: currentValue ? "tertiary" : "placeholder", style: selectFieldTextStyle }, currentValue
                     ? currentValue.label
                         ? currentValue.label
                         : placeholder

package/dist/components/Inputs/SelectField.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectField.js","sources":["../../../../components/Inputs/SelectField.tsx"],"sourcesContent":["import * as React from 'react';\nimport {useEffect, useMemo, useState} from 'react';\nimport {\n  FlatList,\n  ListRenderItemInfo,\n  Pressable,\n  StyleProp,\n  StyleSheet,\n  TextStyle,\n  View,\n  ViewStyle,\n} from 'react-native';\nimport Modal from 'react-native-modal';\nimport Text from '@ui/components/Text';\nimport {Space, colors, metrics, ph} from '@ui/themes';\nimport {Icon} from '@ui/components';\nimport {inputFieldFontSize, inputFieldHeight} from './styles';\n\ntype SelectItemT = {\n  label: string;\n  value: string;\n};\n\nexport const SelectField = ({\n  value,\n  label,\n  labelColor = 'tertiary',\n  listData,\n  size = 'medium',\n  variant = 'default',\n  cusHeight,\n  cusWidth,\n  cusFontSize,\n  disabled = false,\n  isWhiteDisabledBackground = false,\n  placeholder,\n  isShowIcon = true,\n  textAlign = 'left',\n  onChangeValue,\n}: {\n  value: SelectItemT;\n  label?: string;\n  labelColor?:\n    | 'primary'\n    | 'secondary'\n    | 'tertiary'\n    | 'disabled'\n    | 'error'\n    | 'success'\n    | 'warning'\n    | 'info'\n    | 'interactive'\n    | 'hover'\n    | 'active'\n    | 'focus'\n    | 'brand'\n    | 'white'\n    | 'white';\n  listData: Array<SelectItemT>;\n  size?:\n    | 'xxxs'\n    | 'xxs'\n    | 'xs'\n    | 'small'\n    | 'medium'\n    | 'large'\n    | 'xl'\n    | 'xxl'\n    | 'xxxl'\n    | 'xxxxl';\n  variant?: 'default' | 'quite' | 'none';\n  cusHeight?: number;\n  cusWidth?: number;\n  cusFontSize?: number;\n  disabled?: boolean;\n  isWhiteDisabledBackground?: boolean;\n  placeholder?: string;\n  isShowIcon?: boolean;\n  textAlign?: 'auto' | 'left' | 'right' | 'center' | 'justify' | undefined;\n  onChangeValue?: (item: SelectItemT) => void;\n}) => {\n  const {height, fontSize} = useMemo(\n    () => ({\n      height: inputFieldHeight[size],\n      fontSize: inputFieldFontSize[size],\n    }),\n    [size],\n  );\n  const selectInputContainer: StyleProp<ViewStyle> = {\n    width: cusWidth || '100%',\n  };\n  const selectFieldStyle: StyleProp<ViewStyle> = {\n    backgroundColor: isWhiteDisabledBackground\n      ? colors.white[10]\n      : disabled\n        ? colors.neutral[20]\n        : colors.white[10],\n    height: cusHeight || height,\n  };\n\n  const selectFieldTextStyle: StyleProp<TextStyle> = {\n    fontSize: cusFontSize || fontSize,\n    textAlign,\n  };\n\n  const selectFieldBorderStyle: StyleProp<ViewStyle> = {\n    borderRadius: variant === 'default' ? metrics.borderRadiusBase : 0,\n    borderWidth:\n      variant === 'default'\n        ? metrics.borderWidthMedium\n        : metrics.borderWidthNone,\n    borderBottomWidth:\n      variant === 'none' ? metrics.borderWidthNone : metrics.borderWidthMedium,\n    borderColor: disabled ? colors.neutral[20] : colors.neutral[60],\n  };\n\n  const [isVisible, setIsVisible] = useState(false);\n  const [currentValue, setCurrentValue] = useState<SelectItemT | null>(\n    value || null,\n  );\n  useEffect(() => {\n    if (currentValue && onChangeValue) {\n      onChangeValue(currentValue);\n    }\n  }, [currentValue]);\n  const handleToggleModal = () => setIsVisible(!isVisible);\n  const handleSelectItem = (itemSelected: SelectItemT) => {\n    setIsVisible(false);\n    setCurrentValue(itemSelected);\n  };\n  const renderSelectItem = ({item}: ListRenderItemInfo<SelectItemT>) => {\n    return (\n      <Pressable\n        onPress={() => handleSelectItem(item)}\n        style={styles.selectItemWrapper}>\n        <View style={styles.textWrapper}>\n          <Text>{item.label}</Text>\n        </View>\n        {item.value === currentValue?.value && (\n          <Icon name=\"ic_checkmark_circle\" />\n        )}\n      </Pressable>\n    );\n  };\n  const renderItemSeparatorComponent = () => {\n    return <View style={styles.itemSeparator} />;\n  };\n  return (\n    <View style={selectInputContainer}>\n      {label && (\n        <Text color={labelColor} size={size}>\n          {label}\n        </Text>\n      )}\n      <Pressable\n        disabled={disabled}\n        onPress={handleToggleModal}\n        style={[styles.selectInput, selectFieldStyle, selectFieldBorderStyle]}>\n        <View style={styles.textWrapper}>\n          <Text color=\"tertiary\" style={selectFieldTextStyle}>\n            {currentValue\n              ? currentValue.label\n                ? currentValue.label\n                : placeholder\n                ? placeholder\n                : ''\n              : ''}\n          </Text>\n        </View>\n        {isShowIcon && <Icon name=\"ic_chevron_down\" />}\n      </Pressable>\n      <Modal\n        isVisible={isVisible}\n        animationIn=\"zoomInDown\"\n        animationOut=\"zoomOutUp\"\n        backdropColor={'rgba(0,0,0,0.3)'}\n        onBackdropPress={handleToggleModal}\n        style={styles.modal}>\n        <View style={styles.modalContainer}>\n          <FlatList<SelectItemT>\n            data={listData}\n            showsVerticalScrollIndicator={false}\n            ItemSeparatorComponent={renderItemSeparatorComponent}\n            removeClippedSubviews={false}\n            renderItem={renderSelectItem}\n          />\n        </View>\n      </Modal>\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  selectInputContainer: {\n    width: '100%',\n  },\n  selectInput: {\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n    alignItems: 'center',\n    backgroundColor: colors.white[10],\n    paddingHorizontal: Space.medium,\n  },\n  modal: {\n    flex: 1,\n    justifyContent: 'center',\n    alignItems: 'center',\n  },\n\n  modalContainer: {\n    width: '90%',\n    maxHeight: '90%',\n    backgroundColor: colors.white[10],\n    borderRadius: metrics.borderRadiusBase,\n  },\n  selectItemWrapper: {\n    height: ph(40),\n    paddingVertical: Space.xs,\n    paddingHorizontal: Space.medium,\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n  },\n  textWrapper: {\n    flex: 1,\n  },\n  itemSeparator: {\n    height: 1,\n    backgroundColor: colors.neutral[60],\n  },\n});\n"],"names":["ph"],"mappings":"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"}
+{"version":3,"file":"SelectField.js","sources":["../../../../components/Inputs/SelectField.tsx"],"sourcesContent":["import * as React from 'react';\nimport {useEffect, useMemo, useState} from 'react';\nimport {\n  FlatList,\n  ListRenderItemInfo,\n  Pressable,\n  StyleProp,\n  StyleSheet,\n  TextStyle,\n  View,\n  ViewStyle,\n} from 'react-native';\nimport Modal from 'react-native-modal';\nimport Text from '@ui/components/Text';\nimport {Space, colors, metrics, ph} from '@ui/themes';\nimport {Icon} from '@ui/components';\nimport {inputFieldFontSize, inputFieldHeight} from './styles';\n\ntype SelectItemT = {\n  label: string;\n  value: string;\n};\n\nexport const SelectField = ({\n  value,\n  label,\n  labelColor = 'tertiary',\n  listData,\n  size = 'medium',\n  variant = 'default',\n  cusHeight,\n  cusWidth,\n  cusFontSize,\n  disabled = false,\n  isWhiteDisabledBackground = false,\n  placeholder,\n  isShowIcon = true,\n  textAlign = 'left',\n  onChangeValue,\n}: {\n  value: SelectItemT;\n  label?: string;\n  labelColor?:\n    | 'primary'\n    | 'secondary'\n    | 'tertiary'\n    | 'disabled'\n    | 'error'\n    | 'success'\n    | 'warning'\n    | 'info'\n    | 'interactive'\n    | 'hover'\n    | 'active'\n    | 'focus'\n    | 'brand'\n    | 'white'\n    | 'white';\n  listData: Array<SelectItemT>;\n  size?:\n    | 'xxxs'\n    | 'xxs'\n    | 'xs'\n    | 'small'\n    | 'medium'\n    | 'large'\n    | 'xl'\n    | 'xxl'\n    | 'xxxl'\n    | 'xxxxl';\n  variant?: 'default' | 'quite' | 'none';\n  cusHeight?: number;\n  cusWidth?: number;\n  cusFontSize?: number;\n  disabled?: boolean;\n  isWhiteDisabledBackground?: boolean;\n  placeholder?: string;\n  isShowIcon?: boolean;\n  textAlign?: 'auto' | 'left' | 'right' | 'center' | 'justify' | undefined;\n  onChangeValue?: (item: SelectItemT) => void;\n}) => {\n  const {height, fontSize} = useMemo(\n    () => ({\n      height: inputFieldHeight[size],\n      fontSize: inputFieldFontSize[size],\n    }),\n    [size],\n  );\n  const selectInputContainer: StyleProp<ViewStyle> = {\n    width: cusWidth || '100%',\n  };\n  const selectFieldStyle: StyleProp<ViewStyle> = {\n    backgroundColor: isWhiteDisabledBackground\n      ? colors.white[10]\n      : disabled\n        ? colors.neutral[20]\n        : colors.white[10],\n    height: cusHeight || height,\n  };\n\n  const selectFieldTextStyle: StyleProp<TextStyle> = {\n    fontSize: cusFontSize || fontSize,\n    textAlign,\n  };\n\n  const selectFieldBorderStyle: StyleProp<ViewStyle> = {\n    borderRadius: variant === 'default' ? metrics.borderRadiusBase : 0,\n    borderWidth:\n      variant === 'default'\n        ? metrics.borderWidthMedium\n        : metrics.borderWidthNone,\n    borderBottomWidth:\n      variant === 'none' ? metrics.borderWidthNone : metrics.borderWidthMedium,\n    borderColor: disabled ? colors.neutral[20] : colors.neutral[60],\n  };\n\n  const [isVisible, setIsVisible] = useState(false);\n  const [currentValue, setCurrentValue] = useState<SelectItemT | null>(\n    value || null,\n  );\n  useEffect(() => {\n    if (currentValue && onChangeValue) {\n      onChangeValue(currentValue);\n    }\n  }, [currentValue]);\n  const handleToggleModal = () => setIsVisible(!isVisible);\n  const handleSelectItem = (itemSelected: SelectItemT) => {\n    setIsVisible(false);\n    setCurrentValue(itemSelected);\n  };\n  const renderSelectItem = ({item}: ListRenderItemInfo<SelectItemT>) => {\n    return (\n      <Pressable\n        onPress={() => handleSelectItem(item)}\n        style={styles.selectItemWrapper}>\n        <View style={styles.textWrapper}>\n          <Text>{item.label}</Text>\n        </View>\n        {item.value === currentValue?.value && (\n          <Icon name=\"ic_checkmark_circle\" />\n        )}\n      </Pressable>\n    );\n  };\n  const renderItemSeparatorComponent = () => {\n    return <View style={styles.itemSeparator} />;\n  };\n  return (\n    <View style={selectInputContainer}>\n      {label && (\n        <Text color={labelColor} size={size}>\n          {label}\n        </Text>\n      )}\n      <Pressable\n        disabled={disabled}\n        onPress={handleToggleModal}\n        style={[styles.selectInput, selectFieldStyle, selectFieldBorderStyle]}>\n        <View style={styles.textWrapper}>\n          <Text color={currentValue ? \"tertiary\" : \"placeholder\"} style={selectFieldTextStyle}>\n            {currentValue\n              ? currentValue.label\n                ? currentValue.label\n                : placeholder\n                ? placeholder\n                : ''\n              : ''}\n          </Text>\n        </View>\n        {isShowIcon && <Icon name=\"ic_chevron_down\" />}\n      </Pressable>\n      <Modal\n        isVisible={isVisible}\n        animationIn=\"zoomInDown\"\n        animationOut=\"zoomOutUp\"\n        backdropColor={'rgba(0,0,0,0.3)'}\n        onBackdropPress={handleToggleModal}\n        style={styles.modal}>\n        <View style={styles.modalContainer}>\n          <FlatList<SelectItemT>\n            data={listData}\n            showsVerticalScrollIndicator={false}\n            ItemSeparatorComponent={renderItemSeparatorComponent}\n            removeClippedSubviews={false}\n            renderItem={renderSelectItem}\n          />\n        </View>\n      </Modal>\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  selectInputContainer: {\n    width: '100%',\n  },\n  selectInput: {\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n    alignItems: 'center',\n    backgroundColor: colors.white[10],\n    paddingHorizontal: Space.medium,\n  },\n  modal: {\n    flex: 1,\n    justifyContent: 'center',\n    alignItems: 'center',\n  },\n\n  modalContainer: {\n    width: '90%',\n    maxHeight: '90%',\n    backgroundColor: colors.white[10],\n    borderRadius: metrics.borderRadiusBase,\n  },\n  selectItemWrapper: {\n    height: ph(40),\n    paddingVertical: Space.xs,\n    paddingHorizontal: Space.medium,\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n  },\n  textWrapper: {\n    flex: 1,\n  },\n  itemSeparator: {\n    height: 1,\n    backgroundColor: colors.neutral[60],\n  },\n});\n"],"names":["ph"],"mappings":"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"}

package/dist/components/Switch/Switch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../components/Switch/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,OAAO,EAAC,WAAW,EAAC,MAAM,QAAQ,CAAC;AAInC,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAoFxC,CAAC"}
+{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../components/Switch/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,OAAO,EAAC,WAAW,EAAC,MAAM,QAAQ,CAAC;AAInC,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA+ExC,CAAC"}

package/dist/components/Switch/Switch.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { useState, useEffect } from 'react';
+import { useEffect } from 'react';
 import { StyleSheet, TouchableWithoutFeedback } from 'react-native';
 import Animated, { useSharedValue, useDerivedValue, withTiming, useAnimatedStyle, withSpring, interpolateColor } from 'react-native-reanimated';
 import '../../themes/base/styles.js';
@@ -13,22 +13,19 @@ const Switch = ({ isEnabled, activeColor = colors.teal['80'], inActiveColor = co
     const resMaxWidth = size === 'small' ? responsiveWidth(16) : responsiveWidth(22);
     const resMinWidth = responsiveWidth(2);
     const switchTranslate = useSharedValue(0);
-    const [active, setActive] = useState(isEnabled || false);
-    const progress = useDerivedValue(() => withTiming(active ? resMaxWidth : 0));
-    useEffect(() => {
-        setActive(isEnabled);
-    }, [isEnabled]);
+    const progress = useDerivedValue(() => withTiming(isEnabled ? resMaxWidth : 0));
+    console.log('isEnabled', isEnabled);
     const containerStyle = size
         ? styleBySize[size] || styleBySize.medium
         : styleBySize.medium;
     useEffect(() => {
-        if (active) {
+        if (isEnabled) {
             switchTranslate.value = resMaxWidth;
         }
         else {
             switchTranslate.value = resMinWidth;
         }
-    }, [active, switchTranslate, resMaxWidth, resMinWidth]);
+    }, [isEnabled, switchTranslate, resMaxWidth, resMinWidth]);
     const customSpringStyles = useAnimatedStyle(() => ({
         transform: [
             {
@@ -50,9 +47,9 @@ const Switch = ({ isEnabled, activeColor = colors.teal['80'], inActiveColor = co
         };
     });
     const _onSwitch = async () => {
-        const switchValue = !active;
-        setActive(switchValue);
-        onSwitch && onSwitch(switchValue);
+        if (disabled)
+            return;
+        onSwitch && onSwitch(!isEnabled);
     };
     return (React.createElement(TouchableWithoutFeedback, { disabled: disabled, onPress: _onSwitch },
         React.createElement(Animated.View, { style: [

package/dist/components/Switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sources":["../../../../components/Switch/Switch.tsx"],"sourcesContent":["import * as React from 'react';\nimport {useState, useEffect} from 'react';\nimport {StyleSheet, TouchableWithoutFeedback} from 'react-native';\nimport Animated, {\n  interpolateColor,\n  useSharedValue,\n  useAnimatedStyle,\n  withSpring,\n  withTiming,\n  useDerivedValue,\n} from 'react-native-reanimated';\nimport {SwitchProps} from './type';\nimport {colors, pw} from '@ui/themes';\nimport {styleBySize} from './styles';\n\nexport const Switch: React.FC<SwitchProps> = ({\n  isEnabled,\n  activeColor = colors.teal['80'],\n  inActiveColor = colors.neutral['60'],\n  onSwitch,\n  size,\n  disabled = false,\n}) => {\n  const resMaxWidth = size === 'small' ? pw(16) : pw(22);\n  const resMinWidth = pw(2);\n\n  const switchTranslate = useSharedValue(0);\n  const [active, setActive] = useState<boolean>(isEnabled || false);\n\n  const progress = useDerivedValue(() => withTiming(active ? resMaxWidth : 0));\n\n  useEffect(() => {\n    setActive(isEnabled as boolean);\n  }, [isEnabled]);\n\n  const containerStyle = size\n    ? styleBySize[size] || styleBySize.medium\n    : styleBySize.medium;\n\n  useEffect(() => {\n    if (active) {\n      switchTranslate.value = resMaxWidth;\n    } else {\n      switchTranslate.value = resMinWidth;\n    }\n  }, [active, switchTranslate, resMaxWidth, resMinWidth]);\n\n  const customSpringStyles = useAnimatedStyle(() => ({\n    transform: [\n      {\n        translateX: withSpring(switchTranslate.value, {\n          mass: 1,\n          damping: 15,\n          stiffness: 120,\n          overshootClamping: false,\n          restSpeedThreshold: 0.001,\n          restDisplacementThreshold: 0.001,\n        }),\n      },\n    ],\n  }));\n\n  const backgroundColorStyle = useAnimatedStyle(() => {\n    const backgroundColor = interpolateColor(\n      progress.value,\n      [0, resMaxWidth],\n      [inActiveColor, activeColor],\n    );\n    return {\n      backgroundColor,\n    };\n  });\n\n  const _onSwitch = async () => {\n    const switchValue = !active;\n    setActive(switchValue);\n    onSwitch && onSwitch(switchValue);\n  };\n\n  return (\n    <TouchableWithoutFeedback disabled={disabled} onPress={_onSwitch}>\n      <Animated.View\n        style={[\n          styles.container,\n          backgroundColorStyle,\n          {width: containerStyle.width},\n          {height: containerStyle.height},\n        ]}>\n        <Animated.View\n          style={[\n            styles.circle,\n            customSpringStyles,\n            {width: containerStyle.circleSize},\n            {height: containerStyle.circleSize},\n          ]}\n        />\n      </Animated.View>\n    </TouchableWithoutFeedback>\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {\n    borderRadius: pw(30),\n    justifyContent: 'center',\n    backgroundColor: colors.neutral['60'],\n  },\n  circle: {\n    borderRadius: pw(30),\n    backgroundColor: colors.white['10'],\n    shadowColor: colors.black['100'],\n    shadowOffset: {\n      width: 0,\n      height: pw(2),\n    },\n    shadowOpacity: 0.2,\n    shadowRadius: 2.5,\n    elevation: 4,\n  },\n});\n"],"names":["pw"],"mappings":"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"}
+{"version":3,"file":"Switch.js","sources":["../../../../components/Switch/Switch.tsx"],"sourcesContent":["import * as React from 'react';\nimport {useState, useEffect} from 'react';\nimport {StyleSheet, TouchableWithoutFeedback} from 'react-native';\nimport Animated, {\n  interpolateColor,\n  useSharedValue,\n  useAnimatedStyle,\n  withSpring,\n  withTiming,\n  useDerivedValue,\n} from 'react-native-reanimated';\nimport {SwitchProps} from './type';\nimport {colors, pw} from '@ui/themes';\nimport {styleBySize} from './styles';\n\nexport const Switch: React.FC<SwitchProps> = ({\n  isEnabled,\n  activeColor = colors.teal['80'],\n  inActiveColor = colors.neutral['60'],\n  onSwitch,\n  size,\n  disabled = false,\n}) => {\n  const resMaxWidth = size === 'small' ? pw(16) : pw(22);\n  const resMinWidth = pw(2);\n\n  const switchTranslate = useSharedValue(0);\n\n  const progress = useDerivedValue(() => withTiming(isEnabled ? resMaxWidth : 0));\n  console.log('isEnabled', isEnabled);\n\n  const containerStyle = size\n    ? styleBySize[size] || styleBySize.medium\n    : styleBySize.medium;\n\n  useEffect(() => {\n    if (isEnabled) {\n      switchTranslate.value = resMaxWidth;\n    } else {\n      switchTranslate.value = resMinWidth;\n    }\n  }, [isEnabled, switchTranslate, resMaxWidth, resMinWidth]);\n\n  const customSpringStyles = useAnimatedStyle(() => ({\n    transform: [\n      {\n        translateX: withSpring(switchTranslate.value, {\n          mass: 1,\n          damping: 15,\n          stiffness: 120,\n          overshootClamping: false,\n          restSpeedThreshold: 0.001,\n          restDisplacementThreshold: 0.001,\n        }),\n      },\n    ],\n  }));\n\n  const backgroundColorStyle = useAnimatedStyle(() => {\n    const backgroundColor = interpolateColor(\n      progress.value,\n      [0, resMaxWidth],\n      [inActiveColor, activeColor],\n    );\n    return {\n      backgroundColor,\n    };\n  });\n\n  const _onSwitch = async () => {\n    if (disabled) return;\n    onSwitch && onSwitch(!isEnabled);\n  };\n\n  return (\n    <TouchableWithoutFeedback disabled={disabled} onPress={_onSwitch}>\n      <Animated.View\n        style={[\n          styles.container,\n          backgroundColorStyle,\n          {width: containerStyle.width},\n          {height: containerStyle.height},\n        ]}>\n        <Animated.View\n          style={[\n            styles.circle,\n            customSpringStyles,\n            {width: containerStyle.circleSize},\n            {height: containerStyle.circleSize},\n          ]}\n        />\n      </Animated.View>\n    </TouchableWithoutFeedback>\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {\n    borderRadius: pw(30),\n    justifyContent: 'center',\n    backgroundColor: colors.neutral['60'],\n  },\n  circle: {\n    borderRadius: pw(30),\n    backgroundColor: colors.white['10'],\n    shadowColor: colors.black['100'],\n    shadowOffset: {\n      width: 0,\n      height: pw(2),\n    },\n    shadowOpacity: 0.2,\n    shadowRadius: 2.5,\n    elevation: 4,\n  },\n});\n"],"names":["pw"],"mappings":"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"}

package/dist/components/Text/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../components/Text/styles.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAe7C,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAW3C,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAU3C,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../components/Text/styles.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAgB7C,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAW3C,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAU3C,CAAC"}

package/dist/components/Text/styles.js

@@ -9,6 +9,7 @@ const colorsText = {
     secondary: colors.neutral[90],
     tertiary: colors.neutral[80],
     disabled: colors.neutral[60],
+    placeholder: colors.neutral[60],
     error: colors.red[90],
     success: colors.green[90],
     warning: colors.orange[90],

package/dist/components/Text/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../components/Text/styles.tsx"],"sourcesContent":["import {colors, FontFamily, FontSizes} from '@ui/themes';\n\nexport const colorsText: Record<string, string> = {\n  primary: colors.neutral[100],\n  secondary: colors.neutral[90],\n  tertiary: colors.neutral[80],\n  disabled: colors.neutral[60],\n  error: colors.red[90],\n  success: colors.green[90],\n  warning: colors.orange[90],\n  info: colors.blue[90],\n  interactive: colors.secondary[100],\n  hover: colors.teal[90],\n  focus: colors.teal[100],\n  active: colors.teal[100],\n  brand: colors.teal[60],\n  white: colors.white[10],\n};\n\nexport const textSize: Record<string, number> = {\n  xxxs: FontSizes.font3XS,\n  xxs: FontSizes.fontXXS,\n  xs: FontSizes.fontXS,\n  small: FontSizes.fontSmall,\n  medium: FontSizes.fontMedium,\n  large: FontSizes.fontLarge,\n  xl: FontSizes.fontXL,\n  xxl: FontSizes.fontXXL,\n  xxxl: FontSizes.fontXXXL,\n  xxxxl: FontSizes.fontXXXL,\n};\n\nexport const fontText: Record<string, string> = {\n  100: FontFamily.Thin,\n  200: FontFamily.ExtraLight,\n  300: FontFamily.Light,\n  400: FontFamily.Regular,\n  500: FontFamily.Medium,\n  600: FontFamily.SemiBold,\n  700: FontFamily.Bold,\n  800: FontFamily.ExtraBold,\n  900: FontFamily.Black,\n};\n"],"names":[],"mappings":";;;;;;AAEa,MAAA,UAAU,GAA2B;AAChD,IAAA,OAAO,EAAE,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC;AAC5B,IAAA,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC;AAC7B,IAAA,QAAQ,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC;AAC5B,IAAA,QAAQ,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC;AAC5B,IAAA,KAAK,EAAE,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC;AACrB,IAAA,OAAO,EAAE,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC;AACzB,IAAA,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC;AAC1B,IAAA,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;AACrB,IAAA,WAAW,EAAE,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC;AAClC,IAAA,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;AACtB,IAAA,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC;AACvB,IAAA,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC;AACxB,IAAA,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;AACtB,IAAA,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC;;AAGZ,MAAA,QAAQ,GAA2B;IAC9C,IAAI,EAAE,SAAS,CAAC,OAAO;IACvB,GAAG,EAAE,SAAS,CAAC,OAAO;IACtB,EAAE,EAAE,SAAS,CAAC,MAAM;IACpB,KAAK,EAAE,SAAS,CAAC,SAAS;IAC1B,MAAM,EAAE,SAAS,CAAC,UAAU;IAC5B,KAAK,EAAE,SAAS,CAAC,SAAS;IAC1B,EAAE,EAAE,SAAS,CAAC,MAAM;IACpB,GAAG,EAAE,SAAS,CAAC,OAAO;IACtB,IAAI,EAAE,SAAS,CAAC,QAAQ;IACxB,KAAK,EAAE,SAAS,CAAC,QAAQ;;CAGqB;IAC9C,GAAG,EAAE,UAAU,CAAC,IAAI;IACpB,GAAG,EAAE,UAAU,CAAC,UAAU;IAC1B,GAAG,EAAE,UAAU,CAAC,KAAK;IACrB,GAAG,EAAE,UAAU,CAAC,OAAO;IACvB,GAAG,EAAE,UAAU,CAAC,MAAM;IACtB,GAAG,EAAE,UAAU,CAAC,QAAQ;IACxB,GAAG,EAAE,UAAU,CAAC,IAAI;IACpB,GAAG,EAAE,UAAU,CAAC,SAAS;IACzB,GAAG,EAAE,UAAU,CAAC,KAAK;;;;;"}
+{"version":3,"file":"styles.js","sources":["../../../../components/Text/styles.tsx"],"sourcesContent":["import {colors, FontFamily, FontSizes} from '@ui/themes';\n\nexport const colorsText: Record<string, string> = {\n  primary: colors.neutral[100],\n  secondary: colors.neutral[90],\n  tertiary: colors.neutral[80],\n  disabled: colors.neutral[60],\n  placeholder: colors.neutral[60],\n  error: colors.red[90],\n  success: colors.green[90],\n  warning: colors.orange[90],\n  info: colors.blue[90],\n  interactive: colors.secondary[100],\n  hover: colors.teal[90],\n  focus: colors.teal[100],\n  active: colors.teal[100],\n  brand: colors.teal[60],\n  white: colors.white[10],\n};\n\nexport const textSize: Record<string, number> = {\n  xxxs: FontSizes.font3XS,\n  xxs: FontSizes.fontXXS,\n  xs: FontSizes.fontXS,\n  small: FontSizes.fontSmall,\n  medium: FontSizes.fontMedium,\n  large: FontSizes.fontLarge,\n  xl: FontSizes.fontXL,\n  xxl: FontSizes.fontXXL,\n  xxxl: FontSizes.fontXXXL,\n  xxxxl: FontSizes.fontXXXL,\n};\n\nexport const fontText: Record<string, string> = {\n  100: FontFamily.Thin,\n  200: FontFamily.ExtraLight,\n  300: FontFamily.Light,\n  400: FontFamily.Regular,\n  500: FontFamily.Medium,\n  600: FontFamily.SemiBold,\n  700: FontFamily.Bold,\n  800: FontFamily.ExtraBold,\n  900: FontFamily.Black,\n};\n"],"names":[],"mappings":";;;;;;AAEa,MAAA,UAAU,GAA2B;AAChD,IAAA,OAAO,EAAE,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC;AAC5B,IAAA,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC;AAC7B,IAAA,QAAQ,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC;AAC5B,IAAA,QAAQ,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC;AAC5B,IAAA,WAAW,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC;AAC/B,IAAA,KAAK,EAAE,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC;AACrB,IAAA,OAAO,EAAE,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC;AACzB,IAAA,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC;AAC1B,IAAA,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;AACrB,IAAA,WAAW,EAAE,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC;AAClC,IAAA,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;AACtB,IAAA,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC;AACvB,IAAA,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC;AACxB,IAAA,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;AACtB,IAAA,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC;;AAGZ,MAAA,QAAQ,GAA2B;IAC9C,IAAI,EAAE,SAAS,CAAC,OAAO;IACvB,GAAG,EAAE,SAAS,CAAC,OAAO;IACtB,EAAE,EAAE,SAAS,CAAC,MAAM;IACpB,KAAK,EAAE,SAAS,CAAC,SAAS;IAC1B,MAAM,EAAE,SAAS,CAAC,UAAU;IAC5B,KAAK,EAAE,SAAS,CAAC,SAAS;IAC1B,EAAE,EAAE,SAAS,CAAC,MAAM;IACpB,GAAG,EAAE,SAAS,CAAC,OAAO;IACtB,IAAI,EAAE,SAAS,CAAC,QAAQ;IACxB,KAAK,EAAE,SAAS,CAAC,QAAQ;;CAGqB;IAC9C,GAAG,EAAE,UAAU,CAAC,IAAI;IACpB,GAAG,EAAE,UAAU,CAAC,UAAU;IAC1B,GAAG,EAAE,UAAU,CAAC,KAAK;IACrB,GAAG,EAAE,UAAU,CAAC,OAAO;IACvB,GAAG,EAAE,UAAU,CAAC,MAAM;IACtB,GAAG,EAAE,UAAU,CAAC,QAAQ;IACxB,GAAG,EAAE,UAAU,CAAC,IAAI;IACpB,GAAG,EAAE,UAAU,CAAC,SAAS;IACzB,GAAG,EAAE,UAAU,CAAC,KAAK;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@meatech/payblend_app_ui_component",
-  "version": "1.1.37",
+  "version": "1.1.39",
   "description": "UI Component Library for Payblend App",
   "main": "./dist/components/index.js",
   "module": "./dist/components/index.js",