chordia-ui 3.9.6 → 3.9.8

package/dist/IntegrationCard.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const e=require("react/jsx-runtime");require("react");const r=require("lucide-react");function u({providerName:l,description:p,status:o="available",logoUrl:s,icon:c,onConnect:a,onConfigure:d}){const x=o==="connected",n=o==="coming-soon",g={connected:{label:"Connected",color:"var(--Grey-White, #FFF)",bgColor:"var(--Green-Primary, #00A66E)",icon:e.jsx(r.CheckCircle2,{size:16,strokeWidth:2,color:"#FFF"}),actionLabel:"Disconnect",actionFilled:!1},available:{label:"Available",color:"var(--Grey-Strong, #808183)",icon:e.jsx(r.CloudDownload,{size:16,strokeWidth:2}),actionLabel:"Connect",actionFilled:!0},"coming-soon":{label:"Coming Soon",color:"var(--Grey-Muted, #B2AEA8)",icon:e.jsx(r.CloudOff,{size:16,strokeWidth:2}),actionLabel:"Connect",actionFilled:!1}},t=g[o]||g.available;return e.jsxs("div",{style:{display:"flex",width:"317px",height:"160px",padding:"16px",flexDirection:"column",alignItems:"flex-start",gap:"10px",borderRadius:"4px",border:"1px solid #D9D9D9",background:"var(--Base-White, #FFF)"},children:[e.jsxs("div",{style:{flex:1,width:"100%"},children:[e.jsx("div",{style:{marginBottom:"4px"},children:s?e.jsx("img",{src:s,alt:l,style:{height:"24px",objectFit:"contain"}}):c?e.jsx("div",{style:{display:"flex",alignItems:"center"},children:c}):e.jsx("h3",{style:{fontSize:"16px",fontWeight:700,color:"var(--Base-Strong, #1E2125)",margin:0,lineHeight:1.3},children:l})}),e.jsx("p",{style:{fontSize:"13px",lineHeight:1.4,color:"var(--Grey-Strong, #808183)",margin:0},children:p})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",padding:t.bgColor?"4px 8px 4px 6px":"0",alignItems:"center",gap:"4px",borderRadius:t.bgColor?"16px":"0",background:t.bgColor||"transparent",fontSize:"12px",fontStyle:"normal",fontWeight:400,lineHeight:"16px",color:t.color},children:[t.icon,t.label]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[x&&d&&e.jsx("button",{onClick:i=>{i.stopPropagation(),d()},style:{display:"flex",alignItems:"center",justifyContent:"center",width:"32px",height:"32px",border:"none",background:"transparent",color:"var(--Grey-Strong, #808183)",cursor:"pointer",borderRadius:"4px",transition:"background 0.15s ease"},onMouseEnter:i=>{i.currentTarget.style.background="rgba(0,0,0,0.04)"},onMouseLeave:i=>{i.currentTarget.style.background="transparent"},children:e.jsx(r.Settings2,{size:20,strokeWidth:2})}),e.jsx("button",{onClick:i=>{i.stopPropagation(),a==null||a()},disabled:n,style:{display:"flex",height:"28px",padding:"10px",justifyContent:"center",alignItems:"center",gap:"10px",borderRadius:"10px",border:t.actionFilled?"1px solid transparent":"1px solid #D9D9D9",background:n?"var(--Grey-Muted, #B2AEA8)":t.actionFilled?"var(--Base-Strong, #1E2125)":"var(--Base-White, #FFF)",color:t.actionFilled||n?"#FFF":"var(--Base-Strong, #1E2125)",fontSize:"13px",fontWeight:600,cursor:n?"default":"pointer",opacity:n?.6:1,transition:"all 0.15s ease",lineHeight:1.4},onMouseEnter:i=>{!n&&!t.actionFilled&&(i.currentTarget.style.background="rgba(0,0,0,0.04)")},onMouseLeave:i=>{!n&&!t.actionFilled&&(i.currentTarget.style.background="var(--Base-White, #FFF)")},children:t.actionLabel})]})]})]})}exports.IntegrationCard=u;
+"use strict";const e=require("react/jsx-runtime");require("react");const i=require("lucide-react");function u({providerName:l,description:x,status:n="available",logoUrl:s,icon:c,onConnect:a,onConfigure:d}){const p=n==="connected",o=n==="coming-soon",g={connected:{label:"Connected",color:"var(--Grey-White, #FFF)",bgColor:"var(--Green-Primary, #00A66E)",icon:e.jsx(i.CheckCircle2,{size:16,strokeWidth:2,color:"#FFF"}),actionLabel:"Disconnect",actionFilled:!1},available:{label:"Available",color:"var(--Grey-Strong, #808183)",icon:e.jsx(i.CloudDownload,{size:16,strokeWidth:2}),actionLabel:"Connect",actionFilled:!0},"coming-soon":{label:"Coming Soon",color:"var(--Grey-Muted, #B2AEA8)",icon:e.jsx(i.CloudOff,{size:16,strokeWidth:2}),actionLabel:"Connect",actionFilled:!1}},t=g[n]||g.available;return e.jsxs("div",{style:{display:"flex",width:"317px",height:"160px",padding:"16px",flexDirection:"column",alignItems:"flex-start",gap:"10px",borderRadius:"4px",border:"1px solid #D9D9D9",background:"var(--Base-White, #FFF)"},children:[e.jsxs("div",{style:{flex:1,width:"100%"},children:[e.jsx("div",{style:{marginBottom:"4px"},children:s?e.jsx("img",{src:s,alt:l,style:{height:"24px",objectFit:"contain"}}):c?e.jsx("div",{style:{display:"flex",alignItems:"center"},children:c}):e.jsx("h3",{style:{fontSize:"16px",fontWeight:700,color:"var(--Base-Strong, #1E2125)",margin:0,lineHeight:1.3},children:l})}),e.jsx("p",{style:{fontSize:"13px",lineHeight:1.4,color:"var(--Grey-Strong, #808183)",margin:0},children:x})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",padding:t.bgColor?"4px 8px 4px 6px":"0",alignItems:"center",gap:"4px",borderRadius:t.bgColor?"16px":"0",background:t.bgColor||"transparent",fontSize:"12px",fontStyle:"normal",fontWeight:400,lineHeight:"16px",color:t.color},children:[t.icon,t.label]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[p&&d&&e.jsx("button",{type:"button",title:"Configure","aria-label":"Configure",onClick:r=>{r.stopPropagation(),d()},style:{display:"flex",alignItems:"center",justifyContent:"center",width:"30px",height:"30px",border:"1px solid var(--neutral-100, #E6E6E6)",background:"var(--grey-white, #FFF)",color:"var(--Grey-Strong, #808183)",cursor:"pointer",borderRadius:"8px",transition:"background 0.15s ease, border-color 0.15s ease, color 0.15s ease"},onMouseEnter:r=>{r.currentTarget.style.background="var(--surface-hover, #F3F7F7)",r.currentTarget.style.borderColor="var(--neutral-250, #BFBFBF)",r.currentTarget.style.color="var(--Grey-Strong, #2E3236)"},onMouseLeave:r=>{r.currentTarget.style.background="var(--grey-white, #FFF)",r.currentTarget.style.borderColor="var(--neutral-100, #E6E6E6)",r.currentTarget.style.color="var(--Grey-Strong, #808183)"},children:e.jsx(i.Settings2,{size:16,strokeWidth:2})}),e.jsx("button",{onClick:r=>{r.stopPropagation(),a==null||a()},disabled:o,style:{display:"flex",height:"28px",padding:"10px",justifyContent:"center",alignItems:"center",gap:"10px",borderRadius:"10px",border:t.actionFilled?"1px solid transparent":"1px solid #D9D9D9",background:o?"var(--Grey-Muted, #B2AEA8)":t.actionFilled?"var(--Base-Strong, #1E2125)":"var(--Base-White, #FFF)",color:t.actionFilled||o?"#FFF":"var(--Base-Strong, #1E2125)",fontSize:"13px",fontWeight:600,cursor:o?"default":"pointer",opacity:o?.6:1,transition:"all 0.15s ease",lineHeight:1.4},onMouseEnter:r=>{!o&&!t.actionFilled&&(r.currentTarget.style.background="rgba(0,0,0,0.04)")},onMouseLeave:r=>{!o&&!t.actionFilled&&(r.currentTarget.style.background="var(--Base-White, #FFF)")},children:t.actionLabel})]})]})]})}exports.IntegrationCard=u;
 //# sourceMappingURL=IntegrationCard.cjs.js.map

package/dist/IntegrationCard.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"IntegrationCard.cjs.js","sources":["../src/components/layout/IntegrationCard.jsx"],"sourcesContent":["\"use client\";\n\nimport React from \"react\";\nimport { CheckCircle2, Settings2, CloudOff, CloudDownload } from \"lucide-react\";\n\n/**\n * IntegrationCard Component\n * Displays an integration provider card with status, logo, and configuration options\n *\n * Props:\n *  - providerName   string      Provider display name\n *  - description    string      Short description / subtitle\n *  - status         string      \"available\" | \"connected\" | \"coming-soon\"\n *  - logoUrl        string      Optional logo image URL\n *  - icon           ReactNode   Optional custom icon/logo element\n *  - onConnect      function    Connect/Disconnect callback\n *  - onConfigure    function    Configure (settings) callback — shown for connected\n */\nexport default function IntegrationCard({\n  providerName,\n  description,\n  status = \"available\",\n  logoUrl,\n  icon,\n  onConnect,\n  onConfigure,\n}) {\n  const isConnected = status === \"connected\";\n  const isComingSoon = status === \"coming-soon\";\n\n  const statusConfig = {\n    connected: {\n      label: \"Connected\",\n      color: \"var(--Grey-White, #FFF)\",\n      bgColor: \"var(--Green-Primary, #00A66E)\",\n      icon: <CheckCircle2 size={16} strokeWidth={2} color=\"#FFF\" />,\n      actionLabel: \"Disconnect\",\n      actionFilled: false,\n    },\n    available: {\n      label: \"Available\",\n      color: \"var(--Grey-Strong, #808183)\",\n      icon: <CloudDownload size={16} strokeWidth={2} />,\n      actionLabel: \"Connect\",\n      actionFilled: true,\n    },\n    \"coming-soon\": {\n      label: \"Coming Soon\",\n      color: \"var(--Grey-Muted, #B2AEA8)\",\n      icon: <CloudOff size={16} strokeWidth={2} />,\n      actionLabel: \"Connect\",\n      actionFilled: false,\n    },\n  };\n\n  const config = statusConfig[status] || statusConfig.available;\n\n  return (\n    <div\n      style={{\n        display: \"flex\",\n        width: \"317px\",\n        height: \"160px\",\n        padding: \"16px\",\n        flexDirection: \"column\",\n        alignItems: \"flex-start\",\n        gap: \"10px\",\n        borderRadius: \"4px\",\n        border: \"1px solid #D9D9D9\",\n        background: \"var(--Base-White, #FFF)\",\n      }}\n    >\n      {/* Top: Name + Description */}\n      <div style={{ flex: 1, width: \"100%\" }}>\n        {/* Provider Name / Logo */}\n        <div style={{ marginBottom: \"4px\" }}>\n          {logoUrl ? (\n            <img\n              src={logoUrl}\n              alt={providerName}\n              style={{ height: \"24px\", objectFit: \"contain\" }}\n            />\n          ) : icon ? (\n            <div style={{ display: \"flex\", alignItems: \"center\" }}>{icon}</div>\n          ) : (\n            <h3\n              style={{\n                fontSize: \"16px\",\n                fontWeight: 700,\n                color: \"var(--Base-Strong, #1E2125)\",\n                margin: 0,\n                lineHeight: 1.3,\n              }}\n            >\n              {providerName}\n            </h3>\n          )}\n        </div>\n        {/* Description */}\n        <p\n          style={{\n            fontSize: \"13px\",\n            lineHeight: 1.4,\n            color: \"var(--Grey-Strong, #808183)\",\n            margin: 0,\n          }}\n        >\n          {description}\n        </p>\n      </div>\n\n      {/* Bottom: Status + Actions */}\n      <div\n        style={{\n          display: \"flex\",\n          alignItems: \"center\",\n          justifyContent: \"space-between\",\n          width: \"100%\",\n          gap: \"8px\",\n        }}\n      >\n        {/* Status label */}\n        <div\n          style={{\n            display: \"flex\",\n            padding: config.bgColor ? \"4px 8px 4px 6px\" : \"0\",\n            alignItems: \"center\",\n            gap: \"4px\",\n            borderRadius: config.bgColor ? \"16px\" : \"0\",\n            background: config.bgColor || \"transparent\",\n            fontSize: \"12px\",\n            fontStyle: \"normal\",\n            fontWeight: 400,\n            lineHeight: \"16px\",\n            color: config.color,\n          }}\n        >\n          {config.icon}\n          {config.label}\n        </div>\n\n        {/* Action area */}\n        <div style={{ display: \"flex\", alignItems: \"center\", gap: \"8px\" }}>\n          {/* Settings icon for connected */}\n          {isConnected && onConfigure && (\n            <button\n              onClick={(e) => {\n                e.stopPropagation();\n                onConfigure();\n              }}\n              style={{\n                display: \"flex\",\n                alignItems: \"center\",\n                justifyContent: \"center\",\n                width: \"32px\",\n                height: \"32px\",\n                border: \"none\",\n                background: \"transparent\",\n                color: \"var(--Grey-Strong, #808183)\",\n                cursor: \"pointer\",\n                borderRadius: \"4px\",\n                transition: \"background 0.15s ease\",\n              }}\n              onMouseEnter={(e) => {\n                e.currentTarget.style.background = \"rgba(0,0,0,0.04)\";\n              }}\n              onMouseLeave={(e) => {\n                e.currentTarget.style.background = \"transparent\";\n              }}\n            >\n              <Settings2 size={20} strokeWidth={2} />\n            </button>\n          )}\n\n          {/* Connect / Disconnect button */}\n          <button\n            onClick={(e) => {\n              e.stopPropagation();\n              onConnect?.();\n            }}\n            disabled={isComingSoon}\n            style={{\n              display: \"flex\",\n              height: \"28px\",\n              padding: \"10px\",\n              justifyContent: \"center\",\n              alignItems: \"center\",\n              gap: \"10px\",\n              borderRadius: \"10px\",\n              border: config.actionFilled\n                ? \"1px solid transparent\"\n                : \"1px solid #D9D9D9\",\n              background: isComingSoon\n                ? \"var(--Grey-Muted, #B2AEA8)\"\n                : config.actionFilled\n                ? \"var(--Base-Strong, #1E2125)\"\n                : \"var(--Base-White, #FFF)\",\n              color: config.actionFilled || isComingSoon\n                ? \"#FFF\"\n                : \"var(--Base-Strong, #1E2125)\",\n              fontSize: \"13px\",\n              fontWeight: 600,\n              cursor: isComingSoon ? \"default\" : \"pointer\",\n              opacity: isComingSoon ? 0.6 : 1,\n              transition: \"all 0.15s ease\",\n              lineHeight: 1.4,\n            }}\n            onMouseEnter={(e) => {\n              if (!isComingSoon && !config.actionFilled) {\n                e.currentTarget.style.background = \"rgba(0,0,0,0.04)\";\n              }\n            }}\n            onMouseLeave={(e) => {\n              if (!isComingSoon && !config.actionFilled) {\n                e.currentTarget.style.background = \"var(--Base-White, #FFF)\";\n              }\n            }}\n          >\n            {config.actionLabel}\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["IntegrationCard","providerName","description","status","logoUrl","icon","onConnect","onConfigure","isConnected","isComingSoon","statusConfig","CheckCircle2","jsx","CloudDownload","CloudOff","config","jsxs","e","Settings2"],"mappings":"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"}
+{"version":3,"file":"IntegrationCard.cjs.js","sources":["../src/components/layout/IntegrationCard.jsx"],"sourcesContent":["\"use client\";\n\nimport React from \"react\";\nimport { CheckCircle2, Settings2, CloudOff, CloudDownload } from \"lucide-react\";\n\n/**\n * IntegrationCard Component\n * Displays an integration provider card with status, logo, and configuration options\n *\n * Props:\n *  - providerName   string      Provider display name\n *  - description    string      Short description / subtitle\n *  - status         string      \"available\" | \"connected\" | \"coming-soon\"\n *  - logoUrl        string      Optional logo image URL\n *  - icon           ReactNode   Optional custom icon/logo element\n *  - onConnect      function    Connect/Disconnect callback\n *  - onConfigure    function    Configure (settings) callback — shown for connected\n */\nexport default function IntegrationCard({\n  providerName,\n  description,\n  status = \"available\",\n  logoUrl,\n  icon,\n  onConnect,\n  onConfigure,\n}) {\n  const isConnected = status === \"connected\";\n  const isComingSoon = status === \"coming-soon\";\n\n  const statusConfig = {\n    connected: {\n      label: \"Connected\",\n      color: \"var(--Grey-White, #FFF)\",\n      bgColor: \"var(--Green-Primary, #00A66E)\",\n      icon: <CheckCircle2 size={16} strokeWidth={2} color=\"#FFF\" />,\n      actionLabel: \"Disconnect\",\n      actionFilled: false,\n    },\n    available: {\n      label: \"Available\",\n      color: \"var(--Grey-Strong, #808183)\",\n      icon: <CloudDownload size={16} strokeWidth={2} />,\n      actionLabel: \"Connect\",\n      actionFilled: true,\n    },\n    \"coming-soon\": {\n      label: \"Coming Soon\",\n      color: \"var(--Grey-Muted, #B2AEA8)\",\n      icon: <CloudOff size={16} strokeWidth={2} />,\n      actionLabel: \"Connect\",\n      actionFilled: false,\n    },\n  };\n\n  const config = statusConfig[status] || statusConfig.available;\n\n  return (\n    <div\n      style={{\n        display: \"flex\",\n        width: \"317px\",\n        height: \"160px\",\n        padding: \"16px\",\n        flexDirection: \"column\",\n        alignItems: \"flex-start\",\n        gap: \"10px\",\n        borderRadius: \"4px\",\n        border: \"1px solid #D9D9D9\",\n        background: \"var(--Base-White, #FFF)\",\n      }}\n    >\n      {/* Top: Name + Description */}\n      <div style={{ flex: 1, width: \"100%\" }}>\n        {/* Provider Name / Logo */}\n        <div style={{ marginBottom: \"4px\" }}>\n          {logoUrl ? (\n            <img\n              src={logoUrl}\n              alt={providerName}\n              style={{ height: \"24px\", objectFit: \"contain\" }}\n            />\n          ) : icon ? (\n            <div style={{ display: \"flex\", alignItems: \"center\" }}>{icon}</div>\n          ) : (\n            <h3\n              style={{\n                fontSize: \"16px\",\n                fontWeight: 700,\n                color: \"var(--Base-Strong, #1E2125)\",\n                margin: 0,\n                lineHeight: 1.3,\n              }}\n            >\n              {providerName}\n            </h3>\n          )}\n        </div>\n        {/* Description */}\n        <p\n          style={{\n            fontSize: \"13px\",\n            lineHeight: 1.4,\n            color: \"var(--Grey-Strong, #808183)\",\n            margin: 0,\n          }}\n        >\n          {description}\n        </p>\n      </div>\n\n      {/* Bottom: Status + Actions */}\n      <div\n        style={{\n          display: \"flex\",\n          alignItems: \"center\",\n          justifyContent: \"space-between\",\n          width: \"100%\",\n          gap: \"8px\",\n        }}\n      >\n        {/* Status label */}\n        <div\n          style={{\n            display: \"flex\",\n            padding: config.bgColor ? \"4px 8px 4px 6px\" : \"0\",\n            alignItems: \"center\",\n            gap: \"4px\",\n            borderRadius: config.bgColor ? \"16px\" : \"0\",\n            background: config.bgColor || \"transparent\",\n            fontSize: \"12px\",\n            fontStyle: \"normal\",\n            fontWeight: 400,\n            lineHeight: \"16px\",\n            color: config.color,\n          }}\n        >\n          {config.icon}\n          {config.label}\n        </div>\n\n        {/* Action area */}\n        <div style={{ display: \"flex\", alignItems: \"center\", gap: \"8px\" }}>\n          {/* Settings icon for connected — a bordered, clickable button with a\n              native \"Configure\" tooltip on hover. */}\n          {isConnected && onConfigure && (\n            <button\n              type=\"button\"\n              title=\"Configure\"\n              aria-label=\"Configure\"\n              onClick={(e) => {\n                e.stopPropagation();\n                onConfigure();\n              }}\n              style={{\n                display: \"flex\",\n                alignItems: \"center\",\n                justifyContent: \"center\",\n                width: \"30px\",\n                height: \"30px\",\n                border: \"1px solid var(--neutral-100, #E6E6E6)\",\n                background: \"var(--grey-white, #FFF)\",\n                color: \"var(--Grey-Strong, #808183)\",\n                cursor: \"pointer\",\n                borderRadius: \"8px\",\n                transition: \"background 0.15s ease, border-color 0.15s ease, color 0.15s ease\",\n              }}\n              onMouseEnter={(e) => {\n                e.currentTarget.style.background = \"var(--surface-hover, #F3F7F7)\";\n                e.currentTarget.style.borderColor = \"var(--neutral-250, #BFBFBF)\";\n                e.currentTarget.style.color = \"var(--Grey-Strong, #2E3236)\";\n              }}\n              onMouseLeave={(e) => {\n                e.currentTarget.style.background = \"var(--grey-white, #FFF)\";\n                e.currentTarget.style.borderColor = \"var(--neutral-100, #E6E6E6)\";\n                e.currentTarget.style.color = \"var(--Grey-Strong, #808183)\";\n              }}\n            >\n              <Settings2 size={16} strokeWidth={2} />\n            </button>\n          )}\n\n          {/* Connect / Disconnect button */}\n          <button\n            onClick={(e) => {\n              e.stopPropagation();\n              onConnect?.();\n            }}\n            disabled={isComingSoon}\n            style={{\n              display: \"flex\",\n              height: \"28px\",\n              padding: \"10px\",\n              justifyContent: \"center\",\n              alignItems: \"center\",\n              gap: \"10px\",\n              borderRadius: \"10px\",\n              border: config.actionFilled\n                ? \"1px solid transparent\"\n                : \"1px solid #D9D9D9\",\n              background: isComingSoon\n                ? \"var(--Grey-Muted, #B2AEA8)\"\n                : config.actionFilled\n                ? \"var(--Base-Strong, #1E2125)\"\n                : \"var(--Base-White, #FFF)\",\n              color: config.actionFilled || isComingSoon\n                ? \"#FFF\"\n                : \"var(--Base-Strong, #1E2125)\",\n              fontSize: \"13px\",\n              fontWeight: 600,\n              cursor: isComingSoon ? \"default\" : \"pointer\",\n              opacity: isComingSoon ? 0.6 : 1,\n              transition: \"all 0.15s ease\",\n              lineHeight: 1.4,\n            }}\n            onMouseEnter={(e) => {\n              if (!isComingSoon && !config.actionFilled) {\n                e.currentTarget.style.background = \"rgba(0,0,0,0.04)\";\n              }\n            }}\n            onMouseLeave={(e) => {\n              if (!isComingSoon && !config.actionFilled) {\n                e.currentTarget.style.background = \"var(--Base-White, #FFF)\";\n              }\n            }}\n          >\n            {config.actionLabel}\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["IntegrationCard","providerName","description","status","logoUrl","icon","onConnect","onConfigure","isConnected","isComingSoon","statusConfig","CheckCircle2","jsx","CloudDownload","CloudOff","config","jsxs","e","Settings2"],"mappings":"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"}

package/dist/IntegrationCard.es.js

@@ -1,40 +1,40 @@
-import { jsxs as o, jsx as i } from "react/jsx-runtime";
+import { jsxs as i, jsx as t } from "react/jsx-runtime";
 import "react";
-import { Settings2 as h, CheckCircle2 as b, CloudDownload as u, CloudOff as y } from "lucide-react";
+import { Settings2 as x, CheckCircle2 as y, CloudDownload as b, CloudOff as h } from "lucide-react";
 function m({
   providerName: l,
   description: p,
-  status: r = "available",
+  status: n = "available",
   logoUrl: s,
   icon: c,
   onConnect: a,
   onConfigure: d
 }) {
-  const x = r === "connected", n = r === "coming-soon", g = {
+  const u = n === "connected", o = n === "coming-soon", g = {
     connected: {
       label: "Connected",
       color: "var(--Grey-White, #FFF)",
       bgColor: "var(--Green-Primary, #00A66E)",
-      icon: /* @__PURE__ */ i(b, { size: 16, strokeWidth: 2, color: "#FFF" }),
+      icon: /* @__PURE__ */ t(y, { size: 16, strokeWidth: 2, color: "#FFF" }),
       actionLabel: "Disconnect",
       actionFilled: !1
     },
     available: {
       label: "Available",
       color: "var(--Grey-Strong, #808183)",
-      icon: /* @__PURE__ */ i(u, { size: 16, strokeWidth: 2 }),
+      icon: /* @__PURE__ */ t(b, { size: 16, strokeWidth: 2 }),
       actionLabel: "Connect",
       actionFilled: !0
     },
     "coming-soon": {
       label: "Coming Soon",
       color: "var(--Grey-Muted, #B2AEA8)",
-      icon: /* @__PURE__ */ i(y, { size: 16, strokeWidth: 2 }),
+      icon: /* @__PURE__ */ t(h, { size: 16, strokeWidth: 2 }),
       actionLabel: "Connect",
       actionFilled: !1
     }
-  }, e = g[r] || g.available;
-  return /* @__PURE__ */ o(
+  }, r = g[n] || g.available;
+  return /* @__PURE__ */ i(
     "div",
     {
       style: {
@@ -50,15 +50,15 @@ function m({
         background: "var(--Base-White, #FFF)"
       },
       children: [
-        /* @__PURE__ */ o("div", { style: { flex: 1, width: "100%" }, children: [
-          /* @__PURE__ */ i("div", { style: { marginBottom: "4px" }, children: s ? /* @__PURE__ */ i(
+        /* @__PURE__ */ i("div", { style: { flex: 1, width: "100%" }, children: [
+          /* @__PURE__ */ t("div", { style: { marginBottom: "4px" }, children: s ? /* @__PURE__ */ t(
             "img",
             {
               src: s,
               alt: l,
               style: { height: "24px", objectFit: "contain" }
             }
-          ) : c ? /* @__PURE__ */ i("div", { style: { display: "flex", alignItems: "center" }, children: c }) : /* @__PURE__ */ i(
+          ) : c ? /* @__PURE__ */ t("div", { style: { display: "flex", alignItems: "center" }, children: c }) : /* @__PURE__ */ t(
             "h3",
             {
               style: {
@@ -71,7 +71,7 @@ function m({
               children: l
             }
           ) }),
-          /* @__PURE__ */ i(
+          /* @__PURE__ */ t(
             "p",
             {
               style: {
@@ -84,7 +84,7 @@ function m({
             }
           )
         ] }),
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ i(
           "div",
           {
             style: {
@@ -95,64 +95,67 @@ function m({
               gap: "8px"
             },
             children: [
-              /* @__PURE__ */ o(
+              /* @__PURE__ */ i(
                 "div",
                 {
                   style: {
                     display: "flex",
-                    padding: e.bgColor ? "4px 8px 4px 6px" : "0",
+                    padding: r.bgColor ? "4px 8px 4px 6px" : "0",
                     alignItems: "center",
                     gap: "4px",
-                    borderRadius: e.bgColor ? "16px" : "0",
-                    background: e.bgColor || "transparent",
+                    borderRadius: r.bgColor ? "16px" : "0",
+                    background: r.bgColor || "transparent",
                     fontSize: "12px",
                     fontStyle: "normal",
                     fontWeight: 400,
                     lineHeight: "16px",
-                    color: e.color
+                    color: r.color
                   },
                   children: [
-                    e.icon,
-                    e.label
+                    r.icon,
+                    r.label
                   ]
                 }
               ),
-              /* @__PURE__ */ o("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
-                x && d && /* @__PURE__ */ i(
+              /* @__PURE__ */ i("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
+                u && d && /* @__PURE__ */ t(
                   "button",
                   {
-                    onClick: (t) => {
-                      t.stopPropagation(), d();
+                    type: "button",
+                    title: "Configure",
+                    "aria-label": "Configure",
+                    onClick: (e) => {
+                      e.stopPropagation(), d();
                     },
                     style: {
                       display: "flex",
                       alignItems: "center",
                       justifyContent: "center",
-                      width: "32px",
-                      height: "32px",
-                      border: "none",
-                      background: "transparent",
+                      width: "30px",
+                      height: "30px",
+                      border: "1px solid var(--neutral-100, #E6E6E6)",
+                      background: "var(--grey-white, #FFF)",
                       color: "var(--Grey-Strong, #808183)",
                       cursor: "pointer",
-                      borderRadius: "4px",
-                      transition: "background 0.15s ease"
+                      borderRadius: "8px",
+                      transition: "background 0.15s ease, border-color 0.15s ease, color 0.15s ease"
                     },
-                    onMouseEnter: (t) => {
-                      t.currentTarget.style.background = "rgba(0,0,0,0.04)";
+                    onMouseEnter: (e) => {
+                      e.currentTarget.style.background = "var(--surface-hover, #F3F7F7)", e.currentTarget.style.borderColor = "var(--neutral-250, #BFBFBF)", e.currentTarget.style.color = "var(--Grey-Strong, #2E3236)";
                     },
-                    onMouseLeave: (t) => {
-                      t.currentTarget.style.background = "transparent";
+                    onMouseLeave: (e) => {
+                      e.currentTarget.style.background = "var(--grey-white, #FFF)", e.currentTarget.style.borderColor = "var(--neutral-100, #E6E6E6)", e.currentTarget.style.color = "var(--Grey-Strong, #808183)";
                     },
-                    children: /* @__PURE__ */ i(h, { size: 20, strokeWidth: 2 })
+                    children: /* @__PURE__ */ t(x, { size: 16, strokeWidth: 2 })
                   }
                 ),
-                /* @__PURE__ */ i(
+                /* @__PURE__ */ t(
                   "button",
                   {
-                    onClick: (t) => {
-                      t.stopPropagation(), a == null || a();
+                    onClick: (e) => {
+                      e.stopPropagation(), a == null || a();
                     },
-                    disabled: n,
+                    disabled: o,
                     style: {
                       display: "flex",
                       height: "28px",
@@ -161,23 +164,23 @@ function m({
                       alignItems: "center",
                       gap: "10px",
                       borderRadius: "10px",
-                      border: e.actionFilled ? "1px solid transparent" : "1px solid #D9D9D9",
-                      background: n ? "var(--Grey-Muted, #B2AEA8)" : e.actionFilled ? "var(--Base-Strong, #1E2125)" : "var(--Base-White, #FFF)",
-                      color: e.actionFilled || n ? "#FFF" : "var(--Base-Strong, #1E2125)",
+                      border: r.actionFilled ? "1px solid transparent" : "1px solid #D9D9D9",
+                      background: o ? "var(--Grey-Muted, #B2AEA8)" : r.actionFilled ? "var(--Base-Strong, #1E2125)" : "var(--Base-White, #FFF)",
+                      color: r.actionFilled || o ? "#FFF" : "var(--Base-Strong, #1E2125)",
                       fontSize: "13px",
                       fontWeight: 600,
-                      cursor: n ? "default" : "pointer",
-                      opacity: n ? 0.6 : 1,
+                      cursor: o ? "default" : "pointer",
+                      opacity: o ? 0.6 : 1,
                       transition: "all 0.15s ease",
                       lineHeight: 1.4
                     },
-                    onMouseEnter: (t) => {
-                      !n && !e.actionFilled && (t.currentTarget.style.background = "rgba(0,0,0,0.04)");
+                    onMouseEnter: (e) => {
+                      !o && !r.actionFilled && (e.currentTarget.style.background = "rgba(0,0,0,0.04)");
                     },
-                    onMouseLeave: (t) => {
-                      !n && !e.actionFilled && (t.currentTarget.style.background = "var(--Base-White, #FFF)");
+                    onMouseLeave: (e) => {
+                      !o && !r.actionFilled && (e.currentTarget.style.background = "var(--Base-White, #FFF)");
                     },
-                    children: e.actionLabel
+                    children: r.actionLabel
                   }
                 )
               ] })

package/dist/IntegrationCard.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"IntegrationCard.es.js","sources":["../src/components/layout/IntegrationCard.jsx"],"sourcesContent":["\"use client\";\n\nimport React from \"react\";\nimport { CheckCircle2, Settings2, CloudOff, CloudDownload } from \"lucide-react\";\n\n/**\n * IntegrationCard Component\n * Displays an integration provider card with status, logo, and configuration options\n *\n * Props:\n *  - providerName   string      Provider display name\n *  - description    string      Short description / subtitle\n *  - status         string      \"available\" | \"connected\" | \"coming-soon\"\n *  - logoUrl        string      Optional logo image URL\n *  - icon           ReactNode   Optional custom icon/logo element\n *  - onConnect      function    Connect/Disconnect callback\n *  - onConfigure    function    Configure (settings) callback — shown for connected\n */\nexport default function IntegrationCard({\n  providerName,\n  description,\n  status = \"available\",\n  logoUrl,\n  icon,\n  onConnect,\n  onConfigure,\n}) {\n  const isConnected = status === \"connected\";\n  const isComingSoon = status === \"coming-soon\";\n\n  const statusConfig = {\n    connected: {\n      label: \"Connected\",\n      color: \"var(--Grey-White, #FFF)\",\n      bgColor: \"var(--Green-Primary, #00A66E)\",\n      icon: <CheckCircle2 size={16} strokeWidth={2} color=\"#FFF\" />,\n      actionLabel: \"Disconnect\",\n      actionFilled: false,\n    },\n    available: {\n      label: \"Available\",\n      color: \"var(--Grey-Strong, #808183)\",\n      icon: <CloudDownload size={16} strokeWidth={2} />,\n      actionLabel: \"Connect\",\n      actionFilled: true,\n    },\n    \"coming-soon\": {\n      label: \"Coming Soon\",\n      color: \"var(--Grey-Muted, #B2AEA8)\",\n      icon: <CloudOff size={16} strokeWidth={2} />,\n      actionLabel: \"Connect\",\n      actionFilled: false,\n    },\n  };\n\n  const config = statusConfig[status] || statusConfig.available;\n\n  return (\n    <div\n      style={{\n        display: \"flex\",\n        width: \"317px\",\n        height: \"160px\",\n        padding: \"16px\",\n        flexDirection: \"column\",\n        alignItems: \"flex-start\",\n        gap: \"10px\",\n        borderRadius: \"4px\",\n        border: \"1px solid #D9D9D9\",\n        background: \"var(--Base-White, #FFF)\",\n      }}\n    >\n      {/* Top: Name + Description */}\n      <div style={{ flex: 1, width: \"100%\" }}>\n        {/* Provider Name / Logo */}\n        <div style={{ marginBottom: \"4px\" }}>\n          {logoUrl ? (\n            <img\n              src={logoUrl}\n              alt={providerName}\n              style={{ height: \"24px\", objectFit: \"contain\" }}\n            />\n          ) : icon ? (\n            <div style={{ display: \"flex\", alignItems: \"center\" }}>{icon}</div>\n          ) : (\n            <h3\n              style={{\n                fontSize: \"16px\",\n                fontWeight: 700,\n                color: \"var(--Base-Strong, #1E2125)\",\n                margin: 0,\n                lineHeight: 1.3,\n              }}\n            >\n              {providerName}\n            </h3>\n          )}\n        </div>\n        {/* Description */}\n        <p\n          style={{\n            fontSize: \"13px\",\n            lineHeight: 1.4,\n            color: \"var(--Grey-Strong, #808183)\",\n            margin: 0,\n          }}\n        >\n          {description}\n        </p>\n      </div>\n\n      {/* Bottom: Status + Actions */}\n      <div\n        style={{\n          display: \"flex\",\n          alignItems: \"center\",\n          justifyContent: \"space-between\",\n          width: \"100%\",\n          gap: \"8px\",\n        }}\n      >\n        {/* Status label */}\n        <div\n          style={{\n            display: \"flex\",\n            padding: config.bgColor ? \"4px 8px 4px 6px\" : \"0\",\n            alignItems: \"center\",\n            gap: \"4px\",\n            borderRadius: config.bgColor ? \"16px\" : \"0\",\n            background: config.bgColor || \"transparent\",\n            fontSize: \"12px\",\n            fontStyle: \"normal\",\n            fontWeight: 400,\n            lineHeight: \"16px\",\n            color: config.color,\n          }}\n        >\n          {config.icon}\n          {config.label}\n        </div>\n\n        {/* Action area */}\n        <div style={{ display: \"flex\", alignItems: \"center\", gap: \"8px\" }}>\n          {/* Settings icon for connected */}\n          {isConnected && onConfigure && (\n            <button\n              onClick={(e) => {\n                e.stopPropagation();\n                onConfigure();\n              }}\n              style={{\n                display: \"flex\",\n                alignItems: \"center\",\n                justifyContent: \"center\",\n                width: \"32px\",\n                height: \"32px\",\n                border: \"none\",\n                background: \"transparent\",\n                color: \"var(--Grey-Strong, #808183)\",\n                cursor: \"pointer\",\n                borderRadius: \"4px\",\n                transition: \"background 0.15s ease\",\n              }}\n              onMouseEnter={(e) => {\n                e.currentTarget.style.background = \"rgba(0,0,0,0.04)\";\n              }}\n              onMouseLeave={(e) => {\n                e.currentTarget.style.background = \"transparent\";\n              }}\n            >\n              <Settings2 size={20} strokeWidth={2} />\n            </button>\n          )}\n\n          {/* Connect / Disconnect button */}\n          <button\n            onClick={(e) => {\n              e.stopPropagation();\n              onConnect?.();\n            }}\n            disabled={isComingSoon}\n            style={{\n              display: \"flex\",\n              height: \"28px\",\n              padding: \"10px\",\n              justifyContent: \"center\",\n              alignItems: \"center\",\n              gap: \"10px\",\n              borderRadius: \"10px\",\n              border: config.actionFilled\n                ? \"1px solid transparent\"\n                : \"1px solid #D9D9D9\",\n              background: isComingSoon\n                ? \"var(--Grey-Muted, #B2AEA8)\"\n                : config.actionFilled\n                ? \"var(--Base-Strong, #1E2125)\"\n                : \"var(--Base-White, #FFF)\",\n              color: config.actionFilled || isComingSoon\n                ? \"#FFF\"\n                : \"var(--Base-Strong, #1E2125)\",\n              fontSize: \"13px\",\n              fontWeight: 600,\n              cursor: isComingSoon ? \"default\" : \"pointer\",\n              opacity: isComingSoon ? 0.6 : 1,\n              transition: \"all 0.15s ease\",\n              lineHeight: 1.4,\n            }}\n            onMouseEnter={(e) => {\n              if (!isComingSoon && !config.actionFilled) {\n                e.currentTarget.style.background = \"rgba(0,0,0,0.04)\";\n              }\n            }}\n            onMouseLeave={(e) => {\n              if (!isComingSoon && !config.actionFilled) {\n                e.currentTarget.style.background = \"var(--Base-White, #FFF)\";\n              }\n            }}\n          >\n            {config.actionLabel}\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["IntegrationCard","providerName","description","status","logoUrl","icon","onConnect","onConfigure","isConnected","isComingSoon","statusConfig","CheckCircle2","jsx","CloudDownload","CloudOff","config","jsxs","e","Settings2"],"mappings":"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"}
+{"version":3,"file":"IntegrationCard.es.js","sources":["../src/components/layout/IntegrationCard.jsx"],"sourcesContent":["\"use client\";\n\nimport React from \"react\";\nimport { CheckCircle2, Settings2, CloudOff, CloudDownload } from \"lucide-react\";\n\n/**\n * IntegrationCard Component\n * Displays an integration provider card with status, logo, and configuration options\n *\n * Props:\n *  - providerName   string      Provider display name\n *  - description    string      Short description / subtitle\n *  - status         string      \"available\" | \"connected\" | \"coming-soon\"\n *  - logoUrl        string      Optional logo image URL\n *  - icon           ReactNode   Optional custom icon/logo element\n *  - onConnect      function    Connect/Disconnect callback\n *  - onConfigure    function    Configure (settings) callback — shown for connected\n */\nexport default function IntegrationCard({\n  providerName,\n  description,\n  status = \"available\",\n  logoUrl,\n  icon,\n  onConnect,\n  onConfigure,\n}) {\n  const isConnected = status === \"connected\";\n  const isComingSoon = status === \"coming-soon\";\n\n  const statusConfig = {\n    connected: {\n      label: \"Connected\",\n      color: \"var(--Grey-White, #FFF)\",\n      bgColor: \"var(--Green-Primary, #00A66E)\",\n      icon: <CheckCircle2 size={16} strokeWidth={2} color=\"#FFF\" />,\n      actionLabel: \"Disconnect\",\n      actionFilled: false,\n    },\n    available: {\n      label: \"Available\",\n      color: \"var(--Grey-Strong, #808183)\",\n      icon: <CloudDownload size={16} strokeWidth={2} />,\n      actionLabel: \"Connect\",\n      actionFilled: true,\n    },\n    \"coming-soon\": {\n      label: \"Coming Soon\",\n      color: \"var(--Grey-Muted, #B2AEA8)\",\n      icon: <CloudOff size={16} strokeWidth={2} />,\n      actionLabel: \"Connect\",\n      actionFilled: false,\n    },\n  };\n\n  const config = statusConfig[status] || statusConfig.available;\n\n  return (\n    <div\n      style={{\n        display: \"flex\",\n        width: \"317px\",\n        height: \"160px\",\n        padding: \"16px\",\n        flexDirection: \"column\",\n        alignItems: \"flex-start\",\n        gap: \"10px\",\n        borderRadius: \"4px\",\n        border: \"1px solid #D9D9D9\",\n        background: \"var(--Base-White, #FFF)\",\n      }}\n    >\n      {/* Top: Name + Description */}\n      <div style={{ flex: 1, width: \"100%\" }}>\n        {/* Provider Name / Logo */}\n        <div style={{ marginBottom: \"4px\" }}>\n          {logoUrl ? (\n            <img\n              src={logoUrl}\n              alt={providerName}\n              style={{ height: \"24px\", objectFit: \"contain\" }}\n            />\n          ) : icon ? (\n            <div style={{ display: \"flex\", alignItems: \"center\" }}>{icon}</div>\n          ) : (\n            <h3\n              style={{\n                fontSize: \"16px\",\n                fontWeight: 700,\n                color: \"var(--Base-Strong, #1E2125)\",\n                margin: 0,\n                lineHeight: 1.3,\n              }}\n            >\n              {providerName}\n            </h3>\n          )}\n        </div>\n        {/* Description */}\n        <p\n          style={{\n            fontSize: \"13px\",\n            lineHeight: 1.4,\n            color: \"var(--Grey-Strong, #808183)\",\n            margin: 0,\n          }}\n        >\n          {description}\n        </p>\n      </div>\n\n      {/* Bottom: Status + Actions */}\n      <div\n        style={{\n          display: \"flex\",\n          alignItems: \"center\",\n          justifyContent: \"space-between\",\n          width: \"100%\",\n          gap: \"8px\",\n        }}\n      >\n        {/* Status label */}\n        <div\n          style={{\n            display: \"flex\",\n            padding: config.bgColor ? \"4px 8px 4px 6px\" : \"0\",\n            alignItems: \"center\",\n            gap: \"4px\",\n            borderRadius: config.bgColor ? \"16px\" : \"0\",\n            background: config.bgColor || \"transparent\",\n            fontSize: \"12px\",\n            fontStyle: \"normal\",\n            fontWeight: 400,\n            lineHeight: \"16px\",\n            color: config.color,\n          }}\n        >\n          {config.icon}\n          {config.label}\n        </div>\n\n        {/* Action area */}\n        <div style={{ display: \"flex\", alignItems: \"center\", gap: \"8px\" }}>\n          {/* Settings icon for connected — a bordered, clickable button with a\n              native \"Configure\" tooltip on hover. */}\n          {isConnected && onConfigure && (\n            <button\n              type=\"button\"\n              title=\"Configure\"\n              aria-label=\"Configure\"\n              onClick={(e) => {\n                e.stopPropagation();\n                onConfigure();\n              }}\n              style={{\n                display: \"flex\",\n                alignItems: \"center\",\n                justifyContent: \"center\",\n                width: \"30px\",\n                height: \"30px\",\n                border: \"1px solid var(--neutral-100, #E6E6E6)\",\n                background: \"var(--grey-white, #FFF)\",\n                color: \"var(--Grey-Strong, #808183)\",\n                cursor: \"pointer\",\n                borderRadius: \"8px\",\n                transition: \"background 0.15s ease, border-color 0.15s ease, color 0.15s ease\",\n              }}\n              onMouseEnter={(e) => {\n                e.currentTarget.style.background = \"var(--surface-hover, #F3F7F7)\";\n                e.currentTarget.style.borderColor = \"var(--neutral-250, #BFBFBF)\";\n                e.currentTarget.style.color = \"var(--Grey-Strong, #2E3236)\";\n              }}\n              onMouseLeave={(e) => {\n                e.currentTarget.style.background = \"var(--grey-white, #FFF)\";\n                e.currentTarget.style.borderColor = \"var(--neutral-100, #E6E6E6)\";\n                e.currentTarget.style.color = \"var(--Grey-Strong, #808183)\";\n              }}\n            >\n              <Settings2 size={16} strokeWidth={2} />\n            </button>\n          )}\n\n          {/* Connect / Disconnect button */}\n          <button\n            onClick={(e) => {\n              e.stopPropagation();\n              onConnect?.();\n            }}\n            disabled={isComingSoon}\n            style={{\n              display: \"flex\",\n              height: \"28px\",\n              padding: \"10px\",\n              justifyContent: \"center\",\n              alignItems: \"center\",\n              gap: \"10px\",\n              borderRadius: \"10px\",\n              border: config.actionFilled\n                ? \"1px solid transparent\"\n                : \"1px solid #D9D9D9\",\n              background: isComingSoon\n                ? \"var(--Grey-Muted, #B2AEA8)\"\n                : config.actionFilled\n                ? \"var(--Base-Strong, #1E2125)\"\n                : \"var(--Base-White, #FFF)\",\n              color: config.actionFilled || isComingSoon\n                ? \"#FFF\"\n                : \"var(--Base-Strong, #1E2125)\",\n              fontSize: \"13px\",\n              fontWeight: 600,\n              cursor: isComingSoon ? \"default\" : \"pointer\",\n              opacity: isComingSoon ? 0.6 : 1,\n              transition: \"all 0.15s ease\",\n              lineHeight: 1.4,\n            }}\n            onMouseEnter={(e) => {\n              if (!isComingSoon && !config.actionFilled) {\n                e.currentTarget.style.background = \"rgba(0,0,0,0.04)\";\n              }\n            }}\n            onMouseLeave={(e) => {\n              if (!isComingSoon && !config.actionFilled) {\n                e.currentTarget.style.background = \"var(--Base-White, #FFF)\";\n              }\n            }}\n          >\n            {config.actionLabel}\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["IntegrationCard","providerName","description","status","logoUrl","icon","onConnect","onConfigure","isConnected","isComingSoon","statusConfig","CheckCircle2","jsx","CloudDownload","CloudOff","config","jsxs","Settings2"],"mappings":"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"}