@type-dom/ui 0.0.10 → 0.1.0

package/src/components/feedback/td-overlay/td-overlay.class.js

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TdOverlay = exports.overlayZIndex = void 0;
-const ui_abstract_1 = require("../../../ui/ui.abstract");
+const framework_1 = require("@type-dom/framework");
 const td_overlay_style_1 = require("./td-overlay.style");
 exports.overlayZIndex = 2000;
-class TdOverlay extends ui_abstract_1.UI {
+class TdOverlay extends framework_1.TypeDiv {
     constructor(params = {}) {
-        super(params);
+        super();
         exports.overlayZIndex = exports.overlayZIndex + 1;
         this.className = 'TdOverlay';
         this.style.addObj(td_overlay_style_1.$tdOverlayStyle);
@@ -25,11 +25,12 @@ class TdOverlay extends ui_abstract_1.UI {
                 left: '0px',
             });
         }
-        this.addChild(this.getSlotNode());
+        // this.addChild(this.getSlotNode());
+        this.slotChild(params.slot);
         this.props = this.useParams(params);
     }
     addSlot(slot) {
-        this.getSlotNode().resetSlot(slot);
+        // this.getSlotNode().resetSlot(slot);
     }
 }
 exports.TdOverlay = TdOverlay;

package/src/components/feedback/td-overlay/td-overlay.interface.d.ts

@@ -1,9 +1,9 @@
 import { Property } from '@type-dom/css-type';
