@omnifyjp/ui 0.5.3 → 1.0.0

package/src/styles/theme.css

@@ -0,0 +1,461 @@
+@custom-variant dark (&:is(.dark *));
+
+:root {
+  /* ===================================
+   * TYPOGRAPHY TOKENS
+   * =================================== */
+  --font-size: 16px;
+  --font-weight-normal: 400;
+  --font-weight-medium: 500;
+  --font-weight-semibold: 600;
+  --font-weight-bold: 700;
+  
+  /* Font sizes */
+  --text-xs: 0.75rem;     /* 12px */
+  --text-sm: 0.875rem;    /* 14px */
+  --text-base: 1rem;      /* 16px */
+  --text-lg: 1.125rem;    /* 18px */
+  --text-xl: 1.25rem;     /* 20px */
+  --text-2xl: 1.5rem;     /* 24px */
+  --text-3xl: 1.875rem;   /* 30px */
+  --text-4xl: 2.25rem;    /* 36px */
+  
+  /* Line heights */
+  --leading-none: 1;
+  --leading-tight: 1.25;
+  --leading-normal: 1.5;
+  --leading-relaxed: 1.625;
+  --leading-loose: 2;
+
+  /* ===================================
+   * COLOR TOKENS
+   * =================================== */
+  --background: #ffffff;
+  --foreground: oklch(0.145 0 0);
+  --card: #ffffff;
+  --card-foreground: oklch(0.145 0 0);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.145 0 0);
+  --primary: #030213;
+  --primary-foreground: oklch(1 0 0);
+  --secondary: oklch(0.95 0.0058 264.53);
+  --secondary-foreground: #030213;
+  --muted: #ececf0;
+  --muted-foreground: #717182;
+  --accent: #e9ebef;
+  --accent-foreground: #030213;
+  --destructive: #d4183d;
+  --destructive-foreground: #ffffff;
+  --border: rgba(0, 0, 0, 0.1);
+  --input: transparent;
+  --input-background: transparent;
+  --switch-background: #cbced4;
+  --ring: oklch(0.708 0 0);
+  
+  /* Chart colors */
+  --chart-1: oklch(0.646 0.222 41.116);
+  --chart-2: oklch(0.6 0.118 184.704);
+  --chart-3: oklch(0.398 0.07 227.392);
+  --chart-4: oklch(0.828 0.189 84.429);
+  --chart-5: oklch(0.769 0.188 70.08);
+  
+  /* Sidebar colors */
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.145 0 0);
+  --sidebar-primary: #030213;
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.97 0 0);
+  --sidebar-accent-foreground: oklch(0.205 0 0);
+  --sidebar-border: oklch(0.922 0 0);
+  --sidebar-ring: oklch(0.708 0 0);
+  
+  /* Semantic colors */
+  --success: #10b981;
+  --success-foreground: #ffffff;
+  --warning: #f59e0b;
+  --warning-foreground: #ffffff;
+  --info: #3b82f6;
+  --info-foreground: #ffffff;
+  --error: #ef4444;
+  --error-foreground: #ffffff;
+  
+  /* Gray scale palette */
+  --gray-50: #f9fafb;
+  --gray-100: #f3f4f6;
+  --gray-200: #e5e7eb;
+  --gray-300: #d1d5db;
+  --gray-400: #9ca3af;
+  --gray-500: #6b7280;
+  --gray-600: #4b5563;
+  --gray-700: #374151;
+  --gray-800: #1f2937;
+  --gray-900: #111827;
+  
+  /* Blue palette (for active states) */
+  --blue-50: #eff6ff;
+  --blue-100: #dbeafe;
+  --blue-500: #3b82f6;
+  --blue-600: #2563eb;
+  --blue-700: #1d4ed8;
+
+  /* ===================================
+   * SPACING TOKENS
+   * =================================== */
+  --spacing-0: 0;
+  --spacing-1: 0.25rem;   /* 4px */
+  --spacing-2: 0.5rem;    /* 8px */
+  --spacing-3: 0.75rem;   /* 12px */
+  --spacing-4: 1rem;      /* 16px */
+  --spacing-5: 1.25rem;   /* 20px */
+  --spacing-6: 1.5rem;    /* 24px */
+  --spacing-8: 2rem;      /* 32px */
+  --spacing-10: 2.5rem;   /* 40px */
+  --spacing-12: 3rem;     /* 48px */
+  --spacing-16: 4rem;     /* 64px */
+  --spacing-20: 5rem;     /* 80px */
+  --spacing-24: 6rem;     /* 96px */
+
+  /* ===================================
+   * DENSITY TOKENS — Change these to adjust UI density globally
+   * =================================== */
+
+  /* Headings (used in @layer base) */
+  --heading-h1: var(--text-xl);         /* was --text-2xl */
+  --heading-h2: var(--text-lg);         /* was --text-xl */
+  --heading-h3: var(--text-base);       /* was --text-lg */
+  --heading-h4: var(--text-sm);         /* was --text-base */
+
+  /* Page layout */
+  --density-page: 1rem;                 /* 16px — page content padding */
+  --density-section: 1rem;              /* 16px — gap between sections */
+  --density-page-title: 1.25rem;        /* 20px — page title font-size */
+
+  /* Standard element height (btn, input, select, tabs) */
+  --density-element-xs: 1.5rem;         /* 24px — extra small */
+  --density-element-sm: 1.75rem;        /* 28px — small */
+  --density-element: 2rem;              /* 32px — default */
+  --density-element-lg: 2.25rem;        /* 36px — large */
+  --density-element-xl: 2.75rem;        /* 44px — extra large (login forms) */
+
+  /* Card padding */
+  --density-card: 1rem;                 /* 16px — was 1.5rem/24px */
+
+  /* Dialog */
+  --density-dialog: 1.25rem;            /* 20px — was 1.5rem/24px */
+
+  /* Table */
+  --density-table-head: 2rem;           /* 32px — was 2.5rem/40px */
+
+  /* Single-component tokens (used via var() directly) */
+  --density-popover: 0.75rem;           /* 12px */
+  --density-sheet: 0.75rem;             /* 12px */
+  --density-accordion: 0.625rem;        /* 10px */
+  --density-menu-item-py: 0.25rem;      /* 4px */
+
+  /* ===================================
+   * LAYOUT TOKENS
+   * =================================== */
+  --header-height: 3rem;            /* 48px — was 4rem/64px */
+  --sidebar-width: 16rem;          /* 256px */
+  --sidebar-collapsed-width: 4rem; /* 64px */
+  --sidebar-transition: 300ms;
+  --content-sidebar-width: 20rem;  /* 320px - for PageContainer sidebar */
+  --container-max-width: 1280px;
+  
+  /* ===================================
+   * BORDER & RADIUS TOKENS
+   * =================================== */
+  --radius: 0.375rem;              /* 6px */
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+  --radius-full: 9999px;
+  
+  /* Border widths */
+  --border-width: 1px;
+  --border-width-2: 2px;
+  --border-width-4: 4px;
+
+  /* ===================================
+   * SHADOW TOKENS
+   * =================================== */
+  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+  --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
+  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
+  --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
+  --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
+
+  /* ===================================
+   * Z-INDEX TOKENS
+   * =================================== */
+  --z-0: 0;
+  --z-10: 10;
+  --z-20: 20;
+  --z-30: 30;
+  --z-40: 40;
+  --z-50: 50;
+  --z-dropdown: 1000;
+  --z-sticky: 1020;
+  --z-fixed: 1030;
+  --z-modal-backdrop: 1040;
+  --z-modal: 1050;
+  --z-popover: 1060;
+  --z-tooltip: 1070;
+
+  /* ===================================
+   * TRANSITION & ANIMATION TOKENS
+   * =================================== */
+  --transition-fast: 150ms;
+  --transition-base: 200ms;
+  --transition-slow: 300ms;
+  --transition-slower: 500ms;
+  
+  --ease-in: cubic-bezier(0.4, 0, 1, 1);
+  --ease-out: cubic-bezier(0, 0, 0.2, 1);
+  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
+
+  /* ===================================
+   * OPACITY TOKENS
+   * =================================== */
+  --opacity-0: 0;
+  --opacity-5: 0.05;
+  --opacity-10: 0.1;
+  --opacity-20: 0.2;
+  --opacity-30: 0.3;
+  --opacity-40: 0.4;
+  --opacity-50: 0.5;
+  --opacity-60: 0.6;
+  --opacity-70: 0.7;
+  --opacity-80: 0.8;
+  --opacity-90: 0.9;
+  --opacity-100: 1;
+}
+
+.dark {
+  --background: oklch(0.145 0 0);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.145 0 0);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.145 0 0);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(0.985 0 0);
+  --primary-foreground: oklch(0.205 0 0);
+  --secondary: oklch(0.269 0 0);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.269 0 0);
+  --muted-foreground: oklch(0.708 0 0);
+  --accent: oklch(0.269 0 0);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.396 0.141 25.723);
+  --destructive-foreground: oklch(0.637 0.237 25.331);
+  --border: oklch(0.269 0 0);
+  --input: oklch(0.269 0 0);
+  --ring: oklch(0.439 0 0);
+  
+  --chart-1: oklch(0.488 0.243 264.376);
+  --chart-2: oklch(0.696 0.17 162.48);
+  --chart-3: oklch(0.769 0.188 70.08);
+  --chart-4: oklch(0.627 0.265 303.9);
+  --chart-5: oklch(0.645 0.246 16.439);
+  
+  --sidebar: oklch(0.205 0 0);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.488 0.243 264.376);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.269 0 0);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(0.269 0 0);
+  --sidebar-ring: oklch(0.439 0 0);
+  
+  /* Semantic colors (dark mode) */
+  --success: #34d399;
+  --success-foreground: #022c22;
+  --warning: #fbbf24;
+  --warning-foreground: #422006;
+  --info: #60a5fa;
+  --info-foreground: #172554;
+  --error: #f87171;
+  --error-foreground: #450a0a;
+
+  /* Dark mode gray scale */
+  --gray-50: #1f2937;
+  --gray-100: #374151;
+  --gray-200: #4b5563;
+  --gray-300: #6b7280;
+  --gray-400: #9ca3af;
+  --gray-500: #d1d5db;
+  --gray-600: #e5e7eb;
+  --gray-700: #f3f4f6;
+  --gray-800: #f9fafb;
+  --gray-900: #ffffff;
+  
+  /* Dark mode blue palette */
+  --blue-50: #1e3a8a;
+  --blue-100: #1d4ed8;
+  --blue-500: #3b82f6;
+  --blue-600: #60a5fa;
+  --blue-700: #93c5fd;
+}
+
+/* ===================================
+ * TAILWIND V4 THEME MAPPING
+ * Map CSS variables to Tailwind classes
+ * =================================== */
+@theme inline {
+  /* Colors */
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-destructive-foreground: var(--destructive-foreground);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-input-background: var(--input-background);
+  --color-switch-background: var(--switch-background);
+  --color-ring: var(--ring);
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+  
+  /* Sidebar colors */
+  --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+  
+  /* Semantic colors */
+  --color-success: var(--success);
+  --color-success-foreground: var(--success-foreground);
+  --color-warning: var(--warning);
+  --color-warning-foreground: var(--warning-foreground);
+  --color-info: var(--info);
+  --color-info-foreground: var(--info-foreground);
+  --color-error: var(--error);
+  --color-error-foreground: var(--error-foreground);
+  
+  /* Gray palette - making available as Tailwind classes */
+  --color-gray-50: var(--gray-50);
+  --color-gray-100: var(--gray-100);
+  --color-gray-200: var(--gray-200);
+  --color-gray-300: var(--gray-300);
+  --color-gray-400: var(--gray-400);
+  --color-gray-500: var(--gray-500);
+  --color-gray-600: var(--gray-600);
+  --color-gray-700: var(--gray-700);
+  --color-gray-800: var(--gray-800);
+  --color-gray-900: var(--gray-900);
+  
+  /* Blue palette */
+  --color-blue-50: var(--blue-50);
+  --color-blue-100: var(--blue-100);
+  --color-blue-500: var(--blue-500);
+  --color-blue-600: var(--blue-600);
+  --color-blue-700: var(--blue-700);
+  
+  /* Density spacing — creates p-page, h-element, gap-section, etc. */
+  --spacing-page: var(--density-page);
+  --spacing-section: var(--density-section);
+  --spacing-element-xs: var(--density-element-xs);
+  --spacing-element-sm: var(--density-element-sm);
+  --spacing-element: var(--density-element);
+  --spacing-element-lg: var(--density-element-lg);
+  --spacing-element-xl: var(--density-element-xl);
+  --spacing-card: var(--density-card);
+  --spacing-dialog: var(--density-dialog);
+  --spacing-header: var(--header-height);
+  --spacing-table-head: var(--density-table-head);
+
+  /* Density font sizes — creates text-page-title */
+  --font-size-page-title: var(--density-page-title);
+
+  /* Border radius */
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+}
+
+/* ===================================
+ * BASE STYLES
+ * Default typography and element styles
+ * =================================== */
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+
+  body {
+    @apply bg-background text-foreground;
+  }
+
+  /**
+  * Default typography styles for HTML elements (h1-h4, p, label, button, input).
+  * These are in @layer base, so Tailwind utility classes (like text-sm, text-lg) automatically override them.
+  */
+
+  html {
+    font-size: var(--font-size);
+  }
+
+  h1 {
+    font-size: var(--heading-h1);
+    font-weight: var(--font-weight-medium);
+    line-height: var(--leading-normal);
+  }
+
+  h2 {
+    font-size: var(--heading-h2);
+    font-weight: var(--font-weight-medium);
+    line-height: var(--leading-normal);
+  }
+
+  h3 {
+    font-size: var(--heading-h3);
+    font-weight: var(--font-weight-medium);
+    line-height: var(--leading-normal);
+  }
+
+  h4 {
+    font-size: var(--heading-h4);
+    font-weight: var(--font-weight-medium);
+    line-height: var(--leading-normal);
+  }
+
+  label {
+    font-size: var(--text-base);
+    font-weight: var(--font-weight-medium);
+    line-height: var(--leading-normal);
+  }
+
+  button {
+    font-size: var(--text-base);
+    font-weight: var(--font-weight-medium);
+    line-height: var(--leading-normal);
+  }
+
+  input {
+    font-size: var(--text-base);
+    font-weight: var(--font-weight-normal);
+    line-height: var(--leading-normal);
+  }
+}

