@zentauri-ui/zentauri-components 1.8.0 → 1.8.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.
- package/README.md +8 -4
- package/cli/registry.json +2 -0
- package/dist/chunk-7TGUGTTQ.mjs +147 -0
- package/dist/chunk-7TGUGTTQ.mjs.map +1 -0
- package/dist/chunk-CQMV7BB6.js +50 -0
- package/dist/chunk-CQMV7BB6.js.map +1 -0
- package/dist/chunk-DN7TYUJ6.js +119 -0
- package/dist/chunk-DN7TYUJ6.js.map +1 -0
- package/dist/chunk-ODBG4Y6R.mjs +48 -0
- package/dist/chunk-ODBG4Y6R.mjs.map +1 -0
- package/dist/chunk-RKX5MERK.js +150 -0
- package/dist/chunk-RKX5MERK.js.map +1 -0
- package/dist/chunk-VYI3GS2C.mjs +115 -0
- package/dist/chunk-VYI3GS2C.mjs.map +1 -0
- package/dist/design-system/copy-button.d.ts +43 -0
- package/dist/design-system/copy-button.d.ts.map +1 -0
- package/dist/design-system/index.d.ts +2 -0
- package/dist/design-system/index.d.ts.map +1 -1
- package/dist/design-system/kbd.d.ts +44 -0
- package/dist/design-system/kbd.d.ts.map +1 -0
- package/dist/hooks/useClipboard.js +6 -44
- package/dist/hooks/useClipboard.js.map +1 -1
- package/dist/hooks/useClipboard.mjs +1 -46
- package/dist/hooks/useClipboard.mjs.map +1 -1
- package/dist/ui/copy-button/animated/animations.d.ts +3 -0
- package/dist/ui/copy-button/animated/animations.d.ts.map +1 -0
- package/dist/ui/copy-button/animated/copy-button-animated.d.ts +6 -0
- package/dist/ui/copy-button/animated/copy-button-animated.d.ts.map +1 -0
- package/dist/ui/copy-button/animated/index.d.ts +4 -0
- package/dist/ui/copy-button/animated/index.d.ts.map +1 -0
- package/dist/ui/copy-button/animated/types.d.ts +26 -0
- package/dist/ui/copy-button/animated/types.d.ts.map +1 -0
- package/dist/ui/copy-button/animated.js +59 -0
- package/dist/ui/copy-button/animated.js.map +1 -0
- package/dist/ui/copy-button/animated.mjs +56 -0
- package/dist/ui/copy-button/animated.mjs.map +1 -0
- package/dist/ui/copy-button/copy-button-base.d.ts +6 -0
- package/dist/ui/copy-button/copy-button-base.d.ts.map +1 -0
- package/dist/ui/copy-button/copy-button.d.ts +6 -0
- package/dist/ui/copy-button/copy-button.d.ts.map +1 -0
- package/dist/ui/copy-button/index.d.ts +4 -0
- package/dist/ui/copy-button/index.d.ts.map +1 -0
- package/dist/ui/copy-button/types.d.ts +32 -0
- package/dist/ui/copy-button/types.d.ts.map +1 -0
- package/dist/ui/copy-button/variants.d.ts +6 -0
- package/dist/ui/copy-button/variants.d.ts.map +1 -0
- package/dist/ui/copy-button.js +20 -0
- package/dist/ui/copy-button.js.map +1 -0
- package/dist/ui/copy-button.mjs +15 -0
- package/dist/ui/copy-button.mjs.map +1 -0
- package/dist/ui/kbd/animated/animations.d.ts +3 -0
- package/dist/ui/kbd/animated/animations.d.ts.map +1 -0
- package/dist/ui/kbd/animated/index.d.ts +4 -0
- package/dist/ui/kbd/animated/index.d.ts.map +1 -0
- package/dist/ui/kbd/animated/kbd-animated.d.ts +6 -0
- package/dist/ui/kbd/animated/kbd-animated.d.ts.map +1 -0
- package/dist/ui/kbd/animated/types.d.ts +10 -0
- package/dist/ui/kbd/animated/types.d.ts.map +1 -0
- package/dist/ui/kbd/animated.js +42 -0
- package/dist/ui/kbd/animated.js.map +1 -0
- package/dist/ui/kbd/animated.mjs +39 -0
- package/dist/ui/kbd/animated.mjs.map +1 -0
- package/dist/ui/kbd/index.d.ts +4 -0
- package/dist/ui/kbd/index.d.ts.map +1 -0
- package/dist/ui/kbd/kbd-base.d.ts +6 -0
- package/dist/ui/kbd/kbd-base.d.ts.map +1 -0
- package/dist/ui/kbd/kbd.d.ts +6 -0
- package/dist/ui/kbd/kbd.d.ts.map +1 -0
- package/dist/ui/kbd/types.d.ts +17 -0
- package/dist/ui/kbd/types.d.ts.map +1 -0
- package/dist/ui/kbd/variants.d.ts +8 -0
- package/dist/ui/kbd/variants.d.ts.map +1 -0
- package/dist/ui/kbd.js +23 -0
- package/dist/ui/kbd.js.map +1 -0
- package/dist/ui/kbd.mjs +14 -0
- package/dist/ui/kbd.mjs.map +1 -0
- package/package.json +1 -1
- package/src/design-system/copy-button.ts +81 -0
- package/src/design-system/index.ts +2 -0
- package/src/design-system/kbd.ts +83 -0
- package/src/ui/copy-button/animated/animations.ts +22 -0
- package/src/ui/copy-button/animated/copy-button-animated.tsx +39 -0
- package/src/ui/copy-button/animated/index.ts +10 -0
- package/src/ui/copy-button/animated/types.ts +21 -0
- package/src/ui/copy-button/copy-button-base.tsx +88 -0
- package/src/ui/copy-button/copy-button.test.tsx +82 -0
- package/src/ui/copy-button/copy-button.tsx +9 -0
- package/src/ui/copy-button/index.ts +10 -0
- package/src/ui/copy-button/types.ts +37 -0
- package/src/ui/copy-button/variants.ts +29 -0
- package/src/ui/kbd/animated/animations.ts +15 -0
- package/src/ui/kbd/animated/index.ts +9 -0
- package/src/ui/kbd/animated/kbd-animated.tsx +26 -0
- package/src/ui/kbd/animated/types.ts +16 -0
- package/src/ui/kbd/index.ts +5 -0
- package/src/ui/kbd/kbd-base.tsx +50 -0
- package/src/ui/kbd/kbd.test.tsx +48 -0
- package/src/ui/kbd/kbd.tsx +9 -0
- package/src/ui/kbd/types.ts +21 -0
- package/src/ui/kbd/variants.ts +31 -0
|
@@ -1,49 +1,4 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
// src/hooks/useClipboard/useClipboard.ts
|
|
5
|
-
function useClipboard(resetDelay = 2e3) {
|
|
6
|
-
const [copied, setCopied] = useState(false);
|
|
7
|
-
const [error, setError] = useState(void 0);
|
|
8
|
-
const timeoutRef = useRef(
|
|
9
|
-
void 0
|
|
10
|
-
);
|
|
11
|
-
const reset = useCallback(() => {
|
|
12
|
-
if (timeoutRef.current) {
|
|
13
|
-
clearTimeout(timeoutRef.current);
|
|
14
|
-
timeoutRef.current = void 0;
|
|
15
|
-
}
|
|
16
|
-
setCopied(false);
|
|
17
|
-
setError(void 0);
|
|
18
|
-
}, []);
|
|
19
|
-
const copy = useCallback(
|
|
20
|
-
async (text) => {
|
|
21
|
-
reset();
|
|
22
|
-
if (typeof navigator === "undefined" || !navigator.clipboard?.writeText) {
|
|
23
|
-
const err = new Error("Clipboard API is not available");
|
|
24
|
-
setError(err);
|
|
25
|
-
return false;
|
|
26
|
-
}
|
|
27
|
-
try {
|
|
28
|
-
await navigator.clipboard.writeText(text);
|
|
29
|
-
setCopied(true);
|
|
30
|
-
if (resetDelay > 0) {
|
|
31
|
-
timeoutRef.current = setTimeout(() => {
|
|
32
|
-
setCopied(false);
|
|
33
|
-
}, resetDelay);
|
|
34
|
-
}
|
|
35
|
-
return true;
|
|
36
|
-
} catch (cause) {
|
|
37
|
-
const err = cause instanceof Error ? cause : new Error(String(cause));
|
|
38
|
-
setError(err);
|
|
39
|
-
return false;
|
|
40
|
-
}
|
|
41
|
-
},
|
|
42
|
-
[reset, resetDelay]
|
|
43
|
-
);
|
|
44
|
-
return { copied, error, copy, reset };
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
export { useClipboard };
|
|
2
|
+
export { useClipboard } from '../chunk-ODBG4Y6R.mjs';
|
|
48
3
|
//# sourceMappingURL=useClipboard.mjs.map
|
|
49
4
|
//# sourceMappingURL=useClipboard.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"useClipboard.mjs"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"animations.d.ts","sourceRoot":"","sources":["../../../../src/ui/copy-button/animated/animations.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,SAAS,CAAC;AAE1D,eAAO,MAAM,0BAA0B,EAAE,0BAmBxC,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { CopyButtonAnimatedProps } from "./types";
|
|
2
|
+
export declare function CopyButtonAnimated({ animation, ...props }: CopyButtonAnimatedProps): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
export declare namespace CopyButtonAnimated {
|
|
4
|
+
var displayName: string;
|
|
5
|
+
}
|
|
6
|
+
//# sourceMappingURL=copy-button-animated.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"copy-button-animated.d.ts","sourceRoot":"","sources":["../../../../src/ui/copy-button/animated/copy-button-animated.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAEvD,wBAAgB,kBAAkB,CAAC,EACjC,SAAkB,EAClB,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAuBzB;yBA1Be,kBAAkB"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export { CopyButtonAnimated } from "./copy-button-animated";
|
|
2
|
+
export { copyButtonAnimationPresets } from "./animations";
|
|
3
|
+
export type { CopyButtonAnimatedProps, CopyButtonAnimation, CopyButtonAnimationPreset, CopyButtonAnimationPresets, } from "./types";
|
|
4
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ui/copy-button/animated/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAC1D,YAAY,EACV,uBAAuB,EACvB,mBAAmB,EACnB,yBAAyB,EACzB,0BAA0B,GAC3B,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import type { Transition } from "framer-motion";
|
|
2
|
+
import type { CopyButtonProps } from "../types";
|
|
3
|
+
export type CopyButtonAnimation = "swap" | "pop" | "fade";
|
|
4
|
+
export type CopyButtonAnimatedProps = CopyButtonProps & {
|
|
5
|
+
animation?: CopyButtonAnimation;
|
|
6
|
+
};
|
|
7
|
+
export type CopyButtonAnimationPreset = {
|
|
8
|
+
initial: {
|
|
9
|
+
opacity: number;
|
|
10
|
+
scale: number;
|
|
11
|
+
rotate: number;
|
|
12
|
+
};
|
|
13
|
+
animate: {
|
|
14
|
+
opacity: number;
|
|
15
|
+
scale: number;
|
|
16
|
+
rotate: number;
|
|
17
|
+
};
|
|
18
|
+
exit: {
|
|
19
|
+
opacity: number;
|
|
20
|
+
scale: number;
|
|
21
|
+
rotate: number;
|
|
22
|
+
};
|
|
23
|
+
transition: Transition;
|
|
24
|
+
};
|
|
25
|
+
export type CopyButtonAnimationPresets = Record<CopyButtonAnimation, CopyButtonAnimationPreset>;
|
|
26
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/ui/copy-button/animated/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAEhD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAEhD,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,CAAC;AAE1D,MAAM,MAAM,uBAAuB,GAAG,eAAe,GAAG;IACtD,SAAS,CAAC,EAAE,mBAAmB,CAAC;CACjC,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG;IACtC,OAAO,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IAC5D,OAAO,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IAC5D,IAAI,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACzD,UAAU,EAAE,UAAU,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG,MAAM,CAC7C,mBAAmB,EACnB,yBAAyB,CAC1B,CAAC"}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
var chunkRKX5MERK_js = require('../../chunk-RKX5MERK.js');
|
|
5
|
+
require('../../chunk-CQMV7BB6.js');
|
|
6
|
+
require('../../chunk-ZS5756ZC.js');
|
|
7
|
+
var framerMotion = require('framer-motion');
|
|
8
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
9
|
+
|
|
10
|
+
// src/ui/copy-button/animated/animations.ts
|
|
11
|
+
var copyButtonAnimationPresets = {
|
|
12
|
+
swap: {
|
|
13
|
+
initial: { opacity: 0, scale: 0.6, rotate: -45 },
|
|
14
|
+
animate: { opacity: 1, scale: 1, rotate: 0 },
|
|
15
|
+
exit: { opacity: 0, scale: 0.6, rotate: 45 },
|
|
16
|
+
transition: { type: "spring", stiffness: 520, damping: 24 }
|
|
17
|
+
},
|
|
18
|
+
pop: {
|
|
19
|
+
initial: { opacity: 0, scale: 0.4, rotate: 0 },
|
|
20
|
+
animate: { opacity: 1, scale: 1, rotate: 0 },
|
|
21
|
+
exit: { opacity: 0, scale: 0.4, rotate: 0 },
|
|
22
|
+
transition: { type: "spring", stiffness: 600, damping: 20 }
|
|
23
|
+
},
|
|
24
|
+
fade: {
|
|
25
|
+
initial: { opacity: 0, scale: 1, rotate: 0 },
|
|
26
|
+
animate: { opacity: 1, scale: 1, rotate: 0 },
|
|
27
|
+
exit: { opacity: 0, scale: 1, rotate: 0 },
|
|
28
|
+
transition: { duration: 0.16 }
|
|
29
|
+
}
|
|
30
|
+
};
|
|
31
|
+
function CopyButtonAnimated({
|
|
32
|
+
animation = "swap",
|
|
33
|
+
...props
|
|
34
|
+
}) {
|
|
35
|
+
const preset = copyButtonAnimationPresets[animation];
|
|
36
|
+
const renderIcon = ({
|
|
37
|
+
copied,
|
|
38
|
+
copyIcon,
|
|
39
|
+
copiedIcon
|
|
40
|
+
}) => /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { initial: false, mode: "wait", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
41
|
+
framerMotion.motion.span,
|
|
42
|
+
{
|
|
43
|
+
className: "inline-flex items-center justify-center",
|
|
44
|
+
initial: preset.initial,
|
|
45
|
+
animate: preset.animate,
|
|
46
|
+
exit: preset.exit,
|
|
47
|
+
transition: preset.transition,
|
|
48
|
+
children: copied ? copiedIcon : copyIcon
|
|
49
|
+
},
|
|
50
|
+
copied ? "copied" : "idle"
|
|
51
|
+
) });
|
|
52
|
+
return /* @__PURE__ */ jsxRuntime.jsx(chunkRKX5MERK_js.CopyButtonBase, { ...props, renderIcon });
|
|
53
|
+
}
|
|
54
|
+
CopyButtonAnimated.displayName = "CopyButtonAnimated";
|
|
55
|
+
|
|
56
|
+
exports.CopyButtonAnimated = CopyButtonAnimated;
|
|
57
|
+
exports.copyButtonAnimationPresets = copyButtonAnimationPresets;
|
|
58
|
+
//# sourceMappingURL=animated.js.map
|
|
59
|
+
//# sourceMappingURL=animated.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/ui/copy-button/animated/animations.ts","../../../src/ui/copy-button/animated/copy-button-animated.tsx"],"names":["jsx","AnimatePresence","motion","CopyButtonBase"],"mappings":";;;;;;;;;AAEO,IAAM,0BAAA,GAAyD;AAAA,EACpE,IAAA,EAAM;AAAA,IACJ,SAAS,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,GAAA,EAAK,QAAQ,GAAA,EAAI;AAAA,IAC/C,SAAS,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,CAAA,EAAG,QAAQ,CAAA,EAAE;AAAA,IAC3C,MAAM,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,GAAA,EAAK,QAAQ,EAAA,EAAG;AAAA,IAC3C,YAAY,EAAE,IAAA,EAAM,UAAU,SAAA,EAAW,GAAA,EAAK,SAAS,EAAA;AAAG,GAC5D;AAAA,EACA,GAAA,EAAK;AAAA,IACH,SAAS,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,GAAA,EAAK,QAAQ,CAAA,EAAE;AAAA,IAC7C,SAAS,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,CAAA,EAAG,QAAQ,CAAA,EAAE;AAAA,IAC3C,MAAM,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,GAAA,EAAK,QAAQ,CAAA,EAAE;AAAA,IAC1C,YAAY,EAAE,IAAA,EAAM,UAAU,SAAA,EAAW,GAAA,EAAK,SAAS,EAAA;AAAG,GAC5D;AAAA,EACA,IAAA,EAAM;AAAA,IACJ,SAAS,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,CAAA,EAAG,QAAQ,CAAA,EAAE;AAAA,IAC3C,SAAS,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,CAAA,EAAG,QAAQ,CAAA,EAAE;AAAA,IAC3C,MAAM,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,CAAA,EAAG,QAAQ,CAAA,EAAE;AAAA,IACxC,UAAA,EAAY,EAAE,QAAA,EAAU,IAAA;AAAK;AAEjC;ACXO,SAAS,kBAAA,CAAmB;AAAA,EACjC,SAAA,GAAY,MAAA;AAAA,EACZ,GAAG;AACL,CAAA,EAA4B;AAC1B,EAAA,MAAM,MAAA,GAAS,2BAA2B,SAAS,CAAA;AAEnD,EAAA,MAAM,aAAqC,CAAC;AAAA,IAC1C,MAAA;AAAA,IACA,QAAA;AAAA,IACA;AAAA,wBAEAA,cAAA,CAACC,4BAAA,EAAA,EAAgB,OAAA,EAAS,KAAA,EAAO,MAAK,MAAA,EACpC,QAAA,kBAAAD,cAAA;AAAA,IAACE,mBAAA,CAAO,IAAA;AAAA,IAAP;AAAA,MAEC,SAAA,EAAU,yCAAA;AAAA,MACV,SAAS,MAAA,CAAO,OAAA;AAAA,MAChB,SAAS,MAAA,CAAO,OAAA;AAAA,MAChB,MAAM,MAAA,CAAO,IAAA;AAAA,MACb,YAAY,MAAA,CAAO,UAAA;AAAA,MAElB,mBAAS,UAAA,GAAa;AAAA,KAAA;AAAA,IAPlB,SAAS,QAAA,GAAW;AAAA,GAQ3B,EACF,CAAA;AAGF,EAAA,uBAAOF,cAAA,CAACG,+BAAA,EAAA,EAAgB,GAAG,KAAA,EAAO,UAAA,EAAwB,CAAA;AAC5D;AAEA,kBAAA,CAAmB,WAAA,GAAc,oBAAA","file":"animated.js","sourcesContent":["import type { CopyButtonAnimationPresets } from \"./types\";\n\nexport const copyButtonAnimationPresets: CopyButtonAnimationPresets = {\n swap: {\n initial: { opacity: 0, scale: 0.6, rotate: -45 },\n animate: { opacity: 1, scale: 1, rotate: 0 },\n exit: { opacity: 0, scale: 0.6, rotate: 45 },\n transition: { type: \"spring\", stiffness: 520, damping: 24 },\n },\n pop: {\n initial: { opacity: 0, scale: 0.4, rotate: 0 },\n animate: { opacity: 1, scale: 1, rotate: 0 },\n exit: { opacity: 0, scale: 0.4, rotate: 0 },\n transition: { type: \"spring\", stiffness: 600, damping: 20 },\n },\n fade: {\n initial: { opacity: 0, scale: 1, rotate: 0 },\n animate: { opacity: 1, scale: 1, rotate: 0 },\n exit: { opacity: 0, scale: 1, rotate: 0 },\n transition: { duration: 0.16 },\n },\n};\n","\"use client\";\n\nimport { AnimatePresence, motion } from \"framer-motion\";\n\nimport { CopyButtonBase } from \"../copy-button-base\";\nimport type { CopyButtonIconRenderer } from \"../types\";\n\nimport { copyButtonAnimationPresets } from \"./animations\";\nimport type { CopyButtonAnimatedProps } from \"./types\";\n\nexport function CopyButtonAnimated({\n animation = \"swap\",\n ...props\n}: CopyButtonAnimatedProps) {\n const preset = copyButtonAnimationPresets[animation];\n\n const renderIcon: CopyButtonIconRenderer = ({\n copied,\n copyIcon,\n copiedIcon,\n }) => (\n <AnimatePresence initial={false} mode=\"wait\">\n <motion.span\n key={copied ? \"copied\" : \"idle\"}\n className=\"inline-flex items-center justify-center\"\n initial={preset.initial}\n animate={preset.animate}\n exit={preset.exit}\n transition={preset.transition}\n >\n {copied ? copiedIcon : copyIcon}\n </motion.span>\n </AnimatePresence>\n );\n\n return <CopyButtonBase {...props} renderIcon={renderIcon} />;\n}\n\nCopyButtonAnimated.displayName = \"CopyButtonAnimated\";\n"]}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { CopyButtonBase } from '../../chunk-7TGUGTTQ.mjs';
|
|
3
|
+
import '../../chunk-ODBG4Y6R.mjs';
|
|
4
|
+
import '../../chunk-4D54YOL6.mjs';
|
|
5
|
+
import { AnimatePresence, motion } from 'framer-motion';
|
|
6
|
+
import { jsx } from 'react/jsx-runtime';
|
|
7
|
+
|
|
8
|
+
// src/ui/copy-button/animated/animations.ts
|
|
9
|
+
var copyButtonAnimationPresets = {
|
|
10
|
+
swap: {
|
|
11
|
+
initial: { opacity: 0, scale: 0.6, rotate: -45 },
|
|
12
|
+
animate: { opacity: 1, scale: 1, rotate: 0 },
|
|
13
|
+
exit: { opacity: 0, scale: 0.6, rotate: 45 },
|
|
14
|
+
transition: { type: "spring", stiffness: 520, damping: 24 }
|
|
15
|
+
},
|
|
16
|
+
pop: {
|
|
17
|
+
initial: { opacity: 0, scale: 0.4, rotate: 0 },
|
|
18
|
+
animate: { opacity: 1, scale: 1, rotate: 0 },
|
|
19
|
+
exit: { opacity: 0, scale: 0.4, rotate: 0 },
|
|
20
|
+
transition: { type: "spring", stiffness: 600, damping: 20 }
|
|
21
|
+
},
|
|
22
|
+
fade: {
|
|
23
|
+
initial: { opacity: 0, scale: 1, rotate: 0 },
|
|
24
|
+
animate: { opacity: 1, scale: 1, rotate: 0 },
|
|
25
|
+
exit: { opacity: 0, scale: 1, rotate: 0 },
|
|
26
|
+
transition: { duration: 0.16 }
|
|
27
|
+
}
|
|
28
|
+
};
|
|
29
|
+
function CopyButtonAnimated({
|
|
30
|
+
animation = "swap",
|
|
31
|
+
...props
|
|
32
|
+
}) {
|
|
33
|
+
const preset = copyButtonAnimationPresets[animation];
|
|
34
|
+
const renderIcon = ({
|
|
35
|
+
copied,
|
|
36
|
+
copyIcon,
|
|
37
|
+
copiedIcon
|
|
38
|
+
}) => /* @__PURE__ */ jsx(AnimatePresence, { initial: false, mode: "wait", children: /* @__PURE__ */ jsx(
|
|
39
|
+
motion.span,
|
|
40
|
+
{
|
|
41
|
+
className: "inline-flex items-center justify-center",
|
|
42
|
+
initial: preset.initial,
|
|
43
|
+
animate: preset.animate,
|
|
44
|
+
exit: preset.exit,
|
|
45
|
+
transition: preset.transition,
|
|
46
|
+
children: copied ? copiedIcon : copyIcon
|
|
47
|
+
},
|
|
48
|
+
copied ? "copied" : "idle"
|
|
49
|
+
) });
|
|
50
|
+
return /* @__PURE__ */ jsx(CopyButtonBase, { ...props, renderIcon });
|
|
51
|
+
}
|
|
52
|
+
CopyButtonAnimated.displayName = "CopyButtonAnimated";
|
|
53
|
+
|
|
54
|
+
export { CopyButtonAnimated, copyButtonAnimationPresets };
|
|
55
|
+
//# sourceMappingURL=animated.mjs.map
|
|
56
|
+
//# sourceMappingURL=animated.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/ui/copy-button/animated/animations.ts","../../../src/ui/copy-button/animated/copy-button-animated.tsx"],"names":[],"mappings":";;;;;;;AAEO,IAAM,0BAAA,GAAyD;AAAA,EACpE,IAAA,EAAM;AAAA,IACJ,SAAS,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,GAAA,EAAK,QAAQ,GAAA,EAAI;AAAA,IAC/C,SAAS,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,CAAA,EAAG,QAAQ,CAAA,EAAE;AAAA,IAC3C,MAAM,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,GAAA,EAAK,QAAQ,EAAA,EAAG;AAAA,IAC3C,YAAY,EAAE,IAAA,EAAM,UAAU,SAAA,EAAW,GAAA,EAAK,SAAS,EAAA;AAAG,GAC5D;AAAA,EACA,GAAA,EAAK;AAAA,IACH,SAAS,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,GAAA,EAAK,QAAQ,CAAA,EAAE;AAAA,IAC7C,SAAS,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,CAAA,EAAG,QAAQ,CAAA,EAAE;AAAA,IAC3C,MAAM,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,GAAA,EAAK,QAAQ,CAAA,EAAE;AAAA,IAC1C,YAAY,EAAE,IAAA,EAAM,UAAU,SAAA,EAAW,GAAA,EAAK,SAAS,EAAA;AAAG,GAC5D;AAAA,EACA,IAAA,EAAM;AAAA,IACJ,SAAS,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,CAAA,EAAG,QAAQ,CAAA,EAAE;AAAA,IAC3C,SAAS,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,CAAA,EAAG,QAAQ,CAAA,EAAE;AAAA,IAC3C,MAAM,EAAE,OAAA,EAAS,GAAG,KAAA,EAAO,CAAA,EAAG,QAAQ,CAAA,EAAE;AAAA,IACxC,UAAA,EAAY,EAAE,QAAA,EAAU,IAAA;AAAK;AAEjC;ACXO,SAAS,kBAAA,CAAmB;AAAA,EACjC,SAAA,GAAY,MAAA;AAAA,EACZ,GAAG;AACL,CAAA,EAA4B;AAC1B,EAAA,MAAM,MAAA,GAAS,2BAA2B,SAAS,CAAA;AAEnD,EAAA,MAAM,aAAqC,CAAC;AAAA,IAC1C,MAAA;AAAA,IACA,QAAA;AAAA,IACA;AAAA,wBAEA,GAAA,CAAC,eAAA,EAAA,EAAgB,OAAA,EAAS,KAAA,EAAO,MAAK,MAAA,EACpC,QAAA,kBAAA,GAAA;AAAA,IAAC,MAAA,CAAO,IAAA;AAAA,IAAP;AAAA,MAEC,SAAA,EAAU,yCAAA;AAAA,MACV,SAAS,MAAA,CAAO,OAAA;AAAA,MAChB,SAAS,MAAA,CAAO,OAAA;AAAA,MAChB,MAAM,MAAA,CAAO,IAAA;AAAA,MACb,YAAY,MAAA,CAAO,UAAA;AAAA,MAElB,mBAAS,UAAA,GAAa;AAAA,KAAA;AAAA,IAPlB,SAAS,QAAA,GAAW;AAAA,GAQ3B,EACF,CAAA;AAGF,EAAA,uBAAO,GAAA,CAAC,cAAA,EAAA,EAAgB,GAAG,KAAA,EAAO,UAAA,EAAwB,CAAA;AAC5D;AAEA,kBAAA,CAAmB,WAAA,GAAc,oBAAA","file":"animated.mjs","sourcesContent":["import type { CopyButtonAnimationPresets } from \"./types\";\n\nexport const copyButtonAnimationPresets: CopyButtonAnimationPresets = {\n swap: {\n initial: { opacity: 0, scale: 0.6, rotate: -45 },\n animate: { opacity: 1, scale: 1, rotate: 0 },\n exit: { opacity: 0, scale: 0.6, rotate: 45 },\n transition: { type: \"spring\", stiffness: 520, damping: 24 },\n },\n pop: {\n initial: { opacity: 0, scale: 0.4, rotate: 0 },\n animate: { opacity: 1, scale: 1, rotate: 0 },\n exit: { opacity: 0, scale: 0.4, rotate: 0 },\n transition: { type: \"spring\", stiffness: 600, damping: 20 },\n },\n fade: {\n initial: { opacity: 0, scale: 1, rotate: 0 },\n animate: { opacity: 1, scale: 1, rotate: 0 },\n exit: { opacity: 0, scale: 1, rotate: 0 },\n transition: { duration: 0.16 },\n },\n};\n","\"use client\";\n\nimport { AnimatePresence, motion } from \"framer-motion\";\n\nimport { CopyButtonBase } from \"../copy-button-base\";\nimport type { CopyButtonIconRenderer } from \"../types\";\n\nimport { copyButtonAnimationPresets } from \"./animations\";\nimport type { CopyButtonAnimatedProps } from \"./types\";\n\nexport function CopyButtonAnimated({\n animation = \"swap\",\n ...props\n}: CopyButtonAnimatedProps) {\n const preset = copyButtonAnimationPresets[animation];\n\n const renderIcon: CopyButtonIconRenderer = ({\n copied,\n copyIcon,\n copiedIcon,\n }) => (\n <AnimatePresence initial={false} mode=\"wait\">\n <motion.span\n key={copied ? \"copied\" : \"idle\"}\n className=\"inline-flex items-center justify-center\"\n initial={preset.initial}\n animate={preset.animate}\n exit={preset.exit}\n transition={preset.transition}\n >\n {copied ? copiedIcon : copyIcon}\n </motion.span>\n </AnimatePresence>\n );\n\n return <CopyButtonBase {...props} renderIcon={renderIcon} />;\n}\n\nCopyButtonAnimated.displayName = \"CopyButtonAnimated\";\n"]}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { CopyButtonBaseProps } from "./types";
|
|
2
|
+
export declare function CopyButtonBase({ value, timeout, appearance, size, iconOnly, label, copiedLabel, copyIcon, copiedIcon, onCopy, renderIcon, className, type, disabled, onClick, "aria-label": ariaLabel, ref, ...rest }: CopyButtonBaseProps): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
export declare namespace CopyButtonBase {
|
|
4
|
+
var displayName: string;
|
|
5
|
+
}
|
|
6
|
+
//# sourceMappingURL=copy-button-base.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"copy-button-base.d.ts","sourceRoot":"","sources":["../../../src/ui/copy-button/copy-button-base.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,mBAAmB,EAA0B,MAAM,SAAS,CAAC;AAS3E,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,OAAc,EACd,UAAU,EACV,IAAI,EACJ,QAAe,EACf,KAAc,EACd,WAAsB,EACtB,QAAiC,EACjC,UAAoC,EACpC,MAAM,EACN,UAA8B,EAC9B,SAAS,EACT,IAAe,EACf,QAAQ,EACR,OAAO,EACP,YAAY,EAAE,SAAS,EACvB,GAAG,EACH,GAAG,IAAI,EACR,EAAE,mBAAmB,2CAkDrB;yBArEe,cAAc"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"copy-button.d.ts","sourceRoot":"","sources":["../../../src/ui/copy-button/copy-button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAEhD;yBAFe,UAAU"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/copy-button/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,YAAY,EACV,mBAAmB,EACnB,sBAAsB,EACtB,eAAe,EACf,sBAAsB,GACvB,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import type { VariantProps } from "class-variance-authority";
|
|
2
|
+
import type { ComponentPropsWithRef, ReactNode } from "react";
|
|
3
|
+
import type { copyButtonVariants } from "./variants";
|
|
4
|
+
export type CopyButtonVariantProps = VariantProps<typeof copyButtonVariants>;
|
|
5
|
+
/** Renders the icon region for a given copied state. Lets the animated entry swap the static icons for motion ones. */
|
|
6
|
+
export type CopyButtonIconRenderer = (state: {
|
|
7
|
+
copied: boolean;
|
|
8
|
+
copyIcon: ReactNode;
|
|
9
|
+
copiedIcon: ReactNode;
|
|
10
|
+
}) => ReactNode;
|
|
11
|
+
export interface CopyButtonBaseProps extends Omit<ComponentPropsWithRef<"button">, "value" | "onCopy"> {
|
|
12
|
+
/** Text written to the clipboard when the button is pressed. */
|
|
13
|
+
value: string;
|
|
14
|
+
/** Milliseconds the copied state stays active before resetting. `0` keeps it until re-copied. */
|
|
15
|
+
timeout?: number;
|
|
16
|
+
appearance?: CopyButtonVariantProps["appearance"];
|
|
17
|
+
size?: CopyButtonVariantProps["size"];
|
|
18
|
+
/** Render only the icon (default). Pass `false` to show the label text alongside the icon. */
|
|
19
|
+
iconOnly?: boolean;
|
|
20
|
+
/** Label shown (and used for `aria-label`) in the idle state. */
|
|
21
|
+
label?: string;
|
|
22
|
+
/** Label shown (and used for `aria-label`) after a successful copy. */
|
|
23
|
+
copiedLabel?: string;
|
|
24
|
+
copyIcon?: ReactNode;
|
|
25
|
+
copiedIcon?: ReactNode;
|
|
26
|
+
/** Called with `value` after the clipboard write succeeds. */
|
|
27
|
+
onCopy?: (value: string) => void;
|
|
28
|
+
/** Overrides how the icon region renders; the animated entry uses this for motion. */
|
|
29
|
+
renderIcon?: CopyButtonIconRenderer;
|
|
30
|
+
}
|
|
31
|
+
export type CopyButtonProps = Omit<CopyButtonBaseProps, "renderIcon">;
|
|
32
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/ui/copy-button/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAErD,MAAM,MAAM,sBAAsB,GAAG,YAAY,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAE7E,uHAAuH;AACvH,MAAM,MAAM,sBAAsB,GAAG,CAAC,KAAK,EAAE;IAC3C,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,SAAS,CAAC;IACpB,UAAU,EAAE,SAAS,CAAC;CACvB,KAAK,SAAS,CAAC;AAEhB,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IACjE,gEAAgE;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,iGAAiG;IACjG,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,sBAAsB,CAAC,YAAY,CAAC,CAAC;IAClD,IAAI,CAAC,EAAE,sBAAsB,CAAC,MAAM,CAAC,CAAC;IACtC,8FAA8F;IAC9F,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uEAAuE;IACvE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,8DAA8D;IAC9D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,sFAAsF;IACtF,UAAU,CAAC,EAAE,sBAAsB,CAAC;CACrC;AAED,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,mBAAmB,EAAE,YAAY,CAAC,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export declare const copyButtonVariants: (props?: ({
|
|
2
|
+
appearance?: "default" | "outline" | "glass" | "sky" | "emerald" | "violet" | "amber" | "rose" | "gray" | "indigo" | "orange" | "pink" | "purple" | "teal" | "yellow" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange" | "secondary" | "destructive" | "ghost" | null | undefined;
|
|
3
|
+
size?: "md" | "sm" | "lg" | null | undefined;
|
|
4
|
+
iconOnly?: boolean | null | undefined;
|
|
5
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
|
+
//# sourceMappingURL=variants.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../src/ui/copy-button/variants.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,kBAAkB;;;;8EAmB7B,CAAC"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
var chunkRKX5MERK_js = require('../chunk-RKX5MERK.js');
|
|
5
|
+
require('../chunk-CQMV7BB6.js');
|
|
6
|
+
require('../chunk-ZS5756ZC.js');
|
|
7
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
8
|
+
|
|
9
|
+
function CopyButton(props) {
|
|
10
|
+
return /* @__PURE__ */ jsxRuntime.jsx(chunkRKX5MERK_js.CopyButtonBase, { ...props });
|
|
11
|
+
}
|
|
12
|
+
CopyButton.displayName = "CopyButton";
|
|
13
|
+
|
|
14
|
+
Object.defineProperty(exports, "copyButtonVariants", {
|
|
15
|
+
enumerable: true,
|
|
16
|
+
get: function () { return chunkRKX5MERK_js.copyButtonVariants; }
|
|
17
|
+
});
|
|
18
|
+
exports.CopyButton = CopyButton;
|
|
19
|
+
//# sourceMappingURL=copy-button.js.map
|
|
20
|
+
//# sourceMappingURL=copy-button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/ui/copy-button/copy-button.tsx"],"names":["jsx","CopyButtonBase"],"mappings":";;;;;;;AAIO,SAAS,WAAW,KAAA,EAAwB;AACjD,EAAA,uBAAOA,cAAA,CAACC,+BAAA,EAAA,EAAgB,GAAG,KAAA,EAAO,CAAA;AACpC;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA","file":"copy-button.js","sourcesContent":["// copy-button.tsx — default static entry (no framer-motion)\nimport { CopyButtonBase } from \"./copy-button-base\";\nimport type { CopyButtonProps } from \"./types\";\n\nexport function CopyButton(props: CopyButtonProps) {\n return <CopyButtonBase {...props} />;\n}\n\nCopyButton.displayName = \"CopyButton\";\n"]}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { CopyButtonBase } from '../chunk-7TGUGTTQ.mjs';
|
|
3
|
+
export { copyButtonVariants } from '../chunk-7TGUGTTQ.mjs';
|
|
4
|
+
import '../chunk-ODBG4Y6R.mjs';
|
|
5
|
+
import '../chunk-4D54YOL6.mjs';
|
|
6
|
+
import { jsx } from 'react/jsx-runtime';
|
|
7
|
+
|
|
8
|
+
function CopyButton(props) {
|
|
9
|
+
return /* @__PURE__ */ jsx(CopyButtonBase, { ...props });
|
|
10
|
+
}
|
|
11
|
+
CopyButton.displayName = "CopyButton";
|
|
12
|
+
|
|
13
|
+
export { CopyButton };
|
|
14
|
+
//# sourceMappingURL=copy-button.mjs.map
|
|
15
|
+
//# sourceMappingURL=copy-button.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/ui/copy-button/copy-button.tsx"],"names":[],"mappings":";;;;;;AAIO,SAAS,WAAW,KAAA,EAAwB;AACjD,EAAA,uBAAO,GAAA,CAAC,cAAA,EAAA,EAAgB,GAAG,KAAA,EAAO,CAAA;AACpC;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA","file":"copy-button.mjs","sourcesContent":["// copy-button.tsx — default static entry (no framer-motion)\nimport { CopyButtonBase } from \"./copy-button-base\";\nimport type { CopyButtonProps } from \"./types\";\n\nexport function CopyButton(props: CopyButtonProps) {\n return <CopyButtonBase {...props} />;\n}\n\nCopyButton.displayName = \"CopyButton\";\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"animations.d.ts","sourceRoot":"","sources":["../../../../src/ui/kbd/animated/animations.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,eAAO,MAAM,mBAAmB,EAAE,mBAYjC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ui/kbd/animated/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACnD,YAAY,EACV,gBAAgB,EAChB,YAAY,EACZ,mBAAmB,GACpB,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { KbdAnimatedProps } from "./types";
|
|
2
|
+
export declare function KbdAnimated({ animation, ...props }: KbdAnimatedProps): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
export declare namespace KbdAnimated {
|
|
4
|
+
var displayName: string;
|
|
5
|
+
}
|
|
6
|
+
//# sourceMappingURL=kbd-animated.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"kbd-animated.d.ts","sourceRoot":"","sources":["../../../../src/ui/kbd/animated/kbd-animated.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAEhD,wBAAgB,WAAW,CAAC,EAAE,SAAkB,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,2CAa7E;yBAbe,WAAW"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import type { HTMLMotionProps } from "framer-motion";
|
|
2
|
+
import type { KbdBaseProps } from "../types";
|
|
3
|
+
export type KbdAnimation = "none" | "press" | "pop";
|
|
4
|
+
export type KbdAnimatedProps = Omit<KbdBaseProps, "as"> & {
|
|
5
|
+
animation?: KbdAnimation;
|
|
6
|
+
};
|
|
7
|
+
type KbdPresetMotionProps = Pick<HTMLMotionProps<"span">, "transition" | "whileHover" | "whileTap" | "animate" | "initial">;
|
|
8
|
+
export type KbdAnimationPresets = Record<KbdAnimation, KbdPresetMotionProps>;
|
|
9
|
+
export {};
|
|
10
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/ui/kbd/animated/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAErD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,CAAC;AAEpD,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,GAAG;IACxD,SAAS,CAAC,EAAE,YAAY,CAAC;CAC1B,CAAC;AAEF,KAAK,oBAAoB,GAAG,IAAI,CAC9B,eAAe,CAAC,MAAM,CAAC,EACvB,YAAY,GAAG,YAAY,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,CACjE,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,MAAM,CAAC,YAAY,EAAE,oBAAoB,CAAC,CAAC"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
var chunkDN7TYUJ6_js = require('../../chunk-DN7TYUJ6.js');
|
|
5
|
+
require('../../chunk-ZS5756ZC.js');
|
|
6
|
+
var framerMotion = require('framer-motion');
|
|
7
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
8
|
+
|
|
9
|
+
// src/ui/kbd/animated/animations.ts
|
|
10
|
+
var kbdAnimationPresets = {
|
|
11
|
+
none: {},
|
|
12
|
+
press: {
|
|
13
|
+
whileHover: { y: -1 },
|
|
14
|
+
whileTap: { y: 1, scale: 0.96 },
|
|
15
|
+
transition: { type: "spring", stiffness: 600, damping: 22 }
|
|
16
|
+
},
|
|
17
|
+
pop: {
|
|
18
|
+
initial: { scale: 0.85, opacity: 0 },
|
|
19
|
+
animate: { scale: 1, opacity: 1 },
|
|
20
|
+
transition: { type: "spring", stiffness: 520, damping: 26 }
|
|
21
|
+
}
|
|
22
|
+
};
|
|
23
|
+
function KbdAnimated({ animation = "none", ...props }) {
|
|
24
|
+
const motionProps = kbdAnimationPresets[animation];
|
|
25
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
26
|
+
chunkDN7TYUJ6_js.KbdBase,
|
|
27
|
+
{
|
|
28
|
+
...{
|
|
29
|
+
as: framerMotion.motion.span,
|
|
30
|
+
initial: animation === "none" ? false : void 0,
|
|
31
|
+
...motionProps,
|
|
32
|
+
...props
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
);
|
|
36
|
+
}
|
|
37
|
+
KbdAnimated.displayName = "KbdAnimated";
|
|
38
|
+
|
|
39
|
+
exports.KbdAnimated = KbdAnimated;
|
|
40
|
+
exports.kbdAnimationPresets = kbdAnimationPresets;
|
|
41
|
+
//# sourceMappingURL=animated.js.map
|
|
42
|
+
//# sourceMappingURL=animated.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/ui/kbd/animated/animations.ts","../../../src/ui/kbd/animated/kbd-animated.tsx"],"names":["jsx","KbdBase","motion"],"mappings":";;;;;;;;AAEO,IAAM,mBAAA,GAA2C;AAAA,EACtD,MAAM,EAAC;AAAA,EACP,KAAA,EAAO;AAAA,IACL,UAAA,EAAY,EAAE,CAAA,EAAG,EAAA,EAAG;AAAA,IACpB,QAAA,EAAU,EAAE,CAAA,EAAG,CAAA,EAAG,OAAO,IAAA,EAAK;AAAA,IAC9B,YAAY,EAAE,IAAA,EAAM,UAAU,SAAA,EAAW,GAAA,EAAK,SAAS,EAAA;AAAG,GAC5D;AAAA,EACA,GAAA,EAAK;AAAA,IACH,OAAA,EAAS,EAAE,KAAA,EAAO,IAAA,EAAM,SAAS,CAAA,EAAE;AAAA,IACnC,OAAA,EAAS,EAAE,KAAA,EAAO,CAAA,EAAG,SAAS,CAAA,EAAE;AAAA,IAChC,YAAY,EAAE,IAAA,EAAM,UAAU,SAAA,EAAW,GAAA,EAAK,SAAS,EAAA;AAAG;AAE9D;ACJO,SAAS,YAAY,EAAE,SAAA,GAAY,MAAA,EAAQ,GAAG,OAAM,EAAqB;AAC9E,EAAA,MAAM,WAAA,GAAc,oBAAoB,SAAS,CAAA;AAEjD,EAAA,uBACEA,cAAA;AAAA,IAACC,wBAAA;AAAA,IAAA;AAAA,MACE,GAAI;AAAA,QACH,IAAIC,mBAAA,CAAO,IAAA;AAAA,QACX,OAAA,EAAS,SAAA,KAAc,MAAA,GAAS,KAAA,GAAQ,MAAA;AAAA,QACxC,GAAG,WAAA;AAAA,QACH,GAAG;AAAA;AACL;AAAA,GACF;AAEJ;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA","file":"animated.js","sourcesContent":["import type { KbdAnimationPresets } from \"./types\";\n\nexport const kbdAnimationPresets: KbdAnimationPresets = {\n none: {},\n press: {\n whileHover: { y: -1 },\n whileTap: { y: 1, scale: 0.96 },\n transition: { type: \"spring\", stiffness: 600, damping: 22 },\n },\n pop: {\n initial: { scale: 0.85, opacity: 0 },\n animate: { scale: 1, opacity: 1 },\n transition: { type: \"spring\", stiffness: 520, damping: 26 },\n },\n};\n","\"use client\";\n\nimport { motion } from \"framer-motion\";\n\nimport { KbdBase } from \"../kbd-base\";\nimport type { KbdBaseProps } from \"../types\";\n\nimport { kbdAnimationPresets } from \"./animations\";\nimport type { KbdAnimatedProps } from \"./types\";\n\nexport function KbdAnimated({ animation = \"none\", ...props }: KbdAnimatedProps) {\n const motionProps = kbdAnimationPresets[animation];\n\n return (\n <KbdBase\n {...({\n as: motion.span,\n initial: animation === \"none\" ? false : undefined,\n ...motionProps,\n ...props,\n } as KbdBaseProps)}\n />\n );\n}\n\nKbdAnimated.displayName = \"KbdAnimated\";\n"]}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { KbdBase } from '../../chunk-VYI3GS2C.mjs';
|
|
3
|
+
import '../../chunk-4D54YOL6.mjs';
|
|
4
|
+
import { motion } from 'framer-motion';
|
|
5
|
+
import { jsx } from 'react/jsx-runtime';
|
|
6
|
+
|
|
7
|
+
// src/ui/kbd/animated/animations.ts
|
|
8
|
+
var kbdAnimationPresets = {
|
|
9
|
+
none: {},
|
|
10
|
+
press: {
|
|
11
|
+
whileHover: { y: -1 },
|
|
12
|
+
whileTap: { y: 1, scale: 0.96 },
|
|
13
|
+
transition: { type: "spring", stiffness: 600, damping: 22 }
|
|
14
|
+
},
|
|
15
|
+
pop: {
|
|
16
|
+
initial: { scale: 0.85, opacity: 0 },
|
|
17
|
+
animate: { scale: 1, opacity: 1 },
|
|
18
|
+
transition: { type: "spring", stiffness: 520, damping: 26 }
|
|
19
|
+
}
|
|
20
|
+
};
|
|
21
|
+
function KbdAnimated({ animation = "none", ...props }) {
|
|
22
|
+
const motionProps = kbdAnimationPresets[animation];
|
|
23
|
+
return /* @__PURE__ */ jsx(
|
|
24
|
+
KbdBase,
|
|
25
|
+
{
|
|
26
|
+
...{
|
|
27
|
+
as: motion.span,
|
|
28
|
+
initial: animation === "none" ? false : void 0,
|
|
29
|
+
...motionProps,
|
|
30
|
+
...props
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
);
|
|
34
|
+
}
|
|
35
|
+
KbdAnimated.displayName = "KbdAnimated";
|
|
36
|
+
|
|
37
|
+
export { KbdAnimated, kbdAnimationPresets };
|
|
38
|
+
//# sourceMappingURL=animated.mjs.map
|
|
39
|
+
//# sourceMappingURL=animated.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/ui/kbd/animated/animations.ts","../../../src/ui/kbd/animated/kbd-animated.tsx"],"names":[],"mappings":";;;;;;AAEO,IAAM,mBAAA,GAA2C;AAAA,EACtD,MAAM,EAAC;AAAA,EACP,KAAA,EAAO;AAAA,IACL,UAAA,EAAY,EAAE,CAAA,EAAG,EAAA,EAAG;AAAA,IACpB,QAAA,EAAU,EAAE,CAAA,EAAG,CAAA,EAAG,OAAO,IAAA,EAAK;AAAA,IAC9B,YAAY,EAAE,IAAA,EAAM,UAAU,SAAA,EAAW,GAAA,EAAK,SAAS,EAAA;AAAG,GAC5D;AAAA,EACA,GAAA,EAAK;AAAA,IACH,OAAA,EAAS,EAAE,KAAA,EAAO,IAAA,EAAM,SAAS,CAAA,EAAE;AAAA,IACnC,OAAA,EAAS,EAAE,KAAA,EAAO,CAAA,EAAG,SAAS,CAAA,EAAE;AAAA,IAChC,YAAY,EAAE,IAAA,EAAM,UAAU,SAAA,EAAW,GAAA,EAAK,SAAS,EAAA;AAAG;AAE9D;ACJO,SAAS,YAAY,EAAE,SAAA,GAAY,MAAA,EAAQ,GAAG,OAAM,EAAqB;AAC9E,EAAA,MAAM,WAAA,GAAc,oBAAoB,SAAS,CAAA;AAEjD,EAAA,uBACE,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACE,GAAI;AAAA,QACH,IAAI,MAAA,CAAO,IAAA;AAAA,QACX,OAAA,EAAS,SAAA,KAAc,MAAA,GAAS,KAAA,GAAQ,MAAA;AAAA,QACxC,GAAG,WAAA;AAAA,QACH,GAAG;AAAA;AACL;AAAA,GACF;AAEJ;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA","file":"animated.mjs","sourcesContent":["import type { KbdAnimationPresets } from \"./types\";\n\nexport const kbdAnimationPresets: KbdAnimationPresets = {\n none: {},\n press: {\n whileHover: { y: -1 },\n whileTap: { y: 1, scale: 0.96 },\n transition: { type: \"spring\", stiffness: 600, damping: 22 },\n },\n pop: {\n initial: { scale: 0.85, opacity: 0 },\n animate: { scale: 1, opacity: 1 },\n transition: { type: \"spring\", stiffness: 520, damping: 26 },\n },\n};\n","\"use client\";\n\nimport { motion } from \"framer-motion\";\n\nimport { KbdBase } from \"../kbd-base\";\nimport type { KbdBaseProps } from \"../types\";\n\nimport { kbdAnimationPresets } from \"./animations\";\nimport type { KbdAnimatedProps } from \"./types\";\n\nexport function KbdAnimated({ animation = \"none\", ...props }: KbdAnimatedProps) {\n const motionProps = kbdAnimationPresets[animation];\n\n return (\n <KbdBase\n {...({\n as: motion.span,\n initial: animation === \"none\" ? false : undefined,\n ...motionProps,\n ...props,\n } as KbdBaseProps)}\n />\n );\n}\n\nKbdAnimated.displayName = \"KbdAnimated\";\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/kbd/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5B,YAAY,EAAE,YAAY,EAAE,QAAQ,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AACvE,OAAO,EAAE,cAAc,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { KbdBaseProps } from "./types";
|
|
2
|
+
export declare function KbdBase({ keys, separator, appearance, size, children, className, as: Wrapper, ref, ...rest }: KbdBaseProps): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
export declare namespace KbdBase {
|
|
4
|
+
var displayName: string;
|
|
5
|
+
}
|
|
6
|
+
//# sourceMappingURL=kbd-base.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"kbd-base.d.ts","sourceRoot":"","sources":["../../../src/ui/kbd/kbd-base.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAG5C,wBAAgB,OAAO,CAAC,EACtB,IAAI,EACJ,SAAS,EACT,UAAU,EACV,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,EAAE,EAAE,OAAgB,EACpB,GAAG,EACH,GAAG,IAAI,EACR,EAAE,YAAY,2CA2Bd;yBArCe,OAAO"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"kbd.d.ts","sourceRoot":"","sources":["../../../src/ui/kbd/kbd.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAExC,wBAAgB,GAAG,CAAC,KAAK,EAAE,QAAQ,2CAElC;yBAFe,GAAG"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import type { VariantProps } from "class-variance-authority";
|
|
2
|
+
import type { ComponentPropsWithRef, ElementType, ReactNode } from "react";
|
|
3
|
+
import type { kbdKeyVariants } from "./variants";
|
|
4
|
+
export type KbdVariantProps = VariantProps<typeof kbdKeyVariants>;
|
|
5
|
+
export interface KbdBaseProps extends Omit<ComponentPropsWithRef<"span">, "children"> {
|
|
6
|
+
/** Keys to render as individual keycaps, e.g. `["⌘", "K"]`. Takes precedence over `children`. */
|
|
7
|
+
keys?: ReactNode[];
|
|
8
|
+
/** Optional node rendered between keycaps (e.g. "+" or "then"). */
|
|
9
|
+
separator?: ReactNode;
|
|
10
|
+
appearance?: KbdVariantProps["appearance"];
|
|
11
|
+
size?: KbdVariantProps["size"];
|
|
12
|
+
/** Single keycap content when `keys` is not provided. */
|
|
13
|
+
children?: ReactNode;
|
|
14
|
+
as?: ElementType;
|
|
15
|
+
}
|
|
16
|
+
export type KbdProps = Omit<KbdBaseProps, "as">;
|
|
17
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/ui/kbd/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE3E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAEjD,MAAM,MAAM,eAAe,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAElE,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,qBAAqB,CAAC,MAAM,CAAC,EAAE,UAAU,CAAC;IACvD,iGAAiG;IACjG,IAAI,CAAC,EAAE,SAAS,EAAE,CAAC;IACnB,mEAAmE;IACnE,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,UAAU,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IAC3C,IAAI,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAC/B,yDAAyD;IACzD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,EAAE,CAAC,EAAE,WAAW,CAAC;CAClB;AAED,MAAM,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export declare const kbdKeyVariants: (props?: ({
|
|
2
|
+
appearance?: "default" | "outline" | "glass" | "sky" | "emerald" | "violet" | "amber" | "rose" | "gray" | "indigo" | "orange" | "pink" | "purple" | "teal" | "yellow" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange" | "secondary" | "destructive" | "ghost" | null | undefined;
|
|
3
|
+
size?: "md" | "sm" | "lg" | null | undefined;
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
|
+
export declare const kbdSeparatorVariants: (props?: ({
|
|
6
|
+
size?: "md" | "sm" | "lg" | null | undefined;
|
|
7
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
|
+
//# sourceMappingURL=variants.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../src/ui/kbd/variants.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,cAAc;;;8EASzB,CAAC;AAEH,eAAO,MAAM,oBAAoB;;8EAUhC,CAAC"}
|