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

package/dist/DesktopDatePicker/useGetDatePickerContent.js

@@ -1,343 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __getProtoOf = Object.getPrototypeOf;
-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 __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var useGetDatePickerContent_exports = {};
-__export(useGetDatePickerContent_exports, {
-  default: () => useGetDatePickerContent_default
-});
-module.exports = __toCommonJS(useGetDatePickerContent_exports);
-var import_icons = require("@bifrostui/icons");
-var import_clsx = __toESM(require("clsx"));
-var import_dayjs = __toESM(require("dayjs"));
-var import_react = __toESM(require("react"));
-var import_Calendar = __toESM(require("../Calendar"));
-var import_deskTopPickerContainer = require("./deskTopPickerContainer.css");
-var import_locales = require("../locales");
-const prefixCls = "bui-d-date-picker-lay";
-const useGetDatePickerContent = (props) => {
-  const yPatterns = ["YYYY", "YY"];
-  const mPatterns = ["MM", "M", "MMM", "MMMM"];
-  const dPatterns = ["D", "DD"];
-  const { month: monthMap } = (0, import_locales.useLocaleText)("desktopDatePicker");
-  const _a = props, {
-    format,
-    minDate,
-    maxDate,
-    picker,
-    setIsOpen,
-    disabledDate,
-    calendarValue,
-    setSelectType,
-    selectType,
-    headerBarLeftIcon,
-    headerBarRightIcon,
-    closeOnSelect,
-    monthRender,
-    yearRender,
-    onMonthChange,
-    onYearChange,
-    triggerChange,
-    CalendarProps
-  } = _a, others = __objRest(_a, [
-    "format",
-    "minDate",
-    "maxDate",
-    "picker",
-    "setIsOpen",
-    "disabledDate",
-    "calendarValue",
-    "setSelectType",
-    "selectType",
-    "headerBarLeftIcon",
-    "headerBarRightIcon",
-    "closeOnSelect",
-    "monthRender",
-    "yearRender",
-    "onMonthChange",
-    "onYearChange",
-    "triggerChange",
-    "CalendarProps"
-  ]);
-  const isMinMonth = (0, import_dayjs.default)(minDate).isSame(calendarValue, "month");
-  const isMaxMonth = (0, import_dayjs.default)(maxDate).isSame(calendarValue, "month");
-  const yearList = (0, import_react.useMemo)(() => {
-    const maxYear = (0, import_dayjs.default)(maxDate).year();
-    const minYear = (0, import_dayjs.default)(minDate).year();
-    const years = [];
-    for (let i = minYear; i <= maxYear; i += 1) {
-      years.push(i);
-    }
-    const chunkedYears = [];
-    for (let i = 0; i < years.length; i += 3) {
-      chunkedYears.push(years.slice(i, i + 3));
-    }
-    return chunkedYears;
-  }, [maxDate, minDate]);
-  const mouthList = [
-    [1, 2, 3],
-    [4, 5, 6],
-    [7, 8, 9],
-    [10, 11, 12]
-  ];
-  const validateAndAdjustDate = (value) => {
-    const dateValue = (0, import_dayjs.default)(value);
-    const minValue = (0, import_dayjs.default)(minDate);
-    const maxValue = (0, import_dayjs.default)(maxDate);
-    if (dateValue.isBefore(minValue)) {
-      return minValue;
-    }
-    if (dateValue.isAfter(maxValue)) {
-      return maxValue;
-    }
-    return dateValue;
-  };
-  const onClickPrev = (e) => {
-    e.stopPropagation();
-    if (!isMinMonth) {
-      const month = (0, import_dayjs.default)(calendarValue).subtract(1, "month").toDate();
-      triggerChange(e, validateAndAdjustDate(month).toDate());
-    }
-  };
-  const onClickNext = (e) => {
-    e.stopPropagation();
-    if (!isMaxMonth) {
-      const month = (0, import_dayjs.default)(calendarValue).add(1, "month").toDate();
-      triggerChange(e, validateAndAdjustDate(month).toDate());
-    }
-  };
-  const calendarChange = (e, data) => {
-    e.stopPropagation();
-    if (data.value) {
-      const ymd = (0, import_dayjs.default)(data.value);
-      const hms = (0, import_dayjs.default)(calendarValue || /* @__PURE__ */ new Date());
-      const newValue = ymd.hour(hms.hour()).minute(hms.minute()).second(hms.second());
-      triggerChange(e, validateAndAdjustDate(newValue).toDate());
-    }
-    if (closeOnSelect) {
-      setIsOpen(false);
-    }
-  };
-  const handleTdClick = (e, data) => {
-    e.stopPropagation();
-    if (selectType === "year") {
-      triggerChange(
-        e,
-        validateAndAdjustDate(
-          (0, import_dayjs.default)(calendarValue || /* @__PURE__ */ new Date()).year(data)
-        ).toDate()
-      );
-      onYearChange == null ? void 0 : onYearChange(
-        e,
-        validateAndAdjustDate(
-          (0, import_dayjs.default)(calendarValue || /* @__PURE__ */ new Date()).year(data)
-        ).toDate()
-      );
-      if (picker === "year" && closeOnSelect) {
-        setIsOpen(false);
-        return;
-      }
-      setSelectType("month");
-    }
-    if (selectType === "month") {
-      triggerChange(
-        e,
-        validateAndAdjustDate(
-          (0, import_dayjs.default)(calendarValue || /* @__PURE__ */ new Date()).month(data - 1)
-        ).toDate()
-      );
-      onMonthChange == null ? void 0 : onMonthChange(
-        e,
-        validateAndAdjustDate(
-          (0, import_dayjs.default)(calendarValue || /* @__PURE__ */ new Date()).month(data - 1)
-        ).toDate()
-      );
-      if (picker === "day") {
-        setSelectType("day");
-        return;
-      }
-      if (closeOnSelect) {
-        setIsOpen(false);
-      }
-    }
-  };
-  const renderTd = (its, currentData) => {
-    if (yearRender && selectType === "year") {
-      return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_clsx.default)(`${prefixCls}-col-content`) }, yearRender({ year: its, currentData }));
-    }
-    if (monthRender && selectType === "month") {
-      return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_clsx.default)(`${prefixCls}-col-content`) }, monthRender({ month: its, currentData }));
-    }
-    return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_clsx.default)(`${prefixCls}-col-content`) }, /* @__PURE__ */ import_react.default.createElement("span", { className: (0, import_clsx.default)(`${prefixCls}-col-text`) }, selectType === "month" ? monthMap[its] : its));
-  };
-  const renderTable = () => {
-    const dataList = selectType === "year" ? yearList : mouthList;
-    return dataList.map((item, index) => {
-      return /* @__PURE__ */ import_react.default.createElement("div", { key: index + 1, className: (0, import_clsx.default)(`${prefixCls}-row`) }, item.map((its, idx) => {
-        let disabledClick = false;
-        if (selectType === "year") {
-          const currentData = (0, import_dayjs.default)(calendarValue).set("year", its);
-          if (its < (0, import_dayjs.default)(minDate).year() || its > (0, import_dayjs.default)(maxDate).year() || (disabledDate == null ? void 0 : disabledDate(currentData.toDate()))) {
-            disabledClick = true;
-          }
-        }
-        if (selectType === "month") {
-          const currentData = (0, import_dayjs.default)(calendarValue).set("month", its - 1);
-          disabledClick = currentData.isBefore(minDate, "month") || currentData.isAfter(maxDate, "month");
-          if (disabledDate) {
-            disabledClick = disabledDate == null ? void 0 : disabledDate(currentData.toDate());
-          }
-        }
-        return /* @__PURE__ */ import_react.default.createElement(
-          "div",
-          {
-            key: idx + 1,
-            className: (0, import_clsx.default)(`${prefixCls}-col`, {
-              [`${prefixCls}-col-active`]: (selectType === "year" ? (0, import_dayjs.default)(calendarValue).year() : (0, import_dayjs.default)(calendarValue).month() + 1) === its && !disabledClick,
-              [`${prefixCls}-col-disabled`]: disabledClick
-            }),
-            onClick: (e) => {
-              if (!disabledClick) {
-                handleTdClick(e, its);
-              }
-            }
-          },
-          renderTd(its, calendarValue)
-        );
-      }));
-    });
-  };
-  const handleClickTitle = (e, data) => {
-    e.stopPropagation();
-    if (yPatterns.indexOf(data) > -1) {
-      setSelectType("year");
-    }
-    if (mPatterns.indexOf(data) > -1) {
-      setSelectType("month");
-    }
-    if (dPatterns.indexOf(data) > -1) {
-      setSelectType("day");
-    }
-  };
-  const renderTitle = (formate, value) => {
-    const allType = [...yPatterns, ...mPatterns, ...dPatterns];
-    const formattingTokens = /(\[[^[]*\])|([-_?:/.,()\s{0-9}]+)|(A|a|Q|YYYY|YY?|ww?|MM?M?M?|Do|DD?|hh?|HH?|mm?|ss?|S{1,3}|z|ZZ?)/g;
-    const matchArr = formate.match(formattingTokens);
-    const domArr = [];
-    let str = "";
-    for (let i = 0; i <= matchArr.length; i += 1) {
-      if (allType.indexOf(matchArr[i]) > -1) {
-        if (str !== "") {
-          domArr.push(str);
-          str = "";
-        }
-        domArr.push(
-          /* @__PURE__ */ import_react.default.createElement(
-            "div",
-            {
-              className: (0, import_clsx.default)(`${prefixCls}-title-text`),
-              key: i,
-              onClick: (e) => handleClickTitle(e, matchArr[i])
-            },
-            (0, import_dayjs.default)(value).format(matchArr[i])
-          )
-        );
-      } else {
-        str = `${matchArr[i]}${str}`;
-      }
-    }
-    return domArr;
-  };
-  const desktopDatePicker = () => {
-    return /* @__PURE__ */ import_react.default.createElement(
-      "div",
-      __spreadProps(__spreadValues({
-        className: (0, import_clsx.default)(`${prefixCls}-main`)
-      }, others), {
-        onClick: (e) => {
-          e.stopPropagation();
-        }
-      }),
-      /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-handler` }, selectType !== "year" && /* @__PURE__ */ import_react.default.createElement("div", { onClick: onClickPrev, className: `${prefixCls}-handler-btn` }, headerBarLeftIcon ? headerBarLeftIcon({ isMinMonth }) : /* @__PURE__ */ import_react.default.createElement(
-        import_icons.CaretLeftIcon,
-        {
-          className: `${prefixCls}-handler-icon`,
-          htmlColor: isMinMonth && "var(--bui-color-white)"
-        }
-      )), /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-title` }, calendarValue ? renderTitle(format, calendarValue) : format), selectType !== "year" && /* @__PURE__ */ import_react.default.createElement("div", { onClick: onClickNext, className: `${prefixCls}-handler-btn` }, headerBarRightIcon ? headerBarRightIcon({ isMaxMonth }) : /* @__PURE__ */ import_react.default.createElement(
-        import_icons.CaretRightIcon,
-        {
-          className: `${prefixCls}-handler-icon`,
-          htmlColor: isMaxMonth && "var(--bui-color-white)"
-        }
-      ))),
-      selectType === "day" ? /* @__PURE__ */ import_react.default.createElement(
-        import_Calendar.default,
-        __spreadValues({
-          headerVisible: true,
-          minDate,
-          maxDate,
-          disabledDate,
-          value: calendarValue,
-          onChange: calendarChange
-        }, CalendarProps)
-      ) : /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_clsx.default)(`${prefixCls}-list`) }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_clsx.default)(`${prefixCls}-box`) }, renderTable()))
-    );
-  };
-  return {
-    desktopDatePicker
-  };
-};
-var useGetDatePickerContent_default = useGetDatePickerContent;

