@type-dom/ui 0.2.1 → 0.3.0

package/dist/src/components/basic/td-scrollbar/thumb/thumb.class.js

@@ -0,0 +1,150 @@
+import { inject, onBeforeUnmount, useEventListener, Div, Transition, TypeFragment } from '@type-dom/framework';
+import { computed, signal, unref } from '@type-dom/signals';
+import { isClient, throwError } from '@type-dom/utils';
+import { useNamespace } from '../../../../hooks/use-namespace';
+import { BAR_MAP, renderThumbStyle } from '../util';
+import { scrollbarContextKey } from '../td-scrollbar.const';
+export class Thumb extends TypeFragment {
+    constructor(params = {}) {
+        super();
+        this.className = 'Thumb';
+        this.props = this.useParams(params);
+    }
+    setup() {
+        const props = this.props;
+        const COMPONENT_NAME = 'Thumb';
+        const scrollbar = inject(scrollbarContextKey);
+        const ns = useNamespace('scrollbar');
+        if (!scrollbar)
+            throwError(COMPONENT_NAME, 'can not inject scrollbar context');
+        const instance = signal();
+        const thumb = signal();
+        const thumbState = signal({});
+        const visible = signal(false);
+        let cursorDown = false;
+        let cursorLeave = false;
+        let originalOnSelectStart = isClient ? document.onselectstart : null;
+        const bar = computed(() => BAR_MAP[props.vertical ? 'vertical' : 'horizontal']);
+        const thumbStyle = computed(() => {
+            // console.warn('thumStyle . ');
+            // props.size?.get();
+            // props.move?.get();
+            return renderThumbStyle({
+                size: props.size,
+                move: props.move,
+                bar: bar.get(),
+            });
+        });
+        const offsetRatio = computed(() => 
+        // offsetRatioX = original width of thumb / current width of thumb / ratioX
+        // offsetRatioY = original height of thumb / current height of thumb / ratioY
+        // instance height = wrap height - GAP
+        Math.pow(instance.get()[bar.get().offset], 2) /
+            scrollbar.wrapElement.get()[bar.get().scrollSize] /
+            unref(props.ratio) /
+            thumb.get()[bar.get().offset]);
+        const clickThumbHandler = (e) => {
+            var _a;
+            // prevent click event of middle and right button
+            if (!e)
+                return;
+            e === null || e === void 0 ? void 0 : e.stopPropagation();
+            if ((e === null || e === void 0 ? void 0 : e.ctrlKey) || [1, 2].includes(e.button))
+                return;
+            (_a = window.getSelection()) === null || _a === void 0 ? void 0 : _a.removeAllRanges();
+            startDrag(e);
+            const el = e.currentTarget;
+            if (!el)
+                return;
+            thumbState.get()[bar.get().axis] =
+                el[bar.get().offset] -
+                    (e[bar.get().client] - el.getBoundingClientRect()[bar.get().direction]);
+        };
+        const clickTrackHandler = (e) => {
+            if (!e || !thumb.get() || !instance.get() || !scrollbar.wrapElement)
+                return;
+            const offset = Math.abs(e.target.getBoundingClientRect()[bar.get().direction] -
+                e[bar.get().client]);
+            const thumbHalf = thumb.get()[bar.get().offset] / 2;
+            const thumbPositionPercentage = ((offset - thumbHalf) * 100 * offsetRatio.get()) /
+                instance.get()[bar.get().offset];
+            scrollbar.wrapElement.get()[bar.get().scroll] =
+                (thumbPositionPercentage * scrollbar.wrapElement.get()[bar.get().scrollSize]) /
+                    100;
+        };
+        const startDrag = (e) => {
+            e.stopImmediatePropagation();
+            cursorDown = true;
+            document.addEventListener('mousemove', mouseMoveDocumentHandler);
+            document.addEventListener('mouseup', mouseUpDocumentHandler);
+            originalOnSelectStart = document.onselectstart;
+            document.onselectstart = () => false;
+        };
+        const mouseMoveDocumentHandler = (e) => {
+            if (!instance.get() || !thumb.get())
+                return;
+            if (cursorDown === false)
+                return;
+            const prevPage = thumbState.get()[bar.get().axis];
+            if (!prevPage)
+                return;
+            const offset = (instance.get().getBoundingClientRect()[bar.get().direction] -
+                e[bar.get().client]) *
+                -1;
+            const thumbClickPosition = thumb.get()[bar.get().offset] - prevPage;
+            const thumbPositionPercentage = ((offset - thumbClickPosition) * 100 * offsetRatio.get()) /
+                instance.get()[bar.get().offset];
+            scrollbar.wrapElement.get()[bar.get().scroll] =
+                (thumbPositionPercentage * scrollbar.wrapElement.get()[bar.get().scrollSize]) /
+                    100;
+        };
+        const mouseUpDocumentHandler = () => {
+            cursorDown = false;
+            thumbState.get()[bar.get().axis] = 0;
+            document.removeEventListener('mousemove', mouseMoveDocumentHandler);
+            document.removeEventListener('mouseup', mouseUpDocumentHandler);
+            restoreOnselectstart();
+            if (cursorLeave)
+                visible.set(false);
+        };
+        const mouseMoveScrollbarHandler = () => {
+            var _a;
+            cursorLeave = false;
+            visible.set(!!((_a = props.size) === null || _a === void 0 ? void 0 : _a.get()));
+        };
+        const mouseLeaveScrollbarHandler = () => {
+            cursorLeave = true;
+            visible.set(cursorDown);
+        };
+        onBeforeUnmount(() => {
+            restoreOnselectstart();
+            document.removeEventListener('mouseup', mouseUpDocumentHandler);
+        });
+        const restoreOnselectstart = () => {
+            if (document.onselectstart !== originalOnSelectStart)
+                document.onselectstart = originalOnSelectStart;
+        };
+        useEventListener(scrollbar.scrollbarElement, 'mousemove', mouseMoveScrollbarHandler);
+        useEventListener(scrollbar.scrollbarElement, 'mouseleave', mouseLeaveScrollbarHandler);
+        this.addChild(new Transition({
+            name: ns.b('fade'),
+            slot: new Div({
+                vShow: computed(() => props.always || visible.get()),
+                refDom: instance,
+                class: computed(() => [ns.e('bar'), ns.is(bar.get().key)]),
+                events: {
+                    mousedown: clickTrackHandler,
+                },
+                slot: new Div({
+                    refDom: thumb,
+                    class: ns.e('thumb'),
+                    styleObj: thumbStyle,
+                    events: {
+                        mousedown: clickThumbHandler,
+                    },
+                }),
+            })
+        }));
+    }
+}
+//# sourceMappingURL=thumb.class.js.map

