@chenzy-design/svelte 0.3.0 → 0.4.1

package/dist/video-player/VideoPlayer.svelte.d.ts

@@ -0,0 +1,43 @@
+import { type PlaybackRateOption, type LabeledOption, type VideoMarker } from '@chenzy-design/core';
+type Theme = 'dark' | 'light';
+interface Props {
+    src?: string;
+    poster?: string;
+    captionsSrc?: string;
+    width?: number | string;
+    height?: number | string;
+    autoPlay?: boolean;
+    loop?: boolean;
+    muted?: boolean;
+    /** 点击视频面切换播放。**死 prop**（照搬 Semi：声明但未消费，onClick 无条件切换）。 */
+    clickToPlay?: boolean;
+    /** 初始音量 0–100 */
+    volume?: number;
+    /** ←/→ 键快进快退秒数 */
+    seekTime?: number;
+    /** 展示哪些控件项（对齐 Semi controlsList 10 项） */
+    controlsList?: string[];
+    playbackRateList?: PlaybackRateOption[];
+    defaultPlaybackRate?: number;
+    qualityList?: LabeledOption[];
+    defaultQuality?: string;
+    routeList?: LabeledOption[];
+    defaultRoute?: string;
+    markers?: VideoMarker[];
+    theme?: Theme;
+    crossOrigin?: 'anonymous' | 'use-credentials';
+    class?: string;
+    style?: string;
+    /** 绑定的原生 <video> 元素 ref（对齐 Semi forwardRef/ref） */
+    videoRef?: HTMLVideoElement | null;
+    onPlay?: () => void;
+    onPause?: () => void;
+    onVolumeChange?: (volume: number) => void;
+    onRateChange?: (rate: number) => void;
+    onQualityChange?: (quality: string) => void;
+    onRouteChange?: (route: string) => void;
+}
+declare const VideoPlayer: import("svelte").Component<Props, {}, "videoRef">;
+type VideoPlayer = ReturnType<typeof VideoPlayer>;
+export default VideoPlayer;
+//# sourceMappingURL=VideoPlayer.svelte.d.ts.map

package/dist/video-player/VideoPlayer.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VideoPlayer.svelte.d.ts","sourceRoot":"","sources":["../../src/video-player/VideoPlayer.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,EAOH,KAAK,kBAAkB,EACvB,KAAK,aAAa,EAClB,KAAK,WAAW,EACjB,MAAM,qBAAqB,CAAC;AAyB7B,KAAK,KAAK,GAAG,MAAM,GAAG,OAAO,CAAC;AAE9B,UAAU,KAAK;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,0DAA0D;IAC1D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iBAAiB;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,kBAAkB;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,gBAAgB,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACxC,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,WAAW,CAAC,EAAE,aAAa,EAAE,CAAC;IAC9B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,aAAa,EAAE,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,WAAW,EAAE,CAAC;IACxB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,WAAW,CAAC,EAAE,WAAW,GAAG,iBAAiB,CAAC;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,mDAAmD;IACnD,QAAQ,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACnC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAuYH,QAAA,MAAM,WAAW,mDAAwC,CAAC;AAC1D,KAAK,WAAW,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAClD,eAAe,WAAW,CAAC"}

package/dist/video-player/VideoProgress.svelte

