laif-ds
Version:
Design System di Laif con componenti React basati su principi di Atomic Design
33 lines (32 loc) • 1.23 kB
JavaScript
"use client";
import { jsx as e } from "react/jsx-runtime";
import { Root as d, Thumb as n } from "../../node_modules/@radix-ui/react-switch/dist/index.js";
import { cn as t } from "../../lib/utils.js";
function c({
className: r,
...a
}) {
return /* @__PURE__ */ e(
d,
{
"data-slot": "switch",
className: t(
"peer data-[state=checked]:bg-d-primary data-[state=unchecked]:bg-d-input focus-visible:border-d-ring focus-visible:ring-d-ring/50 dark:data-[state=unchecked]:bg-d-foreground/20 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent transition-all duration-300 outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
r
),
...a,
children: /* @__PURE__ */ e(
n,
{
"data-slot": "switch-thumb",
className: t(
"bg-d-background dark:data-[state=unchecked]:bg-d-foreground dark:data-[state=checked]:bg-d-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0"
)
}
)
}
);
}
export {
c as Switch
};