@bifrostui/react 0.0.5

package/es/TextArea/TextArea.js

@@ -0,0 +1,150 @@
+var _excluded = ["className", "value", "defaultValue", "textareaProps", "textareaRef", "name", "placeholder", "disabled", "rows", "maxLength", "autoSize", "autoFocus", "showCount", "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 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 _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 _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 { isMini, useForkRef, useValue } from '@bifrostui/utils';
+import clsx from 'clsx';
+import React, { useEffect, useRef } from 'react';
+import "./TextArea.css";
+var prefixCls = 'bui-textarea';
+var DEFAULT_ROWS = 2;
+var TextArea = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var className = props.className,
+    value = props.value,
+    defaultValue = props.defaultValue,
+    textareaProps = props.textareaProps,
+    textareaRef = props.textareaRef,
+    name = props.name,
+    placeholder = props.placeholder,
+    disabled = props.disabled,
+    rows = props.rows,
+    maxLength = props.maxLength,
+    autoSize = props.autoSize,
+    autoFocus = props.autoFocus,
+    showCount = props.showCount,
+    onChange = props.onChange,
+    others = _objectWithoutProperties(props, _excluded);
+  var _useValue = useValue({
+      value: value,
+      defaultValue: defaultValue,
+      onChange: onChange
+    }),
+    _useValue2 = _slicedToArray(_useValue, 2),
+    textAreaValue = _useValue2[0],
+    triggerChange = _useValue2[1];
+  var initLock = useRef(false);
+  var internalRef = useRef(null);
+  var handleInputRef = useForkRef(internalRef, textareaRef);
+
+  // autoFocus
+  useEffect(function () {
+    if (autoFocus && internalRef.current) {
+      internalRef.current.focus();
+    }
+  }, [internalRef]);
+  var handleAutoHeight = function handleAutoHeight(height) {
+    if (_typeof(autoSize) === 'object') {
+      var maxHeight = autoSize.maxHeight,
+        minHeight = autoSize.minHeight;
+      if (maxHeight !== undefined) {
+        return Math.min(height, maxHeight);
+      }
+      if (minHeight !== undefined) {
+        return Math.max(height, minHeight);
+      }
+    }
+    return height;
+  };
+
+  // H5 autoSize
+  useEffect(function () {
+    if (!autoSize || isMini) return;
+    var textArea = internalRef.current;
+    if (!textArea) return;
+    textArea.style.height = 'auto';
+    var height = textArea.scrollHeight;
+    height = handleAutoHeight(height);
+    textArea.style.height = "".concat(height, "px");
+  }, [textAreaValue, autoSize]);
+
+  // miniprogram autoSize
+  var handleLineChange = function handleLineChange(e) {
+    if (!isMini) return;
+    var textArea = internalRef.current;
+    var _ref = (e === null || e === void 0 ? void 0 : e.detail) || {},
+      height = _ref.height,
+      lineCount = _ref.lineCount;
+    var line = lineCount <= 1 ? rows : lineCount;
+    // 总高度 = 行数 * 单行高度
+    var textAreaHeight = line * (height / lineCount + 4);
+    textAreaHeight = handleAutoHeight(textAreaHeight);
+    // autoSize=false也需要初始化小程序textarea高度
+    if (!initLock.current && !autoSize && rows === DEFAULT_ROWS) {
+      textArea.style.height = "".concat(textAreaHeight, "px");
+      initLock.current = true;
+      return;
+    }
+    if (autoSize) {
+      textArea.style.height = "".concat(textAreaHeight, "px");
+    }
+  };
+  var nativeProps = _defineProperty({}, isMini ? 'maxlength' : 'maxLength', maxLength !== null && maxLength !== void 0 ? maxLength : -1);
+  if (isMini) {
+    nativeProps = _objectSpread(_objectSpread({}, nativeProps), {}, {
+      onLineChange: handleLineChange,
+      placeholderClass: 'bui-mini-placeholder',
+      autoFocus: autoFocus,
+      focus: autoFocus
+    });
+  }
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: clsx(prefixCls, _defineProperty({}, "".concat(prefixCls, "-disabled"), disabled), className),
+    ref: ref
+  }, others), /*#__PURE__*/React.createElement("textarea", _extends({
+    ref: handleInputRef
+  }, nativeProps, {
+    name: name,
+    value: textAreaValue,
+    placeholder: placeholder,
+    disabled: disabled,
+    rows: rows
+  }, textareaProps, {
+    onChange: function onChange(e) {
+      var _textareaProps$onChan;
+      triggerChange(e, e.target.value);
+      textareaProps === null || textareaProps === void 0 || (_textareaProps$onChan = textareaProps.onChange) === null || _textareaProps$onChan === void 0 || _textareaProps$onChan.call(textareaProps, e);
+    },
+    onInput: function onInput(e) {
+      var _textareaProps$onInpu;
+      // 小程序中无onChange事件，通过onInput模拟
+      if (isMini) {
+        triggerChange(e, e.target.value);
+      }
+      textareaProps === null || textareaProps === void 0 || (_textareaProps$onInpu = textareaProps.onInput) === null || _textareaProps$onInpu === void 0 || _textareaProps$onInpu.call(textareaProps, e);
+    },
+    className: clsx("".concat(prefixCls, "-content"), textareaProps === null || textareaProps === void 0 ? void 0 : textareaProps.className)
+  })), showCount && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-count")
+  }, maxLength === undefined ? textAreaValue.length : "".concat(textAreaValue.length, "/").concat(maxLength)));
+});
+TextArea.displayName = 'BuiTextArea';
+TextArea.defaultProps = {
+  defaultValue: '',
+  rows: DEFAULT_ROWS,
+  autoSize: false,
+  autoFocus: false,
+  showCount: false
+};
+export default TextArea;

