antd-mobile 5.0.0-beta.9 → 5.0.0-rc.3

package/2x/cjs/components/button/button.d.ts

@@ -9,8 +9,7 @@ export declare type ButtonProps = {
     loadingText?: string;
     disabled?: boolean;
     onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
-    className?: string;
-    style?: React.CSSProperties;
     type?: 'submit' | 'reset' | 'button';
+    shape?: 'default' | 'rounded' | 'rectangular';
 } & NativeProps<'--text-color' | '--background-color' | '--border-radius' | '--border-width' | '--border-style' | '--border-color'>;
 export declare const Button: FC<ButtonProps>;

package/2x/cjs/components/button/button.js

@@ -23,25 +23,26 @@ var defaultProps = {
   fill: 'solid',
   block: false,
   loading: false,
-  type: 'button'
+  type: 'button',
+  shape: 'default',
+  size: 'middle'
 };
 
 var Button = function Button(p) {
   var _classNames;
 
   var props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
-  var disabled = props.disabled;
+  var disabled = props.disabled || props.loading;
   return (0, _nativeProps.withNativeProps)(props, /*#__PURE__*/_react["default"].createElement("button", {
     type: props.type,
     onClick: props.onClick,
-    className: (0, _classnames["default"])(classPrefix, props.color ? classPrefix + "-" + props.color : null, (_classNames = {}, _classNames[classPrefix + "-block"] = props.block, _classNames[classPrefix + "-disabled"] = disabled, _classNames[classPrefix + "-fill-outline"] = props.fill === 'outline', _classNames[classPrefix + "-fill-none"] = props.fill === 'none', _classNames[classPrefix + "-mini"] = props.size === 'mini', _classNames[classPrefix + "-small"] = props.size === 'small', _classNames[classPrefix + "-large"] = props.size === 'large', _classNames[classPrefix + "-loading"] = props.loading, _classNames)),
+    className: (0, _classnames["default"])(classPrefix, props.color ? classPrefix + "-" + props.color : null, (_classNames = {}, _classNames[classPrefix + "-block"] = props.block, _classNames[classPrefix + "-disabled"] = disabled, _classNames[classPrefix + "-fill-outline"] = props.fill === 'outline', _classNames[classPrefix + "-fill-none"] = props.fill === 'none', _classNames[classPrefix + "-mini"] = props.size === 'mini', _classNames[classPrefix + "-small"] = props.size === 'small', _classNames[classPrefix + "-large"] = props.size === 'large', _classNames[classPrefix + "-loading"] = props.loading, _classNames), classPrefix + "-shape-" + props.shape),
     disabled: disabled
-  }, props.loading ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
+  }, props.loading ? /*#__PURE__*/_react["default"].createElement("div", {
     className: classPrefix + "-loading-wrapper"
   }, /*#__PURE__*/_react["default"].createElement(_loading["default"], {
-    color: 'currentColor',
-    size: props.size
-  }), props.loadingText)) : props.children));
+    color: 'currentColor'
+  }), props.loadingText) : props.children));
 };
 
 exports.Button = Button;

package/2x/cjs/components/capsule-tabs/capsule-tabs.css

