medos-sdk 1.1.11 → 1.1.12

package/dist/components/styles/appointment.js

@@ -0,0 +1,220 @@
+export const PHONE_VERIFY_STYLES = {
+    container: {
+        border: "1px solid #e5e7eb",
+        borderRadius: 12,
+        overflow: "hidden",
+        backgroundColor: "#fff",
+        boxShadow: "0 1px 3px rgba(0, 0, 0, 0.04)",
+    },
+    header: {
+        padding: "18px 24px",
+        borderBottom: "1px solid #e5e7eb",
+        backgroundColor: "#27903F",
+        color: "#fff",
+    },
+    title: {
+        margin: 0,
+        fontSize: 18,
+        fontWeight: 600,
+        color: "#fff",
+    },
+    content: { padding: "24px" },
+    label: {
+        display: "block",
+        fontSize: 14,
+        fontWeight: 500,
+        color: "#111827",
+        marginBottom: 8,
+    },
+    phoneInputContainer: { display: "flex", gap: 10 },
+    phoneInput: {
+        flex: 1,
+        padding: "10px 14px",
+        borderRadius: 8,
+        border: "1px solid #e5e7eb",
+        fontSize: 14,
+        outline: "none",
+        color: "#111827",
+        boxSizing: "border-box",
+        transition: "border-color 0.2s ease, box-shadow 0.2s ease",
+        minHeight: 40,
+    },
+    phoneDisplay: {
+        padding: "10px 14px",
+        background: "#f9fafb",
+        borderRadius: 8,
+        fontSize: 14,
+        color: "#111827",
+        fontWeight: 500,
+        border: "1px solid #e5e7eb",
+    },
+    otpInput: {
+        width: "100%",
+        padding: "10px 14px",
+        border: "1px solid #e5e7eb",
+        borderRadius: 8,
+        fontSize: 14,
+        outline: "none",
+        color: "#111827",
+        boxSizing: "border-box",
+        transition: "border-color 0.2s ease, box-shadow 0.2s ease",
+    },
+    otpHint: {
+        marginTop: 8,
+        fontSize: 12,
+        color: "#6b7280",
+    },
+    successMessage: {
+        marginTop: 20,
+        padding: 16,
+        borderRadius: 8,
+        backgroundColor: "#F6FBF6",
+        border: "1px solid #4E8F50",
+        display: "flex",
+        alignItems: "center",
+        gap: 12,
+    },
+    successIcon: { fontSize: 24, color: "#4E8F50" },
+    successTitle: {
+        fontSize: 14,
+        fontWeight: 600,
+        color: "#4E8F50",
+    },
+    successSubtitle: {
+        fontSize: 12,
+        color: "#6B7280",
+        marginTop: 2,
+    },
+    footer: {
+        padding: "16px 24px",
+        borderTop: "1px solid #e5e7eb",
+        backgroundColor: "#fff",
+        display: "flex",
+        gap: 12,
+        justifyContent: "flex-end",
+    },
+};
+export const PATIENT_DETAILS_STYLES = {
+    sectionCard: {
+        border: "1px solid #E5E7EB",
+        borderRadius: "12px",
+        marginBottom: "24px",
+        overflow: "hidden",
+        boxShadow: "0 1px 3px rgba(0, 0, 0, 0.04)",
+    },
+    sectionHeader: {
+        backgroundColor: "#27903F",
+        padding: "18px 24px",
+        display: "flex",
+        alignItems: "center",
+        gap: "12px",
+        borderBottom: "1px solid #E5E7EB",
+        color: "#fff",
+    },
+    sectionTitle: {
+        fontSize: "18px",
+        fontWeight: 600,
+        margin: 0,
+        color: "#fff",
+    },
+    sectionBody: { padding: "24px" },
+    gridRow: {
+        display: "grid",
+        gridTemplateColumns: "1fr 1fr",
+        gap: "20px",
+        marginTop: "20px",
+    },
+    label: {
+        display: "block",
+        fontSize: 14,
+        marginBottom: 8,
+        color: "#111827",
+        fontWeight: 500,
+    },
+    input: {
+        width: "100%",
+        padding: "10px 14px",
+        borderRadius: 8,
+        border: "1px solid #e5e7eb",
+        outline: "none",
+        fontSize: 14,
+        boxSizing: "border-box",
+        transition: "border-color 0.2s ease, box-shadow 0.2s ease",
+        minHeight: 40,
+    },
+    phoneDisplay: { display: "flex", gap: "10px" },
+    phoneCode: {
+        width: "100px",
+        padding: "10px 14px",
+        borderRadius: 8,
+        border: "1px solid #e5e7eb",
+        backgroundColor: "#F9FAFB",
+        fontSize: 14,
+        boxSizing: "border-box",
+    },
+    phoneNumber: {
+        flex: 1,
+        padding: "10px 14px",
+        borderRadius: 8,
+        border: "1px solid #e5e7eb",
+        backgroundColor: "#F9FAFB",
+        fontSize: 14,
+        boxSizing: "border-box",
+    },
+};
+export const SUCCESS_STYLES = {
+    container: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        padding: "32px 24px",
+        textAlign: "center",
+    },
+    header: {
+        marginBottom: "24px",
+    },
+    iconContainer: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        width: "72px",
+        height: "72px",
+        borderRadius: "50%",
+        backgroundColor: "#ecfdf5",
+        marginBottom: "20px",
+    },
+    detailsContainer: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        gap: "12px",
+        textAlign: "center",
+    },
+    detailsTitle: {
+        fontWeight: 600,
+        fontSize: "18px",
+        color: "#4E8F50",
+        margin: 0,
+    },
+    detailsList: {
+        display: "flex",
+        flexDirection: "column",
+        gap: "4px",
+        fontSize: "14px",
+        width: "100%",
+        maxWidth: "400px",
+        textAlign: "center",
+        color: "#374151",
+    },
+    confirmationNote: {
+        marginTop: "12px",
+        fontSize: "14px",
+        color: "#6B7280",
+        lineHeight: "1.5",
+    },
+    actionContainer: {
+        marginTop: "32px",
+        display: "flex",
+        justifyContent: "center",
+    },
+};

