@object-ui/components 3.3.0 → 3.3.1

package/src/stories-json/object-view.stories.tsx

@@ -1,118 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer, SchemaRendererProvider } from '@object-ui/react';
-import type { BaseSchema } from '@object-ui/types';
-import { createStorybookDataSource } from '@storybook-config/datasource';
-
-const meta = {
-  title: 'Plugins/Data Views/Object View',
-  component: SchemaRenderer,
-  parameters: {
-    layout: 'padded',
-  },
-  tags: ['autodocs'],
-  argTypes: {
-    schema: { table: { disable: true } },
-  },
-} satisfies Meta<any>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-// Create a DataSource instance that connects to MSW
-const dataSource = createStorybookDataSource();
-
-const renderStory = (args: any) => (
-  <SchemaRendererProvider dataSource={dataSource}>
-    <SchemaRenderer schema={args as unknown as BaseSchema} />
-  </SchemaRendererProvider>
-);
-
-export const UserProfile: Story = {
-  render: renderStory,
-  args: {
-    type: 'object-view',
-    objectName: 'User',
-    layout: 'card',
-    data: {
-      id: 1,
-      name: 'John Doe',
-      email: 'john.doe@example.com',
-      role: 'Administrator',
-      status: 'Active',
-      joinedDate: '2023-01-15',
-      department: 'Engineering'
-    },
-    fields: [
-      { name: 'id', label: 'User ID', type: 'text' },
-      { name: 'name', label: 'Full Name', type: 'text' },
-      { name: 'email', label: 'Email Address', type: 'email' },
-      { name: 'role', label: 'Role', type: 'text' },
-      { name: 'status', label: 'Status', type: 'badge' },
-      { name: 'joinedDate', label: 'Joined Date', type: 'date' },
-      { name: 'department', label: 'Department', type: 'text' }
-    ],
-    className: 'w-full max-w-2xl'
-  } as any,
-};
-
-export const ProductDetails: Story = {
-  render: renderStory,
-  args: {
-    type: 'object-view',
-    objectName: 'Product',
-    layout: 'table',
-    data: {
-      sku: 'PROD-12345',
-      name: 'Professional Laptop',
-      category: 'Electronics',
-      brand: 'TechCorp',
-      price: 1299.99,
-      stock: 45,
-      description: 'High-performance laptop for professionals',
-      rating: 4.5,
-      reviews: 128
-    },
-    fields: [
-      { name: 'sku', label: 'SKU', type: 'text' },
-      { name: 'name', label: 'Product Name', type: 'text' },
-      { name: 'category', label: 'Category', type: 'text' },
-      { name: 'brand', label: 'Brand', type: 'text' },
-      { name: 'price', label: 'Price', type: 'currency' },
-      { name: 'stock', label: 'In Stock', type: 'number' },
-      { name: 'description', label: 'Description', type: 'textarea' },
-      { name: 'rating', label: 'Rating', type: 'number' },
-      { name: 'reviews', label: 'Reviews', type: 'number' }
-    ],
-    className: 'w-full max-w-3xl'
-  } as any,
-};
-
-export const OrderSummary: Story = {
-  render: renderStory,
-  args: {
-    type: 'object-view',
-    objectName: 'Order',
-    layout: 'card',
-    data: {
-      orderId: 'ORD-98765',
-      customer: 'Alice Johnson',
-      orderDate: '2024-01-20',
-      total: 456.78,
-      status: 'Processing',
-      shippingAddress: '456 Oak Street, San Francisco, CA 94102',
-      items: 3,
-      trackingNumber: 'TRK123456789'
-    },
-    fields: [
-      { name: 'orderId', label: 'Order ID', type: 'text' },
-      { name: 'customer', label: 'Customer Name', type: 'text' },
-      { name: 'orderDate', label: 'Order Date', type: 'date' },
-      { name: 'total', label: 'Total Amount', type: 'currency' },
-      { name: 'status', label: 'Status', type: 'badge' },
-      { name: 'shippingAddress', label: 'Shipping Address', type: 'textarea' },
-      { name: 'items', label: 'Number of Items', type: 'number' },
-      { name: 'trackingNumber', label: 'Tracking Number', type: 'text' }
-    ],
-    className: 'w-full max-w-2xl'
-  } as any,
-};

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

