@syncfusion/ej2-dropdowns 27.1.57 → 27.2.2

package/styles/multi-select/_bigger.scss

@@ -1111,11 +1111,11 @@
   .e-bigger.e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
   .e-bigger .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker {
     @if $ddl-multiselect-skin-name == 'Material3' {
-      height: 54px;
+      height: 40px;
       margin-top: -55px;
-      right: 16px;
+      right: 6px;
       top: 100%;
-      width: 20px;
+      width: 40px;
     }
   }
   
@@ -1529,7 +1529,7 @@
 
   .e-bigger.e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
   .e-bigger .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-    @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'material-dark' or $ddl-multiselect-skin-name == 'Material3' {
+    @if $ddl-multiselect-skin-name == 'material' or $ddl-multiselect-skin-name == 'material-dark' {
       height: 54px;
       margin-top: -55px;
       right: 16px;

package/styles/multi-select/_material3-definition.scss

@@ -128,7 +128,7 @@ $ddl-multi-list-hover-bg-color: ($flyout-bg-color-hover, .05) !default;
 $ddl-delim-text-padding-right: 6px !default;
 $ddl-list-rtl-padding-right: 15px !default;
 $ddl-close-rtl-icon-left: 19px !default;
-$ddl-chip-close-rtl-left: -7px !default;
+$ddl-chip-close-rtl-left: 0 !default;
 $ddl-delim-font-color: rgba($content-text-color) !default;
 $ddl-close-icon-color: rgba($icon-color) !default;
 $ddl-chip-border: 1px solid rgba($border) !default;
@@ -221,7 +221,7 @@ $outline-multiselect-chip-bg-color: transparent !default;
 $outline-multiselect-chip-hover-bg-color: ($content-bg-color-hover, 5%) !default;
 $outline-multiselect-sel-chip-bg-color: transparent !default;
 $outline-multiselect-sel-hover-chip-bg-color: ($content-bg-color-hover, 5%) !default;
-$outline-multiselect-close-icon-bg-color: rgba($icon-color, .54) !default;
+$outline-multiselect-close-icon-bg-color: rgba($icon-color) !default;
 $outline-multiselect-close-icon-hover-bg-color: rgba($icon-color-hover, .87) !default;
 $outline-multiselect-remains-font-color: rgba($content-text-color, .6) !default;
 $outline-multiselect-disabled-font-color: rgba($content-text-color, .38) !default;

package/styles/multi-select/icons/_material3.scss

@@ -25,11 +25,11 @@
 
   .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker {
     @if $ddl-multiselect-skin-name == 'Material3' {
-      height: 38px;
-      margin-top: -38px;
-      right: 18px;
+      height: 32px;
+      margin-top: -35px;
+      right: 4px;
       top: 100%;
-      width: 16px;
+      width: 32px;
     }
   }
 
@@ -59,11 +59,11 @@
   .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
   .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker {
     @if $ddl-multiselect-skin-name == 'Material3' {
-      height: 34px;
-      margin-top: -35px;
-      right: 16px;
+      height: 24px;
+      margin-top: -29px;
+      right: 2px;
       top: 100%;
-      width: 14px;
+      width: 24px;
     }
   }
 

package/styles/multi-select/material3-dark.css

@@ -110,11 +110,11 @@
 }
 
 .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-  height: 38px;
-  margin-top: -38px;
-  right: 18px;
+  height: 32px;
+  margin-top: -35px;
+  right: 4px;
   top: 100%;
-  width: 16px;
+  width: 32px;
 }
 
 .e-multiselect.e-filled .e-multi-select-wrapper .e-chips-close.e-close-hooker {
@@ -136,11 +136,11 @@
 
 .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
 .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-  height: 34px;
-  margin-top: -35px;
-  right: 16px;
+  height: 24px;
+  margin-top: -29px;
+  right: 2px;
   top: 100%;
-  width: 14px;
+  width: 24px;
 }
 
 .e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-chips-close.e-close-hooker,
@@ -833,7 +833,7 @@
 }
 
 .e-multiselect.e-rtl .e-multi-select-wrapper.e-down-icon .e-close-hooker::before {
-  left: -7px;
+  left: 0;
 }
 
 .e-popup.e-multi-select-list-wrapper .e-list-item .e-checkbox-wrapper {
@@ -1643,7 +1643,7 @@ ejs-multiselect {
 
 .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
 .e-multiselect.e-filled .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-  color: rgba(var(--color-sf-on-surface-variant), 0.54);
+  color: rgba(var(--color-sf-on-surface-variant));
 }
 
 .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker:hover,
@@ -2367,11 +2367,11 @@ ejs-multiselect {
 
 .e-bigger.e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
 .e-bigger .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-  height: 54px;
+  height: 40px;
   margin-top: -55px;
-  right: 16px;
+  right: 6px;
   top: 100%;
-  width: 20px;
+  width: 40px;
 }
 
 .e-bigger.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-chips-close.e-close-hooker,
@@ -2627,15 +2627,6 @@ ejs-multiselect {
   right: 48px;
 }
 
-.e-bigger.e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
-.e-bigger .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-  height: 54px;
-  margin-top: -55px;
-  right: 16px;
-  top: 100%;
-  width: 20px;
-}
-
 .e-bigger.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-chips-close.e-close-hooker,
 .e-bigger .e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-chips-close.e-close-hooker {
   right: 60px;

package/styles/multi-select/material3.css

@@ -112,11 +112,11 @@
 }
 
 .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-  height: 38px;
-  margin-top: -38px;
-  right: 18px;
+  height: 32px;
+  margin-top: -35px;
+  right: 4px;
   top: 100%;
