poulet 0.0.5 → 0.1.0

package/lib/Core/Component/_copyAccessor.js

@@ -1,3 +0,0 @@
-export default function _copyAccessor (key, to, from) {
-  Object.defineProperty(to, key, Object.getOwnPropertyDescriptor(from, key))
-}

package/lib/Core/Component/_defineReactive.js

@@ -1,46 +0,0 @@
-import { forEach, forIn } from 'chirashi'
-
-const _arrayChangingMethods = ['push', 'splice', 'unshift']
-
-export default function _defineReactive (watchers, watchKey, output, key, value) {
-  watchKey += key
-
-  watchers[watchKey] = {}
-
-  Object.defineProperty(output, key, {
-    get: () => {
-      return value
-    },
-    set: newValue => {
-      forIn(watchers[watchKey], (key, options) => options.beforeChange())
-
-      value = newValue
-
-      if (typeof newValue === 'object') {
-        forIn(newValue, _defineReactive.bind(null, watchers, `${watchKey}.`, output[key]))
-      }
-
-      forIn(watchers[watchKey], (key, options) => options.afterChange())
-
-      if (value instanceof Array) {
-        forEach(_arrayChangingMethods, method => {
-          value[method] = function () {
-            forIn(watchers[watchKey], (key, options) => {
-              if (options.deep) options.beforeChange()
-            })
-
-            const ret = Array.prototype[method].apply(this, arguments)
-
-            forIn(watchers[watchKey], (key, options) => {
-              if (options.deep) options.afterChange()
-            })
-
-            return ret
-          }
-        })
-      }
-    }
-  })
-
-  output[key] = value
-}

package/lib/Core/Component/_mergeMixins.js

@@ -1,53 +0,0 @@
-import { forEach, forIn } from 'chirashi'
-
-import * as Mixins from '../../mixins'
-
-function lifeCycleMerger (base, mixin) {
-  if (!base) return mixin
-
-  if (!(base instanceof Array)) base = [base]
-  if (!(mixin instanceof Array)) mixin = [mixin]
-
-  return [...base, ...mixin]
-}
-
-const merger = {
-  mounted: lifeCycleMerger,
-  beforeDestroy: lifeCycleMerger,
-  default (base, mixin) {
-    if (typeof base === 'object' && typeof mixin === 'object') {
-      return {...mixin, ...base}
-    }
-
-    return base || mixin
-  },
-  mixins: base => base
-}
-
-function _mergeOptions (base, mixin) {
-  forIn(mixin, (key, value) => {
-    if (key in merger) {
-      base[key] = merger[key](base[key], value)
-    } else {
-      base[key] = merger.default(base[key], value)
-    }
-  })
-}
-
-export default function _mergeMixins (options) {
-  const result = {...options}
-
-  forEach(result.mixins, (mixin, index) => {
-    if (typeof mixin === 'string') {
-      mixin = Mixins[mixin]
-    }
-
-    if ('mixins' in options) {
-      mixin = _mergeMixins(mixin)
-    }
-
-    _mergeOptions(result, mixin)
-  })
-
-  return result
-}

package/lib/Core/Component/index.js

