@kiwicom/orbit-components
Version:
Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.
52 lines (47 loc) • 1.69 kB
JavaScript
import * as React from "react";
import styled, { css } from "styled-components";
import defaultTheme from "../../defaultTheme";
import ButtonLink from "../../ButtonLink";
const StyledOnlyButton = styled.div.withConfig({
displayName: "FilterWrapper__StyledOnlyButton",
componentId: "sc-1wzeb14-0"
})([""]);
const hoverAndFocus = () => css(["background-color:", ";", "{visibility:visible;opacity:1;}"], ({
theme
}) => theme.orbit.paletteBlueLight, StyledOnlyButton);
const StyledContentWrapper = styled.div.withConfig({
displayName: "FilterWrapper__StyledContentWrapper",
componentId: "sc-1wzeb14-1"
})(["box-sizing:border-box;width:100%;padding-left:4px;border-radius:4px;display:flex;align-items:center;height:", ";", "{visibility:hidden;opacity:0;}", ";"], ({
theme
}) => theme.orbit.heightButtonSmall, StyledOnlyButton, ({
disabled
}) => !disabled && css(["&:hover{", "}&:focus-within{", "}"], hoverAndFocus, hoverAndFocus)); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198
StyledContentWrapper.defaultProps = {
theme: defaultTheme
};
const FilterWrapper = ({
child,
children,
onOnlySelection,
onlySelectionText
}) => {
const {
value,
label,
disabled
} = child.props;
return /*#__PURE__*/React.createElement(StyledContentWrapper, {
disabled: disabled
}, children, onOnlySelection && !disabled && /*#__PURE__*/React.createElement(StyledOnlyButton, null, /*#__PURE__*/React.createElement(ButtonLink, {
type: "secondary",
size: "small",
onClick: ev => {
onOnlySelection(ev, {
value,
label
});
}
}, onlySelectionText)));
};
export default FilterWrapper;