@antimatter-audio/antimatter-ui 9.4.0 → 9.6.0

package/dist/index.js

@@ -87,15 +87,15 @@ var FontSizes = /*#__PURE__*/ function(FontSizes) {
 var css_248z$7 = ".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  font-size: 1rem;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-right: 1px;\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: 0;\n  appearance: none;\n  &:hover,\n  &:focus-visible {\n    outline: none;\n  }\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";
 styleInject(css_248z$7);
 
-function _array_like_to_array$6(arr, len) {
+function _array_like_to_array$7(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
     for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
     return arr2;
 }
-function _array_with_holes$6(arr) {
+function _array_with_holes$7(arr) {
     if (Array.isArray(arr)) return arr;
 }
-function _iterable_to_array_limit$6(arr, i) {
+function _iterable_to_array_limit$7(arr, i) {
     var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
     if (_i == null) return;
     var _arr = [];
@@ -119,19 +119,19 @@ function _iterable_to_array_limit$6(arr, i) {
     }
     return _arr;
 }
-function _non_iterable_rest$6() {
+function _non_iterable_rest$7() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
-function _sliced_to_array$6(arr, i) {
-    return _array_with_holes$6(arr) || _iterable_to_array_limit$6(arr, i) || _unsupported_iterable_to_array$6(arr, i) || _non_iterable_rest$6();
+function _sliced_to_array$7(arr, i) {
+    return _array_with_holes$7(arr) || _iterable_to_array_limit$7(arr, i) || _unsupported_iterable_to_array$7(arr, i) || _non_iterable_rest$7();
 }
-function _unsupported_iterable_to_array$6(o, minLen) {
+function _unsupported_iterable_to_array$7(o, minLen) {
     if (!o) return;
-    if (typeof o === "string") return _array_like_to_array$6(o, minLen);
+    if (typeof o === "string") return _array_like_to_array$7(o, minLen);
     var n = Object.prototype.toString.call(o).slice(8, -1);
     if (n === "Object" && o.constructor) n = o.constructor.name;
     if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$6(o, minLen);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$7(o, minLen);
 }
 function Tabs(param) {
     var items = param.items, className = param.className, _param_padding = param.padding, padding = _param_padding === void 0 ? [
@@ -139,7 +139,7 @@ function Tabs(param) {
     ] : _param_padding, _param_margin = param.margin, margin = _param_margin === void 0 ? [
         Spacing.none
     ] : _param_margin, onChange = param.onChange;
-    var _useState = _sliced_to_array$6(useState(0), 2), selectedItem = _useState[0], setSelectedItem = _useState[1];
+    var _useState = _sliced_to_array$7(useState(0), 2), selectedItem = _useState[0], setSelectedItem = _useState[1];
     var handleChange = function(index) {
         setSelectedItem(index);
         onChange(index);
@@ -196,15 +196,15 @@ var ButtonType = /*#__PURE__*/ function(ButtonType) {
     return ButtonType;
 }({});
 
-function _array_like_to_array$5(arr, len) {
+function _array_like_to_array$6(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
     for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
     return arr2;
 }
-function _array_with_holes$5(arr) {
+function _array_with_holes$6(arr) {
     if (Array.isArray(arr)) return arr;
 }
-function _define_property$b(obj, key, value) {
+function _define_property$c(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
             value: value,
@@ -217,7 +217,7 @@ function _define_property$b(obj, key, value) {
     }
     return obj;
 }
-function _iterable_to_array_limit$5(arr, i) {
+function _iterable_to_array_limit$6(arr, i) {
     var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
     if (_i == null) return;
     var _arr = [];
@@ -241,10 +241,10 @@ function _iterable_to_array_limit$5(arr, i) {
     }
     return _arr;
 }
-function _non_iterable_rest$5() {
+function _non_iterable_rest$6() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
-function _object_spread$b(target) {
+function _object_spread$c(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
@@ -254,27 +254,27 @@ function _object_spread$b(target) {
             }));
         }
         ownKeys.forEach(function(key) {
-            _define_property$b(target, key, source[key]);
+            _define_property$c(target, key, source[key]);
         });
     }
     return target;
 }
-function _sliced_to_array$5(arr, i) {
-    return _array_with_holes$5(arr) || _iterable_to_array_limit$5(arr, i) || _unsupported_iterable_to_array$5(arr, i) || _non_iterable_rest$5();
+function _sliced_to_array$6(arr, i) {
+    return _array_with_holes$6(arr) || _iterable_to_array_limit$6(arr, i) || _unsupported_iterable_to_array$6(arr, i) || _non_iterable_rest$6();
 }
-function _unsupported_iterable_to_array$5(o, minLen) {
+function _unsupported_iterable_to_array$6(o, minLen) {
     if (!o) return;
-    if (typeof o === "string") return _array_like_to_array$5(o, minLen);
+    if (typeof o === "string") return _array_like_to_array$6(o, minLen);
     var n = Object.prototype.toString.call(o).slice(8, -1);
     if (n === "Object" && o.constructor) n = o.constructor.name;
     if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$5(o, minLen);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$6(o, minLen);
 }
 function Button(param) {
     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 ? [
         Spacing.small
     ] : _param_padding, _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;
-    var _React_useState = _sliced_to_array$5(React__default.useState(false), 2), isSelected = _React_useState[0], setIsSelected = _React_useState[1];
+    var _React_useState = _sliced_to_array$6(React__default.useState(false), 2), isSelected = _React_useState[0], setIsSelected = _React_useState[1];
     var buttonState = Juce.getToggleState(id);
     var isLocalhost = window.location.hostname === 'localhost';
     // Update the local state when the ID changes
@@ -331,7 +331,7 @@ function Button(param) {
         onMouseDown: handleMouseDown,
         disabled: disabled,
         onClick: onClick && onClick,
-        style: _object_spread$b({
+        style: _object_spread$c({
             paddingTop: "var(--p-".concat(padding[0], ")"),
             paddingRight: "var(--p-".concat((_padding_ = padding[1]) !== null && _padding_ !== void 0 ? _padding_ : padding[0], ")"),
             paddingBottom: "var(--p-".concat((_padding_1 = padding[2]) !== null && _padding_1 !== void 0 ? _padding_1 : padding[0], ")"),
@@ -347,15 +347,15 @@ Button.size = ButtonSize;
 var css_248z$5 = ".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: 0;\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(--bg-input);\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-item {\n  background-color: var(--bg-popover);\n  padding: var(--spacing-l);\n  cursor: pointer;\n  user-select: none;\n  -webkit-user-select: none;\n  &:hover {\n    background-color: var(--bg-highlighted);\n  }\n  &[data-selected] {\n    background-color: var(--bg-selected);\n  }\n}\n";
 styleInject(css_248z$5);
 
-function _array_like_to_array$4(arr, len) {
+function _array_like_to_array$5(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
     for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
     return arr2;
 }
-function _array_with_holes$4(arr) {
+function _array_with_holes$5(arr) {
     if (Array.isArray(arr)) return arr;
 }
-function _iterable_to_array_limit$4(arr, i) {
+function _iterable_to_array_limit$5(arr, i) {
     var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
     if (_i == null) return;
     var _arr = [];
@@ -379,19 +379,19 @@ function _iterable_to_array_limit$4(arr, i) {
     }
     return _arr;
 }
-function _non_iterable_rest$4() {
+function _non_iterable_rest$5() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
-function _sliced_to_array$4(arr, i) {
-    return _array_with_holes$4(arr) || _iterable_to_array_limit$4(arr, i) || _unsupported_iterable_to_array$4(arr, i) || _non_iterable_rest$4();
+function _sliced_to_array$5(arr, i) {
+    return _array_with_holes$5(arr) || _iterable_to_array_limit$5(arr, i) || _unsupported_iterable_to_array$5(arr, i) || _non_iterable_rest$5();
 }
-function _unsupported_iterable_to_array$4(o, minLen) {
+function _unsupported_iterable_to_array$5(o, minLen) {
     if (!o) return;
-    if (typeof o === "string") return _array_like_to_array$4(o, minLen);
+    if (typeof o === "string") return _array_like_to_array$5(o, minLen);
     var n = Object.prototype.toString.call(o).slice(8, -1);
     if (n === "Object" && o.constructor) n = o.constructor.name;
     if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$4(o, minLen);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$5(o, minLen);
 }
 function Dropdown(param) {
     var _param_items = param.items, items = _param_items === void 0 ? [
@@ -400,8 +400,8 @@ function Dropdown(param) {
         'Mock Item 3'
     ] : _param_items, className = param.className, id = param.id, style = param.style;
     var comboBoxState = Juce.getComboBoxState(id);
-    var _useState = _sliced_to_array$4(useState(comboBoxState.getChoiceIndex()), 2), value = _useState[0], setValue = _useState[1];
-    var _useState1 = _sliced_to_array$4(useState(comboBoxState.properties), 2), properties = _useState1[0], setProperties = _useState1[1];
+    var _useState = _sliced_to_array$5(useState(comboBoxState.getChoiceIndex()), 2), value = _useState[0], setValue = _useState[1];
+    var _useState1 = _sliced_to_array$5(useState(comboBoxState.properties), 2), properties = _useState1[0], setProperties = _useState1[1];
     var handleChange = function(event) {
         comboBoxState.setChoiceIndex(event);
         setValue(event);
@@ -476,19 +476,22 @@ var validate = function(param) {
         isValid: !errorMessages.length && !isIncomplete
     };
 };
+var randomizeValue = function(min, max) {
+    return Math.random() * (max - min) + min;
+};
 
 var css_248z$4 = ".TextInput {\n  user-select: none;\n  -webkit-user-select: none;\n}\n\n.TextInput::-moz-selection {\n  background: transparent;\n}\n.TextInput::selection {\n  background: transparent;\n}\n";
 styleInject(css_248z$4);
 
-function _array_like_to_array$3(arr, len) {
+function _array_like_to_array$4(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
     for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
     return arr2;
 }
-function _array_with_holes$3(arr) {
+function _array_with_holes$4(arr) {
     if (Array.isArray(arr)) return arr;
 }
-function _define_property$a(obj, key, value) {
+function _define_property$b(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
             value: value,
@@ -501,7 +504,7 @@ function _define_property$a(obj, key, value) {
     }
     return obj;
 }
-function _iterable_to_array_limit$3(arr, i) {
+function _iterable_to_array_limit$4(arr, i) {
     var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
     if (_i == null) return;
     var _arr = [];
@@ -525,10 +528,10 @@ function _iterable_to_array_limit$3(arr, i) {
     }
     return _arr;
 }
-function _non_iterable_rest$3() {
+function _non_iterable_rest$4() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
-function _object_spread$a(target) {
+function _object_spread$b(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
@@ -538,21 +541,21 @@ function _object_spread$a(target) {
             }));
         }
         ownKeys.forEach(function(key) {
-            _define_property$a(target, key, source[key]);
+            _define_property$b(target, key, source[key]);
         });
     }
     return target;
 }
-function _sliced_to_array$3(arr, i) {
-    return _array_with_holes$3(arr) || _iterable_to_array_limit$3(arr, i) || _unsupported_iterable_to_array$3(arr, i) || _non_iterable_rest$3();
+function _sliced_to_array$4(arr, i) {
+    return _array_with_holes$4(arr) || _iterable_to_array_limit$4(arr, i) || _unsupported_iterable_to_array$4(arr, i) || _non_iterable_rest$4();
 }
-function _unsupported_iterable_to_array$3(o, minLen) {
+function _unsupported_iterable_to_array$4(o, minLen) {
     if (!o) return;
-    if (typeof o === "string") return _array_like_to_array$3(o, minLen);
+    if (typeof o === "string") return _array_like_to_array$4(o, minLen);
     var n = Object.prototype.toString.call(o).slice(8, -1);
     if (n === "Object" && o.constructor) n = o.constructor.name;
     if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$3(o, minLen);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$4(o, minLen);
 }
 // import { decimalToPercent, percentToDecimal } from '../../common/utils';
 // import debounce from 'lodash.debounce';
@@ -564,9 +567,9 @@ var InputTypes = /*#__PURE__*/ function(InputTypes) {
 function Input(param) {
     var onComplete = param.onComplete, value = param.value, min = param.min, max = param.max, _param_type = param.type, type = _param_type === void 0 ? "text" : _param_type, _param_minLength = param.minLength, minLength = _param_minLength === void 0 ? 1 : _param_minLength, _param_maxLength = param.maxLength, maxLength = _param_maxLength === void 0 ? 20 : _param_maxLength, fontSize = param.fontSize, style = param.style, className = param.className, id = param.id, _param_textColor = param.textColor, textColor = _param_textColor === void 0 ? '#999' : _param_textColor;
     var _inputRef_current;
-    var _useState = _sliced_to_array$3(useState(value), 2), internalValue = _useState[0], setInternalValue = _useState[1];
-    var _useState1 = _sliced_to_array$3(useState(false), 2), hasError = _useState1[0], setHasError = _useState1[1];
-    var _useState2 = _sliced_to_array$3(useState(false), 2), hasIncompleteValue = _useState2[0], setHasIncompleteValue = _useState2[1];
+    var _useState = _sliced_to_array$4(useState(value), 2), internalValue = _useState[0], setInternalValue = _useState[1];
+    var _useState1 = _sliced_to_array$4(useState(false), 2), hasError = _useState1[0], setHasError = _useState1[1];
+    var _useState2 = _sliced_to_array$4(useState(false), 2), hasIncompleteValue = _useState2[0], setHasIncompleteValue = _useState2[1];
     var valueRef = useRef(null);
     var timer, timeoutVal = 2000;
     // (inputValue === '' || /^-?\d+$/.test(inputValue)
@@ -672,7 +675,7 @@ function Input(param) {
         id: id,
         ref: inputRef,
         className: classnames('TextInput', hasIncompleteValue || hasError ? 'is-blinking' : '', className),
-        style: _object_spread$a({
+        style: _object_spread$b({
             // TODO
             // color: hasError ? 'red' : hasIncompleteValue ? '#999' : textColor
             color: hasError ? 'red' : textColor,
@@ -802,15 +805,15 @@ var getPosition = function(param) {
     }
 };
 
-function _array_like_to_array$2(arr, len) {
+function _array_like_to_array$3(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
     for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
     return arr2;
 }
-function _array_with_holes$2(arr) {
+function _array_with_holes$3(arr) {
     if (Array.isArray(arr)) return arr;
 }
-function _iterable_to_array_limit$2(arr, i) {
+function _iterable_to_array_limit$3(arr, i) {
     var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
     if (_i == null) return;
     var _arr = [];
@@ -834,19 +837,19 @@ function _iterable_to_array_limit$2(arr, i) {
     }
     return _arr;
 }
-function _non_iterable_rest$2() {
+function _non_iterable_rest$3() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
-function _sliced_to_array$2(arr, i) {
-    return _array_with_holes$2(arr) || _iterable_to_array_limit$2(arr, i) || _unsupported_iterable_to_array$2(arr, i) || _non_iterable_rest$2();
+function _sliced_to_array$3(arr, i) {
+    return _array_with_holes$3(arr) || _iterable_to_array_limit$3(arr, i) || _unsupported_iterable_to_array$3(arr, i) || _non_iterable_rest$3();
 }
-function _unsupported_iterable_to_array$2(o, minLen) {
+function _unsupported_iterable_to_array$3(o, minLen) {
     if (!o) return;
-    if (typeof o === "string") return _array_like_to_array$2(o, minLen);
+    if (typeof o === "string") return _array_like_to_array$3(o, minLen);
     var n = Object.prototype.toString.call(o).slice(8, -1);
     if (n === "Object" && o.constructor) n = o.constructor.name;
     if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$2(o, minLen);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$3(o, minLen);
 }
 // 20.0f, 15000.0f, 0.1f, 0.7f),800.0f
 // ValueType rangeStart, ValueType rangeEnd, ValueType intervalValue, ValueType skewFactor, bool useSymmetricSkew=false)
@@ -856,7 +859,7 @@ var useSlider = function(param) {
         end: 15000,
         interval: 0.1,
         skew: 0.7
-    } : _param_mockProperties, _param_mockInitialNormalisedValue = param.mockInitialNormalisedValue, mockInitialNormalisedValue = _param_mockInitialNormalisedValue === void 0 ? 0.0 : _param_mockInitialNormalisedValue, _param_sliderOrientation = param.sliderOrientation; _param_sliderOrientation === void 0 ? SliderOrientation.vertical : _param_sliderOrientation; var onChange = param.onChange;
+    } : _param_mockProperties, _param_isRandomizable = param.isRandomizable, isRandomizable = _param_isRandomizable === void 0 ? false : _param_isRandomizable, _param_mockInitialNormalisedValue = param.mockInitialNormalisedValue, mockInitialNormalisedValue = _param_mockInitialNormalisedValue === void 0 ? 0.0 : _param_mockInitialNormalisedValue, _param_sliderOrientation = param.sliderOrientation; _param_sliderOrientation === void 0 ? SliderOrientation.vertical : _param_sliderOrientation; var onChange = param.onChange;
     // const sliderState: JuceSlider = Juce.getSliderState(id);
     // if isLocalhost is true, the front end app is running outside of JUCE in a browser.
     var isLocalhost = window.location.hostname === 'localhost';
@@ -869,11 +872,12 @@ var useSlider = function(param) {
    * AudioProcessorParameter::getValue() (C++).
    */ // See https://github.com/juce-framework/JUCE/blob/51d11a2be6d5c97ccf12b4e5e827006e19f0555a/modules/juce_gui_extra/native/javascript/index.js#L230C1-L238C6
     // NOTE: We can think of this as a percentage value, in 0 to 1 format
-    var _useState = _sliced_to_array$2(useState(0), 2), scaledValue = _useState[0], setScaledValue = _useState[1];
-    var _useState1 = _sliced_to_array$2(useState(0), 2), normalisedValue = _useState1[0], setNormalisedValue = _useState1[1];
-    var _useState2 = _sliced_to_array$2(useState(), 2), properties = _useState2[0], setProperties = _useState2[1];
+    var _useState = _sliced_to_array$3(useState(0), 2), scaledValue = _useState[0], setScaledValue = _useState[1];
+    var _useState1 = _sliced_to_array$3(useState(0), 2), normalisedValue = _useState1[0], setNormalisedValue = _useState1[1];
+    var _useState2 = _sliced_to_array$3(useState(), 2), properties = _useState2[0], setProperties = _useState2[1];
     var scaledValueRef = useRef(null);
     var normalisedValueRef = useRef(null);
+    var randomValueSetCounter = useRef(null);
     // Set the initial state
     useEffect(function() {
         var sliderState = Juce.getSliderState(id);
@@ -903,14 +907,35 @@ var useSlider = function(param) {
             var propertiesListenerId = sliderState === null || sliderState === void 0 ? void 0 : sliderState.propertiesChangedEvent.addListener(function() {
                 return setProperties(sliderState === null || sliderState === void 0 ? void 0 : sliderState.properties);
             });
+            //@ts-expect-error
+            var randomizeListenerId = window.__JUCE__.backend.addEventListener('triggerRandom', function(event) {
+                var lastCharInIdAsNumber = parseInt(id.slice(-1), 10);
+                var selectedBand = event[1] + 1;
+                var idIsNotBandProperty = isNaN(lastCharInIdAsNumber);
+                var idBelongsToSelectedBand = isNaN(lastCharInIdAsNumber) === false && lastCharInIdAsNumber === selectedBand;
+                if (isRandomizable && event[0] !== randomValueSetCounter.current && (idIsNotBandProperty ? true : idBelongsToSelectedBand)) {
+                    var _sliderState_properties, _sliderState_properties1, _sliderState_properties2, _sliderState_properties3;
+                    var randomValue = randomizeValue(sliderState === null || sliderState === void 0 ? void 0 : (_sliderState_properties = sliderState.properties) === null || _sliderState_properties === void 0 ? void 0 : _sliderState_properties.start, sliderState === null || sliderState === void 0 ? void 0 : (_sliderState_properties1 = sliderState.properties) === null || _sliderState_properties1 === void 0 ? void 0 : _sliderState_properties1.end);
+                    var newValue = (sliderState === null || sliderState === void 0 ? void 0 : (_sliderState_properties2 = sliderState.properties) === null || _sliderState_properties2 === void 0 ? void 0 : _sliderState_properties2.start) === 0 && (sliderState === null || sliderState === void 0 ? void 0 : (_sliderState_properties3 = sliderState.properties) === null || _sliderState_properties3 === void 0 ? void 0 : _sliderState_properties3.end) === 1 ? randomValue : scaledToNormalised({
+                        scaledValue: randomValue,
+                        properties: sliderState === null || sliderState === void 0 ? void 0 : sliderState.properties
+                    });
+                    setNormalisedState(newValue);
+                    randomValueSetCounter.current = event;
+                }
+            });
             return function cleanup() {
                 sliderState === null || sliderState === void 0 ? void 0 : sliderState.valueChangedEvent.removeListener(valueListenerId);
                 sliderState === null || sliderState === void 0 ? void 0 : sliderState.propertiesChangedEvent.removeListener(propertiesListenerId);
+                //@ts-expect-error
+                window.__JUCE__.backend.removeEventListener(randomizeListenerId, id);
             };
         } else {
             return;
         }
-    });
+    }, [
+        window
+    ]);
     // Update the local state from JUCE
     var updateLocalState = function(sliderState) {
         var normalisedValueFromState = sliderState === null || sliderState === void 0 ? void 0 : sliderState.getNormalisedValue();
@@ -982,7 +1007,7 @@ var useSlider = function(param) {
 var css_248z$3 = ".RotarySlider {\n  position: relative;\n  height: 50px;\n  width: 50px;\n  border-radius: 50%;\n  aspect-ratio: 1 / 1;\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  border-color: var(--bg-popover) transparent var(--bg-popover) transparent;\n  width: 0;\n  height: 0;\n  border-style: solid;\n  border-width: 0 7px 10px 7px;\n  transform: rotate(180deg);\n  padding-bottom: var(--spacing-sm);\n}\n";
 styleInject(css_248z$3);
 
-function _define_property$9(obj, key, value) {
+function _define_property$a(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
             value: value,
@@ -995,7 +1020,7 @@ function _define_property$9(obj, key, value) {
     }
     return obj;
 }
-function _object_spread$9(target) {
+function _object_spread$a(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
@@ -1005,7 +1030,7 @@ function _object_spread$9(target) {
             }));
         }
         ownKeys.forEach(function(key) {
-            _define_property$9(target, key, source[key]);
+            _define_property$a(target, key, source[key]);
         });
     }
     return target;
@@ -1031,7 +1056,7 @@ function _object_spread_props$1(target, source) {
 }
 function RotarySlider(param) {
     var _param_polarity = param.polarity, polarity = _param_polarity === void 0 ? SliderPolarity.linear : _param_polarity, className = param.className, id = param.id, onMouseEnter = param.onMouseEnter, onChange = param.onChange, _param_rotationBehavior = param.rotationBehavior, rotationBehavior = _param_rotationBehavior === void 0 ? SliderRotationBehavior.rotateIndicator : _param_rotationBehavior, _param_mockInitialNormalisedValue = param.// Mocks the initial scaled value of the slider for web veiws outside of JUCE
-    mockInitialNormalisedValue, mockInitialNormalisedValue = _param_mockInitialNormalisedValue === void 0 ? 0 : _param_mockInitialNormalisedValue, _param_mockProperties = param.mockProperties, mockProperties = _param_mockProperties === void 0 ? {
+    mockInitialNormalisedValue, mockInitialNormalisedValue = _param_mockInitialNormalisedValue === void 0 ? 0 : _param_mockInitialNormalisedValue, _param_isRandomizable = param.isRandomizable, isRandomizable = _param_isRandomizable === void 0 ? false : _param_isRandomizable, _param_mockProperties = param.mockProperties, mockProperties = _param_mockProperties === void 0 ? {
         start: 20.0,
         end: 15000.0,
         interval: 0.1,
@@ -1041,7 +1066,8 @@ function RotarySlider(param) {
         id: id,
         mockProperties: mockProperties,
         mockInitialNormalisedValue: mockInitialNormalisedValue,
-        onChange: onChange
+        onChange: onChange,
+        isRandomizable: isRandomizable
     }), bindDrag = _useSlider.bindDrag, normalisedValue = _useSlider.normalisedValue, scaledValue = _useSlider.scaledValue;
     return /*#__PURE__*/ React__default.createElement("div", {
         style: {
@@ -1052,18 +1078,18 @@ function RotarySlider(param) {
         }
     }, polarity === SliderPolarity.bipolar && /*#__PURE__*/ React__default.createElement("div", {
         className: classnames('RotarySlider-center-marker')
-    }), /*#__PURE__*/ React__default.createElement("div", _object_spread_props$1(_object_spread$9({
+    }), /*#__PURE__*/ React__default.createElement("div", _object_spread_props$1(_object_spread$a({
         className: classnames('RotarySlider', polarity === SliderPolarity.linear ? 'Slider-polarity-linear' : 'Slider-polarity-bipolar', className)
     }, bindDrag()), {
         onMouseEnter: function() {
             return onMouseEnter && onMouseEnter(id, scaledValue);
         },
-        style: _object_spread$9({
+        style: _object_spread$a({
             touchAction: 'none'
         }, style)
     }), normalisedValue !== null ? /*#__PURE__*/ React__default.createElement("div", {
         className: classnames('RotarySlider-Inner'),
-        style: _object_spread$9({
+        style: _object_spread$a({
             rotate: rotationBehavior === SliderRotationBehavior.rotateIndicator ? "".concat(polarity === SliderPolarity.linear ? normalisedValue : normalisedValue + 0.5, "turn") : ''
         }, getTransformString({
             sliderType: SliderType.rotary,
@@ -1076,14 +1102,14 @@ function RotarySlider(param) {
         }))
     }, /*#__PURE__*/ React__default.createElement("div", {
         className: classnames('RotarySlider-Indicator'),
-        style: _object_spread$9({
+        style: _object_spread$a({
             backgroundColor: color
         }, style)
     })) : ''));
 }
 RotarySlider.sliderPolarity = SliderPolarity;
 
-function _define_property$8(obj, key, value) {
+function _define_property$9(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
             value: value,
@@ -1096,7 +1122,7 @@ function _define_property$8(obj, key, value) {
     }
     return obj;
 }
-function _object_spread$8(target) {
+function _object_spread$9(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
@@ -1106,7 +1132,7 @@ function _object_spread$8(target) {
             }));
         }
         ownKeys.forEach(function(key) {
-            _define_property$8(target, key, source[key]);
+            _define_property$9(target, key, source[key]);
         });
     }
     return target;
@@ -1119,7 +1145,7 @@ function Label(param) {
     return /*#__PURE__*/ React.createElement("label", {
         id: id,
         htmlFor: htmlFor,
-        style: _object_spread$8({
+        style: _object_spread$9({
             fontSize: "var(--text-".concat(fontSize),
             paddingTop: "var(--p-".concat(padding[0], ")"),
             paddingRight: "var(--p-".concat((_padding_ = padding[1]) !== null && _padding_ !== void 0 ? _padding_ : padding[0], ")"),
@@ -1160,7 +1186,7 @@ var LayoutTags = /*#__PURE__*/ function(LayoutTags) {
     return LayoutTags;
 }({});
 
-function _define_property$7(obj, key, value) {
+function _define_property$8(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
             value: value,
@@ -1173,7 +1199,7 @@ function _define_property$7(obj, key, value) {
     }
     return obj;
 }
-function _object_spread$7(target) {
+function _object_spread$8(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
@@ -1183,7 +1209,7 @@ function _object_spread$7(target) {
             }));
         }
         ownKeys.forEach(function(key) {
-            _define_property$7(target, key, source[key]);
+            _define_property$8(target, key, source[key]);
         });
     }
     return target;
@@ -1194,7 +1220,7 @@ var BoxDisplay = /*#__PURE__*/ function(BoxDisplay) {
     return BoxDisplay;
 }(BoxDisplay || {});
 function Box(param) {
-    var className = param.className, style = param.style, children = param.children, flex = param.flex, _param_alignItems = param.alignItems, alignItems = _param_alignItems === void 0 ? AlignItems.center : _param_alignItems, _param_justifyContent = param.justifyContent, justifyContent = _param_justifyContent === void 0 ? JustifyContent.center : _param_justifyContent, _param_display = param.display, display = _param_display === void 0 ? "flex" : _param_display, _param_width = param.width, width = _param_width === void 0 ? Width.auto : _param_width, _param_flexWrap = param.flexWrap, flexWrap = _param_flexWrap === void 0 ? FlexWrap.noWrap : _param_flexWrap, _param_height = param.height, height = _param_height === void 0 ? Height.auto : _param_height, _param_border = param.border, border = _param_border === void 0 ? false : _param_border, _param_flexDirection = param.flexDirection, flexDirection = _param_flexDirection === void 0 ? FlexDirection.row : _param_flexDirection, _param_padding = param.padding, padding = _param_padding === void 0 ? [
+    var className = param.className, style = param.style, children = param.children, flex = param.flex, key = param.key, _param_alignItems = param.alignItems, alignItems = _param_alignItems === void 0 ? AlignItems.center : _param_alignItems, _param_justifyContent = param.justifyContent, justifyContent = _param_justifyContent === void 0 ? JustifyContent.center : _param_justifyContent, _param_display = param.display, display = _param_display === void 0 ? "flex" : _param_display, _param_width = param.width, width = _param_width === void 0 ? Width.auto : _param_width, _param_flexWrap = param.flexWrap, flexWrap = _param_flexWrap === void 0 ? FlexWrap.noWrap : _param_flexWrap, _param_height = param.height, height = _param_height === void 0 ? Height.auto : _param_height, _param_border = param.border, border = _param_border === void 0 ? false : _param_border, _param_flexDirection = param.flexDirection, flexDirection = _param_flexDirection === void 0 ? FlexDirection.row : _param_flexDirection, _param_padding = param.padding, padding = _param_padding === void 0 ? [
         Spacing.none,
         Spacing.none,
         Spacing.none,
@@ -1204,8 +1230,9 @@ function Box(param) {
     var _padding_, _padding_1, _padding_2, _ref;
     return /*#__PURE__*/ React__default.createElement(Tag, {
         // id="globalValues"
+        key: key,
         className: className,
-        style: _object_spread$7({
+        style: _object_spread$8({
             flexWrap: flexWrap,
             display: display,
             gap: "var(--gap-".concat(gap, ")"),
@@ -1236,7 +1263,7 @@ Box.padding = Spacing;
 Box.flexWrap = FlexWrap;
 Box.tag = LayoutTags;
 
-function _define_property$6(obj, key, value) {
+function _define_property$7(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
             value: value,
@@ -1249,7 +1276,7 @@ function _define_property$6(obj, key, value) {
     }
     return obj;
 }
-function _object_spread$6(target) {
+function _object_spread$7(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
@@ -1259,7 +1286,7 @@ function _object_spread$6(target) {
             }));
         }
         ownKeys.forEach(function(key) {
-            _define_property$6(target, key, source[key]);
+            _define_property$7(target, key, source[key]);
         });
     }
     return target;
@@ -1284,7 +1311,7 @@ function _object_spread_props(target, source) {
     return target;
 }
 function Slider(param) {
-    var _param_polarity = param.polarity, polarity = _param_polarity === void 0 ? SliderPolarity.linear : _param_polarity, _param_sliderOrientation = param.sliderOrientation, sliderOrientation = _param_sliderOrientation === void 0 ? SliderOrientation.vertical : _param_sliderOrientation, className = param.className, id = param.id, onMouseEnter = param.onMouseEnter, onChange = param.onChange, style = param.style, color = param.color, label = param.label, _param_mockInitialNormalisedValue = param.// Mocks the initial scaled value of the slider for web veiws outside of JUCE
+    var _param_polarity = param.polarity, polarity = _param_polarity === void 0 ? SliderPolarity.linear : _param_polarity, _param_sliderOrientation = param.sliderOrientation, sliderOrientation = _param_sliderOrientation === void 0 ? SliderOrientation.vertical : _param_sliderOrientation, _param_isRandomizable = param.isRandomizable, isRandomizable = _param_isRandomizable === void 0 ? false : _param_isRandomizable, className = param.className, id = param.id, onMouseEnter = param.onMouseEnter, onChange = param.onChange, style = param.style, color = param.color, label = param.label, _param_mockInitialNormalisedValue = param.// Mocks the initial scaled value of the slider for web veiws outside of JUCE
     mockInitialNormalisedValue, mockInitialNormalisedValue = _param_mockInitialNormalisedValue === void 0 ? 0 : _param_mockInitialNormalisedValue, _param_mockProperties = param.mockProperties, mockProperties = _param_mockProperties === void 0 ? {
         start: 20.0,
         end: 15000.0,
@@ -1296,7 +1323,8 @@ function Slider(param) {
         mockProperties: mockProperties,
         mockInitialNormalisedValue: mockInitialNormalisedValue,
         sliderOrientation: sliderOrientation,
-        onChange: onChange
+        onChange: onChange,
+        isRandomizable: isRandomizable
     }), bindBarSliderDrag = _useSlider.bindBarSliderDrag, normalisedValue = _useSlider.normalisedValue, scaledValue = _useSlider.scaledValue;
     return /*#__PURE__*/ React__default.createElement(Box, {
         flexDirection: Box.flexDirection.column,
@@ -1304,13 +1332,13 @@ function Slider(param) {
         className: classnames(className)
     }, polarity === SliderPolarity.bipolar && /*#__PURE__*/ React__default.createElement("div", {
         className: 'Slider-center-marker'
-    }), /*#__PURE__*/ React__default.createElement("div", _object_spread_props(_object_spread$6({
+    }), /*#__PURE__*/ React__default.createElement("div", _object_spread_props(_object_spread$7({
         className: classnames('Slider-bar', 'relative')
     }, bindBarSliderDrag()), {
         onMouseEnter: function() {
             return onMouseEnter && label && onMouseEnter(label, scaledValue);
         },
-        style: _object_spread$6({
+        style: _object_spread$7({
             touchAction: 'none',
             backgroundColor: 'var(--bg-input)',
             minWidth: sliderOrientation === SliderOrientation.horizontal ? '100px' : '20px',
@@ -1319,7 +1347,7 @@ function Slider(param) {
     }), normalisedValue ? /*#__PURE__*/ React__default.createElement("div", {
         // TODO: Why aren't the Tailwind classes working?
         // className={classnames('h-full', 'w-full', 'absolute', 'bg-input')}
-        style: _object_spread$6(_object_spread_props(_object_spread$6({
+        style: _object_spread$7(_object_spread_props(_object_spread$7({
             height: '100%',
             width: '100%',
             position: 'absolute',
@@ -1375,7 +1403,7 @@ var HeadingTags = /*#__PURE__*/ function(HeadingTags) {
     return HeadingTags;
 }({});
 
-function _define_property$5(obj, key, value) {
+function _define_property$6(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
             value: value,
@@ -1388,7 +1416,7 @@ function _define_property$5(obj, key, value) {
     }
     return obj;
 }
-function _object_spread$5(target) {
+function _object_spread$6(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
@@ -1398,7 +1426,7 @@ function _object_spread$5(target) {
             }));
         }
         ownKeys.forEach(function(key) {
-            _define_property$5(target, key, source[key]);
+            _define_property$6(target, key, source[key]);
         });
     }
     return target;
@@ -1411,7 +1439,7 @@ function Heading(param) {
     var _padding_, _padding_1, _padding_2, _ref;
     return /*#__PURE__*/ React.createElement(Tag, {
         id: id,
-        style: _object_spread$5({
+        style: _object_spread$6({
             fontSize: "var(--text-".concat(fontSize),
             paddingTop: "var(--p-".concat(padding[0], ")"),
             paddingRight: "var(--p-".concat((_padding_ = padding[1]) !== null && _padding_ !== void 0 ? _padding_ : padding[0], ")"),
@@ -1463,15 +1491,15 @@ var Matrix = function(param) {
     }));
 };
 
-function _array_like_to_array$1(arr, len) {
+function _array_like_to_array$2(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
     for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
     return arr2;
 }
-function _array_with_holes$1(arr) {
+function _array_with_holes$2(arr) {
     if (Array.isArray(arr)) return arr;
 }
-function _iterable_to_array_limit$1(arr, i) {
+function _iterable_to_array_limit$2(arr, i) {
     var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
     if (_i == null) return;
     var _arr = [];
@@ -1495,26 +1523,26 @@ function _iterable_to_array_limit$1(arr, i) {
     }
     return _arr;
 }
-function _non_iterable_rest$1() {
+function _non_iterable_rest$2() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
-function _sliced_to_array$1(arr, i) {
-    return _array_with_holes$1(arr) || _iterable_to_array_limit$1(arr, i) || _unsupported_iterable_to_array$1(arr, i) || _non_iterable_rest$1();
+function _sliced_to_array$2(arr, i) {
+    return _array_with_holes$2(arr) || _iterable_to_array_limit$2(arr, i) || _unsupported_iterable_to_array$2(arr, i) || _non_iterable_rest$2();
 }
-function _unsupported_iterable_to_array$1(o, minLen) {
+function _unsupported_iterable_to_array$2(o, minLen) {
     if (!o) return;
-    if (typeof o === "string") return _array_like_to_array$1(o, minLen);
+    if (typeof o === "string") return _array_like_to_array$2(o, minLen);
     var n = Object.prototype.toString.call(o).slice(8, -1);
     if (n === "Object" && o.constructor) n = o.constructor.name;
     if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$1(o, minLen);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$2(o, minLen);
 }
 // 20.0f, 15000.0f, 0.1f, 0.7f),800.0f
 // ValueType rangeStart, ValueType rangeEnd, ValueType intervalValue, ValueType skewFactor, bool useSymmetricSkew=false)
 var useIndicator = function(param) {
     var id = param.id;
     var isLocalhost = window.location.hostname === 'localhost';
-    var _useState = _sliced_to_array$1(useState(0), 2), isActive = _useState[0], setIsActive = _useState[1];
+    var _useState = _sliced_to_array$2(useState(0), 2), isActive = _useState[0], setIsActive = _useState[1];
     // Set the initial state
     useEffect(function() {
         if (!isLocalhost) {
@@ -1548,7 +1576,7 @@ var useIndicator = function(param) {
     };
 };
 
-function _define_property$4(obj, key, value) {
+function _define_property$5(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
             value: value,
@@ -1561,7 +1589,7 @@ function _define_property$4(obj, key, value) {
     }
     return obj;
 }
-function _object_spread$4(target) {
+function _object_spread$5(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
@@ -1571,7 +1599,7 @@ function _object_spread$4(target) {
             }));
         }
         ownKeys.forEach(function(key) {
-            _define_property$4(target, key, source[key]);
+            _define_property$5(target, key, source[key]);
         });
     }
     return target;
@@ -1588,7 +1616,7 @@ function IndicatorLight(param) {
     }, /*#__PURE__*/ React__default.createElement("div", {
         id: id,
         className: classnames('IndicatorLight', 'bg-input', className),
-        style: _object_spread$4({
+        style: _object_spread$5({
             width: '12px',
             height: '12px',
             background: isActive ? color : ''
@@ -1598,12 +1626,41 @@ function IndicatorLight(param) {
     }) : null);
 }
 
-var css_248z$2 = ".IconButton {\n  height: 28px;\n  background: var(--bg-page);\n  &:hover {\n    filter: brightness(80%);\n  }\n}\n";
+var css_248z$2 = ".IconButton {\n  height: 28px;\n}\n\n.IconButton:hover {\n  filter: brightness(80%);\n}\n";
 styleInject(css_248z$2);
 
+function _define_property$4(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _object_spread$4(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property$4(target, key, source[key]);
+        });
+    }
+    return target;
+}
 var ButtonIcon = /*#__PURE__*/ function(ButtonIcon) {
     ButtonIcon["undo"] = "UndoIcon";
     ButtonIcon["redo"] = "RedoIcon";
+    ButtonIcon["random"] = "RandomIcon";
     return ButtonIcon;
 }(ButtonIcon || {});
 var UndoIcon = function(param) {
@@ -1654,23 +1711,85 @@ var RedoIcon = function(param) {
         "stroke-linejoin": "round"
     }));
 };
+var RandomIcon = function(param) {
+    var color = param.color;
+    return /*#__PURE__*/ React__default.createElement("svg", {
+        width: "24px",
+        height: "24px",
+        viewBox: "0 0 24 24",
+        "stroke-width": "1.5",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        color: color
+    }, /*#__PURE__*/ React__default.createElement("path", {
+        d: "M11.7 1.1732C11.8856 1.06603 12.1144 1.06603 12.3 1.17321L21.2263 6.3268C21.4119 6.43397 21.5263 6.63205 21.5263 6.84641V17.1536C21.5263 17.3679 21.4119 17.566 21.2263 17.6732L12.3 22.8268C12.1144 22.934 11.8856 22.934 11.7 22.8268L2.77372 17.6732C2.58808 17.566 2.47372 17.3679 2.47372 17.1536V6.84641C2.47372 6.63205 2.58808 6.43397 2.77372 6.32679L11.7 1.1732Z",
+        stroke: color,
+        "stroke-width": "1.5",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round"
+    }), /*#__PURE__*/ React__default.createElement("path", {
+        d: "M17 15L7 15L12 7L17 15Z",
+        stroke: color,
+        "stroke-width": "1.5",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round"
+    }), /*#__PURE__*/ React__default.createElement("path", {
+        d: "M2.5 6.5L12 7",
+        stroke: color,
+        "stroke-width": "1.5",
+        "stroke-linejoin": "round"
+    }), /*#__PURE__*/ React__default.createElement("path", {
+        d: "M2.5 6.5L7 15",
+        stroke: color,
+        "stroke-width": "1.5",
+        "stroke-linejoin": "round"
+    }), /*#__PURE__*/ React__default.createElement("path", {
+        d: "M21.5 6.5L17 15",
+        stroke: color,
+        "stroke-width": "1.5",
+        "stroke-linejoin": "round"
+    }), /*#__PURE__*/ React__default.createElement("path", {
+        d: "M21.5 6.5L12 6.99995L12 1",
+        stroke: color,
+        "stroke-width": "1.5",
+        "stroke-linejoin": "round"
+    }), /*#__PURE__*/ React__default.createElement("path", {
+        d: "M21.5 17.5L17 15",
+        stroke: color,
+        "stroke-width": "1.5",
+        "stroke-linejoin": "round"
+    }), /*#__PURE__*/ React__default.createElement("path", {
+        d: "M2.5 17.5L7 15",
+        stroke: color,
+        "stroke-width": "1.5",
+        "stroke-linejoin": "round"
+    }), /*#__PURE__*/ React__default.createElement("path", {
+        d: "M7 15L12 23L17 15",
+        stroke: color,
+        "stroke-width": "1.5",
+        "stroke-linejoin": "round"
+    }));
+};
 var icons = {
     UndoIcon: UndoIcon,
-    RedoIcon: RedoIcon
+    RedoIcon: RedoIcon,
+    RandomIcon: RandomIcon
 };
 function IconButton(param) {
-    var id = param.id, icon = param.icon, onClick = param.onClick; param.className; var style = param.style;
+    var id = param.id, icon = param.icon, onClick = param.onClick, _param_color = param.color, color = _param_color === void 0 ? 'var(--color-text)' : _param_color, _param_backgroundColor = param.backgroundColor, backgroundColor = _param_backgroundColor === void 0 ? 'var(--bg-page)' : _param_backgroundColor, className = param.className, style = param.style;
     var Icon = icons[icon];
     return /*#__PURE__*/ React__default.createElement(Button, {
         id: id,
-        className: 'IconButton className',
+        className: "IconButton ".concat(className),
         onClick: onClick,
         padding: [
             Button.padding.medium
         ],
-        style: style
+        style: _object_spread$4({
+            backgroundColor: backgroundColor
+        }, style)
     }, /*#__PURE__*/ React__default.createElement(Icon, {
-        color: "var(--color-text)"
+        color: color
     }));
 }
 IconButton.icon = ButtonIcon;
@@ -1818,12 +1937,12 @@ function LinePlot(param) {
 var css_248z$1 = ".Oscilloscope {\n    background: #0EAC8B;\n    box-shadow: inset 0 0 20px #086350;\n    height: 200px;\n  };";
 styleInject(css_248z$1);
 
-function _array_like_to_array(arr, len) {
+function _array_like_to_array$1(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
     for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
     return arr2;
 }
-function _array_with_holes(arr) {
+function _array_with_holes$1(arr) {
     if (Array.isArray(arr)) return arr;
 }
 function _define_property$2(obj, key, value) {
@@ -1839,7 +1958,7 @@ function _define_property$2(obj, key, value) {
     }
     return obj;
 }
-function _iterable_to_array_limit(arr, i) {
+function _iterable_to_array_limit$1(arr, i) {
     var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
     if (_i == null) return;
     var _arr = [];
@@ -1863,7 +1982,7 @@ function _iterable_to_array_limit(arr, i) {
     }
     return _arr;
 }
-function _non_iterable_rest() {
+function _non_iterable_rest$1() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
 function _object_spread$2(target) {
@@ -1881,20 +2000,20 @@ function _object_spread$2(target) {
     }
     return target;
 }
-function _sliced_to_array(arr, i) {
-    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
+function _sliced_to_array$1(arr, i) {
+    return _array_with_holes$1(arr) || _iterable_to_array_limit$1(arr, i) || _unsupported_iterable_to_array$1(arr, i) || _non_iterable_rest$1();
 }
-function _unsupported_iterable_to_array(o, minLen) {
+function _unsupported_iterable_to_array$1(o, minLen) {
     if (!o) return;
-    if (typeof o === "string") return _array_like_to_array(o, minLen);
+    if (typeof o === "string") return _array_like_to_array$1(o, minLen);
     var n = Object.prototype.toString.call(o).slice(8, -1);
     if (n === "Object" && o.constructor) n = o.constructor.name;
     if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array$1(o, minLen);
 }
 function Oscilloscope(param) {
     var width = param.width, height = param.height, className = param.className, style = param.style, id = param.id;
-    var _useState = _sliced_to_array(useState([]), 2), viewData = _useState[0], setViewData = _useState[1];
+    var _useState = _sliced_to_array$1(useState([]), 2), viewData = _useState[0], setViewData = _useState[1];
     useEffect(function() {
         //@ts-expect-error
         var removalToken = window.__JUCE__.backend.addEventListener('oscData', function() {
@@ -1997,16 +2116,12 @@ function ModuleHeader(param) {
         id: "undo",
         icon: IconButton.icon.undo,
         onClick: function() {
-            return undo().then(function() {
-                console.log('undo');
-            });
+            undo();
         }
     }), /*#__PURE__*/ React__default.createElement(IconButton, {
         id: "redo",
         onClick: function() {
-            return redo().then(function() {
-                console.log('redo');
-            });
+            redo();
         },
         icon: IconButton.icon.redo
     }))));
@@ -2056,5 +2171,89 @@ function ModuleFooter(param) {
     });
 }
 
-export { Slider as BarSlider, Box, Button, Dropdown, FontSizes, Heading, IconButton, IndicatorLight, Input, KeyValueDisplayScreen, Label, Matrix, ModuleFooter, ModuleHeader, Oscilloscope, RotarySlider, SliderValue, Spacing, Tabs, clamp, decimalToPercent, getPosition, getTransformString, normalisedToScaled, percentToDecimal, scaledToNormalised as scaledTonormalised, useSlider };
+function _array_like_to_array(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
+function _array_with_holes(arr) {
+    if (Array.isArray(arr)) return arr;
+}
+function _array_without_holes(arr) {
+    if (Array.isArray(arr)) return _array_like_to_array(arr);
+}
+function _iterable_to_array(iter) {
+    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
+function _iterable_to_array_limit(arr, i) {
+    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
+    if (_i == null) return;
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _s, _e;
+    try {
+        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
+            _arr.push(_s.value);
+            if (i && _arr.length === i) break;
+        }
+    } catch (err) {
+        _d = true;
+        _e = err;
+    } finally{
+        try {
+            if (!_n && _i["return"] != null) _i["return"]();
+        } finally{
+            if (_d) throw _e;
+        }
+    }
+    return _arr;
+}
+function _non_iterable_rest() {
+    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _non_iterable_spread() {
+    throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _sliced_to_array(arr, i) {
+    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
+}
+function _to_consumable_array(arr) {
+    return _array_without_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_spread();
+}
+function _unsupported_iterable_to_array(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _array_like_to_array(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
+}
+function useObservable() {
+    var _useState = _sliced_to_array(useState([]), 2), observers = _useState[0], setObservers = _useState[1];
+    var subscribe = function(observer) {
+        if (!observers.includes(observer)) {
+            setObservers(_to_consumable_array(observers).concat([
+                observer
+            ]));
+        }
+    };
+    var unsubscribe = function(observer) {
+        setObservers(observers.filter(function(item) {
+            return item !== observer;
+        }));
+    };
+    var fire = function(action) {
+        observers.forEach(function() {
+            return action();
+        });
+    };
+    return {
+        subscribe: subscribe,
+        unsubscribe: unsubscribe,
+        fire: fire
+    };
+}
+
+export { Slider as BarSlider, Box, Button, Dropdown, FontSizes, Heading, IconButton, IndicatorLight, Input, KeyValueDisplayScreen, Label, Matrix, ModuleFooter, ModuleHeader, Oscilloscope, RotarySlider, SliderValue, Spacing, Tabs, clamp, decimalToPercent, getPosition, getTransformString, normalisedToScaled, percentToDecimal, randomizeValue, scaledToNormalised as scaledTonormalised, useObservable, useSlider };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../node_modules/style-inject/dist/style-inject.es.js"],"sourcesContent":["function styleInject(css, ref) {\n  if ( ref === void 0 ) ref = {};\n  var insertAt = ref.insertAt;\n\n  if (!css || typeof document === 'undefined') { return; }\n\n  var head = document.head || document.getElementsByTagName('head')[0];\n  var style = document.createElement('style');\n  style.type = 'text/css';\n\n  if (insertAt === 'top') {\n    if (head.firstChild) {\n      head.insertBefore(style, head.firstChild);\n    } else {\n      head.appendChild(style);\n    }\n  } else {\n    head.appendChild(style);\n  }\n\n  if (style.styleSheet) {\n    style.styleSheet.cssText = css;\n  } else {\n    style.appendChild(document.createTextNode(css));\n  }\n}\n\nexport default styleInject;\n"],"names":[],"mappings":";;;;;;;;;AAAA,SAAS,WAAW,CAAC,GAAG,EAAE,GAAG,EAAE;AAC/B,EAAE,KAAK,GAAG,KAAK,MAAM,GAAG,GAAG,GAAG,EAAE;AAChC,EAAE,IAAI,QAAQ,GAAG,GAAG,CAAC,QAAQ;;AAE7B,EAAE,IAAI,CAAC,GAAG,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE,EAAE,OAAO;;AAExD,EAAE,IAAI,IAAI,GAAG,QAAQ,CAAC,IAAI,IAAI,QAAQ,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;AACtE,EAAE,IAAI,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC;AAC7C,EAAE,KAAK,CAAC,IAAI,GAAG,UAAU;;AAEzB,EAAE,IAAI,QAAQ,KAAK,KAAK,EAAE;AAC1B,IAAI,IAAI,IAAI,CAAC,UAAU,EAAE;AACzB,MAAM,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC;AAC/C,KAAK,MAAM;AACX,MAAM,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAC7B;AACA,GAAG,MAAM;AACT,IAAI,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAC3B;;AAEA,EAAE,IAAI,KAAK,CAAC,UAAU,EAAE;AACxB,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,GAAG,GAAG;AAClC,GAAG,MAAM;AACT,IAAI,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;AACnD;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","x_google_ignoreList":[0]}
+{"version":3,"file":"index.js","sources":["../node_modules/style-inject/dist/style-inject.es.js"],"sourcesContent":["function styleInject(css, ref) {\n  if ( ref === void 0 ) ref = {};\n  var insertAt = ref.insertAt;\n\n  if (!css || typeof document === 'undefined') { return; }\n\n  var head = document.head || document.getElementsByTagName('head')[0];\n  var style = document.createElement('style');\n  style.type = 'text/css';\n\n  if (insertAt === 'top') {\n    if (head.firstChild) {\n      head.insertBefore(style, head.firstChild);\n    } else {\n      head.appendChild(style);\n    }\n  } else {\n    head.appendChild(style);\n  }\n\n  if (style.styleSheet) {\n    style.styleSheet.cssText = css;\n  } else {\n    style.appendChild(document.createTextNode(css));\n  }\n}\n\nexport default styleInject;\n"],"names":[],"mappings":";;;;;;;;;AAAA,SAAS,WAAW,CAAC,GAAG,EAAE,GAAG,EAAE;AAC/B,EAAE,KAAK,GAAG,KAAK,MAAM,GAAG,GAAG,GAAG,EAAE;AAChC,EAAE,IAAI,QAAQ,GAAG,GAAG,CAAC,QAAQ;;AAE7B,EAAE,IAAI,CAAC,GAAG,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE,EAAE,OAAO;;AAExD,EAAE,IAAI,IAAI,GAAG,QAAQ,CAAC,IAAI,IAAI,QAAQ,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;AACtE,EAAE,IAAI,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC;AAC7C,EAAE,KAAK,CAAC,IAAI,GAAG,UAAU;;AAEzB,EAAE,IAAI,QAAQ,KAAK,KAAK,EAAE;AAC1B,IAAI,IAAI,IAAI,CAAC,UAAU,EAAE;AACzB,MAAM,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC;AAC/C,KAAK,MAAM;AACX,MAAM,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAC7B;AACA,GAAG,MAAM;AACT,IAAI,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAC3B;;AAEA,EAAE,IAAI,KAAK,CAAC,UAAU,EAAE;AACxB,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,GAAG,GAAG;AAClC,GAAG,MAAM;AACT,IAAI,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;AACnD;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","x_google_ignoreList":[0]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antimatter-audio/antimatter-ui",
-  "version": "9.4.0",
+  "version": "9.6.0",
   "description": "React UI component library for Antimatter Audio.",
   "repository": {
     "type": "git",