@pisell/materials 6.0.19 → 6.0.20

package/lowcode/timeline/meta.ts

@@ -37,20 +37,38 @@ export default {
                     initialValue: (val) => val || uuid(),
                   },
                   {
-                    name: 'color',
-                    title: '圆圈颜色',
-                    setter: 'StringSetter',
+                    name: "children",
+                    title: "内容",
+                    setter: {
+                      componentName: "SlotSetter",
+                      initialValue: {
+                        type: "JSSlot",
+                        value: [],
+                      },
+                    },
                   },
+                  {
+                    name: "color",
+                    title: "圆圈颜色",
+                    propType: 'string',
+                    defaultValue: '#D0D5DD',
+                    setter: 'ColorSetter',
+                  },
+                  // {
+                  //   name: 'color',
+                  //   title: '圆圈颜色',
+                  //   setter: 'StringSetter',
+                  // },
                   {
                     name: 'dot',
                     title: '自定义时间轴点',
                     setter: 'node',
                   },
-                  {
-                    name: 'label',
-                    title: '设置标签',
-                    setter: 'PisellI18nSetter',
-                  },
+                  // {
+                  //   name: 'label',
+                  //   title: '设置标签',
+                  //   setter: 'PisellI18nSetter',
+                  // },
                   {
                     name: 'position',
                     title: {
@@ -86,7 +104,12 @@ export default {
             initialValue: () => {
               return {
                 key: `timeLine${uuid()}`,
-                label: '时间轴',
+                // label: '时间轴',
+                color: '#D0D5DD',
+                children: {
+                  type: "JSSlot",
+                  value: [],
+                },
               };
             },
           },

package/lowcode/timeline/snippets.ts

@@ -8,11 +8,21 @@ export default [
         steps: [
           {
             key: 'timeLinei5wd',
-            label: '时间轴',
+            color:'#D0D5DD',
+            // label: '时间轴',
+            children: {
+              type: "JSSlot",
+              value: [],
+            },
           },
           {
             key: 'timeLinei5wx',
-            label: '时间轴',
+            color:'#D0D5DD',
+            // label: '时间轴',
+            children: {
+              type: "JSSlot",
+              value: [],
+            },
           },
         ],
       },

package/lowcode/timeline.item/meta.ts

@@ -21,7 +21,7 @@ export default {
       name: 'color',
       title: { label: '颜色', tip: '颜色' },
       propType: 'string',
-      defaultValue: '#00f',
+      defaultValue: '#D0D5DD',
       setter: 'ColorSetter',
     },
     {

package/lowcode/wallet-card/meta.ts

@@ -0,0 +1,283 @@
+import snippets from './snippets';
+
+export default {
+  snippets,
+  componentName: 'WalletCard',
+  title: {
+    type: 'i18n',
+    'en-US': 'Wallet Card',
+    'zh-CN': '钱包卡片'
+  },
+  category: {
+    type: 'i18n',
+    'en-US': 'General',
+    'zh-CN': '通用'
+  },
+  docUrl: "",
+  screenshot: "",
+  devMode: "proCode",
+  npm: {
+    package: "@pisell/materials",
+    version: "1.0.1",
+    exportName: "WalletCard",
+    main: "src/index.tsx",
+    destructuring: true,
+    subName: "",
+  },
+  props: [
+    {
+      name: 'isLogin',
+      title: {
+        label: {
+          type: 'i18n',
+          'en-US': 'Display Status',
+          'zh-CN': '展示状态'
+        },
+        tip: {
+          type: 'i18n',
+          'en-US': 'Login status of the card. Values: true | false',
+          'zh-CN': '卡片的登录状态。取值: true | false'
+        }
+      },
+      setter: {
+        componentName: 'RadioGroupSetter',
+        props: {
+          options: [
+            { title: '已登录', value: true },
+            { title: '未登录', value: false },
+          ],
+          optionType: 'button'
+        },
+      },
+      defaultValue: true,
+    },
+    {
+      name: 'mode',
+      title: {
+        label: {
+          type: 'i18n',
+          'en-US': 'Display Mode',
+          'zh-CN': '展示模式'
+        },
+        tip: {
+          type: 'i18n',
+          'en-US': 'Display mode. Values: light | dark',
+          'zh-CN': '展示模式。取值: light | dark'
+        }
+      },
+      setter: {
+        componentName: 'RadioGroupSetter',
+        props: {
+          options: [
+            { title: 'Light', value: 'light' },
+            { title: 'Dark', value: 'dark' },
+          ],
+        },
+      },
+      defaultValue: 'dark',
+    },
+    {
+      name: 'cardStyle',
+      title: {
+        label: {
+          type: 'i18n',
+          'en-US': 'Card Style',
+          'zh-CN': '卡片样式'
+        },
+        tip: {
+          type: 'i18n',
+          'en-US': 'Card style. Values: normal | full',
+          'zh-CN': '卡片样式。取值: normal | full'
+        }
+      },
+      setter: {
+        componentName: 'RadioGroupSetter',
+        props: {
+          options: [
+            { title: 'Full', value: 'full' },
+            { title: 'Default', value: 'normal' },
+          ],
+        },
+      },
+      defaultValue: 'normal',
+    },
+    {
+      name: 'codeDirection',
+      title: {
+        label: {
+          type: 'i18n',
+          'en-US': 'Code Position',
+          'zh-CN': '码位置'
+        },
+        tip: {
+          type: 'i18n',
+          'en-US': 'Code position. Values: bottom | top',
+          'zh-CN': '码位置。取值: bottom | top'
+        }
+      },
+      setter: {
+        componentName: 'RadioGroupSetter',
+        props: {
+          options: [
+            { title: 'bottom', value: 'bottom' },
+            { title: 'Top', value: 'top' },
+          ],
+        },
+      },
+      defaultValue: 'bottom',
+    },
+    {
+      name: 'cardInfoDisplay',
+      type: 'group',
+      display: 'accordion',
+      title: {
+        label: {
+          type: 'i18n',
+          'en-US': 'Card Information Display',
+          'zh-CN': '卡片信息显示'
+        }
+      },
+      items: [
+        {
+          name: "showIcon",
+          title: {
+            label: {
+              type: 'i18n',
+              'en-US': 'Icon',
+              'zh-CN': '图标'
+            },
+            tip: {
+              type: 'i18n',
+              'en-US': 'Whether to display icon. Type: boolean',
+              'zh-CN': '是否显示图标。类型: boolean'
+            }
+          },
+          setter: "BoolSetter",
+          defaultValue: true
+        },
+        {
+          name: "showWalletName",
+          title: {
+            label: {
+              type: 'i18n',
+              'en-US': 'Wallet name',
+              'zh-CN': '钱包名称'
+            },
+            tip: {
+              type: 'i18n',
+              'en-US': 'Whether to display wallet name. Type: boolean',
+              'zh-CN': '是否显示钱包名称。类型: boolean'
+            }
+          },
+          setter: "BoolSetter",
+          defaultValue: true
+        },
+        {
+          name: "showShopName",
+          title: {
+            label: {
+              type: 'i18n',
+              'en-US': 'Store name',
+              'zh-CN': '店铺名称'
+            },
+            tip: {
+              type: 'i18n',
+              'en-US': 'Whether to display store name. Type: boolean',
+              'zh-CN': '是否显示店铺名称。类型: boolean'
+            }
+          },
+          setter: "BoolSetter",
+          defaultValue: true
+        },
+        {
+          name: "showCardNo",
+          title: {
+            label: {
+              type: 'i18n',
+              'en-US': 'Card number',
+              'zh-CN': '卡号'
+            },
+            tip: {
+              type: 'i18n',
+              'en-US': 'Whether to display card number. Type: boolean',
+              'zh-CN': '是否显示卡号。类型: boolean'
+            }
+          },
+          setter: "BoolSetter",
+          defaultValue: true
+        },
+        {
+          name: "showCode",
+          title: {
+            label: {
+              type: 'i18n',
+              'en-US': 'QR code/Barcode',
+              'zh-CN': '二维码/条码图标'
+            },
+            tip: {
+              type: 'i18n',
+              'en-US': 'Whether to display QR code/barcode. Type: boolean',
+              'zh-CN': '是否显示二维码/条形码图标。类型: boolean'
+            }
+          },
+          setter: "BoolSetter",
+          defaultValue: true
+        }
+      ]
+    },
+    {
+      name: 'guest',
+      type: 'group',
+      display: 'accordion',
+      title: "未登录信息展示",
+      items: [
+        {
+          name: 'title',
+          title: { label: '主标题', tip: '主标题' },
+          propType: 'string',
+          defaultValue: 'Hi Guest, Join Us',
+          setter: 'PisellI18nSetter',
+        },
+        {
+          name: 'subtitle',
+          title: { label: '副标题', tip: '副标题' },
+          propType: 'string',
+          defaultValue: 'Unlock perks with every purchase',
+          setter: 'TextAreaSetter',
+        },
+        {
+          name: 'align',
+          title: {
+            label: '对齐方式',
+            tip: '内容区域文字对齐方式 left | center'
+          },
+          setter: {
+            componentName: 'RadioGroupSetter',
+            props: {
+              options: [
+                { title: '左对齐', value: 'left' },
+                { title: '居中对齐', value: 'center' },
+              ],
+            },
+          },
+          defaultValue: 'left',
+        },
+        {
+          name: 'buttonText',
+          title: { label: '按钮文本', tip: '按钮文本' },
+          propType: 'string',
+          defaultValue: 'Sign Up Now',
+          setter: 'PisellI18nSetter',
+        }
+      ]
+    }
+  ],
+  configure: {
+    component: { isContainer: false },
+    supports: {
+      style: true,
+      className: true,
+      events: ['onClick', 'onCodeClick'],
+    },
+  },
+};

package/lowcode/wallet-card/snippets.ts

@@ -0,0 +1,44 @@
+export default [
+  {
+    title: '钱包卡',
+    screenshot: '',
+    schema: {
+      componentName: 'WalletCard',
+      props: {
+        isLogin:true,
+        mode: 'light',
+        cardStyle: 'full',
+        codeDirection: 'bottom',
+        showIcon: true,
+        showWalletName: true,
+        showShopName: true,
+        showCardNo: true,
+        showCode: true,
+        symbol: '$',
+        align: 'left',
+        items: [
+          {
+            key: 'points',
+            label: 'Points',
+            value: 0,
+          },
+          {
+            key: 'balance',
+            label: 'Balance',
+            value: 10,
+          },
+          {
+            key: 'discount',
+            label: 'Discount card',
+            value: 0,
+          },
+          {
+            key: 'voucher',
+            label: 'Voucher',
+            value: 0,
+          }
+        ],
+      },
+    },
+  },
+];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisell/materials",
-  "version": "6.0.19",
+  "version": "6.0.20",
   "main": "./lib/index.js",
   "module": "./es/index.js",
   "types": "./lib/index.d.ts",
@@ -58,6 +58,7 @@
     "@zxing/library": "0.21.2",
     "ahooks": "^3.7.6",
     "antd": "^5.6.3",
+    "antd-img-crop": "^4.23.0",
     "classnames": "^2.3.2",
     "crypto-js": "^4.2.0",
     "dayjs": "^1.11.8",
@@ -67,8 +68,11 @@
     "react-virtualized-auto-sizer": "^1.0.20",
     "react-window": "^1.8.10",
     "styled-components": "^6.0.0-rc.3",
-    "@pisell/icon": "0.0.11",
+    "swiper": "^8.4.7",
+    "react-barcode": "^1.5.3",
+    "vod-js-sdk-v6": "^1.4.11",
     "@pisell/date-picker": "1.0.100",
+    "@pisell/icon": "0.0.11",
     "@pisell/utils": "1.0.42"
   },
   "peerDependencies": {

package/dist/umd/materials.min.css

@@ -1 +0,0 @@
-.materials-grid{display:flex;flex-direction:column;height:100%;width:100%}.materials-grid-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.materials-grid-header .right-wrap{align-items:center;display:flex;gap:8px}.materials-grid-actions{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.materials-grid-actions .left-wrap{align-items:center;display:flex;flex:1 1}.materials-grid-actions .left-wrap .pisell-lowcode-form-item{margin-bottom:0}.materials-grid-actions .right-wrap{align-items:center;display:flex;gap:8px}.materials-grid-actions .right-wrap .icon{cursor:pointer;transition:.2s}.materials-grid-actions .right-wrap .icon:hover{color:var(--theme-color)}.materials-grid-actions .right-wrap .button{align-items:center;display:flex;font-size:12px;height:28px;justify-content:center}.filter-dropdown-wrap{display:flex;flex-direction:column;max-height:400px;max-width:calc(100vw - 24px);min-width:250px;padding:4px;width:400px}.filter-dropdown-wrap .filter-dropdown-wrap-content{flex:1 1;overflow:auto}.filter-dropdown-wrap .filter-dropdown-drag-item{align-items:center;background:#f9fafb;background:var(--gray-50,#f9fafb);border-radius:8px;display:flex;margin-bottom:12px;padding:8px 12px 12px}.filter-dropdown-wrap .filter-dropdown-drag-item .dots-six-icon{color:#98a2b3;cursor:pointer;font-size:24px}.filter-dropdown-wrap .filter-dropdown-drag-item .pisell-lowcode-form-item{margin-bottom:0}.filter-dropdown-wrap .filter-dropdown-drag-item .filter-dropdown-drag-item-right{flex:1 1;margin-left:16px}.filter-dropdown-wrap .filter-dropdown-drag-item .filter-dropdown-drag-item-right .filter-dropdown-drag-item-title{color:#777;color:var(--text-text-2,#777);font-size:14px;font-style:normal;font-weight:600;line-height:20px}.filter-dropdown-container-wrap{border-bottom:1px solid #e2e2e2;border-bottom:1px solid var(--surface-surface-4,#e2e2e2);margin-bottom:20px;min-height:70px}.filter-dropdown-container-wrap:last-child{border:none}.filter-dropdown-container-wrap .filter-dropdown-container-title-wrap{align-items:center;color:#919191;color:var(--text-text-3,#919191);display:flex;font-size:16px;font-style:normal;font-weight:600;line-height:22px;margin-bottom:12px}.filter-dropdown-container-wrap .filter-dropdown-container-title-wrap .filter-dropdown-container-title{color:#101828;color:var(--gray-900,#101828);font-size:16px;font-style:normal;font-weight:600;line-height:24px;margin-right:6px}.filter-dropdown-container-wrap .filter-dropdown-container-title-wrap .filter-dropdown-container-icon-help{color:#98a2b3;color:var(--gray-400,#98a2b3);font-size:20px}.filter-dropdown-container-wrap .filter-dropdown-container-filter-wrap{min-height:80px}.materials-sort-list-empty{color:#5a5a5a;display:block;padding-top:22px;text-align:center}.materials-grid-summary{margin-bottom:16px}.grid-view-table-wrap{position:relative}.materials-grid-paginator{align-items:center;background-color:#fff;border:1px solid #f0f0f0;border-radius:0 0 8px 8px;border-top:none;display:flex;height:50px;justify-content:center;margin:0!important;padding:0 20px;width:100%}.materials-grid-paginator .pisell-lowcode-pagination-total-text{color:#667085;color:var(--gray-500,#667085);font-size:14px;font-style:normal;font-weight:500;margin-right:auto}.materials-grid-paginator .pisell-lowcode-pagination-item{border:1px solid #d0d5dd;border-radius:0;border-right:0;margin:0;position:relative}.materials-grid-paginator .pisell-lowcode-pagination-jump-next,.materials-grid-paginator .pisell-lowcode-pagination-jump-prev{border:1px solid #d0d5dd;border-radius:0;border-right:none;margin:0}.materials-grid-paginator .pisell-lowcode-pagination-item-link:hover{color:rgba(0,0,0,.88)!important;font-weight:450!important}.materials-grid-paginator .pisell-lowcode-pagination-item-link:hover .pisell-lowcode-pagination-item-link-icon{color:rgba(0,0,0,.88)!important;font-weight:450!important}.materials-grid-paginator .pisell-lowcode-pagination-item-active:hover{border-color:#d0d5dd!important}.materials-grid-paginator .pisell-lowcode-pagination-item-active{background-color:rgba(0,0,0,.06)}.materials-grid-paginator .pisell-lowcode-pagination-item-active a{color:rgba(0,0,0,.88)!important;font-weight:450!important}.materials-grid-paginator .pisell-lowcode-pagination-prev{align-items:center;border:1px solid #d0d5dd;border-radius:8px 0 0 8px;border-right:none;display:flex;justify-content:center;margin:0;min-width:auto}.materials-grid-paginator .pisell-lowcode-pagination-next{align-items:center;border:1px solid #d0d5dd;border-radius:0 8px 8px 0;display:flex;justify-content:center;margin:0;min-width:auto}.paginator-page-btn{align-items:center;border-radius:4px 4px 4px 4px;color:#344054;color:var(--gray-700,#344054);cursor:pointer;display:flex;font-size:12px;font-weight:400;justify-content:center;padding:10px 16px;transition:.2s;-ms-user-select:none;user-select:none}.paginator-page-btn .paginator-page-btn-text{font-weight:600}.paginator-page-btn .paginator-page-btn-left-icon,.paginator-page-btn .paginator-page-btn-right-icon{font-size:20px}.paginator-page-btn .paginator-page-btn-left-icon{margin-right:8px}.paginator-page-btn .paginator-page-btn-right-icon{margin-left:8px}.paginator-page-btn.left{margin-right:auto}.paginator-page-btn.left .icon{font-size:18px;margin-right:8px}.paginator-page-btn.right{margin-left:auto}.paginator-page-btn.right .icon{font-size:18px;margin-left:8px;transform:rotate(180deg)}.materials-grid-paginator-mini{align-items:center;background-color:#fff;border:1px solid #f0f0f0;border-radius:0 0 8px 8px;border-top:none;display:flex;height:50px;justify-content:space-between;margin:0!important;overflow:hidden;padding:0 20px;width:100%}.materials-grid-paginator-mini .paginator-page-btn{padding:8px}.materials-grid-paginator-mini .materials-grid-paginator-center{align-items:center;display:flex;gap:4px;justify-content:center}.materials-grid-paginator-mini .materials-grid-paginator-center .materials-grid-paginator-center-text{color:#344054;color:var(--gray-700,#344054);font-size:14px;font-style:normal;font-weight:400}.materials-grid-paginator-mini .materials-grid-paginator-center .materials-grid-paginator-center-value{color:#344054;color:var(--gray-700,#344054);font-size:14px;font-style:normal;font-weight:500}.materials-grid-paginator-mini .pisell-lowcode-pagination-next,.materials-grid-paginator-mini .pisell-lowcode-pagination-prev{border:1px solid #d0d5dd;border-radius:8px;margin:0}.materials-grid-paginator-mini .pisell-lowcode-pagination-next .paginator-page-btn-left-icon,.materials-grid-paginator-mini .pisell-lowcode-pagination-prev .paginator-page-btn-left-icon{margin-right:0}.materials-grid-paginator-mini .pisell-lowcode-pagination-next .paginator-page-btn-right-icon,.materials-grid-paginator-mini .pisell-lowcode-pagination-prev .paginator-page-btn-right-icon{margin-left:0}.react-resizable{position:relative}.react-resizable-handle{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgd2lkdGg9IjYiIGhlaWdodD0iNiI+PHBhdGggZD0iTTYgNkgwVjQuMmg0LjJWMEg2djZaIiBvcGFjaXR5PSIuMzAyIi8+PC9zdmc+);background-origin:content-box;background-position:100% 100%;background-repeat:no-repeat;box-sizing:border-box;height:20px;padding:0 3px 3px 0;position:absolute;width:20px}.react-resizable-handle-sw{bottom:0;cursor:sw-resize;left:0;transform:rotate(90deg)}.react-resizable-handle-se{bottom:0;cursor:se-resize;right:0}.react-resizable-handle-nw{cursor:nw-resize;left:0;top:0;transform:rotate(180deg)}.react-resizable-handle-ne{cursor:ne-resize;right:0;top:0;transform:rotate(270deg)}.react-resizable-handle-e,.react-resizable-handle-w{cursor:ew-resize;margin-top:-10px;top:50%}.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-resizable-handle-n,.react-resizable-handle-s{cursor:ns-resize;left:50%;margin-left:-10px}.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}.materials-grid-table-header-cell{align-items:center;display:flex;height:44px;padding:0 14px}.materials-grid-table-header-cell .field-icon{color:#777;font-size:18px}.materials-grid-table-header-cell .materials-grid-table-header-cell-content{color:#1b1b1b;flex:auto;font-size:14px;font-weight:600;overflow:hidden;padding-right:10px;text-overflow:ellipsis;white-space:nowrap;word-break:break-all}.materials-grid-table-header-cell .actions{align-items:center;display:flex;gap:8px}.materials-grid-table-header-cell .actions .action{color:#ababab;cursor:pointer;font-size:14px}.editable-cell-value-wrap{height:100%;width:100%}.materials-grid-table-cell{height:1px;padding:0!important}.cell-provider{align-items:center;border-radius:4px;cursor:pointer;display:flex;height:100%;justify-content:center;padding:12px;position:relative;width:100%}.cell-provider.focus{box-shadow:var(--theme-color) 0 0 0 1px!important}