@rsmax/toutiao 1.0.1

package/esm/hostComponents/WebView/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { BaseProps } from '../../types/component';
+export interface WebViewProps extends BaseProps {
+    src?: string;
+    onMessage?: (e: any) => void;
+    progressbarColor?: string;
+}
+export declare const WebView: React.ComponentType<WebViewProps>;

package/esm/hostComponents/WebView/index.js

@@ -0,0 +1,5 @@
+import { createHostComponent } from '@rsmax/runtime';
+export const WebView = createHostComponent('web-view');
+WebView.defaultProps = {
+    progressbarColor: '#51a0d8',
+};

package/esm/hostComponents/WebView/node.d.ts

@@ -0,0 +1,8 @@
+export declare const props: string[];
+export declare const alias: {
+    src: string;
+    progressbarColor: string;
+    onMessage: string;
+    onLoad: string;
+    onError: string;
+};

package/esm/hostComponents/WebView/node.js

@@ -0,0 +1,8 @@
+export const props = ['src', 'bindmessage', 'bindload', 'binderror'];
+export const alias = {
+    src: 'src',
+    progressbarColor: 'progressbar-color',
+    onMessage: 'bindmessage',
+    onLoad: 'bindload',
+    onError: 'binderror',
+};

package/esm/hostComponents/index.d.ts

@@ -0,0 +1,29 @@
+export * from './View';
+export * from './Input';
+export * from './Textarea';
+export * from './Video';
+export * from './Swiper';
+export * from './ScrollView';
+export * from './SwiperItem';
+export * from './Icon';
+export * from './Text';
+export * from './RichText';
+export * from './Progress';
+export * from './Button';
+export * from './CheckboxGroup';
+export * from './Checkbox';
+export * from './Form';
+export * from './Label';
+export * from './Picker';
+export * from './PickerView';
+export * from './PickerViewColumn';
+export * from './RadioGroup';
+export * from './Radio';
+export * from './Slider';
+export * from './Switch';
+export * from './Navigator';
+export * from './Image';
+export * from './Canvas';
+export * from './WebView';
+export * from './MovableArea';
+export * from './MovableView';

package/esm/hostComponents/index.js

@@ -0,0 +1,29 @@
+export * from './View';
+export * from './Input';
+export * from './Textarea';
+export * from './Video';
+export * from './Swiper';
+export * from './ScrollView';
+export * from './SwiperItem';
+export * from './Icon';
+export * from './Text';
+export * from './RichText';
+export * from './Progress';
+export * from './Button';
+export * from './CheckboxGroup';
+export * from './Checkbox';
+export * from './Form';
+export * from './Label';
+export * from './Picker';
+export * from './PickerView';
+export * from './PickerViewColumn';
+export * from './RadioGroup';
+export * from './Radio';
+export * from './Slider';
+export * from './Switch';
+export * from './Navigator';
+export * from './Image';
+export * from './Canvas';
+export * from './WebView';
+export * from './MovableArea';
+export * from './MovableView';

package/esm/hostComponents/node.d.ts

@@ -0,0 +1,2 @@
+declare const hostComponents: Map<any, any>;
+export default hostComponents;

package/esm/hostComponents/node.js

