@doubao-dev/template 0.0.38-canary-22dd4cbf-20260720020201

package/dist/transit-card/index.d.ts

@@ -0,0 +1,52 @@
+import type { CSSProperties, TouchEvent } from '@lynx-js/types';
+import type { ReactElement, ReactNode } from 'react';
+import { type TemplateCardFooterProps } from '../components/footer/index.js';
+import { type TemplateCardHeaderProps } from '../components/header/index.js';
+import type { TemplateKey, TemplateText } from '../types.js';
+import './styles.scss';
+export interface TransitCardProps {
+    /** 标题栏配置。 */
+    header?: TemplateCardHeaderProps;
+    /** 交通列表项。 */
+    items?: TransitCardItem[];
+    /** 底部操作区配置。 */
+    footer?: TemplateCardFooterProps;
+    /** 卡片根节点自定义类名。 */
+    className?: string;
+    /** 卡片根节点自定义样式。 */
+    style?: CSSProperties;
+    /** 点击卡片根节点时触发。 */
+    onClick?: (event: TouchEvent) => void;
+}
+export interface TransitCardItem {
+    /** 列表项唯一标识；不传时使用数组下标。 */
+    key?: TemplateKey;
+    /** 行程标题块内容。 */
+    title?: ReactNode;
+    /** 出发点主信息文案。 */
+    departureMain?: TemplateText;
+    /** 出发点补充信息文案。 */
+    departureSub?: TemplateText;
+    /** 中转区域整体块内容；优先级高于 transferTop 和 transferBottom。 */
+    transfer?: ReactNode;
+    /** 中转区域上方文案。 */
+    transferTop?: TemplateText;
+    /** 中转区域下方文案。 */
+    transferBottom?: TemplateText;
+    /** 到达点主信息文案。 */
+    arrivalMain?: TemplateText;
+    /** 到达点日期偏移文案，例如 '+1'。 */
+    arrivalDayOffset?: TemplateText;
+    /** 到达点补充信息文案。 */
+    arrivalSub?: TemplateText;
+    /** 价格块内容。 */
+    price?: ReactNode;
+    /** 列表项根节点自定义类名。 */
+    className?: string;
+    /** 列表项根节点自定义样式。 */
+    style?: CSSProperties;
+    /** 点击列表项时触发。 */
+    onClick?: (event: TouchEvent) => void;
+}
+export declare function TransitCard(props: TransitCardProps): ReactElement;
+//# sourceMappingURL=index.d.ts.map

package/dist/transit-card/index.js

@@ -0,0 +1,29 @@
+import { useThemeClassName } from "@byted-doubao-apps/components";
+import { clsx } from "clsx";
+import { TemplateCardFooter } from "../components/footer/index.js";
+import { TemplateCardHeader } from "../components/header/index.js";
+import { TemplateTransportSummary } from "../components/transport-summary/index.js";
+import "./styles.css";
+function renderTransitCardItem({ item, index, isLast }) {
+    return <view className={clsx('doubao-transit-card__item', isLast && 'doubao-transit-card__item--last', item.className)} style={item.style} key={item.key ?? index} {...null != item.onClick ? {
+        catchtap: item.onClick
+    } : {}}>
+      <TemplateTransportSummary className="doubao-template-transport-summary--list" title={item.title} departureMain={item.departureMain} departureSub={item.departureSub} transfer={item.transfer} transferTop={item.transferTop} transferBottom={item.transferBottom} arrivalMain={item.arrivalMain} arrivalDayOffset={item.arrivalDayOffset} arrivalSub={item.arrivalSub} price={item.price}/>
+      {!isLast && <view className="doubao-transit-card__item--spread"/>}
+    </view>;
+}
+function TransitCard(props) {
+    const { header, items = [], footer, className, style, onClick } = props;
+    return <view className={useThemeClassName(clsx('doubao-transit-card', className))} style={style} bindtap={onClick}>
+      <TemplateCardHeader actionText={header?.actionText} showAction={header?.showAction} onActionClick={header?.onActionClick}/>
+      <view className="doubao-transit-card__body">
+        {items.map((item, index)=>renderTransitCardItem({
+            item,
+            index,
+            isLast: index === items.length - 1
+        }))}
+      </view>
+      <TemplateCardFooter primaryActionButton={footer?.primaryActionButton} secondaryActionButton={footer?.secondaryActionButton}/>
+    </view>;
+}
+export { TransitCard };

