@lobehub/ui 5.51.0 → 5.51.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -23,8 +23,8 @@ declare const styles: {
|
|
|
23
23
|
};
|
|
24
24
|
declare const rootVariants: (props?: ({
|
|
25
25
|
shadow?: boolean | null | undefined;
|
|
26
|
-
size?: "
|
|
27
|
-
variant?: "
|
|
26
|
+
size?: "large" | "middle" | "small" | null | undefined;
|
|
27
|
+
variant?: "filled" | "borderless" | "outlined" | null | undefined;
|
|
28
28
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
29
29
|
//#endregion
|
|
30
30
|
export { rootVariants, styles };
|
|
@@ -41,10 +41,13 @@ const Result = memo(({ children, className, extra, icon, ref, status = "info", s
|
|
|
41
41
|
style,
|
|
42
42
|
...rest,
|
|
43
43
|
children: [
|
|
44
|
-
/* @__PURE__ */ jsx("div", {
|
|
44
|
+
icon ? /* @__PURE__ */ jsx("div", {
|
|
45
|
+
className: styles.customIcon,
|
|
46
|
+
children: icon
|
|
47
|
+
}) : /* @__PURE__ */ jsx("div", {
|
|
45
48
|
className: styles.icon,
|
|
46
49
|
style: iconStyle,
|
|
47
|
-
children:
|
|
50
|
+
children: statusIcon[status]
|
|
48
51
|
}),
|
|
49
52
|
title && /* @__PURE__ */ jsx("h3", {
|
|
50
53
|
className: styles.title,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Result.mjs","names":[],"sources":["../../../src/base-ui/Result/Result.tsx"],"sourcesContent":["'use client';\n\nimport { cssVar, cx } from 'antd-style';\nimport { Check, Info, TriangleAlert, X } from 'lucide-react';\nimport { memo, useMemo } from 'react';\n\nimport { statusColor, styles } from './style';\nimport type { ResultProps } from './type';\n\nconst statusIcon = {\n error: <X size={36} strokeWidth={2.5} />,\n info: <Info size={36} strokeWidth={2} />,\n success: <Check size={36} strokeWidth={2.5} />,\n warning: <TriangleAlert size={36} strokeWidth={2} />,\n};\n\nconst Result = memo<ResultProps>(\n ({ children, className, extra, icon, ref, status = 'info', style, subTitle, title, ...rest }) => {\n const iconStyle = useMemo(() => {\n if (status === 'info') {\n return { background: cssVar.colorFillTertiary, color: cssVar.colorTextSecondary };\n }\n const color = statusColor[status];\n return { background: `color-mix(in srgb, ${color} 12%, transparent)`, color };\n }, [status]);\n\n return (\n <section className={cx(styles.root, className)} ref={ref} style={style} {...rest}>\n <div className={styles.icon} style={iconStyle}>\n
|
|
1
|
+
{"version":3,"file":"Result.mjs","names":[],"sources":["../../../src/base-ui/Result/Result.tsx"],"sourcesContent":["'use client';\n\nimport { cssVar, cx } from 'antd-style';\nimport { Check, Info, TriangleAlert, X } from 'lucide-react';\nimport { memo, useMemo } from 'react';\n\nimport { statusColor, styles } from './style';\nimport type { ResultProps } from './type';\n\nconst statusIcon = {\n error: <X size={36} strokeWidth={2.5} />,\n info: <Info size={36} strokeWidth={2} />,\n success: <Check size={36} strokeWidth={2.5} />,\n warning: <TriangleAlert size={36} strokeWidth={2} />,\n};\n\nconst Result = memo<ResultProps>(\n ({ children, className, extra, icon, ref, status = 'info', style, subTitle, title, ...rest }) => {\n const iconStyle = useMemo(() => {\n if (status === 'info') {\n return { background: cssVar.colorFillTertiary, color: cssVar.colorTextSecondary };\n }\n const color = statusColor[status];\n return { background: `color-mix(in srgb, ${color} 12%, transparent)`, color };\n }, [status]);\n\n return (\n <section className={cx(styles.root, className)} ref={ref} style={style} {...rest}>\n {icon ? (\n <div className={styles.customIcon}>{icon}</div>\n ) : (\n <div className={styles.icon} style={iconStyle}>\n {statusIcon[status]}\n </div>\n )}\n {title && <h3 className={styles.title}>{title}</h3>}\n {subTitle && <p className={styles.subTitle}>{subTitle}</p>}\n {extra && <div className={styles.extra}>{extra}</div>}\n {children}\n </section>\n );\n },\n);\n\nResult.displayName = 'Result';\n\nexport default Result;\n"],"mappings":";;;;;;;AASA,MAAM,aAAa;CACjB,OAAO,oBAAC,GAAD;EAAG,MAAM;EAAI,aAAa;CAAM,CAAA;CACvC,MAAM,oBAAC,MAAD;EAAM,MAAM;EAAI,aAAa;CAAI,CAAA;CACvC,SAAS,oBAAC,OAAD;EAAO,MAAM;EAAI,aAAa;CAAM,CAAA;CAC7C,SAAS,oBAAC,eAAD;EAAe,MAAM;EAAI,aAAa;CAAI,CAAA;AACrD;AAEA,MAAM,SAAS,MACZ,EAAE,UAAU,WAAW,OAAO,MAAM,KAAK,SAAS,QAAQ,OAAO,UAAU,OAAO,GAAG,WAAW;CAC/F,MAAM,YAAY,cAAc;EAC9B,IAAI,WAAW,QACb,OAAO;GAAE,YAAY,OAAO;GAAmB,OAAO,OAAO;EAAmB;EAElF,MAAM,QAAQ,YAAY;EAC1B,OAAO;GAAE,YAAY,sBAAsB,MAAM;GAAqB;EAAM;CAC9E,GAAG,CAAC,MAAM,CAAC;CAEX,OACE,qBAAC,WAAD;EAAS,WAAW,GAAG,OAAO,MAAM,SAAS;EAAQ;EAAY;EAAO,GAAI;EAA5E,UAAA;GACG,OACC,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAa,UAAA;GAAU,CAAA,IAE9C,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAM,OAAO;IACjC,UAAA,WAAW;GACT,CAAA;GAEN,SAAS,oBAAC,MAAD;IAAI,WAAW,OAAO;IAAQ,UAAA;GAAU,CAAA;GACjD,YAAY,oBAAC,KAAD;IAAG,WAAW,OAAO;IAAW,UAAA;GAAY,CAAA;GACxD,SAAS,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAQ,UAAA;GAAW,CAAA;GACnD;EACM;;AAEb,CACF;AAEA,OAAO,cAAc"}
|
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
import { createStaticStyles, cssVar } from "antd-style";
|
|
2
2
|
//#region src/base-ui/Result/style.ts
|
|
3
3
|
const styles = createStaticStyles(({ css, cssVar }) => ({
|
|
4
|
+
customIcon: css`
|
|
5
|
+
display: flex;
|
|
6
|
+
flex-shrink: 0;
|
|
7
|
+
justify-content: center;
|
|
8
|
+
margin-block-end: 12px;
|
|
9
|
+
`,
|
|
4
10
|
extra: css`
|
|
5
11
|
display: flex;
|
|
6
12
|
flex-wrap: wrap;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Result/style.ts"],"sourcesContent":["import { createStaticStyles, cssVar } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n extra: css`\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n align-items: center;\n align-self: stretch;\n justify-content: center;\n\n margin-block-start: 10px;\n\n > :is(div, section, form) {\n flex: 1 1 100%;\n }\n `,\n icon: css`\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n\n width: 72px;\n height: 72px;\n margin-block-end: 12px;\n border-radius: 50%;\n\n svg {\n width: 36px;\n height: 36px;\n }\n `,\n root: css`\n display: flex;\n flex-direction: column;\n gap: 6px;\n align-items: center;\n\n padding-block: 16px;\n padding-inline: 8px;\n\n text-align: center;\n `,\n subTitle: css`\n max-width: 36ch;\n margin: 0;\n font-size: 13px;\n color: ${cssVar.colorTextTertiary};\n `,\n title: css`\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n text-wrap: balance;\n `,\n}));\n\nexport const statusColor: Record<'success' | 'error' | 'warning', string> = {\n error: cssVar.colorError,\n success: cssVar.colorSuccess,\n warning: cssVar.colorWarning,\n};\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,OAAO,GAAG;;;;;;;;;;;;;;CAcV,MAAM,GAAG;;;;;;;;;;;;;;;;CAgBT,MAAM,GAAG;;;;;;;;;;;CAWT,UAAU,GAAG;;;;aAIF,OAAO,kBAAkB;;CAEpC,OAAO,GAAG;;;;;;AAMZ,EAAE;AAEF,MAAa,cAA+D;CAC1E,OAAO,OAAO;CACd,SAAS,OAAO;CAChB,SAAS,OAAO;AAClB"}
|
|
1
|
+
{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Result/style.ts"],"sourcesContent":["import { createStaticStyles, cssVar } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n customIcon: css`\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n margin-block-end: 12px;\n `,\n extra: css`\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n align-items: center;\n align-self: stretch;\n justify-content: center;\n\n margin-block-start: 10px;\n\n > :is(div, section, form) {\n flex: 1 1 100%;\n }\n `,\n icon: css`\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n\n width: 72px;\n height: 72px;\n margin-block-end: 12px;\n border-radius: 50%;\n\n svg {\n width: 36px;\n height: 36px;\n }\n `,\n root: css`\n display: flex;\n flex-direction: column;\n gap: 6px;\n align-items: center;\n\n padding-block: 16px;\n padding-inline: 8px;\n\n text-align: center;\n `,\n subTitle: css`\n max-width: 36ch;\n margin: 0;\n font-size: 13px;\n color: ${cssVar.colorTextTertiary};\n `,\n title: css`\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n text-wrap: balance;\n `,\n}));\n\nexport const statusColor: Record<'success' | 'error' | 'warning', string> = {\n error: cssVar.colorError,\n success: cssVar.colorSuccess,\n warning: cssVar.colorWarning,\n};\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,YAAY,GAAG;;;;;;CAMf,OAAO,GAAG;;;;;;;;;;;;;;CAcV,MAAM,GAAG;;;;;;;;;;;;;;;;CAgBT,MAAM,GAAG;;;;;;;;;;;CAWT,UAAU,GAAG;;;;aAIF,OAAO,kBAAkB;;CAEpC,OAAO,GAAG;;;;;;AAMZ,EAAE;AAEF,MAAa,cAA+D;CAC1E,OAAO,OAAO;CACd,SAAS,OAAO;CAChB,SAAS,OAAO;AAClB"}
|