{
  "name": "switch",
  "dependencies": [],
  "registryDependencies": [],
  "files": [
    {
      "name": "Switch.vue",
      "content": "<script setup lang=\"ts\">\nimport {\n  SwitchRoot,\n  type SwitchRootEmits,\n  type SwitchRootProps,\n  SwitchThumb,\n  useForwardPropsEmits,\n\n} from 'radix-vue';\n\nconst props = defineProps<SwitchRootProps>();\n\nconst emits = defineEmits<SwitchRootEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <SwitchRoot\n    v-bind=\"forwarded\"\n    class=\"sigma-ui-switch\"\n  >\n    <SwitchThumb class=\"sigma-ui-switch__thumb\" />\n  </SwitchRoot>\n</template>\n\n<style>\n.sigma-ui-switch {\n  display: inline-flex;\n  height: 1.5rem;\n  width: 2.75rem;\n  flex-shrink: 0;\n  cursor: pointer;\n  align-items: center;\n  border-radius: var(--radius-full);\n  border: 2px solid transparent;\n  transition-property: color, background-color, border-color;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n\n.sigma-ui-switch:focus-visible {\n  outline: none;\n  box-shadow: 0 0 0 2px hsl(var(--ring)), 0 0 0 4px hsl(var(--background));\n}\n\n.sigma-ui-switch:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.sigma-ui-switch[data-state=\"checked\"] {\n  background-color: hsl(var(--primary));\n}\n\n.sigma-ui-switch[data-state=\"unchecked\"] {\n  background-color: hsl(var(--input));\n}\n\n.sigma-ui-switch__thumb {\n  pointer-events: none;\n  display: block;\n  height: 1.25rem;\n  width: 1.25rem;\n  border-radius: var(--radius-full);\n  background-color: hsl(var(--background));\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1);\n  animation: none;\n}\n\n.sigma-ui-switch__thumb[data-state=\"checked\"] {\n  transform: translateX(1.25rem);\n  animation: thumbMotionBlurIn 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.sigma-ui-switch__thumb[data-state=\"unchecked\"] {\n  transform: translateX(0);\n  animation: thumbMotionBlurOut 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n@keyframes thumbMotionBlurIn {\n  0% {\n    filter: blur(0);\n  }\n  50% {\n    filter: blur(2px);\n  }\n  100% {\n    filter: blur(0);\n  }\n}\n\n@keyframes thumbMotionBlurOut {\n  0% {\n    filter: blur(0);\n  }\n  50% {\n    filter: blur(2px);\n  }\n  100% {\n    filter: blur(0);\n  }\n}\n</style>\n"
    },
    {
      "name": "index.ts",
      "content": "export { default as Switch } from './Switch.vue';\n"
    }
  ],
  "type": "components:ui"
}