@appbuckets/react-ui
Version:
Just Another React UI Framework
72 lines (69 loc) • 2.21 kB
JavaScript
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 };