@bifrostui/react 1.5.0 → 2.0.0-alpha.0

package/es/DesktopPicker/DesktopPicker.js

@@ -1,226 +0,0 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-var __async = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
-import clsx from "clsx";
-import React, {
-  useEffect,
-  useMemo,
-  useRef,
-  useState
-} from "react";
-import {
-  getStylesAndLocation,
-  isMini,
-  getRootContainer,
-  useDidMountEffect
-} from "@bifrostui/utils";
-import Backdrop from "../Backdrop";
-import Portal from "../Portal";
-import calcAfterMounted from "./utils/calcAfterMounted";
-import "./index.css";
-const prefixCls = "bui-desktop-picker";
-const directionMap = {
-  bottom: "top",
-  top: "bottom"
-};
-const DesktopPicker = /* @__PURE__ */ React.forwardRef(
-  (props, ref) => {
-    const _a = props, {
-      className,
-      open,
-      container,
-      children,
-      defaultDirection = "bottom",
-      inheritWidth = true,
-      content,
-      miniBackdropInvisible = false,
-      onClose,
-      onMount,
-      onUnmounted,
-      containerWidth = "auto",
-      BackdropProps,
-      prefix = ""
-    } = _a, others = __objRest(_a, [
-      "className",
-      "open",
-      "container",
-      "children",
-      "defaultDirection",
-      "inheritWidth",
-      "content",
-      "miniBackdropInvisible",
-      "onClose",
-      "onMount",
-      "onUnmounted",
-      "containerWidth",
-      "BackdropProps",
-      "prefix"
-    ]);
-    const contentRef = useRef(null);
-    const nodeRef = useRef(null);
-    const renderChildren = React.cloneElement(children, {
-      ref: nodeRef,
-      style: {
-        flex: 1
-      }
-    });
-    const [contentPosition, setContentPosition] = useState(
-      "bottom"
-    );
-    const [transform, setTransform] = useState(false);
-    const getContentDirection = () => __async(void 0, null, function* () {
-      const curScrollRoot = getRootContainer(container);
-      const result = yield getStylesAndLocation({
-        scrollRoot: container && curScrollRoot,
-        childrenRef: nodeRef,
-        arrowDirection: defaultDirection,
-        arrowLocation: "none",
-        offsetSpacing: 0,
-        tipRef: contentRef
-      });
-      if (!result)
-        return;
-      const { newArrowDirection, styles, childrenStyle } = result;
-      const element = contentRef.current;
-      element.style.transform = styles == null ? void 0 : styles.transform;
-      element.style.visibility = styles == null ? void 0 : styles.visibility;
-      element.style.top = styles == null ? void 0 : styles.top;
-      element.style.left = styles == null ? void 0 : styles.left;
-      if (inheritWidth) {
-        element.style.width = childrenStyle == null ? void 0 : childrenStyle.width;
-      }
-      setContentPosition(newArrowDirection);
-    });
-    useEffect(() => {
-      if (!isMini && open) {
-        const addEventListenerClick = (e) => {
-          var _a2;
-          if (!((_a2 = nodeRef.current) == null ? void 0 : _a2.contains(e.target))) {
-            onClose(null, { value: !open });
-          }
-        };
-        getContentDirection();
-        const containerDom = getRootContainer(container, window);
-        containerDom.addEventListener("scroll", getContentDirection);
-        window.addEventListener("resize", getContentDirection);
-        window.addEventListener("click", addEventListenerClick);
-        return () => {
-          containerDom.removeEventListener("scroll", getContentDirection);
-          window.removeEventListener("resize", getContentDirection);
-          window.removeEventListener("click", addEventListenerClick);
-        };
-      }
-      if (isMini && open) {
-        calcAfterMounted(getContentDirection);
-      }
-    }, [container, open]);
-    const renderContent = () => {
-      return /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          className: clsx(
-            `${prefixCls}-container`,
-            `${prefixCls}-${contentPosition}`
-          ),
-          style: {
-            width: containerWidth
-          },
-          ref: contentRef
-        },
-        /* @__PURE__ */ React.createElement(
-          "div",
-          {
-            className: `${prefixCls}-container-${transform && open ? "open" : "close"} ${prefixCls}-container-content`,
-            style: {
-              transformOrigin: `${directionMap[contentPosition]} center`
-            },
-            onTransitionEnd: () => {
-              if (!open) {
-                setTransform(false);
-              }
-            }
-          },
-          content
-        )
-      );
-    };
-    useEffect(() => {
-      if (open) {
-        calcAfterMounted(() => {
-          setTransform(true);
-        });
-      }
-    }, [open]);
-    const renderContainer = useMemo(() => {
-      return open || transform;
-    }, [open, transform]);
-    useDidMountEffect(() => {
-      if (!renderContainer) {
-        onUnmounted == null ? void 0 : onUnmounted();
-      } else {
-        onMount == null ? void 0 : onMount();
-      }
-    }, [renderContainer]);
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", __spreadValues({ ref, className: clsx(prefixCls, className) }, others), prefix, renderChildren), !isMini && renderContainer && /* @__PURE__ */ React.createElement(Portal, null, renderContent()), isMini && renderContainer && /* @__PURE__ */ React.createElement(Portal, null, renderContent(), !miniBackdropInvisible && /* @__PURE__ */ React.createElement(
-      Backdrop,
-      __spreadProps(__spreadValues({}, BackdropProps), {
-        invisible: true,
-        open,
-        onClick: (e) => onClose(e, { value: !open })
-      })
-    )));
-  }
-);
-DesktopPicker.displayName = "BUIDesktopPicker";
-var DesktopPicker_default = DesktopPicker;
-export {
-  DesktopPicker_default as default
-};

