zds-pickers 4.0.13 → 4.0.14

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

@@ -1,6 +1,6 @@
 import { type Curve } from '../midi/export';
 import { type TooltipProps } from '../other/DefaultTooltip';
-type ResponseCurve = {
+type ResponseCurveType = {
     value: Curve;
     label: React.ReactNode;
     c1: number;
@@ -25,5 +25,5 @@ type ResponseCurveProps = {
     value: Curve;
 };
 declare const ResponseCurve: (props: ResponseCurveProps) => import("react/jsx-runtime").JSX.Element;
-export default ResponseCurve;
-export type { ResponseCurve, ResponseCurveProps };
+export { ResponseCurve };
+export type { ResponseCurveType, ResponseCurveProps };

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

@@ -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/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 }

package/lib/pickers/PianoPicker.tsx

@@ -1,6 +1,6 @@
 import { Piano as ReactPiano } from 'zds-react-piano'
 import type { WithProviderProps } from '../other/OctavePlayer'
-import SoundfontProvider from '../other/SoundFontProvider'
+import { SoundfontProvider } from '../other/SoundFontProvider'
 
 const firstNote = 21
 const lastNote = 108
@@ -16,7 +16,7 @@ type PianoProps = {
   width: number
 }
 
-const PianoPicker = ({ height, width, ...rest }: PianoProps) => {
+const BasePianoPicker = ({ height, width, ...rest }: PianoProps) => {
   const keyWidth = width / whiteNotes + 2
   const keyWidthToHeight = keyWidth / height
 
@@ -55,7 +55,7 @@ const WithProvider = ({
       soundfont,
     }}
     render={({ isLoading, playNote, stopNote }) => (
-      <PianoPicker
+      <BasePianoPicker
         disabled={isLoading}
         {...{
           height,
@@ -72,6 +72,6 @@ const WithProvider = ({
   />
 )
 
-export default WithProvider
+export { WithProvider as PianoPicker }
 
 export type { PianoProps }

package/lib/pickers/PolarityPicker.tsx

@@ -1,6 +1,6 @@
 import { forwardRef } from 'react'
 import type { GroupBase, SelectInstance } from 'react-select'
-import Select from './Select'
+import { Select } from './Select'
 import type { Option, SelectProps } from './Select'
 
 type Polarity = 0 | 1
@@ -34,6 +34,6 @@ const PolarityPicker = forwardRef<
   )
 })
 
-export default PolarityPicker
+export { PolarityPicker }
 
 export type { Polarity, PolarityPickerProps, PolarityPickerRef }

package/lib/pickers/ResponseCurve.tsx

@@ -4,10 +4,10 @@ import {
   type Curve,
   responseCurves as origResponseCurves,
 } from '../midi/export'
-import DefaultTooltip, { type TooltipProps } from '../other/DefaultTooltip'
-import SVGText from '../other/SVGText'
+import { DefaultTooltip, type TooltipProps } from '../other/DefaultTooltip'
+import { SvgText } from '../other/SvgText'
 
-type ResponseCurve = {
+type ResponseCurveType = {
   value: Curve
   label: React.ReactNode
   c1: number
@@ -64,7 +64,7 @@ const ResponseCurve = (props: ResponseCurveProps) => {
 
   const responseCurves = origResponseCurves.map(
     // biome-ignore lint/complexity/noExcessiveCognitiveComplexity: <explanation>
-    ({ value, label }): ResponseCurve => {
+    ({ value, label }): ResponseCurveType => {
       let c1 = 0
       let c2 = 0
       let x1 = axisX1
@@ -166,7 +166,7 @@ const ResponseCurve = (props: ResponseCurveProps) => {
           y={0}
         />
 
-        <SVGText
+        <SvgText
           className="axis"
           textAnchor="middle"
           transform={`translate(${axisX1 - 14} ${height / 2}) rotate(90)`}
@@ -175,7 +175,7 @@ const ResponseCurve = (props: ResponseCurveProps) => {
           text="Applied force"
         />
 
-        <SVGText
+        <SvgText
           className="axis"
           textAnchor="middle"
           transform={`translate(${width / 2} ${axisY2 + 13})`}
@@ -246,6 +246,6 @@ const ResponseCurve = (props: ResponseCurveProps) => {
   )
 }
 
-export default ResponseCurve
+export { ResponseCurve }
 
-export type { ResponseCurve, ResponseCurveProps }
+export type { ResponseCurveType, ResponseCurveProps }

package/lib/pickers/ResponseCurvePicker.tsx

@@ -1,10 +1,10 @@
 import { forwardRef, useCallback } from 'react'
 import type { GroupBase, SelectInstance } from 'react-select'
 import { type Curve, responseCurves } from '../midi/export'
-import DefaultTooltip, { type TooltipProps } from '../other/DefaultTooltip'
+import { DefaultTooltip, type TooltipProps } from '../other/DefaultTooltip'
 import { findObj } from '../utils'
-import ResponseCurve from './ResponseCurve'
-import Select from './Select'
+import { ResponseCurve } from './ResponseCurve'
+import { Select } from './Select'
 import type { Option, SelectProps } from './Select'
 
 type ResponseCurvePickerProps = SelectProps<Curve> & {
@@ -70,6 +70,6 @@ const ResponseCurvePicker = forwardRef<
   )
 })
 
-export default ResponseCurvePicker
+export { ResponseCurvePicker }
 
 export type { ResponseCurvePickerProps, ResponseCurvePickerRef }

package/lib/pickers/Select.tsx

@@ -243,6 +243,6 @@ const Select = forwardRef(
   },
 ) => JSX.Element
 
-export default Select
+export { Select }
 
 export type { Option, SelectProps }

package/lib/pickers/StatusPicker.tsx

@@ -1,7 +1,7 @@
 import type { Status } from 'lib/midi/export'
 import { forwardRef } from 'react'
 import type { GroupBase, SelectInstance } from 'react-select'
-import Select from './Select'
+import { Select } from './Select'
 import type { Option, SelectProps } from './Select'
 
 type StatusPickerProps = SelectProps<Status> & { statuses: Option<Status>[] }
@@ -23,6 +23,6 @@ const StatusPicker = forwardRef<
   />
 ))
 
-export default StatusPicker
+export { StatusPicker }
 
 export type { StatusPickerProps, StatusPickerRef }

package/lib/pickers/ValuePicker.tsx

@@ -2,7 +2,7 @@ import { forwardRef, useCallback, useMemo } from 'react'
 import type { GroupBase, SelectInstance } from 'react-select'
 import useStateWithDynamicDefault from '../hooks/useStateWithDynamicDefault'
 import { arraySequence, assertRange } from '../utils'
-import Select from './Select'
+import { Select } from './Select'
 import type { Option, SelectProps } from './Select'
 
 type ValuePickerProps = SelectProps<number> & {
@@ -62,6 +62,6 @@ const ValuePicker = forwardRef<
   )
 })
 
-export default ValuePicker
+export { ValuePicker }
 
 export type { ValuePickerProps, ValuePickerRef }

package/lib/pickers/knobSkin10.tsx

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

package/lib/rotaryKnob/InternalInput.tsx

@@ -40,4 +40,4 @@ class InternalInput extends React.Component<InternalInputProps> {
   }
 }
 
-export default InternalInput
+export { InternalInput }

package/lib/rotaryKnob/helpers/DrawCircle.tsx

@@ -38,4 +38,4 @@ class DrawCircle extends React.Component<DrawCircleProps> {
   }
 }
 
-export default DrawCircle
+export { DrawCircle }

package/lib/rotaryKnob/helpers/DrawLine.tsx

@@ -29,4 +29,4 @@ class DrawLine extends React.Component<DrawLineProps> {
   }
 }
 
-export default DrawLine
+export { DrawLine }

package/lib/rotaryKnob/helpers/HelpersOverlay.tsx

@@ -40,4 +40,4 @@ class HelpersOverlay extends React.Component<HelpersOverlayProps> {
   }
 }
 
-export default HelpersOverlay
+export { HelpersOverlay }

package/lib/rotaryKnob/helpers/KnobVisualHelpers.tsx

@@ -1,9 +1,9 @@
 import React from 'react'
 import type { Point } from '../Types'
-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'
 
 /** Precision visual helpers */
 
@@ -49,9 +49,8 @@ class KnobVisualHelpers extends React.Component<
     //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))
+      props.radius * Math.cos(toRadians(props.valueAngle - 90))
+    const valueMarkerY = props.radius * Math.sin(toRadians(props.valueAngle - 90))
 
     return {
       ...state,

package/lib/rotaryKnob/index.tsx

@@ -9,11 +9,11 @@ import { select } from 'd3-selection'
 import type { BaseType, Selection } from 'd3-selection'
 import { useEffect, useRef, useState } from 'react'
 import { SvgLoader, SvgProxy } from 'react-svgmt'
-import InternalInput from './InternalInput'
+import { InternalInput } from './InternalInput'
 import type { Point } from './Types'
 import { KnobVisualHelpers } from './helpers/KnobVisualHelpers'
 import defaultSkin from './knobdefaultskin'
-import utils from './utils'
+import { getAngleForPoint } from './utils'
 
 /**
  * type definition for the skin system attribute modification element
@@ -247,7 +247,7 @@ const RotaryKnob = (props: KnobProps) => {
       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
 
@@ -263,14 +263,14 @@ const RotaryKnob = (props: KnobProps) => {
       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)
@@ -414,4 +414,4 @@ const RotaryKnob = (props: KnobProps) => {
   )
 }
 
-export default RotaryKnob
+export { RotaryKnob }

package/lib/rotaryKnob/utils.ts

@@ -102,7 +102,7 @@ function transformBoundingClientRectToDocument(box: DOMRect) {
   return { top: ttop, left: tleft, width: box.width, height: box.height }
 }
 
-export default {
+export {
   // toGlobalCoordinates,
   // toLocalCoordinates,
   toRadians,