@object-ui/components 3.3.0 → 3.3.1

package/src/stories-json/accordion.stories.tsx

@@ -1,43 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Primitives/Data Display/Accordion',
-  component: SchemaRenderer,
-  parameters: { layout: 'padded' },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } }
-  }
-} satisfies Meta<typeof SchemaRenderer>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const renderStory = (args: any) => <SchemaRenderer schema={args as unknown as BaseSchema} />;
-
-export const Default: Story = {
-  render: renderStory,
-  args: {
-    type: 'accordion',
-    className: 'w-[400px]',
-    items: [
-        { 
-            label: 'Is it accessible?', 
-            value: 'item-1', 
-            content: [{ type: 'text', content: 'Yes. It adheres to the WAI-ARIA design pattern.' }]
-        },
-        { 
-            label: 'Is it styled?', 
-            value: 'item-2', 
-            content: [{ type: 'text', content: 'Yes. It comes with default styles that matches the other components\' aesthetic.' }]
-        },
-        { 
-            label: 'Is it animated?', 
-            value: 'item-3', 
-            content: [{ type: 'text', content: 'Yes. It\'s animated by default, but you can disable it if you prefer.' }]
-        }
-    ]
-  } as any,
-};

package/src/stories-json/aggrid.stories.tsx

@@ -1,103 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Plugins/Data Views/AgGrid',
-  component: SchemaRenderer,
-  parameters: {
-    layout: 'padded',
-  },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } },
-  },
-} satisfies Meta<any>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const renderStory = (args: any) => <SchemaRenderer schema={args as unknown as BaseSchema} />;
-
-export const Default: Story = {
-  render: renderStory,
-  args: {
-    type: 'aggrid',
-    rowData: [
-      { make: 'Tesla', model: 'Model Y', price: 64950, electric: true },
-      { make: 'Ford', model: 'F-Series', price: 33850, electric: false },
-      { make: 'Toyota', model: 'Corolla', price: 29600, electric: false },
-      { make: 'Mercedes', model: 'EQA', price: 48890, electric: true },
-      { make: 'Fiat', model: '500', price: 15774, electric: false },
-      { make: 'Nissan', model: 'Juke', price: 20675, electric: false },
-      { make: 'Vauxhall', model: 'Corsa', price: 18460, electric: false },
-      { make: 'Volvo', model: 'XC90', price: 72835, electric: false },
-      { make: 'Mercedes', model: 'GLA', price: 47825, electric: false },
-      { make: 'Ford', model: 'Puma', price: 27420, electric: false },
-      { make: 'Volkswagen', model: 'Golf', price: 28850, electric: false },
-      { make: 'Kia', model: 'Sportage', price: 31095, electric: false }
-    ],
-    columnDefs: [
-      { field: 'make', headerName: 'Make', sortable: true, filter: true },
-      { field: 'model', headerName: 'Model', sortable: true, filter: true },
-      { field: 'price', headerName: 'Price', sortable: true, filter: 'agNumberColumnFilter' },
-      { field: 'electric', headerName: 'Electric', sortable: true, filter: true }
-    ],
-    pagination: true,
-    paginationPageSize: 10,
-    theme: 'quartz',
-    height: 500,
-    animateRows: true
-  } as any,
-};
-
-export const WithPagination: Story = {
-  render: renderStory,
-  args: {
-    type: 'aggrid',
-    rowData: [
-      { athlete: 'Michael Phelps', age: 23, country: 'United States', year: 2008, sport: 'Swimming', gold: 8, silver: 0, bronze: 0 },
-      { athlete: 'Natalie Coughlin', age: 25, country: 'United States', year: 2008, sport: 'Swimming', gold: 1, silver: 2, bronze: 3 },
-      { athlete: 'Aleksey Nemov', age: 24, country: 'Russia', year: 2000, sport: 'Gymnastics', gold: 2, silver: 1, bronze: 3 },
-      { athlete: 'Alicia Coutts', age: 24, country: 'Australia', year: 2012, sport: 'Swimming', gold: 1, silver: 3, bronze: 1 },
-      { athlete: 'Missy Franklin', age: 17, country: 'United States', year: 2012, sport: 'Swimming', gold: 4, silver: 0, bronze: 1 },
-    ],
-    columnDefs: [
-      { field: 'athlete', headerName: 'Athlete' },
-      { field: 'age', headerName: 'Age', width: 90 },
-      { field: 'country', headerName: 'Country', width: 120 },
-      { field: 'year', headerName: 'Year', width: 90 },
-      { field: 'sport', headerName: 'Sport', width: 110 },
-      { field: 'gold', headerName: 'Gold', width: 100 },
-      { field: 'silver', headerName: 'Silver', width: 100 },
-      { field: 'bronze', headerName: 'Bronze', width: 100 }
-    ],
-    pagination: true,
-    paginationPageSize: 3,
-    theme: 'quartz',
-    height: 400
-  } as any,
-};
-
-export const AlpineTheme: Story = {
-  render: renderStory,
-  args: {
-    type: 'aggrid',
-    rowData: [
-      { product: 'Laptop', category: 'Electronics', price: 1200, stock: 15 },
-      { product: 'Mouse', category: 'Electronics', price: 25, stock: 150 },
-      { product: 'Keyboard', category: 'Electronics', price: 75, stock: 80 },
-      { product: 'Monitor', category: 'Electronics', price: 300, stock: 45 },
-      { product: 'Desk', category: 'Furniture', price: 250, stock: 20 }
-    ],
-    columnDefs: [
-      { field: 'product', headerName: 'Product', sortable: true, filter: true },
-      { field: 'category', headerName: 'Category', sortable: true, filter: true },
-      { field: 'price', headerName: 'Price ($)', sortable: true, filter: 'agNumberColumnFilter' },
-      { field: 'stock', headerName: 'Stock', sortable: true, filter: 'agNumberColumnFilter' }
-    ],
-    theme: 'alpine',
-    height: 400,
-    domLayout: 'autoHeight'
-  } as any,
-};

