Add layout import and new component aliases

Imported '@object-ui/layout' in Storybook preview for layout support. Registered 'chart:bar' as an alias for CRM App compatibility in plugin-charts, using ChartRenderer with defaultProps. Added and registered a 'view:simple' container component in plugin-view for flexible grid layouts.

Author: hotlong

.storybook/preview.ts

@@ -29,6 +29,7 @@ import '@object-ui/plugin-map';
 import '@object-ui/plugin-markdown';
 import '@object-ui/plugin-timeline';
 import '@object-ui/plugin-view';
+import '@object-ui/layout';
 
 const preview: Preview = {
   loaders: [mswLoader],

packages/plugin-charts/src/index.tsx

@@ -209,3 +209,14 @@ export const chartComponents = {
   'bar-chart': ChartBarRenderer,
   'chart': ChartRenderer,
 };
+
+// Alias for CRM App compatibility
+ComponentRegistry.register(
+  'chart:bar',
+  ChartRenderer, // Use the smart renderer to handle Tremor-like props
+  {
+    label: 'Bar Chart (Alias)',
+    category: 'plugin',
+    defaultProps: { chartType: 'bar' }
+  }
+);

packages/plugin-view/src/index.tsx

@@ -19,3 +19,26 @@ const ObjectViewRenderer: React.FC<{ schema: any }> = ({ schema }) => {
 };
 
 ComponentRegistry.register('object-view', ObjectViewRenderer);
+
+// Simple View Renderer (Container)
+const SimpleViewRenderer: React.FC<any> = ({ schema, className, children, ...props }) => {
+  // If columns prop is present, use grid layout
+  const style = schema.props?.columns 
+    ? { display: 'grid', gridTemplateColumns: `repeat(${schema.props.columns}, 1fr)`, gap: '1rem' }
+    : undefined;
+
+  return (
+    <div 
+      className={className} 
+      style={style}
+      {...props}
+    >
+      {children}
+    </div>
+  );
+};
+
+ComponentRegistry.register('view:simple', SimpleViewRenderer, {
+  label: 'Simple View',
+  category: 'view'
+});