@type-dom/ui 0.0.4 → 0.0.6

package/src/ui/ui.abstract.js

@@ -1,22 +1,50 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.UI = void 0;
+exports.UI = exports.componentId = void 0;
 const framework_1 = require("@type-dom/framework");
-let componentId = 0;
-class UI extends framework_1.TypeHtml {
-    constructor(config) {
+exports.componentId = 0;
+class UI extends framework_1.TypeElement {
+    // 手动的方式设置 fragment; 实现类似 TypeFragment 类
+    constructor(params, tag = 'div') {
         super();
-        this.componentId = componentId++;
-        this.addAttrObj({
-            componentId: this.componentId
+        this.params = params !== null && params !== void 0 ? params : this.params; // setConfig  重复
+        this.componentId = exports.componentId++;
+        this.ctrl.addAttrObj({
+            componentId: this.componentId,
         });
-        if (config === null || config === void 0 ? void 0 : config.tag) {
-            this.nodeName = config.tag;
+        this.nodeName = tag;
+        if (this.nodeName === 'fragment') {
+            this.dom = undefined;
         }
         else {
-            this.nodeName = 'div';
+            this.dom = document.createElement(this.nodeName.trim());
         }
-        this.dom = document.createElement(this.nodeName.trim());
+        this.slotNodes = {
+            default: new framework_1.SlotNode('default'),
+        };
+        // todo 统一处理，还是在各个类中处理
+        this.useSlots(params);
+    }
+    /**
+     * 确保slot存在，不存在则创建；
+     * 要在useSlots之后调用
+     *
+     * @param name
+     */
+    getSlotNode(name = 'default') {
+        var _a;
+        return this.slotNodes[name] = (_a = this.slotNodes[name]) !== null && _a !== void 0 ? _a : new framework_1.SlotNode(name);
+    }
+    useSlots(params) {
+        if (params === null || params === void 0 ? void 0 : params.slot) {
+            this.getSlotNode().resetSlot(params.slot);
+        }
+        (params === null || params === void 0 ? void 0 : params.slots) &&
+            Object.keys(params.slots).forEach((key) => {
+                var _a;
+                this.getSlotNode(key).resetSlot((_a = params.slots) === null || _a === void 0 ? void 0 : _a[key]);
+            });
+        return this.slotNodes;
     }
 }
 exports.UI = UI;

package/src/ui/ui.interface.d.ts

@@ -1,8 +1,12 @@
-import { ITypeConfig, ITypeHtml } from '@type-dom/framework';
-export interface IUI extends ITypeHtml {
+import { ISlotNodes, ITypeConfig, ITypeElement, SlotNode } from '@type-dom/framework';
+export interface IUI extends ITypeElement {
     componentId?: string | number;
 }
 export interface IUIConfig extends ITypeConfig {
     tag?: string;
-    items?: IUIConfig[];
+    items?: ITypeConfig[];
+    childNodes?: undefined;
+}
+export interface IUISlotNodes extends ISlotNodes {
+    default: SlotNode;
 }

package/src/utils/types.d.ts

@@ -0,0 +1,8 @@
+export declare const isUndefined: (val: any) => val is undefined;
+export declare const isBoolean: (val: any) => val is boolean;
+export declare const isNumber: (val: any) => val is number;
+export declare const isEmpty: (val: unknown) => boolean;
+export declare const isElement: (e: unknown) => e is Element;
+export declare const isPropAbsent: (prop: unknown) => prop is null | undefined;
+export declare const isStringNumber: (val: string) => boolean;
+export declare const isWindow: (val: unknown) => val is Window;

package/src/utils/types.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isWindow = exports.isStringNumber = exports.isPropAbsent = exports.isElement = exports.isEmpty = exports.isNumber = exports.isBoolean = exports.isUndefined = void 0;
+const utils_1 = require("@type-dom/utils");
+const isUndefined = (val) => val === undefined;
+exports.isUndefined = isUndefined;
+const isBoolean = (val) => typeof val === 'boolean';
+exports.isBoolean = isBoolean;
+const isNumber = (val) => typeof val === 'number';
+exports.isNumber = isNumber;
+const isEmpty = (val) => (!val && val !== 0) ||
+    ((0, utils_1.isArray)(val) && val.length === 0) ||
+    ((0, utils_1.isObject)(val) && !Object.keys(val).length);
+exports.isEmpty = isEmpty;
+const isElement = (e) => {
+    if (typeof Element === 'undefined')
+        return false;
+    return e instanceof Element;
+};
+exports.isElement = isElement;
+const isPropAbsent = (prop) => {
+    return (0, utils_1.isNil)(prop);
+};
+exports.isPropAbsent = isPropAbsent;
+const isStringNumber = (val) => {
+    if (!(0, utils_1.isString)(val)) {
+        return false;
+    }
+    return !Number.isNaN(Number(val));
+};
+exports.isStringNumber = isStringNumber;
+const isWindow = (val) => {
+    return val === window;
+};
+exports.isWindow = isWindow;

package/src/components/basic/td-layout/td-row/td-row.style.d.ts

@@ -1 +0,0 @@
-export {};

package/src/components/basic/td-layout/td-row/td-row.style.js

@@ -1,8 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const $base = {
-    display: 'flex',
-    flexWrap: 'wrap',
-    position: 'relative',
-    boxSizing: 'border-box'
-};

package/src/components/form/td-select/option/option.class.d.ts

@@ -1,6 +0,0 @@
-import { UI } from '../../../../ui/ui.abstract';
-import { ITdOption, ITdOptionConfig } from './option.interface';
-export declare class TdOption extends UI implements ITdOption {
-    className: 'TdOption';
-    constructor(config?: ITdOptionConfig);
-}

package/src/components/form/td-select/option-group/option-group.class.d.ts

@@ -1,6 +0,0 @@
-import { UI } from '../../../../ui/ui.abstract';
-import { ITdOptionGroup, ITdOptionGroupConfig } from './option-group.interface';
-export declare class TdOptionGroup extends UI implements ITdOptionGroup {
-    className: 'TdOptionGroup';
-    constructor(config?: ITdOptionGroupConfig);
-}