dhre-ui-kit 2.0.10 → 2.0.12

package/lib/index.d.ts

@@ -281,6 +281,8 @@ declare enum Theme {
     CONTENT_STATIC = "CONTENT_STATIC",
     CONTENT_PRIMARY_STATIC = "CONTENT_PRIMARY_STATIC",
     CONTENT_SECONDRY_STATIC = "CONTENT_SECONDRY_STATIC",
+    CONTENT_SECONDARY_TEXT = "CONTENT_SECONDARY_TEXT",
+    CONTENT_SECTION_HEADER_TEXT = "CONTENT_SECTION_HEADER_TEXT",
     BORDER_PRIMARY = "BORDER_PRIMARY",
     BORDER_SECONDRY = "BORDER_SECONDRY",
     BORDER_DISABLE = "BORDER_DISABLE",
@@ -593,6 +595,7 @@ interface ScrollableListProps {
     activeTextStyle?: TextStyle;
     enableTextWrap?: boolean;
     errorTextStyle?: TextStyle;
+    inActiveTextStyle?: TextStyle;
 }
 declare const _default$7: (props: ScrollableListProps) => React$1.JSX.Element;
 
@@ -605,6 +608,7 @@ declare const _default$6: (props: {
     clearAllData?: () => void;
     handleSendFeedback?: () => void;
     setFeedback: (val: string) => void;
+    inputStyle?: ViewStyle;
 }) => React$1.JSX.Element;
 
 interface MobileNumberInputProps {
@@ -865,6 +869,14 @@ declare const theme: {
         light: string;
         dark: string;
     };
+    CONTENT_SECONDARY_TEXT: {
+        light: string;
+        dark: string;
+    };
+    CONTENT_SECTION_HEADER_TEXT: {
+        light: string;
+        dark: string;
+    };
     CONTENT_DISABLE: {
         light: string;
         dark: string;

package/lib/index.js

@@ -19,6 +19,7 @@ var reactNativePaper = require('react-native-paper');
 var reactNativeElementDropdown = require('react-native-element-dropdown');
 var DocumentPicker = require('react-native-document-picker');
 var RNFS = require('react-native-fs');
+var Svg = require('react-native-svg');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -51,6 +52,7 @@ var DeviceInfo__default = /*#__PURE__*/_interopDefaultLegacy(DeviceInfo);
 var CountryPicker__default = /*#__PURE__*/_interopDefaultLegacy(CountryPicker);
 var DocumentPicker__default = /*#__PURE__*/_interopDefaultLegacy(DocumentPicker);
 var RNFS__default = /*#__PURE__*/_interopDefaultLegacy(RNFS);
+var Svg__default = /*#__PURE__*/_interopDefaultLegacy(Svg);
 
 var ShapeType = /* @__PURE__ */ ((ShapeType2) => {
   ShapeType2["LINE"] = "line";
@@ -134,6 +136,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";
@@ -216,6 +220,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"
@@ -7636,7 +7648,8 @@ const ScrollableList = ({
   errorStyle,
   errorTextStyle,
   activeTextStyle,
-  enableTextWrap
+  enableTextWrap,
+  inActiveTextStyle
 }) => {
   const [selectedItem, setSelectedItem] = React.useState(
     data && data.length > 0 ? data[0].name : null
@@ -7676,7 +7689,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__default["default"].createElement(reactNative.View, { style: [styles.errorViewStyle, errorStyle] }, item?.errorText ? /* @__PURE__ */ React__default["default"].createElement(
@@ -7790,7 +7803,8 @@ const FeedbackForm = ({
   inputText,
   rightBtnTxt,
   leftBtnTxt,
-  setFeedback
+  setFeedback,
+  inputStyle = {}
 }) => {
   const maxChars = 200;
   const { theme } = useTheme();
@@ -7806,7 +7820,7 @@ const FeedbackForm = ({
   ), /* @__PURE__ */ React__default["default"].createElement(
     reactNative.TextInput,
     {
-      style: [styles.textInput, { height: Math.max(100) }],
+      style: [styles.textInput, inputStyle, { height: Math.max(100) }],
       placeholder: inputText,
       multiline: true,
       placeholderTextColor: Theme.CONTENT_SECONDRY,
@@ -8907,7 +8921,11 @@ const styles$4 = reactNative.StyleSheet.create({
     width: "100%",
     marginLeft: 10
   },
-  lableContainer: { width: 60 }
+  lableContainer: { width: 60 },
+  newDividerStyle: {
+    marginLeft: 10,
+    width: "100%"
+  }
 });
 
 var Status = /* @__PURE__ */ ((Status2) => {
@@ -8966,9 +8984,24 @@ const Stepper = ({
       return { borderColor: theme.CONTENT_SECONDRY };
     }
   };
+  const Divider = ({ status }) => {
+    const style = renderDividerStyle(status);
+    const dashed = status !== Status.Completed;
+    return /* @__PURE__ */ React__default["default"].createElement(Svg__default["default"], { height: 1, width: "100%" }, /* @__PURE__ */ React__default["default"].createElement(
+      Svg.Line,
+      {
+        x1: "0",
+        y1: "0",
+        x2: "90%",
+        y2: "0",
+        stroke: style.borderColor,
+        strokeWidth: 1,
+        strokeDasharray: dashed ? "4,4" : void 0
+      }
+    ));
+  };
   return /* @__PURE__ */ React__default["default"].createElement(reactNative.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__default["default"].createElement(
@@ -8986,7 +9019,7 @@ const Stepper = ({
             color: theme.CONTENT_PRIMARY
           }
         }
-      ), showStatus && item?.status === Status.Completed && completedStatusIcon), index != data?.length - 1 && /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: { ...styles$4.separator, ...dividerStyle } })),
+      ), showStatus && item?.status === Status.Completed && completedStatusIcon), index != data?.length - 1 && /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$4.newDividerStyle }, /* @__PURE__ */ React__default["default"].createElement(Divider, { status: item.status }))),
       /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$4.lableContainer }, /* @__PURE__ */ React__default["default"].createElement(
         CustomTypography,
         {