@tiny-design/react 1.0.4

package/lib/overlay/style/index.css

@@ -0,0 +1,36 @@
+.ty-overlay {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  transition: opacity 300ms;
+  opacity: 0;
+}
+.ty-overlay_default {
+  background-color: var(--ty-color-overlay-bg);
+}
+.ty-overlay_blurred {
+  backdrop-filter: blur(3px);
+}
+.ty-overlay_inverted {
+  background-color: var(--ty-color-overlay-inverted);
+}
+.ty-overlay_fade-enter {
+  opacity: 0;
+}
+.ty-overlay_fade-enter-done {
+  opacity: 1;
+}
+.ty-overlay_fade-exit {
+  opacity: 1;
+}
+.ty-overlay_fade-exit-active {
+  opacity: 0;
+}
+.ty-overlay_fade-exit-done {
+  opacity: 0;
+  display: none;
+}

package/lib/overlay/style/index.d.ts

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

package/lib/overlay/style/index.js

@@ -0,0 +1 @@
+require("./index.css");

package/lib/overlay/types.d.ts

@@ -0,0 +1,21 @@
+import { BaseProps } from "../_utils/props.js";
+import React from "react";
+
+//#region src/overlay/types.d.ts
+type OverlayMaskType = 'default' | 'inverted' | 'none';
+interface OverlayProps extends BaseProps {
+  isShow?: boolean;
+  blurred?: boolean;
+  unmountOnExit?: boolean;
+  clickCallback?: (e: React.MouseEvent) => void;
+  zIndex?: number;
+  onEnter?: () => void;
+  onExit?: () => void;
+  onEntered?: () => void;
+  onExited?: () => void;
+  type?: OverlayMaskType;
+  children?: React.ReactNode;
+}
+//#endregion
+export { OverlayMaskType, OverlayProps };
+//# sourceMappingURL=types.d.ts.map

package/lib/pagination/index.js

@@ -0,0 +1,8 @@
+require('../style/base.css');
+require('./style/index.css');
+//#region src/pagination/index.tsx
+var pagination_default = require("./pagination.js").default;
+//#endregion
+exports.default = pagination_default;
+
+//# sourceMappingURL=index.js.map

package/lib/pagination/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["Pagination"],"sources":["../../src/pagination/index.tsx"],"sourcesContent":["import Pagination from './pagination';\n\nexport default Pagination;\n"],"mappings":";AAEA,IAAA,gDAAeA"}

package/lib/pagination/pagination.d.ts

@@ -0,0 +1,7 @@
+import { PaginationProps } from "./types.js";
+
+//#region src/pagination/pagination.d.ts
+declare const Pagination: (props: PaginationProps) => JSX.Element;
+//#endregion
+export { Pagination };
+//# sourceMappingURL=pagination.d.ts.map

package/lib/pagination/pagination.js

