npm - @burdenoff/microfe-bigconsole - Versions diffs - 2026.1006.1 → 2026.1007.11 - Mend

@burdenoff/microfe-bigconsole 2026.1006.1 → 2026.1007.11

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

package/dist/bigconsole/components/dashboard/CreateDashboardDialog.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"CreateDashboardDialog.js","names":[],"sources":["../../../../src/bigconsole/components/dashboard/CreateDashboardDialog.tsx"],"sourcesContent":["/**\n * CreateDashboardDialog Component\n *\n * Modal dialog for creating a new dashboard with name and description.\n * Uses fe-libs shared UI components and semantic tokens for consistent styling.\n * Phase 2: Added TemplatePicker integration for creating from templates.\n */\n\nimport { type FC, memo, useState, useCallback, useEffect, useRef, type KeyboardEvent } 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 { Textarea } from '@burdenoff/fe-libs/ui';\nimport { Spinner } from '@burdenoff/fe-libs/ui';\nimport { Badge } from '@burdenoff/fe-libs/ui';\nimport { Plus, LayoutDashboard, Copy, X, Tag } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { StoreTemplatePicker } from './StoreTemplatePicker';\nimport { TemplateInstallOptions } from './TemplateInstallOptions';\nimport { TemplateLayoutPreview } from './TemplateLayoutPreview';\nimport { templateInputDefaults, templateInputError } from '../../utils/templateInstallInputs';\nimport type { DashboardTemplateContent } from '../../hooks/useStoreDashboardTemplates';\nimport { useActiveContext } from '@burdenoff/fe-libs/shared/providers/shell/ActiveContextProvider';\nimport { Section } from '../common';\nimport { useStoreDashboardTemplates, type StoreDashboardTemplate } from '../../hooks/useStoreDashboardTemplates';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface CreateDashboardDialogProps {\n isOpen: boolean;\n isCreating?: boolean;\n onClose: () => void;\n onCreate: (data: {\n name: string;\n description: string;\n category: string;\n tags?: string[];\n templateId?: string;\n }) => void | Promise<void>;\n /** Whether to show the template picker option */\n showTemplates?: boolean;\n /**\n * Called after a store template has been installed. Receives the new\n * dashboard id and how many widgets still need a data source, so the host can\n * navigate and surface the \"connect your data\" prompts.\n */\n onTemplateInstalled?: (result: { dashboardId: string; widgetsNeedingData: number }) => void;\n}\n\ntype CreateMode = 'blank' | 'template';\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const CreateDashboardDialog: FC<CreateDashboardDialogProps> = memo(function CreateDashboardDialog({\n isOpen,\n isCreating = false,\n onClose,\n onCreate,\n showTemplates = true,\n onTemplateInstalled,\n}) {\n const { t } = useI18n();\n const {\n templates,\n loading: templatesLoading,\n error: templatesError,\n fetchTemplateContent,\n installTemplate,\n } = useStoreDashboardTemplates({ autoLoad: showTemplates });\n const [installing, setInstalling] = useState(false);\n const { workspaceId } = useActiveContext();\n const activeWorkspaceRef = useRef(workspaceId);\n activeWorkspaceRef.current = workspaceId;\n const [templateContent, setTemplateContent] = useState<DashboardTemplateContent | null>(null);\n const [contentOwner, setContentOwner] = useState<string | null>(null);\n const [contentLoading, setContentLoading] = useState(false);\n const [dataSinkBindings, setDataSinkBindings] = useState<Record<string, string>>({});\n const [inputValues, setInputValues] = useState<Record<string, unknown>>({});\n const [mode, setMode] = useState<CreateMode>('blank');\n const [name, setName] = useState('');\n const [description, setDescription] = useState('');\n const [tags, setTags] = useState<string[]>([]);\n const [tagInput, setTagInput] = useState('');\n const [selectedTemplate, setSelectedTemplate] = useState<StoreDashboardTemplate | null>(null);\n const [error, setError] = useState<string | null>(null);\n const nameInputRef = useRef<HTMLInputElement>(null);\n const ownedContent = contentOwner === `${selectedTemplate?.id}:${workspaceId}` ? templateContent : null;\n\n // Reset form when dialog opens\n useEffect(() => {\n if (isOpen) {\n setMode('blank');\n setName('');\n setDescription('');\n setTags([]);\n setTagInput('');\n setSelectedTemplate(null);\n setError(null);\n setTimeout(() => {\n nameInputRef.current?.focus();\n }, 100);\n }\n }, [isOpen]);\n\n // Handle adding a tag\n const handleAddTag = useCallback(() => {\n const trimmedTag = tagInput.trim().toLowerCase();\n if (trimmedTag && !tags.includes(trimmedTag) && tags.length < 10) {\n setTags((prev) => [...prev, trimmedTag]);\n setTagInput('');\n }\n }, [tagInput, tags]);\n\n useEffect(() => {\n let cancelled = false;\n setTemplateContent(null);\n setDataSinkBindings({});\n setInputValues({});\n setContentLoading(Boolean(selectedTemplate));\n if (!selectedTemplate || !isOpen) return;\n void fetchTemplateContent(selectedTemplate.id).then((content) => {\n if (cancelled) return;\n setTemplateContent(content);\n setContentOwner(`${selectedTemplate.id}:${workspaceId}`);\n setContentLoading(false);\n setInputValues(content ? templateInputDefaults(content.requiredInputs) : {});\n if (!content)\n setError(\n t(\n 'bigconsole.dashboards.createDialog.error.noDefinition',\n 'This template has no dashboard definition attached and cannot be installed.'\n )\n );\n });\n return () => {\n cancelled = true;\n };\n }, [selectedTemplate, fetchTemplateContent, workspaceId, isOpen, t]);\n\n // Handle removing a tag\n const handleRemoveTag = useCallback((tagToRemove: string) => {\n setTags((prev) => prev.filter((tag) => tag !== tagToRemove));\n }, []);\n\n // Handle tag input key press\n const handleTagKeyDown = useCallback(\n (e: KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n handleAddTag();\n } else if (e.key === 'Backspace' && !tagInput && tags.length > 0) {\n // Remove last tag when backspace is pressed on empty input\n setTags((prev) => prev.slice(0, -1));\n }\n },\n [handleAddTag, tagInput, tags.length]\n );\n\n // Handle template selection\n const handleTemplateSelect = useCallback((template: StoreDashboardTemplate) => {\n setSelectedTemplate(template);\n setError(null);\n // Pre-fill name and description from template\n setName(template.name);\n setDescription(template.description || '');\n }, []);\n\n // Handle form submission\n const handleSubmit = useCallback(\n async (e: React.FormEvent) => {\n e.preventDefault();\n\n // For template mode without selection, show error\n if (mode === 'template' && !selectedTemplate) {\n setError(t('bigconsole.dashboards.createDialog.error.selectTemplate', 'Please select a template'));\n return;\n }\n\n const trimmedName = name.trim();\n if (!trimmedName) {\n setError(t('bigconsole.dashboards.createDialog.error.nameRequired', 'Dashboard name is required'));\n nameInputRef.current?.focus();\n return;\n }\n\n if (trimmedName.length < 3) {\n setError(\n t('bigconsole.dashboards.createDialog.error.nameTooShort', 'Dashboard name must be at least 3 characters')\n );\n nameInputRef.current?.focus();\n return;\n }\n\n if (trimmedName.length > 100) {\n setError(\n t('bigconsole.dashboards.createDialog.error.nameTooLong', 'Dashboard name must be less than 100 characters')\n );\n nameInputRef.current?.focus();\n return;\n }\n\n setError(null);\n\n // Store templates are installed here rather than through onCreate: the\n // install carries data-sink bindings and returns which slots are still\n // unconnected, neither of which the plain create path models.\n if (mode === 'template' && selectedTemplate) {\n setInstalling(true);\n try {\n const content = await fetchTemplateContent(selectedTemplate.id);\n if (activeWorkspaceRef.current !== workspaceId) {\n setError(\n t(\n 'bigconsole.dashboards.templateSetup.workspaceChanged',\n 'The workspace changed. Review the template setup before creating your dashboard.'\n )\n );\n return;\n }\n if (!content) {\n setError(\n t(\n 'bigconsole.dashboards.createDialog.error.noDefinition',\n 'This template has no dashboard definition attached and cannot be installed.'\n )\n );\n return;\n }\n\n const inputError = templateInputError(content.requiredInputs, inputValues, t);\n if (inputError) {\n setError(inputError);\n return;\n }\n const result = await installTemplate({\n templateId: selectedTemplate.id,\n templateName: selectedTemplate.name,\n content,\n name: trimmedName,\n description: description.trim(),\n tags,\n dataSinkBindings: Object.entries(dataSinkBindings)\n .filter(([, id]) => id)\n .map(([slot, dataSinkId]) => ({ slot, dataSinkId })),\n inputValues,\n });\n\n if (!result.success) {\n setError(\n result.errorMessage ??\n t('bigconsole.dashboards.createDialog.error.installFailed', 'Failed to create dashboard from template.')\n );\n return;\n }\n\n if (result.dashboardId) {\n onTemplateInstalled?.({\n dashboardId: result.dashboardId,\n widgetsNeedingData: result.widgetsNeedingData,\n });\n }\n onClose();\n } catch (err) {\n setError(\n err instanceof Error\n ? err.message\n : t('bigconsole.dashboards.createDialog.error.installFailed', 'Failed to create dashboard from template.')\n );\n } finally {\n setInstalling(false);\n }\n return;\n }\n\n try {\n await onCreate({\n name: trimmedName,\n description: description.trim(),\n category: 'CUSTOM',\n tags: tags.length > 0 ? tags : undefined,\n });\n } catch (err) {\n setError(\n err instanceof Error\n ? err.message\n : t(\n 'bigconsole.dashboards.createDialog.error.createFailed',\n 'Failed to create dashboard. Please try again.'\n )\n );\n }\n },\n [\n name,\n description,\n tags,\n mode,\n selectedTemplate,\n workspaceId,\n dataSinkBindings,\n inputValues,\n onCreate,\n onClose,\n fetchTemplateContent,\n installTemplate,\n onTemplateInstalled,\n t,\n ]\n );\n\n return (\n <Dialog open={isOpen} onOpenChange={(open) => !open && !isCreating && !installing && onClose()}>\n <DialogContent style={{ maxWidth: mode === 'template' ? '900px' : '480px', width: '100%', padding: 0 }}>\n {/* Header */}\n <DialogHeader style={{ padding: 'var(--space-pagePadding) var(--space-pagePadding) 0' }}>\n <div style={{ display: 'flex', alignItems: 'center', gap: 'var(--space-formGap)' }}>\n <div\n style={{\n display: 'flex',\n height: 'var(--size-controlHeight-lg)',\n width: 'var(--size-controlHeight-lg)',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n borderRadius: 'var(--radius-card)',\n backgroundColor: 'var(--color-bg-accentSubtle)',\n }}\n >\n <LayoutDashboard\n aria-hidden=\"true\"\n style={{\n height: 'var(--size-icon-lg)',\n width: 'var(--size-icon-lg)',\n color: 'var(--color-action-primary-bg)',\n }}\n />\n </div>\n <div>\n <DialogTitle\n style={{\n fontSize: 'var(--font-size-heading-h4)',\n fontWeight: 'var(--font-weight-bold)',\n color: 'var(--color-text-primary)',\n margin: 0,\n }}\n >\n {t('bigconsole.dashboards.createDialog.title', 'Create New Dashboard')}\n </DialogTitle>\n <DialogDescription\n style={{\n fontSize: 'var(--font-size-body-sm)',\n color: 'var(--color-text-secondary)',\n margin: 'var(--space-controlGap) 0 0 0',\n }}\n >\n {t('bigconsole.dashboards.createDialog.subtitle', 'Create a new dashboard to visualize your data')}\n </DialogDescription>\n </div>\n </div>\n </DialogHeader>\n\n <form onSubmit={handleSubmit}>\n {/* Mode Selection Tabs */}\n {showTemplates && (\n <div style={{ padding: 'var(--space-pagePadding) var(--space-pagePadding) 0' }}>\n <div\n role=\"group\"\n aria-label=\"How to start\"\n style={{\n display: 'flex',\n flexWrap: 'wrap',\n gap: 'var(--space-controlGap)',\n padding: 'var(--space-controlGap)',\n backgroundColor: 'var(--color-bg-sunken)',\n borderRadius: 'var(--radius-button)',\n }}\n >\n <button\n type=\"button\"\n disabled={isCreating || installing}\n onClick={() => {\n setMode('blank');\n setSelectedTemplate(null);\n }}\n style={{\n flex: 1,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n gap: 'var(--space-iconGap)',\n padding: 'var(--space-controlGap) var(--space-formGap)',\n borderRadius: 'var(--radius-button)',\n border: 'none',\n backgroundColor: mode === 'blank' ? 'var(--color-bg-surface)' : 'transparent',\n color: mode === 'blank' ? 'var(--color-text-primary)' : 'var(--color-text-secondary)',\n fontWeight: mode === 'blank' ? 'var(--font-weight-semibold)' : 'var(--font-weight-regular)',\n fontSize: 'var(--font-size-body-sm)',\n cursor: 'pointer',\n boxShadow: mode === 'blank' ? 'var(--shadow-elevation-1)' : 'none',\n transition: 'all 0.15s ease',\n }}\n >\n <Plus style={{ height: 'var(--size-icon-sm)', width: 'var(--size-icon-sm)' }} />\n {t('bigconsole.dashboards.createDialog.tab.blank', 'Blank Dashboard')}\n </button>\n <button\n type=\"button\"\n disabled={isCreating || installing}\n onClick={() => setMode('template')}\n style={{\n flex: 1,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n gap: 'var(--space-iconGap)',\n padding: 'var(--space-controlGap) var(--space-formGap)',\n borderRadius: 'var(--radius-button)',\n border: 'none',\n backgroundColor: mode === 'template' ? 'var(--color-bg-surface)' : 'transparent',\n color: mode === 'template' ? 'var(--color-text-primary)' : 'var(--color-text-secondary)',\n fontWeight: mode === 'template' ? 'var(--font-weight-semibold)' : 'var(--font-weight-regular)',\n fontSize: 'var(--font-size-body-sm)',\n cursor: 'pointer',\n boxShadow: mode === 'template' ? 'var(--shadow-elevation-1)' : 'none',\n transition: 'all 0.15s ease',\n }}\n >\n <Copy style={{ height: 'var(--size-icon-sm)', width: 'var(--size-icon-sm)' }} />\n {t('bigconsole.dashboards.createDialog.tab.template', 'From Template')}\n </button>\n </div>\n </div>\n )}\n\n {/* Template Picker (when in template mode) */}\n {mode === 'template' && (\n <div style={{ padding: 'var(--space-pagePadding)', maxHeight: '400px', overflowY: 'auto' }}>\n <StoreTemplatePicker\n templates={templates}\n loading={templatesLoading}\n error={templatesError}\n selectedTemplateId={selectedTemplate?.id}\n onSelect={handleTemplateSelect}\n />\n </div>\n )}\n\n {mode === 'template' && selectedTemplate && (\n <div style={{ padding: 'var(--space-pagePadding)' }}>\n {contentLoading && <Spinner />}\n {ownedContent && (\n <>\n <TemplateLayoutPreview content={ownedContent} />\n <TemplateInstallOptions\n content={ownedContent}\n bindings={dataSinkBindings}\n onBindingChange={(slot, id) => setDataSinkBindings((current) => ({ ...current, [slot]: id }))}\n inputValues={inputValues}\n onInputChange={(name, value) => setInputValues((current) => ({ ...current, [name]: value }))}\n disabled={isCreating || installing}\n />\n </>\n )}\n </div>\n )}\n\n {/* Form Content */}\n <div style={{ padding: 'var(--space-pagePadding)' }}>\n {/*\n The fields carry no surface of their own — the dialog is already a\n raised surface — but they still need a name, so the group is a `bare`\n section. It gives the form a heading screen readers can land on and\n tells the eye where the template picker ends and the form begins.\n */}\n <Section\n headingLevel={3}\n emphasis=\"bare\"\n padding=\"none\"\n title=\"Dashboard details\"\n description=\"Name it now — everything else can change later.\"\n data-testid=\"create-dashboard-details\"\n >\n {/* Name Field */}\n <div style={{ marginBottom: 'var(--space-formGap)' }}>\n <label\n htmlFor=\"dashboard-name\"\n style={{\n display: 'block',\n fontSize: 'var(--font-size-body-sm)',\n fontWeight: 'var(--font-weight-semibold)',\n color: 'var(--color-text-primary)',\n marginBottom: 'var(--space-controlGap)',\n }}\n >\n {t('bigconsole.dashboards.createDialog.field.name', 'Dashboard Name')}\n <span style={{ color: 'var(--color-status-error-text)', marginLeft: 'var(--space-controlGap)' }}>\n *\n </span>\n </label>\n <Input\n ref={nameInputRef}\n id=\"dashboard-name\"\n type=\"text\"\n value={name}\n onChange={(e) => {\n setName(e.target.value);\n if (error) setError(null);\n }}\n placeholder={t('bigconsole.dashboards.createDialog.field.namePlaceholder', 'Enter dashboard name')}\n disabled={isCreating || installing}\n style={{\n height: 'var(--size-controlHeight-md)',\n fontSize: 'var(--font-size-body-sm)',\n borderColor: error ? 'var(--color-status-error-border)' : undefined,\n }}\n />\n {error && (\n <p\n style={{\n fontSize: 'var(--font-size-body-sm)',\n color: 'var(--color-status-error-text)',\n marginTop: 'var(--space-controlGap)',\n fontWeight: 'var(--font-weight-medium)',\n }}\n >\n {error}\n </p>\n )}\n </div>\n\n {/* Description Field */}\n <div style={{ marginBottom: 'var(--space-formGap)' }}>\n <label\n htmlFor=\"dashboard-description\"\n style={{\n display: 'block',\n fontSize: 'var(--font-size-body-sm)',\n fontWeight: 'var(--font-weight-semibold)',\n color: 'var(--color-text-primary)',\n marginBottom: 'var(--space-controlGap)',\n }}\n >\n {t('bigconsole.dashboards.createDialog.field.description', 'Description')}\n <span\n style={{\n color: 'var(--color-text-muted)',\n fontWeight: 'var(--font-weight-regular)',\n marginLeft: 'var(--space-controlGap)',\n }}\n >\n {t('bigconsole.dashboards.createDialog.field.optional', '(optional)')}\n </span>\n </label>\n <Textarea\n id=\"dashboard-description\"\n value={description}\n onChange={(e) => setDescription(e.target.value)}\n placeholder={t(\n 'bigconsole.dashboards.createDialog.field.descriptionPlaceholder',\n 'Enter a brief description for this dashboard'\n )}\n rows={3}\n disabled={isCreating || installing}\n style={{\n fontSize: 'var(--font-size-body-sm)',\n resize: 'none',\n }}\n />\n </div>\n\n {/* Tags Field */}\n <div>\n <label\n htmlFor=\"dashboard-tags\"\n style={{\n display: 'flex',\n alignItems: 'center',\n gap: 'var(--space-iconGap)',\n fontSize: 'var(--font-size-body-sm)',\n fontWeight: 'var(--font-weight-semibold)',\n color: 'var(--color-text-primary)',\n marginBottom: 'var(--space-controlGap)',\n }}\n >\n <Tag style={{ height: 'var(--size-icon-sm)', width: 'var(--size-icon-sm)' }} />\n {t('bigconsole.dashboards.createDialog.field.tags', 'Tags')}\n <span\n style={{\n color: 'var(--color-text-muted)',\n fontWeight: 'var(--font-weight-regular)',\n }}\n >\n {t('bigconsole.dashboards.createDialog.field.tagsOptional', '(optional, max 10)')}\n </span>\n </label>\n {/* Tag chips display */}\n {tags.length > 0 && (\n <div\n style={{\n display: 'flex',\n flexWrap: 'wrap',\n gap: 'var(--space-controlGap)',\n marginBottom: 'var(--space-controlGap)',\n }}\n >\n {tags.map((tag) => (\n <Badge\n key={tag}\n variant=\"secondary\"\n style={{\n display: 'flex',\n alignItems: 'center',\n gap: '4px',\n paddingRight: '4px',\n }}\n >\n {tag}\n <button\n type=\"button\"\n onClick={() => handleRemoveTag(tag)}\n disabled={isCreating || installing}\n style={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n background: 'none',\n border: 'none',\n cursor: 'pointer',\n padding: '2px',\n borderRadius: '50%',\n color: 'inherit',\n opacity: 0.7,\n }}\n onMouseOver={(e) => (e.currentTarget.style.opacity = '1')}\n onMouseOut={(e) => (e.currentTarget.style.opacity = '0.7')}\n >\n <X style={{ height: '12px', width: '12px' }} />\n </button>\n </Badge>\n ))}\n </div>\n )}\n {/* Tag input */}\n <div style={{ display: 'flex', gap: 'var(--space-controlGap)' }}>\n <Input\n id=\"dashboard-tags\"\n type=\"text\"\n value={tagInput}\n onChange={(e) => setTagInput(e.target.value)}\n onKeyDown={handleTagKeyDown}\n placeholder={\n tags.length >= 10\n ? t('bigconsole.dashboards.createDialog.field.tagsMaxReached', 'Max tags reached')\n : t(\n 'bigconsole.dashboards.createDialog.field.tagsInputPlaceholder',\n 'Type a tag and press Enter'\n )\n }\n disabled={isCreating || installing || tags.length >= 10}\n style={{\n flex: 1,\n height: 'var(--size-controlHeight-md)',\n fontSize: 'var(--font-size-body-sm)',\n }}\n />\n <Button\n type=\"button\"\n variant=\"outline\"\n onClick={handleAddTag}\n disabled={isCreating || installing || !tagInput.trim() || tags.length >= 10}\n style={{ height: 'var(--size-controlHeight-md)' }}\n >\n {t('bigconsole.dashboards.createDialog.action.addTag', 'Add')}\n </Button>\n </div>\n <p\n style={{\n // `--font-size-body-xs` is not a real token — the declaration is\n // dropped and the hint inherits body size. `--font-size-xs` is.\n fontSize: 'var(--font-size-xs)',\n color: 'var(--color-text-muted)',\n marginTop: 'var(--space-controlGap)',\n }}\n >\n {t('bigconsole.dashboards.createDialog.field.tagsHelp', 'Press Enter to add a tag, or click Add')}\n </p>\n </div>\n </Section>\n </div>\n\n {/* Footer */}\n <DialogFooter\n style={{\n padding: 'var(--space-formGap) var(--space-pagePadding)',\n borderTop: '1px solid var(--color-border)',\n backgroundColor: 'var(--color-bg-sunken)',\n display: 'flex',\n justifyContent: 'flex-end',\n gap: 'var(--space-controlGap)',\n }}\n >\n <Button\n type=\"button\"\n variant=\"outline\"\n onClick={onClose}\n disabled={isCreating || installing}\n style={{ height: 'var(--size-controlHeight-md)' }}\n >\n {t('bigconsole.dashboards.createDialog.action.cancel', 'Cancel')}\n </Button>\n <Button\n type=\"submit\"\n disabled={\n isCreating ||\n installing ||\n !name.trim() ||\n (mode === 'template' && (!selectedTemplate || !ownedContent || contentLoading))\n }\n style={{\n height: 'var(--size-controlHeight-md)',\n backgroundColor: 'var(--color-action-primary-bg)',\n }}\n >\n {isCreating || installing ? (\n <span style={{ display: 'flex', alignItems: 'center', gap: 'var(--space-iconGap)' }}>\n <Spinner style={{ height: 'var(--size-icon-sm)', width: 'var(--size-icon-sm)' }} />\n {t('bigconsole.dashboards.createDialog.action.creating', 'Creating...')}\n </span>\n ) : (\n <span style={{ display: 'flex', alignItems: 'center', gap: 'var(--space-iconGap)' }}>\n <Plus style={{ height: 'var(--size-icon-sm)', width: 'var(--size-icon-sm)' }} />\n {t('bigconsole.dashboards.createDialog.action.create', 'Create Dashboard')}\n </span>\n )}\n </Button>\n </DialogFooter>\n </form>\n </DialogContent>\n </Dialog>\n );\n});\n\nexport default CreateDashboardDialog;\n"],"mappings":"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"}

