@@ -4,8 +4,14 @@ import events from "./events";
4
4
const DATA_PREFIX = "__patternslib__data_prefix__" ;
5
5
const DATA_STYLE_DISPLAY = "__patternslib__style__display" ;
6
6
7
+ /**
8
+ * Return an array of DOM nodes.
9
+ *
10
+ * @param {Node|NodeList|jQuery } nodes - The DOM node to start the search from.
11
+ *
12
+ * @returns {Array } - An array of DOM nodes.
13
+ */
7
14
const toNodeArray = ( nodes ) => {
8
- // Return an array of DOM nodes
9
15
if ( nodes . jquery || nodes instanceof NodeList ) {
10
16
// jQuery or document.querySelectorAll
11
17
nodes = [ ...nodes ] ;
@@ -15,10 +21,15 @@ const toNodeArray = (nodes) => {
15
21
return nodes ;
16
22
} ;
17
23
24
+ /**
25
+ * Like querySelectorAll but including the element where it starts from.
26
+ * Returns an Array, not a NodeList
27
+ *
28
+ * @param {Node } el - The DOM node to start the search from.
29
+ *
30
+ * @returns {Array } - The DOM nodes found.
31
+ */
18
32
const querySelectorAllAndMe = ( el , selector ) => {
19
- // Like querySelectorAll but including the element where it starts from.
20
- // Returns an Array, not a NodeList
21
-
22
33
if ( ! el ) {
23
34
return [ ] ;
24
35
}
@@ -30,16 +41,23 @@ const querySelectorAllAndMe = (el, selector) => {
30
41
return all ;
31
42
} ;
32
43
44
+ /**
45
+ * Wrap a element with a wrapper element.
46
+ *
47
+ * @param {Node } el - The DOM node to wrap.
48
+ */
33
49
const wrap = ( el , wrapper ) => {
34
- // Wrap a element with a wrapper element.
35
50
// See: https://stackoverflow.com/a/13169465/1337474
36
-
37
51
el . parentNode . insertBefore ( wrapper , el ) ;
38
52
wrapper . appendChild ( el ) ;
39
53
} ;
40
54
55
+ /**
56
+ * Hides the element with ``display: none`` and stores the current display value.
57
+ *
58
+ * @param {Node } el - The DOM node to hide.
59
+ */
41
60
const hide = ( el ) => {
42
- // Hides the element with ``display: none``
43
61
if ( el . style . display === "none" ) {
44
62
// Nothing to do.
45
63
return ;
@@ -51,38 +69,65 @@ const hide = (el) => {
51
69
el . setAttribute ( "hidden" , "" ) ;
52
70
} ;
53
71
72
+ /**
73
+ * Shows element by removing ``display: none`` and restoring the display value
74
+ * to whatever it was before.
75
+ *
76
+ * @param {Node } el - The DOM node to show.
77
+ */
54
78
const show = ( el ) => {
55
- // Shows element by removing ``display: none`` and restoring the display
56
- // value to whatever it was before.
57
79
const val = el [ DATA_STYLE_DISPLAY ] || null ;
58
80
el . style . display = val ;
59
81
delete el [ DATA_STYLE_DISPLAY ] ;
60
82
el . removeAttribute ( "hidden" , "" ) ;
61
83
} ;
62
84
85
+ /**
86
+ * Return all direct parents of ``el`` matching ``selector``.
87
+ * This matches against all parents but not the element itself.
88
+ * The order of elements is from the search starting point up to higher
89
+ * DOM levels.
90
+ *
91
+ * @param {Node } el - The DOM node to start the search from.
92
+ * @param {String } selector - CSS selector to match against.
93
+ * @returns {Array } - List of matching DOM nodes.
94
+ */
63
95
const find_parents = ( el , selector ) => {
64
- // Return all direct parents of ``el`` matching ``selector``.
65
- // This matches against all parents but not the element itself.
66
- // The order of elements is from the search starting point up to higher
67
- // DOM levels.
68
96
const ret = [ ] ;
69
- let parent = el ?. parentNode ?. closest ?. ( selector ) ;
97
+ let parent = el ;
70
98
while ( parent ) {
71
- ret . push ( parent ) ;
72
99
parent = parent . parentNode ?. closest ?. ( selector ) ;
100
+ if ( parent ) ret . push ( parent ) ;
73
101
}
74
102
return ret ;
75
103
} ;
76
104
105
+ /**
106
+ * Find an element in the whole DOM tree if the selector is an ID selector,
107
+ * otherwise use the given element as the starting point.
108
+ *
109
+ * @param {Node } el - The DOM node to start the search from.
110
+ * @param {String } selector - The CSS selector to search for.
111
+ *
112
+ * @returns {NodeList } - The DOM nodes found.
113
+ *
114
+ */
77
115
const find_scoped = ( el , selector ) => {
78
116
// If the selector starts with an object id do a global search,
79
117
// otherwise do a local search.
80
118
return ( selector . indexOf ( "#" ) === 0 ? document : el ) . querySelectorAll ( selector ) ;
81
119
} ;
82
120
121
+ /**
122
+ * Return all HTMLElement parents of el, starting from the direct parent of el.
123
+ * The document itself is excluded because it's not a real DOM node.
124
+ *
125
+ * @param {Node } el - The DOM node to start the search from.
126
+ *
127
+ * @returns {Array } - The DOM nodes found.
128
+ */
83
129
const get_parents = ( el ) => {
84
130
// Return all HTMLElement parents of el, starting from the direct parent of el.
85
- // The document itself is excluded because it's not a real DOM node.
86
131
const parents = [ ] ;
87
132
let parent = el ?. parentNode ;
88
133
while ( parent ) {
@@ -211,7 +256,7 @@ const find_scroll_container = (el, direction, fallback = document.body) => {
211
256
* @param name {String} - The name of the variable. Note - this is stored on
212
257
* the DOM node prefixed with the DATA_PREFIX.
213
258
* @param default_value {Any} - Optional default value.
214
- * @return {Any } - The value which is stored on the DOM node.
259
+ * @returns {Any } - The value which is stored on the DOM node.
215
260
*/
216
261
const get_data = ( el , name , default_value ) => {
217
262
return el [ `${ DATA_PREFIX } ${ name } ` ] || default_value ;
0 commit comments