@aws-amplify/codegen-ui - npm Package Compare versions

Comparing version 1.2.1-q1-release-66d6c87.0 to 1.2.1-q1-release-6bd6d64.0

dist/index.d.ts

@@ -16,1 +16,2 @@ export * from './lib/template-renderer';
 export * from './lib/errors';
+export * from './lib/utils';

dist/index.js

@@ -43,2 +43,3 @@ "use strict";
 __exportStar(require("./lib/errors"), exports);
+__exportStar(require("./lib/utils"), exports);
 //# sourceMappingURL=index.js.map

dist/lib/renderer-helper.d.ts

@@ -1,2 +0,2 @@
-import { StudioComponent, StudioComponentChild, StudioComponentDataPropertyBinding, StudioComponentAuthPropertyBinding, StudioComponentStoragePropertyBinding, StudioComponentEventPropertyBinding, StudioComponentSimplePropertyBinding } from './types';
+import { BoundStudioComponentProperty, CollectionStudioComponentProperty, ConcatenatedStudioComponentProperty, ConditionalStudioComponentProperty, FixedStudioComponentProperty, StateStudioComponentProperty, StudioComponent, StudioComponentAuthProperty, StudioComponentChild, StudioComponentDataPropertyBinding, StudioComponentEventPropertyBinding, StudioComponentSimplePropertyBinding, StudioComponentStoragePropertyBinding, StudioComponentPropertyBinding } from './types';
 export declare const StudioRendererConstants: {
@@ -6,2 +6,6 @@ unknownName: string;
 export declare function isStudioComponentWithBinding(component: StudioComponent | StudioComponentChild): component is StudioComponent;
+export declare function hasAuthProperty(component: StudioComponent | StudioComponentChild): component is StudioComponent;
+export declare type ComponentPropertyValueTypes = ConcatenatedStudioComponentProperty | ConditionalStudioComponentProperty | FixedStudioComponentProperty | BoundStudioComponentProperty | CollectionStudioComponentProperty | StateStudioComponentProperty | StudioComponentAuthProperty;
+export declare function isAuthProperty(prop: ComponentPropertyValueTypes): prop is StudioComponentAuthProperty;
+export declare function isStudioComponentWithAuthProperty(component: StudioComponent | StudioComponentChild): component is StudioComponent;
 /**
@@ -13,6 +17,5 @@ * Verify if this is 1) a type that has the collectionProperties, and 2) that the collection
 export declare function isStudioComponentWithVariants(component: StudioComponent | StudioComponentChild): component is StudioComponent & Required<Pick<StudioComponent, 'variants'>>;
-export declare function isStudioComponentWithActions(component: StudioComponent | StudioComponentChild): component is StudioComponent & Required<Pick<StudioComponent, 'actions'>>;
-export declare function isDataPropertyBinding(prop: StudioComponentDataPropertyBinding | StudioComponentAuthPropertyBinding | StudioComponentStoragePropertyBinding | StudioComponentEventPropertyBinding | StudioComponentSimplePropertyBinding): prop is StudioComponentDataPropertyBinding;
-export declare function isAuthPropertyBinding(prop: StudioComponentDataPropertyBinding | StudioComponentAuthPropertyBinding | StudioComponentStoragePropertyBinding | StudioComponentEventPropertyBinding | StudioComponentSimplePropertyBinding): prop is StudioComponentAuthPropertyBinding;
-export declare function isStoragePropertyBinding(prop: StudioComponentDataPropertyBinding | StudioComponentAuthPropertyBinding | StudioComponentStoragePropertyBinding | StudioComponentEventPropertyBinding | StudioComponentSimplePropertyBinding): prop is StudioComponentStoragePropertyBinding;
-export declare function isSimplePropertyBinding(prop: StudioComponentDataPropertyBinding | StudioComponentAuthPropertyBinding | StudioComponentStoragePropertyBinding | StudioComponentEventPropertyBinding | StudioComponentSimplePropertyBinding): prop is StudioComponentSimplePropertyBinding;
+export declare function isDataPropertyBinding(prop: StudioComponentPropertyBinding): prop is StudioComponentDataPropertyBinding;
+export declare function isStoragePropertyBinding(prop: StudioComponentPropertyBinding): prop is StudioComponentStoragePropertyBinding;
+export declare function isSimplePropertyBinding(prop: StudioComponentPropertyBinding): prop is StudioComponentSimplePropertyBinding;
+export declare function isEventPropertyBinding(prop: StudioComponentPropertyBinding): prop is StudioComponentEventPropertyBinding;

dist/lib/renderer-helper.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isSimplePropertyBinding = exports.isStoragePropertyBinding = exports.isAuthPropertyBinding = exports.isDataPropertyBinding = exports.isStudioComponentWithActions = exports.isStudioComponentWithVariants = exports.isStudioComponentWithCollectionProperties = exports.isStudioComponentWithBinding = exports.StudioRendererConstants = void 0;
+exports.isEventPropertyBinding = exports.isSimplePropertyBinding = exports.isStoragePropertyBinding = exports.isDataPropertyBinding = exports.isStudioComponentWithVariants = exports.isStudioComponentWithCollectionProperties = exports.isStudioComponentWithAuthProperty = exports.isAuthProperty = exports.hasAuthProperty = exports.isStudioComponentWithBinding = exports.StudioRendererConstants = void 0;
 /*
@@ -27,2 +27,20 @@ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 exports.isStudioComponentWithBinding = isStudioComponentWithBinding;
+function hasAuthProperty(component) {
+    return Object.values(component.properties).some((val) => isAuthProperty(val));
+}
+exports.hasAuthProperty = hasAuthProperty;
+function isAuthProperty(prop) {
+    return 'userAttribute' in prop;
+}
+exports.isAuthProperty = isAuthProperty;
+function isStudioComponentWithAuthProperty(component) {
+    if (hasAuthProperty(component)) {
+        return true;
+    }
+    if (component.children) {
+        return component.children.some((child) => isStudioComponentWithAuthProperty(child));
+    }
+    return false;
+}
+exports.isStudioComponentWithAuthProperty = isStudioComponentWithAuthProperty;
 /**
@@ -40,6 +58,2 @@ * Verify if this is 1) a type that has the collectionProperties, and 2) that the collection
 exports.isStudioComponentWithVariants = isStudioComponentWithVariants;
-function isStudioComponentWithActions(component) {
-    return 'actions' in component && component.actions !== undefined;
-}
-exports.isStudioComponentWithActions = isStudioComponentWithActions;
 function isDataPropertyBinding(prop) {
@@ -49,6 +63,2 @@ return 'type' in prop && prop.type === 'Data';
 exports.isDataPropertyBinding = isDataPropertyBinding;
-function isAuthPropertyBinding(prop) {
-    return 'type' in prop && prop.type === 'Authentication';
-}
-exports.isAuthPropertyBinding = isAuthPropertyBinding;
 function isStoragePropertyBinding(prop) {
@@ -68,2 +78,6 @@ return 'type' in prop && prop.type === 'Storage';
 exports.isSimplePropertyBinding = isSimplePropertyBinding;
+function isEventPropertyBinding(prop) {
+    return 'type' in prop && prop.type === 'Event';
+}
+exports.isEventPropertyBinding = isEventPropertyBinding;
 //# sourceMappingURL=renderer-helper.js.map

dist/lib/studio-node.d.ts

@@ -8,23 +8,6 @@ import { StudioComponent, StudioComponentChild } from './types';
     getComponentPathToRoot(): StudioNode[];
-    getOverrideIndex(): number;
     /**
-     * Build the override path for a given element walking from the node to tree root, providing an index
-     * for all but the top-level components.
-     * Example:
-     * <Flex> <-- returns 'Flex'
-     *     <Button> <-- returns 'Flex.Button[0]'
-     *     <Button> <-- returns 'Flex.Button[1]'
-     *     <Flex> <-- returns 'Flex.Flex[0]'
-     *         </Button> <-- returns 'Flex.Flex[0].Button[0]'
-     *     </Flex>
-     * </Flex>
+     * Return true if any ancestor node of the current node has type `componentType`.
      */
-    getOverrideKey(): string;
-    /**
-     *
-     * Parse the override key to get the component type
-     * Example: Flex.Flex[0].Flex[0].Button[0], Button
-     *
-     */
-    static getComponentTypeFromOverrideKey(overrideKey: string): string;
+    hasAncestorOfType(componentType: string): boolean;
 }