@@ -0,0 +1,60 @@
+import * as button from './Button/node';
+import * as canvas from './Canvas/node';
+import * as checkboxGroup from './CheckboxGroup/node';
+import * as checkbox from './Checkbox/node';
+import * as form from './Form/node';
+import * as icon from './Icon/node';
+import * as image from './Image/node';
+import * as input from './Input/node';
+import * as label from './Label/node';
+import * as navigator from './Navigator/node';
+import * as pickerViewColumn from './PickerViewColumn/node';
+import * as pickerView from './PickerView/node';
+import * as picker from './Picker/node';
+import * as progress from './Progress/node';
+import * as radioGroup from './RadioGroup/node';
+import * as radio from './Radio/node';
+import * as richText from './RichText/node';
+import * as scrollView from './ScrollView/node';
+import * as slider from './Slider/node';
+import * as swiperItem from './SwiperItem/node';
+import * as swiper from './Swiper/node';
+import * as switchComponent from './Switch/node';
+import * as text from './Text/node';
+import * as textarea from './Textarea/node';
+import * as video from './Video/node';
+import * as view from './View/node';
+import * as webView from './WebView/node';
+import * as movableArea from './MovableArea/node';
+import * as movableView from './MovableView/node';
+const hostComponents = new Map();
+hostComponents.set('button', button);
+hostComponents.set('canvas', canvas);
+hostComponents.set('checkbox-group', checkboxGroup);
+hostComponents.set('checkbox', checkbox);
+hostComponents.set('form', form);
+hostComponents.set('icon', icon);
+hostComponents.set('image', image);
+hostComponents.set('input', input);
+hostComponents.set('label', label);
+hostComponents.set('navigator', navigator);
+hostComponents.set('picker-view-column', pickerViewColumn);
+hostComponents.set('picker-view', pickerView);
+hostComponents.set('picker', picker);
+hostComponents.set('progress', progress);
+hostComponents.set('radio-group', radioGroup);
+hostComponents.set('radio', radio);
+hostComponents.set('rich-text', richText);
+hostComponents.set('scroll-view', scrollView);
+hostComponents.set('slider', slider);
+hostComponents.set('swiper-item', swiperItem);
+hostComponents.set('swiper', swiper);
+hostComponents.set('switch', switchComponent);
+hostComponents.set('text', text);
+hostComponents.set('textarea', textarea);
+hostComponents.set('video', video);
+hostComponents.set('view', view);
+hostComponents.set('web-view', webView);
+hostComponents.set('movable-area', movableArea);
+hostComponents.set('movable-view', movableView);
+export default hostComponents;

package/esm/index.d.ts

@@ -0,0 +1,3 @@
+export * from './hostComponents';
+export * from './api';
+export * from './types';

package/esm/index.js

@@ -0,0 +1,3 @@
+export * from './hostComponents';
+export * from './api';
+export * from './types';

package/esm/node/index.d.ts

@@ -0,0 +1,3 @@
+import type { PluginConstructor } from '@rsmax/types';
+declare const plugin: PluginConstructor;
+export default plugin;

package/esm/node/index.js

@@ -0,0 +1,23 @@
+import * as path from 'path';
+import hostComponents from '../hostComponents/node';
+const EJS_TPL_ROOT = path.join(__dirname, '../../templates');
+const plugin = () => {
+    return {
+        meta: {
+            global: 'tt',
+            template: {
+                extension: '.ttml',
+                tag: 'import',
+                src: 'src',
+            },
+            style: '.ttss',
+            ejs: {
+                base: path.join(EJS_TPL_ROOT, 'base.ejs'),
+                page: path.join(EJS_TPL_ROOT, 'page.ejs'),
+            },
+        },
+        hostComponents,
+        skipHostComponents: ['swiper-item'],
+    };
+};
+export default plugin;

package/esm/types/component.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import { BaseEvent } from '@rsmax/wechat/esm/types/component';
+/**
+ * 头条内置共有属性
+ * https://microapp.bytedance.com/docs/zh-CN/mini-app/develop/component/introduction/basic-componen
+ */
+export interface BaseProps {
+    /** 组件的唯一标示: 保持整个页面唯一 */
+    id?: string;
+    /** 组件的样式类: 在对应的 TTSS 中定义的样式类 */
+    className?: string;
+    /** 组件的内联样式: 可以动态设置的内联样式 */
+    style?: React.CSSProperties;
+    /** 组件是否显示: 所有组件默认显示 */
+    hidden?: boolean;
+}
+/** 自定义事件对象属性列表 */
+export interface GenericEvent<Detail = any> extends BaseEvent {
+    /** 额外的信息 */
+    detail: Detail;
+}
+/** 触摸事件对象属性列表 */
+export interface TouchEvent<T = Touch> extends BaseEvent {
+    /** 触摸事件，当前停留在屏幕中的触摸点信息的数组 */
+    touches: T[];
+    /** 触摸事件，当前变化的触摸点信息的数组 */
+    changedTouches: T[];
+}

package/esm/types/component.js

@@ -0,0 +1 @@
+export {};

