npm - @burdenoff/microfe-tours - Versions diffs - 2026.625.1 → 2026.626.1 - Mend

@burdenoff/microfe-tours 2026.625.1 → 2026.626.1

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

Files changed (25) hide show

package/dist/tours/i18n.js +19 -1
package/dist/tours/i18n.js.map +1 -1
package/dist/tours/pages/AnalyticsDashboardPage.js +43 -41
package/dist/tours/pages/AnalyticsDashboardPage.js.map +1 -1
package/dist/tours/pages/MediaLibraryPage.js +66 -59
package/dist/tours/pages/MediaLibraryPage.js.map +1 -1
package/dist/tours/pages/MyToursPage.js +76 -57
package/dist/tours/pages/MyToursPage.js.map +1 -1
package/dist/tours/pages/MyToursProgressPage.js +81 -74
package/dist/tours/pages/MyToursProgressPage.js.map +1 -1
package/dist/tours/pages/SchedulerPage.js +78 -78
package/dist/tours/pages/SchedulerPage.js.map +1 -1
package/dist/tours/pages/StepEditorPage.js +570 -575
package/dist/tours/pages/StepEditorPage.js.map +1 -1
package/dist/tours/pages/SystemAnalyticsPage.js +128 -118
package/dist/tours/pages/SystemAnalyticsPage.js.map +1 -1
package/dist/tours/pages/TemplateLibraryPage.js +54 -65
package/dist/tours/pages/TemplateLibraryPage.js.map +1 -1
package/dist/tours/pages/TourBuilderPage.js +307 -272
package/dist/tours/pages/TourBuilderPage.js.map +1 -1
package/dist/tours/pages/TourPreviewPage.js +114 -122
package/dist/tours/pages/TourPreviewPage.js.map +1 -1
package/dist/tours/pages/ToursListPage.js +130 -122
package/dist/tours/pages/ToursListPage.js.map +1 -1
package/package.json +2 -2

