material 0.6.2 → 0.7.1

package/form.js

@@ -0,0 +1,27 @@
+import build from './src/form/build'
+import cancel from './src/form/cancel'
+import controller from './src/form/controller'
+import create from './src/form/create'
+import data from './src/form/data'
+import del from './src/form/delete'
+import fetch from './src/form/fetch'
+import render from './src/form/render'
+import set from './src/form/set'
+import submit from './src/form/submit'
+import update from './src/form/update'
+import verify from './src/form/verify'
+
+export {
+  build,
+  cancel,
+  controller,
+  create,
+  data,
+  del,
+  fetch,
+  render,
+  set,
+  submit,
+  update,
+  verify
+}

package/index.js

@@ -1,63 +1,73 @@
-import AppBar from 'material/src/appbar'
-import Button from 'material/src/button'
-import Banner from 'material/src/banner'
-import Calendar from 'material/src/calendar'
-import Card from 'material/src/card'
-import Component from 'material/src/component'
-import Container from 'material/src/container'
-import Checkbox from 'material/src/checkbox'
-import Dialog from 'material/src/dialog'
-import Divider from 'material/src/divider'
-import Drawer from 'material/src/drawer'
-import Element from 'material/src/element'
-import Form from 'material/src/form'
-import Icon from 'material/src/icon'
-import Image from 'material/src/image'
-import Item from 'material/src/item'
-import Layout from 'material/src/layout'
-import List from 'material/src/list'
-import Menu from 'material/src/menu'
-import Progress from 'material/src/progress'
-import Slider from 'material/src/slider'
-import Snackbar from 'material/src/snackbar'
-import Switch from 'material/src/switch'
-import Tabs from 'material/src/tabs'
-import Text from 'material/src/text'
-import Textfield from 'material/src/textfield'
-import Toolbar from 'material/src/toolbar'
-import View from 'material/src/view'
-import Tree from 'material/src/tree'
-import emitter from 'material/src/module/emitter'
+import AppBar from './src/appbar'
+import Button from './src/button'
+import Card from './src/card'
+import Component from './src/component'
+import DateHour from './src/control/datehour'
+import Dialog from './src/dialog'
+import File from './src/control/file'
+import Loading from './src/control/loading'
+import Menu from './src/control/menu'
+import Select from './src/select'
+import Selecter from './src/control/selecter'
+import Snackbar from './src/snackbar'
+import Switch from './src/switch'
+import Switcher from './src/control/switcher'
+import Text from './src/text'
+import Textfield from './src/textfield'
+import Element from './src/element'
+import Layout from './src/layout'
+import List from './src/list'
+import Tabview from './src/tabview'
+import TabView from './src/tabview'
+import Text from './src/text'
+import Toolbar from './src/toolbar'
+import Tooltip from './src/tooltip'
+import attach from './src/module/attach'
+import attributes from './src/module/attributes'
+import build from './src/module/build'
+import dataset from './src/module/dataset'
+import display from './src/module/display'
+import events from './src/module/attach'
+import emitter from './src/module/emitter'
+import jsonToHTML from './src/module/jsontohtml'
+import mediator from './src/module/mediator'
+import observer from './src/module/observer'
+import smoothscroll from './src/module/smoothscroll'
 
 export {
-  AppBar,
+  AppBar
   Button,
-  Banner,
-  Calendar,
+  DateHour,
+  Datehour,
+  Dialog,
   Card,
-  Checkbox,
   Component,
-  Container,
-  Dialog,
-  Divider,
-  Drawer,
   Element,
-  Form,
-  Icon,
-  Image,
-  Item,
-  Layout,
-  List,
+  File,
+  Loading,
   Menu,
-  Slider,
+  Select,
+  Selecter,
+  Snackbar,
   Switch,
+  Switcher,
+  Tabview,
+  TabView,
   Text,
   Textfield,
   Toolbar,
-  Tree,
-  Tabs,
-  View,
-  Snackbar,
-  Progress,
-  emitter
+  Tooltip,
+  Layout,
+  List,
+  attach,
+  attributes,
+  build,
+  dataset,
+  display,
+  events,
+  emitter,
+  jsonToHTML,
+  mediator,
+  observer,
+  smoothscroll
 }

