@trionesdev/antd-mobile-react 0.0.2-beta.0 → 0.0.2-beta.10
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.
- package/LICENSE +21 -21
- package/dist/ActionSheet/ActionSheet.d.ts +25 -0
- package/dist/ActionSheet/ActionSheet.js +77 -0
- package/dist/ActionSheet/index.d.ts +1 -1
- package/dist/ActionSheet/index.js +1 -1
- package/dist/ActionSheet/style.scss +52 -0
- package/dist/Avatar/demo/base.js +2 -2
- package/dist/Avatar/demo/style.scss +6 -6
- package/dist/Badge/demo/base.js +2 -2
- package/dist/Badge/demo/base.scss +6 -6
- package/dist/Button/demo/base.js +2 -2
- package/dist/Button/style.scss +234 -231
- package/dist/Calendar/calendar-grid.js +2 -2
- package/dist/Calendar/calendar-range.js +2 -2
- package/dist/Calendar/calendar.js +2 -1
- package/dist/Calendar/style.scss +85 -85
- package/dist/Calendar/touchable-calendar-grid.js +9 -9
- package/dist/CalendarDatetimePicker/CalendarDatetimePicker.d.ts +5 -6
- package/dist/CalendarDatetimePicker/CalendarDatetimePicker.js +37 -132
- package/dist/CalendarDatetimePicker/demo/base.js +5 -21
- package/dist/CalendarDatetimePicker/index.d.ts +2 -2
- package/dist/CalendarDatetimePicker/style.scss +10 -54
- package/dist/CalendarDatetimePicker/types.d.ts +0 -4
- package/dist/CalendarDatetimePicker/types.js +1 -6
- package/dist/CalendarDatetimePopup/CalendarDatetimePopup.d.ts +10 -0
- package/dist/CalendarDatetimePopup/CalendarDatetimePopup.js +136 -0
- package/dist/CalendarDatetimePopup/demo/base.js +41 -0
- package/dist/CalendarDatetimePopup/index.d.ts +3 -0
- package/dist/CalendarDatetimePopup/index.js +2 -0
- package/dist/CalendarDatetimePopup/style.scss +54 -0
- package/dist/CalendarDatetimePopup/types.d.ts +5 -0
- package/dist/CalendarDatetimePopup/types.js +6 -0
- package/dist/CalendarPopup/calendar-popup.d.ts +4 -0
- package/dist/{CalendarPicker/calendar-picker.js → CalendarPopup/calendar-popup.js} +2 -2
- package/dist/CalendarPopup/calendar-range-popup.d.ts +4 -0
- package/dist/{CalendarPicker/calendar-range-picker.js → CalendarPopup/calendar-range-popup.js} +8 -7
- package/dist/{CalendarPicker → CalendarPopup}/demo/base.js +3 -3
- package/dist/CalendarPopup/index.d.ts +9 -0
- package/dist/CalendarPopup/index.js +5 -0
- package/dist/CalendarPopup/style.scss +31 -0
- package/dist/{CalendarPicker → CalendarPopup}/types.d.ts +2 -2
- package/dist/Card/demo/base.js +2 -2
- package/dist/Card/demo/base.scss +18 -18
- package/dist/CascaderPicker/CascaderPicker.d.ts +25 -0
- package/dist/CascaderPicker/CascaderPicker.js +78 -0
- package/dist/CascaderPicker/demo/base.js +6 -18
- package/dist/CascaderPicker/index.d.ts +1 -1
- package/dist/CascaderPicker/index.js +1 -1
- package/dist/CascaderPicker/style.scss +24 -0
- package/dist/CascaderPopup/cascader-popup.d.ts +27 -0
- package/dist/CascaderPopup/cascader-popup.js +90 -0
- package/dist/CascaderPopup/demo/base.d.ts +3 -0
- package/dist/CascaderPopup/demo/base.js +82 -0
- package/dist/CascaderPopup/index.d.ts +3 -0
- package/dist/CascaderPopup/index.js +2 -0
- package/dist/CascaderPopup/style.scss +45 -0
- package/dist/Cell/demo/base.js +41 -2
- package/dist/Checkbox/demo/base.js +11 -6
- package/dist/Checkbox/demo/disabled.js +2 -1
- package/dist/ConfigProvider/demo/base.js +2 -2
- package/dist/DemoBlock/index.d.ts +6 -0
- package/dist/DemoBlock/index.js +9 -2
- package/dist/DemoBlock/index.scss +20 -20
- package/dist/DemoDescription/index.scss +3 -3
- package/dist/Divider/demo/base.js +2 -2
- package/dist/Ellipsis/demo/base.js +2 -2
- package/dist/Empty/demo/base.js +2 -2
- package/dist/ErrorBlock/demo/base.js +2 -2
- package/dist/Footer/demo/base.js +2 -2
- package/dist/Form/FormItem/form-item-input.d.ts +15 -0
- package/dist/Form/FormItem/form-item-input.js +39 -0
- package/dist/Form/FormItem/form-item-label.d.ts +13 -0
- package/dist/Form/FormItem/form-item-label.js +27 -0
- package/dist/Form/FormItem/form-item.d.ts +22 -0
- package/dist/Form/FormItem/form-item.js +73 -0
- package/dist/Form/FormItem/index.d.ts +5 -0
- package/dist/Form/FormItem/index.js +3 -0
- package/dist/Form/demo/input.js +1 -1
- package/dist/Form/index.d.ts +8 -1
- package/dist/Form/index.js +5 -1
- package/dist/Form/style.scss +67 -0
- package/dist/Grid/demo/base.js +2 -2
- package/dist/Grid/demo/base.scss +7 -7
- package/dist/Icon/demo/base.js +4 -4
- package/dist/Image/demo/base.js +2 -2
- package/dist/Image/demo/base.scss +4 -4
- package/dist/Image/style.scss +30 -30
- package/dist/ImagesPreview/ImagesPreview.js +2 -2
- package/dist/ImagesPreview/style.scss +34 -34
- package/dist/ImagesWall/CameraModal.js +2 -2
- package/dist/ImagesWall/ImagesWall.js +1 -1
- package/dist/ImagesWall/style.scss +70 -70
- package/dist/Input/base-input.d.ts +13 -0
- package/dist/Input/base-input.js +41 -0
- package/dist/Input/demo/base.js +89 -13
- package/dist/Input/index.d.ts +14 -2
- package/dist/Input/index.js +11 -1
- package/dist/Input/index.scss +223 -0
- package/dist/Input/input-affix-wrapper.d.ts +11 -0
- package/dist/Input/input-affix-wrapper.js +37 -0
- package/dist/Input/input-opt.d.ts +16 -0
- package/dist/Input/input-opt.js +87 -0
- package/dist/Input/input-password.d.ts +7 -0
- package/dist/Input/input-password.js +48 -0
- package/dist/Input/input.d.ts +18 -0
- package/dist/Input/input.js +63 -0
- package/dist/Input/textarea.d.ts +15 -0
- package/dist/Input/textarea.js +51 -0
- package/dist/Input/types.d.ts +3 -0
- package/dist/Input/types.js +2 -0
- package/dist/NavBar/demo/base.scss +5 -5
- package/dist/NoticeBar/demo/base.js +2 -2
- package/dist/Overlay/Overlay.d.ts +16 -0
- package/dist/Overlay/Overlay.js +117 -0
- package/dist/Overlay/demo/base.d.ts +3 -0
- package/dist/{Mask → Overlay}/demo/base.js +14 -16
- package/dist/Overlay/index.d.ts +4 -0
- package/dist/Overlay/index.js +3 -0
- package/dist/Overlay/style.scss +20 -0
- package/dist/PageIndicator/demo/base.js +2 -2
- package/dist/Picker/index.d.ts +1 -1
- package/dist/Picker/index.js +1 -1
- package/dist/Picker/picker.d.ts +19 -0
- package/dist/Picker/picker.js +97 -0
- package/dist/Picker/style.scss +44 -0
- package/dist/PickerView/index.d.ts +2 -1
- package/dist/PickerView/index.js +1 -1
- package/dist/PickerView/picker-view-column-item.d.ts +7 -0
- package/dist/PickerView/picker-view-column-item.js +11 -0
- package/dist/PickerView/picker-view-column.d.ts +10 -0
- package/dist/PickerView/picker-view-column.js +117 -0
- package/dist/PickerView/picker-view.d.ts +12 -0
- package/dist/PickerView/picker-view.js +60 -0
- package/dist/PickerView/style.scss +72 -0
- package/dist/PickerView/types.d.ts +4 -0
- package/dist/PickerView/types.js +1 -0
- package/dist/Popup/demo/base.js +109 -27
- package/dist/Popup/index.d.ts +2 -1
- package/dist/Popup/index.js +2 -1
- package/dist/Popup/popup.d.ts +31 -0
- package/dist/Popup/popup.js +87 -0
- package/dist/Popup/style.scss +129 -0
- package/dist/Progress/index.d.ts +1 -1
- package/dist/Progress/index.js +1 -1
- package/dist/Radio/demo/base.js +2 -2
- package/dist/Radio/demo/base.scss +4 -4
- package/dist/Result/demo/base.js +2 -2
- package/dist/SafeArea/demo/base.scss +18 -18
- package/dist/ScrollView/index.d.ts +2 -1
- package/dist/ScrollView/index.js +1 -1
- package/dist/ScrollView/scroll-view.d.ts +4 -0
- package/dist/ScrollView/scroll-view.js +55 -0
- package/dist/ScrollView/style.scss +19 -0
- package/dist/ScrollView/types.d.ts +26 -0
- package/dist/ScrollView/types.js +1 -0
- package/dist/SideBar/index.d.ts +1 -1
- package/dist/SideBar/side-bar.js +6 -6
- package/dist/SideBar/style.scss +85 -85
- package/dist/Space/demo/base.js +2 -2
- package/dist/Swiper/style.scss +54 -54
- package/dist/Switch/demo/base.js +2 -2
- package/dist/TabBar/demo/base.js +2 -2
- package/dist/Tag/demo/base.js +2 -2
- package/dist/Tag/demo/style.scss +8 -8
- package/dist/Toast/style.scss +63 -63
- package/dist/Toast/toast-modal.js +4 -4
- package/dist/VerificationCodeInput/demo/base.js +2 -2
- package/dist/VerificationCodeInput/index.d.ts +2 -2
- package/dist/VerificationCodeInput/index.js +1 -1
- package/dist/VerificationCodeInput/style.scss +20 -0
- package/dist/VerificationCodeInput/verification-code-input.d.ts +24 -0
- package/dist/VerificationCodeInput/verification-code-input.js +99 -0
- package/dist/WaterMark/demo/demo1.js +2 -2
- package/dist/WaterMark/demo/demo1.scss +6 -6
- package/dist/WaterMark/demo/demo2.js +2 -2
- package/dist/index.d.ts +9 -7
- package/dist/index.js +4 -3
- package/dist/style/variable.scss +1 -0
- package/dist/types.d.ts +0 -8
- package/dist/types.js +0 -1
- package/dist/utils/type.js +36 -36
- package/dist/utils/use-isomorphic-update-layout-effect.d.ts +1 -1
- package/dist/utils/with-default-props.js +4 -4
- package/package.json +13 -14
- package/readme.md +43 -43
- package/dist/CalendarPicker/calendar-picker.d.ts +0 -4
- package/dist/CalendarPicker/calendar-range-picker.d.ts +0 -4
- package/dist/CalendarPicker/index.d.ts +0 -9
- package/dist/CalendarPicker/index.js +0 -5
- package/dist/CalendarPicker/style.scss +0 -31
- package/dist/Mask/index.d.ts +0 -3
- package/dist/Mask/index.js +0 -2
- package/dist/Progress/Progress.d.ts +0 -37
- package/dist/Progress/Progress.js +0 -52
- package/dist/Progress/ProgressCircle.d.ts +0 -17
- package/dist/Progress/ProgressCircle.js +0 -148
- package/dist/Progress/ProgressLine.d.ts +0 -15
- package/dist/Progress/ProgressLine.js +0 -87
- package/dist/Progress/style.scss +0 -33
- package/dist/Progress/types.d.ts +0 -4
- package/dist/Progress/types.js +0 -2
- /package/dist/{CalendarDatetimePicker → CalendarDatetimePopup}/DateTimeSwitch.d.ts +0 -0
- /package/dist/{CalendarDatetimePicker → CalendarDatetimePopup}/DateTimeSwitch.js +0 -0
- /package/dist/{CalendarPicker → CalendarDatetimePopup}/demo/base.d.ts +0 -0
- /package/dist/{Mask → CalendarPopup}/demo/base.d.ts +0 -0
- /package/dist/{CalendarPicker → CalendarPopup}/types.js +0 -0
|
@@ -0,0 +1,73 @@
|
|
|
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
|
+
var _excluded = ["className", "style", "children", "layout", "label", "labelAlign", "labelWidth", "name", "required", "hidden", "noStyle", "rules", "initialValue", "valuePropName", "errorRender", "extra"];
|
|
3
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
4
|
+
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; }
|
|
5
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
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); }
|
|
7
|
+
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; }
|
|
8
|
+
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; }
|
|
9
|
+
import React from "react";
|
|
10
|
+
import { FormItemLabel } from "./form-item-label";
|
|
11
|
+
import { FormItemInput } from "./form-item-input";
|
|
12
|
+
import classNames from "classnames";
|
|
13
|
+
import { Field } from "rc-field-form";
|
|
14
|
+
import { useFormContext } from "@trionesdev/antd-mobile-base-react";
|
|
15
|
+
export var FormItem = function FormItem(_ref) {
|
|
16
|
+
var className = _ref.className,
|
|
17
|
+
style = _ref.style,
|
|
18
|
+
children = _ref.children,
|
|
19
|
+
layout = _ref.layout,
|
|
20
|
+
label = _ref.label,
|
|
21
|
+
labelAlign = _ref.labelAlign,
|
|
22
|
+
labelWidth = _ref.labelWidth,
|
|
23
|
+
name = _ref.name,
|
|
24
|
+
required = _ref.required,
|
|
25
|
+
_ref$hidden = _ref.hidden,
|
|
26
|
+
hidden = _ref$hidden === void 0 ? false : _ref$hidden,
|
|
27
|
+
_ref$noStyle = _ref.noStyle,
|
|
28
|
+
noStyle = _ref$noStyle === void 0 ? false : _ref$noStyle,
|
|
29
|
+
rules = _ref.rules,
|
|
30
|
+
initialValue = _ref.initialValue,
|
|
31
|
+
valuePropName = _ref.valuePropName,
|
|
32
|
+
errorRender = _ref.errorRender,
|
|
33
|
+
extra = _ref.extra,
|
|
34
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
35
|
+
var _useFormContext = useFormContext(),
|
|
36
|
+
formLayout = _useFormContext.layout,
|
|
37
|
+
formLayoutAlign = _useFormContext.labelAlign,
|
|
38
|
+
formLabelWidth = _useFormContext.labelWidth,
|
|
39
|
+
hiddenError = _useFormContext.hiddenError,
|
|
40
|
+
formExtra = _useFormContext.extra;
|
|
41
|
+
var formItemLayout = layout ? layout : formLayout === 'inline' ? 'horizontal' : formLayout;
|
|
42
|
+
var formItemAlign = labelAlign ? labelAlign : formLayoutAlign || 'left';
|
|
43
|
+
var formItemLabelWidth = labelWidth ? labelWidth : formLabelWidth;
|
|
44
|
+
var itemExtra = extra !== undefined ? extra : formExtra;
|
|
45
|
+
var clsPrefix = "triones-antm-form-item";
|
|
46
|
+
if (noStyle) {
|
|
47
|
+
return /*#__PURE__*/React.createElement(Field, {
|
|
48
|
+
name: name,
|
|
49
|
+
rules: rules,
|
|
50
|
+
trigger: 'onChange',
|
|
51
|
+
initialValue: initialValue
|
|
52
|
+
}, children);
|
|
53
|
+
}
|
|
54
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
55
|
+
className: classNames(clsPrefix, "".concat(clsPrefix, "-").concat(formItemLayout), className, _defineProperty({}, "".concat(clsPrefix, "-hidden"), hidden)),
|
|
56
|
+
style: style
|
|
57
|
+
}, label && /*#__PURE__*/React.createElement(FormItemLabel, {
|
|
58
|
+
className: classNames("".concat(clsPrefix, "-label"), "".concat(clsPrefix, "-label-").concat(formItemAlign)),
|
|
59
|
+
style: {
|
|
60
|
+
width: formItemLabelWidth
|
|
61
|
+
},
|
|
62
|
+
label: label,
|
|
63
|
+
required: required
|
|
64
|
+
}), /*#__PURE__*/React.createElement(FormItemInput, _extends({
|
|
65
|
+
className: "".concat(clsPrefix, "-input")
|
|
66
|
+
}, props, {
|
|
67
|
+
name: name,
|
|
68
|
+
rules: rules,
|
|
69
|
+
errorRender: errorRender,
|
|
70
|
+
initialValue: initialValue,
|
|
71
|
+
hiddenError: hiddenError
|
|
72
|
+
}), children), formExtra);
|
|
73
|
+
};
|
package/dist/Form/demo/input.js
CHANGED
|
@@ -25,7 +25,7 @@ export default (function () {
|
|
|
25
25
|
})), /*#__PURE__*/React.createElement(Form.Item, {
|
|
26
26
|
label: "\u8BF4\u660E",
|
|
27
27
|
name: "description"
|
|
28
|
-
}, /*#__PURE__*/React.createElement(Input.
|
|
28
|
+
}, /*#__PURE__*/React.createElement(Input.Textarea, {
|
|
29
29
|
placeholder: "\u8BF7\u8F93\u5165\u8BF4\u660E"
|
|
30
30
|
}))), /*#__PURE__*/React.createElement(Button, {
|
|
31
31
|
type: "primary",
|
package/dist/Form/index.d.ts
CHANGED
|
@@ -1,3 +1,10 @@
|
|
|
1
|
-
import { Form, FormProps
|
|
1
|
+
import { Form as InternalForm, FormProps } from "@trionesdev/antd-mobile-base-react";
|
|
2
|
+
import FormItem, { FormItemProps } from "./FormItem";
|
|
3
|
+
import "./style.scss";
|
|
4
|
+
type InternalFormType = typeof InternalForm;
|
|
5
|
+
type CompoundedComponent = InternalFormType & {
|
|
6
|
+
Item: typeof FormItem;
|
|
7
|
+
};
|
|
8
|
+
declare const Form: CompoundedComponent;
|
|
2
9
|
export type { FormProps, FormItemProps };
|
|
3
10
|
export default Form;
|
package/dist/Form/index.js
CHANGED
|
@@ -1,2 +1,6 @@
|
|
|
1
|
-
import { Form } from "@trionesdev/antd-mobile-base-react";
|
|
1
|
+
import { Form as InternalForm } from "@trionesdev/antd-mobile-base-react";
|
|
2
|
+
import FormItem from "./FormItem";
|
|
3
|
+
import "./style.scss";
|
|
4
|
+
var Form = InternalForm;
|
|
5
|
+
Form.Item = FormItem;
|
|
2
6
|
export default Form;
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
@use "../style/variable" as variable;
|
|
2
|
+
$cls-prefix-form: 'triones-antm-form';
|
|
3
|
+
$cls-prefix-form-item: 'triones-antm-form-item';
|
|
4
|
+
|
|
5
|
+
.#{$cls-prefix-form} {}
|
|
6
|
+
|
|
7
|
+
.#{$cls-prefix-form-item} {
|
|
8
|
+
|
|
9
|
+
&-label {
|
|
10
|
+
font-size: variable.$trionesFontSize;
|
|
11
|
+
padding-block: 4Px;
|
|
12
|
+
color: #6F6F6F;
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
&-wrapper {
|
|
16
|
+
// height: 1.47059em;
|
|
17
|
+
line-height: 1.47059;
|
|
18
|
+
display: flex;
|
|
19
|
+
align-items: center;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
&-left {}
|
|
23
|
+
|
|
24
|
+
&-right {
|
|
25
|
+
text-align: right;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
&-required-mark {
|
|
29
|
+
display: inline-block;
|
|
30
|
+
color: red;
|
|
31
|
+
margin-right: 4Px;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
&-input {
|
|
37
|
+
|
|
38
|
+
.#{$cls-prefix-form-item} {
|
|
39
|
+
&-error {
|
|
40
|
+
font-size: variable.$trionesFontSizeSm;
|
|
41
|
+
color: red;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
&-horizontal {
|
|
47
|
+
display: flex;
|
|
48
|
+
flex-direction: row;
|
|
49
|
+
|
|
50
|
+
.#{$cls-prefix-form-item} {
|
|
51
|
+
&-label {
|
|
52
|
+
flex-shrink: 1;
|
|
53
|
+
min-width: 0;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
&-input {
|
|
57
|
+
flex: auto 1;
|
|
58
|
+
flex-shrink: 1;
|
|
59
|
+
min-width: 0;
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
&-hidden {
|
|
65
|
+
display: none;
|
|
66
|
+
}
|
|
67
|
+
}
|
package/dist/Grid/demo/base.js
CHANGED
package/dist/Grid/demo/base.scss
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
.grid-demo-item-block {
|
|
2
|
-
border: solid 1px #999;
|
|
3
|
-
background: #f5f5f5;
|
|
4
|
-
text-align: center;
|
|
5
|
-
color: #999;
|
|
6
|
-
height: 100%;
|
|
7
|
-
}
|
|
1
|
+
.grid-demo-item-block {
|
|
2
|
+
border: solid 1px #999;
|
|
3
|
+
background: #f5f5f5;
|
|
4
|
+
text-align: center;
|
|
5
|
+
color: #999;
|
|
6
|
+
height: 100%;
|
|
7
|
+
}
|
package/dist/Icon/demo/base.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* compact: true
|
|
1
|
+
/**
|
|
2
|
+
* compact: true
|
|
3
3
|
*/
|
|
4
4
|
import React from "react";
|
|
5
5
|
import * as icons from "../../../../antd-mobile-icons-react";
|
|
6
|
-
import
|
|
6
|
+
import { omit, map } from "lodash-es";
|
|
7
7
|
import { DemoBlock } from "../../DemoBlock";
|
|
8
8
|
export default (function () {
|
|
9
9
|
return /*#__PURE__*/React.createElement(DemoBlock, {
|
|
@@ -16,7 +16,7 @@ export default (function () {
|
|
|
16
16
|
gap: 20,
|
|
17
17
|
flexWrap: 'wrap'
|
|
18
18
|
}
|
|
19
|
-
},
|
|
19
|
+
}, map(omit(icons, 'Icon'), function (icon, name) {
|
|
20
20
|
return /*#__PURE__*/React.createElement("div", {
|
|
21
21
|
key: name,
|
|
22
22
|
style: {
|
package/dist/Image/demo/base.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
.imagesContainer {
|
|
2
|
-
--triones-antm-image-width: 90px;
|
|
3
|
-
--triones-antm-image-height: 60px;
|
|
4
|
-
}
|
|
1
|
+
.imagesContainer {
|
|
2
|
+
--triones-antm-image-width: 90px;
|
|
3
|
+
--triones-antm-image-height: 60px;
|
|
4
|
+
}
|
package/dist/Image/style.scss
CHANGED
|
@@ -1,30 +1,30 @@
|
|
|
1
|
-
$class-prefix-image: 'triones-antm-image';
|
|
2
|
-
|
|
3
|
-
.#{$class-prefix-image} {
|
|
4
|
-
overflow: hidden;
|
|
5
|
-
text-align: center;
|
|
6
|
-
display: flex;
|
|
7
|
-
justify-content: center;
|
|
8
|
-
position: relative;
|
|
9
|
-
&-img {
|
|
10
|
-
height: 100%;
|
|
11
|
-
width: 100%;
|
|
12
|
-
object-fit: cover;
|
|
13
|
-
}
|
|
14
|
-
&-tip {
|
|
15
|
-
position: relative;
|
|
16
|
-
background-color: var(--triones-antm-color-fill-content);
|
|
17
|
-
height: 100%;
|
|
18
|
-
min-height: 24px;
|
|
19
|
-
min-width: 24px;
|
|
20
|
-
> svg {
|
|
21
|
-
width: 24px;
|
|
22
|
-
height: 24px;
|
|
23
|
-
position: absolute;
|
|
24
|
-
left: 50%;
|
|
25
|
-
top: 50%;
|
|
26
|
-
transform: translate(-50%, -50%);
|
|
27
|
-
color: var(--triones-antm-color-weak);
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
}
|
|
1
|
+
$class-prefix-image: 'triones-antm-image';
|
|
2
|
+
|
|
3
|
+
.#{$class-prefix-image} {
|
|
4
|
+
overflow: hidden;
|
|
5
|
+
text-align: center;
|
|
6
|
+
display: flex;
|
|
7
|
+
justify-content: center;
|
|
8
|
+
position: relative;
|
|
9
|
+
&-img {
|
|
10
|
+
height: 100%;
|
|
11
|
+
width: 100%;
|
|
12
|
+
object-fit: cover;
|
|
13
|
+
}
|
|
14
|
+
&-tip {
|
|
15
|
+
position: relative;
|
|
16
|
+
background-color: var(--triones-antm-color-fill-content);
|
|
17
|
+
height: 100%;
|
|
18
|
+
min-height: 24px;
|
|
19
|
+
min-width: 24px;
|
|
20
|
+
> svg {
|
|
21
|
+
width: 24px;
|
|
22
|
+
height: 24px;
|
|
23
|
+
position: absolute;
|
|
24
|
+
left: 50%;
|
|
25
|
+
top: 50%;
|
|
26
|
+
transform: translate(-50%, -50%);
|
|
27
|
+
color: var(--triones-antm-color-weak);
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
}
|
|
@@ -5,10 +5,10 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
|
|
|
5
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
6
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
7
|
import React, { useEffect } from "react";
|
|
8
|
-
import Mask from "../Mask";
|
|
9
8
|
import classNames from "classnames";
|
|
10
9
|
import { Swiper, Image } from "../index";
|
|
11
10
|
import "./style.scss";
|
|
11
|
+
import Overlay from "../Overlay";
|
|
12
12
|
var cls = 'triones-antm-image-preview';
|
|
13
13
|
export var ImagesPreview = function ImagesPreview(_ref) {
|
|
14
14
|
var className = _ref.className,
|
|
@@ -45,7 +45,7 @@ export var ImagesPreview = function ImagesPreview(_ref) {
|
|
|
45
45
|
}
|
|
46
46
|
setInnerActiveIndex(activeIndex);
|
|
47
47
|
}, [activeIndex]);
|
|
48
|
-
return /*#__PURE__*/React.createElement(
|
|
48
|
+
return /*#__PURE__*/React.createElement(Overlay, {
|
|
49
49
|
open: innerOpen
|
|
50
50
|
}, /*#__PURE__*/React.createElement("div", {
|
|
51
51
|
className: classNames(cls, className),
|
|
@@ -1,34 +1,34 @@
|
|
|
1
|
-
$imagePreviewCls: 'triones-antm-image-preview';
|
|
2
|
-
|
|
3
|
-
.#{$imagePreviewCls} {
|
|
4
|
-
height: 100%;
|
|
5
|
-
width: 100%;
|
|
6
|
-
position: relative;
|
|
7
|
-
background-color: rgba(0, 0, 0, 0.8);
|
|
8
|
-
|
|
9
|
-
&-head {
|
|
10
|
-
position: fixed;
|
|
11
|
-
top: 50Px;
|
|
12
|
-
left: 0;
|
|
13
|
-
right: 0;
|
|
14
|
-
display: flex;
|
|
15
|
-
justify-content: center;
|
|
16
|
-
align-items: center;
|
|
17
|
-
color: white;
|
|
18
|
-
font-size: 14Px;
|
|
19
|
-
z-index: 1000;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
&-content {
|
|
23
|
-
height: 100%;
|
|
24
|
-
width: 100%;
|
|
25
|
-
:global{
|
|
26
|
-
.triones-antm-image-img{
|
|
27
|
-
height: auto!important;
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
&-foot {
|
|
33
|
-
}
|
|
34
|
-
}
|
|
1
|
+
$imagePreviewCls: 'triones-antm-image-preview';
|
|
2
|
+
|
|
3
|
+
.#{$imagePreviewCls} {
|
|
4
|
+
height: 100%;
|
|
5
|
+
width: 100%;
|
|
6
|
+
position: relative;
|
|
7
|
+
background-color: rgba(0, 0, 0, 0.8);
|
|
8
|
+
|
|
9
|
+
&-head {
|
|
10
|
+
position: fixed;
|
|
11
|
+
top: 50Px;
|
|
12
|
+
left: 0;
|
|
13
|
+
right: 0;
|
|
14
|
+
display: flex;
|
|
15
|
+
justify-content: center;
|
|
16
|
+
align-items: center;
|
|
17
|
+
color: white;
|
|
18
|
+
font-size: 14Px;
|
|
19
|
+
z-index: 1000;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
&-content {
|
|
23
|
+
height: 100%;
|
|
24
|
+
width: 100%;
|
|
25
|
+
:global{
|
|
26
|
+
.triones-antm-image-img{
|
|
27
|
+
height: auto!important;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
&-foot {
|
|
33
|
+
}
|
|
34
|
+
}
|
|
@@ -5,14 +5,14 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
|
|
|
5
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
6
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
7
|
import React from "react";
|
|
8
|
-
import
|
|
8
|
+
import Overlay from "../Overlay";
|
|
9
9
|
export var CameraModal = function CameraModal(_ref) {
|
|
10
10
|
var open = _ref.open;
|
|
11
11
|
var _React$useState = React.useState(open || false),
|
|
12
12
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
13
13
|
innerOpen = _React$useState2[0],
|
|
14
14
|
setInnerOpen = _React$useState2[1];
|
|
15
|
-
return /*#__PURE__*/React.createElement(
|
|
15
|
+
return /*#__PURE__*/React.createElement(Overlay, {
|
|
16
16
|
open: innerOpen
|
|
17
17
|
}, /*#__PURE__*/React.createElement("div", {
|
|
18
18
|
style: {
|
|
@@ -19,7 +19,7 @@ import "./style.scss";
|
|
|
19
19
|
import ActionSheet from "../ActionSheet";
|
|
20
20
|
import { CameraModal } from "./CameraModal";
|
|
21
21
|
import { ImagesPreview } from "../index";
|
|
22
|
-
import { isEqual } from "lodash";
|
|
22
|
+
import { isEqual } from "lodash-es";
|
|
23
23
|
import { RandomUtils } from "../utils/random-utils";
|
|
24
24
|
var cls = 'triones-antm-images-wall';
|
|
25
25
|
var ImagesWallItem = function ImagesWallItem(_ref) {
|
|
@@ -1,70 +1,70 @@
|
|
|
1
|
-
@
|
|
2
|
-
|
|
3
|
-
$imagesWallCls: 'triones-antm-images-wall';
|
|
4
|
-
|
|
5
|
-
.#{$imagesWallCls} {
|
|
6
|
-
display: grid;
|
|
7
|
-
grid-gap: 4PX;
|
|
8
|
-
width: 100%;
|
|
9
|
-
|
|
10
|
-
&-item {
|
|
11
|
-
aspect-ratio: 1;
|
|
12
|
-
border-radius:
|
|
13
|
-
overflow: hidden;
|
|
14
|
-
position: relative;
|
|
15
|
-
|
|
16
|
-
&-inner {
|
|
17
|
-
width: 100%;
|
|
18
|
-
height: 100%;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
&-close {
|
|
22
|
-
position: absolute;
|
|
23
|
-
top: 0;
|
|
24
|
-
right: 0;
|
|
25
|
-
background-color: rgb(0 0 0 / 63%);
|
|
26
|
-
width: 20Px;
|
|
27
|
-
height: 20Px;
|
|
28
|
-
border-bottom-left-radius:
|
|
29
|
-
display: flex;
|
|
30
|
-
justify-content: center;
|
|
31
|
-
align-items: center;
|
|
32
|
-
|
|
33
|
-
.triones-antm-icon {
|
|
34
|
-
color: white;
|
|
35
|
-
font-size: 12Px;
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
&-input {
|
|
40
|
-
position: absolute;
|
|
41
|
-
width: 100%;
|
|
42
|
-
height: 100%;
|
|
43
|
-
top: 0;
|
|
44
|
-
left: 0;
|
|
45
|
-
margin: 0;
|
|
46
|
-
padding: 0;
|
|
47
|
-
z-index: 1;
|
|
48
|
-
opacity: 0;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
&-image {
|
|
52
|
-
width: 100%;
|
|
53
|
-
height: 100%;
|
|
54
|
-
object-fit: cover;
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
&-upload {
|
|
59
|
-
display: flex;
|
|
60
|
-
justify-content: center;
|
|
61
|
-
align-items: center;
|
|
62
|
-
background-color:
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
&-action-sheet {
|
|
66
|
-
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
|
|
1
|
+
@use "../style/variable" as variable;
|
|
2
|
+
|
|
3
|
+
$imagesWallCls: 'triones-antm-images-wall';
|
|
4
|
+
|
|
5
|
+
.#{$imagesWallCls} {
|
|
6
|
+
display: grid;
|
|
7
|
+
grid-gap: 4PX;
|
|
8
|
+
width: 100%;
|
|
9
|
+
|
|
10
|
+
&-item {
|
|
11
|
+
aspect-ratio: 1;
|
|
12
|
+
border-radius: variable.$trionesBorderRadius;
|
|
13
|
+
overflow: hidden;
|
|
14
|
+
position: relative;
|
|
15
|
+
|
|
16
|
+
&-inner {
|
|
17
|
+
width: 100%;
|
|
18
|
+
height: 100%;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
&-close {
|
|
22
|
+
position: absolute;
|
|
23
|
+
top: 0;
|
|
24
|
+
right: 0;
|
|
25
|
+
background-color: rgb(0 0 0 / 63%);
|
|
26
|
+
width: 20Px;
|
|
27
|
+
height: 20Px;
|
|
28
|
+
border-bottom-left-radius: variable.$trionesBorderRadius;
|
|
29
|
+
display: flex;
|
|
30
|
+
justify-content: center;
|
|
31
|
+
align-items: center;
|
|
32
|
+
|
|
33
|
+
.triones-antm-icon {
|
|
34
|
+
color: white;
|
|
35
|
+
font-size: 12Px;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
&-input {
|
|
40
|
+
position: absolute;
|
|
41
|
+
width: 100%;
|
|
42
|
+
height: 100%;
|
|
43
|
+
top: 0;
|
|
44
|
+
left: 0;
|
|
45
|
+
margin: 0;
|
|
46
|
+
padding: 0;
|
|
47
|
+
z-index: 1;
|
|
48
|
+
opacity: 0;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
&-image {
|
|
52
|
+
width: 100%;
|
|
53
|
+
height: 100%;
|
|
54
|
+
object-fit: cover;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
&-upload {
|
|
59
|
+
display: flex;
|
|
60
|
+
justify-content: center;
|
|
61
|
+
align-items: center;
|
|
62
|
+
background-color: variable.$trionesColorBgTextActive;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
&-action-sheet {
|
|
66
|
+
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export type BaseInputProps = {
|
|
3
|
+
className?: string;
|
|
4
|
+
style?: React.CSSProperties;
|
|
5
|
+
placeholder?: string;
|
|
6
|
+
type?: 'text' | 'password' | 'textarea';
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
value?: any;
|
|
9
|
+
onChange?: (e: any) => void;
|
|
10
|
+
};
|
|
11
|
+
export interface BaseInputHandle {
|
|
12
|
+
}
|
|
13
|
+
export declare const BaseInput: React.ForwardRefExoticComponent<BaseInputProps & React.RefAttributes<BaseInputHandle>>;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
var _excluded = ["className", "style", "placeholder", "type", "value", "onChange"];
|
|
2
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
3
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
4
|
+
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."); }
|
|
5
|
+
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); }
|
|
6
|
+
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; }
|
|
7
|
+
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; } }
|
|
8
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
9
|
+
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; }
|
|
10
|
+
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; }
|
|
11
|
+
import classNames from 'classnames';
|
|
12
|
+
import React, { forwardRef, useEffect, useState } from 'react';
|
|
13
|
+
import { inputCls } from "./types";
|
|
14
|
+
export var BaseInput = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
15
|
+
var className = _ref.className,
|
|
16
|
+
style = _ref.style,
|
|
17
|
+
placeholder = _ref.placeholder,
|
|
18
|
+
type = _ref.type,
|
|
19
|
+
value = _ref.value,
|
|
20
|
+
_onChange = _ref.onChange,
|
|
21
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
22
|
+
var _useState = useState(0),
|
|
23
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
24
|
+
keySequence = _useState2[0],
|
|
25
|
+
setKeySequence = _useState2[1];
|
|
26
|
+
useEffect(function () {
|
|
27
|
+
setKeySequence(keySequence + 1);
|
|
28
|
+
}, [type]);
|
|
29
|
+
return /*#__PURE__*/React.createElement("input", _extends({
|
|
30
|
+
key: keySequence
|
|
31
|
+
}, props, {
|
|
32
|
+
className: classNames(["".concat(inputCls), className]),
|
|
33
|
+
style: style,
|
|
34
|
+
placeholder: placeholder,
|
|
35
|
+
type: type,
|
|
36
|
+
value: value,
|
|
37
|
+
onChange: function onChange(e) {
|
|
38
|
+
_onChange === null || _onChange === void 0 || _onChange(e.target.value);
|
|
39
|
+
}
|
|
40
|
+
}));
|
|
41
|
+
});
|