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/components/datasink/ImportDataSinkDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ImportDataSinkDialog.js","names":[],"sources":["../../../../src/bigconsole/components/datasink/ImportDataSinkDialog.tsx"],"sourcesContent":["/*\n ImportDataSinkDialog Component\n \n Modal dialog for importing a DataSink from JSON file.\n * Supports both creating new DataSinks and updating existing ones.\n /\n\nimport { type FC, memo, useState, useCallback, useEffect, useRef } from 'react';\nimport {\n Dialog,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogTitle,\n} from '@burdenoff/fe-libs/ui';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Input } from '@burdenoff/fe-libs/ui';\nimport { Label } from '@burdenoff/fe-libs/ui';\nimport { Spinner } from '@burdenoff/fe-libs/ui';\nimport { Badge } from '@burdenoff/fe-libs/ui';\nimport { Upload, FileJson, Check, XCircle, ArrowLeft, RefreshCw, Info } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useImportDataSink, type ImportDataSinkOptions } from '../../hooks';\nimport { useBigConsoleAnalytics } from '../../hooks/useBigConsoleAnalytics';\nimport { Section, SectionStack } from '../common';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface ImportDataSinkDialogProps {\n isOpen: boolean;\n onClose: () => void;\n onSuccess?: (dataSinkId: string, dataSinkName: string \| null, originalUpdated: boolean) => void;\n}\n\ntype ImportStep = 'select' \| 'preview' \| 'importing' \| 'complete';\n\n/\n Wizard steps. The dialog previously moved between three screens with no\n * indicator at all, so a user could not tell where they were.\n /\nconst WIZARD_STEPS: { id: ImportStep; label: string }[] = [\n { id: 'select', label: 'Choose file' },\n { id: 'preview', label: 'Review' },\n { id: 'complete', label: 'Done' },\n];\n\n/* Index of the wizard step currently on screen ('importing' still shows Review). /\nfunction wizardIndex(step: ImportStep): number {\n if (step === 'select') return 0;\n if (step === 'complete') return 2;\n return 1;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const ImportDataSinkDialog: FC<ImportDataSinkDialogProps> = memo(function ImportDataSinkDialog({\n isOpen,\n onClose,\n onSuccess,\n}) {\n const { t } = useI18n();\n const [step, setStep] = useState<ImportStep>('select');\n const [, setSelectedFile] = useState<File \| null>(null);\n const [fileContent, setFileContent] = useState<string \| null>(null);\n const [nameOverride, setNameOverride] = useState('');\n const [keyOverride, setKeyOverride] = useState('');\n\n const fileInputRef = useRef<HTMLInputElement>(null);\n\n const {\n loading,\n error,\n validationResult,\n importResult,\n validateImport,\n importDataSink,\n extractDataSinkId,\n clearState,\n } = useImportDataSink();\n const emitBigConsoleEvent = useBigConsoleAnalytics();\n\n // Reset state when dialog opens\n useEffect(() => {\n if (isOpen) {\n setStep('select');\n setSelectedFile(null);\n setFileContent(null);\n setNameOverride('');\n setKeyOverride('');\n clearState();\n }\n }, [isOpen, clearState]);\n\n // Handle file selection\n const handleFileSelect = useCallback(\n async (e: React.ChangeEvent<HTMLInputElement>) => {\n const file = e.target.files?.[0];\n if (!file) return;\n\n if (!file.name.endsWith('.json')) {\n alert(t('bigconsole.dataSinks.import.selectJsonFile', 'Please select a JSON file'));\n return;\n }\n\n setSelectedFile(file);\n\n const reader = new FileReader();\n reader.onload = async (event) => {\n const content = event.target?.result as string;\n setFileContent(content);\n\n const result = validateImport(content);\n if (result.isValid && result.dataSinkInfo) {\n setStep('preview');\n setNameOverride(result.dataSinkInfo.name \|\| '');\n setKeyOverride(result.dataSinkInfo.key \|\| '');\n } else {\n setStep('preview');\n }\n };\n reader.onerror = () => {\n alert(t('bigconsole.dataSinks.import.readFileError', 'Failed to read file'));\n };\n reader.readAsText(file);\n },\n [validateImport, t]\n );\n\n // Handle file drop\n const handleDrop = useCallback((e: React.DragEvent) => {\n e.preventDefault();\n const file = e.dataTransfer.files?.[0];\n if (file) {\n const dt = new DataTransfer();\n dt.items.add(file);\n if (fileInputRef.current) {\n fileInputRef.current.files = dt.files;\n fileInputRef.current.dispatchEvent(new Event('change', { bubbles: true }));\n }\n }\n }, []);\n\n // Handle import\n const handleImport = useCallback(async () => {\n if (!fileContent) return;\n\n setStep('importing');\n\n const options: ImportDataSinkOptions = {\n name: nameOverride.trim() \|\| undefined,\n key: keyOverride.trim() \|\| undefined,\n };\n\n emitBigConsoleEvent('bigconsole.data_sink.import_clicked', { source: 'import' });\n\n const result = await importDataSink(fileContent, options);\n\n if (result?.success && result.dataSink) {\n setStep('complete');\n emitBigConsoleEvent('bigconsole.data_sink.imported', {\n dataSinkId: result.dataSink.id,\n source: 'import',\n originalUpdated: result.originalUpdated ?? false,\n });\n onSuccess?.(result.dataSink.id, result.dataSink.name, result.originalUpdated ?? false);\n } else {\n setStep('preview');\n }\n }, [emitBigConsoleEvent, fileContent, importDataSink, keyOverride, nameOverride, onSuccess]);\n\n const canClose = !loading && step !== 'importing';\n const dataSinkId = fileContent ? extractDataSinkId(fileContent) : null;\n const currentStepIndex = wizardIndex(step);\n\n return (\n <Dialog open={isOpen} onOpenChange={(open) => !open && canClose && onClose()}>\n <DialogContent className=\"flex max-h-[85vh] flex-col sm:max-w-lg\">\n <DialogHeader>\n <div className=\"flex items-center gap-3\">\n <div className=\"flex size-10 items-center justify-center rounded-card bg-bg-accentSubtle\">\n <Upload className=\"size-5 text-text-link\" />\n </div>\n <DialogTitle>{t('bigconsole.dataSinks.import.title', 'Import DataSink')}</DialogTitle>\n </div>\n <DialogDescription>\n {t(\n 'bigconsole.dataSinks.import.description',\n 'Upload a DataSink export file to restore it into this workspace.'\n )}\n </DialogDescription>\n </DialogHeader>\n\n {/ Step indicator — structural strip so the wizard reads as a sequence. /}\n <ol className=\"flex flex-wrap items-center gap-x-icon-gap gap-y-1 text-xs\" aria-label=\"Import progress\">\n {WIZARD_STEPS.map((wizardStep, index) => (\n <li\n key={wizardStep.id}\n aria-current={index === currentStepIndex ? 'step' : undefined}\n className={`flex items-center gap-icon-gap ${\n index === currentStepIndex ? 'font-semibold text-text-primary' : 'text-text-muted'\n }`}\n >\n <span\n className={`inline-flex size-5 items-center justify-center rounded-pill text-[10px] ${\n index <= currentStepIndex ? 'bg-action-primary-bg text-action-primary-text' : 'bg-bg-sunken'\n }`}\n >\n {index + 1}\n </span>\n {wizardStep.label}\n {index < WIZARD_STEPS.length - 1 && (\n <span aria-hidden=\"true\" className=\"text-text-muted\">\n ›\n </span>\n )}\n </li>\n ))}\n </ol>\n\n <div className=\"min-w-0 flex-1 overflow-y-auto py-4\">\n <SectionStack>\n {/ Step 1: File Selection /}\n {step === 'select' && (\n <Section\n title=\"Choose an export file\"\n description={t(\n 'bigconsole.dataSinks.import.supportedFilesHint',\n 'Only .json files exported from BigConsole are supported'\n )}\n headingLevel={3}\n bodyClassName=\"mt-form-gap\"\n >\n <div\n onDragOver={(e) => e.preventDefault()}\n onDrop={handleDrop}\n className=\"rounded-card border-2 border-dashed border-[var(--color-border-default)] p-8 text-center hover:border-[var(--color-action-primary-bg)] motion-safe:transition-colors\"\n >\n <FileJson className=\"mx-auto mb-4 size-12 text-text-secondary\" />\n <p className=\"mb-2 text-sm\">\n {t('bigconsole.dataSinks.import.dropzoneText', 'Drag and drop a DataSink export file here')}\n </p>\n <p className=\"mb-4 text-xs text-text-secondary\">{t('bigconsole.dataSinks.import.or', 'or')}</p>\n <input ref={fileInputRef} type=\"file\" accept=\".json\" onChange={handleFileSelect} className=\"hidden\" />\n <Button onClick={() => fileInputRef.current?.click()} disabled={loading}>\n {t('bigconsole.dataSinks.import.browseFiles', 'Browse Files')}\n </Button>\n </div>\n </Section>\n )}\n\n {/ Step 2: Preview & Options /}\n {(step === 'preview' \|\| step === 'importing') && validationResult && (\n <>\n {/ What is in the file — supporting detail. /}\n {validationResult.dataSinkInfo && (\n <Section\n emphasis=\"muted\"\n padding=\"compact\"\n headingLevel={3}\n title=\"File contents\"\n description=\"What this export file describes.\"\n bodyClassName=\"space-y-2\"\n >\n <div className=\"flex items-center justify-between gap-icon-gap\">\n <span className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.nameLabel', 'Name')}\n </span>\n <span className=\"min-w-0 truncate text-sm font-medium\">\n {validationResult.dataSinkInfo.name \|\| t('bigconsole.dataSinks.import.unnamed', 'Unnamed')}\n </span>\n </div>\n <div className=\"flex items-center justify-between gap-icon-gap\">\n <span className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.keyLabel', 'Key')}\n </span>\n <span className=\"min-w-0 truncate font-mono text-xs\">{validationResult.dataSinkInfo.key}</span>\n </div>\n <div className=\"flex items-center justify-between gap-icon-gap\">\n <span className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.statusLabel', 'Status')}\n </span>\n <Badge variant=\"secondary\">{validationResult.dataSinkInfo.status}</Badge>\n </div>\n <div className=\"flex items-center justify-between gap-icon-gap\">\n <span className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.setupStateLabel', 'Setup State')}\n </span>\n <Badge variant=\"outline\">{validationResult.dataSinkInfo.setupState}</Badge>\n </div>\n {validationResult.dataSinkInfo.exportedFrom && (\n <div className=\"flex items-center justify-between gap-icon-gap\">\n <span className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.sourceIdLabel', 'Source ID')}\n </span>\n <span className=\"min-w-0 max-w-[180px] truncate font-mono text-xs text-text-secondary\">\n {validationResult.dataSinkInfo.exportedFrom}\n </span>\n </div>\n )}\n <div className=\"flex items-center justify-between gap-icon-gap\">\n <span className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.schemaVersionLabel', 'Schema Version')}\n </span>\n <span className=\"text-xs text-text-secondary\">{validationResult.dataSinkInfo.schemaVersion}</span>\n </div>\n </Section>\n )}\n\n {/ Validation Errors /}\n {validationResult.errors.length > 0 && (\n <Section\n tone=\"danger\"\n padding=\"compact\"\n headingLevel={3}\n title={t('bigconsole.dataSinks.import.errorsHeading', 'Errors ({{count}})', {\n count: validationResult.errors.length,\n })}\n icon={<XCircle className=\"size-4\" />}\n >\n <ul className=\"space-y-1 text-xs text-status-error-text\">\n {validationResult.errors.map((err, idx) => (\n <li key={idx}>\n <span className=\"font-mono\">[{err.code}]</span> {err.message}\n </li>\n ))}\n </ul>\n </Section>\n )}\n\n {/ Import Options /}\n {validationResult.isValid && (\n <Section\n title={t('bigconsole.dataSinks.import.optionsHeading', 'Import Options')}\n description=\"Rename the sink or give it a different key before importing.\"\n headingLevel={3}\n bodyClassName=\"space-y-form-gap\"\n >\n <Section\n tone=\"info\"\n emphasis=\"muted\"\n padding=\"compact\"\n headingLevel={4}\n icon={<Info className=\"size-4\" />}\n title={\n dataSinkId\n ? t(\n 'bigconsole.dataSinks.import.checkExistingHeading',\n 'Import will check for existing DataSink'\n )\n : t('bigconsole.dataSinks.import.newWillBeCreatedHeading', 'A new DataSink will be created')\n }\n >\n <div className=\"text-xs text-[var(--color-status-info-text)]\">\n {dataSinkId ? (\n <>\n <p>\n {t('bigconsole.dataSinks.import.ifOriginalExistsPrefix', 'If the original DataSink (ID:')}{' '}\n <code className=\"rounded-input bg-bg-surface px-1 font-mono\">\n {dataSinkId.slice(0, 8)}...\n </code>\n {t('bigconsole.dataSinks.import.ifOriginalExistsSuffix', ') exists:')}\n </p>\n <ul className=\"mt-1 list-inside list-disc space-y-0.5\">\n <li>\n {t(\n 'bigconsole.dataSinks.import.withChangesUpdate',\n 'With changes → Update the existing DataSink'\n )}\n </li>\n <li>\n {t(\n 'bigconsole.dataSinks.import.noChangesMessage',\n 'No changes → Show \"already exists\" message'\n )}\n </li>\n </ul>\n <p className=\"mt-1\">\n {t(\n 'bigconsole.dataSinks.import.ifNotExistsCreate',\n \"If original doesn't exist → Create a new DataSink\"\n )}\n </p>\n </>\n ) : (\n <p>\n {t(\n 'bigconsole.dataSinks.import.newWillBeCreatedBody',\n 'Import as a new DataSink with the specified configuration.'\n )}\n </p>\n )}\n </div>\n </Section>\n\n <div className=\"space-y-2\">\n <Label htmlFor=\"import-name\">\n {t('bigconsole.dataSinks.import.nameFieldLabel', 'DataSink Name')}\n </Label>\n <Input\n id=\"import-name\"\n type=\"text\"\n value={nameOverride}\n onChange={(e) => setNameOverride(e.target.value)}\n placeholder={\n validationResult.dataSinkInfo?.name \|\|\n t('bigconsole.dataSinks.import.namePlaceholder', 'DataSink name')\n }\n disabled={step === 'importing'}\n />\n </div>\n\n <div className=\"space-y-2\">\n <Label htmlFor=\"import-key\">\n {t('bigconsole.dataSinks.import.keyFieldLabel', 'DataSink Key')}\n </Label>\n <Input\n id=\"import-key\"\n type=\"text\"\n value={keyOverride}\n onChange={(e) => setKeyOverride(e.target.value)}\n placeholder={\n validationResult.dataSinkInfo?.key \|\|\n t('bigconsole.dataSinks.import.keyPlaceholder', 'datasink-key')\n }\n disabled={step === 'importing'}\n />\n <p className=\"text-xs text-text-secondary\">\n {t(\n 'bigconsole.dataSinks.import.keyHelp',\n 'Use a unique key to avoid conflicts with existing DataSinks.'\n )}\n </p>\n </div>\n </Section>\n )}\n </>\n )}\n\n {/ Step 3: Complete /}\n {step === 'complete' && importResult?.success && (\n <>\n {/ Already Exists - No Changes /}\n {importResult.alreadyExists && (\n <Section\n tone=\"info\"\n headingLevel={3}\n title={t('bigconsole.dataSinks.import.alreadyExistsTitle', 'DataSink Already Exists')}\n icon={<Info className=\"h-icon-sm w-icon-sm\" />}\n >\n <p className=\"text-sm text-text-secondary\">\n {t(\n 'bigconsole.dataSinks.import.alreadyExistsBody',\n 'DataSink \"{{name}}\" already exists with the same data. No changes were made.',\n { name: importResult.dataSink?.name \|\| importResult.dataSink?.key \|\| '' }\n )}\n </p>\n </Section>\n )}\n\n {/ Updated Existing /}\n {importResult.originalUpdated && !importResult.alreadyExists && (\n <Section\n tone=\"success\"\n headingLevel={3}\n title={t('bigconsole.dataSinks.import.updatedTitle', 'DataSink Updated!')}\n icon={<RefreshCw className=\"h-icon-sm w-icon-sm\" />}\n >\n <p className=\"text-sm text-text-secondary\">\n {t(\n 'bigconsole.dataSinks.import.updatedBody',\n 'DataSink \"{{name}}\" has been updated with the imported data.',\n { name: importResult.dataSink?.name \|\| importResult.dataSink?.key \|\| '' }\n )}\n </p>\n </Section>\n )}\n\n {/ Created New /}\n {!importResult.originalUpdated && !importResult.alreadyExists && (\n <Section\n tone=\"success\"\n headingLevel={3}\n title={t('bigconsole.dataSinks.import.successTitle', 'Import Successful!')}\n icon={<Check className=\"h-icon-sm w-icon-sm\" />}\n >\n <p className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.successBody', 'DataSink \"{{name}}\" has been created.', {\n name: importResult.dataSink?.name \|\| importResult.dataSink?.key \|\| '',\n })}\n </p>\n </Section>\n )}\n </>\n )}\n\n {/ Error */}\n {error && (\n <Section tone=\"danger\" padding=\"compact\" headingLevel={3} title=\"Import failed\">\n <p className=\"text-sm text-status-error-text\">{error.message}</p>\n </Section>\n )}\n\n {importResult && !importResult.success && importResult.errorMessage && (\n <Section tone=\"danger\" padding=\"compact\" headingLevel={3} title=\"Import failed\">\n <p className=\"text-sm text-status-error-text\">{importResult.errorMessage}</p>\n </Section>\n )}\n </SectionStack>\n </div>\n\n <DialogFooter className=\"flex flex-col-reverse gap-control-gap sm:flex-row sm:justify-between\">\n {step === 'preview' ? (\n <Button\n variant=\"ghost\"\n onClick={() => {\n setStep('select');\n setSelectedFile(null);\n setFileContent(null);\n clearState();\n }}\n disabled={loading}\n >\n <ArrowLeft className=\"size-4\" />\n {t('bigconsole.dataSinks.import.back', 'Back')}\n </Button>\n ) : (\n <span aria-hidden=\"true\" className=\"hidden sm:block\" />\n )}\n\n <div className=\"flex flex-wrap items-center gap-2\">\n {step !== 'complete' && (\n <Button variant=\"outline\" onClick={onClose} disabled={!canClose}>\n {t('bigconsole.dataSinks.import.cancel', 'Cancel')}\n </Button>\n )}\n\n {step === 'preview' && validationResult?.isValid && (\n <Button onClick={handleImport} disabled={loading}>\n <Upload className=\"size-4\" />\n {t('bigconsole.dataSinks.import.importButton', 'Import DataSink')}\n </Button>\n )}\n\n {step === 'importing' && (\n <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <Spinner className=\"size-4\" />\n {t('bigconsole.dataSinks.import.importing', 'Importing...')}\n </div>\n )}\n\n {step === 'complete' && <Button onClick={onClose}>{t('bigconsole.dataSinks.import.done', 'Done')}</Button>}\n </div>\n </DialogFooter>\n </DialogContent>\n </Dialog>\n );\n});\n\nexport default ImportDataSinkDialog;\n"],"mappings":"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"}
1	+ {"version":3,"file":"ImportDataSinkDialog.js","names":[],"sources":["../../../../src/bigconsole/components/datasink/ImportDataSinkDialog.tsx"],"sourcesContent":["/*\n ImportDataSinkDialog Component\n \n Modal dialog for importing a DataSink from JSON file.\n * Supports both creating new DataSinks and updating existing ones.\n /\n\nimport { type FC, memo, useState, useCallback, useEffect, useRef } from 'react';\nimport {\n Dialog,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogTitle,\n} from '@burdenoff/fe-libs/ui';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Input } from '@burdenoff/fe-libs/ui';\nimport { Label } from '@burdenoff/fe-libs/ui';\nimport { Spinner } from '@burdenoff/fe-libs/ui';\nimport { Badge } from '@burdenoff/fe-libs/ui';\nimport { Upload, FileJson, Check, XCircle, ArrowLeft, RefreshCw, Info } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useImportDataSink, type ImportDataSinkOptions } from '../../hooks';\nimport { useBigConsoleAnalytics } from '../../hooks/useBigConsoleAnalytics';\nimport { Section, SectionStack } from '../common';\nimport { reportBigConsoleQuotaError } from '../../utils/quota';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface ImportDataSinkDialogProps {\n isOpen: boolean;\n onClose: () => void;\n onSuccess?: (dataSinkId: string, dataSinkName: string \| null, originalUpdated: boolean) => void;\n}\n\ntype ImportStep = 'select' \| 'preview' \| 'importing' \| 'complete';\n\n/\n Wizard steps. The dialog previously moved between three screens with no\n * indicator at all, so a user could not tell where they were.\n /\nconst WIZARD_STEPS: { id: ImportStep; label: string }[] = [\n { id: 'select', label: 'Choose file' },\n { id: 'preview', label: 'Review' },\n { id: 'complete', label: 'Done' },\n];\n\n/* Index of the wizard step currently on screen ('importing' still shows Review). /\nfunction wizardIndex(step: ImportStep): number {\n if (step === 'select') return 0;\n if (step === 'complete') return 2;\n return 1;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const ImportDataSinkDialog: FC<ImportDataSinkDialogProps> = memo(function ImportDataSinkDialog({\n isOpen,\n onClose,\n onSuccess,\n}) {\n const { t } = useI18n();\n const [step, setStep] = useState<ImportStep>('select');\n const [, setSelectedFile] = useState<File \| null>(null);\n const [fileContent, setFileContent] = useState<string \| null>(null);\n const [nameOverride, setNameOverride] = useState('');\n const [keyOverride, setKeyOverride] = useState('');\n\n const fileInputRef = useRef<HTMLInputElement>(null);\n\n const {\n loading,\n error,\n validationResult,\n importResult,\n validateImport,\n importDataSink,\n extractDataSinkId,\n clearState,\n } = useImportDataSink();\n const emitBigConsoleEvent = useBigConsoleAnalytics();\n\n // Reset state when dialog opens\n useEffect(() => {\n if (isOpen) {\n setStep('select');\n setSelectedFile(null);\n setFileContent(null);\n setNameOverride('');\n setKeyOverride('');\n clearState();\n }\n }, [isOpen, clearState]);\n\n // Handle file selection\n const handleFileSelect = useCallback(\n async (e: React.ChangeEvent<HTMLInputElement>) => {\n const file = e.target.files?.[0];\n if (!file) return;\n\n if (!file.name.endsWith('.json')) {\n alert(t('bigconsole.dataSinks.import.selectJsonFile', 'Please select a JSON file'));\n return;\n }\n\n setSelectedFile(file);\n\n const reader = new FileReader();\n reader.onload = async (event) => {\n const content = event.target?.result as string;\n setFileContent(content);\n\n const result = validateImport(content);\n if (result.isValid && result.dataSinkInfo) {\n setStep('preview');\n setNameOverride(result.dataSinkInfo.name \|\| '');\n setKeyOverride(result.dataSinkInfo.key \|\| '');\n } else {\n setStep('preview');\n }\n };\n reader.onerror = () => {\n alert(t('bigconsole.dataSinks.import.readFileError', 'Failed to read file'));\n };\n reader.readAsText(file);\n },\n [validateImport, t]\n );\n\n // Handle file drop\n const handleDrop = useCallback((e: React.DragEvent) => {\n e.preventDefault();\n const file = e.dataTransfer.files?.[0];\n if (file) {\n const dt = new DataTransfer();\n dt.items.add(file);\n if (fileInputRef.current) {\n fileInputRef.current.files = dt.files;\n fileInputRef.current.dispatchEvent(new Event('change', { bubbles: true }));\n }\n }\n }, []);\n\n // Handle import\n const handleImport = useCallback(async () => {\n if (!fileContent) return;\n\n setStep('importing');\n\n const options: ImportDataSinkOptions = {\n name: nameOverride.trim() \|\| undefined,\n key: keyOverride.trim() \|\| undefined,\n };\n\n emitBigConsoleEvent('bigconsole.data_sink.import_clicked', { source: 'import' });\n\n let result: Awaited<ReturnType<typeof importDataSink>>;\n try {\n result = await importDataSink(fileContent, options);\n } catch (err) {\n // Quota refusals (e.g. \"Set up billing\" for an org without a billing\n // account, BOFF-7913) are shown by the shared quota dialog.\n if (reportBigConsoleQuotaError(err)) {\n onClose();\n return;\n }\n setStep('preview');\n return;\n }\n\n if (result?.success && result.dataSink) {\n setStep('complete');\n emitBigConsoleEvent('bigconsole.data_sink.imported', {\n dataSinkId: result.dataSink.id,\n source: 'import',\n originalUpdated: result.originalUpdated ?? false,\n });\n onSuccess?.(result.dataSink.id, result.dataSink.name, result.originalUpdated ?? false);\n } else {\n setStep('preview');\n }\n }, [emitBigConsoleEvent, fileContent, importDataSink, keyOverride, nameOverride, onClose, onSuccess]);\n\n const canClose = !loading && step !== 'importing';\n const dataSinkId = fileContent ? extractDataSinkId(fileContent) : null;\n const currentStepIndex = wizardIndex(step);\n\n return (\n <Dialog open={isOpen} onOpenChange={(open) => !open && canClose && onClose()}>\n <DialogContent className=\"flex max-h-[85vh] flex-col sm:max-w-lg\">\n <DialogHeader>\n <div className=\"flex items-center gap-3\">\n <div className=\"flex size-10 items-center justify-center rounded-card bg-bg-accentSubtle\">\n <Upload className=\"size-5 text-text-link\" />\n </div>\n <DialogTitle>{t('bigconsole.dataSinks.import.title', 'Import DataSink')}</DialogTitle>\n </div>\n <DialogDescription>\n {t(\n 'bigconsole.dataSinks.import.description',\n 'Upload a DataSink export file to restore it into this workspace.'\n )}\n </DialogDescription>\n </DialogHeader>\n\n {/ Step indicator — structural strip so the wizard reads as a sequence. /}\n <ol className=\"flex flex-wrap items-center gap-x-icon-gap gap-y-1 text-xs\" aria-label=\"Import progress\">\n {WIZARD_STEPS.map((wizardStep, index) => (\n <li\n key={wizardStep.id}\n aria-current={index === currentStepIndex ? 'step' : undefined}\n className={`flex items-center gap-icon-gap ${\n index === currentStepIndex ? 'font-semibold text-text-primary' : 'text-text-muted'\n }`}\n >\n <span\n className={`inline-flex size-5 items-center justify-center rounded-pill text-[10px] ${\n index <= currentStepIndex ? 'bg-action-primary-bg text-action-primary-text' : 'bg-bg-sunken'\n }`}\n >\n {index + 1}\n </span>\n {wizardStep.label}\n {index < WIZARD_STEPS.length - 1 && (\n <span aria-hidden=\"true\" className=\"text-text-muted\">\n ›\n </span>\n )}\n </li>\n ))}\n </ol>\n\n <div className=\"min-w-0 flex-1 overflow-y-auto py-4\">\n <SectionStack>\n {/ Step 1: File Selection /}\n {step === 'select' && (\n <Section\n title=\"Choose an export file\"\n description={t(\n 'bigconsole.dataSinks.import.supportedFilesHint',\n 'Only .json files exported from BigConsole are supported'\n )}\n headingLevel={3}\n bodyClassName=\"mt-form-gap\"\n >\n <div\n onDragOver={(e) => e.preventDefault()}\n onDrop={handleDrop}\n className=\"rounded-card border-2 border-dashed border-[var(--color-border-default)] p-8 text-center hover:border-[var(--color-action-primary-bg)] motion-safe:transition-colors\"\n >\n <FileJson className=\"mx-auto mb-4 size-12 text-text-secondary\" />\n <p className=\"mb-2 text-sm\">\n {t('bigconsole.dataSinks.import.dropzoneText', 'Drag and drop a DataSink export file here')}\n </p>\n <p className=\"mb-4 text-xs text-text-secondary\">{t('bigconsole.dataSinks.import.or', 'or')}</p>\n <input ref={fileInputRef} type=\"file\" accept=\".json\" onChange={handleFileSelect} className=\"hidden\" />\n <Button onClick={() => fileInputRef.current?.click()} disabled={loading}>\n {t('bigconsole.dataSinks.import.browseFiles', 'Browse Files')}\n </Button>\n </div>\n </Section>\n )}\n\n {/ Step 2: Preview & Options /}\n {(step === 'preview' \|\| step === 'importing') && validationResult && (\n <>\n {/ What is in the file — supporting detail. /}\n {validationResult.dataSinkInfo && (\n <Section\n emphasis=\"muted\"\n padding=\"compact\"\n headingLevel={3}\n title=\"File contents\"\n description=\"What this export file describes.\"\n bodyClassName=\"space-y-2\"\n >\n <div className=\"flex items-center justify-between gap-icon-gap\">\n <span className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.nameLabel', 'Name')}\n </span>\n <span className=\"min-w-0 truncate text-sm font-medium\">\n {validationResult.dataSinkInfo.name \|\| t('bigconsole.dataSinks.import.unnamed', 'Unnamed')}\n </span>\n </div>\n <div className=\"flex items-center justify-between gap-icon-gap\">\n <span className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.keyLabel', 'Key')}\n </span>\n <span className=\"min-w-0 truncate font-mono text-xs\">{validationResult.dataSinkInfo.key}</span>\n </div>\n <div className=\"flex items-center justify-between gap-icon-gap\">\n <span className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.statusLabel', 'Status')}\n </span>\n <Badge variant=\"secondary\">{validationResult.dataSinkInfo.status}</Badge>\n </div>\n <div className=\"flex items-center justify-between gap-icon-gap\">\n <span className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.setupStateLabel', 'Setup State')}\n </span>\n <Badge variant=\"outline\">{validationResult.dataSinkInfo.setupState}</Badge>\n </div>\n {validationResult.dataSinkInfo.exportedFrom && (\n <div className=\"flex items-center justify-between gap-icon-gap\">\n <span className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.sourceIdLabel', 'Source ID')}\n </span>\n <span className=\"min-w-0 max-w-[180px] truncate font-mono text-xs text-text-secondary\">\n {validationResult.dataSinkInfo.exportedFrom}\n </span>\n </div>\n )}\n <div className=\"flex items-center justify-between gap-icon-gap\">\n <span className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.schemaVersionLabel', 'Schema Version')}\n </span>\n <span className=\"text-xs text-text-secondary\">{validationResult.dataSinkInfo.schemaVersion}</span>\n </div>\n </Section>\n )}\n\n {/ Validation Errors /}\n {validationResult.errors.length > 0 && (\n <Section\n tone=\"danger\"\n padding=\"compact\"\n headingLevel={3}\n title={t('bigconsole.dataSinks.import.errorsHeading', 'Errors ({{count}})', {\n count: validationResult.errors.length,\n })}\n icon={<XCircle className=\"size-4\" />}\n >\n <ul className=\"space-y-1 text-xs text-status-error-text\">\n {validationResult.errors.map((err, idx) => (\n <li key={idx}>\n <span className=\"font-mono\">[{err.code}]</span> {err.message}\n </li>\n ))}\n </ul>\n </Section>\n )}\n\n {/ Import Options /}\n {validationResult.isValid && (\n <Section\n title={t('bigconsole.dataSinks.import.optionsHeading', 'Import Options')}\n description=\"Rename the sink or give it a different key before importing.\"\n headingLevel={3}\n bodyClassName=\"space-y-form-gap\"\n >\n <Section\n tone=\"info\"\n emphasis=\"muted\"\n padding=\"compact\"\n headingLevel={4}\n icon={<Info className=\"size-4\" />}\n title={\n dataSinkId\n ? t(\n 'bigconsole.dataSinks.import.checkExistingHeading',\n 'Import will check for existing DataSink'\n )\n : t('bigconsole.dataSinks.import.newWillBeCreatedHeading', 'A new DataSink will be created')\n }\n >\n <div className=\"text-xs text-[var(--color-status-info-text)]\">\n {dataSinkId ? (\n <>\n <p>\n {t('bigconsole.dataSinks.import.ifOriginalExistsPrefix', 'If the original DataSink (ID:')}{' '}\n <code className=\"rounded-input bg-bg-surface px-1 font-mono\">\n {dataSinkId.slice(0, 8)}...\n </code>\n {t('bigconsole.dataSinks.import.ifOriginalExistsSuffix', ') exists:')}\n </p>\n <ul className=\"mt-1 list-inside list-disc space-y-0.5\">\n <li>\n {t(\n 'bigconsole.dataSinks.import.withChangesUpdate',\n 'With changes → Update the existing DataSink'\n )}\n </li>\n <li>\n {t(\n 'bigconsole.dataSinks.import.noChangesMessage',\n 'No changes → Show \"already exists\" message'\n )}\n </li>\n </ul>\n <p className=\"mt-1\">\n {t(\n 'bigconsole.dataSinks.import.ifNotExistsCreate',\n \"If original doesn't exist → Create a new DataSink\"\n )}\n </p>\n </>\n ) : (\n <p>\n {t(\n 'bigconsole.dataSinks.import.newWillBeCreatedBody',\n 'Import as a new DataSink with the specified configuration.'\n )}\n </p>\n )}\n </div>\n </Section>\n\n <div className=\"space-y-2\">\n <Label htmlFor=\"import-name\">\n {t('bigconsole.dataSinks.import.nameFieldLabel', 'DataSink Name')}\n </Label>\n <Input\n id=\"import-name\"\n type=\"text\"\n value={nameOverride}\n onChange={(e) => setNameOverride(e.target.value)}\n placeholder={\n validationResult.dataSinkInfo?.name \|\|\n t('bigconsole.dataSinks.import.namePlaceholder', 'DataSink name')\n }\n disabled={step === 'importing'}\n />\n </div>\n\n <div className=\"space-y-2\">\n <Label htmlFor=\"import-key\">\n {t('bigconsole.dataSinks.import.keyFieldLabel', 'DataSink Key')}\n </Label>\n <Input\n id=\"import-key\"\n type=\"text\"\n value={keyOverride}\n onChange={(e) => setKeyOverride(e.target.value)}\n placeholder={\n validationResult.dataSinkInfo?.key \|\|\n t('bigconsole.dataSinks.import.keyPlaceholder', 'datasink-key')\n }\n disabled={step === 'importing'}\n />\n <p className=\"text-xs text-text-secondary\">\n {t(\n 'bigconsole.dataSinks.import.keyHelp',\n 'Use a unique key to avoid conflicts with existing DataSinks.'\n )}\n </p>\n </div>\n </Section>\n )}\n </>\n )}\n\n {/ Step 3: Complete /}\n {step === 'complete' && importResult?.success && (\n <>\n {/ Already Exists - No Changes /}\n {importResult.alreadyExists && (\n <Section\n tone=\"info\"\n headingLevel={3}\n title={t('bigconsole.dataSinks.import.alreadyExistsTitle', 'DataSink Already Exists')}\n icon={<Info className=\"h-icon-sm w-icon-sm\" />}\n >\n <p className=\"text-sm text-text-secondary\">\n {t(\n 'bigconsole.dataSinks.import.alreadyExistsBody',\n 'DataSink \"{{name}}\" already exists with the same data. No changes were made.',\n { name: importResult.dataSink?.name \|\| importResult.dataSink?.key \|\| '' }\n )}\n </p>\n </Section>\n )}\n\n {/ Updated Existing /}\n {importResult.originalUpdated && !importResult.alreadyExists && (\n <Section\n tone=\"success\"\n headingLevel={3}\n title={t('bigconsole.dataSinks.import.updatedTitle', 'DataSink Updated!')}\n icon={<RefreshCw className=\"h-icon-sm w-icon-sm\" />}\n >\n <p className=\"text-sm text-text-secondary\">\n {t(\n 'bigconsole.dataSinks.import.updatedBody',\n 'DataSink \"{{name}}\" has been updated with the imported data.',\n { name: importResult.dataSink?.name \|\| importResult.dataSink?.key \|\| '' }\n )}\n </p>\n </Section>\n )}\n\n {/ Created New /}\n {!importResult.originalUpdated && !importResult.alreadyExists && (\n <Section\n tone=\"success\"\n headingLevel={3}\n title={t('bigconsole.dataSinks.import.successTitle', 'Import Successful!')}\n icon={<Check className=\"h-icon-sm w-icon-sm\" />}\n >\n <p className=\"text-sm text-text-secondary\">\n {t('bigconsole.dataSinks.import.successBody', 'DataSink \"{{name}}\" has been created.', {\n name: importResult.dataSink?.name \|\| importResult.dataSink?.key \|\| '',\n })}\n </p>\n </Section>\n )}\n </>\n )}\n\n {/ Error */}\n {error && (\n <Section tone=\"danger\" padding=\"compact\" headingLevel={3} title=\"Import failed\">\n <p className=\"text-sm text-status-error-text\">{error.message}</p>\n </Section>\n )}\n\n {importResult && !importResult.success && importResult.errorMessage && (\n <Section tone=\"danger\" padding=\"compact\" headingLevel={3} title=\"Import failed\">\n <p className=\"text-sm text-status-error-text\">{importResult.errorMessage}</p>\n </Section>\n )}\n </SectionStack>\n </div>\n\n <DialogFooter className=\"flex flex-col-reverse gap-control-gap sm:flex-row sm:justify-between\">\n {step === 'preview' ? (\n <Button\n variant=\"ghost\"\n onClick={() => {\n setStep('select');\n setSelectedFile(null);\n setFileContent(null);\n clearState();\n }}\n disabled={loading}\n >\n <ArrowLeft className=\"size-4\" />\n {t('bigconsole.dataSinks.import.back', 'Back')}\n </Button>\n ) : (\n <span aria-hidden=\"true\" className=\"hidden sm:block\" />\n )}\n\n <div className=\"flex flex-wrap items-center gap-2\">\n {step !== 'complete' && (\n <Button variant=\"outline\" onClick={onClose} disabled={!canClose}>\n {t('bigconsole.dataSinks.import.cancel', 'Cancel')}\n </Button>\n )}\n\n {step === 'preview' && validationResult?.isValid && (\n <Button onClick={handleImport} disabled={loading}>\n <Upload className=\"size-4\" />\n {t('bigconsole.dataSinks.import.importButton', 'Import DataSink')}\n </Button>\n )}\n\n {step === 'importing' && (\n <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <Spinner className=\"size-4\" />\n {t('bigconsole.dataSinks.import.importing', 'Importing...')}\n </div>\n )}\n\n {step === 'complete' && <Button onClick={onClose}>{t('bigconsole.dataSinks.import.done', 'Done')}</Button>}\n </div>\n </DialogFooter>\n </DialogContent>\n </Dialog>\n );\n});\n\nexport default ImportDataSinkDialog;\n"],"mappings":"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"}