package/list.js

@@ -0,0 +1,35 @@
+import add from './src/list/add'
+import build from './src/list/build'
+import click from './src/list/click'
+import create from './src/list/create'
+import display from './src/list/display'
+import empty from './src/list/empty'
+import filter from './src/list/filter'
+import image from './src/list/image'
+import load from './src/list/load'
+import remove from './src/list/remove'
+import render from './src/list/render'
+import request from './src/list/request'
+import search from './src/list/search'
+import select from './src/list/select'
+import status from './src/list/status'
+import update from './src/list/update'
+
+export {
+  add,
+  build,
+  click,
+  create,
+  display,
+  empty,
+  filter,
+  image,
+  load,
+  remove,
+  render,
+  request,
+  search,
+  select,
+  status,
+  update
+}

package/package.json

@@ -1,8 +1,9 @@
 {
   "name": "material",
-  "version": "0.6.2",
+  "version": "0.7.1",
   "description": "A lightweight implementation of Material Design Components - ES6",
   "main": "index.js",
+  "type": "module",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@gitlab.com/alkaloid/material.git"
@@ -39,5 +40,8 @@
     "watch": "npm-run-all --parallel reload dev",
     "docs": "jsdoc src -r -d docs",
     "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "dependencies": {
+    "fs-extra": "^11.1.1"
   }
 }

package/src/appbar.js

