@wistia/ui 0.13.6-beta.e8bdf48a.d4d35de → 0.13.6

package/dist/index.cjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.13.6-beta.e8bdf48a.d4d35de
+ * @license @wistia/ui v0.13.6
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -10166,7 +10166,6 @@ ColorGrid.displayName = "ColorGrid_UI";
 // src/components/ColorPicker/ColorGridOption.tsx
 var import_styled_components50 = __toESM(require("styled-components"));
 var import_react_radio_group2 = require("@radix-ui/react-radio-group");
-var import_fn5 = require("culori/fn");
 
 // src/components/ColorPicker/ColorSwatch.tsx
 var import_styled_components48 = __toESM(require("styled-components"));
@@ -10387,8 +10386,7 @@ var Container2 = (0, import_styled_components50.default)(import_react_radio_grou
   user-select: none;
 `;
 var ColorGridOption = ({ value, name }) => {
-  const { valueAsHsv, nonDerivedValueAsHex } = useColorPickerState();
-  const valueAsHex = (0, import_fn5.formatHex)(valueAsHsv);
+  const { valueAsHex, nonDerivedValueAsHex } = useColorPickerState();
   const isSelected = valueAsHex === value;
   const derivativeIsSelected = !isSelected && nonDerivedValueAsHex === value;
   return /* @__PURE__ */ (0, import_jsx_runtime229.jsx)(
@@ -10485,7 +10483,6 @@ ColorListGroup.displayName = "ColorListGroup_UI";
 // src/components/ColorPicker/ColorListOption.tsx
 var import_styled_components53 = __toESM(require("styled-components"));
 var import_react_toggle_group2 = require("@radix-ui/react-toggle-group");
-var import_fn6 = require("culori/fn");
 
 // src/components/ColorPicker/ColorNameOrHexCode.tsx
 var import_jsx_runtime232 = require("react/jsx-runtime");
@@ -10545,8 +10542,7 @@ var Container4 = (0, import_styled_components53.default)(import_react_toggle_gro
   }
 `;
 var ColorListOption = ({ value, name }) => {
-  const { valueAsHsv, nonDerivedValueAsHex } = useColorPickerState();
-  const valueAsHex = (0, import_fn6.formatHex)(valueAsHsv);
+  const { valueAsHex, nonDerivedValueAsHex } = useColorPickerState();
   const isSelected = valueAsHex === value;
   const derivativeIsSelected = !isSelected && nonDerivedValueAsHex === value;
   return /* @__PURE__ */ (0, import_jsx_runtime233.jsxs)(
@@ -10618,7 +10614,6 @@ var StyledPopoverContent = (0, import_styled_components54.default)(import_react_
   flex-direction: column;
   max-width: ${COLOR_PICKER_POPOVER_MAX_WIDTH_PX}px;
   overflow: hidden;
-  z-index: var(--wui-zindex-select);
 `;
 var ColorPickerPopoverContent = ({
   children
@@ -10992,7 +10987,7 @@ ContrastControls.displayName = "ContrastControls_UI";
 
 // src/components/ColorPicker/HexColorInput.tsx
 var import_react48 = require("react");
-var import_fn7 = require("culori/fn");
+var import_fn5 = require("culori/fn");
 
 // src/components/Input/Input.tsx
 var import_react47 = require("react");
@@ -11222,7 +11217,7 @@ var HexColorInput = ({ autoFocus = true }) => {
     (event) => {
       const newValue = (event.target.value || "#").trim().toLocaleLowerCase();
       setTextInputValue(newValue);
-      const isValidHexValue = Boolean((0, import_fn7.parseHex)(newValue));
+      const isValidHexValue = Boolean((0, import_fn5.parseHex)(newValue));
       if (!isValidHexValue) {
         return;
       }
@@ -11304,7 +11299,7 @@ var HexColorInput = ({ autoFocus = true }) => {
       event.preventDefault();
       const pastedText = event.clipboardData.getData("text");
       const normalizedValue = normalizeHexInput(pastedText);
-      const isValidHexValue = Boolean((0, import_fn7.parseHex)(normalizedValue));
+      const isValidHexValue = Boolean((0, import_fn5.parseHex)(normalizedValue));
       setTextInputValue(normalizedValue);
       if (!isValidHexValue) {
         return;
@@ -11367,12 +11362,12 @@ HexColorInput.displayName = "HexColorInput_UI";
 var import_react50 = require("react");
 var import_react_slider = require("@radix-ui/react-slider");
 var import_styled_components62 = __toESM(require("styled-components"));
-var import_fn9 = require("culori/fn");
+var import_fn7 = require("culori/fn");
 
 // src/components/ColorPicker/HSVHueCanvas.tsx
 var import_react49 = require("react");
 var import_styled_components61 = __toESM(require("styled-components"));
-var import_fn8 = require("culori/fn");
+var import_fn6 = require("culori/fn");
 var import_jsx_runtime247 = require("react/jsx-runtime");
 var Canvas = import_styled_components61.default.canvas`
   display: block;
@@ -11394,7 +11389,7 @@ var HSVHueCanvas = ({ hsv }) => {
     const gradient = ctx.createLinearGradient(0, 0, width, 0);
     for (let i = 0; i <= THREE_SIXTY; i++) {
       const hue = i;
-      const hexColor = (0, import_fn8.formatHex)({ h: hue, s: hsv.s, v: hsv.v, mode: "hsv" });
+      const hexColor = (0, import_fn6.formatHex)({ h: hue, s: hsv.s, v: hsv.v, mode: "hsv" });
       if (hexColor) {
         gradient.addColorStop(i / THREE_SIXTY, hexColor);
       }
@@ -11457,7 +11452,7 @@ var HueSlider = () => {
   const { nonDerivedValueAsHsv, onChangeNonDerivedValueAsHsv, valueAsHsv } = useColorPickerState();
   const containerStyle = (0, import_react50.useMemo)(() => {
     return {
-      backgroundColor: (0, import_fn9.formatHex)({
+      backgroundColor: (0, import_fn7.formatHex)({
         h: 0,
         // red
         s: valueAsHsv.s,
@@ -11467,7 +11462,7 @@ var HueSlider = () => {
     };
   }, [valueAsHsv.s, valueAsHsv.v]);
   const thumbInnerStyle = (0, import_react50.useMemo)(() => {
-    return { backgroundColor: (0, import_fn9.formatHex)(valueAsHsv) };
+    return { backgroundColor: (0, import_fn7.formatHex)(valueAsHsv) };
   }, [valueAsHsv]);
   const onHueChange = (0, import_react50.useCallback)(
     (values) => {