@dckj-npm/dc-material 0.1.0 → 0.1.1

package/lib/components/title/title-2.scss

@@ -0,0 +1,22 @@
+@import '../../variables.scss';
+
+.custom-title-2 {
+
+  & > div {
+    font-size: 16px;
+    font-weight: 500;
+    color: #144477;
+    display: flex;
+    gap: 3.5px;
+    align-items: center;
+
+    & > div.tips {
+      content: '';
+      display: inline-block;
+      width: 3.5px;
+      height: 14.5px;
+      background-color: #388AF7;
+    }
+  }
+
+}

package/lib/index.d.ts

@@ -1,8 +1,12 @@
-export type { ColorfulButtonProps } from './components/colorful-button';
-export { default as ColorfulButton } from './components/colorful-button';
-export type { ColorfulInputProps } from './components/colorful-input';
-export { default as ColorfulInput } from './components/colorful-input';
+export type { ComponentProps } from './components/dc-slider';
+export { default as DCSlider } from './components/dc-slider';
+export type { NavigationProps } from './components/bottom-navigation';
+export { default as Navigation } from './components/bottom-navigation';
 export type { TeletextListProps } from './components/teletext-list';
 export { default as TeletextList } from './components/teletext-list';
+export type { Title1Props } from './components/title';
+export { Title1 } from './components/title';
+export type { Title2Props } from './components/title';
+export { Title2 } from './components/title';
 declare const bizCssPrefix = "bizpack";
 export { bizCssPrefix };

package/lib/index.js

@@ -2,11 +2,14 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
-exports.bizCssPrefix = exports.TeletextList = exports.ColorfulInput = exports.ColorfulButton = void 0;
-var _colorfulButton = _interopRequireDefault(require("./components/colorful-button"));
-exports.ColorfulButton = _colorfulButton["default"];
-var _colorfulInput = _interopRequireDefault(require("./components/colorful-input"));
-exports.ColorfulInput = _colorfulInput["default"];
+exports.bizCssPrefix = exports.Title2 = exports.Title1 = exports.TeletextList = exports.Navigation = exports.DCSlider = void 0;
+var _dcSlider = _interopRequireDefault(require("./components/dc-slider"));
+exports.DCSlider = _dcSlider["default"];
+var _bottomNavigation = _interopRequireDefault(require("./components/bottom-navigation"));
+exports.Navigation = _bottomNavigation["default"];
 var _teletextList = _interopRequireDefault(require("./components/teletext-list"));
 exports.TeletextList = _teletextList["default"];
+var _title = require("./components/title");
+exports.Title1 = _title.Title1;
+exports.Title2 = _title.Title2;
 var bizCssPrefix = exports.bizCssPrefix = 'bizpack';

package/lib/style.js

@@ -1,3 +1,3 @@
-require('@alifd/next/lib/button/style');
-require('@alifd/next/lib/input/style');
+require('@alifd/next/lib/slider/style');
+
 require('./index.scss');

package/lowcode/d-c-slider/meta.ts