dist/lib/studio-node.js

@@ -18,45 +18,13 @@ "use strict";
     }
-    getOverrideIndex() {
-        if (this.parent === undefined || this.parent.component.children === undefined) {
-            return -1;
-        }
-        return this.parent.component.children
-            .filter((child) => child.componentType === this.component.componentType)
-            .findIndex((child) => child === this.component);
-    }
     /**
-     * Build the override path for a given element walking from the node to tree root, providing an index
-     * for all but the top-level components.
-     * Example:
-     * <Flex> <-- returns 'Flex'
-     *     <Button> <-- returns 'Flex.Button[0]'
-     *     <Button> <-- returns 'Flex.Button[1]'
-     *     <Flex> <-- returns 'Flex.Flex[0]'
-     *         </Button> <-- returns 'Flex.Flex[0].Button[0]'
-     *     </Flex>
-     * </Flex>
+     * Return true if any ancestor node of the current node has type `componentType`.
      */
-    getOverrideKey() {
-        const [parentElement, ...childElements] = this.getComponentPathToRoot().reverse();
-        const childPath = childElements.map((node) => `${node.component.componentType}[${node.getOverrideIndex()}]`);
-        return [parentElement.component.componentType, ...childPath].join('.');
+    hasAncestorOfType(componentType) {
+        const ancestorComponentTypes = this.getComponentPathToRoot().map((node) => node.component.componentType);
+        // We don't want to check if the current node has type, so shift that element out.
+        ancestorComponentTypes.shift();
+        return ancestorComponentTypes.some((ancestorComponentType) => ancestorComponentType === componentType);
     }
-    /**
-     *
-     * Parse the override key to get the component type
-     * Example: Flex.Flex[0].Flex[0].Button[0], Button
-     *
-     */
-    static getComponentTypeFromOverrideKey(overrideKey) {
-        const splitOverrideKeys = overrideKey.split('.');
-        // for root component
-        if (splitOverrideKeys.length === 1) {
-            return splitOverrideKeys[0];
-        }
-        const lastOverrideKey = splitOverrideKeys[splitOverrideKeys.length - 1];
-        const openBracketIndex = lastOverrideKey.indexOf('[');
-        return lastOverrideKey.substring(0, openBracketIndex);
-    }
 }
 exports.StudioNode = StudioNode;
 //# sourceMappingURL=studio-node.js.map