@@ -1,113 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-
-const meta: Meta = {
-  title: 'Primitives/Overlay/Extras',
-  component: SchemaRenderer,
-  tags: ['autodocs'],
-  argTypes: {
-    // Schema properties
-  }
-};
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const AlertDialogExample: Story = {
-  args: {
-    type: 'alert-dialog',
-    title: 'Schema/Feedback/Delete Account',
-    description: 'Are you sure you want to delete your account? This action cannot be undone.',
-    actionText: 'Yes, Delete',
-    cancelText: 'Cancel',
-    trigger: [
-        { type: 'button', content: 'Delete Account', variant: 'destructive' }
-    ]
-  },
-  render: (args) => <SchemaRenderer schema={args} />
-};
-
-export const ContextMenuExample: Story = {
-  args: {
-    type: 'context-menu',
-    triggerClassName: 'flex h-[150px] w-full items-center justify-center rounded-md border border-dashed text-sm',
-    trigger: [
-        { type: 'text', content: 'Right click here' }
-    ],
-    items: [
-        { label: 'Back', shortcut: '⌘[' },
-        { label: 'Forward', shortcut: '⌘]', disabled: true },
-        { label: 'Reload', shortcut: '⌘R' },
-        { type: 'separator' },
-        { label: 'Save As...', shortcut: '⇧⌘S' },
-        { label: 'Print...', shortcut: '⌘P' }
-    ]
-  },
-  render: (args) => <SchemaRenderer schema={args} />
-};
-
-export const DrawerExample: Story = {
-    args: {
-      type: 'drawer',
-      title: 'Schema/Feedback/Monthly Goal',
-      description: 'Set your daily activity goal.',
-      trigger: [
-          { type: 'button', content: 'Open Drawer', variant: 'outline' }
-      ],
-      content: [
-          { 
-              type: 'div', 
-              className: 'p-4 pb-0 items-center justify-center flex',
-              children: [
-                  { 
-                      type: 'div', 
-                      className: 'text-4xl font-bold p-10',
-                      children: [{ type: 'text', content: '400/500' }] 
-                  }
-              ] 
-          }
-      ],
-      footer: [
-          { type: 'button', content: 'Submit', className: 'w-full' },
-          { type: 'button', content: 'Cancel', variant: 'outline', className: 'w-full' }
-      ]
-    },
-    render: (args) => <SchemaRenderer schema={args} />
-  };
-
-export const MenubarExample: Story = {
-    args: {
-      type: 'menubar',
-      menus: [
-          {
-              label: 'File',
-              items: [
-                  { label: 'New Tab', shortcut: '⌘T' },
-                  { label: 'New Window', shortcut: '⌘N' },
-                  { separator: true },
-                  { label: 'Share', children: [
-                      { label: 'Email link' },
-                      { label: 'Messages' }
-                  ]},
-                  { separator: true },
-                  { label: 'Print' }
-              ]
-          },
-          {
-              label: 'Edit',
-              items: [
-                  { label: 'Undo', shortcut: '⌘Z' },
-                  { label: 'Redo', shortcut: '⇧⌘Z' }
-              ]
-          },
-          {
-              label: 'View',
-              items: [
-                  { label: 'Always Show Bookmarks Bar' },
-                  { label: 'Always Show Full URLs' }
-              ]
-          }
-      ]
-    },
-    render: (args) => <SchemaRenderer schema={args} />
-  };

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

@@ -1,76 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Primitives/Overlay/Others',
-  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 Tooltip: Story = {
-  render: renderStory,
-  args: {
-    type: 'tooltip',
-    content: 'Add to library',
-    trigger: [
-        { type: 'button', props: { variant: 'outline' }, children: [{type:'text', content: 'Hover Me'}] }
-    ]
-  } as any,
-};
-
-export const Popover: Story = {
-  render: renderStory,
-  args: {
-    type: 'popover',
-    trigger: [
-        { type: 'button', props: { variant: 'outline' }, children: [{type: 'text', content: 'Open Popover'}] }
-    ],
-    content: [
-         { type: 'div', className: 'grid gap-4', children: [
-             { type: 'div', className: 'space-y-2', children: [
-                 { type: 'html', tag: 'h4', className: 'font-medium leading-none', content: 'Dimensions' },
-                 { type: 'text', content: 'Set the dimensions for the layer.', className: 'text-sm text-muted-foreground' }
-             ]},
-             { type: 'div', className: 'grid gap-2', children: [
-                 { type: 'input', label: 'Width', defaultValue: '100%' },
-                 { type: 'input', label: 'Max. width', defaultValue: '300px' },
-                 { type: 'input', label: 'Height', defaultValue: '25px' },
-                 { type: 'input', label: 'Max. height', defaultValue: 'none' },
-             ]}
-         ]}
-    ]
-  } as any,
-};
-
-export const HoverCard: Story = {
-    render: renderStory,
-    args: {
-      type: 'hover-card',
-      trigger: [
-          { type: 'button', props: { variant: 'link' }, children: [{ type: 'text', content: '@nextjs'}] }
-      ],
-      content: [
-          { type: 'div', className: 'flex justify-between space-x-4', children: [
-              { type: 'avatar', src: 'https://github.com/vercel.png', fallback: 'VC' },
-              { type: 'div', className: 'space-y-1', children: [
-                  { type: 'html', tag: 'h4', className: 'text-sm font-semibold', content: '@nextjs' },
-                  { type: 'text', content: 'The React Framework – created and maintained by @vercel.', className: 'text-sm' },
-                  { type: 'div', className: 'flex items-center pt-2', children: [
-                      { type: 'icon', name: 'calendar', className: 'mr-2 h-4 w-4 opacity-70' },
-                      { type: 'text', content: 'Joined December 2021', className: 'text-xs text-muted-foreground' }
-                  ]}
-              ]}
-          ]}
-      ]
-    } as any,
-  };

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

