checkbox.js 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. "use strict";
  2. // import { CustomElement, DisplayObjectConfig, CustomEvent } from '../../shapes';
  3. // import { deepMix, isNil } from '@antv/util';
  4. // import { applyStyle, maybeAppend, select } from '../../util';
  5. // import { CheckboxStyleProps } from './types';
  6. // type StyleProps = CheckboxStyleProps & {
  7. // x?: number;
  8. // y?: number;
  9. // };
  10. // function CheckSymbol(x: number, y: number, r: number) {
  11. // return [
  12. // ['M', x - (r / 7) * 4, y - r / 14],
  13. // ['L', x - r / 7, y + (r / 7) * 3],
  14. // ['L', x + (r / 7) * 4, y - (r / 7) * 3],
  15. // ];
  16. // }
  17. // export class Checkbox extends CustomElement<StyleProps> {
  18. // private active: boolean | undefined = false;
  19. // public static defaultOptions = {
  20. // style: {
  21. // size: 12,
  22. // buttonStyle: {
  23. // fill: 'transparent',
  24. // stroke: '#000',
  25. // strokeOpacity: 0.15,
  26. // cursor: 'pointer',
  27. // lineWidth: 1,
  28. // radius: 2,
  29. // active: {
  30. // stroke: '#3471F9',
  31. // fill: '#3471F9',
  32. // strokeOpacity: 1,
  33. // },
  34. // },
  35. // symbol: {
  36. // active: {
  37. // stroke: '#fff',
  38. // },
  39. // },
  40. // labelStyle: {
  41. // text: '',
  42. // textAlign: 'left',
  43. // textBaseline: 'middle',
  44. // fill: '#000',
  45. // fillOpacity: 0.65,
  46. // },
  47. // cursor: 'pointer',
  48. // },
  49. // };
  50. // constructor(options: DisplayObjectConfig<StyleProps>) {
  51. // super(deepMix({}, Checkbox.defaultOptions, options));
  52. // this.active = this.style.active || false;
  53. // }
  54. // private get styles(): Required<StyleProps> {
  55. // return deepMix({}, Checkbox.defaultOptions.style, this.attributes);
  56. // }
  57. // public update(cfg: Partial<StyleProps> = {}) {
  58. // this.attr(deepMix({}, this.attributes, cfg));
  59. // if (!isNil(cfg.active)) {
  60. // this.active = cfg.active;
  61. // }
  62. // this.render();
  63. // }
  64. // private render() {
  65. // const { size, buttonStyle, labelStyle, symbol } = this.styles;
  66. // const { active: activeStyle, ...buttonStyles } = buttonStyle;
  67. // const button = maybeAppend(this, '.button', 'rect')
  68. // .attr('className', 'button')
  69. // .style('x', 0)
  70. // .style('y', 0)
  71. // .style('width', size)
  72. // .style('height', size)
  73. // .call(applyStyle, buttonStyles)
  74. // .call(applyStyle, this.active ? activeStyle : {})
  75. // .node();
  76. // maybeAppend(button, '.symbol', 'path')
  77. // .attr('className', 'symbol')
  78. // .style('x', size / 2)
  79. // .style('y', size / 2)
  80. // .style('path', CheckSymbol(size / 2, size / 2, size / 2))
  81. // .style('lineWidth', 1)
  82. // .style('lineCap', 'round')
  83. // .style('stroke', 'transparent')
  84. // .style('cursor', 'pointer')
  85. // .call(applyStyle, this.active ? symbol?.active : {});
  86. // maybeAppend(this, '.label', 'text')
  87. // .attr('className', 'label')
  88. // .style('x', size)
  89. // .style('y', size / 2)
  90. // .call(applyStyle, labelStyle);
  91. // }
  92. // private bindEvents() {
  93. // select(this)
  94. // .select('.button')
  95. // .on('pointerdown', () => {
  96. // this.dispatchEvent(new CustomEvent('singleModeChanged', { detail: { active: !this.active } }));
  97. // // Do a dummy component.
  98. // // this.active = !this.active;
  99. // // this.render();
  100. // });
  101. // }
  102. // }
  103. //# sourceMappingURL=checkbox.js.map