@wavemaker-ai/react-runtime 1.0.0-next.27766

package/components/basic/tree/utils.d.ts

@@ -0,0 +1,54 @@
+import { type StorageType } from "@wavemaker-ai/react-runtime/utils/state-persistance";
+import { TreeNodeData, TreeItem, TreePartialNodeApi, TreeUrlState } from "./props";
+/** Whether the dataset row (`node.data`) is disabled via its `disabled` property. */
+export declare const isTreeNodeDisabled: (data: TreeNodeData | undefined | null) => boolean;
+export declare const getNestedPropertyLocal: (obj: any, path: string) => any;
+export declare const generateUniqueNodeId: (baseId: string, usedNodeIds: Set<string>) => string;
+export declare const processNode: (item: TreeNodeData, depth: number, parent: TreeItem | undefined, rootDataset: any[] | undefined, nodeIndex: number | undefined, treeName: string | undefined, options: {
+    levels: number;
+    nodelabel: string;
+    nodeicon: string;
+    nodechildren: string;
+    nodeid: string;
+    generateUniqueNodeId: (baseId: string) => string;
+}) => TreeItem;
+export declare const findNodeById: (nodes: TreeItem[], id: string) => TreeItem | null;
+/**
+ * Toggle `open` on the node matching `nodeId` using the **current** tree snapshot.
+ * Used so partial templates can expand/collapse by id even when the passed-in `TreeItem`
+ */
+export declare const toggleExpansionInTree: (nodes: TreeItem[], nodeId: string) => TreeItem[];
+/** Migrate legacy `{ id, open, parentNode }` URL payloads to an `expanded` id list. */
+export declare const migrateLegacyTreeUrlState: (raw: TreeUrlState | null | undefined) => string[];
+/**
+ * Ensures all ancestors of every expanded id are included so nested paths reopen after refresh.
+ */
+export declare const normalizeExpandedIds: (tree: TreeItem[], expandedIds: Iterable<string>) => Set<string>;
+/**
+ * Node ids that are expanded **in the visible tree** (parent chain must be open / pre-open).
+ * Descendants of a collapsed branch are omitted even if `open` flags were left true internally.
+ */
+export declare const collectExpandedNodeIdsForUrl: (nodes: TreeItem[]) => string[];
+export declare const saveTreeState: (name: string, storage: StorageType, stateToSave: Partial<TreeUrlState> | null) => void;
+export declare const getTreeState: (name: string, storage: StorageType) => TreeUrlState | null;
+export declare const clearTreeState: (name: string, storage: StorageType) => void;
+/**
+ * Dataset row fields for `pageParams.item` (no methods — those are merged in the hook as {@link TreePartialNodeApi}).
+ */
+export declare const getTreePartialRowPayload: (node: TreeItem) => Record<string, unknown>;
+/**
+ * Depth of the node from the tree root (root depth = 0).
+ */
+export declare const computeTreeNodeDepthFromRoot: (node: TreeItem) => number;
+/**
+ * Slash-separated path from root to this node (`/a/b/c`).
+ */
+export declare const buildTreePathFromRoot: (node: TreeItem) => string;
+/**
+ * Plain zTree-shaped snapshot for `item._node`. Nested `children` are data-only; methods are merged in {@link useTreePartialNodeApi}.
+ */
+export declare const buildTreePartialSnapshot: (node: TreeItem, selectedTreeNodeId: string | null | undefined) => Record<string, unknown>;
+/**
+ * Full `item` for wm-tree partials (`params: ['item']`).
+ */
+export declare const assembleTreePartialItem: (node: TreeItem, partialNodeApi: TreePartialNodeApi) => Record<string, unknown>;

package/components/basic/tree/utils.js