@@ -0,0 +1,331 @@
+import snippets from './snippets';
+
+export default {
+  group: '原子组件',
+  componentName: 'DCSlider',
+  title: '图片轮播',
+  docUrl: '',
+  screenshot: '',
+  "npm": {
+    "package": "@dckj-npm/dc-material",
+    "version": "0.1.2",
+    "exportName": "DCSlider",
+    "main": "src\\index.tsx",
+    "destructuring": true,
+    "subName": ""
+  },
+  props: [
+    {
+      name: 'prefix',
+      propType: 'string',
+      defaultValue: 'next-',
+    },
+    {
+      name: 'rtl',
+      propType: 'bool',
+      defaultValue: false,
+    },
+    {
+      name: 'className',
+      propType: 'any',
+      description: '自定义传入的样式',
+    },
+    {
+      name: 'slidesToShow',
+      title: {
+        label: '图片数量',
+        tip: 'slidesToShow|同时展示的图片数量',
+      },
+      propType: 'number',
+      description: '同时展示的图片数量',
+      defaultValue: 1,
+    },
+    {
+      name: 'slidesToScroll',
+      title: {
+        label: '同时滑动的图片数量',
+        tip: 'slidesToScroll',
+      },
+      propType: 'number',
+      description: '同时滑动的图片数量',
+      defaultValue: 1,
+    },
+    {
+      name: 'speed',
+      title: {
+        label: '轮播速度',
+        tip: 'speed',
+      },
+      propType: 'number',
+      description: '轮播速度',
+      defaultValue: 600,
+    },
+    {
+      name: 'activeIndex',
+      title: {
+        label: '指定轮播图',
+        tip: 'activeIndex|跳转到指定的轮播图（受控）',
+      },
+      propType: 'number',
+      description: '跳转到指定的轮播图（受控）',
+    },
+    {
+      name: 'adaptiveHeight',
+      title: {
+        label: '自适应高度',
+        tip: 'adaptiveHeight',
+      },
+      propType: 'bool',
+      description: '是否使用自适应高度',
+      defaultValue: true,
+    },
+    {
+      name: 'animation',
+      title: {
+        label: '动效类型',
+        tip: 'animation',
+      },
+      propType: {
+        type: 'oneOfType',
+        value: ['string', 'bool'],
+      },
+      description: "动效类型，默认是'slide'",
+      defaultValue: 'slide',
+    },
+    {
+      name: 'arrows',
+      title: {
+        label: '箭头',
+        tip: 'arrows|是否显示箭头',
+      },
+      propType: 'bool',
+      description: '是否显示箭头',
+      defaultValue: true,
+    },
+    {
+      name: 'arrowSize',
+      title: {
+        label: '箭头大小',
+        tip: "arrowSize|导航箭头大小 可选值: 'medium', 'large'",
+      },
+      propType: {
+        type: 'oneOf',
+        value: ['medium', 'large'],
+      },
+      description: "导航箭头大小 可选值: 'medium', 'large'",
+      defaultValue: 'medium',
+    },
+    {
+      name: 'arrowPosition',
+      title: {
+        label: '箭头位置',
+        tip: "arrowPosition|导航箭头位置 可选值: 'inner', 'outer'",
+      },
+      propType: {
+        type: 'oneOf',
+        value: ['inner', 'outer'],
+      },
+      description: "导航箭头位置 可选值: 'inner', 'outer'",
+      defaultValue: 'inner',
+    },
+    {
+      name: 'arrowDirection',
+      title: {
+        label: '箭头方向',
+        tip: "arrowDirection|导航箭头的方向 可选值: 'hoz', 'ver'",
+      },
+      propType: {
+        type: 'oneOf',
+        value: ['hoz', 'ver'],
+      },
+      description: "导航箭头的方向 可选值: 'hoz', 'ver'",
+      defaultValue: 'hoz',
+    },
+    {
+      name: 'autoplay',
+      title: {
+        label: '自动播放',
+        tip: 'autoplay',
+      },
+      propType: 'bool',
+      description: '是否自动播放',
+      defaultValue: false,
+    },
+    {
+      name: 'autoplaySpeed',
+      title: {
+        label: '自动播放的速度',
+        tip: 'autoplaySpeed, 默认 3000 毫秒',
+      },
+      propType: 'number',
+      description: '自动播放的速度',
+      defaultValue: 3000,
+    },
+    {
+      name: 'nextArrow',
+      propType: 'node',
+      description: '向后箭头',
+      defaultValue: null,
+    },
+    {
+      name: 'prevArrow',
+      propType: 'node',
+      description: '向前箭头',
+      defaultValue: null,
+    },
+    {
+      name: 'centerMode',
+      title: {
+        label: '居中模式',
+        tip: 'centerMode',
+      },
+      propType: 'bool',
+      description: '是否启用居中模式',
+      defaultValue: false,
+    },
+    {
+      name: 'dots',
+      title: {
+        label: '导航锚点',
+        tip: 'dots|是否显示导航锚点',
+      },
+      propType: 'bool',
+      description: '是否显示导航锚点',
+      defaultValue: true,
+    },
+    {
+      name: 'dotsDirection',
+      title: {
+        label: '导航锚点位置',
+        tip: 'dotsDirection',
+      },
+      propType: {
+        type: 'oneOf',
+        value: ['hoz', 'ver'],
+      },
+      description: '导航锚点位置',
+      defaultValue: 'hoz',
+    },
+    {
+      name: 'draggable',
+      title: {
+        label: '可拖拽',
+        tip: 'draggable',
+      },
+      propType: 'bool',
+      description: '是否可拖拽',
+      defaultValue: true,
+    },
+    {
+      name: 'infinite',
+      title: {
+        label: '无穷循环',
+        tip: 'infinite',
+      },
+      propType: 'bool',
+      description: '是否使用无穷循环模式',
+      defaultValue: true,
+    },
+    {
+      name: 'defaultActiveIndex',
+      title: {
+        label: '初始轮播图',
+        tip: 'defaultActiveIndex|初始被激活的轮播图',
+      },
+      propType: 'number',
+      description: '初始被激活的轮播图',
+      defaultValue: 0,
+    },
+    {
+      name: 'lazyLoad',
+      title: {
+        label: '懒加载',
+        tip: 'lazyLoad|是否启用懒加载',
+      },
+      propType: 'bool',
+      description: '是否启用懒加载',
+      defaultValue: false,
+    },
+    {
+      name: 'slideDirection',
+      title: {
+        label: '轮播方向',
+        tip: 'slideDirection',
+      },
+      propType: {
+        type: 'oneOf',
+        value: ['hoz', 'ver'],
+      },
+      description: '轮播方向',
+      defaultValue: 'hoz',
+    },
+    {
+      name: 'triggerType',
+      title: {
+        label: '触发方式',
+        tip: 'triggerType|锚点导航触发方式',
+      },
+      propType: {
+        type: 'oneOf',
+        value: ['click', 'hover'],
+      },
+      description: '锚点导航触发方式',
+      defaultValue: 'click',
+    },
+    {
+      name: 'onChange',
+      propType: 'func',
+      description: '轮播切换的回调函数\n@param {Number} index 幻灯片的索引',
+    },
+    {
+      name: 'onBeforeChange',
+      propType: 'func',
+    },
+    {
+      name: 'style',
+      propType: 'object',
+      description: '自定义传入的class',
+      defaultValue: null,
+    },
+    {
+      name: 'picUrls',
+      propType: 'array',
+      description: '图片路径',
+    },
+    {
+      name: 'focusOnSelect',
+      title: {
+        label: '自动居中',
+        tip: 'focusOnSelect|多图轮播时，点击选中后自动居中',
+      },
+      propType: 'bool',
+      description: '多图轮播时，点击选中后自动居中',
+      defaultValue: false,
+    },
+  ],
+  configure: {
+    component: {
+      isContainer: true,
+    },
+    props: {
+      isExtends: true,
+      override: [
+        {
+          name: 'rtl',
+          condition: () => false,
+        },
+        {
+          name: 'prefix',
+          condition: () => false,
+        },
+        {
+          name: 'picUrls',
+          setter: 'SetterFormVariable'
+        }
+      ],
+    },
+  },
+  icon: '',
+  category: '信息展示',
+  snippets,
+};

