├── src ├── assets │ ├── .gitkeep │ ├── logo.png │ ├── favicon.ico │ ├── logo@2x.png │ ├── logo-github.png │ ├── logo-github@2x.png │ └── calendar-icon.svg ├── app │ ├── app.component.scss │ ├── ui-material │ │ ├── material-sample-form.layout.ts │ │ └── material-sample-form.component.html │ ├── lazy-loaded │ │ ├── lazy-loaded-form.validators.ts │ │ ├── lazy-loaded-form.component.html │ │ ├── lazy-loaded-form.model.ts │ │ ├── lazy-loaded-form.component.ts │ │ └── lazy-loaded-form.routes.ts │ ├── ui-primeng │ │ └── primeng-sample-form.component.html │ ├── ui-ng-bootstrap │ │ └── ng-bootstrap-sample-form.component.html │ ├── app.component.html │ ├── ui-ngx-bootstrap │ │ └── ngx-bootstrap-sample-form.layout.ts │ └── ui-foundation │ │ └── foundation-sample-form.component.html ├── favicon.ico ├── images │ ├── hue.png │ ├── color.png │ ├── icons_16.png │ ├── slider_handles.png │ ├── slider_handles@2x.png │ ├── ui-icons_222222_256x240.png │ ├── ui-icons_2e83ff_256x240.png │ ├── ui-icons_454545_256x240.png │ ├── ui-icons_cd0a0a_256x240.png │ ├── ui-icons_ffffff_256x240.png │ ├── ui-bg_flat_0_aaaaaa_40x100.png │ ├── ui-bg_flat_75_ffffff_40x100.png │ ├── ui-bg_glass_55_fbf9ee_1x400.png │ ├── ui-bg_glass_65_ffffff_1x400.png │ ├── ui-bg_glass_75_dadada_1x400.png │ ├── ui-bg_glass_75_e6e6e6_1x400.png │ ├── ui-bg_glass_95_fef1ec_1x400.png │ └── ui-bg_highlight-soft_75_cccccc_1x100.png ├── environments │ ├── environment.prod.ts │ └── environment.ts ├── fonts │ ├── roboto-v15-latin-regular.eot │ ├── roboto-v15-latin-regular.ttf │ ├── roboto-v15-latin-regular.woff │ └── roboto-v15-latin-regular.woff2 ├── tsconfig.app.json ├── tslint.json ├── tsconfig.spec.json ├── index.html ├── test.ts └── karma.conf.js ├── projects ├── ng-dynamic-forms │ ├── core │ │ ├── src │ │ │ ├── public-api.ts │ │ │ ├── lib │ │ │ │ ├── model │ │ │ │ │ ├── misc │ │ │ │ │ │ ├── dynamic-form-control-path.model.ts │ │ │ │ │ │ ├── dynamic-form-control-relation.model.ts │ │ │ │ │ │ ├── dynamic-form-control-validation.model.ts │ │ │ │ │ │ └── dynamic-form-control-layout.model.ts │ │ │ │ │ ├── dynamic-form.model.ts │ │ │ │ │ ├── editor │ │ │ │ │ │ └── dynamic-editor.model.ts │ │ │ │ │ ├── dynamic-file-control.model.ts │ │ │ │ │ ├── rating │ │ │ │ │ │ ├── dynamic-rating.model.ts │ │ │ │ │ │ └── dynamic-rating.model.spec.ts │ │ │ │ │ ├── checkbox │ │ │ │ │ │ ├── dynamic-checkbox.model.ts │ │ │ │ │ │ └── dynamic-checkbox-group.model.ts │ │ │ │ │ ├── switch │ │ │ │ │ │ ├── dynamic-switch.model.ts │ │ │ │ │ │ └── dynamic-switch.model.spec.ts │ │ │ │ │ ├── radio │ │ │ │ │ │ └── dynamic-radio-group.model.ts │ │ │ │ │ ├── timepicker │ │ │ │ │ │ └── dynamic-timepicker.model.ts │ │ │ │ │ ├── colorpicker │ │ │ │ │ │ ├── dynamic-colorpicker.model.ts │ │ │ │ │ │ └── dynamic-colorpicker.model.spec.ts │ │ │ │ │ ├── dynamic-check-control.model.ts │ │ │ │ │ ├── dynamic-date-control.model.ts │ │ │ │ │ └── textarea │ │ │ │ │ │ └── dynamic-textarea.model.ts │ │ │ │ ├── component │ │ │ │ │ ├── dynamic-form-control-with-template-interface.ts │ │ │ │ │ ├── dynamic-form-group.component.ts │ │ │ │ │ ├── dynamic-form-control-interface.ts │ │ │ │ │ ├── dynamic-form-control-event.ts │ │ │ │ │ └── dynamic-form-array.component.ts │ │ │ │ ├── service │ │ │ │ │ ├── dynamic-form-validators.ts │ │ │ │ │ └── dynamic-form-validation-matchers.ts │ │ │ │ ├── utils │ │ │ │ │ ├── core.utils.ts │ │ │ │ │ └── json.utils.ts │ │ │ │ ├── core.module.ts │ │ │ │ ├── directive │ │ │ │ │ ├── dynamic-list.directive.ts │ │ │ │ │ ├── dynamic-template.directive.ts │ │ │ │ │ └── dynamic-template.directive.spec.ts │ │ │ │ └── decorator │ │ │ │ │ └── serializable.decorator.ts │ │ │ └── test.ts │ │ ├── ng-package.json │ │ ├── tsconfig.lib.prod.json │ │ ├── tslint.json │ │ ├── tsconfig.spec.json │ │ ├── README.md │ │ ├── LICENSE │ │ ├── tsconfig.lib.json │ │ ├── karma.conf.js │ │ └── package.json │ ├── ui-basic │ │ ├── src │ │ │ ├── public-api.ts │ │ │ ├── lib │ │ │ │ ├── ui-basic.ts │ │ │ │ ├── dynamic-basic-form.component.html │ │ │ │ ├── checkbox │ │ │ │ │ └── dynamic-basic-checkbox.component.html │ │ │ │ ├── select │ │ │ │ │ └── dynamic-basic-select.component.html │ │ │ │ ├── radio-group │ │ │ │ │ └── dynamic-basic-radio-group.component.html │ │ │ │ ├── textarea │ │ │ │ │ └── dynamic-basic-textarea.component.html │ │ │ │ ├── dynamic-basic-form-control-container.component.html │ │ │ │ └── dynamic-basic-form-group.component.html │ │ │ └── test.ts │ │ ├── tsconfig.lib.prod.json │ │ ├── ng-package.json │ │ ├── tsconfig.spec.json │ │ ├── tslint.json │ │ ├── LICENSE │ │ ├── tsconfig.lib.json │ │ ├── karma.conf.js │ │ └── package.json │ ├── ui-ionic │ │ ├── src │ │ │ ├── public-api.ts │ │ │ ├── lib │ │ │ │ ├── dynamic-ionic-form-control-container.component.html │ │ │ │ ├── ui-ionic.ts │ │ │ │ ├── dynamic-ionic-form.component.html │ │ │ │ ├── toggle │ │ │ │ │ └── dynamic-ionic-toggle.component.html │ │ │ │ ├── checkbox │ │ │ │ │ └── dynamic-ionic-checkbox.component.html │ │ │ │ ├── textarea │ │ │ │ │ └── dynamic-ionic-textarea.component.html │ │ │ │ ├── radio-group │ │ │ │ │ └── dynamic-ionic-radio-group.component.html │ │ │ │ ├── range │ │ │ │ │ └── dynamic-ionic-range.component.html │ │ │ │ ├── dynamic-ionic-form-group.component.html │ │ │ │ ├── select │ │ │ │ │ └── dynamic-ionic-select.component.html │ │ │ │ └── datetime │ │ │ │ │ └── dynamic-ionic-datetime.component.html │ │ │ └── test.ts │ │ ├── tsconfig.lib.prod.json │ │ ├── ng-package.json │ │ ├── tsconfig.spec.json │ │ ├── tslint.json │ │ ├── LICENSE │ │ ├── tsconfig.lib.json │ │ ├── karma.conf.js │ │ └── package.json │ ├── ui-primeng │ │ ├── src │ │ │ ├── public-api.ts │ │ │ ├── lib │ │ │ │ ├── dynamic-primeng-form.const.ts │ │ │ │ ├── input-switch │ │ │ │ │ └── dynamic-primeng-input-switch.component.html │ │ │ │ ├── dynamic-primeng-form-control-with-template.component.ts │ │ │ │ ├── colorpicker │ │ │ │ │ └── dynamic-primeng-colorpicker.component.html │ │ │ │ ├── editor │ │ │ │ │ └── dynamic-primeng-editor.component.html │ │ │ │ ├── chips │ │ │ │ │ └── dynamic-primeng-chips.component.html │ │ │ │ ├── checkbox │ │ │ │ │ └── dynamic-primeng-checkbox.component.html │ │ │ │ ├── dynamic-primeng-form.component.html │ │ │ │ ├── radio-group │ │ │ │ │ └── dynamic-primeng-radio-group.component.html │ │ │ │ ├── slider │ │ │ │ │ └── dynamic-primeng-slider.component.html │ │ │ │ ├── rating │ │ │ │ │ └── dynamic-primeng-rating.component.html │ │ │ │ ├── input-mask │ │ │ │ │ └── dynamic-primeng-input-mask.component.html │ │ │ │ ├── dynamic-primeng-form-control-container.component.html │ │ │ │ ├── textarea │ │ │ │ │ └── dynamic-primeng-textarea.component.html │ │ │ │ ├── spinner │ │ │ │ │ └── dynamic-primeng-spinner.component.html │ │ │ │ ├── dynamic-primeng-form-group.component.html │ │ │ │ ├── dropdown │ │ │ │ │ └── dynamic-primeng-dropdown.component.html │ │ │ │ ├── ui-primeng.ts │ │ │ │ └── input │ │ │ │ │ └── dynamic-primeng-input.component.html │ │ │ └── test.ts │ │ ├── tsconfig.lib.prod.json │ │ ├── ng-package.json │ │ ├── tsconfig.spec.json │ │ ├── tslint.json │ │ ├── LICENSE │ │ ├── tsconfig.lib.json │ │ └── karma.conf.js │ ├── ui-bootstrap │ │ ├── src │ │ │ ├── public-api.ts │ │ │ ├── lib │ │ │ │ ├── rating │ │ │ │ │ └── dynamic-bootstrap-rating.component.html │ │ │ │ ├── ui-bootstrap.ts │ │ │ │ ├── dynamic-bootstrap-form.component.html │ │ │ │ ├── select │ │ │ │ │ └── dynamic-bootstrap-select.component.html │ │ │ │ ├── timepicker │ │ │ │ │ └── dynamic-bootstrap-timepicker.component.html │ │ │ │ ├── radio-group │ │ │ │ │ └── dynamic-bootstrap-radio-group.component.html │ │ │ │ ├── textarea │ │ │ │ │ └── dynamic-bootstrap-textarea.component.html │ │ │ │ ├── checkbox │ │ │ │ │ └── dynamic-bootstrap-checkbox.component.html │ │ │ │ └── dynamic-bootstrap-form-group.component.html │ │ │ └── test.ts │ │ ├── tsconfig.lib.prod.json │ │ ├── ng-package.json │ │ ├── tsconfig.spec.json │ │ ├── tslint.json │ │ ├── LICENSE │ │ ├── tsconfig.lib.json │ │ └── karma.conf.js │ ├── ui-foundation │ │ ├── src │ │ │ ├── public-api.ts │ │ │ ├── lib │ │ │ │ ├── ui-foundation.ts │ │ │ │ ├── dynamic-foundation-form.component.html │ │ │ │ ├── select │ │ │ │ │ └── dynamic-foundation-select.component.html │ │ │ │ ├── checkbox │ │ │ │ │ └── dynamic-foundation-checkbox.component.html │ │ │ │ ├── radio-group │ │ │ │ │ └── dynamic-foundation-radio-group.component.html │ │ │ │ ├── switch │ │ │ │ │ └── dynamic-foundation-switch.component.html │ │ │ │ ├── textarea │ │ │ │ │ └── dynamic-foundation-textarea.component.html │ │ │ │ ├── dynamic-foundation-form-control-container.component.html │ │ │ │ └── dynamic-foundation-form-group.component.html │ │ │ └── test.ts │ │ ├── tsconfig.lib.prod.json │ │ ├── ng-package.json │ │ ├── tsconfig.spec.json │ │ ├── tslint.json │ │ ├── LICENSE │ │ ├── tsconfig.lib.json │ │ └── karma.conf.js │ ├── ui-material │ │ ├── src │ │ │ ├── public-api.ts │ │ │ ├── test.ts │ │ │ └── lib │ │ │ │ ├── dynamic-material-form.component.html │ │ │ │ ├── ui-material.ts │ │ │ │ ├── dynamic-material-form-control-container.component.html │ │ │ │ ├── slider │ │ │ │ └── dynamic-material-slider.component.html │ │ │ │ ├── radio-group │ │ │ │ └── dynamic-material-radio-group.component.html │ │ │ │ ├── slide-toggle │ │ │ │ └── dynamic-material-slide-toggle.component.html │ │ │ │ ├── checkbox │ │ │ │ └── dynamic-material-checkbox.component.html │ │ │ │ ├── dynamic-material-form-input-control.component.ts │ │ │ │ └── dynamic-material-form-group.component.html │ │ ├── tsconfig.lib.prod.json │ │ ├── ng-package.json │ │ ├── tslint.json │ │ ├── tsconfig.spec.json │ │ ├── LICENSE │ │ ├── tsconfig.lib.json │ │ ├── karma.conf.js │ │ └── package.json │ ├── ui-ng-bootstrap │ │ ├── src │ │ │ ├── public-api.ts │ │ │ ├── lib │ │ │ │ ├── rating │ │ │ │ │ └── dynamic-ng-bootstrap-rating.component.html │ │ │ │ ├── dynamic-ng-bootstrap-form.component.html │ │ │ │ ├── switch │ │ │ │ │ └── dynamic-ng-bootstrap-switch.component.html │ │ │ │ ├── timepicker │ │ │ │ │ └── dynamic-ng-bootstrap-timepicker.component.html │ │ │ │ ├── select │ │ │ │ │ └── dynamic-ng-bootstrap-select.component.html │ │ │ │ ├── ui-ng-bootstrap.ts │ │ │ │ ├── textarea │ │ │ │ │ └── dynamic-ng-bootstrap-textarea.component.html │ │ │ │ ├── radio-group │ │ │ │ │ └── dynamic-ng-bootstrap-radio-group.component.html │ │ │ │ ├── checkbox │ │ │ │ │ └── dynamic-ng-bootstrap-checkbox.component.html │ │ │ │ ├── calendar │ │ │ │ │ └── dynamic-ng-bootstrap-calendar.component.html │ │ │ │ ├── dynamic-ng-bootstrap-form-group.component.html │ │ │ │ ├── checkbox-group │ │ │ │ │ └── dynamic-ng-bootstrap-checkbox-group.component.html │ │ │ │ └── dynamic-ng-bootstrap-form-control-container.component.html │ │ │ └── test.ts │ │ ├── tsconfig.lib.prod.json │ │ ├── ng-package.json │ │ ├── tsconfig.spec.json │ │ ├── tslint.json │ │ ├── LICENSE │ │ ├── tsconfig.lib.json │ │ └── karma.conf.js │ └── ui-ngx-bootstrap │ │ ├── src │ │ ├── public-api.ts │ │ ├── lib │ │ │ ├── rating │ │ │ │ └── dynamic-ngx-bootstrap-rating.component.html │ │ │ ├── checkbox-group │ │ │ │ └── dynamic-ngx-bootstrap-checkbox-group.component.html │ │ │ ├── radio-group │ │ │ │ └── dynamic-ngx-bootstrap-radio-group.component.html │ │ │ ├── dynamic-ngx-bootstrap-form.component.html │ │ │ ├── ui-ngx-bootstrap.ts │ │ │ ├── select │ │ │ │ └── dynamic-ngx-bootstrap-select.component.html │ │ │ ├── timepicker │ │ │ │ └── dynamic-ngx-bootstrap-timepicker.component.html │ │ │ ├── textarea │ │ │ │ └── dynamic-ngx-bootstrap-textarea.component.html │ │ │ ├── checkbox │ │ │ │ └── dynamic-ngx-bootstrap-checkbox.component.html │ │ │ ├── dynamic-ngx-bootstrap-form-group.component.html │ │ │ └── dynamic-ngx-bootstrap-form-control-container.component.html │ │ └── test.ts │ │ ├── tsconfig.lib.prod.json │ │ ├── ng-package.json │ │ ├── tslint.json │ │ ├── tsconfig.spec.json │ │ ├── tsconfig.lib.json │ │ └── karma.conf.js └── tsconfig.compodoc.json ├── schematics ├── .npmignore ├── .gitignore ├── collection.json ├── src │ └── versioning │ │ └── schema.json ├── tsconfig.json └── package.json ├── .gitignore ├── e2e ├── tsconfig.e2e.json ├── src │ ├── app.po.ts │ └── app.e2e-spec.ts └── protractor.conf.js ├── publish.sh ├── .github ├── issue_template.md └── workflows │ └── build.yml ├── LICENSE └── CONTRIBUTING.md /src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/app.component.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/public-api.ts: -------------------------------------------------------------------------------- 1 | export * from "./lib/core"; 2 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/src/public-api.ts: -------------------------------------------------------------------------------- 1 | export * from "./lib/ui-basic"; 2 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/public-api.ts: -------------------------------------------------------------------------------- 1 | export * from "./lib/ui-ionic"; 2 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/public-api.ts: -------------------------------------------------------------------------------- 1 | export * from "./lib/ui-primeng"; 2 | -------------------------------------------------------------------------------- /src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/favicon.ico -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/src/public-api.ts: -------------------------------------------------------------------------------- 1 | export * from "./lib/ui-bootstrap"; 2 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/src/public-api.ts: -------------------------------------------------------------------------------- 1 | export * from "./lib/ui-foundation"; 2 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/src/public-api.ts: -------------------------------------------------------------------------------- 1 | export * from "./lib/ui-material"; 2 | -------------------------------------------------------------------------------- /src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/assets/logo.png -------------------------------------------------------------------------------- /src/images/hue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/hue.png -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/public-api.ts: -------------------------------------------------------------------------------- 1 | export * from "./lib/ui-ng-bootstrap"; 2 | -------------------------------------------------------------------------------- /src/assets/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/assets/favicon.ico -------------------------------------------------------------------------------- /src/assets/logo@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/assets/logo@2x.png -------------------------------------------------------------------------------- /src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /src/images/color.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/color.png -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/public-api.ts: -------------------------------------------------------------------------------- 1 | export * from "./lib/ui-ngx-bootstrap"; 2 | -------------------------------------------------------------------------------- /src/images/icons_16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/icons_16.png -------------------------------------------------------------------------------- /src/assets/logo-github.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/assets/logo-github.png -------------------------------------------------------------------------------- /src/assets/logo-github@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/assets/logo-github@2x.png -------------------------------------------------------------------------------- /src/images/slider_handles.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/slider_handles.png -------------------------------------------------------------------------------- /schematics/.npmignore: -------------------------------------------------------------------------------- 1 | # Ignores TypeScript files, but keeps definitions. 2 | *.ts 3 | !*.d.ts 4 | 5 | src/versioning 6 | -------------------------------------------------------------------------------- /src/images/slider_handles@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/slider_handles@2x.png -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .angular/ 2 | .idea/ 3 | .DS_STORE 4 | npm-debug.log 5 | 6 | coverage/ 7 | dist/ 8 | docs/ 9 | node_modules/ 10 | -------------------------------------------------------------------------------- /src/fonts/roboto-v15-latin-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/fonts/roboto-v15-latin-regular.eot -------------------------------------------------------------------------------- /src/fonts/roboto-v15-latin-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/fonts/roboto-v15-latin-regular.ttf -------------------------------------------------------------------------------- /src/fonts/roboto-v15-latin-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/fonts/roboto-v15-latin-regular.woff -------------------------------------------------------------------------------- /src/images/ui-icons_222222_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-icons_222222_256x240.png -------------------------------------------------------------------------------- /src/images/ui-icons_2e83ff_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-icons_2e83ff_256x240.png -------------------------------------------------------------------------------- /src/images/ui-icons_454545_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-icons_454545_256x240.png -------------------------------------------------------------------------------- /src/images/ui-icons_cd0a0a_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-icons_cd0a0a_256x240.png -------------------------------------------------------------------------------- /src/images/ui-icons_ffffff_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-icons_ffffff_256x240.png -------------------------------------------------------------------------------- /src/fonts/roboto-v15-latin-regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/fonts/roboto-v15-latin-regular.woff2 -------------------------------------------------------------------------------- /src/images/ui-bg_flat_0_aaaaaa_40x100.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-bg_flat_0_aaaaaa_40x100.png -------------------------------------------------------------------------------- /src/images/ui-bg_flat_75_ffffff_40x100.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-bg_flat_75_ffffff_40x100.png -------------------------------------------------------------------------------- /src/images/ui-bg_glass_55_fbf9ee_1x400.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-bg_glass_55_fbf9ee_1x400.png -------------------------------------------------------------------------------- /src/images/ui-bg_glass_65_ffffff_1x400.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-bg_glass_65_ffffff_1x400.png -------------------------------------------------------------------------------- /src/images/ui-bg_glass_75_dadada_1x400.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-bg_glass_75_dadada_1x400.png -------------------------------------------------------------------------------- /src/images/ui-bg_glass_75_e6e6e6_1x400.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-bg_glass_75_e6e6e6_1x400.png -------------------------------------------------------------------------------- /src/images/ui-bg_glass_95_fef1ec_1x400.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-bg_glass_95_fef1ec_1x400.png -------------------------------------------------------------------------------- /src/images/ui-bg_highlight-soft_75_cccccc_1x100.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/udos86/ng-dynamic-forms/HEAD/src/images/ui-bg_highlight-soft_75_cccccc_1x100.png -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/misc/dynamic-form-control-path.model.ts: -------------------------------------------------------------------------------- 1 | export interface DynamicPathable { 2 | id?: string; 3 | index?: number | null; 4 | parent: DynamicPathable | null; 5 | } 6 | -------------------------------------------------------------------------------- /src/app/ui-material/material-sample-form.layout.ts: -------------------------------------------------------------------------------- 1 | export const MATERIAL_SAMPLE_FORM_LAYOUT = { 2 | addressStreet: { 3 | element: { 4 | host: "material-form-group" 5 | } 6 | } 7 | }; 8 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/dynamic-primeng-form.const.ts: -------------------------------------------------------------------------------- 1 | export const PRIME_NG_TEMPLATE_DIRECTIVES = new Map([ 2 | ["itemTemplate", "itemTemplate"], 3 | ["selectedItemTemplate", "selectedItemTemplate"] 4 | ]); 5 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/tsconfig.lib.prod.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.lib.json", 3 | "compilerOptions": { 4 | "declarationMap": false 5 | }, 6 | "angularCompilerOptions": { 7 | "compilationMode": "partial" 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/tsconfig.lib.prod.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.lib.json", 3 | "compilerOptions": { 4 | "declarationMap": false 5 | }, 6 | "angularCompilerOptions": { 7 | "compilationMode": "partial" 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/tsconfig.lib.prod.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.lib.json", 3 | "compilerOptions": { 4 | "declarationMap": false 5 | }, 6 | "angularCompilerOptions": { 7 | "compilationMode": "partial" 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/tsconfig.lib.prod.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.lib.json", 3 | "compilerOptions": { 4 | "declarationMap": false 5 | }, 6 | "angularCompilerOptions": { 7 | "compilationMode": "partial" 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/tsconfig.lib.prod.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.lib.json", 3 | "compilerOptions": { 4 | "declarationMap": false 5 | }, 6 | "angularCompilerOptions": { 7 | "compilationMode": "partial" 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/tsconfig.lib.prod.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.lib.json", 3 | "compilerOptions": { 4 | "declarationMap": false 5 | }, 6 | "angularCompilerOptions": { 7 | "compilationMode": "partial" 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/tsconfig.lib.prod.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.lib.json", 3 | "compilerOptions": { 4 | "declarationMap": false 5 | }, 6 | "angularCompilerOptions": { 7 | "compilationMode": "partial" 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/tsconfig.lib.prod.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.lib.json", 3 | "compilerOptions": { 4 | "declarationMap": false 5 | }, 6 | "angularCompilerOptions": { 7 | "compilationMode": "partial" 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/ng-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../../dist/ng-dynamic-forms/core", 4 | "lib": { 5 | "entryFile": "src/public-api.ts", 6 | "flatModuleFile": "core" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/tsconfig.lib.prod.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.lib.json", 3 | "compilerOptions": { 4 | "declarationMap": false 5 | }, 6 | "angularCompilerOptions": { 7 | "enableIvy": true, 8 | "compilationMode": "partial" 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/ng-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../../dist/ng-dynamic-forms/ui-basic", 4 | "lib": { 5 | "entryFile": "src/public-api.ts", 6 | "flatModuleFile": "ui-basic" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/ng-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../../dist/ng-dynamic-forms/ui-ionic", 4 | "lib": { 5 | "entryFile": "src/public-api.ts", 6 | "flatModuleFile": "ui-ionic" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "main.ts", 9 | "polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/ng-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../../dist/ng-dynamic-forms/ui-primeng", 4 | "lib": { 5 | "entryFile": "src/public-api.ts", 6 | "flatModuleFile": "ui-primeng" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /schematics/.gitignore: -------------------------------------------------------------------------------- 1 | # Outputs 2 | src/**/*.js 3 | src/**/*.js.map 4 | src/**/*.d.ts 5 | 6 | # IDEs 7 | .idea/ 8 | jsconfig.json 9 | .vscode/ 10 | 11 | # Misc 12 | node_modules/ 13 | npm-debug.log* 14 | yarn-error.log* 15 | 16 | # Mac OSX Finder files. 17 | **/.DS_Store 18 | .DS_Store 19 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/ng-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../../dist/ng-dynamic-forms/ui-material", 4 | "lib": { 5 | "entryFile": "src/public-api.ts", 6 | "flatModuleFile": "ui-material" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/ng-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../../dist/ng-dynamic-forms/ui-bootstrap", 4 | "lib": { 5 | "entryFile": "src/public-api.ts", 6 | "flatModuleFile": "ui-bootstrap" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/ng-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../../dist/ng-dynamic-forms/ui-foundation", 4 | "lib": { 5 | "entryFile": "src/public-api.ts", 6 | "flatModuleFile": "ui-foundation" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/ng-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../../dist/ng-dynamic-forms/ui-ng-bootstrap", 4 | "lib": { 5 | "entryFile": "src/public-api.ts", 6 | "flatModuleFile": "ui-ng-bootstrap" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/ng-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../../dist/ng-dynamic-forms/ui-ngx-bootstrap", 4 | "lib": { 5 | "entryFile": "src/public-api.ts", 6 | "flatModuleFile": "ui-ngx-bootstrap" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /schematics/collection.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../node_modules/@angular-devkit/schematics/collection-schema.json", 3 | "schematics": { 4 | "versioning": { 5 | "description": "Versioning Schematic", 6 | "factory": "./src/versioning/index", 7 | "schema": "./src/versioning/schema.json" 8 | } 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/component/dynamic-form-control-with-template-interface.ts: -------------------------------------------------------------------------------- 1 | import { DynamicFormControl } from "./dynamic-form-control-interface"; 2 | 3 | export interface DynamicFormControlWithTemplate extends DynamicFormControl { 4 | readonly templateDirectives: Map; 5 | 6 | viewChild: any; 7 | } 8 | -------------------------------------------------------------------------------- /src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "dynamic", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "dynamic", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "camelCase" 8 | ], 9 | "component-selector": [ 10 | true, 11 | "element", 12 | "dynamic", 13 | "kebab-case" 14 | ] 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/dynamic-form.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicFormControlModel } from "./dynamic-form-control.model"; 2 | import { DynamicFormGroupModel } from "./form-group/dynamic-form-group.model"; 3 | 4 | export type DynamicFormModel = DynamicFormControlModel[]; 5 | 6 | export type DynamicUnionFormModel = DynamicFormModel | DynamicFormGroupModel; 7 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts" 12 | ], 13 | "include": [ 14 | "**/*.spec.ts", 15 | "**/*.d.ts" 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts" 12 | ], 13 | "include": [ 14 | "**/*.spec.ts", 15 | "**/*.d.ts" 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "dynamic", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "dynamic", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts" 12 | ], 13 | "include": [ 14 | "**/*.spec.ts", 15 | "**/*.d.ts" 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "dynamic", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "dynamic", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "dynamic", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "dynamic", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts" 12 | ], 13 | "include": [ 14 | "**/*.spec.ts", 15 | "**/*.d.ts" 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "dynamic", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "dynamic", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get(browser.baseUrl + '#/bootstrap-sample-form/') as Promise; 6 | } 7 | 8 | getInputText() { 9 | const elm = element(by.css('#bsInput2')); 10 | 11 | return elm.getAttribute('value') as Promise; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts" 12 | ], 13 | "include": [ 14 | "**/*.spec.ts", 15 | "**/*.d.ts" 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "dynamic", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "dynamic", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts" 12 | ], 13 | "include": [ 14 | "**/*.spec.ts", 15 | "**/*.d.ts" 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "dynamic", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "dynamic", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts" 12 | ], 13 | "include": [ 14 | "**/*.spec.ts", 15 | "**/*.d.ts" 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts" 12 | ], 13 | "include": [ 14 | "**/*.spec.ts", 15 | "**/*.d.ts" 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "dynamic", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "dynamic", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "dynamic", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "dynamic", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /src/app/lazy-loaded/lazy-loaded-form.validators.ts: -------------------------------------------------------------------------------- 1 | import { AbstractControl, ValidationErrors } from "@angular/forms"; 2 | 3 | export function customLazyLoadedValidator(control: AbstractControl): ValidationErrors | null { 4 | const hasError = control.value ? (control.value as string).startsWith("lazy") : false; 5 | return hasError ? {customLazyLoadedValidator: true} : null; 6 | } 7 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts" 12 | ], 13 | "include": [ 14 | "**/*.spec.ts", 15 | "**/*.d.ts" 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Ng Dynamic Forms Sample App 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/misc/dynamic-form-control-relation.model.ts: -------------------------------------------------------------------------------- 1 | export interface DynamicFormControlCondition { 2 | id?: string; 3 | rootPath?: string; 4 | status?: string; 5 | value?: any; 6 | } 7 | 8 | export interface DynamicFormControlRelation { 9 | match: string; 10 | operator?: string; 11 | when: DynamicFormControlCondition[]; 12 | } 13 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/misc/dynamic-form-control-validation.model.ts: -------------------------------------------------------------------------------- 1 | export interface DynamicValidatorDescriptor { 2 | name: string; 3 | args: any; 4 | } 5 | 6 | export type DynamicValidatorsConfig = { [validatorKey: string]: any | DynamicValidatorDescriptor }; 7 | 8 | export enum DynamicFormHook { 9 | Blur = "blur", 10 | Change = "change", 11 | Submit = "submit" 12 | } 13 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/README.md: -------------------------------------------------------------------------------- 1 | # NG Dynamic Forms Core 2 | 3 | ## Installation 4 | ``` 5 | npm i @ng-dynamic-forms/core -S 6 | ``` 7 | 8 | ## Import 9 | ``` 10 | @NgModule({ 11 | 12 | imports: [ 13 | ReactiveFormsModule, 14 | DynamicFormsCoreModule 15 | ] 16 | }) 17 | 18 | export class AppModule {} 19 | ``` 20 | 21 | ## Resources 22 | 23 | * [**API Documentation**](http://ng2-dynamic-forms.udos86.de/docs/core/) 24 | -------------------------------------------------------------------------------- /src/app/lazy-loaded/lazy-loaded-form.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | 5 | 8 |
9 | 10 |
-------------------------------------------------------------------------------- /src/app/lazy-loaded/lazy-loaded-form.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicInputModel } from "@ng-dynamic-forms/core"; 2 | 3 | export const LAZY_LOADED_FORM_MODEL = [ 4 | new DynamicInputModel({ 5 | id: "asyncInput", 6 | label: "Sample Async Input", 7 | validators: { 8 | // customLazyLoadedValidator: null 9 | }, 10 | errorMessages: { 11 | // customLazyLoadedValidator: "Lazy invalid" 12 | } 13 | }) 14 | ]; 15 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/input-switch/dynamic-primeng-input-switch.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 9 | 10 |
11 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/src/lib/ui-basic.ts: -------------------------------------------------------------------------------- 1 | export * from "./checkbox/dynamic-basic-checkbox.component"; 2 | export * from "./input/dynamic-basic-input.component"; 3 | export * from "./radio-group/dynamic-basic-radio-group.component"; 4 | export * from "./select/dynamic-basic-select.component"; 5 | export * from "./textarea/dynamic-basic-textarea.component"; 6 | 7 | export * from "./dynamic-basic-form.component"; 8 | export * from "./dynamic-basic-form-control-container.component"; 9 | 10 | -------------------------------------------------------------------------------- /publish.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | 3 | npm publish ./dist/ng-dynamic-forms/core/ 4 | npm publish ./dist/ng-dynamic-forms/ui-basic/ 5 | npm publish ./dist/ng-dynamic-forms/ui-bootstrap/ 6 | npm publish ./dist/ng-dynamic-forms/ui-foundation/ 7 | npm publish ./dist/ng-dynamic-forms/ui-ionic/ 8 | npm publish ./dist/ng-dynamic-forms/ui-material/ 9 | npm publish ./dist/ng-dynamic-forms/ui-ng-bootstrap/ 10 | npm publish ./dist/ng-dynamic-forms/ui-ngx-bootstrap/ 11 | npm publish ./dist/ng-dynamic-forms/ui-primeng/ 12 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/src/lib/rating/dynamic-bootstrap-rating.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/lib/rating/dynamic-ngx-bootstrap-rating.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/dynamic-primeng-form-control-with-template.component.ts: -------------------------------------------------------------------------------- 1 | import { TemplateRef } from "@angular/core"; 2 | import { DynamicFormControlWithTemplateComponent, DynamicTemplateDirective } from "@ng-dynamic-forms/core"; 3 | 4 | export abstract class DynamicPrimeNGFormControlWithTemplateComponent extends DynamicFormControlWithTemplateComponent { 5 | mapTemplate(template: DynamicTemplateDirective): DynamicTemplateDirective | TemplateRef { 6 | return template.templateRef; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /projects/tsconfig.compodoc.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "experimentalDecorators": true, 11 | "target": "es5", 12 | "typeRoots": [ 13 | "node_modules/@types" 14 | ], 15 | "lib": [ 16 | "es2018", 17 | "dom" 18 | ], 19 | "include": [ 20 | "**/*.ts" 21 | ] 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/service/dynamic-form-validators.ts: -------------------------------------------------------------------------------- 1 | import { InjectionToken } from "@angular/core"; 2 | import { AsyncValidatorFn, ValidatorFn } from "@angular/forms"; 3 | 4 | export type Validator = ValidatorFn | AsyncValidatorFn; 5 | 6 | export type ValidatorFactory = (args: any) => Validator; 7 | 8 | export type ValidatorsToken = Validator[]; 9 | 10 | export type ValidatorsMap = Map; 11 | 12 | export const DYNAMIC_VALIDATORS = new InjectionToken("DYNAMIC_VALIDATORS"); 13 | -------------------------------------------------------------------------------- /schematics/src/versioning/schema.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "http://json-schema.org/schema", 3 | "$id": "Versioning Schematic", 4 | "title": "Versioning Schematic", 5 | "type": "object", 6 | "description": "Updates version number based on a given increment", 7 | "properties": { 8 | "increment": { 9 | "type": "string", 10 | "x-prompt": "Which version update would you like to run", 11 | "enum": [ 12 | "Patch", 13 | "Minor", 14 | "Major" 15 | ] 16 | } 17 | }, 18 | "required": [ 19 | "increment" 20 | ] 21 | } 22 | -------------------------------------------------------------------------------- /src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/testing'; 4 | import { getTestBed } from '@angular/core/testing'; 5 | import { 6 | BrowserDynamicTestingModule, 7 | platformBrowserDynamicTesting 8 | } from '@angular/platform-browser-dynamic/testing'; 9 | 10 | // First, initialize the Angular testing environment. 11 | getTestBed().initTestEnvironment( 12 | BrowserDynamicTestingModule, 13 | platformBrowserDynamicTesting(), { 14 | teardown: { destroyAfterEach: false } 15 | } 16 | ); 17 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/lib/dynamic-ionic-form-control-container.component.html: -------------------------------------------------------------------------------- 1 |
3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/colorpicker/dynamic-primeng-colorpicker.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 11 | 12 |
13 | -------------------------------------------------------------------------------- /src/app/ui-primeng/primeng-sample-form.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | 5 | 10 | 11 |
12 | 13 |
{{formGroup.value | json}}
14 | 15 |
16 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/src/lib/ui-foundation.ts: -------------------------------------------------------------------------------- 1 | export * from "./checkbox/dynamic-foundation-checkbox.component"; 2 | export * from "./input/dynamic-foundation-input.component"; 3 | export * from "./radio-group/dynamic-foundation-radio-group.component"; 4 | export * from "./select/dynamic-foundation-select.component"; 5 | export * from "./switch/dynamic-foundation-switch.component"; 6 | export * from "./textarea/dynamic-foundation-textarea.component"; 7 | 8 | export * from "./dynamic-foundation-form.component"; 9 | export * from "./dynamic-foundation-form-control-container.component"; 10 | 11 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/editor/dynamic-primeng-editor.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 11 | 12 |
13 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/rating/dynamic-ng-bootstrap-rating.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/src/lib/dynamic-basic-form.component.html: -------------------------------------------------------------------------------- 1 | 10 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/chips/dynamic-primeng-chips.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 12 | 13 |
14 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/checkbox/dynamic-primeng-checkbox.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 13 | 14 |
15 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js'; 4 | import 'zone.js/testing'; 5 | import { getTestBed } from '@angular/core/testing'; 6 | import { 7 | BrowserDynamicTestingModule, 8 | platformBrowserDynamicTesting 9 | } from '@angular/platform-browser-dynamic/testing'; 10 | 11 | // First, initialize the Angular testing environment. 12 | getTestBed().initTestEnvironment( 13 | BrowserDynamicTestingModule, 14 | platformBrowserDynamicTesting(), { 15 | teardown: { destroyAfterEach: false } 16 | } 17 | ); 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'core-js/es/reflect'; 4 | import 'zone.js'; 5 | import 'zone.js/testing'; 6 | import { getTestBed } from '@angular/core/testing'; 7 | import { 8 | BrowserDynamicTestingModule, 9 | platformBrowserDynamicTesting 10 | } from '@angular/platform-browser-dynamic/testing'; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting(), { 16 | teardown: { destroyAfterEach: false } 17 | } 18 | ); 19 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'core-js/es/reflect'; 4 | import 'zone.js'; 5 | import 'zone.js/testing'; 6 | import { getTestBed } from '@angular/core/testing'; 7 | import { 8 | BrowserDynamicTestingModule, 9 | platformBrowserDynamicTesting 10 | } from '@angular/platform-browser-dynamic/testing'; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting(), { 16 | teardown: { destroyAfterEach: false } 17 | } 18 | ); 19 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'core-js/es/reflect'; 4 | import 'zone.js'; 5 | import 'zone.js/testing'; 6 | import { getTestBed } from '@angular/core/testing'; 7 | import { 8 | BrowserDynamicTestingModule, 9 | platformBrowserDynamicTesting 10 | } from '@angular/platform-browser-dynamic/testing'; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting(), { 16 | teardown: { destroyAfterEach: false } 17 | } 18 | ); 19 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'core-js/es/reflect'; 4 | import 'zone.js'; 5 | import 'zone.js/testing'; 6 | import { getTestBed } from '@angular/core/testing'; 7 | import { 8 | BrowserDynamicTestingModule, 9 | platformBrowserDynamicTesting 10 | } from '@angular/platform-browser-dynamic/testing'; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting(), { 16 | teardown: { destroyAfterEach: false } 17 | } 18 | ); 19 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'core-js/es/reflect'; 4 | import 'zone.js'; 5 | import 'zone.js/testing'; 6 | import { getTestBed } from '@angular/core/testing'; 7 | import { 8 | BrowserDynamicTestingModule, 9 | platformBrowserDynamicTesting 10 | } from '@angular/platform-browser-dynamic/testing'; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting(), { 16 | teardown: { destroyAfterEach: false } 17 | } 18 | ); 19 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'core-js/es/reflect'; 4 | import 'zone.js'; 5 | import 'zone.js/testing'; 6 | import { getTestBed } from '@angular/core/testing'; 7 | import { 8 | BrowserDynamicTestingModule, 9 | platformBrowserDynamicTesting 10 | } from '@angular/platform-browser-dynamic/testing'; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting(), { 16 | teardown: { destroyAfterEach: false } 17 | } 18 | ); 19 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'core-js/es/reflect'; 4 | import 'zone.js'; 5 | import 'zone.js/testing'; 6 | import { getTestBed } from '@angular/core/testing'; 7 | import { 8 | BrowserDynamicTestingModule, 9 | platformBrowserDynamicTesting 10 | } from '@angular/platform-browser-dynamic/testing'; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting(), { 16 | teardown: { destroyAfterEach: false } 17 | } 18 | ); 19 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/utils/core.utils.ts: -------------------------------------------------------------------------------- 1 | export function isBoolean(value: any): value is boolean { 2 | return typeof value === "boolean"; 3 | } 4 | 5 | // tslint:disable-next-line:ban-types 6 | export function isFunction(value: any): value is Function { 7 | return typeof value === "function"; 8 | } 9 | 10 | export function isNumber(value: any): value is number { 11 | return typeof value === "number"; 12 | } 13 | 14 | export function isObject(value: any): value is object { 15 | return typeof value === "object" && value !== null; 16 | } 17 | 18 | export function isString(value: any): value is string { 19 | return typeof value === "string"; 20 | } 21 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/lib/ui-ionic.ts: -------------------------------------------------------------------------------- 1 | export * from "./checkbox/dynamic-ionic-checkbox.component"; 2 | export * from "./datetime/dynamic-ionic-datetime.component"; 3 | export * from "./input/dynamic-ionic-input.component"; 4 | export * from "./radio-group/dynamic-ionic-radio-group.component"; 5 | export * from "./range/dynamic-ionic-range.component"; 6 | export * from "./select/dynamic-ionic-select.component"; 7 | export * from "./textarea/dynamic-ionic-textarea.component"; 8 | export * from "./toggle/dynamic-ionic-toggle.component"; 9 | 10 | export * from "./dynamic-ionic-form.component"; 11 | export * from "./dynamic-ionic-form-control-container.component"; 12 | 13 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/tsconfig.lib.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/lib", 5 | "declarationMap": true, 6 | "declaration": true, 7 | "inlineSources": true, 8 | "types": [], 9 | "lib": [ 10 | "dom", 11 | "es2018" 12 | ] 13 | }, 14 | "angularCompilerOptions": { 15 | "skipTemplateCodegen": true, 16 | "strictMetadataEmit": true, 17 | "fullTemplateTypeCheck": true, 18 | "strictInjectionParameters": true, 19 | "enableResourceInlining": true 20 | }, 21 | "exclude": [ 22 | "src/test.ts", 23 | "**/*.spec.ts" 24 | ] 25 | } 26 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/src/lib/dynamic-foundation-form.component.html: -------------------------------------------------------------------------------- 1 | 10 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/lib/dynamic-ionic-form.component.html: -------------------------------------------------------------------------------- 1 | 11 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/core.module.ts: -------------------------------------------------------------------------------- 1 | import { CommonModule } from "@angular/common"; 2 | import { NgModule } from "@angular/core"; 3 | import { ReactiveFormsModule } from "@angular/forms"; 4 | import { DynamicListDirective } from "./directive/dynamic-list.directive"; 5 | import { DynamicTemplateDirective } from "./directive/dynamic-template.directive"; 6 | 7 | @NgModule({ 8 | imports: [ 9 | CommonModule, 10 | ReactiveFormsModule, 11 | DynamicListDirective, 12 | DynamicTemplateDirective 13 | ], 14 | exports: [ 15 | DynamicListDirective, 16 | DynamicTemplateDirective 17 | ] 18 | }) 19 | export class DynamicFormsCoreModule { 20 | } 21 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'core-js/es/reflect'; 4 | import 'zone.js'; 5 | import 'zone.js/testing'; 6 | import '@angular/localize/init'; 7 | import { getTestBed } from '@angular/core/testing'; 8 | import { 9 | BrowserDynamicTestingModule, 10 | platformBrowserDynamicTesting 11 | } from '@angular/platform-browser-dynamic/testing'; 12 | 13 | // First, initialize the Angular testing environment. 14 | getTestBed().initTestEnvironment( 15 | BrowserDynamicTestingModule, 16 | platformBrowserDynamicTesting(), { 17 | teardown: { destroyAfterEach: false } 18 | } 19 | ); 20 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/directive/dynamic-list.directive.ts: -------------------------------------------------------------------------------- 1 | import { Directive, ElementRef, Input, Renderer2, AfterViewInit } from "@angular/core"; 2 | import { isString } from "../utils/core.utils"; 3 | 4 | @Directive({ 5 | selector: "[dynamicList]", 6 | standalone: true 7 | }) 8 | export class DynamicListDirective implements AfterViewInit { 9 | @Input("dynamicList") listId?: string; 10 | 11 | constructor(private elementRef: ElementRef, private renderer: Renderer2) { 12 | } 13 | 14 | ngAfterViewInit() { 15 | if (isString(this.listId)) { 16 | this.renderer.setAttribute(this.elementRef.nativeElement, "list", this.listId as string); 17 | } 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/directive/dynamic-template.directive.ts: -------------------------------------------------------------------------------- 1 | import { Directive, Input, TemplateRef } from "@angular/core"; 2 | 3 | export enum DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT { 4 | Start = "START", 5 | End = "END" 6 | } 7 | 8 | @Directive({ 9 | selector: "ng-template[modelId],ng-template[modelType]", 10 | standalone: true 11 | }) 12 | export class DynamicTemplateDirective { 13 | @Input() align: string = DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT.End; 14 | @Input() as: string | null = null; 15 | @Input() index?: number; 16 | @Input() modelId?: string; 17 | @Input() modelType?: string; 18 | 19 | constructor(public templateRef: TemplateRef) { 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/dynamic-primeng-form.component.html: -------------------------------------------------------------------------------- 1 | 11 | -------------------------------------------------------------------------------- /e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | import { browser, logging } from 'protractor'; 3 | 4 | describe('workspace-project App', () => { 5 | let page: AppPage; 6 | 7 | beforeEach(() => { 8 | page = new AppPage(); 9 | }); 10 | 11 | it('should display value in input', () => { 12 | page.navigateTo(); 13 | expect(page.getInputText()).toEqual('Test'); 14 | }); 15 | 16 | afterEach(async () => { 17 | // Assert that there are no errors emitted from the browser 18 | const logs = await browser.manage().logs().get(logging.Type.BROWSER); 19 | expect(logs).not.toContain(jasmine.objectContaining({ 20 | level: logging.Level.SEVERE, 21 | } as logging.Entry)); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/src/lib/ui-bootstrap.ts: -------------------------------------------------------------------------------- 1 | export * from "./checkbox/dynamic-bootstrap-checkbox.component"; 2 | export * from "./datepicker/dynamic-bootstrap-datepicker.component"; 3 | export * from "./input/dynamic-bootstrap-input.component"; 4 | export * from "./radio-group/dynamic-bootstrap-radio-group.component"; 5 | export * from "./rating/dynamic-bootstrap-rating.component"; 6 | export * from "./select/dynamic-bootstrap-select.component"; 7 | export * from "./textarea/dynamic-bootstrap-textarea.component"; 8 | export * from "./timepicker/dynamic-bootstrap-timepicker.component"; 9 | 10 | export * from "./dynamic-bootstrap-form.component"; 11 | export * from "./dynamic-bootstrap-form-control-container.component"; 12 | 13 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/src/lib/dynamic-material-form.component.html: -------------------------------------------------------------------------------- 1 | 11 | -------------------------------------------------------------------------------- /.github/issue_template.md: -------------------------------------------------------------------------------- 1 | 4 | 5 | ## I'm submitting a 6 | 7 |

 8 | [ ] Bug / Regression
 9 | [ ] Feature Request / Proposal
10 | 
11 | 12 | ## I'm using 13 | 14 |

15 | NG Dynamic Forms Version: `X.Y.Z`
16 | 
17 | [ ] Basic UI
18 | [ ] Bootstrap UI  
19 | [ ] Foundation UI
20 | [ ] Ionic UI
21 | [ ] Material  
22 | [ ] NG Bootstrap
23 | [ ] Prime NG
24 | 
25 | 26 | ## Description 27 | 28 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/src/lib/dynamic-bootstrap-form.component.html: -------------------------------------------------------------------------------- 1 | 11 | -------------------------------------------------------------------------------- /src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | // This file can be replaced during build by using the `fileReplacements` array. 2 | // `ng build --prod` replaces `environment.ts` with `environment.prod.ts`. 3 | // The list of file replacements can be found in `angular.json`. 4 | 5 | export const environment = { 6 | production: false 7 | }; 8 | 9 | /* 10 | * For easier debugging in development mode, you can import the following file 11 | * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`. 12 | * 13 | * This import should be commented out in production mode because it will have a negative impact 14 | * on performance if an error is thrown. 15 | */ 16 | // import 'zone.js/plugins/zone-error'; // Included with Angular CLI. 17 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/lib/checkbox-group/dynamic-ngx-bootstrap-checkbox-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
7 | 8 | 14 |
15 | 16 |
17 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/radio-group/dynamic-primeng-radio-group.component.html: -------------------------------------------------------------------------------- 1 |
6 | 7 |
8 | 9 | 15 |
16 | 17 |
18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/lib/toggle/dynamic-ionic-toggle.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 6 | 7 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/dynamic-ng-bootstrap-form.component.html: -------------------------------------------------------------------------------- 1 | 11 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/lib/radio-group/dynamic-ngx-bootstrap-radio-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
9 | 10 | 15 |
16 | 17 |
18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/component/dynamic-form-group.component.ts: -------------------------------------------------------------------------------- 1 | import { DynamicFormControlComponent } from "./dynamic-form-control.component"; 2 | import { DynamicFormGroupModel } from "../model/form-group/dynamic-form-group.model"; 3 | import { QueryList } from "@angular/core"; 4 | import { DynamicFormControlContainerComponent } from "./dynamic-form-control-container.component"; 5 | 6 | export abstract class DynamicFormGroupComponent extends DynamicFormControlComponent { 7 | components!: QueryList; 8 | model!: DynamicFormGroupModel; 9 | 10 | markForCheck() { 11 | if (this.components instanceof QueryList) { 12 | this.components.forEach(component => component.markForCheck()); 13 | } 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/slider/dynamic-primeng-slider.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 15 | 16 |
17 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2016-2021, Udo Schöfer http://www.udos86.de 2 | 3 | Permission to use, copy, modify, and/or distribute this software for any 4 | purpose with or without fee is hereby granted, provided that the above 5 | copyright notice and this permission notice appear in all copies. 6 | 7 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES 8 | WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF 9 | MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR 10 | ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES 11 | WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN 12 | ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF 13 | OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 14 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/src/lib/checkbox/dynamic-basic-checkbox.component.html: -------------------------------------------------------------------------------- 1 | 16 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/switch/dynamic-ng-bootstrap-switch.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 15 | 16 | 17 | 18 |
19 | 20 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/lib/dynamic-ngx-bootstrap-form.component.html: -------------------------------------------------------------------------------- 1 | 11 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/lib/checkbox/dynamic-ionic-checkbox.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 6 | 7 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/src/lib/select/dynamic-foundation-select.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/lib/textarea/dynamic-ionic-textarea.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 6 | 7 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/rating/dynamic-primeng-rating.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 14 | 15 |
16 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/misc/dynamic-form-control-layout.model.ts: -------------------------------------------------------------------------------- 1 | export interface DynamicFormControlLayoutConfig { 2 | children?: string; 3 | container?: string; 4 | control?: string; 5 | errors?: string; 6 | group?: string; 7 | hint?: string; 8 | host?: string; 9 | label?: string; 10 | option?: string; 11 | 12 | [key: string]: string | undefined; 13 | } 14 | 15 | export interface DynamicFormControlLayout { 16 | element?: DynamicFormControlLayoutConfig; 17 | grid?: DynamicFormControlLayoutConfig; 18 | 19 | [key: string]: DynamicFormControlLayoutConfig | undefined; 20 | } 21 | 22 | export type DynamicFormControlLayoutPlace = keyof DynamicFormControlLayoutConfig; 23 | 24 | export type DynamicFormControlLayoutContext = keyof DynamicFormControlLayout; 25 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/src/lib/checkbox/dynamic-foundation-checkbox.component.html: -------------------------------------------------------------------------------- 1 | 17 | -------------------------------------------------------------------------------- /schematics/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": "tsconfig", 4 | "lib": [ 5 | "es2018", 6 | "dom" 7 | ], 8 | "declaration": true, 9 | "module": "commonjs", 10 | "moduleResolution": "node", 11 | "noEmitOnError": true, 12 | "noFallthroughCasesInSwitch": true, 13 | "noImplicitAny": true, 14 | "noImplicitThis": true, 15 | "noUnusedParameters": true, 16 | "noUnusedLocals": true, 17 | "rootDir": "src/", 18 | "skipDefaultLibCheck": true, 19 | "skipLibCheck": true, 20 | "sourceMap": true, 21 | "strictNullChecks": true, 22 | "target": "es6", 23 | "types": [ 24 | "jasmine", 25 | "node" 26 | ] 27 | }, 28 | "include": [ 29 | "src/**/*" 30 | ], 31 | "exclude": [ 32 | "src/*/files/**/*" 33 | ] 34 | } 35 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/editor/dynamic-editor.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicInputControlModel, DynamicInputControlModelConfig } from "../dynamic-input-control.model"; 2 | import { DynamicFormControlLayout } from "../misc/dynamic-form-control-layout.model"; 3 | import { serializable } from "../../decorator/serializable.decorator"; 4 | 5 | export const DYNAMIC_FORM_CONTROL_TYPE_EDITOR = "EDITOR"; 6 | 7 | export interface DynamicEditorModelConfig extends DynamicInputControlModelConfig { 8 | } 9 | 10 | export class DynamicEditorModel extends DynamicInputControlModel { 11 | @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_EDITOR; 12 | 13 | constructor(config: DynamicEditorModelConfig, layout?: DynamicFormControlLayout) { 14 | super(config, layout); 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2016-2019, Udo Schöfer http://www.udos86.de 2 | 3 | Permission to use, copy, modify, and/or distribute this software for any 4 | purpose with or without fee is hereby granted, provided that the above 5 | copyright notice and this permission notice appear in all copies. 6 | 7 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES 8 | WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF 9 | MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR 10 | ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES 11 | WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN 12 | ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF 13 | OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 14 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/tsconfig.lib.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/lib", 5 | "declarationMap": true, 6 | "module": "es2015", 7 | "moduleResolution": "node", 8 | "declaration": true, 9 | "sourceMap": true, 10 | "inlineSources": true, 11 | "experimentalDecorators": true, 12 | "importHelpers": true, 13 | "types": [], 14 | "lib": [ 15 | "dom", 16 | "es2018" 17 | ] 18 | }, 19 | "angularCompilerOptions": { 20 | "skipTemplateCodegen": true, 21 | "strictMetadataEmit": true, 22 | "fullTemplateTypeCheck": true, 23 | "strictInjectionParameters": true, 24 | "enableResourceInlining": true 25 | }, 26 | "exclude": [ 27 | "src/test.ts", 28 | "**/*.spec.ts" 29 | ] 30 | } 31 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2016-2019, Udo Schöfer http://www.udos86.de 2 | 3 | Permission to use, copy, modify, and/or distribute this software for any 4 | purpose with or without fee is hereby granted, provided that the above 5 | copyright notice and this permission notice appear in all copies. 6 | 7 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES 8 | WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF 9 | MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR 10 | ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES 11 | WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN 12 | ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF 13 | OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 14 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/tsconfig.lib.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/lib", 5 | "declarationMap": true, 6 | "module": "es2015", 7 | "moduleResolution": "node", 8 | "declaration": true, 9 | "sourceMap": true, 10 | "inlineSources": true, 11 | "experimentalDecorators": true, 12 | "importHelpers": true, 13 | "types": [], 14 | "lib": [ 15 | "dom", 16 | "es2018" 17 | ] 18 | }, 19 | "angularCompilerOptions": { 20 | "skipTemplateCodegen": true, 21 | "strictMetadataEmit": true, 22 | "fullTemplateTypeCheck": true, 23 | "strictInjectionParameters": true, 24 | "enableResourceInlining": true 25 | }, 26 | "exclude": [ 27 | "src/test.ts", 28 | "**/*.spec.ts" 29 | ] 30 | } 31 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2016-2019, Udo Schöfer http://www.udos86.de 2 | 3 | Permission to use, copy, modify, and/or distribute this software for any 4 | purpose with or without fee is hereby granted, provided that the above 5 | copyright notice and this permission notice appear in all copies. 6 | 7 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES 8 | WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF 9 | MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR 10 | ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES 11 | WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN 12 | ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF 13 | OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 14 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/tsconfig.lib.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/lib", 5 | "declarationMap": true, 6 | "module": "es2015", 7 | "moduleResolution": "node", 8 | "declaration": true, 9 | "sourceMap": true, 10 | "inlineSources": true, 11 | "experimentalDecorators": true, 12 | "importHelpers": true, 13 | "types": [], 14 | "lib": [ 15 | "dom", 16 | "es2018" 17 | ] 18 | }, 19 | "angularCompilerOptions": { 20 | "skipTemplateCodegen": true, 21 | "strictMetadataEmit": true, 22 | "fullTemplateTypeCheck": true, 23 | "strictInjectionParameters": true, 24 | "enableResourceInlining": true 25 | }, 26 | "exclude": [ 27 | "src/test.ts", 28 | "**/*.spec.ts" 29 | ] 30 | } 31 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2016-2019, Udo Schöfer http://www.udos86.de 2 | 3 | Permission to use, copy, modify, and/or distribute this software for any 4 | purpose with or without fee is hereby granted, provided that the above 5 | copyright notice and this permission notice appear in all copies. 6 | 7 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES 8 | WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF 9 | MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR 10 | ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES 11 | WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN 12 | ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF 13 | OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 14 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/tsconfig.lib.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/lib", 5 | "declarationMap": true, 6 | "module": "es2015", 7 | "moduleResolution": "node", 8 | "declaration": true, 9 | "sourceMap": true, 10 | "inlineSources": true, 11 | "experimentalDecorators": true, 12 | "importHelpers": true, 13 | "types": [], 14 | "lib": [ 15 | "dom", 16 | "es2018" 17 | ] 18 | }, 19 | "angularCompilerOptions": { 20 | "skipTemplateCodegen": true, 21 | "strictMetadataEmit": true, 22 | "fullTemplateTypeCheck": true, 23 | "strictInjectionParameters": true, 24 | "enableResourceInlining": true 25 | }, 26 | "exclude": [ 27 | "src/test.ts", 28 | "**/*.spec.ts" 29 | ] 30 | } 31 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2016-2019, Udo Schöfer http://www.udos86.de 2 | 3 | Permission to use, copy, modify, and/or distribute this software for any 4 | purpose with or without fee is hereby granted, provided that the above 5 | copyright notice and this permission notice appear in all copies. 6 | 7 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES 8 | WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF 9 | MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR 10 | ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES 11 | WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN 12 | ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF 13 | OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 14 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/tsconfig.lib.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/lib", 5 | "declarationMap": true, 6 | "module": "es2015", 7 | "moduleResolution": "node", 8 | "declaration": true, 9 | "sourceMap": true, 10 | "inlineSources": true, 11 | "experimentalDecorators": true, 12 | "importHelpers": true, 13 | "types": [], 14 | "lib": [ 15 | "dom", 16 | "es2018" 17 | ] 18 | }, 19 | "angularCompilerOptions": { 20 | "skipTemplateCodegen": true, 21 | "strictMetadataEmit": true, 22 | "fullTemplateTypeCheck": true, 23 | "strictInjectionParameters": true, 24 | "enableResourceInlining": true 25 | }, 26 | "exclude": [ 27 | "src/test.ts", 28 | "**/*.spec.ts" 29 | ] 30 | } 31 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2016-2019, Udo Schöfer http://www.udos86.de 2 | 3 | Permission to use, copy, modify, and/or distribute this software for any 4 | purpose with or without fee is hereby granted, provided that the above 5 | copyright notice and this permission notice appear in all copies. 6 | 7 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES 8 | WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF 9 | MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR 10 | ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES 11 | WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN 12 | ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF 13 | OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 14 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/tsconfig.lib.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/lib", 5 | "declarationMap": true, 6 | "module": "es2015", 7 | "moduleResolution": "node", 8 | "declaration": true, 9 | "sourceMap": true, 10 | "inlineSources": true, 11 | "experimentalDecorators": true, 12 | "importHelpers": true, 13 | "types": [], 14 | "lib": [ 15 | "dom", 16 | "es2018" 17 | ] 18 | }, 19 | "angularCompilerOptions": { 20 | "skipTemplateCodegen": true, 21 | "strictMetadataEmit": true, 22 | "fullTemplateTypeCheck": true, 23 | "strictInjectionParameters": true, 24 | "enableResourceInlining": true 25 | }, 26 | "exclude": [ 27 | "src/test.ts", 28 | "**/*.spec.ts" 29 | ] 30 | } 31 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/src/lib/select/dynamic-basic-select.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2016-2019, Udo Schöfer http://www.udos86.de 2 | 3 | Permission to use, copy, modify, and/or distribute this software for any 4 | purpose with or without fee is hereby granted, provided that the above 5 | copyright notice and this permission notice appear in all copies. 6 | 7 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES 8 | WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF 9 | MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR 10 | ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES 11 | WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN 12 | ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF 13 | OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 14 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/tsconfig.lib.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/lib", 5 | "declarationMap": true, 6 | "module": "es2015", 7 | "moduleResolution": "node", 8 | "declaration": true, 9 | "sourceMap": true, 10 | "inlineSources": true, 11 | "experimentalDecorators": true, 12 | "importHelpers": true, 13 | "types": [], 14 | "lib": [ 15 | "dom", 16 | "es2018" 17 | ] 18 | }, 19 | "angularCompilerOptions": { 20 | "skipTemplateCodegen": true, 21 | "strictMetadataEmit": true, 22 | "fullTemplateTypeCheck": true, 23 | "strictInjectionParameters": true, 24 | "enableResourceInlining": true 25 | }, 26 | "exclude": [ 27 | "src/test.ts", 28 | "**/*.spec.ts" 29 | ] 30 | } 31 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2016-2019, Udo Schöfer http://www.udos86.de 2 | 3 | Permission to use, copy, modify, and/or distribute this software for any 4 | purpose with or without fee is hereby granted, provided that the above 5 | copyright notice and this permission notice appear in all copies. 6 | 7 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES 8 | WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF 9 | MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR 10 | ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES 11 | WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN 12 | ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF 13 | OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 14 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/tsconfig.lib.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/lib", 5 | "declarationMap": true, 6 | "module": "es2015", 7 | "moduleResolution": "node", 8 | "declaration": true, 9 | "sourceMap": true, 10 | "inlineSources": true, 11 | "experimentalDecorators": true, 12 | "importHelpers": true, 13 | "types": [], 14 | "lib": [ 15 | "dom", 16 | "es2018" 17 | ] 18 | }, 19 | "angularCompilerOptions": { 20 | "skipTemplateCodegen": true, 21 | "strictMetadataEmit": true, 22 | "fullTemplateTypeCheck": true, 23 | "strictInjectionParameters": true, 24 | "enableResourceInlining": true 25 | }, 26 | "exclude": [ 27 | "src/test.ts", 28 | "**/*.spec.ts" 29 | ] 30 | } 31 | -------------------------------------------------------------------------------- /src/app/ui-ng-bootstrap/ng-bootstrap-sample-form.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | 5 | 12 | 13 |
14 | 15 | 16 | 17 |
{{formGroup.value | json}}
18 | 19 |
20 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/src/lib/select/dynamic-bootstrap-select.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/lib/ui-ngx-bootstrap.ts: -------------------------------------------------------------------------------- 1 | export * from "./checkbox/dynamic-ngx-bootstrap-checkbox.component"; 2 | export * from "./checkbox-group/dynamic-ngx-bootstrap-checkbox-group.component"; 3 | export * from "./datepicker/dynamic-ngx-bootstrap-datepicker.component"; 4 | export * from "./input/dynamic-ngx-bootstrap-input.component"; 5 | export * from "./radio-group/dynamic-ngx-bootstrap-radio-group.component"; 6 | export * from "./rating/dynamic-ngx-bootstrap-rating.component"; 7 | export * from "./select/dynamic-ngx-bootstrap-select.component"; 8 | export * from "./textarea/dynamic-ngx-bootstrap-textarea.component"; 9 | export * from "./timepicker/dynamic-ngx-bootstrap-timepicker.component"; 10 | 11 | export * from "./dynamic-ngx-bootstrap-form.component"; 12 | export * from "./dynamic-ngx-bootstrap-form-control-container.component"; 13 | 14 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/src/lib/radio-group/dynamic-foundation-radio-group.component.html: -------------------------------------------------------------------------------- 1 |
8 | 9 | 10 | 11 | 19 | 20 |
21 | -------------------------------------------------------------------------------- /e2e/protractor.conf.js: -------------------------------------------------------------------------------- 1 | // Protractor configuration file, see link for more information 2 | // https://github.com/angular/protractor/blob/master/lib/config.ts 3 | 4 | const { SpecReporter } = require('jasmine-spec-reporter'); 5 | 6 | exports.config = { 7 | allScriptsTimeout: 11000, 8 | specs: [ 9 | './src/**/*.e2e-spec.ts' 10 | ], 11 | capabilities: { 12 | 'browserName': 'chrome' 13 | }, 14 | directConnect: true, 15 | baseUrl: 'http://localhost:4200/', 16 | framework: 'jasmine', 17 | jasmineNodeOpts: { 18 | showColors: true, 19 | defaultTimeoutInterval: 30000, 20 | print: function() {} 21 | }, 22 | onPrepare() { 23 | require('ts-node').register({ 24 | project: require('path').join(__dirname, './tsconfig.e2e.json') 25 | }); 26 | jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); 27 | } 28 | }; -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/timepicker/dynamic-ng-bootstrap-timepicker.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/src/lib/radio-group/dynamic-basic-radio-group.component.html: -------------------------------------------------------------------------------- 1 |
8 | 9 | 10 | 11 | 19 |
20 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/src/lib/switch/dynamic-foundation-switch.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 14 | 15 | 21 | 22 |
23 | -------------------------------------------------------------------------------- /schematics/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@ng-dynamic-forms/schematics", 3 | "version": "18.0.0", 4 | "description": "NG Dynamic Forms schematics", 5 | "scripts": { 6 | "build": "tsc -p tsconfig.json", 7 | "test": "npm run build && jasmine src/**/*_spec.js" 8 | }, 9 | "keywords": [ 10 | "Angular", 11 | "Dynamic Forms", 12 | "NG Dynamic Forms", 13 | "schematics" 14 | ], 15 | "author": { 16 | "name": "Udo Schöfer", 17 | "email": "ng2-dynamic-forms@udos86.de", 18 | "url": "https://github.com/udos86/ng-dynamic-forms" 19 | }, 20 | "license": "ISC", 21 | "schematics": "./collection.json", 22 | "dependencies": { 23 | "@angular-devkit/core": "^13.0.0", 24 | "@angular-devkit/schematics": "^13.0.0", 25 | "@types/jasmine": "^3.6.0", 26 | "@types/node": "^14.0.0", 27 | "jasmine-core": "^3.6.0", 28 | "typescript": "~4.6.3" 29 | } 30 | } -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/select/dynamic-ng-bootstrap-select.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/lib/select/dynamic-ngx-bootstrap-select.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/lib/radio-group/dynamic-ionic-radio-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 10 | 11 | {{ model.label }} 12 | 13 | 14 | 15 | {{ option.label }} 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/input-mask/dynamic-primeng-input-mask.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 17 | 18 |
19 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/src/lib/timepicker/dynamic-bootstrap-timepicker.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/src/lib/ui-material.ts: -------------------------------------------------------------------------------- 1 | export * from "./dynamic-material-form-input-control.component"; 2 | export * from "./checkbox/dynamic-material-checkbox.component"; 3 | export * from "./chips/dynamic-material-chips.component"; 4 | export * from "./datepicker/dynamic-material-datepicker.component"; 5 | export * from "./input/dynamic-material-input.component"; 6 | export * from "./radio-group/dynamic-material-radio-group.component"; 7 | export * from "./select/dynamic-material-select.component"; 8 | export * from "./slide-toggle/dynamic-material-slide-toggle.component"; 9 | export * from "./slider/dynamic-material-slider.component"; 10 | export * from "./textarea/dynamic-material-textarea.component"; 11 | 12 | export * from "./dynamic-material-form.component"; 13 | export * from "./dynamic-material-form-control-container.component"; 14 | export * from "./dynamic-material-form-input-control.component"; 15 | 16 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/src/lib/radio-group/dynamic-bootstrap-radio-group.component.html: -------------------------------------------------------------------------------- 1 |
8 | 9 | 10 | 11 |
12 | 13 | 19 |
20 | 21 |
22 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/lib/timepicker/dynamic-ngx-bootstrap-timepicker.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | You would like to add some code or fix an error? 2 | 3 | **That's great!** 4 | 5 | Please follow these instructions: 6 | 7 | **1.** **[Create a new issue](https://github.com/udos86/ng-dynamic-forms/issues/new)** and give a detailed bug report or feature proposal. 8 | 9 | **2.** [**Fork**](https://help.github.com/articles/fork-a-repo/) the NG Dynamic Forms repository. 10 | 11 | **3.** **Switch to branch** `udos86:development` **and checkout a new feature branch** based on it. 12 | 13 | **4.** Implement your code and verify it's functionality **by including some tests**. 14 | 15 | **5.** Create a [**pull request**](https://help.github.com/articles/creating-a-pull-request/) from your branch 16 | **into the original development branch** `udos86:development`. 17 | 18 | **6.** **Wait for the Travis build to succeed**. 19 | 20 | **7.** After a final code review your contribution will be merged or declined. 21 | 22 | **Thank You!** -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/dynamic-file-control.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicFormValueControlModelConfig, DynamicFormValueControlModel } from "./dynamic-form-value-control.model"; 2 | import { DynamicFormControlLayout } from "./misc/dynamic-form-control-layout.model"; 3 | import { serializable } from "../decorator/serializable.decorator"; 4 | import { isBoolean } from "../utils/core.utils"; 5 | 6 | export interface DynamicFileControlModelConfig extends DynamicFormValueControlModelConfig { 7 | multiple?: boolean; 8 | } 9 | 10 | export abstract class DynamicFileControlModel extends DynamicFormValueControlModel { 11 | @serializable() multiple: boolean; 12 | 13 | protected constructor(config: DynamicFileControlModelConfig, layout?: DynamicFormControlLayout) { 14 | super(config, layout); 15 | 16 | this.multiple = isBoolean(config.multiple) ? config.multiple : false; 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/src/lib/textarea/dynamic-basic-textarea.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/app/ui-material/material-sample-form.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
4 | 5 | 6 | 7 |
8 | 9 | 16 | 17 |
18 | 19 |
20 | 21 | 22 | 23 |
{{formGroup.value | json}}
24 | 25 |
26 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/src/lib/textarea/dynamic-bootstrap-textarea.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /src/app/lazy-loaded/lazy-loaded-form.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from "@angular/core"; 2 | import { DynamicFormService, DynamicFormControlModel } from "@ng-dynamic-forms/core"; 3 | import { LAZY_LOADED_FORM_MODEL } from "./lazy-loaded-form.model"; 4 | import { ReactiveFormsModule } from "@angular/forms"; 5 | import { DynamicBootstrapFormControlContainerComponent } from "@ng-dynamic-forms/ui-bootstrap"; 6 | import { NgFor } from "@angular/common"; 7 | 8 | @Component({ 9 | selector: "dynamic-lazy-loaded-form", 10 | templateUrl: "./lazy-loaded-form.component.html", 11 | standalone: true, 12 | imports: [NgFor, ReactiveFormsModule, DynamicBootstrapFormControlContainerComponent] 13 | }) 14 | export class LazyLoadedFormComponent { 15 | formModel: DynamicFormControlModel[] = LAZY_LOADED_FORM_MODEL; 16 | formGroup = this.formService.createFormGroup(this.formModel); 17 | 18 | constructor(private formService: DynamicFormService) { 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/src/lib/textarea/dynamic-foundation-textarea.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/src/lib/dynamic-material-form-control-container.component.html: -------------------------------------------------------------------------------- 1 |
3 | 4 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | {{ message }} 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/src/lib/checkbox/dynamic-bootstrap-checkbox.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 19 |
20 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/ui-ng-bootstrap.ts: -------------------------------------------------------------------------------- 1 | export * from "./calendar/dynamic-ng-bootstrap-calendar.component"; 2 | export * from "./checkbox/dynamic-ng-bootstrap-checkbox.component"; 3 | export * from "./checkbox-group/dynamic-ng-bootstrap-checkbox-group.component"; 4 | export * from "./datepicker/dynamic-ng-bootstrap-datepicker.component"; 5 | export * from "./input/dynamic-ng-bootstrap-input.component"; 6 | export * from "./radio-group/dynamic-ng-bootstrap-radio-group.component"; 7 | export * from "./rating/dynamic-ng-bootstrap-rating.component"; 8 | export * from "./select/dynamic-ng-bootstrap-select.component"; 9 | export * from "./switch/dynamic-ng-bootstrap-switch.component"; 10 | export * from "./textarea/dynamic-ng-bootstrap-textarea.component"; 11 | export * from "./timepicker/dynamic-ng-bootstrap-timepicker.component"; 12 | 13 | export * from "./dynamic-ng-bootstrap-form.component"; 14 | export * from "./dynamic-ng-bootstrap-form-control-container.component"; 15 | 16 | -------------------------------------------------------------------------------- /src/app/lazy-loaded/lazy-loaded-form.routes.ts: -------------------------------------------------------------------------------- 1 | import { Route } from "@angular/router"; 2 | import { LazyLoadedFormComponent } from "./lazy-loaded-form.component"; 3 | import { NG_VALIDATORS } from "@angular/forms"; 4 | import { customLazyLoadedValidator } from "./lazy-loaded-form.validators"; 5 | import { DYNAMIC_VALIDATORS, Validator, ValidatorFactory } from "@ng-dynamic-forms/core"; 6 | 7 | export const lazyFormRoutes: Route[] = [ 8 | { 9 | path: "", 10 | providers: [ 11 | { 12 | provide: NG_VALIDATORS, 13 | useValue: customLazyLoadedValidator, 14 | multi: true 15 | }, 16 | { 17 | provide: DYNAMIC_VALIDATORS, 18 | useValue: new Map([ 19 | ["customLazyLoadedValidator", customLazyLoadedValidator] 20 | ]) 21 | } 22 | 23 | ], 24 | component: LazyLoadedFormComponent 25 | } 26 | ]; 27 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/textarea/dynamic-ng-bootstrap-textarea.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/lib/textarea/dynamic-ngx-bootstrap-textarea.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/rating/dynamic-rating.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicFormValueControlModelConfig, DynamicFormValueControlModel } from "../dynamic-form-value-control.model"; 2 | import { DynamicFormControlLayout } from "../misc/dynamic-form-control-layout.model"; 3 | import { serializable } from "../../decorator/serializable.decorator"; 4 | import { isNumber } from "../../utils/core.utils"; 5 | 6 | export const DYNAMIC_FORM_CONTROL_TYPE_RATING = "RATING"; 7 | 8 | export interface DynamicRatingModelConfig extends DynamicFormValueControlModelConfig { 9 | max?: number; 10 | } 11 | 12 | export class DynamicRatingModel extends DynamicFormValueControlModel { 13 | @serializable() max: number | null; 14 | @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_RATING; 15 | 16 | constructor(config: DynamicRatingModelConfig, layout?: DynamicFormControlLayout) { 17 | super(config, layout); 18 | 19 | this.max = isNumber(config.max) ? config.max : 10; 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/src/lib/slider/dynamic-material-slider.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 11 | 17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/dynamic-primeng-form-control-container.component.html: -------------------------------------------------------------------------------- 1 |
3 | 4 |
5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 |
    15 |
  • {{ message }}
  • 16 |
17 | 18 | 19 | 20 | 21 | 22 |
23 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/textarea/dynamic-primeng-textarea.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 22 | 23 |
24 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/checkbox/dynamic-checkbox.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicCheckControlModel, DynamicCheckControlModelConfig } from "../dynamic-check-control.model"; 2 | import { DynamicFormControlLayout } from "../misc/dynamic-form-control-layout.model"; 3 | import { serializable } from "../../decorator/serializable.decorator"; 4 | import { isBoolean } from "../../utils/core.utils"; 5 | 6 | export const DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX = "CHECKBOX"; 7 | 8 | export interface DynamicCheckboxModelConfig extends DynamicCheckControlModelConfig { 9 | indeterminate?: boolean; 10 | } 11 | 12 | export class DynamicCheckboxModel extends DynamicCheckControlModel { 13 | @serializable() indeterminate: boolean; 14 | 15 | @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX; 16 | 17 | constructor(config: DynamicCheckboxModelConfig, layout?: DynamicFormControlLayout) { 18 | super(config, layout); 19 | 20 | this.indeterminate = isBoolean(config.indeterminate) ? config.indeterminate : false; 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/switch/dynamic-switch.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicCheckControlModel, DynamicCheckControlModelConfig } from "../dynamic-check-control.model"; 2 | import { DynamicFormControlLayout } from "../misc/dynamic-form-control-layout.model"; 3 | import { serializable } from "../../decorator/serializable.decorator"; 4 | 5 | export const DYNAMIC_FORM_CONTROL_TYPE_SWITCH = "SWITCH"; 6 | 7 | export interface DynamicSwitchModelConfig extends DynamicCheckControlModelConfig { 8 | offLabel?: string; 9 | onLabel?: string; 10 | } 11 | 12 | export class DynamicSwitchModel extends DynamicCheckControlModel { 13 | @serializable() offLabel: string | null; 14 | @serializable() onLabel: string | null; 15 | 16 | @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_SWITCH; 17 | 18 | constructor(config: DynamicSwitchModelConfig, layout?: DynamicFormControlLayout) { 19 | super(config, layout); 20 | 21 | this.offLabel = config.offLabel ?? null; 22 | this.onLabel = config.onLabel ?? null; 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/src/lib/radio-group/dynamic-material-radio-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 13 | 14 | 18 | 19 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/radio-group/dynamic-ng-bootstrap-radio-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
9 | 10 | 11 | 12 | 22 | 23 |
24 | 25 |
26 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/spinner/dynamic-primeng-spinner.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 19 | 20 |
21 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/checkbox/dynamic-ng-bootstrap-checkbox.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 21 | 22 |
23 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/lib/checkbox/dynamic-ngx-bootstrap-checkbox.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 21 | 22 |
23 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/component/dynamic-form-control-interface.ts: -------------------------------------------------------------------------------- 1 | import { EventEmitter, QueryList } from "@angular/core"; 2 | import { UntypedFormGroup } from "@angular/forms"; 3 | import { DynamicFormControlCustomEvent } from "./dynamic-form-control-event"; 4 | import { DynamicFormLayout } from "../service/dynamic-form-layout.service"; 5 | import { DynamicFormControlModel } from "../model/dynamic-form-control.model"; 6 | import { DynamicFormControlLayout } from "../model/misc/dynamic-form-control-layout.model"; 7 | import { DynamicTemplateDirective } from "../directive/dynamic-template.directive"; 8 | 9 | export interface DynamicFormControl { 10 | formLayout?: DynamicFormLayout; 11 | group: UntypedFormGroup; 12 | layout?: DynamicFormControlLayout; 13 | model: DynamicFormControlModel; 14 | templates?: QueryList | DynamicTemplateDirective[]; 15 | 16 | blur: EventEmitter; 17 | change: EventEmitter; 18 | customEvent?: EventEmitter | undefined; 19 | focus: EventEmitter; 20 | } 21 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/radio/dynamic-radio-group.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicOptionControlModel, DynamicOptionControlModelConfig } from "../dynamic-option-control.model"; 2 | import { DynamicFormControlLayout } from "../misc/dynamic-form-control-layout.model"; 3 | import { serializable } from "../../decorator/serializable.decorator"; 4 | 5 | export const DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP = "RADIO_GROUP"; 6 | 7 | export interface DynamicRadioGroupModelConfig extends DynamicOptionControlModelConfig { 8 | legend?: string; 9 | } 10 | 11 | export class DynamicRadioGroupModel extends DynamicOptionControlModel { 12 | @serializable() legend: string | null; 13 | 14 | @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP; 15 | 16 | constructor(config: DynamicRadioGroupModelConfig, layout?: DynamicFormControlLayout) { 17 | super(config, layout); 18 | 19 | this.legend = config.legend ?? null; 20 | } 21 | 22 | select(index: number): void { 23 | this.value = this.get(index).value; 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /.github/workflows/build.yml: -------------------------------------------------------------------------------- 1 | name: NG Dynamic Forms CI 2 | 3 | on: 4 | push: 5 | branches: [ master, development ] 6 | pull_request: 7 | branches: [ master, development ] 8 | 9 | jobs: 10 | build: 11 | 12 | runs-on: ubuntu-latest 13 | 14 | steps: 15 | - uses: actions/checkout@v2 16 | - uses: actions/setup-node@v1 17 | with: 18 | node-version: '16.x' 19 | - run: npm i --force 20 | - run: npm run build:core && npm run test:core 21 | - run: npm run build:ui-basic && npm run test:ui-basic 22 | - run: npm run build:ui-bootstrap && npm run test:ui-bootstrap 23 | - run: npm run build:ui-foundation && npm run test:ui-foundation 24 | - run: npm run build:ui-ionic && npm run test:ui-ionic 25 | - run: npm run build:ui-material && npm run test:ui-material 26 | - run: npm run build:ui-ng-bootstrap && npm run test:ui-ng-bootstrap 27 | - run: npm run build:ui-ngx-bootstrap && npm run test:ui-ngx-bootstrap 28 | - run: npm run build:ui-primeng && npm run test:ui-primeng 29 | - run: npm run build:sample 30 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/lib/range/dynamic-ionic-range.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 6 | 7 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/src/lib/slide-toggle/dynamic-material-slide-toggle.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/component/dynamic-form-control-event.ts: -------------------------------------------------------------------------------- 1 | import { UntypedFormControl, UntypedFormGroup } from "@angular/forms"; 2 | import { DynamicFormControlModel } from "../model/dynamic-form-control.model"; 3 | import { DynamicFormArrayGroupModel } from "../model/form-array/dynamic-form-array.model"; 4 | import { isObject } from "../utils/core.utils"; 5 | 6 | export enum DynamicFormControlEventType { 7 | Blur = "blur", 8 | Change = "change", 9 | Focus = "focus" 10 | } 11 | 12 | export interface DynamicFormControlEvent { 13 | $event: Event | FocusEvent | DynamicFormControlEvent | any; 14 | context: DynamicFormArrayGroupModel | null; 15 | control: UntypedFormControl; 16 | group: UntypedFormGroup; 17 | model: DynamicFormControlModel; 18 | type: string; 19 | } 20 | 21 | export interface DynamicFormControlCustomEvent { 22 | customEvent: any; 23 | customEventType: string; 24 | } 25 | 26 | export function isDynamicFormControlEvent($event: any): $event is DynamicFormControlEvent { 27 | return isObject($event) && $event.hasOwnProperty("$event"); 28 | } 29 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/calendar/dynamic-ng-bootstrap-calendar.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/src/lib/dynamic-basic-form-control-container.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 |
15 | 16 |
    17 |
  • {{ message }}
  • 18 |
19 | 20 | 21 | 22 | 23 | 24 |
25 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/src/lib/checkbox/dynamic-material-checkbox.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/src/lib/dynamic-material-form-input-control.component.ts: -------------------------------------------------------------------------------- 1 | import { MatInput } from "@angular/material/input"; 2 | import { 3 | DynamicFormControlComponent, 4 | DynamicFormLayoutService, 5 | DynamicFormValidationService, 6 | DynamicInputControlModel, 7 | DynamicInputModel 8 | } from "@ng-dynamic-forms/core"; 9 | 10 | export abstract class DynamicMaterialFormInputControlComponent extends DynamicFormControlComponent { 11 | matInput!: MatInput; 12 | 13 | protected constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) { 14 | super(layoutService, validationService); 15 | } 16 | 17 | get characterCount(): number | null { 18 | return this.matInput ? this.matInput.value.length : null; 19 | } 20 | 21 | get characterHint(): string { 22 | return `${this.characterCount} / ${(this.model as DynamicInputControlModel).maxLength}`; 23 | } 24 | 25 | get showCharacterHint(): boolean { 26 | return !!((this.model as DynamicInputModel).maxLength && this.characterCount); 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage-istanbul-reporter'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageIstanbulReporter: { 19 | dir: require('path').join(__dirname, '../coverage/ng-dynamic-forms'), 20 | reports: ['html', 'lcovonly', 'text-summary'], 21 | fixWebpackSourcePaths: true 22 | }, 23 | reporters: ['progress', 'kjhtml'], 24 | port: 9876, 25 | colors: true, 26 | logLevel: config.LOG_INFO, 27 | autoWatch: true, 28 | browsers: ['Chrome'], 29 | singleRun: false, 30 | restartOnFileChange: true 31 | }); 32 | }; 33 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/service/dynamic-form-validation-matchers.ts: -------------------------------------------------------------------------------- 1 | import { InjectionToken } from "@angular/core"; 2 | import { AbstractControl } from "@angular/forms"; 3 | import { DynamicFormControlModel } from "../model/dynamic-form-control.model"; 4 | import { DynamicFormHook } from "../model/misc/dynamic-form-control-validation.model"; 5 | 6 | export type DynamicErrorMessagesMatcher = (control: AbstractControl, model: DynamicFormControlModel, hasFocus: boolean) => boolean; 7 | 8 | export const DEFAULT_ERROR_STATE_MATCHER: DynamicErrorMessagesMatcher = 9 | (control: AbstractControl, model: DynamicFormControlModel, hasFocus: boolean) => { 10 | return control.touched && !hasFocus; 11 | }; 12 | 13 | export const CHANGE_ERROR_STATE_MATCHER: DynamicErrorMessagesMatcher = 14 | (control: AbstractControl, model: DynamicFormControlModel, hasFocus: boolean) => { 15 | return (model.updateOn === DynamicFormHook.Change || model.updateOn === null) ? control.dirty : control.touched && !hasFocus; 16 | }; 17 | 18 | export const DYNAMIC_ERROR_MESSAGES_MATCHER = new InjectionToken("DYNAMIC_ERROR_MESSAGES_MATCHER"); 19 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/dynamic-primeng-form-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
7 | 8 | 19 |
20 | 21 |
22 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/src/lib/dynamic-material-form-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
7 | 8 | 19 |
20 | 21 |
22 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/dropdown/dynamic-primeng-dropdown.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 20 | 21 |
22 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/timepicker/dynamic-timepicker.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicDateControlModel, DynamicDateControlModelConfig } from "../dynamic-date-control.model"; 2 | import { DynamicFormControlLayout } from "../misc/dynamic-form-control-layout.model"; 3 | import { serializable } from "../../decorator/serializable.decorator"; 4 | import { isBoolean } from "../../utils/core.utils"; 5 | 6 | export const DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER = "TIMEPICKER"; 7 | 8 | export interface DynamicTimePickerModelConfig extends DynamicDateControlModelConfig { 9 | meridian?: boolean; 10 | showSeconds?: boolean; 11 | } 12 | 13 | export class DynamicTimePickerModel extends DynamicDateControlModel { 14 | @serializable() meridian: boolean; 15 | @serializable() showSeconds: boolean; 16 | 17 | @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER; 18 | 19 | constructor(config: DynamicTimePickerModelConfig, layout?: DynamicFormControlLayout) { 20 | super(config, layout); 21 | 22 | this.meridian = isBoolean(config.meridian) ? config.meridian : false; 23 | this.showSeconds = isBoolean(config.showSeconds) ? config.showSeconds : false; 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/src/lib/dynamic-foundation-form-control-container.component.html: -------------------------------------------------------------------------------- 1 |
3 | 4 |
5 | 6 | 10 |
11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 |
19 | 20 |
    21 |
  • {{ message }}
  • 22 |
23 | 24 | 25 | 26 | 27 | 28 |
29 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/src/lib/dynamic-basic-form-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
7 | 8 | 9 | 10 | 21 |
22 | 23 |
24 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/lib/dynamic-ionic-form-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
7 | 8 | 9 | 10 | 21 |
22 | 23 |
24 | -------------------------------------------------------------------------------- /src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |

4 | 5 | NG Dynamic Forms Sample 6 | 7 |

8 | 9 | 20 | 21 |
22 | 23 |
24 | 25 |

26 | 27 | {{routeData.title}} 28 | 29 | 30 | Logo GitHub 33 | 34 | 35 |

36 | 37 | 38 | 39 |
40 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageReporter: { 19 | dir: require('path').join(__dirname, '../../../coverage/ng-dynamic-forms/core'), 20 | subdir: '.', 21 | reporters: [ 22 | {type: 'html'}, 23 | {type: 'json'}, 24 | {type: 'lcovonly'} 25 | ] 26 | }, 27 | reporters: ['progress', 'kjhtml'], 28 | port: 9876, 29 | colors: true, 30 | logLevel: config.LOG_INFO, 31 | autoWatch: false, 32 | browsers: ['ChromeHeadless'], 33 | singleRun: true, 34 | restartOnFileChange: false 35 | }); 36 | }; 37 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/dynamic-ng-bootstrap-form-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
4 | 5 | 17 |
18 | 19 |
20 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageReporter: { 19 | dir: require('path').join(__dirname, '../../../coverage/ng-dynamic-forms/ui-basic'), 20 | subdir: '.', 21 | reporters: [ 22 | {type: 'html'}, 23 | {type: 'json'}, 24 | {type: 'lcovonly'} 25 | ] 26 | }, 27 | reporters: ['progress', 'kjhtml'], 28 | port: 9876, 29 | colors: true, 30 | logLevel: config.LOG_INFO, 31 | autoWatch: false, 32 | browsers: ['ChromeHeadless'], 33 | singleRun: true, 34 | restartOnFileChange: false 35 | }); 36 | }; 37 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageReporter: { 19 | dir: require('path').join(__dirname, '../../../coverage/ng-dynamic-forms/ui-ionic'), 20 | subdir: '.', 21 | reporters: [ 22 | {type: 'html'}, 23 | {type: 'json'}, 24 | {type: 'lcovonly'} 25 | ] 26 | }, 27 | reporters: ['progress', 'kjhtml'], 28 | port: 9876, 29 | colors: true, 30 | logLevel: config.LOG_INFO, 31 | autoWatch: false, 32 | browsers: ['ChromeHeadless'], 33 | singleRun: true, 34 | restartOnFileChange: false 35 | }); 36 | }; 37 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageReporter: { 19 | dir: require('path').join(__dirname, '../../../coverage/ng-dynamic-forms/ui-bootstrap'), 20 | subdir: '.', 21 | reporters: [ 22 | {type: 'html'}, 23 | {type: 'json'}, 24 | {type: 'lcovonly'} 25 | ] 26 | }, 27 | reporters: ['progress', 'kjhtml'], 28 | port: 9876, 29 | colors: true, 30 | logLevel: config.LOG_INFO, 31 | autoWatch: false, 32 | browsers: ['ChromeHeadless'], 33 | singleRun: true, 34 | restartOnFileChange: false 35 | }); 36 | }; 37 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageReporter: { 19 | dir: require('path').join(__dirname, '../../../coverage/ng-dynamic-forms/ui-material'), 20 | subdir: '.', 21 | reporters: [ 22 | {type: 'html'}, 23 | {type: 'json'}, 24 | {type: 'lcovonly'} 25 | ] 26 | }, 27 | reporters: ['progress', 'kjhtml'], 28 | port: 9876, 29 | colors: true, 30 | logLevel: config.LOG_INFO, 31 | autoWatch: false, 32 | browsers: ['ChromeHeadless'], 33 | singleRun: true, 34 | restartOnFileChange: false 35 | }); 36 | }; 37 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/lib/dynamic-ngx-bootstrap-form-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
4 | 5 | 17 |
18 | 19 |
20 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageReporter: { 19 | dir: require('path').join(__dirname, '../../../coverage/ng-dynamic-forms/ui-primeng'), 20 | subdir: '.', 21 | reporters: [ 22 | {type: 'html'}, 23 | {type: 'json'}, 24 | {type: 'lcovonly'} 25 | ] 26 | }, 27 | reporters: ['progress', 'kjhtml'], 28 | port: 9876, 29 | colors: true, 30 | logLevel: config.LOG_INFO, 31 | autoWatch: false, 32 | browsers: ['ChromeHeadless'], 33 | singleRun: true, 34 | restartOnFileChange: false 35 | }); 36 | }; 37 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageReporter: { 19 | dir: require('path').join(__dirname, '../../../coverage/ng-dynamic-forms/ui-foundation'), 20 | subdir: '.', 21 | reporters: [ 22 | {type: 'html'}, 23 | {type: 'json'}, 24 | {type: 'lcovonly'} 25 | ] 26 | }, 27 | reporters: ['progress', 'kjhtml'], 28 | port: 9876, 29 | colors: true, 30 | logLevel: config.LOG_INFO, 31 | autoWatch: false, 32 | browsers: ['ChromeHeadless'], 33 | singleRun: true, 34 | restartOnFileChange: false 35 | }); 36 | }; 37 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/lib/select/dynamic-ionic-select.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 6 | 7 | 20 | 21 | {{ option.label }} 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/colorpicker/dynamic-colorpicker.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicFormValueControlModelConfig, DynamicFormValueControlModel } from "../dynamic-form-value-control.model"; 2 | import { DynamicFormControlLayout } from "../misc/dynamic-form-control-layout.model"; 3 | import { serializable } from "../../decorator/serializable.decorator"; 4 | import { isBoolean, isString } from "../../utils/core.utils"; 5 | 6 | export const DYNAMIC_FORM_CONTROL_TYPE_COLORPICKER = "COLORPICKER"; 7 | 8 | export interface DynamicColorPickerModelConfig extends DynamicFormValueControlModelConfig { 9 | format?: string; 10 | inline?: boolean; 11 | } 12 | 13 | export class DynamicColorPickerModel extends DynamicFormValueControlModel { 14 | @serializable() format: string | null; 15 | @serializable() inline: boolean; 16 | 17 | @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_COLORPICKER; 18 | 19 | constructor(config: DynamicColorPickerModelConfig, layout?: DynamicFormControlLayout) { 20 | super(config, layout); 21 | 22 | this.format = isString(config.format) ? config.format : null; 23 | this.inline = isBoolean(config.inline) ? config.inline : false; 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageReporter: { 19 | dir: require('path').join(__dirname, '../../../coverage/ng-dynamic-forms/ui-ng-bootstrap'), 20 | subdir: '.', 21 | reporters: [ 22 | {type: 'html'}, 23 | {type: 'json'}, 24 | {type: 'lcovonly'} 25 | ] 26 | }, 27 | reporters: ['progress', 'kjhtml'], 28 | port: 9876, 29 | colors: true, 30 | logLevel: config.LOG_INFO, 31 | autoWatch: false, 32 | browsers: ['ChromeHeadless'], 33 | singleRun: true, 34 | restartOnFileChange: false 35 | }); 36 | }; 37 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageReporter: { 19 | dir: require('path').join(__dirname, '../../../coverage/ng-dynamic-forms/ui-ngx-bootstrap'), 20 | subdir: '.', 21 | reporters: [ 22 | {type: 'html'}, 23 | {type: 'json'}, 24 | {type: 'lcovonly'} 25 | ] 26 | }, 27 | reporters: ['progress', 'kjhtml'], 28 | port: 9876, 29 | colors: true, 30 | logLevel: config.LOG_INFO, 31 | autoWatch: false, 32 | browsers: ['ChromeHeadless'], 33 | singleRun: true, 34 | restartOnFileChange: false 35 | }); 36 | }; 37 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/decorator/serializable.decorator.ts: -------------------------------------------------------------------------------- 1 | import "reflect-metadata"; 2 | 3 | declare let Reflect: any; 4 | 5 | export const METADATA_KEY_SERIALIZABLE = "SERIALIZABLE"; 6 | 7 | export interface SerializableProperty { 8 | key: string; 9 | name: string; 10 | } 11 | 12 | export function serializable(name?: string): (target: any, key: string) => void { 13 | return (target, key) => { 14 | Reflect.defineMetadata(METADATA_KEY_SERIALIZABLE, {key, name: name || key}, target, key); 15 | }; 16 | } 17 | 18 | export function getSerializables(target: any): SerializableProperty[] { 19 | const serializables = []; 20 | 21 | // tslint:disable-next-line:forin 22 | for (const key in target) { 23 | const metadata = Reflect.getMetadata(METADATA_KEY_SERIALIZABLE, target, key); 24 | 25 | if (metadata) { 26 | serializables.push(metadata); 27 | } 28 | } 29 | 30 | return serializables; 31 | } 32 | 33 | export function serialize(target: any, prototype?: any): object { 34 | return getSerializables(prototype || target).reduce((prev: any, prop: SerializableProperty) => { 35 | 36 | prev[prop.name] = target[prop.key]; 37 | 38 | return prev; 39 | 40 | }, {}); 41 | } 42 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/dynamic-check-control.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicFormValueControlModel, DynamicFormValueControlModelConfig } from "./dynamic-form-value-control.model"; 2 | import { DynamicFormControlLayout } from "./misc/dynamic-form-control-layout.model"; 3 | import { serializable } from "../decorator/serializable.decorator"; 4 | import { isBoolean } from "../utils/core.utils"; 5 | 6 | export interface DynamicCheckControlModelConfig extends DynamicFormValueControlModelConfig { 7 | labelPosition?: string; 8 | } 9 | 10 | export abstract class DynamicCheckControlModel extends DynamicFormValueControlModel { 11 | @serializable() labelPosition: string | null; 12 | 13 | protected constructor(config: DynamicCheckControlModelConfig, layout?: DynamicFormControlLayout) { 14 | super(config, layout); 15 | 16 | this.labelPosition = config.labelPosition ?? null; 17 | this.checked = isBoolean(this.value) ? this.value : false; 18 | } 19 | 20 | get checked(): boolean { 21 | return this.value ?? false; 22 | } 23 | 24 | set checked(checked: boolean) { 25 | this.value = checked; 26 | } 27 | 28 | toggle(): void { 29 | this.checked = !this.checked; 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/assets/calendar-icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 6 | 7 | 14 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/rating/dynamic-rating.model.spec.ts: -------------------------------------------------------------------------------- 1 | import { DYNAMIC_FORM_CONTROL_TYPE_RATING, DynamicRatingModel } from "./dynamic-rating.model"; 2 | 3 | describe("DynamicRatingModel test suite", () => { 4 | let model: DynamicRatingModel; 5 | const config = { 6 | id: "rating", 7 | max: 5, 8 | value: 2 9 | }; 10 | 11 | beforeEach(() => model = new DynamicRatingModel(config)); 12 | 13 | it("should initialize correctly", () => { 14 | expect(model.disabled).toBe(false); 15 | expect(model.hidden).toBe(false); 16 | expect(model.id).toEqual(config.id); 17 | expect(model.label).toBeNull(); 18 | expect(model.max).toBe(config.max); 19 | expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_RATING); 20 | expect(model.value).toBe(config.value); 21 | expect(model.disabledChanges).toBeDefined(); 22 | expect(model.valueChanges).toBeDefined(); 23 | }); 24 | 25 | it("should serialize correctly", () => { 26 | const json = JSON.parse(JSON.stringify(model)); 27 | 28 | expect(json.id).toEqual(model.id); 29 | expect(json.value).toBe(model.value); 30 | expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_RATING); 31 | }); 32 | }); 33 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-foundation/src/lib/dynamic-foundation-form-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
7 | 8 | 9 | 10 | 21 |
22 | 23 |
24 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/utils/json.utils.ts: -------------------------------------------------------------------------------- 1 | import { isString } from "./core.utils"; 2 | 3 | export function maskToString(mask: string | RegExp | (string | RegExp)[]): string | string[] | null { 4 | if (isString(mask)) { 5 | return mask as string; 6 | 7 | } else if (mask instanceof RegExp) { 8 | return mask.toString(); 9 | 10 | } else if (Array.isArray(mask)) { 11 | return mask.map(value => maskToString(value)) as string[]; 12 | } 13 | 14 | return null; 15 | } 16 | 17 | export function maskFromString(mask: string | string[]): string | RegExp | (string | RegExp)[] | null { 18 | if (isString(mask)) { 19 | const isRegExp = (mask as string).startsWith("/") && (mask as string).endsWith("/"); 20 | return isRegExp ? new RegExp((mask as string).slice(1, mask.length - 1)) : mask; 21 | 22 | } else if (Array.isArray(mask)) { 23 | return (mask as string[]).map(value => maskFromString(value)) as string[]; 24 | } 25 | 26 | return null; 27 | } 28 | 29 | export function parseReviver(_key: string, value: any): any { 30 | const regexDateISO = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2}):(\d{2}(?:\.\d*))(?:Z|([+\-])([\d|:]*))?$/; 31 | return isString(value) && regexDateISO.test(value) ? new Date(value) : value; 32 | } 33 | -------------------------------------------------------------------------------- /src/app/ui-ngx-bootstrap/ngx-bootstrap-sample-form.layout.ts: -------------------------------------------------------------------------------- 1 | import { DYNAMIC_FORM_CONTROL_TYPE_ARRAY, DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX } from "@ng-dynamic-forms/core"; 2 | 3 | export const NGX_BOOTSTRAP_SAMPLE_FORM_LAYOUT = { 4 | "bsSelect, bsDatePicker, bsCheckboxGroup, bsRadioGroup, bsInput, bsInput2, bsTextArea, bsTimePicker": { 5 | element: { 6 | container: "form-group", 7 | label: "control-label", 8 | option: "btn-primary" 9 | }, 10 | 11 | grid: { 12 | control: "col-sm-9", 13 | label: "col-sm-3", 14 | errors: "col-sm-offset-3 col-sm-9" 15 | } 16 | }, 17 | 18 | bsCheckbox: { 19 | element: { 20 | container: "form-group" 21 | }, 22 | grid: { 23 | control: "col-sm-offset-3 col-sm-9" 24 | } 25 | }, 26 | 27 | [DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX]: { 28 | element: { 29 | control: "btn-primary" 30 | } 31 | }, 32 | 33 | [DYNAMIC_FORM_CONTROL_TYPE_ARRAY]: { 34 | element: { 35 | container: "form-group form-array", 36 | group: "d-flex" 37 | }, 38 | grid: { 39 | children: "col-sm-8", 40 | label: "col-sm-3" 41 | } 42 | } 43 | }; 44 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/switch/dynamic-switch.model.spec.ts: -------------------------------------------------------------------------------- 1 | import { DYNAMIC_FORM_CONTROL_TYPE_SWITCH, DynamicSwitchModel } from "./dynamic-switch.model"; 2 | 3 | describe("DynamicSwitchModel test suite", () => { 4 | let model: DynamicSwitchModel; 5 | const config = { 6 | id: "switch" 7 | }; 8 | 9 | beforeEach(() => model = new DynamicSwitchModel(config)); 10 | 11 | it("should initialize correctly", () => { 12 | expect(model.disabled).toBe(false); 13 | expect(model.hidden).toBe(false); 14 | expect(model.id).toEqual(config.id); 15 | expect(model.label).toBeNull(); 16 | expect(model.labelPosition).toBeNull(); 17 | expect(model.offLabel).toBeNull(); 18 | expect(model.onLabel).toBeNull(); 19 | expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_SWITCH); 20 | expect(model.value).toBe(false); 21 | expect(model.disabledChanges).toBeDefined(); 22 | expect(model.valueChanges).toBeDefined(); 23 | }); 24 | 25 | it("should serialize correctly", () => { 26 | const json = JSON.parse(JSON.stringify(model)); 27 | 28 | expect(json.id).toEqual(model.id); 29 | expect(json.value).toBe(model.value); 30 | expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_SWITCH); 31 | }); 32 | }); 33 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-basic/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@ng-dynamic-forms/ui-basic", 3 | "version": "18.0.0", 4 | "description": "Basic UI package for NG Dynamic Forms", 5 | "keywords": [ 6 | "angular", 7 | "dynamic forms", 8 | "forms", 9 | "ng dynamic forms", 10 | "reactive forms", 11 | "ui" 12 | ], 13 | "homepage": "https://github.com/udos86/ng-dynamic-forms#readme", 14 | "bugs": { 15 | "url": "https://github.com/udos86/ng-dynamic-forms/issues" 16 | }, 17 | "license": "ISC", 18 | "author": { 19 | "name": "Udo Schöfer", 20 | "email": "ng2-dynamic-forms@udos86.de", 21 | "url": "https://github.com/udos86/ng-dynamic-forms" 22 | }, 23 | "main": "./bundles/ui-basic.umd.js", 24 | "module": "./fesm5/ui-basic.js", 25 | "typings": "./ui-basic.d.ts", 26 | "repository": { 27 | "type": "git", 28 | "url": "git+https://github.com/udos86/ng-dynamic-forms.git" 29 | }, 30 | "peerDependencies": { 31 | "@ng-dynamic-forms/core": "^18.0.0", 32 | "ngx-mask": "^16.0.0" 33 | }, 34 | "es2015": "./fesm2015/ui-basic.js", 35 | "esm2015": "./esm2015/ui-basic.js", 36 | "esm5": "./esm5/ui-basic.js", 37 | "fesm2015": "./fesm2015/ui-basic.js", 38 | "fesm5": "./fesm5/ui-basic.js", 39 | "sideEffects": false, 40 | "dependencies": { 41 | "tslib": "^2.0.0" 42 | } 43 | } -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-bootstrap/src/lib/dynamic-bootstrap-form-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
7 | 8 | 9 | 10 | 22 |
23 | 24 |
25 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@ng-dynamic-forms/ui-ionic", 3 | "version": "18.0.0", 4 | "description": "Ionic UI package for NG Dynamic Forms", 5 | "keywords": [ 6 | "angular", 7 | "dynamic forms", 8 | "forms", 9 | "ionic", 10 | "ng dynamic forms", 11 | "reactive forms", 12 | "ui" 13 | ], 14 | "homepage": "https://github.com/udos86/ng-dynamic-forms#readme", 15 | "bugs": { 16 | "url": "https://github.com/udos86/ng-dynamic-forms/issues" 17 | }, 18 | "license": "ISC", 19 | "author": { 20 | "name": "Udo Schöfer", 21 | "email": "ng2-dynamic-forms@udos86.de", 22 | "url": "https://github.com/udos86/ng-dynamic-forms" 23 | }, 24 | "main": "./bundles/ui-ionic.umd.js", 25 | "module": "./fesm5/ui-ionic.js", 26 | "typings": "./ui-ionic.d.ts", 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/udos86/ng-dynamic-forms.git" 30 | }, 31 | "peerDependencies": { 32 | "@ionic/angular": "^7.0.0", 33 | "@ng-dynamic-forms/core": "^18.0.0" 34 | }, 35 | "es2015": "./fesm2015/ui-ionic.js", 36 | "esm2015": "./esm2015/ui-ionic.js", 37 | "esm5": "./esm5/ui-ionic.js", 38 | "fesm2015": "./fesm2015/ui-ionic.js", 39 | "fesm5": "./fesm5/ui-ionic.js", 40 | "sideEffects": false, 41 | "dependencies": { 42 | "tslib": "^2.0.0" 43 | } 44 | } -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/checkbox/dynamic-checkbox-group.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicFormGroupModel, DynamicFormGroupModelConfig } from "../form-group/dynamic-form-group.model"; 2 | import { DynamicCheckboxModel } from "./dynamic-checkbox.model"; 3 | import { DynamicFormControlLayout } from "../misc/dynamic-form-control-layout.model"; 4 | import { serializable } from "../../decorator/serializable.decorator"; 5 | 6 | export const DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP = "CHECKBOX_GROUP"; 7 | 8 | export class DynamicCheckboxGroupModel extends DynamicFormGroupModel { 9 | @serializable() group!: DynamicCheckboxModel[]; 10 | 11 | @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP; 12 | 13 | constructor(config: DynamicFormGroupModelConfig, layout?: DynamicFormControlLayout) { 14 | super(config, layout); 15 | } 16 | 17 | check(...indices: number[]): void { 18 | indices.forEach(index => this.group[index].checked = true); 19 | } 20 | 21 | uncheck(...indices: number[]): void { 22 | indices.forEach(index => this.group[index].checked = false); 23 | } 24 | 25 | checkAll(): void { 26 | this.group.forEach(model => model.checked = true); 27 | } 28 | 29 | uncheckAll(): void { 30 | this.group.forEach(model => model.checked = false); 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/colorpicker/dynamic-colorpicker.model.spec.ts: -------------------------------------------------------------------------------- 1 | import { DYNAMIC_FORM_CONTROL_TYPE_COLORPICKER, DynamicColorPickerModel } from "./dynamic-colorpicker.model"; 2 | 3 | describe("DynamicColorPickerModel test suite", () => { 4 | let model: DynamicColorPickerModel; 5 | const config = { 6 | id: "colorpicker", 7 | value: "#ffffff" 8 | }; 9 | 10 | beforeEach(() => model = new DynamicColorPickerModel(config)); 11 | 12 | it("should initialize correctly", () => { 13 | expect(model.disabled).toBe(false); 14 | expect(model.format).toBeNull(); 15 | expect(model.hidden).toBe(false); 16 | expect(model.id).toEqual(config.id); 17 | expect(model.inline).toBe(false); 18 | expect(model.label).toBeNull(); 19 | expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_COLORPICKER); 20 | expect(model.value).toBe(config.value); 21 | expect(model.disabledChanges).toBeDefined(); 22 | expect(model.valueChanges).toBeDefined(); 23 | }); 24 | 25 | it("should serialize correctly", () => { 26 | const json = JSON.parse(JSON.stringify(model)); 27 | 28 | expect(json.id).toEqual(model.id); 29 | expect(json.value).toBe(model.value); 30 | expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_COLORPICKER); 31 | }); 32 | }); 33 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
7 | 8 | 24 |
25 | 26 |
27 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/directive/dynamic-template.directive.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed, ComponentFixture } from "@angular/core/testing"; 2 | import { Component, TemplateRef } from "@angular/core"; 3 | import { DynamicTemplateDirective, DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT } from "./dynamic-template.directive"; 4 | 5 | @Component({ 6 | template: ` 7 | 8 | 9 | `, 10 | standalone: true 11 | }) 12 | class TestComponent { 13 | } 14 | 15 | describe("DynamicTemplateDirective test suite", () => { 16 | let directive: DynamicTemplateDirective; 17 | let fixture: ComponentFixture; 18 | 19 | beforeEach(() => { 20 | directive = new DynamicTemplateDirective({} as TemplateRef); 21 | 22 | fixture = TestBed.configureTestingModule({ 23 | imports: [DynamicTemplateDirective, TestComponent] 24 | }).createComponent(TestComponent); 25 | 26 | fixture.detectChanges(); 27 | }); 28 | 29 | it("should be initialized correctly", () => { 30 | expect(directive.align === DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT.End).toBe(true); 31 | expect(directive.as).toBeNull(); 32 | expect(directive.modelId).toBeUndefined(); 33 | expect(directive.modelType).toBeUndefined(); 34 | }); 35 | }); 36 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/dynamic-date-control.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicFormValueControlModelConfig, DynamicFormValueControlModel } from "./dynamic-form-value-control.model"; 2 | import { DynamicFormControlLayout } from "./misc/dynamic-form-control-layout.model"; 3 | import { serializable } from "../decorator/serializable.decorator"; 4 | 5 | export type DynamicDateControlValue = string | object | Date; 6 | 7 | export interface DynamicDateControlModelConfig extends DynamicFormValueControlModelConfig { 8 | format?: string; 9 | max?: DynamicDateControlValue; 10 | min?: DynamicDateControlValue; 11 | placeholder?: string; 12 | } 13 | 14 | export abstract class DynamicDateControlModel extends DynamicFormValueControlModel { 15 | @serializable() format: string | null; 16 | @serializable() max: DynamicDateControlValue | null; 17 | @serializable() min: DynamicDateControlValue | null; 18 | @serializable() placeholder: string | null; 19 | 20 | protected constructor(config: DynamicDateControlModelConfig, layout?: DynamicFormControlLayout) { 21 | super(config, layout); 22 | 23 | this.format = config.format ?? null; 24 | this.max = config.max ?? null; 25 | this.min = config.min ?? null; 26 | this.placeholder = config.placeholder ?? null; 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/ui-primeng.ts: -------------------------------------------------------------------------------- 1 | export * from "./autocomplete/dynamic-primeng-autocomplete.component"; 2 | export * from "./calendar/dynamic-primeng-calendar.component"; 3 | export * from "./checkbox/dynamic-primeng-checkbox.component"; 4 | export * from "./chips/dynamic-primeng-chips.component"; 5 | export * from "./colorpicker/dynamic-primeng-colorpicker.component"; 6 | export * from "./dropdown/dynamic-primeng-dropdown.component"; 7 | export * from "./editor/dynamic-primeng-editor.component"; 8 | export * from "./input/dynamic-primeng-input.component"; 9 | export * from "./input-mask/dynamic-primeng-input-mask.component"; 10 | export * from "./input-switch/dynamic-primeng-input-switch.component"; 11 | export * from "./multiselect/dynamic-primeng-multiselect.component"; 12 | export * from "./radio-group/dynamic-primeng-radio-group.component"; 13 | export * from "./rating/dynamic-primeng-rating.component"; 14 | export * from "./slider/dynamic-primeng-slider.component"; 15 | export * from "./spinner/dynamic-primeng-spinner.component"; 16 | export * from "./textarea/dynamic-primeng-textarea.component"; 17 | 18 | export * from "./dynamic-primeng-form.component"; 19 | export * from "./dynamic-primeng-form.const"; 20 | export * from "./dynamic-primeng-form-control-container.component"; 21 | export * from "./dynamic-primeng-form-control-with-template.component"; 22 | 23 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-material/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@ng-dynamic-forms/ui-material", 3 | "version": "18.0.0", 4 | "description": "Material UI package for NG Dynamic Forms", 5 | "keywords": [ 6 | "angular", 7 | "dynamic forms", 8 | "forms", 9 | "material", 10 | "ng dynamic forms", 11 | "reactive forms", 12 | "ui" 13 | ], 14 | "homepage": "https://github.com/udos86/ng-dynamic-forms#readme", 15 | "bugs": { 16 | "url": "https://github.com/udos86/ng-dynamic-forms/issues" 17 | }, 18 | "license": "ISC", 19 | "author": { 20 | "name": "Udo Schöfer", 21 | "email": "ng2-dynamic-forms@udos86.de", 22 | "url": "https://github.com/udos86/ng-dynamic-forms" 23 | }, 24 | "main": "./bundles/ui-material.umd.js", 25 | "module": "./fesm5/ui-material.js", 26 | "typings": "./ui-material.d.ts", 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/udos86/ng-dynamic-forms.git" 30 | }, 31 | "peerDependencies": { 32 | "@angular/material": "^16.0.0", 33 | "@ng-dynamic-forms/core": "^18.0.0" 34 | }, 35 | "es2015": "./fesm2015/ui-material.js", 36 | "esm2015": "./esm2015/ui-material.js", 37 | "esm5": "./esm5/ui-material.js", 38 | "fesm2015": "./fesm2015/ui-material.js", 39 | "fesm5": "./fesm5/ui-material.js", 40 | "sideEffects": false, 41 | "dependencies": { 42 | "tslib": "^2.0.0" 43 | } 44 | } -------------------------------------------------------------------------------- /src/app/ui-foundation/foundation-sample-form.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | 5 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 |
24 | 25 |
26 | 27 |
28 | 29 |
{{formGroup.value | json}}
30 | 31 |
-------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@ng-dynamic-forms/core", 3 | "version": "18.0.0", 4 | "description": "A rapid form development library for Angular", 5 | "keywords": [ 6 | "angular", 7 | "core", 8 | "dynamic forms", 9 | "forms", 10 | "ng dynamic forms", 11 | "reactive forms" 12 | ], 13 | "homepage": "https://github.com/udos86/ng-dynamic-forms#readme", 14 | "bugs": { 15 | "url": "https://github.com/udos86/ng-dynamic-forms/issues" 16 | }, 17 | "license": "ISC", 18 | "author": { 19 | "name": "Udo Schöfer", 20 | "email": "ng2-dynamic-forms@udos86.de", 21 | "url": "https://github.com/udos86/ng-dynamic-forms" 22 | }, 23 | "main": "./bundles/core.umd.js", 24 | "module": "./fesm5/core.js", 25 | "typings": "./core.d.ts", 26 | "repository": { 27 | "type": "git", 28 | "url": "git+https://github.com/udos86/ng-dynamic-forms.git" 29 | }, 30 | "peerDependencies": { 31 | "@angular/common": "^16.0.0", 32 | "@angular/core": "^16.0.0", 33 | "@angular/forms": "^16.0.0", 34 | "core-js": "^3.31.0", 35 | "rxjs": "^7.5.7" 36 | }, 37 | "es2015": "./fesm2015/core.js", 38 | "esm2015": "./esm2015/core.js", 39 | "esm5": "./esm5/core.js", 40 | "fesm2015": "./fesm2015/core.js", 41 | "fesm5": "./fesm5/core.js", 42 | "sideEffects": false, 43 | "dependencies": { 44 | "tslib": "^2.0.0" 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/dynamic-ng-bootstrap-form-control-container.component.html: -------------------------------------------------------------------------------- 1 |
4 | 5 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 |
19 | {{ message }} 20 |
21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
29 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ngx-bootstrap/src/lib/dynamic-ngx-bootstrap-form-control-container.component.html: -------------------------------------------------------------------------------- 1 |
4 | 5 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 |
19 | {{ message }} 20 |
21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
29 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/model/textarea/dynamic-textarea.model.ts: -------------------------------------------------------------------------------- 1 | import { DynamicInputControlModel, DynamicInputControlModelConfig } from "../dynamic-input-control.model"; 2 | import { DynamicFormControlLayout } from "../misc/dynamic-form-control-layout.model"; 3 | import { serializable } from "../../decorator/serializable.decorator"; 4 | import { isNumber } from "../../utils/core.utils"; 5 | 6 | export const DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA = "TEXTAREA"; 7 | 8 | export const DYNAMIC_FORM_TEXTAREA_WRAP_HARD = "hard"; 9 | export const DYNAMIC_FORM_TEXTAREA_WRAP_SOFT = "soft"; 10 | 11 | export interface DynamicTextAreaModelConfig extends DynamicInputControlModelConfig { 12 | cols?: number; 13 | rows?: number; 14 | wrap?: string; 15 | } 16 | 17 | export class DynamicTextAreaModel extends DynamicInputControlModel { 18 | @serializable() cols: number; 19 | @serializable() rows: number; 20 | @serializable() wrap: string; 21 | 22 | @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA; 23 | 24 | constructor(config: DynamicTextAreaModelConfig, layout?: DynamicFormControlLayout) { 25 | super(config, layout); 26 | 27 | this.cols = isNumber(config.cols) ? config.cols : 20; 28 | this.rows = isNumber(config.rows) ? config.rows : 2; 29 | this.wrap = config.wrap ?? DYNAMIC_FORM_TEXTAREA_WRAP_SOFT; 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-primeng/src/lib/input/dynamic-primeng-input.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 28 | 29 | 30 | 31 | 34 | 35 |
36 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/core/src/lib/component/dynamic-form-array.component.ts: -------------------------------------------------------------------------------- 1 | import { QueryList } from "@angular/core"; 2 | import { UntypedFormArray } from "@angular/forms"; 3 | import { DynamicFormControlComponent } from "./dynamic-form-control.component"; 4 | import { DynamicTemplateDirective } from "../directive/dynamic-template.directive"; 5 | import { DynamicFormArrayModel } from "../model/form-array/dynamic-form-array.model"; 6 | import { DynamicFormControlContainerComponent } from "./dynamic-form-control-container.component"; 7 | 8 | export abstract class DynamicFormArrayComponent extends DynamicFormControlComponent { 9 | components!: QueryList; 10 | model!: DynamicFormArrayModel; 11 | templates?: QueryList; 12 | 13 | get array(): UntypedFormArray { 14 | return this.control as UntypedFormArray; 15 | } 16 | 17 | get startTemplate(): DynamicTemplateDirective | undefined { 18 | return this.layoutService.getStartTemplate(this.model, this.templates); 19 | } 20 | 21 | get endTemplate(): DynamicTemplateDirective | undefined { 22 | return this.layoutService.getEndTemplate(this.model, this.templates); 23 | } 24 | 25 | markForCheck() { 26 | if (this.components instanceof QueryList) { 27 | this.components.forEach(component => component.markForCheck()); 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /projects/ng-dynamic-forms/ui-ionic/src/lib/datetime/dynamic-ionic-datetime.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 6 | 7 | 24 | 25 | 26 | --------------------------------------------------------------------------------