@visactor/vrender-components 0.16.8 → 0.16.9-alpha.1

package/dist/index.js

@@ -26303,7 +26303,9 @@
           }
           ((_c = selectedBackgroundChartStyle === null || selectedBackgroundChartStyle === void 0 ? void 0 : selectedBackgroundChartStyle.line) === null || _c === void 0 ? void 0 : _c.visible) && this.setSelectedPreviewAttributes('line', group);
           ((_d = selectedBackgroundChartStyle === null || selectedBackgroundChartStyle === void 0 ? void 0 : selectedBackgroundChartStyle.area) === null || _d === void 0 ? void 0 : _d.visible) && this.setSelectedPreviewAttributes('area', group);
-          this.renderText();
+          if (this._showText) {
+              this.renderText();
+          }
           if (this._isHorizontal) {
               this._startHandler = group.createOrUpdateChild('startHandler', Object.assign({ x: position.x + start * width, y: position.y + height / 2, size: height, angle: 0, symbolType: (_e = startHandlerStyle === null || startHandlerStyle === void 0 ? void 0 : startHandlerStyle.symbolType) !== null && _e !== void 0 ? _e : 'square', cursor: 'ew-resize', strokeBoundsBuffer: 0, boundsPadding: 2, pickMode: 'imprecise' }, startHandlerStyle), 'symbol');
               this._endHandler = group.createOrUpdateChild('endHandler', Object.assign({ x: position.x + end * width, y: position.y + height / 2, size: height, angle: 0, symbolType: (_f = endHandlerStyle === null || endHandlerStyle === void 0 ? void 0 : endHandlerStyle.symbolType) !== null && _f !== void 0 ? _f : 'square', cursor: 'ew-resize', strokeBoundsBuffer: 0, boundsPadding: 2, pickMode: 'imprecise' }, endHandlerStyle), 'symbol');
@@ -31044,7 +31046,8 @@
       return new Tag(params ? params.attribute : {});
   }
 
-  const svg = '<svg width="200" height="200" viewBox="0 0 1024 1024" fill="#fff" xmlns="http://www.w3.org/2000/svg"><path d="M877.44815445 206.10060629a64.72691371 64.72691371 0 0 0-95.14856334 4.01306852L380.73381888 685.46812814 235.22771741 533.48933518a64.72691371 64.72691371 0 0 0-92.43003222-1.03563036l-45.82665557 45.82665443a64.72691371 64.72691371 0 0 0-0.90617629 90.61767965l239.61903446 250.10479331a64.72691371 64.72691371 0 0 0 71.19960405 15.14609778 64.33855261 64.33855261 0 0 0 35.08198741-21.23042702l36.24707186-42.71976334 40.5190474-40.77795556-3.36579926-3.49525333 411.40426297-486.74638962a64.72691371 64.72691371 0 0 0-3.88361443-87.64024149l-45.3088404-45.43829334z"></path></svg>';
+  const checkSvg = '<svg width="200" height="200" viewBox="0 0 1024 1024" fill="#fff" xmlns="http://www.w3.org/2000/svg"><path d="M877.44815445 206.10060629a64.72691371 64.72691371 0 0 0-95.14856334 4.01306852L380.73381888 685.46812814 235.22771741 533.48933518a64.72691371 64.72691371 0 0 0-92.43003222-1.03563036l-45.82665557 45.82665443a64.72691371 64.72691371 0 0 0-0.90617629 90.61767965l239.61903446 250.10479331a64.72691371 64.72691371 0 0 0 71.19960405 15.14609778 64.33855261 64.33855261 0 0 0 35.08198741-21.23042702l36.24707186-42.71976334 40.5190474-40.77795556-3.36579926-3.49525333 411.40426297-486.74638962a64.72691371 64.72691371 0 0 0-3.88361443-87.64024149l-45.3088404-45.43829334z"></path></svg>';
+  const indeterminateSvg = '<svg width="200" height="200" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none"><path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="5" d="M5 12h14"/></svg>';
   class CheckBox extends AbstractComponent {
       constructor(attributes) {
           super(vutils.merge({}, CheckBox.defaultAttributes, attributes));
@@ -31069,13 +31072,14 @@
       }
       renderBox() {
           this._box = new Rect(vutils.merge({}, this.attribute.box));
-          if (this.attribute.checked && this.attribute.disabled) {
+          const isCheckedOrIndeterminate = this.attribute.checked || this.attribute.indeterminate;
+          if (isCheckedOrIndeterminate && this.attribute.disabled) {
               this._box.setAttributes({
                   fill: this.attribute.box.disableCheckedFill,
                   stroke: this.attribute.box.disableCheckedStroke
               });
           }
-          else if (this.attribute.checked) {
+          else if (isCheckedOrIndeterminate) {
               this._box.setAttributes({
                   fill: this.attribute.box.checkedFill,
                   stroke: this.attribute.box.checkedStroke
@@ -31084,11 +31088,24 @@
           this.appendChild(this._box);
       }
       renderIcon() {
-          this._icon = new Image(vutils.merge({}, this.attribute.icon));
-          if (!this.attribute.checked) {
-              this._icon.setAttribute('visible', false);
+          this._checkIcon = new Image(vutils.merge({ image: this.attribute.icon.checkIconImage }, this.attribute.icon));
+          this.appendChild(this._checkIcon);
+          this._indeterminateIcon = new Image(vutils.merge({
+              image: this.attribute.icon.indeterminateIconImage
+          }, this.attribute.icon));
+          this.appendChild(this._indeterminateIcon);
+          if (this.attribute.checked) {
+              this._checkIcon.setAttribute('visible', true);
+              this._indeterminateIcon.setAttribute('visible', false);
+          }
+          else if (this.attribute.indeterminate) {
+              this._checkIcon.setAttribute('visible', false);
+              this._indeterminateIcon.setAttribute('visible', true);
+          }
+          else {
+              this._checkIcon.setAttribute('visible', false);
+              this._indeterminateIcon.setAttribute('visible', false);
           }
-          this.appendChild(this._icon);
       }
       renderText() {
           this._text = new WrapText(vutils.merge({}, this.attribute.text));
@@ -31123,7 +31140,11 @@
               x: boxX,
               y: boxY
           });
-          this._icon.setAttributes({
+          this._checkIcon.setAttributes({
+              x: iconX,
+              y: iconY
+          });
+          this._indeterminateIcon.setAttributes({
               x: iconX,
               y: iconY
           });
@@ -31139,9 +31160,11 @@
           }
           else if (this.attribute.checked) {
               this.setAttribute('checked', false);
+              this.setAttribute('indeterminate', false);
           }
           else {
               this.setAttribute('checked', true);
+              this.setAttribute('indeterminate', false);
           }
           const changeEvent = new CustomEvent('checkbox_state_change', {
               eventType: 'checkbox_state_change',
@@ -31155,6 +31178,7 @@
       interactive: true,
       disabled: false,
       checked: false,
+      indeterminate: false,
       cursor: 'pointer',
       disableCursor: 'not-allowed',
       spaceBetweenTextAndIcon: 8,
@@ -31167,7 +31191,8 @@
           pickable: false
       },
       icon: {
-          image: svg,
+          checkIconImage: checkSvg,
+          indeterminateIconImage: indeterminateSvg,
           width: 10,
           height: 10,
           pickable: false
@@ -31187,7 +31212,7 @@
       }
   };
 
-  const version = "0.16.8";
+  const version = "0.16.9-alpha.1";
 
   exports.AbstractComponent = AbstractComponent;
   exports.ArcInfo = ArcInfo;