braid-design-system/dist/lib/components/Box/Box.playroom.cjs

Themeable design system for the SEEK Group

"use strict";
const jsxRuntime = require("react/jsx-runtime");
const react = require("react");
const lib_css_atoms_atoms_cjs = require("../../css/atoms/atoms.cjs");
const lib_components_Box_Box_cjs = require("./Box.cjs");
const lib_css_atoms_sprinkles_css_cjs = require("../../css/atoms/sprinkles.css.cjs");
const Box = react.forwardRef((props, ref) => {
  const sprinklesProps = {};
  const otherProps = {};
  for (const key in props) {
    if (lib_css_atoms_sprinkles_css_cjs.sprinkles.properties.has(key)) {
      const value = props[key];
      try {
        lib_css_atoms_atoms_cjs.atoms({ [key]: value });
        sprinklesProps[key] = value;
      } catch {
        if (key === "background") {
          if (typeof value === "string" && /^customDark|customLight$/.test(value) || typeof value === "object" && (value.darkMode || value.lightMode)) {
            sprinklesProps[key] = value;
          }
        }
      }
    } else {
      otherProps[key] = props[key];
    }
  }
  return /* @__PURE__ */ jsxRuntime.jsx(lib_components_Box_Box_cjs.Box, { ref, ...sprinklesProps, ...otherProps });
});
Box.displayName = "Box";
exports.Box = Box;