cherry-styled-components
Version:
Cherry is a design system for the modern web. Designed in Figma, built in React using Typescript.
34 lines (33 loc) • 1.14 kB
JavaScript
"use client";
"use client";
import { generateColSpanStyles } from "./utils/mixins.js";
import { jsx } from "react/jsx-runtime";
import { forwardRef } from "react";
import styled from "styled-components";
//#region src/lib/col.tsx
var StyledCol = styled.div.withConfig({
displayName: "col__StyledCol",
componentId: "sc-23d5c96e-0"
})([
``,
` `,
` `,
` `,
` `,
` `,
` `,
` `,
``
], ({ $span }) => $span && `
grid-column: span ${$span};
`, ({ $xsSpan }) => $xsSpan && generateColSpanStyles("xs", $xsSpan), ({ $smSpan }) => $smSpan && generateColSpanStyles("sm", $smSpan), ({ $mdSpan }) => $mdSpan && generateColSpanStyles("md", $mdSpan), ({ $lgSpan }) => $lgSpan && generateColSpanStyles("lg", $lgSpan), ({ $xlSpan }) => $xlSpan && generateColSpanStyles("xl", $xlSpan), ({ $xxlSpan }) => $xxlSpan && generateColSpanStyles("xxl", $xxlSpan), ({ $xxxlSpan }) => $xxxlSpan && generateColSpanStyles("xxxl", $xxxlSpan));
function LocalCol({ ...props }, ref) {
return /* @__PURE__ */ jsx(StyledCol, {
...props,
ref,
children: props.children
});
}
var Col = /* @__PURE__ */ forwardRef(LocalCol);
//#endregion
export { Col };