@tialro2/rnbokit 1.0.15 → 1.0.17

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 (21) hide show
  1. package/README.md +242 -242
  2. package/dist/RNBO.css +113 -113
  3. package/dist/RNBO.svelte +230 -230
  4. package/dist/RNBOcomponents/AudioDropIn.svelte +125 -125
  5. package/dist/RNBOcomponents/ExtMidiIn.svelte +85 -85
  6. package/dist/RNBOcomponents/ExtMidiOut.svelte +85 -85
  7. package/dist/RNBOcomponents/MicIn.svelte +80 -80
  8. package/dist/RNBOcomponents/RNBOInlet.svelte +66 -66
  9. package/dist/RNBOcomponents/RNBOInport.svelte +21 -21
  10. package/dist/RNBOcomponents/RNBOMidiIn.svelte +63 -63
  11. package/dist/RNBOcomponents/RNBOMidiOut.svelte +22 -22
  12. package/dist/RNBOcomponents/RNBOOutport.svelte +36 -36
  13. package/dist/RNBOcomponents/RNBOParam.svelte +37 -37
  14. package/dist/RNBOcomponents/XYMidiIn.svelte +93 -93
  15. package/dist/UIcomponents/Controls.svelte +12 -12
  16. package/dist/UIcomponents/FileDropZone.svelte +118 -118
  17. package/dist/UIcomponents/ProgressBar.svelte +35 -35
  18. package/dist/UIcomponents/RadioGroup.svelte +27 -27
  19. package/dist/UIcomponents/RadioItem.svelte +96 -96
  20. package/dist/index.js +20 -20
  21. package/package.json +6 -6
