@alkimi.org/ui-kit 0.1.14 → 0.1.15
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.github.md +49 -5
- package/README.md +69 -8
- package/README.npm.md +69 -8
- package/dist/HelveticaNowDisplay-Medium-CXVMKHU3.ttf +0 -0
- package/dist/HelveticaNowDisplay-Regular-O4IVE4NP.ttf +0 -0
- package/dist/chunk-2XHWLYXD.mjs +3 -0
- package/dist/chunk-2XHWLYXD.mjs.map +1 -0
- package/dist/chunk-74PDRKS7.js +3 -0
- package/dist/chunk-74PDRKS7.js.map +1 -0
- package/dist/chunk-BCAQUOTY.mjs +3 -0
- package/dist/chunk-BCAQUOTY.mjs.map +1 -0
- package/dist/chunk-FUYXCJOQ.js +3 -0
- package/dist/chunk-FUYXCJOQ.js.map +1 -0
- package/dist/chunk-IK3C7KV5.mjs +3 -0
- package/dist/chunk-IK3C7KV5.mjs.map +1 -0
- package/dist/chunk-JNEIOQGF.js +3 -0
- package/dist/chunk-JNEIOQGF.js.map +1 -0
- package/dist/chunk-R74QDO2Z.js +3 -0
- package/dist/chunk-R74QDO2Z.js.map +1 -0
- package/dist/chunk-S5TKCF6T.mjs +3 -0
- package/dist/chunk-S5TKCF6T.mjs.map +1 -0
- package/dist/chunk-SVWC2KRP.js +3 -0
- package/dist/chunk-SVWC2KRP.js.map +1 -0
- package/dist/chunk-WF73K6X2.mjs +3 -0
- package/dist/chunk-WF73K6X2.mjs.map +1 -0
- package/dist/chunk-WJXJQZGO.js +3 -0
- package/dist/chunk-WJXJQZGO.js.map +1 -0
- package/dist/chunk-XNHJPYUV.mjs +3 -0
- package/dist/chunk-XNHJPYUV.mjs.map +1 -0
- package/dist/components/GlitchLink.js +2 -88
- package/dist/components/GlitchLink.js.map +1 -1
- package/dist/components/GlitchLink.mjs +1 -57
- package/dist/components/GlitchLink.mjs.map +1 -1
- package/dist/components/PixelLoad.js +2 -181
- package/dist/components/PixelLoad.js.map +1 -1
- package/dist/components/PixelLoad.mjs +1 -146
- package/dist/components/PixelLoad.mjs.map +1 -1
- package/dist/components/TextDecoder.js +2 -284
- package/dist/components/TextDecoder.js.map +1 -1
- package/dist/components/TextDecoder.mjs +1 -257
- package/dist/components/TextDecoder.mjs.map +1 -1
- package/dist/components/button.d.mts +1 -1
- package/dist/components/button.d.ts +1 -1
- package/dist/components/button.js +2 -108
- package/dist/components/button.js.map +1 -1
- package/dist/components/button.mjs +2 -73
- package/dist/components/button.mjs.map +1 -1
- package/dist/components/card.js +2 -114
- package/dist/components/card.js.map +1 -1
- package/dist/components/card.mjs +2 -75
- package/dist/components/card.mjs.map +1 -1
- package/dist/components/tabs.d.mts +9 -0
- package/dist/components/tabs.d.ts +9 -0
- package/dist/components/tabs.js +3 -0
- package/dist/components/tabs.js.map +1 -0
- package/dist/components/tabs.mjs +3 -0
- package/dist/components/tabs.mjs.map +1 -0
- package/dist/fonts/fonts/HelveticaNowDisplay-Medium.ttf +0 -0
- package/dist/fonts/fonts/HelveticaNowDisplay-Regular.ttf +0 -0
- package/dist/index.css +1 -961
- package/dist/index.css.map +1 -1
- package/dist/index.d.mts +6 -9
- package/dist/index.d.ts +6 -9
- package/dist/index.js +2 -661
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +2 -626
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +1 -961
- package/dist/styles.css.map +1 -1
- package/package.json +15 -39
- package/dist/lib/utils.d.mts +0 -5
- package/dist/lib/utils.d.ts +0 -5
- package/dist/lib/utils.js +0 -36
- package/dist/lib/utils.js.map +0 -1
- package/dist/lib/utils.mjs +0 -12
- package/dist/lib/utils.mjs.map +0 -1
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } }"use client";
|
|
2
|
+
var _chunkFUYXCJOQjs = require('./chunk-FUYXCJOQ.js');var _react = require('react'); var a = _interopRequireWildcard(_react);var _reactslot = require('@radix-ui/react-slot');var _classvarianceauthority = require('class-variance-authority');var _jsxruntime = require('react/jsx-runtime');var p=_classvarianceauthority.cva.call(void 0, "inline-flex items-center cursor-pointer justify-center whitespace-nowrap rounded-3xl font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",{variants:{variant:{default:"bg-primary text-primary-foreground hover:bg-primary/90",destructive:"bg-destructive text-destructive-foreground hover:bg-destructive/90",outline:"border border-input bg-background hover:bg-accent hover:text-accent-foreground",secondary:"bg-secondary/80 text-secondary-foreground hover:bg-secondary",ghost:"hover:bg-accent hover:text-accent-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-9 px-4 py-2 text-base",sm:"h-8 text-sm px-3 py-2",lg:"h-10 px-8 py-2 text-base",icon:"h-9 w-9"}},defaultVariants:{variant:"default",size:"default"}}),b= exports.b =a.forwardRef(({className:i,variant:s,size:d,asChild:c=!1,loading:e=!1,icon:r,...t},u)=>_jsxruntime.jsxs.call(void 0, c?_reactslot.Slot:"button",{className:_chunkFUYXCJOQjs.a.call(void 0, p({variant:s,size:d,className:i})),ref:u,disabled:e||t.disabled,...t,children:[e&&_jsxruntime.jsx.call(void 0, "div",{className:"mr-2 h-4 w-4 animate-spin rounded-full border border-primary-foreground border-t-transparent"}),!e&&r&&_jsxruntime.jsx.call(void 0, "span",{className:"mr-2",children:r}),t.children]}));b.displayName="Button";exports.a = p; exports.b = b;
|
|
3
|
+
//# sourceMappingURL=chunk-WJXJQZGO.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/Users/admin/Desktop/PROJECTS/alkimi-ui-kit/dist/chunk-WJXJQZGO.js","../src/components/button.tsx"],"names":["buttonVariants","cva","Button","className","variant","size","asChild","loading","icon","props","ref","jsxs","Slot","cn","jsx"],"mappings":"AAAA,uWAAY;AACZ,sDAAuC,uECDhB,iDACF,kEACkB,+CAwDjC,IApDAA,CAAAA,CAAiBC,yCAAAA,gSACrB,CACA,CACE,QAAA,CAAU,CACR,OAAA,CAAS,CACP,OAAA,CAAS,wDAAA,CACT,WAAA,CACE,oEAAA,CACF,OAAA,CACE,gFAAA,CACF,SAAA,CACE,8DAAA,CACF,KAAA,CAAO,8CAAA,CACP,IAAA,CAAM,iDACR,CAAA,CACA,IAAA,CAAM,CACJ,OAAA,CAAS,yBAAA,CACT,EAAA,CAAI,uBAAA,CACJ,EAAA,CAAI,0BAAA,CACJ,IAAA,CAAM,SACR,CACF,CAAA,CACA,eAAA,CAAiB,CACf,OAAA,CAAS,SAAA,CACT,IAAA,CAAM,SACR,CACF,CACF,CAAA,CAUMC,CAAAA,aAAe,CAAA,CAAA,UAAA,CACnB,CACE,CACE,SAAA,CAAAC,CAAAA,CACA,OAAA,CAAAC,CAAAA,CACA,IAAA,CAAAC,CAAAA,CACA,OAAA,CAAAC,CAAAA,CAAU,CAAA,CAAA,CACV,OAAA,CAAAC,CAAAA,CAAU,CAAA,CAAA,CACV,IAAA,CAAAC,CAAAA,CACA,GAAGC,CACL,CAAA,CACAC,CAAAA,CAAAA,EAIEC,8BAAAA,CAFWL,CAAUM,eAAAA,CAAO,QAAA,CAE3B,CACC,SAAA,CAAWC,gCAAAA,CAAGb,CAAe,CAAE,OAAA,CAAAI,CAAAA,CAAS,IAAA,CAAAC,CAAAA,CAAM,SAAA,CAAAF,CAAU,CAAC,CAAC,CAAA,CAC1D,GAAA,CAAKO,CAAAA,CACL,QAAA,CAAUH,CAAAA,EAAWE,CAAAA,CAAM,QAAA,CAC1B,GAAGA,CAAAA,CAEH,QAAA,CAAA,CAAAF,CAAAA,EACCO,6BAAAA,KAAC,CAAA,CAAI,SAAA,CAAU,8FAAA,CAA+F,CAAA,CAE/G,CAACP,CAAAA,EAAWC,CAAAA,EAAQM,6BAAAA,MAAC,CAAA,CAAK,SAAA,CAAU,MAAA,CAAQ,QAAA,CAAAN,CAAAA,CAAK,CAAA,CACjDC,CAAAA,CAAM,QAAA,CAAA,CACT,CAGN,CAAA,CACAP,CAAAA,CAAO,WAAA,CAAc,QAAA,CAAA,6BAAA","file":"/Users/admin/Desktop/PROJECTS/alkimi-ui-kit/dist/chunk-WJXJQZGO.js","sourcesContent":[null,"import * as React from \"react\"\nimport { Slot } from \"@radix-ui/react-slot\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst buttonVariants = cva(\n \"inline-flex items-center cursor-pointer justify-center whitespace-nowrap rounded-3xl font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50\",\n {\n variants: {\n variant: {\n default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n destructive:\n \"bg-destructive text-destructive-foreground hover:bg-destructive/90\",\n outline:\n \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n secondary:\n \"bg-secondary/80 text-secondary-foreground hover:bg-secondary\",\n ghost: \"hover:bg-accent hover:text-accent-foreground\",\n link: \"text-primary underline-offset-4 hover:underline\",\n },\n size: {\n default: \"h-9 px-4 py-2 text-base\",\n sm: \"h-8 text-sm px-3 py-2\",\n lg: \"h-10 px-8 py-2 text-base\",\n icon: \"h-9 w-9\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n }\n)\n\nexport interface ButtonProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n VariantProps<typeof buttonVariants> {\n asChild?: boolean\n loading?: boolean\n icon?: React.ReactNode\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n variant,\n size,\n asChild = false,\n loading = false,\n icon,\n ...props\n },\n ref\n ) => {\n const Comp = asChild ? Slot : \"button\"\n return (\n <Comp\n className={cn(buttonVariants({ variant, size, className }))}\n ref={ref}\n disabled={loading || props.disabled}\n {...props}\n >\n {loading && (\n <div className=\"mr-2 h-4 w-4 animate-spin rounded-full border border-primary-foreground border-t-transparent\" />\n )}\n {!loading && icon && <span className=\"mr-2\">{icon}</span>}\n {props.children}\n </Comp>\n )\n }\n)\nButton.displayName = \"Button\"\n\nexport { Button, buttonVariants }\n"]}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import{a as o}from"./chunk-S5TKCF6T.mjs";import*as a from"react";import{Slot as l}from"@radix-ui/react-slot";import{cva as f}from"class-variance-authority";import{jsx as n,jsxs as m}from"react/jsx-runtime";var p=f("inline-flex items-center cursor-pointer justify-center whitespace-nowrap rounded-3xl font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",{variants:{variant:{default:"bg-primary text-primary-foreground hover:bg-primary/90",destructive:"bg-destructive text-destructive-foreground hover:bg-destructive/90",outline:"border border-input bg-background hover:bg-accent hover:text-accent-foreground",secondary:"bg-secondary/80 text-secondary-foreground hover:bg-secondary",ghost:"hover:bg-accent hover:text-accent-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-9 px-4 py-2 text-base",sm:"h-8 text-sm px-3 py-2",lg:"h-10 px-8 py-2 text-base",icon:"h-9 w-9"}},defaultVariants:{variant:"default",size:"default"}}),b=a.forwardRef(({className:i,variant:s,size:d,asChild:c=!1,loading:e=!1,icon:r,...t},u)=>m(c?l:"button",{className:o(p({variant:s,size:d,className:i})),ref:u,disabled:e||t.disabled,...t,children:[e&&n("div",{className:"mr-2 h-4 w-4 animate-spin rounded-full border border-primary-foreground border-t-transparent"}),!e&&r&&n("span",{className:"mr-2",children:r}),t.children]}));b.displayName="Button";export{p as a,b};
|
|
3
|
+
//# sourceMappingURL=chunk-XNHJPYUV.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/button.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { Slot } from \"@radix-ui/react-slot\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst buttonVariants = cva(\n \"inline-flex items-center cursor-pointer justify-center whitespace-nowrap rounded-3xl font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50\",\n {\n variants: {\n variant: {\n default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n destructive:\n \"bg-destructive text-destructive-foreground hover:bg-destructive/90\",\n outline:\n \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n secondary:\n \"bg-secondary/80 text-secondary-foreground hover:bg-secondary\",\n ghost: \"hover:bg-accent hover:text-accent-foreground\",\n link: \"text-primary underline-offset-4 hover:underline\",\n },\n size: {\n default: \"h-9 px-4 py-2 text-base\",\n sm: \"h-8 text-sm px-3 py-2\",\n lg: \"h-10 px-8 py-2 text-base\",\n icon: \"h-9 w-9\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n }\n)\n\nexport interface ButtonProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n VariantProps<typeof buttonVariants> {\n asChild?: boolean\n loading?: boolean\n icon?: React.ReactNode\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n variant,\n size,\n asChild = false,\n loading = false,\n icon,\n ...props\n },\n ref\n ) => {\n const Comp = asChild ? Slot : \"button\"\n return (\n <Comp\n className={cn(buttonVariants({ variant, size, className }))}\n ref={ref}\n disabled={loading || props.disabled}\n {...props}\n >\n {loading && (\n <div className=\"mr-2 h-4 w-4 animate-spin rounded-full border border-primary-foreground border-t-transparent\" />\n )}\n {!loading && icon && <span className=\"mr-2\">{icon}</span>}\n {props.children}\n </Comp>\n )\n }\n)\nButton.displayName = \"Button\"\n\nexport { Button, buttonVariants }\n"],"mappings":";yCAAA,UAAYA,MAAW,QACvB,OAAS,QAAAC,MAAY,uBACrB,OAAS,OAAAC,MAA8B,2BAwDjC,OAOI,OAAAC,EAPJ,QAAAC,MAAA,oBApDN,IAAMC,EAAiBC,EACrB,iSACA,CACE,SAAU,CACR,QAAS,CACP,QAAS,yDACT,YACE,qEACF,QACE,iFACF,UACE,+DACF,MAAO,+CACP,KAAM,iDACR,EACA,KAAM,CACJ,QAAS,0BACT,GAAI,wBACJ,GAAI,2BACJ,KAAM,SACR,CACF,EACA,gBAAiB,CACf,QAAS,UACT,KAAM,SACR,CACF,CACF,EAUMC,EAAe,aACnB,CACE,CACE,UAAAC,EACA,QAAAC,EACA,KAAAC,EACA,QAAAC,EAAU,GACV,QAAAC,EAAU,GACV,KAAAC,EACA,GAAGC,CACL,EACAC,IAIEX,EAFWO,EAAUK,EAAO,SAE3B,CACC,UAAWC,EAAGZ,EAAe,CAAE,QAAAI,EAAS,KAAAC,EAAM,UAAAF,CAAU,CAAC,CAAC,EAC1D,IAAKO,EACL,SAAUH,GAAWE,EAAM,SAC1B,GAAGA,EAEH,UAAAF,GACCT,EAAC,OAAI,UAAU,+FAA+F,EAE/G,CAACS,GAAWC,GAAQV,EAAC,QAAK,UAAU,OAAQ,SAAAU,EAAK,EACjDC,EAAM,UACT,CAGN,EACAP,EAAO,YAAc","names":["React","Slot","cva","jsx","jsxs","buttonVariants","cva","Button","className","variant","size","asChild","loading","icon","props","ref","Slot","cn"]}
|
|
@@ -1,89 +1,3 @@
|
|
|
1
|
-
"use client"
|
|
2
|
-
"use
|
|
3
|
-
"use client";
|
|
4
|
-
var __create = Object.create;
|
|
5
|
-
var __defProp = Object.defineProperty;
|
|
6
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
7
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
9
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
-
var __export = (target, all) => {
|
|
11
|
-
for (var name in all)
|
|
12
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
13
|
-
};
|
|
14
|
-
var __copyProps = (to, from, except, desc) => {
|
|
15
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
16
|
-
for (let key of __getOwnPropNames(from))
|
|
17
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
18
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
19
|
-
}
|
|
20
|
-
return to;
|
|
21
|
-
};
|
|
22
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
23
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
24
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
25
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
26
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
27
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
28
|
-
mod
|
|
29
|
-
));
|
|
30
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
31
|
-
|
|
32
|
-
// src/components/GlitchLink.tsx
|
|
33
|
-
var GlitchLink_exports = {};
|
|
34
|
-
__export(GlitchLink_exports, {
|
|
35
|
-
DEFAULT_SYMBOLS: () => DEFAULT_SYMBOLS,
|
|
36
|
-
default: () => GlitchLink_default
|
|
37
|
-
});
|
|
38
|
-
module.exports = __toCommonJS(GlitchLink_exports);
|
|
39
|
-
var import_link = __toESM(require("next/link"));
|
|
40
|
-
var import_react = require("react");
|
|
41
|
-
var import_react_slot = require("@radix-ui/react-slot");
|
|
42
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
43
|
-
var DEFAULT_SYMBOLS = ["/", "#", "*"];
|
|
44
|
-
var GlitchLink = ({
|
|
45
|
-
href,
|
|
46
|
-
children,
|
|
47
|
-
symbols = DEFAULT_SYMBOLS,
|
|
48
|
-
className,
|
|
49
|
-
asChild = false,
|
|
50
|
-
...props
|
|
51
|
-
}) => {
|
|
52
|
-
const [isHovering, setIsHovering] = (0, import_react.useState)(false);
|
|
53
|
-
const getTextContent = (node) => {
|
|
54
|
-
if (typeof node === "string") return node;
|
|
55
|
-
if ((0, import_react.isValidElement)(node) && node.props.children) {
|
|
56
|
-
return getTextContent(node.props.children);
|
|
57
|
-
}
|
|
58
|
-
return "";
|
|
59
|
-
};
|
|
60
|
-
const text = getTextContent(children);
|
|
61
|
-
const getRandomGlitch = () => {
|
|
62
|
-
if (!isHovering || !text) return text;
|
|
63
|
-
return text.split(" ").map((word) => {
|
|
64
|
-
const randomLetterIndex = Math.floor(Math.random() * word.length);
|
|
65
|
-
return word.replace(
|
|
66
|
-
word[randomLetterIndex],
|
|
67
|
-
symbols[Math.floor(Math.random() * symbols.length)]
|
|
68
|
-
);
|
|
69
|
-
}).join(" ");
|
|
70
|
-
};
|
|
71
|
-
const commonProps = {
|
|
72
|
-
className,
|
|
73
|
-
onMouseEnter: () => setIsHovering(true),
|
|
74
|
-
onMouseLeave: () => setIsHovering(false),
|
|
75
|
-
...props
|
|
76
|
-
};
|
|
77
|
-
if (asChild && (0, import_react.isValidElement)(children)) {
|
|
78
|
-
const content2 = text ? isHovering ? getRandomGlitch() : text : children;
|
|
79
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_slot.Slot, { ...commonProps, children: (0, import_react.cloneElement)(children, {}, content2) });
|
|
80
|
-
}
|
|
81
|
-
const content = text ? isHovering ? getRandomGlitch() : children : children;
|
|
82
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_link.default, { href: href || "#", ...commonProps, children: content });
|
|
83
|
-
};
|
|
84
|
-
var GlitchLink_default = GlitchLink;
|
|
85
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
86
|
-
0 && (module.exports = {
|
|
87
|
-
DEFAULT_SYMBOLS
|
|
88
|
-
});
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
|
|
2
|
+
"use client";var _chunkJNEIOQGFjs = require('../chunk-JNEIOQGF.js');exports.DEFAULT_SYMBOLS = _chunkJNEIOQGFjs.a; exports.default = _chunkJNEIOQGFjs.b;
|
|
89
3
|
//# sourceMappingURL=GlitchLink.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["/Users/admin/Desktop/PROJECTS/alkimi-ui-kit/dist/components/GlitchLink.js"],"names":[],"mappings":"AAAA,qFAAY;AACZ,YAAY,CAAC,uDAAqC,mFAA0C","file":"/Users/admin/Desktop/PROJECTS/alkimi-ui-kit/dist/components/GlitchLink.js"}
|
|
@@ -1,59 +1,3 @@
|
|
|
1
|
-
"use client"
|
|
2
1
|
"use client";
|
|
3
|
-
|
|
4
|
-
// src/components/GlitchLink.tsx
|
|
5
|
-
import Link from "next/link";
|
|
6
|
-
import {
|
|
7
|
-
useState,
|
|
8
|
-
cloneElement,
|
|
9
|
-
isValidElement
|
|
10
|
-
} from "react";
|
|
11
|
-
import { Slot } from "@radix-ui/react-slot";
|
|
12
|
-
import { jsx } from "react/jsx-runtime";
|
|
13
|
-
var DEFAULT_SYMBOLS = ["/", "#", "*"];
|
|
14
|
-
var GlitchLink = ({
|
|
15
|
-
href,
|
|
16
|
-
children,
|
|
17
|
-
symbols = DEFAULT_SYMBOLS,
|
|
18
|
-
className,
|
|
19
|
-
asChild = false,
|
|
20
|
-
...props
|
|
21
|
-
}) => {
|
|
22
|
-
const [isHovering, setIsHovering] = useState(false);
|
|
23
|
-
const getTextContent = (node) => {
|
|
24
|
-
if (typeof node === "string") return node;
|
|
25
|
-
if (isValidElement(node) && node.props.children) {
|
|
26
|
-
return getTextContent(node.props.children);
|
|
27
|
-
}
|
|
28
|
-
return "";
|
|
29
|
-
};
|
|
30
|
-
const text = getTextContent(children);
|
|
31
|
-
const getRandomGlitch = () => {
|
|
32
|
-
if (!isHovering || !text) return text;
|
|
33
|
-
return text.split(" ").map((word) => {
|
|
34
|
-
const randomLetterIndex = Math.floor(Math.random() * word.length);
|
|
35
|
-
return word.replace(
|
|
36
|
-
word[randomLetterIndex],
|
|
37
|
-
symbols[Math.floor(Math.random() * symbols.length)]
|
|
38
|
-
);
|
|
39
|
-
}).join(" ");
|
|
40
|
-
};
|
|
41
|
-
const commonProps = {
|
|
42
|
-
className,
|
|
43
|
-
onMouseEnter: () => setIsHovering(true),
|
|
44
|
-
onMouseLeave: () => setIsHovering(false),
|
|
45
|
-
...props
|
|
46
|
-
};
|
|
47
|
-
if (asChild && isValidElement(children)) {
|
|
48
|
-
const content2 = text ? isHovering ? getRandomGlitch() : text : children;
|
|
49
|
-
return /* @__PURE__ */ jsx(Slot, { ...commonProps, children: cloneElement(children, {}, content2) });
|
|
50
|
-
}
|
|
51
|
-
const content = text ? isHovering ? getRandomGlitch() : children : children;
|
|
52
|
-
return /* @__PURE__ */ jsx(Link, { href: href || "#", ...commonProps, children: content });
|
|
53
|
-
};
|
|
54
|
-
var GlitchLink_default = GlitchLink;
|
|
55
|
-
export {
|
|
56
|
-
DEFAULT_SYMBOLS,
|
|
57
|
-
GlitchLink_default as default
|
|
58
|
-
};
|
|
2
|
+
"use client";import{a,b}from"../chunk-IK3C7KV5.mjs";export{a as DEFAULT_SYMBOLS,b as default};
|
|
59
3
|
//# sourceMappingURL=GlitchLink.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
|
@@ -1,182 +1,3 @@
|
|
|
1
|
-
"use client"
|
|
2
|
-
"use
|
|
3
|
-
"use client";
|
|
4
|
-
var __create = Object.create;
|
|
5
|
-
var __defProp = Object.defineProperty;
|
|
6
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
7
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
9
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
-
var __export = (target, all) => {
|
|
11
|
-
for (var name in all)
|
|
12
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
13
|
-
};
|
|
14
|
-
var __copyProps = (to, from, except, desc) => {
|
|
15
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
16
|
-
for (let key of __getOwnPropNames(from))
|
|
17
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
18
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
19
|
-
}
|
|
20
|
-
return to;
|
|
21
|
-
};
|
|
22
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
23
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
24
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
25
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
26
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
27
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
28
|
-
mod
|
|
29
|
-
));
|
|
30
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
31
|
-
|
|
32
|
-
// src/components/PixelLoad.tsx
|
|
33
|
-
var PixelLoad_exports = {};
|
|
34
|
-
__export(PixelLoad_exports, {
|
|
35
|
-
PixelLoad: () => PixelLoad
|
|
36
|
-
});
|
|
37
|
-
module.exports = __toCommonJS(PixelLoad_exports);
|
|
38
|
-
var import_image = __toESM(require("next/image"));
|
|
39
|
-
var import_react = require("react");
|
|
40
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
41
|
-
function isStaticImageData(src) {
|
|
42
|
-
return typeof src === "object" && "src" in src;
|
|
43
|
-
}
|
|
44
|
-
function getImageSrc(src) {
|
|
45
|
-
return isStaticImageData(src) ? src.src : src;
|
|
46
|
-
}
|
|
47
|
-
function PixelLoad({
|
|
48
|
-
src,
|
|
49
|
-
alt,
|
|
50
|
-
duration = 600,
|
|
51
|
-
steps = 15,
|
|
52
|
-
className,
|
|
53
|
-
onAnimationComplete,
|
|
54
|
-
priority,
|
|
55
|
-
quality,
|
|
56
|
-
placeholder = "empty",
|
|
57
|
-
blurDataURL,
|
|
58
|
-
objectFit = "cover"
|
|
59
|
-
}) {
|
|
60
|
-
const containerRef = (0, import_react.useRef)(null);
|
|
61
|
-
const canvasRef = (0, import_react.useRef)(null);
|
|
62
|
-
const [status, setStatus] = (0, import_react.useState)("loading");
|
|
63
|
-
const [dimensions, setDimensions] = (0, import_react.useState)(null);
|
|
64
|
-
const imageSrc = getImageSrc(src);
|
|
65
|
-
const drawPixelated = (0, import_react.useCallback)(
|
|
66
|
-
(ctx, img, pixelSize, w, h) => {
|
|
67
|
-
ctx.imageSmoothingEnabled = false;
|
|
68
|
-
const sw = Math.max(1, Math.floor(w / pixelSize));
|
|
69
|
-
const sh = Math.max(1, Math.floor(h / pixelSize));
|
|
70
|
-
ctx.clearRect(0, 0, w, h);
|
|
71
|
-
ctx.drawImage(img, 0, 0, sw, sh);
|
|
72
|
-
ctx.drawImage(canvasRef.current, 0, 0, sw, sh, 0, 0, w, h);
|
|
73
|
-
},
|
|
74
|
-
[]
|
|
75
|
-
);
|
|
76
|
-
const runAnimation = (0, import_react.useCallback)(
|
|
77
|
-
(ctx, img, w, h) => {
|
|
78
|
-
const minPixelSize = Math.max(w, h) / 4;
|
|
79
|
-
const intervalMs = duration / steps;
|
|
80
|
-
let currentStep = 0;
|
|
81
|
-
setStatus("animating");
|
|
82
|
-
const animate = () => {
|
|
83
|
-
const progress = currentStep / steps;
|
|
84
|
-
const pixelSize = Math.max(1, Math.floor(minPixelSize * (1 - progress)));
|
|
85
|
-
drawPixelated(ctx, img, pixelSize, w, h);
|
|
86
|
-
currentStep++;
|
|
87
|
-
if (currentStep <= steps) {
|
|
88
|
-
window.setTimeout(animate, intervalMs);
|
|
89
|
-
} else {
|
|
90
|
-
setStatus("complete");
|
|
91
|
-
onAnimationComplete?.();
|
|
92
|
-
}
|
|
93
|
-
};
|
|
94
|
-
animate();
|
|
95
|
-
},
|
|
96
|
-
[duration, steps, drawPixelated, onAnimationComplete]
|
|
97
|
-
);
|
|
98
|
-
(0, import_react.useEffect)(() => {
|
|
99
|
-
const container = containerRef.current;
|
|
100
|
-
if (!container) return;
|
|
101
|
-
const updateDimensions = () => {
|
|
102
|
-
const { width, height } = container.getBoundingClientRect();
|
|
103
|
-
setDimensions({ width: Math.floor(width), height: Math.floor(height) });
|
|
104
|
-
};
|
|
105
|
-
const resizeObserver = new ResizeObserver(updateDimensions);
|
|
106
|
-
resizeObserver.observe(container);
|
|
107
|
-
updateDimensions();
|
|
108
|
-
return () => {
|
|
109
|
-
resizeObserver.disconnect();
|
|
110
|
-
};
|
|
111
|
-
}, []);
|
|
112
|
-
(0, import_react.useEffect)(() => {
|
|
113
|
-
if (!dimensions) return;
|
|
114
|
-
if (dimensions.width <= 0 || dimensions.height <= 0) return;
|
|
115
|
-
const canvas = canvasRef.current;
|
|
116
|
-
if (!canvas) return;
|
|
117
|
-
const ctx = canvas.getContext("2d");
|
|
118
|
-
if (!ctx) return;
|
|
119
|
-
canvas.width = dimensions.width;
|
|
120
|
-
canvas.height = dimensions.height;
|
|
121
|
-
const img = new window.Image();
|
|
122
|
-
img.crossOrigin = "anonymous";
|
|
123
|
-
img.onload = () => {
|
|
124
|
-
const minPixelSize = Math.max(dimensions.width, dimensions.height) / 4;
|
|
125
|
-
drawPixelated(ctx, img, minPixelSize, dimensions.width, dimensions.height);
|
|
126
|
-
runAnimation(ctx, img, dimensions.width, dimensions.height);
|
|
127
|
-
};
|
|
128
|
-
img.onerror = () => {
|
|
129
|
-
console.error("PixelLoad: Failed to load image");
|
|
130
|
-
};
|
|
131
|
-
img.src = imageSrc;
|
|
132
|
-
return () => {
|
|
133
|
-
img.onload = null;
|
|
134
|
-
img.onerror = null;
|
|
135
|
-
};
|
|
136
|
-
}, [imageSrc, dimensions, runAnimation, drawPixelated]);
|
|
137
|
-
const isComplete = status === "complete";
|
|
138
|
-
const isAnimating = status === "animating" || status === "loading";
|
|
139
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
140
|
-
"div",
|
|
141
|
-
{
|
|
142
|
-
ref: containerRef,
|
|
143
|
-
className: `relative w-full h-full ${className || ""}`,
|
|
144
|
-
children: [
|
|
145
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
146
|
-
"canvas",
|
|
147
|
-
{
|
|
148
|
-
ref: canvasRef,
|
|
149
|
-
className: "absolute top-0 left-0 w-full h-full",
|
|
150
|
-
style: {
|
|
151
|
-
objectFit,
|
|
152
|
-
opacity: isComplete ? 0 : 1,
|
|
153
|
-
zIndex: isAnimating ? 2 : 1
|
|
154
|
-
},
|
|
155
|
-
"aria-hidden": isComplete
|
|
156
|
-
}
|
|
157
|
-
),
|
|
158
|
-
isComplete && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
159
|
-
import_image.default,
|
|
160
|
-
{
|
|
161
|
-
src,
|
|
162
|
-
alt,
|
|
163
|
-
fill: true,
|
|
164
|
-
priority,
|
|
165
|
-
quality,
|
|
166
|
-
placeholder,
|
|
167
|
-
blurDataURL,
|
|
168
|
-
className: "opacity-100 transition-opacity duration-150 ease-out z-[1]",
|
|
169
|
-
style: {
|
|
170
|
-
objectFit
|
|
171
|
-
}
|
|
172
|
-
}
|
|
173
|
-
)
|
|
174
|
-
]
|
|
175
|
-
}
|
|
176
|
-
);
|
|
177
|
-
}
|
|
178
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
179
|
-
0 && (module.exports = {
|
|
180
|
-
PixelLoad
|
|
181
|
-
});
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
|
|
2
|
+
"use client";var _chunkR74QDO2Zjs = require('../chunk-R74QDO2Z.js');exports.PixelLoad = _chunkR74QDO2Zjs.a;
|
|
182
3
|
//# sourceMappingURL=PixelLoad.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["/Users/admin/Desktop/PROJECTS/alkimi-ui-kit/dist/components/PixelLoad.js"],"names":[],"mappings":"AAAA,qFAAY;AACZ,YAAY,CAAC,uDAAmC,uCAAuB","file":"/Users/admin/Desktop/PROJECTS/alkimi-ui-kit/dist/components/PixelLoad.js"}
|
|
@@ -1,148 +1,3 @@
|
|
|
1
|
-
"use client"
|
|
2
1
|
"use client";
|
|
3
|
-
|
|
4
|
-
// src/components/PixelLoad.tsx
|
|
5
|
-
import Image from "next/image";
|
|
6
|
-
import { useCallback, useEffect, useRef, useState } from "react";
|
|
7
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
8
|
-
function isStaticImageData(src) {
|
|
9
|
-
return typeof src === "object" && "src" in src;
|
|
10
|
-
}
|
|
11
|
-
function getImageSrc(src) {
|
|
12
|
-
return isStaticImageData(src) ? src.src : src;
|
|
13
|
-
}
|
|
14
|
-
function PixelLoad({
|
|
15
|
-
src,
|
|
16
|
-
alt,
|
|
17
|
-
duration = 600,
|
|
18
|
-
steps = 15,
|
|
19
|
-
className,
|
|
20
|
-
onAnimationComplete,
|
|
21
|
-
priority,
|
|
22
|
-
quality,
|
|
23
|
-
placeholder = "empty",
|
|
24
|
-
blurDataURL,
|
|
25
|
-
objectFit = "cover"
|
|
26
|
-
}) {
|
|
27
|
-
const containerRef = useRef(null);
|
|
28
|
-
const canvasRef = useRef(null);
|
|
29
|
-
const [status, setStatus] = useState("loading");
|
|
30
|
-
const [dimensions, setDimensions] = useState(null);
|
|
31
|
-
const imageSrc = getImageSrc(src);
|
|
32
|
-
const drawPixelated = useCallback(
|
|
33
|
-
(ctx, img, pixelSize, w, h) => {
|
|
34
|
-
ctx.imageSmoothingEnabled = false;
|
|
35
|
-
const sw = Math.max(1, Math.floor(w / pixelSize));
|
|
36
|
-
const sh = Math.max(1, Math.floor(h / pixelSize));
|
|
37
|
-
ctx.clearRect(0, 0, w, h);
|
|
38
|
-
ctx.drawImage(img, 0, 0, sw, sh);
|
|
39
|
-
ctx.drawImage(canvasRef.current, 0, 0, sw, sh, 0, 0, w, h);
|
|
40
|
-
},
|
|
41
|
-
[]
|
|
42
|
-
);
|
|
43
|
-
const runAnimation = useCallback(
|
|
44
|
-
(ctx, img, w, h) => {
|
|
45
|
-
const minPixelSize = Math.max(w, h) / 4;
|
|
46
|
-
const intervalMs = duration / steps;
|
|
47
|
-
let currentStep = 0;
|
|
48
|
-
setStatus("animating");
|
|
49
|
-
const animate = () => {
|
|
50
|
-
const progress = currentStep / steps;
|
|
51
|
-
const pixelSize = Math.max(1, Math.floor(minPixelSize * (1 - progress)));
|
|
52
|
-
drawPixelated(ctx, img, pixelSize, w, h);
|
|
53
|
-
currentStep++;
|
|
54
|
-
if (currentStep <= steps) {
|
|
55
|
-
window.setTimeout(animate, intervalMs);
|
|
56
|
-
} else {
|
|
57
|
-
setStatus("complete");
|
|
58
|
-
onAnimationComplete?.();
|
|
59
|
-
}
|
|
60
|
-
};
|
|
61
|
-
animate();
|
|
62
|
-
},
|
|
63
|
-
[duration, steps, drawPixelated, onAnimationComplete]
|
|
64
|
-
);
|
|
65
|
-
useEffect(() => {
|
|
66
|
-
const container = containerRef.current;
|
|
67
|
-
if (!container) return;
|
|
68
|
-
const updateDimensions = () => {
|
|
69
|
-
const { width, height } = container.getBoundingClientRect();
|
|
70
|
-
setDimensions({ width: Math.floor(width), height: Math.floor(height) });
|
|
71
|
-
};
|
|
72
|
-
const resizeObserver = new ResizeObserver(updateDimensions);
|
|
73
|
-
resizeObserver.observe(container);
|
|
74
|
-
updateDimensions();
|
|
75
|
-
return () => {
|
|
76
|
-
resizeObserver.disconnect();
|
|
77
|
-
};
|
|
78
|
-
}, []);
|
|
79
|
-
useEffect(() => {
|
|
80
|
-
if (!dimensions) return;
|
|
81
|
-
if (dimensions.width <= 0 || dimensions.height <= 0) return;
|
|
82
|
-
const canvas = canvasRef.current;
|
|
83
|
-
if (!canvas) return;
|
|
84
|
-
const ctx = canvas.getContext("2d");
|
|
85
|
-
if (!ctx) return;
|
|
86
|
-
canvas.width = dimensions.width;
|
|
87
|
-
canvas.height = dimensions.height;
|
|
88
|
-
const img = new window.Image();
|
|
89
|
-
img.crossOrigin = "anonymous";
|
|
90
|
-
img.onload = () => {
|
|
91
|
-
const minPixelSize = Math.max(dimensions.width, dimensions.height) / 4;
|
|
92
|
-
drawPixelated(ctx, img, minPixelSize, dimensions.width, dimensions.height);
|
|
93
|
-
runAnimation(ctx, img, dimensions.width, dimensions.height);
|
|
94
|
-
};
|
|
95
|
-
img.onerror = () => {
|
|
96
|
-
console.error("PixelLoad: Failed to load image");
|
|
97
|
-
};
|
|
98
|
-
img.src = imageSrc;
|
|
99
|
-
return () => {
|
|
100
|
-
img.onload = null;
|
|
101
|
-
img.onerror = null;
|
|
102
|
-
};
|
|
103
|
-
}, [imageSrc, dimensions, runAnimation, drawPixelated]);
|
|
104
|
-
const isComplete = status === "complete";
|
|
105
|
-
const isAnimating = status === "animating" || status === "loading";
|
|
106
|
-
return /* @__PURE__ */ jsxs(
|
|
107
|
-
"div",
|
|
108
|
-
{
|
|
109
|
-
ref: containerRef,
|
|
110
|
-
className: `relative w-full h-full ${className || ""}`,
|
|
111
|
-
children: [
|
|
112
|
-
/* @__PURE__ */ jsx(
|
|
113
|
-
"canvas",
|
|
114
|
-
{
|
|
115
|
-
ref: canvasRef,
|
|
116
|
-
className: "absolute top-0 left-0 w-full h-full",
|
|
117
|
-
style: {
|
|
118
|
-
objectFit,
|
|
119
|
-
opacity: isComplete ? 0 : 1,
|
|
120
|
-
zIndex: isAnimating ? 2 : 1
|
|
121
|
-
},
|
|
122
|
-
"aria-hidden": isComplete
|
|
123
|
-
}
|
|
124
|
-
),
|
|
125
|
-
isComplete && /* @__PURE__ */ jsx(
|
|
126
|
-
Image,
|
|
127
|
-
{
|
|
128
|
-
src,
|
|
129
|
-
alt,
|
|
130
|
-
fill: true,
|
|
131
|
-
priority,
|
|
132
|
-
quality,
|
|
133
|
-
placeholder,
|
|
134
|
-
blurDataURL,
|
|
135
|
-
className: "opacity-100 transition-opacity duration-150 ease-out z-[1]",
|
|
136
|
-
style: {
|
|
137
|
-
objectFit
|
|
138
|
-
}
|
|
139
|
-
}
|
|
140
|
-
)
|
|
141
|
-
]
|
|
142
|
-
}
|
|
143
|
-
);
|
|
144
|
-
}
|
|
145
|
-
export {
|
|
146
|
-
PixelLoad
|
|
147
|
-
};
|
|
2
|
+
"use client";import{a}from"../chunk-WF73K6X2.mjs";export{a as PixelLoad};
|
|
148
3
|
//# sourceMappingURL=PixelLoad.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|