@@ -1,55 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer, SchemaRendererProvider } from '@object-ui/react';
-
-const meta: Meta = {
-  title: 'Templates/Page',
-  component: SchemaRenderer,
-  parameters: { layout: 'fullscreen' },
-  tags: ['autodocs'],
-  argTypes: {
-    // Schema properties
-  }
-};
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Page: Story = {
-  args: {
-    type: 'page',
-    title: 'Schema/Layout/Dashboard',
-    description: 'Overview of your project analysis.',
-    children: [
-        { 
-            type: 'grid', 
-            cols: { base: 1, md: 3 }, 
-            gap: 4,
-            children: [
-                { type: 'statistic', label: 'Total Revenue', value: '$45,231.89', trend: 'up', description: '+20.1% from last month' },
-                { type: 'statistic', label: 'Subscriptions', value: '+2350', trend: 'up', description: '+180.1% from last month' },
-                { type: 'statistic', label: 'Sales', value: '+12,234', trend: 'down', description: '-19% from last month' }
-            ]
-        },
-        { type: 'separator', className: 'my-6' },
-        { 
-             type: 'data-table',
-             caption: 'Recent Transactions',
-             columns: [
-                 { header: 'ID', accessorKey: 'id', width: '80px' },
-                 { header: 'Amount', accessorKey: 'amount' },
-                 { header: 'Status', accessorKey: 'status' }
-             ],
-             data: [
-                 { id: 1, amount: '$350.00', status: 'Paid' },
-                 { id: 2, amount: '$120.50', status: 'Processing' },
-                 { id: 3, amount: '$850.00', status: 'Paid' }
-             ]
-        }
-    ]
-  },
-  render: (args) => (
-    <SchemaRendererProvider dataSource={{}}>
-      <SchemaRenderer schema={args} />
-    </SchemaRendererProvider>
-  )
-};

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

@@ -1,163 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Templates/Reports',
-  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 ReportViewer: Story = {
-  render: renderStory,
-  args: {
-    type: 'report-viewer',
-    report: {
-      type: 'report',
-      title: 'Quarterly Sales Report',
-      description: 'Sales performance analysis for Q1 2024',
-      fields: [
-        { name: 'region', label: 'Region', type: 'string' },
-        { name: 'revenue', label: 'Revenue', type: 'number', aggregation: 'sum', showInSummary: true },
-        { name: 'units', label: 'Units Sold', type: 'number', aggregation: 'sum', showInSummary: true }
-      ],
-      sections: [
-        {
-          type: 'header',
-          title: 'Executive Summary'
-        },
-        {
-          type: 'summary',
-          title: 'Key Metrics'
-        },
-        {
-          type: 'chart',
-          title: 'Revenue by Region',
-          chart: {
-            type: 'chart',
-            chartType: 'bar',
-            data: [
-              { region: 'North', revenue: 45000 },
-              { region: 'South', revenue: 32000 },
-              { region: 'East', revenue: 38000 },
-              { region: 'West', revenue: 41000 },
-            ],
-            xAxisKey: 'region',
-            series: [{ dataKey: 'revenue' }],
-            config: {
-              revenue: { label: 'Revenue', color: '#3b82f6' }
-            }
-          }
-        },
-        {
-          type: 'table',
-          title: 'Detailed Breakdown',
-          columns: [
-            { name: 'region', label: 'Region' },
-            { name: 'revenue', label: 'Revenue' },
-            { name: 'units', label: 'Units Sold' }
-          ]
-        }
-      ],
-      showExportButtons: true
-    },
-    data: [
-      { region: 'North', revenue: 45000, units: 1200 },
-      { region: 'South', revenue: 32000, units: 850 },
-      { region: 'East', revenue: 38000, units: 1050 },
-      { region: 'West', revenue: 41000, units: 1100 },
-    ],
-    showToolbar: true,
-    allowExport: true,
-    allowPrint: true
-  } as any,
-};
-
-export const ReportViewerMinimal: Story = {
-  render: renderStory,
-  args: {
-    type: 'report-viewer',
-    report: {
-      type: 'report',
-      title: 'Simple Report',
-      description: 'Basic report without sections',
-      fields: [
-        { name: 'product', label: 'Product' },
-        { name: 'sales', label: 'Sales' },
-      ],
-    },
-    data: [
-      { product: 'Widget A', sales: 1200 },
-      { product: 'Widget B', sales: 850 },
-      { product: 'Widget C', sales: 1450 },
-    ],
-    showToolbar: false,
-  } as any,
-};
-
-export const ReportBuilder: Story = {
-  render: renderStory,
-  args: {
-    type: 'report-builder',
-    availableFields: [
-      { name: 'revenue', label: 'Revenue', type: 'number' },
-      { name: 'units', label: 'Units Sold', type: 'number' },
-      { name: 'region', label: 'Region', type: 'string' },
-      { name: 'product', label: 'Product', type: 'string' },
-      { name: 'date', label: 'Date', type: 'date' },
-      { name: 'customer', label: 'Customer', type: 'string' }
-    ],
-    showPreview: true,
-    onSave: 'handleSaveReport',
-    onCancel: 'handleCancel'
-  } as any,
-};
-
-export const ReportBuilderWithInitialConfig: Story = {
-  render: renderStory,
-  args: {
-    type: 'report-builder',
-    report: {
-      type: 'report',
-      title: 'Monthly Sales Report',
-      description: 'Sales performance tracking by region',
-      fields: [
-        { name: 'revenue', label: 'Revenue', type: 'number', aggregation: 'sum', showInSummary: true },
-        { name: 'units', label: 'Units Sold', type: 'number', aggregation: 'count', showInSummary: true },
-        { name: 'region', label: 'Region', type: 'string' }
-      ],
-      filters: [
-        { field: 'date', operator: 'greater_than', value: '2024-01-01' }
-      ],
-      groupBy: [
-        { field: 'region', sort: 'asc' }
-      ],
-      sections: [
-        { type: 'header', title: 'Executive Summary' },
-        { type: 'summary', title: 'Key Metrics' },
-        { type: 'table', title: 'Detailed Data' }
-      ],
-      showExportButtons: true,
-      defaultExportFormat: 'pdf'
-    },
-    availableFields: [
-      { name: 'revenue', label: 'Revenue', type: 'number' },
-      { name: 'units', label: 'Units Sold', type: 'number' },
-      { name: 'region', label: 'Region', type: 'string' },
-      { name: 'product', label: 'Product', type: 'string' },
-      { name: 'date', label: 'Date', type: 'date' }
-    ],
-    showPreview: true,
-  } as any,
-};

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