package/dist/bigconsole/components/dashboard/DashboardCanvas.d.ts CHANGED Viewed

@@ -42,3 +42,4 @@ export interface DashboardCanvasProps {
 }
 export declare const DashboardCanvas: FC<DashboardCanvasProps>;
 export default DashboardCanvas;
+//# sourceMappingURL=DashboardCanvas.d.ts.map

package/dist/bigconsole/components/dashboard/DashboardCanvas.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DashboardCanvas.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/dashboard/DashboardCanvas.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,KAAK,EAAE,EAA2D,MAAM,OAAO,CAAC;AAsBzF,OAAO,EAAmB,KAAK,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAc3E,MAAM,WAAW,oBAAoB;IACnC,mBAAmB;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,sBAAsB;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+BAA+B;IAC/B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mCAAmC;IACnC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,0CAA0C;IAC1C,KAAK,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC3B,qBAAqB;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iCAAiC;IACjC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,wCAAwC;IACxC,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACrD,kCAAkC;IAClC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,oCAAoC;IACpC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,uCAAuC;IACvC,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,oCAAoC;IACpC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,yCAAyC;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gCAAgC;IAChC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,uEAAuE;IACvE,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAmBD,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAqmBnD,CAAC;AAEH,eAAe,eAAe,CAAC"}

package/dist/bigconsole/components/dashboard/DashboardCanvas.js CHANGED Viewed

