npm - @burdenoff/microfe-bigconsole - Versions diffs - 2026.924.2 → 2026.925.1 - Mend

@burdenoff/microfe-bigconsole 2026.924.2 → 2026.925.1

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 (134) hide show

package/dist/bigconsole/pages/PipelinesPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PipelinesPage.js","names":[],"sources":["../../../src/bigconsole/pages/PipelinesPage.tsx"],"sourcesContent":["/*\n Pipelines Page\n \n List and manage Pipelines.\n \n Section ladder (BOFF-5635):\n * bare — page header band, filter/search toolbar (structure only)\n * primary — \"Your pipelines\" results region: the block this route exists for\n * muted — nested empty / no-match states inside the results region\n * danger — load failure, rendered under the header so navigation survives\n /\n\nimport { memo, useState, useMemo, useCallback } from 'react';\nimport { useAppNavigate } from '../contexts';\nimport { isNative, nativeNotify } from '../../utils/nativeBridge';\nimport { usePipelineOperations } from '../hooks/usePipelineOperations';\nimport { usePipelineStore } from '../store/pipelineStore';\nimport { PipelineCard } from '../components/pipeline/PipelineCard';\nimport { PipelineDeleteDialog } from '../components/pipeline/PipelineDeleteDialog';\nimport { Section, SectionStack, SECTION_FOCUS_RING, sectionSurfaceClasses } from '../components/common';\nimport type { PipelineStatus } from '../types';\n\n// fe-libs RBAC\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { AccessDenied, PermissionButton } from '@burdenoff/fe-libs/shared/components';\nimport { BIGCONSOLE_PERMISSIONS } from '../../constants/permissions';\n\n// fe-libs UI components\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Input } from '@burdenoff/fe-libs/ui';\nimport { Spinner } from '@burdenoff/fe-libs/ui';\nimport { AuroraBackground, GradientText, IllustratedEmptyState, PagePurpose } from '@burdenoff/fe-libs/ui';\n\n// Lucide icons\nimport { Plus, Search, GitBranch, AlertCircle } from 'lucide-react';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ntype StatusFilter = 'all' \| PipelineStatus;\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const PipelinesPage = memo(function PipelinesPage() {\n const navigate = useAppNavigate();\n const { t } = useI18n();\n\n // Permissions\n const { hasPermission, isLoading: permissionsLoading } = usePermissions();\n const canRead = hasPermission(BIGCONSOLE_PERMISSIONS.PIPELINE_READ);\n // Create is gated inline via <PermissionButton permission=PIPELINE_CREATE>.\n const canUpdate = hasPermission(BIGCONSOLE_PERMISSIONS.PIPELINE_UPDATE);\n const canDelete = hasPermission(BIGCONSOLE_PERMISSIONS.PIPELINE_DELETE);\n const canTest = hasPermission(BIGCONSOLE_PERMISSIONS.PIPELINE_TEST);\n\n // Local state\n const [statusFilter, setStatusFilter] = useState<StatusFilter>('all');\n\n // Store state\n const searchQuery = usePipelineStore((state) => state.searchQuery);\n const setSearchQuery = usePipelineStore((state) => state.setSearchQuery);\n const deleteDialogOpen = usePipelineStore((state) => state.deleteDialogOpen);\n const currentPipeline = usePipelineStore((state) => state.currentPipeline);\n const openDeleteDialog = usePipelineStore((state) => state.openDeleteDialog);\n const closeDeleteDialog = usePipelineStore((state) => state.closeDeleteDialog);\n\n // Operations\n const { loading, error, pipelines, deletePipeline, refetch } = usePipelineOperations({\n consoleId: 'default',\n });\n\n // Filter pipelines\n const filteredPipelines = useMemo(() => {\n let filtered = [...pipelines];\n\n // Apply status filter\n if (statusFilter !== 'all') {\n filtered = filtered.filter((p) => p.status === statusFilter);\n }\n\n // Apply search filter\n if (searchQuery.trim()) {\n const query = searchQuery.toLowerCase();\n filtered = filtered.filter(\n (p) => p.name.toLowerCase().includes(query) \|\| p.description?.toLowerCase().includes(query)\n );\n }\n\n // Sort by updatedAt descending\n return filtered.sort((a, b) => new Date(b.updatedAt).getTime() - new Date(a.updatedAt).getTime());\n }, [pipelines, statusFilter, searchQuery]);\n\n // Handlers\n const handleCreatePipeline = useCallback(() => {\n navigate('/pipelines/new');\n }, [navigate]);\n\n const handleViewPipeline = useCallback(\n (id: string) => {\n navigate(`/pipelines/${id}`);\n },\n [navigate]\n );\n\n const handleEditPipeline = useCallback(\n (id: string) => {\n navigate(`/pipelines/${id}/edit`);\n },\n [navigate]\n );\n\n const handleTestPipeline = useCallback(\n (id: string) => {\n navigate(`/pipelines/${id}?test=true`);\n },\n [navigate]\n );\n\n const handleDeleteClick = useCallback(\n (id: string) => {\n const pipeline = pipelines.find((p) => p.id === id);\n if (pipeline) {\n openDeleteDialog(pipeline);\n }\n },\n [pipelines, openDeleteDialog]\n );\n\n const handleDeleteConfirm = useCallback(async () => {\n if (currentPipeline) {\n try {\n await deletePipeline(currentPipeline.id);\n if (isNative()) void nativeNotify('success');\n } catch (err) {\n if (isNative()) void nativeNotify('error');\n throw err;\n }\n closeDeleteDialog();\n }\n }, [currentPipeline, deletePipeline, closeDeleteDialog]);\n\n const handleClearFilters = useCallback(() => {\n setStatusFilter('all');\n setSearchQuery('');\n }, [setSearchQuery]);\n\n // Status filter options\n const statusOptions: { value: StatusFilter; label: string }[] = [\n { value: 'all', label: t('bigconsole.pipelines.filters.all', 'All') },\n { value: 'draft', label: t('bigconsole.pipelines.filters.draft', 'Draft') },\n { value: 'active', label: t('bigconsole.pipelines.filters.active', 'Active') },\n { value: 'inactive', label: t('bigconsole.pipelines.filters.inactive', 'Inactive') },\n { value: 'error', label: t('bigconsole.pipelines.filters.error', 'Error') },\n ];\n\n // Permission gate — wait for permissions to resolve, then block callers\n // without pipeline read access before rendering the page body.\n if (permissionsLoading) {\n return (\n <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', padding: '80px 0' }}>\n <Spinner\n style={{\n height: 'var(--size-icon-xl)',\n width: 'var(--size-icon-xl)',\n }}\n />\n </div>\n );\n }\n\n if (!canRead) {\n return (\n <AccessDenied\n title={t('bigconsole.pipelines.errors.accessDeniedTitle', 'Access Denied')}\n description={t(\n 'bigconsole.pipelines.errors.accessDeniedListDescription',\n \"You don't have permission to view pipelines.\"\n )}\n />\n );\n }\n\n /\n Page header band. `bare` in the emphasis ladder: it carries the page\n * identity and the single create action, never a content surface. Rendered in\n * both the error and the normal branch so a failed load keeps its \"you are\n * here\" anchor instead of replacing the whole page.\n /\n const pageHeader = (\n <header className=\"relative overflow-hidden border-b border-[var(--color-border-seam)] bg-[image:var(--gradient-gloss-card)]\">\n <AuroraBackground intensity=\"subtle\" />\n <div\n className=\"flex flex-col gap-form-gap sm:flex-row sm:items-center sm:justify-between\"\n style={{ padding: 'var(--space-pagePadding)' }}\n >\n <div className=\"flex min-w-0 items-center gap-form-gap\">\n <span\n aria-hidden=\"true\"\n className=\"flex shrink-0 items-center justify-center rounded-card\"\n style={{\n height: 'var(--size-controlHeight-lg)',\n width: 'var(--size-controlHeight-lg)',\n backgroundColor: 'var(--color-action-primary-bg)',\n }}\n >\n <GitBranch\n style={{\n height: 'var(--size-icon-lg)',\n width: 'var(--size-icon-lg)',\n color: 'var(--color-action-primary-text)',\n }}\n />\n </span>\n <div className=\"min-w-0\">\n <h1 className=\"text-2xl font-bold leading-tight text-text-primary\">\n <GradientText>{t('bigconsole.pipelines.list.heading', 'Pipelines')}</GradientText>\n </h1>\n <p className=\"text-sm text-text-secondary\">\n {t(\n 'bigconsole.pipelines.list.subtitle',\n 'Create and manage sequential parser chains for data transformation'\n )}\n </p>\n </div>\n </div>\n\n <PermissionButton permission={BIGCONSOLE_PERMISSIONS.PIPELINE_CREATE} deniedBehavior=\"disable\">\n <Button\n onClick={handleCreatePipeline}\n className=\"w-full shrink-0 min-h-[var(--size-controlHeight-md)] sm:w-auto\"\n >\n <Plus className=\"h-icon-sm w-icon-sm\" />\n {t('bigconsole.pipelines.actions.createPipeline', 'Create Pipeline')}\n </Button>\n </PermissionButton>\n </div>\n </header>\n );\n\n // Error state — keep the header so the page never loses its context.\n if (error) {\n return (\n <div className=\"min-h-screen bg-bg-canvas\">\n {pageHeader}\n <div style={{ padding: 'var(--space-pagePadding)' }}>\n <Section\n tone=\"danger\"\n headingLevel={2}\n title={t('bigconsole.pipelines.errors.loadListTitle', 'Failed to load Pipelines')}\n description={error.message}\n icon={<AlertCircle className=\"h-icon-sm w-icon-sm\" />}\n actions={\n <Button size=\"sm\" onClick={() => refetch()}>\n {t('bigconsole.pipelines.actions.tryAgain', 'Try Again')}\n </Button>\n }\n data-testid=\"pipelines-error\"\n >\n <p className=\"text-sm text-text-secondary\">\n Nothing was changed. Retry once the console service is reachable again.\n </p>\n </Section>\n </div>\n </div>\n );\n }\n\n return (\n <div className=\"min-h-screen bg-bg-canvas\">\n {pageHeader}\n\n {/ Main Content /}\n <div style={{ padding: 'var(--space-pagePadding)' }}>\n <SectionStack>\n <PagePurpose className=\"max-w-[75ch]\">\n {t(\n 'bigconsole.pipelines.list.purpose',\n 'Pipelines chain parsers and data sinks into a repeatable flow — they take raw input, run it through your parsers, and route the structured result into a sink. Use them to turn messy logs, files, or API payloads into clean, queryable data your dashboards can use.'\n )}\n </PagePurpose>\n\n {/ Toolbar — `bare` in the ladder: filters + search grouped so the eye\n reads one control row instead of two floating stripes. Written with\n `sectionSurfaceClasses` rather than <Section> because the block has\n no visible heading (see the ticket note on Section's required\n `title` prop). /}\n <section\n aria-label=\"Filter and search pipelines\"\n data-testid=\"pipelines-toolbar\"\n data-section-emphasis=\"bare\"\n className={sectionSurfaceClasses('bare', 'neutral', 'none')}\n >\n <div className=\"flex flex-col gap-control-gap md:flex-row md:items-center md:justify-between\">\n {/ `min-w-0`: the pills are `shrink-0`, so without it this scroller\n refuses to shrink in the md row and pushes the search field out. /}\n <div\n role=\"group\"\n aria-label=\"Filter by status\"\n className=\"flex min-w-0 max-w-full items-center gap-1 overflow-x-auto rounded-card bg-bg-sunken p-1\"\n >\n {statusOptions.map((option) => (\n <button\n key={option.value}\n type=\"button\"\n aria-pressed={statusFilter === option.value}\n onClick={() => setStatusFilter(option.value)}\n className={`shrink-0 whitespace-nowrap rounded-button text-sm font-medium motion-safe:transition-colors ${SECTION_FOCUS_RING}`}\n style={{\n minHeight: 'var(--size-controlHeight-md)',\n padding: '0 var(--space-formGap)',\n border: 'none',\n cursor: 'pointer',\n backgroundColor: statusFilter === option.value ? 'var(--color-bg-surface)' : 'transparent',\n color:\n statusFilter === option.value ? 'var(--color-text-primary)' : 'var(--color-text-secondary)',\n boxShadow: statusFilter === option.value ? 'var(--shadow-elevation-1)' : 'none',\n }}\n >\n {option.label}\n </button>\n ))}\n </div>\n\n <div className=\"relative w-full md:max-w-[320px]\">\n <Search\n aria-hidden=\"true\"\n style={{\n position: 'absolute',\n left: 'var(--space-controlGap)',\n top: '50%',\n transform: 'translateY(-50%)',\n height: 'var(--size-icon-sm)',\n width: 'var(--size-icon-sm)',\n color: 'var(--color-text-muted)',\n }}\n />\n <Input\n type=\"text\"\n aria-label={t('bigconsole.pipelines.list.searchPlaceholder', 'Search pipelines...')}\n placeholder={t('bigconsole.pipelines.list.searchPlaceholder', 'Search pipelines...')}\n value={searchQuery}\n onChange={(e) => setSearchQuery(e.target.value)}\n style={{ paddingLeft: 'var(--size-controlHeight-md)', height: 'var(--size-controlHeight-md)' }}\n />\n </div>\n </div>\n </section>\n\n {/ Results — the one primary block on this route. /}\n <Section\n emphasis=\"primary\"\n headingLevel={2}\n title=\"Your pipelines\"\n description=\"Open one to review its stages, or run a quick test against sample input.\"\n meta={\n !loading \|\| pipelines.length > 0 ? (\n <span className=\"rounded-pill bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary\">\n {filteredPipelines.length}\n {filteredPipelines.length === pipelines.length ? '' : ` of ${pipelines.length}`}\n </span>\n ) : null\n }\n data-testid=\"pipelines-results\"\n >\n {/ Loading state /}\n {loading && pipelines.length === 0 && (\n <div className=\"flex items-center justify-center py-12\" role=\"status\">\n <div className=\"text-center\">\n <Spinner\n style={{\n height: 'var(--size-icon-xl)',\n width: 'var(--size-icon-xl)',\n margin: '0 auto var(--space-formGap)',\n }}\n />\n <p className=\"text-sm text-text-muted\">\n {t('bigconsole.pipelines.list.loading', 'Loading pipelines...')}\n </p>\n </div>\n </div>\n )}\n\n {/ Empty state — nothing created yet (onboarding). /}\n {!loading && pipelines.length === 0 && (\n <div data-testid=\"pipelines-empty\">\n <IllustratedEmptyState\n illustration=\"empty-data\"\n title={t('bigconsole.pipelines.list.emptyTitle', 'No Pipelines yet')}\n description={t(\n 'bigconsole.pipelines.list.emptyDescription',\n 'Create a pipeline to chain parsers together for sequential data transformation. Each stage processes the output of the previous stage.'\n )}\n action={\n <PermissionButton permission={BIGCONSOLE_PERMISSIONS.PIPELINE_CREATE} deniedBehavior=\"disable\">\n <Button onClick={handleCreatePipeline} className=\"min-h-[var(--size-controlHeight-md)]\">\n <Plus className=\"h-icon-sm w-icon-sm\" />\n {t('bigconsole.pipelines.actions.createPipeline', 'Create Pipeline')}\n </Button>\n </PermissionButton>\n }\n />\n </div>\n )}\n\n {/ No results state — a filter problem, not an onboarding problem. /}\n {!loading && filteredPipelines.length === 0 && pipelines.length > 0 && (\n <Section\n emphasis=\"muted\"\n tone=\"info\"\n padding=\"compact\"\n headingLevel={3}\n title={t('bigconsole.pipelines.list.noResultsTitle', 'No matching pipelines')}\n description={t('bigconsole.pipelines.list.noResultsDescription', 'No pipelines match your filters')}\n actions={\n <Button size=\"sm\" variant=\"secondary\" onClick={handleClearFilters}>\n Clear filters\n </Button>\n }\n data-testid=\"pipelines-no-results\"\n />\n )}\n\n {/ Pipeline Grid /}\n {filteredPipelines.length > 0 && (\n <div className=\"grid grid-cols-1 gap-form-gap sm:grid-cols-2 xl:grid-cols-3\">\n {filteredPipelines.map((pipeline) => (\n <PipelineCard\n key={pipeline.id}\n pipeline={pipeline}\n onView={handleViewPipeline}\n onEdit={canUpdate ? handleEditPipeline : undefined}\n onTest={canTest ? handleTestPipeline : undefined}\n onDelete={canDelete ? handleDeleteClick : undefined}\n />\n ))}\n </div>\n )}\n </Section>\n </SectionStack>\n </div>\n\n {/ Delete Dialog */}\n {currentPipeline && (\n <PipelineDeleteDialog\n pipeline={currentPipeline}\n isOpen={deleteDialogOpen}\n onClose={closeDeleteDialog}\n onConfirm={handleDeleteConfirm}\n />\n )}\n </div>\n );\n});\n\nexport default PipelinesPage;\n"],"mappings":"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"}
1	+ {"version":3,"file":"PipelinesPage.js","names":[],"sources":["../../../src/bigconsole/pages/PipelinesPage.tsx"],"sourcesContent":["/*\n Pipelines Page\n \n List and manage Pipelines.\n \n Section ladder (BOFF-5635):\n * bare — page header band, filter/search toolbar (structure only)\n * primary — \"Your pipelines\" results region: the block this route exists for\n * muted — nested empty / no-match states inside the results region\n * danger — load failure, rendered under the header so navigation survives\n /\n\nimport { memo, useState, useMemo, useCallback } from 'react';\nimport { useAppNavigate } from '../contexts';\nimport { isNative, nativeNotify } from '../../utils/nativeBridge';\nimport { usePipelineOperations } from '../hooks/usePipelineOperations';\nimport { usePipelineStore } from '../store/pipelineStore';\nimport { PipelineCard } from '../components/pipeline/PipelineCard';\nimport { PipelineDeleteDialog } from '../components/pipeline/PipelineDeleteDialog';\nimport { Section, SectionStack, SECTION_FOCUS_RING, sectionSurfaceClasses } from '../components/common';\nimport type { PipelineStatus } from '../types';\n\n// fe-libs RBAC\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { AccessDenied, PermissionButton } from '@burdenoff/fe-libs/shared/components';\nimport { BIGCONSOLE_PERMISSIONS } from '../../constants/permissions';\n\n// fe-libs UI components\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Input } from '@burdenoff/fe-libs/ui';\nimport { Spinner } from '@burdenoff/fe-libs/ui';\nimport { AuroraBackground, GradientText, IllustratedEmptyState, PagePurpose } from '@burdenoff/fe-libs/ui';\n\n// Lucide icons\nimport { Plus, Search, GitBranch, AlertCircle } from 'lucide-react';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ntype StatusFilter = 'all' \| PipelineStatus;\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const PipelinesPage = memo(function PipelinesPage() {\n const navigate = useAppNavigate();\n const { t } = useI18n();\n\n // Permissions\n const { hasPermission, isLoading: permissionsLoading } = usePermissions();\n const canRead = hasPermission(BIGCONSOLE_PERMISSIONS.PIPELINE_READ);\n // Create is gated inline via <PermissionButton permission=PIPELINE_CREATE>.\n const canUpdate = hasPermission(BIGCONSOLE_PERMISSIONS.PIPELINE_UPDATE);\n const canDelete = hasPermission(BIGCONSOLE_PERMISSIONS.PIPELINE_DELETE);\n const canTest = hasPermission(BIGCONSOLE_PERMISSIONS.PIPELINE_TEST);\n\n // Local state\n const [statusFilter, setStatusFilter] = useState<StatusFilter>('all');\n\n // Store state\n const searchQuery = usePipelineStore((state) => state.searchQuery);\n const setSearchQuery = usePipelineStore((state) => state.setSearchQuery);\n const deleteDialogOpen = usePipelineStore((state) => state.deleteDialogOpen);\n const currentPipeline = usePipelineStore((state) => state.currentPipeline);\n const openDeleteDialog = usePipelineStore((state) => state.openDeleteDialog);\n const closeDeleteDialog = usePipelineStore((state) => state.closeDeleteDialog);\n\n // Operations\n const { loading, error, pipelines, deletePipeline, refetch } = usePipelineOperations({\n consoleId: 'default',\n });\n\n // Filter pipelines\n const filteredPipelines = useMemo(() => {\n let filtered = [...pipelines];\n\n // Apply status filter\n if (statusFilter !== 'all') {\n filtered = filtered.filter((p) => p.status === statusFilter);\n }\n\n // Apply search filter\n if (searchQuery.trim()) {\n const query = searchQuery.toLowerCase();\n filtered = filtered.filter(\n (p) => p.name.toLowerCase().includes(query) \|\| p.description?.toLowerCase().includes(query)\n );\n }\n\n // Sort by updatedAt descending\n return filtered.sort((a, b) => new Date(b.updatedAt).getTime() - new Date(a.updatedAt).getTime());\n }, [pipelines, statusFilter, searchQuery]);\n\n // Handlers\n const handleCreatePipeline = useCallback(() => {\n navigate('/pipelines/new');\n }, [navigate]);\n\n const handleViewPipeline = useCallback(\n (id: string) => {\n navigate(`/pipelines/${id}`);\n },\n [navigate]\n );\n\n const handleEditPipeline = useCallback(\n (id: string) => {\n navigate(`/pipelines/${id}/edit`);\n },\n [navigate]\n );\n\n const handleTestPipeline = useCallback(\n (id: string) => {\n navigate(`/pipelines/${id}?test=true`);\n },\n [navigate]\n );\n\n const handleDeleteClick = useCallback(\n (id: string) => {\n const pipeline = pipelines.find((p) => p.id === id);\n if (pipeline) {\n openDeleteDialog(pipeline);\n }\n },\n [pipelines, openDeleteDialog]\n );\n\n const handleDeleteConfirm = useCallback(async () => {\n if (currentPipeline) {\n try {\n await deletePipeline(currentPipeline.id);\n if (isNative()) void nativeNotify('success');\n } catch (err) {\n if (isNative()) void nativeNotify('error');\n throw err;\n }\n closeDeleteDialog();\n }\n }, [currentPipeline, deletePipeline, closeDeleteDialog]);\n\n const handleClearFilters = useCallback(() => {\n setStatusFilter('all');\n setSearchQuery('');\n }, [setSearchQuery]);\n\n // Status filter options\n const statusOptions: { value: StatusFilter; label: string }[] = [\n { value: 'all', label: t('bigconsole.pipelines.filters.all', 'All') },\n { value: 'draft', label: t('bigconsole.pipelines.filters.draft', 'Draft') },\n { value: 'active', label: t('bigconsole.pipelines.filters.active', 'Active') },\n { value: 'inactive', label: t('bigconsole.pipelines.filters.inactive', 'Inactive') },\n { value: 'error', label: t('bigconsole.pipelines.filters.error', 'Error') },\n ];\n\n // Permission gate — wait for permissions to resolve, then block callers\n // without pipeline read access before rendering the page body.\n if (permissionsLoading) {\n return (\n <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', padding: '80px 0' }}>\n <Spinner\n style={{\n height: 'var(--size-icon-xl)',\n width: 'var(--size-icon-xl)',\n }}\n />\n </div>\n );\n }\n\n if (!canRead) {\n return (\n <AccessDenied\n title={t('bigconsole.pipelines.errors.accessDeniedTitle', 'Access Denied')}\n description={t(\n 'bigconsole.pipelines.errors.accessDeniedListDescription',\n \"You don't have permission to view pipelines.\"\n )}\n />\n );\n }\n\n /\n Page header band. `bare` in the emphasis ladder: it carries the page\n * identity and the single create action, never a content surface. Rendered in\n * both the error and the normal branch so a failed load keeps its \"you are\n * here\" anchor instead of replacing the whole page.\n /\n const pageHeader = (\n <header className=\"relative overflow-hidden border-b border-[var(--color-border-seam)] bg-[image:var(--gradient-gloss-card)]\">\n <AuroraBackground intensity=\"subtle\" />\n <div\n className=\"flex flex-col gap-form-gap sm:flex-row sm:items-center sm:justify-between\"\n style={{ padding: 'var(--space-pagePadding)' }}\n >\n <div className=\"flex min-w-0 items-center gap-form-gap\">\n <span\n aria-hidden=\"true\"\n className=\"flex shrink-0 items-center justify-center rounded-card\"\n style={{\n height: 'var(--size-controlHeight-lg)',\n width: 'var(--size-controlHeight-lg)',\n backgroundColor: 'var(--color-action-primary-bg)',\n }}\n >\n <GitBranch\n style={{\n height: 'var(--size-icon-lg)',\n width: 'var(--size-icon-lg)',\n color: 'var(--color-action-primary-text)',\n }}\n />\n </span>\n <div className=\"min-w-0\">\n <h1 className=\"text-2xl font-bold leading-tight text-text-primary\">\n <GradientText>{t('bigconsole.pipelines.list.heading', 'Pipelines')}</GradientText>\n </h1>\n <p className=\"text-sm text-text-secondary\">\n {t(\n 'bigconsole.pipelines.list.subtitle',\n 'Create and manage sequential parser chains for data transformation'\n )}\n </p>\n </div>\n </div>\n\n <PermissionButton permission={BIGCONSOLE_PERMISSIONS.PIPELINE_CREATE} deniedBehavior=\"disable\">\n <Button\n onClick={handleCreatePipeline}\n className=\"w-full shrink-0 min-h-[var(--size-controlHeight-md)] sm:w-auto\"\n >\n <Plus className=\"h-icon-sm w-icon-sm\" />\n {t('bigconsole.pipelines.actions.createPipeline', 'Create Pipeline')}\n </Button>\n </PermissionButton>\n </div>\n </header>\n );\n\n // Error state — keep the header so the page never loses its context.\n if (error) {\n return (\n <div className=\"min-h-screen bg-bg-canvas\">\n {pageHeader}\n <div style={{ padding: 'var(--space-pagePadding)' }}>\n <Section\n tone=\"danger\"\n headingLevel={2}\n title={t('bigconsole.pipelines.errors.loadListTitle', 'Failed to load Pipelines')}\n description={error.message}\n icon={<AlertCircle className=\"h-icon-sm w-icon-sm\" />}\n actions={\n <Button size=\"sm\" onClick={() => refetch()}>\n {t('bigconsole.pipelines.actions.tryAgain', 'Try Again')}\n </Button>\n }\n data-testid=\"pipelines-error\"\n >\n <p className=\"text-sm text-text-secondary\">\n Nothing was changed. Retry once the console service is reachable again.\n </p>\n </Section>\n </div>\n </div>\n );\n }\n\n return (\n <div className=\"min-h-screen bg-bg-canvas\">\n {pageHeader}\n\n {/ Main Content /}\n <div style={{ padding: 'var(--space-pagePadding)' }}>\n <SectionStack>\n <PagePurpose className=\"max-w-[75ch]\">\n {t(\n 'bigconsole.pipelines.list.purpose',\n 'Pipelines chain parsers and data sinks into a repeatable flow — they take raw input, run it through your parsers, and route the structured result into a sink. Use them to turn messy logs, files, or API payloads into clean, queryable data your dashboards can use.'\n )}\n </PagePurpose>\n\n {/ Toolbar — `bare` in the ladder: filters + search grouped so the eye\n reads one control row instead of two floating stripes. Written with\n `sectionSurfaceClasses` rather than <Section> because the block has\n no visible heading (see the ticket note on Section's required\n `title` prop). /}\n <section\n aria-label=\"Filter and search pipelines\"\n data-testid=\"pipelines-toolbar\"\n data-section-emphasis=\"bare\"\n className={sectionSurfaceClasses('bare', 'neutral', 'none')}\n >\n <div className=\"flex flex-col gap-control-gap md:flex-row md:items-center md:justify-between\">\n {/ `min-w-0`: the pills are `shrink-0`, so without it this scroller\n refuses to shrink in the md row and pushes the search field out. /}\n <div\n role=\"group\"\n aria-label=\"Filter by status\"\n className=\"flex min-w-0 max-w-full items-center gap-1 overflow-x-auto rounded-card bg-bg-sunken p-1\"\n >\n {statusOptions.map((option) => (\n <button\n key={option.value}\n type=\"button\"\n aria-pressed={statusFilter === option.value}\n onClick={() => setStatusFilter(option.value)}\n className={`shrink-0 whitespace-nowrap rounded-button text-sm font-medium motion-safe:transition-colors ${SECTION_FOCUS_RING}`}\n style={{\n minHeight: 'var(--size-controlHeight-md)',\n padding: '0 var(--space-formGap)',\n border: 'none',\n cursor: 'pointer',\n backgroundColor: statusFilter === option.value ? 'var(--color-bg-surface)' : 'transparent',\n color:\n statusFilter === option.value ? 'var(--color-text-primary)' : 'var(--color-text-secondary)',\n boxShadow: statusFilter === option.value ? 'var(--shadow-elevation-1)' : 'none',\n }}\n >\n {option.label}\n </button>\n ))}\n </div>\n\n <div className=\"relative w-full md:max-w-[320px]\">\n <Search\n aria-hidden=\"true\"\n style={{\n position: 'absolute',\n left: 'var(--space-controlGap)',\n top: '50%',\n transform: 'translateY(-50%)',\n height: 'var(--size-icon-sm)',\n width: 'var(--size-icon-sm)',\n color: 'var(--color-text-muted)',\n }}\n />\n <Input\n type=\"text\"\n aria-label={t('bigconsole.pipelines.list.searchPlaceholder', 'Search pipelines...')}\n placeholder={t('bigconsole.pipelines.list.searchPlaceholder', 'Search pipelines...')}\n value={searchQuery}\n onChange={(e) => setSearchQuery(e.target.value)}\n style={{ paddingLeft: 'var(--size-controlHeight-md)', height: 'var(--size-controlHeight-md)' }}\n />\n </div>\n </div>\n </section>\n\n {/ Results — the one primary block on this route. /}\n <Section\n emphasis=\"primary\"\n headingLevel={2}\n title=\"Your pipelines\"\n description=\"Open one to review its stages, or run a quick test against sample input.\"\n meta={\n !loading \|\| pipelines.length > 0 ? (\n <span className=\"rounded-pill bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary\">\n {filteredPipelines.length}\n {filteredPipelines.length === pipelines.length ? '' : ` of ${pipelines.length}`}\n </span>\n ) : null\n }\n data-testid=\"pipelines-results\"\n >\n {/ Loading state /}\n {loading && pipelines.length === 0 && (\n <div className=\"flex items-center justify-center py-12\" role=\"status\">\n <div className=\"text-center\">\n <Spinner\n style={{\n height: 'var(--size-icon-xl)',\n width: 'var(--size-icon-xl)',\n margin: '0 auto var(--space-formGap)',\n }}\n />\n <p className=\"text-sm text-text-muted\">\n {t('bigconsole.pipelines.list.loading', 'Loading pipelines...')}\n </p>\n </div>\n </div>\n )}\n\n {/ Empty state — nothing created yet (onboarding). /}\n {!loading && pipelines.length === 0 && (\n <div data-testid=\"pipelines-empty\">\n <IllustratedEmptyState\n illustration=\"empty-data\"\n title={t('bigconsole.pipelines.list.emptyTitle', 'No Pipelines yet')}\n description={t(\n 'bigconsole.pipelines.list.emptyDescription',\n 'Create a pipeline to chain parsers together for sequential data transformation. Each stage processes the output of the previous stage.'\n )}\n action={\n <PermissionButton permission={BIGCONSOLE_PERMISSIONS.PIPELINE_CREATE} deniedBehavior=\"disable\">\n <Button onClick={handleCreatePipeline} className=\"min-h-[var(--size-controlHeight-md)]\">\n <Plus className=\"h-icon-sm w-icon-sm\" />\n {t('bigconsole.pipelines.actions.createPipeline', 'Create Pipeline')}\n </Button>\n </PermissionButton>\n }\n />\n </div>\n )}\n\n {/ No results state — a filter problem, not an onboarding problem. /}\n {!loading && filteredPipelines.length === 0 && pipelines.length > 0 && (\n <Section\n emphasis=\"muted\"\n tone=\"info\"\n padding=\"compact\"\n headingLevel={3}\n title={t('bigconsole.pipelines.list.noResultsTitle', 'No matching pipelines')}\n description={t('bigconsole.pipelines.list.noResultsDescription', 'No pipelines match your filters')}\n actions={\n <Button size=\"sm\" variant=\"secondary\" onClick={handleClearFilters}>\n Clear filters\n </Button>\n }\n data-testid=\"pipelines-no-results\"\n />\n )}\n\n {/ Pipeline Grid /}\n {filteredPipelines.length > 0 && (\n <div className=\"grid grid-cols-1 gap-form-gap sm:grid-cols-2 xl:grid-cols-3\">\n {filteredPipelines.map((pipeline) => (\n <PipelineCard\n key={pipeline.id}\n pipeline={pipeline}\n onView={handleViewPipeline}\n onEdit={canUpdate ? handleEditPipeline : undefined}\n onTest={canTest ? handleTestPipeline : undefined}\n onDelete={canDelete ? handleDeleteClick : undefined}\n />\n ))}\n </div>\n )}\n </Section>\n </SectionStack>\n </div>\n\n {/ Delete Dialog */}\n {currentPipeline && (\n <PipelineDeleteDialog\n pipeline={currentPipeline}\n isOpen={deleteDialogOpen}\n onClose={closeDeleteDialog}\n onConfirm={handleDeleteConfirm}\n />\n )}\n </div>\n );\n});\n\nexport default PipelinesPage;\n"],"mappings":"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"}

