@wistia/ui 0.14.3 → 0.14.4-beta.6646ad7a.f524d7b

package/dist/index.cjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.14.3
+ * @license @wistia/ui v0.14.4-beta.6646ad7a.f524d7b
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -2015,7 +2015,7 @@ var timeAgoString = (date, { nowAnchor = /* @__PURE__ */ new Date(), includeTime
   if (differenceInDays < daysInWeek && !includeTime) {
     return `on ${dayOfWeekString(date)}`;
   }
-  return includeTime ? dateTimeString(date, { omitYear: isSameYear }) : dateOnlyString(date, { omitYear: isSameYear });
+  return includeTime ? dateTimeString(date, { omitYear: isSameYear }) : dateOnlyString(date, { omitYear: false });
 };
 
 // src/helpers/dateTime/timeOnlyString.ts
@@ -10062,6 +10062,7 @@ var ColorPickerProvider = ({
 }) => {
   const [isTransitioning, setIsTransitioning] = (0, import_react41.useState)(false);
   const [nonDerivedValueAsHsv, setNonDerivedValueAsHsv] = (0, import_react41.useState)(convertToHsv(valueAsHex));
+  const [valueAsHsv, setValueAsHsv] = (0, import_react41.useState)(convertToHsv(valueAsHex));
   const [shouldEnforceMinContrast, setShouldEnforceMinContrast] = (0, import_react41.useState)(false);
   const getAccessibleDerivativeColor = (0, import_react41.useCallback)(
     (originalColor) => getAccessibleColor({
@@ -10072,7 +10073,6 @@ var ColorPickerProvider = ({
     }),
     [colorForComparison, minimumContrastRatio, opacityForContrastCalculation]
   );
-  const valueAsHsv = shouldEnforceMinContrast ? getAccessibleDerivativeColor(nonDerivedValueAsHsv) : nonDerivedValueAsHsv;
   const currentContrastRatio = calculateContrast({
     backgroundColor: valueAsHex,
     foregroundColor: colorForComparison,
@@ -10086,9 +10086,18 @@ var ColorPickerProvider = ({
       opacityForContrastCalculation
     });
   }, [valueAsHex, colorForComparison, minimumContrastRatio, opacityForContrastCalculation]);
-  const onChangeNonDerivedValueAsHsv = (0, import_react41.useCallback)((nonDerivedValue) => {
-    setNonDerivedValueAsHsv(nonDerivedValue);
-  }, []);
+  const onChangeNonDerivedValueAsHsv = (0, import_react41.useCallback)(
+    (nonDerivedValue) => {
+      const finalValue = shouldEnforceMinContrast ? getAccessibleDerivativeColor(nonDerivedValue) : nonDerivedValue;
+      const finalValueAsHex = (0, import_fn4.formatHex)(finalValue);
+      if (finalValueAsHex !== valueAsHex) {
+        onValueChange(finalValueAsHex);
+      }
+      setValueAsHsv(finalValue);
+      setNonDerivedValueAsHsv(nonDerivedValue);
+    },
+    [getAccessibleDerivativeColor, onValueChange, shouldEnforceMinContrast, valueAsHex]
+  );
   const changeValueSmoothly = (0, import_react41.useCallback)(
     (toHsv) => {
       setIsTransitioning(true);
@@ -10098,6 +10107,7 @@ var ColorPickerProvider = ({
         (colorForStepAsHsv) => {
           const hexValue = (0, import_fn4.formatHex)(colorForStepAsHsv);
           onValueChange(hexValue);
+          setValueAsHsv(colorForStepAsHsv);
         },
         () => {
           setIsTransitioning(false);
@@ -10123,12 +10133,11 @@ var ColorPickerProvider = ({
       valueAsHsv
     ]
   );
-  const whatValuePropShouldBe = shouldEnforceMinContrast ? (0, import_fn4.formatHex)(getAccessibleDerivativeColor((0, import_fn4.formatHex)(nonDerivedValueAsHsv))) : (0, import_fn4.formatHex)(nonDerivedValueAsHsv);
-  (0, import_react41.useEffect)(() => {
-    if (valueAsHex !== whatValuePropShouldBe && !isTransitioning) {
-      onValueChange(whatValuePropShouldBe);
-    }
-  }, [valueAsHex, whatValuePropShouldBe, isTransitioning, onValueChange]);
+  const whatValueAsHexShouldBe = (0, import_fn4.formatHex)(valueAsHsv);
+  if (whatValueAsHexShouldBe !== valueAsHex && !isTransitioning) {
+    setValueAsHsv(convertToHsv(valueAsHex));
+    setNonDerivedValueAsHsv(convertToHsv(valueAsHex));
+  }
   const contextValue = (0, import_react41.useMemo)(
     () => ({
       colorForComparison,