@sybilion/uilib 1.3.8 → 1.3.10

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 (8) hide show
  1. package/dist/esm/components/ui/ChartAreaInteractive/ChartAreaInteractive.js +4 -2
  2. package/dist/esm/components/ui/Page/PageFooter/PageFooter.styl.js +1 -1
  3. package/dist/esm/types/src/components/ui/ChartAreaInteractive/ChartAreaInteractive.d.ts +1 -1
  4. package/dist/esm/types/src/components/ui/ChartAreaInteractive/ChartAreaInteractive.types.d.ts +2 -0
  5. package/package.json +1 -1
  6. package/src/components/ui/ChartAreaInteractive/ChartAreaInteractive.tsx +4 -1
  7. package/src/components/ui/ChartAreaInteractive/ChartAreaInteractive.types.ts +2 -0
  8. package/src/components/ui/Page/PageFooter/PageFooter.styl +3 -0
package/dist/esm/components/ui/ChartAreaInteractive/ChartAreaInteractive.js CHANGED
@@ -16,7 +16,7 @@ import { ThresholdsOverlay } from './overlays/ThresholdsOverlay/ThresholdsOverla
16
16
  const chartConfig = {
17
17
  // Chart now supports light/dark themes with dynamic colors
18
18
  };
19
- function ChartAreaInteractive({ className, chartContainerClassName, legendClassName, xAxisClassName, yAxisClassName, timeRange, onTimeRangeChange, pinMonth, onPinMonthChange, onPreviewMonthChange, chartData, forecastData, error, loading = false, isDarkTheme = false, footerActions, mode, selectedForecast, upperQuantiles, lowerQuantiles, selectedLowerQuantile, selectedUpperQuantile, onLowerQuantileChange, onUpperQuantileChange, lowerThreshold, upperThreshold, onLowerThresholdChange, onUpperThresholdChange, discreteThresholdValues, headerActions, excludeLegendIds, loadingAnalyses, onLegendClick, onAnalysisSelect, disableTimeRangeSelector, forecastLineStyle = 'dashed', selectedAnalysisId, chartRenderId, toggleLegendSeries, ensureAnalysisSeriesVisible, overlayForecastData = {}, hiddenSeries, disableForecastHistoricalBridge, overlayElements: overlayElementsProp, ...restProps }) {
19
+ function ChartAreaInteractive({ className, chartContainerClassName, legendClassName, xAxisClassName, yAxisClassName, timeRange, onTimeRangeChange, pinMonth, onPinMonthChange, onPreviewMonthChange, chartData, forecastData, error, loading = false, isDarkTheme = false, footerActions, mode, selectedForecast, upperQuantiles, lowerQuantiles, selectedLowerQuantile, selectedUpperQuantile, onLowerQuantileChange, onUpperQuantileChange, lowerThreshold, upperThreshold, onLowerThresholdChange, onUpperThresholdChange, discreteThresholdValues, headerActions, excludeLegendIds, loadingAnalyses, onLegendClick, onAnalysisSelect, disableTimeRangeSelector, enableTimeRangeBrush = false, forecastLineStyle = 'dashed', selectedAnalysisId, chartRenderId, toggleLegendSeries, ensureAnalysisSeriesVisible, overlayForecastData = {}, hiddenSeries, disableForecastHistoricalBridge, overlayElements: overlayElementsProp, ...restProps }) {
20
20
  const seriesHidden = hiddenSeries ?? new Set();
21
21
  const hiddenSeriesRef = useRef(seriesHidden);
22
22
  const prevSelectedAnalysisIdRef = useRef(selectedAnalysisId);
@@ -95,7 +95,9 @@ function ChartAreaInteractive({ className, chartContainerClassName, legendClassN
95
95
  // loadingAnalyses,
96
96
  ...restProps,
97
97
  };
98
- const brushEnabled = !disableTimeRangeSelector && !loading && bridgedChartData.length > 1;
98
+ const brushEnabled = (!disableTimeRangeSelector || enableTimeRangeBrush) &&
99
+ !loading &&
100
+ bridgedChartData.length > 1;
99
101
  const renderChart = () => {
100
102
  const overlayClassName = cn(chartContainerClassName);
101
103
  switch (mode) {
package/dist/esm/components/ui/Page/PageFooter/PageFooter.styl.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import styleInject from 'style-inject';
2
2
 
3
- var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.PageFooter_root__TAfX6{display:flex;flex-direction:column;gap:6px;padding:var(--p-5) var(--p-10)}.PageFooter_line__OyGA-{align-items:center;display:flex;flex-wrap:wrap;justify-content:space-between}.PageFooter_line__OyGA-:last-child{min-height:55px}.PageFooter_meta__Gvenf{align-items:center;display:flex;flex-wrap:wrap;gap:var(--p-4)}.PageFooter_copyright__4LFUP{font-size:14px}.PageFooter_links__q5BXo{align-items:center;display:flex;flex-wrap:wrap;gap:var(--p-4)}.PageFooter_link__mel3N{align-items:center;color:var(--foreground);display:inline-flex;font-size:14px;gap:var(--p-2);text-decoration:none}.PageFooter_link__mel3N:hover{text-decoration:underline}.PageFooter_link__mel3N svg{color:var(--brand-color-400);flex-shrink:0;height:20px;width:20px}.PageFooter_logo__B2SRg{align-items:center;display:flex;font-size:var(--text-2xl);position:relative}.PageFooter_logo__B2SRg a{align-items:center;color:var(--foreground);display:flex;gap:var(--p-2);text-decoration:none}.PageFooter_logo__B2SRg svg{height:24px;width:24px}.PageFooter_version__8pZXn{align-items:center;bottom:5px;color:var(--muted-foreground);display:flex;font-size:14px;left:calc(100% + 10px);opacity:.5;position:absolute;transition:opacity .3s ease-out;white-space:nowrap}.PageFooter_version__8pZXn:before{content:\"v\"}.PageFooter_versionLink__dILP5{color:inherit;text-decoration:none}.PageFooter_logo__B2SRg:hover .PageFooter_version__8pZXn{opacity:1}";
3
+ var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.PageFooter_root__TAfX6{display:flex;flex-direction:column;gap:6px;padding:var(--p-5) var(--p-10)}@media (max-width:768px){.PageFooter_root__TAfX6{padding:var(--p-10) var(--p-6)}}.PageFooter_line__OyGA-{align-items:center;display:flex;flex-wrap:wrap;justify-content:space-between}.PageFooter_line__OyGA-:last-child{min-height:55px}.PageFooter_meta__Gvenf{align-items:center;display:flex;flex-wrap:wrap;gap:var(--p-4)}.PageFooter_copyright__4LFUP{font-size:14px}.PageFooter_links__q5BXo{align-items:center;display:flex;flex-wrap:wrap;gap:var(--p-4)}.PageFooter_link__mel3N{align-items:center;color:var(--foreground);display:inline-flex;font-size:14px;gap:var(--p-2);text-decoration:none}.PageFooter_link__mel3N:hover{text-decoration:underline}.PageFooter_link__mel3N svg{color:var(--brand-color-400);flex-shrink:0;height:20px;width:20px}.PageFooter_logo__B2SRg{align-items:center;display:flex;font-size:var(--text-2xl);position:relative}.PageFooter_logo__B2SRg a{align-items:center;color:var(--foreground);display:flex;gap:var(--p-2);text-decoration:none}.PageFooter_logo__B2SRg svg{height:24px;width:24px}.PageFooter_version__8pZXn{align-items:center;bottom:5px;color:var(--muted-foreground);display:flex;font-size:14px;left:calc(100% + 10px);opacity:.5;position:absolute;transition:opacity .3s ease-out;white-space:nowrap}.PageFooter_version__8pZXn:before{content:\"v\"}.PageFooter_versionLink__dILP5{color:inherit;text-decoration:none}.PageFooter_logo__B2SRg:hover .PageFooter_version__8pZXn{opacity:1}";
4
4
  var S = {"root":"PageFooter_root__TAfX6","line":"PageFooter_line__OyGA-","meta":"PageFooter_meta__Gvenf","copyright":"PageFooter_copyright__4LFUP","links":"PageFooter_links__q5BXo","link":"PageFooter_link__mel3N","logo":"PageFooter_logo__B2SRg","version":"PageFooter_version__8pZXn","versionLink":"PageFooter_versionLink__dILP5"};
5
5
  styleInject(css_248z);
6
6
 
package/dist/esm/types/src/components/ui/ChartAreaInteractive/ChartAreaInteractive.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { ChartAreaInteractiveProps } from './ChartAreaInteractive.types';
2
2
  export declare const chartConfig: {};
3
- export declare function ChartAreaInteractive({ className, chartContainerClassName, legendClassName, xAxisClassName, yAxisClassName, timeRange, onTimeRangeChange, pinMonth, onPinMonthChange, onPreviewMonthChange, chartData, forecastData, error, loading, isDarkTheme, footerActions, mode, selectedForecast, upperQuantiles, lowerQuantiles, selectedLowerQuantile, selectedUpperQuantile, onLowerQuantileChange, onUpperQuantileChange, lowerThreshold, upperThreshold, onLowerThresholdChange, onUpperThresholdChange, discreteThresholdValues, headerActions, excludeLegendIds, loadingAnalyses, onLegendClick, onAnalysisSelect, disableTimeRangeSelector, forecastLineStyle, selectedAnalysisId, chartRenderId, toggleLegendSeries, ensureAnalysisSeriesVisible, overlayForecastData, hiddenSeries, disableForecastHistoricalBridge, overlayElements: overlayElementsProp, ...restProps }: ChartAreaInteractiveProps): import("react/jsx-runtime").JSX.Element;
3
+ export declare function ChartAreaInteractive({ className, chartContainerClassName, legendClassName, xAxisClassName, yAxisClassName, timeRange, onTimeRangeChange, pinMonth, onPinMonthChange, onPreviewMonthChange, chartData, forecastData, error, loading, isDarkTheme, footerActions, mode, selectedForecast, upperQuantiles, lowerQuantiles, selectedLowerQuantile, selectedUpperQuantile, onLowerQuantileChange, onUpperQuantileChange, lowerThreshold, upperThreshold, onLowerThresholdChange, onUpperThresholdChange, discreteThresholdValues, headerActions, excludeLegendIds, loadingAnalyses, onLegendClick, onAnalysisSelect, disableTimeRangeSelector, enableTimeRangeBrush, forecastLineStyle, selectedAnalysisId, chartRenderId, toggleLegendSeries, ensureAnalysisSeriesVisible, overlayForecastData, hiddenSeries, disableForecastHistoricalBridge, overlayElements: overlayElementsProp, ...restProps }: ChartAreaInteractiveProps): import("react/jsx-runtime").JSX.Element;
package/dist/esm/types/src/components/ui/ChartAreaInteractive/ChartAreaInteractive.types.d.ts CHANGED
@@ -47,6 +47,8 @@ export interface ChartAreaInteractiveProps extends BaseChartWrapperProps {
47
47
  loadingAnalyses?: Set<string>;
48
48
  onLegendClick?: (data: LegendPayload) => undefined | boolean;
49
49
  disableTimeRangeSelector?: boolean;
50
+ /** When selector hidden (`disableTimeRangeSelector`), still allow drag brush on chart (defaults false). */
51
+ enableTimeRangeBrush?: boolean;
50
52
  forecastLineStyle?: 'dashed' | 'solid';
51
53
  /** When set, ensures this analysis is visible (selected) in chart legend */
52
54
  selectedAnalysisId?: number | null;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sybilion/uilib",
3
- "version": "1.3.8",
3
+ "version": "1.3.10",
4
4
  "description": "Sybilion Design System — React UI components (Webpack + Stylus)",
5
5
  "publishConfig": {
6
6
  "access": "public",
package/src/components/ui/ChartAreaInteractive/ChartAreaInteractive.tsx CHANGED
@@ -61,6 +61,7 @@ export function ChartAreaInteractive({
61
61
  onLegendClick,
62
62
  onAnalysisSelect,
63
63
  disableTimeRangeSelector,
64
+ enableTimeRangeBrush = false,
64
65
  forecastLineStyle = 'dashed',
65
66
  selectedAnalysisId,
66
67
  chartRenderId,
@@ -169,7 +170,9 @@ export function ChartAreaInteractive({
169
170
  };
170
171
 
171
172
  const brushEnabled =
172
- !disableTimeRangeSelector && !loading && bridgedChartData.length > 1;
173
+ (!disableTimeRangeSelector || enableTimeRangeBrush) &&
174
+ !loading &&
175
+ bridgedChartData.length > 1;
173
176
 
174
177
  const renderChart = () => {
175
178
  const overlayClassName = cn(chartContainerClassName);
package/src/components/ui/ChartAreaInteractive/ChartAreaInteractive.types.ts CHANGED
@@ -51,6 +51,8 @@ export interface ChartAreaInteractiveProps extends BaseChartWrapperProps {
51
51
  loadingAnalyses?: Set<string>;
52
52
  onLegendClick?: (data: LegendPayload) => undefined | boolean;
53
53
  disableTimeRangeSelector?: boolean;
54
+ /** When selector hidden (`disableTimeRangeSelector`), still allow drag brush on chart (defaults false). */
55
+ enableTimeRangeBrush?: boolean;
54
56
  forecastLineStyle?: 'dashed' | 'solid';
55
57
  /** When set, ensures this analysis is visible (selected) in chart legend */
56
58
  selectedAnalysisId?: number | null;
package/src/components/ui/Page/PageFooter/PageFooter.styl CHANGED
@@ -6,6 +6,9 @@
6
6
  gap 6px
7
7
  padding var(--p-5) var(--p-10)
8
8
 
9
+ @media (max-width: MOBILE)
10
+ padding var(--p-10) var(--p-6)
11
+
9
12
  .line
10
13
  display flex
11
14
  align-items center