@wix/design-system/dist/esm/SidebarBackButton/SidebarBackButton.js

@wix/design-system

import React from 'react';
import { ChevronLeft } from '@wix/wix-ui-icons-common';
import Text from '../Text';
import { st, classes } from './SidebarBackButton.st.css.js';
import { SidebarContext } from '../Sidebar/SidebarAPI';
import { sidebarSkins } from '../Sidebar/constants';
import { withFocusable } from '../common/Focusable';
import { WixDesignSystemContext } from '../WixDesignSystemProvider/context';
/**  button with an animated back arrow */
class SidebarBackButton extends React.PureComponent {
    render() {
        const { children, animateArrow, onClick, dataHook, className, focusableOnFocus, focusableOnBlur, } = this.props;
        return (React.createElement(WixDesignSystemContext.Consumer, null, () => (React.createElement(SidebarContext.Consumer, null, context => {
            const skin = (context && context.getSkin()) || sidebarSkins.dark;
            return (React.createElement("button", { className: st(classes.root, {
                    skin,
                }, className), "data-hook": dataHook, onClick: onClick, onFocus: focusableOnFocus, onBlur: focusableOnBlur, type: "button", tabIndex: "0" },
                React.createElement(ChevronLeft, { className: st(classes.arrow, { animated: animateArrow }) }),
                React.createElement(Text, { weight: "normal", size: "small", secondary: skin === sidebarSkins.light, light: skin === sidebarSkins.dark }, children)));
        }))));
    }
}
SidebarBackButton.displayName = 'SidebarBackButton';
export default withFocusable(SidebarBackButton);
//# sourceMappingURL=SidebarBackButton.js.map