@herca/rn-kit 0.1.0

package/lib/module/Step/Step.js

@@ -0,0 +1,83 @@
+"use strict";
+
+import React, { useEffect, useRef } from 'react';
+import { View, StyleSheet, Dimensions, ScrollView } from 'react-native';
+import Color from "../Color/Color.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const {
+  width: screenWidth
+} = Dimensions.get('window');
+const Step = ({
+  children,
+  current = 0,
+  onChangeStep
+}) => {
+  const childrenArray = React.Children.toArray(children).filter(React.isValidElement);
+  const totalSteps = childrenArray.length;
+  const scrollRef = useRef(null);
+  const stepWidth = 100;
+  useEffect(() => {
+    onChangeStep?.(current);
+    if (scrollRef.current) {
+      scrollRef.current.scrollTo({
+        x: Math.max(0, current * stepWidth) - screenWidth / 2 + stepWidth / 2,
+        animated: true
+      });
+    }
+  }, [current, onChangeStep]);
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.container,
+    children: [/*#__PURE__*/_jsx(View, {
+      style: [styles.headerContainer],
+      children: /*#__PURE__*/_jsx(ScrollView, {
+        ref: scrollRef,
+        horizontal: true,
+        showsHorizontalScrollIndicator: false,
+        contentContainerStyle: [styles.containerScrollView, {
+          justifyContent: totalSteps * stepWidth < screenWidth ? 'center' : 'flex-start'
+        }],
+        children: childrenArray.map((child, index) => /*#__PURE__*/React.cloneElement(child, {
+          index,
+          isActive: index === current,
+          isCompleted: index < current,
+          isLast: index === totalSteps - 1,
+          isHeader: true,
+          style: {
+            width: stepWidth
+          }
+        }))
+      })
+    }), /*#__PURE__*/_jsx(View, {
+      style: styles.content,
+      children: childrenArray[current] && /*#__PURE__*/React.cloneElement(childrenArray[current], {
+        index: current,
+        isActive: true,
+        isCompleted: false,
+        isLast: current === totalSteps - 1,
+        isHeader: false
+      })
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    flex: 1
+  },
+  headerContainer: {
+    paddingHorizontal: 24,
+    width: screenWidth,
+    backgroundColor: Color.info[50],
+    paddingVertical: 16
+  },
+  contentContainer: {
+    flex: 1
+  },
+  content: {
+    flex: 1
+  },
+  containerScrollView: {
+    flexGrow: 1
+  }
+});
+export default Step;
+//# sourceMappingURL=Step.js.map

package/lib/module/Step/Step.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useRef","View","StyleSheet","Dimensions","ScrollView","Color","jsx","_jsx","jsxs","_jsxs","width","screenWidth","get","Step","children","current","onChangeStep","childrenArray","Children","toArray","filter","isValidElement","totalSteps","length","scrollRef","stepWidth","scrollTo","x","Math","max","animated","style","styles","container","headerContainer","ref","horizontal","showsHorizontalScrollIndicator","contentContainerStyle","containerScrollView","justifyContent","map","child","index","cloneElement","isActive","isCompleted","isLast","isHeader","content","create","flex","paddingHorizontal","backgroundColor","info","paddingVertical","contentContainer","flexGrow"],"sourceRoot":"../../../src","sources":["Step/Step.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/Step/StepItem.js

@@ -0,0 +1,78 @@
+"use strict";
+
+import React from 'react';
+import { View, Text, StyleSheet, FlatList } from 'react-native';
+import Color from "../Color/Color.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const StepItem = ({
+  index = 0,
+  isActive,
+  isCompleted,
+  isLast,
+  isHeader,
+  children,
+  style
+}) => {
+  if (isHeader) {
+    return /*#__PURE__*/_jsxs(View, {
+      style: [styles.headerItem, style],
+      children: [/*#__PURE__*/_jsx(View, {
+        style: [styles.circle, isCompleted && styles.completed, isActive && styles.active],
+        children: /*#__PURE__*/_jsx(Text, {
+          style: styles.circleText,
+          children: index + 1
+        })
+      }), !isLast && /*#__PURE__*/_jsx(View, {
+        style: styles.line
+      })]
+    });
+  }
+  if (/*#__PURE__*/React.isValidElement(children) && children.type === FlatList) {
+    const flatListElement = children;
+    return /*#__PURE__*/React.cloneElement(flatListElement, {
+      style: [styles.content, flatListElement.props.style],
+      contentContainerStyle: [styles.listContent, flatListElement.props.contentContainerStyle],
+      nestedScrollEnabled: true
+    });
+  }
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.content,
+    children: children
+  });
+};
+const styles = StyleSheet.create({
+  headerItem: {
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  circle: {
+    width: 30,
+    height: 30,
+    borderRadius: 15,
+    backgroundColor: '#ccc',
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  circleText: {
+    color: '#fff',
+    fontWeight: 'bold'
+  },
+  active: {
+    backgroundColor: Color.info[500]
+  },
+  completed: {
+    backgroundColor: Color.info[500]
+  },
+  line: {
+    width: 40,
+    height: 2,
+    backgroundColor: Color.info[500],
+    marginHorizontal: 8
+  },
+  content: {
+    flex: 1
+  },
+  listContent: {}
+});
+export default StepItem;
+//# sourceMappingURL=StepItem.js.map

package/lib/module/Step/StepItem.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Text","StyleSheet","FlatList","Color","jsx","_jsx","jsxs","_jsxs","StepItem","index","isActive","isCompleted","isLast","isHeader","children","style","styles","headerItem","circle","completed","active","circleText","line","isValidElement","type","flatListElement","cloneElement","content","props","contentContainerStyle","listContent","nestedScrollEnabled","create","flexDirection","alignItems","width","height","borderRadius","backgroundColor","justifyContent","color","fontWeight","info","marginHorizontal","flex"],"sourceRoot":"../../../src","sources":["Step/StepItem.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SACEC,IAAI,EACJC,IAAI,EACJC,UAAU,EACVC,QAAQ,QAEH,cAAc;AACrB,OAAOC,KAAK,MAAM,mBAAgB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAGnC,MAAMC,QAAQ,GAAGA,CAAC;EAChBC,KAAK,GAAG,CAAC;EACTC,QAAQ;EACRC,WAAW;EACXC,MAAM;EACNC,QAAQ;EACRC,QAAQ;EACRC;AACa,CAAC,KAAK;EACnB,IAAIF,QAAQ,EAAE;IACZ,oBACEN,KAAA,CAACR,IAAI;MAACgB,KAAK,EAAE,CAACC,MAAM,CAACC,UAAU,EAAEF,KAAK,CAAE;MAAAD,QAAA,gBACtCT,IAAA,CAACN,IAAI;QACHgB,KAAK,EAAE,CACLC,MAAM,CAACE,MAAM,EACbP,WAAW,IAAIK,MAAM,CAACG,SAAS,EAC/BT,QAAQ,IAAIM,MAAM,CAACI,MAAM,CACzB;QAAAN,QAAA,eAEFT,IAAA,CAACL,IAAI;UAACe,KAAK,EAAEC,MAAM,CAACK,UAAW;UAAAP,QAAA,EAAEL,KAAK,GAAG;QAAC,CAAO;MAAC,CAC9C,CAAC,EACN,CAACG,MAAM,iBAAIP,IAAA,CAACN,IAAI;QAACgB,KAAK,EAAEC,MAAM,CAACM;MAAK,CAAE,CAAC;IAAA,CACpC,CAAC;EAEX;EAEA,IAAI,aAAAxB,KAAK,CAACyB,cAAc,CAACT,QAAQ,CAAC,IAAIA,QAAQ,CAACU,IAAI,KAAKtB,QAAQ,EAAE;IAChE,MAAMuB,eAAe,GAAGX,QAAkD;IAC1E,oBAAOhB,KAAK,CAAC4B,YAAY,CAACD,eAAe,EAAE;MACzCV,KAAK,EAAE,CAACC,MAAM,CAACW,OAAO,EAAEF,eAAe,CAACG,KAAK,CAACb,KAAK,CAAC;MACpDc,qBAAqB,EAAE,CACrBb,MAAM,CAACc,WAAW,EAClBL,eAAe,CAACG,KAAK,CAACC,qBAAqB,CAC5C;MACDE,mBAAmB,EAAE;IACvB,CAAC,CAAC;EACJ;EAEA,oBAAO1B,IAAA,CAACN,IAAI;IAACgB,KAAK,EAAEC,MAAM,CAACW,OAAQ;IAAAb,QAAA,EAAEA;EAAQ,CAAO,CAAC;AACvD,CAAC;AACD,MAAME,MAAM,GAAGf,UAAU,CAAC+B,MAAM,CAAC;EAC/Bf,UAAU,EAAE;IACVgB,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACDhB,MAAM,EAAE;IACNiB,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,EAAE;IACVC,YAAY,EAAE,EAAE;IAChBC,eAAe,EAAE,MAAM;IACvBC,cAAc,EAAE,QAAQ;IACxBL,UAAU,EAAE;EACd,CAAC;EACDb,UAAU,EAAE;IACVmB,KAAK,EAAE,MAAM;IACbC,UAAU,EAAE;EACd,CAAC;EACDrB,MAAM,EAAE;IACNkB,eAAe,EAAEnC,KAAK,CAACuC,IAAI,CAAC,GAAG;EACjC,CAAC;EACDvB,SAAS,EAAE;IACTmB,eAAe,EAAEnC,KAAK,CAACuC,IAAI,CAAC,GAAG;EACjC,CAAC;EACDpB,IAAI,EAAE;IACJa,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,CAAC;IACTE,eAAe,EAAEnC,KAAK,CAACuC,IAAI,CAAC,GAAG,CAAC;IAChCC,gBAAgB,EAAE;EACpB,CAAC;EACDhB,OAAO,EAAE;IACPiB,IAAI,EAAE;EACR,CAAC;EACDd,WAAW,EAAE,CAAC;AAChB,CAAC,CAAC;AACF,eAAetB,QAAQ","ignoreList":[]}

package/lib/module/Step/type.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export {};
+//# sourceMappingURL=type.js.map

package/lib/module/Step/type.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../src","sources":["Step/type.tsx"],"mappings":"","ignoreList":[]}

package/lib/module/SwitchButton/SwitchButton.js

@@ -0,0 +1,8 @@
+"use strict";
+
+import { View } from 'react-native';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function SwitchButton() {
+  return /*#__PURE__*/_jsx(View, {});
+}
+//# sourceMappingURL=SwitchButton.js.map

package/lib/module/SwitchButton/SwitchButton.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","jsx","_jsx","SwitchButton"],"sourceRoot":"../../../src","sources":["SwitchButton/SwitchButton.tsx"],"mappings":";;AAAA,SAASA,IAAI,QAAQ,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEpC,eAAe,SAASC,YAAYA,CAAA,EAAG;EACrC,oBAAOD,IAAA,CAACF,IAAI,IAAO,CAAC;AACtB","ignoreList":[]}

package/lib/module/TextArea/TextArea.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=TextArea.js.map

package/lib/module/TextArea/TextArea.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../src","sources":["TextArea/TextArea.tsx"],"mappings":"","ignoreList":[]}

package/lib/module/Theme/Theme.js

@@ -0,0 +1,31 @@
+"use strict";
+
+const Theme = {
+  spacing: {
+    xs: 4,
+    sm: 8,
+    md: 12,
+    lg: 16,
+    xl: 24,
+    xxl: 32
+  },
+  radius: {
+    sm: 4,
+    md: 8,
+    lg: 12,
+    full: 999
+  },
+  size: {
+    icon: 24,
+    inputHeight: 40,
+    buttonHeight: 48
+  },
+  zIndex: {
+    base: 1,
+    dropdown: 10,
+    modal: 100,
+    toast: 999
+  }
+};
+export default Theme;
+//# sourceMappingURL=Theme.js.map

package/lib/module/Theme/Theme.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Theme","spacing","xs","sm","md","lg","xl","xxl","radius","full","size","icon","inputHeight","buttonHeight","zIndex","base","dropdown","modal","toast"],"sourceRoot":"../../../src","sources":["Theme/Theme.tsx"],"mappings":";;AAAA,MAAMA,KAAK,GAAG;EACZC,OAAO,EAAE;IACPC,EAAE,EAAE,CAAC;IACLC,EAAE,EAAE,CAAC;IACLC,EAAE,EAAE,EAAE;IACNC,EAAE,EAAE,EAAE;IACNC,EAAE,EAAE,EAAE;IACNC,GAAG,EAAE;EACP,CAAC;EACDC,MAAM,EAAE;IACNL,EAAE,EAAE,CAAC;IACLC,EAAE,EAAE,CAAC;IACLC,EAAE,EAAE,EAAE;IACNI,IAAI,EAAE;EACR,CAAC;EACDC,IAAI,EAAE;IACJC,IAAI,EAAE,EAAE;IACRC,WAAW,EAAE,EAAE;IACfC,YAAY,EAAE;EAChB,CAAC;EACDC,MAAM,EAAE;IACNC,IAAI,EAAE,CAAC;IACPC,QAAQ,EAAE,EAAE;IACZC,KAAK,EAAE,GAAG;IACVC,KAAK,EAAE;EACT;AACF,CAAC;AACD,eAAelB,KAAK","ignoreList":[]}

package/lib/module/Timeline/Timeline.js

@@ -0,0 +1,12 @@
+"use strict";
+
+import { View } from 'react-native';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function Timeline({
+  children
+}) {
+  return /*#__PURE__*/_jsx(View, {
+    children: children
+  });
+}
+//# sourceMappingURL=Timeline.js.map

package/lib/module/Timeline/Timeline.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","jsx","_jsx","Timeline","children"],"sourceRoot":"../../../src","sources":["Timeline/Timeline.tsx"],"mappings":";;AAAA,SAASA,IAAI,QAAQ,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAMpC,eAAe,SAASC,QAAQA,CAAC;EAAEC;AAAmB,CAAC,EAAE;EACvD,oBAAOF,IAAA,CAACF,IAAI;IAAAI,QAAA,EAAEA;EAAQ,CAAO,CAAC;AAChC","ignoreList":[]}

package/lib/module/Timeline/TimelineItem.js

@@ -0,0 +1,66 @@
+"use strict";
+
+import { useState } from 'react';
+import { StyleSheet, View } from 'react-native';
+import Color from "../Color/Color.js";
+import { Icon } from "../Icon/index.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const COLOR_MAP = {
+  warning: Color.warning[400],
+  primary: Color.primary[900],
+  success: Color.success[500],
+  purple: Color.purple[500],
+  danger: Color.danger[500]
+};
+export default function TimelineItem({
+  children,
+  color = 'primary'
+}) {
+  const [contentHeight, setContentHeight] = useState(0);
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.container,
+    children: [/*#__PURE__*/_jsxs(View, {
+      style: styles.contentLeft,
+      children: [/*#__PURE__*/_jsx(Icon, {
+        name: "RadioButton",
+        color: COLOR_MAP[color]
+      }), /*#__PURE__*/_jsx(View, {
+        style: [styles.border, {
+          height: contentHeight - 20
+        }]
+      })]
+    }), /*#__PURE__*/_jsx(View, {
+      style: styles.flex,
+      onLayout: e => {
+        const {
+          height
+        } = e.nativeEvent.layout;
+        setContentHeight(height);
+      },
+      children: /*#__PURE__*/_jsx(View, {
+        children: children
+      })
+    })]
+  });
+}
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    alignItems: 'flex-start'
+  },
+  contentLeft: {
+    alignItems: 'center',
+    marginRight: 8
+  },
+  border: {
+    width: 1,
+    borderLeftWidth: 1,
+    borderLeftColor: Color.gray[400],
+    borderStyle: 'dashed',
+    marginTop: 4
+  },
+  flex: {
+    flex: 1
+  }
+});
+//# sourceMappingURL=TimelineItem.js.map

