npm - @burdenoff/microfe-bigconsole - Versions diffs - 2026.805.3 → 2026.812.2 - Mend

@burdenoff/microfe-bigconsole 2026.805.3 → 2026.812.2

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

package/dist/bigconsole/components/widgets/chart/ChartConfig.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChartConfig.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/chart/ChartConfig.tsx"],"sourcesContent":["/*\n ChartConfig Component\n \n Configuration panel for Chart widgets.\n /\n\nimport { type FC, memo, useCallback, useMemo } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport type { ChartConfig as ConfigType } from '../../../types';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface ChartConfigProps {\n /* Current configuration /\n config: ConfigType;\n /* Callback when config changes /\n onChange: (config: ConfigType) => void;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const ChartConfig: FC<ChartConfigProps> = memo(function ChartConfig({ config, onChange }) {\n const { t } = useI18n();\n\n const CHART_TYPES = useMemo(\n () => [\n { value: 'line', label: t('bigconsole.widget.config.chart.type.line', 'Line Chart') },\n { value: 'bar', label: t('bigconsole.widget.config.chart.type.bar', 'Bar Chart') },\n { value: 'area', label: t('bigconsole.widget.config.chart.type.area', 'Area Chart') },\n { value: 'pie', label: t('bigconsole.widget.config.chart.type.pie', 'Pie Chart') },\n { value: 'funnel', label: t('bigconsole.widget.config.chart.type.funnel', 'Funnel Chart') },\n ],\n [t]\n );\n\n const CURVE_TYPES = useMemo(\n () => [\n { value: 'monotone', label: t('bigconsole.widget.config.chart.curve.smooth', 'Smooth') },\n { value: 'linear', label: t('bigconsole.widget.config.chart.curve.linear', 'Linear') },\n { value: 'step', label: t('bigconsole.widget.config.chart.curve.step', 'Step') },\n { value: 'natural', label: t('bigconsole.widget.config.chart.curve.natural', 'Natural') },\n ],\n [t]\n );\n\n const LEGEND_POSITIONS = useMemo(\n () => [\n { value: 'top', label: t('bigconsole.widget.config.chart.legendPosition.top', 'Top') },\n { value: 'bottom', label: t('bigconsole.widget.config.chart.legendPosition.bottom', 'Bottom') },\n { value: 'left', label: t('bigconsole.widget.config.chart.legendPosition.left', 'Left') },\n { value: 'right', label: t('bigconsole.widget.config.chart.legendPosition.right', 'Right') },\n ],\n [t]\n );\n\n const handleChange = useCallback(\n <K extends keyof ConfigType>(key: K, value: ConfigType[K]) => {\n onChange({ ...config, [key]: value });\n },\n [config, onChange]\n );\n\n const isPieOrFunnel = config.chartType === 'pie' \|\| config.chartType === 'funnel';\n\n return (\n <div className=\"space-y-4\">\n {/ Chart Type /}\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.chartTypeLabel', 'Chart Type')}\n </label>\n <select\n value={config.chartType \|\| 'line'}\n onChange={(e) => handleChange('chartType', e.target.value as ConfigType['chartType'])}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n >\n {CHART_TYPES.map((type) => (\n <option key={type.value} value={type.value}>\n {type.label}\n </option>\n ))}\n </select>\n </div>\n\n {/ Axis Fields (for Line/Bar/Area) /}\n {!isPieOrFunnel && (\n <>\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.xAxisFieldLabel', 'X-Axis Field')}\n </label>\n <input\n type=\"text\"\n value={config.xAxisField \|\| ''}\n onChange={(e) => handleChange('xAxisField', e.target.value)}\n placeholder={t('bigconsole.widget.config.chart.xAxisFieldPlaceholder', 'e.g., date, category')}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n />\n </div>\n\n <div className=\"grid grid-cols-2 gap-3\">\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.xAxisLabelLabel', 'X-Axis Label')}\n </label>\n <input\n type=\"text\"\n value={config.xAxisLabel \|\| ''}\n onChange={(e) => handleChange('xAxisLabel', e.target.value)}\n placeholder={t('bigconsole.widget.config.chart.optionalPlaceholder', 'Optional')}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n />\n </div>\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.yAxisLabelLabel', 'Y-Axis Label')}\n </label>\n <input\n type=\"text\"\n value={config.yAxisLabel \|\| ''}\n onChange={(e) => handleChange('yAxisLabel', e.target.value)}\n placeholder={t('bigconsole.widget.config.chart.optionalPlaceholder', 'Optional')}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n />\n </div>\n </div>\n\n {/ Curve Type (for Line/Area) /}\n {(config.chartType === 'line' \|\| config.chartType === 'area') && (\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.curveTypeLabel', 'Curve Type')}\n </label>\n <select\n value={config.curveType \|\| 'monotone'}\n onChange={(e) => handleChange('curveType', e.target.value as ConfigType['curveType'])}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n >\n {CURVE_TYPES.map((type) => (\n <option key={type.value} value={type.value}>\n {type.label}\n </option>\n ))}\n </select>\n </div>\n )}\n </>\n )}\n\n {/ Pie/Funnel specific fields /}\n {isPieOrFunnel && (\n <>\n <div className=\"grid grid-cols-2 gap-3\">\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.valueFieldLabel', 'Value Field')}\n </label>\n <input\n type=\"text\"\n value={config.valueField \|\| ''}\n onChange={(e) => handleChange('valueField', e.target.value)}\n placeholder={t('bigconsole.widget.config.chart.valueFieldPlaceholder', 'e.g., value')}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n />\n </div>\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.labelFieldLabel', 'Label Field')}\n </label>\n <input\n type=\"text\"\n value={config.labelField \|\| ''}\n onChange={(e) => handleChange('labelField', e.target.value)}\n placeholder={t('bigconsole.widget.config.chart.labelFieldPlaceholder', 'e.g., name')}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n />\n </div>\n </div>\n\n {config.chartType === 'pie' && (\n <label className=\"flex items-center gap-3\">\n <input\n type=\"checkbox\"\n checked={config.showAsDonut === true}\n onChange={(e) => handleChange('showAsDonut', e.target.checked)}\n className=\"\n w-4 h-4\n text-action-primary-bg\n bg-bg-surface\n border-border-default\n rounded\n focus:ring-action-primary-bg\n \"\n />\n <span className=\"text-sm text-text-primary\">\n {t('bigconsole.widget.config.chart.showAsDonut', 'Show as Donut')}\n </span>\n </label>\n )}\n </>\n )}\n\n {/ Legend Position /}\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.legendPositionLabel', 'Legend Position')}\n </label>\n <select\n value={config.legendPosition \|\| 'bottom'}\n onChange={(e) => handleChange('legendPosition', e.target.value as ConfigType['legendPosition'])}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n >\n {LEGEND_POSITIONS.map((pos) => (\n <option key={pos.value} value={pos.value}>\n {pos.label}\n </option>\n ))}\n </select>\n </div>\n\n {/ Selected Fields - Multi-select for choosing which numeric fields to display /}\n {!isPieOrFunnel && (\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.fieldsToDisplayLabel', 'Fields to Display')}\n </label>\n <p className=\"text-xs text-text-secondary mb-2\">\n {t(\n 'bigconsole.widget.config.chart.fieldsToDisplayHelp',\n 'Select which numeric fields to show as chart series. Leave empty to show all.'\n )}\n </p>\n <input\n type=\"text\"\n value={(config.selectedFields as string[] \| undefined)?.join(', ') \|\| ''}\n onChange={(e) => {\n const value = e.target.value.trim();\n const fields = value\n ? value\n .split(',')\n .map((f) => f.trim())\n .filter(Boolean)\n : [];\n handleChange('selectedFields', fields.length > 0 ? fields : undefined);\n }}\n placeholder={t(\n 'bigconsole.widget.config.chart.fieldsToDisplayPlaceholder',\n 'e.g., revenue, orders, users (comma-separated)'\n )}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n />\n <p className=\"text-xs text-text-tertiary mt-1\">\n {t('bigconsole.widget.config.chart.fieldsToDisplayHint', 'Enter field names separated by commas')}\n </p>\n </div>\n )}\n\n {/ Toggle Options */}\n <div className=\"space-y-3\">\n <label className=\"flex items-center gap-3\">\n <input\n type=\"checkbox\"\n checked={config.showGrid !== false}\n onChange={(e) => handleChange('showGrid', e.target.checked)}\n className=\"\n w-4 h-4\n text-action-primary-bg\n bg-bg-surface\n border-border-default\n rounded\n focus:ring-action-primary-bg\n \"\n />\n <span className=\"text-sm text-text-primary\">{t('bigconsole.widget.config.chart.showGrid', 'Show Grid')}</span>\n </label>\n\n <label className=\"flex items-center gap-3\">\n <input\n type=\"checkbox\"\n checked={config.showLegend !== false}\n onChange={(e) => handleChange('showLegend', e.target.checked)}\n className=\"\n w-4 h-4\n text-action-primary-bg\n bg-bg-surface\n border-border-default\n rounded\n focus:ring-action-primary-bg\n \"\n />\n <span className=\"text-sm text-text-primary\">\n {t('bigconsole.widget.config.chart.showLegend', 'Show Legend')}\n </span>\n </label>\n\n {!isPieOrFunnel && (\n <>\n <label className=\"flex items-center gap-3\">\n <input\n type=\"checkbox\"\n checked={config.showDataPoints === true}\n onChange={(e) => handleChange('showDataPoints', e.target.checked)}\n className=\"\n w-4 h-4\n text-action-primary-bg\n bg-bg-surface\n border-border-default\n rounded\n focus:ring-action-primary-bg\n \"\n />\n <span className=\"text-sm text-text-primary\">\n {t('bigconsole.widget.config.chart.showDataPoints', 'Show Data Points')}\n </span>\n </label>\n\n {(config.chartType === 'bar' \|\| config.chartType === 'area') && (\n <label className=\"flex items-center gap-3\">\n <input\n type=\"checkbox\"\n checked={config.stacked === true}\n onChange={(e) => handleChange('stacked', e.target.checked)}\n className=\"\n w-4 h-4\n text-action-primary-bg\n bg-bg-surface\n border-border-default\n rounded\n focus:ring-action-primary-bg\n \"\n />\n <span className=\"text-sm text-text-primary\">\n {t('bigconsole.widget.config.chart.stacked', 'Stacked')}\n </span>\n </label>\n )}\n </>\n )}\n </div>\n </div>\n );\n});\n\nexport default ChartConfig;\n"],"mappings":"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"}
1	+ {"version":3,"file":"ChartConfig.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/chart/ChartConfig.tsx"],"sourcesContent":["/*\n ChartConfig Component\n \n Configuration panel for Chart widgets.\n /\n\nimport { type FC, memo, useCallback, useMemo } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport type { ChartConfig as ConfigType } from '../../../types';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface ChartConfigProps {\n /* Current configuration /\n config: ConfigType;\n /* Callback when config changes /\n onChange: (config: ConfigType) => void;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const ChartConfig: FC<ChartConfigProps> = memo(function ChartConfig({ config, onChange }) {\n const { t } = useI18n();\n\n const CHART_TYPES = useMemo(\n () => [\n { value: 'line', label: t('bigconsole.widget.config.chart.type.line', 'Line Chart') },\n { value: 'bar', label: t('bigconsole.widget.config.chart.type.bar', 'Bar Chart') },\n { value: 'area', label: t('bigconsole.widget.config.chart.type.area', 'Area Chart') },\n { value: 'pie', label: t('bigconsole.widget.config.chart.type.pie', 'Pie Chart') },\n { value: 'funnel', label: t('bigconsole.widget.config.chart.type.funnel', 'Funnel Chart') },\n ],\n [t]\n );\n\n const CURVE_TYPES = useMemo(\n () => [\n { value: 'monotone', label: t('bigconsole.widget.config.chart.curve.smooth', 'Smooth') },\n { value: 'linear', label: t('bigconsole.widget.config.chart.curve.linear', 'Linear') },\n { value: 'step', label: t('bigconsole.widget.config.chart.curve.step', 'Step') },\n { value: 'natural', label: t('bigconsole.widget.config.chart.curve.natural', 'Natural') },\n ],\n [t]\n );\n\n const LEGEND_POSITIONS = useMemo(\n () => [\n { value: 'top', label: t('bigconsole.widget.config.chart.legendPosition.top', 'Top') },\n { value: 'bottom', label: t('bigconsole.widget.config.chart.legendPosition.bottom', 'Bottom') },\n { value: 'left', label: t('bigconsole.widget.config.chart.legendPosition.left', 'Left') },\n { value: 'right', label: t('bigconsole.widget.config.chart.legendPosition.right', 'Right') },\n ],\n [t]\n );\n\n const handleChange = useCallback(\n <K extends keyof ConfigType>(key: K, value: ConfigType[K]) => {\n onChange({ ...config, [key]: value });\n },\n [config, onChange]\n );\n\n const isPieOrFunnel = config.chartType === 'pie' \|\| config.chartType === 'funnel';\n\n return (\n <div className=\"min-w-0 space-y-form-gap\">\n {/ Chart Type /}\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.chartTypeLabel', 'Chart Type')}\n </label>\n <select\n value={config.chartType \|\| 'line'}\n onChange={(e) => handleChange('chartType', e.target.value as ConfigType['chartType'])}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n >\n {CHART_TYPES.map((type) => (\n <option key={type.value} value={type.value}>\n {type.label}\n </option>\n ))}\n </select>\n </div>\n\n {/ Axis Fields (for Line/Bar/Area) /}\n {!isPieOrFunnel && (\n <>\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.xAxisFieldLabel', 'X-Axis Field')}\n </label>\n <input\n type=\"text\"\n value={config.xAxisField \|\| ''}\n onChange={(e) => handleChange('xAxisField', e.target.value)}\n placeholder={t('bigconsole.widget.config.chart.xAxisFieldPlaceholder', 'e.g., date, category')}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n />\n </div>\n\n <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2\">\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.xAxisLabelLabel', 'X-Axis Label')}\n </label>\n <input\n type=\"text\"\n value={config.xAxisLabel \|\| ''}\n onChange={(e) => handleChange('xAxisLabel', e.target.value)}\n placeholder={t('bigconsole.widget.config.chart.optionalPlaceholder', 'Optional')}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n />\n </div>\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.yAxisLabelLabel', 'Y-Axis Label')}\n </label>\n <input\n type=\"text\"\n value={config.yAxisLabel \|\| ''}\n onChange={(e) => handleChange('yAxisLabel', e.target.value)}\n placeholder={t('bigconsole.widget.config.chart.optionalPlaceholder', 'Optional')}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n />\n </div>\n </div>\n\n {/ Curve Type (for Line/Area) /}\n {(config.chartType === 'line' \|\| config.chartType === 'area') && (\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.curveTypeLabel', 'Curve Type')}\n </label>\n <select\n value={config.curveType \|\| 'monotone'}\n onChange={(e) => handleChange('curveType', e.target.value as ConfigType['curveType'])}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n >\n {CURVE_TYPES.map((type) => (\n <option key={type.value} value={type.value}>\n {type.label}\n </option>\n ))}\n </select>\n </div>\n )}\n </>\n )}\n\n {/ Pie/Funnel specific fields /}\n {isPieOrFunnel && (\n <>\n <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2\">\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.valueFieldLabel', 'Value Field')}\n </label>\n <input\n type=\"text\"\n value={config.valueField \|\| ''}\n onChange={(e) => handleChange('valueField', e.target.value)}\n placeholder={t('bigconsole.widget.config.chart.valueFieldPlaceholder', 'e.g., value')}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n />\n </div>\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.labelFieldLabel', 'Label Field')}\n </label>\n <input\n type=\"text\"\n value={config.labelField \|\| ''}\n onChange={(e) => handleChange('labelField', e.target.value)}\n placeholder={t('bigconsole.widget.config.chart.labelFieldPlaceholder', 'e.g., name')}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n />\n </div>\n </div>\n\n {config.chartType === 'pie' && (\n <label className=\"flex items-center gap-3\">\n <input\n type=\"checkbox\"\n checked={config.showAsDonut === true}\n onChange={(e) => handleChange('showAsDonut', e.target.checked)}\n className=\"\n w-4 h-4\n text-action-primary-bg\n bg-bg-surface\n border-border-default\n rounded\n focus:ring-action-primary-bg\n \"\n />\n <span className=\"text-sm text-text-primary\">\n {t('bigconsole.widget.config.chart.showAsDonut', 'Show as Donut')}\n </span>\n </label>\n )}\n </>\n )}\n\n {/ Legend Position /}\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.legendPositionLabel', 'Legend Position')}\n </label>\n <select\n value={config.legendPosition \|\| 'bottom'}\n onChange={(e) => handleChange('legendPosition', e.target.value as ConfigType['legendPosition'])}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n >\n {LEGEND_POSITIONS.map((pos) => (\n <option key={pos.value} value={pos.value}>\n {pos.label}\n </option>\n ))}\n </select>\n </div>\n\n {/ Selected Fields - Multi-select for choosing which numeric fields to display /}\n {!isPieOrFunnel && (\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1\">\n {t('bigconsole.widget.config.chart.fieldsToDisplayLabel', 'Fields to Display')}\n </label>\n <p className=\"text-xs text-text-secondary mb-2\">\n {t(\n 'bigconsole.widget.config.chart.fieldsToDisplayHelp',\n 'Select which numeric fields to show as chart series. Leave empty to show all.'\n )}\n </p>\n <input\n type=\"text\"\n value={(config.selectedFields as string[] \| undefined)?.join(', ') \|\| ''}\n onChange={(e) => {\n const value = e.target.value.trim();\n const fields = value\n ? value\n .split(',')\n .map((f) => f.trim())\n .filter(Boolean)\n : [];\n handleChange('selectedFields', fields.length > 0 ? fields : undefined);\n }}\n placeholder={t(\n 'bigconsole.widget.config.chart.fieldsToDisplayPlaceholder',\n 'e.g., revenue, orders, users (comma-separated)'\n )}\n className=\"\n w-full px-3 py-2\n text-sm text-text-primary\n bg-bg-surface\n border border-border-default\n rounded-md\n focus:outline-none focus:ring-2 focus:ring-action-primary-bg\n \"\n />\n <p className=\"text-xs text-text-muted mt-1\">\n {t('bigconsole.widget.config.chart.fieldsToDisplayHint', 'Enter field names separated by commas')}\n </p>\n </div>\n )}\n\n {/ Toggle Options /}\n <div\n role=\"group\"\n aria-label=\"Display options\"\n className=\"space-y-3 border-t border-[var(--color-border-subtle)] pt-form-gap\"\n >\n {/ Toggles are a different KIND of control from the field stack above,\n so they get their own labelled group instead of being visually\n identical to it (BOFF-5636). */}\n <p className=\"text-xs font-bold uppercase tracking-wider text-text-secondary\">Display options</p>\n <label className=\"flex items-center gap-3\">\n <input\n type=\"checkbox\"\n checked={config.showGrid !== false}\n onChange={(e) => handleChange('showGrid', e.target.checked)}\n className=\"\n w-4 h-4\n text-action-primary-bg\n bg-bg-surface\n border-border-default\n rounded\n focus:ring-action-primary-bg\n \"\n />\n <span className=\"text-sm text-text-primary\">{t('bigconsole.widget.config.chart.showGrid', 'Show Grid')}</span>\n </label>\n\n <label className=\"flex items-center gap-3\">\n <input\n type=\"checkbox\"\n checked={config.showLegend !== false}\n onChange={(e) => handleChange('showLegend', e.target.checked)}\n className=\"\n w-4 h-4\n text-action-primary-bg\n bg-bg-surface\n border-border-default\n rounded\n focus:ring-action-primary-bg\n \"\n />\n <span className=\"text-sm text-text-primary\">\n {t('bigconsole.widget.config.chart.showLegend', 'Show Legend')}\n </span>\n </label>\n\n {!isPieOrFunnel && (\n <>\n <label className=\"flex items-center gap-3\">\n <input\n type=\"checkbox\"\n checked={config.showDataPoints === true}\n onChange={(e) => handleChange('showDataPoints', e.target.checked)}\n className=\"\n w-4 h-4\n text-action-primary-bg\n bg-bg-surface\n border-border-default\n rounded\n focus:ring-action-primary-bg\n \"\n />\n <span className=\"text-sm text-text-primary\">\n {t('bigconsole.widget.config.chart.showDataPoints', 'Show Data Points')}\n </span>\n </label>\n\n {(config.chartType === 'bar' \|\| config.chartType === 'area') && (\n <label className=\"flex items-center gap-3\">\n <input\n type=\"checkbox\"\n checked={config.stacked === true}\n onChange={(e) => handleChange('stacked', e.target.checked)}\n className=\"\n w-4 h-4\n text-action-primary-bg\n bg-bg-surface\n border-border-default\n rounded\n focus:ring-action-primary-bg\n \"\n />\n <span className=\"text-sm text-text-primary\">\n {t('bigconsole.widget.config.chart.stacked', 'Stacked')}\n </span>\n </label>\n )}\n </>\n )}\n </div>\n </div>\n );\n});\n\nexport default ChartConfig;\n"],"mappings":"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"}