package/dist/components/styles/enquiry.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const ENQUIRY_FORM_STYLES: Record<string, React.CSSProperties>;

package/dist/components/styles/enquiry.js

@@ -0,0 +1,3 @@
+export const ENQUIRY_FORM_STYLES = {
+    container: {},
+};

package/dist/components/styles/index.d.ts

@@ -0,0 +1,2 @@
+export { getContainerStyles, getButtonStyles, getPhoneVerifyStyles, getPatientDetailsStyles, getSuccessStyles, CONTAINER_STYLES, BUTTON_STYLES, PHONE_VERIFY_STYLES, PATIENT_DETAILS_STYLES, SUCCESS_STYLES, } from "../theme-styles";
+export { getMobileStyles, getDesktopStyles, } from "../appointment-booking/appointment-modal-styles";

package/dist/components/styles/index.js

@@ -0,0 +1,2 @@
+export { getContainerStyles, getButtonStyles, getPhoneVerifyStyles, getPatientDetailsStyles, getSuccessStyles, CONTAINER_STYLES, BUTTON_STYLES, PHONE_VERIFY_STYLES, PATIENT_DETAILS_STYLES, SUCCESS_STYLES, } from "../theme-styles";
+export { getMobileStyles, getDesktopStyles, } from "../appointment-booking/appointment-modal-styles";

package/dist/components/styles/shared.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+export declare const CONTAINER_STYLES: Record<string, React.CSSProperties>;
+export declare const BUTTON_STYLES: Record<string, React.CSSProperties>;

package/dist/components/styles/shared.js

