antd-mobile 5.17.0 → 5.17.1

package/es/components/date-picker/date-picker.js

@@ -0,0 +1,73 @@
+import React, { forwardRef, useCallback, useMemo } from 'react';
+import { useMemoizedFn } from 'ahooks';
+import Picker from '../picker';
+import { withNativeProps } from '../../utils/native-props';
+import { mergeProps } from '../../utils/with-default-props';
+import { usePropsValue } from '../../utils/use-props-value';
+import { convertDateToStringArray, convertStringArrayToDate, generateDatePickerColumns, defaultRenderLabel } from './date-picker-utils';
+import { bound } from '../../utils/bound';
+const thisYear = new Date().getFullYear();
+const defaultProps = {
+  min: new Date(new Date().setFullYear(thisYear - 10)),
+  max: new Date(new Date().setFullYear(thisYear + 10)),
+  precision: 'day',
+  renderLabel: defaultRenderLabel,
+  defaultValue: null
+};
+export const DatePicker = forwardRef((p, ref) => {
+  const props = mergeProps(defaultProps, p);
+  const [value, setValue] = usePropsValue({
+    value: props.value,
+    defaultValue: props.defaultValue,
+    onChange: v => {
+      var _a;
+
+      if (v === null) return;
+      (_a = props.onConfirm) === null || _a === void 0 ? void 0 : _a.call(props, v);
+    }
+  });
+  const now = useMemo(() => new Date(), []);
+  const pickerValue = useMemo(() => {
+    let date = value !== null && value !== void 0 ? value : now;
+    date = new Date(bound(date.getTime(), props.min.getTime(), props.max.getTime()));
+    return convertDateToStringArray(date, props.precision);
+  }, [value, props.precision, props.min, props.max]);
+  const onConfirm = useCallback(val => {
+    setValue(convertStringArrayToDate(val, props.precision), true);
+  }, [setValue, props.precision]);
+  const onSelect = useMemoizedFn(val => {
+    var _a;
+
+    const date = convertStringArrayToDate(val, props.precision);
+    (_a = props.onSelect) === null || _a === void 0 ? void 0 : _a.call(props, date);
+  });
+  const columns = useCallback(selected => generateDatePickerColumns(selected, props.min, props.max, props.precision, props.renderLabel, props.filter), [props.min, props.max, props.precision, props.renderLabel]);
+  return withNativeProps(props, React.createElement(Picker, {
+    ref: ref,
+    columns: columns,
+    value: pickerValue,
+    onCancel: props.onCancel,
+    onClose: props.onClose,
+    closeOnMaskClick: props.closeOnMaskClick,
+    visible: props.visible,
+    confirmText: props.confirmText,
+    cancelText: props.cancelText,
+    onConfirm: onConfirm,
+    onSelect: onSelect,
+    getContainer: props.getContainer,
+    loading: props.loading,
+    loadingContent: props.loadingContent,
+    afterShow: props.afterShow,
+    afterClose: props.afterClose,
+    onClick: props.onClick,
+    title: props.title,
+    stopPropagation: props.stopPropagation,
+    mouseWheel: props.mouseWheel,
+    destroyOnClose: props.destroyOnClose,
+    forceRender: props.forceRender
+  }, (_, actions) => {
+    var _a;
+
+    return (_a = props.children) === null || _a === void 0 ? void 0 : _a.call(props, value, actions);
+  }));
+});

package/es/components/date-picker/index.d.ts

@@ -0,0 +1,26 @@
+/// <reference types="react" />
+import './date-picker.less';
+import { prompt } from './prompt';
+export type { DatePickerProps, DatePickerRef } from './date-picker';
+export type { DatePickerFilter } from './date-picker-utils';
+declare const _default: import("react").ForwardRefExoticComponent<Pick<import("../picker").PickerProps, "style" | "title" | "onClick" | "visible" | "destroyOnClose" | "forceRender" | "getContainer" | "afterShow" | "afterClose" | "stopPropagation" | "onCancel" | "onClose" | "loading" | "closeOnMaskClick" | "cancelText" | "mouseWheel" | "loadingContent" | "confirmText"> & {
+    value?: Date | null | undefined;
+    defaultValue?: Date | null | undefined;
+    onSelect?: ((value: Date) => void) | undefined;
+    onConfirm?: ((value: Date) => void) | undefined;
+    min?: Date | undefined;
+    max?: Date | undefined;
+    precision?: import("./date-picker-utils").Precision | undefined;
+    children?: ((value: Date | null, actions: import("../picker").PickerActions) => import("react").ReactNode) | undefined;
+    renderLabel?: ((type: import("./date-picker-utils").Precision, data: number) => import("react").ReactNode) | undefined;
+    filter?: Partial<Record<import("./date-picker-utils").Precision, (val: number, extend: {
+        date: Date;
+    }) => boolean>> | undefined;
+} & {
+    className?: string | undefined;
+    style?: (import("react").CSSProperties & Partial<Record<never, string>>) | undefined;
+    tabIndex?: number | undefined;
+} & import("react").AriaAttributes & import("react").RefAttributes<import("../picker").PickerActions>> & {
+    prompt: typeof prompt;
+};
+export default _default;

