English | 简体中文

@ray-js/outdoor-wifi-signal

Components of 4G and Wifi signal

Installation

$ npm install @ray-js/outdoor-wifi-signal
# or
$ yarn add @ray-js/outdoor-wifi-signal

Develop

# install deps
yarn

# watch compile demo
yarn start:tuya

Usage

import React from 'react';
import { View } from '@ray-js/ray';
import OutdoorWifiSignal from '@ray-js/outdoor-wifi-signal';

export default function Home() {
  return (
    <>
      {/* signal is string, light mode */}
      <View>
        <OutdoorWifiSignal signal="cut" />
        <OutdoorWifiSignal signal="bad" />
        <OutdoorWifiSignal signal="general" />
        <OutdoorWifiSignal signal="good" />
        <OutdoorWifiSignal signal="great" />
      </View>

      {/* signal is number, dark mode */}
      <View>
        <OutdoorWifiSignal signal={0} min={0} max={100} theme="dark" />
        <OutdoorWifiSignal signal={30} min={0} max={100} theme="dark" />
        <OutdoorWifiSignal signal={50} min={0} max={100} theme="dark" />
        <OutdoorWifiSignal signal={70} min={0} max={100} theme="dark" />
        <OutdoorWifiSignal signal={90} min={0} max={100} theme="dark" />
      </View>

      {/* Custom width and height */}
      <View>
        <OutdoorWifiSignal signal="good" style={{ width: '30px', height: '30px' }} />
        <OutdoorWifiSignal signal="good" style={{ width: '20px', height: '20px' }} />
      </View>
    </>
  );
}