package/dist/bigconsole/components/datasink/RefreshTypeSelector.js CHANGED Viewed

@@ -1,11 +1,11 @@
 import "../common/sectionStyles.js";
 import "../common/index.js";
 import { memo as e, useCallback as t, useEffect as n, useMemo as r, useRef as i, useState as a } from "react";
-import { useI18n as o } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { useI18n as c } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 //#region src/bigconsole/components/datasink/RefreshTypeSelector.tsx
 var l = e(function({ value: e, onChange: l, disabled: u = !1, error: d }) {
-	let { t: f } = o(), p = r(() => [
+	let { t: f } = c(), p = r(() => [
 		{
 			label: f("bigconsole.dataSinks.refreshType.presetEvery5MinutesLabel", "Every 5 minutes"),
 			cron: "*/5 * * * *",
@@ -135,19 +135,19 @@ var l = e(function({ value: e, onChange: l, disabled: u = !1, error: d }) {
 		S,
 		v
 	]);
-	return /* @__PURE__ */ c("div", {
+	return /* @__PURE__ */ s("div", {
 		className: "space-y-4",
 		children: [
-			/* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("label", {
+			/* @__PURE__ */ s("div", { children: [/* @__PURE__ */ o("label", {
 				className: "block text-sm font-medium text-text-primary mb-1",
 				children: f("bigconsole.dataSinks.refreshType.heading", "Refresh Type")
-			}), /* @__PURE__ */ s("p", {
+			}), /* @__PURE__ */ o("p", {
 				className: "text-xs text-text-secondary",
 				children: f("bigconsole.dataSinks.refreshType.headingDescription", "When should this data be updated?")
 			})] }),
-			/* @__PURE__ */ c("div", {
+			/* @__PURE__ */ s("div", {
 				className: "space-y-list-gap",
-				children: [/* @__PURE__ */ c("label", {
+				children: [/* @__PURE__ */ s("label", {
 					className: `
             flex cursor-pointer items-start gap-3
             rounded-input
@@ -156,65 +156,65 @@ var l = e(function({ value: e, onChange: l, disabled: u = !1, error: d }) {
             ${u ? "cursor-not-allowed opacity-50" : ""}
             ${g === "manual" ? "border-[var(--color-action-primary-bg)] bg-bg-accentSubtle" : "border-[var(--color-border-subtle)] hover:border-[var(--color-border-strong)]"}
           `,
-					children: [/* @__PURE__ */ s("input", {
+					children: [/* @__PURE__ */ o("input", {
 						type: "radio",
 						name: "refresh-type",
 						checked: g === "manual",
 						onChange: () => D("manual"),
 						disabled: u,
 						className: "\n              mt-0.5\n              h-4 w-4\n              border-[var(--color-border-default)]\n              text-action-primary-bg\n              focus-visible:ring-2\n              focus-visible:ring-ring\n            "
-					}), /* @__PURE__ */ c("div", {
+					}), /* @__PURE__ */ s("div", {
 						className: "flex-1",
-						children: [/* @__PURE__ */ s("span", {
+						children: [/* @__PURE__ */ o("span", {
 							className: "text-sm font-medium text-text-primary",
 							children: f("bigconsole.dataSinks.refreshType.manualLabel", "Manual")
-						}), /* @__PURE__ */ s("p", {
+						}), /* @__PURE__ */ o("p", {
 							className: "text-xs text-text-secondary mt-0.5",
 							children: f("bigconsole.dataSinks.refreshType.manualDescription", "Data refreshes only when you click the \"Refresh\" button")
 						})]
 					})]
-				}), /* @__PURE__ */ c("div", {
+				}), /* @__PURE__ */ s("div", {
 					className: `
             rounded-input border
             motion-safe:transition-colors
             ${u ? "opacity-50" : ""}
             ${g === "scheduled" ? "border-[var(--color-action-primary-bg)] bg-bg-accentSubtle" : "border-[var(--color-border-subtle)]"}
           `,
-					children: [/* @__PURE__ */ c("label", {
+					children: [/* @__PURE__ */ s("label", {
 						className: `
               flex items-start gap-3
               p-4
               cursor-pointer
               ${u ? "cursor-not-allowed" : ""}
             `,
-						children: [/* @__PURE__ */ s("input", {
+						children: [/* @__PURE__ */ o("input", {
 							type: "radio",
 							name: "refresh-type",
 							checked: g === "scheduled",
 							onChange: () => D("scheduled"),
 							disabled: u,
 							className: "\n                mt-0.5\n                h-4 w-4\n                border-[var(--color-border-default)]\n                text-action-primary-bg\n                focus-visible:ring-2\n                focus-visible:ring-ring\n              "
-						}), /* @__PURE__ */ c("div", {
+						}), /* @__PURE__ */ s("div", {
 							className: "flex-1",
-							children: [/* @__PURE__ */ s("span", {
+							children: [/* @__PURE__ */ o("span", {
 								className: "text-sm font-medium text-text-primary",
 								children: f("bigconsole.dataSinks.refreshType.automaticLabel", "Automatic")
-							}), /* @__PURE__ */ s("p", {
+							}), /* @__PURE__ */ o("p", {
 								className: "text-xs text-text-secondary mt-0.5",
 								children: f("bigconsole.dataSinks.refreshType.automaticDescription", "Data refreshes on a schedule")
 							})]
 						})]
-					}), g === "scheduled" && /* @__PURE__ */ c("div", {
+					}), g === "scheduled" && /* @__PURE__ */ s("div", {
 						className: "space-y-form-gap px-4 pb-4",
 						children: [
-							/* @__PURE__ */ c("div", {
+							/* @__PURE__ */ s("div", {
 								className: "border-t border-[var(--color-border-subtle)] pt-4",
-								children: [/* @__PURE__ */ s("label", {
+								children: [/* @__PURE__ */ o("label", {
 									className: "mb-2 block text-xs font-medium text-text-secondary",
 									children: f("bigconsole.dataSinks.refreshType.scheduleLabel", "Schedule")
-								}), /* @__PURE__ */ s("div", {
+								}), /* @__PURE__ */ o("div", {
 									className: "grid grid-cols-1 gap-2 sm:grid-cols-2",
-									children: p.map((e) => /* @__PURE__ */ s("button", {
+									children: p.map((e) => /* @__PURE__ */ o("button", {
 										type: "button",
 										onClick: () => O(e),
 										disabled: u,
@@ -228,14 +228,14 @@ var l = e(function({ value: e, onChange: l, disabled: u = !1, error: d }) {
                         ${u ? "cursor-not-allowed" : "cursor-pointer"}
                         ${!b && v?.cron === e.cron ? "border-[var(--color-action-primary-bg)] bg-bg-accentSubtle text-text-link" : "border-[var(--color-border-subtle)] hover:border-[var(--color-border-strong)]"}
                       `,
-										children: /* @__PURE__ */ s("span", {
+										children: /* @__PURE__ */ o("span", {
 											className: "text-sm font-medium",
 											children: e.label
 										})
 									}, e.cron))
 								})]
 							}),
-							/* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("button", {
+							/* @__PURE__ */ s("div", { children: [/* @__PURE__ */ o("button", {
 								type: "button",
 								onClick: k,
 								disabled: u,
@@ -245,9 +245,9 @@ var l = e(function({ value: e, onChange: l, disabled: u = !1, error: d }) {
                     ${b ? "text-text-link" : "text-text-secondary hover:text-text-primary"}
                   `,
 								children: b ? f("bigconsole.dataSinks.refreshType.usingCustomSchedule", "Using custom schedule") : f("bigconsole.dataSinks.refreshType.useCustomSchedule", "Use custom schedule...")
-							}), b && /* @__PURE__ */ c("div", {
+							}), b && /* @__PURE__ */ s("div", {
 								className: "mt-2",
-								children: [/* @__PURE__ */ s("input", {
+								children: [/* @__PURE__ */ o("input", {
 									type: "text",
 									"aria-label": "Custom cron expression",
 									value: S,
@@ -255,22 +255,22 @@ var l = e(function({ value: e, onChange: l, disabled: u = !1, error: d }) {
 									disabled: u,
 									placeholder: "*/15 * * * *",
 									className: "\n                        h-control-md w-full min-w-0\n                        rounded-input\n                        border border-[var(--color-border-default)]\n                        bg-bg-sunken\n                        px-3\n                        font-mono\n                        text-sm text-text-primary\n                        focus-visible:outline-none\n                        focus-visible:ring-2\n                        focus-visible:ring-ring\n                      "
-								}), /* @__PURE__ */ s("p", {
+								}), /* @__PURE__ */ o("p", {
 									className: "mt-1 text-xs text-text-muted",
 									children: f("bigconsole.dataSinks.refreshType.customCronHelp", "Enter a cron expression (e.g., */15 * * * * for every 15 minutes)")
 								})]
 							})] }),
-							/* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("label", {
+							/* @__PURE__ */ s("div", { children: [/* @__PURE__ */ o("label", {
 								htmlFor: "refresh-timezone",
 								className: "mb-2 block text-xs font-medium text-text-secondary",
 								children: f("bigconsole.dataSinks.refreshType.timezoneLabel", "Timezone")
-							}), /* @__PURE__ */ s("select", {
+							}), /* @__PURE__ */ o("select", {
 								id: "refresh-timezone",
 								value: w,
 								onChange: j,
 								disabled: u,
 								className: "\n                    h-control-md w-full min-w-0\n                    rounded-input\n                    border border-[var(--color-border-default)]\n                    bg-bg-sunken\n                    px-3\n                    text-sm text-text-primary\n                    focus-visible:outline-none\n                    focus-visible:ring-2\n                    focus-visible:ring-ring\n                  ",
-								children: m.map((e) => /* @__PURE__ */ s("option", {
+								children: m.map((e) => /* @__PURE__ */ o("option", {
 									value: e.value,
 									children: e.label
 								}, e.value))
@@ -279,20 +279,20 @@ var l = e(function({ value: e, onChange: l, disabled: u = !1, error: d }) {
 					})]
 				})]
 			}),
-			d && /* @__PURE__ */ c("div", {
+			d && /* @__PURE__ */ s("div", {
 				className: "flex items-start gap-2",
-				children: [/* @__PURE__ */ s("svg", {
+				children: [/* @__PURE__ */ o("svg", {
 					className: "w-4 h-4 text-status-error-text flex-shrink-0 mt-0.5",
 					fill: "none",
 					stroke: "currentColor",
 					viewBox: "0 0 24 24",
-					children: /* @__PURE__ */ s("path", {
+					children: /* @__PURE__ */ o("path", {
 						strokeLinecap: "round",
 						strokeLinejoin: "round",
 						strokeWidth: 2,
 						d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
 					})
-				}), /* @__PURE__ */ s("p", {
+				}), /* @__PURE__ */ o("p", {
 					className: "text-xs text-status-error-text",
 					children: d
 				})]

package/dist/bigconsole/components/overview/DashboardGuide.js ADDED Viewed

@@ -0,0 +1,214 @@
+import { splitGuideEmphasis as e } from "./dashboardGuideSteps.js";
+import { Fragment as t, memo as n, useId as r } from "react";
+import { ArrowRight as i, ChevronDown as a, Database as o, FileCode2 as s, GraduationCap as c, LayoutDashboard as l, LayoutGrid as u, Lightbulb as d, Share2 as f, Sparkles as p, Upload as m } from "lucide-react";
+import { Badge as h, Button as g } from "@burdenoff/fe-libs/ui";
+import { jsx as _, jsxs as v } from "react/jsx-runtime";
+//#region src/bigconsole/components/overview/DashboardGuide.tsx
+var y = {
+	createDataSink: /* @__PURE__ */ _(o, {
+		className: "size-4",
+		"aria-hidden": "true"
+	}),
+	loadData: /* @__PURE__ */ _(m, {
+		className: "size-4",
+		"aria-hidden": "true"
+	}),
+	shapeWithParser: /* @__PURE__ */ _(s, {
+		className: "size-4",
+		"aria-hidden": "true"
+	}),
+	createDashboard: /* @__PURE__ */ _(l, {
+		className: "size-4",
+		"aria-hidden": "true"
+	}),
+	addWidgets: /* @__PURE__ */ _(u, {
+		className: "size-4",
+		"aria-hidden": "true"
+	}),
+	saveAndShare: /* @__PURE__ */ _(f, {
+		className: "size-4",
+		"aria-hidden": "true"
+	})
+};
+function b(n) {
+	return e(n).map((e, n) => e.emphasis ? /* @__PURE__ */ _("strong", {
+		className: "font-semibold text-text-primary",
+		children: e.text
+	}, n) : /* @__PURE__ */ _(t, { children: e.text }, n));
+}
+var x = ({ action: e, variant: t, onNavigate: n }) => /* @__PURE__ */ v(g, {
+	type: "button",
+	size: "sm",
+	variant: t,
+	onClick: () => n(e.path),
+	className: "min-h-11 sm:min-h-9",
+	children: [e.label, t === "default" ? /* @__PURE__ */ _(i, {
+		className: "size-4",
+		"aria-hidden": "true"
+	}) : null]
+}), S = n(function({ step: e, number: t, optionalLabel: n, stepPrefix: r, onNavigate: i }) {
+	return /* @__PURE__ */ v("li", {
+		"data-tour": `bigconsole-overview-guide-step-${e.id}`,
+		"data-testid": `overview-guide-step-${e.id}`,
+		className: "flex h-full flex-col gap-3 rounded-card border border-[var(--color-border-seam)] bg-bg-canvas p-4",
+		children: [
+			/* @__PURE__ */ v("div", {
+				className: "flex items-start gap-3",
+				children: [/* @__PURE__ */ _("span", {
+					"aria-hidden": "true",
+					className: "inline-flex size-8 shrink-0 items-center justify-center rounded-full bg-action-primary-bg text-sm font-semibold tabular-nums text-action-primary-text",
+					children: t
+				}), /* @__PURE__ */ v("div", {
+					className: "flex min-w-0 flex-1 flex-wrap items-center gap-x-2 gap-y-1 pt-1",
+					children: [
+						/* @__PURE__ */ _("span", {
+							className: "text-text-secondary",
+							children: y[e.id]
+						}),
+						/* @__PURE__ */ v("h3", {
+							className: "text-sm font-semibold text-text-primary",
+							children: [/* @__PURE__ */ _("span", {
+								className: "sr-only",
+								children: `${r} `
+							}), e.title]
+						}),
+						e.optional ? /* @__PURE__ */ _(h, {
+							variant: "secondary",
+							children: n
+						}) : null
+					]
+				})]
+			}),
+			/* @__PURE__ */ _("p", {
+				className: "text-sm leading-relaxed text-text-secondary",
+				children: b(e.body)
+			}),
+			e.tips.length > 0 ? /* @__PURE__ */ _("ul", {
+				className: "space-y-1.5",
+				children: e.tips.map((e) => /* @__PURE__ */ v("li", {
+					className: "flex gap-2 text-xs leading-relaxed text-text-secondary",
+					children: [/* @__PURE__ */ _(d, {
+						className: "mt-0.5 size-3.5 shrink-0 text-[var(--color-status-warning-text)]",
+						"aria-hidden": "true"
+					}), /* @__PURE__ */ _("span", { children: b(e) })]
+				}, e))
+			}) : null,
+			/* @__PURE__ */ v("div", {
+				className: "mt-auto space-y-1.5 pt-1",
+				children: [/* @__PURE__ */ v("div", {
+					className: "flex flex-wrap items-center gap-2",
+					children: [e.action ? /* @__PURE__ */ _(x, {
+						action: e.action,
+						variant: "default",
+						onNavigate: i
+					}) : e.noPermissionMessage ? /* @__PURE__ */ _("p", {
+						className: "text-xs text-text-muted",
+						children: e.noPermissionMessage
+					}) : null, e.secondaryAction ? /* @__PURE__ */ _(x, {
+						action: e.secondaryAction,
+						variant: "ghost",
+						onNavigate: i
+					}) : null]
+				}), e.action?.hint ? /* @__PURE__ */ _("p", {
+					className: "text-xs text-text-muted",
+					children: e.action.hint
+				}) : null]
+			})
+		]
+	});
+}), C = n(function({ steps: e, alternative: n, labels: o, expanded: s, onToggle: l, onNavigate: u }) {
+	let d = r(), f = r();
+	return /* @__PURE__ */ v("section", {
+		"aria-labelledby": d,
+		"data-tour": "bigconsole-overview-guide",
+		"data-testid": "overview-guide",
+		className: "rounded-card border border-[var(--color-border-seam)] bg-bg-surface shadow-[var(--shadow-elevation-1)]",
+		children: [/* @__PURE__ */ v("div", {
+			className: "flex flex-col gap-3 p-5 sm:flex-row sm:items-center sm:justify-between",
+			children: [/* @__PURE__ */ v("div", {
+				className: "flex min-w-0 items-start gap-3",
+				children: [/* @__PURE__ */ _("span", {
+					"aria-hidden": "true",
+					className: "inline-flex size-10 shrink-0 items-center justify-center rounded-lg bg-[var(--color-accent-soft)] text-text-primary",
+					children: /* @__PURE__ */ _(c, { className: "size-5" })
+				}), /* @__PURE__ */ v("div", {
+					className: "min-w-0",
+					children: [/* @__PURE__ */ _("h2", {
+						id: d,
+						className: "text-lg font-semibold tracking-tight text-text-primary",
+						children: o.title
+					}), /* @__PURE__ */ _("p", {
+						className: "mt-1 text-sm text-text-secondary",
+						children: o.subtitle
+					})]
+				})]
+			}), /* @__PURE__ */ v(g, {
+				type: "button",
+				variant: "outline",
+				size: "sm",
+				onClick: l,
+				"aria-expanded": s,
+				"aria-controls": f,
+				className: "min-h-11 shrink-0 self-start sm:min-h-9 sm:self-center",
+				"data-testid": "overview-guide-toggle",
+				children: [s ? o.hide : o.show, /* @__PURE__ */ _(a, {
+					className: `size-4 transition-transform motion-reduce:transition-none ${s ? "rotate-180" : ""}`,
+					"aria-hidden": "true"
+				})]
+			})]
+		}), /* @__PURE__ */ v("div", {
+			id: f,
+			hidden: !s,
+			className: "space-y-5 border-t border-[var(--color-border-seam)] p-5",
+			children: [
+				/* @__PURE__ */ _("div", {
+					"aria-hidden": "true",
+					className: "flex flex-wrap items-center gap-2",
+					children: o.flow.map((e, n) => /* @__PURE__ */ v(t, { children: [n > 0 ? /* @__PURE__ */ _(i, { className: "size-3.5 text-text-muted" }) : null, /* @__PURE__ */ _("span", {
+						className: "rounded-pill border border-[var(--color-border-seam)] bg-bg-sunken px-2.5 py-1 text-xs font-medium text-text-secondary",
+						children: e
+					})] }, e))
+				}),
+				/* @__PURE__ */ _("ol", {
+					role: "list",
+					className: "grid grid-cols-1 gap-3 md:grid-cols-2 xl:grid-cols-3",
+					children: e.map((e, t) => /* @__PURE__ */ _(S, {
+						step: e,
+						number: t + 1,
+						optionalLabel: o.optional,
+						stepPrefix: o.stepPrefix(t + 1),
+						onNavigate: u
+					}, e.id))
+				}),
+				n ? /* @__PURE__ */ v("div", {
+					"data-testid": "overview-guide-ai",
+					className: "flex flex-col gap-3 rounded-card border border-dashed border-[var(--color-border-seam)] p-4 sm:flex-row sm:items-center sm:justify-between",
+					children: [/* @__PURE__ */ v("div", {
+						className: "flex min-w-0 items-start gap-3",
+						children: [/* @__PURE__ */ _(p, {
+							className: "mt-0.5 size-4 shrink-0 text-text-secondary",
+							"aria-hidden": "true"
+						}), /* @__PURE__ */ v("div", {
+							className: "min-w-0",
+							children: [/* @__PURE__ */ _("p", {
+								className: "text-sm font-semibold text-text-primary",
+								children: n.title
+							}), /* @__PURE__ */ _("p", {
+								className: "mt-1 text-sm leading-relaxed text-text-secondary",
+								children: b(n.body)
+							})]
+						})]
+					}), /* @__PURE__ */ _(x, {
+						action: n.action,
+						variant: "outline",
+						onNavigate: u
+					})]
+				}) : null
+			]
+		})]
+	});
+});
+//#endregion
+export { C as default, b as renderGuideEmphasis };
+//# sourceMappingURL=DashboardGuide.js.map

package/dist/bigconsole/components/overview/DashboardGuide.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DashboardGuide.js","names":[],"sources":["../../../../src/bigconsole/components/overview/DashboardGuide.tsx"],"sourcesContent":["/**\n * DashboardGuide\n *\n * \"How to create a complete dashboard, end to end\" — a numbered, deep-linked\n * walkthrough on the Overview. Props-only (no data fetching, no context): the\n * page builds the steps with `buildDashboardGuideSteps` and passes translated\n * labels, which keeps it renderable in tests and Storybook.\n *\n * It intentionally does not use fe-libs `NextSteps`: that component shows an\n * \"N to go\" counter that only decreases for steps marked `done`, and this guide\n * teaches the flow rather than tracking completion.\n */\n\nimport { type FC, type ReactNode, Fragment, memo, useId } from 'react';\nimport { Badge, Button } from '@burdenoff/fe-libs/ui';\nimport {\n ArrowRight,\n ChevronDown,\n Database,\n FileCode2,\n GraduationCap,\n LayoutDashboard,\n LayoutGrid,\n Lightbulb,\n Share2,\n Sparkles,\n Upload,\n} from 'lucide-react';\nimport {\n splitGuideEmphasis,\n type GuideAction,\n type GuideAlternative,\n type GuideStep,\n type GuideStepId,\n} from './dashboardGuideSteps';\n\nexport interface DashboardGuideLabels {\n title: string;\n subtitle: string;\n show: string;\n hide: string;\n optional: string;\n /** Short names for the visual flow strip, in order. */\n flow: string[];\n /** Screen-reader prefix for a step heading, e.g. \"Step 2:\". */\n stepPrefix: (stepNumber: number) => string;\n}\n\nexport interface DashboardGuideProps {\n steps: GuideStep[];\n alternative?: GuideAlternative | null;\n labels: DashboardGuideLabels;\n expanded: boolean;\n onToggle: () => void;\n onNavigate: (path: string) => void;\n}\n\nconst STEP_ICONS: Record<GuideStepId, ReactNode> = {\n createDataSink: <Database className=\"size-4\" aria-hidden=\"true\" />,\n loadData: <Upload className=\"size-4\" aria-hidden=\"true\" />,\n shapeWithParser: <FileCode2 className=\"size-4\" aria-hidden=\"true\" />,\n createDashboard: <LayoutDashboard className=\"size-4\" aria-hidden=\"true\" />,\n addWidgets: <LayoutGrid className=\"size-4\" aria-hidden=\"true\" />,\n saveAndShare: <Share2 className=\"size-4\" aria-hidden=\"true\" />,\n};\n\n/** Render `**label**` markers as emphasised on-screen labels. */\nexport function renderGuideEmphasis(text: string): ReactNode {\n return splitGuideEmphasis(text).map((segment, index) =>\n segment.emphasis ? (\n <strong key={index} className=\"font-semibold text-text-primary\">\n {segment.text}\n </strong>\n ) : (\n <Fragment key={index}>{segment.text}</Fragment>\n )\n );\n}\n\nconst GuideActionButton: FC<{\n action: GuideAction;\n variant: 'default' | 'ghost' | 'outline';\n onNavigate: (path: string) => void;\n}> = ({ action, variant, onNavigate }) => (\n <Button\n type=\"button\"\n size=\"sm\"\n variant={variant}\n onClick={() => onNavigate(action.path)}\n className=\"min-h-11 sm:min-h-9\"\n >\n {action.label}\n {variant === 'default' ? <ArrowRight className=\"size-4\" aria-hidden=\"true\" /> : null}\n </Button>\n);\n\nconst GuideStepCard: FC<{\n step: GuideStep;\n number: number;\n optionalLabel: string;\n stepPrefix: string;\n onNavigate: (path: string) => void;\n}> = memo(function GuideStepCard({ step, number, optionalLabel, stepPrefix, onNavigate }) {\n return (\n <li\n data-tour={`bigconsole-overview-guide-step-${step.id}`}\n data-testid={`overview-guide-step-${step.id}`}\n className=\"flex h-full flex-col gap-3 rounded-card border border-[var(--color-border-seam)] bg-bg-canvas p-4\"\n >\n <div className=\"flex items-start gap-3\">\n <span\n aria-hidden=\"true\"\n className=\"inline-flex size-8 shrink-0 items-center justify-center rounded-full bg-action-primary-bg text-sm font-semibold tabular-nums text-action-primary-text\"\n >\n {number}\n </span>\n <div className=\"flex min-w-0 flex-1 flex-wrap items-center gap-x-2 gap-y-1 pt-1\">\n <span className=\"text-text-secondary\">{STEP_ICONS[step.id]}</span>\n <h3 className=\"text-sm font-semibold text-text-primary\">\n {/* The number badge is decorative; the heading carries the step number. */}\n <span className=\"sr-only\">{`${stepPrefix} `}</span>\n {step.title}\n </h3>\n {step.optional ? <Badge variant=\"secondary\">{optionalLabel}</Badge> : null}\n </div>\n </div>\n\n <p className=\"text-sm leading-relaxed text-text-secondary\">{renderGuideEmphasis(step.body)}</p>\n\n {step.tips.length > 0 ? (\n <ul className=\"space-y-1.5\">\n {step.tips.map((tip) => (\n <li key={tip} className=\"flex gap-2 text-xs leading-relaxed text-text-secondary\">\n <Lightbulb\n className=\"mt-0.5 size-3.5 shrink-0 text-[var(--color-status-warning-text)]\"\n aria-hidden=\"true\"\n />\n <span>{renderGuideEmphasis(tip)}</span>\n </li>\n ))}\n </ul>\n ) : null}\n\n <div className=\"mt-auto space-y-1.5 pt-1\">\n <div className=\"flex flex-wrap items-center gap-2\">\n {step.action ? (\n <GuideActionButton action={step.action} variant=\"default\" onNavigate={onNavigate} />\n ) : step.noPermissionMessage ? (\n <p className=\"text-xs text-text-muted\">{step.noPermissionMessage}</p>\n ) : null}\n {step.secondaryAction ? (\n <GuideActionButton action={step.secondaryAction} variant=\"ghost\" onNavigate={onNavigate} />\n ) : null}\n </div>\n {step.action?.hint ? <p className=\"text-xs text-text-muted\">{step.action.hint}</p> : null}\n </div>\n </li>\n );\n});\n\nexport const DashboardGuide: FC<DashboardGuideProps> = memo(function DashboardGuide({\n steps,\n alternative,\n labels,\n expanded,\n onToggle,\n onNavigate,\n}) {\n const headingId = useId();\n const bodyId = useId();\n\n return (\n <section\n aria-labelledby={headingId}\n data-tour=\"bigconsole-overview-guide\"\n data-testid=\"overview-guide\"\n className=\"rounded-card border border-[var(--color-border-seam)] bg-bg-surface shadow-[var(--shadow-elevation-1)]\"\n >\n <div className=\"flex flex-col gap-3 p-5 sm:flex-row sm:items-center sm:justify-between\">\n <div className=\"flex min-w-0 items-start gap-3\">\n <span\n aria-hidden=\"true\"\n className=\"inline-flex size-10 shrink-0 items-center justify-center rounded-lg bg-[var(--color-accent-soft)] text-text-primary\"\n >\n <GraduationCap className=\"size-5\" />\n </span>\n <div className=\"min-w-0\">\n <h2 id={headingId} className=\"text-lg font-semibold tracking-tight text-text-primary\">\n {labels.title}\n </h2>\n <p className=\"mt-1 text-sm text-text-secondary\">{labels.subtitle}</p>\n </div>\n </div>\n <Button\n type=\"button\"\n variant=\"outline\"\n size=\"sm\"\n onClick={onToggle}\n aria-expanded={expanded}\n aria-controls={bodyId}\n className=\"min-h-11 shrink-0 self-start sm:min-h-9 sm:self-center\"\n data-testid=\"overview-guide-toggle\"\n >\n {expanded ? labels.hide : labels.show}\n <ChevronDown\n className={`size-4 transition-transform motion-reduce:transition-none ${expanded ? 'rotate-180' : ''}`}\n aria-hidden=\"true\"\n />\n </Button>\n </div>\n\n {/* Kept in the DOM (hidden when collapsed) so aria-controls always\n references an element. */}\n <div id={bodyId} hidden={!expanded} className=\"space-y-5 border-t border-[var(--color-border-seam)] p-5\">\n {/* Visual summary of the flow. Decorative: the numbered step headings\n below carry the same information for assistive technology. */}\n <div aria-hidden=\"true\" className=\"flex flex-wrap items-center gap-2\">\n {labels.flow.map((name, index) => (\n <Fragment key={name}>\n {index > 0 ? <ArrowRight className=\"size-3.5 text-text-muted\" /> : null}\n <span className=\"rounded-pill border border-[var(--color-border-seam)] bg-bg-sunken px-2.5 py-1 text-xs font-medium text-text-secondary\">\n {name}\n </span>\n </Fragment>\n ))}\n </div>\n\n {/* role=\"list\": WebKit drops list semantics from unstyled lists. */}\n <ol role=\"list\" className=\"grid grid-cols-1 gap-3 md:grid-cols-2 xl:grid-cols-3\">\n {steps.map((step, index) => (\n <GuideStepCard\n key={step.id}\n step={step}\n number={index + 1}\n optionalLabel={labels.optional}\n stepPrefix={labels.stepPrefix(index + 1)}\n onNavigate={onNavigate}\n />\n ))}\n </ol>\n\n {alternative ? (\n <div\n data-testid=\"overview-guide-ai\"\n className=\"flex flex-col gap-3 rounded-card border border-dashed border-[var(--color-border-seam)] p-4 sm:flex-row sm:items-center sm:justify-between\"\n >\n <div className=\"flex min-w-0 items-start gap-3\">\n <Sparkles className=\"mt-0.5 size-4 shrink-0 text-text-secondary\" aria-hidden=\"true\" />\n <div className=\"min-w-0\">\n <p className=\"text-sm font-semibold text-text-primary\">{alternative.title}</p>\n <p className=\"mt-1 text-sm leading-relaxed text-text-secondary\">\n {renderGuideEmphasis(alternative.body)}\n </p>\n </div>\n </div>\n <GuideActionButton action={alternative.action} variant=\"outline\" onNavigate={onNavigate} />\n </div>\n ) : null}\n </div>\n </section>\n );\n});\n\nexport default DashboardGuide;\n"],"mappings":"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"}