@syncfusion/ej2-angular-dropdowns 34.2.8-ngcc → 35.1.37

package/schematics/generators/autocomplete-template/schema.json

@@ -0,0 +1,125 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "EJ2SchemaTemplateID",
+  "title": "autocomplete-template",
+  "type": "object",
+  "properties": {
+    "path": {
+      "type": "string",
+      "format": "path",
+      "description": "The path to create the component.",
+      "visible": false
+    },
+    "project": {
+      "type": "string",
+      "description": "The name of the project.",
+      "$default": {
+        "$source": "projectName"
+      }
+    },
+    "name": {
+      "type": "string",
+      "description": "The name of the component.",
+      "$default": {
+        "$source": "argv",
+        "index": 0
+      }
+    },
+    "inlineStyle": {
+      "description": "Specifies if the style will be in the ts file.",
+      "type": "boolean",
+      "default": false,
+      "alias": "s"
+    },
+    "inlineTemplate": {
+      "description": "Specifies if the template will be in the ts file.",
+      "type": "boolean",
+      "default": false,
+      "alias": "t"
+    },
+    "viewEncapsulation": {
+      "description": "Specifies the view encapsulation strategy.",
+      "enum": [
+        "Emulated",
+        "Native",
+        "None",
+        "ShadowDom"
+      ],
+      "type": "string",
+      "alias": "v"
+    },
+    "changeDetection": {
+      "description": "Specifies the change detection strategy.",
+      "enum": [
+        "Default",
+        "OnPush"
+      ],
+      "type": "string",
+      "default": "Default",
+      "alias": "c"
+    },
+    "prefix": {
+      "type": "string",
+      "description": "The prefix to apply to generated selectors.",
+      "alias": "p",
+      "oneOf": [
+        {
+          "maxLength": 0
+        },
+        {
+          "minLength": 1,
+          "format": "html-selector"
+        }
+      ]
+    },
+    "styleext": {
+      "description": "The file extension to be used for style files.",
+      "type": "string",
+      "default": "css"
+    },
+    "spec": {
+      "type": "boolean",
+      "description": "Specifies if a spec file is generated.",
+      "default": true
+    },
+    "flat": {
+      "type": "boolean",
+      "description": "Flag to indicate if a dir is created.",
+      "default": false
+    },
+    "skipImport": {
+      "type": "boolean",
+      "description": "Flag to skip the module import.",
+      "default": false
+    },
+    "selector": {
+      "type": "string",
+      "format": "html-selector",
+      "description": "The selector to use for the component."
+    },
+    "module": {
+      "type": "string",
+      "description": "Allows specification of the declaring module.",
+      "alias": "m"
+    },
+    "export": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies if declaring module exports the component."
+    },
+    "entryComponent": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies if the component is an entry component of declaring module."
+    },
+    "lintFix": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies whether to apply lint fixes after generating the component."
+    }
+  },
+  "required": [
+    "name"
+  ],
+  "id": "autocomplete-template"
+}

package/schematics/generators/autocomplete-template/schema.ts

@@ -0,0 +1,3 @@
+import { Schema as ComponentSchema } from '@schematics/angular/component/schema';
+
+export interface Schema extends ComponentSchema { }

package/schematics/generators/autocomplete-template-driven/index.d.ts

@@ -0,0 +1,3 @@
+import { Rule } from '@angular-devkit/schematics';
+import { Schema } from './schema';
+export default function (options: Schema): Rule;

package/schematics/generators/autocomplete-template-driven/index.js

@@ -0,0 +1,5 @@
+import { componentBuilder } from "@syncfusion/ej2-angular-base/schematics";
+import * as sampleDetails from './sample-details';
+export default function (options) {
+    return componentBuilder(options, sampleDetails);
+}

package/schematics/generators/autocomplete-template-driven/index.ts

@@ -0,0 +1,8 @@
+import { Rule } from '@angular-devkit/schematics';
+import { componentBuilder } from "@syncfusion/ej2-angular-base/schematics";
+import { Schema } from './schema';
+import * as sampleDetails from './sample-details';
+
+export default function (options: Schema): Rule {
+  return componentBuilder(options, sampleDetails);
+}

package/schematics/generators/autocomplete-template-driven/sample-details.d.ts

@@ -0,0 +1,5 @@
+export declare const componentName: string;
+export declare const sampleName: string;
+export declare const diModules: string | null;
+export declare const packageName: string;
+export declare const libModules: string;

