Skip to content

Photon.Drawer()

Interact with <Drawer/> components in the DOM.

Importing

1
import Photon from "photoncss";

Use the default export

Usage

1
Photon.Drawer(drawer_element);
returns new Drawer

Arguments

Argument Type Description
drawer_element string | jQuery | Element Any of the allowed types that resolves to an element on the DOM.

Class

Properties

.isOpen : boolean

Gets if the drawer is open.

.target : jQuery

Get the drawer element on the DOM.

Methods

.close() : this

Closes the drawer.

.open() : this

Closes the drawer.

Example

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
import React, { Fragment } from "react";
import Photon from "photoncss";
import { Button, Drawer } from "photoncss/react";

export function MyDrawer() {
    return (
        <Drawer id="my-drawer">
            Hi, im a drawer
        </Drawer>
    );
}

export default function Component() {
    return (
        <Fragment>

            <MyDrawer/>

            <Button
              color="primary"
              variant="raised"
              onClick={ () => Photon.Drawer("#my-drawer").open() }>Show drawer</Button>

        </Fragment>
    );
}