package/lib/module/Timeline/TimelineItem.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useState","StyleSheet","View","Color","Icon","jsx","_jsx","jsxs","_jsxs","COLOR_MAP","warning","primary","success","purple","danger","TimelineItem","children","color","contentHeight","setContentHeight","style","styles","container","contentLeft","name","border","height","flex","onLayout","e","nativeEvent","layout","create","flexDirection","alignItems","marginRight","width","borderLeftWidth","borderLeftColor","gray","borderStyle","marginTop"],"sourceRoot":"../../../src","sources":["Timeline/TimelineItem.tsx"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,OAAO;AAChC,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAC/C,OAAOC,KAAK,MAAM,mBAAgB;AAClC,SAASC,IAAI,QAAQ,kBAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE/B,MAAMC,SAAS,GAAG;EAChBC,OAAO,EAAEP,KAAK,CAACO,OAAO,CAAC,GAAG,CAAC;EAC3BC,OAAO,EAAER,KAAK,CAACQ,OAAO,CAAC,GAAG,CAAC;EAC3BC,OAAO,EAAET,KAAK,CAACS,OAAO,CAAC,GAAG,CAAC;EAC3BC,MAAM,EAAEV,KAAK,CAACU,MAAM,CAAC,GAAG,CAAC;EACzBC,MAAM,EAAEX,KAAK,CAACW,MAAM,CAAC,GAAG;AAC1B,CAAC;AAQD,eAAe,SAASC,YAAYA,CAAC;EACnCC,QAAQ;EACRC,KAAK,GAAG;AACS,CAAC,EAAE;EACpB,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAGnB,QAAQ,CAAC,CAAC,CAAC;EAErD,oBACEQ,KAAA,CAACN,IAAI;IAACkB,KAAK,EAAEC,MAAM,CAACC,SAAU;IAAAN,QAAA,gBAC5BR,KAAA,CAACN,IAAI;MAACkB,KAAK,EAAEC,MAAM,CAACE,WAAY;MAAAP,QAAA,gBAC9BV,IAAA,CAACF,IAAI;QAACoB,IAAI,EAAC,aAAa;QAACP,KAAK,EAAER,SAAS,CAACQ,KAAK;MAAE,CAAE,CAAC,eACpDX,IAAA,CAACJ,IAAI;QAACkB,KAAK,EAAE,CAACC,MAAM,CAACI,MAAM,EAAE;UAAEC,MAAM,EAAER,aAAa,GAAG;QAAG,CAAC;MAAE,CAAE,CAAC;IAAA,CAC5D,CAAC,eACPZ,IAAA,CAACJ,IAAI;MACHkB,KAAK,EAAEC,MAAM,CAACM,IAAK;MACnBC,QAAQ,EAAGC,CAAC,IAAK;QACf,MAAM;UAAEH;QAAO,CAAC,GAAGG,CAAC,CAACC,WAAW,CAACC,MAAM;QACvCZ,gBAAgB,CAACO,MAAM,CAAC;MAC1B,CAAE;MAAAV,QAAA,eAEFV,IAAA,CAACJ,IAAI;QAAAc,QAAA,EAAEA;MAAQ,CAAO;IAAC,CACnB,CAAC;EAAA,CACH,CAAC;AAEX;AACA,MAAMK,MAAM,GAAGpB,UAAU,CAAC+B,MAAM,CAAC;EAC/BV,SAAS,EAAE;IACTW,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACDX,WAAW,EAAE;IACXW,UAAU,EAAE,QAAQ;IACpBC,WAAW,EAAE;EACf,CAAC;EACDV,MAAM,EAAE;IACNW,KAAK,EAAE,CAAC;IACRC,eAAe,EAAE,CAAC;IAClBC,eAAe,EAAEnC,KAAK,CAACoC,IAAI,CAAC,GAAG,CAAC;IAChCC,WAAW,EAAE,QAAQ;IACrBC,SAAS,EAAE;EACb,CAAC;EACDd,IAAI,EAAE;IACJA,IAAI,EAAE;EACR;AACF,CAAC,CAAC","ignoreList":[]}

