wix-style-react
Version:
wix-style-react
107 lines (106 loc) • 3.8 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _Focusable = require("../../common/Focusable");
var _TooltipCommon = require("../../common/PropTypes/TooltipCommon");
var _Tooltip = _interopRequireDefault(require("../../Tooltip"));
var _ToggleIconSt = require("./ToggleIcon.st.css");
var _excluded = ["data-click", "selected", "size", "onClick", "focusableOnFocus", "focusableOnBlur", "children", "className"],
_excluded2 = ["children", "selected", "size", "tooltipText", "tooltipProps", "focusableOnFocus", "focusableOnBlur", "onClick", "dataHook", "data-click"];
var _jsxFileName = "/home/builduser/work/a9c1ac8876d5057c/packages/wix-style-react/dist/cjs/SegmentedToggle/ToggleIcon/ToggleIcon.js";
var Icon = _ref => {
var {
'data-click': dataClick,
selected,
size,
onClick,
focusableOnFocus,
focusableOnBlur,
children,
className
} = _ref,
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
return /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({}, rest, {
className: (0, _ToggleIconSt.st)(_ToggleIconSt.classes.button, {
selected,
size
}, className),
"data-click": dataClick,
"data-hook": "toggle-icon",
"data-selected": selected,
onClick: onClick,
onFocus: focusableOnFocus,
onBlur: focusableOnBlur,
type: "button",
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 20,
columnNumber: 3
}
}), children);
};
var FocusableIcon = (0, _Focusable.withFocusable)(Icon);
class ToggleIcon extends _react.default.Component {
render() {
var _this$props = this.props,
{
children,
selected,
size,
tooltipText,
tooltipProps,
focusableOnFocus,
focusableOnBlur,
onClick,
dataHook,
'data-click': dataClick
} = _this$props,
rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded2);
return /*#__PURE__*/_react.default.createElement(_Tooltip.default, (0, _extends2.default)({}, tooltipProps, {
className: (0, _ToggleIconSt.st)(_ToggleIconSt.classes.tooltip),
dataHook: dataHook,
appendTo: "window",
placement: "top",
content: tooltipText,
timeout: 0,
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 64,
columnNumber: 7
}
}), /*#__PURE__*/_react.default.createElement(FocusableIcon, (0, _extends2.default)({}, rest, {
size: size,
selected: selected,
"data-click": dataClick,
onClick: onClick,
onFocus: focusableOnFocus,
onBlur: focusableOnBlur,
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 73,
columnNumber: 9
}
}), children ? /*#__PURE__*/_react.default.cloneElement(children, {
size: size === 'small' ? '18px' : '24px'
}) : null));
}
}
ToggleIcon.displayName = 'SegmentedToggle.Icon';
ToggleIcon.propTypes = {
children: _propTypes.default.node,
selected: _propTypes.default.bool,
value: _propTypes.default.string,
tooltipText: _propTypes.default.string,
tooltipProps: _propTypes.default.shape(_TooltipCommon.TooltipCommonProps),
disabled: _propTypes.default.bool
};
var _default = exports.default = ToggleIcon;
//# sourceMappingURL=ToggleIcon.js.map