diff --git a/examples/src/index.tsx b/examples/src/index.tsx index 19284cb..fc7767c 100755 --- a/examples/src/index.tsx +++ b/examples/src/index.tsx @@ -1,4 +1,5 @@ import './index.less' +//import 'core-js/fn/weak-set' import { m, createContext, @@ -17,13 +18,14 @@ import { ModalOverlay, Portal } from '../../dist' +import {mount} from 'mithril-es' const Theme = createContext('green') const Button = () => ( {color => } ) - +/* class SliderExample extends View { slider = new SliderStore() view() { @@ -50,7 +52,7 @@ class SliderExample extends View { ) } } - +*/ const hashMatcher = (location, route) => parseRoute(location.hash.substr(1), route) @@ -124,7 +126,7 @@ class Examples extends View { Back home - + {/**/} { @@ -163,4 +165,4 @@ class Examples extends View { } } -m.mount(document.getElementById('root'), Examples) +mount(document.getElementById('root'), Examples) diff --git a/src/deprecated/form.ts b/src/deprecated/form.ts index 0f09189..a6572a7 100755 --- a/src/deprecated/form.ts +++ b/src/deprecated/form.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m, buildQueryString, request} from 'mithril-es' import {FormStatus, FormStore} from '../store/formstore' import objectToFormData from 'object-to-formdata' import { @@ -62,7 +62,7 @@ export class FormBase { formatData(type) { switch (type) { case 'application/x-www-form-urlencoded': - return m.buildQueryString(this.store.data) + return buildQueryString(this.store.data) case 'multipart/form-data': return objectToFormData(this.store.data) case 'application/json': @@ -71,7 +71,7 @@ export class FormBase { } transfer(request) { - return m.request({ + return request({ ...request, config: xhr => this.store.send(xhr) }) diff --git a/src/deprecated/page.ts b/src/deprecated/page.ts index 6583b9f..429b376 100755 --- a/src/deprecated/page.ts +++ b/src/deprecated/page.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import {Component} from '../ui/component' export class Page extends Component< diff --git a/src/deprecated/router.ts b/src/deprecated/router.ts index 5bcedc0..eb8d2ab 100755 --- a/src/deprecated/router.ts +++ b/src/deprecated/router.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m, parseQueryString, redraw, mount} from 'mithril-es' import jump from 'jump.js' export class Router { @@ -16,7 +16,7 @@ export class Router { view(vnode) { const {href} = window.location const params = - href.indexOf('?') > -1 ? m.parseQueryString(href.split('?')[1]) : {} + href.indexOf('?') > -1 ? parseQueryString(href.split('?')[1]) : {} const route = {href, path: window.location.pathname, params} return this.resolve(this.data, route) } @@ -25,12 +25,12 @@ export class Router { window.onpopstate = e => { if (e.state) { this.setData(e.state.data) - m.redraw() + redraw() } else { this.navigate(window.location.pathname) } } - m.mount(element, this) + mount(element, this) } getPageTitle(data) { diff --git a/src/hyperscript.ts b/src/hyperscript.ts index c0b8990..08e8dac 100755 --- a/src/hyperscript.ts +++ b/src/hyperscript.ts @@ -1,9 +1,15 @@ -import {Attributes, ComponentTypes, Lifecycle, Children, Vnode} from 'mithril' -import hyperscript from 'mithril' +import { + m as hyperscript, + Attributes, + ComponentTypes, + Lifecycle, + Children, + Vnode +} from 'mithril-es' type ChildAttr = {children: T} | {children?: T} -const mithrilStatic = {...hyperscript} +//const mithrilStatic = {...hyperscript} type ExtendedHyperscript = { (selector: string, ...children: Children[]): Vnode @@ -29,7 +35,7 @@ type ExtendedHyperscript = { attributes: Attrs & {key?: string | number}, ...args: Child[] ): Vnode -} & typeof mithrilStatic +} //& typeof mithrilStatic const isPlainFunction = input => typeof input === 'function' && typeof input.prototype.view !== 'function' diff --git a/src/router/router.ts b/src/router/router.ts index 0c1df50..5e3fb89 100755 --- a/src/router/router.ts +++ b/src/router/router.ts @@ -1,4 +1,5 @@ import {m} from '../hyperscript' +import {redraw} from 'mithril-es' import {View} from '../ui/view' import {createContext} from '../ui/context' import {parseRoute, Match} from './parseroute' @@ -39,9 +40,9 @@ export class Router extends View { static instances = 0 onCreate() { - if (!Router.instances++) window.addEventListener('popstate', m.redraw) + if (!Router.instances++) window.addEventListener('popstate', redraw) this.onRemove = () => { - if (!--Router.instances) window.removeEventListener('popstate', m.redraw) + if (!--Router.instances) window.removeEventListener('popstate', redraw) } } @@ -65,11 +66,11 @@ export class Router extends View { pathname, replace: (to: string) => { history.replaceState(pathname, '', to) - m.redraw() + redraw() }, push: (href: string) => { history.pushState(href, '', href) - m.redraw() + redraw() }, match: (route: RouteAttrs) => matcher(location, route), formatPath diff --git a/src/router/switch.ts b/src/router/switch.ts index 81ac09a..2d7f597 100755 --- a/src/router/switch.ts +++ b/src/router/switch.ts @@ -1,6 +1,6 @@ import {View} from '../ui/view' import {Route, RouteAttrs} from './route' -import {Vnode} from 'mithril' +import {Vnode} from 'mithril-es' import {m} from '../hyperscript' import {Location} from './router' import {extractChildren} from '../util/children' diff --git a/src/store/formstore.ts b/src/store/formstore.ts index d7e7c88..98f1813 100755 --- a/src/store/formstore.ts +++ b/src/store/formstore.ts @@ -1,55 +1,55 @@ -import m from 'mithril' +import {m} from 'mithril-es' export const FormStatus = { - Reset: 'reset', - Sending: 'sending', // {xhr} - Failure: 'error', // {errors} - Success: 'success' // {response} + Reset: 'reset', + Sending: 'sending', // {xhr} + Failure: 'error', // {errors} + Success: 'success' // {response} } export type FormState = | {type: 'reset'} - | {type: 'sending', xhr: XMLHttpRequest} - | {type: 'error', errors: {}} - | {type: 'success', response: {}} + | {type: 'sending'; xhr: XMLHttpRequest} + | {type: 'error'; errors: {}} + | {type: 'success'; response: {}} export class FormStore { data: {} status: FormState - constructor(data = {}) { - this.data = data - this.status = {type: 'reset'} - } - - send(xhr) { - this.status = {type: 'sending', xhr} - } - - success(response) { - this.status = {type: 'success', response} - return response - } - - fail(errors) { - this.status = {type: 'error', errors} - return errors - } - - reset() { - switch (this.status.type) { - case 'sending': - this.status.xhr.abort() - default: - this.status = {type: 'reset'} - } - } - - setData(key, value) { - this.data[key] = value - } - - toString() { - return this.status.type - } -} \ No newline at end of file + constructor(data = {}) { + this.data = data + this.status = {type: 'reset'} + } + + send(xhr) { + this.status = {type: 'sending', xhr} + } + + success(response) { + this.status = {type: 'success', response} + return response + } + + fail(errors) { + this.status = {type: 'error', errors} + return errors + } + + reset() { + switch (this.status.type) { + case 'sending': + this.status.xhr.abort() + default: + this.status = {type: 'reset'} + } + } + + setData(key, value) { + this.data[key] = value + } + + toString() { + return this.status.type + } +} diff --git a/src/ui/background.ts b/src/ui/background.ts index 661ebff..2740971 100755 --- a/src/ui/background.ts +++ b/src/ui/background.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import {Component} from './component' import classnames from 'classnames' import {getResizedUrl} from './picture' diff --git a/src/ui/component.ts b/src/ui/component.ts index 77fb4d0..21a7084 100755 --- a/src/ui/component.ts +++ b/src/ui/component.ts @@ -3,7 +3,7 @@ import { CVnode, CVnodeDOM, Children -} from 'mithril' +} from 'mithril-es' import {extractChildren} from '../util/children' declare var process: {env: {NODE_ENV: string}} diff --git a/src/ui/context.ts b/src/ui/context.ts index d949b46..2a23d32 100755 --- a/src/ui/context.ts +++ b/src/ui/context.ts @@ -1,6 +1,6 @@ // See https://github.com/MithrilJS/mithril.js/issues/2148#issuecomment-452023800 -import m, {CVnode, Children} from 'mithril' +import {m, CVnode, Children} from 'mithril-es' import {View} from './view' export type ProviderAttrs = {value: T} diff --git a/src/ui/filter/duotone.ts b/src/ui/filter/duotone.ts index e6ef6bd..c37a9b1 100755 --- a/src/ui/filter/duotone.ts +++ b/src/ui/filter/duotone.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import {Component} from '../component' import hexRgb from 'hex-to-rgb' diff --git a/src/ui/form/boxes.ts b/src/ui/form/boxes.ts index 8c355c5..3b7526b 100755 --- a/src/ui/form/boxes.ts +++ b/src/ui/form/boxes.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import {Options, cleanupOptions} from '../../util/formutils' import {Component} from './../component' import {Checkbox} from './checkbox' diff --git a/src/ui/form/checkbox.ts b/src/ui/form/checkbox.ts index 0b00640..250f016 100755 --- a/src/ui/form/checkbox.ts +++ b/src/ui/form/checkbox.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import {randomKey} from '../../util/formutils' import {Component} from '../component' diff --git a/src/ui/form/field.ts b/src/ui/form/field.ts index 252dd37..c84461b 100755 --- a/src/ui/form/field.ts +++ b/src/ui/form/field.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import classnames from 'classnames' import {Component} from '../component' import {getErrorMessage} from '../../util/formutils' diff --git a/src/ui/form/fields.ts b/src/ui/form/fields.ts index 98fea3b..2ad7ace 100755 --- a/src/ui/form/fields.ts +++ b/src/ui/form/fields.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import {FormStatus, FormStore} from '../../store/formstore' import {randomKey} from '../../util/formutils' import {Field} from './field' diff --git a/src/ui/form/input.ts b/src/ui/form/input.ts index 9efe856..db07ae3 100755 --- a/src/ui/form/input.ts +++ b/src/ui/form/input.ts @@ -1,5 +1,5 @@ import classnames from 'classnames' -import m from 'mithril' +import {m} from 'mithril-es' import {Component} from '../component' import {getErrorMessage} from '../../util/formutils' diff --git a/src/ui/form/radio.ts b/src/ui/form/radio.ts index 1dfc254..efb7e75 100755 --- a/src/ui/form/radio.ts +++ b/src/ui/form/radio.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import {randomKey} from '../../util/formutils' import {Component} from '../component' diff --git a/src/ui/form/radios.ts b/src/ui/form/radios.ts index ebd473e..27305d5 100755 --- a/src/ui/form/radios.ts +++ b/src/ui/form/radios.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import {cleanupOptions, randomKey} from '../../util/formutils' import {Component} from '../component' import {Radio} from './radio' diff --git a/src/ui/form/select.ts b/src/ui/form/select.ts index a212081..8354a4f 100755 --- a/src/ui/form/select.ts +++ b/src/ui/form/select.ts @@ -1,5 +1,5 @@ import classnames from 'classnames' -import m from 'mithril' +import {m} from 'mithril-es' import {cleanupOptions} from '../../util/formutils' import {Component} from '../component' diff --git a/src/ui/form/textarea.ts b/src/ui/form/textarea.ts index fd3908c..af3a4b0 100755 --- a/src/ui/form/textarea.ts +++ b/src/ui/form/textarea.ts @@ -1,5 +1,5 @@ import classnames from 'classnames' -import m from 'mithril' +import {m} from 'mithril-es' import {Component} from '../component' import './textarea.less' diff --git a/src/ui/icon.ts b/src/ui/icon.ts index c357ef4..92e789e 100755 --- a/src/ui/icon.ts +++ b/src/ui/icon.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import {Component} from './component' import classnames from 'classnames' diff --git a/src/ui/image.ts b/src/ui/image.ts index 88695c5..973eac1 100755 --- a/src/ui/image.ts +++ b/src/ui/image.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import {Component} from './component' import './image.less' diff --git a/src/ui/masonry.ts b/src/ui/masonry.ts index 8e997fd..51152a9 100755 --- a/src/ui/masonry.ts +++ b/src/ui/masonry.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import {Component} from './component' import './masonry.less' diff --git a/src/ui/mediaquery.ts b/src/ui/mediaquery.ts index a11dce7..5a7950b 100755 --- a/src/ui/mediaquery.ts +++ b/src/ui/mediaquery.ts @@ -1,5 +1,5 @@ -import m from 'mithril' -import {Vnode} from 'mithril' +import {m, redraw} from 'mithril-es' +import {Vnode} from 'mithril-es' import {Component} from './component' import matchMedia from 'matchmediaquery' @@ -17,12 +17,12 @@ export class MediaQuery extends Component<{ if (maxWidth) rules.push(`(max-width: ${maxWidth}px)`) const query = rules.join(' and ') const matcher = matchMedia(query) - matcher.addListener(m.redraw) + matcher.addListener(redraw) return matcher } onremove() { - this.matcher.removeListener(m.redraw) + this.matcher.removeListener(redraw) } view() { diff --git a/src/ui/modal.ts b/src/ui/modal.ts index 364e8c1..703fd1c 100755 --- a/src/ui/modal.ts +++ b/src/ui/modal.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m, redraw} from 'mithril-es' import {Component} from './component' import {subComponent} from '../util/subcomponent' import lockScroll from '../util/lockscroll' @@ -33,7 +33,7 @@ export class Modal extends Component<{ const {close} = this.attrs if (e.keyCode !== 27) return close() - m.redraw() + redraw() } view() { diff --git a/src/ui/picture.ts b/src/ui/picture.ts index 27f5bb3..4d58be0 100755 --- a/src/ui/picture.ts +++ b/src/ui/picture.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' import {Component} from './component' import classnames from 'classnames' diff --git a/src/ui/portal.ts b/src/ui/portal.ts index 7cfd3ea..a490fd2 100755 --- a/src/ui/portal.ts +++ b/src/ui/portal.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m, mount} from 'mithril-es' import {View} from './view' export class Portal extends View { @@ -6,11 +6,11 @@ export class Portal extends View { onCreate() { document.body.appendChild(this.node) - m.mount(this.node, {view: () => this.children}) + mount(this.node, {view: () => this.children}) } onRemove() { - m.mount(this.node, {view: () => null}) + mount(this.node, {view: () => null}) document.body.removeChild(this.node) } diff --git a/src/ui/slider.ts b/src/ui/slider.ts index ecb0895..f2e0533 100755 --- a/src/ui/slider.ts +++ b/src/ui/slider.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m, redraw} from 'mithril-es' import {Stream} from 'mithril/stream' import {styler, spring, listen, pointer, value, tween, calc} from 'popmotion' import {Component} from './component' @@ -32,7 +32,7 @@ export class Slider extends Component< size() // We redraw in the next frame here, because // active state is only now available - setTimeout(m.redraw) + setTimeout(redraw) this['onremove'] = () => { listener.stop() window.removeEventListener('resize', size) @@ -68,7 +68,7 @@ export class Slider extends Component< const next = velocity > 0 ? index() - 1 : index() + 1 if (next >= 0 && next < total()) { index(next) - return m.redraw() + return redraw() } } this.bounce() @@ -135,7 +135,7 @@ export class Slider extends Component< if (total() != this.slides.length) { total(this.slides.length) if (index() > total()) index(total() - 1) - setTimeout(m.redraw) + setTimeout(redraw) } if (actives) actives(activeChecks) } diff --git a/src/ui/view.ts b/src/ui/view.ts index bb4bd83..d117d73 100755 --- a/src/ui/view.ts +++ b/src/ui/view.ts @@ -1,4 +1,4 @@ -import m, {Component, CVnode, CVnodeDOM, Children} from 'mithril' +import {m, Component, CVnode, CVnodeDOM, Children} from 'mithril-es' import {extractChildren} from '../util/children' declare global { diff --git a/src/util/children.ts b/src/util/children.ts index c95f910..3aaf948 100755 --- a/src/util/children.ts +++ b/src/util/children.ts @@ -1,4 +1,4 @@ -import {Children} from 'mithril' +import {Children} from 'mithril-es' export const extractChildren = (children: Children): Children => children && children[0] && typeof children[0] == 'function' diff --git a/src/util/subcomponent.ts b/src/util/subcomponent.ts index ec36b97..14b7e28 100755 --- a/src/util/subcomponent.ts +++ b/src/util/subcomponent.ts @@ -1,4 +1,4 @@ -import m from 'mithril' +import {m} from 'mithril-es' export function subComponent(selector) { return {