@wistia/vhs 4.0.0 → 4.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -1,6 +1,6 @@
1
1
 
2
2
  /*
3
- * @license @wistia/vhs v4.0.0
3
+ * @license @wistia/vhs v4.0.1
4
4
  *
5
5
  * Copyright (c) 2021-2025, Wistia, Inc. and its affiliates.
6
6
  *
@@ -3840,7 +3840,7 @@ var normalize = import_styled_components7.css`
3840
3840
  [type='button'],
3841
3841
  [type='reset'],
3842
3842
  [type='submit'] {
3843
- appearance: button;
3843
+ appearance: auto;
3844
3844
  }
3845
3845
 
3846
3846
  /**
@@ -3950,7 +3950,7 @@ var normalize = import_styled_components7.css`
3950
3950
  */
3951
3951
 
3952
3952
  ::-webkit-file-upload-button {
3953
- appearance: button; /* 1 */
3953
+ appearance: auto; /* 1 */
3954
3954
  font: inherit; /* 2 */
3955
3955
  }
3956
3956
 
@@ -4070,7 +4070,7 @@ var import_react13 = require("react");
4070
4070
  var import_react12 = require("react");
4071
4071
  var useTimedToggle = (initialValue) => {
4072
4072
  const [value, setValue] = (0, import_react12.useState)(false);
4073
- const timeoutRef = (0, import_react12.useRef)();
4073
+ const timeoutRef = (0, import_react12.useRef)(void 0);
4074
4074
  const initialValueRef = (0, import_react12.useRef)(initialValue);
4075
4075
  const toggleValue = (timeout2) => {
4076
4076
  clearTimeout(timeoutRef.current);
@@ -4143,8 +4143,8 @@ var isEventTargetSupported = (eventTarget) => (
4143
4143
  Boolean(typeof eventTarget === "object" && eventTarget?.addEventListener)
4144
4144
  );
4145
4145
  var useEvent = (eventName, eventHandler, eventTarget = window, eventOptions = {}) => {
4146
- const savedEventHandler = (0, import_react15.useRef)();
4147
- const savedEventOptions = (0, import_react15.useRef)();
4146
+ const savedEventHandler = (0, import_react15.useRef)(void 0);
4147
+ const savedEventOptions = (0, import_react15.useRef)(void 0);
4148
4148
  (0, import_react15.useEffect)(() => {
4149
4149
  savedEventHandler.current = eventHandler;
4150
4150
  }, [eventHandler]);
@@ -4581,7 +4581,7 @@ var usePreventScroll = (locked) => {
4581
4581
  // src/hooks/usePreviousValue/usePreviousValue.ts
4582
4582
  var import_react25 = require("react");
4583
4583
  var usePreviousValue = (value) => {
4584
- const ref = (0, import_react25.useRef)();
4584
+ const ref = (0, import_react25.useRef)(void 0);
4585
4585
  (0, import_react25.useEffect)(() => {
4586
4586
  ref.current = value;
4587
4587
  });
@@ -4678,7 +4678,7 @@ var ModalBaseContent = ({
4678
4678
  const wasJustShown = usePreviousValue(isShown);
4679
4679
  const hide = () => setIsShownAttempted(false);
4680
4680
  const show = (0, import_react28.useCallback)(() => setIsShownAttempted(true), []);
4681
- const toggleButtonRef = (0, import_react28.useRef)();
4681
+ const toggleButtonRef = (0, import_react28.useRef)(void 0);
4682
4682
  const modalEl = document.createElement("div");
4683
4683
  modalEl.classList.add("Modal");
4684
4684
  if ((0, import_type_guards11.isNotUndefined)(className)) {
@@ -5109,8 +5109,7 @@ var import_type_guards14 = require("@wistia/type-guards");
5109
5109
  var import_jsx_runtime126 = require("react/jsx-runtime");
5110
5110
  var screenReaderOnlyStyle = import_styled_components15.css`
5111
5111
  border: 0;
5112
- clip: rect(1px, 1px, 1px, 1px); /* deprecated but remains as fallback */
5113
- clip-path: inset(50%); /* modern but less support */
5112
+ clip-path: inset(50%);
5114
5113
  height: 1px;
5115
5114
  overflow: hidden;
5116
5115
  padding: 0;
@@ -6756,7 +6755,9 @@ var disabledStyle3 = import_styled_components30.css`
6756
6755
  var errorHoverStyle = import_styled_components30.css`
6757
6756
  border-color: transparent;
6758
6757
  `;
6759
- var errorFocusedStyle = import_styled_components30.css``;
6758
+ var errorFocusedStyle = import_styled_components30.css`
6759
+ outline: none;
6760
+ `;
6760
6761
  var errorStyle = import_styled_components30.css`
6761
6762
  background-color: ${({ theme: theme2 }) => theme2.color.error100};
6762
6763
  border: 1px solid ${({ theme: theme2 }) => theme2.color.error500};
@@ -7688,7 +7689,7 @@ var import_react43 = require("react");
7688
7689
  var import_react42 = require("react");
7689
7690
  var useTimeoutFunc = (func, timeout2 = 0) => {
7690
7691
  const readyRef = (0, import_react42.useRef)(false);
7691
- const timeoutRef = (0, import_react42.useRef)();
7692
+ const timeoutRef = (0, import_react42.useRef)(void 0);
7692
7693
  const callbackRef = (0, import_react42.useRef)(func);
7693
7694
  const isReady = (0, import_react42.useCallback)(() => readyRef.current, []);
7694
7695
  const set = (0, import_react42.useCallback)(() => {
@@ -8064,7 +8065,7 @@ FormConnectorCheckboxGroup.displayName = "FormConnectorCheckboxGroup";
8064
8065
  var import_type_guards33 = require("@wistia/type-guards");
8065
8066
  var import_jsx_runtime158 = require("react/jsx-runtime");
8066
8067
  var FormConnectorCustomField = ({
8067
- customComponent: Element7,
8068
+ customComponent: Element8,
8068
8069
  field,
8069
8070
  form,
8070
8071
  label = "",
@@ -8083,7 +8084,7 @@ var FormConnectorCustomField = ({
8083
8084
  labelProps,
8084
8085
  name,
8085
8086
  children: /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
8086
- Element7,
8087
+ Element8,
8087
8088
  {
8088
8089
  field,
8089
8090
  form,
@@ -9055,7 +9056,7 @@ var import_styled_components50 = require("styled-components");
9055
9056
  var import_slate_react3 = require("slate-react");
9056
9057
  var import_slate7 = require("slate");
9057
9058
  var import_slate_history = require("slate-history");
9058
- var import_is_hotkey = __toESM(require("is-hotkey"));
9059
+ var import_is_hotkey = require("is-hotkey");
9059
9060
  var import_type_guards50 = require("@wistia/type-guards");
9060
9061
  var import_react_fast_compare2 = __toESM(require("react-fast-compare"));
9061
9062
 
@@ -9304,7 +9305,10 @@ var deserializeHTMLNode = (el) => {
9304
9305
  return null;
9305
9306
  }
9306
9307
  const children = getNodeChildren(el, deserializeHTMLNode);
9307
- const safeChildren = children.length > 0 && children[0] != null ? children : [emptyTextNode];
9308
+ const filteredChildren = children.filter(
9309
+ (child) => child === null || typeof child === "string" || typeof child === "object" && ("text" in child || "type" in child)
9310
+ );
9311
+ const safeChildren = filteredChildren.length > 0 && filteredChildren[0] != null ? filteredChildren : [emptyTextNode];
9308
9312
  if (el.nodeName === "BODY") {
9309
9313
  return (0, import_slate_hyperscript.jsx)("fragment", {}, safeChildren);
9310
9314
  }
@@ -9365,7 +9369,7 @@ var import_slate_react = require("slate-react");
9365
9369
  var import_styled_components48 = require("styled-components");
9366
9370
  var import_jsx_runtime169 = require("react/jsx-runtime");
9367
9371
  var Wrapper = import_styled_components48.styled.span`
9368
- display: 'inline-block';
9372
+ display: inline-block;
9369
9373
  user-select: none;
9370
9374
  `;
9371
9375
  var Image = import_styled_components48.styled.img`
@@ -9700,7 +9704,7 @@ var handleListEscape = (editor) => {
9700
9704
  const selectedElement = editor.children[selection.anchor.path[0]];
9701
9705
  const isList = selectedElement.type === "bulleted-list" || selectedElement.type === "numbered-list";
9702
9706
  const blockAbove = OverriddenEditor.above(editor, {
9703
- match: (node) => OverriddenEditor.isBlck(editor, node)
9707
+ match: (node) => import_slate5.Element.isElement(node) && OverriddenEditor.isBlck(editor, node)
9704
9708
  });
9705
9709
  if ((textIsNotSelected ?? false) && isList && isLastChildBlankText(blockAbove[0].children)) {
9706
9710
  import_slate5.Transforms.removeNodes(editor, { hanging: true });
@@ -10192,13 +10196,15 @@ var RichTextEditor = ({
10192
10196
  toggleBlck(editor, "image");
10193
10197
  import_slate7.Transforms.removeNodes(editor, { at: selection });
10194
10198
  import_slate7.Transforms.move(editor, { reverse: true });
10195
- const spanElement = editor.children.filter((child) => child.type === "span")[0];
10199
+ const spanElement = editor.children.filter(
10200
+ (child) => import_slate7.Element.isElement(child) && child.type === "span"
10201
+ )[0];
10196
10202
  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() !== "") {
10197
10203
  import_slate7.Transforms.setNodes(
10198
10204
  editor,
10199
10205
  { type: "paragraph" },
10200
10206
  {
10201
- 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() !== "",
10207
+ 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() !== "",
10202
10208
  split: true,
10203
10209
  mode: "highest"
10204
10210
  }
@@ -10214,7 +10220,9 @@ var RichTextEditor = ({
10214
10220
  "data-testid": dataTestId,
10215
10221
  disabled,
10216
10222
  height,
10217
- onClick: () => import_slate_react3.ReactEditor.focus(editor),
10223
+ onClick: () => {
10224
+ import_slate_react3.ReactEditor.focus(editor);
10225
+ },
10218
10226
  children: /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)(
10219
10227
  import_slate_react3.Slate,
10220
10228
  {
@@ -10239,7 +10247,7 @@ var RichTextEditor = ({
10239
10247
  onBlur: handleEditorBlur,
10240
10248
  onKeyDown: (event) => {
10241
10249
  Object.keys(HOTKEYS).forEach((hotKey) => {
10242
- if ((0, import_is_hotkey.default)(hotKey, event)) {
10250
+ if ((0, import_is_hotkey.isHotkey)(hotKey, event)) {
10243
10251
  event.preventDefault();
10244
10252
  toggleMark(editor, HOTKEYS[hotKey]);
10245
10253
  }
@@ -11424,7 +11432,7 @@ var Menu2 = (0, import_react56.forwardRef)(
11424
11432
  onClose,
11425
11433
  ...otherProps
11426
11434
  }, ref) => {
11427
- const menuRef = (0, import_react56.useRef)();
11435
+ const menuRef = (0, import_react56.useRef)(void 0);
11428
11436
  const onClickOutsideFn = (0, import_type_guards59.isNotNil)(onClickOutside) ? onClickOutside : () => {
11429
11437
  };
11430
11438
  useOnClickOutside(menuRef, onClickOutsideFn);
@@ -12728,7 +12736,7 @@ var setCursorPosition = (ref, start, end) => {
12728
12736
  var getSelectionFromMove = (selection, move, positions) => {
12729
12737
  const currentIndex = positions.findIndex((pos) => pos.start === selection[0]);
12730
12738
  let nextPosition = positions[currentIndex + move];
12731
- if (nextPosition && nextPosition.type === "skip") {
12739
+ if (nextPosition?.type === "skip") {
12732
12740
  nextPosition = positions[currentIndex + move * 2];
12733
12741
  }
12734
12742
  if (nextPosition) {
@@ -13816,7 +13824,7 @@ var ThumbnailCollageContainer = import_styled_components80.styled.div`
13816
13824
  grid-template-columns: 3fr 2fr;
13817
13825
  grid-template-rows: 1fr 1fr;
13818
13826
  width: 100%;
13819
- grid-gap: ${({ theme: theme2 }) => theme2.spacing.space01};
13827
+ gap: ${({ theme: theme2 }) => theme2.spacing.space01};
13820
13828
  height: 100%;
13821
13829
  `;
13822
13830
  var CollageImage2 = import_styled_components80.styled.div`