package/schematics/generators/autocomplete-template-driven/sample-details.js

@@ -0,0 +1,5 @@
+export const componentName = 'autocomplete';
+export const sampleName = 'template-driven';
+export const diModules = null;
+export const packageName = '@syncfusion/ej2-angular-dropdowns';
+export const libModules = 'AutoCompleteModule';

package/schematics/generators/autocomplete-template-driven/sample-details.ts

@@ -0,0 +1,5 @@
+export const componentName: string = 'autocomplete';
+export const sampleName: string = 'template-driven';
+export const diModules: string | null =  null;
+export const packageName: string = '@syncfusion/ej2-angular-dropdowns';
+export const libModules: string = 'AutoCompleteModule';

package/schematics/generators/autocomplete-template-driven/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.css

@@ -0,0 +1,17 @@
+.box-form {
+    webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
+    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
+}
+table.box-table td {
+    padding-top: 10px;
+}
+.highcontrast #content.box-form {
+    webkit-box-shadow: 0 2px 2px 0 rgb(255, 217, 57), 0 3px 1px -2px rgb(255, 217, 57), 0 1px 5px 0 rgb(255, 217, 57);
+    box-shadow: 0 2px 2px 0 rgb(255, 217, 57), 0 3px 1px -2px rgb(255, 217, 57), 0 1px 5px 0 rgb(255, 217, 57);
+}
+table.box-table td.formtext {
+    color:#8a2be2;
+}
+.highcontrast table.box-table td.formtext {
+    color:#f8fc08;
+}

package/schematics/generators/autocomplete-template-driven/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html

@@ -0,0 +1,18 @@
+
+<form #form="ngForm" class='box-form'>
+     <div class="form-group">
+        <ejs-autocomplete name="skillname" #value='ngModel'  required [(ngModel)]= 'autoskillname' allowCustom=false [dataSource]='autoSkillsetData' [placeholder]='autoDrivenPlaceholder' floatLabelType='Auto'>
+        </ejs-autocomplete>
+    <div *ngIf="(value.invalid && (value.dirty || value.touched))" class="alert alert-danger">
+        <div *ngIf="value.errors.required">
+            Value is required.
+        </div>
+    </div>
+    </div>
+    <div class="form-group" style="padding:10px;">
+        <div class="col-xs-6 col-sm-6 col-lg-6 col-md-6"><button ejs-button [disabled]="!form.valid">Submit</button></div>
+            <div class="col-xs-6 col-sm-6 col-lg-6 col-md-6"><button ejs-button (click)="onreset($event)" type="reset" [disabled]="!form.valid">Reset</button></div>
+        </div>
+</form>
+
+      

package/schematics/generators/autocomplete-template-driven/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts

@@ -0,0 +1,33 @@
+/**
+ * AutoComplete Template Driven Sample
+ */
+import { Component, ViewEncapsulation } from '@angular/core';
+
+@Component({
+    selector: '<%=dasherize(selector)%>',
+    templateUrl: '<%=dasherize(name)%>.component.html',
+    styleUrls: ['<%=dasherize(name)%>.component.css'],
+    encapsulation: ViewEncapsulation.None
+})
+export class <%= classify(name) %>Component {
+    public autoSkillsetData: string[] = [
+        'ASP.NET', 'ActionScript', 'Basic',
+        'C++' , 'C#' , 'dBase' , 'Delphi' ,
+        'ESPOL' , 'F#' , 'FoxPro' , 'Java',
+        'J#' , 'Lisp' , 'Logo' , 'PHP'
+    ];
+    public autoDrivenPlaceholder: String = 'Select book';
+
+    public autoskillname: string =  null;
+
+    onfocus(element: FocusEvent) : void {
+        let target: HTMLInputElement = element.target as HTMLInputElement;
+        let parentNode: HTMLElement = target.parentNode as HTMLElement;
+        if (parentNode.classList.contains('e-input-in-wrap')) {
+            parentNode = (parentNode.parentNode as HTMLElement);
+        }
+        parentNode.classList.add('e-input-focus');
+        parentNode.querySelector('.e-float-text').classList.add('e-label-top');
+        parentNode.querySelector('.e-float-text').classList.remove('e-label-bottom');
+    }
+}

package/schematics/generators/autocomplete-template-driven/schema.d.ts

