@elastic/distillate 0.1.0 → 0.2.0

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.
Files changed (49) hide show
  1. package/dist/cjs/collector.js +129 -58
  2. package/dist/cjs/collector.js.map +1 -1
  3. package/dist/cjs/dom_sink.js +2 -2
  4. package/dist/cjs/dom_sink.js.map +1 -1
  5. package/dist/cjs/emotion.js.map +1 -1
  6. package/dist/cjs/engine.js +24 -8
  7. package/dist/cjs/engine.js.map +1 -1
  8. package/dist/cjs/index.js +3 -1
  9. package/dist/cjs/index.js.map +1 -1
  10. package/dist/cjs/sink.js +9 -0
  11. package/dist/cjs/sink.js.map +1 -0
  12. package/dist/collector.d.ts +18 -1
  13. package/dist/collector.d.ts.map +1 -1
  14. package/dist/collector.js +129 -58
  15. package/dist/collector.js.map +1 -1
  16. package/dist/dom_sink.d.ts +8 -12
  17. package/dist/dom_sink.d.ts.map +1 -1
  18. package/dist/dom_sink.js +2 -2
  19. package/dist/dom_sink.js.map +1 -1
  20. package/dist/emotion.d.ts +3 -6
  21. package/dist/emotion.d.ts.map +1 -1
  22. package/dist/emotion.js.map +1 -1
  23. package/dist/engine.d.ts +26 -1
  24. package/dist/engine.d.ts.map +1 -1
  25. package/dist/engine.js +24 -8
  26. package/dist/engine.js.map +1 -1
  27. package/dist/index.d.ts +3 -1
  28. package/dist/index.d.ts.map +1 -1
  29. package/dist/index.js +2 -1
  30. package/dist/index.js.map +1 -1
  31. package/dist/sink.d.ts +16 -0
  32. package/dist/sink.d.ts.map +1 -0
  33. package/dist/sink.js +8 -0
  34. package/dist/sink.js.map +1 -0
  35. package/docs/concepts/collection.md +1 -1
  36. package/docs/getting-started/installation.md +5 -5
  37. package/docs/guides/react-renderer.md +45 -1
  38. package/docs/reference/api/emotion.md +58 -140
  39. package/docs/reference/api/index-1.md +452 -245
  40. package/docs/reference/api/testing.md +6 -6
  41. package/docs/reference/entry-points.md +18 -4
  42. package/docs/reference/okf-map.md +2 -1
  43. package/package.json +1 -1
  44. package/src/collector.ts +145 -59
  45. package/src/dom_sink.ts +9 -10
  46. package/src/emotion.ts +3 -6
  47. package/src/engine.ts +59 -9
  48. package/src/index.ts +14 -1
  49. package/src/sink.ts +25 -0
@@ -2,24 +2,9 @@
2
2
 
3
3
  ## Interfaces
4
4
 
