@ioca/react 1.4.79 → 1.4.81

package/lib/types/components/input/textarea.js

@@ -1,57 +0,0 @@
-import InputContainer from "./container.js";
-import classNames from "classnames";
-import { useEffect, useImperativeHandle, useRef, useState } from "react";
-import { jsx } from "react/jsx-runtime";
-//#region packages/components/input/textarea.tsx
-const Textarea = (props) => {
-	const { ref, label, name, value = "", labelInline, className, status = "normal", message, tip, autoSize, border, width, style, onChange, onEnter, ...restProps } = props;
-	const [textareaValue, setTextareaValue] = useState(value);
-	const refTextarea = useRef(null);
-	const handleChange = (e) => {
-		const v = e.target.value;
-		setTextareaValue(v);
-		const ta = refTextarea.current;
-		if (autoSize && ta) ta.style.height = `${ta.scrollHeight}px`;
-		onChange?.(v, e);
-	};
-	const handleKeydown = (e) => {
-		if (e.code !== "Enter") return;
-		e.stopPropagation();
-		onEnter?.(e);
-	};
-	useEffect(() => {
-		setTextareaValue(value);
-	}, [value]);
-	useImperativeHandle(ref, () => {
-		return { input: refTextarea.current };
-	});
-	const inputProps = {
-		ref: refTextarea,
-		name,
-		value: textareaValue,
-		className: "i-input i-textarea",
-		onChange: handleChange,
-		onKeyDown: handleKeydown,
-		...restProps
-	};
-	return /* @__PURE__ */ jsx(InputContainer, {
-		label,
-		labelInline,
-		className,
-		style: {
-			width,
-			...style
-		},
-		tip: message ?? tip,
-		status,
-		children: /* @__PURE__ */ jsx("div", {
-			className: classNames("i-input-item", {
-				[`i-input-${status}`]: status !== "normal",
-				"i-input-borderless": !border
-			}),
-			children: /* @__PURE__ */ jsx("textarea", { ...inputProps })
-		})
-	});
-};
-//#endregion
-export { Textarea as default };

package/lib/types/components/list/index.js

@@ -1,5 +0,0 @@
-import List from "./list.js";
-//#region packages/components/list/index.tsx
-var list_default = List;
-//#endregion
-export { list_default as default };

package/lib/types/components/list/item.d.ts

@@ -1,3 +0,0 @@
-import { IListItem } from './type';
-declare const Item: (props: IListItem) => import("react/jsx-runtime").JSX.Element;
-export default Item;

package/lib/types/components/list/item.js

@@ -1,26 +0,0 @@
-import classNames from "classnames";
-import { jsx, jsxs } from "react/jsx-runtime";
-//#region packages/components/list/item.tsx
-const Item = (props) => {
-	const { ref, active, type, align, disabled, label, style, border, className, children, ...restProps } = props;
-	return /* @__PURE__ */ jsxs("li", {
-		ref,
-		className: classNames("i-list-item", className, {
-			"i-list-item-active": active,
-			"i-list-option": type === "option",
-			"i-list-item-bordered": border,
-			disabled
-		}),
-		style: {
-			alignItems: align,
-			...style
-		},
-		...restProps,
-		children: [label !== void 0 && /* @__PURE__ */ jsx("span", {
-			className: "i-list-item-label",
-			children: label
-		}), children]
-	});
-};
-//#endregion
-export { Item as default };

package/lib/types/components/list/list.js

@@ -1,26 +0,0 @@
-import Item from "./item.js";
-import classNames from "classnames";
-import { Children, cloneElement } from "react";
-import { jsx } from "react/jsx-runtime";
-//#region packages/components/list/list.tsx
-const List = (props) => {
-	const { label, type, border, className, children, ...restProps } = props;
-	return /* @__PURE__ */ jsx("ul", {
-		className: classNames("i-list", className),
-		...restProps,
-		children: Children.map(children, (node, i) => {
-			const renderLabel = typeof label === "function" ? label(i) : label;
-			const { type, props: nodeProps } = node;
-			if (type === Item) return cloneElement(node, {
-				label: renderLabel,
-				...nodeProps,
-				type: props.type,
-				border
-			});
-			return node;
-		})
-	});
-};
-List.Item = Item;
-//#endregion
-export { List as default };

package/lib/types/components/loading/index.js

