@oceanbase/ui 1.0.0-alpha.2 → 1.0.0-alpha.20

package/es/SideTip/index.js

@@ -1,3 +1,4 @@
+"use client";
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -11,25 +12,24 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { CloseOutlined } from '@oceanbase/icons';
-import { Badge, Tooltip } from '@oceanbase/design';
+import { Badge, ConfigProvider, Tooltip } from '@oceanbase/design';
 import classnames from 'classnames';
-import React, { createRef, useEffect, useState } from 'react';
+import React, { createRef, useCallback, useContext, useEffect, useState } from 'react';
 import LocaleWrapper from "../locale/LocaleWrapper";
-import { getPrefix } from "../_util";
+import useStyle from "./style";
 import Dragger from "./Dragger";
 import IconLoading from "./IconLoading";
 import zhCN from "./locale/zh-CN";
-// @ts-ignore
-import "./index.less";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-var STORE_SIDETIP_HIDE = 'ob-sidetip-hide';
-var getLocalStorageKey = function getLocalStorageKey(id) {
-  return ["".concat(STORE_SIDETIP_HIDE), id].join('-');
-};
 var SideTip = function SideTip(props) {
   var buttonRef = /*#__PURE__*/createRef();
+  var _useContext = useContext(ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext.getPrefixCls;
+  var prefixCls = getPrefixCls('sidetip');
+  var _useStyle = useStyle(prefixCls),
+    wrapSSR = _useStyle.wrapSSR;
   var defaultHide = props.defaultHide,
     onClick = props.onClick,
     open = props.open,
@@ -56,8 +56,14 @@ var SideTip = function SideTip(props) {
     disabled = _props$disabled === void 0 ? false : _props$disabled,
     _props$draggable = props.draggable,
     draggable = _props$draggable === void 0 ? true : _props$draggable,
-    getPopupContainer = props.getPopupContainer;
-  var _useState = useState(hideable ? defaultHide === undefined ? window.localStorage.getItem(getLocalStorageKey(id)) === 'true' : !!defaultHide : false),
+    getPopupContainer = props.getPopupContainer,
+    locale = props.locale;
+  var getLocalStorageKey = useCallback(function (localId) {
+    return ["".concat(prefixCls, "-hide"), localId].join('-');
+  }, [prefixCls]);
+
+  // Avoid SSR issue: same initial value on server and client, then sync from localStorage in useEffect
+  var _useState = useState(hideable ? !!defaultHide : false),
     _useState2 = _slicedToArray(_useState, 2),
     hide = _useState2[0],
     setHide = _useState2[1];
@@ -66,12 +72,19 @@ var SideTip = function SideTip(props) {
     hovered = _useState4[0],
     setHovered = _useState4[1];
   useEffect(function () {
+    if (typeof window === 'undefined' || !hideable) return;
+    if (defaultHide === undefined) {
+      setHide(window.localStorage.getItem(getLocalStorageKey(id)) === 'true');
+    }
+  }, [hideable, defaultHide, id, getLocalStorageKey]);
+  useEffect(function () {
+    if (typeof window === 'undefined') return;
     if (hide) {
       window.localStorage.setItem(getLocalStorageKey(id), 'true');
     } else {
       window.localStorage.removeItem(getLocalStorageKey(id));
     }
-  }, [hide]);
+  }, [hide, id, getLocalStorageKey]);
   var hideSideTip = function hideSideTip() {
     setHide(true);
   };
@@ -107,23 +120,29 @@ var SideTip = function SideTip(props) {
     if (sizeCls === 'small') return 'small';
     return '';
   };
-  var prefix = getPrefix('sidetip');
   var typeCls = getTypeCls(type);
   var sizeCls = getSizeCls(size);
-  var buttonPrefix = "".concat(prefix, "-button");
+  var toggleAriaLabel = typeof (tooltip === null || tooltip === void 0 ? void 0 : tooltip.title) === 'string' && tooltip.title.trim() ? tooltip.title : locale === null || locale === void 0 ? void 0 : locale.toggleLabel;
+  var onInnerKeyDown = function onInnerKeyDown(e) {
+    if (disabled) return;
+    if (e.key !== 'Enter' && e.key !== ' ') return;
+    e.preventDefault();
+    onButtonClick(e);
+  };
+  var buttonPrefix = "".concat(prefixCls, "-button");
 
   // icon
   var iconClassName = classnames("".concat(buttonPrefix, "-icon"), (open || visible) && "".concat(buttonPrefix, "-icon-open"), disabled && "".concat(buttonPrefix, "-icon-disabled"), typeCls && "".concat(buttonPrefix, "-icon-").concat(typeCls), sizeCls && "".concat(buttonPrefix, "-icon-").concat(sizeCls));
   // 接受三种形式的icon
-  var iconDom = /*#__PURE__*/_jsx("span", {
+  var iconDom = icon ? /*#__PURE__*/_jsx("span", {
     className: iconClassName,
-    children: /*#__PURE__*/React.isValidElement(icon) ? icon : /*#__PURE__*/_jsx("img", {
+    children: /*#__PURE__*/React.isValidElement(icon) ? icon : typeof icon === 'string' && icon ? /*#__PURE__*/_jsx("img", {
       src: icon,
-      alt: "icon",
+      alt: "",
       width: "100%",
       height: "100%"
-    })
-  });
+    }) : null
+  }) : null;
 
   // close 按钮
   var closeClassName = classnames("".concat(buttonPrefix, "-close"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(buttonPrefix, "-close-show"), open || visible), "".concat(buttonPrefix, "-close-").concat(typeCls), typeCls), "".concat(buttonPrefix, "-close-").concat(sizeCls), sizeCls));
