fui-fancyui
Version:
FancyUI Libary
58 lines (57 loc) • 1.48 kB
JavaScript
import { styled as o } from "styled-components";
import t from "../../../design/designFunctions/arrayToCssValues/arrayToCssValues.js";
const a = o.div`
position: relative;
width: 100%;
aspect-ratio: 16/9;
${({ $externalStyle: r }) => r}
`, s = o.div`
overflow: hidden;
position: relative;
height: 100%;
cursor: crosshair;
user-select: none;
border-radius: ${({ $borderRadius: r }) => t(r, "borderRadius")};
`, n = o.div`
position: absolute;
width: 100%;
height: 100%;
border-radius: ${({ $borderRadius: r }) => t(r, "borderRadius")};
`, d = o.div`
position: absolute;
width: 100%;
height: 100%;
background: linear-gradient(to right, hsl(0, 100%, 100%), transparent);
`, h = o.div`
position: absolute;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, transparent, hsl(0, 0%, 0%));
`, b = o.div`
position: absolute;
box-sizing: border-box;
transform: translate(-50%, -50%);
width: 100%;
height: 100%;
aspect-ratio: 1/1;
border-radius: ${({ theme: r }) => r.borderRadius.sm};
`, p = o.div`
position: relative;
box-sizing: border-box;
width: 12px;
height: 12px;
border: 1px solid #ffffff;
border-radius: 50%;
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5);
pointer-events: none;
transform: translate(-50%, -50%);
`;
export {
s as ColorAreaContainer,
n as CurrentColorArea,
d as LightnessGradient,
p as Marker,
h as SaturationGradient,
a as WrapperColorArea,
b as WrapperMarker
};