@aws-amplify/amplify-util-uibuilder 1.2.13 → 1.2.15-beta.0

package/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.2.15-beta.0](https://github.com/aws-amplify/amplify-cli/compare/@aws-amplify/amplify-util-uibuilder@1.2.14...@aws-amplify/amplify-util-uibuilder@1.2.15-beta.0) (2022-03-07)
+
+
+### Bug Fixes
+
+* uibuilder e2e tests ([#9922](https://github.com/aws-amplify/amplify-cli/issues/9922)) ([11d172b](https://github.com/aws-amplify/amplify-cli/commit/11d172bf7c9acca5c6a20cdfd49818aadfc13f04))
+
+
+
+
+
+## [1.2.14](https://github.com/aws-amplify/amplify-cli/compare/@aws-amplify/amplify-util-uibuilder@1.2.13...@aws-amplify/amplify-util-uibuilder@1.2.14) (2022-02-25)
+
+**Note:** Version bump only for package @aws-amplify/amplify-util-uibuilder
+
+
+
+
+
 ## [1.2.13](https://github.com/aws-amplify/amplify-cli/compare/@aws-amplify/amplify-util-uibuilder@1.2.12...@aws-amplify/amplify-util-uibuilder@1.2.13) (2022-02-18)
 
 **Note:** Version bump only for package @aws-amplify/amplify-util-uibuilder

package/lib/commands/generateComponents.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"generateComponents.d.ts","sourceRoot":"","sources":["../../src/commands/generateComponents.ts"],"names":[],"mappings":"AAWA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAE9C,wBAAsB,GAAG,CAAC,OAAO,EAAE,UAAU,iBAsC5C"}
+{"version":3,"file":"generateComponents.d.ts","sourceRoot":"","sources":["../../src/commands/generateComponents.ts"],"names":[],"mappings":"AAYA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAE9C,wBAAsB,GAAG,CAAC,OAAO,EAAE,UAAU,iBAyC5C"}

package/lib/commands/generateComponents.js

@@ -39,12 +39,15 @@ async function run(context) {
         else {
             spinner.succeed('Synced UI components.');
         }
+        (0, notifyMissingPackages_1.notifyMissingPackages)(context, [
+            ...generatedComponentResults.filter(({ resultType }) => resultType === 'SUCCESS').map(({ component }) => component),
+            ...generatedThemeResults.filter(({ resultType }) => resultType === 'SUCCESS').map(({ theme }) => theme),
+        ]);
     }
     catch (e) {
         amplify_prompts_1.printer.debug(e);
         spinner.fail('Failed to sync UI components');
     }
-    (0, notifyMissingPackages_1.notifyMissingPackages)(context);
 }
 exports.run = run;
 //# sourceMappingURL=generateComponents.js.map

package/lib/commands/generateComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"generateComponents.js","sourceRoot":"","sources":["../../src/commands/generateComponents.ts"],"names":[],"mappings":";;;;;;AAAA,yEAAsE;AACtE,2EAAwE;AACxE,2FAKgD;AAChD,+EAAqF;AACrF,qDAA0C;AAC1C,8CAAsB;AAGf,KAAK,UAAU,GAAG,CAAC,OAAmB;IAC3C,yBAAO,CAAC,KAAK,CAAC,+DAA+D,CAAC,CAAC;IAC/E,IAAI,CAAC,CAAC,MAAM,IAAA,+CAAsB,EAAC,OAAO,CAAC,CAAC,EAAE;QAC5C,OAAO;KACR;IACD,MAAM,OAAO,GAAG,IAAA,aAAG,EAAC,EAAE,CAAC,CAAC;IACxB,IAAI;QACF,MAAM,CAAC,gBAAgB,EAAE,YAAY,CAAC,GAAG,MAAM,OAAO,CAAC,GAAG,CAAC,CAAC,IAAA,wDAAuB,EAAC,OAAO,CAAC,EAAE,IAAA,oDAAmB,EAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAC7H,IAAI,gBAAgB,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,IAAI,YAAY,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE;YAChF,yBAAO,CAAC,KAAK,CAAC,wDAAwD,CAAC,CAAC;YACxE,OAAO;SACR;QAED,OAAO,CAAC,KAAK,CAAC,6BAA6B,CAAC,CAAC;QAC7C,MAAM,yBAAyB,GAAG,IAAA,4DAA2B,EAAC,OAAO,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;QAClG,MAAM,qBAAqB,GAAG,IAAA,wDAAuB,EAAC,OAAO,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC;QAEtF,IAAA,4DAAiC,EAAC,OAAO,EAAE;YACzC,GAAG,yBAAyB,CAAC,MAAM,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,UAAU,KAAK,SAAS,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,SAAS,CAAC;YACnH,GAAG,qBAAqB,CAAC,MAAM,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,UAAU,KAAK,SAAS,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC;SACxG,CAAC,CAAC;QAEH,MAAM,aAAa,GAAG;YACpB,GAAG,yBAAyB,CAAC,MAAM,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,UAAU,KAAK,SAAS,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,UAAU,CAAC;YACrH,GAAG,qBAAqB,CAAC,MAAM,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,UAAU,KAAK,SAAS,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,UAAU,CAAC;SAClH,CAAC;QAEF,IAAI,aAAa,CAAC,MAAM,GAAG,CAAC,EAAE;YAC5B,OAAO,CAAC,IAAI,CAAC,4CAA4C,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;SACtF;aAAM;YACL,OAAO,CAAC,OAAO,CAAC,uBAAuB,CAAC,CAAC;SAC1C;KACF;IAAC,OAAO,CAAC,EAAE;QACV,yBAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;QACjB,OAAO,CAAC,IAAI,CAAC,8BAA8B,CAAC,CAAC;KAC9C;IAED,IAAA,6CAAqB,EAAC,OAAO,CAAC,CAAC;AACjC,CAAC;AAtCD,kBAsCC"}
+{"version":3,"file":"generateComponents.js","sourceRoot":"","sources":["../../src/commands/generateComponents.ts"],"names":[],"mappings":"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"}

package/lib/commands/utils/createUiBuilderComponent.d.ts

@@ -1,5 +1,7 @@
+import { StudioComponent, RenderTextComponentResponse } from '@aws-amplify/codegen-ui-old';
+import { StudioComponent as StudioComponentNew, StudioTheme } from '@aws-amplify/codegen-ui-new';
 import { $TSContext } from 'amplify-cli-core';