package/src/stories-json/alert.stories.tsx

@@ -1,39 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Primitives/Feedback/Alert',
-  component: SchemaRenderer,
-  parameters: { layout: 'padded' },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } }
-  }
-} satisfies Meta<typeof SchemaRenderer>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const renderStory = (args: any) => <SchemaRenderer schema={args as unknown as BaseSchema} />;
-
-export const Default: Story = {
-  render: renderStory,
-  args: {
-    type: 'alert',
-    title: 'Schema/Data Display/Heads up!',
-    description: 'You can add components to your app using the cli.',
-    className: 'w-[400px]'
-  } as any,
-};
-
-export const Destructive: Story = {
-  render: renderStory,
-  args: {
-    type: 'alert',
-    variant: 'destructive',
-    title: 'Schema/Data Display/Error',
-    description: 'Your session has expired. Please log in again.',
-    className: 'w-[400px]'
-  } as any,
-};

package/src/stories-json/aspect-ratio.stories.tsx

@@ -1,34 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Primitives/Data Display/Aspect Ratio',
-  component: SchemaRenderer,
-  parameters: { layout: 'centered' },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } }
-  }
-} satisfies Meta<typeof SchemaRenderer>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const renderStory = (args: any) => <SchemaRenderer schema={args as unknown as BaseSchema} />;
-
-export const AspectRatio: Story = {
-  render: renderStory,
-  args: {
-    type: 'div',
-    className: 'w-[450px]',
-    children: [
-        {
-            type: 'aspect-ratio',
-            ratio: 16 / 9,
-            image: "https://images.unsplash.com/photo-1588345921523-c2dcdb7f1dcd?w=800&dpr=2&q=80",
-            alt: "Photo by Drew Beamer"
-        }
-    ]
-  } as any,
-};

package/src/stories-json/avatar.stories.tsx

@@ -1,38 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Primitives/Data Display/Avatar',
-  component: SchemaRenderer,
-  parameters: { layout: 'centered' },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } }
-  }
-} satisfies Meta<typeof SchemaRenderer>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const renderStory = (args: any) => <SchemaRenderer schema={args as unknown as BaseSchema} />;
-
-export const Default: Story = {
-  render: renderStory,
-  args: {
-    type: 'avatar',
-    src: 'https://github.com/shadcn.png',
-    alt: '@shadcn',
-    fallback: 'CN'
-  } as any,
-};
-
-export const Fallback: Story = {
-  render: renderStory,
-  args: {
-    type: 'avatar',
-    src: 'https://broken-link',
-    alt: '@shadcn',
-    fallback: 'CN'
-  } as any,
-};

package/src/stories-json/badge.stories.tsx