package/lib/module/Toast/Toast.js

@@ -0,0 +1,143 @@
+"use strict";
+
+import { useRef, useEffect } from 'react';
+import { Animated, StyleSheet, View } from 'react-native';
+import Color from "../Color/Color.js";
+import Typography from "../Typography/Typography.js";
+import Icon from "../Icon/index.js";
+import Button from "../Button/Button.js";
+import Container from "../Ui/Container.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const COLOR_MAP = {
+  primary: {
+    bg: Color.base.white100,
+    border: Color.gray[50],
+    text: Color.primary[1000]
+  },
+  default: {
+    bg: Color.gray[700],
+    border: Color.gray[700],
+    text: Color.base.white100
+  },
+  success: {
+    bg: Color.success[50],
+    border: Color.success[50],
+    text: Color.success[500]
+  },
+  danger: {
+    bg: Color.danger[50],
+    border: Color.danger[50],
+    text: Color.danger[500]
+  },
+  warning: {
+    bg: Color.warning[50],
+    border: Color.warning[50],
+    text: Color.warning[400]
+  },
+  info: {
+    bg: Color.info[50],
+    border: Color.info[50],
+    text: Color.info[500]
+  },
+  orange: {
+    bg: Color.orange[50],
+    border: Color.orange[50],
+    text: Color.orange[500]
+  },
+  purple: {
+    bg: Color.purple[50],
+    border: Color.purple[50],
+    text: Color.purple[500]
+  }
+};
+const Toast = ({
+  visible,
+  message,
+  duration = 3000,
+  onHide,
+  color = 'default',
+  icon = 'ExlamationMark',
+  onClear
+}) => {
+  const fadeAnim = useRef(new Animated.Value(0)).current;
+  const validColors = ['default', 'success', 'danger', 'primary', 'warning', 'info', 'purple', 'orange'];
+  const safeColor = validColors.includes(color) ? color : 'default';
+  const baseContainerStyle = StyleSheet.flatten({
+    backgroundColor: COLOR_MAP[safeColor].bg,
+    borderColor: COLOR_MAP[safeColor].border
+  });
+  const handlePressClearButton = () => {
+    onClear?.(true);
+  };
+  useEffect(() => {
+    if (visible) {
+      Animated.sequence([Animated.timing(fadeAnim, {
+        toValue: 1,
+        duration: 300,
+        useNativeDriver: true
+      }), Animated.delay(duration), Animated.timing(fadeAnim, {
+        toValue: 0,
+        duration: 300,
+        useNativeDriver: true
+      })]).start(() => {
+        if (onHide) onHide(true);
+      });
+    }
+  }, [visible, duration, onHide, fadeAnim]);
+  if (!visible) return null;
+  return /*#__PURE__*/_jsx(Animated.View, {
+    style: [styles.toast, baseContainerStyle, {
+      opacity: fadeAnim
+    }],
+    children: /*#__PURE__*/_jsx(Container, {
+      children: /*#__PURE__*/_jsxs(View, {
+        style: styles.container,
+        children: [/*#__PURE__*/_jsxs(View, {
+          style: styles.content,
+          children: [/*#__PURE__*/_jsx(Icon, {
+            name: icon,
+            size: 20,
+            color: COLOR_MAP[safeColor].text
+          }), /*#__PURE__*/_jsx(Typography, {
+            variant: "t2",
+            color: COLOR_MAP[safeColor].text,
+            children: message
+          })]
+        }), /*#__PURE__*/_jsx(Button, {
+          variant: "tertiary",
+          size: "small",
+          title: "x",
+          onPress: handlePressClearButton,
+          children: /*#__PURE__*/_jsx(Icon, {
+            name: "Times",
+            size: 10,
+            color: COLOR_MAP[safeColor].text
+          })
+        })]
+      })
+    })
+  });
+};
+const styles = StyleSheet.create({
+  toast: {
+    position: 'absolute',
+    bottom: 80,
+    left: 28,
+    right: 28,
+    backgroundColor: '#333',
+    borderWidth: 1,
+    borderRadius: 8,
+    zIndex: 999
+  },
+  container: {
+    flexDirection: 'row',
+    justifyContent: 'space-between'
+  },
+  content: {
+    alignItems: 'center',
+    flexDirection: 'row',
+    gap: 8
+  }
+});
+export default Toast;
+//# sourceMappingURL=Toast.js.map

