pixuireactcomponents 1.1.21 → 1.1.23

package/ui/components/button/Button.js

@@ -1,37 +1,37 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-import { h, Component } from "preact";
-var Button = /** @class */ (function (_super) {
-    __extends(Button, _super);
-    function Button() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Button.prototype.render = function (props) {
-        var _this = this;
-        return (h("div", { onClick: function () {
-                var _a;
-                if (_this.props.clickEvent) {
-                    if (_this.props.clickArr)
-                        (_a = _this.props).clickEvent.apply(_a, props.clickArr);
-                    else
-                        _this.props.clickEvent();
-                }
-            }, onMouseDown: function () { _this.btnImg.src = _this.props.pic_yaxia; }, onMouseUp: function () { _this.btnImg.src = _this.props.pic_xuanfu; }, onMouseOver: function () { _this.btnImg.src = _this.props.pic_xuanfu; }, onMouseOut: function () { _this.btnImg.src = _this.props.pic_changtai; } },
-            h("img", { ref: function (img) { _this.btnImg = img; }, src: this.props.pic_changtai })));
-    };
-    return Button;
-}(Component));
-export { Button };
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+import { h, Component } from "preact";
+var Button = /** @class */ (function (_super) {
+    __extends(Button, _super);
+    function Button() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    Button.prototype.render = function (props) {
+        var _this = this;
+        return (h("div", { onClick: function () {
+                var _a;
+                if (_this.props.clickEvent) {
+                    if (_this.props.clickArr)
+                        (_a = _this.props).clickEvent.apply(_a, props.clickArr);
+                    else
+                        _this.props.clickEvent();
+                }
+            }, onMouseDown: function () { _this.btnImg.src = _this.props.pic_yaxia; }, onMouseUp: function () { _this.btnImg.src = _this.props.pic_xuanfu; }, onMouseOver: function () { _this.btnImg.src = _this.props.pic_xuanfu; }, onMouseOut: function () { _this.btnImg.src = _this.props.pic_changtai; } },
+            h("img", { ref: function (img) { _this.btnImg = img; }, src: this.props.pic_changtai })));
+    };
+    return Button;
+}(Component));
+export { Button };

package/ui/components/carousel/Carousel.d.ts

@@ -1,5 +1,5 @@
-import { h } from 'preact';
-export declare function Carousel(props: any): h.JSX.Element;
-export declare namespace Carousel {
-    var Item: (props: any) => h.JSX.Element;
-}
+import { h } from 'preact';
+export declare function Carousel(props: any): h.JSX.Element;
+export declare namespace Carousel {
+    var Item: (props: any) => h.JSX.Element;
+}

package/ui/components/carousel/Carousel.js

