@trionesdev/antd-mobile-base-react 0.0.2-beta.0

package/dist/Form/FormItem/form-item-input.js

@@ -0,0 +1,39 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+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."); }
+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); }
+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; }
+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; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import classNames from 'classnames';
+import { isEmpty } from 'lodash';
+import { Field } from 'rc-field-form';
+import React, { useState } from 'react';
+export var FormItemInput = function FormItemInput(_ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    name = _ref.name,
+    rules = _ref.rules,
+    initialValue = _ref.initialValue,
+    valuePropName = _ref.valuePropName,
+    errorRender = _ref.errorRender,
+    hiddenError = _ref.hiddenError;
+  var _useState = useState(),
+    _useState2 = _slicedToArray(_useState, 2),
+    meta = _useState2[0],
+    setMeta = _useState2[1];
+  var clsPrefix = 'triones-antm-form-item';
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(className)
+  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Field, {
+    name: name,
+    rules: rules,
+    valuePropName: valuePropName,
+    trigger: 'onChange',
+    onMetaChange: function onMetaChange(meta) {
+      setMeta(meta);
+    },
+    initialValue: initialValue
+  }, children)), !hiddenError && !isEmpty(meta === null || meta === void 0 ? void 0 : meta.errors) && /*#__PURE__*/React.createElement("div", {
+    className: classNames("".concat(clsPrefix, "-error"))
+  }, (errorRender === null || errorRender === void 0 ? void 0 : errorRender(meta === null || meta === void 0 ? void 0 : meta.errors)) || (meta === null || meta === void 0 ? void 0 : meta.errors.join(','))));
+};

package/dist/Form/FormItem/form-item-label.d.ts

@@ -0,0 +1,13 @@
+import React, { CSSProperties, FC } from "react";
+import { NamePath } from "rc-field-form/lib/interface";
+import { FormItemLayout } from "../form";
+type FormItemLabelProps = {
+    className?: string;
+    style?: CSSProperties;
+    label?: React.ReactNode;
+    layout?: FormItemLayout;
+    name?: NamePath;
+    required?: boolean;
+};
+export declare const FormItemLabel: FC<FormItemLabelProps>;
+export {};

package/dist/Form/FormItem/form-item-label.js

@@ -0,0 +1,25 @@
+import React from "react";
+import classNames from "classnames";
+import { useFormContext } from "../hooks/useFormContext";
+import { isFunction } from "lodash";
+export var FormItemLabel = function FormItemLabel(_ref) {
+  var className = _ref.className,
+    style = _ref.style,
+    label = _ref.label,
+    layout = _ref.layout,
+    required = _ref.required;
+  var _useFormContext = useFormContext(),
+    requiredMark = _useFormContext.requiredMark,
+    colon = _useFormContext.colon;
+  var clsPrefix = "triones-antm-form-item-label";
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(className, {
+      required: "".concat(clsPrefix, "-required")
+    }),
+    style: style
+  }, /*#__PURE__*/React.createElement("label", null, required && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(clsPrefix, "-required-mark")
+  }, isFunction(requiredMark) ? requiredMark(label, {
+    required: required
+  }) : '*'), label, layout == 'horizontal' && colon && ':'));
+};

package/dist/Form/FormItem/form-item.d.ts

@@ -0,0 +1,21 @@
+import React, { CSSProperties, FC, ReactElement, ReactNode } from "react";
+import { NamePath, Rule } from "rc-field-form/lib/interface";
+import { FormItemLayout, FormLayoutAlign } from "../form";
+export type FormItemProps = {
+    className?: string;
+    style?: CSSProperties;
+    children?: ReactElement;
+    layout?: FormItemLayout;
+    label?: ReactNode;
+    labelAlign?: FormLayoutAlign;
+    labelWidth?: number;
+    name?: NamePath;
+    required?: boolean;
+    hidden?: boolean;
+    noStyle?: boolean;
+    rules?: Rule[];
+    initialValue?: any;
+    valuePropName?: string;
+    errorRender?: (errors?: any[]) => React.ReactNode;
+};
+export declare const FormItem: FC<FormItemProps>;

package/dist/Form/FormItem/form-item.js

