@ews-admin/global-design-system 1.1.1 → 1.1.5

package/dist/index.js

@@ -207,11 +207,11 @@ const createLucideIcon = (iconName, iconNode) => {
  */
 
 
-const __iconNode$9 = [
+const __iconNode$b = [
   ["path", { d: "M5 12h14", key: "1ays0h" }],
   ["path", { d: "m12 5 7 7-7 7", key: "xquz4c" }]
 ];
-const ArrowRight = createLucideIcon("arrow-right", __iconNode$9);
+const ArrowRight = createLucideIcon("arrow-right", __iconNode$b);
 
 /**
  * @license lucide-react v0.544.0 - ISC
@@ -221,8 +221,8 @@ const ArrowRight = createLucideIcon("arrow-right", __iconNode$9);
  */
 
 
-const __iconNode$8 = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
-const Check = createLucideIcon("check", __iconNode$8);
+const __iconNode$a = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
+const Check = createLucideIcon("check", __iconNode$a);
 
 /**
  * @license lucide-react v0.544.0 - ISC
@@ -232,12 +232,12 @@ const Check = createLucideIcon("check", __iconNode$8);
  */
 
 
-const __iconNode$7 = [
+const __iconNode$9 = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["line", { x1: "12", x2: "12", y1: "8", y2: "12", key: "1pkeuh" }],
   ["line", { x1: "12", x2: "12.01", y1: "16", y2: "16", key: "4dfq90" }]
 ];
-const CircleAlert = createLucideIcon("circle-alert", __iconNode$7);
+const CircleAlert = createLucideIcon("circle-alert", __iconNode$9);
 
 /**
  * @license lucide-react v0.544.0 - ISC
@@ -247,11 +247,11 @@ const CircleAlert = createLucideIcon("circle-alert", __iconNode$7);
  */
 
 
-const __iconNode$6 = [
+const __iconNode$8 = [
   ["path", { d: "M21.801 10A10 10 0 1 1 17 3.335", key: "yps3ct" }],
   ["path", { d: "m9 11 3 3L22 4", key: "1pflzl" }]
 ];
-const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$6);
+const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$8);
 
 /**
  * @license lucide-react v0.544.0 - ISC
@@ -261,7 +261,7 @@ const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$6);
  */
 
 
-const __iconNode$5 = [
+const __iconNode$7 = [
   [
     "path",
     {
@@ -279,7 +279,7 @@ const __iconNode$5 = [
   ],
   ["path", { d: "m2 2 20 20", key: "1ooewy" }]
 ];
-const EyeOff = createLucideIcon("eye-off", __iconNode$5);
+const EyeOff = createLucideIcon("eye-off", __iconNode$7);
 
 /**
  * @license lucide-react v0.544.0 - ISC
@@ -289,7 +289,7 @@ const EyeOff = createLucideIcon("eye-off", __iconNode$5);
  */
 
 
-const __iconNode$4 = [
+const __iconNode$6 = [
   [
     "path",
     {
@@ -299,7 +299,7 @@ const __iconNode$4 = [
   ],
   ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
 ];
-const Eye = createLucideIcon("eye", __iconNode$4);
+const Eye = createLucideIcon("eye", __iconNode$6);
 
 /**
  * @license lucide-react v0.544.0 - ISC
@@ -309,11 +309,30 @@ const Eye = createLucideIcon("eye", __iconNode$4);
  */
 
 
-const __iconNode$3 = [
+const __iconNode$5 = [
+  [
+    "path",
+    {
+      d: "M2 9.5a5.5 5.5 0 0 1 9.591-3.676.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5",
+      key: "mvr1a0"
+    }
+  ]
+];
+const Heart = createLucideIcon("heart", __iconNode$5);
+
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$4 = [
   ["path", { d: "m21 21-4.34-4.34", key: "14j7rj" }],
   ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }]
 ];
-const Search = createLucideIcon("search", __iconNode$3);
+const Search = createLucideIcon("search", __iconNode$4);
 
 /**
  * @license lucide-react v0.544.0 - ISC
@@ -323,14 +342,14 @@ const Search = createLucideIcon("search", __iconNode$3);
  */
 
 
-const __iconNode$2 = [
+const __iconNode$3 = [
   ["path", { d: "M11 2v2", key: "1539x4" }],
   ["path", { d: "M5 2v2", key: "1yf1q8" }],
   ["path", { d: "M5 3H4a2 2 0 0 0-2 2v4a6 6 0 0 0 12 0V5a2 2 0 0 0-2-2h-1", key: "rb5t3r" }],
   ["path", { d: "M8 15a6 6 0 0 0 12 0v-3", key: "x18d4x" }],
   ["circle", { cx: "20", cy: "10", r: "2", key: "ts1r5v" }]
 ];
-const Stethoscope = createLucideIcon("stethoscope", __iconNode$2);
+const Stethoscope = createLucideIcon("stethoscope", __iconNode$3);
 
 /**
  * @license lucide-react v0.544.0 - ISC
@@ -340,7 +359,7 @@ const Stethoscope = createLucideIcon("stethoscope", __iconNode$2);
  */
 
 
-const __iconNode$1 = [
+const __iconNode$2 = [
   [
     "path",
     {
@@ -351,7 +370,21 @@ const __iconNode$1 = [
   ["path", { d: "M12 9v4", key: "juzpu7" }],
   ["path", { d: "M12 17h.01", key: "p32p05" }]
 ];
-const TriangleAlert = createLucideIcon("triangle-alert", __iconNode$1);
+const TriangleAlert = createLucideIcon("triangle-alert", __iconNode$2);
+
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$1 = [
+  ["path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2", key: "975kel" }],
+  ["circle", { cx: "12", cy: "7", r: "4", key: "17ys0d" }]
+];
+const User = createLucideIcon("user", __iconNode$1);
 
 /**
  * @license lucide-react v0.544.0 - ISC
@@ -379,6 +412,18 @@ const Icon = React.forwardRef(({ size = "md", icon: IconComponent, className, ..
 });
 Icon.displayName = "Icon";
 
+const DoctorIcon = ({ size = 24, color = "currentColor", className = "", ...props }) => {
+    return (jsxRuntime.jsx(Stethoscope, { size: size, color: color, className: className, ...props }));
+};
+
+const PatientIcon = ({ size = 24, color = "currentColor", className = "", ...props }) => {
+    return jsxRuntime.jsx(Heart, { size: size, color: color, className: className, ...props });
+};
+
+const UserIcon = ({ size = 24, color = "currentColor", className = "", ...props }) => {
+    return jsxRuntime.jsx(User, { size: size, color: color, className: className, ...props });
+};
+
 const Input = React.forwardRef(({ className, variant = "default", size = "md", label, helperText, error, leftIcon, rightIcon, fullWidth = false, showPasswordToggle = false, id, type = "text", ...props }, ref) => {
     const inputId = id || `input-${Math.random().toString(36).substr(2, 9)}`;
     const hasError = Boolean(error);
@@ -797,6 +842,97 @@ const Logo = ({ size = "md", showTagline = true, iconOnly = false, variant = "no
     return (jsxRuntime.jsx("div", { className: cn("flex items-center", sizes[size], className), onClick: onClick, role: onClick ? "button" : undefined, tabIndex: onClick ? 0 : undefined, children: jsxRuntime.jsx("img", { src: logoSrc, alt: "MEDECINE 360 Logo", className: "h-full w-auto object-contain" }) }));
 };
 
+const PROMED_THEME = {
+    name: "PROMED",
+    colors: {
+        primary: "#21596C",
+        secondary: "#3BA1A1",
+        primaryHover: "#1a4756",
+        secondaryHover: "#308181",
+        primaryLight: "#c0d0d4",
+        success: "#059669",
+        successHover: "#047857",
+        warning: "#d97706",
+        warningHover: "#b45309",
+        error: "#dc2626",
+        errorHover: "#b91c1c",
+    },
+};
+const MED_THEME = {
+    name: "MED",
+    colors: {
+        primary: "#3BA1A1", // Teal for patients (calming, trustworthy)
+        secondary: "#6B73FF", // Soft purple-blue (suggested secondary for MED)
+        primaryHover: "#308181",
+        secondaryHover: "#5a61e6",
+        primaryLight: "#a8d5d5",
+        success: "#059669",
+        successHover: "#047857",
+        warning: "#d97706",
+        warningHover: "#b45309",
+        error: "#dc2626",
+        errorHover: "#b91c1c",
+    },
+};
+const THEMES = {
+    PROMED: PROMED_THEME,
+    MED: MED_THEME,
+};
+
+const ThemeContext = React.createContext(undefined);
+const ThemeProvider = ({ children, defaultTheme = "PROMED", }) => {
+    const [theme, setTheme] = React.useState(defaultTheme);
+    const [themeConfig, setThemeConfig] = React.useState(THEMES[defaultTheme]);
+    // Update theme config when theme changes
+    React.useEffect(() => {
+        setThemeConfig(THEMES[theme]);
+        // Update data-theme attribute for CSS variable switching
+        const root = document.documentElement;
+        root.setAttribute("data-theme", theme);
+        // Also update CSS custom properties for backward compatibility
+        const colors = THEMES[theme].colors;
+        root.style.setProperty("--ews-primary", colors.primary);
+        root.style.setProperty("--ews-primary-hover", colors.primaryHover);
+        root.style.setProperty("--ews-primary-light", colors.primaryLight);
+        root.style.setProperty("--ews-secondary", colors.secondary);
+        root.style.setProperty("--ews-secondary-hover", colors.secondaryHover);
+        root.style.setProperty("--ews-success", colors.success);
+        root.style.setProperty("--ews-success-hover", colors.successHover);
+        root.style.setProperty("--ews-warning", colors.warning);
+        root.style.setProperty("--ews-warning-hover", colors.warningHover);
+        root.style.setProperty("--ews-error", colors.error);
+        root.style.setProperty("--ews-error-hover", colors.errorHover);
+    }, [theme]);
+    const handleSetTheme = (newTheme) => {
+        setTheme(newTheme);
+    };
+    const value = {
+        theme,
+        setTheme: handleSetTheme,
+        themeConfig,
+    };
+    return (jsxRuntime.jsx(ThemeContext.Provider, { value: value, children: children }));
+};
+const useTheme = () => {
+    const context = React.useContext(ThemeContext);
+    if (context === undefined) {
+        throw new Error("useTheme must be used within a ThemeProvider");
+    }
+    return context;
+};
+
+const ThemeToggle = ({ className }) => {
+    const { theme, setTheme } = useTheme();
+    const handleThemeChange = (newTheme) => {
+        setTheme(newTheme);
+    };
+    return (jsxRuntime.jsxs("div", { className: `flex items-center space-x-2 ${className || ""}`, children: [jsxRuntime.jsx("span", { className: "text-sm font-medium text-gray-700", children: "Theme:" }), jsxRuntime.jsxs("div", { className: "flex bg-gray-100 rounded-lg p-1", children: [jsxRuntime.jsx("button", { onClick: () => handleThemeChange("PROMED"), className: `px-3 py-1 text-xs font-medium rounded-md transition-colors ${theme === "PROMED"
+                            ? "bg-ews-primary text-white"
+                            : "text-gray-600 hover:text-gray-900"}`, children: "PROMED" }), jsxRuntime.jsx("button", { onClick: () => handleThemeChange("MED"), className: `px-3 py-1 text-xs font-medium rounded-md transition-colors ${theme === "MED"
+                            ? "bg-ews-primary text-white"
+                            : "text-gray-600 hover:text-gray-900"}`, children: "MED" })] })] }));
+};
+
 const SpecialtySearchAutocomplete = ({ selectedSpecialties = [], onSpecialtiesChange, placeholder = "Search and select medical specialties...", className = "", disabled = false, maxSelections, showSelectedCount = true, }) => {
     const [specialties, setSpecialties] = React.useState([]);
     const [isLoading, setIsLoading] = React.useState(false);
@@ -859,14 +995,19 @@ const SpecialtySearchAutocomplete = ({ selectedSpecialties = [], onSpecialtiesCh
 exports.ArrowRight = ArrowRight;
 exports.Button = Button;
 exports.Check = Check;
+exports.DoctorIcon = DoctorIcon;
 exports.Icon = Icon;
 exports.Input = Input;
 exports.Logo = Logo;
 exports.Modal = Modal;
 exports.MultiSearchAutocomplete = MultiSearchAutocomplete;
+exports.PatientIcon = PatientIcon;
 exports.Search = Search;
 exports.SearchAutocomplete = SearchAutocomplete;
 exports.SpecialtySearchAutocomplete = SpecialtySearchAutocomplete;
+exports.ThemeProvider = ThemeProvider;
+exports.ThemeToggle = ThemeToggle;
+exports.UserIcon = UserIcon;
 exports.cn = cn;
 exports.debounce = debounce;
 exports.formatCurrency = formatCurrency;
@@ -874,4 +1015,5 @@ exports.formatDate = formatDate;
 exports.generateId = generateId;
 exports.useDebounce = useDebounce;
 exports.useDebouncedCallback = useDebouncedCallback;
+exports.useTheme = useTheme;
 //# sourceMappingURL=index.js.map