dist/lib/types/studio-types.d.ts

@@ -53,3 +53,3 @@ export declare type FigmaMetadata = {
     bindingProperties: {
-        [propertyName: string]: StudioComponentDataPropertyBinding | StudioComponentAuthPropertyBinding | StudioComponentStoragePropertyBinding | StudioComponentSimplePropertyBinding | StudioComponentEventPropertyBinding;
+        [propertyName: string]: StudioComponentPropertyBinding;
     };
@@ -62,8 +62,3 @@ /**
     };
-    /**
-     * Component actions
-     */
-    actions?: {
-        [actionName: string]: StudioComponentAction;
-    };
+    events?: StudioComponentEvents;
 };
@@ -104,3 +99,3 @@ /**
     bindingProperties: {
-        [propertyName: string]: StudioComponentDataPropertyBinding | StudioComponentAuthPropertyBinding | StudioComponentStoragePropertyBinding | StudioComponentSimplePropertyBinding | StudioComponentEventPropertyBinding;
+        [propertyName: string]: StudioComponentPropertyBinding;
     };
@@ -113,2 +108,3 @@ /**
     };
+    events?: StudioComponentEvents;
 };
@@ -144,9 +140,3 @@ export declare type StudioComponentSimplePropertyBinding = {
     children?: StudioComponentChild[];
-    /**
-     * Event <-> Action mapping (e.g click => SignOutAction)
-     * When an event is triggered, an action is executed
-     */
-    events?: {
-        [eventName: string]: string;
-    };
+    events?: StudioComponentEvents;
 };