@@ -0,0 +1,78 @@
+export const CONTAINER_STYLES = {
+    container: {
+        display: "flex",
+        justifyContent: "center",
+        padding: 20,
+        fontFamily: "'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial",
+        background: "#f6f8fa",
+    },
+    card: {
+        width: "100%",
+        maxWidth: 720,
+        background: "#fff",
+        borderRadius: 12,
+        boxShadow: "0 4px 12px rgba(0, 0, 0, 0.08)",
+        padding: 24,
+        boxSizing: "border-box",
+    },
+    header: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "space-between",
+        marginBottom: 20,
+    },
+    title: {
+        marginLeft: 10,
+        fontSize: 20,
+        fontWeight: 600,
+        margin: 0,
+    },
+    section: { marginTop: 16 },
+    errorMessage: {
+        marginBottom: 16,
+        padding: "12px 16px",
+        borderRadius: 8,
+        backgroundColor: "#fee2e2",
+        color: "#ef4444",
+        fontWeight: 500,
+        fontSize: 14,
+        border: "1px solid rgba(239, 68, 68, 0.2)",
+    },
+    actions: {
+        display: "flex",
+        gap: 12,
+        marginTop: 24,
+        paddingTop: 20,
+        borderTop: "1px solid #e5e7eb",
+        justifyContent: "flex-end",
+    },
+};
+export const BUTTON_STYLES = {
+    primary: {
+        background: "#009b4d",
+        color: "#fff",
+        border: "none",
+        padding: "10px 20px",
+        borderRadius: 8,
+        cursor: "pointer",
+        fontWeight: 600,
+        fontSize: 14,
+        transition: "all 0.2s ease",
+        minHeight: 40,
+        boxShadow: "0 1px 2px rgba(0, 0, 0, 0.05)",
+        lineHeight: "1.5",
+    },
+    secondary: {
+        background: "#fff",
+        color: "#111827",
+        border: "1px solid #e5e7eb",
+        padding: "10px 20px",
+        borderRadius: 8,
+        cursor: "pointer",
+        fontWeight: 600,
+        fontSize: 14,
+        transition: "all 0.2s ease",
+        minHeight: 40,
+        lineHeight: "1.5",
+    },
+};

package/dist/components/styles.d.ts

@@ -1,6 +1 @@
-import React from "react";
-export declare const CONTAINER_STYLES: Record<string, React.CSSProperties>;
-export declare const BUTTON_STYLES: Record<string, React.CSSProperties>;
-export declare const PHONE_VERIFY_STYLES: Record<string, React.CSSProperties>;
-export declare const PATIENT_DETAILS_STYLES: Record<string, React.CSSProperties>;
-export declare const SUCCESS_STYLES: Record<string, React.CSSProperties>;
+export * from "./styles";

package/dist/components/styles.js

