WML Schematics

starlightViewModes.switchTofunction h(){const t=window.location.hash;document.querySelectorAll(".starlight-view-modes-switcher-a").forEach(e=>{e.href&&(e.href=e.href.split("#")[0]+t)})}h();window.addEventListener("hashchange",h);The Angular WML Schematics library serves as a foundational toolkit for Angular web application development, establishing a solid baseline from which developers can construct and expand their projects. Central to this library is the concept of WMLUIProperty, a fundamental element that encapsulates the essence of web application components, down to the finest detail. This library not only streamlines the development process by providing pre-defined subclasses like WMLRoute for routing, WMLView for dynamic components, and WMLMotionUIProperty for CSS animations and transitions but also ensures consistency and scalability across your application. Dive into the documentation to explore how these building blocks can be orchestrated to create robust, maintainable, and dynamic web applications.

Installation

Section titled “Installation”Terminal window npm install -s --verbose @windmillcode/angular-wml-schematics

Usage

Section titled “Usage”As you follow along close each terminal and open a new one so you can start in root

To create a layout

Section titled “To create a layout”Terminal windowcd src/app/layoutsnpx ng g @windmillcode/angular-wml-schematics:component --name=custom-layout --routing=true --route=layout --routes-file-path=src/app/app.routes.ts --standalone=true --cpnt-type=default

then navigate to the layout route and check for the element in dev tools you will need to add a router-outlet

To create a page

Section titled “To create a page”Terminal windowcd src/app/pagesnpx ng g @windmillcode/angular-wml-schematics:component --name=custom-page --route-key=upload --route=page --routes-file-path=src/app/app.routes.ts --standalone=true --cpnt-type=default

you would first create a layout then the page then add the page as a child of the layout route

To create a container component

Section titled “To create a container component”Terminal windowcd src/app/shared/componentsnpx ng g @windmillcode/angular-wml-schematics:component --name container-zero --is-props-child=true --module=shared --is-page-module=false

To make a service

Section titled “To make a service”Terminal windowcd src/app/shared/servicesnpx ng g @windmillcode/angular-wml-schematics:service --name custom

To create a service method

Section titled “To create a service method”Terminal windowcd src/app/shared/services/customnpx ng g @windmillcode/angular-wml-schematics:service-method --name getJsonData --service-name custom --api-route="/v2/list.json" --http-method get

To create a form

Section titled “To create a form”You will need a component and service to existTerminal windowcd src/app/shared/components/container-zeronpx ng g @windmillcode/angular-wml-schematics:form --api-call this.customService.getJsonData --fields firstName lastName address

**Open A New terminal to try out the commands and see how the project gets updated

References

Section titled “References”

template-component Schematic

Section titled “template-component Schematic”PropertyTypeDescriptionnamestringSpecifies the name of the component.pathstringThe path where the new component will be generated.projectstringThe name of the Angular project within which the component should be created.cpntTypestringDetermines the type of component to generate. Options include default, library, default-zero, and library-zero.isIdIncludedbooleanIndicates whether the component selector should include an ID. Defaults to true.isPropsChildbooleanSpecifies whether the component is a presentation or a container.standalonebooleanIndicates whether the generated component is standalone. Defaults to false.styleTypestringSpecifies the preset SCSS style to use. Options include type0, type1, and none. Default is none.routingbooleanIndicates whether to create a routing module. Defaults to false.routeKeystringThe route that gets added to the innerNav.urls object in the environment.dev.ts file.routestringThe route path for a lazy-loaded module.routesFilePathstringPath for routes when using new routing configurations in Angular 17.modulestringThe declaring NgModule.isPageModulebooleanWhether the component is a page or not.

template-form Schematic

Section titled “template-form Schematic”PropertyTypeDescriptionnamestringThe name of the form.apiCallstringSpecifies the API call function that will be triggered upon form submission.apiCallClassstringSpecifies the class for the API call’s argument.pathstringThe path where the new form-related code will be generated.fieldsstring[]An array of strings representing the field names within the form.fieldTypestringDetermines whether the fields are simple or complex. Default is simple.

template-library Schematic