package/lib/module/Toast/Toast.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useRef","useEffect","Animated","StyleSheet","View","Color","Typography","Icon","Button","Container","jsx","_jsx","jsxs","_jsxs","COLOR_MAP","primary","bg","base","white100","border","gray","text","default","success","danger","warning","info","orange","purple","Toast","visible","message","duration","onHide","color","icon","onClear","fadeAnim","Value","current","validColors","safeColor","includes","baseContainerStyle","flatten","backgroundColor","borderColor","handlePressClearButton","sequence","timing","toValue","useNativeDriver","delay","start","style","styles","toast","opacity","children","container","content","name","size","variant","title","onPress","create","position","bottom","left","right","borderWidth","borderRadius","zIndex","flexDirection","justifyContent","alignItems","gap"],"sourceRoot":"../../../src","sources":["Toast/Toast.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/Toast/ToastContext.js

@@ -0,0 +1,40 @@
+"use strict";
+
+import { createContext, useContext, useState } from 'react';
+import Toast from "./Toast.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const ToastContext = /*#__PURE__*/createContext(undefined);
+export const ToastProvider = ({
+  children
+}) => {
+  const [visible, setVisible] = useState(false);
+  const [message, setMessage] = useState('');
+  const [options, setOptions] = useState({
+    icon: 'ExlamationMark'
+  });
+  const show = (msg, opts) => {
+    setMessage(msg);
+    setOptions(opts || {});
+    setVisible(true);
+  };
+  return /*#__PURE__*/_jsxs(ToastContext.Provider, {
+    value: {
+      show
+    },
+    children: [children, /*#__PURE__*/_jsx(Toast, {
+      visible: visible,
+      message: message,
+      onHide: () => setVisible(false),
+      onClear: () => setVisible(false),
+      color: options.color,
+      icon: options.icon,
+      duration: options.duration
+    })]
+  });
+};
+export const useToast = () => {
+  const context = useContext(ToastContext);
+  if (!context) throw new Error('useToast must be used within a ToastProvider');
+  return context;
+};
+//# sourceMappingURL=ToastContext.js.map