@@ -1,5 +0,0 @@
-import Loading from "./loading.js";
-//#region packages/components/loading/index.tsx
-var loading_default = Loading;
-//#endregion
-export { loading_default as default };

package/lib/types/components/loading/loading.js

@@ -1,35 +0,0 @@
-import classNames from "classnames";
-import { jsx, jsxs } from "react/jsx-runtime";
-//#region packages/components/loading/loading.tsx
-const Loading = (props) => {
-	const { icon, text, size, absolute, style, className, ...restProps } = props;
-	return /* @__PURE__ */ jsxs("div", {
-		className: classNames("i-loading-container", { absolute }, className),
-		style: {
-			...style,
-			inset: absolute ? 0 : "unset"
-		},
-		...restProps,
-		children: [icon ?? /* @__PURE__ */ jsx("svg", {
-			width: "24",
-			height: "24",
-			stroke: "#000",
-			viewBox: "0 0 24 24",
-			xmlns: "http://www.w3.org/2000/svg",
-			className: "i-loading-icon",
-			style: { fontSize: size },
-			children: /* @__PURE__ */ jsx("circle", {
-				cx: "12",
-				cy: "12",
-				r: "9.5",
-				fill: "none",
-				strokeWidth: "3",
-				strokeLinecap: "round",
-				strokeDasharray: 40,
-				strokeDashoffset: 0
-			})
-		}), text]
-	});
-};
-//#endregion
-export { Loading as default };

package/lib/types/components/message/index.js

@@ -1,5 +0,0 @@
-import message from "./message.js";
-//#region packages/components/message/index.tsx
-var message_default = message;
-//#endregion
-export { message_default as default };

package/lib/types/components/message/message.js

