@trionesdev/antd-taro-react 0.0.2-beta.7 → 0.0.2-beta.8

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 (87) hide show
  1. package/dist/ActionSheet/ActionSheet.d.ts +25 -0
  2. package/dist/ActionSheet/ActionSheet.js +77 -0
  3. package/dist/ActionSheet/index.d.ts +1 -1
  4. package/dist/ActionSheet/index.js +1 -1
  5. package/dist/ActionSheet/style.scss +52 -0
  6. package/dist/Calendar/calendar-grid.js +0 -1
  7. package/dist/Calendar/calendar.js +5 -5
  8. package/dist/CalendarDatetimePicker/CalendarDatetimePicker.d.ts +4 -4
  9. package/dist/CalendarDatetimePicker/CalendarDatetimePicker.js +42 -159
  10. package/dist/CalendarDatetimePicker/style.scss +13 -51
  11. package/dist/CalendarDatetimePicker/types.d.ts +0 -4
  12. package/dist/CalendarDatetimePicker/types.js +1 -6
  13. package/dist/CalendarDatetimePopup/CalendarDatetimePopup.d.ts +10 -0
  14. package/dist/CalendarDatetimePopup/CalendarDatetimePopup.js +163 -0
  15. package/dist/CalendarDatetimePopup/index.d.ts +3 -0
  16. package/dist/CalendarDatetimePopup/index.js +2 -0
  17. package/dist/CalendarDatetimePopup/style.scss +62 -0
  18. package/dist/CalendarDatetimePopup/types.d.ts +5 -0
  19. package/dist/CalendarDatetimePopup/types.js +6 -0
  20. package/dist/CalendarPopup/CalendarPopup.d.ts +4 -0
  21. package/dist/{CalendarPicker/calendar-picker.js → CalendarPopup/CalendarPopup.js} +4 -3
  22. package/dist/CalendarPopup/CalendarRangePopup.d.ts +4 -0
  23. package/dist/{CalendarPicker/calendar-range-picker.js → CalendarPopup/CalendarRangePopup.js} +5 -4
  24. package/dist/CalendarPopup/index.d.ts +8 -0
  25. package/dist/CalendarPopup/index.js +5 -0
  26. package/dist/{CalendarPicker → CalendarPopup}/style.scss +4 -3
  27. package/dist/{CalendarPicker → CalendarPopup}/types.d.ts +3 -2
  28. package/dist/CalendarPopup/types.js +1 -0
  29. package/dist/CascaderPicker/CascaderPicker.d.ts +25 -0
  30. package/dist/CascaderPicker/CascaderPicker.js +78 -0
  31. package/dist/CascaderPicker/index.d.ts +1 -1
  32. package/dist/CascaderPicker/index.js +1 -1
  33. package/dist/CascaderPicker/style.scss +24 -0
  34. package/dist/CascaderPopup/cascader-popup.d.ts +27 -0
  35. package/dist/CascaderPopup/cascader-popup.js +90 -0
  36. package/dist/CascaderPopup/index.d.ts +3 -0
  37. package/dist/CascaderPopup/index.js +2 -0
  38. package/dist/CascaderPopup/style.scss +45 -0
  39. package/dist/DatePicker/DatePicker.d.ts +15 -0
  40. package/dist/DatePicker/DatePicker.js +85 -0
  41. package/dist/DatePicker/DatePickerPopup.d.ts +18 -0
  42. package/dist/DatePicker/DatePickerPopup.js +329 -0
  43. package/dist/DatePicker/index.d.ts +3 -0
  44. package/dist/DatePicker/index.js +3 -0
  45. package/dist/DatePicker/style.scss +64 -0
  46. package/dist/DatePicker/types.d.ts +1 -0
  47. package/dist/ImagesPreview/ImagesPreview.js +2 -2
  48. package/dist/Overlay/Overlay.d.ts +16 -0
  49. package/dist/Overlay/Overlay.js +95 -0
  50. package/dist/Overlay/index.d.ts +4 -0
  51. package/dist/Overlay/index.js +3 -0
  52. package/dist/Overlay/style.scss +20 -0
  53. package/dist/Picker/Picker.d.ts +19 -0
  54. package/dist/Picker/Picker.js +75 -0
  55. package/dist/Picker/index.d.ts +1 -1
  56. package/dist/Picker/index.js +1 -1
  57. package/dist/Picker/style.scss +41 -0
  58. package/dist/PickerView/PickerView.d.ts +4 -0
  59. package/dist/PickerView/PickerView.js +71 -0
  60. package/dist/PickerView/index.d.ts +2 -2
  61. package/dist/PickerView/index.js +1 -1
  62. package/dist/PickerView/style.scss +13 -0
  63. package/dist/PickerView/types.d.ts +15 -0
  64. package/dist/PickerView/types.js +1 -0
  65. package/dist/Popup/Popup.d.ts +26 -1
  66. package/dist/Popup/Popup.js +66 -18
  67. package/dist/Popup/index.d.ts +2 -2
  68. package/dist/Popup/index.js +1 -0
  69. package/dist/Popup/style.scss +114 -0
  70. package/dist/SideBar/side-bar.js +3 -2
  71. package/dist/Toast/Toast.d.ts +18 -0
  72. package/dist/Toast/Toast.js +112 -0
  73. package/dist/Toast/index.d.ts +1 -1
  74. package/dist/Toast/index.js +1 -1
  75. package/dist/Toast/style.scss +63 -0
  76. package/dist/index.d.ts +9 -4
  77. package/dist/index.js +5 -2
  78. package/package.json +7 -6
  79. package/dist/CalendarPicker/calendar-picker.d.ts +0 -4
  80. package/dist/CalendarPicker/calendar-range-picker.d.ts +0 -4
  81. package/dist/CalendarPicker/index.d.ts +0 -9
  82. package/dist/CalendarPicker/index.js +0 -5
  83. package/dist/Mask/index.d.ts +0 -3
  84. package/dist/Mask/index.js +0 -2
  85. /package/dist/{CalendarDatetimePicker → CalendarDatetimePopup}/DateTimeSwitch.d.ts +0 -0
  86. /package/dist/{CalendarDatetimePicker → CalendarDatetimePopup}/DateTimeSwitch.js +0 -0
  87. /package/dist/{CalendarPicker → DatePicker}/types.js +0 -0
