dhre-ui-kit 2.0.10 → 2.0.12

package/lib/index.mjs

@@ -15,6 +15,7 @@ import { TextInput as TextInput$1, MD3LightTheme } from 'react-native-paper';
 import { Dropdown } from 'react-native-element-dropdown';
 import DocumentPicker from 'react-native-document-picker';
 import RNFS from 'react-native-fs';
+import Svg, { Line as Line$1 } from 'react-native-svg';
 
 var ShapeType = /* @__PURE__ */ ((ShapeType2) => {
   ShapeType2["LINE"] = "line";
@@ -98,6 +99,8 @@ var Theme = /* @__PURE__ */ ((Theme2) => {
   Theme2["CONTENT_STATIC"] = "CONTENT_STATIC";
   Theme2["CONTENT_PRIMARY_STATIC"] = "CONTENT_PRIMARY_STATIC";
   Theme2["CONTENT_SECONDRY_STATIC"] = "CONTENT_SECONDRY_STATIC";
+  Theme2["CONTENT_SECONDARY_TEXT"] = "CONTENT_SECONDARY_TEXT";
+  Theme2["CONTENT_SECTION_HEADER_TEXT"] = "CONTENT_SECTION_HEADER_TEXT";
   Theme2["BORDER_PRIMARY"] = "BORDER_PRIMARY";
   Theme2["BORDER_SECONDRY"] = "BORDER_SECONDRY";
   Theme2["BORDER_DISABLE"] = "BORDER_DISABLE";
@@ -180,6 +183,14 @@ const theme = {
     light: "#686868",
     dark: "#A7A7A7"
   },
+  [Theme.CONTENT_SECONDARY_TEXT]: {
+    light: "#686868",
+    dark: "#C4BFB6"
+  },
+  [Theme.CONTENT_SECTION_HEADER_TEXT]: {
+    light: "#00263A",
+    dark: "#E3D6BF"
+  },
   [Theme.CONTENT_DISABLE]: {
     light: "#A7A7A7",
     dark: "#686868"
@@ -7600,7 +7611,8 @@ const ScrollableList = ({
   errorStyle,
   errorTextStyle,
   activeTextStyle,
-  enableTextWrap
+  enableTextWrap,
+  inActiveTextStyle
 }) => {
   const [selectedItem, setSelectedItem] = useState(
     data && data.length > 0 ? data[0].name : null
@@ -7640,7 +7652,7 @@ const ScrollableList = ({
           text: item.name,
           variant: "L1_REGULAR",
           textColor: (activeTab ?? selectedItem) === item.name ? selectedItemTextColor : defaultItemTextColor,
-          style: (activeTab ?? selectedItem) === item.name ? activeTextStyle ? activeTextStyle : {} : {}
+          style: (activeTab ?? selectedItem) === item.name ? activeTextStyle ? activeTextStyle : {} : inActiveTextStyle ? inActiveTextStyle : {}
         }
       )),
       item?.isError ? /* @__PURE__ */ React.createElement(View, { style: [styles.errorViewStyle, errorStyle] }, item?.errorText ? /* @__PURE__ */ React.createElement(
@@ -7754,7 +7766,8 @@ const FeedbackForm = ({
   inputText,
   rightBtnTxt,
   leftBtnTxt,
-  setFeedback
+  setFeedback,
+  inputStyle = {}
 }) => {
   const maxChars = 200;
   const { theme } = useTheme();
@@ -7770,7 +7783,7 @@ const FeedbackForm = ({
   ), /* @__PURE__ */ React.createElement(
     TextInput,
     {
-      style: [styles.textInput, { height: Math.max(100) }],
+      style: [styles.textInput, inputStyle, { height: Math.max(100) }],
       placeholder: inputText,
       multiline: true,
       placeholderTextColor: Theme.CONTENT_SECONDRY,
@@ -8871,7 +8884,11 @@ const styles$4 = StyleSheet.create({
     width: "100%",
     marginLeft: 10
   },
-  lableContainer: { width: 60 }
+  lableContainer: { width: 60 },
+  newDividerStyle: {
+    marginLeft: 10,
+    width: "100%"
+  }
 });
 
 var Status = /* @__PURE__ */ ((Status2) => {
@@ -8930,9 +8947,24 @@ const Stepper = ({
       return { borderColor: theme.CONTENT_SECONDRY };
     }
   };
+  const Divider = ({ status }) => {
+    const style = renderDividerStyle(status);
+    const dashed = status !== Status.Completed;
+    return /* @__PURE__ */ React.createElement(Svg, { height: 1, width: "100%" }, /* @__PURE__ */ React.createElement(
+      Line$1,
+      {
+        x1: "0",
+        y1: "0",
+        x2: "90%",
+        y2: "0",
+        stroke: style.borderColor,
+        strokeWidth: 1,
+        strokeDasharray: dashed ? "4,4" : void 0
+      }
+    ));
+  };
   return /* @__PURE__ */ React.createElement(View, { style: { ...styles$4.stepperContainer, ...containerStyle } }, data?.map((item, index) => {
     const stepCircleStyle = renderCircleStyle(item?.status);
-    const dividerStyle = renderDividerStyle(item?.status);
     const labelStyle = renderLableStyle(item?.status);
     const lastViewStyle = index === data?.length - 1 ? styles$4.lastStepWrapper : null;
     return /* @__PURE__ */ React.createElement(
@@ -8950,7 +8982,7 @@ const Stepper = ({
             color: theme.CONTENT_PRIMARY
           }
         }
-      ), showStatus && item?.status === Status.Completed && completedStatusIcon), index != data?.length - 1 && /* @__PURE__ */ React.createElement(View, { style: { ...styles$4.separator, ...dividerStyle } })),
+      ), showStatus && item?.status === Status.Completed && completedStatusIcon), index != data?.length - 1 && /* @__PURE__ */ React.createElement(View, { style: styles$4.newDividerStyle }, /* @__PURE__ */ React.createElement(Divider, { status: item.status }))),
       /* @__PURE__ */ React.createElement(View, { style: styles$4.lableContainer }, /* @__PURE__ */ React.createElement(
         CustomTypography,
         {