@@ -135,11 +154,21 @@ var SideTip = function SideTip(props) {
     className: buttonClassName,
     ref: buttonRef,
     style: buttonStyle,
+    role: "button",
+    tabIndex: disabled ? -1 : 0,
+    "aria-disabled": disabled || undefined,
+    "aria-expanded": !!(open || visible),
+    "aria-haspopup": "dialog",
+    "aria-label": toggleAriaLabel,
+    onKeyDown: onInnerKeyDown,
     children: [loading && /*#__PURE__*/_jsx(IconLoading, {
       className: loadingClassName
     }), /*#__PURE__*/_jsxs(_Fragment, {
-      children: [iconDom, /*#__PURE__*/_jsx(CloseOutlined, {
-        className: closeClassName
+      children: [iconDom, /*#__PURE__*/_jsx("span", {
+        "aria-hidden": true,
+        children: /*#__PURE__*/_jsx(CloseOutlined, {
+          className: closeClassName
+        })
       })]
     })]
   });
@@ -150,18 +179,22 @@ var SideTip = function SideTip(props) {
   }, badge), {}, {
     children: InnerButton
   })) : InnerButton;
-  var hideIconClassName = classnames("".concat(prefix, "-hide"), _defineProperty({}, "".concat(prefix, "-hide-hovered"), hovered));
+  var hideIconClassName = classnames("".concat(prefixCls, "-hide"), _defineProperty({}, "".concat(prefixCls, "-hide-hovered"), hovered));
 
   // 隐藏按钮
