zds-pickers 4.0.12 → 4.0.14

package/dist/types/index.d.ts

@@ -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';
@@ -21,7 +21,7 @@ export type * from './midi/export';
 export type * from './other/DefaultTooltip';
 export type * from './other/OctavePlayer';
 export type * from './other/SoundFontProvider';
-export type * from './other/SVGText';
+export type * from './other/SvgText';
 export type * from './pickers/CCPicker';
 export type * from './pickers/ChannelMappingPicker';
 export type * from './pickers/ChannelPicker';

package/dist/types/midi/ccValues.d.ts

@@ -1,3 +1,3 @@
 import type { Option } from '../pickers/Select';
-declare const CC_NAMES: Option<number>[];
-export default CC_NAMES;
+declare const changeControllerOptions: Option<number>[];
+export { changeControllerOptions };

package/dist/types/midi/export.d.ts

@@ -18,4 +18,15 @@ declare const extractStatusAndChannel: (status: number) => {
     status: Status;
     channel: number;
 };
-export { combineStatusWithChannel, extractStatusAndChannel, getStatusLabel, MASK_CHANNEL, MASK_STATUS, statusOptions, Statuses, type Status, };
+declare const RESPONSE_CURVE_0 = 0;
+declare const RESPONSE_CURVE_1 = 1;
+declare const RESPONSE_CURVE_2 = 2;
+declare const RESPONSE_CURVE_3 = 3;
+declare const RESPONSE_CURVE_4 = 4;
+declare const RESPONSE_CURVE_5 = 5;
+declare const RESPONSE_CURVE_6 = 6;
+declare const RESPONSE_CURVE_7 = 7;
+type Curve = typeof RESPONSE_CURVE_0 | typeof RESPONSE_CURVE_1 | typeof RESPONSE_CURVE_2 | typeof RESPONSE_CURVE_3 | typeof RESPONSE_CURVE_4 | typeof RESPONSE_CURVE_5 | typeof RESPONSE_CURVE_6 | typeof RESPONSE_CURVE_7;
+declare const responseCurves: Option<Curve>[];
+export { combineStatusWithChannel, extractStatusAndChannel, getStatusLabel, MASK_CHANNEL, MASK_STATUS, responseCurves, Statuses, statusOptions, };
+export type { Curve, Status };

package/dist/types/other/DefaultTooltip.d.ts

