@wix/design-system
Version:
@wix/design-system
121 lines (120 loc) • 4.2 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _AngleInput = require("./AngleInput.constants");
var _AngleInputSt = require("./AngleInput.st.css.js");
var _useAngleInput2 = require("./hooks/useAngleInput");
var _WixDesignSystemDefaultPropsProvider = require("../WixDesignSystemDefaultPropsProvider");
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/AngleInput/AngleInput.tsx";
var AngleInput = props => {
var _useDefaultProps = (0, _WixDesignSystemDefaultPropsProvider.useDefaultProps)('AngleInput', props),
onChange = _useDefaultProps.onChange,
onPointerDown = _useDefaultProps.onPointerDown,
onPointerUp = _useDefaultProps.onPointerUp,
onFocus = _useDefaultProps.onFocus,
onBlur = _useDefaultProps.onBlur,
dataHook = _useDefaultProps.dataHook,
value = _useDefaultProps.value,
_useDefaultProps$disa = _useDefaultProps.disabled,
disabled = _useDefaultProps$disa === void 0 ? false : _useDefaultProps$disa,
_useDefaultProps$step = _useDefaultProps.step,
step = _useDefaultProps$step === void 0 ? 1 : _useDefaultProps$step;
var _useAngleInput = (0, _useAngleInput2.useAngleInput)({
onChange,
onPointerDown,
onPointerUp,
onFocus,
onBlur,
step
}),
rootRef = _useAngleInput.rootRef,
handlePointerDown = _useAngleInput.handlePointerDown,
handlePointerUp = _useAngleInput.handlePointerUp,
handlePointerMove = _useAngleInput.handlePointerMove,
handleInputChange = _useAngleInput.handleInputChange,
handleKeyboardEvent = _useAngleInput.handleKeyboardEvent,
handleFocus = _useAngleInput.handleFocus,
handleBlur = _useAngleInput.handleBlur;
return /*#__PURE__*/_react.default.createElement("div", {
onPointerDown: handlePointerDown,
onPointerMove: handlePointerMove,
onPointerUp: handlePointerUp,
className: (0, _AngleInputSt.st)(_AngleInputSt.classes.root, {
disabled
}),
"data-hook": dataHook,
"aria-disabled": disabled,
ref: rootRef,
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 39,
columnNumber: 5
}
}, /*#__PURE__*/_react.default.createElement("div", {
className: _AngleInputSt.classes.track,
"data-hook": _AngleInput.dataHooks.track,
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 48,
columnNumber: 7
}
}, /*#__PURE__*/_react.default.createElement("div", {
className: (0, _AngleInputSt.st)(_AngleInputSt.classes.knobWrapper),
"data-hook": _AngleInput.dataHooks.knobWrapper,
style: {
transform: "rotate(".concat(value, "deg)")
},
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 49,
columnNumber: 9
}
}, /*#__PURE__*/_react.default.createElement("div", {
className: (0, _AngleInputSt.st)(_AngleInputSt.classes.knob),
"data-hook": _AngleInput.dataHooks.knob,
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 56,
columnNumber: 11
}
}, /*#__PURE__*/_react.default.createElement("input", {
type: "range",
value: value,
className: _AngleInputSt.classes.visuallyHiddenInput,
onChange: handleInputChange,
onKeyDown: handleKeyboardEvent,
onFocus: handleFocus,
step: step,
onBlur: handleBlur,
min: _AngleInput.angleLimits.min,
max: _AngleInput.angleLimits.max,
disabled: disabled,
"data-hook": _AngleInput.dataHooks.input,
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 57,
columnNumber: 13
}
}))), /*#__PURE__*/_react.default.createElement("div", {
className: _AngleInputSt.classes.arm,
style: {
transform: "rotate(".concat(value, "deg)")
},
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 74,
columnNumber: 9
}
})));
};
AngleInput.displayName = 'AngleInput';
var _default = exports.default = AngleInput;
//# sourceMappingURL=AngleInput.js.map