package/esm/types/config.d.ts

@@ -0,0 +1,192 @@
+/** 页面配置文件 */
+export interface PageConfig {
+    /**
+     * 默认值：#000000
+     * 导航栏背景颜色，如"#000000"
+     */
+    navigationBarBackgroundColor?: string;
+    /**
+     * 默认值：white
+     * 导航栏标题颜色，仅支持 black / white
+     */
+    navigationBarTextStyle?: 'black' | 'white';
+    /**
+     * 导航栏标题文字内容
+     */
+    navigationBarTitleText?: string;
+    /**
+     * 默认值： default
+     * 导航栏样式，仅支持 default/custom。
+     * custom 模式可自定义导航栏，只保留右上角胶囊状的按钮
+     */
+    navigationStyle?: 'default' | 'custom';
+    /**
+     * 默认值：#ffffff
+     * 窗口的背景色
+     */
+    backgroundColor?: string;
+    /**
+     * 默认值：dark
+     * 下拉 loading 的样式，仅支持 dark / light
+     */
+    backgroundTextStyle?: 'dark' | 'light';
+    /**
+     * 默认值：false
+     * 是否开启下拉刷新，详见页面相关事件处理函数。
+     */
+    enablePullDownRefresh?: boolean;
+    /**
+     * 默认值：50
+     * 页面上拉触底事件触发时距页面底部距离，单位为 px
+     */
+    onReachBottomDistance?: number;
+    /**
+     * 默认值：false;
+     * 设置为 true 则页面整体不能上下滚动；
+     * 只在 page.json 中有效，无法在 app.json 中设置该项
+     */
+    disableScroll?: boolean;
+    /**
+     * 默认值：false
+     * 禁止页面右滑手势返回
+     */
+    disableSwipeBack?: boolean;
+    /**
+     * 自定义组件配置
+     */
+    usingComponents?: Record<string, any>;
+}
+interface TabItem {
+    /**
+     *页面路径，必须在 pages 中先定义
+     */
+    pagePath: string;
+    /**
+     * tab 上按钮文字
+     */
+    text: string;
+    /**
+     * 图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px，当 postion 为 top 时，此参数无效，不支持网络图片
+     */
+    iconPath?: string;
+    /**
+     * 选中时的图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px ，当 postion 为 top 时，此参数无效
+     *
+     */
+    selectedIconPath?: string;
+}
+/** 全局配置文件 */
+export interface AppConfig {
+    /**
+     * 配置页面路径
+     */
+    pages: string[];
+    /**
+     * 配置默认页面的窗口表现
+     */
+    window?: {
+        /**
+         * 默认值：#000000
+         * 导航栏背景颜色，如"#000000"
+         */
+        navigationBarBackgroundColor?: string;
+        /**
+         * 默认值: white
+         * 导航栏标题颜色，仅支持 black/white，同时影响：标题颜色、右胶囊颜色、左返回箭头颜色
+         */
+        navigationBarTextStyle?: 'white' | 'black';
+        /**
+         * 导航栏标题文字内容
+         */
+        navigationBarTitleText?: string;
+        /**
+         * 默认值：default
+         * 导航栏样式，仅支持 default/custom。
+         * custom 模式可自定义导航栏，只保留右上角胶囊状的按钮，可以通过navigationBarTextStyle设置胶囊按钮的颜色
+         */
+        navigationStyle?: 'default' | 'custom';
+        /**
+         * 默认值：#ffffff
+         * 窗口的背景色
+         */
+        backgroundColor?: string;
+        /**
+         * 默认值：dark
+         * 下拉 loading 的样式，仅支持 dark / light
+         */
+        backgroundTextStyle?: 'dark' | 'light';
+        /**
+         * 默认值：#ffffff
+         * 顶部窗口的背景色，仅 iOS 支持
+         */
+        backgroundColorTop?: string;
+        /**
+         * 默认值：#ffffff
+         * 底部窗口的背景色，仅 iOS 支持
+         */
+        backgroundColorBottom?: string;
+        /**
+         * 默认值：false
+         * 是否开启下拉刷新，详见页面相关事件处理函数
+         */
+        enablePullDownRefresh?: boolean;
+        /**
+         * 默认值：50
+         * 页面上拉触底事件触发时距页面底部距离，单位为 px。
+         * 详见 Page.onReachBottom
+         */
+        onReachBottomDistance?: number;
+        /**
+         * 仅在 navigationStyle 为 default 时该字段生效，用来控制导航栏透明设置。
+         * 默认 none，支持 always 一直透明 / auto 滑动自适应 / none 不透明
+         */
+        transparentTitle?: 'none' | 'always' | 'auto';
+    };
+    /**
+     * 配置底部 tab 的表现
+     */
+    tabBar?: {
+        /**
+         * tab 上的文字默认颜色
+         */
+        color: string;
+        /**
+         * tab 上的文字选中时的颜色
+         */
+        selectedColor: string;
+        /**
+         * tab 的背景色
+         */
+        backgroundColor: string;
+        /**
+         * 默认值：black
+         * tabbar 上边框的颜色， 仅支持 black / white
+         */
+        borderStyle?: 'black' | 'white';
+        /**
+         * tab 的列表，详见 list 属性说明，最少 2 个、最多 5 个 tab
+         */
+        list: TabItem[];
+        /**
+         * 默认值：bottom
+         * tabBar 的位置，仅支持 bottom / top
+         */
+        position?: 'bottom' | 'top';
+        /**
+         * 默认值：false
+         * 自定义 tabBar，见详情
+         * 2.5.0
+         */
+        custom?: boolean;
+    };
+    /**
+     * 需要跳转的小程序列表，相关 api 见tt.navigateToMiniProgram
+     * 1.5.0
+     */
+    navigateToMiniProgramAppIdList?: string[];
+    /**
+     * 配置部分授权弹窗的副标题
+     */
+    permission?: Record<string, any>;
+}
+export {};