@@ -0,0 +1,136 @@
+const require_runtime = require("../_virtual/_rolldown/runtime.js");
+const require_config_context = require("../config-provider/config-context.js");
+const require_general = require("../_utils/general.js");
+const require_components = require("../_utils/components.js");
+let react = require("react");
+react = require_runtime.__toESM(react);
+let classnames = require("classnames");
+classnames = require_runtime.__toESM(classnames);
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/pagination/pagination.tsx
+const Pagination = (props) => {
+	const { align = "center", size = "md", current: currentProp, defaultCurrent = 1, pageSize: pageSizeProp, defaultPageSize = 10, total = 0, disabled = false, onChange, className, prefixCls: customisedCls, ...otherProps } = props;
+	const prefixCls = require_general.getPrefixCls("pagination", (0, react.useContext)(require_config_context.ConfigContext).prefixCls, customisedCls);
+	const cls = (0, classnames.default)(prefixCls, className, {
+		[`${prefixCls}_${align}`]: align,
+		[`${prefixCls}_${size}`]: size,
+		[`${prefixCls}_disabled`]: disabled
+	});
+	const [current, setCurrent] = (0, react.useState)(currentProp !== void 0 ? currentProp : defaultCurrent);
+	const [pageSize, setPageSize] = (0, react.useState)(pageSizeProp !== void 0 ? pageSizeProp : defaultPageSize);
+	const itemOnClick = (item) => {
+		if (item.active || item.disabled) return;
+		const count = Math.ceil(total / pageSize);
+		let curr = 0;
+		if (item.type === "page") curr = Number(item.label);
+		if (item.type === "prev") curr = current - 1 > 0 ? current - 1 : 1;
+		if (item.type === "next") curr = current + 1 <= count ? current + 1 : count;
+		if (item.type === "jump-prev" || item.type === "jump-next") {
+			curr = item.type === "jump-prev" ? current - 5 : current + 5;
+			if (curr > count) curr = count;
+			if (curr < 1) curr = 1;
+		}
+		currentProp === void 0 && setCurrent(curr);
+		onChange && onChange(curr, total, pageSize);
+	};
+	const getItems = () => {
+		const count = Math.ceil(total / pageSize);
+		const items = [{
+			type: "prev",
+			label: "<",
+			disabled: disabled || current === 1
+		}];
+		const itemCount = count <= 5 ? count : 5;
+		let num = 0;
+		let basic = 0;
+		if (current > 3 && count > 5) items.push({
+			disabled,
+			type: "page",
+			label: "1"
+		});
+		if (current > 4 && count > 6) items.push({
+			disabled,
+			type: "jump-prev",
+			label: "•••"
+		});
+		while (num < itemCount) {
+			num += 1;
+			if (current > 3 && count > 5) basic = current - 3;
+			let label = num + basic;
+			if (count - current === 0 && count > 5) label -= 2;
+			if (count - current === 1 && count > 5) label -= 1;
+			if (label <= count) items.push({
+				disabled,
+				type: "page",
+				label: `${label}`,
+				active: current === label
+			});
+		}
+		if (current + 3 < count && count > 6) items.push({
+			disabled,
+			type: "jump-next",
+			label: "•••"
+		});
+		if (current + 2 < count && count > 5) items.push({
+			disabled,
+			type: "page",
+			label: `${count}`
+		});
+		items.push({
+			type: "next",
+			label: ">",
+			disabled: disabled || current === count
+		});
+		return items;
+	};
+	const renderItem = (item) => {
+		const { type, label } = item;
+		switch (type) {
+			case "prev": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components.ArrowDown, {
+				size: 12,
+				className: `${prefixCls}__left-arrow`
+			});
+			case "next": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components.ArrowDown, {
+				size: 12,
+				className: `${prefixCls}__right-arrow`
+			});
+			default: return label;
+		}
+	};
+	(0, react.useEffect)(() => {
+		currentProp !== void 0 && setCurrent(currentProp);
+		pageSizeProp !== void 0 && setPageSize(pageSizeProp);
+	}, [currentProp, pageSizeProp]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("nav", {
+		...otherProps,
+		className: cls,
+		"aria-label": "Pagination",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", {
+			className: `${prefixCls}__list`,
+			children: getItems().map((item, idx) => {
+				const { active, disabled: itemDisabled, type, label } = item;
+				const cls = (0, classnames.default)(`${prefixCls}__item`, {
+					[`${prefixCls}__item_active`]: active,
+					[`${prefixCls}__item_disabled`]: itemDisabled,
+					[`${prefixCls}__item_ellipsis`]: type === "jump-next" || type === "jump-prev"
+				});
+				const ariaLabel = type === "prev" ? "Previous page" : type === "next" ? "Next page" : type === "jump-prev" ? "Jump back 5 pages" : type === "jump-next" ? "Jump forward 5 pages" : `Page ${label}`;
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", {
+					className: cls,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						disabled: itemDisabled,
+						"aria-current": active ? "page" : void 0,
+						"aria-label": ariaLabel,
+						onClick: () => itemOnClick(item),
+						children: renderItem(item)
+					})
+				}, type + "-" + label);
+			})
+		})
+	});
+};
+//#endregion
+exports.default = Pagination;
+
+//# sourceMappingURL=pagination.js.map

