@trionesdev/antd-taro-react 0.0.1-beta.3

package/dist/SafeArea/demo/base.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/SafeArea/demo/base.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import { SafeArea } from "../safe-area";
+export default (function () {
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+    style: {
+      background: '#ace0ff'
+    }
+  }, /*#__PURE__*/React.createElement(SafeArea, {
+    position: "top"
+  })), /*#__PURE__*/React.createElement("div", {
+    style: {
+      background: '#ffcfac'
+    }
+  }, /*#__PURE__*/React.createElement(SafeArea, {
+    position: "bottom"
+  })));
+});

package/dist/SafeArea/demo/base.scss

@@ -0,0 +1,18 @@
+$class-prefix-card: 'card-demo';
+
+.#{$class-prefix-card} {
+  &-content {
+    height: 50px;
+  }
+  &-footer {
+    padding-top: 11px;
+    border-top: 1px solid #e5e5e5;
+    display: flex;
+    justify-content: flex-end;
+  }
+
+  &-customBody {
+    color: green;
+  }
+
+}

package/dist/SafeArea/index.d.ts

@@ -0,0 +1,4 @@
+import { SafeArea } from './safe-area';
+import './style.scss';
+export type { SafeAreaProps } from './safe-area';
+export default SafeArea;

package/dist/SafeArea/index.js

@@ -0,0 +1,3 @@
+import { SafeArea } from "./safe-area";
+import "./style.scss";
+export default SafeArea;

package/dist/SafeArea/safe-area.d.ts

@@ -0,0 +1,12 @@
+import type { FC } from 'react';
+import React from 'react';
+import { NativeProps } from '../utils/native-props';
+export type SafeAreaProps = {
+    children?: React.ReactNode;
+    /**
+     * @description 安全区位置
+     * @default top
+     */
+    position?: 'top' | 'bottom';
+} & NativeProps;
+export declare const SafeArea: FC<SafeAreaProps>;

package/dist/SafeArea/safe-area.js

@@ -0,0 +1,15 @@
+var _excluded = ["position"];
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React from 'react';
+import { withNativeProps } from "../utils/native-props";
+import classNames from 'classnames';
+var classPrefix = 'triones-antm-safe-area';
+export var SafeArea = function SafeArea(_ref) {
+  var _ref$position = _ref.position,
+    position = _ref$position === void 0 ? 'top' : _ref$position,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return withNativeProps(props, /*#__PURE__*/React.createElement("div", {
+    className: classNames(classPrefix, "".concat(classPrefix, "-position-").concat(position))
+  }, props.children));
+};

package/dist/SafeArea/style.scss

@@ -0,0 +1,17 @@
+@import "../style/variable";
+
+$class-prefix-safe-area: 'triones-antm-safe-area';
+
+.#{$class-prefix-safe-area} {
+  --multiple: var($trionesSafeAreaMultiple, 1);
+  display: block;
+  width: 100%;
+
+  &-position-top {
+    padding-top: calc(env(safe-area-inset-top) * var(--multiple));
+  }
+
+  &-position-bottom {
+    padding-bottom: calc(env(safe-area-inset-bottom) * var(--multiple));
+  }
+}

package/dist/Scaffold/demo/base.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/Scaffold/demo/base.js

@@ -0,0 +1,30 @@
+import { FaceRecognitionOutline } from '@trionesdev/antd-taro-icons-react';
+import React from 'react';
+import { DemoBlock } from "../../DemoBlock";
+import NavBar from "../../NavBar";
+import TabBar from "../../TabBar";
+import Scaffold from "../index";
+export default (function () {
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(DemoBlock, {
+    title: "\u57FA\u672C\u7528\u6CD5"
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: '60vh'
+    }
+  }, /*#__PURE__*/React.createElement(Scaffold, {
+    appBar: /*#__PURE__*/React.createElement(NavBar, null, "\u6807\u9898"),
+    bottomNavigationBar: /*#__PURE__*/React.createElement(TabBar, {
+      items: [{
+        key: 'home',
+        label: '首页',
+        icon: /*#__PURE__*/React.createElement(FaceRecognitionOutline, null)
+      }, {
+        key: 'save',
+        label: '收藏'
+      }, {
+        key: 'my',
+        label: '我的'
+      }]
+    })
+  }, /*#__PURE__*/React.createElement("div", null)))));
+});

package/dist/Scaffold/index.d.ts

@@ -0,0 +1,3 @@
+import { Scaffold, ScaffoldProps } from './scaffold';
+export type { ScaffoldProps };
+export default Scaffold;

package/dist/Scaffold/index.js

