cherry-styled-components/dist/box.js

Cherry is a design system for the modern web. Designed in Figma, built in React using Typescript.

"use client";
"use client";
import { Container } from "./container.js";
import { jsx } from "react/jsx-runtime";
import { forwardRef } from "react";
import styled from "styled-components";
//#region src/lib/box.tsx
var StyledBox = styled(Container).withConfig({
	displayName: "box__StyledBox",
	componentId: "sc-3e07b0c8-0"
})([
	`background:`,
	`;border-radius:`,
	`;border:solid 1px `,
	`;`
], ({ theme }) => theme.colors.light, ({ theme }) => theme.spacing.radius.lg, ({ theme }) => theme.colors.grayLight);
function LocalBox({ ...props }, ref) {
	return /* @__PURE__ */ jsx(StyledBox, {
		...props,
		ref,
		children: props.children
	});
}
var Box = /* @__PURE__ */ forwardRef(LocalBox);
//#endregion
export { Box };