@schemavaults/ui 0.49.0 → 0.50.2
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.
|
@@ -2,6 +2,9 @@ import { type ReactElement } from "react";
|
|
|
2
2
|
export interface KeyValueWithSkeletonProps {
|
|
3
3
|
label: string;
|
|
4
4
|
value?: string | Promise<string> | null;
|
|
5
|
+
className?: string;
|
|
6
|
+
labelClassName?: string;
|
|
7
|
+
valueClassName?: string;
|
|
5
8
|
}
|
|
6
|
-
export declare function KeyValueWithSkeleton({ label, value, }: KeyValueWithSkeletonProps): ReactElement;
|
|
9
|
+
export declare function KeyValueWithSkeleton({ label, value, className, labelClassName, valueClassName, }: KeyValueWithSkeletonProps): ReactElement;
|
|
7
10
|
export default KeyValueWithSkeleton;
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { Skeleton } from "../../ui/skeleton";
|
|
4
|
+
import { cn } from "../../../lib/utils";
|
|
4
5
|
import { useState, useEffect, useRef, } from "react";
|
|
5
6
|
function KeyValueFallbackSkeleton() {
|
|
6
7
|
return (_jsx(Skeleton, { className: "min-w-[100px] md:min-w-[140px] lg:min-w-[200px] min-h-[12px]" }));
|
|
7
8
|
}
|
|
8
|
-
function DisplayValueText({ value }) {
|
|
9
|
-
|
|
10
|
-
return _jsx("p", { className: displayValueClassName, children: value });
|
|
9
|
+
function DisplayValueText({ value, className, }) {
|
|
10
|
+
return _jsx("p", { className: cn("text-gray-400 grow", className), children: value });
|
|
11
11
|
}
|
|
12
|
-
function DisplayValue({ value, }) {
|
|
12
|
+
function DisplayValue({ value, className, }) {
|
|
13
13
|
const [loaded, setLoaded] = useState(false);
|
|
14
14
|
const cancelSetValueRef = useRef(false);
|
|
15
15
|
useEffect(() => {
|
|
@@ -34,22 +34,20 @@ function DisplayValue({ value, }) {
|
|
|
34
34
|
return _jsx(KeyValueFallbackSkeleton, {});
|
|
35
35
|
}
|
|
36
36
|
else if (typeof value === "string") {
|
|
37
|
-
return _jsx(DisplayValueText, { value: value });
|
|
37
|
+
return _jsx(DisplayValueText, { value: value, className: className });
|
|
38
38
|
}
|
|
39
39
|
else if (!loaded) {
|
|
40
40
|
return _jsx(KeyValueFallbackSkeleton, {});
|
|
41
41
|
}
|
|
42
42
|
else {
|
|
43
|
-
return _jsx(DisplayValueText, { value: loaded });
|
|
43
|
+
return _jsx(DisplayValueText, { value: loaded, className: className });
|
|
44
44
|
}
|
|
45
45
|
}
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
}
|
|
52
|
-
return (_jsx(ValueWithLabel, { children: _jsx(DisplayValue, { value: value }) }));
|
|
46
|
+
function ValueWithLabel({ label, className, labelClassName, children, }) {
|
|
47
|
+
return (_jsxs("div", { className: cn("grow w-full flex flex-row items-center justify-start gap-4", className), children: [_jsxs("p", { className: cn("text-lg font-bold", labelClassName), children: [label, ":"] }), children] }));
|
|
48
|
+
}
|
|
49
|
+
export function KeyValueWithSkeleton({ label, value, className, labelClassName, valueClassName, }) {
|
|
50
|
+
return (_jsx(ValueWithLabel, { label: label, className: className, labelClassName: labelClassName, children: _jsx(DisplayValue, { value: value, className: valueClassName }) }));
|
|
53
51
|
}
|
|
54
52
|
export default KeyValueWithSkeleton;
|
|
55
53
|
//# sourceMappingURL=key-value-with-skeleton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"key-value-with-skeleton.js","sourceRoot":"","sources":["../../../../src/components/ui/key-value-with-skeleton/key-value-with-skeleton.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACpD,OAAO,EAIL,QAAQ,EACR,SAAS,EACT,MAAM,GACP,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"key-value-with-skeleton.js","sourceRoot":"","sources":["../../../../src/components/ui/key-value-with-skeleton/key-value-with-skeleton.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACpD,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAIL,QAAQ,EACR,SAAS,EACT,MAAM,GACP,MAAM,OAAO,CAAC;AAUf,SAAS,wBAAwB;IAC/B,OAAO,CACL,KAAC,QAAQ,IAAC,SAAS,EAAC,8DAA8D,GAAG,CACtF,CAAC;AACJ,CAAC;AAED,SAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,SAAS,GAIV;IACC,OAAO,YAAG,SAAS,EAAE,EAAE,CAAC,oBAAoB,EAAE,SAAS,CAAC,YAAG,KAAK,GAAK,CAAC;AACxE,CAAC;AAED,SAAS,YAAY,CAAC,EACpB,KAAK,EACL,SAAS,GAIV;IACC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAiB,KAAK,CAAC,CAAC;IAC5D,MAAM,iBAAiB,GAAG,MAAM,CAAU,KAAK,CAAC,CAAC;IAEjD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,KAAK;YAAE,OAAO;QACnB,IAAI,CAAC,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;YACzC,KAAK,UAAU,0BAA0B;gBACvC,OAAO,MAAO,KAAyB,CAAC;YAC1C,CAAC;YACD,0BAA0B,EAAE,CAAC,IAAI,CAAC,CAAC,GAAW,EAAE,EAAE;gBAChD,MAAM,iBAAiB,GAAY,iBAAiB,CAAC,OAAO,CAAC;gBAC7D,IAAI,CAAC,iBAAiB,EAAE,CAAC;oBACvB,SAAS,CAAC,GAAG,CAAC,CAAC;gBACjB,CAAC;YACH,CAAC,CAAC,CAAC;YAEH,OAAO,SAAS,WAAW;gBACzB,iBAAiB,CAAC,OAAO,GAAG,IAAI,CAAC;YACnC,CAAC,CAAC;QACJ,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,OAAO,KAAK,KAAK,WAAW,EAAE,CAAC;QACjC,OAAO,KAAC,wBAAwB,KAAG,CAAC;IACtC,CAAC;SAAM,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;QACrC,OAAO,KAAC,gBAAgB,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;IAClE,CAAC;SAAM,IAAI,CAAC,MAAM,EAAE,CAAC;QACnB,OAAO,KAAC,wBAAwB,KAAG,CAAC;IACtC,CAAC;SAAM,CAAC;QACN,OAAO,KAAC,gBAAgB,IAAC,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;IACnE,CAAC;AACH,CAAC;AAED,SAAS,cAAc,CAAC,EACtB,KAAK,EACL,SAAS,EACT,cAAc,EACd,QAAQ,GAKR;IACA,OAAO,CACL,eACE,SAAS,EAAE,EAAE,CACX,4DAA4D,EAC5D,SAAS,CACV,aAED,aAAG,SAAS,EAAE,EAAE,CAAC,mBAAmB,EAAE,cAAc,CAAC,aAAG,KAAK,SAAM,EAClE,QAAQ,IACL,CACP,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,oBAAoB,CAAC,EACnC,KAAK,EACL,KAAK,EACL,SAAS,EACT,cAAc,EACd,cAAc,GACY;IAC1B,OAAO,CACL,KAAC,cAAc,IACb,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,YAE9B,KAAC,YAAY,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,cAAc,GAAI,GAC1C,CAClB,CAAC;AACJ,CAAC;AAED,eAAe,oBAAoB,CAAC"}
|