@d3plus/dom 3.0.16 → 3.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2026 D3plus
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md CHANGED
@@ -1,5 +1,8 @@
1
1
  # @d3plus/dom
2
-
2
+
3
+ [![NPM version](https://img.shields.io/npm/v/@d3plus/dom.svg)](https://www.npmjs.com/package/@d3plus/dom)
4
+ [![codecov](https://codecov.io/gh/d3plus/d3plus/graph/badge.svg?flag=dom)](https://codecov.io/gh/d3plus/d3plus/flags)
5
+
3
6
  JavaScript functions for manipulating and analyzing DOM elements.
4
7
 
5
8
  ## Installing
@@ -7,10 +10,10 @@ JavaScript functions for manipulating and analyzing DOM elements.
7
10
  If using npm, `npm install @d3plus/dom`. Otherwise, you can download the [latest release from GitHub](https://github.com/d3plus/d3plus/releases/latest) or load from a [CDN](https://cdn.jsdelivr.net/npm/@d3plus/dom).
8
11
 
9
12
  ```js
10
- import modules from "@d3plus/dom";
13
+ import {*} from "@d3plus/dom";
11
14
  ```
12
15
 
13
- In vanilla JavaScript, a `d3plus` global is exported from the pre-bundled version:
16
+ In a vanilla environment, a `d3plus` global is exported from the pre-bundled version:
14
17
 
15
18
  ```html
16
19
  <script src="https://cdn.jsdelivr.net/npm/@d3plus/dom"></script>
@@ -21,154 +24,329 @@ In vanilla JavaScript, a `d3plus` global is exported from the pre-bundled versio
21
24
 
22
25
  ## Examples
23
26
 
24
- Live examples can be found on [d3plus.org](https://d3plus.org/), which includes a collection of example visualizations using @d3plus/react.
27
+ Live examples can be found on [d3plus.org](https://d3plus.org/), which includes a collection of example visualizations using [@d3plus/react](https://github.com/d3plus/d3plus/tree/main/packages/react).
25
28
 
26
29
  ## API Reference
27
30
 
28
- #####
29
- * [assign](#assign) - A deeply recursive version of `Object.assign`.
30
- * [attrize](#attrize) - Applies each key/value in an object as an attr.
31
- * [date](#date) - Parses numbers and strings to valid Javascript Date objects.
32
- * [elem](#elem) - Manages the enter/update/exit pattern for a single DOM element.
33
- * [fontExists](#fontExists) - Given either a single font-family or a list of fonts, returns the name of the first font that can be rendered, or `false` if none are installed on the user's machine.
34
- * [isObject](#isObject) - Detects if a variable is a javascript Object.
35
- * [parseSides](#parseSides) - Converts a string of directional CSS shorthand values into an object with the values expanded.
36
- * [prefix](#prefix) - Returns the appropriate CSS vendor prefix, given the current browser.
37
- * [rtl](#rtl) - Returns `true` if the HTML or body element has either the "dir" HTML attribute or the "direction" CSS property set to "rtl".
38
- * [stylize](#stylize) - Applies each key/value in an object as a style.
39
- * [htmlDecode](#htmlDecode) - Strips HTML and "un-escapes" escape characters.
40
- * [textWidth](#textWidth) - Given a text string, returns the predicted pixel width of the string when placed into DOM.
41
-
42
- ---
43
-
44
- <a name="assign"></a>
45
- #### d3plus.**assign**(...objects) [<>](https://github.com/d3plus/d3plus/blob/main/packages/dom/src/assign.js#L14)
31
+ | Functions | Description |
32
+ | --- | --- |
33
+ | [`assign`](#assign) | A deeply recursive version of `Object.assign`. |
34
+ | [`attrize`](#attrize) | Applies each key/value in an object as an attr. |
35
+ | [`backgroundColor`](#backgroundcolor) | Given a DOM element, returns its background color by walking up the |
36
+ | [`date`](#date) | Parses numbers and strings into valid JavaScript Date objects, supporting years, quarters, months, and ISO 8601 formats. |
37
+ | [`elem`](#elem) | Manages the enter/update/exit pattern for a single DOM element, applying enter, update, and exit attributes with optiona |
38
+ | [`fontExists`](#fontexists) | Given either a single font-family or a list of fonts, returns the name of the first font that can be rendered, or `false |
39
+ | [`inViewport`](#inviewport) | Determines whether a given DOM element is visible within the current viewport, with an optional pixel buffer. |
40
+ | [`isObject`](#isobject) | Detects if a variable is a javascript Object. |
41
+ | [`parseSides`](#parsesides) | Converts a string of directional CSS shorthand values into an object with the values expanded. |
42
+ | [`rtl`](#rtl) | Returns `true` if the HTML or body element has either the "dir" HTML attribute or the "direction" CSS property set to "r |
43
+ | [`stylize`](#stylize) | Applies each key/value in an object as a style. |
44
+ | [`textWidth`](#textwidth) | Given a text string, returns the predicted pixel width of the string when placed into DOM. |
45
+
46
+ | Type Aliases | Description |
47
+ | --- | --- |
48
+ | [`D3Selection`](#d3selection) | |
49
+
50
+ ## Functions
51
+
52
+ <a id="assign"></a>
53
+
54
+ ### assign()
55
+
56
+ > **assign**(...`objects`: `Record`\<`string`, `unknown`\>[]): `Record`\<`string`, `unknown`\>
57
+
58
+ Defined in: [assign.ts:21](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/assign.ts#L21)
46
59
 
47
60
  A deeply recursive version of `Object.assign`.
48
61
 
62
+ #### Parameters
49
63
 
50
- This is a global function
51
- this
64
+ | Parameter | Type | Description |
65
+ | ------ | ------ | ------ |
66
+ | ...`objects` | `Record`\<`string`, `unknown`\>[] | The source objects to merge into the target. |
52
67
 
53
- ```js
68
+ #### Returns
69
+
70
+ `Record`\<`string`, `unknown`\>
71
+
72
+ #### Examples
73
+
74
+ ```ts
54
75
  assign({id: "foo", deep: {group: "A"}}, {id: "bar", deep: {value: 20}}));
55
-
56
76
  ```
57
- returns this
58
77
 
59
- ```js
78
+ ```ts
60
79
  {id: "bar", deep: {group: "A", value: 20}}
61
80
  ```
62
81
 
63
- ---
82
+ ***
83
+
84
+ <a id="attrize"></a>
85
+
86
+ ### attrize()
64
87
 
65
- <a name="attrize"></a>
66
- #### d3plus.**attrize**(elem, attrs) [<>](https://github.com/d3plus/d3plus/blob/main/packages/dom/src/attrize.js#L1)
88
+ > **attrize**(`e`: `Attrable`, `a?`: `Record`\<`string`, `string` \| `number` \| `boolean` \| `null`\>): `void`
89
+
90
+ Defined in: [attrize.ts:8](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/attrize.ts#L8)
67
91
 
68
92
  Applies each key/value in an object as an attr.
69
93
 
94
+ #### Parameters
95
+
96
+ | Parameter | Type | Description |
97
+ | ------ | ------ | ------ |
98
+ | `e` | `Attrable` | The d3 selection to apply attributes to. |
99
+ | `a` | `Record`\<`string`, `string` \| `number` \| `boolean` \| `null`\> | An object of key/value attr pairs. |
100
+
101
+ #### Returns
102
+
103
+ `void`
104
+
105
+ ***
106
+
107
+ <a id="backgroundcolor"></a>
108
+
109
+ ### backgroundColor()
110
+
111
+ > **backgroundColor**(`elem`: `Element`): `string`
112
+
113
+ Defined in: [backgroundColor.ts:7](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/backgroundColor.ts#L7)
114
+
115
+ Given a DOM element, returns its background color by walking up the
116
+ ancestor chain until a non-transparent background is found. Falls back
117
+ to "rgb(255, 255, 255)" (white) if every ancestor is transparent.
118
+
119
+ #### Parameters
120
+
121
+ | Parameter | Type | Description |
122
+ | ------ | ------ | ------ |
123
+ | `elem` | `Element` | The DOM element to check. |
124
+
125
+ #### Returns
126
+
127
+ `string`
128
+
129
+ ***
130
+
131
+ <a id="date"></a>
132
+
133
+ ### date()
134
+
135
+ > **date**(`d`: `string` \| `number` \| `false` \| `undefined`): `false` \| `Date` \| `undefined`
136
+
137
+ Defined in: [date.ts:5](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/date.ts#L5)
138
+
139
+ Parses numbers and strings into valid JavaScript Date objects, supporting years, quarters, months, and ISO 8601 formats.
140
+
141
+ #### Parameters
142
+
143
+ | Parameter | Type | Description |
144
+ | ------ | ------ | ------ |
145
+ | `d` | `string` \| `number` \| `false` \| *required* | The date value to parse (number, string, or Date). |
146
+
147
+ #### Returns
148
+
149
+ `false` \| `Date` \| `undefined`
70
150
 
71
- This is a global function
151
+ ***
72
152
 
73
- ---
153
+ <a id="elem"></a>
74
154
 
75
- <a name="date"></a>
76
- #### d3plus.**date**(*date*) [<>](https://github.com/d3plus/d3plus/blob/main/packages/dom/src/date.js#L1)
155
+ ### elem()
77
156
 
78
- Returns a javascript Date object for a given a Number (representing either a 4-digit year or milliseconds since epoch), a String representing a Quarter (ie. "Q2 1987", mapping to the last day in that quarter), or a String that is in [valid dateString format](http://dygraphs.com/date-formats.html). Besides the 4-digit year parsing, this function is useful when needing to parse negative (BC) years, which the vanilla Date object cannot parse.
157
+ > **elem**(`selector`: `string`, `p?`: `ElemParams`): `Selection`
79
158
 
159
+ Defined in: [elem.ts:28](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/elem.ts#L28)
80
160
 
81
- This is a global function
161
+ Manages the enter/update/exit pattern for a single DOM element, applying enter, update, and exit attributes with optional transitions.
82
162
 
83
- ---
163
+ #### Parameters
84
164
 
85
- <a name="elem"></a>
86
- #### d3plus.**elem**(selector, params) [<>](https://github.com/d3plus/d3plus/blob/main/packages/dom/src/elem.js#L6)
165
+ | Parameter | Type | Description |
166
+ | ------ | ------ | ------ |
167
+ | `selector` | `string` | A CSS selector string for the element tag and classes. |
168
+ | `p?` | `ElemParams` | Configuration object with enter, exit, update, and parent options. |
87
169
 
88
- Manages the enter/update/exit pattern for a single DOM element.
170
+ #### Returns
89
171
 
172
+ `Selection`
90
173
 
91
- This is a global function
174
+ ***
92
175
 
93
- ---
176
+ <a id="fontexists"></a>
94
177
 
95
- <a name="fontExists"></a>
96
- #### d3plus.**fontExists**(font) [<>](https://github.com/d3plus/d3plus/blob/main/packages/dom/src/fontExists.js#L10)
178
+ ### fontExists()
179
+
180
+ > **fontExists**(`font`: `string` \| `string`[]): `string` \| `false`
181
+
182
+ Defined in: [fontExists.ts:13](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/fontExists.ts#L13)
97
183
 
98
184
  Given either a single font-family or a list of fonts, returns the name of the first font that can be rendered, or `false` if none are installed on the user's machine.
99
185
 
186
+ #### Parameters
187
+
188
+ | Parameter | Type | Description |
189
+ | ------ | ------ | ------ |
190
+ | `font` | `string` \| `string`[] | Can be either a valid CSS font-family string (single or comma-separated names) or an Array of string names. |
191
+
192
+ #### Returns
193
+
194
+ `string` \| `false`
195
+
196
+ ***
197
+
198
+ <a id="inviewport"></a>
199
+
200
+ ### inViewport()
201
+
202
+ > **inViewport**(`elem`: `Element`, `buffer?`: `number`): `boolean`
203
+
204
+ Defined in: [inViewport.ts:6](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/inViewport.ts#L6)
100
205
 
101
- This is a global function
206
+ Determines whether a given DOM element is visible within the current viewport, with an optional pixel buffer.
102
207
 
103
- ---
208
+ #### Parameters
104
209
 
105
- <a name="isObject"></a>
106
- #### d3plus.**isObject**(item) [<>](https://github.com/d3plus/d3plus/blob/main/packages/dom/src/isObject.js#L1)
210
+ | Parameter | Type | Default | Description |
211
+ | ------ | ------ | ------ | ------ |
212
+ | `elem` | `Element` | *required* | The DOM element to check. |
213
+ | `buffer` | `number` | `0` | Extra pixel margin around the viewport boundary. |
214
+
215
+ #### Returns
216
+
217
+ `boolean`
218
+
219
+ ***
220
+
221
+ <a id="isobject"></a>
222
+
223
+ ### isObject()
224
+
225
+ > **isObject**(`item`: `unknown`): `boolean`
226
+
227
+ Defined in: [isObject.ts:5](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/isObject.ts#L5)
107
228
 
108
229
  Detects if a variable is a javascript Object.
109
230
 
231
+ #### Parameters
232
+
233
+ | Parameter | Type | Description |
234
+ | ------ | ------ | ------ |
235
+ | `item` | `unknown` | The value to test. |
236
+
237
+ #### Returns
110
238
 
111
- This is a global function
239
+ `boolean`
112
240
 
113
- ---
241
+ ***
114
242
 
115
- <a name="parseSides"></a>
116
- #### d3plus.**parseSides**(sides) [<>](https://github.com/d3plus/d3plus/blob/main/packages/dom/src/parseSides.js#L1)
243
+ <a id="parsesides"></a>
244
+
245
+ ### parseSides()
246
+
247
+ > **parseSides**(`sides`: `string` \| `number`): `ParsedSides`
248
+
249
+ Defined in: [parseSides.ts:12](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/parseSides.ts#L12)
117
250
 
118
251
  Converts a string of directional CSS shorthand values into an object with the values expanded.
119
252
 
253
+ #### Parameters
120
254
 
121
- This is a global function
255
+ | Parameter | Type | Description |
256
+ | ------ | ------ | ------ |
257
+ | `sides` | `string` \| `number` | The CSS shorthand string to expand. |
122
258
 
123
- ---
259
+ #### Returns
124
260
 
125
- <a name="prefix"></a>
126
- #### d3plus.**prefix**() [<>](https://github.com/d3plus/d3plus/blob/main/packages/dom/src/prefix.js#L1)
261
+ `ParsedSides`
127
262
 
128
- Returns the appropriate CSS vendor prefix, given the current browser.
263
+ ***
129
264
 
265
+ <a id="rtl"></a>
130
266
 
131
- This is a global function
267
+ ### rtl()
132
268
 
133
- ---
269
+ > **rtl**(): `boolean`
134
270
 
135
- <a name="rtl"></a>
136
- #### d3plus.**rtl**() [<>](https://github.com/d3plus/d3plus/blob/main/packages/dom/src/rtl.js#L3)
271
+ Defined in: [rtl.ts:4](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/rtl.ts#L4)
137
272
 
138
273
  Returns `true` if the HTML or body element has either the "dir" HTML attribute or the "direction" CSS property set to "rtl".
139
274
 
275
+ #### Returns
276
+
277
+ `boolean`
278
+
279
+ ***
140
280
 
141
- This is a global function
281
+ <a id="stylize"></a>
142
282
 
143
- ---
283
+ ### stylize()
144
284
 
145
- <a name="stylize"></a>
146
- #### d3plus.**stylize**(elem, styles) [<>](https://github.com/d3plus/d3plus/blob/main/packages/dom/src/stylize.js#L1)
285
+ > **stylize**(`e`: `Stylable`, `s?`: `Record`\<`string`, `string` \| `number` \| `boolean` \| `null`\>): `void`
286
+
287
+ Defined in: [stylize.ts:8](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/stylize.ts#L8)
147
288
 
148
289
  Applies each key/value in an object as a style.
149
290
 
291
+ #### Parameters
292
+
293
+ | Parameter | Type | Description |
294
+ | ------ | ------ | ------ |
295
+ | `e` | `Stylable` | The d3 selection to apply styles to. |
296
+ | `s` | `Record`\<`string`, `string` \| `number` \| `boolean` \| `null`\> | An object of key/value style pairs. |
150
297
 
151
- This is a global function
298
+ #### Returns
152
299
 
153
- ---
300
+ `void`
154
301
 
155
- <a name="htmlDecode"></a>
156
- #### d3plus.**htmlDecode**(input) [<>](https://github.com/d3plus/d3plus/blob/main/packages/dom/src/textWidth.js#L5)
302
+ ***
157
303
 
158
- Strips HTML and "un-escapes" escape characters.
304
+ <a id="textwidth"></a>
159
305
 
306
+ ### textWidth()
160
307
 
161
- This is a global function
308
+ #### Call Signature
162
309
 
163
- ---
310
+ > **textWidth**(`text`: `string`, `style?`: `Record`\<`string`, `string` \| `number`\>): `number`
164
311
 
165
- <a name="textWidth"></a>
166
- #### d3plus.**textWidth**(text, [style]) [<>](https://github.com/d3plus/d3plus/blob/main/packages/dom/src/textWidth.js#L12)
312
+ Defined in: [textWidth.ts:49](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/textWidth.ts#L49)
167
313
 
168
314
  Given a text string, returns the predicted pixel width of the string when placed into DOM.
169
315
 
316
+ ##### Parameters
317
+
318
+ | Parameter | Type | Description |
319
+ | ------ | ------ | ------ |
320
+ | `text` | `string` | The text string to measure. |
321
+ | `style?` | `Record`\<`string`, `string` \| `number`\> | CSS style properties to apply when measuring. |
322
+
323
+ ##### Returns
324
+
325
+ `number`
326
+
327
+ #### Call Signature
328
+
329
+ > **textWidth**(`text`: `string`[], `style?`: `Record`\<`string`, `string` \| `number`\>): `number`[]
330
+
331
+ Defined in: [textWidth.ts:53](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/textWidth.ts#L53)
332
+
333
+ ##### Parameters
334
+
335
+ | Parameter | Type |
336
+ | ------ | ------ |
337
+ | `text` | `string`[] |
338
+ | `style?` | `Record`\<`string`, `string` \| `number`\> |
339
+
340
+ ##### Returns
341
+
342
+ `number`[]
343
+
344
+ ## Type Aliases
345
+
346
+ <a id="d3selection"></a>
170
347
 
171
- This is a global function
348
+ ### D3Selection
172
349
 
173
- ---
350
+ > **D3Selection** = `ReturnType`\<*typeof* `select`\>
174
351
 
352
+ Defined in: [D3Selection.ts:12](https://github.com/d3plus/d3plus/blob/fe174c3153bf379a226e4a41b6a8492a86c3a1b7/packages/dom/src/D3Selection.ts#L12)
package/es/index.js CHANGED
@@ -1,4 +1,5 @@
1
1
  export { default as assign } from "./src/assign.js";
2
+ export { default as backgroundColor } from "./src/backgroundColor.js";
2
3
  export { default as attrize } from "./src/attrize.js";
3
4
  export { default as date } from "./src/date.js";
4
5
  export { default as elem } from "./src/elem.js";
@@ -7,7 +8,6 @@ export { default as getSize } from "./src/getSize.js";
7
8
  export { default as inViewport } from "./src/inViewport.js";
8
9
  export { default as isObject } from "./src/isObject.js";
9
10
  export { default as parseSides } from "./src/parseSides.js";
10
- export { default as prefix } from "./src/prefix.js";
11
11
  export { default as rtl } from "./src/rtl.js";
12
12
  export { default as stylize } from "./src/stylize.js";
13
13
  export { default as textWidth } from "./src/textWidth.js";
@@ -0,0 +1,4 @@
1
+ /**
2
+ @interface Stylable
3
+ Anything that supports `.style(name, value)` — both Selection and Transition.
4
+ */ export { };
package/es/src/assign.js CHANGED
@@ -1,21 +1,19 @@
1
1
  import isObject from "./isObject.js";
2
2
  /**
3
- @function validObject
4
- @desc Determines if the object passed is the document or window.
5
- @param {Object} obj
6
- @private
3
+ Determines if the object passed is the document or window.
4
+ @param obj @private
7
5
  */ function validObject(obj) {
8
6
  if (typeof window === "undefined") return true;
9
7
  else return obj !== window && obj !== document;
10
8
  }
11
9
  /**
12
- @function assign
13
- @desc A deeply recursive version of `Object.assign`.
14
- @param {...Object} objects
15
- @example <caption>this</caption>
10
+ A deeply recursive version of `Object.assign`.
11
+
12
+ @example <caption>this</caption>
16
13
  assign({id: "foo", deep: {group: "A"}}, {id: "bar", deep: {value: 20}}));
17
14
  @example <caption>returns this</caption>
18
15
  {id: "bar", deep: {group: "A", value: 20}}
16
+ @param objects The source objects to merge into the target.
19
17
  */ function assign() {
20
18
  var _loop = function(i) {
21
19
  var source = objects[i];
package/es/src/attrize.js CHANGED
@@ -1,8 +1,7 @@
1
1
  /**
2
- @function attrize
3
- @desc Applies each key/value in an object as an attr.
4
- @param {D3selection} elem The D3 element to apply the styles to.
5
- @param {Object} attrs An object of key/value attr pairs.
2
+ Applies each key/value in an object as an attr.
3
+ @param e The d3 selection to apply attributes to.
4
+ @param a An object of key/value attr pairs.
6
5
  */ export default function(e) {
7
6
  var a = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
8
7
  for(var k in a)if (({}).hasOwnProperty.call(a, k)) e.attr(k, a[k]);
@@ -0,0 +1,14 @@
1
+ /**
2
+ Given a DOM element, returns its background color by walking up the
3
+ ancestor chain until a non-transparent background is found. Falls back
4
+ to "rgb(255, 255, 255)" (white) if every ancestor is transparent.
5
+ @param elem The DOM element to check.
6
+ */ export default function(elem) {
7
+ var node = elem;
8
+ while(node){
9
+ var bg = getComputedStyle(node).backgroundColor;
10
+ if (bg && bg !== "transparent" && bg !== "rgba(0, 0, 0, 0)") return bg;
11
+ node = node.parentElement;
12
+ }
13
+ return "rgb(255, 255, 255)";
14
+ }
package/es/src/date.js CHANGED
@@ -1,8 +1,6 @@
1
1
  /**
2
- @function date
3
- @summary Parses numbers and strings to valid Javascript Date objects.
4
- @description Returns a javascript Date object for a given a Number (representing either a 4-digit year or milliseconds since epoch), a String representing a Quarter (ie. "Q2 1987", mapping to the last day in that quarter), or a String that is in [valid dateString format](http://dygraphs.com/date-formats.html). Besides the 4-digit year parsing, this function is useful when needing to parse negative (BC) years, which the vanilla Date object cannot parse.
5
- @param {Number|String} *date*
2
+ Parses numbers and strings into valid JavaScript Date objects, supporting years, quarters, months, and ISO 8601 formats.
3
+ @param d The date value to parse (number, string, or Date).
6
4
  */ export default function(d) {
7
5
  // returns if falsey or already Date object
8
6
  if ([
@@ -41,8 +39,8 @@
41
39
  return date2;
42
40
  }
43
41
  // tests for monthly formats (ie. "MM-YYYY" and "YYYY-MM")
44
- var monthPrefix = new RegExp(/^([-*\d]{1,2})\-(-*\d{1,4})$/g).exec(s);
45
- var monthSuffix = new RegExp(/^(-*\d{1,4})\-([-*\d]{1,2})$/g).exec(s);
42
+ var monthPrefix = new RegExp(/^([-*\d]{1,2})-(-*\d{1,4})$/g).exec(s);
43
+ var monthSuffix = new RegExp(/^(-*\d{1,4})-([-*\d]{1,2})$/g).exec(s);
46
44
  if (monthPrefix || monthSuffix) {
47
45
  var month = +(monthPrefix ? monthPrefix[1] : monthSuffix[2]);
48
46
  var year3 = +(monthPrefix ? monthPrefix[2] : monthSuffix[1]);
package/es/src/elem.js CHANGED
@@ -2,19 +2,12 @@ import { select } from "d3-selection";
2
2
  import { transition } from "d3-transition";
3
3
  import { default as attrize } from "./attrize.js";
4
4
  /**
5
- @function elem
6
- @desc Manages the enter/update/exit pattern for a single DOM element.
7
- @param {String} selector A D3 selector, which must include the tagname and a class and/or ID.
8
- @param {Object} params Additional parameters.
9
- @param {Boolean} [params.condition = true] Whether or not the element should be rendered (or removed).
10
- @param {Object} [params.enter = {}] A collection of key/value pairs that map to attributes to be given on enter.
11
- @param {Object} [params.exit = {}] A collection of key/value pairs that map to attributes to be given on exit.
12
- @param {D3Selection} [params.parent = d3.select("body")] The parent element for this new element to be appended to.
13
- @param {Number} [params.duration = 0] The duration for the d3 transition.
14
- @param {Object} [params.update = {}] A collection of key/value pairs that map to attributes to be given on update.
5
+ Manages the enter/update/exit pattern for a single DOM element, applying enter, update, and exit attributes with optional transitions.
6
+ @param selector A CSS selector string for the element tag and classes.
7
+ @param p Configuration object with enter, exit, update, and parent options.
15
8
  */ export default function(selector, p) {
16
9
  // overrides default params
17
- p = Object.assign({}, {
10
+ var params = Object.assign({}, {
18
11
  condition: true,
19
12
  enter: {},
20
13
  exit: {},
@@ -22,17 +15,17 @@ import { default as attrize } from "./attrize.js";
22
15
  parent: select("body"),
23
16
  update: {}
24
17
  }, p);
25
- var className = /\.([^#]+)/g.exec(selector), id = /#([^.]+)/g.exec(selector), t = transition().duration(p.duration), tag = /^([^.^#]+)/g.exec(selector)[1];
26
- var elem = p.parent.selectAll(selector.includes(":") ? selector.split(":")[1] : selector).data(p.condition ? [
18
+ var className = /\.([^#]+)/g.exec(selector), id = /#([^.]+)/g.exec(selector), t = transition().duration(params.duration), tag = /^([^.^#]+)/g.exec(selector)[1];
19
+ var elem = params.parent.selectAll(selector.includes(":") ? selector.split(":")[1] : selector).data(params.condition ? [
27
20
  null
28
21
  ] : []);
29
- var enter = elem.enter().append(tag).call(attrize, p.enter);
22
+ var enter = elem.enter().append(tag).call(attrize, params.enter);
30
23
  if (id) enter.attr("id", id[1]);
31
24
  if (className) enter.attr("class", className[1]);
32
- if (p.duration) elem.exit().transition(t).call(attrize, p.exit).remove();
33
- else elem.exit().call(attrize, p.exit).remove();
25
+ if (params.duration) elem.exit().transition(t).call(attrize, params.exit).remove();
26
+ else elem.exit().call(attrize, params.exit).remove();
34
27
  var update = enter.merge(elem);
35
- if (p.duration) update.transition(t).call(attrize, p.update);
36
- else update.call(attrize, p.update);
28
+ if (params.duration) update.transition(t).call(attrize, params.update);
29
+ else update.call(attrize, params.update);
37
30
  return update;
38
31
  }
@@ -1,4 +1,5 @@
1
1
  function _instanceof(left, right) {
2
+ "@swc/helpers - instanceof";
2
3
  if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
3
4
  return !!right[Symbol.hasInstance](left);
4
5
  } else {
@@ -6,14 +7,12 @@ function _instanceof(left, right) {
6
7
  }
7
8
  }
8
9
  import { default as textWidth } from "./textWidth.js";
9
- import { trim } from "@d3plus/text";
10
10
  var alpha = "abcdefghiABCDEFGHI_!@#$%^&*()_+1234567890", checked = {}, height = 32;
11
11
  var dejavu, macos, monospace, proportional;
12
12
  /**
13
- @function fontExists
14
- @desc Given either a single font-family or a list of fonts, returns the name of the first font that can be rendered, or `false` if none are installed on the user's machine.
15
- @param {String|Array} font Can be either a valid CSS font-family string (single or comma-separated names) or an Array of string names.
16
- */ var fontExists = function(font) {
13
+ Given either a single font-family or a list of fonts, returns the name of the first font that can be rendered, or `false` if none are installed on the user's machine.
14
+ @param font Can be either a valid CSS font-family string (single or comma-separated names) or an Array of string names.
15
+ */ var fontExists = function fontExists(font) {
17
16
  if (!dejavu) {
18
17
  dejavu = textWidth(alpha, {
19
18
  "font-family": "DejaVuSans",
@@ -34,7 +33,7 @@ var dejavu, macos, monospace, proportional;
34
33
  }
35
34
  if (!_instanceof(font, Array)) font = font.split(",");
36
35
  font = font.map(function(f) {
37
- return trim(f);
36
+ return f.trim();
38
37
  });
39
38
  for(var i = 0; i < font.length; i++){
40
39
  var fam = font[i];