@bifrostui/react 0.0.5

package/dist/Tag/Tag.types.d.ts

@@ -0,0 +1,23 @@
+import { OverrideProps, ThemeColor } from '@bifrostui/types';
+import React from 'react';
+export type TagProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
+    props: P & {
+        /**
+         * 预定义色彩
+         * @default 'default'
+         */
+        color?: ThemeColor | 'default' | 'vip';
+        /**
+         * 自定义色彩
+         */
+        htmlColor?: string;
+        /**
+         * - outlined: 描边
+         * - contained: 实心填充
+         * - light: 浅亮填充
+         * @default 'outlined'
+         */
+        variant?: 'outlined' | 'contained' | 'light';
+    };
+    defaultComponent: D;
+}, D>;

package/dist/Tag/Tag.types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/Tag/TagGroup.css

@@ -0,0 +1,16 @@
+.bui-tag-group {
+  display: inline-flex;
+  font-family: var(--bui-font-family);
+}
+.bui-tag-group .bui-tag {
+  margin: 0 0 0 -1px;
+}
+.bui-tag-group .bui-tag:not(:last-child) {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.bui-tag-group .bui-tag:not(:first-child) {
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+  border-left: 0;
+}

package/dist/Tag/TagGroup.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { TagGroupProps } from './TagGroup.types';
+import './TagGroup.less';
+declare const Tag: React.ForwardRefExoticComponent<Omit<TagGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export default Tag;

package/dist/Tag/TagGroup.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _clsx = _interopRequireDefault(require("clsx"));
+var _react = _interopRequireDefault(require("react"));
+require("./TagGroup.css");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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); }
+const prefixCls = 'bui-tag-group';
+const Tag = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const {
+    className,
+    onClick,
+    children,
+    ...others
+  } = props;
+  return /*#__PURE__*/_react.default.createElement("div", _extends({
+    ref: ref,
+    onClick: onClick,
+    className: (0, _clsx.default)(prefixCls, className)
+  }, others), children);
+});
+Tag.displayName = 'BuiTagGroup';
+var _default = exports.default = Tag;

package/dist/Tag/TagGroup.types.d.ts

@@ -0,0 +1,6 @@
+import { OverrideProps } from '@bifrostui/types';
+import React from 'react';
+export type TagGroupProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
+    props: P;
+    defaultComponent: D;
+}, D>;

package/dist/Tag/TagGroup.types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/Tag/index.d.ts

@@ -0,0 +1,5 @@
+import TagGroup from './TagGroup';
+export { default as Tag } from './Tag';
+export * from './Tag.types';
+export * from './TagGroup.types';
+export { TagGroup };

package/dist/Tag/index.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  TagGroup: true,
+  Tag: true
+};
+Object.defineProperty(exports, "Tag", {
+  enumerable: true,
+  get: function () {
+    return _Tag.default;
+  }
+});
+Object.defineProperty(exports, "TagGroup", {
+  enumerable: true,
+  get: function () {
+    return _TagGroup.default;
+  }
+});
+var _TagGroup = _interopRequireDefault(require("./TagGroup"));
+var _Tag = _interopRequireDefault(require("./Tag"));
+var _Tag2 = require("./Tag.types");
+Object.keys(_Tag2).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Tag2[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Tag2[key];
+    }
+  });
+});
+var _TagGroup2 = require("./TagGroup.types");
+Object.keys(_TagGroup2).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _TagGroup2[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _TagGroup2[key];
+    }
+  });
+});
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/TextArea/TextArea.css

@@ -0,0 +1,43 @@
+.bui-textarea {
+  --bg-color: var(--bui-color-bg-default);
+  --text-color: var(--bui-color-fg-subtle);
+  --count-bg-color: var(--bg-color, var(--bui-color-bg-default));
+  --count-text-color: var(--bui-color-fg-subtle);
+  background: var(--bui-color-bg-default);
+  font-family: var(--bui-font-family);
+}
+.bui-textarea textarea {
+  font-size: var(--bui-text-size-2);
+  color: var(--text-color);
+  line-height: var(--bui-line-height);
+}
+.bui-textarea .bui-mini-placeholder {
+  color: var(--bui-color-fg-disabled);
+}
+.bui-textarea-disabled {
+  pointer-events: none;
+}
+.bui-textarea .a-textarea-count-wrap {
+  display: none;
+}
+.bui-textarea-content {
+  width: 100%;
+  resize: none;
+  background: var(--bg-color);
+  padding: 8px;
+  border: none;
+  outline: none;
+  word-break: break-all;
+  box-sizing: border-box;
+}
+.bui-textarea-content::placeholder {
+  color: var(--bui-color-fg-disabled);
+  line-height: 1.3;
+}
+.bui-textarea-count {
+  background: var(--count-bg-color);
+  color: var(--count-text-color);
+  text-align: right;
+  padding: 0 4px;
+  font-size: var(--bui-title-size-3);
+}

package/dist/TextArea/TextArea.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { TextAreaProps } from './TextArea.types';
+import './TextArea.less';
+declare const TextArea: React.ForwardRefExoticComponent<Omit<TextAreaProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export default TextArea;

package/dist/TextArea/TextArea.js