@@ -0,0 +1,327 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import isArray from "lodash-es/isArray";
+import cloneDeep from "lodash-es/cloneDeep";
+import get from "lodash-es/get";
+import {
+  clearWidgetState,
+  getWidgetState,
+  setWidgetState
+} from "../../../utils/state-persistance";
+const isTreeNodeDisabled = (data) => {
+  if (!data) return false;
+  const disabled_node = data.disabled;
+  if (disabled_node === false || disabled_node === "false") {
+    return false;
+  }
+  return Boolean(disabled_node);
+};
+const getNestedPropertyLocal = (obj, path) => {
+  if (!path || !obj) return void 0;
+  try {
+    const normalizedPath = path.replace(/\[(\d+)\]/g, ".$1").replace(/^\./, "");
+    return get(obj, normalizedPath);
+  } catch (error) {
+    return void 0;
+  }
+};
+const generateUniqueNodeId = (baseId, usedNodeIds) => {
+  let uniqueId = baseId;
+  let counter = 1;
+  while (usedNodeIds.has(uniqueId)) {
+    uniqueId = `${baseId}_${counter}`;
+    counter++;
+  }
+  usedNodeIds.add(uniqueId);
+  return uniqueId;
+};
+const processNode = (item, depth, parent, rootDataset, nodeIndex, treeName, options) => {
+  const { levels, nodelabel, nodeicon, nodechildren, nodeid, generateUniqueNodeId: generateUniqueNodeId2 } = options;
+  const getLabelValue = () => {
+    var _a, _b, _c, _d;
+    if (nodelabel && (nodelabel.includes("[") || nodelabel.includes("."))) {
+      const currentItemValue = getNestedPropertyLocal(item, nodelabel);
+      if (currentItemValue !== void 0) {
+        return currentItemValue;
+      }
+    }
+    return (_d = (_c = (_b = (_a = item[nodelabel]) != null ? _a : item.label) != null ? _b : item.name) != null ? _c : String(item)) != null ? _d : nodelabel;
+  };
+  const getIconValue = () => {
+    var _a, _b;
+    if (nodeicon && (nodeicon.includes("[") || nodeicon.includes("."))) {
+      const currentItemValue = getNestedPropertyLocal(item, nodeicon);
+      if (currentItemValue !== void 0) {
+        return currentItemValue;
+      }
+    }
+    return (_b = (_a = item[nodeicon]) != null ? _a : item.icon) != null ? _b : nodeicon;
+  };
+  const getNodeIdValue = () => {
+    var _a, _b;
+    if (nodeid && (nodeid.includes("[") || nodeid.includes("."))) {
+      const currentItemValue = getNestedPropertyLocal(item, nodeid);
+      if (currentItemValue !== void 0) {
+        return String(currentItemValue);
+      }
+      return void 0;
+    }
+    const directValue = item[nodeid];
+    if (directValue !== void 0) {
+      return String(directValue);
+    }
+    if (!nodeid) {
+      const fallbackId = (_b = (_a = item.nodeId) != null ? _a : item.id) != null ? _b : `node_${Date.now()}_${Math.random()}`;
+      return String(fallbackId);
+    }
+    return void 0;
+  };
+  const getChildrenValue = () => {
+    if (nodechildren && (nodechildren.includes("[") || nodechildren.includes("."))) {
+      const currentItemValue = getNestedPropertyLocal(item, nodechildren);
+      if (currentItemValue !== void 0) {
+        return currentItemValue;
+      }
+    }
+    return item[nodechildren] || item.children;
+  };
+  const labelValue = getLabelValue();
+  const iconValue = getIconValue();
+  const nodeIdValue = getNodeIdValue();
+  const childrenData = getChildrenValue();
+  const finalNodeId = nodeIdValue || generateUniqueNodeId2(`node_${Date.now()}_${nodeIndex || 0}`);
+  const node = {
+    name: String(labelValue || ""),
+    label: String(labelValue || ""),
+    icon: iconValue,
+    nodeId: String(finalNodeId),
+    data: cloneDeep(item),
+    open: depth < levels,
+    checked: item.checked || false,
+    parent,
+    tId: treeName ? `${treeName}_${finalNodeId}` : `tree_node_${finalNodeId}`,
+    isParent: isArray(childrenData) && childrenData.length > 0
+  };
+  if (isArray(childrenData) && childrenData.length > 0) {
+    node.children = childrenData.map(
+      (child, index) => processNode(child, depth + 1, node, rootDataset, index, treeName, options)
+    );
+  }
+  return node;
+};
+const findNodeById = (nodes, id) => {
+  var _a;
+  for (const node of nodes) {
+    if (String(node.nodeId) === String(id)) return node;
+    if ((_a = node.children) == null ? void 0 : _a.length) {
+      const found = findNodeById(node.children, id);
+      if (found) return found;
+    }
+  }
+  return null;
+};
+const toggleExpansionInTree = (nodes, nodeId) => {
+  return nodes.map((n) => {
+    var _a;
+    if (n.nodeId === nodeId) {
+      return __spreadProps(__spreadValues({}, n), { open: !n.open });
+    }
+    if ((_a = n.children) == null ? void 0 : _a.length) {
+      return __spreadProps(__spreadValues({}, n), { children: toggleExpansionInTree(n.children, nodeId) });
+    }
+    return n;
+  });
+};
+const migrateLegacyTreeUrlState = (raw) => {
+  if (!raw || typeof raw !== "object") return [];
+  if (Array.isArray(raw.expanded) && raw.expanded.length) {
+    return raw.expanded.map((id) => String(id));
+  }
+  const ids = /* @__PURE__ */ new Set();
+  if (Array.isArray(raw.parentNode)) {
+    for (const x of raw.parentNode) {
+      if (x != null && x !== "") ids.add(String(x));
+    }
+  }
+  if (raw.open && raw.id != null && raw.id !== "") {
+    ids.add(String(raw.id));
+  }
+  return [...ids];
+};
+const normalizeExpandedIds = (tree, expandedIds) => {
+  const set = /* @__PURE__ */ new Set();
+  for (const id of expandedIds) {
+    if (id == null || id === "") continue;
+    const node = findNodeById(tree, String(id));
+    if (!node) continue;
+    let current = node;
+    while (current) {
+      set.add(String(current.nodeId));
+      current = current.parent;
+    }
+  }
+  return set;
+};
+const collectExpandedNodeIdsForUrl = (nodes) => {
+  const out = [];
+  const walk = (list, branchOpen) => {
+    var _a;
+    for (const n of list) {
+      if (!branchOpen) continue;
+      if (n.open) {
+        out.push(n.nodeId);
+        if ((_a = n.children) == null ? void 0 : _a.length) {
+          walk(n.children, true);
+        }
+      }
+    }
+  };
+  walk(nodes, true);
+  return out;
+};
+const encodeNodeIdForUrl = (id) => {
+  try {
+    return btoa(unescape(encodeURIComponent(id))).replace(/=+$/, "");
+  } catch (e) {
+    return id;
+  }
+};
+const decodeNodeIdFromUrl = (token) => {
+  try {
+    return decodeURIComponent(escape(atob(token)));
+  } catch (e) {
+    return token;
+  }
+};
+const toTreeStatePayload = (storage, state) => {
+  var _a;
+  if (storage !== "URL") return state;
+  const out = {};
+  if ((_a = state.expanded) == null ? void 0 : _a.length) {
+    out.expanded = [...new Set(state.expanded.map(String))].map(encodeNodeIdForUrl);
+  }
+  if (state.selected) out.selected = encodeNodeIdForUrl(String(state.selected));
+  return out;
+};
+const fromTreeStatePayload = (storage, raw) => {
+  var _a, _b;
+  if (raw == null || typeof raw !== "object" || Array.isArray(raw)) return null;
+  const state = raw;
+  if (storage !== "URL") return state;
+  const out = {};
+  if ((_a = state.expanded) == null ? void 0 : _a.length) {
+    out.expanded = [...new Set(state.expanded.map((id) => decodeNodeIdFromUrl(String(id))))];
+  }
+  if (state.selected) out.selected = decodeNodeIdFromUrl(String(state.selected));
+  return ((_b = out.expanded) == null ? void 0 : _b.length) || out.selected ? out : null;
+};
+const saveTreeState = (name, storage, stateToSave) => {
+  const config = { name, type: "tree", storage };
+  if (stateToSave == null) {
+    clearWidgetState(config);
+    return;
+  }
+  if (storage === "URL") {
+    clearWidgetState(config);
+  }
+  setWidgetState(config, toTreeStatePayload(storage, stateToSave));
+};
+const getTreeState = (name, storage) => {
+  return fromTreeStatePayload(storage, getWidgetState({ name, type: "tree", storage }));
+};
+const clearTreeState = (name, storage) => {
+  clearWidgetState({ name, type: "tree", storage });
+};
+const getTreePartialRowPayload = (node) => {
+  var _a;
+  const raw = node.data;
+  const row = raw && typeof raw === "object" && !Array.isArray(raw) ? __spreadValues({}, raw) : {};
+  return __spreadProps(__spreadValues({}, row), {
+    name: (_a = node.label) != null ? _a : node.name
+  });
+};
+const computeTreeNodeDepthFromRoot = (node) => {
+  let depthFromRoot = 0;
+  let ancestor = node.parent;
+  while (ancestor) {
+    depthFromRoot += 1;
+    ancestor = ancestor.parent;
+  }
+  return depthFromRoot;
+};
+const buildTreePathFromRoot = (node) => {
+  if (!node) return "";
+  const segments = [];
+  let current = node;
+  while (current) {
+    segments.unshift(current.name);
+    current = current.parent;
+  }
+  return `/${segments.join("/")}`;
+};
+const buildTreePartialSnapshot = (node, selectedTreeNodeId) => {
+  var _a, _b, _c, _d, _e, _f, _g;
+  const siblings = (_a = node.parent) == null ? void 0 : _a.children;
+  const rawSiblingIndex = (siblings == null ? void 0 : siblings.length) ? siblings.findIndex((child) => String(child.nodeId) === String(node.nodeId)) : 0;
+  const siblingIndex = rawSiblingIndex < 0 ? 0 : rawSiblingIndex;
+  const level = computeTreeNodeDepthFromRoot(node);
+  const hasChildren = !!(node.children && node.children.length > 0);
+  const selectedId = selectedTreeNodeId != null ? String(selectedTreeNodeId) : "";
+  return {
+    data: node.data,
+    nodeId: node.nodeId,
+    parentId: (_c = (_b = node.parent) == null ? void 0 : _b.nodeId) != null ? _c : null,
+    tId: (_d = node.tId) != null ? _d : "",
+    name: (_e = node.name) != null ? _e : "",
+    label: (_f = node.label) != null ? _f : "",
+    level,
+    children: hasChildren ? node.children.map((child) => buildTreePartialSnapshot(child, selectedTreeNodeId)) : [],
+    isParent: hasChildren,
+    isFirstNode: siblings ? siblingIndex === 0 : true,
+    isLastNode: siblings ? siblingIndex === ((_g = siblings == null ? void 0 : siblings.length) != null ? _g : 1) - 1 : true,
+    open: !!node.open,
+    checked: !!node.checked,
+    checkedOld: !!node.checked,
+    isSelected: selectedId !== "" && selectedId === String(node.nodeId)
+  };
+};
+const assembleTreePartialItem = (node, partialNodeApi) => __spreadProps(__spreadValues({}, getTreePartialRowPayload(node)), {
+  node: partialNodeApi,
+  _node: partialNodeApi
+});
+export {
+  assembleTreePartialItem,
+  buildTreePartialSnapshot,
+  buildTreePathFromRoot,
+  clearTreeState,
+  collectExpandedNodeIdsForUrl,
+  computeTreeNodeDepthFromRoot,
+  findNodeById,
+  generateUniqueNodeId,
+  getNestedPropertyLocal,
+  getTreePartialRowPayload,
+  getTreeState,
+  isTreeNodeDisabled,
+  migrateLegacyTreeUrlState,
+  normalizeExpandedIds,
+  processNode,
+  saveTreeState,
+  toggleExpansionInTree
+};