package/lib/pagination/pagination.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.js","names":["getPrefixCls","ConfigContext","ArrowDown"],"sources":["../../src/pagination/pagination.tsx"],"sourcesContent":["import React, { useContext, useEffect, useState } from 'react';\nimport classNames from 'classnames';\nimport { ConfigContext } from '../config-provider/config-context';\nimport { getPrefixCls } from '../_utils/general';\nimport { ArrowDown } from '../_utils/components';\nimport { PaginationProps } from './types';\n\ntype ItemSourceData = {\n  type: 'prev' | 'next' | 'jump-prev' | 'jump-next' | 'page';\n  disabled?: boolean;\n  active?: boolean;\n  label: string;\n};\n\nconst Pagination = (props: PaginationProps): JSX.Element => {\n  const {\n    align = 'center',\n    size = 'md',\n    current: currentProp,\n    defaultCurrent = 1,\n    pageSize: pageSizeProp,\n    defaultPageSize = 10,\n    total = 0,\n    disabled = false,\n    onChange,\n    className,\n    prefixCls: customisedCls,\n    ...otherProps\n  } = props;\n  const configContext = useContext(ConfigContext);\n  const prefixCls = getPrefixCls('pagination', configContext.prefixCls, customisedCls);\n  const cls = classNames(prefixCls, className, {\n    [`${prefixCls}_${align}`]: align,\n    [`${prefixCls}_${size}`]: size,\n    [`${prefixCls}_disabled`]: disabled,\n  });\n  const [current, setCurrent] = useState<number>(\n    currentProp !== undefined ? currentProp : defaultCurrent\n  );\n  const [pageSize, setPageSize] = useState<number>(\n    pageSizeProp !== undefined ? pageSizeProp : defaultPageSize\n  );\n\n  const itemOnClick = (item: ItemSourceData): void => {\n    // If this item is in active or disabled status, reject the next action.\n    if (item.active || item.disabled) {\n      return;\n    }\n\n    const count = Math.ceil(total / pageSize);\n    let curr = 0;\n    if (item.type === 'page') {\n      curr = Number(item.label);\n    }\n    if (item.type === 'prev') {\n      curr = current - 1 > 0 ? current - 1 : 1;\n    }\n    if (item.type === 'next') {\n      curr = current + 1 <= count ? current + 1 : count;\n    }\n    if (item.type === 'jump-prev' || item.type === 'jump-next') {\n      curr = item.type === 'jump-prev' ? current - 5 : current + 5;\n      if (curr > count) {\n        curr = count;\n      }\n      if (curr < 1) {\n        curr = 1;\n      }\n    }\n\n    currentProp === undefined && setCurrent(curr);\n    onChange && onChange(curr, total, pageSize);\n  };\n\n  const getItems = (): ItemSourceData[] => {\n    const count = Math.ceil(total / pageSize);\n    const items: ItemSourceData[] = [\n      { type: 'prev', label: '<', disabled: disabled || current === 1 },\n    ];\n    const itemCount = count <= 5 ? count : 5;\n    let num = 0;\n    let basic = 0;\n    if (current > 3 && count > 5) {\n      items.push({ disabled, type: 'page', label: '1' });\n    }\n    if (current > 4 && count > 6) {\n      items.push({ disabled, type: 'jump-prev', label: '•••' });\n    }\n    while (num < itemCount) {\n      num += 1;\n      if (current > 3 && count > 5) {\n        basic = current - 3;\n      }\n      let label = num + basic;\n      if (count - current === 0 && count > 5) {\n        label -= 2;\n      }\n      if (count - current === 1 && count > 5) {\n        label -= 1;\n      }\n      if (label <= count) {\n        items.push({ disabled, type: 'page', label: `${label}`, active: current === label });\n      }\n    }\n    if (current + 3 < count && count > 6) {\n      items.push({ disabled, type: 'jump-next', label: '•••' });\n    }\n    if (current + 2 < count && count > 5) {\n      items.push({ disabled, type: 'page', label: `${count}` });\n    }\n    items.push({ type: 'next', label: '>', disabled: disabled || current === count });\n    return items;\n  };\n\n  const renderItem = (item: ItemSourceData): React.ReactNode => {\n    const { type, label } = item;\n    switch (type) {\n      case 'prev':\n        return <ArrowDown size={12} className={`${prefixCls}__left-arrow`} />;\n\n      case 'next':\n        return <ArrowDown size={12} className={`${prefixCls}__right-arrow`} />;\n\n      default:\n        return label;\n    }\n  };\n\n  useEffect(() => {\n    currentProp !== undefined && setCurrent(currentProp);\n    pageSizeProp !== undefined && setPageSize(pageSizeProp);\n  }, [currentProp, pageSizeProp]);\n\n  return (\n    <nav {...otherProps} className={cls} aria-label=\"Pagination\">\n      <ul className={`${prefixCls}__list`}>\n        {getItems().map((item, idx) => {\n          const { active, disabled: itemDisabled, type, label } = item;\n          const cls = classNames(`${prefixCls}__item`, {\n            [`${prefixCls}__item_active`]: active,\n            [`${prefixCls}__item_disabled`]: itemDisabled,\n            [`${prefixCls}__item_ellipsis`]: type === 'jump-next' || type === 'jump-prev',\n          });\n          const ariaLabel = type === 'prev' ? 'Previous page' :\n            type === 'next' ? 'Next page' :\n            type === 'jump-prev' ? 'Jump back 5 pages' :\n            type === 'jump-next' ? 'Jump forward 5 pages' :\n            `Page ${label}`;\n          return (\n            <li key={type + '-' + label} className={cls}>\n              <button\n                type=\"button\"\n                disabled={itemDisabled}\n                aria-current={active ? 'page' : undefined}\n                aria-label={ariaLabel}\n                onClick={(): void => itemOnClick(item)}>\n                {renderItem(item)}\n              </button>\n            </li>\n          );\n        })}\n      </ul>\n    </nav>\n  );\n};\n\nexport default Pagination;\n"],"mappings":"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"}

package/lib/pagination/style/_index.scss

@@ -0,0 +1,143 @@
+@use '../../style/variables' as *;
+
+.#{$prefix}-pagination {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  color: var(--ty-color-text-secondary);
+  font-size: 14px;
+  list-style: none;
+
+  &_left {
+    text-align: left;
+  }
+
+  &_center {
+    text-align: center;
+  }
+
+  &_right {
+    text-align: right;
+  }
+
+  &_disabled {
+    .#{$prefix}-pagination__item_active {
+      background: var(--ty-pagination-disabled-active-bg) !important;
+      border-color: transparent !important;
+      color: #fff !important;
+    }
+  }
+
+  &__item {
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    box-sizing: border-box;
+    text-align: center;
+    vertical-align: middle;
+    list-style: none;
+    background-color: var(--ty-pagination-bg);
+    border-radius: 2px;
+    outline: 0;
+    cursor: pointer;
+    user-select: none;
+    transition: all 400ms;
+
+    > button {
+      background: none;
+      border: none;
+      padding: 0;
+      color: inherit;
+      font: inherit;
+      cursor: inherit;
+      width: 100%;
+      height: 100%;
+      display: inline-flex;
+      justify-content: center;
+      align-items: center;
+    }
+
+    &_disabled {
+      cursor: not-allowed;
+    }
+
+    &_ellipsis {
+      color: var(--ty-color-text-quaternary);
+
+      &:hover {
+        color: var(--ty-color-primary);
+      }
+    }
+  }
+
+  &__left-arrow {
+    transform: rotate(90deg);
+  }
+
+  &__right-arrow {
+    transform: rotate(-90deg);
+  }
+
+  &_md {
+    .#{$prefix}-pagination__item {
+      min-width: 32px;
+      height: 32px;
+      margin-left: 4px;
+      margin-right: 4px;
+      line-height: 30px;
+      border: 1px solid var(--ty-color-border);
+
+      &_active {
+        color: var(--ty-color-primary);
+        border-color: var(--ty-color-primary);
+      }
+
+      &:hover {
+        border-color: var(--ty-color-primary);
+      }
+
+      &_disabled {
+        color: var(--ty-color-text-tertiary);
+        background: var(--ty-pagination-disabled-bg);
+        border-color: var(--ty-color-border);
+
+        &:hover {
+          border-color: var(--ty-color-border);
+        }
+      }
+
+      &_ellipsis {
+        border: 0;
+      }
+    }
+  }
+
+  &_sm {
+    .#{$prefix}-pagination__item {
+      min-width: 24px;
+      height: 24px;
+      margin-left: 0.5px;
+      margin-right: 0.5px;
+      line-height: 22px;
+      border-color: transparent;
+
+      &_active {
+        color: var(--ty-color-primary);
+        border: 1px solid var(--ty-color-primary);
+      }
+
+      &:hover {
+        color: var(--ty-color-primary);
+      }
+
+      &_disabled {
+        color: var(--ty-pagination-disabled-color);
+        border-color: var(--ty-pagination-disabled-color);
+
+        &:hover {
+          color: var(--ty-pagination-disabled-color);
+        }
+      }
+    }
+  }
+}

