material 1.0.4 → 3.0.0-next.0

package/src/mixin/emitter.js

@@ -1,23 +0,0 @@
-class EventEmitter {
-  constructor () {
-    this.events = {}
-  }
-
-  on (event, listener) {
-    if (!this.events[event]) {
-      this.events[event] = []
-    }
-    this.events[event].push(listener)
-
-    return this
-  }
-
-  emit (event, ...args) {
-    if (this.events[event]) {
-      this.events[event].forEach(listener => listener.apply(this, args))
-    }
-    return this
-  }
-}
-
-export default EventEmitter

package/src/mixin/events.js

@@ -1,49 +0,0 @@
-export default {
-  addEvent (event, fn) {
-    const element = this.element
-    // avoid memory overhead of new anonymous functions for every event handler that's installed
-    // by using local functions
-    function listenHandler (e) {
-      const ret = fn.apply(this, arguments)
-      if (ret === false) {
-        e.stopPropagation()
-        e.preventDefault()
-      }
-      return (ret)
-    }
-
-    function attachHandler () {
-      // set the this pointer same as addEventListener when fn is called
-      // and make sure the event is passed to the fn also so that works the same too
-      const ret = fn.call(element, window.event)
-      if (ret === false) {
-        window.event.returnValue = false
-        window.event.cancelBubble = true
-      }
-      return (ret)
-    }
-
-    if (element.addEventListener) {
-      element.addEventListener(event, listenHandler, false)
-    } else {
-      element.attachEvent('on' + event, attachHandler)
-    }
-
-    return this
-  },
-
-  removeEvent (event, fn) {
-    const element = this.element
-
-    if (element.removeEventListener) {
-      element.removeEventListener(event, fn, false)
-    } else if (element.detachEvent) {
-      element.detachEvent('on' + event, element[fn.toString() + event])
-      element[fn.toString() + event] = null
-    } else {
-      element['on' + event] = function () {}
-    }
-
-    return this
-  }
-}

package/src/mixin/focus.js

@@ -1,24 +0,0 @@
-import * as css from '../module/css'
-
-export default {
-  /**
-   * focus method
-   * @return {?} [description]
-   */
-  focus () {
-    if (this.disabled === true) return this
-
-    css.add(this.element, 'is-focused')
-    if (this.element.input !== document.activeElement) { this.element.input.focus() }
-    return this
-  },
-
-  /**
-   * blur method
-   * @return {?} [description]
-   */
-  blur () {
-    css.remove(this.element, 'is-focused')
-    return this
-  }
-}

package/src/mixin/icon.js

@@ -1,25 +0,0 @@
-import create from '../element/create'
-import insert from '../element/insert'
-
-/**
- * [_initIcon description]
- * @param  {string} type
- * @return {string}
- */
-function icon (root, svg, options) {
-  if (!svg || !root) {
-    return
-  }
-
-  let position = 'top'
-  if (options && options.type === 'text-icon') {
-    position = 'bottom'
-  }
-
-  const element = create('i', options.class + '-icon')
-  insert(element, root, position)
-
-  element.innerHTML = svg
-}
-
-export default icon

package/src/mixin/init.js

@@ -1,24 +0,0 @@
-import controller from './controller'
-
-function init (instance) {
-  // assign modules
-  modules(instance)
-
-  controller.register(instance)
-
-  return instance
-}
-
-function modules (instance) {
-  const modules = instance.options.modules
-
-  for (let i = 0; i < modules.length; i++) {
-    if (typeof modules[i] === 'function') {
-      modules[i](instance)
-    } else {
-      Object.assign(instance, modules[i])
-    }
-  }
-}
-
-export default init

package/src/mixin/insert.js

@@ -1,49 +0,0 @@
-'use strict'
-
-import dom from '../module/dom'
-
-export default {
-
-  insert (container, context) {
-    const element = this.element
-
-    this.insertElement(element, container, context)
-
-    return this
-  },
-
-  insertElement (element, container, context) {
-    if (container && container.element) {
-      container = container.element
-    }
-
-    this.container = container
-
-    // if (debug) {
-    // console.log('insert', container);
-    // }
-
-    // this.emit('insert');
-
-    context = context || 'bottom'
-
-    const contexts = ['top', 'bottom', 'after', 'before']
-    const methods = ['prepend', 'append', 'after', 'before']
-
-    const index = contexts.indexOf(context)
-    if (index === -1) {
-      return
-    }
-
-    const method = methods[index]
-
-    // this.emit('insert');
-
-    // insert component element to the dom tree using Dom
-    // console.log('dom', method, element);
-    dom[method](container, element)
-    // this.emit('injected');
-    //
-    return element
-  }
-}