@@ -0,0 +1,3 @@
+import { Schema as ComponentSchema } from '@schematics/angular/component/schema';
+export interface Schema extends ComponentSchema {
+}

package/schematics/generators/autocomplete-template-driven/schema.js

@@ -0,0 +1 @@
+export {};

package/schematics/generators/autocomplete-template-driven/schema.json

@@ -0,0 +1,125 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "EJ2SchemaTemplateID",
+  "title": "autocomplete-template-driven",
+  "type": "object",
+  "properties": {
+    "path": {
+      "type": "string",
+      "format": "path",
+      "description": "The path to create the component.",
+      "visible": false
+    },
+    "project": {
+      "type": "string",
+      "description": "The name of the project.",
+      "$default": {
+        "$source": "projectName"
+      }
+    },
+    "name": {
+      "type": "string",
+      "description": "The name of the component.",
+      "$default": {
+        "$source": "argv",
+        "index": 0
+      }
+    },
+    "inlineStyle": {
+      "description": "Specifies if the style will be in the ts file.",
+      "type": "boolean",
+      "default": false,
+      "alias": "s"
+    },
+    "inlineTemplate": {
+      "description": "Specifies if the template will be in the ts file.",
+      "type": "boolean",
+      "default": false,
+      "alias": "t"
+    },
+    "viewEncapsulation": {
+      "description": "Specifies the view encapsulation strategy.",
+      "enum": [
+        "Emulated",
+        "Native",
+        "None",
+        "ShadowDom"
+      ],
+      "type": "string",
+      "alias": "v"
+    },
+    "changeDetection": {
+      "description": "Specifies the change detection strategy.",
+      "enum": [
+        "Default",
+        "OnPush"
+      ],
+      "type": "string",
+      "default": "Default",
+      "alias": "c"
+    },
+    "prefix": {
+      "type": "string",
+      "description": "The prefix to apply to generated selectors.",
+      "alias": "p",
+      "oneOf": [
+        {
+          "maxLength": 0
+        },
+        {
+          "minLength": 1,
+          "format": "html-selector"
+        }
+      ]
+    },
+    "styleext": {
+      "description": "The file extension to be used for style files.",
+      "type": "string",
+      "default": "css"
+    },
+    "spec": {
+      "type": "boolean",
+      "description": "Specifies if a spec file is generated.",
+      "default": true
+    },
+    "flat": {
+      "type": "boolean",
+      "description": "Flag to indicate if a dir is created.",
+      "default": false
+    },
+    "skipImport": {
+      "type": "boolean",
+      "description": "Flag to skip the module import.",
+      "default": false
+    },
+    "selector": {
+      "type": "string",
+      "format": "html-selector",
+      "description": "The selector to use for the component."
+    },
+    "module": {
+      "type": "string",
+      "description": "Allows specification of the declaring module.",
+      "alias": "m"
+    },
+    "export": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies if declaring module exports the component."
+    },
+    "entryComponent": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies if the component is an entry component of declaring module."
+    },
+    "lintFix": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies whether to apply lint fixes after generating the component."
+    }
+  },
+  "required": [
+    "name"
+  ],
+  "id": "autocomplete-template-driven"
+}

package/schematics/generators/autocomplete-template-driven/schema.ts

@@ -0,0 +1,3 @@
+import { Schema as ComponentSchema } from '@schematics/angular/component/schema';
+
+export interface Schema extends ComponentSchema { }

package/schematics/generators/combobox-custom-value/index.d.ts

@@ -0,0 +1,3 @@
+import { Rule } from '@angular-devkit/schematics';
+import { Schema } from './schema';
+export default function (options: Schema): Rule;

package/schematics/generators/combobox-custom-value/index.js

@@ -0,0 +1,5 @@
+import { componentBuilder } from "@syncfusion/ej2-angular-base/schematics";
+import * as sampleDetails from './sample-details';
+export default function (options) {
+    return componentBuilder(options, sampleDetails);
+}

package/schematics/generators/combobox-custom-value/index.ts

@@ -0,0 +1,8 @@
+import { Rule } from '@angular-devkit/schematics';
+import { componentBuilder } from "@syncfusion/ej2-angular-base/schematics";
+import { Schema } from './schema';
+import * as sampleDetails from './sample-details';
+
+export default function (options: Schema): Rule {
+  return componentBuilder(options, sampleDetails);
+}

package/schematics/generators/combobox-custom-value/sample-details.d.ts