package/es/TextArea/TextArea.types.d.ts

@@ -0,0 +1,70 @@
+import { OverrideProps } from '@bifrostui/types';
+import React, { Ref, TextareaHTMLAttributes } from 'react';
+interface AutoSizeType {
+    minHeight?: number;
+    maxHeight?: number;
+}
+export type TextAreaProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
+    props: P & {
+        /**
+         * 输入框内容，受控时使用
+         */
+        value?: string;
+        /**
+         * 默认输入框内容，非受控时使用
+         */
+        defaultValue?: string;
+        /**
+         * 内部<textarea>标签的标准属性
+         */
+        textareaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;
+        /**
+         * 内部<textarea>标签的ref
+         */
+        textareaRef?: Ref<HTMLTextAreaElement>;
+        /**
+         * 内部<textarea>名称标识
+         */
+        name?: string;
+        /**
+         * 占位内容
+         */
+        placeholder?: string;
+        /**
+         * 是否禁用，默认为false
+         */
+        disabled?: boolean;
+        /**
+         * 文本框行数，默认为2
+         */
+        rows?: number;
+        /**
+         * 内容最大长度
+         */
+        maxLength?: number;
+        /**
+         * 自适应内容高度，可设置为 true | false 或对象：{
+         *     minHeight?: number;
+         *     maxHeight?: number;
+         *   }，单位为px，默认为false
+         * 支持H5、微信小程序，支付宝小程序不支持
+         */
+        autoSize?: boolean | AutoSizeType;
+        /**
+         * 是否自动聚焦，默认为false
+         */
+        autoFocus?: boolean;
+        /**
+         * 展示字数，默认为false
+         */
+        showCount?: boolean;
+        /**
+         * 文本框内容变化时的回调
+         */
+        onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>, data: {
+            value: string;
+        }) => void;
+    };
+    defaultComponent: D;
+}, D>;
+export {};

package/es/TextArea/TextArea.types.js

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

package/es/TextArea/index.d.ts

@@ -0,0 +1,2 @@
+export { default, default as TextArea } from './TextArea';
+export * from './TextArea.types';

package/es/TextArea/index.js

@@ -0,0 +1,2 @@
+export { default, default as TextArea } from "./TextArea";
+export * from "./TextArea.types";

package/es/Transition/Transition.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TransitionProps } from './Transition.types';
+export declare const Transition: React.ForwardRefExoticComponent<TransitionProps & React.RefAttributes<HTMLElement>>;
+export default Transition;

package/es/Transition/Transition.js

@@ -0,0 +1,12 @@
+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); }
+import React from 'react';
+import TransitionCore from "./TransitionCore";
+export var Transition = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  // rtl need set nextTick
+  return /*#__PURE__*/React.createElement(TransitionCore, _extends({}, props, {
+    ref: ref,
+    nextTick: setTimeout
+  }));
+});
+Transition.displayName = 'BuiTransition';
+export default Transition;

package/es/Transition/Transition.miniapp.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TransitionProps } from './Transition.types';
+export declare const Transition: React.ForwardRefExoticComponent<TransitionProps & React.RefAttributes<HTMLElement>>;
+export default Transition;

package/es/Transition/Transition.miniapp.js