@@ -0,0 +1,74 @@
+.adm-capsule-tabs {
+  position: relative;
+}
+
+.adm-capsule-tabs-header {
+  position: relative;
+  padding: 24px 12px;
+  border-bottom: solid 2px var(--adm-border-color);
+}
+
+.adm-capsule-tabs-tab-list {
+  display: flex;
+  flex-wrap: nowrap;
+  justify-content: flex-start;
+  align-items: center;
+  position: relative;
+  overflow-x: scroll;
+  scrollbar-width: none;
+}
+
+.adm-capsule-tabs-tab-list::-webkit-scrollbar {
+  display: none;
+}
+
+.adm-capsule-tabs-tab-wrapper {
+  flex: auto;
+  padding: 0 12px;
+}
+
+.adm-capsule-tabs-tab {
+  position: relative;
+  padding: 16px 40px;
+  margin: 0 auto;
+  border-radius: 40px;
+  cursor: pointer;
+  font-size: var(--adm-font-size-main);
+  text-align: center;
+  white-space: nowrap;
+  background-color: #f5f5f5;
+}
+
+.adm-capsule-tabs-tab-active {
+  color: #fff;
+  background-color: var(--adm-color-primary);
+}
+
+.adm-capsule-tabs-tab-disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.adm-capsule-tabs-content {
+  padding: 24px;
+}
+
+.adm-capsule-tabs-header-mask {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  z-index: 1;
+  width: 60px;
+  height: 100%;
+  pointer-events: none;
+}
+
+.adm-capsule-tabs-header-mask-left {
+  left: 0;
+  background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));
+}
+
+.adm-capsule-tabs-header-mask-right {
+  right: 0;
+  background: linear-gradient(to left, #fff, rgba(255, 255, 255, 0));
+}

package/2x/cjs/components/capsule-tabs/capsule-tabs.d.ts

@@ -0,0 +1,14 @@
+import { FC, ReactNode } from 'react';
+import { NativeProps } from '../../utils/native-props';
+export declare type CapsuleTabProps = {
+    title: ReactNode;
+    disabled?: boolean;
+    forceRender?: boolean;
+} & NativeProps;
+export declare const CapsuleTab: FC<CapsuleTabProps>;
+export declare type CapsuleTabsProps = {
+    activeKey?: string | null;
+    defaultActiveKey?: string | null;
+    onChange?: (key: string) => void;
+} & NativeProps;
+export declare const CapsuleTabs: FC<CapsuleTabsProps>;

package/2x/cjs/components/capsule-tabs/capsule-tabs.js

@@ -0,0 +1,130 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CapsuleTabs = exports.CapsuleTab = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _web = require("@react-spring/web");
+
+var _nativeProps = require("../../utils/native-props");
+
+var _usePropsValue2 = require("../../utils/use-props-value");
+
+var _useResizeEffect = require("../../utils/use-resize-effect");
+
+var _useTabListScroll2 = require("../../utils/use-tab-list-scroll");
+
+var _scrollMask = _interopRequireDefault(require("../scroll-mask"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var classPrefix = "adm-capsule-tabs";
+
+var CapsuleTab = function CapsuleTab() {
+  return null;
+};
+
+exports.CapsuleTab = CapsuleTab;
+
+var CapsuleTabs = function CapsuleTabs(props) {
+  var _a;
+
+  var tabListContainerRef = (0, _react.useRef)(null);
+  var rootRef = (0, _react.useRef)(null);
+  var keyToIndexRecord = {};
+  var firstActiveKey = null;
+  var panes = [];
+
+  _react["default"].Children.forEach(props.children, function (child, index) {
+    if (! /*#__PURE__*/_react["default"].isValidElement(child)) return;
+    var key = child.key;
+    if (typeof key !== 'string') return;
+
+    if (index === 0) {
+      firstActiveKey = key;
+    }
+
+    var length = panes.push(child);
+    keyToIndexRecord[key] = length - 1;
+  });
+
+  var _usePropsValue = (0, _usePropsValue2.usePropsValue)({
+    value: props.activeKey,
+    defaultValue: (_a = props.defaultActiveKey) !== null && _a !== void 0 ? _a : firstActiveKey,
+    onChange: props.onChange
+  }),
+      activeKey = _usePropsValue[0],
+      setActiveKey = _usePropsValue[1];
+
+  var _useTabListScroll = (0, _useTabListScroll2.useTabListScroll)(tabListContainerRef, keyToIndexRecord[activeKey]),
+      scrollLeft = _useTabListScroll.scrollLeft,
+      animate = _useTabListScroll.animate;
+
+  (0, _useResizeEffect.useResizeEffect)(function () {
+    animate(true);
+  }, rootRef);
+  return (0, _nativeProps.withNativeProps)(props, /*#__PURE__*/_react["default"].createElement("div", {
+    className: classPrefix,
+    ref: rootRef
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: classPrefix + "-header"
+  }, /*#__PURE__*/_react["default"].createElement(_scrollMask["default"], {
+    scrollTrackRef: tabListContainerRef
+  }), /*#__PURE__*/_react["default"].createElement(_web.animated.div, {
+    className: classPrefix + "-tab-list",
+    ref: tabListContainerRef,
+    scrollLeft: scrollLeft
+  }, panes.map(function (pane) {
+    var _classNames;
+
+    return (0, _nativeProps.withNativeProps)(pane.props, /*#__PURE__*/_react["default"].createElement("div", {
+      key: pane.key,
+      className: classPrefix + "-tab-wrapper"
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      onClick: function onClick() {
+        var key = pane.key;
+        if (pane.props.disabled) return;
+
+        if (key === undefined || key === null) {
+          return;
+        }
+
+        setActiveKey(key.toString());
+      },
+      className: (0, _classnames["default"])(classPrefix + "-tab", (_classNames = {}, _classNames[classPrefix + "-tab-active"] = pane.key === activeKey, _classNames[classPrefix + "-tab-disabled"] = pane.props.disabled, _classNames))
+    }, pane.props.title)));
+  }))), panes.map(function (pane) {
+    if (pane.props.children === undefined) {
+      return null;
+    }
+
+    if (pane.key === activeKey) {
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        key: pane.key,
+        className: classPrefix + "-content"
+      }, pane.props.children);
+    }
+
+    if (pane.props.forceRender) {
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        key: pane.key,
+        style: {
+          display: 'none'
+        }
+      }, pane.props.children);
+    }
+
+    return null;
+  })));
+};
+
+exports.CapsuleTabs = CapsuleTabs;

