@arolariu/components
Version:
A collection of reusable components for React applications, built as ESM & CJS modules with tree shake, minify and bundler optimizations enabled, for the lowest bundle size (import cost)!
1 lines • 2.82 kB
Source Map (JSON)
{"version":3,"file":"components\\ui\\toggle.cjs","sources":["webpack://@arolariu/components/./src/components/ui/toggle.tsx"],"sourcesContent":["\r\n\r\nimport * as React from \"react\";\r\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\r\nimport { cva, type VariantProps } from \"class-variance-authority\";\r\nimport { cn } from \"./../../lib/utils\";\r\n\r\nconst toggleVariants = cva(\r\n \"inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-neutral-100 hover:text-neutral-500 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-neutral-100 data-[state=on]:text-neutral-900 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-neutral-950 focus-visible:ring-neutral-950/50 focus-visible:ring-[3px] outline-hidden transition-[color,box-shadow] aria-invalid:ring-red-500/20 dark:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 whitespace-nowrap dark:hover:bg-neutral-800 dark:hover:text-neutral-400 dark:data-[state=on]:bg-neutral-800 dark:data-[state=on]:text-neutral-50 dark:focus-visible:border-neutral-300 dark:focus-visible:ring-neutral-300/50 dark:aria-invalid:ring-red-900/20 dark:dark:aria-invalid:ring-red-900/40 dark:aria-invalid:border-red-900\",\r\n {\r\n variants: {\r\n variant: {\r\n default: \"bg-transparent\",\r\n outline:\r\n \"border border-neutral-200 bg-transparent shadow-2xs hover:bg-neutral-100 hover:text-neutral-900 dark:border-neutral-800 dark:hover:bg-neutral-800 dark:hover:text-neutral-50\",\r\n },\r\n size: {\r\n default: \"h-9 px-2 min-w-9\",\r\n sm: \"h-8 px-1.5 min-w-8\",\r\n lg: \"h-10 px-2.5 min-w-10\",\r\n },\r\n },\r\n defaultVariants: {\r\n variant: \"default\",\r\n size: \"default\",\r\n },\r\n }\r\n);\r\n\r\nfunction Toggle({\r\n className,\r\n variant,\r\n size,\r\n ...props\r\n}: React.ComponentProps<typeof TogglePrimitive.Root> &\r\n VariantProps<typeof toggleVariants>) {\r\n return (\r\n <TogglePrimitive.Root\r\n data-slot=\"toggle\"\r\n className={cn(toggleVariants({ variant, size, className }))}\r\n {...props}\r\n />\r\n );\r\n}\r\n\r\nexport { Toggle, toggleVariants };\r\n"],"names":["toggleVariants","cva","Toggle","className","variant","size","props","TogglePrimitive","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,MAAMA,iBAAiBC,IAAAA,kDAAAA,GAAAA,EACrB,22BACA;IACE,UAAU;QACR,SAAS;YACP,SAAS;YACT,SACE;QACJ;QACA,MAAM;YACJ,SAAS;YACT,IAAI;YACJ,IAAI;QACN;IACF;IACA,iBAAiB;QACf,SAAS;QACT,MAAM;IACR;AACF;AAGF,SAASC,OAAO,EACdC,SAAS,EACTC,OAAO,EACPC,IAAI,EACJ,GAAGC,OAEgC;IACnC,OACE,WADF,GACE,qCAACC,6BAAAA,IAAoB;QACnB,aAAU;QACV,WAAWC,IAAAA,0BAAAA,EAAAA,EAAGR,eAAe;YAAEI;YAASC;YAAMF;QAAU;QACvD,GAAGG,KAAK;;AAGf"}