package/es/DesktopPicker/DesktopPicker.types.d.ts

@@ -1,61 +0,0 @@
-import React from 'react';
-import { OverrideProps } from '@bifrostui/types';
-import { BackdropProps } from '../Backdrop/Backdrop.types';
-export type DesktopPickerProps<D extends React.ElementType = 'div', P = {}> = OverrideProps<{
-    props: P & {
-        /**
-         * 前缀
-         */
-        prefix?: React.ReactNode | string;
-        /**
-         * 是否继承宽度
-         * @default true
-         */
-        inheritWidth?: boolean;
-        /**
-         * 是否打开
-         */
-        open: boolean;
-        /**
-         * 浮层的内容
-         */
-        content?: React.ReactNode;
-        /**
-         * 浮层宽度
-         */
-        containerWidth?: number;
-        /**
-         * 是否指定滚动容器
-         */
-        container?: HTMLElement | (() => HTMLElement);
-        /**
-         * 小程序是否使用backdrop
-         * @default false
-         */
-        miniBackdropInvisible?: boolean;
-        /**
-         * 关闭浮层
-         */
-        onClose?: (e: React.MouseEvent<any>, data: {
-            value: boolean;
-        }) => void;
-        /**
-         * 打开后动画开始的回调
-         */
-        onMount?: () => void;
-        /**
-         * 卸载后动画结束的回调
-         */
-        onUnmounted?: () => void;
-        /**
-         * 默认的浮层位置
-         * @default bottom
-         */
-        defaultDirection?: 'top' | 'bottom';
-        /**
-         * 透传浮层的Props
-         */
-        BackdropProps?: BackdropProps;
-    };
-    defaultComponent: D;
-}, D>;

package/es/DesktopPicker/DesktopPicker.types.js

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

package/es/DesktopPicker/index.css

@@ -1,39 +0,0 @@
-:root,
-page,
-xhs-page {
-  --bui-desktop-picker-zindex: var(--bui-z-index-tooltip);
-  --bui-desktop-picker-bg: var(--bui-color-bg-view);
-  --bui-desktop-picker-shadow: 0 0 0 2px var(--bui-color-bg-default);
-}
-.bui-desktop-picker {
-  display: flex;
-  align-items: center;
-  position: relative;
-  height: 100%;
-}
-.bui-desktop-picker-container {
-  position: absolute;
-  box-sizing: border-box;
-  visibility: hidden;
-  z-index: var(--bui-desktop-picker-zindex);
-}
-.bui-desktop-picker-container-content {
-  border-radius: 3px;
-  background-color: var(--bui-desktop-picker-bg);
-  box-shadow: var(--bui-desktop-picker-shadow);
-}
-.bui-desktop-picker-container-open {
-  transform: none;
-  transition: opacity 321ms cubic-bezier(0.4, 0, 0.2, 1), transform 214ms cubic-bezier(0.4, 0, 0.2, 1);
-}
-.bui-desktop-picker-container-close {
-  opacity: 0;
-  transform: scale(0.75, 0.5625);
-  transition: opacity 321ms cubic-bezier(0.4, 0, 0.2, 1), transform 214ms cubic-bezier(0.4, 0, 0.2, 1) 107ms;
-}
-.bui-desktop-picker-top {
-  margin-top: -6px;
-}
-.bui-desktop-picker-bottom {
-  margin-top: 6px;
-}

