npm - @burdenoff/microfe-bigconsole - Versions diffs - 2026.1008.11 → 2026.1008.12 - Mend

@burdenoff/microfe-bigconsole 2026.1008.11 → 2026.1008.12

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SettingsPage.js","names":[],"sources":["../../../src/bigconsole/pages/SettingsPage.tsx"],"sourcesContent":["/*\n SettingsPage\n \n BigConsole workspace settings and preferences.\n * Settings are persisted to localStorage until a backend settings API is available.\n /\n\nimport { type FC, memo, useState, useCallback, useEffect } from 'react';\nimport { AuroraBackground, GradientText, PagePurpose, EmphasisPanel } from '@burdenoff/fe-libs/ui';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { Settings, Save, RotateCcw } from 'lucide-react';\n\nimport {\n type BigConsoleSettings,\n DEFAULT_SETTINGS,\n loadBigConsoleSettings,\n saveBigConsoleSettings,\n} from '../hooks/useBigConsoleSettings';\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const SettingsPage: FC = memo(function SettingsPage() {\n const { t } = useI18n();\n const [settings, setSettings] = useState<BigConsoleSettings>(loadBigConsoleSettings);\n const [saved, setSaved] = useState(false);\n const [saveError, setSaveError] = useState(false);\n\n useEffect(() => {\n if (saved) {\n const timer = setTimeout(() => setSaved(false), 2000);\n return () => clearTimeout(timer);\n }\n }, [saved]);\n\n const handleChange = useCallback(<K extends keyof BigConsoleSettings>(key: K, value: BigConsoleSettings[K]) => {\n setSettings((prev) => ({ ...prev, [key]: value }));\n }, []);\n\n const handleSave = useCallback(() => {\n const success = saveBigConsoleSettings(settings);\n setSaved(success);\n setSaveError(!success);\n }, [settings]);\n\n const handleReset = useCallback(() => {\n setSettings({ ...DEFAULT_SETTINGS });\n const success = saveBigConsoleSettings(DEFAULT_SETTINGS);\n setSaved(success);\n setSaveError(!success);\n }, []);\n\n const inputStyle: React.CSSProperties = {\n width: '100%',\n padding: '8px 12px',\n borderRadius: 'var(--radius-button)',\n border: '1px solid var(--color-border)',\n backgroundColor: 'var(--color-bg-canvas)',\n color: 'var(--color-text-primary)',\n fontSize: 'var(--font-size-body-sm)',\n };\n\n const labelStyle: React.CSSProperties = {\n display: 'block',\n fontSize: 'var(--font-size-body-sm)',\n fontWeight: 'var(--font-weight-medium)',\n color: 'var(--color-text-primary)',\n marginBottom: 4,\n };\n\n const descStyle: React.CSSProperties = {\n fontSize: 'var(--font-size-body-sm)',\n color: 'var(--color-text-muted)',\n marginTop: 4,\n };\n\n const sectionStyle: React.CSSProperties = {\n backgroundColor: 'var(--color-bg-surface)',\n border: '1px solid var(--color-border-seam)',\n borderRadius: 'var(--radius-card)',\n padding: 'var(--space-cardPadding)',\n marginBottom: 'var(--space-sectionGap)',\n boxShadow: 'var(--shadow-pop)',\n };\n\n return (\n <div style={{ minHeight: '100vh', backgroundColor: 'var(--color-bg-canvas)' }}>\n <div style={{ padding: 'var(--space-pagePadding)', maxWidth: 1440, margin: '0 auto' }}>\n {/ Header /}\n <div\n className=\"relative overflow-hidden rounded-card border border-border-seam bg-gloss-card p-6\"\n style={{\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n marginBottom: 'var(--space-sectionGap)',\n flexWrap: 'wrap',\n gap: 'var(--space-formGap)',\n }}\n >\n <AuroraBackground intensity=\"subtle\" />\n <div>\n <div style={{ display: 'flex', alignItems: 'center', gap: 'var(--space-iconGap)' }}>\n <Settings size={24} style={{ color: 'var(--color-text-primary)' }} />\n <h1\n style={{\n fontSize: 'var(--font-size-heading-h4)',\n fontWeight: 'var(--font-weight-bold)',\n color: 'var(--color-text-primary)',\n }}\n >\n <GradientText>{t('bigconsole.settings.header.title', 'Settings')}</GradientText>\n </h1>\n </div>\n <p style={{ fontSize: 'var(--font-size-body-md)', color: 'var(--color-text-secondary)', marginTop: 4 }}>\n {t('bigconsole.settings.header.subtitle', 'Configure BigConsole preferences')}\n </p>\n </div>\n <div style={{ display: 'flex', gap: 8 }}>\n <button\n onClick={handleReset}\n style={{\n display: 'flex',\n alignItems: 'center',\n gap: 6,\n padding: '8px 12px',\n borderRadius: 'var(--radius-button)',\n border: '1px solid var(--color-border)',\n backgroundColor: 'transparent',\n color: 'var(--color-text-secondary)',\n fontSize: 'var(--font-size-body-sm)',\n cursor: 'pointer',\n }}\n >\n <RotateCcw size={14} /> {t('bigconsole.settings.actions.reset', 'Reset')}\n </button>\n <button\n onClick={handleSave}\n style={{\n display: 'flex',\n alignItems: 'center',\n gap: 6,\n padding: '8px 16px',\n borderRadius: 'var(--radius-button)',\n backgroundColor: saved ? 'var(--color-status-success-bg)' : 'var(--color-action-primary-bg)',\n color: 'var(--color-action-primary-text)',\n fontWeight: 'var(--font-weight-medium)',\n fontSize: 'var(--font-size-body-sm)',\n border: 'none',\n cursor: 'pointer',\n transition: 'background-color 200ms',\n }}\n >\n <Save size={14} />{' '}\n {saved\n ? t('bigconsole.settings.actions.savedLocally', 'Saved locally')\n : t('bigconsole.settings.actions.saveLocally', 'Save locally')}\n </button>\n </div>\n </div>\n\n {saveError && (\n <p role=\"alert\" className=\"mb-form-gap text-status-error-text\">\n {t('bigconsole.settings.actions.saveError', 'Your browser could not save these preferences. Try again.')}\n </p>\n )}\n <PagePurpose className=\"mb-[var(--space-sectionGap)]\">\n {t(\n 'bigconsole.settings.localDefaultsPurpose',\n 'These browser-local defaults apply when you add dashboard pages, widgets and data sinks. Display preferences update existing widgets in this browser. They do not change existing page layouts, widget refresh schedules or data sink cache settings, and are not shared with your team.'\n )}\n </PagePurpose>\n\n {/ Dashboard Defaults — primary emphasis zone /}\n <EmphasisPanel className=\"mb-[var(--space-sectionGap)] p-[var(--space-cardPadding)]\">\n <h2\n style={{\n fontSize: 'var(--font-size-body-md)',\n fontWeight: 'var(--font-weight-semibold)',\n color: 'var(--color-text-primary)',\n marginBottom: 16,\n }}\n >\n {t('bigconsole.settings.dashboardDefaults.title', 'Dashboard Defaults')}\n </h2>\n <div className=\"grid gap-form-gap md:grid-cols-3\">\n <div>\n <label htmlFor=\"grid-cols\" style={labelStyle}>\n {t('bigconsole.settings.dashboardDefaults.gridColumns.label', 'Grid Columns')}\n </label>\n <input\n id=\"grid-cols\"\n type=\"number\"\n min={4}\n max={24}\n value={settings.defaultGridColumns}\n onChange={(e) =>\n handleChange('defaultGridColumns', Math.min(24, Math.max(4, Number(e.target.value) \|\| 12)))\n }\n style={inputStyle}\n />\n <p style={descStyle}>\n {t(\n 'bigconsole.settings.dashboardDefaults.gridColumns.help',\n 'Number of columns in the dashboard grid (4-24)'\n )}\n </p>\n </div>\n <div>\n <label htmlFor=\"widget-height\" style={labelStyle}>\n {t('bigconsole.settings.dashboardDefaults.widgetHeight.label', 'Default Widget Height')}\n </label>\n <input\n id=\"widget-height\"\n type=\"number\"\n min={2}\n max={12}\n value={settings.defaultWidgetHeight}\n onChange={(e) =>\n handleChange('defaultWidgetHeight', Math.min(12, Math.max(1, Number(e.target.value) \|\| 4)))\n }\n style={inputStyle}\n />\n <p style={descStyle}>\n {t(\n 'bigconsole.settings.dashboardDefaults.widgetHeight.help',\n 'Default height units for new widgets (2-12)'\n )}\n </p>\n </div>\n <div>\n <label htmlFor=\"refresh-interval\" style={labelStyle}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.label', 'Auto-Refresh Interval (seconds)')}\n </label>\n <select\n id=\"refresh-interval\"\n value={settings.defaultRefreshInterval}\n onChange={(e) => handleChange('defaultRefreshInterval', parseInt(e.target.value))}\n style={inputStyle}\n >\n <option value={0}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.disabled', 'Disabled')}\n </option>\n <option value={10}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.seconds10', '10 seconds')}\n </option>\n <option value={30}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.seconds30', '30 seconds')}\n </option>\n <option value={60}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.minute1', '1 minute')}\n </option>\n <option value={300}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.minutes5', '5 minutes')}\n </option>\n <option value={600}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.minutes10', '10 minutes')}\n </option>\n </select>\n <p style={descStyle}>\n {t(\n 'bigconsole.settings.dashboardDefaults.refreshInterval.help',\n 'How often widgets refresh their data automatically'\n )}\n </p>\n </div>\n </div>\n </EmphasisPanel>\n\n {/ Cache Settings /}\n <div style={sectionStyle}>\n <h2\n style={{\n fontSize: 'var(--font-size-body-md)',\n fontWeight: 'var(--font-weight-semibold)',\n color: 'var(--color-text-primary)',\n marginBottom: 16,\n }}\n >\n {t('bigconsole.settings.cache.title', 'Cache')}\n </h2>\n <div className=\"grid gap-form-gap md:grid-cols-2\">\n <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n <div>\n <label style={labelStyle}>{t('bigconsole.settings.cache.enable.label', 'Enable Cache')}</label>\n <p style={descStyle}>\n {t('bigconsole.settings.cache.newSinkHelp', 'Enable caching by default for new data sinks')}\n </p>\n </div>\n <button\n onClick={() => handleChange('cacheEnabled', !settings.cacheEnabled)}\n role=\"switch\"\n aria-checked={settings.cacheEnabled}\n aria-label={t('bigconsole.settings.cache.enable.label', 'Enable Cache')}\n style={{\n width: 44,\n flexShrink: 0,\n height: 24,\n borderRadius: 12,\n backgroundColor: settings.cacheEnabled ? 'var(--color-action-primary-bg)' : 'var(--color-bg-sunken)',\n border: 'none',\n cursor: 'pointer',\n position: 'relative',\n transition: 'background-color 200ms',\n }}\n >\n <div\n style={{\n width: 18,\n height: 18,\n borderRadius: '50%',\n backgroundColor: 'var(--color-action-primary-text)',\n position: 'absolute',\n top: 3,\n left: settings.cacheEnabled ? 23 : 3,\n transition: 'left 200ms',\n }}\n />\n </button>\n </div>\n {settings.cacheEnabled && (\n <div>\n <label htmlFor=\"cache-ttl\" style={labelStyle}>\n {t('bigconsole.settings.cache.ttl.label', 'Cache TTL (seconds)')}\n </label>\n <input\n id=\"cache-ttl\"\n type=\"number\"\n min={30}\n max={3600}\n value={settings.cacheTTLSeconds}\n onChange={(e) =>\n handleChange('cacheTTLSeconds', Math.min(86400, Math.max(0, Number(e.target.value))))\n }\n style={inputStyle}\n />\n <p style={descStyle}>\n {t('bigconsole.settings.cache.ttl.help', 'How long cached data is considered fresh (30-3600)')}\n </p>\n </div>\n )}\n </div>\n </div>\n\n {/ Display Settings */}\n <div style={sectionStyle}>\n <h2\n style={{\n fontSize: 'var(--font-size-body-md)',\n fontWeight: 'var(--font-weight-semibold)',\n color: 'var(--color-text-primary)',\n marginBottom: 16,\n }}\n >\n {t('bigconsole.settings.display.title', 'Display')}\n </h2>\n <div className=\"grid gap-form-gap md:grid-cols-3\">\n <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n <div>\n <label style={labelStyle}>\n {t('bigconsole.settings.display.widgetBorders.label', 'Show Widget Borders')}\n </label>\n <p style={descStyle}>\n {t('bigconsole.settings.display.widgetBorders.help', 'Display borders around widgets in dashboards')}\n </p>\n </div>\n <button\n onClick={() => handleChange('showWidgetBorders', !settings.showWidgetBorders)}\n role=\"switch\"\n aria-checked={settings.showWidgetBorders}\n aria-label={t('bigconsole.settings.display.widgetBorders.label', 'Show Widget Borders')}\n style={{\n width: 44,\n flexShrink: 0,\n height: 24,\n borderRadius: 12,\n backgroundColor: settings.showWidgetBorders\n ? 'var(--color-action-primary-bg)'\n : 'var(--color-bg-sunken)',\n border: 'none',\n cursor: 'pointer',\n position: 'relative',\n transition: 'background-color 200ms',\n }}\n >\n <div\n style={{\n width: 18,\n height: 18,\n borderRadius: '50%',\n backgroundColor: 'var(--color-action-primary-text)',\n position: 'absolute',\n top: 3,\n left: settings.showWidgetBorders ? 23 : 3,\n transition: 'left 200ms',\n }}\n />\n </button>\n </div>\n <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n <div>\n <label style={labelStyle}>{t('bigconsole.settings.display.compactMode.label', 'Compact Mode')}</label>\n <p style={descStyle}>\n {t('bigconsole.settings.display.compactMode.help', 'Reduce padding and spacing for more content')}\n </p>\n </div>\n <button\n onClick={() => handleChange('compactMode', !settings.compactMode)}\n role=\"switch\"\n aria-checked={settings.compactMode}\n aria-label={t('bigconsole.settings.display.compactMode.label', 'Compact Mode')}\n style={{\n width: 44,\n flexShrink: 0,\n height: 24,\n borderRadius: 12,\n backgroundColor: settings.compactMode ? 'var(--color-action-primary-bg)' : 'var(--color-bg-sunken)',\n border: 'none',\n cursor: 'pointer',\n position: 'relative',\n transition: 'background-color 200ms',\n }}\n >\n <div\n style={{\n width: 18,\n height: 18,\n borderRadius: '50%',\n backgroundColor: 'var(--color-action-primary-text)',\n position: 'absolute',\n top: 3,\n left: settings.compactMode ? 23 : 3,\n transition: 'left 200ms',\n }}\n />\n </button>\n </div>\n <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n <div>\n <label style={labelStyle}>{t('bigconsole.settings.display.animations.label', 'Animations')}</label>\n <p style={descStyle}>\n {t('bigconsole.settings.display.animations.help', 'Enable transition animations and effects')}\n </p>\n </div>\n <button\n onClick={() => handleChange('animationsEnabled', !settings.animationsEnabled)}\n role=\"switch\"\n aria-checked={settings.animationsEnabled}\n aria-label={t('bigconsole.settings.display.animations.label', 'Animations')}\n style={{\n width: 44,\n flexShrink: 0,\n height: 24,\n borderRadius: 12,\n backgroundColor: settings.animationsEnabled\n ? 'var(--color-action-primary-bg)'\n : 'var(--color-bg-sunken)',\n border: 'none',\n cursor: 'pointer',\n position: 'relative',\n transition: 'background-color 200ms',\n }}\n >\n <div\n style={{\n width: 18,\n height: 18,\n borderRadius: '50%',\n backgroundColor: 'var(--color-action-primary-text)',\n position: 'absolute',\n top: 3,\n left: settings.animationsEnabled ? 23 : 3,\n transition: 'left 200ms',\n }}\n />\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n );\n});\n\nexport default SettingsPage;\n"],"mappings":"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"}
1	+ {"version":3,"file":"SettingsPage.js","names":[],"sources":["../../../src/bigconsole/pages/SettingsPage.tsx"],"sourcesContent":["/*\n SettingsPage\n \n BigConsole workspace settings and preferences.\n * Settings are persisted to localStorage until a backend settings API is available.\n /\n\nimport { type FC, memo, useState, useCallback, useEffect } from 'react';\nimport { AuroraBackground, GradientText, PagePurpose, EmphasisPanel } from '@burdenoff/fe-libs/ui';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useUnsavedChanges } from '@burdenoff/fe-libs/shared/hooks';\nimport { Settings, Save, RotateCcw } from 'lucide-react';\n\nimport {\n type BigConsoleSettings,\n DEFAULT_SETTINGS,\n loadBigConsoleSettings,\n saveBigConsoleSettings,\n} from '../hooks/useBigConsoleSettings';\nimport { isDirty } from '../utils/formDirty';\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const SettingsPage: FC = memo(function SettingsPage() {\n const { t } = useI18n();\n const [settings, setSettings] = useState<BigConsoleSettings>(loadBigConsoleSettings);\n const [saved, setSaved] = useState(false);\n const [saveError, setSaveError] = useState(false);\n // What is persisted (loaded, or last saved successfully); a failed save leaves it, so the draft stays dirty.\n const [savedSettings, setSavedSettings] = useState<BigConsoleSettings>(settings);\n useUnsavedChanges({\n id: 'bigconsole-settings',\n label: t('bigconsole.assistant.unsaved.settingsPage', 'the settings page'),\n dirty: isDirty(settings, savedSettings),\n });\n\n useEffect(() => {\n if (saved) {\n const timer = setTimeout(() => setSaved(false), 2000);\n return () => clearTimeout(timer);\n }\n }, [saved]);\n\n const handleChange = useCallback(<K extends keyof BigConsoleSettings>(key: K, value: BigConsoleSettings[K]) => {\n setSettings((prev) => ({ ...prev, [key]: value }));\n }, []);\n\n const handleSave = useCallback(() => {\n const success = saveBigConsoleSettings(settings);\n setSaved(success);\n setSaveError(!success);\n if (success) setSavedSettings(settings);\n }, [settings]);\n\n const handleReset = useCallback(() => {\n setSettings({ ...DEFAULT_SETTINGS });\n const success = saveBigConsoleSettings(DEFAULT_SETTINGS);\n setSaved(success);\n setSaveError(!success);\n if (success) setSavedSettings({ ...DEFAULT_SETTINGS });\n }, []);\n\n const inputStyle: React.CSSProperties = {\n width: '100%',\n padding: '8px 12px',\n borderRadius: 'var(--radius-button)',\n border: '1px solid var(--color-border)',\n backgroundColor: 'var(--color-bg-canvas)',\n color: 'var(--color-text-primary)',\n fontSize: 'var(--font-size-body-sm)',\n };\n\n const labelStyle: React.CSSProperties = {\n display: 'block',\n fontSize: 'var(--font-size-body-sm)',\n fontWeight: 'var(--font-weight-medium)',\n color: 'var(--color-text-primary)',\n marginBottom: 4,\n };\n\n const descStyle: React.CSSProperties = {\n fontSize: 'var(--font-size-body-sm)',\n color: 'var(--color-text-muted)',\n marginTop: 4,\n };\n\n const sectionStyle: React.CSSProperties = {\n backgroundColor: 'var(--color-bg-surface)',\n border: '1px solid var(--color-border-seam)',\n borderRadius: 'var(--radius-card)',\n padding: 'var(--space-cardPadding)',\n marginBottom: 'var(--space-sectionGap)',\n boxShadow: 'var(--shadow-pop)',\n };\n\n return (\n <div style={{ minHeight: '100vh', backgroundColor: 'var(--color-bg-canvas)' }}>\n <div style={{ padding: 'var(--space-pagePadding)', maxWidth: 1440, margin: '0 auto' }}>\n {/ Header /}\n <div\n className=\"relative overflow-hidden rounded-card border border-border-seam bg-gloss-card p-6\"\n style={{\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n marginBottom: 'var(--space-sectionGap)',\n flexWrap: 'wrap',\n gap: 'var(--space-formGap)',\n }}\n >\n <AuroraBackground intensity=\"subtle\" />\n <div>\n <div style={{ display: 'flex', alignItems: 'center', gap: 'var(--space-iconGap)' }}>\n <Settings size={24} style={{ color: 'var(--color-text-primary)' }} />\n <h1\n style={{\n fontSize: 'var(--font-size-heading-h4)',\n fontWeight: 'var(--font-weight-bold)',\n color: 'var(--color-text-primary)',\n }}\n >\n <GradientText>{t('bigconsole.settings.header.title', 'Settings')}</GradientText>\n </h1>\n </div>\n <p style={{ fontSize: 'var(--font-size-body-md)', color: 'var(--color-text-secondary)', marginTop: 4 }}>\n {t('bigconsole.settings.header.subtitle', 'Configure BigConsole preferences')}\n </p>\n </div>\n <div style={{ display: 'flex', gap: 8 }}>\n <button\n onClick={handleReset}\n style={{\n display: 'flex',\n alignItems: 'center',\n gap: 6,\n padding: '8px 12px',\n borderRadius: 'var(--radius-button)',\n border: '1px solid var(--color-border)',\n backgroundColor: 'transparent',\n color: 'var(--color-text-secondary)',\n fontSize: 'var(--font-size-body-sm)',\n cursor: 'pointer',\n }}\n >\n <RotateCcw size={14} /> {t('bigconsole.settings.actions.reset', 'Reset')}\n </button>\n <button\n onClick={handleSave}\n style={{\n display: 'flex',\n alignItems: 'center',\n gap: 6,\n padding: '8px 16px',\n borderRadius: 'var(--radius-button)',\n backgroundColor: saved ? 'var(--color-status-success-bg)' : 'var(--color-action-primary-bg)',\n color: 'var(--color-action-primary-text)',\n fontWeight: 'var(--font-weight-medium)',\n fontSize: 'var(--font-size-body-sm)',\n border: 'none',\n cursor: 'pointer',\n transition: 'background-color 200ms',\n }}\n >\n <Save size={14} />{' '}\n {saved\n ? t('bigconsole.settings.actions.savedLocally', 'Saved locally')\n : t('bigconsole.settings.actions.saveLocally', 'Save locally')}\n </button>\n </div>\n </div>\n\n {saveError && (\n <p role=\"alert\" className=\"mb-form-gap text-status-error-text\">\n {t('bigconsole.settings.actions.saveError', 'Your browser could not save these preferences. Try again.')}\n </p>\n )}\n <PagePurpose className=\"mb-[var(--space-sectionGap)]\">\n {t(\n 'bigconsole.settings.localDefaultsPurpose',\n 'These browser-local defaults apply when you add dashboard pages, widgets and data sinks. Display preferences update existing widgets in this browser. They do not change existing page layouts, widget refresh schedules or data sink cache settings, and are not shared with your team.'\n )}\n </PagePurpose>\n\n {/ Dashboard Defaults — primary emphasis zone /}\n <EmphasisPanel className=\"mb-[var(--space-sectionGap)] p-[var(--space-cardPadding)]\">\n <h2\n style={{\n fontSize: 'var(--font-size-body-md)',\n fontWeight: 'var(--font-weight-semibold)',\n color: 'var(--color-text-primary)',\n marginBottom: 16,\n }}\n >\n {t('bigconsole.settings.dashboardDefaults.title', 'Dashboard Defaults')}\n </h2>\n <div className=\"grid gap-form-gap md:grid-cols-3\">\n <div>\n <label htmlFor=\"grid-cols\" style={labelStyle}>\n {t('bigconsole.settings.dashboardDefaults.gridColumns.label', 'Grid Columns')}\n </label>\n <input\n id=\"grid-cols\"\n type=\"number\"\n min={4}\n max={24}\n value={settings.defaultGridColumns}\n onChange={(e) =>\n handleChange('defaultGridColumns', Math.min(24, Math.max(4, Number(e.target.value) \|\| 12)))\n }\n style={inputStyle}\n />\n <p style={descStyle}>\n {t(\n 'bigconsole.settings.dashboardDefaults.gridColumns.help',\n 'Number of columns in the dashboard grid (4-24)'\n )}\n </p>\n </div>\n <div>\n <label htmlFor=\"widget-height\" style={labelStyle}>\n {t('bigconsole.settings.dashboardDefaults.widgetHeight.label', 'Default Widget Height')}\n </label>\n <input\n id=\"widget-height\"\n type=\"number\"\n min={2}\n max={12}\n value={settings.defaultWidgetHeight}\n onChange={(e) =>\n handleChange('defaultWidgetHeight', Math.min(12, Math.max(1, Number(e.target.value) \|\| 4)))\n }\n style={inputStyle}\n />\n <p style={descStyle}>\n {t(\n 'bigconsole.settings.dashboardDefaults.widgetHeight.help',\n 'Default height units for new widgets (2-12)'\n )}\n </p>\n </div>\n <div>\n <label htmlFor=\"refresh-interval\" style={labelStyle}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.label', 'Auto-Refresh Interval (seconds)')}\n </label>\n <select\n id=\"refresh-interval\"\n value={settings.defaultRefreshInterval}\n onChange={(e) => handleChange('defaultRefreshInterval', parseInt(e.target.value))}\n style={inputStyle}\n >\n <option value={0}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.disabled', 'Disabled')}\n </option>\n <option value={10}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.seconds10', '10 seconds')}\n </option>\n <option value={30}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.seconds30', '30 seconds')}\n </option>\n <option value={60}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.minute1', '1 minute')}\n </option>\n <option value={300}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.minutes5', '5 minutes')}\n </option>\n <option value={600}>\n {t('bigconsole.settings.dashboardDefaults.refreshInterval.minutes10', '10 minutes')}\n </option>\n </select>\n <p style={descStyle}>\n {t(\n 'bigconsole.settings.dashboardDefaults.refreshInterval.help',\n 'How often widgets refresh their data automatically'\n )}\n </p>\n </div>\n </div>\n </EmphasisPanel>\n\n {/ Cache Settings /}\n <div style={sectionStyle}>\n <h2\n style={{\n fontSize: 'var(--font-size-body-md)',\n fontWeight: 'var(--font-weight-semibold)',\n color: 'var(--color-text-primary)',\n marginBottom: 16,\n }}\n >\n {t('bigconsole.settings.cache.title', 'Cache')}\n </h2>\n <div className=\"grid gap-form-gap md:grid-cols-2\">\n <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n <div>\n <label style={labelStyle}>{t('bigconsole.settings.cache.enable.label', 'Enable Cache')}</label>\n <p style={descStyle}>\n {t('bigconsole.settings.cache.newSinkHelp', 'Enable caching by default for new data sinks')}\n </p>\n </div>\n <button\n onClick={() => handleChange('cacheEnabled', !settings.cacheEnabled)}\n role=\"switch\"\n aria-checked={settings.cacheEnabled}\n aria-label={t('bigconsole.settings.cache.enable.label', 'Enable Cache')}\n style={{\n width: 44,\n flexShrink: 0,\n height: 24,\n borderRadius: 12,\n backgroundColor: settings.cacheEnabled ? 'var(--color-action-primary-bg)' : 'var(--color-bg-sunken)',\n border: 'none',\n cursor: 'pointer',\n position: 'relative',\n transition: 'background-color 200ms',\n }}\n >\n <div\n style={{\n width: 18,\n height: 18,\n borderRadius: '50%',\n backgroundColor: 'var(--color-action-primary-text)',\n position: 'absolute',\n top: 3,\n left: settings.cacheEnabled ? 23 : 3,\n transition: 'left 200ms',\n }}\n />\n </button>\n </div>\n {settings.cacheEnabled && (\n <div>\n <label htmlFor=\"cache-ttl\" style={labelStyle}>\n {t('bigconsole.settings.cache.ttl.label', 'Cache TTL (seconds)')}\n </label>\n <input\n id=\"cache-ttl\"\n type=\"number\"\n min={30}\n max={3600}\n value={settings.cacheTTLSeconds}\n onChange={(e) =>\n handleChange('cacheTTLSeconds', Math.min(86400, Math.max(0, Number(e.target.value))))\n }\n style={inputStyle}\n />\n <p style={descStyle}>\n {t('bigconsole.settings.cache.ttl.help', 'How long cached data is considered fresh (30-3600)')}\n </p>\n </div>\n )}\n </div>\n </div>\n\n {/ Display Settings */}\n <div style={sectionStyle}>\n <h2\n style={{\n fontSize: 'var(--font-size-body-md)',\n fontWeight: 'var(--font-weight-semibold)',\n color: 'var(--color-text-primary)',\n marginBottom: 16,\n }}\n >\n {t('bigconsole.settings.display.title', 'Display')}\n </h2>\n <div className=\"grid gap-form-gap md:grid-cols-3\">\n <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n <div>\n <label style={labelStyle}>\n {t('bigconsole.settings.display.widgetBorders.label', 'Show Widget Borders')}\n </label>\n <p style={descStyle}>\n {t('bigconsole.settings.display.widgetBorders.help', 'Display borders around widgets in dashboards')}\n </p>\n </div>\n <button\n onClick={() => handleChange('showWidgetBorders', !settings.showWidgetBorders)}\n role=\"switch\"\n aria-checked={settings.showWidgetBorders}\n aria-label={t('bigconsole.settings.display.widgetBorders.label', 'Show Widget Borders')}\n style={{\n width: 44,\n flexShrink: 0,\n height: 24,\n borderRadius: 12,\n backgroundColor: settings.showWidgetBorders\n ? 'var(--color-action-primary-bg)'\n : 'var(--color-bg-sunken)',\n border: 'none',\n cursor: 'pointer',\n position: 'relative',\n transition: 'background-color 200ms',\n }}\n >\n <div\n style={{\n width: 18,\n height: 18,\n borderRadius: '50%',\n backgroundColor: 'var(--color-action-primary-text)',\n position: 'absolute',\n top: 3,\n left: settings.showWidgetBorders ? 23 : 3,\n transition: 'left 200ms',\n }}\n />\n </button>\n </div>\n <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n <div>\n <label style={labelStyle}>{t('bigconsole.settings.display.compactMode.label', 'Compact Mode')}</label>\n <p style={descStyle}>\n {t('bigconsole.settings.display.compactMode.help', 'Reduce padding and spacing for more content')}\n </p>\n </div>\n <button\n onClick={() => handleChange('compactMode', !settings.compactMode)}\n role=\"switch\"\n aria-checked={settings.compactMode}\n aria-label={t('bigconsole.settings.display.compactMode.label', 'Compact Mode')}\n style={{\n width: 44,\n flexShrink: 0,\n height: 24,\n borderRadius: 12,\n backgroundColor: settings.compactMode ? 'var(--color-action-primary-bg)' : 'var(--color-bg-sunken)',\n border: 'none',\n cursor: 'pointer',\n position: 'relative',\n transition: 'background-color 200ms',\n }}\n >\n <div\n style={{\n width: 18,\n height: 18,\n borderRadius: '50%',\n backgroundColor: 'var(--color-action-primary-text)',\n position: 'absolute',\n top: 3,\n left: settings.compactMode ? 23 : 3,\n transition: 'left 200ms',\n }}\n />\n </button>\n </div>\n <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n <div>\n <label style={labelStyle}>{t('bigconsole.settings.display.animations.label', 'Animations')}</label>\n <p style={descStyle}>\n {t('bigconsole.settings.display.animations.help', 'Enable transition animations and effects')}\n </p>\n </div>\n <button\n onClick={() => handleChange('animationsEnabled', !settings.animationsEnabled)}\n role=\"switch\"\n aria-checked={settings.animationsEnabled}\n aria-label={t('bigconsole.settings.display.animations.label', 'Animations')}\n style={{\n width: 44,\n flexShrink: 0,\n height: 24,\n borderRadius: 12,\n backgroundColor: settings.animationsEnabled\n ? 'var(--color-action-primary-bg)'\n : 'var(--color-bg-sunken)',\n border: 'none',\n cursor: 'pointer',\n position: 'relative',\n transition: 'background-color 200ms',\n }}\n >\n <div\n style={{\n width: 18,\n height: 18,\n borderRadius: '50%',\n backgroundColor: 'var(--color-action-primary-text)',\n position: 'absolute',\n top: 3,\n left: settings.animationsEnabled ? 23 : 3,\n transition: 'left 200ms',\n }}\n />\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n );\n});\n\nexport default SettingsPage;\n"],"mappings":"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"}

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