package/src/mixin/label.js

@@ -1,19 +0,0 @@
-import create from '../element/create'
-import insert from '../element/insert'
-
-const prefix = 'material'
-
-function label (root, text, options) {
-  text = text || null
-
-  const prefix = options.class || options.prefix
-
-  const label = create('label', prefix + '-label')
-  label.textContent = text
-  label.setAttribute('for', options.name)
-  insert(label, root)
-
-  return label
-}
-
-export default label

package/src/mixin/position.js

@@ -1,91 +0,0 @@
-export default {
-  position (target, position) {
-    // console.log('position', target)
-    target = target || this.options.target
-    position = position || this.options.position
-    const { offsetX = 0, offsetY = 0, align = 'center', vAlign = 'middle' } = position
-
-    if (!target) return this
-
-    // console.log('--- target', target)
-
-    this.options.container = this.options.container || this.element.parentNode
-
-    const caller = target.getBoundingClientRect()
-    const screen = this.options.container.getBoundingClientRect()
-    const element = this.element.getBoundingClientRect()
-
-    let left, top
-
-    switch (align) {
-      case 'left':
-        left = caller.left + caller.width
-        break
-      case 'right':
-        left = caller.left
-        if (left + element.width + offsetX > screen.width) {
-          left = caller.left - element.width + caller.width
-        }
-        break
-      case 'center':
-        left = caller.left + (caller.width / 2) - (element.width / 2)
-
-      default:
-        left = caller.left + (caller.width / 2) - (element.width / 2)
-    }
-
-    // ensure that the element remains within the limits of its container
-
-    // if (left < 0) left = offsetX
-
-    // if (left + element.width + offsetX > screen.width) {
-    //   left = screen.width - element.width - offsetX
-    // }
-
-    if (left < 0) left = offsetX
-
-    if (left + element.width > screen.width) {
-      left = caller.left - element.width
-    }
-
-    // console.log('left', left)
-
-    // left = Math.max(offsetX, Math.min(left, screen.width - element.width - offsetX))
-
-    const scrollY = window.scrollY
-
-    switch (vAlign) {
-      case 'top':
-        top = caller.top + scrollY - element.height
-        break
-      case 'inline':
-        top = caller.top + scrollY
-        break
-      case 'bottom':
-        top = caller.top + caller.height + scrollY
-        break
-      case 'middle':
-      case 'dynamic':
-        if (caller.top + caller.height / 2 < screen.height / 2) {
-          top = caller.bottom + scrollY // Positionner en dessous si dans la moitié supérieure
-        } else {
-          top = caller.top + scrollY - element.height // Positionner au-dessus si dans la moitié inférieure
-        }
-        break
-
-      default:
-        top = caller.top + scrollY + (caller.height / 2) - (element.height / 2)
-    }
-
-    // console.log('screen height', screen.height, element.height, offsetX)
-
-    if (top + element.height + offsetY > screen.height) {
-      top = screen.height - element.height - offsetX
-    }
-
-    this.element.style.left = `${left}px`
-    this.element.style.top = `${top}px`
-
-    return this
-  }
-}

package/src/mixin/settings.js

@@ -1,35 +0,0 @@
-import cookies from '../module/cookies'
-import merge from '../module/merge'
-
-function set (key, value) {
-  const text = cookies.get(key)
-
-  let current = {}
-
-  if (text) {
-    current = JSON.parse(text)
-  }
-
-  console.log('settings value', current, value)
-  // settings = [settings, value].reduce(Object.assign, {});
-  const settings = merge(current, value)
-
-  console.log('settings ' + key, settings)
-
-  cookies.set(key, JSON.stringify(settings))
-}
-
-function get (key) {
-  const json = cookies.get(key)
-
-  if (!json) {
-    return null
-  }
-  const value = JSON.parse(json)
-
-  console.log('settings' + key, value)
-
-  return value
-}
-
-export default { set, get }

package/src/module/attach.js