@@ -0,0 +1,267 @@
+<!--
+  VideoProgress — 视频进度条（严格镜像 Semi videoProgress.tsx）。DOM：
+  div.cd-videoPlayer-progress[role=slider] > div.-markers > (每段 div.-slider > -list/-buffered/-played)
+  + div.-handle；showTooltip 时外包 Tooltip（有 markers 两行=章节标题+时间，否则仅时间）。
+  markers 多段：每段独立 slider（含未播放底轨/缓冲/已播放三层），段间 margin-right 2px；
+  hover/active 时三轨高度 4→10px。拖拽：mousedown 即定位 + 文档级 mousemove/mouseup（对齐 Semi）。
+  纯自建，复用本库 Tooltip。类名前缀 cd-videoPlayer-progress（驼峰对齐 Semi）。
+-->
+<script lang="ts">
+  import {
+    progressValueFromPointer,
+    segmentValueWidth,
+    buildMarkerSegments,
+    formatTimeDisplay,
+    type VideoMarker,
+  } from '@chenzy-design/core';
+  import Tooltip from '../tooltip/Tooltip.svelte';
+
+  interface Props {
+    /** 当前播放时间（秒） */
+    value: number;
+    /** 已缓冲末端（秒） */
+    buffered: number;
+    /** 总时长（秒） */
+    max: number;
+    markers?: VideoMarker[];
+    showTooltip?: boolean;
+    ariaLabel: string;
+    /** 拖拽/点击时持续回调新时间 */
+    onChange: (value: number) => void;
+  }
+
+  let { value, buffered, max, markers = [], showTooltip = true, ariaLabel, onChange }: Props =
+    $props();
+
+  let sliderEl = $state<HTMLDivElement | null>(null);
+  let isDragging = $state(false);
+  let isHandleHovering = $state(false);
+  let activeIndex = $state(-1);
+  let movingInfo = $state<{ progress: number; offset: number; value: number } | null>(null);
+
+  const safeMax = $derived(Number.isFinite(max) && max > 0 ? max : 0);
+  const safeValue = $derived(Number.isFinite(value) ? value : 0);
+  const safeBuffered = $derived(Number.isFinite(buffered) ? buffered : 0);
+  // 段列表（对齐 Semi initMarkerList：含 left/width 百分比 + start/end/title）。
+  const segments = $derived(buildMarkerSegments(markers, safeMax));
+
+  // 核心定位（对齐 Semi handleMouseEvent）：算 percentage/value，拖拽/mousedown 时 onChange，总更新 movingInfo。
+  function handleMouseEvent(e: MouseEvent, shouldSetValue: boolean): void {
+    if (!sliderEl || safeMax <= 0) return;
+    const r = sliderEl.getBoundingClientRect();
+    const { percentage, value: v, offset } = progressValueFromPointer(
+      e.clientX,
+      { left: r.left, width: r.width },
+      safeMax,
+    );
+    if (shouldSetValue && (isDragging || e.type === 'mousedown')) {
+      onChange(v);
+    }
+    movingInfo = { progress: percentage, offset, value: v };
+  }
+
+  function onMouseDown(e: MouseEvent): void {
+    isDragging = true;
+    handleMouseEvent(e, true);
+    document.addEventListener('mousemove', onDocMouseMove);
+    document.addEventListener('mouseup', onDocMouseUp);
+  }
+  function onDocMouseMove(e: MouseEvent): void {
+    if (isDragging) handleMouseEvent(e, true);
+  }
+  function onDocMouseUp(): void {
+    isDragging = false;
+    document.removeEventListener('mousemove', onDocMouseMove);
+    document.removeEventListener('mouseup', onDocMouseUp);
+  }
+  function onMouseEnter(e: MouseEvent): void {
+    handleMouseEvent(e, false); // 仅更新预览
+  }
+  function onMouseMove(e: MouseEvent): void {
+    handleMouseEvent(e, true);
+  }
+  // marker hover：value 落在段区间时切 handle hover + 记 activeIndex（对齐 Semi）。
+  function onSliderMouseEnter(index: number): void {
+    isHandleHovering = true;
+    activeIndex = index;
+  }
+  function onSliderMouseLeave(): void {
+    isHandleHovering = false;
+    activeIndex = -1;
+  }
+
+  // 每段的 left/width 百分比（对齐 Semi initMarkerList）。
+  function segLeft(seg: { start: number }): string {
+    return safeMax > 0 ? `${(seg.start / safeMax) * 100}%` : '0';
+  }
+  function segWidth(seg: { start: number; end: number }): string {
+    return safeMax > 0 ? `${((seg.end - seg.start) / safeMax) * 100}%` : '100%';
+  }
+
+  // handle left = calc(pct% - 8px)（对齐 Semi，value||1 避免 0 时贴边）。
+  const handlePct = $derived(safeMax > 0 ? ((safeValue || 1) / safeMax) * 100 : 0);
+
+  // Tooltip 内容：有 markers 两行（命中段标题 + 时间），否则仅时间字符串。
+  const hoverIndex = $derived(
+    movingInfo
+      ? segments.findIndex((s) => movingInfo!.value > s.start && movingInfo!.value < s.end)
+      : -1,
+  );
+  const hasMarkerTooltip = $derived(markers.length > 0);
+</script>
+
+{#snippet sliderContent()}
+  <!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
+  <div
+    bind:this={sliderEl}
+    role="slider"
+    tabindex="0"
+    aria-label={ariaLabel}
+    aria-valuemin={0}
+    aria-valuemax={Math.round(safeMax)}
+    aria-valuenow={Math.round(safeValue)}
+    class="cd-videoPlayer-progress"
+    onmousedown={onMouseDown}
+    onmouseenter={onMouseEnter}
+    onmousemove={onMouseMove}
+  >
+    <div class="cd-videoPlayer-progress-markers">
+      {#each segments as seg, i (i)}
+        <div
+          class="cd-videoPlayer-progress-slider"
+          class:cd-videoPlayer-progress-slider-active={i === activeIndex && isDragging}
+          style:left={segLeft(seg)}
+          style:width={segWidth(seg)}
+          onmouseenter={() => onSliderMouseEnter(i)}
+          onmouseleave={onSliderMouseLeave}
+          role="presentation"
+        >
+          <div class="cd-videoPlayer-progress-slider-list"></div>
+          <div
+            class="cd-videoPlayer-progress-slider-buffered"
+            style:width={segmentValueWidth(seg, safeBuffered)}
+          ></div>
+          <div
+            class="cd-videoPlayer-progress-slider-played"
+            style:width={segmentValueWidth(seg, safeValue)}
+          ></div>
+        </div>
+      {/each}
+    </div>
+    <div
+      class="cd-videoPlayer-progress-handle"
+      style:left={`calc(${handlePct}% - 8px)`}
+      style:opacity={isHandleHovering || isDragging ? 1 : 0}
+    ></div>
+  </div>
+{/snippet}
+
+{#if showTooltip}
+  <Tooltip position="top" style={`left:${movingInfo?.offset ?? 0}px`}>
+    {#snippet content()}
+      {#if hasMarkerTooltip && movingInfo}
+        <div class="cd-videoPlayer-progress-tooltip-content">
+          {segments[hoverIndex]?.title ?? ''}
+        </div>
+        <div class="cd-videoPlayer-progress-tooltip-content">
+          {formatTimeDisplay(movingInfo.progress * safeMax)}
+        </div>
+      {:else if movingInfo}
+        {formatTimeDisplay(movingInfo.progress * safeMax)}
+      {/if}
+    {/snippet}
+    {@render sliderContent()}
+  </Tooltip>
+{:else}
+  {@render sliderContent()}
+{/if}
+
+<style>
+  /* 严格镜像 Semi videoPlayer.scss .semi-videoPlayer-progress。 */
+  .cd-videoPlayer-progress {
+    position: relative;
+    height: var(--cd-height-videoPlayer-progress-bar-hotSpot-default);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    margin: var(--cd-spacing-videoPlayer-progress-bar-wrapper-marginY)
+      var(--cd-spacing-videoPlayer-progress-bar-wrapper-marginX);
+    outline: none;
+  }
+  .cd-videoPlayer-progress-markers {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+  }
+  .cd-videoPlayer-progress-slider {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    left: 0;
+    bottom: 0;
+    border-radius: var(--cd-radius-videoPlayer-progress-bar);
+  }
+  /* hover/active：三轨高度 4→10px（对齐 Semi）。 */
+  .cd-videoPlayer-progress-slider-active .cd-videoPlayer-progress-slider-list,
+  .cd-videoPlayer-progress-slider-active .cd-videoPlayer-progress-slider-played,
+  .cd-videoPlayer-progress-slider-active .cd-videoPlayer-progress-slider-buffered,
+  .cd-videoPlayer-progress-slider:hover .cd-videoPlayer-progress-slider-list,
+  .cd-videoPlayer-progress-slider:hover .cd-videoPlayer-progress-slider-played,
+  .cd-videoPlayer-progress-slider:hover .cd-videoPlayer-progress-slider-buffered {
+    height: var(--cd-height-videoPlayer-progress-bar-hover);
+    transition: transform var(--cd-animation-duration-videoPlayer-slider-in);
+    transition-timing-function: var(--cd-animation-function-videoPlayer-slider-in);
+  }
+  .cd-videoPlayer-progress-slider-list {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    background-color: var(--cd-color-videoPlayer-progress-bar-bg-unplayed);
+    height: var(--cd-height-videoPlayer-progress-bar-default);
+    width: calc(100% - var(--cd-spacing-videoPlayer-progress-bar-chapter-marginRight));
+    margin-right: var(--cd-spacing-videoPlayer-progress-bar-chapter-marginRight);
+    border-radius: var(--cd-radius-videoPlayer-progress-bar);
+    transition: transform var(--cd-animation-duration-videoPlayer-slider-in);
+    transition-timing-function: var(--cd-animation-function-videoPlayer-slider-out);
+  }
+  .cd-videoPlayer-progress-slider-played {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    background-color: var(--cd-color-videoPlayer-progress-bar-bg-played);
+    height: var(--cd-height-videoPlayer-progress-bar-default);
+    border-radius: var(--cd-radius-videoPlayer-progress-bar);
+    transition: transform var(--cd-animation-duration-videoPlayer-slider-in);
+    transition-timing-function: var(--cd-animation-function-videoPlayer-slider-out);
+  }
+  .cd-videoPlayer-progress-slider-buffered {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    background-color: var(--cd-color-videoPlayer-progress-bar-bg-loaded);
+    height: var(--cd-height-videoPlayer-progress-bar-default);
+    border-radius: var(--cd-radius-videoPlayer-progress-bar);
+    transition: transform var(--cd-animation-duration-videoPlayer-slider-in);
+    transition-timing-function: var(--cd-animation-function-videoPlayer-slider-out);
+  }
+  .cd-videoPlayer-progress-handle {
+    box-sizing: border-box;
+    position: absolute;
+    width: var(--cd-height-videoPlayer-progress-bar-handle);
+    height: var(--cd-height-videoPlayer-progress-bar-handle);
+    background-color: var(--cd-color-videoPlayer-progress-bar-handle-bg);
+    border: 1px solid var(--cd-color-videoPlayer-progress-bar-handle-border);
+    box-shadow: 0px 0px 4px 0px var(--cd-color-videoPlayer-progress-bar-handle-shadow);
+    border-radius: var(--cd-radius-videoPlayer-progress-bar-handle);
+    top: var(--cd-spacing-videoPlayer-progress-bar-handle-top);
+    transform: translateY(-50%);
+    transition: opacity 0.3s;
+    pointer-events: none;
+  }
+  .cd-videoPlayer-progress-tooltip-content {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+</style>

package/dist/video-player/VideoProgress.svelte.d.ts

@@ -0,0 +1,18 @@
+import { type VideoMarker } from '@chenzy-design/core';
+interface Props {
+    /** 当前播放时间（秒） */
+    value: number;
+    /** 已缓冲末端（秒） */
+    buffered: number;
+    /** 总时长（秒） */
+    max: number;
+    markers?: VideoMarker[];
+    showTooltip?: boolean;
+    ariaLabel: string;
+    /** 拖拽/点击时持续回调新时间 */
+    onChange: (value: number) => void;
+}
+declare const VideoProgress: import("svelte").Component<Props, {}, "">;
+type VideoProgress = ReturnType<typeof VideoProgress>;
+export default VideoProgress;
+//# sourceMappingURL=VideoProgress.svelte.d.ts.map

package/dist/video-player/VideoProgress.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VideoProgress.svelte.d.ts","sourceRoot":"","sources":["../../src/video-player/VideoProgress.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAKH,KAAK,WAAW,EACjB,MAAM,qBAAqB,CAAC;AAI7B,UAAU,KAAK;IACb,gBAAgB;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,eAAe;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,aAAa;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,WAAW,EAAE,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,EAAE,MAAM,CAAC;IAClB,oBAAoB;IACpB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC;AA+HH,QAAA,MAAM,aAAa,2CAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/video-player/index.d.ts

@@ -0,0 +1,4 @@
+export { default as VideoPlayer } from './VideoPlayer.svelte';
+export { meta as videoPlayerMeta } from './meta.js';
+export type { VideoMarker, PlaybackRateOption, LabeledOption, } from '@chenzy-design/core';
+//# sourceMappingURL=index.d.ts.map

package/dist/video-player/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/video-player/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,IAAI,IAAI,eAAe,EAAE,MAAM,WAAW,CAAC;AACpD,YAAY,EACV,WAAW,EACX,kBAAkB,EAClB,aAAa,GACd,MAAM,qBAAqB,CAAC"}

package/dist/video-player/index.js

@@ -0,0 +1,2 @@
+export { default as VideoPlayer } from './VideoPlayer.svelte';
+export { meta as videoPlayerMeta } from './meta.js';

package/dist/video-player/meta.d.ts

@@ -0,0 +1,200 @@
+/**
+ * Machine-readable component metadata for AI/docs consumption.
+ * VideoPlayer — aligned to Semi Design VideoPlayer (native <video>, no media lib).
+ */
+export declare const meta: {
+    readonly name: "VideoPlayer";
+    readonly category: "plus";
+    readonly description: "视频播放器：原生 <video> + 框架无关状态机（@chenzy-design/core），无第三方媒体库，严格对齐 Semi VideoPlayer。DOM 镜像 Semi（cd-videoPlayer 驼峰前缀：wrapper/video + poster img + 中央播放键 IconPlayCircle + ErrorSvg 插画 + notification + controls(VideoProgress + menu-left/right)）。复用 Button/Popover/Dropdown/AudioSlider + 11 具名图标。支持播放/暂停、进度拖拽跳转（含章节 markers 多段+缓冲/已播放双层+hover 放大+Tooltip 预览）、音量（Popover 竖向 AudioSlider，0–100 静音派生 0↔50）、倍率/清晰度/线路 Dropdown 切换（切后回跳原播放位置）、镜像、画中画、全屏、瞬时通知。controlsList 控制控件增删，theme 仅切换容器背景。键盘：Space 播放/暂停、←/→ 按 seekTime 跳转（焦点在播放器内时）。照搬 Semi 缺陷：clickToPlay 死 prop、next 控件绑 play/pause、硬编码色、音量键盘不实现；不复刻 Semi keydown 泄漏 bug。";
+    readonly exports: readonly ["VideoPlayer"];
+    readonly props: readonly [{
+        readonly name: "src";
+        readonly type: "string";
+        readonly default: "undefined";
+        readonly desc: "视频播放地址";
+    }, {
+        readonly name: "poster";
+        readonly type: "string";
+        readonly default: "undefined";
+        readonly desc: "封面图地址";
+    }, {
+        readonly name: "captionsSrc";
+        readonly type: "string";
+        readonly default: "undefined";
+        readonly desc: "字幕/captions 轨道地址";
+    }, {
+        readonly name: "width";
+        readonly type: "number|string";
+        readonly default: "undefined";
+        readonly desc: "容器宽，number 视为 px";
+    }, {
+        readonly name: "height";
+        readonly type: "number|string";
+        readonly default: "undefined";
+        readonly desc: "容器高，number 视为 px";
+    }, {
+        readonly name: "autoPlay";
+        readonly type: "boolean";
+        readonly default: "false";
+        readonly desc: "是否自动播放";
+    }, {
+        readonly name: "loop";
+        readonly type: "boolean";
+        readonly default: "false";
+        readonly desc: "是否循环播放";
+    }, {
+        readonly name: "muted";
+        readonly type: "boolean";
+        readonly default: "false";
+        readonly desc: "是否静音播放（初始）";
+    }, {
+        readonly name: "clickToPlay";
+        readonly type: "boolean";
+        readonly default: "true";
+        readonly desc: "点击视频画面是否切换播放";
+    }, {
+        readonly name: "volume";
+        readonly type: "number";
+        readonly default: "100";
+        readonly desc: "初始音量，区间 0–100";
+    }, {
+        readonly name: "seekTime";
+        readonly type: "number";
+        readonly default: "10";
+        readonly desc: "←/→ 键快进快退时间（秒）";
+    }, {
+        readonly name: "controlsList";
+        readonly type: "string[]";
+        readonly default: "['play','next','time','volume','playbackRate','quality','route','mirror','fullscreen','pictureInPicture']";
+        readonly desc: "控件栏展示项（对齐 Semi shouldShowControlItem，控制增删）";
+    }, {
+        readonly name: "playbackRateList";
+        readonly type: "{ label: string; value: number }[]";
+        readonly default: "[2.0x,1.5x,1.25x,1.0x,0.75x]";
+        readonly desc: "倍率菜单选项，默认 Semi 5 档";
+    }, {
+        readonly name: "defaultPlaybackRate";
+        readonly type: "number";
+        readonly default: "1";
+        readonly desc: "默认倍率";
+    }, {
+        readonly name: "qualityList";
+        readonly type: "{ label: string; value: string }[]";
+        readonly default: "undefined";
+        readonly desc: "清晰度菜单选项";
+    }, {
+        readonly name: "defaultQuality";
+        readonly type: "string";
+        readonly default: "undefined";
+        readonly desc: "默认清晰度";
+    }, {
+        readonly name: "routeList";
+        readonly type: "{ label: string; value: string }[]";
+        readonly default: "undefined";
+        readonly desc: "线路菜单选项";
+    }, {
+        readonly name: "defaultRoute";
+        readonly type: "string";
+        readonly default: "undefined";
+        readonly desc: "默认线路";
+    }, {
+        readonly name: "markers";
+        readonly type: "{ start: number; title?: string }[]";
+        readonly default: "[]";
+        readonly desc: "进度条章节标记点";
+    }, {
+        readonly name: "theme";
+        readonly type: "'dark'|'light'";
+        readonly default: "'dark'";
+        readonly desc: "主题，仅影响容器背景色（对齐 Semi）";
+    }, {
+        readonly name: "crossOrigin";
+        readonly type: "'anonymous'|'use-credentials'";
+        readonly default: "undefined";
+        readonly desc: "原生 crossorigin，CORS 取视频";
+    }, {
+        readonly name: "class";
+        readonly type: "string";
+        readonly default: "''";
+        readonly desc: "根类名透传";
+    }, {
+        readonly name: "videoRef";
+        readonly type: "HTMLVideoElement|null";
+        readonly default: "null";
+        readonly desc: "bindable：拿到原生 video 元素以做更灵活的控制（如多视频同步）";
+    }, {
+        readonly name: "onPlay";
+        readonly type: "() => void";
+        readonly default: "undefined";
+        readonly desc: "播放回调";
+    }, {
+        readonly name: "onPause";
+        readonly type: "() => void";
+        readonly default: "undefined";
+        readonly desc: "暂停回调";
+    }, {
+        readonly name: "onVolumeChange";
+        readonly type: "(volume: number) => void";
+        readonly default: "undefined";
+        readonly desc: "调整音量回调";
+    }, {
+        readonly name: "onRateChange";
+        readonly type: "(rate: number) => void";
+        readonly default: "undefined";
+        readonly desc: "切换倍率回调";
+    }, {
+        readonly name: "onQualityChange";
+        readonly type: "(quality: string) => void";
+        readonly default: "undefined";
+        readonly desc: "切换清晰度回调（在此更新 src）";
+    }, {
+        readonly name: "onRouteChange";
+        readonly type: "(route: string) => void";
+        readonly default: "undefined";
+        readonly desc: "切换线路回调（在此更新 src）";
+    }];
+    readonly events: readonly [{
+        readonly name: "onPlay";
+        readonly desc: "开始播放";
+    }, {
+        readonly name: "onPause";
+        readonly desc: "暂停";
+    }, {
+        readonly name: "onVolumeChange";
+        readonly desc: "音量变化";
+    }, {
+        readonly name: "onRateChange";
+        readonly desc: "倍率变化";
+    }, {
+        readonly name: "onQualityChange";
+        readonly desc: "清晰度变化";
+    }, {
+        readonly name: "onRouteChange";
+        readonly desc: "线路变化";
+    }];
+    readonly slots: readonly [];
+    readonly a11y: {
+        readonly role: "application";
+        readonly keyboard: readonly ["Space", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End", "Escape"];
+        readonly focusable: true;
+        readonly notes: readonly ["Space 播放/暂停、←/→ 按 seekTime 跳转，仅当焦点在播放器容器内时响应（Semi handleBodyKeyDown，避免劫持页面其他控件键位）；音量键盘调节照搬 Semi 未实现", "控件为本库 Button，aria-label 走 locale（play/pause/mute/unmute/fullscreen/exitFullscreen/pictureInPicture/mirror/volume）", "进度条 role=slider，aria-valuemin/max/now 为秒；章节标记多段（markers）", "音量为 Popover 内竖向 AudioSlider（role=slider 0–100）；静音按钮 aria-pressed", "倍率/清晰度/线路为 Dropdown：触发块补 role=button + aria-haspopup=menu/aria-expanded（修 axe），Dropdown.Item active 标注选中", "加载/卡顿通知 aria-live=polite；错误态 role=alert（ErrorSvg 插画 + 文案）"];
+    };
+    readonly tokens: readonly ["--cd-color-videoPlayer-theme-dark-bg", "--cd-color-videoPlayer-theme-light-bg", "--cd-color-videoPlayer-controls-bg", "--cd-color-videoPlayer-controls-text", "--cd-color-videoPlayer-pause-bg", "--cd-color-videoPlayer-notification-bg", "--cd-color-videoPlayer-progress-bar-bg-played", "--cd-color-videoPlayer-progress-bar-bg-loaded", "--cd-color-videoPlayer-progress-bar-bg-unplayed", "--cd-color-videoPlayer-progress-bar-handle-bg", "--cd-height-videoPlayer-controls-menu-default", "--cd-height-videoPlayer-progress-bar-hover", "--cd-radius-videoPlayer-progress-bar", "--cd-animation-duration-videoPlayer-controls-show", "--cd-animation-function-videoPlayer-slider-in"];
+    readonly examples: readonly [{
+        readonly title: "基础";
+        readonly code: "<VideoPlayer src=\"/demo.mp4\" poster=\"/poster.jpg\" height={360} />";
+    }, {
+        readonly title: "设置控件栏 + 循环";
+        readonly code: "<VideoPlayer\n  src=\"/demo.mp4\"\n  loop\n  controlsList={['play', 'time', 'volume', 'playbackRate', 'fullscreen']}\n/>";
+    }, {
+        readonly title: "清晰度切换";
+        readonly code: "<VideoPlayer\n  src={src}\n  defaultQuality=\"1080p\"\n  qualityList={[{ label: '1080p', value: '1080p' }, { label: '480p', value: '480p' }]}\n  onQualityChange={(q) => (src = pick(q))}\n/>";
+    }, {
+        readonly title: "章节标记";
+        readonly code: "<VideoPlayer src=\"/demo.mp4\" markers={[{ start: 0, title: '片头' }, { start: 38, title: '正片' }]} />";
+    }, {
+        readonly title: "ref 控制多视频同步";
+        readonly code: "<VideoPlayer bind:videoRef={v1} src=\"/a.mp4\" />\n<VideoPlayer bind:videoRef={v2} src=\"/a.mp4\" />\n<button onclick={() => { v1?.play(); v2?.play(); }}>同时播放</button>";
+    }];
+};
+//# sourceMappingURL=meta.d.ts.map

package/dist/video-player/meta.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../src/video-player/meta.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4JP,CAAC"}