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

Comparing version 0.1.4 to 0.2.0

CHANGELOG.md

@@ -6,2 +6,10 @@ # Change Log
 
+# [0.2.0](https://github.com/adobe/spectrum-web-components/compare/@spectrum-web-components/dropdown@0.1.4...@spectrum-web-components/dropdown@0.2.0) (2019-10-16)
+
+### Features
+
+-   **dropdown:** add 'selectedItemText', acquire 'value' from menu-item ([ee991af](https://github.com/adobe/spectrum-web-components/commit/ee991af))
+-   **dropdown:** check open in fixture in tests ([02c0b9d](https://github.com/adobe/spectrum-web-components/commit/02c0b9d))
+-   **dropdown:** pull request changes ([661165b](https://github.com/adobe/spectrum-web-components/commit/661165b))
+
 ## [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)
@@ -8,0 +16,0 @@

lib/dropdown.d.ts

@@ -22,2 +22,3 @@ import { PropertyValues, CSSResultArray, TemplateResult } from 'lit-element';
     value: string;
+    selectedItemText: string;
     protected listRole: string;
@@ -24,0 +25,0 @@ protected itemRole: string;

lib/dropdown.js

@@ -39,2 +39,3 @@ /*
         this.value = '';
+        this.selectedItemText = '';
         this.listRole = 'listbox';
@@ -72,2 +73,5 @@ this.itemRole = 'option';
         this.optionsMenu = this.querySelector('sp-menu');
+        if (this.value) {
+            this.requestUpdate('value');
+        }
     }
@@ -119,4 +123,6 @@ onButtonBlur() {
     setValueFromItem(item) {
+        const oldSelectedItemText = this.selectedItemText;
         const oldValue = this.value;
-        this.value = (item.textContent || /* istanbul ignore next */ '').trim();
+        this.selectedItemText = item.itemText;
+        this.value = item.value;
         const applyDefault = this.dispatchEvent(new Event('change', {
@@ -126,2 +132,3 @@ cancelable: true,
         if (!applyDefault) {
+            this.selectedItemText = oldSelectedItemText;
             this.value = oldValue;
@@ -149,3 +156,3 @@ return;
                     ${this.value
-                ? this.value
+                ? this.selectedItemText
                 : html `
@@ -196,2 +203,16 @@ <slot></slot>
         super.updated(changedProperties);
+        if (changedProperties.has('value') && this.optionsMenu) {
+            const items = [
+                ...this.optionsMenu.querySelectorAll(`[role=${this.optionsMenu.childRole}]`),
+            ];
+            const selectedItem = items.find((item) => this.value === item.value);
+            if (selectedItem) {
+                selectedItem.selected = true;
+                this.selectedItemText = selectedItem.itemText;
+            }
+            else {
+                this.value = '';
+                this.selectedItemText = '';
+            }
+        }
         if (changedProperties.has('disabled') && this.disabled) {
@@ -229,2 +250,5 @@ this.open = false;
 ], Dropdown.prototype, "value", void 0);
+__decorate([
+    property({ type: String })
+], Dropdown.prototype, "selectedItemText", void 0);
 //# sourceMappingURL=dropdown.js.map

package.json

@@ -21,3 +21,3 @@ {
     ],
-    "version": "0.1.4",
+    "version": "0.2.0",
     "description": "",
@@ -40,7 +40,7 @@ "main": "lib/index.js",
     "dependencies": {
-        "@spectrum-web-components/button": "^0.2.0",
+        "@spectrum-web-components/button": "^0.2.1",
         "@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/menu-item": "^0.2.0",
         "@spectrum-web-components/popover": "^0.1.4",
@@ -50,3 +50,3 @@ "@spectrum-web-components/shared": "^0.1.4",
     },
-    "gitHead": "7c3e131bc2bc3b1195e736ff65d3c4e044590ace"
+    "gitHead": "75a470cca6e8e415c5e9868bc0b37314d61d1be5"
 }

src/dropdown.ts

@@ -76,2 +76,5 @@ /*
 
+    @property({ type: String })
+    public selectedItemText = '';
+
     protected listRole = 'listbox';
@@ -112,2 +115,5 @@ protected itemRole = 'option';
         this.optionsMenu = this.querySelector('sp-menu');
+        if (this.value) {
+            this.requestUpdate('value');
+        }
     }
@@ -163,6 +169,7 @@
     }
-
     public setValueFromItem(item: MenuItem): void {
+        const oldSelectedItemText = this.selectedItemText;
         const oldValue = this.value;
-        this.value = (item.textContent || /* istanbul ignore next */ '').trim();
+        this.selectedItemText = item.itemText;
+        this.value = item.value;
         const applyDefault = this.dispatchEvent(
@@ -174,2 +181,3 @@ new Event('change', {
         if (!applyDefault) {
+            this.selectedItemText = oldSelectedItemText;
             this.value = oldValue;
@@ -199,3 +207,3 @@ return;
                     ${this.value
-                        ? this.value
+                        ? this.selectedItemText
                         : html`
@@ -248,2 +256,19 @@ <slot></slot>
         super.updated(changedProperties);
+        if (changedProperties.has('value') && this.optionsMenu) {
+            const items = [
+                ...this.optionsMenu.querySelectorAll(
+                    `[role=${this.optionsMenu.childRole}]`
+                ),
+            ] as MenuItem[];
+            const selectedItem = items.find(
+                (item) => this.value === item.value
+            ) as MenuItem;
+            if (selectedItem) {
+                selectedItem.selected = true;
+                this.selectedItemText = selectedItem.itemText;
+            } else {
+                this.value = '';
+                this.selectedItemText = '';
+            }
+        }
         if (changedProperties.has('disabled') && this.disabled) {
@@ -250,0 +275,0 @@ this.open = false;

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

99035

increased by4.31%

Lines of code

1106

increased by4.73%

Dependency changes

• + Added@spectrum-web-components/icon@0.3.0(transitive)

• + Added@spectrum-web-components/menu-item@0.2.1(transitive)

• - Removed@spectrum-web-components/menu-item@0.1.4(transitive)

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

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