package/es/components/date-picker/index.js

@@ -0,0 +1,7 @@
+import "./date-picker.css";
+import { attachPropertiesToComponent } from '../../utils/attach-properties-to-component';
+import { DatePicker } from './date-picker';
+import { prompt } from './prompt';
+export default attachPropertiesToComponent(DatePicker, {
+  prompt
+});

package/es/components/date-picker/prompt.d.ts

@@ -0,0 +1,2 @@
+import { DatePickerProps } from './date-picker';
+export declare function prompt(props: Omit<DatePickerProps, 'value' | 'visible' | 'children'>): Promise<Date | null>;

package/es/components/date-picker/prompt.js

@@ -0,0 +1,37 @@
+import React, { useEffect, useState } from 'react';
+import { renderToBody } from '../../utils/render-to-body';
+import { DatePicker } from './date-picker';
+export function prompt(props) {
+  return new Promise(resolve => {
+    const Wrapper = () => {
+      const [visible, setVisible] = useState(false);
+      useEffect(() => {
+        setVisible(true);
+      }, []);
+      return React.createElement(DatePicker, Object.assign({}, props, {
+        visible: visible,
+        onConfirm: val => {
+          var _a;
+
+          (_a = props.onConfirm) === null || _a === void 0 ? void 0 : _a.call(props, val);
+          resolve(val);
+        },
+        onClose: () => {
+          var _a;
+
+          (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
+          setVisible(false);
+          resolve(null);
+        },
+        afterClose: () => {
+          var _a;
+
+          (_a = props.afterClose) === null || _a === void 0 ? void 0 : _a.call(props);
+          unmount();
+        }
+      }));
+    };
+
+    const unmount = renderToBody(React.createElement(Wrapper, null));
+  });
+}

package/es/components/date-picker-view/date-picker-view.d.ts

@@ -0,0 +1,15 @@
+import { FC, ReactNode } from 'react';
+import type { PickerViewProps } from '../picker-view';
+import { NativeProps } from '../../utils/native-props';
+import type { Precision, DatePickerFilter } from '../date-picker/date-picker-utils';
+export declare type DatePickerViewProps = Pick<PickerViewProps, 'style' | 'mouseWheel' | 'loading' | 'loadingContent'> & {
+    value?: Date;
+    defaultValue?: Date;
+    onChange?: (value: Date) => void;
+    min?: Date;
+    max?: Date;
+    precision?: Precision;
+    renderLabel?: (type: Precision, data: number) => ReactNode;
+    filter?: DatePickerFilter;
+} & NativeProps;
+export declare const DatePickerView: FC<DatePickerViewProps>;

package/es/components/date-picker-view/date-picker-view.js

@@ -0,0 +1,41 @@
+import React, { useCallback, useMemo } from 'react';
+import PickerView from '../picker-view';
+import { withNativeProps } from '../../utils/native-props';
+import { mergeProps } from '../../utils/with-default-props';
+import { usePropsValue } from '../../utils/use-props-value';
+import { generateDatePickerColumns, convertDateToStringArray, convertStringArrayToDate, defaultRenderLabel } from '../date-picker/date-picker-utils';
+const thisYear = new Date().getFullYear();
+const defaultProps = {
+  min: new Date(new Date().setFullYear(thisYear - 10)),
+  max: new Date(new Date().setFullYear(thisYear + 10)),
+  precision: 'day',
+  renderLabel: defaultRenderLabel
+};
+export const DatePickerView = p => {
+  var _a;
+
+  const props = mergeProps(defaultProps, p);
+  const [value, setValue] = usePropsValue({
+    value: props.value,
+    defaultValue: (_a = props.defaultValue) !== null && _a !== void 0 ? _a : null
+  });
+  const pickerValue = useMemo(() => convertDateToStringArray(value, props.precision), [value, props.precision]);
+  const onChange = useCallback(val => {
+    var _a;
+
+    const date = convertStringArrayToDate(val, props.precision);
+
+    if (date) {
+      setValue(date);
+      (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, date);
+    }
+  }, [props.onChange, props.precision]);
+  return withNativeProps(props, React.createElement(PickerView, {
+    columns: selected => generateDatePickerColumns(selected, props.min, props.max, props.precision, props.renderLabel, props.filter),
+    loading: props.loading,
+    loadingContent: props.loadingContent,
+    value: pickerValue,
+    mouseWheel: props.mouseWheel,
+    onChange: onChange
+  }));
+};

package/es/components/date-picker-view/index.d.ts

@@ -0,0 +1,4 @@
+import { DatePickerView } from './date-picker-view';
+export type { DatePickerViewProps } from './date-picker-view';
+export type { DatePickerFilter } from '../date-picker';
+export default DatePickerView;

package/es/components/date-picker-view/index.js

@@ -0,0 +1,2 @@
+import { DatePickerView } from './date-picker-view';
+export default DatePickerView;

package/es/components/dialog/alert.d.ts

@@ -0,0 +1,7 @@
+import { DialogProps } from './index';
+import { ReactNode } from 'react';
+export declare type DialogAlertProps = Omit<DialogProps, 'visible' | 'closeOnAction' | 'actions'> & {
+    confirmText?: ReactNode;
+    onConfirm?: () => void | Promise<void>;
+};
+export declare function alert(p: DialogAlertProps): Promise<void>;

package/es/components/dialog/alert.js

@@ -0,0 +1,25 @@
+import { show } from './show';
+import { mergeProps } from '../../utils/with-default-props';
+import { getDefaultConfig } from '../config-provider';
+export function alert(p) {
+  const defaultProps = {
+    confirmText: getDefaultConfig().locale.Dialog.ok
+  };
+  const props = mergeProps(defaultProps, p);
+  return new Promise(resolve => {
+    show(Object.assign(Object.assign({}, props), {
+      closeOnAction: true,
+      actions: [{
+        key: 'confirm',
+        text: props.confirmText
+      }],
+      onAction: props.onConfirm,
+      onClose: () => {
+        var _a;
+
+        (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
+        resolve();
+      }
+    }));
+  });
+}

package/es/components/dialog/clear.d.ts

@@ -0,0 +1 @@
+export declare function clear(): void;

package/es/components/dialog/clear.js

@@ -0,0 +1,6 @@
+import { closeFnSet } from './show';
+export function clear() {
+  closeFnSet.forEach(close => {
+    close();
+  });
+}

package/es/components/dialog/confirm.d.ts

@@ -0,0 +1,9 @@
+import { DialogProps } from './index';
+import { ReactNode } from 'react';
+export declare type DialogConfirmProps = Omit<DialogProps, 'visible' | 'closeOnAction' | 'actions'> & {
+    confirmText?: ReactNode;
+    cancelText?: ReactNode;
+    onConfirm?: () => void | Promise<void>;
+    onCancel?: () => void | Promise<void>;
+};
+export declare function confirm(p: DialogConfirmProps): Promise<boolean>;

package/es/components/dialog/confirm.js

@@ -0,0 +1,48 @@
+import { __awaiter } from "tslib";
+import { show } from './show';
+import { mergeProps } from '../../utils/with-default-props';
+import { getDefaultConfig } from '../config-provider';
+const defaultProps = {
+  confirmText: '确认',
+  cancelText: '取消'
+};
+export function confirm(p) {
+  const {
+    locale
+  } = getDefaultConfig();
+  const props = mergeProps(defaultProps, {
+    confirmText: locale.common.confirm,
+    cancelText: locale.common.cancel
+  }, p);
+  return new Promise(resolve => {
+    show(Object.assign(Object.assign({}, props), {
+      closeOnAction: true,
+      onClose: () => {
+        var _a;
+
+        (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
+        resolve(false);
+      },
+      actions: [[{
+        key: 'cancel',
+        text: props.cancelText,
+        onClick: () => __awaiter(this, void 0, void 0, function* () {
+          var _a;
+
+          yield (_a = props.onCancel) === null || _a === void 0 ? void 0 : _a.call(props);
+          resolve(false);
+        })
+      }, {
+        key: 'confirm',
+        text: props.confirmText,
+        bold: true,
+        onClick: () => __awaiter(this, void 0, void 0, function* () {
+          var _b;
+
+          yield (_b = props.onConfirm) === null || _b === void 0 ? void 0 : _b.call(props);
+          resolve(true);
+        })
+      }]]
+    }));
+  });
+}

package/es/components/dialog/dialog-action-button.d.ts

@@ -0,0 +1,14 @@
+import { FC } from 'react';
+import { NativeProps } from '../../utils/native-props';
+export declare type Action = {
+    key: string | number;
+    text: string;
+    disabled?: boolean;
+    danger?: boolean;
+    bold?: boolean;
+    onClick?: () => void | Promise<void>;
+} & NativeProps;
+export declare const DialogActionButton: FC<{
+    action: Action;
+    onAction: () => void | Promise<void>;
+}>;

package/es/components/dialog/dialog-action-button.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import classNames from 'classnames';
+import Button from '../button';
+import { withNativeProps } from '../../utils/native-props';
+export const DialogActionButton = props => {
+  const {
+    action
+  } = props;
+  return withNativeProps(props.action, React.createElement(Button, {
+    key: action.key,
+    onClick: props.onAction,
+    className: classNames('adm-dialog-button', {
+      'adm-dialog-button-bold': action.bold
+    }),
+    fill: 'none',
+    shape: 'rectangular',
+    block: true,
+    color: action.danger ? 'danger' : 'primary',
+    loading: 'auto',
+    disabled: action.disabled
+  }, action.text));
+};

package/es/components/dialog/dialog.css

@@ -0,0 +1,81 @@
+.adm-dialog {
+  --z-index: var(--adm-dialog-z-index, 1000);
+  ---z-index: var(--z-index);
+}
+.adm-dialog .adm-center-popup {
+  --z-index: var(---z-index);
+}
+.adm-dialog-body {
+  width: 100%;
+  max-height: 70vh;
+  font-size: var(--adm-font-size-6);
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+}
+.adm-dialog-body > * {
+  flex: none;
+}
+.adm-dialog-body > .adm-dialog-content {
+  flex: auto;
+}
+.adm-dialog-body:not(.adm-dialog-with-image) {
+  padding-top: 20px;
+}
+.adm-dialog-image-container {
+  margin-bottom: 12px;
+  max-height: 40vh;
+}
+.adm-dialog-header {
+  margin-bottom: 8px;
+  padding: 0 12px;
+}
+.adm-dialog-title {
+  margin-bottom: 8px;
+  padding: 0 12px;
+  font-weight: bold;
+  font-size: var(--adm-font-size-10);
+  line-height: 25px;
+  text-align: center;
+}
+.adm-dialog-content {
+  padding: 0 12px 20px;
+  max-height: 70vh;
+  overflow-x: hidden;
+  overflow-y: auto;
+  font-size: var(--adm-font-size-7);
+  line-height: 1.4;
+  color: var(--adm-color-text);
+}
+.adm-dialog-content-empty {
+  padding: 0;
+  height: 12px;
+}
+.adm-dialog-footer {
+  -webkit-user-select: none;
+          user-select: none;
+}
+.adm-dialog-footer .adm-dialog-action-row {
+  display: flex;
+  align-items: stretch;
+  border-top: 0.5px solid var(--adm-color-border);
+}
+.adm-dialog-footer .adm-dialog-action-row > * {
+  flex: 1;
+}
+.adm-dialog-footer .adm-dialog-action-row > .adm-dialog-button {
+  padding: 10px;
+  font-size: var(--adm-font-size-10);
+  line-height: 25px;
+  border-radius: 0;
+  border-right: solid 0.5px var(--adm-color-border);
+}
+.adm-dialog-footer .adm-dialog-action-row > .adm-dialog-button-bold {
+  font-weight: bold;
+}
+.adm-dialog-footer .adm-dialog-action-row > .adm-dialog-button:last-child {
+  border-right: none;
+}
+.adm-dialog-image-container {
+  overflow-y: auto;
+}

package/es/components/dialog/dialog.d.ts

@@ -0,0 +1,16 @@
+import { FC, ReactNode } from 'react';
+import { Action } from './dialog-action-button';
+import { NativeProps } from '../../utils/native-props';
+import { CenterPopupProps } from '../center-popup';
+export declare type DialogProps = Pick<CenterPopupProps, 'afterClose' | 'afterShow' | 'bodyClassName' | 'bodyStyle' | 'destroyOnClose' | 'disableBodyScroll' | 'forceRender' | 'getContainer' | 'maskClassName' | 'maskStyle' | 'stopPropagation' | 'visible'> & {
+    image?: string;
+    header?: ReactNode;
+    title?: ReactNode;
+    content?: ReactNode;
+    actions?: (Action | Action[])[];
+    onAction?: (action: Action, index: number) => void | Promise<void>;
+    onClose?: () => void;
+    closeOnAction?: boolean;
+    closeOnMaskClick?: boolean;
+} & NativeProps;
+export declare const Dialog: FC<DialogProps>;

package/es/components/dialog/dialog.js

@@ -0,0 +1,77 @@
+import { __awaiter } from "tslib";
+import React from 'react';
+import { mergeProps } from '../../utils/with-default-props';
+import classNames from 'classnames';
+import { DialogActionButton } from './dialog-action-button';
+import Image from '../image';
+import AutoCenter from '../auto-center';
+import CenterPopup from '../center-popup';
+const defaultProps = {
+  actions: [],
+  closeOnAction: false,
+  closeOnMaskClick: false,
+  getContainer: null
+};
+export const Dialog = p => {
+  const props = mergeProps(defaultProps, p);
+  const element = React.createElement(React.Fragment, null, !!props.image && React.createElement("div", {
+    className: cls('image-container')
+  }, React.createElement(Image, {
+    src: props.image,
+    alt: 'dialog header image',
+    width: '100%'
+  })), !!props.header && React.createElement("div", {
+    className: cls('header')
+  }, React.createElement(AutoCenter, null, props.header)), !!props.title && React.createElement("div", {
+    className: cls('title')
+  }, props.title), React.createElement("div", {
+    className: classNames(cls('content'), !props.content && cls('content-empty'))
+  }, typeof props.content === 'string' ? React.createElement(AutoCenter, null, props.content) : props.content), React.createElement("div", {
+    className: cls('footer')
+  }, props.actions.map((row, index) => {
+    const actions = Array.isArray(row) ? row : [row];
+    return React.createElement("div", {
+      className: cls('action-row'),
+      key: index
+    }, actions.map((action, index) => React.createElement(DialogActionButton, {
+      key: action.key,
+      action: action,
+      onAction: () => __awaiter(void 0, void 0, void 0, function* () {
+        var _a, _b, _c;
+
+        yield Promise.all([(_a = action.onClick) === null || _a === void 0 ? void 0 : _a.call(action), (_b = props.onAction) === null || _b === void 0 ? void 0 : _b.call(props, action, index)]);
+
+        if (props.closeOnAction) {
+          (_c = props.onClose) === null || _c === void 0 ? void 0 : _c.call(props);
+        }
+      })
+    })));
+  })));
+  return React.createElement(CenterPopup, {
+    className: classNames(cls(), props.className),
+    style: props.style,
+    afterClose: props.afterClose,
+    afterShow: props.afterShow,
+    onMaskClick: props.closeOnMaskClick ? () => {
+      var _a;
+
+      (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
+    } : undefined,
+    visible: props.visible,
+    getContainer: props.getContainer,
+    bodyStyle: props.bodyStyle,
+    bodyClassName: classNames(cls('body'), props.image && cls('with-image'), props.bodyClassName),
+    maskStyle: props.maskStyle,
+    maskClassName: props.maskClassName,
+    stopPropagation: props.stopPropagation,
+    disableBodyScroll: props.disableBodyScroll,
+    destroyOnClose: props.destroyOnClose,
+    forceRender: props.forceRender,
+    role: 'dialog',
+    "aria-label": props['aria-label']
+  }, element);
+};
+
+function cls(name = '') {
+  return 'adm-dialog' + (name && '-') + name;
+}

package/es/components/dialog/index.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="react" />
+import './dialog.less';
+import { show } from './show';
+import { alert } from './alert';
+import { confirm } from './confirm';
+import { clear } from './clear';
+export type { DialogProps } from './dialog';
+export type { Action } from './dialog-action-button';
+export type { DialogShowProps, DialogShowHandler } from './show';
+export type { DialogAlertProps } from './alert';
+export type { DialogConfirmProps } from './confirm';
+declare const _default: import("react").FC<import("./dialog").DialogProps> & {
+    show: typeof show;
+    alert: typeof alert;
+    confirm: typeof confirm;
+    clear: typeof clear;
+};
+export default _default;

package/es/components/dialog/index.js

@@ -0,0 +1,13 @@
+import "./dialog.css";
+import { show } from './show';
+import { alert } from './alert';
+import { confirm } from './confirm';
+import { clear } from './clear';
+import { attachPropertiesToComponent } from '../../utils/attach-properties-to-component';
+import { Dialog } from './dialog';
+export default attachPropertiesToComponent(Dialog, {
+  show,
+  alert,
+  confirm,
+  clear
+});

package/es/components/dialog/show.d.ts

@@ -0,0 +1,7 @@
+import { DialogProps } from './dialog';
+export declare type DialogShowProps = Omit<DialogProps, 'visible'>;
+export declare type DialogShowHandler = {
+    close: () => void;
+};
+export declare const closeFnSet: Set<() => void>;
+export declare function show(props: DialogShowProps): DialogShowHandler;

package/es/components/dialog/show.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import { Dialog } from './dialog';
+import { renderImperatively } from '../../utils/render-imperatively';
+export const closeFnSet = new Set();
+export function show(props) {
+  const handler = renderImperatively(React.createElement(Dialog, Object.assign({}, props, {
+    afterClose: () => {
+      var _a;
+
+      closeFnSet.delete(handler.close);
+      (_a = props.afterClose) === null || _a === void 0 ? void 0 : _a.call(props);
+    }
+  })));
+  closeFnSet.add(handler.close);
+  return handler;
+}

package/es/components/divider/divider.css

@@ -0,0 +1,39 @@
+.adm-divider-horizontal {
+  display: flex;
+  align-items: center;
+  margin: 16px 0;
+  border-width: 0;
+  border-color: var(--adm-color-border);
+  border-style: solid;
+  color: var(--adm-color-weak);
+  font-size: 14px;
+}
+.adm-divider-left.adm-divider-horizontal::before {
+  max-width: 10%;
+}
+.adm-divider-right.adm-divider-horizontal::after {
+  max-width: 10%;
+}
+.adm-divider-horizontal::after,
+.adm-divider-horizontal::before {
+  flex: auto;
+  display: block;
+  content: '';
+  border-style: inherit;
+  border-color: inherit;
+  border-width: 1px 0 0;
+}
+.adm-divider-horizontal .adm-divider-content {
+  flex: none;
+  padding: 0 16px;
+}
+.adm-divider-vertical {
+  position: relative;
+  top: -0.06em;
+  display: inline-block;
+  height: 0.9em;
+  margin: 0 16px;
+  vertical-align: middle;
+  border-top: 0;
+  border-left: 1px solid var(--adm-color-border);
+}

package/es/components/divider/divider.d.ts

@@ -0,0 +1,8 @@
+import React, { FC } from 'react';
+import { NativeProps } from '../../utils/native-props';
+export declare type DividerProps = {
+    contentPosition?: 'left' | 'right' | 'center';
+    direction?: 'horizontal' | 'vertical';
+    children?: React.ReactNode;
+} & NativeProps;
+export declare const Divider: FC<DividerProps>;

package/es/components/divider/divider.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import classNames from 'classnames';
+import { withNativeProps } from '../../utils/native-props';
+import { mergeProps } from '../../utils/with-default-props';
+const classPrefix = `adm-divider`;
+const defaultProps = {
+  contentPosition: 'center',
+  direction: 'horizontal'
+};
+export const Divider = p => {
+  const props = mergeProps(defaultProps, p);
+  return withNativeProps(props, React.createElement("div", {
+    className: classNames(classPrefix, `${classPrefix}-${props.direction}`, `${classPrefix}-${props.contentPosition}`)
+  }, props.children && React.createElement("div", {
+    className: `${classPrefix}-content`
+  }, props.children)));
+};