package/es/DesktopPicker/index.d.ts

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

package/es/DesktopPicker/index.js

@@ -1,6 +0,0 @@
-import { default as default2, default as default3 } from "./DesktopPicker";
-export * from "./DesktopPicker.types";
-export {
-  default2 as DesktopPicker,
-  default3 as default
-};

package/es/DesktopPicker/utils/calcAfterMounted.d.ts

@@ -1,2 +0,0 @@
-declare const _default: (fn: any) => void;
-export default _default;

package/es/DesktopPicker/utils/calcAfterMounted.js

@@ -1,6 +0,0 @@
-var calcAfterMounted_default = (fn) => {
-  fn();
-};
-export {
-  calcAfterMounted_default as default
-};

package/es/DesktopPicker/utils/calcAfterMounted.miniapp.d.ts

@@ -1,2 +0,0 @@
-declare const _default: (fn: any) => void;
-export default _default;

package/es/DesktopPicker/utils/calcAfterMounted.miniapp.js

@@ -1,9 +0,0 @@
-import Taro from "@tarojs/taro";
-var calcAfterMounted_miniapp_default = (fn) => {
-  Taro.nextTick(() => {
-    fn();
-  });
-};
-export {
-  calcAfterMounted_miniapp_default as default
-};

package/es/DesktopTimePicker/DesktopTimePicker.d.ts

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

package/es/DesktopTimePicker/DesktopTimePicker.js

