@tencentcloud/chat-uikit-react 2.3.1 → 3.0.0

package/dist/components/Modal/Modal.js

@@ -0,0 +1,89 @@
+import { jsx as a, Fragment as k } from "react/jsx-runtime";
+import { forwardRef as v, useState as m, useRef as p, useEffect as b } from "react";
+import { c as u } from "../../external_modules/classnames-HRMVOjAa.js";
+import { M as x } from "../../external_modules/mui-CbGEJVT2.js";
+import { C as A } from "../../external_modules/react-vendors-3raCpd-g.js";
+import '../../styles/Modal.css';const E = "uikit-root", N = "uikit-backdrop", R = "uikit-backdropEnterActive", t = {
+  root: E,
+  backdrop: N,
+  backdropEnterActive: R,
+  "modal-content-enter": "uikit-modal-content-enter",
+  "modal-content-enter-active": "uikit-modal-content-enter-active",
+  "modal-content-enter-done": "uikit-modal-content-enter-done",
+  "modal-content-exit": "uikit-modal-content-exit",
+  "modal-content-exit-active": "uikit-modal-content-exit-active"
+}, f = v((i, d) => {
+  const { className: e, open: c, onClick: o } = i, [s, n] = m(!1), l = p(null);
+  return b(() => {
+    n(c || !1);
+  }, [c]), /* @__PURE__ */ a(
+    "div",
+    {
+      ref: l,
+      className: u(t.backdrop, {
+        [t.backdropEnterActive]: s
+      }, e),
+      onClick: (r) => {
+        n(!1), o == null || o(r);
+      }
+    }
+  );
+});
+f.displayName = "Backdrop";
+function T(i) {
+  const {
+    open: d = !1,
+    onClose: e,
+    style: c,
+    className: o,
+    children: s
+  } = i, n = p(null), [l, r] = m(!0);
+  return /* @__PURE__ */ a(
+    x,
+    {
+      open: d,
+      closeAfterTransition: !0,
+      slots: {
+        backdrop: f
+      },
+      slotProps: {
+        root: {
+          className: u(t.root, o),
+          style: { ...c }
+        },
+        backdrop: {
+          onClick: () => r(!1)
+        }
+      },
+      children: /* @__PURE__ */ a(k, { children: /* @__PURE__ */ a(
+        A,
+        {
+          in: l,
+          nodeRef: n,
+          timeout: 200,
+          appear: !0,
+          unmountOnExit: !0,
+          classNames: {
+            appear: t["modal-content-enter"],
+            appearActive: t["modal-content-enter-active"],
+            enter: t["modal-content-enter"],
+            enterActive: t["modal-content-enter-active"],
+            enterDone: t["modal-content-enter-done"],
+            exit: t["modal-content-exit"],
+            exitActive: t["modal-content-exit-active"]
+          },
+          onEnter: () => {
+            r(!0);
+          },
+          onExited: () => {
+            e == null || e(), r(!0);
+          },
+          children: /* @__PURE__ */ a("div", { ref: n, children: s })
+        }
+      ) })
+    }
+  );
+}
+export {
+  T as default
+};

package/dist/components/Modal/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Modal';

package/dist/components/Modal/index.js

@@ -0,0 +1,4 @@
+import { default as o } from "./Modal.js";
+export {
+  o as default
+};

package/dist/components/Model/index.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+interface PopupProps {
+    className?: string;
+    onClick?: (e: Event) => void;
+}
+export declare function Model<T extends PopupProps>(props: React.PropsWithChildren<T>): React.ReactElement;
+export {};

package/dist/components/Model/index.js

@@ -0,0 +1,12 @@
+import { jsx as c } from "react/jsx-runtime";
+import '../../styles/index3.css';function i(e) {
+  const {
+    className: n,
+    onClick: o,
+    children: l
+  } = e;
+  return /* @__PURE__ */ c("div", { role: "button", tabIndex: 0, className: `model ${n}`, onClick: (t) => o && o(t), children: l });
+}
+export {
+  i as Model
+};

package/dist/components/Plugins/hooks/index.d.ts

@@ -0,0 +1 @@
+export * from './usePluginsElement';

package/dist/components/Plugins/hooks/index.js

@@ -0,0 +1,4 @@
+import { usePluginsElement as m } from "./usePluginsElement.js";
+export {
+  m as usePluginsElement
+};

package/dist/components/Plugins/hooks/usePluginsElement.d.ts