@@ -0,0 +1,70 @@
+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); }
+var _excluded = ["className", "style", "children", "layout", "label", "labelAlign", "labelWidth", "name", "required", "hidden", "noStyle", "rules", "initialValue", "valuePropName", "errorRender"];
+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); }
+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); }
+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 { FormItemLabel } from "./form-item-label";
+import { FormItemInput } from "./form-item-input";
+import classNames from "classnames";
+import { useFormContext } from "../hooks/useFormContext";
+import { Field } from "rc-field-form";
+export var FormItem = function FormItem(_ref) {
+  var className = _ref.className,
+    style = _ref.style,
+    children = _ref.children,
+    layout = _ref.layout,
+    label = _ref.label,
+    labelAlign = _ref.labelAlign,
+    labelWidth = _ref.labelWidth,
+    name = _ref.name,
+    required = _ref.required,
+    _ref$hidden = _ref.hidden,
+    hidden = _ref$hidden === void 0 ? false : _ref$hidden,
+    _ref$noStyle = _ref.noStyle,
+    noStyle = _ref$noStyle === void 0 ? false : _ref$noStyle,
+    rules = _ref.rules,
+    initialValue = _ref.initialValue,
+    valuePropName = _ref.valuePropName,
+    errorRender = _ref.errorRender,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useFormContext = useFormContext(),
+    formLayout = _useFormContext.layout,
+    formLayoutAlign = _useFormContext.labelAlign,
+    formLabelWidth = _useFormContext.labelWidth,
+    hiddenError = _useFormContext.hiddenError;
+  var formItemLayout = layout ? layout : formLayout === 'inline' ? 'horizontal' : formLayout;
+  var formItemAlign = labelAlign ? labelAlign : formLayoutAlign || 'left';
+  var formItemLabelWidth = labelWidth ? labelWidth : formLabelWidth;
+  var clsPrefix = "triones-antm-form-item";
+  if (noStyle) {
+    return /*#__PURE__*/React.createElement(Field, {
+      name: name,
+      rules: rules,
+      trigger: 'onChange',
+      initialValue: initialValue
+    }, children);
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(clsPrefix, "".concat(clsPrefix, "-").concat(formItemLayout), className, _defineProperty({}, "".concat(clsPrefix, "-hidden"), hidden)),
+    style: style
+  }, label && /*#__PURE__*/React.createElement(FormItemLabel, {
+    className: classNames("".concat(clsPrefix, "-label"), "".concat(clsPrefix, "-label-").concat(formItemAlign)),
+    style: {
+      width: formItemLabelWidth
+    },
+    label: label,
+    required: required
+  }), /*#__PURE__*/React.createElement(FormItemInput, _extends({
+    className: "".concat(clsPrefix, "-input")
+  }, props, {
+    name: name,
+    rules: rules,
+    errorRender: errorRender,
+    initialValue: initialValue,
+    hiddenError: hiddenError
+  }), children));
+};

package/dist/Form/FormItem/index.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { FormItemProps } from "./form-item";
+declare const FormItem: import("react").FC<FormItemProps>;
+export type { FormItemProps };
+export default FormItem;

package/dist/Form/FormItem/index.js

@@ -0,0 +1,3 @@
+import { FormItem as InternalFromItem } from "./form-item";
+var FormItem = InternalFromItem;
+export default FormItem;

package/dist/Form/context.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { FormLayout, FormLayoutAlign, RequiredMark } from "./form";
+export interface FormContextProps {
+    colon?: boolean;
+    layout?: FormLayout;
+    labelAlign?: FormLayoutAlign;
+    labelWidth?: number;
+    requiredMark?: RequiredMark;
+    form?: any;
+    hiddenError?: boolean;
+}
+export declare const FormContext: React.Context<FormContextProps>;

package/dist/Form/context.js

@@ -0,0 +1,6 @@
+import React from "react";
+export var FormContext = /*#__PURE__*/React.createContext({
+  colon: true,
+  layout: "horizontal",
+  labelAlign: "left"
+});

package/dist/Form/form.d.ts

@@ -0,0 +1,44 @@
+import { useWatch } from 'rc-field-form';
+import type { FormProps as RcFormProps } from 'rc-field-form/lib/Form';
+import type { FormRef } from 'rc-field-form/lib/interface';
+import React from 'react';
+import { FormInstance } from './interface';
+import './style.scss';
+export type RequiredMark = boolean | 'optional' | ((labelNode: React.ReactNode, info: {
+    required: boolean;
+}) => React.ReactNode);
+export type FormLayout = 'horizontal' | 'inline' | 'vertical';
+export type FormItemLayout = 'horizontal' | 'vertical';
+export type FormLayoutAlign = 'left' | 'right';
+export interface FormProps<Values = any> extends Omit<RcFormProps<Values>, 'form' | 'component'> {
+    /**
+     * @description 配置 Form.Item 的 colon 的默认值。表示是否显示 label 后面的冒号 (只有在属性 layout 为 horizontal 时有效)
+     * @default true
+     */
+    colon?: boolean;
+    /**
+     * @description 布局
+     * @default horizontal
+     */
+    layout?: FormLayout;
+    /**
+     * @description 经 Form.useForm() 创建的 form 控制实例，不提供时会自动创建
+     * @default
+     */
+    form?: FormInstance<Values>;
+    /**
+     * @description 标签
+     * @default horizontal
+     */
+    labelAlign?: FormLayoutAlign;
+    labelWidth?: number;
+    requiredMark?: RequiredMark;
+    /**
+     * @description 是否隐藏错误信息，主要用于自定义异常样式
+     * @default false
+     */
+    hiddenError?: boolean;
+}
+export declare const InternalForm: React.ForwardRefRenderFunction<FormRef, FormProps>;
+export { useWatch };
+export default InternalForm;

