npm - w-component-vue - Versions diffs - 2.2.12 → 2.2.13 - Mend

w-component-vue 2.2.12 → 2.2.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (890) hide show

package/docs/examples/w-panel-avatar_spaceHBetweenAvatarAndHeader_spaceVBetweenHeaderAndContent.html ADDED Viewed

@@ -0,0 +1,216 @@
+<!doctype html>
+<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-tw">
+<head>
+    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
+    <meta
+        name="viewport"
+        content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui"
+    />
+    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+    <title>w-component-vue</title>
+    <!-- @babel/polyfill -->
+    <script
+        nomodule
+        src="https://cdn.jsdelivr.net/npm/@babel/polyfill/dist/polyfill.min.js"
+    ></script>
+    <!-- vue -->
+    <script src="https://cdn.jsdelivr.net/npm/vue@2.x/dist/vue.min.js"></script>
+    <!-- extractHtml已自動添加@babel/polyfill與vue -->
+    <!-- vuetify -->
+    <link
+        href="https://cdn.jsdelivr.net/npm/vuetify@2.5.1/dist/vuetify.min.css"
+        rel="stylesheet"
+    />
+    <script
+        src="https://cdn.jsdelivr.net/npm/vuetify@2.5.1/dist/vuetify.min.js"
+    ></script>
+    <!-- fontawesome -->
+    <link
+        href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.15.4/css/all.min.css"
+        rel="stylesheet"
+    />
+    <!-- mdi, 各組件使用mdi/js會於轉單頁時改為mdi icon, 故需引用mdi/css -->
+    <link
+        href="https://cdn.jsdelivr.net/npm/@mdi/font@6.6.96/css/materialdesignicons.min.css"
+        rel="stylesheet"
+    />
+    <!-- google, 各組件使用mdi/js故不需引用 -->
+    <link
+        _href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900"
+        rel="stylesheet"
+    />
+    <link
+        _href="https://fonts.googleapis.com/css?family=Material+Icons"
+        rel="stylesheet"
+    />
+    <!-- data -->
+    <script
+        src="https://cdn.jsdelivr.net/npm/w-demores@1.0.18/res/data/dataAAPL.js"
+    ></script>
+    <script
+        src="https://cdn.jsdelivr.net/npm/w-demores@1.0.18/res/data/dataUSD2EUR.js"
+    ></script>
+    <script
+        src="https://cdn.jsdelivr.net/npm/w-demores@1.0.18/res/data/dataTemperature.js"
+    ></script>
+    <script
+        src="https://cdn.jsdelivr.net/npm/w-demores@1.0.18/res/data/dataHousePriceArea.js"
+    ></script>
+    <script
+        src="https://cdn.jsdelivr.net/npm/w-demores@1.0.18/res/data/dataFlare.js"
+    ></script>
+    <script
+        src="https://cdn.jsdelivr.net/npm/w-demores@1.0.18/res/data/dataRain.js"
+    ></script>
+    <script
+        src="https://cdn.jsdelivr.net/npm/w-demores@1.0.18/res/data/dataRainClip.js"
+    ></script>
+    <script>
+  //save in window
+  window.dataAAPL = dataAAPL;
+  window.dataUSD2EUR = dataUSD2EUR;
+  window.dataTemperature = dataTemperature;
+  window.dataHousePriceArea = dataHousePriceArea;
+  window.dataFlare = dataFlare;
+  window.dataRain = dataRain;
+  window.dataRainClip = dataRainClip;
+    </script>
+    <!-- w-component-vue -->
+    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.13/dist/w-component-vue.umd.js"></script>
+    <style>
+  .v-application--wrap {
+    /* width與max-width fix for IE11, 其外不能使用padding或margin避免失效 */
+    width: 100vw;
+    max-width: 100vw;
+    font-family: inherit;
+    background: #fff;
+  }
+  .item {
+    /* 因item位於demolink, 提取各範例html後會刪除demolink, 故得額外補上 */
+    border-left: 3px solid #ffba75;
+    margin: 5px 5px 8px 0px;
+    padding: 3px 3px 5px 10px;
+    font-size: 0.9rem;
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+  }
+  .head1 {
+    margin: 0px;
+    padding: 0px 0px 20px 0px;
+    font-size: 2.5rem;
+  }
+  .bk {
+    vertical-align: top;
+    margin: 10px 0px 0px 0px;
+    padding: 0px 0px 60px 0px;
+  }
+  @media screen and (min-width: 1000px) {
+    /* 寬版 */
+    .bk {
+      display: inline-block;
+      margin: 0px 80px 0px 0px;
+    }
+    .dz {
+      width: 400px;
+    }
+  }
+    </style>
+</head>
+<body
+    style="font-family:'Microsoft JhengHei','Avenir','Helvetica'; padding:0px; margin:0px;"
+>
+    <v-app id="app" style="font-family:inherit; padding:0px 30px;">
+        <div class="head1">
+            <span
+                style="cursor:pointer;"
+                title="open for copy link to view component"
+                onclick="window.open('//yuda-lyu.github.io/w-component-vue/examples/app.html?cmp='+this.innerText,'_blank')"
+            >w-panel-avatar</span>
+        </div>
+        <div class="bk">
+            <div
+                class="item"
+            >spaceHBetweenAvatarAndHeader &amp; spaceVBetweenHeaderAndContent</div>
+            <div style="max-width:400px; padding:40px; background:#bbb;">
+                <w-panel-avatar
+                    style
+                    :sub-header-text="WPanelAvatar.subTitle"
+                    :header-text="WPanelAvatar.title"
+                    :space-h-between-avatar-and-header="40"
+                    :space-v-between-header-and-content="15"
+                >
+                    <div
+                        style="padding:5px 10px; font-size:0.7rem; color:#999;"
+                    >
+                        <i class="fas fa-drum-steelpan"></i>
+                        <span style="margin-left:8px;">Last 24HR</span>
+                    </div>
+                </w-panel-avatar>
+            </div>
+        </div>
+    </v-app>
+    <script>
+  //install
+  Vue.use(window["w-component-vue"]);
+  //initialize
+  new Vue({
+    el: "#app",
+    vuetify: new Vuetify(),
+    data: function() {
+      return {
+        WPanelAvatar: {
+          table:
+            '\n<div style="margin-bottom:10px; padding:0px 10px;">\n                        <span>A data table</span>\n                    </div>\n\n                    <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">\n                        <thead>\n                            <tr>\n                                <th style="padding:2px 8px; text-align:left;">Dessert</th>\n                                <th style="padding:2px 8px; text-align:left;">Calories</th>\n                                <th style="padding:2px 8px; text-align:left;">Fat</th>\n                                <th style="padding:2px 8px; text-align:left;">Carbs</th>\n                            </tr>\n                        </thead>\n                        <tbody>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>\n                            </tr>\n                        </tbody>\n                    </table>\n',
+          title: "52/128",
+          subTitle: "Recovery rate",
+          menu: {
+            items: [
+              {
+                text: "Dashboard",
+                icon: "mdi-view-dashboard"
+              },
+              {
+                text: "Schedule",
+                icon: "mdi-clock-time-eight-outline"
+              },
+              {
+                text: "Profile",
+                icon: "mdi-blender-software"
+              },
+              {
+                text: "History",
+                icon: "mdi-spoon-sugar"
+              }
+            ],
+            select: {
+              text: "Dashboard",
+              icon: "mdi-view-dashboard"
+            }
+          }
+        },
+        actions: []
+      };
+    },
+    mounted: function() {
+      return {};
+    },
+    computed: {},
+    methods: {}
+  });
+    </script>
+</body>
+</html>

