@mohasinac/appkit 2.7.47 → 2.7.49

package/dist/client.d.ts

@@ -230,3 +230,5 @@ export { LiveItemDetailView } from "./_internal/client/features/live/LiveItemDet
 export type { LiveItemDetailViewProps } from "./_internal/client/features/live/LiveItemDetailView";
 export { PhysicalLocationModal } from "./features/seller/components/PhysicalLocationModal";
 export type { PhysicalLocation } from "./features/seller/components/PhysicalLocationModal";
+export { Toggle } from "./ui/components/Toggle";
+export type { ToggleProps } from "./ui/components/Toggle";

package/dist/client.js

@@ -245,3 +245,5 @@ export { DigitalCodeDetailView } from "./_internal/client/features/digital-code/
 export { CodeRevealPanel } from "./_internal/client/features/digital-code/CodeRevealPanel";
 export { LiveItemDetailView } from "./_internal/client/features/live/LiveItemDetailView";
 export { PhysicalLocationModal } from "./features/seller/components/PhysicalLocationModal";
+// [CLIENT-ONLY] — Toggle switch primitive.
+export { Toggle } from "./ui/components/Toggle";

package/dist/features/admin/components/DashboardStats.js

@@ -9,7 +9,7 @@ const BRAND_FROM = "var(--appkit-color-primary-700, #1343de)";
 const BRAND_MID = "var(--appkit-color-cobalt, #3570fc)";
 const BRAND_TO = "var(--appkit-color-secondary-400, #84e122)";
 function StatCard({ label, value, sub, icon: Icon, gradient, iconColor }) {
-    return (_jsxs("div", { className: "relative rounded-xl border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] overflow-hidden shadow-sm hover:shadow-md transition-shadow", children: [_jsx("div", { className: "absolute top-0 left-0 right-0 h-[3px]", style: { background: gradient }, "aria-hidden": "true" }), _jsxs("div", { className: "px-5 pb-5 pt-6 flex items-start justify-between gap-3", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx(Text, { className: "text-[11px] font-semibold uppercase tracking-widest text-[var(--appkit-color-text-muted)]", children: label }), _jsx(Text, { className: "mt-2 text-2xl font-bold text-[var(--appkit-color-text)] tabular-nums leading-none", children: value }), sub && (_jsx(Text, { className: "mt-1.5 text-xs text-[var(--appkit-color-text-muted)]", children: sub }))] }), _jsx("div", { className: "flex-shrink-0 w-10 h-10 rounded-lg flex items-center justify-center", style: { background: gradient, opacity: 0.92 }, children: _jsx(Icon, { className: "w-5 h-5 text-white drop-shadow-sm" }) })] })] }));
+    return (_jsxs("div", { className: "relative rounded-xl border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] overflow-hidden shadow-sm hover:shadow-md transition-shadow", children: [_jsx("div", { className: "absolute top-0 left-0 right-0 h-[3px]", style: { background: gradient }, "aria-hidden": "true" }), _jsxs("div", { className: "px-5 pb-5 pt-6 flex items-start justify-between gap-3", children: [_jsxs("div", { className: "min-w-0 flex-1 overflow-hidden", children: [_jsx(Text, { className: "text-[11px] font-semibold uppercase tracking-widest text-[var(--appkit-color-text-muted)] truncate", children: label }), _jsx(Text, { className: "mt-2 text-xl font-bold text-[var(--appkit-color-text)] tabular-nums leading-tight break-words", children: value }), sub && (_jsx(Text, { className: "mt-1.5 text-xs text-[var(--appkit-color-text-muted)]", children: sub }))] }), _jsx("div", { className: "flex-shrink-0 w-10 h-10 rounded-lg flex items-center justify-center", style: { background: gradient, opacity: 0.92 }, children: _jsx(Icon, { className: "w-5 h-5 text-white drop-shadow-sm" }) })] })] }));
 }
 function SkeletonCard() {
     return (_jsxs("div", { className: "relative rounded-xl border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] overflow-hidden p-5 animate-pulse", children: [_jsx("div", { className: "absolute top-0 left-0 right-0 h-[3px] bg-[var(--appkit-color-border)]" }), _jsxs("div", { className: "flex items-start justify-between gap-3 pt-1", children: [_jsxs("div", { className: "flex-1 space-y-2", children: [_jsx("div", { className: "h-2.5 w-20 rounded bg-[var(--appkit-color-border)]" }), _jsx("div", { className: "h-7 w-24 rounded bg-[var(--appkit-color-border)]" })] }), _jsx("div", { className: "w-10 h-10 rounded-lg bg-[var(--appkit-color-border)]" })] })] }));

package/dist/features/filters/SwitchFilter.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
-import { Button, Div, Row, Span, Text } from "../../ui";
+import { Button, Div, Row, Span, Text, Toggle } from "../../ui";
 import { cn } from "./filterUtils";
 export function SwitchFilter({ title, label, checked, onChange, defaultCollapsed = false, className = "", isOpen: controlledOpen, onToggle, onClear, }) {
     const isControlled = controlledOpen !== undefined;
@@ -13,7 +13,5 @@ export function SwitchFilter({ title, label, checked, onChange, defaultCollapsed
         else
             setInternalCollapsed((c) => !c);
     };
-    return (_jsxs(Div, { role: "group", "aria-labelledby": `sf-${title}`, className: cn("p-4 border-b border-zinc-200 dark:border-slate-700 last:border-b-0", className), children: [_jsxs(Row, { className: "gap-2", children: [_jsxs(Button, { type: "button", id: `sf-${title}`, onClick: handleToggle, variant: "ghost", size: "sm", className: "flex flex-1 items-center justify-between text-sm font-semibold text-zinc-900 dark:text-zinc-50 py-1 hover:opacity-80 transition-opacity", "aria-expanded": !isCollapsed, children: [_jsx(Text, { className: "text-sm font-semibold text-zinc-900 dark:text-zinc-50", children: title }), _jsx("svg", { className: cn("w-4 h-4 text-zinc-500 dark:text-zinc-400 transition-transform duration-200", isCollapsed ? "" : "rotate-180"), fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19 9l-7 7-7-7" }) })] }), checked && onClear && (_jsx(Button, { type: "button", onClick: onClear, variant: "ghost", size: "sm", className: "inline-flex items-center justify-center w-5 h-5 text-zinc-500 dark:text-zinc-400 hover:text-red-600 dark:hover:text-red-400 rounded-full transition-colors", "aria-label": "Clear", children: _jsx("svg", { className: "w-3 h-3", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2.5, "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) }) }))] }), !isCollapsed && (_jsx(Div, { className: "mt-3", children: _jsxs(Button, { type: "button", role: "switch", variant: "ghost", size: "sm", "aria-checked": checked, onClick: () => onChange(!checked), className: "flex items-center justify-between w-full group", children: [_jsx(Span, { className: "text-sm text-zinc-700 dark:text-zinc-300 group-hover:text-zinc-900 dark:group-hover:text-zinc-100 transition-colors", children: label }), _jsx(Span, { "aria-hidden": "true", className: cn("relative inline-flex h-5 w-9 flex-shrink-0 rounded-full border-2 border-transparent transition-colors duration-200", checked
-                                ? "bg-primary-600 dark:bg-secondary-500"
-                                : "bg-zinc-200 dark:bg-slate-700"), children: _jsx(Span, { className: cn("pointer-events-none inline-block h-4 w-4 transform rounded-full bg-white shadow ring-0 transition duration-200", checked ? "translate-x-4" : "translate-x-0") }) })] }) }))] }));
+    return (_jsxs(Div, { role: "group", "aria-labelledby": `sf-${title}`, className: cn("p-4 border-b border-zinc-200 dark:border-slate-700 last:border-b-0", className), children: [_jsxs(Row, { className: "gap-2", children: [_jsxs(Button, { type: "button", id: `sf-${title}`, onClick: handleToggle, variant: "ghost", size: "sm", className: "flex flex-1 items-center justify-between text-sm font-semibold text-zinc-900 dark:text-zinc-50 py-1 hover:opacity-80 transition-opacity", "aria-expanded": !isCollapsed, children: [_jsx(Text, { className: "text-sm font-semibold text-zinc-900 dark:text-zinc-50", children: title }), _jsx("svg", { className: cn("w-4 h-4 text-zinc-500 dark:text-zinc-400 transition-transform duration-200", isCollapsed ? "" : "rotate-180"), fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19 9l-7 7-7-7" }) })] }), checked && onClear && (_jsx(Button, { type: "button", onClick: onClear, variant: "ghost", size: "sm", className: "inline-flex items-center justify-center w-5 h-5 text-zinc-500 dark:text-zinc-400 hover:text-red-600 dark:hover:text-red-400 rounded-full transition-colors", "aria-label": "Clear", children: _jsx("svg", { className: "w-3 h-3", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2.5, "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) }) }))] }), !isCollapsed && (_jsxs(Div, { className: "mt-3 flex items-center justify-between gap-3", children: [_jsx(Span, { className: "text-sm text-zinc-700 dark:text-zinc-300", children: label }), _jsx(Toggle, { checked: checked, onChange: onChange, size: "sm" })] }))] }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mohasinac/appkit",
-  "version": "2.7.47",
+  "version": "2.7.49",
   "license": "MIT",
   "publishConfig": {
     "access": "public"