package/lowcode/d-c-slider/snippets.ts

@@ -0,0 +1,42 @@
+export default [
+  {
+    title: '图片轮播',
+    screenshot:
+      'https://alifd.oss-cn-hangzhou.aliyuncs.com/fusion-cool/icons/icon-light/ic_light_slider.png',
+    schema: {
+      componentName: 'DCSlider',
+      props: {
+        prefix: 'next-',
+        animation: 'slide',
+        arrows: true,
+        arrowSize: 'medium',
+        arrowPosition: 'inner',
+        arrowDirection: 'hoz',
+        autoplaySpeed: 3000,
+        dots: true,
+        dotsDirection: 'hoz',
+        draggable: true,
+        infinite: true,
+        slide: 'div',
+        slideDirection: 'hoz',
+        slidesToShow: 1,
+        slidesToScroll: 1,
+        speed: 600,
+        triggerType: 'click',
+        centerPadding: '50px',
+        cssEase: 'ease',
+        edgeFriction: 0.35,
+        swipe: true,
+        touchMove: true,
+        touchThreshold: 5,
+        useCSS: true,
+        waitForAnimate: true,
+        // 轮播路径
+        picUrls: ['https://img.alicdn.com/tps/TB1bewbNVXXXXc5XXXXXXXXXXXX-1000-300.png',
+          'https://img.alicdn.com/tps/TB1xuUcNVXXXXcRXXXXXXXXXXXX-1000-300.jpg',
+          'https://img.alicdn.com/tps/TB1ikP.NVXXXXaYXpXXXXXXXXXX-1000-300.jpg',
+          'https://img.alicdn.com/tps/TB1s1_JNVXXXXbhaXXXXXXXXXXX-1000-300.jpg']
+      }
+    },
+  },
+];

package/lowcode/navigation/meta.ts