@@ -405,3 +405,5 @@ var b = p(function({ dashboardId: p, pageId: b, title: x, onPaste: ge, onSave: _
 });
 //#endregion
 export { b as default };
+//# sourceMappingURL=DashboardCanvas.js.map

package/dist/bigconsole/components/dashboard/DashboardCanvas.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DashboardCanvas.js","names":[],"sources":["../../../../src/bigconsole/components/dashboard/DashboardCanvas.tsx"],"sourcesContent":["/**\n * DashboardCanvas Component\n *\n * Main canvas for dashboard with grid layout and widget rendering.\n * Phase 2: Added GlobalFiltersBar and PageTabsManager integration.\n * Phase 3: Added WidgetPalette sidebar for drag-and-drop widget creation.\n */\n\nimport { type FC, memo, useRef, useState, useCallback, useEffect, useMemo } from 'react';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Plus } from 'lucide-react';\nimport type { Layout } from 'react-grid-layout';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport type { DashboardVisibility, Widget, WidgetType } from '../../types';\nimport { BIGCONSOLE_PERMISSIONS } from '../../../constants/permissions';\nimport { useDashboardStore, useWidgetStore } from '../../store';\nimport { useDashboardOperations } from '../../hooks/useDashboardOperations';\nimport { useWidgetOperations } from '../../hooks/useWidgetOperations';\nimport { useInstalledWidgets } from '../../hooks/useInstalledWidgets';\nimport { useWidgetCatalog } from '../../hooks/useWidgetCatalog';\nimport { useDashboardImageExport } from '../../hooks/useDashboardImageExport';\nimport { useBigConsole } from '../../context';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { Section } from '../common';\nimport { DashboardGrid } from './DashboardGrid';\nimport { loadBigConsoleSettings } from '../../hooks/useBigConsoleSettings';\nimport { DashboardToolbar } from './DashboardToolbar';\nimport { GlobalFiltersBar } from './GlobalFiltersBar';\nimport { LiveBoardBanner } from './LiveBoardBanner';\nimport { TemplateSetupBanner } from './TemplateSetupBanner';\nimport { PageTabsManager, type DashboardPageTab } from './PageTabsManager';\nimport { ShareDialog } from './ShareDialog';\nimport { WidgetPalette } from './WidgetPalette';\nimport { WidgetInspector } from '../builder';\nimport { getWidgetDefinition, type WidgetDefinition } from '../widgets/WidgetRegistry';\n// Phase 2: Cross-filtering context\nimport { CrossFilterProvider } from '../../contexts';\n// Smart widget positioning\nimport { findNextAvailablePosition, calculatePositionFromDrop } from '../../utils/widgetPositioning';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface DashboardCanvasProps {\n /** Dashboard ID */\n dashboardId: string;\n /** Page ID (for loading widgets) */\n pageId?: string;\n /** Dashboard title */\n title?: string;\n /** Callback to paste widget */\n onPaste?: () => void;\n /** Callback when dashboard is saved */\n onSave?: () => void;\n /** Whether save is in progress */\n isSaving?: boolean;\n /** Callback to export dashboard */\n onExport?: () => void;\n onPublishTemplate?: () => void;\n /** Dashboard pages for PageTabsManager */\n pages?: DashboardPageTab[];\n /** Active page ID */\n activePageId?: string;\n /** Callback when page changes */\n onPageChange?: (pageId: string) => void;\n /** Callback when pages are reordered */\n onPagesReorder?: (pages: DashboardPageTab[]) => void;\n /** Callback when page is added */\n onPageAdd?: () => void;\n /** Callback when page is renamed */\n onPageRename?: (pageId: string, newName: string) => void;\n /** Callback when page is duplicated */\n onPageDuplicate?: (pageId: string) => void;\n /** Callback when page is deleted */\n onPageDelete?: (pageId: string) => void;\n /** Whether to show global filters bar */\n showFilters?: boolean;\n /** Whether to show page tabs */\n showPageTabs?: boolean;\n /** Whether to enable cross-filtering (widget clicks update filters) */\n enableCrossFilter?: boolean;\n}\n\ninterface WidgetPlacement {\n position: { x: number; y: number; width: number; height: number };\n definition?: WidgetDefinition | null;\n}\n\ninterface PaletteDropData {\n type: WidgetType;\n name?: string;\n category?: WidgetDefinition['category'];\n defaultConfig?: Record<string, unknown>;\n defaultSize?: WidgetDefinition['defaultSize'];\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const DashboardCanvas: FC<DashboardCanvasProps> = memo(function DashboardCanvas({\n dashboardId,\n pageId,\n title,\n onPaste,\n onSave,\n isSaving = false,\n onExport,\n onPublishTemplate,\n pages = [],\n activePageId,\n onPageChange,\n onPagesReorder,\n onPageAdd,\n onPageRename,\n onPageDuplicate,\n onPageDelete,\n showFilters = true,\n showPageTabs = true,\n enableCrossFilter = true,\n}) {\n const { t } = useI18n();\n const containerRef = useRef<HTMLDivElement>(null);\n // Inner board element (the grid surface) — rasterized for PNG/PDF board-pack export.\n const boardRef = useRef<HTMLDivElement>(null);\n const [containerWidth, setContainerWidth] = useState(1200);\n const [isShareDialogOpen, setIsShareDialogOpen] = useState(false);\n const [widgetCreateError, setWidgetCreateError] = useState<string | null>(null);\n const [isDraggingWidget, setIsDraggingWidget] = useState(false);\n const [dragWidgetType, setDragWidgetType] = useState<WidgetType | null>(null);\n /**\n * Locally confirmed general-access level, keyed by the dashboard it belongs\n * to. Kept out of the dashboard store on purpose: `setCurrentDashboard` also\n * resets the active page and clears undo history, which changing a share\n * setting must not do.\n */\n const [visibilityOverride, setVisibilityOverride] = useState<{ id: string; value: DashboardVisibility } | null>(null);\n\n // Store state\n const isEditMode = useDashboardStore((state) => state.viewMode === 'edit');\n const currentDashboard = useDashboardStore((state) => state.currentDashboard);\n const gridColumns = currentDashboard?.pages.find((page) => page.id === pageId)?.gridColumns ?? 12;\n\n // Mutation only — `skipFetch` keeps this from pulling the whole dashboard list.\n const { updateDashboard } = useDashboardOperations({ skipFetch: true });\n const { hasPermission } = usePermissions();\n const canUpdateDashboard = hasPermission(BIGCONSOLE_PERMISSIONS.DASHBOARD_UPDATE);\n\n /**\n * General access for the board currently on screen. Only surfaced when the\n * loaded dashboard IS this one and its `visibility` came back from the\n * server — the share dialog hides the control otherwise rather than showing\n * a default that may not match reality.\n */\n const dashboardVisibility: DashboardVisibility | undefined =\n visibilityOverride?.id === dashboardId\n ? visibilityOverride.value\n : currentDashboard?.id === dashboardId\n ? currentDashboard.visibility\n : undefined;\n\n const handleVisibilityChange = useCallback(\n async (visibility: DashboardVisibility) => {\n // `updateDashboard` swallows Apollo errors and resolves to null, so null\n // is the failure signal the dialog needs in order to report it.\n const updated = await updateDashboard({ id: dashboardId, visibility });\n if (!updated) {\n throw new Error('The dashboard service did not accept the change.');\n }\n setVisibilityOverride({ id: dashboardId, value: updated.visibility ?? visibility });\n },\n [dashboardId, updateDashboard]\n );\n\n // Fetch installed widgets only in edit mode — the palette and add-widget dialog\n // are not usable in read-only view, so skip the request for viewer-only sessions.\n const { workspaceId, apiGatewayUrl, authToken } = useBigConsole();\n const { installedWidgets, loading: installedWidgetsLoading } = useInstalledWidgets({\n workspaceId,\n apiGatewayUrl,\n authToken,\n enabled: isEditMode,\n });\n // Built-in widget catalog from the backend (getWidgetTypes); falls back to the\n // bundled registry while loading or if the supergraph hasn't adopted it yet.\n const { definitions: widgetCatalog } = useWidgetCatalog({\n workspaceId,\n apiGatewayUrl,\n authToken,\n enabled: isEditMode,\n });\n const zoomLevel = useDashboardStore((state) => state.zoomLevel);\n const sidebarCollapsed = useDashboardStore((state) => state.sidebarCollapsed);\n const toggleSidebar = useDashboardStore((state) => state.toggleSidebar);\n const isPaletteOpen = !sidebarCollapsed;\n const setGlobalFilterValues = useDashboardStore((state) => state.setGlobalFilterValues);\n\n // Handle filter changes - update store for widget access\n const handleFilterChange = useCallback(\n (filterValues: Record<string, unknown>) => {\n // Update global filter values in dashboard store\n setGlobalFilterValues(filterValues);\n\n // Widgets can now access filter values via useGlobalFilterValues() hook\n // When backend supports filter parameters, widget queries will include these values\n },\n [setGlobalFilterValues]\n );\n\n // Widget operations hook (connects to backend) - skipFetch since parent page fetches\n const { createWidget: createWidgetApi } = useWidgetOperations(pageId, dashboardId, { skipFetch: true });\n\n const widgetsMap = useWidgetStore((state) => state.widgets);\n // Filter widgets to only show widgets for the current page\n const widgetsArray = useMemo(() => {\n const allWidgets = Array.from(widgetsMap.values());\n if (!pageId) return allWidgets;\n return allWidgets.filter((widget) => widget.pageId === pageId);\n }, [widgetsMap, pageId]);\n const selectedWidgetId = useWidgetStore((state) => state.selectedWidgetId);\n const selectWidget = useWidgetStore((state) => state.selectWidget);\n const addWidgetToStore = useWidgetStore((state) => state.addWidget);\n const updateWidgetPosition = useWidgetStore((state) => state.updateWidgetPosition);\n const configPanelOpen = useWidgetStore((state) => state.configPanelOpen);\n const closeConfigPanel = useWidgetStore((state) => state.closeConfigPanel);\n\n // Keep react-grid-layout's explicit width in sync with the actual canvas.\n // A ResizeObserver is required because opening the docked inspector or widget\n // palette resizes this element without resizing the browser window.\n useEffect(() => {\n const container = containerRef.current;\n if (!container) return;\n\n const updateWidth = () => {\n setContainerWidth(container.offsetWidth);\n };\n\n updateWidth();\n\n if (typeof ResizeObserver !== 'undefined') {\n const observer = new ResizeObserver(updateWidth);\n observer.observe(container);\n return () => observer.disconnect();\n }\n\n window.addEventListener('resize', updateWidth);\n return () => window.removeEventListener('resize', updateWidth);\n }, []);\n\n // Handle layout change\n const handleLayoutChange = useCallback(\n (layout: Layout[]) => {\n layout.forEach((item) => {\n updateWidgetPosition(item.i, {\n x: item.x,\n y: item.y,\n width: item.w,\n height: item.h,\n });\n });\n },\n [updateWidgetPosition]\n );\n\n // Handle widget select\n const handleWidgetSelect = useCallback(\n (widgetId: string) => {\n selectWidget(widgetId);\n },\n [selectWidget]\n );\n\n // Create with defaults, select the result, then configure it in the inspector.\n const handleAddWidget = useCallback(\n async (widgetData: Partial<Widget>, placement?: WidgetPlacement) => {\n setWidgetCreateError(null);\n const definition = placement?.definition || (widgetData.type ? getWidgetDefinition(widgetData.type) : null);\n const defaults = loadBigConsoleSettings();\n const widgetSize = {\n width: Math.min(definition?.defaultSize?.width ?? 4, gridColumns),\n height: defaults.defaultWidgetHeight,\n };\n\n let position: { x: number; y: number; width: number; height: number };\n if (placement?.position) {\n position = placement.position;\n } else {\n // Use smart placement algorithm - horizontal first, then next row\n const { x, y } = findNextAvailablePosition(widgetsArray, widgetSize, { cols: gridColumns });\n position = {\n x,\n y,\n width: widgetSize.width,\n height: widgetSize.height,\n };\n }\n\n // Preserve legacy binding fields when creating from imported/default data.\n const extendedData = widgetData as Partial<Widget> & { dataSinkId?: string; parserId?: string };\n\n // Try to create via API first\n if (pageId) {\n const widget = await createWidgetApi({\n pageId,\n dashboardId,\n type: widgetData.type!,\n title: widgetData.title || t('bigconsole.dashboards.canvas.untitledWidget', 'Untitled Widget'),\n description: widgetData.description,\n // v2.0: Renderer and template support\n renderer: widgetData.renderer,\n template: widgetData.template,\n config: widgetData.config || {},\n position,\n refreshInterval: widgetData.refreshInterval ?? defaults.defaultRefreshInterval,\n // v2.0: Data source fields (DataSink → Parser → Widget)\n dataSinkId: extendedData.dataSinkId,\n parserId: extendedData.parserId,\n });\n\n if (widget) {\n selectWidget(widget.id);\n return;\n }\n\n setWidgetCreateError(\n t(\n 'bigconsole.dashboards.canvas.widgetCreateError',\n 'Could not create the widget. Check the connection and try again.'\n )\n );\n return;\n }\n\n // Fallback to local store if API fails or no pageId\n const newWidget: Widget = {\n id: crypto.randomUUID(),\n dashboardId,\n pageId: pageId || 'local',\n type: widgetData.type!,\n title: widgetData.title || t('bigconsole.dashboards.canvas.untitledWidget', 'Untitled Widget'),\n description: widgetData.description,\n // v2.0: Renderer and template support\n renderer: widgetData.renderer,\n template: widgetData.template,\n refreshInterval: widgetData.refreshInterval ?? defaults.defaultRefreshInterval,\n config: widgetData.config || {},\n position,\n positionX: position.x,\n positionY: position.y,\n positionWidth: position.width,\n positionHeight: position.height,\n // v2.0: Data source fields (DataSink → Parser → Widget)\n dataSinkId: extendedData.dataSinkId,\n parserId: extendedData.parserId,\n translations: [],\n createdAt: new Date().toISOString(),\n updatedAt: new Date().toISOString(),\n };\n\n addWidgetToStore(newWidget);\n selectWidget(newWidget.id);\n },\n [dashboardId, pageId, createWidgetApi, addWidgetToStore, selectWidget, widgetsArray, gridColumns, t]\n );\n\n // Handle drag start from palette\n const handlePaletteDragStart = useCallback((type: WidgetType) => {\n setIsDraggingWidget(true);\n setDragWidgetType(type);\n }, []);\n\n // Handle drag end from palette\n const handlePaletteDragEnd = useCallback(() => {\n setIsDraggingWidget(false);\n setDragWidgetType(null);\n }, []);\n\n // Handle drop on canvas - create immediately with defaults.\n const handleCanvasDrop = useCallback(\n (e: React.DragEvent) => {\n e.preventDefault();\n setIsDraggingWidget(false);\n setDragWidgetType(null);\n\n try {\n const data = e.dataTransfer.getData('application/json');\n if (!data) return;\n\n const parsedData: unknown = JSON.parse(data);\n if (!parsedData || typeof parsedData !== 'object' || !('type' in parsedData)) return;\n const widgetData = parsedData as PaletteDropData;\n const definition = getWidgetDefinition(widgetData.type);\n\n // If the dropped data includes defaultConfig (from WidgetPalette drag serialization),\n // reconstruct a full WidgetDefinition so installed/store widget identity is preserved.\n let droppedDefinition: WidgetDefinition | null = null;\n if (widgetData.defaultConfig && widgetData.category) {\n droppedDefinition = {\n ...definition,\n name: widgetData.name || definition.name,\n category: widgetData.category,\n defaultConfig: widgetData.defaultConfig,\n defaultSize: widgetData.defaultSize || definition.defaultSize,\n };\n }\n\n // Calculate drop position relative to canvas\n const canvasRect = containerRef.current?.getBoundingClientRect();\n if (!canvasRect) return;\n\n // Use utility to calculate grid position from drop coordinates\n const widgetSize = {\n width: Math.min(definition.defaultSize.width, gridColumns),\n height: loadBigConsoleSettings().defaultWidgetHeight,\n };\n\n const { x: gridX, y: gridY } = calculatePositionFromDrop(\n e.clientX,\n e.clientY,\n canvasRect,\n containerWidth,\n widgetSize,\n { cols: gridColumns }\n );\n\n const position = {\n x: gridX,\n y: gridY,\n width: widgetSize.width,\n height: widgetSize.height,\n };\n\n void handleAddWidget(\n {\n type: widgetData.type,\n title: widgetData.name || definition.name,\n config: widgetData.defaultConfig || definition.defaultConfig,\n },\n { position, definition: droppedDefinition }\n );\n } catch (error) {\n console.error('Failed to handle widget drop:', error);\n }\n },\n [containerWidth, handleAddWidget, gridColumns]\n );\n\n // Handle drag over to allow drop\n const handleCanvasDragOver = useCallback((e: React.DragEvent) => {\n e.preventDefault();\n e.dataTransfer.dropEffect = 'copy';\n }, []);\n\n // Handle widget select from palette (quick add without drag)\n const handlePaletteWidgetSelect = useCallback(\n (type: WidgetType, paletteDefinition?: WidgetDefinition) => {\n const definition = paletteDefinition || getWidgetDefinition(type);\n handleAddWidget({\n type,\n title: definition.name,\n config: definition.defaultConfig,\n });\n },\n [handleAddWidget]\n );\n\n // Toggle palette\n const togglePalette = useCallback(() => {\n toggleSidebar();\n }, [toggleSidebar]);\n\n const openWidgetPalette = useCallback(() => {\n if (sidebarCollapsed) toggleSidebar();\n window.requestAnimationFrame(() => {\n const searchPlaceholder = t('bigconsole.dashboards.widgetPalette.searchPlaceholder', 'Search widgets...');\n document.querySelector<HTMLInputElement>(`input[placeholder=\"${searchPlaceholder}\"]`)?.focus();\n });\n }, [sidebarCollapsed, toggleSidebar, t]);\n\n // Board-pack export (PNG + PDF) — rasterizes the inner board element.\n const {\n exportPNG,\n exportPDF,\n isExporting: isExportingImage,\n } = useDashboardImageExport({ containerRef: boardRef, name: title || 'dashboard' });\n const handleExportImage = useCallback(() => {\n void exportPNG();\n }, [exportPNG]);\n const handleExportPdf = useCallback(() => {\n void exportPDF();\n }, [exportPDF]);\n\n return (\n <div className=\"flex flex-col h-full min-w-0 overflow-hidden\">\n {/* Toolbar */}\n <DashboardToolbar\n dashboardId={dashboardId}\n title={title}\n onAddWidget={openWidgetPalette}\n onTogglePalette={togglePalette}\n isPaletteOpen={isPaletteOpen}\n onPaste={onPaste}\n onSave={onSave}\n isSaving={isSaving}\n onExport={onExport}\n onPublishTemplate={onPublishTemplate}\n onExportImage={handleExportImage}\n onExportPdf={handleExportPdf}\n isExportingImage={isExportingImage}\n onShare={() => setIsShareDialogOpen(true)}\n />\n\n {widgetCreateError && (\n <div role=\"alert\" className=\"mx-card-padding mt-control-gap flex-shrink-0\">\n {/* The section title has no catalog key — BOFF-6004 translated only the\n message and the Dismiss action — so it stays a literal until a key\n lands in src/translations/en.ts. */}\n <Section\n tone=\"danger\"\n padding=\"compact\"\n headingLevel={3}\n data-testid=\"widget-create-error\"\n title=\"Widget not created\"\n description={widgetCreateError}\n actions={\n <Button variant=\"outline\" size=\"sm\" onClick={() => setWidgetCreateError(null)}>\n {t('bigconsole.dashboards.canvas.dismiss', 'Dismiss')}\n </Button>\n }\n />\n </div>\n )}\n\n {/* Live wall-board freshness banner — renders only when the page has\n auto-refreshing widgets (e.g. the Live Bed Board) and not in edit mode. */}\n <TemplateSetupBanner widgets={widgetsArray} isEditMode={isEditMode} />\n <LiveBoardBanner widgets={widgetsArray} isEditMode={isEditMode} />\n\n {/* Global Filters Bar */}\n {showFilters && <GlobalFiltersBar dashboardId={dashboardId} onFilterChange={handleFilterChange} collapsible />}\n\n {/* Page Tabs - always show in edit mode so user can add first page */}\n {showPageTabs && (isEditMode || pages.length > 0) && (\n <PageTabsManager\n pages={pages}\n activePageId={activePageId || pages[0]?.id}\n editable={isEditMode}\n onPageSelect={onPageChange || (() => {})}\n onPagesReorder={\n onPagesReorder\n ? (pageIds) => {\n // Convert string[] to DashboardPageTab[] for the callback\n const reorderedPages = pageIds.map((id) => pages.find((p) => p.id === id)!).filter(Boolean);\n onPagesReorder(reorderedPages);\n }\n : undefined\n }\n onPageCreate={onPageAdd}\n onPageRename={onPageRename}\n onPageDuplicate={onPageDuplicate}\n onPageDelete={onPageDelete}\n />\n )}\n\n {/* Main content area with palette and canvas.\n When the properties inspector is open we reserve equal space on the\n right so the (fixed, non-modal) panel docks beside the canvas instead\n of overlaying the selected widget. */}\n <div\n data-testid=\"dashboard-canvas-panes\"\n className={`flex flex-1 min-w-0 overflow-hidden ${\n // Only reserve the inspector gutter where there is room for both. The\n // panel is `min(420px, 100vw)` wide, so below `lg` it overlays the\n // board instead — reserving 420px there left the canvas a sliver.\n configPanelOpen ? 'lg:mr-[var(--bc-inspector-width,420px)]' : ''\n }`}\n >\n {/* Widget Palette Sidebar */}\n {isEditMode && (\n <WidgetPalette\n isOpen={isPaletteOpen}\n onClose={togglePalette}\n onWidgetSelect={handlePaletteWidgetSelect}\n onDragStart={handlePaletteDragStart}\n onDragEnd={handlePaletteDragEnd}\n installedWidgets={installedWidgets}\n installedWidgetsLoading={installedWidgetsLoading}\n definitions={widgetCatalog}\n />\n )}\n\n {/*\n The board. This is the one `primary` region on the route — everything\n above it is bare chrome or a compact status strip, so the widgets are\n what the eye lands on. It keeps the recessed canvas surface on purpose:\n the widgets are the raised cards, the board is the well they sit in.\n The drop border is always 2px (transparent when idle) so drag-over\n highlights without nudging the whole board.\n */}\n <div\n ref={containerRef}\n role=\"region\"\n aria-label=\"Dashboard board\"\n data-section-emphasis=\"primary\"\n data-testid=\"dashboard-board\"\n className=\"relative min-w-0 flex-1 overflow-auto border-2 border-transparent bg-bg-sunken motion-safe:transition-[border-color,background-color]\"\n onDrop={handleCanvasDrop}\n onDragOver={handleCanvasDragOver}\n onClick={() => {\n if (isEditMode) {\n selectWidget(null);\n }\n }}\n style={\n isDraggingWidget\n ? {\n borderStyle: 'dashed',\n borderColor: 'var(--color-action-primary-bg)',\n backgroundColor: 'var(--color-bg-accentSubtle)',\n }\n : undefined\n }\n >\n {/* Drop zone indicator */}\n {isDraggingWidget && (\n <div\n style={{\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n padding: 'var(--space-pagePadding)',\n backgroundColor: 'var(--color-bg-surface)',\n borderRadius: 'var(--radius-card)',\n boxShadow: 'var(--shadow-elevation-2)',\n textAlign: 'center',\n pointerEvents: 'none',\n zIndex: 100,\n }}\n >\n <p style={{ fontSize: 'var(--font-size-body-md)', color: 'var(--color-text-primary)', margin: 0 }}>\n {t('bigconsole.dashboards.canvas.dropToAddBefore', 'Drop to add')} <strong>{dragWidgetType}</strong>{' '}\n {t('bigconsole.dashboards.canvas.dropToAddAfter', 'widget')}\n </p>\n </div>\n )}\n\n <div\n ref={boardRef}\n className=\"min-h-full origin-top-left transition-transform\"\n style={{\n transform: `scale(${zoomLevel / 100})`,\n width: `${100 / (zoomLevel / 100)}%`,\n }}\n >\n {widgetsArray.length > 0 ? (\n <CrossFilterProvider\n enabled={enableCrossFilter}\n onCrossFilter={(_filters) => {\n // Cross-filter applied - widget queries can access filter values\n }}\n >\n <DashboardGrid\n widgets={widgetsArray}\n cols={gridColumns}\n isEditMode={isEditMode}\n width={containerWidth}\n onLayoutChange={handleLayoutChange}\n onWidgetSelect={handleWidgetSelect}\n selectedWidgetId={selectedWidgetId}\n />\n </CrossFilterProvider>\n ) : (\n <div className=\"flex min-h-[min(400px,60vh)] items-center justify-center p-card-padding\">\n <Section\n headingLevel={3}\n className=\"w-full max-w-md\"\n data-testid=\"dashboard-empty-board\"\n headerClassName=\"mb-form-gap\"\n title={t('bigconsole.dashboards.canvas.noWidgetsTitle', 'No widgets yet')}\n description={t(\n 'bigconsole.dashboards.canvas.noWidgetsDescription',\n 'Add widgets to build your dashboard. Click the \"Add Widget\" button to get started.'\n )}\n >\n {isEditMode && (\n <Button onClick={openWidgetPalette}>\n <Plus className=\"size-4\" />\n {t('bigconsole.dashboards.canvas.addWidget', 'Add Widget')}\n </Button>\n )}\n </Section>\n </div>\n )}\n </div>\n </div>\n </div>\n\n {/* Properties Panel */}\n <WidgetInspector isOpen={configPanelOpen} onClose={closeConfigPanel} />\n\n {/* Share Dialog */}\n <ShareDialog\n dashboardId={dashboardId}\n dashboardName={title || t('bigconsole.dashboards.canvas.dashboardFallbackName', 'Dashboard')}\n isOpen={isShareDialogOpen}\n onClose={() => setIsShareDialogOpen(false)}\n visibility={dashboardVisibility}\n onVisibilityChange={handleVisibilityChange}\n canChangeVisibility={canUpdateDashboard}\n />\n </div>\n );\n});\n\nexport default DashboardCanvas;\n"],"mappings":"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"}

