@type-dom/ui 0.2.2 → 0.3.1

package/dist/src/components/feedback/td-notification/style/index.js

@@ -0,0 +1,3 @@
+import '../../../../components/base/style';
+import '../../../../theme-chalk/notification.scss';
+//# sourceMappingURL=index.js.map

package/dist/src/components/feedback/td-notification/style/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/feedback/td-notification/style/index.ts"],"names":[],"mappings":"AAAA,OAAO,mCAAmC,CAAC;AAC3C,OAAO,2CAA2C,CAAC"}

package/dist/src/components/feedback/td-notification/td-notification.class.d.ts

@@ -0,0 +1,13 @@
+import { TypeFragment } from '@type-dom/framework';
+import { Signal } from '@type-dom/signals';
+import { ITdNotification, NotificationProps } from './td-notification.interface';
+export declare class TdNotification extends TypeFragment implements ITdNotification {
+    className: 'TdNotification';
+    props: NotificationProps;
+    visible?: Signal<boolean>;
+    close?: () => void;
+    divRef: Signal<HTMLElement | undefined>;
+    constructor(params?: NotificationProps);
+    setup(): void;
+}
+//# sourceMappingURL=td-notification.class.d.ts.map

package/dist/src/components/feedback/td-notification/td-notification.class.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-notification.class.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/td-notification/td-notification.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAQL,YAAY,EAGb,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAY,MAAM,EAAU,MAAM,mBAAmB,CAAC;AAO7D,OAAO,EACL,eAAe,EACf,iBAAiB,EAClB,MAAM,6BAA6B,CAAC;AAErC,qBAAa,cAAe,SAAQ,YAAa,YAAW,eAAe;IACzE,SAAS,EAAE,gBAAgB,CAAC;IACnB,KAAK,EAAE,iBAAiB,CAAC;IAClC,OAAO,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,IAAI,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC,WAAW,GAAG,SAAS,CAAC,CAAC;gBAG5B,MAAM,GAAE,iBAAsB;IASjC,KAAK;CA2Jf"}

package/dist/src/components/feedback/td-notification/td-notification.class.js