package/dist/src/components/basic/td-scrollbar/thumb/thumb.class.js.map

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

package/dist/src/components/basic/td-scrollbar/thumb/thumb.interface.d.ts

@@ -0,0 +1,13 @@
+import { ITypeFragment, TypeFragmentProps } from '@type-dom/framework';
+import { Ref } from '@type-dom/signals';
+export interface IThumb extends ITypeFragment {
+    className: 'Thumb';
+}
+export interface ThumbProps extends TypeFragmentProps {
+    vertical?: boolean;
+    size?: Ref<string>;
+    move?: Ref<number>;
+    ratio?: Ref<number>;
+    always?: boolean;
+}
+//# sourceMappingURL=thumb.interface.d.ts.map

package/dist/src/components/basic/td-scrollbar/thumb/thumb.interface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"thumb.interface.d.ts","sourceRoot":"","sources":["../../../../../../src/components/basic/td-scrollbar/thumb/thumb.interface.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACvE,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,MAAM,WAAW,MAAO,SAAQ,aAAa;IAC3C,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,UAAW,SAAQ,iBAAiB;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IACnB,IAAI,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IACnB,KAAK,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB"}

package/dist/src/components/basic/td-scrollbar/thumb/thumb.interface.js

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

package/dist/src/components/basic/td-scrollbar/thumb/thumb.interface.js.map

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

package/dist/src/components/basic/td-scrollbar/util.d.ts

