@spectrum-web-components/dropdown - npm Package Compare versions

Comparing version 0.1.3 to 0.1.4

CHANGELOG.md

@@ -6,8 +6,14 @@ # Change Log
 
-## 0.1.3 (2019-10-03)
+## [0.1.4](https://github.com/adobe/spectrum-web-components/compare/@spectrum-web-components/dropdown@0.1.3...@spectrum-web-components/dropdown@0.1.4) (2019-10-14)
 
-**Note:** Version bump only for package @spectrum-web-components/dropdown
+### Bug Fixes
 
+-   **dropdown:** remove unexpected width constraint ([c625853](https://github.com/adobe/spectrum-web-components/commit/c625853))
+
+### Performance Improvements
+
+-   use imported TypeScript helpers instead of inlining them ([cc2bd0a](https://github.com/adobe/spectrum-web-components/commit/cc2bd0a))
+
 ## 0.1.3 (2019-10-03)
 
 **Note:** Version bump only for package @spectrum-web-components/dropdown

lib/dropdown.css.js

@@ -26,5 +26,5 @@ /*
 var(--spectrum-global-dimension-size-225)))/2)}#button #label+.icon:not(.dropdown){margin-left:var(--spectrum-dropdown-icon-margin-left,var(--spectrum-global-dimension-size-150))}:host([quiet]){width:auto;min-width:var(--spectrum-dropdown-quiet-min-width,var(--spectrum-global-dimension-size-600))}#popover{max-width:var(--spectrum-global-dimension-size-3000)}.spectrum-Dropdown-popover--quiet{margin-left:calc(-1*(var(--spectrum-dropdown-quiet-popover-offset-x,
-var(--spectrum-global-dimension-size-150)) + var(--spectrum-popover-border-size, 1px)))}#button:hover .dropdown{color:var(--spectrum-dropdown-icon-color-hover,var(--spectrum-global-color-gray-900))}#button.is-selected .placeholder{color:var(--spectrum-dropdown-placeholder-text-color-down,var(--spectrum-global-color-gray-900))}:host([invalid]) .icon:not(.dropdown):not(.checkmark){color:var(--spectrum-dropdown-validation-icon-color-error,var(--spectrum-global-color-red-600))}:host([disabled]) #button:hover .dropdown,:host([disabled]) .dropdown,:host([invalid][disabled]) .icon,:host([invalid][disabled]) .icon:not(.dropdown):not(.checkmark){color:var(--spectrum-dropdown-icon-color-disabled,var(--spectrum-global-color-gray-400))}:host([disabled]) #label.placeholder{color:var(--spectrum-dropdown-placeholder-text-color-disabled,var(--spectrum-global-color-gray-500))}#label.placeholder:hover{color:var(--spectrum-dropdown-placeholder-text-color-hover,var(--spectrum-global-color-gray-900))}#label.placeholder:active{color:var(--spectrum-dropdown-placeholder-text-color-mouse-focus,var(--spectrum-global-color-gray-900))}#button:focus #label.placeholder{color:var(--spectrum-dropdown-placeholder-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button:focus .dropdown{color:var(--spectrum-dropdown-icon-color-key-focus,var(--spectrum-global-color-gray-900))}#button .icon:not(.dropdown),.icon{margin-top:0;margin-bottom:0;flex-shrink:0}sp-popover{width:100%}:host([quiet]){width:var(--spectrum-global-dimension-size-2400)}
+var(--spectrum-global-dimension-size-150)) + var(--spectrum-popover-border-size, 1px)))}#button:hover .dropdown{color:var(--spectrum-dropdown-icon-color-hover,var(--spectrum-global-color-gray-900))}#button.is-selected .placeholder{color:var(--spectrum-dropdown-placeholder-text-color-down,var(--spectrum-global-color-gray-900))}:host([invalid]) .icon:not(.dropdown):not(.checkmark){color:var(--spectrum-dropdown-validation-icon-color-error,var(--spectrum-global-color-red-600))}:host([disabled]) #button:hover .dropdown,:host([disabled]) .dropdown,:host([invalid][disabled]) .icon,:host([invalid][disabled]) .icon:not(.dropdown):not(.checkmark){color:var(--spectrum-dropdown-icon-color-disabled,var(--spectrum-global-color-gray-400))}:host([disabled]) #label.placeholder{color:var(--spectrum-dropdown-placeholder-text-color-disabled,var(--spectrum-global-color-gray-500))}#label.placeholder:hover{color:var(--spectrum-dropdown-placeholder-text-color-hover,var(--spectrum-global-color-gray-900))}#label.placeholder:active{color:var(--spectrum-dropdown-placeholder-text-color-mouse-focus,var(--spectrum-global-color-gray-900))}#button:focus #label.placeholder{color:var(--spectrum-dropdown-placeholder-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button:focus .dropdown{color:var(--spectrum-dropdown-icon-color-key-focus,var(--spectrum-global-color-gray-900))}sp-popover{width:100%}#label~.dropdown{margin-left:var(--spectrum-dropdown-icon-gap,var(--spectrum-global-dimension-size-100))}
 `;
 export default styles;
 //# sourceMappingURL=dropdown.css.js.map

lib/dropdown.js

@@ -12,8 +12,3 @@ /*
 */
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+import { __decorate } from "tslib";
 import { html, property, query, } from 'lit-element';
@@ -25,2 +20,4 @@ import { nothing } from 'lit-html';
 import fieldButtonStyles from '@spectrum-web-components/button/lib/field-button.css.js';
+import alertSmallStyles from '@spectrum-web-components/icon/lib/spectrum-icon-alert-small.css.js';
+import chevronDownMediumStyles from '@spectrum-web-components/icon/lib/spectrum-icon-chevron-down-medium.css.js';
 import { Focusable } from '@spectrum-web-components/shared/lib/focusable.js';
@@ -59,3 +56,9 @@ import '@spectrum-web-components/icon';
     static get styles() {
-        return [actionButtonStyles, fieldButtonStyles, dropdownStyles];
+        return [
+            actionButtonStyles,
+            fieldButtonStyles,
+            dropdownStyles,
+            alertSmallStyles,
+            chevronDownMediumStyles,
+        ];
     }
@@ -153,3 +156,3 @@ get focusElement() {
                           <sp-icon
-                              class="icon"
+                              class="icon alert-small"
                               name="ui:AlertSmall"
@@ -161,3 +164,3 @@ size="s"
                 <sp-icon
-                    class="icon dropdown"
+                    class="icon dropdown chevron-down-medium"
                     name="ui:ChevronDownMedium"
@@ -164,0 +167,0 @@ size="s"

package.json

@@ -21,3 +21,3 @@ {
     ],
-    "version": "0.1.3",
+    "version": "0.1.4",
     "description": "",
@@ -40,11 +40,12 @@ "main": "lib/index.js",
     "dependencies": {
-        "@spectrum-web-components/button": "^0.1.3",
-        "@spectrum-web-components/icon": "^0.1.3",
-        "@spectrum-web-components/icons": "^0.1.3",
-        "@spectrum-web-components/menu": "^0.1.3",
-        "@spectrum-web-components/menu-item": "^0.1.3",
-        "@spectrum-web-components/popover": "^0.1.3",
-        "@spectrum-web-components/shared": "^0.1.3"
+        "@spectrum-web-components/button": "^0.2.0",
+        "@spectrum-web-components/icon": "^0.2.0",
+        "@spectrum-web-components/icons": "^0.1.4",
+        "@spectrum-web-components/menu": "^0.1.4",
+        "@spectrum-web-components/menu-item": "^0.1.4",
+        "@spectrum-web-components/popover": "^0.1.4",
+        "@spectrum-web-components/shared": "^0.1.4",
+        "tslib": "^1.10.0"
     },
-    "gitHead": "5112887821c1408c1c4121949a4f91743c98ff6a"
+    "gitHead": "7c3e131bc2bc3b1195e736ff65d3c4e044590ace"
 }

src/dropdown.css.ts

@@ -26,4 +26,4 @@ /*
 var(--spectrum-global-dimension-size-225)))/2)}#button #label+.icon:not(.dropdown){margin-left:var(--spectrum-dropdown-icon-margin-left,var(--spectrum-global-dimension-size-150))}:host([quiet]){width:auto;min-width:var(--spectrum-dropdown-quiet-min-width,var(--spectrum-global-dimension-size-600))}#popover{max-width:var(--spectrum-global-dimension-size-3000)}.spectrum-Dropdown-popover--quiet{margin-left:calc(-1*(var(--spectrum-dropdown-quiet-popover-offset-x,
-var(--spectrum-global-dimension-size-150)) + var(--spectrum-popover-border-size, 1px)))}#button:hover .dropdown{color:var(--spectrum-dropdown-icon-color-hover,var(--spectrum-global-color-gray-900))}#button.is-selected .placeholder{color:var(--spectrum-dropdown-placeholder-text-color-down,var(--spectrum-global-color-gray-900))}:host([invalid]) .icon:not(.dropdown):not(.checkmark){color:var(--spectrum-dropdown-validation-icon-color-error,var(--spectrum-global-color-red-600))}:host([disabled]) #button:hover .dropdown,:host([disabled]) .dropdown,:host([invalid][disabled]) .icon,:host([invalid][disabled]) .icon:not(.dropdown):not(.checkmark){color:var(--spectrum-dropdown-icon-color-disabled,var(--spectrum-global-color-gray-400))}:host([disabled]) #label.placeholder{color:var(--spectrum-dropdown-placeholder-text-color-disabled,var(--spectrum-global-color-gray-500))}#label.placeholder:hover{color:var(--spectrum-dropdown-placeholder-text-color-hover,var(--spectrum-global-color-gray-900))}#label.placeholder:active{color:var(--spectrum-dropdown-placeholder-text-color-mouse-focus,var(--spectrum-global-color-gray-900))}#button:focus #label.placeholder{color:var(--spectrum-dropdown-placeholder-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button:focus .dropdown{color:var(--spectrum-dropdown-icon-color-key-focus,var(--spectrum-global-color-gray-900))}#button .icon:not(.dropdown),.icon{margin-top:0;margin-bottom:0;flex-shrink:0}sp-popover{width:100%}:host([quiet]){width:var(--spectrum-global-dimension-size-2400)}
+var(--spectrum-global-dimension-size-150)) + var(--spectrum-popover-border-size, 1px)))}#button:hover .dropdown{color:var(--spectrum-dropdown-icon-color-hover,var(--spectrum-global-color-gray-900))}#button.is-selected .placeholder{color:var(--spectrum-dropdown-placeholder-text-color-down,var(--spectrum-global-color-gray-900))}:host([invalid]) .icon:not(.dropdown):not(.checkmark){color:var(--spectrum-dropdown-validation-icon-color-error,var(--spectrum-global-color-red-600))}:host([disabled]) #button:hover .dropdown,:host([disabled]) .dropdown,:host([invalid][disabled]) .icon,:host([invalid][disabled]) .icon:not(.dropdown):not(.checkmark){color:var(--spectrum-dropdown-icon-color-disabled,var(--spectrum-global-color-gray-400))}:host([disabled]) #label.placeholder{color:var(--spectrum-dropdown-placeholder-text-color-disabled,var(--spectrum-global-color-gray-500))}#label.placeholder:hover{color:var(--spectrum-dropdown-placeholder-text-color-hover,var(--spectrum-global-color-gray-900))}#label.placeholder:active{color:var(--spectrum-dropdown-placeholder-text-color-mouse-focus,var(--spectrum-global-color-gray-900))}#button:focus #label.placeholder{color:var(--spectrum-dropdown-placeholder-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button:focus .dropdown{color:var(--spectrum-dropdown-icon-color-key-focus,var(--spectrum-global-color-gray-900))}sp-popover{width:100%}#label~.dropdown{margin-left:var(--spectrum-dropdown-icon-gap,var(--spectrum-global-dimension-size-100))}
 `;
 export default styles;

src/dropdown.ts

@@ -27,2 +27,4 @@ /*
 import fieldButtonStyles from '@spectrum-web-components/button/lib/field-button.css.js';
+import alertSmallStyles from '@spectrum-web-components/icon/lib/spectrum-icon-alert-small.css.js';
+import chevronDownMediumStyles from '@spectrum-web-components/icon/lib/spectrum-icon-chevron-down-medium.css.js';
 
@@ -46,3 +48,9 @@ import { Focusable } from '@spectrum-web-components/shared/lib/focusable.js';
     public static get styles(): CSSResultArray {
-        return [actionButtonStyles, fieldButtonStyles, dropdownStyles];
+        return [
+            actionButtonStyles,
+            fieldButtonStyles,
+            dropdownStyles,
+            alertSmallStyles,
+            chevronDownMediumStyles,
+        ];
     }
@@ -197,3 +205,3 @@
                           <sp-icon
-                              class="icon"
+                              class="icon alert-small"
                               name="ui:AlertSmall"
@@ -205,3 +213,3 @@ size="s"
                 <sp-icon
-                    class="icon dropdown"
+                    class="icon dropdown chevron-down-medium"
                     name="ui:ChevronDownMedium"
@@ -208,0 +216,0 @@ size="s"

New alerts

License Policy Violation

License

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

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

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

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

94943

increased by1.09%

Lines of code

1056

increased by0.96%

Worsened metrics

Dependency count

10

increased by11.11%

Dependency changes

• + Addedtslib@^1.10.0

• - Removed@spectrum-web-components/button@0.1.3(transitive)

• - Removed@spectrum-web-components/icon@0.1.3(transitive)

• Updated@spectrum-web-components/button@^0.2.0

• Updated@spectrum-web-components/icon@^0.2.0

• Updated@spectrum-web-components/icons@^0.1.4

• Updated@spectrum-web-components/menu@^0.1.4

• Updated@spectrum-web-components/menu-item@^0.1.4

• Updated@spectrum-web-components/popover@^0.1.4

• Updated@spectrum-web-components/shared@^0.1.4