5
- ### CreateDomSinkOptions [#createdomsinkoptions]
6
-
7
- Defined in: [dom\_sink.ts:25](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/dom_sink.ts#L25)
8
-
9
- Host document and optional flush scheduler for a `<style>` sink.
10
-
11
- #### Properties
12
-
13
- | Property | Type | Description | Defined in |
14
- | ------ | ------ | ------ | ------ |
15
- | $$$document$$$ `document` | [`DocumentLike`](#documentlike) | The host document where the style element will be appended. | [dom\_sink.ts:27](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/dom_sink.ts#L27) |
16
- | $$$schedule$$$ `schedule?` | (`flush`) => `void` | Defers the flush. Defaults to `queueMicrotask`. | [dom\_sink.ts:29](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/dom_sink.ts#L29) |
17
-
18
- ***
19
-
20
5
  ### CreateEmotionOptions [#createemotionoptions]
21
6
 
22
- Defined in: [emotion.ts:33](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L33)
7
+ Defined in: [emotion.ts:30](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L30)
23
8
 
24
9
  Shared sink for Emotion compat modules on one registry.
25
10
 
@@ -27,50 +12,13 @@ Shared sink for Emotion compat modules on one registry.
27
12
 
28
13
  | Property | Type | Description | Defined in |
29
14
  | ------ | ------ | ------ | ------ |
30
- | $$$sink$$$ `sink?` | [`StyleSink`](#stylesink) | Notified when a compat module registers. Shared across `createEmotion` calls on the same registry. | [emotion.ts:35](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L35) |
31
-
32
- ***
33
-
34
- ### DocumentLike [#documentlike]
35
-
36
- Defined in: [dom\_sink.ts:17](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/dom_sink.ts#L17)
37
-
38
- Minimal interface for a DOM `Document` able to create and append style tags.
39
-
40
- #### Properties
41
-
42
- | Property | Modifier | Type | Description | Defined in |
43
- | ------ | ------ | ------ | ------ | ------ |
44
- | $$$head$$$ `head` | `readonly` | `object` | Node that receives the created style element. | [dom\_sink.ts:21](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/dom_sink.ts#L21) |
45
- | `head.appendChild` | `public` | `void` | - | [dom\_sink.ts:21](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/dom_sink.ts#L21) |
46
-
47
- #### Methods
48
-
49
- ##### createElement() [#createelement]
50
-
51
- ```ts
52
- createElement(tagName): StyleElementLike;
53
- ```
54
-
55
- Defined in: [dom\_sink.ts:19](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/dom_sink.ts#L19)
56
-
57
- Creates a `<style>` element.
58
-
59
- ###### Parameters
60
-
61
- | Parameter | Type |
62
- | ------ | ------ |
63
- | `tagName` | `"style"` |
64
-
65
- ###### Returns
66
-
67
- [`StyleElementLike`](#styleelementlike)
15
+ | $$$sink$$$ `sink?` | [`StyleSink`](index-1.md#stylesink) | Notified when a compat module registers. Shared across `createEmotion` calls on the same registry. | [emotion.ts:32](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L32) |
68
16
 
69
17
  ***
70
18
 
71
19
  ### Emotion [#emotion]
72
20
 
73
- Defined in: [emotion.ts:59](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L59)
21
+ Defined in: [emotion.ts:56](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L56)
74
22
 
75
23
  Emotion-shaped authoring API bound to one Distillery registry.
76
24
 
@@ -82,7 +30,7 @@ Emotion-shaped authoring API bound to one Distillery registry.
82
30
  css(strings, ...values): EmotionCss;
83
31
  ```
84
32
 
85
- Defined in: [emotion.ts:61](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L61)
33
+ Defined in: [emotion.ts:58](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L58)
86
34
 
87
35
  Authors styles and returns a handle that can be used directly or passed to `cx`.
88
36
 
@@ -103,7 +51,7 @@ Authors styles and returns a handle that can be used directly or passed to `cx`.
103
51
  cx(...args): string;
104
52
  ```
105
53
 
106
- Defined in: [emotion.ts:63](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L63)
54
+ Defined in: [emotion.ts:60](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L60)
107
55
 
108
56
  Combines handles, conditional classes, and plain strings into a space-separated string.
109
57
 
@@ -123,7 +71,7 @@ Combines handles, conditional classes, and plain strings into a space-separated
123
71
  globalModules(): readonly StylesModule<StylesObject>[];
124
72
  ```
125
73
 
126
- Defined in: [emotion.ts:72](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L72)
74
+ Defined in: [emotion.ts:69](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L69)
127
75
 
128
76
  Returns the underlying modules backing `injectGlobal` calls.
129
77
 
@@ -137,7 +85,7 @@ readonly [`StylesModule`](index-1.md#stylesmodule)\<[`StylesObject`](index-1.md#
137
85
  injectGlobal(strings, ...values): void;
138
86
  ```
139
87
 
140
- Defined in: [emotion.ts:65](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L65)
88
+ Defined in: [emotion.ts:62](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L62)
141
89
 
142
90
  Defines styles that apply globally (e.g. `body`, `html`).
143
91
 
@@ -158,7 +106,7 @@ Defines styles that apply globally (e.g. `body`, `html`).
158
106
  stylesheet(): string;
159
107
  ```
160
108
 
161
- Defined in: [emotion.ts:70](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L70)
109
+ Defined in: [emotion.ts:67](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L67)
162
110
 
163
111
  Emits the full CSS for all generated emotion styles.
164
112
 
@@ -170,7 +118,7 @@ Emits the full CSS for all generated emotion styles.
170
118
 
171
119
  ### EmotionCss [#emotioncss-1]
172
120
 
173
- Defined in: [emotion.ts:39](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L39)
121
+ Defined in: [emotion.ts:36](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L36)
174
122
 
175
123
  Style handle that stringifies to its readable class name.
176
124
 
@@ -182,13 +130,13 @@ Style handle that stringifies to its readable class name.
182
130
 
183
131
  | Property | Modifier | Type | Description | Inherited from | Defined in |
184
132
  | ------ | ------ | ------ | ------ | ------ | ------ |
185
- | $$$declarations$$$ `declarations` | `readonly` | [`Declarations`](index-1.md#declarations) | CSS properties for this handle. | [`StyleHandle`](index-1.md#stylehandle).[`declarations`](index-1.md#declarations-1) | [styles/types.ts:117](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/styles/types.ts#L117) |
186
- | $$$key$$$ `key` | `readonly` | `string` | Full path joined by dots. | [`StyleHandle`](index-1.md#stylehandle).[`key`](index-1.md#key-1) | [styles/types.ts:113](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/styles/types.ts#L113) |
187
- | $$$kind$$$ `kind` | `readonly` | `"handle"` | Discriminant for [StyleEntry](index-1.md#styleentry). | [`StyleHandle`](index-1.md#stylehandle).[`kind`](index-1.md#kind) | [styles/types.ts:107](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/styles/types.ts#L107) |
188
- | $$$localname$$$ `localName` | `readonly` | `string` | Leaf key if at root, or composed path for nested handles. | [`StyleHandle`](index-1.md#stylehandle).[`localName`](index-1.md#localname) | [styles/types.ts:111](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/styles/types.ts#L111) |
189
- | $$$modulename$$$ `moduleName` | `readonly` | `string` | The registered module name this handle belongs to. | [`StyleHandle`](index-1.md#stylehandle).[`moduleName`](index-1.md#modulename) | [styles/types.ts:109](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/styles/types.ts#L109) |
190
- | $$$readablename$$$ `readableName` | `readonly` | `string` | Predictable name used for output CSS classes. | [`StyleHandle`](index-1.md#stylehandle).[`readableName`](index-1.md#readablename) | [styles/types.ts:115](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/styles/types.ts#L115) |
191
- | $$$variant$$$ `variant` | `readonly` | `boolean` | `true` when produced inside `variants(...)`. Skipped by [StylesCollector.use](index-1.md#use). | [`StyleHandle`](index-1.md#stylehandle).[`variant`](index-1.md#variant) | [styles/types.ts:119](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/styles/types.ts#L119) |
133
+ | $$$declarations$$$ `declarations` | `readonly` | [`Declarations`](index-1.md#declarations) | CSS properties for this handle. | [`StyleHandle`](index-1.md#stylehandle).[`declarations`](index-1.md#declarations-1) | [styles/types.ts:117](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/styles/types.ts#L117) |
134
+ | $$$key$$$ `key` | `readonly` | `string` | Full path joined by dots. | [`StyleHandle`](index-1.md#stylehandle).[`key`](index-1.md#key-1) | [styles/types.ts:113](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/styles/types.ts#L113) |
135
+ | $$$kind$$$ `kind` | `readonly` | `"handle"` | Discriminant for [StyleEntry](index-1.md#styleentry). | [`StyleHandle`](index-1.md#stylehandle).[`kind`](index-1.md#kind) | [styles/types.ts:107](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/styles/types.ts#L107) |
136
+ | $$$localname$$$ `localName` | `readonly` | `string` | Leaf key if at root, or composed path for nested handles. | [`StyleHandle`](index-1.md#stylehandle).[`localName`](index-1.md#localname) | [styles/types.ts:111](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/styles/types.ts#L111) |
137
+ | $$$modulename$$$ `moduleName` | `readonly` | `string` | The registered module name this handle belongs to. | [`StyleHandle`](index-1.md#stylehandle).[`moduleName`](index-1.md#modulename) | [styles/types.ts:109](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/styles/types.ts#L109) |
138
+ | $$$readablename$$$ `readableName` | `readonly` | `string` | Predictable name used for output CSS classes. | [`StyleHandle`](index-1.md#stylehandle).[`readableName`](index-1.md#readablename) | [styles/types.ts:115](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/styles/types.ts#L115) |
139
+ | $$$variant$$$ `variant` | `readonly` | `boolean` | `true` when produced inside `variants(...)`. Skipped by [StylesCollector.use](index-1.md#use). | [`StyleHandle`](index-1.md#stylehandle).[`variant`](index-1.md#variant) | [styles/types.ts:119](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/styles/types.ts#L119) |
192
140
 
193
141
  #### Methods
194
142
 
@@ -198,7 +146,7 @@ Style handle that stringifies to its readable class name.
198
146
  toPrimitive: string;
199
147
  ```
200
148
 
201
- Defined in: [emotion.ts:43](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L43)
149
+ Defined in: [emotion.ts:40](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L40)
202
150
 
203
151
  Template interpolation; same as [EmotionCss.toString](#tostring).
204
152
 
@@ -218,7 +166,7 @@ Template interpolation; same as [EmotionCss.toString](#tostring).
218
166
  resolveClassName(context): string;
219
167
  ```
220
168
 
221
- Defined in: [styles/types.ts:121](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/styles/types.ts#L121)
169
+ Defined in: [styles/types.ts:121](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/styles/types.ts#L121)
222
170
 
223
171
  Produces the final class name via the provided resolver context.
224
172
 
@@ -235,7 +183,7 @@ Produces the final class name via the provided resolver context.
235
183
 
236
184
  ###### Inherited from
237
185
 
238
- [`StyleHandle`](index-1.md#stylehandle).[`resolveClassName`](index-1.md#resolveclassname)
186
+ [`StyleHandle`](index-1.md#stylehandle).[`resolveClassName`](index-1.md#resolveclassname-1)
239
187
 
240
188
  ##### toString() [#tostring]
241
189
 
@@ -243,7 +191,7 @@ Produces the final class name via the provided resolver context.
243
191
  toString(): string;
244
192
  ```
245
193
 
246
- Defined in: [emotion.ts:41](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L41)
194
+ Defined in: [emotion.ts:38](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L38)
247
195
 
248
196
  Stringifies to the readable class name.
249
197
 
@@ -251,50 +199,6 @@ Stringifies to the readable class name.
251
199
 
252
200
  `string`
253
201
 
254
- ***
255
-
256
- ### StyleElementLike [#styleelementlike]
257
-
258
- Defined in: [dom\_sink.ts:11](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/dom_sink.ts#L11)
259
-
260
- Minimal interface for a DOM `<style>` element.
261
-
262
- #### Properties
263
-
264
- | Property | Type | Description | Defined in |
265
- | ------ | ------ | ------ | ------ |
266
- | $$$textcontent$$$ `textContent` | `string` \| `null` | Current stylesheet text, or `null` before the first flush. | [dom\_sink.ts:13](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/dom_sink.ts#L13) |
267
-
268
- ***
269
-
270
- ### StyleSink [#stylesink]
271
-
272
- Defined in: [emotion.ts:27](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L27)
273
-
274
- Receives stylesheet invalidation from Emotion compat modules.
275
-
276
- #### Methods
277
-
278
- ##### invalidate() [#invalidate]
279
-
280
- ```ts
281
- invalidate(render): void;
282
- ```
283
-
284
- Defined in: [emotion.ts:29](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L29)
285
-
286
- Marks the sink dirty. `render` produces the current stylesheet when it flushes.
287
-
288
- ###### Parameters
289
-
290
- | Parameter | Type |
291
- | ------ | ------ |
292
- | `render` | () => `string` |
293
-
294
- ###### Returns
295
-
296
- `void`
297
-
298
202
  ## Type Aliases
299
203
 
300
204
  ### ClassNameArg [#classnamearg]
@@ -314,41 +218,19 @@ type ClassNameArg =
314
218
  };
315
219
  ```
316
220
 
317
- Defined in: [emotion.ts:47](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L47)
221
+ Defined in: [emotion.ts:44](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L44)
318
222
 
319
223
  One `cx(...)` argument: a class, handle, list, or truthy map.
320
224
 
321
225
  ## Functions
322
226
 
323
- ### createDomSink() [#createdomsink]
324
-
325
- ```ts
326
- function createDomSink(__namedParameters): StyleSink;
327
- ```
328
-
329
- Defined in: [dom\_sink.ts:35](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/dom_sink.ts#L35)
330
-
331
- One managed `<style>` element, rewritten on each flush.
332
-
333
- #### Parameters
334
-
335
- | Parameter | Type |
336
- | ------ | ------ |
337
- | `__namedParameters` | [`CreateDomSinkOptions`](#createdomsinkoptions) |
338
-
339
- #### Returns
340
-
341
- [`StyleSink`](#stylesink)
342
-
343
- ***
344
-
345
227
  ### createEmotion() [#createemotion]
346
228
 
347
229
  ```ts
348
230
  function createEmotion<TTokens>(distillery, options?): Emotion;
349
231
  ```
350
232
 
351
- Defined in: [emotion.ts:117](https://github.com/elastic/distillate/blob/f131912edadeb90a659ad22ee215412bedb1394d/src/emotion.ts#L117)
233
+ Defined in: [emotion.ts:114](https://github.com/elastic/distillate/blob/d1dccb0eb5372d5984331c21603220340752a304/src/emotion.ts#L114)
352
234
 
353
235
  `@emotion/css`-shaped API over a distillery.
354
236
 
@@ -370,3 +252,39 @@ Defined in: [emotion.ts:117](https://github.com/elastic/distillate/blob/f131912e
370
252
  #### Returns
371
253
 
372
254
  [`Emotion`](#emotion)
255
+
256
+ ## References
257
+
258
+ ### createDomSink [#createdomsink]
259
+
260
+ Re-exports [createDomSink](index-1.md#createdomsink)
261
+
262
+ ***
263
+
264
+ ### CreateDomSinkOptions [#createdomsinkoptions]
265
+
266
+ Re-exports [CreateDomSinkOptions](index-1.md#createdomsinkoptions)
267
+
268
+ ***
269
+
270
+ ### DocumentLike [#documentlike]
271
+
272
+ Re-exports [DocumentLike](index-1.md#documentlike)
273
+
274
+ ***
275
+
276
+ ### StyleElementLike [#styleelementlike]
277
+
278
+ Re-exports [StyleElementLike](index-1.md#styleelementlike)
279
+
280
+ ***
281
+
282
+ ### StyleParentLike [#styleparentlike]
283
+
284
+ Re-exports [StyleParentLike](index-1.md#styleparentlike)
285
+
286
+ ***
287
+
288
+ ### StyleSink [#stylesink]
289
+
290
+ Re-exports [StyleSink](index-1.md#stylesink)