@bifrostui/react 1.4.8-beta.0 → 2.0.0-alpha.0

package/es/DatePicker/DatePicker.js

@@ -1,308 +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 React, { forwardRef, useEffect, useState } from "react";
-import clsx from "clsx";
-import { useValue } from "@bifrostui/utils";
-import Picker from "../Picker";
-import { useLocaleText } from "../locales";
-import { DatePickerType } from "./constants";
-const MIN_DATE = new Date((/* @__PURE__ */ new Date()).getFullYear() - 10, 0, 1);
-const MAX_DATE = new Date((/* @__PURE__ */ new Date()).getFullYear() + 10, 11, 31);
-const DEFAULT_PICKER = [
-  DatePickerType.YEAR,
-  DatePickerType.MONTH,
-  DatePickerType.DAY
-];
-function isValidDate(value) {
-  return value instanceof Date && !Number.isNaN(value.getTime());
-}
-const padZero = (num, targetLength = 2) => {
-  let str = `${num}`;
-  while (str.length < targetLength) {
-    str = `0${str}`;
-  }
-  return str;
-};
-const getMaxDay = (year, monthIndex) => {
-  return new Date(year, monthIndex + 1, 0).getDate();
-};
-const getDateTypeValue = (date, type) => {
-  switch (type) {
-    case DatePickerType.YEAR:
-      return date.getFullYear();
-    case DatePickerType.MONTH:
-      return date.getMonth() + 1;
-    case DatePickerType.DAY:
-      return date.getDate();
-    case DatePickerType.HOUR:
-      return date.getHours();
-    case DatePickerType.MINUTE:
-      return date.getMinutes();
-    case DatePickerType.SECOND:
-      return date.getSeconds();
-    default:
-      throw new Error(`\u9519\u8BEF\u7684picker\u7C7B\u578B\uFF1A${type}`);
-  }
-};
-const DatePicker = forwardRef((props, ref) => {
-  const _a = props, {
-    className,
-    value: propValue,
-    defaultValue,
-    views = DEFAULT_PICKER,
-    minDate: propMinDate = MIN_DATE,
-    maxDate: propMaxDate = MAX_DATE,
-    showUnit = false,
-    formatter,
-    filter,
-    disableDateTimeView,
-    dateTimeStep,
-    onConfirm,
-    onClose,
-    onChange
-  } = _a, others = __objRest(_a, [
-    "className",
-    "value",
-    "defaultValue",
-    "views",
-    "minDate",
-    "maxDate",
-    "showUnit",
-    "formatter",
-    "filter",
-    "disableDateTimeView",
-    "dateTimeStep",
-    "onConfirm",
-    "onClose",
-    "onChange"
-  ]);
-  const [options, setOptions] = useState([]);
-  const [pickerValue, setPickerValue] = useState([]);
-  const datePickerText = useLocaleText("datePicker");
-  const formatDate = (date) => {
-    let formattedDate = date;
-    if (!formattedDate || !isValidDate(date) || formattedDate.getTime() < propMinDate.getTime()) {
-      formattedDate = propMinDate;
-    }
-    if (formattedDate.getTime() > propMaxDate.getTime()) {
-      formattedDate = propMaxDate;
-    }
-    return formattedDate;
-  };
-  const [currentDate, triggerChange] = useValue({
-    value: propValue && formatDate(propValue),
-    defaultValue: formatDate(defaultValue)
-  });
-  const handleConfirm = (e) => {
-    onConfirm == null ? void 0 : onConfirm(e, { value: currentDate });
-  };
-  const handleClose = (e) => {
-    onClose == null ? void 0 : onClose(e, { value: currentDate });
-  };
-  const handleChange = (e, { value, columnIndex }) => {
-    if (value[columnIndex] === null)
-      return;
-    const current = new Date(currentDate);
-    switch (views[columnIndex]) {
-      case DatePickerType.YEAR:
-        current.setFullYear(value[columnIndex]);
-        break;
-      case DatePickerType.MONTH: {
-        const selectedMaxDay = getMaxDay(
-          current.getFullYear(),
-          Number(value[columnIndex]) - 1
-        );
-        if (current.getDate() > selectedMaxDay) {
-          current.setDate(selectedMaxDay);
-        }
-        current.setMonth(value[columnIndex] - 1);
-        break;
-      }
-      case DatePickerType.DAY:
-        current.setDate(value[columnIndex]);
-        break;
-      case DatePickerType.HOUR:
-        current.setHours(value[columnIndex]);
-        break;
-      case DatePickerType.MINUTE:
-        current.setMinutes(value[columnIndex]);
-        break;
-      case DatePickerType.SECOND:
-        current.setSeconds(value[columnIndex]);
-        break;
-      default:
-        throw new Error(`\u9519\u8BEF\u7684picker\u7C7B\u578B\uFF1A${views[columnIndex]}`);
-    }
-    triggerChange(e, formatDate(current));
-    onChange == null ? void 0 : onChange(e, { type: views[columnIndex], value: current });
-  };
-  const formatOption = (type, value) => {
-    let label = padZero(value);
-    if (formatter) {
-      return formatter(type, {
-        value,
-        label
-      });
-    }
-    if (showUnit) {
-      label += datePickerText[type];
-    }
-    return { value, label };
-  };
-  const generateOptions = (min, max, type, columnIndex) => {
-    const step = (dateTimeStep == null ? void 0 : dateTimeStep[type]) || 1;
-    let valueIndex = 0;
-    const optionsArray = Array.from(
-      { length: (max - min + 1) / step || 1 },
-      (_, index) => {
-        const value = index * step + min;
-        if (value <= getDateTypeValue(currentDate, type)) {
-          valueIndex = index;
-        }
-        return formatOption(type, value);
-      }
-    );
-    pickerValue[columnIndex] = optionsArray[valueIndex].value;
-    setPickerValue([...pickerValue]);
-    if ((disableDateTimeView == null ? void 0 : disableDateTimeView[type]) && typeof disableDateTimeView[type] === "function") {
-      const disabledOptionsValue = disableDateTimeView[type](
-        optionsArray.map((i) => i.value)
-      );
-      return optionsArray.map((option) => {
-        if (disabledOptionsValue.includes(option.value)) {
-          return __spreadProps(__spreadValues({}, option), {
-            disabled: true
-          });
-        }
-        return option;
-      });
-    }
-    if (filter) {
-      return filter(type, optionsArray);
-    }
-    return optionsArray;
-  };
-  const getBoundary = (type, value) => {
-    const boundary = type === "min" ? propMinDate : propMaxDate;
-    const year = boundary.getFullYear();
-    let month = 1;
-    let date = 1;
-    let hour = 0;
-    let minute = 0;
-    let seconds = 0;
-    if (type === "max") {
-      month = 12;
-      date = getMaxDay(value.getFullYear(), value.getMonth());
-      hour = 23;
-      minute = 59;
-      seconds = 59;
-    }
-    if (value.getFullYear() === year) {
-      month = boundary.getMonth() + 1;
-      if (value.getMonth() + 1 === month) {
-        date = boundary.getDate();
-        if (value.getDate() === date) {
-          hour = boundary.getHours();
-          if (value.getHours() === hour) {
-            minute = boundary.getMinutes();
-            if (value.getMinutes() === minute) {
-              seconds = boundary.getSeconds();
-            }
-          }
-        }
-      }
-    }
-    return {
-      [`${type}Year`]: year,
-      [`${type}Month`]: month,
-      [`${type}Date`]: date,
-      [`${type}Hour`]: hour,
-      [`${type}Minute`]: minute,
-      [`${type}Seconds`]: seconds
-    };
-  };
-  const generateRanges = () => {
-    const ranges = [];
-    const { minYear, minMonth, minDate, minHour, minMinute, minSeconds } = getBoundary("min", currentDate);
-    const { maxYear, maxMonth, maxDate, maxHour, maxMinute, maxSeconds } = getBoundary("max", currentDate);
-    for (let i = 0; i < views.length; i += 1) {
-      const type = views[i];
-      switch (type) {
-        case DatePickerType.YEAR:
-          ranges.push([minYear, maxYear]);
-          break;
-        case DatePickerType.MONTH:
-          ranges.push([minMonth, maxMonth]);
-          break;
-        case DatePickerType.DAY:
-          ranges.push([minDate, maxDate]);
-          break;
-        case DatePickerType.HOUR:
-          ranges.push([minHour, maxHour]);
-          break;
-        case DatePickerType.MINUTE:
-          ranges.push([minMinute, maxMinute]);
-          break;
-        case DatePickerType.SECOND:
-          ranges.push([minSeconds, maxSeconds]);
-          break;
-        default:
-          throw new Error(`\u9519\u8BEF\u7684picker\u7C7B\u578B\uFF1A${type}`);
-      }
-    }
-    return ranges;
-  };
-  const generateRangeOptions = () => generateRanges().map(
-    (range, index) => generateOptions(range[0], range[1], views[index], index)
-  );
-  useEffect(() => {
-    setOptions(generateRangeOptions());
-  }, [currentDate, views, propMinDate, propMaxDate]);
-  return /* @__PURE__ */ React.createElement(
-    Picker,
-    __spreadProps(__spreadValues({}, others), {
-      "data-selected": currentDate ? currentDate.getTime() : "",
-      className: clsx("bui-date-picker", className),
-      ref,
-      options,
-      value: pickerValue,
-      onConfirm: handleConfirm,
-      onClose: handleClose,
-      onOptionChange: handleChange
-    })
-  );
-});
-DatePicker.displayName = "BuiDatePicker";
-var DatePicker_default = DatePicker;
-export {
-  DatePicker_default as default
-};

