wix-style-react
Version:
187 lines (139 loc) • 8.75 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireWildcard(require("react"));
var _buttonNext = require("wix-ui-core/dist/src/components/button-next");
var _Ellipsis = _interopRequireDefault(require("../common/Ellipsis"));
var _TooltipCommon = require("../common/PropTypes/TooltipCommon");
var _propTypes = _interopRequireDefault(require("prop-types"));
var _generateDataAttr = require("../utils/generateDataAttr");
var _TextButtonSt = require("./TextButton.st.css");
var _excluded = ["skin", "underline", "weight", "size", "children", "className", "dataHook", "fluid", "ellipsis", "showTooltip", "tooltipProps", "ariaLabel", "ariaLabelledBy", "ariaHaspopup", "ariaExpanded"];
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var TextButton = /*#__PURE__*/function (_PureComponent) {
(0, _inherits2["default"])(TextButton, _PureComponent);
var _super = _createSuper(TextButton);
function TextButton() {
(0, _classCallCheck2["default"])(this, TextButton);
return _super.apply(this, arguments);
}
(0, _createClass2["default"])(TextButton, [{
key: "render",
value: function render() {
var _this = this;
var _this$props = this.props,
skin = _this$props.skin,
underline = _this$props.underline,
weight = _this$props.weight,
size = _this$props.size,
children = _this$props.children,
className = _this$props.className,
dataHook = _this$props.dataHook,
fluid = _this$props.fluid,
ellipsis = _this$props.ellipsis,
showTooltip = _this$props.showTooltip,
tooltipProps = _this$props.tooltipProps,
ariaLabel = _this$props.ariaLabel,
ariaLabelledBy = _this$props.ariaLabelledBy,
ariaHaspopup = _this$props.ariaHaspopup,
ariaExpanded = _this$props.ariaExpanded,
rest = (0, _objectWithoutProperties2["default"])(_this$props, _excluded);
return /*#__PURE__*/_react["default"].createElement(_Ellipsis["default"], (0, _extends2["default"])({
ellipsis: ellipsis,
showTooltip: showTooltip
}, tooltipProps, {
render: function render(_ref) {
var ref = _ref.ref,
ellipsisClasses = _ref.ellipsisClasses;
return /*#__PURE__*/_react["default"].createElement(_buttonNext.ButtonNext, (0, _extends2["default"])({}, rest, (0, _generateDataAttr.generateDataAttr)(_this.props, ['skin', 'size', 'weight', 'underline']), {
className: (0, _TextButtonSt.st)(_TextButtonSt.classes.root, {
skin: skin,
underline: underline,
weight: weight,
size: size,
fluid: fluid,
ellipsis: ellipsis
}, className),
"data-hook": dataHook,
contentClassName: ellipsisClasses(),
contentRef: ref,
"aria-label": ariaLabel,
"aria-labelledby": ariaLabelledBy,
"aria-haspopup": ariaHaspopup,
"aria-expanded": ariaExpanded
}), children);
}
}));
}
}]);
return TextButton;
}(_react.PureComponent);
(0, _defineProperty2["default"])(TextButton, "displayName", 'TextButton');
(0, _defineProperty2["default"])(TextButton, "propTypes", {
/** render as some other component or DOM tag */
as: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].object, _propTypes["default"].string]),
/** Additional classes */
className: _propTypes["default"].string,
/** Skins of TextButton content */
skin: _propTypes["default"].oneOf(['standard', 'light', 'premium', 'dark', 'destructive']),
/** Underline of TextButton content */
underline: _propTypes["default"].oneOf(['none', 'onHover', 'always']),
/** Weight of TextButton content */
weight: _propTypes["default"].oneOf(['thin', 'normal']),
/** Size of TextButton content */
size: _propTypes["default"].oneOf(['tiny', 'small', 'medium']),
/** Click event handler */
onClick: _propTypes["default"].func,
/** Element based icon (svg, image etc.) */
suffixIcon: _propTypes["default"].element,
/** Element based icon (svg, image etc.) */
prefixIcon: _propTypes["default"].element,
/** Applies disabled styles */
disabled: _propTypes["default"].bool,
/** String based node */
children: _propTypes["default"].node,
/** String based data hook */
dataHook: _propTypes["default"].string,
/** Stretches text button to its container width */
fluid: _propTypes["default"].bool,
/** should the text get ellipsized with tooltip, or should it get broken into lines when it reaches the end of its container */
ellipsis: _propTypes["default"].bool,
/** True by default, set it to false in order to show ellipsis without a tooltip. */
showTooltip: _propTypes["default"].bool,
/** Props that modify the Tooltip created from text ellipsis */
tooltipProps: _propTypes["default"].shape(_TooltipCommon.TooltipCommonProps),
/** Defines a string value that labels the button element */
ariaLabel: _propTypes["default"].string,
/** Identifies the element that labels the button element */
ariaLabelledBy: _propTypes["default"].string,
/** Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element. */
ariaHaspopup: _propTypes["default"].string,
/** Indicates to screen reader users whether the collapsable content below is in the expanded or in the collapsed state */
ariaExpanded: _propTypes["default"].bool
});
(0, _defineProperty2["default"])(TextButton, "defaultProps", {
skin: 'standard',
underline: 'none',
weight: 'thin',
size: 'medium',
disabled: false,
fluid: false,
tooltipProps: {}
});
var _default = TextButton;
exports["default"] = _default;