@@ -1,298 +1 @@
-export const CONTAINER_STYLES = {
-    container: {
-        display: "flex",
-        justifyContent: "center",
-        padding: 20,
-        fontFamily: "'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial",
-        background: "#f6f8fa",
-    },
-    card: {
-        width: "100%",
-        maxWidth: 720,
-        background: "#fff",
-        borderRadius: 12,
-        boxShadow: "0 4px 12px rgba(0, 0, 0, 0.08)",
-        padding: 24,
-        boxSizing: "border-box",
-    },
-    header: {
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "space-between",
-        marginBottom: 20,
-    },
-    title: {
-        marginLeft: 10,
-        fontSize: 20,
-        fontWeight: 600,
-        margin: 0,
-    },
-    section: { marginTop: 16 },
-    errorMessage: {
-        marginBottom: 16,
-        padding: "12px 16px",
-        borderRadius: 8,
-        backgroundColor: "#fee2e2",
-        color: "#ef4444",
-        fontWeight: 500,
-        fontSize: 14,
-        border: "1px solid rgba(239, 68, 68, 0.2)",
-    },
-    actions: {
-        display: "flex",
-        gap: 12,
-        marginTop: 24,
-        paddingTop: 20,
-        borderTop: "1px solid #e5e7eb",
-        justifyContent: "flex-end",
-    },
-};
-export const BUTTON_STYLES = {
-    primary: {
-        background: "#009b4d",
-        color: "#fff",
-        border: "none",
-        padding: "10px 20px",
-        borderRadius: 8,
-        cursor: "pointer",
-        fontWeight: 600,
-        fontSize: 14,
-        transition: "all 0.2s ease",
-        minHeight: 40,
-        boxShadow: "0 1px 2px rgba(0, 0, 0, 0.05)",
-        lineHeight: "1.5",
-    },
-    secondary: {
-        background: "#fff",
-        color: "#111827",
-        border: "1px solid #e5e7eb",
-        padding: "10px 20px",
-        borderRadius: 8,
-        cursor: "pointer",
-        fontWeight: 600,
-        fontSize: 14,
-        transition: "all 0.2s ease",
-        minHeight: 40,
-        lineHeight: "1.5",
-    },
-};
-export const PHONE_VERIFY_STYLES = {
-    container: {
-        border: "1px solid #e5e7eb",
-        borderRadius: 12,
-        overflow: "hidden",
-        backgroundColor: "#fff",
-        boxShadow: "0 1px 3px rgba(0, 0, 0, 0.04)",
-    },
-    header: {
-        padding: "18px 24px",
-        borderBottom: "1px solid #e5e7eb",
-        backgroundColor: "#27903F",
-        color: "#fff",
-    },
-    title: {
-        margin: 0,
-        fontSize: 18,
-        fontWeight: 600,
-        color: "#fff",
-    },
-    content: { padding: "24px" },
-    label: {
-        display: "block",
-        fontSize: 14,
-        fontWeight: 500,
-        color: "#111827",
-        marginBottom: 8,
-    },
-    phoneInputContainer: { display: "flex", gap: 10 },
-    phoneInput: {
-        flex: 1,
-        padding: "10px 14px",
-        borderRadius: 8,
-        border: "1px solid #e5e7eb",
-        fontSize: 14,
-        outline: "none",
-        color: "#111827",
-        boxSizing: "border-box",
-        transition: "border-color 0.2s ease, box-shadow 0.2s ease",
-        minHeight: 40,
-    },
-    phoneDisplay: {
-        padding: "10px 14px",
-        background: "#f9fafb",
-        borderRadius: 8,
-        fontSize: 14,
-        color: "#111827",
-        fontWeight: 500,
-        border: "1px solid #e5e7eb",
-    },
-    otpInput: {
-        width: "100%",
-        padding: "10px 14px",
-        border: "1px solid #e5e7eb",
-        borderRadius: 8,
-        fontSize: 14,
-        outline: "none",
-        color: "#111827",
-        boxSizing: "border-box",
-        transition: "border-color 0.2s ease, box-shadow 0.2s ease",
-    },
-    otpHint: {
-        marginTop: 8,
-        fontSize: 12,
-        color: "#6b7280",
-    },
-    successMessage: {
-        marginTop: 20,
-        padding: 16,
-        borderRadius: 8,
-        backgroundColor: "#F6FBF6",
-        border: "1px solid #4E8F50",
-        display: "flex",
-        alignItems: "center",
-        gap: 12,
-    },
-    successIcon: { fontSize: 24, color: "#4E8F50" },
-    successTitle: {
-        fontSize: 14,
-        fontWeight: 600,
-        color: "#4E8F50",
-    },
-    successSubtitle: {
-        fontSize: 12,
-        color: "#6B7280",
-        marginTop: 2,
-    },
-    footer: {
-        padding: "16px 24px",
-        borderTop: "1px solid #e5e7eb",
-        backgroundColor: "#fff",
-        display: "flex",
-        gap: 12,
-        justifyContent: "flex-end",
-    },
-};
-export const PATIENT_DETAILS_STYLES = {
-    sectionCard: {
-        border: "1px solid #E5E7EB",
-        borderRadius: "12px",
-        marginBottom: "24px",
-        overflow: "hidden",
-        boxShadow: "0 1px 3px rgba(0, 0, 0, 0.04)",
-    },
-    sectionHeader: {
-        backgroundColor: "#27903F",
-        padding: "18px 24px",
-        display: "flex",
-        alignItems: "center",
-        gap: "12px",
-        borderBottom: "1px solid #E5E7EB",
-        color: "#fff",
-    },
-    sectionTitle: {
-        fontSize: "18px",
-        fontWeight: 600,
-        margin: 0,
-        color: "#fff",
-    },
-    sectionBody: { padding: "24px" },
-    gridRow: {
-        display: "grid",
-        gridTemplateColumns: "1fr 1fr",
-        gap: "20px",
-        marginTop: "20px",
-    },
-    label: {
-        display: "block",
-        fontSize: 14,
-        marginBottom: 8,
-        color: "#111827",
-        fontWeight: 500,
-    },
-    input: {
-        width: "100%",
-        padding: "10px 14px",
-        borderRadius: 8,
-        border: "1px solid #e5e7eb",
-        outline: "none",
-        fontSize: 14,
-        boxSizing: "border-box",
-        transition: "border-color 0.2s ease, box-shadow 0.2s ease",
-        minHeight: 40,
-    },
-    phoneDisplay: { display: "flex", gap: "10px" },
-    phoneCode: {
-        width: "100px",
-        padding: "10px 14px",
-        borderRadius: 8,
-        border: "1px solid #e5e7eb",
-        backgroundColor: "#F9FAFB",
-        fontSize: 14,
-        boxSizing: "border-box",
-    },
-    phoneNumber: {
-        flex: 1,
-        padding: "10px 14px",
-        borderRadius: 8,
-        border: "1px solid #e5e7eb",
-        backgroundColor: "#F9FAFB",
-        fontSize: 14,
-        boxSizing: "border-box",
-    },
-};
-export const SUCCESS_STYLES = {
-    container: {
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        padding: "32px 24px",
-        textAlign: "center",
-    },
-    header: {
-        marginBottom: "24px",
-    },
-    iconContainer: {
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center",
-        width: "72px",
-        height: "72px",
-        borderRadius: "50%",
-        backgroundColor: "#ecfdf5",
-        marginBottom: "20px",
-    },
-    detailsContainer: {
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        gap: "12px",
-        textAlign: "center",
-    },
-    detailsTitle: {
-        fontWeight: 600,
-        fontSize: "18px",
-        color: "#4E8F50",
-        margin: 0,
-    },
-    detailsList: {
-        display: "flex",
-        flexDirection: "column",
-        gap: "4px",
-        fontSize: "14px",
-        width: "100%",
-        maxWidth: "400px",
-        textAlign: "center",
-        color: "#374151",
-    },
-    confirmationNote: {
-        marginTop: "12px",
-        fontSize: "14px",
-        color: "#6B7280",
-        lineHeight: "1.5",
-    },
-    actionContainer: {
-        marginTop: "32px",
-        display: "flex",
-        justifyContent: "center",
-    },
-};
+export * from "./styles";