@@ -0,0 +1,10 @@
+import { PropsWithChildren } from 'react';
+interface PluginsElementProps {
+    plugins?: any[] | undefined;
+    showNumber?: number | undefined;
+}
+export declare function usePluginsElement<T extends PluginsElementProps>(props: PropsWithChildren<T>): {
+    showPicker: any[] | undefined;
+    elements: any[] | undefined;
+};
+export {};

package/dist/components/Plugins/hooks/usePluginsElement.js

@@ -0,0 +1,11 @@
+import { useMemo as t } from "react";
+function s(r) {
+  const { plugins: e, showNumber: o } = r;
+  return t(() => ({
+    showPicker: e == null ? void 0 : e.slice(0, o),
+    elements: e == null ? void 0 : e.slice(o)
+  }), [e, o]);
+}
+export {
+  s as usePluginsElement
+};

package/dist/components/Plugins/index.d.ts

@@ -0,0 +1,19 @@
+import { default as React } from 'react';
+export interface PluginsProps {
+    plugins?: any[];
+    showNumber?: number;
+    MoreIcon?: any;
+    className?: string | undefined;
+    customClass?: string;
+    style?: any;
+    root?: any;
+    handleVisible?: (isVisible: any) => void;
+    showMore?: boolean;
+}
+export interface IPluginsRef {
+    closeMore?: () => void;
+}
+declare const Plugins: React.ForwardRefExoticComponent<PluginsProps & {
+    children?: React.ReactNode | undefined;
+} & React.RefAttributes<unknown>>;
+export { Plugins, };

package/dist/components/Plugins/index.js

@@ -0,0 +1,73 @@
+import { jsxs as u, jsx as l } from "react/jsx-runtime";
+import { forwardRef as S, useRef as V, useState as j, useImperativeHandle as k } from "react";
+import { Icon as B } from "../Icon/Icon.js";
+import { IconTypes as D } from "../Icon/type.js";
+import { Popup as H } from "../Popup/index.js";
+import { usePluginsElement as L } from "./hooks/usePluginsElement.js";
+import '../../styles/index4.css';function M(g, f) {
+  const {
+    plugins: N = [],
+    showNumber: x,
+    MoreIcon: c,
+    className: b = "",
+    style: v,
+    customClass: w = "",
+    root: y,
+    handleVisible: m
+  } = g, { showPicker: r, elements: n } = L({ plugins: N, showNumber: x }), e = V(null), [a, h] = j(!1);
+  k(f, () => ({
+    closeMore: () => {
+      h(!1);
+    }
+  }));
+  const i = (t) => {
+    var o, s;
+    t.stopPropagation(), h(!a), a || (s = (o = e == null ? void 0 : e.current) == null ? void 0 : o.offsetParent) == null || s.removeEventListener("scroll", i);
+  }, P = (t) => {
+    var o, s, p, d;
+    if (m) {
+      const {
+        width: $,
+        height: C
+      } = ((o = e == null ? void 0 : e.current) == null ? void 0 : o.children[1].getBoundingClientRect()) || {}, { x: E = 0, y: I = 0 } = ((s = e == null ? void 0 : e.current) == null ? void 0 : s.getBoundingClientRect()) || {};
+      (d = (p = e.current) == null ? void 0 : p.offsetParent) == null || d.addEventListener("scroll", i), m({
+        ...t,
+        width: $,
+        height: C,
+        x: E,
+        y: I
+      });
+    }
+  };
+  return (r && r.length > 0 || n && (n == null ? void 0 : n.length) > 0) && /* @__PURE__ */ u("ul", { className: `plugin ${b}`, children: [
+    r && (r == null ? void 0 : r.length) > 0 && r.map((t, o) => {
+      const s = `${t}${o}`;
+      return /* @__PURE__ */ l("li", { className: "plugin-item", children: t }, s);
+    }),
+    n && (n == null ? void 0 : n.length) > 0 && /* @__PURE__ */ u("div", { className: "plugin-popup", ref: e, children: [
+      /* @__PURE__ */ u("div", { role: "menuitem", tabIndex: 0, className: "more", onClick: i, children: [
+        !c && /* @__PURE__ */ l(B, { width: 20, height: 20, type: D.ADD }),
+        c && c
+      ] }),
+      /* @__PURE__ */ l(
+        H,
+        {
+          className: `plugin-popup-box ${w}`,
+          style: v,
+          show: a,
+          close: i,
+          root: y,
+          handleVisible: P,
+          children: /* @__PURE__ */ l("ul", { children: n.map((t, o) => {
+            const s = `${t}${o}`;
+            return /* @__PURE__ */ l("li", { className: "plugin-item", children: t }, s);
+          }) })
+        }
+      )
+    ] })
+  ] });
+}
+const G = S(M);
+export {
+  G as Plugins
+};

