@ohos-ports/stacksjs-stx 0.2.287-beta.0

package/dist/composition-api.d.ts

@@ -0,0 +1,197 @@
+/**
+ * Generate a unique scope ID.
+ */
+export declare function generateScopeId(): string;
+/**
+ * Create a new component instance.
+ */
+export declare function createComponentInstance(parent?: StxComponentInstance | null): StxComponentInstance;
+/**
+ * Set the current component instance for setup execution.
+ * @internal
+ */
+export declare function setCurrentInstance(instance: StxComponentInstance | null): void;
+/**
+ * Get the current component instance.
+ * Must be called during component setup (inside <script> block).
+ *
+ * ```ts
+ * const instance = getCurrentInstance()
+ * console.log(instance?.props)
+ * ```
+ */
+export declare function getCurrentInstance(): StxComponentInstance | null;
+/**
+ * Reset all component instance state.
+ * @internal - Used for testing to clear global state between tests.
+ */
+export declare function resetComponentState(): void;
+/**
+ * Provide a value for injection into descendant components.
+ *
+ * ```ts
+ * // Parent component
+ * provide('theme', 'dark')
+ * provide('user', { name: 'Alice' })
+ * ```
+ *
+ * @param key - Injection key (string or symbol)
+ * @param value - The value to provide
+ */
+export declare function provide<T>(key: string | symbol, value: T): void;
+/**
+ * Inject a value provided by an ancestor component.
+ *
+ * ```ts
+ * // Child component
+ * const theme = inject('theme', 'light') // 'dark' if provided, 'light' as fallback
+ * const user = inject<{ name: string }>('user')
+ * ```
+ *
+ * @param key - Injection key to look up
+ * @param defaultValue - Fallback value if not provided by any ancestor
+ * @returns The injected value, or defaultValue if not found
+ */
+export declare function inject<T>(key: string | symbol, defaultValue?: T): T | undefined;
+/**
+ * Set a global provide value (used by createApp().provide()).
+ * @internal
+ */
+export declare function setGlobalProvide<T>(key: string | symbol, value: T): void;
+/**
+ * Define the events a component can emit.
+ * Returns a typed emit function.
+ *
+ * ```ts
+ * const emit = defineEmits<{
+ *   change: [value: string]
+ *   'update:modelValue': [value: any]
+ * }>()
+ *
+ * // Or with string array
+ * const emit = defineEmits(['change', 'update:modelValue'])
+ *
+ * emit('change', 'newValue')
+ * ```
+ */
+export declare function defineEmits<T extends Record<string, any[]> = Record<string, any[]>>(events?: string[] | T): EmitFn<Extract<keyof T, string>>;
+/**
+ * Expose public properties from a component instance.
+ * These properties become accessible via template refs from the parent.
+ *
+ * ```ts
+ * const count = ref(0)
+ * const increment = () => count.value++
+ *
+ * defineExpose({ count, increment })
+ * ```
+ *
+ * @param exposed - Object of properties to expose
+ */
+export declare function defineExpose(exposed: Record<string, unknown>): void;
+/**
+ * Wait for the next DOM update cycle.
+ *
+ * ```ts
+ * await nextTick()
+ * // DOM is now updated
+ *
+ * // Or with callback:
+ * nextTick(() => {
+ *   // DOM is now updated
+ * })
+ * ```
+ *
+ * @param fn - Optional callback to run after the tick
+ * @returns Promise that resolves after the next microtask
+ */
+export declare function nextTick(fn?: () => void): Promise<void>;
+/**
+ * Register an error captured hook.
+ * Called when an error is captured from a descendant component.
+ *
+ * ```ts
+ * onErrorCaptured((error, instance, info) => {
+ *   console.error('Caught error:', error, info)
+ *   return false // prevents further propagation
+ * })
+ * ```
+ *
+ * @param hook - Error handler function. Return false to stop propagation.
+ */
+export declare function onErrorCaptured(hook: (error: Error, instance: StxComponentInstance | null, info: string) => boolean | void): void;
+/**
+ * Propagate an error up the component tree.
+ * Calls onErrorCaptured hooks on each ancestor.
+ * @internal
+ */
+export declare function handleError(error: Error, instance: StxComponentInstance | null, info: string): void;
+/**
+ * Get the current component's slots.
+ *
+ * ```ts
+ * const slots = useSlots()
+ * if (slots.header) {
+ *   // render header slot
+ * }
+ * ```
+ */
+export declare function useSlots(): Record<string, any>;
+/**
+ * Declare the component's typed slot contract.
+ *
+ * The type parameter is the contract surface (mirrors Vue 3.3's `defineSlots`):
+ * editors and `.d.ts` consumers see exactly which slots a component renders and
+ * what props each slot receives. At runtime it returns the live slots object —
+ * the same value as {@link useSlots} — so it is usable as both a type anchor and
+ * a runtime accessor.
+ *
+ * ```ts
+ * interface Slots {
+ *   default: () => unknown
+ *   header?: (props: { title: string }) => unknown
+ * }
+ * const slots = defineSlots<Slots>()
+ * if (slots.header) { ... }
+ * ```
+ */
+export declare function defineSlots<T extends Record<string, (...args: any[]) => any> = Record<string, (...args: any[]) => any>,>(): T;
+/**
+ * Get the current component's non-prop attributes.
+ *
+ * ```ts
+ * const attrs = useAttrs()
+ * // attrs contains all attributes not declared as props
+ * ```
+ */
+export declare function useAttrs(): Record<string, unknown>;
+/**
+ * Integrate provide/inject with the server-side template context.
+ * Called during component rendering in process.ts.
+ * @internal
+ */
+export declare function createProvideContext(parentContext: Record<string, any>): Record<string, any>;
+/**
+ * Generate the client-side runtime code for the Composition API.
+ * This is injected into the page's runtime script.
+ * @internal
+ */
+export declare function generateCompositionRuntime(): string;
+/** Represents a component instance in the stx component tree */
+export declare interface StxComponentInstance {
+  scopeId: string
+  parent: StxComponentInstance | null
+  provides: Map<string | symbol, unknown>
+  exposed: Record<string, unknown> | null
+  refs: Record<string, Element | null>
+  props: Record<string, unknown>
+  attrs: Record<string, unknown>
+  slots: Record<string, any>
+  emit: EmitFn
+  el: Element | null
+  errorCapturedHooks: Array<(error: Error, instance: StxComponentInstance | null, info: string) => boolean | void>
+  isMounted: boolean
+}
+/** Type-safe emit function */
+// eslint-disable-next-line pickier/no-unused-vars
+export type EmitFn<T extends string = string> = (event: T, ...args: any[]) => void;

