chordia-ui 3.2.2 → 3.2.4

package/dist/UploadInteraction.es.js

@@ -0,0 +1,379 @@
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { useState as m, useRef as x } from "react";
+import { Upload as S, CircleUser as w, Compass as z, Link2 as C, CloudUpload as k } from "lucide-react";
+const a = "var(--font-sans)", W = {
+  padding: "40px 48px",
+  fontFamily: a,
+  minHeight: "100vh",
+  background: "var(--grey-white)",
+  boxSizing: "border-box"
+}, D = {
+  fontSize: "var(--text-4xl)",
+  fontWeight: "var(--font-bold)",
+  fontFamily: a,
+  color: "var(--text-ink)",
+  margin: 0,
+  letterSpacing: "var(--tracking-tight)",
+  lineHeight: "var(--leading-tight)"
+}, H = {
+  fontSize: 14,
+  fontStyle: "normal",
+  fontWeight: 400,
+  lineHeight: "140%",
+  color: "var(--color-text-secondary)",
+  margin: "8px 0 0",
+  fontFamily: a
+}, I = {
+  display: "grid",
+  gridTemplateColumns: "1fr 1fr",
+  gap: 12,
+  marginTop: "36px"
+}, v = {
+  display: "flex",
+  height: 160,
+  padding: 24,
+  flexDirection: "column",
+  justifyContent: "space-between",
+  alignItems: "flex-start",
+  borderRadius: 12,
+  border: "1px solid var(--grey-absent)",
+  background: "var(--grey-white)",
+  boxSizing: "border-box",
+  transition: "var(--transition)",
+  cursor: "default",
+  gap: 8
+}, T = {
+  ...v,
+  boxShadow: "var(--shadow-sm)"
+}, F = {
+  width: 40,
+  height: 40,
+  borderRadius: "var(--radius)",
+  background: "var(--paper-secondary)",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  color: "var(--text-base)"
+}, L = {
+  color: "var(--grey-strong)",
+  fontSize: 20,
+  fontStyle: "normal",
+  fontWeight: 600,
+  lineHeight: "normal",
+  fontFamily: a,
+  margin: 0
+}, A = {
+  fontSize: 13,
+  fontStyle: "normal",
+  fontWeight: 400,
+  lineHeight: "140%",
+  color: "var(--text-base)",
+  margin: 0,
+  fontFamily: a,
+  flex: "1 0 0"
+}, M = {
+  display: "flex",
+  height: 28,
+  padding: 10,
+  justifyContent: "center",
+  alignItems: "center",
+  gap: 10,
+  borderRadius: 10,
+  background: "var(--grey-strong)",
+  fontSize: 14,
+  fontStyle: "normal",
+  fontWeight: 600,
+  lineHeight: 1,
+  fontFamily: a,
+  color: "var(--grey-white)",
+  border: "none",
+  cursor: "pointer",
+  transition: "var(--transition-fast)",
+  outline: "none",
+  boxSizing: "border-box"
+}, R = {
+  flex: 1,
+  height: 8,
+  borderRadius: 4,
+  background: "var(--border)",
+  overflow: "hidden"
+}, j = (r) => ({
+  width: `${r}%`,
+  height: "100%",
+  borderRadius: 4,
+  background: "var(--color-green)",
+  transition: "width 0.4s ease-out"
+}), B = {
+  display: "inline-flex",
+  alignItems: "center",
+  gap: 4,
+  fontSize: "var(--text-xs)",
+  fontWeight: "var(--font-semibold)",
+  color: "var(--rail-compliance)",
+  fontFamily: a,
+  marginLeft: 12
+};
+function y({ icon: r, title: l, description: o, buttonLabel: s, onAction: g, recommended: h, children: p }) {
+  const [d, f] = m(!1);
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      style: d ? T : v,
+      onMouseEnter: () => f(!0),
+      onMouseLeave: () => f(!1),
+      children: [
+        /* @__PURE__ */ n("div", { children: [
+          /* @__PURE__ */ n("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
+            /* @__PURE__ */ e("div", { style: F, children: r }),
+            /* @__PURE__ */ e("h3", { style: L, children: l })
+          ] }),
+          /* @__PURE__ */ n("div", { style: { display: "flex", flexDirection: "column", gap: 4, marginLeft: 52, marginTop: 4 }, children: [
+            o && /* @__PURE__ */ e("p", { style: A, children: o }),
+            p
+          ] })
+        ] }),
+        /* @__PURE__ */ n("div", { style: { display: "flex", alignItems: "center", marginLeft: 52 }, children: [
+          /* @__PURE__ */ e(
+            "button",
+            {
+              style: M,
+              onClick: g,
+              onMouseEnter: (t) => {
+                t.currentTarget.style.opacity = "0.85";
+              },
+              onMouseLeave: (t) => {
+                t.currentTarget.style.opacity = "1";
+              },
+              children: s
+            }
+          ),
+          h && /* @__PURE__ */ n("span", { style: B, children: [
+            /* @__PURE__ */ e("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ e("path", { d: "M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z" }) }),
+            "Recommended"
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+const Q = ({
+  userName: r = "Will",
+  stepsCompleted: l = 4,
+  totalSteps: o = 6,
+  onUpload: s,
+  onContinue: g,
+  onExplore: h,
+  onConnect: p
+}) => {
+  const d = l / o * 100;
+  return /* @__PURE__ */ n("div", { style: W, children: [
+    /* @__PURE__ */ n("h1", { style: D, children: [
+      "Welcome ",
+      r
+    ] }),
+    /* @__PURE__ */ e("p", { style: H, children: "Get started with your project or explore new features" }),
+    /* @__PURE__ */ n("div", { style: I, children: [
+      /* @__PURE__ */ e(
+        y,
+        {
+          icon: /* @__PURE__ */ e(S, { size: 24 }),
+          title: "Upload and Evaluate Audio",
+          description: "Upload Audio Files to Run Evaluations: MP3, WMA or WAV (up to 50 files, max 325MB total)",
+          buttonLabel: "Upload",
+          onAction: s
+        }
+      ),
+      /* @__PURE__ */ e(
+        y,
+        {
+          icon: /* @__PURE__ */ e(w, { size: 24 }),
+          title: "Getting started with Chordia",
+          description: "Complete these steps to get the most out of Chordia.",
+          buttonLabel: "Continue",
+          onAction: g,
+          children: /* @__PURE__ */ n("div", { style: { display: "flex", alignItems: "center", gap: 8, width: "100%" }, children: [
+            /* @__PURE__ */ e("div", { style: R, children: /* @__PURE__ */ e("div", { style: j(d) }) }),
+            /* @__PURE__ */ n("span", { style: { fontSize: 12, color: "var(--text-muted)", fontFamily: a, whiteSpace: "nowrap" }, children: [
+              /* @__PURE__ */ e("strong", { style: { color: "var(--text-base)", fontWeight: 600 }, children: l }),
+              " of ",
+              o,
+              " steps completed"
+            ] })
+          ] })
+        }
+      ),
+      /* @__PURE__ */ e(
+        y,
+        {
+          icon: /* @__PURE__ */ e(z, { size: 24 }),
+          title: "Explore Demo Projects",
+          description: "Explore how Chordia Compass transforms real data into insights with plans, dashboards, and evaluations.",
+          buttonLabel: "Explore",
+          onAction: h,
+          recommended: !0
+        }
+      ),
+      /* @__PURE__ */ e(
+        y,
+        {
+          icon: /* @__PURE__ */ e(C, { size: 24 }),
+          title: "Connect Data Source",
+          description: "Connect and integrate third-party tools with your external data sources.",
+          buttonLabel: "Connect",
+          onAction: p
+        }
+      )
+    ] })
+  ] });
+}, c = "var(--font-sans)", E = {
+  fontFamily: c
+}, U = {
+  fontSize: 20,
+  fontWeight: 600,
+  fontStyle: "normal",
+  fontFamily: c,
+  color: "var(--grey-strong)",
+  margin: 0,
+  lineHeight: "normal"
+}, O = {
+  fontSize: 13,
+  fontWeight: 400,
+  fontStyle: "normal",
+  color: "var(--color-text-secondary)",
+  fontFamily: c,
+  margin: "4px 0 0",
+  lineHeight: "140%"
+}, b = {
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "center",
+  justifyContent: "center",
+  width: "100%",
+  minHeight: 320,
+  borderRadius: 16,
+  border: "2px dashed var(--color-input-border)",
+  background: "var(--grey-white)",
+  boxSizing: "border-box",
+  cursor: "pointer",
+  transition: "var(--transition-fast)",
+  marginTop: 24,
+  padding: "48px 24px"
+}, P = {
+  ...b,
+  borderColor: "var(--color-green)",
+  background: "var(--color-green-ring)"
+}, V = {
+  width: 80,
+  height: 80,
+  borderRadius: 9999,
+  background: "var(--focus-2)",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  flexShrink: 0,
+  marginBottom: 20
+}, $ = {
+  fontSize: 18,
+  fontWeight: 600,
+  fontFamily: c,
+  color: "var(--grey-strong)",
+  textAlign: "center",
+  lineHeight: "28px",
+  margin: 0
+}, G = {
+  display: "flex",
+  height: 32,
+  padding: 16,
+  justifyContent: "center",
+  alignItems: "center",
+  gap: 10,
+  borderRadius: 10,
+  border: "1px solid var(--grey-absent)",
+  background: "var(--grey-white)",
+  fontSize: 15,
+  fontWeight: 400,
+  fontFamily: c,
+  color: "var(--grey-strong)",
+  cursor: "pointer",
+  transition: "var(--transition-fast)",
+  outline: "none",
+  marginTop: 16,
+  boxSizing: "border-box"
+}, q = {
+  fontSize: 14,
+  fontWeight: 400,
+  fontFamily: c,
+  color: "var(--grey-muted)",
+  textAlign: "center",
+  marginTop: 16,
+  lineHeight: "140%"
+}, X = ({ onFileSelect: r }) => {
+  const [l, o] = m(!1), s = x(null), g = (t) => {
+    t.preventDefault(), o(!0);
+  }, h = () => {
+    o(!1);
+  }, p = (t) => {
+    var u;
+    t.preventDefault(), o(!1);
+    const i = (u = t.dataTransfer) == null ? void 0 : u.files;
+    i != null && i.length && (r == null || r(i));
+  }, d = () => {
+    var t;
+    (t = s.current) == null || t.click();
+  };
+  return /* @__PURE__ */ n("div", { style: E, children: [
+    /* @__PURE__ */ e("h2", { style: U, children: "Evaluate Interaction" }),
+    /* @__PURE__ */ e("p", { style: O, children: "Upload another interaction to compare results and identify patterns across multiple evaluations." }),
+    /* @__PURE__ */ e(
+      "input",
+      {
+        ref: s,
+        type: "file",
+        accept: ".mp3,.wma,.wav",
+        multiple: !0,
+        style: { display: "none" },
+        onChange: (t) => {
+          const i = t.target.files;
+          i != null && i.length && (r == null || r(i)), t.target.value = "";
+        }
+      }
+    ),
+    /* @__PURE__ */ n(
+      "div",
+      {
+        style: l ? P : b,
+        onDragOver: g,
+        onDragLeave: h,
+        onDrop: p,
+        onClick: d,
+        children: [
+          /* @__PURE__ */ e("div", { style: V, children: /* @__PURE__ */ e(k, { size: 32, color: "var(--grey-strong)" }) }),
+          /* @__PURE__ */ e("p", { style: $, children: "Drop your file here, or" }),
+          /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              style: G,
+              onClick: (t) => {
+                t.stopPropagation(), d();
+              },
+              onMouseEnter: (t) => {
+                t.currentTarget.style.background = "var(--hover-warm-subtle)";
+              },
+              onMouseLeave: (t) => {
+                t.currentTarget.style.background = "var(--grey-white)";
+              },
+              children: "Browse files"
+            }
+          ),
+          /* @__PURE__ */ e("p", { style: q, children: "Supports: MP3, WMA or WAV" })
+        ]
+      }
+    )
+  ] });
+};
+export {
+  Q as U,
+  X as a
+};
+//# sourceMappingURL=UploadInteraction.es.js.map

package/dist/UploadInteraction.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UploadInteraction.es.js","sources":["../src/components/onboarding/UploadEvaluate.jsx","../src/components/onboarding/UploadInteraction.jsx"],"sourcesContent":["import { useState } from 'react';\nimport { Upload, CircleUser, Compass, Link2 } from 'lucide-react';\n\nconst FF = 'var(--font-sans)';\n\n// ─── Styles ───\n\nconst containerStyle = {\n  padding: '40px 48px',\n  fontFamily: FF,\n  minHeight: '100vh',\n  background: 'var(--grey-white)',\n  boxSizing: 'border-box',\n};\n\nconst headingStyle = {\n  fontSize: 'var(--text-4xl)',\n  fontWeight: 'var(--font-bold)',\n  fontFamily: FF,\n  color: 'var(--text-ink)',\n  margin: 0,\n  letterSpacing: 'var(--tracking-tight)',\n  lineHeight: 'var(--leading-tight)',\n};\n\nconst subtitleStyle = {\n  fontSize: 14,\n  fontStyle: 'normal',\n  fontWeight: 400,\n  lineHeight: '140%',\n  color: 'var(--color-text-secondary)',\n  margin: '8px 0 0',\n  fontFamily: FF,\n};\n\nconst gridStyle = {\n  display: 'grid',\n  gridTemplateColumns: '1fr 1fr',\n  gap: 12,\n  marginTop: '36px',\n};\n\nconst cardStyle = {\n  display: 'flex',\n  height: 160,\n  padding: 24,\n  flexDirection: 'column',\n  justifyContent: 'space-between',\n  alignItems: 'flex-start',\n  borderRadius: 12,\n  border: '1px solid var(--grey-absent)',\n  background: 'var(--grey-white)',\n  boxSizing: 'border-box',\n  transition: 'var(--transition)',\n  cursor: 'default',\n  gap: 8\n};\n\nconst cardHoverStyle = {\n  ...cardStyle,\n  boxShadow: 'var(--shadow-sm)',\n};\n\nconst iconWrapperStyle = {\n  width: 40,\n  height: 40,\n  borderRadius: 'var(--radius)',\n  background: 'var(--paper-secondary)',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  color: 'var(--text-base)',\n};\n\nconst cardTitleStyle = {\n  color: 'var(--grey-strong)',\n  fontSize: 20,\n  fontStyle: 'normal',\n  fontWeight: 600,\n  lineHeight: 'normal',\n  fontFamily: FF,\n  margin: 0,\n};\n\nconst cardDescStyle = {\n  fontSize: 13,\n  fontStyle: 'normal',\n  fontWeight: 400,\n  lineHeight: '140%',\n  color: 'var(--text-base)',\n  margin: 0,\n  fontFamily: FF,\n  flex: '1 0 0',\n};\n\nconst btnStyle = {\n  display: 'flex',\n  height: 28,\n  padding: 10,\n  justifyContent: 'center',\n  alignItems: 'center',\n  gap: 10,\n  borderRadius: 10,\n  background: 'var(--grey-strong)',\n  fontSize: 14,\n  fontStyle: 'normal',\n  fontWeight: 600,\n  lineHeight: 1,\n  fontFamily: FF,\n  color: 'var(--grey-white)',\n  border: 'none',\n  cursor: 'pointer',\n  transition: 'var(--transition-fast)',\n  outline: 'none',\n  boxSizing: 'border-box',\n};\n\nconst progressBarBg = {\n  flex: 1,\n  height: 8,\n  borderRadius: 4,\n  background: 'var(--border)',\n  overflow: 'hidden',\n};\n\nconst progressBarFill = (pct) => ({\n  width: `${pct}%`,\n  height: '100%',\n  borderRadius: 4,\n  background: 'var(--color-green)',\n  transition: 'width 0.4s ease-out',\n});\n\nconst recommendedBadge = {\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: 4,\n  fontSize: 'var(--text-xs)',\n  fontWeight: 'var(--font-semibold)',\n  color: 'var(--rail-compliance)',\n  fontFamily: FF,\n  marginLeft: 12,\n};\n\n// ─── Card Component ───\n\nfunction OnboardingCard({ icon, title, description, buttonLabel, onAction, recommended, children }) {\n  const [hovered, setHovered] = useState(false);\n\n  return (\n    <div\n      style={hovered ? cardHoverStyle : cardStyle}\n      onMouseEnter={() => setHovered(true)}\n      onMouseLeave={() => setHovered(false)}\n    >\n      <div>\n        <div style={{ display: 'flex', alignItems: 'center', gap: 12 }}>\n          <div style={iconWrapperStyle}>{icon}</div>\n          <h3 style={cardTitleStyle}>{title}</h3>\n        </div>\n        <div style={{ display: 'flex', flexDirection: 'column', gap: 4, marginLeft: 52, marginTop: 4 }}>\n          {description && <p style={cardDescStyle}>{description}</p>}\n          {children}\n        </div>\n      </div>\n      <div style={{ display: 'flex', alignItems: 'center', marginLeft: 52 }}>\n        <button\n          style={btnStyle}\n          onClick={onAction}\n          onMouseEnter={(e) => { e.currentTarget.style.opacity = '0.85'; }}\n          onMouseLeave={(e) => { e.currentTarget.style.opacity = '1'; }}\n        >\n          {buttonLabel}\n        </button>\n        {recommended && (\n          <span style={recommendedBadge}>\n            <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z\" /></svg>\n            Recommended\n          </span>\n        )}\n      </div>\n    </div>\n  );\n}\n\n// ─── Main Component ───\n\nconst UploadEvaluate = ({\n  userName = 'Will',\n  stepsCompleted = 4,\n  totalSteps = 6,\n  onUpload,\n  onContinue,\n  onExplore,\n  onConnect,\n}) => {\n  const progressPct = (stepsCompleted / totalSteps) * 100;\n\n  return (\n    <div style={containerStyle}>\n      <h1 style={headingStyle}>Welcome {userName}</h1>\n      <p style={subtitleStyle}>Get started with your project or explore new features</p>\n\n      <div style={gridStyle}>\n        {/* Upload and Evaluate Audio */}\n        <OnboardingCard\n          icon={<Upload size={24} />}\n          title=\"Upload and Evaluate Audio\"\n          description=\"Upload Audio Files to Run Evaluations: MP3, WMA or WAV (up to 50 files, max 325MB total)\"\n          buttonLabel=\"Upload\"\n          onAction={onUpload}\n        />\n\n        {/* Getting started with Chordia */}\n        <OnboardingCard\n          icon={<CircleUser size={24} />}\n          title=\"Getting started with Chordia\"\n          description=\"Complete these steps to get the most out of Chordia.\"\n          buttonLabel=\"Continue\"\n          onAction={onContinue}\n        >\n          <div style={{ display: 'flex', alignItems: 'center', gap: 8, width: '100%' }}>\n            <div style={progressBarBg}>\n              <div style={progressBarFill(progressPct)} />\n            </div>\n            <span style={{ fontSize: 12, color: 'var(--text-muted)', fontFamily: FF, whiteSpace: 'nowrap' }}>\n              <strong style={{ color: 'var(--text-base)', fontWeight: 600 }}>{stepsCompleted}</strong> of {totalSteps} steps completed\n            </span>\n          </div>\n        </OnboardingCard>\n\n        {/* Explore Demo Projects */}\n        <OnboardingCard\n          icon={<Compass size={24} />}\n          title=\"Explore Demo Projects\"\n          description=\"Explore how Chordia Compass transforms real data into insights with plans, dashboards, and evaluations.\"\n          buttonLabel=\"Explore\"\n          onAction={onExplore}\n          recommended\n        />\n\n        {/* Connect Data Source */}\n        <OnboardingCard\n          icon={<Link2 size={24} />}\n          title=\"Connect Data Source\"\n          description=\"Connect and integrate third-party tools with your external data sources.\"\n          buttonLabel=\"Connect\"\n          onAction={onConnect}\n        />\n      </div>\n    </div>\n  );\n};\n\nexport default UploadEvaluate;\n","import { useState, useRef } from 'react';\nimport { CloudUpload } from 'lucide-react';\n\nconst FF = 'var(--font-sans)';\n\n// ─── Styles ───\n\nconst containerStyle = {\n  fontFamily: FF,\n};\n\nconst sectionTitleStyle = {\n  fontSize: 20,\n  fontWeight: 600,\n  fontStyle: 'normal',\n  fontFamily: FF,\n  color: 'var(--grey-strong)',\n  margin: 0,\n  lineHeight: 'normal',\n};\n\nconst sectionSubtitleStyle = {\n  fontSize: 13,\n  fontWeight: 400,\n  fontStyle: 'normal',\n  color: 'var(--color-text-secondary)',\n  fontFamily: FF,\n  margin: '4px 0 0',\n  lineHeight: '140%',\n};\n\nconst dropzoneStyle = {\n  display: 'flex',\n  flexDirection: 'column',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: '100%',\n  minHeight: 320,\n  borderRadius: 16,\n  border: '2px dashed var(--color-input-border)',\n  background: 'var(--grey-white)',\n  boxSizing: 'border-box',\n  cursor: 'pointer',\n  transition: 'var(--transition-fast)',\n  marginTop: 24,\n  padding: '48px 24px',\n};\n\nconst dropzoneHoverStyle = {\n  ...dropzoneStyle,\n  borderColor: 'var(--color-green)',\n  background: 'var(--color-green-ring)',\n};\n\nconst dropzoneIconWrap = {\n  width: 80,\n  height: 80,\n  borderRadius: 9999,\n  background: 'var(--focus-2)',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  flexShrink: 0,\n  marginBottom: 20,\n};\n\nconst dropzoneTextStyle = {\n  fontSize: 18,\n  fontWeight: 600,\n  fontFamily: FF,\n  color: 'var(--grey-strong)',\n  textAlign: 'center',\n  lineHeight: '28px',\n  margin: 0,\n};\n\nconst browseButtonStyle = {\n  display: 'flex',\n  height: 32,\n  padding: 16,\n  justifyContent: 'center',\n  alignItems: 'center',\n  gap: 10,\n  borderRadius: 10,\n  border: '1px solid var(--grey-absent)',\n  background: 'var(--grey-white)',\n  fontSize: 15,\n  fontWeight: 400,\n  fontFamily: FF,\n  color: 'var(--grey-strong)',\n  cursor: 'pointer',\n  transition: 'var(--transition-fast)',\n  outline: 'none',\n  marginTop: 16,\n  boxSizing: 'border-box',\n};\n\nconst dropzoneHintStyle = {\n  fontSize: 14,\n  fontWeight: 400,\n  fontFamily: FF,\n  color: 'var(--grey-muted)',\n  textAlign: 'center',\n  marginTop: 16,\n  lineHeight: '140%',\n};\n\n// ─── Component ───\n\nconst UploadInteraction = ({ onFileSelect }) => {\n  const [dragOver, setDragOver] = useState(false);\n  const fileInputRef = useRef(null);\n\n  const handleDragOver = (e) => {\n    e.preventDefault();\n    setDragOver(true);\n  };\n\n  const handleDragLeave = () => {\n    setDragOver(false);\n  };\n\n  const handleDrop = (e) => {\n    e.preventDefault();\n    setDragOver(false);\n    const files = e.dataTransfer?.files;\n    if (files?.length) {\n      onFileSelect?.(files);\n    }\n  };\n\n  const handleBrowseClick = () => {\n    fileInputRef.current?.click();\n  };\n\n  const handleFileChange = (e) => {\n    const files = e.target.files;\n    if (files?.length) {\n      onFileSelect?.(files);\n    }\n    e.target.value = '';\n  };\n\n  return (\n    <div style={containerStyle}>\n      <h2 style={sectionTitleStyle}>Evaluate Interaction</h2>\n      <p style={sectionSubtitleStyle}>\n        Upload another interaction to compare results and identify patterns across multiple evaluations.\n      </p>\n\n      <input\n        ref={fileInputRef}\n        type=\"file\"\n        accept=\".mp3,.wma,.wav\"\n        multiple\n        style={{ display: 'none' }}\n        onChange={handleFileChange}\n      />\n\n      <div\n        style={dragOver ? dropzoneHoverStyle : dropzoneStyle}\n        onDragOver={handleDragOver}\n        onDragLeave={handleDragLeave}\n        onDrop={handleDrop}\n        onClick={handleBrowseClick}\n      >\n        <div style={dropzoneIconWrap}>\n          <CloudUpload size={32} color=\"var(--grey-strong)\" />\n        </div>\n        <p style={dropzoneTextStyle}>Drop your file here, or</p>\n        <button\n          type=\"button\"\n          style={browseButtonStyle}\n          onClick={(e) => { e.stopPropagation(); handleBrowseClick(); }}\n          onMouseEnter={(e) => { e.currentTarget.style.background = 'var(--hover-warm-subtle)'; }}\n          onMouseLeave={(e) => { e.currentTarget.style.background = 'var(--grey-white)'; }}\n        >\n          Browse files\n        </button>\n        <p style={dropzoneHintStyle}>Supports: MP3, WMA or WAV</p>\n      </div>\n    </div>\n  );\n};\n\nexport default UploadInteraction;\n"],"names":["FF","containerStyle","headingStyle","subtitleStyle","gridStyle","cardStyle","cardHoverStyle","iconWrapperStyle","cardTitleStyle","cardDescStyle","btnStyle","progressBarBg","progressBarFill","pct","recommendedBadge","OnboardingCard","icon","title","description","buttonLabel","onAction","recommended","children","hovered","setHovered","useState","jsxs","jsx","e","UploadEvaluate","userName","stepsCompleted","totalSteps","onUpload","onContinue","onExplore","onConnect","progressPct","Upload","CircleUser","Compass","Link2","sectionTitleStyle","sectionSubtitleStyle","dropzoneStyle","dropzoneHoverStyle","dropzoneIconWrap","dropzoneTextStyle","browseButtonStyle","dropzoneHintStyle","UploadInteraction","onFileSelect","dragOver","setDragOver","fileInputRef","useRef","handleDragOver","handleDragLeave","handleDrop","files","_a","handleBrowseClick","CloudUpload"],"mappings":"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"}

package/dist/components/layout.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("react"),s=require("lucide-react");function X({onUploadCall:b,onConnectSource:u,onUseSample:l,showExamples:a=!1}){const[f,j]=d.useState(null),[i,m]=d.useState(null),[c,v]=d.useState(null),[g,t]=d.useState(null),y=d.useRef(null),w=[{id:"five9",name:"Five9",status:"available",description:"Cloud contact center platform"},{id:"twilio",name:"Twilio Flex",status:"available",description:"Programmable contact center"},{id:"genesys",name:"Genesys Cloud",status:"available",description:"All-in-one cloud contact center"},{id:"zoom",name:"Zoom Phone",status:"coming-soon",description:"Cloud phone system"}],S=[{id:"retail-support",name:"Retail Customer Support",description:"Sample interactions from retail customer service team",interactions:24,dateRange:"Last 30 days"},{id:"healthcare-billing",name:"Healthcare Billing Inquiries",description:"Patient billing and insurance verification calls",interactions:18,dateRange:"Last 2 weeks"},{id:"financial-services",name:"Financial Services Compliance",description:"Banking and financial advisory interactions",interactions:32,dateRange:"Last 45 days"}],T=n=>{var h;const r=(h=n.target.files)==null?void 0:h[0];if(r){const o=r.type.startsWith("audio/"),F=r.type.startsWith("video/");o||F?(m({name:r.name,type:r.type,size:r.size,lastModified:new Date(r.lastModified)}),b?b(r):console.log("File uploaded:",r.name,r.type,`(${(r.size/1024/1024).toFixed(2)} MB)`)):alert("Please select an audio or video file.")}y.current&&(y.current.value="")},R=n=>{const r=w.find(h=>h.id===n);r&&r.status==="available"&&(v(r),u?u(r):console.log("Connected to:",r.name))},B=n=>{const r=S.find(h=>h.id===n);r&&(t(r),l?l(r):console.log("Selected project:",r.name))},p=()=>{y.current&&y.current.click()},k=()=>{a&&!g||l&&l(g||{id:"default",name:"Demo Project"})},z=()=>{a&&!c||u&&u(c||{id:"default",name:"Data Source"})},C=[{id:"upload",icon:s.Upload,title:"Upload an interaction",description:"Drop an audio or video recording to see what Compass surfaces",recommended:!1,onClick:p},{id:"sample",icon:s.Sparkles,title:"Explore a demonstration project",description:"See how Chordia Compass surfaces insights from real interaction data",recommended:!0,onClick:k},{id:"connect",icon:s.Link,title:"Connect a data source",description:"Link your existing system to automatically analyze interactions",recommended:!1,onClick:z}];return e.jsxs("div",{style:{minHeight:"100vh",background:"var(--surface-warm)",display:"flex",alignItems:"center",justifyContent:"center",padding:"32px"},children:[e.jsx("input",{ref:y,type:"file",accept:"audio/*,video/*",onChange:T,style:{display:"none"}}),e.jsxs("div",{style:{maxWidth:"680px",width:"100%"},children:[e.jsxs("div",{style:{textAlign:"center",marginBottom:"48px"},children:[e.jsx("h1",{style:{fontSize:"32px",fontWeight:760,letterSpacing:"-0.02em",color:"rgba(30, 33, 37, 0.92)",marginBottom:"12px",lineHeight:1.2},children:"Experience Compass with one interaction"}),e.jsx("p",{style:{fontSize:"15px",color:"rgba(30, 33, 37, 0.65)",lineHeight:1.5,maxWidth:"520px",margin:"0 auto"},children:"Compass surfaces evidence, signals, and actionable insights from customer interactions. Start by exploring what it reveals."})]}),e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"16px"},children:C.map(n=>{const r=n.icon,h=f===n.id;return e.jsxs("button",{type:"button",onClick:n.onClick,onMouseEnter:()=>j(n.id),onMouseLeave:()=>j(null),style:{position:"relative",width:"100%",padding:"24px 28px",background:h?"rgba(255, 255, 255, 0.95)":"rgba(255, 255, 255, 0.85)",border:n.recommended?"2px solid rgba(184, 156, 106, 0.35)":h?"1px solid rgba(52, 58, 64, 0.20)":"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"16px",cursor:"pointer",textAlign:"left",transition:"all 0.2s ease",transform:h?"translateY(-2px)":"translateY(0)",boxShadow:h?"0 12px 28px rgba(30, 33, 37, 0.12)":"0 4px 12px rgba(30, 33, 37, 0.06)"},children:[n.recommended&&e.jsx("div",{style:{position:"absolute",top:"16px",right:"20px",fontSize:"10px",fontWeight:650,letterSpacing:"0.06em",textTransform:"uppercase",color:"rgba(184, 156, 106, 0.75)",background:"rgba(184, 156, 106, 0.12)",padding:"4px 8px",borderRadius:"6px",border:"1px solid rgba(184, 156, 106, 0.2)"},children:"Recommended"}),e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",gap:"18px"},children:[e.jsx("div",{style:{width:"48px",height:"48px",borderRadius:"12px",background:n.recommended?"rgba(184, 156, 106, 0.12)":"rgba(231, 212, 162, 0.20)",border:n.recommended?"1px solid rgba(184, 156, 106, 0.25)":"1px solid rgba(231, 212, 162, 0.35)",display:"flex",alignItems:"center",justifyContent:"center",flexShrink:0},children:e.jsx(r,{size:22,style:{color:n.recommended?"rgba(184, 156, 106, 0.75)":"rgba(30, 33, 37, 0.52)"}})}),e.jsxs("div",{style:{flex:1,paddingTop:"2px"},children:[e.jsx("div",{style:{fontSize:"17px",fontWeight:680,letterSpacing:"-0.01em",color:"rgba(30, 33, 37, 0.92)",marginBottom:"6px",lineHeight:1.3},children:n.title}),e.jsx("div",{style:{fontSize:"13.5px",color:"rgba(30, 33, 37, 0.62)",lineHeight:1.5},children:n.description})]})]})]},n.id)})}),e.jsx("div",{style:{marginTop:"32px",textAlign:"center",fontSize:"12px",color:"rgba(30, 33, 37, 0.52)",lineHeight:1.5},children:"Your workspace has been created automatically. You can configure settings and add teammates later."}),a&&e.jsxs("div",{style:{marginTop:"48px",paddingTop:"32px",borderTop:"1px solid rgba(52, 58, 64, 0.12)"},children:[e.jsx("h2",{style:{fontSize:"20px",fontWeight:680,letterSpacing:"-0.01em",color:"rgba(30, 33, 37, 0.92)",marginBottom:"24px"},children:"Testing Examples"}),i&&e.jsxs("div",{style:{marginBottom:"24px",padding:"16px",background:"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"12px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsx(s.CheckCircle2,{size:18,style:{color:"#1F8F5A"}}),e.jsx("span",{style:{fontSize:"14px",fontWeight:650,color:"rgba(30, 33, 37, 0.92)"},children:"File Uploaded"})]}),e.jsx("button",{onClick:()=>m(null),style:{background:"none",border:"none",cursor:"pointer",padding:"4px",display:"flex",alignItems:"center"},children:e.jsx(s.X,{size:16,style:{color:"rgba(30, 33, 37, 0.42)"}})})]}),e.jsxs("div",{style:{fontSize:"13px",color:"rgba(30, 33, 37, 0.65)",lineHeight:1.5},children:[e.jsxs("div",{children:[e.jsx("strong",{children:"Name:"})," ",i.name]}),e.jsxs("div",{children:[e.jsx("strong",{children:"Type:"})," ",i.type]}),e.jsxs("div",{children:[e.jsx("strong",{children:"Size:"})," ",(i.size/1024/1024).toFixed(2)," MB"]}),e.jsxs("div",{children:[e.jsx("strong",{children:"Uploaded:"})," ",i.lastModified.toLocaleString()]})]})]}),!g&&e.jsxs("div",{style:{marginBottom:"24px"},children:[e.jsx("h3",{style:{fontSize:"15px",fontWeight:650,color:"rgba(30, 33, 37, 0.82)",marginBottom:"12px"},children:"Select a Demonstration Project:"}),e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"8px"},children:S.map(n=>e.jsxs("button",{onClick:()=>B(n.id),style:{padding:"12px 16px",background:"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"8px",textAlign:"left",cursor:"pointer",transition:"all 0.15s ease"},onMouseEnter:r=>{r.currentTarget.style.background="rgba(255, 255, 255, 0.95)",r.currentTarget.style.borderColor="rgba(52, 58, 64, 0.20)"},onMouseLeave:r=>{r.currentTarget.style.background="rgba(255, 255, 255, 0.85)",r.currentTarget.style.borderColor="rgba(52, 58, 64, 0.12)"},children:[e.jsx("div",{style:{fontSize:"14px",fontWeight:650,color:"rgba(30, 33, 37, 0.92)",marginBottom:"4px"},children:n.name}),e.jsx("div",{style:{fontSize:"12px",color:"rgba(30, 33, 37, 0.62)",marginBottom:"4px"},children:n.description}),e.jsxs("div",{style:{fontSize:"11px",color:"rgba(30, 33, 37, 0.52)"},children:[n.interactions," interactions · ",n.dateRange]})]},n.id))})]}),g&&e.jsxs("div",{style:{marginBottom:"24px",padding:"16px",background:"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"12px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsx(s.CheckCircle2,{size:18,style:{color:"#1F8F5A"}}),e.jsxs("span",{style:{fontSize:"14px",fontWeight:650,color:"rgba(30, 33, 37, 0.92)"},children:["Project Selected: ",g.name]})]}),e.jsx("button",{onClick:()=>t(null),style:{background:"none",border:"none",cursor:"pointer",padding:"4px",display:"flex",alignItems:"center"},children:e.jsx(s.X,{size:16,style:{color:"rgba(30, 33, 37, 0.42)"}})})]}),e.jsxs("div",{style:{fontSize:"13px",color:"rgba(30, 33, 37, 0.65)",lineHeight:1.5},children:[e.jsx("div",{children:g.description}),e.jsxs("div",{style:{marginTop:"4px"},children:[e.jsx("strong",{children:g.interactions})," interactions · ",e.jsx("strong",{children:g.dateRange})]})]})]}),!c&&e.jsxs("div",{style:{marginBottom:"24px"},children:[e.jsx("h3",{style:{fontSize:"15px",fontWeight:650,color:"rgba(30, 33, 37, 0.82)",marginBottom:"12px"},children:"Connect a Data Source:"}),e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"8px"},children:w.map(n=>e.jsx("button",{onClick:()=>R(n.id),disabled:n.status==="coming-soon",style:{padding:"12px 16px",background:n.status==="coming-soon"?"rgba(255, 255, 255, 0.5)":"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"8px",textAlign:"left",cursor:n.status==="coming-soon"?"not-allowed":"pointer",transition:"all 0.15s ease",opacity:n.status==="coming-soon"?.6:1},onMouseEnter:r=>{n.status!=="coming-soon"&&(r.currentTarget.style.background="rgba(255, 255, 255, 0.95)",r.currentTarget.style.borderColor="rgba(52, 58, 64, 0.20)")},onMouseLeave:r=>{n.status!=="coming-soon"&&(r.currentTarget.style.background="rgba(255, 255, 255, 0.85)",r.currentTarget.style.borderColor="rgba(52, 58, 64, 0.12)")},children:e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[e.jsxs("div",{children:[e.jsx("div",{style:{fontSize:"14px",fontWeight:650,color:"rgba(30, 33, 37, 0.92)",marginBottom:"4px"},children:n.name}),e.jsx("div",{style:{fontSize:"12px",color:"rgba(30, 33, 37, 0.62)"},children:n.description})]}),n.status==="coming-soon"&&e.jsx("span",{style:{fontSize:"10px",fontWeight:600,color:"rgba(30, 33, 37, 0.42)",background:"rgba(30, 33, 37, 0.08)",padding:"4px 8px",borderRadius:"4px"},children:"Coming Soon"})]})},n.id))})]}),c&&e.jsxs("div",{style:{marginBottom:"24px",padding:"16px",background:"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"12px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsx(s.CheckCircle2,{size:18,style:{color:"#1F8F5A"}}),e.jsxs("span",{style:{fontSize:"14px",fontWeight:650,color:"rgba(30, 33, 37, 0.92)"},children:["Connected: ",c.name]})]}),e.jsx("button",{onClick:()=>v(null),style:{background:"none",border:"none",cursor:"pointer",padding:"4px",display:"flex",alignItems:"center"},children:e.jsx(s.X,{size:16,style:{color:"rgba(30, 33, 37, 0.42)"}})})]}),e.jsx("div",{style:{fontSize:"13px",color:"rgba(30, 33, 37, 0.65)",lineHeight:1.5},children:c.description})]})]})]})]})}function G({onDismiss:b,onItemClick:u,completedItems:l=[]}){const[a,f]=d.useState(!1),[j,i]=d.useState(null),m=[{id:"name-project",title:"Name your workspace",description:"Give your default project a meaningful name",icon:s.FolderOpen,completed:l.includes("name-project"),optional:!0},{id:"evaluate-second-interaction",title:"Evaluate another interaction",description:"Upload or connect a second interaction to see patterns",icon:s.Sparkles,completed:l.includes("evaluate-second-interaction")},{id:"connect-source",title:"Connect a data source",description:"Link your system or platform for automatic evaluation",icon:s.Link,completed:l.includes("connect-source")},{id:"invite-team",title:"Add teammates",description:"Invite managers or QA team members to collaborate",icon:s.Users,completed:l.includes("invite-team"),optional:!0},{id:"learn-concepts",title:"Understand Chordia concepts",description:"Learn how conditions, evidence, and confidence work",icon:s.BookOpen,completed:l.includes("learn-concepts"),optional:!0},{id:"configure-scope",title:"Clarify evaluation scope",description:"Customize which signals and conditions matter for your team",icon:s.Settings,completed:l.includes("configure-scope"),optional:!0}],c=m.filter(t=>t.completed).length,v=m.length,g=c/v*100;return a?e.jsx("button",{type:"button",onClick:()=>f(!1),style:{width:"100%",padding:"14px 16px",background:"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"12px",cursor:"pointer",textAlign:"left",transition:"all 0.15s ease",boxShadow:"0 2px 8px rgba(30, 33, 37, 0.04)"},onMouseEnter:t=>{t.currentTarget.style.background="rgba(255, 255, 255, 0.95)",t.currentTarget.style.borderColor="rgba(52, 58, 64, 0.18)"},onMouseLeave:t=>{t.currentTarget.style.background="rgba(255, 255, 255, 0.85)",t.currentTarget.style.borderColor="rgba(52, 58, 64, 0.12)"},children:e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:"12px"},children:[e.jsxs("div",{style:{fontSize:"13px",fontWeight:600,color:"rgba(30, 33, 37, 0.75)"},children:["Getting started (",c,"/",v,")"]}),e.jsx(s.ChevronRight,{size:16,style:{color:"rgba(30, 33, 37, 0.42)"}})]})}):e.jsxs("div",{style:{background:"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"16px",overflow:"hidden",boxShadow:"0 4px 16px rgba(30, 33, 37, 0.06)"},children:[e.jsxs("div",{style:{padding:"18px 20px 16px",borderBottom:"1px solid rgba(52, 58, 64, 0.08)"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",justifyContent:"space-between",gap:"12px"},children:[e.jsxs("div",{style:{flex:1},children:[e.jsx("div",{style:{fontSize:"15px",fontWeight:680,letterSpacing:"-0.01em",color:"rgba(30, 33, 37, 0.92)",marginBottom:"6px",lineHeight:1.3},children:"Getting started with Chordia"}),e.jsxs("div",{style:{fontSize:"12px",color:"rgba(30, 33, 37, 0.58)",lineHeight:1.4},children:[c," of ",v," completed"]})]}),e.jsxs("div",{style:{display:"flex",gap:"4px"},children:[e.jsx("button",{type:"button",onClick:()=>f(!0),style:{width:"28px",height:"28px",borderRadius:"6px",background:"transparent",border:"1px solid rgba(52, 58, 64, 0.12)",cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.15s ease",color:"rgba(30, 33, 37, 0.52)"},onMouseEnter:t=>{t.currentTarget.style.background="rgba(231, 212, 162, 0.12)",t.currentTarget.style.borderColor="rgba(52, 58, 64, 0.18)"},onMouseLeave:t=>{t.currentTarget.style.background="transparent",t.currentTarget.style.borderColor="rgba(52, 58, 64, 0.12)"},title:"Collapse",children:e.jsx(s.ChevronRight,{size:14})}),b&&e.jsx("button",{type:"button",onClick:b,style:{width:"28px",height:"28px",borderRadius:"6px",background:"transparent",border:"1px solid rgba(52, 58, 64, 0.12)",cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.15s ease",color:"rgba(30, 33, 37, 0.52)"},onMouseEnter:t=>{t.currentTarget.style.background="rgba(231, 212, 162, 0.12)",t.currentTarget.style.borderColor="rgba(52, 58, 64, 0.18)"},onMouseLeave:t=>{t.currentTarget.style.background="transparent",t.currentTarget.style.borderColor="rgba(52, 58, 64, 0.12)"},title:"Dismiss checklist",children:e.jsx(s.X,{size:14})})]})]}),e.jsx("div",{style:{marginTop:"14px",height:"6px",background:"rgba(30, 33, 37, 0.08)",borderRadius:"999px",overflow:"hidden"},children:e.jsx("div",{style:{height:"100%",width:`${g}%`,background:"linear-gradient(90deg, rgba(184, 156, 106, 0.75) 0%, rgba(139, 157, 127, 0.75) 100%)",borderRadius:"999px",transition:"width 0.4s ease"}})})]}),e.jsx("div",{style:{padding:"8px"},children:m.map((t,y)=>{const w=t.icon,S=j===t.id;return e.jsx("button",{type:"button",onClick:()=>u==null?void 0:u(t.id),onMouseEnter:()=>i(t.id),onMouseLeave:()=>i(null),disabled:t.completed,style:{width:"100%",padding:"12px 14px",background:t.completed?"rgba(139, 157, 127, 0.06)":S?"rgba(231, 212, 162, 0.12)":"transparent",border:"none",borderRadius:"10px",cursor:t.completed?"default":"pointer",textAlign:"left",transition:"all 0.15s ease",marginBottom:y<m.length-1?"4px":"0",opacity:t.completed?.7:1},children:e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",gap:"12px"},children:[e.jsx("div",{style:{width:"20px",height:"20px",marginTop:"1px",flexShrink:0},children:t.completed?e.jsx(s.CheckCircle2,{size:20,style:{color:"rgba(139, 157, 127, 0.75)"}}):e.jsx(s.Circle,{size:20,style:{color:"rgba(30, 33, 37, 0.24)"}})}),e.jsxs("div",{style:{flex:1,minWidth:0},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",marginBottom:"3px"},children:[e.jsx(w,{size:14,style:{color:"rgba(30, 33, 37, 0.52)",flexShrink:0}}),e.jsx("span",{style:{fontSize:"13px",fontWeight:600,color:t.completed?"rgba(30, 33, 37, 0.52)":"rgba(30, 33, 37, 0.85)",textDecoration:t.completed?"line-through":"none",lineHeight:1.3},children:t.title}),t.optional&&!t.completed&&e.jsx("span",{style:{fontSize:"9px",fontWeight:600,letterSpacing:"0.04em",textTransform:"uppercase",color:"rgba(30, 33, 37, 0.42)",background:"rgba(30, 33, 37, 0.06)",padding:"2px 5px",borderRadius:"4px"},children:"Optional"})]}),e.jsx("div",{style:{fontSize:"11.5px",color:"rgba(30, 33, 37, 0.52)",lineHeight:1.4,paddingLeft:"22px"},children:t.description})]}),!t.completed&&S&&e.jsx(s.ChevronRight,{size:16,style:{color:"rgba(30, 33, 37, 0.32)",marginTop:"2px",flexShrink:0}})]})},t.id)})}),e.jsx("div",{style:{padding:"12px 20px 16px",borderTop:"1px solid rgba(52, 58, 64, 0.08)"},children:e.jsxs("div",{style:{fontSize:"11px",color:"rgba(30, 33, 37, 0.52)",lineHeight:1.5,fontStyle:"italic"},children:["You can dismiss this checklist anytime. These steps help you get the most from Chordia, but ","aren't"," required."]})})]})}function N({text:b="Demo Project",accentColor:u="#B89C6A",textColor:l="rgba(255, 255, 255, 0.95)",size:a="medium",position:f="fixed"}){const i={small:{width:140,height:140,fontSize:"11px",letterSpacing:"0.08em",fontWeight:650},medium:{width:180,height:180,fontSize:"12px",letterSpacing:"0.1em",fontWeight:680},large:{width:220,height:220,fontSize:"13px",letterSpacing:"0.12em",fontWeight:700}}[a];return e.jsxs("div",{style:{position:f,top:0,right:0,width:i.width,height:i.height,overflow:"hidden",zIndex:f==="fixed"?9999:1,pointerEvents:"none"},children:[e.jsx("div",{style:{position:"absolute",top:0,right:0,width:0,height:0,borderStyle:"solid",borderWidth:`0 ${i.width}px ${i.height}px 0`,borderColor:`transparent ${u} transparent transparent`,opacity:.92}}),e.jsx("div",{style:{position:"absolute",top:0,right:0,width:0,height:0,borderStyle:"solid",borderWidth:`0 ${i.width}px ${i.height}px 0`,borderColor:"transparent rgba(0, 0, 0, 0.08) transparent transparent"}}),e.jsx("div",{style:{position:"absolute",top:a==="small"?"28px":a==="medium"?"38px":"48px",right:a==="small"?"-32px":a==="medium"?"-42px":"-52px",width:a==="small"?"160px":a==="medium"?"200px":"240px",transform:"rotate(45deg)",transformOrigin:"center",textAlign:"center"},children:e.jsx("div",{style:{fontSize:i.fontSize,fontWeight:i.fontWeight,letterSpacing:i.letterSpacing,textTransform:"uppercase",color:l,textShadow:"0 1px 2px rgba(0, 0, 0, 0.15)",whiteSpace:"nowrap",userSelect:"none"},children:b})}),e.jsx("div",{style:{position:"absolute",top:0,right:0,width:i.width,height:i.height,background:"linear-gradient(135deg, transparent 0%, rgba(0, 0, 0, 0.04) 100%)",pointerEvents:"none"}})]})}function Q({providerName:b,description:u,status:l="available",railColor:a,logoUrl:f,icon:j,onConfigure:i}){const m={connected:{label:"Connected",color:"#6B7C93",bgColor:"rgba(107, 124, 147, 0.08)",borderColor:"rgba(107, 124, 147, 0.20)",icon:e.jsx(s.CheckCircle2,{size:14,strokeWidth:2.5})},available:{label:"Available",color:"#1E2125",bgColor:"rgba(30, 33, 37, 0.04)",borderColor:"rgba(30, 33, 37, 0.12)",icon:e.jsx(s.Circle,{size:14,strokeWidth:2})},"coming-soon":{label:"Coming Soon",color:"rgba(30, 33, 37, 0.42)",bgColor:"transparent",borderColor:"rgba(30, 33, 37, 0.12)",icon:e.jsx(s.Circle,{size:14,strokeWidth:2,style:{opacity:.4}})}},c=m[l]||m.available;return e.jsxs("div",{style:{background:"#FFFFFF",border:`1px solid ${a}20`,borderRadius:"8px",position:"relative",display:"flex",flexDirection:"column",transition:"all 0.15s ease",cursor:l==="coming-soon"?"default":"pointer",opacity:l==="coming-soon"?.6:1,overflow:"hidden",height:"100%"},className:"hover:shadow-sm",children:[e.jsx("div",{style:{position:"absolute",left:0,top:0,bottom:0,width:"4px",background:a,opacity:l==="coming-soon"?.4:1}}),e.jsxs("div",{style:{padding:"20px",paddingLeft:"24px",display:"flex",flexDirection:"column",gap:"16px",height:"100%"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",justifyContent:"space-between",gap:"12px"},children:[e.jsx("div",{style:{width:"48px",height:"48px",borderRadius:"6px",background:`${a}08`,border:`1px solid ${a}18`,display:"flex",alignItems:"center",justifyContent:"center",flexShrink:0},children:f?e.jsx("img",{src:f,alt:b,style:{width:"32px",height:"32px",objectFit:"contain"}}):e.jsx("div",{style:{color:a,fontSize:"20px",fontWeight:650,opacity:.8},children:j||(b?b.charAt(0):"")})}),e.jsxs("div",{style:{display:"inline-flex",alignItems:"center",gap:"6px",padding:"4px 10px",borderRadius:"4px",background:c.bgColor,border:`1px solid ${c.borderColor}`,fontSize:"11px",fontWeight:600,letterSpacing:"0.01em",color:c.color,flexShrink:0},children:[c.icon,c.label]})]}),e.jsxs("div",{style:{flex:1,minHeight:0},children:[e.jsx("h3",{style:{fontSize:"15px",fontWeight:650,color:"rgba(30, 33, 37, 0.92)",marginBottom:"6px",letterSpacing:"-0.01em"},children:b}),e.jsx("p",{style:{fontSize:"13px",lineHeight:1.5,color:"rgba(30, 33, 37, 0.65)"},children:u})]}),l!=="coming-soon"&&e.jsxs("button",{onClick:v=>{v.stopPropagation(),i==null||i()},style:{display:"flex",alignItems:"center",justifyContent:"center",gap:"8px",padding:"8px 14px",border:"1px solid rgba(30, 33, 37, 0.15)",borderRadius:"5px",background:l==="connected"?"transparent":"rgba(30, 33, 37, 0.03)",fontSize:"13px",fontWeight:600,color:"rgba(30, 33, 37, 0.92)",cursor:"pointer",transition:"all 0.15s ease",width:"100%",marginTop:"auto"},className:"hover:bg-[rgba(30,33,37,0.06)] hover:border-[rgba(30,33,37,0.20)]",children:[e.jsx(s.Settings,{size:14,strokeWidth:2.5}),l==="connected"?"Configure":"Connect"]})]})]})}const V="../../assets/chordia-logo.png";function Z({title:b="Chordia",subtitle:u="Sign in to continue",logo:l,onLogin:a,loading:f=!1,error:j=null,footer:i,showLabels:m=!0,emailPlaceholder:c="you@company.com",passwordPlaceholder:v="Password",onForgotPassword:g,compact:t=!1}){const[y,w]=d.useState(""),[S,T]=d.useState(""),[R,B]=d.useState(!1),[p,k]=d.useState(null),z=o=>{o.preventDefault(),!(!y||!S||f)&&(a==null||a(y,S))},C=y&&S&&!f,n="var(--rail-compliance)",r="201, 138, 90",h=e.jsxs("div",{style:{width:"100%",maxWidth:400,background:"var(--paper-elevated)",border:"1px solid var(--border)",borderRadius:"var(--radius-lg)",padding:"44px 36px 36px",boxShadow:"0 8px 32px rgba(30, 33, 37, 0.06), 0 1px 3px rgba(30, 33, 37, 0.04)",position:"relative",overflow:"hidden"},children:[e.jsx("div",{style:{position:"absolute",top:0,left:0,right:0,height:3,background:`linear-gradient(90deg, var(--state-unknown), ${n})`,opacity:.6}}),e.jsx("div",{style:{textAlign:"center",marginBottom:32},children:l||e.jsxs(e.Fragment,{children:[e.jsx("div",{style:{display:"inline-flex",alignItems:"center",justifyContent:"center",padding:"12px 24px",borderRadius:"var(--radius-lg)",background:"rgba(30, 33, 37, 0.92)",marginBottom:16},children:e.jsx("img",{src:V,alt:b,style:{height:28,display:"block"}})}),u&&e.jsx("p",{style:{fontSize:"var(--text-sm)",color:"var(--text-muted)",marginTop:4,marginBottom:0},children:u})]})}),e.jsxs("form",{onSubmit:z,children:[e.jsxs("div",{style:{marginBottom:18},children:[m&&e.jsx("label",{style:{display:"block",fontSize:"var(--text-sm)",fontWeight:550,color:"var(--text-strong)",marginBottom:6,fontFamily:"var(--font-sans)"},children:"Email"}),e.jsxs("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[e.jsx(s.Mail,{size:15,style:{position:"absolute",left:12,color:p==="email"?`rgba(${r}, 0.7)`:"var(--text-faint)",pointerEvents:"none",transition:"color 0.2s ease"}}),e.jsx("input",{type:"email",value:y,onChange:o=>w(o.target.value),placeholder:c,required:!0,autoFocus:!0,autoComplete:"email",style:{width:"100%",padding:"11px 12px 11px 38px",fontSize:"var(--text-md)",border:"1px solid",borderColor:p==="email"?n:"var(--border)",borderRadius:"var(--radius)",backgroundColor:p==="email"?"rgba(255,255,255,0.95)":"var(--paper)",color:"var(--text-ink)",fontFamily:"var(--font-sans)",outline:"none",transition:"border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease",boxShadow:p==="email"?`0 0 0 3px rgba(${r}, 0.1)`:"none"},onFocus:()=>k("email"),onBlur:()=>k(null)})]})]}),e.jsxs("div",{style:{marginBottom:6},children:[m&&e.jsx("label",{style:{display:"block",fontSize:"var(--text-sm)",fontWeight:550,color:"var(--text-strong)",marginBottom:6,fontFamily:"var(--font-sans)"},children:"Password"}),e.jsxs("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[e.jsx(s.Lock,{size:15,style:{position:"absolute",left:12,color:p==="password"?`rgba(${r}, 0.7)`:"var(--text-faint)",pointerEvents:"none",transition:"color 0.2s ease"}}),e.jsx("input",{type:R?"text":"password",value:S,onChange:o=>T(o.target.value),placeholder:v,required:!0,autoComplete:"current-password",style:{width:"100%",padding:"11px 42px 11px 38px",fontSize:"var(--text-md)",border:"1px solid",borderColor:p==="password"?n:"var(--border)",borderRadius:"var(--radius)",backgroundColor:p==="password"?"rgba(255,255,255,0.95)":"var(--paper)",color:"var(--text-ink)",fontFamily:"var(--font-sans)",outline:"none",transition:"border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease",boxShadow:p==="password"?`0 0 0 3px rgba(${r}, 0.1)`:"none"},onFocus:()=>k("password"),onBlur:()=>k(null)}),e.jsx("button",{type:"button",onClick:()=>B(!R),style:{position:"absolute",right:8,background:"none",border:"none",padding:4,cursor:"pointer",color:"var(--text-faint)",display:"flex",alignItems:"center",transition:"color 0.15s ease",borderRadius:"var(--radius-sm)"},tabIndex:-1,onMouseEnter:o=>{o.currentTarget.style.color="var(--text-muted)"},onMouseLeave:o=>{o.currentTarget.style.color="var(--text-faint)"},children:R?e.jsx(s.EyeOff,{size:16}):e.jsx(s.Eye,{size:16})})]})]}),g&&e.jsx("div",{style:{textAlign:"right",marginBottom:4},children:e.jsx("button",{type:"button",onClick:g,style:{background:"none",border:"none",padding:"2px 0",fontSize:"var(--text-xs)",color:"var(--text-muted)",cursor:"pointer",fontFamily:"var(--font-sans)",transition:"color 0.15s ease"},onMouseEnter:o=>{o.currentTarget.style.color="var(--text-strong)"},onMouseLeave:o=>{o.currentTarget.style.color="var(--text-muted)"},children:"Forgot password?"})}),j&&e.jsx("div",{style:{fontSize:"var(--text-sm)",color:"var(--text-strong)",marginTop:12,padding:"8px 12px",background:"color-mix(in srgb, var(--state-unknown) 10%, transparent)",border:"1px solid color-mix(in srgb, var(--state-unknown) 25%, transparent)",borderRadius:"var(--radius-sm)",textAlign:"center",fontWeight:500},children:j}),e.jsx("button",{type:"submit",disabled:!C,style:{width:"100%",padding:"11px 0",marginTop:20,background:C?"var(--text-ink)":"var(--text-xfaint)",color:"#ffffff",border:"none",borderRadius:"var(--radius)",fontSize:"var(--text-md)",fontWeight:600,fontFamily:"var(--font-sans)",cursor:C?"pointer":"not-allowed",transition:"opacity 0.15s ease, transform 0.1s ease",display:"flex",alignItems:"center",justifyContent:"center",gap:8},onMouseEnter:o=>{C&&(o.currentTarget.style.opacity="0.85",o.currentTarget.style.transform="translateY(-1px)")},onMouseLeave:o=>{o.currentTarget.style.opacity="1",o.currentTarget.style.transform="translateY(0)"},onMouseDown:o=>{C&&(o.currentTarget.style.transform="translateY(0)")},onMouseUp:o=>{C&&(o.currentTarget.style.transform="translateY(-1px)")},children:f?"Signing in…":e.jsxs(e.Fragment,{children:["Sign In",e.jsx(s.ArrowRight,{size:16})]})})]}),i&&e.jsxs(e.Fragment,{children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:12,margin:"24px 0 16px"},children:[e.jsx("div",{style:{flex:1,height:1,background:"var(--border)"}}),e.jsx("span",{style:{fontSize:"var(--text-xs)",color:"var(--text-faint)"},children:"or"}),e.jsx("div",{style:{flex:1,height:1,background:"var(--border)"}})]}),e.jsx("div",{style:{textAlign:"center",fontSize:"var(--text-xs)",color:"var(--text-faint)"},children:i})]})]});return t?h:e.jsx("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",minHeight:"100vh",background:"var(--bg-chordia)",padding:"var(--spacing-6)"},children:h})}function _({left:b,right:u,defaultWidth:l=260,defaultRatio:a,minWidth:f=180,maxWidth:j=450,minRatio:i,maxRatio:m,collapsedWidth:c=0,collapsed:v,onCollapsedChange:g,collapseSide:t="left",collapseThreshold:y,dividerWidth:w=7,style:S}){const T=v!==void 0,[R,B]=d.useState(!1),p=T?v:R,k=d.useCallback(x=>{const W=typeof x=="function"?x(p):x;T||B(W),g==null||g(W)},[T,p,g]),z=d.useRef(null),[C,n]=d.useState(0),[r,h]=d.useState(l),[o,F]=d.useState(!1),[$,O]=d.useState(!1),E=d.useRef(0),L=d.useRef(0);d.useLayoutEffect(()=>{if(!z.current)return;const x=z.current.offsetWidth;n(x),!$&&x>0&&(a!=null&&h(Math.round(x*a)),O(!0))},[]),d.useEffect(()=>{if(!z.current)return;const x=new ResizeObserver(W=>{for(const I of W)n(I.contentRect.width)});return x.observe(z.current),()=>x.disconnect()},[]);const M=i!=null?Math.round(C*i):f,D=m!=null?Math.round(C*m):j,A=y??(t==="none"?0:M-40),Y=d.useCallback(x=>{x.preventDefault(),E.current=x.clientX,L.current=p?c:r,F(!0)},[r,p,c]);d.useEffect(()=>{if(!o)return;const x=I=>{const q=I.clientX-E.current,H=L.current+q;if((t==="left"||t==="both")&&H<A){p||k(!0);return}p&&k(!1),h(Math.min(Math.max(H,M),D))},W=()=>F(!1);return document.addEventListener("mousemove",x),document.addEventListener("mouseup",W),document.body.style.userSelect="none",document.body.style.cursor="col-resize",()=>{document.removeEventListener("mousemove",x),document.removeEventListener("mouseup",W),document.body.style.userSelect="",document.body.style.cursor=""}},[o,p,M,D,A,C,w,t,k]);const U=d.useCallback(()=>{t!=="none"&&k(x=>!x)},[k,t]),P=p?c:r;return e.jsxs("div",{ref:z,style:{display:"flex",height:"100%",overflow:"hidden",position:"relative",...S},children:[(P>0||!p)&&e.jsx("div",{style:{width:P,flexShrink:0,overflow:"hidden",transition:o?"none":"width 0.2s ease",height:"100%"},children:!p&&b}),e.jsxs("div",{onMouseDown:Y,onDoubleClick:U,style:{width:`${w}px`,flexShrink:0,cursor:"col-resize",display:"flex",alignItems:"center",justifyContent:"center",position:"relative",zIndex:2},children:[e.jsx("div",{style:{width:"1px",height:"100%",background:o?"var(--rail-discovery, #5E88B0)":"var(--border, rgba(52,58,64,0.12))",transition:"background 0.15s ease"}}),e.jsx("div",{style:{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",width:"5px",height:"28px",borderRadius:"3px",background:o?"var(--rail-discovery, #5E88B0)":"var(--border, rgba(52,58,64,0.12))",opacity:o?1:0,transition:"opacity 0.15s ease, background 0.15s ease"},className:"splitpane-grip"}),e.jsx("style",{children:`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("react"),s=require("lucide-react"),X=require("../IntegrationCard.cjs.js");function G({onUploadCall:S,onConnectSource:h,onUseSample:g,showExamples:d=!1}){const[f,C]=a.useState(null),[i,m]=a.useState(null),[u,k]=a.useState(null),[c,t]=a.useState(null),b=a.useRef(null),w=[{id:"five9",name:"Five9",status:"available",description:"Cloud contact center platform"},{id:"twilio",name:"Twilio Flex",status:"available",description:"Programmable contact center"},{id:"genesys",name:"Genesys Cloud",status:"available",description:"All-in-one cloud contact center"},{id:"zoom",name:"Zoom Phone",status:"coming-soon",description:"Cloud phone system"}],y=[{id:"retail-support",name:"Retail Customer Support",description:"Sample interactions from retail customer service team",interactions:24,dateRange:"Last 30 days"},{id:"healthcare-billing",name:"Healthcare Billing Inquiries",description:"Patient billing and insurance verification calls",interactions:18,dateRange:"Last 2 weeks"},{id:"financial-services",name:"Financial Services Compliance",description:"Banking and financial advisory interactions",interactions:32,dateRange:"Last 45 days"}],T=n=>{var x;const r=(x=n.target.files)==null?void 0:x[0];if(r){const o=r.type.startsWith("audio/"),W=r.type.startsWith("video/");o||W?(m({name:r.name,type:r.type,size:r.size,lastModified:new Date(r.lastModified)}),S?S(r):console.log("File uploaded:",r.name,r.type,`(${(r.size/1024/1024).toFixed(2)} MB)`)):alert("Please select an audio or video file.")}b.current&&(b.current.value="")},R=n=>{const r=w.find(x=>x.id===n);r&&r.status==="available"&&(k(r),h?h(r):console.log("Connected to:",r.name))},M=n=>{const r=y.find(x=>x.id===n);r&&(t(r),g?g(r):console.log("Selected project:",r.name))},l=()=>{b.current&&b.current.click()},v=()=>{d&&!c||g&&g(c||{id:"default",name:"Demo Project"})},z=()=>{d&&!u||h&&h(u||{id:"default",name:"Data Source"})},j=[{id:"upload",icon:s.Upload,title:"Upload an interaction",description:"Drop an audio or video recording to see what Compass surfaces",recommended:!1,onClick:l},{id:"sample",icon:s.Sparkles,title:"Explore a demonstration project",description:"See how Chordia Compass surfaces insights from real interaction data",recommended:!0,onClick:v},{id:"connect",icon:s.Link,title:"Connect a data source",description:"Link your existing system to automatically analyze interactions",recommended:!1,onClick:z}];return e.jsxs("div",{style:{minHeight:"100vh",background:"var(--surface-warm)",display:"flex",alignItems:"center",justifyContent:"center",padding:"32px"},children:[e.jsx("input",{ref:b,type:"file",accept:"audio/*,video/*",onChange:T,style:{display:"none"}}),e.jsxs("div",{style:{maxWidth:"680px",width:"100%"},children:[e.jsxs("div",{style:{textAlign:"center",marginBottom:"48px"},children:[e.jsx("h1",{style:{fontSize:"32px",fontWeight:760,letterSpacing:"-0.02em",color:"rgba(30, 33, 37, 0.92)",marginBottom:"12px",lineHeight:1.2},children:"Experience Compass with one interaction"}),e.jsx("p",{style:{fontSize:"15px",color:"rgba(30, 33, 37, 0.65)",lineHeight:1.5,maxWidth:"520px",margin:"0 auto"},children:"Compass surfaces evidence, signals, and actionable insights from customer interactions. Start by exploring what it reveals."})]}),e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"16px"},children:j.map(n=>{const r=n.icon,x=f===n.id;return e.jsxs("button",{type:"button",onClick:n.onClick,onMouseEnter:()=>C(n.id),onMouseLeave:()=>C(null),style:{position:"relative",width:"100%",padding:"24px 28px",background:x?"rgba(255, 255, 255, 0.95)":"rgba(255, 255, 255, 0.85)",border:n.recommended?"2px solid rgba(184, 156, 106, 0.35)":x?"1px solid rgba(52, 58, 64, 0.20)":"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"16px",cursor:"pointer",textAlign:"left",transition:"all 0.2s ease",transform:x?"translateY(-2px)":"translateY(0)",boxShadow:x?"0 12px 28px rgba(30, 33, 37, 0.12)":"0 4px 12px rgba(30, 33, 37, 0.06)"},children:[n.recommended&&e.jsx("div",{style:{position:"absolute",top:"16px",right:"20px",fontSize:"10px",fontWeight:650,letterSpacing:"0.06em",textTransform:"uppercase",color:"rgba(184, 156, 106, 0.75)",background:"rgba(184, 156, 106, 0.12)",padding:"4px 8px",borderRadius:"6px",border:"1px solid rgba(184, 156, 106, 0.2)"},children:"Recommended"}),e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",gap:"18px"},children:[e.jsx("div",{style:{width:"48px",height:"48px",borderRadius:"12px",background:n.recommended?"rgba(184, 156, 106, 0.12)":"rgba(231, 212, 162, 0.20)",border:n.recommended?"1px solid rgba(184, 156, 106, 0.25)":"1px solid rgba(231, 212, 162, 0.35)",display:"flex",alignItems:"center",justifyContent:"center",flexShrink:0},children:e.jsx(r,{size:22,style:{color:n.recommended?"rgba(184, 156, 106, 0.75)":"rgba(30, 33, 37, 0.52)"}})}),e.jsxs("div",{style:{flex:1,paddingTop:"2px"},children:[e.jsx("div",{style:{fontSize:"17px",fontWeight:680,letterSpacing:"-0.01em",color:"rgba(30, 33, 37, 0.92)",marginBottom:"6px",lineHeight:1.3},children:n.title}),e.jsx("div",{style:{fontSize:"13.5px",color:"rgba(30, 33, 37, 0.62)",lineHeight:1.5},children:n.description})]})]})]},n.id)})}),e.jsx("div",{style:{marginTop:"32px",textAlign:"center",fontSize:"12px",color:"rgba(30, 33, 37, 0.52)",lineHeight:1.5},children:"Your workspace has been created automatically. You can configure settings and add teammates later."}),d&&e.jsxs("div",{style:{marginTop:"48px",paddingTop:"32px",borderTop:"1px solid rgba(52, 58, 64, 0.12)"},children:[e.jsx("h2",{style:{fontSize:"20px",fontWeight:680,letterSpacing:"-0.01em",color:"rgba(30, 33, 37, 0.92)",marginBottom:"24px"},children:"Testing Examples"}),i&&e.jsxs("div",{style:{marginBottom:"24px",padding:"16px",background:"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"12px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsx(s.CheckCircle2,{size:18,style:{color:"#1F8F5A"}}),e.jsx("span",{style:{fontSize:"14px",fontWeight:650,color:"rgba(30, 33, 37, 0.92)"},children:"File Uploaded"})]}),e.jsx("button",{onClick:()=>m(null),style:{background:"none",border:"none",cursor:"pointer",padding:"4px",display:"flex",alignItems:"center"},children:e.jsx(s.X,{size:16,style:{color:"rgba(30, 33, 37, 0.42)"}})})]}),e.jsxs("div",{style:{fontSize:"13px",color:"rgba(30, 33, 37, 0.65)",lineHeight:1.5},children:[e.jsxs("div",{children:[e.jsx("strong",{children:"Name:"})," ",i.name]}),e.jsxs("div",{children:[e.jsx("strong",{children:"Type:"})," ",i.type]}),e.jsxs("div",{children:[e.jsx("strong",{children:"Size:"})," ",(i.size/1024/1024).toFixed(2)," MB"]}),e.jsxs("div",{children:[e.jsx("strong",{children:"Uploaded:"})," ",i.lastModified.toLocaleString()]})]})]}),!c&&e.jsxs("div",{style:{marginBottom:"24px"},children:[e.jsx("h3",{style:{fontSize:"15px",fontWeight:650,color:"rgba(30, 33, 37, 0.82)",marginBottom:"12px"},children:"Select a Demonstration Project:"}),e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"8px"},children:y.map(n=>e.jsxs("button",{onClick:()=>M(n.id),style:{padding:"12px 16px",background:"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"8px",textAlign:"left",cursor:"pointer",transition:"all 0.15s ease"},onMouseEnter:r=>{r.currentTarget.style.background="rgba(255, 255, 255, 0.95)",r.currentTarget.style.borderColor="rgba(52, 58, 64, 0.20)"},onMouseLeave:r=>{r.currentTarget.style.background="rgba(255, 255, 255, 0.85)",r.currentTarget.style.borderColor="rgba(52, 58, 64, 0.12)"},children:[e.jsx("div",{style:{fontSize:"14px",fontWeight:650,color:"rgba(30, 33, 37, 0.92)",marginBottom:"4px"},children:n.name}),e.jsx("div",{style:{fontSize:"12px",color:"rgba(30, 33, 37, 0.62)",marginBottom:"4px"},children:n.description}),e.jsxs("div",{style:{fontSize:"11px",color:"rgba(30, 33, 37, 0.52)"},children:[n.interactions," interactions · ",n.dateRange]})]},n.id))})]}),c&&e.jsxs("div",{style:{marginBottom:"24px",padding:"16px",background:"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"12px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsx(s.CheckCircle2,{size:18,style:{color:"#1F8F5A"}}),e.jsxs("span",{style:{fontSize:"14px",fontWeight:650,color:"rgba(30, 33, 37, 0.92)"},children:["Project Selected: ",c.name]})]}),e.jsx("button",{onClick:()=>t(null),style:{background:"none",border:"none",cursor:"pointer",padding:"4px",display:"flex",alignItems:"center"},children:e.jsx(s.X,{size:16,style:{color:"rgba(30, 33, 37, 0.42)"}})})]}),e.jsxs("div",{style:{fontSize:"13px",color:"rgba(30, 33, 37, 0.65)",lineHeight:1.5},children:[e.jsx("div",{children:c.description}),e.jsxs("div",{style:{marginTop:"4px"},children:[e.jsx("strong",{children:c.interactions})," interactions · ",e.jsx("strong",{children:c.dateRange})]})]})]}),!u&&e.jsxs("div",{style:{marginBottom:"24px"},children:[e.jsx("h3",{style:{fontSize:"15px",fontWeight:650,color:"rgba(30, 33, 37, 0.82)",marginBottom:"12px"},children:"Connect a Data Source:"}),e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"8px"},children:w.map(n=>e.jsx("button",{onClick:()=>R(n.id),disabled:n.status==="coming-soon",style:{padding:"12px 16px",background:n.status==="coming-soon"?"rgba(255, 255, 255, 0.5)":"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"8px",textAlign:"left",cursor:n.status==="coming-soon"?"not-allowed":"pointer",transition:"all 0.15s ease",opacity:n.status==="coming-soon"?.6:1},onMouseEnter:r=>{n.status!=="coming-soon"&&(r.currentTarget.style.background="rgba(255, 255, 255, 0.95)",r.currentTarget.style.borderColor="rgba(52, 58, 64, 0.20)")},onMouseLeave:r=>{n.status!=="coming-soon"&&(r.currentTarget.style.background="rgba(255, 255, 255, 0.85)",r.currentTarget.style.borderColor="rgba(52, 58, 64, 0.12)")},children:e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[e.jsxs("div",{children:[e.jsx("div",{style:{fontSize:"14px",fontWeight:650,color:"rgba(30, 33, 37, 0.92)",marginBottom:"4px"},children:n.name}),e.jsx("div",{style:{fontSize:"12px",color:"rgba(30, 33, 37, 0.62)"},children:n.description})]}),n.status==="coming-soon"&&e.jsx("span",{style:{fontSize:"10px",fontWeight:600,color:"rgba(30, 33, 37, 0.42)",background:"rgba(30, 33, 37, 0.08)",padding:"4px 8px",borderRadius:"4px"},children:"Coming Soon"})]})},n.id))})]}),u&&e.jsxs("div",{style:{marginBottom:"24px",padding:"16px",background:"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"12px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsx(s.CheckCircle2,{size:18,style:{color:"#1F8F5A"}}),e.jsxs("span",{style:{fontSize:"14px",fontWeight:650,color:"rgba(30, 33, 37, 0.92)"},children:["Connected: ",u.name]})]}),e.jsx("button",{onClick:()=>k(null),style:{background:"none",border:"none",cursor:"pointer",padding:"4px",display:"flex",alignItems:"center"},children:e.jsx(s.X,{size:16,style:{color:"rgba(30, 33, 37, 0.42)"}})})]}),e.jsx("div",{style:{fontSize:"13px",color:"rgba(30, 33, 37, 0.65)",lineHeight:1.5},children:u.description})]})]})]})]})}function N({onDismiss:S,onItemClick:h,completedItems:g=[]}){const[d,f]=a.useState(!1),[C,i]=a.useState(null),m=[{id:"name-project",title:"Name your workspace",description:"Give your default project a meaningful name",icon:s.FolderOpen,completed:g.includes("name-project"),optional:!0},{id:"evaluate-second-interaction",title:"Evaluate another interaction",description:"Upload or connect a second interaction to see patterns",icon:s.Sparkles,completed:g.includes("evaluate-second-interaction")},{id:"connect-source",title:"Connect a data source",description:"Link your system or platform for automatic evaluation",icon:s.Link,completed:g.includes("connect-source")},{id:"invite-team",title:"Add teammates",description:"Invite managers or QA team members to collaborate",icon:s.Users,completed:g.includes("invite-team"),optional:!0},{id:"learn-concepts",title:"Understand Chordia concepts",description:"Learn how conditions, evidence, and confidence work",icon:s.BookOpen,completed:g.includes("learn-concepts"),optional:!0},{id:"configure-scope",title:"Clarify evaluation scope",description:"Customize which signals and conditions matter for your team",icon:s.Settings,completed:g.includes("configure-scope"),optional:!0}],u=m.filter(t=>t.completed).length,k=m.length,c=u/k*100;return d?e.jsx("button",{type:"button",onClick:()=>f(!1),style:{width:"100%",padding:"14px 16px",background:"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"12px",cursor:"pointer",textAlign:"left",transition:"all 0.15s ease",boxShadow:"0 2px 8px rgba(30, 33, 37, 0.04)"},onMouseEnter:t=>{t.currentTarget.style.background="rgba(255, 255, 255, 0.95)",t.currentTarget.style.borderColor="rgba(52, 58, 64, 0.18)"},onMouseLeave:t=>{t.currentTarget.style.background="rgba(255, 255, 255, 0.85)",t.currentTarget.style.borderColor="rgba(52, 58, 64, 0.12)"},children:e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:"12px"},children:[e.jsxs("div",{style:{fontSize:"13px",fontWeight:600,color:"rgba(30, 33, 37, 0.75)"},children:["Getting started (",u,"/",k,")"]}),e.jsx(s.ChevronRight,{size:16,style:{color:"rgba(30, 33, 37, 0.42)"}})]})}):e.jsxs("div",{style:{background:"rgba(255, 255, 255, 0.85)",border:"1px solid rgba(52, 58, 64, 0.12)",borderRadius:"16px",overflow:"hidden",boxShadow:"0 4px 16px rgba(30, 33, 37, 0.06)"},children:[e.jsxs("div",{style:{padding:"18px 20px 16px",borderBottom:"1px solid rgba(52, 58, 64, 0.08)"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",justifyContent:"space-between",gap:"12px"},children:[e.jsxs("div",{style:{flex:1},children:[e.jsx("div",{style:{fontSize:"15px",fontWeight:680,letterSpacing:"-0.01em",color:"rgba(30, 33, 37, 0.92)",marginBottom:"6px",lineHeight:1.3},children:"Getting started with Chordia"}),e.jsxs("div",{style:{fontSize:"12px",color:"rgba(30, 33, 37, 0.58)",lineHeight:1.4},children:[u," of ",k," completed"]})]}),e.jsxs("div",{style:{display:"flex",gap:"4px"},children:[e.jsx("button",{type:"button",onClick:()=>f(!0),style:{width:"28px",height:"28px",borderRadius:"6px",background:"transparent",border:"1px solid rgba(52, 58, 64, 0.12)",cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.15s ease",color:"rgba(30, 33, 37, 0.52)"},onMouseEnter:t=>{t.currentTarget.style.background="rgba(231, 212, 162, 0.12)",t.currentTarget.style.borderColor="rgba(52, 58, 64, 0.18)"},onMouseLeave:t=>{t.currentTarget.style.background="transparent",t.currentTarget.style.borderColor="rgba(52, 58, 64, 0.12)"},title:"Collapse",children:e.jsx(s.ChevronRight,{size:14})}),S&&e.jsx("button",{type:"button",onClick:S,style:{width:"28px",height:"28px",borderRadius:"6px",background:"transparent",border:"1px solid rgba(52, 58, 64, 0.12)",cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.15s ease",color:"rgba(30, 33, 37, 0.52)"},onMouseEnter:t=>{t.currentTarget.style.background="rgba(231, 212, 162, 0.12)",t.currentTarget.style.borderColor="rgba(52, 58, 64, 0.18)"},onMouseLeave:t=>{t.currentTarget.style.background="transparent",t.currentTarget.style.borderColor="rgba(52, 58, 64, 0.12)"},title:"Dismiss checklist",children:e.jsx(s.X,{size:14})})]})]}),e.jsx("div",{style:{marginTop:"14px",height:"6px",background:"rgba(30, 33, 37, 0.08)",borderRadius:"999px",overflow:"hidden"},children:e.jsx("div",{style:{height:"100%",width:`${c}%`,background:"linear-gradient(90deg, rgba(184, 156, 106, 0.75) 0%, rgba(139, 157, 127, 0.75) 100%)",borderRadius:"999px",transition:"width 0.4s ease"}})})]}),e.jsx("div",{style:{padding:"8px"},children:m.map((t,b)=>{const w=t.icon,y=C===t.id;return e.jsx("button",{type:"button",onClick:()=>h==null?void 0:h(t.id),onMouseEnter:()=>i(t.id),onMouseLeave:()=>i(null),disabled:t.completed,style:{width:"100%",padding:"12px 14px",background:t.completed?"rgba(139, 157, 127, 0.06)":y?"rgba(231, 212, 162, 0.12)":"transparent",border:"none",borderRadius:"10px",cursor:t.completed?"default":"pointer",textAlign:"left",transition:"all 0.15s ease",marginBottom:b<m.length-1?"4px":"0",opacity:t.completed?.7:1},children:e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",gap:"12px"},children:[e.jsx("div",{style:{width:"20px",height:"20px",marginTop:"1px",flexShrink:0},children:t.completed?e.jsx(s.CheckCircle2,{size:20,style:{color:"rgba(139, 157, 127, 0.75)"}}):e.jsx(s.Circle,{size:20,style:{color:"rgba(30, 33, 37, 0.24)"}})}),e.jsxs("div",{style:{flex:1,minWidth:0},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",marginBottom:"3px"},children:[e.jsx(w,{size:14,style:{color:"rgba(30, 33, 37, 0.52)",flexShrink:0}}),e.jsx("span",{style:{fontSize:"13px",fontWeight:600,color:t.completed?"rgba(30, 33, 37, 0.52)":"rgba(30, 33, 37, 0.85)",textDecoration:t.completed?"line-through":"none",lineHeight:1.3},children:t.title}),t.optional&&!t.completed&&e.jsx("span",{style:{fontSize:"9px",fontWeight:600,letterSpacing:"0.04em",textTransform:"uppercase",color:"rgba(30, 33, 37, 0.42)",background:"rgba(30, 33, 37, 0.06)",padding:"2px 5px",borderRadius:"4px"},children:"Optional"})]}),e.jsx("div",{style:{fontSize:"11.5px",color:"rgba(30, 33, 37, 0.52)",lineHeight:1.4,paddingLeft:"22px"},children:t.description})]}),!t.completed&&y&&e.jsx(s.ChevronRight,{size:16,style:{color:"rgba(30, 33, 37, 0.32)",marginTop:"2px",flexShrink:0}})]})},t.id)})}),e.jsx("div",{style:{padding:"12px 20px 16px",borderTop:"1px solid rgba(52, 58, 64, 0.08)"},children:e.jsxs("div",{style:{fontSize:"11px",color:"rgba(30, 33, 37, 0.52)",lineHeight:1.5,fontStyle:"italic"},children:["You can dismiss this checklist anytime. These steps help you get the most from Chordia, but ","aren't"," required."]})})]})}function Q({text:S="Demo Project",accentColor:h="#B89C6A",textColor:g="rgba(255, 255, 255, 0.95)",size:d="medium",position:f="fixed"}){const i={small:{width:140,height:140,fontSize:"11px",letterSpacing:"0.08em",fontWeight:650},medium:{width:180,height:180,fontSize:"12px",letterSpacing:"0.1em",fontWeight:680},large:{width:220,height:220,fontSize:"13px",letterSpacing:"0.12em",fontWeight:700}}[d];return e.jsxs("div",{style:{position:f,top:0,right:0,width:i.width,height:i.height,overflow:"hidden",zIndex:f==="fixed"?9999:1,pointerEvents:"none"},children:[e.jsx("div",{style:{position:"absolute",top:0,right:0,width:0,height:0,borderStyle:"solid",borderWidth:`0 ${i.width}px ${i.height}px 0`,borderColor:`transparent ${h} transparent transparent`,opacity:.92}}),e.jsx("div",{style:{position:"absolute",top:0,right:0,width:0,height:0,borderStyle:"solid",borderWidth:`0 ${i.width}px ${i.height}px 0`,borderColor:"transparent rgba(0, 0, 0, 0.08) transparent transparent"}}),e.jsx("div",{style:{position:"absolute",top:d==="small"?"28px":d==="medium"?"38px":"48px",right:d==="small"?"-32px":d==="medium"?"-42px":"-52px",width:d==="small"?"160px":d==="medium"?"200px":"240px",transform:"rotate(45deg)",transformOrigin:"center",textAlign:"center"},children:e.jsx("div",{style:{fontSize:i.fontSize,fontWeight:i.fontWeight,letterSpacing:i.letterSpacing,textTransform:"uppercase",color:g,textShadow:"0 1px 2px rgba(0, 0, 0, 0.15)",whiteSpace:"nowrap",userSelect:"none"},children:S})}),e.jsx("div",{style:{position:"absolute",top:0,right:0,width:i.width,height:i.height,background:"linear-gradient(135deg, transparent 0%, rgba(0, 0, 0, 0.04) 100%)",pointerEvents:"none"}})]})}const V="../../assets/chordia-logo.png";function Z({title:S="Chordia",subtitle:h="Sign in to continue",logo:g,onLogin:d,loading:f=!1,error:C=null,footer:i,showLabels:m=!0,emailPlaceholder:u="you@company.com",passwordPlaceholder:k="Password",onForgotPassword:c,compact:t=!1}){const[b,w]=a.useState(""),[y,T]=a.useState(""),[R,M]=a.useState(!1),[l,v]=a.useState(null),z=o=>{o.preventDefault(),!(!b||!y||f)&&(d==null||d(b,y))},j=b&&y&&!f,n="var(--rail-compliance)",r="201, 138, 90",x=e.jsxs("div",{style:{width:"100%",maxWidth:400,background:"var(--paper-elevated)",border:"1px solid var(--border)",borderRadius:"var(--radius-lg)",padding:"44px 36px 36px",boxShadow:"0 8px 32px rgba(30, 33, 37, 0.06), 0 1px 3px rgba(30, 33, 37, 0.04)",position:"relative",overflow:"hidden"},children:[e.jsx("div",{style:{position:"absolute",top:0,left:0,right:0,height:3,background:`linear-gradient(90deg, var(--state-unknown), ${n})`,opacity:.6}}),e.jsx("div",{style:{textAlign:"center",marginBottom:32},children:g||e.jsxs(e.Fragment,{children:[e.jsx("div",{style:{display:"inline-flex",alignItems:"center",justifyContent:"center",padding:"12px 24px",borderRadius:"var(--radius-lg)",background:"rgba(30, 33, 37, 0.92)",marginBottom:16},children:e.jsx("img",{src:V,alt:S,style:{height:28,display:"block"}})}),h&&e.jsx("p",{style:{fontSize:"var(--text-sm)",color:"var(--text-muted)",marginTop:4,marginBottom:0},children:h})]})}),e.jsxs("form",{onSubmit:z,children:[e.jsxs("div",{style:{marginBottom:18},children:[m&&e.jsx("label",{style:{display:"block",fontSize:"var(--text-sm)",fontWeight:550,color:"var(--text-strong)",marginBottom:6,fontFamily:"var(--font-sans)"},children:"Email"}),e.jsxs("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[e.jsx(s.Mail,{size:15,style:{position:"absolute",left:12,color:l==="email"?`rgba(${r}, 0.7)`:"var(--text-faint)",pointerEvents:"none",transition:"color 0.2s ease"}}),e.jsx("input",{type:"email",value:b,onChange:o=>w(o.target.value),placeholder:u,required:!0,autoFocus:!0,autoComplete:"email",style:{width:"100%",padding:"11px 12px 11px 38px",fontSize:"var(--text-md)",border:"1px solid",borderColor:l==="email"?n:"var(--border)",borderRadius:"var(--radius)",backgroundColor:l==="email"?"rgba(255,255,255,0.95)":"var(--paper)",color:"var(--text-ink)",fontFamily:"var(--font-sans)",outline:"none",transition:"border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease",boxShadow:l==="email"?`0 0 0 3px rgba(${r}, 0.1)`:"none"},onFocus:()=>v("email"),onBlur:()=>v(null)})]})]}),e.jsxs("div",{style:{marginBottom:6},children:[m&&e.jsx("label",{style:{display:"block",fontSize:"var(--text-sm)",fontWeight:550,color:"var(--text-strong)",marginBottom:6,fontFamily:"var(--font-sans)"},children:"Password"}),e.jsxs("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[e.jsx(s.Lock,{size:15,style:{position:"absolute",left:12,color:l==="password"?`rgba(${r}, 0.7)`:"var(--text-faint)",pointerEvents:"none",transition:"color 0.2s ease"}}),e.jsx("input",{type:R?"text":"password",value:y,onChange:o=>T(o.target.value),placeholder:k,required:!0,autoComplete:"current-password",style:{width:"100%",padding:"11px 42px 11px 38px",fontSize:"var(--text-md)",border:"1px solid",borderColor:l==="password"?n:"var(--border)",borderRadius:"var(--radius)",backgroundColor:l==="password"?"rgba(255,255,255,0.95)":"var(--paper)",color:"var(--text-ink)",fontFamily:"var(--font-sans)",outline:"none",transition:"border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease",boxShadow:l==="password"?`0 0 0 3px rgba(${r}, 0.1)`:"none"},onFocus:()=>v("password"),onBlur:()=>v(null)}),e.jsx("button",{type:"button",onClick:()=>M(!R),style:{position:"absolute",right:8,background:"none",border:"none",padding:4,cursor:"pointer",color:"var(--text-faint)",display:"flex",alignItems:"center",transition:"color 0.15s ease",borderRadius:"var(--radius-sm)"},tabIndex:-1,onMouseEnter:o=>{o.currentTarget.style.color="var(--text-muted)"},onMouseLeave:o=>{o.currentTarget.style.color="var(--text-faint)"},children:R?e.jsx(s.EyeOff,{size:16}):e.jsx(s.Eye,{size:16})})]})]}),c&&e.jsx("div",{style:{textAlign:"right",marginBottom:4},children:e.jsx("button",{type:"button",onClick:c,style:{background:"none",border:"none",padding:"2px 0",fontSize:"var(--text-xs)",color:"var(--text-muted)",cursor:"pointer",fontFamily:"var(--font-sans)",transition:"color 0.15s ease"},onMouseEnter:o=>{o.currentTarget.style.color="var(--text-strong)"},onMouseLeave:o=>{o.currentTarget.style.color="var(--text-muted)"},children:"Forgot password?"})}),C&&e.jsx("div",{style:{fontSize:"var(--text-sm)",color:"var(--text-strong)",marginTop:12,padding:"8px 12px",background:"color-mix(in srgb, var(--state-unknown) 10%, transparent)",border:"1px solid color-mix(in srgb, var(--state-unknown) 25%, transparent)",borderRadius:"var(--radius-sm)",textAlign:"center",fontWeight:500},children:C}),e.jsx("button",{type:"submit",disabled:!j,style:{width:"100%",padding:"11px 0",marginTop:20,background:j?"var(--text-ink)":"var(--text-xfaint)",color:"#ffffff",border:"none",borderRadius:"var(--radius)",fontSize:"var(--text-md)",fontWeight:600,fontFamily:"var(--font-sans)",cursor:j?"pointer":"not-allowed",transition:"opacity 0.15s ease, transform 0.1s ease",display:"flex",alignItems:"center",justifyContent:"center",gap:8},onMouseEnter:o=>{j&&(o.currentTarget.style.opacity="0.85",o.currentTarget.style.transform="translateY(-1px)")},onMouseLeave:o=>{o.currentTarget.style.opacity="1",o.currentTarget.style.transform="translateY(0)"},onMouseDown:o=>{j&&(o.currentTarget.style.transform="translateY(0)")},onMouseUp:o=>{j&&(o.currentTarget.style.transform="translateY(-1px)")},children:f?"Signing in…":e.jsxs(e.Fragment,{children:["Sign In",e.jsx(s.ArrowRight,{size:16})]})})]}),i&&e.jsxs(e.Fragment,{children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:12,margin:"24px 0 16px"},children:[e.jsx("div",{style:{flex:1,height:1,background:"var(--border)"}}),e.jsx("span",{style:{fontSize:"var(--text-xs)",color:"var(--text-faint)"},children:"or"}),e.jsx("div",{style:{flex:1,height:1,background:"var(--border)"}})]}),e.jsx("div",{style:{textAlign:"center",fontSize:"var(--text-xs)",color:"var(--text-faint)"},children:i})]})]});return t?x:e.jsx("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",minHeight:"100vh",background:"var(--bg-chordia)",padding:"var(--spacing-6)"},children:x})}function _({left:S,right:h,defaultWidth:g=260,defaultRatio:d,minWidth:f=180,maxWidth:C=450,minRatio:i,maxRatio:m,collapsedWidth:u=0,collapsed:k,onCollapsedChange:c,collapseSide:t="left",collapseThreshold:b,dividerWidth:w=7,style:y}){const T=k!==void 0,[R,M]=a.useState(!1),l=T?k:R,v=a.useCallback(p=>{const B=typeof p=="function"?p(l):p;T||M(B),c==null||c(B)},[T,l,c]),z=a.useRef(null),[j,n]=a.useState(0),[r,x]=a.useState(g),[o,W]=a.useState(!1),[$,O]=a.useState(!1),E=a.useRef(0),L=a.useRef(0);a.useLayoutEffect(()=>{if(!z.current)return;const p=z.current.offsetWidth;n(p),!$&&p>0&&(d!=null&&x(Math.round(p*d)),O(!0))},[]),a.useEffect(()=>{if(!z.current)return;const p=new ResizeObserver(B=>{for(const F of B)n(F.contentRect.width)});return p.observe(z.current),()=>p.disconnect()},[]);const I=i!=null?Math.round(j*i):f,D=m!=null?Math.round(j*m):C,P=b??(t==="none"?0:I-40),U=a.useCallback(p=>{p.preventDefault(),E.current=p.clientX,L.current=l?u:r,W(!0)},[r,l,u]);a.useEffect(()=>{if(!o)return;const p=F=>{const q=F.clientX-E.current,H=L.current+q;if((t==="left"||t==="both")&&H<P){l||v(!0);return}l&&v(!1),x(Math.min(Math.max(H,I),D))},B=()=>W(!1);return document.addEventListener("mousemove",p),document.addEventListener("mouseup",B),document.body.style.userSelect="none",document.body.style.cursor="col-resize",()=>{document.removeEventListener("mousemove",p),document.removeEventListener("mouseup",B),document.body.style.userSelect="",document.body.style.cursor=""}},[o,l,I,D,P,j,w,t,v]);const Y=a.useCallback(()=>{t!=="none"&&v(p=>!p)},[v,t]),A=l?u:r;return e.jsxs("div",{ref:z,style:{display:"flex",height:"100%",overflow:"hidden",position:"relative",...y},children:[(A>0||!l)&&e.jsx("div",{style:{width:A,flexShrink:0,overflow:"hidden",transition:o?"none":"width 0.2s ease",height:"100%"},children:!l&&S}),e.jsxs("div",{onMouseDown:U,onDoubleClick:Y,style:{width:`${w}px`,flexShrink:0,cursor:"col-resize",display:"flex",alignItems:"center",justifyContent:"center",position:"relative",zIndex:2},children:[e.jsx("div",{style:{width:"1px",height:"100%",background:o?"var(--rail-discovery, #5E88B0)":"var(--border, rgba(52,58,64,0.12))",transition:"background 0.15s ease"}}),e.jsx("div",{style:{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",width:"5px",height:"28px",borderRadius:"3px",background:o?"var(--rail-discovery, #5E88B0)":"var(--border, rgba(52,58,64,0.12))",opacity:o?1:0,transition:"opacity 0.15s ease, background 0.15s ease"},className:"splitpane-grip"}),e.jsx("style",{children:`
           div:hover > .splitpane-grip { opacity: 0.7 !important; }
-        `})]}),e.jsx("div",{style:{flex:1,minWidth:0,overflow:"hidden",height:"100%"},children:u})]})}exports.DemoProjectBanner=N;exports.FirstCallScreen=X;exports.IntegrationCard=Q;exports.LoginForm=Z;exports.OnboardingChecklist=G;exports.SplitPane=_;
+        `})]}),e.jsx("div",{style:{flex:1,minWidth:0,overflow:"hidden",height:"100%"},children:h})]})}exports.IntegrationCard=X.IntegrationCard;exports.DemoProjectBanner=Q;exports.FirstCallScreen=G;exports.LoginForm=Z;exports.OnboardingChecklist=N;exports.SplitPane=_;
 //# sourceMappingURL=layout.cjs.js.map