package/dist/chunk-2GN4WIOV.js

@@ -1,240 +0,0 @@
-import { useOrganization } from './chunk-ITXOZ4IR.js';
-import { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Button } from '@omnifyjp/ui-components/components/button';
-import { Input } from '@omnifyjp/ui-components/components/input';
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from '@omnifyjp/ui-components/components/dialog';
-import { ArrowLeftRight, Building2, ArrowRight, MapPin, Check, Search } from 'lucide-react';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-
-function OrganizationSelector({ variant = "header" }) {
-  const {
-    organizations,
-    selectedOrganization,
-    selectedBranch,
-    setSelectedOrganization,
-    setSelectedBranch,
-    getBranchesByOrg,
-    requireBranch
-  } = useOrganization();
-  const { t } = useTranslation("shell");
-  const [showChangeModal, setShowChangeModal] = useState(false);
-  const [step, setStep] = useState("organization");
-  const [tempOrgId, setTempOrgId] = useState("");
-  const [tempBranchId, setTempBranchId] = useState("");
-  const [branchSearch, setBranchSearch] = useState("");
-  const handleOpenChange = () => {
-    setShowChangeModal(true);
-    setStep("organization");
-    setTempOrgId(selectedOrganization?.id || "");
-    setTempBranchId("");
-    setBranchSearch("");
-  };
-  const handleOrganizationNext = () => {
-    const org = organizations.find((o) => o.id === tempOrgId);
-    if (org) {
-      setSelectedOrganization(org);
-      if (!requireBranch) {
-        setShowChangeModal(false);
-        return;
-      }
-      setStep("branch");
-      setTempBranchId("");
-      setBranchSearch("");
-    }
-  };
-  const handleBranchComplete = () => {
-    const branch = getBranchesByOrg(selectedOrganization.id).find((b) => b.id === tempBranchId);
-    if (branch) {
-      setSelectedBranch(branch);
-      setShowChangeModal(false);
-    }
-  };
-  const availableBranches = selectedOrganization ? getBranchesByOrg(selectedOrganization.id) : [];
-  const filteredBranches = availableBranches.filter(
-    (b) => b.name.toLowerCase().includes(branchSearch.toLowerCase()) || b.location?.toLowerCase().includes(branchSearch.toLowerCase())
-  );
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    variant === "header" ? /* @__PURE__ */ jsxs(
-      Button,
-      {
-        variant: "outline",
-        onClick: handleOpenChange,
-        className: "gap-2 px-3",
-        children: [
-          selectedOrganization && /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: "w-5 h-5 rounded flex items-center justify-center text-white font-bold text-[10px] flex-shrink-0",
-              style: { backgroundColor: selectedOrganization.color },
-              children: selectedOrganization.shortName
-            }
-          ),
-          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 min-w-0", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-sm font-medium truncate max-w-[120px]", children: selectedOrganization?.name || t("org.noOrgSelected") }),
-            requireBranch && selectedBranch && /* @__PURE__ */ jsxs(Fragment, { children: [
-              /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "/" }),
-              /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground truncate max-w-[100px]", children: selectedBranch.name })
-            ] })
-          ] }),
-          /* @__PURE__ */ jsx(ArrowLeftRight, { className: "w-3.5 h-3.5 text-muted-foreground flex-shrink-0" })
-        ]
-      }
-    ) : /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: "flex items-center justify-between gap-2 cursor-pointer hover:bg-sidebar-accent transition-colors rounded-md px-4 py-3",
-        onClick: handleOpenChange,
-        children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-1 min-w-0", children: [
-            selectedOrganization && /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: "w-8 h-8 rounded-lg flex items-center justify-center text-white font-bold text-xs flex-shrink-0",
-                style: { backgroundColor: selectedOrganization.color },
-                children: selectedOrganization.shortName
-              }
-            ),
-            /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
-              /* @__PURE__ */ jsx("div", { className: "font-semibold text-sm truncate", children: selectedOrganization?.name || t("org.noOrgSelected") }),
-              requireBranch && /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground truncate mt-0.5", children: selectedBranch?.name || t("org.noBranchSelected") })
-            ] })
-          ] }),
-          /* @__PURE__ */ jsx(ArrowLeftRight, { className: "w-3.5 h-3.5 text-muted-foreground flex-shrink-0" })
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsx(Dialog, { open: showChangeModal, onOpenChange: setShowChangeModal, children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[520px]", children: [
-      /* @__PURE__ */ jsxs(DialogHeader, { children: [
-        /* @__PURE__ */ jsx(DialogTitle, { className: "text-xl font-semibold", children: step === "organization" ? t("org.selectOrg") : t("org.selectBranch") }),
-        /* @__PURE__ */ jsx(DialogDescription, { className: "text-sm", children: step === "organization" ? t("org.selectOrgDesc") : t("org.selectBranchDesc") })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "mt-4", children: [
-        requireBranch && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-6", children: [
-          /* @__PURE__ */ jsxs("div", { className: `flex items-center gap-2 px-3 py-1.5 rounded-md text-sm font-medium ${step === "organization" ? "bg-primary/10 text-primary" : "bg-muted text-muted-foreground"}`, children: [
-            /* @__PURE__ */ jsx(Building2, { className: "w-4 h-4" }),
-            t("org.orgStep")
-          ] }),
-          /* @__PURE__ */ jsx(ArrowRight, { className: "w-4 h-4 text-muted-foreground" }),
-          /* @__PURE__ */ jsxs("div", { className: `flex items-center gap-2 px-3 py-1.5 rounded-md text-sm font-medium ${step === "branch" ? "bg-primary/10 text-primary" : "bg-muted text-muted-foreground"}`, children: [
-            /* @__PURE__ */ jsx(MapPin, { className: "w-4 h-4" }),
-            t("org.branchStep")
-          ] })
-        ] }),
-        step === "organization" && /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx("div", { className: "space-y-2", children: organizations.map((org) => /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: `relative flex items-center gap-3 rounded-lg border-2 p-4 cursor-pointer transition-all ${tempOrgId === org.id ? "border-primary bg-primary/5" : "border-border hover:border-muted-foreground/30 hover:bg-accent"}`,
-              onClick: () => setTempOrgId(org.id),
-              children: [
-                /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    className: "w-10 h-10 rounded-lg flex items-center justify-center text-white font-bold text-sm flex-shrink-0",
-                    style: { backgroundColor: org.color },
-                    children: org.shortName
-                  }
-                ),
-                /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
-                  /* @__PURE__ */ jsx("div", { className: "font-semibold text-base", children: org.name }),
-                  org.description && /* @__PURE__ */ jsx("div", { className: "text-sm text-muted-foreground", children: org.description }),
-                  requireBranch && /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground mt-1", children: t("org.branchCount", { count: getBranchesByOrg(org.id).length }) })
-                ] }),
-                tempOrgId === org.id && /* @__PURE__ */ jsx("div", { className: "flex-shrink-0 w-6 h-6 rounded-full bg-primary flex items-center justify-center", children: /* @__PURE__ */ jsx(Check, { className: "w-4 h-4 text-white" }) })
-              ]
-            },
-            org.id
-          )) }),
-          /* @__PURE__ */ jsx("div", { className: "mt-6 flex justify-end", children: /* @__PURE__ */ jsxs(
-            Button,
-            {
-              onClick: handleOrganizationNext,
-              disabled: !tempOrgId,
-              size: "lg",
-              className: "gap-2",
-              children: [
-                requireBranch ? t("common.next") : t("common.complete"),
-                /* @__PURE__ */ jsx(ArrowRight, { className: "w-4 h-4" })
-              ]
-            }
-          ) })
-        ] }),
-        step === "branch" && selectedOrganization && /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsxs("div", { className: "mb-4 p-3 bg-muted rounded-lg border border-border", children: [
-            /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground mb-1.5", children: t("org.selectedOrg") }),
-            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: "w-8 h-8 rounded-lg flex items-center justify-center text-white font-bold text-xs",
-                  style: { backgroundColor: selectedOrganization.color },
-                  children: selectedOrganization.shortName
-                }
-              ),
-              /* @__PURE__ */ jsx("span", { className: "font-semibold", children: selectedOrganization.name })
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: "relative mb-3", children: [
-            /* @__PURE__ */ jsx(Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground" }),
-            /* @__PURE__ */ jsx(
-              Input,
-              {
-                placeholder: t("org.searchBranch"),
-                value: branchSearch,
-                onChange: (e) => setBranchSearch(e.target.value),
-                className: "pl-9"
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsx("div", { className: "space-y-2 max-h-[280px] overflow-y-auto", children: filteredBranches.length === 0 ? /* @__PURE__ */ jsx("div", { className: "py-6 text-center text-sm text-muted-foreground", children: t("org.noBranchFound") }) : filteredBranches.map((branch) => /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: `relative flex items-center gap-3 rounded-lg border-2 p-4 cursor-pointer transition-all ${tempBranchId === branch.id ? "border-primary bg-primary/5" : "border-border hover:border-muted-foreground/30 hover:bg-accent"}`,
-              onClick: () => setTempBranchId(branch.id),
-              children: [
-                /* @__PURE__ */ jsx("div", { className: "w-10 h-10 rounded-lg bg-muted flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx(MapPin, { className: "w-5 h-5 text-muted-foreground" }) }),
-                /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
-                  /* @__PURE__ */ jsx("div", { className: "font-semibold text-base", children: branch.name }),
-                  branch.location && /* @__PURE__ */ jsx("div", { className: "text-sm text-muted-foreground", children: branch.location })
-                ] }),
-                tempBranchId === branch.id && /* @__PURE__ */ jsx("div", { className: "flex-shrink-0 w-6 h-6 rounded-full bg-primary flex items-center justify-center", children: /* @__PURE__ */ jsx(Check, { className: "w-4 h-4 text-white" }) })
-              ]
-            },
-            branch.id
-          )) }),
-          /* @__PURE__ */ jsxs("div", { className: "mt-6 flex justify-between", children: [
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                variant: "outline",
-                onClick: () => {
-                  setStep("organization");
-                  setTempOrgId(selectedOrganization.id);
-                },
-                children: t("common.back")
-              }
-            ),
-            /* @__PURE__ */ jsxs(
-              Button,
-              {
-                onClick: handleBranchComplete,
-                disabled: !tempBranchId,
-                size: "lg",
-                className: "gap-2",
-                children: [
-                  t("common.complete"),
-                  /* @__PURE__ */ jsx(ArrowRight, { className: "w-4 h-4" })
-                ]
-              }
-            )
-          ] })
-        ] })
-      ] })
-    ] }) })
-  ] });
-}
-
-export { OrganizationSelector };
-//# sourceMappingURL=chunk-2GN4WIOV.js.map
-//# sourceMappingURL=chunk-2GN4WIOV.js.map