@@ -0,0 +1,25 @@
1
+ import React, { FC } from "react";
2
+ import "./style.scss";
3
+ type ActionSheetActionItemType = {
4
+ key?: any;
5
+ children?: React.ReactNode;
6
+ onClick?: () => void;
7
+ };
8
+ export type ActionSheetProps = {
9
+ className?: string;
10
+ style?: React.CSSProperties;
11
+ open?: boolean;
12
+ afterOpenChange?: (open: boolean) => void;
13
+ title?: React.ReactNode;
14
+ actions?: ActionSheetActionItemType[];
15
+ cancel?: React.ReactNode | false;
16
+ onCancel?: () => void;
17
+ onClose?: () => void;
18
+ /**
19
+ * @description 点击操作项后是否关闭
20
+ * @default true
21
+ */
22
+ closeAfterClickAction?: boolean;
23
+ };
24
+ export declare const ActionSheet: FC<ActionSheetProps>;
25
+ export {};
@@ -0,0 +1,77 @@
1
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
+ import React from "react";
8
+ import Popup from "../Popup";
9
+ import classNames from "classnames";
10
+ import "./style.scss";
11
+ var cls = 'triones-antm-action-sheet';
12
+ export var ActionSheet = function ActionSheet(_ref) {
13
+ var className = _ref.className,
14
+ style = _ref.style,
15
+ open = _ref.open,
16
+ afterOpenChange = _ref.afterOpenChange,
17
+ title = _ref.title,
18
+ actions = _ref.actions,
19
+ cancel = _ref.cancel,
20
+ onCancel = _ref.onCancel,
21
+ onClose = _ref.onClose,
22
+ _ref$closeAfterClickA = _ref.closeAfterClickAction,
23
+ closeAfterClickAction = _ref$closeAfterClickA === void 0 ? true : _ref$closeAfterClickA;
24
+ var _React$useState = React.useState(open || false),
25
+ _React$useState2 = _slicedToArray(_React$useState, 2),
26
+ innerOpen = _React$useState2[0],
27
+ setInnerOpen = _React$useState2[1];
28
+ var handleClose = function handleClose() {
29
+ setInnerOpen(false);
30
+ onClose === null || onClose === void 0 || onClose();
31
+ };
32
+ React.useEffect(function () {
33
+ if (open === undefined) {
34
+ return;
35
+ }
36
+ if (open === innerOpen) {
37
+ return;
38
+ }
39
+ setInnerOpen(open);
40
+ }, [open]);
41
+ React.useEffect(function () {
42
+ afterOpenChange === null || afterOpenChange === void 0 || afterOpenChange(innerOpen);
43
+ }, [innerOpen]);
44
+ return /*#__PURE__*/React.createElement(Popup, {
45
+ open: open,
46
+ afterClose: function afterClose() {
47
+ setInnerOpen(false);
48
+ }
49
+ }, /*#__PURE__*/React.createElement("div", {
50
+ className: classNames(cls, className),
51
+ style: style
52
+ }, /*#__PURE__*/React.createElement("div", {
53
+ className: classNames("".concat(cls, "-body"))
54
+ }, title && /*#__PURE__*/React.createElement("div", {
55
+ className: classNames("".concat(cls, "-title"))
56
+ }, title), actions && /*#__PURE__*/React.createElement("div", {
57
+ className: classNames("".concat(cls, "-actions"))
58
+ }, actions.map(function (action) {
59
+ return /*#__PURE__*/React.createElement("div", {
60
+ className: "".concat(cls, "-actions-item"),
61
+ key: action.key,
62
+ onClick: function onClick() {
63
+ var _action$onClick;
64
+ (_action$onClick = action.onClick) === null || _action$onClick === void 0 || _action$onClick.call(action);
65
+ if (closeAfterClickAction) {
66
+ handleClose();
67
+ }
68
+ }
69
+ }, action.children);
70
+ }))), cancel !== false && /*#__PURE__*/React.createElement("div", {
71
+ className: classNames("".concat(cls, "-cancel")),
72
+ onClick: function onClick() {
73
+ onCancel === null || onCancel === void 0 || onCancel();
74
+ handleClose();
75
+ }
76
+ }, cancel || /*#__PURE__*/React.createElement("div", null, "\u53D6\u6D88"))));
77
+ };
@@ -1,3 +1,3 @@
1
- import { ActionSheet, ActionSheetProps } from "@trionesdev/antd-mobile-base-react";
1
+ import { ActionSheet, ActionSheetProps } from "./ActionSheet";
2
2
  export type { ActionSheetProps };
