nitrostack 1.0.55 → 1.0.56

package/templates/typescript-auth/src/widgets/app/categories/page.tsx

@@ -1,134 +0,0 @@
-'use client';
-
-import { withToolData } from 'nitrostack/widgets';
-import * as styles from '../../styles/ecommerce';
-
-interface Category {
-  name: string;
-  productCount: number;
-}
-
-interface CategoriesData {
-  categories: Category[];
-}
-
-const categoryIcons: Record<string, string> = {
-  'Beauty': '💄',
-  'Fragrances': '🌸',
-  'Furniture': '🛋️',
-  'Groceries': '🛒',
-  'Home Decoration': '🏠',
-  'Kitchen Accessories': '🍳',
-  'Laptops': '💻',
-  'Mens Shirts': '👔',
-  'Mens Shoes': '👞',
-  'Mens Watches': '⌚',
-  'Mobile Accessories': '📱',
-  'Motorcycle': '🏍️',
-  'Skin Care': '✨',
-  'Smartphones': '📱',
-  'Sports Accessories': '⚽',
-  'Sunglasses': '🕶️',
-  'Tablets': '📱',
-  'Tops': '👕',
-  'Vehicle': '🚗',
-  'Womens Bags': '👜',
-  'Womens Dresses': '👗',
-  'Womens Jewellery': '💎',
-  'Womens Shoes': '👠',
-  'Womens Watches': '⌚'
-};
-
-function CategoriesWidget({ data }: { data: CategoriesData }) {
-  const { categories } = data;
-
-  if (!categories || categories.length === 0) {
-    return (
-      <div style={styles.containerStyle}>
-        <div style={styles.emptyStateStyle}>
-          <div style={{ fontSize: '64px', marginBottom: styles.spacing.lg }}>
-            🏷️
-          </div>
-          <h3 style={{
-            fontSize: styles.typography.fontSize.xl,
-            fontWeight: styles.typography.fontWeight.semibold,
-            color: styles.colors.gray[700],
-            marginBottom: styles.spacing.sm,
-          }}>
-            No categories available
-          </h3>
-          <p style={styles.metaTextStyle}>
-            Categories will appear here once they're added
-          </p>
-        </div>
-      </div>
-    );
-  }
-
-  return (
-    <div style={styles.containerStyle}>
-      <div style={{
-        ...styles.titleStyle,
-        marginBottom: styles.spacing.xl,
-      }}>
-        <span>🏷️ Product Categories</span>
-      </div>
-
-      <div style={{
-        display: 'grid',
-        gridTemplateColumns: 'repeat(auto-fill, minmax(200px, 1fr))',
-        gap: styles.spacing.lg,
-      }}>
-        {categories.map((category) => {
-          const icon = categoryIcons[category.name] || '📦';
-          return (
-            <div
-              key={category.name}
-              style={{
-                ...styles.cardStyle,
-                cursor: 'pointer',
-                textAlign: 'center',
-                padding: styles.spacing.xl,
-              }}
-              onMouseEnter={(e) => {
-                e.currentTarget.style.transform = 'translateY(-4px)';
-                e.currentTarget.style.boxShadow = styles.shadows.xl;
-                e.currentTarget.style.borderColor = styles.colors.primary;
-              }}
-              onMouseLeave={(e) => {
-                e.currentTarget.style.transform = 'translateY(0)';
-                e.currentTarget.style.boxShadow = styles.shadows.md;
-                e.currentTarget.style.borderColor = styles.colors.gray[200];
-              }}
-            >
-              <div style={{
-                fontSize: '48px',
-                marginBottom: styles.spacing.md,
-              }}>
-                {icon}
-              </div>
-              <div style={{
-                fontSize: styles.typography.fontSize.lg,
-                fontWeight: styles.typography.fontWeight.bold,
-                color: styles.colors.gray[900],
-                marginBottom: styles.spacing.xs,
-              }}>
-                {category.name}
-              </div>
-              <div style={{
-                ...styles.badgeStyle,
-                background: `${styles.colors.primary}15`,
-                color: styles.colors.gray[700],
-                border: `1px solid ${styles.colors.primary}30`,
-              }}>
-                {category.productCount} products
-              </div>
-            </div>
-          );
-        })}
-      </div>
-    </div>
-  );
-}
-
-export default withToolData<CategoriesData>(CategoriesWidget);

