@hanwenbo/x-taro-ui 0.0.1

package/lib/components/internal/internal.js

@@ -0,0 +1,85 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/internal/internal.tsx
+var internal_exports = {};
+__export(internal_exports, {
+  Internal: () => Internal,
+  default: () => internal_default
+});
+module.exports = __toCommonJS(internal_exports);
+var import_react = __toESM(require("react"));
+var import_components = require("@tarojs/components");
+var import_utils = require("../../utils");
+var import_theme = require("../../theme");
+var import_render = require("../_shared/render");
+var Internal = ({
+  title = "Internal",
+  description,
+  tone = "default",
+  children,
+  className,
+  style
+}) => {
+  const { theme } = (0, import_theme.useTheme)();
+  const toneColor = tone === "warning" ? theme.colors.warning : theme.colors.primary;
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_components.View,
+    {
+      className: (0, import_utils.classNames)("x-internal", `x-internal--${tone}`, className),
+      style: {
+        padding: 14,
+        borderRadius: "var(--x-radius-xl)",
+        borderWidth: 1,
+        borderStyle: "solid",
+        borderColor: tone === "muted" ? theme.colors.border : toneColor,
+        backgroundColor: tone === "muted" ? theme.colors.muted : `${toneColor}12`,
+        display: "flex",
+        flexDirection: "column",
+        gap: 6,
+        ...style
+      }
+    },
+    (0, import_render.renderTextNode)(title, {
+      fontSize: 13,
+      fontWeight: "600",
+      color: tone === "muted" ? theme.colors.foreground : toneColor
+    }),
+    (0, import_render.renderTextNode)(description, {
+      fontSize: 12,
+      lineHeight: "1.5",
+      color: theme.colors["muted-foreground"]
+    }),
+    children
+  );
+};
+var internal_default = Internal;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Internal
+});

package/lib/components/internal/selectionControl/presentation.d.ts

@@ -0,0 +1,31 @@
+export interface XSelectionFrame {
+    left: number;
+    width: number;
+    height: number;
+}
+export interface XStaticIndicatorMetrics {
+    left: number;
+    width: number;
+}
+export declare const xSelectionControlPresentationModel: {
+    frameComparisonTolerance: number;
+    resolveStaticIndicatorMetrics(frame: XSelectionFrame, options?: {
+        horizontalInset?: number;
+    }): XStaticIndicatorMetrics;
+    resolvePillIndicatorMetrics(frame: XSelectionFrame, options?: {
+        inset?: number;
+    }): {
+        left: number;
+        width: number;
+        height: number;
+    };
+    resolveTabsIndicatorMetrics(frame: XSelectionFrame, options?: {
+        indicatorWidth?: number;
+        indicatorWhiteSpaceRatio?: number;
+        minWidth?: number;
+    }): {
+        left: number;
+        width: number;
+    };
+};
+//# sourceMappingURL=presentation.d.ts.map

package/lib/components/internal/selectionControl/presentation.js

@@ -0,0 +1,58 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/internal/selectionControl/presentation.ts
+var presentation_exports = {};
+__export(presentation_exports, {
+  xSelectionControlPresentationModel: () => xSelectionControlPresentationModel
+});
+module.exports = __toCommonJS(presentation_exports);
+var FRAME_COMPARISON_TOLERANCE = 0.5;
+var xSelectionControlPresentationModel = {
+  frameComparisonTolerance: FRAME_COMPARISON_TOLERANCE,
+  resolveStaticIndicatorMetrics(frame, options = {}) {
+    const horizontalInset = options.horizontalInset ?? 0;
+    return {
+      left: frame.left + horizontalInset / 2,
+      width: Math.max(frame.width - horizontalInset, 0)
+    };
+  },
+  resolvePillIndicatorMetrics(frame, options = {}) {
+    const inset = options.inset ?? 0;
+    return {
+      left: frame.left + inset,
+      width: Math.max(frame.width - inset * 2, 0),
+      height: Math.max(frame.height - inset * 2, 0)
+    };
+  },
+  resolveTabsIndicatorMetrics(frame, options = {}) {
+    const { indicatorWidth, indicatorWhiteSpaceRatio = 0.35, minWidth = 0 } = options;
+    const resolvedWidth = Math.max(
+      minWidth,
+      indicatorWidth ?? frame.width * indicatorWhiteSpaceRatio
+    );
+    return {
+      left: frame.left + (frame.width - resolvedWidth) / 2,
+      width: resolvedWidth
+    };
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  xSelectionControlPresentationModel
+});