-  width: 16px;
+  width: 32px;
 }
 
 .e-multiselect.e-filled .e-multi-select-wrapper .e-chips-close.e-close-hooker {
@@ -138,11 +138,11 @@
 
 .e-small.e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
 .e-small .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-  height: 34px;
-  margin-top: -35px;
-  right: 16px;
+  height: 24px;
+  margin-top: -29px;
+  right: 2px;
   top: 100%;
-  width: 14px;
+  width: 24px;
 }
 
 .e-small.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-chips-close.e-close-hooker,
@@ -835,7 +835,7 @@
 }
 
 .e-multiselect.e-rtl .e-multi-select-wrapper.e-down-icon .e-close-hooker::before {
-  left: -7px;
+  left: 0;
 }
 
 .e-popup.e-multi-select-list-wrapper .e-list-item .e-checkbox-wrapper {
@@ -1645,7 +1645,7 @@ ejs-multiselect {
 
 .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
 .e-multiselect.e-filled .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-  color: rgba(var(--color-sf-on-surface-variant), 0.54);
+  color: rgba(var(--color-sf-on-surface-variant));
 }
 
 .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker:hover,
@@ -2369,11 +2369,11 @@ ejs-multiselect {
 
 .e-bigger.e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
 .e-bigger .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-  height: 54px;
+  height: 40px;
   margin-top: -55px;
-  right: 16px;
+  right: 6px;
   top: 100%;
-  width: 20px;
+  width: 40px;
 }
 
 .e-bigger.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-chips-close.e-close-hooker,
@@ -2629,15 +2629,6 @@ ejs-multiselect {
   right: 48px;
 }
 
-.e-bigger.e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
-.e-bigger .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-  height: 54px;
-  margin-top: -55px;
-  right: 16px;
-  top: 100%;
-  width: 20px;
-}
-
 .e-bigger.e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-chips-close.e-close-hooker,
 .e-bigger .e-multiselect.e-outline .e-multi-select-wrapper.e-down-icon .e-chips-close.e-close-hooker {
   right: 60px;

package/tslint.json

@@ -0,0 +1,111 @@
+{
+  "rules": {
+    "chai-vague-errors": true,
+    "use-isnan": true,
+    "missing-jsdoc": true,
+    "missing-optional-annotation": true,
+    "no-backbone-get-set-outside-model": true,
+    "no-banned-terms": true,
+    "no-constant-condition": true,
+    "no-control-regex": true,
+    "no-cookies": true,
+    "no-delete-expression": true,
+    "no-document-write": true,
+    "no-document-domain": true,
+    "no-disable-auto-sanitization": true,
+    "no-duplicate-case": true,
+    "no-duplicate-parameter-names": true,
+    "no-empty-interfaces": true,
+    "no-exec-script": true,
+    "no-function-constructor-with-string-args": true,
+    "no-function-expression": true,
+    "no-invalid-regexp": true,
+    "no-for-in": true,
+    "member-access": true,
+    "no-multiline-string": true,
+    "no-multiple-var-decl": true,
+    "no-unnecessary-bind": true,
+    "no-unnecessary-semicolons": true,
+    "no-octal-literal": true,
+    "no-regex-spaces": true,
+    "no-sparse-arrays": true,
+    "no-string-based-set-immediate": true,
+    "no-string-based-set-interval": true,
+    "no-unused-imports": true,
+    "no-with-statement": true,
+    "prefer-array-literal": true,
+    "promise-must-complete": false,
+    "react-no-dangerous-html": true,
+    "use-named-parameter": true,
+    "valid-typeof": true,
+    "max-func-body-length": [true, 100, {
+      "ignore-parameters-to-function-regex": "describe"
+    }],
+    "class-name": true,
+    "curly": true,
+    "eofline": false,
+    "forin": true,
+    "indent": [
+      true,
+      "spaces"
+    ],
+    "label-position": true,       
+    "max-line-length": [true, 140],
+    "no-arg": true,
+    "no-console": [true,
+      "debug",
+      "info",
+      "log",
+      "time",
+      "timeEnd",
+      "trace"
+    ],
+    "no-construct": true,
+    "no-parameter-properties": true,
+    "no-debugger": true,    
+    "no-duplicate-variable": true,
+    "no-empty": true,
+    "no-eval": true,
+    "no-string-literal": true,
+    "no-switch-case-fall-through": true,
+    "trailing-comma": true,
+    "no-trailing-whitespace": true,
+    "no-unused-expression": true,
+    "no-use-before-declare": false,
+    "no-var-requires": true,
+    "one-line": [true,
+      "check-open-brace",
+      "check-catch",
+      "check-else",
+      "check-whitespace"
+    ],
+    "no-any": true,
+    "no-conditional-assignment": true,
+    "no-angle-bracket-type-assertion": false,
+    "align": [true, "parameters", "arguments", "statements"],
+    "no-empty-line-after-opening-brace": false,
+    "typedef-whitespace": [false],
+    "ban": true,
+    "quotemark": [true, "single"],
+    "semicolon": true,
+    "triple-equals": [true, "allow-null-check"],
+    "typedef": [true,
+      "call-signature",
+      "parameter",
+      "property-declaration",
+      "variable-declaration",
+      "arrow-parameter",
+      "member-variable-declaration"],    
+    "variable-name": true,
+    "whitespace": [true,
+      "check-branch",
+      "check-decl",
+      "check-operator",
+      "check-separator",
+      "check-type"
+    ],
+    "jsdoc-format": true,
+    "no-var-keyword": true,
+    "radix": true
+  }
+}