@@ -0,0 +1,29 @@
+import { IStyle } from '@type-dom/css-type';
+import { ThumbProps } from './thumb/thumb.interface';
+export declare const GAP = 4;
+export declare const BAR_MAP: {
+    readonly vertical: {
+        readonly offset: "offsetHeight";
+        readonly scroll: "scrollTop";
+        readonly scrollSize: "scrollHeight";
+        readonly size: "height";
+        readonly key: "vertical";
+        readonly axis: "Y";
+        readonly client: "clientY";
+        readonly direction: "top";
+    };
+    readonly horizontal: {
+        readonly offset: "offsetWidth";
+        readonly scroll: "scrollLeft";
+        readonly scrollSize: "scrollWidth";
+        readonly size: "width";
+        readonly key: "horizontal";
+        readonly axis: "X";
+        readonly client: "clientX";
+        readonly direction: "left";
+    };
+};
+export declare const renderThumbStyle: ({ move, size, bar, }: Pick<ThumbProps, "move" | "size"> & {
+    bar: (typeof BAR_MAP)[keyof typeof BAR_MAP];
+}) => IStyle;
+//# sourceMappingURL=util.d.ts.map

package/dist/src/components/basic/td-scrollbar/util.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../../../src/components/basic/td-scrollbar/util.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAE5C,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAGrD,eAAO,MAAM,GAAG,IAAI,CAAC;AAErB,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;CAqBV,CAAC;AAEX,eAAO,MAAM,gBAAgB,yBAI1B,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,CAAC,GAAG;IACrC,GAAG,EAAE,CAAC,OAAO,OAAO,EAAE,MAAM,OAAO,OAAO,CAAC,CAAC;CAC7C,KAAG,MAQH,CAAC"}

package/dist/src/components/basic/td-scrollbar/util.js

@@ -0,0 +1,35 @@
+import { unref } from '@type-dom/signals';
+import { addUnit } from '@type-dom/utils';
+export const GAP = 4; // top 2 + bottom 2 of bar instance
+export const BAR_MAP = {
+    vertical: {
+        offset: 'offsetHeight',
+        scroll: 'scrollTop',
+        scrollSize: 'scrollHeight',
+        size: 'height',
+        key: 'vertical',
+        axis: 'Y',
+        client: 'clientY',
+        direction: 'top',
+    },
+    horizontal: {
+        offset: 'offsetWidth',
+        scroll: 'scrollLeft',
+        scrollSize: 'scrollWidth',
+        size: 'width',
+        key: 'horizontal',
+        axis: 'X',
+        client: 'clientX',
+        direction: 'left',
+    },
+};
+export const renderThumbStyle = ({ move, size, bar, }) => {
+    // console.warn('size is ', size);
+    // console.warn('move is ', move);
+    // console.warn('bar is ', bar);
+    return {
+        [bar.size]: addUnit(size === null || size === void 0 ? void 0 : size.get()),
+        transform: `translate${bar.axis}(${unref(move)}%)`,
+    };
+};
+//# sourceMappingURL=util.js.map

package/dist/src/components/basic/td-scrollbar/util.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"util.js","sourceRoot":"","sources":["../../../../../src/components/basic/td-scrollbar/util.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1C,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAE1C,MAAM,CAAC,MAAM,GAAG,GAAG,CAAC,CAAC,CAAC,mCAAmC;AAEzD,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,QAAQ,EAAE;QACR,MAAM,EAAE,cAAc;QACtB,MAAM,EAAE,WAAW;QACnB,UAAU,EAAE,cAAc;QAC1B,IAAI,EAAE,QAAQ;QACd,GAAG,EAAE,UAAU;QACf,IAAI,EAAE,GAAG;QACT,MAAM,EAAE,SAAS;QACjB,SAAS,EAAE,KAAK;KACjB;IACD,UAAU,EAAE;QACV,MAAM,EAAE,aAAa;QACrB,MAAM,EAAE,YAAY;QACpB,UAAU,EAAE,aAAa;QACzB,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,YAAY;QACjB,IAAI,EAAE,GAAG;QACT,MAAM,EAAE,SAAS;QACjB,SAAS,EAAE,MAAM;KAClB;CACO,CAAC;AAEX,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAC/B,IAAI,EACJ,IAAI,EACJ,GAAG,GAGJ,EAAU,EAAE;IACX,kCAAkC;IAClC,kCAAkC;IAClC,gCAAgC;IAChC,OAAO;QACL,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,GAAG,EAAE,CAAC;QAChC,SAAS,EAAE,YAAY,GAAG,CAAC,IAAI,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI;KACnD,CAAA;AACH,CAAC,CAAC"}