-  var hideIcon = /*#__PURE__*/_jsx("div", {
+  var hideIcon = /*#__PURE__*/_jsx("button", {
+    type: "button",
     id: "ui-mini-hide",
     onClick: hideSideTip,
     className: hideIconClassName,
-    children: /*#__PURE__*/_jsx("div", {
-      className: "".concat(prefix, "-hide-icon")
+    "aria-label": locale === null || locale === void 0 ? void 0 : locale.hideFloatingButton,
+    children: /*#__PURE__*/_jsx("span", {
+      className: "".concat(prefixCls, "-hide-icon"),
+      "aria-hidden": true
     })
   });
-  return /*#__PURE__*/_jsxs(Dragger, {
+  var containerClassName = classnames(className, _defineProperty({}, "".concat(prefixCls, "-container-disabled"), disabled));
+  return wrapSSR( /*#__PURE__*/_jsxs(Dragger, {
     id: id,
     open: open || visible,
     hide: hide,
@@ -171,12 +204,12 @@ var SideTip = function SideTip(props) {
     onMouseLeave: handleMouseLeave,
     style: style,
     position: position,
-    prefix: prefix,
+    prefix: prefixCls,
     onDragStart: onDragStart,
     onDragEnd: onDragEnd,
     onDrag: onDrag,
     getPopupContainer: getPopupContainer,
-    className: className,
+    className: containerClassName,
     draggable: draggable,
     children: [tooltip && tooltip.title ? /*#__PURE__*/_jsx(Tooltip, _objectSpread(_objectSpread({}, tooltip), {}, {
       getPopupContainer: function getPopupContainer() {
@@ -184,7 +217,7 @@ var SideTip = function SideTip(props) {
       },
       children: BadgeButton
     })) : BadgeButton, hideable && hideIcon, children]
-  });
+  }));
 };
 export default LocaleWrapper({
   componentName: 'SideTip',

package/es/SideTip/locale/en-US.d.ts

@@ -1,2 +1,5 @@
-declare const _default: {};
+declare const _default: {
+    toggleLabel: string;
+    hideFloatingButton: string;
+};
 export default _default;

package/es/SideTip/locale/en-US.js

@@ -1 +1,4 @@
-export default {};
+export default {
+  toggleLabel: 'Open side tip',
+  hideFloatingButton: 'Hide floating button'
+};

package/es/SideTip/locale/ja-JP.d.ts

@@ -0,0 +1,5 @@
+declare const _default: {
+    toggleLabel: string;
+    hideFloatingButton: string;
+};
+export default _default;

package/es/SideTip/locale/ja-JP.js

@@ -0,0 +1,4 @@
+export default {
+  toggleLabel: 'サイドヒントを開く',
+  hideFloatingButton: 'フローティングボタンを非表示'
+};

package/es/SideTip/locale/zh-CN.d.ts

@@ -1,2 +1,5 @@
-declare const _default: {};
+declare const _default: {
+    toggleLabel: string;
+    hideFloatingButton: string;
+};
 export default _default;

package/es/SideTip/locale/zh-CN.js

@@ -1 +1,4 @@
-export default {};
+export default {
+  toggleLabel: '打开侧边提示',
+  hideFloatingButton: '隐藏悬浮按钮'
+};

package/es/SideTip/locale/zh-TW.d.ts

@@ -1,2 +1,5 @@
-declare const _default: {};
+declare const _default: {
+    toggleLabel: string;
+    hideFloatingButton: string;
+};
 export default _default;

package/es/SideTip/locale/zh-TW.js

@@ -1 +1,4 @@
-export default {};
+export default {
+  toggleLabel: '開啟側邊提示',
+  hideFloatingButton: '隱藏浮動按鈕'
+};

package/es/SideTip/style/index.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { GenerateStyle } from '@oceanbase/design/es/theme';
+import type { OBToken } from '../../_util/genComponentStyleHook';
+export type SideTipToken = OBToken;
+export declare const genSideTipStyle: GenerateStyle<SideTipToken>;
+declare const _default: (prefixCls: string) => {
+    wrapSSR: (node: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => import("react").JSX.Element;
+    hashId: string;
+};
+export default _default;

package/es/SideTip/style/index.js

@@ -0,0 +1,171 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
+export var genSideTipStyle = function genSideTipStyle(token) {
+  var componentCls = token.componentCls,
+    boxShadowSecondary = token.boxShadowSecondary,
+    colorTextQuaternary = token.colorTextQuaternary,
+    colorTextSecondary = token.colorTextSecondary;
+  return _defineProperty({}, "".concat(componentCls, "-container"), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
+    position: 'fixed',
+    zIndex: 0,
+    fontSize: 14,
+    cursor: 'pointer',
+    insetInlineEnd: 24,
+    insetBlockEnd: 24
+  }, "&.".concat(componentCls, "-container-dragged"), {
+    cursor: 'grab'
+  }), "&.".concat(componentCls, "-container-disabled"), {
+    cursor: 'not-allowed'
+  }), "&.".concat(componentCls, "-container-hide"), {
+    transition: 'all 0.3s'
+  }), '@media screen and (max-width: 768px)', {
+    display: 'none'
+  }), "&.".concat(componentCls, "-container-hide-not-dragged:hover"), {
+    insetInlineEnd: '0 !important'
+  }), "".concat(componentCls, "-hide"), _defineProperty(_defineProperty({
+    position: 'absolute',
+    zIndex: 0,
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    width: 20,
+    height: 20,
+    background: 'rgba(0, 0, 0, 0.15)',
+    borderRadius: 20,
+    transform: 'scale(0)',
+    cursor: 'pointer',
+    opacity: 0,
+    transition: 'all 0.18s ease-out 0.18s',
+    insetBlockStart: 0,
+    insetInlineEnd: -22,
+    border: 'none',
+    padding: 0,
+    font: 'inherit',
+    appearance: 'none',
+    WebkitAppearance: 'none',
+    '&:hover': {
+      background: 'rgba(0, 0, 0, 0.35)'
+    }
+  }, "".concat(componentCls, "-hide-icon"), {
+    width: 6,
+    height: 2,
+    background: '#fff',
+    borderRadius: 4
+  }), "&.".concat(componentCls, "-hide-hovered"), {
+    transform: 'scale(1)',
+    opacity: 1
+  })), "".concat(componentCls, "-button"), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
+    position: 'relative',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    width: 56,
+    height: 56,
+    backgroundColor: '#fff',
+    borderRadius: '50%',
+    boxShadow: boxShadowSecondary,
+    cursor: 'pointer',
+    transition: 'background-color 0.2s ease 0.1s, opacity 0.2s ease 0s, transform 0.2s ease 0.1s',
+    userSelect: 'none',
+    '&:focus-visible': {
+      outline: "2px solid ".concat(token.colorPrimary),
+      outlineOffset: 2
+    }
+  }, "&".concat(componentCls, "-button-primary"), {
+    backgroundColor: "".concat(token.colorPrimary, " !important")
+  }), "&".concat(componentCls, "-button-small"), {
+    width: 40,
+    height: 40
+  }), "&".concat(componentCls, "-button-disabled"), {
+    backgroundColor: "".concat(colorTextQuaternary, " !important"),
+    cursor: 'not-allowed'
+  }), '&:hover', {
+    opacity: 1
+  }), "".concat(componentCls, "-button-loading"), _defineProperty(_defineProperty({
+    position: 'absolute',
+    width: 56,
+    height: 56,
+    color: token.colorPrimary,
+    fontSize: 56,
+    insetBlockStart: 0,
+    insetInlineEnd: 0
+  }, "&".concat(componentCls, "-button-loading-primary"), {
+    color: '#fff'
+  }), "&".concat(componentCls, "-button-loading-small"), {
+    width: 40,
+    height: 40,
+    fontSize: 40,
+    lineHeight: 40
+  })), "".concat(componentCls, "-button-close"), _defineProperty(_defineProperty(_defineProperty({
+    position: 'absolute',
+    width: 24,
+    height: 24,
+    color: colorTextSecondary,
+    fontSize: 24,
+    transform: 'translate(-50%, -50%) scale(0.4) rotate(-45deg)',
+    opacity: 0,
+    transition: 'all 0.3s linear',
+    userSelect: 'none',
+    insetBlockStart: '50%',
+    insetInlineStart: '50%'
+  }, "&.".concat(componentCls, "-button-close-primary"), {
+    color: '#fff'
+  }), "&.".concat(componentCls, "-button-close-show"), {
+    transform: 'translate(-50%, -50%)',
+    opacity: 1
+  }), "&.".concat(componentCls, "-button-close-small"), {
+    width: 16,
+    height: 16,
+    fontSize: 16,
+    lineHeight: 16
+  })), "".concat(componentCls, "-button-icon"), _defineProperty(_defineProperty(_defineProperty(_defineProperty({
+    position: 'absolute',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    width: 24,
+    height: 24,
+    color: colorTextSecondary,
+    fontSize: 24,
+    lineHeight: 24,
+    transform: 'translate(-50%, -50%)',
+    opacity: 1,
+    transition: 'all 0.3s linear',
+    userSelect: 'none',
+    insetBlockStart: '50%',
+    insetInlineStart: '50%',
+    '> *': {
+      fontSize: 'inherit',
+      color: 'inherit'
+    },
+    img: {
+      width: '100%',
+      height: '100%',
+      objectFit: 'contain'
+    }
+  }, "&.".concat(componentCls, "-button-icon-open"), {
+    transform: 'translate(-50%, -50%) scale(0.4) rotate(45deg)',
+    opacity: 0
+  }), "&.".concat(componentCls, "-button-icon-disabled"), {
+    color: colorTextQuaternary
+  }), "&".concat(componentCls, "-button-icon-primary"), {
+    color: '#fff !important',
+    '> *': {
+      color: '#fff !important'
+    }
+  }), "&".concat(componentCls, "-button-icon-small"), {
+    width: 16,
+    height: 16,
+    fontSize: 16,
+    lineHeight: 16
+  }))));
+};
+export default (function (prefixCls) {
+  var useStyle = genComponentStyleHook('SideTip', function (token) {
+    return [genSideTipStyle(token)];
+  });
+  return useStyle(prefixCls);
+});