package/2x/cjs/components/capsule-tabs/index.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import './capsule-tabs.less';
+export type { CapsuleTabsProps, CapsuleTabProps } from './capsule-tabs';
+declare const _default: import("react").FC<import("./capsule-tabs").CapsuleTabsProps> & {
+    Tab: import("react").FC<import("./capsule-tabs").CapsuleTabProps>;
+};
+export default _default;

package/2x/cjs/components/capsule-tabs/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+require("./capsule-tabs.css");
+
+var _capsuleTabs2 = require("./capsule-tabs");
+
+var _attachPropertiesToComponent = require("../../utils/attach-properties-to-component");
+
+var _default = (0, _attachPropertiesToComponent.attachPropertiesToComponent)(_capsuleTabs2.CapsuleTabs, {
+  Tab: _capsuleTabs2.CapsuleTab
+});
+
+exports["default"] = _default;

package/2x/cjs/components/card/card.d.ts

@@ -1,11 +1,14 @@
-import { FC, ReactNode } from 'react';
-import React from 'react';
+import React, { FC, ReactNode } from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type CardProps = {
     title?: ReactNode;
     extra?: ReactNode;
-    onClick?: (event: React.MouseEvent) => void;
-    onBodyClick?: (event: React.MouseEvent) => void;
-    onHeaderClick?: (event: React.MouseEvent) => void;
+    headerStyle?: React.CSSProperties;
+    headerClassName?: string;
+    bodyStyle?: React.CSSProperties;
+    bodyClassName?: string;
+    onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    onBodyClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    onHeaderClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
 } & NativeProps;
 export declare const Card: FC<CardProps>;

package/2x/cjs/components/card/card.js

