@lingxia/elements 0.6.3 → 0.7.0

package/dist/index.d.ts

@@ -1,9 +1,10 @@
 export { registerVideoComponent, LxVideoElement, type LxVideoAttributes, } from "./video.js";
+export { registerMediaSwiperComponent, LxMediaSwiperElement, type LxMediaSwiperAttributes, type LxMediaSwiperItem, type LxMediaSwiperChangeEvent, type LxMediaSwiperChangeEventDetail, type LxMediaSwiperTransitionEndEvent, type LxMediaSwiperTransitionEndEventDetail, type LxMediaSwiperItemEvent, type LxMediaSwiperEventDetail, type LxMediaSwiperEndReachedEvent, type LxMediaSwiperEndReachedEventDetail, type LxMediaSwiperErrorEvent, type LxMediaSwiperErrorEventDetail, type LxMediaSwiperChangeSource, type LxMediaSwiperErrorCode, } from "./media_swiper.js";
 export { registerPickerComponent, LxPickerElement, type LxPickerAttributes, type LxPickerColumn, type LxPickerCascadingColumns, type LxPickerEvent, type LxPickerEventDetail, } from "./picker.js";
 export { registerInputComponent, LxInputElement, type LxInputAttributes, type LxInputEvent, type LxInputEventDetail, } from "./input.js";
 export { registerTextareaComponent, LxTextareaElement, type LxTextareaAttributes, type LxTextareaEvent, type LxTextareaEventDetail, } from "./textarea.js";
 export { LxNavigatorElement, type LxNavigatorAttributes, type LxNavigatorEvent, type NavigatorEnvVersion, type NavigatorOpenType, type NavigatorQuery, type NavigatorQueryValue, type NavigatorTarget, } from "./navigator.js";
-export { buildVideoNativeAttrs, buildNavigatorNativeAttrs, buildPickerNativeAttrs, getPickerDisplayText, getPickerValueFromIndex, VIDEO_DOM_EVENT_MAP, } from "./native_component_wrapper_shared.js";
+export { buildVideoNativeAttrs, buildMediaSwiperNativeAttrs, buildNavigatorNativeAttrs, buildPickerNativeAttrs, getPickerDisplayText, getPickerValueFromIndex, VIDEO_DOM_EVENT_MAP, MEDIA_SWIPER_DOM_EVENT_MAP, } from "./native_component_wrapper_shared.js";
 export { buildInputNativeAttrs, buildTextareaNativeAttrs, } from "./text_component_native_attrs.js";
 export { isHarmony, isIOS, isAndroid, isMacOS, isDesktop, getOS, } from "./platform.js";
 export { ensureComponentId, rectEquals, NativeComponentUpdateState, type Rect, } from "./component.js";

package/dist/index.js

@@ -1,9 +1,10 @@
 export { registerVideoComponent, LxVideoElement, } from "./video.js";
+export { registerMediaSwiperComponent, LxMediaSwiperElement, } from "./media_swiper.js";
 export { registerPickerComponent, LxPickerElement, } from "./picker.js";
 export { registerInputComponent, LxInputElement, } from "./input.js";
 export { registerTextareaComponent, LxTextareaElement, } from "./textarea.js";
 export { LxNavigatorElement, } from "./navigator.js";
-export { buildVideoNativeAttrs, buildNavigatorNativeAttrs, buildPickerNativeAttrs, getPickerDisplayText, getPickerValueFromIndex, VIDEO_DOM_EVENT_MAP, } from "./native_component_wrapper_shared.js";
+export { buildVideoNativeAttrs, buildMediaSwiperNativeAttrs, buildNavigatorNativeAttrs, buildPickerNativeAttrs, getPickerDisplayText, getPickerValueFromIndex, VIDEO_DOM_EVENT_MAP, MEDIA_SWIPER_DOM_EVENT_MAP, } from "./native_component_wrapper_shared.js";
 export { buildInputNativeAttrs, buildTextareaNativeAttrs, } from "./text_component_native_attrs.js";
 export { isHarmony, isIOS, isAndroid, isMacOS, isDesktop, getOS, } from "./platform.js";
 export { ensureComponentId, rectEquals, NativeComponentUpdateState, } from "./component.js";

package/dist/media_swiper.d.ts

