@schemavaults/ui 0.64.0 → 0.65.0
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.
- package/dist/components/ui/index.d.ts +2 -0
- package/dist/components/ui/index.js +1 -0
- package/dist/components/ui/index.js.map +1 -1
- package/dist/components/ui/secret-reveal/index.d.ts +4 -0
- package/dist/components/ui/secret-reveal/index.js +3 -0
- package/dist/components/ui/secret-reveal/index.js.map +1 -0
- package/dist/components/ui/secret-reveal/secret-reveal-variants.d.ts +6 -0
- package/dist/components/ui/secret-reveal/secret-reveal-variants.js +18 -0
- package/dist/components/ui/secret-reveal/secret-reveal-variants.js.map +1 -0
- package/dist/components/ui/secret-reveal/secret-reveal.d.ts +52 -0
- package/dist/components/ui/secret-reveal/secret-reveal.js +142 -0
- package/dist/components/ui/secret-reveal/secret-reveal.js.map +1 -0
- package/package.json +1 -1
|
@@ -138,6 +138,8 @@ export * from "./number-input";
|
|
|
138
138
|
export type * from "./number-input";
|
|
139
139
|
export * from "./code-block";
|
|
140
140
|
export type * from "./code-block";
|
|
141
|
+
export * from "./secret-reveal";
|
|
142
|
+
export type * from "./secret-reveal";
|
|
141
143
|
export * from "./json-viewer";
|
|
142
144
|
export type * from "./json-viewer";
|
|
143
145
|
export * from "./segmented-control";
|
|
@@ -68,6 +68,7 @@ export * from "./timeline";
|
|
|
68
68
|
export * from "./rating";
|
|
69
69
|
export * from "./number-input";
|
|
70
70
|
export * from "./code-block";
|
|
71
|
+
export * from "./secret-reveal";
|
|
71
72
|
export * from "./json-viewer";
|
|
72
73
|
export * from "./segmented-control";
|
|
73
74
|
export * from "./marquee";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ui/index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ui/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export { SecretReveal, SecretReveal as default, secretRevealVariants, } from "./secret-reveal";
|
|
2
|
+
export type { SecretRevealProps } from "./secret-reveal";
|
|
3
|
+
export { secretRevealVariantIds, secretRevealSizeIds, secretRevealMaskStyleIds, } from "./secret-reveal-variants";
|
|
4
|
+
export type { SecretRevealVariant, SecretRevealSize, SecretRevealMaskStyle, } from "./secret-reveal-variants";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ui/secret-reveal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,YAAY,EACZ,YAAY,IAAI,OAAO,EACvB,oBAAoB,GACrB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EACL,sBAAsB,EACtB,mBAAmB,EACnB,wBAAwB,GACzB,MAAM,0BAA0B,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export declare const secretRevealVariantIds: readonly ["default", "outline", "subtle", "terminal", "brand"];
|
|
2
|
+
export type SecretRevealVariant = (typeof secretRevealVariantIds)[number];
|
|
3
|
+
export declare const secretRevealSizeIds: readonly ["sm", "md", "lg"];
|
|
4
|
+
export type SecretRevealSize = (typeof secretRevealSizeIds)[number];
|
|
5
|
+
export declare const secretRevealMaskStyleIds: readonly ["dots", "asterisks", "blur"];
|
|
6
|
+
export type SecretRevealMaskStyle = (typeof secretRevealMaskStyleIds)[number];
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export const secretRevealVariantIds = [
|
|
2
|
+
"default",
|
|
3
|
+
"outline",
|
|
4
|
+
"subtle",
|
|
5
|
+
"terminal",
|
|
6
|
+
"brand",
|
|
7
|
+
];
|
|
8
|
+
export const secretRevealSizeIds = [
|
|
9
|
+
"sm",
|
|
10
|
+
"md",
|
|
11
|
+
"lg",
|
|
12
|
+
];
|
|
13
|
+
export const secretRevealMaskStyleIds = [
|
|
14
|
+
"dots",
|
|
15
|
+
"asterisks",
|
|
16
|
+
"blur",
|
|
17
|
+
];
|
|
18
|
+
//# sourceMappingURL=secret-reveal-variants.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"secret-reveal-variants.js","sourceRoot":"","sources":["../../../../src/components/ui/secret-reveal/secret-reveal-variants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,sBAAsB,GAAG;IACpC,SAAS;IACT,SAAS;IACT,QAAQ;IACR,UAAU;IACV,OAAO;CAC6B,CAAC;AAGvC,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC,IAAI;IACJ,IAAI;IACJ,IAAI;CACgC,CAAC;AAGvC,MAAM,CAAC,MAAM,wBAAwB,GAAG;IACtC,MAAM;IACN,WAAW;IACX,MAAM;CAC8B,CAAC"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { type VariantProps } from "class-variance-authority";
|
|
2
|
+
import { type HTMLAttributes, type ReactElement, type ReactNode, type Ref } from "react";
|
|
3
|
+
import { type SecretRevealMaskStyle, type SecretRevealSize, type SecretRevealVariant, secretRevealMaskStyleIds, secretRevealSizeIds, secretRevealVariantIds } from "./secret-reveal-variants";
|
|
4
|
+
declare const secretRevealVariants: (props?: ({
|
|
5
|
+
variant?: "default" | "outline" | "subtle" | "terminal" | "brand" | null | undefined;
|
|
6
|
+
size?: "sm" | "lg" | "md" | null | undefined;
|
|
7
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
|
+
export interface SecretRevealProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange">, VariantProps<typeof secretRevealVariants> {
|
|
9
|
+
/** The sensitive value to display. */
|
|
10
|
+
value: string;
|
|
11
|
+
/** Controlled revealed state. */
|
|
12
|
+
revealed?: boolean;
|
|
13
|
+
/** Initial revealed state when uncontrolled. */
|
|
14
|
+
defaultRevealed?: boolean;
|
|
15
|
+
/** Called when the revealed state changes. */
|
|
16
|
+
onRevealChange?: (revealed: boolean) => void;
|
|
17
|
+
/**
|
|
18
|
+
* Whether the value should be re-masked automatically after revealing.
|
|
19
|
+
* When a number is provided, that's the timeout (in ms) before re-masking.
|
|
20
|
+
* Pass `false` (default) to disable.
|
|
21
|
+
*/
|
|
22
|
+
autoHideAfter?: number | false;
|
|
23
|
+
/** Mask character style. Defaults to "dots". */
|
|
24
|
+
maskStyle?: SecretRevealMaskStyle;
|
|
25
|
+
/**
|
|
26
|
+
* Controls how the mask is sized:
|
|
27
|
+
* - "match" (default): one mask character per real character — leaks length.
|
|
28
|
+
* - "fixed": always renders 8 mask characters — hides length.
|
|
29
|
+
* - A number: render that many mask characters.
|
|
30
|
+
*/
|
|
31
|
+
maskLength?: number | "match" | "fixed";
|
|
32
|
+
/** Whether to render the built-in copy button. Defaults to true. */
|
|
33
|
+
showCopyButton?: boolean;
|
|
34
|
+
/** Whether to render the reveal/hide toggle button. Defaults to true. */
|
|
35
|
+
showRevealToggle?: boolean;
|
|
36
|
+
/** Optional label rendered to the left of the value. */
|
|
37
|
+
label?: ReactNode;
|
|
38
|
+
/** Accessible label for the reveal toggle button when masked. */
|
|
39
|
+
revealAriaLabel?: string;
|
|
40
|
+
/** Accessible label for the reveal toggle button when revealed. */
|
|
41
|
+
hideAriaLabel?: string;
|
|
42
|
+
/** Optional node rendered before the action buttons (e.g. an indicator). */
|
|
43
|
+
trailing?: ReactNode;
|
|
44
|
+
ref?: Ref<HTMLDivElement>;
|
|
45
|
+
}
|
|
46
|
+
declare function SecretReveal({ value, variant, size, revealed: revealedProp, defaultRevealed, onRevealChange, autoHideAfter, maskStyle, maskLength, showCopyButton, showRevealToggle, label, revealAriaLabel, hideAriaLabel, trailing, className, ref, ...props }: SecretRevealProps): ReactElement;
|
|
47
|
+
declare namespace SecretReveal {
|
|
48
|
+
var displayName: string;
|
|
49
|
+
}
|
|
50
|
+
export { SecretReveal, secretRevealVariants, secretRevealSizeIds, secretRevealVariantIds, secretRevealMaskStyleIds, };
|
|
51
|
+
export type { SecretRevealSize, SecretRevealVariant, SecretRevealMaskStyle };
|
|
52
|
+
export default SecretReveal;
|
|
@@ -0,0 +1,142 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { cva } from "class-variance-authority";
|
|
4
|
+
import { Eye, EyeOff } from "lucide-react";
|
|
5
|
+
import { useCallback, useEffect, useMemo, useRef, useState, } from "react";
|
|
6
|
+
import { cn } from "../../../lib/utils";
|
|
7
|
+
import { CopyButton } from "../../ui/copy-button";
|
|
8
|
+
import { secretRevealMaskStyleIds, secretRevealSizeIds, secretRevealVariantIds, } from "./secret-reveal-variants";
|
|
9
|
+
const secretRevealVariants = cva("group/secret-reveal inline-flex w-full items-center gap-1 rounded-md border font-mono transition-colors", {
|
|
10
|
+
variants: {
|
|
11
|
+
variant: {
|
|
12
|
+
default: "border-border bg-muted text-foreground",
|
|
13
|
+
outline: "border-input bg-background text-foreground",
|
|
14
|
+
subtle: "border-transparent bg-muted/60 text-muted-foreground hover:text-foreground",
|
|
15
|
+
terminal: "border-zinc-800 bg-zinc-950 text-zinc-100 dark:border-zinc-700",
|
|
16
|
+
brand: "border-schemavaults-brand-blue/30 bg-schemavaults-brand-blue/5 text-foreground",
|
|
17
|
+
},
|
|
18
|
+
size: {
|
|
19
|
+
sm: "h-8 px-2 text-xs gap-1",
|
|
20
|
+
md: "h-9 px-2.5 text-sm gap-1.5",
|
|
21
|
+
lg: "h-11 px-3 text-base gap-2",
|
|
22
|
+
},
|
|
23
|
+
},
|
|
24
|
+
defaultVariants: {
|
|
25
|
+
variant: "default",
|
|
26
|
+
size: "md",
|
|
27
|
+
},
|
|
28
|
+
});
|
|
29
|
+
const secretRevealValueVariants = cva("flex-1 truncate select-all tabular-nums", {
|
|
30
|
+
variants: {
|
|
31
|
+
masked: {
|
|
32
|
+
true: "select-none",
|
|
33
|
+
false: "",
|
|
34
|
+
},
|
|
35
|
+
maskStyle: {
|
|
36
|
+
dots: "",
|
|
37
|
+
asterisks: "",
|
|
38
|
+
blur: "",
|
|
39
|
+
},
|
|
40
|
+
},
|
|
41
|
+
compoundVariants: [
|
|
42
|
+
{
|
|
43
|
+
masked: true,
|
|
44
|
+
maskStyle: "blur",
|
|
45
|
+
class: "blur-sm transition-[filter] duration-200",
|
|
46
|
+
},
|
|
47
|
+
],
|
|
48
|
+
defaultVariants: {
|
|
49
|
+
masked: true,
|
|
50
|
+
maskStyle: "dots",
|
|
51
|
+
},
|
|
52
|
+
});
|
|
53
|
+
const secretRevealActionVariants = cva("inline-flex shrink-0 items-center justify-center rounded-md text-muted-foreground ring-offset-background transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 disabled:pointer-events-none disabled:opacity-50", {
|
|
54
|
+
variants: {
|
|
55
|
+
size: {
|
|
56
|
+
sm: "h-6 w-6 [&_svg]:size-3.5",
|
|
57
|
+
md: "h-7 w-7 [&_svg]:size-4",
|
|
58
|
+
lg: "h-8 w-8 [&_svg]:size-[18px]",
|
|
59
|
+
},
|
|
60
|
+
variant: {
|
|
61
|
+
default: "hover:bg-background/60",
|
|
62
|
+
outline: "hover:bg-accent",
|
|
63
|
+
subtle: "hover:bg-muted",
|
|
64
|
+
terminal: "text-zinc-400 hover:bg-zinc-800 hover:text-zinc-100",
|
|
65
|
+
brand: "hover:bg-schemavaults-brand-blue/10 hover:text-schemavaults-brand-blue",
|
|
66
|
+
},
|
|
67
|
+
},
|
|
68
|
+
defaultVariants: {
|
|
69
|
+
size: "md",
|
|
70
|
+
variant: "default",
|
|
71
|
+
},
|
|
72
|
+
});
|
|
73
|
+
function buildMaskString(value, maskStyle, maskLength) {
|
|
74
|
+
if (maskStyle === "blur")
|
|
75
|
+
return value;
|
|
76
|
+
const char = maskStyle === "asterisks" ? "*" : "•";
|
|
77
|
+
if (maskLength === "match")
|
|
78
|
+
return char.repeat(value.length);
|
|
79
|
+
if (maskLength === "fixed")
|
|
80
|
+
return char.repeat(8);
|
|
81
|
+
return char.repeat(Math.max(0, maskLength));
|
|
82
|
+
}
|
|
83
|
+
function SecretReveal({ value, variant, size, revealed: revealedProp, defaultRevealed = false, onRevealChange, autoHideAfter = false, maskStyle = "dots", maskLength = "match", showCopyButton = true, showRevealToggle = true, label, revealAriaLabel = "Reveal secret", hideAriaLabel = "Hide secret", trailing, className, ref, ...props }) {
|
|
84
|
+
const isControlled = revealedProp !== undefined;
|
|
85
|
+
const [internalRevealed, setInternalRevealed] = useState(defaultRevealed);
|
|
86
|
+
const revealed = isControlled
|
|
87
|
+
? revealedProp
|
|
88
|
+
: internalRevealed;
|
|
89
|
+
const autoHideTimer = useRef(null);
|
|
90
|
+
const clearAutoHide = useCallback(() => {
|
|
91
|
+
if (autoHideTimer.current !== null) {
|
|
92
|
+
clearTimeout(autoHideTimer.current);
|
|
93
|
+
autoHideTimer.current = null;
|
|
94
|
+
}
|
|
95
|
+
}, []);
|
|
96
|
+
useEffect(() => {
|
|
97
|
+
return () => {
|
|
98
|
+
clearAutoHide();
|
|
99
|
+
};
|
|
100
|
+
}, [clearAutoHide]);
|
|
101
|
+
const setRevealed = useCallback((next) => {
|
|
102
|
+
if (!isControlled)
|
|
103
|
+
setInternalRevealed(next);
|
|
104
|
+
onRevealChange?.(next);
|
|
105
|
+
}, [isControlled, onRevealChange]);
|
|
106
|
+
useEffect(() => {
|
|
107
|
+
clearAutoHide();
|
|
108
|
+
if (revealed &&
|
|
109
|
+
typeof autoHideAfter === "number" &&
|
|
110
|
+
autoHideAfter > 0) {
|
|
111
|
+
autoHideTimer.current = setTimeout(() => {
|
|
112
|
+
setRevealed(false);
|
|
113
|
+
autoHideTimer.current = null;
|
|
114
|
+
}, autoHideAfter);
|
|
115
|
+
}
|
|
116
|
+
}, [revealed, autoHideAfter, clearAutoHide, setRevealed]);
|
|
117
|
+
const handleToggle = useCallback(() => {
|
|
118
|
+
setRevealed(!revealed);
|
|
119
|
+
}, [revealed, setRevealed]);
|
|
120
|
+
const resolvedVariant = variant ?? "default";
|
|
121
|
+
const resolvedSize = size ?? "md";
|
|
122
|
+
const displayedValue = useMemo(() => {
|
|
123
|
+
if (revealed)
|
|
124
|
+
return value;
|
|
125
|
+
return buildMaskString(value, maskStyle, maskLength);
|
|
126
|
+
}, [revealed, value, maskStyle, maskLength]);
|
|
127
|
+
const ToggleIcon = revealed ? EyeOff : Eye;
|
|
128
|
+
const toggleAriaLabel = revealed ? hideAriaLabel : revealAriaLabel;
|
|
129
|
+
return (_jsxs("div", { ref: ref, "data-slot": "secret-reveal", "data-variant": resolvedVariant, "data-revealed": revealed ? "true" : "false", className: cn(secretRevealVariants({ variant, size }), className), ...props, children: [label !== undefined && label !== null ? (_jsx("span", { "data-slot": "secret-reveal-label", className: "shrink-0 select-none pr-1 font-sans font-medium opacity-80", children: label })) : null, _jsx("span", { "data-slot": "secret-reveal-value", "aria-live": "polite", "aria-label": revealed ? "Revealed secret value" : "Masked secret value", className: cn(secretRevealValueVariants({
|
|
130
|
+
masked: !revealed,
|
|
131
|
+
maskStyle,
|
|
132
|
+
})), children: displayedValue }), trailing, showRevealToggle ? (_jsx("button", { type: "button", "data-slot": "secret-reveal-toggle", "aria-pressed": revealed, "aria-label": toggleAriaLabel, onClick: handleToggle, className: cn(secretRevealActionVariants({
|
|
133
|
+
size: resolvedSize,
|
|
134
|
+
variant: resolvedVariant,
|
|
135
|
+
})), children: _jsx(ToggleIcon, { "aria-hidden": "true" }) })) : null, showCopyButton ? (_jsx(CopyButton, { value: value, variant: "ghost", size: resolvedSize === "lg" ? "icon-md" : "icon-sm", className: cn(resolvedVariant === "terminal" &&
|
|
136
|
+
"text-zinc-300 hover:bg-zinc-800 hover:text-zinc-100 data-[copied=true]:text-green-400", resolvedVariant === "brand" &&
|
|
137
|
+
"hover:text-schemavaults-brand-blue data-[copied=true]:text-schemavaults-brand-blue") })) : null] }));
|
|
138
|
+
}
|
|
139
|
+
SecretReveal.displayName = "SecretReveal";
|
|
140
|
+
export { SecretReveal, secretRevealVariants, secretRevealSizeIds, secretRevealVariantIds, secretRevealMaskStyleIds, };
|
|
141
|
+
export default SecretReveal;
|
|
142
|
+
//# sourceMappingURL=secret-reveal.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"secret-reveal.js","sourceRoot":"","sources":["../../../../src/components/ui/secret-reveal/secret-reveal.tsx"],"names":[],"mappings":"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"}
|