swOperation/node_modules/@antv/gui/esm/ui/slider/handle.js

import { __assign, __extends, __read, __rest } from "tslib";
import { GUI } from '../../core';
import { classNames, ifShow, select, splitStyle, subStyleProps } from '../../util';
import { HANDLE_DEFAULT_CFG, HANDLE_ICON_DEFAULT_CFG, HANDLE_LABEL_DEFAULT_CFG } from './constant';
var CLASS_NAMES = classNames({
    labelGroup: 'label-group',
    label: 'label',
    iconGroup: 'icon-group',
    icon: 'icon',
    iconRect: 'icon-rect',
    iconLine: 'icon-line',
}, 'handle');
var HandleIcon = /** @class */ (function (_super) {
    __extends(HandleIcon, _super);
    function HandleIcon() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    HandleIcon.prototype.render = function (attributes, container) {
        var _a = attributes.size, size = _a === void 0 ? 10 : _a, _b = attributes.radius, radius = _b === void 0 ? size / 4 : _b, orientation = attributes.orientation, iconStyle = __rest(attributes, ["size", "radius", "orientation"]);
        // 默认手柄
        var width = size;
        var height = width * 2.4;
        var rect = select(container)
            .maybeAppendByClassName(CLASS_NAMES.iconRect, 'rect')
            .styles(__assign(__assign({}, iconStyle), { width: width, height: height, radius: radius, x: -width / 2, y: -height / 2 }));
        var x1 = (1 / 3) * width;
        var x2 = (2 / 3) * width;
        var y1 = (1 / 4) * height;
        var y2 = (3 / 4) * height;
        rect.maybeAppendByClassName("".concat(CLASS_NAMES.iconLine, "-1"), 'line').styles(__assign({ x1: x1, x2: x1, y1: y1, y2: y2 }, iconStyle));
        rect.maybeAppendByClassName("".concat(CLASS_NAMES.iconLine, "-2"), 'line').styles(__assign({ x1: x2, x2: x2, y1: y1, y2: y2 }, iconStyle));
        rect.node().setOrigin(width / 2, height / 2);
        if (orientation === 'vertical')
            container.setLocalEulerAngles(90);
        else
            container.setLocalEulerAngles(0);
    };
    return HandleIcon;
}(GUI));
var Handle = /** @class */ (function (_super) {
    __extends(Handle, _super);
    function Handle(options) {
        return _super.call(this, options, HANDLE_DEFAULT_CFG) || this;
    }
    Handle.prototype.renderLabel = function (container) {
        var _this = this;
        var showLabel = this.attributes.showLabel;
        var style = subStyleProps(this.attributes, 'label');
        var _a = __read(splitStyle(style, []), 2), labelStyle = _a[0], groupStyle = _a[1];
        var labelGroup = select(container).maybeAppendByClassName(CLASS_NAMES.labelGroup, 'g').styles(groupStyle);
        // @ts-ignore
        var _b = __assign(__assign({}, HANDLE_LABEL_DEFAULT_CFG), labelStyle), text = _b.text, rest = __rest(_b, ["text"]);
        ifShow(!!showLabel, labelGroup, function (group) {
            _this.label = group.maybeAppendByClassName(CLASS_NAMES.label, 'text').styles(__assign(__assign({}, rest), { text: "".concat(text) }));
            /** avoid trigger event on label */
            _this.label.on('mousedown', function (e) {
                e.stopPropagation();
            });
            _this.label.on('touchstart', function (e) {
                e.stopPropagation();
            });
        });
    };
    Handle.prototype.renderIcon = function (container) {
        var orientation = this.attributes.orientation;
        var iconStyle = __assign(__assign({ orientation: orientation }, HANDLE_ICON_DEFAULT_CFG), subStyleProps(this.attributes, 'icon'));
        var _a = this.attributes.iconShape, iconShape = _a === void 0 ? function () { return new HandleIcon({ style: iconStyle }); } : _a;
        var iconGroup = select(container).maybeAppendByClassName(CLASS_NAMES.iconGroup, 'g');
        iconGroup
            .selectAll(CLASS_NAMES.icon.class)
            .data([iconShape])
            .join(function (enter) { return enter.append(iconShape).attr('className', CLASS_NAMES.icon.name); }, function (update) { return update.update(iconStyle); }, function (exit) { return exit.remove(); });
    };
    Handle.prototype.render = function (attributes, container) {
        this.renderIcon(container);
        this.renderLabel(container);
    };
    return Handle;
}(GUI));
export { Handle };
//# sourceMappingURL=handle.js.map