@@ -0,0 +1,182 @@
+type LxMediaSwiperEventHandler = (e: Event) => void;
+export type LxMediaSwiperItem = {
+    id?: string;
+    type: "image";
+    src: string;
+} | {
+    id?: string;
+    type: "video";
+    src: string;
+    poster?: string;
+    controls?: boolean;
+    muted?: boolean;
+};
+export type LxMediaSwiperChangeSource = "touch" | "autoplay" | "api" | "video";
+export type LxMediaSwiperErrorCode = "not_found" | "network" | "decode" | "unsupported_format" | "permission_denied" | "unknown";
+export type LxMediaSwiperEventDetail = {
+    index: number;
+    item: LxMediaSwiperItem;
+};
+export type LxMediaSwiperChangeEventDetail = {
+    index: number;
+    previousIndex: number;
+    item: LxMediaSwiperItem;
+    source: LxMediaSwiperChangeSource;
+};
+export type LxMediaSwiperTransitionEndEventDetail = LxMediaSwiperChangeEventDetail;
+export type LxMediaSwiperEndReachedEventDetail = {
+    index: number;
+    item: LxMediaSwiperItem;
+    source: LxMediaSwiperChangeSource;
+};
+export type LxMediaSwiperErrorEventDetail = {
+    index: number;
+    item?: LxMediaSwiperItem;
+    code: LxMediaSwiperErrorCode;
+    message: string;
+};
+export type LxMediaSwiperChangeEvent = CustomEvent<LxMediaSwiperChangeEventDetail>;
+export type LxMediaSwiperTransitionEndEvent = CustomEvent<LxMediaSwiperTransitionEndEventDetail>;
+export type LxMediaSwiperItemEvent = CustomEvent<LxMediaSwiperEventDetail>;
+export type LxMediaSwiperEndReachedEvent = CustomEvent<LxMediaSwiperEndReachedEventDetail>;
+export type LxMediaSwiperErrorEvent = CustomEvent<LxMediaSwiperErrorEventDetail>;
+/**
+ * Peek leaves part of the previous and next pages visible alongside the current
+ * page so users get a hint that more content exists. A single `number` applies
+ * symmetric peek on both edges; an object lets the two sides differ.
+ *
+ * For `direction="vertical"`, `previous` peeks the top edge and `next` peeks
+ * the bottom edge.
+ *
+ * Values are CSS pixels (DIPs). `0` (default) disables peek and behaves
+ * identically to v1: each page fills the swiper bounds.
+ */
+export type LxMediaSwiperPeek = number | {
+    previous?: number;
+    next?: number;
+};
+export type LxMediaSwiperAttributes = {
+    id?: string;
+    items?: LxMediaSwiperItem[];
+    index?: number;
+    initialIndex?: number;
+    loop?: boolean;
+    autoplay?: boolean;
+    interval?: number;
+    animation?: "slide" | "none";
+    animationDuration?: number;
+    direction?: "horizontal" | "vertical";
+    contentRotate?: 0 | 90 | 180 | 270;
+    objectFit?: "cover" | "contain" | "fill" | "fit";
+    controls?: boolean;
+    muted?: boolean;
+    dots?: boolean | {
+        color?: string;
+        activeColor?: string;
+    };
+    swipeEnabled?: boolean;
+    peek?: LxMediaSwiperPeek;
+    className?: string;
+    style?: any;
+    ref?: any;
+    onChange?: LxMediaSwiperEventHandler;
+    onTransitionEnd?: LxMediaSwiperEventHandler;
+    onEndReached?: LxMediaSwiperEventHandler;
+    onTap?: LxMediaSwiperEventHandler;
+    onVideoEnded?: LxMediaSwiperEventHandler;
+    onError?: LxMediaSwiperEventHandler;
+    pageBindings?: Record<string, string>;
+};
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            "lx-media-swiper": LxMediaSwiperAttributes;
+        }
+    }
+}
+export declare class LxMediaSwiperElement extends HTMLElement {
+    static get observedAttributes(): string[];
+    private componentId;
+    private mounted;
+    private updateState;
+    private unregister?;
+    private resizeObserver?;
+    private pendingLayoutFrame;
+    private boundUpdatePosition;
+    private removeLayoutInvalidationListener?;
+    private iOSHelper?;
+    private rawHandlers;
+    private handlers;
+    private _pageBindings;
+    private harmonyCommandSeq;
+    private harmonyPendingCommand;
+    private pendingHarmonyProps?;
+    private pendingHarmonyRetryTimer;
+    private pendingHarmonyRetryCount;
+    private harmonyEmbed?;
+    private lastHarmonyProps?;
+    set items(value: LxMediaSwiperItem[] | string | null | undefined);
+    get items(): LxMediaSwiperItem[];
+    set index(value: number | null | undefined);
+    get index(): number | undefined;
+    set initialIndex(value: number | null | undefined);
+    get initialIndex(): number | undefined;
+    set contentRotate(value: unknown);
+    get contentRotate(): 0 | 90 | 180 | 270 | undefined;
+    set pageBindings(bindings: Record<string, string>);
+    get pageBindings(): Record<string, string>;
+    set pageFuncBindings(bindings: Record<string, string>);
+    setPageBindings(bindings: Record<string, string>): void;
+    next(): void;
+    previous(): void;
+    goToIndex(index: number): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string): void;
+    set onchange(cb: EventListener);
+    get onchange(): EventListener;
+    set ontransitionend(cb: EventListener);
+    get ontransitionend(): EventListener;
+    set onendreached(cb: EventListener);
+    get onendreached(): EventListener;
+    set ontap(cb: EventListener);
+    get ontap(): EventListener;
+    set onvideoended(cb: EventListener);
+    get onvideoended(): EventListener;
+    private sendCommand;
+    private collectProps;
+    private mountOrUpdate;
+    private mountOrUpdateHarmony;
+    private ensureHarmonyEmbed;
+    private encodeHarmonyProps;
+    private pushHarmonyPropsUpdate;
+    private scheduleHarmonyPropsRetry;
+    private flushHarmonyCommandIfPending;
+    private updatePosition;
+    private startTracking;
+    private stopTracking;
+    private startSizeObserver;
+    private stopSizeObserver;
+    private scheduleMountRetry;
+    private ensurePlaceholderStyle;
+    private upgradeProperty;
+    private isEventListener;
+    private setEventHandler;
+    private getEventHandler;
+    private parseItems;
+    private parseDots;
+    private parseIntegerAttr;
+    private parseRotate;
+    private parseObjectFit;
+    private parseAnimation;
+    private parseDirection;
+    /**
+     * Parse the `peek` attribute into a normalised `{ previous, next }` shape.
+     * Returns `undefined` when no peek is configured so native sides can fall back
+     * to the zero-peek (full-width page) layout.
+     */
+    private parsePeek;
+    private collectDataset;
+}
+export declare function registerMediaSwiperComponent(): void;
+export {};