Feature/skyline

example/app.json

@@ -3,55 +3,90 @@
   "pages": [
     "pages/home/home",
     "pages/button/button",
+    "pages/button/skyline/button",
     "pages/tabs/tabs",
     "pages/icon/icon",
+    "pages/icon/skyline/icon",
     "pages/loading/loading",
+    "pages/loading/skyline/loading",
     "pages/progress/progress",
+    "pages/progress/skyline/progress",
     "pages/cascader/cascader",
     "pages/cell/cell",
+    "pages/cell/skyline/cell",
     "pages/cell-group/cell-group",
     "pages/collapse/collapse",
+    "pages/collapse/skyline/collapse",
     "pages/input/input",
+    "pages/input/skyline/input",
     "pages/badge/badge",
+    "pages/badge/skyline/badge",
     "pages/textarea/textarea",
+    "pages/textarea/skyline/textarea",
     "pages/message/message",
     "pages/toast/toast",
+    "pages/toast/skyline/toast",
     "pages/stepper/stepper",
+    "pages/stepper/skyline/stepper",
     "pages/slider/slider",
+    "pages/slider/skyline/slider",
     "pages/radio/radio",
+    "pages/radio/skyline/radio",
     "pages/switch/switch",
     "pages/sticky/sticky",
     "pages/tag/tag",
+    "pages/tag/skyline/tag",
     "pages/checkbox/checkbox",
+    "pages/checkbox/skyline/checkbox",
     "pages/gulp-error/index",
     "pages/fab/fab",
+    "pages/fab/skyline/fab",
     "pages/tab-bar/tab-bar",
+    "pages/tab-bar/skyline/tab-bar",
     "pages/transition/transition",
     "pages/popup/popup",
+    "pages/popup/skyline/popup",
     "pages/steps/steps",
+    "pages/steps/skyline/steps",
     "pages/dropdown-menu/dropdown-menu",
     "pages/drawer/drawer",
+    "pages/drawer/skyline/drawer",
     "pages/pull-down-refresh/pull-down-refresh",
+    "pages/pull-down-refresh/skyline/pull-down-refresh",
     "pages/skeleton/skeleton",
+    "pages/skeleton/skyline/skeleton",
     "pages/footer/footer",
+    "pages/footer/skyline/footer",
     "pages/divider/divider",
+    "pages/divider/skyline/divider",
     "pages/empty/empty",
+    "pages/empty/skyline/empty",
     "pages/back-top/back-top",
+    "pages/back-top/skyline/back-top",
     "pages/grid/grid",
     "pages/upload/upload",
     "pages/count-down/count-down",
+    "pages/count-down/skyline/count-down",
     "pages/overlay/overlay",
+    "pages/overlay/skyline/overlay",
     "pages/image/image",
+    "pages/image/skyline/image",
     "pages/search/search",
     "pages/home/navigateFail/navigateFail",
     "pages/navbar/navbar",
+    "pages/navbar/skyline/navbar",
     "pages/date-time-picker/date-time-picker",
+    "pages/date-time-picker/skyline/date-time-picker",
     "pages/notice-bar/notice-bar",
     "pages/image-viewer/image-viewer",
+    "pages/image-viewer/skyline/image-viewer",
     "pages/result/result",
+    "pages/result/skyline/result",
     "pages/result/result-page",
     "pages/link/link",
-    "pages/col/col"
+    "pages/link/skyline/link",
+    "pages/col/col",
+    "pages/col/skyline/col"
   ],
   "subpackages": [
     {
@@ -64,27 +99,27 @@
     },
     {
       "root": "pages/avatar/",
-      "pages": ["avatar"]
+      "pages": ["avatar", "skyline/avatar"]
     },
     {
       "root": "pages/calendar/",
       "pages": ["calendar"]
     },
     {
       "root": "pages/dialog/",
-      "pages": ["dialog"]
+      "pages": ["dialog", "skyline/dialog"]
     },
     {
       "root": "pages/picker/",
-      "pages": ["picker"]
+      "pages": ["picker", "skyline/picker"]
     },
     {
       "root": "pages/rate/",
       "pages": ["rate"]
     },
     {
       "root": "pages/swiper/",
-      "pages": ["swiper"]
+      "pages": ["swiper", "skyline/swiper"]
     },
     {
       "root": "pages/swipe-cell/",
@@ -111,5 +146,16 @@
     "navigationStyle": "custom",
     "navigationBarTextStyle": "@navTxtStyle"
   },
-  "sitemapLocation": "sitemap.json"
+  "resolveAlias": {
+    "@behaviors/*": "behaviors/*"
+  },
+  "sitemapLocation": "sitemap.json",
+  "lazyCodeLoading": "requiredComponents",
+  "rendererOptions": {
+    "skyline": {
+      "defaultDisplayBlock": true,
+      "defaultContentBox": true,
+      "sdkVersionBegin": "3.4.2"
+    }
+  }
 }

example/app.less

@@ -10,8 +10,6 @@ page {
   --bg-color-demo-secondary: #fff;
   --td-navbar-bg-color: #f6f6f6;
   --td-navbar-color: black;
-  --td-navbar-title-font-size: 26rpx;
-  --td-navbar-title-font-weight: 400;
   --td-color-demo-notice-icon: rgba(0, 0, 0, 0.9);
   --td-avatar-border-color: var(--bg-color-demo);
   --td-progress-circle-inner-bg-color: var(--bg-color-demo);
@@ -39,6 +37,17 @@ page {
   }
 }
 