package/dist/composition-api.js

@@ -0,0 +1,199 @@
+let currentInstance = null;
+const instanceStack = [];
+let scopeCounter = 0;
+export function generateScopeId() {
+  return `stx-${++scopeCounter}`;
+}
+export function createComponentInstance(parent = null) {
+  return {
+    scopeId: generateScopeId(),
+    parent,
+    provides: new Map(parent?.provides),
+    exposed: null,
+    refs: {},
+    props: {},
+    attrs: {},
+    slots: {},
+    emit: () => {},
+    el: null,
+    errorCapturedHooks: [],
+    isMounted: !1
+  };
+}
+export function setCurrentInstance(instance) {
+  if (instance)
+    instanceStack.push(instance);
+  else if (instanceStack.length > 0)
+    instanceStack.pop();
+  currentInstance = instance || instanceStack[instanceStack.length - 1] || null;
+}
+export function getCurrentInstance() {
+  return currentInstance;
+}
+export function resetComponentState() {
+  currentInstance = null;
+  instanceStack.length = 0;
+}
+export function provide(key, value) {
+  if (currentInstance)
+    currentInstance.provides.set(key, value);
+  else
+    globalProvides.set(key, value);
+}
+export function inject(key, defaultValue) {
+  let instance = currentInstance;
+  while (instance) {
+    if (instance.provides.has(key))
+      return instance.provides.get(key);
+    instance = instance.parent;
+  }
+  if (globalProvides.has(key))
+    return globalProvides.get(key);
+  return defaultValue;
+}
+const globalProvides = new Map;
+export function setGlobalProvide(key, value) {
+  globalProvides.set(key, value);
+}
+export function defineEmits(events) {
+  const instance = currentInstance, element = instance?.el, declaredEvents = Array.isArray(events) ? events : events && typeof events === "object" ? Object.keys(events) : [];
+  if (element && declaredEvents.length > 0) {
+    const emittedEvents = element.__stx_component_emits ||= Object.create(null);
+    for (const event of declaredEvents)
+      emittedEvents[event] = !0;
+  }
+  const emit = (event, ...args) => {
+    if (typeof document > "u")
+      return;
+    if (element) {
+      const emittedEvents = element.__stx_component_emits ||= Object.create(null);
+      emittedEvents[event] = !0;
+      element.dispatchEvent(new CustomEvent(event, {
+        detail: args.length === 1 ? args[0] : args,
+        bubbles: !0,
+        cancelable: !0
+      }));
+    }
+  };
+  if (instance)
+    instance.emit = emit;
+  return emit;
+}
+export function defineExpose(exposed) {
+  if (currentInstance)
+    currentInstance.exposed = exposed;
+}
+export function nextTick(fn) {
+  const p = Promise.resolve();
+  return fn ? p.then(fn) : p;
+}
+export function onErrorCaptured(hook) {
+  if (currentInstance)
+    currentInstance.errorCapturedHooks.push(hook);
+}
+export function handleError(error, instance, info) {
+  let current = instance?.parent;
+  while (current) {
+    for (const hook of current.errorCapturedHooks)
+      if (hook(error, instance, info) === !1)
+        return;
+    current = current.parent;
+  }
+}
+export function useSlots() {
+  return currentInstance?.slots ?? {};
+}
+export function defineSlots() {
+  return currentInstance?.slots ?? {};
+}
+export function useAttrs() {
+  return currentInstance?.attrs ?? {};
+}
+export function createProvideContext(parentContext) {
+  const provides = parentContext.__provides ? new Map(Object.entries(parentContext.__provides)) : new Map;
+  return {
+    ...parentContext,
+    __provides: provides,
+    __provide(key, value) {
+      provides.set(key, value);
+    },
+    __inject(key, defaultValue) {
+      if (provides.has(key))
+        return provides.get(key);
+      if (parentContext.__provides) {
+        const parentProvides = parentContext.__provides instanceof Map ? parentContext.__provides : new Map(Object.entries(parentContext.__provides));
+        if (parentProvides.has(key))
+          return parentProvides.get(key);
+      }
+      return defaultValue;
+    }
+  };
+}
+export function generateCompositionRuntime() {
+  return `
+// STX Composition API Runtime
+(function() {
+  const _provides = new Map();
+  const _scopes = window.__stx_scopes || (window.__stx_scopes = {});
+  const _exposed = window.__stx_exposed || (window.__stx_exposed = {});
+
+  // provide() stores values in the nearest scope's provide map
+  window.__stx_provide = function(key, value) {
+    _provides.set(key, value);
+  };
+
+  // inject() walks up DOM ancestors with data-stx-scope to find provided values
+  window.__stx_inject = function(key, defaultValue, el) {
+    // Walk up the DOM tree
+    let current = el ? el.closest('[data-stx-scope]') : null;
+    while (current) {
+      const scopeId = current.getAttribute('data-stx-scope');
+      const scope = _scopes[scopeId];
+      if (scope && scope.__provided && scope.__provided.has(key)) {
+        return scope.__provided.get(key);
+      }
+      current = current.parentElement ? current.parentElement.closest('[data-stx-scope]') : null;
+    }
+    // Check global provides
+    if (_provides.has(key)) return _provides.get(key);
+    return defaultValue;
+  };
+
+  // defineEmits() returns an emit function
+  window.__stx_defineEmits = function(scopeId) {
+    return function emit(event, ...args) {
+      const el = document.querySelector('[data-stx-scope="' + scopeId + '"]');
+      if (el) {
+        el.dispatchEvent(new CustomEvent(event, {
+          detail: args.length === 1 ? args[0] : args,
+          bubbles: true,
+          cancelable: true
+        }));
+      }
+    };
+  };
+
+  // defineExpose() registers exposed properties
+  window.__stx_defineExpose = function(scopeId, exposed) {
+    _exposed[scopeId] = exposed;
+  };
+
+  // nextTick()
+  window.__stx_nextTick = function(fn) {
+    return Promise.resolve().then(fn);
+  };
+
+  // Template ref resolution
+  window.__stx_resolveRefs = function(scopeId) {
+    const scope = document.querySelector('[data-stx-scope="' + scopeId + '"]');
+    if (!scope) return {};
+    const refs = {};
+    // eslint-disable-next-line pickier/no-unused-vars
+    scope.querySelectorAll('[data-stx-ref]').forEach(function(el) {
+      refs[el.getAttribute('data-stx-ref')] = el;
+    });
+    return refs;
+  };
+})();
+`;
+}

