@wix/design-system
Version:
@wix/design-system
32 lines • 1.97 kB
JavaScript
import React, { useContext } from 'react';
import { CaretRight } from '@wix/wix-ui-icons-common/system';
import { Button } from '../../../Button';
import { TextButton } from '../../../TextButton';
import { BUTTON_TYPES, DATA_HOOKS, SKINS } from '../../constants';
import { useIcons } from '../../../WixDesignSystemIconThemeProvider';
import { WixDesignSystemContext } from '../../../WixDesignSystemProvider/context';
import { classes } from '../AccordionItem/AccordionItem.classes';
const AccordionItemCaret = ({ showLabel, buttonType, skin, open, disabled, hover, isLabelShown, collapseLabel, expandLabel, }) => {
const icons = useIcons('AccordionItemCaret', {
CaretRight,
});
const { mobile } = useContext(WixDesignSystemContext);
const skinProp = skin === SKINS.neutral ? 'dark' : 'standard';
const label = open ? collapseLabel : expandLabel;
if (buttonType === BUTTON_TYPES.node && isLabelShown && label) {
return (React.createElement("div", { className: classes.caretButton(), "data-hook": DATA_HOOKS.toggleButton }, label));
}
if (buttonType === BUTTON_TYPES.button &&
label &&
// For this buttonType, showLabel default is 'always' if undefined.
(showLabel === 'hover' ? hover || mobile : true)) {
return (React.createElement(Button, { skin: skinProp, size: "tiny", priority: open ? 'secondary' : 'primary', disabled: disabled, dataHook: DATA_HOOKS.toggleButton, children: label }));
}
if (buttonType === BUTTON_TYPES.textButton) {
const withLabel = !!(isLabelShown && label);
return (React.createElement(TextButton, { className: classes.caretButton(), skin: skinProp, size: "tiny", suffixIcon: React.createElement(icons.CaretRight, { className: classes.caret() }), disabled: disabled, dataHook: DATA_HOOKS.toggleButton, children: withLabel && label }));
}
return null;
};
export { AccordionItemCaret };
//# sourceMappingURL=AccordionItemCaret.js.map