package/templates/typescript-auth/src/widgets/app/layout.tsx

@@ -1,21 +0,0 @@
-import type { Metadata } from 'next';
-
-export const metadata: Metadata = {
-  title: 'E-commerce Widgets',
-  description: 'UI components for e-commerce MCP server',
-};
-
-export default function RootLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
-  return (
-    <html lang="en">
-      <body style={{ margin: 0, padding: 0 }}>
-        {children}
-      </body>
-    </html>
-  );
-}
-

package/templates/typescript-auth/src/widgets/app/login-result/page.tsx

@@ -1,129 +0,0 @@
-'use client';
-
-import { withToolData } from 'nitrostack/widgets';
-import { LoginResult } from '../../types/tool-data';
-import * as styles from '../../styles/ecommerce';
-
-function LoginResultWidget({ data }: { data: LoginResult }) {
-  const { user, token, message } = data;
-
-  return (
-    <div style={styles.containerStyle}>
-      <div style={{
-        ...styles.cardStyle,
-        maxWidth: '500px',
-        margin: '0 auto',
-      }}>
-        <div style={{
-          textAlign: 'center',
-          marginBottom: styles.spacing['2xl'],
-        }}>
-          <div style={{
-            width: '80px',
-            height: '80px',
-            margin: '0 auto 16px',
-            borderRadius: styles.borderRadius.full,
-            background: `linear-gradient(135deg, ${styles.colors.primary} 0%, ${styles.colors.primaryHover} 100%)`,
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            fontSize: '36px',
-          }}>
-            ✓
-          </div>
-          <h2 style={{
-            fontSize: styles.typography.fontSize['2xl'],
-            fontWeight: styles.typography.fontWeight.bold,
-            color: styles.colors.gray[900],
-            marginBottom: styles.spacing.sm,
-          }}>
-            Welcome Back!
-          </h2>
-          <p style={{
-            fontSize: styles.typography.fontSize.base,
-            color: styles.colors.gray[600],
-          }}>
-            {message}
-          </p>
-        </div>
-
-        <div style={{
-          background: styles.colors.gray[50],
-          borderRadius: styles.borderRadius.md,
-          padding: styles.spacing.lg,
-          marginBottom: styles.spacing.lg,
-        }}>
-          <div style={{
-            display: 'flex',
-            alignItems: 'center',
-            gap: styles.spacing.md,
-            marginBottom: styles.spacing.md,
-          }}>
-            {user.profile_picture && (
-              <img
-                src={user.profile_picture}
-                alt={user.name}
-                style={{
-                  width: '60px',
-                  height: '60px',
-                  borderRadius: styles.borderRadius.full,
-                  objectFit: 'cover',
-                  border: `3px solid ${styles.colors.primary}`,
-                }}
-              />
-            )}
-            <div>
-              <div style={{
-                fontSize: styles.typography.fontSize.lg,
-                fontWeight: styles.typography.fontWeight.semibold,
-                color: styles.colors.gray[900],
-              }}>
-                {user.name}
-              </div>
-              <div style={styles.metaTextStyle}>
-                {user.email}
-              </div>
-            </div>
-          </div>
-        </div>
-
-        <div style={{
-          background: styles.colors.gray[900],
-          borderRadius: styles.borderRadius.md,
-          padding: styles.spacing.md,
-        }}>
-          <div style={{
-            fontSize: styles.typography.fontSize.xs,
-            color: styles.colors.gray[400],
-            marginBottom: styles.spacing.xs,
-          }}>
-            Authentication Token
-          </div>
-          <div style={{
-            fontSize: styles.typography.fontSize.xs,
-            fontFamily: 'monospace',
-            color: styles.colors.primary,
-            wordBreak: 'break-all',
-            lineHeight: styles.typography.lineHeight.relaxed,
-          }}>
-            {token.substring(0, 50)}...
-          </div>
-        </div>
-
-        <div style={{
-          marginTop: styles.spacing.lg,
-          padding: styles.spacing.md,
-          background: `rgba(${parseInt(styles.colors.primary.slice(1, 3), 16)}, ${parseInt(styles.colors.primary.slice(3, 5), 16)}, ${parseInt(styles.colors.primary.slice(5, 7), 16)}, 0.1)`,
-          borderRadius: styles.borderRadius.md,
-          fontSize: styles.typography.fontSize.sm,
-          color: styles.colors.gray[700],
-          textAlign: 'center',
-        }}>
-          🔒 Token stored securely in local storage
-        </div>
-      </div>
-    </div>
-  );
-}
-
-export default withToolData<LoginResult>(LoginResultWidget);