@@ -0,0 +1,12 @@
+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); }
+import Taro from '@tarojs/taro';
+import React from 'react';
+import TransitionCore from "./TransitionCore";
+export var Transition = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  return /*#__PURE__*/React.createElement(TransitionCore, _extends({}, props, {
+    nextTick: Taro.nextTick,
+    ref: ref
+  }));
+});
+Transition.displayName = 'BuiTransition';
+export default Transition;

package/es/Transition/Transition.types.d.ts

@@ -0,0 +1,100 @@
+import React, { ReactElement } from 'react';
+type EnterHandler = (node?: HTMLElement) => void;
+type ExitHandler = (node?: HTMLElement) => void;
+interface TransitionActions {
+    /**
+     * Normally a component is not transitioned if it is shown when the
+     * `<Transition>` component mounts. If you want to transition on the first
+     * mount set  appear to true, and the component will transition in as soon
+     * as the `<Transition>` mounts. Note: there are no specific "appear" states.
+     * appear only adds an additional enter transition.
+     */
+    appear?: boolean | undefined;
+    /**
+     * Enable or disable enter transitions.
+     */
+    enter?: boolean | undefined;
+    /**
+     * Enable or disable exit transitions.
+     */
+    exit?: boolean | undefined;
+}
+export type TransitionStatus = 'unmounted' | 'exited' | 'entering' | 'entered' | 'exiting';
+export type TransitionChildren = ReactElement | ((status: TransitionStatus, childProps?: Record<string, unknown>) => ReactElement);
+export interface TransitionCoreProps extends TransitionActions, Omit<React.HTMLAttributes<ReactElement>, 'children'> {
+    /**
+     * Show the component; triggers the enter or exit states
+     */
+    in?: boolean | undefined;
+    /**
+     * By default the child component is mounted immediately along with the
+     * parent Transition component. If you want to "lazy mount" the component on
+     * the first `in={true}` you can set `mountOnEnter`. After the first enter
+     * transition the component will stay mounted, even on "exited", unless you
+     * also specify `unmountOnExit`.
+     */
+    mountOnEnter?: boolean | undefined;
+    /**
+     * By default the child component stays mounted after it reaches the
+     * 'exited' state. Set `unmountOnExit` if you'd prefer to unmount the
+     * component after it finishes exiting.
+     */
+    unmountOnExit?: boolean | undefined;
+    /**
+     * Callback fired before the "entering" status is applied. An extra
+     * parameter `isAppearing` is supplied to indicate if the enter stage is
+     * occurring on the initial mount
+     */
+    onEnter?: EnterHandler | undefined;
+    /**
+     * Callback fired after the "entering" status is applied. An extra parameter
+     * isAppearing is supplied to indicate if the enter stage is occurring on
+     * the initial mount
+     */
+    onEntering?: EnterHandler | undefined;
+    /**
+     * Callback fired after the "entered" status is applied. An extra parameter
+     * isAppearing is supplied to indicate if the enter stage is occurring on
+     * the initial mount
+     */
+    onEntered?: EnterHandler | undefined;
+    /**
+     * Callback fired before the "exiting" status is applied.
+     */
+    onExit?: ExitHandler | undefined;
+    /**
+     * Callback fired after the "exiting" status is applied.
+     */
+    onExiting?: ExitHandler | undefined;
+    /**
+     * Callback fired after the "exited" status is applied.
+     */
+    onExited?: ExitHandler | undefined;
+    /**
+     * A function child can be used instead of a React element. This function is
+     * called with the current transition status ('entering', 'entered',
+     * 'exiting',  'exited', 'unmounted'), which can be used to apply context
+     * specific props to a component.
+     * ```jsx
+     *    <Transition in={this.state.in} timeout={150}>
+     *        {state => (
+     *            <MyComponent className={`fade fade-${state}`} />
+     *        )}
+     *    </Transition>
+     * ```
+     */
+    children?: TransitionChildren | undefined;
+    delay?: number | {
+        appear?: number | undefined;
+        enter?: number | undefined;
+        exit?: number | undefined;
+    } | undefined;
+    timeout?: number | {
+        appear?: number | undefined;
+        enter?: number | undefined;
+        exit?: number | undefined;
+    } | undefined;
+    nextTick?: typeof setTimeout | ((callback?: any) => void);
+}
+export type TransitionProps = Omit<TransitionCoreProps, 'nextTick'>;
+export {};

package/es/Transition/Transition.types.js

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

package/es/Transition/TransitionCore.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TransitionCoreProps } from './Transition.types';
+declare const TransitionCore: React.ForwardRefExoticComponent<TransitionCoreProps & React.RefAttributes<HTMLElement>>;
+export default TransitionCore;