package/lib/components/internal/selectionControl/useTaroScrollIntoView.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Keeps a horizontally selected item visible on H5 and mini-program ScrollView.
+ *
+ * `scrollIntoView` remains the native channel. The measured `scrollLeft` value is
+ * the H5-compatible fallback and also gives native runtimes a deterministic
+ * centered target when their scroll-into-view implementation is delayed.
+ */
+export declare function useTaroScrollIntoView({ activeKey, containerId, enabled, itemId }: {
+    activeKey?: string;
+    containerId: string;
+    enabled: boolean;
+    itemId: (key: string) => string;
+}): {
+    recordScroll: (event: any) => void;
+    scrollIntoView: string | undefined;
+    scrollLeft: number | undefined;
+    scrollToKey: (key: string) => void;
+};
+//# sourceMappingURL=useTaroScrollIntoView.d.ts.map

package/lib/components/internal/selectionControl/useTaroScrollIntoView.js

@@ -0,0 +1,78 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/internal/selectionControl/useTaroScrollIntoView.ts
+var useTaroScrollIntoView_exports = {};
+__export(useTaroScrollIntoView_exports, {
+  useTaroScrollIntoView: () => useTaroScrollIntoView
+});
+module.exports = __toCommonJS(useTaroScrollIntoView_exports);
+var import_react = require("react");
+var import_measure = require("../../../adapters/miniapp/measure");
+function useTaroScrollIntoView({
+  activeKey,
+  containerId,
+  enabled,
+  itemId
+}) {
+  const currentScrollLeft = (0, import_react.useRef)(0);
+  const [request, setRequest] = (0, import_react.useState)(null);
+  const [scrollLeft, setScrollLeft] = (0, import_react.useState)();
+  const scrollToKey = (0, import_react.useCallback)((key) => {
+    setRequest((current) => ({ key, sequence: ((current == null ? void 0 : current.sequence) ?? 0) + 1 }));
+  }, []);
+  (0, import_react.useEffect)(() => {
+    if (enabled && activeKey) scrollToKey(activeKey);
+  }, [activeKey, enabled, scrollToKey]);
+  (0, import_react.useEffect)(() => {
+    if (!enabled || !request) return;
+    let cancelled = false;
+    const timer = setTimeout(async () => {
+      const [container, item] = await Promise.all([
+        (0, import_measure.measureNode)(`#${containerId}`),
+        (0, import_measure.measureNode)(`#${itemId(request.key)}`)
+      ]);
+      if (cancelled || !container || !item) return;
+      const nextScrollLeft = Math.max(
+        0,
+        currentScrollLeft.current + (item.left - container.left) - Math.max(0, (container.width - item.width) / 2)
+      );
+      setScrollLeft(nextScrollLeft);
+    }, 32);
+    return () => {
+      cancelled = true;
+      clearTimeout(timer);
+    };
+  }, [containerId, enabled, itemId, request]);
+  const recordScroll = (0, import_react.useCallback)((event) => {
+    var _a, _b;
+    currentScrollLeft.current = Number(
+      ((_a = event == null ? void 0 : event.detail) == null ? void 0 : _a.scrollLeft) ?? ((_b = event == null ? void 0 : event.currentTarget) == null ? void 0 : _b.scrollLeft) ?? 0
+    );
+  }, []);
+  return {
+    recordScroll,
+    scrollIntoView: request ? itemId(request.key) : void 0,
+    scrollLeft,
+    scrollToKey
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useTaroScrollIntoView
+});

package/lib/components/internal/selectionControl/useTaroSelectionIndicator.d.ts