package/dist/DesktopDateTimePicker/DesktopDateTimePicker.d.ts

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

package/dist/DesktopDateTimePicker/DesktopDateTimePicker.js

@@ -1,322 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __getProtoOf = Object.getPrototypeOf;
-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 __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var DesktopDateTimePicker_exports = {};
-__export(DesktopDateTimePicker_exports, {
-  default: () => DesktopDateTimePicker_default
-});
-module.exports = __toCommonJS(DesktopDateTimePicker_exports);
-var import_icons = require("@bifrostui/icons");
-var import_dayjs = __toESM(require("dayjs"));
-var import_clsx = __toESM(require("clsx"));
-var import_react = __toESM(require("react"));
-var import_utils = require("@bifrostui/utils");
-var import_DesktopPicker = __toESM(require("../DesktopPicker"));
-var import_useGetDatePickerContent = __toESM(require("../DesktopDatePicker/useGetDatePickerContent"));
-var import_useGetTimePickerContent = __toESM(require("../DesktopTimePicker/useGetTimePickerContent"));
-var import_index = require("./index.css");
-const prefixCls = "bui-datetime-picker";
-const DesktopDateTimePicker = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
-  const _a = props, {
-    className,
-    inputRef,
-    inputProps,
-    value,
-    defaultValue,
-    disabled = false,
-    disableOpenPicker = false,
-    placeholder,
-    format = "YYYY/MM/DD HH:mm:ss",
-    open,
-    disabledDate,
-    views = ["year", "month", "day", "hour", "minute", "second"],
-    minDate = (0, import_dayjs.default)((0, import_dayjs.default)().format("YYYYMMDD")).subtract(10, "year").toDate(),
-    maxDate = (0, import_dayjs.default)((0, import_dayjs.default)().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",
-    "views",
-    "minDate",
-    "maxDate",
-    "icon",
-    "headerBarLeftIcon",
-    "headerBarRightIcon",
-    "closeOnSelect",
-    "onChange",
-    "onClose",
-    "onOpen",
-    "monthRender",
-    "yearRender",
-    "onMonthChange",
-    "onYearChange",
-    "DesktopPickerProps",
-    "CalendarProps"
-  ]);
-  const [isOpen, setIsOpen] = (0, import_react.useState)(open);
-  const [isInvalid, setIsInvalid] = (0, import_react.useState)(false);
-  const getPicker = (0, import_react.useMemo)(() => {
-    if (views.includes("day")) {
-      return "day";
-    }
-    if (views.includes("month")) {
-      return "month";
-    }
-    if (views.includes("year")) {
-      return "year";
-    }
-    return "day";
-  }, [views]);
-  const [selectType, setSelectType] = (0, import_react.useState)(
-    getPicker
-  );
-  const [inputStr, setInputStr] = (0, import_react.useState)("");
-  const [useUserStr, setUseUserStr] = (0, import_react.useState)(false);
-  const [calendarValue, triggerChange] = (0, import_utils.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 } = (0, import_useGetDatePickerContent.default)({
-    format,
-    minDate,
-    maxDate,
-    setIsOpen,
-    triggerChange,
-    disabledDate,
-    calendarValue,
-    setSelectType,
-    picker: getPicker,
-    selectType,
-    headerBarLeftIcon,
-    headerBarRightIcon,
-    CalendarProps,
-    onClose,
-    monthRender,
-    yearRender,
-    onMonthChange,
-    onYearChange,
-    closeOnSelect: false,
-    style: {
-      borderRadius: "3px 0px 0px 3px"
-    }
-  });
-  const { desktopTimePanel } = (0, import_useGetTimePickerContent.default)({
-    views: views.filter(
-      (item) => item !== "day" && item !== "month" && item !== "year"
-    ),
-    minTime: (0, import_dayjs.default)(minDate),
-    maxTime: (0, import_dayjs.default)(maxDate),
-    setIsOpen,
-    triggerChange,
-    closeOnSelect,
-    timeValue: (0, import_dayjs.default)(calendarValue),
-    setIsInvalid
-  });
-  const onInputChange = (e) => {
-    e.stopPropagation();
-    const newValue = e.target.value;
-    if (newValue.length === 0) {
-      setInputStr("");
-      setUseUserStr(true);
-      triggerChange(e, null);
-      return;
-    }
-    if ((0, import_dayjs.default)(newValue, format, true).isValid()) {
-      setInputStr("");
-      setUseUserStr(false);
-      if (disabledDate == null ? void 0 : disabledDate((0, import_dayjs.default)(newValue).toDate())) {
-        return;
-      }
-      if ((0, import_dayjs.default)(newValue).isAfter(maxDate)) {
-        triggerChange(e, maxDate);
-        return;
-      }
-      if ((0, import_dayjs.default)(newValue).isBefore(minDate)) {
-        triggerChange(e, minDate);
-        return;
-      }
-      triggerChange(e, (0, import_dayjs.default)(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(getPicker);
-  };
-  const showPlaceholder = (0, import_react.useMemo)(() => {
-    if (placeholder) {
-      return placeholder;
-    }
-    return format;
-  }, [placeholder, format]);
-  const renderValue = (0, import_react.useMemo)(() => {
-    if (useUserStr) {
-      return inputStr;
-    }
-    if (calendarValue) {
-      return (0, import_dayjs.default)(calendarValue).format(format);
-    }
-    return "";
-  }, [calendarValue, inputStr, useUserStr, format]);
-  (0, import_react.useEffect)(() => {
-    setUseUserStr(false);
-  }, [calendarValue]);
-  return /* @__PURE__ */ import_react.default.createElement(
-    "div",
-    __spreadProps(__spreadValues({}, others), {
-      className: (0, import_clsx.default)(prefixCls, className, {
-        [`${prefixCls}-disabled`]: disabled,
-        [`${prefixCls}-active`]: isOpen,
-        [`${prefixCls}-invalid`]: isInvalid
-      }),
-      ref
-    }),
-    /* @__PURE__ */ import_react.default.createElement(
-      import_DesktopPicker.default,
-      __spreadProps(__spreadValues({
-        open: open != null ? open : isOpen,
-        miniBackdropInvisible: open !== void 0,
-        onClose: (e, data) => {
-          setIsOpen(data == null ? void 0 : data.value);
-        },
-        onMount: onmount,
-        onUnmounted: unMounted,
-        content: /* @__PURE__ */ import_react.default.createElement(
-          "div",
-          {
-            className: `${prefixCls}-box`,
-            onClick: (e) => {
-              e.stopPropagation();
-            }
-          },
-          desktopDatePicker(),
-          desktopTimePanel()
-        )
-      }, DesktopPickerProps), {
-        inheritWidth: false
-      }),
-      /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-container` }, /* @__PURE__ */ import_react.default.createElement(
-        "input",
-        __spreadProps(__spreadValues({}, inputProps), {
-          "aria-invalid": true,
-          autoComplete: "off",
-          placeholder: showPlaceholder,
-          type: "text",
-          inputMode: "text",
-          ref: inputRef,
-          className: (0, import_clsx.default)(`${prefixCls}-input`, {
-            [inputProps == null ? void 0 : inputProps.className]: inputProps == null ? void 0 : inputProps.className
-          }),
-          onBlur: () => setUseUserStr(false),
-          onClick: handleDatePickerInputClick,
-          onChange: onInputChange,
-          value: renderValue
-        })
-      ), /* @__PURE__ */ import_react.default.createElement(
-        "div",
-        {
-          onClick: handleDatePickerIconClick,
-          className: `${prefixCls}-icon`
-        },
-        icon || /* @__PURE__ */ import_react.default.createElement(import_icons.DateOutlinedIcon, { htmlColor: "var(--bui-color-neutral-3)" })
-      ))
-    )
-  );
-});
-DesktopDateTimePicker.displayName = "BUIDesktopDateTimePicker";
-var DesktopDateTimePicker_default = DesktopDateTimePicker;