@alifd/chat 0.0.1 → 0.1.1

package/lib/float-button/index.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const float_button_1 = tslib_1.__importDefault(require("./view/float-button"));
 const backtop_1 = tslib_1.__importDefault(require("./view/backtop"));
+const inner_drawer_1 = tslib_1.__importDefault(require("./view/inner-drawer"));
 const index_1 = require("../utils/index");
-const FloatButtonWithSub = (0, index_1.assignSubComponent)(float_button_1.default, { Backtop: backtop_1.default });
+const FloatButtonWithSub = (0, index_1.assignSubComponent)(float_button_1.default, { Backtop: backtop_1.default, InnerDrawer: inner_drawer_1.default });
 exports.default = FloatButtonWithSub;

package/lib/float-button/main.scss

@@ -1,16 +1,79 @@
-@import '~@alifd/next/variables.scss';
+@import '../core/variables.scss';
 
-.#{$css-prefix}float-button {
-  position: fixed;
-  z-index: 1001;
+.#{$prefix}float-button {
+    position: fixed;
+    z-index: 1001;
 
-  &-backtop {
-    transition: opacity 0.2s, transform 0.2s;
-    cursor: pointer;
+    &-backtop {
+        transition:
+            opacity 0.2s,
+            transform 0.2s;
+        cursor: pointer;
 
-    &--hidden {
-      opacity: 0;
-      transform: scale(0);
+        &--hidden {
+            opacity: 0;
+            transform: scale(0);
+        }
+    }
+
+    &-inner-drawer {
+        flex: 1;
+        display: flex;
+        overflow: hidden;
+        display: flex;
+        box-shadow: $shadow-2;
+        border-radius: $size-base * 2;
+
+        &-outer {
+            display: flex;
+        }
+        &-inner-start {
+            flex: 1;
+        }
+        &-inner-end {
+            flex: none;
+            transition:
+                width 0.3s,
+                opacity 0.3s;
+            display: flex;
+        }
+        &-inner {
+            flex: 1;
+            display: flex;
+            flex-direction: column;
+        }
+        &-header {
+            flex: none;
+            display: flex;
+            justify-content: end;
+            padding: $size-base * 2 $size-base * 3;
+            &-title {
+                flex: 1;
+                font-size: $font-size-subhead;
+                line-height: 1.5;
+            }
+            &-close {
+                flex: none;
+                color: $color-text1-2;
+                cursor: pointer;
+                transition: color 0.15s;
+                outline: 0;
+                border: 0;
+                padding: 0;
+                align-self: flex-start;
+                background-color: transparent;
+
+                &:hover {
+                    color: $color-brand1-6;
+                }
+            }
+        }
+        &-body {
+            flex: 1;
+            padding: 0 $size-base * 3 $size-base * 2;
+        }
+        &-footer {
+            flex: none;
+        }
     }
-  }
 }

package/lib/float-button/style.d.ts

@@ -1,2 +1,3 @@
 import '@alifd/next/lib/balloon/style';
+import '@alifd/next/lib/drawer/style';
 import './main.scss';

package/lib/float-button/style.js

@@ -1,4 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 require("@alifd/next/lib/balloon/style");
+require("@alifd/next/lib/drawer/style");
 require("./main.scss");

package/lib/float-button/types.d.ts

@@ -1,4 +1,4 @@
-import type React from 'react';
+import React, { type ReactNode } from 'react';
 import { type CommonProps } from '@alifd/next';
 import { type BalloonProps } from '@alifd/next/lib/balloon';
 export type { BalloonProps };
@@ -100,6 +100,8 @@ export interface FloatButtonRef {
      */
     updateNestleEdge(animation?: boolean): void;
 }
+export type TriggerType = 'hover' | 'click';
+export type RequiredParts<O, K extends keyof O> = Omit<O, K> & Required<Pick<O, K>>;
 /**
  * @api FloatButton
  * @order 1
@@ -116,6 +118,11 @@ export interface FloatButtonProps extends CommonProps {
      * - `inner-drawer`: 文档内部抽屉
      */
     type?: 'balloon' | 'drawer' | 'inner-drawer';
