0.2.24 • Published 2 years ago

qmamuvoice v0.2.24

Weekly downloads
-
License
MIT
Repository
-
Last release
2 years ago

Installation

You can install with npm.

npm install search-box-qmamu

User guide

Props

Every Props are optional you can use it simply import and use component this props is used for enhancement of search data and For Custome UI.

language

It's use in API call default value is 'en' (e.g., 'en' for English, 'es' for Spanish, or 'fr' for French)

category

It's use in API call there is no default value (e.g., 'i' for Images, 'n' for News, 'yt' for YouTube, or 'sh' for Shopping)

country

It's use in API call there is no default value (e.g., 'us' for the United States, 'uk' for United Kingdom, or 'fr' for France)

suggesionbgcolor

It's use in suggesion background-color default value is 'black' you can use any color name, hex-code or rgb-color code (e.g., 'black' for color-name, '#ebebeb' for HEX-code, or 'rgb(255, 127, 80)' for RGB-color)

suggesionselectedcolor

It's use in selected suggesion background-color default value is 'red' you can use any color name, hex-code or rgb-color code (e.g., 'black' for color-name, '#ebebeb' for HEX-code, or 'rgb(255, 127, 80)' for RGB-color)

valuecolor

It's use in text-color default value is 'whitesmoke' you can use any color name, hex-code or rgb-color code (e.g., 'black' for color-name, '#ebebeb' for HEX-code, or 'rgb(255, 127, 80)' for RGB-color)

suggesioncss

It's use for seggesion box css in this css object you can design all about suggesions

searchcss

It's use for search box css in this css object you can design all about search

Usage

JSONP only supports GET method, same as search-box-qmamu.

Fetch JSONP in simple way

import SearchBox from "search-box-qmamu";

function(){

  const searchCSS = {
    border: "1px solid red",
    width: "100%",
  };

  const suggesionCSS = {
    border: "1px solid black",
  };

  return (
    <SearchBox
      suggesionbgcolor="green"
      suggesionselectedcolor="black"
      searchcss={searchCSS}
      suggesioncss={suggesionCSS}
    />
  )
}