zds-pickers 4.0.12 → 4.0.14

package/dist/index.js

@@ -2,7 +2,7 @@ export * from './midi/ccValues';
 export * from './midi/export';
 export * from './other/DefaultTooltip';
 export * from './other/OctavePlayer';
-export * from './other/SVGText';
+export * from './other/SvgText';
 export * from './pickers/ChannelMappingPicker';
 export * from './pickers/ChannelPicker';
 export * from './pickers/Knob';

package/dist/midi/ccValues.js

@@ -1,4 +1,4 @@
-const CC_NAMES = [
+const changeControllerOptions = [
     'Bank Select',
     'Modulation Wheel',
     'Breath Controller',
@@ -131,4 +131,4 @@ const CC_NAMES = [
     label: String(label).length ? `${value} - ${label}` : String(value),
     value,
 }));
-export default CC_NAMES;
+export { changeControllerOptions };

package/dist/midi/export.js

@@ -24,4 +24,46 @@ const extractStatusAndChannel = (status) => ({
     status: (((status & MASK_STATUS) >> 4) | 8),
     channel: status & MASK_CHANNEL,
 });
-export { combineStatusWithChannel, extractStatusAndChannel, getStatusLabel, MASK_CHANNEL, MASK_STATUS, statusOptions, Statuses, };
+const RESPONSE_CURVE_0 = 0;
+const RESPONSE_CURVE_1 = 1;
+const RESPONSE_CURVE_2 = 2;
+const RESPONSE_CURVE_3 = 3;
+const RESPONSE_CURVE_4 = 4;
+const RESPONSE_CURVE_5 = 5;
+const RESPONSE_CURVE_6 = 6;
+const RESPONSE_CURVE_7 = 7;
+const responseCurves = [
+    {
+        value: RESPONSE_CURVE_7,
+        label: 'Always maxed out.',
+    },
+    {
+        value: RESPONSE_CURVE_6,
+        label: 'Most sensitive.',
+    },
+    {
+        value: RESPONSE_CURVE_5,
+        label: 'Moderately sensitive.',
+    },
+    {
+        value: RESPONSE_CURVE_4,
+        label: 'A little sensitive.',
+    },
+    {
+        value: RESPONSE_CURVE_0,
+        label: 'Linear, no change.',
+    },
+    {
+        value: RESPONSE_CURVE_1,
+        label: 'A little less sensitive.',
+    },
+    {
+        value: RESPONSE_CURVE_2,
+        label: 'Even less sensitive.',
+    },
+    {
+        value: RESPONSE_CURVE_3,
+        label: 'Least sensitive.',
+    },
+];
+export { combineStatusWithChannel, extractStatusAndChannel, getStatusLabel, MASK_CHANNEL, MASK_STATUS, responseCurves, Statuses, statusOptions, };

package/dist/other/DefaultTooltip.js

@@ -1,3 +1,3 @@
 import { Fragment, createElement } from 'react';
 const DefaultTooltip = ({ children }) => createElement(Fragment, null, children);
-export default DefaultTooltip;
+export { DefaultTooltip };

package/dist/other/OctavePlayer.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { /* Midi, */ Note } from 'tonal';
 import { Piano as ReactPiano } from 'zds-react-piano';