package/dist/components/Popup/index.d.ts

@@ -0,0 +1,11 @@
+import { default as React } from 'react';
+interface PopupProps {
+    className?: string;
+    style?: any;
+    show?: boolean;
+    close: (e: any) => void;
+    root?: any;
+    handleVisible?: (isVisible: any) => void;
+}
+export declare function Popup<T extends PopupProps>(props: React.PropsWithChildren<T>): React.ReactElement;
+export {};

package/dist/components/Popup/index.js

@@ -0,0 +1,56 @@
+import { jsx as f, Fragment as P } from "react/jsx-runtime";
+import { useRef as I, useState as x, useLayoutEffect as h } from "react";
+import '../../styles/index5.css';function N(g) {
+  const {
+    show: o,
+    close: c,
+    children: v,
+    className: w,
+    style: R,
+    root: s,
+    handleVisible: d
+  } = g, e = I(), [b, l] = x(!1);
+  h(() => {
+    var t, r;
+    return o ? (window.addEventListener("mouseup", c, !1), (t = e == null ? void 0 : e.current) == null || t.addEventListener("mouseup", u)) : (window.removeEventListener("mouseup", c, !1), (r = e == null ? void 0 : e.current) == null || r.removeEventListener("mouseup", u)), () => {
+      var i;
+      window.removeEventListener("mouseup", c, !1), (i = e == null ? void 0 : e.current) == null || i.removeEventListener("mouseup", u);
+    };
+  }, [o]), h(() => {
+    const t = new IntersectionObserver(([r]) => {
+      var m;
+      const {
+        boundingClientRect: i,
+        rootBounds: B,
+        intersectionRatio: E
+      } = r, L = ((m = e.current) == null ? void 0 : m.getBoundingClientRect()) || {}, C = (s == null ? void 0 : s.getBoundingClientRect()) || {}, n = {
+        ...i,
+        ...L
+      }, a = {
+        ...B,
+        ...C
+      };
+      d && E < 1 && d({
+        left: n.left - n.width < a.left,
+        top: n.bottom + n.height < a.bottom,
+        width: n.width,
+        height: n.height
+      }), l(!0);
+    }, {
+      root: s,
+      threshold: [1]
+    });
+    return e != null && e.current && o && t.observe(e == null ? void 0 : e.current), () => {
+      t.disconnect(), l(!1);
+    };
+  }, [e, o]);
+  const u = (t) => {
+    t.stopPropagation();
+  };
+  return /* @__PURE__ */ f(P, { children: o && // eslint-disable-next-line 
+  // @ts-ignore
+  /* @__PURE__ */ f("div", { role: "button", tabIndex: 0, style: R, className: `popup ${w} ${b && "popup-show"}`, ref: e, children: v }) });
+}
+export {
+  N as Popup
+};

package/dist/components/PopupNew/Popup.d.ts

@@ -0,0 +1,13 @@
+import { PopupProps } from '@mui/base/Unstable_Popup';
+interface IPopupProps {
+    children: React.ReactNode;
+    open: boolean;
+    anchor: PopupProps['anchor'];
+    slotProps?: PopupProps['slotProps'];
+    disablePortal?: PopupProps['disablePortal'];
+    strategy?: PopupProps['strategy'];
+    placement?: PopupProps['placement'];
+    offset?: number;
+}
+declare function Popup(props: IPopupProps): import("react/jsx-runtime").JSX.Element | null;
+export default Popup;

package/dist/components/PopupNew/Popup.js

@@ -0,0 +1,30 @@
+import { jsx as f } from "react/jsx-runtime";
+import { P as u } from "../../external_modules/mui-CbGEJVT2.js";
+function m(t) {
+  const {
+    anchor: o,
+    children: e,
+    open: r = !1,
+    placement: s = "top",
+    disablePortal: a = !1,
+    strategy: l = "absolute",
+    offset: p = 10,
+    slotProps: n = {}
+  } = t;
+  return o ? /* @__PURE__ */ f(
+    u,
+    {
+      open: r,
+      anchor: o,
+      placement: s,
+      disablePortal: a,
+      strategy: l,
+      slotProps: n,
+      offset: p,
+      children: e
+    }
+  ) : null;
+}
+export {
+  m as default
+};

package/dist/components/PopupNew/index.d.ts

