wr
winbox-react
npm i winbox-react
wr

winbox-react

This package is the react version of Winbox.js

by Tanvir Mahin

1.0.6 (see all)License:MITTypeScript:Not Found
npm i winbox-react
Readme

winbox-react

This package is the react version of Winbox.js

Official Documentation: Visit Now

Example Code: Visit Now

NPM JavaScript Style Guide

Install

npm install --save winbox-react

Usage in functional components

import React from 'react'

import WinboxReact from 'winbox-react'
import 'winbox-react/dist/index.css'

cosnt Example = () =>{
    return <WinboxReact />
  
}

Usage in Class based components

import React, { Component } from 'react'

import WinboxReact from 'winbox-react'
import 'winbox-react/dist/index.css'

class Example extends Component {
  render() {
    return <WinboxReact />
  }
}

All available props

const options = {
    // ADDING CUSTOM TITLE
    title: 'Custom Title',

    //ADDING BORDER example:  25px, 1rem, 10%, 3em. If any number is given it will be count as pixels
    border: '4',

    //ADDING BACKGROUND COLOR any valid css color code can be used. You also can use gradients.
    background:
      'linear-gradient(90deg, rgba(49,36,239,1) 0%, rgba(67,0,168,1) 100%)',

    //CUSTOM className
    className: '',

    //CUSTOM POSITION any valid
    x: 'center',
    y: 'center',

    //CUSTOM SIZE
    width: '20%',
    height: '50%',

    //LIMIT VIEWPORT
    top: 50,
    right: 50,
    bottom: 100,
    left: 50,

    //IS MODAL OR WINDOW (default is false)
    modal: false,

    //EMBED A WEBSITE using the url prop ()
    url: '',

    //USE THE MODERN THEME OF WINBOX
    modern: false

    //onClose EVENT
    onClose: myCustomFunction()
  }

  <WinboxReact {...options}>
          <h4>Lorem ipsum dolor sit amet</h4>
  </WinboxReact>

Help me improve this package by becoming a Patreon

License

MIT © TanvirMahin24

Downloads/wk

19

GitHub Stars

15

LAST COMMIT

8mos ago

MAINTAINERS

1

CONTRIBUTORS

1

OPEN ISSUES

4

OPEN PRs

0
VersionTagPublished
1.0.6
latest
8mos ago
No alternatives found
No tutorials found
Add a tutorial

Rate & Review

100
No reviews found
Be the first to rate