@bryntum/chart-angular-thin 7.2.0 → 7.2.2

package/lib/bryntum-chart.component.d.ts

@@ -73,14 +73,15 @@ export declare type BryntumChartProps = {
      * The chart background color, or `null` for transparent.
      */
     background?: string;
-    /**
-     * (Optional) The name of a field in the chart data to use as the background color for each data point.
-     */
-    backgroundColorField?: string;
     /**
      * Layout direction for the bar chart type.
      */
     barDirection?: 'vertical' | 'horizontal';
+    /**
+     * (Optional) For `'bar'` charts, the amount of the available bar area each bar in this series should occupy,
+     * from 0 to 1. Default: 0.9.
+     */
+    barWidth?: number;
     /**
      * Set `true` to add a border to this container's element.
      */
@@ -247,6 +248,11 @@ export declare type BryntumChartProps = {
      * The name of the record field containing the data for this series.
      */
     field?: string;
+    /**
+     * (Optional) The name of a field in the chart data to use as the background color for each data element
+     * (e.g. bar).
+     */
+    fillColorField?: string;
     /**
      * When this widget is a child of a [Container](https://bryntum.com/products/chart/docs/api/Core/widget/Container), it will by default be participating in a
      * flexbox layout. This config allows you to set this widget's
@@ -836,8 +842,8 @@ export declare class BryntumChartComponent implements OnInit, OnDestroy {
     axisColor: string;
     axisLabelColor: string;
     background: string;
-    backgroundColorField: string;
     barDirection: 'vertical' | 'horizontal';
+    barWidth: number;
     bubbleScaleFactor: number;
     callOnFunctions: boolean;
     catchEventHandlerExceptions: boolean;
@@ -853,6 +859,7 @@ export declare class BryntumChartComponent implements OnInit, OnDestroy {
     disabled: boolean | 'inert';
     extraData: any;
     field: string;
+    fillColorField: string;
     flex: number | string;
     gridColor: string;
     height: number | string;
@@ -1056,5 +1063,5 @@ export declare class BryntumChartComponent implements OnInit, OnDestroy {
      */
     ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<BryntumChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<BryntumChartComponent, "bryntum-chart", never, { "adopt": "adopt"; "align": "align"; "anchor": "anchor"; "ariaDescription": "ariaDescription"; "ariaLabel": "ariaLabel"; "autoUpdateRecord": "autoUpdateRecord"; "border": "border"; "bubbleEvents": "bubbleEvents"; "centered": "centered"; "color": "color"; "config": "config"; "constrainTo": "constrainTo"; "contentElementCls": "contentElementCls"; "dataField": "dataField"; "defaultBindProperty": "defaultBindProperty"; "defaultFocus": "defaultFocus"; "defaults": "defaults"; "detectCSSCompatibilityIssues": "detectCSSCompatibilityIssues"; "dock": "dock"; "draggable": "draggable"; "elementAttributes": "elementAttributes"; "floating": "floating"; "hideAnimation": "hideAnimation"; "hideWhenEmpty": "hideWhenEmpty"; "htmlCls": "htmlCls"; "ignoreParentReadOnly": "ignoreParentReadOnly"; "itemCls": "itemCls"; "lazyItems": "lazyItems"; "listeners": "listeners"; "localeClass": "localeClass"; "localizable": "localizable"; "localizableProperties": "localizableProperties"; "maskDefaults": "maskDefaults"; "masked": "masked"; "monitorResize": "monitorResize"; "namedItems": "namedItems"; "owner": "owner"; "positioned": "positioned"; "preventTooltipOnTouch": "preventTooltipOnTouch"; "relayStoreEvents": "relayStoreEvents"; "ripple": "ripple"; "rootElement": "rootElement"; "scrollAction": "scrollAction"; "showAnimation": "showAnimation"; "showTooltipWhenDisabled": "showTooltipWhenDisabled"; "tab": "tab"; "tabBarItems": "tabBarItems"; "tag": "tag"; "textAlign": "textAlign"; "textContent": "textContent"; "type": "type"; "ui": "ui"; "weight": "weight"; "alignSelf": "alignSelf"; "animate": "animate"; "animationDuration": "animationDuration"; "appendTo": "appendTo"; "axisColor": "axisColor"; "axisLabelColor": "axisLabelColor"; "background": "background"; "backgroundColorField": "backgroundColorField"; "barDirection": "barDirection"; "bubbleScaleFactor": "bubbleScaleFactor"; "callOnFunctions": "callOnFunctions"; "catchEventHandlerExceptions": "catchEventHandlerExceptions"; "chartPadding": "chartPadding"; "chartTooltip": "chartTooltip"; "chartType": "chartType"; "cls": "cls"; "column": "column"; "content": "content"; "data": "data"; "dataPointShape": "dataPointShape"; "dataset": "dataset"; "disabled": "disabled"; "extraData": "extraData"; "field": "field"; "flex": "flex"; "gridColor": "gridColor"; "height": "height"; "hidden": "hidden"; "html": "html"; "id": "id"; "inputFieldAlign": "inputFieldAlign"; "insertBefore": "insertBefore"; "insertFirst": "insertFirst"; "interactive": "interactive"; "items": "items"; "keyMap": "keyMap"; "label": "label"; "labelPosition": "labelPosition"; "labels": "labels"; "layout": "layout"; "layoutStyle": "layoutStyle"; "legendPosition": "legendPosition"; "legendScale": "legendScale"; "margin": "margin"; "max": "max"; "maxHeight": "maxHeight"; "maximizeOnMobile": "maximizeOnMobile"; "maxTickLabelRotation": "maxTickLabelRotation"; "maxWidth": "maxWidth"; "min": "min"; "minHeight": "minHeight"; "minTickLabelRotation": "minTickLabelRotation"; "minWidth": "minWidth"; "pointSize": "pointSize"; "readOnly": "readOnly"; "record": "record"; "rendition": "rendition"; "role": "role"; "rtl": "rtl"; "scrollable": "scrollable"; "series": "series"; "seriesLineDash": "seriesLineDash"; "seriesLineOpacity": "seriesLineOpacity"; "seriesLineThickness": "seriesLineThickness"; "showControls": "showControls"; "showLegend": "showLegend"; "showPoints": "showPoints"; "showSubtitle": "showSubtitle"; "showTicks": "showTicks"; "showTitle": "showTitle"; "showTooltips": "showTooltips"; "span": "span"; "strictRecordMapping": "strictRecordMapping"; "subtitle": "subtitle"; "subtitleFont": "subtitleFont"; "subtitlePadding": "subtitlePadding"; "tickFont": "tickFont"; "tickMarkColor": "tickMarkColor"; "title": "title"; "titleFont": "titleFont"; "titlePadding": "titlePadding"; "tooltip": "tooltip"; "width": "width"; "x": "x"; "y": "y"; "anchorSize": "anchorSize"; "focusVisible": "focusVisible"; "hasChanges": "hasChanges"; "isSettingValues": "isSettingValues"; "isValid": "isValid"; "parent": "parent"; "values": "values"; }, { "onBeforeDestroy": "onBeforeDestroy"; "onBeforeHide": "onBeforeHide"; "onBeforeSetRecord": "onBeforeSetRecord"; "onBeforeShow": "onBeforeShow"; "onCatchAll": "onCatchAll"; "onDestroy": "onDestroy"; "onDirtyStateChange": "onDirtyStateChange"; "onElementCreated": "onElementCreated"; "onFocusIn": "onFocusIn"; "onFocusOut": "onFocusOut"; "onHide": "onHide"; "onPaint": "onPaint"; "onReadOnly": "onReadOnly"; "onRecompose": "onRecompose"; "onResize": "onResize"; "onShow": "onShow"; }, never, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BryntumChartComponent, "bryntum-chart", never, { "adopt": "adopt"; "align": "align"; "anchor": "anchor"; "ariaDescription": "ariaDescription"; "ariaLabel": "ariaLabel"; "autoUpdateRecord": "autoUpdateRecord"; "border": "border"; "bubbleEvents": "bubbleEvents"; "centered": "centered"; "color": "color"; "config": "config"; "constrainTo": "constrainTo"; "contentElementCls": "contentElementCls"; "dataField": "dataField"; "defaultBindProperty": "defaultBindProperty"; "defaultFocus": "defaultFocus"; "defaults": "defaults"; "detectCSSCompatibilityIssues": "detectCSSCompatibilityIssues"; "dock": "dock"; "draggable": "draggable"; "elementAttributes": "elementAttributes"; "floating": "floating"; "hideAnimation": "hideAnimation"; "hideWhenEmpty": "hideWhenEmpty"; "htmlCls": "htmlCls"; "ignoreParentReadOnly": "ignoreParentReadOnly"; "itemCls": "itemCls"; "lazyItems": "lazyItems"; "listeners": "listeners"; "localeClass": "localeClass"; "localizable": "localizable"; "localizableProperties": "localizableProperties"; "maskDefaults": "maskDefaults"; "masked": "masked"; "monitorResize": "monitorResize"; "namedItems": "namedItems"; "owner": "owner"; "positioned": "positioned"; "preventTooltipOnTouch": "preventTooltipOnTouch"; "relayStoreEvents": "relayStoreEvents"; "ripple": "ripple"; "rootElement": "rootElement"; "scrollAction": "scrollAction"; "showAnimation": "showAnimation"; "showTooltipWhenDisabled": "showTooltipWhenDisabled"; "tab": "tab"; "tabBarItems": "tabBarItems"; "tag": "tag"; "textAlign": "textAlign"; "textContent": "textContent"; "type": "type"; "ui": "ui"; "weight": "weight"; "alignSelf": "alignSelf"; "animate": "animate"; "animationDuration": "animationDuration"; "appendTo": "appendTo"; "axisColor": "axisColor"; "axisLabelColor": "axisLabelColor"; "background": "background"; "barDirection": "barDirection"; "barWidth": "barWidth"; "bubbleScaleFactor": "bubbleScaleFactor"; "callOnFunctions": "callOnFunctions"; "catchEventHandlerExceptions": "catchEventHandlerExceptions"; "chartPadding": "chartPadding"; "chartTooltip": "chartTooltip"; "chartType": "chartType"; "cls": "cls"; "column": "column"; "content": "content"; "data": "data"; "dataPointShape": "dataPointShape"; "dataset": "dataset"; "disabled": "disabled"; "extraData": "extraData"; "field": "field"; "fillColorField": "fillColorField"; "flex": "flex"; "gridColor": "gridColor"; "height": "height"; "hidden": "hidden"; "html": "html"; "id": "id"; "inputFieldAlign": "inputFieldAlign"; "insertBefore": "insertBefore"; "insertFirst": "insertFirst"; "interactive": "interactive"; "items": "items"; "keyMap": "keyMap"; "label": "label"; "labelPosition": "labelPosition"; "labels": "labels"; "layout": "layout"; "layoutStyle": "layoutStyle"; "legendPosition": "legendPosition"; "legendScale": "legendScale"; "margin": "margin"; "max": "max"; "maxHeight": "maxHeight"; "maximizeOnMobile": "maximizeOnMobile"; "maxTickLabelRotation": "maxTickLabelRotation"; "maxWidth": "maxWidth"; "min": "min"; "minHeight": "minHeight"; "minTickLabelRotation": "minTickLabelRotation"; "minWidth": "minWidth"; "pointSize": "pointSize"; "readOnly": "readOnly"; "record": "record"; "rendition": "rendition"; "role": "role"; "rtl": "rtl"; "scrollable": "scrollable"; "series": "series"; "seriesLineDash": "seriesLineDash"; "seriesLineOpacity": "seriesLineOpacity"; "seriesLineThickness": "seriesLineThickness"; "showControls": "showControls"; "showLegend": "showLegend"; "showPoints": "showPoints"; "showSubtitle": "showSubtitle"; "showTicks": "showTicks"; "showTitle": "showTitle"; "showTooltips": "showTooltips"; "span": "span"; "strictRecordMapping": "strictRecordMapping"; "subtitle": "subtitle"; "subtitleFont": "subtitleFont"; "subtitlePadding": "subtitlePadding"; "tickFont": "tickFont"; "tickMarkColor": "tickMarkColor"; "title": "title"; "titleFont": "titleFont"; "titlePadding": "titlePadding"; "tooltip": "tooltip"; "width": "width"; "x": "x"; "y": "y"; "anchorSize": "anchorSize"; "focusVisible": "focusVisible"; "hasChanges": "hasChanges"; "isSettingValues": "isSettingValues"; "isValid": "isValid"; "parent": "parent"; "values": "values"; }, { "onBeforeDestroy": "onBeforeDestroy"; "onBeforeHide": "onBeforeHide"; "onBeforeSetRecord": "onBeforeSetRecord"; "onBeforeShow": "onBeforeShow"; "onCatchAll": "onCatchAll"; "onDestroy": "onDestroy"; "onDirtyStateChange": "onDirtyStateChange"; "onElementCreated": "onElementCreated"; "onFocusIn": "onFocusIn"; "onFocusOut": "onFocusOut"; "onHide": "onHide"; "onPaint": "onPaint"; "onReadOnly": "onReadOnly"; "onRecompose": "onRecompose"; "onResize": "onResize"; "onShow": "onShow"; }, never, never>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bryntum/chart-angular-thin",
-  "version": "7.2.0",
+  "version": "7.2.2",
   "description": "Angular IVY wrappers for Bryntum Chart JavaScript component",
   "keywords": [
     "bryntum",

package/src/lib/bryntum-chart.component.ts

@@ -81,14 +81,15 @@ export type BryntumChartProps = {
      * The chart background color, or `null` for transparent.
      */
     background ? : string
-    /**
-     * (Optional) The name of a field in the chart data to use as the background color for each data point.
-     */
-    backgroundColorField ? : string
     /**
      * Layout direction for the bar chart type.
      */
     barDirection ? : 'vertical'|'horizontal'
+    /**
+     * (Optional) For `'bar'` charts, the amount of the available bar area each bar in this series should occupy,
+     * from 0 to 1. Default: 0.9.
+     */
+    barWidth ? : number
     /**
      * Set `true` to add a border to this container's element.
      */
@@ -255,6 +256,11 @@ export type BryntumChartProps = {
      * The name of the record field containing the data for this series.
      */
     field ? : string
+    /**
+     * (Optional) The name of a field in the chart data to use as the background color for each data element
+     * (e.g. bar).
+     */
+    fillColorField ? : string
     /**
      * When this widget is a child of a [Container](https://bryntum.com/products/chart/docs/api/Core/widget/Container), it will by default be participating in a
      * flexbox layout. This config allows you to set this widget's
@@ -812,8 +818,8 @@ export class BryntumChartComponent implements OnInit, OnDestroy {
         'axisColor',
         'axisLabelColor',
         'background',
-        'backgroundColorField',
         'barDirection',
+        'barWidth',
         'border',
         'bubbleEvents',
         'bubbleScaleFactor',
@@ -844,6 +850,7 @@ export class BryntumChartComponent implements OnInit, OnDestroy {
         'elementAttributes',
         'extraData',
         'field',
+        'fillColorField',
         'flex',
         'floating',
         'gridColor',
@@ -1004,8 +1011,8 @@ export class BryntumChartComponent implements OnInit, OnDestroy {
         'axisColor',
         'axisLabelColor',
         'background',
-        'backgroundColorField',
         'barDirection',
+        'barWidth',
         'bubbleScaleFactor',
         'callOnFunctions',
         'catchEventHandlerExceptions',
@@ -1021,6 +1028,7 @@ export class BryntumChartComponent implements OnInit, OnDestroy {
         'disabled',
         'extraData',
         'field',
+        'fillColorField',
         'flex',
         'focusVisible',
         'gridColor',
@@ -1178,8 +1186,8 @@ export class BryntumChartComponent implements OnInit, OnDestroy {
     @Input() axisColor                   ! : string;
     @Input() axisLabelColor              ! : string;
     @Input() background                  ! : string;
-    @Input() backgroundColorField        ! : string;
     @Input() barDirection                ! : 'vertical'|'horizontal';
+    @Input() barWidth                    ! : number;
     @Input() bubbleScaleFactor           ! : number;
     @Input() callOnFunctions             ! : boolean;
     @Input() catchEventHandlerExceptions ! : boolean;
@@ -1195,6 +1203,7 @@ export class BryntumChartComponent implements OnInit, OnDestroy {
     @Input() disabled                    ! : boolean|'inert';
     @Input() extraData                   ! : any;
     @Input() field                       ! : string;
+    @Input() fillColorField              ! : string;
     @Input() flex                        ! : number|string;
     @Input() gridColor                   ! : string;
     @Input() height                      ! : number|string;