@wistia/ui 0.26.7 → 0.26.8-beta.650350ed.cb482b8

package/dist/index.js

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.26.7
+ * @license @wistia/ui v0.26.8-beta.650350ed.cb482b8
  *
  * Copyright (c) 2024-2026, Wistia, Inc. and its affiliates.
  *
@@ -431,9 +431,8 @@ const AriaLiveProvider = ({ children, debug = false }) => {
 			setTimeout(() => setMessage(null), 1e3);
 		}
 	}, []);
-	const value = useMemo(() => ({ announce }), [announce]);
-	return /* @__PURE__ */ jsx(AriaLiveContext.Provider, {
-		value,
+	return /* @__PURE__ */ jsx(AriaLiveContext, {
+		value: useMemo(() => ({ announce }), [announce]),
 		children
 	});
 };
@@ -451,7 +450,7 @@ const ToastProvider = () => /* @__PURE__ */ jsx(Toaster, { ...toastConfig });
 const UIProviderNestingContext = createContext(false);
 const UIProvider = ({ children }) => {
 	if (useContext(UIProviderNestingContext)) return /* @__PURE__ */ jsx(Fragment, { children });
-	return /* @__PURE__ */ jsx(UIProviderNestingContext.Provider, {
+	return /* @__PURE__ */ jsx(UIProviderNestingContext, {
 		value: true,
 		children: /* @__PURE__ */ jsx(AriaLiveProvider, { children: /* @__PURE__ */ jsxs(Tooltip$1.Provider, { children: [
 			/* @__PURE__ */ jsx(GlobalStyle, {}),
@@ -497,16 +496,10 @@ const millisecondsInDay = 1440 * 60 * milisecondsInSecond;
 //#endregion
 //#region src/helpers/dateTime/buildTimeDuration.ts
 /**
-* @typedef {Object} Duration
-* @property {number} seconds - number of seconds
-* @property {number} minutes - number of minutes
-* @property {number} hours - number of hours
-*/
-/**
 * Returns an object representing the duration in seconds, minutes and hours.
 *
 * @param {number} numberOfMilliseconds - number of milliseconds
-* @returns {Duration} -
+* @returns {TimeDuration} -
 */
 const buildTimeDuration = (numberOfMilliseconds) => {
 	const numberOfSeconds = Math.floor(numberOfMilliseconds / milisecondsInSecond);
@@ -7144,23 +7137,22 @@ const Form = ({ children, action, values = {}, labelPosition = "block", validate
 		if (props.onReset) props.onReset(event);
 		if (action) action(null);
 	};
-	const context = useMemo(() => {
-		return {
+	return /* @__PURE__ */ jsx(FormContext, {
+		value: useMemo(() => {
+			return {
+				values,
+				errors,
+				hasSubmitted,
+				formId: id,
+				labelPosition
+			};
+		}, [
+			labelPosition,
 			values,
 			errors,
-			hasSubmitted,
-			formId: id,
-			labelPosition
-		};
-	}, [
-		labelPosition,
-		values,
-		errors,
-		id,
-		hasSubmitted
-	]);
-	return /* @__PURE__ */ jsx(FormContext.Provider, {
-		value: context,
+			id,
+			hasSubmitted
+		]),
 		children: /* @__PURE__ */ jsx(Stack, {
 			...props,
 			ref,
@@ -7191,19 +7183,18 @@ const useCheckboxGroup = () => {
 const CheckboxGroup = ({ children, name, onChange, value, ...props }) => {
 	const formState = useContext(FormContext);
 	const derivedValue = isArray(formState.values[name]) ? formState.values[name] : value;
-	const context = useMemo(() => {
-		return {
-			name: `${name}[]`,
-			onChange,
-			value: derivedValue
-		};
-	}, [
-		name,
-		derivedValue,
-		onChange
-	]);
-	return /* @__PURE__ */ jsx(CheckboxGroupContext.Provider, {
-		value: context,
+	return /* @__PURE__ */ jsx(CheckboxGroupContext, {
+		value: useMemo(() => {
+			return {
+				name: `${name}[]`,
+				onChange,
+				value: derivedValue
+			};
+		}, [
+			name,
+			derivedValue,
+			onChange
+		]),
 		children: /* @__PURE__ */ jsx(FormGroup, {
 			...props,
 			children
@@ -7848,41 +7839,40 @@ const ColorPickerProvider = ({ children, colorForComparison, minimumContrastRati
 		valueAsHsvConvertedToHex,
 		whatValueAsHexShouldBe
 	]);
-	const contextValue = useMemo(() => ({
-		colorForComparison,
-		currentContrastRatio,
-		getAccessibleDerivativeColor,
-		hasAccessibleDerivatives: hasAccessibleDerivativesValue,
-		isDragging,
-		isTransitioning,
-		minimumContrastRatio,
-		nonDerivedValueAsHex: formatHex(nonDerivedValueAsHsv),
-		nonDerivedValueAsHsv,
-		onChangeNonDerivedValueAsHsv,
-		opacityForContrastCalculation,
-		setIsDragging,
-		setShouldEnforceMinContrast: setShouldEnforceMinContrastWrapped,
-		shouldEnforceMinContrast,
-		valueAsHex,
-		valueAsHsv
-	}), [
-		colorForComparison,
-		currentContrastRatio,
-		getAccessibleDerivativeColor,
-		hasAccessibleDerivativesValue,
-		isDragging,
-		isTransitioning,
-		minimumContrastRatio,
-		nonDerivedValueAsHsv,
-		onChangeNonDerivedValueAsHsv,
-		opacityForContrastCalculation,
-		setShouldEnforceMinContrastWrapped,
-		shouldEnforceMinContrast,
-		valueAsHex,
-		valueAsHsv
-	]);
-	return /* @__PURE__ */ jsx(ColorPickerContext.Provider, {
-		value: contextValue,
+	return /* @__PURE__ */ jsx(ColorPickerContext, {
+		value: useMemo(() => ({
+			colorForComparison,
+			currentContrastRatio,
+			getAccessibleDerivativeColor,
+			hasAccessibleDerivatives: hasAccessibleDerivativesValue,
+			isDragging,
+			isTransitioning,
+			minimumContrastRatio,
+			nonDerivedValueAsHex: formatHex(nonDerivedValueAsHsv),
+			nonDerivedValueAsHsv,
+			onChangeNonDerivedValueAsHsv,
+			opacityForContrastCalculation,
+			setIsDragging,
+			setShouldEnforceMinContrast: setShouldEnforceMinContrastWrapped,
+			shouldEnforceMinContrast,
+			valueAsHex,
+			valueAsHsv
+		}), [
+			colorForComparison,
+			currentContrastRatio,
+			getAccessibleDerivativeColor,
+			hasAccessibleDerivativesValue,
+			isDragging,
+			isTransitioning,
+			minimumContrastRatio,
+			nonDerivedValueAsHsv,
+			onChangeNonDerivedValueAsHsv,
+			opacityForContrastCalculation,
+			setShouldEnforceMinContrastWrapped,
+			shouldEnforceMinContrast,
+			valueAsHex,
+			valueAsHsv
+		]),
 		children
 	});
 };
@@ -9949,7 +9939,7 @@ const Menu = ({ align = "start", children, disabled = false, compact = false, tr
 		open: false,
 		onOpenChange: () => null
 	};
-	return /* @__PURE__ */ jsx(MenuContext.Provider, {
+	return /* @__PURE__ */ jsx(MenuContext, {
 		value: contextValue,
 		children: /* @__PURE__ */ jsxs(Menu$1.Root, {
 			modal: false,
@@ -10028,7 +10018,7 @@ const ContextMenu = ({ position, triggerRef, children, side = "bottom", onReques
 		setIsRightClicked(next);
 		if (!next) onRequestClose();
 	};
-	const menu = /* @__PURE__ */ jsx(MenuContext.Provider, {
+	const menu = /* @__PURE__ */ jsx(MenuContext, {
 		value: contextValue,
 		children: /* @__PURE__ */ jsx(ContextMenu$1.Root, {
 			onOpenChange: handleOpenChange,
@@ -10662,7 +10652,7 @@ const EditableTextRoot = ({ children, defaultValue = "", value: controlledValue,
 		"data-wui-editable-text-root": true,
 		"data-wui-editable-text-state": getState(),
 		...props,
-		children: /* @__PURE__ */ jsx(EditableTextContext.Provider, {
+		children: /* @__PURE__ */ jsx(EditableTextContext, {
 			value: context,
 			children
 		})
@@ -11378,21 +11368,21 @@ const useRadioGroup = () => {
 const RadioGroup = ({ children, name, onChange, value, ...props }) => {
 	const formState = useContext(FormContext);
 	const derivedValue = typeof formState.values[name] === "string" ? formState.values[name] : value;
-	const context = useMemo(() => {
-		return {
+	return /* @__PURE__ */ jsx(RadioGroupContext, {
+		value: useMemo(() => {
+			return {
+				name,
+				onChange,
+				value: derivedValue
+			};
+		}, [
 			name,
-			onChange,
-			value: derivedValue
-		};
-	}, [
-		name,
-		derivedValue,
-		onChange
-	]);
-	return /* @__PURE__ */ jsx(RadioGroupContext.Provider, {
-		value: context,
+			derivedValue,
+			onChange
+		]),
 		children: /* @__PURE__ */ jsx(FormGroup, {
 			...props,
+			role: "radiogroup",
 			children
 		})
 	});
@@ -13743,7 +13733,7 @@ Popover.displayName = "Popover_UI";
 //#endregion
 //#region src/components/Popover/PopoverAnchorContext.tsx
 const PopoverAnchorContext = createContext(null);
-const PopoverAnchorProvider = PopoverAnchorContext.Provider;
+const PopoverAnchorProvider = PopoverAnchorContext;
 const usePopoverAnchor = () => useContext(PopoverAnchorContext);
 const useCreatePopoverAnchorRef = () => useRef(null);
 //#endregion
@@ -14451,12 +14441,11 @@ const SelectedItemStyleProvider = ({ children }) => {
 		transform: `translateX(${selectedItemMeasurements.offsetLeft}px) translateY(-50%)`,
 		width: `${selectedItemMeasurements.offsetWidth}px`
 	} : void 0, [selectedItemMeasurements]);
-	const contextValue = useMemo(() => ({
-		setSelectedItemMeasurements,
-		selectedItemIndicatorStyle
-	}), [selectedItemIndicatorStyle]);
-	return /* @__PURE__ */ jsx(SelectedItemStyleContext.Provider, {
-		value: contextValue,
+	return /* @__PURE__ */ jsx(SelectedItemStyleContext, {
+		value: useMemo(() => ({
+			setSelectedItemMeasurements,
+			selectedItemIndicatorStyle
+		}), [selectedItemIndicatorStyle]),
 		children
 	});
 };
@@ -14468,7 +14457,7 @@ const useSelectedItemStyle = () => {
 //#endregion
 //#region src/components/SegmentedControl/useSegmentedControlValue.tsx
 const SegmentedControlValueContext = createContext(null);
-const SegmentedControlValueProvider = SegmentedControlValueContext.Provider;
+const SegmentedControlValueProvider = SegmentedControlValueContext;
 const useSegmentedControlValue = () => {
 	const context = useContext(SegmentedControlValueContext);
 	if (context === null) throw new Error("useSegmentedControlValue must be used within a SegmentedControlValueProvider");
@@ -15310,7 +15299,7 @@ const StyledTableBody = styled.tbody`
   width: 100%;
 `;
 const TableBody = ({ children, ...props }) => {
-	return /* @__PURE__ */ jsx(TableSectionContext.Provider, {
+	return /* @__PURE__ */ jsx(TableSectionContext, {
 		value: "body",
 		children: /* @__PURE__ */ jsx(StyledTableBody, {
 			...props,
@@ -15353,7 +15342,7 @@ const StyledTableFoot = styled.tfoot`
   width: 100%;
 `;
 const TableFoot = ({ children, ...props }) => {
-	return /* @__PURE__ */ jsx(TableSectionContext.Provider, {
+	return /* @__PURE__ */ jsx(TableSectionContext, {
 		value: "footer",
 		children: /* @__PURE__ */ jsx(StyledTableFoot, {
 			...props,
@@ -15367,7 +15356,7 @@ const StyledThead = styled.thead`
   width: 100%;
 `;
 const TableHead = ({ children, ...props }) => {
-	return /* @__PURE__ */ jsx(TableSectionContext.Provider, {
+	return /* @__PURE__ */ jsx(TableSectionContext, {
 		value: "head",
 		children: /* @__PURE__ */ jsx(StyledThead, {
 			...props,
@@ -15389,7 +15378,7 @@ const TableRow = ({ children, ...props }) => {
 //#endregion
 //#region src/components/Tabs/useTabsValue.tsx
 const TabsValueContext = createContext(null);
-const TabsValueProvider = TabsValueContext.Provider;
+const TabsValueProvider = TabsValueContext;
 const useTabsValue = () => {
 	const context = useContext(TabsValueContext);
 	if (context === null) throw new Error("useTabsValue must be used within a TabsValueProvider");