package/dist/bigconsole/components/dashboard/DashboardGrid.d.ts CHANGED Viewed

@@ -22,3 +22,4 @@ export interface DashboardGridProps {
 }
 export declare const DashboardGrid: FC<DashboardGridProps>;
 export default DashboardGrid;
+//# sourceMappingURL=DashboardGrid.d.ts.map

package/dist/bigconsole/components/dashboard/DashboardGrid.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DashboardGrid.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/dashboard/DashboardGrid.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,KAAK,EAAE,EAA8B,MAAM,OAAO,CAAC;AAC5D,OAAmB,EAAE,KAAK,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAO1C,OAAO,kCAAkC,CAAC;AAC1C,OAAO,gCAAgC,CAAC;AAMxC,MAAM,WAAW,kBAAkB;IACjC,yBAAyB;IACzB,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,2BAA2B;IAC3B,UAAU,EAAE,OAAO,CAAC;IACpB,sBAAsB;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,wBAAwB;IACxB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mCAAmC;IACnC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC5C,uCAAuC;IACvC,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,mCAAmC;IACnC,gBAAgB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAClC;AA6BD,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CA+I/C,CAAC;AAEH,eAAe,aAAa,CAAC"}

package/dist/bigconsole/components/dashboard/DashboardGrid.js CHANGED Viewed

