@kiwicom/orbit-components/es/OrbitProvider/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 { tokensToCssVars, defaultTokens } from "@kiwicom/orbit-design-tokens";
import { parseToRgba } from "color2k";
import QueryContextProvider from "./QueryContext/Provider";
import RandomIdProvider from "./RandomId/Provider";
import ThemeProvider from "./ThemeProvider/Provider";
export const getCssVarsForWL = theme => Object.keys(theme).reduce((acc, key) => {
  if (key.startsWith("palette") || key.startsWith("buttonPrimary") || key === "borderRadius100") {
    try {
      if (key === "borderRadius100") {
        acc[key] = theme[key];
      } else {
        // the token is a color
        acc[key] = parseToRgba(theme[key]).slice(0, -1).join(", ");
      }
    } catch (e) {
      console.error("OrbitProvider-getCssVarsForWL: couldn't parse palette color, using fallback value from defaultTheme", key, e);
      acc[key] = parseToRgba(defaultTokens[key]).slice(0, -1).join(", ");
    }
  }
  return acc;
}, {});

/**
 * The OrbitProvider component provides theming and other Orbit features to the application.
 */

const OrbitProvider = ({
  theme,
  children
}) => {
  return /*#__PURE__*/React.createElement(RandomIdProvider, null, /*#__PURE__*/React.createElement("style", {
    id: "orbit-theme-css-vars"
  }, tokensToCssVars({
    tokens: getCssVarsForWL(theme.orbit),
    cssClass: ":root"
  })), /*#__PURE__*/React.createElement(ThemeProvider, {
    theme: theme
  }, /*#__PURE__*/React.createElement(QueryContextProvider, null, children)));
};
export default OrbitProvider;