@abihealth/goapp-react-native 1.17.0 → 1.18.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## [1.18.0](https://github.com/abiglobalhealth/react-native-sdk/compare/goapp-react-native-v1.17.0...goapp-react-native-v1.18.0) (2025-03-19)
+
+
+### Features
+
+* Add indication survey and searchable dropdown features ([#139](https://github.com/abiglobalhealth/react-native-sdk/issues/139)) ([782b022](https://github.com/abiglobalhealth/react-native-sdk/commit/782b022ce2d693c3746c2635120b03a02a56c13f))
+
+
+### Bug Fixes
+
+* answer screen theme in prescription card ([#145](https://github.com/abiglobalhealth/react-native-sdk/issues/145)) ([0f321a1](https://github.com/abiglobalhealth/react-native-sdk/commit/0f321a12ebb693c4e1c29c824a76c1b260524ad3))
+
 ## [1.17.0](https://github.com/abiglobalhealth/react-native-sdk/compare/goapp-react-native-v1.16.0...goapp-react-native-v1.17.0) (2025-03-18)
 
 

package/dist/common/assets/ChevronIcon.d.ts

@@ -0,0 +1,6 @@
+import { ColorValue, ViewStyle } from 'react-native';
+declare const ChevronIcon: ({ color, style }: {
+    color: ColorValue;
+    style?: ViewStyle;
+}) => import("react").JSX.Element;
+export default ChevronIcon;

package/dist/common/assets/ChevronIcon.js

@@ -0,0 +1,43 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_native_svg_1 = __importStar(require("react-native-svg"));
+var ChevronIcon = function (_a) {
+    var color = _a.color, style = _a.style;
+    return (<react_native_svg_1.default width={12} height={8} fill="none" viewBox="0 0 12 8" style={style}>
+    <react_native_svg_1.Path fill={color} d="M5.997 7.381a.93.93 0 0 1-.71-.287L.239 2.046A.815.815 0 0 1 0 1.46.794.794 0 0 1 .24.863.807.807 0 0 1 .83.619c.231 0 .429.081.592.244l4.574 4.574L10.572.863a.814.814 0 0 1 .587-.239.795.795 0 0 1 .597.239c.163.162.244.36.244.591 0 .232-.081.43-.244.592L6.708 7.094a.93.93 0 0 1-.71.287Z"/>
+  </react_native_svg_1.default>);
+};
+exports.default = ChevronIcon;

package/dist/common/assets/ChevronIcon.tsx

@@ -0,0 +1,12 @@
+import { ColorValue, ViewStyle } from 'react-native'
+import Svg, { Path } from 'react-native-svg'
+
+const ChevronIcon = ({ color, style }: { color: ColorValue; style?: ViewStyle }) => (
+  <Svg width={12} height={8} fill="none" viewBox="0 0 12 8" style={style}>
+    <Path
+      fill={color}
+      d="M5.997 7.381a.93.93 0 0 1-.71-.287L.239 2.046A.815.815 0 0 1 0 1.46.794.794 0 0 1 .24.863.807.807 0 0 1 .83.619c.231 0 .429.081.592.244l4.574 4.574L10.572.863a.814.814 0 0 1 .587-.239.795.795 0 0 1 .597.239c.163.162.244.36.244.591 0 .232-.081.43-.244.592L6.708 7.094a.93.93 0 0 1-.71.287Z"
+    />
+  </Svg>
+)
+export default ChevronIcon

package/dist/common/assets/SearchGlassIcon.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const SearchGlassIcon: () => React.JSX.Element;
+export default SearchGlassIcon;

package/dist/common/assets/SearchGlassIcon.js

@@ -0,0 +1,48 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+var React = __importStar(require("react"));
+var react_native_svg_1 = __importStar(require("react-native-svg"));
+var SearchGlassIcon = function () { return (<react_native_svg_1.default width={24} height={24} fill="none">
+    <react_native_svg_1.G clipPath="url(#a)">
+      <react_native_svg_1.Path fill="#757575" d="m23.485 21.487-4.594-4.594a10.44 10.44 0 0 0 2.157-6.367c0-2.811-1.095-5.455-3.084-7.443A10.457 10.457 0 0 0 10.521 0a10.457 10.457 0 0 0-7.443 3.083c-4.104 4.104-4.104 10.782 0 14.886a10.456 10.456 0 0 0 7.443 3.083 10.44 10.44 0 0 0 6.367-2.156l4.594 4.595c.277.276.64.415 1.002.415s.725-.139 1.001-.415a1.416 1.416 0 0 0 0-2.004ZM5.081 15.966c-3-3-2.999-7.88 0-10.88a7.644 7.644 0 0 1 5.44-2.253c2.055 0 3.987.8 5.44 2.253a7.643 7.643 0 0 1 2.253 5.44c0 2.055-.8 3.987-2.253 5.44a7.642 7.642 0 0 1-5.44 2.253c-2.055 0-3.987-.8-5.44-2.253Z"/>
+    </react_native_svg_1.G>
+    <react_native_svg_1.Defs>
+      <react_native_svg_1.ClipPath id="a">
+        <react_native_svg_1.Path fill="#fff" d="M0 0h24v24H0z"/>
+      </react_native_svg_1.ClipPath>
+    </react_native_svg_1.Defs>
+  </react_native_svg_1.default>); };
+exports.default = SearchGlassIcon;

package/dist/common/assets/SearchGlassIcon.tsx

@@ -0,0 +1,19 @@
+import * as React from 'react'
+import Svg, { ClipPath, Defs, G, Path } from 'react-native-svg'
+
+const SearchGlassIcon = () => (
+  <Svg width={24} height={24} fill="none">
+    <G clipPath="url(#a)">
+      <Path
+        fill="#757575"
+        d="m23.485 21.487-4.594-4.594a10.44 10.44 0 0 0 2.157-6.367c0-2.811-1.095-5.455-3.084-7.443A10.457 10.457 0 0 0 10.521 0a10.457 10.457 0 0 0-7.443 3.083c-4.104 4.104-4.104 10.782 0 14.886a10.456 10.456 0 0 0 7.443 3.083 10.44 10.44 0 0 0 6.367-2.156l4.594 4.595c.277.276.64.415 1.002.415s.725-.139 1.001-.415a1.416 1.416 0 0 0 0-2.004ZM5.081 15.966c-3-3-2.999-7.88 0-10.88a7.644 7.644 0 0 1 5.44-2.253c2.055 0 3.987.8 5.44 2.253a7.643 7.643 0 0 1 2.253 5.44c0 2.055-.8 3.987-2.253 5.44a7.642 7.642 0 0 1-5.44 2.253c-2.055 0-3.987-.8-5.44-2.253Z"
+      />
+    </G>
+    <Defs>
+      <ClipPath id="a">
+        <Path fill="#fff" d="M0 0h24v24H0z" />
+      </ClipPath>
+    </Defs>
+  </Svg>
+)
+export default SearchGlassIcon

package/dist/common/components/AnswerScreen/PrescriptionCard/index.js

@@ -22,7 +22,7 @@ var PrescriptionCard = function (_a) {
     var screens = (0, useCustomComponents_1.useCustomComponents)().screens;
     var medication = [prescription.data.medication, prescription.data.quantity].join(', ');
     return (<Card_1.Card type="prescription" style={[styles.container, (_c = (_b = screens === null || screens === void 0 ? void 0 : screens.AnswerScreen) === null || _b === void 0 ? void 0 : _b.prescriptionCard) === null || _c === void 0 ? void 0 : _c.containerStyle]}>
-      {((_e = (_d = screens.AnswerScreen) === null || _d === void 0 ? void 0 : _d.prescriptionCard) === null || _e === void 0 ? void 0 : _e.customComponent) ? (<screens.AnswerScreen.prescriptionCard.customComponent prescription={prescription}/>) : (<react_native_1.View style={styles.innerContainer}>
+      {((_e = (_d = screens === null || screens === void 0 ? void 0 : screens.AnswerScreen) === null || _d === void 0 ? void 0 : _d.prescriptionCard) === null || _e === void 0 ? void 0 : _e.customComponent) ? (<screens.AnswerScreen.prescriptionCard.customComponent prescription={prescription}/>) : (<react_native_1.View style={styles.innerContainer}>
           <react_native_1.View style={styles.header}>
             <PillsIcon_1.PillsIcon />
             <Text_1.Text bold>{t('prescription.request.details')}</Text_1.Text>

package/dist/common/icons/CloseIcon.d.ts

@@ -1,5 +1,7 @@
 import React from 'react';
 import { ColorValue } from 'react-native';
-export declare const CloseIcon: ({ color }: {
+export declare const CloseIcon: ({ color, width, height }: {
     color?: ColorValue;
+    width?: number;
+    height?: number;
 }) => React.JSX.Element;

package/dist/common/icons/CloseIcon.js

@@ -41,10 +41,10 @@ var useTheme_1 = require("../hooks/useTheme");
 var react_1 = __importDefault(require("react"));
 var react_native_svg_1 = __importStar(require("react-native-svg"));
 var CloseIcon = function (_a) {
-    var color = _a.color;
+    var color = _a.color, _b = _a.width, width = _b === void 0 ? 20 : _b, _c = _a.height, height = _c === void 0 ? 20 : _c;
     var palette = (0, useTheme_1.useTheme)().palette;
     var parsedColor = color || palette.white;
-    return (<react_native_svg_1.default width={20} height={20} viewBox="0 0 20 20" fill="none">
+    return (<react_native_svg_1.default width={width} height={height} viewBox="0 0 20 20" fill="none">
       <react_native_svg_1.Path d="M19.2969 1.39831C18.8039 0.884786 18.0076 0.884786 17.5146 1.39831L11.3333 7.82396L5.15207 1.38514C4.65908 0.871619 3.86272 0.871619 3.36974 1.38514C2.87675 1.89867 2.87675 2.72821 3.36974 3.24174L9.551 9.68056L3.36974 16.1194C2.87675 16.6329 2.87675 17.4624 3.36974 17.976C3.86272 18.4895 4.65908 18.4895 5.15207 17.976L11.3333 11.5371L17.5146 17.976C18.0076 18.4895 18.8039 18.4895 19.2969 17.976C19.7899 17.4624 19.7899 16.6329 19.2969 16.1194L13.1157 9.68056L19.2969 3.24174C19.7773 2.74138 19.7773 1.89867 19.2969 1.39831Z" fill={parsedColor}/>
     </react_native_svg_1.default>);
 };

package/dist/common/screens/AnswerScreen.js

@@ -60,7 +60,8 @@ var AnswerScreen = function (_a) {
     var scrollRef = (0, react_1.useRef)(null);
     var consultation = (0, useConsultation_1.useConsultation)().consultation;
     var _c = (0, react_1.useState)(false), showCloseConsultation = _c[0], setShowCloseConsultation = _c[1];
-    var AnswerScreen = (0, useCustomComponents_1.useCustomComponents)().screens.AnswerScreen;
+    var screens = (0, useCustomComponents_1.useCustomComponents)().screens;
+    var AnswerScreen = screens === null || screens === void 0 ? void 0 : screens.AnswerScreen;
     var scrollEnd = function () { var _a; return (_a = scrollRef.current) === null || _a === void 0 ? void 0 : _a.scrollToEnd({ animated: true }); };
     (0, react_1.useEffect)(function () { return scrollEnd(); }, [showCloseConsultation]);
     (0, react_1.useEffect)(function () {

package/dist/form-prescriptions/api/prescription.d.ts

@@ -1,2 +1,4 @@
-import { IndicationCategory } from './models/prescription';
+import { IndicationCategory } from '../api/models/prescription';
+import { IndicationSurveyQuestions } from '../types/indications';
 export declare const getIndicationSurveyList: () => Promise<IndicationCategory[]>;
+export declare const getIndicationSurvey: (id: string) => Promise<IndicationSurveyQuestions>;

package/dist/form-prescriptions/api/prescription.js

@@ -3,8 +3,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getIndicationSurveyList = void 0;
+exports.getIndicationSurvey = exports.getIndicationSurveyList = void 0;
 var axios_1 = __importDefault(require("axios"));
 var INDICATION_SURVEY_LIST_URL = '/prescription/indication-survey/list';
+var INDICATION_SURVEY_URL = '/prescription/indication-survey/';
 var getIndicationSurveyList = function () { return axios_1.default.get(INDICATION_SURVEY_LIST_URL).then(function (response) { return response === null || response === void 0 ? void 0 : response.data; }); };
 exports.getIndicationSurveyList = getIndicationSurveyList;
+var getIndicationSurvey = function (id) {
+    return axios_1.default.get("".concat(INDICATION_SURVEY_URL).concat(id)).then(function (response) { return response === null || response === void 0 ? void 0 : response.data; });
+};
+exports.getIndicationSurvey = getIndicationSurvey;

package/dist/form-prescriptions/components/FormPrescription.js

@@ -35,8 +35,6 @@ var ConsultationScreen = function () {
         var commonScreen = (0, screens_1.getCommonScreen)(consultation);
         if (commonScreen)
             return commonScreen;
-        if (!consultation)
-            return <HomeScreen_1.HomeScreen />;
         var status = consultation.status;
         switch (status) {
             default:

package/dist/form-prescriptions/components/IndicationCategory.d.ts

@@ -0,0 +1,3 @@
+import { IndicationCategory as IndicationCategoryProps } from '../api/models/prescription';
+export declare const IndicationCategory: ({ iconUrl, textKey, indications }: IndicationCategoryProps) => import("react").JSX.Element;
+export default IndicationCategory;

package/dist/form-prescriptions/components/IndicationCategory.js

@@ -0,0 +1,75 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IndicationCategory = void 0;
+var ChevronIcon_1 = __importDefault(require("../../common/assets/ChevronIcon"));
+var Text_1 = require("../../common/components/Text");
+var useTheme_1 = require("../../common/hooks/useTheme");
+var react_1 = require("react");
+var react_i18next_1 = require("react-i18next");
+var react_native_1 = require("react-native");
+var react_native_svg_1 = require("react-native-svg");
+var IndicationSurveyButton_1 = __importDefault(require("./IndicationSurveyButton"));
+var IndicationCategory = function (_a) {
+    var iconUrl = _a.iconUrl, textKey = _a.textKey, indications = _a.indications;
+    var t = (0, react_i18next_1.useTranslation)().t;
+    var theme = (0, useTheme_1.useTheme)();
+    var styles = getStyles(theme);
+    var _b = (0, react_1.useState)(false), open = _b[0], setOpen = _b[1];
+    return (<react_native_1.View style={styles.container}>
+      <react_native_1.View style={styles.titleContainer}>
+        <react_native_1.View style={styles.titleWrapper}>
+          <react_native_svg_1.SvgUri uri={iconUrl} style={styles.icon} accessibilityLabel={t(textKey)} width={16} height={16}/>
+          <Text_1.Text bold style={styles.title}>
+            {t(textKey)}
+          </Text_1.Text>
+        </react_native_1.View>
+        <react_native_1.TouchableOpacity onPress={function () { return setOpen(!open); }}>
+          <ChevronIcon_1.default color={open ? theme.palette.primary.base : theme.palette.black} style={open ? { transform: [{ rotate: '180deg' }] } : undefined}/>
+        </react_native_1.TouchableOpacity>
+      </react_native_1.View>
+      <react_native_1.View style={[styles.buttonsContainer, { display: open ? 'flex' : 'none' }]}>
+        {indications.map(function (indication) { return (<IndicationSurveyButton_1.default key={indication.textKey} {...indication}/>); })}
+      </react_native_1.View>
+    </react_native_1.View>);
+};
+exports.IndicationCategory = IndicationCategory;
+exports.default = exports.IndicationCategory;
+var getStyles = function (_a) {
+    var palette = _a.palette, spacing = _a.spacing;
+    return react_native_1.StyleSheet.create({
+        container: {
+            width: '100%',
+            paddingVertical: spacing.md,
+            borderBottomWidth: 1,
+            borderBottomColor: palette.white
+        },
+        titleContainer: {
+            justifyContent: 'space-between',
+            flexDirection: 'row',
+            alignItems: 'center',
+            flex: 1,
+            width: '100%'
+        },
+        titleWrapper: {
+            flexDirection: 'row',
+            overflow: 'hidden',
+            alignItems: 'center',
+            marginRight: spacing.sm,
+            flex: 1
+        },
+        buttonsContainer: {
+            width: '100%',
+            paddingTop: spacing.md,
+            gap: spacing.xs
+        },
+        icon: {
+            marginRight: spacing.xs
+        },
+        title: {
+            textTransform: 'uppercase'
+        }
+    });
+};

package/dist/form-prescriptions/components/IndicationSurveyButton.d.ts

@@ -1,3 +1,3 @@
 import { IndicationSurveyList } from '../api/models/prescription';
-export declare const IndicationSurveyButton: ({ iconUrl, textKey }: IndicationSurveyList) => import("react").JSX.Element;
+export declare const IndicationSurveyButton: ({ iconUrl, id, textKey }: IndicationSurveyList) => import("react").JSX.Element;
 export default IndicationSurveyButton;

package/dist/form-prescriptions/components/IndicationSurveyButton.js

@@ -3,17 +3,20 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.IndicationSurveyButton = void 0;
 var Text_1 = require("../../common/components/Text");
 var useTheme_1 = require("../../common/hooks/useTheme");
+var useIndicationSurvey_1 = require("../hooks/useIndicationSurvey");
 var react_i18next_1 = require("react-i18next");
 var react_native_1 = require("react-native");
+var react_native_svg_1 = require("react-native-svg");
 var IndicationSurveyButton = function (_a) {
-    var iconUrl = _a.iconUrl, textKey = _a.textKey;
+    var iconUrl = _a.iconUrl, id = _a.id, textKey = _a.textKey;
     var t = (0, react_i18next_1.useTranslation)().t;
     var theme = (0, useTheme_1.useTheme)();
     var styles = getStyles(theme);
-    return (<react_native_1.View style={[styles.container, theme.shadows.soft]}>
-      <react_native_1.Image source={{ uri: iconUrl }} style={styles.icon} accessibilityLabel={t(textKey)}/>
+    var onSelectIndication = (0, useIndicationSurvey_1.useIndicationSurvey)().onSelectIndication;
+    return (<react_native_1.TouchableOpacity style={[styles.container, theme.shadows.soft]} onPress={function () { return onSelectIndication(id.toString()); }}>
+      <react_native_svg_1.SvgUri uri={iconUrl} style={styles.icon} accessibilityLabel={t(textKey)} width={16} height={16}/>
       <Text_1.Text>{t(textKey)}</Text_1.Text>
-    </react_native_1.View>);
+    </react_native_1.TouchableOpacity>);
 };
 exports.IndicationSurveyButton = IndicationSurveyButton;
 exports.default = exports.IndicationSurveyButton;
@@ -21,16 +24,15 @@ var getStyles = function (_a) {
     var borderRadius = _a.borderRadius, palette = _a.palette, spacing = _a.spacing;
     return react_native_1.StyleSheet.create({
         container: {
+            width: '100%',
             borderRadius: borderRadius.md,
             backgroundColor: palette.white,
             flexDirection: 'row',
-            alignItems: 'flex-start',
-            justifyContent: 'center',
+            alignItems: 'center',
             padding: spacing.sm
         },
         icon: {
-            width: 16,
-            height: 16
+            marginRight: spacing.xs
         }
     });
 };

package/dist/form-prescriptions/components/Questionnaire/QuestionnaireQuestion/OpenEnded.js

@@ -60,7 +60,7 @@ var OpenEnded = function () {
                 return __generator(this, function (_a) {
                     addAnswer({
                         id: 'textArea',
-                        value: data.answer
+                        value: (data === null || data === void 0 ? void 0 : data.answer) || ''
                     });
                     nextStep();
                     return [2 /*return*/];

package/dist/form-prescriptions/components/Questionnaire/QuestionnaireQuestion/SingleChoice.js

@@ -51,8 +51,8 @@ var SingleChoice = function () {
             return setShowExitLogic(true);
         addAnswer({
             id: answer.id,
-            key: answer.titleKey,
-            value: t(answer.text)
+            key: answer.value,
+            value: t(answer.value)
         });
         nextStep();
     };
@@ -65,7 +65,7 @@ var SingleChoice = function () {
       {currentQuestion.answers
             .sort(function (a, z) { return a.order - z.order; })
             .map(function (answer) { return (<Button_1.Button key={answer.id} radio variant="secondary" onPress={function () { return handleSaveAnswer(answer); }}>
-            {t(answer.text)}
+            {t(answer.value)}
           </Button_1.Button>); })}
     </>);
 };

package/dist/form-prescriptions/components/SearchableDropdown.d.ts

@@ -0,0 +1,90 @@
+import { Theme } from '../../common/types/theme';
+import React from 'react';
+export type Item = {
+    label: string;
+    category?: string;
+    value: string;
+};
+interface SearchableDropDownProps {
+    items?: Item[];
+    defaultIndex?: number;
+    placeholder?: string;
+    placeholderTextColor?: string;
+    underlineColorAndroid?: string;
+    loading?: boolean;
+    onTextChange?: (_: string) => void;
+    onItemSelect?: (_?: any) => void;
+    onFocus?: () => void;
+}
+export declare const SearchableDropDown: (props: SearchableDropDownProps) => React.JSX.Element;
+export declare const getStyles: ({ palette, spacing, font, borderRadius }: Theme) => {
+    listContainer: {
+        backgroundColor: import("react-native").ColorValue;
+        width: "100%";
+        paddingHorizontal: number;
+        borderRadius: number;
+        flex: number;
+        minHeight: number;
+    };
+    itemContainer: {
+        width: "100%";
+        justifyContent: "center";
+        alignSelf: "center";
+        borderBottomWidth: number;
+        borderBottomColor: import("react-native").ColorValue;
+        paddingVertical: number;
+        gap: number;
+    };
+    notFoundContainer: {
+        backgroundColor: import("react-native").ColorValue;
+        borderRadius: number;
+        padding: number;
+    };
+    itemText: {
+        color: import("react-native").ColorValue;
+        fontSize: number;
+        fontWeight: "bold";
+    };
+    itemCategory: {
+        color: import("react-native").ColorValue;
+        fontSize: number;
+        paddingLeft: number;
+    };
+    modal: {
+        height: "80%";
+        backgroundColor: import("react-native").ColorValue;
+    };
+    modalContent: {
+        padding: number;
+        gap: number;
+        flex: number;
+    };
+    wrapperContainer: {
+        backgroundColor: import("react-native").ColorValue;
+        flexDirection: "row";
+        alignItems: "center";
+        height: number;
+        width: "100%";
+        borderColor: import("react-native").ColorValue;
+        borderWidth: number;
+        borderRadius: number;
+        padding: number;
+        marginBottom: number;
+        flex: number;
+        minHeight: number;
+        maxHeight: number;
+        justifyContent: "space-between";
+    };
+    input: {
+        outlineWidth: number;
+        flex: number;
+        borderWidth: number;
+        paddingHorizontal: number;
+        fontSize: number;
+        color: import("react-native").ColorValue;
+    };
+    center: {
+        textAlign: "center";
+    };
+};
+export {};

package/dist/form-prescriptions/components/SearchableDropdown.js

@@ -0,0 +1,212 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getStyles = exports.SearchableDropDown = void 0;
+var SearchGlassIcon_1 = __importDefault(require("../../common/assets/SearchGlassIcon"));
+var Modal_1 = require("../../common/components/Modal");
+var ModalHeader_1 = require("../../common/components/Modal/ModalHeader");
+var useTheme_1 = require("../../common/hooks/useTheme");
+var CloseIcon_1 = require("../../common/icons/CloseIcon");
+var DropdownIcon_1 = __importDefault(require("../../common/icons/DropdownIcon"));
+var platform_1 = require("../../common/utils/platform");
+var useIndicationSurvey_1 = require("../hooks/useIndicationSurvey");
+var react_1 = __importStar(require("react"));
+var react_i18next_1 = require("react-i18next");
+var react_native_1 = require("react-native");
+var SearchableDropDown = function (props) {
+    var _a = props.items, items = _a === void 0 ? [] : _a, defaultIndex = props.defaultIndex, _b = props.placeholder, placeholder = _b === void 0 ? 'Search...' : _b, placeholderTextColor = props.placeholderTextColor, _c = props.underlineColorAndroid, underlineColorAndroid = _c === void 0 ? 'transparent' : _c, onTextChange = props.onTextChange, onItemSelect = props.onItemSelect, onFocus = props.onFocus;
+    var t = (0, react_i18next_1.useTranslation)().t;
+    var theme = (0, useTheme_1.useTheme)();
+    var styles = (0, exports.getStyles)(theme);
+    var onSelectIndication = (0, useIndicationSurvey_1.useIndicationSurvey)().onSelectIndication;
+    var inputRef = (0, react_1.useRef)(null);
+    var _d = (0, react_1.useState)(), item = _d[0], setItem = _d[1];
+    var _e = (0, react_1.useState)(items), listItems = _e[0], setListItems = _e[1];
+    var _f = (0, react_1.useState)(false), focus = _f[0], setFocus = _f[1];
+    var _g = (0, react_1.useState)(''), searchTerm = _g[0], setSearchTerm = _g[1];
+    (0, react_1.useEffect)(function () {
+        setListItems(items === null || items === void 0 ? void 0 : items.filter(function (item) { var _a; return (_a = item === null || item === void 0 ? void 0 : item.label) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(searchTerm === null || searchTerm === void 0 ? void 0 : searchTerm.toLowerCase()); }));
+        onTextChange === null || onTextChange === void 0 ? void 0 : onTextChange(searchTerm);
+    }, [searchTerm, items]);
+    var searchItems = function (searchText) {
+        setSearchTerm(searchText);
+    };
+    (0, react_1.useEffect)(function () {
+        setListItems(items);
+    }, [items]);
+    (0, react_1.useEffect)(function () {
+        onItemSelect === null || onItemSelect === void 0 ? void 0 : onItemSelect(item === null || item === void 0 ? void 0 : item.value);
+    }, [item]);
+    var renderItem = function (_a) {
+        var item = _a.item;
+        return (<react_native_1.TouchableOpacity style={styles.itemContainer} onPress={function () {
+                setFocus(false);
+                setItem(item);
+                if (inputRef.current)
+                    inputRef.current.clear();
+                react_native_1.Keyboard.dismiss();
+                onSelectIndication(item.value);
+            }}>
+      <react_native_1.Text style={styles.itemText}>{item.label}</react_native_1.Text>
+      <react_native_1.Text style={styles.itemCategory}>{item.category}</react_native_1.Text>
+    </react_native_1.TouchableOpacity>);
+    };
+    return (<>
+      <react_native_1.TouchableOpacity style={styles.wrapperContainer} onPress={function () {
+            setFocus(true);
+            setTimeout(function () {
+                var _a;
+                (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            }, 500);
+            onFocus === null || onFocus === void 0 ? void 0 : onFocus();
+        }}>
+        <SearchGlassIcon_1.default />
+        <react_native_1.Text style={[styles.input, { color: (item === null || item === void 0 ? void 0 : item.label) ? theme.palette.black : placeholderTextColor }]}>{(item === null || item === void 0 ? void 0 : item.label) || placeholder}</react_native_1.Text>
+        <DropdownIcon_1.default />
+      </react_native_1.TouchableOpacity>
+
+      <Modal_1.Modal visible={focus} onRequestClose={function () {
+            if (inputRef.current)
+                inputRef.current.clear();
+            setFocus(false);
+        }} modalStyle={styles.modal}>
+        <ModalHeader_1.ModalHeader title={t('prescription.categories.searchbar')} onCancel={function () { return setFocus(false); }}/>
+        <react_native_1.View style={styles.modalContent}>
+          <react_native_1.View style={styles.wrapperContainer}>
+            <SearchGlassIcon_1.default />
+            <react_native_1.TextInput underlineColorAndroid={underlineColorAndroid} maxLength={80} ref={inputRef} onFocus={function () { return setFocus(true); }} onChangeText={searchItems} style={styles.input} placeholderTextColor={placeholderTextColor} placeholder={placeholder}/>
+            <react_native_1.TouchableOpacity onPress={function () {
+            var _a;
+            setSearchTerm('');
+            (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.clear();
+        }}>
+              <CloseIcon_1.CloseIcon color={theme.palette.black} width={12} height={12}/>
+            </react_native_1.TouchableOpacity>
+          </react_native_1.View>
+
+          {(listItems === null || listItems === void 0 ? void 0 : listItems.length) > 0 ? (<react_native_1.FlatList keyboardShouldPersistTaps="always" showsVerticalScrollIndicator={true} data={listItems} keyExtractor={function (item) { return item.value; }} renderItem={renderItem} style={[styles.listContainer, platform_1.isWeb && { maxHeight: 360 }]} persistentScrollbar scrollEnabled={true}/>) : (<react_native_1.View style={styles.notFoundContainer}>
+              <react_native_1.Text style={[styles.itemText, styles.center]}>{t('prescription.categories.no_results.title')}</react_native_1.Text>
+              <react_native_1.Text style={[styles.itemCategory, styles.center]}>{t('prescription.categories.no_results.description')}</react_native_1.Text>
+            </react_native_1.View>)}
+        </react_native_1.View>
+      </Modal_1.Modal>
+    </>);
+};
+exports.SearchableDropDown = SearchableDropDown;
+var getStyles = function (_a) {
+    var palette = _a.palette, spacing = _a.spacing, font = _a.font, borderRadius = _a.borderRadius;
+    return react_native_1.StyleSheet.create({
+        listContainer: {
+            backgroundColor: palette.white,
+            width: '100%',
+            paddingHorizontal: spacing.sm,
+            borderRadius: borderRadius.md,
+            flex: 1,
+            minHeight: 75
+        },
+        itemContainer: {
+            width: '100%',
+            justifyContent: 'center',
+            alignSelf: 'center',
+            borderBottomWidth: 1,
+            borderBottomColor: palette.grey.light,
+            paddingVertical: spacing.md,
+            gap: spacing.xxs
+        },
+        notFoundContainer: {
+            backgroundColor: palette.white,
+            borderRadius: borderRadius.md,
+            padding: spacing.md
+        },
+        itemText: {
+            color: palette.black,
+            fontSize: font.base.size,
+            fontWeight: 'bold'
+        },
+        itemCategory: {
+            color: palette.grey.dark,
+            fontSize: font.sm.size,
+            paddingLeft: spacing.sm
+        },
+        modal: {
+            height: '80%',
+            backgroundColor: palette.grey.light
+        },
+        modalContent: {
+            padding: spacing.sm,
+            gap: spacing.sm,
+            flex: 1
+        },
+        wrapperContainer: {
+            backgroundColor: palette.white,
+            flexDirection: 'row',
+            alignItems: 'center',
+            height: 54,
+            width: '100%',
+            borderColor: palette.grey.base,
+            borderWidth: 1,
+            borderRadius: borderRadius.md,
+            padding: spacing.sm,
+            marginBottom: spacing.sm,
+            flex: 1,
+            minHeight: 54,
+            maxHeight: 54,
+            justifyContent: 'space-between'
+        },
+        input: __assign({ flex: 1, borderWidth: 0, paddingHorizontal: spacing.sm, fontSize: font.base.size, color: palette.black }, react_native_1.Platform.select({
+            web: {
+                outlineWidth: 0
+            }
+        })),
+        center: {
+            textAlign: 'center'
+        }
+    });
+};
+exports.getStyles = getStyles;

package/dist/form-prescriptions/contexts/IndicationSurveyContext.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.IndicationSurveyProvider = exports.IndicationSurveyContext = void 0;
 var useTranslation_1 = require("../../common/hooks/useTranslation");
+var prescription_1 = require("../api/prescription");
 var indication_survey_1 = require("../mocks/indication-survey");
 var screens_1 = require("../types/screens");
 var react_1 = require("react");
@@ -27,6 +28,11 @@ var IndicationSurveyProvider = function (_a) {
     var _d = (0, react_1.useState)(1), questionnaireStep = _d[0], setQuestionnaireStep = _d[1];
     var _e = (0, react_1.useState)(indication_survey_1.INDICATION_SURVEY_MOCK), indicationSurvey = _e[0], setIndicationSurvey = _e[1]; // TODO: remove mock when merged with HOME screen
     var _f = (0, react_1.useState)(null), indicationSurveyAnswers = _f[0], setIndicationSurveyAnswers = _f[1];
+    (0, react_1.useEffect)(function () {
+        (0, prescription_1.getIndicationSurveyList)().then(function (response) {
+            setIndicationCategories(response);
+        });
+    }, []);
     (0, react_1.useEffect)(function () {
         if (!indicationSurvey)
             return setIndicationSurveyAnswers(null);

package/dist/form-prescriptions/hooks/useIndicationSurvey.d.ts

@@ -1,6 +1,6 @@
 export declare const useIndicationSurvey: () => {
-    indicationCategories: import("../..").IndicationCategory[];
-    setIndicationCategories: import("react").Dispatch<import("react").SetStateAction<import("../..").IndicationCategory[]>>;
+    indicationCategories: import("../..").IndicationCategoryType[];
+    setIndicationCategories: import("react").Dispatch<import("react").SetStateAction<import("../..").IndicationCategoryType[]>>;
     questionnaireStep: number;
     nextStep: () => void;
     previousStep: () => void;
@@ -8,4 +8,5 @@ export declare const useIndicationSurvey: () => {
     setIndicationSurvey: import("react").Dispatch<import("react").SetStateAction<import("../types/indications").IndicationSurveyQuestions>>;
     currentQuestion: import("../types/indications").IndicationQuestion;
     resetIndicationSurvey: () => void;
+    onSelectIndication: (indicationId: string) => void;
 };

package/dist/form-prescriptions/hooks/useIndicationSurvey.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useIndicationSurvey = void 0;
+var prescription_1 = require("../api/prescription");
 var IndicationSurveyContext_1 = require("../contexts/IndicationSurveyContext");
 var screens_1 = require("../types/screens");
 var react_1 = require("react");
@@ -26,6 +27,12 @@ var useIndicationSurvey = function () {
         removeLastAnswer();
         setQuestionnaireStep(function (prev) { return prev - 1; });
     };
+    var onSelectIndication = function (indicationId) {
+        (0, prescription_1.getIndicationSurvey)(indicationId).then(function (response) {
+            setIndicationSurvey(response);
+            setCurrentScreen(screens_1.FORM_PRESCRIPTION_SCREENS.QUESTIONNAIRE);
+        });
+    };
     return {
         indicationCategories: indicationCategories,
         setIndicationCategories: setIndicationCategories,
@@ -35,7 +42,8 @@ var useIndicationSurvey = function () {
         indicationSurvey: indicationSurvey,
         setIndicationSurvey: setIndicationSurvey,
         currentQuestion: currentQuestion,
-        resetIndicationSurvey: resetIndicationSurvey
+        resetIndicationSurvey: resetIndicationSurvey,
+        onSelectIndication: onSelectIndication
     };
 };
 exports.useIndicationSurvey = useIndicationSurvey;

package/dist/form-prescriptions/mocks/indication-survey.d.ts

@@ -10,8 +10,8 @@ export declare const INDICATION_SURVEY_MOCK: {
         order: number;
         answers: {
             id: number;
-            titleKey: any;
-            text: string;
+            key: any;
+            value: string;
             indicationSurveyQuestionId: number;
             isExitLogic: boolean;
             order: number;

package/dist/form-prescriptions/mocks/indication-survey.js

@@ -15,16 +15,16 @@ exports.INDICATION_SURVEY_MOCK = {
             answers: [
                 {
                     id: 107,
-                    titleKey: null,
-                    text: 'choice.yes',
+                    key: null,
+                    value: 'choice.yes',
                     indicationSurveyQuestionId: 98,
                     isExitLogic: false,
                     order: 1
                 },
                 {
                     id: 127,
-                    titleKey: null,
-                    text: 'choice.no',
+                    key: null,
+                    value: 'choice.no',
                     indicationSurveyQuestionId: 98,
                     isExitLogic: true,
                     order: 2
@@ -40,16 +40,16 @@ exports.INDICATION_SURVEY_MOCK = {
             answers: [
                 {
                     id: 147,
-                    titleKey: null,
-                    text: 'choice.yes',
+                    key: null,
+                    value: 'choice.yes',
                     indicationSurveyQuestionId: 117,
                     isExitLogic: true,
                     order: 1
                 },
                 {
                     id: 164,
-                    titleKey: null,
-                    text: 'choice.no',
+                    key: null,
+                    value: 'choice.no',
                     indicationSurveyQuestionId: 117,
                     isExitLogic: false,
                     order: 2
@@ -65,16 +65,16 @@ exports.INDICATION_SURVEY_MOCK = {
             answers: [
                 {
                     id: 185,
-                    titleKey: null,
-                    text: 'choice.yes',
+                    key: null,
+                    value: 'choice.yes',
                     indicationSurveyQuestionId: 138,
                     isExitLogic: true,
                     order: 1
                 },
                 {
                     id: 196,
-                    titleKey: null,
-                    text: 'choice.no',
+                    key: null,
+                    value: 'choice.no',
                     indicationSurveyQuestionId: 138,
                     isExitLogic: false,
                     order: 2
@@ -90,16 +90,16 @@ exports.INDICATION_SURVEY_MOCK = {
             answers: [
                 {
                     id: 218,
-                    titleKey: null,
-                    text: 'choice.yes',
+                    key: null,
+                    value: 'choice.yes',
                     indicationSurveyQuestionId: 170,
                     isExitLogic: true,
                     order: 1
                 },
                 {
                     id: 235,
-                    titleKey: null,
-                    text: 'choice.no',
+                    key: null,
+                    value: 'choice.no',
                     indicationSurveyQuestionId: 170,
                     isExitLogic: false,
                     order: 2
@@ -115,16 +115,16 @@ exports.INDICATION_SURVEY_MOCK = {
             answers: [
                 {
                     id: 252,
-                    titleKey: null,
-                    text: 'choice.yes',
+                    key: null,
+                    value: 'choice.yes',
                     indicationSurveyQuestionId: 189,
                     isExitLogic: true,
                     order: 1
                 },
                 {
                     id: 272,
-                    titleKey: null,
-                    text: 'choice.no',
+                    key: null,
+                    value: 'choice.no',
                     indicationSurveyQuestionId: 189,
                     isExitLogic: false,
                     order: 2
@@ -140,16 +140,16 @@ exports.INDICATION_SURVEY_MOCK = {
             answers: [
                 {
                     id: 288,
-                    titleKey: null,
-                    text: 'choice.yes',
+                    key: null,
+                    value: 'choice.yes',
                     indicationSurveyQuestionId: 210,
                     isExitLogic: true,
                     order: 1
                 },
                 {
                     id: 302,
-                    titleKey: null,
-                    text: 'choice.no',
+                    key: null,
+                    value: 'choice.no',
                     indicationSurveyQuestionId: 210,
                     isExitLogic: false,
                     order: 2
@@ -165,16 +165,16 @@ exports.INDICATION_SURVEY_MOCK = {
             answers: [
                 {
                     id: 323,
-                    titleKey: null,
-                    text: 'choice.yes',
+                    key: null,
+                    value: 'choice.yes',
                     indicationSurveyQuestionId: 229,
                     isExitLogic: true,
                     order: 1
                 },
                 {
                     id: 331,
-                    titleKey: null,
-                    text: 'choice.no',
+                    key: null,
+                    value: 'choice.no',
                     indicationSurveyQuestionId: 229,
                     isExitLogic: false,
                     order: 2
@@ -190,16 +190,16 @@ exports.INDICATION_SURVEY_MOCK = {
             answers: [
                 {
                     id: 355,
-                    titleKey: null,
-                    text: 'choice.yes',
+                    key: null,
+                    value: 'choice.yes',
                     indicationSurveyQuestionId: 250,
                     isExitLogic: true,
                     order: 1
                 },
                 {
                     id: 361,
-                    titleKey: null,
-                    text: 'choice.no',
+                    key: null,
+                    value: 'choice.no',
                     indicationSurveyQuestionId: 250,
                     isExitLogic: false,
                     order: 2
@@ -223,16 +223,16 @@ exports.INDICATION_SURVEY_MOCK = {
             answers: [
                 {
                     id: 600,
-                    titleKey: null,
-                    text: 'choice.understand_agree',
+                    key: null,
+                    value: 'choice.understand_agree',
                     indicationSurveyQuestionId: 459,
                     isExitLogic: false,
                     order: 1
                 },
                 {
                     id: 601,
-                    titleKey: null,
-                    text: 'choice.not_understand_not_agree',
+                    key: null,
+                    value: 'choice.not_understand_not_agree',
                     indicationSurveyQuestionId: 459,
                     isExitLogic: true,
                     order: 2
@@ -248,16 +248,16 @@ exports.INDICATION_SURVEY_MOCK = {
             answers: [
                 {
                     id: 608,
-                    titleKey: null,
-                    text: 'choice.understand_agree',
+                    key: null,
+                    value: 'choice.understand_agree',
                     indicationSurveyQuestionId: 470,
                     isExitLogic: false,
                     order: 1
                 },
                 {
                     id: 609,
-                    titleKey: null,
-                    text: 'choice.not_understand_not_agree',
+                    key: null,
+                    value: 'choice.not_understand_not_agree',
                     indicationSurveyQuestionId: 470,
                     isExitLogic: true,
                     order: 2
@@ -273,16 +273,16 @@ exports.INDICATION_SURVEY_MOCK = {
             answers: [
                 {
                     id: 611,
-                    titleKey: null,
-                    text: 'choice.understand_agree',
+                    key: null,
+                    value: 'choice.understand_agree',
                     indicationSurveyQuestionId: 475,
                     isExitLogic: false,
                     order: 1
                 },
                 {
                     id: 613,
-                    titleKey: null,
-                    text: 'choice.not_understand_not_agree',
+                    key: null,
+                    value: 'choice.not_understand_not_agree',
                     indicationSurveyQuestionId: 475,
                     isExitLogic: true,
                     order: 2

package/dist/form-prescriptions/screens/HomeScreen.js

@@ -1,14 +1,12 @@
 "use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
         }
-    return t;
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
 };
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
@@ -19,7 +17,9 @@ var Header_1 = require("../../common/components/Header");
 var ScreenWrapper_1 = require("../../common/components/ScreenWrapper");
 var useTheme_1 = require("../../common/hooks/useTheme");
 var useTranslation_1 = require("../../common/hooks/useTranslation");
-var IndicationSurveyButton_1 = __importDefault(require("../components/IndicationSurveyButton"));
+var IndicationCategory_1 = __importDefault(require("../components/IndicationCategory"));
+var SearchableDropdown_1 = require("../components/SearchableDropdown");
+var useIndicationSurvey_1 = require("../hooks/useIndicationSurvey");
 var FormPrescriptionIcon_1 = require("../icons/FormPrescriptionIcon");
 var react_1 = __importDefault(require("react"));
 var react_native_1 = require("react-native");
@@ -27,30 +27,15 @@ var HomeScreen = function () {
     var t = (0, useTranslation_1.useTranslation)().t;
     var theme = (0, useTheme_1.useTheme)();
     var styles = getStyles(theme);
+    var indicationCategories = (0, useIndicationSurvey_1.useIndicationSurvey)().indicationCategories;
+    var searchableItems = indicationCategories.reduce(function (acc, indicationCategory) { return __spreadArray(__spreadArray([], acc, true), indicationCategory.indications.map(function (indication) { return ({
+        label: indication.textKey,
+        value: indication.id,
+        category: indicationCategory.textKey
+    }); }), true); }, []);
     return (<ScreenWrapper_1.ScreenWrapper header={<Header_1.Header title={t('general.consultation.prescriptionRequest.title')} leftIcon={<FormPrescriptionIcon_1.FormPrescriptionIcon />}/>} containerStyle={styles.container}>
-      {[
-            {
-                id: 13,
-                textKey: 'indication.title.314316147',
-                iconUrl: 'https://assets.abi.ai/indication-surveys/acid-reflux-icon.svg',
-                order: 1
-            },
-            {
-                id: 14,
-                textKey: 'indication.title.314316009',
-                iconUrl: 'https://assets.abi.ai/indication-surveys/acid-reflux-icon.svg',
-                order: 2
-            },
-            {
-                id: 15,
-                textKey: 'indication.title.314315777',
-                iconUrl: 'https://assets.abi.ai/indication-surveys/acid-reflux-icon.svg',
-                order: 3
-            }
-        ].map(function (_a) {
-            var id = _a.id, indicationSurvey = __rest(_a, ["id"]);
-            return (<IndicationSurveyButton_1.default key={id} id={id} {...indicationSurvey}/>);
-        })}
+      <SearchableDropdown_1.SearchableDropDown items={searchableItems} placeholder={t('prescription.categories.searchbar')}/>
+      {indicationCategories.map(function (indicationCategory) { return (<IndicationCategory_1.default key={indicationCategory.id} {...indicationCategory}/>); })}
     </ScreenWrapper_1.ScreenWrapper>);
 };
 exports.HomeScreen = HomeScreen;

package/dist/form-prescriptions/types/indications.d.ts

@@ -1,7 +1,7 @@
 export interface IndicationQuestionAnswerOption {
     id: number;
-    titleKey: null;
-    text: string;
+    key: string | null;
+    value: string;
     indicationSurveyQuestionId: number;
     isExitLogic: boolean;
     order: number;

package/dist/index.d.ts

@@ -52,9 +52,11 @@ import { Theme } from './common/types/theme';
 import { isAndroid, isIOS } from './common/utils/platform';
 import { getProfessionalLabel } from './common/utils/professional';
 import { requiredCheckbox, requiredString, validPhone } from './common/utils/zod';
-import { IndicationCategory } from './form-prescriptions/api/models/prescription';
+import { IndicationCategory as IndicationCategoryType } from './form-prescriptions/api/models/prescription';
 import { FormPrescription } from './form-prescriptions/components/FormPrescription';
-import { HomeScreen } from './form-prescriptions/screens/HomeScreen';
+import { IndicationCategory } from './form-prescriptions/components/IndicationCategory';
+import { SearchableDropDown } from './form-prescriptions/components/SearchableDropdown';
+import { HomeScreen as PrescriptionHomeScreen } from './form-prescriptions/screens/HomeScreen';
 import { CallingAnimation } from './video-consultations/animations/CallingAnimation';
 import AgoraWrapper from './video-consultations/components/AgoraWrapper';
 import { EndVideoCallModal } from './video-consultations/components/Modal/EndVideoCallModal';
@@ -66,4 +68,4 @@ import { JoinVideoCallScreen } from './video-consultations/screens/JoinVideoCall
 import { ProcessingPrescriptionScreen } from './video-consultations/screens/ProcessingPrescriptionScreen';
 import VideoCallScreen from './video-consultations/screens/VideoCallScreen';
 export { AbiLogoIcon, AgoraWrapper, Animation, AnswerScreen, AttachmentPreviewModal, authorization, BackArrowIcon, BackgroundPattern, Button, CallingAnimation, CancelConsultationButton, CancelModal, Card, CASE_TYPE, Checkbox, CloseConsultationModal, CloseIcon, Consultation, CONSULTATION_STATUS, // TODO check this after last refactor
-ConsultationProvider, DateInput, DeliveryAddressScreen, DoctorIcon, DoctorProfileCard, DoctorProfileModal, EndingVideoScreen, EndVideoCallModal, FadeIn, FindingAnimation, FormPrescription, FormWrapper, getProfessionalLabel, Header, HKDeliveryAddressSchema, HomeScreen, HorizontalLoadingAnimation, IndicationCategory, InfoIcon, Input, isAndroid, isIOS, JoinVideoCallScreen, License, LoadingCircleAnimation, LoadingDotsAnimation, MatchingScreen, MatchScreen, Modal, NoConsultationFoundScreen, PhoneInput, PlaneIcon, PreparingSummaryScreen, Prescription, PRESCRIPTION_STATUS, ProcessingPrescriptionScreen, Professional, Question, QuestionType, RatingScreen, Reminder, requiredCheckbox, requiredString, ScreenWrapper, Select, Slide, Text, TextConsultationIcon, Theme, TwoOptionsModal, useConsultation, useTheme, useTranslation, validPhone, VideoCallScreen, VideoConsultation, VideoConsultationIcon };
+ConsultationProvider, DateInput, DeliveryAddressScreen, DoctorIcon, DoctorProfileCard, DoctorProfileModal, EndingVideoScreen, EndVideoCallModal, FadeIn, FindingAnimation, FormPrescription, FormWrapper, getProfessionalLabel, Header, HKDeliveryAddressSchema, HorizontalLoadingAnimation, IndicationCategory, IndicationCategoryType, InfoIcon, Input, isAndroid, isIOS, JoinVideoCallScreen, License, LoadingCircleAnimation, LoadingDotsAnimation, MatchingScreen, MatchScreen, Modal, NoConsultationFoundScreen, PhoneInput, PlaneIcon, PreparingSummaryScreen, Prescription, PRESCRIPTION_STATUS, PrescriptionHomeScreen, ProcessingPrescriptionScreen, Professional, Question, QuestionType, RatingScreen, Reminder, requiredCheckbox, requiredString, ScreenWrapper, SearchableDropDown, Select, Slide, Text, TextConsultationIcon, Theme, TwoOptionsModal, useConsultation, useTheme, useTranslation, validPhone, VideoCallScreen, VideoConsultation, VideoConsultationIcon };

package/dist/index.js

@@ -3,8 +3,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PRESCRIPTION_STATUS = exports.PreparingSummaryScreen = exports.PlaneIcon = exports.PhoneInput = exports.NoConsultationFoundScreen = exports.Modal = exports.MatchScreen = exports.MatchingScreen = exports.LoadingDotsAnimation = exports.LoadingCircleAnimation = exports.JoinVideoCallScreen = exports.isIOS = exports.isAndroid = exports.Input = exports.InfoIcon = exports.HorizontalLoadingAnimation = exports.HomeScreen = exports.HKDeliveryAddressSchema = exports.Header = exports.getProfessionalLabel = exports.FormWrapper = exports.FormPrescription = exports.FindingAnimation = exports.FadeIn = exports.EndVideoCallModal = exports.EndingVideoScreen = exports.DoctorProfileModal = exports.DoctorProfileCard = exports.DoctorIcon = exports.DeliveryAddressScreen = exports.DateInput = exports.ConsultationProvider = exports.CONSULTATION_STATUS = exports.CloseIcon = exports.CloseConsultationModal = exports.Checkbox = exports.CASE_TYPE = exports.Card = exports.CancelModal = exports.CancelConsultationButton = exports.CallingAnimation = exports.Button = exports.BackgroundPattern = exports.BackArrowIcon = exports.authorization = exports.AttachmentPreviewModal = exports.AnswerScreen = exports.Animation = exports.AgoraWrapper = exports.AbiLogoIcon = void 0;
-exports.VideoConsultationIcon = exports.VideoConsultation = exports.VideoCallScreen = exports.validPhone = exports.useTranslation = exports.useTheme = exports.useConsultation = exports.TwoOptionsModal = exports.TextConsultationIcon = exports.Text = exports.Slide = exports.Select = exports.ScreenWrapper = exports.requiredString = exports.requiredCheckbox = exports.Reminder = exports.RatingScreen = exports.QuestionType = exports.ProcessingPrescriptionScreen = void 0;
+exports.PRESCRIPTION_STATUS = exports.PreparingSummaryScreen = exports.PlaneIcon = exports.PhoneInput = exports.NoConsultationFoundScreen = exports.Modal = exports.MatchScreen = exports.MatchingScreen = exports.LoadingDotsAnimation = exports.LoadingCircleAnimation = exports.JoinVideoCallScreen = exports.isIOS = exports.isAndroid = exports.Input = exports.InfoIcon = exports.IndicationCategory = exports.HorizontalLoadingAnimation = exports.HKDeliveryAddressSchema = exports.Header = exports.getProfessionalLabel = exports.FormWrapper = exports.FormPrescription = exports.FindingAnimation = exports.FadeIn = exports.EndVideoCallModal = exports.EndingVideoScreen = exports.DoctorProfileModal = exports.DoctorProfileCard = exports.DoctorIcon = exports.DeliveryAddressScreen = exports.DateInput = exports.ConsultationProvider = exports.CONSULTATION_STATUS = exports.CloseIcon = exports.CloseConsultationModal = exports.Checkbox = exports.CASE_TYPE = exports.Card = exports.CancelModal = exports.CancelConsultationButton = exports.CallingAnimation = exports.Button = exports.BackgroundPattern = exports.BackArrowIcon = exports.authorization = exports.AttachmentPreviewModal = exports.AnswerScreen = exports.Animation = exports.AgoraWrapper = exports.AbiLogoIcon = void 0;
+exports.VideoConsultationIcon = exports.VideoConsultation = exports.VideoCallScreen = exports.validPhone = exports.useTranslation = exports.useTheme = exports.useConsultation = exports.TwoOptionsModal = exports.TextConsultationIcon = exports.Text = exports.Slide = exports.Select = exports.SearchableDropDown = exports.ScreenWrapper = exports.requiredString = exports.requiredCheckbox = exports.Reminder = exports.RatingScreen = exports.QuestionType = exports.ProcessingPrescriptionScreen = exports.PrescriptionHomeScreen = void 0;
 var Animation_1 = require("./common/animations/Animation");
 Object.defineProperty(exports, "Animation", { enumerable: true, get: function () { return Animation_1.Animation; } });
 var FindingAnimation_1 = require("./common/animations/FindingAnimation");
@@ -116,8 +116,12 @@ Object.defineProperty(exports, "requiredString", { enumerable: true, get: functi
 Object.defineProperty(exports, "validPhone", { enumerable: true, get: function () { return zod_1.validPhone; } });
 var FormPrescription_1 = require("./form-prescriptions/components/FormPrescription");
 Object.defineProperty(exports, "FormPrescription", { enumerable: true, get: function () { return FormPrescription_1.FormPrescription; } });
+var IndicationCategory_1 = require("./form-prescriptions/components/IndicationCategory");
+Object.defineProperty(exports, "IndicationCategory", { enumerable: true, get: function () { return IndicationCategory_1.IndicationCategory; } });
+var SearchableDropdown_1 = require("./form-prescriptions/components/SearchableDropdown");
+Object.defineProperty(exports, "SearchableDropDown", { enumerable: true, get: function () { return SearchableDropdown_1.SearchableDropDown; } });
 var HomeScreen_1 = require("./form-prescriptions/screens/HomeScreen");
-Object.defineProperty(exports, "HomeScreen", { enumerable: true, get: function () { return HomeScreen_1.HomeScreen; } });
+Object.defineProperty(exports, "PrescriptionHomeScreen", { enumerable: true, get: function () { return HomeScreen_1.HomeScreen; } });
 var CallingAnimation_1 = require("./video-consultations/animations/CallingAnimation");
 Object.defineProperty(exports, "CallingAnimation", { enumerable: true, get: function () { return CallingAnimation_1.CallingAnimation; } });
 var AgoraWrapper_1 = __importDefault(require("./video-consultations/components/AgoraWrapper"));

package/dist/video-consultations/screens/DeliveryAddressScreen.js

@@ -105,14 +105,13 @@ var DeliveryAddressScreen = function () {
     var styles = getStyles(theme);
     var _a = (0, useConsultation_1.useConsultation)(), consultation = _a.consultation, updateConsultation = _a.updateConsultation;
     var _b = (0, react_1.useState)(false), loading = _b[0], setLoading = _b[1];
-    var _c = (0, react_1.useState)(null), error = _c[0], setError = _c[1];
+    var _c = (0, react_1.useState)(false), error = _c[0], setError = _c[1];
     var onSubmit = function (data) { return __awaiter(void 0, void 0, void 0, function () {
         return __generator(this, function (_a) {
             setError(false);
             setLoading(true);
             (0, video_1.updateDeliveryAddress)(consultation === null || consultation === void 0 ? void 0 : consultation.id, __assign(__assign({}, data), { country: t('country.hk') }))
                 .then(function (res) {
-                console.log('esta es la respuesta', res);
                 updateConsultation(res);
             })
                 .catch(function () { return setError(true); })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abihealth/goapp-react-native",
-  "version": "1.17.0",
+  "version": "1.18.0",
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"
@@ -14,17 +14,6 @@
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "type": "module",
-  "scripts": {
-    "copy-assets:common": "mkdir -p dist/common/assets && cp -r src/common/assets dist/common || true",
-    "copy-assets:video-consultations": "mkdir -p dist/video-consultations/assets && cp -r src/video-consultations/assets dist/video-consultations || true",
-    "build": "rm -rf dist && pnpm copy-assets:common && pnpm copy-assets:video-consultations && tsc && tsc-alias",
-    "build:watch": "concurrently --kill-others \"tsc -w\" \"tsc-alias -w\"",
-    "start": "pnpm build:watch",
-    "start:ios": "pnpm start",
-    "type-check": "tsc --noEmit",
-    "lint": "eslint --fix",
-    "update-phrase": "npx -y phrase-cli pull"
-  },
   "dependencies": {
     "@sentry/react-native": "^6.7.0",
     "axios": "^1.7.9",
@@ -56,5 +45,16 @@
   },
   "exports": {
     ".": "./dist/index.js"
+  },
+  "scripts": {
+    "copy-assets:common": "mkdir -p dist/common/assets && cp -r src/common/assets dist/common || true",
+    "copy-assets:video-consultations": "mkdir -p dist/video-consultations/assets && cp -r src/video-consultations/assets dist/video-consultations || true",
+    "build": "rm -rf dist && pnpm copy-assets:common && pnpm copy-assets:video-consultations && tsc && tsc-alias",
+    "build:watch": "concurrently --kill-others \"tsc -w\" \"tsc-alias -w\"",
+    "start": "pnpm build:watch",
+    "start:ios": "pnpm start",
+    "type-check": "tsc --noEmit",
+    "lint": "eslint --fix",
+    "update-phrase": "npx -y phrase-cli pull"
   }
-}
+}

package/dist/common/api/models/common.d.ts

@@ -1,3 +0,0 @@
-export interface SuccessResponse {
-    success: boolean;
-}

package/dist/common/api/models/common.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });