@kiwicom/orbit-components/es/Inline/index.js

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

"use client";

import * as React from "react";
import cx from "clsx";
import { QUERIES } from "../utils/mediaQuery";
import { getTailwindClasses } from "./helpers";
const Inline = ({
  as: Component = "div",
  mediumMobile,
  largeMobile,
  className,
  tablet,
  desktop,
  largeDesktop,
  align,
  justify,
  spacing,
  children,
  dataTest,
  id
}) => {
  const twProps = {
    align,
    justify,
    spacing
  };
  const viewportClasses = React.useMemo(() => {
    const allViewportProps = {
      mediumMobile,
      largeMobile,
      tablet,
      desktop,
      largeDesktop
    };
    return Object.values(QUERIES).map(viewport => {
      const viewportProps = allViewportProps[viewport];
      if (viewportProps == null) {
        return null;
      }
      return getTailwindClasses(viewportProps, viewport);
    });
  }, [desktop, largeDesktop, largeMobile, mediumMobile, tablet]);
  return (
    /*#__PURE__*/
    // @ts-expect-error ts-migrate(3554) FIXME: Property 'children' does not exist on type 'IntrinsicAttributes'.ts(2322)
    React.createElement(Component, {
      className: cx("orbit-inline", className),
      id: id,
      "data-test": dataTest
    }, /*#__PURE__*/React.createElement("div", {
      className: cx("flex flex-wrap", ...getTailwindClasses(twProps), ...viewportClasses)
    }, children))
  );
};
export default Inline;