chordia-ui 3.2.5 → 3.2.7

package/dist/FileUploadingState.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileUploadingState.es.js","sources":["../src/components/common/AutoSearch.jsx","../src/components/common/SideDrawer.jsx","../src/components/common/FileUploadingState.jsx"],"sourcesContent":["\"use client\";\n\nimport React, { useState, useMemo, useRef, useEffect } from \"react\";\nimport { X, Search, PlusCircle } from \"lucide-react\";\nimport TextInput from \"../primitives/TextInput\";\nimport SmallButton from \"../primitives/SmallButton\";\n\nconst AutoSearch = ({\n  options = [],\n  value = null,\n  onChange,\n  placeholder = \"Search...\",\n  disabled = false,\n  showSuggestions = true,\n  styling,\n  isAddNew = false,\n}) => {\n  const [search, setSearch] = useState(\"\");\n  const [isOpen, setIsOpen] = useState(false);\n  const [addedOption, setAddedOption] = useState(null);\n\n  const containerRef = useRef(null);\n\n  const filteredOptions = useMemo(() => {\n    if (!showSuggestions) return [];\n    const lower = search.toLowerCase();\n\n    return options.filter((opt) => {\n      if (!opt) return false;\n      const label = opt.label || \"\";\n      const val = opt.value || \"\";\n      return (\n        (label.toLowerCase().includes(lower) ||\n          val.toLowerCase().includes(lower)) &&\n        (!addedOption || opt.value !== addedOption.value)\n      );\n    });\n  }, [search, options, showSuggestions, addedOption]);\n\n  const exactMatchExists = useMemo(() => {\n    if (!isAddNew) return false;\n    const lower = search.toLowerCase();\n    return options.some((opt) => {\n      if (!opt) return false;\n      const label = opt.label || \"\";\n      const val = opt.value || \"\";\n      return label.toLowerCase() === lower || val.toLowerCase() === lower;\n    });\n  }, [options, search, isAddNew]);\n\n  // Close dropdown on outside click\n  useEffect(() => {\n    if (!isOpen) return;\n    const handleClickOutside = (event) => {\n      if (\n        containerRef.current &&\n        !containerRef.current.contains(event.target)\n      ) {\n        setIsOpen(false);\n      }\n    };\n    document.addEventListener(\"mousedown\", handleClickOutside);\n    return () => document.removeEventListener(\"mousedown\", handleClickOutside);\n  }, [isOpen]);\n\n  const handleSelect = (opt) => {\n    onChange?.(opt);\n    setSearch(\"\");\n    setIsOpen(false);\n    setAddedOption(null);\n  };\n\n  const handleAddNew = () => {\n    const newOpt = { label: search, value: search };\n    setAddedOption(newOpt);\n    onChange?.(newOpt);\n    setIsOpen(false);\n    setSearch(\"\");\n  };\n\n  const handleClear = () => {\n    onChange?.(null);\n    setSearch(\"\");\n    setIsOpen(false);\n    setAddedOption(null);\n  };\n\n  const handleInputChange = (e) => {\n    const newValue = e.target.value;\n    if (showSuggestions) {\n      setSearch(newValue);\n      setIsOpen(true);\n    } else if (isAddNew) {\n      setSearch(newValue);\n      setIsOpen(newValue.length >= 3);\n    } else {\n      onChange?.(newValue);\n    }\n  };\n\n  const handleInputFocus = () => {\n    if (showSuggestions || isAddNew) {\n      setIsOpen(true);\n    }\n  };\n\n  const shouldShowDropdown =\n    isOpen && !value && (showSuggestions ? search.length >= 3 : search.length >= 3);\n\n  return (\n    <div className=\"relative w-full\" ref={containerRef}>\n      <div\n        className={\n          styling\n            ? styling\n            : \"flex items-center gap-2 border rounded-md px-3 py-2 bg-white shadow-sm\"\n        }\n      >\n        <Search className=\"w-4 h-4 text-gray-400\" />\n        <div className=\"flex-1\">\n          {showSuggestions && value ? (\n            <div\n              className=\"text-gray-800 truncate\"\n              title={value.label}\n              style={{\n                fontSize: 'var(--text-sm)',\n                fontWeight: 'var(--font-medium)',\n                letterSpacing: 'var(--tracking-normal)',\n                lineHeight: 'var(--leading-normal)',\n                textTransform: 'none',\n                textDecoration: 'none',\n                fontFamily: 'var(--font-sans)',\n              }}\n            >\n              {value.label}\n            </div>\n          ) : (\n            <TextInput\n              value={showSuggestions || isAddNew ? search : value || \"\"}\n              onChange={(val) =>\n                handleInputChange({ target: { value: val } })\n              }\n              placeholder={placeholder}\n              disabled={disabled}\n              style={{\n                border: \"none\",\n                boxShadow: \"none\",\n                padding: 0,\n                backgroundColor: \"transparent\",\n              }}\n              onFocus={handleInputFocus}\n            />\n          )}\n        </div>\n        {(value || addedOption) && (\n          <SmallButton\n            type=\"button\"\n            variant=\"ghost\"\n            size=\"sm\"\n            onClick={handleClear}\n            style={{\n              padding: 0,\n              width: 20,\n              height: 20,\n              border: \"none\",\n              backgroundColor: \"transparent\",\n              color: \"rgba(107,114,128,1)\",\n            }}\n          >\n            <X className=\"w-3 h-3\" />\n          </SmallButton>\n        )}\n      </div>\n\n      {shouldShowDropdown && (\n        <div\n          className=\"absolute w-full rounded-md border border-gray-300 bg-white shadow-lg custom-thin-scrollbar-library\"\n          style={{\n            maxHeight: 240,\n            overflowY: \"auto\",\n            zIndex: 30,\n          }}\n        >\n          {filteredOptions.length > 0 && (\n            <ul className=\"m-0 p-0 list-none\">\n              {filteredOptions.map((opt) => (\n                <li\n                  key={opt.value}\n                  onClick={() => handleSelect(opt)}\n                  onMouseEnter={(e) => {\n                    e.currentTarget.style.backgroundColor = \"var(--hover-warm)\";\n                  }}\n                  onMouseLeave={(e) => {\n                    e.currentTarget.style.backgroundColor = \"transparent\";\n                  }}\n                  className=\"cursor-pointer px-4 py-2\"\n                  title={opt.label}\n                >\n                  <span\n                    className=\"truncate block w-full\"\n                    style={{\n                      fontFamily: \"var(--font-sans)\",\n                      color: \"var(--text-base)\",\n                      fontSize: \"var(--text-sm)\",\n                      fontWeight: \"var(--font-medium)\",\n                      letterSpacing: \"var(--tracking-normal)\",\n                      lineHeight: \"var(--leading-normal)\",\n                      textTransform: \"none\",\n                      textDecoration: \"none\",\n                    }}\n                  >\n                    {opt.label}\n                  </span>\n                </li>\n              ))}\n            </ul>\n          )}\n\n          {isAddNew &&\n            !exactMatchExists &&\n            !addedOption &&\n            search.length >= 3 && (\n              <SmallButton\n                type=\"button\"\n                variant=\"secondary\"\n                onClick={handleAddNew}\n                style={{\n                  width: \"100%\",\n                  justifyContent: \"space-between\",\n                  padding: \"8px 10px\",\n                  border: \"none\",\n                  borderTop: \"1px solid rgba(229, 231, 235, 1)\",\n                  borderRadius: 0,\n                  backgroundColor: \"transparent\",\n                  color: \"rgba(107,114,128,1)\",\n                }}\n              >\n                <span>{`Add \"${search}\"`}</span>\n                <PlusCircle className=\"w-5 h-5 text-green-500\" />\n              </SmallButton>\n            )}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default AutoSearch;\n\n","\"use client\";\n\nimport React, { useEffect, useRef } from \"react\";\nimport { X } from \"lucide-react\";\n\n/**\n * SideDrawer — slide-in panel from the right edge.\n *\n * Props:\n *  - open          boolean       Whether the drawer is visible\n *  - onClose       function      Close callback\n *  - title         string        Header title\n *  - subtitle      string        Optional description below the divider\n *  - children      ReactNode     Drawer body content\n *  - footer        ReactNode     Optional fixed footer (e.g. Cancel/Save buttons)\n *  - width         number|string Drawer width (default 515)\n *  - height        number|string Drawer height (default 762)\n *  - toggleLabel   string        Optional toggle label (right side of subtitle row)\n *  - toggleChecked boolean       Toggle state\n *  - onToggle      function      Toggle callback\n */\nexport default function SideDrawer({\n  open,\n  onClose,\n  title,\n  subtitle,\n  children,\n  footer,\n  width = 515,\n  height = 762,\n  toggleLabel,\n  toggleChecked,\n  onToggle,\n}) {\n  const drawerRef = useRef(null);\n\n  // Close on Escape key\n  useEffect(() => {\n    if (!open) return;\n    const handleKey = (e) => {\n      if (e.key === \"Escape\") onClose?.();\n    };\n    document.addEventListener(\"keydown\", handleKey);\n    return () => document.removeEventListener(\"keydown\", handleKey);\n  }, [open, onClose]);\n\n  if (!open) return null;\n\n  return (\n    <>\n      {/* Backdrop */}\n      <div\n        onClick={onClose}\n        style={{\n          position: \"fixed\",\n          inset: 0,\n          zIndex: 1200,\n          background: \"rgba(0, 0, 0, 0.20)\",\n        }}\n      />\n\n      {/* Drawer panel */}\n      <div\n        ref={drawerRef}\n        style={{\n          position: \"fixed\",\n          top: \"50%\",\n          right: 0,\n          transform: \"translateY(-50%)\",\n          zIndex: 1201,\n          display: \"flex\",\n          width,\n          height,\n          maxHeight: \"100vh\",\n          padding: \"20px\",\n          flexDirection: \"column\",\n          alignItems: \"flex-start\",\n          gap: \"20px\",\n          borderRadius: \"12px 0 0 12px\",\n          background: \"#FFF\",\n          boxShadow: \"648px 0 100px 0 rgba(0, 0, 0, 0.20)\",\n        }}\n      >\n        {/* Header: Title + Close */}\n        <div\n          style={{\n            display: \"flex\",\n            alignItems: \"center\",\n            justifyContent: \"space-between\",\n            width: \"100%\",\n            flexShrink: 0,\n          }}\n        >\n          <h2\n            style={{\n              fontSize: \"24px\",\n              fontWeight: 600,\n              fontStyle: \"normal\",\n              color: \"var(--Grey-3, #252525)\",\n              margin: 0,\n              lineHeight: \"normal\",\n            }}\n          >\n            {title}\n          </h2>\n          <button\n            onClick={onClose}\n            style={{\n              display: \"flex\",\n              alignItems: \"center\",\n              justifyContent: \"center\",\n              width: \"28px\",\n              height: \"28px\",\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 = \"#ECEEF2\";\n            }}\n            onMouseLeave={(e) => {\n              e.currentTarget.style.background = \"transparent\";\n            }}\n          >\n            <X size={20} strokeWidth={2} />\n          </button>\n        </div>\n\n        {/* Divider */}\n        <div\n          style={{\n            width: \"100%\",\n            height: \"1px\",\n            background: \"#ECEEF2\",\n            flexShrink: 0,\n          }}\n        />\n\n        {/* Subtitle row with optional toggle */}\n        {(subtitle || toggleLabel) && (\n          <div\n            style={{\n              display: \"flex\",\n              alignItems: \"center\",\n              justifyContent: \"space-between\",\n              width: \"100%\",\n              gap: \"12px\",\n              flexShrink: 0,\n            }}\n          >\n            {subtitle && (\n              <p\n                style={{\n                  fontSize: \"13px\",\n                  fontStyle: \"normal\",\n                  fontWeight: 400,\n                  lineHeight: \"140%\",\n                  color: \"#0B0B0B\",\n                  margin: 0,\n                  flex: 1,\n                }}\n              >\n                {subtitle}\n              </p>\n            )}\n            {toggleLabel && (\n              <div\n                style={{\n                  display: \"flex\",\n                  alignItems: \"center\",\n                  gap: \"8px\",\n                  flexShrink: 0,\n                }}\n              >\n                {/* Toggle switch */}\n                <button\n                  onClick={() => onToggle?.(!toggleChecked)}\n                  style={{\n                    position: \"relative\",\n                    width: \"40px\",\n                    height: \"22px\",\n                    borderRadius: \"11px\",\n                    border: \"none\",\n                    background: toggleChecked\n                      ? \"var(--Base-Strong, #0B0B0B)\"\n                      : \"var(--Base-Faint, #D9D9D9)\",\n                    cursor: \"pointer\",\n                    transition: \"background 0.2s ease\",\n                    padding: 0,\n                    flexShrink: 0,\n                  }}\n                >\n                  <div\n                    style={{\n                      position: \"absolute\",\n                      top: \"2px\",\n                      left: toggleChecked ? \"20px\" : \"2px\",\n                      width: \"18px\",\n                      height: \"18px\",\n                      borderRadius: \"50%\",\n                      background: \"#FFF\",\n                      transition: \"left 0.2s ease\",\n                      boxShadow: \"0 1px 3px rgba(0,0,0,0.15)\",\n                    }}\n                  />\n                </button>\n                <span\n                  style={{\n                    fontSize: \"13px\",\n                    fontWeight: 500,\n                    color: \"var(--Base-Strong, #1E1E1E)\",\n                    lineHeight: 1.4,\n                  }}\n                >\n                  {toggleLabel}\n                </span>\n              </div>\n            )}\n          </div>\n        )}\n\n        {/* Body content — scrollable */}\n        <div\n          style={{\n            flex: 1,\n            width: \"100%\",\n            overflowY: \"auto\",\n            display: \"flex\",\n            flexDirection: \"column\",\n            gap: \"16px\",\n            minHeight: 0,\n          }}\n        >\n          {children}\n        </div>\n\n        {/* Footer */}\n        {footer && (\n          <>\n            <div\n              style={{\n                width: \"100%\",\n                height: \"1px\",\n                background: \"#ECEEF2\",\n                flexShrink: 0,\n              }}\n            />\n            <div\n              style={{\n                display: \"flex\",\n                alignItems: \"center\",\n                justifyContent: \"flex-end\",\n                gap: \"12px\",\n                width: \"100%\",\n                flexShrink: 0,\n              }}\n            >\n              {footer}\n            </div>\n          </>\n        )}\n      </div>\n    </>\n  );\n}\n\n/**\n * DrawerButton — standard button for use in SideDrawer footer.\n *\n * Props:\n *  - label     string\n *  - variant   \"primary\" | \"secondary\" (default \"secondary\")\n *  - onClick   function\n *  - disabled  boolean\n */\nexport function DrawerButton({\n  label,\n  variant = \"secondary\",\n  onClick,\n  disabled,\n}) {\n  const isPrimary = variant === \"primary\";\n\n  return (\n    <button\n      onClick={onClick}\n      disabled={disabled}\n      style={{\n        display: \"flex\",\n        height: \"36px\",\n        padding: \"0 20px\",\n        justifyContent: \"center\",\n        alignItems: \"center\",\n        gap: \"8px\",\n        borderRadius: \"6px\",\n        border: isPrimary ? \"none\" : \"1px solid #D9D9D9\",\n        background: isPrimary\n          ? \"var(--Base-Strong, #0B0B0B)\"\n          : \"var(--Base-White, #FFF)\",\n        color: isPrimary ? \"#FFF\" : \"var(--Base-Strong, #1E1E1E)\",\n        fontSize: \"16px\",\n        fontWeight: 600,\n        cursor: disabled ? \"default\" : \"pointer\",\n        opacity: disabled ? 0.5 : 1,\n        transition: \"all 0.15s ease\",\n      }}\n      onMouseEnter={(e) => {\n        if (!disabled && !isPrimary) {\n          e.currentTarget.style.background = \"#ECEEF2\";\n        }\n      }}\n      onMouseLeave={(e) => {\n        if (!disabled && !isPrimary) {\n          e.currentTarget.style.background = \"var(--Base-White, #FFF)\";\n        }\n      }}\n    >\n      {label}\n    </button>\n  );\n}\n\n/**\n * DrawerLabel — form label for use inside SideDrawer.\n *\n * Props:\n *  - children   ReactNode\n *  - htmlFor    string\n */\nexport function DrawerLabel({ children, htmlFor }) {\n  return (\n    <label\n      htmlFor={htmlFor}\n      style={{\n        display: \"block\",\n        color: \"var(--Base-Strong, #2E3236)\",\n        fontSize: \"16px\",\n        fontStyle: \"normal\",\n        fontWeight: 400,\n        lineHeight: \"normal\",\n        marginBottom: \"6px\",\n      }}\n    >\n      {children}\n    </label>\n  );\n}\n\n/**\n * DrawerInput — text input for use inside SideDrawer.\n *\n * Props:\n *  - All standard <input> props (type, placeholder, value, onChange, etc.)\n */\nexport function DrawerInput(props) {\n  return (\n    <input\n      {...props}\n      style={{\n        width: \"100%\",\n        padding: \"10px 12px\",\n        borderRadius: \"6px\",\n        border: \"1px solid #D9D9D9\",\n        color: \"var(--Base-Strong, #2E3236)\",\n        fontSize: \"16px\",\n        fontStyle: \"normal\",\n        fontWeight: 400,\n        lineHeight: \"normal\",\n        outline: \"none\",\n        boxSizing: \"border-box\",\n        background: \"#FFF\",\n        transition: \"border-color 0.15s ease\",\n        ...props.style,\n      }}\n      onFocus={(e) => {\n        e.currentTarget.style.borderColor = \"#808183\";\n        props.onFocus?.(e);\n      }}\n      onBlur={(e) => {\n        e.currentTarget.style.borderColor = \"#D9D9D9\";\n        props.onBlur?.(e);\n      }}\n    />\n  );\n}\n","\"use client\";\n\nimport React from \"react\";\nimport { FolderCheck } from \"lucide-react\";\n\n/**\n * ThreeCirclesSpinner — animated concentric spinner matching the Figma asset.\n * Three arcs (outer gold, middle green, inner gold) rotating at different speeds.\n */\nfunction ThreeCirclesSpinner({ size = 48 }) {\n  return (\n    <svg\n      width={size}\n      height={size}\n      viewBox=\"0 0 48 48\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      style={{ animation: \"file-upload-spin 1.2s linear infinite\" }}\n    >\n      <path\n        d=\"M43 24C43 26.4951 42.5086 28.9658 41.5537 31.271C40.5989 33.5762 39.1993 35.6707 37.435 37.435C35.6707 39.1993 33.5762 40.5989 31.271 41.5537C28.9658 42.5086 26.4951 43 24 43C21.5049 43 19.0342 42.5086 16.729 41.5537C14.4238 40.5989 12.3293 39.1993 10.565 37.435C8.80066 35.6707 7.40113 33.5762 6.44629 31.271C5.49145 28.9658 5 26.4951 5 24\"\n        stroke=\"#F3E7C7\"\n        strokeWidth=\"4\"\n        strokeLinecap=\"round\"\n      />\n      <path\n        d=\"M12 24C12 22.4241 12.3104 20.8637 12.9134 19.4078C13.5165 17.9519 14.4004 16.629 15.5147 15.5147C16.629 14.4004 17.9519 13.5165 19.4078 12.9134C20.8637 12.3104 22.4241 12 24 12C25.5759 12 27.1363 12.3104 28.5922 12.9134C30.0481 13.5165 31.371 14.4004 32.4853 15.5147C33.5996 16.629 34.4835 17.9519 35.0866 19.4078C35.6896 20.8637 36 22.4241 36 24\"\n        stroke=\"#00A66E\"\n        strokeWidth=\"4\"\n        strokeLinecap=\"round\"\n      />\n      <path\n        d=\"M20 24C20 24.5253 20.1035 25.0454 20.3045 25.5307C20.5055 26.016 20.8001 26.457 21.1716 26.8284C21.543 27.1999 21.984 27.4945 22.4693 27.6955C22.9546 27.8965 23.4747 28 24 28C24.5253 28 25.0454 27.8965 25.5307 27.6955C26.016 27.4945 26.457 27.1999 26.8284 26.8284C27.1999 26.457 27.4945 26.016 27.6955 25.5307C27.8965 25.0454 28 24.5253 28 24\"\n        stroke=\"#F3E7C7\"\n        strokeWidth=\"4\"\n        strokeLinecap=\"round\"\n      />\n    </svg>\n  );\n}\n\n/**\n * FileUploadingState — shows file upload progress with spinner.\n *\n * Props:\n *  - title        string   Main message (default \"Uploading your file...\")\n *  - subtitle     string   Secondary message (default \"Please wait while we process your file\")\n *  - progress     number   Optional progress percentage (0-100)\n *  - width        number|string  Container width (default 648)\n *  - height       number|string  Container height (default 281)\n */\nexport default function FileUploadingState({\n  title = \"Uploading your file...\",\n  subtitle = \"Please wait while we process your file\",\n  progress,\n  width = 648,\n  height = 281,\n}) {\n  return (\n    <>\n      <style>{`\n        @keyframes file-upload-spin {\n          from { transform: rotate(0deg); }\n          to { transform: rotate(360deg); }\n        }\n      `}</style>\n\n      <div\n        style={{\n          display: \"flex\",\n          width,\n          height,\n          padding: \"88px 64px 64px 64px\",\n          flexDirection: \"column\",\n          justifyContent: \"center\",\n          alignItems: \"center\",\n          gap: \"8px\",\n          borderRadius: \"12px\",\n          border: \"2px dashed #D9D9D9\",\n          background: \"var(--Grey-White, #FFF)\",\n          boxSizing: \"border-box\",\n        }}\n      >\n        {/* Spinner */}\n        <ThreeCirclesSpinner size={48} />\n\n        {/* Title */}\n        <p\n          style={{\n            fontSize: \"16px\",\n            fontWeight: 600,\n            color: \"var(--Base-Strong, #2E3236)\",\n            margin: 0,\n            lineHeight: \"normal\",\n            textAlign: \"center\",\n          }}\n        >\n          {title}\n        </p>\n\n        {/* Subtitle */}\n        <p\n          style={{\n            fontSize: \"13px\",\n            fontWeight: 400,\n            color: \"var(--Grey-Strong, #808183)\",\n            margin: 0,\n            lineHeight: \"140%\",\n            textAlign: \"center\",\n          }}\n        >\n          {subtitle}\n        </p>\n\n        {/* Optional progress bar */}\n        {progress !== undefined && (\n          <div\n            style={{\n              width: \"200px\",\n              height: \"4px\",\n              borderRadius: \"2px\",\n              background: \"#ECEEF2\",\n              marginTop: \"8px\",\n              overflow: \"hidden\",\n            }}\n          >\n            <div\n              style={{\n                width: `${Math.min(100, Math.max(0, progress))}%`,\n                height: \"100%\",\n                borderRadius: \"2px\",\n                background: \"var(--Green-Primary, #00A66E)\",\n                transition: \"width 0.3s ease\",\n              }}\n            />\n          </div>\n        )}\n      </div>\n    </>\n  );\n}\n\n/**\n * FileUploadSuccessState — shows upload complete with folder-check icon.\n *\n * Props:\n *  - title        string      Main message (default \"File uploaded successfully!\")\n *  - subtitle     string      Secondary message (default \"13 files have been uploaded to your project\")\n *  - actionLabel  string      Button label (default \"Add more files\")\n *  - onAction     function    Button click callback\n *  - width        number|string  Container width (default 648)\n *  - height       number|string  Container height (default 281)\n */\nexport function FileUploadSuccessState({\n  title = \"File uploaded successfully!\",\n  subtitle = \"13 files have been uploaded to your project\",\n  actionLabel = \"Add more files\",\n  onAction,\n  width = 648,\n  height = 281,\n}) {\n  return (\n    <div\n      style={{\n        display: \"flex\",\n        width,\n        height,\n        padding: \"88px 64px 64px 64px\",\n        flexDirection: \"column\",\n        justifyContent: \"center\",\n        alignItems: \"center\",\n        gap: \"8px\",\n        borderRadius: \"12px\",\n        border: \"1px solid #D9D9D9\",\n        background: \"var(--Grey-White, #FFF)\",\n        boxSizing: \"border-box\",\n      }}\n    >\n      {/* Icon circle */}\n      <div\n        style={{\n          display: \"flex\",\n          width: \"64px\",\n          height: \"64px\",\n          justifyContent: \"center\",\n          alignItems: \"center\",\n          borderRadius: \"9999px\",\n          background: \"var(--Focus-2, #FAF5E9)\",\n          flexShrink: 0,\n          marginBottom: \"8px\",\n        }}\n      >\n        <FolderCheck size={24} strokeWidth={2} color=\"var(--Base-Strong, #2E3236)\" />\n      </div>\n\n      {/* Title */}\n      <p\n        style={{\n          fontSize: \"16px\",\n          fontWeight: 600,\n          color: \"var(--Base-Strong, #2E3236)\",\n          margin: 0,\n          lineHeight: \"normal\",\n          textAlign: \"center\",\n        }}\n      >\n        {title}\n      </p>\n\n      {/* Subtitle */}\n      <p\n        style={{\n          fontSize: \"13px\",\n          fontWeight: 400,\n          color: \"var(--Grey-Strong, #808183)\",\n          margin: 0,\n          lineHeight: \"140%\",\n          textAlign: \"center\",\n        }}\n      >\n        {/* {subtitle} */}\n      </p>\n\n      {/* Action button */}\n      {actionLabel && onAction && (\n        <button\n          onClick={onAction}\n          style={{\n            display: \"flex\",\n            padding: \"8px 20px\",\n            justifyContent: \"center\",\n            alignItems: \"center\",\n            gap: \"8px\",\n            borderRadius: \"6px\",\n            border: \"1px solid #D9D9D9\",\n            background: \"var(--Base-White, #FFF)\",\n            color: \"var(--Grey-Strong, #808183)\",\n            fontSize: \"14px\",\n            fontWeight: 500,\n            cursor: \"pointer\",\n            marginTop: \"8px\",\n            transition: \"all 0.15s ease\",\n          }}\n          onMouseEnter={(e) => {\n            e.currentTarget.style.background = \"#ECEEF2\";\n          }}\n          onMouseLeave={(e) => {\n            e.currentTarget.style.background = \"var(--Base-White, #FFF)\";\n          }}\n        >\n          {actionLabel}\n        </button>\n      )}\n    </div>\n  );\n}\n"],"names":["AutoSearch","options","value","onChange","placeholder","disabled","showSuggestions","styling","isAddNew","search","setSearch","useState","isOpen","setIsOpen","addedOption","setAddedOption","containerRef","useRef","filteredOptions","useMemo","lower","opt","label","val","exactMatchExists","useEffect","handleClickOutside","event","handleSelect","handleAddNew","newOpt","handleClear","handleInputChange","e","newValue","handleInputFocus","shouldShowDropdown","jsxs","jsx","Search","TextInput","SmallButton","X","PlusCircle","SideDrawer","open","onClose","title","subtitle","children","footer","width","height","toggleLabel","toggleChecked","onToggle","drawerRef","handleKey","Fragment","DrawerButton","variant","onClick","isPrimary","DrawerLabel","htmlFor","DrawerInput","props","_a","ThreeCirclesSpinner","size","FileUploadingState","progress","FileUploadSuccessState","actionLabel","onAction","FolderCheck"],"mappings":"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"}

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:x,status:o="available",logoUrl:s,icon:c,onConnect:a,onConfigure:d}){const p=o==="connected",n=o==="coming-soon",g={connected:{label:"Connected",color:"var(--Grey-Strong, #808183)",icon:e.jsx(r.CheckCircle2,{size:16,strokeWidth:2}),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}},i=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:x})]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%",gap:"8px"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px",fontSize:"13px",fontWeight:400,color:i.color},children:[i.icon,i.label]}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[p&&d&&e.jsx("button",{onClick:t=>{t.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:t=>{t.currentTarget.style.background="rgba(0,0,0,0.04)"},onMouseLeave:t=>{t.currentTarget.style.background="transparent"},children:e.jsx(r.Settings2,{size:20,strokeWidth:2})}),e.jsx("button",{onClick:t=>{t.stopPropagation(),a==null||a()},disabled:n,style:{display:"flex",height:"28px",padding:"10px",justifyContent:"center",alignItems:"center",gap:"10px",borderRadius:"10px",border:i.actionFilled?"1px solid transparent":"1px solid #D9D9D9",background:n?"var(--Grey-Muted, #B2AEA8)":i.actionFilled?"var(--Base-Strong, #1E2125)":"var(--Base-White, #FFF)",color:i.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:t=>{!n&&!i.actionFilled&&(t.currentTarget.style.background="rgba(0,0,0,0.04)")},onMouseLeave:t=>{!n&&!i.actionFilled&&(t.currentTarget.style.background="var(--Base-White, #FFF)")},children:i.actionLabel})]})]})]})}exports.IntegrationCard=u;
+"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;
 //# 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-Strong, #808183)\",\n      icon: <CheckCircle2 size={16} strokeWidth={2} />,\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            alignItems: \"center\",\n            gap: \"6px\",\n            fontSize: \"13px\",\n            fontWeight: 400,\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","jsx","CheckCircle2","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 */}\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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"}

