Merge branch 'master' into master

ecomfe · Apr 22, 2017 · 112b5b6 · 112b5b6
2 parents 72418e3 + e7659b6
commit 112b5b6
Show file tree

Hide file tree

Showing 107 changed files with 5,322 additions and 649 deletions.
diff --git a/.babelrc b/.babelrc
@@ -6,11 +6,23 @@
         "test": {
             "presets": ["es2015", "stage-1"],
             "plugins": [
-                ["istanbul", {
-                    "exclude": [
-                        "**/*.spec.js"
-                    ]
-                }]
+                [
+                    "istanbul",
+                    {
+                        "exclude": ["**/*.spec.js"]
+                    }
+                ]
+            ]
+        },
+        "test-ci": {
+            "presets": ["es2015", "stage-1"],
+            "plugins": [
+                [
+                    "istanbul",
+                    {
+                        "exclude": ["**/*.spec.js"]
+                    }
+                ]
             ]
         },
         "production": {

diff --git a/.gitignore b/.gitignore
@@ -29,4 +29,6 @@ coverage
 
 .vscode/
 
-lib
+lib/
+dist/
+es/
diff --git a/.npmignore b/.npmignore
@@ -17,4 +17,5 @@ coverage
 out
 output
 appveyor.yml
-
+src
+gulefile.js
diff --git a/example/App.san b/example/App.san
@@ -103,9 +103,8 @@ export default {
         navTitle() {
             var menuVal = this.data.get('menuVal');
             var menus = this.data.get('menus');
-            var item = menus.find( (item) => item.value == menuVal);
-            return item.title || '404';
-
+            var item = menus.find(item => item.value == menuVal);
+            return item ? item.title : '404';
         }
     },
 

diff --git a/example/Avatar.san b/example/Avatar.san
@@ -0,0 +1,50 @@
+<template>
+    <san-list>
+      <san-list-item primaryText="图片" disabled>
+        <san-avatar slot="left" src="http://boscdn.bpc.baidu.com/movie/assets/avatar1.jpeg"/>
+      </san-list-item>
+      <san-list-item primaryText="图片,自定义大小" disabled>
+        <san-avatar slot="left" src="http://boscdn.bpc.baidu.com/movie/assets/avatar1.jpeg" size="30"/>
+      </san-list-item>
+      <san-list-item primaryText="图标" disabled>
+        <san-avatar slot="left" icon="folder"/>
+      </san-list-item>
+      <san-list-item primaryText="图标, 自定义大小、颜色" disabled>
+        <san-avatar slot="left" icon="folder" color="#f93" backgroundColor="#ff2244" size="30" iconSize="20"/>
+      </san-list-item>
+      <san-list-item primaryText="文字" disabled>
+        <san-avatar slot="left" color="#f93" backgroundColor="#2c9eff">MB</san-avatar>
+      </san-list-item>
+    </san-list>
+</template>
+
+<script>
+
+import Icon from '../src/Icon';
+import Avatar from '../src/Avatar';
+import {List, ListItem} from '../src/List';
+
+import '../src/Avatar/Avatar.styl';
+import '../src/List/index.styl';
+
+export default {
+
+    components: {
+        'san-icon': Icon,
+        'san-avatar': Avatar,
+        'san-list': List,
+        'san-list-item': ListItem
+    },
+
+    initData() {
+        return {
+        };
+    }
+
+}
+
+</script>
+
+<style>
+
+</style>
diff --git a/example/Checkbox.san b/example/Checkbox.san
@@ -12,6 +12,7 @@
 
 <script>
 import Checkbox from '../src/Checkbox';
+import '../src/Checkbox/Checkbox.styl';
 
 export default {
 

diff --git a/example/Divider.san b/example/Divider.san
@@ -0,0 +1,71 @@
+<template>
+  <div>
+      <p class="sm-demo-title">配合列表使用</p>
+      <div class="sm-list-demo-wrapper">
+        <san-list>
+            <san-list-item primaryText="List Item 1" />
+            </san-list-item>
+            <san-list-item primaryText="List Item 2" />
+            <san-divider />
+            <san-list-item primaryText="List Item 3" />
+        </san-list>
+      </div>
+
+      <p class="sm-demo-title">配合Menu使用</p>
+      <san-dropdownmenu openImmediately="true" anchorOrigin="{{anchorOrigin}}">
+          <san-menuitem value="{{ 1 }}" title="MenuItem 1" />
+          <san-menuitem value="{{ 2 }}" title="MenuItem 2" />
+          <san-divider />
+          <san-menuitem value="{{ 3 }}" title="MenuItem 3" />
+          <san-icon slot="iconButton">arrow_drop_down</san-icon>
+      </san-dropdownmenu>
+  </div>
+</template>
+
+<script>
+
+import Icon from '../src/Icon';
+import {List, ListItem} from '../src/List';
+import Divider from '../src/Divider';
+import {DropDownMenu, MenuItem} from '../src/Menu';
+
+import '../src/List/index.styl';
+import '../src/Menu/DropDownMenu.styl';
+import '../src/Menu/MenuItem.styl';
+import '../src/Divider/Divider.styl';
+
+export default {
+
+    components: {
+        'san-dropdownmenu': DropDownMenu,
+        'san-menuitem': MenuItem,
+        'san-icon': Icon,
+        'san-list': List,
+        'san-list-item': ListItem,
+        'san-divider': Divider
+    },
+
+    initData() {
+        return {
+            anchorOrigin: {
+                vertical: 'bottom',
+                horizontal: 'left'
+            },
+        };
+    }
+
+}
+
+</script>
+
+<style>
+.sm-demo-title {
+    margin: 20px 0 10px 0;
+    color: #666;
+    font-size: 18px;
+    font-weight: bold;
+}
+.sm-list-demo-wrapper {
+  max-width: 200px;
+}
+</style>
diff --git a/example/Icon.san b/example/Icon.san
@@ -7,7 +7,7 @@
 </section>
 </template>
 <script>
-import icons from 'html!material-design-icons/iconfont/codepoints';
+import icons from 'html!../src/common/font/codepoints';
 import Icon from '../src/Icon';
 
 import '../src/Icon/Icon.styl'

diff --git a/example/Menu.san b/example/Menu.san
@@ -1,25 +1,75 @@
 <template>
     <div>
-        <p class="sm-menu-intro">DropDown Menu:</p>
+        <p class="sm-menu-intro">DropDown Menu - <span>无label值列表, 设置了maxHeight</span></p>
+        <san-dropdownmenu value="{{ value }}" maxHeight="120">
+            <san-menuitem value="{{ 1 }}" title="MenuItem 1" />
+            <san-menuitem value="{{ 2 }}" title="MenuItem 2" />
+            <san-menuitem value="{{ 3 }}" title="MenuItem 3" />
+            <san-menuitem value="{{ 4 }}" title="MenuItem 4" />
+            <san-icon slot="iconButton">arrow_drop_down</san-icon>
+        </san-dropdownmenu>
+
+        <p class="sm-menu-intro">DropDown Menu - <span>绑定了change、close事件，有label值列表（列表项为title，选中值为label）</span></p>
         <san-dropdownmenu on-change="dropDownChange($event)" on-close="dropDownClose()" value="{{ value }}">
-            <slot>
-                <san-menuitem value="{{ 1 }}" label="MenuItem 1" title="No.1" />
-                <san-menuitem value="{{ 2 }}" label="MenuItem 2" title="No.2" />
-                <san-menuitem value="{{ 3 }}" label="MenuItem 3" title="No.3" />
-                <san-menuitem value="{{ 4 }}" label="MenuItem 4" title="No.4" />
-            </slot>
-            <icon slot="iconButton" value="arrow_drop_down" />
+            <san-menuitem value="{{ 1 }}" label="MenuItem 1" title="No.1" />
+            <san-menuitem value="{{ 2 }}" label="MenuItem 2" title="No.2" />
+            <san-menuitem value="{{ 3 }}" label="MenuItem 3" title="No.3" />
+            <san-menuitem value="{{ 4 }}" label="MenuItem 4" title="No.4" />
+            <san-icon slot="iconButton">arrow_drop_down</san-icon>
         </san-dropdownmenu>
 
-        <p class="sm-menu-intro">Command Icon Menu:</p>
-        <san-iconmenu icon="more_horiz" itemClickClose="false">
+        <p class="sm-menu-intro">Disabled DropDown Menu</p>
+        <san-dropdownmenu value="{{ value }}" disabled="true" selectedMenuItemStyle="{{selectedMenuItemStyle}}">
+            <san-menuitem value="{{ 1 }}" label="MenuItem 1" title="No.1" />
+            <san-menuitem value="{{ 2 }}" label="MenuItem 2" title="No.2" />
+            <san-menuitem value="{{ 3 }}" label="MenuItem 3" title="No.3" />
+            <san-menuitem value="{{ 4 }}" label="MenuItem 4" title="No.4" />
+            <san-icon slot="iconButton">arrow_drop_down</san-icon>
+        </san-dropdownmenu>
+
+        <p class="sm-menu-intro">自动展开 DropDown Menu</p>
+        <san-dropdownmenu value="{{ value }}" openImmediately="true">
+            <san-menuitem value="{{ 1 }}" label="MenuItem 1" title="No.1" />
+            <san-menuitem value="{{ 2 }}" label="MenuItem 2" title="No.2" />
+            <san-menuitem value="{{ 3 }}" label="MenuItem 3" title="No.3" />
+            <san-menuitem value="{{ 4 }}" label="MenuItem 4" title="No.4" />
+            <san-icon slot="iconButton">arrow_drop_down</san-icon>
+        </san-dropdownmenu>
+
+        <p class="sm-menu-intro">Command版 Icon Menu -  <span>点击列表项不关闭MENU，选项内嵌icon</span></p>
+        <san-iconmenu icon="more_horiz" itemClickClose="false" tooltip="操作">
+            <san-menuitem title="MenuItem 1" />
+            <san-menuitem title="MenuItem 2" />
+            <san-divider />
+            <san-menuitem title="Download" on-change="download()">
+                <san-icon slot="leftIcon">file_download</san-icon>
+            </san-menuitem>
+            <san-menuitem title="MenuItem 4" on-change="openGroup()">
+                <san-icon slot="rightIcon">chevron_right</san-icon>
+                <san-icon slot="rightIcon">subdirectory_arrow_right</san-icon>
+                <san-icon slot="rightIcon">notifications_off</san-icon>
+            </san-menuitem>
+        </san-iconmenu>
+
+        <p class="sm-menu-intro">Icon Menu 调整menu位置 -  <span>anchorOrigin: {vertical: 'bottom',horizontal: 'right'},
+targetOrigin: {horizontal: 'left',vertical: 'top'}</span></p>
+        <san-iconmenu icon="more_horiz" anchorOrigin="{{anchorOrigin}}" targetOrigin="{{targetOrigin}}">
             <san-menuitem title="MenuItem 1" />
             <san-menuitem title="MenuItem 2" />
             <san-divider />
             <san-menuitem title="Download" on-change="download()" leftIcon="file_download" />
             <san-menuitem title="MenuItem 4" on-change="openGroup()" rightIcon="chevron_right,subdirectory_arrow_right,notifications_off" />
         </san-iconmenu>
 
+        <p class="sm-menu-intro">Icon Menu - MENU渲染在一个隐形层之上，防止触发其他对象的点击事件 <span></span></p>
+        <san-iconmenu icon="more_horiz" useLayerForClickAway="true">
+            <san-menuitem title="MenuItem 1" />
+            <san-menuitem title="MenuItem 2" />
+            <san-divider />
+            <san-menuitem title="MenuItem 3" />
+            <san-menuitem title="MenuItem 4" />
+        </san-iconmenu>
+
         <p class="sm-menu-intro">多选Icon Menu:</p>
         <san-iconmenu
             icon="more_verti"
@@ -38,12 +88,19 @@
 <script>
 
 import Icon from '../src/Icon';
-import {DropDownMenu, IconMenu, MenuItem, Divider} from '../src/Menu';
+import {DropDownMenu, IconMenu, MenuItem} from '../src/Menu';
+import Divider from '../src/Divider';
+import '../src/Menu/IconMenu.styl';
+import '../src/Menu/DropDownMenu.styl';
+import '../src/Menu/MenuItem.styl';
+import '../src/Icon/Icon.styl'
+import '../src/Ripple/TouchRipple.styl';
+import '../src/Divider/Divider.styl';
 
 export default {
 
     components: {
-        'icon': Icon,
+        'san-icon': Icon,
         'san-dropdownmenu': DropDownMenu,
         'san-iconmenu': IconMenu,
         'san-menuitem': MenuItem,
@@ -53,21 +110,32 @@ export default {
     initData() {
         return {
             value: 1,
-            multipleValues: [2,3]
+            multipleValues: [2,3],
+            anchorOrigin: {
+                vertical: 'bottom',
+                horizontal: 'right'
+            },
+            targetOrigin: {
+                horizontal: 'left',
+                vertical: 'top'
+            },
+            selectedMenuItemStyle: {
+                width: '200px'
+            }
         };
     },
 
     dropDownChange(value) {
-        console.log('value of dropdown menu changed to: ' + value);
+        alert('value of dropdown menu changed to: ' + value);
     },
     dropDownClose() {
-        console.log('menu closed');
+        alert('menu closed');
     },
     download() {
-        console.log('starting to download');
+        alert('starting to download');
     },
     iconMenuMultipleChange(value) {
-        console.log('iconmenu multiple values changed to: ' + JSON.stringify(value));
+        alert('iconmenu multiple values changed to: ' + JSON.stringify(value));
     }
 
 }
@@ -82,6 +150,10 @@ export default {
     font-weight: bold;
 }
 
+.sm-menu-intro span{
+    font-size: 14px;
+}
+
 .sm-menu-intro:first-child {
     margin-top: 20px;
 }

diff --git a/example/Pagination.san b/example/Pagination.san
@@ -10,19 +10,20 @@
 
 <script type="text/javascript">
 
-    import Pagination from '../src/Pagination';
+import Pagination from '../src/Pagination';
+import '../src/Pagination/index.styl';
 
-    export default {
-        components: {
-            'san-pagination': Pagination
-        },
-        onPageChange(data) {
-            console.log(data);
-        },
-        onPageSizeChange(data) {
-            console.log(data);
-        }
-    };
+export default {
+    components: {
+        'san-pagination': Pagination
+    },
+    onPageChange(data) {
+        console.log(data);
+    },
+    onPageSizeChange(data) {
+        console.log(data);
+    }
+};
 </script>
 
 <style type="text/css">

diff --git a/example/Radio.san b/example/Radio.san
@@ -12,7 +12,7 @@
 
 <script>
 import Radio from '../src/Radio';
-
+import '../src/Radio/Radio.styl';
 export default {
 
     components: {