@@ -0,0 +1,117 @@
+
+import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types';
+
+const NavigationMeta: IPublicTypeComponentMetadata = {
+  "componentName": "Navigation",
+  "title": "Navigation",
+  "docUrl": "",
+  "screenshot": "",
+  "devMode": "proCode",
+  "npm": {
+    "package": "dc-material",
+    "version": "0.1.1",
+    "exportName": "Navigation",
+    "main": "src\\index.tsx",
+    "destructuring": true,
+    "subName": ""
+  },
+  "configure": {
+    "props": [
+      {
+        "title": {
+          "label": {
+            "type": "i18n",
+            "en-US": "itemArray",
+            "zh-CN": "itemArray"
+          }
+        },
+        "name": "itemArray",
+        "setter": {
+          "componentName": "ArraySetter",
+          "props": {
+            "itemSetter": {
+              "componentName": "ObjectSetter",
+              "props": {
+                "config": {
+                  "items": [
+                    {
+                      "title": {
+                        "label": {
+                          "type": "i18n",
+                          "en-US": "text",
+                          "zh-CN": "text"
+                        }
+                      },
+                      "name": "text",
+                      "setter": {
+                        "componentName": "StringSetter",
+                        "isRequired": true,
+                        "initialValue": ""
+                      }
+                    },
+                    {
+                      "title": {
+                        "label": {
+                          "type": "i18n",
+                          "en-US": "icon",
+                          "zh-CN": "icon"
+                        }
+                      },
+                      "name": "icon",
+                      "setter": {
+                        "componentName": "StringSetter",
+                        "isRequired": true,
+                        "initialValue": ""
+                      }
+                    },
+                    {
+                      "title": {
+                        "label": {
+                          "type": "i18n",
+                          "en-US": "selectedIcon",
+                          "zh-CN": "selectedIcon"
+                        }
+                      },
+                      "name": "selectedIcon",
+                      "setter": {
+                        "componentName": "StringSetter",
+                        "isRequired": true,
+                        "initialValue": ""
+                      }
+                    }
+                  ],
+                  "extraSetter": {
+                    "componentName": "MixedSetter",
+                    "isRequired": false,
+                    "props": {}
+                  }
+                }
+              }
+            }
+          },
+          "isRequired": true,
+          "initialValue": []
+        }
+      }
+    ],
+    "supports": {
+      "style": true
+    },
+    "component": {}
+  }
+};
+const snippets: IPublicTypeSnippet[] = [
+  {
+    "title": "Navigation",
+    "screenshot": "",
+    "schema": {
+      "componentName": "Navigation",
+      "props": {}
+    }
+  }
+];
+
+export default {
+  ...NavigationMeta,
+  snippets
+};

package/lowcode/teletext-list/meta.ts

@@ -2,7 +2,7 @@ import {IPublicTypeComponentMetadata, IPublicTypeSnippet} from '@alilc/lowcode-t
 
 const TeletextListMeta: IPublicTypeComponentMetadata = {
     "componentName": "TeletextList",
-    "title": "TeletextList",
+    "title": "图文列表",
     "docUrl": "",
     "screenshot": "",
     "devMode": "proCode",
@@ -277,7 +277,7 @@ const TeletextListMeta: IPublicTypeComponentMetadata = {
 };
 const snippets: IPublicTypeSnippet[] = [
     {
-        "title": "TeletextList",
+        "title": "图文列表",
         "screenshot": "",
         "schema": {
             "componentName": "TeletextList",

package/lowcode/{colorful-input → title1}/meta.ts

@@ -1,16 +1,16 @@
 
 import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types';
 
-const ColorfulInputMeta: IPublicTypeComponentMetadata = {
-  "componentName": "ColorfulInput",
-  "title": "ColorfulInput",
+const Title1Meta: IPublicTypeComponentMetadata = {
+  "componentName": "Title1",
+  "title": "个性化标题1",
   "docUrl": "",
   "screenshot": "",
   "devMode": "proCode",
   "npm": {
     "package": "@dckj-npm/dc-material",
     "version": "0.1.0",
-    "exportName": "ColorfulInput",
+    "exportName": "Title1",
     "main": "src/index.tsx",
     "destructuring": true,
     "subName": ""
@@ -21,15 +21,17 @@ const ColorfulInputMeta: IPublicTypeComponentMetadata = {
         "title": {
           "label": {
             "type": "i18n",
-            "en-US": "color",
-            "zh-CN": "color"
-          }
+            "en-US": "title",
+            "zh-CN": "标题"
+          },
+          "tip": "title | 标题"
         },
-        "name": "color",
+        "name": "title",
+        "description": "标题",
         "setter": {
           "componentName": "StringSetter",
           "isRequired": false,
-          "initialValue": ""
+          "initialValue": "标题名称"
         }
       }
     ],
@@ -41,16 +43,16 @@ const ColorfulInputMeta: IPublicTypeComponentMetadata = {
 };
 const snippets: IPublicTypeSnippet[] = [
   {
-    "title": "ColorfulInput",
+    "title": "个性化标题1",
     "screenshot": "",
     "schema": {
-      "componentName": "ColorfulInput",
+      "componentName": "Title1",
       "props": {}
     }
   }
 ];
 
 export default {
-  ...ColorfulInputMeta,
+  ...Title1Meta,
   snippets
 };