@@ -96,3 +96,5 @@ var l = r(function({ widgets: r, isEditMode: l, width: u, cols: d = 12, rowHeigh
 });
 //#endregion
 export { l as default };
+//# sourceMappingURL=DashboardGrid.js.map

package/dist/bigconsole/components/dashboard/DashboardGrid.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DashboardGrid.js","names":[],"sources":["../../../../src/bigconsole/components/dashboard/DashboardGrid.tsx"],"sourcesContent":["/**\n * DashboardGrid Component\n *\n * Grid layout for widgets using react-grid-layout.\n * v2.0: Added widget event emission support\n */\n\nimport { type FC, memo, useMemo, useCallback } from 'react';\nimport GridLayout, { type Layout } from 'react-grid-layout';\nimport type { Widget } from '../../types';\nimport { WidgetWrapper } from '../widgets/WidgetWrapper';\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents';\nimport { useGlobalFilterValues } from '../../store';\nimport type { WidgetAction, ActionContext, ActionResult } from '../../renderers/types/renderer';\n\n// Import react-grid-layout styles\nimport 'react-grid-layout/css/styles.css';\nimport 'react-resizable/css/styles.css';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface DashboardGridProps {\n /** Widgets to display */\n widgets: Widget[];\n /** Whether in edit mode */\n isEditMode: boolean;\n /** Container width */\n width: number;\n /** Number of columns */\n cols?: number;\n /** Row height in pixels */\n rowHeight?: number;\n /** Callback when layout changes */\n onLayoutChange?: (layout: Layout[]) => void;\n /** Callback when widget is selected */\n onWidgetSelect?: (widgetId: string) => void;\n /** Currently selected widget ID */\n selectedWidgetId?: string | null;\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nfunction widgetToLayout(widget: Widget, cols: number): Layout {\n const x = widget.position?.x ?? widget.positionX ?? 0;\n const y = widget.position?.y ?? widget.positionY ?? 0;\n const w = widget.position?.width ?? widget.positionWidth ?? 4;\n const h = widget.position?.height ?? widget.positionHeight ?? 4;\n\n return {\n i: widget.id,\n x,\n y,\n w,\n h,\n minW: 1,\n minH: 1,\n maxW: cols,\n maxH: 12,\n };\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const DashboardGrid: FC<DashboardGridProps> = memo(function DashboardGrid({\n widgets,\n isEditMode,\n width,\n cols = 12,\n rowHeight = 60,\n onLayoutChange,\n onWidgetSelect,\n selectedWidgetId,\n}) {\n // Phase 2: Get global filter values\n const globalFilterValues = useGlobalFilterValues();\n\n // v2.0: Widget event emission hook\n const { emitEvent } = useWidgetEvents({});\n\n // A phone displays a reading layout. Never save this temporary layout over\n // the authored desktop positions when a drag/resize callback fires.\n const isNarrow = width < 640;\n const canEditLayout = isEditMode && !isNarrow;\n const layout = useMemo(() => {\n const authored = widgets.map((widget) => widgetToLayout(widget, cols));\n if (!isNarrow) return authored;\n let nextRow = 0;\n return [...authored]\n .sort((a, b) => a.y - b.y || a.x - b.x)\n .map((item) => {\n const stacked = { ...item, x: 0, y: nextRow, w: cols, minW: cols };\n nextRow += item.h;\n return stacked;\n });\n }, [widgets, cols, isNarrow]);\n\n // Gutters are a fixed 16px in react-grid-layout, which on a 390px canvas spends\n // ~32px of the board on padding alone. Shrink them on narrow canvases — this is\n // purely visual and never touches the stored x/y/w/h.\n const gutter = width < 480 ? 8 : 16;\n\n // Handle widget click - only select in edit mode\n const handleWidgetClick = useCallback(\n (widgetId: string, _event: React.MouseEvent) => {\n // Only select widget in edit mode\n // In view mode, let WidgetWrapper handle drilldown\n if (isEditMode && onWidgetSelect) {\n onWidgetSelect(widgetId);\n }\n },\n [onWidgetSelect, isEditMode]\n );\n\n // Handle drag/resize stop - only update when user finishes interaction\n const handleDragStop = useCallback(\n (layout: Layout[]) => {\n if (onLayoutChange && canEditLayout) {\n onLayoutChange(layout);\n }\n },\n [onLayoutChange, canEditLayout]\n );\n\n const handleResizeStop = useCallback(\n (layout: Layout[]) => {\n if (onLayoutChange && canEditLayout) {\n onLayoutChange(layout);\n }\n },\n [onLayoutChange, canEditLayout]\n );\n\n // v2.0: Handle widget action - emit event to backend\n const handleWidgetAction = useCallback(\n async (action: WidgetAction, context: ActionContext): Promise<ActionResult | void> => {\n // Safety check: ensure action.name is a string\n const actionName = typeof action?.name === 'string' ? action.name : 'unknown';\n\n // Build event name from action name (e.g., \"Edit Profile\" -> \"widget:edit_profile:clicked\")\n const eventName = `widget:${actionName.toLowerCase().replace(/\\s+/g, '_')}:clicked`;\n\n // Emit event to backend (triggers webhook if configured)\n const eventLog = await emitEvent({\n widgetId: context.widgetId,\n actionName: actionName,\n event: eventName,\n payload: context.data || {},\n });\n\n if (eventLog) {\n return {\n success: eventLog.status !== 'FAILED',\n message: eventLog.status === 'DELIVERED' ? 'Action completed' : `Event status: ${eventLog.status}`,\n };\n }\n\n return { success: false, message: 'Failed to emit event' };\n },\n [emitEvent]\n );\n\n return (\n <GridLayout\n className=\"dashboard-grid\"\n layout={layout}\n cols={cols}\n rowHeight={rowHeight}\n width={width}\n margin={[gutter, gutter]}\n containerPadding={[gutter, gutter]}\n isDraggable={canEditLayout}\n isResizable={canEditLayout}\n draggableHandle=\".widget-drag-handle\"\n onDragStop={handleDragStop}\n onResizeStop={handleResizeStop}\n useCSSTransforms\n compactType={null}\n preventCollision={false}\n >\n {widgets.map((widget) => {\n // v2.0: Extract actions from widget\n const widgetWithActions = widget as Widget & { actions?: WidgetAction[] };\n const widgetActions = widgetWithActions.actions || [];\n\n return (\n <div\n key={widget.id}\n onClick={(e) => handleWidgetClick(widget.id, e)}\n data-selected={selectedWidgetId === widget.id && isEditMode ? 'true' : undefined}\n className={`flex h-full min-w-0 flex-col overflow-visible ${\n selectedWidgetId === widget.id && isEditMode\n ? 'rounded-card ring-2 ring-action-primary-bg ring-offset-2 ring-offset-bg-sunken'\n : ''\n }`}\n >\n <WidgetWrapper\n widget={widget}\n actions={widgetActions}\n onAction={handleWidgetAction}\n filterValues={globalFilterValues}\n />\n </div>\n );\n })}\n </GridLayout>\n );\n});\n\nexport default DashboardGrid;\n"],"mappings":";;;;;;;;;;AA8CA,SAAS,EAAe,GAAgB,GAAsB;CAC5D,IAAM,IAAI,EAAO,UAAU,KAAK,EAAO,aAAa,GAC9C,IAAI,EAAO,UAAU,KAAK,EAAO,aAAa,GAC9C,IAAI,EAAO,UAAU,SAAS,EAAO,iBAAiB,GACtD,IAAI,EAAO,UAAU,UAAU,EAAO,kBAAkB;AAE9D,QAAO;EACL,GAAG,EAAO;EACV;EACA;EACA;EACA;EACA,MAAM;EACN,MAAM;EACN,MAAM;EACN,MAAM;EACP;;AAOH,IAAa,IAAwC,EAAK,SAAuB,EAC/E,YACA,eACA,UACA,UAAO,IACP,eAAY,IACZ,mBACA,mBACA,uBACC;CAED,IAAM,IAAqB,GAAuB,EAG5C,EAAE,iBAAc,EAAgB,EAAE,CAAC,EAInC,IAAW,IAAQ,KACnB,IAAgB,KAAc,CAAC,GAC/B,IAAS,QAAc;EAC3B,IAAM,IAAW,EAAQ,KAAK,MAAW,EAAe,GAAQ,EAAK,CAAC;AACtE,MAAI,CAAC,EAAU,QAAO;EACtB,IAAI,IAAU;AACd,SAAO,CAAC,GAAG,EAAS,CACjB,MAAM,GAAG,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,CACtC,KAAK,MAAS;GACb,IAAM,IAAU;IAAE,GAAG;IAAM,GAAG;IAAG,GAAG;IAAS,GAAG;IAAM,MAAM;IAAM;AAElE,UADA,KAAW,EAAK,GACT;IACP;IACH;EAAC;EAAS;EAAM;EAAS,CAAC,EAKvB,IAAS,IAAQ,MAAM,IAAI,IAG3B,IAAoB,GACvB,GAAkB,MAA6B;AAG9C,EAAI,KAAc,KAChB,EAAe,EAAS;IAG5B,CAAC,GAAgB,EAAW,CAC7B,EAGK,IAAiB,GACpB,MAAqB;AACpB,EAAI,KAAkB,KACpB,EAAe,EAAO;IAG1B,CAAC,GAAgB,EAAc,CAChC,EAEK,IAAmB,GACtB,MAAqB;AACpB,EAAI,KAAkB,KACpB,EAAe,EAAO;IAG1B,CAAC,GAAgB,EAAc,CAChC,EAGK,IAAqB,EACzB,OAAO,GAAsB,MAAyD;EAEpF,IAAM,IAAa,OAAO,GAAQ,QAAS,WAAW,EAAO,OAAO,WAG9D,IAAY,UAAU,EAAW,aAAa,CAAC,QAAQ,QAAQ,IAAI,CAAC,WAGpE,IAAW,MAAM,EAAU;GAC/B,UAAU,EAAQ;GACN;GACZ,OAAO;GACP,SAAS,EAAQ,QAAQ,EAAE;GAC5B,CAAC;AASF,SAPI,IACK;GACL,SAAS,EAAS,WAAW;GAC7B,SAAS,EAAS,WAAW,cAAc,qBAAqB,iBAAiB,EAAS;GAC3F,GAGI;GAAE,SAAS;GAAO,SAAS;GAAwB;IAE5D,CAAC,EAAU,CACZ;AAED,QACE,kBAAC,GAAD;EACE,WAAU;EACF;EACF;EACK;EACJ;EACP,QAAQ,CAAC,GAAQ,EAAO;EACxB,kBAAkB,CAAC,GAAQ,EAAO;EAClC,aAAa;EACb,aAAa;EACb,iBAAgB;EAChB,YAAY;EACZ,cAAc;EACd,kBAAA;EACA,aAAa;EACb,kBAAkB;YAEjB,EAAQ,KAAK,MAAW;GAGvB,IAAM,IADoB,EACc,WAAW,EAAE;AAErD,UACE,kBAAC,OAAD;IAEE,UAAU,MAAM,EAAkB,EAAO,IAAI,EAAE;IAC/C,iBAAe,MAAqB,EAAO,MAAM,IAAa,SAAS,KAAA;IACvE,WAAW,iDACT,MAAqB,EAAO,MAAM,IAC9B,mFACA;cAGN,kBAAC,GAAD;KACU;KACR,SAAS;KACT,UAAU;KACV,cAAc;KACd,CAAA;IACE,EAfC,EAAO,GAeR;IAER;EACS,CAAA;EAEf"}

package/dist/bigconsole/components/dashboard/DashboardStatusPill.d.ts CHANGED Viewed

@@ -9,3 +9,4 @@ export interface DashboardStatusPillProps {
 }
 export declare const DashboardStatusPill: FC<DashboardStatusPillProps>;
 export default DashboardStatusPill;
+//# sourceMappingURL=DashboardStatusPill.d.ts.map

package/dist/bigconsole/components/dashboard/DashboardStatusPill.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DashboardStatusPill.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/dashboard/DashboardStatusPill.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,KAAK,EAAE,EAAqB,MAAM,OAAO,CAAC;AAEnD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AAe9E,yDAAyD;AACzD,wBAAgB,uBAAuB,IAAI,CAAC,MAAM,EAAE,mBAAmB,KAAK,MAAM,CAejF;AAED,MAAM,WAAW,wBAAwB;IACvC,MAAM,EAAE,mBAAmB,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,mBAAmB,EAAE,EAAE,CAAC,wBAAwB,CAiC3D,CAAC;AAEH,eAAe,mBAAmB,CAAC"}

package/dist/bigconsole/components/dashboard/DashboardStatusPill.js CHANGED Viewed

@@ -49,3 +49,5 @@ var s = t(function({ status: e, label: t }) {
 });
 //#endregion
 export { s as default, o as useDashboardStatusLabel };
+//# sourceMappingURL=DashboardStatusPill.js.map

package/dist/bigconsole/components/dashboard/DashboardStatusPill.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DashboardStatusPill.js","names":[],"sources":["../../../../src/bigconsole/components/dashboard/DashboardStatusPill.tsx"],"sourcesContent":["/**\n * DashboardStatusPill\n *\n * Compact lifecycle badge for a dashboard (Draft / Published / Archived).\n * Shared by the Dashboards list and the Overview's recent dashboards so the\n * same state always reads the same way.\n */\n\nimport { type FC, memo, useCallback } from 'react';\nimport { useTr } from '../../../shared/hooks/useTr';\nimport type { DashboardListStatus } from '../../hooks/useDashboardOperations';\n\n/**\n * Lifecycle status of a dashboard.\n *\n * Backed by `Dashboard.status` (DashboardStatus: DRAFT | PUBLISHED | ARCHIVED).\n * Whether a board is a published surface or still a draft is the fact a list of\n * boards is most often scanned for.\n */\nconst DASHBOARD_STATUS_DOT: Record<DashboardListStatus, string> = {\n PUBLISHED: 'var(--color-status-success-bg)',\n DRAFT: 'var(--color-text-muted)',\n ARCHIVED: 'var(--color-status-warning-bg)',\n};\n\n/** Translated label for a dashboard lifecycle status. */\nexport function useDashboardStatusLabel(): (status: DashboardListStatus) => string {\n const tr = useTr();\n return useCallback(\n (status: DashboardListStatus) => {\n switch (status) {\n case 'PUBLISHED':\n return tr('bigconsole.dashboards.status.published', 'Published');\n case 'ARCHIVED':\n return tr('bigconsole.dashboards.status.archived', 'Archived');\n default:\n return tr('bigconsole.dashboards.status.draft', 'Draft');\n }\n },\n [tr]\n );\n}\n\nexport interface DashboardStatusPillProps {\n status: DashboardListStatus;\n label: string;\n}\n\nexport const DashboardStatusPill: FC<DashboardStatusPillProps> = memo(function DashboardStatusPill({ status, label }) {\n return (\n <span\n data-testid=\"dashboard-status\"\n style={{\n display: 'inline-flex',\n alignItems: 'center',\n gap: 'var(--space-iconGap)',\n padding: '2px 8px',\n borderRadius: 'var(--radius-pill)',\n backgroundColor: 'var(--color-bg-sunken)',\n border: '1px solid var(--color-border-subtle)',\n fontSize: '10px',\n fontWeight: 'var(--font-weight-semibold)',\n textTransform: 'uppercase',\n letterSpacing: '0.02em',\n color: 'var(--color-text-secondary)',\n whiteSpace: 'nowrap',\n }}\n >\n <span\n aria-hidden=\"true\"\n style={{\n width: 6,\n height: 6,\n borderRadius: '50%',\n backgroundColor: DASHBOARD_STATUS_DOT[status],\n flexShrink: 0,\n }}\n />\n {label}\n </span>\n );\n});\n\nexport default DashboardStatusPill;\n"],"mappings":";;;;AAmBA,IAAM,IAA4D;CAChE,WAAW;CACX,OAAO;CACP,UAAU;CACX;AAGD,SAAgB,IAAmE;CACjF,IAAM,IAAK,GAAO;AAClB,QAAO,GACJ,MAAgC;AAC/B,UAAQ,GAAR;GACE,KAAK,YACH,QAAO,EAAG,0CAA0C,YAAY;GAClE,KAAK,WACH,QAAO,EAAG,yCAAyC,WAAW;GAChE,QACE,QAAO,EAAG,sCAAsC,QAAQ;;IAG9D,CAAC,EAAG,CACL;;AAQH,IAAa,IAAoD,EAAK,SAA6B,EAAE,WAAQ,YAAS;AACpH,QACE,kBAAC,QAAD;EACE,eAAY;EACZ,OAAO;GACL,SAAS;GACT,YAAY;GACZ,KAAK;GACL,SAAS;GACT,cAAc;GACd,iBAAiB;GACjB,QAAQ;GACR,UAAU;GACV,YAAY;GACZ,eAAe;GACf,eAAe;GACf,OAAO;GACP,YAAY;GACb;YAhBH,CAkBE,kBAAC,QAAD;GACE,eAAY;GACZ,OAAO;IACL,OAAO;IACP,QAAQ;IACR,cAAc;IACd,iBAAiB,EAAqB;IACtC,YAAY;IACb;GACD,CAAA,EACD,EACI;;EAET"}

package/dist/bigconsole/components/dashboard/DashboardToolbar.d.ts CHANGED Viewed

@@ -32,3 +32,4 @@ export interface DashboardToolbarProps {
 }
 export declare const DashboardToolbar: FC<DashboardToolbarProps>;
 export default DashboardToolbar;
+//# sourceMappingURL=DashboardToolbar.d.ts.map

package/dist/bigconsole/components/dashboard/DashboardToolbar.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DashboardToolbar.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/dashboard/DashboardToolbar.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,KAAK,EAAE,EAAqB,MAAM,OAAO,CAAC;AAgCnD,MAAM,WAAW,qBAAqB;IACpC,mCAAmC;IACnC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sBAAsB;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6BAA6B;IAC7B,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,wCAAwC;IACxC,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,8BAA8B;IAC9B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,+BAA+B;IAC/B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,iCAAiC;IACjC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,qDAAqD;IACrD,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,kDAAkD;IAClD,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,4CAA4C;IAC5C,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,oCAAoC;IACpC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAMD,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CAsQrD,CAAC;AAEH,eAAe,gBAAgB,CAAC"}

package/dist/bigconsole/components/dashboard/DashboardToolbar.js CHANGED Viewed

@@ -183,3 +183,5 @@ var N = a(function({ dashboardId: a, title: N, onAddWidget: P, onTogglePalette:
 });
 //#endregion
 export { N as default };
+//# sourceMappingURL=DashboardToolbar.js.map

package/dist/bigconsole/components/dashboard/DashboardToolbar.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DashboardToolbar.js","names":[],"sources":["../../../../src/bigconsole/components/dashboard/DashboardToolbar.tsx"],"sourcesContent":["/**\n * DashboardToolbar Component\n *\n * Toolbar for dashboard actions and controls.\n * Uses fe-libs shared components for consistent styling.\n * Phase 2: Added SavedViewsDropdown and Share button.\n */\n\nimport { type FC, memo, useCallback } from 'react';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@burdenoff/fe-libs/ui';\nimport { Spinner } from '@burdenoff/fe-libs/ui';\nimport {\n Clipboard,\n Download,\n Eye,\n FileText,\n Image as ImageIcon,\n Minus,\n PanelLeft,\n PanelLeftClose,\n Pencil,\n Plus,\n RotateCcw,\n Save,\n Share2,\n Store,\n} from 'lucide-react';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { PermissionButton } from '@burdenoff/fe-libs/shared/components';\nimport { useDashboardStore, useWidgetStore } from '../../store';\nimport { BIGCONSOLE_PERMISSIONS } from '../../../constants/permissions';\nimport { Section } from '../common';\nimport { SavedViewsDropdown } from './SavedViewsDropdown';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface DashboardToolbarProps {\n /** Dashboard ID for saved views */\n dashboardId?: string;\n /** Dashboard title */\n title?: string;\n /** Callback to add widget */\n onAddWidget: () => void;\n /** Callback to toggle widget palette */\n onTogglePalette?: () => void;\n /** Whether palette is open */\n isPaletteOpen?: boolean;\n /** Callback to paste widget */\n onPaste?: () => void;\n /** Callback to save dashboard */\n onSave?: () => void;\n /** Whether save is in progress */\n isSaving?: boolean;\n /** Callback to export dashboard (JSON console definition) */\n onExport?: () => void;\n /** Publish this dashboard as a reusable template. */\n onPublishTemplate?: () => void;\n /** Callback to export the board as a PNG image */\n onExportImage?: () => void;\n /** Callback to export the board as a PDF */\n onExportPdf?: () => void;\n /** Whether an image/PDF export is in progress */\n isExportingImage?: boolean;\n /** Callback to open share dialog */\n onShare?: () => void;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const DashboardToolbar: FC<DashboardToolbarProps> = memo(function DashboardToolbar({\n dashboardId,\n title,\n onAddWidget,\n onTogglePalette,\n isPaletteOpen = false,\n onPaste,\n onSave,\n isSaving = false,\n onExport,\n onPublishTemplate,\n onExportImage,\n onExportPdf,\n isExportingImage = false,\n onShare,\n}) {\n const { hasPermission } = usePermissions();\n const { t } = useI18n();\n const isEditMode = useDashboardStore((state) => state.viewMode === 'edit');\n const toggleViewMode = useDashboardStore((state) => state.toggleViewMode);\n const zoomLevel = useDashboardStore((state) => state.zoomLevel);\n const setZoomLevel = useDashboardStore((state) => state.setZoomLevel);\n\n const clipboardWidgetId = useWidgetStore((state) => state.clipboardWidgetId);\n const hasClipboard = !!clipboardWidgetId;\n\n // Handle paste - use provided callback or fallback\n const handlePaste = useCallback(() => {\n if (hasClipboard && onPaste) {\n onPaste();\n }\n }, [hasClipboard, onPaste]);\n\n return (\n <TooltipProvider>\n {/*\n Structural band only — no surface of its own and, deliberately, no title:\n the board is named once, by the route header above this toolbar. Three\n labelled clusters (views · zoom · actions) replace what used to read as\n one continuous run of same-weight buttons.\n */}\n <Section\n emphasis=\"bare\"\n padding=\"none\"\n aria-label={title ? `Board toolbar — ${title}` : 'Board toolbar'}\n data-testid=\"dashboard-toolbar\"\n className=\"flex-shrink-0 border-b border-[var(--color-border-subtle)] bg-bg-surface px-4 py-2\"\n bodyClassName=\"flex flex-wrap items-center justify-between gap-x-4 gap-y-2\"\n >\n {/* Left section — saved views */}\n <div className=\"flex min-w-0 items-center gap-4\">\n {/* Saved Views Dropdown */}\n {dashboardId && <SavedViewsDropdown dashboardId={dashboardId} />}\n </div>\n\n {/* Center section - Zoom controls */}\n <div\n role=\"group\"\n aria-label=\"Zoom\"\n className=\"flex min-w-0 items-center gap-1 border-l border-[var(--color-border-subtle)] pl-4\"\n >\n <Tooltip>\n <TooltipTrigger asChild>\n <Button\n variant=\"ghost\"\n size=\"icon-sm\"\n onClick={() => setZoomLevel(Math.max(50, zoomLevel - 10))}\n disabled={zoomLevel <= 50}\n >\n <Minus className=\"size-4\" />\n </Button>\n </TooltipTrigger>\n <TooltipContent>{t('bigconsole.dashboards.toolbar.zoomOut', 'Zoom out')}</TooltipContent>\n </Tooltip>\n\n <span className=\"text-sm text-text-secondary w-12 text-center\">{zoomLevel}%</span>\n\n <Tooltip>\n <TooltipTrigger asChild>\n <Button\n variant=\"ghost\"\n size=\"icon-sm\"\n onClick={() => setZoomLevel(Math.min(200, zoomLevel + 10))}\n disabled={zoomLevel >= 200}\n >\n <Plus className=\"size-4\" />\n </Button>\n </TooltipTrigger>\n <TooltipContent>{t('bigconsole.dashboards.toolbar.zoomIn', 'Zoom in')}</TooltipContent>\n </Tooltip>\n\n <Tooltip>\n <TooltipTrigger asChild>\n <Button variant=\"ghost\" size=\"sm\" onClick={() => setZoomLevel(100)}>\n <RotateCcw className=\"size-3.5 mr-1\" />\n {t('bigconsole.dashboards.toolbar.reset', 'Reset')}\n </Button>\n </TooltipTrigger>\n <TooltipContent>{t('bigconsole.dashboards.toolbar.resetZoomTooltip', 'Reset zoom to 100%')}</TooltipContent>\n </Tooltip>\n </div>\n\n {/* Right section - Actions */}\n <div\n role=\"group\"\n aria-label=\"Board actions\"\n className=\"flex min-w-0 flex-wrap items-center justify-end gap-2 border-l border-[var(--color-border-subtle)] pl-4\"\n >\n {isEditMode && (\n <>\n {/* Widget Palette Toggle */}\n {onTogglePalette && (\n <Tooltip>\n <TooltipTrigger asChild>\n <Button variant={isPaletteOpen ? 'secondary' : 'outline'} size=\"sm\" onClick={onTogglePalette}>\n {isPaletteOpen ? <PanelLeftClose className=\"size-4\" /> : <PanelLeft className=\"size-4\" />}\n {t('bigconsole.dashboards.toolbar.widgets', 'Widgets')}\n </Button>\n </TooltipTrigger>\n <TooltipContent>\n {isPaletteOpen\n ? t('bigconsole.dashboards.toolbar.hidePalette', 'Hide widget palette')\n : t('bigconsole.dashboards.toolbar.showPalette', 'Show widget palette for drag & drop')}\n </TooltipContent>\n </Tooltip>\n )}\n\n {/* Paste */}\n <Tooltip>\n <TooltipTrigger asChild>\n <Button variant=\"ghost\" size=\"sm\" onClick={handlePaste} disabled={!hasClipboard}>\n <Clipboard className=\"size-4\" />\n {t('bigconsole.dashboards.toolbar.paste', 'Paste')}\n </Button>\n </TooltipTrigger>\n <TooltipContent>\n {t('bigconsole.dashboards.toolbar.pasteTooltip', 'Paste widget from clipboard')}\n </TooltipContent>\n </Tooltip>\n\n {/* Add Widget (Dialog) */}\n <PermissionButton permission={BIGCONSOLE_PERMISSIONS.WIDGET_CREATE} deniedBehavior=\"hide\">\n <Button size=\"sm\" onClick={onAddWidget}>\n <Plus className=\"size-4\" />\n {t('bigconsole.dashboards.toolbar.addWidget', 'Add Widget')}\n </Button>\n </PermissionButton>\n </>\n )}\n\n {/* Edit/View Mode Toggle */}\n <Button variant={isEditMode ? 'secondary' : 'outline'} size=\"sm\" onClick={toggleViewMode}>\n {isEditMode ? (\n <>\n <Eye className=\"size-4\" />\n {t('bigconsole.dashboards.toolbar.preview', 'Preview')}\n </>\n ) : (\n <>\n <Pencil className=\"size-4\" />\n {t('bigconsole.dashboards.toolbar.edit', 'Edit')}\n </>\n )}\n </Button>\n\n {/* Save */}\n {onSave && (\n <Button variant=\"outline\" size=\"sm\" onClick={onSave} disabled={isSaving}>\n {isSaving ? (\n <>\n <Spinner className=\"size-4\" />\n {t('bigconsole.dashboards.toolbar.saving', 'Saving...')}\n </>\n ) : (\n <>\n <Save className=\"size-4\" />\n {t('bigconsole.dashboards.toolbar.save', 'Save')}\n </>\n )}\n </Button>\n )}\n\n {/* Share */}\n {onShare && (\n <PermissionButton permission={BIGCONSOLE_PERMISSIONS.DASHBOARD_SHARE} deniedBehavior=\"hide\">\n <Tooltip>\n <TooltipTrigger asChild>\n <Button variant=\"outline\" size=\"sm\" onClick={onShare}>\n <Share2 className=\"size-4\" />\n {t('bigconsole.dashboards.toolbar.share', 'Share')}\n </Button>\n </TooltipTrigger>\n <TooltipContent>\n {t('bigconsole.dashboards.toolbar.shareTooltip', 'Share dashboard with others')}\n </TooltipContent>\n </Tooltip>\n </PermissionButton>\n )}\n\n {/* Publish as a store template */}\n {onPublishTemplate && (\n <PermissionButton permission={BIGCONSOLE_PERMISSIONS.DASHBOARD_PUBLISH} deniedBehavior=\"hide\">\n <Tooltip>\n <TooltipTrigger asChild>\n <Button variant=\"outline\" size=\"sm\" onClick={onPublishTemplate}>\n <Store className=\"size-4\" />\n <span className=\"hidden sm:inline\">{t('bigconsole.dashboards.toolbar.publish', 'Publish')}</span>\n </Button>\n </TooltipTrigger>\n <TooltipContent>\n {t('bigconsole.dashboards.toolbar.publishTooltip', 'Publish this dashboard as a reusable template')}\n </TooltipContent>\n </Tooltip>\n </PermissionButton>\n )}\n\n {/* Export — JSON definition */}\n {onExport && (\n <Tooltip>\n <TooltipTrigger asChild>\n <Button variant=\"outline\" size=\"sm\" onClick={onExport}>\n <Download className=\"size-4\" />\n {t('bigconsole.dashboards.toolbar.export', 'Export')}\n </Button>\n </TooltipTrigger>\n <TooltipContent>\n {t('bigconsole.dashboards.toolbar.exportTooltip', 'Export dashboard to JSON')}\n </TooltipContent>\n </Tooltip>\n )}\n\n {/* Export — board PNG */}\n {onExportImage && (\n <Tooltip>\n <TooltipTrigger asChild>\n <Button variant=\"outline\" size=\"icon-sm\" onClick={onExportImage} disabled={isExportingImage}>\n {isExportingImage ? <Spinner className=\"size-4\" /> : <ImageIcon className=\"size-4\" />}\n </Button>\n </TooltipTrigger>\n <TooltipContent>\n {t('bigconsole.dashboards.toolbar.exportPngTooltip', 'Export board as PNG image')}\n </TooltipContent>\n </Tooltip>\n )}\n\n {/* Export — board PDF */}\n {onExportPdf && (\n <Tooltip>\n <TooltipTrigger asChild>\n <Button variant=\"outline\" size=\"icon-sm\" onClick={onExportPdf} disabled={isExportingImage}>\n <FileText className=\"size-4\" />\n </Button>\n </TooltipTrigger>\n <TooltipContent>\n {t('bigconsole.dashboards.toolbar.exportPdfTooltip', 'Export board as PDF')}\n </TooltipContent>\n </Tooltip>\n )}\n </div>\n </Section>\n </TooltipProvider>\n );\n});\n\nexport default DashboardToolbar;\n"],"mappings":"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"}

package/dist/bigconsole/components/dashboard/DrilldownBreadcrumb.d.ts CHANGED Viewed

@@ -23,3 +23,4 @@ interface DrilldownBreadcrumbProps {
 }
 export declare const DrilldownBreadcrumb: import('react').NamedExoticComponent<DrilldownBreadcrumbProps>;
 export default DrilldownBreadcrumb;
+//# sourceMappingURL=DrilldownBreadcrumb.d.ts.map

package/dist/bigconsole/components/dashboard/DrilldownBreadcrumb.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DrilldownBreadcrumb.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/dashboard/DrilldownBreadcrumb.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAcH,UAAU,wBAAwB;IAChC,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2BAA2B;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,6BAA6B;IAC7B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,yCAAyC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mCAAmC;IACnC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAYD,eAAO,MAAM,mBAAmB,gEAqM9B,CAAC;AAEH,eAAe,mBAAmB,CAAC"}

package/dist/bigconsole/components/dashboard/DrilldownBreadcrumb.js CHANGED Viewed

@@ -4,121 +4,122 @@ import { useBigConsoleNavigate as t } from "../../context/BigConsoleContext.js";
 import "../../context/index.js";
 import { SECTION_FOCUS_RING as n } from "../common/sectionStyles.js";
 import "../common/index.js";
-import { appendPathSegment as r } from "../../utils/safeUrl.js";
-import i from "../../hooks/useFilterUrlSync.js";
-import { memo as a, useCallback as o, useEffect as s, useState as c } from "react";
-import { ArrowLeft as l, ChevronRight as u, Home as d } from "lucide-react";
-import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
-import { useI18n as h } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import r from "../../hooks/useFilterUrlSync.js";
+import { memo as i, useCallback as a, useEffect as o, useState as s } from "react";
+import { ArrowLeft as c, ChevronRight as l, Home as u } from "lucide-react";
+import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
+import { useI18n as m } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 //#region src/bigconsole/components/dashboard/DrilldownBreadcrumb.tsx
-var g = a(function({ className: a = "", currentDashboardId: g, currentDashboardName: _, showHome: v = !0, basePath: y = "/bigconsole/dashboards" }) {
-	let { t: b } = h(), x = t(), { getDrilldownMetadata: S, isInDrilldown: C, drilldownDepth: w } = i(), T = e((e) => e.dashboards), [E, D] = c([]);
-	s(() => {
-		if (!C) {
-			D([]);
+var h = i(function({ className: i = "", currentDashboardId: h, currentDashboardName: g, showHome: _ = !0, basePath: v = "/bigconsole/dashboards" }) {
+	let { t: y } = m(), b = t(), { getDrilldownMetadata: x, isInDrilldown: S, drilldownDepth: C } = r(), w = e((e) => e.dashboards), [T, E] = s([]);
+	o(() => {
+		if (!S) {
+			E([]);
 			return;
 		}
-		let { path: e } = S();
+		let { path: e } = x();
 		if (e.length === 0) {
-			D([]);
+			E([]);
 			return;
 		}
-		D(e.map((e) => ({
+		E(e.map((e) => ({
 			id: e,
-			name: T.get(e)?.name || b("bigconsole.dashboards.drilldownBreadcrumb.fallbackName", "Dashboard {{id}}...", { id: e.slice(0, 8) }),
-			href: r(y, e) ?? y
+			name: w.get(e)?.name || y("bigconsole.dashboards.drilldownBreadcrumb.fallbackName", "Dashboard {{id}}...", { id: e.slice(0, 8) }),
+			href: `${v}/${e}`
 		})));
 	}, [
-		C,
 		S,
-		T,
-		y,
-		b
+		x,
+		w,
+		v,
+		y
 	]);
-	let O = o((e, t) => {
-		let n = S().path.slice(0, t), r = t, i = new URL(e.href, window.location.origin);
-		i.searchParams.set("drilldown_depth", String(r)), n.length > 0 && i.searchParams.set("drilldown_path", encodeURIComponent(JSON.stringify(n))), t > 0 && n.length > 0 && i.searchParams.set("drilldown_parent", n[n.length - 1]), x(i.pathname + i.search);
-	}, [S, x]), k = o(() => {
+	let D = a((e, t) => {
+		let n = x().path.slice(0, t), r = t, i = new URL(e.href, window.location.origin);
+		i.searchParams.set("drilldown_depth", String(r)), n.length > 0 && i.searchParams.set("drilldown_path", encodeURIComponent(JSON.stringify(n))), t > 0 && n.length > 0 && i.searchParams.set("drilldown_parent", n[n.length - 1]), b(i.pathname + i.search);
+	}, [x, b]), O = a(() => {
 		let e = window.history.state?.idx;
 		if (typeof e == "number" && e > 0) {
 			window.history.back();
 			return;
 		}
-		let t = S();
+		let t = x();
 		if (t.parent) {
-			let e = t.path.slice(0, -1), n = t.depth - 1, i = new URL(r(y, t.parent) ?? y, window.location.origin);
-			i.searchParams.set("drilldown_depth", String(n)), e.length > 0 && (i.searchParams.set("drilldown_path", encodeURIComponent(JSON.stringify(e))), i.searchParams.set("drilldown_parent", e[e.length - 1])), x(i.pathname + i.search);
-		} else if (E.length > 0) {
-			let e = E[E.length - 1];
-			O(e, E.length - 1);
+			let e = t.path.slice(0, -1), n = t.depth - 1, r = new URL(`${v}/${t.parent}`, window.location.origin);
+			r.searchParams.set("drilldown_depth", String(n)), e.length > 0 && (r.searchParams.set("drilldown_path", encodeURIComponent(JSON.stringify(e))), r.searchParams.set("drilldown_parent", e[e.length - 1])), b(r.pathname + r.search);
+		} else if (T.length > 0) {
+			let e = T[T.length - 1];
+			D(e, T.length - 1);
 		}
 	}, [
-		S,
-		y,
 		x,
-		E,
-		O
-	]), A = o((e) => {
-		e.preventDefault(), x(y);
-	}, [x, y]);
-	return C ? /* @__PURE__ */ m("nav", {
-		className: `flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1 border-b border-[var(--color-border-subtle)] bg-bg-sunken px-4 py-1.5 ${a}`,
-		"aria-label": b("bigconsole.dashboards.drilldownBreadcrumb.ariaLabel", "Drilldown breadcrumb"),
+		v,
+		b,
+		T,
+		D
+	]), k = a((e) => {
+		e.preventDefault(), b(v);
+	}, [b, v]);
+	return S ? /* @__PURE__ */ p("nav", {
+		className: `flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1 border-b border-[var(--color-border-subtle)] bg-bg-sunken px-4 py-1.5 ${i}`,
+		"aria-label": y("bigconsole.dashboards.drilldownBreadcrumb.ariaLabel", "Drilldown breadcrumb"),
 		"data-testid": "drilldown-breadcrumb",
 		children: [
-			/* @__PURE__ */ m("button", {
+			/* @__PURE__ */ p("button", {
 				type: "button",
-				onClick: k,
+				onClick: O,
 				className: `flex min-h-control-sm items-center gap-1 rounded-button px-2 py-1 text-sm font-medium text-text-link motion-safe:transition-colors hover:bg-bg-accentSubtle ${n}`,
-				"aria-label": b("bigconsole.dashboards.drilldownBreadcrumb.back", "Go back"),
-				children: [/* @__PURE__ */ p(l, { className: "w-4 h-4" }), /* @__PURE__ */ p("span", {
+				"aria-label": y("bigconsole.dashboards.drilldownBreadcrumb.back", "Go back"),
+				children: [/* @__PURE__ */ f(c, { className: "w-4 h-4" }), /* @__PURE__ */ f("span", {
 					className: "hidden sm:inline",
-					children: b("bigconsole.dashboards.drilldownBreadcrumb.backLabel", "Back")
+					children: y("bigconsole.dashboards.drilldownBreadcrumb.backLabel", "Back")
 				})]
 			}),
-			/* @__PURE__ */ p("span", {
+			/* @__PURE__ */ f("span", {
 				className: "text-text-muted",
 				"aria-hidden": "true",
 				children: "|"
 			}),
-			v && /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ m("a", {
-				href: y,
-				onClick: A,
+			_ && /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ p("a", {
+				href: v,
+				onClick: k,
 				className: "flex min-h-control-sm items-center gap-1 rounded-button px-1 text-sm text-text-secondary motion-safe:transition-colors hover:text-text-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
-				"aria-label": b("bigconsole.dashboards.drilldownBreadcrumb.home", "Home"),
-				children: [/* @__PURE__ */ p(d, { className: "w-4 h-4" }), /* @__PURE__ */ p("span", {
+				"aria-label": y("bigconsole.dashboards.drilldownBreadcrumb.home", "Home"),
+				children: [/* @__PURE__ */ f(u, { className: "w-4 h-4" }), /* @__PURE__ */ f("span", {
 					className: "hidden sm:inline",
-					children: b("bigconsole.dashboards.drilldownBreadcrumb.dashboards", "Dashboards")
+					children: y("bigconsole.dashboards.drilldownBreadcrumb.dashboards", "Dashboards")
 				})]
-			}), /* @__PURE__ */ p(u, {
+			}), /* @__PURE__ */ f(l, {
 				className: "w-4 h-4 shrink-0 text-text-muted",
 				"aria-hidden": "true"
 			})] }),
-			E.map((e, t) => /* @__PURE__ */ m("div", {
+			T.map((e, t) => /* @__PURE__ */ p("div", {
 				className: "flex min-w-0 items-center gap-2",
-				children: [/* @__PURE__ */ p("button", {
+				children: [/* @__PURE__ */ f("button", {
 					type: "button",
-					onClick: () => O(e, t),
+					onClick: () => D(e, t),
 					className: `min-h-control-sm max-w-[150px] truncate rounded-button px-1 text-sm text-text-secondary motion-safe:transition-colors hover:text-text-primary hover:underline ${n}`,
 					title: e.name,
 					children: e.name
-				}), /* @__PURE__ */ p(u, {
+				}), /* @__PURE__ */ f(l, {
 					className: "w-4 h-4 shrink-0 text-text-muted",
 					"aria-hidden": "true"
 				})]
 			}, e.id)),
-			_ && /* @__PURE__ */ p("span", {
+			g && /* @__PURE__ */ f("span", {
 				"aria-current": "page",
 				className: "max-w-[200px] truncate text-sm font-medium text-text-primary",
-				title: _,
-				children: _
+				title: g,
+				children: g
 			}),
-			/* @__PURE__ */ p("span", {
+			/* @__PURE__ */ f("span", {
 				className: "ml-auto shrink-0 rounded-pill bg-bg-surface px-2 py-0.5 text-xs text-text-muted",
-				children: b("bigconsole.dashboards.drilldownBreadcrumb.level", "Level {{depth}}", { depth: w ?? "" })
+				children: y("bigconsole.dashboards.drilldownBreadcrumb.level", "Level {{depth}}", { depth: C ?? "" })
 			})
 		]
 	}) : null;
 });
 //#endregion
-export { g as default };
+export { h as default };
+//# sourceMappingURL=DrilldownBreadcrumb.js.map

package/dist/bigconsole/components/dashboard/DrilldownBreadcrumb.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DrilldownBreadcrumb.js","names":[],"sources":["../../../../src/bigconsole/components/dashboard/DrilldownBreadcrumb.tsx"],"sourcesContent":["/**\n * DrilldownBreadcrumb Component\n *\n * Displays a breadcrumb trail showing the drilldown navigation path.\n * Allows users to navigate back up the drilldown hierarchy.\n *\n * URL Parameters Used:\n * - drilldown_depth: Current depth in drilldown hierarchy\n * - drilldown_parent: Parent dashboard ID\n * - drilldown_path: JSON array of dashboard IDs in the path\n */\n\nimport { memo, useCallback, useEffect, useState } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useBigConsoleNavigate } from '../../context';\nimport { useFilterUrlSync } from '../../hooks/useFilterUrlSync';\nimport { useDashboardStore } from '../../store';\nimport { ChevronRight, Home, ArrowLeft } from 'lucide-react';\nimport { SECTION_FOCUS_RING } from '../common';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ninterface DrilldownBreadcrumbProps {\n /** Additional CSS classes */\n className?: string;\n /** Current dashboard ID */\n currentDashboardId?: string;\n /** Current dashboard name */\n currentDashboardName?: string;\n /** Whether to show the home/root link */\n showHome?: boolean;\n /** Base path for dashboard URLs */\n basePath?: string;\n}\n\ninterface BreadcrumbItem {\n id: string;\n name: string;\n href: string;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const DrilldownBreadcrumb = memo(function DrilldownBreadcrumb({\n className = '',\n currentDashboardId,\n currentDashboardName,\n showHome = true,\n basePath = '/bigconsole/dashboards',\n}: DrilldownBreadcrumbProps) {\n const { t } = useI18n();\n const navigate = useBigConsoleNavigate();\n const { getDrilldownMetadata, isInDrilldown, drilldownDepth } = useFilterUrlSync();\n\n // Get dashboards from store for name lookup\n const dashboards = useDashboardStore((state) => state.dashboards);\n\n const [breadcrumbs, setBreadcrumbs] = useState<BreadcrumbItem[]>([]);\n\n // Build breadcrumb items from path\n useEffect(() => {\n if (!isInDrilldown) {\n setBreadcrumbs([]);\n return;\n }\n\n const metadata = getDrilldownMetadata();\n const { path } = metadata;\n\n if (path.length === 0) {\n setBreadcrumbs([]);\n return;\n }\n\n // Map path IDs to breadcrumb items\n const items: BreadcrumbItem[] = path.map((dashboardId) => {\n // Try to find dashboard name in store\n const dashboard = dashboards.get(dashboardId);\n const name =\n dashboard?.name ||\n t('bigconsole.dashboards.drilldownBreadcrumb.fallbackName', 'Dashboard {{id}}...', {\n id: dashboardId.slice(0, 8),\n });\n\n return {\n id: dashboardId,\n name,\n href: `${basePath}/${dashboardId}`,\n };\n });\n\n setBreadcrumbs(items);\n }, [isInDrilldown, getDrilldownMetadata, dashboards, basePath, t]);\n\n // Handle navigation to a breadcrumb item\n const handleNavigate = useCallback(\n (item: BreadcrumbItem, index: number) => {\n // Build URL preserving context up to this point\n const metadata = getDrilldownMetadata();\n const newPath = metadata.path.slice(0, index);\n const newDepth = index;\n\n // Build URL with updated drilldown params\n const url = new URL(item.href, window.location.origin);\n url.searchParams.set('drilldown_depth', String(newDepth));\n if (newPath.length > 0) {\n url.searchParams.set('drilldown_path', encodeURIComponent(JSON.stringify(newPath)));\n }\n if (index > 0 && newPath.length > 0) {\n url.searchParams.set('drilldown_parent', newPath[newPath.length - 1]);\n }\n\n navigate(url.pathname + url.search);\n },\n [getDrilldownMetadata, navigate]\n );\n\n // Handle back button click. When the drilldown was reached inside this app\n // session, step back through browser history: that restores the exact\n // origin (its page, filters and scroll) rather than rebuilding a URL that\n // would land on the parent's first page (BOFF-7625). React Router records\n // the history index in `history.state.idx`.\n const handleBack = useCallback(() => {\n const historyIndex = (window.history.state as { idx?: unknown } | null)?.idx;\n if (typeof historyIndex === 'number' && historyIndex > 0) {\n window.history.back();\n return;\n }\n\n const metadata = getDrilldownMetadata();\n\n if (metadata.parent) {\n // Navigate to parent dashboard\n const newPath = metadata.path.slice(0, -1);\n const newDepth = metadata.depth - 1;\n\n const url = new URL(`${basePath}/${metadata.parent}`, window.location.origin);\n url.searchParams.set('drilldown_depth', String(newDepth));\n if (newPath.length > 0) {\n url.searchParams.set('drilldown_path', encodeURIComponent(JSON.stringify(newPath)));\n url.searchParams.set('drilldown_parent', newPath[newPath.length - 1]);\n }\n\n navigate(url.pathname + url.search);\n } else if (breadcrumbs.length > 0) {\n // Navigate to last breadcrumb\n const lastBreadcrumb = breadcrumbs[breadcrumbs.length - 1];\n handleNavigate(lastBreadcrumb, breadcrumbs.length - 1);\n }\n }, [getDrilldownMetadata, basePath, navigate, breadcrumbs, handleNavigate]);\n\n // Handle home click\n const handleHomeClick = useCallback(\n (e: React.MouseEvent) => {\n e.preventDefault();\n navigate(basePath);\n },\n [navigate, basePath]\n );\n\n // Don't render if not in drilldown mode\n if (!isInDrilldown) {\n return null;\n }\n\n return (\n <nav\n // Recessed on purpose: this is navigational CONTEXT, not chrome you act\n // on, so it reads a step below the route header and the toolbar it sits\n // between instead of being a third identical bar. Wraps rather than\n // overflowing once the trail gets deep on a narrow viewport.\n className={`flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1 border-b border-[var(--color-border-subtle)] bg-bg-sunken px-4 py-1.5 ${className}`}\n aria-label={t('bigconsole.dashboards.drilldownBreadcrumb.ariaLabel', 'Drilldown breadcrumb')}\n data-testid=\"drilldown-breadcrumb\"\n >\n {/* Back button */}\n <button\n type=\"button\"\n onClick={handleBack}\n className={`flex min-h-control-sm items-center gap-1 rounded-button px-2 py-1 text-sm font-medium text-text-link motion-safe:transition-colors hover:bg-bg-accentSubtle ${SECTION_FOCUS_RING}`}\n aria-label={t('bigconsole.dashboards.drilldownBreadcrumb.back', 'Go back')}\n >\n <ArrowLeft className=\"w-4 h-4\" />\n <span className=\"hidden sm:inline\">{t('bigconsole.dashboards.drilldownBreadcrumb.backLabel', 'Back')}</span>\n </button>\n\n <span className=\"text-text-muted\" aria-hidden=\"true\">\n |\n </span>\n\n {/* Home link */}\n {showHome && (\n <>\n <a\n href={basePath}\n onClick={handleHomeClick}\n className={`flex min-h-control-sm items-center gap-1 rounded-button px-1 text-sm text-text-secondary motion-safe:transition-colors hover:text-text-primary ${SECTION_FOCUS_RING}`}\n aria-label={t('bigconsole.dashboards.drilldownBreadcrumb.home', 'Home')}\n >\n <Home className=\"w-4 h-4\" />\n <span className=\"hidden sm:inline\">\n {t('bigconsole.dashboards.drilldownBreadcrumb.dashboards', 'Dashboards')}\n </span>\n </a>\n <ChevronRight className=\"w-4 h-4 shrink-0 text-text-muted\" aria-hidden=\"true\" />\n </>\n )}\n\n {/* Breadcrumb items */}\n {breadcrumbs.map((item, index) => (\n <div key={item.id} className=\"flex min-w-0 items-center gap-2\">\n <button\n type=\"button\"\n onClick={() => handleNavigate(item, index)}\n className={`min-h-control-sm max-w-[150px] truncate rounded-button px-1 text-sm text-text-secondary motion-safe:transition-colors hover:text-text-primary hover:underline ${SECTION_FOCUS_RING}`}\n title={item.name}\n >\n {item.name}\n </button>\n <ChevronRight className=\"w-4 h-4 shrink-0 text-text-muted\" aria-hidden=\"true\" />\n </div>\n ))}\n\n {/* Current dashboard (non-clickable) */}\n {currentDashboardName && (\n <span\n aria-current=\"page\"\n className=\"max-w-[200px] truncate text-sm font-medium text-text-primary\"\n title={currentDashboardName}\n >\n {currentDashboardName}\n </span>\n )}\n\n {/* Depth indicator */}\n <span className=\"ml-auto shrink-0 rounded-pill bg-bg-surface px-2 py-0.5 text-xs text-text-muted\">\n {t('bigconsole.dashboards.drilldownBreadcrumb.level', 'Level {{depth}}', { depth: drilldownDepth ?? '' })}\n </span>\n </nav>\n );\n});\n\nexport default DrilldownBreadcrumb;\n"],"mappings":"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"}

package/dist/bigconsole/components/dashboard/ExportDashboardDialog.d.ts CHANGED Viewed

@@ -14,3 +14,4 @@ export interface ExportDashboardDialogProps {
 }
 export declare const ExportDashboardDialog: FC<ExportDashboardDialogProps>;
 export default ExportDashboardDialog;
+//# sourceMappingURL=ExportDashboardDialog.d.ts.map