package/esm/types/config.js

@@ -0,0 +1 @@
+export {};

package/esm/types/index.d.ts

@@ -0,0 +1 @@
+export * from './config';

package/esm/types/index.js

@@ -0,0 +1 @@
+export * from './config';

package/node.js

@@ -0,0 +1 @@
+module.exports = require('./cjs/node');

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@rsmax/toutiao",
+  "version": "1.0.1",
+  "description": "Rsmax for Toutiao",
+  "main": "./cjs/index.js",
+  "esnext": "./esm/index.js",
+  "module": "./esm/index.js",
+  "typings": "./esm/index.d.ts",
+  "scripts": {
+    "clean": "rimraf cjs esm tsconfig.tsbuildinfo",
+    "prebuild": "npm run clean",
+    "build": "tsc",
+    "build:cjs": "tsc --module CommonJS --outDir cjs",
+    "test": "vitest run"
+  },
+  "repository": "git+https://github.com/remaxjs/remax.git",
+  "license": "MIT",
+  "dependencies": {
+    "@rsmax/shared": "1.0.1",
+    "lodash": "^4.17.21"
+  },
+  "devDependencies": {
+    "@douyin-microapp/typings": "^1.3.1",
+    "@rsmax/framework-shared": "workspace:*",
+    "@rsmax/runtime": "workspace:*",
+    "@rsmax/types": "workspace:*",
+    "@rsmax/wechat": "workspace:*",
+    "@types/react": "^18.3.0",
+    "@types/react-test-renderer": "^18.3.0",
+    "react": "^18.3.0",
+    "react-test-renderer": "^18.3.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "gitHead": "d2ff644810449152d124a9da76218bcd9fdfff46"
+}

package/templates/base.ejs

