@antimatter-audio/antimatter-ui 10.16.5 → 11.0.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.
- package/dist/advanced/ControlGroup/ControlGroup.d.ts +10 -0
- package/dist/advanced/ControlGroup/ControlGroup.d.ts.map +1 -0
- package/dist/advanced/ModMatrix/ModMatrix.d.ts.map +1 -1
- package/dist/advanced/ModMatrix/ModMatrixCell.d.ts.map +1 -1
- package/dist/advanced/ModMatrix/ModMatrixComboboxCell.d.ts +1 -1
- package/dist/advanced/ModMatrix/ModMatrixComboboxCell.d.ts.map +1 -1
- package/dist/advanced/ModMatrix/ModMatrixRow.d.ts +1 -1
- package/dist/advanced/ModMatrix/ModMatrixRow.d.ts.map +1 -1
- package/dist/advanced/ModMatrix/constants.d.ts +1 -0
- package/dist/advanced/ModMatrix/constants.d.ts.map +1 -1
- package/dist/common/utils.d.ts +5 -0
- package/dist/common/utils.d.ts.map +1 -1
- package/dist/context/GlobalContextProvider.d.ts +7 -3
- package/dist/context/GlobalContextProvider.d.ts.map +1 -1
- package/dist/core/Button/Button.d.ts.map +1 -1
- package/dist/core/DataViz/SingleBarViz.d.ts +3 -2
- package/dist/core/DataViz/SingleBarViz.d.ts.map +1 -1
- package/dist/core/Slider/RotarySlider.d.ts.map +1 -1
- package/dist/hooks/useCombobox.d.ts +0 -1
- package/dist/hooks/useCombobox.d.ts.map +1 -1
- package/dist/hooks/useDropdown.d.ts.map +1 -1
- package/dist/hooks/useSlider.d.ts +1 -4
- package/dist/hooks/useSlider.d.ts.map +1 -1
- package/dist/index.js +708 -473
- package/dist/index.js.map +1 -1
- package/dist/src/advanced/ControlGroup/ControlGroup.d.ts +10 -0
- package/dist/src/advanced/ControlGroup/ControlGroup.d.ts.map +1 -0
- package/dist/src/advanced/ModMatrix/ModMatrix.d.ts.map +1 -1
- package/dist/src/advanced/ModMatrix/ModMatrixCell.d.ts.map +1 -1
- package/dist/src/advanced/ModMatrix/ModMatrixComboboxCell.d.ts +1 -1
- package/dist/src/advanced/ModMatrix/ModMatrixComboboxCell.d.ts.map +1 -1
- package/dist/src/advanced/ModMatrix/ModMatrixRow.d.ts +1 -1
- package/dist/src/advanced/ModMatrix/ModMatrixRow.d.ts.map +1 -1
- package/dist/src/advanced/ModMatrix/constants.d.ts +1 -0
- package/dist/src/advanced/ModMatrix/constants.d.ts.map +1 -1
- package/dist/src/common/utils.d.ts +5 -0
- package/dist/src/common/utils.d.ts.map +1 -1
- package/dist/src/context/GlobalContextProvider.d.ts +7 -3
- package/dist/src/context/GlobalContextProvider.d.ts.map +1 -1
- package/dist/src/core/Button/Button.d.ts.map +1 -1
- package/dist/src/core/DataViz/SingleBarViz.d.ts +3 -2
- package/dist/src/core/DataViz/SingleBarViz.d.ts.map +1 -1
- package/dist/src/core/Slider/RotarySlider.d.ts.map +1 -1
- package/dist/src/hooks/useCombobox.d.ts +0 -1
- package/dist/src/hooks/useCombobox.d.ts.map +1 -1
- package/dist/src/hooks/useDropdown.d.ts.map +1 -1
- package/dist/src/hooks/useSlider.d.ts +1 -4
- package/dist/src/hooks/useSlider.d.ts.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -33,8 +33,8 @@ function styleInject(css, ref) {
|
|
|
33
33
|
}
|
|
34
34
|
}
|
|
35
35
|
|
|
36
|
-
var css_248z$
|
|
37
|
-
styleInject(css_248z$
|
|
36
|
+
var css_248z$c = "@import 'tailwindcss';\n@import 'tailwindcss/base';\n@import 'tailwindcss/utilities';\n\n@theme static {\n --color-brand: #bb68d9;\n --color-brand-900: #443342;\n --color-brand-700: #932eb8;\n --color-brand-600: #826993;\n --color-brand-400: #d199e6;\n --color-brand-300: #f3d4f4;\n --color-alert: #8a0101;\n --color-text: #bab6cf;\n --color-gray-100: #c7c3de;\n --color-gray-200: #9a96ab;\n --color-gray-300: #838091;\n --color-gray-400: #595763;\n --color-gray-500: #4c4a54;\n --color-gray-600: #2e2c33;\n --color-gray-700: #1e1d21;\n --color-gray-800: #101012;\n --color-gray-900: #09090a;\n\n --color-VFDBlue-100: #0d3814;\n --color-VFDBlue-200: #234e4a;\n --color-VFDBlue-300: #128073;\n --color-VFDBlue-400: #138c6e;\n --color-VFDBlue-500: #1abe95;\n --color-VFDBlue-600: #23d8a4;\n --color-VFDBlue-700: #4aeea4;\n --color-VFDBlue-1000: #35edb4;\n --spacing-none: 0px;\n --spacing-xs: 2px;\n --spacing-sm: 4px;\n --spacing-ms: 6px;\n --spacing-md: 8px;\n --spacing-ml: 12px;\n --spacing-lg: 16px;\n --spacing-xl: 20px;\n --m-none: 0px;\n --m-xs: 2px;\n --m-sm: 4px;\n --m-ms: 6px;\n --m-md: 8px;\n --m-ml: 12px;\n --m-lg: 16px;\n --m-xl: 20px;\n --mt-none: 0px;\n --mt-xs: 2px;\n --mt-sm: 4px;\n --mt-ms: 6px;\n --mt-md: 8px;\n --mt-ml: 12px;\n --mt-lg: 16px;\n --mt-xl: 20px;\n --mr-none: 0px;\n --mr-xs: 2px;\n --mr-sm: 4px;\n --mr-ms: 6px;\n --mr-md: 8px;\n --mr-ml: 12px;\n --mr-lg: 16px;\n --mr-xl: 20px;\n --mb-none: 0px;\n --mb-xs: 2px;\n --mb-sm: 4px;\n --mb-ms: 6px;\n --mb-md: 8px;\n --mb-ml: 12px;\n --mb-lg: 16px;\n --mb-xl: 20px;\n --ml-none: 0px;\n --ml-xs: 2px;\n --ml-sm: 4px;\n --ml-ms: 6px;\n --ml-md: 8px;\n --ml-ml: 12px;\n --ml-lg: 16px;\n --ml-xl: 20px;\n --p-none: 0px;\n --p-xs: 2px;\n --p-sm: 4px;\n --p-ms: 6px;\n --p-md: 8px;\n --p-ml: 12px;\n --p-lg: 16px;\n --p-xl: 20px;\n --pt-none: 0px;\n --pt-xs: 2px;\n --pt-sm: 4px;\n --pt-ms: 6px;\n --pt-md: 8px;\n --pt-ml: 12px;\n --pt-lg: 16px;\n --pt-xl: 20px;\n --pr-none: 0px;\n --pr-xs: 2px;\n --pr-sm: 4px;\n --pr-ms: 6px;\n --pr-md: 8px;\n --pr-ml: 12px;\n --pr-lg: 16px;\n --pr-xl: 20px;\n --pb-none: 0px;\n --pb-xs: 2px;\n --pb-sm: 4px;\n --pb-ms: 6px;\n --pb-md: 8px;\n --pb-ml: 12px;\n --pb-lg: 16px;\n --pb-xl: 20px;\n --pl-none: 0px;\n --pl-xs: 2px;\n --pl-sm: 4px;\n --pl-ms: 6px;\n --pl-md: 8px;\n --pl-ml: 12px;\n --pl-lg: 16px;\n --pl-xl: 20px;\n --bg-page: #1e1d21;\n --bg-section: #1e1d21;\n --bg-popover: #09090a;\n --bg-highlighted: #838091;\n --bg-muted: #595763;\n --bg-selected: #2e2c33;\n --bg-input: #1e1d21;\n --font-leagueSpartan: 'LeagueSpartan';\n --text-xs: 0.625rem;\n --text-sm: 0.75rem;\n --text-ms: 0.813rem;\n --text-md: 0.875rem;\n --text-lg: 1rem;\n --text-xl: 1.25rem;\n --text-title: 1.75rem;\n --gap-none: 0px;\n --gap-xs: 2px;\n --gap-sm: 4px;\n --gap-ms: 6px;\n --gap-md: 8px;\n --gap-ml: 12px;\n --gap-lg: 16px;\n --gap-xl: 20px;\n}\n\ninput,\ninput:hover,\ninput:focus,\ninput:focus-visible {\n background: transparent;\n border: none;\n outline: none;\n appearance: textfield;\n}\n\nbutton,\nbutton:hover,\nbutton:focus,\nbutton:focus-visible {\n outline: none;\n}\n\nbutton:disabled,\ninput:disabled {\n cursor: not-allowed;\n}\n\ndiv:focus,\ndiv:focus-visible {\n outline: none;\n appearance: textfield;\n}\n\n@font-face {\n font-family: LeagueSpartan;\n /* ascent-override: 70%; */\n src: url('./common/assets/fonts/LeagueSpartan-Regular.ttf');\n}\n\n@font-face {\n font-family: LeagueSpartan;\n /* ascent-override: 70%; */\n src: url('./common/assets/fonts/LeagueSpartan-Thin.ttf');\n font-weight: lighter;\n}\n";
|
|
37
|
+
styleInject(css_248z$c);
|
|
38
38
|
|
|
39
39
|
var Spacing = /*#__PURE__*/ function(Spacing) {
|
|
40
40
|
Spacing["none"] = "none";
|
|
@@ -87,8 +87,8 @@ var Orientation = /*#__PURE__*/ function(Orientation) {
|
|
|
87
87
|
return Orientation;
|
|
88
88
|
}({});
|
|
89
89
|
|
|
90
|
-
var css_248z$
|
|
91
|
-
styleInject(css_248z$
|
|
90
|
+
var css_248z$b = ".Tabs {\n display: flex;\n font-size: 1rem;\n align-items: center;\n justify-content: center;\n vertical-align: middle;\n white-space: nowrap;\n text-decoration: none;\n text-transform: uppercase;\n text-align: center;\n border: 0;\n appearance: none;\n user-select: none;\n -webkit-user-select: none;\n}\n\n.Tabs-item {\n &:disabled {\n cursor: not-allowed;\n }\n}\n\n.Tabs-item::-moz-selection {\n background: transparent;\n}\n.Tabs-item::selection {\n background: transparent;\n}\n";
|
|
91
|
+
styleInject(css_248z$b);
|
|
92
92
|
|
|
93
93
|
function Tabs(param) {
|
|
94
94
|
var items = param.items, className = param.className, _param_padding = param.padding, padding = _param_padding === void 0 ? [
|
|
@@ -144,8 +144,8 @@ function Tabs(param) {
|
|
|
144
144
|
Tabs.padding = Spacing;
|
|
145
145
|
Tabs.margin = Spacing;
|
|
146
146
|
|
|
147
|
-
var css_248z$
|
|
148
|
-
styleInject(css_248z$
|
|
147
|
+
var css_248z$a = ".Button {\n font-size: var(--text-xs);\n display: flex;\n align-items: center;\n justify-content: center;\n padding-right: var(--spacing-ms);\n padding-left: var(--spacing-ms);\n cursor: pointer;\n vertical-align: middle;\n white-space: nowrap;\n text-decoration: none;\n text-align: enter;\n border: 0;\n appearance: none;\n user-select: none;\n -webkit-user-select: none;\n &.xSmall {\n width: var(--spacing-ml);\n height: var(--spacing-ml);\n }\n &.small {\n font-size: var(--text-xs);\n min-width: 1rem;\n min-height: var(--spacing-sm);\n }\n &.large {\n border-radius: var(--radius-sm);\n min-width: 1rem;\n min-height: var(--spacing-xl);\n }\n}\n";
|
|
148
|
+
styleInject(css_248z$a);
|
|
149
149
|
|
|
150
150
|
var ButtonSize = /*#__PURE__*/ function(ButtonSize) {
|
|
151
151
|
ButtonSize["xSmall"] = "xSmall";
|
|
@@ -199,13 +199,13 @@ function useObservable(param) {
|
|
|
199
199
|
};
|
|
200
200
|
}
|
|
201
201
|
|
|
202
|
-
function _array_like_to_array$
|
|
202
|
+
function _array_like_to_array$j(arr, len) {
|
|
203
203
|
if (len == null || len > arr.length) len = arr.length;
|
|
204
204
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
205
205
|
return arr2;
|
|
206
206
|
}
|
|
207
207
|
function _array_without_holes$2(arr) {
|
|
208
|
-
if (Array.isArray(arr)) return _array_like_to_array$
|
|
208
|
+
if (Array.isArray(arr)) return _array_like_to_array$j(arr);
|
|
209
209
|
}
|
|
210
210
|
function _iterable_to_array$2(iter) {
|
|
211
211
|
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
|
|
@@ -214,15 +214,15 @@ function _non_iterable_spread$2() {
|
|
|
214
214
|
throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
215
215
|
}
|
|
216
216
|
function _to_consumable_array$2(arr) {
|
|
217
|
-
return _array_without_holes$2(arr) || _iterable_to_array$2(arr) || _unsupported_iterable_to_array$
|
|
217
|
+
return _array_without_holes$2(arr) || _iterable_to_array$2(arr) || _unsupported_iterable_to_array$j(arr) || _non_iterable_spread$2();
|
|
218
218
|
}
|
|
219
|
-
function _unsupported_iterable_to_array$
|
|
219
|
+
function _unsupported_iterable_to_array$j(o, minLen) {
|
|
220
220
|
if (!o) return;
|
|
221
|
-
if (typeof o === "string") return _array_like_to_array$
|
|
221
|
+
if (typeof o === "string") return _array_like_to_array$j(o, minLen);
|
|
222
222
|
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
223
223
|
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
224
224
|
if (n === "Map" || n === "Set") return Array.from(n);
|
|
225
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$
|
|
225
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$j(o, minLen);
|
|
226
226
|
}
|
|
227
227
|
// export const roundUpToTwoDecimals = (val: number) => Math.ceil(val * 100) / 100;
|
|
228
228
|
// mocks the `normalisedToScaledValue` internal method from JUCE
|
|
@@ -336,17 +336,37 @@ var getBarTransformStyles = function(param) {
|
|
|
336
336
|
var randomizeValue = function(min, max) {
|
|
337
337
|
return Math.random() * (max - min) + min;
|
|
338
338
|
};
|
|
339
|
+
var incrementValue = function(param) {
|
|
340
|
+
var incomingVal = param.incomingVal, prevVal = param.prevVal, interval = param.interval;
|
|
341
|
+
var getNormalisedInterval = function() {
|
|
342
|
+
if (interval) {
|
|
343
|
+
if (interval >= 1) {
|
|
344
|
+
return interval * 0.01;
|
|
345
|
+
} else {
|
|
346
|
+
return interval;
|
|
347
|
+
}
|
|
348
|
+
} else {
|
|
349
|
+
return 0.01;
|
|
350
|
+
}
|
|
351
|
+
};
|
|
352
|
+
var normalisedInterval = getNormalisedInterval();
|
|
353
|
+
var newValue = (prevVal !== null && prevVal !== void 0 ? prevVal : 0) + incomingVal * // (interval && interval.toString().length > 4
|
|
354
|
+
// ? 4
|
|
355
|
+
// : 0.4) *
|
|
356
|
+
normalisedInterval;
|
|
357
|
+
return clamp(newValue);
|
|
358
|
+
};
|
|
339
359
|
|
|
340
|
-
function _array_like_to_array$
|
|
360
|
+
function _array_like_to_array$i(arr, len) {
|
|
341
361
|
if (len == null || len > arr.length) len = arr.length;
|
|
342
362
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
343
363
|
return arr2;
|
|
344
364
|
}
|
|
345
|
-
function _array_with_holes$
|
|
365
|
+
function _array_with_holes$i(arr) {
|
|
346
366
|
if (Array.isArray(arr)) return arr;
|
|
347
367
|
}
|
|
348
368
|
function _array_without_holes$1(arr) {
|
|
349
|
-
if (Array.isArray(arr)) return _array_like_to_array$
|
|
369
|
+
if (Array.isArray(arr)) return _array_like_to_array$i(arr);
|
|
350
370
|
}
|
|
351
371
|
function asyncGeneratorStep$4(gen, resolve, reject, _next, _throw, key, arg) {
|
|
352
372
|
try {
|
|
@@ -393,7 +413,7 @@ function _define_property$k(obj, key, value) {
|
|
|
393
413
|
function _iterable_to_array$1(iter) {
|
|
394
414
|
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
|
|
395
415
|
}
|
|
396
|
-
function _iterable_to_array_limit$
|
|
416
|
+
function _iterable_to_array_limit$i(arr, i) {
|
|
397
417
|
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
398
418
|
if (_i == null) return;
|
|
399
419
|
var _arr = [];
|
|
@@ -417,7 +437,7 @@ function _iterable_to_array_limit$g(arr, i) {
|
|
|
417
437
|
}
|
|
418
438
|
return _arr;
|
|
419
439
|
}
|
|
420
|
-
function _non_iterable_rest$
|
|
440
|
+
function _non_iterable_rest$i() {
|
|
421
441
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
422
442
|
}
|
|
423
443
|
function _non_iterable_spread$1() {
|
|
@@ -457,19 +477,19 @@ function _object_spread_props$4(target, source) {
|
|
|
457
477
|
}
|
|
458
478
|
return target;
|
|
459
479
|
}
|
|
460
|
-
function _sliced_to_array$
|
|
461
|
-
return _array_with_holes$
|
|
480
|
+
function _sliced_to_array$i(arr, i) {
|
|
481
|
+
return _array_with_holes$i(arr) || _iterable_to_array_limit$i(arr, i) || _unsupported_iterable_to_array$i(arr, i) || _non_iterable_rest$i();
|
|
462
482
|
}
|
|
463
483
|
function _to_consumable_array$1(arr) {
|
|
464
|
-
return _array_without_holes$1(arr) || _iterable_to_array$1(arr) || _unsupported_iterable_to_array$
|
|
484
|
+
return _array_without_holes$1(arr) || _iterable_to_array$1(arr) || _unsupported_iterable_to_array$i(arr) || _non_iterable_spread$1();
|
|
465
485
|
}
|
|
466
|
-
function _unsupported_iterable_to_array$
|
|
486
|
+
function _unsupported_iterable_to_array$i(o, minLen) {
|
|
467
487
|
if (!o) return;
|
|
468
|
-
if (typeof o === "string") return _array_like_to_array$
|
|
488
|
+
if (typeof o === "string") return _array_like_to_array$i(o, minLen);
|
|
469
489
|
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
470
490
|
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
471
491
|
if (n === "Map" || n === "Set") return Array.from(n);
|
|
472
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$
|
|
492
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$i(o, minLen);
|
|
473
493
|
}
|
|
474
494
|
function _ts_generator$4(thisArg, body) {
|
|
475
495
|
var f, y, t, _ = {
|
|
@@ -615,19 +635,22 @@ var reducer = function(state, action) {
|
|
|
615
635
|
allParameters: action.payload
|
|
616
636
|
});
|
|
617
637
|
case 'MOD_SLOTS_RECEIVED':
|
|
618
|
-
var _action_payload;
|
|
619
638
|
return _object_spread_props$4(_object_spread$k({}, state), {
|
|
620
639
|
modSlotIds: action.payload.map(function(val) {
|
|
621
640
|
return val[0];
|
|
622
|
-
})
|
|
641
|
+
})
|
|
642
|
+
});
|
|
643
|
+
case 'MOD_SLOT_ROW_TARGETS_RECEIVED':
|
|
644
|
+
var _action_payload;
|
|
645
|
+
return _object_spread_props$4(_object_spread$k({}, state), {
|
|
623
646
|
modSlotTargets: action === null || action === void 0 ? void 0 : (_action_payload = action.payload) === null || _action_payload === void 0 ? void 0 : _action_payload.reduce(function(acc, val) {
|
|
624
647
|
return _object_spread_props$4(_object_spread$k({}, acc), _define_property$k({}, val[0], val[1]));
|
|
625
648
|
}, {})
|
|
626
649
|
});
|
|
627
|
-
case '
|
|
650
|
+
case 'MOD_SLOT_ROW_TARGET_UPDATED':
|
|
628
651
|
var _action_payload1, _action_payload2;
|
|
629
652
|
return _object_spread_props$4(_object_spread$k({}, state), {
|
|
630
|
-
modSlotTargets: _object_spread_props$4(_object_spread$k({}, state === null || state === void 0 ? void 0 : state.modSlotTargets), _define_property$k({}, (_action_payload1 = action.payload) === null || _action_payload1 === void 0 ? void 0 : _action_payload1
|
|
653
|
+
modSlotTargets: _object_spread_props$4(_object_spread$k({}, state === null || state === void 0 ? void 0 : state.modSlotTargets), _define_property$k({}, (_action_payload1 = action.payload) === null || _action_payload1 === void 0 ? void 0 : _action_payload1.id, action === null || action === void 0 ? void 0 : (_action_payload2 = action.payload) === null || _action_payload2 === void 0 ? void 0 : _action_payload2.value))
|
|
631
654
|
});
|
|
632
655
|
case 'MOD_SLOT_PREVIEW_TARGET_INDEX_UPDATED':
|
|
633
656
|
{
|
|
@@ -708,7 +731,7 @@ function useGlobalContext(selector) {
|
|
|
708
731
|
// Context provider
|
|
709
732
|
function GlobalContextProvider(param) {
|
|
710
733
|
var children = param.children;
|
|
711
|
-
var _useReducer = _sliced_to_array$
|
|
734
|
+
var _useReducer = _sliced_to_array$i(useReducer(reducer, defaultGlobalStateValue), 2), state = _useReducer[0], dispatch = _useReducer[1];
|
|
712
735
|
var highlightedItemChanged = useCallback(function(highlightedItem) {
|
|
713
736
|
dispatch({
|
|
714
737
|
type: 'HIGHLIGHTED_ITEM_CHANGED',
|
|
@@ -762,6 +785,18 @@ function GlobalContextProvider(param) {
|
|
|
762
785
|
payload: modSlots
|
|
763
786
|
});
|
|
764
787
|
}, []);
|
|
788
|
+
var modSlotRowTargetsReceived = useCallback(function(modSlots) {
|
|
789
|
+
dispatch({
|
|
790
|
+
type: 'MOD_SLOT_ROW_TARGETS_RECEIVED',
|
|
791
|
+
payload: modSlots
|
|
792
|
+
});
|
|
793
|
+
}, []);
|
|
794
|
+
var modSlotRowTargetUpdated = useCallback(function(modSlot) {
|
|
795
|
+
dispatch({
|
|
796
|
+
type: 'MOD_SLOT_ROW_TARGET_UPDATED',
|
|
797
|
+
payload: modSlot
|
|
798
|
+
});
|
|
799
|
+
}, []);
|
|
765
800
|
var modSlotPreviewTargetIndexUpdated = useCallback(function(targetIndex) {
|
|
766
801
|
dispatch({
|
|
767
802
|
type: 'MOD_SLOT_PREVIEW_TARGET_INDEX_UPDATED',
|
|
@@ -792,12 +827,6 @@ function GlobalContextProvider(param) {
|
|
|
792
827
|
payload: null
|
|
793
828
|
});
|
|
794
829
|
}, []);
|
|
795
|
-
var modSlotTargetUpdated = useCallback(function(modSlot) {
|
|
796
|
-
dispatch({
|
|
797
|
-
type: 'MOD_SLOT_TARGETS_UPDATED',
|
|
798
|
-
payload: modSlot
|
|
799
|
-
});
|
|
800
|
-
}, []);
|
|
801
830
|
var modSlotParamsListReceived = useCallback(function(modSlotParams) {
|
|
802
831
|
dispatch({
|
|
803
832
|
type: 'MOD_SLOT_PARAMS_LIST_RECEIVED',
|
|
@@ -834,69 +863,104 @@ function GlobalContextProvider(param) {
|
|
|
834
863
|
var paramIndex = state === null || state === void 0 ? void 0 : state.allParameters.indexOf(id);
|
|
835
864
|
return state === null || state === void 0 ? void 0 : state.defaultParamValues[paramIndex];
|
|
836
865
|
};
|
|
837
|
-
|
|
866
|
+
// const setModSlotTarget = (newTarget: number, rowId: string) => {
|
|
867
|
+
// const comboBoxState = Juce.getComboBoxState(rowId);
|
|
868
|
+
// comboBoxState?.setChoiceIndex(newTarget);
|
|
869
|
+
// };
|
|
870
|
+
var refetchModSlots = function() {
|
|
871
|
+
return _async_to_generator$4(function() {
|
|
872
|
+
var getAllModSlotsFunc, modSlotsData, e;
|
|
873
|
+
return _ts_generator$4(this, function(_state) {
|
|
874
|
+
switch(_state.label){
|
|
875
|
+
case 0:
|
|
876
|
+
_state.trys.push([
|
|
877
|
+
0,
|
|
878
|
+
2,
|
|
879
|
+
,
|
|
880
|
+
3
|
|
881
|
+
]);
|
|
882
|
+
getAllModSlotsFunc = Juce.getNativeFunction('getAllModSlots');
|
|
883
|
+
return [
|
|
884
|
+
4,
|
|
885
|
+
getAllModSlotsFunc()
|
|
886
|
+
];
|
|
887
|
+
case 1:
|
|
888
|
+
modSlotsData = _state.sent();
|
|
889
|
+
modSlotRowTargetsReceived(modSlotsData || []);
|
|
890
|
+
return [
|
|
891
|
+
3,
|
|
892
|
+
3
|
|
893
|
+
];
|
|
894
|
+
case 2:
|
|
895
|
+
e = _state.sent();
|
|
896
|
+
console.log(e);
|
|
897
|
+
return [
|
|
898
|
+
3,
|
|
899
|
+
3
|
|
900
|
+
];
|
|
901
|
+
case 3:
|
|
902
|
+
return [
|
|
903
|
+
2
|
|
904
|
+
];
|
|
905
|
+
}
|
|
906
|
+
});
|
|
907
|
+
})();
|
|
908
|
+
};
|
|
909
|
+
var setModSlotRowTargetAsPreview = function(param) {
|
|
910
|
+
var paramIndex = param.paramIndex, paramId = param.paramId;
|
|
838
911
|
var _Object_values;
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
912
|
+
// Setting a row target for a preview row enables the preview row to be interactive.
|
|
913
|
+
// This row target will not be saved to Juce until a user sets a new value for one of the inputs in the row.
|
|
914
|
+
// This function only stores the target in local state and does NOT save anything to the Juce state.
|
|
915
|
+
var targetIndex = paramId ? state.automatableParamsList.indexOf(paramId) : paramIndex;
|
|
916
|
+
if (!((_Object_values = Object.values(state.modSlotTargets)) === null || _Object_values === void 0 ? void 0 : _Object_values.includes(targetIndex))) {
|
|
917
|
+
setNewModSlotPreview();
|
|
918
|
+
modSlotPreviewTargetIndexUpdated(targetIndex);
|
|
842
919
|
modSlotPreviewIsEditableUpdated(true);
|
|
843
920
|
}
|
|
844
921
|
};
|
|
845
|
-
var
|
|
846
|
-
var _state_modSlotPreview, _state_modSlotPreview1
|
|
847
|
-
var rowState = Juce.getComboBoxState(
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
,
|
|
859
|
-
3
|
|
860
|
-
]);
|
|
861
|
-
getAllModSlotsFunc = Juce.getNativeFunction('getAllModSlots');
|
|
862
|
-
return [
|
|
863
|
-
4,
|
|
864
|
-
getAllModSlotsFunc()
|
|
865
|
-
];
|
|
866
|
-
case 1:
|
|
867
|
-
modSlotsData = _state.sent();
|
|
868
|
-
modSlotsReceived(modSlotsData || []);
|
|
869
|
-
return [
|
|
870
|
-
3,
|
|
871
|
-
3
|
|
872
|
-
];
|
|
873
|
-
case 2:
|
|
874
|
-
e = _state.sent();
|
|
875
|
-
console.log(e);
|
|
876
|
-
return [
|
|
877
|
-
3,
|
|
878
|
-
3
|
|
879
|
-
];
|
|
880
|
-
case 3:
|
|
881
|
-
return [
|
|
882
|
-
2
|
|
883
|
-
];
|
|
884
|
-
}
|
|
885
|
-
});
|
|
886
|
-
})();
|
|
887
|
-
};
|
|
888
|
-
if (defaultParameter !== null && defaultParameter !== undefined && value !== defaultParameter && rowId === ((_state_modSlotPreview1 = state.modSlotPreview) === null || _state_modSlotPreview1 === void 0 ? void 0 : _state_modSlotPreview1.slotId) && ((_state_modSlotPreview2 = state.modSlotPreview) === null || _state_modSlotPreview2 === void 0 ? void 0 : _state_modSlotPreview2.slotId) && ((_state_modSlotPreview3 = state.modSlotPreview) === null || _state_modSlotPreview3 === void 0 ? void 0 : _state_modSlotPreview3.targetIndex)) {
|
|
889
|
-
var _state_modSlotPreview4;
|
|
890
|
-
modSlotTargetUpdated([
|
|
891
|
-
state.modSlotPreview.slotId,
|
|
892
|
-
state.modSlotPreview.targetIndex
|
|
893
|
-
]);
|
|
894
|
-
rowState === null || rowState === void 0 ? void 0 : rowState.setChoiceIndex((_state_modSlotPreview4 = state.modSlotPreview) === null || _state_modSlotPreview4 === void 0 ? void 0 : _state_modSlotPreview4.targetIndex);
|
|
922
|
+
var saveModSlotPreviewRowTargetToBackend = function(value, rowId) {
|
|
923
|
+
var _state_modSlotPreview, _state_modSlotPreview1;
|
|
924
|
+
var rowState = Juce.getComboBoxState(rowId);
|
|
925
|
+
// If the row is a preview row, setting a target will remove the row's preview status.
|
|
926
|
+
// In this scenario, we want to clear the current row's preview status and set a new preview row (if there is an unassigned mod slot available)
|
|
927
|
+
var defaultParameter = getDefaultParameter(rowId);
|
|
928
|
+
if (((_state_modSlotPreview = state.modSlotPreview) === null || _state_modSlotPreview === void 0 ? void 0 : _state_modSlotPreview.slotId) && ((_state_modSlotPreview1 = state.modSlotPreview) === null || _state_modSlotPreview1 === void 0 ? void 0 : _state_modSlotPreview1.targetIndex) && defaultParameter !== null && defaultParameter !== undefined && value !== defaultParameter) {
|
|
929
|
+
var _state_modSlotPreview2;
|
|
930
|
+
modSlotRowTargetUpdated({
|
|
931
|
+
id: state.modSlotPreview.slotId,
|
|
932
|
+
value: state.modSlotPreview.targetIndex
|
|
933
|
+
});
|
|
934
|
+
rowState === null || rowState === void 0 ? void 0 : rowState.setChoiceIndex((_state_modSlotPreview2 = state.modSlotPreview) === null || _state_modSlotPreview2 === void 0 ? void 0 : _state_modSlotPreview2.targetIndex);
|
|
895
935
|
clearModSlotPreview();
|
|
896
936
|
setNewModSlotPreview();
|
|
897
937
|
refetchModSlots();
|
|
898
938
|
}
|
|
899
939
|
};
|
|
940
|
+
var updateModSlotRowTarget = function(value, rowId) {
|
|
941
|
+
// An index of 0 = 'none' in the mod slot target list.
|
|
942
|
+
// If the new row target value is 0, the user is deleting the row's target.
|
|
943
|
+
// Clear all of the values that have been set for that target on the front end and in JUCE.
|
|
944
|
+
console.log(value, state.modSlotPreview, rowId, 'value, state.modSlotPreview, rowId,in context');
|
|
945
|
+
var rowState = Juce.getComboBoxState(rowId);
|
|
946
|
+
rowState === null || rowState === void 0 ? void 0 : rowState.setChoiceIndex(value);
|
|
947
|
+
if (rowId === state.modSlotPreview.slotId) {
|
|
948
|
+
clearModSlotPreview();
|
|
949
|
+
}
|
|
950
|
+
if (value === 0) {
|
|
951
|
+
var _state_modSlotParams_rowId, _state_modSlotParams;
|
|
952
|
+
state === null || state === void 0 ? void 0 : (_state_modSlotParams = state.modSlotParams) === null || _state_modSlotParams === void 0 ? void 0 : (_state_modSlotParams_rowId = _state_modSlotParams[rowId]) === null || _state_modSlotParams_rowId === void 0 ? void 0 : _state_modSlotParams_rowId.forEach(function(item) {
|
|
953
|
+
setDefaultParameter(item);
|
|
954
|
+
});
|
|
955
|
+
clearModSlotPreview();
|
|
956
|
+
setNewModSlotPreview();
|
|
957
|
+
}
|
|
958
|
+
modSlotRowTargetUpdated({
|
|
959
|
+
id: rowId,
|
|
960
|
+
value: value
|
|
961
|
+
});
|
|
962
|
+
refetchModSlots();
|
|
963
|
+
};
|
|
900
964
|
var onFire = function() {
|
|
901
965
|
//@ts-expect-error
|
|
902
966
|
window.__JUCE__.backend.emitEvent('setRandom', {});
|
|
@@ -922,11 +986,13 @@ function GlobalContextProvider(param) {
|
|
|
922
986
|
setDefaultParameter: setDefaultParameter,
|
|
923
987
|
getDefaultParameter: getDefaultParameter,
|
|
924
988
|
modSlotsReceived: modSlotsReceived,
|
|
925
|
-
|
|
989
|
+
modSlotRowTargetsReceived: modSlotRowTargetsReceived,
|
|
990
|
+
// setModSlotTarget,
|
|
926
991
|
modSlotParamsListReceived: modSlotParamsListReceived,
|
|
927
992
|
modSlotParamLabelsReceived: modSlotParamLabelsReceived,
|
|
928
|
-
|
|
929
|
-
|
|
993
|
+
setModSlotRowTargetAsPreview: setModSlotRowTargetAsPreview,
|
|
994
|
+
saveModSlotPreviewRowTargetToBackend: saveModSlotPreviewRowTargetToBackend,
|
|
995
|
+
updateModSlotRowTarget: updateModSlotRowTarget,
|
|
930
996
|
useRandom: useRandom
|
|
931
997
|
};
|
|
932
998
|
return /*#__PURE__*/ React__default.createElement(GlobalContext.Provider, {
|
|
@@ -934,12 +1000,12 @@ function GlobalContextProvider(param) {
|
|
|
934
1000
|
}, children);
|
|
935
1001
|
}
|
|
936
1002
|
|
|
937
|
-
function _array_like_to_array$
|
|
1003
|
+
function _array_like_to_array$h(arr, len) {
|
|
938
1004
|
if (len == null || len > arr.length) len = arr.length;
|
|
939
1005
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
940
1006
|
return arr2;
|
|
941
1007
|
}
|
|
942
|
-
function _array_with_holes$
|
|
1008
|
+
function _array_with_holes$h(arr) {
|
|
943
1009
|
if (Array.isArray(arr)) return arr;
|
|
944
1010
|
}
|
|
945
1011
|
function _define_property$j(obj, key, value) {
|
|
@@ -955,7 +1021,7 @@ function _define_property$j(obj, key, value) {
|
|
|
955
1021
|
}
|
|
956
1022
|
return obj;
|
|
957
1023
|
}
|
|
958
|
-
function _iterable_to_array_limit$
|
|
1024
|
+
function _iterable_to_array_limit$h(arr, i) {
|
|
959
1025
|
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
960
1026
|
if (_i == null) return;
|
|
961
1027
|
var _arr = [];
|
|
@@ -979,7 +1045,7 @@ function _iterable_to_array_limit$f(arr, i) {
|
|
|
979
1045
|
}
|
|
980
1046
|
return _arr;
|
|
981
1047
|
}
|
|
982
|
-
function _non_iterable_rest$
|
|
1048
|
+
function _non_iterable_rest$h() {
|
|
983
1049
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
984
1050
|
}
|
|
985
1051
|
function _object_spread$j(target) {
|
|
@@ -997,16 +1063,16 @@ function _object_spread$j(target) {
|
|
|
997
1063
|
}
|
|
998
1064
|
return target;
|
|
999
1065
|
}
|
|
1000
|
-
function _sliced_to_array$
|
|
1001
|
-
return _array_with_holes$
|
|
1066
|
+
function _sliced_to_array$h(arr, i) {
|
|
1067
|
+
return _array_with_holes$h(arr) || _iterable_to_array_limit$h(arr, i) || _unsupported_iterable_to_array$h(arr, i) || _non_iterable_rest$h();
|
|
1002
1068
|
}
|
|
1003
|
-
function _unsupported_iterable_to_array$
|
|
1069
|
+
function _unsupported_iterable_to_array$h(o, minLen) {
|
|
1004
1070
|
if (!o) return;
|
|
1005
|
-
if (typeof o === "string") return _array_like_to_array$
|
|
1071
|
+
if (typeof o === "string") return _array_like_to_array$h(o, minLen);
|
|
1006
1072
|
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
1007
1073
|
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
1008
1074
|
if (n === "Map" || n === "Set") return Array.from(n);
|
|
1009
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$
|
|
1075
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$h(o, minLen);
|
|
1010
1076
|
}
|
|
1011
1077
|
function Button(param) {
|
|
1012
1078
|
var disabled = param.disabled, text = param.text, id = param.id, className = param.className, style = param.style, onClick = param.onClick, children = param.children, _param_padding = param.padding, padding = _param_padding === void 0 ? [
|
|
@@ -1014,10 +1080,10 @@ function Button(param) {
|
|
|
1014
1080
|
] : _param_padding, _param_margin = param.margin, margin = _param_margin === void 0 ? [
|
|
1015
1081
|
Spacing.none
|
|
1016
1082
|
] : _param_margin, _param_type = param.type, type = _param_type === void 0 ? ButtonType.latch : _param_type, _param_size = param.size, size = _param_size === void 0 ? ButtonSize.large : _param_size;
|
|
1017
|
-
var _React_useState = _sliced_to_array$
|
|
1083
|
+
var _React_useState = _sliced_to_array$h(React__default.useState(false), 2), isSelected = _React_useState[0], setIsSelected = _React_useState[1];
|
|
1018
1084
|
var buttonState = Juce.getToggleState(id);
|
|
1019
1085
|
var isLocalhost = window.location.hostname === 'localhost';
|
|
1020
|
-
var
|
|
1086
|
+
var setModSlotRowTargetAsPreview = useGlobalContext().setModSlotRowTargetAsPreview;
|
|
1021
1087
|
// Update the local state when the ID changes
|
|
1022
1088
|
useEffect(function() {
|
|
1023
1089
|
setIsSelected(buttonState === null || buttonState === void 0 ? void 0 : buttonState.value);
|
|
@@ -1038,7 +1104,10 @@ function Button(param) {
|
|
|
1038
1104
|
}
|
|
1039
1105
|
});
|
|
1040
1106
|
var handleMouseDown = function(e) {
|
|
1041
|
-
|
|
1107
|
+
// TODO: handle this in a callback?
|
|
1108
|
+
setModSlotRowTargetAsPreview({
|
|
1109
|
+
paramId: id
|
|
1110
|
+
});
|
|
1042
1111
|
if (!onClick) {
|
|
1043
1112
|
e.preventDefault();
|
|
1044
1113
|
if (type === ButtonType.momentary) {
|
|
@@ -1091,18 +1160,18 @@ Button.margin = Spacing;
|
|
|
1091
1160
|
Button.type = ButtonType;
|
|
1092
1161
|
Button.size = ButtonSize;
|
|
1093
1162
|
|
|
1094
|
-
var css_248z$
|
|
1095
|
-
styleInject(css_248z$
|
|
1163
|
+
var css_248z$9 = ".Dropdown-button {\n font-size: var(--text-sm);\n display: flex;\n align-items: center;\n justify-content: center;\n padding: var(--spacing-lg);\n cursor: pointer;\n vertical-align: middle;\n white-space: nowrap;\n text-decoration: none;\n text-transform: uppercase;\n text-align: center;\n border-radius: var(--radius-sm);\n appearance: none;\n user-select: none;\n -webkit-user-select: none;\n height: var(--spacing-xl);\n background: var(--color-gray-800);\n color: var(--color-text);\n &:hover,\n &:focus,\n &:active {\n outline: none;\n background-color: var(--bg-highlighted);\n }\n &:disabled {\n cursor: not-allowed;\n }\n}\n\n.Dropdown-items {\n border: 2px solid;\n}\n\n.Dropdown-item {\n background-color: var(--bg-page);\n font-size: var(--text-sm);\n padding: var(--spacing-md) var(--spacing-xl);\n min-width: 100px;\n color: var(--color-text);\n cursor: pointer;\n text-align: center;\n text-transform: uppercase;\n font-weight: bold;\n}\n\n.Dropdown-item[data-selected] {\n background-color: var(--bg-popover);\n color: var(--color-text);\n}\n\n.Dropdown-item[data-active] {\n background-color: var(--bg-popover);\n color: var(--color-text);\n}\n";
|
|
1164
|
+
styleInject(css_248z$9);
|
|
1096
1165
|
|
|
1097
|
-
function _array_like_to_array$
|
|
1166
|
+
function _array_like_to_array$g(arr, len) {
|
|
1098
1167
|
if (len == null || len > arr.length) len = arr.length;
|
|
1099
1168
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
1100
1169
|
return arr2;
|
|
1101
1170
|
}
|
|
1102
|
-
function _array_with_holes$
|
|
1171
|
+
function _array_with_holes$g(arr) {
|
|
1103
1172
|
if (Array.isArray(arr)) return arr;
|
|
1104
1173
|
}
|
|
1105
|
-
function _iterable_to_array_limit$
|
|
1174
|
+
function _iterable_to_array_limit$g(arr, i) {
|
|
1106
1175
|
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
1107
1176
|
if (_i == null) return;
|
|
1108
1177
|
var _arr = [];
|
|
@@ -1126,27 +1195,28 @@ function _iterable_to_array_limit$e(arr, i) {
|
|
|
1126
1195
|
}
|
|
1127
1196
|
return _arr;
|
|
1128
1197
|
}
|
|
1129
|
-
function _non_iterable_rest$
|
|
1198
|
+
function _non_iterable_rest$g() {
|
|
1130
1199
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
1131
1200
|
}
|
|
1132
|
-
function _sliced_to_array$
|
|
1133
|
-
return _array_with_holes$
|
|
1201
|
+
function _sliced_to_array$g(arr, i) {
|
|
1202
|
+
return _array_with_holes$g(arr) || _iterable_to_array_limit$g(arr, i) || _unsupported_iterable_to_array$g(arr, i) || _non_iterable_rest$g();
|
|
1134
1203
|
}
|
|
1135
|
-
function _unsupported_iterable_to_array$
|
|
1204
|
+
function _unsupported_iterable_to_array$g(o, minLen) {
|
|
1136
1205
|
if (!o) return;
|
|
1137
|
-
if (typeof o === "string") return _array_like_to_array$
|
|
1206
|
+
if (typeof o === "string") return _array_like_to_array$g(o, minLen);
|
|
1138
1207
|
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
1139
1208
|
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
1140
1209
|
if (n === "Map" || n === "Set") return Array.from(n);
|
|
1141
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$
|
|
1210
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$g(o, minLen);
|
|
1142
1211
|
}
|
|
1143
1212
|
var useDropdown = function(param) {
|
|
1144
|
-
var id = param.id,
|
|
1213
|
+
var id = param.id, // TODO: Is there a better way to handle mod matrix dropdowns?
|
|
1214
|
+
rowId = param.rowId, label = param.label, _param_items = param.items, items = _param_items === void 0 ? [] : _param_items, _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, filter = param.filter, onChange = param.onChange, _param_displayValInHeader = param.displayValInHeader, displayValInHeader = _param_displayValInHeader === void 0 ? true : _param_displayValInHeader;
|
|
1145
1215
|
var _properties_choices;
|
|
1146
1216
|
var comboBoxState = Juce.getComboBoxState(id);
|
|
1147
|
-
var _useState = _sliced_to_array$
|
|
1148
|
-
var _useState1 = _sliced_to_array$
|
|
1149
|
-
var _useGlobalContext = useGlobalContext(), highlightedItemChanged = _useGlobalContext.highlightedItemChanged,
|
|
1217
|
+
var _useState = _sliced_to_array$g(useState(comboBoxState.getChoiceIndex()), 2), index = _useState[0], setIndex = _useState[1];
|
|
1218
|
+
var _useState1 = _sliced_to_array$g(useState(comboBoxState.properties), 2), properties = _useState1[0], setProperties = _useState1[1];
|
|
1219
|
+
var _useGlobalContext = useGlobalContext(), highlightedItemChanged = _useGlobalContext.highlightedItemChanged, setModSlotRowTargetAsPreview = _useGlobalContext.setModSlotRowTargetAsPreview;
|
|
1150
1220
|
var choices = items.length ? items : (properties === null || properties === void 0 ? void 0 : (_properties_choices = properties.choices) === null || _properties_choices === void 0 ? void 0 : _properties_choices.length) ? properties === null || properties === void 0 ? void 0 : properties.choices : [];
|
|
1151
1221
|
var filteredChoices = filter ? choices === null || choices === void 0 ? void 0 : choices.filter(function(item) {
|
|
1152
1222
|
var _item_;
|
|
@@ -1159,8 +1229,9 @@ var useDropdown = function(param) {
|
|
|
1159
1229
|
if (choiceIndex !== prevIndex.current) {
|
|
1160
1230
|
comboBoxState.setChoiceIndex(choiceIndex);
|
|
1161
1231
|
setIndex(choiceIndex);
|
|
1232
|
+
// TODO: Is there a better way to do this?
|
|
1162
1233
|
if (rowId) {
|
|
1163
|
-
onChange && onChange(choiceIndex,
|
|
1234
|
+
onChange && onChange(choiceIndex, rowId);
|
|
1164
1235
|
} else {
|
|
1165
1236
|
onChange && onChange(choiceIndex, id);
|
|
1166
1237
|
}
|
|
@@ -1206,7 +1277,9 @@ var useDropdown = function(param) {
|
|
|
1206
1277
|
}
|
|
1207
1278
|
};
|
|
1208
1279
|
var onClick = function() {
|
|
1209
|
-
|
|
1280
|
+
setModSlotRowTargetAsPreview({
|
|
1281
|
+
paramId: id
|
|
1282
|
+
});
|
|
1210
1283
|
};
|
|
1211
1284
|
return {
|
|
1212
1285
|
value: choices[index],
|
|
@@ -1528,15 +1601,15 @@ function Dropdown(param) {
|
|
|
1528
1601
|
}));
|
|
1529
1602
|
}
|
|
1530
1603
|
|
|
1531
|
-
var css_248z$
|
|
1532
|
-
styleInject(css_248z$
|
|
1604
|
+
var css_248z$8 = ".TextInput {\n pointer-events: auto;\n /* font-size: var(--text-xs); */\n}\n\n.TextInput::-moz-selection {\n background: transparent;\n}\n.TextInput::selection {\n background: transparent;\n}\n\n.TextInput:disabled {\n -webkit-user-select: none;\n user-select: none;\n}\n";
|
|
1605
|
+
styleInject(css_248z$8);
|
|
1533
1606
|
|
|
1534
|
-
function _array_like_to_array$
|
|
1607
|
+
function _array_like_to_array$f(arr, len) {
|
|
1535
1608
|
if (len == null || len > arr.length) len = arr.length;
|
|
1536
1609
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
1537
1610
|
return arr2;
|
|
1538
1611
|
}
|
|
1539
|
-
function _array_with_holes$
|
|
1612
|
+
function _array_with_holes$f(arr) {
|
|
1540
1613
|
if (Array.isArray(arr)) return arr;
|
|
1541
1614
|
}
|
|
1542
1615
|
function _define_property$f(obj, key, value) {
|
|
@@ -1552,7 +1625,7 @@ function _define_property$f(obj, key, value) {
|
|
|
1552
1625
|
}
|
|
1553
1626
|
return obj;
|
|
1554
1627
|
}
|
|
1555
|
-
function _iterable_to_array_limit$
|
|
1628
|
+
function _iterable_to_array_limit$f(arr, i) {
|
|
1556
1629
|
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
1557
1630
|
if (_i == null) return;
|
|
1558
1631
|
var _arr = [];
|
|
@@ -1576,7 +1649,7 @@ function _iterable_to_array_limit$d(arr, i) {
|
|
|
1576
1649
|
}
|
|
1577
1650
|
return _arr;
|
|
1578
1651
|
}
|
|
1579
|
-
function _non_iterable_rest$
|
|
1652
|
+
function _non_iterable_rest$f() {
|
|
1580
1653
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
1581
1654
|
}
|
|
1582
1655
|
function _object_spread$f(target) {
|
|
@@ -1594,16 +1667,16 @@ function _object_spread$f(target) {
|
|
|
1594
1667
|
}
|
|
1595
1668
|
return target;
|
|
1596
1669
|
}
|
|
1597
|
-
function _sliced_to_array$
|
|
1598
|
-
return _array_with_holes$
|
|
1670
|
+
function _sliced_to_array$f(arr, i) {
|
|
1671
|
+
return _array_with_holes$f(arr) || _iterable_to_array_limit$f(arr, i) || _unsupported_iterable_to_array$f(arr, i) || _non_iterable_rest$f();
|
|
1599
1672
|
}
|
|
1600
|
-
function _unsupported_iterable_to_array$
|
|
1673
|
+
function _unsupported_iterable_to_array$f(o, minLen) {
|
|
1601
1674
|
if (!o) return;
|
|
1602
|
-
if (typeof o === "string") return _array_like_to_array$
|
|
1675
|
+
if (typeof o === "string") return _array_like_to_array$f(o, minLen);
|
|
1603
1676
|
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
1604
1677
|
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
1605
1678
|
if (n === "Map" || n === "Set") return Array.from(n);
|
|
1606
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$
|
|
1679
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$f(o, minLen);
|
|
1607
1680
|
}
|
|
1608
1681
|
// import { decimalToPercent, percentToDecimal } from '../../common/utils';
|
|
1609
1682
|
// import debounce from 'lodash.debounce';
|
|
@@ -1615,9 +1688,9 @@ var InputTypes = /*#__PURE__*/ function(InputTypes) {
|
|
|
1615
1688
|
function Input(param) {
|
|
1616
1689
|
var onComplete = param.onComplete, value = param.value; param.min; param.max; var _param_fontSize = param.fontSize, fontSize = _param_fontSize === void 0 ? FontSizes.xSmall : _param_fontSize, style = param.style, className = param.className, id = param.id, _param_textColor = param.textColor, textColor = _param_textColor === void 0 ? 'var(--color-text)' : _param_textColor;
|
|
1617
1690
|
var _inputRef_current;
|
|
1618
|
-
var _useState = _sliced_to_array$
|
|
1691
|
+
var _useState = _sliced_to_array$f(useState(value), 2), internalValue = _useState[0], setInternalValue = _useState[1];
|
|
1619
1692
|
// const [hasError, setHasError] = useState<boolean>(false);
|
|
1620
|
-
var _useState1 = _sliced_to_array$
|
|
1693
|
+
var _useState1 = _sliced_to_array$f(useState(false), 2), isHighlighted = _useState1[0], setIsHighlighted = _useState1[1];
|
|
1621
1694
|
var valueRef = useRef(null);
|
|
1622
1695
|
var isLocalhost = window.location.hostname === 'localhost';
|
|
1623
1696
|
// Sets up listeners to handle changes on the backend
|
|
@@ -1761,15 +1834,15 @@ var SliderType = /*#__PURE__*/ function(SliderType) {
|
|
|
1761
1834
|
return SliderType;
|
|
1762
1835
|
}({});
|
|
1763
1836
|
|
|
1764
|
-
function _array_like_to_array$
|
|
1837
|
+
function _array_like_to_array$e(arr, len) {
|
|
1765
1838
|
if (len == null || len > arr.length) len = arr.length;
|
|
1766
1839
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
1767
1840
|
return arr2;
|
|
1768
1841
|
}
|
|
1769
|
-
function _array_with_holes$
|
|
1842
|
+
function _array_with_holes$e(arr) {
|
|
1770
1843
|
if (Array.isArray(arr)) return arr;
|
|
1771
1844
|
}
|
|
1772
|
-
function _iterable_to_array_limit$
|
|
1845
|
+
function _iterable_to_array_limit$e(arr, i) {
|
|
1773
1846
|
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
1774
1847
|
if (_i == null) return;
|
|
1775
1848
|
var _arr = [];
|
|
@@ -1793,19 +1866,19 @@ function _iterable_to_array_limit$c(arr, i) {
|
|
|
1793
1866
|
}
|
|
1794
1867
|
return _arr;
|
|
1795
1868
|
}
|
|
1796
|
-
function _non_iterable_rest$
|
|
1869
|
+
function _non_iterable_rest$e() {
|
|
1797
1870
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
1798
1871
|
}
|
|
1799
|
-
function _sliced_to_array$
|
|
1800
|
-
return _array_with_holes$
|
|
1872
|
+
function _sliced_to_array$e(arr, i) {
|
|
1873
|
+
return _array_with_holes$e(arr) || _iterable_to_array_limit$e(arr, i) || _unsupported_iterable_to_array$e(arr, i) || _non_iterable_rest$e();
|
|
1801
1874
|
}
|
|
1802
|
-
function _unsupported_iterable_to_array$
|
|
1875
|
+
function _unsupported_iterable_to_array$e(o, minLen) {
|
|
1803
1876
|
if (!o) return;
|
|
1804
|
-
if (typeof o === "string") return _array_like_to_array$
|
|
1877
|
+
if (typeof o === "string") return _array_like_to_array$e(o, minLen);
|
|
1805
1878
|
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
1806
1879
|
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
1807
1880
|
if (n === "Map" || n === "Set") return Array.from(n);
|
|
1808
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$
|
|
1881
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$e(o, minLen);
|
|
1809
1882
|
}
|
|
1810
1883
|
// 20.0f, 15000.0f, 0.1f, 0.7f),800.0f
|
|
1811
1884
|
// ValueType rangeStart, ValueType rangeEnd, ValueType intervalValue, ValueType skewFactor, bool useSymmetricSkew=false)
|
|
@@ -1816,34 +1889,6 @@ var useSlider = function(param) {
|
|
|
1816
1889
|
interval: 0.1,
|
|
1817
1890
|
skew: 0.7
|
|
1818
1891
|
} : _param_mockProperties, _param_isRandomizable = param.isRandomizable, isRandomizable = _param_isRandomizable === void 0 ? false : _param_isRandomizable, _param_orientation = param.orientation, orientation = _param_orientation === void 0 ? Orientation.vertical : _param_orientation, _param_dragOrientation = param.dragOrientation, dragOrientation = _param_dragOrientation === void 0 ? Orientation.vertical : _param_dragOrientation, _param_mockInitialNormalisedValue = param.mockInitialNormalisedValue, mockInitialNormalisedValue = _param_mockInitialNormalisedValue === void 0 ? 0.0 : _param_mockInitialNormalisedValue, onChange = param.onChange; param.sliderElementRef; var _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled;
|
|
1819
|
-
var clickListener = function clickListener(event) {
|
|
1820
|
-
var _event_target_closest;
|
|
1821
|
-
if (((_event_target_closest = event.target.closest('.Slider')) === null || _event_target_closest === void 0 ? void 0 : _event_target_closest.id) === id) {
|
|
1822
|
-
var // Update the preview mod slot target selection in the mod matrix.
|
|
1823
|
-
// This selection will be saved to the back end when a modifier is set for the target.
|
|
1824
|
-
_document_getElementById;
|
|
1825
|
-
setIsActive(true);
|
|
1826
|
-
(_document_getElementById = document.getElementById(id)) === null || _document_getElementById === void 0 ? void 0 : _document_getElementById.focus();
|
|
1827
|
-
event.stopPropagation();
|
|
1828
|
-
} else {
|
|
1829
|
-
var _document_getElementById1;
|
|
1830
|
-
setIsActive(false);
|
|
1831
|
-
(_document_getElementById1 = document.getElementById(id)) === null || _document_getElementById1 === void 0 ? void 0 : _document_getElementById1.blur();
|
|
1832
|
-
event.stopPropagation();
|
|
1833
|
-
}
|
|
1834
|
-
};
|
|
1835
|
-
var keyDownListener = function keyDownListener(event) {
|
|
1836
|
-
if (isActive) {
|
|
1837
|
-
if (event.key === 'ArrowLeft') {
|
|
1838
|
-
event.preventDefault();
|
|
1839
|
-
decrementValue();
|
|
1840
|
-
}
|
|
1841
|
-
if (event.key === 'ArrowRight') {
|
|
1842
|
-
event.preventDefault();
|
|
1843
|
-
incrementValue();
|
|
1844
|
-
}
|
|
1845
|
-
}
|
|
1846
|
-
};
|
|
1847
1892
|
// const sliderState: JuceSlider = Juce.getSliderState(id);
|
|
1848
1893
|
// if isLocalhost is true, the front end app is running outside of JUCE in a browser.
|
|
1849
1894
|
var isLocalhost = window.location.hostname === 'localhost';
|
|
@@ -1856,28 +1901,16 @@ var useSlider = function(param) {
|
|
|
1856
1901
|
* AudioProcessorParameter::getValue() (C++).
|
|
1857
1902
|
*/ // See https://github.com/juce-framework/JUCE/blob/51d11a2be6d5c97ccf12b4e5e827006e19f0555a/modules/juce_gui_extra/native/javascript/index.js#L230C1-L238C6
|
|
1858
1903
|
// NOTE: We can think of this as a percentage value, in 0 to 1 format
|
|
1859
|
-
var _useState = _sliced_to_array$
|
|
1904
|
+
var _useState = _sliced_to_array$e(useState(0), 2), scaledValue = _useState[0], setScaledValue = _useState[1];
|
|
1860
1905
|
// const [normalisedValue, setNormalisedValue] = useState(0);
|
|
1861
|
-
var _useState1 = _sliced_to_array$
|
|
1906
|
+
var _useState1 = _sliced_to_array$e(useState(), 2), properties = _useState1[0], setProperties = _useState1[1];
|
|
1862
1907
|
var scaledValueRef = useRef(null);
|
|
1863
1908
|
var normalisedValueRef = useRef(null);
|
|
1864
1909
|
var sliderState = Juce.getSliderState(id);
|
|
1910
|
+
var prevValueRef = useRef(null);
|
|
1865
1911
|
// const randomValueSetCounter = useRef<number>(null);
|
|
1866
|
-
var _useGlobalContext = useGlobalContext(), useRandom = _useGlobalContext.useRandom, highlightedItemChanged = _useGlobalContext.highlightedItemChanged, setDefaultParameter = _useGlobalContext.setDefaultParameter,
|
|
1867
|
-
|
|
1868
|
-
useEffect(function() {
|
|
1869
|
-
document.addEventListener('click', clickListener);
|
|
1870
|
-
document.addEventListener('keydown', keyDownListener);
|
|
1871
|
-
return function() {
|
|
1872
|
-
document.removeEventListener('click', clickListener);
|
|
1873
|
-
document.removeEventListener('keydown', keyDownListener);
|
|
1874
|
-
};
|
|
1875
|
-
}, [
|
|
1876
|
-
window,
|
|
1877
|
-
isActive,
|
|
1878
|
-
automatableParamsList,
|
|
1879
|
-
modSlotTargets
|
|
1880
|
-
]);
|
|
1912
|
+
var _useGlobalContext = useGlobalContext(), useRandom = _useGlobalContext.useRandom, highlightedItemChanged = _useGlobalContext.highlightedItemChanged, setDefaultParameter = _useGlobalContext.setDefaultParameter, setModSlotRowTargetAsPreview = _useGlobalContext.setModSlotRowTargetAsPreview, // setModSlotRowTarget,
|
|
1913
|
+
modSlotPreview = _useGlobalContext.globalState.modSlotPreview;
|
|
1881
1914
|
// Set the initial state
|
|
1882
1915
|
//@ts-expect-error
|
|
1883
1916
|
useEffect(function() {
|
|
@@ -1906,33 +1939,35 @@ var useSlider = function(param) {
|
|
|
1906
1939
|
normalisedValueRef.current = mockInitialNormalisedValue;
|
|
1907
1940
|
}
|
|
1908
1941
|
}, []);
|
|
1909
|
-
|
|
1910
|
-
|
|
1911
|
-
|
|
1942
|
+
// TODO: take out mod slot logic
|
|
1943
|
+
var changeHandler = function(scaledValueFromState, sliderId) {
|
|
1944
|
+
if (rowId === modSlotPreview.targetIndex) {
|
|
1945
|
+
onChange && onChange(parseFloat(scaledValueFromState.toFixed(2)), rowId);
|
|
1912
1946
|
} else {
|
|
1913
1947
|
onChange && onChange(parseFloat(scaledValueFromState.toFixed(2)), sliderId);
|
|
1914
1948
|
}
|
|
1915
|
-
}
|
|
1916
|
-
onChange
|
|
1917
|
-
]);
|
|
1949
|
+
};
|
|
1918
1950
|
// Update the local state from JUCE
|
|
1919
|
-
var updateLocalState = function(
|
|
1951
|
+
var updateLocalState = function() {
|
|
1920
1952
|
var normalisedValueFromState = sliderState === null || sliderState === void 0 ? void 0 : sliderState.getNormalisedValue();
|
|
1921
1953
|
var scaledValueFromState = sliderState === null || sliderState === void 0 ? void 0 : sliderState.getScaledValue();
|
|
1922
1954
|
var scaledValue = parseFloat(scaledValueFromState.toFixed(2));
|
|
1923
1955
|
normalisedValueRef.current = parseFloat(normalisedValueFromState.toFixed(2));
|
|
1924
|
-
|
|
1925
|
-
|
|
1926
|
-
|
|
1927
|
-
|
|
1928
|
-
|
|
1929
|
-
|
|
1930
|
-
|
|
1956
|
+
if (scaledValue !== prevValueRef.current) {
|
|
1957
|
+
setScaledValue(scaledValue);
|
|
1958
|
+
rowId && changeHandler(scaledValueFromState, rowId);
|
|
1959
|
+
if (displayValInHeader && (scaledValueRef === null || scaledValueRef === void 0 ? void 0 : scaledValueRef.current) !== scaledValue) {
|
|
1960
|
+
highlightedItemChanged({
|
|
1961
|
+
label: label,
|
|
1962
|
+
value: scaledValue
|
|
1963
|
+
});
|
|
1964
|
+
}
|
|
1965
|
+
prevValueRef.current = scaledValue;
|
|
1931
1966
|
}
|
|
1932
1967
|
};
|
|
1933
1968
|
// Update the local state when the ID changes
|
|
1934
1969
|
useEffect(function() {
|
|
1935
|
-
updateLocalState(
|
|
1970
|
+
updateLocalState();
|
|
1936
1971
|
}, [
|
|
1937
1972
|
id
|
|
1938
1973
|
]);
|
|
@@ -1941,7 +1976,7 @@ var useSlider = function(param) {
|
|
|
1941
1976
|
useEffect(function() {
|
|
1942
1977
|
if (!isLocalhost) {
|
|
1943
1978
|
var valueListenerId = sliderState === null || sliderState === void 0 ? void 0 : sliderState.valueChangedEvent.addListener(function() {
|
|
1944
|
-
updateLocalState(
|
|
1979
|
+
updateLocalState();
|
|
1945
1980
|
});
|
|
1946
1981
|
var propertiesListenerId = sliderState === null || sliderState === void 0 ? void 0 : sliderState.propertiesChangedEvent.addListener(function() {
|
|
1947
1982
|
return setProperties(sliderState === null || sliderState === void 0 ? void 0 : sliderState.properties);
|
|
@@ -1963,34 +1998,6 @@ var useSlider = function(param) {
|
|
|
1963
1998
|
normalisedValueRef.current = fixedNewValue;
|
|
1964
1999
|
}
|
|
1965
2000
|
};
|
|
1966
|
-
var updateValue = function(changeVal) {
|
|
1967
|
-
var getNormalisedInterval = function() {
|
|
1968
|
-
if (properties === null || properties === void 0 ? void 0 : properties.interval) {
|
|
1969
|
-
if ((properties === null || properties === void 0 ? void 0 : properties.interval) >= 1) {
|
|
1970
|
-
return (properties === null || properties === void 0 ? void 0 : properties.interval) * 0.01;
|
|
1971
|
-
} else {
|
|
1972
|
-
return properties === null || properties === void 0 ? void 0 : properties.interval;
|
|
1973
|
-
}
|
|
1974
|
-
} else {
|
|
1975
|
-
return 0.01;
|
|
1976
|
-
}
|
|
1977
|
-
};
|
|
1978
|
-
var normalisedInterval = getNormalisedInterval();
|
|
1979
|
-
var _normalisedValueRef_current;
|
|
1980
|
-
var newValue = ((_normalisedValueRef_current = normalisedValueRef.current) !== null && _normalisedValueRef_current !== void 0 ? _normalisedValueRef_current : 0) + changeVal * // (properties?.interval && properties?.interval.toString().length > 4
|
|
1981
|
-
// ? 4
|
|
1982
|
-
// : 0.4) *
|
|
1983
|
-
normalisedInterval;
|
|
1984
|
-
return clamp(newValue);
|
|
1985
|
-
};
|
|
1986
|
-
var incrementValue = function() {
|
|
1987
|
-
var newValue = updateValue(10);
|
|
1988
|
-
setNormalisedState(newValue);
|
|
1989
|
-
};
|
|
1990
|
-
var decrementValue = function() {
|
|
1991
|
-
var newValue = updateValue(-10);
|
|
1992
|
-
setNormalisedState(newValue);
|
|
1993
|
-
};
|
|
1994
2001
|
var setScaledState = function(newValue) {
|
|
1995
2002
|
if ((scaledValueRef === null || scaledValueRef === void 0 ? void 0 : scaledValueRef.current) !== newValue) {
|
|
1996
2003
|
var _sliderState_properties, _sliderState_properties1, _sliderState_properties2;
|
|
@@ -2006,7 +2013,11 @@ var useSlider = function(param) {
|
|
|
2006
2013
|
var bindDrag = useGesture({
|
|
2007
2014
|
onMouseDown: function(param) {
|
|
2008
2015
|
param.event;
|
|
2009
|
-
|
|
2016
|
+
if (id !== modSlotPreview.rowId) {
|
|
2017
|
+
setModSlotRowTargetAsPreview({
|
|
2018
|
+
paramId: id
|
|
2019
|
+
});
|
|
2020
|
+
}
|
|
2010
2021
|
if (!dragInProgress) {
|
|
2011
2022
|
sliderState.sliderDragStarted(id);
|
|
2012
2023
|
dragInProgress = true;
|
|
@@ -2015,7 +2026,11 @@ var useSlider = function(param) {
|
|
|
2015
2026
|
onDrag: function(param) {
|
|
2016
2027
|
param.event; var delta = param.delta;
|
|
2017
2028
|
var deltaVal = delta[1] * -1;
|
|
2018
|
-
var newValue =
|
|
2029
|
+
var newValue = incrementValue({
|
|
2030
|
+
incomingVal: deltaVal,
|
|
2031
|
+
prevVal: normalisedValueRef.current || 0,
|
|
2032
|
+
interval: properties === null || properties === void 0 ? void 0 : properties.interval
|
|
2033
|
+
});
|
|
2019
2034
|
setNormalisedState(newValue);
|
|
2020
2035
|
},
|
|
2021
2036
|
onMouseUp: function(param) {
|
|
@@ -2114,9 +2129,6 @@ var useSlider = function(param) {
|
|
|
2114
2129
|
setNormalisedState: setNormalisedState,
|
|
2115
2130
|
setScaledState: setScaledState,
|
|
2116
2131
|
setToDefaultState: setToDefaultState,
|
|
2117
|
-
incrementValue: incrementValue,
|
|
2118
|
-
decrementValue: decrementValue,
|
|
2119
|
-
isActive: isActive,
|
|
2120
2132
|
scaledToNormalised: scaledToNormalised,
|
|
2121
2133
|
bindBarSliderDrag: bindBarSliderDrag,
|
|
2122
2134
|
bindSequenceBarSliderDrag: bindSequenceBarSliderDrag,
|
|
@@ -2127,33 +2139,164 @@ var useSlider = function(param) {
|
|
|
2127
2139
|
};
|
|
2128
2140
|
};
|
|
2129
2141
|
|
|
2130
|
-
var css_248z$
|
|
2142
|
+
var css_248z$7 = ".RotarySlider {\n /* position: relative; */\n /* border-radius: 50%; */\n display: flex;\n flex-direction: column;\n justify-content: center;\n aspect-ratio: 1 / 1;\n border: 1px solid transparent;\n}\n\n.RotarySlider-Inner {\n height: 100%;\n width: 100%;\n right: 0;\n top: 0;\n bottom: 0;\n left: 0;\n background-color: var(--bg-popover);\n border-radius: 50%;\n}\n\n.RotarySlider-Indicator {\n position: absolute;\n top: 0;\n right: 0;\n left: 50%;\n width: var(--spacing-xs);\n height: 50%;\n transform: translate(-50%, 0) rotate(0) skewX(0) skewY(0) scaleX(1) scaleY(1);\n}\n\n.RotarySlider-center-marker {\n width: 0;\n height: 0;\n border-style: solid;\n border-width: 0 5px 8px 5px;\n transform: rotate(180deg);\n padding-bottom: var(--spacing-sm);\n}\n\n.ProgressCircle-wrapper {\n position: relative;\n}\n.ProgressCircle {\n fill: none;\n pointer-events: none;\n}\n\n.ProgressCircle-value {\n text-align: center;\n margin-top: -3px;\n height: 0.8rem;\n line-height: 0.8rem;\n}\n\n.ProgressCircle-bg {\n stroke-width: 3px;\n transform-origin: center;\n transform: rotate(135deg);\n stroke-linecap: round;\n font-size: var(--text-sm);\n pointer-events: none;\n}\n.ProgressCircle-fg {\n stroke-width: 3px;\n /* stroke-dasharray: 75; */\n /* stroke-dashoffset: calc(880 - (660 * 0) / 100); */\n transform-origin: center;\n stroke-linecap: round;\n pointer-events: none;\n}\n\n.corner-border {\n --b: 1px; /* thickness of the border */\n --c: var(--color-gray-500); /* color of the border */\n --w: 5px; /* width of border */\n\n border: var(--b) solid #0000; /* space for the border */\n --_g: #0000 90deg, var(--c) 0;\n --_p: var(--w) var(--w) border-box no-repeat;\n background:\n conic-gradient(from 90deg at top var(--b) left var(--b), var(--_g)) 0 0 /\n var(--_p),\n conic-gradient(from 180deg at top var(--b) right var(--b), var(--_g)) 100% 0 /\n var(--_p),\n conic-gradient(from 0deg at bottom var(--b) left var(--b), var(--_g)) 0 100% /\n var(--_p),\n conic-gradient(from -90deg at bottom var(--b) right var(--b), var(--_g))\n 100% 100% / var(--_p);\n}\n";
|
|
2143
|
+
styleInject(css_248z$7);
|
|
2144
|
+
|
|
2145
|
+
var css_248z$6 = "";
|
|
2131
2146
|
styleInject(css_248z$6);
|
|
2132
2147
|
|
|
2133
|
-
function
|
|
2134
|
-
if (
|
|
2135
|
-
|
|
2136
|
-
|
|
2137
|
-
enumerable: true,
|
|
2138
|
-
configurable: true,
|
|
2139
|
-
writable: true
|
|
2140
|
-
});
|
|
2141
|
-
} else {
|
|
2142
|
-
obj[key] = value;
|
|
2143
|
-
}
|
|
2144
|
-
return obj;
|
|
2148
|
+
function _array_like_to_array$d(arr, len) {
|
|
2149
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
2150
|
+
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
2151
|
+
return arr2;
|
|
2145
2152
|
}
|
|
2146
|
-
function
|
|
2147
|
-
|
|
2148
|
-
|
|
2149
|
-
|
|
2150
|
-
|
|
2151
|
-
|
|
2152
|
-
|
|
2153
|
-
|
|
2154
|
-
|
|
2155
|
-
|
|
2156
|
-
|
|
2153
|
+
function _array_with_holes$d(arr) {
|
|
2154
|
+
if (Array.isArray(arr)) return arr;
|
|
2155
|
+
}
|
|
2156
|
+
function _iterable_to_array_limit$d(arr, i) {
|
|
2157
|
+
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
2158
|
+
if (_i == null) return;
|
|
2159
|
+
var _arr = [];
|
|
2160
|
+
var _n = true;
|
|
2161
|
+
var _d = false;
|
|
2162
|
+
var _s, _e;
|
|
2163
|
+
try {
|
|
2164
|
+
for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
|
|
2165
|
+
_arr.push(_s.value);
|
|
2166
|
+
if (i && _arr.length === i) break;
|
|
2167
|
+
}
|
|
2168
|
+
} catch (err) {
|
|
2169
|
+
_d = true;
|
|
2170
|
+
_e = err;
|
|
2171
|
+
} finally{
|
|
2172
|
+
try {
|
|
2173
|
+
if (!_n && _i["return"] != null) _i["return"]();
|
|
2174
|
+
} finally{
|
|
2175
|
+
if (_d) throw _e;
|
|
2176
|
+
}
|
|
2177
|
+
}
|
|
2178
|
+
return _arr;
|
|
2179
|
+
}
|
|
2180
|
+
function _non_iterable_rest$d() {
|
|
2181
|
+
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
2182
|
+
}
|
|
2183
|
+
function _sliced_to_array$d(arr, i) {
|
|
2184
|
+
return _array_with_holes$d(arr) || _iterable_to_array_limit$d(arr, i) || _unsupported_iterable_to_array$d(arr, i) || _non_iterable_rest$d();
|
|
2185
|
+
}
|
|
2186
|
+
function _unsupported_iterable_to_array$d(o, minLen) {
|
|
2187
|
+
if (!o) return;
|
|
2188
|
+
if (typeof o === "string") return _array_like_to_array$d(o, minLen);
|
|
2189
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
2190
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
2191
|
+
if (n === "Map" || n === "Set") return Array.from(n);
|
|
2192
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$d(o, minLen);
|
|
2193
|
+
}
|
|
2194
|
+
function ControlGroup(param) {
|
|
2195
|
+
var id = param.id, isDisabled = param.isDisabled, className = param.className, onChangeActiveState = param.onChangeActiveState, children = param.children;
|
|
2196
|
+
// EXAMPLE CONTROL GROUP STRUCTURE
|
|
2197
|
+
// <ControlGroup id={id-control-group} is-active>
|
|
2198
|
+
// <Slider id={id}></Slider>
|
|
2199
|
+
// <Input id={id-input}></Input>
|
|
2200
|
+
// </ControlGroup>
|
|
2201
|
+
var groupId = "".concat(id, "-control-group");
|
|
2202
|
+
var _useState = _sliced_to_array$d(useState(false), 2), isActive = _useState[0], setIsActive = _useState[1];
|
|
2203
|
+
var sliderState = Juce.getSliderState(id);
|
|
2204
|
+
var clickListener = function(event) {
|
|
2205
|
+
if (!isDisabled) {
|
|
2206
|
+
var _event_target_closest;
|
|
2207
|
+
document.getElementById("".concat(id, "-input")).disabled = false;
|
|
2208
|
+
if (((_event_target_closest = event.target.closest('.controlGroup')) === null || _event_target_closest === void 0 ? void 0 : _event_target_closest.id) === groupId) {
|
|
2209
|
+
var _document_getElementById, _document_getElementById1;
|
|
2210
|
+
setIsActive(true);
|
|
2211
|
+
onChangeActiveState && onChangeActiveState(true);
|
|
2212
|
+
(_document_getElementById = document.getElementById("".concat(id, "-input"))) === null || _document_getElementById === void 0 ? void 0 : _document_getElementById.focus();
|
|
2213
|
+
(_document_getElementById1 = document.getElementById("".concat(id, "-input"))) === null || _document_getElementById1 === void 0 ? void 0 : _document_getElementById1.select();
|
|
2214
|
+
// event.stopPropagation();
|
|
2215
|
+
} else {
|
|
2216
|
+
var _document_getElementById2;
|
|
2217
|
+
setIsActive(false);
|
|
2218
|
+
onChangeActiveState && onChangeActiveState(false);
|
|
2219
|
+
(_document_getElementById2 = document.getElementById("".concat(id, "-input"))) === null || _document_getElementById2 === void 0 ? void 0 : _document_getElementById2.blur();
|
|
2220
|
+
// event.stopPropagation();
|
|
2221
|
+
}
|
|
2222
|
+
} else {
|
|
2223
|
+
document.getElementById("".concat(id, "-input")).disabled = true;
|
|
2224
|
+
}
|
|
2225
|
+
};
|
|
2226
|
+
var increment = function() {
|
|
2227
|
+
var _sliderState_properties;
|
|
2228
|
+
var normalisedVal = sliderState === null || sliderState === void 0 ? void 0 : sliderState.getNormalisedValue();
|
|
2229
|
+
var newValue = incrementValue({
|
|
2230
|
+
incomingVal: 10,
|
|
2231
|
+
prevVal: normalisedVal,
|
|
2232
|
+
interval: sliderState === null || sliderState === void 0 ? void 0 : (_sliderState_properties = sliderState.properties) === null || _sliderState_properties === void 0 ? void 0 : _sliderState_properties.interval
|
|
2233
|
+
});
|
|
2234
|
+
sliderState.setNormalisedValue(newValue);
|
|
2235
|
+
};
|
|
2236
|
+
var decrement = function() {
|
|
2237
|
+
var _sliderState_properties;
|
|
2238
|
+
var normalisedVal = sliderState === null || sliderState === void 0 ? void 0 : sliderState.getNormalisedValue();
|
|
2239
|
+
var newValue = incrementValue({
|
|
2240
|
+
incomingVal: -10,
|
|
2241
|
+
prevVal: normalisedVal,
|
|
2242
|
+
interval: sliderState === null || sliderState === void 0 ? void 0 : (_sliderState_properties = sliderState.properties) === null || _sliderState_properties === void 0 ? void 0 : _sliderState_properties.interval
|
|
2243
|
+
});
|
|
2244
|
+
sliderState === null || sliderState === void 0 ? void 0 : sliderState.setNormalisedValue(newValue);
|
|
2245
|
+
};
|
|
2246
|
+
function keyDownListener(event) {
|
|
2247
|
+
if (isActive && !isDisabled) {
|
|
2248
|
+
if (event.key === 'ArrowLeft') {
|
|
2249
|
+
event.preventDefault();
|
|
2250
|
+
decrement();
|
|
2251
|
+
}
|
|
2252
|
+
if (event.key === 'ArrowRight') {
|
|
2253
|
+
event.preventDefault();
|
|
2254
|
+
increment();
|
|
2255
|
+
}
|
|
2256
|
+
}
|
|
2257
|
+
}
|
|
2258
|
+
useEffect(function() {
|
|
2259
|
+
document.addEventListener('click', clickListener);
|
|
2260
|
+
document.addEventListener('keydown', keyDownListener);
|
|
2261
|
+
return function() {
|
|
2262
|
+
document.removeEventListener('click', clickListener);
|
|
2263
|
+
document.removeEventListener('keydown', keyDownListener);
|
|
2264
|
+
};
|
|
2265
|
+
}, [
|
|
2266
|
+
window,
|
|
2267
|
+
isActive,
|
|
2268
|
+
isDisabled
|
|
2269
|
+
]);
|
|
2270
|
+
return /*#__PURE__*/ React__default.createElement(Box, {
|
|
2271
|
+
id: groupId,
|
|
2272
|
+
className: "controlGroup ".concat(isActive ? 'isActive' : '', " ").concat(isDisabled ? 'isDisabled' : '', " ").concat(className)
|
|
2273
|
+
}, children);
|
|
2274
|
+
}
|
|
2275
|
+
|
|
2276
|
+
function _define_property$e(obj, key, value) {
|
|
2277
|
+
if (key in obj) {
|
|
2278
|
+
Object.defineProperty(obj, key, {
|
|
2279
|
+
value: value,
|
|
2280
|
+
enumerable: true,
|
|
2281
|
+
configurable: true,
|
|
2282
|
+
writable: true
|
|
2283
|
+
});
|
|
2284
|
+
} else {
|
|
2285
|
+
obj[key] = value;
|
|
2286
|
+
}
|
|
2287
|
+
return obj;
|
|
2288
|
+
}
|
|
2289
|
+
function _object_spread$e(target) {
|
|
2290
|
+
for(var i = 1; i < arguments.length; i++){
|
|
2291
|
+
var source = arguments[i] != null ? arguments[i] : {};
|
|
2292
|
+
var ownKeys = Object.keys(source);
|
|
2293
|
+
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
2294
|
+
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
2295
|
+
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
2296
|
+
}));
|
|
2297
|
+
}
|
|
2298
|
+
ownKeys.forEach(function(key) {
|
|
2299
|
+
_define_property$e(target, key, source[key]);
|
|
2157
2300
|
});
|
|
2158
2301
|
}
|
|
2159
2302
|
return target;
|
|
@@ -2248,7 +2391,9 @@ function RotarySlider(param) {
|
|
|
2248
2391
|
}), bindDrag = _useSlider.bindDrag, normalisedValue = _useSlider.normalisedValue, scaledValue = _useSlider.scaledValue, // onMouseEnter,
|
|
2249
2392
|
setToDefaultState = _useSlider.setToDefaultState, setNormalisedState = _useSlider.setNormalisedState, // isActive,
|
|
2250
2393
|
properties = _useSlider.properties;
|
|
2251
|
-
return /*#__PURE__*/ React__default.createElement(
|
|
2394
|
+
return /*#__PURE__*/ React__default.createElement(ControlGroup, {
|
|
2395
|
+
id: id
|
|
2396
|
+
}, /*#__PURE__*/ React__default.createElement(Box, {
|
|
2252
2397
|
className: "RotarySlider-wrapper",
|
|
2253
2398
|
flexDirection: Box.flexDirection.column,
|
|
2254
2399
|
gap: Box.gap.none,
|
|
@@ -2309,7 +2454,7 @@ function RotarySlider(param) {
|
|
|
2309
2454
|
],
|
|
2310
2455
|
fontSize: Label.fontSize.xSmall,
|
|
2311
2456
|
value: label
|
|
2312
|
-
}));
|
|
2457
|
+
})));
|
|
2313
2458
|
}
|
|
2314
2459
|
RotarySlider.sliderPolarity = Polarity;
|
|
2315
2460
|
|
|
@@ -2485,15 +2630,15 @@ Heading.fontSize = FontSizes;
|
|
|
2485
2630
|
Heading.tag = HeadingTags;
|
|
2486
2631
|
Heading.padding = Spacing;
|
|
2487
2632
|
|
|
2488
|
-
function _array_like_to_array$
|
|
2633
|
+
function _array_like_to_array$c(arr, len) {
|
|
2489
2634
|
if (len == null || len > arr.length) len = arr.length;
|
|
2490
2635
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
2491
2636
|
return arr2;
|
|
2492
2637
|
}
|
|
2493
|
-
function _array_with_holes$
|
|
2638
|
+
function _array_with_holes$c(arr) {
|
|
2494
2639
|
if (Array.isArray(arr)) return arr;
|
|
2495
2640
|
}
|
|
2496
|
-
function _iterable_to_array_limit$
|
|
2641
|
+
function _iterable_to_array_limit$c(arr, i) {
|
|
2497
2642
|
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
2498
2643
|
if (_i == null) return;
|
|
2499
2644
|
var _arr = [];
|
|
@@ -2517,26 +2662,26 @@ function _iterable_to_array_limit$b(arr, i) {
|
|
|
2517
2662
|
}
|
|
2518
2663
|
return _arr;
|
|
2519
2664
|
}
|
|
2520
|
-
function _non_iterable_rest$
|
|
2665
|
+
function _non_iterable_rest$c() {
|
|
2521
2666
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
2522
2667
|
}
|
|
2523
|
-
function _sliced_to_array$
|
|
2524
|
-
return _array_with_holes$
|
|
2668
|
+
function _sliced_to_array$c(arr, i) {
|
|
2669
|
+
return _array_with_holes$c(arr) || _iterable_to_array_limit$c(arr, i) || _unsupported_iterable_to_array$c(arr, i) || _non_iterable_rest$c();
|
|
2525
2670
|
}
|
|
2526
|
-
function _unsupported_iterable_to_array$
|
|
2671
|
+
function _unsupported_iterable_to_array$c(o, minLen) {
|
|
2527
2672
|
if (!o) return;
|
|
2528
|
-
if (typeof o === "string") return _array_like_to_array$
|
|
2673
|
+
if (typeof o === "string") return _array_like_to_array$c(o, minLen);
|
|
2529
2674
|
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
2530
2675
|
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
2531
2676
|
if (n === "Map" || n === "Set") return Array.from(n);
|
|
2532
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$
|
|
2677
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$c(o, minLen);
|
|
2533
2678
|
}
|
|
2534
2679
|
// 20.0f, 15000.0f, 0.1f, 0.7f),800.0f
|
|
2535
2680
|
// ValueType rangeStart, ValueType rangeEnd, ValueType intervalValue, ValueType skewFactor, bool useSymmetricSkew=false)
|
|
2536
2681
|
var useIndicator = function(param) {
|
|
2537
2682
|
var id = param.id;
|
|
2538
2683
|
var isLocalhost = window.location.hostname === 'localhost';
|
|
2539
|
-
var _useState = _sliced_to_array$
|
|
2684
|
+
var _useState = _sliced_to_array$c(useState(0), 2), isActive = _useState[0], setIsActive = _useState[1];
|
|
2540
2685
|
// Set the initial state
|
|
2541
2686
|
useEffect(function() {
|
|
2542
2687
|
if (!isLocalhost) {
|
|
@@ -3119,12 +3264,12 @@ function LinePlot(param) {
|
|
|
3119
3264
|
var css_248z$4 = ".Oscilloscope {\n background: #0EAC8B;\n box-shadow: inset 0 0 20px #086350;\n height: 200px;\n };";
|
|
3120
3265
|
styleInject(css_248z$4);
|
|
3121
3266
|
|
|
3122
|
-
function _array_like_to_array$
|
|
3267
|
+
function _array_like_to_array$b(arr, len) {
|
|
3123
3268
|
if (len == null || len > arr.length) len = arr.length;
|
|
3124
3269
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
3125
3270
|
return arr2;
|
|
3126
3271
|
}
|
|
3127
|
-
function _array_with_holes$
|
|
3272
|
+
function _array_with_holes$b(arr) {
|
|
3128
3273
|
if (Array.isArray(arr)) return arr;
|
|
3129
3274
|
}
|
|
3130
3275
|
function _define_property$7(obj, key, value) {
|
|
@@ -3140,7 +3285,7 @@ function _define_property$7(obj, key, value) {
|
|
|
3140
3285
|
}
|
|
3141
3286
|
return obj;
|
|
3142
3287
|
}
|
|
3143
|
-
function _iterable_to_array_limit$
|
|
3288
|
+
function _iterable_to_array_limit$b(arr, i) {
|
|
3144
3289
|
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
3145
3290
|
if (_i == null) return;
|
|
3146
3291
|
var _arr = [];
|
|
@@ -3164,7 +3309,7 @@ function _iterable_to_array_limit$a(arr, i) {
|
|
|
3164
3309
|
}
|
|
3165
3310
|
return _arr;
|
|
3166
3311
|
}
|
|
3167
|
-
function _non_iterable_rest$
|
|
3312
|
+
function _non_iterable_rest$b() {
|
|
3168
3313
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
3169
3314
|
}
|
|
3170
3315
|
function _object_spread$7(target) {
|
|
@@ -3182,20 +3327,20 @@ function _object_spread$7(target) {
|
|
|
3182
3327
|
}
|
|
3183
3328
|
return target;
|
|
3184
3329
|
}
|
|
3185
|
-
function _sliced_to_array$
|
|
3186
|
-
return _array_with_holes$
|
|
3330
|
+
function _sliced_to_array$b(arr, i) {
|
|
3331
|
+
return _array_with_holes$b(arr) || _iterable_to_array_limit$b(arr, i) || _unsupported_iterable_to_array$b(arr, i) || _non_iterable_rest$b();
|
|
3187
3332
|
}
|
|
3188
|
-
function _unsupported_iterable_to_array$
|
|
3333
|
+
function _unsupported_iterable_to_array$b(o, minLen) {
|
|
3189
3334
|
if (!o) return;
|
|
3190
|
-
if (typeof o === "string") return _array_like_to_array$
|
|
3335
|
+
if (typeof o === "string") return _array_like_to_array$b(o, minLen);
|
|
3191
3336
|
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
3192
3337
|
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
3193
3338
|
if (n === "Map" || n === "Set") return Array.from(n);
|
|
3194
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$
|
|
3339
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$b(o, minLen);
|
|
3195
3340
|
}
|
|
3196
3341
|
function Oscilloscope(param) {
|
|
3197
3342
|
var width = param.width, height = param.height, className = param.className, style = param.style, id = param.id;
|
|
3198
|
-
var _useState = _sliced_to_array$
|
|
3343
|
+
var _useState = _sliced_to_array$b(useState([]), 2), viewData = _useState[0], setViewData = _useState[1];
|
|
3199
3344
|
var cycleLength = useRef(0);
|
|
3200
3345
|
useEffect(function() {
|
|
3201
3346
|
//@ts-expect-error
|
|
@@ -3239,12 +3384,12 @@ styleInject(css_248z$3);
|
|
|
3239
3384
|
var css_248z$2 = ".PresetManagerContainer {\n width: 100%;\n height: 100%;\n background-color: var(--bg-page);\n color: var(--color-text);\n}\n\n.PresetManagerButton {\n width: 100%;\n height: 100%;\n max-width: 300px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n position: relative;\n cursor: pointer;\n font-family: var(--font-leagueSpartan);\n}\n.PresetManagerButtonLabel {\n cursor: pointer;\n text-align: center;\n font-family: var(--font-leagueSpartan);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 225px;\n display: inline-block;\n vertical-align: middle;\n height: 1rem;\n line-height: 1.25;\n /* position: relative; */\n &:hover,\n &:active {\n background: var(--color-gray-900);\n }\n /* &.isDirty {\n &::after {\n content: '*';\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n }\n } */\n}\n\n.PresetManagerButtonLabelContainer.isDirty::after {\n content: '*';\n position: absolute;\n height: 1rem;\n width: 1rem;\n right: -0.75rem;\n top: 0;\n}\n\n.PresetManagerButtonLabelOuterContainer {\n position: relative;\n width: auto;\n}\n\n[data-headlessui-state='open active'] .PresetManagerButtonLabel {\n background: var(--color-gray-900);\n}\n.PresetManagerPanel {\n position: absolute;\n font-family: var(--font-leagueSpartan);\n right: 0px;\n left: 0px;\n width: 100%;\n max-width: 400px !important;\n color: var(--color-text);\n background: var(--bg-popover);\n}\n\n.PresetManagerPanel:focus,\n.PresetManagerPanel:focus-visible {\n outline: none;\n}\n\n/* .PresetManagerCategoryItem {\n font-family: var(--font-leagueSpartan);\n cursor: pointer;\n background: var(--color-gray-800);\n text-transform: uppercase;\n &:hover,\n &.isSelected {\n background: var(--bg-selected);\n }\n} */\n\n.PresetManagerListItem {\n cursor: pointer;\n background: var(--color-gray-800);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n width: 100%;\n}\n\n.PresetManagerListItem:hover,\n.PresetManagerListItem.isSelected {\n background: var(--bg-selected);\n}\n\n.PresetManagerListItemText {\n display: inline-block;\n vertical-align: middle;\n height: 1.5rem;\n line-height: 1.75;\n}\n";
|
|
3240
3385
|
styleInject(css_248z$2);
|
|
3241
3386
|
|
|
3242
|
-
function _array_like_to_array$
|
|
3387
|
+
function _array_like_to_array$a(arr, len) {
|
|
3243
3388
|
if (len == null || len > arr.length) len = arr.length;
|
|
3244
3389
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
3245
3390
|
return arr2;
|
|
3246
3391
|
}
|
|
3247
|
-
function _array_with_holes$
|
|
3392
|
+
function _array_with_holes$a(arr) {
|
|
3248
3393
|
if (Array.isArray(arr)) return arr;
|
|
3249
3394
|
}
|
|
3250
3395
|
function asyncGeneratorStep$3(gen, resolve, reject, _next, _throw, key, arg) {
|
|
@@ -3276,7 +3421,7 @@ function _async_to_generator$3(fn) {
|
|
|
3276
3421
|
});
|
|
3277
3422
|
};
|
|
3278
3423
|
}
|
|
3279
|
-
function _iterable_to_array_limit$
|
|
3424
|
+
function _iterable_to_array_limit$a(arr, i) {
|
|
3280
3425
|
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
3281
3426
|
if (_i == null) return;
|
|
3282
3427
|
var _arr = [];
|
|
@@ -3300,23 +3445,23 @@ function _iterable_to_array_limit$9(arr, i) {
|
|
|
3300
3445
|
}
|
|
3301
3446
|
return _arr;
|
|
3302
3447
|
}
|
|
3303
|
-
function _non_iterable_rest$
|
|
3448
|
+
function _non_iterable_rest$a() {
|
|
3304
3449
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
3305
3450
|
}
|
|
3306
3451
|
function _object_destructuring_empty(o) {
|
|
3307
3452
|
if (o === null || o === void 0) throw new TypeError("Cannot destructure " + o);
|
|
3308
3453
|
return o;
|
|
3309
3454
|
}
|
|
3310
|
-
function _sliced_to_array$
|
|
3311
|
-
return _array_with_holes$
|
|
3455
|
+
function _sliced_to_array$a(arr, i) {
|
|
3456
|
+
return _array_with_holes$a(arr) || _iterable_to_array_limit$a(arr, i) || _unsupported_iterable_to_array$a(arr, i) || _non_iterable_rest$a();
|
|
3312
3457
|
}
|
|
3313
|
-
function _unsupported_iterable_to_array$
|
|
3458
|
+
function _unsupported_iterable_to_array$a(o, minLen) {
|
|
3314
3459
|
if (!o) return;
|
|
3315
|
-
if (typeof o === "string") return _array_like_to_array$
|
|
3460
|
+
if (typeof o === "string") return _array_like_to_array$a(o, minLen);
|
|
3316
3461
|
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
3317
3462
|
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
3318
3463
|
if (n === "Map" || n === "Set") return Array.from(n);
|
|
3319
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$
|
|
3464
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$a(o, minLen);
|
|
3320
3465
|
}
|
|
3321
3466
|
function _ts_generator$3(thisArg, body) {
|
|
3322
3467
|
var f, y, t, _ = {
|
|
@@ -3411,16 +3556,16 @@ function _ts_generator$3(thisArg, body) {
|
|
|
3411
3556
|
}
|
|
3412
3557
|
function PresetManager(param) {
|
|
3413
3558
|
_object_destructuring_empty(param);
|
|
3414
|
-
var _useState = _sliced_to_array$
|
|
3415
|
-
var _useState1 = _sliced_to_array$
|
|
3559
|
+
var _useState = _sliced_to_array$a(useState([]), 2), presetList = _useState[0], setPresetList = _useState[1];
|
|
3560
|
+
var _useState1 = _sliced_to_array$a(useState(false), 2); _useState1[0]; var setIsSaving = _useState1[1];
|
|
3416
3561
|
var savePresetFunc = Juce.getNativeFunction('savePreset');
|
|
3417
3562
|
var loadPresetFunc = Juce.getNativeFunction('loadPreset');
|
|
3418
3563
|
var getAllPresetsFunc = Juce.getNativeFunction('getAllPresets');
|
|
3419
3564
|
var getCurrentPresetFunc = Juce.getNativeFunction('getCurrentPreset');
|
|
3420
3565
|
var isDirtyFunc = Juce.getNativeFunction('canUndo');
|
|
3421
|
-
var _useState2 = _sliced_to_array$
|
|
3566
|
+
var _useState2 = _sliced_to_array$a(useState(), 2), selectedPreset = _useState2[0], setSelectedPreset = _useState2[1];
|
|
3422
3567
|
var isLocalhost = window.location.hostname === 'localhost';
|
|
3423
|
-
var _useState3 = _sliced_to_array$
|
|
3568
|
+
var _useState3 = _sliced_to_array$a(useState(false), 2), isDirty = _useState3[0], setIsDirty = _useState3[1];
|
|
3424
3569
|
useEffect(function() {
|
|
3425
3570
|
if (!isLocalhost) {
|
|
3426
3571
|
var isDirtyListenerId = //@ts-expect-error
|
|
@@ -3696,12 +3841,12 @@ function PresetManager(param) {
|
|
|
3696
3841
|
}))))));
|
|
3697
3842
|
}
|
|
3698
3843
|
|
|
3699
|
-
function _array_like_to_array$
|
|
3844
|
+
function _array_like_to_array$9(arr, len) {
|
|
3700
3845
|
if (len == null || len > arr.length) len = arr.length;
|
|
3701
3846
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
3702
3847
|
return arr2;
|
|
3703
3848
|
}
|
|
3704
|
-
function _array_with_holes$
|
|
3849
|
+
function _array_with_holes$9(arr) {
|
|
3705
3850
|
if (Array.isArray(arr)) return arr;
|
|
3706
3851
|
}
|
|
3707
3852
|
function asyncGeneratorStep$2(gen, resolve, reject, _next, _throw, key, arg) {
|
|
@@ -3746,7 +3891,7 @@ function _define_property$6(obj, key, value) {
|
|
|
3746
3891
|
}
|
|
3747
3892
|
return obj;
|
|
3748
3893
|
}
|
|
3749
|
-
function _iterable_to_array_limit$
|
|
3894
|
+
function _iterable_to_array_limit$9(arr, i) {
|
|
3750
3895
|
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
3751
3896
|
if (_i == null) return;
|
|
3752
3897
|
var _arr = [];
|
|
@@ -3770,7 +3915,7 @@ function _iterable_to_array_limit$8(arr, i) {
|
|
|
3770
3915
|
}
|
|
3771
3916
|
return _arr;
|
|
3772
3917
|
}
|
|
3773
|
-
function _non_iterable_rest$
|
|
3918
|
+
function _non_iterable_rest$9() {
|
|
3774
3919
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
3775
3920
|
}
|
|
3776
3921
|
function _object_spread$6(target) {
|
|
@@ -3788,16 +3933,16 @@ function _object_spread$6(target) {
|
|
|
3788
3933
|
}
|
|
3789
3934
|
return target;
|
|
3790
3935
|
}
|
|
3791
|
-
function _sliced_to_array$
|
|
3792
|
-
return _array_with_holes$
|
|
3936
|
+
function _sliced_to_array$9(arr, i) {
|
|
3937
|
+
return _array_with_holes$9(arr) || _iterable_to_array_limit$9(arr, i) || _unsupported_iterable_to_array$9(arr, i) || _non_iterable_rest$9();
|
|
3793
3938
|
}
|
|
3794
|
-
function _unsupported_iterable_to_array$
|
|
3939
|
+
function _unsupported_iterable_to_array$9(o, minLen) {
|
|
3795
3940
|
if (!o) return;
|
|
3796
|
-
if (typeof o === "string") return _array_like_to_array$
|
|
3941
|
+
if (typeof o === "string") return _array_like_to_array$9(o, minLen);
|
|
3797
3942
|
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
3798
3943
|
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
3799
3944
|
if (n === "Map" || n === "Set") return Array.from(n);
|
|
3800
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$
|
|
3945
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$9(o, minLen);
|
|
3801
3946
|
}
|
|
3802
3947
|
function _ts_generator$2(thisArg, body) {
|
|
3803
3948
|
var f, y, t, _ = {
|
|
@@ -3980,8 +4125,8 @@ function ModuleHeader(param) {
|
|
|
3980
4125
|
}, [
|
|
3981
4126
|
window
|
|
3982
4127
|
]);
|
|
3983
|
-
var _useState = _sliced_to_array$
|
|
3984
|
-
var _useState1 = _sliced_to_array$
|
|
4128
|
+
var _useState = _sliced_to_array$9(useState(false), 2), canUndo = _useState[0], setCanUndo = _useState[1];
|
|
4129
|
+
var _useState1 = _sliced_to_array$9(useState(false), 2), canRedo = _useState1[0], setCanRedo = _useState1[1];
|
|
3985
4130
|
var handleUndo = function() {
|
|
3986
4131
|
undo();
|
|
3987
4132
|
};
|
|
@@ -4219,7 +4364,7 @@ function ModuleHeader(param) {
|
|
|
4219
4364
|
}, "Advanced")))));
|
|
4220
4365
|
}
|
|
4221
4366
|
|
|
4222
|
-
var css_248z$1 = ".ModMatrix {\n color: var(--color-text);\n font-size: var(--text-ms);\n}\n\n.ModMatrixCell {\n background: #252429;\n position: relative;\n}\n\n.ModMatrixCell.isDisabled {\n /* background: var(--bg-muted);\n color: var(--color-gray-400); */\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.ModMatrixToggleCell {\n cursor: pointer;\n}\n\n.ModMatrixComboboxCell {\n background: #252429;\n cursor: pointer;\n}\n\n.ModMatrixComboboxItems {\n position: absolute;\n z-index: 50;\n bottom: -151px;\n left: 0px;\n height: 150px;\n width: 100%;\n background: var(--color-gray-500);\n color: var(--color-text);\n font-family: var(--font-leagueSpartan);\n overflow-y: auto;\n overflow-x: hidden;\n cursor: pointer;\n}\n\n.ModMatrixComboboxItem:hover,\n.ModMatrixComboboxItem:active,\n.ModMatrixComboboxItem[data-selected] {\n background: var(--color-gray-600);\n}\n\n.ModMatrixComboboxItem {\n padding: var(--spacing-md) var(--spacing-lg);\n width: 100%;\n}\n.ModMatrixComboboxButton {\n cursor: pointer;\n}\n";
|
|
4367
|
+
var css_248z$1 = ".ModMatrix {\n color: var(--color-text);\n font-size: var(--text-ms);\n}\n\n.ModMatrixCell {\n background: #252429;\n position: relative;\n}\n\n.ModMatrixCell.isDisabled {\n /* background: var(--bg-muted);\n color: var(--color-gray-400); */\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n/* .isActive .ModMatrixCell {\n background: var(--color-gray-600);\n} */\n\n.ModMatrixToggleCell {\n cursor: pointer;\n}\n\n.ModMatrixComboboxCell {\n background: #252429;\n cursor: pointer;\n}\n\n.ModMatrixComboboxItems {\n position: absolute;\n z-index: 50;\n bottom: -151px;\n left: 0px;\n height: 150px;\n width: 100%;\n background: var(--color-gray-500);\n color: var(--color-text);\n font-family: var(--font-leagueSpartan);\n overflow-y: auto;\n overflow-x: hidden;\n cursor: pointer;\n}\n\n.ModMatrixComboboxItem:hover,\n.ModMatrixComboboxItem:active,\n.ModMatrixComboboxItem[data-selected] {\n background: var(--color-gray-600);\n}\n\n.ModMatrixComboboxItem {\n padding: var(--spacing-md) var(--spacing-lg);\n width: 100%;\n}\n.ModMatrixComboboxButton {\n cursor: pointer;\n}\n\n.ModMatrixInput {\n text-align: center;\n height: 0.8rem;\n}\n";
|
|
4223
4368
|
styleInject(css_248z$1);
|
|
4224
4369
|
|
|
4225
4370
|
var targetColors = [
|
|
@@ -4233,67 +4378,17 @@ var targetColors = [
|
|
|
4233
4378
|
'#cb4d62'
|
|
4234
4379
|
];
|
|
4235
4380
|
var ComboboxCellWidth = '217px';
|
|
4381
|
+
var DeleteButtonCellWidth = '50px';
|
|
4236
4382
|
|
|
4237
|
-
function
|
|
4238
|
-
if (key in obj) {
|
|
4239
|
-
Object.defineProperty(obj, key, {
|
|
4240
|
-
value: value,
|
|
4241
|
-
enumerable: true,
|
|
4242
|
-
configurable: true,
|
|
4243
|
-
writable: true
|
|
4244
|
-
});
|
|
4245
|
-
} else {
|
|
4246
|
-
obj[key] = value;
|
|
4247
|
-
}
|
|
4248
|
-
return obj;
|
|
4249
|
-
}
|
|
4250
|
-
function _object_spread$5(target) {
|
|
4251
|
-
for(var i = 1; i < arguments.length; i++){
|
|
4252
|
-
var source = arguments[i] != null ? arguments[i] : {};
|
|
4253
|
-
var ownKeys = Object.keys(source);
|
|
4254
|
-
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
4255
|
-
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
4256
|
-
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
4257
|
-
}));
|
|
4258
|
-
}
|
|
4259
|
-
ownKeys.forEach(function(key) {
|
|
4260
|
-
_define_property$5(target, key, source[key]);
|
|
4261
|
-
});
|
|
4262
|
-
}
|
|
4263
|
-
return target;
|
|
4264
|
-
}
|
|
4265
|
-
function SingleBarViz(param) {
|
|
4266
|
-
var _param_background = param.background, background = _param_background === void 0 ? 'var(--color-brand)' : _param_background, _param_height = param.height, height = _param_height === void 0 ? '6px' : _param_height, _param_polarity = param.polarity, polarity = _param_polarity === void 0 ? Polarity.unipolar : _param_polarity, _param_orientation = param.orientation, orientation = _param_orientation === void 0 ? Orientation.horizontal : _param_orientation, value = param.value, className = param.className, style = param.style;
|
|
4267
|
-
return /*#__PURE__*/ React__default.createElement("div", {
|
|
4268
|
-
className: className,
|
|
4269
|
-
style: {
|
|
4270
|
-
width: '100%',
|
|
4271
|
-
height: height,
|
|
4272
|
-
background: 'var(--color-gray-600)',
|
|
4273
|
-
position: 'relative'
|
|
4274
|
-
}
|
|
4275
|
-
}, /*#__PURE__*/ React__default.createElement("div", {
|
|
4276
|
-
style: _object_spread$5({
|
|
4277
|
-
position: 'absolute',
|
|
4278
|
-
background: background
|
|
4279
|
-
}, getBarTransformStyles({
|
|
4280
|
-
polarity: polarity,
|
|
4281
|
-
orientation: orientation,
|
|
4282
|
-
normalisedValue: value || 0
|
|
4283
|
-
}), style)
|
|
4284
|
-
}));
|
|
4285
|
-
}
|
|
4286
|
-
SingleBarViz.polarity = Polarity;
|
|
4287
|
-
|
|
4288
|
-
function _array_like_to_array$7(arr, len) {
|
|
4383
|
+
function _array_like_to_array$8(arr, len) {
|
|
4289
4384
|
if (len == null || len > arr.length) len = arr.length;
|
|
4290
4385
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
4291
4386
|
return arr2;
|
|
4292
4387
|
}
|
|
4293
|
-
function _array_with_holes$
|
|
4388
|
+
function _array_with_holes$8(arr) {
|
|
4294
4389
|
if (Array.isArray(arr)) return arr;
|
|
4295
4390
|
}
|
|
4296
|
-
function _iterable_to_array_limit$
|
|
4391
|
+
function _iterable_to_array_limit$8(arr, i) {
|
|
4297
4392
|
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
4298
4393
|
if (_i == null) return;
|
|
4299
4394
|
var _arr = [];
|
|
@@ -4317,27 +4412,28 @@ function _iterable_to_array_limit$7(arr, i) {
|
|
|
4317
4412
|
}
|
|
4318
4413
|
return _arr;
|
|
4319
4414
|
}
|
|
4320
|
-
function _non_iterable_rest$
|
|
4415
|
+
function _non_iterable_rest$8() {
|
|
4321
4416
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
4322
4417
|
}
|
|
4323
|
-
function _sliced_to_array$
|
|
4324
|
-
return _array_with_holes$
|
|
4418
|
+
function _sliced_to_array$8(arr, i) {
|
|
4419
|
+
return _array_with_holes$8(arr) || _iterable_to_array_limit$8(arr, i) || _unsupported_iterable_to_array$8(arr, i) || _non_iterable_rest$8();
|
|
4325
4420
|
}
|
|
4326
|
-
function _unsupported_iterable_to_array$
|
|
4421
|
+
function _unsupported_iterable_to_array$8(o, minLen) {
|
|
4327
4422
|
if (!o) return;
|
|
4328
|
-
if (typeof o === "string") return _array_like_to_array$
|
|
4423
|
+
if (typeof o === "string") return _array_like_to_array$8(o, minLen);
|
|
4329
4424
|
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
4330
4425
|
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
4331
4426
|
if (n === "Map" || n === "Set") return Array.from(n);
|
|
4332
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$
|
|
4427
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$8(o, minLen);
|
|
4333
4428
|
}
|
|
4334
4429
|
var useCombobox = function(param) {
|
|
4335
|
-
var id = param.id, filter = param.filter
|
|
4430
|
+
var id = param.id, filter = param.filter;
|
|
4336
4431
|
var _Object_values;
|
|
4337
4432
|
var comboBoxState = Juce.getComboBoxState(id);
|
|
4338
|
-
var _useState = _sliced_to_array$
|
|
4339
|
-
var _useState1 = _sliced_to_array$
|
|
4340
|
-
var
|
|
4433
|
+
var _useState = _sliced_to_array$8(useState(0), 2), value = _useState[0], setValue = _useState[1];
|
|
4434
|
+
var _useState1 = _sliced_to_array$8(useState(comboBoxState === null || comboBoxState === void 0 ? void 0 : comboBoxState.properties), 2), properties = _useState1[0], setProperties = _useState1[1];
|
|
4435
|
+
var prevValue = useRef(null);
|
|
4436
|
+
var _useGlobalContext = useGlobalContext(); _useGlobalContext.highlightedItemChanged; var setModSlotRowTargetAsPreview = _useGlobalContext.setModSlotRowTargetAsPreview, _useGlobalContext_globalState = _useGlobalContext.globalState, automatableParamLabels = _useGlobalContext_globalState.automatableParamLabels, modSlotTargets = _useGlobalContext_globalState.modSlotTargets, modSlotPreview = _useGlobalContext_globalState.modSlotPreview;
|
|
4341
4437
|
//TODO: Filter choices for subsequent rows
|
|
4342
4438
|
// const availableChoices = properties?.choices;
|
|
4343
4439
|
useEffect(function() {
|
|
@@ -4349,7 +4445,7 @@ var useCombobox = function(param) {
|
|
|
4349
4445
|
setProperties(comboBoxState === null || comboBoxState === void 0 ? void 0 : comboBoxState.properties);
|
|
4350
4446
|
});
|
|
4351
4447
|
useEffect(function() {
|
|
4352
|
-
if (modSlotPreview.slotId === id
|
|
4448
|
+
if (modSlotPreview.slotId === id) {
|
|
4353
4449
|
setValue(modSlotPreview.targetIndex);
|
|
4354
4450
|
}
|
|
4355
4451
|
}, [
|
|
@@ -4359,7 +4455,9 @@ var useCombobox = function(param) {
|
|
|
4359
4455
|
useEffect(function() {
|
|
4360
4456
|
var _comboBoxState_valueChangedEvent, _comboBoxState_propertiesChangedEvent;
|
|
4361
4457
|
var valueListenerId = comboBoxState === null || comboBoxState === void 0 ? void 0 : (_comboBoxState_valueChangedEvent = comboBoxState.valueChangedEvent) === null || _comboBoxState_valueChangedEvent === void 0 ? void 0 : _comboBoxState_valueChangedEvent.addListener(function() {
|
|
4362
|
-
|
|
4458
|
+
if ((comboBoxState === null || comboBoxState === void 0 ? void 0 : comboBoxState.getChoiceIndex()) !== prevValue) {
|
|
4459
|
+
setValue(comboBoxState === null || comboBoxState === void 0 ? void 0 : comboBoxState.getChoiceIndex());
|
|
4460
|
+
}
|
|
4363
4461
|
});
|
|
4364
4462
|
var propertiesListenerId = comboBoxState === null || comboBoxState === void 0 ? void 0 : (_comboBoxState_propertiesChangedEvent = comboBoxState.propertiesChangedEvent) === null || _comboBoxState_propertiesChangedEvent === void 0 ? void 0 : _comboBoxState_propertiesChangedEvent.addListener(function() {
|
|
4365
4463
|
setProperties(comboBoxState === null || comboBoxState === void 0 ? void 0 : comboBoxState.properties);
|
|
@@ -4385,20 +4483,30 @@ var useCombobox = function(param) {
|
|
|
4385
4483
|
var _item_toLowerCase;
|
|
4386
4484
|
return item === null || item === void 0 ? void 0 : (_item_toLowerCase = item.toLowerCase()) === null || _item_toLowerCase === void 0 ? void 0 : _item_toLowerCase.includes(filter === null || filter === void 0 ? void 0 : filter.toLowerCase());
|
|
4387
4485
|
}) : displayedLabels;
|
|
4388
|
-
|
|
4389
|
-
|
|
4390
|
-
|
|
4391
|
-
|
|
4392
|
-
|
|
4393
|
-
|
|
4394
|
-
|
|
4395
|
-
|
|
4396
|
-
|
|
4397
|
-
|
|
4486
|
+
// const prevValue = useRef<string | null>(null);
|
|
4487
|
+
// const handleChange = (newValue: number) => {
|
|
4488
|
+
// if (newValue !== prevValue.current) {
|
|
4489
|
+
// // const juceIndex = automatableParamLabels?.indexOf(newValue);
|
|
4490
|
+
// // comboBoxState?.setChoiceIndex(newValue);s
|
|
4491
|
+
// setValue(newValue);
|
|
4492
|
+
// // onChange && onChange(newValue);
|
|
4493
|
+
// // //@ts-expect-error
|
|
4494
|
+
// // window.__JUCE__.backend.emitEvent('undoableActionOccurred', {});
|
|
4495
|
+
// if (displayValInHeader) {
|
|
4496
|
+
// highlightedItemChanged({
|
|
4497
|
+
// label,
|
|
4498
|
+
// value: automatableParamLabels?.[newValue],
|
|
4499
|
+
// });
|
|
4500
|
+
// }
|
|
4501
|
+
// prevValue.current = newValue;
|
|
4502
|
+
// }
|
|
4503
|
+
// };
|
|
4398
4504
|
var onMouseEnter = function() {
|
|
4399
4505
|
};
|
|
4400
4506
|
var onClick = function() {
|
|
4401
|
-
|
|
4507
|
+
setModSlotRowTargetAsPreview({
|
|
4508
|
+
paramId: id
|
|
4509
|
+
});
|
|
4402
4510
|
};
|
|
4403
4511
|
return {
|
|
4404
4512
|
value: value,
|
|
@@ -4407,20 +4515,19 @@ var useCombobox = function(param) {
|
|
|
4407
4515
|
choices: properties === null || properties === void 0 ? void 0 : properties.choices,
|
|
4408
4516
|
filteredChoices: filteredChoices,
|
|
4409
4517
|
onMouseEnter: onMouseEnter,
|
|
4410
|
-
onClick: onClick
|
|
4411
|
-
handleChange: handleChange
|
|
4518
|
+
onClick: onClick
|
|
4412
4519
|
};
|
|
4413
4520
|
};
|
|
4414
4521
|
|
|
4415
|
-
function _array_like_to_array$
|
|
4522
|
+
function _array_like_to_array$7(arr, len) {
|
|
4416
4523
|
if (len == null || len > arr.length) len = arr.length;
|
|
4417
4524
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
4418
4525
|
return arr2;
|
|
4419
4526
|
}
|
|
4420
|
-
function _array_with_holes$
|
|
4527
|
+
function _array_with_holes$7(arr) {
|
|
4421
4528
|
if (Array.isArray(arr)) return arr;
|
|
4422
4529
|
}
|
|
4423
|
-
function _define_property$
|
|
4530
|
+
function _define_property$5(obj, key, value) {
|
|
4424
4531
|
if (key in obj) {
|
|
4425
4532
|
Object.defineProperty(obj, key, {
|
|
4426
4533
|
value: value,
|
|
@@ -4433,7 +4540,7 @@ function _define_property$4(obj, key, value) {
|
|
|
4433
4540
|
}
|
|
4434
4541
|
return obj;
|
|
4435
4542
|
}
|
|
4436
|
-
function _iterable_to_array_limit$
|
|
4543
|
+
function _iterable_to_array_limit$7(arr, i) {
|
|
4437
4544
|
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
4438
4545
|
if (_i == null) return;
|
|
4439
4546
|
var _arr = [];
|
|
@@ -4457,10 +4564,10 @@ function _iterable_to_array_limit$6(arr, i) {
|
|
|
4457
4564
|
}
|
|
4458
4565
|
return _arr;
|
|
4459
4566
|
}
|
|
4460
|
-
function _non_iterable_rest$
|
|
4567
|
+
function _non_iterable_rest$7() {
|
|
4461
4568
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
4462
4569
|
}
|
|
4463
|
-
function _object_spread$
|
|
4570
|
+
function _object_spread$5(target) {
|
|
4464
4571
|
for(var i = 1; i < arguments.length; i++){
|
|
4465
4572
|
var source = arguments[i] != null ? arguments[i] : {};
|
|
4466
4573
|
var ownKeys = Object.keys(source);
|
|
@@ -4470,48 +4577,55 @@ function _object_spread$4(target) {
|
|
|
4470
4577
|
}));
|
|
4471
4578
|
}
|
|
4472
4579
|
ownKeys.forEach(function(key) {
|
|
4473
|
-
_define_property$
|
|
4580
|
+
_define_property$5(target, key, source[key]);
|
|
4474
4581
|
});
|
|
4475
4582
|
}
|
|
4476
4583
|
return target;
|
|
4477
4584
|
}
|
|
4478
|
-
function _sliced_to_array$
|
|
4479
|
-
return _array_with_holes$
|
|
4585
|
+
function _sliced_to_array$7(arr, i) {
|
|
4586
|
+
return _array_with_holes$7(arr) || _iterable_to_array_limit$7(arr, i) || _unsupported_iterable_to_array$7(arr, i) || _non_iterable_rest$7();
|
|
4480
4587
|
}
|
|
4481
|
-
function _unsupported_iterable_to_array$
|
|
4588
|
+
function _unsupported_iterable_to_array$7(o, minLen) {
|
|
4482
4589
|
if (!o) return;
|
|
4483
|
-
if (typeof o === "string") return _array_like_to_array$
|
|
4590
|
+
if (typeof o === "string") return _array_like_to_array$7(o, minLen);
|
|
4484
4591
|
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
4485
4592
|
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
4486
4593
|
if (n === "Map" || n === "Set") return Array.from(n);
|
|
4487
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$
|
|
4594
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$7(o, minLen);
|
|
4488
4595
|
}
|
|
4489
4596
|
function ModMatrixComboboxCell(param) {
|
|
4490
|
-
var
|
|
4491
|
-
var
|
|
4492
|
-
var
|
|
4493
|
-
var _useState1 = _sliced_to_array$6(useState(''), 2), filterString = _useState1[0], setFilterString = _useState1[1];
|
|
4494
|
-
var _useGlobalContext = useGlobalContext(), automatableParamLabels = _useGlobalContext.globalState.automatableParamLabels;
|
|
4597
|
+
var rowId = param.rowId, key = param.key, color = param.color, style = param.style;
|
|
4598
|
+
var _useState = _sliced_to_array$7(useState(''), 2), filterString = _useState[0], setFilterString = _useState[1];
|
|
4599
|
+
var _useGlobalContext = useGlobalContext(), updateModSlotRowTarget = _useGlobalContext.updateModSlotRowTarget, setModSlotRowTargetAsPreview = _useGlobalContext.setModSlotRowTargetAsPreview, clearModSlotPreview = _useGlobalContext.clearModSlotPreview, setNewModSlotPreview = _useGlobalContext.setNewModSlotPreview, _useGlobalContext_globalState = _useGlobalContext.globalState, modSlotPreview = _useGlobalContext_globalState.modSlotPreview, automatableParamLabels = _useGlobalContext_globalState.automatableParamLabels;
|
|
4495
4600
|
var _useCombobox = useCombobox({
|
|
4496
4601
|
id: rowId,
|
|
4497
|
-
filter: filterString,
|
|
4498
|
-
|
|
4499
|
-
|
|
4500
|
-
|
|
4501
|
-
|
|
4502
|
-
|
|
4503
|
-
|
|
4504
|
-
|
|
4602
|
+
filter: filterString}), value = _useCombobox.value, filteredChoices = _useCombobox.filteredChoices;
|
|
4603
|
+
var previewValue = modSlotPreview.slotId === rowId ? modSlotPreview.targetIndex : null;
|
|
4604
|
+
var onChange = function(newValue) {
|
|
4605
|
+
// TODO: 'juceIndex' is needed here because the 'value' from the combobox is the string label.
|
|
4606
|
+
// Refactor the combobox so that the 'value' is the index number corresponding to the parameter's index in JUCE?
|
|
4607
|
+
// console.log(newValue, 'NV');
|
|
4608
|
+
var juceIndex = automatableParamLabels === null || automatableParamLabels === void 0 ? void 0 : automatableParamLabels.indexOf(newValue);
|
|
4609
|
+
// handleChange(juceIndex);
|
|
4610
|
+
if (rowId === modSlotPreview.slotId) {
|
|
4611
|
+
if (juceIndex > 0) {
|
|
4612
|
+
setModSlotRowTargetAsPreview({
|
|
4613
|
+
paramIndex: juceIndex
|
|
4614
|
+
});
|
|
4615
|
+
} else {
|
|
4616
|
+
clearModSlotPreview();
|
|
4617
|
+
setNewModSlotPreview();
|
|
4618
|
+
}
|
|
4619
|
+
} else {
|
|
4620
|
+
updateModSlotRowTarget(juceIndex, rowId);
|
|
4505
4621
|
}
|
|
4506
|
-
}
|
|
4507
|
-
target
|
|
4508
|
-
]);
|
|
4622
|
+
};
|
|
4509
4623
|
return /*#__PURE__*/ React__default.createElement(Box, {
|
|
4510
4624
|
key: key,
|
|
4511
4625
|
className: "ModMatrixCell ModMatrixComboboxCell",
|
|
4512
4626
|
justifyContent: Box.justifyContent.flexEnd,
|
|
4513
4627
|
flexDirection: Box.flexDirection.column,
|
|
4514
|
-
style: _object_spread$
|
|
4628
|
+
style: _object_spread$5({
|
|
4515
4629
|
color: color
|
|
4516
4630
|
}, style),
|
|
4517
4631
|
padding: [
|
|
@@ -4521,8 +4635,8 @@ function ModMatrixComboboxCell(param) {
|
|
|
4521
4635
|
alignItems: Box.alignItems.flexStart,
|
|
4522
4636
|
height: '2.5rem'
|
|
4523
4637
|
}, /*#__PURE__*/ React__default.createElement(Combobox, {
|
|
4524
|
-
value: value,
|
|
4525
|
-
onChange:
|
|
4638
|
+
value: value || previewValue,
|
|
4639
|
+
onChange: onChange
|
|
4526
4640
|
}, /*#__PURE__*/ React__default.createElement(Box, null, /*#__PURE__*/ React__default.createElement(ComboboxInput, {
|
|
4527
4641
|
displayValue: function(item) {
|
|
4528
4642
|
return value ? automatableParamLabels === null || automatableParamLabels === void 0 ? void 0 : automatableParamLabels[value] : '';
|
|
@@ -4555,17 +4669,10 @@ function ModMatrixComboboxCell(param) {
|
|
|
4555
4669
|
key: item,
|
|
4556
4670
|
value: item
|
|
4557
4671
|
}, /*#__PURE__*/ React__default.createElement(Label, null, item));
|
|
4558
|
-
})))
|
|
4559
|
-
value: targetValue,
|
|
4560
|
-
polarity: SingleBarViz === null || SingleBarViz === void 0 ? void 0 : (_SingleBarViz_polarity = SingleBarViz.polarity) === null || _SingleBarViz_polarity === void 0 ? void 0 : _SingleBarViz_polarity.unipolar,
|
|
4561
|
-
background: color,
|
|
4562
|
-
style: {
|
|
4563
|
-
alignSelf: 'flex-end'
|
|
4564
|
-
}
|
|
4565
|
-
}));
|
|
4672
|
+
}))));
|
|
4566
4673
|
}
|
|
4567
4674
|
|
|
4568
|
-
function _define_property$
|
|
4675
|
+
function _define_property$4(obj, key, value) {
|
|
4569
4676
|
if (key in obj) {
|
|
4570
4677
|
Object.defineProperty(obj, key, {
|
|
4571
4678
|
value: value,
|
|
@@ -4578,7 +4685,7 @@ function _define_property$3(obj, key, value) {
|
|
|
4578
4685
|
}
|
|
4579
4686
|
return obj;
|
|
4580
4687
|
}
|
|
4581
|
-
function _object_spread$
|
|
4688
|
+
function _object_spread$4(target) {
|
|
4582
4689
|
for(var i = 1; i < arguments.length; i++){
|
|
4583
4690
|
var source = arguments[i] != null ? arguments[i] : {};
|
|
4584
4691
|
var ownKeys = Object.keys(source);
|
|
@@ -4588,7 +4695,7 @@ function _object_spread$3(target) {
|
|
|
4588
4695
|
}));
|
|
4589
4696
|
}
|
|
4590
4697
|
ownKeys.forEach(function(key) {
|
|
4591
|
-
_define_property$
|
|
4698
|
+
_define_property$4(target, key, source[key]);
|
|
4592
4699
|
});
|
|
4593
4700
|
}
|
|
4594
4701
|
return target;
|
|
@@ -4597,20 +4704,20 @@ function _object_spread$3(target) {
|
|
|
4597
4704
|
function ModMatrixToggleCell(param) {
|
|
4598
4705
|
var modifier = param.modifier, _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, rowId = param.rowId, color = param.color, style = param.style;
|
|
4599
4706
|
var // getDefaultParameter,
|
|
4600
|
-
|
|
4707
|
+
saveModSlotPreviewRowTargetToBackend = useGlobalContext().saveModSlotPreviewRowTargetToBackend;
|
|
4601
4708
|
// const rowState = Juce.getComboBoxState(rowId);
|
|
4602
4709
|
var _useDropdown = useDropdown({
|
|
4603
4710
|
id: modifier,
|
|
4604
4711
|
rowId: rowId,
|
|
4605
4712
|
isDisabled: isDisabled,
|
|
4606
|
-
onChange:
|
|
4713
|
+
onChange: saveModSlotPreviewRowTargetToBackend
|
|
4607
4714
|
}), index = _useDropdown.index, choices = _useDropdown.choices, handleChange = _useDropdown.handleChange;
|
|
4608
4715
|
return /*#__PURE__*/ React__default.createElement(Box, {
|
|
4609
4716
|
className: "ModMatrixCell ModMatrixToggleCell ".concat(isDisabled ? 'isDisabled' : ''),
|
|
4610
4717
|
justifyContent: Box.justifyContent.flexEnd,
|
|
4611
4718
|
alignItems: Box.alignItems.flexStart,
|
|
4612
4719
|
flexDirection: Box.flexDirection.column,
|
|
4613
|
-
style: _object_spread$
|
|
4720
|
+
style: _object_spread$4({
|
|
4614
4721
|
color: color,
|
|
4615
4722
|
pointerEvents: 'all'
|
|
4616
4723
|
}, style),
|
|
@@ -4634,6 +4741,66 @@ function ModMatrixToggleCell(param) {
|
|
|
4634
4741
|
}, Object.keys(Polarity)[index] || '0')));
|
|
4635
4742
|
}
|
|
4636
4743
|
|
|
4744
|
+
function _define_property$3(obj, key, value) {
|
|
4745
|
+
if (key in obj) {
|
|
4746
|
+
Object.defineProperty(obj, key, {
|
|
4747
|
+
value: value,
|
|
4748
|
+
enumerable: true,
|
|
4749
|
+
configurable: true,
|
|
4750
|
+
writable: true
|
|
4751
|
+
});
|
|
4752
|
+
} else {
|
|
4753
|
+
obj[key] = value;
|
|
4754
|
+
}
|
|
4755
|
+
return obj;
|
|
4756
|
+
}
|
|
4757
|
+
function _object_spread$3(target) {
|
|
4758
|
+
for(var i = 1; i < arguments.length; i++){
|
|
4759
|
+
var source = arguments[i] != null ? arguments[i] : {};
|
|
4760
|
+
var ownKeys = Object.keys(source);
|
|
4761
|
+
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
4762
|
+
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
4763
|
+
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
4764
|
+
}));
|
|
4765
|
+
}
|
|
4766
|
+
ownKeys.forEach(function(key) {
|
|
4767
|
+
_define_property$3(target, key, source[key]);
|
|
4768
|
+
});
|
|
4769
|
+
}
|
|
4770
|
+
return target;
|
|
4771
|
+
}
|
|
4772
|
+
function SingleBarViz(param) {
|
|
4773
|
+
var _param_backgroundColor = param.backgroundColor, backgroundColor = _param_backgroundColor === void 0 ? 'var(--color-gray-600)' : _param_backgroundColor, _param_sliderColor = param.sliderColor, sliderColor = _param_sliderColor === void 0 ? 'var(--color-brand)' : _param_sliderColor, _param_height = param.height, height = _param_height === void 0 ? '6px' : _param_height, _param_polarity = param.polarity, polarity = _param_polarity === void 0 ? Polarity.unipolar : _param_polarity, _param_orientation = param.orientation, orientation = _param_orientation === void 0 ? Orientation.horizontal : _param_orientation, value = param.value, className = param.className, style = param.style;
|
|
4774
|
+
return /*#__PURE__*/ React__default.createElement("div", {
|
|
4775
|
+
className: className,
|
|
4776
|
+
style: {
|
|
4777
|
+
width: '100%',
|
|
4778
|
+
height: height,
|
|
4779
|
+
position: 'relative',
|
|
4780
|
+
background: backgroundColor
|
|
4781
|
+
}
|
|
4782
|
+
}, /*#__PURE__*/ React__default.createElement("div", {
|
|
4783
|
+
className: "SingleBarViz",
|
|
4784
|
+
style: _object_spread$3({
|
|
4785
|
+
position: 'absolute',
|
|
4786
|
+
background: sliderColor
|
|
4787
|
+
}, getBarTransformStyles({
|
|
4788
|
+
polarity: polarity,
|
|
4789
|
+
orientation: orientation,
|
|
4790
|
+
normalisedValue: value || 0
|
|
4791
|
+
}), style)
|
|
4792
|
+
}));
|
|
4793
|
+
}
|
|
4794
|
+
SingleBarViz.polarity = Polarity;
|
|
4795
|
+
|
|
4796
|
+
function _array_like_to_array$6(arr, len) {
|
|
4797
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
4798
|
+
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
4799
|
+
return arr2;
|
|
4800
|
+
}
|
|
4801
|
+
function _array_with_holes$6(arr) {
|
|
4802
|
+
if (Array.isArray(arr)) return arr;
|
|
4803
|
+
}
|
|
4637
4804
|
function _define_property$2(obj, key, value) {
|
|
4638
4805
|
if (key in obj) {
|
|
4639
4806
|
Object.defineProperty(obj, key, {
|
|
@@ -4647,6 +4814,33 @@ function _define_property$2(obj, key, value) {
|
|
|
4647
4814
|
}
|
|
4648
4815
|
return obj;
|
|
4649
4816
|
}
|
|
4817
|
+
function _iterable_to_array_limit$6(arr, i) {
|
|
4818
|
+
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
4819
|
+
if (_i == null) return;
|
|
4820
|
+
var _arr = [];
|
|
4821
|
+
var _n = true;
|
|
4822
|
+
var _d = false;
|
|
4823
|
+
var _s, _e;
|
|
4824
|
+
try {
|
|
4825
|
+
for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
|
|
4826
|
+
_arr.push(_s.value);
|
|
4827
|
+
if (i && _arr.length === i) break;
|
|
4828
|
+
}
|
|
4829
|
+
} catch (err) {
|
|
4830
|
+
_d = true;
|
|
4831
|
+
_e = err;
|
|
4832
|
+
} finally{
|
|
4833
|
+
try {
|
|
4834
|
+
if (!_n && _i["return"] != null) _i["return"]();
|
|
4835
|
+
} finally{
|
|
4836
|
+
if (_d) throw _e;
|
|
4837
|
+
}
|
|
4838
|
+
}
|
|
4839
|
+
return _arr;
|
|
4840
|
+
}
|
|
4841
|
+
function _non_iterable_rest$6() {
|
|
4842
|
+
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
4843
|
+
}
|
|
4650
4844
|
function _object_spread$2(target) {
|
|
4651
4845
|
for(var i = 1; i < arguments.length; i++){
|
|
4652
4846
|
var source = arguments[i] != null ? arguments[i] : {};
|
|
@@ -4681,20 +4875,39 @@ function _object_spread_props(target, source) {
|
|
|
4681
4875
|
}
|
|
4682
4876
|
return target;
|
|
4683
4877
|
}
|
|
4878
|
+
function _sliced_to_array$6(arr, i) {
|
|
4879
|
+
return _array_with_holes$6(arr) || _iterable_to_array_limit$6(arr, i) || _unsupported_iterable_to_array$6(arr, i) || _non_iterable_rest$6();
|
|
4880
|
+
}
|
|
4881
|
+
function _unsupported_iterable_to_array$6(o, minLen) {
|
|
4882
|
+
if (!o) return;
|
|
4883
|
+
if (typeof o === "string") return _array_like_to_array$6(o, minLen);
|
|
4884
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
4885
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
4886
|
+
if (n === "Map" || n === "Set") return Array.from(n);
|
|
4887
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$6(o, minLen);
|
|
4888
|
+
}
|
|
4684
4889
|
function ModMatrixCell(param) {
|
|
4685
4890
|
var modifier = param.modifier, rowId = param.rowId, isDisabled = param.isDisabled, color = param.color, style = param.style;
|
|
4686
4891
|
var _SingleBarViz_polarity;
|
|
4687
|
-
var _useGlobalContext = useGlobalContext(), setDefaultParameter = _useGlobalContext.setDefaultParameter,
|
|
4892
|
+
var _useGlobalContext = useGlobalContext(), setDefaultParameter = _useGlobalContext.setDefaultParameter, saveModSlotPreviewRowTargetToBackend = _useGlobalContext.saveModSlotPreviewRowTargetToBackend;
|
|
4893
|
+
var _useState = _sliced_to_array$6(useState(false), 2); _useState[0]; var setIsActive = _useState[1];
|
|
4688
4894
|
var _useSlider = useSlider({
|
|
4689
4895
|
id: modifier,
|
|
4690
4896
|
rowId: rowId,
|
|
4691
4897
|
displayValInHeader: false,
|
|
4692
4898
|
orientation: Orientation.horizontal,
|
|
4693
4899
|
dragOrientation: Orientation.vertical,
|
|
4694
|
-
onChange:
|
|
4900
|
+
onChange: saveModSlotPreviewRowTargetToBackend,
|
|
4695
4901
|
isDisabled: isDisabled
|
|
4696
|
-
}), bindBarSliderDrag = _useSlider.bindBarSliderDrag, normalisedValue = _useSlider.normalisedValue, scaledValue = _useSlider.scaledValue;
|
|
4697
|
-
return /*#__PURE__*/ React__default.createElement(
|
|
4902
|
+
}), bindBarSliderDrag = _useSlider.bindBarSliderDrag, normalisedValue = _useSlider.normalisedValue, scaledValue = _useSlider.scaledValue, properties = _useSlider.properties, setNormalisedState = _useSlider.setNormalisedState;
|
|
4903
|
+
return /*#__PURE__*/ React__default.createElement(ControlGroup, {
|
|
4904
|
+
id: modifier,
|
|
4905
|
+
className: "ModMatrixCell-Wrapper",
|
|
4906
|
+
isDisabled: isDisabled,
|
|
4907
|
+
onChangeActiveState: function(isActive) {
|
|
4908
|
+
return setIsActive(isActive);
|
|
4909
|
+
}
|
|
4910
|
+
}, /*#__PURE__*/ React__default.createElement(Box, _object_spread_props(_object_spread$2({
|
|
4698
4911
|
className: "ModMatrixCell ".concat(isDisabled ? 'isDisabled' : ''),
|
|
4699
4912
|
justifyContent: Box.justifyContent.flexEnd,
|
|
4700
4913
|
alignItems: Box.alignItems.flexStart,
|
|
@@ -4713,7 +4926,29 @@ function ModMatrixCell(param) {
|
|
|
4713
4926
|
style: {
|
|
4714
4927
|
pointerEvents: 'none'
|
|
4715
4928
|
}
|
|
4716
|
-
}, /*#__PURE__*/ React__default.createElement(
|
|
4929
|
+
}, /*#__PURE__*/ React__default.createElement(Input, {
|
|
4930
|
+
className: "ModMatrixInput",
|
|
4931
|
+
value: scaledValue,
|
|
4932
|
+
id: modifier,
|
|
4933
|
+
min: (properties === null || properties === void 0 ? void 0 : properties.start) || 0,
|
|
4934
|
+
max: (properties === null || properties === void 0 ? void 0 : properties.end) || 0,
|
|
4935
|
+
type: Input.type.number,
|
|
4936
|
+
style: {
|
|
4937
|
+
fontWeight: 'bold',
|
|
4938
|
+
width: '100%',
|
|
4939
|
+
// maxWidth: `${width}px`,
|
|
4940
|
+
marginBottom: 'var(--spacing-sm)'
|
|
4941
|
+
},
|
|
4942
|
+
onComplete: function(value) {
|
|
4943
|
+
var normalisedVal = properties && scaledToNormalised({
|
|
4944
|
+
scaledValue: value,
|
|
4945
|
+
start: properties === null || properties === void 0 ? void 0 : properties.start,
|
|
4946
|
+
end: properties === null || properties === void 0 ? void 0 : properties.end,
|
|
4947
|
+
skew: properties === null || properties === void 0 ? void 0 : properties.skew
|
|
4948
|
+
});
|
|
4949
|
+
normalisedVal !== undefined && setNormalisedState(normalisedVal);
|
|
4950
|
+
}
|
|
4951
|
+
})), /*#__PURE__*/ React__default.createElement(Box, {
|
|
4717
4952
|
style: {
|
|
4718
4953
|
alignSelf: 'flex-end',
|
|
4719
4954
|
pointerEvents: 'none'
|
|
@@ -4721,7 +4956,10 @@ function ModMatrixCell(param) {
|
|
|
4721
4956
|
}, /*#__PURE__*/ React__default.createElement(SingleBarViz, {
|
|
4722
4957
|
value: (modifier === null || modifier === void 0 ? void 0 : modifier.value) || 0,
|
|
4723
4958
|
polarity: SingleBarViz === null || SingleBarViz === void 0 ? void 0 : (_SingleBarViz_polarity = SingleBarViz.polarity) === null || _SingleBarViz_polarity === void 0 ? void 0 : _SingleBarViz_polarity.bipolar,
|
|
4724
|
-
|
|
4959
|
+
// backgroundColor={
|
|
4960
|
+
// isActive ? 'var(--color-gray-500)' : 'var(--color-gray-600)'
|
|
4961
|
+
// }
|
|
4962
|
+
sliderColor: color,
|
|
4725
4963
|
style: _object_spread$2({
|
|
4726
4964
|
alignSelf: 'flex-end',
|
|
4727
4965
|
pointerEvents: 'none'
|
|
@@ -4730,36 +4968,13 @@ function ModMatrixCell(param) {
|
|
|
4730
4968
|
polarity: Polarity === null || Polarity === void 0 ? void 0 : Polarity.bipolar,
|
|
4731
4969
|
normalisedValue: normalisedValue
|
|
4732
4970
|
}))
|
|
4733
|
-
})));
|
|
4971
|
+
}))));
|
|
4734
4972
|
}
|
|
4735
4973
|
|
|
4736
4974
|
function ModMatrixRow(param) {
|
|
4737
4975
|
var rowId = param.rowId, key = param.key;
|
|
4738
4976
|
var _modSlotParams_rowId;
|
|
4739
|
-
|
|
4740
|
-
var _useGlobalContext = useGlobalContext(), // modSlotTargetUpdated,
|
|
4741
|
-
setDefaultParameter = _useGlobalContext.setDefaultParameter, modSlotPreviewIsEditableUpdated = _useGlobalContext.modSlotPreviewIsEditableUpdated, modSlotPreviewTargetIndexUpdated = _useGlobalContext.modSlotPreviewTargetIndexUpdated, setNewModSlotPreview = _useGlobalContext.setNewModSlotPreview, modSlotTargetUpdated = _useGlobalContext.modSlotTargetUpdated, _useGlobalContext_globalState = _useGlobalContext.globalState, modSlotParams = _useGlobalContext_globalState.modSlotParams, modSlotTargets = _useGlobalContext_globalState.modSlotTargets, modSlotPreview = _useGlobalContext_globalState.modSlotPreview;
|
|
4742
|
-
var handleTargetChange = function(newTarget) {
|
|
4743
|
-
if (newTarget > 0) {
|
|
4744
|
-
// modSlotTargetUpdated([rowId, newTarget]);
|
|
4745
|
-
if (rowId === modSlotPreview.slotId) {
|
|
4746
|
-
modSlotPreviewTargetIndexUpdated(newTarget);
|
|
4747
|
-
modSlotPreviewIsEditableUpdated(true);
|
|
4748
|
-
}
|
|
4749
|
-
} else {
|
|
4750
|
-
var _modSlotParams_rowId;
|
|
4751
|
-
modSlotTargetUpdated([
|
|
4752
|
-
rowId,
|
|
4753
|
-
0
|
|
4754
|
-
]);
|
|
4755
|
-
modSlotParams === null || modSlotParams === void 0 ? void 0 : (_modSlotParams_rowId = modSlotParams[rowId]) === null || _modSlotParams_rowId === void 0 ? void 0 : _modSlotParams_rowId.forEach(function(item) {
|
|
4756
|
-
setDefaultParameter(item);
|
|
4757
|
-
});
|
|
4758
|
-
if (!modSlotPreview.slotId) {
|
|
4759
|
-
setNewModSlotPreview();
|
|
4760
|
-
}
|
|
4761
|
-
}
|
|
4762
|
-
};
|
|
4977
|
+
var _useGlobalContext = useGlobalContext(), updateModSlotRowTarget = _useGlobalContext.updateModSlotRowTarget, _useGlobalContext_globalState = _useGlobalContext.globalState, modSlotParams = _useGlobalContext_globalState.modSlotParams, modSlotPreview = _useGlobalContext_globalState.modSlotPreview;
|
|
4763
4978
|
return /*#__PURE__*/ React__default.createElement(Box, {
|
|
4764
4979
|
className: "ModMatrixBodyRow",
|
|
4765
4980
|
gap: Box.gap.medium,
|
|
@@ -4770,10 +4985,10 @@ function ModMatrixRow(param) {
|
|
|
4770
4985
|
flexDirection: Box.flexDirection.column,
|
|
4771
4986
|
style: {
|
|
4772
4987
|
color: targetColors[0]
|
|
4773
|
-
}
|
|
4988
|
+
},
|
|
4989
|
+
flex: "3"
|
|
4774
4990
|
}, /*#__PURE__*/ React__default.createElement(ModMatrixComboboxCell, {
|
|
4775
|
-
target
|
|
4776
|
-
handleTargetChange: handleTargetChange,
|
|
4991
|
+
// target={modSlotTargets[rowId]}
|
|
4777
4992
|
rowId: rowId,
|
|
4778
4993
|
color: targetColors[0],
|
|
4779
4994
|
style: {
|
|
@@ -4788,7 +5003,8 @@ function ModMatrixRow(param) {
|
|
|
4788
5003
|
style: {
|
|
4789
5004
|
color: targetColors[i + 1]
|
|
4790
5005
|
},
|
|
4791
|
-
key: item
|
|
5006
|
+
key: item,
|
|
5007
|
+
flex: "2"
|
|
4792
5008
|
}, i !== arr.length - 1 ? /*#__PURE__*/ React__default.createElement(ModMatrixCell, {
|
|
4793
5009
|
rowId: rowId,
|
|
4794
5010
|
modifier: modSlotParams === null || modSlotParams === void 0 ? void 0 : (_modSlotParams_rowId = modSlotParams[rowId]) === null || _modSlotParams_rowId === void 0 ? void 0 : _modSlotParams_rowId[i],
|
|
@@ -4800,7 +5016,18 @@ function ModMatrixRow(param) {
|
|
|
4800
5016
|
color: targetColors[i + 1],
|
|
4801
5017
|
isDisabled: modSlotPreview.slotId === rowId && !modSlotPreview.targetIndex
|
|
4802
5018
|
}));
|
|
4803
|
-
})
|
|
5019
|
+
}), /*#__PURE__*/ React__default.createElement(Box, {
|
|
5020
|
+
flex: "0 0 ".concat(DeleteButtonCellWidth)
|
|
5021
|
+
}, /*#__PURE__*/ React__default.createElement(IconButton, {
|
|
5022
|
+
backgroundColor: "transparent",
|
|
5023
|
+
id: "delete-row",
|
|
5024
|
+
icon: Icon.icon.delete,
|
|
5025
|
+
width: "20px",
|
|
5026
|
+
disabled: modSlotPreview.slotId === rowId && !modSlotPreview.targetIndex,
|
|
5027
|
+
onClick: function() {
|
|
5028
|
+
return updateModSlotRowTarget(0, rowId);
|
|
5029
|
+
}
|
|
5030
|
+
})));
|
|
4804
5031
|
}
|
|
4805
5032
|
|
|
4806
5033
|
function _array_like_to_array$5(arr, len) {
|
|
@@ -5016,7 +5243,7 @@ function ModMatrix(param) {
|
|
|
5016
5243
|
var getAllModSlotsFunc = Juce.getNativeFunction('getAllModSlots');
|
|
5017
5244
|
var getModSlotParamsFunc = Juce.getNativeFunction('getModSlotParams');
|
|
5018
5245
|
var _useState = _sliced_to_array$5(useState([]), 2), displayedModSlots = _useState[0], setDisplayedModSlots = _useState[1];
|
|
5019
|
-
var _useGlobalContext = useGlobalContext(), automatableParamsListReceived = _useGlobalContext.automatableParamsListReceived, automatableParamLabelsReceived = _useGlobalContext.automatableParamLabelsReceived, modSlotsReceived = _useGlobalContext.modSlotsReceived, setNewModSlotPreview = _useGlobalContext.setNewModSlotPreview, modSlotParamsListReceived = _useGlobalContext.modSlotParamsListReceived, modSlotParamLabelsReceived = _useGlobalContext.modSlotParamLabelsReceived, _useGlobalContext_globalState = _useGlobalContext.globalState, modSlotParamLabels = _useGlobalContext_globalState.modSlotParamLabels, modSlotTargets = _useGlobalContext_globalState.modSlotTargets, modSlotIds = _useGlobalContext_globalState.modSlotIds, modSlotPreview = _useGlobalContext_globalState.modSlotPreview;
|
|
5246
|
+
var _useGlobalContext = useGlobalContext(), automatableParamsListReceived = _useGlobalContext.automatableParamsListReceived, automatableParamLabelsReceived = _useGlobalContext.automatableParamLabelsReceived, modSlotsReceived = _useGlobalContext.modSlotsReceived, modSlotRowTargetsReceived = _useGlobalContext.modSlotRowTargetsReceived, setNewModSlotPreview = _useGlobalContext.setNewModSlotPreview, modSlotParamsListReceived = _useGlobalContext.modSlotParamsListReceived, modSlotParamLabelsReceived = _useGlobalContext.modSlotParamLabelsReceived, _useGlobalContext_globalState = _useGlobalContext.globalState, modSlotParamLabels = _useGlobalContext_globalState.modSlotParamLabels, modSlotTargets = _useGlobalContext_globalState.modSlotTargets, modSlotIds = _useGlobalContext_globalState.modSlotIds, modSlotPreview = _useGlobalContext_globalState.modSlotPreview;
|
|
5020
5247
|
// Empty state preview row
|
|
5021
5248
|
useEffect(function() {
|
|
5022
5249
|
var unassignedModSlots = modSlotIds === null || modSlotIds === void 0 ? void 0 : modSlotIds.filter(function(item) {
|
|
@@ -5030,6 +5257,10 @@ function ModMatrix(param) {
|
|
|
5030
5257
|
modSlotIds,
|
|
5031
5258
|
modSlotPreview
|
|
5032
5259
|
]);
|
|
5260
|
+
// console.log(
|
|
5261
|
+
// modSlotTargets,
|
|
5262
|
+
// 'modSlotTargetsmodSlotTargetsmodSlotTargetsmodSlotTargets',
|
|
5263
|
+
// );
|
|
5033
5264
|
useEffect(function() {
|
|
5034
5265
|
var _Object_keys;
|
|
5035
5266
|
var displayedSlots = (_Object_keys = Object.keys(modSlotTargets)) === null || _Object_keys === void 0 ? void 0 : _Object_keys.reduce(function(acc, item) {
|
|
@@ -5037,11 +5268,12 @@ function ModMatrix(param) {
|
|
|
5037
5268
|
acc === null || acc === void 0 ? void 0 : acc.push(item);
|
|
5038
5269
|
}
|
|
5039
5270
|
return acc;
|
|
5040
|
-
}, [])
|
|
5271
|
+
}, []);
|
|
5272
|
+
// .sort();
|
|
5041
5273
|
var unassignedModSlots = modSlotIds === null || modSlotIds === void 0 ? void 0 : modSlotIds.filter(function(item) {
|
|
5042
5274
|
return modSlotTargets[item] <= 0;
|
|
5043
5275
|
});
|
|
5044
|
-
if (unassignedModSlots.length > 0) {
|
|
5276
|
+
if (unassignedModSlots.length > 0 && modSlotPreview.slotId) {
|
|
5045
5277
|
setDisplayedModSlots(_to_consumable_array(displayedSlots).concat([
|
|
5046
5278
|
modSlotPreview.slotId
|
|
5047
5279
|
]));
|
|
@@ -5088,6 +5320,7 @@ function ModMatrix(param) {
|
|
|
5088
5320
|
automatableParamsListReceived(automatableParamsList === null || automatableParamsList === void 0 ? void 0 : automatableParamsList[0]);
|
|
5089
5321
|
automatableParamLabelsReceived(automatableParamsList === null || automatableParamsList === void 0 ? void 0 : automatableParamsList[1]);
|
|
5090
5322
|
modSlotsReceived(modSlotsData || []);
|
|
5323
|
+
modSlotRowTargetsReceived(modSlotsData || []);
|
|
5091
5324
|
modSlotParamsListReceived(modSlotParams === null || modSlotParams === void 0 ? void 0 : modSlotParams[0]);
|
|
5092
5325
|
modSlotParamLabelsReceived(modSlotParams === null || modSlotParams === void 0 ? void 0 : modSlotParams[1]);
|
|
5093
5326
|
return [
|
|
@@ -5116,7 +5349,9 @@ function ModMatrix(param) {
|
|
|
5116
5349
|
]);
|
|
5117
5350
|
var headers = [
|
|
5118
5351
|
'Target'
|
|
5119
|
-
].concat(_to_consumable_array(modSlotParamLabels)
|
|
5352
|
+
].concat(_to_consumable_array(modSlotParamLabels), [
|
|
5353
|
+
''
|
|
5354
|
+
]);
|
|
5120
5355
|
return /*#__PURE__*/ React__default.createElement(Box, {
|
|
5121
5356
|
gap: Box.gap.medium,
|
|
5122
5357
|
padding: [
|
|
@@ -5135,7 +5370,7 @@ function ModMatrix(param) {
|
|
|
5135
5370
|
return /*#__PURE__*/ React__default.createElement(Box, {
|
|
5136
5371
|
style: {
|
|
5137
5372
|
color: targetColors[i],
|
|
5138
|
-
flex: i === 0 ? "0 0 ".concat(ComboboxCellWidth) : '
|
|
5373
|
+
flex: i === 0 ? "0 0 ".concat(ComboboxCellWidth) : i === headers.length - 1 ? "0 0 ".concat(DeleteButtonCellWidth) : '2'
|
|
5139
5374
|
},
|
|
5140
5375
|
key: item,
|
|
5141
5376
|
className: "ModMatrixHeaderCell",
|
|
@@ -5151,7 +5386,7 @@ function ModMatrix(param) {
|
|
|
5151
5386
|
}, (displayedModSlots === null || displayedModSlots === void 0 ? void 0 : displayedModSlots.length) ? displayedModSlots === null || displayedModSlots === void 0 ? void 0 : displayedModSlots.map(function(item, i) {
|
|
5152
5387
|
return /*#__PURE__*/ React__default.createElement(ModMatrixRow, {
|
|
5153
5388
|
rowId: item,
|
|
5154
|
-
key: item
|
|
5389
|
+
key: "".concat(item + i)
|
|
5155
5390
|
});
|
|
5156
5391
|
}) : null));
|
|
5157
5392
|
}
|