@@ -0,0 +1,157 @@
+import { defineExpose, Div, Head, onMounted, P, Transition, TypeFragment, useEventListener, useTimeoutFn, } from '@type-dom/framework';
+import { computed, signal } from '@type-dom/signals';
+import { CloseComponents, TypeComponentsMap } from '@type-dom/svgs';
+import { EVENT_CODE } from '../../../constants/aria';
+import { TdIcon } from '../../basic/td-icon/td-icon.class';
+import { useGlobalComponentSettings } from '../../configuration/td-config-provider';
+import { notificationEmits, notificationProps } from './td-notification.const';
+export class TdNotification extends TypeFragment {
+    // todo option 基于notify中的调用设置
+    constructor(params = {}) {
+        super();
+        this.className = 'TdNotification';
+        this.divRef = signal();
+        this.addEmits(notificationEmits);
+        this.assignProps(notificationProps);
+        this.props = this.useParams(params);
+    }
+    setup() {
+        var _a, _b, _c;
+        const props = this.props;
+        const emit = this.emit;
+        const { ns, zIndex } = useGlobalComponentSettings('notification');
+        const { nextZIndex, currentZIndex } = zIndex;
+        const { Close } = CloseComponents;
+        const visible = signal(false);
+        let timer = undefined;
+        const typeClass = computed(() => {
+            const type = props.type;
+            return type && TypeComponentsMap[type] ? ns.m(type) : '';
+        });
+        const iconComponent = computed(() => {
+            if (!props.type)
+                return props.icon;
+            return TypeComponentsMap[props.type] || props.icon;
+        });
+        const horizontalClass = computed(() => { var _a; return ((_a = props.position) === null || _a === void 0 ? void 0 : _a.endsWith('right')) ? 'right' : 'left'; });
+        const verticalProperty = computed(() => { var _a; return ((_a = props.position) === null || _a === void 0 ? void 0 : _a.startsWith('top')) ? 'top' : 'bottom'; });
+        const positionStyle = computed(() => {
+            var _a;
+            return {
+                [verticalProperty.get()]: `${props.offset}px`,
+                zIndex: (_a = props.zIndex) !== null && _a !== void 0 ? _a : currentZIndex.get(),
+            };
+        });
+        function startTimer() {
+            if (props.duration > 0) {
+                ({ stop: timer } = useTimeoutFn(() => {
+                    if (visible.get())
+                        close();
+                }, props.duration));
+            }
+        }
+        function clearTimer() {
+            timer === null || timer === void 0 ? void 0 : timer();
+        }
+        function close() {
+            visible.set(false);
+        }
+        function onKeydown({ code }) {
+            if (code === EVENT_CODE.delete || code === EVENT_CODE.backspace) {
+                clearTimer(); // press delete/backspace clear timer
+            }
+            else if (code === EVENT_CODE.esc) {
+                // press esc to close the notification
+                if (visible.get()) {
+                    close();
+                }
+            }
+            else {
+                startTimer(); // resume timer
+            }
+        }
+        // lifecycle
+        onMounted(() => {
+            startTimer();
+            nextZIndex();
+            visible.set(true);
+        });
+        useEventListener(document, 'keydown', onKeydown);
+        defineExpose({
+            visible,
+            /** @description close notification */
+            close,
+        });
+        this.addChild(new Transition({
+            name: 'fade',
+            onBeforeLeave: () => {
+                var _a;
+                // console.log('beforeLeave');
+                (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
+            },
+            onAfterLeave: () => {
+                // console.log('afterLeave');
+                emit('destroy');
+            },
+            slot: new Div({
+                refDom: this.divRef,
+                vShow: visible,
+                class: [ns.b(), props.customClass, horizontalClass.get()],
+                attrObj: {
+                    id: props.id,
+                    role: 'alert',
+                },
+                styleObj: positionStyle,
+                events: {
+                    mouseenter: clearTimer,
+                    mouseleave: startTimer,
+                    click: props.onClick,
+                },
+                slot: [
+                    new TdIcon({
+                        vIf: iconComponent,
+                        class: [ns.e('icon'), typeClass.get()],
+                        slot: iconComponent.get() &&
+                            new (iconComponent.get())(),
+                    }),
+                    new Div({
+                        class: 'group',
+                        slot: [
+                            new Head({
+                                class: ns.e('title'),
+                                nodeName: 'h2',
+                                slot: props.title,
+                            }),
+                            new Div({
+                                vShow: props.message,
+                                class: ns.e('content'),
+                                styleObj: props.title ? undefined : { margin: 0 },
+                                slot: (_c = (_a = props.slot) !== null && _a !== void 0 ? _a : (_b = props.slots) === null || _b === void 0 ? void 0 : _b.default) !== null && _c !== void 0 ? _c : [
+                                    !props.dangerouslyUseHTMLString
+                                        ? new P({
+                                            slot: props.message,
+                                        })
+                                        : new P({
+                                            html: props.message,
+                                        }),
+                                ],
+                            }),
+                            new TdIcon({
+                                vIf: props.showClose,
+                                class: ns.e('closeBtn'),
+                                slot: new Close(),
+                                events: {
+                                    click: (evt) => {
+                                        evt === null || evt === void 0 ? void 0 : evt.stopPropagation();
+                                        close();
+                                    },
+                                },
+                            }),
+                        ],
+                    }),
+                ],
+            }),
+        }));
+    }
+}
+//# sourceMappingURL=td-notification.class.js.map

package/dist/src/components/feedback/td-notification/td-notification.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-notification.class.js","sourceRoot":"","sources":["../../../../../src/components/feedback/td-notification/td-notification.class.ts"],"names":[],"mappings":"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"}

package/dist/src/components/feedback/td-notification/td-notification.const.d.ts

@@ -0,0 +1,7 @@
+import { NotificationProps } from './td-notification.interface';
+export declare const notificationTypes: readonly ["success", "info", "warning", "error"];
+export declare const notificationProps: NotificationProps;
+export declare const notificationEmits: {
+    destroy: () => boolean;
+};
+//# sourceMappingURL=td-notification.const.d.ts.map

package/dist/src/components/feedback/td-notification/td-notification.const.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-notification.const.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/td-notification/td-notification.const.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAEhE,eAAO,MAAM,iBAAiB,kDAKpB,CAAC;AAEX,eAAO,MAAM,iBAAiB,EAAE,iBAW/B,CAAC;AAEF,eAAO,MAAM,iBAAiB;;CAE7B,CAAC"}

package/dist/src/components/feedback/td-notification/td-notification.const.js

@@ -0,0 +1,22 @@
+export const notificationTypes = [
+    'success',
+    'info',
+    'warning',
+    'error',
+];
+export const notificationProps = {
+    customClass: '',
+    duration: 4500,
+    id: '',
+    message: '',
+    offset: 0,
+    onClick: () => undefined,
+    position: 'top-right',
+    showClose: true,
+    title: '',
+    type: '',
+};
+export const notificationEmits = {
+    destroy: () => true,
+};
+//# sourceMappingURL=td-notification.const.js.map

package/dist/src/components/feedback/td-notification/td-notification.const.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-notification.const.js","sourceRoot":"","sources":["../../../../../src/components/feedback/td-notification/td-notification.const.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,SAAS;IACT,MAAM;IACN,SAAS;IACT,OAAO;CACC,CAAC;AAEX,MAAM,CAAC,MAAM,iBAAiB,GAAsB;IAClD,WAAW,EAAE,EAAE;IACf,QAAQ,EAAE,IAAI;IACd,EAAE,EAAE,EAAE;IACN,OAAO,EAAE,EAAE;IACX,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS;IACxB,QAAQ,EAAE,WAAW;IACrB,SAAS,EAAE,IAAI;IACf,KAAK,EAAE,EAAE;IACT,IAAI,EAAE,EAAE;CACT,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI;CACpB,CAAC"}

package/dist/src/components/feedback/td-notification/td-notification.interface.d.ts

@@ -0,0 +1,109 @@
+import { ITypeFragment, TypeFragmentProps, TypeSvgSvg, TypeNode } from '@type-dom/framework';
+import { TdNotification } from './td-notification.class';
+export type INotificationPosition = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
+export type INotificationType = 'success' | 'info' | 'warning' | 'error' | '';
+export interface ITdNotification extends ITypeFragment {
+    className: 'TdNotification';
+    props: NotificationProps;
+}
+export interface NotificationProps extends TypeFragmentProps {
+    /**
+     * @description custom class name for Notification
+     *     default: ''
+     */
+    customClass?: string;
+    /**
+     * @description whether `message` is treated as HTML string
+     */
+    dangerouslyUseHTMLString?: boolean;
+    /**
+     * @description duration before close. It will not automatically close if set 0
+     *     default: 4500
+     */
+    duration?: number;
+    /**
+     * @description custom icon component. It will be overridden by `type`
+     */
+    icon?: typeof TypeSvgSvg;
+    /**
+     * @description notification dom id
+     *     default: ''
+     */
+    id?: string;
+    /**
+     * @description description text
+     *     default: ''
+     */
+    message?: string | TypeNode;
+    /**
+     * @description offset from the top edge of the screen. Every Notification instance of the same moment should have the same offset
+     *     default: 0
+     */
+    offset?: number;
+    /**
+     * @description callback function when notification clicked
+     *     default: () => undefined
+     */
+    onClick?: () => void;
+    /**
+     * @description callback function when closed
+     *     required: true
+     */
+    onClose?: () => void;
+    /**
+     * @description custom position
+     *     default: 'top-right'
+     */
+    position?: INotificationPosition;
+    /**
+     * @description whether to show a close button
+     *     default: true
+     */
+    showClose?: boolean;
+    /**
+     * @description title
+     *     default: ''
+     */
+    title?: string;
+    /**
+     * @description notification type
+     *     default: ''
+     */
+    type?: INotificationType;
+    /**
+     * @description initial zIndex
+     */
+    zIndex?: number;
+}
+export type NotificationOptions = Omit<NotificationProps, 'id' | 'onClose'> & {
+    /**
+     * @description set the root element for the notification, default to `document.body`
+     */
+    appendTo?: HTMLElement | string;
+    /**
+     * @description callback function when closed
+     */
+    onClose?(vm: TypeNode): void;
+};
+export type NotificationOptionsTyped = Omit<NotificationOptions, 'type'>;
+export interface NotificationHandle {
+    close: () => void;
+}
+export type NotificationParams = Partial<NotificationOptions> | string | TypeNode;
+export type NotificationParamsTyped = Partial<NotificationOptionsTyped> | string | TypeNode;
+export interface NotifyFn {
+    (options?: NotificationParams): NotificationHandle;
+    closeAll(): void;
+}
+export type NotifyTypedFn = (options?: NotificationParamsTyped) => NotificationHandle;
+export interface Notify extends NotifyFn {
+    success: NotifyTypedFn;
+    warning: NotifyTypedFn;
+    error: NotifyTypedFn;
+    info: NotifyTypedFn;
+}
+export interface NotificationQueueItem {
+    vm: TdNotification;
+}
+export type NotificationQueue = NotificationQueueItem[];
+//# sourceMappingURL=td-notification.interface.d.ts.map

package/dist/src/components/feedback/td-notification/td-notification.interface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-notification.interface.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/td-notification/td-notification.interface.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EACb,iBAAiB,EACjB,UAAU,EACV,QAAQ,EACT,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAEzD,MAAM,MAAM,qBAAqB,GAC7B,WAAW,GACX,UAAU,GACV,cAAc,GACd,aAAa,CAAC;AAElB,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,EAAE,CAAC;AAE9E,MAAM,WAAW,eAAgB,SAAQ,aAAa;IACpD,SAAS,EAAE,gBAAgB,CAAC;IAC5B,KAAK,EAAE,iBAAiB,CAAC;CAC1B;AAED,MAAM,WAAW,iBAAkB,SAAQ,iBAAiB;IAC1D;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,UAAU,CAAC;IACzB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC5B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,qBAAqB,CAAC;IACjC;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,iBAAiB,EAAE,IAAI,GAAG,SAAS,CAAC,GAAG;IAC5E;;OAEG;IACH,QAAQ,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IAChC;;OAEG;IACH,OAAO,CAAC,CAAC,EAAE,EAAE,QAAQ,GAAG,IAAI,CAAC;CAC9B,CAAC;AACF,MAAM,MAAM,wBAAwB,GAAG,IAAI,CAAC,mBAAmB,EAAE,MAAM,CAAC,CAAC;AAEzE,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,MAAM,MAAM,kBAAkB,GAC1B,OAAO,CAAC,mBAAmB,CAAC,GAC5B,MAAM,GACN,QAAQ,CAAC;AACb,MAAM,MAAM,uBAAuB,GAC/B,OAAO,CAAC,wBAAwB,CAAC,GACjC,MAAM,GACN,QAAQ,CAAC;AAEb,MAAM,WAAW,QAAQ;IACvB,CACE,OAAO,CAAC,EAAE,kBAAkB,GAE3B,kBAAkB,CAAC;IAEtB,QAAQ,IAAI,IAAI,CAAC;CAGlB;AAED,MAAM,MAAM,aAAa,GAAG,CAC1B,OAAO,CAAC,EAAE,uBAAuB,KAE9B,kBAAkB,CAAC;AAExB,MAAM,WAAW,MAAO,SAAQ,QAAQ;IACtC,OAAO,EAAE,aAAa,CAAC;IACvB,OAAO,EAAE,aAAa,CAAC;IACvB,KAAK,EAAE,aAAa,CAAC;IACrB,IAAI,EAAE,aAAa,CAAC;CACrB;AAED,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,cAAc,CAAC;CACpB;AAED,MAAM,MAAM,iBAAiB,GAAG,qBAAqB,EAAE,CAAC"}

package/dist/src/components/feedback/td-notification/td-notification.interface.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=td-notification.interface.js.map

package/dist/src/components/feedback/td-notification/td-notification.interface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-notification.interface.js","sourceRoot":"","sources":["../../../../../src/components/feedback/td-notification/td-notification.interface.ts"],"names":[],"mappings":""}

package/dist/src/components/feedback/td-notification/td-notification.style.d.ts

@@ -0,0 +1,29 @@
+import { IStyle } from '@type-dom/css-type';
+import { NotificationProps } from './td-notification.interface';
+export declare const $messageCloseSize: string;
+export declare const $notification: {
+    width: string;
+    padding: string;
+    radius: string;
+    shadow: string;
+    borderColor: string;
+    iconSize: string;
+    closeFontSize: string;
+    groupMarginLeft: string;
+    groupMarginRight: string;
+    contentFontSize: string;
+    contentColor: string;
+    titleFontSize: string;
+    titleColor: string;
+    closeColor: string;
+    closeHoverColor: string;
+};
+export declare const $notificationStyle: IStyle;
+export declare const $notificationGroupStyle: IStyle;
+export declare const $notificationTitleStyle: IStyle;
+export declare const $notificationContentStyle: IStyle;
+export declare const $notificationIconStyle: IStyle;
+export declare const $notificationCloseBtnStyle: IStyle;
+export declare function useStyle(config?: NotificationProps): void;
+export declare function useType(config?: NotificationProps): void;
+//# sourceMappingURL=td-notification.style.d.ts.map

package/dist/src/components/feedback/td-notification/td-notification.style.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-notification.style.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/td-notification/td-notification.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAY5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAEhE,eAAO,MAAM,iBAAiB,QAAqB,CAAC;AAEpD,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;CA2BzB,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,MA4ChC,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,MAKrC,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,MASrC,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,MAOvC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,MAOpC,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,MASxC,CAAC;AAEF,wBAAgB,QAAQ,CAAC,MAAM,CAAC,EAAE,iBAAiB,QAElD;AAED,wBAAgB,OAAO,CAAC,MAAM,CAAC,EAAE,iBAAiB,QAYjD"}

package/dist/src/components/feedback/td-notification/td-notification.style.js

@@ -0,0 +1,134 @@
+import { $bgColor, $borderColor, $boxShadow, $colors, $fontSizes, $textColor, $transitionDurationDefault, } from '../../../styles/var';
+import { $message } from '../td-message/td-message.style';
+export const $messageCloseSize = $message.closeSize;
+export const $notification = {
+    width: '330px',
+    padding: '14px 26px 14px 13px',
+    radius: '8px',
+    // shadow: getCssVar(box-shadow-light),
+    shadow: $boxShadow.light,
+    // border-color: getCssVar(border-color-lighter),
+    borderColor: $borderColor.lighter,
+    iconSize: '24px',
+    //   close-font-size: var(
+    //     #{getCssVarName(message-close-size)},
+    //     map.get($message, close-size)
+    // ),
+    closeFontSize: $messageCloseSize,
+    groupMarginLeft: '13px',
+    groupMarginRight: '8px',
+    // content-font-size: getCssVar(font-size-base),
+    contentFontSize: $fontSizes.base,
+    // content-color: getCssVar(text-color-regular),
+    contentColor: $textColor.regular,
+    titleFontSize: '16px',
+    // title-color: getCssVar(text-color-primary),
+    titleColor: $textColor.regular,
+    // close-color: getCssVar(text-color-secondary),
+    closeColor: $textColor.secondary,
+    // close-hover-color: getCssVar(text-color-regular),
+    closeHoverColor: $textColor.regular,
+};
+export const $notificationStyle = {
+    display: 'flex',
+    // width: getCssVar('notification-width'),
+    width: $notification.width,
+    // padding: getCssVar('notification-padding'),
+    padding: $notification.padding,
+    // border-radius: getCssVar('notification-radius'),
+    borderRadius: $notification.radius,
+    boxSizing: 'border-box',
+    // border: 1px solid getCssVar('notification-border-color'),
+    border: `1px solid ${$notification.borderColor}`,
+    position: 'fixed',
+    // background-color: getCssVar('bg-color', 'overlay'),
+    backgroundColor: $bgColor.overlay,
+    // box-shadow: getCssVar('notification-shadow'),
+    boxShadow: $notification.shadow,
+    // transition: opacity getCssVar('transition-duration'),
+    transition: 'opacity ' +
+        $transitionDurationDefault +
+        ', ' +
+        //   transform getCssVar('transition-duration'),
+        'transform ' +
+        $transitionDurationDefault +
+        ', ' +
+        //   top getCssVar('transition-duration'),
+        'top ' +
+        $transitionDurationDefault +
+        ', ' +
+        //   left getCssVar('transition-duration'),
+        'left ' +
+        $transitionDurationDefault +
+        ', ' +
+        //   right getCssVar('transition-duration'), top 0.4s,
+        'right ' +
+        $transitionDurationDefault +
+        ', ' +
+        //   bottom getCssVar('transition-duration'),
+        'bottom ' +
+        $transitionDurationDefault +
+        ', ',
+    overflowWrap: 'break-word',
+    overflow: 'hidden',
+    zIndex: 9999,
+};
+export const $notificationGroupStyle = {
+    //   margin-left: getCssVar('notification-group-margin-left');
+    marginLeft: $notification.groupMarginLeft,
+    // margin-right: getCssVar('notification-group-margin-right');
+    marginRight: $notification.groupMarginRight,
+};
+export const $notificationTitleStyle = {
+    fontWeight: 'bold',
+    // font-size: getCssVar('notification-title-font-size'),
+    fontSize: $notification.titleFontSize,
+    // line-height: getCssVar('notification-icon-size'),
+    lineHeight: $notification.iconSize,
+    // color: getCssVar('notification-title-color'),
+    color: $notification.titleColor,
+    margin: 0,
+};
+export const $notificationContentStyle = {
+    // font-size: getCssVar('notification-content-font-size'),
+    fontSize: $notification.contentFontSize,
+    lineHeight: '24px',
+    margin: '6px 0 0',
+    // color: getCssVar('notification-content-color'),
+    color: $notification.contentColor,
+};
+export const $notificationIconStyle = {
+    // height: getCssVar('notification-icon-size'),
+    height: $notification.iconSize,
+    // width: getCssVar('notification-icon-size'),
+    width: $notification.iconSize,
+    // font-size: getCssVar('notification-icon-size'),
+    fontSize: $notification.iconSize,
+};
+export const $notificationCloseBtnStyle = {
+    position: 'absolute',
+    top: '18px',
+    right: '15px',
+    cursor: 'pointer',
+    // color: getCssVar('notification-close-color'),
+    color: $notification.closeColor,
+    // font-size: getCssVar('notification-close-font-size'),
+    fontSize: $notification.closeFontSize,
+};
+export function useStyle(config) {
+    useType(config);
+}
+export function useType(config) {
+    // @each $type in (success, info, warning, error) {
+    //   & .#{$namespace}-notification--#{$type} {
+    //     @include css-var-from-global(
+    //         ('notification', 'icon-color'),
+    //         ('color', $type)
+    //       );
+    //       color: getCssVar('notification-icon-color');
+    //     }
+    //   }
+    const $notificationIconColor = $colors[(config === null || config === void 0 ? void 0 : config.type) || 'info'].base;
+    $notificationStyle.color = $notificationIconColor;
+}
+//# sourceMappingURL=td-notification.style.js.map

package/dist/src/components/feedback/td-notification/td-notification.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-notification.style.js","sourceRoot":"","sources":["../../../../../src/components/feedback/td-notification/td-notification.style.ts"],"names":[],"mappings":"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"}

package/dist/src/components/feedback/td-only-child/td-only-child.class.d.ts

@@ -0,0 +1,8 @@
+import { TypeFragmentProps, TypeFragment } from '@type-dom/framework';
+export declare class TdOnlyChild extends TypeFragment {
+    className: 'TdOnlyChild';
+    props: TypeFragmentProps;
+    constructor(params?: TypeFragmentProps);
+    setup(): void;
+}
+//# sourceMappingURL=td-only-child.class.d.ts.map

package/dist/src/components/feedback/td-only-child/td-only-child.class.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-only-child.class.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/td-only-child/td-only-child.class.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAEjB,YAAY,EAIb,MAAM,qBAAqB,CAAC;AAW7B,qBAAa,WAAY,SAAQ,YAAY;IAC3C,SAAS,EAAE,aAAa,CAAC;IAChB,KAAK,EAAE,iBAAiB,CAAC;gBAEtB,MAAM,GAAE,iBAAsB;IASjC,KAAK;CA6Cf"}

package/dist/src/components/feedback/td-only-child/td-only-child.class.js

@@ -0,0 +1,98 @@
+import { Span, TypeFragment, TypeElement, } from '@type-dom/framework';
+import { isObject } from '@type-dom/utils';
+import { FORWARD_REF_INJECTION_KEY,
+// ForwardRefInjectionContext,
+// useForwardRef,
+// useForwardRefDirective,
+ } from '../../../hooks/use-forward-ref';
+// import { Computed, isRef, Signal } from '@type-dom/signals';
+import { useNamespace } from '../../../hooks/use-namespace';
+export class TdOnlyChild extends TypeFragment {
+    constructor(params = {}) {
+        super();
+        this.className = 'TdOnlyChild';
+        // console.log('TdOnlyChild.constructor', params);
+        this.slotChildren(params.slot);
+        this.props = this.useParams(params);
+    }
+    // todo
+    setup() {
+        // console.log('TdOnlyChild.setup', this.props);
+        const forwardRefInjection = this.inject(FORWARD_REF_INJECTION_KEY);
+        // const forwardRefDirective = useForwardRefDirective(
+        //   forwardRefInjection?.setForwardRef ?? NOOP
+        // );
+        // const defaultSlot = this.props.slots?.default || this.props.slot;
+        // if (!defaultSlot) {
+        //   //   empty slot
+        // } else if (isString(defaultSlot) || isRef(defaultSlot)) {
+        //   //  一个文本节点
+        // } else if (defaultSlot instanceof Array) {
+        //   if (defaultSlot.length > 1) {
+        //     debugWarn('TdOnlyChild', 'requires exact only one valid child.');
+        //     // return null
+        //   }
+        //
+        //   const firstLegitNode = findFirstLegitChild(defaultSlot);
+        //   if (!firstLegitNode) {
+        //     debugWarn('TdOnlyChild', 'no valid child node found');
+        //     // return null
+        //   }
+        //   console.log('TdOnlyChild.setup firstLegitNode is ', firstLegitNode)
+        // } else {
+        //   //  一个组件节点
+        // }
+        // return withDirectives(cloneVNode(firstLegitNode!, attrs), [
+        //   [forwardRefDirective],
+        // ])
+        // return null; // add by me todo
+        const legitChild = findFirstLegitChild(this.childNodes);
+        if (legitChild instanceof TypeElement) {
+            legitChild === null || legitChild === void 0 ? void 0 : legitChild.onMounted(() => {
+                forwardRefInjection === null || forwardRefInjection === void 0 ? void 0 : forwardRefInjection.setForwardRef(legitChild.dom);
+            });
+            legitChild.onUpdated(() => {
+                forwardRefInjection === null || forwardRefInjection === void 0 ? void 0 : forwardRefInjection.setForwardRef(legitChild.dom);
+            });
+            legitChild.onUnmounted(() => {
+                forwardRefInjection === null || forwardRefInjection === void 0 ? void 0 : forwardRefInjection.setForwardRef(null);
+            });
+        }
+    }
+}
+function findFirstLegitChild(node) {
+    if (!node)
+        return null;
+    const children = node;
+    for (const child of children) {
+        /**
+         * when user uses h(Fragment, [text]) to render plain string,
+         * this switch case just cannot handle, when the value is primitives
+         * we should just return the wrapped string
+         */
+        if (isObject(child)) {
+            switch (child.props.nodeName // todo
+            ) {
+                case '#comment':
+                    continue;
+                case '#text':
+                    // case SVGElement:
+                    return wrapTextContent(child);
+                case 'fragment':
+                    return findFirstLegitChild(child.children);
+                default:
+                    return child;
+            }
+        }
+        return wrapTextContent(child);
+    }
+    return null;
+}
+function wrapTextContent(slot) {
+    const ns = useNamespace('only-child');
+    return new Span({
+        class: ns.e('content'),
+        slot: slot,
+    });
+}
+//# sourceMappingURL=td-only-child.class.js.map

package/dist/src/components/feedback/td-only-child/td-only-child.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-only-child.class.js","sourceRoot":"","sources":["../../../../../src/components/feedback/td-only-child/td-only-child.class.ts"],"names":[],"mappings":"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"}