@kiwicom/orbit-components/es/Itinerary/ItinerarySegment/index.js

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.

import * as React from "react";
import styled, { css } from "styled-components";
import Stack from "../../Stack";
import getSpacingToken from "../../common/getSpacingToken";
import defaultTheme from "../../defaultTheme";
import handleKeyDown from "../../utils/handleKeyDown";
import Separator from "../../Separator";
import { ItinerarySegmentProvider } from "./context";
const StyledWrapper = styled.div.withConfig({
  displayName: "ItinerarySegment__StyledWrapper",
  componentId: "sc-1cl4djs-0"
})(["", ""], ({
  theme,
  noElevation,
  actionable
}) => css(["cursor:", ";margin-bottom:", ";box-shadow:", ";border-radius:", ";padding:", " 0;", ""], actionable && "pointer", getSpacingToken, !noElevation && theme.orbit.boxShadowFixed, theme.orbit.borderRadiusLarge, theme.orbit.spaceSmall, actionable && css(["&:hover,&:focus{box-shadow:", ";}"], !noElevation && theme.orbit.boxShadowActionActive)));
StyledWrapper.defaultProps = {
  theme: defaultTheme
};
const ItinerarySegment = ({
  children,
  spaceAfter,
  dataTest,
  noElevation,
  actionable = true,
  onClick,
  banner
}) => {
  const content = React.Children.toArray(children);
  const [opened, setOpened] = React.useState(false);
  const parts = /*#__PURE__*/React.createElement(Stack, {
    direction: "column",
    spacing: "none"
  }, React.Children.map(children, (el, i) => {
    if (! /*#__PURE__*/React.isValidElement(el)) return null;
    return /*#__PURE__*/React.createElement(ItinerarySegmentProvider, {
      index: i,
      opened: opened,
      toggleOpened: () => {
        if (document && document.getSelection()?.type !== "Range") setOpened(prev => !prev);
      },
      last: i === content.length - 1,
      isNextHidden: Boolean(content[i + 1]?.props?.hidden),
      isPrevHidden: Boolean(content[i - 1]?.props?.hidden),
      isBanner: !!banner,
      count: content.length,
      isHidden: !!(el.props && el.props.hidden),
      noElevation: !!noElevation
    }, el);
  }));
  const handleClick = ev => {
    if (onClick) onClick(ev);
    setOpened(prev => !prev);
  };
  return /*#__PURE__*/React.createElement(StyledWrapper, {
    actionable: actionable,
    spaceAfter: spaceAfter,
    "data-test": dataTest,
    tabIndex: 0,
    onKeyDown: handleKeyDown(() => setOpened(prev => !prev)),
    onClick: handleClick,
    noElevation: noElevation
  }, parts, Boolean(banner) && /*#__PURE__*/React.createElement(Separator, {
    spaceAfter: "small"
  }), banner);
};
export default ItinerarySegment;