@@ -0,0 +1,2 @@
+import { Scaffold } from "./scaffold";
+export default Scaffold;

package/dist/Scaffold/scaffold.d.ts

@@ -0,0 +1,8 @@
+import React, { FC } from 'react';
+import './style.scss';
+export type ScaffoldProps = {
+    appBar?: React.ReactNode;
+    children?: React.ReactNode;
+    bottomNavigationBar?: React.ReactNode;
+};
+export declare const Scaffold: FC<ScaffoldProps>;

package/dist/Scaffold/scaffold.js

@@ -0,0 +1,19 @@
+import classNames from 'classnames';
+import React from 'react';
+import SafeArea from "../SafeArea";
+import "./style.scss";
+export var Scaffold = function Scaffold(_ref) {
+  var appBar = _ref.appBar,
+    children = _ref.children,
+    bottomNavigationBar = _ref.bottomNavigationBar;
+  var scaffoldCls = 'triones-antm-scaffold';
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(scaffoldCls)
+  }, appBar && /*#__PURE__*/React.createElement(SafeArea, {
+    position: 'top'
+  }, appBar), /*#__PURE__*/React.createElement("div", {
+    className: classNames("".concat(scaffoldCls, "-body"))
+  }, children), bottomNavigationBar && /*#__PURE__*/React.createElement(SafeArea, {
+    position: 'bottom'
+  }, bottomNavigationBar));
+};

package/dist/Scaffold/style.scss

@@ -0,0 +1,16 @@
+@import "../style/variable";
+
+
+$trionesScaffoldCls: 'triones-antm-scaffold';
+
+.#{$trionesScaffoldCls} {
+  height: 100%;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+
+  &-body {
+    flex: 1 auto;
+    overflow: hidden;
+  }
+}

package/dist/ScrollView/demo/base.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/ScrollView/demo/base.js

@@ -0,0 +1,43 @@
+import React from 'react';
+import { DemoBlock } from "../../DemoBlock";
+import ScrollView from "../index";
+export default (function () {
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(DemoBlock, {
+    title: "\u4E00\u822C\u4F7F\u7528"
+  }, /*#__PURE__*/React.createElement(ScrollView, {
+    style: {
+      height: 300
+    },
+    scrollY: true
+  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: 100,
+      backgroundColor: 'blue'
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: 100,
+      backgroundColor: 'yellow'
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: 100,
+      backgroundColor: 'gray'
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: 100,
+      backgroundColor: 'green'
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: 100,
+      backgroundColor: 'beige'
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: 100,
+      backgroundColor: 'black'
+    }
+  }))))));
+});

package/dist/ScrollView/index.d.ts

@@ -0,0 +1,3 @@
+import { ScrollView, ScrollViewProps } from "./scroll-view";
+export type { ScrollViewProps };
+export default ScrollView;

package/dist/ScrollView/index.js

@@ -0,0 +1,2 @@
+import { ScrollView } from "./scroll-view";
+export default ScrollView;

package/dist/ScrollView/scroll-view.d.ts

@@ -0,0 +1,24 @@
+import React, { FC, ReactNode } from 'react';
+import './style.scss';
+export type ScrollEvent = {
+    target?: any;
+    detail: {
+        deltaX?: number;
+        deltaY?: number;
+        scrollLeft?: number;
+        scrollTop?: number;
+        scrollHeight?: number;
+        scrollWidth?: number;
+    };
+};
+export type ScrollViewProps = {
+    className?: string;
+    style?: React.CSSProperties;
+    children?: ReactNode;
+    onScroll?: (e: ScrollEvent) => void;
+    showScrollbar?: boolean;
+    scrollX?: boolean;
+    scrollY?: boolean;
+    scrollTop?: number;
+};
+export declare const ScrollView: FC<ScrollViewProps>;

package/dist/ScrollView/scroll-view.js

