const STATE_PATTERNS = {
  /**
   * Declare a state variable
   * Variables: name, Name (capitalized), type (optional), initial
   */
  stateDeclaration: {
    react: "const [${name}, set${Name}] = useState<${type}>(${initial});",
    vue: "const ${name} = ref<${type}>(${initial});",
    svelte: "let ${name}: ${type} = ${initial};",
    angular: "${name}: ${type} = ${initial};",
    runtime: "const [${name}, set${Name}] = useState<${type}>(${initial});"
  },
  /**
   * Update a state variable
   * Variables: name, Name (capitalized), value
   */
  stateUpdate: {
    react: "set${Name}(${value});",
    vue: "${name}.value = ${value};",
    svelte: "${name} = ${value};",
    angular: "this.${name} = ${value};",
    runtime: "set${Name}(${value});"
  },
  /**
   * Access a state variable value
   * Variables: name
   */
  stateGetter: {
    react: "${name}",
    vue: "${name}.value",
    svelte: "${name}",
    angular: "this.${name}",
    runtime: "${name}"
  }
};
const RENDER_PATTERNS = {
  /**
   * Render array of items with loop
   * Variables: array, item, key, Component
   */
  loopRender: {
    react: "{${array}.map((${item}) => <${Component} key={${item}.${key}} ${item}={${item}} />)}",
    vue: '<${Component} v-for="${item} in ${array}" :key="${item}.${key}" :${item}="${item}" />',
    svelte: "{#each ${array} as ${item} (${item}.${key})}<${Component} ${item}={${item}} />{/each}",
    angular: '<${component} *ngFor="let ${item} of ${array}; trackBy: track${Item}" [${item}]="${item}"></${component}>',
    runtime: "{${array}.map((${item}) => createElement(${Component}, { key: ${item}.${key}, ${item} }))}"
  },
  /**
   * Conditional rendering
   * Variables: condition, Component, props (optional)
   */
  conditionalRender: {
    react: "{${condition} && <${Component} ${props} />}",
    vue: '<${Component} v-if="${condition}" ${props} />',
    svelte: "{#if ${condition}}<${Component} ${props} />{/if}",
    angular: '<${component} *ngIf="${condition}" ${props}></${component}>',
    runtime: "{${condition} && createElement(${Component}, ${props})}"
  },
  /**
   * Render a component with props
   * Variables: Component, props
   */
  componentRender: {
    react: "<${Component} ${props} />",
    vue: "<${Component} ${props} />",
    svelte: "<${Component} ${props} />",
    angular: "<${component} ${props}></${component}>",
    runtime: "createElement(${Component}, ${props})"
  }
};
const EVENT_PATTERNS = {
  /**
   * Declare event handler function
   * Variables: name, Name (capitalized), params, body
   */
  eventHandler: {
    react: "const handle${Name} = (${params}) => {\n  ${body}\n};",
    vue: "const handle${Name} = (${params}) => {\n  ${body}\n};",
    svelte: "function handle${Name}(${params}) {\n  ${body}\n}",
    angular: "handle${Name}(${params}): void {\n  ${body}\n}",
    runtime: "const handle${Name} = (${params}) => {\n  ${body}\n};"
  },
  /**
   * Bind event to handler
   * Variables: event, handler
   */
  eventBinding: {
    react: "${event}={${handler}}",
    vue: '@${event}="${handler}"',
    svelte: "on:${event}={${handler}}",
    angular: '(${event})="${handler}($event)"',
    runtime: "${event}: ${handler}"
  }
};
const LIFECYCLE_PATTERNS = {
  /**
   * Component mount lifecycle
   * Variables: body
   */
  onMount: {
    react: "useEffect(() => {\n  ${body}\n}, []);",
    vue: "onMounted(() => {\n  ${body}\n});",
    svelte: "onMount(() => {\n  ${body}\n});",
    angular: "ngOnInit(): void {\n  ${body}\n}",
    runtime: "useEffect(() => {\n  ${body}\n}, []);"
  },
  /**
   * Component unmount lifecycle
   * Variables: body
   */
  onUnmount: {
    react: "useEffect(() => {\n  return () => {\n    ${body}\n  };\n}, []);",
    vue: "onUnmounted(() => {\n  ${body}\n});",
    svelte: "onDestroy(() => {\n  ${body}\n});",
    angular: "ngOnDestroy(): void {\n  ${body}\n}",
    runtime: "useEffect(() => {\n  return () => {\n    ${body}\n  };\n}, []);"
  },
  /**
   * Value change/update lifecycle
   * Variables: dependencies, body
   */
  onUpdate: {
    react: "useEffect(() => {\n  ${body}\n}, [${dependencies}]);",
    vue: "watch([${dependencies}], () => {\n  ${body}\n});",
    svelte: "$: if (${dependencies}) {\n  ${body}\n}",
    angular: "ngOnChanges(changes: SimpleChanges): void {\n  ${body}\n}",
    runtime: "useEffect(() => {\n  ${body}\n}, [${dependencies}]);"
  }
};
const PROP_PATTERNS = {
  /**
   * Declare component props/properties
   * Variables: name, type, required (boolean)
   */
  propDeclaration: {
    react: '${name}${required ? "" : "?"}: ${type}',
    vue: "${name}: { type: ${type}, required: ${required} }",
    svelte: 'export let ${name}: ${type}${required ? "" : " | undefined"};',
    angular: '@Input() ${name}${required ? "!" : "?"}: ${type};',
    runtime: '${name}${required ? "" : "?"}: ${type}'
  },
  /**
   * Access props inside component
   * Variables: name
   */
  propAccess: {
    react: "${name}",
    vue: "props.${name}",
    svelte: "${name}",
    angular: "this.${name}",
    runtime: "${name}"
  },
  /**
   * Bind prop value to component
   * Variables: name, value
   */
  propBinding: {
    react: "${name}={${value}}",
    vue: ':${name}="${value}"',
    svelte: "${name}={${value}}",
    angular: '[${name}]="${value}"',
    runtime: "${name}: ${value}"
  }
};
const IMPORT_PATTERNS = {
  /**
   * Import a component
   * Variables: Component, path
   */
  componentImport: {
    react: "import ${Component} from '${path}';",
    vue: "import ${Component} from '${path}';",
    svelte: "import ${Component} from '${path}';",
    angular: "import { ${Component} } from '${path}';",
    runtime: "import ${Component} from '${path}';"
  },
  /**
   * Import hooks/composables
   * Variables: hooks (comma-separated), source
   */
  hookImport: {
    react: "import { ${hooks} } from '${source}';",
    vue: "import { ${hooks} } from '${source}';",
    svelte: "import { ${hooks} } from '${source}';",
    angular: "import { ${hooks} } from '${source}';",
    runtime: "import { ${hooks} } from '${source}';"
  },
  /**
   * Import from library
   * Variables: exports, library
   */
  libraryImport: {
    react: "import { ${exports} } from '${library}';",
    vue: "import { ${exports} } from '${library}';",
    svelte: "import { ${exports} } from '${library}';",
    angular: "import { ${exports} } from '${library}';",
    runtime: "import { ${exports} } from '${library}';"
  }
};
const SYNTAX_PATTERNS = {
  // State
  stateDeclaration: STATE_PATTERNS.stateDeclaration,
  stateUpdate: STATE_PATTERNS.stateUpdate,
  stateGetter: STATE_PATTERNS.stateGetter,
  // Rendering
  loopRender: RENDER_PATTERNS.loopRender,
  conditionalRender: RENDER_PATTERNS.conditionalRender,
  componentRender: RENDER_PATTERNS.componentRender,
  // Events
  eventHandler: EVENT_PATTERNS.eventHandler,
  eventBinding: EVENT_PATTERNS.eventBinding,
  // Lifecycle
  onMount: LIFECYCLE_PATTERNS.onMount,
  onUnmount: LIFECYCLE_PATTERNS.onUnmount,
  onUpdate: LIFECYCLE_PATTERNS.onUpdate,
  // Props
  propDeclaration: PROP_PATTERNS.propDeclaration,
  propAccess: PROP_PATTERNS.propAccess,
  propBinding: PROP_PATTERNS.propBinding,
  // Imports
  componentImport: IMPORT_PATTERNS.componentImport,
  hookImport: IMPORT_PATTERNS.hookImport,
  libraryImport: IMPORT_PATTERNS.libraryImport
};
function replaceTemplateVariables(template, variables) {
  let result = template;
  for (const [key, value] of Object.entries(variables)) {
    const capitalizedKey = key.charAt(0).toUpperCase() + key.slice(1);
    const capitalizedPattern = new RegExp(`\\$\\{${capitalizedKey}\\}`, "g");
    result = result.replace(capitalizedPattern, String(value).charAt(0).toUpperCase() + String(value).slice(1));
    const normalPattern = new RegExp(`\\$\\{${key}\\}`, "g");
    result = result.replace(normalPattern, String(value));
  }
  result = result.replace(/\$\{(\w+)\s*\?\s*"([^"]*)"\s*:\s*"([^"]*)"\}/g, (match, varName, trueVal, falseVal) => {
    const varValue = variables[varName];
    return varValue ? trueVal : falseVal;
  });
  return result;
}
function getSyntaxPattern(pattern, framework, variables) {
  const syntaxPattern = SYNTAX_PATTERNS[pattern];
  if (!syntaxPattern) {
    throw new Error(`Unknown syntax pattern: ${pattern}`);
  }
  const template = syntaxPattern[framework];
  if (!template) {
    throw new Error(`Framework ${framework} not supported for pattern ${pattern}`);
  }
  return replaceTemplateVariables(template, variables);
}
function getAllFrameworkSyntax(pattern, variables) {
  const frameworks = ["react", "vue", "svelte", "angular", "runtime"];
  const result = {};
  for (const framework of frameworks) {
    result[framework] = getSyntaxPattern(pattern, framework, variables);
  }
  return result;
}
function hasPattern(pattern, framework) {
  const syntaxPattern = SYNTAX_PATTERNS[pattern];
  return Boolean(syntaxPattern && syntaxPattern[framework] !== void 0);
}
function getAllPatternKeys() {
  return Object.keys(SYNTAX_PATTERNS);
}
function getPatternsByCategory(category) {
  const categoryMap = {
    state: ["stateDeclaration", "stateUpdate", "stateGetter"],
    render: ["loopRender", "conditionalRender", "componentRender"],
    event: ["eventHandler", "eventBinding"],
    lifecycle: ["onMount", "onUnmount", "onUpdate"],
    prop: ["propDeclaration", "propAccess", "propBinding"],
    import: ["componentImport", "hookImport", "libraryImport"]
  };
  return categoryMap[category] || [];
}
function generateStateCode(framework, stateName, stateType, initialValue) {
  const declaration = getSyntaxPattern("stateDeclaration", framework, {
    name: stateName,
    Name: stateName.charAt(0).toUpperCase() + stateName.slice(1),
    type: stateType,
    initial: initialValue
  });
  const update = (value) => getSyntaxPattern("stateUpdate", framework, {
    name: stateName,
    Name: stateName.charAt(0).toUpperCase() + stateName.slice(1),
    value
  });
  const get = getSyntaxPattern("stateGetter", framework, { name: stateName });
  return { declaration, update, get };
}
function generateEventCode(framework, eventName, handlerName, params, body) {
  const handler = getSyntaxPattern("eventHandler", framework, {
    name: handlerName,
    Name: handlerName.charAt(0).toUpperCase() + handlerName.slice(1),
    params,
    body
  });
  const binding = getSyntaxPattern("eventBinding", framework, {
    event: eventName,
    handler: `handle${handlerName.charAt(0).toUpperCase() + handlerName.slice(1)}`
  });
  return { handler, binding };
}
export {
  EVENT_PATTERNS,
  IMPORT_PATTERNS,
  LIFECYCLE_PATTERNS,
  PROP_PATTERNS,
  RENDER_PATTERNS,
  STATE_PATTERNS,
  SYNTAX_PATTERNS,
  generateEventCode,
  generateStateCode,
  getAllFrameworkSyntax,
  getAllPatternKeys,
  getPatternsByCategory,
  getSyntaxPattern,
  hasPattern,
  replaceTemplateVariables
};