@@ -1,219 +1,219 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import { h } from 'preact';
-import { useState, useEffect, useRef, useMemo, useImperativeHandle } from '../../../../../lib/preact/hooks/src';
-// import React, { useState, useEffect, useRef, useMemo } from 'preact/hooks';
-var indicatorStyle = { width: '20px', height: '8px', margin: '5px', backgroundColor: '#cecfda', borderRadius: '3px' };
-var indicatorSelectedStyle = __assign(__assign({}, indicatorStyle), { backgroundColor: '#fafbfc' });
-export function Carousel(props) {
-    var _a = props.children, children = _a === void 0 ? [] : _a, _b = props.defaultIndex, defaultIndex = _b === void 0 ? 1 : _b, _c = props.compWidth, compWidth = _c === void 0 ? 100 : _c, _d = props.compHeight, compHeight = _d === void 0 ? 100 : _d, _e = props.autoplay, autoplay = _e === void 0 ? true : _e, _f = props.switchDuration, switchDuration = _f === void 0 ? 3000 : _f, _g = props.loop, loop = _g === void 0 ? true : _g, _h = props.isVertical, isVertical = _h === void 0 ? false : _h, _j = props.touchable, touchable = _j === void 0 ? true : _j, _k = props.onSlideChange, onSlideChange = _k === void 0 ? null : _k, _l = props.onclickEvent, onclickEvent = _l === void 0 ? null : _l;
-    useImperativeHandle(props.cRef, function () { return ({
-        handleNext: handleNext,
-        handlePrev: handlePrev
-    }); });
-    var duration = switchDuration < 1000 ? 1000 : switchDuration;
-    var _m = useState(defaultIndex), showIndex = _m[0], setShowIndex = _m[1];
-    //轮播元素正在滚动
-    var isMoving = useRef(false);
-    //鼠标手势信息
-    var isMouseDown = useRef(false);
-    var mouseDownX = useRef(0);
-    var mouseDownY = useRef(0);
-    var handleNextRef = useRef(function () { });
-    var nextInterval = useRef();
-    var _o = useState(true), showTransition = _o[0], setShowTransition = _o[1];
-    var _p = useState([0, 0]), gesteroffset = _p[0], setGesteroffset = _p[1];
-    var _q = useState(''), logTex = _q[0], setLogTex = _q[1];
-    var offset = useMemo(function () { return -(isVertical ? compHeight : compWidth) * showIndex; }, [showIndex]);
-    var itemBoxStyle = { minWidth: compWidth + 'px', minHeight: compHeight + 'px', maxWidth: compWidth + 'px', maxHeight: compHeight + 'px', };
-    var carouselItems = useMemo(function () {
-        var firstChild = children[0];
-        var lastChild = children[children.length - 1];
-        return __spreadArray(__spreadArray([lastChild], children, true), [firstChild], false);
-    }, [children]);
-    var isLastCarouseItem = function () { return showIndex === carouselItems.length - 1; };
-    var isFirstCarouseLastItem = function () { return showIndex === 0; };
-    useEffect(function () {
-        setNextInterval();
-    }, [autoplay]);
-    useEffect(function () {
-        //每次跳转前判断打开动画，否则动画关闭以后不会调用handleTransitionEnd
-        if (!isLastCarouseItem() && !isFirstCarouseLastItem()) {
-            setShowTransition(true);
-        }
-    }, [showIndex]);
-    //更新handleNext的环境
-    useEffect(function () {
-        handleNextRef.current = handleNext;
-    });
-    var setNextInterval = function () {
-        clearInterval(nextInterval.current);
-        if (autoplay) {
-            nextInterval.current = setInterval(function () {
-                handleNextRef.current();
-            }, duration);
-        }
-    };
-    useEffect(function () {
-        setNextInterval();
-    }, []);
-    var handlePrev = function () {
-        if (isMoving.current)
-            return;
-        isMoving.current = true;
-        if (showIndex === 0) {
-            setShowIndex(carouselItems.length - 1);
-        }
-        else {
-            setShowIndex(showIndex - 1);
-        }
-    };
-    var handleNext = function () {
-        // console.log('nex', isMoving.current, showIndex, isVertical ? `translate(0px, ${offset}px)` : `translate(${offset}px, 0px)`)
-        if (!loop && showIndex == carouselItems.length - 2)
-            return;
-        if (isMoving.current)
-            return;
-        isMoving.current = true;
-        setShowIndex(showIndex + 1);
-    };
-    var handleTransitionEnd = function () {
-        //判断前后补位元素准备跳转
-        //在动画结束以后关掉，否则用鼠标拖动的时候不能补充剩下的offset
-        if (isLastCarouseItem() || isFirstCarouseLastItem()) {
-            setShowTransition(false);
-        }
-        // console.log('showIndex' + showIndex)
-        isMoving.current = false;
-        //触发onSlideChange
-        if (!isLastCarouseItem() && !isFirstCarouseLastItem() && onSlideChange)
-            onSlideChange(showIndex - 1);
-        // 处理首尾特殊case
-        if (isLastCarouseItem()) {
-            setShowIndex(1);
-        }
-        if (isFirstCarouseLastItem()) {
-            setShowIndex(carouselItems.length - 2);
-        }
-    };
-    var gestureUp = function () {
-        // setLogTex(logTex + 'UP ');
-        if (!touchable)
-            return;
-        if (isMoving.current)
-            return;
-        //打开动画
-        setShowTransition(true);
-        isMouseDown.current = false;
-        //拖动大于1/3的时候跳转
-        if (isVertical) {
-            if (gesteroffset[1] > compHeight / 3) {
-                handlePrev();
-            }
-            else if (gesteroffset[1] < -compHeight / 3) {
-                handleNext();
-            }
-        }
-        else {
-            if (gesteroffset[0] > compWidth / 3) {
-                handlePrev();
-            }
-            else if (gesteroffset[0] < -compWidth / 3) {
-                handleNext();
-            }
-        }
-        setGesteroffset([0, 0]);
-        setNextInterval();
-    };
-    var gestureMove = function (e) {
-        if (!touchable)
-            return;
-        if (!isMouseDown.current)
-            return;
-        var l = e.target.getBoundingClientRect().left;
-        var r = e.target.getBoundingClientRect().right;
-        var t = e.target.getBoundingClientRect().top;
-        var b = e.target.getBoundingClientRect().bottom;
-        var x = e.clientX;
-        var y = e.clientY;
-        setGesteroffset([e.clientX - mouseDownX.current, e.clientY - mouseDownY.current]);
-        //计算滑动超出元素范围
-        if (x < l || x > r || y > b || y < t) {
-            gestureUp();
-        }
-    };
-    var gestureDown = function (e) {
-        if (!touchable)
-            return;
-        if (isMoving.current)
-            return;
-        if (nextInterval.current) {
-            clearInterval(nextInterval.current);
-            nextInterval.current = null;
-        }
-        mouseDownX.current = e.clientX;
-        mouseDownY.current = e.clientY;
-        isMouseDown.current = true;
-        //拖动时关闭动画
-        setShowTransition(false);
-    };
-    var gestureClick = function (props) {
-        if (isMoving.current)
-            return;
-        if (onclickEvent) {
-            onclickEvent(showIndex - 1);
-        }
-    };
-    return (h("div", { style: { flexDirection: 'column', left: '200px' } },
-        h("div", { style: __assign(__assign({ position: 'relative' }, itemBoxStyle), { overflow: 'hidden', flexShrink: 0 }) },
-            h("div", { style: {
-                    display: 'flex',
-                    width: isVertical ? compWidth : compWidth * carouselItems.length + 'px',
-                    height: isVertical ? compHeight * carouselItems.length : compHeight + 'px',
-                    transition: "transform ".concat(showTransition ? '0.5s' : '0s', " ease 0s"),
-                    transform: isVertical ? "translate(0px, ".concat(offset + gesteroffset[1], "px)") : "translate(".concat(offset + gesteroffset[0], "px, 0px)"),
-                    flexDirection: isVertical ? 'column' : 'row',
-                    flexShrink: 0,
-                }, class: 'wrapper', onTransitionEnd: handleTransitionEnd }, carouselItems.map(function (child) { return child; }))),
-        h("div", { draggable: true, style: __assign(__assign({}, itemBoxStyle), { position: 'absolute' }), onClick: function () { gestureClick(props); }, class: 'GestureComp', 
-            // onMouseUp={() => { gestureUp(); }}
-            // onMouseMove={(e) => { gestureMove(e); }}
-            // onMouseDown={gestureDown}
-            onDragStart: gestureDown, 
-            // onMouseOut={() => { gestureUp(); }}
-            // onTouchEnd={() => { gestureUp(); }}
-            onDrag: function (e) {
-                gestureMove(e);
-                // setLogTex(logTex + ((e.target as any).className == 'GestureComp' ? '' : '111'));
-            }, onDragEnd: function () { gestureUp(); } }),
-        h("div", { style: { flexDirection: isVertical ? 'column' : 'row', } }, children.map(function (v, i) {
-            return h("div", { style: (showIndex == i + 1) ? indicatorSelectedStyle : indicatorStyle, onClick: function () { setShowIndex(i + 1); } });
-        }))));
-}
-Carousel.Item = function (props) {
-    return h("div", { style: {
-        // width: '100%',
-        // height: '100%',
-        // flexShrink: 0,
-        } },
-        " ",
-        props.children);
-};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { h } from 'preact';
+import { useState, useEffect, useRef, useMemo, useImperativeHandle } from '../../../../../lib/preact/hooks/src';
+// import React, { useState, useEffect, useRef, useMemo } from 'preact/hooks';
+var indicatorStyle = { width: '20px', height: '8px', margin: '5px', backgroundColor: '#cecfda', borderRadius: '3px' };
+var indicatorSelectedStyle = __assign(__assign({}, indicatorStyle), { backgroundColor: '#fafbfc' });
+export function Carousel(props) {
+    var _a = props.children, children = _a === void 0 ? [] : _a, _b = props.defaultIndex, defaultIndex = _b === void 0 ? 1 : _b, _c = props.compWidth, compWidth = _c === void 0 ? 100 : _c, _d = props.compHeight, compHeight = _d === void 0 ? 100 : _d, _e = props.autoplay, autoplay = _e === void 0 ? true : _e, _f = props.switchDuration, switchDuration = _f === void 0 ? 3000 : _f, _g = props.loop, loop = _g === void 0 ? true : _g, _h = props.isVertical, isVertical = _h === void 0 ? false : _h, _j = props.touchable, touchable = _j === void 0 ? true : _j, _k = props.onSlideChange, onSlideChange = _k === void 0 ? null : _k, _l = props.onclickEvent, onclickEvent = _l === void 0 ? null : _l;
+    useImperativeHandle(props.cRef, function () { return ({
+        handleNext: handleNext,
+        handlePrev: handlePrev
+    }); });
+    var duration = switchDuration < 1000 ? 1000 : switchDuration;
+    var _m = useState(defaultIndex), showIndex = _m[0], setShowIndex = _m[1];
+    //轮播元素正在滚动
+    var isMoving = useRef(false);
+    //鼠标手势信息
+    var isMouseDown = useRef(false);
+    var mouseDownX = useRef(0);
+    var mouseDownY = useRef(0);
+    var handleNextRef = useRef(function () { });
+    var nextInterval = useRef();
+    var _o = useState(true), showTransition = _o[0], setShowTransition = _o[1];
+    var _p = useState([0, 0]), gesteroffset = _p[0], setGesteroffset = _p[1];
+    var _q = useState(''), logTex = _q[0], setLogTex = _q[1];
+    var offset = useMemo(function () { return -(isVertical ? compHeight : compWidth) * showIndex; }, [showIndex]);
+    var itemBoxStyle = { minWidth: compWidth + 'px', minHeight: compHeight + 'px', maxWidth: compWidth + 'px', maxHeight: compHeight + 'px', };
+    var carouselItems = useMemo(function () {
+        var firstChild = children[0];
+        var lastChild = children[children.length - 1];
+        return __spreadArray(__spreadArray([lastChild], children, true), [firstChild], false);
+    }, [children]);
+    var isLastCarouseItem = function () { return showIndex === carouselItems.length - 1; };
+    var isFirstCarouseLastItem = function () { return showIndex === 0; };
+    useEffect(function () {
+        setNextInterval();
+    }, [autoplay]);
+    useEffect(function () {
+        //每次跳转前判断打开动画，否则动画关闭以后不会调用handleTransitionEnd
+        if (!isLastCarouseItem() && !isFirstCarouseLastItem()) {
+            setShowTransition(true);
+        }
+    }, [showIndex]);
+    //更新handleNext的环境
+    useEffect(function () {
+        handleNextRef.current = handleNext;
+    });
+    var setNextInterval = function () {
+        clearInterval(nextInterval.current);
+        if (autoplay) {
+            nextInterval.current = setInterval(function () {
+                handleNextRef.current();
+            }, duration);
+        }
+    };
+    useEffect(function () {
+        setNextInterval();
+    }, []);
+    var handlePrev = function () {
+        if (isMoving.current)
+            return;
+        isMoving.current = true;
+        if (showIndex === 0) {
+            setShowIndex(carouselItems.length - 1);
+        }
+        else {
+            setShowIndex(showIndex - 1);
+        }
+    };
+    var handleNext = function () {
+        // console.log('nex', isMoving.current, showIndex, isVertical ? `translate(0px, ${offset}px)` : `translate(${offset}px, 0px)`)
+        if (!loop && showIndex == carouselItems.length - 2)
+            return;
+        if (isMoving.current)
+            return;
+        isMoving.current = true;
+        setShowIndex(showIndex + 1);
+    };
+    var handleTransitionEnd = function () {
+        //判断前后补位元素准备跳转
+        //在动画结束以后关掉，否则用鼠标拖动的时候不能补充剩下的offset
+        if (isLastCarouseItem() || isFirstCarouseLastItem()) {
+            setShowTransition(false);
+        }
+        // console.log('showIndex' + showIndex)
+        isMoving.current = false;
+        //触发onSlideChange
+        if (!isLastCarouseItem() && !isFirstCarouseLastItem() && onSlideChange)
+            onSlideChange(showIndex - 1);
+        // 处理首尾特殊case
+        if (isLastCarouseItem()) {
+            setShowIndex(1);
+        }
+        if (isFirstCarouseLastItem()) {
+            setShowIndex(carouselItems.length - 2);
+        }
+    };
+    var gestureUp = function () {
+        // setLogTex(logTex + 'UP ');
+        if (!touchable)
+            return;
+        if (isMoving.current)
+            return;
+        //打开动画
+        setShowTransition(true);
+        isMouseDown.current = false;
+        //拖动大于1/3的时候跳转
+        if (isVertical) {
+            if (gesteroffset[1] > compHeight / 3) {
+                handlePrev();
+            }
+            else if (gesteroffset[1] < -compHeight / 3) {
+                handleNext();
+            }
+        }
+        else {
+            if (gesteroffset[0] > compWidth / 3) {
+                handlePrev();
+            }
+            else if (gesteroffset[0] < -compWidth / 3) {
+                handleNext();
+            }
+        }
+        setGesteroffset([0, 0]);
+        setNextInterval();
+    };
+    var gestureMove = function (e) {
+        if (!touchable)
+            return;
+        if (!isMouseDown.current)
+            return;
+        var l = e.target.getBoundingClientRect().left;
+        var r = e.target.getBoundingClientRect().right;
+        var t = e.target.getBoundingClientRect().top;
+        var b = e.target.getBoundingClientRect().bottom;
+        var x = e.clientX;
+        var y = e.clientY;
+        setGesteroffset([e.clientX - mouseDownX.current, e.clientY - mouseDownY.current]);
+        //计算滑动超出元素范围
+        if (x < l || x > r || y > b || y < t) {
+            gestureUp();
+        }
+    };
+    var gestureDown = function (e) {
+        if (!touchable)
+            return;
+        if (isMoving.current)
+            return;
+        if (nextInterval.current) {
+            clearInterval(nextInterval.current);
+            nextInterval.current = null;
+        }
+        mouseDownX.current = e.clientX;
+        mouseDownY.current = e.clientY;
+        isMouseDown.current = true;
+        //拖动时关闭动画
+        setShowTransition(false);
+    };
+    var gestureClick = function (props) {
+        if (isMoving.current)
+            return;
+        if (onclickEvent) {
+            onclickEvent(showIndex - 1);
+        }
+    };
+    return (h("div", { style: { flexDirection: 'column' } },
+        h("div", { style: __assign(__assign({ position: 'relative' }, itemBoxStyle), { overflow: 'hidden', flexShrink: 0 }) },
+            h("div", { style: {
+                    display: 'flex',
+                    width: isVertical ? compWidth : compWidth * carouselItems.length + 'px',
+                    height: isVertical ? compHeight * carouselItems.length : compHeight + 'px',
+                    transition: "transform ".concat(showTransition ? '0.5s' : '0s', " ease 0s"),
+                    transform: isVertical ? "translate(0px, ".concat(offset + gesteroffset[1], "px)") : "translate(".concat(offset + gesteroffset[0], "px, 0px)"),
+                    flexDirection: isVertical ? 'column' : 'row',
+                    flexShrink: 0,
+                }, class: 'wrapper', onTransitionEnd: handleTransitionEnd }, carouselItems.map(function (child) { return child; }))),
+        h("div", { draggable: true, style: __assign(__assign({}, itemBoxStyle), { position: 'absolute' }), onClick: function () { gestureClick(props); }, class: 'GestureComp', 
+            // onMouseUp={() => { gestureUp(); }}
+            // onMouseMove={(e) => { gestureMove(e); }}
+            // onMouseDown={gestureDown}
+            onDragStart: gestureDown, 
+            // onMouseOut={() => { gestureUp(); }}
+            // onTouchEnd={() => { gestureUp(); }}
+            onDrag: function (e) {
+                gestureMove(e);
+                // setLogTex(logTex + ((e.target as any).className == 'GestureComp' ? '' : '111'));
+            }, onDragEnd: function () { gestureUp(); } }),
+        h("div", { style: { flexDirection: isVertical ? 'column' : 'row', } }, children.map(function (v, i) {
+            return h("div", { style: (showIndex == i + 1) ? indicatorSelectedStyle : indicatorStyle, onClick: function () { setShowIndex(i + 1); } });
+        }))));
+}
+Carousel.Item = function (props) {
+    return h("div", { style: {
+        // width: '100%',
+        // height: '100%',
+        // flexShrink: 0,
+        } },
+        " ",
+        props.children);
+};