package/dist/tours/pages/StepEditorPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepEditorPage.js","names":[],"sources":["../../../src/tours/pages/StepEditorPage.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { useParams, useNavigate } from 'react-router-dom';\nimport {\n ArrowLeft,\n Plus,\n Save,\n Trash2,\n ChevronLeft,\n ChevronRight,\n ChevronUp,\n ChevronDown,\n Menu,\n Paperclip,\n X,\n} from 'lucide-react';\nimport { PermissionGate } from '@burdenoff/fe-libs/shared/components';\nimport { useEventBus } from '@burdenoff/fe-libs/shared/events';\nimport { OptionalFields, Button, GlassCard } from '@burdenoff/fe-libs/ui';\nimport { useStepSequencer } from '../hooks/useStepSequencer';\nimport { useTourBuilder } from '../hooks/useTourBuilder';\nimport { useMediaLibrary } from '../hooks/useMediaLibrary';\nimport { useToursPermissionAccess } from '../hooks/useToursPermissionAccess';\nimport { useToursContext } from '../providers/ToursProvider';\nimport { TOUR_PERMISSIONS } from '../../constants/permissions';\nimport { useToursI18n } from '../i18n';\nimport { emitToursApiFailed } from '../telemetry';\n\n/*\n Step editor page\n * Manage tour steps with sequencer and editor\n * Responsive: sidebar drawer on mobile, side panel on desktop\n /\nexport function StepEditorPage() {\n const { tr } = useToursI18n();\n\n const { tourId, stepId } = useParams();\n const navigate = useNavigate();\n const toursContext = useToursContext();\n const { basePath = '/' } = toursContext;\n const eventBus = useEventBus();\n const { hasPermission } = useToursPermissionAccess();\n const canCreateStep = hasPermission(TOUR_PERMISSIONS.TOUR_STEP_CREATE);\n const canUpdateStep = hasPermission(TOUR_PERMISSIONS.TOUR_STEP_UPDATE);\n const canDeleteStep = hasPermission(TOUR_PERMISSIONS.TOUR_STEP_DELETE);\n\n const { tour, loadTour, syncSteps, saving } = useTourBuilder(tourId);\n const { steps, selectedStep, selectStep, createStep, deleteStep, updateStepField, moveStep } =\n useStepSequencer();\n const { media, fetchMedia, attachToStep, loading: mediaLoading } = useMediaLibrary();\n\n // Mobile sidebar state\n const [isSidebarOpen, setIsSidebarOpen] = useState(false);\n const [isMobile, setIsMobile] = useState(\n () => typeof window !== 'undefined' && window.innerWidth < 768\n );\n const [attachmentMediaId, setAttachmentMediaId] = useState('');\n const [attachmentPosition, setAttachmentPosition] = useState<'header' \| 'body' \| 'footer'>(\n 'body'\n );\n const [attachingMedia, setAttachingMedia] = useState(false);\n\n // Detect mobile viewport\n useEffect(() => {\n const checkMobile = () => {\n const mobile = window.innerWidth < 768;\n setIsMobile(mobile);\n // Auto-close sidebar on desktop\n if (!mobile) {\n setIsSidebarOpen(false);\n }\n };\n window.addEventListener('resize', checkMobile);\n return () => window.removeEventListener('resize', checkMobile);\n }, []);\n\n useEffect(() => {\n if (tourId) {\n loadTour(tourId);\n }\n }, [tourId, loadTour]);\n\n useEffect(() => {\n void fetchMedia();\n }, [fetchMedia]);\n\n useEffect(() => {\n const selectedStepId = stepId \|\| selectedStep?.id;\n if (selectedStepId && steps.length > 0) {\n const step = steps.find((s) => s.id === selectedStepId);\n if (step) {\n selectStep(step);\n }\n }\n }, [stepId, steps, selectStep, selectedStep?.id]);\n\n const handleAddStep = () => {\n createStep();\n };\n\n const handleSaveSteps = async () => {\n if (tourId) {\n try {\n await syncSteps(tourId, steps);\n } catch {\n emitToursApiFailed(eventBus, 'step.save', toursContext);\n }\n }\n };\n\n const handleBack = () => {\n navigate(`${basePath}/${tourId}/edit`);\n };\n\n const handleAttachMedia = async () => {\n if (!selectedStep \|\| !tourId \|\| !attachmentMediaId) return;\n if (selectedStep.id.startsWith('temp_')) {\n window.alert('Save your steps before attaching media to them.');\n return;\n }\n\n try {\n setAttachingMedia(true);\n await attachToStep(\n selectedStep.id,\n attachmentMediaId,\n attachmentPosition,\n (selectedStep.media?.length ?? 0) + 1\n );\n await loadTour(tourId);\n setAttachmentMediaId('');\n } catch {\n emitToursApiFailed(eventBus, 'media.attach', toursContext);\n } finally {\n setAttachingMedia(false);\n }\n };\n\n const handleSelectStep = (step: (typeof steps)[0]) => {\n selectStep(step);\n // Close sidebar on mobile after selecting\n if (isMobile) {\n setIsSidebarOpen(false);\n }\n };\n\n return (\n <div className=\"flex flex-col h-full bg-bg-surface\">\n {/ Header /}\n <div className=\"border-b border-border-subtle p-3 sm:p-4 flex flex-col sm:flex-row sm:items-center gap-3 sm:gap-4 bg-bg-surface\">\n <div className=\"flex items-center gap-3\">\n <button\n type=\"button\"\n onClick={handleBack}\n className=\"p-2 hover:bg-accent rounded-md shrink-0\"\n aria-label={tr('stepEditor.goBack')}\n >\n <ArrowLeft size={20} />\n </button>\n <div className=\"flex-1 min-w-0\">\n <h1 className=\"text-base sm:text-lg font-semibold truncate\">\n {tour?.name \|\| tr('stepEditor.tourFallback')} - {tr('stepEditor.stepsLabel')}\n </h1>\n <p className=\"text-xs sm:text-sm text-text-secondary\">\n {steps.length} {tr('stepEditor.stepsCount')}\n </p>\n </div>\n </div>\n\n {/ Action buttons /}\n <div className=\"flex items-center gap-2 sm:gap-3 ml-auto\">\n {/ Mobile: Toggle sidebar button /}\n {isMobile && (\n <button\n type=\"button\"\n onClick={() => setIsSidebarOpen(!isSidebarOpen)}\n className=\"px-3 py-2 border border-border-subtle rounded-md hover:bg-accent flex items-center gap-2 sm:hidden\"\n >\n <Menu size={18} />\n <span className=\"text-sm\">{tr('stepEditor.steps')}</span>\n {steps.length > 0 && (\n <span className=\"px-1.5 py-0.5 text-xs bg-action-primary-bg/20 rounded-full\">\n {steps.length}\n </span>\n )}\n </button>\n )}\n\n {canCreateStep && (\n <button\n type=\"button\"\n onClick={handleAddStep}\n className=\"px-3 sm:px-4 py-2 border border-border-subtle rounded-md hover:bg-accent flex items-center gap-2 text-sm sm:text-base\"\n >\n <Plus size={18} />\n <span className=\"hidden xs:inline\">{tr('stepEditor.addStep')}</span>\n </button>\n )}\n <PermissionGate permission={TOUR_PERMISSIONS.TOUR_STEP_UPDATE}>\n <Button\n type=\"button\"\n onClick={handleSaveSteps}\n disabled={saving \|\| !canUpdateStep}\n className=\"min-h-[44px] text-sm sm:text-base\"\n >\n <Save size={18} />\n <span className=\"hidden xs:inline\">\n {saving ? tr('stepEditor.saving') : tr('stepEditor.save')}\n </span>\n </Button>\n </PermissionGate>\n </div>\n </div>\n\n <div className=\"flex-1 flex overflow-hidden relative\">\n {/ Mobile Sidebar Overlay /}\n {isMobile && isSidebarOpen && (\n <button\n type=\"button\"\n aria-label={tr('stepEditor.closeSteps')}\n className=\"fixed inset-0 bg-foreground/40 z-40 md:hidden\"\n onClick={() => setIsSidebarOpen(false)}\n />\n )}\n\n {/ Step List Sidebar /}\n <div\n className={`\n ${isMobile ? 'fixed inset-y-0 left-0 z-50 w-[min(18rem,calc(100vw-2rem))] transform transition-transform duration-300' : 'w-64 lg:w-80 shrink-0'}\n ${isMobile && !isSidebarOpen ? '-translate-x-full' : 'translate-x-0'}\n border-r border-border-subtle overflow-y-auto bg-bg-surface\n `}\n >\n {/ Mobile sidebar header /}\n {isMobile && (\n <div className=\"flex items-center justify-between p-4 border-b border-border-subtle sticky top-0 bg-bg-surface z-10\">\n <h2 className=\"font-semibold\">{tr('stepEditor.tourSteps')}</h2>\n <button\n type=\"button\"\n onClick={() => setIsSidebarOpen(false)}\n className=\"p-2 min-h-[44px] min-w-[44px] hover:bg-accent rounded-md\"\n aria-label={tr('stepEditor.closeSteps')}\n >\n <X size={20} />\n </button>\n </div>\n )}\n\n <div className=\"p-3 sm:p-4 space-y-2\">\n {steps.length === 0 ? (\n <div className=\"text-center py-8 text-text-secondary\">\n <p className=\"text-sm\">{tr('stepEditor.noStepsYet')}</p>\n <p className=\"text-xs mt-1\">{tr('stepEditor.clickAddStep')}</p>\n </div>\n ) : (\n steps.map((step, index) => (\n <div\n key={step.id}\n role=\"button\"\n tabIndex={0}\n onClick={() => handleSelectStep(step)}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n handleSelectStep(step);\n }\n }}\n className={`p-3 border rounded-md cursor-pointer transition-colors ${\n selectedStep?.id === step.id\n ? 'border-primary bg-action-primary-bg/10 shadow-[var(--shadow-pop)]'\n : 'border-border-seam hover:bg-accent'\n }`}\n >\n <div className=\"flex items-start justify-between gap-2\">\n <div className=\"flex-1 min-w-0\">\n <div className=\"text-xs text-text-secondary mb-1\">\n {tr('stepEditor.stepNumber')} {index + 1}\n </div>\n <div className=\"font-medium text-sm truncate\">\n {step.title \|\| tr('stepEditor.untitled')}\n </div>\n {step.targetSelector && (\n <div className=\"text-xs text-text-secondary mt-1 truncate font-mono\">\n {step.targetSelector}\n </div>\n )}\n </div>\n {canDeleteStep && (\n <div className=\"flex items-center gap-1 shrink-0\">\n <button\n type=\"button\"\n onClick={(e) => {\n e.stopPropagation();\n if (index > 0) {\n moveStep(index, index - 1);\n }\n }}\n className=\"p-1.5 sm:p-2 min-h-[32px] min-w-[32px] sm:min-h-[40px] sm:min-w-[40px] hover:bg-accent rounded\"\n title=\"Move step up\"\n aria-label=\"Move step up\"\n disabled={index === 0}\n >\n <ChevronUp size={14} />\n </button>\n <button\n type=\"button\"\n onClick={(e) => {\n e.stopPropagation();\n if (index < steps.length - 1) {\n moveStep(index, index + 1);\n }\n }}\n className=\"p-1.5 sm:p-2 min-h-[32px] min-w-[32px] sm:min-h-[40px] sm:min-w-[40px] hover:bg-accent rounded\"\n title=\"Move step down\"\n aria-label=\"Move step down\"\n disabled={index === steps.length - 1}\n >\n <ChevronDown size={14} />\n </button>\n <button\n type=\"button\"\n onClick={(e) => {\n e.stopPropagation();\n deleteStep(step.id);\n }}\n className=\"p-1.5 sm:p-2 min-h-[32px] min-w-[32px] sm:min-h-[40px] sm:min-w-[40px] hover:bg-status-error-bg/10 rounded text-status-error-text\"\n title={tr('stepEditor.deleteStep')}\n aria-label={tr('stepEditor.deleteStep')}\n >\n <Trash2 size={14} />\n </button>\n </div>\n )}\n </div>\n </div>\n ))\n )}\n </div>\n </div>\n\n {/ Step Editor /}\n <div className=\"flex-1 overflow-y-auto p-4 sm:p-6\">\n {selectedStep ? (\n <div className=\"max-w-2xl mx-auto space-y-4 sm:space-y-6\">\n {/ Mobile: Step navigation /}\n {isMobile && steps.length > 1 && (\n <div className=\"flex items-center justify-between bg-bg-sunken/50 rounded-lg p-2 mb-4\">\n <button\n type=\"button\"\n onClick={() => {\n const currentIndex = steps.findIndex((s) => s.id === selectedStep.id);\n if (currentIndex > 0) {\n selectStep(steps[currentIndex - 1]);\n }\n }}\n disabled={steps.findIndex((s) => s.id === selectedStep.id) === 0}\n className=\"p-2 min-h-[44px] min-w-[44px] hover:bg-accent rounded-md disabled:opacity-30\"\n aria-label={tr('stepEditor.previousStep')}\n >\n <ChevronLeft size={20} />\n </button>\n <span className=\"text-sm text-text-secondary\">\n {tr('stepEditor.stepNumber')}{' '}\n {steps.findIndex((s) => s.id === selectedStep.id) + 1} {tr('stepEditor.of')}{' '}\n {steps.length}\n </span>\n <button\n type=\"button\"\n onClick={() => {\n const currentIndex = steps.findIndex((s) => s.id === selectedStep.id);\n if (currentIndex < steps.length - 1) {\n selectStep(steps[currentIndex + 1]);\n }\n }}\n disabled={steps.findIndex((s) => s.id === selectedStep.id) === steps.length - 1}\n className=\"p-2 min-h-[44px] min-w-[44px] hover:bg-accent rounded-md disabled:opacity-30\"\n aria-label={tr('stepEditor.nextStep')}\n >\n <ChevronRight size={20} />\n </button>\n </div>\n )}\n\n <h2 className=\"text-lg sm:text-xl font-semibold\">{tr('stepEditor.editStep')}</h2>\n\n {/ Title /}\n <div>\n <label className=\"block text-sm font-medium mb-2\" htmlFor=\"step-editor-title\">\n {tr('stepEditor.stepTitle')} \n </label>\n <input\n id=\"step-editor-title\"\n type=\"text\"\n value={selectedStep.title}\n onChange={(e) => updateStepField(selectedStep.id, 'title', e.target.value)}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm sm:text-base\"\n placeholder={tr('stepEditor.stepTitlePlaceholder')}\n aria-label={tr('stepEditor.stepTitle')}\n />\n </div>\n\n {/* Content /}\n <div>\n <label className=\"block text-sm font-medium mb-2\" htmlFor=\"step-editor-content\">\n {tr('stepEditor.content')} \n </label>\n <textarea\n id=\"step-editor-content\"\n value={selectedStep.content}\n onChange={(e) => updateStepField(selectedStep.id, 'content', e.target.value)}\n rows={4}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm sm:text-base resize-y min-h-[100px]\"\n placeholder={tr('stepEditor.contentPlaceholder')}\n aria-label={tr('stepEditor.content')}\n />\n </div>\n\n {/* Selector /}\n <div>\n <label\n className=\"block text-sm font-medium mb-2\"\n htmlFor=\"step-editor-css-selector\"\n >\n {tr('stepEditor.cssSelector')} \n <span className=\"text-text-secondary font-normal ml-2\">\n ({tr('stepEditor.targetElement')})\n </span>\n </label>\n <input\n id=\"step-editor-css-selector\"\n type=\"text\"\n value={selectedStep.targetSelector \|\| ''}\n onChange={(e) =>\n updateStepField(selectedStep.id, 'targetSelector', e.target.value)\n }\n placeholder={tr('stepEditor.cssSelectorPlaceholder')}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface font-mono text-sm\"\n aria-label=\"{tr('stepEditor.cssSelector')} \n \n ({tr('stepEditor.targetElement')})\"\n />\n <p className=\"text-xs text-text-secondary mt-1\">\n {tr('stepEditor.dataTourHint')}\n </p>\n </div>\n\n {/ Placement /}\n <div>\n <label className=\"block text-sm font-medium mb-2\" htmlFor=\"step-editor-placement\">\n {tr('stepEditor.tooltipPlacement')}\n </label>\n <select\n id=\"step-editor-placement\"\n value={selectedStep.placement}\n onChange={(e) => updateStepField(selectedStep.id, 'placement', e.target.value)}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm sm:text-base\"\n aria-label={tr('stepEditor.tooltipPlacement')}\n >\n <option value=\"AUTO\">{tr('stepEditor.placementAuto')}</option>\n <option value=\"TOP\">{tr('stepEditor.placementTop')}</option>\n <option value=\"BOTTOM\">{tr('stepEditor.placementBottom')}</option>\n <option value=\"LEFT\">{tr('stepEditor.placementLeft')}</option>\n <option value=\"RIGHT\">{tr('stepEditor.placementRight')}</option>\n <option value=\"CENTER\">{tr('stepEditor.placementCenter')}</option>\n </select>\n </div>\n\n {/ Device-specific selectors /}\n <details className=\"border border-border-subtle rounded-md\">\n <summary className=\"px-4 py-3 cursor-pointer font-medium text-sm hover:bg-accent/50 rounded-t-md\">\n {tr('stepEditor.deviceSpecificSelectors')}\n </summary>\n <div className=\"p-4 pt-0 space-y-3 border-t border-border-subtle\">\n <p className=\"text-xs text-text-secondary mb-3\">\n {tr('stepEditor.deviceSelectorHint')}\n </p>\n <div>\n <label\n className=\"block text-xs font-medium mb-1\"\n htmlFor=\"step-editor-mobile-selector\"\n >\n {tr('stepEditor.mobileSelector')}\n </label>\n <input\n id=\"step-editor-mobile-selector\"\n type=\"text\"\n value={selectedStep.targetSelectorMobile \|\| ''}\n onChange={(e) =>\n updateStepField(selectedStep.id, 'targetSelectorMobile', e.target.value)\n }\n placeholder={tr('stepEditor.leaveEmptyDefault')}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono\"\n aria-label={tr('stepEditor.mobileSelector')}\n />\n </div>\n <div>\n <label\n className=\"block text-xs font-medium mb-1\"\n htmlFor=\"step-editor-tablet-selector\"\n >\n {tr('stepEditor.tabletSelector')}\n </label>\n <input\n id=\"step-editor-tablet-selector\"\n type=\"text\"\n value={selectedStep.targetSelectorTablet \|\| ''}\n onChange={(e) =>\n updateStepField(selectedStep.id, 'targetSelectorTablet', e.target.value)\n }\n placeholder={tr('stepEditor.leaveEmptyDefault')}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono\"\n aria-label={tr('stepEditor.tabletSelector')}\n />\n </div>\n <div>\n <label\n className=\"block text-xs font-medium mb-1\"\n htmlFor=\"step-editor-desktop-selector\"\n >\n {tr('stepEditor.desktopSelector')}\n </label>\n <input\n id=\"step-editor-desktop-selector\"\n type=\"text\"\n value={selectedStep.targetSelectorDesktop \|\| ''}\n onChange={(e) =>\n updateStepField(selectedStep.id, 'targetSelectorDesktop', e.target.value)\n }\n placeholder={tr('stepEditor.leaveEmptyDefault')}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono\"\n aria-label={tr('stepEditor.desktopSelector')}\n />\n </div>\n </div>\n </details>\n\n <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2\">\n <label className=\"flex items-center gap-3 cursor-pointer rounded-md border border-border-subtle p-3\">\n <input\n type=\"checkbox\"\n checked={selectedStep.requireInteraction ?? false}\n onChange={(e) =>\n updateStepField(selectedStep.id, 'requireInteraction', e.target.checked)\n }\n className=\"size-4 rounded\"\n aria-label=\"Require interaction\"\n />\n <div>\n <div className=\"text-sm font-medium\">Require interaction</div>\n <div className=\"text-xs text-text-secondary\">\n User must interact with the highlighted element before advancing.\n </div>\n </div>\n </label>\n\n <div>\n <label\n className=\"block text-sm font-medium mb-2\"\n htmlFor=\"step-editor-wait-timeout\"\n >\n Wait for timeout (ms)\n </label>\n <input\n id=\"step-editor-wait-timeout\"\n type=\"number\"\n min=\"0\"\n value={selectedStep.waitForTimeout ?? ''}\n onChange={(e) =>\n updateStepField(\n selectedStep.id,\n 'waitForTimeout',\n e.target.value ? Number(e.target.value) : undefined\n )\n }\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm\"\n placeholder=\"1500\"\n aria-label=\"Wait for timeout (ms)\"\n />\n </div>\n </div>\n\n {/ Advanced: step timing / skip conditions / analytics tags — collapse the long-tail knobs */}\n <OptionalFields\n title=\"Advanced settings\"\n description=\"Step-timing waits, skip conditions, and analytics tags.\"\n >\n <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2\">\n <div>\n <label\n className=\"block text-sm font-medium mb-2\"\n htmlFor=\"step-editor-wait-selector\"\n >\n Wait for selector\n </label>\n <input\n id=\"step-editor-wait-selector\"\n type=\"text\"\n value={selectedStep.waitForSelector \|\| ''}\n onChange={(e) =>\n updateStepField(\n selectedStep.id,\n 'waitForSelector',\n e.target.value \|\| undefined\n )\n }\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono\"\n placeholder=\"[data-tour='agents-tabs']\"\n aria-label=\"Wait for selector\"\n />\n </div>\n\n <div>\n <label\n className=\"block text-sm font-medium mb-2\"\n htmlFor=\"step-editor-wait-event\"\n >\n Wait for event\n </label>\n <input\n id=\"step-editor-wait-event\"\n type=\"text\"\n value={selectedStep.waitForEvent \|\| ''}\n onChange={(e) =>\n updateStepField(\n selectedStep.id,\n 'waitForEvent',\n e.target.value \|\| undefined\n )\n }\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm\"\n placeholder=\"tour:ready\"\n aria-label=\"Wait for event\"\n />\n </div>\n </div>\n\n <div className=\"mt-4\">\n <label\n className=\"block text-sm font-medium mb-2\"\n htmlFor=\"step-editor-skip-conditions\"\n >\n Skip conditions (JSON)\n </label>\n <textarea\n id=\"step-editor-skip-conditions\"\n value={\n selectedStep.skipConditions\n ? JSON.stringify(selectedStep.skipConditions, null, 2)\n : ''\n }\n onChange={(e) => {\n const rawValue = e.target.value.trim();\n if (!rawValue) {\n updateStepField(selectedStep.id, 'skipConditions', undefined);\n return;\n }\n\n try {\n updateStepField(selectedStep.id, 'skipConditions', JSON.parse(rawValue));\n } catch {\n updateStepField(selectedStep.id, 'skipConditions', rawValue);\n }\n }}\n rows={4}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono\"\n placeholder='{\"selectorMissing\":\"[data-tour=\\\"missing\\\"]\"}'\n aria-label=\"Skip conditions (JSON)\"\n />\n </div>\n </OptionalFields>\n\n <GlassCard treatment=\"plain\" className=\"p-4 space-y-4 border-border-seam\">\n <div className=\"flex items-center gap-2\">\n <Paperclip size={18} />\n <h3 className=\"text-sm font-semibold\">Step media</h3>\n </div>\n\n {selectedStep.media && selectedStep.media.length > 0 ? (\n <div className=\"space-y-2\">\n {selectedStep.media.map((item) => (\n <div\n key={item.id}\n className=\"flex items-center justify-between rounded-md border border-border-subtle p-2 text-sm\"\n >\n <div>\n <div className=\"font-medium\">{item.media.name}</div>\n <div className=\"text-xs text-text-secondary\">{item.position}</div>\n </div>\n <span className=\"text-xs text-text-secondary\">{item.media.type}</span>\n </div>\n ))}\n </div>\n ) : (\n <p className=\"text-sm text-text-secondary\">\n No media attached to this step yet.\n </p>\n )}\n\n <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-[minmax(0,1fr)_160px_auto]\">\n <select\n value={attachmentMediaId}\n onChange={(e) => setAttachmentMediaId(e.target.value)}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm\"\n aria-label=\"Select media to attach\"\n >\n <option value=\"\">\n {mediaLoading ? 'Loading media...' : 'Select uploaded media'}\n </option>\n {media.map((item) => (\n <option key={item.id} value={item.id}>\n {item.name} ({item.type})\n </option>\n ))}\n </select>\n\n <select\n value={attachmentPosition}\n onChange={(e) =>\n setAttachmentPosition(e.target.value as 'header' \| 'body' \| 'footer')\n }\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm\"\n aria-label=\"Attachment position\"\n >\n <option value=\"header\">Header</option>\n <option value=\"body\">Body</option>\n <option value=\"footer\">Footer</option>\n </select>\n\n <button\n type=\"button\"\n onClick={handleAttachMedia}\n disabled={attachingMedia \|\| !attachmentMediaId}\n className=\"px-4 py-2 min-h-[44px] border border-border-subtle rounded-md hover:bg-accent disabled:opacity-50\"\n >\n Attach\n </button>\n </div>\n </GlassCard>\n </div>\n ) : (\n <div className=\"flex flex-col items-center justify-center h-full text-center px-4\">\n <div className=\"size-16 bg-bg-sunken rounded-full flex items-center justify-center mb-4\">\n <Plus size={24} className=\"text-text-secondary\" />\n </div>\n <p className=\"text-text-secondary mb-2\">{tr('stepEditor.noStepSelected')}</p>\n <p className=\"text-sm text-text-secondary mb-4\">\n {steps.length > 0\n ? tr('stepEditor.selectStepToEdit')\n : tr('stepEditor.createFirstStep')}\n </p>\n {steps.length === 0 && canCreateStep && (\n <button\n type=\"button\"\n onClick={handleAddStep}\n className=\"px-4 py-2 min-h-[44px] bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg/90 flex items-center gap-2\"\n >\n <Plus size={18} />\n {tr('stepEditor.addFirstStep')}\n </button>\n )}\n </div>\n )}\n </div>\n </div>\n </div>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"StepEditorPage.js","names":[],"sources":["../../../src/tours/pages/StepEditorPage.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { useParams, useNavigate } from 'react-router-dom';\nimport {\n ArrowLeft,\n Plus,\n Save,\n Trash2,\n ChevronLeft,\n ChevronRight,\n ChevronUp,\n ChevronDown,\n Menu,\n Paperclip,\n X,\n} from 'lucide-react';\nimport { PermissionGate } from '@burdenoff/fe-libs/shared/components';\nimport { useEventBus } from '@burdenoff/fe-libs/shared/events';\nimport {\n OptionalFields,\n Button,\n GlassCard,\n IllustratedEmptyState,\n PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { useStepSequencer } from '../hooks/useStepSequencer';\nimport { useTourBuilder } from '../hooks/useTourBuilder';\nimport { useMediaLibrary } from '../hooks/useMediaLibrary';\nimport { useToursPermissionAccess } from '../hooks/useToursPermissionAccess';\nimport { useToursContext } from '../providers/ToursProvider';\nimport { TOUR_PERMISSIONS } from '../../constants/permissions';\nimport { useToursI18n } from '../i18n';\nimport { emitToursApiFailed } from '../telemetry';\n\n/*\n Step editor page\n * Manage tour steps with sequencer and editor\n * Responsive: sidebar drawer on mobile, side panel on desktop\n /\nexport function StepEditorPage() {\n const { tr } = useToursI18n();\n\n const { tourId, stepId } = useParams();\n const navigate = useNavigate();\n const toursContext = useToursContext();\n const { basePath = '/' } = toursContext;\n const eventBus = useEventBus();\n const { hasPermission } = useToursPermissionAccess();\n const canCreateStep = hasPermission(TOUR_PERMISSIONS.TOUR_STEP_CREATE);\n const canUpdateStep = hasPermission(TOUR_PERMISSIONS.TOUR_STEP_UPDATE);\n const canDeleteStep = hasPermission(TOUR_PERMISSIONS.TOUR_STEP_DELETE);\n\n const { tour, loadTour, syncSteps, saving } = useTourBuilder(tourId);\n const { steps, selectedStep, selectStep, createStep, deleteStep, updateStepField, moveStep } =\n useStepSequencer();\n const { media, fetchMedia, attachToStep, loading: mediaLoading } = useMediaLibrary();\n\n // Mobile sidebar state\n const [isSidebarOpen, setIsSidebarOpen] = useState(false);\n const [isMobile, setIsMobile] = useState(\n () => typeof window !== 'undefined' && window.innerWidth < 768\n );\n const [attachmentMediaId, setAttachmentMediaId] = useState('');\n const [attachmentPosition, setAttachmentPosition] = useState<'header' \| 'body' \| 'footer'>(\n 'body'\n );\n const [attachingMedia, setAttachingMedia] = useState(false);\n\n // Detect mobile viewport\n useEffect(() => {\n const checkMobile = () => {\n const mobile = window.innerWidth < 768;\n setIsMobile(mobile);\n // Auto-close sidebar on desktop\n if (!mobile) {\n setIsSidebarOpen(false);\n }\n };\n window.addEventListener('resize', checkMobile);\n return () => window.removeEventListener('resize', checkMobile);\n }, []);\n\n useEffect(() => {\n if (tourId) {\n loadTour(tourId);\n }\n }, [tourId, loadTour]);\n\n useEffect(() => {\n void fetchMedia();\n }, [fetchMedia]);\n\n useEffect(() => {\n const selectedStepId = stepId \|\| selectedStep?.id;\n if (selectedStepId && steps.length > 0) {\n const step = steps.find((s) => s.id === selectedStepId);\n if (step) {\n selectStep(step);\n }\n }\n }, [stepId, steps, selectStep, selectedStep?.id]);\n\n const handleAddStep = () => {\n createStep();\n };\n\n const handleSaveSteps = async () => {\n if (tourId) {\n try {\n await syncSteps(tourId, steps);\n } catch {\n emitToursApiFailed(eventBus, 'step.save', toursContext);\n }\n }\n };\n\n const handleBack = () => {\n navigate(`${basePath}/${tourId}/edit`);\n };\n\n const handleAttachMedia = async () => {\n if (!selectedStep \|\| !tourId \|\| !attachmentMediaId) return;\n if (selectedStep.id.startsWith('temp_')) {\n window.alert('Save your steps before attaching media to them.');\n return;\n }\n\n try {\n setAttachingMedia(true);\n await attachToStep(\n selectedStep.id,\n attachmentMediaId,\n attachmentPosition,\n (selectedStep.media?.length ?? 0) + 1\n );\n await loadTour(tourId);\n setAttachmentMediaId('');\n } catch {\n emitToursApiFailed(eventBus, 'media.attach', toursContext);\n } finally {\n setAttachingMedia(false);\n }\n };\n\n const handleSelectStep = (step: (typeof steps)[0]) => {\n selectStep(step);\n // Close sidebar on mobile after selecting\n if (isMobile) {\n setIsSidebarOpen(false);\n }\n };\n\n return (\n <div className=\"flex flex-col h-full bg-bg-surface\">\n {/ Header /}\n <div className=\"border-b border-border-subtle p-3 sm:p-4 flex flex-col sm:flex-row sm:items-center gap-3 sm:gap-4 bg-bg-surface\">\n <div className=\"flex items-center gap-3\">\n <button\n type=\"button\"\n onClick={handleBack}\n className=\"p-2 hover:bg-accent rounded-md shrink-0\"\n aria-label={tr('stepEditor.goBack')}\n >\n <ArrowLeft size={20} />\n </button>\n <div className=\"flex-1 min-w-0\">\n <h1 className=\"text-base sm:text-lg font-semibold truncate\">\n {tour?.name \|\| tr('stepEditor.tourFallback')} - {tr('stepEditor.stepsLabel')}\n </h1>\n <p className=\"text-xs sm:text-sm text-text-secondary\">\n {steps.length} {tr('stepEditor.stepsCount')}\n </p>\n </div>\n </div>\n\n {/ Action buttons /}\n <div className=\"flex items-center gap-2 sm:gap-3 ml-auto\">\n {/ Mobile: Toggle sidebar button /}\n {isMobile && (\n <button\n type=\"button\"\n onClick={() => setIsSidebarOpen(!isSidebarOpen)}\n className=\"px-3 py-2 border border-border-subtle rounded-md hover:bg-accent flex items-center gap-2 sm:hidden\"\n >\n <Menu size={18} />\n <span className=\"text-sm\">{tr('stepEditor.steps')}</span>\n {steps.length > 0 && (\n <span className=\"px-1.5 py-0.5 text-xs bg-action-primary-bg/20 rounded-full\">\n {steps.length}\n </span>\n )}\n </button>\n )}\n\n {canCreateStep && (\n <button\n type=\"button\"\n onClick={handleAddStep}\n className=\"px-3 sm:px-4 py-2 border border-border-subtle rounded-md hover:bg-accent flex items-center gap-2 text-sm sm:text-base\"\n >\n <Plus size={18} />\n <span className=\"hidden xs:inline\">{tr('stepEditor.addStep')}</span>\n </button>\n )}\n <PermissionGate permission={TOUR_PERMISSIONS.TOUR_STEP_UPDATE}>\n <Button\n type=\"button\"\n onClick={handleSaveSteps}\n disabled={saving \|\| !canUpdateStep}\n className=\"min-h-[44px] text-sm sm:text-base\"\n >\n <Save size={18} />\n <span className=\"hidden xs:inline\">\n {saving ? tr('stepEditor.saving') : tr('stepEditor.save')}\n </span>\n </Button>\n </PermissionGate>\n </div>\n </div>\n\n <div className=\"px-3 sm:px-4 pt-3 sm:pt-4\">\n <PagePurpose>{tr('stepEditor.purpose')}</PagePurpose>\n </div>\n\n <div className=\"flex-1 flex overflow-hidden relative\">\n {/ Mobile Sidebar Overlay /}\n {isMobile && isSidebarOpen && (\n <button\n type=\"button\"\n aria-label={tr('stepEditor.closeSteps')}\n className=\"fixed inset-0 bg-foreground/40 z-40 md:hidden\"\n onClick={() => setIsSidebarOpen(false)}\n />\n )}\n\n {/ Step List Sidebar /}\n <div\n className={`\n ${isMobile ? 'fixed inset-y-0 left-0 z-50 w-[min(18rem,calc(100vw-2rem))] transform transition-transform duration-300' : 'w-64 lg:w-80 shrink-0'}\n ${isMobile && !isSidebarOpen ? '-translate-x-full' : 'translate-x-0'}\n border-r border-border-subtle overflow-y-auto bg-bg-surface\n `}\n >\n {/ Mobile sidebar header /}\n {isMobile && (\n <div className=\"flex items-center justify-between p-4 border-b border-border-subtle sticky top-0 bg-bg-surface z-10\">\n <h2 className=\"font-semibold\">{tr('stepEditor.tourSteps')}</h2>\n <button\n type=\"button\"\n onClick={() => setIsSidebarOpen(false)}\n className=\"p-2 min-h-[44px] min-w-[44px] hover:bg-accent rounded-md\"\n aria-label={tr('stepEditor.closeSteps')}\n >\n <X size={20} />\n </button>\n </div>\n )}\n\n <div className=\"p-3 sm:p-4 space-y-2\">\n {steps.length === 0 ? (\n <div className=\"text-center py-8 text-text-secondary\">\n <p className=\"text-sm\">{tr('stepEditor.noStepsYet')}</p>\n <p className=\"text-xs mt-1\">{tr('stepEditor.clickAddStep')}</p>\n </div>\n ) : (\n steps.map((step, index) => (\n <div\n key={step.id}\n role=\"button\"\n tabIndex={0}\n onClick={() => handleSelectStep(step)}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n handleSelectStep(step);\n }\n }}\n className={`p-3 border rounded-md cursor-pointer transition-colors ${\n selectedStep?.id === step.id\n ? 'border-primary bg-action-primary-bg/10 shadow-[var(--shadow-pop)]'\n : 'border-border-seam hover:bg-accent'\n }`}\n >\n <div className=\"flex items-start justify-between gap-2\">\n <div className=\"flex-1 min-w-0\">\n <div className=\"text-xs text-text-secondary mb-1\">\n {tr('stepEditor.stepNumber')} {index + 1}\n </div>\n <div className=\"font-medium text-sm truncate\">\n {step.title \|\| tr('stepEditor.untitled')}\n </div>\n {step.targetSelector && (\n <div className=\"text-xs text-text-secondary mt-1 truncate font-mono\">\n {step.targetSelector}\n </div>\n )}\n </div>\n {canDeleteStep && (\n <div className=\"flex items-center gap-1 shrink-0\">\n <button\n type=\"button\"\n onClick={(e) => {\n e.stopPropagation();\n if (index > 0) {\n moveStep(index, index - 1);\n }\n }}\n className=\"p-1.5 sm:p-2 min-h-[32px] min-w-[32px] sm:min-h-[40px] sm:min-w-[40px] hover:bg-accent rounded\"\n title=\"Move step up\"\n aria-label=\"Move step up\"\n disabled={index === 0}\n >\n <ChevronUp size={14} />\n </button>\n <button\n type=\"button\"\n onClick={(e) => {\n e.stopPropagation();\n if (index < steps.length - 1) {\n moveStep(index, index + 1);\n }\n }}\n className=\"p-1.5 sm:p-2 min-h-[32px] min-w-[32px] sm:min-h-[40px] sm:min-w-[40px] hover:bg-accent rounded\"\n title=\"Move step down\"\n aria-label=\"Move step down\"\n disabled={index === steps.length - 1}\n >\n <ChevronDown size={14} />\n </button>\n <button\n type=\"button\"\n onClick={(e) => {\n e.stopPropagation();\n deleteStep(step.id);\n }}\n className=\"p-1.5 sm:p-2 min-h-[32px] min-w-[32px] sm:min-h-[40px] sm:min-w-[40px] hover:bg-status-error-bg/10 rounded text-status-error-text\"\n title={tr('stepEditor.deleteStep')}\n aria-label={tr('stepEditor.deleteStep')}\n >\n <Trash2 size={14} />\n </button>\n </div>\n )}\n </div>\n </div>\n ))\n )}\n </div>\n </div>\n\n {/ Step Editor /}\n <div className=\"flex-1 overflow-y-auto p-4 sm:p-6\">\n {selectedStep ? (\n <div className=\"max-w-2xl mx-auto space-y-4 sm:space-y-6\">\n {/ Mobile: Step navigation /}\n {isMobile && steps.length > 1 && (\n <div className=\"flex items-center justify-between bg-bg-sunken/50 rounded-lg p-2 mb-4\">\n <button\n type=\"button\"\n onClick={() => {\n const currentIndex = steps.findIndex((s) => s.id === selectedStep.id);\n if (currentIndex > 0) {\n selectStep(steps[currentIndex - 1]);\n }\n }}\n disabled={steps.findIndex((s) => s.id === selectedStep.id) === 0}\n className=\"p-2 min-h-[44px] min-w-[44px] hover:bg-accent rounded-md disabled:opacity-30\"\n aria-label={tr('stepEditor.previousStep')}\n >\n <ChevronLeft size={20} />\n </button>\n <span className=\"text-sm text-text-secondary\">\n {tr('stepEditor.stepNumber')}{' '}\n {steps.findIndex((s) => s.id === selectedStep.id) + 1} {tr('stepEditor.of')}{' '}\n {steps.length}\n </span>\n <button\n type=\"button\"\n onClick={() => {\n const currentIndex = steps.findIndex((s) => s.id === selectedStep.id);\n if (currentIndex < steps.length - 1) {\n selectStep(steps[currentIndex + 1]);\n }\n }}\n disabled={steps.findIndex((s) => s.id === selectedStep.id) === steps.length - 1}\n className=\"p-2 min-h-[44px] min-w-[44px] hover:bg-accent rounded-md disabled:opacity-30\"\n aria-label={tr('stepEditor.nextStep')}\n >\n <ChevronRight size={20} />\n </button>\n </div>\n )}\n\n <h2 className=\"text-lg sm:text-xl font-semibold\">{tr('stepEditor.editStep')}</h2>\n\n {/ Title /}\n <div>\n <label className=\"block text-sm font-medium mb-2\" htmlFor=\"step-editor-title\">\n {tr('stepEditor.stepTitle')} \n </label>\n <input\n id=\"step-editor-title\"\n type=\"text\"\n value={selectedStep.title}\n onChange={(e) => updateStepField(selectedStep.id, 'title', e.target.value)}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm sm:text-base\"\n placeholder={tr('stepEditor.stepTitlePlaceholder')}\n aria-label={tr('stepEditor.stepTitle')}\n />\n </div>\n\n {/* Content /}\n <div>\n <label className=\"block text-sm font-medium mb-2\" htmlFor=\"step-editor-content\">\n {tr('stepEditor.content')} \n </label>\n <textarea\n id=\"step-editor-content\"\n value={selectedStep.content}\n onChange={(e) => updateStepField(selectedStep.id, 'content', e.target.value)}\n rows={4}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm sm:text-base resize-y min-h-[100px]\"\n placeholder={tr('stepEditor.contentPlaceholder')}\n aria-label={tr('stepEditor.content')}\n />\n </div>\n\n {/* Selector /}\n <div>\n <label\n className=\"block text-sm font-medium mb-2\"\n htmlFor=\"step-editor-css-selector\"\n >\n {tr('stepEditor.cssSelector')} \n <span className=\"text-text-secondary font-normal ml-2\">\n ({tr('stepEditor.targetElement')})\n </span>\n </label>\n <input\n id=\"step-editor-css-selector\"\n type=\"text\"\n value={selectedStep.targetSelector \|\| ''}\n onChange={(e) =>\n updateStepField(selectedStep.id, 'targetSelector', e.target.value)\n }\n placeholder={tr('stepEditor.cssSelectorPlaceholder')}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface font-mono text-sm\"\n aria-label=\"{tr('stepEditor.cssSelector')} \n \n ({tr('stepEditor.targetElement')})\"\n />\n <p className=\"text-xs text-text-secondary mt-1\">\n {tr('stepEditor.dataTourHint')}\n </p>\n </div>\n\n {/ Placement /}\n <div>\n <label className=\"block text-sm font-medium mb-2\" htmlFor=\"step-editor-placement\">\n {tr('stepEditor.tooltipPlacement')}\n </label>\n <select\n id=\"step-editor-placement\"\n value={selectedStep.placement}\n onChange={(e) => updateStepField(selectedStep.id, 'placement', e.target.value)}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm sm:text-base\"\n aria-label={tr('stepEditor.tooltipPlacement')}\n >\n <option value=\"AUTO\">{tr('stepEditor.placementAuto')}</option>\n <option value=\"TOP\">{tr('stepEditor.placementTop')}</option>\n <option value=\"BOTTOM\">{tr('stepEditor.placementBottom')}</option>\n <option value=\"LEFT\">{tr('stepEditor.placementLeft')}</option>\n <option value=\"RIGHT\">{tr('stepEditor.placementRight')}</option>\n <option value=\"CENTER\">{tr('stepEditor.placementCenter')}</option>\n </select>\n </div>\n\n {/ Device-specific selectors /}\n <details className=\"border border-border-subtle rounded-md\">\n <summary className=\"px-4 py-3 cursor-pointer font-medium text-sm hover:bg-accent/50 rounded-t-md\">\n {tr('stepEditor.deviceSpecificSelectors')}\n </summary>\n <div className=\"p-4 pt-0 space-y-3 border-t border-border-subtle\">\n <p className=\"text-xs text-text-secondary mb-3\">\n {tr('stepEditor.deviceSelectorHint')}\n </p>\n <div>\n <label\n className=\"block text-xs font-medium mb-1\"\n htmlFor=\"step-editor-mobile-selector\"\n >\n {tr('stepEditor.mobileSelector')}\n </label>\n <input\n id=\"step-editor-mobile-selector\"\n type=\"text\"\n value={selectedStep.targetSelectorMobile \|\| ''}\n onChange={(e) =>\n updateStepField(selectedStep.id, 'targetSelectorMobile', e.target.value)\n }\n placeholder={tr('stepEditor.leaveEmptyDefault')}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono\"\n aria-label={tr('stepEditor.mobileSelector')}\n />\n </div>\n <div>\n <label\n className=\"block text-xs font-medium mb-1\"\n htmlFor=\"step-editor-tablet-selector\"\n >\n {tr('stepEditor.tabletSelector')}\n </label>\n <input\n id=\"step-editor-tablet-selector\"\n type=\"text\"\n value={selectedStep.targetSelectorTablet \|\| ''}\n onChange={(e) =>\n updateStepField(selectedStep.id, 'targetSelectorTablet', e.target.value)\n }\n placeholder={tr('stepEditor.leaveEmptyDefault')}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono\"\n aria-label={tr('stepEditor.tabletSelector')}\n />\n </div>\n <div>\n <label\n className=\"block text-xs font-medium mb-1\"\n htmlFor=\"step-editor-desktop-selector\"\n >\n {tr('stepEditor.desktopSelector')}\n </label>\n <input\n id=\"step-editor-desktop-selector\"\n type=\"text\"\n value={selectedStep.targetSelectorDesktop \|\| ''}\n onChange={(e) =>\n updateStepField(selectedStep.id, 'targetSelectorDesktop', e.target.value)\n }\n placeholder={tr('stepEditor.leaveEmptyDefault')}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono\"\n aria-label={tr('stepEditor.desktopSelector')}\n />\n </div>\n </div>\n </details>\n\n <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2\">\n <label className=\"flex items-center gap-3 cursor-pointer rounded-md border border-border-subtle p-3\">\n <input\n type=\"checkbox\"\n checked={selectedStep.requireInteraction ?? false}\n onChange={(e) =>\n updateStepField(selectedStep.id, 'requireInteraction', e.target.checked)\n }\n className=\"size-4 rounded\"\n aria-label=\"Require interaction\"\n />\n <div>\n <div className=\"text-sm font-medium\">Require interaction</div>\n <div className=\"text-xs text-text-secondary\">\n User must interact with the highlighted element before advancing.\n </div>\n </div>\n </label>\n\n <div>\n <label\n className=\"block text-sm font-medium mb-2\"\n htmlFor=\"step-editor-wait-timeout\"\n >\n Wait for timeout (ms)\n </label>\n <input\n id=\"step-editor-wait-timeout\"\n type=\"number\"\n min=\"0\"\n value={selectedStep.waitForTimeout ?? ''}\n onChange={(e) =>\n updateStepField(\n selectedStep.id,\n 'waitForTimeout',\n e.target.value ? Number(e.target.value) : undefined\n )\n }\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm\"\n placeholder=\"1500\"\n aria-label=\"Wait for timeout (ms)\"\n />\n </div>\n </div>\n\n {/ Advanced: step timing / skip conditions / analytics tags — collapse the long-tail knobs */}\n <OptionalFields\n title=\"Advanced settings\"\n description=\"Step-timing waits, skip conditions, and analytics tags.\"\n >\n <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2\">\n <div>\n <label\n className=\"block text-sm font-medium mb-2\"\n htmlFor=\"step-editor-wait-selector\"\n >\n Wait for selector\n </label>\n <input\n id=\"step-editor-wait-selector\"\n type=\"text\"\n value={selectedStep.waitForSelector \|\| ''}\n onChange={(e) =>\n updateStepField(\n selectedStep.id,\n 'waitForSelector',\n e.target.value \|\| undefined\n )\n }\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono\"\n placeholder=\"[data-tour='agents-tabs']\"\n aria-label=\"Wait for selector\"\n />\n </div>\n\n <div>\n <label\n className=\"block text-sm font-medium mb-2\"\n htmlFor=\"step-editor-wait-event\"\n >\n Wait for event\n </label>\n <input\n id=\"step-editor-wait-event\"\n type=\"text\"\n value={selectedStep.waitForEvent \|\| ''}\n onChange={(e) =>\n updateStepField(\n selectedStep.id,\n 'waitForEvent',\n e.target.value \|\| undefined\n )\n }\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm\"\n placeholder=\"tour:ready\"\n aria-label=\"Wait for event\"\n />\n </div>\n </div>\n\n <div className=\"mt-4\">\n <label\n className=\"block text-sm font-medium mb-2\"\n htmlFor=\"step-editor-skip-conditions\"\n >\n Skip conditions (JSON)\n </label>\n <textarea\n id=\"step-editor-skip-conditions\"\n value={\n selectedStep.skipConditions\n ? JSON.stringify(selectedStep.skipConditions, null, 2)\n : ''\n }\n onChange={(e) => {\n const rawValue = e.target.value.trim();\n if (!rawValue) {\n updateStepField(selectedStep.id, 'skipConditions', undefined);\n return;\n }\n\n try {\n updateStepField(selectedStep.id, 'skipConditions', JSON.parse(rawValue));\n } catch {\n updateStepField(selectedStep.id, 'skipConditions', rawValue);\n }\n }}\n rows={4}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm font-mono\"\n placeholder='{\"selectorMissing\":\"[data-tour=\\\"missing\\\"]\"}'\n aria-label=\"Skip conditions (JSON)\"\n />\n </div>\n </OptionalFields>\n\n <GlassCard treatment=\"plain\" className=\"p-4 space-y-4 border-border-seam\">\n <div className=\"flex items-center gap-2\">\n <Paperclip size={18} />\n <h3 className=\"text-sm font-semibold\">Step media</h3>\n </div>\n\n {selectedStep.media && selectedStep.media.length > 0 ? (\n <div className=\"space-y-2\">\n {selectedStep.media.map((item) => (\n <div\n key={item.id}\n className=\"flex items-center justify-between rounded-md border border-border-subtle p-2 text-sm\"\n >\n <div>\n <div className=\"font-medium\">{item.media.name}</div>\n <div className=\"text-xs text-text-secondary\">{item.position}</div>\n </div>\n <span className=\"text-xs text-text-secondary\">{item.media.type}</span>\n </div>\n ))}\n </div>\n ) : (\n <p className=\"text-sm text-text-secondary\">\n No media attached to this step yet.\n </p>\n )}\n\n <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-[minmax(0,1fr)_160px_auto]\">\n <select\n value={attachmentMediaId}\n onChange={(e) => setAttachmentMediaId(e.target.value)}\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm\"\n aria-label=\"Select media to attach\"\n >\n <option value=\"\">\n {mediaLoading ? 'Loading media...' : 'Select uploaded media'}\n </option>\n {media.map((item) => (\n <option key={item.id} value={item.id}>\n {item.name} ({item.type})\n </option>\n ))}\n </select>\n\n <select\n value={attachmentPosition}\n onChange={(e) =>\n setAttachmentPosition(e.target.value as 'header' \| 'body' \| 'footer')\n }\n className=\"w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-sm\"\n aria-label=\"Attachment position\"\n >\n <option value=\"header\">Header</option>\n <option value=\"body\">Body</option>\n <option value=\"footer\">Footer</option>\n </select>\n\n <button\n type=\"button\"\n onClick={handleAttachMedia}\n disabled={attachingMedia \|\| !attachmentMediaId}\n className=\"px-4 py-2 min-h-[44px] border border-border-subtle rounded-md hover:bg-accent disabled:opacity-50\"\n >\n Attach\n </button>\n </div>\n </GlassCard>\n </div>\n ) : (\n <div className=\"flex items-center justify-center h-full\">\n <IllustratedEmptyState\n illustration={steps.length > 0 ? 'empty-generic' : 'onboarding'}\n title={tr('stepEditor.emptyTitle')}\n description={\n steps.length > 0\n ? tr('stepEditor.selectStepToEdit')\n : tr('stepEditor.createFirstStep')\n }\n action={\n steps.length === 0 && canCreateStep ? (\n <Button type=\"button\" onClick={handleAddStep} className=\"min-h-[44px]\">\n <Plus size={18} />\n {tr('stepEditor.addFirstStep')}\n </Button>\n ) : undefined\n }\n />\n </div>\n )}\n </div>\n </div>\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/tours/pages/SystemAnalyticsPage.js CHANGED Viewed

