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

package/dist/index.js

@@ -24341,6 +24341,7 @@
               if (items.length > 1) {
                   vutils.last(items).setAttribute('opacity', 0);
               }
+              vutils.last(source).setAttribute('opacity', 1);
           }
       }
       source.forEach(item => {
@@ -26579,8 +26580,7 @@
               const groupClip = createGroup(Object.assign(Object.assign({}, limitRect), { clip: true, pickable: false }));
               group = createGroup({
                   x: -((_a = limitRect === null || limitRect === void 0 ? void 0 : limitRect.x) !== null && _a !== void 0 ? _a : 0),
-                  y: -((_b = limitRect === null || limitRect === void 0 ? void 0 : limitRect.y) !== null && _b !== void 0 ? _b : 0),
-                  pickable: false
+                  y: -((_b = limitRect === null || limitRect === void 0 ? void 0 : limitRect.y) !== null && _b !== void 0 ? _b : 0)
               });
               groupClip.add(group);
               this._containerClip = groupClip;
@@ -26589,8 +26589,7 @@
           else {
               group = createGroup({
                   x: 0,
-                  y: 0,
-                  pickable: false
+                  y: 0
               });
               this.add(group);
           }
@@ -26607,10 +26606,11 @@
           });
       }
       render() {
-          var _a;
-          this.setAttribute('pickable', false);
+          var _a, _b;
           const markerVisible = (_a = this.attribute.visible) !== null && _a !== void 0 ? _a : true;
-          if (this.attribute.interactive === false) {
+          const markerInteractive = (_b = this.attribute.interactive) !== null && _b !== void 0 ? _b : false;
+          if (!markerInteractive) {
+              this.setAttribute('pickable', false);
               this.setAttribute('childrenPickable', false);
           }
           if (markerVisible) {
@@ -26934,8 +26934,7 @@
               endSymbol,
               lineStyle,
               mainSegmentIndex,
-              multiSegment,
-              pickable: false
+              multiSegment
           });
           line.name = 'mark-line-line';
           this._line = line;
@@ -27212,8 +27211,7 @@
               y: position.y + ((itemContent === null || itemContent === void 0 ? void 0 : itemContent.offsetY) || 0)
           };
           const line = new Segment({
-              points: [],
-              pickable: false
+              points: []
           });
           line.name = 'mark-point-line';
           this._line = line;
@@ -31048,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));
@@ -31073,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
@@ -31088,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));
@@ -31127,7 +31140,11 @@
               x: boxX,
               y: boxY
           });
-          this._icon.setAttributes({
+          this._checkIcon.setAttributes({
+              x: iconX,
+              y: iconY
+          });
+          this._indeterminateIcon.setAttributes({
               x: iconX,
               y: iconY
           });
@@ -31143,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',
@@ -31159,6 +31178,7 @@
       interactive: true,
       disabled: false,
       checked: false,
+      indeterminate: false,
       cursor: 'pointer',
       disableCursor: 'not-allowed',
       spaceBetweenTextAndIcon: 8,
@@ -31171,7 +31191,8 @@
           pickable: false
       },
       icon: {
-          image: svg,
+          checkIconImage: checkSvg,
+          indeterminateIconImage: indeterminateSvg,
           width: 10,
           height: 10,
           pickable: false
@@ -31191,7 +31212,7 @@
       }
   };
 
-  const version = "0.16.9-alpha.0";
+  const version = "0.16.9-alpha.1";
 
   exports.AbstractComponent = AbstractComponent;
   exports.ArcInfo = ArcInfo;