package/lib/pagination/style/index.css

@@ -0,0 +1,115 @@
+.ty-pagination {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  color: var(--ty-color-text-secondary);
+  font-size: 14px;
+  list-style: none;
+}
+.ty-pagination_left {
+  text-align: left;
+}
+.ty-pagination_center {
+  text-align: center;
+}
+.ty-pagination_right {
+  text-align: right;
+}
+.ty-pagination_disabled .ty-pagination__item_active {
+  background: var(--ty-pagination-disabled-active-bg) !important;
+  border-color: transparent !important;
+  color: #fff !important;
+}
+.ty-pagination__item {
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  box-sizing: border-box;
+  text-align: center;
+  vertical-align: middle;
+  list-style: none;
+  background-color: var(--ty-pagination-bg);
+  border-radius: 2px;
+  outline: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  transition: all 400ms;
+}
+.ty-pagination__item > button {
+  background: none;
+  border: none;
+  padding: 0;
+  color: inherit;
+  font: inherit;
+  cursor: inherit;
+  width: 100%;
+  height: 100%;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+}
+.ty-pagination__item_disabled {
+  cursor: not-allowed;
+}
+.ty-pagination__item_ellipsis {
+  color: var(--ty-color-text-quaternary);
+}
+.ty-pagination__item_ellipsis:hover {
+  color: var(--ty-color-primary);
+}
+.ty-pagination__left-arrow {
+  transform: rotate(90deg);
+}
+.ty-pagination__right-arrow {
+  transform: rotate(-90deg);
+}
+.ty-pagination_md .ty-pagination__item {
+  min-width: 32px;
+  height: 32px;
+  margin-left: 4px;
+  margin-right: 4px;
+  line-height: 30px;
+  border: 1px solid var(--ty-color-border);
+}
+.ty-pagination_md .ty-pagination__item_active {
+  color: var(--ty-color-primary);
+  border-color: var(--ty-color-primary);
+}
+.ty-pagination_md .ty-pagination__item:hover {
+  border-color: var(--ty-color-primary);
+}
+.ty-pagination_md .ty-pagination__item_disabled {
+  color: var(--ty-color-text-tertiary);
+  background: var(--ty-pagination-disabled-bg);
+  border-color: var(--ty-color-border);
+}
+.ty-pagination_md .ty-pagination__item_disabled:hover {
+  border-color: var(--ty-color-border);
+}
+.ty-pagination_md .ty-pagination__item_ellipsis {
+  border: 0;
+}
+.ty-pagination_sm .ty-pagination__item {
+  min-width: 24px;
+  height: 24px;
+  margin-left: 0.5px;
+  margin-right: 0.5px;
+  line-height: 22px;
+  border-color: transparent;
+}
+.ty-pagination_sm .ty-pagination__item_active {
+  color: var(--ty-color-primary);
+  border: 1px solid var(--ty-color-primary);
+}
+.ty-pagination_sm .ty-pagination__item:hover {
+  color: var(--ty-color-primary);
+}
+.ty-pagination_sm .ty-pagination__item_disabled {
+  color: var(--ty-pagination-disabled-color);
+  border-color: var(--ty-pagination-disabled-color);
+}
+.ty-pagination_sm .ty-pagination__item_disabled:hover {
+  color: var(--ty-pagination-disabled-color);
+}

