material 0.8.9 → 0.9.1

package/src/tabs.js

@@ -6,27 +6,20 @@ import offset from './element/offset'
 
 import List from './list'
 import Button from './button'
-import Divider from './divider'
+import Element from './element'
 
-const defaults = {
-  prefix: 'material',
-  class: 'tabs',
-  tag: 'div',
-  indicator: {
+class Tabs {
+  static defaults = {
     prefix: 'material',
-    class: 'indicator',
-    tag: 'div'
+    class: 'tabs',
+    tag: 'div',
+    indicator: {
+      prefix: 'material',
+      class: 'indicator',
+      tag: 'div'
+    }
   }
-}
 
-class Tabs {
-  static uid = "material-tabs";
-
-  /**
-   * Constructor
-   * @param  {Object} options - Component options
-   * @return {Object} Class instance
-   */
   constructor (options) {
     this.init(options)
     this.build()
@@ -35,7 +28,7 @@ class Tabs {
   }
 
   init (options) {
-    this.options = Object.assign({}, defaults, options || {})
+    this.options = { ...Tabs.defaults, ...options }
     Object.assign(this, insert, emitter)
   }
 
@@ -58,7 +51,7 @@ class Tabs {
         render: (info) => {
           let item
           if (info.type === 'divider') {
-            item = new Divider()
+            item = new Element({ class: 'divider' })
           } else {
             item = new Button({
               name: info.name,

package/src/tabview.js

@@ -1,7 +1,7 @@
 import EventEmitter from './mixin/emitter'
 import observer from './element/observer'
 import events from './module/events'
-import build from './module/build'
+import build from './mixin/build'
 import display from './view/display'
 
 class TabView extends EventEmitter {

package/src/text.js

@@ -1,8 +1,6 @@
-import build from './module/build'
+import build from './mixin/build'
 
 class Text {
-  static uid = "material-text";
-
   static defaults = {
     class: 'text',
     tag: 'span'
@@ -15,7 +13,7 @@ class Text {
   }
 
   init (options) {
-    this.options = Object.assign({}, Text.defaults, options || {})
+    this.options = { ...Text.defaults, ...options }
     Object.assign(this, build)
   }
 

package/src/textfield.js

@@ -4,8 +4,6 @@ import dataset from './module/dataset'
 import attributes from './module/attributes'
 
 class Textfield {
-  static uid = "material-textfield";
-
   static isComponent () {
     return true
   }
@@ -28,7 +26,7 @@ class Textfield {
   }
 
   init (options) {
-    this.options = Object.assign({}, Textfield.defaults, options || {})
+    this.options = { ...Textfield.defaults, ...options }
     Object.assign(this, emitter, dataset)
     // console.log('options', options)
   }

package/src/toolbar.js

@@ -4,40 +4,26 @@ import create from './mixin/create'
 import insert from './mixin/insert'
 import offset from './element/offset'
 
-const defaults = {
-  prefix: 'material',
-  class: 'toolbar',
-  tag: 'div'
-}
-
 class Toolbar {
-  static uid = "material-toolbar";
+  static defaults = {
+    prefix: 'material',
+    class: 'toolbar',
+    tag: 'div'
+  }
 
-  /**
-   * Constructor
-   * @param  {Object} options - Component options
-   * @return {Object} Class instance
-   */
   constructor (options) {
     this.init(options)
     this.build()
     this.attach()
-    return this
   }
 
   init (options) {
-    this.options = Object.assign({}, defaults, options || {})
+    this.options = { ...Toolbar.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.element = create(this.options)
 

package/src/tooltip.js

@@ -1,26 +1,13 @@
 import touch from './module/touch'
 
-/**
- * Class Tootip
- * @class
- * @since 0.3.16
- * @example
- * var div = new Tootip({
- *   tag: 'div',
- *   class: 'mydiv',
- * })
- */
-
-const defaults = {
-  targets: '[data-tooltip]',
-  offset: {
-    top: 60
-  },
-  disabled: false
-}
-
 class Tooltip {
-  static uid = "material-tooltip";
+  static defaults = {
+    targets: '[data-tooltip]',
+    offset: {
+      top: 60
+    },
+    disabled: false
+  }
 
   /**
    * The init method of the Button class
@@ -30,15 +17,18 @@ class Tooltip {
    */
   constructor (options) {
     // console.log('constructor')
-    this.options = Object.assign({}, defaults, options || {})
-    // console.log('element options', options)
 
+    this.init(options)
     this.build()
-    this.attachEvent()
+    this.bindEvents()
 
     return this
   }
 
+  init (options) {
+    this.options = { ...Tooltip.defaults, ...options }
+  }
+
   build () {
     const container = this.options.container || document.body
 
@@ -57,7 +47,7 @@ class Tooltip {
     container.appendChild(this.element)
   }
 
-  attachEvent () {
+  bindEvents () {
     // console.log('attach', this.options.targets)
     const targets = document.querySelectorAll(this.options.targets)
 

package/src/tree.js

@@ -3,22 +3,18 @@ import * as css from './module/css'
 import events from './module/events'
 import insert from './mixin/insert'
 
-const defaults = {
-  prefix: 'material',
-  class: 'tree',
-  functions: ['render', 'select'],
-  target: '.item-tree',
-  events: [
-    ['root.click', 'onSelect']
-  ]
-}
-
 class Tree {
-  static uid = "material-tree";
+  static defaults = {
+    prefix: 'material',
+    class: 'tree',
+    functions: ['render', 'select'],
+    target: '.item-tree',
+    events: [
+      ['root.click', 'onSelect']
+    ]
+  }
 
   constructor (options) {
-    this.options = Object.assign({}, defaults, options || {})
-
     this.init()
     this.build()
     events.attach(this.options.events, this)
@@ -27,7 +23,7 @@ class Tree {
   }
 
   init () {
-    // init this
+    this.options = { ...Tree.defaults, ...options }
 
     this.name = this.options.name
     this.filters = []

package/src/view.js

@@ -1,5 +1,5 @@
 import EventEmitter from './mixin/emitter'
-import build from './module/build'
+import build from './mixin/build'
 
 class View extends EventEmitter {
   static defaults = {
@@ -15,7 +15,7 @@ class View extends EventEmitter {
   }
 
   init (options) {
-    this.options = Object.assign({}, View.defaults, options || {})
+    this.options = { ...View.defaults, ...options }
     Object.assign(this, build)
   }
 }

package/src/divider.js

@@ -1,60 +0,0 @@
-import create from './mixin/create'
-import insert from './mixin/insert'
-
-const defaults = {
-  prefix: 'material',
-  class: 'divider',
-  tag: 'span'
-}
-
-/**
- * this class component represent an divider usually in a list
- *
- * @class
- * @extends {Component}
- * @return {Object} The class instance
- * @example new Item(object);
- */
-class Divider {
-  static uid = "material-divider";
-
-  /**
-   * init
-   * @return {Object} The class options
-   */
-  constructor (options) {
-    this.init(options)
-    this.build()
-
-    return this
-  }
-
-  /**
-   * [init description]
-   * @param  {?} options [description]
-   * @return {?}         [description]
-   */
-  init (options) {
-    this.options = Object.assign({}, defaults, options || {})
-
-    Object.assign(this, insert)
-  }
-
-  /**
-   * Build function for item
-   * @return {Object} This class instance
-   */
-  build () {
-    this.element = create(this.options)
-
-    if (this.options.text) {
-      this.element.textContent = this.options.text
-    }
-
-    if (this.options.container) {
-      this.insert(this.options.container)
-    }
-  }
-}
-
-export default Divider

package/src/layout.js

@@ -1,106 +0,0 @@
-import { is as isObject } from './module/object'
-
-/**
- * Layout class for creating and managing UI components.
- */
-class Layout {
-  /**
-   * Constructs a new Layout instance.
-   *
-   * @param {Array} schema - An array defining the structure and components of the layout.
-   * @param {HTMLElement} container - The container in which the layout components are placed.
-   * @param {boolean} [enableMemoization=false] - Flag to enable memoization (not implemented in current version).
-   */
-  constructor (schema, container) {
-    this.components = []
-    // const startTime = Date.now()
-    this.component = this.create(schema, container)
-    // const endTime = Date.now()
-    // console.log(`Execution time: ${endTime - startTime} ms`)
-    return this
-  }
-
-  /**
-   * Recursively creates components based on a provided schema.
-   *
-   * @param {Array} schema - An array of components or sub-schemas.
-   * @param {HTMLElement} container - The container for the current level of components.
-   * @param {Object} [structure={}] - An accumulator object for components, keyed by name.
-   * @param {number} [level=0] - The current level of recursion.
-   * @returns {Object} The structure containing all created components.
-   */
-  create (schema, container, structure, level) {
-    level = level || 0
-    level++
-
-    structure = structure || {}
-    let component = null
-    const fragment = document.createDocumentFragment()
-
-    for (let i = 0; i < schema.length; i++) {
-      var name
-      let options = {}
-
-      if (schema[i] instanceof Object && typeof schema[i] === 'function') {
-        if (isObject(schema[i + 1])) {
-          options = schema[i + 1]
-        } else if (isObject(schema[i + 2])) {
-          options = schema[i + 2]
-        }
-
-        if (typeof schema[i + 1] === 'string') {
-          name = schema[i + 1]
-          if (!schema[i].isElement && !schema[i].isComponent) {
-            options.name = name
-          }
-        }
-
-        component = new schema[i](options)
-
-        const element = component.element || component
-        if (level === 1) structure.element = element
-
-        if (name) {
-          structure[name] = component
-          this.components.push([name, component])
-        }
-
-        if (component) {
-          if (component.insert) component.insert(fragment)
-          else fragment.appendChild(element)
-
-          if (component.onInserted) component.onInserted(fragment)
-        }
-      } else if (Array.isArray(schema[i])) {
-        if (!component) component = container
-        this.create(schema[i], component, structure, level)
-      }
-    }
-
-    if (container && fragment.hasChildNodes()) {
-      const wrapper = container.element || container
-      // console.log('wrapper', wrapper)
-      // console.log('fragment', fragment)
-      wrapper.appendChild(fragment)
-    }
-
-    return structure
-  }
-
-  /**
-   * Retrieves a specific component or the entire component structure.
-   *
-   * This method allows accessing a component from the created layout by its name.
-   * If a name is provided, it returns the component associated with that name.
-   * If no name is provided, it returns the entire component structure.
-   *
-   * @param {string} name - The name of the component to retrieve.
-   * @returns {Object} The requested component or the entire component structure.
-   */
-  get (name) {
-    if (name) return this.component[name]
-    else return this.component
-  }
-}
-
-export default Layout