@@ -1,53 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Primitives/Data Display/Badge',
-  component: SchemaRenderer,
-  parameters: { layout: 'centered' },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } }
-  }
-} satisfies Meta<typeof SchemaRenderer>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const renderStory = (args: any) => <SchemaRenderer schema={args as unknown as BaseSchema} />;
-
-export const Badge: Story = {
-  render: renderStory,
-  args: {
-    type: 'badge',
-    label: 'Badge'
-  } as any,
-};
-
-export const Secondary: Story = {
-  render: renderStory,
-  args: {
-    type: 'badge',
-    label: 'Secondary',
-    variant: 'secondary'
-  } as any,
-};
-
-export const Destructive: Story = {
-  render: renderStory,
-  args: {
-    type: 'badge',
-    label: 'Destructive',
-    variant: 'destructive'
-  } as any,
-};
-
-export const Outline: Story = {
-  render: renderStory,
-  args: {
-    type: 'badge',
-    label: 'Outline',
-    variant: 'outline'
-  } as any,
-};

package/src/stories-json/breadcrumb.stories.tsx

@@ -1,30 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Primitives/Navigation/Breadcrumb',
-  component: SchemaRenderer,
-  parameters: { layout: 'centered' },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } }
-  }
-} satisfies Meta<typeof SchemaRenderer>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const renderStory = (args: any) => <SchemaRenderer schema={args as unknown as BaseSchema} />;
-
-export const Default: Story = {
-  render: renderStory,
-  args: {
-    type: 'breadcrumb',
-    items: [
-        { label: 'Home', href: '/' },
-        { label: 'Components', href: '/components' },
-        { label: 'Breadcrumb' }
-    ]
-  } as any,
-};

package/src/stories-json/button-group.stories.tsx

@@ -1,43 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Primitives/General/Button Group',
-  component: SchemaRenderer,
-  parameters: { layout: 'centered' },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } }
-  }
-} satisfies Meta<typeof SchemaRenderer>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const renderStory = (args: any) => <SchemaRenderer schema={args as unknown as BaseSchema} />;
-
-export const Default: Story = {
-  render: renderStory,
-  args: {
-    type: 'button-group',
-    variant: 'outline',
-    buttons: [
-        { label: 'Years' },
-        { label: 'Months' },
-        { label: 'Days' }
-    ]
-  } as any,
-};
-
-export const Secondary: Story = {
-  render: renderStory,
-  args: {
-    type: 'button-group',
-    variant: 'secondary',
-    buttons: [
-        { label: 'Save' },
-        { label: 'Cancel' }
-    ]
-  } as any,
-};

package/src/stories-json/button.stories.tsx

@@ -1,73 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Primitives/General/Button',
-  component: SchemaRenderer,
-  parameters: {
-    layout: 'centered',
-  },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } },
-    type: { control: "text" },
-    props: { control: "object" },
-    children: { control: "object" }
-  },
-} satisfies Meta<any>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
-  render: (args) => {
-    // Treat args as the schema definition
-    return <SchemaRenderer schema={args as unknown as BaseSchema} />;
-  },
-  args: {
-    type: 'button',
-    props: {
-      variant: 'default',
-    },
-    // Using children array as per spec
-    children: [
-        {
-            type: 'text',
-            content: 'Click Me (JSON)'
-        }
-    ]
-  } as any,
-};
-
-export const Outline: Story = {
-  render: (args) => <SchemaRenderer schema={args as unknown as BaseSchema} />,
-  args: {
-    type: 'button',
-    props: {
-      variant: 'outline',
-    },
-    children: [
-        {
-            type: 'text',
-            content: 'Outline Button'
-        }
-    ]
-  } as any,
-};
-
-export const Destructive: Story = {
-  render: (args) => <SchemaRenderer schema={args as unknown as BaseSchema} />,
-  args: {
-    type: 'button',
-    props: {
-        variant: 'destructive',
-    },
-    children: [
-        {
-            type: 'text',
-            content: 'Delete'
-        }
-    ]
-  } as any,
-};

package/src/stories-json/calendar.stories.tsx