3
3
  export default ActionSheet;
@@ -1,2 +1,2 @@
1
- import { ActionSheet } from "@trionesdev/antd-mobile-base-react";
1
+ import { ActionSheet } from "./ActionSheet";
2
2
  export default ActionSheet;
@@ -0,0 +1,52 @@
1
+ @use "../style/variable" as variable;
2
+
3
+ $actionSheetCls: 'triones-antm-action-sheet';
4
+
5
+ .#{$actionSheetCls} {
6
+ display: flex;
7
+ flex-direction: column;
8
+ background-color: variable.$trionesColorFill;
9
+ border-top-left-radius: variable.$trionesBorderRadius;
10
+ border-top-right-radius: variable.$trionesBorderRadius;
11
+ overflow: hidden;
12
+ gap: 2Px;
13
+ &-body{
14
+
15
+ }
16
+ &-title{
17
+ display: flex;
18
+ justify-content: center;
19
+ align-items: center;
20
+ min-height: 48Px;
21
+ background-color: white;
22
+ font-size: 18Px;
23
+ border-bottom: 1Px solid variable.$trionesBorderColor;
24
+ }
25
+ &-actions{
26
+ &-item{
27
+ display: flex;
28
+ justify-content: center;
29
+ align-items: center;
30
+ min-height: 48Px;
31
+ background-color: white;
32
+ cursor: default;
33
+ position: relative;
34
+ font-size: 18Px;
35
+ &:hover{
36
+ opacity: 0.8;
37
+ }
38
+ }
39
+ }
40
+ &-cancel{
41
+ display: flex;
42
+ justify-content: center;
43
+ align-items: center;
44
+ min-height: 48Px;
45
+ font-size: 18Px;
46
+ background-color: white;
47
+ cursor: default;
48
+ &:hover{
49
+ opacity: 0.8;
50
+ }
51
+ }
52
+ }
@@ -44,7 +44,6 @@ var CalendarCell = /*#__PURE__*/memo(function (_ref) {
44
44
  if (range) {
45
45
  var startDate = value === null || value === void 0 ? void 0 : value[0];
46
46
  var endDate = value === null || value === void 0 ? void 0 : value[1];
47
- console.log('value', value);
48
47
  return date.getTime() === (startDate === null || startDate === void 0 ? void 0 : startDate.getTime()) || date.getTime() === (endDate === null || endDate === void 0 ? void 0 : endDate.getTime());
49
48
  } else {
50
49
  var _value$3;
@@ -10,16 +10,16 @@ import React, { forwardRef, memo, useState } from 'react';
10
10
  import { CalendarHeader } from "./calendar-header";
11
11
  import "./style.scss";
12
12
  import { TouchableCalendarGrid } from "./touchable-calendar-grid";
13
+ import { cloneDeep } from "lodash-es";
13
14
  var calendarCls = 'triones-antm-calendar';
14
15
  export var Calendar = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref, ref) {
15
- var _ref$mouth = _ref.mouth,
16
- mouth = _ref$mouth === void 0 ? new Date() : _ref$mouth,
16
+ var mouth = _ref.mouth,
17
17
  value = _ref.value,
18
18
  _onChange = _ref.onChange,
19
19
  _onMouthChange = _ref.onMouthChange,
20
20
  _ref$slideable = _ref.slideable,
21
21
  slideable = _ref$slideable === void 0 ? false : _ref$slideable;
22
- var _useState = useState(mouth),
22
+ var _useState = useState(mouth || new Date()),
23
23
  _useState2 = _slicedToArray(_useState, 2),
24
24
  currentMouth = _useState2[0],
25
25
  setCurrentMouth = _useState2[1];
@@ -31,7 +31,7 @@ export var Calendar = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref,
31
31
  onChange: setCurrentMouth
32
32
  }), slideable ? /*#__PURE__*/React.createElement(TouchableCalendarGrid, {
33
33
  mouth: currentMouth,
34
- value: value ? [value] : [],
34
+ value: value ? [cloneDeep(value)] : [],
35
35
  onMouthChange: function onMouthChange(newMouth) {
36
36
  setCurrentMouth(newMouth);
37
37
  _onMouthChange === null || _onMouthChange === void 0 || _onMouthChange(newMouth);
@@ -41,7 +41,7 @@ export var Calendar = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref,
41
41
  }
42
42
  }) : /*#__PURE__*/React.createElement(CalendarGrid, {
43
43
  mouth: currentMouth,
44
- value: value ? [value] : [],
44
+ value: value ? [cloneDeep(value)] : [],
45
45
  onChange: function onChange(value) {
46
46
  _onChange === null || _onChange === void 0 || _onChange(value === null || value === void 0 ? void 0 : value[0]);
47
47
  }
@@ -1,10 +1,10 @@
1
1
  import { FC } from 'react';
2
2
  import './style.scss';
3
3
  export type CalendarDatetimePickerProps = {
4
- open?: boolean;
5
- afterOpenChange?: (open: boolean) => void;
4
+ placeholder?: string;
6
5
  value?: Date;
7
- onOk?: (value?: Date) => void;
8
- onClose?: () => void;
6
+ format?: string;
7
+ onChange?: (value?: Date) => void;
8
+ align?: 'left' | 'right' | 'center';
9
9
  };
10
10
  export declare const CalendarDatetimePicker: FC<CalendarDatetimePickerProps>;
@@ -1,184 +1,67 @@
1
1
  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); }
2
- function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, catch: function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
3
- function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
4
- function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
2
+ 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; }
3
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
4
+ 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); }
5
5
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
6
6
  function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