package/dist/components/theme-styles.js

@@ -45,6 +45,9 @@ export function getContainerStyles(theme, prefix = "medos", breakpoint) {
             fontSize: "14px",
             border: `1px solid ${theme.colors.error}20`,
         },
+        content: {
+            padding: isMobile ? "16px 0 16px 0" : "24px 0 24px 0",
+        },
         actions: {
             display: "flex",
             gap: "12px",
@@ -54,6 +57,21 @@ export function getContainerStyles(theme, prefix = "medos", breakpoint) {
             justifyContent: isMobile ? "stretch" : "flex-end",
             flexDirection: isMobile ? "column" : "row",
         },
+        branding: {
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            gap: "8px",
+            marginTop: isMobile ? "16px" : "24px",
+            paddingTop: isMobile ? "12px" : "16px",
+            borderTop: `1px solid ${theme.colors.border}`,
+            opacity: 0.8,
+        },
+        poweredBy: {
+            fontSize: "12px",
+            color: theme.colors.textSecondary,
+            fontWeight: 500,
+        },
     };
 }
 export function getButtonStyles(theme, prefix = "medos", breakpoint) {

package/dist/components/types/appointment.d.ts

@@ -0,0 +1,42 @@
+import React from "react";
+export type { AppointmentState, AppointmentAction, Patient, SessionPack, AvailablePackage, BookingOptionType, } from "../appointment-booking/types";
+export { INITIAL_STATE } from "../appointment-booking/types";
+export type PhoneVerificationStepProps = {
+    state: any;
+    dispatch: React.Dispatch<any>;
+    onSendOtp: () => Promise<void>;
+    onVerifyOtp: () => Promise<void>;
+    onBack: () => void;
+    onContinue: () => void;
+};
+export type PatientDetailsStepProps = {
+    state: any;
+    dispatch: React.Dispatch<any>;
+    onBack: () => void;
+    onSubmit: () => Promise<void>;
+    isFirstStep?: boolean;
+};
+export type SuccessStepProps = {
+    onReset: () => void;
+};
+export type PhoneInputSectionProps = {
+    countryCode: string;
+    patientPhone: string;
+    onCountryCodeChange: (code: string) => void;
+    onPhoneChange: (phone: string) => void;
+};
+export type OtpInputSectionProps = {
+    countryCode: string;
+    patientPhone: string;
+    otpCode: string;
+    otpVerified: boolean;
+    onOtpChange: (code: string) => void;
+};
+export type PatientInfoSectionProps = {
+    state: any;
+    dispatch: React.Dispatch<any>;
+};
+export type AddressInfoSectionProps = {
+    state: any;
+    dispatch: React.Dispatch<any>;
+};

package/dist/components/types/appointment.js

@@ -0,0 +1 @@
+export { INITIAL_STATE } from "../appointment-booking/types";