-import SoundfontProvider from './SoundFontProvider';
+import { SoundfontProvider } from './SoundFontProvider';
 const baseNotes = [
     'C',
     'C#',
@@ -23,7 +23,7 @@ const baseNotes = [
 const numNotes = 12;
 const whiteNotes = numNotes * 0.7; // approx
 const audioContext = new window.AudioContext();
-const OctavePlayer = ({ octave, height, width, ...rest }) => {
+const BaseOctavePlayer = ({ octave, height, width, ...rest }) => {
     const keyWidth = width / whiteNotes + 2;
     const keyWidthToHeight = keyWidth / height;
     const firstNote = Note.midi(baseNotes[0] + String(octave)) || 0;
@@ -35,7 +35,7 @@ const WithProvider = ({ format, height, hostname, instrumentName, octave = 4, on
     hostname,
     instrumentName,
     onChange,
-    soundfont, render: ({ isLoading, playNote, stopNote, }) => (_jsxs(_Fragment, { children: [_jsx("div", { children: _jsxs("h2", { children: ["Octave: ", octave] }) }), _jsx(OctavePlayer, { disabled: isLoading, height,
+    soundfont, render: ({ isLoading, playNote, stopNote, }) => (_jsxs(_Fragment, { children: [_jsx("div", { children: _jsxs("h2", { children: ["Octave: ", octave] }) }), _jsx(BaseOctavePlayer, { disabled: isLoading, height,
                 octave,
                 onClick,
                 onDoubleClick,
@@ -45,4 +45,4 @@ const WithProvider = ({ format, height, hostname, instrumentName, octave = 4, on
                 stopNote,
                 Tooltip,
                 width })] })) }));
-export default WithProvider;
+export { WithProvider as OctavePlayer };

package/dist/other/SoundFontProvider.js

@@ -84,4 +84,4 @@ const SoundfontProvider = (props) => {
 };
 // https://gleitz.github.io/midi-js-soundfonts/MusyngKite/acoustic_grand_piano-mp3.js
 // https://gleitz.github.io/midi-js-soundfonts/FluidR3_GM/.js
-export default SoundfontProvider;
+export { SoundfontProvider };

package/dist/other/{SVGText.js → SvgText.js}

@@ -43,7 +43,7 @@ const calculateWordWidths = (style, textNode, text) => {
     }
     return undefined;
 };
-const Text = (props) => {
+const SvgText = (props) => {
     const { className = '', dx = 0, dy = 0, maxHeight = 1000, maxWidth = 1000, 
     // textAnchor = 'start',
     text = '', verticalAnchor = 'start', x = 0, y = 0, transform = '', ...rest } = props;
@@ -105,5 +105,4 @@ const Text = (props) => {
         // textAnchor={textAnchor}
         transform: transform, ...rest, children: _jsxs(_Fragment, { children: [displayedLines.map((line, idx) => (_jsx("tspan", { dx: x + dx, dy: idx === 0 ? startDy + dy : wordWidths?.lineHeight || 0, x: 0, children: line.words.join(' ') }, idx))), textLines.length && displayedLines.length !== textLines.length && (_jsxs(_Fragment, { children: [_jsx("tspan", { children: "..." }), _jsx("title", { children: text })] }))] }) }));
 };
-export default Text;
-export { MEASUREMENT_ELEMENT_ID };
+export { SvgText, MEASUREMENT_ELEMENT_ID };

package/dist/pickers/CCPicker.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
-import ccValues from '../midi/ccValues';
-import Select from './Select';
-const CCPicker = forwardRef((props, ref) => (_jsx(Select, { ...props, options: ccValues, ref: ref })));
-export default CCPicker;
+import { changeControllerOptions } from '../midi/ccValues';
+import { Select } from './Select';
+const CCPicker = forwardRef((props, ref) => (_jsx(Select, { ...props, options: changeControllerOptions, ref: ref })));
+export { CCPicker };

package/dist/pickers/ChannelMappingPicker.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import cl from 'classnames';
 import { forwardRef, useCallback, useEffect, useState } from 'react';
 import { arraySequence } from '../utils';
-import Select from './Select';
+import { Select } from './Select';
 const defaultOptions = arraySequence(16).map(value => ({
     value,
     label: value,
@@ -47,4 +47,4 @@ const ChannelMappingPicker = forwardRef(({ channels, className, ...rest }, ref)
     }, [channels]);
     return (_jsx(Select, { ...rest, className: cl(className, 'channel-mapping-picker'), formatOptionLabel: formatOptionLabel, options: options, ref: ref }));
 });
-export default ChannelMappingPicker;
+export { ChannelMappingPicker };

package/dist/pickers/ChannelPicker.js

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import cl from 'classnames';
 import { forwardRef } from 'react';
 import { arraySequence } from '../utils';
-import Select from './Select';
+import { Select } from './Select';
 const options = arraySequence(16).map(value => ({
     value: value,
     label: `Channel ${value + 1}`,
@@ -18,4 +18,4 @@ const filterOptions = (option, input) => {
 const ChannelPicker = forwardRef(({ className, ...rest }, ref) => {
     return (_jsx(Select, { ...rest, className: cl(className, 'channel-picker'), filterOptions: filterOptions, formatOptionLabel: formatOptionLabel, options: options, ref: ref }));
 });
-export default ChannelPicker;
+export { ChannelPicker };

package/dist/pickers/Knob.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useCallback } from 'react';
 import useStateWithDynamicDefault from '../hooks/useStateWithDynamicDefault';
-import RotaryKnob from '../rotaryKnob';
+import { RotaryKnob } from '../rotaryKnob';
 import { assertRange } from '../utils';
-import knobSkin10 from './knobSkin10';
+import { knobSkin10 } from './knobSkin10';
 const Knob = (props) => {
     const { disabled = false, max = 127, min = 0, onChange, value: initialValue = 0, wheelEnabled = false, wheelSensitivity = 0.1, ...rest } = props;
     const [value, setValue] = useStateWithDynamicDefault(initialValue);
@@ -46,4 +46,4 @@ const Knob = (props) => {
          */
         skin: knobSkin10, style: { opacity: disabled ? 0.4 : 1 }, unlockDistance: 0, defaultValue: value, max, min, value, ...rest }));
 };
-export default Knob;
+export { Knob };

package/dist/pickers/KnobPicker.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useMemo } from 'react';
 import { arraySequence } from '../utils';
-import Knob from './Knob';
-import Select from './Select';
+import { Knob } from './Knob';
+import { Select } from './Select';
 const KnobPicker = forwardRef((props, ref) => {
     const { disabled, highToLow, includeLabel, includePicker, knobProps, label, max = 127, min = 0, onChange, shrinkLabel, value = 0, wheelEnabled, wheelSensitivity = 0.1, ...rest } = props;
     const options = useMemo(() => {
@@ -26,4 +26,4 @@ const KnobPicker = forwardRef((props, ref) => {
                         wheelSensitivity,
                         ...knobProps })] })] }));
 });
-export default KnobPicker;
+export { KnobPicker };

package/dist/pickers/LatchPicker.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
-import Select from './Select';
+import { Select } from './Select';
 const options = [
     { value: 0, label: 'Momentary' },
     { value: 1, label: 'Latching' },
 ];
 const LatchPicker = forwardRef((props, ref) => (_jsx(Select, { ...props, options: options, ref: ref })));
-export default LatchPicker;
+export { LatchPicker };

package/dist/pickers/MappingPicker.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useMemo } from 'react';
 import { getStockNames, getUserMappingNames } from 'zds-mappings';
-import Select from './Select';
+import { Select } from './Select';
 const MappingPicker = forwardRef(({ allowClearing, ...rest }, ref) => {
     const stockMappings = getStockNames();
     const userMappings = getUserMappingNames();
@@ -34,4 +34,4 @@ const MappingPicker = forwardRef(({ allowClearing, ...rest }, ref) => {
     }, [allowClearing, stockMappings, userMappings]);
     return (_jsx(Select, { ...rest, options: options, ref: ref }));
 });
-export default MappingPicker;
+export { MappingPicker };

package/dist/pickers/NotePicker.js

@@ -4,7 +4,7 @@ import { Midi } from 'tonal';
 import { emptyMapping } from 'zds-mappings';
 import useStateWithDynamicDefault from '../hooks/useStateWithDynamicDefault';
 import { assertRange } from '../utils';
-import Select from './Select';
+import { Select } from './Select';
 const { midiToNoteName } = Midi;
 const formattedMapEntry = ({ note, name }) => `${note} ${name.length ? '-' : ''} ${name}`;
 const formattedListEntry = (label, idx) => ({
@@ -42,4 +42,4 @@ const NotePicker = forwardRef((props, ref) => {
         // isDisabled={disabled}
         onChange: handleChange, options: options, ref: ref, value: value }));
 });
-export default NotePicker;
+export { NotePicker };

package/dist/pickers/PianoPicker.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Piano as ReactPiano } from 'zds-react-piano';
-import SoundfontProvider from '../other/SoundFontProvider';
+import { SoundfontProvider } from '../other/SoundFontProvider';
 const firstNote = 21;
 const lastNote = 108;
 const numNotes = lastNote - firstNote - 1;
 const whiteNotes = numNotes * 0.7; // approx
 const audioContext = new window.AudioContext();
-const PianoPicker = ({ height, width, ...rest }) => {
+const BasePianoPicker = ({ height, width, ...rest }) => {
     const keyWidth = width / whiteNotes + 2;
     const keyWidthToHeight = keyWidth / height;
     return (_jsx("div", { children: _jsx(ReactPiano, { keyWidthToHeight: keyWidthToHeight, noteRange: { first: firstNote, last: lastNote }, width: width, ...rest }) }));
@@ -16,7 +16,7 @@ const WithProvider = ({ format, height, hostname, instrumentName, onChange, onCl
     hostname,
     instrumentName,
     onChange,
-    soundfont, render: ({ isLoading, playNote, stopNote }) => (_jsx(PianoPicker, { disabled: isLoading, height,
+    soundfont, render: ({ isLoading, playNote, stopNote }) => (_jsx(BasePianoPicker, { disabled: isLoading, height,
         onClick,
         onDoubleClick,
         onKeyMouseEnter,
@@ -24,4 +24,4 @@ const WithProvider = ({ format, height, hostname, instrumentName, onChange, onCl
         playNote,
         stopNote,
         width })) }));
-export default WithProvider;
+export { WithProvider as PianoPicker };

package/dist/pickers/PolarityPicker.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
-import Select from './Select';
+import { Select } from './Select';
 const PolarityPicker = forwardRef(({ labelOff = 'Normally Off', labelOn = 'Normally On', ...rest }, ref) => {
     const options = [
         { value: 0, label: labelOff },
@@ -8,4 +8,4 @@ const PolarityPicker = forwardRef(({ labelOff = 'Normally Off', labelOn = 'Norma
     ];
     return (_jsx(Select, { ...rest, options: options, ref: ref }));
 });
-export default PolarityPicker;
+export { PolarityPicker };

package/dist/pickers/ResponseCurve.js

@@ -1,50 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRef } from 'react';
 import useComponentSize from '../hooks/useComponentSize';
-import DefaultTooltip from '../other/DefaultTooltip';
-import SVGText from '../other/SVGText';
-const RESPONSE_CURVE_0 = 0;
-const RESPONSE_CURVE_1 = 1;
-const RESPONSE_CURVE_2 = 2;
-const RESPONSE_CURVE_3 = 3;
-const RESPONSE_CURVE_4 = 4;
-const RESPONSE_CURVE_5 = 5;
-const RESPONSE_CURVE_6 = 6;
-const RESPONSE_CURVE_7 = 7;
-const RESPONSE_CURVES = [
-    {
-        value: RESPONSE_CURVE_7,
-        label: 'Always maxed out.',
-    },
-    {
-        value: RESPONSE_CURVE_6,
-        label: 'Most sensitive.',
-    },
-    {
-        value: RESPONSE_CURVE_5,
-        label: 'Moderately sensitive.',
-    },
-    {
-        value: RESPONSE_CURVE_4,
-        label: 'A little sensitive.',
-    },
-    {
-        value: RESPONSE_CURVE_0,
-        label: 'Linear, no change.',
-    },
-    {
-        value: RESPONSE_CURVE_1,
-        label: 'A little less sensitive.',
-    },
-    {
-        value: RESPONSE_CURVE_2,
-        label: 'Even less sensitive.',
-    },
-    {
-        value: RESPONSE_CURVE_3,
-        label: 'Least sensitive.',
-    },
-];
+import { responseCurves as origResponseCurves, } from '../midi/export';
+import { DefaultTooltip } from '../other/DefaultTooltip';
+import { SvgText } from '../other/SvgText';
 // const width = 218
 // const height = 150
 const axisOffset = 20;
@@ -63,7 +22,7 @@ const ResponseCurve = (props) => {
     const xMid = width / 2;
     const yMid = height / 2;
     const svgProps = { ref: svgRef };
-    const responseCurves = RESPONSE_CURVES.map(
+    const responseCurves = origResponseCurves.map(
     // biome-ignore lint/complexity/noExcessiveCognitiveComplexity: <explanation>
     ({ value, label }) => {
         let c1 = 0;
@@ -75,48 +34,48 @@ const ResponseCurve = (props) => {
         let labelX = xMid;
         let labelY = yMid;
         switch (value) {
-            case RESPONSE_CURVE_0:
+            case responseCurves[0].value:
                 c1 = xMid;
                 c2 = yMid;
                 labelY += 3;
                 break;
-            case RESPONSE_CURVE_1:
+            case responseCurves[1].value:
                 c1 = inverted ? xMid + width * 0.13 : xMid - width * 0.13;
                 c2 = yMid - height * 0.13;
                 labelX = inverted ? xMid + width * 0.1 : xMid - width * 0.1;
                 labelY = yMid - height * 0.09;
                 break;
-            case RESPONSE_CURVE_2:
+            case responseCurves[2].value:
                 c1 = inverted ? xMid + width * 0.25 : xMid - width * 0.25;
                 c2 = yMid - height * 0.25;
                 labelX = inverted ? xMid + width * 0.2 : xMid - width * 0.2;
                 labelY = yMid - height * 0.17;
                 break;
-            case RESPONSE_CURVE_3:
+            case responseCurves[3].value:
                 c1 = inverted ? xMid + width * 0.35 : xMid - width * 0.35;
                 c2 = yMid - height * 0.35;
                 labelX = inverted ? xMid + width * 0.28 : xMid - width * 0.28;
                 labelY = yMid - height * 0.25;
                 break;
-            case RESPONSE_CURVE_4:
+            case responseCurves[4].value:
                 c1 = inverted ? xMid - width * 0.13 : xMid + width * 0.13;
                 c2 = yMid + height * 0.13;
                 labelX = inverted ? xMid - width * 0.1 : xMid + width * 0.1;
                 labelY = yMid + height * 0.1;
                 break;
-            case RESPONSE_CURVE_5:
+            case responseCurves[5].value:
                 c1 = inverted ? xMid - width * 0.25 : xMid + width * 0.25;
                 c2 = yMid + height * 0.25;
                 labelX = inverted ? xMid - width * 0.2 : xMid + width * 0.2;
                 labelY = yMid + height * 0.18;
                 break;
-            case RESPONSE_CURVE_6:
+            case responseCurves[6].value:
                 c1 = inverted ? xMid - width * 0.35 : xMid + width * 0.35;
                 c2 = yMid + height * 0.35;
                 labelX = inverted ? xMid - width * 0.28 : xMid + width * 0.28;
                 labelY = yMid + height * 0.25;
                 break;
-            case RESPONSE_CURVE_7:
+            case responseCurves[7].value:
                 x1 = inverted ? axisX1 : axisX2;
                 y1 = axisY1;
                 x2 = x1;
@@ -142,7 +101,7 @@ const ResponseCurve = (props) => {
             labelY,
         };
     });
-    return (_jsx("div", { className: "response-curve-picker", ref: ref, children: _jsxs("svg", { ...svgProps, children: [_jsx("rect", { className: "container", height: height, rx: 3, ry: 3, width: width, x: 0, y: 0 }), _jsx(SVGText, { className: "axis", textAnchor: "middle", transform: `translate(${axisX1 - 14} ${height / 2}) rotate(90)`, x: 0, y: 0, text: "Applied force" }), _jsx(SVGText, { className: "axis", textAnchor: "middle", transform: `translate(${width / 2} ${axisY2 + 13})`, x: 0, y: 0, text: "Output (velocity)" }), _jsx("line", { className: "axis", x1: axisX1, x2: axisX1, y1: axisY1, y2: axisY2 }), _jsx("line", { className: "axis", x1: axisX1, x2: axisX2, y1: axisY2, y2: axisY2 }), responseCurves.map(({ value, label, x1, y1, x2, y2, c1, c2, labelX, labelY }) => (_jsxs("g", { children: [_jsx("path", { className: value === responseCurve ? 'curve-selected' : 'curve', d: `M${x1} ${y1} C ${c1} ${c2}, ${c1} ${c2}, ${x2} ${y2}` }), _jsx(Tooltip, { placement: "left", title: label, children: _jsx("rect", { className: value === responseCurve ? 'button-selected' : 'button', height: buttonSize, onClick: disabled
+    return (_jsx("div", { className: "response-curve-picker", ref: ref, children: _jsxs("svg", { ...svgProps, children: [_jsx("rect", { className: "container", height: height, rx: 3, ry: 3, width: width, x: 0, y: 0 }), _jsx(SvgText, { className: "axis", textAnchor: "middle", transform: `translate(${axisX1 - 14} ${height / 2}) rotate(90)`, x: 0, y: 0, text: "Applied force" }), _jsx(SvgText, { className: "axis", textAnchor: "middle", transform: `translate(${width / 2} ${axisY2 + 13})`, x: 0, y: 0, text: "Output (velocity)" }), _jsx("line", { className: "axis", x1: axisX1, x2: axisX1, y1: axisY1, y2: axisY2 }), _jsx("line", { className: "axis", x1: axisX1, x2: axisX2, y1: axisY2, y2: axisY2 }), responseCurves.map(({ value, label, x1, y1, x2, y2, c1, c2, labelX, labelY }) => (_jsxs("g", { children: [_jsx("path", { className: value === responseCurve ? 'curve-selected' : 'curve', d: `M${x1} ${y1} C ${c1} ${c2}, ${c1} ${c2}, ${x2} ${y2}` }), _jsx(Tooltip, { placement: "left", title: label, children: _jsx("rect", { className: value === responseCurve ? 'button-selected' : 'button', height: buttonSize, onClick: disabled
                                     ? f => f
                                     : () => onChange({
                                         target: {
@@ -150,5 +109,4 @@ const ResponseCurve = (props) => {
                                         },
                                     }), transform: `translate(${labelX + 3} ${labelY - buttonSize / 1.05}) rotate(45)`, width: buttonSize }) }), _jsxs("text", { className: value === responseCurve ? 'button-selected' : 'button', transform: `translate(${labelX} ${labelY})`, children: [value, _jsx("title", { children: label })] })] }, value)))] }) }));
 };
-export default ResponseCurve;
-export { RESPONSE_CURVES };
+export { ResponseCurve };

package/dist/pickers/ResponseCurvePicker.js

@@ -1,12 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useCallback } from 'react';
-import DefaultTooltip from '../other/DefaultTooltip';
+import { responseCurves } from '../midi/export';
+import { DefaultTooltip } from '../other/DefaultTooltip';
 import { findObj } from '../utils';
-import ResponseCurve, { RESPONSE_CURVES } from './ResponseCurve';
-import Select from './Select';
+import { ResponseCurve } from './ResponseCurve';
+import { Select } from './Select';
 const ResponseCurvePicker = forwardRef((props, ref) => {
     const { Tooltip = DefaultTooltip, inverted = false, onChange, value, ...rest } = props;
-    const Placeholder = useCallback(() => (_jsx("div", { className: "singleValue", children: findObj('value', value)(RESPONSE_CURVES)?.label })), [value]);
+    const Placeholder = useCallback(() => (_jsx("div", { className: "singleValue", children: findObj('value', value)(responseCurves)?.label })), [value]);
     const MenuList = useCallback(({ setValue }) => (_jsx(ResponseCurve, { autosize: true, inverted: inverted, onChange: ({ target: { value: v } }) => {
             setValue(v);
             onChange(v);
@@ -16,4 +17,4 @@ const ResponseCurvePicker = forwardRef((props, ref) => {
             MenuList,
         }, isSearchable: false, onChange: f => f, ref: ref, value: value }));
 });
-export default ResponseCurvePicker;
+export { ResponseCurvePicker };

package/dist/pickers/Select.js

@@ -76,4 +76,4 @@ const Select = forwardRef((props, ref) => {
                 // biome-ignore lint/suspicious/noExplicitAny: <explanation>
                 ref: ref, styles: styles, value: selectedOption })] }));
 });
-export default Select;
+export { Select };

package/dist/pickers/StatusPicker.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
-import Select from './Select';
+import { Select } from './Select';
 const StatusPicker = forwardRef(({ statuses, ...rest }, ref) => (_jsx(Select, { ...rest, options: statuses, ref: ref })));
-export default StatusPicker;
+export { StatusPicker };

package/dist/pickers/ValuePicker.js

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useCallback, useMemo } from 'react';
 import useStateWithDynamicDefault from '../hooks/useStateWithDynamicDefault';
 import { arraySequence, assertRange } from '../utils';
-import Select from './Select';
+import { Select } from './Select';
 const ValuePicker = forwardRef((props, ref) => {
     const { disabled, highToLow, max = 127, min = 0, onChange, value: initialValue = 0, ...rest } = props;
     const options = useMemo(() => {
@@ -20,4 +20,4 @@ const ValuePicker = forwardRef((props, ref) => {
     }, [max, min, onChange, setValue]);
     return (_jsx(Select, { ...rest, disabled: disabled, onChange: handleChange, options: options, ref: ref, value: value }));
 });
-export default ValuePicker;
+export { ValuePicker };

package/dist/pickers/knobSkin10.js

@@ -90,4 +90,4 @@ const knobSkin10 = {
         },
     ],
 };
-export default knobSkin10;
+export { knobSkin10 };

package/dist/rotaryKnob/InternalInput.js

@@ -19,4 +19,4 @@ Object.defineProperty(InternalInput, "defaultProps", {
         step: 1,
     }
 });
-export default InternalInput;
+export { InternalInput };

package/dist/rotaryKnob/helpers/DrawCircle.js

@@ -6,4 +6,4 @@ class DrawCircle extends React.Component {
         return (_jsx("circle", { stroke: borderColor, fill: fillColor, fillOpacity: fillOpacity, r: r, ...rest }));
     }
 }
-export default DrawCircle;
+export { DrawCircle };

package/dist/rotaryKnob/helpers/DrawLine.js

@@ -6,4 +6,4 @@ class DrawLine extends React.Component {
         return (_jsx("line", { ...rest, stroke: color, strokeWidth: width, x1: p1.x, y1: p1.y, x2: p2.x, y2: p2.y }));
     }
 }
-export default DrawLine;
+export { DrawLine };

package/dist/rotaryKnob/helpers/HelpersOverlay.js

@@ -23,4 +23,4 @@ class HelpersOverlay extends React.Component {
         return ReactDOM.createPortal(_jsx("div", { style: styles.overlay, ...rest, children: children }), document.body);
     }
 }
-export default HelpersOverlay;
+export { HelpersOverlay };

package/dist/rotaryKnob/helpers/KnobVisualHelpers.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
-import utils from '../utils';
-import DrawCircle from './DrawCircle';
-import DrawLine from './DrawLine';
-import HelpersOverlay from './HelpersOverlay';
+import { DrawCircle } from './DrawCircle';
+import { DrawLine } from './DrawLine';
+import { HelpersOverlay } from './HelpersOverlay';
+import { toRadians } from '../utils';
 class KnobVisualHelpers extends React.Component {
     constructor() {
         super(...arguments);
@@ -27,8 +27,8 @@ class KnobVisualHelpers extends React.Component {
         const halfWidth = vbox.width / 2;
         //Calculate current angle segment end point
         //Note: Not sure why we need to subtract 90 here
-        const valueMarkerX = props.radius * Math.cos(utils.toRadians(props.valueAngle - 90));
-        const valueMarkerY = props.radius * Math.sin(utils.toRadians(props.valueAngle - 90));
+        const valueMarkerX = props.radius * Math.cos(toRadians(props.valueAngle - 90));
+        const valueMarkerY = props.radius * Math.sin(toRadians(props.valueAngle - 90));
         return {
             ...state,
             centerX: vbox.left + halfWidth,

package/dist/rotaryKnob/index.js

@@ -8,10 +8,10 @@ import { scaleLinear } from 'd3-scale';
 import { select } from 'd3-selection';
 import { useEffect, useRef, useState } from 'react';
 import { SvgLoader, SvgProxy } from 'react-svgmt';
-import InternalInput from './InternalInput';
+import { InternalInput } from './InternalInput';
 import { KnobVisualHelpers } from './helpers/KnobVisualHelpers';
 import defaultSkin from './knobdefaultskin';
-import utils from './utils';
+import { getAngleForPoint } from './utils';
 // function printDebugValues(obj) {
 //   console.log('------------')
 //   Object.keys(obj).forEach(key => {
@@ -145,7 +145,7 @@ const RotaryKnob = (props) => {
             elem.classed('dragging', true);
             onStart();
             startPos = { x: event.x - cx, y: event.y - cy };
-            startAngle = utils.getAngleForPoint(startPos.x, startPos.y);
+            startAngle = getAngleForPoint(startPos.x, startPos.y);
             initialAngle = convertValueToAngle(currentValue);
             monitoring = false;
             // ...existing setState code...
@@ -156,14 +156,14 @@ const RotaryKnob = (props) => {
             if (preciseMode) {
                 if (!monitoring && distanceFromCenter >= unlockDistance) {
                     startPos = currentPos;
-                    startAngle = utils.getAngleForPoint(currentPos.x, currentPos.y);
+                    startAngle = getAngleForPoint(currentPos.x, currentPos.y);
                     monitoring = true;
                 }
             }
             else {
                 monitoring = true;
             }
-            const currentAngle = utils.getAngleForPoint(currentPos.x, currentPos.y);
+            const currentAngle = getAngleForPoint(currentPos.x, currentPos.y);
             const deltaAngle = currentAngle - startAngle;
             let finalAngle = initialAngle + deltaAngle;
             finalAngle = normalizeAngle(finalAngle);
@@ -241,4 +241,4 @@ const RotaryKnob = (props) => {
         : null;
     return (_jsxs(_Fragment, { children: [_jsxs("div", { ref: container, style: styles.container, ...rest, children: [_jsx(InternalInput, { disabled: disabled, inputRef: inputRef, style: styles.input, value: currentValue, min: min, max: max, step: step, onChange: onFormControlChange }), _jsxs(SvgLoader, { height: "100%", svgXML: skin.svg, width: "100%", onSVGReady: saveRef, children: [_jsx(SvgProxy, { selector: "#knob", transform: `$ORIGINAL rotate(${angle}, ${skin.knobX}, ${skin.knobY})` }), skinElemUpdates] })] }), state.dragging && preciseMode && (_jsx(KnobVisualHelpers, { svgRef: state.svgRef, radius: state.dragDistance, mousePos: state.mousePos, minimumDragDistance: unlockDistance, valueAngle: state.valueAngle }))] }));
 };
-export default RotaryKnob;
+export { RotaryKnob };

package/dist/rotaryKnob/utils.js

@@ -96,11 +96,7 @@ function transformBoundingClientRectToDocument(box) {
     //info needed to draw line from center to mousepos
     return { top: ttop, left: tleft, width: box.width, height: box.height };
 }
-export default {
-    // toGlobalCoordinates,
-    // toLocalCoordinates,
-    toRadians,
-    getQuadrant,
-    getAngleForPoint,
-    transformBoundingClientRectToDocument,
-};
+export { 
+// toGlobalCoordinates,
+// toLocalCoordinates,
+toRadians, getQuadrant, getAngleForPoint, transformBoundingClientRectToDocument, };