package/lib/pagination/style/index.d.ts

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

package/lib/pagination/style/index.js

@@ -0,0 +1 @@
+require("./index.css");

package/lib/pagination/types.d.ts

@@ -0,0 +1,20 @@
+import { BaseProps } from "../_utils/props.js";
+import React from "react";
+
+//#region src/pagination/types.d.ts
+type PaginationAlign = 'left' | 'center' | 'right';
+type PaginationSize = 'sm' | 'md';
+interface PaginationProps extends BaseProps, Omit<React.PropsWithoutRef<JSX.IntrinsicElements['ul']>, 'onChange'> {
+  current?: number;
+  total?: number;
+  defaultCurrent?: number;
+  disabled?: boolean;
+  pageSize?: number;
+  defaultPageSize?: number;
+  size?: PaginationSize;
+  align?: PaginationAlign;
+  onChange?: (current: number, total: number, pageSize: number) => void;
+}
+//#endregion
+export { PaginationProps };
+//# sourceMappingURL=types.d.ts.map

package/lib/pop-confirm/index.js

@@ -0,0 +1,10 @@
+require('../style/base.css');
+require('./style/index.css');
+require('../button/style/index.css');
+require('../popover/style/index.css');
+//#region src/pop-confirm/index.tsx
+var pop_confirm_default = require("./pop-confirm.js").default;
+//#endregion
+exports.default = pop_confirm_default;
+
+//# sourceMappingURL=index.js.map

