clay-dropdown - npm Package Compare versions

Comparing version 2.0.0-rc.3 to 2.0.0-rc.4

lib/ClayActionsDropdown.js

@@ -70,3 +70,3 @@ 'use strict';
    * Continues the propagation of the item clicked event
-   * @param {!Event} event
+   * @param {!Object} item
    * @protected
@@ -77,4 +77,4 @@ */
 		key: '_handleItemClick',
-		value: function _handleItemClick(event) {
-			this.emit('itemClicked', event);
+		value: function _handleItemClick(item) {
+			this.emit('itemClicked', item);
 		}
@@ -81,0 +81,0 @@ }]);

lib/ClayDropdown.js

@@ -70,3 +70,3 @@ 'use strict';
    * Continues the propagation of the item clicked event
-   * @param {!Event} event
+   * @param {!Object} item
    * @protected
@@ -77,4 +77,4 @@ */
 		key: '_handleItemClick',
-		value: function _handleItemClick(event) {
-			this.emit('itemClicked', event);
+		value: function _handleItemClick(item) {
+			this.emit('itemClicked', item);
 		}
@@ -81,0 +81,0 @@ }]);

lib/ClayDropdownBase.js

@@ -122,2 +122,17 @@ 'use strict';
 		/**
+   * Returns the dropdown index of the element.
+   * @param {!Node} element
+   * @return {?array|undefined} the index.
+   * @private
+   */
+
+	}, {
+		key: '_getDropdownItemIndex',
+		value: function _getDropdownItemIndex(element) {
+			return Array.prototype.indexOf.call(Array.prototype.filter.call(element.parentElement.children, function (childrenElement) {
+				return childrenElement.getAttribute('role') !== 'presentation';
+			}), element);
+		}
+
+		/**
    * Handles document click in order to hide menu.
@@ -158,3 +173,7 @@ * @param {!Event} event
 		value: function _handleItemClick(event) {
-			this.emit('itemClicked', event);
+			var element = event.delegateTarget;
+			var elementIndex = this._getDropdownItemIndex(element);
+			var item = this.items[elementIndex];
+
+			this.emit('itemClicked', item);
 		}
@@ -161,0 +180,0 @@

lib/items_validator.js

@@ -16,2 +16,3 @@ 'use strict';
 	icon: _metalState.Config.string(),
+	id: _metalState.Config.string(),
 	inputName: _metalState.Config.string(),
@@ -18,0 +19,0 @@ inputValue: _metalState.Config.string(),

package.json

 {
   "name": "clay-dropdown",
-  "version": "2.0.0-rc.3",
+  "version": "2.0.0-rc.4",
   "description": "Clay Dropdown Component",
@@ -30,8 +30,8 @@ "license": "BSD",
   "dependencies": {
-    "clay-button": "^2.0.0-rc.3",
-    "clay-checkbox": "^2.0.0-rc.3",
-    "clay-icon": "^2.0.0-rc.3",
-    "clay-link": "^2.0.0-rc.3",
-    "clay-portal": "^2.0.0-rc.3",
-    "clay-radio": "^2.0.0-rc.3",
+    "clay-button": "^2.0.0-rc.4",
+    "clay-checkbox": "^2.0.0-rc.4",
+    "clay-icon": "^2.0.0-rc.4",
+    "clay-link": "^2.0.0-rc.4",
+    "clay-portal": "^2.0.0-rc.4",
+    "clay-radio": "^2.0.0-rc.4",
     "metal": "^2.16.0",
@@ -53,3 +53,3 @@ "metal-component": "^2.16.0",
     "browserslist-config-clay-components": "^2.0.0-rc.3",
-    "clay": "^2.0.0-rc.3",
+    "clay": "^2.0.0-rc.4",
     "metal-dom": "^2.13.2",
@@ -56,0 +56,0 @@ "metal-tools-soy": "^6.0.0",

src/ClayActionsDropdown.js

@@ -26,7 +26,7 @@ import 'clay-icon';
 	 * Continues the propagation of the item clicked event
-	 * @param {!Event} event
+	 * @param {!Object} item
 	 * @protected
 	 */
-	_handleItemClick(event) {
-		this.emit('itemClicked', event);
+	_handleItemClick(item) {
+		this.emit('itemClicked', item);
 	}
@@ -33,0 +33,0 @@ }

src/ClayDropdown.js

@@ -26,7 +26,7 @@ import 'clay-icon';
 	 * Continues the propagation of the item clicked event
-	 * @param {!Event} event
+	 * @param {!Object} item
 	 * @protected
 	 */
-	_handleItemClick(event) {
-		this.emit('itemClicked', event);
+	_handleItemClick(item) {
+		this.emit('itemClicked', item);
 	}
@@ -33,0 +33,0 @@ }

src/ClayDropdownBase.js

@@ -62,2 +62,19 @@ import 'clay-button';
 	/**
+	 * Returns the dropdown index of the element.
+	 * @param {!Node} element
+	 * @return {?array|undefined} the index.
+	 * @private
+	 */
+	_getDropdownItemIndex(element) {
+		return Array.prototype.indexOf.call(
+			Array.prototype.filter.call(
+				element.parentElement.children,
+				childrenElement =>
+					childrenElement.getAttribute('role') !== 'presentation'
+			),
+			element
+		);
+	}
+
+	/**
 	 * Handles document click in order to hide menu.
@@ -93,3 +110,7 @@ * @param {!Event} event
 	_handleItemClick(event) {
-		this.emit('itemClicked', event);
+		let element = event.delegateTarget;
+		let elementIndex = this._getDropdownItemIndex(element);
+		let item = this.items[elementIndex];
+
+		this.emit('itemClicked', item);
 	}
@@ -96,0 +117,0 @@

src/items_validator.js

@@ -9,2 +9,3 @@ import {Config} from 'metal-state';
 	icon: Config.string(),
+	id: Config.string(),
 	inputName: Config.string(),
@@ -11,0 +12,0 @@ inputValue: Config.string(),

No alert changes

Improved metrics

Total package byte prevSize

462259

increased by0.51%

Lines of code

4652

increased by0.8%

Dependency changes

• Updatedclay-button@^2.0.0-rc.4

• Updatedclay-checkbox@^2.0.0-rc.4

• Updatedclay-icon@^2.0.0-rc.4

• Updatedclay-link@^2.0.0-rc.4

• Updatedclay-portal@^2.0.0-rc.4

• Updatedclay-radio@^2.0.0-rc.4