From f2358deae8dd09b0394647652ffcad12c8b0b809 Mon Sep 17 00:00:00 2001 From: mouse Date: Thu, 17 Dec 2015 18:26:22 +0100 Subject: [PATCH] added headers and sections refactored build functions --- README.md | 33 ++++++- demo/demo.js | 65 ++++++++----- demo/demoDist.js | 182 ++++++++++++++++++++++++----------- demo/index.html | 2 +- dist/flounder-structure.css | 31 ++++++ dist/flounder.amd.js | 146 +++++++++++++++++++--------- dist/flounder.amd.min.js | 4 +- dist/flounder.jquery.js | 146 +++++++++++++++++++--------- dist/flounder.jquery.min.js | 4 +- dist/flounder.js | 146 +++++++++++++++++++--------- dist/flounder.microbe.js | 146 +++++++++++++++++++--------- dist/flounder.microbe.min.js | 4 +- dist/flounder.min.js | 4 +- dist/flounder.react.js | 146 +++++++++++++++++++--------- dist/flounder.react.min.js | 6 +- package.json | 2 +- src/core/classes.js | 2 + src/core/flounder.jsx | 108 +++++++++++++++++---- 18 files changed, 841 insertions(+), 336 deletions(-) diff --git a/README.md b/README.md index 113bcc9..d096771 100755 --- a/README.md +++ b/README.md @@ -117,24 +117,45 @@ selectbox data must be passed as an array of objects description : 'a longer description of this element', // optional, string extraClass : 'extra--classname', // optional, string disabled : false // optional, boolean - } + }, + ... ] ``` -or an array. +or a simple array of strings. The passed text will be both the text and the value. There would be no description in this case ``` [ 'value 1', 'value 2', - 'value 3' + 'value 3', + ... ] ``` -in the case of an array, the passed text will be both the text and the value. There would be no description in this case +or, if you want section headers. You can even add uncatagorized things intermingled + +``` +[ + { + header : header1, + data : [ option1, option2, ... ] + }, + { + text : 'probably the string you want to see', + value : 'return value', + description : 'a longer description of this element' + }, + { + header : header2, + data : [ option1, option2, ... ] + }, + ... +] +``` -all extra properties passed that are not shown here will be added as data attributes for the sake of reference later. The data can be accessed in the init (before building) as this.data if they need reformatting or filtering. +all extra properties passed in an option that are not shown here will be added as data attributes for the sake of reference later. The data can be accessed in the init (before building) as this.data if they need reformatting or filtering. API @@ -297,6 +318,8 @@ Change Log + programmatically setting value or index no longer triggers onSelect + changed rebuildOptions to rebuildSelect for clarity + changed this.options to this.data for clarity ++ added the ability to build sections with headers ++ refactored some build functions 0.2.1 diff --git a/demo/demo.js b/demo/demo.js index ec7332a..17fdc35 100755 --- a/demo/demo.js +++ b/demo/demo.js @@ -5,13 +5,13 @@ import Flounder from '../src/core/flounder.jsx'; window.Flounder = Flounder; -var _slice = Array.prototype.slice; +let _slice = Array.prototype.slice; /** * example data object * * @type {Array} */ -var data = [ +let data = [ { cssClass : 'select-filters', id : 'All', @@ -45,22 +45,40 @@ var data = [ new Flounder( '.vanilla--input--tags', { placeholder : 'placeholders!', - onInit : function() + onInit : function() { - var res = []; - data.forEach( function( dataObj ) + let res = []; + + let top = { + header : 'top', + data : [] + }; + + let bottom = { + header : 'bottom', + data : [] + }; + + data.forEach( function( dataObj, i ) { - res.push( { + res = { text : dataObj.text, value : dataObj.id, extraClass : 'vantar' + Math.ceil( Math.random() * 10 ) - } ); - } ); + }; - this.data = res; - }, + if ( i % 2 === 0 ) + { + top.data.push( res ); + } + else + { + bottom.data.push( res ); + } + } ); - multiple : true + this.data = [ top, bottom ]; + } } ); @@ -72,7 +90,7 @@ new Flounder( document.getElementById( 'vanilla--input' ), { onInit : function() { - var res = []; + let res = []; data.forEach( function( dataObj, i ) { res.push( { @@ -91,10 +109,10 @@ new Flounder( document.getElementById( 'vanilla--input' ), { onSelect : function( e ) { - var selected = _slice.call( this.refs.select.selectedOptions ); + let selected = _slice.call( this.refs.select.selectedOptions ); selected = selected.map( el => el.index ); - var rand = function( dataObj, i ) + let rand = function( dataObj, i ) { if ( selected.indexOf( i ) !== -1 ) { @@ -102,13 +120,13 @@ new Flounder( document.getElementById( 'vanilla--input' ), { } else { - var value = Math.ceil( Math.random() * 10 ); + let value = Math.ceil( Math.random() * 10 ); return { text : value, value : value, index : i }; } }; let _o = this.data.map( rand ); - console.log( _o ); + this.data = _o; this.rebuildSelect( _o ); } @@ -140,7 +158,7 @@ ReactDOM.render( React.createElement( FlounderReact, { onInit : function() { - var res = []; + let res = []; data.forEach( function( dataObj ) { res.push( { @@ -155,24 +173,25 @@ ReactDOM.render( React.createElement( FlounderReact, { /** - * react multi-Flounder without tags attached to an div + * react Flounder attached to an div */ ReactDOM.render( React.createElement( FlounderReact, { defaultValue : 'tag', onInit : function() { - var res = []; + let res = []; data.forEach( function( dataObj ) { res.push( { text : dataObj.text, - value : dataObj.id + value : dataObj.id, + description : dataObj.text + ' - ' + dataObj.text } ); } ); this.data = res; - } } ), document.getElementById( 'react--multiple' ) + } } ), document.getElementById( 'react--span' ) ); @@ -188,7 +207,7 @@ ReactDOM.render( React.createElement( FlounderReact, { onInit : function() { - var res = []; + let res = []; data.forEach( function( dataObj, i ) { res.push( { @@ -220,7 +239,7 @@ requirejs( [ 'flounder' ], function( Flounder ) onInit : function() { - var res = []; + let res = []; data.forEach( function( dataObj ) { res.push( { diff --git a/demo/demoDist.js b/demo/demoDist.js index 9132da7..7f3e816 100755 --- a/demo/demoDist.js +++ b/demo/demoDist.js @@ -59,18 +59,33 @@ new _srcCoreFlounderJsx2['default']('.vanilla--input--tags', { onInit: function onInit() { var res = []; - data.forEach(function (dataObj) { - res.push({ + + var top = { + header: 'top', + data: [] + }; + + var bottom = { + header: 'bottom', + data: [] + }; + + data.forEach(function (dataObj, i) { + res = { text: dataObj.text, value: dataObj.id, extraClass: 'vantar' + Math.ceil(Math.random() * 10) - }); - }); + }; - this.data = res; - }, + if (i % 2 === 0) { + top.data.push(res); + } else { + bottom.data.push(res); + } + }); - multiple: true + this.data = [top, bottom]; + } }); /** @@ -112,7 +127,7 @@ new _srcCoreFlounderJsx2['default'](document.getElementById('vanilla--input'), { }; var _o = this.data.map(rand); - console.log(_o); + this.data = _o; this.rebuildSelect(_o); } @@ -153,7 +168,7 @@ _reactDom2['default'].render(_react2['default'].createElement(_srcWrappersFlound } }), document.getElementById('react--multiple--tags')); /** - * react multi-Flounder without tags attached to an div + * react Flounder attached to an div */ _reactDom2['default'].render(_react2['default'].createElement(_srcWrappersFlounderReactJsx.FlounderReact, { defaultValue: 'tag', @@ -163,12 +178,13 @@ _reactDom2['default'].render(_react2['default'].createElement(_srcWrappersFlound data.forEach(function (dataObj) { res.push({ text: dataObj.text, - value: dataObj.id + value: dataObj.id, + description: dataObj.text + ' - ' + dataObj.text }); }); this.data = res; - } }), document.getElementById('react--multiple')); + } }), document.getElementById('react--span')); /** * react multi-Flounder with description attached to div @@ -19494,6 +19510,7 @@ var classes = { DESCRIPTION: 'flounder__option--description', DISABLED: 'flounder__disabled', DISABLED_OPTION: 'flounder__disabled--option', + HEADER: 'flounder__header', HIDDEN: 'flounder--hidden', HIDDEN_IOS: 'flounder--hidden--ios', LIST: 'flounder__list', @@ -19505,6 +19522,7 @@ var classes = { OPTION: 'flounder__option', OPTION_TAG: 'flounder--option--tag', OPTIONS_WRAPPER: 'flounder__list--wrapper', + SECTION: 'flounder__section', SELECTED: 'flounder__option--selected', SELECTED_HIDDEN: 'flounder__option--selected--hidden', SELECTED_DISPLAYED: 'flounder__option--selected--displayed', @@ -19838,15 +19856,28 @@ var Flounder = (function () { }, { key: 'buildData', value: function buildData(defaultValue, _data, optionsList, select) { - var _this3 = this; - _data = _data || []; + var index = 0; var data = []; var selectOptions = []; var constructElement = this.constructElement; var addOptionDescription = this.addOptionDescription; + var selectedClass = this.selectedClass; + var escapeHTML = this.escapeHTML; + var addClass = this.addClass; + var selectRef = this.refs.select; - _data.forEach(function (dataObj, i) { + /** + * ## buildDiv + * + * builds an individual div tag for a flounder dropdown + * + * @param {Object} dataObj [description] + * @param {Number} i index + * + * @return {DOMElement} + */ + var buildDiv = function buildDiv(dataObj, i) { if (typeof dataObj !== 'object') { dataObj = { text: dataObj, @@ -19855,7 +19886,7 @@ var Flounder = (function () { } dataObj.index = i; - var extraClass = i === defaultValue.index ? ' ' + _this3.selectedClass : ''; + var extraClass = i === defaultValue.index ? ' ' + selectedClass : ''; var res = { className: _classes3['default'].OPTION + extraClass, @@ -19868,36 +19899,79 @@ var Flounder = (function () { } } - data[i] = constructElement(res); - var escapedText = _this3.escapeHTML(dataObj.text); - data[i].innerHTML = escapedText; - optionsList.appendChild(data[i]); + var data = constructElement(res); + var escapedText = escapeHTML(dataObj.text); + data.innerHTML = escapedText; if (dataObj.description) { - addOptionDescription(data[i], dataObj.description); + addOptionDescription(data, dataObj.description); } - data[i].className += dataObj.extraClass ? ' ' + dataObj.extraClass : ''; + data.className += dataObj.extraClass ? ' ' + dataObj.extraClass : ''; - if (!_this3.refs.select) { - selectOptions[i] = constructElement({ tagname: 'option', + return data; + }; + + /** + * ## buildOption + * + * builds an individual option tag for a flounder dropdown + * + * @param {Object} dataObj [description] + * @param {Number} i index + * + * @return {DOMElement} + */ + var buildOption = function buildOption(dataObj, i) { + var selectOption = undefined; + + if (!selectRef) { + selectOption = constructElement({ tagname: 'option', className: _classes3['default'].OPTION_TAG, value: dataObj.value }); - selectOptions[i].innerHTML = escapedText; - select.appendChild(selectOptions[i]); + var escapedText = escapeHTML(dataObj.text); + selectOption.innerHTML = escapedText; + select.appendChild(selectOption); } else { var selectChild = select.children[i]; - - selectOptions[i] = selectChild; + selectOption = selectChild; selectChild.setAttribute('value', selectChild.value); } if (i === defaultValue.index) { - selectOptions[i].selected = true; + selectOption.selected = true; + } + + if (selectOption.getAttribute('disabled')) { + addClass(data[i], _classes3['default'].DISABLED_OPTION); } - if (selectOptions[i].getAttribute('disabled')) { - _this3.addClass(data[i], _classes3['default'].DISABLED_OPTION); + return selectOption; + }; + + _data.forEach(function (dataObj) { + if (dataObj.header) { + (function () { + var section = constructElement({ tagname: 'div', + className: _classes3['default'].SECTION }); + var header = constructElement({ tagname: 'div', + className: _classes3['default'].HEADER }); + header.textContent = dataObj.header; + section.appendChild(header); + optionsList.appendChild(section); + + dataObj.data.forEach(function (_dataObj) { + data[index] = buildDiv(_dataObj, index); + section.appendChild(data[index]); + selectOptions[index] = buildOption(_dataObj, index); + index++; + }); + })(); + } else { + data[index] = buildDiv(dataObj, index); + optionsList.appendChild(data[index]); + selectOptions[index] = buildOption(dataObj, index); + index++; } }); @@ -20171,7 +20245,7 @@ var Flounder = (function () { key: 'fuzzySearch', value: function fuzzySearch(e) // disclaimer: not actually fuzzy { - var _this4 = this; + var _this3 = this; e.preventDefault(); var keyCode = e.keyCode; @@ -20180,13 +20254,13 @@ var Flounder = (function () { (function () { var term = e.target.value.toLowerCase(); - _this4.refs.data.forEach(function (dataObj) { + _this3.refs.data.forEach(function (dataObj) { var text = dataObj.innerHTML.toLowerCase(); if (term !== '' && text.indexOf(term) === -1) { - _this4.addClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this3.addClass(dataObj, _classes3['default'].SEARCH_HIDDEN); } else { - _this4.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this3.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); } }); })(); @@ -20206,10 +20280,10 @@ var Flounder = (function () { }, { key: 'fuzzySearchReset', value: function fuzzySearchReset() { - var _this5 = this; + var _this4 = this; this.refs.data.forEach(function (dataObj) { - _this5.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this4.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); }); this.refs.search.value = ''; @@ -20304,16 +20378,16 @@ var Flounder = (function () { }, { key: 'initSelectBox', value: function initSelectBox(wrapper) { - var _this6 = this; + var _this5 = this; var target = this.target; var select = undefined; if (target.tagName === 'SELECT') { (function () { - _this6.addClass(target, _classes3['default'].SELECT_TAG); - _this6.addClass(target, _classes3['default'].HIDDEN); - _this6.refs.select = target; + _this5.addClass(target, _classes3['default'].SELECT_TAG); + _this5.addClass(target, _classes3['default'].HIDDEN); + _this5.refs.select = target; var data = [], selectOptions = []; @@ -20326,12 +20400,12 @@ var Flounder = (function () { }); }); - _this6.data = data; - _this6.target = target.parentNode; - _this6.refs.selectOptions = selectOptions; + _this5.data = data; + _this5.target = target.parentNode; + _this5.refs.selectOptions = selectOptions; - select = _this6.refs.select; - _this6.addClass(select, _classes3['default'].HIDDEN); + select = _this5.refs.select; + _this5.addClass(select, _classes3['default'].HIDDEN); })(); } else { select = this.constructElement({ tagname: 'select', className: _classes3['default'].SELECT_TAG + ' ' + _classes3['default'].HIDDEN }); @@ -20407,11 +20481,11 @@ var Flounder = (function () { }, { key: 'removeOptionsListeners', value: function removeOptionsListeners() { - var _this7 = this; + var _this6 = this; this.refs.data.forEach(function (dataObj) { if (dataObj.tagName === 'DIV') { - dataObj.removeEventListener('click', _this7.clickSet); + dataObj.removeEventListener('click', _this6.clickSet); } }); } @@ -20496,12 +20570,12 @@ var Flounder = (function () { }, { key: 'removeSelectedClass', value: function removeSelectedClass(data) { - var _this8 = this; + var _this7 = this; data = data || this.refs.data; data.forEach(function (dataObj, i) { - _this8.removeClass(dataObj, _this8.selectedClass); + _this7.removeClass(dataObj, _this7.selectedClass); }); } @@ -20515,12 +20589,12 @@ var Flounder = (function () { }, { key: 'removeSelectedValue', value: function removeSelectedValue(data) { - var _this9 = this; + var _this8 = this; data = data || this.refs.data; data.forEach(function (_d, i) { - _this9.refs.select[i].selected = false; + _this8.refs.select[i].selected = false; }); } @@ -20686,7 +20760,7 @@ var Flounder = (function () { selectTag.selectedIndex = index; var hasClass = this.hasClass; - if (hasClass(data[index], _classes3['default'].HIDDEN) && hasClass(data[index], _classes3['default'].SELECTED_HIDDEN)) { + if (hasClass(data[index], _classes3['default'].HIDDEN) || hasClass(data[index], _classes3['default'].SELECTED_HIDDEN) || hasClass(data[index], _classes3['default'].DISABLED)) { this.setKeypress(e); } } @@ -20808,7 +20882,7 @@ var Flounder = (function () { }, { key: 'setTextMultiTagIndent', value: function setTextMultiTagIndent() { - var _this10 = this; + var _this9 = this; var search = this.refs.search; var offset = this.defaultTextIndent; @@ -20816,7 +20890,7 @@ var Flounder = (function () { if (search) { var _els = document.getElementsByClassName(_classes3['default'].MULTIPLE_SELECT_TAG); _els.each(function (i, e) { - offset += _this10.getActualWidth(e); + offset += _this9.getActualWidth(e); }); search.style.textIndent = offset + 'px'; diff --git a/demo/index.html b/demo/index.html index 2f292ef..3a236a8 100755 --- a/demo/index.html +++ b/demo/index.html @@ -42,7 +42,7 @@
React from Span () - +
React from Div (multiple, no-tags, desciption) diff --git a/dist/flounder-structure.css b/dist/flounder-structure.css index 9d0ed4a..60f645a 100755 --- a/dist/flounder-structure.css +++ b/dist/flounder-structure.css @@ -93,6 +93,37 @@ +/* -------------------------------------------------------------------------- */ +/* FLOUNDER - sections */ +/* -------------------------------------------------------------------------- */ +.flounder__section, .flounder__header +{ + cursor: auto; + pointer-events: none; +} + +.flounder__section +{ + text-indent: 5px; + margin: 5px 0 3px 2px; + border: 1px solid #ddd; + padding-top: 2px; +} + + +.flounder__header +{ + color: #777; +} + +.flounder__section .flounder__option +{ + cursor: pointer; + pointer-events: auto; +} + + + /* -------------------------------------------------------------------------- */ /* FLOUNDER - hover */ /* -------------------------------------------------------------------------- */ diff --git a/dist/flounder.amd.js b/dist/flounder.amd.js index 1eec309..f3974da 100644 --- a/dist/flounder.amd.js +++ b/dist/flounder.amd.js @@ -1,5 +1,5 @@ /*! - * Flounder JavaScript Styleable Selectbox v0.2.1 + * Flounder JavaScript Styleable Selectbox v0.2.2 * https://github.com/sociomantic/flounder * * Copyright 2015 Sociomantic Labs and other contributors @@ -257,6 +257,7 @@ var classes = { DESCRIPTION: 'flounder__option--description', DISABLED: 'flounder__disabled', DISABLED_OPTION: 'flounder__disabled--option', + HEADER: 'flounder__header', HIDDEN: 'flounder--hidden', HIDDEN_IOS: 'flounder--hidden--ios', LIST: 'flounder__list', @@ -268,6 +269,7 @@ var classes = { OPTION: 'flounder__option', OPTION_TAG: 'flounder--option--tag', OPTIONS_WRAPPER: 'flounder__list--wrapper', + SECTION: 'flounder__section', SELECTED: 'flounder__option--selected', SELECTED_HIDDEN: 'flounder__option--selected--hidden', SELECTED_DISPLAYED: 'flounder__option--selected--displayed', @@ -601,15 +603,28 @@ var Flounder = (function () { }, { key: 'buildData', value: function buildData(defaultValue, _data, optionsList, select) { - var _this3 = this; - _data = _data || []; + var index = 0; var data = []; var selectOptions = []; var constructElement = this.constructElement; var addOptionDescription = this.addOptionDescription; + var selectedClass = this.selectedClass; + var escapeHTML = this.escapeHTML; + var addClass = this.addClass; + var selectRef = this.refs.select; - _data.forEach(function (dataObj, i) { + /** + * ## buildDiv + * + * builds an individual div tag for a flounder dropdown + * + * @param {Object} dataObj [description] + * @param {Number} i index + * + * @return {DOMElement} + */ + var buildDiv = function buildDiv(dataObj, i) { if (typeof dataObj !== 'object') { dataObj = { text: dataObj, @@ -618,7 +633,7 @@ var Flounder = (function () { } dataObj.index = i; - var extraClass = i === defaultValue.index ? ' ' + _this3.selectedClass : ''; + var extraClass = i === defaultValue.index ? ' ' + selectedClass : ''; var res = { className: _classes3['default'].OPTION + extraClass, @@ -631,36 +646,79 @@ var Flounder = (function () { } } - data[i] = constructElement(res); - var escapedText = _this3.escapeHTML(dataObj.text); - data[i].innerHTML = escapedText; - optionsList.appendChild(data[i]); + var data = constructElement(res); + var escapedText = escapeHTML(dataObj.text); + data.innerHTML = escapedText; if (dataObj.description) { - addOptionDescription(data[i], dataObj.description); + addOptionDescription(data, dataObj.description); } - data[i].className += dataObj.extraClass ? ' ' + dataObj.extraClass : ''; + data.className += dataObj.extraClass ? ' ' + dataObj.extraClass : ''; + + return data; + }; - if (!_this3.refs.select) { - selectOptions[i] = constructElement({ tagname: 'option', + /** + * ## buildOption + * + * builds an individual option tag for a flounder dropdown + * + * @param {Object} dataObj [description] + * @param {Number} i index + * + * @return {DOMElement} + */ + var buildOption = function buildOption(dataObj, i) { + var selectOption = undefined; + + if (!selectRef) { + selectOption = constructElement({ tagname: 'option', className: _classes3['default'].OPTION_TAG, value: dataObj.value }); - selectOptions[i].innerHTML = escapedText; - select.appendChild(selectOptions[i]); + var escapedText = escapeHTML(dataObj.text); + selectOption.innerHTML = escapedText; + select.appendChild(selectOption); } else { var selectChild = select.children[i]; - - selectOptions[i] = selectChild; + selectOption = selectChild; selectChild.setAttribute('value', selectChild.value); } if (i === defaultValue.index) { - selectOptions[i].selected = true; + selectOption.selected = true; + } + + if (selectOption.getAttribute('disabled')) { + addClass(data[i], _classes3['default'].DISABLED_OPTION); } - if (selectOptions[i].getAttribute('disabled')) { - _this3.addClass(data[i], _classes3['default'].DISABLED_OPTION); + return selectOption; + }; + + _data.forEach(function (dataObj) { + if (dataObj.header) { + (function () { + var section = constructElement({ tagname: 'div', + className: _classes3['default'].SECTION }); + var header = constructElement({ tagname: 'div', + className: _classes3['default'].HEADER }); + header.textContent = dataObj.header; + section.appendChild(header); + optionsList.appendChild(section); + + dataObj.data.forEach(function (_dataObj) { + data[index] = buildDiv(_dataObj, index); + section.appendChild(data[index]); + selectOptions[index] = buildOption(_dataObj, index); + index++; + }); + })(); + } else { + data[index] = buildDiv(dataObj, index); + optionsList.appendChild(data[index]); + selectOptions[index] = buildOption(dataObj, index); + index++; } }); @@ -934,7 +992,7 @@ var Flounder = (function () { key: 'fuzzySearch', value: function fuzzySearch(e) // disclaimer: not actually fuzzy { - var _this4 = this; + var _this3 = this; e.preventDefault(); var keyCode = e.keyCode; @@ -943,13 +1001,13 @@ var Flounder = (function () { (function () { var term = e.target.value.toLowerCase(); - _this4.refs.data.forEach(function (dataObj) { + _this3.refs.data.forEach(function (dataObj) { var text = dataObj.innerHTML.toLowerCase(); if (term !== '' && text.indexOf(term) === -1) { - _this4.addClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this3.addClass(dataObj, _classes3['default'].SEARCH_HIDDEN); } else { - _this4.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this3.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); } }); })(); @@ -969,10 +1027,10 @@ var Flounder = (function () { }, { key: 'fuzzySearchReset', value: function fuzzySearchReset() { - var _this5 = this; + var _this4 = this; this.refs.data.forEach(function (dataObj) { - _this5.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this4.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); }); this.refs.search.value = ''; @@ -1067,16 +1125,16 @@ var Flounder = (function () { }, { key: 'initSelectBox', value: function initSelectBox(wrapper) { - var _this6 = this; + var _this5 = this; var target = this.target; var select = undefined; if (target.tagName === 'SELECT') { (function () { - _this6.addClass(target, _classes3['default'].SELECT_TAG); - _this6.addClass(target, _classes3['default'].HIDDEN); - _this6.refs.select = target; + _this5.addClass(target, _classes3['default'].SELECT_TAG); + _this5.addClass(target, _classes3['default'].HIDDEN); + _this5.refs.select = target; var data = [], selectOptions = []; @@ -1089,12 +1147,12 @@ var Flounder = (function () { }); }); - _this6.data = data; - _this6.target = target.parentNode; - _this6.refs.selectOptions = selectOptions; + _this5.data = data; + _this5.target = target.parentNode; + _this5.refs.selectOptions = selectOptions; - select = _this6.refs.select; - _this6.addClass(select, _classes3['default'].HIDDEN); + select = _this5.refs.select; + _this5.addClass(select, _classes3['default'].HIDDEN); })(); } else { select = this.constructElement({ tagname: 'select', className: _classes3['default'].SELECT_TAG + ' ' + _classes3['default'].HIDDEN }); @@ -1170,11 +1228,11 @@ var Flounder = (function () { }, { key: 'removeOptionsListeners', value: function removeOptionsListeners() { - var _this7 = this; + var _this6 = this; this.refs.data.forEach(function (dataObj) { if (dataObj.tagName === 'DIV') { - dataObj.removeEventListener('click', _this7.clickSet); + dataObj.removeEventListener('click', _this6.clickSet); } }); } @@ -1259,12 +1317,12 @@ var Flounder = (function () { }, { key: 'removeSelectedClass', value: function removeSelectedClass(data) { - var _this8 = this; + var _this7 = this; data = data || this.refs.data; data.forEach(function (dataObj, i) { - _this8.removeClass(dataObj, _this8.selectedClass); + _this7.removeClass(dataObj, _this7.selectedClass); }); } @@ -1278,12 +1336,12 @@ var Flounder = (function () { }, { key: 'removeSelectedValue', value: function removeSelectedValue(data) { - var _this9 = this; + var _this8 = this; data = data || this.refs.data; data.forEach(function (_d, i) { - _this9.refs.select[i].selected = false; + _this8.refs.select[i].selected = false; }); } @@ -1449,7 +1507,7 @@ var Flounder = (function () { selectTag.selectedIndex = index; var hasClass = this.hasClass; - if (hasClass(data[index], _classes3['default'].HIDDEN) && hasClass(data[index], _classes3['default'].SELECTED_HIDDEN)) { + if (hasClass(data[index], _classes3['default'].HIDDEN) || hasClass(data[index], _classes3['default'].SELECTED_HIDDEN) || hasClass(data[index], _classes3['default'].DISABLED)) { this.setKeypress(e); } } @@ -1571,7 +1629,7 @@ var Flounder = (function () { }, { key: 'setTextMultiTagIndent', value: function setTextMultiTagIndent() { - var _this10 = this; + var _this9 = this; var search = this.refs.search; var offset = this.defaultTextIndent; @@ -1579,7 +1637,7 @@ var Flounder = (function () { if (search) { var _els = document.getElementsByClassName(_classes3['default'].MULTIPLE_SELECT_TAG); _els.each(function (i, e) { - offset += _this10.getActualWidth(e); + offset += _this9.getActualWidth(e); }); search.style.textIndent = offset + 'px'; diff --git a/dist/flounder.amd.min.js b/dist/flounder.amd.min.js index e8033e9..41bb201 100644 --- a/dist/flounder.amd.min.js +++ b/dist/flounder.amd.min.js @@ -1,2 +1,2 @@ -/*! Flounder v0.2.1 | (c) 2015 Sociomantic Labs | https://github.com/sociomantic/flounder/license */ -!function e(t,s,i){function n(l,r){if(!s[l]){if(!t[l]){var o="function"==typeof require&&require;if(!r&&o)return o(l,!0);if(a)return a(l,!0);var u=new Error("Cannot find module '"+l+"'");throw u.code="MODULE_NOT_FOUND",u}var c=s[l]={exports:{}};t[l][0].call(c.exports,function(e){var s=t[l][1][e];return n(s?s:e)},c,c.exports,e,t,s,i)}return s[l].exports}for(var a="function"==typeof require&&require,l=0;ln;n++)s=i[n],s.selected&&t.push(s);return t},getSelectedValues:function(){return this.getSelectedOptions().map(function(e){return e.value})},rebuildSelect:function(e){var t=this,s=this.refs,i=s.select.selectedOptions;i=Array.prototype.slice.call(i).map(function(e){return e.value}),this.removeOptionsListeners(),s.select.innerHTML="",s.optionsList.innerHTML="";var a=s.select;s.select=!1;var l=this.buildData(this._default,e,s.optionsList,a),r=n(l,2);s.data=r[0],s.selectOptions=r[1],s.select=a,this.removeSelectedValue(),this.removeSelectedClass(),s.selectOptions.forEach(function(e,n){var a=i.indexOf(e.value);-1!==a&&(i.splice(a,1),e.selected=!0,t.addClass(s.data[n],t.selectedClass))}),this.addOptionsListeners()},setIndex:function(e,t){var s=this.refs;if("string"!=typeof e&&e.length){var i=this.setIndex;return e.map(i)}var n=s.data[e];if(n){var a=this.hasClass(s.wrapper,"open");return this.toggleList(a?"close":"open"),this.___forceMultiple=t,this.___programmaticClick=!0,n.click(),n}return null},setValue:function(e,t){if("string"!=typeof e&&e.length){var s=this.setValue;return e.map(s)}return e=this.refs.select.querySelector('[value="'+e+'"]'),e?this.setIndex(e.index,t):null}};s["default"]=r,t.exports=s["default"]},{"./classes":2}],2:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={ARROW:"flounder__arrow",DESCRIPTION:"flounder__option--description",DISABLED:"flounder__disabled",DISABLED_OPTION:"flounder__disabled--option",HIDDEN:"flounder--hidden",HIDDEN_IOS:"flounder--hidden--ios",LIST:"flounder__list",MAIN:"flounder",MAIN_WRAPPER:"flounder--wrapper flounder__input--select",MULTI_TAG_LIST:"flounder__multi--tag--list",MULTIPLE_SELECT_TAG:"flounder__multiple--select--tag",MULTIPLE_TAG_CLOSE:"flounder__multiple__tag__close",OPTION:"flounder__option",OPTION_TAG:"flounder--option--tag",OPTIONS_WRAPPER:"flounder__list--wrapper",SELECTED:"flounder__option--selected",SELECTED_HIDDEN:"flounder__option--selected--hidden",SELECTED_DISPLAYED:"flounder__option--selected--displayed",SEARCH:"flounder__input--search",SEARCH_HIDDEN:"flounder--search--hidden",SELECT_TAG:"flounder--select--tag"};s["default"]=i,t.exports=s["default"]},{}],3:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={classes:{flounder:"",hidden:"flounder--hidden",selected:"flounder__option--selected",wrapper:""},defaultTextIndent:0,multiple:!1,multipleTags:!0,multipleMessage:"(Multiple Items Selected)",onClose:function(){},onComponentDidMount:function(){},onInit:function(){},onOpen:function(){},onSelect:function(){},options:[],placeholder:"Please choose an option",search:!1};s["default"]=i,t.exports=s["default"]},{}],4:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(s,"__esModule",{value:!0});var a=function(){function e(e,t){var s=[],i=!0,n=!1,a=void 0;try{for(var l,r=e[Symbol.iterator]();!(i=(l=r.next()).done)&&(s.push(l.value),!t||s.length!==t);i=!0);}catch(o){n=!0,a=o}finally{try{!i&&r["return"]&&r["return"]()}finally{if(n)throw a}}return s}return function(t,s){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,s);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),l=function(){function e(e,t){for(var s=0;sl?r=0:0>r&&(r=l),n.selectedIndex=r;var o=this.hasClass;o(a[r],c["default"].HIDDEN)&&o(a[r],c["default"].SELECTED_HIDDEN)&&this.setKeypress(e)}},{key:"setSelectValue",value:function(e,t){var s=this.refs,i=void 0;t?(this.setSelectValueClick(t),i=!0):(i=this.checkSelect(e),i&&this.setSelectValueButton(e)),i&&(this.displaySelected(s.selected,s),this.___programmaticClick?this.___programmaticClick=!1:this.onSelect(t,this.getSelectedValues()))}},{key:"setSelectValueButton",value:function(){var e=this.refs,t=e.data,s=(e.select,this.selectedClass),i=void 0;this.removeSelectedClass(t);var n=this.getSelectedOptions(),a=n[0];a&&(i=t[a.index],this.addClass(i,s),this.scrollTo(i))}},{key:"setSelectValueClick",value:function(e){var t=this.multiple,s=this.refs,i=this.selectedClass,n=void 0,a=void 0;t&&(!t||this.multipleTags||e[this.multiSelect])||this.___forceMultiple||this.deselectAll(),this.___forceMultiple=!1;var l=e.target;this.toggleClass(l,i),n=l.getAttribute("data-index"),a=s.selectOptions[n],a.selected=a.selected===!0?!1:!0}},{key:"setTextMultiTagIndent",value:function(){var e=this,t=this.refs.search,s=this.defaultTextIndent;if(t){var i=document.getElementsByClassName(c["default"].MULTIPLE_SELECT_TAG);i.each(function(t,i){s+=e.getActualWidth(i)}),t.style.textIndent=s+"px"}}},{key:"showElement",value:function(e){this.removeClass(e,c["default"].HIDDEN)}},{key:"toggleList",value:function(e,t){var s=this.refs,i=s.optionsListWrapper,n=s.wrapper,a=this.hasClass;"open"===t||"close"!==t&&a(i,c["default"].HIDDEN)?(this.toggleList.justOpened=!0,this.toggleOpen(e,i,s,n)):"close"!==t&&a(i,c["default"].HIDDEN)||(this.toggleList.justOpened=!1,this.toggleClosed(e,i,s,n))}},{key:"toggleOpen",value:function(e,t,s,i){if(this.addSelectKeyListener(),(!this.isIos||this.multipleTags===!0&&this.multiple===!0)&&(this.showElement(t),this.addClass(i,"open"),document.querySelector("html").addEventListener("click",this.catchBodyClick),document.querySelector("html").addEventListener("touchend",this.catchBodyClick)),!this.multiple){var n=s.select.selectedIndex,a=s.data[n];a&&this.scrollTo(a)}this.props.search&&s.search.focus(),this.onOpen(e,this.getSelectedValues())}},{key:"toggleClosed",value:function(e,t,s,i){this.hideElement(t),this.removeSelectKeyListener(),this.removeClass(i,"open");var n=document.querySelector("html");n.removeEventListener("click",this.catchBodyClick),n.removeEventListener("touchend",this.catchBodyClick),this.props.search&&this.fuzzySearchReset(),s.flounder.focus(),this.onClose(e,this.getSelectedValues())}}]),e}();h["default"].extendClass(v,h["default"],p["default"]),s["default"]=v,t.exports=s["default"]},{"./api":1,"./classes":2,"./defaults":3,"./utils":5}],5:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={addClass:function(e,t){var s=e.className,n=s.length;i.hasClass(e,t)||s.slice(0,t.length+1)===t+" "||s.slice(n-t.length-1,n)===" "+t||(e.className+=" "+t)},attachAttributes:function(e,t){for(var s in t)-1!==s.indexOf("data-")?e.setAttribute(s,t[s]):e[s]=t[s]},constructElement:function(e){var t=document.createElement(e.tagname||"div");return i.attachAttributes(t,e),t},extendClass:function(e){e=e.prototype;for(var t=function(t){for(var s in t)Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s])},s=arguments.length,i=Array(s>1?s-1:0),n=1;s>n;n++)i[n-1]=arguments[n];for(var a=0,l=i.length;l>a;a++){var r=i[a];t(r)}return e},escapeHTML:function(e){return String(e).replace(/&/g,"&").replace(//g,">").replace(/"/g,""")},hasClass:function(e,t){var s=e.className,i=new RegExp("(^"+t+" )|( "+t+"$)|( "+t+" )|(^"+t+"$)");return!!s.match(i)},iosVersion:function(){return/iPad|iPhone|iPod/.test(navigator.platform)?window.indexedDB?"8+":window.SpeechSynthesisUtterance?"7":window.webkitAudioContext?"6":"5-":!1},removeClass:function(e,t){var s=e.className,i=s.length,n=t.length;s.slice(0,n+1)===t+" "&&(e.className=s.slice(n+1,i)),s.slice(i-n-1,i)===" "+t&&(e.className=s.slice(0,i-n-1)),e.className=e.className.trim()},scrollTo:function(e){var t=e.parentNode.parentNode,s=e.offsetHeight,i=t.scrollTop,n=t.scrollTop+t.offsetHeight-e.offsetHeight,a=e.offsetTop;i>a?t.scrollTop=a-.5*s:a>n&&(t.scrollTop=a-t.offsetHeight+1.5*s)},setPlatform:function(){var e=this.isOsx=-1===window.navigator.platform.indexOf("Mac")?!1:!0;this.isIos=this.iosVersion(),this.multiSelect=e?"metaKey":"ctrlKey"},toggleClass:function(e,t){var s=i.addClass,n=i.removeClass;i.hasClass(e,t)?n(e,t):s(e,t)}};s["default"]=i,t.exports=s["default"]},{}],6:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}var n=e("../core/flounder.jsx"),a=i(n);define("flounder",[],function(){return a["default"]})},{"../core/flounder.jsx":4}]},{},[6]); \ No newline at end of file +/*! Flounder v0.2.2 | (c) 2015 Sociomantic Labs | https://github.com/sociomantic/flounder/license */ +!function e(t,s,i){function a(l,r){if(!s[l]){if(!t[l]){var o="function"==typeof require&&require;if(!r&&o)return o(l,!0);if(n)return n(l,!0);var u=new Error("Cannot find module '"+l+"'");throw u.code="MODULE_NOT_FOUND",u}var c=s[l]={exports:{}};t[l][0].call(c.exports,function(e){var s=t[l][1][e];return a(s?s:e)},c,c.exports,e,t,s,i)}return s[l].exports}for(var n="function"==typeof require&&require,l=0;la;a++)s=i[a],s.selected&&t.push(s);return t},getSelectedValues:function(){return this.getSelectedOptions().map(function(e){return e.value})},rebuildSelect:function(e){var t=this,s=this.refs,i=s.select.selectedOptions;i=Array.prototype.slice.call(i).map(function(e){return e.value}),this.removeOptionsListeners(),s.select.innerHTML="",s.optionsList.innerHTML="";var n=s.select;s.select=!1;var l=this.buildData(this._default,e,s.optionsList,n),r=a(l,2);s.data=r[0],s.selectOptions=r[1],s.select=n,this.removeSelectedValue(),this.removeSelectedClass(),s.selectOptions.forEach(function(e,a){var n=i.indexOf(e.value);-1!==n&&(i.splice(n,1),e.selected=!0,t.addClass(s.data[a],t.selectedClass))}),this.addOptionsListeners()},setIndex:function(e,t){var s=this.refs;if("string"!=typeof e&&e.length){var i=this.setIndex;return e.map(i)}var a=s.data[e];if(a){var n=this.hasClass(s.wrapper,"open");return this.toggleList(n?"close":"open"),this.___forceMultiple=t,this.___programmaticClick=!0,a.click(),a}return null},setValue:function(e,t){if("string"!=typeof e&&e.length){var s=this.setValue;return e.map(s)}return e=this.refs.select.querySelector('[value="'+e+'"]'),e?this.setIndex(e.index,t):null}};s["default"]=r,t.exports=s["default"]},{"./classes":2}],2:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={ARROW:"flounder__arrow",DESCRIPTION:"flounder__option--description",DISABLED:"flounder__disabled",DISABLED_OPTION:"flounder__disabled--option",HEADER:"flounder__header",HIDDEN:"flounder--hidden",HIDDEN_IOS:"flounder--hidden--ios",LIST:"flounder__list",MAIN:"flounder",MAIN_WRAPPER:"flounder--wrapper flounder__input--select",MULTI_TAG_LIST:"flounder__multi--tag--list",MULTIPLE_SELECT_TAG:"flounder__multiple--select--tag",MULTIPLE_TAG_CLOSE:"flounder__multiple__tag__close",OPTION:"flounder__option",OPTION_TAG:"flounder--option--tag",OPTIONS_WRAPPER:"flounder__list--wrapper",SECTION:"flounder__section",SELECTED:"flounder__option--selected",SELECTED_HIDDEN:"flounder__option--selected--hidden",SELECTED_DISPLAYED:"flounder__option--selected--displayed",SEARCH:"flounder__input--search",SEARCH_HIDDEN:"flounder--search--hidden",SELECT_TAG:"flounder--select--tag"};s["default"]=i,t.exports=s["default"]},{}],3:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={classes:{flounder:"",hidden:"flounder--hidden",selected:"flounder__option--selected",wrapper:""},defaultTextIndent:0,multiple:!1,multipleTags:!0,multipleMessage:"(Multiple Items Selected)",onClose:function(){},onComponentDidMount:function(){},onInit:function(){},onOpen:function(){},onSelect:function(){},options:[],placeholder:"Please choose an option",search:!1};s["default"]=i,t.exports=s["default"]},{}],4:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(s,"__esModule",{value:!0});var n=function(){function e(e,t){var s=[],i=!0,a=!1,n=void 0;try{for(var l,r=e[Symbol.iterator]();!(i=(l=r.next()).done)&&(s.push(l.value),!t||s.length!==t);i=!0);}catch(o){a=!0,n=o}finally{try{!i&&r["return"]&&r["return"]()}finally{if(a)throw n}}return s}return function(t,s){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,s);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),l=function(){function e(e,t){for(var s=0;sl?r=0:0>r&&(r=l),a.selectedIndex=r;var o=this.hasClass;(o(n[r],c["default"].HIDDEN)||o(n[r],c["default"].SELECTED_HIDDEN)||o(n[r],c["default"].DISABLED))&&this.setKeypress(e)}},{key:"setSelectValue",value:function(e,t){var s=this.refs,i=void 0;t?(this.setSelectValueClick(t),i=!0):(i=this.checkSelect(e),i&&this.setSelectValueButton(e)),i&&(this.displaySelected(s.selected,s),this.___programmaticClick?this.___programmaticClick=!1:this.onSelect(t,this.getSelectedValues()))}},{key:"setSelectValueButton",value:function(){var e=this.refs,t=e.data,s=(e.select,this.selectedClass),i=void 0;this.removeSelectedClass(t);var a=this.getSelectedOptions(),n=a[0];n&&(i=t[n.index],this.addClass(i,s),this.scrollTo(i))}},{key:"setSelectValueClick",value:function(e){var t=this.multiple,s=this.refs,i=this.selectedClass,a=void 0,n=void 0;t&&(!t||this.multipleTags||e[this.multiSelect])||this.___forceMultiple||this.deselectAll(),this.___forceMultiple=!1;var l=e.target;this.toggleClass(l,i),a=l.getAttribute("data-index"),n=s.selectOptions[a],n.selected=n.selected===!0?!1:!0}},{key:"setTextMultiTagIndent",value:function(){var e=this,t=this.refs.search,s=this.defaultTextIndent;if(t){var i=document.getElementsByClassName(c["default"].MULTIPLE_SELECT_TAG);i.each(function(t,i){s+=e.getActualWidth(i)}),t.style.textIndent=s+"px"}}},{key:"showElement",value:function(e){this.removeClass(e,c["default"].HIDDEN)}},{key:"toggleList",value:function(e,t){var s=this.refs,i=s.optionsListWrapper,a=s.wrapper,n=this.hasClass;"open"===t||"close"!==t&&n(i,c["default"].HIDDEN)?(this.toggleList.justOpened=!0,this.toggleOpen(e,i,s,a)):"close"!==t&&n(i,c["default"].HIDDEN)||(this.toggleList.justOpened=!1,this.toggleClosed(e,i,s,a))}},{key:"toggleOpen",value:function(e,t,s,i){if(this.addSelectKeyListener(),(!this.isIos||this.multipleTags===!0&&this.multiple===!0)&&(this.showElement(t),this.addClass(i,"open"),document.querySelector("html").addEventListener("click",this.catchBodyClick),document.querySelector("html").addEventListener("touchend",this.catchBodyClick)),!this.multiple){var a=s.select.selectedIndex,n=s.data[a];n&&this.scrollTo(n)}this.props.search&&s.search.focus(),this.onOpen(e,this.getSelectedValues())}},{key:"toggleClosed",value:function(e,t,s,i){this.hideElement(t),this.removeSelectKeyListener(),this.removeClass(i,"open");var a=document.querySelector("html");a.removeEventListener("click",this.catchBodyClick),a.removeEventListener("touchend",this.catchBodyClick),this.props.search&&this.fuzzySearchReset(),s.flounder.focus(),this.onClose(e,this.getSelectedValues())}}]),e}();h["default"].extendClass(v,h["default"],p["default"]),s["default"]=v,t.exports=s["default"]},{"./api":1,"./classes":2,"./defaults":3,"./utils":5}],5:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={addClass:function(e,t){var s=e.className,a=s.length;i.hasClass(e,t)||s.slice(0,t.length+1)===t+" "||s.slice(a-t.length-1,a)===" "+t||(e.className+=" "+t)},attachAttributes:function(e,t){for(var s in t)-1!==s.indexOf("data-")?e.setAttribute(s,t[s]):e[s]=t[s]},constructElement:function(e){var t=document.createElement(e.tagname||"div");return i.attachAttributes(t,e),t},extendClass:function(e){e=e.prototype;for(var t=function(t){for(var s in t)Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s])},s=arguments.length,i=Array(s>1?s-1:0),a=1;s>a;a++)i[a-1]=arguments[a];for(var n=0,l=i.length;l>n;n++){var r=i[n];t(r)}return e},escapeHTML:function(e){return String(e).replace(/&/g,"&").replace(//g,">").replace(/"/g,""")},hasClass:function(e,t){var s=e.className,i=new RegExp("(^"+t+" )|( "+t+"$)|( "+t+" )|(^"+t+"$)");return!!s.match(i)},iosVersion:function(){return/iPad|iPhone|iPod/.test(navigator.platform)?window.indexedDB?"8+":window.SpeechSynthesisUtterance?"7":window.webkitAudioContext?"6":"5-":!1},removeClass:function(e,t){var s=e.className,i=s.length,a=t.length;s.slice(0,a+1)===t+" "&&(e.className=s.slice(a+1,i)),s.slice(i-a-1,i)===" "+t&&(e.className=s.slice(0,i-a-1)),e.className=e.className.trim()},scrollTo:function(e){var t=e.parentNode.parentNode,s=e.offsetHeight,i=t.scrollTop,a=t.scrollTop+t.offsetHeight-e.offsetHeight,n=e.offsetTop;i>n?t.scrollTop=n-.5*s:n>a&&(t.scrollTop=n-t.offsetHeight+1.5*s)},setPlatform:function(){var e=this.isOsx=-1===window.navigator.platform.indexOf("Mac")?!1:!0;this.isIos=this.iosVersion(),this.multiSelect=e?"metaKey":"ctrlKey"},toggleClass:function(e,t){var s=i.addClass,a=i.removeClass;i.hasClass(e,t)?a(e,t):s(e,t)}};s["default"]=i,t.exports=s["default"]},{}],6:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}var a=e("../core/flounder.jsx"),n=i(a);define("flounder",[],function(){return n["default"]})},{"../core/flounder.jsx":4}]},{},[6]); \ No newline at end of file diff --git a/dist/flounder.jquery.js b/dist/flounder.jquery.js index bddb7de..12790ae 100644 --- a/dist/flounder.jquery.js +++ b/dist/flounder.jquery.js @@ -1,5 +1,5 @@ /*! - * Flounder JavaScript Styleable Selectbox v0.2.1 + * Flounder JavaScript Styleable Selectbox v0.2.2 * https://github.com/sociomantic/flounder * * Copyright 2015 Sociomantic Labs and other contributors @@ -257,6 +257,7 @@ var classes = { DESCRIPTION: 'flounder__option--description', DISABLED: 'flounder__disabled', DISABLED_OPTION: 'flounder__disabled--option', + HEADER: 'flounder__header', HIDDEN: 'flounder--hidden', HIDDEN_IOS: 'flounder--hidden--ios', LIST: 'flounder__list', @@ -268,6 +269,7 @@ var classes = { OPTION: 'flounder__option', OPTION_TAG: 'flounder--option--tag', OPTIONS_WRAPPER: 'flounder__list--wrapper', + SECTION: 'flounder__section', SELECTED: 'flounder__option--selected', SELECTED_HIDDEN: 'flounder__option--selected--hidden', SELECTED_DISPLAYED: 'flounder__option--selected--displayed', @@ -601,15 +603,28 @@ var Flounder = (function () { }, { key: 'buildData', value: function buildData(defaultValue, _data, optionsList, select) { - var _this3 = this; - _data = _data || []; + var index = 0; var data = []; var selectOptions = []; var constructElement = this.constructElement; var addOptionDescription = this.addOptionDescription; + var selectedClass = this.selectedClass; + var escapeHTML = this.escapeHTML; + var addClass = this.addClass; + var selectRef = this.refs.select; - _data.forEach(function (dataObj, i) { + /** + * ## buildDiv + * + * builds an individual div tag for a flounder dropdown + * + * @param {Object} dataObj [description] + * @param {Number} i index + * + * @return {DOMElement} + */ + var buildDiv = function buildDiv(dataObj, i) { if (typeof dataObj !== 'object') { dataObj = { text: dataObj, @@ -618,7 +633,7 @@ var Flounder = (function () { } dataObj.index = i; - var extraClass = i === defaultValue.index ? ' ' + _this3.selectedClass : ''; + var extraClass = i === defaultValue.index ? ' ' + selectedClass : ''; var res = { className: _classes3['default'].OPTION + extraClass, @@ -631,36 +646,79 @@ var Flounder = (function () { } } - data[i] = constructElement(res); - var escapedText = _this3.escapeHTML(dataObj.text); - data[i].innerHTML = escapedText; - optionsList.appendChild(data[i]); + var data = constructElement(res); + var escapedText = escapeHTML(dataObj.text); + data.innerHTML = escapedText; if (dataObj.description) { - addOptionDescription(data[i], dataObj.description); + addOptionDescription(data, dataObj.description); } - data[i].className += dataObj.extraClass ? ' ' + dataObj.extraClass : ''; + data.className += dataObj.extraClass ? ' ' + dataObj.extraClass : ''; + + return data; + }; - if (!_this3.refs.select) { - selectOptions[i] = constructElement({ tagname: 'option', + /** + * ## buildOption + * + * builds an individual option tag for a flounder dropdown + * + * @param {Object} dataObj [description] + * @param {Number} i index + * + * @return {DOMElement} + */ + var buildOption = function buildOption(dataObj, i) { + var selectOption = undefined; + + if (!selectRef) { + selectOption = constructElement({ tagname: 'option', className: _classes3['default'].OPTION_TAG, value: dataObj.value }); - selectOptions[i].innerHTML = escapedText; - select.appendChild(selectOptions[i]); + var escapedText = escapeHTML(dataObj.text); + selectOption.innerHTML = escapedText; + select.appendChild(selectOption); } else { var selectChild = select.children[i]; - - selectOptions[i] = selectChild; + selectOption = selectChild; selectChild.setAttribute('value', selectChild.value); } if (i === defaultValue.index) { - selectOptions[i].selected = true; + selectOption.selected = true; + } + + if (selectOption.getAttribute('disabled')) { + addClass(data[i], _classes3['default'].DISABLED_OPTION); } - if (selectOptions[i].getAttribute('disabled')) { - _this3.addClass(data[i], _classes3['default'].DISABLED_OPTION); + return selectOption; + }; + + _data.forEach(function (dataObj) { + if (dataObj.header) { + (function () { + var section = constructElement({ tagname: 'div', + className: _classes3['default'].SECTION }); + var header = constructElement({ tagname: 'div', + className: _classes3['default'].HEADER }); + header.textContent = dataObj.header; + section.appendChild(header); + optionsList.appendChild(section); + + dataObj.data.forEach(function (_dataObj) { + data[index] = buildDiv(_dataObj, index); + section.appendChild(data[index]); + selectOptions[index] = buildOption(_dataObj, index); + index++; + }); + })(); + } else { + data[index] = buildDiv(dataObj, index); + optionsList.appendChild(data[index]); + selectOptions[index] = buildOption(dataObj, index); + index++; } }); @@ -934,7 +992,7 @@ var Flounder = (function () { key: 'fuzzySearch', value: function fuzzySearch(e) // disclaimer: not actually fuzzy { - var _this4 = this; + var _this3 = this; e.preventDefault(); var keyCode = e.keyCode; @@ -943,13 +1001,13 @@ var Flounder = (function () { (function () { var term = e.target.value.toLowerCase(); - _this4.refs.data.forEach(function (dataObj) { + _this3.refs.data.forEach(function (dataObj) { var text = dataObj.innerHTML.toLowerCase(); if (term !== '' && text.indexOf(term) === -1) { - _this4.addClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this3.addClass(dataObj, _classes3['default'].SEARCH_HIDDEN); } else { - _this4.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this3.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); } }); })(); @@ -969,10 +1027,10 @@ var Flounder = (function () { }, { key: 'fuzzySearchReset', value: function fuzzySearchReset() { - var _this5 = this; + var _this4 = this; this.refs.data.forEach(function (dataObj) { - _this5.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this4.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); }); this.refs.search.value = ''; @@ -1067,16 +1125,16 @@ var Flounder = (function () { }, { key: 'initSelectBox', value: function initSelectBox(wrapper) { - var _this6 = this; + var _this5 = this; var target = this.target; var select = undefined; if (target.tagName === 'SELECT') { (function () { - _this6.addClass(target, _classes3['default'].SELECT_TAG); - _this6.addClass(target, _classes3['default'].HIDDEN); - _this6.refs.select = target; + _this5.addClass(target, _classes3['default'].SELECT_TAG); + _this5.addClass(target, _classes3['default'].HIDDEN); + _this5.refs.select = target; var data = [], selectOptions = []; @@ -1089,12 +1147,12 @@ var Flounder = (function () { }); }); - _this6.data = data; - _this6.target = target.parentNode; - _this6.refs.selectOptions = selectOptions; + _this5.data = data; + _this5.target = target.parentNode; + _this5.refs.selectOptions = selectOptions; - select = _this6.refs.select; - _this6.addClass(select, _classes3['default'].HIDDEN); + select = _this5.refs.select; + _this5.addClass(select, _classes3['default'].HIDDEN); })(); } else { select = this.constructElement({ tagname: 'select', className: _classes3['default'].SELECT_TAG + ' ' + _classes3['default'].HIDDEN }); @@ -1170,11 +1228,11 @@ var Flounder = (function () { }, { key: 'removeOptionsListeners', value: function removeOptionsListeners() { - var _this7 = this; + var _this6 = this; this.refs.data.forEach(function (dataObj) { if (dataObj.tagName === 'DIV') { - dataObj.removeEventListener('click', _this7.clickSet); + dataObj.removeEventListener('click', _this6.clickSet); } }); } @@ -1259,12 +1317,12 @@ var Flounder = (function () { }, { key: 'removeSelectedClass', value: function removeSelectedClass(data) { - var _this8 = this; + var _this7 = this; data = data || this.refs.data; data.forEach(function (dataObj, i) { - _this8.removeClass(dataObj, _this8.selectedClass); + _this7.removeClass(dataObj, _this7.selectedClass); }); } @@ -1278,12 +1336,12 @@ var Flounder = (function () { }, { key: 'removeSelectedValue', value: function removeSelectedValue(data) { - var _this9 = this; + var _this8 = this; data = data || this.refs.data; data.forEach(function (_d, i) { - _this9.refs.select[i].selected = false; + _this8.refs.select[i].selected = false; }); } @@ -1449,7 +1507,7 @@ var Flounder = (function () { selectTag.selectedIndex = index; var hasClass = this.hasClass; - if (hasClass(data[index], _classes3['default'].HIDDEN) && hasClass(data[index], _classes3['default'].SELECTED_HIDDEN)) { + if (hasClass(data[index], _classes3['default'].HIDDEN) || hasClass(data[index], _classes3['default'].SELECTED_HIDDEN) || hasClass(data[index], _classes3['default'].DISABLED)) { this.setKeypress(e); } } @@ -1571,7 +1629,7 @@ var Flounder = (function () { }, { key: 'setTextMultiTagIndent', value: function setTextMultiTagIndent() { - var _this10 = this; + var _this9 = this; var search = this.refs.search; var offset = this.defaultTextIndent; @@ -1579,7 +1637,7 @@ var Flounder = (function () { if (search) { var _els = document.getElementsByClassName(_classes3['default'].MULTIPLE_SELECT_TAG); _els.each(function (i, e) { - offset += _this10.getActualWidth(e); + offset += _this9.getActualWidth(e); }); search.style.textIndent = offset + 'px'; diff --git a/dist/flounder.jquery.min.js b/dist/flounder.jquery.min.js index 0f09931..157f045 100644 --- a/dist/flounder.jquery.min.js +++ b/dist/flounder.jquery.min.js @@ -1,2 +1,2 @@ -/*! Flounder v0.2.1 | (c) 2015 Sociomantic Labs | https://github.com/sociomantic/flounder/license */ -!function e(t,s,i){function n(l,r){if(!s[l]){if(!t[l]){var o="function"==typeof require&&require;if(!r&&o)return o(l,!0);if(a)return a(l,!0);var u=new Error("Cannot find module '"+l+"'");throw u.code="MODULE_NOT_FOUND",u}var c=s[l]={exports:{}};t[l][0].call(c.exports,function(e){var s=t[l][1][e];return n(s?s:e)},c,c.exports,e,t,s,i)}return s[l].exports}for(var a="function"==typeof require&&require,l=0;ln;n++)s=i[n],s.selected&&t.push(s);return t},getSelectedValues:function(){return this.getSelectedOptions().map(function(e){return e.value})},rebuildSelect:function(e){var t=this,s=this.refs,i=s.select.selectedOptions;i=Array.prototype.slice.call(i).map(function(e){return e.value}),this.removeOptionsListeners(),s.select.innerHTML="",s.optionsList.innerHTML="";var a=s.select;s.select=!1;var l=this.buildData(this._default,e,s.optionsList,a),r=n(l,2);s.data=r[0],s.selectOptions=r[1],s.select=a,this.removeSelectedValue(),this.removeSelectedClass(),s.selectOptions.forEach(function(e,n){var a=i.indexOf(e.value);-1!==a&&(i.splice(a,1),e.selected=!0,t.addClass(s.data[n],t.selectedClass))}),this.addOptionsListeners()},setIndex:function(e,t){var s=this.refs;if("string"!=typeof e&&e.length){var i=this.setIndex;return e.map(i)}var n=s.data[e];if(n){var a=this.hasClass(s.wrapper,"open");return this.toggleList(a?"close":"open"),this.___forceMultiple=t,this.___programmaticClick=!0,n.click(),n}return null},setValue:function(e,t){if("string"!=typeof e&&e.length){var s=this.setValue;return e.map(s)}return e=this.refs.select.querySelector('[value="'+e+'"]'),e?this.setIndex(e.index,t):null}};s["default"]=r,t.exports=s["default"]},{"./classes":2}],2:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={ARROW:"flounder__arrow",DESCRIPTION:"flounder__option--description",DISABLED:"flounder__disabled",DISABLED_OPTION:"flounder__disabled--option",HIDDEN:"flounder--hidden",HIDDEN_IOS:"flounder--hidden--ios",LIST:"flounder__list",MAIN:"flounder",MAIN_WRAPPER:"flounder--wrapper flounder__input--select",MULTI_TAG_LIST:"flounder__multi--tag--list",MULTIPLE_SELECT_TAG:"flounder__multiple--select--tag",MULTIPLE_TAG_CLOSE:"flounder__multiple__tag__close",OPTION:"flounder__option",OPTION_TAG:"flounder--option--tag",OPTIONS_WRAPPER:"flounder__list--wrapper",SELECTED:"flounder__option--selected",SELECTED_HIDDEN:"flounder__option--selected--hidden",SELECTED_DISPLAYED:"flounder__option--selected--displayed",SEARCH:"flounder__input--search",SEARCH_HIDDEN:"flounder--search--hidden",SELECT_TAG:"flounder--select--tag"};s["default"]=i,t.exports=s["default"]},{}],3:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={classes:{flounder:"",hidden:"flounder--hidden",selected:"flounder__option--selected",wrapper:""},defaultTextIndent:0,multiple:!1,multipleTags:!0,multipleMessage:"(Multiple Items Selected)",onClose:function(){},onComponentDidMount:function(){},onInit:function(){},onOpen:function(){},onSelect:function(){},options:[],placeholder:"Please choose an option",search:!1};s["default"]=i,t.exports=s["default"]},{}],4:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(s,"__esModule",{value:!0});var a=function(){function e(e,t){var s=[],i=!0,n=!1,a=void 0;try{for(var l,r=e[Symbol.iterator]();!(i=(l=r.next()).done)&&(s.push(l.value),!t||s.length!==t);i=!0);}catch(o){n=!0,a=o}finally{try{!i&&r["return"]&&r["return"]()}finally{if(n)throw a}}return s}return function(t,s){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,s);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),l=function(){function e(e,t){for(var s=0;sl?r=0:0>r&&(r=l),n.selectedIndex=r;var o=this.hasClass;o(a[r],c["default"].HIDDEN)&&o(a[r],c["default"].SELECTED_HIDDEN)&&this.setKeypress(e)}},{key:"setSelectValue",value:function(e,t){var s=this.refs,i=void 0;t?(this.setSelectValueClick(t),i=!0):(i=this.checkSelect(e),i&&this.setSelectValueButton(e)),i&&(this.displaySelected(s.selected,s),this.___programmaticClick?this.___programmaticClick=!1:this.onSelect(t,this.getSelectedValues()))}},{key:"setSelectValueButton",value:function(){var e=this.refs,t=e.data,s=(e.select,this.selectedClass),i=void 0;this.removeSelectedClass(t);var n=this.getSelectedOptions(),a=n[0];a&&(i=t[a.index],this.addClass(i,s),this.scrollTo(i))}},{key:"setSelectValueClick",value:function(e){var t=this.multiple,s=this.refs,i=this.selectedClass,n=void 0,a=void 0;t&&(!t||this.multipleTags||e[this.multiSelect])||this.___forceMultiple||this.deselectAll(),this.___forceMultiple=!1;var l=e.target;this.toggleClass(l,i),n=l.getAttribute("data-index"),a=s.selectOptions[n],a.selected=a.selected===!0?!1:!0}},{key:"setTextMultiTagIndent",value:function(){var e=this,t=this.refs.search,s=this.defaultTextIndent;if(t){var i=document.getElementsByClassName(c["default"].MULTIPLE_SELECT_TAG);i.each(function(t,i){s+=e.getActualWidth(i)}),t.style.textIndent=s+"px"}}},{key:"showElement",value:function(e){this.removeClass(e,c["default"].HIDDEN)}},{key:"toggleList",value:function(e,t){var s=this.refs,i=s.optionsListWrapper,n=s.wrapper,a=this.hasClass;"open"===t||"close"!==t&&a(i,c["default"].HIDDEN)?(this.toggleList.justOpened=!0,this.toggleOpen(e,i,s,n)):"close"!==t&&a(i,c["default"].HIDDEN)||(this.toggleList.justOpened=!1,this.toggleClosed(e,i,s,n))}},{key:"toggleOpen",value:function(e,t,s,i){if(this.addSelectKeyListener(),(!this.isIos||this.multipleTags===!0&&this.multiple===!0)&&(this.showElement(t),this.addClass(i,"open"),document.querySelector("html").addEventListener("click",this.catchBodyClick),document.querySelector("html").addEventListener("touchend",this.catchBodyClick)),!this.multiple){var n=s.select.selectedIndex,a=s.data[n];a&&this.scrollTo(a)}this.props.search&&s.search.focus(),this.onOpen(e,this.getSelectedValues())}},{key:"toggleClosed",value:function(e,t,s,i){this.hideElement(t),this.removeSelectKeyListener(),this.removeClass(i,"open");var n=document.querySelector("html");n.removeEventListener("click",this.catchBodyClick),n.removeEventListener("touchend",this.catchBodyClick),this.props.search&&this.fuzzySearchReset(),s.flounder.focus(),this.onClose(e,this.getSelectedValues())}}]),e}();h["default"].extendClass(v,h["default"],p["default"]),s["default"]=v,t.exports=s["default"]},{"./api":1,"./classes":2,"./defaults":3,"./utils":5}],5:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={addClass:function(e,t){var s=e.className,n=s.length;i.hasClass(e,t)||s.slice(0,t.length+1)===t+" "||s.slice(n-t.length-1,n)===" "+t||(e.className+=" "+t)},attachAttributes:function(e,t){for(var s in t)-1!==s.indexOf("data-")?e.setAttribute(s,t[s]):e[s]=t[s]},constructElement:function(e){var t=document.createElement(e.tagname||"div");return i.attachAttributes(t,e),t},extendClass:function(e){e=e.prototype;for(var t=function(t){for(var s in t)Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s])},s=arguments.length,i=Array(s>1?s-1:0),n=1;s>n;n++)i[n-1]=arguments[n];for(var a=0,l=i.length;l>a;a++){var r=i[a];t(r)}return e},escapeHTML:function(e){return String(e).replace(/&/g,"&").replace(//g,">").replace(/"/g,""")},hasClass:function(e,t){var s=e.className,i=new RegExp("(^"+t+" )|( "+t+"$)|( "+t+" )|(^"+t+"$)");return!!s.match(i)},iosVersion:function(){return/iPad|iPhone|iPod/.test(navigator.platform)?window.indexedDB?"8+":window.SpeechSynthesisUtterance?"7":window.webkitAudioContext?"6":"5-":!1},removeClass:function(e,t){var s=e.className,i=s.length,n=t.length;s.slice(0,n+1)===t+" "&&(e.className=s.slice(n+1,i)),s.slice(i-n-1,i)===" "+t&&(e.className=s.slice(0,i-n-1)),e.className=e.className.trim()},scrollTo:function(e){var t=e.parentNode.parentNode,s=e.offsetHeight,i=t.scrollTop,n=t.scrollTop+t.offsetHeight-e.offsetHeight,a=e.offsetTop;i>a?t.scrollTop=a-.5*s:a>n&&(t.scrollTop=a-t.offsetHeight+1.5*s)},setPlatform:function(){var e=this.isOsx=-1===window.navigator.platform.indexOf("Mac")?!1:!0;this.isIos=this.iosVersion(),this.multiSelect=e?"metaKey":"ctrlKey"},toggleClass:function(e,t){var s=i.addClass,n=i.removeClass;i.hasClass(e,t)?n(e,t):s(e,t)}};s["default"]=i,t.exports=s["default"]},{}],6:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}var n=e("../core/flounder.jsx"),a=i(n);!function(e){e.fn.flounder=function(e){return new a["default"](this,e)}}(jQuery)},{"../core/flounder.jsx":4}]},{},[6]); \ No newline at end of file +/*! Flounder v0.2.2 | (c) 2015 Sociomantic Labs | https://github.com/sociomantic/flounder/license */ +!function e(t,s,i){function n(l,r){if(!s[l]){if(!t[l]){var o="function"==typeof require&&require;if(!r&&o)return o(l,!0);if(a)return a(l,!0);var u=new Error("Cannot find module '"+l+"'");throw u.code="MODULE_NOT_FOUND",u}var c=s[l]={exports:{}};t[l][0].call(c.exports,function(e){var s=t[l][1][e];return n(s?s:e)},c,c.exports,e,t,s,i)}return s[l].exports}for(var a="function"==typeof require&&require,l=0;ln;n++)s=i[n],s.selected&&t.push(s);return t},getSelectedValues:function(){return this.getSelectedOptions().map(function(e){return e.value})},rebuildSelect:function(e){var t=this,s=this.refs,i=s.select.selectedOptions;i=Array.prototype.slice.call(i).map(function(e){return e.value}),this.removeOptionsListeners(),s.select.innerHTML="",s.optionsList.innerHTML="";var a=s.select;s.select=!1;var l=this.buildData(this._default,e,s.optionsList,a),r=n(l,2);s.data=r[0],s.selectOptions=r[1],s.select=a,this.removeSelectedValue(),this.removeSelectedClass(),s.selectOptions.forEach(function(e,n){var a=i.indexOf(e.value);-1!==a&&(i.splice(a,1),e.selected=!0,t.addClass(s.data[n],t.selectedClass))}),this.addOptionsListeners()},setIndex:function(e,t){var s=this.refs;if("string"!=typeof e&&e.length){var i=this.setIndex;return e.map(i)}var n=s.data[e];if(n){var a=this.hasClass(s.wrapper,"open");return this.toggleList(a?"close":"open"),this.___forceMultiple=t,this.___programmaticClick=!0,n.click(),n}return null},setValue:function(e,t){if("string"!=typeof e&&e.length){var s=this.setValue;return e.map(s)}return e=this.refs.select.querySelector('[value="'+e+'"]'),e?this.setIndex(e.index,t):null}};s["default"]=r,t.exports=s["default"]},{"./classes":2}],2:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={ARROW:"flounder__arrow",DESCRIPTION:"flounder__option--description",DISABLED:"flounder__disabled",DISABLED_OPTION:"flounder__disabled--option",HEADER:"flounder__header",HIDDEN:"flounder--hidden",HIDDEN_IOS:"flounder--hidden--ios",LIST:"flounder__list",MAIN:"flounder",MAIN_WRAPPER:"flounder--wrapper flounder__input--select",MULTI_TAG_LIST:"flounder__multi--tag--list",MULTIPLE_SELECT_TAG:"flounder__multiple--select--tag",MULTIPLE_TAG_CLOSE:"flounder__multiple__tag__close",OPTION:"flounder__option",OPTION_TAG:"flounder--option--tag",OPTIONS_WRAPPER:"flounder__list--wrapper",SECTION:"flounder__section",SELECTED:"flounder__option--selected",SELECTED_HIDDEN:"flounder__option--selected--hidden",SELECTED_DISPLAYED:"flounder__option--selected--displayed",SEARCH:"flounder__input--search",SEARCH_HIDDEN:"flounder--search--hidden",SELECT_TAG:"flounder--select--tag"};s["default"]=i,t.exports=s["default"]},{}],3:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={classes:{flounder:"",hidden:"flounder--hidden",selected:"flounder__option--selected",wrapper:""},defaultTextIndent:0,multiple:!1,multipleTags:!0,multipleMessage:"(Multiple Items Selected)",onClose:function(){},onComponentDidMount:function(){},onInit:function(){},onOpen:function(){},onSelect:function(){},options:[],placeholder:"Please choose an option",search:!1};s["default"]=i,t.exports=s["default"]},{}],4:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(s,"__esModule",{value:!0});var a=function(){function e(e,t){var s=[],i=!0,n=!1,a=void 0;try{for(var l,r=e[Symbol.iterator]();!(i=(l=r.next()).done)&&(s.push(l.value),!t||s.length!==t);i=!0);}catch(o){n=!0,a=o}finally{try{!i&&r["return"]&&r["return"]()}finally{if(n)throw a}}return s}return function(t,s){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,s);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),l=function(){function e(e,t){for(var s=0;sl?r=0:0>r&&(r=l),n.selectedIndex=r;var o=this.hasClass;(o(a[r],c["default"].HIDDEN)||o(a[r],c["default"].SELECTED_HIDDEN)||o(a[r],c["default"].DISABLED))&&this.setKeypress(e)}},{key:"setSelectValue",value:function(e,t){var s=this.refs,i=void 0;t?(this.setSelectValueClick(t),i=!0):(i=this.checkSelect(e),i&&this.setSelectValueButton(e)),i&&(this.displaySelected(s.selected,s),this.___programmaticClick?this.___programmaticClick=!1:this.onSelect(t,this.getSelectedValues()))}},{key:"setSelectValueButton",value:function(){var e=this.refs,t=e.data,s=(e.select,this.selectedClass),i=void 0;this.removeSelectedClass(t);var n=this.getSelectedOptions(),a=n[0];a&&(i=t[a.index],this.addClass(i,s),this.scrollTo(i))}},{key:"setSelectValueClick",value:function(e){var t=this.multiple,s=this.refs,i=this.selectedClass,n=void 0,a=void 0;t&&(!t||this.multipleTags||e[this.multiSelect])||this.___forceMultiple||this.deselectAll(),this.___forceMultiple=!1;var l=e.target;this.toggleClass(l,i),n=l.getAttribute("data-index"),a=s.selectOptions[n],a.selected=a.selected===!0?!1:!0}},{key:"setTextMultiTagIndent",value:function(){var e=this,t=this.refs.search,s=this.defaultTextIndent;if(t){var i=document.getElementsByClassName(c["default"].MULTIPLE_SELECT_TAG);i.each(function(t,i){s+=e.getActualWidth(i)}),t.style.textIndent=s+"px"}}},{key:"showElement",value:function(e){this.removeClass(e,c["default"].HIDDEN)}},{key:"toggleList",value:function(e,t){var s=this.refs,i=s.optionsListWrapper,n=s.wrapper,a=this.hasClass;"open"===t||"close"!==t&&a(i,c["default"].HIDDEN)?(this.toggleList.justOpened=!0,this.toggleOpen(e,i,s,n)):"close"!==t&&a(i,c["default"].HIDDEN)||(this.toggleList.justOpened=!1,this.toggleClosed(e,i,s,n))}},{key:"toggleOpen",value:function(e,t,s,i){if(this.addSelectKeyListener(),(!this.isIos||this.multipleTags===!0&&this.multiple===!0)&&(this.showElement(t),this.addClass(i,"open"),document.querySelector("html").addEventListener("click",this.catchBodyClick),document.querySelector("html").addEventListener("touchend",this.catchBodyClick)),!this.multiple){var n=s.select.selectedIndex,a=s.data[n];a&&this.scrollTo(a)}this.props.search&&s.search.focus(),this.onOpen(e,this.getSelectedValues())}},{key:"toggleClosed",value:function(e,t,s,i){this.hideElement(t),this.removeSelectKeyListener(),this.removeClass(i,"open");var n=document.querySelector("html");n.removeEventListener("click",this.catchBodyClick),n.removeEventListener("touchend",this.catchBodyClick),this.props.search&&this.fuzzySearchReset(),s.flounder.focus(),this.onClose(e,this.getSelectedValues())}}]),e}();h["default"].extendClass(v,h["default"],p["default"]),s["default"]=v,t.exports=s["default"]},{"./api":1,"./classes":2,"./defaults":3,"./utils":5}],5:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={addClass:function(e,t){var s=e.className,n=s.length;i.hasClass(e,t)||s.slice(0,t.length+1)===t+" "||s.slice(n-t.length-1,n)===" "+t||(e.className+=" "+t)},attachAttributes:function(e,t){for(var s in t)-1!==s.indexOf("data-")?e.setAttribute(s,t[s]):e[s]=t[s]},constructElement:function(e){var t=document.createElement(e.tagname||"div");return i.attachAttributes(t,e),t},extendClass:function(e){e=e.prototype;for(var t=function(t){for(var s in t)Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s])},s=arguments.length,i=Array(s>1?s-1:0),n=1;s>n;n++)i[n-1]=arguments[n];for(var a=0,l=i.length;l>a;a++){var r=i[a];t(r)}return e},escapeHTML:function(e){return String(e).replace(/&/g,"&").replace(//g,">").replace(/"/g,""")},hasClass:function(e,t){var s=e.className,i=new RegExp("(^"+t+" )|( "+t+"$)|( "+t+" )|(^"+t+"$)");return!!s.match(i)},iosVersion:function(){return/iPad|iPhone|iPod/.test(navigator.platform)?window.indexedDB?"8+":window.SpeechSynthesisUtterance?"7":window.webkitAudioContext?"6":"5-":!1},removeClass:function(e,t){var s=e.className,i=s.length,n=t.length;s.slice(0,n+1)===t+" "&&(e.className=s.slice(n+1,i)),s.slice(i-n-1,i)===" "+t&&(e.className=s.slice(0,i-n-1)),e.className=e.className.trim()},scrollTo:function(e){var t=e.parentNode.parentNode,s=e.offsetHeight,i=t.scrollTop,n=t.scrollTop+t.offsetHeight-e.offsetHeight,a=e.offsetTop;i>a?t.scrollTop=a-.5*s:a>n&&(t.scrollTop=a-t.offsetHeight+1.5*s)},setPlatform:function(){var e=this.isOsx=-1===window.navigator.platform.indexOf("Mac")?!1:!0;this.isIos=this.iosVersion(),this.multiSelect=e?"metaKey":"ctrlKey"},toggleClass:function(e,t){var s=i.addClass,n=i.removeClass;i.hasClass(e,t)?n(e,t):s(e,t)}};s["default"]=i,t.exports=s["default"]},{}],6:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}var n=e("../core/flounder.jsx"),a=i(n);!function(e){e.fn.flounder=function(e){return new a["default"](this,e)}}(jQuery)},{"../core/flounder.jsx":4}]},{},[6]); \ No newline at end of file diff --git a/dist/flounder.js b/dist/flounder.js index 591a636..490cfaa 100644 --- a/dist/flounder.js +++ b/dist/flounder.js @@ -1,5 +1,5 @@ /*! - * Flounder JavaScript Styleable Selectbox v0.2.1 + * Flounder JavaScript Styleable Selectbox v0.2.2 * https://github.com/sociomantic/flounder * * Copyright 2015 Sociomantic Labs and other contributors @@ -257,6 +257,7 @@ var classes = { DESCRIPTION: 'flounder__option--description', DISABLED: 'flounder__disabled', DISABLED_OPTION: 'flounder__disabled--option', + HEADER: 'flounder__header', HIDDEN: 'flounder--hidden', HIDDEN_IOS: 'flounder--hidden--ios', LIST: 'flounder__list', @@ -268,6 +269,7 @@ var classes = { OPTION: 'flounder__option', OPTION_TAG: 'flounder--option--tag', OPTIONS_WRAPPER: 'flounder__list--wrapper', + SECTION: 'flounder__section', SELECTED: 'flounder__option--selected', SELECTED_HIDDEN: 'flounder__option--selected--hidden', SELECTED_DISPLAYED: 'flounder__option--selected--displayed', @@ -601,15 +603,28 @@ var Flounder = (function () { }, { key: 'buildData', value: function buildData(defaultValue, _data, optionsList, select) { - var _this3 = this; - _data = _data || []; + var index = 0; var data = []; var selectOptions = []; var constructElement = this.constructElement; var addOptionDescription = this.addOptionDescription; + var selectedClass = this.selectedClass; + var escapeHTML = this.escapeHTML; + var addClass = this.addClass; + var selectRef = this.refs.select; - _data.forEach(function (dataObj, i) { + /** + * ## buildDiv + * + * builds an individual div tag for a flounder dropdown + * + * @param {Object} dataObj [description] + * @param {Number} i index + * + * @return {DOMElement} + */ + var buildDiv = function buildDiv(dataObj, i) { if (typeof dataObj !== 'object') { dataObj = { text: dataObj, @@ -618,7 +633,7 @@ var Flounder = (function () { } dataObj.index = i; - var extraClass = i === defaultValue.index ? ' ' + _this3.selectedClass : ''; + var extraClass = i === defaultValue.index ? ' ' + selectedClass : ''; var res = { className: _classes3['default'].OPTION + extraClass, @@ -631,36 +646,79 @@ var Flounder = (function () { } } - data[i] = constructElement(res); - var escapedText = _this3.escapeHTML(dataObj.text); - data[i].innerHTML = escapedText; - optionsList.appendChild(data[i]); + var data = constructElement(res); + var escapedText = escapeHTML(dataObj.text); + data.innerHTML = escapedText; if (dataObj.description) { - addOptionDescription(data[i], dataObj.description); + addOptionDescription(data, dataObj.description); } - data[i].className += dataObj.extraClass ? ' ' + dataObj.extraClass : ''; + data.className += dataObj.extraClass ? ' ' + dataObj.extraClass : ''; + + return data; + }; - if (!_this3.refs.select) { - selectOptions[i] = constructElement({ tagname: 'option', + /** + * ## buildOption + * + * builds an individual option tag for a flounder dropdown + * + * @param {Object} dataObj [description] + * @param {Number} i index + * + * @return {DOMElement} + */ + var buildOption = function buildOption(dataObj, i) { + var selectOption = undefined; + + if (!selectRef) { + selectOption = constructElement({ tagname: 'option', className: _classes3['default'].OPTION_TAG, value: dataObj.value }); - selectOptions[i].innerHTML = escapedText; - select.appendChild(selectOptions[i]); + var escapedText = escapeHTML(dataObj.text); + selectOption.innerHTML = escapedText; + select.appendChild(selectOption); } else { var selectChild = select.children[i]; - - selectOptions[i] = selectChild; + selectOption = selectChild; selectChild.setAttribute('value', selectChild.value); } if (i === defaultValue.index) { - selectOptions[i].selected = true; + selectOption.selected = true; + } + + if (selectOption.getAttribute('disabled')) { + addClass(data[i], _classes3['default'].DISABLED_OPTION); } - if (selectOptions[i].getAttribute('disabled')) { - _this3.addClass(data[i], _classes3['default'].DISABLED_OPTION); + return selectOption; + }; + + _data.forEach(function (dataObj) { + if (dataObj.header) { + (function () { + var section = constructElement({ tagname: 'div', + className: _classes3['default'].SECTION }); + var header = constructElement({ tagname: 'div', + className: _classes3['default'].HEADER }); + header.textContent = dataObj.header; + section.appendChild(header); + optionsList.appendChild(section); + + dataObj.data.forEach(function (_dataObj) { + data[index] = buildDiv(_dataObj, index); + section.appendChild(data[index]); + selectOptions[index] = buildOption(_dataObj, index); + index++; + }); + })(); + } else { + data[index] = buildDiv(dataObj, index); + optionsList.appendChild(data[index]); + selectOptions[index] = buildOption(dataObj, index); + index++; } }); @@ -934,7 +992,7 @@ var Flounder = (function () { key: 'fuzzySearch', value: function fuzzySearch(e) // disclaimer: not actually fuzzy { - var _this4 = this; + var _this3 = this; e.preventDefault(); var keyCode = e.keyCode; @@ -943,13 +1001,13 @@ var Flounder = (function () { (function () { var term = e.target.value.toLowerCase(); - _this4.refs.data.forEach(function (dataObj) { + _this3.refs.data.forEach(function (dataObj) { var text = dataObj.innerHTML.toLowerCase(); if (term !== '' && text.indexOf(term) === -1) { - _this4.addClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this3.addClass(dataObj, _classes3['default'].SEARCH_HIDDEN); } else { - _this4.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this3.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); } }); })(); @@ -969,10 +1027,10 @@ var Flounder = (function () { }, { key: 'fuzzySearchReset', value: function fuzzySearchReset() { - var _this5 = this; + var _this4 = this; this.refs.data.forEach(function (dataObj) { - _this5.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this4.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); }); this.refs.search.value = ''; @@ -1067,16 +1125,16 @@ var Flounder = (function () { }, { key: 'initSelectBox', value: function initSelectBox(wrapper) { - var _this6 = this; + var _this5 = this; var target = this.target; var select = undefined; if (target.tagName === 'SELECT') { (function () { - _this6.addClass(target, _classes3['default'].SELECT_TAG); - _this6.addClass(target, _classes3['default'].HIDDEN); - _this6.refs.select = target; + _this5.addClass(target, _classes3['default'].SELECT_TAG); + _this5.addClass(target, _classes3['default'].HIDDEN); + _this5.refs.select = target; var data = [], selectOptions = []; @@ -1089,12 +1147,12 @@ var Flounder = (function () { }); }); - _this6.data = data; - _this6.target = target.parentNode; - _this6.refs.selectOptions = selectOptions; + _this5.data = data; + _this5.target = target.parentNode; + _this5.refs.selectOptions = selectOptions; - select = _this6.refs.select; - _this6.addClass(select, _classes3['default'].HIDDEN); + select = _this5.refs.select; + _this5.addClass(select, _classes3['default'].HIDDEN); })(); } else { select = this.constructElement({ tagname: 'select', className: _classes3['default'].SELECT_TAG + ' ' + _classes3['default'].HIDDEN }); @@ -1170,11 +1228,11 @@ var Flounder = (function () { }, { key: 'removeOptionsListeners', value: function removeOptionsListeners() { - var _this7 = this; + var _this6 = this; this.refs.data.forEach(function (dataObj) { if (dataObj.tagName === 'DIV') { - dataObj.removeEventListener('click', _this7.clickSet); + dataObj.removeEventListener('click', _this6.clickSet); } }); } @@ -1259,12 +1317,12 @@ var Flounder = (function () { }, { key: 'removeSelectedClass', value: function removeSelectedClass(data) { - var _this8 = this; + var _this7 = this; data = data || this.refs.data; data.forEach(function (dataObj, i) { - _this8.removeClass(dataObj, _this8.selectedClass); + _this7.removeClass(dataObj, _this7.selectedClass); }); } @@ -1278,12 +1336,12 @@ var Flounder = (function () { }, { key: 'removeSelectedValue', value: function removeSelectedValue(data) { - var _this9 = this; + var _this8 = this; data = data || this.refs.data; data.forEach(function (_d, i) { - _this9.refs.select[i].selected = false; + _this8.refs.select[i].selected = false; }); } @@ -1449,7 +1507,7 @@ var Flounder = (function () { selectTag.selectedIndex = index; var hasClass = this.hasClass; - if (hasClass(data[index], _classes3['default'].HIDDEN) && hasClass(data[index], _classes3['default'].SELECTED_HIDDEN)) { + if (hasClass(data[index], _classes3['default'].HIDDEN) || hasClass(data[index], _classes3['default'].SELECTED_HIDDEN) || hasClass(data[index], _classes3['default'].DISABLED)) { this.setKeypress(e); } } @@ -1571,7 +1629,7 @@ var Flounder = (function () { }, { key: 'setTextMultiTagIndent', value: function setTextMultiTagIndent() { - var _this10 = this; + var _this9 = this; var search = this.refs.search; var offset = this.defaultTextIndent; @@ -1579,7 +1637,7 @@ var Flounder = (function () { if (search) { var _els = document.getElementsByClassName(_classes3['default'].MULTIPLE_SELECT_TAG); _els.each(function (i, e) { - offset += _this10.getActualWidth(e); + offset += _this9.getActualWidth(e); }); search.style.textIndent = offset + 'px'; diff --git a/dist/flounder.microbe.js b/dist/flounder.microbe.js index 3340107..1a57720 100644 --- a/dist/flounder.microbe.js +++ b/dist/flounder.microbe.js @@ -1,5 +1,5 @@ /*! - * Flounder JavaScript Styleable Selectbox v0.2.1 + * Flounder JavaScript Styleable Selectbox v0.2.2 * https://github.com/sociomantic/flounder * * Copyright 2015 Sociomantic Labs and other contributors @@ -257,6 +257,7 @@ var classes = { DESCRIPTION: 'flounder__option--description', DISABLED: 'flounder__disabled', DISABLED_OPTION: 'flounder__disabled--option', + HEADER: 'flounder__header', HIDDEN: 'flounder--hidden', HIDDEN_IOS: 'flounder--hidden--ios', LIST: 'flounder__list', @@ -268,6 +269,7 @@ var classes = { OPTION: 'flounder__option', OPTION_TAG: 'flounder--option--tag', OPTIONS_WRAPPER: 'flounder__list--wrapper', + SECTION: 'flounder__section', SELECTED: 'flounder__option--selected', SELECTED_HIDDEN: 'flounder__option--selected--hidden', SELECTED_DISPLAYED: 'flounder__option--selected--displayed', @@ -601,15 +603,28 @@ var Flounder = (function () { }, { key: 'buildData', value: function buildData(defaultValue, _data, optionsList, select) { - var _this3 = this; - _data = _data || []; + var index = 0; var data = []; var selectOptions = []; var constructElement = this.constructElement; var addOptionDescription = this.addOptionDescription; + var selectedClass = this.selectedClass; + var escapeHTML = this.escapeHTML; + var addClass = this.addClass; + var selectRef = this.refs.select; - _data.forEach(function (dataObj, i) { + /** + * ## buildDiv + * + * builds an individual div tag for a flounder dropdown + * + * @param {Object} dataObj [description] + * @param {Number} i index + * + * @return {DOMElement} + */ + var buildDiv = function buildDiv(dataObj, i) { if (typeof dataObj !== 'object') { dataObj = { text: dataObj, @@ -618,7 +633,7 @@ var Flounder = (function () { } dataObj.index = i; - var extraClass = i === defaultValue.index ? ' ' + _this3.selectedClass : ''; + var extraClass = i === defaultValue.index ? ' ' + selectedClass : ''; var res = { className: _classes3['default'].OPTION + extraClass, @@ -631,36 +646,79 @@ var Flounder = (function () { } } - data[i] = constructElement(res); - var escapedText = _this3.escapeHTML(dataObj.text); - data[i].innerHTML = escapedText; - optionsList.appendChild(data[i]); + var data = constructElement(res); + var escapedText = escapeHTML(dataObj.text); + data.innerHTML = escapedText; if (dataObj.description) { - addOptionDescription(data[i], dataObj.description); + addOptionDescription(data, dataObj.description); } - data[i].className += dataObj.extraClass ? ' ' + dataObj.extraClass : ''; + data.className += dataObj.extraClass ? ' ' + dataObj.extraClass : ''; + + return data; + }; - if (!_this3.refs.select) { - selectOptions[i] = constructElement({ tagname: 'option', + /** + * ## buildOption + * + * builds an individual option tag for a flounder dropdown + * + * @param {Object} dataObj [description] + * @param {Number} i index + * + * @return {DOMElement} + */ + var buildOption = function buildOption(dataObj, i) { + var selectOption = undefined; + + if (!selectRef) { + selectOption = constructElement({ tagname: 'option', className: _classes3['default'].OPTION_TAG, value: dataObj.value }); - selectOptions[i].innerHTML = escapedText; - select.appendChild(selectOptions[i]); + var escapedText = escapeHTML(dataObj.text); + selectOption.innerHTML = escapedText; + select.appendChild(selectOption); } else { var selectChild = select.children[i]; - - selectOptions[i] = selectChild; + selectOption = selectChild; selectChild.setAttribute('value', selectChild.value); } if (i === defaultValue.index) { - selectOptions[i].selected = true; + selectOption.selected = true; + } + + if (selectOption.getAttribute('disabled')) { + addClass(data[i], _classes3['default'].DISABLED_OPTION); } - if (selectOptions[i].getAttribute('disabled')) { - _this3.addClass(data[i], _classes3['default'].DISABLED_OPTION); + return selectOption; + }; + + _data.forEach(function (dataObj) { + if (dataObj.header) { + (function () { + var section = constructElement({ tagname: 'div', + className: _classes3['default'].SECTION }); + var header = constructElement({ tagname: 'div', + className: _classes3['default'].HEADER }); + header.textContent = dataObj.header; + section.appendChild(header); + optionsList.appendChild(section); + + dataObj.data.forEach(function (_dataObj) { + data[index] = buildDiv(_dataObj, index); + section.appendChild(data[index]); + selectOptions[index] = buildOption(_dataObj, index); + index++; + }); + })(); + } else { + data[index] = buildDiv(dataObj, index); + optionsList.appendChild(data[index]); + selectOptions[index] = buildOption(dataObj, index); + index++; } }); @@ -934,7 +992,7 @@ var Flounder = (function () { key: 'fuzzySearch', value: function fuzzySearch(e) // disclaimer: not actually fuzzy { - var _this4 = this; + var _this3 = this; e.preventDefault(); var keyCode = e.keyCode; @@ -943,13 +1001,13 @@ var Flounder = (function () { (function () { var term = e.target.value.toLowerCase(); - _this4.refs.data.forEach(function (dataObj) { + _this3.refs.data.forEach(function (dataObj) { var text = dataObj.innerHTML.toLowerCase(); if (term !== '' && text.indexOf(term) === -1) { - _this4.addClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this3.addClass(dataObj, _classes3['default'].SEARCH_HIDDEN); } else { - _this4.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this3.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); } }); })(); @@ -969,10 +1027,10 @@ var Flounder = (function () { }, { key: 'fuzzySearchReset', value: function fuzzySearchReset() { - var _this5 = this; + var _this4 = this; this.refs.data.forEach(function (dataObj) { - _this5.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this4.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); }); this.refs.search.value = ''; @@ -1067,16 +1125,16 @@ var Flounder = (function () { }, { key: 'initSelectBox', value: function initSelectBox(wrapper) { - var _this6 = this; + var _this5 = this; var target = this.target; var select = undefined; if (target.tagName === 'SELECT') { (function () { - _this6.addClass(target, _classes3['default'].SELECT_TAG); - _this6.addClass(target, _classes3['default'].HIDDEN); - _this6.refs.select = target; + _this5.addClass(target, _classes3['default'].SELECT_TAG); + _this5.addClass(target, _classes3['default'].HIDDEN); + _this5.refs.select = target; var data = [], selectOptions = []; @@ -1089,12 +1147,12 @@ var Flounder = (function () { }); }); - _this6.data = data; - _this6.target = target.parentNode; - _this6.refs.selectOptions = selectOptions; + _this5.data = data; + _this5.target = target.parentNode; + _this5.refs.selectOptions = selectOptions; - select = _this6.refs.select; - _this6.addClass(select, _classes3['default'].HIDDEN); + select = _this5.refs.select; + _this5.addClass(select, _classes3['default'].HIDDEN); })(); } else { select = this.constructElement({ tagname: 'select', className: _classes3['default'].SELECT_TAG + ' ' + _classes3['default'].HIDDEN }); @@ -1170,11 +1228,11 @@ var Flounder = (function () { }, { key: 'removeOptionsListeners', value: function removeOptionsListeners() { - var _this7 = this; + var _this6 = this; this.refs.data.forEach(function (dataObj) { if (dataObj.tagName === 'DIV') { - dataObj.removeEventListener('click', _this7.clickSet); + dataObj.removeEventListener('click', _this6.clickSet); } }); } @@ -1259,12 +1317,12 @@ var Flounder = (function () { }, { key: 'removeSelectedClass', value: function removeSelectedClass(data) { - var _this8 = this; + var _this7 = this; data = data || this.refs.data; data.forEach(function (dataObj, i) { - _this8.removeClass(dataObj, _this8.selectedClass); + _this7.removeClass(dataObj, _this7.selectedClass); }); } @@ -1278,12 +1336,12 @@ var Flounder = (function () { }, { key: 'removeSelectedValue', value: function removeSelectedValue(data) { - var _this9 = this; + var _this8 = this; data = data || this.refs.data; data.forEach(function (_d, i) { - _this9.refs.select[i].selected = false; + _this8.refs.select[i].selected = false; }); } @@ -1449,7 +1507,7 @@ var Flounder = (function () { selectTag.selectedIndex = index; var hasClass = this.hasClass; - if (hasClass(data[index], _classes3['default'].HIDDEN) && hasClass(data[index], _classes3['default'].SELECTED_HIDDEN)) { + if (hasClass(data[index], _classes3['default'].HIDDEN) || hasClass(data[index], _classes3['default'].SELECTED_HIDDEN) || hasClass(data[index], _classes3['default'].DISABLED)) { this.setKeypress(e); } } @@ -1571,7 +1629,7 @@ var Flounder = (function () { }, { key: 'setTextMultiTagIndent', value: function setTextMultiTagIndent() { - var _this10 = this; + var _this9 = this; var search = this.refs.search; var offset = this.defaultTextIndent; @@ -1579,7 +1637,7 @@ var Flounder = (function () { if (search) { var _els = document.getElementsByClassName(_classes3['default'].MULTIPLE_SELECT_TAG); _els.each(function (i, e) { - offset += _this10.getActualWidth(e); + offset += _this9.getActualWidth(e); }); search.style.textIndent = offset + 'px'; diff --git a/dist/flounder.microbe.min.js b/dist/flounder.microbe.min.js index 9b3fab8..a104699 100644 --- a/dist/flounder.microbe.min.js +++ b/dist/flounder.microbe.min.js @@ -1,2 +1,2 @@ -/*! Flounder v0.2.1 | (c) 2015 Sociomantic Labs | https://github.com/sociomantic/flounder/license */ -!function e(t,s,i){function n(l,r){if(!s[l]){if(!t[l]){var o="function"==typeof require&&require;if(!r&&o)return o(l,!0);if(a)return a(l,!0);var u=new Error("Cannot find module '"+l+"'");throw u.code="MODULE_NOT_FOUND",u}var c=s[l]={exports:{}};t[l][0].call(c.exports,function(e){var s=t[l][1][e];return n(s?s:e)},c,c.exports,e,t,s,i)}return s[l].exports}for(var a="function"==typeof require&&require,l=0;ln;n++)s=i[n],s.selected&&t.push(s);return t},getSelectedValues:function(){return this.getSelectedOptions().map(function(e){return e.value})},rebuildSelect:function(e){var t=this,s=this.refs,i=s.select.selectedOptions;i=Array.prototype.slice.call(i).map(function(e){return e.value}),this.removeOptionsListeners(),s.select.innerHTML="",s.optionsList.innerHTML="";var a=s.select;s.select=!1;var l=this.buildData(this._default,e,s.optionsList,a),r=n(l,2);s.data=r[0],s.selectOptions=r[1],s.select=a,this.removeSelectedValue(),this.removeSelectedClass(),s.selectOptions.forEach(function(e,n){var a=i.indexOf(e.value);-1!==a&&(i.splice(a,1),e.selected=!0,t.addClass(s.data[n],t.selectedClass))}),this.addOptionsListeners()},setIndex:function(e,t){var s=this.refs;if("string"!=typeof e&&e.length){var i=this.setIndex;return e.map(i)}var n=s.data[e];if(n){var a=this.hasClass(s.wrapper,"open");return this.toggleList(a?"close":"open"),this.___forceMultiple=t,this.___programmaticClick=!0,n.click(),n}return null},setValue:function(e,t){if("string"!=typeof e&&e.length){var s=this.setValue;return e.map(s)}return e=this.refs.select.querySelector('[value="'+e+'"]'),e?this.setIndex(e.index,t):null}};s["default"]=r,t.exports=s["default"]},{"./classes":2}],2:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={ARROW:"flounder__arrow",DESCRIPTION:"flounder__option--description",DISABLED:"flounder__disabled",DISABLED_OPTION:"flounder__disabled--option",HIDDEN:"flounder--hidden",HIDDEN_IOS:"flounder--hidden--ios",LIST:"flounder__list",MAIN:"flounder",MAIN_WRAPPER:"flounder--wrapper flounder__input--select",MULTI_TAG_LIST:"flounder__multi--tag--list",MULTIPLE_SELECT_TAG:"flounder__multiple--select--tag",MULTIPLE_TAG_CLOSE:"flounder__multiple__tag__close",OPTION:"flounder__option",OPTION_TAG:"flounder--option--tag",OPTIONS_WRAPPER:"flounder__list--wrapper",SELECTED:"flounder__option--selected",SELECTED_HIDDEN:"flounder__option--selected--hidden",SELECTED_DISPLAYED:"flounder__option--selected--displayed",SEARCH:"flounder__input--search",SEARCH_HIDDEN:"flounder--search--hidden",SELECT_TAG:"flounder--select--tag"};s["default"]=i,t.exports=s["default"]},{}],3:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={classes:{flounder:"",hidden:"flounder--hidden",selected:"flounder__option--selected",wrapper:""},defaultTextIndent:0,multiple:!1,multipleTags:!0,multipleMessage:"(Multiple Items Selected)",onClose:function(){},onComponentDidMount:function(){},onInit:function(){},onOpen:function(){},onSelect:function(){},options:[],placeholder:"Please choose an option",search:!1};s["default"]=i,t.exports=s["default"]},{}],4:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(s,"__esModule",{value:!0});var a=function(){function e(e,t){var s=[],i=!0,n=!1,a=void 0;try{for(var l,r=e[Symbol.iterator]();!(i=(l=r.next()).done)&&(s.push(l.value),!t||s.length!==t);i=!0);}catch(o){n=!0,a=o}finally{try{!i&&r["return"]&&r["return"]()}finally{if(n)throw a}}return s}return function(t,s){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,s);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),l=function(){function e(e,t){for(var s=0;sl?r=0:0>r&&(r=l),n.selectedIndex=r;var o=this.hasClass;o(a[r],c["default"].HIDDEN)&&o(a[r],c["default"].SELECTED_HIDDEN)&&this.setKeypress(e)}},{key:"setSelectValue",value:function(e,t){var s=this.refs,i=void 0;t?(this.setSelectValueClick(t),i=!0):(i=this.checkSelect(e),i&&this.setSelectValueButton(e)),i&&(this.displaySelected(s.selected,s),this.___programmaticClick?this.___programmaticClick=!1:this.onSelect(t,this.getSelectedValues()))}},{key:"setSelectValueButton",value:function(){var e=this.refs,t=e.data,s=(e.select,this.selectedClass),i=void 0;this.removeSelectedClass(t);var n=this.getSelectedOptions(),a=n[0];a&&(i=t[a.index],this.addClass(i,s),this.scrollTo(i))}},{key:"setSelectValueClick",value:function(e){var t=this.multiple,s=this.refs,i=this.selectedClass,n=void 0,a=void 0;t&&(!t||this.multipleTags||e[this.multiSelect])||this.___forceMultiple||this.deselectAll(),this.___forceMultiple=!1;var l=e.target;this.toggleClass(l,i),n=l.getAttribute("data-index"),a=s.selectOptions[n],a.selected=a.selected===!0?!1:!0}},{key:"setTextMultiTagIndent",value:function(){var e=this,t=this.refs.search,s=this.defaultTextIndent;if(t){var i=document.getElementsByClassName(c["default"].MULTIPLE_SELECT_TAG);i.each(function(t,i){s+=e.getActualWidth(i)}),t.style.textIndent=s+"px"}}},{key:"showElement",value:function(e){this.removeClass(e,c["default"].HIDDEN)}},{key:"toggleList",value:function(e,t){var s=this.refs,i=s.optionsListWrapper,n=s.wrapper,a=this.hasClass;"open"===t||"close"!==t&&a(i,c["default"].HIDDEN)?(this.toggleList.justOpened=!0,this.toggleOpen(e,i,s,n)):"close"!==t&&a(i,c["default"].HIDDEN)||(this.toggleList.justOpened=!1,this.toggleClosed(e,i,s,n))}},{key:"toggleOpen",value:function(e,t,s,i){if(this.addSelectKeyListener(),(!this.isIos||this.multipleTags===!0&&this.multiple===!0)&&(this.showElement(t),this.addClass(i,"open"),document.querySelector("html").addEventListener("click",this.catchBodyClick),document.querySelector("html").addEventListener("touchend",this.catchBodyClick)),!this.multiple){var n=s.select.selectedIndex,a=s.data[n];a&&this.scrollTo(a)}this.props.search&&s.search.focus(),this.onOpen(e,this.getSelectedValues())}},{key:"toggleClosed",value:function(e,t,s,i){this.hideElement(t),this.removeSelectKeyListener(),this.removeClass(i,"open");var n=document.querySelector("html");n.removeEventListener("click",this.catchBodyClick),n.removeEventListener("touchend",this.catchBodyClick),this.props.search&&this.fuzzySearchReset(),s.flounder.focus(),this.onClose(e,this.getSelectedValues())}}]),e}();h["default"].extendClass(v,h["default"],p["default"]),s["default"]=v,t.exports=s["default"]},{"./api":1,"./classes":2,"./defaults":3,"./utils":5}],5:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={addClass:function(e,t){var s=e.className,n=s.length;i.hasClass(e,t)||s.slice(0,t.length+1)===t+" "||s.slice(n-t.length-1,n)===" "+t||(e.className+=" "+t)},attachAttributes:function(e,t){for(var s in t)-1!==s.indexOf("data-")?e.setAttribute(s,t[s]):e[s]=t[s]},constructElement:function(e){var t=document.createElement(e.tagname||"div");return i.attachAttributes(t,e),t},extendClass:function(e){e=e.prototype;for(var t=function(t){for(var s in t)Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s])},s=arguments.length,i=Array(s>1?s-1:0),n=1;s>n;n++)i[n-1]=arguments[n];for(var a=0,l=i.length;l>a;a++){var r=i[a];t(r)}return e},escapeHTML:function(e){return String(e).replace(/&/g,"&").replace(//g,">").replace(/"/g,""")},hasClass:function(e,t){var s=e.className,i=new RegExp("(^"+t+" )|( "+t+"$)|( "+t+" )|(^"+t+"$)");return!!s.match(i)},iosVersion:function(){return/iPad|iPhone|iPod/.test(navigator.platform)?window.indexedDB?"8+":window.SpeechSynthesisUtterance?"7":window.webkitAudioContext?"6":"5-":!1},removeClass:function(e,t){var s=e.className,i=s.length,n=t.length;s.slice(0,n+1)===t+" "&&(e.className=s.slice(n+1,i)),s.slice(i-n-1,i)===" "+t&&(e.className=s.slice(0,i-n-1)),e.className=e.className.trim()},scrollTo:function(e){var t=e.parentNode.parentNode,s=e.offsetHeight,i=t.scrollTop,n=t.scrollTop+t.offsetHeight-e.offsetHeight,a=e.offsetTop;i>a?t.scrollTop=a-.5*s:a>n&&(t.scrollTop=a-t.offsetHeight+1.5*s)},setPlatform:function(){var e=this.isOsx=-1===window.navigator.platform.indexOf("Mac")?!1:!0;this.isIos=this.iosVersion(),this.multiSelect=e?"metaKey":"ctrlKey"},toggleClass:function(e,t){var s=i.addClass,n=i.removeClass;i.hasClass(e,t)?n(e,t):s(e,t)}};s["default"]=i,t.exports=s["default"]},{}],6:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}var n=e("../core/flounder.jsx"),a=i(n);!function(e){e.core.flounder=function(e){return new a["default"](this,e)}}(µ)},{"../core/flounder.jsx":4}]},{},[6]); \ No newline at end of file +/*! Flounder v0.2.2 | (c) 2015 Sociomantic Labs | https://github.com/sociomantic/flounder/license */ +!function e(t,s,i){function n(l,r){if(!s[l]){if(!t[l]){var o="function"==typeof require&&require;if(!r&&o)return o(l,!0);if(a)return a(l,!0);var u=new Error("Cannot find module '"+l+"'");throw u.code="MODULE_NOT_FOUND",u}var c=s[l]={exports:{}};t[l][0].call(c.exports,function(e){var s=t[l][1][e];return n(s?s:e)},c,c.exports,e,t,s,i)}return s[l].exports}for(var a="function"==typeof require&&require,l=0;ln;n++)s=i[n],s.selected&&t.push(s);return t},getSelectedValues:function(){return this.getSelectedOptions().map(function(e){return e.value})},rebuildSelect:function(e){var t=this,s=this.refs,i=s.select.selectedOptions;i=Array.prototype.slice.call(i).map(function(e){return e.value}),this.removeOptionsListeners(),s.select.innerHTML="",s.optionsList.innerHTML="";var a=s.select;s.select=!1;var l=this.buildData(this._default,e,s.optionsList,a),r=n(l,2);s.data=r[0],s.selectOptions=r[1],s.select=a,this.removeSelectedValue(),this.removeSelectedClass(),s.selectOptions.forEach(function(e,n){var a=i.indexOf(e.value);-1!==a&&(i.splice(a,1),e.selected=!0,t.addClass(s.data[n],t.selectedClass))}),this.addOptionsListeners()},setIndex:function(e,t){var s=this.refs;if("string"!=typeof e&&e.length){var i=this.setIndex;return e.map(i)}var n=s.data[e];if(n){var a=this.hasClass(s.wrapper,"open");return this.toggleList(a?"close":"open"),this.___forceMultiple=t,this.___programmaticClick=!0,n.click(),n}return null},setValue:function(e,t){if("string"!=typeof e&&e.length){var s=this.setValue;return e.map(s)}return e=this.refs.select.querySelector('[value="'+e+'"]'),e?this.setIndex(e.index,t):null}};s["default"]=r,t.exports=s["default"]},{"./classes":2}],2:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={ARROW:"flounder__arrow",DESCRIPTION:"flounder__option--description",DISABLED:"flounder__disabled",DISABLED_OPTION:"flounder__disabled--option",HEADER:"flounder__header",HIDDEN:"flounder--hidden",HIDDEN_IOS:"flounder--hidden--ios",LIST:"flounder__list",MAIN:"flounder",MAIN_WRAPPER:"flounder--wrapper flounder__input--select",MULTI_TAG_LIST:"flounder__multi--tag--list",MULTIPLE_SELECT_TAG:"flounder__multiple--select--tag",MULTIPLE_TAG_CLOSE:"flounder__multiple__tag__close",OPTION:"flounder__option",OPTION_TAG:"flounder--option--tag",OPTIONS_WRAPPER:"flounder__list--wrapper",SECTION:"flounder__section",SELECTED:"flounder__option--selected",SELECTED_HIDDEN:"flounder__option--selected--hidden",SELECTED_DISPLAYED:"flounder__option--selected--displayed",SEARCH:"flounder__input--search",SEARCH_HIDDEN:"flounder--search--hidden",SELECT_TAG:"flounder--select--tag"};s["default"]=i,t.exports=s["default"]},{}],3:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={classes:{flounder:"",hidden:"flounder--hidden",selected:"flounder__option--selected",wrapper:""},defaultTextIndent:0,multiple:!1,multipleTags:!0,multipleMessage:"(Multiple Items Selected)",onClose:function(){},onComponentDidMount:function(){},onInit:function(){},onOpen:function(){},onSelect:function(){},options:[],placeholder:"Please choose an option",search:!1};s["default"]=i,t.exports=s["default"]},{}],4:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(s,"__esModule",{value:!0});var a=function(){function e(e,t){var s=[],i=!0,n=!1,a=void 0;try{for(var l,r=e[Symbol.iterator]();!(i=(l=r.next()).done)&&(s.push(l.value),!t||s.length!==t);i=!0);}catch(o){n=!0,a=o}finally{try{!i&&r["return"]&&r["return"]()}finally{if(n)throw a}}return s}return function(t,s){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,s);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),l=function(){function e(e,t){for(var s=0;sl?r=0:0>r&&(r=l),n.selectedIndex=r;var o=this.hasClass;(o(a[r],c["default"].HIDDEN)||o(a[r],c["default"].SELECTED_HIDDEN)||o(a[r],c["default"].DISABLED))&&this.setKeypress(e)}},{key:"setSelectValue",value:function(e,t){var s=this.refs,i=void 0;t?(this.setSelectValueClick(t),i=!0):(i=this.checkSelect(e),i&&this.setSelectValueButton(e)),i&&(this.displaySelected(s.selected,s),this.___programmaticClick?this.___programmaticClick=!1:this.onSelect(t,this.getSelectedValues()))}},{key:"setSelectValueButton",value:function(){var e=this.refs,t=e.data,s=(e.select,this.selectedClass),i=void 0;this.removeSelectedClass(t);var n=this.getSelectedOptions(),a=n[0];a&&(i=t[a.index],this.addClass(i,s),this.scrollTo(i))}},{key:"setSelectValueClick",value:function(e){var t=this.multiple,s=this.refs,i=this.selectedClass,n=void 0,a=void 0;t&&(!t||this.multipleTags||e[this.multiSelect])||this.___forceMultiple||this.deselectAll(),this.___forceMultiple=!1;var l=e.target;this.toggleClass(l,i),n=l.getAttribute("data-index"),a=s.selectOptions[n],a.selected=a.selected===!0?!1:!0}},{key:"setTextMultiTagIndent",value:function(){var e=this,t=this.refs.search,s=this.defaultTextIndent;if(t){var i=document.getElementsByClassName(c["default"].MULTIPLE_SELECT_TAG);i.each(function(t,i){s+=e.getActualWidth(i)}),t.style.textIndent=s+"px"}}},{key:"showElement",value:function(e){this.removeClass(e,c["default"].HIDDEN)}},{key:"toggleList",value:function(e,t){var s=this.refs,i=s.optionsListWrapper,n=s.wrapper,a=this.hasClass;"open"===t||"close"!==t&&a(i,c["default"].HIDDEN)?(this.toggleList.justOpened=!0,this.toggleOpen(e,i,s,n)):"close"!==t&&a(i,c["default"].HIDDEN)||(this.toggleList.justOpened=!1,this.toggleClosed(e,i,s,n))}},{key:"toggleOpen",value:function(e,t,s,i){if(this.addSelectKeyListener(),(!this.isIos||this.multipleTags===!0&&this.multiple===!0)&&(this.showElement(t),this.addClass(i,"open"),document.querySelector("html").addEventListener("click",this.catchBodyClick),document.querySelector("html").addEventListener("touchend",this.catchBodyClick)),!this.multiple){var n=s.select.selectedIndex,a=s.data[n];a&&this.scrollTo(a)}this.props.search&&s.search.focus(),this.onOpen(e,this.getSelectedValues())}},{key:"toggleClosed",value:function(e,t,s,i){this.hideElement(t),this.removeSelectKeyListener(),this.removeClass(i,"open");var n=document.querySelector("html");n.removeEventListener("click",this.catchBodyClick),n.removeEventListener("touchend",this.catchBodyClick),this.props.search&&this.fuzzySearchReset(),s.flounder.focus(),this.onClose(e,this.getSelectedValues())}}]),e}();h["default"].extendClass(v,h["default"],p["default"]),s["default"]=v,t.exports=s["default"]},{"./api":1,"./classes":2,"./defaults":3,"./utils":5}],5:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={addClass:function(e,t){var s=e.className,n=s.length;i.hasClass(e,t)||s.slice(0,t.length+1)===t+" "||s.slice(n-t.length-1,n)===" "+t||(e.className+=" "+t)},attachAttributes:function(e,t){for(var s in t)-1!==s.indexOf("data-")?e.setAttribute(s,t[s]):e[s]=t[s]},constructElement:function(e){var t=document.createElement(e.tagname||"div");return i.attachAttributes(t,e),t},extendClass:function(e){e=e.prototype;for(var t=function(t){for(var s in t)Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s])},s=arguments.length,i=Array(s>1?s-1:0),n=1;s>n;n++)i[n-1]=arguments[n];for(var a=0,l=i.length;l>a;a++){var r=i[a];t(r)}return e},escapeHTML:function(e){return String(e).replace(/&/g,"&").replace(//g,">").replace(/"/g,""")},hasClass:function(e,t){var s=e.className,i=new RegExp("(^"+t+" )|( "+t+"$)|( "+t+" )|(^"+t+"$)");return!!s.match(i)},iosVersion:function(){return/iPad|iPhone|iPod/.test(navigator.platform)?window.indexedDB?"8+":window.SpeechSynthesisUtterance?"7":window.webkitAudioContext?"6":"5-":!1},removeClass:function(e,t){var s=e.className,i=s.length,n=t.length;s.slice(0,n+1)===t+" "&&(e.className=s.slice(n+1,i)),s.slice(i-n-1,i)===" "+t&&(e.className=s.slice(0,i-n-1)),e.className=e.className.trim()},scrollTo:function(e){var t=e.parentNode.parentNode,s=e.offsetHeight,i=t.scrollTop,n=t.scrollTop+t.offsetHeight-e.offsetHeight,a=e.offsetTop;i>a?t.scrollTop=a-.5*s:a>n&&(t.scrollTop=a-t.offsetHeight+1.5*s)},setPlatform:function(){var e=this.isOsx=-1===window.navigator.platform.indexOf("Mac")?!1:!0;this.isIos=this.iosVersion(),this.multiSelect=e?"metaKey":"ctrlKey"},toggleClass:function(e,t){var s=i.addClass,n=i.removeClass;i.hasClass(e,t)?n(e,t):s(e,t)}};s["default"]=i,t.exports=s["default"]},{}],6:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}var n=e("../core/flounder.jsx"),a=i(n);!function(e){e.core.flounder=function(e){return new a["default"](this,e)}}(µ)},{"../core/flounder.jsx":4}]},{},[6]); \ No newline at end of file diff --git a/dist/flounder.min.js b/dist/flounder.min.js index c138288..6a0465a 100644 --- a/dist/flounder.min.js +++ b/dist/flounder.min.js @@ -1,2 +1,2 @@ -/*! Flounder v0.2.1 | (c) 2015 Sociomantic Labs | https://github.com/sociomantic/flounder/license */ -!function e(t,s,i){function a(l,r){if(!s[l]){if(!t[l]){var o="function"==typeof require&&require;if(!r&&o)return o(l,!0);if(n)return n(l,!0);var u=new Error("Cannot find module '"+l+"'");throw u.code="MODULE_NOT_FOUND",u}var c=s[l]={exports:{}};t[l][0].call(c.exports,function(e){var s=t[l][1][e];return a(s?s:e)},c,c.exports,e,t,s,i)}return s[l].exports}for(var n="function"==typeof require&&require,l=0;la;a++)s=i[a],s.selected&&t.push(s);return t},getSelectedValues:function(){return this.getSelectedOptions().map(function(e){return e.value})},rebuildSelect:function(e){var t=this,s=this.refs,i=s.select.selectedOptions;i=Array.prototype.slice.call(i).map(function(e){return e.value}),this.removeOptionsListeners(),s.select.innerHTML="",s.optionsList.innerHTML="";var n=s.select;s.select=!1;var l=this.buildData(this._default,e,s.optionsList,n),r=a(l,2);s.data=r[0],s.selectOptions=r[1],s.select=n,this.removeSelectedValue(),this.removeSelectedClass(),s.selectOptions.forEach(function(e,a){var n=i.indexOf(e.value);-1!==n&&(i.splice(n,1),e.selected=!0,t.addClass(s.data[a],t.selectedClass))}),this.addOptionsListeners()},setIndex:function(e,t){var s=this.refs;if("string"!=typeof e&&e.length){var i=this.setIndex;return e.map(i)}var a=s.data[e];if(a){var n=this.hasClass(s.wrapper,"open");return this.toggleList(n?"close":"open"),this.___forceMultiple=t,this.___programmaticClick=!0,a.click(),a}return null},setValue:function(e,t){if("string"!=typeof e&&e.length){var s=this.setValue;return e.map(s)}return e=this.refs.select.querySelector('[value="'+e+'"]'),e?this.setIndex(e.index,t):null}};s["default"]=r,t.exports=s["default"]},{"./classes":2}],2:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={ARROW:"flounder__arrow",DESCRIPTION:"flounder__option--description",DISABLED:"flounder__disabled",DISABLED_OPTION:"flounder__disabled--option",HIDDEN:"flounder--hidden",HIDDEN_IOS:"flounder--hidden--ios",LIST:"flounder__list",MAIN:"flounder",MAIN_WRAPPER:"flounder--wrapper flounder__input--select",MULTI_TAG_LIST:"flounder__multi--tag--list",MULTIPLE_SELECT_TAG:"flounder__multiple--select--tag",MULTIPLE_TAG_CLOSE:"flounder__multiple__tag__close",OPTION:"flounder__option",OPTION_TAG:"flounder--option--tag",OPTIONS_WRAPPER:"flounder__list--wrapper",SELECTED:"flounder__option--selected",SELECTED_HIDDEN:"flounder__option--selected--hidden",SELECTED_DISPLAYED:"flounder__option--selected--displayed",SEARCH:"flounder__input--search",SEARCH_HIDDEN:"flounder--search--hidden",SELECT_TAG:"flounder--select--tag"};s["default"]=i,t.exports=s["default"]},{}],3:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={classes:{flounder:"",hidden:"flounder--hidden",selected:"flounder__option--selected",wrapper:""},defaultTextIndent:0,multiple:!1,multipleTags:!0,multipleMessage:"(Multiple Items Selected)",onClose:function(){},onComponentDidMount:function(){},onInit:function(){},onOpen:function(){},onSelect:function(){},options:[],placeholder:"Please choose an option",search:!1};s["default"]=i,t.exports=s["default"]},{}],4:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(s,"__esModule",{value:!0});var n=function(){function e(e,t){var s=[],i=!0,a=!1,n=void 0;try{for(var l,r=e[Symbol.iterator]();!(i=(l=r.next()).done)&&(s.push(l.value),!t||s.length!==t);i=!0);}catch(o){a=!0,n=o}finally{try{!i&&r["return"]&&r["return"]()}finally{if(a)throw n}}return s}return function(t,s){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,s);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),l=function(){function e(e,t){for(var s=0;sl?r=0:0>r&&(r=l),a.selectedIndex=r;var o=this.hasClass;o(n[r],c["default"].HIDDEN)&&o(n[r],c["default"].SELECTED_HIDDEN)&&this.setKeypress(e)}},{key:"setSelectValue",value:function(e,t){var s=this.refs,i=void 0;t?(this.setSelectValueClick(t),i=!0):(i=this.checkSelect(e),i&&this.setSelectValueButton(e)),i&&(this.displaySelected(s.selected,s),this.___programmaticClick?this.___programmaticClick=!1:this.onSelect(t,this.getSelectedValues()))}},{key:"setSelectValueButton",value:function(){var e=this.refs,t=e.data,s=(e.select,this.selectedClass),i=void 0;this.removeSelectedClass(t);var a=this.getSelectedOptions(),n=a[0];n&&(i=t[n.index],this.addClass(i,s),this.scrollTo(i))}},{key:"setSelectValueClick",value:function(e){var t=this.multiple,s=this.refs,i=this.selectedClass,a=void 0,n=void 0;t&&(!t||this.multipleTags||e[this.multiSelect])||this.___forceMultiple||this.deselectAll(),this.___forceMultiple=!1;var l=e.target;this.toggleClass(l,i),a=l.getAttribute("data-index"),n=s.selectOptions[a],n.selected=n.selected===!0?!1:!0}},{key:"setTextMultiTagIndent",value:function(){var e=this,t=this.refs.search,s=this.defaultTextIndent;if(t){var i=document.getElementsByClassName(c["default"].MULTIPLE_SELECT_TAG);i.each(function(t,i){s+=e.getActualWidth(i)}),t.style.textIndent=s+"px"}}},{key:"showElement",value:function(e){this.removeClass(e,c["default"].HIDDEN)}},{key:"toggleList",value:function(e,t){var s=this.refs,i=s.optionsListWrapper,a=s.wrapper,n=this.hasClass;"open"===t||"close"!==t&&n(i,c["default"].HIDDEN)?(this.toggleList.justOpened=!0,this.toggleOpen(e,i,s,a)):"close"!==t&&n(i,c["default"].HIDDEN)||(this.toggleList.justOpened=!1,this.toggleClosed(e,i,s,a))}},{key:"toggleOpen",value:function(e,t,s,i){if(this.addSelectKeyListener(),(!this.isIos||this.multipleTags===!0&&this.multiple===!0)&&(this.showElement(t),this.addClass(i,"open"),document.querySelector("html").addEventListener("click",this.catchBodyClick),document.querySelector("html").addEventListener("touchend",this.catchBodyClick)),!this.multiple){var a=s.select.selectedIndex,n=s.data[a];n&&this.scrollTo(n)}this.props.search&&s.search.focus(),this.onOpen(e,this.getSelectedValues())}},{key:"toggleClosed",value:function(e,t,s,i){this.hideElement(t),this.removeSelectKeyListener(),this.removeClass(i,"open");var a=document.querySelector("html");a.removeEventListener("click",this.catchBodyClick),a.removeEventListener("touchend",this.catchBodyClick),this.props.search&&this.fuzzySearchReset(),s.flounder.focus(),this.onClose(e,this.getSelectedValues())}}]),e}();h["default"].extendClass(v,h["default"],p["default"]),s["default"]=v,t.exports=s["default"]},{"./api":1,"./classes":2,"./defaults":3,"./utils":5}],5:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={addClass:function(e,t){var s=e.className,a=s.length;i.hasClass(e,t)||s.slice(0,t.length+1)===t+" "||s.slice(a-t.length-1,a)===" "+t||(e.className+=" "+t)},attachAttributes:function(e,t){for(var s in t)-1!==s.indexOf("data-")?e.setAttribute(s,t[s]):e[s]=t[s]},constructElement:function(e){var t=document.createElement(e.tagname||"div");return i.attachAttributes(t,e),t},extendClass:function(e){e=e.prototype;for(var t=function(t){for(var s in t)Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s])},s=arguments.length,i=Array(s>1?s-1:0),a=1;s>a;a++)i[a-1]=arguments[a];for(var n=0,l=i.length;l>n;n++){var r=i[n];t(r)}return e},escapeHTML:function(e){return String(e).replace(/&/g,"&").replace(//g,">").replace(/"/g,""")},hasClass:function(e,t){var s=e.className,i=new RegExp("(^"+t+" )|( "+t+"$)|( "+t+" )|(^"+t+"$)");return!!s.match(i)},iosVersion:function(){return/iPad|iPhone|iPod/.test(navigator.platform)?window.indexedDB?"8+":window.SpeechSynthesisUtterance?"7":window.webkitAudioContext?"6":"5-":!1},removeClass:function(e,t){var s=e.className,i=s.length,a=t.length;s.slice(0,a+1)===t+" "&&(e.className=s.slice(a+1,i)),s.slice(i-a-1,i)===" "+t&&(e.className=s.slice(0,i-a-1)),e.className=e.className.trim()},scrollTo:function(e){var t=e.parentNode.parentNode,s=e.offsetHeight,i=t.scrollTop,a=t.scrollTop+t.offsetHeight-e.offsetHeight,n=e.offsetTop;i>n?t.scrollTop=n-.5*s:n>a&&(t.scrollTop=n-t.offsetHeight+1.5*s)},setPlatform:function(){var e=this.isOsx=-1===window.navigator.platform.indexOf("Mac")?!1:!0;this.isIos=this.iosVersion(),this.multiSelect=e?"metaKey":"ctrlKey"},toggleClass:function(e,t){var s=i.addClass,a=i.removeClass;i.hasClass(e,t)?a(e,t):s(e,t)}};s["default"]=i,t.exports=s["default"]},{}]},{},[4]); \ No newline at end of file +/*! Flounder v0.2.2 | (c) 2015 Sociomantic Labs | https://github.com/sociomantic/flounder/license */ +!function e(t,s,i){function a(l,r){if(!s[l]){if(!t[l]){var o="function"==typeof require&&require;if(!r&&o)return o(l,!0);if(n)return n(l,!0);var u=new Error("Cannot find module '"+l+"'");throw u.code="MODULE_NOT_FOUND",u}var c=s[l]={exports:{}};t[l][0].call(c.exports,function(e){var s=t[l][1][e];return a(s?s:e)},c,c.exports,e,t,s,i)}return s[l].exports}for(var n="function"==typeof require&&require,l=0;la;a++)s=i[a],s.selected&&t.push(s);return t},getSelectedValues:function(){return this.getSelectedOptions().map(function(e){return e.value})},rebuildSelect:function(e){var t=this,s=this.refs,i=s.select.selectedOptions;i=Array.prototype.slice.call(i).map(function(e){return e.value}),this.removeOptionsListeners(),s.select.innerHTML="",s.optionsList.innerHTML="";var n=s.select;s.select=!1;var l=this.buildData(this._default,e,s.optionsList,n),r=a(l,2);s.data=r[0],s.selectOptions=r[1],s.select=n,this.removeSelectedValue(),this.removeSelectedClass(),s.selectOptions.forEach(function(e,a){var n=i.indexOf(e.value);-1!==n&&(i.splice(n,1),e.selected=!0,t.addClass(s.data[a],t.selectedClass))}),this.addOptionsListeners()},setIndex:function(e,t){var s=this.refs;if("string"!=typeof e&&e.length){var i=this.setIndex;return e.map(i)}var a=s.data[e];if(a){var n=this.hasClass(s.wrapper,"open");return this.toggleList(n?"close":"open"),this.___forceMultiple=t,this.___programmaticClick=!0,a.click(),a}return null},setValue:function(e,t){if("string"!=typeof e&&e.length){var s=this.setValue;return e.map(s)}return e=this.refs.select.querySelector('[value="'+e+'"]'),e?this.setIndex(e.index,t):null}};s["default"]=r,t.exports=s["default"]},{"./classes":2}],2:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={ARROW:"flounder__arrow",DESCRIPTION:"flounder__option--description",DISABLED:"flounder__disabled",DISABLED_OPTION:"flounder__disabled--option",HEADER:"flounder__header",HIDDEN:"flounder--hidden",HIDDEN_IOS:"flounder--hidden--ios",LIST:"flounder__list",MAIN:"flounder",MAIN_WRAPPER:"flounder--wrapper flounder__input--select",MULTI_TAG_LIST:"flounder__multi--tag--list",MULTIPLE_SELECT_TAG:"flounder__multiple--select--tag",MULTIPLE_TAG_CLOSE:"flounder__multiple__tag__close",OPTION:"flounder__option",OPTION_TAG:"flounder--option--tag",OPTIONS_WRAPPER:"flounder__list--wrapper",SECTION:"flounder__section",SELECTED:"flounder__option--selected",SELECTED_HIDDEN:"flounder__option--selected--hidden",SELECTED_DISPLAYED:"flounder__option--selected--displayed",SEARCH:"flounder__input--search",SEARCH_HIDDEN:"flounder--search--hidden",SELECT_TAG:"flounder--select--tag"};s["default"]=i,t.exports=s["default"]},{}],3:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={classes:{flounder:"",hidden:"flounder--hidden",selected:"flounder__option--selected",wrapper:""},defaultTextIndent:0,multiple:!1,multipleTags:!0,multipleMessage:"(Multiple Items Selected)",onClose:function(){},onComponentDidMount:function(){},onInit:function(){},onOpen:function(){},onSelect:function(){},options:[],placeholder:"Please choose an option",search:!1};s["default"]=i,t.exports=s["default"]},{}],4:[function(e,t,s){"use strict";function i(e){return e&&e.__esModule?e:{"default":e}}function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(s,"__esModule",{value:!0});var n=function(){function e(e,t){var s=[],i=!0,a=!1,n=void 0;try{for(var l,r=e[Symbol.iterator]();!(i=(l=r.next()).done)&&(s.push(l.value),!t||s.length!==t);i=!0);}catch(o){a=!0,n=o}finally{try{!i&&r["return"]&&r["return"]()}finally{if(a)throw n}}return s}return function(t,s){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,s);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),l=function(){function e(e,t){for(var s=0;sl?r=0:0>r&&(r=l),a.selectedIndex=r;var o=this.hasClass;(o(n[r],c["default"].HIDDEN)||o(n[r],c["default"].SELECTED_HIDDEN)||o(n[r],c["default"].DISABLED))&&this.setKeypress(e)}},{key:"setSelectValue",value:function(e,t){var s=this.refs,i=void 0;t?(this.setSelectValueClick(t),i=!0):(i=this.checkSelect(e),i&&this.setSelectValueButton(e)),i&&(this.displaySelected(s.selected,s),this.___programmaticClick?this.___programmaticClick=!1:this.onSelect(t,this.getSelectedValues()))}},{key:"setSelectValueButton",value:function(){var e=this.refs,t=e.data,s=(e.select,this.selectedClass),i=void 0;this.removeSelectedClass(t);var a=this.getSelectedOptions(),n=a[0];n&&(i=t[n.index],this.addClass(i,s),this.scrollTo(i))}},{key:"setSelectValueClick",value:function(e){var t=this.multiple,s=this.refs,i=this.selectedClass,a=void 0,n=void 0;t&&(!t||this.multipleTags||e[this.multiSelect])||this.___forceMultiple||this.deselectAll(),this.___forceMultiple=!1;var l=e.target;this.toggleClass(l,i),a=l.getAttribute("data-index"),n=s.selectOptions[a],n.selected=n.selected===!0?!1:!0}},{key:"setTextMultiTagIndent",value:function(){var e=this,t=this.refs.search,s=this.defaultTextIndent;if(t){var i=document.getElementsByClassName(c["default"].MULTIPLE_SELECT_TAG);i.each(function(t,i){s+=e.getActualWidth(i)}),t.style.textIndent=s+"px"}}},{key:"showElement",value:function(e){this.removeClass(e,c["default"].HIDDEN)}},{key:"toggleList",value:function(e,t){var s=this.refs,i=s.optionsListWrapper,a=s.wrapper,n=this.hasClass;"open"===t||"close"!==t&&n(i,c["default"].HIDDEN)?(this.toggleList.justOpened=!0,this.toggleOpen(e,i,s,a)):"close"!==t&&n(i,c["default"].HIDDEN)||(this.toggleList.justOpened=!1,this.toggleClosed(e,i,s,a))}},{key:"toggleOpen",value:function(e,t,s,i){if(this.addSelectKeyListener(),(!this.isIos||this.multipleTags===!0&&this.multiple===!0)&&(this.showElement(t),this.addClass(i,"open"),document.querySelector("html").addEventListener("click",this.catchBodyClick),document.querySelector("html").addEventListener("touchend",this.catchBodyClick)),!this.multiple){var a=s.select.selectedIndex,n=s.data[a];n&&this.scrollTo(n)}this.props.search&&s.search.focus(),this.onOpen(e,this.getSelectedValues())}},{key:"toggleClosed",value:function(e,t,s,i){this.hideElement(t),this.removeSelectKeyListener(),this.removeClass(i,"open");var a=document.querySelector("html");a.removeEventListener("click",this.catchBodyClick),a.removeEventListener("touchend",this.catchBodyClick),this.props.search&&this.fuzzySearchReset(),s.flounder.focus(),this.onClose(e,this.getSelectedValues())}}]),e}();h["default"].extendClass(v,h["default"],p["default"]),s["default"]=v,t.exports=s["default"]},{"./api":1,"./classes":2,"./defaults":3,"./utils":5}],5:[function(e,t,s){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var i={addClass:function(e,t){var s=e.className,a=s.length;i.hasClass(e,t)||s.slice(0,t.length+1)===t+" "||s.slice(a-t.length-1,a)===" "+t||(e.className+=" "+t)},attachAttributes:function(e,t){for(var s in t)-1!==s.indexOf("data-")?e.setAttribute(s,t[s]):e[s]=t[s]},constructElement:function(e){var t=document.createElement(e.tagname||"div");return i.attachAttributes(t,e),t},extendClass:function(e){e=e.prototype;for(var t=function(t){for(var s in t)Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s])},s=arguments.length,i=Array(s>1?s-1:0),a=1;s>a;a++)i[a-1]=arguments[a];for(var n=0,l=i.length;l>n;n++){var r=i[n];t(r)}return e},escapeHTML:function(e){return String(e).replace(/&/g,"&").replace(//g,">").replace(/"/g,""")},hasClass:function(e,t){var s=e.className,i=new RegExp("(^"+t+" )|( "+t+"$)|( "+t+" )|(^"+t+"$)");return!!s.match(i)},iosVersion:function(){return/iPad|iPhone|iPod/.test(navigator.platform)?window.indexedDB?"8+":window.SpeechSynthesisUtterance?"7":window.webkitAudioContext?"6":"5-":!1},removeClass:function(e,t){var s=e.className,i=s.length,a=t.length;s.slice(0,a+1)===t+" "&&(e.className=s.slice(a+1,i)),s.slice(i-a-1,i)===" "+t&&(e.className=s.slice(0,i-a-1)),e.className=e.className.trim()},scrollTo:function(e){var t=e.parentNode.parentNode,s=e.offsetHeight,i=t.scrollTop,a=t.scrollTop+t.offsetHeight-e.offsetHeight,n=e.offsetTop;i>n?t.scrollTop=n-.5*s:n>a&&(t.scrollTop=n-t.offsetHeight+1.5*s)},setPlatform:function(){var e=this.isOsx=-1===window.navigator.platform.indexOf("Mac")?!1:!0;this.isIos=this.iosVersion(),this.multiSelect=e?"metaKey":"ctrlKey"},toggleClass:function(e,t){var s=i.addClass,a=i.removeClass;i.hasClass(e,t)?a(e,t):s(e,t)}};s["default"]=i,t.exports=s["default"]},{}]},{},[4]); \ No newline at end of file diff --git a/dist/flounder.react.js b/dist/flounder.react.js index f42d8db..90041c0 100644 --- a/dist/flounder.react.js +++ b/dist/flounder.react.js @@ -1,5 +1,5 @@ /*! - * Flounder JavaScript Styleable Selectbox v0.2.1 + * Flounder JavaScript Styleable Selectbox v0.2.2 * https://github.com/sociomantic/flounder * * Copyright 2015 Sociomantic Labs and other contributors @@ -19272,6 +19272,7 @@ var classes = { DESCRIPTION: 'flounder__option--description', DISABLED: 'flounder__disabled', DISABLED_OPTION: 'flounder__disabled--option', + HEADER: 'flounder__header', HIDDEN: 'flounder--hidden', HIDDEN_IOS: 'flounder--hidden--ios', LIST: 'flounder__list', @@ -19283,6 +19284,7 @@ var classes = { OPTION: 'flounder__option', OPTION_TAG: 'flounder--option--tag', OPTIONS_WRAPPER: 'flounder__list--wrapper', + SECTION: 'flounder__section', SELECTED: 'flounder__option--selected', SELECTED_HIDDEN: 'flounder__option--selected--hidden', SELECTED_DISPLAYED: 'flounder__option--selected--displayed', @@ -19616,15 +19618,28 @@ var Flounder = (function () { }, { key: 'buildData', value: function buildData(defaultValue, _data, optionsList, select) { - var _this3 = this; - _data = _data || []; + var index = 0; var data = []; var selectOptions = []; var constructElement = this.constructElement; var addOptionDescription = this.addOptionDescription; + var selectedClass = this.selectedClass; + var escapeHTML = this.escapeHTML; + var addClass = this.addClass; + var selectRef = this.refs.select; - _data.forEach(function (dataObj, i) { + /** + * ## buildDiv + * + * builds an individual div tag for a flounder dropdown + * + * @param {Object} dataObj [description] + * @param {Number} i index + * + * @return {DOMElement} + */ + var buildDiv = function buildDiv(dataObj, i) { if (typeof dataObj !== 'object') { dataObj = { text: dataObj, @@ -19633,7 +19648,7 @@ var Flounder = (function () { } dataObj.index = i; - var extraClass = i === defaultValue.index ? ' ' + _this3.selectedClass : ''; + var extraClass = i === defaultValue.index ? ' ' + selectedClass : ''; var res = { className: _classes3['default'].OPTION + extraClass, @@ -19646,36 +19661,79 @@ var Flounder = (function () { } } - data[i] = constructElement(res); - var escapedText = _this3.escapeHTML(dataObj.text); - data[i].innerHTML = escapedText; - optionsList.appendChild(data[i]); + var data = constructElement(res); + var escapedText = escapeHTML(dataObj.text); + data.innerHTML = escapedText; if (dataObj.description) { - addOptionDescription(data[i], dataObj.description); + addOptionDescription(data, dataObj.description); } - data[i].className += dataObj.extraClass ? ' ' + dataObj.extraClass : ''; + data.className += dataObj.extraClass ? ' ' + dataObj.extraClass : ''; + + return data; + }; - if (!_this3.refs.select) { - selectOptions[i] = constructElement({ tagname: 'option', + /** + * ## buildOption + * + * builds an individual option tag for a flounder dropdown + * + * @param {Object} dataObj [description] + * @param {Number} i index + * + * @return {DOMElement} + */ + var buildOption = function buildOption(dataObj, i) { + var selectOption = undefined; + + if (!selectRef) { + selectOption = constructElement({ tagname: 'option', className: _classes3['default'].OPTION_TAG, value: dataObj.value }); - selectOptions[i].innerHTML = escapedText; - select.appendChild(selectOptions[i]); + var escapedText = escapeHTML(dataObj.text); + selectOption.innerHTML = escapedText; + select.appendChild(selectOption); } else { var selectChild = select.children[i]; - - selectOptions[i] = selectChild; + selectOption = selectChild; selectChild.setAttribute('value', selectChild.value); } if (i === defaultValue.index) { - selectOptions[i].selected = true; + selectOption.selected = true; + } + + if (selectOption.getAttribute('disabled')) { + addClass(data[i], _classes3['default'].DISABLED_OPTION); } - if (selectOptions[i].getAttribute('disabled')) { - _this3.addClass(data[i], _classes3['default'].DISABLED_OPTION); + return selectOption; + }; + + _data.forEach(function (dataObj) { + if (dataObj.header) { + (function () { + var section = constructElement({ tagname: 'div', + className: _classes3['default'].SECTION }); + var header = constructElement({ tagname: 'div', + className: _classes3['default'].HEADER }); + header.textContent = dataObj.header; + section.appendChild(header); + optionsList.appendChild(section); + + dataObj.data.forEach(function (_dataObj) { + data[index] = buildDiv(_dataObj, index); + section.appendChild(data[index]); + selectOptions[index] = buildOption(_dataObj, index); + index++; + }); + })(); + } else { + data[index] = buildDiv(dataObj, index); + optionsList.appendChild(data[index]); + selectOptions[index] = buildOption(dataObj, index); + index++; } }); @@ -19949,7 +20007,7 @@ var Flounder = (function () { key: 'fuzzySearch', value: function fuzzySearch(e) // disclaimer: not actually fuzzy { - var _this4 = this; + var _this3 = this; e.preventDefault(); var keyCode = e.keyCode; @@ -19958,13 +20016,13 @@ var Flounder = (function () { (function () { var term = e.target.value.toLowerCase(); - _this4.refs.data.forEach(function (dataObj) { + _this3.refs.data.forEach(function (dataObj) { var text = dataObj.innerHTML.toLowerCase(); if (term !== '' && text.indexOf(term) === -1) { - _this4.addClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this3.addClass(dataObj, _classes3['default'].SEARCH_HIDDEN); } else { - _this4.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this3.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); } }); })(); @@ -19984,10 +20042,10 @@ var Flounder = (function () { }, { key: 'fuzzySearchReset', value: function fuzzySearchReset() { - var _this5 = this; + var _this4 = this; this.refs.data.forEach(function (dataObj) { - _this5.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); + _this4.removeClass(dataObj, _classes3['default'].SEARCH_HIDDEN); }); this.refs.search.value = ''; @@ -20082,16 +20140,16 @@ var Flounder = (function () { }, { key: 'initSelectBox', value: function initSelectBox(wrapper) { - var _this6 = this; + var _this5 = this; var target = this.target; var select = undefined; if (target.tagName === 'SELECT') { (function () { - _this6.addClass(target, _classes3['default'].SELECT_TAG); - _this6.addClass(target, _classes3['default'].HIDDEN); - _this6.refs.select = target; + _this5.addClass(target, _classes3['default'].SELECT_TAG); + _this5.addClass(target, _classes3['default'].HIDDEN); + _this5.refs.select = target; var data = [], selectOptions = []; @@ -20104,12 +20162,12 @@ var Flounder = (function () { }); }); - _this6.data = data; - _this6.target = target.parentNode; - _this6.refs.selectOptions = selectOptions; + _this5.data = data; + _this5.target = target.parentNode; + _this5.refs.selectOptions = selectOptions; - select = _this6.refs.select; - _this6.addClass(select, _classes3['default'].HIDDEN); + select = _this5.refs.select; + _this5.addClass(select, _classes3['default'].HIDDEN); })(); } else { select = this.constructElement({ tagname: 'select', className: _classes3['default'].SELECT_TAG + ' ' + _classes3['default'].HIDDEN }); @@ -20185,11 +20243,11 @@ var Flounder = (function () { }, { key: 'removeOptionsListeners', value: function removeOptionsListeners() { - var _this7 = this; + var _this6 = this; this.refs.data.forEach(function (dataObj) { if (dataObj.tagName === 'DIV') { - dataObj.removeEventListener('click', _this7.clickSet); + dataObj.removeEventListener('click', _this6.clickSet); } }); } @@ -20274,12 +20332,12 @@ var Flounder = (function () { }, { key: 'removeSelectedClass', value: function removeSelectedClass(data) { - var _this8 = this; + var _this7 = this; data = data || this.refs.data; data.forEach(function (dataObj, i) { - _this8.removeClass(dataObj, _this8.selectedClass); + _this7.removeClass(dataObj, _this7.selectedClass); }); } @@ -20293,12 +20351,12 @@ var Flounder = (function () { }, { key: 'removeSelectedValue', value: function removeSelectedValue(data) { - var _this9 = this; + var _this8 = this; data = data || this.refs.data; data.forEach(function (_d, i) { - _this9.refs.select[i].selected = false; + _this8.refs.select[i].selected = false; }); } @@ -20464,7 +20522,7 @@ var Flounder = (function () { selectTag.selectedIndex = index; var hasClass = this.hasClass; - if (hasClass(data[index], _classes3['default'].HIDDEN) && hasClass(data[index], _classes3['default'].SELECTED_HIDDEN)) { + if (hasClass(data[index], _classes3['default'].HIDDEN) || hasClass(data[index], _classes3['default'].SELECTED_HIDDEN) || hasClass(data[index], _classes3['default'].DISABLED)) { this.setKeypress(e); } } @@ -20586,7 +20644,7 @@ var Flounder = (function () { }, { key: 'setTextMultiTagIndent', value: function setTextMultiTagIndent() { - var _this10 = this; + var _this9 = this; var search = this.refs.search; var offset = this.defaultTextIndent; @@ -20594,7 +20652,7 @@ var Flounder = (function () { if (search) { var _els = document.getElementsByClassName(_classes3['default'].MULTIPLE_SELECT_TAG); _els.each(function (i, e) { - offset += _this10.getActualWidth(e); + offset += _this9.getActualWidth(e); }); search.style.textIndent = offset + 'px'; diff --git a/dist/flounder.react.min.js b/dist/flounder.react.min.js index ef7c429..006e76b 100644 --- a/dist/flounder.react.min.js +++ b/dist/flounder.react.min.js @@ -1,9 +1,9 @@ -/*! Flounder v0.2.1 | (c) 2015 Sociomantic Labs | https://github.com/sociomantic/flounder/license */ +/*! Flounder v0.2.2 | (c) 2015 Sociomantic Labs | https://github.com/sociomantic/flounder/license */ !function e(t,n,o){function r(i,s){if(!n[i]){if(!t[i]){var u="function"==typeof require&&require;if(!s&&u)return u(i,!0);if(a)return a(i,!0);var c=new Error("Cannot find module '"+i+"'");throw c.code="MODULE_NOT_FOUND",c}var l=n[i]={exports:{}};t[i][0].call(l.exports,function(e){var n=t[i][1][e];return r(n?n:e)},l,l.exports,e,t,n,o)}return n[i].exports}for(var a="function"==typeof require&&require,i=0;i1)for(var n=1;n8&&11>=C),R=32,M=String.fromCharCode(R),x=f.topLevelTypes,w={beforeInput:{phasedRegistrationNames:{bubbled:E({onBeforeInput:null}),captured:E({onBeforeInputCapture:null})},dependencies:[x.topCompositionEnd,x.topKeyPress,x.topTextInput,x.topPaste]},compositionEnd:{phasedRegistrationNames:{bubbled:E({onCompositionEnd:null}),captured:E({onCompositionEndCapture:null})},dependencies:[x.topBlur,x.topCompositionEnd,x.topKeyDown,x.topKeyPress,x.topKeyUp,x.topMouseDown]},compositionStart:{phasedRegistrationNames:{bubbled:E({onCompositionStart:null}),captured:E({onCompositionStartCapture:null})},dependencies:[x.topBlur,x.topCompositionStart,x.topKeyDown,x.topKeyPress,x.topKeyUp,x.topMouseDown]},compositionUpdate:{phasedRegistrationNames:{bubbled:E({onCompositionUpdate:null}),captured:E({onCompositionUpdateCapture:null})},dependencies:[x.topBlur,x.topCompositionUpdate,x.topKeyDown,x.topKeyPress,x.topKeyUp,x.topMouseDown]}},T=!1,I=null,S={eventTypes:w,extractEvents:function(e,t,n,o,r){return[c(e,t,n,o,r),d(e,t,n,o,r)]}};t.exports=S},{"./EventConstants":16,"./EventPropagators":20,"./FallbackCompositionState":21,"./SyntheticCompositionEvent":92,"./SyntheticInputEvent":96,"fbjs/lib/ExecutionEnvironment":132,"fbjs/lib/keyOf":150}],5:[function(e,t,n){"use strict";function o(e,t){return e+t.charAt(0).toUpperCase()+t.substring(1)}var r={animationIterationCount:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,zoom:!0,fillOpacity:!0,stopOpacity:!0,strokeDashoffset:!0,strokeOpacity:!0,strokeWidth:!0},a=["Webkit","ms","Moz","O"];Object.keys(r).forEach(function(e){a.forEach(function(t){r[o(t,e)]=r[e]})});var i={background:{backgroundAttachment:!0,backgroundColor:!0,backgroundImage:!0,backgroundPositionX:!0,backgroundPositionY:!0,backgroundRepeat:!0},backgroundPosition:{backgroundPositionX:!0,backgroundPositionY:!0},border:{borderWidth:!0,borderStyle:!0,borderColor:!0},borderBottom:{borderBottomWidth:!0,borderBottomStyle:!0,borderBottomColor:!0},borderLeft:{borderLeftWidth:!0,borderLeftStyle:!0,borderLeftColor:!0},borderRight:{borderRightWidth:!0,borderRightStyle:!0,borderRightColor:!0},borderTop:{borderTopWidth:!0,borderTopStyle:!0,borderTopColor:!0},font:{fontStyle:!0,fontVariant:!0,fontWeight:!0,fontSize:!0,lineHeight:!0,fontFamily:!0},outline:{outlineWidth:!0,outlineStyle:!0,outlineColor:!0}},s={isUnitlessNumber:r,shorthandPropertyExpansions:i};t.exports=s},{}],6:[function(e,t,n){(function(n){"use strict";var o=e("./CSSProperty"),r=e("fbjs/lib/ExecutionEnvironment"),a=e("./ReactPerf"),i=e("fbjs/lib/camelizeStyleName"),s=e("./dangerousStyleValue"),u=e("fbjs/lib/hyphenateStyleName"),c=e("fbjs/lib/memoizeStringOnly"),l=e("fbjs/lib/warning"),p=c(function(e){return u(e)}),d=!1,f="cssFloat";if(r.canUseDOM){var h=document.createElement("div").style;try{h.font=""}catch(v){d=!0}void 0===document.documentElement.style.cssFloat&&(f="styleFloat")}if("production"!==n.env.NODE_ENV)var m=/^(?:webkit|moz|o)[A-Z]/,g=/;\s*$/,y={},E={},b=function(e){y.hasOwnProperty(e)&&y[e]||(y[e]=!0,"production"!==n.env.NODE_ENV?l(!1,"Unsupported style property %s. Did you mean %s?",e,i(e)):void 0)},_=function(e){y.hasOwnProperty(e)&&y[e]||(y[e]=!0,"production"!==n.env.NODE_ENV?l(!1,"Unsupported vendor-prefixed style property %s. Did you mean %s?",e,e.charAt(0).toUpperCase()+e.slice(1)):void 0)},N=function(e,t){E.hasOwnProperty(t)&&E[t]||(E[t]=!0,"production"!==n.env.NODE_ENV?l(!1,'Style property values shouldn\'t contain a semicolon. Try "%s: %s" instead.',e,t.replace(g,"")):void 0)},C=function(e,t){e.indexOf("-")>-1?b(e):m.test(e)?_(e):g.test(t)&&N(e,t)};var D={createMarkupForStyles:function(e){var t="";for(var o in e)if(e.hasOwnProperty(o)){var r=e[o];"production"!==n.env.NODE_ENV&&C(o,r),null!=r&&(t+=p(o)+":",t+=s(o,r)+";")}return t||null},setValueForStyles:function(e,t){var r=e.style;for(var a in t)if(t.hasOwnProperty(a)){"production"!==n.env.NODE_ENV&&C(a,t[a]);var i=s(a,t[a]);if("float"===a&&(a=f),i)r[a]=i;else{var u=d&&o.shorthandPropertyExpansions[a];if(u)for(var c in u)r[c]="";else r[a]=""}}}};a.measureMethods(D,"CSSPropertyOperations",{setValueForStyles:"setValueForStyles"}),t.exports=D}).call(this,e("_process"))},{"./CSSProperty":5,"./ReactPerf":73,"./dangerousStyleValue":107,_process:1,"fbjs/lib/ExecutionEnvironment":132,"fbjs/lib/camelizeStyleName":134,"fbjs/lib/hyphenateStyleName":145,"fbjs/lib/memoizeStringOnly":152,"fbjs/lib/warning":157}],7:[function(e,t,n){(function(n){"use strict";function o(){this._callbacks=null,this._contexts=null}var r=e("./PooledClass"),a=e("./Object.assign"),i=e("fbjs/lib/invariant");a(o.prototype,{enqueue:function(e,t){this._callbacks=this._callbacks||[],this._contexts=this._contexts||[],this._callbacks.push(e),this._contexts.push(t)},notifyAll:function(){var e=this._callbacks,t=this._contexts;if(e){e.length!==t.length?"production"!==n.env.NODE_ENV?i(!1,"Mismatched list of contexts in callback queue"):i(!1):void 0,this._callbacks=null,this._contexts=null;for(var o=0;o8));var j=!1;_.canUseDOM&&(j=O("input")&&(!("documentMode"in document)||document.documentMode>9));var A={get:function(){return P.get.call(this)},set:function(e){S=""+e,P.set.call(this,e)}},V={eventTypes:w,extractEvents:function(e,t,n,r,a){var i,s;if(o(t)?k?i=u:s=c:R(t)?j?i=f:(i=v,s=h):m(t)&&(i=g),i){var l=i(e,t,n);if(l){var p=C.getPooled(w.change,l,r,a);return p.type="change",b.accumulateTwoPhaseDispatches(p),p}}s&&s(e,t,n)}};t.exports=V},{"./EventConstants":16,"./EventPluginHub":17,"./EventPropagators":20,"./ReactUpdates":85,"./SyntheticEvent":94,"./getEventTarget":116,"./isEventSupported":121,"./isTextInputElement":122,"fbjs/lib/ExecutionEnvironment":132,"fbjs/lib/keyOf":150}],9:[function(e,t,n){"use strict";var o=0,r={createReactRootIndex:function(){return o++}};t.exports=r},{}],10:[function(e,t,n){(function(n){"use strict";function o(e,t,n){var o=n>=e.childNodes.length?null:e.childNodes.item(n);e.insertBefore(t,o)}var r=e("./Danger"),a=e("./ReactMultiChildUpdateTypes"),i=e("./ReactPerf"),s=e("./setInnerHTML"),u=e("./setTextContent"),c=e("fbjs/lib/invariant"),l={dangerouslyReplaceNodeWithMarkup:r.dangerouslyReplaceNodeWithMarkup,updateTextContent:u,processUpdates:function(e,t){for(var i,l=null,p=null,d=0;d when using tables, nesting tags like
,

, or , or using non-SVG elements in an parent. Try inspecting the child nodes of the element with React ID `%s`.",f,v):c(!1),l=l||{},l[v]=l[v]||[],l[v][f]=h,p=p||[],p.push(h)}var m;if(m=t.length&&"string"==typeof t[0]?r.dangerouslyRenderMarkup(t):t,p)for(var g=0;gt||e.hasOverloadedBooleanValue&&t===!1}var a=e("./DOMProperty"),i=e("./ReactPerf"),s=e("./quoteAttributeValueForBrowser"),u=e("fbjs/lib/warning"),c=/^[a-zA-Z_][\w\.\-]*$/,l={},p={};if("production"!==n.env.NODE_ENV)var d={children:!0,dangerouslySetInnerHTML:!0,key:!0,ref:!0},f={},h=function(e){if(!(d.hasOwnProperty(e)&&d[e]||f.hasOwnProperty(e)&&f[e])){f[e]=!0;var t=e.toLowerCase(),o=a.isCustomAttribute(t)?t:a.getPossibleStandardName.hasOwnProperty(t)?a.getPossibleStandardName[t]:null;"production"!==n.env.NODE_ENV?u(null==o,"Unknown DOM property %s. Did you mean %s?",e,o):void 0}};var v={createMarkupForID:function(e){return a.ID_ATTRIBUTE_NAME+"="+s(e)},setAttributeForID:function(e,t){e.setAttribute(a.ID_ATTRIBUTE_NAME,t)},createMarkupForProperty:function(e,t){var o=a.properties.hasOwnProperty(e)?a.properties[e]:null;if(o){if(r(o,t))return"";var i=o.attributeName;return o.hasBooleanValue||o.hasOverloadedBooleanValue&&t===!0?i+'=""':i+"="+s(t)}return a.isCustomAttribute(e)?null==t?"":e+"="+s(t):("production"!==n.env.NODE_ENV&&h(e),null)},createMarkupForCustomAttribute:function(e,t){return o(e)&&null!=t?e+"="+s(t):""},setValueForProperty:function(e,t,o){var i=a.properties.hasOwnProperty(t)?a.properties[t]:null;if(i){var s=i.mutationMethod;if(s)s(e,o);else if(r(i,o))this.deleteValueForProperty(e,t);else if(i.mustUseAttribute){var u=i.attributeName,c=i.attributeNamespace;c?e.setAttributeNS(c,u,""+o):i.hasBooleanValue||i.hasOverloadedBooleanValue&&o===!0?e.setAttribute(u,""):e.setAttribute(u,""+o)}else{var l=i.propertyName;i.hasSideEffects&&""+e[l]==""+o||(e[l]=o)}}else a.isCustomAttribute(t)?v.setValueForAttribute(e,t,o):"production"!==n.env.NODE_ENV&&h(t)},setValueForAttribute:function(e,t,n){o(t)&&(null==n?e.removeAttribute(t):e.setAttribute(t,""+n))},deleteValueForProperty:function(e,t){var o=a.properties.hasOwnProperty(t)?a.properties[t]:null;if(o){var r=o.mutationMethod;if(r)r(e,void 0);else if(o.mustUseAttribute)e.removeAttribute(o.attributeName);else{var i=o.propertyName,s=a.getDefaultValueForProperty(e.nodeName,i);o.hasSideEffects&&""+e[i]===s||(e[i]=s)}}else a.isCustomAttribute(t)?e.removeAttribute(t):"production"!==n.env.NODE_ENV&&h(t)}};i.measureMethods(v,"DOMPropertyOperations",{setValueForProperty:"setValueForProperty",setValueForAttribute:"setValueForAttribute",deleteValueForProperty:"deleteValueForProperty"}),t.exports=v}).call(this,e("_process"))},{"./DOMProperty":11,"./ReactPerf":73,"./quoteAttributeValueForBrowser":124,_process:1,"fbjs/lib/warning":157}],13:[function(e,t,n){(function(n){"use strict";function o(e){return e.substring(1,e.indexOf(" "))}var r=e("fbjs/lib/ExecutionEnvironment"),a=e("fbjs/lib/createNodesFromMarkup"),i=e("fbjs/lib/emptyFunction"),s=e("fbjs/lib/getMarkupWrap"),u=e("fbjs/lib/invariant"),c=/^(<[^ \/>]+)/,l="data-danger-index",p={dangerouslyRenderMarkup:function(e){r.canUseDOM?void 0:"production"!==n.env.NODE_ENV?u(!1,"dangerouslyRenderMarkup(...): Cannot render markup in a worker thread. Make sure `window` and `document` are available globally before requiring React when unit testing or use ReactDOMServer.renderToString for server rendering."):u(!1);for(var t,p={},d=0;d node. This is because browser quirks make this unreliable and/or slow. If you want to render to the root you must use server rendering. See ReactDOMServer.renderToString()."):u(!1):void 0;var o;o="string"==typeof t?a(t,i)[0]:t,e.parentNode.replaceChild(o,e)}};t.exports=p}).call(this,e("_process"))},{_process:1,"fbjs/lib/ExecutionEnvironment":132,"fbjs/lib/createNodesFromMarkup":137,"fbjs/lib/emptyFunction":138,"fbjs/lib/getMarkupWrap":142,"fbjs/lib/invariant":146}],14:[function(e,t,n){"use strict";var o=e("fbjs/lib/keyOf"),r=[o({ResponderEventPlugin:null}),o({SimpleEventPlugin:null}),o({TapEventPlugin:null}),o({EnterLeaveEventPlugin:null}),o({ChangeEventPlugin:null}),o({SelectEventPlugin:null}),o({BeforeInputEventPlugin:null})];t.exports=r},{"fbjs/lib/keyOf":150}],15:[function(e,t,n){"use strict";var o=e("./EventConstants"),r=e("./EventPropagators"),a=e("./SyntheticMouseEvent"),i=e("./ReactMount"),s=e("fbjs/lib/keyOf"),u=o.topLevelTypes,c=i.getFirstReactDOM,l={mouseEnter:{registrationName:s({onMouseEnter:null}),dependencies:[u.topMouseOut,u.topMouseOver]},mouseLeave:{registrationName:s({onMouseLeave:null}),dependencies:[u.topMouseOut,u.topMouseOver]}},p=[null,null],d={eventTypes:l,extractEvents:function(e,t,n,o,s){if(e===u.topMouseOver&&(o.relatedTarget||o.fromElement))return null;if(e!==u.topMouseOut&&e!==u.topMouseOver)return null;var d;if(t.window===t)d=t;else{var f=t.ownerDocument;d=f?f.defaultView||f.parentWindow:window}var h,v,m="",g="";if(e===u.topMouseOut?(h=t,m=n,v=c(o.relatedTarget||o.toElement),v?g=i.getID(v):v=d,v=v||d):(h=d,v=t,g=n),h===v)return null;var y=a.getPooled(l.mouseLeave,m,o,s);y.type="mouseleave",y.target=h,y.relatedTarget=v;var E=a.getPooled(l.mouseEnter,g,o,s);return E.type="mouseenter",E.target=v,E.relatedTarget=h,r.accumulateEnterLeaveDispatches(y,E,m,g),p[0]=y,p[1]=E,p}};t.exports=d},{"./EventConstants":16,"./EventPropagators":20,"./ReactMount":67,"./SyntheticMouseEvent":98,"fbjs/lib/keyOf":150}],16:[function(e,t,n){"use strict";var o=e("fbjs/lib/keyMirror"),r=o({bubbled:null,captured:null}),a=o({topAbort:null,topBlur:null,topCanPlay:null,topCanPlayThrough:null,topChange:null,topClick:null,topCompositionEnd:null,topCompositionStart:null,topCompositionUpdate:null,topContextMenu:null,topCopy:null,topCut:null,topDoubleClick:null,topDrag:null,topDragEnd:null,topDragEnter:null,topDragExit:null,topDragLeave:null,topDragOver:null,topDragStart:null,topDrop:null,topDurationChange:null,topEmptied:null,topEncrypted:null,topEnded:null,topError:null,topFocus:null,topInput:null,topKeyDown:null,topKeyPress:null,topKeyUp:null,topLoad:null,topLoadedData:null,topLoadedMetadata:null,topLoadStart:null,topMouseDown:null,topMouseMove:null,topMouseOut:null,topMouseOver:null,topMouseUp:null,topPaste:null,topPause:null,topPlay:null,topPlaying:null,topProgress:null,topRateChange:null,topReset:null,topScroll:null,topSeeked:null,topSeeking:null,topSelectionChange:null,topStalled:null,topSubmit:null,topSuspend:null,topTextInput:null,topTimeUpdate:null,topTouchCancel:null,topTouchEnd:null,topTouchMove:null,topTouchStart:null,topVolumeChange:null,topWaiting:null,topWheel:null}),i={topLevelTypes:a,PropagationPhases:r};t.exports=i},{"fbjs/lib/keyMirror":149}],17:[function(e,t,n){(function(n){"use strict";function o(){var e=m&&m.traverseTwoPhase&&m.traverseEnterLeave;"production"!==n.env.NODE_ENV?l(e,"InstanceHandle not injected before use!"):void 0}var r=e("./EventPluginRegistry"),a=e("./EventPluginUtils"),i=e("./ReactErrorUtils"),s=e("./accumulateInto"),u=e("./forEachAccumulated"),c=e("fbjs/lib/invariant"),l=e("fbjs/lib/warning"),p={},d=null,f=function(e,t){e&&(a.executeDispatchesInOrder(e,t),e.isPersistent()||e.constructor.release(e))},h=function(e){return f(e,!0)},v=function(e){return f(e,!1)},m=null,g={injection:{injectMount:a.injection.injectMount,injectInstanceHandle:function(e){m=e,"production"!==n.env.NODE_ENV&&o()},getInstanceHandle:function(){return"production"!==n.env.NODE_ENV&&o(),m},injectEventPluginOrder:r.injectEventPluginOrder,injectEventPluginsByName:r.injectEventPluginsByName},eventNameDispatchConfigs:r.eventNameDispatchConfigs,registrationNameModules:r.registrationNameModules,putListener:function(e,t,o){"function"!=typeof o?"production"!==n.env.NODE_ENV?c(!1,"Expected %s listener to be a function, instead got type %s",t,typeof o):c(!1):void 0;var a=p[t]||(p[t]={});a[e]=o;var i=r.registrationNameModules[t];i&&i.didPutListener&&i.didPutListener(e,t,o)},getListener:function(e,t){var n=p[t];return n&&n[e]},deleteListener:function(e,t){var n=r.registrationNameModules[t];n&&n.willDeleteListener&&n.willDeleteListener(e,t);var o=p[t];o&&delete o[e]},deleteAllListeners:function(e){for(var t in p)if(p[t][e]){var n=r.registrationNameModules[t];n&&n.willDeleteListener&&n.willDeleteListener(e,t),delete p[t][e]}},extractEvents:function(e,t,n,o,a){for(var i,u=r.plugins,c=0;c-1?void 0:"production"!==n.env.NODE_ENV?i(!1,"EventPluginRegistry: Cannot inject event plugins that do not exist in the plugin ordering, `%s`.",e):i(!1),!c.plugins[o]){t.extractEvents?void 0:"production"!==n.env.NODE_ENV?i(!1,"EventPluginRegistry: Event plugins must implement an `extractEvents` method, but `%s` does not.",e):i(!1),c.plugins[o]=t;var a=t.eventTypes;for(var l in a)r(a[l],t,l)?void 0:"production"!==n.env.NODE_ENV?i(!1,"EventPluginRegistry: Failed to publish event `%s` for plugin `%s`.",l,e):i(!1)}}}function r(e,t,o){c.eventNameDispatchConfigs.hasOwnProperty(o)?"production"!==n.env.NODE_ENV?i(!1,"EventPluginHub: More than one plugin attempted to publish the same event name, `%s`.",o):i(!1):void 0,c.eventNameDispatchConfigs[o]=e;var r=e.phasedRegistrationNames;if(r){for(var s in r)if(r.hasOwnProperty(s)){var u=r[s];a(u,t,o)}return!0}return e.registrationName?(a(e.registrationName,t,o),!0):!1}function a(e,t,o){c.registrationNameModules[e]?"production"!==n.env.NODE_ENV?i(!1,"EventPluginHub: More than one plugin attempted to publish the same registration name, `%s`.",e):i(!1):void 0,c.registrationNameModules[e]=t,c.registrationNameDependencies[e]=t.eventTypes[o].dependencies}var i=e("fbjs/lib/invariant"),s=null,u={},c={plugins:[],eventNameDispatchConfigs:{},registrationNameModules:{},registrationNameDependencies:{},injectEventPluginOrder:function(e){s?"production"!==n.env.NODE_ENV?i(!1,"EventPluginRegistry: Cannot inject event plugin ordering more than once. You are likely trying to load more than one copy of React."):i(!1):void 0,s=Array.prototype.slice.call(e),o()},injectEventPluginsByName:function(e){var t=!1;for(var r in e)if(e.hasOwnProperty(r)){var a=e[r];u.hasOwnProperty(r)&&u[r]===a||(u[r]?"production"!==n.env.NODE_ENV?i(!1,"EventPluginRegistry: Cannot inject two different event plugins using the same name, `%s`.",r):i(!1):void 0,u[r]=a,t=!0)}t&&o()},getPluginModuleForEvent:function(e){var t=e.dispatchConfig;if(t.registrationName)return c.registrationNameModules[t.registrationName]||null;for(var n in t.phasedRegistrationNames)if(t.phasedRegistrationNames.hasOwnProperty(n)){var o=c.registrationNameModules[t.phasedRegistrationNames[n]];if(o)return o}return null},_resetEventPlugins:function(){s=null;for(var e in u)u.hasOwnProperty(e)&&delete u[e];c.plugins.length=0;var t=c.eventNameDispatchConfigs;for(var n in t)t.hasOwnProperty(n)&&delete t[n];var o=c.registrationNameModules;for(var r in o)o.hasOwnProperty(r)&&delete o[r]}};t.exports=c}).call(this,e("_process"))},{_process:1,"fbjs/lib/invariant":146}],19:[function(e,t,n){(function(n){"use strict";function o(e){return e===y.topMouseUp||e===y.topTouchEnd||e===y.topTouchCancel}function r(e){return e===y.topMouseMove||e===y.topTouchMove}function a(e){return e===y.topMouseDown||e===y.topTouchStart}function i(e,t,n,o){var r=e.type||"unknown-event";e.currentTarget=g.Mount.getNode(o),t?h.invokeGuardedCallbackWithCatch(r,n,e,o):h.invokeGuardedCallback(r,n,e,o),e.currentTarget=null}function s(e,t){var o=e._dispatchListeners,r=e._dispatchIDs;if("production"!==n.env.NODE_ENV&&d(e),Array.isArray(o))for(var a=0;ae&&n[e]===r[e];e++);var i=o-e;for(t=1;i>=t&&n[o-t]===r[a-t];t++);var s=t>1?1-t:void 0;return this._fallbackText=r.slice(e,s),this._fallbackText}}),r.addPoolingTo(o),t.exports=o},{"./Object.assign":24,"./PooledClass":25,"./getTextContentAccessor":119}],22:[function(e,t,n){"use strict";var o,r=e("./DOMProperty"),a=e("fbjs/lib/ExecutionEnvironment"),i=r.injection.MUST_USE_ATTRIBUTE,s=r.injection.MUST_USE_PROPERTY,u=r.injection.HAS_BOOLEAN_VALUE,c=r.injection.HAS_SIDE_EFFECTS,l=r.injection.HAS_NUMERIC_VALUE,p=r.injection.HAS_POSITIVE_NUMERIC_VALUE,d=r.injection.HAS_OVERLOADED_BOOLEAN_VALUE;if(a.canUseDOM){var f=document.implementation;o=f&&f.hasFeature&&f.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure","1.1")}var h={isCustomAttribute:RegExp.prototype.test.bind(/^(data|aria)-[a-z_][a-z\d_.\-]*$/),Properties:{accept:null,acceptCharset:null,accessKey:null,action:null,allowFullScreen:i|u,allowTransparency:i,alt:null,async:u,autoComplete:null,autoPlay:u,capture:i|u,cellPadding:null,cellSpacing:null,charSet:i,challenge:i,checked:s|u,classID:i,className:o?i:s,cols:i|p,colSpan:null,content:null,contentEditable:null,contextMenu:i,controls:s|u,coords:null,crossOrigin:null,data:null,dateTime:i,"default":u,defer:u,dir:null,disabled:i|u,download:d,draggable:null,encType:null,form:i,formAction:i,formEncType:i,formMethod:i,formNoValidate:u,formTarget:i,frameBorder:i,headers:null,height:i,hidden:i|u,high:null,href:null,hrefLang:null,htmlFor:null,httpEquiv:null,icon:null,id:s,inputMode:i,integrity:null,is:i,keyParams:i,keyType:i,kind:null,label:null,lang:null,list:i,loop:s|u,low:null,manifest:i,marginHeight:null,marginWidth:null,max:null,maxLength:i,media:i,mediaGroup:null,method:null,min:null,minLength:i,multiple:s|u,muted:s|u,name:null,noValidate:u,open:u,optimum:null,pattern:null,placeholder:null,poster:null,preload:null,radioGroup:null,readOnly:s|u,rel:null,required:u,role:i,rows:i|p,rowSpan:null,sandbox:null,scope:null,scoped:u,scrolling:null,seamless:i|u,selected:s|u,shape:null,size:i|p,sizes:i,span:p,spellCheck:null,src:null,srcDoc:s,srcLang:null,srcSet:i,start:l,step:null,style:null,summary:null,tabIndex:null,target:null,title:null,type:null,useMap:null,value:s|c,width:i,wmode:i,wrap:null,about:i,datatype:i,inlist:i,prefix:i,property:i,resource:i,"typeof":i,vocab:i,autoCapitalize:null,autoCorrect:null,autoSave:null,color:null,itemProp:i,itemScope:i|u,itemType:i,itemID:i,itemRef:i,results:null,security:i,unselectable:i},DOMAttributeNames:{acceptCharset:"accept-charset",className:"class",htmlFor:"for",httpEquiv:"http-equiv"},DOMPropertyNames:{autoCapitalize:"autocapitalize",autoComplete:"autocomplete",autoCorrect:"autocorrect",autoFocus:"autofocus",autoPlay:"autoplay",autoSave:"autosave",encType:"encoding",hrefLang:"hreflang",radioGroup:"radiogroup",spellCheck:"spellcheck",srcDoc:"srcdoc",srcSet:"srcset"}};t.exports=h},{"./DOMProperty":11,"fbjs/lib/ExecutionEnvironment":132}],23:[function(e,t,n){(function(n){"use strict";function o(e){null!=e.checkedLink&&null!=e.valueLink?"production"!==n.env.NODE_ENV?c(!1,"Cannot provide a checkedLink and a valueLink. If you want to use checkedLink, you probably don't want to use valueLink and vice versa."):c(!1):void 0}function r(e){o(e),null!=e.value||null!=e.onChange?"production"!==n.env.NODE_ENV?c(!1,"Cannot provide a valueLink and a value or onChange event. If you want to use value or onChange, you probably don't want to use valueLink."):c(!1):void 0}function a(e){o(e),null!=e.checked||null!=e.onChange?"production"!==n.env.NODE_ENV?c(!1,"Cannot provide a checkedLink and a checked property or onChange event. If you want to use checked or onChange, you probably don't want to use checkedLink"):c(!1):void 0}function i(e){if(e){var t=e.getName();if(t)return" Check the render method of `"+t+"`."}return""}var s=e("./ReactPropTypes"),u=e("./ReactPropTypeLocations"),c=e("fbjs/lib/invariant"),l=e("fbjs/lib/warning"),p={button:!0,checkbox:!0,image:!0,hidden:!0,radio:!0,reset:!0,submit:!0},d={value:function(e,t,n){return!e[t]||p[e.type]||e.onChange||e.readOnly||e.disabled?null:new Error("You provided a `value` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultValue`. Otherwise, set either `onChange` or `readOnly`.")},checked:function(e,t,n){return!e[t]||e.onChange||e.readOnly||e.disabled?null:new Error("You provided a `checked` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultChecked`. Otherwise, set either `onChange` or `readOnly`.")},onChange:s.func},f={},h={checkPropTypes:function(e,t,o){for(var r in d){if(d.hasOwnProperty(r))var a=d[r](t,r,e,u.prop);if(a instanceof Error&&!(a.message in f)){f[a.message]=!0;var s=i(o);"production"!==n.env.NODE_ENV?l(!1,"Failed form propType: %s%s",a.message,s):void 0}}},getValue:function(e){return e.valueLink?(r(e),e.valueLink.value):e.value},getChecked:function(e){return e.checkedLink?(a(e),e.checkedLink.value):e.checked},executeOnChange:function(e,t){return e.valueLink?(r(e),e.valueLink.requestChange(t.target.value)):e.checkedLink?(a(e),e.checkedLink.requestChange(t.target.checked)):e.onChange?e.onChange.call(void 0,t):void 0}};t.exports=h}).call(this,e("_process"))},{"./ReactPropTypeLocations":75,"./ReactPropTypes":76,_process:1,"fbjs/lib/invariant":146,"fbjs/lib/warning":157}],24:[function(e,t,n){"use strict";function o(e,t){if(null==e)throw new TypeError("Object.assign target cannot be null or undefined");for(var n=Object(e),o=Object.prototype.hasOwnProperty,r=1;r1?s-1:0),c=1;s>c;c++)u[c-1]=arguments[c];if(i!==e&&null!==i)"production"!==n.env.NODE_ENV?C(!1,"bind(): React component methods may only be bound to the component instance. See %s",r):void 0;else if(!u.length)return"production"!==n.env.NODE_ENV?C(!1,"bind(): You are binding a component method to the component. React does this for you automatically in a high-performance way, so you can safely remove this call. See %s",r):void 0,o;var l=a.apply(o,arguments);return l.__reactBoundContext=e,l.__reactBoundMethod=t,l.__reactBoundArguments=u,l}}return o}function d(e){for(var t in e.__reactAutoBindMap)if(e.__reactAutoBindMap.hasOwnProperty(t)){var n=e.__reactAutoBindMap[t];e[t]=p(e,n)}}var f=e("./ReactComponent"),h=e("./ReactElement"),v=e("./ReactPropTypeLocations"),m=e("./ReactPropTypeLocationNames"),g=e("./ReactNoopUpdateQueue"),y=e("./Object.assign"),E=e("fbjs/lib/emptyObject"),b=e("fbjs/lib/invariant"),_=e("fbjs/lib/keyMirror"),N=e("fbjs/lib/keyOf"),C=e("fbjs/lib/warning"),D=N({mixins:null}),O=_({DEFINE_ONCE:null,DEFINE_MANY:null,OVERRIDE_BASE:null,DEFINE_MANY_MERGED:null}),R=[],M=!1,x={mixins:O.DEFINE_MANY,statics:O.DEFINE_MANY,propTypes:O.DEFINE_MANY,contextTypes:O.DEFINE_MANY,childContextTypes:O.DEFINE_MANY,getDefaultProps:O.DEFINE_MANY_MERGED,getInitialState:O.DEFINE_MANY_MERGED,getChildContext:O.DEFINE_MANY_MERGED,render:O.DEFINE_ONCE,componentWillMount:O.DEFINE_MANY,componentDidMount:O.DEFINE_MANY,componentWillReceiveProps:O.DEFINE_MANY,shouldComponentUpdate:O.DEFINE_ONCE,componentWillUpdate:O.DEFINE_MANY,componentDidUpdate:O.DEFINE_MANY,componentWillUnmount:O.DEFINE_MANY,updateComponent:O.OVERRIDE_BASE},w={displayName:function(e,t){e.displayName=t},mixins:function(e,t){if(t)for(var n=0;n-1&&-1===navigator.userAgent.indexOf("Edge")||navigator.userAgent.indexOf("Firefox")>-1)&&console.debug("Download the React DevTools for a better development experience: https://fb.me/react-devtools");var y=document.documentMode&&document.documentMode<8;"production"!==n.env.NODE_ENV?h(!y,'Internet Explorer is running in compatibility mode; please add the following tag to your HTML to prevent this from happening: '):void 0;for(var E=[Array.isArray,Array.prototype.every,Array.prototype.forEach,Array.prototype.indexOf,Array.prototype.map,Date.now,Function.prototype.bind,Object.keys,String.prototype.split,String.prototype.trim,Object.create,Object.freeze],b=0;b",c(e),c(t)):void 0)}}function p(e,t){t&&("production"!==n.env.NODE_ENV&&se[e._tag]&&("production"!==n.env.NODE_ENV?G(null==t.children&&null==t.dangerouslySetInnerHTML,"%s is a void element tag and must not have `children` or use `props.dangerouslySetInnerHTML`.%s",e._tag,e._currentElement._owner?" Check the render method of "+e._currentElement._owner.getName()+".":""):void 0),null!=t.dangerouslySetInnerHTML&&(null!=t.children?"production"!==n.env.NODE_ENV?B(!1,"Can only set one of `children` or `props.dangerouslySetInnerHTML`."):B(!1):void 0,"object"==typeof t.dangerouslySetInnerHTML&&te in t.dangerouslySetInnerHTML?void 0:"production"!==n.env.NODE_ENV?B(!1,"`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. Please visit https://fb.me/react-invariant-dangerously-set-inner-html for more information."):B(!1)),"production"!==n.env.NODE_ENV&&("production"!==n.env.NODE_ENV?G(null==t.innerHTML,"Directly setting property `innerHTML` is not permitted. For more information, lookup documentation on `dangerouslySetInnerHTML`."):void 0,"production"!==n.env.NODE_ENV?G(!t.contentEditable||null==t.children,"A component is `contentEditable` and contains `children` managed by React. It is now your responsibility to guarantee that none of those nodes are unexpectedly modified or duplicated. This is probably not intentional."):void 0),null!=t.style&&"object"!=typeof t.style?"production"!==n.env.NODE_ENV?B(!1,"The `style` prop expects a mapping from style properties to values, not a string. For example, style={{marginRight: spacing + 'em'}} when using JSX.%s",o(e)):B(!1):void 0)}function d(e,t,o,r){"production"!==n.env.NODE_ENV&&("production"!==n.env.NODE_ENV?G("onScroll"!==t||H("scroll",!0),"This browser doesn't support the `onScroll` event"):void 0);var a=k.findReactContainerForID(e);if(a){var i=a.nodeType===ne?a.ownerDocument:a;X(t,i)}r.getReactMountReady().enqueue(f,{id:e,registrationName:t,listener:o})}function f(){var e=this;M.putListener(e.id,e.registrationName,e.listener)}function h(){var e=this;e._rootNodeID?void 0:"production"!==n.env.NODE_ENV?B(!1,"Must be mounted to trap events"):B(!1);var t=k.getNode(e._rootNodeID);switch(t?void 0:"production"!==n.env.NODE_ENV?B(!1,"trapBubbledEvent(...): Requires node to be rendered."):B(!1),e._tag){case"iframe":e._wrapperState.listeners=[M.trapBubbledEvent(R.topLevelTypes.topLoad,"load",t)];break;case"video":case"audio":e._wrapperState.listeners=[];for(var o in re)re.hasOwnProperty(o)&&e._wrapperState.listeners.push(M.trapBubbledEvent(R.topLevelTypes[o],re[o],t));break;case"img":e._wrapperState.listeners=[M.trapBubbledEvent(R.topLevelTypes.topError,"error",t),M.trapBubbledEvent(R.topLevelTypes.topLoad,"load",t)];break;case"form":e._wrapperState.listeners=[M.trapBubbledEvent(R.topLevelTypes.topReset,"reset",t),M.trapBubbledEvent(R.topLevelTypes.topSubmit,"submit",t)]}}function v(){T.mountReadyWrapper(this)}function m(){S.postUpdateWrapper(this)}function g(e){le.call(ce,e)||(ue.test(e)?void 0:"production"!==n.env.NODE_ENV?B(!1,"Invalid tag: %s",e):B(!1),ce[e]=!0)}function y(e,t){e=L({},e);var n=e[Y.ancestorInfoContextKey];return e[Y.ancestorInfoContextKey]=Y.updatedAncestorInfo(n,t._tag,t),e}function E(e,t){return e.indexOf("-")>=0||null!=t.is}function b(e){g(e),this._tag=e.toLowerCase(),this._renderedChildren=null,this._previousStyle=null,this._previousStyleCopy=null,this._rootNodeID=null,this._wrapperState=null,this._topLevelWrapper=null,this._nodeWithLegacyProperties=null,"production"!==n.env.NODE_ENV&&(this._unprocessedContextDev=null,this._processedContextDev=null)}var _,N=e("./AutoFocusUtils"),C=e("./CSSPropertyOperations"),D=e("./DOMProperty"),O=e("./DOMPropertyOperations"),R=e("./EventConstants"),M=e("./ReactBrowserEventEmitter"),x=e("./ReactComponentBrowserEnvironment"),w=e("./ReactDOMButton"),T=e("./ReactDOMInput"),I=e("./ReactDOMOption"),S=e("./ReactDOMSelect"),P=e("./ReactDOMTextarea"),k=e("./ReactMount"),j=e("./ReactMultiChild"),A=e("./ReactPerf"),V=e("./ReactUpdateQueue"),L=e("./Object.assign"),U=e("./canDefineProperty"),F=e("./escapeTextContentForBrowser"),B=e("fbjs/lib/invariant"),H=e("./isEventSupported"),W=e("fbjs/lib/keyOf"),K=e("./setInnerHTML"),q=e("./setTextContent"),z=e("fbjs/lib/shallowEqual"),Y=e("./validateDOMNesting"),G=e("fbjs/lib/warning"),Q=M.deleteListener,X=M.listenTo,$=M.registrationNameModules,J={string:!0,number:!0},Z=W({children:null}),ee=W({style:null}),te=W({__html:null}),ne=1;"production"!==n.env.NODE_ENV&&(_={props:{enumerable:!1,get:function(){var e=this._reactInternalComponent;return"production"!==n.env.NODE_ENV?G(!1,"ReactDOMComponent: Do not access .props of a DOM node; instead, recreate the props as `render` did originally or read the DOM properties/attributes directly from this node (e.g., this.refs.box.className).%s",o(e)):void 0,e._currentElement.props}}});var oe={},re={topAbort:"abort",topCanPlay:"canplay",topCanPlayThrough:"canplaythrough",topDurationChange:"durationchange",topEmptied:"emptied",topEncrypted:"encrypted",topEnded:"ended",topError:"error",topLoadedData:"loadeddata",topLoadedMetadata:"loadedmetadata",topLoadStart:"loadstart",topPause:"pause",topPlay:"play",topPlaying:"playing",topProgress:"progress",topRateChange:"ratechange",topSeeked:"seeked",topSeeking:"seeking",topStalled:"stalled",topSuspend:"suspend",topTimeUpdate:"timeupdate",topVolumeChange:"volumechange",topWaiting:"waiting"},ae={area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0},ie={listing:!0,pre:!0,textarea:!0},se=L({menuitem:!0},ae),ue=/^[a-zA-Z][a-zA-Z:_\.\-\d]*$/,ce={},le={}.hasOwnProperty;b.displayName="ReactDOMComponent",b.Mixin={construct:function(e){this._currentElement=e},mountComponent:function(e,t,o){this._rootNodeID=e;var r=this._currentElement.props;switch(this._tag){case"iframe":case"img":case"form":case"video":case"audio":this._wrapperState={listeners:null},t.getReactMountReady().enqueue(h,this);break;case"button":r=w.getNativeProps(this,r,o);break;case"input":T.mountWrapper(this,r,o),r=T.getNativeProps(this,r,o);break;case"option":I.mountWrapper(this,r,o),r=I.getNativeProps(this,r,o);break;case"select":S.mountWrapper(this,r,o),r=S.getNativeProps(this,r,o),o=S.processChildContext(this,r,o);break;case"textarea":P.mountWrapper(this,r,o),r=P.getNativeProps(this,r,o)}p(this,r),"production"!==n.env.NODE_ENV&&o[Y.ancestorInfoContextKey]&&Y(this._tag,this,o[Y.ancestorInfoContextKey]),"production"!==n.env.NODE_ENV&&(this._unprocessedContextDev=o,this._processedContextDev=y(o,this),o=this._processedContextDev);var a;if(t.useCreateElement){var i=o[k.ownerDocumentContextKey],s=i.createElement(this._currentElement.type);O.setAttributeForID(s,this._rootNodeID),k.getID(s),this._updateDOMProperties({},r,t,s),this._createInitialChildren(t,r,o,s),a=s}else{var u=this._createOpenTagMarkupAndPutListeners(t,r),c=this._createContentMarkup(t,r,o);a=!c&&ae[this._tag]?u+"/>":u+">"+c+""}switch(this._tag){case"input":t.getReactMountReady().enqueue(v,this);case"button":case"select":case"textarea":r.autoFocus&&t.getReactMountReady().enqueue(N.focusDOMComponent,this)}return a},_createOpenTagMarkupAndPutListeners:function(e,t){var o="<"+this._currentElement.type;for(var r in t)if(t.hasOwnProperty(r)){var a=t[r];if(null!=a)if($.hasOwnProperty(r))a&&d(this._rootNodeID,r,a,e);else{r===ee&&(a&&("production"!==n.env.NODE_ENV&&(this._previousStyle=a),a=this._previousStyleCopy=L({},t.style)),a=C.createMarkupForStyles(a));var i=null;null!=this._tag&&E(this._tag,t)?r!==Z&&(i=O.createMarkupForCustomAttribute(r,a)):i=O.createMarkupForProperty(r,a),i&&(o+=" "+i)}}if(e.renderToStaticMarkup)return o;var s=O.createMarkupForID(this._rootNodeID);return o+" "+s},_createContentMarkup:function(e,t,n){var o="",r=t.dangerouslySetInnerHTML;if(null!=r)null!=r.__html&&(o=r.__html);else{var a=J[typeof t.children]?t.children:null,i=null!=a?null:t.children;if(null!=a)o=F(a);else if(null!=i){var s=this.mountChildren(i,e,n);o=s.join("")}}return ie[this._tag]&&"\n"===o.charAt(0)?"\n"+o:o},_createInitialChildren:function(e,t,n,o){var r=t.dangerouslySetInnerHTML;if(null!=r)null!=r.__html&&K(o,r.__html);else{var a=J[typeof t.children]?t.children:null,i=null!=a?null:t.children;if(null!=a)q(o,a);else if(null!=i)for(var s=this.mountChildren(i,e,n),u=0;u tried to unmount. Because of cross-browser quirks it is impossible to unmount some top-level components (eg , , and ) reliably and efficiently. To fix this, have a single top-level component that never unmounts render these elements.",this._tag):B(!1)}if(this.unmountChildren(),M.deleteAllListeners(this._rootNodeID),x.unmountIDFromEnvironment(this._rootNodeID),this._rootNodeID=null,this._wrapperState=null,this._nodeWithLegacyProperties){var o=this._nodeWithLegacyProperties;o._reactInternalComponent=null,this._nodeWithLegacyProperties=null}},getPublicInstance:function(){if(!this._nodeWithLegacyProperties){var e=k.getNode(this._rootNodeID);e._reactInternalComponent=this,e.getDOMNode=r,e.isMounted=a,e.setState=i,e.replaceState=i,e.forceUpdate=i,e.setProps=s,e.replaceProps=u,"production"!==n.env.NODE_ENV&&U?Object.defineProperties(e,_):e.props=this._currentElement.props,this._nodeWithLegacyProperties=e}return this._nodeWithLegacyProperties}},A.measureMethods(b,"ReactDOMComponent",{mountComponent:"mountComponent",updateComponent:"updateComponent"}),L(b.prototype,b.Mixin,j.Mixin),t.exports=b}).call(this,e("_process"))},{"./AutoFocusUtils":3,"./CSSPropertyOperations":6,"./DOMProperty":11,"./DOMPropertyOperations":12,"./EventConstants":16,"./Object.assign":24,"./ReactBrowserEventEmitter":28,"./ReactComponentBrowserEnvironment":33,"./ReactDOMButton":38,"./ReactDOMInput":43,"./ReactDOMOption":44,"./ReactDOMSelect":45,"./ReactDOMTextarea":49,"./ReactMount":67,"./ReactMultiChild":68,"./ReactPerf":73,"./ReactUpdateQueue":84,"./canDefineProperty":106,"./escapeTextContentForBrowser":109,"./isEventSupported":121,"./setInnerHTML":126,"./setTextContent":127,"./validateDOMNesting":130,_process:1,"fbjs/lib/invariant":146,"fbjs/lib/keyOf":150,"fbjs/lib/shallowEqual":155,"fbjs/lib/warning":157}],40:[function(e,t,n){(function(n){"use strict";function o(e){return"production"!==n.env.NODE_ENV?a.createFactory(e):r.createFactory(e)}var r=e("./ReactElement"),a=e("./ReactElementValidator"),i=e("fbjs/lib/mapObject"),s=i({a:"a",abbr:"abbr",address:"address",area:"area",article:"article",aside:"aside",audio:"audio",b:"b",base:"base",bdi:"bdi",bdo:"bdo",big:"big",blockquote:"blockquote",body:"body",br:"br",button:"button",canvas:"canvas",caption:"caption",cite:"cite",code:"code",col:"col",colgroup:"colgroup",data:"data",datalist:"datalist",dd:"dd",del:"del",details:"details",dfn:"dfn",dialog:"dialog",div:"div",dl:"dl",dt:"dt",em:"em",embed:"embed",fieldset:"fieldset",figcaption:"figcaption",figure:"figure",footer:"footer",form:"form",h1:"h1",h2:"h2",h3:"h3",h4:"h4",h5:"h5",h6:"h6",head:"head",header:"header",hgroup:"hgroup",hr:"hr",html:"html",i:"i",iframe:"iframe",img:"img",input:"input",ins:"ins",kbd:"kbd",keygen:"keygen",label:"label",legend:"legend",li:"li",link:"link",main:"main",map:"map",mark:"mark",menu:"menu",menuitem:"menuitem",meta:"meta",meter:"meter",nav:"nav",noscript:"noscript",object:"object",ol:"ol",optgroup:"optgroup",option:"option",output:"output",p:"p",param:"param",picture:"picture",pre:"pre",progress:"progress",q:"q",rp:"rp",rt:"rt",ruby:"ruby",s:"s",samp:"samp",script:"script",section:"section",select:"select",small:"small",source:"source",span:"span",strong:"strong",style:"style",sub:"sub",summary:"summary",sup:"sup",table:"table",tbody:"tbody",td:"td",textarea:"textarea",tfoot:"tfoot",th:"th",thead:"thead",time:"time",title:"title",tr:"tr",track:"track",u:"u",ul:"ul","var":"var",video:"video",wbr:"wbr",circle:"circle",clipPath:"clipPath",defs:"defs",ellipse:"ellipse",g:"g",image:"image",line:"line",linearGradient:"linearGradient",mask:"mask",path:"path",pattern:"pattern",polygon:"polygon",polyline:"polyline",radialGradient:"radialGradient",rect:"rect",stop:"stop",svg:"svg",text:"text",tspan:"tspan"},o);t.exports=s}).call(this,e("_process"))},{"./ReactElement":54,"./ReactElementValidator":55,_process:1,"fbjs/lib/mapObject":151}],41:[function(e,t,n){"use strict";var o={useCreateElement:!1};t.exports=o},{}],42:[function(e,t,n){(function(n){"use strict";var o=e("./DOMChildrenOperations"),r=e("./DOMPropertyOperations"),a=e("./ReactMount"),i=e("./ReactPerf"),s=e("fbjs/lib/invariant"),u={dangerouslySetInnerHTML:"`dangerouslySetInnerHTML` must be set using `updateInnerHTMLByID()`.",style:"`style` must be set using `updateStylesByID()`."},c={updatePropertyByID:function(e,t,o){var i=a.getNode(e);u.hasOwnProperty(t)?"production"!==n.env.NODE_ENV?s(!1,"updatePropertyByID(...): %s",u[t]):s(!1):void 0,null!=o?r.setValueForProperty(i,t,o):r.deleteValueForProperty(i,t)},dangerouslyReplaceNodeWithMarkupByID:function(e,t){var n=a.getNode(e);o.dangerouslyReplaceNodeWithMarkup(n,t)},dangerouslyProcessChildrenUpdates:function(e,t){for(var n=0;n instead of setting `selected` on