@@ -1,193 +0,0 @@
-import { useReactive } from "../../js/hooks.js";
-import classNames from "classnames";
-import { uid } from "/Users/iann/codes/ioca-react/node_modules/.pnpm/radash@12.1.1/node_modules/radash/dist/esm/index.mjs";
-import { isValidElement, useEffect, useRef } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { createRoot } from "/Users/iann/codes/ioca-react/node_modules/.pnpm/react-dom@19.2.4_react@19.2.4/node_modules/react-dom/client.js";
-//#region packages/components/message/message.tsx
-const AlignMap = {
-	left: "flex-start",
-	center: "center",
-	right: "flex-end"
-};
-const GlobalConfig = {
-	align: "center",
-	offset: "12px",
-	gap: 12
-};
-const ItemDefaultConfig = {
-	duration: 3e3,
-	closable: true,
-	active: false
-};
-const handler = {
-	oneInstance: null,
-	callout(item) {},
-	close() {}
-};
-const queue = {
-	left: [],
-	center: [],
-	right: []
-};
-const heights = {
-	left: [],
-	center: [],
-	right: []
-};
-const MessageItem = function({ ref, active, content, top, className, style, onClick }) {
-	return /* @__PURE__ */ jsx("div", {
-		ref,
-		className: classNames("i-message", className, { "i-message-active": active }),
-		style: {
-			...style,
-			top
-		},
-		onClick,
-		children: content
-	});
-};
-function Messages() {
-	const ref = useRef(null);
-	const state = useReactive({
-		items: {
-			left: [],
-			center: [],
-			right: []
-		},
-		tops: {
-			left: [],
-			center: [],
-			right: []
-		}
-	});
-	const offsetTop = {
-		left: 0,
-		center: 0,
-		right: 0
-	};
-	useEffect(() => {
-		Object.assign(handler, {
-			callout: function(item) {
-				const { align = "center", unshift, onShow } = item;
-				const size = queue[align][unshift ? "unshift" : "push"](item);
-				state.items[align] = [...queue[align]];
-				item.close = this.close.bind(item);
-				setTimeout(() => {
-					const h = ref.current?.offsetHeight || 0;
-					queue[align][unshift ? 0 : size - 1].active = true;
-					state.items[align] = [...queue[align]];
-					heights[align][unshift ? "unshift" : "push"](h);
-					state.tops[align] = [...heights[align]];
-					onShow?.();
-				}, 12);
-				if (item.duration !== 0) item.timer = setTimeout(() => {
-					this.close.call(item);
-				}, item.duration);
-			},
-			close: function() {
-				const item = this;
-				const { align = "center", onHide } = item;
-				const index = queue[align].findIndex((i) => i.id === item.id);
-				if (index < 0) return;
-				queue[align][index].active = false;
-				state.items[align] = [...queue[align]];
-				item.timer = setTimeout(() => {
-					const index = queue[align].findIndex((i) => i.id === item.id);
-					queue[align].splice(index, 1);
-					heights[align].splice(index, 1);
-					state.tops[align] = [...heights[align]];
-					state.items[align] = [...queue[align]];
-					item.timer && clearTimeout(item.timer);
-					onHide?.();
-				}, 240);
-			}
-		});
-	}, []);
-	const renderItems = (item, i) => {
-		if (!item) return /* @__PURE__ */ jsx(Fragment$1, {});
-		const { id, active, content, align = "center", className } = item;
-		offsetTop[align] += state.tops[align][i - 1] || 0;
-		return /* @__PURE__ */ jsx(MessageItem, {
-			ref,
-			active,
-			content,
-			top: GlobalConfig.gap * i + offsetTop[align],
-			className,
-			style: { alignSelf: AlignMap[align] },
-			onClick: handler.close.bind(item)
-		}, id);
-	};
-	return /* @__PURE__ */ jsxs("div", {
-		className: "i-messages",
-		children: [
-			state.items.left.map(renderItems),
-			state.items.center.map(renderItems),
-			state.items.right.map(renderItems)
-		]
-	});
-}
-function message(config) {
-	if (["string", "number"].includes(typeof config) || isValidElement(config)) config = { content: config };
-	config = Object.assign({ id: uid(7) }, ItemDefaultConfig, config);
-	handler.callout(config);
-	return {
-		instance: config,
-		close: handler.close.bind(config)
-	};
-}
-function createContainer() {
-	if (typeof document === "undefined") return null;
-	const container = document.createElement("div");
-	container.dataset.id = "messages";
-	document.body.append(container);
-	return container;
-}
-message.error = (content) => {
-	return message({
-		content,
-		className: "bg-error"
-	});
-};
-message.success = (content) => {
-	return message({
-		content,
-		className: "bg-success"
-	});
-};
-message.warning = (content) => {
-	return message({
-		content,
-		className: "bg-warning"
-	});
-};
-message.info = (content) => {
-	return message({
-		content,
-		className: "bg-blue"
-	});
-};
-message.one = (config) => {
-	const o = handler.oneInstance;
-	if (o) if (o.active && o.duration !== 0) {
-		clearTimeout(o.timer);
-		o.timer = setTimeout(() => {
-			o.close?.();
-		}, o.duration);
-	} else handler.callout(o);
-	else {
-		const { instance } = message(config);
-		handler.oneInstance = instance;
-	}
-};
-let container = null;
-let root = null;
-if (typeof window !== "undefined") {
-	container = createContainer();
-	if (container) {
-		root = createRoot(container);
-		root.render(/* @__PURE__ */ jsx(Messages, {}));
-	}
-}
-//#endregion
-export { message as default };

package/lib/types/components/modal/content.d.ts

@@ -1,2 +0,0 @@
-import { IModalContent } from './type';
-export default function Content(props: IModalContent): import("react/jsx-runtime").JSX.Element;

package/lib/types/components/modal/content.js

@@ -1,54 +0,0 @@
-import button_default from "../button/index.js";
-import helpericon_default from "../utils/helpericon/index.js";
-import { useMemo } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-//#region packages/components/modal/content.tsx
-function Content(props) {
-	const { title, footer, hideCloseButton, footerLeft, okButtonProps, cancelButtonProps, children, onOk, onClose } = props;
-	const showHeader = title || !hideCloseButton;
-	const handleOk = async () => {
-		if (await onOk?.() === false) return;
-		onClose?.();
-	};
-	const renderFooter = useMemo(() => {
-		if (footer || footer === null) return footer;
-		const propsOk = Object.assign({
-			children: "确定",
-			onClick: handleOk
-		}, okButtonProps);
-		const propsCancel = Object.assign({
-			secondary: true,
-			children: "关闭",
-			onClick: onClose
-		}, cancelButtonProps);
-		return /* @__PURE__ */ jsxs(Fragment$1, { children: [
-			footerLeft,
-			/* @__PURE__ */ jsx(button_default, { ...propsOk }),
-			/* @__PURE__ */ jsx(button_default, { ...propsCancel })
-		] });
-	}, [
-		footer,
-		okButtonProps,
-		cancelButtonProps
-	]);
-	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
-		showHeader && /* @__PURE__ */ jsxs("header", {
-			className: "i-modal-header",
-			children: [title && /* @__PURE__ */ jsx("b", { children: title }), /* @__PURE__ */ jsx(helpericon_default, {
-				active: !hideCloseButton,
-				className: "i-modal-close",
-				onClick: onClose
-			})]
-		}),
-		/* @__PURE__ */ jsx("div", {
-			className: "i-modal-content",
-			children
-		}),
-		/* @__PURE__ */ jsx("footer", {
-			className: "i-modal-footer",
-			children: renderFooter
-		})
-	] });
-}
-//#endregion
-export { Content as default };

