@oicl/openbridge-webcomponents-svelte 2.0.0-next.13 → 2.0.0-next.131

package/dist/automation/transmitter/ObcTransmitter.svelte.d.ts

@@ -0,0 +1,48 @@
+import '@oicl/openbridge-webcomponents/dist/automation/transmitter/transmitter.js';
+import type { TransmitterOrientation, TransmitterType } from '@oicl/openbridge-webcomponents/dist/automation/transmitter/transmitter.js';
+import type { LineType } from '@oicl/openbridge-webcomponents/dist/automation/index.js';
+import type { TransmitterButtonSize } from '@oicl/openbridge-webcomponents/dist/automation/transmitter-button/transmitter-button.js';
+import type { Snippet } from 'svelte';
+export interface Props {
+    class?: string;
+    style?: string;
+    orientation?: TransmitterOrientation;
+    type?: TransmitterType;
+    lineType?: LineType | undefined;
+    value?: number | null | undefined;
+    unit?: string;
+    fractionDigits?: number;
+    /** Integer digits to reserve / hint (independent of `fractionDigits`). */
+    maxDigits?: number;
+    hintedZeros?: boolean;
+    size?: TransmitterButtonSize;
+    hasIcon?: boolean;
+    hasAdvice?: boolean;
+    /** Wrap the transmitter in an `<obc-alert-frame>` (alarm) when true. */
+    hasAlert?: boolean;
+    /** Advisory value shown in the leading advice segment when `hasAdvice`. */
+    adviceValue?: number | null | undefined;
+    hasSetPoint?: boolean;
+    /** Target value shown in the setpoint segment when `hasSetPoint`. */
+    setpointValue?: number | null | undefined;
+    /** Tag identifier shown when `type` is `indicator` (e.g. `TT`). */
+    tag?: string;
+    /** Optional identifier shown below the chip (e.g. `#0000`). */
+    idTag?: string;
+    /** Trend data for the graph types: `[xValues, yValues]`. */
+    data?: [number[], number[]];
+}
+export interface Events {
+}
+export interface Slots {
+    icon?: Snippet;
+}
+type $$ComponentProps = Props & Events & Slots;
+declare const ObcTransmitter: import("svelte").Component<$$ComponentProps, {
+    TransmitterOrientation: typeof TransmitterOrientation;
+    TransmitterType: typeof TransmitterType;
+    LineType: typeof LineType;
+    TransmitterButtonSize: typeof TransmitterButtonSize;
+}, "">;
+type ObcTransmitter = ReturnType<typeof ObcTransmitter>;
+export default ObcTransmitter;

package/dist/automation/transmitter-button/ObcTransmitterButton.svelte