@@ -5,157 +5,167 @@ import { formatNumber as r, formatPercentage as i } from "../utils/index.js";
 import { useCallback as a } from "react";
 import { BarChart3 as o, Compass as s, Eye as c, Globe as l, TrendingUp as u } from "lucide-react";
 import { jsx as d, jsxs as f } from "react/jsx-runtime";
-import { GlassCard as p } from "@burdenoff/fe-libs/ui";
-import { useI18n as m } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { EmphasisPanel as p, GlassCard as m, IllustratedEmptyState as h, PagePurpose as g } from "@burdenoff/fe-libs/ui";
+import { useI18n as _ } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 //#region src/tours/pages/SystemAnalyticsPage.tsx
-function h() {
-	let { t: h } = m(), g = a((e, t) => {
-		let n = h(e);
+function v() {
+	let { t: v } = _(), y = a((e, t) => {
+		let n = v(e);
 		return n === e ? t : n;
-	}, [h]), { hasPermission: _, isLoading: v } = t(), y = _(n.TOUR_ANALYTICS_READ), { data: b, loading: x } = e({ skip: v || !y });
-	if (!v && !y) return /* @__PURE__ */ d("div", {
+	}, [v]), { hasPermission: b, isLoading: x } = t(), S = b(n.TOUR_ANALYTICS_READ), { data: C, loading: w } = e({ skip: x || !S });
+	if (!x && !S) return /* @__PURE__ */ d("div", {
 		className: "flex items-center justify-center h-full p-3 sm:p-6",
 		children: /* @__PURE__ */ f("div", {
 			className: "text-center",
 			children: [/* @__PURE__ */ d("h2", {
 				className: "text-lg font-semibold text-text-primary mb-2",
-				children: g("systemAnalytics.accessDenied", "Access Denied")
+				children: y("systemAnalytics.accessDenied", "Access Denied")
 			}), /* @__PURE__ */ d("p", {
 				className: "text-sm text-text-secondary",
-				children: g("systemAnalytics.noPermission", "You do not have permission to view system analytics.")
+				children: y("systemAnalytics.noPermission", "You do not have permission to view system analytics.")
 			})]
 		})
 	});
-	if (x) return /* @__PURE__ */ d("div", {
+	if (w) return /* @__PURE__ */ d("div", {
 		className: "flex items-center justify-center h-full",
 		children: /* @__PURE__ */ d("p", {
 			className: "text-text-secondary",
-			children: g("systemAnalytics.loading", "Loading analytics...")
+			children: y("systemAnalytics.loading", "Loading analytics...")
 		})
 	});
-	let S = b?.workspaceAnalyticsSummary;
-	return S ? /* @__PURE__ */ f("div", {
+	let T = C?.workspaceAnalyticsSummary;
+	return T ? /* @__PURE__ */ f("div", {
 		className: "space-y-4 sm:space-y-6 p-3 sm:p-6",
-		children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("h1", {
-			className: "text-xl sm:text-2xl font-bold",
-			children: g("systemAnalytics.title", "System Analytics")
-		}), /* @__PURE__ */ d("p", {
-			className: "text-sm text-text-secondary",
-			children: g("systemAnalytics.subtitle", "Workspace-wide tour performance overview")
-		})] }), /* @__PURE__ */ f("div", {
-			className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-5 gap-4",
-			children: [
-				/* @__PURE__ */ f(p, {
-					treatment: "glass",
-					className: "p-4",
+		children: [
+			/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("h1", {
+				className: "text-xl sm:text-2xl font-bold",
+				children: y("systemAnalytics.title", "System Analytics")
+			}), /* @__PURE__ */ d("p", {
+				className: "text-sm text-text-secondary",
+				children: y("systemAnalytics.subtitle", "Workspace-wide tour performance overview")
+			})] }),
+			/* @__PURE__ */ d(g, { children: y("systemAnalytics.purpose", "Get the big-picture health of onboarding across the whole workspace: how many tours exist, how many are live, total reach, and the overall completion rate. Use it to judge whether your guided experiences are actually landing.") }),
+			/* @__PURE__ */ d(p, {
+				className: "p-4 sm:p-6",
+				children: /* @__PURE__ */ f("div", {
+					className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between",
 					children: [/* @__PURE__ */ f("div", {
-						className: "flex items-center gap-3 mb-2",
+						className: "flex items-center gap-3",
 						children: [/* @__PURE__ */ d("div", {
 							className: "p-2 bg-action-primary-bg/10 rounded-md",
-							children: /* @__PURE__ */ d(s, {
+							children: /* @__PURE__ */ d(o, {
 								className: "text-primary",
-								size: 20
+								size: 24
 							})
-						}), /* @__PURE__ */ d("span", {
+						}), /* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("div", {
 							className: "text-sm text-text-secondary",
-							children: g("systemAnalytics.totalTours", "Total Tours")
-						})]
-					}), /* @__PURE__ */ d("div", {
-						className: "text-2xl font-bold tabular-nums",
-						children: r(S.totalTours)
+							children: y("systemAnalytics.completionRate", "Completion Rate")
+						}), /* @__PURE__ */ d("div", {
+							className: "text-3xl font-bold tabular-nums",
+							children: i(T.overallCompletionRate)
+						})] })]
+					}), /* @__PURE__ */ d("p", {
+						className: "text-sm text-text-secondary sm:max-w-xs",
+						children: y("systemAnalytics.completionRateHint", "The share of started tours that users finished across this workspace.")
 					})]
-				}),
-				/* @__PURE__ */ f(p, {
-					treatment: "metric",
-					className: "p-4",
-					children: [/* @__PURE__ */ f("div", {
-						className: "flex items-center gap-3 mb-2",
-						children: [/* @__PURE__ */ d("div", {
-							className: "p-2 bg-success/10 rounded-md",
-							children: /* @__PURE__ */ d(l, {
-								className: "text-success",
-								size: 20
-							})
-						}), /* @__PURE__ */ d("span", {
-							className: "text-sm text-text-secondary",
-							children: g("systemAnalytics.publishedTours", "Published Tours")
+				})
+			}),
+			/* @__PURE__ */ f("div", {
+				className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4",
+				children: [
+					/* @__PURE__ */ f(m, {
+						treatment: "glass",
+						className: "p-4",
+						children: [/* @__PURE__ */ f("div", {
+							className: "flex items-center gap-3 mb-2",
+							children: [/* @__PURE__ */ d("div", {
+								className: "p-2 bg-action-primary-bg/10 rounded-md",
+								children: /* @__PURE__ */ d(s, {
+									className: "text-primary",
+									size: 20
+								})
+							}), /* @__PURE__ */ d("span", {
+								className: "text-sm text-text-secondary",
+								children: y("systemAnalytics.totalTours", "Total Tours")
+							})]
+						}), /* @__PURE__ */ d("div", {
+							className: "text-2xl font-bold tabular-nums",
+							children: r(T.totalTours)
 						})]
-					}), /* @__PURE__ */ d("div", {
-						className: "text-2xl font-bold tabular-nums",
-						children: r(S.publishedTours)
-					})]
-				}),
-				/* @__PURE__ */ f(p, {
-					treatment: "metric",
-					className: "p-4",
-					children: [/* @__PURE__ */ f("div", {
-						className: "flex items-center gap-3 mb-2",
-						children: [/* @__PURE__ */ d("div", {
-							className: "p-2 bg-info/10 rounded-md",
-							children: /* @__PURE__ */ d(c, {
-								className: "text-info",
-								size: 20
-							})
-						}), /* @__PURE__ */ d("span", {
-							className: "text-sm text-text-secondary",
-							children: g("systemAnalytics.totalViews", "Total Views")
+					}),
+					/* @__PURE__ */ f(m, {
+						treatment: "metric",
+						className: "p-4",
+						children: [/* @__PURE__ */ f("div", {
+							className: "flex items-center gap-3 mb-2",
+							children: [/* @__PURE__ */ d("div", {
+								className: "p-2 bg-success/10 rounded-md",
+								children: /* @__PURE__ */ d(l, {
+									className: "text-success",
+									size: 20
+								})
+							}), /* @__PURE__ */ d("span", {
+								className: "text-sm text-text-secondary",
+								children: y("systemAnalytics.publishedTours", "Published Tours")
+							})]
+						}), /* @__PURE__ */ d("div", {
+							className: "text-2xl font-bold tabular-nums",
+							children: r(T.publishedTours)
 						})]
-					}), /* @__PURE__ */ d("div", {
-						className: "text-2xl font-bold tabular-nums",
-						children: r(S.totalViews)
-					})]
-				}),
-				/* @__PURE__ */ f(p, {
-					treatment: "metric",
-					className: "p-4",
-					children: [/* @__PURE__ */ f("div", {
-						className: "flex items-center gap-3 mb-2",
-						children: [/* @__PURE__ */ d("div", {
-							className: "p-2 bg-warning/10 rounded-md",
-							children: /* @__PURE__ */ d(u, {
-								className: "text-warning",
-								size: 20
-							})
-						}), /* @__PURE__ */ d("span", {
-							className: "text-sm text-text-secondary",
-							children: g("systemAnalytics.totalCompletions", "Total Completions")
+					}),
+					/* @__PURE__ */ f(m, {
+						treatment: "metric",
+						className: "p-4",
+						children: [/* @__PURE__ */ f("div", {
+							className: "flex items-center gap-3 mb-2",
+							children: [/* @__PURE__ */ d("div", {
+								className: "p-2 bg-info/10 rounded-md",
+								children: /* @__PURE__ */ d(c, {
+									className: "text-info",
+									size: 20
+								})
+							}), /* @__PURE__ */ d("span", {
+								className: "text-sm text-text-secondary",
+								children: y("systemAnalytics.totalViews", "Total Views")
+							})]
+						}), /* @__PURE__ */ d("div", {
+							className: "text-2xl font-bold tabular-nums",
+							children: r(T.totalViews)
 						})]
-					}), /* @__PURE__ */ d("div", {
-						className: "text-2xl font-bold tabular-nums",
-						children: r(S.totalCompletions)
-					})]
-				}),
-				/* @__PURE__ */ f(p, {
-					treatment: "metric",
-					className: "p-4",
-					children: [/* @__PURE__ */ f("div", {
-						className: "flex items-center gap-3 mb-2",
-						children: [/* @__PURE__ */ d("div", {
-							className: "p-2 bg-action-primary-bg/10 rounded-md",
-							children: /* @__PURE__ */ d(o, {
-								className: "text-primary",
-								size: 20
-							})
-						}), /* @__PURE__ */ d("span", {
-							className: "text-sm text-text-secondary",
-							children: g("systemAnalytics.completionRate", "Completion Rate")
+					}),
+					/* @__PURE__ */ f(m, {
+						treatment: "metric",
+						className: "p-4",
+						children: [/* @__PURE__ */ f("div", {
+							className: "flex items-center gap-3 mb-2",
+							children: [/* @__PURE__ */ d("div", {
+								className: "p-2 bg-warning/10 rounded-md",
+								children: /* @__PURE__ */ d(u, {
+									className: "text-warning",
+									size: 20
+								})
+							}), /* @__PURE__ */ d("span", {
+								className: "text-sm text-text-secondary",
+								children: y("systemAnalytics.totalCompletions", "Total Completions")
+							})]
+						}), /* @__PURE__ */ d("div", {
+							className: "text-2xl font-bold tabular-nums",
+							children: r(T.totalCompletions)
 						})]
-					}), /* @__PURE__ */ d("div", {
-						className: "text-2xl font-bold tabular-nums",
-						children: i(S.overallCompletionRate)
-					})]
-				})
-			]
-		})]
+					})
+				]
+			})
+		]
 	}) : /* @__PURE__ */ d("div", {
-		className: "flex items-center justify-center h-full",
-		children: /* @__PURE__ */ d("p", {
-			className: "text-text-secondary",
-			children: g("systemAnalytics.noData", "No analytics data available")
+		className: "p-3 sm:p-6",
+		children: /* @__PURE__ */ d(h, {
+			illustration: "empty-data",
+			title: y("systemAnalytics.noData", "No analytics data available"),
+			description: y("systemAnalytics.noDataHint", "Workspace-wide tour metrics appear once you have published tours and users have started seeing them. Publish a tour to begin collecting data.")
 		})
 	});
 }
 //#endregion
-export { h as SystemAnalyticsPage };
+export { v as SystemAnalyticsPage };
 //# sourceMappingURL=SystemAnalyticsPage.js.map

package/dist/tours/pages/SystemAnalyticsPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SystemAnalyticsPage.js","names":[],"sources":["../../../src/tours/pages/SystemAnalyticsPage.tsx"],"sourcesContent":["import { useCallback } from 'react';\nimport { Compass, Globe, Eye, TrendingUp, BarChart3 } from 'lucide-react';\nimport { GlassCard } from '@burdenoff/fe-libs/ui';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useGetWorkspaceAnalyticsSummaryQuery } from '../../generated/global-operations';\nimport { useToursPermissionAccess } from '../hooks/useToursPermissionAccess';\nimport { TOUR_PERMISSIONS } from '../../constants/permissions';\nimport { formatNumber, formatPercentage } from '../utils';\n\n/*\n System-wide analytics page\n * Displays workspace-level tour analytics summary (no tourId needed)\n /\nexport function SystemAnalyticsPage() {\n const { t } = useI18n();\n const tr = useCallback(\n (key: string, fallback: string): string => {\n const value = t(key);\n return value === key ? fallback : value;\n },\n [t]\n );\n\n const { hasPermission, isLoading: permissionsLoading } = useToursPermissionAccess();\n const canViewAnalytics = hasPermission(TOUR_PERMISSIONS.TOUR_ANALYTICS_READ);\n\n const { data, loading } = useGetWorkspaceAnalyticsSummaryQuery({\n skip: permissionsLoading \|\| !canViewAnalytics,\n });\n\n if (!permissionsLoading && !canViewAnalytics) {\n return (\n <div className=\"flex items-center justify-center h-full p-3 sm:p-6\">\n <div className=\"text-center\">\n <h2 className=\"text-lg font-semibold text-text-primary mb-2\">\n {tr('systemAnalytics.accessDenied', 'Access Denied')}\n </h2>\n <p className=\"text-sm text-text-secondary\">\n {tr(\n 'systemAnalytics.noPermission',\n 'You do not have permission to view system analytics.'\n )}\n </p>\n </div>\n </div>\n );\n }\n\n if (loading) {\n return (\n <div className=\"flex items-center justify-center h-full\">\n <p className=\"text-text-secondary\">\n {tr('systemAnalytics.loading', 'Loading analytics...')}\n </p>\n </div>\n );\n }\n\n const summary = data?.workspaceAnalyticsSummary;\n\n if (!summary) {\n return (\n <div className=\"~~flex items~~-~~center~~ ~~justify~~-~~center h-full~~\">\n <~~p className~~=\"~~text~~-~~text-secondary~~\">\n {tr('systemAnalytics.noData', 'No analytics data available')}\n ~~</p>\~~n </div>\n );\n }\n\n return (\n <div className=\"space-y-4 sm:space-y-6 p-3 sm:p-6\">\n {/ Header /}\n <div>\n <h1 className=\"text-xl sm:text-2xl font-bold\">\n {tr('systemAnalytics.title', 'System Analytics')}\n </h1>\n <p className=\"text-sm text-text-secondary\">\n {tr('systemAnalytics.subtitle', 'Workspace-wide tour performance overview')}\n </p>\n </div>\n\n {/ ~~Summary~~ ~~Cards~~ */}\n <~~div~~ className=\"~~grid grid~~-~~cols-1~~ sm:~~grid~~-~~cols-2 lg:grid-cols-5 gap-4~~\">\n <~~GlassCard~~ ~~treatment~~=\"~~glass\"~~ ~~className=\"p~~-4\">\n <div className=\"flex items-center gap-3 ~~mb-2~~\">\n <div className=\"p-2 bg-action-primary-bg/10 rounded-md\">\n <~~Compass~~ className=\"text-primary\" size={20} />\n </div>\n <~~span~~ className=\"text-sm text-text-secondary\">\n {tr('systemAnalytics.~~totalTours~~', '~~Total~~ ~~Tours~~')}\n </~~span>\n </~~div>\n <div className=\"text-~~2xl~~ font-bold tabular-nums\">{~~formatNumber~~(summary.~~totalTours~~)}</div>\n </~~GlassCard~~>\n\n <GlassCard treatment=\"~~metric~~\" className=\"p-4\">\n <div className=\"flex items-center gap-3 mb-2\">\n <div className=\"p-2 bg-~~success~~/10 rounded-md\">\n <~~Globe~~ className=\"text-~~success~~\" size={20} />\n </div>\n <span className=\"text-sm text-text-secondary\">\n {tr('systemAnalytics.~~publishedTours~~', '~~Published~~ Tours')}\n </span>\n </div>\n <div className=\"text-2xl font-bold tabular-nums\"~~>\n~~ {formatNumber(summary.~~publishedTours~~)}\n </div>\n </GlassCard>\n\n <GlassCard treatment=\"metric\" className=\"p-4\">\n <div className=\"flex items-center gap-3 mb-2\">\n <div className=\"p-2 bg-~~info~~/10 rounded-md\">\n <~~Eye~~ className=\"text-~~info~~\" size={20} />\n </div>\n <span className=\"text-sm text-text-secondary\">\n {tr('systemAnalytics.~~totalViews~~', '~~Total~~ ~~Views~~')}\n </span>\n </div>\n <div className=\"text-2xl font-bold tabular-nums\">{formatNumber(summary.~~totalViews~~)}</div>\n </GlassCard>\n\n <GlassCard treatment=\"metric\" className=\"p-4\">\n <div className=\"flex items-center gap-3 mb-2\">\n <div className=\"p-2 bg-~~warning~~/10 rounded-md\">\n <~~TrendingUp~~ className=\"text-~~warning~~\" size={20} />\n </div>\n <span className=\"text-sm text-text-secondary\">\n {tr('systemAnalytics.~~totalCompletions~~', 'Total ~~Completions~~')}\n </span>\n </div>\n <div className=\"text-2xl font-bold tabular-nums\"~~>\n~~ {formatNumber(summary.~~totalCompletions~~)}\n </div>\n </GlassCard>\n\n <GlassCard treatment=\"metric\" className=\"p-4\">\n <div className=\"flex items-center gap-3 mb-2\">\n <div className=\"p-2 bg-~~action-primary-bg~~/10 rounded-md\">\n <~~BarChart3~~ className=\"text-~~primary~~\" size={20} />\n </div>\n <span className=\"text-sm text-text-secondary\">\n {tr('systemAnalytics.~~completionRate~~', '~~Completion~~ ~~Rate~~')}\n </span>\n </div>\n <div className=\"text-2xl font-bold tabular-nums\">\n {~~formatPercentage~~(summary.~~overallCompletionRate~~)}\n </div>\n </GlassCard>\n </div>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;AAaA,SAAgB,IAAsB;CACpC,IAAM,EAAE,SAAM,GAAS,EACjB,IAAK,GACR,GAAa,MAA6B;EACzC,IAAM,IAAQ,EAAE,EAAI;AACpB,SAAO,MAAU,IAAM,IAAW;IAEpC,CAAC,EAAE,CACJ,EAEK,EAAE,kBAAe,WAAW,MAAuB,GAA0B,EAC7E,IAAmB,EAAc,EAAiB,oBAAoB,EAEtE,EAAE,SAAM,eAAY,EAAqC,EAC7D,MAAM,KAAsB,CAAC,GAC9B,CAAC;AAEF,KAAI,CAAC,KAAsB,CAAC,EAC1B,QACE,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,MAAD;IAAI,WAAU;cACX,EAAG,gCAAgC,gBAAgB;IACjD,CAAA,EACL,kBAAC,KAAD;IAAG,WAAU;cACV,EACC,gCACA,uDACD;IACC,CAAA,CACA;;EACF,CAAA;AAIV,KAAI,EACF,QACE,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,KAAD;GAAG,WAAU;aACV,EAAG,2BAA2B,uBAAuB;GACpD,CAAA;EACA,CAAA;CAIV,IAAM,IAAU,GAAM;~~AAYtB~~,~~QAVK~~,~~IAWH~~,kBAAC,OAAD;EAAK,WAAU;YAAf,~~CAEE,~~kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,MAAD;~~GAAI~~,WAAU;~~aACX~~,EAAG,yBAAyB,mBAAmB;~~GAC7C~~,CAAA,EACL,kBAAC,KAAD;~~GAAG~~,WAAU;~~aACV~~,EAAG,4BAA4B,2CAA2C;~~GACzE~~,CAAA,CACA,EAAA,CAAA,~~EAGN,~~kBAAC,~~OAAD;GAAK~~,~~WAAU~~;~~aAAf;IACE~~,kBAAC,GAAD;~~KAAW~~,WAAU;~~KAAQ~~,WAAU;~~eAAvC~~,CACE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,OAAD;OAAK,WAAU;iBACb,kBAAC,GAAD;~~QAAS~~,WAAU;QAAe,MAAM;QAAM,CAAA;~~OAC1C~~,CAAA,EACN,kBAAC,~~QAAD~~;~~OAAM~~,WAAU;~~iBACb~~,EAAG,~~8BAA8B~~,~~cAAc~~;~~OAC3C~~,CAAA,~~CACH;SACN~~,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBAAmC~~,~~EAAa~~,EAAQ,~~WAAW~~;~~MAAO~~,CAAA,~~CAC/E~~;;~~IAEZ~~,kBAAC,GAAD;~~KAAW~~,WAAU;~~KAAS~~,WAAU;~~eAAxC~~,CACE,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBAAf~~,CACE,kBAAC,OAAD;~~OAAK~~,WAAU;~~iBACb~~,kBAAC,GAAD;~~QAAO~~,WAAU;~~QAAe~~,MAAM;~~QAAM~~,CAAA;~~OACxC~~,CAAA,EACN,kBAAC,QAAD;~~OAAM~~,WAAU;~~iBACb~~,EAAG,~~kCAAkC~~,~~kBAAkB~~;~~OACnD~~,CAAA,CACH;~~SACN~~,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBACZ~~,EAAa,EAAQ,~~eAAe~~;~~MACjC~~,CAAA,~~CACI~~;;~~IAEZ~~,kBAAC,GAAD;~~KAAW~~,WAAU;~~KAAS~~,WAAU;~~eAAxC~~,CACE,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBAAf~~,CACE,kBAAC,OAAD;~~OAAK~~,WAAU;~~iBACb~~,kBAAC,GAAD;~~QAAK~~,WAAU;~~QAAY~~,MAAM;~~QAAM~~,CAAA;~~OACnC~~,CAAA,EACN,kBAAC,QAAD;~~OAAM~~,WAAU;~~iBACb~~,EAAG,~~8BAA8B~~,~~cAAc~~;~~OAC3C~~,CAAA,CACH;~~SACN~~,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBAAmC~~,EAAa,EAAQ,~~WAAW~~;~~MAAO~~,CAAA,~~CAC/E~~;;~~IAEZ~~,kBAAC,GAAD;~~KAAW~~,WAAU;~~KAAS~~,WAAU;~~eAAxC~~,CACE,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBAAf~~,CACE,kBAAC,OAAD;~~OAAK~~,WAAU;~~iBACb~~,kBAAC,GAAD;~~QAAY~~,WAAU;~~QAAe~~,MAAM;~~QAAM~~,CAAA;~~OAC7C~~,CAAA,EACN,kBAAC,QAAD;~~OAAM~~,WAAU;~~iBACb~~,EAAG,~~oCAAoC~~,~~oBAAoB~~;~~OACvD~~,CAAA,CACH;~~SACN~~,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBACZ~~,EAAa,EAAQ,~~iBAAiB~~;~~MACnC~~,CAAA,~~CACI~~;;~~IAEZ~~,kBAAC,GAAD;~~KAAW~~,WAAU;~~KAAS~~,WAAU;~~eAAxC~~,CACE,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBAAf~~,CACE,kBAAC,OAAD;~~OAAK~~,WAAU;~~iBACb~~,kBAAC,GAAD;~~QAAW~~,WAAU;~~QAAe~~,MAAM;~~QAAM~~,CAAA;~~OAC5C~~,CAAA,EACN,kBAAC,QAAD;~~OAAM~~,WAAU;~~iBACb~~,EAAG,~~kCAAkC~~,~~kBAAkB~~;~~OACnD~~,CAAA,CACH;~~SACN~~,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBACZ~~,~~EAAiB~~,EAAQ,~~sBAAsB~~;~~MAC5C~~,CAAA,CACI;;~~IACR~~;~~KACF;MAxFJ~~,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,~~KAAD~~;~~GAAG~~,~~WAAU~~;~~aACV~~,EAAG,0BAA0B,8BAA8B;~~GAC1D~~,CAAA;~~EACA~~,CAAA"}
1	+ {"version":3,"file":"SystemAnalyticsPage.js","names":[],"sources":["../../../src/tours/pages/SystemAnalyticsPage.tsx"],"sourcesContent":["import { useCallback } from 'react';\nimport { Compass, Globe, Eye, TrendingUp, BarChart3 } from 'lucide-react';\nimport { EmphasisPanel, GlassCard, IllustratedEmptyState, PagePurpose } from '@burdenoff/fe-libs/ui';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useGetWorkspaceAnalyticsSummaryQuery } from '../../generated/global-operations';\nimport { useToursPermissionAccess } from '../hooks/useToursPermissionAccess';\nimport { TOUR_PERMISSIONS } from '../../constants/permissions';\nimport { formatNumber, formatPercentage } from '../utils';\n\n/*\n System-wide analytics page\n * Displays workspace-level tour analytics summary (no tourId needed)\n /\nexport function SystemAnalyticsPage() {\n const { t } = useI18n();\n const tr = useCallback(\n (key: string, fallback: string): string => {\n const value = t(key);\n return value === key ? fallback : value;\n },\n [t]\n );\n\n const { hasPermission, isLoading: permissionsLoading } = useToursPermissionAccess();\n const canViewAnalytics = hasPermission(TOUR_PERMISSIONS.TOUR_ANALYTICS_READ);\n\n const { data, loading } = useGetWorkspaceAnalyticsSummaryQuery({\n skip: permissionsLoading \|\| !canViewAnalytics,\n });\n\n if (!permissionsLoading && !canViewAnalytics) {\n return (\n <div className=\"flex items-center justify-center h-full p-3 sm:p-6\">\n <div className=\"text-center\">\n <h2 className=\"text-lg font-semibold text-text-primary mb-2\">\n {tr('systemAnalytics.accessDenied', 'Access Denied')}\n </h2>\n <p className=\"text-sm text-text-secondary\">\n {tr(\n 'systemAnalytics.noPermission',\n 'You do not have permission to view system analytics.'\n )}\n </p>\n </div>\n </div>\n );\n }\n\n if (loading) {\n return (\n <div className=\"flex items-center justify-center h-full\">\n <p className=\"text-text-secondary\">\n {tr('systemAnalytics.loading', 'Loading analytics...')}\n </p>\n </div>\n );\n }\n\n const summary = data?.workspaceAnalyticsSummary;\n\n if (!summary) {\n return (\n <div className=\"p-3 sm:p-6\">\n <IllustratedEmptyState\n illustration=\"empty-data\"\n title={tr('systemAnalytics.noData', 'No analytics data available')}\n description={tr(\n 'systemAnalytics.noDataHint',\n 'Workspace-wide tour metrics appear once you have published tours and users have started seeing them. Publish a tour to begin collecting data.'\n )}\n />\n </div>\n );\n }\n\n return (\n <div className=\"space-y-4 sm:space-y-6 p-3 sm:p-6\">\n {/ Header /}\n <div>\n <h1 className=\"text-xl sm:text-2xl font-bold\">\n {tr('systemAnalytics.title', 'System Analytics')}\n </h1>\n <p className=\"text-sm text-text-secondary\">\n {tr('systemAnalytics.subtitle', 'Workspace-wide tour performance overview')}\n </p>\n </div>\n\n <PagePurpose>\n {tr(\n 'systemAnalytics.purpose',\n 'Get the big-picture health of onboarding across the whole workspace: how many tours exist, how many are live, total reach, and the overall completion rate. Use it to judge whether your guided experiences are actually landing.'\n )}\n </PagePurpose>\n\n {/ Headline KPI — the single emphasis zone on this page. /}\n <EmphasisPanel className=\"p-4 sm:p-6\">\n <div className=\"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between\">\n <div className=\"flex items-center gap-3\">\n <div className=\"p-2 bg-action-primary-bg/10 rounded-md\">\n <BarChart3 className=\"text-primary\" size={24} />\n </div>\n <div>\n <div className=\"text-sm text-text-secondary\">\n {tr('systemAnalytics.completionRate', 'Completion Rate')}\n </div>\n <div className=\"text-3xl font-bold tabular-nums\">\n {formatPercentage(summary.overallCompletionRate)}\n </div>\n </div>\n </div>\n <p className=\"text-sm text-text-secondary sm:max-w-xs\">\n {tr(\n 'systemAnalytics.completionRateHint',\n 'The share of started tours that users finished across this workspace.'\n )}\n </p>\n </div>\n </EmphasisPanel>\n\n {/ Summary Cards */}\n <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4\">\n <GlassCard treatment=\"glass\" className=\"p-4\">\n <div className=\"flex items-center gap-3 mb-2\">\n <div className=\"p-2 bg-action-primary-bg/10 rounded-md\">\n <Compass className=\"text-primary\" size={20} />\n </div>\n <span className=\"text-sm text-text-secondary\">\n {tr('systemAnalytics.totalTours', 'Total Tours')}\n </span>\n </div>\n <div className=\"text-2xl font-bold tabular-nums\">{formatNumber(summary.totalTours)}</div>\n </GlassCard>\n\n <GlassCard treatment=\"metric\" className=\"p-4\">\n <div className=\"flex items-center gap-3 mb-2\">\n <div className=\"p-2 bg-success/10 rounded-md\">\n <Globe className=\"text-success\" size={20} />\n </div>\n <span className=\"text-sm text-text-secondary\">\n {tr('systemAnalytics.publishedTours', 'Published Tours')}\n </span>\n </div>\n <div className=\"text-2xl font-bold tabular-nums\">\n {formatNumber(summary.publishedTours)}\n </div>\n </GlassCard>\n\n <GlassCard treatment=\"metric\" className=\"p-4\">\n <div className=\"flex items-center gap-3 mb-2\">\n <div className=\"p-2 bg-info/10 rounded-md\">\n <Eye className=\"text-info\" size={20} />\n </div>\n <span className=\"text-sm text-text-secondary\">\n {tr('systemAnalytics.totalViews', 'Total Views')}\n </span>\n </div>\n <div className=\"text-2xl font-bold tabular-nums\">{formatNumber(summary.totalViews)}</div>\n </GlassCard>\n\n <GlassCard treatment=\"metric\" className=\"p-4\">\n <div className=\"flex items-center gap-3 mb-2\">\n <div className=\"p-2 bg-warning/10 rounded-md\">\n <TrendingUp className=\"text-warning\" size={20} />\n </div>\n <span className=\"text-sm text-text-secondary\">\n {tr('systemAnalytics.totalCompletions', 'Total Completions')}\n </span>\n </div>\n <div className=\"text-2xl font-bold tabular-nums\">\n {formatNumber(summary.totalCompletions)}\n </div>\n </GlassCard>\n </div>\n </div>\n );\n}\n"],"mappings":"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"}