package/dist/transit-card/styles.css

@@ -0,0 +1,53 @@
+.doubao-transit-card {
+  --doubao-button-border-radius: 8px;
+  --doubao-button-default-border-radius: 8px;
+  --doubao-button-default-height: 44px;
+  --doubao-button-default-padding-x: 12px;
+  --doubao-button-default-padding-y: 0;
+  --doubao-button-default-font-size: 16px;
+  --doubao-button-default-line-height: 22px;
+  box-sizing: border-box;
+  background-color: var(--bg-base-1);
+  border: 1px solid var(--bg-base-2-overlay);
+  border-radius: 8px;
+  flex-direction: column;
+  align-items: stretch;
+  width: 100%;
+  display: flex;
+  overflow: hidden;
+}
+
+.doubao-transit-card__body {
+  box-sizing: border-box;
+  background-color: var(--bg-base-1);
+  width: 100%;
+}
+
+.doubao-transit-card__item {
+  box-sizing: border-box;
+  width: 100%;
+}
+
+.doubao-transit-card__item--spread {
+  background: var(--neutral-transparent-1);
+  width: calc(100% - 12px);
+  height: .5px;
+  margin-left: 12px;
+}
+
+.doubao-transit-card__item--last {
+  border-bottom: none;
+}
+
+.doubao-transit-card__view-more {
+  box-sizing: border-box;
+  width: 100%;
+  padding: 8px 12px;
+}
+
+.doubao-transit-card__view-more-button {
+  border-radius: 8px;
+  width: 100%;
+  height: 44px;
+}
+

package/dist/types.d.ts

@@ -0,0 +1,3 @@
+export type TemplateKey = string | number;
+export type TemplateText = string | number;
+//# sourceMappingURL=types.d.ts.map

package/dist/utils/app-info.d.ts

@@ -0,0 +1,6 @@
+export interface AppInfo {
+    appName: string;
+    appIconSrc?: string;
+}
+export declare function getAppInfo(): AppInfo;
+//# sourceMappingURL=app-info.d.ts.map

package/dist/utils/app-info.js

@@ -0,0 +1,20 @@
+import { getPackageInfoSync } from "@byted-doubao-apps/framework/api";
+function resolveIconSrc(icons) {
+    if ('string' == typeof icons) return icons.length > 0 ? icons : void 0;
+    return icons?.['3x'] || icons?.['2x'] || icons?.['1x'];
+}
+function getAppInfo() {
+    try {
+        const manifest = globalThis.__AI_MANIFEST__;
+        const packageInfo = getPackageInfoSync?.();
+        return {
+            appName: manifest ? manifest.name || manifest.appId || manifest.package : packageInfo?.name,
+            appIconSrc: manifest ? resolveIconSrc(manifest.icons) : packageInfo?.iconSrc
+        };
+    } catch  {
+        return {
+            appName: ''
+        };
+    }
+}
+export { getAppInfo };

package/dist/utils/icons.d.ts

@@ -0,0 +1,2 @@
+export declare function getTemplatePlaybackIconContent(playing: boolean, progress: number | undefined, color: string): string;
+//# sourceMappingURL=icons.d.ts.map

package/dist/utils/icons.js