@@ -204,3 +194,3 @@ /**
 };
-export declare type StudioComponentProperty = (FixedStudioComponentProperty | BoundStudioComponentProperty | CollectionStudioComponentProperty | ConcatenatedStudioComponentProperty | ConditionalStudioComponentProperty | WorkflowStudioComponentProperty | FormStudioComponentProperty) & CommonPropertyValues;
+export declare type StudioComponentProperty = (FixedStudioComponentProperty | BoundStudioComponentProperty | CollectionStudioComponentProperty | ConcatenatedStudioComponentProperty | ConditionalStudioComponentProperty | StudioComponentAuthProperty | StateStudioComponentProperty) & CommonPropertyValues;
 /**
@@ -275,25 +265,7 @@ * This represents a component property that is configured with either
 };
-/**
- * This represents a component property that is configured with either
- * data bound values
- */
-export declare type WorkflowStudioComponentProperty = {
-    event: string;
+export declare type StateStudioComponentProperty = {
+    componentName: string;
+    property: string;
 };
 /**
- * This is the configuration for a form binding. This is
- * technically an extension of Workflows but because it is
- * pretty unique, it should be separated out with its own definition
- */
-export declare type FormStudioComponentProperty = {
-    /**
-     * The model of the DataStore object
-     */
-    model: string;
-    /**
-     * The binding configuration for the form
-     */
-    bindings: FormBindings;
-};
-/**
  * This represent the configuration for binding a component property
@@ -316,2 +288,3 @@ * to Amplify specific information
 };
+export declare type StudioComponentPropertyBinding = StudioComponentDataPropertyBinding | StudioComponentStoragePropertyBinding | StudioComponentSimplePropertyBinding | StudioComponentEventPropertyBinding;
 /**
@@ -341,15 +314,2 @@ * This represent the configuration for binding a component property
 };
-export declare type FormBindings = {
-    [key: string]: FormBindingElement;
-};
-export declare type FormBindingElement = {
-    /**
-     * The name of the component to fetch a value from
-     */
-    element: string;
-    /**
-     * The property component to get the value from.
-     */
-    property: string;
-};
 /**
@@ -359,11 +319,7 @@ * This represent the configuration for binding a component property
  */