@@ -1,131 +0,0 @@
-import { forIn, forEach, getElement } from 'chirashi'
-import { uniqueId } from 'lodash'
-
-import get from '../../get'
-
-import _copyAccessor from './_copyAccessor'
-import _defineReactive from './_defineReactive'
-import _mergeMixins from './_mergeMixins'
-
-const lifeCycle = ['mounted', 'beforeDestroy']
-
-export default class Component {
-  constructor (globals = {}, options = {}) {
-    Object.assign(this, globals)
-    this.$options = options
-
-    this.$id = this._generateId()
-
-    this.$options = _mergeMixins(this.$options)
-
-    this.$scope = {}
-
-    this._bindLifeCycle()
-    this._bindData()
-    this._bindMethods()
-  }
-
-  _bindData () {
-    this.$data = {}
-
-    this._watchers = {}
-    forIn(this.$options.data, (key, value) => {
-      _defineReactive(this._watchers, '', this.$data, key, value)
-      _copyAccessor(key, this, this.$data)
-      _copyAccessor(key, this.$scope, this.$data)
-    })
-  }
-
-  _bindMethods () {
-    this.$methods = {}
-    forIn(this.$options.methods, (name, callback) => {
-      this.$methods[name] = callback.bind(this)
-    })
-
-    Object.assign(this, this.$methods)
-    Object.assign(this.$scope, this.$methods)
-  }
-
-  _generateId () {
-    return uniqueId(`${this.$prefix}${this.$options.name}-`)
-  }
-
-  _bindLifeCycle () {
-    forEach(lifeCycle, method => {
-      this[method] = (...args) => {
-        forEach(this.$options[method], callback => callback.apply(this, args))
-      }
-    })
-  }
-
-  $watch (key, callback, options = { deep: false, immediate: false }) {
-    const watcherId = uniqueId(this.$id + '-' + key + '-')
-
-    if (typeof callback === 'string') callback = this.$scope[callback]
-
-    const oldValue = {
-      value: null
-    }
-
-    options.beforeChange = () => {
-      const old = get(this.$scope, key)
-
-      if (old instanceof Array) {
-        oldValue.value = [...old]
-      } else if (typeof old === 'object') {
-        oldValue.value = {...old}
-      } else {
-        oldValue.value = old
-      }
-    }
-
-    options.afterChange = () => {
-      callback(get(this.$scope, key), oldValue.value)
-    }
-
-    if (key in this._watchers) {
-      this._watchers[key][watcherId] = options
-
-      if (options.deep) {
-        const keyRoot = key + '.'
-        if (typeof get(this.$scope, key) === 'object') {
-          forIn(this._watchers, (watchKey, watchers) => {
-            if (watchKey.indexOf(keyRoot) === 0) {
-              this._watchers[watchKey][watcherId] = options
-            }
-          })
-        }
-      }
-    }
-
-    if (options.immediate) {
-      options.afterChange()
-    }
-
-    return () => {
-      if (options.deep) {
-        if (typeof get(this.$scope, key) === 'object') {
-          forIn(this._watchers, (watchKey, watchers) => {
-            delete this._watchers[watchKey][watcherId]
-          })
-        }
-      } else {
-        if (key in this._watchers) {
-          delete this._watchers[key][watcherId]
-        }
-      }
-    }
-  }
-
-  $mount (el) {
-    this.$el = getElement(el)
-
-    this.$el[this.$marker] = this.$id
-
-    this.mounted(el)
-  }
-
-  $destroy () {
-    this.beforeDestroy()
-  }
-}

package/lib/Core/Directive/_stringParser.js