@@ -0,0 +1,52 @@
+<template name="REMAX_TPL">
+    <block tt:for="{{root.children}}" tt:key="*this">
+        <template is="{{'REMAX_TPL_' + root.nodes[item].type}}" data="{{i: root.nodes[item]}}" />
+    </block>
+</template>
+
+<sjs module="_h">
+    var elements = {};
+    module.exports = {
+    v: function(value) {
+        return value;
+    },
+    tid: function (type, ancestor) {
+    var items = ancestor.split(',');
+    var depth = 1;
+
+    for (var i = 0; i < items.length; i++) {
+    if (type === items[i]) {
+    depth = depth + 1;
+    }
+    }
+
+    var id = 'REMAX_TPL_' + depth + '_' + type;
+    return id;
+    }
+    };
+</sjs>
+
+<% for (let component of sortBy(Array.from(components.values()), 'id')) { -%>
+<%_ if (skipComponents.includes(component.id)) {
+    continue;
+} else { -%>
+<%- include('./component.ejs', {
+type: component.type,
+props: component.props,
+id: component.id,
+slotView: slotView
+}) -%>
+
+<%_ } -%>
+<% } -%>
+
+<template name="REMAX_TPL_plain-text" data="{{i: i}}">
+    <block>{{i.text}}</block>
+</template>
+
+
+<% for (var i = 1; i <= depth['view']; i++) { -%>
+<template name="REMAX_TPL_<%=i%>_CONTAINER" data="{{i: i}}">
+    <template is="{{_h.tid(i.type, a)}}" data="{{i: i, a: a + ',' + i.type, tid: <%=i%>}}" />
+</template>
+<% } -%>

package/templates/component.ejs

@@ -0,0 +1,47 @@
+<template name="REMAX_TPL_<%=id%>">
+    <<%=id%>
+    <%_ for(let i=0;i < props.length; i++) { -%>
+    <%=props[i]%>="{{i.props['<%=props[i]%>']}}"
+    <%_ } -%>
+    >
+    <%_ if (id === 'swiper') { -%>
+    <block tt:for="{{i.children}}" tt:key="*this">
+        <swiper-item key="{{i.nodes[item].props.key}}">
+            <block tt:for="{{i.nodes[item].children}}" tt:key="*this" tt:for-item="sItem">
+                <template is="{{'REMAX_TPL_' + i.nodes[item].nodes[sItem].type}}" data="{{i: i.nodes[item].nodes[sItem]}}" />
+            </block>
+        </swiper-item>
+    </block>
+    <%_ } else if (id === 'picker-view') { -%>
+    <block tt:for="{{i.children}}" tt:key="*this">
+        <picker-view-column>
+            <view tt:for="{{i.nodes[item].children}}" tt:for-item="sItem">
+                <template is="{{'REMAX_TPL_' + i.nodes[item].nodes[sItem].type}}" data="{{i: i.nodes[item].nodes[sItem]}}" />
+            </view>
+        </picker-view-column>
+    </block>
+    <%_ } else if (type === 'native') { -%>
+    <block tt:for="{{i.children}}" tt:key="*this">
+        <block tt:if="{{i.nodes[item].props['slot']}}">
+            <view
+                    slot="{{i.nodes[item].props['slot']}}"
+            <%_ for(let i=0;i < slotView.props.length; i++) { -%>
+            <%=slotView.props[i]%>="{{i.nodes[item].props['<%=slotView.props[i]%>']}}"
+            <%_ } -%>
+            >
+            <block tt:for="{{i.nodes[item].children}}" tt:key="*this" tt:for-item="sItem">
+                <template is="{{'REMAX_TPL_' + i.nodes[item].nodes[sItem].type}}" data="{{i: i.nodes[item].nodes[sItem]}}" />
+            </block>
+            </view>
+        </block>
+        <block tt:else>
+            <template is="{{'REMAX_TPL_' + i.nodes[item].type}}" data="{{i: i.nodes[item]}}" />
+        </block>
+    </block>
+    <%_ } else { -%>
+    <block tt:for="{{i.children}}" tt:key="{{id}}">
+        <template is="{{'REMAX_TPL_' + i.nodes[item].type}}" data="{{i: i.nodes[item]}}" />
+    </block>
+    <%_ } -%>
+</<%=id%>>
+</template>

package/templates/page.ejs

@@ -0,0 +1,3 @@
+<import src="<%= baseTemplate %>"/>
+<template is="REMAX_TPL" data="{{root: root}}" />
+<template is="REMAX_TPL" data="{{ root: modalRoot }}" />

package/vitest.config.js

@@ -0,0 +1,7 @@
+import { defineConfig } from 'vitest/config';
+
+export default defineConfig({
+  test: {
+    globals: true,
+  },
+});