Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jamesloper/poon-ui
https://github.com/jamesloper/poon-ui
Last synced: about 1 month ago
JSON representation
- Host: GitHub
- URL: https://github.com/jamesloper/poon-ui
- Owner: jamesloper
- Created: 2023-07-01T02:26:53.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-12-02T06:08:13.000Z (about 2 months ago)
- Last Synced: 2024-12-02T07:23:05.350Z (about 2 months ago)
- Language: JavaScript
- Size: 338 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Poon-UI
Poon UI is so native, it feels indecent! Why settle for a vanilla web app? Poon UI is the most golfed UI library that
attempts a native look and feel in the history of the web. It's immeasurable poon is due to the reuse of code internally
across components.
## Quick Start Guide
```bash
npm install poon-ui
npm install poon-router
```
#### `Head Tag` Adopt this template:
```html
```
#### `JavaScript` Import the CSS:
```javascript
import 'poon-ui/poon.css';
```
#### `index.js/main.js` Add PoonOverlays:
```javascript
import { PoonOverlays } from 'poon-ui';
const App = () => (
);
```
PoonOverlays currently includes a Modal, Toast, and Alert
## Integration with Poon Router
Poon Router passes some very important props (isVisible and animateIn) to the component being routed to. You must prop-drill both to the ``, `` and `` components wherever you use them.
## Custom Gestures
Personally I struggle to call them "custom" gestures. That would imply that when you use the Poon UI internal Gesture
system, you are doing something different than I while coding the components that are built in to this library. When in
fact, we be using the same gesture system.
Poon UI contains a juicy react hook called `useGesture`. Please simply take a look at ScrollView, Card,
Window, etc, and the API for such a historically difficult task will become clear as day, and soon you will admit being
unable to create gestures any other way.
## Text Selection
The web is historically document based. However it seemed more sexy to disable text selection everywhere except for `
`
elements. Do you think it's too naughty? On iOS the guy who decided the text selection algorithm clearly had a lil concussy, so it is what it is.
## Scrolling
An important note on scrolling. I've committed the X rated act of a custom scroller and I'm very sorry. Unfortunately the creators of iOS Safari are into sadism because they disable e.preventDefault() so you can't cancel a vertical scroll while another gesture is happening, say, for instance a swipe back gesture. This causes the most atrocious faux pas of UI interaction where you can be scrolling a scroller and swiping back at the same time. There is no fix for it. There is no way to cancel a scroll once the finger moves. So I had to make my own scroller. I'm sorry. I'm so sorry. This is something I am working on tirelessly to resolve.