reflex/pynecone/components/overlay/drawer.py

"""Container to stack elements with spacing."""

from typing import Set

from pynecone.components.libs.chakra import ChakraComponent
from pynecone.var import Var


class Drawer(ChakraComponent):
    """A drawer component."""

    tag = "Drawer"

    # If true, the modal will be open.
    is_open: Var[bool]

    # Handle zoom/pinch gestures on iOS devices when scroll locking is enabled. Defaults to false.
    allow_pinch_zoom: Var[bool]

    # If true, the modal will autofocus the first enabled and interactive element within the ModalContent
    auto_focus: Var[bool]

    # If true, scrolling will be disabled on the body when the modal opens.
    block_scroll_on_mount: Var[bool]

    # If true, the modal will close when the Esc key is pressed
    close_on_esc: Var[bool]

    # If true, the modal will close when the overlay is clicked
    close_on_overlay_click: Var[bool]

    # If true, the modal will be centered on screen.
    is_centered: Var[bool]

    # If true and drawer's placement is top or bottom, the drawer will occupy the viewport height (100vh)
    is_full_height: Var[bool]

    # Enables aggressive focus capturing within iframes. - If true: keep focus in the lock, no matter where lock is active - If false: allows focus to move outside of iframe
    lock_focus_across_frames: Var[bool]

    # The placement of the drawer
    placement: Var[str]

    # If true, a `padding-right` will be applied to the body element that's equal to the width of the scrollbar. This can help prevent some unpleasant flickering effect and content adjustment when the modal opens
    preserve_scroll_bar_gap: Var[bool]

    # If true, the modal will return focus to the element that triggered it when it closes.
    return_focus_on_close: Var[bool]

    # "xs" | "sm" | "md" | "lg" | "xl" | "full"
    size: Var[str]

    # A11y: If true, the siblings of the modal will have `aria-hidden` set to true so that screen readers can only see the modal. This is commonly known as making the other elements **inert**
    use_inert: Var[bool]

    # Variant of drawer
    variant: Var[str]

    @classmethod
    def get_triggers(cls) -> Set[str]:
        """Get the event triggers for the component.

        Returns:
            The event triggers.
        """
        return super().get_triggers() | {
            "on_close",
            "on_close_complete",
            "on_esc",
            "on_overlay_click",
        }


class DrawerBody(ChakraComponent):
    """Drawer body."""

    tag = "DrawerBody"


class DrawerHeader(ChakraComponent):
    """Drawer header."""

    tag = "DrawerHeader"


class DrawerFooter(ChakraComponent):
    """Drawer footer."""

    tag = "DrawerFooter"


class DrawerOverlay(Drawer):
    """Drawer overlay."""

    tag = "DrawerOverlay"


class DrawerContent(Drawer):
    """Drawer content."""

    tag = "DrawerContent"


class DrawerCloseButton(Drawer):
    """Drawer close button."""

    tag = "DrawerCloseButton"