package/dist/bigconsole/components/widgets/comments/WidgetComments.js CHANGED Viewed

@@ -19,7 +19,7 @@ var g = ({ comment: e, isReply: t, busy: n, onResolve: a, onDelete: o, onReply:
 	return /* @__PURE__ */ f("div", {
 		className: t ? "pl-6" : "",
 		children: /* @__PURE__ */ p("div", {
-			className: "rounded-md border border-border-default bg-bg-surface p-2.5",
+			className: "rounded-md border border-[var(--color-border-default)] bg-bg-surface p-2.5",
 			children: [
 				/* @__PURE__ */ p("div", {
 					className: "flex items-center justify-between gap-2",
@@ -27,7 +27,7 @@ var g = ({ comment: e, isReply: t, busy: n, onResolve: a, onDelete: o, onReply:
 						className: "text-xs font-medium text-text-primary",
 						children: m(u, e.authorId)
 					}), /* @__PURE__ */ f("span", {
-						className: "text-[10px] text-text-tertiary tabular-nums",
+						className: "text-[10px] text-text-muted tabular-nums",
 						children: h(e.createdAt)
 					})]
 				}),
@@ -50,7 +50,7 @@ var g = ({ comment: e, isReply: t, busy: n, onResolve: a, onDelete: o, onReply:
 							type: "button",
 							disabled: n,
 							onClick: () => c(e.id),
-							className: "inline-flex items-center gap-1 text-[11px] text-text-tertiary hover:text-text-primary disabled:opacity-50",
+							className: "inline-flex items-center gap-1 text-[11px] text-text-muted hover:text-text-primary disabled:opacity-50",
 							children: [
 								/* @__PURE__ */ f(i, { className: "h-3 w-3" }),
 								" ",
@@ -61,7 +61,7 @@ var g = ({ comment: e, isReply: t, busy: n, onResolve: a, onDelete: o, onReply:
 							type: "button",
 							disabled: n,
 							onClick: () => a(e.id, !g),
-							className: "inline-flex items-center gap-1 text-[11px] text-text-tertiary hover:text-text-primary disabled:opacity-50",
+							className: "inline-flex items-center gap-1 text-[11px] text-text-muted hover:text-text-primary disabled:opacity-50",
 							children: [f(g ? s : r, { className: "h-3 w-3" }), g ? u("bigconsole.widget.comments.reopen", "Reopen") : u("bigconsole.widget.comments.resolve", "Resolve")]
 						}),
 						/* @__PURE__ */ p("button", {
@@ -96,7 +96,7 @@ var g = ({ comment: e, isReply: t, busy: n, onResolve: a, onDelete: o, onReply:
 			},
 			rows: 2,
 			placeholder: e,
-			className: "flex-1 resize-none rounded-md border border-border-default bg-bg-surface px-2.5 py-1.5 text-sm text-text-primary placeholder:text-text-tertiary focus:outline-none focus:ring-2 focus:ring-action-primary-bg"
+			className: "flex-1 resize-none rounded-md border border-[var(--color-border-default)] bg-bg-surface px-2.5 py-1.5 text-sm text-text-primary placeholder:text-text-muted focus:outline-none focus:ring-2 focus:ring-action-primary-bg"
 		}), /* @__PURE__ */ p("div", {
 			className: "flex flex-col gap-1",
 			children: [/* @__PURE__ */ f("button", {
@@ -109,7 +109,7 @@ var g = ({ comment: e, isReply: t, busy: n, onResolve: a, onDelete: o, onReply:
 			}), o && /* @__PURE__ */ f("button", {
 				type: "button",
 				onClick: o,
-				className: "inline-flex items-center justify-center rounded-md border border-border-default p-1.5 text-text-tertiary hover:text-text-primary",
+				className: "inline-flex items-center justify-center rounded-md border border-[var(--color-border-default)] p-1.5 text-text-muted hover:text-text-primary",
 				title: s("bigconsole.widget.comments.cancelReplyTitle", "Cancel reply"),
 				children: /* @__PURE__ */ f(u, { className: "h-4 w-4" })
 			})]
@@ -131,11 +131,14 @@ var g = ({ comment: e, isReply: t, busy: n, onResolve: a, onDelete: o, onReply:
 		},
 		children: [
 			/* @__PURE__ */ p("div", {
-				className: "flex items-center justify-between border-b border-border-default px-3 py-2",
-				children: [/* @__PURE__ */ p("div", {
-					className: "flex items-center gap-2 text-sm font-medium text-text-primary",
+				className: "flex min-w-0 items-center justify-between gap-2 border-b border-[var(--color-border-subtle)] bg-bg-surface px-3 py-2 sm:px-4",
+				children: [/* @__PURE__ */ p("h3", {
+					className: "flex min-w-0 items-center gap-2 text-sm font-semibold leading-tight tracking-tight text-text-primary",
 					children: [
-						/* @__PURE__ */ f(o, { className: "h-4 w-4 text-text-secondary" }),
+						/* @__PURE__ */ f(o, {
+							"aria-hidden": "true",
+							className: "h-icon-sm w-icon-sm shrink-0 text-text-secondary"
+						}),
 						s("bigconsole.widget.comments.title", "Comments"),
 						/* @__PURE__ */ f("span", {
 							className: "rounded-full bg-bg-sunken px-1.5 py-0.5 text-[10px] text-text-secondary tabular-nums",
@@ -146,7 +149,7 @@ var g = ({ comment: e, isReply: t, busy: n, onResolve: a, onDelete: o, onReply:
 					type: "button",
 					onClick: i,
 					"aria-label": s("bigconsole.widget.comments.closeAriaLabel", "Close comments"),
-					className: "rounded-md p-1 text-text-tertiary hover:bg-bg-sunken hover:text-text-primary",
+					className: "shrink-0 rounded-button p-1 text-text-muted hover:bg-bg-sunken hover:text-text-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
 					children: /* @__PURE__ */ f(u, { className: "h-4 w-4" })
 				})]
 			}),
@@ -154,15 +157,16 @@ var g = ({ comment: e, isReply: t, busy: n, onResolve: a, onDelete: o, onReply:
 				className: "flex-1 space-y-3 overflow-auto p-3",
 				children: [
 					m && c.length === 0 && /* @__PURE__ */ f("div", {
-						className: "flex items-center justify-center py-8 text-text-tertiary",
+						className: "flex items-center justify-center py-8 text-text-muted",
 						children: /* @__PURE__ */ f(a, { className: "h-5 w-5 animate-spin" })
 					}),
 					h && !m && /* @__PURE__ */ f("p", {
-						className: "rounded-md bg-status-error-bg px-2.5 py-2 text-xs text-status-error-text",
+						role: "alert",
+						className: "rounded-input border border-[var(--color-status-error-border)] bg-status-error-bg-subtle px-2.5 py-2 text-xs text-[var(--color-status-error-text)]",
 						children: s("bigconsole.widget.comments.loadError", "Couldn’t load comments.")
 					}),
 					!m && !h && c.length === 0 && /* @__PURE__ */ f("p", {
-						className: "py-8 text-center text-sm text-text-tertiary",
+						className: "py-8 text-center text-sm text-text-muted",
 						children: s("bigconsole.widget.comments.empty", "No comments yet. Start the conversation.")
 					}),
 					c.map(({ comment: e, replies: t }) => /* @__PURE__ */ p("div", {
@@ -197,7 +201,7 @@ var g = ({ comment: e, isReply: t, busy: n, onResolve: a, onDelete: o, onReply:
 				]
 			}),
 			/* @__PURE__ */ f("div", {
-				className: "border-t border-border-default p-3",
+				className: "border-t border-[var(--color-border-default)] p-3",
 				children: /* @__PURE__ */ f(_, {
 					placeholder: s("bigconsole.widget.comments.addPlaceholder", "Add a comment…"),
 					busy: v,

package/dist/bigconsole/components/widgets/comments/WidgetComments.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"WidgetComments.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/comments/WidgetComments.tsx"],"sourcesContent":["/*\n WidgetComments\n \n Collaborative comment thread for a single widget, rendered as a slide-over\n * panel inside the widget container. Supports posting top-level comments and\n * threaded replies, resolving/reopening, and (soft) deleting. Data flows through\n * useWidgetComments → the federated EntityComment API.\n /\n\nimport { type FC, useState, useCallback } from 'react';\nimport { MessageSquare, Send, Check, RotateCcw, Trash2, X, CornerDownRight, Loader2 } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useWidgetComments, type WidgetCommentThread } from '../../../hooks/useWidgetComments';\nimport type { EntityCommentFieldsFragment } from '../../../../generated/wspace-operations';\n\nexport interface WidgetCommentsProps {\n widgetId: string;\n /* Close the panel. /\n onClose: () => void;\n}\n\nfunction authorLabel(\n t: (\n key: string,\n fallbackOrParams?: string \| Record<string, string \| number>,\n params?: Record<string, string \| number>\n ) => string,\n authorId: string\n): string {\n // We only have an opaque actor id here; show a short, stable handle.\n return t('bigconsole.widget.comments.authorLabel', 'User {{id}}', { id: authorId.slice(0, 6) });\n}\n\nfunction formatWhen(iso: string): string {\n const d = new Date(iso);\n if (Number.isNaN(d.getTime())) return '';\n return new Intl.DateTimeFormat(undefined, { dateStyle: 'medium', timeStyle: 'short' }).format(d);\n}\n\ninterface CommentItemProps {\n comment: EntityCommentFieldsFragment;\n isReply?: boolean;\n busy: boolean;\n onResolve: (id: string, resolved: boolean) => void;\n onDelete: (id: string) => void;\n onReply?: (id: string) => void;\n}\n\nconst CommentItem: FC<CommentItemProps> = ({ comment, isReply, busy, onResolve, onDelete, onReply }) => {\n const { t } = useI18n();\n const resolved = !!comment.resolvedAt;\n const body = comment.content.text ?? comment.content.markdown ?? '';\n return (\n <div className={isReply ? 'pl-6' : ''}>\n <div className=\"rounded-md border border-border-default bg-bg-surface p-2.5\">\n <div className=\"flex items-center justify-between gap-2\">\n <span className=\"text-xs font-medium text-text-primary\">{authorLabel(t, comment.authorId)}</span>\n <span className=\"text-[10px] text-text-tertiary tabular-nums\">{formatWhen(comment.createdAt)}</span>\n </div>\n <p className=\"mt-1 whitespace-pre-wrap break-words text-sm text-text-secondary\">{body}</p>\n <div className=\"mt-1.5 flex items-center gap-2\">\n {resolved && (\n <span className=\"inline-flex items-center gap-1 rounded px-1.5 py-0.5 text-[10px] font-medium bg-status-success-bg text-status-success-text\">\n <Check className=\"h-3 w-3\" /> {t('bigconsole.widget.comments.resolvedBadge', 'Resolved')}\n </span>\n )}\n {onReply && (\n <button\n type=\"button\"\n disabled={busy}\n onClick={() => onReply(comment.id)}\n className=\"inline-flex items-center gap-1 text-[11px] text-text-tertiary hover:text-text-primary disabled:opacity-50\"\n >\n <CornerDownRight className=\"h-3 w-3\" /> {t('bigconsole.widget.comments.reply', 'Reply')}\n </button>\n )}\n <button\n type=\"button\"\n disabled={busy}\n onClick={() => onResolve(comment.id, !resolved)}\n className=\"inline-flex items-center gap-1 text-[11px] text-text-tertiary hover:text-text-primary disabled:opacity-50\"\n >\n {resolved ? <RotateCcw className=\"h-3 w-3\" /> : <Check className=\"h-3 w-3\" />}\n {resolved\n ? t('bigconsole.widget.comments.reopen', 'Reopen')\n : t('bigconsole.widget.comments.resolve', 'Resolve')}\n </button>\n <button\n type=\"button\"\n disabled={busy}\n onClick={() => onDelete(comment.id)}\n className=\"inline-flex items-center gap-1 text-[11px] text-status-error-text hover:opacity-80 disabled:opacity-50\"\n >\n <Trash2 className=\"h-3 w-3\" /> {t('bigconsole.widget.comments.delete', 'Delete')}\n </button>\n </div>\n </div>\n </div>\n );\n};\n\ninterface ComposerProps {\n placeholder: string;\n busy: boolean;\n autoFocus?: boolean;\n /* Returns false when the post failed — the draft is kept so it isn't lost. /\n onSubmit: (text: string) => boolean \| void \| Promise<boolean \| void>;\n onCancel?: () => void;\n}\n\nconst Composer: FC<ComposerProps> = ({ placeholder, busy, autoFocus, onSubmit, onCancel }) => {\n const { t } = useI18n();\n const [text, setText] = useState('');\n const submit = async () => {\n const v = text.trim();\n if (!v) return;\n // Only clear once the post succeeds; on failure the user keeps their draft.\n const ok = await onSubmit(v);\n if (ok !== false) setText('');\n };\n return (\n <div className=\"flex items-end gap-2\">\n <textarea\n autoFocus={autoFocus}\n value={text}\n onChange={(e) => setText(e.target.value)}\n onKeyDown={(e) => {\n if ((e.metaKey \|\| e.ctrlKey) && e.key === 'Enter') {\n e.preventDefault();\n void submit();\n }\n }}\n rows={2}\n placeholder={placeholder}\n className=\"flex-1 resize-none rounded-md border border-border-default bg-bg-surface px-2.5 py-1.5 text-sm text-text-primary placeholder:text-text-tertiary focus:outline-none focus:ring-2 focus:ring-action-primary-bg\"\n />\n <div className=\"flex flex-col gap-1\">\n <button\n type=\"button\"\n disabled={busy \|\| !text.trim()}\n onClick={() => void submit()}\n title={t('bigconsole.widget.comments.postTitle', 'Post (⌘/Ctrl + Enter)')}\n className=\"inline-flex items-center justify-center rounded-md bg-action-primary-bg p-1.5 text-action-primary-text hover:opacity-90 disabled:opacity-50\"\n >\n {busy ? <Loader2 className=\"h-4 w-4 animate-spin\" /> : <Send className=\"h-4 w-4\" />}\n </button>\n {onCancel && (\n <button\n type=\"button\"\n onClick={onCancel}\n className=\"inline-flex items-center justify-center rounded-md border border-border-default p-1.5 text-text-tertiary hover:text-text-primary\"\n title={t('bigconsole.widget.comments.cancelReplyTitle', 'Cancel reply')}\n >\n <X className=\"h-4 w-4\" />\n </button>\n )}\n </div>\n </div>\n );\n};\n\nexport const WidgetComments: FC<WidgetCommentsProps> = ({ widgetId, onClose }) => {\n const { t } = useI18n();\n const { threads, count, loading, error, mutating, addComment, resolveComment, deleteComment } =\n useWidgetComments(widgetId);\n const [replyTo, setReplyTo] = useState<string \| null>(null);\n\n const handleAdd = useCallback(\n async (text: string, parentId?: string): Promise<boolean> => {\n const ok = await addComment(text, parentId);\n if (ok && parentId) setReplyTo(null);\n return ok;\n },\n [addComment]\n );\n\n return (\n <div\n className=\"absolute inset-0 z-40 flex flex-col bg-bg-surface/98 backdrop-blur-sm\"\n role=\"dialog\"\n aria-label={t('bigconsole.widget.comments.dialogAriaLabel', 'Widget comments')}\n tabIndex={-1}\n onClick={(e) => e.stopPropagation()}\n onKeyDown={(e) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n onClose();\n }\n }}\n >\n {/ Header /}\n <div className=\"flex items-center justify-between border-b border-border-default px-3 py-2\">\n <div className=\"flex items-center gap-2 text-sm font-medium text-text-primary\">\n <MessageSquare className=\"h-4 w-4 text-text-secondary\" />\n {t('bigconsole.widget.comments.title', 'Comments')}\n <span className=\"rounded-full bg-bg-sunken px-1.5 py-0.5 text-[10px] text-text-secondary tabular-nums\">\n {count}\n </span>\n </div>\n <button\n type=\"button\"\n onClick={onClose}\n aria-label={t('bigconsole.widget.comments.closeAriaLabel', 'Close comments')}\n className=\"rounded-md p-1 text-text-tertiary hover:bg-bg-sunken hover:text-text-primary\"\n >\n <X className=\"h-4 w-4\" />\n </button>\n </div>\n\n {/ Thread list /}\n <div className=\"flex-1 space-y-3 overflow-auto p-3\">\n {loading && threads.length === 0 && (\n <div className=\"flex items-center justify-center py-8 text-text-tertiary\">\n <Loader2 className=\"h-5 w-5 animate-spin\" />\n </div>\n )}\n {error && !loading && (\n <p className=\"rounded-md bg-status-error-bg px-2.5 py-2 text-xs text-status-error-text\">\n {t('bigconsole.widget.comments.loadError', 'Couldn’t load comments.')}\n </p>\n )}\n {!loading && !error && threads.length === 0 && (\n <p className=\"py-8 text-center text-sm text-text-tertiary\">\n {t('bigconsole.widget.comments.empty', 'No comments yet. Start the conversation.')}\n </p>\n )}\n {threads.map(({ comment, replies }: WidgetCommentThread) => (\n <div key={comment.id} className=\"space-y-2\">\n <CommentItem\n comment={comment}\n busy={mutating}\n onResolve={(id, r) => void resolveComment(id, r)}\n onDelete={(id) => void deleteComment(id)}\n onReply={(id) => setReplyTo((cur) => (cur === id ? null : id))}\n />\n {replies.map((reply) => (\n <CommentItem\n key={reply.id}\n comment={reply}\n isReply\n busy={mutating}\n onResolve={(id, r) => void resolveComment(id, r)}\n onDelete={(id) => void deleteComment(id)}\n />\n ))}\n {replyTo === comment.id && (\n <div className=\"pl-6\">\n <Composer\n placeholder={t('bigconsole.widget.comments.replyPlaceholder', 'Write a reply…')}\n busy={mutating}\n autoFocus\n onSubmit={(text) => handleAdd(text, comment.id)}\n onCancel={() => setReplyTo(null)}\n />\n </div>\n )}\n </div>\n ))}\n </div>\n\n {/ New top-level comment */}\n <div className=\"border-t border-border-default p-3\">\n <Composer\n placeholder={t('bigconsole.widget.comments.addPlaceholder', 'Add a comment…')}\n busy={mutating}\n onSubmit={(text) => handleAdd(text)}\n />\n </div>\n </div>\n );\n};\n\nexport default WidgetComments;\n"],"mappings":"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"}
1	+ {"version":3,"file":"WidgetComments.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/comments/WidgetComments.tsx"],"sourcesContent":["/*\n WidgetComments\n \n Collaborative comment thread for a single widget, rendered as a slide-over\n * panel inside the widget container. Supports posting top-level comments and\n * threaded replies, resolving/reopening, and (soft) deleting. Data flows through\n * useWidgetComments → the federated EntityComment API.\n /\n\nimport { type FC, useState, useCallback } from 'react';\nimport { MessageSquare, Send, Check, RotateCcw, Trash2, X, CornerDownRight, Loader2 } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useWidgetComments, type WidgetCommentThread } from '../../../hooks/useWidgetComments';\nimport type { EntityCommentFieldsFragment } from '../../../../generated/wspace-operations';\n\nexport interface WidgetCommentsProps {\n widgetId: string;\n /* Close the panel. /\n onClose: () => void;\n}\n\nfunction authorLabel(\n t: (\n key: string,\n fallbackOrParams?: string \| Record<string, string \| number>,\n params?: Record<string, string \| number>\n ) => string,\n authorId: string\n): string {\n // We only have an opaque actor id here; show a short, stable handle.\n return t('bigconsole.widget.comments.authorLabel', 'User {{id}}', { id: authorId.slice(0, 6) });\n}\n\nfunction formatWhen(iso: string): string {\n const d = new Date(iso);\n if (Number.isNaN(d.getTime())) return '';\n return new Intl.DateTimeFormat(undefined, { dateStyle: 'medium', timeStyle: 'short' }).format(d);\n}\n\ninterface CommentItemProps {\n comment: EntityCommentFieldsFragment;\n isReply?: boolean;\n busy: boolean;\n onResolve: (id: string, resolved: boolean) => void;\n onDelete: (id: string) => void;\n onReply?: (id: string) => void;\n}\n\nconst CommentItem: FC<CommentItemProps> = ({ comment, isReply, busy, onResolve, onDelete, onReply }) => {\n const { t } = useI18n();\n const resolved = !!comment.resolvedAt;\n const body = comment.content.text ?? comment.content.markdown ?? '';\n return (\n <div className={isReply ? 'pl-6' : ''}>\n <div className=\"rounded-md border border-[var(--color-border-default)] bg-bg-surface p-2.5\">\n <div className=\"flex items-center justify-between gap-2\">\n <span className=\"text-xs font-medium text-text-primary\">{authorLabel(t, comment.authorId)}</span>\n <span className=\"text-[10px] text-text-muted tabular-nums\">{formatWhen(comment.createdAt)}</span>\n </div>\n <p className=\"mt-1 whitespace-pre-wrap break-words text-sm text-text-secondary\">{body}</p>\n <div className=\"mt-1.5 flex items-center gap-2\">\n {resolved && (\n <span className=\"inline-flex items-center gap-1 rounded px-1.5 py-0.5 text-[10px] font-medium bg-status-success-bg text-status-success-text\">\n <Check className=\"h-3 w-3\" /> {t('bigconsole.widget.comments.resolvedBadge', 'Resolved')}\n </span>\n )}\n {onReply && (\n <button\n type=\"button\"\n disabled={busy}\n onClick={() => onReply(comment.id)}\n className=\"inline-flex items-center gap-1 text-[11px] text-text-muted hover:text-text-primary disabled:opacity-50\"\n >\n <CornerDownRight className=\"h-3 w-3\" /> {t('bigconsole.widget.comments.reply', 'Reply')}\n </button>\n )}\n <button\n type=\"button\"\n disabled={busy}\n onClick={() => onResolve(comment.id, !resolved)}\n className=\"inline-flex items-center gap-1 text-[11px] text-text-muted hover:text-text-primary disabled:opacity-50\"\n >\n {resolved ? <RotateCcw className=\"h-3 w-3\" /> : <Check className=\"h-3 w-3\" />}\n {resolved\n ? t('bigconsole.widget.comments.reopen', 'Reopen')\n : t('bigconsole.widget.comments.resolve', 'Resolve')}\n </button>\n <button\n type=\"button\"\n disabled={busy}\n onClick={() => onDelete(comment.id)}\n className=\"inline-flex items-center gap-1 text-[11px] text-status-error-text hover:opacity-80 disabled:opacity-50\"\n >\n <Trash2 className=\"h-3 w-3\" /> {t('bigconsole.widget.comments.delete', 'Delete')}\n </button>\n </div>\n </div>\n </div>\n );\n};\n\ninterface ComposerProps {\n placeholder: string;\n busy: boolean;\n autoFocus?: boolean;\n /* Returns false when the post failed — the draft is kept so it isn't lost. /\n onSubmit: (text: string) => boolean \| void \| Promise<boolean \| void>;\n onCancel?: () => void;\n}\n\nconst Composer: FC<ComposerProps> = ({ placeholder, busy, autoFocus, onSubmit, onCancel }) => {\n const { t } = useI18n();\n const [text, setText] = useState('');\n const submit = async () => {\n const v = text.trim();\n if (!v) return;\n // Only clear once the post succeeds; on failure the user keeps their draft.\n const ok = await onSubmit(v);\n if (ok !== false) setText('');\n };\n return (\n <div className=\"flex items-end gap-2\">\n <textarea\n autoFocus={autoFocus}\n value={text}\n onChange={(e) => setText(e.target.value)}\n onKeyDown={(e) => {\n if ((e.metaKey \|\| e.ctrlKey) && e.key === 'Enter') {\n e.preventDefault();\n void submit();\n }\n }}\n rows={2}\n placeholder={placeholder}\n className=\"flex-1 resize-none rounded-md border border-[var(--color-border-default)] bg-bg-surface px-2.5 py-1.5 text-sm text-text-primary placeholder:text-text-muted focus:outline-none focus:ring-2 focus:ring-action-primary-bg\"\n />\n <div className=\"flex flex-col gap-1\">\n <button\n type=\"button\"\n disabled={busy \|\| !text.trim()}\n onClick={() => void submit()}\n title={t('bigconsole.widget.comments.postTitle', 'Post (⌘/Ctrl + Enter)')}\n className=\"inline-flex items-center justify-center rounded-md bg-action-primary-bg p-1.5 text-action-primary-text hover:opacity-90 disabled:opacity-50\"\n >\n {busy ? <Loader2 className=\"h-4 w-4 animate-spin\" /> : <Send className=\"h-4 w-4\" />}\n </button>\n {onCancel && (\n <button\n type=\"button\"\n onClick={onCancel}\n className=\"inline-flex items-center justify-center rounded-md border border-[var(--color-border-default)] p-1.5 text-text-muted hover:text-text-primary\"\n title={t('bigconsole.widget.comments.cancelReplyTitle', 'Cancel reply')}\n >\n <X className=\"h-4 w-4\" />\n </button>\n )}\n </div>\n </div>\n );\n};\n\nexport const WidgetComments: FC<WidgetCommentsProps> = ({ widgetId, onClose }) => {\n const { t } = useI18n();\n const { threads, count, loading, error, mutating, addComment, resolveComment, deleteComment } =\n useWidgetComments(widgetId);\n const [replyTo, setReplyTo] = useState<string \| null>(null);\n\n const handleAdd = useCallback(\n async (text: string, parentId?: string): Promise<boolean> => {\n const ok = await addComment(text, parentId);\n if (ok && parentId) setReplyTo(null);\n return ok;\n },\n [addComment]\n );\n\n return (\n <div\n className=\"absolute inset-0 z-40 flex flex-col bg-bg-surface/98 backdrop-blur-sm\"\n role=\"dialog\"\n aria-label={t('bigconsole.widget.comments.dialogAriaLabel', 'Widget comments')}\n tabIndex={-1}\n onClick={(e) => e.stopPropagation()}\n onKeyDown={(e) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n onClose();\n }\n }}\n >\n {/\n Header. Matches the widget card's own title band exactly — same padding,\n same seam, same semibold title — so opening comments does not change the\n card's header grammar mid-flight (BOFF-5636).\n /}\n <div className=\"flex min-w-0 items-center justify-between gap-2 border-b border-[var(--color-border-subtle)] bg-bg-surface px-3 py-2 sm:px-4\">\n <h3 className=\"flex min-w-0 items-center gap-2 text-sm font-semibold leading-tight tracking-tight text-text-primary\">\n <MessageSquare aria-hidden=\"true\" className=\"h-icon-sm w-icon-sm shrink-0 text-text-secondary\" />\n {t('bigconsole.widget.comments.title', 'Comments')}\n <span className=\"rounded-full bg-bg-sunken px-1.5 py-0.5 text-[10px] text-text-secondary tabular-nums\">\n {count}\n </span>\n </h3>\n <button\n type=\"button\"\n onClick={onClose}\n aria-label={t('bigconsole.widget.comments.closeAriaLabel', 'Close comments')}\n className=\"shrink-0 rounded-button p-1 text-text-muted hover:bg-bg-sunken hover:text-text-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface\"\n >\n <X className=\"h-4 w-4\" />\n </button>\n </div>\n\n {/ Thread list /}\n <div className=\"flex-1 space-y-3 overflow-auto p-3\">\n {loading && threads.length === 0 && (\n <div className=\"flex items-center justify-center py-8 text-text-muted\">\n <Loader2 className=\"h-5 w-5 animate-spin\" />\n </div>\n )}\n {error && !loading && (\n <p\n role=\"alert\"\n className=\"rounded-input border border-[var(--color-status-error-border)] bg-status-error-bg-subtle px-2.5 py-2 text-xs text-[var(--color-status-error-text)]\"\n >\n {t('bigconsole.widget.comments.loadError', 'Couldn’t load comments.')}\n </p>\n )}\n {!loading && !error && threads.length === 0 && (\n <p className=\"py-8 text-center text-sm text-text-muted\">\n {t('bigconsole.widget.comments.empty', 'No comments yet. Start the conversation.')}\n </p>\n )}\n {threads.map(({ comment, replies }: WidgetCommentThread) => (\n <div key={comment.id} className=\"space-y-2\">\n <CommentItem\n comment={comment}\n busy={mutating}\n onResolve={(id, r) => void resolveComment(id, r)}\n onDelete={(id) => void deleteComment(id)}\n onReply={(id) => setReplyTo((cur) => (cur === id ? null : id))}\n />\n {replies.map((reply) => (\n <CommentItem\n key={reply.id}\n comment={reply}\n isReply\n busy={mutating}\n onResolve={(id, r) => void resolveComment(id, r)}\n onDelete={(id) => void deleteComment(id)}\n />\n ))}\n {replyTo === comment.id && (\n <div className=\"pl-6\">\n <Composer\n placeholder={t('bigconsole.widget.comments.replyPlaceholder', 'Write a reply…')}\n busy={mutating}\n autoFocus\n onSubmit={(text) => handleAdd(text, comment.id)}\n onCancel={() => setReplyTo(null)}\n />\n </div>\n )}\n </div>\n ))}\n </div>\n\n {/ New top-level comment */}\n <div className=\"border-t border-[var(--color-border-default)] p-3\">\n <Composer\n placeholder={t('bigconsole.widget.comments.addPlaceholder', 'Add a comment…')}\n busy={mutating}\n onSubmit={(text) => handleAdd(text)}\n />\n </div>\n </div>\n );\n};\n\nexport default WidgetComments;\n"],"mappings":"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"}