UNPKG

@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.84 kB
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" })(["", ""], ({ disabled }) => css(["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 && css(["@media (hover:none){", "{visibility:visible;opacity:0.3;&:hover{opacity:1;}}}@media (hover) and (pointer:fine){&:hover{", ";}&:focus-within{", "}}"], StyledOnlyButton, 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;