@polymarbot/nuxt-layer-shadcn-ui 0.2.2 → 0.3.1

package/app/components/ui/Modal/index.stories.ts

@@ -60,9 +60,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const WithDescription: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Modal, Button },
     setup () {
@@ -88,6 +91,7 @@ export const WithDescription: Story = {
 }
 
 export const ScrollableContent: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Modal, Button },
     setup () {
@@ -110,6 +114,7 @@ export const ScrollableContent: Story = {
 }
 
 export const Types: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Modal, Button },
     setup () {
@@ -150,6 +155,7 @@ export const Types: Story = {
 }
 
 export const EventHandling: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Modal, Button },
     setup () {

package/app/components/ui/ModalContent/index.stories.ts

@@ -31,9 +31,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const Types: Story = {
+  parameters: noControls,
   render: () => ({
     components: { ModalContent },
     setup: () => ({ types }),
@@ -52,6 +55,7 @@ export const Types: Story = {
 }
 
 export const WithCustomIcon: Story = {
+  parameters: noControls,
   render: () => ({
     components: { ModalContent },
     template: `
@@ -64,6 +68,7 @@ export const WithCustomIcon: Story = {
 }
 
 export const MultilineText: Story = {
+  parameters: noControls,
   render: () => ({
     components: { ModalContent },
     template: `

package/app/components/ui/PageCard/index.stories.ts

@@ -36,9 +36,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const NoTitle: Story = {
+  parameters: noControls,
   render: () => ({
     components: { PageCard },
     template: `
@@ -50,6 +53,7 @@ export const NoTitle: Story = {
 }
 
 export const WithSubtitle: Story = {
+  parameters: noControls,
   render: () => ({
     components: { PageCard },
     template: `
@@ -65,6 +69,7 @@ export const WithSubtitle: Story = {
 }
 
 export const WithBackButton: Story = {
+  parameters: noControls,
   render: () => ({
     components: { PageCard },
     template: `
@@ -76,6 +81,7 @@ export const WithBackButton: Story = {
 }
 
 export const BackWithSubtitle: Story = {
+  parameters: noControls,
   render: () => ({
     components: { PageCard },
     template: `
@@ -92,6 +98,7 @@ export const BackWithSubtitle: Story = {
 }
 
 export const WithActions: Story = {
+  parameters: noControls,
   render: () => ({
     components: { PageCard, Button },
     template: `
@@ -107,6 +114,7 @@ export const WithActions: Story = {
 }
 
 export const ActionsSubtitleBack: Story = {
+  parameters: noControls,
   render: () => ({
     components: { PageCard, WebLink },
     template: `
@@ -127,6 +135,7 @@ export const ActionsSubtitleBack: Story = {
 }
 
 export const CustomTitleSlot: Story = {
+  parameters: noControls,
   render: () => ({
     components: { PageCard },
     template: `
@@ -147,6 +156,7 @@ export const CustomTitleSlot: Story = {
 }
 
 export const WithFooter: Story = {
+  parameters: noControls,
   render: () => ({
     components: { PageCard, Button },
     template: `
@@ -164,6 +174,7 @@ export const WithFooter: Story = {
 }
 
 export const CardVariant: Story = {
+  parameters: noControls,
   render: () => ({
     components: { PageCard },
     template: `
@@ -180,6 +191,7 @@ export const CardVariant: Story = {
 }
 
 export const Loading: Story = {
+  parameters: noControls,
   render: () => ({
     components: { PageCard },
     template: `
@@ -191,6 +203,7 @@ export const Loading: Story = {
 }
 
 export const NotReady: Story = {
+  parameters: noControls,
   render: () => ({
     components: { PageCard },
     template: `
@@ -202,6 +215,7 @@ export const NotReady: Story = {
 }
 
 export const Disabled: Story = {
+  parameters: noControls,
   render: () => ({
     components: { PageCard, Button },
     template: `

package/app/components/ui/Pagination/index.stories.ts

@@ -34,9 +34,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const Controlled: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Pagination },
     setup () {
@@ -63,6 +66,7 @@ export const Controlled: Story = {
 }
 
 export const Sizes: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Pagination },
     template: `
@@ -81,6 +85,7 @@ export const Sizes: Story = {
 }
 
 export const Simple: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Pagination },
     template: `

package/app/components/ui/Popover/index.stories.ts

@@ -25,9 +25,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const WithForm: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Popover, Button, Input },
     template: `
@@ -46,6 +49,7 @@ export const WithForm: Story = {
 }
 
 export const Controlled: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Popover, Button },
     setup () {

package/app/components/ui/Qrcode/index.stories.ts

@@ -24,9 +24,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const DynamicContent: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Qrcode },
     setup () {
@@ -49,6 +52,7 @@ export const DynamicContent: Story = {
 }
 
 export const Sizes: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Qrcode },
     template: `

package/app/components/ui/RadioCardGroup/index.stories.ts

@@ -65,17 +65,40 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const WithDisabledOption: Story = {
-  args: {
-    modelValue: 'pro',
-    options: planOptions,
-  },
+  parameters: noControls,
+  render: () => ({
+    components: { RadioCardGroup },
+    setup () {
+      const selected = ref('pro')
+      return { selected, planOptions }
+    },
+    template: `
+      <div class="max-w-md space-y-4">
+        <RadioCardGroup v-model="selected" :options="planOptions" />
+        <div class="text-sm text-muted-foreground">Selected: {{ selected }}</div>
+      </div>
+    `,
+  }),
 }
 
 export const Disabled: Story = {
-  args: {
-    disabled: true,
-  },
+  parameters: noControls,
+  render: () => ({
+    components: { RadioCardGroup },
+    setup () {
+      const selected = ref('current')
+      return { selected, options }
+    },
+    template: `
+      <div class="max-w-md space-y-4">
+        <RadioCardGroup v-model="selected" :options="options" disabled />
+        <div class="text-sm text-muted-foreground">Selected: {{ selected }}</div>
+      </div>
+    `,
+  }),
 }

package/app/components/ui/RadioGroup/index.stories.ts

@@ -39,9 +39,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const Controlled: Story = {
+  parameters: noControls,
   render: () => ({
     components: { RadioGroup },
     setup () {
@@ -58,6 +61,7 @@ export const Controlled: Story = {
 }
 
 export const Horizontal: Story = {
+  parameters: noControls,
   render: () => ({
     components: { RadioGroup },
     setup () {
@@ -74,6 +78,7 @@ export const Horizontal: Story = {
 }
 
 export const WithDisabledItem: Story = {
+  parameters: noControls,
   render: () => ({
     components: { RadioGroup },
     setup () {
@@ -90,6 +95,7 @@ export const WithDisabledItem: Story = {
 }
 
 export const Disabled: Story = {
+  parameters: noControls,
   render: () => ({
     components: { RadioGroup },
     setup () {
@@ -101,6 +107,7 @@ export const Disabled: Story = {
 }
 
 export const CustomSlots: Story = {
+  parameters: noControls,
   render: () => ({
     components: { RadioGroup },
     setup () {

package/app/components/ui/ScrollArea/index.stories.ts

@@ -45,9 +45,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const FadeMask: Story = {
+  parameters: noControls,
   render: () => ({
     components: { ScrollArea },
     setup () {
@@ -73,6 +76,7 @@ export const FadeMask: Story = {
 }
 
 export const NoOverflow: Story = {
+  parameters: noControls,
   render: () => ({
     components: { ScrollArea },
     setup () {

package/app/components/ui/SearchSelect/index.stories.ts

@@ -83,9 +83,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const Preselected: Story = {
+  parameters: noControls,
   render: () => ({
     components: { SearchSelect },
     setup () {
@@ -107,6 +110,7 @@ export const Preselected: Story = {
 }
 
 export const WithDefaultOptions: Story = {
+  parameters: noControls,
   render: () => ({
     components: { SearchSelect },
     setup () {
@@ -128,6 +132,7 @@ export const WithDefaultOptions: Story = {
 }
 
 export const WithCreateNew: Story = {
+  parameters: noControls,
   render: () => ({
     components: { SearchSelect },
     setup () {
@@ -149,6 +154,7 @@ export const WithCreateNew: Story = {
 }
 
 export const Disabled: Story = {
+  parameters: noControls,
   render: () => ({
     components: { SearchSelect },
     setup () {

package/app/components/ui/SearchSelect/index.vue

@@ -220,7 +220,8 @@ defineExpose({ refresh: resetAndLoad })
       <EffectIntersectionChecker
         v-if="hasMore"
         :disabled="isLoading"
-        class="flex items-center justify-center py-2"
+        bao
+        class="py-2 flex items-center justify-center"
         @show="loadMore"
       >
         <Icon
@@ -235,15 +236,15 @@ defineExpose({ refresh: resetAndLoad })
       #footer
     >
       <slot name="footer">
-        <div class="border-t border-border">
+        <div class="border-border border-t">
           <WebLink
             :to="createNewTo!"
             target="_blank"
             unstyled
             class="
-              flex items-center gap-2 px-3 py-2 text-sm text-muted-foreground
-              transition-colors
+              gap-2 px-3 py-2 text-sm text-muted-foreground
               hover:bg-accent
+              flex items-center transition-colors
             "
           >
             <Icon

package/app/components/ui/Select/index.stories.ts

@@ -66,9 +66,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const WithFilter: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Select },
     setup () {
@@ -90,6 +93,7 @@ export const WithFilter: Story = {
 }
 
 export const Multiple: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Select },
     setup () {
@@ -111,6 +115,7 @@ export const Multiple: Story = {
 }
 
 export const WithDisabledOptions: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Select },
     setup () {
@@ -128,6 +133,7 @@ export const WithDisabledOptions: Story = {
 }
 
 export const Scrollable: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Select },
     setup () {
@@ -148,6 +154,7 @@ export const Scrollable: Story = {
 }
 
 export const Grouped: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Select },
     setup () {
@@ -168,6 +175,7 @@ export const Grouped: Story = {
 }
 
 export const Disabled: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Select },
     setup () {

package/app/components/ui/Skeleton/index.stories.ts

@@ -22,9 +22,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const VariousSizes: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Skeleton },
     template: `
@@ -38,6 +41,7 @@ export const VariousSizes: Story = {
 }
 
 export const CardSkeleton: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Skeleton },
     template: `

package/app/components/ui/Slider/index.stories.ts

@@ -36,9 +36,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const Range: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Slider },
     setup () {
@@ -55,6 +58,7 @@ export const Range: Story = {
 }
 
 export const WithStep: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Slider },
     setup () {
@@ -71,6 +75,7 @@ export const WithStep: Story = {
 }
 
 export const CustomMinMax: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Slider },
     setup () {
@@ -87,6 +92,7 @@ export const CustomMinMax: Story = {
 }
 
 export const Disabled: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Slider },
     setup () {

package/app/components/ui/Surface/index.stories.ts

@@ -26,9 +26,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const Colors: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Surface },
     setup: () => ({ colors }),
@@ -43,6 +46,7 @@ export const Colors: Story = {
 }
 
 export const Variants: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Surface },
     setup: () => ({ variants }),
@@ -57,6 +61,7 @@ export const Variants: Story = {
 }
 
 export const VariantColorMatrix: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Surface },
     setup: () => ({ colors, variants }),

package/app/components/ui/Tabs/index.stories.ts

@@ -57,9 +57,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const Controlled: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Tabs },
     setup () {
@@ -76,6 +79,7 @@ export const Controlled: Story = {
 }
 
 export const IconOnly: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Tabs },
     setup: () => ({ items }),
@@ -91,6 +95,7 @@ export const IconOnly: Story = {
 }
 
 export const Rounded: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Tabs },
     setup: () => ({ items }),
@@ -106,6 +111,7 @@ export const Rounded: Story = {
 }
 
 export const DisabledItem: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Tabs },
     setup: () => ({ disabledItems }),
@@ -120,6 +126,7 @@ export const DisabledItem: Story = {
 }
 
 export const NoContent: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Tabs },
     setup: () => ({ navItems }),
@@ -134,6 +141,7 @@ export const NoContent: Story = {
 }
 
 export const CustomSlots: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Tabs, Card },
     setup: () => ({ items }),

package/app/components/ui/Tag/index.stories.ts

@@ -26,9 +26,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const Colors: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Tag },
     setup: () => ({ colors }),
@@ -41,6 +44,7 @@ export const Colors: Story = {
 }
 
 export const Variants: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Tag },
     setup: () => ({ variants }),
@@ -53,6 +57,7 @@ export const Variants: Story = {
 }
 
 export const VariantColorMatrix: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Tag },
     setup: () => ({ colors, variants }),

package/app/components/ui/Textarea/index.stories.ts

@@ -36,9 +36,12 @@ const meta = {
 export default meta
 type Story = StoryObj<typeof meta>
 
+const noControls = { controls: { disable: true }} satisfies Story['parameters']
+
 export const Default: Story = {}
 
 export const Controlled: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Textarea },
     setup () {
@@ -55,6 +58,7 @@ export const Controlled: Story = {
 }
 
 export const WithRows: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Textarea },
     template: `
@@ -66,6 +70,7 @@ export const WithRows: Story = {
 }
 
 export const Invalid: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Textarea },
     template: `
@@ -77,6 +82,7 @@ export const Invalid: Story = {
 }
 
 export const Disabled: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Textarea },
     template: `
@@ -88,6 +94,7 @@ export const Disabled: Story = {
 }
 
 export const Readonly: Story = {
+  parameters: noControls,
   render: () => ({
     components: { Textarea },
     template: `