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

@spectrum-web-components/modal

Package Overview
Dependencies
Maintainers
5
Versions
272
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@spectrum-web-components/modal - npm Package Compare versions

Comparing version 0.0.2-alpha.1214 to 0.0.2-alpha.1238

6

package.json

@@ -21,3 +21,3 @@ {

],
"version": "0.0.2-alpha.1214+a478c2c4",
"version": "0.0.2-alpha.1238+1680fb01",
"description": "",

@@ -52,6 +52,6 @@ "main": "src/modal.css.js",

"dependencies": {
"@spectrum-web-components/base": "^0.1.4-alpha.60+a478c2c4",
"@spectrum-web-components/base": "^0.1.4-alpha.84+1680fb01",
"tslib": "^2.0.0"
},
"gitHead": "a478c2c484b45e88c5d8b5cc64a255e31d0a3829"
"gitHead": "1680fb01795050191c13f5c05f554d923ff850ae"
}

@@ -14,7 +14,7 @@ /*

const styles = css `
:host{position:fixed;left:0;top:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100vw;height:100vh;height:-webkit-fill-available;height:-webkit-stretch;height:-moz-available;height:fill-available;visibility:hidden;pointer-events:none;z-index:2;transition:visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s)}:host([open]){visibility:visible}:host([responsive]){margin-top:0}.modal{visibility:hidden;opacity:0;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);pointer-events:none;transform:translateY(var(--spectrum-dialog-confirm-entry-animation-distance,var(--spectrum-global-dimension-size-250)));z-index:2;max-height:90vh;border-radius:var(--spectrum-dialog-confirm-border-radius,var(--spectrum-global-dimension-size-50));overflow:hidden;outline:none;pointer-events:auto;transition:opacity var(--spectrum-dialog-confirm-exit-animation-duration,var(--spectrum-global-animation-duration-100)) cubic-bezier(.5,0,1,1) 0ms,visibility 0ms linear calc(0ms + var(--spectrum-dialog-confirm-exit-animation-duration,
:host{position:fixed;left:0;top:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100vw;height:100vh;height:-webkit-fill-available;height:-webkit-stretch;height:-moz-available;height:fill-available;visibility:hidden;pointer-events:none;z-index:2;transition:visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s)}:host([open]){visibility:visible}@media only screen and (max-device-height:350px),only screen and (max-device-width:400px){:host([responsive]){width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0;margin-top:0}}.modal{visibility:hidden;opacity:0;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);pointer-events:none}:host([open]) .modal{visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto}.modal{transform:translateY(var(--spectrum-dialog-confirm-entry-animation-distance,var(--spectrum-global-dimension-size-250)));z-index:2;max-height:90vh;border-radius:var(--spectrum-dialog-confirm-border-radius,var(--spectrum-global-dimension-size-50));overflow:hidden;outline:none;pointer-events:auto;transition:opacity var(--spectrum-dialog-confirm-exit-animation-duration,var(--spectrum-global-animation-duration-100)) cubic-bezier(.5,0,1,1) 0ms,visibility 0ms linear calc(0ms + var(--spectrum-dialog-confirm-exit-animation-duration,
var(--spectrum-global-animation-duration-100))),transform 0ms linear calc(0ms + var(--spectrum-dialog-confirm-exit-animation-duration,
var(--spectrum-global-animation-duration-100)));background:var(--spectrum-dialog-confirm-background-color,var(--spectrum-alias-background-color-default))}:host([open]) .modal{visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto;transition:transform var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200)),opacity var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200));transform:translateY(0)}:host([responsive]) .modal{width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0}.fullscreen{left:32px;top:32px;right:32px;bottom:32px}.fullscreen,.fullscreenTakeover{position:fixed;max-width:none;max-height:none}.fullscreenTakeover{left:0;right:0;top:0;bottom:0;box-sizing:border-box;border:none;border-radius:0}.fullscreenTakeover,:host([open]) .fullscreenTakeover{transform:none}
var(--spectrum-global-animation-duration-100)))}:host([open]) .modal{transition:transform var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200)),opacity var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200));transform:translateY(0)}@media only screen and (max-device-height:350px),only screen and (max-device-width:400px){:host([responsive]) .modal{width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0}}.fullscreen{left:32px;top:32px;right:32px;bottom:32px}.fullscreen,.fullscreenTakeover{position:fixed;max-width:none;max-height:none}.fullscreenTakeover{left:0;right:0;top:0;bottom:0;box-sizing:border-box;border:none;border-radius:0}.fullscreenTakeover,:host([open]) .fullscreenTakeover{transform:none}.modal{background:var(--spectrum-dialog-confirm-background-color,var(--spectrum-alias-background-color-default))}
`;
export default styles;
//# sourceMappingURL=modal.css.js.map

@@ -14,6 +14,6 @@ /*

const styles = css`
:host{position:fixed;left:0;top:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100vw;height:100vh;height:-webkit-fill-available;height:-webkit-stretch;height:-moz-available;height:fill-available;visibility:hidden;pointer-events:none;z-index:2;transition:visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s)}:host([open]){visibility:visible}:host([responsive]){margin-top:0}.modal{visibility:hidden;opacity:0;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);pointer-events:none;transform:translateY(var(--spectrum-dialog-confirm-entry-animation-distance,var(--spectrum-global-dimension-size-250)));z-index:2;max-height:90vh;border-radius:var(--spectrum-dialog-confirm-border-radius,var(--spectrum-global-dimension-size-50));overflow:hidden;outline:none;pointer-events:auto;transition:opacity var(--spectrum-dialog-confirm-exit-animation-duration,var(--spectrum-global-animation-duration-100)) cubic-bezier(.5,0,1,1) 0ms,visibility 0ms linear calc(0ms + var(--spectrum-dialog-confirm-exit-animation-duration,
:host{position:fixed;left:0;top:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100vw;height:100vh;height:-webkit-fill-available;height:-webkit-stretch;height:-moz-available;height:fill-available;visibility:hidden;pointer-events:none;z-index:2;transition:visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s)}:host([open]){visibility:visible}@media only screen and (max-device-height:350px),only screen and (max-device-width:400px){:host([responsive]){width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0;margin-top:0}}.modal{visibility:hidden;opacity:0;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);pointer-events:none}:host([open]) .modal{visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto}.modal{transform:translateY(var(--spectrum-dialog-confirm-entry-animation-distance,var(--spectrum-global-dimension-size-250)));z-index:2;max-height:90vh;border-radius:var(--spectrum-dialog-confirm-border-radius,var(--spectrum-global-dimension-size-50));overflow:hidden;outline:none;pointer-events:auto;transition:opacity var(--spectrum-dialog-confirm-exit-animation-duration,var(--spectrum-global-animation-duration-100)) cubic-bezier(.5,0,1,1) 0ms,visibility 0ms linear calc(0ms + var(--spectrum-dialog-confirm-exit-animation-duration,
var(--spectrum-global-animation-duration-100))),transform 0ms linear calc(0ms + var(--spectrum-dialog-confirm-exit-animation-duration,
var(--spectrum-global-animation-duration-100)));background:var(--spectrum-dialog-confirm-background-color,var(--spectrum-alias-background-color-default))}:host([open]) .modal{visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto;transition:transform var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200)),opacity var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200));transform:translateY(0)}:host([responsive]) .modal{width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0}.fullscreen{left:32px;top:32px;right:32px;bottom:32px}.fullscreen,.fullscreenTakeover{position:fixed;max-width:none;max-height:none}.fullscreenTakeover{left:0;right:0;top:0;bottom:0;box-sizing:border-box;border:none;border-radius:0}.fullscreenTakeover,:host([open]) .fullscreenTakeover{transform:none}
var(--spectrum-global-animation-duration-100)))}:host([open]) .modal{transition:transform var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200)),opacity var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200));transform:translateY(0)}@media only screen and (max-device-height:350px),only screen and (max-device-width:400px){:host([responsive]) .modal{width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0}}.fullscreen{left:32px;top:32px;right:32px;bottom:32px}.fullscreen,.fullscreenTakeover{position:fixed;max-width:none;max-height:none}.fullscreenTakeover{left:0;right:0;top:0;bottom:0;box-sizing:border-box;border:none;border-radius:0}.fullscreenTakeover,:host([open]) .fullscreenTakeover{transform:none}.modal{background:var(--spectrum-dialog-confirm-background-color,var(--spectrum-alias-background-color-default))}
`;
export default styles;

@@ -14,5 +14,5 @@ /*

const styles = css `
:host{position:fixed;left:0;top:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100vw;height:100vh;height:-webkit-fill-available;height:-webkit-stretch;height:-moz-available;height:fill-available;visibility:hidden;pointer-events:none;z-index:2;transition:visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s)}:host([open]){visibility:visible}:host([responsive]){margin-top:0}
:host{position:fixed;left:0;top:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100vw;height:100vh;height:-webkit-fill-available;height:-webkit-stretch;height:-moz-available;height:fill-available;visibility:hidden;pointer-events:none;z-index:2;transition:visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s)}:host([open]){visibility:visible}@media only screen and (max-device-height:350px),only screen and (max-device-width:400px){:host([responsive]){width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0;margin-top:0}}
`;
export default styles;
//# sourceMappingURL=spectrum-modal-wrapper.css.js.map

@@ -14,4 +14,4 @@ /*

const styles = css`
:host{position:fixed;left:0;top:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100vw;height:100vh;height:-webkit-fill-available;height:-webkit-stretch;height:-moz-available;height:fill-available;visibility:hidden;pointer-events:none;z-index:2;transition:visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s)}:host([open]){visibility:visible}:host([responsive]){margin-top:0}
:host{position:fixed;left:0;top:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100vw;height:100vh;height:-webkit-fill-available;height:-webkit-stretch;height:-moz-available;height:fill-available;visibility:hidden;pointer-events:none;z-index:2;transition:visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s)}:host([open]){visibility:visible}@media only screen and (max-device-height:350px),only screen and (max-device-width:400px){:host([responsive]){width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0;margin-top:0}}
`;
export default styles;

@@ -14,7 +14,7 @@ /*

const styles = css `
.modal{visibility:hidden;opacity:0;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);pointer-events:none;transform:translateY(var(--spectrum-dialog-confirm-entry-animation-distance,var(--spectrum-global-dimension-size-250)));z-index:2;max-height:90vh;border-radius:var(--spectrum-dialog-confirm-border-radius,var(--spectrum-global-dimension-size-50));overflow:hidden;outline:none;pointer-events:auto;transition:opacity var(--spectrum-dialog-confirm-exit-animation-duration,var(--spectrum-global-animation-duration-100)) cubic-bezier(.5,0,1,1) 0ms,visibility 0ms linear calc(0ms + var(--spectrum-dialog-confirm-exit-animation-duration,
.modal{visibility:hidden;opacity:0;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);pointer-events:none}:host([open]) .modal{visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto}.modal{transform:translateY(var(--spectrum-dialog-confirm-entry-animation-distance,var(--spectrum-global-dimension-size-250)));z-index:2;max-height:90vh;border-radius:var(--spectrum-dialog-confirm-border-radius,var(--spectrum-global-dimension-size-50));overflow:hidden;outline:none;pointer-events:auto;transition:opacity var(--spectrum-dialog-confirm-exit-animation-duration,var(--spectrum-global-animation-duration-100)) cubic-bezier(.5,0,1,1) 0ms,visibility 0ms linear calc(0ms + var(--spectrum-dialog-confirm-exit-animation-duration,
var(--spectrum-global-animation-duration-100))),transform 0ms linear calc(0ms + var(--spectrum-dialog-confirm-exit-animation-duration,
var(--spectrum-global-animation-duration-100)));background:var(--spectrum-dialog-confirm-background-color,var(--spectrum-alias-background-color-default))}:host([open]) .modal{visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto;transition:transform var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200)),opacity var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200));transform:translateY(0)}:host([responsive]) .modal{width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0}.fullscreen{left:32px;top:32px;right:32px;bottom:32px}.fullscreen,.fullscreenTakeover{position:fixed;max-width:none;max-height:none}.fullscreenTakeover{left:0;right:0;top:0;bottom:0;box-sizing:border-box;border:none;border-radius:0}.fullscreenTakeover,:host([open]) .fullscreenTakeover{transform:none}
var(--spectrum-global-animation-duration-100)))}:host([open]) .modal{transition:transform var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200)),opacity var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200));transform:translateY(0)}@media only screen and (max-device-height:350px),only screen and (max-device-width:400px){:host([responsive]) .modal{width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0}}.fullscreen{left:32px;top:32px;right:32px;bottom:32px}.fullscreen,.fullscreenTakeover{position:fixed;max-width:none;max-height:none}.fullscreenTakeover{left:0;right:0;top:0;bottom:0;box-sizing:border-box;border:none;border-radius:0}.fullscreenTakeover,:host([open]) .fullscreenTakeover{transform:none}.modal{background:var(--spectrum-dialog-confirm-background-color,var(--spectrum-alias-background-color-default))}
`;
export default styles;
//# sourceMappingURL=spectrum-modal.css.js.map

@@ -14,6 +14,6 @@ /*

const styles = css`
.modal{visibility:hidden;opacity:0;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);pointer-events:none;transform:translateY(var(--spectrum-dialog-confirm-entry-animation-distance,var(--spectrum-global-dimension-size-250)));z-index:2;max-height:90vh;border-radius:var(--spectrum-dialog-confirm-border-radius,var(--spectrum-global-dimension-size-50));overflow:hidden;outline:none;pointer-events:auto;transition:opacity var(--spectrum-dialog-confirm-exit-animation-duration,var(--spectrum-global-animation-duration-100)) cubic-bezier(.5,0,1,1) 0ms,visibility 0ms linear calc(0ms + var(--spectrum-dialog-confirm-exit-animation-duration,
.modal{visibility:hidden;opacity:0;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);pointer-events:none}:host([open]) .modal{visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto}.modal{transform:translateY(var(--spectrum-dialog-confirm-entry-animation-distance,var(--spectrum-global-dimension-size-250)));z-index:2;max-height:90vh;border-radius:var(--spectrum-dialog-confirm-border-radius,var(--spectrum-global-dimension-size-50));overflow:hidden;outline:none;pointer-events:auto;transition:opacity var(--spectrum-dialog-confirm-exit-animation-duration,var(--spectrum-global-animation-duration-100)) cubic-bezier(.5,0,1,1) 0ms,visibility 0ms linear calc(0ms + var(--spectrum-dialog-confirm-exit-animation-duration,
var(--spectrum-global-animation-duration-100))),transform 0ms linear calc(0ms + var(--spectrum-dialog-confirm-exit-animation-duration,
var(--spectrum-global-animation-duration-100)));background:var(--spectrum-dialog-confirm-background-color,var(--spectrum-alias-background-color-default))}:host([open]) .modal{visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto;transition:transform var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200)),opacity var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200));transform:translateY(0)}:host([responsive]) .modal{width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0}.fullscreen{left:32px;top:32px;right:32px;bottom:32px}.fullscreen,.fullscreenTakeover{position:fixed;max-width:none;max-height:none}.fullscreenTakeover{left:0;right:0;top:0;bottom:0;box-sizing:border-box;border:none;border-radius:0}.fullscreenTakeover,:host([open]) .fullscreenTakeover{transform:none}
var(--spectrum-global-animation-duration-100)))}:host([open]) .modal{transition:transform var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200)),opacity var(--spectrum-dialog-confirm-entry-animation-duration,var(--spectrum-global-animation-duration-500)) cubic-bezier(0,0,.4,1) var(--spectrum-dialog-confirm-entry-animation-delay,var(--spectrum-global-animation-duration-200));transform:translateY(0)}@media only screen and (max-device-height:350px),only screen and (max-device-width:400px){:host([responsive]) .modal{width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0}}.fullscreen{left:32px;top:32px;right:32px;bottom:32px}.fullscreen,.fullscreenTakeover{position:fixed;max-width:none;max-height:none}.fullscreenTakeover{left:0;right:0;top:0;bottom:0;box-sizing:border-box;border:none;border-radius:0}.fullscreenTakeover,:host([open]) .fullscreenTakeover{transform:none}.modal{background:var(--spectrum-dialog-confirm-background-color,var(--spectrum-alias-background-color-default))}
`;
export default styles;

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

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