Section titled “template-library Schematic”PropertyTypeDescriptionnamestringSpecifies the name of the library.pathstringThe path where the library should be created.entryFilestringDesignates the main entry point of the library. Typically a file like public-api.ts.deststringThe destination directory where the build artifacts of the library will be placed.projectstringThe Angular project within which the library will be created.

template-module Schematic

Section titled “template-module Schematic”PropertyTypeDescriptionnamestringThe name of the module to be created.pathstringSpecifies the directory path where the new module will be generated.projectstringIdentifies the project within which the module will be created.flatbooleanPrevents the creation of a new folder for the module if set to true. Defaults to false.routingbooleanIndicates that a routing module should be generated alongside the standard module. Defaults to false.routestringAllows specifying a route path that will be added to the nearest module’s routing configuration.modulestringThe path to the module file that will import the new module.

template-service Schematic

Section titled “template-service Schematic”PropertyTypeDescriptionnamestringSpecifies the name of the service to be created.pathstringThe path where the new service will be generated.projectstringIdentifies the Angular project within which the service should be created.flatbooleanIndicates that the service file should be created directly inside the specified path without creating a new folder. Defaults to false.skipTestsbooleanSkips the generation of a .spec file for the service if set to true. Defaults to false.

template-serviceMethod Schematic

Section titled “template-serviceMethod Schematic”PropertyTypeDescriptionnamestringThe name of the method to be added.entityNamestringName of the entity coming back from the server as page data or page rows. Default is entity.envFilePathstringThe environment file to update.serviceNamestringThe name of the service class where the new method will be injected.apiRoutestringThe HTTP API route.scrollNamestringThe name of the scrollPageObject if transformationType is scrolling. Default is placeholder.pathstringThe path where the service is.transformationTypestringDetermines whether to use regular transformation or page transformation. Default is default.httpMethodstringThe HTTP method for the service method (get, post, put, patch, delete, options, head). Default is post.useDataSourceStrategybooleanIndicates whether to use the datasource strategy for the service method. Default is true.

template-scroll Schematic

Section titled “template-scroll Schematic”PropertyTypeDescriptionnamestringThe name of the scroll object.pathstringThe path where the target class is.serviceFilePathstringThe path where the service is, to be passed to template-service-method schematic.serviceMethodNamestringThe name of the service method, to be passed to template-service-method schematic.serviceMethodApiRoutestringThe HTTP API route, to be passed to template-service-method schematic.serviceMethodEntityNamestringTo be passed to template-service-method schematic, look up entityName definition there. Default is entity.serviceMethodUseDataSourceStrategybooleanWhether to use the datasource strategy for the service method. Default is true.createServiceMethodbooleanIndicates whether to create the service method. Default is true.

v18.1.3001 [8/4/24]

