@porscheinformatik/clr-addons 19.15.2 → 19.17.0

package/charts/pie-chart/pie-chart.component.d.ts

@@ -0,0 +1,39 @@
+import { OnChanges, SimpleChanges } from '@angular/core';
+import { ChartLegendItem } from '../chart-legend/chart-legend.component';
+import { ChartBase } from '../shared/chart-base';
+import * as i0 from "@angular/core";
+export interface PieChartData {
+    key: string;
+    label: string;
+    fullLabel?: string;
+    value: number;
+    color: string;
+}
+export interface PieChartValue {
+    key: string;
+    label: string;
+    value: number;
+}
+export declare class PieChartComponent extends ChartBase<PieChartData> implements OnChanges {
+    readonly data: import("@angular/core").InputSignal<PieChartData[]>;
+    readonly donut: import("@angular/core").InputSignal<boolean>;
+    readonly showLegend: import("@angular/core").InputSignal<boolean>;
+    readonly showExportButton: import("@angular/core").InputSignal<boolean>;
+    readonly exportFilename: import("@angular/core").InputSignal<string>;
+    readonly tooltipOrientation: import("@angular/core").InputSignal<"top" | "bottom">;
+    readonly noItemsMessage: import("@angular/core").InputSignal<string>;
+    readonly tooltipPercentOfTotal: import("@angular/core").InputSignal<string>;
+    readonly valueClicked: import("@angular/core").OutputEmitterRef<PieChartValue>;
+    protected readonly hasData: import("@angular/core").Signal<boolean>;
+    protected readonly total: import("@angular/core").Signal<number>;
+    readonly alertMessageAndType: import("@angular/core").Signal<[string, string]>;
+    readonly legendItems: import("@angular/core").Signal<ChartLegendItem[]>;
+    private svg;
+    private arcGen;
+    ngOnChanges(_changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    protected updateChart(): void;
+    private openTooltip;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PieChartComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PieChartComponent, "clr-pie-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "donut": { "alias": "donut"; "required": false; "isSignal": true; }; "showLegend": { "alias": "showLegend"; "required": false; "isSignal": true; }; "showExportButton": { "alias": "showExportButton"; "required": false; "isSignal": true; }; "exportFilename": { "alias": "exportFilename"; "required": false; "isSignal": true; }; "tooltipOrientation": { "alias": "tooltipOrientation"; "required": false; "isSignal": true; }; "noItemsMessage": { "alias": "noItemsMessage"; "required": false; "isSignal": true; }; "tooltipPercentOfTotal": { "alias": "tooltipPercentOfTotal"; "required": false; "isSignal": true; }; }, { "valueClicked": "valueClicked"; }, never, never, false, never>;
+}

package/charts/shared/chart-base.d.ts

@@ -0,0 +1,37 @@
+import { AfterViewInit, ElementRef } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Abstract base class shared by all chart components.
+ * ...
+ */
+export declare abstract class ChartBase<TSelected = unknown> implements AfterViewInit {
+    /** Whether the chart is in loading state (shows skeleton). */
+    readonly loading: import("@angular/core").InputSignal<boolean>;
+    /** Reference to the `<svg #chart>` element in the component template. */
+    protected readonly chartRef: import("@angular/core").Signal<ElementRef<any>>;
+    /** Reference to the `<div #container>` host element in the component template. */
+    protected readonly containerRef: import("@angular/core").Signal<ElementRef<any>>;
+    /** Exposes the raw SVG element for the chart-export button. */
+    readonly svgElement: import("@angular/core").Signal<SVGSVGElement>;
+    protected readonly selectedItem: import("@angular/core").WritableSignal<TSelected>;
+    protected readonly tooltipPosition: import("@angular/core").WritableSignal<{
+        x: number;
+        y: number;
+    }>;
+    /** Schedules the first render after the view is ready. */
+    ngAfterViewInit(): void;
+    /** Each chart implements its own D3 rendering logic here. */
+    protected abstract updateChart(): void;
+    /** Returns the pixel dimensions of the container div. */
+    protected getContainerDimensions(): {
+        width: number;
+        height: number;
+    };
+    /**
+     * Clears the active tooltip.  Override in subclasses that have additional
+     * selection state
+     */
+    resetTooltip(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ChartBase<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ChartBase<any>, never, never, { "loading": { "alias": "loading"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/charts/shared/chart-skeleton.component.d.ts

@@ -0,0 +1,8 @@
+import * as i0 from "@angular/core";
+export declare class ChartSkeletonComponent {
+    readonly skeletonType: import("@angular/core").InputSignal<"placeholder" | "loading">;
+    readonly orientation: import("@angular/core").InputSignal<"horizontal" | "vertical">;
+    protected readonly animationStyle: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ChartSkeletonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ChartSkeletonComponent, "cng-bar-chart-skeleton", never, { "skeletonType": { "alias": "skeletonType"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/charts/shared/d3-chart-axes.d.ts

@@ -0,0 +1,28 @@
+import { AxisScale, ScaleLinear, Selection } from 'd3';
+/** Options passed to {@link drawXYAxes}. */
+export interface XYAxisOptions {
+    /** Maps each X key to its display label. */
+    xLabelMap: Map<string, string>;
+    width: number;
+    height: number;
+    /** Optional description label rendered below the X axis. */
+    xAxisLabel?: string;
+    /** Optional description label rendered rotated left of the Y axis. */
+    yAxisLabel?: string;
+    /** Left margin already accounting for the Y-axis label offset. */
+    effectiveLeft: number;
+}
+/**
+ * Draws the X and Y axes (with integer-only Y ticks and grid lines) plus
+ * optional description labels onto the given D3 group.
+ *
+ * @param g          The D3 group element to append into.
+ * @param x          Any D3 axis scale keyed on strings (`ScalePoint` or `ScaleBand`).
+ * @param y          The linear Y scale.
+ * @param opts       Axis configuration options.
+ */
+export declare function drawXYAxes(g: Selection<SVGGElement, unknown, null, undefined>, x: AxisScale<string>, y: ScaleLinear<number, number>, opts: XYAxisOptions): void;
+/**
+ * Styles all D3 grid tick lines inside `g` with the neutral chart grid color.
+ */
+export declare function styleGridLines(g: Selection<SVGGElement, unknown, null, undefined>): void;

package/charts/shared/d3-dots.d.ts

@@ -0,0 +1,10 @@
+import { ScaleLinear, ScalePoint, Selection } from 'd3';
+import { XYChartPoint, XYChartSeries } from './xy-chart.types';
+/**
+ * Renders interactive dot circles for a single XY series onto the given D3 group.
+ *
+ * - Default radius: 4px, hover radius: 6px.
+ * - Calls `onClick` with the clicked element, data point and series when a dot is clicked.
+ *
+ */
+export declare function renderDots(g: Selection<SVGGElement, unknown, null, undefined>, series: XYChartSeries, x: ScalePoint<string>, y: ScaleLinear<number, number>, onClick: (el: SVGCircleElement, point: XYChartPoint, series: XYChartSeries) => void): void;

package/charts/shared/xy-chart.types.d.ts

@@ -0,0 +1,35 @@
+/**
+ * A single data point on an XY chart (line, area).
+ * `x` is used as the category key; `xLabel` is the optional display label for the axis tick.
+ */
+export interface XYChartPoint {
+    /** Unique key used as the X-axis category. */
+    x: string;
+    /** Optional display label for the X-axis tick (defaults to `x`). */
+    xLabel?: string;
+    /** Y value. */
+    value: number;
+}
+/**
+ * A named data series for an XY chart.
+ */
+export interface XYChartSeries {
+    /** Unique identifier. */
+    key: string;
+    /** Display name shown in the legend and tooltip. */
+    label: string;
+    /** Line / area / dot colour. Accepts hex or CSS custom property. */
+    color: string;
+    /** Ordered data points for this series. */
+    data: XYChartPoint[];
+}
+/**
+ * Emitted when the user clicks a data point on an XY chart.
+ */
+export interface XYChartValue {
+    seriesKey: string;
+    seriesLabel: string;
+    x: string;
+    xLabel?: string;
+    value: number;
+}

package/charts/utils/color.utils.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Converts a chart color value to a CSS-compatible string.
+ *
+ * Supports:
+ *  - Hex values:        '#e57200'                        → returned as-is
+ *  - CSS custom props:  '--cds-global-color-lavender-1000' → wrapped in var(...)
+ *  - Any other string:  'rgb(...)' / 'hsl(...)'          → returned as-is
+ */
+export declare function toChartColor(color: string | undefined): string;

package/charts/utils/index.d.ts

@@ -0,0 +1,3 @@
+export * from './color.utils';
+export * from './text.utils';
+export * from './utils';

package/charts/utils/text.utils.d.ts

@@ -0,0 +1,8 @@
+export declare class TextRenderer {
+    private canvas;
+    private context;
+    private cachedFont;
+    private cachedEllipsisWidth;
+    constructor();
+    render(text: string, availableHeight: number, availableWidth: number, fontSize?: string, fontFamily?: string): string;
+}

package/charts/utils/utils.d.ts

@@ -0,0 +1,2 @@
+export declare const percentage: (value: number, total: number) => number;
+export declare const d3percentFormat: (d: number) => string;

package/clr-addons.module.d.ts

@@ -1,6 +1,6 @@
 import * as i0 from "@angular/core";
-import * as i1 from "./control-enter-submit/clr-control-enter-submit.directive";
-import * as i2 from "./focus-first-invalid-field/focus-first-invalid-field.directive";
+import * as i1 from "./focus-first-invalid-field/focus-first-invalid-field.directive";
+import * as i2 from "./control-enter-submit/clr-control-enter-submit.directive";
 import * as i3 from "./view-edit-section/view-edit-section.module";
 import * as i4 from "./pager/pager.module";
 import * as i5 from "./dot-pager/dot-pager.module";
@@ -38,8 +38,9 @@ import * as i36 from "./action-panel/action-panel.module";
 import * as i37 from "./readonly/readonly.module";
 import * as i38 from "./datagrid/column-reorder/datagrid-column-reorder.module";
 import * as i39 from "./signpost/signpost.module";
+import * as i40 from "./charts/charts.module";
 export declare class ClrAddonsModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrAddonsModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ClrAddonsModule, [typeof i1.ClrControlEnterSubmitDirective], [typeof i2.ClrFocusFirstInvalidFieldDirective], [typeof i3.ClrViewEditSectionModule, typeof i4.ClrPagerModule, typeof i5.ClrDotPagerModule, typeof i6.ClrPagedSearchResultListModule, typeof i7.ClrCollapseExpandSectionModule, typeof i8.ClrBreadcrumbModule, typeof i9.ClrMainNavGroupModule, typeof i10.ClrContentPanelModule, typeof i11.ClrNotificationModule, typeof i12.ClrFlowBarModule, typeof i13.ClrBackButtonModule, typeof i14.ClrNumericFieldModule, typeof i15.ClrSearchFieldModule, typeof i16.ClrTreetableModule, typeof i17.ClrProgressSpinnerModule, typeof i18.ClrDateTimeModule, typeof i19.ClrQuickListModule, typeof i20.ClrIconAvatarModule, typeof i21.ClrLetterAvatarModule, typeof i22.ClrMultilingualModule, typeof i23.ClrGenericQuickListModule, typeof i24.ClrDataListValidatorModule, typeof i25.ClrHistoryModule, typeof i26.ClrAutocompleteOffModule, typeof i27.ClrBrandAvatarModule, typeof i28.ClrLocationBarModule, typeof i29.ClrFormModule, typeof i30.ClrDropdownOverflowModule, typeof i31.ClrDatagridStatePersistenceModule, typeof i32.ClrEnumFilterModule, typeof i33.ClrDateFilterModule, typeof i34.ClrDaterangepickerModule, typeof i35.ClrIfWarningModule, typeof i36.ClrActionPanelModule, typeof i37.ClrReadonlyDirectiveModule, typeof i38.ClrDatagridColumnReorderModule, typeof i39.ClrSignpostAddonModule, typeof i2.ClrFocusFirstInvalidFieldDirective, typeof i1.ClrControlEnterSubmitDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ClrAddonsModule, never, [typeof i1.ClrFocusFirstInvalidFieldDirective, typeof i2.ClrControlEnterSubmitDirective], [typeof i3.ClrViewEditSectionModule, typeof i4.ClrPagerModule, typeof i5.ClrDotPagerModule, typeof i6.ClrPagedSearchResultListModule, typeof i7.ClrCollapseExpandSectionModule, typeof i8.ClrBreadcrumbModule, typeof i9.ClrMainNavGroupModule, typeof i10.ClrContentPanelModule, typeof i11.ClrNotificationModule, typeof i12.ClrFlowBarModule, typeof i13.ClrBackButtonModule, typeof i14.ClrNumericFieldModule, typeof i15.ClrSearchFieldModule, typeof i16.ClrTreetableModule, typeof i17.ClrProgressSpinnerModule, typeof i18.ClrDateTimeModule, typeof i19.ClrQuickListModule, typeof i20.ClrIconAvatarModule, typeof i21.ClrLetterAvatarModule, typeof i22.ClrMultilingualModule, typeof i23.ClrGenericQuickListModule, typeof i24.ClrDataListValidatorModule, typeof i25.ClrHistoryModule, typeof i26.ClrAutocompleteOffModule, typeof i27.ClrBrandAvatarModule, typeof i28.ClrLocationBarModule, typeof i29.ClrFormModule, typeof i30.ClrDropdownOverflowModule, typeof i31.ClrDatagridStatePersistenceModule, typeof i32.ClrEnumFilterModule, typeof i33.ClrDateFilterModule, typeof i34.ClrDaterangepickerModule, typeof i35.ClrIfWarningModule, typeof i36.ClrActionPanelModule, typeof i37.ClrReadonlyDirectiveModule, typeof i38.ClrDatagridColumnReorderModule, typeof i39.ClrSignpostAddonModule, typeof i1.ClrFocusFirstInvalidFieldDirective, typeof i2.ClrControlEnterSubmitDirective, typeof i40.ClrChartsModule]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ClrAddonsModule>;
 }

package/control-enter-submit/clr-control-enter-submit.directive.d.ts

@@ -12,5 +12,5 @@ export declare class ClrControlEnterSubmitDirective implements AfterContentInit,
     ngAfterViewChecked(): void;
     private setTooltip;
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrControlEnterSubmitDirective, [null, null, { optional: true; host: true; }]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<ClrControlEnterSubmitDirective, "form[clrControlEnterSubmit]", never, { "tooltipText": { "alias": "clrControlEnterSubmit"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ClrControlEnterSubmitDirective, "form[clrControlEnterSubmit]", never, { "tooltipText": { "alias": "clrControlEnterSubmit"; "required": false; }; }, {}, never, never, true, never>;
 }

package/copy-to-clipboard/copy-to-clipboard.d.ts

@@ -0,0 +1,30 @@
+import { AfterViewInit, OnDestroy, OnInit } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class ClrCopyToClipboard implements OnInit, AfterViewInit, OnDestroy {
+    value: import("@angular/core").InputSignal<string>;
+    tooltipText: import("@angular/core").InputSignal<string>;
+    hiddenUntilHovered: import("@angular/core").InputSignal<boolean>;
+    showCopiedIcon: boolean;
+    parentHovered: boolean;
+    protected tooltipSize: string;
+    tooltipPosition: 'bottom-right' | 'bottom-left';
+    private readonly cdr;
+    private readonly elementRef;
+    private resetTimeout;
+    private resizeListener?;
+    private parentEnterListener?;
+    private parentLeaveListener?;
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    /**
+     * Called when the clipboard copy operation completes.
+     * @param success Whether the copy was successful
+     */
+    onCopied(success: boolean): void;
+    private setupParentHoverListeners;
+    private teardownParentHoverListeners;
+    private updateTooltipPosition;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ClrCopyToClipboard, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ClrCopyToClipboard, "clr-copy-to-clipboard", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "tooltipText": { "alias": "tooltipText"; "required": false; "isSignal": true; }; "hiddenUntilHovered": { "alias": "hiddenUntilHovered"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/copy-to-clipboard/index.d.ts

@@ -0,0 +1 @@
+export * from './copy-to-clipboard';