@@ -0,0 +1,5 @@
+export declare const componentName: string;
+export declare const sampleName: string;
+export declare const diModules: string | null;
+export declare const packageName: string;
+export declare const libModules: string;

package/schematics/generators/combobox-custom-value/sample-details.js

@@ -0,0 +1,5 @@
+export const componentName = 'combobox';
+export const sampleName = 'custom-value';
+export const diModules = null;
+export const packageName = '@syncfusion/ej2-angular-dropdowns';
+export const libModules = 'ComboBoxModule';

package/schematics/generators/combobox-custom-value/sample-details.ts

@@ -0,0 +1,5 @@
+export const componentName: string = 'combobox';
+export const sampleName: string = 'custom-value';
+export const diModules: string | null =  null;
+export const packageName: string = '@syncfusion/ej2-angular-dropdowns';
+export const libModules: string = 'ComboBoxModule';

package/schematics/generators/combobox-custom-value/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.css

@@ -0,0 +1 @@
+

package/schematics/generators/combobox-custom-value/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html

@@ -0,0 +1,7 @@
+
+<ejs-combobox id='country' #sample [dataSource]='data' [fields]='fields' (filtering)='onFiltering($event)' [popupHeight]='height' [allowFiltering]='true' [placeholder]='watermark' width='300px'>
+    <ng-template #noRecordsTemplate>
+        <div id="nodata"> No matched item, do you want to add it as new item in list?</div> <button (click)="addNewItem($event)" class="e-control e-btn">Add New Item</button>
+    </ng-template>
+</ejs-combobox>
+   

package/schematics/generators/combobox-custom-value/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts

@@ -0,0 +1,61 @@
+/**
+ * ComboBox Filtering Sample
+ */
+import { Component, ViewChild } from '@angular/core';
+import { Query } from '@syncfusion/ej2-data';
+import { EmitType } from '@syncfusion/ej2-base';
+import { FilteringEventArgs } from '@syncfusion/ej2-dropdowns';
+import { ComboBoxComponent } from '@syncfusion/ej2-angular-dropdowns';
+
+@Component({
+    selector: '<%=dasherize(selector)%>',
+    styleUrls: ['<%=dasherize(name)%>.component.css'],
+    templateUrl: '<%=dasherize(name)%>.component.html'
+})
+export class <%= classify(name) %>Component {
+    // defined the JSON of data
+    public data: { [key: string]: Object; }[] = [
+        { Name: 'Australia', Code: 'AU' },
+        { Name: 'Bermuda', Code: 'BM' },
+        { Name: 'Canada', Code: 'CA' },
+        { Name: 'Cameroon', Code: 'CM' },
+        { Name: 'Denmark', Code: 'DK' },
+        { Name: 'France', Code: 'FR' },
+        { Name: 'Finland', Code: 'FI' },
+        { Name: 'Germany', Code: 'DE' },
+        { Name: 'Greenland', Code: 'GL' },
+        { Name: 'Hong Kong', Code: 'HK' },
+        { Name: 'India', Code: 'IN' },
+        { Name: 'Italy', Code: 'IT' }
+    ];
+    // maps the appropriate column to fields property
+    public fields: Object = { text: 'Name', value: 'Code' };
+    // set the height of the popup element
+    public height: string = '220px';
+    // set the placeholder to ComboBox input element
+    public watermark: string = 'Select a country';
+    // bind the filtering event
+    public onFiltering: EmitType<FilteringEventArgs> = (e: FilteringEventArgs) => {
+        let query: Query = new Query();
+        // frame the query based on search string with filter type.
+        query = (e.text !== '') ? query.where('Name', 'startswith', e.text, true) : query;
+        // pass the filter data source, filter query to updateData method.
+        e.updateData(this.data, query);
+    }
+    @ViewChild('sample')
+    public comboObj: ComboBoxComponent;
+    public addNewItem = () => {
+        // get the typed characters
+        let customValue: string = (this.comboObj.element.getElementsByClassName('e-input')[0] as HTMLInputElement).value;
+        // make new object based on typed characters
+        let newItem: { [key: string]: Object; } = {'Name': customValue, 'Code': customValue };
+        // new object added to data source.
+        (this.comboObj.dataSource as Object[]).push(newItem);
+        // close the popup element.
+        this.comboObj.hidePopup();
+        // pass new object to addItem method.
+        this.comboObj.addItem(newItem);
+        // select the newly added item.
+        this.comboObj.value = customValue;
+    }
+}

