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

tether-drop

Package Overview
Dependencies
Maintainers
1
Versions
19
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

tether-drop - npm Package Compare versions

Comparing version 1.0.5 to 1.0.6

2

bower.json
{
"name": "tether-drop",
"version": "1.0.5",
"version": "1.0.6",
"homepage": "https://github.com/HubSpot/drop",

@@ -5,0 +5,0 @@ "authors": [

@@ -0,1 +1,7 @@

## v1.0.5
- Remove `bower install` post-install script
## v1.0.3
- Remove Compass and Ruby dependencies
## v1.0.0

@@ -2,0 +8,0 @@ - Add proper UMD to `Drop`

@@ -19,3 +19,3 @@ # Contributing Guide

5. Assuming everything went well, you should now have a `dist` directory that
matches the one you moved in step 4.
matches the one you moved in step 4

@@ -26,3 +26,3 @@

We use `gulp` to facilitate things like transpilation, minification, etc. so
can focus on writing relevant code. If there is a fix or feature you would like
can you focus on writing relevant code. If there is a fix or feature you would like
to contribute, we ask that you take the following steps:

@@ -29,0 +29,0 @@

@@ -13,12 +13,12 @@ /*! tether-drop 1.0.5 */

/* global Tether */
'use strict';
var _bind = Function.prototype.bind;
var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
var _get = function get(_x2, _x3, _x4) { var _again = true; _function: while (_again) { desc = parent = getter = undefined; _again = false; var object = _x2,
property = _x3,
receiver = _x4; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x2 = parent; _x3 = property; _x4 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
var _get = function get(_x2, _x3, _x4) { var _again = true; _function: while (_again) { var object = _x2, property = _x3, receiver = _x4; desc = parent = getter = undefined; _again = false; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x2 = parent; _x3 = property; _x4 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
var _bind = Function.prototype.bind;
function _slicedToArray(arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i['return']) _i['return'](); } finally { if (_d) throw _e; } } return _arr; } else { throw new TypeError('Invalid attempt to destructure non-iterable instance'); } }

@@ -30,4 +30,2 @@

/* global Tether */
var _Tether$Utils = Tether.Utils;

@@ -49,6 +47,5 @@ var extend = _Tether$Utils.extend;

if (['left', 'right'].indexOf(first) >= 0) {
var _temp = [second, first];
first = _temp[0];
second = _temp[1];
_temp;
var _ref = [second, first];
first = _ref[0];
second = _ref[1];
}

@@ -197,3 +194,3 @@ return [first, second].join(' ');

value: function setupElements() {
var _this2 = this;
var _this = this;

@@ -213,9 +210,9 @@ this.drop = document.createElement('div');

// content function might return a string or an element
var contentElementOrHTML = _this2.options.content.call(_this2, _this2);
var contentElementOrHTML = _this.options.content.call(_this, _this);
if (typeof contentElementOrHTML === 'string') {
_this2.content.innerHTML = contentElementOrHTML;
_this.content.innerHTML = contentElementOrHTML;
} else if (typeof contentElementOrHTML === 'object') {
_this2.content.innerHTML = '';
_this2.content.appendChild(contentElementOrHTML);
_this.content.innerHTML = '';
_this.content.appendChild(contentElementOrHTML);
} else {

@@ -293,3 +290,3 @@ throw new Error('Drop Error: Content function should return a string or HTMLElement.');

value: function setupEvents() {
var _this3 = this;
var _this2 = this;

@@ -309,3 +306,3 @@ if (!this.options.openOn) {

var openHandler = function openHandler(event) {
_this3.toggle();
_this2.toggle();
event.preventDefault();

@@ -315,3 +312,3 @@ };

var closeHandler = function closeHandler(event) {
if (!_this3.isOpened()) {
if (!_this2.isOpened()) {
return;

@@ -321,3 +318,3 @@ }

// Clicking inside dropdown
if (event.target === _this3.drop || _this3.drop.contains(event.target)) {
if (event.target === _this2.drop || _this2.drop.contains(event.target)) {
return;

@@ -327,7 +324,7 @@ }

// Clicking target
if (event.target === _this3.target || _this3.target.contains(event.target)) {
if (event.target === _this2.target || _this2.target.contains(event.target)) {
return;
}
_this3.close();
_this2.close();
};

@@ -348,3 +345,3 @@

onUs = true;
_this3.open();
_this2.open();
};

@@ -362,3 +359,3 @@

if (!onUs) {
_this3.close();
_this2.close();
}

@@ -369,6 +366,6 @@ outTimeout = null;

_this3._on(_this3.target, 'mouseover', over);
_this3._on(_this3.drop, 'mouseover', over);
_this3._on(_this3.target, 'mouseout', out);
_this3._on(_this3.drop, 'mouseout', out);
_this2._on(_this2.target, 'mouseover', over);
_this2._on(_this2.drop, 'mouseover', over);
_this2._on(_this2.target, 'mouseout', out);
_this2._on(_this2.drop, 'mouseout', out);
})();

@@ -396,3 +393,3 @@ }

value: function open() {
var _this4 = this;
var _this3 = this;

@@ -415,3 +412,5 @@ if (this.isOpened()) {

setTimeout(function () {
addClass(_this4.drop, '' + drop.classPrefix + '-after-open');
if (_this3.drop) {
addClass(_this3.drop, '' + drop.classPrefix + '-after-open');
}
});

@@ -430,3 +429,3 @@

value: function close() {
var _this5 = this;
var _this4 = this;

@@ -441,6 +440,6 @@ if (!this.isOpened()) {

var handler = function handler() {
if (!hasClass(_this5.drop, '' + drop.classPrefix + '-open')) {
removeClass(_this5.drop, '' + drop.classPrefix + '-open-transitionend');
if (!hasClass(_this4.drop, '' + drop.classPrefix + '-open')) {
removeClass(_this4.drop, '' + drop.classPrefix + '-open-transitionend');
}
_this5.drop.removeEventListener(transitionEndEvent, handler);
_this4.drop.removeEventListener(transitionEndEvent, handler);
};

@@ -447,0 +446,0 @@

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

!function(t,e){"function"==typeof define&&define.amd?define(["tether"],e):"object"==typeof exports?module.exports=e(require("tether")):t.Drop=e(t.Tether)}(this,function(t){"use strict";function e(t,e){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t)){var n=[],o=!0,i=!1,r=void 0;try{for(var s,a=t[Symbol.iterator]();!(o=(s=a.next()).done)&&(n.push(s.value),!e||n.length!==e);o=!0);}catch(p){i=!0,r=p}finally{try{!o&&a["return"]&&a["return"]()}finally{if(i)throw r}}return n}throw new TypeError("Invalid attempt to destructure non-iterable instance")}function n(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function o(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(t.__proto__=e)}function i(t){var n=t.split(" "),o=e(n,2),i=o[0],r=o[1];if(["left","right"].indexOf(i)>=0){var s=[r,i];i=s[0],r=s[1]}return[i,r].join(" ")}function r(t,e){for(var n=void 0,o=[];-1!==(n=t.indexOf(e));)o.push(t.splice(n,1));return o}function s(){var e=void 0===arguments[0]?{}:arguments[0],l=function(){for(var t=arguments.length,e=Array(t),n=0;t>n;n++)e[n]=arguments[n];return new(a.apply(b,[null].concat(e)))};d(l,{createContext:s,drops:[],defaults:{}});var m={classPrefix:"drop",defaults:{position:"bottom left",openOn:"click",constrainToScrollParent:!0,constrainToWindow:!0,classes:"",remove:!1,tetherOptions:{}}};d(l,m,e),d(l.defaults,m.defaults,e.defaults),"undefined"==typeof P[l.classPrefix]&&(P[l.classPrefix]=[]),l.updateBodyClasses=function(){for(var t=!1,e=P[l.classPrefix],n=e.length,o=0;n>o;++o)if(e[o].isOpened()){t=!0;break}t?h(document.body,""+l.classPrefix+"-open"):c(document.body,""+l.classPrefix+"-open")};var b=function(e){function s(t){if(n(this,s),u(Object.getPrototypeOf(s.prototype),"constructor",this).call(this),this.options=d({},l.defaults,t),this.target=this.options.target,"undefined"==typeof this.target)throw new Error("Drop Error: You must provide a target.");this.options.classes&&this.options.addTargetClasses!==!1&&h(this.target,this.options.classes),l.drops.push(this),P[l.classPrefix].push(this),this._boundEvents=[],this.setupElements(),this.setupEvents(),this.setupTether()}return o(s,e),p(s,[{key:"_on",value:function(t,e,n){this._boundEvents.push({element:t,event:e,handler:n}),t.addEventListener(e,n)}},{key:"setupElements",value:function(){var t=this;if(this.drop=document.createElement("div"),h(this.drop,l.classPrefix),this.options.classes&&h(this.drop,this.options.classes),this.content=document.createElement("div"),h(this.content,""+l.classPrefix+"-content"),"function"==typeof this.options.content){var e=function(){var e=t.options.content.call(t,t);if("string"==typeof e)t.content.innerHTML=e;else{if("object"!=typeof e)throw new Error("Drop Error: Content function should return a string or HTMLElement.");t.content.innerHTML="",t.content.appendChild(e)}};e(),this.on("open",e.bind(this))}else"object"==typeof this.options.content?this.content.appendChild(this.options.content):this.content.innerHTML=this.options.content;this.drop.appendChild(this.content)}},{key:"setupTether",value:function(){var e=this.options.position.split(" ");e[0]=x[e[0]],e=e.join(" ");var n=[];n.push(this.options.constrainToScrollParent?{to:"scrollParent",pin:"top, bottom",attachment:"together none"}:{to:"scrollParent"}),n.push(this.options.constrainToWindow!==!1?{to:"window",attachment:"together"}:{to:"window"});var o={element:this.drop,target:this.target,attachment:i(e),targetAttachment:i(this.options.position),classPrefix:l.classPrefix,offset:"0 0",targetOffset:"0 0",enabled:!1,constraints:n,addTargetClasses:this.options.addTargetClasses};this.options.tetherOptions!==!1&&(this.tether=new t(d({},o,this.options.tetherOptions)))}},{key:"setupEvents",value:function(){var t=this;if(this.options.openOn){if("always"===this.options.openOn)return void setTimeout(this.open.bind(this));var e=this.options.openOn.split(" ");if(e.indexOf("click")>=0)for(var n=function(e){t.toggle(),e.preventDefault()},o=function(e){t.isOpened()&&(e.target===t.drop||t.drop.contains(e.target)||e.target===t.target||t.target.contains(e.target)||t.close())},i=0;i<y.length;++i){var r=y[i];this._on(this.target,r,n),this._on(document,r,o)}e.indexOf("hover")>=0&&!function(){var e=!1,n=function(){e=!0,t.open()},o=null,i=function(){e=!1,"undefined"!=typeof o&&clearTimeout(o),o=setTimeout(function(){e||t.close(),o=null},50)};t._on(t.target,"mouseover",n),t._on(t.drop,"mouseover",n),t._on(t.target,"mouseout",i),t._on(t.drop,"mouseout",i)}()}}},{key:"isOpened",value:function(){return this.drop?f(this.drop,""+l.classPrefix+"-open"):void 0}},{key:"toggle",value:function(){this.isOpened()?this.close():this.open()}},{key:"open",value:function(){var t=this;this.isOpened()||(this.drop.parentNode||document.body.appendChild(this.drop),"undefined"!=typeof this.tether&&this.tether.enable(),h(this.drop,""+l.classPrefix+"-open"),h(this.drop,""+l.classPrefix+"-open-transitionend"),setTimeout(function(){h(t.drop,""+l.classPrefix+"-after-open")}),"undefined"!=typeof this.tether&&this.tether.position(),this.trigger("open"),l.updateBodyClasses())}},{key:"close",value:function(){var t=this;if(this.isOpened()){c(this.drop,""+l.classPrefix+"-open"),c(this.drop,""+l.classPrefix+"-after-open");var e=function n(){f(t.drop,""+l.classPrefix+"-open")||c(t.drop,""+l.classPrefix+"-open-transitionend"),t.drop.removeEventListener(g,n)};this.drop.addEventListener(g,e),this.trigger("close"),"undefined"!=typeof this.tether&&this.tether.disable(),l.updateBodyClasses(),this.options.remove&&this.remove()}}},{key:"remove",value:function(){this.close(),this.drop.parentNode&&this.drop.parentNode.removeChild(this.drop)}},{key:"position",value:function(){this.isOpened()&&"undefined"!=typeof this.tether&&this.tether.position()}},{key:"destroy",value:function(){this.remove(),"undefined"!=typeof this.tether&&this.tether.destroy();for(var t=0;t<this._boundEvents.length;++t){var e=this._boundEvents[t],n=e.element,o=e.event,i=e.handler;n.removeEventListener(o,i)}this._boundEvents=[],this.tether=null,this.drop=null,this.content=null,this.target=null,r(P[l.classPrefix],this),r(l.drops,this)}}]),s}(v);return l}var a=Function.prototype.bind,p=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),u=function(t,e,n){for(var o=!0;o;){a=u=p=void 0,o=!1;var i=t,r=e,s=n,a=Object.getOwnPropertyDescriptor(i,r);if(void 0!==a){if("value"in a)return a.value;var p=a.get;return void 0===p?void 0:p.call(s)}var u=Object.getPrototypeOf(i);if(null===u)return void 0;t=u,e=r,n=s,o=!0}},l=t.Utils,d=l.extend,h=l.addClass,c=l.removeClass,f=l.hasClass,v=l.Evented,y=["click"];"ontouchstart"in document.documentElement&&y.push("touchstart");var m={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"otransitionend",transition:"transitionend"},g="";for(var b in m)if({}.hasOwnProperty.call(m,b)){var O=document.createElement("p");"undefined"!==O.style[b]&&(g=m[b])}var x={left:"right",right:"left",top:"bottom",bottom:"top",middle:"middle",center:"center"},P={},E=s();return document.addEventListener("DOMContentLoaded",function(){E.updateBodyClasses()}),E});
!function(t,e){"function"==typeof define&&define.amd?define(["tether"],e):"object"==typeof exports?module.exports=e(require("tether")):t.Drop=e(t.Tether)}(this,function(t){"use strict";function e(t,e){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t)){var n=[],o=!0,i=!1,r=void 0;try{for(var s,a=t[Symbol.iterator]();!(o=(s=a.next()).done)&&(n.push(s.value),!e||n.length!==e);o=!0);}catch(p){i=!0,r=p}finally{try{!o&&a["return"]&&a["return"]()}finally{if(i)throw r}}return n}throw new TypeError("Invalid attempt to destructure non-iterable instance")}function n(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function o(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(t.__proto__=e)}function i(t){var n=t.split(" "),o=e(n,2),i=o[0],r=o[1];if(["left","right"].indexOf(i)>=0){var s=[r,i];i=s[0],r=s[1]}return[i,r].join(" ")}function r(t,e){for(var n=void 0,o=[];-1!==(n=t.indexOf(e));)o.push(t.splice(n,1));return o}function s(){var e=void 0===arguments[0]?{}:arguments[0],d=function(){for(var t=arguments.length,e=Array(t),n=0;t>n;n++)e[n]=arguments[n];return new(u.apply(b,[null].concat(e)))};l(d,{createContext:s,drops:[],defaults:{}});var m={classPrefix:"drop",defaults:{position:"bottom left",openOn:"click",constrainToScrollParent:!0,constrainToWindow:!0,classes:"",remove:!1,tetherOptions:{}}};l(d,m,e),l(d.defaults,m.defaults,e.defaults),"undefined"==typeof P[d.classPrefix]&&(P[d.classPrefix]=[]),d.updateBodyClasses=function(){for(var t=!1,e=P[d.classPrefix],n=e.length,o=0;n>o;++o)if(e[o].isOpened()){t=!0;break}t?h(document.body,""+d.classPrefix+"-open"):c(document.body,""+d.classPrefix+"-open")};var b=function(e){function s(t){if(n(this,s),p(Object.getPrototypeOf(s.prototype),"constructor",this).call(this),this.options=l({},d.defaults,t),this.target=this.options.target,"undefined"==typeof this.target)throw new Error("Drop Error: You must provide a target.");this.options.classes&&this.options.addTargetClasses!==!1&&h(this.target,this.options.classes),d.drops.push(this),P[d.classPrefix].push(this),this._boundEvents=[],this.setupElements(),this.setupEvents(),this.setupTether()}return o(s,e),a(s,[{key:"_on",value:function(t,e,n){this._boundEvents.push({element:t,event:e,handler:n}),t.addEventListener(e,n)}},{key:"setupElements",value:function(){var t=this;if(this.drop=document.createElement("div"),h(this.drop,d.classPrefix),this.options.classes&&h(this.drop,this.options.classes),this.content=document.createElement("div"),h(this.content,""+d.classPrefix+"-content"),"function"==typeof this.options.content){var e=function(){var e=t.options.content.call(t,t);if("string"==typeof e)t.content.innerHTML=e;else{if("object"!=typeof e)throw new Error("Drop Error: Content function should return a string or HTMLElement.");t.content.innerHTML="",t.content.appendChild(e)}};e(),this.on("open",e.bind(this))}else"object"==typeof this.options.content?this.content.appendChild(this.options.content):this.content.innerHTML=this.options.content;this.drop.appendChild(this.content)}},{key:"setupTether",value:function(){var e=this.options.position.split(" ");e[0]=x[e[0]],e=e.join(" ");var n=[];n.push(this.options.constrainToScrollParent?{to:"scrollParent",pin:"top, bottom",attachment:"together none"}:{to:"scrollParent"}),n.push(this.options.constrainToWindow!==!1?{to:"window",attachment:"together"}:{to:"window"});var o={element:this.drop,target:this.target,attachment:i(e),targetAttachment:i(this.options.position),classPrefix:d.classPrefix,offset:"0 0",targetOffset:"0 0",enabled:!1,constraints:n,addTargetClasses:this.options.addTargetClasses};this.options.tetherOptions!==!1&&(this.tether=new t(l({},o,this.options.tetherOptions)))}},{key:"setupEvents",value:function(){var t=this;if(this.options.openOn){if("always"===this.options.openOn)return void setTimeout(this.open.bind(this));var e=this.options.openOn.split(" ");if(e.indexOf("click")>=0)for(var n=function(e){t.toggle(),e.preventDefault()},o=function(e){t.isOpened()&&(e.target===t.drop||t.drop.contains(e.target)||e.target===t.target||t.target.contains(e.target)||t.close())},i=0;i<y.length;++i){var r=y[i];this._on(this.target,r,n),this._on(document,r,o)}e.indexOf("hover")>=0&&!function(){var e=!1,n=function(){e=!0,t.open()},o=null,i=function(){e=!1,"undefined"!=typeof o&&clearTimeout(o),o=setTimeout(function(){e||t.close(),o=null},50)};t._on(t.target,"mouseover",n),t._on(t.drop,"mouseover",n),t._on(t.target,"mouseout",i),t._on(t.drop,"mouseout",i)}()}}},{key:"isOpened",value:function(){return this.drop?f(this.drop,""+d.classPrefix+"-open"):void 0}},{key:"toggle",value:function(){this.isOpened()?this.close():this.open()}},{key:"open",value:function(){var t=this;this.isOpened()||(this.drop.parentNode||document.body.appendChild(this.drop),"undefined"!=typeof this.tether&&this.tether.enable(),h(this.drop,""+d.classPrefix+"-open"),h(this.drop,""+d.classPrefix+"-open-transitionend"),setTimeout(function(){t.drop&&h(t.drop,""+d.classPrefix+"-after-open")}),"undefined"!=typeof this.tether&&this.tether.position(),this.trigger("open"),d.updateBodyClasses())}},{key:"close",value:function(){var t=this;if(this.isOpened()){c(this.drop,""+d.classPrefix+"-open"),c(this.drop,""+d.classPrefix+"-after-open");var e=function n(){f(t.drop,""+d.classPrefix+"-open")||c(t.drop,""+d.classPrefix+"-open-transitionend"),t.drop.removeEventListener(g,n)};this.drop.addEventListener(g,e),this.trigger("close"),"undefined"!=typeof this.tether&&this.tether.disable(),d.updateBodyClasses(),this.options.remove&&this.remove()}}},{key:"remove",value:function(){this.close(),this.drop.parentNode&&this.drop.parentNode.removeChild(this.drop)}},{key:"position",value:function(){this.isOpened()&&"undefined"!=typeof this.tether&&this.tether.position()}},{key:"destroy",value:function(){this.remove(),"undefined"!=typeof this.tether&&this.tether.destroy();for(var t=0;t<this._boundEvents.length;++t){var e=this._boundEvents[t],n=e.element,o=e.event,i=e.handler;n.removeEventListener(o,i)}this._boundEvents=[],this.tether=null,this.drop=null,this.content=null,this.target=null,r(P[d.classPrefix],this),r(d.drops,this)}}]),s}(v);return d}var a=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),p=function(t,e,n){for(var o=!0;o;){var i=t,r=e,s=n;a=u=p=void 0,o=!1;var a=Object.getOwnPropertyDescriptor(i,r);if(void 0!==a){if("value"in a)return a.value;var p=a.get;return void 0===p?void 0:p.call(s)}var u=Object.getPrototypeOf(i);if(null===u)return void 0;t=u,e=r,n=s,o=!0}},u=Function.prototype.bind,d=t.Utils,l=d.extend,h=d.addClass,c=d.removeClass,f=d.hasClass,v=d.Evented,y=["click"];"ontouchstart"in document.documentElement&&y.push("touchstart");var m={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"otransitionend",transition:"transitionend"},g="";for(var b in m)if({}.hasOwnProperty.call(m,b)){var O=document.createElement("p");"undefined"!==O.style[b]&&(g=m[b])}var x={left:"right",right:"left",top:"bottom",bottom:"top",middle:"middle",center:"center"},P={},E=s();return document.addEventListener("DOMContentLoaded",function(){E.updateBodyClasses()}),E});

@@ -24,5 +24,5 @@ <link rel="stylesheet" href="/drop/css/drop-theme-basic.css" />

Drop is a Javascript and CSS library for creating dropdowns and other popups attached to elements on the page. Drop uses [Tether.js](http://github.hubspot.com/tether) to efficiently position its elements.
Drop is a JavaScript and CSS library for creating dropdowns and other popups attached to elements on the page. Drop uses [Tether.js](http://github.hubspot.com/tether) to efficiently position its elements.
Thank you for considering Drop, we believe it's the best way of creating dropdown-style elements available right now.
Thank you for considering Drop. We believe it's the best way of creating dropdown-style elements available right now.

@@ -38,7 +38,7 @@ ### Features

- Drops can be configured to open when the user clicks or hovers.
- A development team at [HubSpot](http://github.hubspot.com) who care about making it do everything you need.
- Drop is maintained by developers at [HubSpot](http://github.hubspot.com) who care about making it do everything you need.
### Dependencies
None!
Tether

@@ -87,7 +87,7 @@ ### Browser Support

Reposition the drop. Call if you change the content of the drop or the position of the element its attached to.
Reposition the drop. Call if you change the content of the drop or the position of the element it's attached to.
#### `destroy()`
Remove the drop along with all of it's event bindings. Calling any method after `destroy` is undefined.
Remove the drop along with all of its event bindings. Calling any method after `destroy` is undefined.

@@ -100,8 +100,8 @@ ### Options

The element (or a selector for an element) the Drop should stay adjacent to on the page. An action on this element like
a click or hover can be set to open the drop.
The element (or a selector for an element) the Drop should stay adjacent to on the page. An action on this element, such as
a click or hover, can be set to open the drop.
#### `content`
The content which should be rendered into the Drop. Can be:
The content that should be rendered into the Drop. Can be:

@@ -135,3 +135,3 @@ - A DOM element

Specifies what event on the target opens the drop. If you set this to `undefined` or `null` you will need to manually call `.open()`/`.close()` on the `drop` instance.
Specifies what event on the target opens the drop. If you set this to `undefined` or `null` you will need to manually call `.open()` and `.close()` on the `drop` instance.
`'always'` will open the drop immediately when it's rendered and leave it open.

@@ -156,3 +156,3 @@

Similar to `constrainToWindow` but for the target element's first scroll parent, that is the first parent which has `overflow: auto` or `overflow: scroll` set, or the body, whichever comes first.
Similar to `constrainToWindow` but for the target element's first scroll parent: the first parent that has `overflow: auto` or `overflow: scroll` set, or the body, whichever comes first.

@@ -165,3 +165,3 @@ #### `classes`

Set to `true` if you'd like the drop element to be removed from the DOM when the drop is closed, and recreated when it's opened.
Set to `true` if you'd like the drop element to be removed from the DOM when the drop is closed and recreated when it's opened.

@@ -175,3 +175,3 @@ ```coffeescript

Additional options can be passed to customize Drop even further. These will get passed to the underlying Tether instance used to position the drop. See the the [Tether documentation](http://tether.io) for more information. Set to `false` to disable tether.
Additional options can be passed to customize Drop even further. These will get passed to the underlying Tether instance used to position the drop. See the the [Tether documentation](http://tether.io) for more information. Set to `false` to disable Tether.

@@ -212,3 +212,2 @@ #### Defaults

Drop adds a class to the body whenever a drop is open. It defaults to `drop-open`, see
the Embedding doc for more details.
Drop adds a class to the body whenever a drop is open. It defaults to `drop-open`. See the [Embedding documentation](http://github.hubspot.com/drop/overview/embedding_drop/) for more details.
## Embedding Drop in Other Libraries
Drop is designed to be embeddable in other javascript libraries. For example, our
Drop is designed to be embeddable in other JavaScript libraries. For example, our
[tooltip library](/tooltip) includes an embedded copy of Drop.

@@ -8,6 +8,6 @@

You probably want to change the classes to use your libraries name to prefix it's classes,
rather than `'drop-`'. Drop also adds a class to the body whenever any drop is opened,
by changing the prefix you are ensuring that your libraries classes don't conflict with
another usage of drop on the page.
You probably want to change the classes to use your library's name to prefix its classes,
rather than using `'drop-`'. Drop also adds a class to the body whenever any drop is opened;
by changing the prefix you are ensuring that your library's classes don't conflict with
another usage of Drop on the page.

@@ -14,0 +14,0 @@ To do this, call the `Drop.createContext` method. It will return you a context-aware

## Drop vs Tether
Drop is a library built on the Tether positioning engine. Tether is intentionally
designed to only handle positioning. You give it an element and a target,
and it keeps the element where you want it relative to the target.
Drop is a library built on the [Tether](http://github.hubspot.com/tether) positioning engine.
Tether is intentionally designed to only handle positioning. You give it an element and a
target, and it keeps the element where you want it relative to the target.
Quickly it became clear that while that simplicity allowed Tether to be more powerful,
many of it's use cases required a few more concepts. Specifically, Drop adds the following
many of its use cases required a few more concepts. Specifically, Drop adds the following
on top of Tether:

@@ -13,3 +13,3 @@

to the opening and closing.
- Drop creates the actual element for you, and adds a 'drop-content' element inside of it
- Element creation handled for you by Drop. Drop adds a 'drop-content' element inside of it
to make styling easier.

@@ -22,3 +22,3 @@ - A simpler attachment syntax that assumes you always want to place the drop in one

It's very possible that a sufficiently complex application will eventually outgrow
Drop and decide to move to using Tether directly. You can always pass `tetherOptions`
to your Drop instance if you need to more explicit control of Tether's behavior.
Drop and move to using Tether directly. You can always pass `tetherOptions`
to your Drop instance if you need more explicit control of Tether's behavior.

@@ -20,10 +20,10 @@ ## Stying Drops

To facilitate animation, Drop stratigically adds and removes three classes
when a Drop is opened.
when a drop is opened:
- `drop-open` is added when the drop is opened and removed when it should be hidden,
use `drop-open` if you don't need animation.
- `drop-after-open` is added in the next event loop tick after the drop is opened,
start your CSS transitions when `drop-after-open` appears.
- `drop-open` is added when the drop is opened and removed when it should be hidden.
Use `drop-open` if you don't need animation.
- `drop-after-open` is added in the next event loop tick after the drop is opened.
Start your CSS transitions when `drop-after-open` appears.
- `drop-open-transitionend` is added immediately, but not removed until the `transitionend`
event fires on the drop. Use `drop-open-transitionend` to control the showing and hiding
event fires on the drop. Use `drop-open-transitionend` to control the showing and hiding
of your element when using an animation.

@@ -58,6 +58,6 @@

Drop ships with two animated themes and one nonanimated one. They are available in the
Drop ships with two animated themes and one non-animated one. They are available in the
sass and css directories of the project.
If you look at the sass, you'll notice that we make use of mixins which allow you to configure
If you look at the Sass, you'll notice that we make use of mixins which allow you to configure
many elements of the theme to make it suit your application.

@@ -38,3 +38,3 @@ var del = require('del');

// Javascript
gulp.task('js', ['clean'], function() {
gulp.task('js', function() {
gulp.src('./src/js/drop.js')

@@ -41,0 +41,0 @@ .pipe(babel())

{
"name": "tether-drop",
"version": "1.0.5",
"version": "1.0.6",
"description": "Client-side library for creating dropdowns",

@@ -5,0 +5,0 @@ "authors": [

@@ -340,3 +340,5 @@ /* global Tether */

setTimeout(() => {
addClass(this.drop, `${ drop.classPrefix }-after-open`);
if (this.drop) {
addClass(this.drop, `${ drop.classPrefix }-after-open`);
}
})

@@ -343,0 +345,0 @@

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

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