"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.imports = void 0;
const lodash_1 = require("lodash");
exports.imports = [];
exports.default = {
    pre: (element, context) => `<>`,
    post: (element, context) => '</>',
    imports: (element, context) => exports.imports,
    createComponent: (e, context, component = 'list') => {
        const result = context.result;
        const widgetName = (0, lodash_1.capitalize)(e.attrs['name']);
        result.components[widgetName] = `React.memo(({$item, $index, ${component}, fragment}) => {
          const item = $item;
          const [currentItemWidgets] = React.useState({});
          ${component}.itemWidgets = ${component}.itemWidgets || [];
          ${component}.itemWidgets[$index] = currentItemWidgets;
          const [listener] = React.useState({
            onComponentInit: (c) => {
              currentItemWidgets[c.name] = c;
              fragment.onComponentInit(c);
            },
            onComponentDestroy: (c) => {
              fragment.onComponentDestroy(c);
              delete currentItemWidgets[c.name];
            }
          });
          const { watch } = useWatcher(fragment.watcher);
          return (${result.markup});
      })`;
        result.markup = `<${widgetName} $item={$item} $index={$index} ${component}={${component}} key={$index} fragment={fragment}/>`;
        return result;
    }
};
//# sourceMappingURL=list-content.transformer.js.map