sigma-ui 1.1.1 → 1.2.0

package/__generated/registry-schemes/style-system/css/navigation-menu.json

@@ -9,11 +9,11 @@
     },
     {
       "name": "NavigationMenuContent.vue",
-      "content": "<script setup lang=\"ts\">\nimport {\n  NavigationMenuContent,\n  type NavigationMenuContentEmits,\n  type NavigationMenuContentProps,\n  useForwardPropsEmits,\n} from 'reka-ui';\n\nconst props = defineProps<NavigationMenuContentProps>();\nconst emits = defineEmits<NavigationMenuContentEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <NavigationMenuContent\n    v-bind=\"forwarded\"\n    class=\"sigma-ui-navigation-menu-content\"\n  >\n    <slot />\n  </NavigationMenuContent>\n</template>\n\n<style>\n.sigma-ui-navigation-menu-content {\n  top: 0;\n  left: 0;\n  width: 100%;\n}\n\n.sigma-ui-navigation-menu-content[data-state^=\"open\"] {\n  animation: fade-in 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-state^=\"closed\"] {\n  animation: fade-out 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"from-end\"] {\n  animation: slide-in-from-right 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"from-start\"] {\n  animation: slide-in-from-left 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"to-end\"] {\n  animation: slide-out-to-right 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"to-start\"] {\n  animation: slide-out-to-left 200ms ease-in-out;\n}\n\n@media (width >= 768px) {\n  .sigma-ui-navigation-menu-content {\n    position: absolute;\n    width: auto;\n  }\n}\n\n@keyframes fade-in {\n  from {\n    filter: blur(12px);\n    opacity: 0;\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n  }\n}\n\n@keyframes fade-out {\n  from {\n    opacity: 1;\n  }\n\n  to {\n    opacity: 0;\n  }\n}\n\n@keyframes slide-in-from-right {\n  from {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(13rem);\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes slide-in-from-left {\n  from {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(-13rem);\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes slide-out-to-right {\n  from {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n\n  to {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(13rem);\n  }\n}\n\n@keyframes slide-out-to-left {\n  from {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n\n  to {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(-13rem);\n  }\n}\n</style>\n"
+      "content": "<script setup lang=\"ts\">\nimport {\n  NavigationMenuContent,\n  type NavigationMenuContentEmits,\n  type NavigationMenuContentProps,\n  useForwardPropsEmits,\n} from 'reka-ui';\n\nconst props = defineProps<NavigationMenuContentProps>();\nconst emits = defineEmits<NavigationMenuContentEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <NavigationMenuContent\n    v-bind=\"forwarded\"\n    class=\"sigma-ui-navigation-menu-content\"\n  >\n    <slot />\n  </NavigationMenuContent>\n</template>\n\n<style>\n.sigma-ui-navigation-menu-content {\n  top: 0;\n  left: 0;\n  width: 100%;\n}\n\n.sigma-ui-navigation-menu-content[data-state^=\"open\"] {\n  animation: sigma-ui-nav-fade-in 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-state^=\"closed\"] {\n  animation: sigma-ui-nav-fade-out 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"from-end\"] {\n  animation: sigma-ui-nav-slide-in-from-right 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"from-start\"] {\n  animation: sigma-ui-nav-slide-in-from-left 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"to-end\"] {\n  animation: sigma-ui-nav-slide-out-to-right 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"to-start\"] {\n  animation: sigma-ui-nav-slide-out-to-left 200ms ease-in-out;\n}\n\n@media (width >= 768px) {\n  .sigma-ui-navigation-menu-content {\n    position: absolute;\n    width: auto;\n  }\n}\n\n@keyframes sigma-ui-nav-fade-in {\n  from {\n    filter: blur(12px);\n    opacity: 0;\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n  }\n}\n\n@keyframes sigma-ui-nav-fade-out {\n  from {\n    opacity: 1;\n  }\n\n  to {\n    opacity: 0;\n  }\n}\n\n@keyframes sigma-ui-nav-slide-in-from-right {\n  from {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(13rem);\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes sigma-ui-nav-slide-in-from-left {\n  from {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(-13rem);\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes sigma-ui-nav-slide-out-to-right {\n  from {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n\n  to {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(13rem);\n  }\n}\n\n@keyframes sigma-ui-nav-slide-out-to-left {\n  from {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n\n  to {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(-13rem);\n  }\n}\n</style>\n"
     },
     {
       "name": "NavigationMenuIndicator.vue",
-      "content": "<script setup lang=\"ts\">\nimport { NavigationMenuIndicator, type NavigationMenuIndicatorProps, useForwardProps } from 'reka-ui';\n\nconst props = defineProps<NavigationMenuIndicatorProps>();\n\nconst forwardedProps = useForwardProps(props);\n</script>\n\n<template>\n  <NavigationMenuIndicator\n    v-bind=\"forwardedProps\"\n    class=\"sigma-ui-navigation-menu-indicator\"\n  >\n    <div class=\"sigma-ui-navigation-menu-indicator__pointer\" />\n  </NavigationMenuIndicator>\n</template>\n\n<style>\n.sigma-ui-navigation-menu-indicator {\n  position: relative;\n  z-index: 1;\n  top: 100%;\n  display: flex;\n  overflow: hidden;\n  height: 0.375rem;\n  align-items: flex-end;\n  justify-content: center;\n}\n\n.sigma-ui-navigation-menu-indicator[data-state=\"visible\"] {\n  animation: navigation-menu-indicator-in 0.2s ease;\n}\n\n.sigma-ui-navigation-menu-indicator[data-state=\"hidden\"] {\n  animation: navigation-menu-indicator-out 0.2s ease;\n}\n\n.sigma-ui-navigation-menu-indicator__pointer {\n  position: relative;\n  top: 60%;\n  width: 0.5rem;\n  height: 0.5rem;\n  background-color: hsl(var(--border));\n  border-top-left-radius: 0.125rem;\n  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%);\n  transform: rotate(45deg);\n}\n\n@keyframes navigation-menu-indicator-in {\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes navigation-menu-indicator-out {\n  from {\n    opacity: 1;\n  }\n\n  to {\n    opacity: 0;\n  }\n}\n</style>\n"
+      "content": "<script setup lang=\"ts\">\nimport { NavigationMenuIndicator, type NavigationMenuIndicatorProps, useForwardProps } from 'reka-ui';\n\nconst props = defineProps<NavigationMenuIndicatorProps>();\n\nconst forwardedProps = useForwardProps(props);\n</script>\n\n<template>\n  <NavigationMenuIndicator\n    v-bind=\"forwardedProps\"\n    class=\"sigma-ui-navigation-menu-indicator\"\n  >\n    <div class=\"sigma-ui-navigation-menu-indicator__pointer\" />\n  </NavigationMenuIndicator>\n</template>\n\n<style>\n.sigma-ui-navigation-menu-indicator {\n  position: relative;\n  z-index: 1;\n  top: 100%;\n  display: flex;\n  overflow: hidden;\n  height: 0.375rem;\n  align-items: flex-end;\n  justify-content: center;\n}\n\n.sigma-ui-navigation-menu-indicator[data-state=\"visible\"] {\n  animation: sigma-ui-nav-indicator-in 0.2s ease;\n}\n\n.sigma-ui-navigation-menu-indicator[data-state=\"hidden\"] {\n  animation: sigma-ui-nav-indicator-out 0.2s ease;\n}\n\n.sigma-ui-navigation-menu-indicator__pointer {\n  position: relative;\n  top: 60%;\n  width: 0.5rem;\n  height: 0.5rem;\n  background-color: hsl(var(--border));\n  border-top-left-radius: 0.125rem;\n  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%);\n  transform: rotate(45deg);\n}\n\n@keyframes sigma-ui-nav-indicator-in {\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes sigma-ui-nav-indicator-out {\n  from {\n    opacity: 1;\n  }\n\n  to {\n    opacity: 0;\n  }\n}\n</style>\n"
     },
     {
       "name": "NavigationMenuItem.vue",
@@ -33,7 +33,7 @@
     },
     {
       "name": "NavigationMenuViewport.vue",
-      "content": "<script setup lang=\"ts\">\nimport {\n  NavigationMenuViewport,\n  type NavigationMenuViewportProps,\n  useForwardProps,\n} from 'reka-ui';\n\nconst props = defineProps<NavigationMenuViewportProps>();\n\nconst forwardedProps = useForwardProps(props);\n</script>\n\n<template>\n  <div class=\"sigma-ui-navigation-menu-viewport-wrapper\">\n    <NavigationMenuViewport\n      v-bind=\"forwardedProps\"\n      class=\"sigma-ui-navigation-menu-viewport\"\n      :class=\"$attrs.class\"\n    />\n  </div>\n</template>\n\n<style>\n.sigma-ui-navigation-menu-viewport-wrapper {\n  position: absolute;\n  top: 100%;\n  left: 0;\n  display: flex;\n  justify-content: center;\n}\n\n.sigma-ui-navigation-menu-viewport {\n  position: relative;\n  overflow: hidden;\n  width: 100%;\n  height: var(--reka-navigation-menu-viewport-height);\n  border: 1px solid hsl(var(--border));\n  border-radius: var(--radius);\n  margin-top: 0.375rem;\n  backdrop-filter: blur(var(--backdrop-filter-blur));\n  background-color: hsl(var(--popover));\n  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 10%), 0 4px 6px -4px rgb(0 0 0 / 10%);\n  color: hsl(var(--popover-foreground));\n  transform-origin: top center;\n}\n\n@media (width >= 768px) {\n  .sigma-ui-navigation-menu-viewport {\n    width: var(--reka-navigation-menu-viewport-width);\n  }\n}\n\n.sigma-ui-navigation-menu-viewport[data-state=\"open\"] {\n  animation: navigation-menu-viewport-in 0.2s ease;\n}\n\n.sigma-ui-navigation-menu-viewport[data-state=\"closed\"] {\n  animation: navigation-menu-viewport-out 0.2s ease;\n}\n\n@keyframes navigation-menu-viewport-in {\n  from {\n    opacity: 0;\n    transform: scale(0.9);\n  }\n\n  to {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n\n@keyframes navigation-menu-viewport-out {\n  from {\n    opacity: 1;\n    transform: scale(1);\n  }\n\n  to {\n    opacity: 0;\n    transform: scale(0.95);\n  }\n}\n</style>\n"
+      "content": "<script setup lang=\"ts\">\nimport {\n  NavigationMenuViewport,\n  type NavigationMenuViewportProps,\n  useForwardProps,\n} from 'reka-ui';\n\nconst props = defineProps<NavigationMenuViewportProps>();\n\nconst forwardedProps = useForwardProps(props);\n</script>\n\n<template>\n  <div class=\"sigma-ui-navigation-menu-viewport-wrapper\">\n    <NavigationMenuViewport\n      v-bind=\"forwardedProps\"\n      class=\"sigma-ui-navigation-menu-viewport\"\n      :class=\"$attrs.class\"\n    />\n  </div>\n</template>\n\n<style>\n.sigma-ui-navigation-menu-viewport-wrapper {\n  position: absolute;\n  top: 100%;\n  left: 0;\n  display: flex;\n  justify-content: center;\n}\n\n.sigma-ui-navigation-menu-viewport {\n  position: relative;\n  overflow: hidden;\n  width: 100%;\n  height: var(--reka-navigation-menu-viewport-height);\n  border: 1px solid hsl(var(--border));\n  border-radius: var(--radius);\n  margin-top: 0.375rem;\n  backdrop-filter: blur(var(--backdrop-filter-blur));\n  background-color: hsl(var(--popover));\n  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 10%), 0 4px 6px -4px rgb(0 0 0 / 10%);\n  color: hsl(var(--popover-foreground));\n  transform-origin: top center;\n}\n\n@media (width >= 768px) {\n  .sigma-ui-navigation-menu-viewport {\n    width: var(--reka-navigation-menu-viewport-width);\n  }\n}\n\n.sigma-ui-navigation-menu-viewport[data-state=\"open\"] {\n  animation: sigma-ui-nav-viewport-in 0.2s ease;\n}\n\n.sigma-ui-navigation-menu-viewport[data-state=\"closed\"] {\n  animation: sigma-ui-nav-viewport-out 0.2s ease;\n}\n\n@keyframes sigma-ui-nav-viewport-in {\n  from {\n    opacity: 0;\n    transform: scale(0.9);\n  }\n\n  to {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n\n@keyframes sigma-ui-nav-viewport-out {\n  from {\n    opacity: 1;\n    transform: scale(1);\n  }\n\n  to {\n    opacity: 0;\n    transform: scale(0.95);\n  }\n}\n</style>\n"
     },
     {
       "name": "index.ts",

package/__generated/registry-schemes/style-system/css/popover.json

@@ -9,7 +9,7 @@
     },
     {
       "name": "PopoverContent.vue",
-      "content": "<script setup lang=\"ts\">\nimport {\n  PopoverContent,\n  type PopoverContentEmits,\n  type PopoverContentProps,\n  PopoverPortal,\n  useForwardPropsEmits,\n} from 'reka-ui';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(\n  defineProps<PopoverContentProps>(),\n  {\n    align: 'center',\n    sideOffset: 4,\n  },\n);\nconst emits = defineEmits<PopoverContentEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <PopoverPortal>\n    <PopoverContent\n      v-bind=\"{ ...forwarded, ...$attrs }\"\n      class=\"sigma-ui-popover-content\"\n      :class=\"$attrs.class\"\n    >\n      <slot />\n    </PopoverContent>\n  </PopoverPortal>\n</template>\n\n<style>\n.sigma-ui-popover-content {\n  z-index: 50;\n  width: 18rem;\n  padding: 1rem;\n  border: 1px solid hsl(var(--border));\n  border-radius: var(--radius);\n  backdrop-filter: blur(var(--backdrop-filter-blur));\n  background-color: hsl(var(--popover));\n  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -2px rgb(0 0 0 / 10%);\n  color: hsl(var(--popover-foreground));\n  outline: none;\n  transform-origin: var(--reka-popover-content-transform-origin);\n}\n\n.sigma-ui-popover-content[data-state=\"open\"][data-side=\"bottom\"] {\n  animation: slide-from-top 150ms ease-out;\n}\n\n.sigma-ui-popover-content[data-state=\"open\"][data-side=\"top\"] {\n  animation: slide-from-bottom 150ms ease-out;\n}\n\n.sigma-ui-popover-content[data-state=\"open\"][data-side=\"left\"] {\n  animation: slide-from-right 150ms ease-out;\n}\n\n.sigma-ui-popover-content[data-state=\"open\"][data-side=\"right\"] {\n  animation: slide-from-left 150ms ease-out;\n}\n\n.sigma-ui-popover-content[data-state=\"closed\"] {\n  animation: popover-out 150ms ease-in;\n}\n\n@keyframes popover-out {\n  from {\n    filter: blur(0);\n    opacity: 1;\n    transform: scaleY(1);\n  }\n\n  to {\n    filter: blur(4px);\n    opacity: 0;\n    transform: scaleY(0.98);\n  }\n}\n\n@keyframes slide-from-top {\n  from {\n    filter: blur(4px);\n    transform: translateY(-1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateY(0) scaleY(1);\n  }\n}\n\n@keyframes slide-from-bottom {\n  from {\n    filter: blur(4px);\n    transform: translateY(1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateY(0) scaleY(1);\n  }\n}\n\n@keyframes slide-from-left {\n  from {\n    filter: blur(4px);\n    transform: translateX(-1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateX(0) scaleY(1);\n  }\n}\n\n@keyframes slide-from-right {\n  from {\n    filter: blur(4px);\n    transform: translateX(1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateX(0) scaleY(1);\n  }\n}\n</style>\n"
+      "content": "<script setup lang=\"ts\">\nimport {\n  PopoverContent,\n  type PopoverContentEmits,\n  type PopoverContentProps,\n  PopoverPortal,\n  useForwardPropsEmits,\n} from 'reka-ui';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(\n  defineProps<PopoverContentProps>(),\n  {\n    align: 'center',\n    sideOffset: 4,\n  },\n);\nconst emits = defineEmits<PopoverContentEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <PopoverPortal>\n    <PopoverContent\n      v-bind=\"{ ...forwarded, ...$attrs }\"\n      class=\"sigma-ui-popover-content\"\n      :class=\"$attrs.class\"\n    >\n      <slot />\n    </PopoverContent>\n  </PopoverPortal>\n</template>\n\n<style>\n.sigma-ui-popover-content {\n  z-index: 50;\n  width: 18rem;\n  padding: 1rem;\n  border: 1px solid hsl(var(--border));\n  border-radius: var(--radius);\n  backdrop-filter: blur(var(--backdrop-filter-blur));\n  background-color: hsl(var(--popover));\n  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -2px rgb(0 0 0 / 10%);\n  color: hsl(var(--popover-foreground));\n  outline: none;\n  transform-origin: var(--reka-popover-content-transform-origin);\n}\n\n.sigma-ui-popover-content[data-state=\"open\"][data-side=\"bottom\"] {\n  animation: sigma-ui-popover-slide-from-top 150ms ease-out;\n}\n\n.sigma-ui-popover-content[data-state=\"open\"][data-side=\"top\"] {\n  animation: sigma-ui-popover-slide-from-bottom 150ms ease-out;\n}\n\n.sigma-ui-popover-content[data-state=\"open\"][data-side=\"left\"] {\n  animation: sigma-ui-popover-slide-from-right 150ms ease-out;\n}\n\n.sigma-ui-popover-content[data-state=\"open\"][data-side=\"right\"] {\n  animation: sigma-ui-popover-slide-from-left 150ms ease-out;\n}\n\n.sigma-ui-popover-content[data-state=\"closed\"] {\n  animation: sigma-ui-popover-out 150ms ease-in;\n}\n\n@keyframes sigma-ui-popover-out {\n  from {\n    filter: blur(0);\n    opacity: 1;\n    transform: scaleY(1);\n  }\n\n  to {\n    filter: blur(4px);\n    opacity: 0;\n    transform: scaleY(0.98);\n  }\n}\n\n@keyframes sigma-ui-popover-slide-from-top {\n  from {\n    filter: blur(4px);\n    transform: translateY(-1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateY(0) scaleY(1);\n  }\n}\n\n@keyframes sigma-ui-popover-slide-from-bottom {\n  from {\n    filter: blur(4px);\n    transform: translateY(1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateY(0) scaleY(1);\n  }\n}\n\n@keyframes sigma-ui-popover-slide-from-left {\n  from {\n    filter: blur(4px);\n    transform: translateX(-1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateX(0) scaleY(1);\n  }\n}\n\n@keyframes sigma-ui-popover-slide-from-right {\n  from {\n    filter: blur(4px);\n    transform: translateX(1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateX(0) scaleY(1);\n  }\n}\n</style>\n"
     },
     {
       "name": "PopoverTrigger.vue",

package/__generated/registry-schemes/style-system/css/radio-group.json

@@ -9,7 +9,7 @@
     },
     {
       "name": "RadioGroupItem.vue",
-      "content": "<script setup lang=\"ts\">\nimport {\n  RadioGroupIndicator,\n  RadioGroupItem,\n  type RadioGroupItemProps,\n  useForwardProps,\n} from 'reka-ui';\nimport { CircleIcon } from 'lucide-vue-next';\n\nconst props = defineProps<RadioGroupItemProps>();\n\nconst forwardedProps = useForwardProps(props);\n</script>\n\n<template>\n  <RadioGroupItem\n    v-bind=\"forwardedProps\"\n    class=\"sigma-ui-radio-group-item\"\n  >\n    <RadioGroupIndicator\n      class=\"sigma-ui-radio-group-item__indicator\"\n    >\n      <CircleIcon class=\"sigma-ui-radio-group-item__icon\" />\n    </RadioGroupIndicator>\n  </RadioGroupItem>\n</template>\n\n<style>\n.sigma-ui-radio-group-item {\n  width: 1rem;\n  height: 1rem;\n  border: 1px solid hsl(var(--primary));\n  border-radius: var(--radius-full);\n  aspect-ratio: 1;\n  background-color: transparent;\n  color: hsl(var(--primary));\n  transition: all 150ms ease-out;\n}\n\n.sigma-ui-radio-group-item:focus {\n  outline: none;\n}\n\n.sigma-ui-radio-group-item:focus-visible {\n  box-shadow: 0 0 0 2px hsl(var(--background)),\n              0 0 0 4px hsl(var(--ring));\n}\n\n.sigma-ui-radio-group-item:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.sigma-ui-radio-group-item__indicator {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.sigma-ui-radio-group-item__icon {\n  width: 0.625rem;\n  height: 0.625rem;\n  color: currentcolor;\n  fill: currentcolor;\n}\n\n.sigma-ui-radio-group-item[data-state=\"checked\"] .sigma-ui-radio-group-item__icon {\n  animation: radio-check 150ms ease-out;\n}\n\n.sigma-ui-radio-group-item[data-state=\"unchecked\"] .sigma-ui-radio-group-item__icon {\n  animation: radio-uncheck 150ms ease-in;\n}\n\n@keyframes radio-check {\n  from {\n    filter: blur(4px);\n    opacity: 0;\n    transform: scale(0.8);\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n\n@keyframes radio-uncheck {\n  from {\n    filter: blur(0);\n    opacity: 1;\n    transform: scale(1);\n  }\n\n  to {\n    filter: blur(4px);\n    opacity: 0;\n    transform: scale(0.8);\n  }\n}\n</style>\n"
+      "content": "<script setup lang=\"ts\">\nimport {\n  RadioGroupIndicator,\n  RadioGroupItem,\n  type RadioGroupItemProps,\n  useForwardProps,\n} from 'reka-ui';\nimport { CircleIcon } from 'lucide-vue-next';\n\nconst props = defineProps<RadioGroupItemProps>();\n\nconst forwardedProps = useForwardProps(props);\n</script>\n\n<template>\n  <RadioGroupItem\n    v-bind=\"forwardedProps\"\n    class=\"sigma-ui-radio-group-item\"\n  >\n    <RadioGroupIndicator\n      class=\"sigma-ui-radio-group-item__indicator\"\n    >\n      <CircleIcon class=\"sigma-ui-radio-group-item__icon\" />\n    </RadioGroupIndicator>\n  </RadioGroupItem>\n</template>\n\n<style>\n.sigma-ui-radio-group-item {\n  width: 1rem;\n  height: 1rem;\n  border: 1px solid hsl(var(--primary));\n  border-radius: var(--radius-full);\n  aspect-ratio: 1;\n  background-color: transparent;\n  color: hsl(var(--primary));\n  transition: all 150ms ease-out;\n}\n\n.sigma-ui-radio-group-item:focus {\n  outline: none;\n}\n\n.sigma-ui-radio-group-item:focus-visible {\n  box-shadow: 0 0 0 2px hsl(var(--background)),\n              0 0 0 4px hsl(var(--ring));\n}\n\n.sigma-ui-radio-group-item:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.sigma-ui-radio-group-item__indicator {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.sigma-ui-radio-group-item__icon {\n  width: 0.625rem;\n  height: 0.625rem;\n  color: currentcolor;\n  fill: currentcolor;\n}\n\n.sigma-ui-radio-group-item[data-state=\"checked\"] .sigma-ui-radio-group-item__icon {\n  animation: sigma-ui-radio-check 150ms ease-out;\n}\n\n.sigma-ui-radio-group-item[data-state=\"unchecked\"] .sigma-ui-radio-group-item__icon {\n  animation: sigma-ui-radio-uncheck 150ms ease-in;\n}\n\n@keyframes sigma-ui-radio-check {\n  from {\n    filter: blur(4px);\n    opacity: 0;\n    transform: scale(0.8);\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n\n@keyframes sigma-ui-radio-uncheck {\n  from {\n    filter: blur(0);\n    opacity: 1;\n    transform: scale(1);\n  }\n\n  to {\n    filter: blur(4px);\n    opacity: 0;\n    transform: scale(0.8);\n  }\n}\n</style>\n"
     },
     {
       "name": "index.ts",

package/__generated/registry-schemes/style-system/css/select.json

@@ -9,7 +9,7 @@
     },
     {
       "name": "SelectContent.vue",
-      "content": "<script setup lang=\"ts\">\nimport {\n  SelectContent,\n  type SelectContentEmits,\n  type SelectContentProps,\n  SelectPortal,\n  SelectViewport,\n\n  useForwardPropsEmits,\n} from 'reka-ui';\nimport { SelectScrollDownButton, SelectScrollUpButton } from '.';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(\n  defineProps<SelectContentProps>(),\n  {\n    position: 'popper',\n  },\n);\nconst emits = defineEmits<SelectContentEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <SelectPortal>\n    <SelectContent\n      v-bind=\"{ ...forwarded, ...$attrs }\"\n      class=\"sigma-ui-select-content\"\n      :class=\"[$attrs.class]\"\n    >\n      <SelectScrollUpButton />\n      <SelectViewport\n        class=\"sigma-ui-select-content__viewport\"\n        :class=\"{ 'sigma-ui-select-content__viewport--popper': position === 'popper' }\"\n      >\n        <slot />\n      </SelectViewport>\n      <SelectScrollDownButton />\n    </SelectContent>\n  </SelectPortal>\n</template>\n\n<style>\n.sigma-ui-select-content {\n  position: relative;\n  z-index: 50;\n  overflow: hidden;\n  min-width: 8rem;\n  max-height: 24rem;\n  border: 1px solid hsl(var(--border));\n  border-radius: var(--radius-md);\n  backdrop-filter: blur(var(--backdrop-filter-blur));\n  background-color: hsl(var(--popover));\n  box-shadow: 0 2px 10px rgb(0 0 0 / 10%);\n  color: hsl(var(--popover-foreground));\n  transform-origin: var(--reka-popover-content-transform-origin);\n}\n\n.sigma-ui-select-content[data-state=\"open\"][data-side=\"bottom\"] {\n  animation: slide-from-top 150ms ease-out;\n}\n\n.sigma-ui-select-content[data-state=\"open\"][data-side=\"top\"] {\n  animation: slide-from-bottom 150ms ease-out;\n}\n\n.sigma-ui-select-content[data-state=\"open\"][data-side=\"left\"] {\n  animation: slide-from-right 150ms ease-out;\n}\n\n.sigma-ui-select-content[data-state=\"open\"][data-side=\"right\"] {\n  animation: slide-from-left 150ms ease-out;\n}\n\n@keyframes slide-from-top {\n  from {\n    filter: blur(4px);\n    transform: translateY(-1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateY(0) scaleY(1);\n  }\n}\n\n@keyframes slide-from-bottom {\n  from {\n    filter: blur(4px);\n    transform: translateY(1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateY(0) scaleY(1);\n  }\n}\n\n@keyframes slide-from-left {\n  from {\n    filter: blur(4px);\n    transform: translateX(-1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateX(0) scaleY(1);\n  }\n}\n\n@keyframes slide-from-right {\n  from {\n    filter: blur(4px);\n    transform: translateX(1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateX(0) scaleY(1);\n  }\n}\n\n.sigma-ui-select-content__viewport {\n  padding: 0.25rem;\n}\n\n.sigma-ui-select-content__viewport--popper {\n  width: 100%;\n  min-width: var(--reka-select-trigger-width);\n  height: var(--reka-select-trigger-height);\n}\n</style>\n"
+      "content": "<script setup lang=\"ts\">\nimport {\n  SelectContent,\n  type SelectContentEmits,\n  type SelectContentProps,\n  SelectPortal,\n  SelectViewport,\n\n  useForwardPropsEmits,\n} from 'reka-ui';\nimport { SelectScrollDownButton, SelectScrollUpButton } from '.';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(\n  defineProps<SelectContentProps>(),\n  {\n    position: 'popper',\n  },\n);\nconst emits = defineEmits<SelectContentEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <SelectPortal>\n    <SelectContent\n      v-bind=\"{ ...forwarded, ...$attrs }\"\n      class=\"sigma-ui-select-content\"\n      :class=\"[$attrs.class]\"\n    >\n      <SelectScrollUpButton />\n      <SelectViewport\n        class=\"sigma-ui-select-content__viewport\"\n        :class=\"{ 'sigma-ui-select-content__viewport--popper': position === 'popper' }\"\n      >\n        <slot />\n      </SelectViewport>\n      <SelectScrollDownButton />\n    </SelectContent>\n  </SelectPortal>\n</template>\n\n<style>\n.sigma-ui-select-content {\n  position: relative;\n  z-index: 50;\n  overflow: hidden;\n  min-width: 8rem;\n  max-height: 24rem;\n  border: 1px solid hsl(var(--border));\n  border-radius: var(--radius-md);\n  backdrop-filter: blur(var(--backdrop-filter-blur));\n  background-color: hsl(var(--popover));\n  box-shadow: 0 2px 10px rgb(0 0 0 / 10%);\n  color: hsl(var(--popover-foreground));\n  transform-origin: var(--reka-popover-content-transform-origin);\n}\n\n.sigma-ui-select-content[data-state=\"open\"][data-side=\"bottom\"] {\n  animation: sigma-ui-select-slide-from-top 150ms ease-out;\n}\n\n.sigma-ui-select-content[data-state=\"open\"][data-side=\"top\"] {\n  animation: sigma-ui-select-slide-from-bottom 150ms ease-out;\n}\n\n.sigma-ui-select-content[data-state=\"open\"][data-side=\"left\"] {\n  animation: sigma-ui-select-slide-from-right 150ms ease-out;\n}\n\n.sigma-ui-select-content[data-state=\"open\"][data-side=\"right\"] {\n  animation: sigma-ui-select-slide-from-left 150ms ease-out;\n}\n\n@keyframes sigma-ui-select-slide-from-top {\n  from {\n    filter: blur(4px);\n    transform: translateY(-1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateY(0) scaleY(1);\n  }\n}\n\n@keyframes sigma-ui-select-slide-from-bottom {\n  from {\n    filter: blur(4px);\n    transform: translateY(1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateY(0) scaleY(1);\n  }\n}\n\n@keyframes sigma-ui-select-slide-from-left {\n  from {\n    filter: blur(4px);\n    transform: translateX(-1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateX(0) scaleY(1);\n  }\n}\n\n@keyframes sigma-ui-select-slide-from-right {\n  from {\n    filter: blur(4px);\n    transform: translateX(1rem) scaleY(0.98);\n  }\n\n  to {\n    filter: blur(0);\n    transform: translateX(0) scaleY(1);\n  }\n}\n\n.sigma-ui-select-content__viewport {\n  padding: 0.25rem;\n}\n\n.sigma-ui-select-content__viewport--popper {\n  width: 100%;\n  min-width: var(--reka-select-trigger-width);\n  height: var(--reka-select-trigger-height);\n}\n</style>\n"
     },
     {
       "name": "SelectGroup.vue",

package/__generated/registry-schemes/style-system/css/sheet.json

@@ -13,7 +13,7 @@
     },
     {
       "name": "SheetContent.vue",
-      "content": "<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport {\n  DialogClose,\n  DialogContent,\n  type DialogContentEmits,\n  type DialogContentProps,\n  DialogOverlay,\n  DialogPortal,\n  useForwardPropsEmits,\n} from 'reka-ui';\nimport { XIcon } from 'lucide-vue-next';\nimport { type SheetVariants, sheetVariants } from '.';\n\ninterface SheetContentProps extends DialogContentProps {\n  side?: SheetVariants['side'];\n}\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst props = defineProps<SheetContentProps>();\nconst emits = defineEmits<DialogContentEmits>();\n\nconst delegatedProps = computed(() => ({ ...props, side: undefined }));\nconst forwarded = useForwardPropsEmits(delegatedProps, emits);\n</script>\n\n<template>\n  <DialogPortal>\n    <DialogOverlay class=\"sigma-ui-sheet-overlay\" />\n    <DialogContent\n      :class=\"[sheetVariants({ side }), $attrs.class]\"\n      v-bind=\"{ ...forwarded, ...$attrs }\"\n    >\n      <slot />\n\n      <DialogClose class=\"sigma-ui-sheet-close\">\n        <XIcon class=\"sigma-ui-sheet-close__icon\" />\n      </DialogClose>\n    </DialogContent>\n  </DialogPortal>\n</template>\n\n<style>\n.sigma-ui-sheet-overlay {\n  position: fixed;\n  z-index: 50;\n  background-color: rgb(0 0 0 / 80%);\n  inset: 0;\n}\n\n.sigma-ui-sheet-overlay[data-state=\"open\"] {\n  animation: overlay-show 150ms ease-out;\n}\n\n.sigma-ui-sheet-overlay[data-state=\"closed\"] {\n  animation: overlay-hide 150ms ease-in forwards;\n}\n\n.sigma-ui-sheet-content__base {\n  position: fixed;\n  z-index: 50;\n  padding: 1.5rem;\n  background-color: hsl(var(--background));\n  box-shadow: 0 2px 10px rgb(0 0 0 / 10%);\n  transition: all 0.3s ease-in-out;\n}\n\n.sigma-ui-sheet-content__base[data-state=\"open\"] {\n  animation-duration: 500ms;\n  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.sigma-ui-sheet-content__base[data-state=\"closed\"] {\n  animation-duration: 300ms;\n  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.sigma-ui-sheet-content--top {\n  top: 0;\n  border-bottom: 1px solid hsl(var(--border));\n  inset-inline: 0;\n}\n\n.sigma-ui-sheet-content--top[data-state=\"closed\"] {\n  animation-name: slide-out-to-top;\n}\n\n.sigma-ui-sheet-content--top[data-state=\"open\"] {\n  animation-name: slide-in-from-top;\n}\n\n.sigma-ui-sheet-content--bottom {\n  bottom: 0;\n  border-top: 1px solid hsl(var(--border));\n  inset-inline: 0;\n}\n\n.sigma-ui-sheet-content--bottom[data-state=\"closed\"] {\n  animation-name: slide-out-to-bottom;\n}\n\n.sigma-ui-sheet-content--bottom[data-state=\"open\"] {\n  animation-name: slide-in-from-bottom;\n}\n\n.sigma-ui-sheet-content--left {\n  left: 0;\n  width: 75%;\n  height: 100%;\n  border-right: 1px solid hsl(var(--border));\n  inset-block: 0;\n}\n\n.sigma-ui-sheet-content--left[data-state=\"closed\"] {\n  animation-name: slide-out-to-left;\n}\n\n.sigma-ui-sheet-content--left[data-state=\"open\"] {\n  animation-name: slide-in-from-left;\n}\n\n@media (width >= 640px) {\n  .sigma-ui-sheet-content--left {\n    max-width: 24rem;\n  }\n}\n\n.sigma-ui-sheet-content--right {\n  right: 0;\n  width: 75%;\n  height: 100%;\n  border-left: 1px solid hsl(var(--border));\n  inset-block: 0;\n}\n\n.sigma-ui-sheet-content--right[data-state=\"closed\"] {\n  animation-name: slide-out-to-right;\n}\n\n.sigma-ui-sheet-content--right[data-state=\"open\"] {\n  animation-name: slide-in-from-right;\n}\n\n@media (width >= 640px) {\n  .sigma-ui-sheet-content--right {\n    max-width: 24rem;\n  }\n}\n\n.sigma-ui-sheet-close {\n  position: absolute;\n  top: 1rem;\n  right: 1rem;\n  border-radius: var(--radius-sm);\n  opacity: 0.7;\n  transition: opacity 0.2s;\n}\n\n.sigma-ui-sheet-close:hover {\n  opacity: 1;\n}\n\n.sigma-ui-sheet-close:focus {\n  box-shadow: 0 0 0 2px hsl(var(--ring)), 0 0 0 4px hsl(var(--background));\n  outline: none;\n}\n\n.sigma-ui-sheet-close:disabled {\n  pointer-events: none;\n}\n\n.sigma-ui-sheet-close[data-state=\"open\"] {\n  background-color: hsl(var(--secondary));\n}\n\n.sigma-ui-sheet-close__icon {\n  width: 1rem;\n  height: 1rem;\n  color: hsl(var(--muted-foreground));\n}\n\n@keyframes overlay-show {\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes overlay-hide {\n  from {\n    opacity: 1;\n  }\n\n  to {\n    opacity: 0;\n  }\n}\n\n@keyframes slide-in-from-top {\n  from {\n    transform: translateY(-100%);\n  }\n\n  to {\n    transform: translateY(0);\n  }\n}\n\n@keyframes slide-out-to-top {\n  from {\n    transform: translateY(0);\n  }\n\n  to {\n    transform: translateY(-100%);\n  }\n}\n\n@keyframes slide-in-from-bottom {\n  from {\n    transform: translateY(100%);\n  }\n\n  to {\n    transform: translateY(0);\n  }\n}\n\n@keyframes slide-out-to-bottom {\n  from {\n    transform: translateY(0);\n  }\n\n  to {\n    transform: translateY(100%);\n  }\n}\n\n@keyframes slide-in-from-left {\n  from {\n    transform: translateX(-100%);\n  }\n\n  to {\n    transform: translateX(0);\n  }\n}\n\n@keyframes slide-out-to-left {\n  from {\n    transform: translateX(0);\n  }\n\n  to {\n    transform: translateX(-100%);\n  }\n}\n\n@keyframes slide-in-from-right {\n  from {\n    transform: translateX(100%);\n  }\n\n  to {\n    transform: translateX(0);\n  }\n}\n\n@keyframes slide-out-to-right {\n  from {\n    transform: translateX(0);\n  }\n\n  to {\n    transform: translateX(100%);\n  }\n}\n</style>\n"
+      "content": "<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport {\n  DialogClose,\n  DialogContent,\n  type DialogContentEmits,\n  type DialogContentProps,\n  DialogOverlay,\n  DialogPortal,\n  useForwardPropsEmits,\n} from 'reka-ui';\nimport { XIcon } from 'lucide-vue-next';\nimport { type SheetVariants, sheetVariants } from '.';\n\ninterface SheetContentProps extends DialogContentProps {\n  side?: SheetVariants['side'];\n}\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst props = defineProps<SheetContentProps>();\nconst emits = defineEmits<DialogContentEmits>();\n\nconst delegatedProps = computed(() => ({ ...props, side: undefined }));\nconst forwarded = useForwardPropsEmits(delegatedProps, emits);\n</script>\n\n<template>\n  <DialogPortal>\n    <DialogOverlay class=\"sigma-ui-sheet-overlay\" />\n    <DialogContent\n      :class=\"[sheetVariants({ side }), $attrs.class]\"\n      v-bind=\"{ ...forwarded, ...$attrs }\"\n    >\n      <slot />\n\n      <DialogClose class=\"sigma-ui-sheet-close\">\n        <XIcon class=\"sigma-ui-sheet-close__icon\" />\n      </DialogClose>\n    </DialogContent>\n  </DialogPortal>\n</template>\n\n<style>\n.sigma-ui-sheet-overlay {\n  position: fixed;\n  z-index: 50;\n  background-color: rgb(0 0 0 / 80%);\n  inset: 0;\n}\n\n.sigma-ui-sheet-overlay[data-state=\"open\"] {\n  animation: sigma-ui-fade-in 150ms ease-out;\n}\n\n.sigma-ui-sheet-overlay[data-state=\"closed\"] {\n  animation: sigma-ui-fade-out 150ms ease-in forwards;\n}\n\n.sigma-ui-sheet-content__base {\n  position: fixed;\n  z-index: 50;\n  padding: 1.5rem;\n  background-color: hsl(var(--background));\n  box-shadow: 0 2px 10px rgb(0 0 0 / 10%);\n  transition: all 0.3s ease-in-out;\n}\n\n.sigma-ui-sheet-content__base[data-state=\"open\"] {\n  animation-duration: 500ms;\n  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.sigma-ui-sheet-content__base[data-state=\"closed\"] {\n  animation-duration: 300ms;\n  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.sigma-ui-sheet-content--top {\n  top: 0;\n  border-bottom: 1px solid hsl(var(--border));\n  inset-inline: 0;\n}\n\n.sigma-ui-sheet-content--top[data-state=\"closed\"] {\n  animation-name: sigma-ui-slide-out-to-top;\n}\n\n.sigma-ui-sheet-content--top[data-state=\"open\"] {\n  animation-name: sigma-ui-slide-in-from-top;\n}\n\n.sigma-ui-sheet-content--bottom {\n  bottom: 0;\n  border-top: 1px solid hsl(var(--border));\n  inset-inline: 0;\n}\n\n.sigma-ui-sheet-content--bottom[data-state=\"closed\"] {\n  animation-name: sigma-ui-slide-out-to-bottom;\n}\n\n.sigma-ui-sheet-content--bottom[data-state=\"open\"] {\n  animation-name: sigma-ui-slide-in-from-bottom;\n}\n\n.sigma-ui-sheet-content--left {\n  left: 0;\n  width: 75%;\n  height: 100%;\n  border-right: 1px solid hsl(var(--border));\n  inset-block: 0;\n}\n\n.sigma-ui-sheet-content--left[data-state=\"closed\"] {\n  animation-name: sigma-ui-slide-out-to-left;\n}\n\n.sigma-ui-sheet-content--left[data-state=\"open\"] {\n  animation-name: sigma-ui-slide-in-from-left;\n}\n\n@media (width >= 640px) {\n  .sigma-ui-sheet-content--left {\n    max-width: 24rem;\n  }\n}\n\n.sigma-ui-sheet-content--right {\n  right: 0;\n  width: 75%;\n  height: 100%;\n  border-left: 1px solid hsl(var(--border));\n  inset-block: 0;\n}\n\n.sigma-ui-sheet-content--right[data-state=\"closed\"] {\n  animation-name: sigma-ui-slide-out-to-right;\n}\n\n.sigma-ui-sheet-content--right[data-state=\"open\"] {\n  animation-name: sigma-ui-slide-in-from-right;\n}\n\n@media (width >= 640px) {\n  .sigma-ui-sheet-content--right {\n    max-width: 24rem;\n  }\n}\n\n.sigma-ui-sheet-close {\n  position: absolute;\n  top: 1rem;\n  right: 1rem;\n  border-radius: var(--radius-sm);\n  opacity: 0.7;\n  transition: opacity 0.2s;\n}\n\n.sigma-ui-sheet-close:hover {\n  opacity: 1;\n}\n\n.sigma-ui-sheet-close:focus {\n  box-shadow: 0 0 0 2px hsl(var(--ring)), 0 0 0 4px hsl(var(--background));\n  outline: none;\n}\n\n.sigma-ui-sheet-close:disabled {\n  pointer-events: none;\n}\n\n.sigma-ui-sheet-close[data-state=\"open\"] {\n  background-color: hsl(var(--secondary));\n}\n\n.sigma-ui-sheet-close__icon {\n  width: 1rem;\n  height: 1rem;\n  color: hsl(var(--muted-foreground));\n}\n\n@keyframes sigma-ui-slide-in-from-top {\n  from {\n    transform: translateY(-100%);\n  }\n\n  to {\n    transform: translateY(0);\n  }\n}\n\n@keyframes sigma-ui-slide-out-to-top {\n  from {\n    transform: translateY(0);\n  }\n\n  to {\n    transform: translateY(-100%);\n  }\n}\n\n@keyframes sigma-ui-slide-in-from-bottom {\n  from {\n    transform: translateY(100%);\n  }\n\n  to {\n    transform: translateY(0);\n  }\n}\n\n@keyframes sigma-ui-slide-out-to-bottom {\n  from {\n    transform: translateY(0);\n  }\n\n  to {\n    transform: translateY(100%);\n  }\n}\n\n@keyframes sigma-ui-slide-in-from-left {\n  from {\n    transform: translateX(-100%);\n  }\n\n  to {\n    transform: translateX(0);\n  }\n}\n\n@keyframes sigma-ui-slide-out-to-left {\n  from {\n    transform: translateX(0);\n  }\n\n  to {\n    transform: translateX(-100%);\n  }\n}\n\n@keyframes sigma-ui-slide-in-from-right {\n  from {\n    transform: translateX(100%);\n  }\n\n  to {\n    transform: translateX(0);\n  }\n}\n\n@keyframes sigma-ui-slide-out-to-right {\n  from {\n    transform: translateX(0);\n  }\n\n  to {\n    transform: translateX(100%);\n  }\n}\n</style>\n"
     },
     {
       "name": "SheetDescription.vue",

package/__generated/registry-schemes/style-system/css/skeleton.json

@@ -5,7 +5,7 @@
   "files": [
     {
       "name": "Skeleton.vue",
-      "content": "<script setup lang=\"ts\">\n</script>\n\n<template>\n  <div\n    class=\"sigma-ui-skeleton\"\n    :class=\"[$attrs.class]\"\n  />\n</template>\n\n<style>\n.sigma-ui-skeleton {\n  border-radius: var(--radius-md);\n  animation: skeleton-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  background-color: hsl(var(--muted));\n}\n\n@keyframes skeleton-pulse {\n  0%, 100% {\n    opacity: 1;\n  }\n\n  50% {\n    opacity: 0.5;\n  }\n}\n</style>\n"
+      "content": "<script setup lang=\"ts\">\n</script>\n\n<template>\n  <div\n    class=\"sigma-ui-skeleton\"\n    :class=\"[$attrs.class]\"\n  />\n</template>\n\n<style>\n.sigma-ui-skeleton {\n  border-radius: var(--radius-md);\n  animation: sigma-ui-skeleton-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  background-color: hsl(var(--muted));\n}\n\n@keyframes sigma-ui-skeleton-pulse {\n  0%, 100% {\n    opacity: 1;\n  }\n\n  50% {\n    opacity: 0.5;\n  }\n}\n</style>\n"
     },
     {
       "name": "index.ts",

package/__generated/registry-schemes/style-system/css/switch.json

@@ -5,7 +5,7 @@
   "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 'reka-ui';\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  width: 2.75rem;\n  height: 1.5rem;\n  flex-shrink: 0;\n  align-items: center;\n  border: 2px solid transparent;\n  border-radius: var(--radius-full);\n  cursor: pointer;\n  transition-duration: 150ms;\n  transition-property: color, background-color, border-color;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.sigma-ui-switch:focus-visible {\n  box-shadow: 0 0 0 2px hsl(var(--ring)), 0 0 0 4px hsl(var(--background));\n  outline: none;\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(218deg 14% 84% / 70%);\n}\n\n.sigma-ui-switch__thumb {\n  display: block;\n  width: 1.25rem;\n  height: 1.25rem;\n  border-radius: var(--radius-full);\n  animation: none;\n  background-color: hsl(var(--background));\n  box-shadow: 0 2px 4px rgb(0 0 0 / 10%);\n  pointer-events: none;\n  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.sigma-ui-switch__thumb[data-state=\"checked\"] {\n  animation: thumb-motion-blur-in 150ms cubic-bezier(0.4, 0, 0.2, 1);\n  transform: translateX(1.25rem);\n}\n\n.sigma-ui-switch__thumb[data-state=\"unchecked\"] {\n  animation: thumb-motion-blur-out 150ms cubic-bezier(0.4, 0, 0.2, 1);\n  transform: translateX(0);\n}\n\n@keyframes thumb-motion-blur-in {\n  0% {\n    filter: blur(0);\n  }\n\n  50% {\n    filter: blur(2px);\n  }\n\n  100% {\n    filter: blur(0);\n  }\n}\n\n@keyframes thumb-motion-blur-out {\n  0% {\n    filter: blur(0);\n  }\n\n  50% {\n    filter: blur(2px);\n  }\n\n  100% {\n    filter: blur(0);\n  }\n}\n</style>\n"
+      "content": "<script setup lang=\"ts\">\nimport {\n  SwitchRoot,\n  type SwitchRootEmits,\n  type SwitchRootProps,\n  SwitchThumb,\n  useForwardPropsEmits,\n\n} from 'reka-ui';\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  width: 2.75rem;\n  height: 1.5rem;\n  flex-shrink: 0;\n  align-items: center;\n  border: 2px solid transparent;\n  border-radius: var(--radius-full);\n  cursor: pointer;\n  transition-duration: 150ms;\n  transition-property: color, background-color, border-color;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.sigma-ui-switch:focus-visible {\n  box-shadow: 0 0 0 2px hsl(var(--ring)), 0 0 0 4px hsl(var(--background));\n  outline: none;\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(218deg 14% 84% / 70%);\n}\n\n.sigma-ui-switch__thumb {\n  display: block;\n  width: 1.25rem;\n  height: 1.25rem;\n  border-radius: var(--radius-full);\n  animation: none;\n  background-color: hsl(var(--background));\n  box-shadow: 0 2px 4px rgb(0 0 0 / 10%);\n  pointer-events: none;\n  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.sigma-ui-switch__thumb[data-state=\"checked\"] {\n  animation: sigma-ui-switch-thumb-in 150ms cubic-bezier(0.4, 0, 0.2, 1);\n  transform: translateX(1.25rem);\n}\n\n.sigma-ui-switch__thumb[data-state=\"unchecked\"] {\n  animation: sigma-ui-switch-thumb-out 150ms cubic-bezier(0.4, 0, 0.2, 1);\n  transform: translateX(0);\n}\n\n@keyframes sigma-ui-switch-thumb-in {\n  0% {\n    filter: blur(0);\n  }\n\n  50% {\n    filter: blur(2px);\n  }\n\n  100% {\n    filter: blur(0);\n  }\n}\n\n@keyframes sigma-ui-switch-thumb-out {\n  0% {\n    filter: blur(0);\n  }\n\n  50% {\n    filter: blur(2px);\n  }\n\n  100% {\n    filter: blur(0);\n  }\n}\n</style>\n"
     },
     {
       "name": "index.ts",

package/__generated/registry-schemes/style-system/css/tooltip.json

@@ -9,7 +9,7 @@
     },
     {
       "name": "TooltipContent.vue",
-      "content": "<script setup lang=\"ts\">\nimport { TooltipContent, type TooltipContentEmits, type TooltipContentProps, TooltipPortal, useForwardPropsEmits } from 'reka-ui';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(defineProps<TooltipContentProps>(), {\n  sideOffset: 4,\n});\n\nconst emits = defineEmits<TooltipContentEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <TooltipPortal>\n    <TooltipContent\n      v-bind=\"{ ...forwarded, ...$attrs }\"\n      class=\"sigma-ui-tooltip-content\"\n      :class=\"[$attrs.class]\"\n    >\n      <slot />\n    </TooltipContent>\n  </TooltipPortal>\n</template>\n\n<style>\n.sigma-ui-tooltip-content {\n  z-index: 50;\n  overflow: hidden;\n  padding: 0.375rem 0.75rem;\n  border: 1px solid hsl(var(--border));\n  border-radius: var(--radius-md);\n  animation: tooltip-in 150ms cubic-bezier(0.16, 1, 0.3, 1);\n  background-color: hsl(var(--popover));\n  box-shadow: 0 2px 4px rgb(0 0 0 / 10%);\n  color: hsl(var(--popover-foreground));\n  font-size: 0.875rem;\n}\n\n.sigma-ui-tooltip-content[data-side=\"bottom\"] {\n  animation: tooltip-in-bottom 150ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.sigma-ui-tooltip-content[data-side=\"top\"] {\n  animation: tooltip-in-top 150ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.sigma-ui-tooltip-content[data-side=\"left\"] {\n  animation: tooltip-in-left 150ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.sigma-ui-tooltip-content[data-side=\"right\"] {\n  animation: tooltip-in-right 150ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.sigma-ui-tooltip-content[data-state=\"closed\"] {\n  animation: tooltip-out 250ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n@keyframes tooltip-in {\n  from {\n    opacity: 0;\n    transform: scale(0.95);\n  }\n\n  to {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n\n@keyframes tooltip-out {\n  from {\n    opacity: 1;\n    transform: scale(1);\n  }\n\n  to {\n    opacity: 0;\n    transform: scale(0.95);\n  }\n}\n\n@keyframes tooltip-in-bottom {\n  from {\n    opacity: 0;\n    transform: translateY(-0.5rem);\n  }\n\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes tooltip-in-top {\n  from {\n    opacity: 0;\n    transform: translateY(0.5rem);\n  }\n\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes tooltip-in-left {\n  from {\n    opacity: 0;\n    transform: translateX(0.5rem);\n  }\n\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes tooltip-in-right {\n  from {\n    opacity: 0;\n    transform: translateX(-0.5rem);\n  }\n\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n</style>\n"
+      "content": "<script setup lang=\"ts\">\nimport { TooltipContent, type TooltipContentEmits, type TooltipContentProps, TooltipPortal, useForwardPropsEmits } from 'reka-ui';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(defineProps<TooltipContentProps>(), {\n  sideOffset: 4,\n});\n\nconst emits = defineEmits<TooltipContentEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <TooltipPortal>\n    <TooltipContent\n      v-bind=\"{ ...forwarded, ...$attrs }\"\n      class=\"sigma-ui-tooltip-content\"\n      :class=\"[$attrs.class]\"\n    >\n      <slot />\n    </TooltipContent>\n  </TooltipPortal>\n</template>\n\n<style>\n.sigma-ui-tooltip-content {\n  z-index: 50;\n  overflow: hidden;\n  padding: 0.375rem 0.75rem;\n  border: 1px solid hsl(var(--border));\n  border-radius: var(--radius-md);\n  animation: sigma-ui-tooltip-in 150ms cubic-bezier(0.16, 1, 0.3, 1);\n  background-color: hsl(var(--popover));\n  box-shadow: 0 2px 4px rgb(0 0 0 / 10%);\n  color: hsl(var(--popover-foreground));\n  font-size: 0.875rem;\n}\n\n.sigma-ui-tooltip-content[data-side=\"bottom\"] {\n  animation: sigma-ui-tooltip-in-bottom 150ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.sigma-ui-tooltip-content[data-side=\"top\"] {\n  animation: sigma-ui-tooltip-in-top 150ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.sigma-ui-tooltip-content[data-side=\"left\"] {\n  animation: sigma-ui-tooltip-in-left 150ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.sigma-ui-tooltip-content[data-side=\"right\"] {\n  animation: sigma-ui-tooltip-in-right 150ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.sigma-ui-tooltip-content[data-state=\"closed\"] {\n  animation: sigma-ui-tooltip-out 250ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n@keyframes sigma-ui-tooltip-in {\n  from {\n    opacity: 0;\n    transform: scale(0.95);\n  }\n\n  to {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n\n@keyframes sigma-ui-tooltip-out {\n  from {\n    opacity: 1;\n    transform: scale(1);\n  }\n\n  to {\n    opacity: 0;\n    transform: scale(0.95);\n  }\n}\n\n@keyframes sigma-ui-tooltip-in-bottom {\n  from {\n    opacity: 0;\n    transform: translateY(-0.5rem);\n  }\n\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes sigma-ui-tooltip-in-top {\n  from {\n    opacity: 0;\n    transform: translateY(0.5rem);\n  }\n\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes sigma-ui-tooltip-in-left {\n  from {\n    opacity: 0;\n    transform: translateX(0.5rem);\n  }\n\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes sigma-ui-tooltip-in-right {\n  from {\n    opacity: 0;\n    transform: translateX(-0.5rem);\n  }\n\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n</style>\n"
     },
     {
       "name": "TooltipProvider.vue",

package/__generated/registry-schemes/style-system/tailwind/button.json

@@ -5,7 +5,7 @@
   "files": [
     {
       "name": "Button.vue",
-      "content": "<script setup lang=\"ts\">\n;\nimport { Primitive, type PrimitiveProps } from 'reka-ui';\nimport { Loader2Icon } from 'lucide-vue-next';\nimport { cn } from '@ui/utils';\nimport { type ButtonVariants, buttonVariants } from '.';\n\ninterface Props extends PrimitiveProps {\n  variant?: ButtonVariants['variant'];\n  size?: ButtonVariants['size'];\n  isLoading?: boolean;\n  loadingText?: string;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  as: 'button',\n  isLoading: false,\n});\n</script>\n\n<template>\n  <Primitive\n    :as=\"as\"\n    :as-child=\"asChild\"\n    :class=\"cn(buttonVariants({ variant, size }), $attrs.class ?? '')\"\n    :disabled=\"isLoading || $attrs.disabled\"\n  >\n    <Loader2Icon\n      v-if=\"isLoading\"\n      class=\"w-4 h-4 mr-2 animate-spin\"\n    />\n    <template v-if=\"!isLoading || (isLoading && !loadingText)\">\n      <slot />\n    </template>\n    <template v-else>\n      {{ loadingText }}\n    </template>\n  </Primitive>\n</template>\n"
+      "content": "<script setup lang=\"ts\">\n;\nimport { Primitive, type PrimitiveProps } from 'reka-ui';\nimport { Loader2Icon } from 'lucide-vue-next';\nimport { cn } from '@ui/utils';\nimport { type ButtonVariants, buttonVariants } from '.';\n\ninterface Props extends PrimitiveProps {\n  variant?: ButtonVariants['variant'];\n  size?: ButtonVariants['size'];\n  isLoading?: boolean;\n  loadingText?: string;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  as: 'button',\n  variant: 'default',\n  size: 'default',\n  isLoading: false,\n  loadingText: '',\n});\n</script>\n\n<template>\n  <Primitive\n    :as=\"as\"\n    :as-child=\"asChild\"\n    :class=\"cn(buttonVariants({ variant, size }), $attrs.class ?? '')\"\n    :disabled=\"isLoading || $attrs.disabled\"\n  >\n    <Loader2Icon\n      v-if=\"isLoading\"\n      class=\"w-4 h-4 mr-2 animate-spin\"\n    />\n    <template v-if=\"!isLoading || (isLoading && !loadingText)\">\n      <slot />\n    </template>\n    <template v-else>\n      {{ loadingText }}\n    </template>\n  </Primitive>\n</template>\n"
     },
     {
       "name": "index.ts",

package/__generated/registry-schemes/style-system/tailwind/navigation-menu.json

@@ -9,7 +9,7 @@
     },
     {
       "name": "NavigationMenuContent.vue",
-      "content": "<script setup lang=\"ts\">\nimport {\n  NavigationMenuContent,\n  type NavigationMenuContentEmits,\n  type NavigationMenuContentProps,\n  useForwardPropsEmits,\n} from 'reka-ui';\n\nconst props = defineProps<NavigationMenuContentProps>();\nconst emits = defineEmits<NavigationMenuContentEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <NavigationMenuContent\n    v-bind=\"forwarded\"\n    class=\"sigma-ui-navigation-menu-content\"\n  >\n    <slot />\n  </NavigationMenuContent>\n</template>\n\n<style>\n.sigma-ui-navigation-menu-content {\n  top: 0;\n  left: 0;\n  width: 100%;\n  animation: fade-out 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-state=\"open\"] {\n  animation: fade-in 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"from-end\"][data-state=\"open\"] {\n  animation: slide-in-from-right 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"from-start\"][data-state=\"open\"] {\n  animation: slide-in-from-left 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"to-end\"][data-state=\"closed\"] {\n  animation: slide-out-to-right 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"to-start\"][data-state=\"closed\"] {\n  animation: slide-out-to-left 200ms ease-in-out;\n}\n\n@media (width >= 768px) {\n  .sigma-ui-navigation-menu-content {\n    position: absolute;\n    width: auto;\n  }\n}\n\n@keyframes fade-in {\n  from {\n    filter: blur(12px);\n    opacity: 0;\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n  }\n}\n\n@keyframes fade-out {\n  from {\n    opacity: 1;\n  }\n\n  to {\n    opacity: 0;\n  }\n}\n\n@keyframes slide-in-from-right {\n  from {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(13rem);\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes slide-in-from-left {\n  from {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(-13rem);\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes slide-out-to-right {\n  from {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n\n  to {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(13rem);\n  }\n}\n\n@keyframes slide-out-to-left {\n  from {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n\n  to {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(-13rem);\n  }\n}\n</style>\n"
+      "content": "<script setup lang=\"ts\">\nimport {\n  NavigationMenuContent,\n  type NavigationMenuContentEmits,\n  type NavigationMenuContentProps,\n  useForwardPropsEmits,\n} from 'reka-ui';\n\nconst props = defineProps<NavigationMenuContentProps>();\nconst emits = defineEmits<NavigationMenuContentEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <NavigationMenuContent\n    v-bind=\"forwarded\"\n    class=\"sigma-ui-navigation-menu-content\"\n  >\n    <slot />\n  </NavigationMenuContent>\n</template>\n\n<style>\n.sigma-ui-navigation-menu-content {\n  top: 0;\n  left: 0;\n  width: 100%;\n  animation: sigma-ui-nav-fade-out 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-state=\"open\"] {\n  animation: sigma-ui-nav-fade-in 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"from-end\"][data-state=\"open\"] {\n  animation: sigma-ui-nav-slide-in-from-right 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"from-start\"][data-state=\"open\"] {\n  animation: sigma-ui-nav-slide-in-from-left 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"to-end\"][data-state=\"closed\"] {\n  animation: sigma-ui-nav-slide-out-to-right 200ms ease-in-out;\n}\n\n.sigma-ui-navigation-menu-content[data-motion=\"to-start\"][data-state=\"closed\"] {\n  animation: sigma-ui-nav-slide-out-to-left 200ms ease-in-out;\n}\n\n@media (width >= 768px) {\n  .sigma-ui-navigation-menu-content {\n    position: absolute;\n    width: auto;\n  }\n}\n\n@keyframes sigma-ui-nav-fade-in {\n  from {\n    filter: blur(12px);\n    opacity: 0;\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n  }\n}\n\n@keyframes sigma-ui-nav-fade-out {\n  from {\n    opacity: 1;\n  }\n\n  to {\n    opacity: 0;\n  }\n}\n\n@keyframes sigma-ui-nav-slide-in-from-right {\n  from {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(13rem);\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes sigma-ui-nav-slide-in-from-left {\n  from {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(-13rem);\n  }\n\n  to {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes sigma-ui-nav-slide-out-to-right {\n  from {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n\n  to {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(13rem);\n  }\n}\n\n@keyframes sigma-ui-nav-slide-out-to-left {\n  from {\n    filter: blur(0);\n    opacity: 1;\n    transform: translateX(0);\n  }\n\n  to {\n    filter: blur(12px);\n    opacity: 0;\n    transform: translateX(-13rem);\n  }\n}\n</style>\n"
     },
     {
       "name": "NavigationMenuIndicator.vue",