@@ -8,8 +8,8 @@ import a from "../components/widgets/WidgetWrapper.js";
 import "../components/widgets/index.js";
 import { useMemo as o, useState as s } from "react";
 import { Button as c, IllustratedEmptyState as l, PagePurpose as u } from "@burdenoff/fe-libs/ui";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
-import { useI18n as p } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { useI18n as d } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region src/bigconsole/pages/WidgetDemoPage.tsx
 var m = [
 	{
@@ -171,7 +171,7 @@ var m = [
 	Temporal: "Widgets organised by date, schedule or workflow stage.",
 	Custom: "Widgets whose body you define yourself."
 }, _ = () => {
-	let { t: _ } = p(), v = e(), [y, b] = s(""), [x, S] = s("grid"), C = o(() => (y ? m.filter((e) => [
+	let { t: _ } = d(), v = e(), [y, b] = s(""), [x, S] = s("grid"), C = o(() => (y ? m.filter((e) => [
 		e.type,
 		_(e.titleKey, e.title),
 		_(e.descriptionKey, e.description)
@@ -214,35 +214,35 @@ var m = [
 			widgets: e.get(t) ?? []
 		}));
 	}, [C]), T = x === "grid" ? "grid grid-cols-1 gap-form-gap sm:grid-cols-2 xl:grid-cols-3" : "flex flex-col gap-form-gap";
-	return /* @__PURE__ */ f("div", {
+	return /* @__PURE__ */ p("div", {
 		className: "flex h-full min-w-0 flex-col bg-bg-canvas",
 		children: [
-			/* @__PURE__ */ d("section", {
+			/* @__PURE__ */ f("section", {
 				"aria-label": "Widget demo header",
 				className: `${t("bare", "neutral", "none")} flex-shrink-0 border-b border-[var(--color-border-subtle)] bg-bg-surface px-4 py-3 sm:px-6 sm:py-4`,
-				children: /* @__PURE__ */ f("div", {
+				children: /* @__PURE__ */ p("div", {
 					className: "flex flex-col gap-control-gap lg:flex-row lg:items-center lg:justify-between",
-					children: [/* @__PURE__ */ f("div", {
+					children: [/* @__PURE__ */ p("div", {
 						className: "min-w-0",
-						children: [/* @__PURE__ */ d("h1", {
+						children: [/* @__PURE__ */ f("h1", {
 							className: "text-xl font-semibold text-text-primary",
 							children: _("bigconsole.widgetDemo.header.title", "Widget Demo")
-						}), /* @__PURE__ */ d("p", {
+						}), /* @__PURE__ */ f("p", {
 							className: "mt-1 text-sm text-text-secondary",
 							children: _("bigconsole.widgetDemo.header.subtitle", "All 18 widget types - connect a DataSink for real data")
 						})]
-					}), /* @__PURE__ */ f("div", {
+					}), /* @__PURE__ */ p("div", {
 						className: "flex flex-wrap items-center gap-control-gap",
 						children: [
-							/* @__PURE__ */ f("div", {
+							/* @__PURE__ */ p("div", {
 								className: "relative min-w-0 flex-1 sm:flex-none",
 								children: [
-									/* @__PURE__ */ d("label", {
+									/* @__PURE__ */ f("label", {
 										htmlFor: "widget-demo-filter",
 										className: "sr-only",
 										children: "Filter widget types"
 									}),
-									/* @__PURE__ */ d("input", {
+									/* @__PURE__ */ f("input", {
 										id: "widget-demo-filter",
 										type: "text",
 										placeholder: _("bigconsole.widgetDemo.filter.placeholder", "Filter widgets..."),
@@ -250,13 +250,13 @@ var m = [
 										onChange: (e) => b(e.target.value),
 										className: "h-control-md w-full min-w-0 rounded-input border border-[var(--color-border-subtle)] bg-bg-sunken py-2 pl-[3.25rem] pr-3 text-sm text-text-primary placeholder:text-text-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface sm:w-64"
 									}),
-									/* @__PURE__ */ d("svg", {
+									/* @__PURE__ */ f("svg", {
 										"aria-hidden": "true",
 										className: "pointer-events-none absolute left-3 top-1/2 h-icon-sm w-icon-sm -translate-y-1/2 text-text-secondary",
 										fill: "none",
 										stroke: "currentColor",
 										viewBox: "0 0 24 24",
-										children: /* @__PURE__ */ d("path", {
+										children: /* @__PURE__ */ f("path", {
 											strokeLinecap: "round",
 											strokeLinejoin: "round",
 											strokeWidth: 2,
@@ -265,17 +265,17 @@ var m = [
 									})
 								]
 							}),
-							/* @__PURE__ */ f("div", {
+							/* @__PURE__ */ p("div", {
 								className: "flex shrink-0 items-center gap-1 rounded-button bg-bg-sunken p-1",
 								role: "group",
 								"aria-label": "Gallery layout",
-								children: [/* @__PURE__ */ d("button", {
+								children: [/* @__PURE__ */ f("button", {
 									type: "button",
 									onClick: () => S("grid"),
 									"aria-pressed": x === "grid",
 									className: `min-h-control-md rounded-button px-3 text-sm font-medium motion-safe:transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface ${x === "grid" ? "bg-bg-surface text-text-primary shadow-[var(--shadow-elevation-1)]" : "text-text-secondary hover:text-text-primary"}`,
 									children: _("bigconsole.widgetDemo.viewToggle.grid", "Grid")
-								}), /* @__PURE__ */ d("button", {
+								}), /* @__PURE__ */ f("button", {
 									type: "button",
 									onClick: () => S("list"),
 									"aria-pressed": x === "list",
@@ -283,7 +283,7 @@ var m = [
 									children: _("bigconsole.widgetDemo.viewToggle.list", "List")
 								})]
 							}),
-							/* @__PURE__ */ d(c, {
+							/* @__PURE__ */ f(c, {
 								variant: "secondary",
 								onClick: () => v("/dashboards"),
 								children: _("bigconsole.widgetDemo.openDashboards", "Open dashboards")
@@ -292,20 +292,20 @@ var m = [
 					})]
 				})
 			}),
-			/* @__PURE__ */ d("div", {
+			/* @__PURE__ */ f("div", {
 				className: "min-w-0 flex-1 overflow-y-auto overflow-x-hidden p-4 sm:p-6",
-				children: /* @__PURE__ */ f(r, { children: [
-					/* @__PURE__ */ d("section", {
+				children: /* @__PURE__ */ p(r, { children: [
+					/* @__PURE__ */ f("section", {
 						"aria-label": "What this gallery is for",
 						className: t("muted", "neutral", "compact"),
-						children: /* @__PURE__ */ d(u, { children: _("bigconsole.widgetDemo.pagePurpose", "This gallery previews every widget type BigConsole can render on a dashboard — metrics, charts, tables, maps, kanban boards and more. Use it to see what each widget looks like and pick the right one before wiring it to a real DataSink in the dashboard builder.") })
+						children: /* @__PURE__ */ f(u, { children: _("bigconsole.widgetDemo.pagePurpose", "This gallery previews every widget type BigConsole can render on a dashboard — metrics, charts, tables, maps, kanban boards and more. Use it to see what each widget looks like and pick the right one before wiring it to a real DataSink in the dashboard builder.") })
 					}),
-					w.length > 0 && /* @__PURE__ */ d(n, {
+					w.length > 0 && /* @__PURE__ */ f(n, {
 						emphasis: "primary",
 						headingLevel: 2,
 						title: "Widget gallery",
 						description: "Every widget renders its unconnected state here — the card chrome, header and empty copy are exactly what a dashboard will show before a DataSink is bound.",
-						meta: /* @__PURE__ */ f("span", {
+						meta: /* @__PURE__ */ p("span", {
 							className: "rounded-pill bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary",
 							children: [
 								C.length,
@@ -313,15 +313,15 @@ var m = [
 								m.length
 							]
 						}),
-						children: /* @__PURE__ */ d("div", {
+						children: /* @__PURE__ */ f("div", {
 							className: "flex flex-col gap-section-gap",
-							children: w.map((e) => /* @__PURE__ */ d(n, {
+							children: w.map((e) => /* @__PURE__ */ f(n, {
 								emphasis: "bare",
 								padding: "none",
 								headingLevel: 3,
 								title: e.label,
 								description: e.blurb,
-								meta: /* @__PURE__ */ f("span", {
+								meta: /* @__PURE__ */ p("span", {
 									className: "text-xs font-medium text-text-muted",
 									children: [
 										e.widgets.length,
@@ -329,28 +329,28 @@ var m = [
 										e.widgets.length === 1 ? "type" : "types"
 									]
 								}),
-								children: /* @__PURE__ */ d("div", {
+								children: /* @__PURE__ */ f("div", {
 									className: T,
 									children: e.widgets.map((e) => {
 										let t = m.find((t) => t.type === e.type);
-										return /* @__PURE__ */ f("figure", {
+										return /* @__PURE__ */ p("figure", {
 											className: `m-0 flex min-w-0 flex-col ${x === "grid" ? "h-80" : "h-64"}`,
-											children: [/* @__PURE__ */ f("figcaption", {
+											children: [/* @__PURE__ */ p("figcaption", {
 												className: "mb-2 flex flex-shrink-0 flex-wrap items-baseline gap-x-2 gap-y-0.5 text-xs text-text-secondary",
-												children: [/* @__PURE__ */ f("span", { children: [
+												children: [/* @__PURE__ */ p("span", { children: [
 													_("bigconsole.widgetDemo.widgetCard.typeLabel", "Type:"),
 													" ",
-													/* @__PURE__ */ d("code", {
+													/* @__PURE__ */ f("code", {
 														className: "font-mono text-text-link",
 														children: e.type
 													})
-												] }), t && /* @__PURE__ */ d("span", {
+												] }), t && /* @__PURE__ */ f("span", {
 													className: "text-text-muted",
 													children: _(t.descriptionKey, t.description)
 												})]
-											}), /* @__PURE__ */ d("div", {
+											}), /* @__PURE__ */ f("div", {
 												className: "min-h-0 min-w-0 flex-1",
-												children: /* @__PURE__ */ d(a, {
+												children: /* @__PURE__ */ f(a, {
 													previewOnly: !0,
 													widget: e
 												})
@@ -361,13 +361,13 @@ var m = [
 							}, e.category))
 						})
 					}),
-					C.length === 0 && /* @__PURE__ */ d(n, {
+					C.length === 0 && /* @__PURE__ */ f(n, {
 						emphasis: "standard",
 						tone: "info",
 						title: _("bigconsole.widgetDemo.emptyState.title", "No widgets match your filter"),
 						headingLevel: 2,
 						"data-testid": "widget-demo-empty",
-						children: /* @__PURE__ */ d(l, {
+						children: /* @__PURE__ */ f(l, {
 							illustration: "empty-search",
 							title: _("bigconsole.widgetDemo.emptyState.description", "Try a different search term to preview a widget type."),
 							description: "The filter matches a widget's name and its one-line description."
@@ -375,15 +375,15 @@ var m = [
 					})
 				] })
 			}),
-			/* @__PURE__ */ d("section", {
+			/* @__PURE__ */ f("section", {
 				"aria-label": "Gallery summary",
 				className: `${t("bare", "neutral", "none")} flex-shrink-0 border-t border-[var(--color-border-subtle)] bg-bg-sunken px-4 py-2 sm:px-6`,
-				children: /* @__PURE__ */ f("div", {
+				children: /* @__PURE__ */ p("div", {
 					className: "flex flex-wrap items-center justify-between gap-x-4 gap-y-1 text-xs text-text-secondary",
-					children: [/* @__PURE__ */ d("span", { children: _("bigconsole.widgetDemo.footer.showing", "Showing {{shown}} of {{total}} widget types", {
+					children: [/* @__PURE__ */ f("span", { children: _("bigconsole.widgetDemo.footer.showing", "Showing {{shown}} of {{total}} widget types", {
 						shown: C.length,
 						total: m.length
-					}) }), /* @__PURE__ */ d("span", {
+					}) }), /* @__PURE__ */ f("span", {
 						className: "text-text-muted",
 						children: _("bigconsole.widgetDemo.footer.hint", "Widgets show empty state until connected to DataSink + Parser")
 					})]

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

@@ -16,8 +16,8 @@ import { useParams as se } from "react-router";
 import { AccessDenied as ce, PermissionButton as p } from "@burdenoff/fe-libs/shared/components";
 import { usePermissions as le } from "@burdenoff/fe-libs/shared/providers/shell";
 import { Button as m, IllustratedEmptyState as h, NextSteps as ue, PagePurpose as de, Spinner as g } from "@burdenoff/fe-libs/ui";
-import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
 import { useI18n as fe } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
 import { useLazyWorkflowDefinition as pe } from "@burdenoff/fluidgrids-fe-sdk";
 import { formatDistanceToNow as b } from "date-fns";
 //#region src/bigconsole/pages/WorkflowViewPage.tsx