7
7
  function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
8
8
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
9
9
  function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
10
10
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
11
- import { CustomWrapper, PickerView, PickerViewColumn, View } from '@tarojs/components';
12
- import Taro from '@tarojs/taro';
13
11
  import classNames from 'classnames';
14
- import React, { useEffect, useRef, useState } from 'react';
15
- import Calendar from "../Calendar";
16
- import ConfigProvider from "../ConfigProvider";
17
- import { useTaro } from "../hooks";
18
- import Popup from "../Popup";
19
- import { DateTimeSwitch } from "./DateTimeSwitch";
12
+ import React, { useEffect, useState } from 'react';
20
13
  import "./style.scss";
21
- import { cls, Mode } from "./types";
22
- import { DatetimeUtils } from "../utils/datetime-utils";
14
+ import { cls } from "./types";
15
+ import CalendarDatetimePopup from "../CalendarDatetimePopup";
16
+ import dayjs from "dayjs";
23
17
  export var CalendarDatetimePicker = function CalendarDatetimePicker(_ref) {
24
- var _bodyRef$current;
25
- var open = _ref.open,
26
- afterOpenChange = _ref.afterOpenChange,
27
- _ref$value = _ref.value,
28
- value = _ref$value === void 0 ? new Date() : _ref$value,
29
- onOk = _ref.onOk,
30
- _onClose = _ref.onClose;
31
- var _ConfigProvider$useCo = ConfigProvider.useConfig(),
32
- locale = _ConfigProvider$useCo.locale;
33
- var _useTaro = useTaro(),
34
- isTaroEnv = _useTaro.isTaroEnv,
35
- isTaroWeApp = _useTaro.isTaroWeApp;
36
- var _React$useState = React.useState(open || false),
18
+ var _ref$placeholder = _ref.placeholder,
19
+ placeholder = _ref$placeholder === void 0 ? '请选择' : _ref$placeholder,
20
+ value = _ref.value,
21
+ _ref$format = _ref.format,
22
+ format = _ref$format === void 0 ? 'YYYY-MM-DD HH:mm' : _ref$format,
23
+ onChange = _ref.onChange,
24
+ _ref$align = _ref.align,
25
+ align = _ref$align === void 0 ? 'left' : _ref$align;
26
+ var _React$useState = React.useState(false),
37
27
  _React$useState2 = _slicedToArray(_React$useState, 2),
38
28
  innerOpen = _React$useState2[0],
39
29
  setInnerOpen = _React$useState2[1];
40
- var _useState = useState(Mode.date),
30
+ var _useState = useState(value),
41
31
  _useState2 = _slicedToArray(_useState, 2),
42
- mode = _useState2[0],
43
- setMode = _useState2[1];
44
- var valueRef = useRef(value || new Date());
45
- var bodyRef = useRef(null);
46
- var datetimeSwitchRef = useRef();
47
- var _useState3 = useState(300),
48
- _useState4 = _slicedToArray(_useState3, 2),
49
- bodyHeight = _useState4[0],
50
- setBodyHeight = _useState4[1];
51
- var handleClose = function handleClose() {
52
- setInnerOpen(false);
53
- _onClose === null || _onClose === void 0 || _onClose();
54
- };
55
- var handleOk = function handleOk() {
56
- onOk === null || onOk === void 0 || onOk(valueRef.current);
57
- handleClose();
58
- };
59
- var handleComputeBodyHeight = /*#__PURE__*/function () {
60
- var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
61
- return _regeneratorRuntime().wrap(function _callee$(_context) {
62
- while (1) switch (_context.prev = _context.next) {
63
- case 0:
64
- if (!(isTaroEnv && isTaroWeApp)) {
65
- _context.next = 2;
66
- break;
67
- }
68
- return _context.abrupt("return", new Promise(function (resolve) {
69
- Taro.createSelectorQuery().in(bodyRef.current.ctx).select(".".concat(cls, "-body")).boundingClientRect()
70
- // .fields({ node: true, size: true })
71
- .exec(function (res) {
72
- var _res$;
73
- console.log(res);
74
- resolve(res === null || res === void 0 || (_res$ = res[0]) === null || _res$ === void 0 ? void 0 : _res$.height);
75
- });
76
- }));
77
- case 2:
78
- return _context.abrupt("return", Promise.resolve(bodyRef.current.offsetHeight));
79
- case 3:
80
- case "end":
81
- return _context.stop();
82
- }
83
- }, _callee);
84
- }));
85
- return function handleComputeBodyHeight() {
86
- return _ref2.apply(this, arguments);
87
- };
88
- }();
89
- useEffect(function () {
90
- afterOpenChange === null || afterOpenChange === void 0 || afterOpenChange(innerOpen);
91
- if (!innerOpen) {
92
- _onClose === null || _onClose === void 0 || _onClose();
32
+ internalValue = _useState2[0],
33
+ setInternalValue = _useState2[1];
34
+ var handleValueRender = function handleValueRender() {
35
+ if (internalValue) {
36
+ return dayjs(internalValue).format(format);
93
37
  }
94
- }, [innerOpen]);
38
+ return null;
39
+ };
95
40
  useEffect(function () {
96
- if (open === undefined) {
41
+ if (value === undefined) {
97
42
  return;
98
43
  }
99
- if (open === innerOpen) {
100
- return;
44
+ if (value !== internalValue) {
45
+ setInternalValue(value);
101
46
  }
102
- setInnerOpen(open);
103
- }, [open]);
104
- useEffect(function () {
105
- if (datetimeSwitchRef.current) {
106
- datetimeSwitchRef.current.setDatetime(valueRef.current);
107
- }
108
- }, []);
109
- var bodyRender = function bodyRender() {
110
- return /*#__PURE__*/React.createElement(React.Fragment, null, mode === Mode.date && /*#__PURE__*/React.createElement("div", {
111
- style: {}
112
- }, /*#__PURE__*/React.createElement(Calendar, {
113
- mouth: value,
114
- value: value,
115
- onChange: function onChange(date) {
116
- var _datetimeSwitchRef$cu;
117
- valueRef.current = new Date(date.getFullYear(), date.getMonth(), date.getDate(), valueRef.current.getHours(), valueRef.current.getMinutes());
118
- (_datetimeSwitchRef$cu = datetimeSwitchRef.current) === null || _datetimeSwitchRef$cu === void 0 || _datetimeSwitchRef$cu.setDatetime(valueRef.current);
119
- }
120
- })), mode === Mode.time && /*#__PURE__*/React.createElement("div", {
121
- style: {
122
- height: bodyHeight
123
- }
124
- }, /*#__PURE__*/React.createElement(PickerView, {
125
- className: "time-picker",
126
- indicatorStyle: "height: 32Px;",
127
- style: {
128
- height: bodyHeight
129
- },
130
- value: [valueRef === null || valueRef === void 0 ? void 0 : valueRef.current.getHours(), valueRef === null || valueRef === void 0 ? void 0 : valueRef.current.getMinutes()],
131
- onChange: function onChange(e) {
132
- var _datetimeSwitchRef$cu2;
133
- var v = e.detail.value;
134
- valueRef.current = new Date(valueRef.current.getFullYear(), valueRef.current.getMonth(), valueRef.current.getDate(), v[0], v[1]);
135
- (_datetimeSwitchRef$cu2 = datetimeSwitchRef.current) === null || _datetimeSwitchRef$cu2 === void 0 || _datetimeSwitchRef$cu2.setDatetime(valueRef.current);
136
- }
137
- }, /*#__PURE__*/React.createElement(PickerViewColumn, null, Array(24).fill(0).map(function (_, i) {
138
- return /*#__PURE__*/React.createElement(View, {
139
- key: "hour-".concat(i),
140
- className: "time-item"
141
- }, DatetimeUtils.twoDigits(i));
142
- })), /*#__PURE__*/React.createElement(PickerViewColumn, null, Array(60).fill(0).map(function (_, i) {
143
- return /*#__PURE__*/React.createElement(View, {
144
- key: "minute-".concat(i),
145
- className: "time-item"
146
- }, DatetimeUtils.twoDigits(i));
147
- })))));
148
- };
149
- return /*#__PURE__*/React.createElement(Popup, {
47
+ }, [value]);
48
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CalendarDatetimePopup, {
150
49
  open: innerOpen,
50
+ value: internalValue,
151
51
  onClose: function onClose() {
152
52
  setInnerOpen(false);
153
- _onClose === null || _onClose === void 0 || _onClose();
154
- }
155
- }, /*#__PURE__*/React.createElement("div", {
156
- className: classNames(cls)
157
- }, /*#__PURE__*/React.createElement("div", {
158
- className: "".concat(cls, "-header")
159
- }, /*#__PURE__*/React.createElement(DateTimeSwitch, {
160
- ref: datetimeSwitchRef,
161
- mode: mode,
162
- value: valueRef.current,
163
- onDateTabTap: function onDateTabTap() {
164
- return setMode(Mode.date);
165
53
  },
166
- onTimeTabTap: function onTimeTabTap() {
167
- handleComputeBodyHeight().then(function (height) {
168
- setBodyHeight(height);
169
- setMode(Mode.time);
170
- });
54
+ onOk: function onOk(date) {
55
+ setInternalValue(date);
56
+ setInnerOpen(false);
57
+ onChange === null || onChange === void 0 || onChange(date);
58
+ }
59
+ }), /*#__PURE__*/React.createElement("div", {
60
+ className: classNames(cls, _defineProperty({}, "".concat(cls, "-").concat(align), true)),
61
+ onClick: function onClick() {
62
+ setInnerOpen(true);
171
63
  }
172
- }), /*#__PURE__*/React.createElement("a", {
173
- className: classNames("".concat(cls, "-header-button"), "".concat(cls, "-header-button-ok")),
174
- onClick: handleOk
175
- }, locale.common.confirm)), isTaroEnv ? /*#__PURE__*/React.createElement(CustomWrapper, {
176
- ref: bodyRef
177
- }, /*#__PURE__*/React.createElement("div", {
178
- className: "".concat(cls, "-body")
179
- }, bodyRender())) : /*#__PURE__*/React.createElement("div", {
180
- className: "".concat(cls, "-body"),
181
- ref: bodyRef,
182
- id: (_bodyRef$current = bodyRef.current) === null || _bodyRef$current === void 0 ? void 0 : _bodyRef$current.uid
183
- }, bodyRender())));
64
+ }, !internalValue ? /*#__PURE__*/React.createElement("div", {
65
+ className: "".concat(cls, "-placeholder")
66
+ }, placeholder) : /*#__PURE__*/React.createElement("div", null, handleValueRender())));
184
67
  };