-export declare const createUiBuilderComponent: (context: $TSContext, schema: any) => any;
-export declare const createUiBuilderTheme: (context: $TSContext, schema: any) => any;
-export declare const generateAmplifyUiBuilderIndexFile: (context: $TSContext, schemas: any[]) => import("@aws-amplify/codegen-ui").RenderTextComponentResponse;
+export declare const createUiBuilderComponent: (context: $TSContext, schema: StudioComponent) => StudioComponentNew | StudioComponent;
+export declare const createUiBuilderTheme: (context: $TSContext, schema: StudioTheme) => StudioTheme;
+export declare const generateAmplifyUiBuilderIndexFile: (context: $TSContext, schemas: StudioComponentNew[]) => RenderTextComponentResponse;
 //# sourceMappingURL=createUiBuilderComponent.d.ts.map

package/lib/commands/utils/createUiBuilderComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createUiBuilderComponent.d.ts","sourceRoot":"","sources":["../../../src/commands/utils/createUiBuilderComponent.ts"],"names":[],"mappings":"AAWA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAQ9C,eAAO,MAAM,wBAAwB,YAAa,UAAU,UAAU,GAAG,QAaxE,CAAC;AAEF,eAAO,MAAM,oBAAoB,YAAa,UAAU,UAAU,GAAG,QAoBpE,CAAC;AAEF,eAAO,MAAM,iCAAiC,YAAa,UAAU,WAAW,GAAG,EAAE,kEAkBpF,CAAC"}
+{"version":3,"file":"createUiBuilderComponent.d.ts","sourceRoot":"","sources":["../../../src/commands/utils/createUiBuilderComponent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiC,eAAe,EAAiF,2BAA2B,EAAE,MAAM,6BAA6B,CAAC;AASzM,OAAO,EAAC,eAAe,IAAI,kBAAkB,EAAE,WAAW,EAAC,MAAM,6BAA6B,CAAC;AAG/F,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAc9C,eAAO,MAAM,wBAAwB,YAAa,UAAU,UAAU,eAAe,yCAuBpF,CAAC;AAEF,eAAO,MAAM,oBAAoB,YAAa,UAAU,UAAU,WAAW,gBAmB5E,CAAC;AAEF,eAAO,MAAM,iCAAiC,YAAa,UAAU,WAAW,kBAAkB,EAAE,gCAgBhG,CAAC"}

package/lib/commands/utils/createUiBuilderComponent.js

@@ -1,36 +1,42 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.generateAmplifyUiBuilderIndexFile = exports.createUiBuilderTheme = exports.createUiBuilderComponent = void 0;
-const codegen_ui_1 = require("@aws-amplify/codegen-ui");
-const codegen_ui_react_1 = require("@aws-amplify/codegen-ui-react");
+const codegen_ui_old_1 = require("@aws-amplify/codegen-ui-old");
+const codegen_ui_react_old_1 = require("@aws-amplify/codegen-ui-react-old");
 const getUiBuilderComponentsPath_1 = require("./getUiBuilderComponentsPath");
 const amplify_prompts_1 = require("amplify-prompts");
+const createUiBuilderComponentNew_1 = require("./createUiBuilderComponentNew");
+const codegen_ui_react_new_1 = require("@aws-amplify/codegen-ui-react-new");
 const config = {
-    module: codegen_ui_react_1.ModuleKind.ES2020,
-    target: codegen_ui_react_1.ScriptTarget.ES2020,
-    script: codegen_ui_react_1.ScriptKind.JSX,
+    module: codegen_ui_react_old_1.ModuleKind.ES2020,
+    target: codegen_ui_react_old_1.ScriptTarget.ES2020,
+    script: codegen_ui_react_old_1.ScriptKind.JSX,
     renderTypeDeclarations: true,
 };
+const isUpdatedSchema = (schema) => {
+    return schema.schemaVersion && schema.schemaVersion === '1.0';
+};
 const createUiBuilderComponent = (context, schema) => {
+    if (isUpdatedSchema(schema)) {
+        return (0, createUiBuilderComponentNew_1.createUiBuilderComponent)(context, schema);
+    }
     const uiBuilderComponentsPath = (0, getUiBuilderComponentsPath_1.getUiBuilderComponentsPath)(context);
-    const rendererFactory = new codegen_ui_1.StudioTemplateRendererFactory((component) => new codegen_ui_react_1.AmplifyRenderer(component, config));
+    const rendererFactory = new codegen_ui_old_1.StudioTemplateRendererFactory((component) => new codegen_ui_react_old_1.AmplifyRenderer(component, config));
     const outputPathDir = uiBuilderComponentsPath;
-    const outputConfig = {
+    const rendererManager = new codegen_ui_old_1.StudioTemplateRendererManager(rendererFactory, {
         outputPathDir,
-    };
-    const rendererManager = new codegen_ui_1.StudioTemplateRendererManager(rendererFactory, outputConfig);
+    });
     rendererManager.renderSchemaToTemplate(schema);
     return schema;
 };
 exports.createUiBuilderComponent = createUiBuilderComponent;
 const createUiBuilderTheme = (context, schema) => {
     const uiBuilderComponentsPath = (0, getUiBuilderComponentsPath_1.getUiBuilderComponentsPath)(context);
-    const rendererFactory = new codegen_ui_1.StudioTemplateRendererFactory((component) => new codegen_ui_react_1.ReactThemeStudioTemplateRenderer(component, config));
+    const rendererFactory = new codegen_ui_old_1.StudioTemplateRendererFactory((component) => new codegen_ui_react_old_1.ReactThemeStudioTemplateRenderer(component, config));
     const outputPathDir = uiBuilderComponentsPath;
-    const outputConfig = {
+    const rendererManager = new codegen_ui_old_1.StudioTemplateRendererManager(rendererFactory, {
         outputPathDir,
-    };
-    const rendererManager = new codegen_ui_1.StudioTemplateRendererManager(rendererFactory, outputConfig);
+    });
     try {
         rendererManager.renderSchemaToTemplate(schema);
         return schema;
@@ -45,12 +51,11 @@ const createUiBuilderTheme = (context, schema) => {
 exports.createUiBuilderTheme = createUiBuilderTheme;
 const generateAmplifyUiBuilderIndexFile = (context, schemas) => {
     const uiBuilderComponentsPath = (0, getUiBuilderComponentsPath_1.getUiBuilderComponentsPath)(context);
-    const rendererFactory = new codegen_ui_1.StudioTemplateRendererFactory((component) => new codegen_ui_react_1.ReactIndexStudioTemplateRenderer(component, config));
+    const rendererFactory = new codegen_ui_old_1.StudioTemplateRendererFactory((component) => new codegen_ui_react_new_1.ReactIndexStudioTemplateRenderer(component, config));
     const outputPathDir = uiBuilderComponentsPath;
-    const outputConfig = {
+    const rendererManager = new codegen_ui_old_1.StudioTemplateRendererManager(rendererFactory, {
         outputPathDir,
-    };
-    const rendererManager = new codegen_ui_1.StudioTemplateRendererManager(rendererFactory, outputConfig);
+    });
     try {
         return rendererManager.renderSchemaToTemplate(schemas);
     }

package/lib/commands/utils/createUiBuilderComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"createUiBuilderComponent.js","sourceRoot":"","sources":["../../../src/commands/utils/createUiBuilderComponent.ts"],"names":[],"mappings":";;;AAAA,wDAAwH;AACxH,oEAOuC;AACvC,6EAA0E;AAC1E,qDAA0C;AAE1C,MAAM,MAAM,GAAG;IACb,MAAM,EAAE,6BAAU,CAAC,MAAM;IACzB,MAAM,EAAE,+BAAY,CAAC,MAAM;IAC3B,MAAM,EAAE,6BAAU,CAAC,GAAG;IACtB,sBAAsB,EAAE,IAAI;CAC7B,CAAC;AAEK,MAAM,wBAAwB,GAAG,CAAC,OAAmB,EAAE,MAAW,EAAE,EAAE;IAC3E,MAAM,uBAAuB,GAAG,IAAA,uDAA0B,EAAC,OAAO,CAAC,CAAC;IACpE,MAAM,eAAe,GAAG,IAAI,0CAA6B,CAAC,CAAC,SAA0B,EAAE,EAAE,CAAC,IAAI,kCAAe,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC;IAElI,MAAM,aAAa,GAAG,uBAAuB,CAAC;IAC9C,MAAM,YAAY,GAAG;QACnB,aAAa;KACd,CAAC;IAEF,MAAM,eAAe,GAAG,IAAI,0CAA6B,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC;IAEzF,eAAe,CAAC,sBAAsB,CAAC,MAAM,CAAC,CAAC;IAC/C,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC;AAbW,QAAA,wBAAwB,4BAanC;AAEK,MAAM,oBAAoB,GAAG,CAAC,OAAmB,EAAE,MAAW,EAAE,EAAE;IACvE,MAAM,uBAAuB,GAAG,IAAA,uDAA0B,EAAC,OAAO,CAAC,CAAC;IACpE,MAAM,eAAe,GAAG,IAAI,0CAA6B,CAAC,CAAC,SAAc,EAAE,EAAE,CAAC,IAAI,mDAAgC,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC;IAEvI,MAAM,aAAa,GAAG,uBAAuB,CAAC;IAC9C,MAAM,YAAY,GAAG;QACnB,aAAa;KACd,CAAC;IAEF,MAAM,eAAe,GAAG,IAAI,0CAA6B,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC;IAEzF,IAAI;QACF,eAAe,CAAC,sBAAsB,CAAC,MAAM,CAAC,CAAC;QAC/C,OAAO,MAAM,CAAC;KACf;IAAC,OAAO,CAAC,EAAE;QACV,yBAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;QACjB,yBAAO,CAAC,KAAK,CAAC,oCAAoC,CAAC,CAAC;QACpD,yBAAO,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC;QAC/C,MAAM,CAAC,CAAC;KACT;AACH,CAAC,CAAC;AApBW,QAAA,oBAAoB,wBAoB/B;AAEK,MAAM,iCAAiC,GAAG,CAAC,OAAmB,EAAE,OAAc,EAAE,EAAE;IACvF,MAAM,uBAAuB,GAAG,IAAA,uDAA0B,EAAC,OAAO,CAAC,CAAC;IACpE,MAAM,eAAe,GAAG,IAAI,0CAA6B,CAAC,CAAC,SAAc,EAAE,EAAE,CAAC,IAAI,mDAAgC,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC;IAEvI,MAAM,aAAa,GAAG,uBAAuB,CAAC;IAC9C,MAAM,YAAY,GAAG;QACnB,aAAa;KACd,CAAC;IAEF,MAAM,eAAe,GAAG,IAAI,0CAA6B,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC;IAEzF,IAAI;QACF,OAAO,eAAe,CAAC,sBAAsB,CAAC,OAAO,CAAC,CAAC;KACxD;IAAC,OAAO,CAAC,EAAE;QACV,yBAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;QACjB,yBAAO,CAAC,KAAK,CAAC,yCAAyC,CAAC,CAAC;QACzD,MAAM,CAAC,CAAC;KACT;AACH,CAAC,CAAC;AAlBW,QAAA,iCAAiC,qCAkB5C"}
+{"version":3,"file":"createUiBuilderComponent.js","sourceRoot":"","sources":["../../../src/commands/utils/createUiBuilderComponent.ts"],"names":[],"mappings":"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"}

package/lib/commands/utils/createUiBuilderComponentNew.d.ts

@@ -0,0 +1,5 @@
+import { StudioComponent, StudioTheme } from '@aws-amplify/codegen-ui-new';
+import { $TSContext } from 'amplify-cli-core';
+export declare const createUiBuilderComponent: (context: $TSContext, schema: StudioComponent) => StudioComponent;
+export declare const createUiBuilderTheme: (context: $TSContext, schema: StudioTheme) => StudioTheme;
+//# sourceMappingURL=createUiBuilderComponentNew.d.ts.map

package/lib/commands/utils/createUiBuilderComponentNew.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createUiBuilderComponentNew.d.ts","sourceRoot":"","sources":["../../../src/commands/utils/createUiBuilderComponentNew.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgE,eAAe,EAAE,WAAW,EAA+E,MAAM,6BAA6B,CAAC;AAWtN,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAQ9C,eAAO,MAAM,wBAAwB,YAAa,UAAU,UAAU,eAAe,oBAYpF,CAAC;AAEF,eAAO,MAAM,oBAAoB,YAAa,UAAU,UAAU,WAAW,gBAmB5E,CAAC"}

package/lib/commands/utils/createUiBuilderComponentNew.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createUiBuilderTheme = exports.createUiBuilderComponent = void 0;
+const codegen_ui_new_1 = require("@aws-amplify/codegen-ui-new");
+const codegen_ui_react_new_1 = require("@aws-amplify/codegen-ui-react-new");
+const getUiBuilderComponentsPath_1 = require("./getUiBuilderComponentsPath");
+const amplify_prompts_1 = require("amplify-prompts");
+const config = {
+    module: codegen_ui_react_new_1.ModuleKind.ES2020,
+    target: codegen_ui_react_new_1.ScriptTarget.ES2020,
+    script: codegen_ui_react_new_1.ScriptKind.JSX,
+    renderTypeDeclarations: true,
+};
+const createUiBuilderComponent = (context, schema) => {
+    const uiBuilderComponentsPath = (0, getUiBuilderComponentsPath_1.getUiBuilderComponentsPath)(context);
+    const rendererFactory = new codegen_ui_new_1.StudioTemplateRendererFactory((component) => new codegen_ui_react_new_1.AmplifyRenderer(component, config));
+    const outputPathDir = uiBuilderComponentsPath;
+    const rendererManager = new codegen_ui_new_1.StudioTemplateRendererManager(rendererFactory, {
+        outputPathDir,
+    });
+    rendererManager.renderSchemaToTemplate(schema);
+    return schema;
+};
+exports.createUiBuilderComponent = createUiBuilderComponent;
+const createUiBuilderTheme = (context, schema) => {
+    const uiBuilderComponentsPath = (0, getUiBuilderComponentsPath_1.getUiBuilderComponentsPath)(context);
+    const rendererFactory = new codegen_ui_new_1.StudioTemplateRendererFactory((component) => new codegen_ui_react_new_1.ReactThemeStudioTemplateRenderer(component, config));
+    const outputPathDir = uiBuilderComponentsPath;
+    const rendererManager = new codegen_ui_new_1.StudioTemplateRendererManager(rendererFactory, {
+        outputPathDir,
+    });
+    try {
+        rendererManager.renderSchemaToTemplate(schema);
+        return schema;
+    }
+    catch (e) {
+        amplify_prompts_1.printer.debug(e);
+        amplify_prompts_1.printer.debug('Skipping invalid theme with schema');
+        amplify_prompts_1.printer.debug(JSON.stringify(schema, null, 2));
+        throw e;
+    }
+};
+exports.createUiBuilderTheme = createUiBuilderTheme;
+//# sourceMappingURL=createUiBuilderComponentNew.js.map

package/lib/commands/utils/createUiBuilderComponentNew.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createUiBuilderComponentNew.js","sourceRoot":"","sources":["../../../src/commands/utils/createUiBuilderComponentNew.ts"],"names":[],"mappings":";;;AAAA,gEAAsN;AACtN,4EAO2C;AAC3C,6EAA0E;AAC1E,qDAA0C;AAE1C,MAAM,MAAM,GAAG;IACb,MAAM,EAAE,iCAAU,CAAC,MAAM;IACzB,MAAM,EAAE,mCAAY,CAAC,MAAM;IAC3B,MAAM,EAAE,iCAAU,CAAC,GAAG;IACtB,sBAAsB,EAAE,IAAI;CAC7B,CAAC;AAEK,MAAM,wBAAwB,GAAG,CAAC,OAAmB,EAAE,MAAuB,EAAE,EAAE;IACvF,MAAM,uBAAuB,GAAG,IAAA,uDAA0B,EAAC,OAAO,CAAC,CAAC;IACpE,MAAM,eAAe,GAAG,IAAI,8CAA6B,CAAC,CAAC,SAA0B,EAAE,EAAE,CAAC,IAAI,sCAAe,CAAC,SAAS,EAAE,MAAM,CAA8H,CAAC,CAAC;IAE/P,MAAM,aAAa,GAAG,uBAAuB,CAAC;IAE9C,MAAM,eAAe,GAAG,IAAI,8CAA6B,CAAC,eAAe,EAAE;QACzE,aAAa;KACd,CAAC,CAAC;IAEH,eAAe,CAAC,sBAAsB,CAAC,MAAM,CAAC,CAAC;IAC/C,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC;AAZW,QAAA,wBAAwB,4BAYnC;AAEK,MAAM,oBAAoB,GAAG,CAAC,OAAmB,EAAE,MAAmB,EAAE,EAAE;IAC/E,MAAM,uBAAuB,GAAG,IAAA,uDAA0B,EAAC,OAAO,CAAC,CAAC;IACpE,MAAM,eAAe,GAAG,IAAI,8CAA6B,CAAC,CAAC,SAAsB,EAAE,EAAE,CAAC,IAAI,uDAAgC,CAAC,SAAS,EAAE,MAAM,CAA0H,CAAC,CAAC;IAExQ,MAAM,aAAa,GAAG,uBAAuB,CAAC;IAE9C,MAAM,eAAe,GAAG,IAAI,8CAA6B,CAAC,eAAe,EAAE;QACzE,aAAa;KACd,CAAC,CAAC;IAEH,IAAI;QACF,eAAe,CAAC,sBAAsB,CAAC,MAAM,CAAC,CAAC;QAC/C,OAAO,MAAM,CAAC;KACf;IAAC,OAAO,CAAC,EAAE;QACV,yBAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;QACjB,yBAAO,CAAC,KAAK,CAAC,oCAAoC,CAAC,CAAC;QACpD,yBAAO,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC;QAC/C,MAAM,CAAC,CAAC;KACT;AACH,CAAC,CAAC;AAnBW,QAAA,oBAAoB,wBAmB/B"}

package/lib/commands/utils/notifyMissingPackages.d.ts

@@ -1,3 +1,4 @@
 import { $TSContext } from 'amplify-cli-core';
-export declare const notifyMissingPackages: (context: $TSContext) => void;
+import { StudioComponent } from '@aws-amplify/codegen-ui-new';
+export declare const notifyMissingPackages: (context: $TSContext, schemas: StudioComponent[]) => void;
 //# sourceMappingURL=notifyMissingPackages.d.ts.map

package/lib/commands/utils/notifyMissingPackages.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"notifyMissingPackages.d.ts","sourceRoot":"","sources":["../../../src/commands/utils/notifyMissingPackages.ts"],"names":[],"mappings":"AAAA,OAAO,EAA8B,UAAU,EAAU,MAAM,kBAAkB,CAAC;AAOlF,eAAO,MAAM,qBAAqB,YAAa,UAAU,SAwBxD,CAAC"}
+{"version":3,"file":"notifyMissingPackages.d.ts","sourceRoot":"","sources":["../../../src/commands/utils/notifyMissingPackages.ts"],"names":[],"mappings":"AAAA,OAAO,EAA8B,UAAU,EAAU,MAAM,kBAAkB,CAAC;AAQlF,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAa9D,eAAO,MAAM,qBAAqB,YAAa,UAAU,WAAW,eAAe,EAAE,SA8BpF,CAAC"}

package/lib/commands/utils/notifyMissingPackages.js

@@ -8,9 +8,20 @@ const amplify_cli_core_1 = require("amplify-cli-core");
 const amplify_prompts_1 = require("amplify-prompts");
 const fs_extra_1 = __importDefault(require("fs-extra"));
 const path_1 = __importDefault(require("path"));
+const subset_1 = __importDefault(require("semver/ranges/subset"));
 const extractArgs_1 = require("./extractArgs");
-const REQUIRED_PACKAGES = { '@aws-amplify/ui-react': '*', 'aws-amplify': '*' };
-const notifyMissingPackages = (context) => {
+const codegen_ui_react_old_1 = require("@aws-amplify/codegen-ui-react-old");
+const codegen_ui_react_new_1 = require("@aws-amplify/codegen-ui-react-new");
+const isUpdatedSchema = (schemas) => {
+    return schemas.some(schema => schema.schemaVersion && schema.schemaVersion === '1.0');
+};
+const getRequiredDependencies = (schemas) => {
+    if (isUpdatedSchema(schemas)) {
+        return new codegen_ui_react_new_1.ReactRequiredDependencyProvider().getRequiredDependencies();
+    }
+    return new codegen_ui_react_old_1.ReactRequiredDependencyProvider().getRequiredDependencies();
+};
+const notifyMissingPackages = (context, schemas) => {
     var _a;
     const args = (0, extractArgs_1.extractArgs)(context);
     const localEnvFilePath = (_a = args.localEnvFilePath) !== null && _a !== void 0 ? _a : amplify_cli_core_1.pathManager.getLocalEnvFilePath();
@@ -25,21 +36,15 @@ const notifyMissingPackages = (context) => {
         return;
     }
     const packageJson = amplify_cli_core_1.JSONUtilities.readJson(packageJsonPath);
-    Object.keys(REQUIRED_PACKAGES).forEach(packageName => {
-        const packageIsInstalled = Object.keys(packageJson.dependencies).includes(packageName);
+    getRequiredDependencies(schemas).forEach((dependency) => {
+        const packageIsInstalled = Object.keys(packageJson.dependencies).includes(dependency.dependencyName);
         if (!packageIsInstalled) {
-            amplify_prompts_1.printer.warn(`UIBuilder components required "${packageName}" that is not in your package.json. Run \`npm install ${packageName}\``);
+            amplify_prompts_1.printer.warn(`UIBuilder components required "${dependency.dependencyName}" that is not in your package.json. Run \`npm install "${dependency.dependencyName}@${dependency.supportedSemVerPattern}"\`. ${dependency.reason}`);
         }
-        else if (!packageVersionMatches(REQUIRED_PACKAGES[packageName], packageJson.dependencies[packageName])) {
-            amplify_prompts_1.printer.warn(`UIBuilder components requires version "${REQUIRED_PACKAGES[packageName]}" of "${packageName}". You currently are on version "${packageJson.dependencies[packageName]}".`);
+        else if (!(0, subset_1.default)(packageJson.dependencies[dependency.dependencyName], dependency.supportedSemVerPattern)) {
+            amplify_prompts_1.printer.warn(`UIBuilder components requires version "${dependency.supportedSemVerPattern}" of "${dependency.dependencyName}". You currently are on version "${packageJson.dependencies[dependency.dependencyName]}". Run \`npm install "${dependency.dependencyName}@${dependency.supportedSemVerPattern}"\`. ${dependency.reason}`);
         }
     });
 };
 exports.notifyMissingPackages = notifyMissingPackages;
-const packageVersionMatches = (requiredVersion, existingVersion) => {
-    if (requiredVersion === '*') {
-        return true;
-    }
-    return requiredVersion === existingVersion;
-};
 //# sourceMappingURL=notifyMissingPackages.js.map

package/lib/commands/utils/notifyMissingPackages.js.map

@@ -1 +1 @@
-{"version":3,"file":"notifyMissingPackages.js","sourceRoot":"","sources":["../../../src/commands/utils/notifyMissingPackages.ts"],"names":[],"mappings":";;;;;;AAAA,uDAAkF;AAClF,qDAA0C;AAC1C,wDAA0B;AAC1B,gDAAwB;AACxB,+CAA4C;AAC5C,MAAM,iBAAiB,GAA8B,EAAE,uBAAuB,EAAE,GAAG,EAAE,aAAa,EAAE,GAAG,EAAE,CAAC;AAEnG,MAAM,qBAAqB,GAAG,CAAC,OAAmB,EAAE,EAAE;;IAC3D,MAAM,IAAI,GAAG,IAAA,yBAAW,EAAC,OAAO,CAAC,CAAC;IAClC,MAAM,gBAAgB,GAAG,MAAA,IAAI,CAAC,gBAAgB,mCAAI,8BAAW,CAAC,mBAAmB,EAAE,CAAC;IACpF,IAAI,CAAC,kBAAE,CAAC,UAAU,CAAC,gBAAgB,CAAC,EAAE;QACpC,yBAAO,CAAC,KAAK,CAAC,8EAA8E,CAAC,CAAC;QAC9F,OAAO;KACR;IACD,MAAM,YAAY,GAAG,gCAAa,CAAC,QAAQ,CAAC,gBAAgB,CAAC,CAAC;IAC9D,MAAM,eAAe,GAAG,cAAI,CAAC,IAAI,CAAE,YAAuB,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC;IACxF,IAAI,CAAC,kBAAE,CAAC,UAAU,CAAC,eAAe,CAAC,EAAE;QACnC,yBAAO,CAAC,KAAK,CAAC,iEAAiE,CAAC,CAAC;QACjF,OAAO;KACR;IACD,MAAM,WAAW,GAAG,gCAAa,CAAC,QAAQ,CAAC,eAAe,CAAgD,CAAC;IAC3G,MAAM,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE;QACnD,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;QACvF,IAAI,CAAC,kBAAkB,EAAE;YACvB,yBAAO,CAAC,IAAI,CAAC,kCAAkC,WAAW,yDAAyD,WAAW,IAAI,CAAC,CAAC;SACrI;aAAM,IAAI,CAAC,qBAAqB,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAAE,WAAW,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,EAAE;YACxG,yBAAO,CAAC,IAAI,CACV,0CAA0C,iBAAiB,CAAC,WAAW,CAAC,SAAS,WAAW,oCAAoC,WAAW,CAAC,YAAY,CAAC,WAAW,CAAC,IAAI,CAC1K,CAAC;SACH;IACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAxBW,QAAA,qBAAqB,yBAwBhC;AAEF,MAAM,qBAAqB,GAAG,CAAC,eAAuB,EAAE,eAAuB,EAAE,EAAE;IACjF,IAAI,eAAe,KAAK,GAAG,EAAE;QAC3B,OAAO,IAAI,CAAC;KACb;IAED,OAAO,eAAe,KAAK,eAAe,CAAC;AAC7C,CAAC,CAAC"}
+{"version":3,"file":"notifyMissingPackages.js","sourceRoot":"","sources":["../../../src/commands/utils/notifyMissingPackages.ts"],"names":[],"mappings":";;;;;;AAAA,uDAAkF;AAClF,qDAA0C;AAC1C,wDAA0B;AAC1B,gDAAwB;AACxB,kEAA+C;AAC/C,+CAA4C;AAC5C,4EAAoF;AACpF,4EAA0H;AAG1H,MAAM,eAAe,GAAG,CAAC,OAA0B,EAAE,EAAE;IACrD,OAAO,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,aAAa,IAAI,MAAM,CAAC,aAAa,KAAK,KAAK,CAAC,CAAC;AACxF,CAAC,CAAC;AAEF,MAAM,uBAAuB,GAAG,CAAC,OAA0B,EAAE,EAAE;IAC7D,IAAI,eAAe,CAAC,OAAO,CAAC,EAAE;QAC5B,OAAO,IAAI,sDAAkC,EAAE,CAAC,uBAAuB,EAAE,CAAC;KAC3E;IACD,OAAO,IAAI,sDAA+B,EAAE,CAAC,uBAAuB,EAAE,CAAC;AACzE,CAAC,CAAC;AAEK,MAAM,qBAAqB,GAAG,CAAC,OAAmB,EAAE,OAA0B,EAAE,EAAE;;IACvF,MAAM,IAAI,GAAG,IAAA,yBAAW,EAAC,OAAO,CAAC,CAAC;IAClC,MAAM,gBAAgB,GAAG,MAAA,IAAI,CAAC,gBAAgB,mCAAI,8BAAW,CAAC,mBAAmB,EAAE,CAAC;IACpF,IAAI,CAAC,kBAAE,CAAC,UAAU,CAAC,gBAAgB,CAAC,EAAE;QACpC,yBAAO,CAAC,KAAK,CAAC,8EAA8E,CAAC,CAAC;QAC9F,OAAO;KACR;IACD,MAAM,YAAY,GAAG,gCAAa,CAAC,QAAQ,CAAC,gBAAgB,CAAC,CAAC;IAC9D,MAAM,eAAe,GAAG,cAAI,CAAC,IAAI,CAAE,YAAuB,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC;IACxF,IAAI,CAAC,kBAAE,CAAC,UAAU,CAAC,eAAe,CAAC,EAAE;QACnC,yBAAO,CAAC,KAAK,CAAC,iEAAiE,CAAC,CAAC;QACjF,OAAO;KACR;IACD,MAAM,WAAW,GAAG,gCAAa,CAAC,QAAQ,CAAC,eAAe,CAAgD,CAAC;IAC3G,uBAAuB,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,UAAkB,EAAE,EAAE;QAC9D,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC;QACrG,IAAI,CAAC,kBAAkB,EAAE;YACvB,yBAAO,CAAC,IAAI,CACV,kCAAkC,UAAU,CAAC,cAAc,0DAA0D,UAAU,CAAC,cAAc,IAAI,UAAU,CAAC,sBAAsB,QAAQ,UAAU,CAAC,MAAM,EAAE,CAC/M,CAAC;SACH;aAAM,IAAI,CAAC,IAAA,gBAAW,EAAC,WAAW,CAAC,YAAY,CAAC,UAAU,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,sBAAsB,CAAC,EAAE;YAC/G,yBAAO,CAAC,IAAI,CACV,0CAA0C,UAAU,CAAC,sBAAsB,SACzE,UAAU,CAAC,cACb,oCAAoC,WAAW,CAAC,YAAY,CAAC,UAAU,CAAC,cAAc,CAAC,yBACrF,UAAU,CAAC,cACb,IAAI,UAAU,CAAC,sBAAsB,QAAQ,UAAU,CAAC,MAAM,EAAE,CACjE,CAAC;SACH;IACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AA9BW,QAAA,qBAAqB,yBA8BhC"}

package/lib/commands/utils/syncAmplifyUiBuilderComponents.d.ts

@@ -7,7 +7,7 @@ export declare function listUiBuilderComponents(context: $TSContext, envName?: s
 export declare function listUiBuilderThemes(context: $TSContext, envName?: string): Promise<import("aws-sdk/lib/request").PromiseResult<aws.AmplifyUIBuilder.ExportThemesResponse, aws.AWSError>>;
 export declare function generateUiBuilderComponents(context: $TSContext, componentSchemas: any[]): ({
     resultType: string;
-    component: any;
+    component: import("@aws-amplify/codegen-ui-new").StudioComponent | import("@aws-amplify/codegen-ui-old").StudioComponent;
     schemaName?: undefined;
     error?: undefined;
 } | {
@@ -18,7 +18,7 @@ export declare function generateUiBuilderComponents(context: $TSContext, compone
 })[];
 export declare function generateUiBuilderThemes(context: $TSContext, themeSchemas: any[]): ({
     resultType: string;
-    theme: any;
+    theme: import("@aws-amplify/codegen-ui-new").StudioTheme;
     schemaName?: undefined;
     error?: undefined;
 } | {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aws-amplify/amplify-util-uibuilder",
-  "version": "1.2.13",
+  "version": "1.2.15-beta.0",
   "description": "",
   "main": "lib/index.js",
   "scripts": {
@@ -13,12 +13,17 @@
     "access": "public"
   },
   "dependencies": {
-    "@aws-amplify/codegen-ui": "1.2.0",
-    "@aws-amplify/codegen-ui-react": "1.2.0",
-    "amplify-cli-core": "2.4.15",
+    "@aws-amplify/codegen-ui-new": "npm:@aws-amplify/codegen-ui@2.1.0",
+    "@aws-amplify/codegen-ui-old": "npm:@aws-amplify/codegen-ui@1.2.0",
+    "@aws-amplify/codegen-ui-react-new": "npm:@aws-amplify/codegen-ui-react@2.1.0",
+    "@aws-amplify/codegen-ui-react-old": "npm:@aws-amplify/codegen-ui-react@1.2.0",
+    "amplify-cli-core": "2.4.17-beta.0",
     "amplify-prompts": "1.6.3",
-    "amplify-provider-awscloudformation": "5.9.7",
-    "aws-sdk": "^2.1042.0"
+    "amplify-provider-awscloudformation": "5.9.9-beta.0",
+    "aws-sdk": "2.1084.0"
+  },
+  "devDependencies": {
+    "@aws-amplify/codegen-ui": "2.1.0"
   },
   "jest": {
     "testRunner": "jest-circus/runner",
@@ -55,5 +60,5 @@
     "usePathForSuiteName": "true",
     "addFileAttribute": "true"
   },
-  "gitHead": "cc9d818cb53de5ab78f242b51fe7d95ba557ccc0"
+  "gitHead": "73037acfc78a75529a6de1bfd33adccd653ddc70"
 }

package/src/__tests__/createUiBuilderComponent.test.ts

@@ -1,10 +1,10 @@
-import * as codegen from '@aws-amplify/codegen-ui';
+import * as codegen from '@aws-amplify/codegen-ui-old';
 import {
   generateAmplifyUiBuilderIndexFile,
   createUiBuilderTheme,
   createUiBuilderComponent,
 } from '../commands/utils/createUiBuilderComponent';
-jest.mock('@aws-amplify/codegen-ui');
+jest.mock('@aws-amplify/codegen-ui-old');
 const codegen_mock = codegen as any;
 const renderSchemaToTemplateMock = jest.fn();
 

package/src/__tests__/notifyMissingPackages.test.ts

@@ -23,7 +23,7 @@ describe('should notify when packages are missing', () => {
         },
       },
     };
-    notifyMissingPackages(context as any);
+    notifyMissingPackages(context as JSONUtilitiesDependency.$TSContext, []);
     expect(printerDependency.printer.debug).toBeCalledTimes(1);
   });
 
@@ -39,7 +39,7 @@ describe('should notify when packages are missing', () => {
         },
       },
     };
-    notifyMissingPackages(context as any);
+    notifyMissingPackages(context as JSONUtilitiesDependency.$TSContext, []);
     expect(printerDependency.printer.debug).toBeCalledTimes(1);
   });
 
@@ -51,8 +51,8 @@ describe('should notify when packages are missing', () => {
         },
       },
     };
-    notifyMissingPackages(context as any);
-    expect(printerDependency.printer.warn).toBeCalledTimes(2);
+    notifyMissingPackages(context as JSONUtilitiesDependency.$TSContext, []);
+    expect(printerDependency.printer.warn).toBeCalledTimes(1);
   });
 
   it('notifies for partial missing dependencies', async () => {
@@ -67,7 +67,7 @@ describe('should notify when packages are missing', () => {
         },
       },
     };
-    notifyMissingPackages(context as any);
+    notifyMissingPackages(context as JSONUtilitiesDependency.$TSContext, []);
     expect(printerDependency.printer.warn).toBeCalledTimes(1);
   });
 });

