mirror of
https://github.com/zoriya/v10.git
synced 2026-08-16 02:45:09 +00:00
57 lines
2.1 KiB
JavaScript
57 lines
2.1 KiB
JavaScript
"use client";
|
|
import { useLatestRef } from "../../utils/use-latest-ref.js";
|
|
import { useDestroy } from "../../utils/use-destroy.js";
|
|
import { AlertDialogContextProvider } from "./context.js";
|
|
import { useSafeId } from "../../utils/use-safe-id.js";
|
|
import { createAlertDialog, createTransition } from "@videojs/core/dom";
|
|
import { useSnapshot } from "@videojs/store/react";
|
|
import { useEffect, useState } from "react";
|
|
import { jsx } from "react/jsx-runtime";
|
|
import { AlertDialogCore, AlertDialogDataAttrs } from "@videojs/core";
|
|
//#region src/ui/alert-dialog/alert-dialog-root.tsx
|
|
function AlertDialogRoot({ open: controlledOpen, defaultOpen = AlertDialogCore.defaultProps.defaultOpen, onOpenChange: onOpenChangeProp, onOpenChangeComplete: onOpenChangeCompleteProp, children }) {
|
|
const [core] = useState(() => new AlertDialogCore());
|
|
const isControlled = controlledOpen !== void 0;
|
|
const onOpenChangeRef = useLatestRef(onOpenChangeProp);
|
|
const onOpenChangeCompleteRef = useLatestRef(onOpenChangeCompleteProp);
|
|
const [dialog] = useState(() => {
|
|
const instance = createAlertDialog({
|
|
transition: createTransition(),
|
|
onOpenChange: (nextOpen) => {
|
|
onOpenChangeRef.current?.(nextOpen);
|
|
},
|
|
onOpenChangeComplete: (nextOpen) => {
|
|
onOpenChangeCompleteRef.current?.(nextOpen);
|
|
}
|
|
});
|
|
if (!isControlled && defaultOpen) instance.open();
|
|
return instance;
|
|
});
|
|
const titleId = useSafeId("alert-dialog-title");
|
|
const descriptionId = useSafeId("alert-dialog-desc");
|
|
core.setTitleId(titleId);
|
|
core.setDescriptionId(descriptionId);
|
|
useEffect(() => {
|
|
if (controlledOpen === void 0) return;
|
|
const { active: inputOpen } = dialog.input.current;
|
|
if (controlledOpen === inputOpen) return;
|
|
if (controlledOpen) dialog.open();
|
|
else dialog.close();
|
|
}, [controlledOpen, dialog]);
|
|
useDestroy(dialog);
|
|
const input = useSnapshot(dialog.input);
|
|
core.setInput(input);
|
|
return /* @__PURE__ */ jsx(AlertDialogContextProvider, {
|
|
value: {
|
|
core,
|
|
dialog,
|
|
state: core.getState(),
|
|
stateAttrMap: AlertDialogDataAttrs
|
|
},
|
|
children
|
|
});
|
|
}
|
|
//#endregion
|
|
export { AlertDialogRoot };
|
|
|
|
//# sourceMappingURL=alert-dialog-root.js.map
|