package/docs/examples/w-panel-bulge_contentBackgroundColor.html CHANGED Viewed

@@ -85,7 +85,7 @@
     </script>
     <!-- w-component-vue -->
-    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.12/dist/w-component-vue.umd.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.13/dist/w-component-vue.umd.js"></script>
     <style>
   .v-application--wrap {
@@ -162,45 +162,6 @@
     data: function() {
       return {
         WPanelBulge: {
-          tableFun: function() {
-            //註解會於編譯階段被清除無法用f2c
-            /**
-                            <div style="margin-bottom:10px; padding:0px 10px;">
-                                <span>A data table</span>
-                            </div>
-                            <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">
-                                <thead>
-                                    <tr>
-                                        <th style="padding:2px 8px; text-align:left;">Dessert</th>
-                                        <th style="padding:2px 8px; text-align:left;">Calories</th>
-                                        <th style="padding:2px 8px; text-align:left;">Fat</th>
-                                        <th style="padding:2px 8px; text-align:left;">Carbs</th>
-                                    </tr>
-                                </thead>
-                                <tbody>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>
-                                    </tr>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>
-                                    </tr>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>
-                                    </tr>
-                                </tbody>
-                            </table>
-                             */
-          },
           table:
             '\n<div style="margin-bottom:10px; padding:0px 10px;">\n                        <span>A data table</span>\n                    </div>\n\n                    <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">\n                        <thead>\n                            <tr>\n                                <th style="padding:2px 8px; text-align:left;">Dessert</th>\n                                <th style="padding:2px 8px; text-align:left;">Calories</th>\n                                <th style="padding:2px 8px; text-align:left;">Fat</th>\n                                <th style="padding:2px 8px; text-align:left;">Carbs</th>\n                            </tr>\n                        </thead>\n                        <tbody>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>\n                            </tr>\n                        </tbody>\n                    </table>\n',
           title: "Bulge",

package/docs/examples/w-panel-bulge_contentBorderRadius.html CHANGED Viewed

@@ -85,7 +85,7 @@
     </script>
     <!-- w-component-vue -->
-    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.12/dist/w-component-vue.umd.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.13/dist/w-component-vue.umd.js"></script>
     <style>
   .v-application--wrap {
@@ -162,45 +162,6 @@
     data: function() {
       return {
         WPanelBulge: {
-          tableFun: function() {
-            //註解會於編譯階段被清除無法用f2c
-            /**
-                            <div style="margin-bottom:10px; padding:0px 10px;">
-                                <span>A data table</span>
-                            </div>
-                            <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">
-                                <thead>
-                                    <tr>
-                                        <th style="padding:2px 8px; text-align:left;">Dessert</th>
-                                        <th style="padding:2px 8px; text-align:left;">Calories</th>
-                                        <th style="padding:2px 8px; text-align:left;">Fat</th>
-                                        <th style="padding:2px 8px; text-align:left;">Carbs</th>
-                                    </tr>
-                                </thead>
-                                <tbody>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>
-                                    </tr>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>
-                                    </tr>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>
-                                    </tr>
-                                </tbody>
-                            </table>
-                             */
-          },
           table:
             '\n<div style="margin-bottom:10px; padding:0px 10px;">\n                        <span>A data table</span>\n                    </div>\n\n                    <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">\n                        <thead>\n                            <tr>\n                                <th style="padding:2px 8px; text-align:left;">Dessert</th>\n                                <th style="padding:2px 8px; text-align:left;">Calories</th>\n                                <th style="padding:2px 8px; text-align:left;">Fat</th>\n                                <th style="padding:2px 8px; text-align:left;">Carbs</th>\n                            </tr>\n                        </thead>\n                        <tbody>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>\n                            </tr>\n                        </tbody>\n                    </table>\n',
           title: "Bulge",

package/docs/examples/w-panel-bulge_default.html CHANGED Viewed

@@ -85,7 +85,7 @@
     </script>
     <!-- w-component-vue -->
-    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.12/dist/w-component-vue.umd.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.13/dist/w-component-vue.umd.js"></script>
     <style>
   .v-application--wrap {
@@ -161,45 +161,6 @@
     data: function() {
       return {
         WPanelBulge: {
-          tableFun: function() {
-            //註解會於編譯階段被清除無法用f2c
-            /**
-                            <div style="margin-bottom:10px; padding:0px 10px;">
-                                <span>A data table</span>
-                            </div>
-                            <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">
-                                <thead>
-                                    <tr>
-                                        <th style="padding:2px 8px; text-align:left;">Dessert</th>
-                                        <th style="padding:2px 8px; text-align:left;">Calories</th>
-                                        <th style="padding:2px 8px; text-align:left;">Fat</th>
-                                        <th style="padding:2px 8px; text-align:left;">Carbs</th>
-                                    </tr>
-                                </thead>
-                                <tbody>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>
-                                    </tr>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>
-                                    </tr>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>
-                                    </tr>
-                                </tbody>
-                            </table>
-                             */
-          },
           table:
             '\n<div style="margin-bottom:10px; padding:0px 10px;">\n                        <span>A data table</span>\n                    </div>\n\n                    <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">\n                        <thead>\n                            <tr>\n                                <th style="padding:2px 8px; text-align:left;">Dessert</th>\n                                <th style="padding:2px 8px; text-align:left;">Calories</th>\n                                <th style="padding:2px 8px; text-align:left;">Fat</th>\n                                <th style="padding:2px 8px; text-align:left;">Carbs</th>\n                            </tr>\n                        </thead>\n                        <tbody>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>\n                            </tr>\n                        </tbody>\n                    </table>\n',
           title: "Bulge",

package/docs/examples/w-panel-bulge_headerBorderRadius.html CHANGED Viewed

@@ -85,7 +85,7 @@
     </script>
     <!-- w-component-vue -->
-    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.12/dist/w-component-vue.umd.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.13/dist/w-component-vue.umd.js"></script>
     <style>
   .v-application--wrap {
@@ -162,45 +162,6 @@
     data: function() {
       return {
         WPanelBulge: {
-          tableFun: function() {
-            //註解會於編譯階段被清除無法用f2c
-            /**
-                            <div style="margin-bottom:10px; padding:0px 10px;">
-                                <span>A data table</span>
-                            </div>
-                            <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">
-                                <thead>
-                                    <tr>
-                                        <th style="padding:2px 8px; text-align:left;">Dessert</th>
-                                        <th style="padding:2px 8px; text-align:left;">Calories</th>
-                                        <th style="padding:2px 8px; text-align:left;">Fat</th>
-                                        <th style="padding:2px 8px; text-align:left;">Carbs</th>
-                                    </tr>
-                                </thead>
-                                <tbody>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>
-                                    </tr>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>
-                                    </tr>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>
-                                    </tr>
-                                </tbody>
-                            </table>
-                             */
-          },
           table:
             '\n<div style="margin-bottom:10px; padding:0px 10px;">\n                        <span>A data table</span>\n                    </div>\n\n                    <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">\n                        <thead>\n                            <tr>\n                                <th style="padding:2px 8px; text-align:left;">Dessert</th>\n                                <th style="padding:2px 8px; text-align:left;">Calories</th>\n                                <th style="padding:2px 8px; text-align:left;">Fat</th>\n                                <th style="padding:2px 8px; text-align:left;">Carbs</th>\n                            </tr>\n                        </thead>\n                        <tbody>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>\n                            </tr>\n                        </tbody>\n                    </table>\n',
           title: "Bulge",

package/docs/examples/w-panel-bulge_headerTextColor_headerBackgroundColor.html CHANGED Viewed

@@ -85,7 +85,7 @@
     </script>
     <!-- w-component-vue -->
-    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.12/dist/w-component-vue.umd.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.13/dist/w-component-vue.umd.js"></script>
     <style>
   .v-application--wrap {
@@ -163,45 +163,6 @@
     data: function() {
       return {
         WPanelBulge: {
-          tableFun: function() {
-            //註解會於編譯階段被清除無法用f2c
-            /**
-                            <div style="margin-bottom:10px; padding:0px 10px;">
-                                <span>A data table</span>
-                            </div>
-                            <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">
-                                <thead>
-                                    <tr>
-                                        <th style="padding:2px 8px; text-align:left;">Dessert</th>
-                                        <th style="padding:2px 8px; text-align:left;">Calories</th>
-                                        <th style="padding:2px 8px; text-align:left;">Fat</th>
-                                        <th style="padding:2px 8px; text-align:left;">Carbs</th>
-                                    </tr>
-                                </thead>
-                                <tbody>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>
-                                    </tr>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>
-                                    </tr>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>
-                                    </tr>
-                                </tbody>
-                            </table>
-                             */
-          },
           table:
             '\n<div style="margin-bottom:10px; padding:0px 10px;">\n                        <span>A data table</span>\n                    </div>\n\n                    <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">\n                        <thead>\n                            <tr>\n                                <th style="padding:2px 8px; text-align:left;">Dessert</th>\n                                <th style="padding:2px 8px; text-align:left;">Calories</th>\n                                <th style="padding:2px 8px; text-align:left;">Fat</th>\n                                <th style="padding:2px 8px; text-align:left;">Carbs</th>\n                            </tr>\n                        </thead>\n                        <tbody>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>\n                            </tr>\n                        </tbody>\n                    </table>\n',
           title: "Bulge",

package/docs/examples/w-panel-bulge_no headerShadow_no contentShadow, with green outer.html CHANGED Viewed

@@ -85,7 +85,7 @@
     </script>
     <!-- w-component-vue -->
-    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.12/dist/w-component-vue.umd.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/w-component-vue@2.2.13/dist/w-component-vue.umd.js"></script>
     <style>
   .v-application--wrap {
@@ -167,45 +167,6 @@
     data: function() {
       return {
         WPanelBulge: {
-          tableFun: function() {
-            //註解會於編譯階段被清除無法用f2c
-            /**
-                            <div style="margin-bottom:10px; padding:0px 10px;">
-                                <span>A data table</span>
-                            </div>
-                            <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">
-                                <thead>
-                                    <tr>
-                                        <th style="padding:2px 8px; text-align:left;">Dessert</th>
-                                        <th style="padding:2px 8px; text-align:left;">Calories</th>
-                                        <th style="padding:2px 8px; text-align:left;">Fat</th>
-                                        <th style="padding:2px 8px; text-align:left;">Carbs</th>
-                                    </tr>
-                                </thead>
-                                <tbody>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>
-                                    </tr>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>
-                                    </tr>
-                                    <tr>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>
-                                        <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>
-                                    </tr>
-                                </tbody>
-                            </table>
-                             */
-          },
           table:
             '\n<div style="margin-bottom:10px; padding:0px 10px;">\n                        <span>A data table</span>\n                    </div>\n\n                    <table style="width:100%; font-size:0.7rem; border-collapse:collapse;">\n                        <thead>\n                            <tr>\n                                <th style="padding:2px 8px; text-align:left;">Dessert</th>\n                                <th style="padding:2px 8px; text-align:left;">Calories</th>\n                                <th style="padding:2px 8px; text-align:left;">Fat</th>\n                                <th style="padding:2px 8px; text-align:left;">Carbs</th>\n                            </tr>\n                        </thead>\n                        <tbody>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Frozen Yogurt</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">159</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">6</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">24</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Ice cream sandwich</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">237</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">9</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">37</td>\n                            </tr>\n                            <tr>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">Eclair</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">262</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">16</td>\n                                <td style="padding:2px 8px; border-top:1px solid #ddd;">23</td>\n                            </tr>\n                        </tbody>\n                    </table>\n',
           title: "Bulge",