@@ -0,0 +1,149 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _utils = require("@bifrostui/utils");
+var _clsx = _interopRequireDefault(require("clsx"));
+var _react = _interopRequireWildcard(require("react"));
+require("./TextArea.css");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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); }
+const prefixCls = 'bui-textarea';
+const DEFAULT_ROWS = 2;
+const TextArea = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const {
+    className,
+    value,
+    defaultValue,
+    textareaProps,
+    textareaRef,
+    name,
+    placeholder,
+    disabled,
+    rows,
+    maxLength,
+    autoSize,
+    autoFocus,
+    showCount,
+    onChange,
+    ...others
+  } = props;
+  const [textAreaValue, triggerChange] = (0, _utils.useValue)({
+    value,
+    defaultValue,
+    onChange
+  });
+  const initLock = (0, _react.useRef)(false);
+  const internalRef = (0, _react.useRef)(null);
+  const handleInputRef = (0, _utils.useForkRef)(internalRef, textareaRef);
+
+  // autoFocus
+  (0, _react.useEffect)(() => {
+    if (autoFocus && internalRef.current) {
+      internalRef.current.focus();
+    }
+  }, [internalRef]);
+  const handleAutoHeight = height => {
+    if (typeof autoSize === 'object') {
+      const {
+        maxHeight,
+        minHeight
+      } = autoSize;
+      if (maxHeight !== undefined) {
+        return Math.min(height, maxHeight);
+      }
+      if (minHeight !== undefined) {
+        return Math.max(height, minHeight);
+      }
+    }
+    return height;
+  };
+
+  // H5 autoSize
+  (0, _react.useEffect)(() => {
+    if (!autoSize || _utils.isMini) return;
+    const textArea = internalRef.current;
+    if (!textArea) return;
+    textArea.style.height = 'auto';
+    let height = textArea.scrollHeight;
+    height = handleAutoHeight(height);
+    textArea.style.height = `${height}px`;
+  }, [textAreaValue, autoSize]);
+
+  // miniprogram autoSize
+  const handleLineChange = e => {
+    if (!_utils.isMini) return;
+    const textArea = internalRef.current;
+    const {
+      height,
+      lineCount
+    } = e?.detail || {};
+    const line = lineCount <= 1 ? rows : lineCount;
+    // 总高度 = 行数 * 单行高度
+    let textAreaHeight = line * (height / lineCount + 4);
+    textAreaHeight = handleAutoHeight(textAreaHeight);
+    // autoSize=false也需要初始化小程序textarea高度
+    if (!initLock.current && !autoSize && rows === DEFAULT_ROWS) {
+      textArea.style.height = `${textAreaHeight}px`;
+      initLock.current = true;
+      return;
+    }
+    if (autoSize) {
+      textArea.style.height = `${textAreaHeight}px`;
+    }
+  };
+  let nativeProps = {
+    [_utils.isMini ? 'maxlength' : 'maxLength']: maxLength ?? -1
+  };
+  if (_utils.isMini) {
+    nativeProps = {
+      ...nativeProps,
+      onLineChange: handleLineChange,
+      placeholderClass: 'bui-mini-placeholder',
+      autoFocus,
+      focus: autoFocus
+    };
+  }
+  return /*#__PURE__*/_react.default.createElement("div", _extends({
+    className: (0, _clsx.default)(prefixCls, {
+      [`${prefixCls}-disabled`]: disabled
+    }, className),
+    ref: ref
+  }, others), /*#__PURE__*/_react.default.createElement("textarea", _extends({
+    ref: handleInputRef
+  }, nativeProps, {
+    name: name,
+    value: textAreaValue,
+    placeholder: placeholder,
+    disabled: disabled,
+    rows: rows
+  }, textareaProps, {
+    onChange: e => {
+      triggerChange(e, e.target.value);
+      textareaProps?.onChange?.(e);
+    },
+    onInput: e => {
+      // 小程序中无onChange事件，通过onInput模拟
+      if (_utils.isMini) {
+        triggerChange(e, e.target.value);
+      }
+      textareaProps?.onInput?.(e);
+    },
+    className: (0, _clsx.default)(`${prefixCls}-content`, textareaProps?.className)
+  })), showCount && /*#__PURE__*/_react.default.createElement("div", {
+    className: `${prefixCls}-count`
+  }, maxLength === undefined ? textAreaValue.length : `${textAreaValue.length}/${maxLength}`));
+});
+TextArea.displayName = 'BuiTextArea';
+TextArea.defaultProps = {
+  defaultValue: '',
+  rows: DEFAULT_ROWS,
+  autoSize: false,
+  autoFocus: false,
+  showCount: false
+};
+var _default = exports.default = TextArea;

package/dist/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/dist/TextArea/TextArea.types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/TextArea/index.d.ts

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

package/dist/TextArea/index.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  TextArea: true
+};
+Object.defineProperty(exports, "TextArea", {
+  enumerable: true,
+  get: function () {
+    return _TextArea.default;
+  }
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _TextArea.default;
+  }
+});
+var _TextArea = _interopRequireDefault(require("./TextArea"));
+var _TextArea2 = require("./TextArea.types");
+Object.keys(_TextArea2).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _TextArea2[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _TextArea2[key];
+    }
+  });
+});
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/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/dist/Transition/Transition.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Transition = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _TransitionCore = _interopRequireDefault(require("./TransitionCore"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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); }
+const Transition = exports.Transition = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  // rtl need set nextTick
+  return /*#__PURE__*/_react.default.createElement(_TransitionCore.default, _extends({}, props, {
+    ref: ref,
+    nextTick: setTimeout
+  }));
+});
+Transition.displayName = 'BuiTransition';
+var _default = exports.default = Transition;

package/dist/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/dist/Transition/Transition.miniapp.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Transition = void 0;
+var _taro = _interopRequireDefault(require("@tarojs/taro"));
+var _react = _interopRequireDefault(require("react"));
+var _TransitionCore = _interopRequireDefault(require("./TransitionCore"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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); }
+const Transition = exports.Transition = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  return /*#__PURE__*/_react.default.createElement(_TransitionCore.default, _extends({}, props, {
+    nextTick: _taro.default.nextTick,
+    ref: ref
+  }));
+});
+Transition.displayName = 'BuiTransition';
+var _default = exports.default = Transition;

package/dist/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/dist/Transition/Transition.types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/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;