-export declare type StudioComponentAuthPropertyBinding = {
+export declare type StudioComponentAuthProperty = {
     /**
-     * This declares where the data is coming from to bind to
+     * This is the value of the user attribute
      */
-    type: 'Authentication';
-    /**
-     * This is the value of the data binding
-     */
-    bindingProperties: StudioComponentAuthBindingProperty;
+    userAttribute: string;
 };
@@ -399,4 +355,23 @@ /**
     Authentication = "Authentication",
-    Storage = "Storage"
+    Storage = "Storage",
+    Event = "Event"
 }
+export declare enum StudioGenericEvent {
+    click = "click",
+    doubleclick = "doubleclick",
+    mousedown = "mousedown",
+    mouseenter = "mouseenter",
+    mouseleave = "mouseleave",
+    mousemove = "mousemove",
+    mouseout = "mouseout",
+    mouseover = "mouseover",
+    mouseup = "mouseup",
+    change = "change",
+    input = "input",
+    focus = "focus",
+    blur = "blur",
+    keydown = "keydown",
+    keypress = "keypress",
+    keyup = "keyup"
+}
 /**
@@ -433,2 +408,63 @@ * This represents the model and field you want to bind
 };
+export declare type StudioComponentEvent = BoundStudioComponentEvent | ActionStudioComponentEvent;
+export declare type BoundStudioComponentEvent = {
+    bindingEvent: string;
+};
+export declare type ActionStudioComponentEvent = NavigationAction | AuthSignOutAction | DataStoreCreateItemAction | DataStoreUpdateItemAction | DataStoreDeleteItemAction | MutationAction;
+export declare type NavigationAction = {
+    action: 'Amplify.Navigation';
+    parameters: {
+        type: StudioComponentProperty;
+        url?: StudioComponentProperty;
+        anchor?: StudioComponentProperty;
+        target?: StudioComponentProperty;
+    };
+};
+export declare type AuthSignOutAction = {
+    action: 'Amplify.AuthSignOut';
+    parameters: {
+        global: StudioComponentProperty;
+    };
+};
+export declare type DataStoreCreateItemAction = {
+    action: 'Amplify.DataStoreCreateItemAction';
+    parameters: {
+        model: string;
+        fields: {
+            [propertyName: string]: StudioComponentProperty;
+        };
+    };
+};
+export declare type DataStoreUpdateItemAction = {
+    action: 'Amplify.DataStoreUpdateItemAction';
+    parameters: {
+        model: string;
+        id: StudioComponentProperty;
+        fields: {
+            [propertyName: string]: StudioComponentProperty;
+        };
+    };
+};
+export declare type DataStoreDeleteItemAction = {
+    action: 'Amplify.DataStoreDeleteItemAction';
+    parameters: {
+        model: string;
+        id: StudioComponentProperty;
+    };
+};
+export declare type MutationAction = {
+    action: 'Amplify.Mutation';
+    parameters: {
+        state: MutationActionSetStateParameter;
+    };
+};
+export declare type MutationActionSetStateParameter = {
+    componentName: string;
+    property: string;
+    set: StudioComponentProperty;
+};
+export declare type StateReference = StateStudioComponentProperty | MutationActionSetStateParameter;
+export declare type StudioComponentEvents = {
+    [eventName: string]: StudioComponentEvent;
+};
 export declare type StudioTheme = {
@@ -448,40 +484,1 @@ name: string;
 };
-/**
- * Component action types
- */
-export declare type StudioComponentAction = AmplifyAuthSignOutAction | NavigationAction;
-/**
- * Amplify Auth signout Action type
- */
-export declare type AmplifyAuthSignOutAction = {
-    type: 'Amplify.Auth.SignOut';
-    parameters?: {
-        global: boolean;
-    };
-};
-/**
- * Navigation related action types.
- */
-export declare type NavigationAction = NavigationRedirectAction | NavigationOpenAction | NavigationRefreshAction;
-/**
- * Redirect action type
- */
-export declare type NavigationRedirectAction = {
-    type: 'Navigation.Redirect';
-    parameters: {
-        href: string;
-        replaceHistory?: boolean;
-    };
-};
-/**
- * Redirect action type
- */
-export declare type NavigationOpenAction = {
-    type: 'Navigation.Open';
-    parameters: {
-        href: string;
-    };
-};
-export declare type NavigationRefreshAction = {
-    type: 'Navigation.Refresh';
-};

dist/lib/types/studio-types.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.StudioComponentPropertyBindingType = exports.StudioComponentPropertyType = void 0;
+exports.StudioGenericEvent = exports.StudioComponentPropertyBindingType = exports.StudioComponentPropertyType = void 0;
 /**
@@ -22,3 +22,23 @@ * These are the primitive value types
     StudioComponentPropertyBindingType["Storage"] = "Storage";
+    StudioComponentPropertyBindingType["Event"] = "Event";
 })(StudioComponentPropertyBindingType = exports.StudioComponentPropertyBindingType || (exports.StudioComponentPropertyBindingType = {}));
+var StudioGenericEvent;
+(function (StudioGenericEvent) {
+    StudioGenericEvent["click"] = "click";
+    StudioGenericEvent["doubleclick"] = "doubleclick";
+    StudioGenericEvent["mousedown"] = "mousedown";
+    StudioGenericEvent["mouseenter"] = "mouseenter";
+    StudioGenericEvent["mouseleave"] = "mouseleave";
+    StudioGenericEvent["mousemove"] = "mousemove";
+    StudioGenericEvent["mouseout"] = "mouseout";
+    StudioGenericEvent["mouseover"] = "mouseover";
+    StudioGenericEvent["mouseup"] = "mouseup";
+    StudioGenericEvent["change"] = "change";
+    StudioGenericEvent["input"] = "input";
+    StudioGenericEvent["focus"] = "focus";
+    StudioGenericEvent["blur"] = "blur";
+    StudioGenericEvent["keydown"] = "keydown";
+    StudioGenericEvent["keypress"] = "keypress";
+    StudioGenericEvent["keyup"] = "keyup";
+})(StudioGenericEvent = exports.StudioGenericEvent || (exports.StudioGenericEvent = {}));
 //# sourceMappingURL=studio-types.js.map

dist/lib/validation-helper.js

@@ -40,2 +40,3 @@ "use strict";
 const errors_1 = require("./errors");
+const types_1 = require("./types");
 const alphaNumString = () => {
@@ -58,2 +59,7 @@ return yup.string().matches(/^[a-zA-Z0-9]*$/, { message: 'Expected an alphanumeric string' });
 };
+const eventsSchema = yup
+    .object(Object.fromEntries(Object.keys(types_1.StudioGenericEvent)
+    .filter((eventType) => Number.isNaN(Number(eventType)))
+    .map((eventType) => [eventType, yup.object().nullable()])))
+    .noUnknown();
 /**
@@ -75,4 +81,6 @@ * Component Schema Definitions
     actions: yup.object().nullable(),
+    events: eventsSchema.nullable(),
 });
-const studioComponentSchema = yup.object({
+const studioComponentSchema = yup
+    .object({
     name: alphaNumString().nullable(),
@@ -90,3 +98,39 @@ id: yup.string().nullable(),
     actions: yup.object().nullable(),
+    events: eventsSchema.nullable(),
+})
+    // eslint-disable-next-line func-names
+    .test('unique-component-names', 'All component names must be unique', function (value) {
+    const { path, createError } = this;
+    const { duplicateNames } = findCollidingNames(value);
+    if (duplicateNames.size > 0) {
+        return createError({
+            path,
+            message: `Duplicate names are not allowed within a component, found duplicates of ${JSON.stringify([
+                ...duplicateNames,
+            ])}`,
+        });
+    }
+    return true;
 });
+const findCollidingNames = (value) => {
+    const names = value.name ? new Set([value.name]) : new Set();
+    const componentNameMetadata = { names, duplicateNames: new Set() };
+    if (!value.children) {
+        return componentNameMetadata;
+    }
+    const childComponentNameMetadata = value.children
+        .map((child) => findCollidingNames(child))
+        .reduce((previous, next) => mergeComponentNameMetadata(previous, next), { names: new Set(), duplicateNames: new Set() });
+    return mergeComponentNameMetadata(componentNameMetadata, childComponentNameMetadata);
+};
+const mergeComponentNameMetadata = (lhs, rhs) => {
+    const names = new Set([...lhs.names, ...rhs.names]);
+    const duplicateNames = new Set([...lhs.duplicateNames, ...rhs.duplicateNames]);
+    lhs.names.forEach((lhsName) => {
+        if (rhs.names.has(lhsName)) {
+            duplicateNames.add(lhsName);
+        }
+    });
+    return { names, duplicateNames };
+};
 /**
@@ -93,0 +137,0 @@ * Theme Schema Definitions

package.json

 {
   "name": "@aws-amplify/codegen-ui",
-  "version": "1.2.1-q1-release-66d6c87.0",
+  "version": "1.2.1-q1-release-6bd6d64.0",
   "description": "generic component code generation interface definitions",
@@ -53,3 +53,3 @@ "author": "Amazon Web Services",
   },
-  "gitHead": "5fe7340cea6da57b9727364053036803d3fce23e"
+  "gitHead": "ec7d1d1a7b3d083d6964708eea1d463e2f9d7f35"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

166113

increased by4.78%

Number of package files

75

increased by8.7%

Lines of code

1406

increased by6.27%

No dependency changes