@lobehub/ui 5.29.2 → 5.30.0

package/es/base-ui/Alert/Alert.d.mts

@@ -0,0 +1,6 @@
+import { AlertProps } from "./type.mjs";
+//#region src/base-ui/Alert/Alert.d.ts
+declare const Alert: import("react").NamedExoticComponent<AlertProps>;
+//#endregion
+export { Alert as default };
+//# sourceMappingURL=Alert.d.mts.map

package/es/base-ui/Alert/Alert.mjs

@@ -0,0 +1,148 @@
+"use client";
+import Icon from "../../Icon/Icon.mjs";
+import { extraHeaderVariants, extraVariants, integratedVariants, rootVariants, styles, toneVariants } from "./style.mjs";
+import { memo, useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { AlertTriangle, CheckCircle, ChevronRight, Info, X, XCircle } from "lucide-react";
+//#region src/base-ui/Alert/Alert.tsx
+const typeIcons = {
+	error: XCircle,
+	info: Info,
+	secondary: AlertTriangle,
+	success: CheckCircle,
+	warning: AlertTriangle
+};
+const Alert = memo(({ action, afterClose, banner = false, className, classNames, closable = false, closeIcon, closeText, colorfulText = false, description, extra, extraDefaultExpand = false, extraIsolate = false, glass = false, icon, iconProps, message, onClose, ref, role = "alert", rootClassName, showIcon = true, style, styles: customStyles, text, title, type = "info", variant = "soft", ...rest }) => {
+	const [closed, setClosed] = useState(false);
+	const [extraExpanded, setExtraExpanded] = useState(extraDefaultExpand);
+	const resolvedTitle = title ?? message;
+	const hasDescription = description !== void 0 && description !== null;
+	const integratedExtra = Boolean(extra && !extraIsolate);
+	const closeConfig = typeof closable === "object" ? closable : {};
+	const isClosable = Boolean(closable);
+	const { afterClose: configuredAfterClose, closeIcon: configuredCloseIcon, className: closeClassName, disabled: closeDisabled, onClose: configuredOnClose, style: closeStyle, ...closeButtonProps } = closeConfig;
+	const afterCloseRef = useRef(configuredAfterClose ?? afterClose);
+	afterCloseRef.current = configuredAfterClose ?? afterClose;
+	useEffect(() => {
+		if (closed) afterCloseRef.current?.();
+	}, [closed]);
+	if (closed) return null;
+	const handleClose = (event) => {
+		(configuredOnClose ?? onClose)?.(event);
+		setClosed(true);
+	};
+	const root = /* @__PURE__ */ jsxs("div", {
+		...rest,
+		"data-alert-type": type,
+		"data-alert-variant": variant,
+		ref,
+		role,
+		className: cx(toneVariants({ type }), rootVariants({
+			banner,
+			colorfulText,
+			glass: integratedExtra ? false : glass,
+			hasDescription,
+			hasExtra: integratedExtra,
+			variant
+		}), classNames?.root, classNames?.alert, rootClassName, className),
+		style: {
+			...style,
+			...customStyles?.root,
+			...customStyles?.alert
+		},
+		children: [
+			showIcon && /* @__PURE__ */ jsx("span", {
+				"aria-hidden": "true",
+				className: cx(styles.icon, classNames?.icon),
+				style: customStyles?.icon,
+				children: /* @__PURE__ */ jsx(Icon, {
+					icon: icon ?? typeIcons[type],
+					size: hasDescription ? 20 : 18,
+					...iconProps
+				})
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: cx(styles.content, classNames?.section, classNames?.content),
+				style: {
+					...customStyles?.section,
+					...customStyles?.content
+				},
+				children: [resolvedTitle !== void 0 && resolvedTitle !== null && /* @__PURE__ */ jsx("div", {
+					style: customStyles?.title,
+					className: cx(styles.title, hasDescription && styles.titleDetailed, classNames?.title),
+					children: resolvedTitle
+				}), hasDescription && /* @__PURE__ */ jsx("div", {
+					className: cx(styles.description, classNames?.description),
+					style: customStyles?.description,
+					children: description
+				})]
+			}),
+			action && /* @__PURE__ */ jsx("div", {
+				className: cx(styles.action, styles.wrappedAction, classNames?.action),
+				style: customStyles?.action,
+				children: action
+			}),
+			isClosable && /* @__PURE__ */ jsx("button", {
+				...closeButtonProps,
+				"aria-label": closeButtonProps["aria-label"] ?? "Close alert",
+				className: cx(styles.close, classNames?.close, closeClassName),
+				disabled: closeDisabled,
+				style: {
+					...customStyles?.close,
+					...closeStyle
+				},
+				type: "button",
+				onClick: handleClose,
+				children: configuredCloseIcon ?? closeIcon ?? closeText ?? /* @__PURE__ */ jsx(X, { size: 14 })
+			})
+		]
+	});
+	if (!extra) return root;
+	if (extraIsolate) return /* @__PURE__ */ jsxs("div", {
+		className: cx(styles.container, toneVariants({ type }), classNames?.container),
+		style: {
+			gap: 8,
+			...customStyles?.container
+		},
+		children: [root, extra]
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		style: customStyles?.container,
+		className: cx(styles.container, toneVariants({ type }), integratedVariants({
+			banner,
+			glass,
+			variant
+		}), classNames?.container),
+		children: [root, /* @__PURE__ */ jsx("div", {
+			className: cx(extraVariants({
+				banner,
+				variant
+			}), classNames?.extra),
+			style: customStyles?.extra,
+			children: /* @__PURE__ */ jsxs("details", {
+				open: extraExpanded,
+				onToggle: (event) => setExtraExpanded(event.currentTarget.open),
+				children: [/* @__PURE__ */ jsxs("summary", {
+					className: cx(extraHeaderVariants({ variant }), classNames?.extraHeader),
+					style: customStyles?.extraHeader,
+					children: [/* @__PURE__ */ jsx(ChevronRight, {
+						"aria-hidden": "true",
+						className: cx(styles.extraIndicator, classNames?.extraIndicator),
+						size: 14,
+						style: customStyles?.extraIndicator
+					}), /* @__PURE__ */ jsx("span", { children: text?.detail ?? "Show Details" })]
+				}), /* @__PURE__ */ jsx("div", {
+					className: cx(styles.extraContent, classNames?.extraContent),
+					style: customStyles?.extraContent,
+					children: extra
+				})]
+			})
+		})]
+	});
+});
+Alert.displayName = "BaseAlert";
+//#endregion
+export { Alert as default };
+
+//# sourceMappingURL=Alert.mjs.map

package/es/base-ui/Alert/Alert.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.mjs","names":[],"sources":["../../../src/base-ui/Alert/Alert.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { AlertTriangle, CheckCircle, ChevronRight, Info, X, XCircle } from 'lucide-react';\nimport { memo, useEffect, useRef, useState } from 'react';\n\nimport Icon from '@/Icon';\n\nimport {\n  extraHeaderVariants,\n  extraVariants,\n  integratedVariants,\n  rootVariants,\n  styles,\n  toneVariants,\n} from './style';\nimport type { AlertCloseConfig, AlertProps, AlertType } from './type';\n\nconst typeIcons = {\n  error: XCircle,\n  info: Info,\n  secondary: AlertTriangle,\n  success: CheckCircle,\n  warning: AlertTriangle,\n} satisfies Record<AlertType, typeof Info>;\n\nconst Alert = memo<AlertProps>(\n  ({\n    action,\n    afterClose,\n    banner = false,\n    className,\n    classNames,\n    closable = false,\n    closeIcon,\n    closeText,\n    colorfulText = false,\n    description,\n    extra,\n    extraDefaultExpand = false,\n    extraIsolate = false,\n    glass = false,\n    icon,\n    iconProps,\n    message,\n    onClose,\n    ref,\n    role = 'alert',\n    rootClassName,\n    showIcon = true,\n    style,\n    styles: customStyles,\n    text,\n    title,\n    type = 'info',\n    variant = 'soft',\n    ...rest\n  }) => {\n    const [closed, setClosed] = useState(false);\n    const [extraExpanded, setExtraExpanded] = useState(extraDefaultExpand);\n    const resolvedTitle = title ?? message;\n    const hasDescription = description !== undefined && description !== null;\n    const integratedExtra = Boolean(extra && !extraIsolate);\n    const closeConfig: AlertCloseConfig = typeof closable === 'object' ? closable : {};\n    const isClosable = Boolean(closable);\n    const {\n      afterClose: configuredAfterClose,\n      closeIcon: configuredCloseIcon,\n      className: closeClassName,\n      disabled: closeDisabled,\n      onClose: configuredOnClose,\n      style: closeStyle,\n      ...closeButtonProps\n    } = closeConfig;\n    const afterCloseRef = useRef(configuredAfterClose ?? afterClose);\n    afterCloseRef.current = configuredAfterClose ?? afterClose;\n\n    useEffect(() => {\n      if (closed) afterCloseRef.current?.();\n    }, [closed]);\n\n    if (closed) return null;\n\n    const handleClose: NonNullable<AlertCloseConfig['onClose']> = (event) => {\n      (configuredOnClose ?? onClose)?.(event);\n      setClosed(true);\n    };\n\n    const root = (\n      <div\n        {...rest}\n        data-alert-type={type}\n        data-alert-variant={variant}\n        ref={ref}\n        role={role}\n        className={cx(\n          toneVariants({ type }),\n          rootVariants({\n            banner,\n            colorfulText,\n            glass: integratedExtra ? false : glass,\n            hasDescription,\n            hasExtra: integratedExtra,\n            variant,\n          }),\n          classNames?.root,\n          classNames?.alert,\n          rootClassName,\n          className,\n        )}\n        style={{\n          ...style,\n          ...customStyles?.root,\n          ...customStyles?.alert,\n        }}\n      >\n        {showIcon && (\n          <span\n            aria-hidden=\"true\"\n            className={cx(styles.icon, classNames?.icon)}\n            style={customStyles?.icon}\n          >\n            <Icon icon={icon ?? typeIcons[type]} size={hasDescription ? 20 : 18} {...iconProps} />\n          </span>\n        )}\n        <div\n          className={cx(styles.content, classNames?.section, classNames?.content)}\n          style={{ ...customStyles?.section, ...customStyles?.content }}\n        >\n          {resolvedTitle !== undefined && resolvedTitle !== null && (\n            <div\n              style={customStyles?.title}\n              className={cx(\n                styles.title,\n                hasDescription && styles.titleDetailed,\n                classNames?.title,\n              )}\n            >\n              {resolvedTitle}\n            </div>\n          )}\n          {hasDescription && (\n            <div\n              className={cx(styles.description, classNames?.description)}\n              style={customStyles?.description}\n            >\n              {description}\n            </div>\n          )}\n        </div>\n        {action && (\n          <div\n            className={cx(styles.action, styles.wrappedAction, classNames?.action)}\n            style={customStyles?.action}\n          >\n            {action}\n          </div>\n        )}\n        {isClosable && (\n          <button\n            {...closeButtonProps}\n            aria-label={closeButtonProps['aria-label'] ?? 'Close alert'}\n            className={cx(styles.close, classNames?.close, closeClassName)}\n            disabled={closeDisabled}\n            style={{ ...customStyles?.close, ...closeStyle }}\n            type=\"button\"\n            onClick={handleClose}\n          >\n            {configuredCloseIcon ?? closeIcon ?? closeText ?? <X size={14} />}\n          </button>\n        )}\n      </div>\n    );\n\n    if (!extra) return root;\n\n    if (extraIsolate) {\n      return (\n        <div\n          className={cx(styles.container, toneVariants({ type }), classNames?.container)}\n          style={{ gap: 8, ...customStyles?.container }}\n        >\n          {root}\n          {extra}\n        </div>\n      );\n    }\n\n    return (\n      <div\n        style={customStyles?.container}\n        className={cx(\n          styles.container,\n          toneVariants({ type }),\n          integratedVariants({ banner, glass, variant }),\n          classNames?.container,\n        )}\n      >\n        {root}\n        <div\n          className={cx(extraVariants({ banner, variant }), classNames?.extra)}\n          style={customStyles?.extra}\n        >\n          <details\n            open={extraExpanded}\n            onToggle={(event) => setExtraExpanded(event.currentTarget.open)}\n          >\n            <summary\n              className={cx(extraHeaderVariants({ variant }), classNames?.extraHeader)}\n              style={customStyles?.extraHeader}\n            >\n              <ChevronRight\n                aria-hidden=\"true\"\n                className={cx(styles.extraIndicator, classNames?.extraIndicator)}\n                size={14}\n                style={customStyles?.extraIndicator}\n              />\n              <span>{text?.detail ?? 'Show Details'}</span>\n            </summary>\n            <div\n              className={cx(styles.extraContent, classNames?.extraContent)}\n              style={customStyles?.extraContent}\n            >\n              {extra}\n            </div>\n          </details>\n        </div>\n      </div>\n    );\n  },\n);\n\nAlert.displayName = 'BaseAlert';\n\nexport default Alert;\n"],"mappings":"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"}

package/es/base-ui/Alert/index.d.mts

@@ -0,0 +1,4 @@
+import { AlertClassNames, AlertCloseConfig, AlertProps, AlertRef, AlertStyles, AlertType, AlertVariant } from "./type.mjs";
+import Alert from "./Alert.mjs";
+import { styles } from "./style.mjs";
+export { Alert, type AlertClassNames, type AlertCloseConfig, type AlertProps, type AlertRef, type AlertStyles, type AlertType, type AlertVariant, styles as alertStyles };

package/es/base-ui/Alert/style.d.mts

@@ -0,0 +1,37 @@
+//#region src/base-ui/Alert/style.d.ts
+declare const styles: {
+  action: string;
+  close: string;
+  colorfulText: string;
+  container: string;
+  content: string;
+  description: string;
+  detailed: string;
+  extra: string;
+  extraBanner: string;
+  extraContent: string;
+  extraHeader: string;
+  extraHeaderPlain: string;
+  extraIndicator: string;
+  extraPlain: string;
+  icon: string;
+  integrated: string;
+  neutralText: string;
+  root: string;
+  soft: string;
+  outlined: string;
+  plain: string;
+  title: string;
+  titleDetailed: string;
+  toneError: string;
+  toneInfo: string;
+  toneSecondary: string;
+  toneSuccess: string;
+  toneWarning: string;
+  unifiedRoot: string;
+  banner: string;
+  wrappedAction: string;
+};
+//#endregion
+export { styles };
+//# sourceMappingURL=style.d.mts.map

package/es/base-ui/Alert/style.mjs

@@ -0,0 +1,419 @@
+import { staticStylish } from "../../styles/theme/customStylishStatic.mjs";
+import { createStaticStyles } from "antd-style";
+import { cva } from "class-variance-authority";
+//#region src/base-ui/Alert/style.ts
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	action: css`
+    display: flex;
+    flex-shrink: 0;
+    align-items: center;
+
+    min-height: 32px;
+    margin-inline-start: auto;
+  `,
+	close: css`
+    cursor: pointer;
+
+    position: relative;
+    scale: 1;
+
+    display: inline-flex;
+    flex-shrink: 0;
+    align-items: center;
+    justify-content: center;
+
+    width: 32px;
+    height: 32px;
+    margin: 0;
+    padding: 0;
+    border: none;
+    border-radius: ${cssVar.borderRadiusSM};
+
+    color: ${cssVar.colorTextTertiary};
+
+    background: transparent;
+
+    transition:
+      color 160ms ${cssVar.motionEaseOut},
+      background-color 160ms ${cssVar.motionEaseOut},
+      scale 160ms ${cssVar.motionEaseOut};
+
+    &::after {
+      content: '';
+
+      position: absolute;
+      inset-block-start: 50%;
+      inset-inline-start: 50%;
+      translate: -50% -50%;
+
+      width: 40px;
+      height: 40px;
+    }
+
+    &:hover:not(:disabled) {
+      color: ${cssVar.colorText};
+      background: ${cssVar.colorFillTertiary};
+    }
+
+    &:active:not(:disabled) {
+      scale: 0.96;
+    }
+
+    &:focus-visible {
+      outline: 2px solid ${cssVar.colorPrimaryBorder};
+      outline-offset: 1px;
+    }
+
+    &:disabled {
+      cursor: not-allowed;
+      opacity: 0.45;
+    }
+
+    @media (prefers-reduced-motion: reduce) {
+      transition-duration: 0s;
+    }
+  `,
+	colorfulText: css`
+    color: var(--lobe-alert-accent);
+  `,
+	container: css`
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    max-width: 100%;
+  `,
+	content: css`
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+    min-width: 0;
+  `,
+	description: css`
+    font-size: 13px;
+    line-height: 20px;
+    color: ${cssVar.colorTextSecondary};
+    text-wrap: pretty;
+    overflow-wrap: anywhere;
+  `,
+	detailed: css`
+    padding-block: 12px;
+    padding-inline: 14px;
+  `,
+	extra: css`
+    position: relative;
+    max-width: 100%;
+    color: ${cssVar.colorText};
+  `,
+	extraBanner: css`
+    border-radius: 0;
+  `,
+	extraContent: css`
+    overflow: hidden;
+
+    margin-block: 0 12px;
+    margin-inline: 12px;
+    padding: 8px;
+    border-radius: ${cssVar.borderRadiusSM};
+
+    font-size: 12px;
+    color: ${cssVar.colorText};
+
+    background: ${cssVar.colorFillQuaternary};
+  `,
+	extraHeader: css`
+    cursor: pointer;
+    user-select: none;
+
+    display: flex;
+    gap: 6px;
+    align-items: center;
+
+    min-height: 40px;
+    padding-block: 8px;
+    padding-inline: 14px;
+    border-block-start: 1px solid ${cssVar.colorBorderSecondary};
+    border-radius: 0;
+
+    font-size: 12px;
+    font-weight: 500;
+    line-height: 20px;
+    color: ${cssVar.colorTextSecondary};
+
+    background: transparent;
+
+    transition:
+      color 160ms ${cssVar.motionEaseOut},
+      background-color 160ms ${cssVar.motionEaseOut};
+
+    &::marker,
+    &::-webkit-details-marker {
+      content: '';
+      display: none;
+    }
+
+    &:hover {
+      color: ${cssVar.colorText};
+      background: ${cssVar.colorFillQuaternary};
+    }
+
+    &:focus-visible {
+      outline: 2px solid ${cssVar.colorPrimaryBorder};
+      outline-offset: -2px;
+    }
+  `,
+	extraHeaderPlain: css`
+    margin-block-start: 6px;
+    padding-inline: 0;
+    border-block-start-color: ${cssVar.colorBorderSecondary};
+  `,
+	extraIndicator: css`
+    flex-shrink: 0;
+    color: ${cssVar.colorTextTertiary};
+    transition: transform 160ms ${cssVar.motionEaseOut};
+
+    details[open] > summary > & {
+      transform: rotate(90deg);
+    }
+
+    @media (prefers-reduced-motion: reduce) {
+      transition-duration: 0s;
+    }
+  `,
+	extraPlain: css`
+    background: transparent;
+  `,
+	icon: css`
+    display: inline-flex;
+    flex-shrink: 0;
+    align-items: center;
+    justify-content: center;
+
+    height: 20px;
+
+    color: var(--lobe-alert-accent);
+  `,
+	integrated: css`
+    overflow: hidden;
+    border-radius: ${cssVar.borderRadius};
+  `,
+	neutralText: css`
+    color: ${cssVar.colorText};
+  `,
+	root: css`
+    display: flex;
+    flex-direction: row;
+    gap: 10px;
+    align-items: flex-start;
+
+    box-sizing: border-box;
+    width: 100%;
+    max-width: 100%;
+    padding-block: 10px;
+    padding-inline: 12px;
+    border: none;
+    border-radius: ${cssVar.borderRadius};
+
+    font-size: 14px;
+    color: ${cssVar.colorText};
+
+    background: var(--lobe-alert-background);
+    box-shadow: inset 0 0 0 1px var(--lobe-alert-soft-border);
+
+    @media (width <= 480px) {
+      flex-wrap: wrap;
+    }
+  `,
+	soft: css`
+    background: var(--lobe-alert-background);
+    box-shadow: inset 0 0 0 1px var(--lobe-alert-soft-border);
+  `,
+	outlined: css`
+    background: transparent;
+    box-shadow: inset 0 0 0 1px ${cssVar.colorBorderSecondary};
+  `,
+	plain: css`
+    padding-block: 2px;
+    padding-inline: 0;
+    background: transparent;
+    box-shadow: none;
+  `,
+	title: css`
+    font-size: 14px;
+    font-weight: 500;
+    line-height: 20px;
+    color: inherit;
+    text-wrap: pretty;
+    overflow-wrap: anywhere;
+  `,
+	titleDetailed: css`
+    font-weight: 500;
+  `,
+	toneError: css`
+    --lobe-alert-accent: ${cssVar.colorError};
+    --lobe-alert-background: color-mix(
+      in srgb,
+      ${cssVar.colorError} 5%,
+      ${cssVar.colorBgContainer}
+    );
+    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorError} 14%, transparent);
+  `,
+	toneInfo: css`
+    --lobe-alert-accent: ${cssVar.colorInfo};
+    --lobe-alert-background: color-mix(in srgb, ${cssVar.colorInfo} 5%, ${cssVar.colorBgContainer});
+    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorInfo} 14%, transparent);
+  `,
+	toneSecondary: css`
+    --lobe-alert-accent: ${cssVar.colorTextSecondary};
+    --lobe-alert-background: color-mix(
+      in srgb,
+      ${cssVar.colorTextSecondary} 4%,
+      ${cssVar.colorBgContainer}
+    );
+    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorTextSecondary} 12%, transparent);
+  `,
+	toneSuccess: css`
+    --lobe-alert-accent: ${cssVar.colorSuccess};
+    --lobe-alert-background: color-mix(
+      in srgb,
+      ${cssVar.colorSuccess} 5%,
+      ${cssVar.colorBgContainer}
+    );
+    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorSuccess} 14%, transparent);
+  `,
+	toneWarning: css`
+    --lobe-alert-accent: ${cssVar.colorWarning};
+    --lobe-alert-background: color-mix(
+      in srgb,
+      ${cssVar.colorWarning} 5%,
+      ${cssVar.colorBgContainer}
+    );
+    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorWarning} 14%, transparent);
+  `,
+	unifiedRoot: css`
+    border-radius: 0;
+    background: transparent;
+    box-shadow: none;
+  `,
+	banner: css`
+    border-radius: 0;
+    box-shadow: none;
+  `,
+	wrappedAction: css`
+    @media (width <= 480px) {
+      order: 4;
+      width: calc(100% - 30px);
+      margin-block-start: -2px;
+      margin-inline-start: 30px;
+    }
+  `
+}));
+const toneVariants = cva("", {
+	defaultVariants: { type: "info" },
+	variants: { type: {
+		error: styles.toneError,
+		info: styles.toneInfo,
+		secondary: styles.toneSecondary,
+		success: styles.toneSuccess,
+		warning: styles.toneWarning
+	} }
+});
+const rootVariants = cva(styles.root, {
+	compoundVariants: [{
+		class: styles.unifiedRoot,
+		hasExtra: true
+	}],
+	defaultVariants: {
+		banner: false,
+		colorfulText: false,
+		glass: false,
+		hasDescription: false,
+		hasExtra: false,
+		variant: "soft"
+	},
+	variants: {
+		banner: {
+			false: null,
+			true: styles.banner
+		},
+		colorfulText: {
+			false: styles.neutralText,
+			true: styles.colorfulText
+		},
+		glass: {
+			false: null,
+			true: staticStylish.blur
+		},
+		hasDescription: {
+			false: null,
+			true: styles.detailed
+		},
+		hasExtra: {
+			false: null,
+			true: null
+		},
+		variant: {
+			borderless: styles.plain,
+			filled: styles.soft,
+			outlined: styles.outlined,
+			plain: styles.plain,
+			soft: styles.soft
+		}
+	}
+});
+const integratedVariants = cva(styles.integrated, {
+	defaultVariants: {
+		banner: false,
+		glass: false,
+		variant: "soft"
+	},
+	variants: {
+		banner: {
+			false: null,
+			true: styles.banner
+		},
+		glass: {
+			false: null,
+			true: staticStylish.blur
+		},
+		variant: {
+			borderless: styles.extraPlain,
+			filled: styles.soft,
+			outlined: styles.outlined,
+			plain: styles.extraPlain,
+			soft: styles.soft
+		}
+	}
+});
+const extraVariants = cva(styles.extra, {
+	defaultVariants: {
+		banner: false,
+		variant: "soft"
+	},
+	variants: {
+		banner: {
+			false: null,
+			true: styles.extraBanner
+		},
+		variant: {
+			borderless: styles.extraPlain,
+			filled: null,
+			outlined: null,
+			plain: styles.extraPlain,
+			soft: null
+		}
+	}
+});
+const extraHeaderVariants = cva(styles.extraHeader, {
+	defaultVariants: { variant: "soft" },
+	variants: { variant: {
+		borderless: styles.extraHeaderPlain,
+		filled: null,
+		outlined: null,
+		plain: styles.extraHeaderPlain,
+		soft: null
+	} }
+});
+//#endregion
+export { extraHeaderVariants, extraVariants, integratedVariants, rootVariants, styles, toneVariants };
+
+//# sourceMappingURL=style.mjs.map

package/es/base-ui/Alert/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../../src/base-ui/Alert/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  action: css`\n    display: flex;\n    flex-shrink: 0;\n    align-items: center;\n\n    min-height: 32px;\n    margin-inline-start: auto;\n  `,\n  close: css`\n    cursor: pointer;\n\n    position: relative;\n    scale: 1;\n\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n\n    width: 32px;\n    height: 32px;\n    margin: 0;\n    padding: 0;\n    border: none;\n    border-radius: ${cssVar.borderRadiusSM};\n\n    color: ${cssVar.colorTextTertiary};\n\n    background: transparent;\n\n    transition:\n      color 160ms ${cssVar.motionEaseOut},\n      background-color 160ms ${cssVar.motionEaseOut},\n      scale 160ms ${cssVar.motionEaseOut};\n\n    &::after {\n      content: '';\n\n      position: absolute;\n      inset-block-start: 50%;\n      inset-inline-start: 50%;\n      translate: -50% -50%;\n\n      width: 40px;\n      height: 40px;\n    }\n\n    &:hover:not(:disabled) {\n      color: ${cssVar.colorText};\n      background: ${cssVar.colorFillTertiary};\n    }\n\n    &:active:not(:disabled) {\n      scale: 0.96;\n    }\n\n    &:focus-visible {\n      outline: 2px solid ${cssVar.colorPrimaryBorder};\n      outline-offset: 1px;\n    }\n\n    &:disabled {\n      cursor: not-allowed;\n      opacity: 0.45;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      transition-duration: 0s;\n    }\n  `,\n  colorfulText: css`\n    color: var(--lobe-alert-accent);\n  `,\n  container: css`\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n    max-width: 100%;\n  `,\n  content: css`\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    min-width: 0;\n  `,\n  description: css`\n    font-size: 13px;\n    line-height: 20px;\n    color: ${cssVar.colorTextSecondary};\n    text-wrap: pretty;\n    overflow-wrap: anywhere;\n  `,\n  detailed: css`\n    padding-block: 12px;\n    padding-inline: 14px;\n  `,\n  extra: css`\n    position: relative;\n    max-width: 100%;\n    color: ${cssVar.colorText};\n  `,\n  extraBanner: css`\n    border-radius: 0;\n  `,\n  extraContent: css`\n    overflow: hidden;\n\n    margin-block: 0 12px;\n    margin-inline: 12px;\n    padding: 8px;\n    border-radius: ${cssVar.borderRadiusSM};\n\n    font-size: 12px;\n    color: ${cssVar.colorText};\n\n    background: ${cssVar.colorFillQuaternary};\n  `,\n  extraHeader: css`\n    cursor: pointer;\n    user-select: none;\n\n    display: flex;\n    gap: 6px;\n    align-items: center;\n\n    min-height: 40px;\n    padding-block: 8px;\n    padding-inline: 14px;\n    border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n    border-radius: 0;\n\n    font-size: 12px;\n    font-weight: 500;\n    line-height: 20px;\n    color: ${cssVar.colorTextSecondary};\n\n    background: transparent;\n\n    transition:\n      color 160ms ${cssVar.motionEaseOut},\n      background-color 160ms ${cssVar.motionEaseOut};\n\n    &::marker,\n    &::-webkit-details-marker {\n      content: '';\n      display: none;\n    }\n\n    &:hover {\n      color: ${cssVar.colorText};\n      background: ${cssVar.colorFillQuaternary};\n    }\n\n    &:focus-visible {\n      outline: 2px solid ${cssVar.colorPrimaryBorder};\n      outline-offset: -2px;\n    }\n  `,\n  extraHeaderPlain: css`\n    margin-block-start: 6px;\n    padding-inline: 0;\n    border-block-start-color: ${cssVar.colorBorderSecondary};\n  `,\n  extraIndicator: css`\n    flex-shrink: 0;\n    color: ${cssVar.colorTextTertiary};\n    transition: transform 160ms ${cssVar.motionEaseOut};\n\n    details[open] > summary > & {\n      transform: rotate(90deg);\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      transition-duration: 0s;\n    }\n  `,\n  extraPlain: css`\n    background: transparent;\n  `,\n  icon: css`\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n\n    height: 20px;\n\n    color: var(--lobe-alert-accent);\n  `,\n  integrated: css`\n    overflow: hidden;\n    border-radius: ${cssVar.borderRadius};\n  `,\n  neutralText: css`\n    color: ${cssVar.colorText};\n  `,\n  root: css`\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n\n    box-sizing: border-box;\n    width: 100%;\n    max-width: 100%;\n    padding-block: 10px;\n    padding-inline: 12px;\n    border: none;\n    border-radius: ${cssVar.borderRadius};\n\n    font-size: 14px;\n    color: ${cssVar.colorText};\n\n    background: var(--lobe-alert-background);\n    box-shadow: inset 0 0 0 1px var(--lobe-alert-soft-border);\n\n    @media (width <= 480px) {\n      flex-wrap: wrap;\n    }\n  `,\n  soft: css`\n    background: var(--lobe-alert-background);\n    box-shadow: inset 0 0 0 1px var(--lobe-alert-soft-border);\n  `,\n  outlined: css`\n    background: transparent;\n    box-shadow: inset 0 0 0 1px ${cssVar.colorBorderSecondary};\n  `,\n  plain: css`\n    padding-block: 2px;\n    padding-inline: 0;\n    background: transparent;\n    box-shadow: none;\n  `,\n  title: css`\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 20px;\n    color: inherit;\n    text-wrap: pretty;\n    overflow-wrap: anywhere;\n  `,\n  titleDetailed: css`\n    font-weight: 500;\n  `,\n  toneError: css`\n    --lobe-alert-accent: ${cssVar.colorError};\n    --lobe-alert-background: color-mix(\n      in srgb,\n      ${cssVar.colorError} 5%,\n      ${cssVar.colorBgContainer}\n    );\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorError} 14%, transparent);\n  `,\n  toneInfo: css`\n    --lobe-alert-accent: ${cssVar.colorInfo};\n    --lobe-alert-background: color-mix(in srgb, ${cssVar.colorInfo} 5%, ${cssVar.colorBgContainer});\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorInfo} 14%, transparent);\n  `,\n  toneSecondary: css`\n    --lobe-alert-accent: ${cssVar.colorTextSecondary};\n    --lobe-alert-background: color-mix(\n      in srgb,\n      ${cssVar.colorTextSecondary} 4%,\n      ${cssVar.colorBgContainer}\n    );\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorTextSecondary} 12%, transparent);\n  `,\n  toneSuccess: css`\n    --lobe-alert-accent: ${cssVar.colorSuccess};\n    --lobe-alert-background: color-mix(\n      in srgb,\n      ${cssVar.colorSuccess} 5%,\n      ${cssVar.colorBgContainer}\n    );\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorSuccess} 14%, transparent);\n  `,\n  toneWarning: css`\n    --lobe-alert-accent: ${cssVar.colorWarning};\n    --lobe-alert-background: color-mix(\n      in srgb,\n      ${cssVar.colorWarning} 5%,\n      ${cssVar.colorBgContainer}\n    );\n    --lobe-alert-soft-border: color-mix(in srgb, ${cssVar.colorWarning} 14%, transparent);\n  `,\n  unifiedRoot: css`\n    border-radius: 0;\n    background: transparent;\n    box-shadow: none;\n  `,\n  banner: css`\n    border-radius: 0;\n    box-shadow: none;\n  `,\n  wrappedAction: css`\n    @media (width <= 480px) {\n      order: 4;\n      width: calc(100% - 30px);\n      margin-block-start: -2px;\n      margin-inline-start: 30px;\n    }\n  `,\n}));\n\nexport const toneVariants = cva('', {\n  defaultVariants: { type: 'info' },\n  variants: {\n    type: {\n      error: styles.toneError,\n      info: styles.toneInfo,\n      secondary: styles.toneSecondary,\n      success: styles.toneSuccess,\n      warning: styles.toneWarning,\n    },\n  },\n});\n\nexport const rootVariants = cva(styles.root, {\n  compoundVariants: [{ class: styles.unifiedRoot, hasExtra: true }],\n  defaultVariants: {\n    banner: false,\n    colorfulText: false,\n    glass: false,\n    hasDescription: false,\n    hasExtra: false,\n    variant: 'soft',\n  },\n  variants: {\n    banner: { false: null, true: styles.banner },\n    colorfulText: { false: styles.neutralText, true: styles.colorfulText },\n    glass: { false: null, true: lobeStaticStylish.blur },\n    hasDescription: { false: null, true: styles.detailed },\n    hasExtra: { false: null, true: null },\n    variant: {\n      borderless: styles.plain,\n      filled: styles.soft,\n      outlined: styles.outlined,\n      plain: styles.plain,\n      soft: styles.soft,\n    },\n  },\n});\n\nexport const integratedVariants = cva(styles.integrated, {\n  defaultVariants: { banner: false, glass: false, variant: 'soft' },\n  variants: {\n    banner: { false: null, true: styles.banner },\n    glass: { false: null, true: lobeStaticStylish.blur },\n    variant: {\n      borderless: styles.extraPlain,\n      filled: styles.soft,\n      outlined: styles.outlined,\n      plain: styles.extraPlain,\n      soft: styles.soft,\n    },\n  },\n});\n\nexport const extraVariants = cva(styles.extra, {\n  defaultVariants: { banner: false, variant: 'soft' },\n  variants: {\n    banner: { false: null, true: styles.extraBanner },\n    variant: {\n      borderless: styles.extraPlain,\n      filled: null,\n      outlined: null,\n      plain: styles.extraPlain,\n      soft: null,\n    },\n  },\n});\n\nexport const extraHeaderVariants = cva(styles.extraHeader, {\n  defaultVariants: { variant: 'soft' },\n  variants: {\n    variant: {\n      borderless: styles.extraHeaderPlain,\n      filled: null,\n      outlined: null,\n      plain: styles.extraHeaderPlain,\n      soft: null,\n    },\n  },\n});\n"],"mappings":"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"}