@@ -0,0 +1,2 @@
+import { default as Popup } from './Popup';
+export default Popup;

package/dist/components/PopupNew/index.js

@@ -0,0 +1,4 @@
+import p from "./Popup.js";
+export {
+  p as default
+};

package/dist/components/Profile/DatePicker/DatePicker.d.ts

@@ -0,0 +1,11 @@
+import { default as React } from 'react';
+interface DatePickerProps {
+    value?: Date;
+    onChange?: (date: Date) => void;
+    isOpen?: boolean;
+    onClose?: () => void;
+    format?: string;
+    className?: string;
+}
+export declare const DatePicker: React.FC<DatePickerProps>;
+export default DatePicker;

package/dist/components/Profile/DatePicker/DatePicker.js

@@ -0,0 +1,104 @@
+import { jsxs as d, jsx as a } from "react/jsx-runtime";
+import { useState as p, useRef as L, useEffect as M } from "react";
+import { useUIKit as T, IconChevronLeft as m, IconChevronRight as u } from "@tencentcloud/uikit-base-component-react";
+import '../../../styles/DatePicker.css';const O = ({
+  value: c = /* @__PURE__ */ new Date(),
+  onChange: o,
+  isOpen: g = !1,
+  onClose: i,
+  format: j = "y-MM-dd",
+  className: N = ""
+}) => {
+  const { t: e } = T(), [t, l] = p(new Date(c.getFullYear(), c.getMonth(), 1)), [D, y] = p(c), k = L(null), P = () => [
+    e("DateRangePicker.January"),
+    e("DateRangePicker.February"),
+    e("DateRangePicker.March"),
+    e("DateRangePicker.April"),
+    e("DateRangePicker.May"),
+    e("DateRangePicker.June"),
+    e("DateRangePicker.July"),
+    e("DateRangePicker.August"),
+    e("DateRangePicker.September"),
+    e("DateRangePicker.October"),
+    e("DateRangePicker.November"),
+    e("DateRangePicker.December")
+  ], R = () => [
+    e("DateRangePicker.Sunday"),
+    e("DateRangePicker.Monday"),
+    e("DateRangePicker.Tuesday"),
+    e("DateRangePicker.Wednesday"),
+    e("DateRangePicker.Thursday"),
+    e("DateRangePicker.Friday"),
+    e("DateRangePicker.Saturday")
+  ];
+  M(() => {
+    c && (y(c), l(new Date(c.getFullYear(), c.getMonth(), 1)));
+  }, [c]), M(() => {
+    const n = (s) => {
+      k.current && !k.current.contains(s.target) && (i == null || i());
+    };
+    return g && document.addEventListener("mousedown", n), () => {
+      document.removeEventListener("mousedown", n);
+    };
+  }, [g, i]);
+  const f = (n) => new Date(n.getFullYear(), n.getMonth() + 1, 0).getDate(), w = (n) => new Date(n.getFullYear(), n.getMonth(), 1).getDay(), F = () => {
+    l(new Date(t.getFullYear(), t.getMonth() - 1, 1));
+  }, v = () => {
+    l(new Date(t.getFullYear(), t.getMonth() + 1, 1));
+  }, Y = () => {
+    l(new Date(t.getFullYear() - 1, t.getMonth(), 1));
+  }, b = () => {
+    l(new Date(t.getFullYear() + 1, t.getMonth(), 1));
+  }, S = (n) => {
+    const s = new Date(t.getFullYear(), t.getMonth(), n);
+    y(s), o == null || o(s), i == null || i();
+  }, x = () => {
+    const n = f(t), s = w(t), h = [];
+    for (let r = 0; r < s; r += 1)
+      h.push(/* @__PURE__ */ a("div", { className: "date-picker-day empty" }, `empty-${r}`));
+    for (let r = 1; r <= n; r += 1) {
+      const E = D.getDate() === r && D.getMonth() === t.getMonth() && D.getFullYear() === t.getFullYear(), J = (/* @__PURE__ */ new Date()).getDate() === r && (/* @__PURE__ */ new Date()).getMonth() === t.getMonth() && (/* @__PURE__ */ new Date()).getFullYear() === t.getFullYear();
+      h.push(
+        /* @__PURE__ */ a(
+          "div",
+          {
+            className: `date-picker-day ${E ? "selected" : ""} ${J ? "today" : ""}`,
+            onClick: () => S(r),
+            children: r
+          },
+          r
+        )
+      );
+    }
+    return h;
+  };
+  if (!g)
+    return null;
+  const I = P(), $ = R();
+  return /* @__PURE__ */ d("div", { ref: k, className: `date-picker ${N}`, children: [
+    /* @__PURE__ */ a("div", { className: "date-picker-header", children: /* @__PURE__ */ d("div", { className: "date-picker-nav", children: [
+      /* @__PURE__ */ d("button", { className: "date-picker-nav-btn", onClick: Y, children: [
+        /* @__PURE__ */ a(m, {}),
+        /* @__PURE__ */ a(m, {})
+      ] }),
+      /* @__PURE__ */ a("button", { className: "date-picker-nav-btn", onClick: F, children: /* @__PURE__ */ a(m, {}) }),
+      /* @__PURE__ */ d("div", { className: "date-picker-title", children: [
+        /* @__PURE__ */ a("span", { className: "date-picker-month", children: I[t.getMonth()] }),
+        /* @__PURE__ */ a("span", { className: "date-picker-year", children: t.getFullYear() })
+      ] }),
+      /* @__PURE__ */ a("button", { className: "date-picker-nav-btn", onClick: v, children: /* @__PURE__ */ a(u, {}) }),
+      /* @__PURE__ */ d("button", { className: "date-picker-nav-btn", onClick: b, children: [
+        /* @__PURE__ */ a(u, {}),
+        /* @__PURE__ */ a(u, {})
+      ] })
+    ] }) }),
+    /* @__PURE__ */ d("div", { className: "date-picker-body", children: [
+      /* @__PURE__ */ a("div", { className: "date-picker-weekdays", children: $.map((n) => /* @__PURE__ */ a("div", { className: "date-picker-weekday", children: n }, n)) }),
+      /* @__PURE__ */ a("div", { className: "date-picker-days", children: x() })
+    ] })
+  ] });
+};
+export {
+  O as DatePicker,
+  O as default
+};

