Mobile UI for Hyperapp

Downloads in past


700.8.174 years ago5 years agoMinified + gzip package size for @gulw/components in KB


Framewrok7 Components With Hyperapp
Mobile UI for Hyperapp !NPM versionnpm-imagenpm-url !npm downloaddownload-imagedownload-url


v0.8.17 - October 26, 2018

Dialog: support key perporty in ButtonOptions Overlay: prevent scrolling on overlays

v0.8.16 - October 18, 2018

Dialog: support not button layout

v0.8.12 - September 21, 2018

Minor fixes, remove a few lines of duplicated code PullToRefresh:
* call e.preventDefault in touchmove event when use translate, to prevent some unexpected browser behavior.
* remove transition classname when not needed

check Change Log for more.


Kitchen Sink
Docs are not ready yet, you can learn about Components and their Apis in typing files for now.


npm install --save @gulw/components
You can also access bundled file in unpkg, global name is F7Components


The following two ways used to load the only components you used, select one of the ways you like.
// .babelrc or babel-loader option
"plugins": [
["import", { "libraryName": "@gulw/components", "style": "css" }] // `style: true` for less
This allows you to import components without having to manually import the corresponding stylesheet. The babel plugin will automatically import stylesheets.
// import js and css modularly, parsed by babel-plugin-import
import { Picker } from '@gulw/components';
  • Manually import
import Picker from '@gulw/components/lib/picker';  // for js
import '@gulw/components/lib/picker/style/css';    // for css
// import '@gulw/components/lib/picker/style';     // that will import less


See more example in
demos ```js import { h, app } from 'hyperapp' import { Page, Navbar, ContentBlock } from '@gulw/components' // import css import '@gulw/components/dist/f7-components.css' const Main = () => { return (
<Navbar center="My App" />
<p>Example app</p>
) } app({}, {}, Main, document.body) ```