package/src/commands/generateComponents.ts

@@ -6,6 +6,7 @@ import {
   generateUiBuilderComponents,
   generateUiBuilderThemes,
 } from './utils/syncAmplifyUiBuilderComponents';
+import { StudioComponent as StudioComponentNew } from '@aws-amplify/codegen-ui-new';
 import { generateAmplifyUiBuilderIndexFile } from './utils/createUiBuilderComponent';
 import { printer } from 'amplify-prompts';
 import ora from 'ora';
@@ -31,7 +32,7 @@ export async function run(context: $TSContext) {
     generateAmplifyUiBuilderIndexFile(context, [
       ...generatedComponentResults.filter(({ resultType }) => resultType === 'SUCCESS').map(({ component }) => component),
       ...generatedThemeResults.filter(({ resultType }) => resultType === 'SUCCESS').map(({ theme }) => theme),
-    ]);
+    ] as StudioComponentNew[]);
 
     const failedSchemas = [
       ...generatedComponentResults.filter(({ resultType }) => resultType === 'FAILURE').map(({ schemaName }) => schemaName),
@@ -43,10 +44,13 @@ export async function run(context: $TSContext) {
     } else {
       spinner.succeed('Synced UI components.');
     }
+
+    notifyMissingPackages(context, [
+      ...generatedComponentResults.filter(({ resultType }) => resultType === 'SUCCESS').map(({ component }) => component),
+      ...generatedThemeResults.filter(({ resultType }) => resultType === 'SUCCESS').map(({ theme }) => theme),
+    ] as StudioComponentNew[]);
   } catch (e) {
     printer.debug(e);
     spinner.fail('Failed to sync UI components');
   }
