https://github.com/andrelmlins/preact-fullscreen

Component that performs fullscreen in DOM Elements
https://github.com/andrelmlins/preact-fullscreen

fullscreen preact

Last synced: about 3 hours ago
JSON representation

Component that performs fullscreen in DOM Elements

• Host: GitHub
• URL: https://github.com/andrelmlins/preact-fullscreen
• Owner: andrelmlins
• License: mit
• Created: 2020-05-24T22:30:10.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2023-01-06T07:05:35.000Z (almost 2 years ago)
• Last Synced: 2024-11-01T11:37:43.491Z (15 days ago)
• Topics: fullscreen, preact
• Language: JavaScript
• Homepage:
• Size: 632 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Preact Fullscreen

[![npm version](https://badge.fury.io/js/preact-fullscreen.svg)](https://www.npmjs.com/package/preact-fullscreen) • [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://github.com/andrelmlins/preact-fullscreen/blob/master/LICENSE) • [![Build Status](https://travis-ci.com/andrelmlins/preact-fullscreen.svg?branch=master)](https://travis-ci.com/andrelmlins/preact-fullscreen)

Component that performs fullscreen in DOM Elements

## Installation

```

npm i preact-fullscreen

// OR

yarn add preact-fullscreen

```

## Demo

Local demo:

```

git clone https://github.com/andrelmlins/preact-fullscreen.git

cd preact-fullscreen

yarn install && yarn start

```

## Examples

```jsx

import { h, render } from "preact";

import PreactFullscreeen from "preact-fullscreen";

const App = () => (

  

    {({ ref, onRequest, onExit }) => (

      


         onRequest()}>FullScreen

         onExit()}>Screen

      

    )}

  

);


render(, document.body);

```

## Properties

| Prop     | Type | Description    |

| -------- | ---- | -------------- |

| onChange | func | Call in change |

| onError  | func | Call in error  |

### Children Function Properties

| Prop      | Type   | Description                |

| --------- | ------ | -------------------------- |

| ref       | object | Ref dom element            |

| onToggle  | func   | Call for fullscreen toggle |

| onExit    | func   | Call for fullscreen exit   |

| onRequest | func   | Call for fullscreen enter  |

## Browsers Support

You can see the list of supported browsers [here](https://caniuse.com/fullscreen)

![Browsers support](assets/browser-support.png)

## License

Preact Fullscreen is open source software [licensed as MIT](https://github.com/andrelmlins/preact-fullscreen/blob/master/LICENSE).