@nanoporetech-digital/components-vue 6.0.1 → 6.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.
@@ -189,19 +189,212 @@
189
189
  "description": "Load and append pages automatically on scroll",
190
190
  "options": []
191
191
  },
192
- "nano-aspect-ratio/aspect-ratio": {
193
- "type": "string",
194
- "description": "The aspect ratio of the embedded media in the format of `width:height`, e.g. `16:9`, `4:3`, or `1:1`.\nRatios not in this format will be ignored.",
192
+ "nano-animation/current-time": {
193
+ "type": "number",
194
+ "description": "Gets and sets the current animation time.",
195
+ "options": []
196
+ },
197
+ "nano-animation/delay": {
198
+ "type": "number",
199
+ "description": "The number of milliseconds to delay the start of the animation.",
200
+ "options": []
201
+ },
202
+ "nano-animation/direction": {
203
+ "type": "\"alternate\" | \"alternate-reverse\" | \"normal\" | \"reverse\"",
204
+ "description": "Determines the direction of playback as well as the behavior when reaching the end of an iteration.\n[Learn more](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction)",
205
+ "options": [
206
+ "alternate",
207
+ "alternate-reverse",
208
+ "normal",
209
+ "reverse"
210
+ ]
211
+ },
212
+ "nano-animation/duration": {
213
+ "type": "number",
214
+ "description": "The number of milliseconds each iteration of the animation takes to complete.",
215
+ "options": []
216
+ },
217
+ "nano-animation/easing": {
218
+ "type": "\"linear\" | \"ease\" | \"easeIn\" | \"easeOut\" | \"easeInOut\" | \"easeInSine\" | \"easeOutSine\" | \"easeInOutSine\" | \"easeInQuad\" | \"easeOutQuad\" | \"easeInOutQuad\" | \"easeInCubic\" | \"easeOutCubic\" | \"easeInOutCubic\" | \"easeInQuart\" | \"easeOutQuart\" | \"easeInOutQuart\" | \"easeInQuint\" | \"easeOutQuint\" | \"easeInOutQuint\" | \"easeInExpo\" | \"easeOutExpo\" | \"easeInOutExpo\" | \"easeInCirc\" | \"easeOutCirc\" | \"easeInOutCirc\" | \"easeInBack\" | \"easeOutBack\" | \"easeInOutBack\"",
219
+ "description": "The easing function to use for the animation. This can be a easing function or a custom easing function\nsuch as `cubic-bezier(0, 1, .76, 1.14)`.",
220
+ "options": [
221
+ "linear",
222
+ "ease",
223
+ "easeIn",
224
+ "easeOut",
225
+ "easeInOut",
226
+ "easeInSine",
227
+ "easeOutSine",
228
+ "easeInOutSine",
229
+ "easeInQuad",
230
+ "easeOutQuad",
231
+ "easeInOutQuad",
232
+ "easeInCubic",
233
+ "easeOutCubic",
234
+ "easeInOutCubic",
235
+ "easeInQuart",
236
+ "easeOutQuart",
237
+ "easeInOutQuart",
238
+ "easeInQuint",
239
+ "easeOutQuint",
240
+ "easeInOutQuint",
241
+ "easeInExpo",
242
+ "easeOutExpo",
243
+ "easeInOutExpo",
244
+ "easeInCirc",
245
+ "easeOutCirc",
246
+ "easeInOutCirc",
247
+ "easeInBack",
248
+ "easeOutBack",
249
+ "easeInOutBack"
250
+ ]
251
+ },
252
+ "nano-animation/end-delay": {
253
+ "type": "number",
254
+ "description": "The number of milliseconds to delay after the active period of an animation sequence.",
255
+ "options": []
256
+ },
257
+ "nano-animation/fill": {
258
+ "type": "\"auto\" | \"backwards\" | \"both\" | \"forwards\" | \"none\"",
259
+ "description": "Sets how the animation applies styles to its target before and after its execution.",
260
+ "options": [
261
+ "auto",
262
+ "backwards",
263
+ "both",
264
+ "forwards",
265
+ "none"
266
+ ]
267
+ },
268
+ "nano-animation/iteration-start": {
269
+ "type": "number",
270
+ "description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
271
+ "options": []
272
+ },
273
+ "nano-animation/iterations": {
274
+ "type": "number",
275
+ "description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
276
+ "options": []
277
+ },
278
+ "nano-animation/keyframes": {
279
+ "type": "Keyframe[]",
280
+ "description": "The keyframes to use for the animation. If this is set, `name` will be ignored.",
195
281
  "options": []
196
282
  },
197
- "nano-aspect-ratio/fit": {
198
- "type": "\"contain\" | \"cover\"",
199
- "description": "Determines how content will be resized to fit its container.",
283
+ "nano-animation/name": {
284
+ "type": "\"flip\" | \"none\" | \"bounce\" | \"flash\" | \"headShake\" | \"heartBeat\" | \"jello\" | \"pulse\" | \"rubberBand\" | \"shake\" | \"shakeX\" | \"shakeY\" | \"swing\" | \"tada\" | \"wobble\" | \"backInDown\" | \"backInLeft\" | \"backInRight\" | \"backInUp\" | \"backOutDown\" | \"backOutLeft\" | \"backOutRight\" | \"backOutUp\" | \"bounceIn\" | \"bounceInDown\" | \"bounceInLeft\" | \"bounceInRight\" | \"bounceInUp\" | \"bounceOut\" | \"bounceOutDown\" | \"bounceOutLeft\" | \"bounceOutRight\" | \"bounceOutUp\" | \"fadeIn\" | \"fadeInBottomLeft\" | \"fadeInBottomRight\" | \"fadeInDown\" | \"fadeInDownBig\" | \"fadeInLeft\" | \"fadeInLeftBig\" | \"fadeInRight\" | \"fadeInRightBig\" | \"fadeInTopLeft\" | \"fadeInTopRight\" | \"fadeInUp\" | \"fadeInUpBig\" | \"fadeOut\" | \"fadeOutBottomLeft\" | \"fadeOutBottomRight\" | \"fadeOutDown\" | \"fadeOutDownBig\" | \"fadeOutLeft\" | \"fadeOutLeftBig\" | \"fadeOutRight\" | \"fadeOutRightBig\" | \"fadeOutTopLeft\" | \"fadeOutTopRight\" | \"fadeOutUp\" | \"fadeOutUpBig\" | \"flipInX\" | \"flipInY\" | \"flipOutX\" | \"flipOutY\" | \"lightSpeedInLeft\" | \"lightSpeedInRight\" | \"lightSpeedOutLeft\" | \"lightSpeedOutRight\" | \"rotateIn\" | \"rotateInDownLeft\" | \"rotateInDownRight\" | \"rotateInUpLeft\" | \"rotateInUpRight\" | \"rotateOut\" | \"rotateOutDownLeft\" | \"rotateOutDownRight\" | \"rotateOutUpLeft\" | \"rotateOutUpRight\" | \"slideInDown\" | \"slideInLeft\" | \"slideInRight\" | \"slideInUp\" | \"slideOutDown\" | \"slideOutLeft\" | \"slideOutRight\" | \"slideOutUp\" | \"hinge\" | \"jackInTheBox\" | \"rollIn\" | \"rollOut\" | \"zoomIn\" | \"zoomInDown\" | \"zoomInLeft\" | \"zoomInRight\" | \"zoomInUp\" | \"zoomOut\" | \"zoomOutDown\" | \"zoomOutLeft\" | \"zoomOutRight\" | \"zoomOutUp\"",
285
+ "description": "The name of the built-in animation to use. For custom animations, use the `keyframes` prop.",
200
286
  "options": [
201
- "contain",
202
- "cover"
287
+ "flip",
288
+ "none",
289
+ "bounce",
290
+ "flash",
291
+ "headShake",
292
+ "heartBeat",
293
+ "jello",
294
+ "pulse",
295
+ "rubberBand",
296
+ "shake",
297
+ "shakeX",
298
+ "shakeY",
299
+ "swing",
300
+ "tada",
301
+ "wobble",
302
+ "backInDown",
303
+ "backInLeft",
304
+ "backInRight",
305
+ "backInUp",
306
+ "backOutDown",
307
+ "backOutLeft",
308
+ "backOutRight",
309
+ "backOutUp",
310
+ "bounceIn",
311
+ "bounceInDown",
312
+ "bounceInLeft",
313
+ "bounceInRight",
314
+ "bounceInUp",
315
+ "bounceOut",
316
+ "bounceOutDown",
317
+ "bounceOutLeft",
318
+ "bounceOutRight",
319
+ "bounceOutUp",
320
+ "fadeIn",
321
+ "fadeInBottomLeft",
322
+ "fadeInBottomRight",
323
+ "fadeInDown",
324
+ "fadeInDownBig",
325
+ "fadeInLeft",
326
+ "fadeInLeftBig",
327
+ "fadeInRight",
328
+ "fadeInRightBig",
329
+ "fadeInTopLeft",
330
+ "fadeInTopRight",
331
+ "fadeInUp",
332
+ "fadeInUpBig",
333
+ "fadeOut",
334
+ "fadeOutBottomLeft",
335
+ "fadeOutBottomRight",
336
+ "fadeOutDown",
337
+ "fadeOutDownBig",
338
+ "fadeOutLeft",
339
+ "fadeOutLeftBig",
340
+ "fadeOutRight",
341
+ "fadeOutRightBig",
342
+ "fadeOutTopLeft",
343
+ "fadeOutTopRight",
344
+ "fadeOutUp",
345
+ "fadeOutUpBig",
346
+ "flipInX",
347
+ "flipInY",
348
+ "flipOutX",
349
+ "flipOutY",
350
+ "lightSpeedInLeft",
351
+ "lightSpeedInRight",
352
+ "lightSpeedOutLeft",
353
+ "lightSpeedOutRight",
354
+ "rotateIn",
355
+ "rotateInDownLeft",
356
+ "rotateInDownRight",
357
+ "rotateInUpLeft",
358
+ "rotateInUpRight",
359
+ "rotateOut",
360
+ "rotateOutDownLeft",
361
+ "rotateOutDownRight",
362
+ "rotateOutUpLeft",
363
+ "rotateOutUpRight",
364
+ "slideInDown",
365
+ "slideInLeft",
366
+ "slideInRight",
367
+ "slideInUp",
368
+ "slideOutDown",
369
+ "slideOutLeft",
370
+ "slideOutRight",
371
+ "slideOutUp",
372
+ "hinge",
373
+ "jackInTheBox",
374
+ "rollIn",
375
+ "rollOut",
376
+ "zoomIn",
377
+ "zoomInDown",
378
+ "zoomInLeft",
379
+ "zoomInRight",
380
+ "zoomInUp",
381
+ "zoomOut",
382
+ "zoomOutDown",
383
+ "zoomOutLeft",
384
+ "zoomOutRight",
385
+ "zoomOutUp"
203
386
  ]
204
387
  },
388
+ "nano-animation/play": {
389
+ "type": "boolean",
390
+ "description": "Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when\nthe animation finishes or gets canceled.",
391
+ "options": []
392
+ },
393
+ "nano-animation/playback-rate": {
394
+ "type": "number",
395
+ "description": "Sets the animation's playback rate. The default is `1`, which plays the animation at a normal speed. Setting this\nto `2`, for example, will double the animation's speed. A negative value can be used to reverse the animation. This\nvalue can be changed without causing the animation to restart.",
396
+ "options": []
397
+ },
205
398
  "nano-checkbox/checked": {
206
399
  "type": "boolean",
207
400
  "description": "checked property that can be used to get/set the value. accepts only boolean values",
@@ -1576,6 +1769,24 @@
1576
1769
  "description": "The value of the input.",
1577
1770
  "options": []
1578
1771
  },
1772
+ "nano-intersection-observe/root": {
1773
+ "type": "\"auto\" | \"root\" | Element",
1774
+ "description": "The element that is used as the viewport for checking visibility of the target. Must be the ancestor of the target.\nDefaults to an automatic check for ancestors that `overflow: auto` or otherwise the `Document`.",
1775
+ "options": [
1776
+ "auto",
1777
+ "root"
1778
+ ]
1779
+ },
1780
+ "nano-intersection-observe/root-margin": {
1781
+ "type": "string",
1782
+ "description": "Margin around the root. Can be similar to CSS margins property, e.g. \"10px 20px 30px 40px\" (top, right, bottom, left).\nThe values can be percentages. This set of values serves to grow or shrink each side of the root element's\nbounding box before computing intersections. Defaults to zeros.",
1783
+ "options": []
1784
+ },
1785
+ "nano-intersection-observe/threshold": {
1786
+ "type": "string",
1787
+ "description": "Indicate at what percentage of the target's visibility the observer's callback should be executed.\nIf you only want to detect when visibility passes the 50% mark, you can use a value of '0.5'.\nIf you want the callback to run every time visibility passes another '25%',\nyou would specify a string of values (separated by ',') array '0, 0.25, 0.5, 0.75, 1'.\nA value of '1.0' means that the threshold isn't considered passed until every pixel is visible.",
1788
+ "options": []
1789
+ },
1579
1790
  "nano-menu/has-focus": {
1580
1791
  "type": "boolean",
1581
1792
  "description": "get the focus state of the menu @readonly",
@@ -59,11 +59,22 @@
59
59
  "infinite-scroll"
60
60
  ]
61
61
  },
62
- "nano-aspect-ratio": {
63
- "description": "Displays media in the desired aspect ratio.\nYou can slot in any replaced element, including `<iframe>`, `<img>`, and `<video>`.\nAs the element's width changes, its height will resize proportionally. Only one element should be slotted into the container.\nThe default aspect ratio is 16:9.",
62
+ "nano-animation": {
63
+ "description": "Animate elements declaratively with [~100 baked-in presets](https://animate.style/), or make your own with custom keyframes.\nPowered by the [Web Animations API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API).",
64
64
  "attributes": [
65
- "aspect-ratio",
66
- "fit"
65
+ "current-time",
66
+ "delay",
67
+ "direction",
68
+ "duration",
69
+ "easing",
70
+ "end-delay",
71
+ "fill",
72
+ "iteration-start",
73
+ "iterations",
74
+ "keyframes",
75
+ "name",
76
+ "play",
77
+ "playback-rate"
67
78
  ]
68
79
  },
69
80
  "nano-checkbox": {
@@ -411,6 +422,14 @@
411
422
  "value"
412
423
  ]
413
424
  },
425
+ "nano-intersection-observe": {
426
+ "description": "A thin, declarative interface to the IntersectionObserver API.",
427
+ "attributes": [
428
+ "root",
429
+ "root-margin",
430
+ "threshold"
431
+ ]
432
+ },
414
433
  "nano-menu": {
415
434
  "description": "Menu element. Commonly wrapped by `nano-dropdown` with `nano-option` and `nano-nav-item` elements nested.\nManages focus state / active.",
416
435
  "attributes": [
@@ -2,7 +2,7 @@
2
2
  "$schema": "http://json.schemastore.org/web-types",
3
3
  "framework": "vue",
4
4
  "name": "@nanoporetech-digital/components-vue",
5
- "version": "6.0.0",
5
+ "version": "6.1.0",
6
6
  "contributions": {
7
7
  "html": {
8
8
  "types-syntax": "typescript",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nanoporetech-digital/components-vue",
3
- "version": "6.0.1",
3
+ "version": "6.2.0",
4
4
  "description": "Vue 3 wrapper for Nano Components",
5
5
  "repository": {
6
6
  "type": "git",
@@ -52,7 +52,7 @@
52
52
  "vue-tsc": "^0.0.24"
53
53
  },
54
54
  "dependencies": {
55
- "@nanoporetech-digital/components": "^6.0.1"
55
+ "@nanoporetech-digital/components": "^6.2.0"
56
56
  },
57
57
  "jest": {
58
58
  "preset": "ts-jest",
@@ -71,7 +71,7 @@
71
71
  }
72
72
  }
73
73
  },
74
- "gitHead": "60136a1acc18966ac283a027371777eabac1ea8a",
74
+ "gitHead": "34eee952f2a62a245bb78b8e39864e1fbba0ed8e",
75
75
  "vetur": {
76
76
  "tags": "dist/vetur/tags.json",
77
77
  "attributes": "dist/vetur/attributes.json"