npm - @burdenoff/microfe-bigconsole - Versions diffs - 2026.729.1 → 2026.729.3 - Mend

@burdenoff/microfe-bigconsole 2026.729.1 → 2026.729.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (113) hide show

package/dist/bigconsole/components/parser/ParserSelector.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ParserSelector.js","names":[],"sources":["../../../../src/bigconsole/components/parser/ParserSelector.tsx"],"sourcesContent":["/*\n Parser Selector\n \n Dropdown component for selecting a parser.\n * Shows both dashboard-specific parsers and global parsers.\n /\n\nimport { memo, useState, useEffect, useCallback, Fragment, useMemo } from 'react';\nimport { useParserOperations } from '../../hooks/useParserOperations';\nimport { ParserTypeBadge } from './ParserTypeBadge';\nimport { ParserStatusBadge } from './ParserStatusBadge';\nimport type { ParserType, ParserStatus } from '../../types';\n\n// Default console ID for global parsers\nconst DEFAULT_CONSOLE_ID = 'default';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface ParserSelectorProps {\n /* Console ID /\n consoleId: string;\n /* Currently selected parser ID /\n value: string \| null;\n /* Callback when selection changes /\n onChange: (id: string \| null) => void;\n /* Filter by type /\n filterType?: ParserType;\n /* Filter by status /\n filterStatus?: ParserStatus;\n /* Filter by input DataSink key /\n filterInputSinkKey?: string \| null;\n /* Placeholder text /\n placeholder?: string;\n /* Whether the selector is disabled /\n disabled?: boolean;\n /* Whether to show error state /\n error?: boolean;\n /* Error message to display /\n errorMessage?: string;\n}\n\n// ============================================================================\n// ICONS\n// ============================================================================\n\nconst ChevronDownIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M19 9l-7 7-7-7\" />\n </svg>\n);\n\nconst GlobeIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M12 21a9 9 0 100-18 9 9 0 000 18z\" />\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M3.6 9h16.8M3.6 15h16.8\" />\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M12 3a15 15 0 014 9 15 15 0 01-4 9 15 15 0 01-4-9 15 15 0 014-9z\"\n />\n </svg>\n);\n\n// ============================================================================\n// PARSER OPTION BUTTON\n// ============================================================================\n\ninterface ParserOptionButtonProps {\n parser: {\n id: string;\n name: string;\n description: string \| null;\n type: 'jq' \| 'jsonata';\n inputSinkKey: string;\n outputKey: string;\n status: 'active' \| 'inactive';\n };\n isSelected: boolean;\n onSelect: (id: string) => void;\n isGlobal?: boolean;\n}\n\nconst ParserOptionButton = memo(function ParserOptionButton({\n parser,\n isSelected,\n onSelect,\n isGlobal = false,\n}: ParserOptionButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={() => onSelect(parser.id)}\n className={`\n w-full px-3 py-2.5\n text-left\n hover:bg-bg-sunken\n transition-colors\n border-b border-border-default last:border-b-0\n ${isSelected ? 'bg-action-primary-bg/10' : ''}\n `}\n >\n <div className=\"flex items-start justify-between gap-2\">\n <div className=\"flex-1 min-w-0\">\n {/ Name and type /}\n <div className=\"flex items-center gap-2 mb-1\">\n <ParserTypeBadge type={parser.type} size=\"sm\" />\n <span className=\"text-sm font-medium text-text-primary truncate\">{parser.name}</span>\n {isGlobal && (\n <span className=\"inline-flex items-center gap-1 px-1.5 py-0.5 text-xs bg-bg-sunken text-text-secondary rounded\">\n <GlobeIcon className=\"w-3 h-3\" />\n Global\n </span>\n )}\n </div>\n\n {/ Description /}\n {parser.description && <p className=\"text-xs text-text-secondary line-clamp-1 mb-1\">{parser.description}</p>}\n\n {/ Data flow /}\n <div className=\"flex items-center gap-2 text-xs text-text-tertiary\">\n <span>\n {parser.inputSinkKey} → {parser.outputKey}\n </span>\n </div>\n </div>\n\n {/ Status badge /}\n <div>\n <ParserStatusBadge status={parser.status} size=\"sm\" showIcon={false} />\n </div>\n </div>\n </button>\n );\n});\n\n// ============================================================================\n// MAIN COMPONENT\n// ============================================================================\n\nexport const ParserSelector = memo(function ParserSelector({\n consoleId,\n value,\n onChange,\n filterType,\n filterStatus = 'active',\n filterInputSinkKey,\n placeholder = 'Select a parser...',\n disabled = false,\n error = false,\n errorMessage,\n}: ParserSelectorProps) {\n const [isOpen, setIsOpen] = useState(false);\n const [searchQuery, setSearchQuery] = useState('');\n\n // Determine if we need to fetch global parsers separately\n const isGlobalConsole = consoleId === DEFAULT_CONSOLE_ID;\n\n // Fetch dashboard-specific parsers\n const {\n parsers: dashboardParsers,\n loading: dashboardLoading,\n fetchParsers: fetchDashboardParsers,\n } = useParserOperations({\n consoleId,\n skipFetch: isGlobalConsole, // Skip if already fetching global\n });\n\n // Fetch global parsers (only if consoleId is not already 'default')\n const {\n parsers: globalParsers,\n loading: globalLoading,\n fetchParsers: fetchGlobalParsers,\n } = useParserOperations({\n consoleId: DEFAULT_CONSOLE_ID,\n skipFetch: isGlobalConsole, // Skip if consoleId is already 'default'\n });\n\n // Combine parsers: dashboard-specific + global (avoiding duplicates)\n const allParsers = useMemo(() => {\n if (isGlobalConsole) {\n // If we're already on global console, just return dashboard parsers\n return dashboardParsers;\n }\n\n // Combine both, with dashboard parsers first\n const parserIds = new Set(dashboardParsers.map((p) => p.id));\n const uniqueGlobalParsers = globalParsers.filter((p) => !parserIds.has(p.id));\n\n return [...dashboardParsers, ...uniqueGlobalParsers];\n }, [dashboardParsers, globalParsers, isGlobalConsole]);\n\n // Combined loading state\n const loading = dashboardLoading \|\| globalLoading;\n\n // Filter parsers\n const filteredParsers = useMemo(() => {\n return allParsers.filter((p) => {\n // Filter by type if specified\n if (filterType && p.type !== filterType) return false;\n\n // Filter by status if specified\n if (filterStatus && p.status !== filterStatus) return false;\n\n // Filter by input DataSink key if specified\n if (filterInputSinkKey && p.inputSinkKey !== filterInputSinkKey) return false;\n\n // Filter by search query\n if (searchQuery) {\n const query = searchQuery.toLowerCase();\n return (\n p.name.toLowerCase().includes(query) \|\|\n p.description?.toLowerCase().includes(query) \|\|\n p.inputSinkKey.toLowerCase().includes(query) \|\|\n p.outputKey.toLowerCase().includes(query)\n );\n }\n\n return true;\n });\n }, [allParsers, filterType, filterStatus, filterInputSinkKey, searchQuery]);\n\n // Group parsers by scope for display\n const { dashboardScopedParsers, globalScopedParsers } = useMemo(() => {\n const dashboard = filteredParsers.filter((p) => p.consoleId !== DEFAULT_CONSOLE_ID);\n const global = filteredParsers.filter((p) => p.consoleId === DEFAULT_CONSOLE_ID);\n return { dashboardScopedParsers: dashboard, globalScopedParsers: global };\n }, [filteredParsers]);\n\n // Find selected parser\n const selectedParser = allParsers.find((p) => p.id === value);\n\n // Fetch parsers when console changes or DataSink filter changes\n useEffect(() => {\n if (consoleId) {\n fetchDashboardParsers({ type: filterType, status: filterStatus ?? undefined });\n\n // Also fetch global parsers if not already on global console\n if (!isGlobalConsole) {\n fetchGlobalParsers({ type: filterType, status: filterStatus ?? undefined });\n }\n }\n }, [\n consoleId,\n filterType,\n filterStatus,\n filterInputSinkKey,\n fetchDashboardParsers,\n fetchGlobalParsers,\n isGlobalConsole,\n ]);\n\n // Handle selection\n const handleSelect = useCallback(\n (id: string \| null) => {\n onChange(id);\n setIsOpen(false);\n setSearchQuery('');\n },\n [onChange]\n );\n\n // Toggle dropdown\n const handleToggle = useCallback(() => {\n if (!disabled) {\n setIsOpen((prev) => !prev);\n }\n }, [disabled]);\n\n // Close dropdown\n const handleClose = useCallback(() => {\n setIsOpen(false);\n }, []);\n\n return (\n <div className=\"relative\">\n {/ Trigger button /}\n <button\n type=\"button\"\n onClick={handleToggle}\n disabled={disabled}\n className={`\n w-full\n px-3 py-2\n bg-bg-surface\n border rounded-md\n text-left\n flex items-center justify-between gap-2\n transition-colors\n ${disabled ? 'opacity-50 cursor-not-allowed' : 'hover:border-action-primary-bg cursor-pointer'}\n ${error ? 'border-state-error' : 'border-border-default'}\n ${isOpen ? 'border-action-primary-bg ring-2 ring-action-primary-bg/20' : ''}\n `}\n >\n <div className=\"flex-1 min-w-0\">\n {selectedParser ? (\n <div className=\"flex items-center gap-2\">\n <ParserTypeBadge type={selectedParser.type} size=\"sm\" />\n <span className=\"text-sm text-text-primary truncate\">{selectedParser.name}</span>\n </div>\n ) : (\n <span className=\"text-sm text-text-tertiary\">{placeholder}</span>\n )}\n </div>\n\n <ChevronDownIcon\n className={`w-4 h-4 text-text-secondary transition-transform ${isOpen ? 'transform rotate-180' : ''}`}\n />\n </button>\n\n {/ Error message /}\n {error && errorMessage && <p className=\"mt-1 text-xs text-state-error\">{errorMessage}</p>}\n\n {/ Dropdown /}\n {isOpen && (\n <Fragment>\n {/ Backdrop /}\n <div className=\"fixed inset-0 z-10\" onClick={handleClose} />\n\n {/ Dropdown content /}\n <div className=\"absolute left-0 right-0 top-full mt-1 z-20 bg-bg-surface border border-border-default rounded-md shadow-lg max-h-80 flex flex-col overflow-hidden\">\n {/ Search input /}\n <div className=\"p-2 border-b border-border-default\">\n <input\n type=\"text\"\n placeholder=\"Search parsers...\"\n value={searchQuery}\n onChange={(e) => setSearchQuery(e.target.value)}\n className={`\n w-full px-3 py-2\n bg-bg-sunken\n border border-border-default\n rounded-md\n text-sm text-text-primary\n placeholder-text-tertiary\n focus:outline-none\n focus:border-action-primary-bg\n focus:ring-2\n focus:ring-action-primary-bg/20\n `}\n />\n </div>\n\n {/ Options list /}\n <div className=\"overflow-y-auto flex-1\">\n {loading ? (\n <div className=\"p-4 text-center text-sm text-text-secondary\">Loading parsers...</div>\n ) : filteredParsers.length === 0 ? (\n <div className=\"p-4 text-center text-sm text-text-secondary\">No parsers found</div>\n ) : (\n <Fragment>\n {/ None option /}\n <button\n type=\"button\"\n onClick={() => handleSelect(null)}\n className={`\n w-full px-3 py-2\n text-left text-sm\n hover:bg-bg-sunken\n transition-colors\n ${value === null ? 'bg-action-primary-bg/10 text-action-primary-bg' : 'text-text-secondary'}\n `}\n >\n <span className=\"italic\">None</span>\n </button>\n\n {/ Dashboard-scoped parsers section /}\n {dashboardScopedParsers.length > 0 && (\n <Fragment>\n <div className=\"px-3 py-1.5 bg-bg-sunken border-y border-border-default\">\n <span className=\"text-xs font-medium text-text-secondary uppercase tracking-wide\">\n Dashboard Parsers\n </span>\n </div>\n {dashboardScopedParsers.map((parser) => (\n <ParserOptionButton\n key={parser.id}\n parser={parser}\n isSelected={value === parser.id}\n onSelect={handleSelect}\n />\n ))}\n </Fragment>\n )}\n\n {/ Global parsers section */}\n {globalScopedParsers.length > 0 && (\n <Fragment>\n <div className=\"px-3 py-1.5 bg-bg-sunken border-y border-border-default\">\n <span className=\"text-xs font-medium text-text-secondary uppercase tracking-wide\">\n Global Parsers\n </span>\n </div>\n {globalScopedParsers.map((parser) => (\n <ParserOptionButton\n key={parser.id}\n parser={parser}\n isSelected={value === parser.id}\n onSelect={handleSelect}\n isGlobal\n />\n ))}\n </Fragment>\n )}\n </Fragment>\n )}\n </div>\n </div>\n </Fragment>\n )}\n </div>\n );\n});\n\nexport default ParserSelector;\n"],"mappings":"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"}
1	+ {"version":3,"file":"ParserSelector.js","names":[],"sources":["../../../../src/bigconsole/components/parser/ParserSelector.tsx"],"sourcesContent":["/*\n Parser Selector\n \n Dropdown component for selecting a parser.\n * Shows both dashboard-specific parsers and global parsers.\n /\n\nimport { memo, useState, useEffect, useCallback, Fragment, useMemo } from 'react';\nimport { useParserOperations } from '../../hooks/useParserOperations';\nimport { ParserTypeBadge } from './ParserTypeBadge';\nimport { ParserStatusBadge } from './ParserStatusBadge';\nimport type { ParserType, ParserStatus } from '../../types';\n\n// Default console ID for global parsers\nconst DEFAULT_CONSOLE_ID = 'default';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface ParserSelectorProps {\n /* Console ID /\n consoleId: string;\n /* Currently selected parser ID /\n value: string \| null;\n /* Callback when selection changes /\n onChange: (id: string \| null) => void;\n /* Filter by type /\n filterType?: ParserType;\n /* Filter by status /\n filterStatus?: ParserStatus;\n /* Filter by input DataSink key /\n filterInputSinkKey?: string \| null;\n /* Placeholder text /\n placeholder?: string;\n /* Whether the selector is disabled /\n disabled?: boolean;\n /* Whether to show error state /\n error?: boolean;\n /* Error message to display /\n errorMessage?: string;\n}\n\n// ============================================================================\n// ICONS\n// ============================================================================\n\nconst ChevronDownIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M19 9l-7 7-7-7\" />\n </svg>\n);\n\nconst GlobeIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M12 21a9 9 0 100-18 9 9 0 000 18z\" />\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M3.6 9h16.8M3.6 15h16.8\" />\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M12 3a15 15 0 014 9 15 15 0 01-4 9 15 15 0 01-4-9 15 15 0 014-9z\"\n />\n </svg>\n);\n\n// ============================================================================\n// PARSER OPTION BUTTON\n// ============================================================================\n\ninterface ParserOptionButtonProps {\n parser: {\n id: string;\n name: string;\n description: string \| null;\n type: 'jq' \| 'jsonata';\n inputSinkKey: string;\n outputKey: string;\n status: 'active' \| 'inactive';\n };\n isSelected: boolean;\n onSelect: (id: string) => void;\n isGlobal?: boolean;\n}\n\nconst ParserOptionButton = memo(function ParserOptionButton({\n parser,\n isSelected,\n onSelect,\n isGlobal = false,\n}: ParserOptionButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={() => onSelect(parser.id)}\n className={`\n w-full px-3 py-2.5\n text-left\n hover:bg-bg-sunken\n transition-colors\n border-b border-border-default last:border-b-0\n ${isSelected ? 'bg-action-primary-bg/10' : ''}\n `}\n >\n <div className=\"flex items-start justify-between gap-2\">\n <div className=\"flex-1 min-w-0\">\n {/ Name and type /}\n <div className=\"flex items-center gap-2 mb-1\">\n <ParserTypeBadge type={parser.type} size=\"sm\" />\n <span className=\"text-sm font-medium text-text-primary truncate\">{parser.name}</span>\n {isGlobal && (\n <span className=\"inline-flex items-center gap-1 px-1.5 py-0.5 text-xs bg-bg-sunken text-text-secondary rounded\">\n <GlobeIcon className=\"w-3 h-3\" />\n Global\n </span>\n )}\n </div>\n\n {/ Description /}\n {parser.description && <p className=\"text-xs text-text-secondary line-clamp-1 mb-1\">{parser.description}</p>}\n\n {/ Data flow /}\n <div className=\"flex items-center gap-2 text-xs text-text-tertiary\">\n <span>\n {parser.inputSinkKey} → {parser.outputKey}\n </span>\n </div>\n </div>\n\n {/ Status badge /}\n <div>\n <ParserStatusBadge status={parser.status} size=\"sm\" showIcon={false} />\n </div>\n </div>\n </button>\n );\n});\n\n// ============================================================================\n// MAIN COMPONENT\n// ============================================================================\n\nexport const ParserSelector = memo(function ParserSelector({\n consoleId,\n value,\n onChange,\n filterType,\n filterStatus = 'active',\n filterInputSinkKey,\n placeholder = 'Select a parser...',\n disabled = false,\n error = false,\n errorMessage,\n}: ParserSelectorProps) {\n const [isOpen, setIsOpen] = useState(false);\n const [searchQuery, setSearchQuery] = useState('');\n\n // Determine if we need to fetch global parsers separately\n const isGlobalConsole = consoleId === DEFAULT_CONSOLE_ID;\n\n // Fetch dashboard-specific parsers\n const {\n parsers: dashboardParsers,\n loading: dashboardLoading,\n fetchParsers: fetchDashboardParsers,\n } = useParserOperations({\n consoleId,\n skipFetch: isGlobalConsole, // Skip if already fetching global\n });\n\n // Fetch global parsers (only if consoleId is not already 'default')\n const {\n parsers: globalParsers,\n loading: globalLoading,\n fetchParsers: fetchGlobalParsers,\n } = useParserOperations({\n consoleId: DEFAULT_CONSOLE_ID,\n skipFetch: isGlobalConsole, // Skip if consoleId is already 'default'\n });\n\n // Combine parsers: dashboard-specific + global (avoiding duplicates)\n const allParsers = useMemo(() => {\n if (isGlobalConsole) {\n // If we're already on global console, just return dashboard parsers\n return dashboardParsers;\n }\n\n // Combine both, with dashboard parsers first\n const parserIds = new Set(dashboardParsers.map((p) => p.id));\n const uniqueGlobalParsers = globalParsers.filter((p) => !parserIds.has(p.id));\n\n return [...dashboardParsers, ...uniqueGlobalParsers];\n }, [dashboardParsers, globalParsers, isGlobalConsole]);\n\n // Combined loading state\n const loading = dashboardLoading \|\| globalLoading;\n\n // Filter parsers\n const filteredParsers = useMemo(() => {\n return allParsers.filter((p) => {\n // Filter by type if specified\n if (filterType && p.type !== filterType) return false;\n\n // Filter by status if specified\n if (filterStatus && p.status !== filterStatus) return false;\n\n // Filter by input DataSink key if specified\n if (filterInputSinkKey && p.inputSinkKey !== filterInputSinkKey) return false;\n\n // Filter by search query\n if (searchQuery) {\n const query = searchQuery.toLowerCase();\n return (\n p.name.toLowerCase().includes(query) \|\|\n p.description?.toLowerCase().includes(query) \|\|\n p.inputSinkKey.toLowerCase().includes(query) \|\|\n p.outputKey.toLowerCase().includes(query)\n );\n }\n\n return true;\n });\n }, [allParsers, filterType, filterStatus, filterInputSinkKey, searchQuery]);\n\n // Group parsers by scope for display\n const { dashboardScopedParsers, globalScopedParsers } = useMemo(() => {\n const dashboard = filteredParsers.filter((p) => p.consoleId !== DEFAULT_CONSOLE_ID);\n const global = filteredParsers.filter((p) => p.consoleId === DEFAULT_CONSOLE_ID);\n return { dashboardScopedParsers: dashboard, globalScopedParsers: global };\n }, [filteredParsers]);\n\n // Find selected parser\n const selectedParser = allParsers.find((p) => p.id === value);\n\n // Fetch parsers when console changes or DataSink filter changes\n useEffect(() => {\n if (consoleId) {\n fetchDashboardParsers({ type: filterType, status: filterStatus ?? undefined });\n\n // Also fetch global parsers if not already on global console\n if (!isGlobalConsole) {\n fetchGlobalParsers({ type: filterType, status: filterStatus ?? undefined });\n }\n }\n }, [\n consoleId,\n filterType,\n filterStatus,\n filterInputSinkKey,\n fetchDashboardParsers,\n fetchGlobalParsers,\n isGlobalConsole,\n ]);\n\n // Handle selection\n const handleSelect = useCallback(\n (id: string \| null) => {\n onChange(id);\n setIsOpen(false);\n setSearchQuery('');\n },\n [onChange]\n );\n\n // Toggle dropdown\n const handleToggle = useCallback(() => {\n if (!disabled) {\n setIsOpen((prev) => !prev);\n }\n }, [disabled]);\n\n // Close dropdown\n const handleClose = useCallback(() => {\n setIsOpen(false);\n }, []);\n\n return (\n <div className=\"relative\">\n {/ Trigger button /}\n <button\n type=\"button\"\n onClick={handleToggle}\n disabled={disabled}\n className={`\n w-full\n px-3 py-2\n bg-bg-surface\n border rounded-md\n text-left\n flex items-center justify-between gap-2\n transition-colors\n ${disabled ? 'opacity-50 cursor-not-allowed' : 'hover:border-action-primary-bg cursor-pointer'}\n ${error ? 'border-status-error-border' : 'border-border-default'}\n ${isOpen ? 'border-action-primary-bg ring-2 ring-action-primary-bg/20' : ''}\n `}\n >\n <div className=\"flex-1 min-w-0\">\n {selectedParser ? (\n <div className=\"flex items-center gap-2\">\n <ParserTypeBadge type={selectedParser.type} size=\"sm\" />\n <span className=\"text-sm text-text-primary truncate\">{selectedParser.name}</span>\n </div>\n ) : (\n <span className=\"text-sm text-text-tertiary\">{placeholder}</span>\n )}\n </div>\n\n <ChevronDownIcon\n className={`w-4 h-4 text-text-secondary transition-transform ${isOpen ? 'transform rotate-180' : ''}`}\n />\n </button>\n\n {/ Error message /}\n {error && errorMessage && <p className=\"mt-1 text-xs text-status-error-text\">{errorMessage}</p>}\n\n {/ Dropdown /}\n {isOpen && (\n <Fragment>\n {/ Backdrop /}\n <div className=\"fixed inset-0 z-10\" onClick={handleClose} />\n\n {/ Dropdown content /}\n <div className=\"absolute left-0 right-0 top-full mt-1 z-20 bg-bg-surface border border-border-default rounded-md shadow-lg max-h-80 flex flex-col overflow-hidden\">\n {/ Search input /}\n <div className=\"p-2 border-b border-border-default\">\n <input\n type=\"text\"\n placeholder=\"Search parsers...\"\n value={searchQuery}\n onChange={(e) => setSearchQuery(e.target.value)}\n className={`\n w-full px-3 py-2\n bg-bg-sunken\n border border-border-default\n rounded-md\n text-sm text-text-primary\n placeholder-text-tertiary\n focus:outline-none\n focus:border-action-primary-bg\n focus:ring-2\n focus:ring-action-primary-bg/20\n `}\n />\n </div>\n\n {/ Options list /}\n <div className=\"overflow-y-auto flex-1\">\n {loading ? (\n <div className=\"p-4 text-center text-sm text-text-secondary\">Loading parsers...</div>\n ) : filteredParsers.length === 0 ? (\n <div className=\"p-4 text-center text-sm text-text-secondary\">No parsers found</div>\n ) : (\n <Fragment>\n {/ None option /}\n <button\n type=\"button\"\n onClick={() => handleSelect(null)}\n className={`\n w-full px-3 py-2\n text-left text-sm\n hover:bg-bg-sunken\n transition-colors\n ${value === null ? 'bg-action-primary-bg/10 text-action-primary-bg' : 'text-text-secondary'}\n `}\n >\n <span className=\"italic\">None</span>\n </button>\n\n {/ Dashboard-scoped parsers section /}\n {dashboardScopedParsers.length > 0 && (\n <Fragment>\n <div className=\"px-3 py-1.5 bg-bg-sunken border-y border-border-default\">\n <span className=\"text-xs font-medium text-text-secondary uppercase tracking-wide\">\n Dashboard Parsers\n </span>\n </div>\n {dashboardScopedParsers.map((parser) => (\n <ParserOptionButton\n key={parser.id}\n parser={parser}\n isSelected={value === parser.id}\n onSelect={handleSelect}\n />\n ))}\n </Fragment>\n )}\n\n {/ Global parsers section */}\n {globalScopedParsers.length > 0 && (\n <Fragment>\n <div className=\"px-3 py-1.5 bg-bg-sunken border-y border-border-default\">\n <span className=\"text-xs font-medium text-text-secondary uppercase tracking-wide\">\n Global Parsers\n </span>\n </div>\n {globalScopedParsers.map((parser) => (\n <ParserOptionButton\n key={parser.id}\n parser={parser}\n isSelected={value === parser.id}\n onSelect={handleSelect}\n isGlobal\n />\n ))}\n </Fragment>\n )}\n </Fragment>\n )}\n </div>\n </div>\n </Fragment>\n )}\n </div>\n );\n});\n\nexport default ParserSelector;\n"],"mappings":"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"}

