Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

my-autocompletec

Package Overview
Dependencies
Maintainers
1
Versions
3
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

my-autocompletec - npm Package Compare versions

Comparing version 0.0.1 to 0.1.0

src/index.css

690

dist/autocomplete.js

@@ -88,4 +88,6 @@ (function webpackUniversalModuleDefinition(root, factory) {

var _objectAssign = __webpack_require__(1);
__webpack_require__(1);
var _objectAssign = __webpack_require__(6);
var _objectAssign2 = _interopRequireDefault(_objectAssign);

@@ -130,2 +132,3 @@

AutoComplete.prototype._changeAutoCompleteDebounce = debounce(AutoComplete.prototype._changeAutoComplete, opts.debounce);
//阻止光标上下键移动
self.target.addEventListener('keydown', function (e) {

@@ -137,2 +140,3 @@ var code = e.which || e.keyCode;

});
//keyup中可以同时获取到keyCode和input的value
self.target.addEventListener('keyup', function (e) {

@@ -142,10 +146,12 @@ e.preventDefault();

var inputValue = e.target.value;
self._changeAutoComplete(code, inputValue);
self._handleInput(code, inputValue);
});
}
AutoComplete.prototype._changeAutoComplete = function (code, inputValue) {
console.log('complete ' + inputValue);
console.log('code ' + code);
var autoc = this.autoc;
AutoComplete.prototype._handleInput = function (code, inputValue) {
//排除 shift,ctrl,alt键
var excludes = [16, 17, 18];
if (excludes.indexOf(code) > -1) {
return;
}
//上键 38

@@ -168,21 +174,30 @@ if (code == 38) {

this._highlightAutoComplete(this.pos);
} else {
var resultData = this._findData(inputValue, this.opts.dataset);
this.resultData = resultData;
this.originValue = inputValue;
if (resultData && resultData.length) {
autoc.style.display = 'block';
var dataHtml = resultData.map(function (item) {
return '<li class="auto-item">\n <div class="auto-inner">' + item.value + '</div>\n </li>';
}).join('');
autoc.querySelector('.autos').innerHTML = dataHtml;
}
//回车
else if (code == 13) {
this._highlightAutoComplete(this.pos, true);
} else {
autoc.style.display = 'none';
this._changeAutoCompleteDebounce(inputValue);
}
//重置位置
this.pos = -1;
}
};
AutoComplete.prototype._highlightAutoComplete = function (pos) {
AutoComplete.prototype._changeAutoComplete = function (inputValue) {
var autoc = this.autoc;
var resultData = this._findData(inputValue, this.opts.dataset);
this.resultData = resultData;
this.originValue = inputValue;
if (resultData && resultData.length) {
autoc.style.display = 'block';
var dataHtml = resultData.map(function (item) {
return '<li class="auto-item">\n <div class="auto-inner">' + item.value + '</div>\n </li>';
}).join('');
autoc.querySelector('.autos').innerHTML = dataHtml;
} else {
autoc.style.display = 'none';
}
//重置位置
this.pos = -1;
};
AutoComplete.prototype._highlightAutoComplete = function (pos, bEnter) {
var items = Array.prototype.slice.call(this.autoc.querySelectorAll('.auto-item'));

@@ -194,3 +209,7 @@ items.forEach(function (item) {

var activeItem = items[pos];
addClass(activeItem, 'active');
if (bEnter) {
this.autoc.style.display = 'none';
} else {
addClass(activeItem, 'active');
}
this.target.value = activeItem.querySelector('.auto-inner').innerHTML;

@@ -234,2 +253,629 @@ } else {

var content = __webpack_require__(2);
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(4)(content, options);
if(content.locals) module.exports = content.locals;
if(false) {
module.hot.accept("!!../node_modules/_css-loader@1.0.0@css-loader/index.js!./index.css", function() {
var newContent = require("!!../node_modules/_css-loader@1.0.0@css-loader/index.js!./index.css");
if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];
var locals = (function(a, b) {
var key, idx = 0;
for(key in a) {
if(!b || a[key] !== b[key]) return false;
idx++;
}
for(key in b) idx--;
return idx === 0;
}(content.locals, newContent.locals));
if(!locals) throw new Error('Aborting CSS HMR due to changed css-modules locals.');
update(newContent);
});
module.hot.dispose(function() { update(); });
}
/***/ }),
/* 2 */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(3)(false);
// imports
// module
exports.push([module.i, ".autoc{\n position: absolute;\n text-align: left;\n border: 1px solid #ccc;\n border-top:0;\n display: none;\n}\n.autoc ul{\n list-style-type: none;\n}\n.autoc ul,.autoc li{\n margin: 0;\n padding: 0;\n}\n.auto-inner{\n padding: 5px;\n}\n.auto-item.active .auto-inner{\n background-color:#ccc;\n}", ""]);
// exports
/***/ }),
/* 3 */
/***/ (function(module, exports) {
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
*/
// css base code, injected by the css-loader
module.exports = function(useSourceMap) {
var list = [];
// return the list of modules as css string
list.toString = function toString() {
return this.map(function (item) {
var content = cssWithMappingToString(item, useSourceMap);
if(item[2]) {
return "@media " + item[2] + "{" + content + "}";
} else {
return content;
}
}).join("");
};
// import a list of modules into the list
list.i = function(modules, mediaQuery) {
if(typeof modules === "string")
modules = [[null, modules, ""]];
var alreadyImportedModules = {};
for(var i = 0; i < this.length; i++) {
var id = this[i][0];
if(typeof id === "number")
alreadyImportedModules[id] = true;
}
for(i = 0; i < modules.length; i++) {
var item = modules[i];
// skip already imported module
// this implementation is not 100% perfect for weird media query combinations
// when a module is imported multiple times with different media queries.
// I hope this will never occur (Hey this way we have smaller bundles)
if(typeof item[0] !== "number" || !alreadyImportedModules[item[0]]) {
if(mediaQuery && !item[2]) {
item[2] = mediaQuery;
} else if(mediaQuery) {
item[2] = "(" + item[2] + ") and (" + mediaQuery + ")";
}
list.push(item);
}
}
};
return list;
};
function cssWithMappingToString(item, useSourceMap) {
var content = item[1] || '';
var cssMapping = item[3];
if (!cssMapping) {
return content;
}
if (useSourceMap && typeof btoa === 'function') {
var sourceMapping = toComment(cssMapping);
var sourceURLs = cssMapping.sources.map(function (source) {
return '/*# sourceURL=' + cssMapping.sourceRoot + source + ' */'
});
return [content].concat(sourceURLs).concat([sourceMapping]).join('\n');
}
return [content].join('\n');
}
// Adapted from convert-source-map (MIT)
function toComment(sourceMap) {
// eslint-disable-next-line no-undef
var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap))));
var data = 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + base64;
return '/*# ' + data + ' */';
}
/***/ }),
/* 4 */
/***/ (function(module, exports, __webpack_require__) {
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
*/
var stylesInDom = {};
var memoize = function (fn) {
var memo;
return function () {
if (typeof memo === "undefined") memo = fn.apply(this, arguments);
return memo;
};
};
var isOldIE = memoize(function () {
// Test for IE <= 9 as proposed by Browserhacks
// @see http://browserhacks.com/#hack-e71d8692f65334173fee715c222cb805
// Tests for existence of standard globals is to allow style-loader
// to operate correctly into non-standard environments
// @see https://github.com/webpack-contrib/style-loader/issues/177
return window && document && document.all && !window.atob;
});
var getTarget = function (target) {
return document.querySelector(target);
};
var getElement = (function (fn) {
var memo = {};
return function(target) {
// If passing function in options, then use it for resolve "head" element.
// Useful for Shadow Root style i.e
// {
// insertInto: function () { return document.querySelector("#foo").shadowRoot }
// }
if (typeof target === 'function') {
return target();
}
if (typeof memo[target] === "undefined") {
var styleTarget = getTarget.call(this, target);
// Special case to return head of iframe instead of iframe itself
if (window.HTMLIFrameElement && styleTarget instanceof window.HTMLIFrameElement) {
try {
// This will throw an exception if access to iframe is blocked
// due to cross-origin restrictions
styleTarget = styleTarget.contentDocument.head;
} catch(e) {
styleTarget = null;
}
}
memo[target] = styleTarget;
}
return memo[target]
};
})();
var singleton = null;
var singletonCounter = 0;
var stylesInsertedAtTop = [];
var fixUrls = __webpack_require__(5);
module.exports = function(list, options) {
if (typeof DEBUG !== "undefined" && DEBUG) {
if (typeof document !== "object") throw new Error("The style-loader cannot be used in a non-browser environment");
}
options = options || {};
options.attrs = typeof options.attrs === "object" ? options.attrs : {};
// Force single-tag solution on IE6-9, which has a hard limit on the # of <style>
// tags it will allow on a page
if (!options.singleton && typeof options.singleton !== "boolean") options.singleton = isOldIE();
// By default, add <style> tags to the <head> element
if (!options.insertInto) options.insertInto = "head";
// By default, add <style> tags to the bottom of the target
if (!options.insertAt) options.insertAt = "bottom";
var styles = listToStyles(list, options);
addStylesToDom(styles, options);
return function update (newList) {
var mayRemove = [];
for (var i = 0; i < styles.length; i++) {
var item = styles[i];
var domStyle = stylesInDom[item.id];
domStyle.refs--;
mayRemove.push(domStyle);
}
if(newList) {
var newStyles = listToStyles(newList, options);
addStylesToDom(newStyles, options);
}
for (var i = 0; i < mayRemove.length; i++) {
var domStyle = mayRemove[i];
if(domStyle.refs === 0) {
for (var j = 0; j < domStyle.parts.length; j++) domStyle.parts[j]();
delete stylesInDom[domStyle.id];
}
}
};
};
function addStylesToDom (styles, options) {
for (var i = 0; i < styles.length; i++) {
var item = styles[i];
var domStyle = stylesInDom[item.id];
if(domStyle) {
domStyle.refs++;
for(var j = 0; j < domStyle.parts.length; j++) {
domStyle.parts[j](item.parts[j]);
}
for(; j < item.parts.length; j++) {
domStyle.parts.push(addStyle(item.parts[j], options));
}
} else {
var parts = [];
for(var j = 0; j < item.parts.length; j++) {
parts.push(addStyle(item.parts[j], options));
}
stylesInDom[item.id] = {id: item.id, refs: 1, parts: parts};
}
}
}
function listToStyles (list, options) {
var styles = [];
var newStyles = {};
for (var i = 0; i < list.length; i++) {
var item = list[i];
var id = options.base ? item[0] + options.base : item[0];
var css = item[1];
var media = item[2];
var sourceMap = item[3];
var part = {css: css, media: media, sourceMap: sourceMap};
if(!newStyles[id]) styles.push(newStyles[id] = {id: id, parts: [part]});
else newStyles[id].parts.push(part);
}
return styles;
}
function insertStyleElement (options, style) {
var target = getElement(options.insertInto)
if (!target) {
throw new Error("Couldn't find a style target. This probably means that the value for the 'insertInto' parameter is invalid.");
}
var lastStyleElementInsertedAtTop = stylesInsertedAtTop[stylesInsertedAtTop.length - 1];
if (options.insertAt === "top") {
if (!lastStyleElementInsertedAtTop) {
target.insertBefore(style, target.firstChild);
} else if (lastStyleElementInsertedAtTop.nextSibling) {
target.insertBefore(style, lastStyleElementInsertedAtTop.nextSibling);
} else {
target.appendChild(style);
}
stylesInsertedAtTop.push(style);
} else if (options.insertAt === "bottom") {
target.appendChild(style);
} else if (typeof options.insertAt === "object" && options.insertAt.before) {
var nextSibling = getElement(options.insertInto + " " + options.insertAt.before);
target.insertBefore(style, nextSibling);
} else {
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");
}
}
function removeStyleElement (style) {
if (style.parentNode === null) return false;
style.parentNode.removeChild(style);
var idx = stylesInsertedAtTop.indexOf(style);
if(idx >= 0) {
stylesInsertedAtTop.splice(idx, 1);
}
}
function createStyleElement (options) {
var style = document.createElement("style");
if(options.attrs.type === undefined) {
options.attrs.type = "text/css";
}
addAttrs(style, options.attrs);
insertStyleElement(options, style);
return style;
}
function createLinkElement (options) {
var link = document.createElement("link");
if(options.attrs.type === undefined) {
options.attrs.type = "text/css";
}
options.attrs.rel = "stylesheet";
addAttrs(link, options.attrs);
insertStyleElement(options, link);
return link;
}
function addAttrs (el, attrs) {
Object.keys(attrs).forEach(function (key) {
el.setAttribute(key, attrs[key]);
});
}
function addStyle (obj, options) {
var style, update, remove, result;
// If a transform function was defined, run it on the css
if (options.transform && obj.css) {
result = options.transform(obj.css);
if (result) {
// If transform returns a value, use that instead of the original css.
// This allows running runtime transformations on the css.
obj.css = result;
} else {
// If the transform function returns a falsy value, don't add this css.
// This allows conditional loading of css
return function() {
// noop
};
}
}
if (options.singleton) {
var styleIndex = singletonCounter++;
style = singleton || (singleton = createStyleElement(options));
update = applyToSingletonTag.bind(null, style, styleIndex, false);
remove = applyToSingletonTag.bind(null, style, styleIndex, true);
} else if (
obj.sourceMap &&
typeof URL === "function" &&
typeof URL.createObjectURL === "function" &&
typeof URL.revokeObjectURL === "function" &&
typeof Blob === "function" &&
typeof btoa === "function"
) {
style = createLinkElement(options);
update = updateLink.bind(null, style, options);
remove = function () {
removeStyleElement(style);
if(style.href) URL.revokeObjectURL(style.href);
};
} else {
style = createStyleElement(options);
update = applyToTag.bind(null, style);
remove = function () {
removeStyleElement(style);
};
}
update(obj);
return function updateStyle (newObj) {
if (newObj) {
if (
newObj.css === obj.css &&
newObj.media === obj.media &&
newObj.sourceMap === obj.sourceMap
) {
return;
}
update(obj = newObj);
} else {
remove();
}
};
}
var replaceText = (function () {
var textStore = [];
return function (index, replacement) {
textStore[index] = replacement;
return textStore.filter(Boolean).join('\n');
};
})();
function applyToSingletonTag (style, index, remove, obj) {
var css = remove ? "" : obj.css;
if (style.styleSheet) {
style.styleSheet.cssText = replaceText(index, css);
} else {
var cssNode = document.createTextNode(css);
var childNodes = style.childNodes;
if (childNodes[index]) style.removeChild(childNodes[index]);
if (childNodes.length) {
style.insertBefore(cssNode, childNodes[index]);
} else {
style.appendChild(cssNode);
}
}
}
function applyToTag (style, obj) {
var css = obj.css;
var media = obj.media;
if(media) {
style.setAttribute("media", media)
}
if(style.styleSheet) {
style.styleSheet.cssText = css;
} else {
while(style.firstChild) {
style.removeChild(style.firstChild);
}
style.appendChild(document.createTextNode(css));
}
}
function updateLink (link, options, obj) {
var css = obj.css;
var sourceMap = obj.sourceMap;
/*
If convertToAbsoluteUrls isn't defined, but sourcemaps are enabled
and there is no publicPath defined then lets turn convertToAbsoluteUrls
on by default. Otherwise default to the convertToAbsoluteUrls option
directly
*/
var autoFixUrls = options.convertToAbsoluteUrls === undefined && sourceMap;
if (options.convertToAbsoluteUrls || autoFixUrls) {
css = fixUrls(css);
}
if (sourceMap) {
// http://stackoverflow.com/a/26603875
css += "\n/*# sourceMappingURL=data:application/json;base64," + btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))) + " */";
}
var blob = new Blob([css], { type: "text/css" });
var oldSrc = link.href;
link.href = URL.createObjectURL(blob);
if(oldSrc) URL.revokeObjectURL(oldSrc);
}
/***/ }),
/* 5 */
/***/ (function(module, exports) {
/**
* When source maps are enabled, `style-loader` uses a link element with a data-uri to
* embed the css on the page. This breaks all relative urls because now they are relative to a
* bundle instead of the current page.
*
* One solution is to only use full urls, but that may be impossible.
*
* Instead, this function "fixes" the relative urls to be absolute according to the current page location.
*
* A rudimentary test suite is located at `test/fixUrls.js` and can be run via the `npm test` command.
*
*/
module.exports = function (css) {
// get current location
var location = typeof window !== "undefined" && window.location;
if (!location) {
throw new Error("fixUrls requires window.location");
}
// blank or null?
if (!css || typeof css !== "string") {
return css;
}
var baseUrl = location.protocol + "//" + location.host;
var currentDir = baseUrl + location.pathname.replace(/\/[^\/]*$/, "/");
// convert each url(...)
/*
This regular expression is just a way to recursively match brackets within
a string.
/url\s*\( = Match on the word "url" with any whitespace after it and then a parens
( = Start a capturing group
(?: = Start a non-capturing group
[^)(] = Match anything that isn't a parentheses
| = OR
\( = Match a start parentheses
(?: = Start another non-capturing groups
[^)(]+ = Match anything that isn't a parentheses
| = OR
\( = Match a start parentheses
[^)(]* = Match anything that isn't a parentheses
\) = Match a end parentheses
) = End Group
*\) = Match anything and then a close parens
) = Close non-capturing group
* = Match anything
) = Close capturing group
\) = Match a close parens
/gi = Get all matches, not the first. Be case insensitive.
*/
var fixedCss = css.replace(/url\s*\(((?:[^)(]|\((?:[^)(]+|\([^)(]*\))*\))*)\)/gi, function(fullMatch, origUrl) {
// strip quotes (if they exist)
var unquotedOrigUrl = origUrl
.trim()
.replace(/^"(.*)"$/, function(o, $1){ return $1; })
.replace(/^'(.*)'$/, function(o, $1){ return $1; });
// already a full url? no change
if (/^(#|data:|http:\/\/|https:\/\/|file:\/\/\/|\s*$)/i.test(unquotedOrigUrl)) {
return fullMatch;
}
// convert the url to a full url
var newUrl;
if (unquotedOrigUrl.indexOf("//") === 0) {
//TODO: should we add protocol?
newUrl = unquotedOrigUrl;
} else if (unquotedOrigUrl.indexOf("/") === 0) {
// path should be relative to the base url
newUrl = baseUrl + unquotedOrigUrl; // already starts with '/'
} else {
// path should be relative to current directory
newUrl = currentDir + unquotedOrigUrl.replace(/^\.\//, ""); // Strip leading './'
}
// send back the fixed url(...)
return "url(" + JSON.stringify(newUrl) + ")";
});
// send back the fixed css
return fixedCss;
};
/***/ }),
/* 6 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";

@@ -236,0 +882,0 @@ /*

5

package.json
{
"name": "my-autocompletec",
"version": "0.0.1",
"version": "0.1.0",
"description": "image autocomplete",

@@ -27,2 +27,5 @@ "main": "./dist/autocomplete.js",

"babel-preset-es2015": "6.18.0",
"css-loader": "^1.0.0",
"sass-loader": "^7.0.3",
"style-loader": "^0.21.0",
"webpack": "3.x"

@@ -29,0 +32,0 @@ },

@@ -0,1 +1,2 @@

import './index.css';
import assign from 'object-assign';

@@ -40,2 +41,3 @@

AutoComplete.prototype._changeAutoCompleteDebounce = debounce(AutoComplete.prototype._changeAutoComplete,opts.debounce);
//阻止光标上下键移动
self.target.addEventListener('keydown',function(e){

@@ -47,2 +49,3 @@ var code = e.which || e.keyCode;

});
//keyup中可以同时获取到keyCode和input的value
self.target.addEventListener('keyup',function(e){

@@ -52,10 +55,12 @@ e.preventDefault();

var inputValue = e.target.value;
self._changeAutoComplete(code,inputValue);
self._handleInput(code,inputValue);
});
}
AutoComplete.prototype._changeAutoComplete = function(code,inputValue){
console.log('complete ' + inputValue);
console.log('code ' + code);
var autoc = this.autoc;
AutoComplete.prototype._handleInput = function(code,inputValue){
//排除 shift,ctrl,alt键
var excludes = [16,17,18];
if(excludes.indexOf(code) > -1){
return;
}
//上键 38

@@ -81,25 +86,33 @@ if(code == 38){

}
//回车
else if(code == 13){
this._highlightAutoComplete(this.pos,true);
}
else{
//todo add debounce
var resultData = this._findData(inputValue,this.opts.dataset);
this.resultData = resultData;
this.originValue = inputValue;
if(resultData && resultData.length){
autoc.style.display = 'block';
var dataHtml = resultData.map(function(item){
return `<li class="auto-item">
<div class="auto-inner">${item.value}</div>
</li>`
}).join('');
autoc.querySelector('.autos').innerHTML = dataHtml;
}
else{
autoc.style.display = 'none';
}
//重置位置
this.pos = -1;
this._changeAutoCompleteDebounce(inputValue);
}
}
AutoComplete.prototype._highlightAutoComplete = function(pos){
AutoComplete.prototype._changeAutoComplete = function(inputValue){
var autoc = this.autoc;
var resultData = this._findData(inputValue,this.opts.dataset);
this.resultData = resultData;
this.originValue = inputValue;
if(resultData && resultData.length){
autoc.style.display = 'block';
var dataHtml = resultData.map(function(item){
return `<li class="auto-item">
<div class="auto-inner">${item.value}</div>
</li>`
}).join('');
autoc.querySelector('.autos').innerHTML = dataHtml;
}
else{
autoc.style.display = 'none';
}
//重置位置
this.pos = -1;
}
AutoComplete.prototype._highlightAutoComplete = function(pos,bEnter){
var items = Array.prototype.slice.call(this.autoc.querySelectorAll('.auto-item'));

@@ -111,3 +124,8 @@ items.forEach(function(item){

var activeItem = items[pos];
addClass(activeItem,'active');
if(bEnter){
this.autoc.style.display = 'none';
}
else{
addClass(activeItem,'active');
}
this.target.value = activeItem.querySelector('.auto-inner').innerHTML;

@@ -114,0 +132,0 @@ }

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc