UNPKG

@appbuckets/react-ui

Version:
72 lines (69 loc) 2.21 kB
import { __rest, __assign } from 'tslib'; import * as React from 'react'; import clsx from 'clsx'; import { createShorthandFactory, useElementType, childrenUtils, } from '@appbuckets/react-ui-core'; import { useSharedClassName } from '../utils/customHook.js'; import '../BucketTheme/BucketTheme.js'; import { useWithDefaultProps } from '../BucketTheme/BucketContext.js'; /* -------- * Import ButtonGroup async to avoid circular dependencies * -------- */ var Button = null; import('./Button.js').then(function (_a) { var buttonComponent = _a.default; Button = buttonComponent; }); /* -------- * Component Render * -------- */ var ButtonGroup = function (receivedProps) { /** Get component props */ var props = useWithDefaultProps('buttonGroup', receivedProps); var _a = useSharedClassName(props), className = _a.className, _b = _a.rest, children = _b.children, content = _b.content, buttons = _b.buttons, full = _b.full, vertical = _b.vertical, rest = __rest(_b, ['children', 'content', 'buttons', 'full', 'vertical']); /** Get the Element Type */ var ElementType = useElementType(ButtonGroup, receivedProps, props); /** Build Component Classes */ var classes = clsx({ full: full, vertical: vertical }, 'buttons', className); /** If children are defined return the element */ var hasChildren = !childrenUtils.isNil(children); if (hasChildren || content) { return React.createElement( ElementType, __assign({}, rest, { className: classes }), !hasChildren ? content : children ); } /** Generate Buttons */ var buttonsElement = Array.isArray(buttons) ? buttons.map(function (buttonProps) { return Button && Button.create(buttonProps, { autoGenerateKey: true }); }) : []; /** Return the Group */ return React.createElement( ElementType, __assign({}, rest, { className: classes }), buttonsElement ); }; /** Properly Set displayName */ ButtonGroup.displayName = 'ButtonGroup'; /** Implements the Create Factory Method */ ButtonGroup.create = createShorthandFactory(ButtonGroup, function (buttons) { return { buttons: buttons, }; }); export { ButtonGroup as default };