+    drawerProps?: {
+        title?: ReactNode;
+        width?: number | string;
+        target: string | (() => HTMLElement);
+    };
     /**
      * 弹层位置，适用 `type`: 'balloon'
      */
@@ -196,7 +203,7 @@ export interface FloatButtonProps extends CommonProps {
      * 触发方式
      * @defaultValue 'click'
      */
-    triggerType?: BalloonProps['triggerType'];
+    triggerType?: TriggerType | TriggerType[];
     /**
      * 展示关闭按钮
      * @defaultValue false
@@ -210,6 +217,7 @@ export interface FloatButtonProps extends CommonProps {
      * 弹层内容
      */
     children?: React.ReactNode;
+    _renderView?: (prefix: string, props: RequiredParts<FloatButtonProps, 'visible' | 'onVisibleChange'>) => ReactNode;
 }
 /**
  * @api
@@ -223,3 +231,11 @@ export interface DragableOption {
     onDraging?: (dom: HTMLElement, event: MouseEvent) => void | false;
     onDragend?: (dom: HTMLElement) => void;
 }
+/**
+ * @api FloatButton.InnerDrawer
+ */
+export interface FloatButtonInnerDrawerProps extends FloatButtonProps {
+    width?: string | number;
+    target: string | (() => HTMLElement);
+    title?: ReactNode;
+}

package/lib/float-button/view/backtop.js

@@ -14,9 +14,9 @@ function getScroller(scroller) {
     }
     return scroller;
 }