package/schematics/generators/combobox-custom-value/schema.d.ts

@@ -0,0 +1,3 @@
+import { Schema as ComponentSchema } from '@schematics/angular/component/schema';
+export interface Schema extends ComponentSchema {
+}

package/schematics/generators/combobox-custom-value/schema.js

@@ -0,0 +1 @@
+export {};

package/schematics/generators/combobox-custom-value/schema.json

@@ -0,0 +1,125 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "EJ2SchemaTemplateID",
+  "title": "combobox-custom-value",
+  "type": "object",
+  "properties": {
+    "path": {
+      "type": "string",
+      "format": "path",
+      "description": "The path to create the component.",
+      "visible": false
+    },
+    "project": {
+      "type": "string",
+      "description": "The name of the project.",
+      "$default": {
+        "$source": "projectName"
+      }
+    },
+    "name": {
+      "type": "string",
+      "description": "The name of the component.",
+      "$default": {
+        "$source": "argv",
+        "index": 0
+      }
+    },
+    "inlineStyle": {
+      "description": "Specifies if the style will be in the ts file.",
+      "type": "boolean",
+      "default": false,
+      "alias": "s"
+    },
+    "inlineTemplate": {
+      "description": "Specifies if the template will be in the ts file.",
+      "type": "boolean",
+      "default": false,
+      "alias": "t"
+    },
+    "viewEncapsulation": {
+      "description": "Specifies the view encapsulation strategy.",
+      "enum": [
+        "Emulated",
+        "Native",
+        "None",
+        "ShadowDom"
+      ],
+      "type": "string",
+      "alias": "v"
+    },
+    "changeDetection": {
+      "description": "Specifies the change detection strategy.",
+      "enum": [
+        "Default",
+        "OnPush"
+      ],
+      "type": "string",
+      "default": "Default",
+      "alias": "c"
+    },
+    "prefix": {
+      "type": "string",
+      "description": "The prefix to apply to generated selectors.",
+      "alias": "p",
+      "oneOf": [
+        {
+          "maxLength": 0
+        },
+        {
+          "minLength": 1,
+          "format": "html-selector"
+        }
+      ]
+    },
+    "styleext": {
+      "description": "The file extension to be used for style files.",
+      "type": "string",
+      "default": "css"
+    },
+    "spec": {
+      "type": "boolean",
+      "description": "Specifies if a spec file is generated.",
+      "default": true
+    },
+    "flat": {
+      "type": "boolean",
+      "description": "Flag to indicate if a dir is created.",
+      "default": false
+    },
+    "skipImport": {
+      "type": "boolean",
+      "description": "Flag to skip the module import.",
+      "default": false
+    },
+    "selector": {
+      "type": "string",
+      "format": "html-selector",
+      "description": "The selector to use for the component."
+    },
+    "module": {
+      "type": "string",
+      "description": "Allows specification of the declaring module.",
+      "alias": "m"
+    },
+    "export": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies if declaring module exports the component."
+    },
+    "entryComponent": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies if the component is an entry component of declaring module."
+    },
+    "lintFix": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies whether to apply lint fixes after generating the component."
+    }
+  },
+  "required": [
+    "name"
+  ],
+  "id": "combobox-custom-value"
+}

package/schematics/generators/combobox-custom-value/schema.ts

@@ -0,0 +1,3 @@
+import { Schema as ComponentSchema } from '@schematics/angular/component/schema';
+
+export interface Schema extends ComponentSchema { }

package/schematics/generators/combobox-default/index.d.ts

@@ -0,0 +1,3 @@
+import { Rule } from '@angular-devkit/schematics';
+import { Schema } from './schema';
+export default function (options: Schema): Rule;

package/schematics/generators/combobox-default/index.js

@@ -0,0 +1,5 @@
+import { componentBuilder } from "@syncfusion/ej2-angular-base/schematics";
+import * as sampleDetails from './sample-details';
+export default function (options) {
+    return componentBuilder(options, sampleDetails);
+}

package/schematics/generators/combobox-default/index.ts

@@ -0,0 +1,8 @@
+import { Rule } from '@angular-devkit/schematics';
+import { componentBuilder } from "@syncfusion/ej2-angular-base/schematics";
+import { Schema } from './schema';
+import * as sampleDetails from './sample-details';
+
+export default function (options: Schema): Rule {
+  return componentBuilder(options, sampleDetails);
+}