package/templates/typescript-auth/src/widgets/app/order-confirmation/page.tsx

@@ -1,231 +0,0 @@
-'use client';
-
-import { withToolData } from 'nitrostack/widgets';
-import { OrderConfirmationData } from '../../types/tool-data';
-import * as styles from '../../styles/ecommerce';
-
-function OrderConfirmationWidget({ data }: { data: OrderConfirmationData }) {
-  // Handle missing or undefined data
-  if (!data) {
-    return (
-      <div style={styles.containerStyle}>
-        <div style={styles.cardStyle}>
-          <p style={{ color: styles.colors.error }}>No order data available</p>
-        </div>
-      </div>
-    );
-  }
-
-  const { order, message } = data;
-
-  // Handle missing order
-  if (!order || !order.id) {
-    return (
-      <div style={styles.containerStyle}>
-        <div style={styles.cardStyle}>
-          <p style={{ color: styles.colors.error }}>Order data incomplete</p>
-          <pre style={{ fontSize: '12px', marginTop: '10px' }}>
-            {JSON.stringify(data, null, 2)}
-          </pre>
-        </div>
-      </div>
-    );
-  }
-
-  return (
-    <div style={styles.containerStyle}>
-      <div style={{
-        ...styles.cardStyle,
-        maxWidth: '700px',
-        margin: '0 auto',
-      }}>
-        <div style={{
-          textAlign: 'center',
-          marginBottom: styles.spacing['2xl'],
-        }}>
-          <div style={{
-            width: '80px',
-            height: '80px',
-            margin: '0 auto 16px',
-            borderRadius: styles.borderRadius.full,
-            background: styles.colors.success,
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            fontSize: '40px',
-          }}>
-            ✓
-          </div>
-          <h2 style={{
-            fontSize: styles.typography.fontSize['2xl'],
-            fontWeight: styles.typography.fontWeight.bold,
-            color: styles.colors.gray[900],
-            marginBottom: styles.spacing.sm,
-          }}>
-            Order Confirmed!
-          </h2>
-          <p style={{
-            fontSize: styles.typography.fontSize.base,
-            color: styles.colors.gray[600],
-          }}>
-            {message}
-          </p>
-        </div>
-
-        <div style={{
-          background: styles.colors.gray[50],
-          borderRadius: styles.borderRadius.md,
-          padding: styles.spacing.lg,
-          marginBottom: styles.spacing.lg,
-        }}>
-          <div style={{
-            display: 'grid',
-            gridTemplateColumns: '1fr 1fr',
-            gap: styles.spacing.lg,
-          }}>
-            <div>
-              <div style={{
-                fontSize: styles.typography.fontSize.xs,
-                color: styles.colors.gray[500],
-                marginBottom: styles.spacing.xs,
-                textTransform: 'uppercase',
-                letterSpacing: '0.5px',
-              }}>
-                Order ID
-              </div>
-              <div style={{
-                fontSize: styles.typography.fontSize.base,
-                fontWeight: styles.typography.fontWeight.semibold,
-                color: styles.colors.gray[900],
-                fontFamily: 'monospace',
-              }}>
-                #{order.id.substring(0, 8).toUpperCase()}
-              </div>
-            </div>
-            <div>
-              <div style={{
-                fontSize: styles.typography.fontSize.xs,
-                color: styles.colors.gray[500],
-                marginBottom: styles.spacing.xs,
-                textTransform: 'uppercase',
-                letterSpacing: '0.5px',
-              }}>
-                Status
-              </div>
-              <div style={{
-                ...styles.badgeStyle,
-                background: styles.colors.primary,
-                color: styles.colors.black,
-              }}>
-                {order.status}
-              </div>
-            </div>
-          </div>
-        </div>
-
-        <div style={{ marginBottom: styles.spacing.lg }}>
-          <h3 style={{
-            fontSize: styles.typography.fontSize.lg,
-            fontWeight: styles.typography.fontWeight.semibold,
-            color: styles.colors.gray[900],
-            marginBottom: styles.spacing.md,
-          }}>
-            Order Items
-          </h3>
-
-          <div style={{
-            display: 'flex',
-            flexDirection: 'column',
-            gap: styles.spacing.md,
-          }}>
-            {order.items.map((item) => (
-              <div
-                key={item.id}
-                style={{
-                  display: 'flex',
-                  gap: styles.spacing.md,
-                  padding: styles.spacing.md,
-                  background: styles.colors.white,
-                  borderRadius: styles.borderRadius.md,
-                  border: `1px solid ${styles.colors.gray[200]}`,
-                }}
-              >
-                {item.image_url && (
-                  <div style={{
-                    width: '60px',
-                    height: '60px',
-                    flexShrink: 0,
-                    borderRadius: styles.borderRadius.md,
-                    overflow: 'hidden',
-                    background: styles.colors.gray[100],
-                  }}>
-                    <img
-                      src={item.image_url}
-                      alt={item.name}
-                      style={{
-                        width: '100%',
-                        height: '100%',
-                        objectFit: 'cover',
-                      }}
-                    />
-                  </div>
-                )}
-
-                <div style={{ flex: 1 }}>
-                  <div style={{
-                    fontSize: styles.typography.fontSize.base,
-                    fontWeight: styles.typography.fontWeight.medium,
-                    color: styles.colors.gray[900],
-                    marginBottom: styles.spacing.xs,
-                  }}>
-                    {item.name}
-                  </div>
-                  <div style={styles.metaTextStyle}>
-                    Qty: {item.quantity} × ${item.price.toFixed(2)}
-                  </div>
-                </div>
-
-                <div style={{
-                  fontSize: styles.typography.fontSize.lg,
-                  fontWeight: styles.typography.fontWeight.semibold,
-                  color: styles.colors.primary,
-                }}>
-                  ${(item.price * item.quantity).toFixed(2)}
-                </div>
-              </div>
-            ))}
-          </div>
-        </div>
-
-        <div style={{
-          ...styles.cardStyle,
-          background: `linear-gradient(135deg, ${styles.colors.gray[900]} 0%, ${styles.colors.gray[800]} 100%)`,
-          border: `2px solid ${styles.colors.primary}`,
-        }}>
-          <div style={{
-            display: 'flex',
-            justifyContent: 'space-between',
-            alignItems: 'center',
-          }}>
-            <div style={{
-              fontSize: styles.typography.fontSize.lg,
-              color: styles.colors.gray[300],
-              fontWeight: styles.typography.fontWeight.semibold,
-            }}>
-              Total Amount
-            </div>
-            <div style={{
-              fontSize: styles.typography.fontSize['3xl'],
-              fontWeight: styles.typography.fontWeight.bold,
-              color: styles.colors.primary,
-            }}>
-              ${order.total.toFixed(2)}
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-}
-
-export default withToolData<OrderConfirmationData>(OrderConfirmationWidget);