@lingxia/elements 0.14.0 → 0.16.0

package/dist/inline-native/schema.d.ts

@@ -0,0 +1,111 @@
+/**
+ * Machine-readable inline-native contract. Wrappers, the structure compiler,
+ * and the host applicator share this object; unknown names are out of contract.
+ */
+export declare const NATIVE_ERROR_CODES: readonly ["NATIVE_ROOT_UNAVAILABLE", "NATIVE_ROOT_INCOMPATIBLE", "NATIVE_ROOT_INVALID_STRUCTURE", "NATIVE_ROOT_FAILED", "NATIVE_ROOT_UNSUPPORTED_LAYOUT", "NATIVE_COMPONENT_INVALID_PROPS", "NATIVE_COMPONENT_MOUNT_FAILED", "NATIVE_COMPONENT_COMMAND_FAILED", "NATIVE_ROOT_UNSUPPORTED_STYLE", "NATIVE_ROOT_DESTROYED"];
+export declare const PUBLIC_COMPONENT_NAMES: readonly ["LxNativeRoot", "LxNativeView", "LxNativeCover", "LxNativeText", "LxNativeButton", "LxVideo"];
+export declare const PUBLIC_ELEMENT_TAGS: readonly ["lx-native-root", "lx-native-view", "lx-native-cover", "lx-native-text", "lx-native-button", "lx-video"];
+export declare const CORE_KINDS: readonly ["root", "view", "text", "tappable"];
+export declare const HOST_FACTORY_KINDS: readonly ["root", "view", "text", "tappable", "video"];
+export declare const AUTHOR_COMPONENT_TO_TAG: {
+    readonly LxNativeRoot: "lx-native-root";
+    readonly LxNativeView: "lx-native-view";
+    readonly LxNativeCover: "lx-native-cover";
+    readonly LxNativeText: "lx-native-text";
+    readonly LxNativeButton: "lx-native-button";
+    readonly LxVideo: "lx-video";
+};
+export declare const TAG_TO_AUTHOR_COMPONENT: {
+    readonly "lx-native-root": "LxNativeRoot";
+    readonly "lx-native-view": "LxNativeView";
+    readonly "lx-native-cover": "LxNativeCover";
+    readonly "lx-native-text": "LxNativeText";
+    readonly "lx-native-button": "LxNativeButton";
+    readonly "lx-video": "LxVideo";
+};
+export declare const NATIVE_ACTION_ICONS: readonly ["close", "play", "pause", "mute", "unmute", "fullscreen", "more"];
+export declare const POINTER_EVENTS_VALUES: readonly ["auto", "none", "box-only", "box-none"];
+export declare const COVER_SCRIM_VALUES: readonly ["none", "top", "bottom", "full"];
+export declare const STRUCTURE_ROLE_VALUES: readonly ["group", "region", "status", "presentation", "none"];
+export declare const BUTTON_INTENT_VALUES: readonly ["neutral", "accent", "destructive"];
+export declare const BUTTON_EMPHASIS_VALUES: readonly ["primary", "secondary", "quiet"];
+export declare const BUTTON_SIZE_VALUES: readonly ["compact", "regular"];
+export declare const BUTTON_ICON_POSITION_VALUES: readonly ["start", "end"];
+export declare const VIDEO_OBJECT_FIT_VALUES: readonly ["contain", "cover", "fill", "none"];
+export declare const VIDEO_CONTENT_ROTATE_VALUES: readonly [0, 90, 180, 270];
+export declare const WATERMARK_CORNER_VALUES: readonly ["top-start", "top-end", "bottom-start", "bottom-end"];
+/** Layout fields measured from the DOM anchor. */
+export declare const NATIVE_STYLE_LAYOUT_FIELDS: readonly ["display", "position", "top", "right", "bottom", "left", "inset", "width", "height", "minWidth", "minHeight", "maxWidth", "maxHeight", "flex", "flexGrow", "flexShrink", "flexBasis", "flexDirection", "flexWrap", "alignItems", "alignSelf", "justifyContent", "gap", "rowGap", "columnGap", "gridTemplateColumns", "gridTemplateRows", "gridColumn", "gridRow", "margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "padding", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "overflow", "aspectRatio", "boxSizing"];
+export declare const NATIVE_STYLE_PAINT_FIELDS: readonly ["backgroundColor", "opacity", "border", "borderWidth", "borderColor", "borderStyle", "borderRadius"];
+export declare const NATIVE_STYLE_UNSUPPORTED_LAYOUT_FIELDS: readonly ["transform", "translate", "rotate", "scale", "perspective", "clipPath", "maskImage"];
+export declare const NATIVE_STYLE_UNSUPPORTED_PAINT_FIELDS: readonly ["boxShadow", "filter", "backdropFilter", "mixBlendMode", "backgroundImage", "background", "animation", "transition", "textDecoration", "fontStyle", "letterSpacing", "textShadow"];
+export declare const TEXT_STYLE_PROP_FIELDS: readonly ["fontSize", "fontWeight", "lineHeight", "textAlign", "color"];
+export declare const INTERACTIVE_AUTHOR_COMPONENTS: readonly ["LxNativeButton", "LxVideo"];
+export declare const CONTAINER_AUTHOR_COMPONENTS: readonly ["LxNativeRoot", "LxNativeView", "LxNativeCover"];
+export declare const INLINE_NATIVE_SCHEMA: {
+    readonly version: 1;
+    readonly publicComponents: readonly ["LxNativeRoot", "LxNativeView", "LxNativeCover", "LxNativeText", "LxNativeButton", "LxVideo"];
+    readonly publicElementTags: readonly ["lx-native-root", "lx-native-view", "lx-native-cover", "lx-native-text", "lx-native-button", "lx-video"];
+    readonly coreKinds: readonly ["root", "view", "text", "tappable"];
+    readonly hostFactoryKinds: readonly ["root", "view", "text", "tappable", "video"];
+    readonly errorCodes: readonly ["NATIVE_ROOT_UNAVAILABLE", "NATIVE_ROOT_INCOMPATIBLE", "NATIVE_ROOT_INVALID_STRUCTURE", "NATIVE_ROOT_FAILED", "NATIVE_ROOT_UNSUPPORTED_LAYOUT", "NATIVE_COMPONENT_INVALID_PROPS", "NATIVE_COMPONENT_MOUNT_FAILED", "NATIVE_COMPONENT_COMMAND_FAILED", "NATIVE_ROOT_UNSUPPORTED_STYLE", "NATIVE_ROOT_DESTROYED"];
+    readonly authorComponentToTag: {
+        readonly LxNativeRoot: "lx-native-root";
+        readonly LxNativeView: "lx-native-view";
+        readonly LxNativeCover: "lx-native-cover";
+        readonly LxNativeText: "lx-native-text";
+        readonly LxNativeButton: "lx-native-button";
+        readonly LxVideo: "lx-video";
+    };
+    readonly tagToAuthorComponent: {
+        readonly "lx-native-root": "LxNativeRoot";
+        readonly "lx-native-view": "LxNativeView";
+        readonly "lx-native-cover": "LxNativeCover";
+        readonly "lx-native-text": "LxNativeText";
+        readonly "lx-native-button": "LxNativeButton";
+        readonly "lx-video": "LxVideo";
+    };
+    readonly nativeActionIcons: readonly ["close", "play", "pause", "mute", "unmute", "fullscreen", "more"];
+    readonly pointerEvents: readonly ["auto", "none", "box-only", "box-none"];
+    readonly coverScrim: readonly ["none", "top", "bottom", "full"];
+    readonly structureRoles: readonly ["group", "region", "status", "presentation", "none"];
+    readonly buttonIntent: readonly ["neutral", "accent", "destructive"];
+    readonly buttonEmphasis: readonly ["primary", "secondary", "quiet"];
+    readonly buttonSize: readonly ["compact", "regular"];
+    readonly buttonIconPosition: readonly ["start", "end"];
+    readonly videoObjectFit: readonly ["contain", "cover", "fill", "none"];
+    readonly videoContentRotate: readonly [0, 90, 180, 270];
+    readonly watermarkCorners: readonly ["top-start", "top-end", "bottom-start", "bottom-end"];
+    readonly nativeStyle: {
+        readonly layout: readonly ["display", "position", "top", "right", "bottom", "left", "inset", "width", "height", "minWidth", "minHeight", "maxWidth", "maxHeight", "flex", "flexGrow", "flexShrink", "flexBasis", "flexDirection", "flexWrap", "alignItems", "alignSelf", "justifyContent", "gap", "rowGap", "columnGap", "gridTemplateColumns", "gridTemplateRows", "gridColumn", "gridRow", "margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "padding", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "overflow", "aspectRatio", "boxSizing"];
+        readonly paint: readonly ["backgroundColor", "opacity", "border", "borderWidth", "borderColor", "borderStyle", "borderRadius"];
+        readonly unsupportedLayout: readonly ["transform", "translate", "rotate", "scale", "perspective", "clipPath", "maskImage"];
+        readonly unsupportedPaint: readonly ["boxShadow", "filter", "backdropFilter", "mixBlendMode", "backgroundImage", "background", "animation", "transition", "textDecoration", "fontStyle", "letterSpacing", "textShadow"];
+        readonly text: readonly ["fontSize", "fontWeight", "lineHeight", "textAlign", "color"];
+    };
+    readonly interactiveAuthorComponents: readonly ["LxNativeButton", "LxVideo"];
+    readonly containerAuthorComponents: readonly ["LxNativeRoot", "LxNativeView", "LxNativeCover"];
+    readonly recipes: {
+        readonly LxNativeCover: {
+            readonly expandsTo: "view";
+            readonly hostKind: false;
+        };
+        readonly LxNativeButton: {
+            readonly expandsTo: "tappable";
+            readonly hostKind: false;
+        };
+    };
+    readonly capabilityLeaves: {
+        readonly LxVideo: {
+            readonly hostKind: "video";
+            readonly mustBeDirectRootChild: true;
+        };
+    };
+};
+export type NativeErrorCode = (typeof NATIVE_ERROR_CODES)[number];
+export type PublicComponentName = (typeof PUBLIC_COMPONENT_NAMES)[number];
+export type PublicElementTag = (typeof PUBLIC_ELEMENT_TAGS)[number];
+export type CoreKind = (typeof CORE_KINDS)[number];
+export type HostFactoryKind = (typeof HOST_FACTORY_KINDS)[number];
+export type NativeActionIcon = (typeof NATIVE_ACTION_ICONS)[number];
+export type NativeStyleProperty = (typeof NATIVE_STYLE_LAYOUT_FIELDS)[number] | (typeof NATIVE_STYLE_PAINT_FIELDS)[number] | (typeof TEXT_STYLE_PROP_FIELDS)[number];

package/dist/inline-native/schema.js

@@ -0,0 +1,210 @@
+/**
+ * Machine-readable inline-native contract. Wrappers, the structure compiler,
+ * and the host applicator share this object; unknown names are out of contract.
+ */
+export const NATIVE_ERROR_CODES = [
+    "NATIVE_ROOT_UNAVAILABLE",
+    "NATIVE_ROOT_INCOMPATIBLE",
+    "NATIVE_ROOT_INVALID_STRUCTURE",
+    "NATIVE_ROOT_FAILED",
+    "NATIVE_ROOT_UNSUPPORTED_LAYOUT",
+    "NATIVE_COMPONENT_INVALID_PROPS",
+    "NATIVE_COMPONENT_MOUNT_FAILED",
+    "NATIVE_COMPONENT_COMMAND_FAILED",
+    "NATIVE_ROOT_UNSUPPORTED_STYLE",
+    "NATIVE_ROOT_DESTROYED",
+];
+export const PUBLIC_COMPONENT_NAMES = [
+    "LxNativeRoot",
+    "LxNativeView",
+    "LxNativeCover",
+    "LxNativeText",
+    "LxNativeButton",
+    "LxVideo",
+];
+export const PUBLIC_ELEMENT_TAGS = [
+    "lx-native-root",
+    "lx-native-view",
+    "lx-native-cover",
+    "lx-native-text",
+    "lx-native-button",
+    "lx-video",
+];
+export const CORE_KINDS = ["root", "view", "text", "tappable"];
+export const HOST_FACTORY_KINDS = ["root", "view", "text", "tappable", "video"];
+export const AUTHOR_COMPONENT_TO_TAG = {
+    LxNativeRoot: "lx-native-root",
+    LxNativeView: "lx-native-view",
+    LxNativeCover: "lx-native-cover",
+    LxNativeText: "lx-native-text",
+    LxNativeButton: "lx-native-button",
+    LxVideo: "lx-video",
+};
+export const TAG_TO_AUTHOR_COMPONENT = {
+    "lx-native-root": "LxNativeRoot",
+    "lx-native-view": "LxNativeView",
+    "lx-native-cover": "LxNativeCover",
+    "lx-native-text": "LxNativeText",
+    "lx-native-button": "LxNativeButton",
+    "lx-video": "LxVideo",
+};
+export const NATIVE_ACTION_ICONS = [
+    "close",
+    "play",
+    "pause",
+    "mute",
+    "unmute",
+    "fullscreen",
+    "more",
+];
+export const POINTER_EVENTS_VALUES = ["auto", "none", "box-only", "box-none"];
+export const COVER_SCRIM_VALUES = ["none", "top", "bottom", "full"];
+export const STRUCTURE_ROLE_VALUES = [
+    "group",
+    "region",
+    "status",
+    "presentation",
+    "none",
+];
+export const BUTTON_INTENT_VALUES = ["neutral", "accent", "destructive"];
+export const BUTTON_EMPHASIS_VALUES = ["primary", "secondary", "quiet"];
+export const BUTTON_SIZE_VALUES = ["compact", "regular"];
+export const BUTTON_ICON_POSITION_VALUES = ["start", "end"];
+export const VIDEO_OBJECT_FIT_VALUES = ["contain", "cover", "fill", "none"];
+export const VIDEO_CONTENT_ROTATE_VALUES = [0, 90, 180, 270];
+export const WATERMARK_CORNER_VALUES = [
+    "top-start",
+    "top-end",
+    "bottom-start",
+    "bottom-end",
+];
+/** Layout fields measured from the DOM anchor. */
+export const NATIVE_STYLE_LAYOUT_FIELDS = [
+    "display",
+    "position",
+    "top",
+    "right",
+    "bottom",
+    "left",
+    "inset",
+    "width",
+    "height",
+    "minWidth",
+    "minHeight",
+    "maxWidth",
+    "maxHeight",
+    "flex",
+    "flexGrow",
+    "flexShrink",
+    "flexBasis",
+    "flexDirection",
+    "flexWrap",
+    "alignItems",
+    "alignSelf",
+    "justifyContent",
+    "gap",
+    "rowGap",
+    "columnGap",
+    "gridTemplateColumns",
+    "gridTemplateRows",
+    "gridColumn",
+    "gridRow",
+    "margin",
+    "marginTop",
+    "marginRight",
+    "marginBottom",
+    "marginLeft",
+    "padding",
+    "paddingTop",
+    "paddingRight",
+    "paddingBottom",
+    "paddingLeft",
+    "overflow",
+    "aspectRatio",
+    "boxSizing",
+];
+export const NATIVE_STYLE_PAINT_FIELDS = [
+    "backgroundColor",
+    "opacity",
+    "border",
+    "borderWidth",
+    "borderColor",
+    "borderStyle",
+    "borderRadius",
+];
+export const NATIVE_STYLE_UNSUPPORTED_LAYOUT_FIELDS = [
+    "transform",
+    "translate",
+    "rotate",
+    "scale",
+    "perspective",
+    "clipPath",
+    "maskImage",
+];
+export const NATIVE_STYLE_UNSUPPORTED_PAINT_FIELDS = [
+    "boxShadow",
+    "filter",
+    "backdropFilter",
+    "mixBlendMode",
+    "backgroundImage",
+    "background",
+    "animation",
+    "transition",
+    "textDecoration",
+    "fontStyle",
+    "letterSpacing",
+    "textShadow",
+];
+export const TEXT_STYLE_PROP_FIELDS = [
+    "fontSize",
+    "fontWeight",
+    "lineHeight",
+    "textAlign",
+    "color",
+];
+export const INTERACTIVE_AUTHOR_COMPONENTS = [
+    "LxNativeButton",
+    "LxVideo",
+];
+export const CONTAINER_AUTHOR_COMPONENTS = [
+    "LxNativeRoot",
+    "LxNativeView",
+    "LxNativeCover",
+];
+export const INLINE_NATIVE_SCHEMA = {
+    version: 1,
+    publicComponents: PUBLIC_COMPONENT_NAMES,
+    publicElementTags: PUBLIC_ELEMENT_TAGS,
+    coreKinds: CORE_KINDS,
+    hostFactoryKinds: HOST_FACTORY_KINDS,
+    errorCodes: NATIVE_ERROR_CODES,
+    authorComponentToTag: AUTHOR_COMPONENT_TO_TAG,
+    tagToAuthorComponent: TAG_TO_AUTHOR_COMPONENT,
+    nativeActionIcons: NATIVE_ACTION_ICONS,
+    pointerEvents: POINTER_EVENTS_VALUES,
+    coverScrim: COVER_SCRIM_VALUES,
+    structureRoles: STRUCTURE_ROLE_VALUES,
+    buttonIntent: BUTTON_INTENT_VALUES,
+    buttonEmphasis: BUTTON_EMPHASIS_VALUES,
+    buttonSize: BUTTON_SIZE_VALUES,
+    buttonIconPosition: BUTTON_ICON_POSITION_VALUES,
+    videoObjectFit: VIDEO_OBJECT_FIT_VALUES,
+    videoContentRotate: VIDEO_CONTENT_ROTATE_VALUES,
+    watermarkCorners: WATERMARK_CORNER_VALUES,
+    nativeStyle: {
+        layout: NATIVE_STYLE_LAYOUT_FIELDS,
+        paint: NATIVE_STYLE_PAINT_FIELDS,
+        unsupportedLayout: NATIVE_STYLE_UNSUPPORTED_LAYOUT_FIELDS,
+        unsupportedPaint: NATIVE_STYLE_UNSUPPORTED_PAINT_FIELDS,
+        text: TEXT_STYLE_PROP_FIELDS,
+    },
+    interactiveAuthorComponents: INTERACTIVE_AUTHOR_COMPONENTS,
+    containerAuthorComponents: CONTAINER_AUTHOR_COMPONENTS,
+    recipes: {
+        LxNativeCover: { expandsTo: "view", hostKind: false },
+        LxNativeButton: { expandsTo: "tappable", hostKind: false },
+    },
+    capabilityLeaves: {
+        LxVideo: { hostKind: "video", mustBeDirectRootChild: true },
+    },
+};

package/dist/inline-native/structure.d.ts

@@ -0,0 +1,22 @@
+import { type PublicComponentName } from "./schema.js";
+import { type AuthorNode, type CompileInlineNativeOptions, type CompileInlineNativeResult, type CompiledNativeRoot, type NativeError } from "./types.js";
+/**
+ * Compile one author Root into the host core tree. Cover/Button expand here;
+ * illegal children never become a host commit.
+ */
+export declare function compileInlineNativeRoot(author: AuthorNode, options?: CompileInlineNativeOptions): CompileInlineNativeResult;
+/**
+ * Scan a page-level author forest. A bare LxVideo (or a Video nested in a
+ * non-Root) is `NATIVE_ROOT_INVALID_STRUCTURE`.
+ */
+export declare function compileInlineNativeForest(nodes: readonly AuthorNode[], options?: CompileInlineNativeOptions): CompileInlineNativeResult | {
+    ok: true;
+    roots: CompiledNativeRoot[];
+    diagnostics: NativeError[];
+};
+export declare function normalizeAuthorType(type: string | undefined): PublicComponentName | undefined;
+export declare function parseBooleanAttr(value: unknown, defaultValue?: boolean): boolean;
+/** Collect author nodes from a Root element's light DOM (skips fallback). */
+export declare function collectAuthorTreeFromElement(root: Element): AuthorNode;
+export declare function findInlineNativeRoot(element: Element): Element | null;
+export declare function isFallbackElement(element: Element): boolean;