@promakeai/cli 0.1.1 → 0.1.3

package/dist/registry/youtube-embed.json

@@ -0,0 +1,40 @@
+{
+  "name": "youtube-embed",
+  "type": "registry:component",
+  "title": "YouTube Embed",
+  "description": "Responsive YouTube video embed component with customizable options. Supports autoplay, mute, loop, custom start time, and multiple aspect ratios. Includes loading state and error handling.",
+  "registryDependencies": [],
+  "usage": "import { YouTubeEmbed } from '@/modules/youtube-embed';\n\n// Basic usage\n<YouTubeEmbed videoId=\"dQw4w9WgXcQ\" />\n\n// With all options\n<YouTubeEmbed\n  videoId=\"dQw4w9WgXcQ\"\n  title=\"Video Title\"\n  autoplay={false}\n  mute={false}\n  loop={false}\n  controls={true}\n  start={30}\n  aspectRatio=\"16/9\"\n  className=\"rounded-xl shadow-lg\"\n/>",
+  "files": [
+    {
+      "path": "youtube-embed/index.ts",
+      "type": "registry:index",
+      "target": "$modules$/youtube-embed/index.ts",
+      "content": "export * from './youtube-embed';\r\n"
+    },
+    {
+      "path": "youtube-embed/youtube-embed.tsx",
+      "type": "registry:component",
+      "target": "$modules$/youtube-embed/youtube-embed.tsx",
+      "content": "import { useState } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { Play } from \"lucide-react\";\r\n\r\ninterface YouTubeEmbedProps {\r\n  videoId: string;\r\n  title?: string;\r\n  autoplay?: boolean;\r\n  mute?: boolean;\r\n  loop?: boolean;\r\n  controls?: boolean;\r\n  start?: number;\r\n  aspectRatio?: \"16/9\" | \"4/3\" | \"1/1\";\r\n  className?: string;\r\n}\r\n\r\nexport function YouTubeEmbed({\r\n  videoId,\r\n  title,\r\n  autoplay = false,\r\n  mute = false,\r\n  loop = false,\r\n  controls = true,\r\n  start,\r\n  aspectRatio = \"16/9\",\r\n  className,\r\n}: YouTubeEmbedProps) {\r\n  const { t } = useTranslation(\"youtube-embed\");\r\n  const [isLoading, setIsLoading] = useState(true);\r\n  const [hasError, setHasError] = useState(false);\r\n\r\n  // Validate videoId\r\n  const isValidVideoId = /^[a-zA-Z0-9_-]{11}$/.test(videoId);\r\n\r\n  // Build embed URL with parameters\r\n  const buildEmbedUrl = () => {\r\n    const params = new URLSearchParams();\r\n\r\n    if (autoplay) params.set(\"autoplay\", \"1\");\r\n    if (mute) params.set(\"mute\", \"1\");\r\n    if (loop) {\r\n      params.set(\"loop\", \"1\");\r\n      params.set(\"playlist\", videoId);\r\n    }\r\n    if (!controls) params.set(\"controls\", \"0\");\r\n    if (start) params.set(\"start\", start.toString());\r\n\r\n    params.set(\"rel\", \"0\");\r\n\r\n    const queryString = params.toString();\r\n    return `https://www.youtube.com/embed/${videoId}${queryString ? `?${queryString}` : \"\"}`;\r\n  };\r\n\r\n  const handleLoad = () => {\r\n    setIsLoading(false);\r\n  };\r\n\r\n  const handleError = () => {\r\n    setIsLoading(false);\r\n    setHasError(true);\r\n  };\r\n\r\n  // Invalid videoId\r\n  if (!isValidVideoId) {\r\n    return (\r\n      <div\r\n        className={cn(\r\n          \"flex flex-col items-center justify-center bg-muted rounded-lg border\",\r\n          className\r\n        )}\r\n        style={{ aspectRatio }}\r\n      >\r\n        <Play className=\"h-12 w-12 text-muted-foreground mb-3\" />\r\n        <p className=\"text-sm text-muted-foreground\">\r\n          {t(\"invalidId\", \"Invalid video ID\")}\r\n        </p>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  // Error state\r\n  if (hasError) {\r\n    return (\r\n      <div\r\n        className={cn(\r\n          \"flex flex-col items-center justify-center bg-muted rounded-lg border\",\r\n          className\r\n        )}\r\n        style={{ aspectRatio }}\r\n      >\r\n        <Play className=\"h-12 w-12 text-muted-foreground mb-3\" />\r\n        <p className=\"text-sm text-muted-foreground\">\r\n          {t(\"error\", \"Failed to load video\")}\r\n        </p>\r\n        <a\r\n          href={`https://www.youtube.com/watch?v=${videoId}`}\r\n          target=\"_blank\"\r\n          rel=\"noopener noreferrer\"\r\n          className=\"text-sm text-primary hover:underline mt-2\"\r\n        >\r\n          {t(\"watchOnYouTube\", \"Watch on YouTube\")}\r\n        </a>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <div\r\n      className={cn(\"relative rounded-lg overflow-hidden\", className)}\r\n      style={{ aspectRatio }}\r\n    >\r\n      {isLoading && (\r\n        <div className=\"absolute inset-0 flex items-center justify-center bg-muted\">\r\n          <div className=\"flex flex-col items-center gap-3\">\r\n            <div className=\"h-8 w-8 animate-spin rounded-full border-4 border-primary border-t-transparent\" />\r\n            <span className=\"text-sm text-muted-foreground\">\r\n              {t(\"loading\", \"Loading video...\")}\r\n            </span>\r\n          </div>\r\n        </div>\r\n      )}\r\n      <iframe\r\n        src={buildEmbedUrl()}\r\n        width=\"100%\"\r\n        height=\"100%\"\r\n        style={{ border: 0 }}\r\n        allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\"\r\n        allowFullScreen\r\n        loading=\"lazy\"\r\n        title={title || t(\"defaultTitle\", \"YouTube video player\")}\r\n        onLoad={handleLoad}\r\n        onError={handleError}\r\n        className={cn(\"absolute inset-0\", isLoading && \"invisible\")}\r\n      />\r\n    </div>\r\n  );\r\n}\r\n"
+    },
+    {
+      "path": "youtube-embed/lang/en.json",
+      "type": "registry:lang",
+      "target": "$modules$/youtube-embed/lang/en.json",
+      "content": "{\r\n  \"loading\": \"Loading video...\",\r\n  \"error\": \"Failed to load video\",\r\n  \"invalidId\": \"Invalid video ID\",\r\n  \"watchOnYouTube\": \"Watch on YouTube\",\r\n  \"defaultTitle\": \"YouTube video player\"\r\n}\r\n"
+    },
+    {
+      "path": "youtube-embed/lang/tr.json",
+      "type": "registry:lang",
+      "target": "$modules$/youtube-embed/lang/tr.json",
+      "content": "{\r\n  \"loading\": \"Video yükleniyor...\",\r\n  \"error\": \"Video yüklenemedi\",\r\n  \"invalidId\": \"Geçersiz video ID\",\r\n  \"watchOnYouTube\": \"YouTube'da izle\",\r\n  \"defaultTitle\": \"YouTube video oynatıcı\"\r\n}\r\n"
+    }
+  ],
+  "exports": {
+    "types": [],
+    "variables": [
+      "YouTubeEmbed"
+    ]
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@promakeai/cli",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "type": "module",
   "bin": {
     "promake": "dist/index.js"
@@ -49,4 +49,4 @@
     "@types/prompts": "^2.4.9",
     "typescript": "^5.7.2"
   }
-}
+}