@@ -0,0 +1,22 @@
+export interface TaroIndicatorStyle {
+    width: number;
+    opacity: number;
+    transform: string;
+    height?: number;
+}
+export declare function useTaroSelectionIndicator({ activeKey, enabled, inset, mode, indicatorWidth, indicatorWhiteSpaceRatio }: {
+    activeKey: string | null;
+    enabled?: boolean;
+    inset?: number;
+    mode?: 'static' | 'pill' | 'tabs';
+    indicatorWidth?: number;
+    indicatorWhiteSpaceRatio?: number;
+}): {
+    containerId: string;
+    itemId: (key: string) => string;
+    indicatorStyle: TaroIndicatorStyle;
+    indicatorReady: boolean;
+    indicatorMotionReady: boolean;
+    remeasure: () => Promise<void>;
+};
+//# sourceMappingURL=useTaroSelectionIndicator.d.ts.map

package/lib/components/internal/selectionControl/useTaroSelectionIndicator.js

@@ -0,0 +1,150 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/internal/selectionControl/useTaroSelectionIndicator.ts
+var useTaroSelectionIndicator_exports = {};
+__export(useTaroSelectionIndicator_exports, {
+  useTaroSelectionIndicator: () => useTaroSelectionIndicator
+});
+module.exports = __toCommonJS(useTaroSelectionIndicator_exports);
+var import_react = require("react");
+var import_measure = require("../../../adapters/miniapp/measure");
+var import_presentation = require("./presentation");
+var hiddenStyle = {
+  width: 0,
+  opacity: 0,
+  transform: "translateX(0px)"
+};
+function useTaroSelectionIndicator({
+  activeKey,
+  enabled = true,
+  inset = 0,
+  mode = "static",
+  indicatorWidth,
+  indicatorWhiteSpaceRatio = 0.35
+}) {
+  const reactId = (0, import_react.useId)();
+  const instanceId = (0, import_react.useMemo)(() => reactId.replace(/:/g, ""), [reactId]);
+  const containerId = `x-sel-${instanceId}`;
+  const itemId = (0, import_react.useCallback)((key) => `x-sel-item-${instanceId}-${key}`, [instanceId]);
+  const [indicatorStyle, setIndicatorStyle] = (0, import_react.useState)(hiddenStyle);
+  const [indicatorReady, setIndicatorReady] = (0, import_react.useState)(false);
+  const [indicatorMotionReady, setIndicatorMotionReady] = (0, import_react.useState)(false);
+  const hasMeasuredRef = (0, import_react.useRef)(false);
+  const measureRequestRef = (0, import_react.useRef)(0);
+  const motionTimerRef = (0, import_react.useRef)(null);
+  const resetIndicator = (0, import_react.useCallback)(() => {
+    if (motionTimerRef.current) {
+      clearTimeout(motionTimerRef.current);
+      motionTimerRef.current = null;
+    }
+    hasMeasuredRef.current = false;
+    setIndicatorStyle(hiddenStyle);
+    setIndicatorReady(false);
+    setIndicatorMotionReady(false);
+  }, []);
+  const remeasure = (0, import_react.useCallback)(async () => {
+    const requestId = ++measureRequestRef.current;
+    if (!enabled || activeKey === null) {
+      resetIndicator();
+      return;
+    }
+    const container = await (0, import_measure.measureNode)(`#${containerId}`);
+    const item = await (0, import_measure.measureNode)(`#${itemId(activeKey)}`);
+    if (requestId !== measureRequestRef.current) {
+      return;
+    }
+    if (!container || !item) {
+      resetIndicator();
+      return;
+    }
+    const frame = {
+      left: item.left - container.left,
+      width: item.width,
+      height: item.height
+    };
+    const metrics = mode === "pill" ? import_presentation.xSelectionControlPresentationModel.resolvePillIndicatorMetrics(frame, { inset }) : mode === "tabs" ? import_presentation.xSelectionControlPresentationModel.resolveTabsIndicatorMetrics(frame, {
+      indicatorWidth,
+      indicatorWhiteSpaceRatio
+    }) : import_presentation.xSelectionControlPresentationModel.resolveStaticIndicatorMetrics(frame, {
+      horizontalInset: inset
+    });
+    const nextStyle = {
+      width: metrics.width,
+      height: "height" in metrics && typeof metrics.height === "number" ? metrics.height : void 0,
+      opacity: metrics.width > 0 ? 1 : 0,
+      transform: `translateX(${metrics.left}px)`
+    };
+    if (!hasMeasuredRef.current) {
+      if (motionTimerRef.current) {
+        clearTimeout(motionTimerRef.current);
+      }
+      setIndicatorMotionReady(false);
+      setIndicatorStyle(nextStyle);
+      setIndicatorReady(true);
+      hasMeasuredRef.current = true;
+      motionTimerRef.current = setTimeout(() => {
+        setIndicatorMotionReady(true);
+        motionTimerRef.current = null;
+      }, 16);
+      return;
+    }
+    setIndicatorStyle(nextStyle);
+    setIndicatorReady(true);
+  }, [
+    activeKey,
+    containerId,
+    enabled,
+    inset,
+    indicatorWidth,
+    indicatorWhiteSpaceRatio,
+    itemId,
+    mode,
+    resetIndicator
+  ]);
+  (0, import_react.useEffect)(() => {
+    const timer = setTimeout(() => {
+      void remeasure();
+    }, 32);
+    return () => {
+      clearTimeout(timer);
+      measureRequestRef.current += 1;
+    };
+  }, [activeKey, remeasure]);
+  (0, import_react.useEffect)(
+    () => () => {
+      measureRequestRef.current += 1;
+      if (motionTimerRef.current) {
+        clearTimeout(motionTimerRef.current);
+      }
+    },
+    []
+  );
+  return {
+    containerId,
+    itemId,
+    indicatorStyle,
+    indicatorReady,
+    indicatorMotionReady,
+    remeasure
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useTaroSelectionIndicator
+});