@@ -6,5 +6,5 @@ type TooltipProps = {
 declare const DefaultTooltip: ({ children }: React.PropsWithoutRef<TooltipProps>) => import("react").FunctionComponentElement<{
     children?: import("react").ReactNode | undefined;
 }>;
-export default DefaultTooltip;
+export { DefaultTooltip };
 export type { TooltipProps };

package/dist/types/other/OctavePlayer.d.ts

@@ -22,5 +22,5 @@ type WithProviderProps = {
     width: number;
 };
 declare const WithProvider: ({ format, height, hostname, instrumentName, octave, onChange, onClick, onDoubleClick, onKeyMouseEnter, onKeyMouseLeave, soundfont, Tooltip, width, }: WithProviderProps) => import("react/jsx-runtime").JSX.Element;
-export default WithProvider;
+export { WithProvider as OctavePlayer };
 export type { OctavePlayerProps, WithProviderProps };

package/dist/types/other/SoundFontProvider.d.ts

@@ -14,5 +14,5 @@ type SoundfontProviderProps = {
     soundfont?: 'MusyngKite' | 'FluidR3_GM';
 };
 declare const SoundfontProvider: (props: SoundfontProviderProps) => import("react").ReactNode;
-export default SoundfontProvider;
+export { SoundfontProvider };
 export type { SoundfontProviderProps };

package/dist/types/other/{SVGText.d.ts → SvgText.d.ts}

@@ -22,7 +22,6 @@ type TextProps = Partial<HTMLOrSVGElement> & {
     x?: number;
     y?: number;
 };
-declare const Text: (props: TextProps) => import("react/jsx-runtime").JSX.Element;
-export default Text;
-export { MEASUREMENT_ELEMENT_ID };
+declare const SvgText: (props: TextProps) => import("react/jsx-runtime").JSX.Element;
+export { SvgText, MEASUREMENT_ELEMENT_ID };
 export type { TextProps, WordWidths, WordsByLine };

package/dist/types/pickers/CCPicker.d.ts

@@ -3,5 +3,5 @@ import type { Option, SelectProps } from './Select';
 type CCPickerProps = SelectProps<number>;
 type CCPickerRef = SelectInstance<Option<number>, false, GroupBase<Option<number>>>;
 declare const CCPicker: import("react").ForwardRefExoticComponent<CCPickerProps & import("react").RefAttributes<SelectInstance<Option<number>, false, GroupBase<Option<number>>>>>;
-export default CCPicker;
+export { CCPicker };
 export type { CCPickerProps, CCPickerRef };

package/dist/types/pickers/ChannelMappingPicker.d.ts

@@ -11,5 +11,5 @@ interface ChannelMappingPickerProps extends SelectProps<InternalValue> {
 }
 type ChannelMappingPickerRef = SelectInstance<Option<number>, false, GroupBase<Option<number>>>;
 declare const ChannelMappingPicker: import("react").ForwardRefExoticComponent<ChannelMappingPickerProps & import("react").RefAttributes<SelectInstance<Option<InternalValue>, false, GroupBase<Option<InternalValue>>>>>;
-export default ChannelMappingPicker;
+export { ChannelMappingPicker };
 export type { ChannelMappingOption, ChannelMappingPickerProps, ChannelMappingPickerRef, };

package/dist/types/pickers/ChannelPicker.d.ts

@@ -4,5 +4,5 @@ type Channel = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 |
 type ChannelPickerProps = SelectProps<Channel>;
 type ChannelPickerRef = SelectInstance<Option<Channel>, false, GroupBase<Option<Channel>>>;
 declare const ChannelPicker: import("react").ForwardRefExoticComponent<ChannelPickerProps & import("react").RefAttributes<SelectInstance<Option<Channel>, false, GroupBase<Option<Channel>>>>>;
-export default ChannelPicker;
+export { ChannelPicker };
 export type { Channel, ChannelPickerProps, ChannelPickerRef };

package/dist/types/pickers/Knob.d.ts

@@ -8,5 +8,5 @@ type KnobProps = {
     wheelSensitivity?: number;
 };
 declare const Knob: (props: KnobProps) => import("react/jsx-runtime").JSX.Element;
-export default Knob;
+export { Knob };
 export type { KnobProps };

package/dist/types/pickers/KnobPicker.d.ts

@@ -23,5 +23,5 @@ declare const KnobPicker: import("react").ForwardRefExoticComponent<SelectProps<
     wheelSensitivity?: number;
     value: number;
 } & import("react").RefAttributes<SelectInstance<Option<number>, false, GroupBase<Option<number>>>>>;
-export default KnobPicker;
+export { KnobPicker };
 export type { KnobPickerProps, KnobPickerRef };

package/dist/types/pickers/LatchPicker.d.ts

@@ -4,5 +4,5 @@ import type { Option, SelectProps } from './Select';
 type LatchPickerProps = SelectProps<Polarity>;
 type LatchPickerRef = SelectInstance<Option<Polarity>, false, GroupBase<Option<Polarity>>>;
 declare const LatchPicker: import("react").ForwardRefExoticComponent<LatchPickerProps & import("react").RefAttributes<SelectInstance<Option<Polarity>, false, GroupBase<Option<Polarity>>>>>;
-export default LatchPicker;
+export { LatchPicker };
 export type { LatchPickerProps, LatchPickerRef };

package/dist/types/pickers/MappingPicker.d.ts

@@ -7,5 +7,5 @@ type MappingPickerRef = SelectInstance<Option<string>, false, GroupBase<Option<s
 declare const MappingPicker: import("react").ForwardRefExoticComponent<SelectProps<string> & {
     allowClearing: boolean;
 } & import("react").RefAttributes<SelectInstance<Option<string>, false, GroupBase<Option<string>>>>>;
-export default MappingPicker;
+export { MappingPicker };
 export type { MappingPickerProps, MappingPickerRef };

package/dist/types/pickers/NotePicker.d.ts

@@ -16,5 +16,5 @@ declare const NotePicker: import("react").ForwardRefExoticComponent<SelectProps<
     mapping?: Mapping;
     onChange: (value: number) => void;
 } & import("react").RefAttributes<SelectInstance<Option<number>, false, GroupBase<Option<number>>>>>;