@@ -1,61 +0,0 @@
-import { forEach } from 'chirashi'
-
-const stringRegex = /([\w-_.\s]+)/g
-const quote = /["']/g
-
-export default function stringParser (input) {
-  const props = []
-  let inquote = false
-  let inobject = false
-  let leftobject = false
-  let nbQuotes = 0
-
-  const segments = input.split(/\s/g)
-  forEach(segments, (segment, index) => {
-    const quotes = segment.match(quote)
-    if (!inquote && quotes) {
-      inquote = true
-    }
-
-    if (!inobject && segment.indexOf('{') !== -1) {
-      inobject = true
-      leftobject = true
-    }
-
-    if (inobject && segment.indexOf(',') === 0) {
-      leftobject = true
-    }
-
-    if (!inquote && !leftobject) {
-      let variable = segment.match(stringRegex)
-
-      if (variable) {
-        variable = variable[0]
-
-        if (isNaN(+variable)) {
-          props.push(variable)
-          segments[index] = segment.replace(variable, `$scope.${variable}`)
-        }
-      }
-    }
-
-    if (quotes) nbQuotes += quotes.length
-    if (quotes && nbQuotes % 2 === 0) {
-      inquote = false
-    }
-
-    if (inobject && segment.indexOf(':') !== -1) {
-      leftobject = false
-    }
-
-    if (inobject && segment.indexOf(',') !== -1) {
-      leftobject = true
-    }
-
-    if (inobject && segment.indexOf('}') !== -1) {
-      inobject = false
-    }
-  })
-
-  return { template: segments.join(' '), props }
-}

package/lib/Core/Directive/index.js

@@ -1,75 +0,0 @@
-import { forEach, getElement, parents } from 'chirashi'
-import { uniqueId } from 'lodash'
-
-import _stringParser from './_stringParser'
-
-const lifeCycle = ['bind', 'update', 'unbind']
-
-export default class Directive {
-  constructor (globals = {}, options = {}) {
-    Object.assign(this, globals)
-    this.$options = options
-
-    this.$update = this.$update.bind(this)
-
-    this.$id = this._generateId()
-
-    this._bindLifeCycle()
-  }
-
-  _generateId () {
-    return uniqueId(`${this.$prefix}${this.$options.name}-`)
-  }
-
-  _bindLifeCycle () {
-    forEach(lifeCycle, method => {
-      this[method] = (...args) => {
-        forEach(this.$options[method], callback => callback.apply(this, args))
-      }
-    })
-  }
-
-  _eval (string) {
-    return (0, eval)(`(function ($scope) { return ${string}; })`)(this.$scope)
-  }
-
-  $bind (el, option) {
-    this.$el = getElement(el)
-
-    this.$option = _stringParser(option)
-
-    const closests = [this.$el, ...parents(this.$el)]
-    let parent
-    let i = 0
-    while ((parent = closests[i++]) && !(this.$marker in parent)) {}
-
-    this.$component = this.$components[parent[this.$marker]]
-
-    if (this.bind) this.bind(el)
-
-    this.unwatchers = []
-    if (this.$option.props.length) {
-      forEach(this.$option.props, prop => {
-        this.unwatchers.push(this.$component.$watch(prop, this.$update, { immediate: true }))
-      })
-    } else {
-      this.$update()
-    }
-  }
-
-  $update () {
-    if (this.update) this.update(this._eval(this.$option.template))
-  }
-
-  $unbind () {
-    forEach(this.unwatchers, unwatch => {
-      unwatch()
-    })
-
-    if (this.unbind) this.unbind()
-  }
-
-  get $scope () {
-    return this.$component.$scope
-  }
-}

package/lib/Core/Observer.js

@@ -1,26 +0,0 @@
-import { forEach } from 'chirashi'
-
-export default class Observer {
-  constructor (domElement) {
-    this._observer = new MutationObserver(this._update.bind(this))
-
-    this._observer.observe(domElement, {
-      childList: true,
-      subtree: true
-    })
-
-    this._listeners = []
-  }
-
-  on (callback) {
-    this._listeners.push(callback)
-  }
-
-  off (callback) {
-    this._listeners.splice(this._listeners.indexOf(callback), 1)
-  }
-
-  _update () {
-    forEach(this._listeners, listener => listener())
-  }
-}

package/lib/Core/index.js

@@ -1,140 +0,0 @@
-import { kebabCase } from 'lodash'
-import { forEach, forIn, getAttr, closest, find } from 'chirashi'
-
-import Observer from './Observer'
-import Component from './Component'
-import Directive from './Directive'
-import * as Directives from '../Directives'
-
-const defaultsGlobals = {
-  $prefix: 'p-'
-}
-
-const defaults = {
-  name: 'root'
-}
-
-export default class Core extends Component {
-  constructor (globals = {}, options = {}) {
-    globals = {...defaultsGlobals, ...globals}
-    options = {...defaults, ...options}
-
-    super(globals, options)
-
-    this.$components = {
-      [this.$id]: this
-    }
-
-    this.$directives = {}
-
-    this.$gobals = {
-      ...globals,
-      ...options,
-      $root: this,
-      $components: this.$components,
-      $directives: this.$directives
-    }
-
-    this.$gobals.$marker = this.$marker = `_${this.$prefix}id`
-    this.$directivesMarker = `_${this.$prefix}directives`
-
-    this._components = []
-    this._directives = []
-
-    forIn(Directives, this.directive.bind(this))
-  }
-
-  component (name, options) {
-    name = kebabCase(name)
-
-    const selector = 'selector' in options ? options.selector : `[${this.$prefix}${name}]`
-
-    this._components.push({
-      selector,
-      options: {
-        name,
-        selector,
-        ...options
-      }
-    })
-  }
-
-  directive (name, options) {
-    name = kebabCase(name)
-
-    const selector = 'selector' in options ? options.selector : `[${this.$prefix}${name}]`
-
-    this._directives.push({
-      selector,
-      options: {
-        name,
-        selector,
-        ...options
-      }
-    })
-  }
-
-  $mount (selector) {
-    super.$mount(selector)
-
-    this._observer = new Observer(this.$el)
-    this._observer.on(this._domChanged.bind(this))
-
-    this._domChanged()
-  }
-
-  _domChanged () {
-    this._unbindComponents()
-    this._unbindDirectives()
-    this._bindComponents()
-    this._bindDirectives()
-  }
-
-  _unbindComponents () {
-    forIn(this.$components, (id, component) => {
-      if (!closest(component.$el, document.body)) {
-        component.$destroy()
-        delete this.$components[id]
-      }
-    })
-  }
-
-  _bindComponents () {
-    forEach(this._components, component => {
-      forEach(find(this.$el, component.selector), el => {
-        if (this.$marker in el) return
-
-        const createdComponent = new Component(this.$gobals, component.options)
-        createdComponent.$mount(el)
-        this.$components[createdComponent.$id] = createdComponent
-      })
-    })
-  }
-
-  _unbindDirectives () {
-    forIn(this.$directives, (id, directive) => {
-      if (!closest(directive.$el, document.body)) {
-        directive.$unbind()
-        delete this.$directives[id]
-      }
-    })
-  }
-
-  _bindDirectives () {
-    forEach(this._directives, directive => {
-      forEach(find(this.$el, directive.selector), el => {
-        if (!(this.$directivesMarker in el)) {
-          el[this.$directivesMarker] = []
-        } else if (el[this.$directivesMarker].indexOf(directive.options.name) !== -1) {
-          return
-        }
-
-        el[this.$directivesMarker].push(directive.options.name)
-
-        const createdDirective = new Directive(this.$gobals, directive.options)
-        createdDirective.$bind(el, getAttr(el, `${this.$gobals.$prefix}${directive.options.name}`))
-        this.$directives[createdDirective.$id] = createdDirective
-      })
-    })
-  }
-}

package/lib/Directives/Class.js

@@ -1,26 +0,0 @@
-import { addClass, removeClass } from 'chirashi'
-
-export default {
-  bind () {
-    this.currentClasses = []
-  },
-
-  update (value) {
-    let newClasses
-
-    if (typeof value === 'string') {
-      newClasses = [value]
-    } else if ('length' in value) {
-      newClasses = value
-    } else if (typeof value === 'object') {
-      newClasses = Object.keys(value).filter(className => value[className])
-    }
-
-    const removeClasses = this.currentClasses.filter(className => newClasses.indexOf(className) === -1)
-
-    if (newClasses.length) addClass(this.$el, ...newClasses)
-    if (removeClasses.length) removeClass(this.$el, ...removeClasses)
-
-    this.currentClasses = newClasses
-  }
-}

package/lib/Directives/Html.js

@@ -1,7 +0,0 @@
-import { setProp } from 'chirashi'
-
-export default {
-  update (innerHTML) {
-    setProp(this.$el, { innerHTML })
-  }
-}

package/lib/Directives/Model.js

@@ -1,57 +0,0 @@
-import { on, getProp, setProp } from 'chirashi'
-import set from '../set'
-
-export default {
-  bind (el) {
-    this.type = getProp(el, 'type')
-
-    this.inputChanged = () => {
-      let newValue
-      switch (this.type) {
-        case 'checkbox':
-          newValue = getProp(this.$el, 'checked')
-          break
-
-        default:
-          newValue = getProp(this.$el, 'value')
-      }
-
-      if (newValue === this.currentValue) return
-
-      this.currentValue = newValue
-
-      set(this.$scope, this.model, this.currentValue)
-    }
-
-    this.offObj = on(el, {
-      'keyup blur change': this.inputChanged
-    })
-  },
-
-  update (newValue) {
-    if (newValue === this.currentValue) return
-
-    this.model = this.$option.props[0]
-
-    this.currentValue = newValue
-
-    switch (this.type) {
-      case 'checkbox':
-        setProp(this.$el, { checked: newValue })
-        break
-
-      case 'radio':
-        const selector = `${this.$options.selector.slice(0, -1)}="${this.model}"]`
-        setProp(selector, { checked: false })
-        setProp(`${selector}[value="${newValue}"]`, { checked: true })
-        break
-
-      default:
-        setProp(this.$el, { value: newValue })
-    }
-  },
-
-  unbind () {
-    this.offObj.off()
-  }
-}

package/lib/Directives/On.js

@@ -1,13 +0,0 @@
-import { on } from 'chirashi'
-
-export default {
-  unbind () {
-    if (this.off) this.off()
-  },
-
-  update (options) {
-    if (this.off) this.off()
-
-    on(this.$el, options)
-  }
-}

package/lib/Directives/Show.js

@@ -1,9 +0,0 @@
-import { setStyleProp } from 'chirashi'
-
-export default {
-  update (value) {
-    setStyleProp(this.$el, {
-      display: value ? 'block' : 'none'
-    })
-  }
-}

package/lib/Directives/Style.js

@@ -1,7 +0,0 @@
-import { setStyleProp } from 'chirashi'
-
-export default {
-  update (options) {
-    setStyleProp(this.$el, options)
-  }
-}

package/lib/Directives/Text.js

@@ -1,7 +0,0 @@
-import { setProp } from 'chirashi'
-
-export default {
-  update (textContent) {
-    setProp(this.$el, { textContent })
-  }
-}

package/lib/Directives/index.js

@@ -1,6 +0,0 @@
-export { default as Class } from './Class'
-export { default as Html } from './Html'
-export { default as Model } from './Model'
-export { default as On } from './On'
-export { default as Show } from './Show'
-export { default as Text } from './Text'

package/lib/get.js

@@ -1,10 +0,0 @@
-export default function (obj, key) {
-  const keys = key.split('.')
-  key = keys.pop()
-  const n = keys.length
-  for (let i = 0; i < n; ++i) {
-    obj = obj[keys[i]]
-  }
-
-  return obj[key]
-}

package/lib/index.js

@@ -1,6 +0,0 @@
-import Core from './Core'
-import get from './get'
-import set from './set'
-
-const Poulet = Object.assign(Core, { get, set })
-export default Poulet