package/dist/IntegrationCard.es.js

@@ -1,7 +1,7 @@
-import { jsxs as o, jsx as t } from "react/jsx-runtime";
+import { jsxs as o, jsx as i } from "react/jsx-runtime";
 import "react";
-import { Settings2 as x, CheckCircle2 as b, CloudDownload as u, CloudOff as y } from "lucide-react";
-function F({
+import { Settings2 as h, CheckCircle2 as b, CloudDownload as u, CloudOff as y } from "lucide-react";
+function m({
   providerName: l,
   description: p,
   status: r = "available",
@@ -10,29 +10,30 @@ function F({
   onConnect: a,
   onConfigure: d
 }) {
-  const h = r === "connected", n = r === "coming-soon", g = {
+  const x = r === "connected", n = r === "coming-soon", g = {
     connected: {
       label: "Connected",
-      color: "var(--Grey-Strong, #808183)",
-      icon: /* @__PURE__ */ t(b, { size: 16, strokeWidth: 2 }),
+      color: "var(--Grey-White, #FFF)",
+      bgColor: "var(--Green-Primary, #00A66E)",
+      icon: /* @__PURE__ */ i(b, { size: 16, strokeWidth: 2, color: "#FFF" }),
       actionLabel: "Disconnect",
       actionFilled: !1
     },
     available: {
       label: "Available",
       color: "var(--Grey-Strong, #808183)",
-      icon: /* @__PURE__ */ t(u, { size: 16, strokeWidth: 2 }),
+      icon: /* @__PURE__ */ i(u, { size: 16, strokeWidth: 2 }),
       actionLabel: "Connect",
       actionFilled: !0
     },
     "coming-soon": {
       label: "Coming Soon",
       color: "var(--Grey-Muted, #B2AEA8)",
-      icon: /* @__PURE__ */ t(y, { size: 16, strokeWidth: 2 }),
+      icon: /* @__PURE__ */ i(y, { size: 16, strokeWidth: 2 }),
       actionLabel: "Connect",
       actionFilled: !1
     }
-  }, i = g[r] || g.available;
+  }, e = g[r] || g.available;
   return /* @__PURE__ */ o(
     "div",
     {
@@ -50,14 +51,14 @@ function F({
       },
       children: [
         /* @__PURE__ */ o("div", { style: { flex: 1, width: "100%" }, children: [
-          /* @__PURE__ */ t("div", { style: { marginBottom: "4px" }, children: s ? /* @__PURE__ */ t(
+          /* @__PURE__ */ i("div", { style: { marginBottom: "4px" }, children: s ? /* @__PURE__ */ i(
             "img",
             {
               src: s,
               alt: l,
               style: { height: "24px", objectFit: "contain" }
             }
-          ) : c ? /* @__PURE__ */ t("div", { style: { display: "flex", alignItems: "center" }, children: c }) : /* @__PURE__ */ t(
+          ) : c ? /* @__PURE__ */ i("div", { style: { display: "flex", alignItems: "center" }, children: c }) : /* @__PURE__ */ i(
             "h3",
             {
               style: {
@@ -70,7 +71,7 @@ function F({
               children: l
             }
           ) }),
-          /* @__PURE__ */ t(
+          /* @__PURE__ */ i(
             "p",
             {
               style: {
@@ -99,24 +100,29 @@ function F({
                 {
                   style: {
                     display: "flex",
+                    padding: e.bgColor ? "4px 8px 4px 6px" : "0",
                     alignItems: "center",
-                    gap: "6px",
-                    fontSize: "13px",
+                    gap: "4px",
+                    borderRadius: e.bgColor ? "16px" : "0",
+                    background: e.bgColor || "transparent",
+                    fontSize: "12px",
+                    fontStyle: "normal",
                     fontWeight: 400,
-                    color: i.color
+                    lineHeight: "16px",
+                    color: e.color
                   },
                   children: [
-                    i.icon,
-                    i.label
+                    e.icon,
+                    e.label
                   ]
                 }
               ),
               /* @__PURE__ */ o("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
-                h && d && /* @__PURE__ */ t(
+                x && d && /* @__PURE__ */ i(
                   "button",
                   {
-                    onClick: (e) => {
-                      e.stopPropagation(), d();
+                    onClick: (t) => {
+                      t.stopPropagation(), d();
                     },
                     style: {
                       display: "flex",
@@ -131,20 +137,20 @@ function F({
                       borderRadius: "4px",
                       transition: "background 0.15s ease"
                     },
-                    onMouseEnter: (e) => {
-                      e.currentTarget.style.background = "rgba(0,0,0,0.04)";
+                    onMouseEnter: (t) => {
+                      t.currentTarget.style.background = "rgba(0,0,0,0.04)";
                     },
-                    onMouseLeave: (e) => {
-                      e.currentTarget.style.background = "transparent";
+                    onMouseLeave: (t) => {
+                      t.currentTarget.style.background = "transparent";
                     },
-                    children: /* @__PURE__ */ t(x, { size: 20, strokeWidth: 2 })
+                    children: /* @__PURE__ */ i(h, { size: 20, strokeWidth: 2 })
                   }
                 ),
-                /* @__PURE__ */ t(
+                /* @__PURE__ */ i(
                   "button",
                   {
-                    onClick: (e) => {
-                      e.stopPropagation(), a == null || a();
+                    onClick: (t) => {
+                      t.stopPropagation(), a == null || a();
                     },
                     disabled: n,
                     style: {
@@ -155,9 +161,9 @@ function F({
                       alignItems: "center",
                       gap: "10px",
                       borderRadius: "10px",
-                      border: i.actionFilled ? "1px solid transparent" : "1px solid #D9D9D9",
-                      background: n ? "var(--Grey-Muted, #B2AEA8)" : i.actionFilled ? "var(--Base-Strong, #1E2125)" : "var(--Base-White, #FFF)",
-                      color: i.actionFilled || n ? "#FFF" : "var(--Base-Strong, #1E2125)",
+                      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)",
                       fontSize: "13px",
                       fontWeight: 600,
                       cursor: n ? "default" : "pointer",
@@ -165,13 +171,13 @@ function F({
                       transition: "all 0.15s ease",
                       lineHeight: 1.4
                     },
-                    onMouseEnter: (e) => {
-                      !n && !i.actionFilled && (e.currentTarget.style.background = "rgba(0,0,0,0.04)");
+                    onMouseEnter: (t) => {
+                      !n && !e.actionFilled && (t.currentTarget.style.background = "rgba(0,0,0,0.04)");
                     },
-                    onMouseLeave: (e) => {
-                      !n && !i.actionFilled && (e.currentTarget.style.background = "var(--Base-White, #FFF)");
+                    onMouseLeave: (t) => {
+                      !n && !e.actionFilled && (t.currentTarget.style.background = "var(--Base-White, #FFF)");
                     },
-                    children: i.actionLabel
+                    children: e.actionLabel
                   }
                 )
               ] })
@@ -183,6 +189,6 @@ function F({
   );
 }
 export {
-  F as I
+  m as I
 };
 //# sourceMappingURL=IntegrationCard.es.js.map

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-Strong, #808183)\",\n      icon: <CheckCircle2 size={16} strokeWidth={2} />,\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            alignItems: \"center\",\n            gap: \"6px\",\n            fontSize: \"13px\",\n            fontWeight: 400,\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","jsx","CheckCircle2","CloudDownload","CloudOff","config","jsxs","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 */}\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":";;;AAkBA,SAAwBA,EAAgB;AAAA,EACtC,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AACF,GAAG;AACD,QAAMC,IAAcL,MAAW,aACzBM,IAAeN,MAAW,eAE1BO,IAAe;AAAA,IACnB,WAAW;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA,MACP,SAAS;AAAA,MACT,wBAAOC,GAAa,EAAA,MAAM,IAAI,aAAa,GAAG,OAAM,QAAO;AAAA,MAC3D,aAAa;AAAA,MACb,cAAc;AAAA,IAChB;AAAA,IACA,WAAW;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA,MACP,MAAO,gBAAAC,EAAAC,GAAA,EAAc,MAAM,IAAI,aAAa,GAAG;AAAA,MAC/C,aAAa;AAAA,MACb,cAAc;AAAA,IAChB;AAAA,IACA,eAAe;AAAA,MACb,OAAO;AAAA,MACP,OAAO;AAAA,MACP,MAAO,gBAAAD,EAAAE,GAAA,EAAS,MAAM,IAAI,aAAa,GAAG;AAAA,MAC1C,aAAa;AAAA,MACb,cAAc;AAAA,IAChB;AAAA,EAAA,GAGIC,IAASL,EAAaP,CAAM,KAAKO,EAAa;AAGlD,SAAA,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,SAAS;AAAA,QACT,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,eAAe;AAAA,QACf,YAAY;AAAA,QACZ,KAAK;AAAA,QACL,cAAc;AAAA,QACd,QAAQ;AAAA,QACR,YAAY;AAAA,MACd;AAAA,MAGA,UAAA;AAAA,QAAA,gBAAAA,EAAC,SAAI,OAAO,EAAE,MAAM,GAAG,OAAO,OAE5B,GAAA,UAAA;AAAA,UAAA,gBAAAJ,EAAC,SAAI,OAAO,EAAE,cAAc,SACzB,UACCR,IAAA,gBAAAQ;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAKR;AAAA,cACL,KAAKH;AAAA,cACL,OAAO,EAAE,QAAQ,QAAQ,WAAW,UAAU;AAAA,YAAA;AAAA,UAE9C,IAAAI,IACD,gBAAAO,EAAA,OAAA,EAAI,OAAO,EAAE,SAAS,QAAQ,YAAY,SAAa,GAAA,UAAAP,EAAA,CAAK,IAE7D,gBAAAO;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,OAAO;AAAA,gBACL,UAAU;AAAA,gBACV,YAAY;AAAA,gBACZ,OAAO;AAAA,gBACP,QAAQ;AAAA,gBACR,YAAY;AAAA,cACd;AAAA,cAEC,UAAAX;AAAA,YAAA;AAAA,UAAA,GAGP;AAAA,UAEA,gBAAAW;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,OAAO;AAAA,gBACL,UAAU;AAAA,gBACV,YAAY;AAAA,gBACZ,OAAO;AAAA,gBACP,QAAQ;AAAA,cACV;AAAA,cAEC,UAAAV;AAAA,YAAA;AAAA,UACH;AAAA,QAAA,GACF;AAAA,QAGA,gBAAAc;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,OAAO;AAAA,cACL,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,gBAAgB;AAAA,cAChB,OAAO;AAAA,cACP,KAAK;AAAA,YACP;AAAA,YAGA,UAAA;AAAA,cAAA,gBAAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,OAAO;AAAA,oBACL,SAAS;AAAA,oBACT,SAASD,EAAO,UAAU,oBAAoB;AAAA,oBAC9C,YAAY;AAAA,oBACZ,KAAK;AAAA,oBACL,cAAcA,EAAO,UAAU,SAAS;AAAA,oBACxC,YAAYA,EAAO,WAAW;AAAA,oBAC9B,UAAU;AAAA,oBACV,WAAW;AAAA,oBACX,YAAY;AAAA,oBACZ,YAAY;AAAA,oBACZ,OAAOA,EAAO;AAAA,kBAChB;AAAA,kBAEC,UAAA;AAAA,oBAAOA,EAAA;AAAA,oBACPA,EAAO;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACV;AAAA,cAGA,gBAAAC,EAAC,OAAI,EAAA,OAAO,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,MAAA,GAEvD,UAAA;AAAA,gBAAAR,KAAeD,KACd,gBAAAK;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,SAAS,CAACK,MAAM;AACd,sBAAAA,EAAE,gBAAgB,GACNV;oBACd;AAAA,oBACA,OAAO;AAAA,sBACL,SAAS;AAAA,sBACT,YAAY;AAAA,sBACZ,gBAAgB;AAAA,sBAChB,OAAO;AAAA,sBACP,QAAQ;AAAA,sBACR,QAAQ;AAAA,sBACR,YAAY;AAAA,sBACZ,OAAO;AAAA,sBACP,QAAQ;AAAA,sBACR,cAAc;AAAA,sBACd,YAAY;AAAA,oBACd;AAAA,oBACA,cAAc,CAACU,MAAM;AACjB,sBAAAA,EAAA,cAAc,MAAM,aAAa;AAAA,oBACrC;AAAA,oBACA,cAAc,CAACA,MAAM;AACjB,sBAAAA,EAAA,cAAc,MAAM,aAAa;AAAA,oBACrC;AAAA,oBAEA,UAAC,gBAAAL,EAAAM,GAAA,EAAU,MAAM,IAAI,aAAa,GAAG;AAAA,kBAAA;AAAA,gBACvC;AAAA,gBAIF,gBAAAN;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,SAAS,CAACK,MAAM;AACd,sBAAAA,EAAE,gBAAgB,GACNX,KAAA,QAAAA;AAAA,oBACd;AAAA,oBACA,UAAUG;AAAA,oBACV,OAAO;AAAA,sBACL,SAAS;AAAA,sBACT,QAAQ;AAAA,sBACR,SAAS;AAAA,sBACT,gBAAgB;AAAA,sBAChB,YAAY;AAAA,sBACZ,KAAK;AAAA,sBACL,cAAc;AAAA,sBACd,QAAQM,EAAO,eACX,0BACA;AAAA,sBACJ,YAAYN,IACR,+BACAM,EAAO,eACP,gCACA;AAAA,sBACJ,OAAOA,EAAO,gBAAgBN,IAC1B,SACA;AAAA,sBACJ,UAAU;AAAA,sBACV,YAAY;AAAA,sBACZ,QAAQA,IAAe,YAAY;AAAA,sBACnC,SAASA,IAAe,MAAM;AAAA,sBAC9B,YAAY;AAAA,sBACZ,YAAY;AAAA,oBACd;AAAA,oBACA,cAAc,CAACQ,MAAM;AACnB,sBAAI,CAACR,KAAgB,CAACM,EAAO,iBACzBE,EAAA,cAAc,MAAM,aAAa;AAAA,oBAEvC;AAAA,oBACA,cAAc,CAACA,MAAM;AACnB,sBAAI,CAACR,KAAgB,CAACM,EAAO,iBACzBE,EAAA,cAAc,MAAM,aAAa;AAAA,oBAEvC;AAAA,oBAEC,UAAOF,EAAA;AAAA,kBAAA;AAAA,gBACV;AAAA,cAAA,GACF;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/common.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../AgentLiftCard.cjs.js"),r=require("../SummarySection.cjs.js"),a=require("../CustomFilterChips.cjs.js"),e=require("../SideDrawer.cjs.js");require("react/jsx-runtime");require("react");require("lucide-react");require("../SmallButton.cjs.js");require("react-dom");require("../TextInput.cjs.js");exports.AgentLiftCard=i.AgentLiftCard;exports.EvidenceItem=i.EvidenceItem;exports.ConditionCard=r.ConditionCard;exports.ModelScoreCard=r.ModelScoreCard;exports.ObservationCard=r.ObservationCard;exports.ScoreDriverCard=r.ScoreDriverCard;exports.ScoreDriverCardVariant=r.ScoreDriverCardVariant;exports.SignalCard=r.SignalCard;exports.SmallObservationCard=r.SmallObservationCard;exports.SummarySection=r.SummarySection;exports.CustomFilterChips=a.CustomFilterChips;exports.Pagination=a.Pagination;exports.AutoSearch=e.AutoSearch;exports.DrawerButton=e.DrawerButton;exports.SideDrawer=e.SideDrawer;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../AgentLiftCard.cjs.js"),r=require("../SummarySection.cjs.js"),i=require("../CustomFilterChips.cjs.js"),e=require("../FileUploadingState.cjs.js");require("react/jsx-runtime");require("react");require("lucide-react");require("../SmallButton.cjs.js");require("react-dom");require("../TextInput.cjs.js");exports.AgentLiftCard=a.AgentLiftCard;exports.EvidenceItem=a.EvidenceItem;exports.ConditionCard=r.ConditionCard;exports.ModelScoreCard=r.ModelScoreCard;exports.ObservationCard=r.ObservationCard;exports.ScoreDriverCard=r.ScoreDriverCard;exports.ScoreDriverCardVariant=r.ScoreDriverCardVariant;exports.SignalCard=r.SignalCard;exports.SmallObservationCard=r.SmallObservationCard;exports.SummarySection=r.SummarySection;exports.CustomFilterChips=i.CustomFilterChips;exports.Pagination=i.Pagination;exports.AutoSearch=e.AutoSearch;exports.DrawerButton=e.DrawerButton;exports.DrawerInput=e.DrawerInput;exports.DrawerLabel=e.DrawerLabel;exports.FileUploadSuccessState=e.FileUploadSuccessState;exports.FileUploadingState=e.FileUploadingState;exports.SideDrawer=e.SideDrawer;
 //# sourceMappingURL=common.cjs.js.map

package/dist/components/common.es.js

@@ -1,7 +1,7 @@
-import { A as d, E as C } from "../AgentLiftCard.es.js";
-import { C as p, M as S, O as c, b as f, c as l, S as v, a as D, d as u } from "../SummarySection.es.js";
-import { C as A, P as b } from "../CustomFilterChips.es.js";
-import { A as O, D as h, S as w } from "../SideDrawer.es.js";
+import { A as m, E as n } from "../AgentLiftCard.es.js";
+import { C as S, M as C, O as c, b as l, c as D, S as u, a as b, d as f } from "../SummarySection.es.js";
+import { C as g, P as w } from "../CustomFilterChips.es.js";
+import { A, D as F, b as O, a as h, c as E, F as I, S as L } from "../FileUploadingState.es.js";
 import "react/jsx-runtime";
 import "react";
 import "lucide-react";
@@ -9,20 +9,24 @@ import "../SmallButton.es.js";
 import "react-dom";
 import "../TextInput.es.js";
 export {
-  d as AgentLiftCard,
-  O as AutoSearch,
-  p as ConditionCard,
-  A as CustomFilterChips,
-  h as DrawerButton,
-  C as EvidenceItem,
-  S as ModelScoreCard,
+  m as AgentLiftCard,
+  A as AutoSearch,
+  S as ConditionCard,
+  g as CustomFilterChips,
+  F as DrawerButton,
+  O as DrawerInput,
+  h as DrawerLabel,
+  n as EvidenceItem,
+  E as FileUploadSuccessState,
+  I as FileUploadingState,
+  C as ModelScoreCard,
   c as ObservationCard,
-  b as Pagination,
-  f as ScoreDriverCard,
-  l as ScoreDriverCardVariant,
-  w as SideDrawer,
-  v as SignalCard,
-  D as SmallObservationCard,
-  u as SummarySection
+  w as Pagination,
+  l as ScoreDriverCard,
+  D as ScoreDriverCardVariant,
+  L as SideDrawer,
+  u as SignalCard,
+  b as SmallObservationCard,
+  f as SummarySection
 };
 //# sourceMappingURL=common.es.js.map

package/dist/components/navigation.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),k=require("react"),n=require("lucide-react"),I={home:n.Home,projects:n.FolderClosed,folder:n.FolderClosed,organization:n.Users,users:n.Users,dashboard:n.LayoutDashboard,history:n.Clock3,sessions:n.Clock3,monitoring:n.Activity,activity:n.Activity,insights:n.Lightbulb,notifications:n.Bell,integrations:n.Plug,settings:n.Settings,usage:n.BarChart3,docs:n.FileText,documentation:n.FileText,agents:n.Headphones,security:n.Shield,configuration:n.Sliders,workflow:n.Workflow};function w(r){return r?typeof r=="string"?I[r.toLowerCase()]||n.SquareDot:r:n.SquareDot}function B({menuItems:r=[],activeId:t,onNavigate:o,collapsed:i,onToggleCollapse:u,header:g,footer:l,width:c=244,collapsedWidth:f=56}){const[s,y]=k.useState(!1),d=i!==void 0?i:s,h=u||(()=>y(!s)),[b,p]=k.useState(()=>{const a={};return r.forEach(x=>{var v;if((v=x.children)!=null&&v.length){const A=x.children.some(S=>S.id===t||S.active);a[x.id]=A}}),a}),T=a=>{p(x=>({...x,[a]:!x[a]}))},m=d?f:c;return e.jsxs("nav",{style:{width:m,minWidth:m,height:"100%",display:"flex",flexDirection:"column",alignItems:"flex-start",padding:d?"0":"0 0 24px 24px",gap:24,background:"var(--Background-Inverse, #0B0B0B)",fontFamily:"var(--font-sans)",transition:"width 0.2s ease, min-width 0.2s ease",overflow:"hidden",flexShrink:0},children:[g&&!d&&e.jsx("div",{style:{padding:"16px 16px 8px",flexShrink:0,width:"100%"},children:g}),e.jsx("div",{style:{display:"flex",justifyContent:d?"center":"flex-end",padding:d?"12px 0":"8px 0 0",flexShrink:0,width:"100%"},children:e.jsx("button",{onClick:h,title:d?"Expand sidebar":"Collapse sidebar",style:{display:"flex",alignItems:"center",justifyContent:"center",width:28,height:28,borderRadius:"var(--radius-sm)",border:"none",background:"transparent",color:"rgba(255, 255, 255, 0.5)",cursor:"pointer",transition:"background 0.15s ease, color 0.15s ease"},onMouseEnter:a=>{a.currentTarget.style.background="rgba(255, 255, 255, 0.08)",a.currentTarget.style.color="rgba(255, 255, 255, 0.8)"},onMouseLeave:a=>{a.currentTarget.style.background="transparent",a.currentTarget.style.color="rgba(255, 255, 255, 0.5)"},children:d?e.jsx(n.PanelLeft,{size:16}):e.jsx(n.PanelLeftClose,{size:16})})}),e.jsx("div",{style:{flex:1,overflowY:"auto",overflowX:"hidden",padding:d?"0 8px":"0",width:"100%"},children:r.map((a,x)=>{var v;return e.jsxs(k.Fragment,{children:[a.section&&!d&&e.jsx("div",{style:{fontSize:"var(--text-xs)",fontWeight:650,letterSpacing:"0.08em",textTransform:"uppercase",color:"rgba(255, 255, 255, 0.35)",padding:"16px 8px 6px",lineHeight:1},children:a.section}),(v=a.children)!=null&&v.length?e.jsx(E,{item:a,activeId:t,expanded:!!b[a.id],onToggle:()=>T(a.id),onNavigate:o,collapsed:d}):e.jsx(C,{item:a,active:a.id===t||a.active,onNavigate:o,collapsed:d})]},a.id||x)})}),l&&!d&&e.jsx("div",{style:{padding:"12px 16px",borderTop:"1px solid rgba(255, 255, 255, 0.08)",flexShrink:0,width:"100%"},children:l})]})}function C({item:r,active:t,onNavigate:o,collapsed:i}){const u=w(r.icon),g=typeof r.icon!="string"&&typeof r.icon<"u";return e.jsxs("button",{onClick:()=>o==null?void 0:o(r.href||r.id),title:i?r.label:void 0,style:{display:"flex",alignItems:"center",gap:i?0:12,justifyContent:i?"center":"flex-start",width:"100%",padding:i?"10px 0":"12px 24px 12px 12px",borderRadius:t?"4px 0 0 4px":"4px",borderRight:t?"2px solid #00A66E":"2px solid transparent",borderTop:"none",borderBottom:"none",borderLeft:"none",background:t?"var(--Background-MonoPressed, #323232)":"transparent",color:t?"#00A66E":"var(--Content-TertiaryInverse, #B2AEA8)",fontWeight:t?550:400,fontSize:"var(--text-sm)",fontFamily:"var(--font-sans)",cursor:"pointer",textAlign:"left",transition:"background 0.15s ease, color 0.1s ease, border-color 0.15s ease",marginBottom:2},onMouseEnter:l=>{t||(l.currentTarget.style.background="var(--Background-MonoPressed, #323232)",l.currentTarget.style.color="#00A66E")},onMouseLeave:l=>{t||(l.currentTarget.style.background="transparent",l.currentTarget.style.color="var(--Content-TertiaryInverse, #B2AEA8)")},children:[g?e.jsx("span",{style:{flexShrink:0,display:"flex"},children:r.icon}):e.jsx(u,{size:18,style:{flexShrink:0,color:"inherit"}}),!i&&e.jsx("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:r.label})]})}function E({item:r,activeId:t,expanded:o,onToggle:i,onNavigate:u,collapsed:g}){var f;const l=w(r.icon),c=(f=r.children)==null?void 0:f.some(s=>s.id===t||s.active);return g?e.jsx("button",{onClick:i,title:r.label,style:{display:"flex",alignItems:"center",justifyContent:"center",width:"100%",padding:"10px 0",borderRadius:"4px",border:"none",background:c?"var(--Background-MonoPressed, #323232)":"transparent",color:c?"#00A66E":"var(--Content-TertiaryInverse, #B2AEA8)",cursor:"pointer",marginBottom:2,transition:"background 0.15s ease"},onMouseEnter:s=>{c||(s.currentTarget.style.background="var(--Background-MonoPressed, #323232)",s.currentTarget.style.color="#00A66E")},onMouseLeave:s=>{c||(s.currentTarget.style.background="transparent",s.currentTarget.style.color="var(--Content-TertiaryInverse, #B2AEA8)")},children:e.jsx(l,{size:18,style:{color:"inherit"}})}):e.jsxs("div",{style:{marginBottom:2},children:[e.jsxs("button",{onClick:i,style:{display:"flex",alignItems:"center",gap:12,width:"100%",padding:"12px 24px 12px 12px",borderRadius:"4px",border:"none",background:"transparent",color:c?"#00A66E":"var(--Content-TertiaryInverse, #B2AEA8)",fontWeight:c?550:400,fontSize:"var(--text-sm)",fontFamily:"var(--font-sans)",cursor:"pointer",textAlign:"left",transition:"background 0.15s ease, color 0.15s ease"},onMouseEnter:s=>{s.currentTarget.style.background="var(--Background-MonoPressed, #323232)",s.currentTarget.style.color="#00A66E"},onMouseLeave:s=>{s.currentTarget.style.background="transparent",c?s.currentTarget.style.color="#00A66E":s.currentTarget.style.color="var(--Content-TertiaryInverse, #B2AEA8)"},children:[e.jsx(l,{size:18,style:{flexShrink:0,color:"inherit"}}),e.jsx("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:r.label}),e.jsx(n.ChevronDown,{size:14,style:{flexShrink:0,color:"inherit",opacity:.7,transform:o?"rotate(0deg)":"rotate(-90deg)",transition:"transform 0.2s ease"}})]}),o&&e.jsx("div",{style:{paddingLeft:18,marginTop:2},children:r.children.map((s,y)=>e.jsx(C,{item:s,active:s.id===t||s.active,onNavigate:u,collapsed:!1},s.id||y))})]})}const j=["#5a8a6e","#b07d4f","#7a8fa6","#c47a5a","#6a9a8a","#a0785a","#5a7a9a","#9a7a5a"];function z(r){if(!r)return j[0];let t=0;for(let o=0;o<r.length;o++)t=(t<<5)-t+r.charCodeAt(o)|0;return j[Math.abs(t)%j.length]}function M({logo:r,title:t,userName:o,userEmail:i,userInitials:u,userRole:g,onSignOut:l,children:c,trailing:f,userMenu:s,height:y=48,style:d}){const h=o||i||"",b=u||D(h);return e.jsxs("header",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",padding:"0 20px",height:y,borderBottom:"1px solid var(--border)",background:"var(--paper-elevated)",flexShrink:0,fontFamily:"var(--font-sans)",position:"sticky",top:0,zIndex:1e3,...d},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:10,flexShrink:0},children:[r!==void 0?r:e.jsx("span",{style:{fontSize:"var(--text-lg)",fontWeight:700,fontFamily:"var(--font-display)",color:"var(--text-ink)",letterSpacing:"-0.01em"},children:"Chordia"}),t&&e.jsxs(e.Fragment,{children:[e.jsx("span",{style:{width:1,height:18,background:"var(--border)",flexShrink:0}}),e.jsx("span",{style:{fontSize:"var(--text-md)",fontWeight:500,color:"var(--text-muted)"},children:t})]})]}),c&&e.jsx("div",{style:{display:"flex",alignItems:"center",gap:8,flex:1,justifyContent:"center",minWidth:0},children:c}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:10,flexShrink:0},children:[f,s||h&&e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8},children:[e.jsx("div",{style:{width:30,height:30,borderRadius:"50%",background:z(h),display:"flex",alignItems:"center",justifyContent:"center",flexShrink:0},children:e.jsx("span",{style:{fontSize:11,fontWeight:600,color:"#fff",letterSpacing:"0.02em",lineHeight:1},children:b})}),e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:1},children:[e.jsx("span",{style:{fontSize:"var(--text-sm)",fontWeight:550,color:"var(--text-strong)",lineHeight:1.2},children:h}),g&&e.jsx("span",{style:{fontSize:"var(--text-xs)",color:"var(--text-muted)",lineHeight:1.2},children:g})]}),l&&e.jsx("button",{onClick:l,title:"Sign out",style:{display:"flex",alignItems:"center",justifyContent:"center",width:28,height:28,borderRadius:"var(--radius-sm)",border:"none",background:"transparent",color:"var(--text-faint)",cursor:"pointer",transition:"background 0.15s ease, color 0.15s ease"},onMouseEnter:p=>{p.currentTarget.style.background="var(--hover-warm)",p.currentTarget.style.color="var(--text-muted)"},onMouseLeave:p=>{p.currentTarget.style.background="transparent",p.currentTarget.style.color="var(--text-faint)"},children:e.jsx(n.LogOut,{size:14})})]})]})]})}function L({label:r,color:t="var(--text-muted)",active:o,onClick:i}){return e.jsxs("button",{onClick:i,style:{display:"flex",alignItems:"center",gap:4,fontSize:"var(--text-sm)",fontWeight:500,fontFamily:"var(--font-sans)",padding:"4px 10px",borderRadius:"var(--radius-sm)",border:`1px solid color-mix(in srgb, ${t} 30%, transparent)`,background:`color-mix(in srgb, ${t} 10%, transparent)`,color:t,cursor:"pointer",transition:"background 0.15s ease, border-color 0.15s ease"},onMouseEnter:u=>{u.currentTarget.style.background=`color-mix(in srgb, ${t} 18%, transparent)`},onMouseLeave:u=>{u.currentTarget.style.background=`color-mix(in srgb, ${t} 10%, transparent)`},children:[r,e.jsx(n.ChevronDown,{size:12,style:{transform:o?"rotate(180deg)":"rotate(0deg)",transition:"transform 0.2s ease",opacity:.7}})]})}function R({open:r,onClose:t,children:o,align:i="left"}){return r?e.jsxs(e.Fragment,{children:[e.jsx("div",{onClick:t,style:{position:"fixed",inset:0,zIndex:99,background:"rgba(0,0,0,0.03)"}}),e.jsx("div",{style:{position:"absolute",top:"100%",[i==="right"?"right":"left"]:0,marginTop:4,zIndex:100,background:"#fff",border:"1px solid var(--border)",borderRadius:"var(--radius)",padding:4,minWidth:200,maxHeight:280,overflowY:"auto",boxShadow:"0 8px 24px rgba(0,0,0,0.12)"},children:o})]}):null}function F({label:r,active:t,onClick:o}){return e.jsx("div",{onClick:o,style:{padding:"8px 10px",borderRadius:"var(--radius-sm)",cursor:"pointer",fontSize:"var(--text-sm)",color:t?"var(--text-ink)":"var(--text-base)",fontWeight:t?600:400,fontFamily:"var(--font-sans)",background:t?"var(--hover-warm)":"transparent",transition:"background 0.1s ease"},onMouseEnter:i=>{t||(i.currentTarget.style.background="var(--hover-warm-subtle)")},onMouseLeave:i=>{t||(i.currentTarget.style.background="transparent")},children:r})}function W({connected:r,label:t}){const o=t||(r?"Connected":"Disconnected");return e.jsx("span",{style:{fontSize:"var(--text-xs)",fontFamily:"var(--font-sans)",padding:"3px 10px",borderRadius:12,border:`1px solid ${r?"var(--state-present)":"var(--border)"}`,color:r?"var(--state-present)":"var(--text-faint)",background:r?"rgba(37,163,114,0.08)":"transparent",transition:"all 0.2s ease"},children:o})}function D(r){if(!r)return"?";const t=r.trim().split(/\s+/);return t.length>=2?(t[0][0]+t[t.length-1][0]).toUpperCase():r.slice(0,2).toUpperCase()}exports.NavDropdown=R;exports.NavDropdownItem=F;exports.NavPill=L;exports.NavigationBar=M;exports.Sidebar=B;exports.StatusIndicator=W;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),k=require("react"),n=require("lucide-react"),I={home:n.Home,projects:n.FolderClosed,folder:n.FolderClosed,organization:n.Users,users:n.Users,dashboard:n.LayoutDashboard,history:n.Clock3,sessions:n.Clock3,monitoring:n.Activity,activity:n.Activity,insights:n.Lightbulb,notifications:n.Bell,integrations:n.Plug,settings:n.Settings,usage:n.BarChart3,docs:n.FileText,documentation:n.FileText,agents:n.Headphones,security:n.Shield,configuration:n.Sliders,workflow:n.Workflow};function B(r){return r?typeof r=="string"?I[r.toLowerCase()]||n.SquareDot:r:n.SquareDot}function A({menuItems:r=[],activeId:t,onNavigate:s,collapsed:i,onToggleCollapse:c,header:g,footer:l,width:u=244,collapsedWidth:f=56}){const[o,y]=k.useState(!1),d=i!==void 0?i:o,h=c||(()=>y(!o)),[b,x]=k.useState(()=>{const a={};return r.forEach(p=>{var v;if((v=p.children)!=null&&v.length){const C=p.children.some(S=>S.id===t||S.active);a[p.id]=C}}),a}),w=a=>{x(p=>({...p,[a]:!p[a]}))},j=d?f:u;return e.jsxs("nav",{style:{width:j,minWidth:j,height:"100%",display:"flex",flexDirection:"column",alignItems:"flex-start",padding:d?"0":"0 0 24px 24px",gap:24,background:"var(--Background-Inverse, #0B0B0B)",fontFamily:"var(--font-sans)",transition:"width 0.2s ease, min-width 0.2s ease",overflow:"hidden",flexShrink:0},children:[g&&!d&&e.jsx("div",{style:{padding:"16px 16px 8px",flexShrink:0,width:"100%"},children:g}),e.jsx("div",{style:{display:"flex",justifyContent:d?"center":"flex-end",padding:d?"12px 0":"8px 0 0",flexShrink:0,width:"100%"},children:e.jsx("button",{onClick:h,title:d?"Expand sidebar":"Collapse sidebar",style:{display:"flex",alignItems:"center",justifyContent:"center",width:28,height:28,borderRadius:"var(--radius-sm)",border:"none",background:"transparent",color:"rgba(255, 255, 255, 0.5)",cursor:"pointer",transition:"background 0.15s ease, color 0.15s ease"},onMouseEnter:a=>{a.currentTarget.style.background="rgba(255, 255, 255, 0.08)",a.currentTarget.style.color="rgba(255, 255, 255, 0.8)"},onMouseLeave:a=>{a.currentTarget.style.background="transparent",a.currentTarget.style.color="rgba(255, 255, 255, 0.5)"},children:d?e.jsx(n.PanelLeft,{size:16}):e.jsx(n.PanelLeftClose,{size:16})})}),e.jsx("div",{style:{flex:1,overflowY:"auto",overflowX:"hidden",padding:d?"0 8px":"0",width:"100%"},children:r.map((a,p)=>{var v;return e.jsxs(k.Fragment,{children:[a.section&&!d&&e.jsx("div",{style:{fontSize:"var(--text-xs)",fontWeight:650,letterSpacing:"0.08em",textTransform:"uppercase",color:"rgba(255, 255, 255, 0.35)",padding:"16px 8px 6px",lineHeight:1},children:a.section}),(v=a.children)!=null&&v.length?e.jsx(z,{item:a,activeId:t,expanded:!!b[a.id],onToggle:()=>w(a.id),onNavigate:s,collapsed:d}):e.jsx(T,{item:a,active:a.id===t||a.active,onNavigate:s,collapsed:d})]},a.id||p)})}),l&&!d&&e.jsx("div",{style:{padding:"12px 16px",borderTop:"1px solid rgba(255, 255, 255, 0.08)",flexShrink:0,width:"100%"},children:l})]})}function T({item:r,active:t,onNavigate:s,collapsed:i}){const c=B(r.icon),g=typeof r.icon!="string"&&typeof r.icon<"u";return e.jsxs("button",{onClick:()=>s==null?void 0:s(r.href||r.id),title:i?r.label:void 0,style:{display:"flex",alignItems:"center",gap:i?0:12,justifyContent:i?"center":"flex-start",width:"100%",padding:i?"10px 0":"12px 24px 12px 12px",borderRadius:t?"4px 0 0 4px":"4px",borderRight:t?"2px solid #00A66E":"2px solid transparent",borderTop:"none",borderBottom:"none",borderLeft:"none",background:t?"var(--Background-MonoPressed, #323232)":"transparent",color:t?"var(--Brand-400, #33B88B)":"var(--Content-TertiaryInverse, #B2AEA8)",fontWeight:500,fontSize:"12px",fontStyle:"normal",lineHeight:"120%",textTransform:"uppercase",fontFamily:"var(--font-sans)",cursor:"pointer",textAlign:"left",transition:"background 0.15s ease, color 0.1s ease, border-color 0.15s ease",marginBottom:2},onMouseEnter:l=>{t||(l.currentTarget.style.background="var(--Background-MonoPressed, #323232)",l.currentTarget.style.color="var(--Brand-400, #33B88B)")},onMouseLeave:l=>{t||(l.currentTarget.style.background="transparent",l.currentTarget.style.color="var(--Content-TertiaryInverse, #B2AEA8)")},children:[g?e.jsx("span",{style:{flexShrink:0,display:"flex"},children:r.icon}):e.jsx(c,{size:18,style:{flexShrink:0,color:"inherit"}}),!i&&e.jsx("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:r.label})]})}function z({item:r,activeId:t,expanded:s,onToggle:i,onNavigate:c,collapsed:g}){var f;const l=B(r.icon),u=(f=r.children)==null?void 0:f.some(o=>o.id===t||o.active);return g?e.jsx("button",{onClick:i,title:r.label,style:{display:"flex",alignItems:"center",justifyContent:"center",width:"100%",padding:"10px 0",borderRadius:"4px",border:"none",background:u?"var(--Background-MonoPressed, #323232)":"transparent",color:u?"var(--Brand-400, #33B88B)":"var(--Content-TertiaryInverse, #B2AEA8)",cursor:"pointer",marginBottom:2,transition:"background 0.15s ease"},onMouseEnter:o=>{u||(o.currentTarget.style.background="var(--Background-MonoPressed, #323232)",o.currentTarget.style.color="var(--Brand-400, #33B88B)")},onMouseLeave:o=>{u||(o.currentTarget.style.background="transparent",o.currentTarget.style.color="var(--Content-TertiaryInverse, #B2AEA8)")},children:e.jsx(l,{size:18,style:{color:"inherit"}})}):e.jsxs("div",{style:{marginBottom:2},children:[e.jsxs("button",{onClick:i,style:{display:"flex",alignItems:"center",gap:12,width:"100%",padding:"12px 24px 12px 12px",borderRadius:"4px",border:"none",background:"transparent",color:u?"var(--Brand-400, #33B88B)":"var(--Content-TertiaryInverse, #B2AEA8)",fontWeight:700,fontSize:"12px",fontStyle:"normal",lineHeight:"120%",textTransform:"uppercase",fontFamily:"var(--font-sans)",cursor:"pointer",textAlign:"left",transition:"background 0.15s ease, color 0.15s ease"},onMouseEnter:o=>{o.currentTarget.style.background="var(--Background-MonoPressed, #323232)",o.currentTarget.style.color="var(--Brand-400, #33B88B)"},onMouseLeave:o=>{o.currentTarget.style.background="transparent",u?o.currentTarget.style.color="var(--Brand-400, #33B88B)":o.currentTarget.style.color="var(--Content-TertiaryInverse, #B2AEA8)"},children:[e.jsx(l,{size:18,style:{flexShrink:0,color:"inherit"}}),e.jsx("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:r.label}),e.jsx(n.ChevronDown,{size:14,style:{flexShrink:0,color:"inherit",opacity:.7,transform:s?"rotate(0deg)":"rotate(-90deg)",transition:"transform 0.2s ease"}})]}),s&&e.jsx("div",{style:{paddingLeft:18,marginTop:2},children:r.children.map((o,y)=>e.jsx(T,{item:o,active:o.id===t||o.active,onNavigate:c,collapsed:!1},o.id||y))})]})}const m=["#5a8a6e","#b07d4f","#7a8fa6","#c47a5a","#6a9a8a","#a0785a","#5a7a9a","#9a7a5a"];function M(r){if(!r)return m[0];let t=0;for(let s=0;s<r.length;s++)t=(t<<5)-t+r.charCodeAt(s)|0;return m[Math.abs(t)%m.length]}function E({logo:r,title:t,userName:s,userEmail:i,userInitials:c,userRole:g,onSignOut:l,children:u,trailing:f,userMenu:o,height:y=48,style:d}){const h=s||i||"",b=c||D(h);return e.jsxs("header",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",padding:"0 20px",height:y,borderBottom:"1px solid var(--border)",background:"var(--paper-elevated)",flexShrink:0,fontFamily:"var(--font-sans)",position:"sticky",top:0,zIndex:1e3,...d},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:10,flexShrink:0},children:[r!==void 0?r:e.jsx("span",{style:{fontSize:"var(--text-lg)",fontWeight:700,fontFamily:"var(--font-display)",color:"var(--text-ink)",letterSpacing:"-0.01em"},children:"Chordia"}),t&&e.jsxs(e.Fragment,{children:[e.jsx("span",{style:{width:1,height:18,background:"var(--border)",flexShrink:0}}),e.jsx("span",{style:{fontSize:"var(--text-md)",fontWeight:500,color:"var(--text-muted)"},children:t})]})]}),u&&e.jsx("div",{style:{display:"flex",alignItems:"center",gap:8,flex:1,justifyContent:"center",minWidth:0},children:u}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:10,flexShrink:0},children:[f,o||h&&e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8},children:[e.jsx("div",{style:{width:30,height:30,borderRadius:"50%",background:M(h),display:"flex",alignItems:"center",justifyContent:"center",flexShrink:0},children:e.jsx("span",{style:{fontSize:11,fontWeight:600,color:"#fff",letterSpacing:"0.02em",lineHeight:1},children:b})}),e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:1},children:[e.jsx("span",{style:{fontSize:"var(--text-sm)",fontWeight:550,color:"var(--text-strong)",lineHeight:1.2},children:h}),g&&e.jsx("span",{style:{fontSize:"var(--text-xs)",color:"var(--text-muted)",lineHeight:1.2},children:g})]}),l&&e.jsx("button",{onClick:l,title:"Sign out",style:{display:"flex",alignItems:"center",justifyContent:"center",width:28,height:28,borderRadius:"var(--radius-sm)",border:"none",background:"transparent",color:"var(--text-faint)",cursor:"pointer",transition:"background 0.15s ease, color 0.15s ease"},onMouseEnter:x=>{x.currentTarget.style.background="var(--hover-warm)",x.currentTarget.style.color="var(--text-muted)"},onMouseLeave:x=>{x.currentTarget.style.background="transparent",x.currentTarget.style.color="var(--text-faint)"},children:e.jsx(n.LogOut,{size:14})})]})]})]})}function L({label:r,color:t="var(--text-muted)",active:s,onClick:i}){return e.jsxs("button",{onClick:i,style:{display:"flex",alignItems:"center",gap:4,fontSize:"var(--text-sm)",fontWeight:500,fontFamily:"var(--font-sans)",padding:"4px 10px",borderRadius:"var(--radius-sm)",border:`1px solid color-mix(in srgb, ${t} 30%, transparent)`,background:`color-mix(in srgb, ${t} 10%, transparent)`,color:t,cursor:"pointer",transition:"background 0.15s ease, border-color 0.15s ease"},onMouseEnter:c=>{c.currentTarget.style.background=`color-mix(in srgb, ${t} 18%, transparent)`},onMouseLeave:c=>{c.currentTarget.style.background=`color-mix(in srgb, ${t} 10%, transparent)`},children:[r,e.jsx(n.ChevronDown,{size:12,style:{transform:s?"rotate(180deg)":"rotate(0deg)",transition:"transform 0.2s ease",opacity:.7}})]})}function R({open:r,onClose:t,children:s,align:i="left"}){return r?e.jsxs(e.Fragment,{children:[e.jsx("div",{onClick:t,style:{position:"fixed",inset:0,zIndex:99,background:"rgba(0,0,0,0.03)"}}),e.jsx("div",{style:{position:"absolute",top:"100%",[i==="right"?"right":"left"]:0,marginTop:4,zIndex:100,background:"#fff",border:"1px solid var(--border)",borderRadius:"var(--radius)",padding:4,minWidth:200,maxHeight:280,overflowY:"auto",boxShadow:"0 8px 24px rgba(0,0,0,0.12)"},children:s})]}):null}function F({label:r,active:t,onClick:s}){return e.jsx("div",{onClick:s,style:{padding:"8px 10px",borderRadius:"var(--radius-sm)",cursor:"pointer",fontSize:"var(--text-sm)",color:t?"var(--text-ink)":"var(--text-base)",fontWeight:t?600:400,fontFamily:"var(--font-sans)",background:t?"var(--hover-warm)":"transparent",transition:"background 0.1s ease"},onMouseEnter:i=>{t||(i.currentTarget.style.background="var(--hover-warm-subtle)")},onMouseLeave:i=>{t||(i.currentTarget.style.background="transparent")},children:r})}function W({connected:r,label:t}){const s=t||(r?"Connected":"Disconnected");return e.jsx("span",{style:{fontSize:"var(--text-xs)",fontFamily:"var(--font-sans)",padding:"3px 10px",borderRadius:12,border:`1px solid ${r?"var(--state-present)":"var(--border)"}`,color:r?"var(--state-present)":"var(--text-faint)",background:r?"rgba(37,163,114,0.08)":"transparent",transition:"all 0.2s ease"},children:s})}function D(r){if(!r)return"?";const t=r.trim().split(/\s+/);return t.length>=2?(t[0][0]+t[t.length-1][0]).toUpperCase():r.slice(0,2).toUpperCase()}exports.NavDropdown=R;exports.NavDropdownItem=F;exports.NavPill=L;exports.NavigationBar=E;exports.Sidebar=A;exports.StatusIndicator=W;
 //# sourceMappingURL=navigation.cjs.js.map