wix-style-react
Version:
wix-style-react
81 lines (80 loc) • 2.77 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 _ToggleButtonSt = require("./ToggleButton.st.css");
var _useFocusRing = require("../../providers/useFocusRing/useFocusRing");
var _Text = _interopRequireDefault(require("../../Text"));
var _excluded = ["children", "prefixIcon", "selected", "size", "dataHook", "focusableOnFocus", "focusableOnBlur", "disabled", "className"];
var _jsxFileName = "/home/builduser/work/a9c1ac8876d5057c/packages/wix-style-react/dist/cjs/SegmentedToggle/ToggleButton/ToggleButton.js";
var addPrefix = (icon, size) => {
var dimension = size === 'small' ? '18' : '24';
return icon && /*#__PURE__*/_react.default.cloneElement(icon, {
width: dimension,
height: dimension,
className: (0, _ToggleButtonSt.st)(_ToggleButtonSt.classes.prefix, {
size
})
});
};
var ToggleButton = _ref => {
var {
children,
prefixIcon,
selected,
size,
dataHook,
focusableOnFocus,
focusableOnBlur,
disabled,
className
} = _ref,
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
var {
isFocusVisible,
focusProps
} = (0, _useFocusRing.useFocusRing)();
return /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({}, rest, {
className: (0, _ToggleButtonSt.st)(_ToggleButtonSt.classes.root, {
selected,
size,
'focus-visible': isFocusVisible
}, className),
"data-hook": dataHook,
"data-selected": selected,
disabled: disabled,
type: "button"
}, focusProps, {
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 35,
columnNumber: 5
}
}), addPrefix(prefixIcon, size), /*#__PURE__*/_react.default.createElement(_Text.default, {
ellipsis: true,
size: size,
weight: "thin",
skin: disabled ? 'disabled' : 'standard',
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 49,
columnNumber: 7
}
}, children));
};
ToggleButton.propTypes = {
children: _propTypes.default.node,
prefixIcon: _propTypes.default.node,
value: _propTypes.default.string,
selected: _propTypes.default.bool,
disabled: _propTypes.default.bool
};
ToggleButton.displayName = 'SegmentedToggle.Button';
var _default = exports.default = ToggleButton;
//# sourceMappingURL=ToggleButton.js.map