-const Backtop = (0, react_1.forwardRef)(({ prefix = 'next-', autoHide = true, scroller, offset = 10, smooth = true, children }, ref) => {
+const Backtop = (0, react_1.forwardRef)(({ autoHide = true, scroller, offset = 10, smooth = true, children }, ref) => {
     const [visible, setVisible] = (0, react_1.useState)(true);
-    const cls = `${prefix}float-button-backtop`;
+    const cls = `${utils_1.PREFIX_DEFAULT}float-button-backtop`;
     const visibleRef = (0, react_1.useRef)(visible);
     visibleRef.current = visible;
     const handleBackToTop = () => {

package/lib/float-button/view/drawer.d.ts

@@ -1,2 +1,8 @@
 import React from 'react';
-export declare function Drawer(): React.JSX.Element;
+import type { DrawerProps as NextDrawerProps } from '@alifd/next/types/drawer';
+import type { TriggerType } from '../types';
+export interface DrawerProps extends Omit<NextDrawerProps, 'triggerType' | 'container' | 'onVisibleChange'> {
+    onVisibleChange?: (visible: boolean, reason: string) => void;
+    triggerType?: TriggerType | TriggerType[];
+}
+export declare function Drawer({ prefix, target, children, trigger, triggerType, visible, onVisibleChange, ...rests }: DrawerProps): React.JSX.Element;

package/lib/float-button/view/drawer.js

@@ -3,7 +3,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Drawer = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-function Drawer() {
-    return (react_1.default.createElement("div", null, "drawer"));
+const next_1 = require("@alifd/next");
+const useTriggerType_1 = require("../hooks/useTriggerType");
+function Drawer(_a) {
+    var { prefix, target, children, trigger, triggerType, visible, onVisibleChange } = _a, rests = tslib_1.__rest(_a, ["prefix", "target", "children", "trigger", "triggerType", "visible", "onVisibleChange"]);
+    const handlers = (0, useTriggerType_1.useTriggerType)({ visible, onVisibleChange, triggerType });
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", Object.assign({}, handlers), trigger),
+        react_1.default.createElement(next_1.Drawer, Object.assign({}, rests, { visible: visible, onClose: reason => {
+                onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(false, reason);
+            }, v2: true }), children)));
 }
 exports.Drawer = Drawer;

package/lib/float-button/view/float-button.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import type { FloatButtonProps, FloatButtonRef } from '../types';
-declare const _default: import("@alifd/next/types/config-provider/types").ConfiguredComponentClass<Pick<FloatButtonProps & React.RefAttributes<FloatButtonRef>, keyof FloatButtonProps | "key"> & import("@alifd/next/types/config-provider/types").ComponentCommonProps, FloatButtonRef, {}>;
+declare const _default: import("@alifd/next/types/config-provider/types").ConfiguredComponentClass<Pick<FloatButtonProps & React.RefAttributes<FloatButtonRef>, "key" | keyof FloatButtonProps> & import("@alifd/next/types/config-provider/types").ComponentCommonProps, FloatButtonRef, {}>;
 export default _default;

package/lib/float-button/view/float-button.js

@@ -9,14 +9,34 @@ const useAutoHide_1 = require("../hooks/useAutoHide");
 const useAutoAlign_1 = require("../hooks/useAutoAlign");
 const useNestleEdge_1 = require("../hooks/useNestleEdge");
 const useDragable_1 = require("../hooks/useDragable");
-const FloatButton = (0, react_1.forwardRef)((_a, ref) => {
-    var { className, style, prefix = 'next-', type = 'balloon', addonAfter, addonBefore, dragable, safeAreaMargin = [10, 10, 10, 10], autoNestleEdge = true, interactiveEdges = ['left', 'right'], autoHide, autoAlign, leftSizeOfHidden, defaultPosition, trigger, triggerType = 'click', showClose = false, align, balloonProps, children } = _a, others = tslib_1.__rest(_a, ["className", "style", "prefix", "type", "addonAfter", "addonBefore", "dragable", "safeAreaMargin", "autoNestleEdge", "interactiveEdges", "autoHide", "autoAlign", "leftSizeOfHidden", "defaultPosition", "trigger", "triggerType", "showClose", "align", "balloonProps", "children"]);
+// import { InnerDrawer } from './inner-drawer';
+/**
+ * @component 悬浮球
+ * @en FloatButton
+ * @type 通用 - General
+ * @remarks 悬浮球组件用于承载机器人入口。- Apply for entry for web bot.
+ * @when 机器人入口 - The entry of robot
+ * @others
+ * ## 无障碍键盘操作指南
+ * | 按键    | 说明          |
+ * | :---- | :---------- |
+ * | Enter | 触发 onClick 事件 |
+ * | SPACE | 触发 onClick 事件 |
+ * @othersEn
+ * ## ARIA and KeyBoard
+ * | KeyBoard          | Description                              |
+ * | :---------- | :------------------------------ |
+ * | Enter       | Trigger the onClick event    |
+ * | SPACE       | Trigger the onClick event    |
+ */
+const FloatButton = (0, react_1.forwardRef)((props, ref) => {
+    const { className, style, type = 'balloon', addonAfter, addonBefore, dragable, safeAreaMargin = [10, 10, 10, 10], autoNestleEdge = true, interactiveEdges = ['left', 'right'], autoHide, autoAlign, leftSizeOfHidden, defaultPosition, trigger, triggerType = 'click', showClose = true, align, balloonProps, drawerProps, children, _renderView } = props, others = tslib_1.__rest(props, ["className", "style", "type", "addonAfter", "addonBefore", "dragable", "safeAreaMargin", "autoNestleEdge", "interactiveEdges", "autoHide", "autoAlign", "leftSizeOfHidden", "defaultPosition", "trigger", "triggerType", "showClose", "align", "balloonProps", "drawerProps", "children", "_renderView"]);
     const elRef = (0, react_1.useRef)(null);
     const triggerRef = (0, react_1.useRef)(null);
     const [el, setEl] = (0, react_1.useState)(null);
     const [triggerEl, setTriggerEl] = (0, react_1.useState)(null);
     const draggedRef = (0, react_1.useRef)(false);
-    const cls = `${prefix}float-button`;
+    const cls = `${index_1.PREFIX_DEFAULT}float-button`;
     const [visible, onVisibleChange] = (0, index_1.useControlable)(others, {
         valueName: 'visible',
         changeName: 'onVisibleChange',
@@ -25,10 +45,13 @@ const FloatButton = (0, react_1.forwardRef)((_a, ref) => {
         setEl(elRef.current);
         setTriggerEl(triggerRef.current);
     }, []);
-    const { align: currentAlign, update: updateAlign } = (0, useAutoAlign_1.useAutoAlign)(el === null || el === void 0 ? void 0 : el.querySelector(`.${cls}-popup`), triggerEl, {
+    const { align: currentAlign, update: _updateAlign } = (0, useAutoAlign_1.useAutoAlign)(el === null || el === void 0 ? void 0 : el.querySelector(`.${cls}-popup`), triggerEl, {
         enable: type === 'balloon' && autoAlign,
         defaultAlign: align,
     });
+    const updateAlign = () => {
+        _updateAlign(el === null || el === void 0 ? void 0 : el.querySelector(`.${cls}-popup`));
+    };
     const { isHideRef, setHide, handleMove, saveRestorePosition } = (0, useAutoHide_1.useAutoHide)(el, {
         enable: !visible && autoHide,
         interactiveEdges,
@@ -37,7 +60,6 @@ const FloatButton = (0, react_1.forwardRef)((_a, ref) => {
     (0, react_1.useEffect)(() => {
         if (visible) {
             setHide(false);
-            updateAlign();
         }
     }, [visible]);
     const { update: updateNestleEdge } = (0, useNestleEdge_1.useNestleEdge)(el, {
@@ -50,6 +72,9 @@ const FloatButton = (0, react_1.forwardRef)((_a, ref) => {
                 return false;
             }
         },
+        onUpdateEnd() {
+            updateAlign();
+        },
     });
     (0, react_1.useImperativeHandle)(ref, () => ({
         setVisible(value) {
@@ -83,32 +108,50 @@ const FloatButton = (0, react_1.forwardRef)((_a, ref) => {
         },
     });
     const classNames = (0, classnames_1.default)(cls, className, dragClassName);
+    const handleVisibleChange = (v, type) => {
+        if (draggedRef.current) {
+            return;
+        }
+        onVisibleChange(v, type);
+    };
     const renderBalloon = () => {
-        return (react_1.default.createElement(next_1.Balloon, Object.assign({ visible: visible, onVisibleChange: (...args) => {
-                if (draggedRef.current) {
-                    return;
-                }
-                onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(...args);
+        return (react_1.default.createElement(next_1.Balloon, Object.assign({ visible: visible, onVisibleChange: handleVisibleChange, popupProps: {
+                afterOpen() {
+                    var _a, _b;
+                    updateAlign();
+                    (_b = (_a = balloonProps === null || balloonProps === void 0 ? void 0 : balloonProps.popupProps) === null || _a === void 0 ? void 0 : _a.afterClose) === null || _b === void 0 ? void 0 : _b.call(_a);
+                },
             }, popupClassName: `${cls}-popup`, trigger: trigger, popupContainer: () => el, triggerType: triggerType, align: currentAlign, v2: true, closable: showClose, autoAdjust: false }, balloonProps), children));
     };
-    const renderDrawer = () => {
-        return react_1.default.createElement("div", null);
-    };
-    const renderInnerDrawer = () => {
-        return react_1.default.createElement("div", null);
-    };
+    // const renderDrawer = () => {
+    //     return <div></div>;
+    // };
+    // const renderInnerDrawer = () => {
+    //     return (
+    //         <InnerDrawer
+    //             {...drawerProps}
+    //             prefix={`${cls}-`}
+    //             target=".card-legal-affairs"
+    //             trigger={trigger}
+    //             triggerType={triggerType}
+    //             visible={visible}
+    //             closable={showClose}
+    //             onVisibleChange={(...args) => {
+    //                 if (draggedRef.current) {
+    //                     return;
+    //                 }
+    //                 onVisibleChange?.(...args);
+    //             }}
+    //         >
+    //             {children}
+    //         </InnerDrawer>
+    //     );
+    // };
     const renderView = () => {
-        switch (type) {
-            case 'drawer': {
-                return renderDrawer();
-            }
-            case 'inner-drawer': {
-                return renderInnerDrawer();
-            }
-            default: {
-                return renderBalloon();
-            }
+        if (typeof _renderView === 'function') {
+            return _renderView(`${cls}-`, Object.assign(Object.assign({}, props), { visible, onVisibleChange: handleVisibleChange }));
         }
+        return renderBalloon();
     };
     return (react_1.default.createElement("div", { className: classNames, style: Object.assign(Object.assign({}, style), dragStyle), ref: elRef },
         !!addonBefore && (react_1.default.createElement("div", { className: (0, classnames_1.default)(`${cls}-addon`, `${cls}-addon--before`) }, addonBefore)),

package/lib/float-button/view/inner-drawer.d.ts

@@ -1,2 +1,18 @@
-import React from 'react';
-export declare function InnerDrawer(): React.JSX.Element;
+import React, { type ReactNode } from 'react';
+import type { FloatButtonInnerDrawerProps, FloatButtonProps } from '../types';
+export interface InnerDrawerProps {
+    className?: string;
+    title?: ReactNode;
+    prefix: string;
+    target: string | (() => HTMLElement);
+    visible?: boolean;
+    onVisibleChange?: (visible: boolean, reason: string) => void;
+    children?: ReactNode;
+    trigger: ReactNode;
+    closable?: boolean;
+    triggerType: FloatButtonProps['triggerType'];
+    width?: string | number;
+}
+export declare function InnerDrawer({ className, prefix, target, children, trigger, triggerType, visible, onVisibleChange, closable, title, width, }: InnerDrawerProps): React.JSX.Element;
+declare const _default: import("@alifd/next/types/config-provider/types").ConfiguredComponentClass<FloatButtonInnerDrawerProps & import("@alifd/next/types/config-provider/types").ComponentCommonProps, undefined, {}>;
+export default _default;

package/lib/float-button/view/inner-drawer.js

@@ -2,8 +2,118 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.InnerDrawer = void 0;
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-function InnerDrawer() {
-    return react_1.default.createElement("div", null, "inner-drawer");
+const react_1 = tslib_1.__importStar(require("react"));
+const react_dom_1 = tslib_1.__importDefault(require("react-dom"));
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const next_1 = require("@alifd/next");
+const useTriggerType_1 = require("../hooks/useTriggerType");
+const float_button_1 = tslib_1.__importDefault(require("./float-button"));
+function getTarget(target) {
+    if (typeof target === 'string') {
+        return document.querySelector(target);
+    }
+    return target();
+}
+function getMountTarget(prefix, target) {
+    const dom = getTarget(target);
+    let parent = dom === null || dom === void 0 ? void 0 : dom.parentElement;
+    if (!dom || !parent) {
+        return null;
+    }
+    if (!parent.dataset.chat) {
+        const oldParent = parent;
+        parent = document.createElement('div');
+        parent.classList.add(`${prefix}outer`);
+        parent.dataset.chat = 'drawer';
+        oldParent.appendChild(parent);
+        parent.appendChild(dom);
+    }
+    let mountTarget = parent.childNodes[1];
+    if (!mountTarget) {
+        mountTarget = document.createElement('div');
+        mountTarget.dataset.chat = 'drawer-mounted';
+        mountTarget.classList.add(`${prefix}inner-end`);
+        mountTarget.style.width = '0px';
+        mountTarget.style.opacity = '0';
+        parent.appendChild(mountTarget);
+    }
+    dom.classList.add(`${prefix}inner-start`);
+    return mountTarget;
+}
+function InnerDrawer({ className, prefix, target, children, trigger, triggerType, visible, onVisibleChange, closable = true, title, width = 400, }) {
+    const [mount, setMount] = (0, react_1.useState)(!!visible);
+    (0, react_1.useEffect)(() => {
+        if (visible) {
+            setMount(visible);
+        }
+    }, [visible]);
+    const cls = `${prefix}inner-drawer`;
+    const handleVisibleChange = (nextVisible, type) => {
+        onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(nextVisible, type);
+    };
+    const handleVisibleChangeRef = (0, react_1.useRef)(handleVisibleChange);
+    handleVisibleChangeRef.current = handleVisibleChange;
+    const handlers = (0, useTriggerType_1.useTriggerType)({ visible, onVisibleChange: handleVisibleChange, triggerType });
+    const mountTarget = mount ? getMountTarget(`${cls}-`, target) : undefined;
+    const domRef = (0, react_1.useRef)(null);
+    const triggerRef = (0, react_1.useRef)(null);
+    (0, react_1.useLayoutEffect)(() => {
+        if (mountTarget) {
+            const timer = setTimeout(() => {
+                mountTarget.style.width = visible
+                    ? `${typeof width === 'number' ? `${width}px` : width}`
+                    : '0px';
+                mountTarget.style.opacity = visible ? '1' : '0';
+            }, 16);
+            return () => {
+                clearTimeout(timer);
+            };
+        }
+    });
+    (0, react_1.useEffect)(() => {
+        if (!mountTarget || !className) {
+            return;
+        }
+        mountTarget.classList.add(className);
+        return () => {
+            mountTarget.classList.remove(className);
+        };
+    }, [mountTarget, className]);
+    (0, react_1.useEffect)(() => {
+        const onClick = (e) => {
+            const dom = domRef.current;
+            const trigger = triggerRef.current;
+            const target = e.target;
+            if (!dom || !trigger || !target) {
+                return;
+            }
+            if (!dom.contains(target) && !trigger.contains(target)) {
+                handleVisibleChangeRef.current(false, 'docClick');
+            }
+        };
+        window.addEventListener('click', onClick);
+        return () => {
+            window.removeEventListener('click', onClick);
+        };
+    }, []);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", Object.assign({}, handlers, { ref: triggerRef }), trigger),
+        !!mountTarget &&
+            react_dom_1.default.createPortal(react_1.default.createElement("div", { className: (0, classnames_1.default)(cls, { [`${cls}--visible`]: visible }), ref: domRef, style: { width } },
+                react_1.default.createElement("div", { className: `${cls}-inner` },
+                    react_1.default.createElement("div", { className: `${cls}-header` },
+                        !!title && react_1.default.createElement("div", { className: `${cls}-header-title` }, title),
+                        !!closable && (react_1.default.createElement("button", { className: `${cls}-header-close`, onClick: () => handleVisibleChange(false, 'close') },
+                            react_1.default.createElement(next_1.Icon, { className: `${cls}-header-close-icon`, type: "close", size: 12 })))),
+                    react_1.default.createElement("div", { className: `${cls}-body` }, children))), mountTarget)));
 }
 exports.InnerDrawer = InnerDrawer;
+function FloatButtonByInnerDrawer(props) {
+    const { width, title, target } = props, rests = tslib_1.__rest(props, ["width", "title", "target"]);
+    return (react_1.default.createElement(float_button_1.default, Object.assign({}, rests, { _renderView: (prefix, { trigger, triggerType, visible, onVisibleChange, showClose, children }) => {
+            return (react_1.default.createElement(InnerDrawer, { prefix: prefix, target: target, width: width, title: title, trigger: trigger, triggerType: triggerType, visible: visible, closable: showClose, onVisibleChange: (...args) => {
+                    onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(...args);
+                } }, children));
+        } })));
+}
+exports.default = next_1.ConfigProvider.config(FloatButtonByInnerDrawer);

package/lib/index.d.ts

@@ -1,2 +1,8 @@
 export { default as Button } from './button';
+export { default as Card } from './card';
+export { default as Feedback } from './feedback';
+export { default as FloatButton } from './float-button';
+export { default as Text } from './text';
+export { default as Tag } from './tag';
+export { default as Tab } from './tab';
 export declare const version: string;

package/lib/index.js

@@ -3,7 +3,19 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.version = exports.Button = void 0;
+exports.version = exports.Tab = exports.Tag = exports.Text = exports.FloatButton = exports.Feedback = exports.Card = exports.Button = void 0;
 var button_1 = require("./button");
 Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return __importDefault(button_1).default; } });
-exports.version = '0.0.1';
+var card_1 = require("./card");
+Object.defineProperty(exports, "Card", { enumerable: true, get: function () { return __importDefault(card_1).default; } });
+var feedback_1 = require("./feedback");
+Object.defineProperty(exports, "Feedback", { enumerable: true, get: function () { return __importDefault(feedback_1).default; } });
+var float_button_1 = require("./float-button");
+Object.defineProperty(exports, "FloatButton", { enumerable: true, get: function () { return __importDefault(float_button_1).default; } });
+var text_1 = require("./text");
+Object.defineProperty(exports, "Text", { enumerable: true, get: function () { return __importDefault(text_1).default; } });
+var tag_1 = require("./tag");
+Object.defineProperty(exports, "Tag", { enumerable: true, get: function () { return __importDefault(tag_1).default; } });
+var tab_1 = require("./tab");
+Object.defineProperty(exports, "Tab", { enumerable: true, get: function () { return __importDefault(tab_1).default; } });
+exports.version = '0.1.1';

package/lib/tab/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { Tab as NextTab } from '@alifd/next';
+import type { TabProps } from '@alifd/next/types/tab';
+export type { TabProps, ItemProps } from '@alifd/next/types/tab';
+declare const _default: import("@alifd/next/types/config-provider/types").ConfiguredComponentClass<Pick<TabProps & React.RefAttributes<NextTab>, "key" | keyof TabProps> & import("@alifd/next/types/config-provider/types").ComponentCommonProps, NextTab, {}> & {
+    Item: typeof import("@alifd/next/types/tab").Item;
+};
+export default _default;

package/lib/tab/index.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const next_1 = require("@alifd/next");
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const utils_1 = require("../utils");
+const Tab = (0, react_1.forwardRef)((_a, ref) => {
+    var { className, size = 'small' } = _a, props = tslib_1.__rest(_a, ["className", "size"]);
+    return (react_1.default.createElement(next_1.Tab, Object.assign({}, props, { className: (0, classnames_1.default)(`${utils_1.PREFIX_DEFAULT}tabs`, className), ref: ref, size: size })));
+});
+const TabWithSub = (0, utils_1.assignSubComponent)(Tab, {
+    Item: next_1.Tab.Item,
+    displayName: 'Tab',
+});
+exports.default = next_1.ConfigProvider.config(TabWithSub);

package/lib/tab/main.scss

@@ -0,0 +1,10 @@
+@import "@alifd/next/variables.scss";
+@import "../core/variables.scss";
+
+.#{$prefix}tabs {
+  &.#{$css-prefix}tabs-pure {
+    .#{$css-prefix}tabs-bar {
+      border-color: transparent;
+    }
+  }
+}

package/lib/tab/style.d.ts

@@ -0,0 +1,2 @@
+import '@alifd/next/lib/tab/style';
+import './main.scss';

package/lib/tab/style.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+require("@alifd/next/lib/tab/style");
+require("./main.scss");

package/lib/tag/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @component 标签
+ * @en Tag
+ * @type 通用 - General
+ * @remarks 同 Next Tag - Same as Next.Tag
+ * @when Tag
+ */
+import React from 'react';
+import { Tag as NextTag } from '@alifd/next';
+import type { TagProps } from '@alifd/next/types/tag';
+export type { TagProps } from '@alifd/next/types/tag';
+declare const _default: import("@alifd/next/types/config-provider/types").ConfiguredComponentClass<Pick<TagProps & React.RefAttributes<NextTag>, "key" | keyof TagProps> & import("@alifd/next/types/config-provider/types").ComponentCommonProps, NextTag, {}>;
+export default _default;

package/lib/tag/index.js

@@ -0,0 +1,23 @@
+"use strict";
+/**
+ * @component 标签
+ * @en Tag
+ * @type 通用 - General
+ * @remarks 同 Next Tag - Same as Next.Tag
+ * @when Tag
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const next_1 = require("@alifd/next");
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const utils_1 = require("../utils");
+const Tag = (0, react_1.forwardRef)((_a, ref) => {
+    var { className, size = 'small', type = 'normal' } = _a, props = tslib_1.__rest(_a, ["className", "size", "type"]);
+    return (react_1.default.createElement(next_1.Tag, Object.assign({}, props, { ref: ref, className: (0, classnames_1.default)(`${utils_1.PREFIX_DEFAULT}tag`, className), size: size, type: type })));
+});
+// 暂时只开放 Tag 组件，其它子组件后续看需求
+const TagWithSub = (0, utils_1.assignSubComponent)(Tag, {
+    displayName: 'Tag',
+});
+exports.default = next_1.ConfigProvider.config(TagWithSub);

package/lib/tag/main.scss

@@ -0,0 +1,9 @@
+@import '@alifd/next/variables.scss';
+@import "../core/variables.scss";
+
+.#{$prefix}tag {
+
+  &.#{$css-prefix}tag {
+      border-color: transparent;
+  }
+}

package/lib/tag/style.d.ts

@@ -0,0 +1,2 @@
+import '@alifd/next/lib/tag/style';
+import './main.scss';

package/lib/tag/style.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+require("@alifd/next/lib/tag/style");
+require("./main.scss");