package/dist/Form/form.js

@@ -0,0 +1,31 @@
+var _excluded = ["children", "layout", "labelAlign", "labelWidth", "requiredMark", "hiddenError"];
+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); }
+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 FieldForm, { useWatch } from 'rc-field-form';
+import React from 'react';
+import { FormContext } from "./context";
+import "./style.scss";
+export var InternalForm = function InternalForm(_ref, ref) {
+  var children = _ref.children,
+    layout = _ref.layout,
+    labelAlign = _ref.labelAlign,
+    labelWidth = _ref.labelWidth,
+    requiredMark = _ref.requiredMark,
+    _ref$hiddenError = _ref.hiddenError,
+    hiddenError = _ref$hiddenError === void 0 ? false : _ref$hiddenError,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
+    value: {
+      layout: layout || 'horizontal',
+      labelAlign: labelAlign || 'left',
+      labelWidth: labelWidth,
+      requiredMark: requiredMark || true,
+      hiddenError: hiddenError
+    }
+  }, /*#__PURE__*/React.createElement(FieldForm, _extends({}, props, {
+    component: false
+  }), children));
+};
+export { useWatch };
+export default InternalForm;

package/dist/Form/hooks/useForm.d.ts

@@ -0,0 +1,2 @@
+import { FormInstance } from '../interface';
+export default function useForm<Values = any>(form?: FormInstance<Values>): [FormInstance<Values>];

package/dist/Form/hooks/useForm.js

@@ -0,0 +1,24 @@
+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 ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+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."); }
+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); }
+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; }
+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; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import * as React from 'react';
+import { useForm as useRcForm } from 'rc-field-form';
+export default function useForm(form) {
+  var _useRcForm = useRcForm(),
+    _useRcForm2 = _slicedToArray(_useRcForm, 1),
+    rcForm = _useRcForm2[0];
+  var itemsRef = React.useRef({});
+  var wrapForm = React.useMemo(function () {
+    return form !== null && form !== void 0 ? form : _objectSpread({}, rcForm);
+  }, [form, rcForm]);
+  return [wrapForm];
+}

package/dist/Form/hooks/useFormContext.d.ts

@@ -0,0 +1,2 @@
+import { FormContextProps } from "../context";
+export declare function useFormContext(): FormContextProps;

package/dist/Form/hooks/useFormContext.js

@@ -0,0 +1,6 @@
+import { FormContext } from "../context";
+import React from "react";
+export function useFormContext() {
+  var formContext = React.useContext(FormContext);
+  return formContext;
+}

package/dist/Form/index.d.ts

@@ -0,0 +1,12 @@
+import InternalForm, { FormProps, useWatch } from "./form";
+import FormItem, { FormItemProps } from "./FormItem";
+import useForm from "./hooks/useForm";
+type InternalFormType = typeof InternalForm;
+type CompoundedComponent = InternalFormType & {
+    useForm: typeof useForm;
+    Item: typeof FormItem;
+    useWatch: typeof useWatch;
+};
+declare const Form: CompoundedComponent;
+export type { FormProps, FormItemProps };
+export default Form;

package/dist/Form/index.js

@@ -0,0 +1,8 @@
+import InternalForm, { useWatch } from "./form";
+import FormItem from "./FormItem";
+import useForm from "./hooks/useForm";
+var Form = InternalForm;
+Form.useForm = useForm;
+Form.Item = FormItem;
+Form.useWatch = useWatch;
+export default Form;

package/dist/Form/interface.d.ts

@@ -0,0 +1,3 @@
+import type { FormInstance as RcFormInstance } from 'rc-field-form';
+export interface FormInstance<Values = any> extends RcFormInstance<Values> {
+}

