@patternfly-java/charts 0.0.8 → 0.0.9

package/dist/demo.html

@@ -61,7 +61,7 @@ h2 {
 
 <section class="card">
     <h2 class="pf-v5-c-title pf-m-lg">Bullet</h2>
-    <pfj-chart-bullet width="600" height="150" aria-title="Bullet Chart" primary-segmented-measure-data="[{&quot;name&quot;:&quot;Measure&quot;,&quot;y&quot;:100},{&quot;name&quot;:&quot;Measure&quot;,&quot;y&quot;:60}]" primary-dot-measure-data="[{&quot;name&quot;:&quot;Measure&quot;,&quot;y&quot;:75}]" comparative-warning-measure-data="[{&quot;name&quot;:&quot;Warning&quot;,&quot;y&quot;:88}]" comparative-error-measure-data="[{&quot;name&quot;:&quot;Error&quot;,&quot;y&quot;:95}]" qualitative-range-data="[{&quot;name&quot;:&quot;Range&quot;,&quot;y&quot;:50},{&quot;name&quot;:&quot;Range&quot;,&quot;y&quot;:75},{&quot;name&quot;:&quot;Range&quot;,&quot;y&quot;:100}]"></pfj-chart-bullet>
+    <pfj-chart-bullet id="bullet-chart-0" width="600" height="120" aria-title="Bullet Chart" comparative-warning-measure-data="[{&quot;name&quot;:&quot;Warning&quot;,&quot;y&quot;:88}]" primary-segmented-measure-data="[{&quot;name&quot;:&quot;Measure&quot;,&quot;y&quot;:23},{&quot;name&quot;:&quot;Measure&quot;,&quot;y&quot;:60}]" max-domain="{&quot;y&quot;:132}" qualitative-range-data="[{&quot;name&quot;:&quot;Range&quot;,&quot;y&quot;:50},{&quot;name&quot;:&quot;Range&quot;,&quot;y&quot;:75},{&quot;name&quot;:&quot;Range&quot;,&quot;y&quot;:100}]" padding="{&quot;top&quot;: 0, &quot;right&quot;: 20, &quot;bottom&quot;: 10, &quot;left&quot;: 80}" title="Threads"></pfj-chart-bullet>
 </section>
 
 <script>// modules are defined as an array
@@ -816,6 +816,10 @@ var _chartsJs = require("./src/charts.js");
         utc.title = `${current}%`;
         utc.subTitle = `${current} of 100 GBps`;
     }, 1000);
