UNPKG

@mantine/core

Version:

React components library focused on usability, accessibility and developer experience

120 lines (113 loc) 4.16 kB
'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); var React = require('react'); var cx = require('clsx'); var Button_styles = require('./Button.styles.js'); var useMantineTheme = require('../../theme/use-mantine-theme/use-mantine-theme.js'); var mergeStyles = require('../../theme/utils/merge-styles/merge-styles.js'); function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; } var React__default = /*#__PURE__*/_interopDefaultLegacy(React); var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx); var __defProp = Object.defineProperty; var __defProps = Object.defineProperties; var __getOwnPropDescs = Object.getOwnPropertyDescriptors; var __getOwnPropSymbols = Object.getOwnPropertySymbols; var __hasOwnProp = Object.prototype.hasOwnProperty; var __propIsEnum = Object.prototype.propertyIsEnumerable; var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; var __spreadValues = (a, b) => { for (var prop in b || (b = {})) if (__hasOwnProp.call(b, prop)) __defNormalProp(a, prop, b[prop]); if (__getOwnPropSymbols) for (var prop of __getOwnPropSymbols(b)) { if (__propIsEnum.call(b, prop)) __defNormalProp(a, prop, b[prop]); } return a; }; var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b)); var __objRest = (source, exclude) => { var target = {}; for (var prop in source) if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0) target[prop] = source[prop]; if (source != null && __getOwnPropSymbols) for (var prop of __getOwnPropSymbols(source)) { if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop)) target[prop] = source[prop]; } return target; }; const BUTTON_SIZES = Button_styles.heights; const BUTTON_VARIANTS = ["link", "filled", "outline", "light"]; function Button(_a) { var _b = _a, { className, style, size = "sm", color, type = "button", disabled = false, children, leftIcon, rightIcon, fullWidth = false, variant = "filled", radius = "sm", component: Element = "button", elementRef, themeOverride, uppercase = false, classNames, styles } = _b, others = __objRest(_b, [ "className", "style", "size", "color", "type", "disabled", "children", "leftIcon", "rightIcon", "fullWidth", "variant", "radius", "component", "elementRef", "themeOverride", "uppercase", "classNames", "styles" ]); const theme = useMantineTheme.useMantineTheme(themeOverride); const classes = Button_styles['default']({ radius, color, size, fullWidth, theme }, classNames, "button"); const _styles = mergeStyles.mergeStyles(classes, styles); return /* @__PURE__ */ React__default.createElement(Element, __spreadProps(__spreadValues({}, others), { className: cx__default(classes.root, classes[variant], className), type, disabled, ref: elementRef, onTouchStart: () => { }, style: __spreadValues(__spreadValues({}, style), _styles.root) }), /* @__PURE__ */ React__default.createElement("div", { className: classes.inner, style: _styles.inner }, leftIcon && /* @__PURE__ */ React__default.createElement("span", { className: cx__default(classes.icon, classes.leftIcon), style: __spreadValues(__spreadValues({}, _styles.icon), _styles.leftIcon) }, leftIcon), /* @__PURE__ */ React__default.createElement("span", { className: classes.label, style: __spreadValues({ textTransform: uppercase ? "uppercase" : void 0 }, _styles.label) }, children), rightIcon && /* @__PURE__ */ React__default.createElement("span", { className: cx__default(classes.icon, classes.rightIcon), style: __spreadValues(__spreadValues({}, _styles.icon), _styles.rightIcon) }, rightIcon))); } Button.displayName = "@mantine/core/Button"; exports.BUTTON_SIZES = BUTTON_SIZES; exports.BUTTON_VARIANTS = BUTTON_VARIANTS; exports.Button = Button; //# sourceMappingURL=Button.js.map