+.skyline {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+
+  .scroll-view {
+    flex: 1;
+    height: 0;
+  }
+}
+
 .demo {
   padding-bottom: 56rpx;
 

example/behaviors/skyline.js

@@ -0,0 +1,10 @@
+module.exports = Behavior({
+  data: {
+    skylineRender: false,
+  },
+  lifetimes: {
+    created() {
+      this.setData({ skylineRender: this.renderer === 'skyline' });
+    },
+  },
+});

example/components/demo-block/index.json

@@ -1,3 +1,4 @@
 {
-  "component": true
+  "component": true,
+  "styleIsolation": "apply-shared"
 }

example/components/demo-block/index.less

@@ -41,7 +41,10 @@
     margin-top: @spacer-2;
 
     &.with-padding {
-      margin: @spacer-2 @spacer-2 0;
+      margin-top: @spacer-2;
+      margin-left: @spacer-2;
+      margin-right: @spacer-2;
+      margin-bottom: 0;
     }
   }
 }

example/components/demo-block/index.ts

@@ -1,21 +1,20 @@
 Component({
   options: {
     multipleSlots: true,
-    addGlobalClass: true,
   },
   properties: {
     title: {
       type: String,
-      default: '',
+      value: '',
     },
     desc: {
       type: String,
-      default: '',
+      value: '',
     },
     operList: Array,
     padding: {
       type: Boolean,
-      default: false,
+      value: false,
     },
   },
   methods: {

example/pages/home/data/base.ts

@@ -46,4 +46,36 @@ const base = {
   ],
 };
 
-export default base;
+const skylineBase = {
+  name: '基础',
+  icon: 'app',
+  childArr: [
+    {
+      name: 'Button',
+      label: '按钮',
+    },
+    {
+      name: 'Divider',
+      label: '分割线',
+    },
+    {
+      name: 'Fab',
+      label: '悬浮按钮',
+    },
+    {
+      name: 'Icon',
+      label: '图标',
+    },
+    {
+      name: 'Link',
+      label: '链接',
+    },
+    {
+      name: 'Layout',
+      label: '布局',
+      path: '/pages/col/skyline/col',
+    },
+  ],
+};
+
+export { base, skylineBase };

example/pages/home/data/display.ts

@@ -77,4 +77,67 @@ const display = {
   ],
 };
 
-export default display;
+const skylineDisplay = {
+  name: '数据展示',
+  icon: 'image',
+  childArr: [
+    {
+      name: 'Avatar',
+      label: '头像',
+    },
+    {
+      name: 'Badge',
+      label: '徽标',
+    },
+    {
+      name: 'Cell',
+      label: '单元格',
+    },
+    // {
+    //   name: 'Collapse',
+    //   label: '折叠面板',
+    // },
+    {
+      name: 'CountDown',
+      label: '倒计时',
+    },
+    {
+      name: 'Empty',
+      label: '空状态',
+    },
+    {
+      name: 'Footer',
+      label: '页脚',
+    },
+    {
+      name: 'Image',
+      label: '图片',
+    },
+    {
+      name: 'ImageViewer',
+      label: '图片预览',
+    },
+    {
+      name: 'Progress',
+      label: '进度条',
+    },
+    {
+      name: 'Result',
+      label: '结果',
+    },
+    {
+      name: 'Skeleton',
+      label: '骨架屏',
+    },
+    {
+      name: 'Swiper',
+      label: '轮播图',
+    },
+    {
+      name: 'Tag',
+      label: '标签',
+    },
+  ],
+};
+
+export { display, skylineDisplay };

example/pages/home/data/form.ts

@@ -69,4 +69,43 @@ const form = {
   ],
 };
 
-export default form;
+const skylineForm = {
+  name: '输入',
+  icon: 'bulletpoint',
+  childArr: [
+    {
+      name: 'Checkbox',
+      label: '多选框',
+    },
+    // {
+    //   name: 'DateTimePicker',
+    //   label: '时间选择器',
+    // },
+    {
+      name: 'Input',
+      label: '输入框',
+    },
+    // {
+    //   name: 'Picker',
+    //   label: '选择器',
+    // },
+    {
+      name: 'Radio',
+      label: '单选框',
+    },
+    // {
+    //   name: 'Slider',
+    //   label: '滑动选择器',
+    // },
+    {
+      name: 'Stepper',
+      label: '步进器',
+    },
+    {
+      name: 'Textarea',
+      label: '多行文本框',
+    },
+  ],
+};
+
+export { form, skylineForm };

example/pages/home/data/index.ts

@@ -1,7 +1,11 @@
-import base from './base';
-import nav from './nav';
-import display from './display';
-import form from './form';
-import ux from './ux';
+import { base, skylineBase } from './base';
+import { nav, skylineNav } from './nav';
+import { display, skylineDisplay } from './display';
+import { form, skylineForm } from './form';
+import { ux, skylineUx } from './ux';
 
-export default [base, nav, form, display, ux];
+const list = [base, nav, form, display, ux];
+
+const skylineList = [skylineBase, skylineNav, skylineForm, skylineDisplay, skylineUx];
+
+export { list, skylineList };