package/ui/components/dropdown/Dropdown.d.ts

@@ -1,30 +1,30 @@
-import { Component, CSSProperties, h } from 'preact';
-import { DropdownOptionUI } from './DropdownOptionUI';
-import { DropdownSpreadMainUI } from './DropdownSpreadMainUI';
-import { DropdownUnspreadMainUI } from './DropdownUnspreadMainUI';
-export interface DropdownConfig<T> {
-    spreadStyle: CSSProperties;
-    datas: T[];
-}
-export declare class Dropdown<T, DDUnspreadMainUI extends DropdownUnspreadMainUI<T>, DDSpreadMainUI extends DropdownSpreadMainUI<T>, DDOptionUI extends DropdownOptionUI<T>> extends Component<{
-    config: DropdownConfig<T>;
-    onChoose: Function;
-    defaultIndex: number | null;
-    unspreadMainUI: DDUnspreadMainUI;
-    spreadMainUI: DDSpreadMainUI;
-    optionsUI: DDOptionUI[];
-}, {
-    selectedIndex: number;
-    isSpread: boolean;
-}> {
-    constructor(props: any);
-    componentWillUnmount(): void;
-    addNetEvents: () => void;
-    removeNetEvents: () => void;
-    addLogicEvents: () => void;
-    removeLogicEvents: () => void;
-    openList: () => void;
-    closeList: () => void;
-    onChoose: (index: number) => void;
-    render(): h.JSX.Element;
-}
+import { Component, CSSProperties, h } from 'preact';
+import { DropdownOptionUI } from './DropdownOptionUI';
+import { DropdownSpreadMainUI } from './DropdownSpreadMainUI';
+import { DropdownUnspreadMainUI } from './DropdownUnspreadMainUI';
+export interface DropdownConfig<T> {
+    spreadStyle: CSSProperties;
+    datas: T[];
+}
+export declare class Dropdown<T, DDUnspreadMainUI extends DropdownUnspreadMainUI<T>, DDSpreadMainUI extends DropdownSpreadMainUI<T>, DDOptionUI extends DropdownOptionUI<T>> extends Component<{
+    config: DropdownConfig<T>;
+    onChoose: Function;
+    defaultIndex: number | null;
+    unspreadMainUI: DDUnspreadMainUI;
+    spreadMainUI: DDSpreadMainUI;
+    optionsUI: DDOptionUI[];
+}, {
+    selectedIndex: number;
+    isSpread: boolean;
+}> {
+    constructor(props: any);
+    componentWillUnmount(): void;
+    addNetEvents: () => void;
+    removeNetEvents: () => void;
+    addLogicEvents: () => void;
+    removeLogicEvents: () => void;
+    openList: () => void;
+    closeList: () => void;
+    onChoose: (index: number) => void;
+    render(): h.JSX.Element;
+}