@wistia/vhs 4.0.0 → 4.0.1-beta.269bd1b4.399d50c

package/dist/index.cjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/vhs v4.0.0
+ * @license @wistia/vhs v4.0.1-beta.269bd1b4.399d50c
  *
  * Copyright (c) 2021-2025, Wistia, Inc. and its affiliates.
  *
@@ -3840,7 +3840,7 @@ var normalize = import_styled_components7.css`
   [type='button'],
   [type='reset'],
   [type='submit'] {
-    appearance: button;
+    appearance: auto;
   }
 
   /**
@@ -3950,7 +3950,7 @@ var normalize = import_styled_components7.css`
   */
 
   ::-webkit-file-upload-button {
-    appearance: button; /* 1 */
+    appearance: auto; /* 1 */
     font: inherit; /* 2 */
   }
 
@@ -4070,7 +4070,7 @@ var import_react13 = require("react");
 var import_react12 = require("react");
 var useTimedToggle = (initialValue) => {
   const [value, setValue] = (0, import_react12.useState)(false);
-  const timeoutRef = (0, import_react12.useRef)();
+  const timeoutRef = (0, import_react12.useRef)(void 0);
   const initialValueRef = (0, import_react12.useRef)(initialValue);
   const toggleValue = (timeout2) => {
     clearTimeout(timeoutRef.current);
@@ -4143,8 +4143,8 @@ var isEventTargetSupported = (eventTarget) => (
   Boolean(typeof eventTarget === "object" && eventTarget?.addEventListener)
 );
 var useEvent = (eventName, eventHandler, eventTarget = window, eventOptions = {}) => {
-  const savedEventHandler = (0, import_react15.useRef)();
-  const savedEventOptions = (0, import_react15.useRef)();
+  const savedEventHandler = (0, import_react15.useRef)(void 0);
+  const savedEventOptions = (0, import_react15.useRef)(void 0);
   (0, import_react15.useEffect)(() => {
     savedEventHandler.current = eventHandler;
   }, [eventHandler]);
@@ -4581,7 +4581,7 @@ var usePreventScroll = (locked) => {
 // src/hooks/usePreviousValue/usePreviousValue.ts
 var import_react25 = require("react");
 var usePreviousValue = (value) => {
-  const ref = (0, import_react25.useRef)();
+  const ref = (0, import_react25.useRef)(void 0);
   (0, import_react25.useEffect)(() => {
     ref.current = value;
   });
@@ -4678,7 +4678,7 @@ var ModalBaseContent = ({
   const wasJustShown = usePreviousValue(isShown);
   const hide = () => setIsShownAttempted(false);
   const show = (0, import_react28.useCallback)(() => setIsShownAttempted(true), []);
-  const toggleButtonRef = (0, import_react28.useRef)();
+  const toggleButtonRef = (0, import_react28.useRef)(void 0);
   const modalEl = document.createElement("div");
   modalEl.classList.add("Modal");
   if ((0, import_type_guards11.isNotUndefined)(className)) {
@@ -5109,8 +5109,7 @@ var import_type_guards14 = require("@wistia/type-guards");
 var import_jsx_runtime126 = require("react/jsx-runtime");
 var screenReaderOnlyStyle = import_styled_components15.css`
   border: 0;
-  clip: rect(1px, 1px, 1px, 1px); /* deprecated but remains as fallback */
-  clip-path: inset(50%); /* modern but less support */
+  clip-path: inset(50%);
   height: 1px;
   overflow: hidden;
   padding: 0;
@@ -6756,7 +6755,9 @@ var disabledStyle3 = import_styled_components30.css`
 var errorHoverStyle = import_styled_components30.css`
   border-color: transparent;
 `;
-var errorFocusedStyle = import_styled_components30.css``;
+var errorFocusedStyle = import_styled_components30.css`
+  outline: none;
+`;
 var errorStyle = import_styled_components30.css`
   background-color: ${({ theme: theme2 }) => theme2.color.error100};
   border: 1px solid ${({ theme: theme2 }) => theme2.color.error500};
@@ -7688,7 +7689,7 @@ var import_react43 = require("react");
 var import_react42 = require("react");
 var useTimeoutFunc = (func, timeout2 = 0) => {
   const readyRef = (0, import_react42.useRef)(false);
-  const timeoutRef = (0, import_react42.useRef)();
+  const timeoutRef = (0, import_react42.useRef)(void 0);
   const callbackRef = (0, import_react42.useRef)(func);
   const isReady = (0, import_react42.useCallback)(() => readyRef.current, []);
   const set = (0, import_react42.useCallback)(() => {
@@ -8064,7 +8065,7 @@ FormConnectorCheckboxGroup.displayName = "FormConnectorCheckboxGroup";
 var import_type_guards33 = require("@wistia/type-guards");
 var import_jsx_runtime158 = require("react/jsx-runtime");
 var FormConnectorCustomField = ({
-  customComponent: Element7,
+  customComponent: Element8,
   field,
   form,
   label = "",
@@ -8083,7 +8084,7 @@ var FormConnectorCustomField = ({
       labelProps,
       name,
       children: /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
-        Element7,
+        Element8,
         {
           field,
           form,
@@ -9055,7 +9056,7 @@ var import_styled_components50 = require("styled-components");
 var import_slate_react3 = require("slate-react");
 var import_slate7 = require("slate");
 var import_slate_history = require("slate-history");
-var import_is_hotkey = __toESM(require("is-hotkey"));
+var import_is_hotkey = require("is-hotkey");
 var import_type_guards50 = require("@wistia/type-guards");
 var import_react_fast_compare2 = __toESM(require("react-fast-compare"));
 
@@ -9304,7 +9305,10 @@ var deserializeHTMLNode = (el) => {
     return null;
   }
   const children = getNodeChildren(el, deserializeHTMLNode);
-  const safeChildren = children.length > 0 && children[0] != null ? children : [emptyTextNode];
+  const filteredChildren = children.filter(
+    (child) => child === null || typeof child === "string" || typeof child === "object" && ("text" in child || "type" in child)
+  );
+  const safeChildren = filteredChildren.length > 0 && filteredChildren[0] != null ? filteredChildren : [emptyTextNode];
   if (el.nodeName === "BODY") {
     return (0, import_slate_hyperscript.jsx)("fragment", {}, safeChildren);
   }
@@ -9365,7 +9369,7 @@ var import_slate_react = require("slate-react");
 var import_styled_components48 = require("styled-components");
 var import_jsx_runtime169 = require("react/jsx-runtime");
 var Wrapper = import_styled_components48.styled.span`
-  display: 'inline-block';
+  display: inline-block;
   user-select: none;
 `;
 var Image = import_styled_components48.styled.img`
@@ -9700,7 +9704,7 @@ var handleListEscape = (editor) => {
   const selectedElement = editor.children[selection.anchor.path[0]];
   const isList = selectedElement.type === "bulleted-list" || selectedElement.type === "numbered-list";
   const blockAbove = OverriddenEditor.above(editor, {
-    match: (node) => OverriddenEditor.isBlck(editor, node)
+    match: (node) => import_slate5.Element.isElement(node) && OverriddenEditor.isBlck(editor, node)
   });
   if ((textIsNotSelected ?? false) && isList && isLastChildBlankText(blockAbove[0].children)) {
     import_slate5.Transforms.removeNodes(editor, { hanging: true });
@@ -10192,13 +10196,15 @@ var RichTextEditor = ({
       toggleBlck(editor, "image");
       import_slate7.Transforms.removeNodes(editor, { at: selection });
       import_slate7.Transforms.move(editor, { reverse: true });
-      const spanElement = editor.children.filter((child) => child.type === "span")[0];
+      const spanElement = editor.children.filter(
+        (child) => import_slate7.Element.isElement(child) && child.type === "span"
+      )[0];
       if (import_slate7.Element.isElement(spanElement) && spanElement.type === "span" && (0, import_type_guards50.isNotNil)(spanElement.children) && (0, import_type_guards50.isNotNil)(spanElement.children[0]) && (0, import_type_guards50.isNotNil)(spanElement.children[0].text) && spanElement.children[0].text.trim() !== "") {
         import_slate7.Transforms.setNodes(
           editor,
           { type: "paragraph" },
           {
-            match: (node) => node.type === "span" && (0, import_type_guards50.isNotNil)(node.children) && import_slate7.Text.isText(node.children[0]) && (0, import_type_guards50.isNotNil)(node.children[0].text) && node.children[0].text.trim() !== "",
+            match: (node) => import_slate7.Element.isElement(node) && node.type === "span" && (0, import_type_guards50.isNotNil)(node.children) && import_slate7.Text.isText(node.children[0]) && (0, import_type_guards50.isNotNil)(node.children[0].text) && node.children[0].text.trim() !== "",
             split: true,
             mode: "highest"
           }
@@ -10214,7 +10220,9 @@ var RichTextEditor = ({
         "data-testid": dataTestId,
         disabled,
         height,
-        onClick: () => import_slate_react3.ReactEditor.focus(editor),
+        onClick: () => {
+          import_slate_react3.ReactEditor.focus(editor);
+        },
         children: /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)(
           import_slate_react3.Slate,
           {
@@ -10239,7 +10247,7 @@ var RichTextEditor = ({
                   onBlur: handleEditorBlur,
                   onKeyDown: (event) => {
                     Object.keys(HOTKEYS).forEach((hotKey) => {
-                      if ((0, import_is_hotkey.default)(hotKey, event)) {
+                      if ((0, import_is_hotkey.isHotkey)(hotKey, event)) {
                         event.preventDefault();
                         toggleMark(editor, HOTKEYS[hotKey]);
                       }
@@ -11424,7 +11432,7 @@ var Menu2 = (0, import_react56.forwardRef)(
     onClose,
     ...otherProps
   }, ref) => {
-    const menuRef = (0, import_react56.useRef)();
+    const menuRef = (0, import_react56.useRef)(void 0);
     const onClickOutsideFn = (0, import_type_guards59.isNotNil)(onClickOutside) ? onClickOutside : () => {
     };
     useOnClickOutside(menuRef, onClickOutsideFn);
@@ -12728,7 +12736,7 @@ var setCursorPosition = (ref, start, end) => {
 var getSelectionFromMove = (selection, move, positions) => {
   const currentIndex = positions.findIndex((pos) => pos.start === selection[0]);
   let nextPosition = positions[currentIndex + move];
-  if (nextPosition && nextPosition.type === "skip") {
+  if (nextPosition?.type === "skip") {
     nextPosition = positions[currentIndex + move * 2];
   }
   if (nextPosition) {
@@ -13816,7 +13824,7 @@ var ThumbnailCollageContainer = import_styled_components80.styled.div`
   grid-template-columns: 3fr 2fr;
   grid-template-rows: 1fr 1fr;
   width: 100%;
-  grid-gap: ${({ theme: theme2 }) => theme2.spacing.space01};
+  gap: ${({ theme: theme2 }) => theme2.spacing.space01};
   height: 100%;
 `;
 var CollageImage2 = import_styled_components80.styled.div`