Skip to content
This repository was archived by the owner on Nov 19, 2024. It is now read-only.

Commit c66d513

Browse files
Burlacu Vasiliierikmarr
Burlacu Vasilii
andcommitted
Editorial changes
Co-Authored-By: Erik Marr <45772211+erikmarr@users.noreply.github.com> Co-Authored-By: Erik Marr <45772211+erikmarr@users.noreply.github.com> Co-Authored-By: Erik Marr <45772211+erikmarr@users.noreply.github.com> Co-Authored-By: Erik Marr <45772211+erikmarr@users.noreply.github.com> Co-Authored-By: Erik Marr <45772211+erikmarr@users.noreply.github.com> Co-Authored-By: Erik Marr <45772211+erikmarr@users.noreply.github.com> Co-Authored-By: Erik Marr <45772211+erikmarr@users.noreply.github.com> Co-Authored-By: Erik Marr <45772211+erikmarr@users.noreply.github.com> Co-Authored-By: Erik Marr <45772211+erikmarr@users.noreply.github.com>
1 parent ffe02d5 commit c66d513

File tree

1 file changed

+15
-22
lines changed

1 file changed

+15
-22
lines changed

guides/v2.2/javascript-dev-guide/widgets/widget_dropdown.md

Lines changed: 15 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -9,21 +9,20 @@ functional_areas:
99

1010
## Overview
1111

12-
Widget source file is [lib/web/mage/dropdowns.js].
12+
Use the dropdown widget to display custom content on the storefront.
1313

14-
The dropdown widget allows to show on storefront a select box with custom
15-
content for each of available options.
14+
Widget source file is [lib/web/mage/dropdowns.js].
1615

1716

1817
**Usages:**
1918
- [Shipping policy]
2019
- [Customer menu]
21-
- [UI Tooltip]
20+
- [UI tooltip]
2221

2322
[lib/web/mage/dropdowns.js]: {{ site.mage2bloburl }}/{{ page.guide_version }}/lib/web/mage/dropdowns.js
2423
[Shipping policy]: {{ site.mage2bloburl }}/{{ page.guide_version }}/app/code/Magento/Shipping/view/frontend/web/template/checkout/shipping/shipping-policy.html
2524
[Customer menu]: {{ site.mage2bloburl }}/{{ page.guide_version }}/app/code/Magento/Customer/view/frontend/templates/account/customer.phtml
26-
[UI Tooltip]: {{ site.mage2bloburl }}/{{ page.guide_version }}/app/code/Magento/Ui/view/frontend/web/templates/form/element/helper/tooltip.html
25+
[UI tooltip]: {{ site.mage2bloburl }}/{{ page.guide_version }}/app/code/Magento/Ui/view/frontend/web/templates/form/element/helper/tooltip.html
2726

2827
### HTML markup
2928

@@ -48,8 +47,7 @@ content for each of available options.
4847

4948
### Styles
5049

51-
The dropdown widget is not styled out of the box.
52-
Use [LESS mixin `.lib-dropdown()`] to customize it.
50+
Because the dropdown widget is not formatted by default, use [LESS mixin `.lib-dropdown()`] to customize it.
5351

5452
```less
5553
//
@@ -105,7 +103,7 @@ Use [LESS mixin `.lib-dropdown()`] to customize it.
105103

106104
## Initialize the dropdown widget {#dropdown_init}
107105

108-
The loader widget is initialized as described in [JavaScript initialization].
106+
The dropdown widget is initialized as described in [JavaScript initialization]({{ page.baseurl }}/javascript-dev-guide/javascript/js_init.html).
109107

110108
### Initialize with `data-mage-init` attribute
111109

@@ -136,10 +134,9 @@ $('.magento__dropdown-widget').dropdown();
136134
- [activeClass](#d_activeClass)
137135

138136

139-
### `parent` {#d_parent}
137+
### `parent` {#d_parent}
140138

141-
The parent of element on which the widget was initialized. If not specified,
142-
the widget finds it himself with jQuery method `.parent()`.
139+
The parent element that initialized the widget. If not specified, the widget locates the element using the `.parent()` jQuery method.
143140

144141
**Type**:
145142

@@ -150,38 +147,34 @@ the widget finds it himself with jQuery method `.parent()`.
150147
**Default value**: `null`
151148

152149

153-
### `autoclose` {#d_autoclose}
150+
### `autoclose` {#d_autoclose}
154151

155-
Whenever to close or not the dropdown menu when the click is performed outside of dropdown scope.
152+
Determines whether to close the dropdown menu when the user clicks outside of the dropdown scope.
156153

157154
**Type**: Boolean
158155

159156
**Default value**: `true`
160157

161158

162-
### `btnArrow` {#d_btnArrow}
159+
### `btnArrow` {#d_btnArrow}
163160

164-
A jQuery selector for the arrow that expresses the state of the dropdown.
165-
The widget changes given element's text to '+' or '-", depending on the dropdown state.
166-
It's not required the element to be present in the dropdown HTML markup. It works
167-
just fine without it as well.
161+
(Optional) A jQuery selector that updates the arrow to `+` or `-` based on the state of the dropdown.
168162

169163
**Type**: String
170164

171165
**Default value**: `.arrow`
172166

173167

174-
### `menu` {#d_menu}
168+
### `menu` {#d_menu}
175169

176-
A jQuery selector that represents the dropdown's menu element.
177-
Looking at the HTML markup, given element has to be inside the `parent` option.
170+
A jQuery selector that represents the dropdown's menu element. `menu` must be inside the `parent` element.
178171

179172
**Type**: String
180173

181174
**Default value**: `[data-target="dropdown"]`
182175

183176

184-
### `activeClass` {#d_activeClass}
177+
### `activeClass` {#d_activeClass}
185178

186179
Given class is added to the widget element when the menu is visible.
187180

0 commit comments

Comments
 (0)