package/template/.prettierrc

@@ -1 +1,12 @@
-{}
+{
+    "singleQuote": true,
+    "trailingComma": "all",
+    "arrowParens": "always",
+    "bracketSpacing": true,
+    "bracketSameLine": false,
+    "semi": true,
+    "tabWidth": 2,
+    "useTabs": false,
+    "printWidth": 120,
+    "endOfLine": "lf"
+}

package/template/index.html

@@ -248,10 +248,10 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
     <!-- SEO -->
-    <title>Site Name - Modern Website Template</title>
+    <title>Site Name</title>
     <meta
       name="description"
-      content="A flexible website template for businesses, blogs, ecommerce stores, or portfolios."
+      content="Your site description"
     />
     <meta name="author" content="Site Name" />
 
@@ -259,7 +259,7 @@
     <meta property="og:title" content="Site Name" />
     <meta
       property="og:description"
-      content="A flexible website template for businesses, blogs, ecommerce stores, or portfolios."
+      content="Your site description"
     />
     <meta property="og:type" content="website" />
     <meta property="og:image" content="" />

package/template/package.json

@@ -89,4 +89,4 @@
     "typescript-eslint": "^8.46.4",
     "vite": "^7.2.4"
   }
-}
+}

package/template/src/constants/constants.json

@@ -26,11 +26,11 @@
     "timeout": 30000
   },
   "seo": {
-    "title": "Site Name - Modern Website Template",
-    "description": "A flexible website template for businesses, blogs, ecommerce stores, or portfolios.",
+    "title": "Site Name",
+    "description": "Your site description",
     "author": "Site Name",
     "ogTitle": "Site Name",
-    "ogDescription": "A flexible website template for businesses, blogs, ecommerce stores, or portfolios.",
+    "ogDescription": "Your site description",
     "ogImage": "",
     "twitterSite": "",
     "twitterImage": "",
@@ -61,4 +61,4 @@
     "instagram": "",
     "linkedin": ""
   }
-}
+}

package/template/src/lib/env.ts

@@ -0,0 +1,20 @@
+// Environment değişkenlerini window'a export et
+declare global {
+  interface Window {
+    ENV: {
+      [key: string]: any;
+    };
+  }
+}
+
+window.ENV = {
+  ...Object.keys(import.meta.env)
+    .filter((key) => key.startsWith('VITE_'))
+    .reduce(
+      (acc, key) => ({
+        ...acc,
+        [key]: import.meta.env[key],
+      }),
+      {},
+    ),
+}; 

package/template/src/main.tsx

@@ -1,4 +1,5 @@
 import "./lang";
+import "./lib/env";
 import "./index.css";
 import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";