package/es/TagSelect/Group.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import React from 'react';
 export type TagSelectValueType = string | number | readonly string[];
 export interface TagSelectOptionType {
     label: React.ReactNode;
@@ -9,15 +9,15 @@ export interface TagSelectOptionType {
 }
 export interface TagSelectGroupProps {
     title?: string;
-    children?: ReactNode;
+    children?: React.ReactNode;
     disabled?: boolean;
     className?: string;
     multiple?: boolean;
-    defaultValue?: TagSelectValueType | Array<TagSelectValueType>;
-    value?: TagSelectValueType | Array<TagSelectValueType>;
+    defaultValue?: TagSelectValueType | TagSelectValueType[];
+    value?: TagSelectValueType | TagSelectValueType[];
     size?: string;
-    options?: Array<TagSelectOptionType | string | number>;
-    onChange?: (value: Array<TagSelectValueType> | TagSelectValueType) => void;
+    options?: (TagSelectOptionType | string | number)[];
+    onChange?: (value: TagSelectValueType[] | TagSelectValueType) => void;
 }
 declare const Group: React.FC<TagSelectGroupProps>;
 export default Group;

package/es/TagSelect/Group.js

@@ -1,3 +1,4 @@
+"use client";
 var _excluded = ["title", "multiple", "defaultValue", "size", "options", "children", "className"];
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -12,8 +13,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import classNames from 'classnames';
-import { getPrefix } from "../_util";
-import React, { useMemo, useState, useEffect } from 'react';
+import { ConfigProvider } from '@oceanbase/design';
+import React, { useContext, useId, useMemo, useState, useEffect } from 'react';
 import TagSelectContext from "./TagSelectContext";
 import Item from "./Item";
 import useStyle from "./style";
@@ -39,7 +40,9 @@ var Group = function Group(_ref) {
     children = _ref.children,
     className = _ref.className,
     restProps = _objectWithoutProperties(_ref, _excluded);
-  var prefix = getPrefix('tag-select');
+  var _useContext = useContext(ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext.getPrefixCls;
+  var prefix = getPrefixCls('tag-select');
   var _useStyle = useStyle(prefix),
     wrapSSR = _useStyle.wrapSSR,
     hashId = _useStyle.hashId;
@@ -112,12 +115,16 @@ var Group = function Group(_ref) {
     }, option.value.toString());
   }) : children;
   var groupCls = classNames("".concat(prefix, "-container"), hashId, className);
