How to use

blue

function

in

Array

const DomGridPad = ({children, pad, active = false, padPressed, padReleased, rgb = Colours.blue}) => (
 <div
  onMouseDown={() => padPressed && padPressed(100)}
  onMouseUp={() => padReleased && padReleased()}
  style={{
   ...padStyleBase,
   ...(active ? padStyleActive(rgb) : {})
  }}
 >
  {children}
 </div>
)

const displayRgb = (fadeEffect, { isCurrentStep, isDisplayedInEditWindow, isSelected, hasNote, velocity, recording }) => {
 if (isDisplayedInEditWindow) return Colours.yellow
 if (isSelected) return Colours.orange
 if (isCurrentStep) return hasNote ? Colours.turquoise : (recording ? Colours.red : Colours.green)
 return hasNote ? fadeEffect(Colours.blue, velocity) : Colours.off
}

const PatternSelect = props => {
 const {pad, patternId, selectPattern, selected} = props
 const rgb = selected ? Colours.orange : (patternId ? Colours.blue : Colours.off)
 return (
  <DomGridPad
   padPressed={selectPattern}
   active={true}
   rgb={rgb}
  >
   <PushGridPad
    pad={pad}
    padPressed={selectPattern}
    rgb={rgb}
   />
  </DomGridPad>
 )
}