package/es/DatePicker/DatePicker.types.d.ts

@@ -1,36 +0,0 @@
-import React from 'react';
-import { OverrideProps } from '@bifrostui/types';
-import { PickerProps, IPickerOptionItem } from '../Picker';
-import { DatePickerType } from './constants';
-export type DatePickerOption = IPickerOptionItem & {
-    value: number;
-};
-export type DatePickerProps<D extends React.ElementType = 'div', P = Omit<PickerProps, 'value' | 'defaultValue' | 'onChange' | 'onConfirm' | 'onClose'>> = OverrideProps<{
-    props: P & {
-        defaultValue?: Date;
-        value?: Date;
-        views?: DatePickerType[];
-        minDate?: Date;
-        maxDate?: Date;
-        showUnit?: boolean;
-        disableDateTimeView?: Partial<{
-            [key in DatePickerType]: (options: number[]) => number[];
-        }>;
-        dateTimeStep?: Partial<{
-            [key in DatePickerType]: number;
-        }>;
-        formatter?: (type: DatePickerType, option: DatePickerOption) => DatePickerOption;
-        filter?: (type: DatePickerType, options: DatePickerOption[]) => DatePickerOption[];
-        onConfirm?: (e: React.SyntheticEvent, { value }: {
-            value: Date;
-        }) => void;
-        onClose?: (e: React.SyntheticEvent, { value }: {
-            value: Date;
-        }) => void;
-        onChange?: (e: React.SyntheticEvent, { value }: {
-            type: DatePickerType;
-            value: Date;
-        }) => void;
-    };
-    defaultComponent: D;
-}, D>;