package/dist/compression.d.ts

@@ -0,0 +1,30 @@
+/** Whether this content type is worth compressing. */
+export declare function isCompressible(contentType: string | null): boolean;
+/**
+ * The best encoding both sides support, or `null` for none.
+ *
+ * This used to be `accepted.includes('br')` on the raw header, on the argument
+ * that q-values are only ever sent by testing tools. The substring is the
+ * problem: `br;q=0` contains `br`, and it is the one string in the header that
+ * means *do not send me brotli*. Answering that with a brotli body is not a
+ * missed optimisation, it is a response the client cannot read — the failure
+ * this function's `Vary` sibling exists to prevent, arrived at from the other
+ * direction.
+ *
+ * Brotli is still preferred when both are genuinely on offer: ~20% smaller
+ * than gzip on HTML at comparable cost, and every browser without it predates
+ * 2017.
+ */
+export declare function negotiateEncoding(acceptEncoding: string | null): 'br' | 'gzip' | null;
+/**
+ * Return `response` compressed, or unchanged when it should not be.
+ *
+ * Never throws and never drops a body: a failed compress logs nothing and
+ * returns the original, because shipping bytes uncompressed is a slower
+ * success and a broken compress step is an outage.
+ */
+export declare function compressResponse(request: Request, response: Response, options?: CompressionOptions): Promise<Response>;
+export declare interface CompressionOptions {
+  threshold?: number
+  quality?: number
+}