package/dist/bigconsole/components/parser/ParserStatusBadge.js CHANGED Viewed

@@ -34,8 +34,8 @@ var r = {
 }), s = e(function({ status: e, size: s = "md", showIcon: c = !0 }) {
 	let l = r[s], u = i[s], d = {
 		active: {
-			bg: "bg-state-success/10",
-			text: "text-state-success",
+			bg: "bg-status-success-bg/10",
+			text: "text-status-success-text",
 			icon: /* @__PURE__ */ t(a, { className: u }),
 			label: "Active"
 		},

package/dist/bigconsole/components/parser/ParserStatusBadge.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ParserStatusBadge.js","names":[],"sources":["../../../../src/bigconsole/components/parser/ParserStatusBadge.tsx"],"sourcesContent":["/*\n Parser Status Badge\n \n Badge component displaying parser status (active, inactive).\n /\n\nimport { memo } from 'react';\nimport type { ParserStatus } from '../../types';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface ParserStatusBadgeProps {\n /* Parser status /\n status: ParserStatus;\n /* Badge size /\n size?: 'sm' \| 'md' \| 'lg';\n /* Whether to show icon */\n showIcon?: boolean;\n}\n\n// ============================================================================\n// CONSTANTS\n// ============================================================================\n\nconst SIZE_CLASSES = {\n sm: 'px-2 py-0.5 text-xs',\n md: 'px-2.5 py-1 text-sm',\n lg: 'px-3 py-1.5 text-base',\n};\n\nconst ICON_SIZE_CLASSES = {\n sm: 'w-3 h-3',\n md: 'w-4 h-4',\n lg: 'w-5 h-5',\n};\n\n// ============================================================================\n// ICONS\n// ============================================================================\n\nconst CheckIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M5 13l4 4L19 7\" />\n </svg>\n);\n\nconst XCircleIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z\"\n />\n </svg>\n);\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const ParserStatusBadge = memo(function ParserStatusBadge({\n status,\n size = 'md',\n showIcon = true,\n}: ParserStatusBadgeProps) {\n const sizeClass = SIZE_CLASSES[size];\n const iconSizeClass = ICON_SIZE_CLASSES[size];\n\n const config = {\n active: {\n bg: 'bg-~~state~~-success/10',\n text: 'text-~~state~~-success',\n icon: <CheckIcon className={iconSizeClass} />,\n label: 'Active',\n },\n inactive: {\n bg: 'bg-text-tertiary/10',\n text: 'text-text-tertiary',\n icon: <XCircleIcon className={iconSizeClass} />,\n label: 'Inactive',\n },\n }[status];\n\n if (!config) {\n return (\n <span\n className={`\n inline-flex items-center gap-1.5\n ${sizeClass}\n bg-bg-sunken\n text-text-secondary\n rounded-full\n font-medium\n `}\n >\n {status}\n </span>\n );\n }\n\n return (\n <span\n className={`\n inline-flex items-center gap-1.5\n ${sizeClass}\n ${config.bg}\n ${config.text}\n rounded-full\n font-medium\n `}\n >\n {showIcon && config.icon}\n <span>{config.label}</span>\n </span>\n );\n});\n\nexport default ParserStatusBadge;\n"],"mappings":";;;AA0BA,IAAM,IAAe;CACnB,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAEK,IAAoB;CACxB,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAMK,KAAa,EAAE,mBACnB,kBAAC,OAAD;CAAgB;CAAW,MAAK;CAAO,QAAO;CAAe,SAAQ;WACnE,kBAAC,QAAD;EAAM,eAAc;EAAQ,gBAAe;EAAQ,aAAa;EAAG,GAAE;EAAmB,CAAA;CACpF,CAAA,EAGF,KAAe,EAAE,mBACrB,kBAAC,OAAD;CAAgB;CAAW,MAAK;CAAO,QAAO;CAAe,SAAQ;WACnE,kBAAC,QAAD;EACE,eAAc;EACd,gBAAe;EACf,aAAa;EACb,GAAE;EACF,CAAA;CACE,CAAA,EAOK,IAAoB,EAAK,SAA2B,EAC/D,WACA,UAAO,MACP,cAAW,MACc;CACzB,IAAM,IAAY,EAAa,IACzB,IAAgB,EAAkB,IAElC,IAAS;EACb,QAAQ;GACN,IAAI;GACJ,MAAM;GACN,MAAM,kBAAC,GAAD,EAAW,WAAW,GAAiB,CAAA;GAC7C,OAAO;GACR;EACD,UAAU;GACR,IAAI;GACJ,MAAM;GACN,MAAM,kBAAC,GAAD,EAAa,WAAW,GAAiB,CAAA;GAC/C,OAAO;GACR;EACF,CAAC;AAmBF,QAjBK,IAkBH,kBAAC,QAAD;EACE,WAAW;;UAEP,EAAU;UACV,EAAO,GAAG;UACV,EAAO,KAAK;;;;YALlB,CAUG,KAAY,EAAO,MACpB,kBAAC,QAAD,EAAA,UAAO,EAAO,OAAa,CAAA,CACtB;MA5BL,kBAAC,QAAD;EACE,WAAW;;YAEP,EAAU;;;;;;YAOb;EACI,CAAA;EAmBX"}
1	+ {"version":3,"file":"ParserStatusBadge.js","names":[],"sources":["../../../../src/bigconsole/components/parser/ParserStatusBadge.tsx"],"sourcesContent":["/*\n Parser Status Badge\n \n Badge component displaying parser status (active, inactive).\n /\n\nimport { memo } from 'react';\nimport type { ParserStatus } from '../../types';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface ParserStatusBadgeProps {\n /* Parser status /\n status: ParserStatus;\n /* Badge size /\n size?: 'sm' \| 'md' \| 'lg';\n /* Whether to show icon */\n showIcon?: boolean;\n}\n\n// ============================================================================\n// CONSTANTS\n// ============================================================================\n\nconst SIZE_CLASSES = {\n sm: 'px-2 py-0.5 text-xs',\n md: 'px-2.5 py-1 text-sm',\n lg: 'px-3 py-1.5 text-base',\n};\n\nconst ICON_SIZE_CLASSES = {\n sm: 'w-3 h-3',\n md: 'w-4 h-4',\n lg: 'w-5 h-5',\n};\n\n// ============================================================================\n// ICONS\n// ============================================================================\n\nconst CheckIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M5 13l4 4L19 7\" />\n </svg>\n);\n\nconst XCircleIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z\"\n />\n </svg>\n);\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const ParserStatusBadge = memo(function ParserStatusBadge({\n status,\n size = 'md',\n showIcon = true,\n}: ParserStatusBadgeProps) {\n const sizeClass = SIZE_CLASSES[size];\n const iconSizeClass = ICON_SIZE_CLASSES[size];\n\n const config = {\n active: {\n bg: 'bg-status-success-bg/10',\n text: 'text-status-success-text',\n icon: <CheckIcon className={iconSizeClass} />,\n label: 'Active',\n },\n inactive: {\n bg: 'bg-text-tertiary/10',\n text: 'text-text-tertiary',\n icon: <XCircleIcon className={iconSizeClass} />,\n label: 'Inactive',\n },\n }[status];\n\n if (!config) {\n return (\n <span\n className={`\n inline-flex items-center gap-1.5\n ${sizeClass}\n bg-bg-sunken\n text-text-secondary\n rounded-full\n font-medium\n `}\n >\n {status}\n </span>\n );\n }\n\n return (\n <span\n className={`\n inline-flex items-center gap-1.5\n ${sizeClass}\n ${config.bg}\n ${config.text}\n rounded-full\n font-medium\n `}\n >\n {showIcon && config.icon}\n <span>{config.label}</span>\n </span>\n );\n});\n\nexport default ParserStatusBadge;\n"],"mappings":";;;AA0BA,IAAM,IAAe;CACnB,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAEK,IAAoB;CACxB,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAMK,KAAa,EAAE,mBACnB,kBAAC,OAAD;CAAgB;CAAW,MAAK;CAAO,QAAO;CAAe,SAAQ;WACnE,kBAAC,QAAD;EAAM,eAAc;EAAQ,gBAAe;EAAQ,aAAa;EAAG,GAAE;EAAmB,CAAA;CACpF,CAAA,EAGF,KAAe,EAAE,mBACrB,kBAAC,OAAD;CAAgB;CAAW,MAAK;CAAO,QAAO;CAAe,SAAQ;WACnE,kBAAC,QAAD;EACE,eAAc;EACd,gBAAe;EACf,aAAa;EACb,GAAE;EACF,CAAA;CACE,CAAA,EAOK,IAAoB,EAAK,SAA2B,EAC/D,WACA,UAAO,MACP,cAAW,MACc;CACzB,IAAM,IAAY,EAAa,IACzB,IAAgB,EAAkB,IAElC,IAAS;EACb,QAAQ;GACN,IAAI;GACJ,MAAM;GACN,MAAM,kBAAC,GAAD,EAAW,WAAW,GAAiB,CAAA;GAC7C,OAAO;GACR;EACD,UAAU;GACR,IAAI;GACJ,MAAM;GACN,MAAM,kBAAC,GAAD,EAAa,WAAW,GAAiB,CAAA;GAC/C,OAAO;GACR;EACF,CAAC;AAmBF,QAjBK,IAkBH,kBAAC,QAAD;EACE,WAAW;;UAEP,EAAU;UACV,EAAO,GAAG;UACV,EAAO,KAAK;;;;YALlB,CAUG,KAAY,EAAO,MACpB,kBAAC,QAAD,EAAA,UAAO,EAAO,OAAa,CAAA,CACtB;MA5BL,kBAAC,QAAD;EACE,WAAW;;YAEP,EAAU;;;;;;YAOb;EACI,CAAA;EAmBX"}

package/dist/bigconsole/components/pipeline/PipelineCard.js CHANGED Viewed

@@ -111,7 +111,7 @@ var o = ({ className: e }) => /* @__PURE__ */ r("svg", {
 						p && /* @__PURE__ */ r("button", {
 							type: "button",
 							onClick: y,
-							className: "\n                  p-1 rounded-md\n                  text-text-secondary\n                  hover:text-state-success\n                  hover:bg-state-success/10\n                  transition-colors\n                ",
+							className: "\n                  p-1 rounded-md\n                  text-text-secondary\n                  hover:text-status-success-text\n                  hover:bg-status-success-bg/10\n                  transition-colors\n                ",
 							title: "Test Pipeline",
 							children: /* @__PURE__ */ r(c, { className: "w-4 h-4" })
 						}),
@@ -125,7 +125,7 @@ var o = ({ className: e }) => /* @__PURE__ */ r("svg", {
 						m && /* @__PURE__ */ r("button", {
 							type: "button",
 							onClick: b,
-							className: "\n                  p-1 rounded-md\n                  text-text-secondary\n                  hover:text-state-error\n                  hover:bg-state-error/10\n                  transition-colors\n                ",
+							className: "\n                  p-1 rounded-md\n                  text-text-secondary\n                  hover:text-status-error-text\n                  hover:bg-status-error-bg/10\n                  transition-colors\n                ",
 							title: "Delete Pipeline",
 							children: /* @__PURE__ */ r(l, { className: "w-4 h-4" })
 						})

package/dist/bigconsole/components/pipeline/PipelineCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PipelineCard.js","names":[],"sources":["../../../../src/bigconsole/components/pipeline/PipelineCard.tsx"],"sourcesContent":["/*\n PipelineCard Component\n \n Card component displaying a Pipeline summary.\n * Shows name, status, stage count, and execution stats.\n /\n\nimport { memo, useCallback } from 'react';\nimport { formatDistanceToNow } from 'date-fns';\nimport { PipelineStatusBadge } from './PipelineStatusBadge';\nimport type { Pipeline } from '../../types';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface PipelineCardProps {\n pipeline: Pipeline;\n onView?: (id: string) => void;\n onEdit?: (id: string) => void;\n onTest?: (id: string) => void;\n onDelete?: (id: string) => void;\n}\n\n// ============================================================================\n// ICONS\n// ============================================================================\n\nconst PipelineIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={1.5}\n d=\"M19.5 12c0-1.232-.046-2.453-.138-3.662a4.006 4.006 0 00-3.7-3.7 48.678 48.678 0 00-7.324 0 4.006 4.006 0 00-3.7 3.7c-.017.22-.032.441-.046.662M19.5 12l3-3m-3 3l-3-3m-12 3c0 1.232.046 2.453.138 3.662a4.006 4.006 0 003.7 3.7 48.656 48.656 0 007.324 0 4.006 4.006 0 003.7-3.7c.017-.22.032-.441.046-.662M4.5 12l3 3m-3-3l-3 3\"\n />\n </svg>\n);\n\nconst EditIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z\"\n />\n </svg>\n);\n\nconst PlayIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z\"\n />\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M21 12a9 9 0 11-18 0 9 9 0 0118 0z\" />\n </svg>\n);\n\nconst DeleteIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16\"\n />\n </svg>\n);\n\nconst LayersIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10\"\n />\n </svg>\n);\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const PipelineCard = memo(function PipelineCard({\n pipeline,\n onView,\n onEdit,\n onTest,\n onDelete,\n}: PipelineCardProps) {\n // Calculate stage count\n const stageCount = pipeline.stages?.length ?? 0;\n\n // Format last executed time\n const formatLastExecuted = useCallback((dateStr: string \| null): string => {\n if (!dateStr) return 'Never';\n try {\n const date = new Date(dateStr);\n return formatDistanceToNow(date, { addSuffix: true });\n } catch {\n return 'Unknown';\n }\n }, []);\n\n // Event handlers\n const handleCardClick = useCallback(() => {\n onView?.(pipeline.id);\n }, [onView, pipeline.id]);\n\n const handleEditClick = useCallback(\n (e: React.MouseEvent) => {\n e.stopPropagation();\n onEdit?.(pipeline.id);\n },\n [onEdit, pipeline.id]\n );\n\n const handleTestClick = useCallback(\n (e: React.MouseEvent) => {\n e.stopPropagation();\n onTest?.(pipeline.id);\n },\n [onTest, pipeline.id]\n );\n\n const handleDeleteClick = useCallback(\n (e: React.MouseEvent) => {\n e.stopPropagation();\n onDelete?.(pipeline.id);\n },\n [onDelete, pipeline.id]\n );\n\n return (\n <div\n onClick={handleCardClick}\n className=\"\n bg-bg-surface\n border border-border-default\n rounded-lg\n overflow-hidden\n cursor-pointer\n hover:border-action-primary-bg\n transition-colors\n \"\n >\n {/ Header with Icon /}\n <div className=\"h-24 bg-bg-sunken flex items-center justify-center relative\">\n <PipelineIcon className=\"w-10 h-10 text-text-secondary/50\" />\n <div className=\"absolute top-2 right-2\">\n <PipelineStatusBadge status={pipeline.status} size=\"sm\" />\n </div>\n </div>\n\n {/ Content /}\n <div className=\"p-4\">\n {/ Title and Actions /}\n <div className=\"flex items-start justify-between mb-2\">\n <div className=\"flex-1 min-w-0\">\n <h3 className=\"text-sm font-semibold text-text-primary truncate\">{pipeline.name}</h3>\n {pipeline.description && (\n <p className=\"text-xs text-text-secondary truncate mt-0.5\">{pipeline.description}</p>\n )}\n </div>\n\n <div className=\"flex items-center gap-1 ml-2\">\n {onTest && (\n <button\n type=\"button\"\n onClick={handleTestClick}\n className=\"\n p-1 rounded-md\n text-text-secondary\n hover:text-state-success\n hover:bg-state-success/10\n transition-colors\n \"\n title=\"Test Pipeline\"\n >\n <PlayIcon className=\"w-4 h-4\" />\n </button>\n )}\n {onEdit && (\n <button\n type=\"button\"\n onClick={handleEditClick}\n className=\"\n p-1 rounded-md\n text-text-secondary\n hover:text-text-primary\n hover:bg-bg-sunken\n transition-colors\n \"\n title=\"Edit Pipeline\"\n >\n <EditIcon className=\"w-4 h-4\" />\n </button>\n )}\n {onDelete && (\n <button\n type=\"button\"\n onClick={handleDeleteClick}\n className=\"\n p-1 rounded-md\n text-text-secondary\n hover:text-state-error\n hover:bg-state-error/10\n transition-colors\n \"\n title=\"Delete Pipeline\"\n >\n <DeleteIcon className=\"w-4 h-4\" />\n </button>\n )}\n </div>\n </div>\n\n {/ Stats Footer /}\n <div className=\"flex items-center justify-between text-xs text-text-secondary mt-3\">\n <div className=\"flex items-center gap-3\">\n {/ Stage Count /}\n <span className=\"flex items-center gap-1\" title={`${stageCount} stages`}>\n <LayersIcon className=\"w-3.5 h-3.5\" />\n {stageCount} stage{stageCount !== 1 ? 's' : ''}\n </span>\n </div>\n\n {/ Last Executed */}\n <span\n title={\n pipeline.lastExecutedAt\n ? `Last executed: ${new Date(pipeline.lastExecutedAt).toLocaleString()}`\n : 'Never executed'\n }\n >\n {formatLastExecuted(pipeline.lastExecutedAt)}\n </span>\n </div>\n </div>\n </div>\n );\n});\n\nexport default PipelineCard;\n"],"mappings":"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"}
1	+ {"version":3,"file":"PipelineCard.js","names":[],"sources":["../../../../src/bigconsole/components/pipeline/PipelineCard.tsx"],"sourcesContent":["/*\n PipelineCard Component\n \n Card component displaying a Pipeline summary.\n * Shows name, status, stage count, and execution stats.\n /\n\nimport { memo, useCallback } from 'react';\nimport { formatDistanceToNow } from 'date-fns';\nimport { PipelineStatusBadge } from './PipelineStatusBadge';\nimport type { Pipeline } from '../../types';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface PipelineCardProps {\n pipeline: Pipeline;\n onView?: (id: string) => void;\n onEdit?: (id: string) => void;\n onTest?: (id: string) => void;\n onDelete?: (id: string) => void;\n}\n\n// ============================================================================\n// ICONS\n// ============================================================================\n\nconst PipelineIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={1.5}\n d=\"M19.5 12c0-1.232-.046-2.453-.138-3.662a4.006 4.006 0 00-3.7-3.7 48.678 48.678 0 00-7.324 0 4.006 4.006 0 00-3.7 3.7c-.017.22-.032.441-.046.662M19.5 12l3-3m-3 3l-3-3m-12 3c0 1.232.046 2.453.138 3.662a4.006 4.006 0 003.7 3.7 48.656 48.656 0 007.324 0 4.006 4.006 0 003.7-3.7c.017-.22.032-.441.046-.662M4.5 12l3 3m-3-3l-3 3\"\n />\n </svg>\n);\n\nconst EditIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z\"\n />\n </svg>\n);\n\nconst PlayIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z\"\n />\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M21 12a9 9 0 11-18 0 9 9 0 0118 0z\" />\n </svg>\n);\n\nconst DeleteIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16\"\n />\n </svg>\n);\n\nconst LayersIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10\"\n />\n </svg>\n);\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const PipelineCard = memo(function PipelineCard({\n pipeline,\n onView,\n onEdit,\n onTest,\n onDelete,\n}: PipelineCardProps) {\n // Calculate stage count\n const stageCount = pipeline.stages?.length ?? 0;\n\n // Format last executed time\n const formatLastExecuted = useCallback((dateStr: string \| null): string => {\n if (!dateStr) return 'Never';\n try {\n const date = new Date(dateStr);\n return formatDistanceToNow(date, { addSuffix: true });\n } catch {\n return 'Unknown';\n }\n }, []);\n\n // Event handlers\n const handleCardClick = useCallback(() => {\n onView?.(pipeline.id);\n }, [onView, pipeline.id]);\n\n const handleEditClick = useCallback(\n (e: React.MouseEvent) => {\n e.stopPropagation();\n onEdit?.(pipeline.id);\n },\n [onEdit, pipeline.id]\n );\n\n const handleTestClick = useCallback(\n (e: React.MouseEvent) => {\n e.stopPropagation();\n onTest?.(pipeline.id);\n },\n [onTest, pipeline.id]\n );\n\n const handleDeleteClick = useCallback(\n (e: React.MouseEvent) => {\n e.stopPropagation();\n onDelete?.(pipeline.id);\n },\n [onDelete, pipeline.id]\n );\n\n return (\n <div\n onClick={handleCardClick}\n className=\"\n bg-bg-surface\n border border-border-default\n rounded-lg\n overflow-hidden\n cursor-pointer\n hover:border-action-primary-bg\n transition-colors\n \"\n >\n {/ Header with Icon /}\n <div className=\"h-24 bg-bg-sunken flex items-center justify-center relative\">\n <PipelineIcon className=\"w-10 h-10 text-text-secondary/50\" />\n <div className=\"absolute top-2 right-2\">\n <PipelineStatusBadge status={pipeline.status} size=\"sm\" />\n </div>\n </div>\n\n {/ Content /}\n <div className=\"p-4\">\n {/ Title and Actions /}\n <div className=\"flex items-start justify-between mb-2\">\n <div className=\"flex-1 min-w-0\">\n <h3 className=\"text-sm font-semibold text-text-primary truncate\">{pipeline.name}</h3>\n {pipeline.description && (\n <p className=\"text-xs text-text-secondary truncate mt-0.5\">{pipeline.description}</p>\n )}\n </div>\n\n <div className=\"flex items-center gap-1 ml-2\">\n {onTest && (\n <button\n type=\"button\"\n onClick={handleTestClick}\n className=\"\n p-1 rounded-md\n text-text-secondary\n hover:text-status-success-text\n hover:bg-status-success-bg/10\n transition-colors\n \"\n title=\"Test Pipeline\"\n >\n <PlayIcon className=\"w-4 h-4\" />\n </button>\n )}\n {onEdit && (\n <button\n type=\"button\"\n onClick={handleEditClick}\n className=\"\n p-1 rounded-md\n text-text-secondary\n hover:text-text-primary\n hover:bg-bg-sunken\n transition-colors\n \"\n title=\"Edit Pipeline\"\n >\n <EditIcon className=\"w-4 h-4\" />\n </button>\n )}\n {onDelete && (\n <button\n type=\"button\"\n onClick={handleDeleteClick}\n className=\"\n p-1 rounded-md\n text-text-secondary\n hover:text-status-error-text\n hover:bg-status-error-bg/10\n transition-colors\n \"\n title=\"Delete Pipeline\"\n >\n <DeleteIcon className=\"w-4 h-4\" />\n </button>\n )}\n </div>\n </div>\n\n {/ Stats Footer /}\n <div className=\"flex items-center justify-between text-xs text-text-secondary mt-3\">\n <div className=\"flex items-center gap-3\">\n {/ Stage Count /}\n <span className=\"flex items-center gap-1\" title={`${stageCount} stages`}>\n <LayersIcon className=\"w-3.5 h-3.5\" />\n {stageCount} stage{stageCount !== 1 ? 's' : ''}\n </span>\n </div>\n\n {/ Last Executed */}\n <span\n title={\n pipeline.lastExecutedAt\n ? `Last executed: ${new Date(pipeline.lastExecutedAt).toLocaleString()}`\n : 'Never executed'\n }\n >\n {formatLastExecuted(pipeline.lastExecutedAt)}\n </span>\n </div>\n </div>\n </div>\n );\n});\n\nexport default PipelineCard;\n"],"mappings":"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"}

package/dist/bigconsole/components/pipeline/PipelineDeleteDialog.js CHANGED Viewed

@@ -29,8 +29,8 @@ var i = ({ className: e }) => /* @__PURE__ */ n("svg", {
 				/* @__PURE__ */ r("div", {
 					className: "flex items-center gap-3 mb-4",
 					children: [/* @__PURE__ */ n("div", {
-						className: "p-2 rounded-full bg-state-error/10",
-						children: /* @__PURE__ */ n(i, { className: "w-6 h-6 text-state-error" })
+						className: "p-2 rounded-full bg-status-error-bg/10",
+						children: /* @__PURE__ */ n(i, { className: "w-6 h-6 text-status-error-text" })
 					}), /* @__PURE__ */ n("h2", {
 						className: "text-lg font-semibold text-text-primary",
 						children: "Delete Pipeline"
@@ -52,9 +52,9 @@ var i = ({ className: e }) => /* @__PURE__ */ n("svg", {
 							]
 						}),
 						c > 0 && /* @__PURE__ */ n("div", {
-							className: "p-3 bg-state-warning/10 rounded-md",
+							className: "p-3 bg-status-warning-bg/10 rounded-md",
 							children: /* @__PURE__ */ r("p", {
-								className: "text-sm text-state-warning",
+								className: "text-sm text-status-warning-text",
 								children: [
 									"This pipeline has ",
 									c,
@@ -80,7 +80,7 @@ var i = ({ className: e }) => /* @__PURE__ */ n("svg", {
 					}), /* @__PURE__ */ n("button", {
 						type: "button",
 						onClick: u,
-						className: "\n              px-4 py-2\n              text-sm font-medium\n              text-white\n              bg-state-error\n              hover:bg-state-error/90\n              rounded-md\n              transition-colors\n            ",
+						className: "\n              px-4 py-2\n              text-sm font-medium\n              text-white\n              bg-status-error-bg\n              hover:bg-status-error-bg/90\n              rounded-md\n              transition-colors\n            ",
 						children: "Delete Pipeline"
 					})]
 				})

package/dist/bigconsole/components/pipeline/PipelineDeleteDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PipelineDeleteDialog.js","names":[],"sources":["../../../../src/bigconsole/components/pipeline/PipelineDeleteDialog.tsx"],"sourcesContent":["/*\n PipelineDeleteDialog Component\n \n Confirmation dialog for deleting a Pipeline.\n * Shows warning about stages before deletion.\n /\n\nimport { memo, useCallback } from 'react';\nimport type { Pipeline } from '../../types';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface PipelineDeleteDialogProps {\n pipeline: Pipeline;\n isOpen: boolean;\n onClose: () => void;\n onConfirm: () => void \| Promise<void>;\n}\n\n// ============================================================================\n// ICONS\n// ============================================================================\n\nconst WarningIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n />\n </svg>\n);\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const PipelineDeleteDialog = memo(function PipelineDeleteDialog({\n pipeline,\n isOpen,\n onClose,\n onConfirm,\n}: PipelineDeleteDialogProps) {\n // Calculate stage count\n const stageCount = pipeline.stages?.length ?? 0;\n\n // Event handlers\n const handleBackdropClick = useCallback(() => {\n onClose();\n }, [onClose]);\n\n const handleConfirmClick = useCallback(() => {\n onConfirm();\n }, [onConfirm]);\n\n // Don't render if not open\n if (!isOpen) {\n return null;\n }\n\n return (\n <div className=\"fixed inset-0 z-50 flex items-center justify-center\">\n {/ Backdrop /}\n <div className=\"absolute inset-0 bg-black/50\" onClick={handleBackdropClick} />\n\n {/ Dialog /}\n <div className=\"relative bg-bg-surface rounded-lg shadow-xl max-w-md w-full mx-4 p-6\">\n {/ Header /}\n <div className=\"flex items-center gap-3 mb-4\">\n <div className=\"p-2 rounded-full bg-~~state~~-error/10\">\n <WarningIcon className=\"w-6 h-6 text-~~state~~-error\" />\n </div>\n <h2 className=\"text-lg font-semibold text-text-primary\">Delete Pipeline</h2>\n </div>\n\n {/ Content /}\n <div className=\"mb-6\">\n <p className=\"text-sm text-text-secondary mb-3\">\n Are you sure you want to delete the pipeline{' '}\n <span className=\"font-medium text-text-primary\">{pipeline.name}</span>?\n </p>\n\n {/ Warning about stages /}\n {stageCount > 0 && (\n <div className=\"p-3 bg-~~state~~-warning/10 rounded-md\">\n <p className=\"text-sm text-~~state~~-warning\">\n This pipeline has {stageCount} stage{stageCount !== 1 ? 's' : ''}. All stages will be permanently\n deleted.\n </p>\n </div>\n )}\n\n <p className=\"text-sm text-text-secondary mt-3\">This action cannot be undone.</p>\n </div>\n\n {/ Actions */}\n <div className=\"flex justify-end gap-3\">\n <button\n type=\"button\"\n onClick={onClose}\n className=\"\n px-4 py-2\n text-sm font-medium\n text-text-primary\n bg-bg-sunken\n hover:bg-border-default\n rounded-md\n transition-colors\n \"\n >\n Cancel\n </button>\n <button\n type=\"button\"\n onClick={handleConfirmClick}\n className=\"\n px-4 py-2\n text-sm font-medium\n text-white\n bg-~~state~~-error\n hover:bg-~~state~~-error/90\n rounded-md\n transition-colors\n \"\n >\n Delete Pipeline\n </button>\n </div>\n </div>\n </div>\n );\n});\n\nexport default PipelineDeleteDialog;\n"],"mappings":";;;AAyBA,IAAM,KAAe,EAAE,mBACrB,kBAAC,OAAD;CAAgB;CAAW,MAAK;CAAO,QAAO;CAAe,SAAQ;WACnE,kBAAC,QAAD;EACE,eAAc;EACd,gBAAe;EACf,aAAa;EACb,GAAE;EACF,CAAA;CACE,CAAA,EAOK,IAAuB,EAAK,SAA8B,EACrE,aACA,WACA,YACA,gBAC4B;CAE5B,IAAM,IAAa,EAAS,QAAQ,UAAU,GAGxC,IAAsB,QAAkB;AAC5C,KAAS;IACR,CAAC,EAAQ,CAAC,EAEP,IAAqB,QAAkB;AAC3C,KAAW;IACV,CAAC,EAAU,CAAC;AAOf,QAJK,IAKH,kBAAC,OAAD;EAAK,WAAU;YAAf,CAEE,kBAAC,OAAD;GAAK,WAAU;GAA+B,SAAS;GAAuB,CAAA,EAG9E,kBAAC,OAAD;GAAK,WAAU;aAAf;IAEE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,GAAD,EAAa,WAAU,~~4BAA6B~~,CAAA;~~MAChD~~,CAAA,EACN,kBAAC,MAAD;MAAI,WAAU;gBAA0C;MAAoB,CAAA,CACxE;;IAGN,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,KAAD;OAAG,WAAU;iBAAb;QAAgD;QACD;QAC7C,kBAAC,QAAD;SAAM,WAAU;mBAAiC,EAAS;SAAY,CAAA;;QACpE;;MAGH,IAAa,KACZ,kBAAC,OAAD;OAAK,WAAU;iBACb,kBAAC,KAAD;QAAG,WAAU;kBAAb;~~SAA0C~~;~~SACrB~~;SAAW;SAAO,MAAe,IAAU,KAAN;SAAS;SAE/D;;OACA,CAAA;MAGR,kBAAC,KAAD;OAAG,WAAU;iBAAmC;OAAiC,CAAA;MAC7E;;IAGN,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,UAAD;MACE,MAAK;MACL,SAAS;MACT,WAAU;gBASX;MAEQ,CAAA,EACT,kBAAC,UAAD;MACE,MAAK;MACL,SAAS;MACT,WAAU;gBASX;MAEQ,CAAA,CACL;;IACF;KACF;MAxEC;EA0ET"}
1	+ {"version":3,"file":"PipelineDeleteDialog.js","names":[],"sources":["../../../../src/bigconsole/components/pipeline/PipelineDeleteDialog.tsx"],"sourcesContent":["/*\n PipelineDeleteDialog Component\n \n Confirmation dialog for deleting a Pipeline.\n * Shows warning about stages before deletion.\n /\n\nimport { memo, useCallback } from 'react';\nimport type { Pipeline } from '../../types';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface PipelineDeleteDialogProps {\n pipeline: Pipeline;\n isOpen: boolean;\n onClose: () => void;\n onConfirm: () => void \| Promise<void>;\n}\n\n// ============================================================================\n// ICONS\n// ============================================================================\n\nconst WarningIcon = ({ className }: { className?: string }) => (\n <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n />\n </svg>\n);\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const PipelineDeleteDialog = memo(function PipelineDeleteDialog({\n pipeline,\n isOpen,\n onClose,\n onConfirm,\n}: PipelineDeleteDialogProps) {\n // Calculate stage count\n const stageCount = pipeline.stages?.length ?? 0;\n\n // Event handlers\n const handleBackdropClick = useCallback(() => {\n onClose();\n }, [onClose]);\n\n const handleConfirmClick = useCallback(() => {\n onConfirm();\n }, [onConfirm]);\n\n // Don't render if not open\n if (!isOpen) {\n return null;\n }\n\n return (\n <div className=\"fixed inset-0 z-50 flex items-center justify-center\">\n {/ Backdrop /}\n <div className=\"absolute inset-0 bg-black/50\" onClick={handleBackdropClick} />\n\n {/ Dialog /}\n <div className=\"relative bg-bg-surface rounded-lg shadow-xl max-w-md w-full mx-4 p-6\">\n {/ Header /}\n <div className=\"flex items-center gap-3 mb-4\">\n <div className=\"p-2 rounded-full bg-status-error-bg/10\">\n <WarningIcon className=\"w-6 h-6 text-status-error-text\" />\n </div>\n <h2 className=\"text-lg font-semibold text-text-primary\">Delete Pipeline</h2>\n </div>\n\n {/ Content /}\n <div className=\"mb-6\">\n <p className=\"text-sm text-text-secondary mb-3\">\n Are you sure you want to delete the pipeline{' '}\n <span className=\"font-medium text-text-primary\">{pipeline.name}</span>?\n </p>\n\n {/ Warning about stages /}\n {stageCount > 0 && (\n <div className=\"p-3 bg-status-warning-bg/10 rounded-md\">\n <p className=\"text-sm text-status-warning-text\">\n This pipeline has {stageCount} stage{stageCount !== 1 ? 's' : ''}. All stages will be permanently\n deleted.\n </p>\n </div>\n )}\n\n <p className=\"text-sm text-text-secondary mt-3\">This action cannot be undone.</p>\n </div>\n\n {/ Actions */}\n <div className=\"flex justify-end gap-3\">\n <button\n type=\"button\"\n onClick={onClose}\n className=\"\n px-4 py-2\n text-sm font-medium\n text-text-primary\n bg-bg-sunken\n hover:bg-border-default\n rounded-md\n transition-colors\n \"\n >\n Cancel\n </button>\n <button\n type=\"button\"\n onClick={handleConfirmClick}\n className=\"\n px-4 py-2\n text-sm font-medium\n text-white\n bg-status-error-bg\n hover:bg-status-error-bg/90\n rounded-md\n transition-colors\n \"\n >\n Delete Pipeline\n </button>\n </div>\n </div>\n </div>\n );\n});\n\nexport default PipelineDeleteDialog;\n"],"mappings":";;;AAyBA,IAAM,KAAe,EAAE,mBACrB,kBAAC,OAAD;CAAgB;CAAW,MAAK;CAAO,QAAO;CAAe,SAAQ;WACnE,kBAAC,QAAD;EACE,eAAc;EACd,gBAAe;EACf,aAAa;EACb,GAAE;EACF,CAAA;CACE,CAAA,EAOK,IAAuB,EAAK,SAA8B,EACrE,aACA,WACA,YACA,gBAC4B;CAE5B,IAAM,IAAa,EAAS,QAAQ,UAAU,GAGxC,IAAsB,QAAkB;AAC5C,KAAS;IACR,CAAC,EAAQ,CAAC,EAEP,IAAqB,QAAkB;AAC3C,KAAW;IACV,CAAC,EAAU,CAAC;AAOf,QAJK,IAKH,kBAAC,OAAD;EAAK,WAAU;YAAf,CAEE,kBAAC,OAAD;GAAK,WAAU;GAA+B,SAAS;GAAuB,CAAA,EAG9E,kBAAC,OAAD;GAAK,WAAU;aAAf;IAEE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,GAAD,EAAa,WAAU,kCAAmC,CAAA;MACtD,CAAA,EACN,kBAAC,MAAD;MAAI,WAAU;gBAA0C;MAAoB,CAAA,CACxE;;IAGN,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,KAAD;OAAG,WAAU;iBAAb;QAAgD;QACD;QAC7C,kBAAC,QAAD;SAAM,WAAU;mBAAiC,EAAS;SAAY,CAAA;;QACpE;;MAGH,IAAa,KACZ,kBAAC,OAAD;OAAK,WAAU;iBACb,kBAAC,KAAD;QAAG,WAAU;kBAAb;SAAgD;SAC3B;SAAW;SAAO,MAAe,IAAU,KAAN;SAAS;SAE/D;;OACA,CAAA;MAGR,kBAAC,KAAD;OAAG,WAAU;iBAAmC;OAAiC,CAAA;MAC7E;;IAGN,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,UAAD;MACE,MAAK;MACL,SAAS;MACT,WAAU;gBASX;MAEQ,CAAA,EACT,kBAAC,UAAD;MACE,MAAK;MACL,SAAS;MACT,WAAU;gBASX;MAEQ,CAAA,CACL;;IACF;KACF;MAxEC;EA0ET"}

package/dist/bigconsole/components/pipeline/PipelineStatusBadge.js CHANGED Viewed

@@ -8,15 +8,15 @@ var n = {
 	},
 	active: {
 		label: "Active",
-		className: "bg-state-success/10 text-state-success"
+		className: "bg-status-success-bg/10 text-status-success-text"
 	},
 	inactive: {
 		label: "Inactive",
-		className: "bg-state-warning/10 text-state-warning"
+		className: "bg-status-warning-bg/10 text-status-warning-text"
 	},
 	error: {
 		label: "Error",
-		className: "bg-state-error/10 text-state-error"
+		className: "bg-status-error-bg/10 text-status-error-text"
 	}
 }, r = e(function({ status: e, size: r = "md" }) {
 	let i = n[e] || n.draft;

package/dist/bigconsole/components/pipeline/PipelineStatusBadge.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PipelineStatusBadge.js","names":[],"sources":["../../../../src/bigconsole/components/pipeline/PipelineStatusBadge.tsx"],"sourcesContent":["/*\n PipelineStatusBadge Component\n \n Displays the status of a Pipeline with appropriate styling.\n */\n\nimport { memo } from 'react';\nimport type { PipelineStatus } from '../../types';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface PipelineStatusBadgeProps {\n status: PipelineStatus;\n size?: 'sm' \| 'md';\n}\n\n// ============================================================================\n// STATUS CONFIG\n// ============================================================================\n\nconst STATUS_CONFIG: Record<PipelineStatus, { label: string; className: string }> = {\n draft: {\n label: 'Draft',\n className: 'bg-bg-sunken text-text-secondary',\n },\n active: {\n label: 'Active',\n className: 'bg-~~state~~-success/10 text-~~state~~-success',\n },\n inactive: {\n label: 'Inactive',\n className: 'bg-~~state~~-warning/10 text-~~state~~-warning',\n },\n error: {\n label: 'Error',\n className: 'bg-~~state~~-error/10 text-~~state~~-error',\n },\n};\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const PipelineStatusBadge = memo(function PipelineStatusBadge({\n status,\n size = 'md',\n}: PipelineStatusBadgeProps) {\n const config = STATUS_CONFIG[status] \|\| STATUS_CONFIG.draft;\n\n const sizeClasses = size === 'sm' ? 'px-1.5 py-0.5 text-xs' : 'px-2 py-1 text-xs';\n\n return (\n <span\n className={`\n inline-flex items-center\n font-medium rounded-md\n ${sizeClasses}\n ${config.className}\n `}\n >\n {config.label}\n </span>\n );\n});\n\nexport default PipelineStatusBadge;\n"],"mappings":";;;AAsBA,IAAM,IAA8E;CAClF,OAAO;EACL,OAAO;EACP,WAAW;EACZ;CACD,QAAQ;EACN,OAAO;EACP,WAAW;EACZ;CACD,UAAU;EACR,OAAO;EACP,WAAW;EACZ;CACD,OAAO;EACL,OAAO;EACP,WAAW;EACZ;CACF,EAMY,IAAsB,EAAK,SAA6B,EACnE,WACA,UAAO,QACoB;CAC3B,IAAM,IAAS,EAAc,MAAW,EAAc;AAItD,QACE,kBAAC,QAAD;EACE,WAAW;;;UAJK,MAAS,OAAO,0BAA0B,oBAO1C;UACZ,EAAO,UAAU;;YAGpB,EAAO;EACH,CAAA;EAET"}
1	+ {"version":3,"file":"PipelineStatusBadge.js","names":[],"sources":["../../../../src/bigconsole/components/pipeline/PipelineStatusBadge.tsx"],"sourcesContent":["/*\n PipelineStatusBadge Component\n \n Displays the status of a Pipeline with appropriate styling.\n */\n\nimport { memo } from 'react';\nimport type { PipelineStatus } from '../../types';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface PipelineStatusBadgeProps {\n status: PipelineStatus;\n size?: 'sm' \| 'md';\n}\n\n// ============================================================================\n// STATUS CONFIG\n// ============================================================================\n\nconst STATUS_CONFIG: Record<PipelineStatus, { label: string; className: string }> = {\n draft: {\n label: 'Draft',\n className: 'bg-bg-sunken text-text-secondary',\n },\n active: {\n label: 'Active',\n className: 'bg-status-success-bg/10 text-status-success-text',\n },\n inactive: {\n label: 'Inactive',\n className: 'bg-status-warning-bg/10 text-status-warning-text',\n },\n error: {\n label: 'Error',\n className: 'bg-status-error-bg/10 text-status-error-text',\n },\n};\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const PipelineStatusBadge = memo(function PipelineStatusBadge({\n status,\n size = 'md',\n}: PipelineStatusBadgeProps) {\n const config = STATUS_CONFIG[status] \|\| STATUS_CONFIG.draft;\n\n const sizeClasses = size === 'sm' ? 'px-1.5 py-0.5 text-xs' : 'px-2 py-1 text-xs';\n\n return (\n <span\n className={`\n inline-flex items-center\n font-medium rounded-md\n ${sizeClasses}\n ${config.className}\n `}\n >\n {config.label}\n </span>\n );\n});\n\nexport default PipelineStatusBadge;\n"],"mappings":";;;AAsBA,IAAM,IAA8E;CAClF,OAAO;EACL,OAAO;EACP,WAAW;EACZ;CACD,QAAQ;EACN,OAAO;EACP,WAAW;EACZ;CACD,UAAU;EACR,OAAO;EACP,WAAW;EACZ;CACD,OAAO;EACL,OAAO;EACP,WAAW;EACZ;CACF,EAMY,IAAsB,EAAK,SAA6B,EACnE,WACA,UAAO,QACoB;CAC3B,IAAM,IAAS,EAAc,MAAW,EAAc;AAItD,QACE,kBAAC,QAAD;EACE,WAAW;;;UAJK,MAAS,OAAO,0BAA0B,oBAO1C;UACZ,EAAO,UAAU;;YAGpB,EAAO;EACH,CAAA;EAET"}