@@ -0,0 +1,84 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { ScrollView as TaroScrollView } from '@tarojs/components';
+import classNames from 'classnames';
+import React, { forwardRef, useEffect, useRef } from 'react';
+import { checkTaroEnv } from "../utils/taro-utils";
+import "./style.scss";
+export var ScrollView = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    style = _ref.style,
+    children = _ref.children,
+    _onScroll = _ref.onScroll,
+    _ref$showScrollbar = _ref.showScrollbar,
+    showScrollbar = _ref$showScrollbar === void 0 ? true : _ref$showScrollbar,
+    scrollX = _ref.scrollX,
+    scrollY = _ref.scrollY,
+    scrollTop = _ref.scrollTop;
+  var isTaroEnv = checkTaroEnv();
+  var scrollRef = useRef();
+  var handleRef = function handleRef(node) {
+    scrollRef.current = node;
+    if (ref) {
+      if (typeof ref === 'function') {
+        ref(node);
+      } else {
+        ref.current = node;
+      }
+    }
+  };
+  useEffect(function () {
+    console.log('scrollTop', scrollTop);
+    if (scrollTop !== undefined) {
+      if (!isTaroEnv) {
+        scrollRef.current.scrollTo({
+          top: scrollTop,
+          behavior: 'smooth'
+        });
+      }
+    }
+  }, [scrollTop]);
+  var trionesScrollViewCls = 'triones-antm-scroll-view';
+  if (isTaroEnv) {
+    return /*#__PURE__*/React.createElement(TaroScrollView, {
+      ref: handleRef,
+      className: classNames(className),
+      style: style,
+      onScroll: function onScroll(e) {
+        _onScroll === null || _onScroll === void 0 || _onScroll({
+          detail: {
+            deltaX: e.detail.deltaX,
+            deltaY: e.detail.deltaY,
+            scrollLeft: e.detail.scrollLeft,
+            scrollTop: e.detail.scrollTop,
+            scrollHeight: e.detail.scrollHeight,
+            scrollWidth: e.detail.scrollWidth
+          }
+        });
+      },
+      showScrollbar: showScrollbar,
+      scrollX: scrollX,
+      scrollY: scrollY,
+      scrollTop: scrollTop
+    }, children);
+  } else {
+    return /*#__PURE__*/React.createElement("div", {
+      ref: handleRef,
+      className: classNames("".concat(trionesScrollViewCls), className, _defineProperty(_defineProperty(_defineProperty({}, "".concat(trionesScrollViewCls, "-scroll-x"), scrollX), "".concat(trionesScrollViewCls, "-scroll-y"), scrollY), "".concat(trionesScrollViewCls, "-scroll-bar-hidden"), !showScrollbar)),
+      style: style,
+      onScroll: function onScroll(e) {
+        // console.log(e);
+        _onScroll === null || _onScroll === void 0 || _onScroll({
+          detail: {
+            scrollLeft: e.target.scrollLeft,
+            scrollTop: e.target.scrollTop,
+            scrollHeight: e.target.scrollHeight,
+            scrollWidth: e.target.scrollWidth
+          }
+        });
+      }
+    }, children);
+  }
+});

package/dist/ScrollView/style.scss

@@ -0,0 +1,19 @@
+$trionesScrollViewCls: 'triones-antm-scroll-view';
+
+.#{$trionesScrollViewCls} {
+  scrollbar-width: thin;
+
+  &-scroll-x {
+    overflow-x: auto;
+    overflow-y: hidden;
+  }
+
+  &-scroll-y {
+    overflow-x: hidden;
+    overflow-y: auto;
+  }
+
+  &-scroll-bar-hidden {
+    scrollbar-width: none;
+  }
+}

package/dist/SideBar/SideBarContext.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="react" />
+import { ScrollDetail } from './types';
+type SideBarContextType = {
+    activeKey?: string;
+    setActiveKey?: (key: string) => void;
+    mode?: 'switch' | 'scroll';
+    scrollDetail?: ScrollDetail;
+    setScrollDetail?: (detail: ScrollDetail) => void;
+    activeChangeCallback?: (targetScrollTop: number) => void;
+    onMoveToTab?: (activeKey: string) => void;
+    asyncRender?: boolean;
+    contentEl?: any;
+    contentWheelEl?: any;
+    manual?: boolean;
+    setManul?: (manual: boolean) => void;
+};
+export declare const SideBarContext: import("react").Context<SideBarContextType>;
+export {};

package/dist/SideBar/SideBarContext.js

@@ -0,0 +1,2 @@
+import { createContext } from 'react';
+export var SideBarContext = /*#__PURE__*/createContext({});

package/dist/SideBar/demo/base.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/SideBar/demo/base.js