package/lib/types/components/modal/context.d.ts

@@ -1,2 +0,0 @@
-declare const ModalContext: import('react').Context<boolean>;
-export default ModalContext;

package/lib/types/components/modal/context.js

@@ -1,5 +0,0 @@
-import { createContext } from "react";
-//#region packages/components/modal/context.ts
-const ModalContext = createContext(false);
-//#endregion
-export { ModalContext as default };

package/lib/types/components/modal/hookModal.d.ts

@@ -1,6 +0,0 @@
-import { RefObject } from 'react';
-import { IModal, RefHookModal } from './type';
-declare const HookModal: (props: IModal & {
-    ref?: RefObject<RefHookModal | null>;
-}) => import("react/jsx-runtime").JSX.Element;
-export default HookModal;

package/lib/types/components/modal/hookModal.js

@@ -1,25 +0,0 @@
-import { useReactive } from "../../js/hooks.js";
-import Modal from "./modal.js";
-import { useImperativeHandle } from "react";
-import { jsx } from "react/jsx-runtime";
-//#region packages/components/modal/hookModal.tsx
-const HookModal = (props) => {
-	const { ref, ...restProps } = props;
-	const state = useReactive({});
-	const mergedProps = Object.assign({}, restProps, state);
-	useImperativeHandle(ref, () => ({
-		update: (config = {}) => {
-			Object.assign(state, config);
-		},
-		close: () => {
-			state.visible = false;
-			if (mergedProps.closable) return;
-			Promise.resolve().then(() => {
-				state.visible = true;
-			});
-		}
-	}));
-	return /* @__PURE__ */ jsx(Modal, { ...mergedProps });
-};
-//#endregion
-export { HookModal as default };

package/lib/types/components/modal/index.js

@@ -1,5 +0,0 @@
-import Modal from "./modal.js";
-//#region packages/components/modal/index.tsx
-var modal_default = Modal;
-//#endregion
-export { modal_default as default };

package/lib/types/components/modal/modal.js

