New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@tradeshift/elements.modal

Package Overview
Dependencies
Maintainers
8
Versions
73
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@tradeshift/elements.modal - npm Package Compare versions

Comparing version 0.27.6 to 0.28.0

4

CHANGELOG.md

@@ -5,2 +5,6 @@ # Change Log

# [0.28.0](https://github.com/Tradeshift/elements/compare/v0.27.6...v0.28.0) (2021-09-10)
**Note:** Version bump only for package @tradeshift/elements.modal
## [0.27.6](https://github.com/Tradeshift/elements/compare/v0.27.5...v0.27.6) (2021-08-10)

@@ -7,0 +11,0 @@

2

lib/modal.esm.js

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

import{customElementDefineHelper as t,html as e,TSElement as i,CloseOnEscBehavior as n,unsafeCSS as o}from"@tradeshift/elements";import"@tradeshift/elements.button";import"@tradeshift/elements.cover";import"@tradeshift/elements.header";function a(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}function r(t,e){return(r=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}function s(t,e){return e||(e=t.slice(0)),t.raw=e,t}var l,d,c={CLOSE:"close",CLOSED:"closed",OPEN:"open",OPENED:"opened"},h={MEDIUM:"medium",LARGE:"large"},p=function(t){var c,p;function u(){var e=t.call(this)||this;return e.size=h.LARGE,e.title="",e.noCloseOnEscKey=!1,e.closeBehavior=new n(function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(e)),e.hideHeader=!1,e.noPadding=!1,e}p=t,(c=u).prototype=Object.create(p.prototype),c.prototype.constructor=c,r(c,p);var f,v,m,b=u.prototype;return b.open=function(){this.visible=!0},b.close=function(){this.visible=!1,this.dispatchCustomEvent("close")},b.handleTransition=function(t){"opacity"===t.propertyName&&(this.visible?this.dispatchCustomEvent("opened"):this.dispatchCustomEvent("closed"))},b.attributeChangedCallback=function(e,i,n){t.prototype.attributeChangedCallback.call(this,e,i,n),"data-visible"===e&&n&&this.dispatchCustomEvent("open")},b.render=function(){return e(l||(l=s(['\n\t\t\t<div\n\t\t\t\tdir="','"\n\t\t\t\tclass="container '," ",'"\n\t\t\t\t@transitionend="','"\n\t\t\t>\n\t\t\t\t','\n\t\t\t\t<div class="note">\n\t\t\t\t\t\x3c!-- Use this slot name on the `ts-note` in the modal\t--\x3e\n\t\t\t\t\t<slot name="note"></slot>\n\t\t\t\t</div>\n\t\t\t\t<main>\n\t\t\t\t\t\x3c!-- Content in the main section of the modal\t--\x3e\n\t\t\t\t\t<slot name="main"></slot>\n\t\t\t\t</main>\n\t\t\t\t<footer>\n\t\t\t\t\t\x3c!-- Content in the footer section of the modal, most of the time `ts-button-group`\t--\x3e\n\t\t\t\t\t<slot name="footer"></slot>\n\t\t\t\t</footer>\n\t\t\t</div>\n\t\t\t<ts-cover class="ts-modal-cover" ?data-visible=',' @click="','"></ts-cover>\n\t\t'],['\n\t\t\t<div\n\t\t\t\tdir="','"\n\t\t\t\tclass="container '," ",'"\n\t\t\t\t@transitionend="','"\n\t\t\t>\n\t\t\t\t','\n\t\t\t\t<div class="note">\n\t\t\t\t\t\x3c!-- Use this slot name on the \\`ts-note\\` in the modal\t--\x3e\n\t\t\t\t\t<slot name="note"></slot>\n\t\t\t\t</div>\n\t\t\t\t<main>\n\t\t\t\t\t\x3c!-- Content in the main section of the modal\t--\x3e\n\t\t\t\t\t<slot name="main"></slot>\n\t\t\t\t</main>\n\t\t\t\t<footer>\n\t\t\t\t\t\x3c!-- Content in the footer section of the modal, most of the time \\`ts-button-group\\`\t--\x3e\n\t\t\t\t\t<slot name="footer"></slot>\n\t\t\t\t</footer>\n\t\t\t</div>\n\t\t\t<ts-cover class="ts-modal-cover" ?data-visible=',' @click="','"></ts-cover>\n\t\t'])),this.direction,this.size,this.hidden,this.handleTransition,this.header,this.visible,this.close)},b.firstUpdated=function(){this.closeBehavior.start()},b.disconnectedCallback=function(){this.closeBehavior.stop(),t.prototype.disconnectedCallback.call(this)},f=u,m=[{key:"styles",get:function(){return[i.styles,o(".container{background-color:#fff;background-color:var(--ts-color-white);box-shadow:inset 0 0 0 1px #cbd7dc;box-shadow:var(--ts-boxshadow-border-default);top:20px;top:var(--ts-unit);bottom:20px;bottom:var(--ts-unit);right:20px;right:var(--ts-unit);left:20px;left:var(--ts-unit);display:flex;flex-direction:column;position:absolute;z-index:1500;z-index:var(--ts-zindex-modal)}ts-header{flex-grow:0;flex-shrink:0;padding:0 0 0 5px;padding:0 0 0 var(--ts-unit-quarter)}ts-header[dir=rtl]{padding:0 5px 0 0;padding:0 var(--ts-unit-quarter) 0 0}.note ::slotted(ts-note){flex-grow:0;padding-left:20px;padding-left:var(--ts-unit);padding-right:20px;padding-right:var(--ts-unit)}.close{height:40px;height:var(--ts-unit-double);width:40px;width:var(--ts-unit-double)}main{flex-grow:1;overflow:auto;padding:20px;padding:var(--ts-unit)}:host([no-padding]) main{padding:0}footer{flex-grow:0}.container.medium{top:12.5%;bottom:12.5%;right:25%;left:25%}.container.small{width:380px;width:var(--ts-modal-width-small);top:50%;bottom:auto;right:auto;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.fade-in{opacity:1;visibility:visible;transition:visibility .1s linear .1s,opacity .2s;transition:visibility var(--ts-transition-now) linear var(--ts-transition-now),opacity var(--ts-transition-fast)}.fade-out{opacity:0;visibility:hidden;transition:visibility .2s linear .1s,opacity .2s;transition:visibility var(--ts-transition-fast) linear var(--ts-transition-now),opacity var(--ts-transition-fast)}@media (max-width:600px){.container,.container.medium,.container.small{top:10px;top:var(--ts-unit-half);bottom:10px;bottom:var(--ts-unit-half);right:10px;right:var(--ts-unit-half);left:10px;left:var(--ts-unit-half);-webkit-transform:translate(0);transform:translate(0);width:auto}.container main{padding:10px;padding:var(--ts-unit-half)}}")]}},{key:"properties",get:function(){return{dir:{type:String,reflect:!0,attribute:"data-dir"},size:{type:String,reflect:!0,attribute:"data-size"},title:{type:String,reflect:!0,attribute:"data-title"},visible:{type:Boolean,reflect:!0,attribute:"data-visible"},noCloseOnEscKey:{type:Boolean,attribute:"no-close-on-esc-key"},hideHeader:{type:Boolean,attribute:"hide-header"},noPadding:{type:Boolean,attribute:"no-padding"}}}}],(v=[{key:"direction",get:function(){return this.dir?this.dir:this.bodyDir}},{key:"hidden",get:function(){return this.visible?"fade-in":"fade-out"}},{key:"header",get:function(){return this.hideHeader?"":e(d||(d=s(['\n\t\t\t<ts-header .title="','" dir="','">\n\t\t\t\t<ts-button class="no-border" icon="close-clear" size="large" @click="','"></ts-button>\n\t\t\t</ts-header>\n\t\t'])),this.title,this.direction,this.close)}}])&&a(f.prototype,v),m&&a(f,m),u}(i);t("ts-modal",p);export{p as TSModal,c as customEventNames,h as sizes};
import{customElementDefineHelper as t,html as e,TSElement as i,CloseOnEscBehavior as n,unsafeCSS as o}from"@tradeshift/elements";import"@tradeshift/elements.button";import"@tradeshift/elements.cover";import"@tradeshift/elements.header";function a(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}function r(t,e){return(r=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}function s(t,e){return e||(e=t.slice(0)),t.raw=e,t}var l,d,c={CLOSE:"close",CLOSED:"closed",OPEN:"open",OPENED:"opened"},h={MEDIUM:"medium",LARGE:"large"},p=function(t){var c,p;function u(){var e=t.call(this)||this;return e.size=h.LARGE,e.title="",e.noCloseOnEscKey=!1,e.closeBehavior=new n(function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(e)),e.hideHeader=!1,e.noPadding=!1,e}p=t,(c=u).prototype=Object.create(p.prototype),c.prototype.constructor=c,r(c,p);var f,v,m,b=u.prototype;return b.open=function(){this.visible=!0},b.close=function(){this.visible=!1,this.dispatchCustomEvent("close")},b.handleTransition=function(t){"opacity"===t.propertyName&&(this.visible?this.dispatchCustomEvent("opened"):this.dispatchCustomEvent("closed"))},b.attributeChangedCallback=function(e,i,n){t.prototype.attributeChangedCallback.call(this,e,i,n),"data-visible"===e&&n&&this.dispatchCustomEvent("open")},b.render=function(){return e(l||(l=s(['\n\t\t\t<div\n\t\t\t\tdir="','"\n\t\t\t\tclass="container '," ",'"\n\t\t\t\t@transitionend="','"\n\t\t\t>\n\t\t\t\t','\n\t\t\t\t<div class="note">\n\t\t\t\t\t\x3c!-- Use this slot name on the `ts-note` in the modal\t--\x3e\n\t\t\t\t\t<slot name="note"></slot>\n\t\t\t\t</div>\n\t\t\t\t<main>\n\t\t\t\t\t\x3c!-- Content in the main section of the modal\t--\x3e\n\t\t\t\t\t<slot name="main"></slot>\n\t\t\t\t</main>\n\t\t\t\t<footer>\n\t\t\t\t\t\x3c!-- Content in the footer section of the modal, most of the time `ts-button-group`\t--\x3e\n\t\t\t\t\t<slot name="footer"></slot>\n\t\t\t\t</footer>\n\t\t\t</div>\n\t\t\t<ts-cover class="ts-modal-cover" ?data-visible=',' @click="','"></ts-cover>\n\t\t'],['\n\t\t\t<div\n\t\t\t\tdir="','"\n\t\t\t\tclass="container '," ",'"\n\t\t\t\t@transitionend="','"\n\t\t\t>\n\t\t\t\t','\n\t\t\t\t<div class="note">\n\t\t\t\t\t\x3c!-- Use this slot name on the \\`ts-note\\` in the modal\t--\x3e\n\t\t\t\t\t<slot name="note"></slot>\n\t\t\t\t</div>\n\t\t\t\t<main>\n\t\t\t\t\t\x3c!-- Content in the main section of the modal\t--\x3e\n\t\t\t\t\t<slot name="main"></slot>\n\t\t\t\t</main>\n\t\t\t\t<footer>\n\t\t\t\t\t\x3c!-- Content in the footer section of the modal, most of the time \\`ts-button-group\\`\t--\x3e\n\t\t\t\t\t<slot name="footer"></slot>\n\t\t\t\t</footer>\n\t\t\t</div>\n\t\t\t<ts-cover class="ts-modal-cover" ?data-visible=',' @click="','"></ts-cover>\n\t\t'])),this.direction,this.size,this.hidden,this.handleTransition,this.header,this.visible,this.close)},b.firstUpdated=function(){this.closeBehavior.start()},b.disconnectedCallback=function(){this.closeBehavior.stop(),t.prototype.disconnectedCallback.call(this)},f=u,m=[{key:"styles",get:function(){return[i.styles,o(".container{background-color:#fff;background-color:var(--ts-color-white);bottom:20px;bottom:var(--ts-unit);box-shadow:inset 0 0 0 1px #cbd7dc;box-shadow:var(--ts-boxshadow-border-default);display:flex;flex-direction:column;left:20px;left:var(--ts-unit);position:absolute;right:20px;right:var(--ts-unit);top:20px;top:var(--ts-unit);z-index:1500;z-index:var(--ts-zindex-modal)}ts-header{flex-grow:0;flex-shrink:0;padding:0 0 0 5px;padding:0 0 0 var(--ts-unit-quarter)}ts-header[dir=rtl]{padding:0 5px 0 0;padding:0 var(--ts-unit-quarter) 0 0}.note ::slotted(ts-note){flex-grow:0;padding-left:20px;padding-left:var(--ts-unit);padding-right:20px;padding-right:var(--ts-unit)}.close{height:40px;height:var(--ts-unit-double);width:40px;width:var(--ts-unit-double)}main{flex-grow:1;overflow:auto;padding:20px;padding:var(--ts-unit)}:host([no-padding]) main{padding:0}footer{flex-grow:0}.container.medium{bottom:12.5%;left:25%;right:25%;top:12.5%}.container.small{bottom:auto;left:50%;right:auto;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:380px;width:var(--ts-modal-width-small)}.fade-in{opacity:1;transition:visibility .1s linear .1s,opacity .2s;transition:visibility var(--ts-transition-now) linear var(--ts-transition-now),opacity var(--ts-transition-fast);visibility:visible}.fade-out{opacity:0;transition:visibility .2s linear .1s,opacity .2s;transition:visibility var(--ts-transition-fast) linear var(--ts-transition-now),opacity var(--ts-transition-fast);visibility:hidden}@media (max-width:600px){.container,.container.medium,.container.small{bottom:10px;bottom:var(--ts-unit-half);left:10px;left:var(--ts-unit-half);right:10px;right:var(--ts-unit-half);top:10px;top:var(--ts-unit-half);-webkit-transform:translate(0);transform:translate(0);width:auto}.container main{padding:10px;padding:var(--ts-unit-half)}}")]}},{key:"properties",get:function(){return{dir:{type:String,reflect:!0,attribute:"data-dir"},size:{type:String,reflect:!0,attribute:"data-size"},title:{type:String,reflect:!0,attribute:"data-title"},visible:{type:Boolean,reflect:!0,attribute:"data-visible"},noCloseOnEscKey:{type:Boolean,attribute:"no-close-on-esc-key"},hideHeader:{type:Boolean,attribute:"hide-header"},noPadding:{type:Boolean,attribute:"no-padding"}}}}],(v=[{key:"direction",get:function(){return this.dir?this.dir:this.bodyDir}},{key:"hidden",get:function(){return this.visible?"fade-in":"fade-out"}},{key:"header",get:function(){return this.hideHeader?"":e(d||(d=s(['\n\t\t\t<ts-header .title="','" dir="','">\n\t\t\t\t<ts-button class="no-border" icon="close-clear" size="large" @click="','"></ts-button>\n\t\t\t</ts-header>\n\t\t'])),this.title,this.direction,this.close)}}])&&a(f.prototype,v),m&&a(f,m),u}(i);t("ts-modal",p);export{p as TSModal,c as customEventNames,h as sizes};

12

package.json
{
"name": "@tradeshift/elements.modal",
"version": "0.27.6",
"version": "0.28.0",
"repository": {

@@ -18,9 +18,9 @@ "type": "git",

"dependencies": {
"@tradeshift/elements": "^0.27.6",
"@tradeshift/elements.button": "^0.27.6",
"@tradeshift/elements.cover": "^0.27.6",
"@tradeshift/elements.header": "^0.27.6"
"@tradeshift/elements": "^0.28.0",
"@tradeshift/elements.button": "^0.28.0",
"@tradeshift/elements.cover": "^0.28.0",
"@tradeshift/elements.header": "^0.28.0"
},
"src": "src/modal.js",
"gitHead": "ff4923309b40e373d6a3b0d6dc06a393441e12c2"
"gitHead": "636e5d745d01dbc469541bd8d5bc3bf4434d177f"
}
lib/modal.umd.js

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

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

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc