@kawaiininja/ui 1.0.4 → 1.0.7

package/dist/components/card/AccentStrip.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+export interface AccentStripProps {
+    data: {
+        payload: {
+            role: string;
+            category: string;
+            reason: string;
+            skills: string[];
+        };
+    };
+}
+export declare const AccentStrip: React.FC<AccentStripProps>;

package/dist/components/card/AccentStrip.js

@@ -0,0 +1,3 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { ChevronRight } from "lucide-react";
+export const AccentStrip = ({ data }) => (_jsxs("div", { className: "flex items-center justify-between p-3 bg-black border-l-2 border-[#FF8A1F] hover:bg-white/[0.01] transition-all group mb-2", children: [_jsxs("div", { className: "flex flex-col", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("span", { className: "text-[9px] font-mono text-blue-500/50 uppercase", children: ["#", data.payload.category.slice(0, 3)] }), _jsx("h4", { className: "text-xs font-bold text-white uppercase tracking-wider", children: data.payload.role })] }), _jsx("p", { className: "text-[10px] text-gray-600 line-clamp-1 italic max-w-xs", children: data.payload.reason })] }), _jsxs("div", { className: "flex items-center gap-4", children: [_jsx("div", { className: "flex -space-x-1.5", children: data.payload.skills.map((_, i) => (_jsx("div", { className: "w-4 h-4 rounded-full border border-black bg-gray-900" }, i))) }), _jsx(ChevronRight, { size: 14, className: "text-gray-800 group-hover:text-white transition-colors" })] })] }));

package/dist/components/card/GlassyRow.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export interface GlassyRowProps {
+    data: {
+        payload: {
+            role: string;
+            category: string;
+        };
+    };
+}
+export declare const GlassyRow: React.FC<GlassyRowProps>;

package/dist/components/card/GlassyRow.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Activity, Circle } from "lucide-react";
+export const GlassyRow = ({ data }) => (_jsxs("div", { className: "flex items-center justify-between p-4 bg-white/[0.02] border border-white/5 rounded-2xl hover:bg-white/[0.05] hover:border-blue-500/20 transition-all group mb-2", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "w-8 h-8 rounded-full bg-blue-500/10 flex items-center justify-center text-blue-500 border border-blue-500/10", children: _jsx(Activity, { size: 14 }) }), _jsxs("div", { children: [_jsx("h4", { className: "text-[11px] font-black text-white uppercase italic", children: data.payload.role }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-[9px] text-gray-500 uppercase tracking-widest", children: data.payload.category }), _jsx(Circle, { size: 4, className: "fill-emerald-500 text-emerald-500" })] })] })] }), _jsx("button", { className: "px-4 py-1.5 bg-black border border-white/10 rounded-full text-[9px] font-bold uppercase tracking-widest text-gray-400 group-hover:text-[#FF8A1F] group-hover:border-[#FF8A1F]/30 transition-all", children: "View Log" })] }));

package/dist/components/card/GlassyStatusRow.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+export interface GlassyStatusRowProps {
+    data: {
+        payload: {
+            role: string;
+            category: string;
+        };
+        status: string;
+        createdAt: {
+            $date: string;
+        };
+    };
+}
+export declare const GlassyStatusRow: React.FC<GlassyStatusRowProps>;

package/dist/components/card/GlassyStatusRow.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronRight, GitBranch, Link2 } from "lucide-react";
+export const GlassyStatusRow = ({ data }) => (_jsxs("div", { className: "flex items-center gap-4 p-4 bg-gradient-to-r from-white/[0.03] to-transparent rounded-2xl border-l-4 border-blue-500 hover:from-white/[0.05] transition-all mb-3 group", children: [_jsx("div", { className: "shrink-0 w-10 h-10 rounded-xl bg-black border border-white/5 flex items-center justify-center text-[#FF8A1F] group-hover:scale-110 transition-transform", children: _jsx(GitBranch, { size: 18 }) }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsxs("div", { className: "flex items-center gap-2 mb-0.5", children: [_jsx("h4", { className: "text-xs font-bold text-white uppercase", children: data.payload.role }), _jsx("span", { className: "text-[8px] text-emerald-500 font-black uppercase tracking-widest", children: data.status })] }), _jsxs("div", { className: "flex items-center gap-3 text-[9px] text-gray-600 font-medium", children: [_jsxs("span", { className: "flex items-center gap-1", children: [_jsx(Link2, { size: 10 }), " ", data.payload.category] }), _jsx("span", { className: "w-1 h-1 bg-gray-800 rounded-full" }), _jsx("span", { children: new Date(data.createdAt.$date).toLocaleDateString() })] })] }), _jsx(ChevronRight, { size: 16, className: "text-gray-800 group-hover:text-white transition-colors" })] }));

package/dist/components/card/index.d.ts

@@ -1 +1,4 @@
+export * from "./AccentStrip";
 export * from "./Card";
+export * from "./GlassyRow";
+export * from "./GlassyStatusRow";

package/dist/components/card/index.js

@@ -1 +1,4 @@
+export * from "./AccentStrip";
 export * from "./Card";
+export * from "./GlassyRow";
+export * from "./GlassyStatusRow";

package/dist/components/row/AccentStrip.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+export interface AccentStripProps {
+    data: {
+        payload: {
+            role: string;
+            category: string;
+            reason: string;
+            skills: string[];
+        };
+    };
+}
+export declare const AccentStrip: React.FC<AccentStripProps>;

package/dist/components/row/AccentStrip.js

@@ -0,0 +1,3 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { ChevronRight } from "lucide-react";
+export const AccentStrip = ({ data }) => (_jsxs("div", { className: "flex items-center justify-between p-3 bg-black border-l-2 border-[#FF8A1F] hover:bg-white/[0.01] transition-all group mb-2", children: [_jsxs("div", { className: "flex flex-col", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("span", { className: "text-[9px] font-mono text-blue-500/50 uppercase", children: ["#", data.payload.category.slice(0, 3)] }), _jsx("h4", { className: "text-xs font-bold text-white uppercase tracking-wider", children: data.payload.role })] }), _jsx("p", { className: "text-[10px] text-gray-600 line-clamp-1 italic max-w-xs", children: data.payload.reason })] }), _jsxs("div", { className: "flex items-center gap-4", children: [_jsx("div", { className: "flex -space-x-1.5", children: data.payload.skills.map((_, i) => (_jsx("div", { className: "w-4 h-4 rounded-full border border-black bg-gray-900" }, i))) }), _jsx(ChevronRight, { size: 14, className: "text-gray-800 group-hover:text-white transition-colors" })] })] }));

package/dist/components/row/GlassyRow.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export interface GlassyRowProps {
+    data: {
+        payload: {
+            role: string;
+            category: string;
+        };
+    };
+}
+export declare const GlassyRow: React.FC<GlassyRowProps>;

package/dist/components/row/GlassyRow.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Activity, Circle } from "lucide-react";
+export const GlassyRow = ({ data }) => (_jsxs("div", { className: "flex items-center justify-between p-4 bg-white/[0.02] border border-white/5 rounded-2xl hover:bg-white/[0.05] hover:border-blue-500/20 transition-all group mb-2", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "w-8 h-8 rounded-full bg-blue-500/10 flex items-center justify-center text-blue-500 border border-blue-500/10", children: _jsx(Activity, { size: 14 }) }), _jsxs("div", { children: [_jsx("h4", { className: "text-[11px] font-black text-white uppercase italic", children: data.payload.role }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-[9px] text-gray-500 uppercase tracking-widest", children: data.payload.category }), _jsx(Circle, { size: 4, className: "fill-emerald-500 text-emerald-500" })] })] })] }), _jsx("button", { className: "px-4 py-1.5 bg-black border border-white/10 rounded-full text-[9px] font-bold uppercase tracking-widest text-gray-400 group-hover:text-[#FF8A1F] group-hover:border-[#FF8A1F]/30 transition-all", children: "View Log" })] }));

package/dist/components/row/GlassyStatusRow.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+export interface GlassyStatusRowProps {
+    data: {
+        payload: {
+            role: string;
+            category: string;
+        };
+        status: string;
+        createdAt: {
+            $date: string;
+        };
+    };
+}
+export declare const GlassyStatusRow: React.FC<GlassyStatusRowProps>;

package/dist/components/row/GlassyStatusRow.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronRight, GitBranch, Link2 } from "lucide-react";
+export const GlassyStatusRow = ({ data }) => (_jsxs("div", { className: "flex items-center gap-4 p-4 bg-gradient-to-r from-white/[0.03] to-transparent rounded-2xl border-l-4 border-blue-500 hover:from-white/[0.05] transition-all mb-3 group", children: [_jsx("div", { className: "shrink-0 w-10 h-10 rounded-xl bg-black border border-white/5 flex items-center justify-center text-[#FF8A1F] group-hover:scale-110 transition-transform", children: _jsx(GitBranch, { size: 18 }) }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsxs("div", { className: "flex items-center gap-2 mb-0.5", children: [_jsx("h4", { className: "text-xs font-bold text-white uppercase", children: data.payload.role }), _jsx("span", { className: "text-[8px] text-emerald-500 font-black uppercase tracking-widest", children: data.status })] }), _jsxs("div", { className: "flex items-center gap-3 text-[9px] text-gray-600 font-medium", children: [_jsxs("span", { className: "flex items-center gap-1", children: [_jsx(Link2, { size: 10 }), " ", data.payload.category] }), _jsx("span", { className: "w-1 h-1 bg-gray-800 rounded-full" }), _jsx("span", { children: new Date(data.createdAt.$date).toLocaleDateString() })] })] }), _jsx(ChevronRight, { size: 16, className: "text-gray-800 group-hover:text-white transition-colors" })] }));

package/dist/components/row/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./AccentStrip";
+export * from "./GlassyRow";
+export * from "./GlassyStatusRow";

package/dist/components/row/index.js

@@ -0,0 +1,3 @@
+export * from "./AccentStrip";
+export * from "./GlassyRow";
+export * from "./GlassyStatusRow";

package/dist/components/settings/SettingRow.d.ts

@@ -1,7 +1,7 @@
-import React from "react";
+import * as React from "react";
 interface SettingRowProps {
     /** Lucide icon component to display */
-    icon: React.ComponentType<{
+    icon?: React.ComponentType<{
         size?: number | string;
         className?: string;
     }>;

package/dist/components/settings/SettingRow.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from "react";
+import * as React from "react";
 /**
  * A standard row for settings interfaces, featuring an icon, label, description, and action area.
  */
-export const SettingRow = React.forwardRef(({ icon: Icon, label, description, children, onClick, className = "" }, ref) => (_jsxs("div", { ref: ref, onClick: onClick, className: `flex items-center justify-between p-4 border-b border-zinc-800 last:border-0 hover:bg-zinc-800/30 transition-colors ${onClick ? "cursor-pointer" : ""} ${className}`, children: [_jsxs("div", { className: "flex items-center gap-4", children: [_jsx("div", { className: "p-2 bg-zinc-800 rounded-lg text-blue-500", children: _jsx(Icon, { size: 20 }) }), _jsxs("div", { children: [_jsx("p", { className: "text-zinc-100 font-medium", children: label }), description && (_jsx("p", { className: "text-zinc-500 text-xs", children: description }))] })] }), _jsx("div", { className: "flex items-center", children: children })] })));
+export const SettingRow = React.forwardRef(({ icon: Icon, label, description, children, onClick, className = "" }, ref) => (_jsxs("div", { ref: ref, onClick: onClick, className: `flex items-center justify-between p-4 border-b border-zinc-800 last:border-0 hover:bg-zinc-800/30 transition-colors ${onClick ? "cursor-pointer" : ""} ${className}`, children: [_jsxs("div", { className: "flex items-center gap-4", children: [Icon && (_jsx("div", { className: "p-2 bg-zinc-800 rounded-lg text-blue-500", children: _jsx(Icon, { size: 20 }) })), _jsxs("div", { children: [_jsx("p", { className: "text-zinc-100 font-medium", children: label }), description && (_jsx("p", { className: "text-zinc-500 text-xs", children: description }))] })] }), _jsx("div", { className: "flex items-center", children: children })] })));
 SettingRow.displayName = "SettingRow";

package/dist/components/status-rows/AccentStrip.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+export interface AccentStripProps {
+    data: {
+        payload: {
+            role: string;
+            category: string;
+            reason: string;
+            skills: string[];
+        };
+    };
+}
+export declare const AccentStrip: React.FC<AccentStripProps>;

package/dist/components/status-rows/AccentStrip.js

@@ -0,0 +1,3 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { ChevronRight } from "lucide-react";
+export const AccentStrip = ({ data }) => (_jsxs("div", { className: "flex items-center justify-between p-3 bg-black border-l-2 border-[#FF8A1F] hover:bg-white/[0.01] transition-all group mb-2", children: [_jsxs("div", { className: "flex flex-col", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("span", { className: "text-[9px] font-mono text-blue-500/50 uppercase", children: ["#", data.payload.category.slice(0, 3)] }), _jsx("h4", { className: "text-xs font-bold text-white uppercase tracking-wider", children: data.payload.role })] }), _jsx("p", { className: "text-[10px] text-gray-600 line-clamp-1 italic max-w-xs", children: data.payload.reason })] }), _jsxs("div", { className: "flex items-center gap-4", children: [_jsx("div", { className: "flex -space-x-1.5", children: data.payload.skills.map((_, i) => (_jsx("div", { className: "w-4 h-4 rounded-full border border-black bg-gray-900" }, i))) }), _jsx(ChevronRight, { size: 14, className: "text-gray-800 group-hover:text-white transition-colors" })] })] }));

package/dist/components/status-rows/GlassyRow.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export interface GlassyRowProps {
+    data: {
+        payload: {
+            role: string;
+            category: string;
+        };
+    };
+}
+export declare const GlassyRow: React.FC<GlassyRowProps>;

package/dist/components/status-rows/GlassyRow.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Activity, Circle } from "lucide-react";
+export const GlassyRow = ({ data }) => (_jsxs("div", { className: "flex items-center justify-between p-4 bg-white/[0.02] border border-white/5 rounded-2xl hover:bg-white/[0.05] hover:border-blue-500/20 transition-all group mb-2", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "w-8 h-8 rounded-full bg-blue-500/10 flex items-center justify-center text-blue-500 border border-blue-500/10", children: _jsx(Activity, { size: 14 }) }), _jsxs("div", { children: [_jsx("h4", { className: "text-[11px] font-black text-white uppercase italic", children: data.payload.role }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-[9px] text-gray-500 uppercase tracking-widest", children: data.payload.category }), _jsx(Circle, { size: 4, className: "fill-emerald-500 text-emerald-500" })] })] })] }), _jsx("button", { className: "px-4 py-1.5 bg-black border border-white/10 rounded-full text-[9px] font-bold uppercase tracking-widest text-gray-400 group-hover:text-[#FF8A1F] group-hover:border-[#FF8A1F]/30 transition-all", children: "View Log" })] }));

package/dist/components/status-rows/GlassyStatusRow.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+export interface GlassyStatusRowProps {
+    data: {
+        payload: {
+            role: string;
+            category: string;
+        };
+        status: string;
+        createdAt: {
+            $date: string;
+        };
+    };
+}
+export declare const GlassyStatusRow: React.FC<GlassyStatusRowProps>;

package/dist/components/status-rows/GlassyStatusRow.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronRight, GitBranch, Link2 } from "lucide-react";
+export const GlassyStatusRow = ({ data }) => (_jsxs("div", { className: "flex items-center gap-4 p-4 bg-gradient-to-r from-white/[0.03] to-transparent rounded-2xl border-l-4 border-blue-500 hover:from-white/[0.05] transition-all mb-3 group", children: [_jsx("div", { className: "shrink-0 w-10 h-10 rounded-xl bg-black border border-white/5 flex items-center justify-center text-[#FF8A1F] group-hover:scale-110 transition-transform", children: _jsx(GitBranch, { size: 18 }) }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsxs("div", { className: "flex items-center gap-2 mb-0.5", children: [_jsx("h4", { className: "text-xs font-bold text-white uppercase", children: data.payload.role }), _jsx("span", { className: "text-[8px] text-emerald-500 font-black uppercase tracking-widest", children: data.status })] }), _jsxs("div", { className: "flex items-center gap-3 text-[9px] text-gray-600 font-medium", children: [_jsxs("span", { className: "flex items-center gap-1", children: [_jsx(Link2, { size: 10 }), " ", data.payload.category] }), _jsx("span", { className: "w-1 h-1 bg-gray-800 rounded-full" }), _jsx("span", { children: new Date(data.createdAt.$date).toLocaleDateString() })] })] }), _jsx(ChevronRight, { size: 16, className: "text-gray-800 group-hover:text-white transition-colors" })] }));

package/dist/components/status-rows/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./AccentStrip";
+export * from "./GlassyRow";
+export * from "./GlassyStatusRow";

package/dist/components/status-rows/index.js

@@ -0,0 +1,3 @@
+export * from "./AccentStrip";
+export * from "./GlassyRow";
+export * from "./GlassyStatusRow";

package/dist/components/toggle/BloomToggle.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 interface ToggleProps {
     enabled: boolean;
     setEnabled: (enabled: boolean) => void;

package/dist/components/toggle/BloomToggle.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from "react";
+import * as React from "react";
 /**
  * A minimalist toggle with a circular "bloom" animation effect.
  */

package/dist/components/toggle/CrosshairToggle.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 interface ToggleProps {
     enabled: boolean;
     setEnabled: (enabled: boolean) => void;

package/dist/components/toggle/CrosshairToggle.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from "react";
+import * as React from "react";
 /**
  * A unique crosshair-style toggle with tactical UI elements and corner indicators.
  */

package/dist/components/toggle/Toggle.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 interface ToggleProps {
     enabled: boolean;
     setEnabled: (enabled: boolean) => void;

package/dist/components/toggle/Toggle.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from "react";
+import * as React from "react";
 /**
  * A sleek, modern toggle switch with a sliding indicator and subtle glow effects.
  */

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@kawaiininja/ui",
-    "version": "1.0.4",
+    "version": "1.0.7",
     "description": "A modern React component library with 45+ premium components for building beautiful web applications",
     "main": "dist/index.js",
     "types": "dist/index.d.ts",
@@ -33,7 +33,7 @@
         "dark-mode",
         "modern-ui"
     ],
-    "author": "Vinay (4kawaiininja)",
+    "author": "Tristan (4kawaiininja)",
     "license": "MIT",
     "repository": {
         "type": "git",
@@ -65,4 +65,4 @@
         "@types/react-dom": "^19.2.3",
         "typescript": "^5.9.3"
     }
-}
+}