reflex-image-zoom

Name	reflex-image-zoom JSON
Version	0.0.2 JSON
	download
home_page	None
Summary	Reflex custom component image-zoom
upload_time	2024-03-20 18:15:32
maintainer	None
docs_url	None
author	None
requires_python	>=3.8
license	Apache-2.0
keywords	reflex reflex-custom-components
VCS
bugtrack_url
requirements	No requirements were recorded.
Travis-CI	No Travis.
coveralls test coverage	No coveralls.

            # Image Zoom Component

A Reflex custom component image-zoom - based on [react-medium-image-zoom](https://www.npmjs.com/package/react-medium-image-zoom).

Check out the [live demo](https://image-zoom.reflex.run).

## Installation

```bash
pip install reflex-image-zoom
```

## Usage

![image-zoom](image-zoom.gif)

I've currently wrapped no props, simply pass the image as a child of the component.

```python
import reflex as rx
from reflex_image_zoom import image_zoom

def index() -> rx.Component:
    return rx.center(
        rx.vstack(
            rx.heading("Welcome to Reflex!", size="9"),
            image_zoom(
                rx.image(src="https://picsum.photos/800/500", width="400px"),
            ),
            align="center",
            spacing="7",
            font_size="2em",
        ),
        height="100vh",
    )


app = rx.App()
app.add_page(index)
```

            

Raw data

            {
    "_id": null,
    "home_page": null,
    "name": "reflex-image-zoom",
    "maintainer": null,
    "docs_url": null,
    "requires_python": ">=3.8",
    "maintainer_email": null,
    "keywords": "reflex, reflex-custom-components",
    "author": null,
    "author_email": "Nikhil Rao <nikhil@reflex.dev>",
    "download_url": "https://files.pythonhosted.org/packages/94/0a/6cf2c9b3fcc7a44c136df038d55f39b8b8d876e736187ca07bfb56a2f830/reflex-image-zoom-0.0.2.tar.gz",
    "platform": null,
    "description": "# Image Zoom Component\n\nA Reflex custom component image-zoom - based on [react-medium-image-zoom](https://www.npmjs.com/package/react-medium-image-zoom).\n\nCheck out the [live demo](https://image-zoom.reflex.run).\n\n## Installation\n\n```bash\npip install reflex-image-zoom\n```\n\n## Usage\n\n![image-zoom](image-zoom.gif)\n\nI've currently wrapped no props, simply pass the image as a child of the component.\n\n```python\nimport reflex as rx\nfrom reflex_image_zoom import image_zoom\n\ndef index() -> rx.Component:\n    return rx.center(\n        rx.vstack(\n            rx.heading(\"Welcome to Reflex!\", size=\"9\"),\n            image_zoom(\n                rx.image(src=\"https://picsum.photos/800/500\", width=\"400px\"),\n            ),\n            align=\"center\",\n            spacing=\"7\",\n            font_size=\"2em\",\n        ),\n        height=\"100vh\",\n    )\n\n\napp = rx.App()\napp.add_page(index)\n```\n",
    "bugtrack_url": null,
    "license": "Apache-2.0",
    "summary": "Reflex custom component image-zoom",
    "version": "0.0.2",
    "project_urls": {
        "Homepage": "https://github.com/picklelo/reflex-image-zoom"
    },
    "split_keywords": [
        "reflex",
        " reflex-custom-components"
    ],
    "urls": [
        {
            "comment_text": "",
            "digests": {
                "blake2b_256": "a2c93360864ed46398ba6899fc841c8580c03740b3f7042b92a01efab3d61165",
                "md5": "4ae31956451ce93bddd32b730fffe0c5",
                "sha256": "ae1233a199863b70bc6fb10141439c150cf2b02b5ef3d0069271b92b42d05090"
            },
            "downloads": -1,
            "filename": "reflex_image_zoom-0.0.2-py3-none-any.whl",
            "has_sig": false,
            "md5_digest": "4ae31956451ce93bddd32b730fffe0c5",
            "packagetype": "bdist_wheel",
            "python_version": "py3",
            "requires_python": ">=3.8",
            "size": 2467,
            "upload_time": "2024-03-20T18:15:30",
            "upload_time_iso_8601": "2024-03-20T18:15:30.464104Z",
            "url": "https://files.pythonhosted.org/packages/a2/c9/3360864ed46398ba6899fc841c8580c03740b3f7042b92a01efab3d61165/reflex_image_zoom-0.0.2-py3-none-any.whl",
            "yanked": false,
            "yanked_reason": null
        },
        {
            "comment_text": "",
            "digests": {
                "blake2b_256": "940a6cf2c9b3fcc7a44c136df038d55f39b8b8d876e736187ca07bfb56a2f830",
                "md5": "9c6f6097b96306c4dead781a9267b3d6",
                "sha256": "bdb43b6e677936a8c4144b50594e27f3be9dd38c35b76920640f36fb030ef5c6"
            },
            "downloads": -1,
            "filename": "reflex-image-zoom-0.0.2.tar.gz",
            "has_sig": false,
            "md5_digest": "9c6f6097b96306c4dead781a9267b3d6",
            "packagetype": "sdist",
            "python_version": "source",
            "requires_python": ">=3.8",
            "size": 2259,
            "upload_time": "2024-03-20T18:15:32",
            "upload_time_iso_8601": "2024-03-20T18:15:32.463760Z",
            "url": "https://files.pythonhosted.org/packages/94/0a/6cf2c9b3fcc7a44c136df038d55f39b8b8d876e736187ca07bfb56a2f830/reflex-image-zoom-0.0.2.tar.gz",
            "yanked": false,
            "yanked_reason": null
        }
    ],
    "upload_time": "2024-03-20 18:15:32",
    "github": true,
    "gitlab": false,
    "bitbucket": false,
    "codeberg": false,
    "github_user": "picklelo",
    "github_project": "reflex-image-zoom",
    "travis_ci": false,
    "coveralls": false,
    "github_actions": false,
    "lcname": "reflex-image-zoom"
}