package/dist/bigconsole/pages/SettingsPage.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import { memo as e, useCallback as t, useEffect as n, useState as r } from "react";
 import { RotateCcw as i, Save as a, Settings as o } from "lucide-react";
-import { useI18n as s } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { AuroraBackground as c, EmphasisPanel as l, GradientText as u, PagePurpose as d } from "@burdenoff/fe-libs/ui";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { AuroraBackground as s, EmphasisPanel as c, GradientText as l, PagePurpose as u } from "@burdenoff/fe-libs/ui";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { useI18n as p } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 //#region src/bigconsole/pages/SettingsPage.tsx
 var m = "bigconsole-settings", h = {
 	defaultRefreshInterval: 0,
@@ -28,7 +28,7 @@ function _(e) {
 	localStorage.setItem(m, JSON.stringify(e));
 }
 var v = e(function() {
-	let { t: e } = s(), [m, v] = r(g), [y, b] = r(!1);
+	let { t: e } = p(), [m, v] = r(g), [y, b] = r(!1);
 	n(() => {
 		if (y) {
 			let e = setTimeout(() => b(!1), 2e3);
@@ -71,19 +71,19 @@ var v = e(function() {
 		marginBottom: "var(--space-sectionGap)",
 		boxShadow: "var(--shadow-pop)"
 	};
-	return /* @__PURE__ */ f("div", {
+	return /* @__PURE__ */ d("div", {
 		style: {
 			minHeight: "100vh",
 			backgroundColor: "var(--color-bg-canvas)"
 		},
-		children: /* @__PURE__ */ p("div", {
+		children: /* @__PURE__ */ f("div", {
 			style: {
 				padding: "var(--space-pagePadding)",
 				maxWidth: 720,
 				margin: "0 auto"
 			},
 			children: [
-				/* @__PURE__ */ p("div", {
+				/* @__PURE__ */ f("div", {
 					className: "relative overflow-hidden rounded-card border border-border-seam bg-gloss-card p-6",
 					style: {
 						display: "flex",
@@ -94,25 +94,25 @@ var v = e(function() {
 						gap: "var(--space-formGap)"
 					},
 					children: [
-						/* @__PURE__ */ f(c, { intensity: "subtle" }),
-						/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ p("div", {
+						/* @__PURE__ */ d(s, { intensity: "subtle" }),
+						/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ f("div", {
 							style: {
 								display: "flex",
 								alignItems: "center",
 								gap: "var(--space-iconGap)"
 							},
-							children: [/* @__PURE__ */ f(o, {
+							children: [/* @__PURE__ */ d(o, {
 								size: 24,
 								style: { color: "var(--color-text-primary)" }
-							}), /* @__PURE__ */ f("h1", {
+							}), /* @__PURE__ */ d("h1", {
 								style: {
 									fontSize: "var(--font-size-heading-h4)",
 									fontWeight: "var(--font-weight-bold)",
 									color: "var(--color-text-primary)"
 								},
-								children: /* @__PURE__ */ f(u, { children: e("bigconsole.settings.header.title", "Settings") })
+								children: /* @__PURE__ */ d(l, { children: e("bigconsole.settings.header.title", "Settings") })
 							})]
-						}), /* @__PURE__ */ f("p", {
+						}), /* @__PURE__ */ d("p", {
 							style: {
 								fontSize: "var(--font-size-body-md)",
 								color: "var(--color-text-secondary)",
@@ -120,12 +120,12 @@ var v = e(function() {
 							},
 							children: e("bigconsole.settings.header.subtitle", "Configure BigConsole preferences")
 						})] }),
-						/* @__PURE__ */ p("div", {
+						/* @__PURE__ */ f("div", {
 							style: {
 								display: "flex",
 								gap: 8
 							},
-							children: [/* @__PURE__ */ p("button", {
+							children: [/* @__PURE__ */ f("button", {
 								onClick: C,
 								style: {
 									display: "flex",
@@ -140,11 +140,11 @@ var v = e(function() {
 									cursor: "pointer"
 								},
 								children: [
-									/* @__PURE__ */ f(i, { size: 14 }),
+									/* @__PURE__ */ d(i, { size: 14 }),
 									" ",
 									e("bigconsole.settings.actions.reset", "Reset")
 								]
-							}), /* @__PURE__ */ p("button", {
+							}), /* @__PURE__ */ f("button", {
 								onClick: S,
 								style: {
 									display: "flex",
@@ -161,7 +161,7 @@ var v = e(function() {
 									transition: "background-color 200ms"
 								},
 								children: [
-									/* @__PURE__ */ f(a, { size: 14 }),
+									/* @__PURE__ */ d(a, { size: 14 }),
 									" ",
 									y ? e("bigconsole.settings.actions.savedLocally", "Saved locally") : e("bigconsole.settings.actions.saveLocally", "Save locally")
 								]
@@ -169,13 +169,13 @@ var v = e(function() {
 						})
 					]
 				}),
-				/* @__PURE__ */ f(d, {
+				/* @__PURE__ */ d(u, {
 					className: "mb-[var(--space-sectionGap)]",
 					children: e("bigconsole.settings.purpose", "Settings control the defaults BigConsole applies everywhere — how new dashboards are laid out, how aggressively widget data is cached, and how the UI is displayed. Tune these once to match how your team works; they apply across every dashboard you build. These preferences are saved locally in this browser until the backend settings API is available.")
 				}),
-				/* @__PURE__ */ p(l, {
+				/* @__PURE__ */ f(c, {
 					className: "mb-[var(--space-sectionGap)] p-[var(--space-cardPadding)]",
-					children: [/* @__PURE__ */ f("h2", {
+					children: [/* @__PURE__ */ d("h2", {
 						style: {
 							fontSize: "var(--font-size-body-md)",
 							fontWeight: "var(--font-weight-semibold)",
@@ -183,19 +183,19 @@ var v = e(function() {
 							marginBottom: 16
 						},
 						children: e("bigconsole.settings.dashboardDefaults.title", "Dashboard Defaults")
-					}), /* @__PURE__ */ p("div", {
+					}), /* @__PURE__ */ f("div", {
 						style: {
 							display: "grid",
 							gap: 16
 						},
 						children: [
-							/* @__PURE__ */ p("div", { children: [
-								/* @__PURE__ */ f("label", {
+							/* @__PURE__ */ f("div", { children: [
+								/* @__PURE__ */ d("label", {
 									htmlFor: "grid-cols",
 									style: T,
 									children: e("bigconsole.settings.dashboardDefaults.gridColumns.label", "Grid Columns")
 								}),
-								/* @__PURE__ */ f("input", {
+								/* @__PURE__ */ d("input", {
 									id: "grid-cols",
 									type: "number",
 									min: 4,
@@ -204,18 +204,18 @@ var v = e(function() {
 									onChange: (e) => x("defaultGridColumns", parseInt(e.target.value) || 12),
 									style: w
 								}),
-								/* @__PURE__ */ f("p", {
+								/* @__PURE__ */ d("p", {
 									style: E,
 									children: e("bigconsole.settings.dashboardDefaults.gridColumns.help", "Number of columns in the dashboard grid (4-24)")
 								})
 							] }),
-							/* @__PURE__ */ p("div", { children: [
-								/* @__PURE__ */ f("label", {
+							/* @__PURE__ */ f("div", { children: [
+								/* @__PURE__ */ d("label", {
 									htmlFor: "widget-height",
 									style: T,
 									children: e("bigconsole.settings.dashboardDefaults.widgetHeight.label", "Default Widget Height")
 								}),
-								/* @__PURE__ */ f("input", {
+								/* @__PURE__ */ d("input", {
 									id: "widget-height",
 									type: "number",
 									min: 2,
@@ -224,50 +224,50 @@ var v = e(function() {
 									onChange: (e) => x("defaultWidgetHeight", parseInt(e.target.value) || 4),
 									style: w
 								}),
-								/* @__PURE__ */ f("p", {
+								/* @__PURE__ */ d("p", {
 									style: E,
 									children: e("bigconsole.settings.dashboardDefaults.widgetHeight.help", "Default height units for new widgets (2-12)")
 								})
 							] }),
-							/* @__PURE__ */ p("div", { children: [
-								/* @__PURE__ */ f("label", {
+							/* @__PURE__ */ f("div", { children: [
+								/* @__PURE__ */ d("label", {
 									htmlFor: "refresh-interval",
 									style: T,
 									children: e("bigconsole.settings.dashboardDefaults.refreshInterval.label", "Auto-Refresh Interval (seconds)")
 								}),
-								/* @__PURE__ */ p("select", {
+								/* @__PURE__ */ f("select", {
 									id: "refresh-interval",
 									value: m.defaultRefreshInterval,
 									onChange: (e) => x("defaultRefreshInterval", parseInt(e.target.value)),
 									style: w,
 									children: [
-										/* @__PURE__ */ f("option", {
+										/* @__PURE__ */ d("option", {
 											value: 0,
 											children: e("bigconsole.settings.dashboardDefaults.refreshInterval.disabled", "Disabled")
 										}),
-										/* @__PURE__ */ f("option", {
+										/* @__PURE__ */ d("option", {
 											value: 10,
 											children: e("bigconsole.settings.dashboardDefaults.refreshInterval.seconds10", "10 seconds")
 										}),
-										/* @__PURE__ */ f("option", {
+										/* @__PURE__ */ d("option", {
 											value: 30,
 											children: e("bigconsole.settings.dashboardDefaults.refreshInterval.seconds30", "30 seconds")
 										}),
-										/* @__PURE__ */ f("option", {
+										/* @__PURE__ */ d("option", {
 											value: 60,
 											children: e("bigconsole.settings.dashboardDefaults.refreshInterval.minute1", "1 minute")
 										}),
-										/* @__PURE__ */ f("option", {
+										/* @__PURE__ */ d("option", {
 											value: 300,
 											children: e("bigconsole.settings.dashboardDefaults.refreshInterval.minutes5", "5 minutes")
 										}),
-										/* @__PURE__ */ f("option", {
+										/* @__PURE__ */ d("option", {
 											value: 600,
 											children: e("bigconsole.settings.dashboardDefaults.refreshInterval.minutes10", "10 minutes")
 										})
 									]
 								}),
-								/* @__PURE__ */ f("p", {
+								/* @__PURE__ */ d("p", {
 									style: E,
 									children: e("bigconsole.settings.dashboardDefaults.refreshInterval.help", "How often widgets refresh their data automatically")
 								})
@@ -275,9 +275,9 @@ var v = e(function() {
 						]
 					})]
 				}),
-				/* @__PURE__ */ p("div", {
+				/* @__PURE__ */ f("div", {
 					style: D,
-					children: [/* @__PURE__ */ f("h2", {
+					children: [/* @__PURE__ */ d("h2", {
 						style: {
 							fontSize: "var(--font-size-body-md)",
 							fontWeight: "var(--font-weight-semibold)",
@@ -285,24 +285,24 @@ var v = e(function() {
 							marginBottom: 16
 						},
 						children: e("bigconsole.settings.cache.title", "Cache")
-					}), /* @__PURE__ */ p("div", {
+					}), /* @__PURE__ */ f("div", {
 						style: {
 							display: "grid",
 							gap: 16
 						},
-						children: [/* @__PURE__ */ p("div", {
+						children: [/* @__PURE__ */ f("div", {
 							style: {
 								display: "flex",
 								alignItems: "center",
 								justifyContent: "space-between"
 							},
-							children: [/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
+							children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("label", {
 								style: T,
 								children: e("bigconsole.settings.cache.enable.label", "Enable Cache")
-							}), /* @__PURE__ */ f("p", {
+							}), /* @__PURE__ */ d("p", {
 								style: E,
 								children: e("bigconsole.settings.cache.enable.help", "Cache widget data to reduce API calls")
-							})] }), /* @__PURE__ */ f("button", {
+							})] }), /* @__PURE__ */ d("button", {
 								onClick: () => x("cacheEnabled", !m.cacheEnabled),
 								role: "switch",
 								"aria-checked": m.cacheEnabled,
@@ -317,7 +317,7 @@ var v = e(function() {
 									position: "relative",
 									transition: "background-color 200ms"
 								},
-								children: /* @__PURE__ */ f("div", { style: {
+								children: /* @__PURE__ */ d("div", { style: {
 									width: 18,
 									height: 18,
 									borderRadius: "50%",
@@ -328,13 +328,13 @@ var v = e(function() {
 									transition: "left 200ms"
 								} })
 							})]
-						}), m.cacheEnabled && /* @__PURE__ */ p("div", { children: [
-							/* @__PURE__ */ f("label", {
+						}), m.cacheEnabled && /* @__PURE__ */ f("div", { children: [
+							/* @__PURE__ */ d("label", {
 								htmlFor: "cache-ttl",
 								style: T,
 								children: e("bigconsole.settings.cache.ttl.label", "Cache TTL (seconds)")
 							}),
-							/* @__PURE__ */ f("input", {
+							/* @__PURE__ */ d("input", {
 								id: "cache-ttl",
 								type: "number",
 								min: 30,
@@ -343,16 +343,16 @@ var v = e(function() {
 								onChange: (e) => x("cacheTTLSeconds", parseInt(e.target.value) || 300),
 								style: w
 							}),
-							/* @__PURE__ */ f("p", {
+							/* @__PURE__ */ d("p", {
 								style: E,
 								children: e("bigconsole.settings.cache.ttl.help", "How long cached data is considered fresh (30-3600)")
 							})
 						] })]
 					})]
 				}),
-				/* @__PURE__ */ p("div", {
+				/* @__PURE__ */ f("div", {
 					style: D,
-					children: [/* @__PURE__ */ f("h2", {
+					children: [/* @__PURE__ */ d("h2", {
 						style: {
 							fontSize: "var(--font-size-body-md)",
 							fontWeight: "var(--font-weight-semibold)",
@@ -360,25 +360,25 @@ var v = e(function() {
 							marginBottom: 16
 						},
 						children: e("bigconsole.settings.display.title", "Display")
-					}), /* @__PURE__ */ p("div", {
+					}), /* @__PURE__ */ f("div", {
 						style: {
 							display: "grid",
 							gap: 16
 						},
 						children: [
-							/* @__PURE__ */ p("div", {
+							/* @__PURE__ */ f("div", {
 								style: {
 									display: "flex",
 									alignItems: "center",
 									justifyContent: "space-between"
 								},
-								children: [/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
+								children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("label", {
 									style: T,
 									children: e("bigconsole.settings.display.widgetBorders.label", "Show Widget Borders")
-								}), /* @__PURE__ */ f("p", {
+								}), /* @__PURE__ */ d("p", {
 									style: E,
 									children: e("bigconsole.settings.display.widgetBorders.help", "Display borders around widgets in dashboards")
-								})] }), /* @__PURE__ */ f("button", {
+								})] }), /* @__PURE__ */ d("button", {
 									onClick: () => x("showWidgetBorders", !m.showWidgetBorders),
 									role: "switch",
 									"aria-checked": m.showWidgetBorders,
@@ -393,7 +393,7 @@ var v = e(function() {
 										position: "relative",
 										transition: "background-color 200ms"
 									},
-									children: /* @__PURE__ */ f("div", { style: {
+									children: /* @__PURE__ */ d("div", { style: {
 										width: 18,
 										height: 18,
 										borderRadius: "50%",
@@ -405,19 +405,19 @@ var v = e(function() {
 									} })
 								})]
 							}),
-							/* @__PURE__ */ p("div", {
+							/* @__PURE__ */ f("div", {
 								style: {
 									display: "flex",
 									alignItems: "center",
 									justifyContent: "space-between"
 								},
-								children: [/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
+								children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("label", {
 									style: T,
 									children: e("bigconsole.settings.display.compactMode.label", "Compact Mode")
-								}), /* @__PURE__ */ f("p", {
+								}), /* @__PURE__ */ d("p", {
 									style: E,
 									children: e("bigconsole.settings.display.compactMode.help", "Reduce padding and spacing for more content")
-								})] }), /* @__PURE__ */ f("button", {
+								})] }), /* @__PURE__ */ d("button", {
 									onClick: () => x("compactMode", !m.compactMode),
 									role: "switch",
 									"aria-checked": m.compactMode,
@@ -432,7 +432,7 @@ var v = e(function() {
 										position: "relative",
 										transition: "background-color 200ms"
 									},
-									children: /* @__PURE__ */ f("div", { style: {
+									children: /* @__PURE__ */ d("div", { style: {
 										width: 18,
 										height: 18,
 										borderRadius: "50%",
@@ -444,19 +444,19 @@ var v = e(function() {
 									} })
 								})]
 							}),
-							/* @__PURE__ */ p("div", {
+							/* @__PURE__ */ f("div", {
 								style: {
 									display: "flex",
 									alignItems: "center",
 									justifyContent: "space-between"
 								},
-								children: [/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
+								children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("label", {
 									style: T,
 									children: e("bigconsole.settings.display.animations.label", "Animations")
-								}), /* @__PURE__ */ f("p", {
+								}), /* @__PURE__ */ d("p", {
 									style: E,
 									children: e("bigconsole.settings.display.animations.help", "Enable transition animations and effects")
-								})] }), /* @__PURE__ */ f("button", {
+								})] }), /* @__PURE__ */ d("button", {
 									onClick: () => x("animationsEnabled", !m.animationsEnabled),
 									role: "switch",
 									"aria-checked": m.animationsEnabled,
@@ -471,7 +471,7 @@ var v = e(function() {
 										position: "relative",
 										transition: "background-color 200ms"
 									},
-									children: /* @__PURE__ */ f("div", { style: {
+									children: /* @__PURE__ */ d("div", { style: {
 										width: 18,
 										height: 18,
 										borderRadius: "50%",