package/dist/Form/interface.js

@@ -0,0 +1 @@
+export {};

package/dist/Form/style.scss

@@ -0,0 +1,45 @@
+$cls-prefix-form: 'triones-antm-form';
+$cls-prefix-form-item: 'triones-antm-form-item';
+
+.#{$cls-prefix-form}{
+
+}
+
+.#{$cls-prefix-form-item}{
+  &-label{
+    font-size: 14Px;
+    //line-height: 1.5;
+    color: #6F6F6F;
+    &-left{}
+    &-right{
+      text-align: right;
+    }
+    &-required-mark{
+      display: inline-block;
+      color: red;
+      margin-right: 4Px;
+    }
+  }
+  &-input{
+    .#{$cls-prefix-form-item}{
+      &-error{
+        font-size: 12Px;
+        color: red;
+      }
+    }
+  }
+  &-horizontal{
+    display: flex;
+    .#{$cls-prefix-form-item}{
+      &-label{
+        padding: 4Px;
+      }
+      &-input{
+        flex: auto 1;
+      }
+    }
+  }
+  &-hidden{
+    display: none;
+  }
+}

package/dist/Grid/grid.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import type { FC, ReactNode } from 'react';
+import { NativeProps } from '../utils/native-props';
+import './style.scss';
+export type GridProps = {
+    columns: number;
+    gap?: number | string | [number | string, number | string];
+    children?: ReactNode;
+} & NativeProps<'--gap' | '--gap-vertical' | '--gap-horizontal'>;
+export declare const Grid: FC<GridProps>;
+export type GridItemProps = {
+    span?: number;
+    onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    children?: ReactNode;
+} & NativeProps;
+export declare const GridItem: FC<GridItemProps>;

package/dist/Grid/grid.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import { toCSSLength, withNativeProps } from "../utils/native-props";
+import "./style.scss";
+import { mergeProps } from "../utils/with-default-props";
+var classPrefix = "triones-antm-grid";
+export var Grid = function Grid(props) {
+  var style = {
+    '--columns': props.columns.toString()
+  };
+  var gap = props.gap;
+  if (gap !== undefined) {
+    if (Array.isArray(gap)) {
+      style['--gap-horizontal'] = toCSSLength(gap[0]);
+      style['--gap-vertical'] = toCSSLength(gap[1]);
+    } else {
+      style['--gap'] = toCSSLength(gap);
+    }
+  }
+  return withNativeProps(props, /*#__PURE__*/React.createElement("div", {
+    className: classPrefix,
+    style: style
+  }, props.children));
+};
+export var GridItem = function GridItem(p) {
+  var props = mergeProps({
+    span: 1
+  }, p);
+  return withNativeProps(props, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(classPrefix, "-item"),
+    style: {
+      gridColumnEnd: "span ".concat(props.span)
+    },
+    onClick: props.onClick
+  }, props.children));
+};

package/dist/Grid/index.d.ts

@@ -0,0 +1,7 @@
+import { Grid as InternalGrid, GridItem } from './grid';
+export type { GridProps, GridItemProps } from './grid';
+type CompoundedComponent = typeof InternalGrid & {
+    Item: typeof GridItem;
+};
+declare const Grid: CompoundedComponent;
+export default Grid;

package/dist/Grid/index.js

@@ -0,0 +1,4 @@
+import { Grid as InternalGrid, GridItem } from "./grid";
+var Grid = InternalGrid;
+Grid.Item = GridItem;
+export default Grid;

package/dist/Grid/style.scss

@@ -0,0 +1,17 @@
+$class-prefix-grid: 'triones-antm-grid';
+/* prettier-ignore */
+.#{$class-prefix-grid} {
+  --gap: 0;
+  --gap-horizontal: var(--gap);
+  --gap-vertical: var(--gap);
+
+  display: grid;
+  grid-gap: 10PX;
+  column-gap: var(--gap-horizontal);
+  row-gap: var(--gap-vertical);
+  grid-template-columns: repeat(var(--columns), minmax(0, 1fr));
+  align-items: stretch;
+  &-item {
+    grid-column-end: span var(--item-span);
+  }
+}

package/dist/Icon/check-icon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { NativeProps } from '../utils/native-props';
+export declare const CheckIcon: React.NamedExoticComponent<NativeProps>;

package/dist/Icon/check-icon.js