+  var titleId = useId();
   return wrapSSR( /*#__PURE__*/_jsx(TagSelectContext.Provider, {
     value: contextValue,
     children: /*#__PURE__*/_jsxs("div", {
       className: groupCls,
-      children: [/*#__PURE__*/_jsx("div", {
+      role: "group",
+      "aria-labelledby": title ? titleId : undefined,
+      children: [title && /*#__PURE__*/_jsx("div", {
         className: "".concat(prefix, "-title"),
+        id: titleId,
         children: title
       }), childrenNode]
     })

package/es/TagSelect/Item.js

@@ -1,3 +1,4 @@
+"use client";
 var _excluded = ["children", "handleChange", "onChange", "cover"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -16,9 +17,9 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import RcCheckBox from 'rc-checkbox';
 import classNames from 'classnames';
 import { isBoolean } from 'lodash';
-import React, { useEffect, useState } from 'react';
+import React, { useContext, useEffect, useState } from 'react';
+import { ConfigProvider } from '@oceanbase/design';
 import useStyle from "./style";
-import { getPrefix } from "../_util";
 import TagSelectContext from "./TagSelectContext";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -33,7 +34,9 @@ var Item = function Item(_ref) {
     checked = _useState2[0],
     setChecked = _useState2[1];
   var coverType = _typeof(cover);
-  var prefixCls = getPrefix('tag-select');
+  var _useContext = useContext(ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext.getPrefixCls;
+  var prefixCls = getPrefixCls('tag-select');
   var _useStyle = useStyle(prefixCls),
     wrapSSR = _useStyle.wrapSSR,
     hashId = _useStyle.hashId;
@@ -57,11 +60,12 @@ var Item = function Item(_ref) {
     }
   }, [tagSelectGroup.value, restProps.value]);
   var renderCover = function renderCover() {
+    var _restProps$title;
     return coverType === 'string' ? /*#__PURE__*/_jsx("div", {
       className: "".concat(prefixCls, "-cover"),
       children: /*#__PURE__*/_jsx("img", {
         src: cover,
-        alt: "tagselect"
+        alt: (_restProps$title = restProps.title) !== null && _restProps$title !== void 0 ? _restProps$title : ''
       })
     }) : cover;
   };

package/es/TagSelect/index.js

@@ -1,3 +1,4 @@
+"use client";
 import Group from "./Group";
 import Item from "./Item";
 export default {

package/es/TreeSearch/index.js

@@ -1,3 +1,4 @@
+"use client";
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

package/es/Welcome/index.d.ts

@@ -1,6 +1,5 @@
 import type { ButtonProps } from '@oceanbase/design/es/button';
 import React from 'react';
-import './index.less';
 export interface IntroduceItem {
     image: string;
     title: string;