@@ -1,68 +0,0 @@
-import extract from './extract'
-import last from './last'
-
-const attachModule = {
-  eventHandlers: [], // Utiliser un tableau pour stocker les événements et les gestionnaires
-
-  attach (events) {
-    events = events || this.options.events
-    if (!events) return
-
-    events.forEach(([eventDef, funcDef, option]) => {
-      const e = extract.e(this, eventDef)
-      const isFunction = typeof funcDef === 'function'
-      let f = null
-      let keys = []
-
-      if (!isFunction) {
-        f = extract.f(this, funcDef)
-        keys = funcDef.split('.')
-        keys.pop()
-      }
-
-      const bound = last(keys.join('.'), this)
-
-      let handler = null
-
-      if (isFunction) {
-        handler = funcDef.bind(this)
-      } else if (f && bound) {
-        handler = f.bind(bound)
-      } else {
-        // console.error(`Can't bind function for ${eventDef}`)
-        return
-      }
-
-      if (handler && e && e.element && e.element.addEventListener) {
-        e.element.addEventListener(e.name, handler, option)
-        this.eventHandlers.push({ eventDef, element: e.element, handler })
-      } else if (e && e.element && e.element.on && handler) {
-        e.element.on(e.name, handler)
-        this.eventHandlers.push({ eventDef, element: e.element, handler })
-      } else {
-        // console.error(`Can't attach ${eventDef}`)
-      }
-    })
-
-    return this
-  },
-
-  detach (events) {
-    (events || []).forEach(([eventDef]) => {
-      this.eventHandlers.forEach((handlerObj, index) => {
-        if (handlerObj.eventDef === eventDef) {
-          const { element, handler } = handlerObj
-          if (element.removeEventListener) {
-            element.removeEventListener(eventDef, handler)
-          } else if (element.off) {
-            element.off(eventDef, handler)
-          }
-          delete this.eventHandlers[index]
-        }
-      })
-      this.eventHandlers = this.eventHandlers.filter(Boolean) // Nettoyer les entrées supprimées
-    })
-  }
-}
-
-export default attachModule

package/src/module/attributes.js

@@ -1,24 +0,0 @@
-/**
- * Sets attributes on a DOM element based on provided options.
- *
- * This function iterates over a list of attributes and sets them on the specified element.
- * Special attributes such as 'required', 'disabled', 'multiple', 'checked' are set as boolean attributes,
- * while others are set with their corresponding values from the options.
- *
- * @param {Element} element - The DOM element to which attributes will be applied.
- * @param {Object} options - An object containing the attributes and their values.
- */
-const special = ['required', 'disabled', 'multiple', 'checked']
-
-const attributes = (element, options) => {
-  if (!element || !options?.attributes) return
-
-  options.attributes.forEach(attribute => {
-    if (options[attribute] !== undefined) {
-      const value = special.includes(attribute) ? '' : options[attribute]
-      element.setAttribute(attribute, value)
-    }
-  })
-}
-
-export default attributes

package/src/module/build.js

@@ -1,82 +0,0 @@
-import * as css from './css'
-import dataset from './dataset'
-import { create } from '../module/layout'
-
-/**
- * Builds a UI component instance.
- * @param {object} instance - The component instance to build.
- */
-const build = (instance) => {
-  // console.log('name', instance.constructor.defaults)
-  const { tag = 'div', class: customClass, data, base, container, underlay, layout, icon, label, show } = instance.options
-  const { defaults = {} } = instance.constructor
-
-  instance.element = document.createElement(tag)
-
-  if (defaults.base) css.add(instance.element, defaults.base)
-  if (defaults.class) css.add(instance.element, defaults.class)
-
-  if (customClass !== defaults.class) {
-    css.add(instance.element, customClass)
-  }
-
-  if (data) {
-    dataset(instance.element, data)
-  }
-
-  setupContainer(instance, base, container)
-
-  if (layout) {
-    setupLayout(instance, layout)
-  }
-
-  instance.ui = instance.ui || {}
-
-  if (instance.options.underlay) buildUnderlay(instance, defaults.class)
-  if (icon && !instance.ui.icon) buildIcon(instance)
-  if (label && !instance.ui.label) buildLabel(instance)
-
-  if (show === true && instance.show) instance.show()
-}
-
-const setupContainer = (instance, base, container) => {
-  instance.container = (base === 'view' || base === 'app') ? container || document.body : container
-  if (instance.container) instance.container.appendChild(instance.element)
-}
-
-const setupLayout = (instance, layout) => {
-  instance.layout = create(layout, instance.element)
-  instance.ui = instance.layout.component
-}
-
-function buildUnderlay (instance, name) {
-  if (instance.options.underlay) {
-    instance.underlay = document.createElement('div')
-    instance.underlay.classList.add(name + '-underlay')
-    instance.options.container.appendChild(instance.underlay)
-  }
-}
-
-function buildLabel ({ ui, options, element }) {
-  const { label } = options
-  if (!label) return
-
-  ui.label = document.createElement('label')
-  ui.label.classList.add('label')
-  ui.label.innerHTML = label
-
-  element.appendChild(ui.label)
-}
-
-function buildIcon ({ ui, options, element }) {
-  const { icon } = options
-  if (!icon) return
-
-  ui.icon = document.createElement('i')
-  ui.icon.classList.add('icon')
-  ui.icon.innerHTML = icon
-
-  element.appendChild(ui.icon)
-}
-
-export default build