@@ -0,0 +1,10 @@
+import React, { memo } from 'react';
+import { withNativeProps } from "../utils/native-props";
+export var CheckIcon = /*#__PURE__*/memo(function (props) {
+  return withNativeProps(props, /*#__PURE__*/React.createElement("svg", {
+    viewBox: "0 0 40 40"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M31.5541766,15 L28.0892433,15 L28.0892434,15 C27.971052,15 27.8576674,15.044522 27.7740471,15.1239792 L18.2724722,24.1625319 L13.2248725,19.3630279 L13.2248725,19.3630279 C13.1417074,19.2834412 13.0287551,19.2384807 12.9107898,19.2380079 L9.44474455,19.2380079 L9.44474454,19.2380079 C9.19869815,19.2384085 8.99957935,19.4284738 9,19.66253 C9,19.7747587 9.04719253,19.8823283 9.13066188,19.9616418 L17.0907466,27.5338228 C17.4170809,27.8442545 17.8447695,28 18.2713393,28 L18.2980697,28 C18.7168464,27.993643 19.133396,27.8378975 19.4530492,27.5338228 L31.8693384,15.7236361 L31.8693384,15.7236361 C32.0434167,15.5582251 32.0435739,15.2898919 31.8696892,15.1242941 C31.7860402,15.0446329 31.6725052,15 31.5541421,15 L31.5541766,15 Z",
+    fill: "currentColor"
+  })));
+});

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

@@ -0,0 +1,6 @@
+/**
+ * compact: true
+ */
+import React from "react";
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/Icon/demo/base.js

@@ -0,0 +1,41 @@
+/**
+ * compact: true
+ */
+import React from "react";
+import * as icons from "../../../../antd-mobile-icons-react";
+import { map, omit } from "lodash";
+import { DemoBlock } from "../../DemoBlock";
+export default (function () {
+  return /*#__PURE__*/React.createElement(DemoBlock, {
+    title: "\u56FE\u6807"
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'space-between',
+      gap: 20,
+      flexWrap: 'wrap'
+    }
+  }, map(omit(icons, 'Icon'), function (icon, name) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: name,
+      style: {
+        width: '40%',
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'center',
+        marginTop: 30
+      }
+    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(icon, {
+      key: name,
+      style: {
+        fontSize: 48
+      }
+    })), /*#__PURE__*/React.createElement("div", {
+      style: {
+        fontSize: 14,
+        marginTop: 5
+      }
+    }, name));
+  })));
+});

package/dist/Input/base-input.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+export type BaseInputProps = {
+    className?: string;
+    style?: React.CSSProperties;
+    placeholder?: string;
+    type?: 'text' | 'password' | 'textarea';
+    disabled?: boolean;
+    value?: any;
+    onChange?: (e: any) => void;
+};
+export interface BaseInputHandle {
+    clear?: () => void;
+}
+export declare const BaseInput: React.ForwardRefExoticComponent<BaseInputProps & React.RefAttributes<BaseInputHandle>>;

package/dist/Input/base-input.js

@@ -0,0 +1,63 @@
+var _excluded = ["className", "style", "placeholder", "type", "value", "onChange"];
+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); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+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."); }
+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); }
+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; }
+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; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+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 classNames from 'classnames';
+import React, { forwardRef, useEffect, useImperativeHandle, useState } from 'react';
+export var BaseInput = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    style = _ref.style,
+    placeholder = _ref.placeholder,
+    type = _ref.type,
+    value = _ref.value,
+    _onChange = _ref.onChange,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useState = useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    keySequence = _useState2[0],
+    setKeySequence = _useState2[1];
+  var _useState3 = useState(value || ''),
+    _useState4 = _slicedToArray(_useState3, 2),
+    innerValue = _useState4[0],
+    setInnerValue = _useState4[1];
+  useImperativeHandle(ref, function () {
+    return {
+      clear: function clear() {
+        setInnerValue('');
+        _onChange === null || _onChange === void 0 || _onChange('');
+      }
+    };
+  });
+  var cls = 'triones-antm-input';
+  useEffect(function () {
+    setKeySequence(keySequence + 1);
+  }, [type]);
+  useEffect(function () {
+    if (value === undefined) {
+      return;
+    }
+    if (value === innerValue) {
+      return;
+    }
+    setInnerValue(value);
+  }, [value]);
+  return /*#__PURE__*/React.createElement("input", _extends({
+    key: keySequence
+  }, props, {
+    className: classNames(["".concat(cls), className]),
+    style: style,
+    placeholder: placeholder,
+    type: type,
+    value: innerValue,
+    onChange: function onChange(e) {
+      setInnerValue(e.target.value);
+      _onChange === null || _onChange === void 0 || _onChange(e);
+    }
+  }));
+});