mutliselect-search-dropdown
Version:
A Complete dropdown solution for create a multi select drop down with search enabled.
960 lines (932 loc) • 36.4 kB
JavaScript
module.exports = function(e) {
var t = {};
function n(r) {
if (t[r]) return t[r].exports;
var o = t[r] = {
i: r,
l: !1,
exports: {}
};
return e[r].call(o.exports, o, o.exports, n), o.l = !0, o.exports
}
return n.m = e, n.c = t, n.d = function(e, t, r) {
n.o(e, t) || Object.defineProperty(e, t, {
enumerable: !0,
get: r
})
}, n.r = function(e) {
"undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, {
value: "Module"
}), Object.defineProperty(e, "__esModule", {
value: !0
})
}, n.t = function(e, t) {
if (1 & t && (e = n(e)), 8 & t) return e;
if (4 & t && "object" == typeof e && e && e.__esModule) return e;
var r = Object.create(null);
if (n.r(r), Object.defineProperty(r, "default", {
enumerable: !0,
value: e
}), 2 & t && "string" != typeof e)
for (var o in e) n.d(r, o, function(t) {
return e[t]
}.bind(null, o));
return r
}, n.n = function(e) {
var t = e && e.__esModule ? function() {
return e.default
} : function() {
return e
};
return n.d(t, "a", t), t
}, n.o = function(e, t) {
return Object.prototype.hasOwnProperty.call(e, t)
}, n.p = "", n(n.s = 14)
}([function(e, t, n) {
"use strict";
function r(e) {
return function() {
return e
}
}
var o = function() {};
o.thatReturns = r, o.thatReturnsFalse = r(!1), o.thatReturnsTrue = r(!0), o.thatReturnsNull = r(null), o.thatReturnsThis = function() {
return this
}, o.thatReturnsArgument = function(e) {
return e
}, e.exports = o
}, function(e, t, n) {
"use strict";
var r = function(e) {};
e.exports = function(e, t, n, o, i, a, s, l) {
if (r(t), !e) {
var u;
if (void 0 === t) u = new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");
else {
var c = [n, o, i, a, s, l],
f = 0;
(u = new Error(t.replace(/%s/g, function() {
return c[f++]
}))).name = "Invariant Violation"
}
throw u.framesToPop = 1, u
}
}
}, function(e, t, n) {
"use strict";
e.exports = "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"
}, function(e, t, n) {
"use strict";
var r = n(0),
o = n(1),
i = n(2);
e.exports = function() {
function e(e, t, n, r, a, s) {
s !== i && o(!1, "Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")
}
function t() {
return e
}
e.isRequired = e;
var n = {
array: e,
bool: e,
func: e,
number: e,
object: e,
string: e,
symbol: e,
any: e,
arrayOf: t,
element: e,
instanceOf: t,
node: e,
objectOf: t,
oneOf: t,
oneOfType: t,
shape: t,
exact: t
};
return n.checkPropTypes = r, n.PropTypes = n, n
}
}, function(e, t, n) {
e.exports = n(3)()
}, function(e, t) {
e.exports = function(e) {
var t = "undefined" != typeof window && window.location;
if (!t) throw new Error("fixUrls requires window.location");
if (!e || "string" != typeof e) return e;
var n = t.protocol + "//" + t.host,
r = n + t.pathname.replace(/\/[^\/]*$/, "/");
return e.replace(/url\s*\(((?:[^)(]|\((?:[^)(]+|\([^)(]*\))*\))*)\)/gi, function(e, t) {
var o, i = t.trim().replace(/^"(.*)"$/, function(e, t) {
return t
}).replace(/^'(.*)'$/, function(e, t) {
return t
});
return /^(#|data:|http:\/\/|https:\/\/|file:\/\/\/|\s*$)/i.test(i) ? e : (o = 0 === i.indexOf("//") ? i : 0 === i.indexOf("/") ? n + i : r + i.replace(/^\.\//, ""), "url(" + JSON.stringify(o) + ")")
})
}
}, function(e, t, n) {
var r, o, i = {},
a = (r = function() {
return window && document && document.all && !window.atob
}, function() {
return void 0 === o && (o = r.apply(this, arguments)), o
}),
s = function(e) {
var t = {};
return function(e) {
if ("function" == typeof e) return e();
if (void 0 === t[e]) {
var n = function(e) {
return document.querySelector(e)
}.call(this, e);
if (window.HTMLIFrameElement && n instanceof window.HTMLIFrameElement) try {
n = n.contentDocument.head
} catch (e) {
n = null
}
t[e] = n
}
return t[e]
}
}(),
l = null,
u = 0,
c = [],
f = n(5);
function p(e, t) {
for (var n = 0; n < e.length; n++) {
var r = e[n],
o = i[r.id];
if (o) {
o.refs++;
for (var a = 0; a < o.parts.length; a++) o.parts[a](r.parts[a]);
for (; a < r.parts.length; a++) o.parts.push(b(r.parts[a], t))
} else {
var s = [];
for (a = 0; a < r.parts.length; a++) s.push(b(r.parts[a], t));
i[r.id] = {
id: r.id,
refs: 1,
parts: s
}
}
}
}
function d(e, t) {
for (var n = [], r = {}, o = 0; o < e.length; o++) {
var i = e[o],
a = t.base ? i[0] + t.base : i[0],
s = {
css: i[1],
media: i[2],
sourceMap: i[3]
};
r[a] ? r[a].parts.push(s) : n.push(r[a] = {
id: a,
parts: [s]
})
}
return n
}
function h(e, t) {
var n = s(e.insertInto);
if (!n) throw new Error("Couldn't find a style target. This probably means that the value for the 'insertInto' parameter is invalid.");
var r = c[c.length - 1];
if ("top" === e.insertAt) r ? r.nextSibling ? n.insertBefore(t, r.nextSibling) : n.appendChild(t) : n.insertBefore(t, n.firstChild), c.push(t);
else if ("bottom" === e.insertAt) n.appendChild(t);
else {
if ("object" != typeof e.insertAt || !e.insertAt.before) throw new Error("[Style Loader]\n\n Invalid value for parameter 'insertAt' ('options.insertAt') found.\n Must be 'top', 'bottom', or Object.\n (https://github.com/webpack-contrib/style-loader#insertat)\n");
var o = s(e.insertInto + " " + e.insertAt.before);
n.insertBefore(t, o)
}
}
function y(e) {
if (null === e.parentNode) return !1;
e.parentNode.removeChild(e);
var t = c.indexOf(e);
t >= 0 && c.splice(t, 1)
}
function v(e) {
var t = document.createElement("style");
return void 0 === e.attrs.type && (e.attrs.type = "text/css"), m(t, e.attrs), h(e, t), t
}
function m(e, t) {
Object.keys(t).forEach(function(n) {
e.setAttribute(n, t[n])
})
}
function b(e, t) {
var n, r, o, i;
if (t.transform && e.css) {
if (!(i = t.transform(e.css))) return function() {};
e.css = i
}
if (t.singleton) {
var a = u++;
n = l || (l = v(t)), r = w.bind(null, n, a, !1), o = w.bind(null, n, a, !0)
} else e.sourceMap && "function" == typeof URL && "function" == typeof URL.createObjectURL && "function" == typeof URL.revokeObjectURL && "function" == typeof Blob && "function" == typeof btoa ? (n = function(e) {
var t = document.createElement("link");
return void 0 === e.attrs.type && (e.attrs.type = "text/css"), e.attrs.rel = "stylesheet", m(t, e.attrs), h(e, t), t
}(t), r = function(e, t, n) {
var r = n.css,
o = n.sourceMap,
i = void 0 === t.convertToAbsoluteUrls && o;
(t.convertToAbsoluteUrls || i) && (r = f(r));
o && (r += "\n/*# sourceMappingURL=data:application/json;base64," + btoa(unescape(encodeURIComponent(JSON.stringify(o)))) + " */");
var a = new Blob([r], {
type: "text/css"
}),
s = e.href;
e.href = URL.createObjectURL(a), s && URL.revokeObjectURL(s)
}.bind(null, n, t), o = function() {
y(n), n.href && URL.revokeObjectURL(n.href)
}) : (n = v(t), r = function(e, t) {
var n = t.css,
r = t.media;
r && e.setAttribute("media", r);
if (e.styleSheet) e.styleSheet.cssText = n;
else {
for (; e.firstChild;) e.removeChild(e.firstChild);
e.appendChild(document.createTextNode(n))
}
}.bind(null, n), o = function() {
y(n)
});
return r(e),
function(t) {
if (t) {
if (t.css === e.css && t.media === e.media && t.sourceMap === e.sourceMap) return;
r(e = t)
} else o()
}
}
e.exports = function(e, t) {
if ("undefined" != typeof DEBUG && DEBUG && "object" != typeof document) throw new Error("The style-loader cannot be used in a non-browser environment");
(t = t || {}).attrs = "object" == typeof t.attrs ? t.attrs : {}, t.singleton || "boolean" == typeof t.singleton || (t.singleton = a()), t.insertInto || (t.insertInto = "head"), t.insertAt || (t.insertAt = "bottom");
var n = d(e, t);
return p(n, t),
function(e) {
for (var r = [], o = 0; o < n.length; o++) {
var a = n[o];
(s = i[a.id]).refs--, r.push(s)
}
e && p(d(e, t), t);
for (o = 0; o < r.length; o++) {
var s;
if (0 === (s = r[o]).refs) {
for (var l = 0; l < s.parts.length; l++) s.parts[l]();
delete i[s.id]
}
}
}
};
var g, x = (g = [], function(e, t) {
return g[e] = t, g.filter(Boolean).join("\n")
});
function w(e, t, n, r) {
var o = n ? "" : r.css;
if (e.styleSheet) e.styleSheet.cssText = x(t, o);
else {
var i = document.createTextNode(o),
a = e.childNodes;
a[t] && e.removeChild(a[t]), a.length ? e.insertBefore(i, a[t]) : e.appendChild(i)
}
}
}, function(e, t) {
e.exports = function(e) {
var t = [];
return t.toString = function() {
return this.map(function(t) {
var n = function(e, t) {
var n = e[1] || "",
r = e[3];
if (!r) return n;
if (t && "function" == typeof btoa) {
var o = (a = r, "/*# sourceMappingURL=data:application/json;charset=utf-8;base64," + btoa(unescape(encodeURIComponent(JSON.stringify(a)))) + " */"),
i = r.sources.map(function(e) {
return "/*# sourceURL=" + r.sourceRoot + e + " */"
});
return [n].concat(i).concat([o]).join("\n")
}
var a;
return [n].join("\n")
}(t, e);
return t[2] ? "@media " + t[2] + "{" + n + "}" : n
}).join("")
}, t.i = function(e, n) {
"string" == typeof e && (e = [
[null, e, ""]
]);
for (var r = {}, o = 0; o < this.length; o++) {
var i = this[o][0];
"number" == typeof i && (r[i] = !0)
}
for (o = 0; o < e.length; o++) {
var a = e[o];
"number" == typeof a[0] && r[a[0]] || (n && !a[2] ? a[2] = n : n && (a[2] = "(" + a[2] + ") and (" + n + ")"), t.push(a))
}
}, t
}
}, function(e, t, n) {
(e.exports = n(7)(!1)).push([e.i, ".empty{}", ""])
}, function(e, t, n) {
var r = n(8);
"string" == typeof r && (r = [
[e.i, r, ""]
]);
var o = {
hmr: !0,
transform: void 0,
insertInto: void 0
};
n(6)(r, o);
r.locals && (e.exports = r.locals)
}, function(e, t, n) {
"use strict";
e.exports = {}
}, function(e, t, n) {
"use strict";
/*
object-assign
(c) Sindre Sorhus
@license MIT
*/
var r = Object.getOwnPropertySymbols,
o = Object.prototype.hasOwnProperty,
i = Object.prototype.propertyIsEnumerable;
e.exports = function() {
try {
if (!Object.assign) return !1;
var e = new String("abc");
if (e[5] = "de", "5" === Object.getOwnPropertyNames(e)[0]) return !1;
for (var t = {}, n = 0; n < 10; n++) t["_" + String.fromCharCode(n)] = n;
if ("0123456789" !== Object.getOwnPropertyNames(t).map(function(e) {
return t[e]
}).join("")) return !1;
var r = {};
return "abcdefghijklmnopqrst".split("").forEach(function(e) {
r[e] = e
}), "abcdefghijklmnopqrst" === Object.keys(Object.assign({}, r)).join("")
} catch (e) {
return !1
}
}() ? Object.assign : function(e, t) {
for (var n, a, s = function(e) {
if (null === e || void 0 === e) throw new TypeError("Object.assign cannot be called with null or undefined");
return Object(e)
}(e), l = 1; l < arguments.length; l++) {
for (var u in n = Object(arguments[l])) o.call(n, u) && (s[u] = n[u]);
if (r) {
a = r(n);
for (var c = 0; c < a.length; c++) i.call(n, a[c]) && (s[a[c]] = n[a[c]])
}
}
return s
}
}, function(e, t, n) {
"use strict";
/** @license React v16.4.0
* react.production.min.js
*
* Copyright (c) 2013-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var r = n(11),
o = n(1),
i = n(10),
a = n(0),
s = "function" == typeof Symbol && Symbol.for,
l = s ? Symbol.for("react.element") : 60103,
u = s ? Symbol.for("react.portal") : 60106,
c = s ? Symbol.for("react.fragment") : 60107,
f = s ? Symbol.for("react.strict_mode") : 60108,
p = s ? Symbol.for("react.profiler") : 60114,
d = s ? Symbol.for("react.provider") : 60109,
h = s ? Symbol.for("react.context") : 60110,
y = s ? Symbol.for("react.async_mode") : 60111,
v = s ? Symbol.for("react.forward_ref") : 60112;
s && Symbol.for("react.timeout");
var m = "function" == typeof Symbol && Symbol.iterator;
function b(e) {
for (var t = arguments.length - 1, n = "https://reactjs.org/docs/error-decoder.html?invariant=" + e, r = 0; r < t; r++) n += "&args[]=" + encodeURIComponent(arguments[r + 1]);
o(!1, "Minified React error #" + e + "; visit %s for the full message or use the non-minified dev environment for full errors and additional helpful warnings. ", n)
}
var g = {
isMounted: function() {
return !1
},
enqueueForceUpdate: function() {},
enqueueReplaceState: function() {},
enqueueSetState: function() {}
};
function x(e, t, n) {
this.props = e, this.context = t, this.refs = i, this.updater = n || g
}
function w() {}
function O(e, t, n) {
this.props = e, this.context = t, this.refs = i, this.updater = n || g
}
x.prototype.isReactComponent = {}, x.prototype.setState = function(e, t) {
"object" != typeof e && "function" != typeof e && null != e && b("85"), this.updater.enqueueSetState(this, e, t, "setState")
}, x.prototype.forceUpdate = function(e) {
this.updater.enqueueForceUpdate(this, e, "forceUpdate")
}, w.prototype = x.prototype;
var S = O.prototype = new w;
S.constructor = O, r(S, x.prototype), S.isPureReactComponent = !0;
var C = {
current: null
},
j = Object.prototype.hasOwnProperty,
k = {
key: !0,
ref: !0,
__self: !0,
__source: !0
};
function _(e, t, n) {
var r = void 0,
o = {},
i = null,
a = null;
if (null != t)
for (r in void 0 !== t.ref && (a = t.ref), void 0 !== t.key && (i = "" + t.key), t) j.call(t, r) && !k.hasOwnProperty(r) && (o[r] = t[r]);
var s = arguments.length - 2;
if (1 === s) o.children = n;
else if (1 < s) {
for (var u = Array(s), c = 0; c < s; c++) u[c] = arguments[c + 2];
o.children = u
}
if (e && e.defaultProps)
for (r in s = e.defaultProps) void 0 === o[r] && (o[r] = s[r]);
return {
$$typeof: l,
type: e,
key: i,
ref: a,
props: o,
_owner: C.current
}
}
function R(e) {
return "object" == typeof e && null !== e && e.$$typeof === l
}
var E = /\/+/g,
P = [];
function T(e, t, n, r) {
if (P.length) {
var o = P.pop();
return o.result = e, o.keyPrefix = t, o.func = n, o.context = r, o.count = 0, o
}
return {
result: e,
keyPrefix: t,
func: n,
context: r,
count: 0
}
}
function U(e) {
e.result = null, e.keyPrefix = null, e.func = null, e.context = null, e.count = 0, 10 > P.length && P.push(e)
}
function A(e, t, n, r) {
var o = typeof e;
"undefined" !== o && "boolean" !== o || (e = null);
var i = !1;
if (null === e) i = !0;
else switch (o) {
case "string":
case "number":
i = !0;
break;
case "object":
switch (e.$$typeof) {
case l:
case u:
i = !0
}
}
if (i) return n(r, e, "" === t ? "." + I(e, 0) : t), 1;
if (i = 0, t = "" === t ? "." : t + ":", Array.isArray(e))
for (var a = 0; a < e.length; a++) {
var s = t + I(o = e[a], a);
i += A(o, s, n, r)
} else if (null === e || void 0 === e ? s = null : s = "function" == typeof(s = m && e[m] || e["@@iterator"]) ? s : null, "function" == typeof s)
for (e = s.call(e), a = 0; !(o = e.next()).done;) i += A(o = o.value, s = t + I(o, a++), n, r);
else "object" === o && b("31", "[object Object]" === (n = "" + e) ? "object with keys {" + Object.keys(e).join(", ") + "}" : n, "");
return i
}
function I(e, t) {
return "object" == typeof e && null !== e && null != e.key ? function(e) {
var t = {
"=": "=0",
":": "=2"
};
return "$" + ("" + e).replace(/[=:]/g, function(e) {
return t[e]
})
}(e.key) : t.toString(36)
}
function N(e, t) {
e.func.call(e.context, t, e.count++)
}
function L(e, t, n) {
var r = e.result,
o = e.keyPrefix;
e = e.func.call(e.context, t, e.count++), Array.isArray(e) ? $(e, r, n, a.thatReturnsArgument) : null != e && (R(e) && (t = o + (!e.key || t && t.key === e.key ? "" : ("" + e.key).replace(E, "$&/") + "/") + n, e = {
$$typeof: l,
type: e.type,
key: t,
ref: e.ref,
props: e.props,
_owner: e._owner
}), r.push(e))
}
function $(e, t, n, r, o) {
var i = "";
null != n && (i = ("" + n).replace(E, "$&/") + "/"), t = T(t, i, r, o), null == e || A(e, "", L, t), U(t)
}
var M = {
Children: {
map: function(e, t, n) {
if (null == e) return e;
var r = [];
return $(e, r, null, t, n), r
},
forEach: function(e, t, n) {
if (null == e) return e;
t = T(null, null, t, n), null == e || A(e, "", N, t), U(t)
},
count: function(e) {
return null == e ? 0 : A(e, "", a.thatReturnsNull, null)
},
toArray: function(e) {
var t = [];
return $(e, t, null, a.thatReturnsArgument), t
},
only: function(e) {
return R(e) || b("143"), e
}
},
createRef: function() {
return {
current: null
}
},
Component: x,
PureComponent: O,
createContext: function(e, t) {
return void 0 === t && (t = null), (e = {
$$typeof: h,
_calculateChangedBits: t,
_defaultValue: e,
_currentValue: e,
_currentValue2: e,
_changedBits: 0,
_changedBits2: 0,
Provider: null,
Consumer: null
}).Provider = {
$$typeof: d,
_context: e
}, e.Consumer = e
},
forwardRef: function(e) {
return {
$$typeof: v,
render: e
}
},
Fragment: c,
StrictMode: f,
unstable_AsyncMode: y,
unstable_Profiler: p,
createElement: _,
cloneElement: function(e, t, n) {
(null === e || void 0 === e) && b("267", e);
var o = void 0,
i = r({}, e.props),
a = e.key,
s = e.ref,
u = e._owner;
if (null != t) {
void 0 !== t.ref && (s = t.ref, u = C.current), void 0 !== t.key && (a = "" + t.key);
var c = void 0;
for (o in e.type && e.type.defaultProps && (c = e.type.defaultProps), t) j.call(t, o) && !k.hasOwnProperty(o) && (i[o] = void 0 === t[o] && void 0 !== c ? c[o] : t[o])
}
if (1 === (o = arguments.length - 2)) i.children = n;
else if (1 < o) {
c = Array(o);
for (var f = 0; f < o; f++) c[f] = arguments[f + 2];
i.children = c
}
return {
$$typeof: l,
type: e.type,
key: a,
ref: s,
props: i,
_owner: u
}
},
createFactory: function(e) {
var t = _.bind(null, e);
return t.type = e, t
},
isValidElement: R,
version: "16.4.0",
__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: {
ReactCurrentOwner: C,
assign: r
}
},
B = {
default: M
},
D = B && M || B;
e.exports = D.default ? D.default : D
}, function(e, t, n) {
"use strict";
e.exports = n(12)
}, function(e, t, n) {
"use strict";
Object.defineProperty(t, "__esModule", {
value: !0
});
var r = Object.assign || function(e) {
for (var t = 1; t < arguments.length; t++) {
var n = arguments[t];
for (var r in n) Object.prototype.hasOwnProperty.call(n, r) && (e[r] = n[r])
}
return e
},
o = function() {
function e(e, t) {
for (var n = 0; n < t.length; n++) {
var r = t[n];
r.enumerable = r.enumerable || !1, r.configurable = !0, "value" in r && (r.writable = !0), Object.defineProperty(e, r.key, r)
}
}
return function(t, n, r) {
return n && e(t.prototype, n), r && e(t, r), t
}
}(),
i = s(n(13));
n(9);
var a = s(n(4));
function s(e) {
return e && e.__esModule ? e : {
default: e
}
}
function gp(el) {
var x = 0,
y = 0;
while (el != null && (el.tagName || '').toLowerCase() != 'html') {
x += el.offsetLeft || 0;
y += el.offsetTop || 0;
el = el.parentElement;
}
return { x: parseInt(x, 10), y: parseInt(y, 10) };
}
var l = function(e) {
function t(e) {
! function(e, t) {
if (!(e instanceof t)) throw new TypeError("Cannot call a class as a function")
}(this, t);
var n = function(e, t) {
if (!e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
return !t || "object" != typeof t && "function" != typeof t ? e : t
}(this, (t.__proto__ || Object.getPrototypeOf(t)).call(this, e));
return n.show = function(e) {
e.preventDefault(), n.setState({
showOptions: !0
})
}, n.hide = function(e) {
n.wrapperRef && !n.wrapperRef.contains(e.target) && n.setState({
showOptions: !1
})
}, n.handleChange = function(e) {
e.preventDefault(), n.setState({
userInput: e.target.value
})
n.props.onUserInput && n.props.onUserInput(e.target.value);
}, n.addTag = function(e) {
var t = n.state.selected;
if (-1 === n.state.selected.indexOf(e)) {
t.push(e);
var r = [];
r.push(e), n.setState({
selected: n.props.multiSelect ? t : r,
userInput: ""
})
} else {
t.splice(n.state.selected.indexOf(e), 1);
var o = t.slice(n.state.selected.indexOf(e), 1);
n.setState({
selected: n.props.multiSelect ? t : o,
userInput: ""
})
}
}, n.removeTag = function(e) {
var t = n.state.selected;
t.splice(e, 1), n.setState(r({}, n.state, {
selected: t
}))
}, n.setWrapperRef = function(e) {
n.wrapperRef = e
}, n.selectAll = function(e) {
e.preventDefault();
var t = n.props.options.slice();
n.setState({
selected: t
})
}, n.unselectAll = function(e) {
e.preventDefault(), n.setState({
selected: []
})
}, n.none = function() {}, n.state = {
showOptions: !1,
selected: [],
userInput: ""
}, n
}
return function(e, t) {
if ("function" != typeof t && null !== t) throw new TypeError("Super expression must either be null or a function, not " + typeof t);
e.prototype = Object.create(t && t.prototype, {
constructor: {
value: e,
enumerable: !1,
writable: !0,
configurable: !0
}
}), t && (Object.setPrototypeOf ? Object.setPrototypeOf(e, t) : e.__proto__ = t)
}(t, i.default.Component), o(t, [{
key: "componentWillMount",
value: function() {
document.addEventListener("mousedown", this.hide)
}
}, {
key: "componentWillUnmount",
value: function() {
document.removeEventListener("mousedown", this.hide)
}
}, {
key: "componentDidUpdate",
value: function() {
this.props.onSelect && this.props.onSelect(this.state.selected)
}
}, {
key: "render",
value: function() {
var e = this;
return i.default.createElement("div", {
ref: this.setWrapperRef,
className: "multi-select "+this.props.className||"",
style: {
width: this.props.width
}
}, i.default.createElement("div", null, i.default.createElement("div", {
className: "input-area",
contentEditable: !1,
onFocus: this.props.searchable ? this.show : this.none,
onClick: this.props.searchable ? this.none : this.show,
style: {
background: this.props.primaryColor,
color: this.props.textColor
}
}, this.props.showTags && i.default.createElement("div", {
contentEditable: !1,
style: {
display: this.props.multiSelect?"inline":"flex",
}
}, this.state.selected.map((function(t, n) {
return i.default.createElement("div", {
className: "tags",
title:t[this.props.optionModel.optionValue]
+(this.props.optionModel.optionValueD?
" "+t[this.props.optionModel.optionValueD]:""),
key: n,
style: {
background: e.props.secondaryColor,
color: e.props.textSecondaryColor
}
}, t[this.props.optionModel.tagValue], i.default.createElement("span", {
onClick: function(t) {
t.preventDefault(), e.removeTag(n)
}
}, String.fromCharCode(10007)))
}).bind(this))),this.props.searchable && i.default.createElement("div", {
className: "input-box-container",
style: {
background: this.props.primaryColor,
color: this.props.textColor
}
},
this.props.searchable && i.default.createElement("input", {
type: "text",
value: this.state.userInput,
onChange: this.handleChange,
placeholder: this.props.searchPlaceholder,
className: "input-box",
style: {
background: this.props.primaryColor,
color: this.props.textColor
}
}),this.props.multiSelect && i.default.createElement("div", {
style: {
display: "flex",
justifyContent: "space-around"
}
}, i.default.createElement("button", {
className: "btn",
onClick: this.selectAll,
style: {
background: this.props.secondaryColor,
color: this.props.textSecondaryColor
}
}, "Select All"), i.default.createElement("button", {
className: "btn",
onClick: this.unselectAll,
style: {
background: this.props.secondaryColor,
color: this.props.textSecondaryColor
}
}, "Unselect All")))),this.state.showOptions && this.props.options && i.default.createElement("div", {
className: "option-area",
style: {
background: this.props.primaryColor,
color: this.props.textColor,
maxHeight: this.props.optionsContainerHeight,
width:this.props.optionsContainerWidth?this.props.optionsContainerWidth:(document.getElementsByClassName("multi-select")[0].offsetWidth+"px")
}
}, this.props.options.map((function(t, n) {
let active = e.state.selected.indexOf(t) > -1;
return t[this.props.optionModel.optionValue].toLowerCase().indexOf(e.state.userInput.toLowerCase()) > -1 ? i.default.createElement("div", {
className: "option" + (active ? " active" : ""),
key: n,
onClick: function(n) {
n.preventDefault(), e.addTag(t)
}
},i.default.createElement("div",
{
className:"option-detail",
style:{
width:active?"calc(100% - 30px)":"100%"
}
},
i.default.createElement("div",
{
className:"option-value"
},
t[this.props.optionModel.optionValue]),
(this.props.optionModel.optionValueD?
i.default.createElement("div",
{
className:"option-value-d"
},
t[this.props.optionModel.optionValueD]):"")), " ",
i.default.createElement("div", {
className:"check-mark",
style: {
display: active?"block":"none"
}
}, "✓")) : null
}).bind(this)))))
}
}]), t
}();
l.propTypes = {
options: a.default.array.isRequired,
optionModel:a.default.object.isRequired,
optionsContainerHeight: a.default.string,
searchPlaceholder: a.default.string,
width: a.default.string,
primaryColor: a.default.string,
secondaryColor: a.default.string,
textColor: a.default.string,
textSecondaryColor: a.default.string,
className: a.default.string,
searchable: a.default.bool,
showTags: a.default.bool,
multiSelect: a.default.bool,
onSelect: a.default.func.isRequired,
onUserInput: a.default.func
}, l.defaultProps = {
optionsContainerHeight: "50vh",
searchPlaceholder: "Search...",
className: "",
width: "100%",
primaryColor: "#ffffff",
secondaryColor: "#046fc0",
textColor: "#000",
textSecondaryColor: "#fff",
searchable: !0,
showTags: !0,
multiSelect: !0
}, t.default = l
}]);