romhml
diff --git a/‎packages/examples/src/assets/ui/index.css
+3 b/‎packages/examples/src/assets/ui/index.css
+3
diff --git a/‎packages/examples/src/examples/ui/FormExample.vue
+4-1 b/‎packages/examples/src/examples/ui/FormExample.vue
+4-1
diff --git a/‎packages/examples/src/examples/ui/SliderExample.vue
+11 b/‎packages/examples/src/examples/ui/SliderExample.vue
+11
@@ -52,6 +52,9 @@
 .w-xs {
   width: var(--container-xs);
 }
+.min-w-56 {
+  min-width: calc(var(--spacing) * 56);
+}
 .min-w-60 {
   min-width: calc(var(--spacing) * 60);
 }
 
@@ -27,7 +27,10 @@ function validate(data: Partial<typeof state>) {
       name="password"
       label="Password"
     >
-      <UInput v-model="state.password" />
+      <UInput
+        v-model="state.password"
+        type="password"
+      />
     </UFormField>
     <UButton type="submit">
       Submit
 
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+extendCompodiumMeta({
+  defaultProps: {
+    defaultValue: 33
+  }
+})
+</script>
+
+<template>
+  <USlider class="min-w-56" />
+</template>
Original file line number	Diff line number	Diff line change
`@@ -52,6 +52,9 @@`
`52`	`52`	`.w-xs {`
`53`	`53`	`width: var(--container-xs);`
`54`	`54`	`}`
	`55`	`+.min-w-56 {`
	`56`	`+ min-width: calc(var(--spacing) * 56);`
	`57`	`+}`
`55`	`58`	`.min-w-60 {`
`56`	`59`	`min-width: calc(var(--spacing) * 60);`
`57`	`60`	`}`