package/lib/module/Toast/ToastContext.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createContext","useContext","useState","Toast","jsx","_jsx","jsxs","_jsxs","ToastContext","undefined","ToastProvider","children","visible","setVisible","message","setMessage","options","setOptions","icon","show","msg","opts","Provider","value","onHide","onClear","color","duration","useToast","context","Error"],"sourceRoot":"../../../src","sources":["Toast/ToastContext.tsx"],"mappings":";;AAAA,SAASA,aAAa,EAAEC,UAAU,EAAEC,QAAQ,QAAwB,OAAO;AAC3E,OAAOC,KAAK,MAAM,YAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAc5B,MAAMC,YAAY,gBAAGR,aAAa,CAA+BS,SAAS,CAAC;AAE3E,OAAO,MAAMC,aAAa,GAAGA,CAAC;EAAEC;AAAkC,CAAC,KAAK;EACtE,MAAM,CAACC,OAAO,EAAEC,UAAU,CAAC,GAAGX,QAAQ,CAAC,KAAK,CAAC;EAC7C,MAAM,CAACY,OAAO,EAAEC,UAAU,CAAC,GAAGb,QAAQ,CAAS,EAAE,CAAC;EAClD,MAAM,CAACc,OAAO,EAAEC,UAAU,CAAC,GAAGf,QAAQ,CAAe;IACnDgB,IAAI,EAAE;EACR,CAAC,CAAC;EAEF,MAAMC,IAAI,GAAGA,CAACC,GAAW,EAAEC,IAAmB,KAAK;IACjDN,UAAU,CAACK,GAAG,CAAC;IACfH,UAAU,CAACI,IAAI,IAAI,CAAC,CAAC,CAAC;IACtBR,UAAU,CAAC,IAAI,CAAC;EAClB,CAAC;EAED,oBACEN,KAAA,CAACC,YAAY,CAACc,QAAQ;IAACC,KAAK,EAAE;MAAEJ;IAAK,CAAE;IAAAR,QAAA,GACpCA,QAAQ,eACTN,IAAA,CAACF,KAAK;MACJS,OAAO,EAAEA,OAAQ;MACjBE,OAAO,EAAEA,OAAQ;MACjBU,MAAM,EAAEA,CAAA,KAAMX,UAAU,CAAC,KAAK,CAAE;MAChCY,OAAO,EAAEA,CAAA,KAAMZ,UAAU,CAAC,KAAK,CAAE;MACjCa,KAAK,EAAEV,OAAO,CAACU,KAAM;MACrBR,IAAI,EAAEF,OAAO,CAACE,IAAK;MACnBS,QAAQ,EAAEX,OAAO,CAACW;IAAS,CAC5B,CAAC;EAAA,CACmB,CAAC;AAE5B,CAAC;AAED,OAAO,MAAMC,QAAQ,GAAGA,CAAA,KAAwB;EAC9C,MAAMC,OAAO,GAAG5B,UAAU,CAACO,YAAY,CAAC;EACxC,IAAI,CAACqB,OAAO,EAAE,MAAM,IAAIC,KAAK,CAAC,8CAA8C,CAAC;EAC7E,OAAOD,OAAO;AAChB,CAAC","ignoreList":[]}

