0.0.1-beta.18 • Published 1 year ago

@hudoro/drawer v0.0.1-beta.18

Weekly downloads
-
License
ISC
Repository
-
Last release
1 year ago

Hudoro drawer

Hudoro drawer is a strict and customizable drawer component for web development projects, designed for simplicity and adherence to strict design guidelines.

Screenshots

App Screenshot

Package instalation

Instal package using pnpm

  pnpm add @hudoro/drawer

Instal package using yarn

  yarn add @hudoro/drawer

Instal package using npm

  npm i @hudoro/drawer

Usage/Examples (you can combine using icon package hudoro)

import React, {useState} from "react";
import {Drawer} from "@hudoro/drawer";
import ReactDOM from "react-dom/client";

const App = () => {
  const [isshow, setIsshow] = useState(false);
  const toggleShow = () => setIsshow((prev) => !prev);
  return (
    <div style={{height: "100vh", background: "black"}}>
      <button onClick={toggleShow}>Component test</button>
      <Drawer isShow={isshow} position="right" onHide={toggleShow} blur={false}>
        <div style={{minWidth: "30vw"}}>children</div>
      </Drawer>
    </div>
  );
};

ReactDOM.createRoot(document.getElementById("app")!).render(<App />);

Props @hudoro/drawer

Props that you can pass to <Drawer {...props} >

Prop NameValuerequired
childrenReactNodetrue
position"top" / "right" / "bottom" / "left"false
isShowbooleantrue
onHide() => voidtrue
noBgbooleanfalse
blurbooleanfalse
0.0.1-beta.7

1 year ago

0.0.1-beta.6

1 year ago

0.0.1-beta.9

1 year ago

0.0.1-beta.8

1 year ago

0.0.1-beta.10

1 year ago

0.0.1-beta.12

1 year ago

0.0.1-beta.11

1 year ago

0.0.1-beta.18

1 year ago

0.0.1-beta.5

1 year ago

0.0.1-beta.4

1 year ago

0.0.1-beta.14

1 year ago

0.0.1-beta.13

1 year ago

0.0.1-beta.16

1 year ago

0.0.1-beta.15

1 year ago

0.0.1-beta.3

1 year ago

0.0.1-beta.2

1 year ago

0.0.1-beta.1

1 year ago

0.0.1-beta.0

1 year ago