UNPKG

@fluentui/react-northstar

Version:
110 lines (107 loc) 5.19 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); exports.__esModule = true; exports.buttonGroupClassName = exports.ButtonGroup = void 0; var _map2 = _interopRequireDefault(require("lodash/map")); var _isNil2 = _interopRequireDefault(require("lodash/isNil")); var _accessibility = require("@fluentui/accessibility"); var customPropTypes = _interopRequireWildcard(require("@fluentui/react-proptypes")); var PropTypes = _interopRequireWildcard(require("prop-types")); var React = _interopRequireWildcard(require("react")); var _utils = require("../../utils"); var _Button = require("./Button"); var _reactBindings = require("@fluentui/react-bindings"); 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; } var buttonGroupClassName = 'ui-buttons'; /** * A ButtonGroup represents multiple related actions as a group. */ exports.buttonGroupClassName = buttonGroupClassName; var ButtonGroup = /*#__PURE__*/React.forwardRef(function (props, ref) { var context = (0, _reactBindings.useFluentContext)(); var _useTelemetry = (0, _reactBindings.useTelemetry)(ButtonGroup.displayName, context.telemetry), setStart = _useTelemetry.setStart, setEnd = _useTelemetry.setEnd; setStart(); var children = props.children, buttons = props.buttons, circular = props.circular, content = props.content, className = props.className, design = props.design, styles = props.styles, variables = props.variables; var ElementType = (0, _reactBindings.getElementType)(props); var unhandledProps = (0, _reactBindings.useUnhandledProps)(ButtonGroup.handledProps, props); var _useStyles = (0, _reactBindings.useStyles)(ButtonGroup.displayName, { className: buttonGroupClassName, mapPropsToStyles: function mapPropsToStyles() { return { circular: circular }; }, mapPropsToInlineStyles: function mapPropsToInlineStyles() { return { className: className, design: design, styles: styles, variables: variables }; }, rtl: context.rtl }), classes = _useStyles.classes, resolvedStyles = _useStyles.styles; var getA11yProps = (0, _reactBindings.useAccessibility)(props.accessibility, { debugName: ButtonGroup.displayName, rtl: context.rtl }); var getStyleForButtonIndex = function getStyleForButtonIndex(styles, isFirst, isLast) { var resultStyles = {}; if (isFirst) { resultStyles = styles.firstButton; } if (isLast) { resultStyles = Object.assign({}, resultStyles, styles.lastButton); } if (!isFirst && !isLast) { resultStyles = styles.middleButton; } return resultStyles; }; var emptyButtons = (0, _isNil2.default)(buttons); var element = /*#__PURE__*/React.createElement(ElementType, Object.assign({}, getA11yProps('root', Object.assign({ className: classes.root, ref: ref }, unhandledProps)), emptyButtons && Object.assign({}, _utils.rtlTextContainer.getAttributes({ forElements: [children, content] }))), emptyButtons ? (0, _utils.childrenExist)(children) ? children : content : (0, _map2.default)(buttons, function (button, idx) { return (0, _utils.createShorthand)(_Button.Button, button, { defaultProps: function defaultProps() { return { circular: circular, styles: getStyleForButtonIndex(resolvedStyles, idx === 0, idx === buttons.length - 1) }; } }); })); setEnd(); return element; }); exports.ButtonGroup = ButtonGroup; ButtonGroup.displayName = 'ButtonGroup'; ButtonGroup.propTypes = Object.assign({}, _utils.commonPropTypes.createCommon(), { buttons: customPropTypes.collectionShorthand, circular: PropTypes.bool }); ButtonGroup.defaultProps = { accessibility: _accessibility.buttonGroupBehavior }; ButtonGroup.handledProps = Object.keys(ButtonGroup.propTypes); ButtonGroup.create = (0, _utils.createShorthandFactory)({ Component: ButtonGroup, mappedProp: 'content', mappedArrayProp: 'buttons' }); //# sourceMappingURL=ButtonGroup.js.map