-export default NotePicker;
+export { NotePicker };
 export type { NotePickerProps, NotePickerRef };

package/dist/types/pickers/PianoPicker.d.ts

@@ -5,5 +5,5 @@ type PianoProps = {
     width: number;
 };
 declare const WithProvider: ({ format, height, hostname, instrumentName, onChange, onClick, onDoubleClick, onKeyMouseEnter, onKeyMouseLeave, soundfont, width, }: WithProviderProps) => import("react/jsx-runtime").JSX.Element;
-export default WithProvider;
+export { WithProvider as PianoPicker };
 export type { PianoProps };

package/dist/types/pickers/PolarityPicker.d.ts

@@ -10,5 +10,5 @@ declare const PolarityPicker: import("react").ForwardRefExoticComponent<SelectPr
     labelOff?: string;
     labelOn?: string;
 } & import("react").RefAttributes<SelectInstance<Option<Polarity>, false, GroupBase<Option<Polarity>>>>>;
-export default PolarityPicker;
+export { PolarityPicker };
 export type { Polarity, PolarityPickerProps, PolarityPickerRef };

package/dist/types/pickers/ResponseCurve.d.ts

@@ -1,15 +1,6 @@
+import { type Curve } from '../midi/export';
 import { type TooltipProps } from '../other/DefaultTooltip';
-import type { Option } from './Select';
-declare const RESPONSE_CURVE_0 = 0;
-declare const RESPONSE_CURVE_1 = 1;
-declare const RESPONSE_CURVE_2 = 2;
-declare const RESPONSE_CURVE_3 = 3;
-declare const RESPONSE_CURVE_4 = 4;
-declare const RESPONSE_CURVE_5 = 5;
-declare const RESPONSE_CURVE_6 = 6;
-declare const RESPONSE_CURVE_7 = 7;
-type Curve = typeof RESPONSE_CURVE_0 | typeof RESPONSE_CURVE_1 | typeof RESPONSE_CURVE_2 | typeof RESPONSE_CURVE_3 | typeof RESPONSE_CURVE_4 | typeof RESPONSE_CURVE_5 | typeof RESPONSE_CURVE_6 | typeof RESPONSE_CURVE_7;
-type ResponseCurve = {
+type ResponseCurveType = {
     value: Curve;
     label: React.ReactNode;
     c1: number;
@@ -21,7 +12,6 @@ type ResponseCurve = {
     labelX: number;
     labelY: number;
 };
-declare const RESPONSE_CURVES: Option<Curve>[];
 type ResponseCurveProps = {
     autosize: boolean;
     disabled?: boolean;
@@ -35,6 +25,5 @@ type ResponseCurveProps = {
     value: Curve;
 };
 declare const ResponseCurve: (props: ResponseCurveProps) => import("react/jsx-runtime").JSX.Element;
-export default ResponseCurve;
-export { RESPONSE_CURVES };
-export type { Curve, ResponseCurve, ResponseCurveProps };
+export { ResponseCurve };
+export type { ResponseCurveType, ResponseCurveProps };

package/dist/types/pickers/ResponseCurvePicker.d.ts

@@ -1,6 +1,6 @@
 import type { GroupBase, SelectInstance } from 'react-select';
+import { type Curve } from '../midi/export';
 import { type TooltipProps } from '../other/DefaultTooltip';
-import { type Curve } from './ResponseCurve';
 import type { Option, SelectProps } from './Select';
 type ResponseCurvePickerProps = SelectProps<Curve> & {
     inverted?: boolean;
@@ -11,5 +11,5 @@ declare const ResponseCurvePicker: import("react").ForwardRefExoticComponent<Sel
     inverted?: boolean;
     Tooltip?: React.FC<TooltipProps>;
 } & import("react").RefAttributes<SelectInstance<Option<Curve>, false, GroupBase<Option<Curve>>>>>;
-export default ResponseCurvePicker;
+export { ResponseCurvePicker };
 export type { ResponseCurvePickerProps, ResponseCurvePickerRef };

package/dist/types/pickers/Select.d.ts

@@ -25,5 +25,5 @@ type SelectProps<T> = {
 declare const Select: <T>(props: SelectProps<T> & {
     ref?: React.ForwardedRef<SelectInstance<Option<T>, false, GroupBase<Option<T>>>>;
 }) => JSX.Element;
-export default Select;
+export { Select };
 export type { Option, SelectProps };

package/dist/types/pickers/StatusPicker.d.ts

@@ -8,5 +8,5 @@ type StatusPickerRef = SelectInstance<Option<Status>, false, GroupBase<Option<St
 declare const StatusPicker: import("react").ForwardRefExoticComponent<SelectProps<Status> & {
     statuses: Option<Status>[];
 } & import("react").RefAttributes<SelectInstance<Option<Status>, false, GroupBase<Option<Status>>>>>;
-export default StatusPicker;
+export { StatusPicker };
 export type { StatusPickerProps, StatusPickerRef };

package/dist/types/pickers/ValuePicker.d.ts

@@ -11,5 +11,5 @@ declare const ValuePicker: import("react").ForwardRefExoticComponent<SelectProps
     max?: number;
     min?: number;
 } & import("react").RefAttributes<SelectInstance<Option<number>, false, GroupBase<Option<number>>>>>;
-export default ValuePicker;
+export { ValuePicker };
 export type { ValuePickerProps, ValuePickerRef };

package/dist/types/pickers/knobSkin10.d.ts

@@ -11,4 +11,4 @@ declare const knobSkin10: {
         }[];
     }[];
 };
-export default knobSkin10;
+export { knobSkin10 };

package/dist/types/rotaryKnob/InternalInput.d.ts

@@ -15,4 +15,4 @@ declare class InternalInput extends React.Component<InternalInputProps> {
     };
     render(): import("react/jsx-runtime").JSX.Element;
 }