@@ -0,0 +1,50 @@
+
+  <script lang="ts">
+    export type {TransmitterButtonVariant, TransmitterButtonSize} from '@oicl/openbridge-webcomponents/dist/automation/transmitter-button/transmitter-button.js';
+      import '@oicl/openbridge-webcomponents/dist/automation/transmitter-button/transmitter-button.js';
+      import { setProperties } from "../../util.js";
+      import type {TransmitterButtonVariant, TransmitterButtonSize} from '@oicl/openbridge-webcomponents/dist/automation/transmitter-button/transmitter-button.js';
+      import type { Snippet } from 'svelte';
+
+      export interface Props {
+     class?: string;
+     style?: string;
+     variant?: TransmitterButtonVariant;
+     size?: TransmitterButtonSize;
+     value?: number | null | undefined;
+     unit?: string;
+     fractionDigits?: number;
+      /** Integer digits to reserve / hint (independent of `fractionDigits`). */
+maxDigits?: number;
+     hintedZeros?: boolean;
+     hasIcon?: boolean;
+     hasAdvice?: boolean;
+      /** Advisory value shown in the leading advice segment when `hasAdvice`. */
+adviceValue?: number | null | undefined;
+     hasSetPoint?: boolean;
+      /** Target value shown in the setpoint segment when `hasSetPoint`. */
+setpointValue?: number | null | undefined;
+      /** Short tag identifier shown in the `tag` variant (e.g. `TT`). */
+label?: string
+   }
+      export interface Events {
+    
+  }
+      export interface Slots {
+  icon?: Snippet
+}
+      const { class: className, style, icon, ...props} = $props<Props & Events & Slots>();
+
+    </script>
+    <obc-transmitter-button
+    use:setProperties={props}
+    class={className}
+    style={style}
+     >
+      
+      {#if icon}
+        <div slot="icon">
+          {@render icon()}
+        </div>
+      {/if}
+    </obc-transmitter-button>

package/dist/automation/transmitter-button/ObcTransmitterButton.svelte.d.ts

@@ -0,0 +1,36 @@
+import '@oicl/openbridge-webcomponents/dist/automation/transmitter-button/transmitter-button.js';
+import type { TransmitterButtonVariant, TransmitterButtonSize } from '@oicl/openbridge-webcomponents/dist/automation/transmitter-button/transmitter-button.js';
+import type { Snippet } from 'svelte';
+export interface Props {
+    class?: string;
+    style?: string;
+    variant?: TransmitterButtonVariant;
+    size?: TransmitterButtonSize;
+    value?: number | null | undefined;
+    unit?: string;
+    fractionDigits?: number;
+    /** Integer digits to reserve / hint (independent of `fractionDigits`). */
+    maxDigits?: number;
+    hintedZeros?: boolean;
+    hasIcon?: boolean;
+    hasAdvice?: boolean;
+    /** Advisory value shown in the leading advice segment when `hasAdvice`. */
+    adviceValue?: number | null | undefined;
+    hasSetPoint?: boolean;
+    /** Target value shown in the setpoint segment when `hasSetPoint`. */
+    setpointValue?: number | null | undefined;
+    /** Short tag identifier shown in the `tag` variant (e.g. `TT`). */
+    label?: string;
+}
+export interface Events {
+}
+export interface Slots {
+    icon?: Snippet;
+}
+type $$ComponentProps = Props & Events & Slots;
+declare const ObcTransmitterButton: import("svelte").Component<$$ComponentProps, {
+    TransmitterButtonVariant: typeof TransmitterButtonVariant;
+    TransmitterButtonSize: typeof TransmitterButtonSize;
+}, "">;
+type ObcTransmitterButton = ReturnType<typeof ObcTransmitterButton>;
+export default ObcTransmitterButton;

package/dist/bars-graphs/area-graph/ObcAreaGraph.svelte

@@ -1,14 +1,115 @@
 
   <script lang="ts">
-    export type {AreaFillMode} from '@oicl/openbridge-webcomponents/dist/bars-graphs/area-graph/area-graph.js';
+    export type {ChartLineDataItem, ChartLinePoint, XAxisType, YAxisPosition, ChartLineYAxisConfig, LineMode, TimeDisplay} from '@oicl/openbridge-webcomponents/dist/building-blocks/chart-line/chart-line-base.js';
+export type {ChartDataset} from 'chart.js';
+export type {InstrumentState, Priority, FrameStyle, BorderRadiusPosition} from '@oicl/openbridge-webcomponents/dist/navigation-instruments/types.js';
+export type {AreaFillMode} from '@oicl/openbridge-webcomponents/dist/bars-graphs/area-graph/area-graph.js';
       import '@oicl/openbridge-webcomponents/dist/bars-graphs/area-graph/area-graph.js';
       import { setProperties } from "../../util.js";
-      import type {AreaFillMode} from '@oicl/openbridge-webcomponents/dist/bars-graphs/area-graph/area-graph.js';
+      import type {ChartLineDataItem, ChartLinePoint, XAxisType, YAxisPosition, ChartLineYAxisConfig, LineMode, TimeDisplay} from '@oicl/openbridge-webcomponents/dist/building-blocks/chart-line/chart-line-base.js';
+import type {ChartDataset} from 'chart.js';
+import type {InstrumentState, Priority, FrameStyle, BorderRadiusPosition} from '@oicl/openbridge-webcomponents/dist/navigation-instruments/types.js';
+import type {AreaFillMode} from '@oicl/openbridge-webcomponents/dist/bars-graphs/area-graph/area-graph.js';
       import type { Snippet } from 'svelte';
 
       export interface Props {
      class?: string;
      style?: string;
+      /** Simple single-series data. `{label, value}` items for the category axis;
+`{x, value}` items for time/number axes (x: epoch ms, ISO string, Date,
+or Temporal object). Points are drawn in array order (no sorting). */
+data?: ChartLineDataItem[];
+      /** Chart.js-style datasets for multi-series use. If provided, takes precedence over `data`. */
+datasets?: ChartDataset<"line", ChartLinePoint[]>[] | undefined;
+      /** Optional explicit labels for the x-axis (category mode). If omitted labels are derived from `data` */
+labels?: (string | number)[] | undefined;
+      /** Custom color palette (CSS variable names or color strings). */
+colors?: string[];
+      /** Show HTML legend below chart with series labels and colors. */
+legend?: boolean;
+      /** Development mode: show visual debug overlay with dimension guides. */
+showDebugOverlay?: boolean;
+      /** Width of the chart in pixels. Default: 480. */
+width?: number;
+      /** Height of the chart in pixels. Default: 320. */
+height?: number;
+      /** Enable fixed aspect ratio scaling mode.
+When true, width/height properties define the aspect ratio (not actual pixels).
+The component fills 100% of parent width and calculates height from aspect ratio.
+When false (default), width/height are used as actual pixel dimensions. */
+fixedAspectRatioScaling?: boolean;
+      /** Reference size for external scales when using fixedAspectRatioScaling.
+This value is passed down to external scales to determine their 1:1 Figma design size.
+At this reference size, scales render at native size; above/below they scale proportionally.
+Default: 384 (matches Figma design baseline). */
+scaleReferenceSize?: number;
+      /** X-axis mode: 'category' for labeled, evenly spaced data points; 'time'
+for time-based data positioned proportionally; 'number' for plain
+numeric x-values. */
+xAxisType?: XAxisType;
+      /** Single y-axis position ('left' or 'right'). For multiple y-axes, use yAxes instead. */
+yAxisPosition?: YAxisPosition;
+      /** Multiple y-axis definitions for complex multi-axis charts. */
+yAxes?: ChartLineYAxisConfig[] | undefined;
+      /** Show grid lines. */
+showGrid?: boolean;
+      /** Show vertical grid lines (x-axis). Default: false. */
+showGridX?: boolean;
+      /** Show horizontal grid lines (y-axis). Default: false. */
+showGridY?: boolean;
+      /** Show axis tick marks and labels. */
+showTickMarks?: boolean;
+      /** Reserve canvas padding for axis tick labels on sides without an external scale.
+
+When `true` (default), the chart leaves room for tick labels and renders them
+(subject to `showTickMarks` and the 192px auto-compact threshold).
+
+When `false`, the chart renders edge-to-edge on sides without a slotted external
+scale AND axis tick labels are force-hidden so they cannot be clipped. This also
+suppresses the automatic edge-to-edge switch that normally happens below the
+192px threshold, eliminating the visible padding "jump" when crossing it.
+
+Useful when embedding the chart inside another component that owns framing
+and never wants to show axis labels (e.g. `obc-automation-tank`).
+
+Defaults to `true` to preserve existing behavior. Declared with `attribute: false`
+because a `true`-default boolean cannot work as an HTML boolean attribute. */
+hasLabelPadding?: boolean;
+      /** Show point markers on data points. Default: false. */
+showPoints?: boolean;
+      /** Line drawing style: 'smooth' (curved), 'straight', or 'stepped'. */
+lineMode?: LineMode;
+      /** Unit label displayed in tooltips (e.g., 'kW', 'kg', '%'). */
+unit?: string;
+      /** Time axis label format: 'date' (full date/time) or 'minutes' (relative). */
+timeDisplay?: TimeDisplay;
+      /** Max number of x-axis ticks/grid lines. Useful for matching external axes. */
+xTicksLimit?: number | undefined;
+      /** Force x-axis tick interval. Useful for matching external axes. */
+xStepSize?: number | undefined;
+      /** Max number of y-axis ticks/grid lines. Useful for matching external axes. */
+yTicksLimit?: number | undefined;
+      /** Force y-axis tick interval. Useful for matching external axes. */
+yStepSize?: number | undefined;
+      /** Instrument state affecting colors of external scales. */
+state?: InstrumentState;
+      /** Color priority: enhanced uses blue palette instead of default gray. */
+priority?: Priority;
+      /** Frame style for chart and external scales. */
+frameStyle?: FrameStyle;
+      /** Border radius position for the chart's own border. */
+borderRadiusPosition?: BorderRadiusPosition | undefined;
+      /** Border radius position for external scales based on layout. */
+borderRadiusPositionExternalScales?: BorderRadiusPosition | undefined;
+      /** When true, the chart is used inside an instrument (e.g., gauge-trend).
+In this mode, only label font size responds to .obc-component-size-* CSS classes.
+Border radius uses the explicit `borderRadius` property value (or defaults to 8px),
+rather than reading from CSS variables. */
+instrumentMode?: boolean;
+      /** Explicit border radius value in pixels.
+When instrumentMode=true, this value is used directly (defaults to 8px).
+When instrumentMode=false, this is ignored and border radius is read from CSS variable. */
+borderRadius?: number | undefined;
       /** Fill rendering mode for area charts.
 - `'semitransparent'`: 50% alpha fill (default)
 - `'solid'`: Opaque fill

package/dist/bars-graphs/area-graph/ObcAreaGraph.svelte.d.ts

@@ -1,9 +1,107 @@
 import '@oicl/openbridge-webcomponents/dist/bars-graphs/area-graph/area-graph.js';
+import type { ChartLineDataItem, ChartLinePoint, XAxisType, YAxisPosition, ChartLineYAxisConfig, LineMode, TimeDisplay } from '@oicl/openbridge-webcomponents/dist/building-blocks/chart-line/chart-line-base.js';
+import type { ChartDataset } from 'chart.js';
+import type { InstrumentState, Priority, FrameStyle, BorderRadiusPosition } from '@oicl/openbridge-webcomponents/dist/navigation-instruments/types.js';
 import type { AreaFillMode } from '@oicl/openbridge-webcomponents/dist/bars-graphs/area-graph/area-graph.js';
 import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
+    /** Simple single-series data. `{label, value}` items for the category axis;
+`{x, value}` items for time/number axes (x: epoch ms, ISO string, Date,
+or Temporal object). Points are drawn in array order (no sorting). */
+    data?: ChartLineDataItem[];
+    /** Chart.js-style datasets for multi-series use. If provided, takes precedence over `data`. */
+    datasets?: ChartDataset<"line", ChartLinePoint[]>[] | undefined;
+    /** Optional explicit labels for the x-axis (category mode). If omitted labels are derived from `data` */
+    labels?: (string | number)[] | undefined;
+    /** Custom color palette (CSS variable names or color strings). */
+    colors?: string[];
+    /** Show HTML legend below chart with series labels and colors. */
+    legend?: boolean;
+    /** Development mode: show visual debug overlay with dimension guides. */
+    showDebugOverlay?: boolean;
+    /** Width of the chart in pixels. Default: 480. */
+    width?: number;
+    /** Height of the chart in pixels. Default: 320. */
+    height?: number;
+    /** Enable fixed aspect ratio scaling mode.
+When true, width/height properties define the aspect ratio (not actual pixels).
+The component fills 100% of parent width and calculates height from aspect ratio.
+When false (default), width/height are used as actual pixel dimensions. */
+    fixedAspectRatioScaling?: boolean;
+    /** Reference size for external scales when using fixedAspectRatioScaling.
+This value is passed down to external scales to determine their 1:1 Figma design size.
+At this reference size, scales render at native size; above/below they scale proportionally.
+Default: 384 (matches Figma design baseline). */
+    scaleReferenceSize?: number;
+    /** X-axis mode: 'category' for labeled, evenly spaced data points; 'time'
+for time-based data positioned proportionally; 'number' for plain
+numeric x-values. */
+    xAxisType?: XAxisType;
+    /** Single y-axis position ('left' or 'right'). For multiple y-axes, use yAxes instead. */
+    yAxisPosition?: YAxisPosition;
+    /** Multiple y-axis definitions for complex multi-axis charts. */
+    yAxes?: ChartLineYAxisConfig[] | undefined;
+    /** Show grid lines. */
+    showGrid?: boolean;
+    /** Show vertical grid lines (x-axis). Default: false. */
+    showGridX?: boolean;
+    /** Show horizontal grid lines (y-axis). Default: false. */
+    showGridY?: boolean;
+    /** Show axis tick marks and labels. */
+    showTickMarks?: boolean;
+    /** Reserve canvas padding for axis tick labels on sides without an external scale.
+
+When `true` (default), the chart leaves room for tick labels and renders them
+(subject to `showTickMarks` and the 192px auto-compact threshold).
+
+When `false`, the chart renders edge-to-edge on sides without a slotted external
+scale AND axis tick labels are force-hidden so they cannot be clipped. This also
+suppresses the automatic edge-to-edge switch that normally happens below the
+192px threshold, eliminating the visible padding "jump" when crossing it.
+
+Useful when embedding the chart inside another component that owns framing
+and never wants to show axis labels (e.g. `obc-automation-tank`).
+
+Defaults to `true` to preserve existing behavior. Declared with `attribute: false`
+because a `true`-default boolean cannot work as an HTML boolean attribute. */
+    hasLabelPadding?: boolean;
+    /** Show point markers on data points. Default: false. */
+    showPoints?: boolean;
+    /** Line drawing style: 'smooth' (curved), 'straight', or 'stepped'. */
+    lineMode?: LineMode;
+    /** Unit label displayed in tooltips (e.g., 'kW', 'kg', '%'). */
+    unit?: string;
+    /** Time axis label format: 'date' (full date/time) or 'minutes' (relative). */
+    timeDisplay?: TimeDisplay;
+    /** Max number of x-axis ticks/grid lines. Useful for matching external axes. */
+    xTicksLimit?: number | undefined;
+    /** Force x-axis tick interval. Useful for matching external axes. */
+    xStepSize?: number | undefined;
+    /** Max number of y-axis ticks/grid lines. Useful for matching external axes. */
+    yTicksLimit?: number | undefined;
+    /** Force y-axis tick interval. Useful for matching external axes. */
+    yStepSize?: number | undefined;
+    /** Instrument state affecting colors of external scales. */
+    state?: InstrumentState;
+    /** Color priority: enhanced uses blue palette instead of default gray. */
+    priority?: Priority;
+    /** Frame style for chart and external scales. */
+    frameStyle?: FrameStyle;
+    /** Border radius position for the chart's own border. */
+    borderRadiusPosition?: BorderRadiusPosition | undefined;
+    /** Border radius position for external scales based on layout. */
+    borderRadiusPositionExternalScales?: BorderRadiusPosition | undefined;
+    /** When true, the chart is used inside an instrument (e.g., gauge-trend).
+In this mode, only label font size responds to .obc-component-size-* CSS classes.
+Border radius uses the explicit `borderRadius` property value (or defaults to 8px),
+rather than reading from CSS variables. */
+    instrumentMode?: boolean;
+    /** Explicit border radius value in pixels.
+When instrumentMode=true, this value is used directly (defaults to 8px).
+When instrumentMode=false, this is ignored and border radius is read from CSS variable. */
+    borderRadius?: number | undefined;
     /** Fill rendering mode for area charts.
 - `'semitransparent'`: 50% alpha fill (default)
 - `'solid'`: Opaque fill
@@ -20,6 +118,18 @@ export interface Slots {
 }
 type $$ComponentProps = Props & Events & Slots;
 declare const ObcAreaGraph: import("svelte").Component<$$ComponentProps, {
+    ChartLineDataItem: typeof ChartLineDataItem;
+    ChartLinePoint: typeof ChartLinePoint;
+    XAxisType: typeof XAxisType;
+    YAxisPosition: typeof YAxisPosition;
+    ChartLineYAxisConfig: typeof ChartLineYAxisConfig;
+    LineMode: typeof LineMode;
+    TimeDisplay: typeof TimeDisplay;
+    ChartDataset: typeof ChartDataset;
+    InstrumentState: typeof InstrumentState;
+    Priority: typeof Priority;
+    FrameStyle: typeof FrameStyle;
+    BorderRadiusPosition: typeof BorderRadiusPosition;
     AreaFillMode: typeof AreaFillMode;
 }, "">;
 type ObcAreaGraph = ReturnType<typeof ObcAreaGraph>;

package/dist/bars-graphs/donut-chart/ObcDonutChart.svelte

@@ -1,30 +1,47 @@
 
   <script lang="ts">
-    export type {Priority} from '@oicl/openbridge-webcomponents/dist/navigation-instruments/types.js';
+    export type {DonutChartDataItem} from '@oicl/openbridge-webcomponents/dist/bars-graphs/donut-chart/donut-chart.js';
+export type {Priority} from '@oicl/openbridge-webcomponents/dist/navigation-instruments/types.js';
       import '@oicl/openbridge-webcomponents/dist/bars-graphs/donut-chart/donut-chart.js';
       import { setProperties } from "../../util.js";
-      import type {Priority} from '@oicl/openbridge-webcomponents/dist/navigation-instruments/types.js';
+      import type {DonutChartDataItem} from '@oicl/openbridge-webcomponents/dist/bars-graphs/donut-chart/donut-chart.js';
+import type {Priority} from '@oicl/openbridge-webcomponents/dist/navigation-instruments/types.js';
       import type { Snippet } from 'svelte';
 
       export interface Props {
      class?: string;
      style?: string;
-     data?: { label: string; value: number; }[];
-     colors?: string[];
+      /** Chart data segments (set via JavaScript) */
+data?: DonutChartDataItem[];
+      /** Custom segment colors (set via JavaScript) with fallback to theme palette */
+colors?: string[];
      priority?: Priority;
-     half?: boolean;
-     showOuterLabels?: boolean;
-     showUnit?: boolean;
-     outerLabelUnit?: string;
-     outerLabelMaxLength?: number;
-     outerLabelDecimalPlaces?: number;
-     centerReadoutLabel?: string;
-     centerReadoutUnit?: string;
-     max?: number;
-     thickness?: number;
-     legend?: boolean;
-     showDebugOverlay?: boolean;
-     fixedHeight?: number
+      /** Whether to display as half-circle (180°) or full circle (360°), default: false */
+half?: boolean;
+      /** Show outer labels, default: false */
+showOuterLabels?: boolean;
+      /** Whether to show unit in labels, default: false */
+showUnit?: boolean;
+      /** Unit string to append to outer labels, default: "%" */
+outerLabelUnit?: string;
+      /** Maximum character length for labels before trim (0 = no limit), default: 0 */
+outerLabelMaxLength?: number;
+      /** Number of decimal places in labels, default: 0 */
+outerLabelDecimalPlaces?: number;
+      /** Text label shown below the center total value, default: "Total" */
+centerReadoutLabel?: string;
+      /** Unit string shown inline after the label in the center readout, default: "%" */
+centerReadoutUnit?: string;
+      /** Maximum value for calculating remaining empty sector, default: 100 */
+max?: number;
+      /** Donut ring thickness in pixels, default: 24 */
+thickness?: number;
+      /** Whether to display the legend below the chart, default: false */
+legend?: boolean;
+      /** Show debug overlay for development, default: false */
+showDebugOverlay?: boolean;
+      /** Fixed height of the chart in pixels (determines chart circumference), default: 320. The chart's circumference is always based on this fixed height to match other radial instruments. */
+fixedHeight?: number
    }
       export interface Events {
     

package/dist/bars-graphs/donut-chart/ObcDonutChart.svelte.d.ts

@@ -1,27 +1,40 @@
 import '@oicl/openbridge-webcomponents/dist/bars-graphs/donut-chart/donut-chart.js';
+import type { DonutChartDataItem } from '@oicl/openbridge-webcomponents/dist/bars-graphs/donut-chart/donut-chart.js';
 import type { Priority } from '@oicl/openbridge-webcomponents/dist/navigation-instruments/types.js';
 import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
-    data?: {
-        label: string;
-        value: number;
-    }[];
+    /** Chart data segments (set via JavaScript) */
+    data?: DonutChartDataItem[];
+    /** Custom segment colors (set via JavaScript) with fallback to theme palette */
     colors?: string[];
     priority?: Priority;
+    /** Whether to display as half-circle (180°) or full circle (360°), default: false */
     half?: boolean;
+    /** Show outer labels, default: false */
     showOuterLabels?: boolean;
+    /** Whether to show unit in labels, default: false */
     showUnit?: boolean;
+    /** Unit string to append to outer labels, default: "%" */
     outerLabelUnit?: string;
+    /** Maximum character length for labels before trim (0 = no limit), default: 0 */
     outerLabelMaxLength?: number;
+    /** Number of decimal places in labels, default: 0 */
     outerLabelDecimalPlaces?: number;
+    /** Text label shown below the center total value, default: "Total" */
     centerReadoutLabel?: string;
+    /** Unit string shown inline after the label in the center readout, default: "%" */
     centerReadoutUnit?: string;
+    /** Maximum value for calculating remaining empty sector, default: 100 */
     max?: number;
+    /** Donut ring thickness in pixels, default: 24 */
     thickness?: number;
+    /** Whether to display the legend below the chart, default: false */
     legend?: boolean;
+    /** Show debug overlay for development, default: false */
     showDebugOverlay?: boolean;
+    /** Fixed height of the chart in pixels (determines chart circumference), default: 320. The chart's circumference is always based on this fixed height to match other radial instruments. */
     fixedHeight?: number;
 }
 export interface Events {
@@ -31,6 +44,7 @@ export interface Slots {
 }
 type $$ComponentProps = Props & Events & Slots;
 declare const ObcDonutChart: import("svelte").Component<$$ComponentProps, {
+    DonutChartDataItem: typeof DonutChartDataItem;
     Priority: typeof Priority;
 }, "">;
 type ObcDonutChart = ReturnType<typeof ObcDonutChart>;

package/dist/bars-graphs/line-graph/ObcLineGraph.svelte

@@ -1,15 +1,113 @@
 
   <script lang="ts">
-    
+    export type {ChartLineDataItem, ChartLinePoint, XAxisType, YAxisPosition, ChartLineYAxisConfig, LineMode, TimeDisplay} from '@oicl/openbridge-webcomponents/dist/building-blocks/chart-line/chart-line-base.js';
+export type {ChartDataset} from 'chart.js';
+export type {InstrumentState, Priority, FrameStyle, BorderRadiusPosition} from '@oicl/openbridge-webcomponents/dist/navigation-instruments/types.js';
       import '@oicl/openbridge-webcomponents/dist/bars-graphs/line-graph/line-graph.js';
       import { setProperties } from "../../util.js";
-      
+      import type {ChartLineDataItem, ChartLinePoint, XAxisType, YAxisPosition, ChartLineYAxisConfig, LineMode, TimeDisplay} from '@oicl/openbridge-webcomponents/dist/building-blocks/chart-line/chart-line-base.js';
+import type {ChartDataset} from 'chart.js';
+import type {InstrumentState, Priority, FrameStyle, BorderRadiusPosition} from '@oicl/openbridge-webcomponents/dist/navigation-instruments/types.js';
       import type { Snippet } from 'svelte';
 
       export interface Props {
      class?: string;
      style?: string;
-     
+      /** Simple single-series data. `{label, value}` items for the category axis;
+`{x, value}` items for time/number axes (x: epoch ms, ISO string, Date,
+or Temporal object). Points are drawn in array order (no sorting). */
+data?: ChartLineDataItem[];
+      /** Chart.js-style datasets for multi-series use. If provided, takes precedence over `data`. */
+datasets?: ChartDataset<"line", ChartLinePoint[]>[] | undefined;
+      /** Optional explicit labels for the x-axis (category mode). If omitted labels are derived from `data` */
+labels?: (string | number)[] | undefined;
+      /** Custom color palette (CSS variable names or color strings). */
+colors?: string[];
+      /** Show HTML legend below chart with series labels and colors. */
+legend?: boolean;
+      /** Development mode: show visual debug overlay with dimension guides. */
+showDebugOverlay?: boolean;
+      /** Width of the chart in pixels. Default: 480. */
+width?: number;
+      /** Height of the chart in pixels. Default: 320. */
+height?: number;
+      /** Enable fixed aspect ratio scaling mode.
+When true, width/height properties define the aspect ratio (not actual pixels).
+The component fills 100% of parent width and calculates height from aspect ratio.
+When false (default), width/height are used as actual pixel dimensions. */
+fixedAspectRatioScaling?: boolean;
+      /** Reference size for external scales when using fixedAspectRatioScaling.
+This value is passed down to external scales to determine their 1:1 Figma design size.
+At this reference size, scales render at native size; above/below they scale proportionally.
+Default: 384 (matches Figma design baseline). */
+scaleReferenceSize?: number;
+      /** X-axis mode: 'category' for labeled, evenly spaced data points; 'time'
+for time-based data positioned proportionally; 'number' for plain
+numeric x-values. */
+xAxisType?: XAxisType;
+      /** Single y-axis position ('left' or 'right'). For multiple y-axes, use yAxes instead. */
+yAxisPosition?: YAxisPosition;
+      /** Multiple y-axis definitions for complex multi-axis charts. */
+yAxes?: ChartLineYAxisConfig[] | undefined;
+      /** Show grid lines. */
+showGrid?: boolean;
+      /** Show vertical grid lines (x-axis). Default: false. */
+showGridX?: boolean;
+      /** Show horizontal grid lines (y-axis). Default: false. */
+showGridY?: boolean;
+      /** Show axis tick marks and labels. */
+showTickMarks?: boolean;
+      /** Reserve canvas padding for axis tick labels on sides without an external scale.
+
+When `true` (default), the chart leaves room for tick labels and renders them
+(subject to `showTickMarks` and the 192px auto-compact threshold).
+
+When `false`, the chart renders edge-to-edge on sides without a slotted external
+scale AND axis tick labels are force-hidden so they cannot be clipped. This also
+suppresses the automatic edge-to-edge switch that normally happens below the
+192px threshold, eliminating the visible padding "jump" when crossing it.
+
+Useful when embedding the chart inside another component that owns framing
+and never wants to show axis labels (e.g. `obc-automation-tank`).
+
+Defaults to `true` to preserve existing behavior. Declared with `attribute: false`
+because a `true`-default boolean cannot work as an HTML boolean attribute. */
+hasLabelPadding?: boolean;
+      /** Show point markers on data points. Default: false. */
+showPoints?: boolean;
+      /** Line drawing style: 'smooth' (curved), 'straight', or 'stepped'. */
+lineMode?: LineMode;
+      /** Unit label displayed in tooltips (e.g., 'kW', 'kg', '%'). */
+unit?: string;
+      /** Time axis label format: 'date' (full date/time) or 'minutes' (relative). */
+timeDisplay?: TimeDisplay;
+      /** Max number of x-axis ticks/grid lines. Useful for matching external axes. */
+xTicksLimit?: number | undefined;
+      /** Force x-axis tick interval. Useful for matching external axes. */
+xStepSize?: number | undefined;
+      /** Max number of y-axis ticks/grid lines. Useful for matching external axes. */
+yTicksLimit?: number | undefined;
+      /** Force y-axis tick interval. Useful for matching external axes. */
+yStepSize?: number | undefined;
+      /** Instrument state affecting colors of external scales. */
+state?: InstrumentState;
+      /** Color priority: enhanced uses blue palette instead of default gray. */
+priority?: Priority;
+      /** Frame style for chart and external scales. */
+frameStyle?: FrameStyle;
+      /** Border radius position for the chart's own border. */
+borderRadiusPosition?: BorderRadiusPosition | undefined;
+      /** Border radius position for external scales based on layout. */
+borderRadiusPositionExternalScales?: BorderRadiusPosition | undefined;
+      /** When true, the chart is used inside an instrument (e.g., gauge-trend).
+In this mode, only label font size responds to .obc-component-size-* CSS classes.
+Border radius uses the explicit `borderRadius` property value (or defaults to 8px),
+rather than reading from CSS variables. */
+instrumentMode?: boolean;
+      /** Explicit border radius value in pixels.
+When instrumentMode=true, this value is used directly (defaults to 8px).
+When instrumentMode=false, this is ignored and border radius is read from CSS variable. */
+borderRadius?: number | undefined
    }
       export interface Events {