adonisjs-ui
Version:
[](https://npmjs.com/package/adonisjs-ui) [](https://npm.chart.dev/adonisjs-ui)
38 lines (37 loc) • 1.65 kB
JavaScript
import { tv } from "tailwind-variants";
export const field = tv({
slots: {
root: [
"min-w-0",
"[&:not(:has([data-ui-field])):has([data-ui-control][disabled])>[data-ui-label]]:opacity-50",
"[&:has(>[data-ui-radio-group][disabled])>[data-ui-label]]:opacity-50",
"[&:has(>[data-ui-checkbox-group][disabled])>[data-ui-label]]:opacity-50",
],
},
variants: {
variant: {
block: {
root: [
"block",
"*:data-ui-label:mb-3 [&>[data-ui-label]:has(+[data-ui-description])]:mb-2",
"[&>[data-ui-label]+[data-ui-description]]:mt-0",
"[&>[data-ui-label]+[data-ui-description]]:mb-3",
"[&>*:not([data-ui-label])+[data-ui-description]]:mt-3",
],
},
inline: {
root: [
"grid gap-x-3 gap-y-1.5",
"has-[[data-ui-label]~[data-ui-control]]:grid-cols-[1fr_auto]",
"has-[[data-ui-control]~[data-ui-label]]:grid-cols-[auto_1fr]",
"[&>[data-ui-control]~[data-ui-description]]:row-start-2 [&>[data-ui-control]~[data-ui-description]]:col-start-2",
"[&>[data-ui-control]~[data-ui-error]]:col-span-2 [&>[data-ui-control]~[data-ui-error]]:mt-1", // Position error messages...
"[&>[data-ui-label]~[data-ui-control]]:row-start-1 [&>[data-ui-label]~[data-ui-control]]:col-start-2",
],
},
},
},
defaultVariants: {
variant: "block",
},
});