@framingui/ui 0.6.2 → 0.6.3

package/dist/templates/index.mjs

@@ -0,0 +1,905 @@
+'use client';
+import {
+  Button,
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+  Input,
+  Label,
+  Separator
+} from "../chunk-7UBERMRE.mjs";
+
+// src/templates/types.ts
+var DEFAULT_RESPONSIVE_LAYOUT = {
+  mobile: {
+    padding: "var(--tekton-layout-padding-mobile)",
+    // 16px
+    gap: "var(--tekton-layout-gap-mobile)",
+    // 16px
+    columns: 4
+  },
+  tablet: {
+    padding: "var(--tekton-layout-padding-tablet)",
+    // 32px
+    gap: "var(--tekton-layout-gap-tablet)",
+    // 24px
+    columns: 8
+  },
+  desktop: {
+    padding: "var(--tekton-layout-padding-desktop)",
+    // 64px
+    gap: "var(--tekton-layout-gap-desktop)",
+    // 32px
+    columns: 12
+  }
+};
+var DEFAULT_BREAKPOINTS = {
+  mobile: 768,
+  tablet: 1024,
+  desktop: 1024
+};
+
+// src/templates/registry.ts
+var TemplateRegistry = class _TemplateRegistry {
+  static instance;
+  templates;
+  constructor() {
+    this.templates = /* @__PURE__ */ new Map();
+  }
+  /**
+   * Get singleton instance
+   */
+  static getInstance() {
+    if (!_TemplateRegistry.instance) {
+      _TemplateRegistry.instance = new _TemplateRegistry();
+    }
+    return _TemplateRegistry.instance;
+  }
+  /**
+   * Register a template
+   */
+  register(template) {
+    if (this.templates.has(template.id)) {
+      console.warn(`Template "${template.id}" is already registered. Overwriting.`);
+    }
+    this.templates.set(template.id, {
+      template,
+      metadata: {
+        usageCount: 0
+      }
+    });
+  }
+  /**
+   * Register multiple templates
+   */
+  registerMany(templates) {
+    templates.forEach((template) => this.register(template));
+  }
+  /**
+   * Get template by ID
+   */
+  get(id) {
+    const entry = this.templates.get(id);
+    if (entry) {
+      entry.metadata.usageCount++;
+      entry.metadata.lastUsed = (/* @__PURE__ */ new Date()).toISOString();
+      return entry.template;
+    }
+    return void 0;
+  }
+  /**
+   * Get all templates
+   */
+  getAll() {
+    return Array.from(this.templates.values()).map((entry) => entry.template);
+  }
+  /**
+   * Get templates by category
+   */
+  getByCategory(category) {
+    return this.getAll().filter((template) => template.category === category);
+  }
+  /**
+   * Find templates by required components
+   * Returns templates that include ALL specified components
+   */
+  findByRequiredComponents(components) {
+    return this.getAll().filter((template) => {
+      return components.every((component) => template.requiredComponents.includes(component));
+    });
+  }
+  /**
+   * Search templates by keyword
+   * Searches in: id, name, description, tags
+   */
+  search(keyword) {
+    const lowerKeyword = keyword.toLowerCase();
+    return this.getAll().filter((template) => {
+      return template.id.toLowerCase().includes(lowerKeyword) || template.name.toLowerCase().includes(lowerKeyword) || template.description.toLowerCase().includes(lowerKeyword) || template.tags?.some((tag) => tag.toLowerCase().includes(lowerKeyword));
+    });
+  }
+  /**
+   * Get template metadata
+   */
+  getMetadata(id) {
+    return this.templates.get(id)?.metadata;
+  }
+  /**
+   * Get most used templates
+   */
+  getMostUsed(limit = 10) {
+    return Array.from(this.templates.values()).sort((a, b) => b.metadata.usageCount - a.metadata.usageCount).slice(0, limit).map((entry) => entry.template);
+  }
+  /**
+   * Get recently used templates
+   */
+  getRecentlyUsed(limit = 10) {
+    return Array.from(this.templates.values()).filter((entry) => entry.metadata.lastUsed).sort((a, b) => {
+      const dateA = new Date(a.metadata.lastUsed).getTime();
+      const dateB = new Date(b.metadata.lastUsed).getTime();
+      return dateB - dateA;
+    }).slice(0, limit).map((entry) => entry.template);
+  }
+  /**
+   * Clear all templates
+   */
+  clear() {
+    this.templates.clear();
+  }
+  /**
+   * Get template count
+   */
+  count() {
+    return this.templates.size;
+  }
+  /**
+   * Check if template exists
+   */
+  has(id) {
+    return this.templates.has(id);
+  }
+  /**
+   * Remove template
+   */
+  remove(id) {
+    return this.templates.delete(id);
+  }
+};
+var templateRegistry = TemplateRegistry.getInstance();
+
+// src/templates/create-template.ts
+import { loadTemplateDefinition } from "@framingui/core/template-catalog";
+var PRIMARY_SECTION_SLOTS = /* @__PURE__ */ new Set(["main", "primaryContent"]);
+var NoopSectionComponent = () => null;
+function toSectionTemplates(template, Component) {
+  return template.skeleton.sections.map((section) => ({
+    id: section.id,
+    name: section.name,
+    slot: section.slot,
+    required: section.required,
+    Component: PRIMARY_SECTION_SLOTS.has(section.slot) ? Component : NoopSectionComponent
+  }));
+}
+function createTemplateFromCatalog(templateId, Component) {
+  const definition = loadTemplateDefinition(templateId);
+  if (!definition) {
+    throw new Error(`Unknown template definition: ${templateId}`);
+  }
+  return {
+    id: definition.id,
+    name: definition.name,
+    category: definition.category,
+    description: definition.description,
+    skeleton: {
+      shell: definition.skeleton.shell,
+      page: definition.skeleton.page,
+      sections: toSectionTemplates(definition, Component)
+    },
+    layout: {
+      type: definition.layout.type,
+      responsive: definition.layout.responsive
+    },
+    customizable: definition.customizable,
+    requiredComponents: definition.requiredComponents,
+    Component,
+    version: definition.version,
+    created: definition.created,
+    updated: definition.updated,
+    tags: definition.tags
+  };
+}
+
+// src/templates/auth/login.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function LoginTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {},
+  options = {}
+}) {
+  const title = texts.title || "Welcome Back";
+  const subtitle = texts.subtitle || "Sign in to your account";
+  const buttonLabel = texts.button_label || "Sign In";
+  const showSocialLogin = options.social_login ?? false;
+  const showRememberMe = options.remember_me ?? false;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`,
+      children: [
+        /* @__PURE__ */ jsxs(Card, { className: "w-full max-w-md", children: [
+          /* @__PURE__ */ jsxs(CardHeader, { children: [
+            slots.logo && /* @__PURE__ */ jsx("div", { className: "mb-[var(--tekton-spacing-4)]", children: slots.logo }),
+            /* @__PURE__ */ jsx(CardTitle, { children: title }),
+            /* @__PURE__ */ jsx(CardDescription, { children: subtitle })
+          ] }),
+          /* @__PURE__ */ jsxs(CardContent, { className: "space-y-[var(--tekton-spacing-4)]", children: [
+            /* @__PURE__ */ jsxs("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+              /* @__PURE__ */ jsx(Label, { htmlFor: "email", children: "Email" }),
+              /* @__PURE__ */ jsx(Input, { id: "email", type: "email", placeholder: "Enter your email" })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+                /* @__PURE__ */ jsx(Label, { htmlFor: "password", children: "Password" }),
+                slots.forgotPassword && /* @__PURE__ */ jsx("div", { children: slots.forgotPassword })
+              ] }),
+              /* @__PURE__ */ jsx(Input, { id: "password", type: "password", placeholder: "Enter your password" })
+            ] }),
+            showRememberMe && slots.rememberMe && /* @__PURE__ */ jsx("div", { className: "flex items-center space-x-[var(--tekton-spacing-2)]", children: slots.rememberMe }),
+            /* @__PURE__ */ jsx(Button, { className: "w-full", children: buttonLabel }),
+            showSocialLogin && slots.socialLogin && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+                /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsx(Separator, {}) }),
+                /* @__PURE__ */ jsx("div", { className: "relative flex justify-center text-xs uppercase", children: /* @__PURE__ */ jsx("span", { className: "bg-[var(--tekton-bg-background)] px-[var(--tekton-spacing-2)] text-[var(--tekton-text-muted-foreground)]", children: "Or continue with" }) })
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-[var(--tekton-spacing-4)]", children: slots.socialLogin })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(CardFooter, { children: slots.footer || /* @__PURE__ */ jsxs("p", { className: "text-sm text-center w-full text-[var(--tekton-text-muted-foreground)]", children: [
+            "Don't have an account?",
+            " ",
+            /* @__PURE__ */ jsx("a", { href: "#", className: "text-[var(--tekton-text-primary)] hover:underline", children: "Sign up" })
+          ] }) })
+        ] }),
+        children
+      ]
+    }
+  );
+}
+var LoginTemplate = createTemplateFromCatalog("auth.login", LoginTemplateComponent);
+
+// src/templates/auth/signup.tsx
+import { Fragment as Fragment2, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function SignupTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {},
+  options = {}
+}) {
+  const title = texts.title || "Create Account";
+  const subtitle = texts.subtitle || "Sign up to get started";
+  const buttonLabel = texts.button_label || "Sign Up";
+  const showSocialSignup = options.social_signup ?? false;
+  return /* @__PURE__ */ jsxs2(
+    "div",
+    {
+      className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`,
+      children: [
+        /* @__PURE__ */ jsxs2(Card, { className: "w-full max-w-md", children: [
+          /* @__PURE__ */ jsxs2(CardHeader, { children: [
+            slots.logo && /* @__PURE__ */ jsx2("div", { className: "mb-[var(--tekton-spacing-4)]", children: slots.logo }),
+            /* @__PURE__ */ jsx2(CardTitle, { children: title }),
+            /* @__PURE__ */ jsx2(CardDescription, { children: subtitle })
+          ] }),
+          /* @__PURE__ */ jsxs2(CardContent, { className: "space-y-[var(--tekton-spacing-4)]", children: [
+            /* @__PURE__ */ jsxs2("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+              /* @__PURE__ */ jsx2(Label, { htmlFor: "name", children: "Name" }),
+              /* @__PURE__ */ jsx2(Input, { id: "name", type: "text", placeholder: "Enter your name" })
+            ] }),
+            /* @__PURE__ */ jsxs2("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+              /* @__PURE__ */ jsx2(Label, { htmlFor: "email", children: "Email" }),
+              /* @__PURE__ */ jsx2(Input, { id: "email", type: "email", placeholder: "Enter your email" })
+            ] }),
+            /* @__PURE__ */ jsxs2("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+              /* @__PURE__ */ jsx2(Label, { htmlFor: "password", children: "Password" }),
+              /* @__PURE__ */ jsx2(Input, { id: "password", type: "password", placeholder: "Enter your password" })
+            ] }),
+            /* @__PURE__ */ jsxs2("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+              /* @__PURE__ */ jsx2(Label, { htmlFor: "password-confirm", children: "Confirm Password" }),
+              /* @__PURE__ */ jsx2(Input, { id: "password-confirm", type: "password", placeholder: "Confirm your password" })
+            ] }),
+            slots.termsCheckbox && /* @__PURE__ */ jsx2("div", { className: "flex items-start space-x-[var(--tekton-spacing-2)]", children: slots.termsCheckbox }),
+            /* @__PURE__ */ jsx2(Button, { className: "w-full", children: buttonLabel }),
+            showSocialSignup && slots.socialSignup && /* @__PURE__ */ jsxs2(Fragment2, { children: [
+              /* @__PURE__ */ jsxs2("div", { className: "relative", children: [
+                /* @__PURE__ */ jsx2("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsx2(Separator, {}) }),
+                /* @__PURE__ */ jsx2("div", { className: "relative flex justify-center text-xs uppercase", children: /* @__PURE__ */ jsx2("span", { className: "bg-[var(--tekton-bg-background)] px-[var(--tekton-spacing-2)] text-[var(--tekton-text-muted-foreground)]", children: "Or sign up with" }) })
+              ] }),
+              /* @__PURE__ */ jsx2("div", { className: "grid grid-cols-2 gap-[var(--tekton-spacing-4)]", children: slots.socialSignup })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx2(CardFooter, { children: slots.footer || /* @__PURE__ */ jsxs2("p", { className: "text-sm text-center w-full text-[var(--tekton-text-muted-foreground)]", children: [
+            "Already have an account?",
+            " ",
+            /* @__PURE__ */ jsx2("a", { href: "#", className: "text-[var(--tekton-text-primary)] hover:underline", children: "Sign in" })
+          ] }) })
+        ] }),
+        children
+      ]
+    }
+  );
+}
+var SignupTemplate = createTemplateFromCatalog("auth.signup", SignupTemplateComponent);
+
+// src/templates/auth/forgot-password.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function ForgotPasswordTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {}
+}) {
+  const title = texts.title || "Forgot Password?";
+  const subtitle = texts.subtitle || "Enter your email address and we'll send you a reset link";
+  const buttonLabel = texts.button_label || "Send Reset Link";
+  return /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`,
+      children: [
+        /* @__PURE__ */ jsxs3(Card, { className: "w-full max-w-md", children: [
+          /* @__PURE__ */ jsxs3(CardHeader, { children: [
+            slots.logo && /* @__PURE__ */ jsx3("div", { className: "mb-[var(--tekton-spacing-4)]", children: slots.logo }),
+            /* @__PURE__ */ jsx3(CardTitle, { children: title }),
+            /* @__PURE__ */ jsx3(CardDescription, { children: subtitle })
+          ] }),
+          /* @__PURE__ */ jsxs3(CardContent, { className: "space-y-[var(--tekton-spacing-4)]", children: [
+            /* @__PURE__ */ jsxs3("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+              /* @__PURE__ */ jsx3(Label, { htmlFor: "email", children: "Email" }),
+              /* @__PURE__ */ jsx3(Input, { id: "email", type: "email", placeholder: "Enter your email" })
+            ] }),
+            /* @__PURE__ */ jsx3(Button, { className: "w-full", children: buttonLabel })
+          ] }),
+          /* @__PURE__ */ jsx3(CardFooter, { children: slots.footer || /* @__PURE__ */ jsxs3("p", { className: "text-sm text-center w-full text-[var(--tekton-text-muted-foreground)]", children: [
+            "Remember your password?",
+            " ",
+            /* @__PURE__ */ jsx3("a", { href: "#", className: "text-[var(--tekton-text-primary)] hover:underline", children: "Back to login" })
+          ] }) })
+        ] }),
+        children
+      ]
+    }
+  );
+}
+var ForgotPasswordTemplate = createTemplateFromCatalog(
+  "auth.forgot-password",
+  ForgotPasswordTemplateComponent
+);
+
+// src/templates/auth/verification.tsx
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function VerificationTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {},
+  options = {}
+}) {
+  const title = texts.title || "Verify Your Email";
+  const subtitle = texts.subtitle || "We've sent a verification link to your email address";
+  const buttonLabel = texts.button_label || "Continue";
+  const showResend = options.show_resend ?? true;
+  const userEmail = options.user_email || "user@example.com";
+  return /* @__PURE__ */ jsxs4(
+    "div",
+    {
+      className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`,
+      children: [
+        /* @__PURE__ */ jsxs4(Card, { className: "w-full max-w-md", children: [
+          /* @__PURE__ */ jsxs4(CardHeader, { children: [
+            slots.icon && /* @__PURE__ */ jsx4("div", { className: "mb-[var(--tekton-spacing-4)]", children: slots.icon }),
+            /* @__PURE__ */ jsx4(CardTitle, { children: title }),
+            /* @__PURE__ */ jsx4(CardDescription, { children: subtitle })
+          ] }),
+          /* @__PURE__ */ jsxs4(CardContent, { className: "space-y-[var(--tekton-spacing-4)]", children: [
+            /* @__PURE__ */ jsx4("div", { className: "bg-[var(--tekton-bg-muted)] p-[var(--tekton-spacing-3)] rounded-[var(--tekton-radius-md)] text-center", children: /* @__PURE__ */ jsx4("p", { className: "text-sm font-medium", children: userEmail }) }),
+            /* @__PURE__ */ jsx4(Button, { className: "w-full", children: buttonLabel }),
+            showResend && /* @__PURE__ */ jsx4("div", { className: "text-center", children: /* @__PURE__ */ jsxs4("p", { className: "text-sm text-[var(--tekton-text-muted-foreground)]", children: [
+              "Didn't receive the email?",
+              " ",
+              /* @__PURE__ */ jsx4("button", { className: "text-[var(--tekton-text-primary)] hover:underline", children: "Resend" })
+            ] }) })
+          ] }),
+          /* @__PURE__ */ jsx4(CardFooter, { children: slots.footer || /* @__PURE__ */ jsxs4("p", { className: "text-sm text-center w-full text-[var(--tekton-text-muted-foreground)]", children: [
+            "Wrong email?",
+            " ",
+            /* @__PURE__ */ jsx4("a", { href: "#", className: "text-[var(--tekton-text-primary)] hover:underline", children: "Change email address" })
+          ] }) })
+        ] }),
+        children
+      ]
+    }
+  );
+}
+var VerificationTemplate = createTemplateFromCatalog(
+  "auth.verification",
+  VerificationTemplateComponent
+);
+
+// src/templates/core/landing.tsx
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+function LandingTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {}
+}) {
+  const title = texts.title || "Welcome Back";
+  const subtitle = texts.subtitle || "Start a new conversation or continue where you left off";
+  const ctaLabel = texts.cta_label || "New Conversation";
+  return /* @__PURE__ */ jsxs5("div", { className: `min-h-screen flex ${className}`, children: [
+    slots.sidebar && /* @__PURE__ */ jsx5("aside", { className: "w-64 border-r border-[var(--tekton-border-default)] bg-[var(--tekton-bg-muted)]", children: slots.sidebar }),
+    /* @__PURE__ */ jsxs5("main", { className: "flex-1 flex flex-col", children: [
+      slots.header && /* @__PURE__ */ jsx5("header", { className: "border-b border-[var(--tekton-border-default)] p-[var(--tekton-spacing-4)]", children: slots.header }),
+      /* @__PURE__ */ jsx5("div", { className: "flex-1 flex flex-col items-center justify-center p-[var(--tekton-spacing-8)]", children: /* @__PURE__ */ jsxs5("div", { className: "max-w-2xl w-full text-center space-y-[var(--tekton-spacing-6)]", children: [
+        /* @__PURE__ */ jsxs5("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+          /* @__PURE__ */ jsx5("h1", { className: "text-3xl font-bold", children: title }),
+          /* @__PURE__ */ jsx5("p", { className: "text-[var(--tekton-text-muted-foreground)]", children: subtitle })
+        ] }),
+        /* @__PURE__ */ jsx5("div", { children: /* @__PURE__ */ jsx5(Button, { size: "lg", children: ctaLabel }) }),
+        slots.recentActivity && /* @__PURE__ */ jsx5("div", { className: "mt-[var(--tekton-spacing-8)]", children: slots.recentActivity }),
+        slots.suggestions && /* @__PURE__ */ jsx5("div", { className: "mt-[var(--tekton-spacing-6)]", children: slots.suggestions })
+      ] }) })
+    ] }),
+    children
+  ] });
+}
+var LandingTemplate = createTemplateFromCatalog("core.landing", LandingTemplateComponent);
+
+// src/templates/core/preferences.tsx
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+function PreferencesTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {}
+}) {
+  const title = texts.title || "Preferences";
+  const subtitle = texts.subtitle || "Manage your account settings and preferences";
+  const saveLabel = texts.save_label || "Save Changes";
+  return /* @__PURE__ */ jsxs6("div", { className: `min-h-screen flex ${className}`, children: [
+    slots.settingsNav && /* @__PURE__ */ jsx6("aside", { className: "w-64 border-r border-[var(--tekton-border-default)] p-[var(--tekton-spacing-4)] bg-[var(--tekton-bg-muted)]", children: slots.settingsNav }),
+    /* @__PURE__ */ jsx6("main", { className: "flex-1 p-[var(--tekton-spacing-8)]", children: /* @__PURE__ */ jsxs6("div", { className: "max-w-3xl", children: [
+      /* @__PURE__ */ jsxs6("div", { className: "mb-[var(--tekton-spacing-8)]", children: [
+        /* @__PURE__ */ jsx6("h1", { className: "text-3xl font-bold mb-[var(--tekton-spacing-2)]", children: title }),
+        /* @__PURE__ */ jsx6("p", { className: "text-[var(--tekton-text-muted-foreground)]", children: subtitle })
+      ] }),
+      /* @__PURE__ */ jsxs6("div", { className: "space-y-[var(--tekton-spacing-6)]", children: [
+        slots.generalSettings && /* @__PURE__ */ jsxs6(Card, { children: [
+          /* @__PURE__ */ jsxs6(CardHeader, { children: [
+            /* @__PURE__ */ jsx6(CardTitle, { children: "General" }),
+            /* @__PURE__ */ jsx6(CardDescription, { children: "Manage your general preferences" })
+          ] }),
+          /* @__PURE__ */ jsx6(CardContent, { children: slots.generalSettings })
+        ] }),
+        slots.appearanceSettings && /* @__PURE__ */ jsxs6(Card, { children: [
+          /* @__PURE__ */ jsxs6(CardHeader, { children: [
+            /* @__PURE__ */ jsx6(CardTitle, { children: "Appearance" }),
+            /* @__PURE__ */ jsx6(CardDescription, { children: "Customize the look and feel" })
+          ] }),
+          /* @__PURE__ */ jsx6(CardContent, { children: slots.appearanceSettings })
+        ] }),
+        slots.notificationsSettings && /* @__PURE__ */ jsxs6(Card, { children: [
+          /* @__PURE__ */ jsxs6(CardHeader, { children: [
+            /* @__PURE__ */ jsx6(CardTitle, { children: "Notifications" }),
+            /* @__PURE__ */ jsx6(CardDescription, { children: "Manage notification preferences" })
+          ] }),
+          /* @__PURE__ */ jsx6(CardContent, { children: slots.notificationsSettings })
+        ] }),
+        slots.additionalSettings && slots.additionalSettings
+      ] }),
+      /* @__PURE__ */ jsxs6("div", { className: "mt-[var(--tekton-spacing-8)] flex justify-end gap-[var(--tekton-spacing-4)]", children: [
+        /* @__PURE__ */ jsx6(Button, { variant: "outline", children: "Cancel" }),
+        /* @__PURE__ */ jsx6(Button, { children: saveLabel })
+      ] })
+    ] }) }),
+    children
+  ] });
+}
+var PreferencesTemplate = createTemplateFromCatalog(
+  "core.preferences",
+  PreferencesTemplateComponent
+);
+
+// src/templates/core/profile.tsx
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+function ProfileTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {},
+  options = {}
+}) {
+  const title = texts.title || "Profile";
+  const subtitle = texts.subtitle || "Manage your profile information";
+  const saveLabel = texts.save_label || "Save Changes";
+  const userName = String(options.user_name || "John Doe");
+  const userEmail = String(options.user_email || "john@example.com");
+  return /* @__PURE__ */ jsxs7("div", { className: `min-h-screen p-[var(--tekton-spacing-8)] ${className}`, children: [
+    /* @__PURE__ */ jsxs7("div", { className: "max-w-3xl mx-auto", children: [
+      /* @__PURE__ */ jsxs7("div", { className: "mb-[var(--tekton-spacing-8)]", children: [
+        /* @__PURE__ */ jsx7("h1", { className: "text-3xl font-bold mb-[var(--tekton-spacing-2)]", children: title }),
+        /* @__PURE__ */ jsx7("p", { className: "text-[var(--tekton-text-muted-foreground)]", children: subtitle })
+      ] }),
+      /* @__PURE__ */ jsxs7(Card, { children: [
+        /* @__PURE__ */ jsxs7(CardHeader, { children: [
+          /* @__PURE__ */ jsx7(CardTitle, { children: "Personal Information" }),
+          /* @__PURE__ */ jsx7(CardDescription, { children: "Update your profile details" })
+        ] }),
+        /* @__PURE__ */ jsxs7(CardContent, { className: "space-y-[var(--tekton-spacing-6)]", children: [
+          slots.avatar && /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-[var(--tekton-spacing-4)]", children: [
+            /* @__PURE__ */ jsx7("div", { children: slots.avatar }),
+            /* @__PURE__ */ jsxs7("div", { children: [
+              /* @__PURE__ */ jsx7(Button, { variant: "outline", size: "sm", children: "Change Photo" }),
+              /* @__PURE__ */ jsx7("p", { className: "text-xs text-[var(--tekton-text-muted-foreground)] mt-[var(--tekton-spacing-2)]", children: "JPG, PNG. Max 2MB" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs7("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+            /* @__PURE__ */ jsx7(Label, { htmlFor: "name", children: "Name" }),
+            /* @__PURE__ */ jsx7(Input, { id: "name", type: "text", defaultValue: userName })
+          ] }),
+          /* @__PURE__ */ jsxs7("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+            /* @__PURE__ */ jsx7(Label, { htmlFor: "email", children: "Email" }),
+            /* @__PURE__ */ jsx7(Input, { id: "email", type: "email", defaultValue: userEmail, disabled: true }),
+            /* @__PURE__ */ jsx7("p", { className: "text-xs text-[var(--tekton-text-muted-foreground)]", children: "Contact support to change your email address" })
+          ] }),
+          slots.bioField && /* @__PURE__ */ jsx7("div", { className: "space-y-[var(--tekton-spacing-2)]", children: slots.bioField }),
+          slots.additionalFields && slots.additionalFields
+        ] })
+      ] }),
+      slots.additionalSections && /* @__PURE__ */ jsx7("div", { className: "mt-[var(--tekton-spacing-6)]", children: slots.additionalSections }),
+      /* @__PURE__ */ jsxs7("div", { className: "mt-[var(--tekton-spacing-8)] flex justify-end gap-[var(--tekton-spacing-4)]", children: [
+        /* @__PURE__ */ jsx7(Button, { variant: "outline", children: "Cancel" }),
+        /* @__PURE__ */ jsx7(Button, { children: saveLabel })
+      ] })
+    ] }),
+    children
+  ] });
+}
+var ProfileTemplate = createTemplateFromCatalog("core.profile", ProfileTemplateComponent);
+
+// src/templates/feedback/loading.tsx
+import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+function LoadingTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {},
+  options = {}
+}) {
+  const message = texts.message || "Loading...";
+  const showMessage = options.show_message ?? true;
+  return /* @__PURE__ */ jsxs8(
+    "div",
+    {
+      className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`,
+      children: [
+        /* @__PURE__ */ jsxs8("div", { className: "flex flex-col items-center gap-[var(--tekton-spacing-4)]", children: [
+          slots.spinner || /* @__PURE__ */ jsx8("div", { className: "animate-spin rounded-full h-12 w-12 border-b-2 border-[var(--tekton-border-primary)]" }),
+          showMessage && /* @__PURE__ */ jsx8("p", { className: "text-sm text-[var(--tekton-text-muted-foreground)]", children: message })
+        ] }),
+        children
+      ]
+    }
+  );
+}
+var LoadingTemplate = createTemplateFromCatalog(
+  "feedback.loading",
+  LoadingTemplateComponent
+);
+
+// src/templates/feedback/error.tsx
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+function ErrorTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {},
+  options = {}
+}) {
+  const title = texts.title || "Something Went Wrong";
+  const message = texts.message || "An error occurred. Please try again.";
+  const retryLabel = texts.retry_label || "Try Again";
+  const showRetry = options.show_retry ?? true;
+  return /* @__PURE__ */ jsxs9(
+    "div",
+    {
+      className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`,
+      children: [
+        /* @__PURE__ */ jsxs9("div", { className: "max-w-md text-center space-y-[var(--tekton-spacing-6)]", children: [
+          slots.icon || /* @__PURE__ */ jsx9("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx9("div", { className: "rounded-full bg-[var(--tekton-bg-destructive)] bg-opacity-10 p-[var(--tekton-spacing-4)]", children: /* @__PURE__ */ jsx9(
+            "svg",
+            {
+              xmlns: "http://www.w3.org/2000/svg",
+              className: "h-12 w-12 text-[var(--tekton-text-destructive)]",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              stroke: "currentColor",
+              children: /* @__PURE__ */ jsx9(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  strokeWidth: 2,
+                  d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
+                }
+              )
+            }
+          ) }) }),
+          /* @__PURE__ */ jsxs9("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+            /* @__PURE__ */ jsx9("h2", { className: "text-2xl font-bold", children: title }),
+            /* @__PURE__ */ jsx9("p", { className: "text-[var(--tekton-text-muted-foreground)]", children: message })
+          ] }),
+          slots.errorDetails && /* @__PURE__ */ jsx9("div", { className: "text-left bg-[var(--tekton-bg-muted)] p-[var(--tekton-spacing-4)] rounded-[var(--tekton-radius-md)] text-sm", children: slots.errorDetails }),
+          /* @__PURE__ */ jsxs9("div", { className: "flex flex-col gap-[var(--tekton-spacing-3)]", children: [
+            showRetry && /* @__PURE__ */ jsx9(Button, { className: "w-full", children: retryLabel }),
+            slots.additionalActions && slots.additionalActions
+          ] })
+        ] }),
+        children
+      ]
+    }
+  );
+}
+var ErrorTemplate = createTemplateFromCatalog("feedback.error", ErrorTemplateComponent);
+
+// src/templates/feedback/empty.tsx
+import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+function EmptyTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {},
+  options = {}
+}) {
+  const title = texts.title || "No Items Found";
+  const message = texts.message || "Get started by creating your first item";
+  const ctaLabel = texts.cta_label || "Create New";
+  const showCta = options.show_cta ?? true;
+  return /* @__PURE__ */ jsxs10(
+    "div",
+    {
+      className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`,
+      children: [
+        /* @__PURE__ */ jsxs10("div", { className: "max-w-md text-center space-y-[var(--tekton-spacing-6)]", children: [
+          slots.illustration || /* @__PURE__ */ jsx10("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx10("div", { className: "rounded-full bg-[var(--tekton-bg-muted)] p-[var(--tekton-spacing-8)]", children: /* @__PURE__ */ jsx10(
+            "svg",
+            {
+              xmlns: "http://www.w3.org/2000/svg",
+              className: "h-16 w-16 text-[var(--tekton-text-muted-foreground)]",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              stroke: "currentColor",
+              children: /* @__PURE__ */ jsx10(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  strokeWidth: 2,
+                  d: "M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4"
+                }
+              )
+            }
+          ) }) }),
+          /* @__PURE__ */ jsxs10("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+            /* @__PURE__ */ jsx10("h2", { className: "text-2xl font-bold", children: title }),
+            /* @__PURE__ */ jsx10("p", { className: "text-[var(--tekton-text-muted-foreground)]", children: message })
+          ] }),
+          showCta && /* @__PURE__ */ jsx10("div", { children: /* @__PURE__ */ jsx10(Button, { size: "lg", children: ctaLabel }) }),
+          slots.helpText && /* @__PURE__ */ jsx10("div", { className: "text-sm text-[var(--tekton-text-muted-foreground)]", children: slots.helpText })
+        ] }),
+        children
+      ]
+    }
+  );
+}
+var EmptyTemplate = createTemplateFromCatalog("feedback.empty", EmptyTemplateComponent);
+
+// src/templates/feedback/confirmation.tsx
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+function ConfirmationTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {},
+  options = {}
+}) {
+  const title = texts.title || "Are You Sure?";
+  const message = texts.message || "This action cannot be undone.";
+  const confirmLabel = texts.confirm_label || "Confirm";
+  const cancelLabel = texts.cancel_label || "Cancel";
+  const isDestructive = options.is_destructive ?? false;
+  return /* @__PURE__ */ jsxs11(
+    "div",
+    {
+      className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`,
+      children: [
+        /* @__PURE__ */ jsxs11(Card, { className: "w-full max-w-md", children: [
+          /* @__PURE__ */ jsxs11(CardHeader, { children: [
+            isDestructive && slots.warningIcon && /* @__PURE__ */ jsx11("div", { className: "mb-[var(--tekton-spacing-2)]", children: slots.warningIcon }),
+            /* @__PURE__ */ jsx11(CardTitle, { children: title }),
+            /* @__PURE__ */ jsx11(CardDescription, { children: message })
+          ] }),
+          /* @__PURE__ */ jsx11(CardContent, { children: slots.details && /* @__PURE__ */ jsx11("div", { className: "bg-[var(--tekton-bg-muted)] p-[var(--tekton-spacing-4)] rounded-[var(--tekton-radius-md)] text-sm", children: slots.details }) }),
+          /* @__PURE__ */ jsxs11(CardFooter, { className: "flex justify-end gap-[var(--tekton-spacing-3)]", children: [
+            /* @__PURE__ */ jsx11(Button, { variant: "outline", children: cancelLabel }),
+            /* @__PURE__ */ jsx11(Button, { variant: isDestructive ? "destructive" : "default", children: confirmLabel })
+          ] })
+        ] }),
+        children
+      ]
+    }
+  );
+}
+var ConfirmationTemplate = createTemplateFromCatalog(
+  "feedback.confirmation",
+  ConfirmationTemplateComponent
+);
+
+// src/templates/feedback/success.tsx
+import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+function SuccessTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {},
+  options = {}
+}) {
+  const title = texts.title || "Success!";
+  const message = texts.message || "Your action was completed successfully";
+  const ctaLabel = texts.cta_label || "Continue";
+  const showCta = options.show_cta ?? true;
+  return /* @__PURE__ */ jsxs12(
+    "div",
+    {
+      className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`,
+      children: [
+        /* @__PURE__ */ jsxs12("div", { className: "max-w-md text-center space-y-[var(--tekton-spacing-6)]", children: [
+          slots.icon || /* @__PURE__ */ jsx12("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx12("div", { className: "rounded-full bg-[var(--tekton-bg-success)] bg-opacity-10 p-[var(--tekton-spacing-4)]", children: /* @__PURE__ */ jsx12(
+            "svg",
+            {
+              xmlns: "http://www.w3.org/2000/svg",
+              className: "h-12 w-12 text-[var(--tekton-text-success)]",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              stroke: "currentColor",
+              children: /* @__PURE__ */ jsx12(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  strokeWidth: 2,
+                  d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"
+                }
+              )
+            }
+          ) }) }),
+          /* @__PURE__ */ jsxs12("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [
+            /* @__PURE__ */ jsx12("h2", { className: "text-2xl font-bold", children: title }),
+            /* @__PURE__ */ jsx12("p", { className: "text-[var(--tekton-text-muted-foreground)]", children: message })
+          ] }),
+          slots.details && /* @__PURE__ */ jsx12("div", { className: "text-left bg-[var(--tekton-bg-muted)] p-[var(--tekton-spacing-4)] rounded-[var(--tekton-radius-md)] text-sm", children: slots.details }),
+          showCta && /* @__PURE__ */ jsx12("div", { children: /* @__PURE__ */ jsx12(Button, { className: "w-full", size: "lg", children: ctaLabel }) }),
+          slots.additionalActions && /* @__PURE__ */ jsx12("div", { className: "flex flex-col gap-[var(--tekton-spacing-3)]", children: slots.additionalActions })
+        ] }),
+        children
+      ]
+    }
+  );
+}
+var SuccessTemplate = createTemplateFromCatalog(
+  "feedback.success",
+  SuccessTemplateComponent
+);
+
+// src/templates/dashboard/overview.tsx
+import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
+function DashboardTemplateComponent({
+  children,
+  className = "",
+  slots = {},
+  texts = {}
+}) {
+  const title = texts.title || "Dashboard";
+  const subtitle = texts.subtitle || "Welcome to your dashboard";
+  return /* @__PURE__ */ jsxs13("div", { className: `min-h-screen flex ${className}`, children: [
+    slots.sidebar && /* @__PURE__ */ jsx13("aside", { className: "w-64 border-r border-[var(--tekton-border-default)] bg-[var(--tekton-bg-card)] hidden lg:block", children: slots.sidebar }),
+    /* @__PURE__ */ jsxs13("main", { className: "flex-1 overflow-auto bg-[var(--tekton-bg-background)]", children: [
+      /* @__PURE__ */ jsx13("header", { className: "sticky top-0 z-10 border-b border-[var(--tekton-border-default)] bg-[var(--tekton-bg-background)]/80 backdrop-blur-md p-[var(--tekton-spacing-4)]", children: /* @__PURE__ */ jsxs13("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsxs13("div", { children: [
+          /* @__PURE__ */ jsx13("h1", { className: "text-2xl font-bold text-[var(--tekton-text-foreground)]", children: title }),
+          /* @__PURE__ */ jsx13("p", { className: "text-sm text-[var(--tekton-text-muted-foreground)]", children: subtitle })
+        ] }),
+        slots.headerActions && /* @__PURE__ */ jsx13("div", { children: slots.headerActions })
+      ] }) }),
+      /* @__PURE__ */ jsxs13("div", { className: "py-[var(--tekton-layout-section-py,var(--tekton-spacing-6))] px-[var(--tekton-layout-container-px,var(--tekton-spacing-6))] space-y-[var(--tekton-layout-stack-gap,var(--tekton-spacing-6))] max-w-[var(--tekton-layout-container-xl)] mx-auto", children: [
+        slots.metrics && /* @__PURE__ */ jsx13("div", { className: "grid gap-[var(--tekton-spacing-4)] grid-cols-2 lg:grid-cols-4", children: slots.metrics }),
+        /* @__PURE__ */ jsx13(Separator, {}),
+        /* @__PURE__ */ jsxs13("div", { className: "grid gap-x-[var(--tekton-layout-grid-gap-x,var(--tekton-spacing-6))] gap-y-[var(--tekton-layout-grid-gap-y,var(--tekton-spacing-6))] lg:grid-cols-12", children: [
+          slots.primaryContent && /* @__PURE__ */ jsx13("div", { className: "lg:col-span-8 space-y-[var(--tekton-layout-stack-gap,var(--tekton-spacing-6))]", children: slots.primaryContent }),
+          slots.secondaryContent && /* @__PURE__ */ jsx13("div", { className: "lg:col-span-4 space-y-[var(--tekton-layout-stack-gap,var(--tekton-spacing-6))]", children: /* @__PURE__ */ jsxs13(Card, { className: "h-full", children: [
+            /* @__PURE__ */ jsxs13(CardHeader, { children: [
+              /* @__PURE__ */ jsx13(CardTitle, { children: texts.secondary_title || "Activity" }),
+              /* @__PURE__ */ jsx13(CardDescription, { children: texts.secondary_description || "Recent updates" })
+            ] }),
+            /* @__PURE__ */ jsx13(CardContent, { className: "p-0", children: slots.secondaryContent })
+          ] }) })
+        ] }),
+        slots.additionalSections && /* @__PURE__ */ jsx13("div", { children: slots.additionalSections })
+      ] })
+    ] }),
+    children
+  ] });
+}
+var DashboardTemplate = createTemplateFromCatalog(
+  "dashboard.overview",
+  DashboardTemplateComponent
+);
+
+// src/templates/index.ts
+templateRegistry.registerMany([
+  // Auth
+  LoginTemplate,
+  SignupTemplate,
+  ForgotPasswordTemplate,
+  VerificationTemplate,
+  // Core
+  LandingTemplate,
+  PreferencesTemplate,
+  ProfileTemplate,
+  // Feedback
+  LoadingTemplate,
+  ErrorTemplate,
+  EmptyTemplate,
+  ConfirmationTemplate,
+  SuccessTemplate,
+  // Dashboard
+  DashboardTemplate
+]);
+export {
+  ConfirmationTemplate,
+  ConfirmationTemplateComponent,
+  DEFAULT_BREAKPOINTS,
+  DEFAULT_RESPONSIVE_LAYOUT,
+  DashboardTemplate,
+  DashboardTemplateComponent,
+  EmptyTemplate,
+  EmptyTemplateComponent,
+  ErrorTemplate,
+  ErrorTemplateComponent,
+  ForgotPasswordTemplate,
+  ForgotPasswordTemplateComponent,
+  LandingTemplate,
+  LandingTemplateComponent,
+  LoadingTemplate,
+  LoadingTemplateComponent,
+  LoginTemplate,
+  LoginTemplateComponent,
+  PreferencesTemplate,
+  PreferencesTemplateComponent,
+  ProfileTemplate,
+  ProfileTemplateComponent,
+  SignupTemplate,
+  SignupTemplateComponent,
+  SuccessTemplate,
+  SuccessTemplateComponent,
+  TemplateRegistry,
+  VerificationTemplate,
+  VerificationTemplateComponent,
+  templateRegistry
+};