@@ -1,113 +0,0 @@
-import { useKeydown } from "../../js/hooks.js";
-import Content from "./content.js";
-import ModalContext from "./context.js";
-import useModal from "./useModal.js";
-import classNames from "classnames";
-import { useEffect, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { createPortal } from "react-dom";
-//#region packages/components/modal/modal.tsx
-function Modal(props) {
-	const { visible, title, footer, okButtonProps, cancelButtonProps, closable = true, hideBackdrop, backdropClosable = true, hideCloseButton, disableEsc, width, height, customized, fixed, hideShadow, children, style, className, keepDOM, footerLeft, onClick, onVisibleChange, onClose, onOk, ...restProps } = props;
-	const [show, setShow] = useState(visible);
-	const [active, setActive] = useState(false);
-	const [bounced, setBounced] = useState(false);
-	const [mounted, setMounted] = useState(false);
-	const toggable = useRef(true);
-	const handleShow = async () => {
-		if (!toggable.current) return;
-		(!keepDOM || !show) && setShow(true);
-		toggable.current = false;
-		const timer = setTimeout(() => {
-			setActive(true);
-			onVisibleChange?.(true);
-			toggable.current = true;
-		}, 64);
-		return () => clearTimeout(timer);
-	};
-	const handleHide = () => {
-		if (!toggable.current) return;
-		toggable.current = false;
-		if (!closable) {
-			setBounced(true);
-			const timer = setTimeout(() => {
-				setBounced(false);
-				toggable.current = true;
-			}, 400);
-			return () => clearTimeout(timer);
-		}
-		setActive(false);
-		const timer = setTimeout(() => {
-			!keepDOM && setShow(false);
-			toggable.current = true;
-			onVisibleChange?.(false);
-			onClose?.();
-		}, 240);
-		return () => clearTimeout(timer);
-	};
-	const handleBackdropClick = () => {
-		backdropClosable && handleHide();
-	};
-	useKeydown((e) => {
-		if (e.code !== "Escape" || !visible) return;
-		handleHide();
-	}, { disabled: disableEsc });
-	useEffect(() => {
-		visible ? handleShow() : handleHide();
-	}, [visible]);
-	useEffect(() => {
-		setMounted(true);
-	}, []);
-	const handleClick = () => {
-		if (typeof document === "undefined") return;
-		document.documentElement.click();
-	};
-	if (!show || !mounted) return null;
-	return createPortal(/* @__PURE__ */ jsx("div", {
-		className: classNames("i-modal-container", {
-			"i-modal-backdrop": !hideBackdrop,
-			"i-modal-customized": customized,
-			"i-modal-active": active,
-			fixed
-		}, className),
-		style,
-		onClick: handleBackdropClick,
-		"aria-modal": "true",
-		inert: !active,
-		children: /* @__PURE__ */ jsx("div", {
-			className: classNames("i-modal", {
-				bounced,
-				shadow: !hideShadow
-			}),
-			style: {
-				width,
-				height
-			},
-			onClick: (e) => {
-				e.stopPropagation();
-				handleClick();
-				onClick?.(e);
-			},
-			role: "dialog",
-			"aria-labelledby": title ? "modal-title" : void 0,
-			...restProps,
-			children: /* @__PURE__ */ jsxs(ModalContext.Provider, {
-				value: true,
-				children: [customized && children, !customized && /* @__PURE__ */ jsx(Content, {
-					title,
-					hideCloseButton,
-					footer,
-					okButtonProps,
-					cancelButtonProps,
-					children,
-					footerLeft,
-					onOk,
-					onClose: handleHide
-				})]
-			})
-		})
-	}), document?.body ?? null);
-}
-Modal.useModal = useModal;
-//#endregion
-export { Modal as default };

package/lib/types/components/modal/useModal.js

@@ -1,36 +0,0 @@
-import { renderNode } from "../../js/utils.js";
-import HookModal from "./hookModal.js";
-import { useRef } from "react";
-import { jsx } from "react/jsx-runtime";
-//#region packages/components/modal/useModal.tsx
-function useModal() {
-	const ref = useRef(null);
-	const handleOpen = (props) => {
-		const unMount = renderNode(/* @__PURE__ */ jsx(HookModal, {
-			ref,
-			visible: true,
-			...props,
-			onClose: () => {
-				props.onClose?.();
-				unMount?.();
-			}
-		}));
-	};
-	const handleUpdate = (props) => {
-		if (!ref.current) return;
-		const { update } = ref.current;
-		update(props);
-	};
-	const handleClose = () => {
-		if (!ref.current) return;
-		const { close } = ref.current;
-		close();
-	};
-	return {
-		open: handleOpen,
-		update: handleUpdate,
-		close: handleClose
-	};
-}
-//#endregion
-export { useModal as default };

package/lib/types/components/pagination/index.js

@@ -1,5 +0,0 @@
-import Pagination from "./pagination.js";
-//#region packages/components/pagination/index.tsx
-var pagination_default = Pagination;
-//#endregion
-export { pagination_default as default };

package/lib/types/components/pagination/page.d.ts

@@ -1,3 +0,0 @@
-import { IPageItem } from './type';
-declare const Page: (props: IPageItem) => import("react/jsx-runtime").JSX.Element;
-export default Page;

package/lib/types/components/pagination/page.js

@@ -1,27 +0,0 @@
-import loading_default from "../loading/index.js";
-import classNames from "classnames";
-import { useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-//#region packages/components/pagination/page.tsx
-const Page = (props) => {
-	const { page, active, disabled, children, onChange } = props;
-	const [loading, setLoading] = useState(false);
-	const handleClick = async () => {
-		if (active || loading || disabled) return;
-		setLoading(true);
-		await onChange?.(page);
-		setLoading(false);
-	};
-	return /* @__PURE__ */ jsxs("a", {
-		className: classNames("i-page", {
-			"i-page-active": active,
-			"i-page-loading": loading,
-			"i-page-disabled": disabled
-		}),
-		"data-page": page,
-		onClick: handleClick,
-		children: [loading && /* @__PURE__ */ jsx(loading_default, { absolute: true }), children]
-	});
-};
-//#endregion
-export { Page as default };