@@ -1,62 +1,24 @@
1
1
  @use "../style/variable" as variable;
2
-
3
2
  $calendarDatetimePickerCls: 'triones-antm-calendar-datetime-picker';
4
3
 
5
4
  .#{$calendarDatetimePickerCls} {
6
- border-top-left-radius: variable.$trionesBorderRadius;
7
- border-top-right-radius: variable.$trionesBorderRadius;
8
-
9
- &-header {
10
- display: flex;
11
- justify-content: space-between;
12
- border-bottom: 1Px solid variable.$trionesBorderColor;
13
-
14
-
15
- &-display {
16
- display: flex;
17
- padding-left: 8Px;
18
-
19
- &-date {
20
- padding-inline: 8Px;
21
- cursor: default;
22
- display: flex;
23
- align-items: center;
24
- }
5
+ width: 100%;
6
+ line-height: 1.4;
7
+ display: flex;
25
8
 
26
- &-time {
27
- padding-inline: 12Px;
28
- display: flex;
29
- align-items: center;
30
- cursor: default;
31
- }
32
-
33
- &-active {
34
- color: variable.$trionesColorText;
35
- font-weight: bold;
36
- background-color: variable.$trionesColorBgTextActive;
37
- }
38
- }
39
-
40
- &-button {
41
- padding: 12Px 16Px;
9
+ &-left {
10
+ justify-content: flex-start;
11
+ }
42
12
 
43
- &-cancel {}
13
+ &-center {
14
+ justify-content: center;
15
+ }
44
16
 
45
- &-ok {
46
- color: variable.$trionesColorPrimary;
47
- }
48
- }
17
+ &-right {
18
+ justify-content: flex-end;
49
19
  }
50
20
 
51
- &-body {
52
- .time-picker {
53
- .time-item {
54
- flex-shrink: 0;
55
- display: flex;
56
- align-items: center;
57
- justify-content: center;
58
- height: 32Px;
59
- }
60
- }
21
+ &-placeholder {
22
+ color: variable.$trionesColorTextPlaceholder;
61
23
  }
62
24
  }
@@ -1,5 +1 @@
1
1
  export declare const cls = "triones-antm-calendar-datetime-picker";
2
- export declare enum Mode {
3
- date = 0,
4
- time = 1
5
- }
@@ -1,6 +1 @@
1
- export var cls = 'triones-antm-calendar-datetime-picker';
2
- export var Mode = /*#__PURE__*/function (Mode) {
3
- Mode[Mode["date"] = 0] = "date";
4
- Mode[Mode["time"] = 1] = "time";
5
- return Mode;
6
- }({});
1
+ export var cls = 'triones-antm-calendar-datetime-picker';
@@ -0,0 +1,10 @@
1
+ import { FC } from 'react';
2
+ import './style.scss';
3
+ export type CalendarDatetimePopupProps = {
4
+ open?: boolean;
5
+ afterOpenChange?: (open: boolean) => void;
6
+ value?: Date;
7
+ onOk?: (value?: Date) => void;
8
+ onClose?: () => void;
9
+ };
10
+ export declare const CalendarDatetimePopup: FC<CalendarDatetimePopupProps>;