@@ -22,7 +22,8 @@ var Card = function Card(props) {
     }
 
     return /*#__PURE__*/_react["default"].createElement("div", {
-      className: (0, _classnames["default"])(classPrefix + "-header"),
+      className: (0, _classnames["default"])(classPrefix + "-header", props.headerClassName),
+      style: props.headerStyle,
       onClick: props.onHeaderClick
     }, /*#__PURE__*/_react["default"].createElement("div", {
       className: classPrefix + "-header-title"
@@ -35,7 +36,8 @@ var Card = function Card(props) {
     }
 
     return /*#__PURE__*/_react["default"].createElement("div", {
-      className: classPrefix + "-body",
+      className: (0, _classnames["default"])(classPrefix + "-body", props.bodyClassName),
+      style: props.bodyStyle,
       onClick: props.onBodyClick
     }, props.children);
   };

package/2x/cjs/components/cascade-picker/cascade-picker-utils.d.ts

@@ -0,0 +1,3 @@
+import { PickerColumn } from '../picker-view';
+import { CascadePickerOption } from './cascade-picker';
+export declare function generateCascadePickerColumns(value: string[], options: CascadePickerOption[], depth: number, subOptionsRecord: Record<string, CascadePickerOption[]>): PickerColumn[];

package/2x/cjs/components/cascade-picker/cascade-picker-utils.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.generateCascadePickerColumns = generateCascadePickerColumns;
+
+function generateCascadePickerColumns(value, options, depth, subOptionsRecord) {
+  var columns = [];
+  columns.push(options.map(function (option) {
+    return {
+      label: option.label,
+      value: option.value
+    };
+  }));
+
+  for (var i = 0; i < depth - 1; i++) {
+    var x = value[i];
+    var subOptions = subOptionsRecord[x];
+
+    if (!subOptions) {
+      columns.push([]);
+    } else {
+      columns.push(subOptions.map(function (option) {
+        return {
+          label: option.label,
+          value: option.value
+        };
+      }));
+    }
+  }
+
+  return columns;
+}

package/2x/cjs/components/cascade-picker/cascade-picker.d.ts

@@ -0,0 +1,11 @@
+import { FC } from 'react';
+import type { PickerProps } from '../picker';
+export declare type CascadePickerOption = {
+    label: string;
+    value: string;
+    children?: CascadePickerOption[];
+};
+export declare type CascadePickerProps = Omit<PickerProps, 'columns'> & {
+    options: CascadePickerOption[];
+};
+export declare const CascadePicker: FC<CascadePickerProps>;

package/2x/cjs/components/cascade-picker/cascade-picker.js

@@ -0,0 +1,46 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CascadePicker = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _picker = _interopRequireDefault(require("../picker"));
+
+var _useCascadePickerOptions = require("./use-cascade-picker-options");
+
+var _cascadePickerUtils = require("./cascade-picker-utils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+var CascadePicker = function CascadePicker(props) {
+  var options = props.options,
+      pickerProps = __rest(props, ["options"]);
+
+  var _useCascadePickerOpti = (0, _useCascadePickerOptions.useCascadePickerOptions)(options),
+      depth = _useCascadePickerOpti.depth,
+      subOptionsRecord = _useCascadePickerOpti.subOptionsRecord;
+
+  return /*#__PURE__*/_react["default"].createElement(_picker["default"], Object.assign({}, pickerProps, {
+    columns: function columns(selected) {
+      return (0, _cascadePickerUtils.generateCascadePickerColumns)(selected, options, depth, subOptionsRecord);
+    }
+  }));
+};
+
+exports.CascadePicker = CascadePicker;

package/2x/cjs/components/cascade-picker/index.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { prompt } from './prompt';
+export type { CascadePickerProps, CascadePickerOption } from './cascade-picker';
+declare const _default: import("react").FC<import("./cascade-picker").CascadePickerProps> & {
+    prompt: typeof prompt;
+};
+export default _default;

package/2x/cjs/components/cascade-picker/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _attachPropertiesToComponent = require("../../utils/attach-properties-to-component");
+
+var _prompt = require("./prompt");
+
+var _cascadePicker = require("./cascade-picker");
+
+var _default = (0, _attachPropertiesToComponent.attachPropertiesToComponent)(_cascadePicker.CascadePicker, {
+  prompt: _prompt.prompt
+});
+
+exports["default"] = _default;

package/2x/cjs/components/cascade-picker/prompt.d.ts

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

package/2x/cjs/components/cascade-picker/prompt.js

@@ -0,0 +1,51 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.prompt = prompt;
+
+var _cascadePicker = require("./cascade-picker");
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _renderToBody = require("../../utils/render-to-body");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function prompt(props) {
+  return new Promise(function (resolve) {
+    var Wrapper = function Wrapper() {
+      var _useState = (0, _react.useState)(false),
+          visible = _useState[0],
+          setVisible = _useState[1];
+
+      (0, _react.useEffect)(function () {
+        setVisible(true);
+      }, []);
+      return /*#__PURE__*/_react["default"].createElement(_cascadePicker.CascadePicker, Object.assign({}, props, {
+        visible: visible,
+        onConfirm: function onConfirm(val) {
+          resolve(val);
+        },
+        onClose: function onClose() {
+          var _a;
+
+          (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
+          setVisible(false);
+          resolve(null);
+        },
+        afterClose: function afterClose() {
+          var _a;
+
+          (_a = props.afterClose) === null || _a === void 0 ? void 0 : _a.call(props);
+          unmount();
+        }
+      }));
+    };
+
+    var unmount = (0, _renderToBody.renderToBody)( /*#__PURE__*/_react["default"].createElement(Wrapper, null));
+  });
+}

package/2x/cjs/components/cascade-picker/use-cascade-picker-options.d.ts

@@ -0,0 +1,5 @@
+import { CascadePickerOption } from './cascade-picker';
+export declare function useCascadePickerOptions(options: CascadePickerOption[]): {
+    depth: number;
+    subOptionsRecord: Record<string, CascadePickerOption[]>;
+};

package/2x/cjs/components/cascade-picker/use-cascade-picker-options.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCascadePickerOptions = useCascadePickerOptions;
+
+var _react = require("react");
+
+function useCascadePickerOptions(options) {
+  return (0, _react.useMemo)(function () {
+    var depth = 1;
+    var subOptionsRecord = {};
+
+    function traverse(option, currentDepth) {
+      if (!option.children || option.children.length === 0) {
+        return;
+      }
+
+      subOptionsRecord[option.value] = option.children;
+      var nextDepth = currentDepth + 1;
+
+      if (nextDepth > depth) {
+        depth = nextDepth;
+      }
+
+      option.children.forEach(function (option) {
+        traverse(option, nextDepth);
+      });
+    }
+
+    options.forEach(function (option) {
+      traverse(option, 1);
+    });
+    return {
+      depth: depth,
+      subOptionsRecord: subOptionsRecord
+    };
+  }, [options]);
+}

package/2x/cjs/components/cascade-picker-view/cascade-picker-view.d.ts

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+import { NativeProps } from '../../utils/native-props';
+import type { PickerViewProps } from '../picker-view';
+import type { CascadePickerOption } from '../cascade-picker';
+export declare type CascadePickerViewProps = Omit<PickerViewProps, 'columns'> & {
+    options: CascadePickerOption[];
+} & NativeProps<'--height'>;
+export declare const CascadePickerView: FC<CascadePickerViewProps>;

package/2x/cjs/components/cascade-picker-view/cascade-picker-view.js

@@ -0,0 +1,46 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CascadePickerView = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _pickerView = _interopRequireDefault(require("../picker-view"));
+
+var _useCascadePickerOptions = require("../cascade-picker/use-cascade-picker-options");
+
+var _cascadePickerUtils = require("../cascade-picker/cascade-picker-utils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+var CascadePickerView = function CascadePickerView(props) {
+  var options = props.options,
+      pickerProps = __rest(props, ["options"]);
+
+  var _useCascadePickerOpti = (0, _useCascadePickerOptions.useCascadePickerOptions)(options),
+      depth = _useCascadePickerOpti.depth,
+      subOptionsRecord = _useCascadePickerOpti.subOptionsRecord;
+
+  return /*#__PURE__*/_react["default"].createElement(_pickerView["default"], Object.assign({}, pickerProps, {
+    columns: function columns(selected) {
+      return (0, _cascadePickerUtils.generateCascadePickerColumns)(selected, options, depth, subOptionsRecord);
+    }
+  }));
+};
+
+exports.CascadePickerView = CascadePickerView;

package/2x/cjs/components/cascade-picker-view/index.d.ts

@@ -0,0 +1,3 @@
+import { CascadePickerView } from './cascade-picker-view';
+export type { CascadePickerViewProps } from './cascade-picker-view';
+export default CascadePickerView;

package/2x/cjs/components/cascade-picker-view/index.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _cascadePickerView = require("./cascade-picker-view");
+
+var _default = _cascadePickerView.CascadePickerView;
+exports["default"] = _default;