-export default InternalInput;
+export { InternalInput };

package/dist/types/rotaryKnob/helpers/DrawCircle.d.ts

@@ -15,4 +15,4 @@ type DrawCircleProps = React.SVGProps<SVGCircleElement> & {
 declare class DrawCircle extends React.Component<DrawCircleProps> {
     render(): import("react/jsx-runtime").JSX.Element;
 }
-export default DrawCircle;
+export { DrawCircle };

package/dist/types/rotaryKnob/helpers/DrawLine.d.ts

@@ -12,4 +12,4 @@ type DrawLineProps = React.SVGProps<SVGLineElement> & {
 declare class DrawLine extends React.Component<DrawLineProps> {
     render(): import("react/jsx-runtime").JSX.Element;
 }
-export default DrawLine;
+export { DrawLine };

package/dist/types/rotaryKnob/helpers/HelpersOverlay.d.ts

@@ -8,4 +8,4 @@ type HelpersOverlayProps = React.PropsWithChildren & {
 declare class HelpersOverlay extends React.Component<HelpersOverlayProps> {
     render(): React.ReactPortal;
 }
-export default HelpersOverlay;
+export { HelpersOverlay };

package/dist/types/rotaryKnob/index.d.ts

@@ -46,4 +46,4 @@ type KnobProps = Omit<React.ComponentProps<'div'>, 'onChange'> & {
  * Generic knob component
  */
 declare const RotaryKnob: (props: KnobProps) => import("react/jsx-runtime").JSX.Element;
-export default RotaryKnob;
+export { RotaryKnob };

package/dist/types/rotaryKnob/utils.d.ts

@@ -40,10 +40,4 @@ declare function transformBoundingClientRectToDocument(box: DOMRect): {
     width: number;
     height: number;
 };
-declare const _default: {
-    toRadians: typeof toRadians;
-    getQuadrant: typeof getQuadrant;
-    getAngleForPoint: typeof getAngleForPoint;
-    transformBoundingClientRectToDocument: typeof transformBoundingClientRectToDocument;
-};
-export default _default;
+export { toRadians, getQuadrant, getAngleForPoint, transformBoundingClientRectToDocument, };

package/lib/index.ts

@@ -3,7 +3,7 @@ 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'
@@ -26,7 +26,7 @@ export type * from './midi/export'
 export type * from './other/DefaultTooltip'
 export type * from './other/OctavePlayer'
 export type * from './other/SoundFontProvider'
-export type * from './other/SVGText'
+export type * from './other/SvgText'
 
 export type * from './pickers/CCPicker'
 export type * from './pickers/ChannelMappingPicker'

package/lib/midi/ccValues.ts

@@ -1,6 +1,6 @@
 import type { Option } from '../pickers/Select'
 
-const CC_NAMES = [
+const changeControllerOptions = [
   'Bank Select',
   'Modulation Wheel',
   'Breath Controller',
@@ -136,4 +136,4 @@ const CC_NAMES = [
   }),
 )
 
-export default CC_NAMES
+export { changeControllerOptions }

package/lib/midi/export.ts

@@ -41,13 +41,69 @@ const extractStatusAndChannel = (
   channel: status & MASK_CHANNEL,
 })
 
+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
+
+type Curve =
+  | typeof RESPONSE_CURVE_0
+  | typeof RESPONSE_CURVE_1
+  | typeof RESPONSE_CURVE_2
+  | typeof RESPONSE_CURVE_3
+  | typeof RESPONSE_CURVE_4
+  | typeof RESPONSE_CURVE_5
+  | typeof RESPONSE_CURVE_6
+  | typeof RESPONSE_CURVE_7
+
+const responseCurves: Option<Curve>[] = [
+  {
+    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,
-  statusOptions,
+  responseCurves,
   Statuses,
-  type Status,
+  statusOptions,
 }
+
+export type { Curve, Status }

package/lib/other/DefaultTooltip.ts

@@ -9,6 +9,6 @@ type TooltipProps = {
 const DefaultTooltip = ({ children }: React.PropsWithoutRef<TooltipProps>) =>
   createElement(Fragment, null, children)
 
-export default DefaultTooltip
+export { DefaultTooltip }
 
 export type { TooltipProps }

package/lib/other/OctavePlayer.tsx

@@ -2,7 +2,7 @@ import type Soundfont from 'soundfont-player'
 import { /* Midi, */ Note } from 'tonal'
 import { Piano as ReactPiano } from 'zds-react-piano'
 import type { TooltipProps } from './DefaultTooltip'
-import SoundfontProvider from './SoundFontProvider'
+import { SoundfontProvider } from './SoundFontProvider'
 
 const baseNotes = [
   'C',
@@ -38,7 +38,7 @@ type OctavePlayerProps = {
   width: number
 }
 
-const OctavePlayer = ({
+const BaseOctavePlayer = ({
   octave,
   height,
   width,
@@ -116,7 +116,7 @@ const WithProvider = ({
         <div>
           <h2>Octave: {octave}</h2>
         </div>
-        <OctavePlayer
+        <BaseOctavePlayer
           disabled={isLoading}
           {...{
             height,
@@ -136,6 +136,6 @@ const WithProvider = ({
   />
 )
 
-export default WithProvider
+export { WithProvider as OctavePlayer }
 
 export type { OctavePlayerProps, WithProviderProps }

package/lib/other/SoundFontProvider.tsx

@@ -127,6 +127,6 @@ const SoundfontProvider = (props: SoundfontProviderProps) => {
 // 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 }
 
 export type { SoundfontProviderProps }

package/lib/other/{SVGText.tsx → SvgText.tsx}

@@ -91,7 +91,7 @@ type TextProps = Partial<HTMLOrSVGElement> & {
   y?: number
 }
 
-const Text = (props: TextProps) => {
+const SvgText = (props: TextProps) => {
   const {
     className = '',
     dx = 0,
@@ -216,8 +216,6 @@ const Text = (props: TextProps) => {
   )
 }
 
-export default Text
-
-export { MEASUREMENT_ELEMENT_ID }
+export { SvgText, MEASUREMENT_ELEMENT_ID }
 
 export type { TextProps, WordWidths, WordsByLine }

package/lib/pickers/CCPicker.tsx

@@ -1,7 +1,7 @@
 import { forwardRef } from 'react'
 import type { GroupBase, SelectInstance } from 'react-select'
-import ccValues from '../midi/ccValues'
-import Select from './Select'
+import { changeControllerOptions } from '../midi/ccValues'
+import { Select } from './Select'
 import type { Option, SelectProps } from './Select'
 
 type CCPickerProps = SelectProps<number>
@@ -18,11 +18,11 @@ const CCPicker = forwardRef<
 >((props, ref) => (
   <Select
     {...props}
-    options={ccValues}
+    options={changeControllerOptions}
     ref={ref}
   />
 ))
 
-export default CCPicker
+export { CCPicker }
 
 export type { CCPickerProps, CCPickerRef }

package/lib/pickers/ChannelMappingPicker.tsx

@@ -2,7 +2,7 @@ import cl from 'classnames'
 import { forwardRef, useCallback, useEffect, useState } from 'react'
 import type { GroupBase, SelectInstance } from 'react-select'
 import { arraySequence } from '../utils'
-import Select from './Select'
+import { Select } from './Select'
 import type { Option, SelectProps } from './Select'
 
 type InternalValue = number | 'separator'
@@ -130,7 +130,7 @@ const ChannelMappingPicker = forwardRef<
   )
 })
 
-export default ChannelMappingPicker
+export { ChannelMappingPicker }
 
 export type {
   ChannelMappingOption,

package/lib/pickers/ChannelPicker.tsx

@@ -2,7 +2,7 @@ import cl from 'classnames'
 import { forwardRef } from 'react'
 import type { GroupBase, SelectInstance } from 'react-select'
 import { arraySequence } from '../utils'
-import Select from './Select'
+import { Select } from './Select'
 import type { Option, SelectProps } from './Select'
 
 type Channel =
@@ -71,6 +71,6 @@ const ChannelPicker = forwardRef<
   )
 })
 
-export default ChannelPicker
+export { ChannelPicker }
 
 export type { Channel, ChannelPickerProps, ChannelPickerRef }

package/lib/pickers/Knob.tsx

@@ -1,8 +1,8 @@
 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'
 
 type KnobProps = {
   disabled?: boolean
@@ -88,6 +88,6 @@ const Knob = (props: KnobProps) => {
   )
 }
 
-export default Knob
+export { Knob }
 
 export type { KnobProps }

package/lib/pickers/KnobPicker.tsx

@@ -1,8 +1,8 @@
 import { forwardRef, useMemo } from 'react'
 import type { GroupBase, SelectInstance } from 'react-select'
 import { arraySequence } from '../utils'
-import Knob from './Knob'
-import Select from './Select'
+import { Knob } from './Knob'
+import { Select } from './Select'
 import type { Option, SelectProps } from './Select'
 
 type KnobPickerProps = SelectProps<number> & {
@@ -88,6 +88,6 @@ const KnobPicker = forwardRef<
   )
 })
 
-export default KnobPicker
+export { KnobPicker }
 
 export type { KnobPickerProps, KnobPickerRef }

package/lib/pickers/LatchPicker.tsx

@@ -1,7 +1,7 @@
 import { forwardRef } from 'react'
 import type { GroupBase, SelectInstance } from 'react-select'
 import type { Polarity } from './PolarityPicker'
-import Select from './Select'
+import { Select } from './Select'
 import type { Option, SelectProps } from './Select'
 
 const options: Option<Polarity>[] = [
@@ -28,6 +28,6 @@ const LatchPicker = forwardRef<
   />
 ))
 
-export default LatchPicker
+export { LatchPicker }
 
 export type { LatchPickerProps, LatchPickerRef }

package/lib/pickers/MappingPicker.tsx

@@ -1,7 +1,7 @@
 import { forwardRef, useMemo } from 'react'
 import type { GroupBase, SelectInstance } from 'react-select'
 import { getStockNames, getUserMappingNames } from 'zds-mappings'
-import Select from './Select'
+import { Select } from './Select'
 import type { Option, SelectProps } from './Select'
 
 type MappingPickerProps = SelectProps<string> & {
@@ -63,6 +63,6 @@ const MappingPicker = forwardRef<
   )
 })
 
-export default MappingPicker
+export { MappingPicker }
 
 export type { MappingPickerProps, MappingPickerRef }

package/lib/pickers/NotePicker.tsx

@@ -4,7 +4,7 @@ import { Midi } from 'tonal'
 import { type MapItem, type Mapping, emptyMapping } from 'zds-mappings'
 import useStateWithDynamicDefault from '../hooks/useStateWithDynamicDefault'
 import { assertRange } from '../utils'
-import Select from './Select'
+import { Select } from './Select'
 import type { Option, SelectProps } from './Select'
 
 const { midiToNoteName } = Midi
@@ -90,6 +90,6 @@ const NotePicker = forwardRef<
   )
 })
 
-export default NotePicker
+export { NotePicker }
 
 export type { NotePickerProps, NotePickerRef }