package/es/DatePicker/DatePicker.types.js

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

package/es/DatePicker/constants.d.ts

@@ -1,9 +0,0 @@
-export declare enum DatePickerType {
-    YEAR = "year",
-    MONTH = "month",
-    DAY = "day",
-    HOUR = "hour",
-    MINUTE = "minute",
-    SECOND = "second"
-}
-export default DatePickerType;

package/es/DatePicker/constants.js

@@ -1,14 +0,0 @@
-var DatePickerType = /* @__PURE__ */ ((DatePickerType2) => {
-  DatePickerType2["YEAR"] = "year";
-  DatePickerType2["MONTH"] = "month";
-  DatePickerType2["DAY"] = "day";
-  DatePickerType2["HOUR"] = "hour";
-  DatePickerType2["MINUTE"] = "minute";
-  DatePickerType2["SECOND"] = "second";
-  return DatePickerType2;
-})(DatePickerType || {});
-var constants_default = DatePickerType;
-export {
-  DatePickerType,
-  constants_default as default
-};

package/es/DatePicker/index.d.ts

@@ -1,3 +0,0 @@
-export { default, default as DatePicker } from './DatePicker';
-export * from './DatePicker.types';
-export { DatePickerType } from './constants';

package/es/DatePicker/index.js

@@ -1,8 +0,0 @@
-import { default as default2, default as default3 } from "./DatePicker";
-export * from "./DatePicker.types";
-import { DatePickerType } from "./constants";
-export {
-  default3 as DatePicker,
-  DatePickerType,
-  default2 as default
-};

package/es/DesktopDatePicker/DesktopDatePicker.d.ts

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

package/es/DesktopDatePicker/DesktopDatePicker.js