-import { IUI, IUIConfig } from '../../../ui/ui.interface';
-export interface ITdOverlay extends IUI {
+import { ITypeConfig, ITypeDiv } from '@type-dom/framework';
+export interface ITdOverlay extends ITypeDiv {
     className: 'TdOverlay';
 }
-export interface ITdOverlayConfig extends IUIConfig {
+export interface ITdOverlayConfig extends ITypeConfig {
     mask?: boolean;
     customMaskEvent?: boolean;
     zIndex?: Property.ZIndex;

package/src/components/feedback/td-popper/arrow/arrow.class.d.ts

@@ -1,6 +1,6 @@
-import { UI } from '../../../../ui/ui.abstract';
+import { TypeSpan } from '@type-dom/framework';
 import { ITdPopperArrow, ITdPopperArrowConfig } from './arrow.interface';
-export declare class TdPopperArrow extends UI implements ITdPopperArrow {
+export declare class TdPopperArrow extends TypeSpan implements ITdPopperArrow {
     className: 'TdPopperArrow';
     props: ITdPopperArrowConfig;
     private arrowOffset?;

package/src/components/feedback/td-popper/arrow/arrow.class.js

@@ -1,12 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TdPopperArrow = void 0;
+const framework_1 = require("@type-dom/framework");
 const var_1 = require("../../../../styles/var");
-const ui_abstract_1 = require("../../../../ui/ui.abstract");
-const td_popper_const_1 = require("../td-popper.const");
-class TdPopperArrow extends ui_abstract_1.UI {
+const constants_1 = require("../constants");
+class TdPopperArrow extends framework_1.TypeSpan {
     constructor(params = {}) {
-        super(params, 'span');
+        super();
+        // this.useTag('span');
         this.className = 'TdPopperArrow';
         this.attr.addName('td-popper-arrow');
         this.style.addObj({
@@ -27,13 +28,13 @@ class TdPopperArrow extends ui_abstract_1.UI {
             boxSizing: 'border-box'
             // }
         });
-        this.buildProps({
+        this.assignProps({
             arrowOffset: 5,
         });
         this.props = this.useParams(params);
     }
     setup() {
-        const { arrowOffset, arrowRef, arrowStyle } = this.inject(td_popper_const_1.POPPER_CONTENT_INJECTION_KEY, undefined);
+        const { arrowOffset, arrowRef, arrowStyle } = this.inject(constants_1.POPPER_CONTENT_INJECTION_KEY, undefined);
         this.arrowOffset = arrowOffset;
         this.arrowRef = arrowRef;
         this.arrowStyle = arrowStyle;

package/src/components/feedback/td-popper/arrow/arrow.const.d.ts

@@ -0,0 +1,3 @@
+export declare const popperArrowProps: {
+    arrowOffset: number;
+};

package/src/components/feedback/td-popper/arrow/arrow.const.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.popperArrowProps = void 0;
+exports.popperArrowProps = {
+    arrowOffset: 5,
+};

package/src/components/feedback/td-popper/arrow/arrow.interface.d.ts

@@ -1,10 +1,9 @@
-import { IUI, IUIConfig } from '../../../../ui/ui.interface';
-export interface ITdPopperArrow extends IUI {
+import { ITypeConfig, ITypeSpan } from '@type-dom/framework';
+export interface ITdPopperArrow extends ITypeSpan {
     className: 'TdPopperArrow';
 }
-export interface ITdPopperArrowConfig extends IUIConfig {
+export interface ITdPopperArrowConfig extends ITypeConfig {
     /**
-     *
      *     default: 5,
      */
     arrowOffset?: number;

package/src/components/feedback/td-popper/constants.d.ts

@@ -0,0 +1,25 @@
+import { IStyle } from '@type-dom/css-type';
+import { InjectionKey } from '@type-dom/framework';
+import { TdPopper } from './td-popper.class';
+export type Measurable = {
+    getBoundingClientRect: () => DOMRect;
+};
+/**
+ * triggerRef indicates the element that triggers popper
+ * contentRef indicates the element of popper content
+ * referenceRef indicates the element that popper content relative with
+ */
+export type TdPopperInjectionContext = {
+    triggerRef: Measurable | undefined;
+    contentRef: HTMLElement | undefined;
+    popperInstanceRef: TdPopper | undefined;
+    referenceRef: Measurable | undefined;
+    role: string;
+};
+export type TdPopperContentInjectionContext = {
+    arrowRef: HTMLElement | undefined;
+    arrowOffset: number | undefined;
+    arrowStyle: IStyle;
+};
+export declare const POPPER_INJECTION_KEY: InjectionKey<TdPopperInjectionContext>;
+export declare const POPPER_CONTENT_INJECTION_KEY: InjectionKey<TdPopperContentInjectionContext>;

package/src/components/feedback/td-popper/constants.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.POPPER_CONTENT_INJECTION_KEY = exports.POPPER_INJECTION_KEY = void 0;
+exports.POPPER_INJECTION_KEY = Symbol('popper');
+exports.POPPER_CONTENT_INJECTION_KEY = Symbol('popperContent');

package/src/components/feedback/td-popper/content/content.class.d.ts

@@ -1,6 +1,6 @@
-import { UI } from '../../../../ui/ui.abstract';
+import { TypeDiv } from '@type-dom/framework';
 import { ITdPopperContent, ITdPopperContentConfig } from './content.interface';
-export declare class TdPopperContent extends UI implements ITdPopperContent {
+export declare class TdPopperContent extends TypeDiv implements ITdPopperContent {
     className: 'TdPopperContent';
     props: ITdPopperContentConfig;
     private focusTrap;

package/src/components/feedback/td-popper/content/content.class.js

@@ -2,37 +2,31 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TdPopperContent = void 0;
 const utils_1 = require("@type-dom/utils");
-const ui_abstract_1 = require("../../../../ui/ui.abstract");
+const framework_1 = require("@type-dom/framework");
+const td_form_const_1 = require("../../../form/td-form/td-form.const");
 const td_focus_trap_class_1 = require("../../td-focus-trap/td-focus-trap.class");
+const constants_1 = require("../constants");
 const content_const_1 = require("./content.const");
-const td_form_const_1 = require("../../../form/td-form/td-form.const");
-const td_popper_const_1 = require("../td-popper.const");
-class TdPopperContent extends ui_abstract_1.UI {
+class TdPopperContent extends framework_1.TypeDiv {
     constructor(params = {}) {
-        super(params);
+        super();
         this.className = 'TdPopperContent';
         this.attr.addName('td-popper-content');
         this.attr.addObj({
             tabindex: -1
         });
-        this.style.addObj({
-        // padding: '10px',
-        // backgroundColor: $bgColors.default,
-        // borderRadius: $borderRadius.base,
-        // boxShadow: $boxShadow.base,
-        });
         this.focusTrap = new td_focus_trap_class_1.TdFocusTrap();
         this.addChild(this.focusTrap);
         if (params.contentStyle) { // todo
             this.style.addObj(params.contentStyle);
         }
-        this.buildProps(content_const_1.popperContentProps);
+        this.assignProps(content_const_1.popperContentProps);
         this.props = this.useParams(params);
     }
     setup() {
         const formItemContext = this.inject(td_form_const_1.formItemContextKey, undefined);
         const arrowOffset = 0;
-        this.provide(td_popper_const_1.POPPER_CONTENT_INJECTION_KEY, {
+        this.provide(constants_1.POPPER_CONTENT_INJECTION_KEY, {
             // arrowStyle,
             // arrowRef,
             arrowOffset,

package/src/components/feedback/td-popper/content/content.const.d.ts

@@ -1,3 +1,3 @@
-import { IPopperCoreConfigProps, ITdPopperContentConfig } from './content.interface';
-export declare const popperCoreConfigProps: IPopperCoreConfigProps;
+import { IPopperCoreConfig, ITdPopperContentConfig } from './content.interface';
+export declare const popperCoreProps: IPopperCoreConfig;
 export declare const popperContentProps: ITdPopperContentConfig;

package/src/components/feedback/td-popper/content/content.const.js

@@ -1,9 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.popperContentProps = exports.popperCoreConfigProps = void 0;
-exports.popperCoreConfigProps = {
+exports.popperContentProps = exports.popperCoreProps = void 0;
+exports.popperCoreProps = {
     boundariesPadding: 0,
-    // fallbackPlacements: undefined,
     gpuAcceleration: true,
     /**
      * @description offset of the Tooltip
@@ -19,7 +18,7 @@ exports.popperCoreConfigProps = {
     // popperOptions:  () => ({}),
     strategy: 'absolute',
 };
-exports.popperContentProps = Object.assign(Object.assign({}, exports.popperCoreConfigProps), { 
+exports.popperContentProps = Object.assign(Object.assign({}, exports.popperCoreProps), { 
     // style: {
     //   type: definePropType<StyleValue>([String, Array, Object]),
     // },

package/src/components/feedback/td-popper/content/content.interface.d.ts

@@ -1,10 +1,19 @@
-import { IUI, IUIConfig } from '../../../../ui/ui.interface';
 import { IStyle } from '@type-dom/css-type';
-export interface ITdPopperContent extends IUI {
+import { IEmits, ITypeConfig, ITypeDiv } from '@type-dom/framework';
+export interface ITdPopperContent extends ITypeDiv {
     className: 'TdPopperContent';
 }
-export interface IPopperCoreConfigProps extends IUIConfig {
+declare const top = "top";
+declare const bottom = "bottom";
+declare const right = "right";
+declare const left = "left";
+type BasePlacement = typeof top | typeof bottom | typeof right | typeof left;
+type VariationPlacement = 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end';
+type AutoPlacement = 'auto' | 'auto-start' | 'auto-end';
+export type Placement = AutoPlacement | BasePlacement | VariationPlacement;
+export interface IPopperCoreConfig extends ITypeConfig {
     boundariesPadding?: number;
+    fallbackPlacements?: Placement[];
     gpuAcceleration?: boolean;
     /**
      * @description offset of the Tooltip
@@ -18,10 +27,12 @@ export interface IPopperCoreConfigProps extends IUIConfig {
     placement?: string;
     /**
      * @description [popper.js](https://popper.js.org/docs/v2/) parameters
+     *   //   default: () => ({}),
      */
+    popperOptions?: Record<string, any>;
     strategy?: string;
 }
-export interface ITdPopperContentConfig extends IPopperCoreConfigProps {
+export interface ITdPopperContentConfig extends IPopperCoreConfig {
     id?: string;
     contentStyle?: IStyle;
     effect?: string;
@@ -30,17 +41,19 @@ export interface ITdPopperContentConfig extends IPopperCoreConfigProps {
     pure?: boolean;
     focusOnShow?: boolean;
     trapping?: boolean;
+    popperStyle?: IStyle;
     referenceEl?: HTMLElement;
     triggerTargetEl?: HTMLElement;
     stopPopperMouseEvent?: boolean;
     ariaLabel?: string;
     virtualTriggering?: boolean;
     zIndex?: number;
-    emits?: {
-        mouseenter?: (evt: MouseEvent) => void;
-        mouseleave?: (evt: MouseEvent) => void;
-        focus?: (evt: FocusEvent) => void;
-        blur?: (evt: FocusEvent) => void;
-        close?: () => void;
-    };
 }
+export interface ITdPopperContentEmits extends IEmits {
+    mouseenter?: (evt: MouseEvent) => void;
+    mouseleave?: (evt: MouseEvent) => void;
+    focus?: (evt: FocusEvent) => void;
+    blur?: (evt: FocusEvent) => void;
+    close?: () => void;
+}
+export {};

package/src/components/feedback/td-popper/content/content.interface.js

@@ -1,2 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const top = 'top';
+const bottom = 'bottom';
+const right = 'right';
+const left = 'left';

package/src/components/feedback/td-popper/td-popper.class.d.ts

@@ -1,7 +1,8 @@
-import { UI } from '../../../ui/ui.abstract';
+import { SlotNode, TypeFragment } from '@type-dom/framework';
 import { ITdPopper, ITdPopperConfig } from './td-popper.interface';
-export declare class TdPopper extends UI<undefined> implements ITdPopper {
+export declare class TdPopper extends TypeFragment implements ITdPopper {
     className: 'TdPopper';
+    content: SlotNode;
     props: ITdPopperConfig;
     constructor(params: ITdPopperConfig);
 }

package/src/components/feedback/td-popper/td-popper.class.js

@@ -2,19 +2,21 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TdPopper = void 0;
 const framework_1 = require("@type-dom/framework");
-const ui_abstract_1 = require("../../../ui/ui.abstract");
+const constants_1 = require("./constants");
 const td_popper_const_1 = require("./td-popper.const");
-class TdPopper extends ui_abstract_1.UI {
+class TdPopper extends framework_1.TypeFragment {
     constructor(params) {
-        super(params, 'fragment');
+        super();
         this.className = 'TdPopper';
+        // this.useTag('fragment');
+        this.content = new framework_1.SlotNode();
+        this.addChild(this.content);
         const triggerRef = (0, framework_1.createProxy)(null);
         const popperInstanceRef = (0, framework_1.createProxy)(null);
         const contentRef = (0, framework_1.createProxy)(null);
         const referenceRef = (0, framework_1.createProxy)(null);
-        if (!params.role) {
-            params.role = 'tooltip';
-        }
+        this.content.addSlot(params.slot);
+        this.assignProps(td_popper_const_1.popperProps);
         this.props = this.useParams(params);
         const role = this.props.role;
         const popperProviders = {
@@ -39,7 +41,7 @@ class TdPopper extends ui_abstract_1.UI {
              */
             role,
         };
-        this.provide(td_popper_const_1.POPPER_INJECTION_KEY, popperProviders);
+        this.provide(constants_1.POPPER_INJECTION_KEY, popperProviders);
     }
 }
 exports.TdPopper = TdPopper;

package/src/components/feedback/td-popper/td-popper.const.d.ts

@@ -1,21 +1,6 @@
-import { InjectionKey } from '@type-dom/framework';
-import { IRoleTypes } from './td-popper.interface';
-/**
- * triggerRef indicates the element that triggers popper
- * contentRef indicates the element of popper content
- * referenceRef indicates the element that popper content relative with
- */
-export type TdPopperInjectionContext = {
-    triggerRef: any;
-    contentRef: any;
-    popperInstanceRef: any;
-    referenceRef: any;
-    role: IRoleTypes;
+import { ITdPopperConfig } from './td-popper.interface';
+export declare const Effect: {
+    LIGHT: string;
+    DARK: string;
 };
-export declare const POPPER_INJECTION_KEY: InjectionKey<TdPopperInjectionContext>;
-export type ElPopperContentInjectionContext = {
-    arrowRef: any;
-    arrowOffset: any;
-    arrowStyle: any;
-};
-export declare const POPPER_CONTENT_INJECTION_KEY: InjectionKey<ElPopperContentInjectionContext>;
+export declare const popperProps: ITdPopperConfig;

package/src/components/feedback/td-popper/td-popper.const.js

@@ -1,5 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.POPPER_CONTENT_INJECTION_KEY = exports.POPPER_INJECTION_KEY = void 0;
-exports.POPPER_INJECTION_KEY = Symbol('popper');
-exports.POPPER_CONTENT_INJECTION_KEY = Symbol('popperContent');
+exports.popperProps = exports.Effect = void 0;
+exports.Effect = {
+    LIGHT: 'light',
+    DARK: 'dark'
+};
+exports.popperProps = {
+    role: 'tooltip'
+};

package/src/components/feedback/td-popper/td-popper.interface.d.ts

@@ -1,11 +1,13 @@
-import { IUI, IUIConfig } from '../../../ui/ui.interface';
-export interface ITdPopper extends IUI {
+import { ITypeConfig, ITypeElement } from '@type-dom/framework';
+export interface ITdPopper extends ITypeElement {
     className: 'TdPopper';
 }
 export type IRoleTypes = 'dialog' | 'grid' | 'group' | 'listbox' | 'menu' | 'navigation' | 'tooltip' | 'tree';
-export interface ITdPopperConfig extends IUIConfig {
+export interface ITdPopperConfig extends ITypeConfig {
     /**
-     *     default: 'tooltip',
+     *    default: 'tooltip',
      */
     role?: IRoleTypes;
 }
+export type ITdPopperEffect = 'dark' | 'light';
+export type ITdPopperTrigger = 'click' | 'hover' | 'focus' | 'context-menu';

package/src/components/feedback/td-popper/trigger/trigger.class.d.ts

@@ -1,6 +1,6 @@
-import { UI } from '../../../../ui/ui.abstract';
+import { TypeDiv } from '@type-dom/framework';
 import { ITdPopperTrigger, ITdPopperTriggerConfig } from './trigger.interface';
-export declare class TdPopperTrigger extends UI implements ITdPopperTrigger {
+export declare class TdPopperTrigger extends TypeDiv implements ITdPopperTrigger {
     className: 'TdPopperTrigger';
     props: ITdPopperTriggerConfig;
     private role;

package/src/components/feedback/td-popper/trigger/trigger.class.js

@@ -2,20 +2,20 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TdPopperTrigger = void 0;
 const utils_1 = require("@type-dom/utils");
-const ui_abstract_1 = require("../../../../ui/ui.abstract");
+const framework_1 = require("@type-dom/framework");
 const use_forward_ref_1 = require("../../../../hooks/use-forward-ref");
 const td_only_child_class_1 = require("../../td-only-child/td-only-child.class");
 const content_const_1 = require("../content/content.const");
-const td_popper_const_1 = require("../td-popper.const");
+const constants_1 = require("../constants");
 const trigger_const_1 = require("./trigger.const");
-class TdPopperTrigger extends ui_abstract_1.UI {
+class TdPopperTrigger extends framework_1.TypeDiv {
     constructor(params = {}) {
-        super(params);
+        super();
         this.className = 'TdPopperTrigger';
         if (!params.virtualTriggering) {
             this.addChild(new td_only_child_class_1.TdOnlyChild());
         }
-        this.buildProps(content_const_1.popperContentProps);
+        this.assignProps(content_const_1.popperContentProps);
         this.props = this.useParams(params);
     }
     get ariaHaspopup() {
@@ -37,7 +37,7 @@ class TdPopperTrigger extends ui_abstract_1.UI {
         return this.ariaHaspopup.value ? `${this.props.open}` : undefined;
     }
     setup() {
-        const { role, triggerRef } = this.inject(td_popper_const_1.POPPER_INJECTION_KEY, undefined);
+        const { role, triggerRef } = this.inject(constants_1.POPPER_INJECTION_KEY, undefined);
         this.role = role;
         this.triggerRef = triggerRef;
         (0, use_forward_ref_1.useForwardRef)(triggerRef);

package/src/components/feedback/td-popper/trigger/trigger.const.d.ts

@@ -1 +1,2 @@
+export declare const popperTriggerProps: {};
 export declare const TRIGGER_ELE_EVENTS: readonly ["onMouseenter", "onMouseleave", "onClick", "onKeydown", "onFocus", "onBlur", "onContextmenu"];

package/src/components/feedback/td-popper/trigger/trigger.const.js

@@ -1,6 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TRIGGER_ELE_EVENTS = void 0;
+exports.TRIGGER_ELE_EVENTS = exports.popperTriggerProps = void 0;
+exports.popperTriggerProps = {
+/* 没有默认值 */
+};
 exports.TRIGGER_ELE_EVENTS = [
     'onMouseenter',
     'onMouseleave',

package/src/components/feedback/td-popper/trigger/trigger.interface.d.ts

@@ -1,9 +1,9 @@
-import { IUI, IUIConfig } from '../../../../ui/ui.interface';
-export interface ITdPopperTrigger extends IUI {
+import { ITypeConfig, ITypeDiv } from '@type-dom/framework';
+export interface ITdPopperTrigger extends ITypeDiv {
     className: 'TdPopperTrigger';
 }
 type IEvent = (event: Event) => void;
-export interface ITdPopperTriggerConfig extends IUIConfig {
+export interface ITdPopperTriggerConfig extends ITypeConfig {
     virtualRef?: HTMLElement;
     virtualTriggering?: boolean;
     onMouseenter?: IEvent;

package/src/components/feedback/td-tooltip/content/content.class.d.ts

@@ -1,6 +1,6 @@
-import { UI } from '../../../../ui/ui.abstract';
+import { TypeDiv } from '@type-dom/framework';
 import { ITdTooltipContentConfig } from './content.interface';
-export declare class TdTooltipContent extends UI {
+export declare class TdTooltipContent extends TypeDiv {
     className: 'TdTooltipContent';
     props: ITdTooltipContentConfig;
     constructor(params?: ITdTooltipContentConfig);

package/src/components/feedback/td-tooltip/content/content.class.js

@@ -1,11 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TdTooltipContent = void 0;
-const ui_abstract_1 = require("../../../../ui/ui.abstract");
-class TdTooltipContent extends ui_abstract_1.UI {
+const framework_1 = require("@type-dom/framework");
+class TdTooltipContent extends framework_1.TypeDiv {
     constructor(params = {}) {
-        super(params);
+        super();
         this.className = 'TdTooltipContent';
+        this.attr.addName('td-tooltip-content');
         this.props = this.useParams(params);
     }
 }

package/src/components/feedback/td-tooltip/content/content.const.d.ts

@@ -0,0 +1,55 @@
+export declare const tooltipContentProps: {
+    teleported: boolean;
+    id?: string;
+    contentStyle?: import("dist/libs/css-type/src").IStyle;
+    effect?: string;
+    visible?: boolean;
+    enterable?: boolean;
+    pure?: boolean;
+    focusOnShow?: boolean;
+    trapping?: boolean;
+    popperStyle?: import("dist/libs/css-type/src").IStyle;
+    referenceEl?: HTMLElement;
+    triggerTargetEl?: HTMLElement;
+    stopPopperMouseEvent?: boolean;
+    ariaLabel?: string;
+    virtualTriggering?: boolean;
+    zIndex?: number;
+    boundariesPadding?: number;
+    fallbackPlacements?: import("../../td-popper/content/content.interface").Placement[];
+    gpuAcceleration?: boolean;
+    offset?: number;
+    placement?: string;
+    popperOptions?: Record<string, any>;
+    strategy?: string;
+    name?: string | number;
+    tag?: "fragment" | string;
+    ref?: import("dist/libs/framework/src").XProxy<import("dist/libs/framework/src").IJsonData> | import("dist/libs/framework/src").Ref<any>;
+    refId?: string | number;
+    text?: boolean | string | number | import("dist/libs/framework/src").XProxy<import("dist/libs/framework/src").IJsonData>;
+    attrObj?: import("dist/libs/framework/src").ITypeAttribute | undefined;
+    styleObj?: import("dist/libs/css-type/src").IStyle | undefined;
+    childNodes?: import("dist/libs/framework/src").TypeNode[] | undefined;
+    items?: import("dist/libs/framework/src").ITypeConfig[];
+    slots?: import("dist/libs/framework/src").IConfigSlots;
+    slot?: import("dist/libs/framework/src").IConfigSlot;
+    html?: string;
+    init?: (element: import("dist/libs/framework/src").TypeElement) => void;
+    emits?: import("dist/libs/framework/src").IEmits;
+    events?: Partial<import("dist/libs/framework/src").IEvents>;
+    template?: string;
+    fieldSetting?: import("dist/libs/framework/src").IOptionSetting;
+    className?: string;
+    nodeName?: "fragment" | string | undefined;
+    nodeValue?: string | number | undefined;
+    to?: HTMLElement;
+    parent?: import("dist/libs/framework/src").TypeElement | import("dist/libs/framework/src").SlotNode;
+    context?: import("dist/libs/framework/src").TypeNode;
+    isRoot?: boolean;
+    methods?: import("dist/libs/framework/src").IMethods;
+    settings?: import("dist/libs/framework/src").ISettings;
+    defaults?: import("dist/libs/framework/src").ISettings;
+    showAfter: number;
+    hideAfter: number;
+    autoClose: number;
+};

package/src/components/feedback/td-tooltip/content/content.const.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.tooltipContentProps = void 0;
+const use_delayed_toggle_1 = require("../../../../hooks/use-delayed-toggle");
+const content_const_1 = require("../../td-popper/content/content.const");
+exports.tooltipContentProps = Object.assign(Object.assign(Object.assign({}, use_delayed_toggle_1.useDelayedToggleProps), content_const_1.popperContentProps), { teleported: true });

package/src/components/feedback/td-tooltip/content/content.interface.d.ts

@@ -1,9 +1,25 @@
-import { IUI } from '../../../../ui/ui.interface';
+import { IDelayedToggleConfig } from '../../../../hooks/use-delayed-toggle';
 import { ITdPopperContentConfig } from '../../td-popper/content/content.interface';
-export interface ITdTooltipContent extends IUI {
+import { ITypeDiv } from '@type-dom/framework';
+export interface ITdTooltipContent extends ITypeDiv {
     className: 'TdTooltipContent';
 }
-export interface ITdTooltipContentConfig extends ITdPopperContentConfig {
+export interface ITdTooltipContentConfig extends ITdPopperContentConfig, IDelayedToggleConfig {
+    /**
+     * @description delay of appearance, in millisecond
+     *     default: 0,
+     */
+    showAfter?: number;
+    /**
+     * @description delay of disappear, in millisecond
+     *     default: 200,
+     */
+    hideAfter?: number;
+    /**
+     * @description disappear automatically, in millisecond
+     *     default: 0,
+     */
+    autoClose?: number;
     /**
      * @description which element the tooltip CONTENT appends to
      */

package/src/components/feedback/td-tooltip/td-tooltip.class.d.ts

@@ -1,9 +1,11 @@
-import { UI } from '../../../ui/ui.abstract';
+import { TypeFragment } from '@type-dom/framework';
+import { TdPopper } from '../td-popper/td-popper.class';
 import { ITdTooltip, ITdTooltipConfig } from './td-tooltip.interface';
-export declare class TdTooltip extends UI implements ITdTooltip {
+export declare class TdTooltip extends TypeFragment implements ITdTooltip {
     className: 'TdTooltip';
+    content: TdPopper;
     props: ITdTooltipConfig;
     private trigger;
-    private content;
+    private popperContent;
     constructor(params?: ITdTooltipConfig);
 }