@@ -0,0 +1,54 @@
+import React from 'react';
+import { DemoBlock } from "../../DemoBlock";
+import { SideBar } from "../side-bar";
+export default (function () {
+  return /*#__PURE__*/React.createElement(DemoBlock, {
+    title: "\u57FA\u672C\u4F7F\u7528"
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: 300
+    }
+  }, /*#__PURE__*/React.createElement(SideBar, {
+    items: [{
+      key: '1',
+      title: 'Tab 1',
+      content: /*#__PURE__*/React.createElement("div", {
+        style: {
+          height: 200
+        }
+      }, "Tab 1 Content")
+    }, {
+      key: '2',
+      title: 'Tab 2',
+      content: /*#__PURE__*/React.createElement("div", {
+        style: {
+          height: 200
+        }
+      }, "Tab 2 Content")
+    }, {
+      key: '3',
+      title: 'Tab 3',
+      content: /*#__PURE__*/React.createElement("div", {
+        style: {
+          height: 200
+        }
+      }, "Tab 3 Content")
+    }, {
+      key: '4',
+      title: 'Tab 4',
+      content: /*#__PURE__*/React.createElement("div", {
+        style: {
+          height: 200
+        }
+      }, "Tab 4 Content")
+    }, {
+      key: '5',
+      title: 'Tab 5',
+      content: /*#__PURE__*/React.createElement("div", {
+        style: {
+          height: 200
+        }
+      }, "Tab 5 Content")
+    }]
+  })));
+});

package/dist/SideBar/demo/default-active.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/SideBar/demo/default-active.js

@@ -0,0 +1,34 @@
+import { DemoBlock } from "../../DemoBlock";
+import { SideBar } from "../side-bar";
+import React from 'react';
+export default (function () {
+  return /*#__PURE__*/React.createElement(DemoBlock, {
+    title: "\u9ED8\u8BA4\u503C"
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: 300
+    }
+  }, /*#__PURE__*/React.createElement(SideBar, {
+    items: [{
+      key: '1',
+      title: 'Tab 1',
+      content: 'Tab 1 Content'
+    }, {
+      key: '2',
+      title: 'Tab 2',
+      content: 'Tab 2 Content'
+    }, {
+      key: '3',
+      title: 'Tab 3',
+      content: 'Tab 3 Content'
+    }, {
+      key: '4',
+      title: 'Tab 4',
+      content: 'Tab 4 Content'
+    }, {
+      key: '5',
+      title: 'Tab 5',
+      content: 'Tab 5 Content'
+    }]
+  })));
+});

package/dist/SideBar/demo/scroll-mode.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/SideBar/demo/scroll-mode.js

@@ -0,0 +1,55 @@
+import React from 'react';
+import { DemoBlock } from "../../DemoBlock";
+import { SideBar } from "../side-bar";
+export default (function () {
+  return /*#__PURE__*/React.createElement(DemoBlock, {
+    title: "\u57FA\u672C\u4F7F\u7528"
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: 300
+    }
+  }, /*#__PURE__*/React.createElement(SideBar, {
+    mode: 'scroll',
+    items: [{
+      key: '1',
+      title: 'Tab 1',
+      content: /*#__PURE__*/React.createElement("div", {
+        style: {
+          height: 400
+        }
+      }, "Tab 1 Content")
+    }, {
+      key: '2',
+      title: 'Tab 2',
+      content: /*#__PURE__*/React.createElement("div", {
+        style: {
+          height: 500
+        }
+      }, "Tab 2 Content")
+    }, {
+      key: '3',
+      title: 'Tab 3',
+      content: /*#__PURE__*/React.createElement("div", {
+        style: {
+          height: 300
+        }
+      }, "Tab 3 Content")
+    }, {
+      key: '4',
+      title: 'Tab 4',
+      content: /*#__PURE__*/React.createElement("div", {
+        style: {
+          height: 600
+        }
+      }, "Tab 4 Content")
+    }, {
+      key: '5',
+      title: 'Tab 5',
+      content: /*#__PURE__*/React.createElement("div", {
+        style: {
+          height: 700
+        }
+      }, "Tab 5 Content")
+    }]
+  })));
+});

package/dist/SideBar/index.d.ts

@@ -0,0 +1,3 @@
+import { SideBar, SideBarProps } from "./side-bar";
+export type { SideBarProps };
+export default SideBar;

package/dist/SideBar/index.js

@@ -0,0 +1,2 @@
+import { SideBar } from "./side-bar";
+export default SideBar;

package/dist/SideBar/side-bar.d.ts

@@ -0,0 +1,25 @@
+import React, { FC } from 'react';
+import './style.scss';
+type sideBarMode = 'switch' | 'scroll';
+export type SideBarItemProps = {
+    key: string;
+    title?: string;
+    content?: React.ReactNode;
+};
+export type SideBarProps = {
+    activeKey?: string;
+    defaultActiveKey?: string;
+    items?: SideBarItemProps[];
+    /**
+     * 交互模式 `switch` 页面切换，`scroll` 滚动展示
+     */
+    mode?: sideBarMode;
+    /**
+     * @description 是否异步渲染内容
+     * @default false
+     */
+    asyncRender?: boolean;
+    tabWidth?: number;
+};
+export declare const SideBar: FC<SideBarProps>;
+export {};