Section titled “v18.1.3001 [8/4/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3002 [8/4/24]

Section titled “v18.1.3002 [8/4/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3003 [8/5/24]

Section titled “v18.1.3003 [8/5/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3003 [8/5/24]

Section titled “v18.1.3003 [8/5/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3004 [8/5/24]

Section titled “v18.1.3004 [8/5/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3005 [8/5/24]

Section titled “v18.1.3005 [8/5/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3006 [8/5/24]

Section titled “v18.1.3006 [8/5/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.1.3007 [8/5/24]

Section titled “v18.1.3007 [8/5/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.1.4000 [8/14/24]

Section titled “v18.1.4000 [8/14/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.1.4001 [8/14/24]

Section titled “v18.1.4001 [8/14/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.2.0 [8/15/24]

Section titled “v18.2.0 [8/15/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.2.1 [8/20/24]

Section titled “v18.2.1 [8/20/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.2.1000 [8/22/24]

Section titled “v18.2.1000 [8/22/24]”updated package to reflect the version 18.2.1 of @angular/cli package

v18.2.2000 [8/30/24]

Section titled “v18.2.2000 [8/30/24]”updated package to reflect the version 18.2.2 of @angular/cli package

v18.2.2100 [9/1/24]

Section titled “v18.2.2100 [9/1/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.2.2101 [9/1/24]

Section titled “v18.2.2101 [9/1/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.2.2200 [9/3/24]

Section titled “v18.2.2200 [9/3/24]”updated package to conform with @windmillcode/angular-wml-components-base

v18.2.3000 [9/4/24]

Section titled “v18.2.3000 [9/4/24]”updated package to reflect the version 18.2.3 of @angular/cli package

v18.2.3100 [9/8/24]

Section titled “v18.2.3100 [9/8/24]”updated package to reflect the version 18.2.3 of @angular/cli package

v18.2.3112 [9/10/24]

Section titled “v18.2.3112 [9/10/24]”[FIX] ensure new imports match to conform with @windmillcode/[email protected]

v18.2.3200 [9/16/24]

Section titled “v18.2.3200 [9/16/24]”updated package to conform with @windmillcode/wml-components-base

v18.2.4000 [9/16/24]

Section titled “v18.2.4000 [9/16/24]”updated package to reflect the version 18.2.4 of @angular/cli package

v18.2.4100 [9/19/24]

Section titled “v18.2.4100 [9/19/24]”updated package to reflect the version 18.2.4 of @angular/cli package

v18.2.4200 [9/21/24]

Section titled “v18.2.4200 [9/21/24]”updated package to conform with @windmillcode/wml-components-base[PATCH] ensured lint configraution gets added when creating a new library, tried to move the free and paid modules to the root folder of a library but only succcced in creating them in the addtl folder

v18.2.5000 [9/22/24]

Section titled “v18.2.5000 [9/22/24]”updated package to reflect the version 18.2.5 of @angular/cli package

v18.2.5001 [9/22/24]

Section titled “v18.2.5001 [9/22/24]”updated package to reflect the version 18.2.5 of @angular/cli package

v18.2.6000 [10/1/24]

Section titled “v18.2.6000 [10/1/24]”updated package to reflect the version 18.2.6 of @angular/cli package

v18.2.7000 [10/2/24]

Section titled “v18.2.7000 [10/2/24]”updated package to reflect the version 18.2.7 of @angular/cli package

v18.2.7001 [10/6/24]

Section titled “v18.2.7001 [10/6/24]”updated package to conform with @windmillcode/wml-components-base

v18.2.7010 [10/9/2024 11:27:56 AM EST]

Section titled “v18.2.7010 [10/9/2024 11:27:56 AM EST]”[UPDATE] projects/wml-schematics/schematics/template-service-method/index.ts updated url method in the WMLEndpoint to use backendURI0.fqdn from WMLUri class of @windmillcode/wml-components-base instead of backendDomain0 . If you’re using this, just know the URLs are now built using fqdn for more flexibility.And future project templates now use WMLUri and backendURI0 to reference to uri representation of the server

v18.2.7020 [10/10/24]

Section titled “v18.2.7020 [10/10/24]”updated package to conform with @windmillcode/wml-components-base

v18.2.8000 [10/10/24]

Section titled “v18.2.8000 [10/10/24]”updated package to reflect the version 18.2.8 of @angular/cli package

v18.2.8000 [10/11/24]

Section titled “v18.2.8000 [10/11/24]”updated package to reflect the version 18.2.8 of @angular/cli package

v18.2.8001 [10/11/24]

Section titled “v18.2.8001 [10/11/24]”updated package to conform with @windmillcode/wml-components-base

v18.2.9000 [10/23/24]

Section titled “v18.2.9000 [10/23/24]”updated package to conform with @windmillcode/wml-components-base

v18.2.10000 [10/31/24]

Section titled “v18.2.10000 [10/31/24]”updated package to conform with @windmillcode/wml-components-base

v18.2.11000 [11/7/24]

Section titled “v18.2.11000 [11/7/24]”updated package to conform with @windmillcode/wml-components-base

v18.2.12000 [11/15/24]

Section titled “v18.2.12000 [11/15/24]”updated package to conform with @windmillcode/wml-components-base

v18.2.12001 [11/17/24]

Section titled “v18.2.12001 [11/17/24]”updated package to conform with @windmillcode/wml-components-base

v19.0.4 [11/19/24]

Section titled “v19.0.4 [11/19/24]”updated package to conform with @windmillcode/wml-components-base

[FIX] -fixed a in template component to match the new standalone logic

by default standalone is true and the SharedModule should be imported

if its false then its specified

v19.0.1000 [11/26/24]

Section titled “v19.0.1000 [11/26/24]”updated package to conform with @windmillcode/wml-components-basePrevious WML PopupNext WML Select