@spectrum-web-components/color-loupe - npm Package Compare versions

Comparing version 0.31.1-react.3 to 0.31.1-react.21

custom-elements.json

@@ -9,3 +9,12 @@ {
       "declarations": [],
-      "exports": []
+      "exports": [
+        {
+          "kind": "custom-element-definition",
+          "name": "sp-color-loupe",
+          "declaration": {
+            "name": "ColorLoupe",
+            "module": "/src/ColorLoupe.js"
+          }
+        }
+      ]
     },
@@ -12,0 +21,0 @@ {

package.json

 {
     "name": "@spectrum-web-components/color-loupe",
-    "version": "0.31.1-react.3+886f51591",
+    "version": "0.31.1-react.21+44f0b1df9",
     "publishConfig": {
@@ -60,6 +60,6 @@ "access": "public"
     "dependencies": {
-        "@spectrum-web-components/base": "^0.31.1-react.3+886f51591"
+        "@spectrum-web-components/base": "^0.31.1-react.21+44f0b1df9"
     },
     "devDependencies": {
-        "@spectrum-css/colorloupe": "^3.0.7"
+        "@spectrum-css/colorloupe": "^4.0.3"
     },
@@ -72,3 +72,3 @@ "types": "./src/index.d.ts",
     ],
-    "gitHead": "886f515919ca0e8a1cec52a00babb1d4a195ae01"
+    "gitHead": "44f0b1df9e1ea77d9e931629a63918ceee2744c2"
 }

src/color-loupe.css.dev.js

 "use strict";
 import { css } from "@spectrum-web-components/base";
 const styles = css`
-:host{--spectrum-colorloupe-width:48px;--spectrum-colorloupe-height:64px;--spectrum-colorloupe-offset:12px;--spectrum-colorloupe-animation-distance:8px;--spectrum-colorloupe-drop-shadow-x:var(--spectrum-drop-shadow-x);--spectrum-colorloupe-drop-shadow-y:var(
+:host{--spectrum-colorloupe-width:var(--spectrum-color-loupe-width);--spectrum-colorloupe-height:var(--spectrum-color-loupe-height);--spectrum-colorloupe-offset:var(
+--spectrum-color-loupe-bottom-to-color-handle
+);--spectrum-colorloupe-animation-distance:8px;--spectrum-colorloupe-drop-shadow-x:var(--spectrum-drop-shadow-x);--spectrum-colorloupe-drop-shadow-y:var(
 --spectrum-color-loupe-drop-shadow-y
@@ -12,3 +14,5 @@ );--spectrum-colorloupe-drop-shadow-blur:var(
 --spectrum-color-loupe-outer-border-width
-);--spectrum-colorloupe-inner-border-width:1px;--spectrum-colorloupe-outer-border-color:var(
+);--spectrum-colorloupe-inner-border-width:var(
+--spectrum-color-loupe-inner-border-width
+);--spectrum-colorloupe-outer-border-color:var(
 --spectrum-color-loupe-outer-border
@@ -29,3 +33,3 @@ );--spectrum-colorloupe-inner-border-color:var(
 --mod-colorloupe-drop-shadow-color,var(--spectrum-colorloupe-drop-shadow-color)
-));inline-size:var(--spectrum-colorloupe-width);inset-block-end:calc(var(--spectrum-color-handle-size-interim) - var(--spectrum-color-handle-outer-border-width) + var(--mod-colorloupe-offset, var(--spectrum-colorloupe-offset)));inset-inline-end:calc(50% - var(--spectrum-colorloupe-width)/2 + 1px);opacity:0;pointer-events:none;position:absolute;transform:translateY(var(
+));inline-size:var(--spectrum-colorloupe-width);inset-block-end:calc(var(--spectrum-color-handle-size) - var(--spectrum-color-handle-outer-border-width) + var(--mod-colorloupe-offset, var(--spectrum-colorloupe-offset)));inset-inline-end:calc(50% - var(--spectrum-colorloupe-width)/2 + 1px);opacity:0;pointer-events:none;position:absolute;transform:translateY(var(
 --mod-colorloupe-animation-distance,var(--spectrum-colorloupe-animation-distance)
@@ -32,0 +36,0 @@ ));transform-origin:bottom;transition:transform .1s ease-in-out,opacity .125s ease-in-out}:host([dir=rtl]){inset-inline-end:calc(50% - var(--spectrum-colorloupe-width)/2 - 1px)}:host([open]){opacity:1;transform:translate(0)}.spectrum-ColorLoupe-inner-border{fill:var(--spectrum-picked-color);stroke:var(

src/color-loupe.css.js

 "use strict";import{css as o}from"@spectrum-web-components/base";const r=o`
-:host{--spectrum-colorloupe-width:48px;--spectrum-colorloupe-height:64px;--spectrum-colorloupe-offset:12px;--spectrum-colorloupe-animation-distance:8px;--spectrum-colorloupe-drop-shadow-x:var(--spectrum-drop-shadow-x);--spectrum-colorloupe-drop-shadow-y:var(
+:host{--spectrum-colorloupe-width:var(--spectrum-color-loupe-width);--spectrum-colorloupe-height:var(--spectrum-color-loupe-height);--spectrum-colorloupe-offset:var(
+--spectrum-color-loupe-bottom-to-color-handle
+);--spectrum-colorloupe-animation-distance:8px;--spectrum-colorloupe-drop-shadow-x:var(--spectrum-drop-shadow-x);--spectrum-colorloupe-drop-shadow-y:var(
 --spectrum-color-loupe-drop-shadow-y
@@ -10,3 +12,5 @@ );--spectrum-colorloupe-drop-shadow-blur:var(
 --spectrum-color-loupe-outer-border-width
-);--spectrum-colorloupe-inner-border-width:1px;--spectrum-colorloupe-outer-border-color:var(
+);--spectrum-colorloupe-inner-border-width:var(
+--spectrum-color-loupe-inner-border-width
+);--spectrum-colorloupe-outer-border-color:var(
 --spectrum-color-loupe-outer-border
@@ -27,3 +31,3 @@ );--spectrum-colorloupe-inner-border-color:var(
 --mod-colorloupe-drop-shadow-color,var(--spectrum-colorloupe-drop-shadow-color)
-));inline-size:var(--spectrum-colorloupe-width);inset-block-end:calc(var(--spectrum-color-handle-size-interim) - var(--spectrum-color-handle-outer-border-width) + var(--mod-colorloupe-offset, var(--spectrum-colorloupe-offset)));inset-inline-end:calc(50% - var(--spectrum-colorloupe-width)/2 + 1px);opacity:0;pointer-events:none;position:absolute;transform:translateY(var(
+));inline-size:var(--spectrum-colorloupe-width);inset-block-end:calc(var(--spectrum-color-handle-size) - var(--spectrum-color-handle-outer-border-width) + var(--mod-colorloupe-offset, var(--spectrum-colorloupe-offset)));inset-inline-end:calc(50% - var(--spectrum-colorloupe-width)/2 + 1px);opacity:0;pointer-events:none;position:absolute;transform:translateY(var(
 --mod-colorloupe-animation-distance,var(--spectrum-colorloupe-animation-distance)
@@ -30,0 +34,0 @@ ));transform-origin:bottom;transition:transform .1s ease-in-out,opacity .125s ease-in-out}:host([dir=rtl]){inset-inline-end:calc(50% - var(--spectrum-colorloupe-width)/2 - 1px)}:host([open]){opacity:1;transform:translate(0)}.spectrum-ColorLoupe-inner-border{fill:var(--spectrum-picked-color);stroke:var(

src/spectrum-color-loupe.css.dev.js

 "use strict";
 import { css } from "@spectrum-web-components/base";
 const styles = css`
-:host{--spectrum-colorloupe-width:48px;--spectrum-colorloupe-height:64px;--spectrum-colorloupe-offset:12px;--spectrum-colorloupe-animation-distance:8px;--spectrum-colorloupe-drop-shadow-x:var(--spectrum-drop-shadow-x);--spectrum-colorloupe-drop-shadow-y:var(
+:host{--spectrum-colorloupe-width:var(--spectrum-color-loupe-width);--spectrum-colorloupe-height:var(--spectrum-color-loupe-height);--spectrum-colorloupe-offset:var(
+--spectrum-color-loupe-bottom-to-color-handle
+);--spectrum-colorloupe-animation-distance:8px;--spectrum-colorloupe-drop-shadow-x:var(--spectrum-drop-shadow-x);--spectrum-colorloupe-drop-shadow-y:var(
 --spectrum-color-loupe-drop-shadow-y
@@ -12,3 +14,5 @@ );--spectrum-colorloupe-drop-shadow-blur:var(
 --spectrum-color-loupe-outer-border-width
-);--spectrum-colorloupe-inner-border-width:1px;--spectrum-colorloupe-outer-border-color:var(
+);--spectrum-colorloupe-inner-border-width:var(
+--spectrum-color-loupe-inner-border-width
+);--spectrum-colorloupe-outer-border-color:var(
 --spectrum-color-loupe-outer-border
@@ -29,3 +33,3 @@ );--spectrum-colorloupe-inner-border-color:var(
 --mod-colorloupe-drop-shadow-color,var(--spectrum-colorloupe-drop-shadow-color)
-));inline-size:var(--spectrum-colorloupe-width);inset-block-end:calc(var(--spectrum-color-handle-size-interim) - var(--spectrum-color-handle-outer-border-width) + var(--mod-colorloupe-offset, var(--spectrum-colorloupe-offset)));inset-inline-end:calc(50% - var(--spectrum-colorloupe-width)/2 + 1px);opacity:0;pointer-events:none;position:absolute;transform:translateY(var(
+));inline-size:var(--spectrum-colorloupe-width);inset-block-end:calc(var(--spectrum-color-handle-size) - var(--spectrum-color-handle-outer-border-width) + var(--mod-colorloupe-offset, var(--spectrum-colorloupe-offset)));inset-inline-end:calc(50% - var(--spectrum-colorloupe-width)/2 + 1px);opacity:0;pointer-events:none;position:absolute;transform:translateY(var(
 --mod-colorloupe-animation-distance,var(--spectrum-colorloupe-animation-distance)
@@ -32,0 +36,0 @@ ));transform-origin:bottom;transition:transform .1s ease-in-out,opacity .125s ease-in-out}:host([dir=rtl]){inset-inline-end:calc(50% - var(--spectrum-colorloupe-width)/2 - 1px)}:host([open]){opacity:1;transform:translate(0)}.spectrum-ColorLoupe-inner-border{fill:var(--spectrum-picked-color);stroke:var(

src/spectrum-color-loupe.css.js

 "use strict";import{css as o}from"@spectrum-web-components/base";const r=o`
-:host{--spectrum-colorloupe-width:48px;--spectrum-colorloupe-height:64px;--spectrum-colorloupe-offset:12px;--spectrum-colorloupe-animation-distance:8px;--spectrum-colorloupe-drop-shadow-x:var(--spectrum-drop-shadow-x);--spectrum-colorloupe-drop-shadow-y:var(
+:host{--spectrum-colorloupe-width:var(--spectrum-color-loupe-width);--spectrum-colorloupe-height:var(--spectrum-color-loupe-height);--spectrum-colorloupe-offset:var(
+--spectrum-color-loupe-bottom-to-color-handle
+);--spectrum-colorloupe-animation-distance:8px;--spectrum-colorloupe-drop-shadow-x:var(--spectrum-drop-shadow-x);--spectrum-colorloupe-drop-shadow-y:var(
 --spectrum-color-loupe-drop-shadow-y
@@ -10,3 +12,5 @@ );--spectrum-colorloupe-drop-shadow-blur:var(
 --spectrum-color-loupe-outer-border-width
-);--spectrum-colorloupe-inner-border-width:1px;--spectrum-colorloupe-outer-border-color:var(
+);--spectrum-colorloupe-inner-border-width:var(
+--spectrum-color-loupe-inner-border-width
+);--spectrum-colorloupe-outer-border-color:var(
 --spectrum-color-loupe-outer-border
@@ -27,3 +31,3 @@ );--spectrum-colorloupe-inner-border-color:var(
 --mod-colorloupe-drop-shadow-color,var(--spectrum-colorloupe-drop-shadow-color)
-));inline-size:var(--spectrum-colorloupe-width);inset-block-end:calc(var(--spectrum-color-handle-size-interim) - var(--spectrum-color-handle-outer-border-width) + var(--mod-colorloupe-offset, var(--spectrum-colorloupe-offset)));inset-inline-end:calc(50% - var(--spectrum-colorloupe-width)/2 + 1px);opacity:0;pointer-events:none;position:absolute;transform:translateY(var(
+));inline-size:var(--spectrum-colorloupe-width);inset-block-end:calc(var(--spectrum-color-handle-size) - var(--spectrum-color-handle-outer-border-width) + var(--mod-colorloupe-offset, var(--spectrum-colorloupe-offset)));inset-inline-end:calc(50% - var(--spectrum-colorloupe-width)/2 + 1px);opacity:0;pointer-events:none;position:absolute;transform:translateY(var(
 --mod-colorloupe-animation-distance,var(--spectrum-colorloupe-animation-distance)
@@ -30,0 +34,0 @@ ));transform-origin:bottom;transition:transform .1s ease-in-out,opacity .125s ease-in-out}:host([dir=rtl]){inset-inline-end:calc(50% - var(--spectrum-colorloupe-width)/2 - 1px)}:host([open]){opacity:1;transform:translate(0)}.spectrum-ColorLoupe-inner-border{fill:var(--spectrum-picked-color);stroke:var(

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Unidentified License

License

(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Unidentified License

License

(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

79730

increased by1.89%

Lines of code

577

increased by3.78%

Worsened metrics

Number of medium supply chain risk alerts

2

increased by100%

Dependency changes

• Updated@spectrum-web-components/base@^0.31.1-react.21+44f0b1df9