@@ -1,85 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Plugins/Scheduling/Calendar',
-  component: SchemaRenderer,
-  parameters: {
-    layout: 'padded',
-  },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } },
-  },
-} satisfies Meta<any>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const renderStory = (args: any) => <SchemaRenderer schema={args as unknown as BaseSchema} />;
-
-export const CalendarView: Story = {
-  render: renderStory,
-  args: {
-    type: 'calendar-view',
-    events: [
-      {
-        id: '1',
-        title: 'Schema/Data Display/Team Meeting',
-        start: new Date(new Date().getFullYear(), new Date().getMonth(), 15, 10, 0),
-        end: new Date(new Date().getFullYear(), new Date().getMonth(), 15, 11, 0),
-        color: '#3b82f6'
-      },
-      {
-        id: '2',
-        title: 'Schema/Data Display/Project Deadline',
-        start: new Date(new Date().getFullYear(), new Date().getMonth(), 20),
-        end: new Date(new Date().getFullYear(), new Date().getMonth(), 20),
-        allDay: true,
-        color: '#ef4444'
-      },
-      {
-        id: '3',
-        title: 'Schema/Data Display/Client Presentation',
-        start: new Date(new Date().getFullYear(), new Date().getMonth(), 25, 14, 0),
-        end: new Date(new Date().getFullYear(), new Date().getMonth(), 25, 16, 0),
-        color: '#10b981'
-      }
-    ],
-    className: 'h-[600px]'
-  } as any,
-};
-
-export const MonthView: Story = {
-  render: renderStory,
-  args: {
-    type: 'calendar-view',
-    defaultView: 'month',
-    events: [
-      {
-        id: '1',
-        title: 'Schema/Data Display/Sprint Planning',
-        start: new Date(new Date().getFullYear(), new Date().getMonth(), 1, 9, 0),
-        end: new Date(new Date().getFullYear(), new Date().getMonth(), 1, 10, 30),
-        color: '#8b5cf6'
-      },
-      {
-        id: '2',
-        title: 'Schema/Data Display/Code Review',
-        start: new Date(new Date().getFullYear(), new Date().getMonth(), 5, 15, 0),
-        end: new Date(new Date().getFullYear(), new Date().getMonth(), 5, 16, 0),
-        color: '#3b82f6'
-      },
-      {
-        id: '3',
-        title: 'Schema/Data Display/Team Building',
-        start: new Date(new Date().getFullYear(), new Date().getMonth(), 10),
-        end: new Date(new Date().getFullYear(), new Date().getMonth(), 10),
-        allDay: true,
-        color: '#f59e0b'
-      }
-    ],
-    className: 'h-[600px]'
-  } as any,
-};

package/src/stories-json/card.stories.tsx

@@ -1,48 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Primitives/Data Display/Card',
-  component: SchemaRenderer,
-  parameters: {
-    layout: 'padded',
-  },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } },
-    children: { control: "object" }
-  },
-} satisfies Meta<any>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const renderStory = (args: any) => <SchemaRenderer schema={args as unknown as BaseSchema} />;
-
-export const Card: Story = {
-  render: renderStory,
-  args: {
-    type: 'card',
-    className: "w-[350px]",
-    // Using high-level props supported by CardRenderer
-    title: 'Schema/Layout/Create Project',
-    description: "Deploy your new project in one-click.",
-    // Main content (wrapped in CardContent by renderer)
-    children: [
-        { 
-            type: 'div', 
-            className: 'flex flex-col space-y-1.5',
-            children: [
-                { type: 'label', content: 'Name', props: { htmlFor: 'name' } },
-                { type: 'input', props: { id: 'name', placeholder: 'Name of your project' } }
-            ]
-        }
-    ],
-    // Footer content
-    footer: [
-        { type: 'button', props: { variant: 'outline' }, children: [{type:'text', content: 'Cancel'}] },
-        { type: 'button', children: [{type: 'text', content: 'Deploy'}] }
-    ]
-  } as any,
-};

package/src/stories-json/carousel.stories.tsx

@@ -1,33 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Primitives/Data Display/Carousel',
-  component: SchemaRenderer,
-  parameters: { layout: 'centered' },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } }
-  }
-} satisfies Meta<typeof SchemaRenderer>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const renderStory = (args: any) => <SchemaRenderer schema={args as unknown as BaseSchema} />;
-
-export const Default: Story = {
-  render: renderStory,
-  args: {
-    type: 'carousel',
-    className: 'w-full max-w-xs',
-    items: [
-        { type: 'card', className: 'p-6 flex aspect-square items-center justify-center', children: [{type:'text', className:'text-4xl font-semibold', content: '1'}] },
-        { type: 'card', className: 'p-6 flex aspect-square items-center justify-center', children: [{type:'text', className:'text-4xl font-semibold', content: '2'}] },
-        { type: 'card', className: 'p-6 flex aspect-square items-center justify-center', children: [{type:'text', className:'text-4xl font-semibold', content: '3'}] },
-        { type: 'card', className: 'p-6 flex aspect-square items-center justify-center', children: [{type:'text', className:'text-4xl font-semibold', content: '4'}] },
-        { type: 'card', className: 'p-6 flex aspect-square items-center justify-center', children: [{type:'text', className:'text-4xl font-semibold', content: '5'}] }
-    ]
-  } as any,
-};