-
-  notifyMissingPackages(context);
 }

package/src/commands/utils/createUiBuilderComponent.ts

@@ -1,15 +1,18 @@
-import { StudioTemplateRendererManager, StudioTemplateRendererFactory, StudioComponent } from '@aws-amplify/codegen-ui';
+import { StudioTemplateRendererManager, StudioComponent, StudioTemplateRendererFactory, StudioTemplateRenderer, FrameworkOutputManager, RenderTextComponentResponse } from '@aws-amplify/codegen-ui-old';
 import {
   AmplifyRenderer,
   ReactThemeStudioTemplateRenderer,
-  ReactIndexStudioTemplateRenderer,
   ModuleKind,
   ScriptTarget,
   ScriptKind,
-} from '@aws-amplify/codegen-ui-react';
+} from '@aws-amplify/codegen-ui-react-old';
+
+import {StudioComponent as StudioComponentNew, StudioTheme} from '@aws-amplify/codegen-ui-new';
 import { getUiBuilderComponentsPath } from './getUiBuilderComponentsPath';
 import { printer } from 'amplify-prompts';
 import { $TSContext } from 'amplify-cli-core';
+import { createUiBuilderComponent as createUiBuilderComponentNew } from './createUiBuilderComponentNew';
+import { ReactIndexStudioTemplateRenderer } from '@aws-amplify/codegen-ui-react-new';
 const config = {
   module: ModuleKind.ES2020,
   target: ScriptTarget.ES2020,
@@ -17,31 +20,44 @@ const config = {
   renderTypeDeclarations: true,
 };
 
-export const createUiBuilderComponent = (context: $TSContext, schema: any) => {
+const isUpdatedSchema = (schema: StudioComponent) => {
+  return (schema as unknown as StudioComponentNew).schemaVersion && (schema as unknown as StudioComponentNew).schemaVersion === '1.0';
+};
+
+export const createUiBuilderComponent = (context: $TSContext, schema: StudioComponent) => {
+  if (isUpdatedSchema(schema)) {
+    return createUiBuilderComponentNew(context, schema as unknown as StudioComponentNew);
+  }
   const uiBuilderComponentsPath = getUiBuilderComponentsPath(context);
-  const rendererFactory = new StudioTemplateRendererFactory((component: StudioComponent) => new AmplifyRenderer(component, config));
+  const rendererFactory = new StudioTemplateRendererFactory(
+    (component: StudioComponent) =>
+      new AmplifyRenderer(component as StudioComponent, config) as unknown as StudioTemplateRenderer<
+        unknown,
+        StudioComponent,
+        FrameworkOutputManager<unknown>,
+        RenderTextComponentResponse
+      >,
+  );
 
   const outputPathDir = uiBuilderComponentsPath;
-  const outputConfig = {
-    outputPathDir,
-  };
 
-  const rendererManager = new StudioTemplateRendererManager(rendererFactory, outputConfig);
+  const rendererManager = new StudioTemplateRendererManager(rendererFactory, {
+    outputPathDir,
+  });
 
   rendererManager.renderSchemaToTemplate(schema);
   return schema;
 };
 
-export const createUiBuilderTheme = (context: $TSContext, schema: any) => {
+export const createUiBuilderTheme = (context: $TSContext, schema: StudioTheme) => {
   const uiBuilderComponentsPath = getUiBuilderComponentsPath(context);
-  const rendererFactory = new StudioTemplateRendererFactory((component: any) => new ReactThemeStudioTemplateRenderer(component, config));
+  const rendererFactory = new StudioTemplateRendererFactory((component: StudioTheme) => new ReactThemeStudioTemplateRenderer(component, config) as unknown as StudioTemplateRenderer<unknown, StudioTheme, FrameworkOutputManager<unknown>, RenderTextComponentResponse>);
 
   const outputPathDir = uiBuilderComponentsPath;
-  const outputConfig = {
-    outputPathDir,
-  };
 
-  const rendererManager = new StudioTemplateRendererManager(rendererFactory, outputConfig);
+  const rendererManager = new StudioTemplateRendererManager(rendererFactory, {
+    outputPathDir,
+  });
 
   try {
     rendererManager.renderSchemaToTemplate(schema);
@@ -54,16 +70,15 @@ export const createUiBuilderTheme = (context: $TSContext, schema: any) => {
   }
 };
 
-export const generateAmplifyUiBuilderIndexFile = (context: $TSContext, schemas: any[]) => {
+export const generateAmplifyUiBuilderIndexFile = (context: $TSContext, schemas: StudioComponentNew[]) => {
   const uiBuilderComponentsPath = getUiBuilderComponentsPath(context);
-  const rendererFactory = new StudioTemplateRendererFactory((component: any) => new ReactIndexStudioTemplateRenderer(component, config));
+  const rendererFactory = new StudioTemplateRendererFactory((component: StudioComponentNew[]) => new ReactIndexStudioTemplateRenderer(component, config) as unknown as StudioTemplateRenderer<unknown, StudioComponentNew[], FrameworkOutputManager<unknown>, RenderTextComponentResponse>);
 
   const outputPathDir = uiBuilderComponentsPath;
-  const outputConfig = {
-    outputPathDir,
-  };
 
-  const rendererManager = new StudioTemplateRendererManager(rendererFactory, outputConfig);
+  const rendererManager = new StudioTemplateRendererManager(rendererFactory, {
+    outputPathDir,
+  });
 
   try {
     return rendererManager.renderSchemaToTemplate(schemas);
@@ -71,5 +86,4 @@ export const generateAmplifyUiBuilderIndexFile = (context: $TSContext, schemas:
     printer.debug(e);
     printer.debug('Failed to generate component index file');
     throw e;
-  }
-};
+  }};

package/src/commands/utils/createUiBuilderComponentNew.ts

@@ -0,0 +1,53 @@
+import { StudioTemplateRendererManager, StudioTemplateRendererFactory, StudioComponent, StudioTheme, StudioTemplateRenderer, FrameworkOutputManager, RenderTextComponentResponse } from '@aws-amplify/codegen-ui-new';
+import {
+  AmplifyRenderer,
+  ReactThemeStudioTemplateRenderer,
+  ReactIndexStudioTemplateRenderer,
+  ModuleKind,
+  ScriptTarget,
+  ScriptKind,
+} from '@aws-amplify/codegen-ui-react-new';
+import { getUiBuilderComponentsPath } from './getUiBuilderComponentsPath';
+import { printer } from 'amplify-prompts';
+import { $TSContext } from 'amplify-cli-core';
+const config = {
+  module: ModuleKind.ES2020,
+  target: ScriptTarget.ES2020,
+  script: ScriptKind.JSX,
+  renderTypeDeclarations: true,
+};
+
+export const createUiBuilderComponent = (context: $TSContext, schema: StudioComponent) => {
+  const uiBuilderComponentsPath = getUiBuilderComponentsPath(context);
+  const rendererFactory = new StudioTemplateRendererFactory((component: StudioComponent) => new AmplifyRenderer(component, config) as unknown as StudioTemplateRenderer<unknown, StudioComponent, FrameworkOutputManager<unknown>, RenderTextComponentResponse>);
+
+  const outputPathDir = uiBuilderComponentsPath;
+
+  const rendererManager = new StudioTemplateRendererManager(rendererFactory, {
+    outputPathDir,
+  });
+
+  rendererManager.renderSchemaToTemplate(schema);
+  return schema;
+};
+
+export const createUiBuilderTheme = (context: $TSContext, schema: StudioTheme) => {
+  const uiBuilderComponentsPath = getUiBuilderComponentsPath(context);
+  const rendererFactory = new StudioTemplateRendererFactory((component: StudioTheme) => new ReactThemeStudioTemplateRenderer(component, config) as unknown as StudioTemplateRenderer<unknown, StudioTheme, FrameworkOutputManager<unknown>, RenderTextComponentResponse>);
+
+  const outputPathDir = uiBuilderComponentsPath;
+
+  const rendererManager = new StudioTemplateRendererManager(rendererFactory, {
+    outputPathDir,
+  });
+
+  try {
+    rendererManager.renderSchemaToTemplate(schema);
+    return schema;
+  } catch (e) {
+    printer.debug(e);
+    printer.debug('Skipping invalid theme with schema');
+    printer.debug(JSON.stringify(schema, null, 2));
+    throw e;
+  }
+};