package/dist/src/components/basic/td-space/style/css.d.ts

@@ -0,0 +1,3 @@
+import '../../../base/style/css';
+import '@element-plus/theme-chalk/el-space.css';
+//# sourceMappingURL=css.d.ts.map

package/dist/src/components/basic/td-space/style/css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"css.d.ts","sourceRoot":"","sources":["../../../../../../src/components/basic/td-space/style/css.ts"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAC;AACjC,OAAO,wCAAwC,CAAC"}

package/dist/src/components/basic/td-space/style/css.js

@@ -0,0 +1,3 @@
+import '../../../base/style/css';
+import '@element-plus/theme-chalk/el-space.css';
+//# sourceMappingURL=css.js.map

package/dist/src/components/basic/td-space/style/css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"css.js","sourceRoot":"","sources":["../../../../../../src/components/basic/td-space/style/css.ts"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAC;AACjC,OAAO,wCAAwC,CAAC"}

package/dist/src/components/basic/td-space/style/index.d.ts

@@ -0,0 +1,3 @@
+import '../../../base/style';
+import '../../../../theme-chalk/space.scss';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/components/basic/td-space/style/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/basic/td-space/style/index.ts"],"names":[],"mappings":"AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,oCAAoC,CAAC"}

package/dist/src/components/basic/td-space/style/index.js

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

package/dist/src/components/basic/td-space/style/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/basic/td-space/style/index.ts"],"names":[],"mappings":"AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,oCAAoC,CAAC"}

package/dist/src/components/basic/td-space/td-space-item/td-space-item.class.d.ts

@@ -0,0 +1,9 @@
+import { TypeDiv } from '@type-dom/framework';
+import { SpaceItemProps } from './td-space-item.interface';
+export declare class TdSpaceItem extends TypeDiv {
+    className: 'TdSpaceItem';
+    props: SpaceItemProps;
+    constructor(params?: SpaceItemProps);
+    setup(): void;
+}
+//# sourceMappingURL=td-space-item.class.d.ts.map

package/dist/src/components/basic/td-space/td-space-item/td-space-item.class.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-space-item.class.d.ts","sourceRoot":"","sources":["../../../../../../src/components/basic/td-space/td-space-item/td-space-item.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAG9C,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAE3D,qBAAa,WAAY,SAAQ,OAAO;IACtC,SAAS,EAAE,aAAa,CAAC;IAChB,KAAK,EAAE,cAAc,CAAC;gBAEnB,MAAM,GAAE,cAAmB;IAM9B,KAAK;CAQf"}

package/dist/src/components/basic/td-space/td-space-item/td-space-item.class.js

@@ -0,0 +1,19 @@
+import { TypeDiv } from '@type-dom/framework';
+import { computed } from '@type-dom/signals';
+import { useNamespace } from '../../../../hooks/use-namespace';
+export class TdSpaceItem extends TypeDiv {
+    constructor(params = {}) {
+        super();
+        this.className = 'TdSpaceItem';
+        this.props = this.useParams(params);
+    }
+    setup() {
+        var _a;
+        const props = this.props;
+        const ns = useNamespace('space');
+        const classes = computed(() => `${(props === null || props === void 0 ? void 0 : props.prefixCls) || ns.b()}__item`);
+        this.attr.addClass(classes);
+        this.slotChildren(props.slot || ((_a = props.slots) === null || _a === void 0 ? void 0 : _a.default));
+    }
+}
+//# sourceMappingURL=td-space-item.class.js.map

package/dist/src/components/basic/td-space/td-space-item/td-space-item.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-space-item.class.js","sourceRoot":"","sources":["../../../../../../src/components/basic/td-space/td-space-item/td-space-item.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAG/D,MAAM,OAAO,WAAY,SAAQ,OAAO;IAItC,YAAY,SAAyB,EAAE;QACrC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,SAAS,GAAG,aAAa,CAAC;QAC/B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;IACtC,CAAC;IAEQ,KAAK;;QACZ,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QACzB,MAAM,EAAE,GAAG,YAAY,CAAC,OAAO,CAAC,CAAC;QAEjC,MAAM,OAAO,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,GAAG,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,SAAS,KAAI,EAAE,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;QACtE,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;QAC5B,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,IAAI,KAAI,MAAA,KAAK,CAAC,KAAK,0CAAE,OAAO,CAAA,CAAC,CAAC;IACxD,CAAC;CACF"}

package/dist/src/components/basic/td-space/td-space-item/td-space-item.interface.d.ts

@@ -0,0 +1,8 @@
+import { ITypeDiv, TypeDivProps } from '@type-dom/framework';
+export interface ITdSpaceItem extends ITypeDiv {
+    className: 'TdSpaceItem';
+}
+export interface SpaceItemProps extends TypeDivProps {
+    prefixCls?: string;
+}
+//# sourceMappingURL=td-space-item.interface.d.ts.map

package/dist/src/components/basic/td-space/td-space-item/td-space-item.interface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-space-item.interface.d.ts","sourceRoot":"","sources":["../../../../../../src/components/basic/td-space/td-space-item/td-space-item.interface.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAE7D,MAAM,WAAW,YAAa,SAAQ,QAAQ;IAC5C,SAAS,EAAE,aAAa,CAAC;CAC1B;AAED,MAAM,WAAW,cAAe,SAAQ,YAAY;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB"}

package/dist/src/components/basic/td-space/td-space-item/td-space-item.interface.js

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

package/dist/src/components/basic/td-space/td-space-item/td-space-item.interface.js.map

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

package/dist/src/components/basic/td-space/td-space.class.d.ts

@@ -0,0 +1,10 @@
+import { TypeDiv } from '@type-dom/framework';
+import { ITdSpace, SpaceProps } from './td-space.interface';
+import './style/index';
+export declare class TdSpace extends TypeDiv implements ITdSpace {
+    className: 'TdSpace';
+    props: SpaceProps;
+    constructor(params?: SpaceProps);
+    setup(): void;
+}
+//# sourceMappingURL=td-space.class.d.ts.map

package/dist/src/components/basic/td-space/td-space.class.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-space.class.d.ts","sourceRoot":"","sources":["../../../../../src/components/basic/td-space/td-space.class.ts"],"names":[],"mappings":"AAEA,OAAO,EAML,OAAO,EAIR,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAI5D,OAAO,eAAe,CAAC;AAEvB,qBAAa,OAAQ,SAAQ,OAAQ,YAAW,QAAQ;IACtD,SAAS,EAAE,SAAS,CAAC;IACZ,KAAK,EAAE,UAAU,CAAC;gBAEf,MAAM,GAAE,UAAe;IAQ1B,KAAK;CAyJf"}

package/dist/src/components/basic/td-space/td-space.class.js

@@ -0,0 +1,152 @@
+import { isArray } from '@type-dom/utils';
+import { computed, toRaw } from '@type-dom/signals';
+import { arraySlot, isFragment, isValidElementNode, Span, TypeDiv, For, } from '@type-dom/framework';
+import { spaceProps } from './td-space.const';
+import { TdSpaceItem } from './td-space-item/td-space-item.class';
+import { useSpace } from './use-space';
+import './style/index';
+export class TdSpace extends TypeDiv {
+    constructor(params = {}) {
+        super();
+        this.className = 'TdSpace';
+        this.attr.addName('td-space');
+        this.assignProps(spaceProps);
+        this.props = this.useParams(params);
+    }
+    setup() {
+        var _a, _b;
+        // console.log('td-space setup . ');
+        const props = this.props;
+        const { classes, containerStyle, itemStyle } = useSpace(props);
+        // console.warn('containerStyle is ', containerStyle);
+        // retrieve the children out via a simple for loop
+        // the edge case here is that when users uses directives like <v-for>, <v-if>
+        // we need to go deeper until the child is not the Fragment type
+        function extractChildren(children, parentKey = '', extractedChildren = []) {
+            // console.warn('extractChildren is ', children);
+            // const { prefixCls } = props
+            children.forEach((child, loopKey) => {
+                if (isFragment(child)) {
+                    if (child instanceof For) {
+                        // For element should be done here
+                        const data = toRaw(child.props.data);
+                        const getter = child.props.getter;
+                        if (data !== undefined) {
+                            data.forEach((item, index) => {
+                                let slot;
+                                if (getter) {
+                                    slot = getter(item, index);
+                                }
+                                else {
+                                    slot = item;
+                                }
+                                extractedChildren.push(new TdSpaceItem({
+                                    styleObj: itemStyle,
+                                    prefixCls: props.prefixCls,
+                                    slot: slot,
+                                }));
+                            });
+                        }
+                    }
+                    else if (isArray(child.children)) {
+                        child.children.forEach((nested, key) => {
+                            if (isFragment(nested) && isArray(nested.children)) {
+                                extractChildren(nested.children, `${parentKey + key}-`, extractedChildren);
+                            }
+                            else {
+                                extractedChildren.push(new TdSpaceItem({
+                                    styleObj: itemStyle,
+                                    prefixCls: props.prefixCls,
+                                    slot: nested,
+                                }));
+                            }
+                        });
+                    }
+                    // if the current child is valid vnode, then append this current vnode
+                    // to item as child node.
+                }
+                else if (isValidElementNode(child)) {
+                    extractedChildren.push(new TdSpaceItem({
+                        styleObj: itemStyle,
+                        prefixCls: props.prefixCls,
+                        slot: child,
+                    }));
+                }
+            });
+            return extractedChildren;
+        }
+        const { spacer, direction } = props;
+        // this.slotChildren(props.slot || props.slots?.default);
+        // this.children.forEach((item) => {
+        //   if (item instanceof TypeHtml) {
+        //     item.style.addObj({
+        //       display: 'flex',
+        //       flexWrap: 'wrap'
+        //     });
+        //   } else if (item instanceof TypeFragment) {
+        //     item.addStyleObj({
+        //       display: 'flex',
+        //       flexWrap: 'wrap'
+        //     })
+        //   }
+        // });
+        // const children = renderSlot(slots, 'default', { key: 0 }, () => [])
+        const children = arraySlot((_a = props.slot) !== null && _a !== void 0 ? _a : (_b = props.slots) === null || _b === void 0 ? void 0 : _b.default);
+        // if ((children.children ?? []).length === 0) return null
+        if ((children !== null && children !== void 0 ? children : []).length === 0)
+            return;
+        // loop the children, if current children is rendered via `renderList` or `<v-for>`
+        if (isArray(children)) {
+            let extractedChildren = extractChildren(children);
+            // console.log('extractChildren is ', extractedChildren);
+            if (spacer) {
+                // track the current rendering index, when encounters the last element
+                // then no need to add a spacer after it.
+                const len = extractedChildren.length - 1;
+                extractedChildren = extractedChildren.reduce((acc, child, idx) => {
+                    const children = [...acc, child];
+                    if (idx !== len) {
+                        children.push(
+                        // adding width 100% for vertical alignment,
+                        // when the spacer inherit the width from the
+                        // parent, this span's width was not set, so space
+                        // might disappear
+                        new Span({
+                            styleObj: computed(() => [
+                                itemStyle.get(),
+                                { width: direction === 'vertical' ? '100%' : undefined },
+                            ]),
+                            // if spacer is already a valid node, then append it to the current
+                            // span element.
+                            // otherwise, treat it as string.
+                            slot: spacer,
+                        })
+                        // createVNode(
+                        //   'span',
+                        //   {
+                        //     style: [
+                        //       itemStyle.value,
+                        //       direction === 'vertical' ? 'width: 100%' : null,
+                        //     ],
+                        //     key: idx,
+                        //   },
+                        //   [
+                        //     isVNode(spacer)
+                        //       ? spacer
+                        //       : createTextVNode(spacer as string, PatchFlags.TEXT),
+                        //   ],
+                        //   PatchFlags.STYLE
+                        // )
+                        );
+                    }
+                    return children;
+                }, []);
+            }
+            // spacer container.
+            this.attr.addClass(classes);
+            this.style.addObj(containerStyle);
+            this.slotChildren(extractedChildren);
+        }
+    }
+}
+//# sourceMappingURL=td-space.class.js.map

package/dist/src/components/basic/td-space/td-space.class.js.map

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

package/dist/src/components/basic/td-space/td-space.const.d.ts

@@ -0,0 +1,6 @@
+import { SpaceProps } from './td-space.interface';
+export declare const SIZE_MAP: {
+    [propName: string]: number;
+};
+export declare const spaceProps: SpaceProps;
+//# sourceMappingURL=td-space.const.d.ts.map

package/dist/src/components/basic/td-space/td-space.const.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-space.const.d.ts","sourceRoot":"","sources":["../../../../../src/components/basic/td-space/td-space.const.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAElD,eAAO,MAAM,QAAQ,EAAE;IAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAAA;CAIlD,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,UAIxB,CAAC"}

package/dist/src/components/basic/td-space/td-space.const.js

@@ -0,0 +1,11 @@
+export const SIZE_MAP = {
+    small: 8,
+    default: 12,
+    large: 16,
+};
+export const spaceProps = {
+    direction: 'horizontal',
+    alignment: 'center', // StyleAlignItems.center,
+    fillRatio: 100,
+};
+//# sourceMappingURL=td-space.const.js.map

package/dist/src/components/basic/td-space/td-space.const.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-space.const.js","sourceRoot":"","sources":["../../../../../src/components/basic/td-space/td-space.const.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,QAAQ,GAAmC;IACtD,KAAK,EAAE,CAAC;IACR,OAAO,EAAE,EAAE;IACX,KAAK,EAAE,EAAE;CACV,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAe;IACpC,SAAS,EAAE,YAAY;IACvB,SAAS,EAAE,QAAQ,EAAE,0BAA0B;IAC/C,SAAS,EAAE,GAAG;CACf,CAAC"}

package/dist/src/components/basic/td-space/td-space.interface.d.ts

@@ -0,0 +1,51 @@
+import { ITypeDiv, TypeDivProps, TypeNode } from '@type-dom/framework';
+import { Property } from '@type-dom/css-type';
+import { MaybeRef } from '@type-dom/signals';
+import { ComponentSize } from '../../../constants';
+export interface ITdSpace extends ITypeDiv {
+    className: 'TdSpace';
+    horizontalSize?: number;
+    verticalSize?: number;
+}
+export interface SpaceProps extends TypeDivProps {
+    /**
+     * @description Placement direction	排列的方向
+     */
+    direction?: MaybeRef<'horizontal' | 'vertical'>;
+    /**
+     * @description Classname
+     */
+    /**
+     * @description Controls the alignment of items	对齐方式
+     * 对应 align-items
+     */
+    alignment?: Property.AlignItems;
+    /**
+     * @description Prefix for space-items
+     */
+    prefixCls?: string;
+    /**
+     * @description Spacer	间隔符
+     */
+    spacer?: string | number | TypeNode;
+    /**
+     * @description Auto wrapping 设置是否自动折行 default: false
+     */
+    wrap?: boolean;
+    /**
+     * @description Whether to fill the container	是否填充剩余空间 default: false
+     */
+    fill?: MaybeRef<boolean>;
+    /**
+     * @description Ratio of fill
+     * 填充比率 default: 100
+     */
+    fillRatio?: MaybeRef<number>;
+    /**
+     * Sets the space between each element.
+     * 间隔大小
+     * 元组：[水平间隔，垂直间隔]；
+     */
+    size?: MaybeRef<number | ComponentSize | string | [h: number, v: number]>;
+}
+//# sourceMappingURL=td-space.interface.d.ts.map

package/dist/src/components/basic/td-space/td-space.interface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-space.interface.d.ts","sourceRoot":"","sources":["../../../../../src/components/basic/td-space/td-space.interface.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,YAAY,EACZ,QAAQ,EACT,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,MAAM,WAAW,QAAS,SAAQ,QAAQ;IACxC,SAAS,EAAE,SAAS,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,WAAW,UAAW,SAAQ,YAAY;IAC9C;;OAEG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC,YAAY,GAAG,UAAU,CAAC,CAAC;IAChD;;OAEG;IAEH;;;OAGG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC,UAAU,CAAC;IAEhC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC;IACpC;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IACzB;;;OAGG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IAC7B;;;;OAIG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC,MAAM,GAAG,aAAa,GAAG,MAAM,GAAG,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC;CAC3E"}

package/dist/src/components/basic/td-space/td-space.interface.js

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

package/dist/src/components/basic/td-space/td-space.interface.js.map

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