@@ -1,44 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { SchemaRenderer } from '../SchemaRenderer';
-import type { BaseSchema } from '@object-ui/types';
-
-const meta = {
-  title: 'Primitives/Layout/Resizable',
-  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 Resizable: Story = {
-  render: renderStory,
-  args: {
-    type: 'resizable',
-    className: 'max-w-md rounded-lg border',
-    minHeight: '200px',
-    panels: [
-        { 
-            defaultSize: 50, 
-            content: [
-                { type: 'div', className: 'flex h-full items-center justify-center p-6', children: [{type:'text', className:'font-semibold', content:'One'}] }
-            ] 
-        },
-        { 
-            defaultSize: 50, 
-            content: [
-                 { type: 'resizable', direction: 'vertical', children: [], panels: [
-                     { defaultSize: 25, content: [{ type: 'div', className: 'flex h-full items-center justify-center p-6', children: [{type:'text', className:'font-semibold', content:'Two'}] }] },
-                     { defaultSize: 75, content: [{ type: 'div', className: 'flex h-full items-center justify-center p-6', children: [{type:'text', className:'font-semibold', content:'Three'}] }] }
-                 ] }
-            ] 
-        }
-    ]
-  } as any,
-};

package/src/stories-json/select.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 Entry/Select',
-  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 Select: Story = {
-  render: renderStory,
-  args: {
-    type: 'select',
-    label: 'Framework',
-    placeholder: 'Select a framework',
-    wrapperClass: 'w-[280px]',
-    options: [
-        { label: 'Next.js', value: 'next' },
-        { label: 'SvelteKit', value: 'svelte' },
-        { label: 'Astro', value: 'astro' },
-        { label: 'Nuxt', value: 'nuxt' }
-    ]
-  } as any,
-};

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

@@ -1,41 +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/Separator',
-  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 Separator: Story = {
-  render: renderStory,
-  args: {
-    type: 'div',
-    className: 'text-sm font-medium',
-    children: [
-        { type: 'text', content: 'Radix Primitives' },
-        { type: 'separator', className: 'my-4' },
-        { 
-            type: 'div', 
-            className: 'flex h-5 items-center space-x-4 text-sm',
-            children: [
-                { type: 'text', content: 'Blog' },
-                { type: 'separator', orientation: 'vertical' },
-                { type: 'text', content: 'Docs' },
-                { type: 'separator', orientation: 'vertical' },
-                { type: 'text', content: 'Source' }
-            ]
-        }
-    ]
-  } as any,
-};