package/dist/compression.js

@@ -0,0 +1,107 @@
+import zlib from "node:zlib";
+import { promisify } from "node:util";
+const brotliCompress = promisify(zlib.brotliCompress), gzipCompress = promisify(zlib.gzip), COMPRESSIBLE = [
+  "text/",
+  "application/json",
+  "application/javascript",
+  "application/xml",
+  "application/xhtml+xml",
+  "application/rss+xml",
+  "application/atom+xml",
+  "application/manifest+json",
+  "image/svg+xml"
+], NEVER_BUFFER = [
+  "text/event-stream",
+  "multipart/x-mixed-replace"
+], MIN_BYTES = 1024;
+export function isCompressible(contentType) {
+  if (!contentType)
+    return !1;
+  const type = contentType.toLowerCase();
+  if (NEVER_BUFFER.some((prefix) => type.startsWith(prefix)))
+    return !1;
+  return COMPRESSIBLE.some((prefix) => type.startsWith(prefix));
+}
+function parseAcceptEncoding(header) {
+  const weights = new Map;
+  for (const part of header.split(",")) {
+    const [rawName, ...params] = part.trim().split(";"), name = rawName.trim().toLowerCase();
+    if (!name)
+      continue;
+    let quality = 1;
+    for (const param of params) {
+      const match = /^\s*q\s*=\s*([\d.]+)\s*$/i.exec(param);
+      if (!match)
+        continue;
+      const parsed = Number.parseFloat(match[1]);
+      if (Number.isFinite(parsed))
+        quality = parsed;
+    }
+    weights.set(name, quality);
+  }
+  return weights;
+}
+export function negotiateEncoding(acceptEncoding) {
+  if (!acceptEncoding)
+    return null;
+  const weights = parseAcceptEncoding(acceptEncoding), wildcard = weights.get("*"), quality = (coding) => weights.get(coding) ?? wildcard ?? 0;
+  if (quality("br") > 0)
+    return "br";
+  if (quality("gzip") > 0)
+    return "gzip";
+  return null;
+}
+export async function compressResponse(request, response, options = {}) {
+  if (response.headers.get("content-encoding"))
+    return response;
+  if (response.status === 204 || response.status === 304 || !response.body)
+    return response;
+  if (!isCompressible(response.headers.get("content-type")))
+    return response;
+  const encoding = negotiateEncoding(request.headers.get("accept-encoding"));
+  if (!encoding)
+    return response;
+  let body;
+  try {
+    body = new Uint8Array(await response.arrayBuffer());
+  } catch {
+    return response;
+  }
+  const passthrough = () => new Response(body, {
+    status: response.status,
+    statusText: response.statusText,
+    headers: varyByAcceptEncoding(response.headers)
+  });
+  if (body.length < (options.threshold ?? MIN_BYTES))
+    return passthrough();
+  try {
+    const compressed = encoding === "br" ? await brotliCompress(body, {
+      params: {
+        [zlib.constants.BROTLI_PARAM_QUALITY]: options.quality ?? 5,
+        [zlib.constants.BROTLI_PARAM_SIZE_HINT]: body.length
+      }
+    }) : await gzipCompress(body);
+    if (compressed.length >= body.length)
+      return passthrough();
+    const headers = varyByAcceptEncoding(response.headers);
+    headers.set("Content-Encoding", encoding);
+    headers.set("Content-Length", String(compressed.length));
+    return new Response(compressed, {
+      status: response.status,
+      statusText: response.statusText,
+      headers
+    });
+  } catch {
+    return passthrough();
+  }
+}
+function varyByAcceptEncoding(source) {
+  const headers = new Headers(source), existing = headers.get("Vary");
+  if (!existing) {
+    headers.set("Vary", "Accept-Encoding");
+    return headers;
+  }
+  if (!existing.split(",").some((field) => field.trim().toLowerCase() === "accept-encoding"))
+    headers.set("Vary", `${existing}, Accept-Encoding`);
+  return headers;
+}

