Function MiniCard

MiniAudio component displays an audio player with an optional waveform animation and draggable functionality.

This component provides a customizable audio display card that includes an animated waveform (optional) and a background image. The card can be dragged around the screen.

Component

Example

import React from 'react';
import { MiniAudio } from 'mediasfu-reactjs';

function App() {
  return (
    <MiniAudio
      visible={true}
      customStyle={{ backgroundColor: 'blue' }}
      name="Sample Audio"
      showWaveform={true}
      barColor="green"
      textColor="black"
      nameTextStyling={{ fontSize: '20px' }}
      imageSource="path/to/image.jpg"
      roundedImage={true}
      imageStyle={{ width: '100px' }}
      overlayPosition="top"
    />
  );
}

export default App;

Properties

propTypes? displayName?

Properties

OptionalpropTypes

propTypes?: any

Ignored by React.

Deprecated

Only kept in types for backwards compatibility. Will be removed in a future major release.

OptionaldisplayName

displayName?: string

Used in debugging messages. You might want to set it explicitly if you want to display a different name for debugging purposes.

See

Legacy React Docs

Example


const MyComponent: FC = () => {
  return <div>Hello!</div>
}

MyComponent.displayName = 'MyAwesomeComponent'

Settings

Member Visibility

On This Page

Properties