package/components/basic/video/index.d.ts

@@ -0,0 +1,82 @@
+import React from "react";
+import { WmVideoProps } from "./props";
+export declare const WmVideo: React.MemoExoticComponent<(props: WmVideoProps) => import("react/jsx-runtime").JSX.Element>;
+/**
+ * The WmVideo component is used to play video files in various formats (MP4, WebM, OGG).
+ * It supports subtitles, posters, and various playback controls.
+ *
+ * - [Playground](https://react-components.wavemaker.ai/?path=/story/basic-video--showcase)
+ *
+ * - [Docs](https://react-components.wavemaker.ai/?path=/story/basic-video--docs)
+ *
+ * @param props - {@link WmVideoProps}
+ */
+declare const _default: React.ComponentType<{
+    autoplay?: boolean;
+    variant?: "standard";
+    controls?: boolean;
+    loop?: boolean;
+    muted?: boolean;
+    oggformat?: string;
+    poster?: string;
+    mp4format?: string;
+    subtitlelang?: string;
+    subtitlesource?: string;
+    videosupportmessage?: string;
+    videopreload?: "auto" | "metadata" | "none";
+    webmformat?: string;
+    prefabName?: string;
+    id?: string;
+    videoposter?: string;
+    standalone?: boolean;
+    ref?: React.RefObject<HTMLElement> | React.RefObject<null>;
+    animation?: string;
+    show?: boolean | string;
+    padding?: string;
+    margin?: string;
+    width?: number | string;
+    height?: number | string;
+    className?: string;
+    conditionalstyle?: React.CSSProperties;
+    conditionalclass?: string;
+    showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];
+    onClick?: (event?: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onDoubleClick?: (event: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onMouseEnter?: (event: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onMouseLeave?: (event: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onMouseOver?: (event: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onMouseOut?: (event: React.MouseEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onFocus?: (event: React.FocusEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onBlur?: (event: React.FocusEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onKeydown?: (event: React.KeyboardEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onKeyup?: (event: React.KeyboardEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    onKeypress?: (event: React.KeyboardEvent<HTMLElement>, widget?: Record<string, any>, newVal?: string | number | null, oldVal?: string | number | null) => void;
+    eventCallback?: (eventName: string, data: any) => void;
+    forwardedRef?: React.ForwardedRef<any>;
+    viewParent?: any;
+    destroy?: ((names: string[]) => void) | ((formName?: string) => void);
+    hint?: string;
+    arialabel?: string;
+    tabindex?: number;
+    styles?: React.CSSProperties;
+    children?: React.ReactNode;
+    hidden?: boolean;
+    name?: string;
+    listener?: Record<string, any>;
+    "data-widget-id"?: string;
+    iswidget?: boolean | string;
+    deferload?: boolean | string;
+    "item-id"?: string;
+    datavalue?: any;
+    prefab?: boolean;
+    inbound?: Record<string, any>;
+    outbound?: Record<string, any>;
+    key?: string;
+    formfield?: boolean;
+    updateon?: string;
+    dataset?: any;
+    loading?: boolean;
+    showSkeleton?: boolean;
+    widget?: string;
+}>;
+export default _default;

package/components/basic/video/index.js

@@ -0,0 +1,162 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { jsx, jsxs } from "react/jsx-runtime";
+import { memo, useMemo } from "react";
+import clsx from "clsx";
+import Box from "@mui/material/Box";
+import { withBaseWrapper } from "../../../higherOrder/withBaseWrapper";
+import { prefixPrefabResourceUrl } from "../../../utils/resource-url";
+import { removeInvalidAttributes } from "../../../utils/attr";
+const DEFAULT_CLASS = "app-video";
+const WmVideo = memo(
+  (props) => {
+    const _a = props, {
+      subtitlelang = "en",
+      videoposter = "resources/images/imagelists/default-image.png",
+      className,
+      controls,
+      muted,
+      loop,
+      autoplay,
+      videopreload,
+      tabindex,
+      hint,
+      arialabel,
+      styles,
+      name,
+      mp4format,
+      webmformat,
+      oggformat,
+      subtitlesource,
+      videosupportmessage,
+      prefabName
+    } = _a, restProps = __objRest(_a, [
+      "subtitlelang",
+      "videoposter",
+      "className",
+      "controls",
+      "muted",
+      "loop",
+      "autoplay",
+      "videopreload",
+      "tabindex",
+      "hint",
+      "arialabel",
+      "styles",
+      "name",
+      "mp4format",
+      "webmformat",
+      "oggformat",
+      "subtitlesource",
+      "videosupportmessage",
+      "prefabName"
+    ]);
+    const computedPoster = useMemo(
+      () => prefixPrefabResourceUrl(videoposter, prefabName),
+      [videoposter, prefabName]
+    );
+    const computedMp4 = useMemo(
+      () => prefixPrefabResourceUrl(mp4format || "", prefabName),
+      [mp4format, prefabName]
+    );
+    const computedWebm = useMemo(
+      () => prefixPrefabResourceUrl(webmformat || "", prefabName),
+      [webmformat, prefabName]
+    );
+    const computedOgg = useMemo(
+      () => prefixPrefabResourceUrl(oggformat || "", prefabName),
+      [oggformat, prefabName]
+    );
+    const computedSubtitles = useMemo(
+      () => prefixPrefabResourceUrl(subtitlesource || "", prefabName),
+      [subtitlesource, prefabName]
+    );
+    return /* @__PURE__ */ jsx(
+      Box,
+      __spreadProps(__spreadValues({
+        className: clsx(DEFAULT_CLASS, className),
+        title: hint,
+        "aria-label": arialabel,
+        style: styles
+      }, removeInvalidAttributes(restProps)), {
+        children: /* @__PURE__ */ jsxs(
+          "video",
+          __spreadProps(__spreadValues({
+            className: "wm-video-media",
+            controls,
+            poster: computedPoster,
+            muted,
+            loop,
+            autoPlay: autoplay,
+            preload: videopreload,
+            tabIndex: tabindex
+          }, { name }), {
+            children: [
+              computedMp4 && /* @__PURE__ */ jsx("source", { src: computedMp4, type: "video/mp4" }),
+              computedWebm && /* @__PURE__ */ jsx("source", { src: computedWebm, type: "video/webm" }),
+              computedOgg && /* @__PURE__ */ jsx("source", { src: computedOgg, type: "video/ogg" }),
+              computedSubtitles && /* @__PURE__ */ jsx(
+                "track",
+                {
+                  kind: "subtitles",
+                  label: subtitlelang,
+                  srcLang: subtitlelang,
+                  src: computedSubtitles,
+                  default: true
+                }
+              ),
+              videosupportmessage || "Your browser does not support the video tag."
+            ]
+          })
+        )
+      })
+    );
+  },
+  (prev, current) => {
+    const keys = [
+      "mp4format",
+      "webmformat",
+      "oggformat",
+      "subtitlelang",
+      "subtitlesource",
+      "poster",
+      "hint"
+    ];
+    return keys.every((key) => prev[key] === current[key]);
+  }
+);
+WmVideo.displayName = "WmVideo";
+var video_default = withBaseWrapper(WmVideo);
+export {
+  WmVideo,
+  video_default as default
+};