package/lib/pop-confirm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["PopConfirm"],"sources":["../../src/pop-confirm/index.tsx"],"sourcesContent":["import PopConfirm from './pop-confirm';\n\nexport default PopConfirm;\n"],"mappings":";AAEA,IAAA,kDAAeA"}

package/lib/pop-confirm/pop-confirm.d.ts

@@ -0,0 +1,10 @@
+import { PopConfirmProps } from "./types.js";
+
+//#region src/pop-confirm/pop-confirm.d.ts
+declare const PopConfirm: {
+  (props: PopConfirmProps): JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { PopConfirm };
+//# sourceMappingURL=pop-confirm.d.ts.map

package/lib/pop-confirm/pop-confirm.js

@@ -0,0 +1,70 @@
+const require_runtime = require("../_virtual/_rolldown/runtime.js");
+const require_config_context = require("../config-provider/config-context.js");
+const require_general = require("../_utils/general.js");
+const require_components = require("../_utils/components.js");
+const require_index = require("../button/index.js");
+const require_use_locale = require("../_utils/use-locale.js");
+const require_index$1 = require("../popover/index.js");
+let react = require("react");
+react = require_runtime.__toESM(react);
+let classnames = require("classnames");
+classnames = require_runtime.__toESM(classnames);
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/pop-confirm/pop-confirm.tsx
+const PopConfirm = (props) => {
+	const locale = require_use_locale.useLocale();
+	const { placement = "top", confirmText = locale.PopConfirm.okText, cancelText = locale.PopConfirm.cancelText, title, icon, onConfirm, onCancel, onVisibleChange, className, children, prefixCls: customisedCls, ...otherProps } = props;
+	const prefixCls = require_general.getPrefixCls("pop-confirm", (0, react.useContext)(require_config_context.ConfigContext).prefixCls, customisedCls);
+	const cls = (0, classnames.default)(prefixCls, className);
+	const [visible, setVisible] = (0, react.useState)(false);
+	const cancelOnClick = (e) => {
+		setVisible(false);
+		onCancel && onCancel(e);
+	};
+	const confirmOnClick = (e) => {
+		setVisible(false);
+		onConfirm && onConfirm(e);
+	};
+	const overlay = () => {
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: `${prefixCls}__overlay`,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: `${prefixCls}__messages`,
+				children: [icon ? icon : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components.WarningCircle, { size: 14 }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: `${prefixCls}__title`,
+					children: title
+				})]
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: `${prefixCls}__buttons`,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.default, {
+					size: "sm",
+					onClick: cancelOnClick,
+					children: cancelText
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.default, {
+					size: "sm",
+					btnType: "primary",
+					onClick: confirmOnClick,
+					children: confirmText
+				})]
+			})]
+		});
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index$1.default, {
+		...otherProps,
+		className: cls,
+		role: "alertdialog",
+		visible,
+		onVisibleChange: (val) => {
+			setVisible(val);
+			onVisibleChange && onVisibleChange(val);
+		},
+		content: overlay(),
+		placement,
+		children
+	});
+};
+PopConfirm.displayName = "PopConfirm";
+//#endregion
+exports.default = PopConfirm;
+
+//# sourceMappingURL=pop-confirm.js.map