@@ -1,261 +0,0 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-import { AccessTimeCircleOutlinedIcon } from "@bifrostui/icons";
-import dayjs from "dayjs";
-import customParseFormat from "dayjs/plugin/customParseFormat";
-import clsx from "clsx";
-import React, { useMemo, useState, useEffect } from "react";
-import { useValue } from "@bifrostui/utils";
-import { isDisabledTime, dateToDayjs } from "./utils/utils";
-import DesktopPicker from "../DesktopPicker";
-import useGetTimePickerContent from "./useGetTimePickerContent";
-import "./index.css";
-dayjs.extend(customParseFormat);
-const prefixCls = "bui-d-time-picker";
-const allowedViews = ["hour", "minute", "second"];
-const DesktopTimePicker = /* @__PURE__ */ React.forwardRef(
-  (props, ref) => {
-    const _a = props, {
-      views = allowedViews,
-      timeSteps = { hour: 1, minute: 1, second: 1 },
-      ampm = false,
-      className,
-      inputRef,
-      inputProps,
-      value,
-      defaultValue,
-      disabled = false,
-      disableOpenPicker = false,
-      placeholder,
-      open,
-      format = ampm ? "hh:mm:ss A" : "HH:mm:ss",
-      disabledTimeView = () => ({
-        hour: () => [],
-        minute: () => [],
-        second: () => []
-      }),
-      minTime,
-      maxTime,
-      icon,
-      closeOnSelect = true,
-      onChange,
-      onClose,
-      onOpen,
-      DesktopPickerProps,
-      timeRender
-    } = _a, others = __objRest(_a, [
-      "views",
-      "timeSteps",
-      "ampm",
-      "className",
-      "inputRef",
-      "inputProps",
-      "value",
-      "defaultValue",
-      "disabled",
-      "disableOpenPicker",
-      "placeholder",
-      "open",
-      "format",
-      "disabledTimeView",
-      "minTime",
-      "maxTime",
-      "icon",
-      "closeOnSelect",
-      "onChange",
-      "onClose",
-      "onOpen",
-      "DesktopPickerProps",
-      "timeRender"
-    ]);
-    const [isOpen, setIsOpen] = useState(false);
-    const [inputStr, setInputStr] = useState("");
-    const [useUserStr, setUseUserStr] = useState(false);
-    const [isInvalid, setIsInvalid] = useState(false);
-    const [timeValue, triggerChange] = useValue({
-      value,
-      defaultValue,
-      onChange
-    });
-    const handleDatePickerIconClick = (e) => {
-      e.stopPropagation();
-      if (disabled || disableOpenPicker || open !== void 0)
-        return;
-      setIsOpen(!isOpen);
-    };
-    const handleTimePickerInputClick = (e) => {
-      e.stopPropagation();
-      if (inputProps == null ? void 0 : inputProps.readOnly) {
-        if (disabled || disableOpenPicker || open !== void 0)
-          return;
-        setIsOpen(!isOpen);
-        return;
-      }
-      setIsOpen(false);
-    };
-    const { desktopTimePanel } = useGetTimePickerContent({
-      views: Array.from(
-        new Set(views.filter((view) => allowedViews.includes(view)))
-      ),
-      timeSteps,
-      ampm,
-      minTime: dateToDayjs(minTime),
-      maxTime: dateToDayjs(maxTime),
-      setIsOpen,
-      triggerChange,
-      disabledTimeView,
-      timeValue: dateToDayjs(timeValue),
-      onClose,
-      onOpen,
-      closeOnSelect,
-      timeRender,
-      setIsInvalid
-    });
-    const onInputChange = (e) => {
-      e.stopPropagation();
-      const newValue = e.target.value;
-      if (newValue.length === 0) {
-        setInputStr("");
-        setUseUserStr(true);
-        triggerChange(e, null);
-        return;
-      }
-      if (!dayjs(newValue, format, true).isValid()) {
-        setInputStr(newValue);
-        setUseUserStr(true);
-      } else {
-        setInputStr("");
-        setUseUserStr(false);
-        let validTime;
-        if (dateToDayjs(timeValue)) {
-          validTime = dateToDayjs(timeValue);
-        } else if (minTime) {
-          validTime = dateToDayjs(minTime);
-        } else if (maxTime) {
-          validTime = dateToDayjs(maxTime);
-        } else {
-          validTime = dayjs();
-        }
-        const year = validTime.year();
-        const month = validTime.month() + 1;
-        const date = validTime.date();
-        const newTimeValue = dayjs(`${year}-${month}-${date} ${newValue}`);
-        if (isDisabledTime(
-          newTimeValue,
-          dateToDayjs(minTime),
-          dateToDayjs(maxTime),
-          disabledTimeView
-        )) {
-          return;
-        }
-        triggerChange(e, newTimeValue.toDate());
-      }
-    };
-    const onMount = () => {
-      onOpen == null ? void 0 : onOpen();
-    };
-    const unMounted = () => {
-      onClose == null ? void 0 : onClose();
-    };
-    const showPlaceholder = useMemo(
-      () => placeholder || format,
-      [placeholder, format]
-    );
-    const inputValue = useMemo(() => {
-      if (useUserStr) {
-        return inputStr;
-      }
-      if (timeValue) {
-        return dayjs(timeValue).format(format);
-      }
-      return "";
-    }, [timeValue, inputStr, useUserStr, format]);
-    useEffect(() => {
-      setUseUserStr(false);
-    }, [timeValue]);
-    return /* @__PURE__ */ React.createElement(
-      "div",
-      __spreadProps(__spreadValues({}, others), {
-        className: clsx(prefixCls, className, {
-          [`${prefixCls}-disabled`]: disabled,
-          [`${prefixCls}-active`]: isOpen,
-          [`${prefixCls}-invalid`]: isInvalid
-        }),
-        ref
-      }),
-      /* @__PURE__ */ React.createElement(
-        DesktopPicker,
-        __spreadValues({
-          open: open != null ? open : isOpen,
-          miniBackdropInvisible: open !== void 0,
-          onClose: (e, data) => {
-            setIsOpen(data == null ? void 0 : data.value);
-          },
-          onMount,
-          onUnmounted: unMounted,
-          content: desktopTimePanel(),
-          inheritWidth: false
-        }, DesktopPickerProps),
-        /* @__PURE__ */ React.createElement("div", { className: `${prefixCls}-container` }, /* @__PURE__ */ React.createElement(
-          "input",
-          __spreadProps(__spreadValues({}, inputProps), {
-            "aria-invalid": true,
-            autoComplete: "off",
-            placeholder: showPlaceholder,
-            type: "text",
-            inputMode: "text",
-            ref: inputRef,
-            className: clsx(`${prefixCls}-content`, {
-              [inputProps == null ? void 0 : inputProps.className]: inputProps == null ? void 0 : inputProps.className
-            }),
-            onBlur: () => setUseUserStr(false),
-            onClick: handleTimePickerInputClick,
-            onChange: onInputChange,
-            value: inputValue
-          })
-        ), /* @__PURE__ */ React.createElement(
-          "div",
-          {
-            onClick: handleDatePickerIconClick,
-            className: `${prefixCls}-icon`
-          },
-          icon || /* @__PURE__ */ React.createElement(AccessTimeCircleOutlinedIcon, { htmlColor: "#9c9ca5" })
-        ))
-      )
-    );
-  }
-);
-DesktopTimePicker.displayName = "BUITimePicker";
-var DesktopTimePicker_default = DesktopTimePicker;
-export {
-  DesktopTimePicker_default as default
-};