package/dist/UIcomponents/RadioItem.svelte CHANGED
@@ -1,96 +1,96 @@
1
- <script>
2
- /**
3
- * @typedef {Object} Props
4
- * @property {any} group
5
- * @property {any} name
6
- * @property {any} value
7
- * @property {string} [title]
8
- * @property {string} [label]
9
- * @property {import('svelte').Snippet} [children]
10
- */
11
-
12
- /** @type {Props} */
13
- let {
14
- group = $bindable(),
15
- name,
16
- value,
17
- title = '',
18
- label = '',
19
- onkeydown,
20
- onkeyup,
21
- onkeypress,
22
- onclick,
23
- onchange,
24
- children
25
- } = $props();
26
- let elemInput = $state();
27
- function onKeyDown(event) {
28
- if (['Enter', 'Space'].includes(event.code)) {
29
- event.preventDefault();
30
- elemInput.click();
31
- }
32
- onkeydown();
33
- }
34
- let checked = $derived(value === group);
35
- </script>
36
-
37
- <label>
38
- <!-- A11y attributes are not allowed on <label> -->
39
- <div
40
- class="RNBOradio-item {checked ? 'RNBOchecked' : 'RNBOhover'}"
41
- data-testid="radio-item"
42
- role="radio"
43
- aria-checked={checked}
44
- aria-label={label}
45
- tabindex="0"
46
- {title}
47
- onkeydown={onKeyDown}
48
- {onkeyup}
49
- {onkeypress}
50
- >
51
- <!-- NOTE: Don't use `hidden` as it prevents `required` from operating -->
52
- <div class="RNBOradio-input">
53
- <input
54
- bind:this={elemInput}
55
- type="radio"
56
- bind:group
57
- {name}
58
- {value}
59
- tabindex="-1"
60
- {onclick}
61
- {onchange}
62
- id="test"
63
- />
64
- </div>
65
- {@render children?.()}
66
- </div>
67
- </label>
68
-
69
- <style>
70
- .RNBOradio-item {
71
- font-size: 1rem;
72
- line-height: 1.5rem;
73
- text-align: center;
74
- flex: 1 1 auto;
75
- cursor: pointer;
76
- padding: 0.2rem;
77
- padding-left: 0.75rem;
78
- padding-right: 0.75rem;
79
- margin: 0.25rem;
80
- background-color: rgba(var(--local-accent-color), 0);
81
- border-radius: var(--local-rounded-base);
82
- }
83
- .RNBOhover:hover {
84
- background-color: rgba(var(--local-accent-color), 0.2);
85
- transition: var(--local-animation) var(--local-animation-duration);
86
- }
87
- .RNBOchecked {
88
- background-color: rgba(var(--local-accent-color), 1);
89
- transition: var(--local-animation) var(--local-animation-duration);
90
- }
91
- .RNBOradio-input {
92
- overflow: hidden;
93
- width: 0;
94
- height: 0;
95
- }
96
- </style>
1
+ <script>
2
+ /**
3
+ * @typedef {Object} Props
4
+ * @property {any} group
5
+ * @property {any} name
6
+ * @property {any} value
7
+ * @property {string} [title]
8
+ * @property {string} [label]
9
+ * @property {import('svelte').Snippet} [children]
10
+ */
11
+
12
+ /** @type {Props} */
13
+ let {
14
+ group = $bindable(),
15
+ name,
16
+ value,
17
+ title = '',
18
+ label = '',
19
+ onkeydown,
20
+ onkeyup,
21
+ onkeypress,
22
+ onclick,
23
+ onchange,
24
+ children
25
+ } = $props();
26
+ let elemInput = $state();
27
+ function onKeyDown(event) {
28
+ if (['Enter', 'Space'].includes(event.code)) {
29
+ event.preventDefault();
30
+ elemInput.click();
31
+ }
32
+ onkeydown();
33
+ }
34
+ let checked = $derived(value === group);
35
+ </script>
36
+
37
+ <label>
38
+ <!-- A11y attributes are not allowed on <label> -->
39
+ <div
40
+ class="RNBOradio-item {checked ? 'RNBOchecked' : 'RNBOhover'}"
41
+ data-testid="radio-item"
42
+ role="radio"
43
+ aria-checked={checked}
44
+ aria-label={label}
45
+ tabindex="0"
46
+ {title}
47
+ onkeydown={onKeyDown}
48
+ {onkeyup}
49
+ {onkeypress}
50
+ >
51
+ <!-- NOTE: Don't use `hidden` as it prevents `required` from operating -->
52
+ <div class="RNBOradio-input">
53
+ <input
54
+ bind:this={elemInput}
55
+ type="radio"
56
+ bind:group
57
+ {name}
58
+ {value}
59
+ tabindex="-1"
60
+ {onclick}
61
+ {onchange}
62
+ id="test"
63
+ />
64
+ </div>
65
+ {@render children?.()}
66
+ </div>
67
+ </label>
68
+
69
+ <style>
70
+ .RNBOradio-item {
71
+ font-size: 1rem;
72
+ line-height: 1.5rem;
73
+ text-align: center;
74
+ flex: 1 1 auto;
75
+ cursor: pointer;
76
+ padding: 0.2rem;
77
+ padding-left: 0.75rem;
78
+ padding-right: 0.75rem;
79
+ margin: 0.25rem;
80
+ background-color: rgba(var(--local-accent-color), 0);
81
+ border-radius: var(--local-rounded-base);
82
+ }
83
+ .RNBOhover:hover {
84
+ background-color: rgba(var(--local-accent-color), 0.2);
85
+ transition: var(--local-animation) var(--local-animation-duration);
86
+ }
87
+ .RNBOchecked {
88
+ background-color: rgba(var(--local-accent-color), 1);
89
+ transition: var(--local-animation) var(--local-animation-duration);
90
+ }
91
+ .RNBOradio-input {
92
+ overflow: hidden;
93
+ width: 0;
94
+ height: 0;
95
+ }
96
+ </style>
package/dist/index.js CHANGED
@@ -1,20 +1,20 @@
1
- // Reexport your entry components here
2
- export { default as RNBO } from './RNBO.svelte';
3
- export { default as RNBOParam } from './RNBOcomponents/RNBOParam.svelte';
4
- export { default as RNBOMidiIn } from './RNBOcomponents/RNBOMidiIn.svelte';
5
- // export { default as RNBOMidiOut } from './RNBOcomponents/RNBOMidiOut.svelte';
6
- export { default as RNBOInlet } from './RNBOcomponents/RNBOInlet.svelte';
7
- export { default as RNBOInport } from './RNBOcomponents/RNBOInport.svelte';
8
- export { default as RNBOOutport } from './RNBOcomponents/RNBOOutport.svelte';
9
-
10
- export { default as XYMidiIn } from './RNBOcomponents/XYMidiIn.svelte';
11
- export { default as ExtMidiIn } from './RNBOcomponents/ExtMidiIn.svelte';
12
- // export { default as ExtMidiOut } from './RNBOcomponents/ExtMidiOut.svelte';
13
- export { default as MicIn } from './RNBOcomponents/MicIn.svelte';
14
- export { default as AudioDropIn } from './RNBOcomponents/AudioDropIn.svelte';
15
-
16
- export { default as FileDropZone } from './UIcomponents/FileDropZone.svelte';
17
- export { default as ProgressBar } from './UIcomponents/ProgressBar.svelte';
18
- export { default as RadioGroup } from './UIcomponents/RadioGroup.svelte';
19
- export { default as RadioItem } from './UIcomponents/RadioItem.svelte';
20
- export { default as RangeSlider } from './UIcomponents/RangeSlider.svelte';
1
+ // Reexport your entry components here
2
+ export { default as RNBO } from './RNBO.svelte';
3
+ export { default as RNBOParam } from './RNBOcomponents/RNBOParam.svelte';
4
+ export { default as RNBOMidiIn } from './RNBOcomponents/RNBOMidiIn.svelte';
5
+ // export { default as RNBOMidiOut } from './RNBOcomponents/RNBOMidiOut.svelte';
6
+ export { default as RNBOInlet } from './RNBOcomponents/RNBOInlet.svelte';
7
+ export { default as RNBOInport } from './RNBOcomponents/RNBOInport.svelte';
8
+ export { default as RNBOOutport } from './RNBOcomponents/RNBOOutport.svelte';
9
+
10
+ export { default as XYMidiIn } from './RNBOcomponents/XYMidiIn.svelte';
11
+ export { default as ExtMidiIn } from './RNBOcomponents/ExtMidiIn.svelte';
12
+ // export { default as ExtMidiOut } from './RNBOcomponents/ExtMidiOut.svelte';
13
+ export { default as MicIn } from './RNBOcomponents/MicIn.svelte';
14
+ export { default as AudioDropIn } from './RNBOcomponents/AudioDropIn.svelte';
15
+
16
+ export { default as FileDropZone } from './UIcomponents/FileDropZone.svelte';
17
+ export { default as ProgressBar } from './UIcomponents/ProgressBar.svelte';
18
+ export { default as RadioGroup } from './UIcomponents/RadioGroup.svelte';
19
+ export { default as RadioItem } from './UIcomponents/RadioItem.svelte';
20
+ export { default as RangeSlider } from './UIcomponents/RangeSlider.svelte';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tialro2/rnbokit",
3
- "version": "1.0.15",
3
+ "version": "1.0.17",
4
4
  "exports": {
5
5
  ".": {
6
6
  "types": "./dist/index.d.ts",
@@ -18,20 +18,20 @@
18
18
  "devDependencies": {
19
19
  "@playwright/test": "^1.60.0",
20
20
  "@sveltejs/adapter-auto": "^7.0.1",
21
- "@sveltejs/kit": "^2.60.1",
21
+ "@sveltejs/kit": "^2.61.1",
22
22
  "@sveltejs/package": "^2.5.7",
23
23
  "@sveltejs/vite-plugin-svelte": "^7.1.2",
24
24
  "eslint": "^10.4.0",
25
25
  "eslint-config-prettier": "^10.1.8",
26
- "eslint-plugin-svelte": "^3.17.1",
26
+ "eslint-plugin-svelte": "^3.18.0",
27
27
  "prettier": "^3.8.3",
28
- "prettier-plugin-svelte": "^3.5.2",
28
+ "prettier-plugin-svelte": "^4.0.1",
29
29
  "publint": "^0.3.21",
30
- "svelte": "^5.55.9",
30
+ "svelte": "^5.55.10",
31
31
  "svelte-check": "^4.4.8",
32
32
  "tslib": "^2.8.1",
33
33
  "typescript": "^6.0.3",
34
- "vite": "^8.0.13",
34
+ "vite": "^8.0.14",
35
35
  "vitest": "^4.1.7"
36
36
  },
37
37
  "svelte": "./dist/index.js",