package/src/module/classify.js

@@ -1,56 +0,0 @@
-import * as css from '../module/css'
-
-function classify (element, options) {
-  css.add(element, options.prefix + '-' + options.class)
-
-  if (options.name) {
-    css.add(element, options.class + '-' + options.name)
-  }
-
-  if (options.type) {
-    // css.add(element, options.class + '-' + options.type)
-    css.add(element, 'type-' + options.type)
-  }
-
-  if (options.color) {
-    css.add(element, options.color + '-color')
-  }
-
-  if (options.css) {
-    css.add(element, options.css)
-  }
-
-  if (options.elevation) {
-    css.add(element, 'elevation-z' + options.elevation)
-  }
-
-  if (options.name) {
-    // console.log('name', options.name)
-    element.dataset.name = options.name
-  }
-
-  if (options.label) {
-    element.title = options.label
-  }
-
-  if (options.style) {
-    const styles = options.style.split(' ')
-    for (let i = 0; i < styles.length; i++) {
-      css.add(element, 'style-' + styles[i])
-    }
-  }
-
-  if (options.data) {
-    for (const property in options.data) {
-      if (options.data.hasOwnProperty(property)) {
-        element.dataset[property] = options.data[property]
-      }
-    }
-  }
-
-  if (options.theme) {
-    element.classList.add(options.theme + '-theme')
-  }
-}
-
-export default classify

package/src/module/clone.js

@@ -1,15 +0,0 @@
-const deepClone = obj => {
-  if (typeof obj !== 'object' || obj === null) {
-    return obj // Return the value if obj is not an object
-  }
-
-  const clone = Array.isArray(obj) ? [] : {}
-
-  Object.entries(obj).forEach(([key, value]) => {
-    clone[key] = deepClone(value)
-  })
-
-  return clone
-}
-
-export default deepClone

package/src/module/controller.js

@@ -1,62 +0,0 @@
-const controller = {
-  register (instance, group) {
-    group = group || 'component'
-    this[group + 's'] = this[group + 's'] || []
-    this[group] = this[group] || {}
-    // console.log('register', component.class);
-    this[group + 's'].push(instance)
-
-    this[group][instance.name] = this[group][instance.name] || []
-
-    this[group][instance.name].push(instance)
-
-    return this
-  },
-
-  subscribe (topic, callback) {
-    this._topics = this._topics || {}
-
-    // _log.debug('subscribe', topic);
-    if (!this._topics.hasOwnProperty(topic)) {
-      this._topics[topic] = []
-    }
-
-    this._topics[topic].push(callback)
-    return true
-  },
-
-  unsunscribe (topic, callback) {
-    this._topics = this._topics || {}
-    // _log.debug('unsubscribe', topic);
-    if (!this._topics.hasOwnProperty(topic)) {
-      return false
-    }
-
-    for (let i = 0, len = this._topics[topic].length; i < len; i++) {
-      if (this._topics[topic][i] === callback) {
-        this._topics[topic].splice(i, 1)
-        return true
-      }
-    }
-
-    return false
-  },
-
-  publish () {
-    this._topics = this._topics || {}
-
-    const args = Array.prototype.slice.call(arguments)
-    const topic = args.shift()
-    // _log.debug('publish', topic);
-    if (!this._topics.hasOwnProperty(topic)) {
-      return false
-    }
-
-    for (let i = 0, len = this._topics[topic].length; i < len; i++) {
-      this._topics[topic][i].apply(undefined, args)
-    }
-    return true
-  }
-}
-
-export default controller

package/src/module/cookie.js

@@ -1,24 +0,0 @@
-const cookie = {
-  set: (name, value, expire = 365) => {
-    const d = new Date()
-    d.setTime(d.getTime() + (expire * 24 * 60 * 60 * 1000))
-    const expires = `expires=${d.toUTCString()}`
-    document.cookie = `${name}=${value};${expires};path=/`
-  },
-  get: name => {
-    const nameEQ = `${name}=`
-    const ca = decodeURIComponent(document.cookie).split(';')
-
-    for (let c of ca) {
-      while (c.charAt(0) === ' ') c = c.substring(1)
-      if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length)
-    }
-
-    return ''
-  },
-  del: name => {
-    document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`
-  }
-}
-
-export default cookie