package/lib/module/Typography/README.md

@@ -0,0 +1,71 @@
+# ✍️ Typography Component
+
+Komponen `Typography` digunakan untuk menampilkan teks dengan berbagai ukuran, ketebalan, warna, dan perataan yang telah ditentukan.
+
+## ✨ Fitur
+
+- Mendukung berbagai varian teks (heading, paragraph, text kecil)
+- Dapat mengatur ketebalan teks (*weight*)
+- Mendukung warna kustom
+- Dukungan perataan: kiri, kanan, tengah
+- Mendukung pemotongan teks (`numberOfLines`)
+
+## 🧱 Props
+
+| Prop           | Tipe                          | Default     | Deskripsi                                                       |
+|----------------|-------------------------------|-------------|------------------------------------------------------------------|
+| `children`     | `React.ReactNode`             | -           | Isi teks yang akan ditampilkan                                  |
+| `variant`      | `'h1' \| 'h2' \| 'h3' \| 'h4' \| 'p1' \| 'p2' \| 'p3' \| 't1' \| 't2' \| 't3'` | `'p3'` | Ukuran dan gaya teks                                            |
+| `weight`       | `'regular' \| 'medium' \| 'semibold' \| 'bold'` | `'regular'` | Ketebalan huruf                                                 |
+| `color`        | `ColorValue`                  | `'default'` | Warna teks                                                      |
+| `style`        | `ViewStyle`                   | `undefined` | Gaya tambahan                                                   |
+| `numberOfLines`| `number`                      | `undefined` | Jumlah maksimal baris teks ditampilkan                          |
+| `center`       | `boolean`                     | `false`     | Mengatur teks ke tengah                                         |
+| `right`        | `boolean`                     | `false`     | Mengatur teks ke kanan                                          |
+| `left`         | `boolean`                     | `false`     | Mengatur teks ke kiri                                           |
+
+## 🔠 Varian & Ukuran
+
+| Variant | Font Size | Line Height |
+|---------|-----------|-------------|
+| h1      | 36        | 46          |
+| h2      | 32        | 42          |
+| h3      | 28        | 38          |
+| h4      | 24        | 34          |
+| p1      | 20        | 30          |
+| p2      | 18        | 28          |
+| p3      | 16        | 26          |
+| t1      | 14        | 14          |
+| t2      | 12        | 14          |
+| t3      | 10        | 14          |
+
+## 🧪 Contoh Penggunaan
+
+```tsx
+import React from 'react';
+import Typography from './Typography'; // sesuaikan path
+
+export default function Example() {
+  return (
+    <>
+      <Typography variant="h1" weight="bold" center>
+        Judul Utama
+      </Typography>
+
+      <Typography variant="p2" color="gray" numberOfLines={2}>
+        Ini adalah deskripsi yang akan terpotong jika melebihi dua baris.
+      </Typography>
+    </>
+  );
+}
+```
+
+## 🗂️ Struktur File
+
+```
+Typography.tsx
+├── Color/
+├── type.ts (berisi TypographyVariantProps)
+```
+
+Pastikan untuk menyesuaikan `Color` dan `type.ts` agar mendukung struktur tema Anda.