@@ -1,253 +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 { DateOutlinedIcon } from "@bifrostui/icons";
-import dayjs from "dayjs";
-import clsx from "clsx";
-import React, { useMemo, useState, useEffect } from "react";
-import { useValue } from "@bifrostui/utils";
-import DesktopPicker from "../DesktopPicker";
-import useGetDatePickerContent from "./useGetDatePickerContent";
-import "./index.css";
-const prefixCls = "bui-d-date-picker";
-const DesktopDatePicker = /* @__PURE__ */ React.forwardRef((props, ref) => {
-  const _a = props, {
-    className,
-    inputRef,
-    inputProps,
-    value,
-    defaultValue,
-    disabled = false,
-    disableOpenPicker = false,
-    placeholder,
-    format = "YYYY/MM/DD",
-    open,
-    disabledDate,
-    picker = "day",
-    minDate = dayjs(dayjs().format("YYYYMMDD")).subtract(10, "year").toDate(),
-    maxDate = dayjs(dayjs().format("YYYYMMDD")).add(10, "year").toDate(),
-    icon,
-    headerBarLeftIcon,
-    headerBarRightIcon,
-    closeOnSelect = true,
-    onChange,
-    onClose,
-    onOpen,
-    monthRender,
-    yearRender,
-    onMonthChange,
-    onYearChange,
-    DesktopPickerProps,
-    CalendarProps
-  } = _a, others = __objRest(_a, [
-    "className",
-    "inputRef",
-    "inputProps",
-    "value",
-    "defaultValue",
-    "disabled",
-    "disableOpenPicker",
-    "placeholder",
-    "format",
-    "open",
-    "disabledDate",
-    "picker",
-    "minDate",
-    "maxDate",
-    "icon",
-    "headerBarLeftIcon",
-    "headerBarRightIcon",
-    "closeOnSelect",
-    "onChange",
-    "onClose",
-    "onOpen",
-    "monthRender",
-    "yearRender",
-    "onMonthChange",
-    "onYearChange",
-    "DesktopPickerProps",
-    "CalendarProps"
-  ]);
-  const [isOpen, setIsOpen] = useState(false);
-  const [selectType, setSelectType] = useState(
-    picker
-  );
-  const [inputStr, setInputStr] = useState("");
-  const [useUserStr, setUseUserStr] = useState(false);
-  const [calendarValue, triggerChange] = useValue({
-    value,
-    defaultValue,
-    onChange
-  });
-  const handleDatePickerIconClick = (e) => {
-    if (disabled || disableOpenPicker || open !== void 0)
-      return;
-    setIsOpen(!isOpen);
-  };
-  const handleDatePickerInputClick = (e) => {
-    e.stopPropagation();
-    if (inputProps == null ? void 0 : inputProps.readOnly) {
-      if (disabled || disableOpenPicker || open !== void 0)
-        return;
-      setIsOpen(!isOpen);
-      return;
-    }
-    setIsOpen(false);
-  };
-  const { desktopDatePicker } = useGetDatePickerContent({
-    format,
-    minDate,
-    maxDate,
-    setIsOpen,
-    triggerChange,
-    disabledDate,
-    calendarValue,
-    setSelectType,
-    picker,
-    selectType,
-    headerBarLeftIcon,
-    headerBarRightIcon,
-    CalendarProps,
-    onClose,
-    monthRender,
-    yearRender,
-    onMonthChange,
-    onYearChange,
-    closeOnSelect
-  });
-  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("");
-      setUseUserStr(false);
-      if (disabledDate == null ? void 0 : disabledDate(dayjs(newValue).toDate())) {
-        return;
-      }
-      if (dayjs(newValue).isAfter(maxDate)) {
-        triggerChange(e, maxDate);
-        return;
-      }
-      if (dayjs(newValue).isBefore(minDate)) {
-        triggerChange(e, minDate);
-        return;
-      }
-      triggerChange(e, dayjs(e.target.value).toDate());
-    } else {
-      setUseUserStr(true);
-      setInputStr(e.target.value);
-    }
-  };
-  const onMount = () => {
-    onOpen == null ? void 0 : onOpen();
-  };
-  const unMounted = () => {
-    onClose == null ? void 0 : onClose();
-    setSelectType(picker);
-  };
-  const showPlaceholder = useMemo(() => {
-    if (placeholder) {
-      return placeholder;
-    }
-    return format;
-  }, [placeholder, format]);
-  const renderValue = useMemo(() => {
-    if (useUserStr) {
-      return inputStr;
-    }
-    if (calendarValue) {
-      return dayjs(calendarValue).format(format);
-    }
-    return "";
-  }, [calendarValue, inputStr, useUserStr, format]);
-  useEffect(() => {
-    setUseUserStr(false);
-  }, [calendarValue]);
-  return /* @__PURE__ */ React.createElement(
-    "div",
-    __spreadProps(__spreadValues({}, others), {
-      className: clsx(prefixCls, className, {
-        [`${prefixCls}-disabled`]: disabled,
-        [`${prefixCls}-active`]: isOpen
-      }),
-      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: desktopDatePicker()
-      }, 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}-input`, {
-            [inputProps == null ? void 0 : inputProps.className]: inputProps == null ? void 0 : inputProps.className
-          }),
-          onBlur: () => setUseUserStr(false),
-          onClick: handleDatePickerInputClick,
-          onChange: onInputChange,
-          value: renderValue
-        })
-      ), /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          onClick: handleDatePickerIconClick,
-          className: `${prefixCls}-icon`
-        },
-        icon || /* @__PURE__ */ React.createElement(DateOutlinedIcon, { htmlColor: "var(--bui-color-neutral-3)" })
-      ))
-    )
-  );
-});
-DesktopDatePicker.displayName = "BUIDatePicker";
-var DesktopDatePicker_default = DesktopDatePicker;
-export {
-  DesktopDatePicker_default as default
-};