@trail-ui/react
Version:
33 lines (31 loc) • 1.84 kB
JavaScript
// src/multiselect/tw-utils.ts
import { composeRenderProps } from "react-aria-components";
import { twMerge } from "tailwind-merge";
function composeTailwindRenderProps(className, tw) {
return composeRenderProps(className, (className2) => twMerge(tw, className2));
}
var focusOutlineStyle = ["outline outline-2 outline-blue-500 outline-offset-2"];
var inputFieldStyle = [
"group flex flex-col",
"[&_[data-slot=label]:not([class*=mb-])]:mb-1",
"[&_[data-slot=description]:not([class*=mb-]):has(+:is(input,textarea,[data-slot=control]))]:mb-2",
"[&_:is(input,textarea,[data-slot=control])+[data-slot=description]:not([class*=mt-])]:mt-1"
];
var groupContentStyle = [
"group flex flex-col",
"[&_[data-slot=description]:not([class*=mt-]):has(+[data-slot=content])]:mt-1",
"[&:has(:is([type=checkbox],[type=radio],[role=switch]))_[data-slot=content]:not([class*=mt-])]:mt-6",
"[&:has(:is([type=checkbox],[type=radio],[role=switch]))_[data-slot=content]:not([class*=gap-])]:gap-6",
"[&[data-orientation=horizontal]:has(:is([type=checkbox],[type=radio],[role=switch]))_[data-slot=content]:not([class*=gap-y-])]:gap-y-2"
];
var selectBoxIndicator = [
"before:pointer-events-none before:absolute before:end-1.5 before:top-[42%] before:size-[5px] before:-translate-x-1.5 before:-translate-y-1/2 before:rotate-45 before:border-l-[1.5px] before:border-t-[1.5px] before:border-muted before:content-[''] rtl:before:translate-x-1.5",
"after:pointer-events-none after:absolute after:bottom-[42%] after:end-1.5 after:size-[5px] after:-translate-x-1.5 after:translate-y-1/2 after:rotate-45 after:border-b-[1.5px] after:border-r-[1.5px] after:border-muted after:content-[''] rtl:after:translate-x-1.5"
];
export {
composeTailwindRenderProps,
focusOutlineStyle,
inputFieldStyle,
groupContentStyle,
selectBoxIndicator
};