package/dist/components/Profile/DatePicker/index.d.ts

@@ -0,0 +1 @@
+export * from './DatePicker';

package/dist/components/Profile/DatePicker/index.js

@@ -0,0 +1,4 @@
+import { DatePicker as o } from "./DatePicker.js";
+export {
+  o as DatePicker
+};

package/dist/components/Profile/Profile.d.ts

@@ -0,0 +1,8 @@
+import { default as React, PropsWithChildren } from 'react';
+interface TUIProfileProps {
+    className?: string | undefined;
+    TUIProfile?: React.ComponentType<any>;
+}
+declare function UnMemoizedProfile<T extends TUIProfileProps>(props: PropsWithChildren<T>): React.ReactElement;
+export declare const Profile: typeof UnMemoizedProfile;
+export {};

package/dist/components/Profile/Profile.js

@@ -0,0 +1,36 @@
+import { jsx as o, Fragment as n } from "react/jsx-runtime";
+import p from "react";
+import { MyProfile as P } from "./myProfile/MyProfile.js";
+import { useMyProfile as a } from "./hooks/useMyProfile.js";
+import { TUIProfileDefault as s } from "./ProfileDefault.js";
+import { useUIManagerState as I } from "../../states/UIManagerState.js";
+import "@tencentcloud/chat-uikit-engine";
+import "../../ChatSetting-C7QlwAiq.js";
+import "@tencentcloud/uikit-base-component-react";
+import "@tencentcloud/tui-core";
+import '../../styles/Profile.css';function U(i) {
+  const {
+    className: f,
+    TUIProfile: m
+  } = i, { myProfile: r, updateMyProfile: l } = a(), { setTUIProfileShow: e, TUIProfileShow: t } = I("TUIProfile");
+  return /* @__PURE__ */ o(n, { children: t ? /* @__PURE__ */ o(
+    m || s,
+    {
+      className: f,
+      userInfo: r,
+      update: l
+    }
+  ) : /* @__PURE__ */ o(
+    P,
+    {
+      profile: r,
+      handleAvatar: () => {
+        e && e(!t);
+      }
+    }
+  ) });
+}
+const C = p.memo(U);
+export {
+  C as Profile
+};

package/dist/components/Profile/ProfileDefault.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { Profile } from '@tencentcloud/chat';
+import { UpdateMyProfileParams } from '@tencentcloud/chat-uikit-engine';
+export interface TUIProfileDefaultProps {
+    userInfo?: Profile | undefined;
+    update?: ((option: UpdateMyProfileParams) => void) | undefined;
+    className?: string | undefined;
+}
+export declare function TUIProfileDefault(props: TUIProfileDefaultProps): React.ReactElement;