package/lib/components/internal/types.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export interface InternalProps {
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    tone?: 'default' | 'muted' | 'warning';
+    children?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+//# sourceMappingURL=types.d.ts.map

package/lib/components/internal/types.js

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/internal/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

package/lib/components/item/index.d.ts

@@ -0,0 +1,4 @@
+export * from './types';
+export { Item, ItemMedia, ItemContent, ItemTitle, ItemDescription, ItemActions, ItemValue, ItemGroup, ItemSeparator, ItemHeader } from './item';
+export { default } from './item';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/item/index.js

@@ -0,0 +1,62 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/item/index.ts
+var index_exports = {};
+__export(index_exports, {
+  Item: () => import_item.Item,
+  ItemActions: () => import_item.ItemActions,
+  ItemContent: () => import_item.ItemContent,
+  ItemDescription: () => import_item.ItemDescription,
+  ItemGroup: () => import_item.ItemGroup,
+  ItemHeader: () => import_item.ItemHeader,
+  ItemMedia: () => import_item.ItemMedia,
+  ItemSeparator: () => import_item.ItemSeparator,
+  ItemTitle: () => import_item.ItemTitle,
+  ItemValue: () => import_item.ItemValue,
+  default: () => import_item2.default
+});
+module.exports = __toCommonJS(index_exports);
+__reExport(index_exports, require("./types"), module.exports);
+var import_item = require("./item");
+var import_item2 = __toESM(require("./item"));
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Item,
+  ItemActions,
+  ItemContent,
+  ItemDescription,
+  ItemGroup,
+  ItemHeader,
+  ItemMedia,
+  ItemSeparator,
+  ItemTitle,
+  ItemValue,
+  ...require("./types")
+});

package/lib/components/item/item.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { ItemActionsProps, ItemContentProps, ItemDescriptionProps, ItemGroupProps, ItemHeaderProps, ItemMediaProps, ItemProps, ItemTitleProps, ItemValueProps } from './types';
+export declare const Item: React.FC<ItemProps>;
+export declare const ItemMedia: React.FC<ItemMediaProps>;
+export declare const ItemContent: React.FC<ItemContentProps>;
+export declare const ItemTitle: React.FC<ItemTitleProps>;
+export declare const ItemDescription: React.FC<ItemDescriptionProps>;
+export declare const ItemActions: React.FC<ItemActionsProps>;
+export declare const ItemValue: React.FC<ItemValueProps>;
+export declare const ItemGroup: React.FC<ItemGroupProps>;
+export declare const ItemSeparator: React.FC<ItemContentProps>;
+export declare const ItemHeader: React.FC<ItemHeaderProps>;
+export default Item;
+//# sourceMappingURL=item.d.ts.map