package/lib/module/Typography/Typography.js

@@ -0,0 +1,39 @@
+"use strict";
+
+import React from 'react';
+import { StyleSheet, Text } from 'react-native';
+import Color from "../Color/Color.js";
+import { fontSizeMap, fontWeightMap, lineHeightMap } from "./type.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const Typography = ({
+  children,
+  variant = 'p3',
+  weight = 'regular',
+  color = 'default',
+  style,
+  numberOfLines,
+  center,
+  right,
+  left
+}) => {
+  const textStyle = {
+    fontSize: fontSizeMap[variant],
+    lineHeight: lineHeightMap[variant],
+    fontWeight: fontWeightMap[weight],
+    color: color ? color : Color.primary[1000],
+    textAlign: center ? 'center' : right ? 'right' : left ? 'left' : undefined
+  };
+  return /*#__PURE__*/_jsx(Text, {
+    style: [styles.text, textStyle, style],
+    numberOfLines: numberOfLines,
+    children: children
+  });
+};
+export default Typography;
+const styles = StyleSheet.create({
+  text: {
+    flexWrap: 'wrap',
+    flexShrink: 1
+  }
+});
+//# sourceMappingURL=Typography.js.map

package/lib/module/Typography/Typography.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","Text","Color","fontSizeMap","fontWeightMap","lineHeightMap","jsx","_jsx","Typography","children","variant","weight","color","style","numberOfLines","center","right","left","textStyle","fontSize","lineHeight","fontWeight","primary","textAlign","undefined","styles","text","create","flexWrap","flexShrink"],"sourceRoot":"../../../src","sources":["Typography/Typography.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,QAAwB,cAAc;AAC/D,OAAOC,KAAK,MAAM,mBAAgB;AAClC,SACEC,WAAW,EACXC,aAAa,EACbC,aAAa,QAER,WAAQ;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEhB,MAAMC,UAAqC,GAAGA,CAAC;EAC7CC,QAAQ;EACRC,OAAO,GAAG,IAAI;EACdC,MAAM,GAAG,SAAS;EAClBC,KAAK,GAAG,SAAS;EACjBC,KAAK;EACLC,aAAa;EACbC,MAAM;EACNC,KAAK;EACLC;AACF,CAAC,KAAK;EACJ,MAAMC,SAAoB,GAAG;IAC3BC,QAAQ,EAAEhB,WAAW,CAACO,OAAO,CAAC;IAC9BU,UAAU,EAAEf,aAAa,CAACK,OAAO,CAAC;IAClCW,UAAU,EAAEjB,aAAa,CAACO,MAAM,CAAC;IACjCC,KAAK,EAAEA,KAAK,GAAGA,KAAK,GAAGV,KAAK,CAACoB,OAAO,CAAC,IAAI,CAAC;IAC1CC,SAAS,EAAER,MAAM,GAAG,QAAQ,GAAGC,KAAK,GAAG,OAAO,GAAGC,IAAI,GAAG,MAAM,GAAGO;EACnE,CAAC;EAED,oBACEjB,IAAA,CAACN,IAAI;IAACY,KAAK,EAAE,CAACY,MAAM,CAACC,IAAI,EAAER,SAAS,EAAEL,KAAK,CAAE;IAACC,aAAa,EAAEA,aAAc;IAAAL,QAAA,EACxEA;EAAQ,CACL,CAAC;AAEX,CAAC;AAED,eAAeD,UAAU;AAEzB,MAAMiB,MAAM,GAAGzB,UAAU,CAAC2B,MAAM,CAAC;EAC/BD,IAAI,EAAE;IACJE,QAAQ,EAAE,MAAM;IAChBC,UAAU,EAAE;EACd;AACF,CAAC,CAAC","ignoreList":[]}