package/lib/pop-confirm/pop-confirm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pop-confirm.js","names":["useLocale","getPrefixCls","ConfigContext","WarningCircle","Button","Popover"],"sources":["../../src/pop-confirm/pop-confirm.tsx"],"sourcesContent":["import React, { useContext, useState } from 'react';\nimport classNames from 'classnames';\nimport Popover from '../popover';\nimport Button from '../button';\nimport { ConfigContext } from '../config-provider/config-context';\nimport { getPrefixCls } from '../_utils/general';\nimport { useLocale } from '../_utils/use-locale';\nimport { WarningCircle } from '../_utils/components';\nimport { PopConfirmProps } from './types';\n\nconst PopConfirm = (props: PopConfirmProps): JSX.Element => {\n  const locale = useLocale();\n  const {\n    placement = 'top',\n    confirmText = locale.PopConfirm.okText,\n    cancelText = locale.PopConfirm.cancelText,\n    title,\n    icon,\n    onConfirm,\n    onCancel,\n    onVisibleChange,\n    className,\n    children,\n    prefixCls: customisedCls,\n    ...otherProps\n  } = props;\n  const configContext = useContext(ConfigContext);\n  const prefixCls = getPrefixCls('pop-confirm', configContext.prefixCls, customisedCls);\n  const cls = classNames(prefixCls, className);\n  const [visible, setVisible] = useState(false);\n\n  const cancelOnClick = (e: React.MouseEvent): void => {\n    setVisible(false);\n    onCancel && onCancel(e);\n  };\n\n  const confirmOnClick = (e: React.MouseEvent): void => {\n    setVisible(false);\n    onConfirm && onConfirm(e);\n  };\n\n  const overlay = (): React.ReactElement => {\n    return (\n      <div className={`${prefixCls}__overlay`}>\n        <div className={`${prefixCls}__messages`}>\n          {icon ? icon : <WarningCircle size={14} />}\n          <span className={`${prefixCls}__title`}>{title}</span>\n        </div>\n        <div className={`${prefixCls}__buttons`}>\n          <Button size=\"sm\" onClick={cancelOnClick}>\n            {cancelText}\n          </Button>\n          <Button size=\"sm\" btnType=\"primary\" onClick={confirmOnClick}>\n            {confirmText}\n          </Button>\n        </div>\n      </div>\n    );\n  };\n\n  return (\n    <Popover\n      {...otherProps}\n      className={cls}\n      role=\"alertdialog\"\n      visible={visible}\n      onVisibleChange={(val: boolean): void => {\n        setVisible(val);\n        onVisibleChange && onVisibleChange(val);\n      }}\n      content={overlay()}\n      placement={placement}>\n      {children}\n    </Popover>\n  );\n};\n\nPopConfirm.displayName = 'PopConfirm';\n\nexport default PopConfirm;\n"],"mappings":";;;;;;;;;;;;;AAUA,MAAM,cAAc,UAAwC;CAC1D,MAAM,SAASA,mBAAAA,WAAW;CAC1B,MAAM,EACJ,YAAY,OACZ,cAAc,OAAO,WAAW,QAChC,aAAa,OAAO,WAAW,YAC/B,OACA,MACA,WACA,UACA,iBACA,WACA,UACA,WAAW,eACX,GAAG,eACD;CAEJ,MAAM,YAAYC,gBAAAA,aAAa,gBAAA,GAAA,MAAA,YADEC,uBAAAA,cAAc,CACa,WAAW,cAAc;CACrF,MAAM,OAAA,GAAA,WAAA,SAAiB,WAAW,UAAU;CAC5C,MAAM,CAAC,SAAS,eAAA,GAAA,MAAA,UAAuB,MAAM;CAE7C,MAAM,iBAAiB,MAA8B;AACnD,aAAW,MAAM;AACjB,cAAY,SAAS,EAAE;;CAGzB,MAAM,kBAAkB,MAA8B;AACpD,aAAW,MAAM;AACjB,eAAa,UAAU,EAAE;;CAG3B,MAAM,gBAAoC;AACxC,SACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAK,WAAW,GAAG,UAAU;aAA7B,CACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,WAAW,GAAG,UAAU;cAA7B,CACG,OAAO,OAAO,iBAAA,GAAA,kBAAA,KAACC,mBAAAA,eAAD,EAAe,MAAM,IAAM,CAAA,EAC1C,iBAAA,GAAA,kBAAA,KAAC,QAAD;KAAM,WAAW,GAAG,UAAU;eAAW;KAAa,CAAA,CAClD;OACN,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,WAAW,GAAG,UAAU;cAA7B,CACE,iBAAA,GAAA,kBAAA,KAACC,cAAAA,SAAD;KAAQ,MAAK;KAAK,SAAS;eACxB;KACM,CAAA,EACT,iBAAA,GAAA,kBAAA,KAACA,cAAAA,SAAD;KAAQ,MAAK;KAAK,SAAQ;KAAU,SAAS;eAC1C;KACM,CAAA,CACL;MACF;;;AAIV,QACE,iBAAA,GAAA,kBAAA,KAACC,gBAAAA,SAAD;EACE,GAAI;EACJ,WAAW;EACX,MAAK;EACI;EACT,kBAAkB,QAAuB;AACvC,cAAW,IAAI;AACf,sBAAmB,gBAAgB,IAAI;;EAEzC,SAAS,SAAS;EACP;EACV;EACO,CAAA;;AAId,WAAW,cAAc"}

package/lib/pop-confirm/style/_index.scss

@@ -0,0 +1,25 @@
+@use '../../style/variables' as *;
+
+.#{$prefix}-pop-confirm {
+  color: var(--ty-color-text-secondary);
+
+  &__overlay {
+    padding: 4px;
+  }
+
+  &__messages {
+    padding: 0 0 12px;
+    font-size: $font-size-base;
+    display: flex;
+    align-items: center;
+  }
+
+  &__buttons {
+    text-align: right;
+  }
+
+  &__title {
+    margin-left: 5px;
+  }
+
+}