@@ -0,0 +1,28 @@
+function getTemplatePausedIconContent(color) {
+    return `<svg width="32" height="32" overflow="visible" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16 0C24.8366 0 32 7.16344 32 16C32 24.8366 24.8366 32 16 32C7.16344 32 0 24.8366 0 16C0 7.16344 7.16344 0 16 0ZM13.8828 10.4648C12.9165 10.3173 12.0129 10.981 11.8652 11.9473L11.835 12.1592C11.6968 13.1674 11.6279 14.4494 11.6279 16.0039C11.6279 17.6646 11.7066 19.0136 11.8643 20.0508C11.8818 20.1661 11.9104 20.28 11.9502 20.3896C12.284 21.3084 13.3 21.7829 14.2188 21.4492L14.4287 21.3701C15.4197 20.99 16.5599 20.4143 17.8496 19.6436C19.0853 18.9052 20.0807 18.2138 20.835 17.5684C20.9152 17.4997 20.9898 17.4248 21.0586 17.3447C21.8017 16.4796 21.7031 15.1758 20.8379 14.4326L20.6592 14.2822C19.9287 13.6777 18.9918 13.0341 17.8496 12.3516C16.4659 11.5247 15.2547 10.9241 14.2158 10.5498C14.108 10.5109 13.9961 10.4822 13.8828 10.4648Z" fill="${color}"/>
+</svg>`;
+}
+function getTemplatePauseIconPath(color) {
+    return `<path d="M12.7917 10.1667C13.3353 10.1667 13.6075 10.1667 13.8219 10.2555C14.1075 10.3739 14.3344 10.6009 14.4528 10.8864C14.5416 11.1008 14.5417 11.3731 14.5417 11.9167V20.0837C14.5417 20.6269 14.5415 20.8986 14.4528 21.113C14.3344 21.3987 14.1077 21.6263 13.8219 21.7448C13.6075 21.8336 13.3353 21.8337 12.7917 21.8337C12.2481 21.8337 11.9758 21.8336 11.7614 21.7448C11.4757 21.6263 11.2489 21.3987 11.1305 21.113C11.0418 20.8986 11.0417 20.6269 11.0417 20.0837V11.9167C11.0417 11.3731 11.0417 11.1008 11.1305 10.8864C11.2489 10.6009 11.4759 10.3739 11.7614 10.2555C11.9758 10.1667 12.2481 10.1667 12.7917 10.1667ZM19.2087 10.1667C19.7519 10.1667 20.0236 10.1668 20.238 10.2555C20.5237 10.3739 20.7513 10.6007 20.8698 10.8864C20.9586 11.1008 20.9587 11.3731 20.9587 11.9167V20.0837C20.9587 20.6269 20.9585 20.8986 20.8698 21.113C20.7514 21.3988 20.5238 21.6264 20.238 21.7448C20.0236 21.8334 19.7518 21.8337 19.2087 21.8337C18.6651 21.8337 18.3928 21.8336 18.1784 21.7448C17.8926 21.6264 17.6659 21.3988 17.5475 21.113C17.4587 20.8986 17.4587 20.627 17.4587 20.0837V11.9167C17.4587 11.3731 17.4587 11.1008 17.5475 10.8864C17.6659 10.6008 17.8928 10.3739 18.1784 10.2555C18.3928 10.1667 18.6651 10.1667 19.2087 10.1667Z" fill="${color}"/>`;
+}
+function normalizeTemplateProgress(progress) {
+    if (null == progress || Number.isNaN(progress)) return null;
+    return Math.min(Math.max(progress, 0), 1);
+}
+function renderTemplatePlaybackProgress(progress, color) {
+    const normalizedProgress = normalizeTemplateProgress(progress);
+    if (null == normalizedProgress) return '';
+    const circumference = 94.248;
+    const dash = Number((normalizedProgress * circumference).toFixed(3));
+    return `<circle cx="16" cy="16" r="15" stroke="${color}" stroke-width="2" stroke-linecap="round" stroke-dasharray="${dash} ${circumference}" transform="rotate(-90 16 16)"/>`;
+}
+function getTemplatePlaybackIconContent(playing, progress, color) {
+    if (!playing) return getTemplatePausedIconContent(color);
+    return `<svg width="32" height="32" overflow="visible" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16 1C24.2843 1 31 7.71573 31 16C31 24.2843 24.2843 31 16 31C7.71573 31 1 24.2843 1 16C1 7.71573 7.71573 1 16 1Z" stroke="var(--stroke-0, black)" stroke-opacity="0.1" stroke-width="2"/>
+${renderTemplatePlaybackProgress(progress, color)}
+${getTemplatePauseIconPath(color)}
+</svg>`;
+}
+export { getTemplatePlaybackIconContent };

package/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "@doubao-dev/template",
+  "version": "0.0.38-canary-22dd4cbf-20260720020201",
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "types": "./dist/index.d.ts",
+  "sideEffects": [
+    "**/*.css",
+    "**/*.scss"
+  ],
+  "files": [
+    "dist",
+    "assets",
+    "README.md",
+    "!dist/**/*.map",
+    "!**/*.tsbuildinfo"
+  ],
+  "dependencies": {
+    "clsx": "2.1.1"
+  },
+  "peerDependencies": {
+    "@lynx-js/types": "^4.0.0",
+    "@types/react": "^18.0.0"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "scripts": {
+    "build": "rslib build",
+    "dev": "rslib build --watch"
+  }
+}