@sanity/color-input 3.1.0 → 3.1.2

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2023 Sanity.io
+Copyright (c) 2024 Sanity.io
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/lib/index.d.ts

@@ -1,8 +1,7 @@
-/// <reference types="react" />
-
 import {Color} from 'react-color'
 import {HSLColor} from 'react-color'
 import {HSVColor} from 'react-color'
+import {JSX as JSX_2} from 'react/jsx-runtime'
 import {ObjectDefinition} from 'sanity'
 import {ObjectInputProps} from 'sanity'
 import {ObjectOptions} from 'sanity'
@@ -37,7 +36,7 @@ export declare interface ColorDefinition
   options?: ColorOptions
 }
 
-export declare function ColorInput(props: ObjectInputProps): JSX.Element
+export declare function ColorInput(props: ObjectInputProps): JSX_2.Element
 
 export declare const colorInput: Plugin_2<void>
 

package/lib/index.esm.js

@@ -1,5 +1,3 @@
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { defineType, set, setIfMissing, unset, definePlugin } from 'sanity';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { useMemo, useCallback, useRef, useState, useEffect } from 'react';
@@ -1353,9 +1351,15 @@ function validateWCAG2Parms(parms) {
     size: size
   };
 }
-const ColorListWrap = styled(Flex)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  gap: 0.25em;\n"])));
-const ColorBoxContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  width: 2.1em;\n  height: 2.1em;\n  cursor: pointer;\n  position: relative;\n  overflow: hidden;\n  border-radius: 3px;\n  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=') left center #fff;\n"])));
-const ColorBox$1 = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  content: '';\n  position: absolute;\n  inset: 0;\n  z-index: 1;\n"])));
+var __freeze$1 = Object.freeze;
+var __defProp$1 = Object.defineProperty;
+var __template$1 = (cooked, raw) => __freeze$1(__defProp$1(cooked, "raw", {
+  value: __freeze$1(raw || cooked.slice())
+}));
+var _a$1, _b$1, _c;
+const ColorListWrap = styled(Flex)(_a$1 || (_a$1 = __template$1(["\n  gap: 0.25em;\n"])));
+const ColorBoxContainer = styled.div(_b$1 || (_b$1 = __template$1(["\n  width: 2.1em;\n  height: 2.1em;\n  cursor: pointer;\n  position: relative;\n  overflow: hidden;\n  border-radius: 3px;\n  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=') left center #fff;\n"])));
+const ColorBox$1 = styled.div(_c || (_c = __template$1(["\n  border-radius: inherit;\n  box-shadow: inset 0 0 0 1px var(--card-shadow-outline-color);\n  content: '';\n  position: absolute;\n  inset: 0;\n  z-index: 1;\n"])));
 const validateColors = colors => colors.reduce((cls, c) => {
   const color = c.hex ? tinycolor(c.hex) : tinycolor(c);
   if (color.isValid()) {
@@ -1392,10 +1396,16 @@ const ColorList = _ref2 => {
     })
   });
 };
-const ColorBox = styled(Box)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"])));
-const ReadOnlyContainer = styled(Flex)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  margin-top: 6rem;\n  background-color: var(--card-bg-color);\n  position: relative;\n  width: 100%;\n"])));
+var __freeze = Object.freeze;
+var __defProp = Object.defineProperty;
+var __template = (cooked, raw) => __freeze(__defProp(cooked, "raw", {
+  value: __freeze(raw || cooked.slice())
+}));
+var _a, _b;
+const ColorBox = styled(Box)(_a || (_a = __template(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"])));
+const ReadOnlyContainer = styled(Flex)(_b || (_b = __template(["\n  margin-top: 6rem;\n  background-color: var(--card-bg-color);\n  position: relative;\n  width: 100%;\n"])));
 const ColorPickerInner = props => {
-  var _a, _b, _c;
+  var _a2, _b2, _c;
   const {
     width,
     color: {
@@ -1499,7 +1509,7 @@ const ColorPickerInner = props => {
                     size: 1,
                     children: [/* @__PURE__ */jsx("strong", {
                       children: "HSL: "
-                    }), " ", Math.round((_a = hsl == null ? void 0 : hsl.h) != null ? _a : 0), " ", Math.round((_b = hsl == null ? void 0 : hsl.s) != null ? _b : 0), "%", " ", Math.round((_c = hsl == null ? void 0 : hsl.l) != null ? _c : 0)]
+                    }), " ", Math.round((_a2 = hsl == null ? void 0 : hsl.h) != null ? _a2 : 0), " ", Math.round(((_b2 = hsl == null ? void 0 : hsl.s) != null ? _b2 : 0) * 100), "% ", Math.round(((_c = hsl == null ? void 0 : hsl.l) != null ? _c : 0) * 100), "%"]
                   })]
                 })]
               })