@@ -1,216 +1,19 @@
-import passiveEvents from './module/passive'
-import create from './component/create'
-import insert from './component/insert'
-import offset from './element/offset'
-
-const defaults = {
-  prefix: 'material',
-  class: 'appbar',
-  tag: 'header'
-}
+import build from './module/build'
 
 class AppBar {
-  /**
-   * Constructor
-   * @param  {Object} options - Component options
-   * @return {Object} Class instance
-   */
+  static defaults = {
+    class: 'appbar'
+  }
+
   constructor (options) {
     this.init(options)
     this.build()
-    this.attach()
-    return this
   }
 
   init (options) {
-    this.options = Object.assign({}, defaults, options || {})
-    Object.assign(this, insert)
-
-    /// console.log('waterfALL', this.options.waterfall)
-
-    this.waterfall = this.options.waterfall
-  }
-
-  /**
-   * Build Method
-   * @return {Object} This class instance
-   */
-  build () {
-    this.root = create(this.options)
-
-    // console.log(this.options.height, this.options.fixed)
-
-    if (this.options.height) {
-      this.root.style.height = this.options.height + 'px'
-    }
-
-    if (this.options.fixed) {
-      // console.log('is-fixed')
-      this.root.classList.add('is-fixed')
-    }
-
-    if (this.options.flexible) {
-      this.root.classList.add('is-flexible')
-    }
-
-    // if (this.options.container) {
-    //   this.insert(this.options.container)
-    // }
-
-    return this
+    this.options = Object.assign({}, AppBar.defaults, options || {})
+    Object.assign(this, build)
   }
-
-  attach () {
-    this.root.addEventListener('DOMNodeInserted', (e) => {
-      var textNode = e.target
-      if (textNode !== this.root) return
-
-      var size = this.size = offset(this.root, 'height')
-
-      var view = this.view = this.root.parentNode
-
-      // console.log('view', view)
-
-      var p = 'top'
-
-      if (this.options.type == 'bottom') p = 'bottom'
-
-      var padding = window.getComputedStyle(view)['padding-' + p]
-      // console.log('paddingTop', padding)
-      // if (!padding) padding = window.getComputedStyle(this.root.parentNode, 'padding')
-      // console.log('padding', padding)
-
-      padding = parseInt(padding, 10)
-      // size = parseInt(size, 10)
-
-      this.padding = padding
-
-      // console.log(' toolbar inserted in', size, 'padding', padding)
-      var ptop = this.ptop = size + padding
-
-      // console.log('ptop', ptop)
-
-      if (document.body == view) {
-        // console.log('toolbar container body')
-        this.root.classList.add('toolbar-body')
-      }
-
-      // console.log('p', p)
-
-      view.setAttribute('style', 'padding-' + p + ': ' + ptop + 'px')
-      this.scroll(view)
-    })
-  }
-
-  /**
-   * Setter
-   * @param {string} prop
-   * @param {string} value
-   * @return {Object} The class instance
-   */
-  set (prop, value) {
-    switch (prop) {
-      case 'minimize':
-        this.root.setAttribute('style', 'height: 64px')
-        break
-      case 'value':
-        this.setValue(value)
-        break
-      case 'label':
-        this.setLabel(value)
-        break
-      default:
-        this.check(prop)
-    }
-
-    return this
-  }
-
-  scroll (view) {
-    // console.log('initScroll')
-
-    var isBody = false
-
-    var element = view
-
-    this.scrolling = view
-
-    if (view === document.body) {
-      isBody = true
-      element = document
-      this.scrolling = document.body
-    }
-
-    view.classList.add()
-
-    element.addEventListener('scroll', (e) => {
-      var scrollTop
-      if (isBody) {
-        scrollTop = (document.documentElement ||
-       document.body.parentNode ||
-       document.body).scrollTop
-      } else {
-        scrollTop = view.scrollTop
-      }
-
-      if (scrollTop > 0) {
-        this.root.classList.add('is-scrolled')
-      } else {
-        this.root.classList.remove('is-scrolled')
-      }
-
-      // console.log('scroll', scrollTop)
-
-      this.update(e, scrollTop)
-    })
-  }
-
-  update (e, scrollTop) {
-    if (this.options.fixed) { this.fixed(e, scrollTop) }
-    if (this.options.flexible) { this.flexible(e, scrollTop) }
-  }
-
-  flexible (e, scrollTop) {
-    var size = offset(this.root, 'height')
-    // console.log('flexible', size, this.root.offsetHeight, scrollTop)
-    // if (scrollTop < this.size) {
-    //
-    var height = '64'
-    if (size < height) {
-      this.root.style.height = height + 'px'
-    } else {
-      height = this.size - scrollTop
-      if (height < 64) height = 64
-      this.root.style.height = height + 'px'
-    }
-
-    // console.log('scroll', this.root.style.top, scrollTop)
-
-    // if (scrollTop > 50) {
-    //   this.root.style.trans = scrollTop + 'px'
-    // } else {
-    //   this.root.style.top = scrollTop + 'px'
-    // }
-    // }
-      // this.root.style.top = scrollTop + 'px'
-      // this.root.style.height = this.size - scrollTop
-    // } else {
-    //   console.log('size scroll', this.size, scrollTop)
-
-    //   this.root.style.height = this.size - scrollTop + 'px'
-    //   // this.root.style.top = scrollTop + 'px'
-    // }
-  }
-
-  fixed (e, scrollTop) {
-    if (scrollTop > 0) {
-      this.root.style.transform = 'translateY(' + scrollTop + 'px)'
-    } else {
-      this.root.style.transform = 'translateY(' + scrollTop + 'px)'
-    }
-  }
-
-  waterfall$ (e) {}
 }
 
 export default AppBar

package/src/badge.js

@@ -0,0 +1,27 @@
+import build from './module/build'
+
+class Badge {
+  static defaults = {
+    class: 'badge'
+  }
+
+  constructor (options) {
+    this.init(options)
+    this.build()
+  }
+
+  init (options) {
+    this.options = Object.assign({}, Badge.defaults, options || {})
+    Object.assign(this, build)
+  }
+
+  set(text) {
+    if (text) {
+      this.element.innerHTML = text
+    } else {
+      this.element.innerHTML = ''
+    }
+  }
+}
+
+export default Badge