+    await customElements.whenDefined('pfj-chart-bullet');
+    const bc = document.getElementById('bullet-chart-0');
+    if (bc?.updateComplete) await bc.updateComplete;
+    bc.labels = ({ datum })=>`${datum.name}: ${datum.y}`;
 })();
 
 },{"./src/charts.js":"kkiZQ"}],"kkiZQ":[function(require,module,exports,__globalThis) {
@@ -833,16 +837,20 @@ var _chartsJs = require("./src/charts.js");
  *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
- */ var parcelHelpers = require("@parcel/transformer-js/src/esmodule-helpers.js");
+ */ // Base class for the J2CL JsInterop base class org.patternfly.chart.ChartElement
+var parcelHelpers = require("@parcel/transformer-js/src/esmodule-helpers.js");
 parcelHelpers.defineInteropFlag(exports);
+parcelHelpers.export(exports, "ChartBulletWebComponent", ()=>(0, _pfjChartBulletJs.ChartBulletWebComponent));
 parcelHelpers.export(exports, "ChartDonutWebComponent", ()=>(0, _pfjChartDonutJs.ChartDonutWebComponent));
 parcelHelpers.export(exports, "ChartDonutUtilizationWebComponent", ()=>(0, _pfjChartDonutUtilizationJs.ChartDonutUtilizationWebComponent));
 parcelHelpers.export(exports, "ChartDonutThresholdWebComponent", ()=>(0, _pfjChartDonutThresholdJs.ChartDonutThresholdWebComponent));
-parcelHelpers.export(exports, "ChartBulletWebComponent", ()=>(0, _pfjChartBulletJs.ChartBulletWebComponent));
+var _pfjChartBulletJs = require("./components/pfj-chart-bullet.js");
 var _pfjChartDonutJs = require("./components/pfj-chart-donut.js");
 var _pfjChartDonutUtilizationJs = require("./components/pfj-chart-donut-utilization.js");
 var _pfjChartDonutThresholdJs = require("./components/pfj-chart-donut-threshold.js");
-var _pfjChartBulletJs = require("./components/pfj-chart-bullet.js");
+class ChartElement extends HTMLElement {
+}
+window.ChartElement = ChartElement;
 
 },{"./components/pfj-chart-donut.js":"bNmg7","./components/pfj-chart-donut-utilization.js":"gSeNk","./components/pfj-chart-donut-threshold.js":"7XBnQ","./components/pfj-chart-bullet.js":"3RKOW","@parcel/transformer-js/src/esmodule-helpers.js":"gkKU3"}],"bNmg7":[function(require,module,exports,__globalThis) {
 /*
@@ -968,10 +976,10 @@ class ReactWrapperElement extends (0, _lit.LitElement) {
         this._height = undefined; // number
         this._labels = undefined; // (data: any) => string
         this._legendAllowWrap = undefined; // boolean
-        this._legendData = undefined; // string[]
+        this._legendData = undefined; // { name?: string; symbol?: { fill?: string; type?: string; }; }[]
         this._legendOrientation = undefined; // string
         this._legendPosition = undefined; // string
-        this._padding = undefined; // { top?: number, bottom?: number, left?: number, right?: number }
+        this._padding = undefined; // { top?: number; bottom?: number; left?: number; right?: number }
         this._subTitle = undefined; // string
         this._subTitlePosition = undefined; // string
         this._themeColor = undefined; // string
@@ -2695,7 +2703,7 @@ module.exports = require("a569817e6ea559f6");
     exports.useTransition = function() {
         return resolveDispatcher().useTransition();
     };
-    exports.version = "19.2.1";
+    exports.version = "19.2.3";
     "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
 })();
 
@@ -17817,7 +17825,7 @@ module.exports = require("2b53550ce04dc092");
     };
     (function() {
         var isomorphicReactPackageVersion = React.version;
-        if ("19.2.1" !== isomorphicReactPackageVersion) throw Error('Incompatible React versions: The "react" and "react-dom" packages must have the exact same version. Instead got:\n  - react:      ' + (isomorphicReactPackageVersion + "\n  - react-dom:  19.2.1\nLearn more: https://react.dev/warnings/version-mismatch"));
+        if ("19.2.3" !== isomorphicReactPackageVersion) throw Error('Incompatible React versions: The "react" and "react-dom" packages must have the exact same version. Instead got:\n  - react:      ' + (isomorphicReactPackageVersion + "\n  - react-dom:  19.2.3\nLearn more: https://react.dev/warnings/version-mismatch"));
     })();
     "function" === typeof Map && null != Map.prototype && "function" === typeof Map.prototype.forEach && "function" === typeof Set && null != Set.prototype && "function" === typeof Set.prototype.clear && "function" === typeof Set.prototype.forEach || console.error("React depends on Map and Set built-in types. Make sure that you load a polyfill in older browsers. https://react.dev/link/react-polyfills");
     ReactDOMSharedInternals.findDOMNode = function(componentOrElement) {
@@ -17835,10 +17843,10 @@ module.exports = require("2b53550ce04dc092");
     if (!function() {
         var internals = {
             bundleType: 1,
-            version: "19.2.1",
+            version: "19.2.3",
             rendererPackageName: "react-dom",
             currentDispatcherRef: ReactSharedInternals,
-            reconcilerVersion: "19.2.1"
+            reconcilerVersion: "19.2.3"
         };
         internals.overrideHookState = overrideHookState;
         internals.overrideHookStateDeletePath = overrideHookStateDeletePath;
@@ -17892,7 +17900,7 @@ module.exports = require("2b53550ce04dc092");
         listenToAllSupportedEvents(container);
         return new ReactDOMHydrationRoot(initialChildren);
     };
-    exports.version = "19.2.1";
+    exports.version = "19.2.3";
     "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
 })();
 
@@ -18336,7 +18344,7 @@ module.exports = require("b0f0e6b9e8349dac");
     exports.useFormStatus = function() {
         return resolveDispatcher().useHostTransitionStatus();
     };
-    exports.version = "19.2.1";
+    exports.version = "19.2.3";
     "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
 })();
 
@@ -61120,23 +61128,39 @@ class ChartBulletWebComponent extends (0, _reactWrapperJs.ReactWrapperElement) {
     constructor(){
         super();
         this._comparativeErrorMeasureData = undefined;
+        this._comparativeErrorMeasureLegendData = undefined;
         this._comparativeWarningMeasureData = undefined;
+        this._comparativeWarningMeasureLegendData = undefined;
+        this._maxDomain = undefined;
         this._primaryDotMeasureData = undefined;
+        this._primaryDotMeasureLegendData = undefined;
         this._primarySegmentedMeasureData = undefined;
+        this._primarySegmentedMeasureLegendData = undefined;
         this._qualitativeRangeData = undefined;
+        this._qualitativeRangeLegendData = undefined;
     }
     getReactComponent() {
         const extraProps = {};
         if (this._comparativeErrorMeasureData && typeof this._comparativeErrorMeasureData !== 'string') extraProps.comparativeErrorMeasureData = this._comparativeErrorMeasureData;
-        else if (this.getAttribute('comparative-error-measure-data')) extraProps.thresholds = (0, _reactWrapperJs.parseAttrValue)('comparative-error-measure-data', this.getAttribute('comparative-error-measure-data'));
+        else if (this.getAttribute('comparative-error-measure-data')) extraProps.comparativeErrorMeasureData = (0, _reactWrapperJs.parseAttrValue)('comparative-error-measure-data', this.getAttribute('comparative-error-measure-data'));
+        if (this._comparativeErrorMeasureLegendData && typeof this._comparativeErrorMeasureLegendData !== 'string') extraProps.comparativeErrorMeasureLegendData = this._comparativeErrorMeasureLegendData;
+        else if (this.getAttribute('comparative-error-measure-legend-data')) extraProps.comparativeErrorMeasureLegendData = (0, _reactWrapperJs.parseAttrValue)('comparative-error-measure-legend-data', this.getAttribute('comparative-error-measure-legend-data'));
         if (this._comparativeWarningMeasureData && typeof this._comparativeWarningMeasureData !== 'string') extraProps.comparativeWarningMeasureData = this._comparativeWarningMeasureData;
-        else if (this.getAttribute('comparative-warning-measure-data')) extraProps.thresholds = (0, _reactWrapperJs.parseAttrValue)('comparative-warning-measure-data', this.getAttribute('comparative-warning-measure-data'));
+        else if (this.getAttribute('comparative-warning-measure-data')) extraProps.comparativeWarningMeasureData = (0, _reactWrapperJs.parseAttrValue)('comparative-warning-measure-data', this.getAttribute('comparative-warning-measure-data'));
+        if (this._comparativeWarningMeasureLegendData && typeof this._comparativeWarningMeasureLegendData !== 'string') extraProps.comparativeWarningMeasureLegendData = this._comparativeWarningMeasureLegendData;
+        else if (this.getAttribute('comparative-warning-measure-legend-data')) extraProps.comparativeWarningMeasureLegendData = (0, _reactWrapperJs.parseAttrValue)('comparative-warning-measure-legend-data', this.getAttribute('comparative-warning-measure-legend-data'));
         if (this._primaryDotMeasureData && typeof this._primaryDotMeasureData !== 'string') extraProps.primaryDotMeasureData = this._primaryDotMeasureData;
-        else if (this.getAttribute('primary-dot-measure-data')) extraProps.thresholds = (0, _reactWrapperJs.parseAttrValue)('primary-dot-measure-data', this.getAttribute('primary-dot-measure-data'));
+        else if (this.getAttribute('primary-dot-measure-data')) extraProps.primaryDotMeasureData = (0, _reactWrapperJs.parseAttrValue)('primary-dot-measure-data', this.getAttribute('primary-dot-measure-data'));
+        if (this._primaryDotMeasureLegendData && typeof this._primaryDotMeasureLegendData !== 'string') extraProps.primaryDotMeasureLegendData = this._primaryDotMeasureLegendData;
+        else if (this.getAttribute('primary-dot-measure-legend-data')) extraProps.primaryDotMeasureLegendData = (0, _reactWrapperJs.parseAttrValue)('primary-dot-measure-legend-data', this.getAttribute('primary-dot-measure-legend-data'));
         if (this._primarySegmentedMeasureData && typeof this._primarySegmentedMeasureData !== 'string') extraProps.primarySegmentedMeasureData = this._primarySegmentedMeasureData;
-        else if (this.getAttribute('primary-segmented-measure-data')) extraProps.thresholds = (0, _reactWrapperJs.parseAttrValue)('primary-segmented-measure-data', this.getAttribute('primary-segmented-measure-data'));
+        else if (this.getAttribute('primary-segmented-measure-data')) extraProps.primarySegmentedMeasureData = (0, _reactWrapperJs.parseAttrValue)('primary-segmented-measure-data', this.getAttribute('primary-segmented-measure-data'));
+        if (this._primarySegmentedMeasureLegendData && typeof this._primarySegmentedMeasureLegendData !== 'string') extraProps.primarySegmentedMeasureLegendData = this._primarySegmentedMeasureLegendData;
+        else if (this.getAttribute('primary-segmented-measure-legend-data')) extraProps.primarySegmentedMeasureLegendData = (0, _reactWrapperJs.parseAttrValue)('primary-segmented-measure-legend-data', this.getAttribute('primary-segmented-measure-legend-data'));
         if (this._qualitativeRangeData && typeof this._qualitativeRangeData !== 'string') extraProps.qualitativeRangeData = this._qualitativeRangeData;
-        else if (this.getAttribute('qualitative-range-data')) extraProps.thresholds = (0, _reactWrapperJs.parseAttrValue)('qualitative-range-data', this.getAttribute('qualitative-range-data'));
+        else if (this.getAttribute('qualitative-range-data')) extraProps.qualitativeRangeData = (0, _reactWrapperJs.parseAttrValue)('qualitative-range-data', this.getAttribute('qualitative-range-data'));
+        if (this._qualitativeRangeLegendData && typeof this._qualitativeRangeLegendData !== 'string') extraProps.qualitativeRangeLegendData = this._qualitativeRangeLegendData;
+        else if (this.getAttribute('qualitative-range-legend-data')) extraProps.qualitativeRangeLegendData = (0, _reactWrapperJs.parseAttrValue)('qualitative-range-legend-data', this.getAttribute('qualitative-range-legend-data'));
         return [
             (0, _victory.ChartBullet),
             extraProps
@@ -61149,6 +61173,13 @@ class ChartBulletWebComponent extends (0, _reactWrapperJs.ReactWrapperElement) {
         this._comparativeErrorMeasureData = value;
         this._notifyChange();
     }
+    get comparativeErrorMeasureLegendData() {
+        return this._comparativeErrorMeasureLegendData;
+    }
+    set comparativeErrorMeasureLegendData(value) {
+        this._comparativeErrorMeasureLegendData = value;
+        this._notifyChange();
+    }
     get comparativeWarningMeasureData() {
         return this._comparativeWarningMeasureData;
     }
@@ -61156,6 +61187,20 @@ class ChartBulletWebComponent extends (0, _reactWrapperJs.ReactWrapperElement) {
         this._comparativeWarningMeasureData = value;
         this._notifyChange();
     }
+    get comparativeWarningMeasureLegendData() {
+        return this._comparativeWarningMeasureLegendData;
+    }
+    set comparativeWarningMeasureLegendData(value) {
+        this._comparativeWarningMeasureLegendData = value;
+        this._notifyChange();
+    }
+    get maxDomain() {
+        return this._maxDomain;
+    }
+    set maxDomain(value) {
+        this._maxDomain = value;
+        this._notifyChange();
+    }
     get primaryDotMeasureData() {
         return this._primaryDotMeasureData;
     }
@@ -61163,6 +61208,13 @@ class ChartBulletWebComponent extends (0, _reactWrapperJs.ReactWrapperElement) {
         this._primaryDotMeasureData = value;
         this._notifyChange();
     }
+    get primaryDotMeasureLegendData() {
+        return this._primaryDotMeasureLegendData;
+    }
+    set primaryDotMeasureLegendData(value) {
+        this._primaryDotMeasureLegendData = value;
+        this._notifyChange();
+    }
     get primarySegmentedMeasureData() {
         return this._primarySegmentedMeasureData;
     }
@@ -61170,6 +61222,13 @@ class ChartBulletWebComponent extends (0, _reactWrapperJs.ReactWrapperElement) {
         this._primarySegmentedMeasureData = value;
         this._notifyChange();
     }
+    get primarySegmentedMeasureLegendData() {
+        return this._primarySegmentedMeasureLegendData;
+    }
+    set primarySegmentedMeasureLegendData(value) {
+        this._primarySegmentedMeasureLegendData = value;
+        this._notifyChange();
+    }
     get qualitativeRangeData() {
         return this._qualitativeRangeData;
     }
@@ -61177,6 +61236,13 @@ class ChartBulletWebComponent extends (0, _reactWrapperJs.ReactWrapperElement) {
         this._qualitativeRangeData = value;
         this._notifyChange();
     }
+    get qualitativeRangeLegendData() {
+        return this._qualitativeRangeLegendData;
+    }
+    set qualitativeRangeLegendData(value) {
+        this._qualitativeRangeLegendData = value;
+        this._notifyChange();
+    }
 }
 customElements.define('pfj-chart-bullet', ChartBulletWebComponent);
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@patternfly-java/charts",
   "private": false,
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "Web Components wrapper around PatternFly React Charts",
   "homepage": "https://patternfly-java.github.io/",
   "repository": {

package/src/charts.js

@@ -14,17 +14,17 @@
  *  limitations under the License.
  */
 
-// Base class for J2CL JsInterop base class
+// Base class for the J2CL JsInterop base class org.patternfly.chart.ChartElement
 class ChartElement extends HTMLElement {
 }
 window.ChartElement = ChartElement;
 
+import './components/pfj-chart-bullet.js';
 import './components/pfj-chart-donut.js';
 import './components/pfj-chart-donut-utilization.js';
 import './components/pfj-chart-donut-threshold.js';
-import './components/pfj-chart-bullet.js';
 
+export {ChartBulletWebComponent} from './components/pfj-chart-bullet.js';
 export {ChartDonutWebComponent} from './components/pfj-chart-donut.js';
 export {ChartDonutUtilizationWebComponent} from './components/pfj-chart-donut-utilization.js';
 export {ChartDonutThresholdWebComponent} from './components/pfj-chart-donut-threshold.js';
-export {ChartBulletWebComponent} from './components/pfj-chart-bullet.js';

package/src/components/pfj-chart-bullet.js

@@ -21,10 +21,16 @@ export class ChartBulletWebComponent extends ReactWrapperElement {
     constructor() {
         super();
         this._comparativeErrorMeasureData = undefined;
+        this._comparativeErrorMeasureLegendData = undefined;
         this._comparativeWarningMeasureData = undefined;
+        this._comparativeWarningMeasureLegendData = undefined;
+        this._maxDomain = undefined;
         this._primaryDotMeasureData = undefined;
+        this._primaryDotMeasureLegendData = undefined;
         this._primarySegmentedMeasureData = undefined;
+        this._primarySegmentedMeasureLegendData = undefined;
         this._qualitativeRangeData = undefined;
+        this._qualitativeRangeLegendData = undefined;
     }
 
     getReactComponent() {
@@ -32,27 +38,52 @@ export class ChartBulletWebComponent extends ReactWrapperElement {
         if (this._comparativeErrorMeasureData && typeof this._comparativeErrorMeasureData !== 'string') {
             extraProps.comparativeErrorMeasureData = this._comparativeErrorMeasureData;
         } else if (this.getAttribute('comparative-error-measure-data')) {
-            extraProps.thresholds = parseAttrValue('comparative-error-measure-data', this.getAttribute('comparative-error-measure-data'));
+            extraProps.comparativeErrorMeasureData = parseAttrValue('comparative-error-measure-data', this.getAttribute('comparative-error-measure-data'));
+        }
+        if (this._comparativeErrorMeasureLegendData && typeof this._comparativeErrorMeasureLegendData !== 'string') {
+            extraProps.comparativeErrorMeasureLegendData = this._comparativeErrorMeasureLegendData;
+        } else if (this.getAttribute('comparative-error-measure-legend-data')) {
+            extraProps.comparativeErrorMeasureLegendData = parseAttrValue('comparative-error-measure-legend-data', this.getAttribute('comparative-error-measure-legend-data'));
         }
         if (this._comparativeWarningMeasureData && typeof this._comparativeWarningMeasureData !== 'string') {
             extraProps.comparativeWarningMeasureData = this._comparativeWarningMeasureData;
         } else if (this.getAttribute('comparative-warning-measure-data')) {
-            extraProps.thresholds = parseAttrValue('comparative-warning-measure-data', this.getAttribute('comparative-warning-measure-data'));
+            extraProps.comparativeWarningMeasureData = parseAttrValue('comparative-warning-measure-data', this.getAttribute('comparative-warning-measure-data'));
+        }
+        if (this._comparativeWarningMeasureLegendData && typeof this._comparativeWarningMeasureLegendData !== 'string') {
+            extraProps.comparativeWarningMeasureLegendData = this._comparativeWarningMeasureLegendData;
+        } else if (this.getAttribute('comparative-warning-measure-legend-data')) {
+            extraProps.comparativeWarningMeasureLegendData = parseAttrValue('comparative-warning-measure-legend-data', this.getAttribute('comparative-warning-measure-legend-data'));
         }
         if (this._primaryDotMeasureData && typeof this._primaryDotMeasureData !== 'string') {
             extraProps.primaryDotMeasureData = this._primaryDotMeasureData;
         } else if (this.getAttribute('primary-dot-measure-data')) {
-            extraProps.thresholds = parseAttrValue('primary-dot-measure-data', this.getAttribute('primary-dot-measure-data'));
+            extraProps.primaryDotMeasureData = parseAttrValue('primary-dot-measure-data', this.getAttribute('primary-dot-measure-data'));
+        }
+        if (this._primaryDotMeasureLegendData && typeof this._primaryDotMeasureLegendData !== 'string') {
+            extraProps.primaryDotMeasureLegendData = this._primaryDotMeasureLegendData;
+        } else if (this.getAttribute('primary-dot-measure-legend-data')) {
+            extraProps.primaryDotMeasureLegendData = parseAttrValue('primary-dot-measure-legend-data', this.getAttribute('primary-dot-measure-legend-data'));
         }
         if (this._primarySegmentedMeasureData && typeof this._primarySegmentedMeasureData !== 'string') {
             extraProps.primarySegmentedMeasureData = this._primarySegmentedMeasureData;
         } else if (this.getAttribute('primary-segmented-measure-data')) {
-            extraProps.thresholds = parseAttrValue('primary-segmented-measure-data', this.getAttribute('primary-segmented-measure-data'));
+            extraProps.primarySegmentedMeasureData = parseAttrValue('primary-segmented-measure-data', this.getAttribute('primary-segmented-measure-data'));
+        }
+        if (this._primarySegmentedMeasureLegendData && typeof this._primarySegmentedMeasureLegendData !== 'string') {
+            extraProps.primarySegmentedMeasureLegendData = this._primarySegmentedMeasureLegendData;
+        } else if (this.getAttribute('primary-segmented-measure-legend-data')) {
+            extraProps.primarySegmentedMeasureLegendData = parseAttrValue('primary-segmented-measure-legend-data', this.getAttribute('primary-segmented-measure-legend-data'));
         }
         if (this._qualitativeRangeData && typeof this._qualitativeRangeData !== 'string') {
             extraProps.qualitativeRangeData = this._qualitativeRangeData;
         } else if (this.getAttribute('qualitative-range-data')) {
-            extraProps.thresholds = parseAttrValue('qualitative-range-data', this.getAttribute('qualitative-range-data'));
+            extraProps.qualitativeRangeData = parseAttrValue('qualitative-range-data', this.getAttribute('qualitative-range-data'));
+        }
+        if (this._qualitativeRangeLegendData && typeof this._qualitativeRangeLegendData !== 'string') {
+            extraProps.qualitativeRangeLegendData = this._qualitativeRangeLegendData;
+        } else if (this.getAttribute('qualitative-range-legend-data')) {
+            extraProps.qualitativeRangeLegendData = parseAttrValue('qualitative-range-legend-data', this.getAttribute('qualitative-range-legend-data'));
         }
 
         return [ChartBullet, extraProps];
@@ -67,6 +98,15 @@ export class ChartBulletWebComponent extends ReactWrapperElement {
         this._notifyChange();
     }
 
+    get comparativeErrorMeasureLegendData() {
+        return this._comparativeErrorMeasureLegendData;
+    }
+
+    set comparativeErrorMeasureLegendData(value) {
+        this._comparativeErrorMeasureLegendData = value;
+        this._notifyChange();
+    }
+
     get comparativeWarningMeasureData() {
         return this._comparativeWarningMeasureData;
     }
@@ -76,6 +116,24 @@ export class ChartBulletWebComponent extends ReactWrapperElement {
         this._notifyChange();
     }
 
+    get comparativeWarningMeasureLegendData() {
+        return this._comparativeWarningMeasureLegendData;
+    }
+
+    set comparativeWarningMeasureLegendData(value) {
+        this._comparativeWarningMeasureLegendData = value;
+        this._notifyChange();
+    }
+
+    get maxDomain() {
+        return this._maxDomain;
+    }
+
+    set maxDomain(value) {
+        this._maxDomain = value;
+        this._notifyChange();
+    }
+
     get primaryDotMeasureData() {
         return this._primaryDotMeasureData;
     }
@@ -85,6 +143,15 @@ export class ChartBulletWebComponent extends ReactWrapperElement {
         this._notifyChange();
     }
 
+    get primaryDotMeasureLegendData() {
+        return this._primaryDotMeasureLegendData;
+    }
+
+    set primaryDotMeasureLegendData(value) {
+        this._primaryDotMeasureLegendData = value;
+        this._notifyChange();
+    }
+
     get primarySegmentedMeasureData() {
         return this._primarySegmentedMeasureData;
     }
@@ -94,6 +161,15 @@ export class ChartBulletWebComponent extends ReactWrapperElement {
         this._notifyChange();
     }
 
+    get primarySegmentedMeasureLegendData() {
+        return this._primarySegmentedMeasureLegendData;
+    }
+
+    set primarySegmentedMeasureLegendData(value) {
+        this._primarySegmentedMeasureLegendData = value;
+        this._notifyChange();
+    }
+
     get qualitativeRangeData() {
         return this._qualitativeRangeData;
     }
@@ -102,6 +178,15 @@ export class ChartBulletWebComponent extends ReactWrapperElement {
         this._qualitativeRangeData = value;
         this._notifyChange();
     }
+
+    get qualitativeRangeLegendData() {
+        return this._qualitativeRangeLegendData;
+    }
+
+    set qualitativeRangeLegendData(value) {
+        this._qualitativeRangeLegendData = value;
+        this._notifyChange();
+    }
 }
 
 customElements.define('pfj-chart-bullet', ChartBulletWebComponent);