package/dist/computed.d.ts

@@ -0,0 +1,138 @@
+/**
+ * Computed Properties Module
+ *
+ * Provides reactive computed values with automatic dependency tracking.
+ * Computed properties automatically update when their dependencies change,
+ * and are cached until dependencies are modified.
+ *
+ * @example
+ * ```typescript
+ * const firstName = ref('John')
+ * const lastName = ref('Doe')
+ *
+ * const fullName = computed(() => `${firstName.value} ${lastName.value}`)
+ *
+ * console.log(fullName.value) // 'John Doe'
+ * firstName.value = 'Jane'
+ * console.log(fullName.value) // 'Jane Doe'
+ * ```
+ */
+export interface Ref<T> {
+    value: T;
+    /** Subscribe to value changes */
+    subscribe: (callback: (value: T) => void) => () => void;
+    /** Get raw value without tracking */
+    peek: () => T;
+}
+export interface ComputedRef<T> extends Ref<T> {
+    /** Force recalculation */
+    invalidate: () => void;
+    /** Check if value is dirty (needs recalculation) */
+    readonly dirty: boolean;
+    /** Get all dependencies */
+    readonly deps: Set<Ref<unknown>>;
+}
+export interface WritableComputedRef<T> extends ComputedRef<T> {
+    value: T;
+}
+export interface ComputedOptions<T> {
+    /** Getter function */
+    get: () => T;
+    /** Optional setter function */
+    set?: (value: T) => void;
+    /** Lazy evaluation (default: true) */
+    lazy?: boolean;
+    /** Custom equality check */
+    equals?: (a: T, b: T) => boolean;
+}
+export interface WatchOptions {
+    /** Run immediately with current value */
+    immediate?: boolean;
+    /** Deep watch for object changes */
+    deep?: boolean;
+    /** Flush timing: 'pre' | 'post' | 'sync' */
+    flush?: 'pre' | 'post' | 'sync';
+    /** Stop watching after first change */
+    once?: boolean;
+}
+export interface WatchStopHandle {
+    (): void;
+    pause: () => void;
+    resume: () => void;
+}
+/**
+ * Create a reactive reference
+ */
+export declare function ref<T>(initialValue: T): Ref<T>;
+/**
+ * Check if a value is a ref
+ */
+export declare function isRef<T>(value: unknown): value is Ref<T>;
+/**
+ * Unwrap a ref to get its value
+ */
+export declare function unref<T>(value: T | Ref<T>): T;
+/**
+ * Convert all properties of an object to refs
+ */
+export declare function toRefs<T extends object>(obj: T): {
+    [K in keyof T]: Ref<T[K]>;
+};
+/**
+ * Create a shallow reactive object
+ */
+export declare function shallowRef<T>(initialValue: T): Ref<T>;
+/**
+ * Create a computed property with automatic dependency tracking
+ */
+export declare function computed<T>(getter: () => T): ComputedRef<T>;
+export declare function computed<T>(options: ComputedOptions<T>): WritableComputedRef<T>;
+/**
+ * Watch a reactive source and run a callback when it changes
+ */
+export declare function watch<T>(source: Ref<T> | (() => T), callback: (newValue: T, oldValue: T | undefined) => void, options?: WatchOptions): WatchStopHandle;
+/**
+ * Watch multiple sources
+ */
+export declare function watchMultiple<T extends readonly Ref<unknown>[]>(sources: [...T], callback: (newValues: {
+    [K in keyof T]: T[K] extends Ref<infer V> ? V : never;
+}, oldValues: {
+    [K in keyof T]: T[K] extends Ref<infer V> ? V | undefined : never;
+}) => void, options?: WatchOptions): WatchStopHandle;
+/**
+ * Watch and run effect immediately, auto-tracking dependencies
+ */
+export declare function watchEffect(effect: () => void | (() => void), options?: Pick<WatchOptions, 'flush'>): WatchStopHandle;
+/**
+ * Process @computed directives in templates
+ */
+export declare function processComputedDirectives(template: string, context?: Record<string, unknown>, _filePath?: string): string;
+/**
+ * Process @watch directives in templates
+ */
+export declare function processWatchDirectives(template: string, _context?: Record<string, unknown>, _filePath?: string): string;
+/**
+ * Create a debounced computed
+ */
+export declare function debouncedComputed<T>(getter: () => T, delay?: number): ComputedRef<T>;
+/**
+ * Create a throttled computed
+ */
+export declare function throttledComputed<T>(getter: () => T, limit?: number): ComputedRef<T>;
+export { ref as stxRef, computed as stxComputed, watch as stxWatch, watchMultiple as stxWatchMultiple, watchEffect as stxWatchEffect, isRef as stxIsRef, unref as stxUnref, toRefs as stxToRefs, shallowRef as stxShallowRef, debouncedComputed as stxDebouncedComputed, throttledComputed as stxThrottledComputed, };
+declare const _default: {
+    ref: typeof ref;
+    computed: typeof computed;
+    watch: typeof watch;
+    watchMultiple: typeof watchMultiple;
+    watchEffect: typeof watchEffect;
+    isRef: typeof isRef;
+    unref: typeof unref;
+    toRefs: typeof toRefs;
+    shallowRef: typeof shallowRef;
+    debouncedComputed: typeof debouncedComputed;
+    throttledComputed: typeof throttledComputed;
+    processComputedDirectives: typeof processComputedDirectives;
+    processWatchDirectives: typeof processWatchDirectives;
+};
+export default _default;