@mohasinac/appkit 2.7.8 → 2.7.10

package/dist/ui/components/BaseListingCard.js

@@ -1,6 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Button } from "./Button";
-import { Span } from "./Typography";
 function BaseListingCardRoot({ className = "", isSelected, isDisabled, variant = "grid", onClick, onMouseDown, onMouseUp, onMouseLeave, onTouchStart, onTouchEnd, children, }) {
     return (_jsx("div", { onClick: onClick, onMouseDown: onMouseDown, onMouseUp: onMouseUp, onMouseLeave: onMouseLeave, onTouchStart: onTouchStart, onTouchEnd: onTouchEnd, className: [
             "group relative w-full min-w-0 overflow-hidden rounded-xl border bg-white dark:bg-zinc-900 transition-shadow",
@@ -48,17 +46,21 @@ function BaseListingCardInfo({ variant = "grid", className = "", children, }) {
             .join(" "), children: children }));
 }
 function BaseListingCardCheckbox({ selected, onSelect, label, position = "top-2 left-2", className = "", }) {
-    return (_jsx(Button, { type: "button", "aria-label": label ?? (selected ? "Deselect" : "Select"), onClick: (e) => {
+    return (_jsx("button", { type: "button", "aria-label": label ?? (selected ? "Deselect" : "Select"), "aria-checked": selected, role: "checkbox", onClick: (e) => {
             e.stopPropagation();
             onSelect?.(e);
         }, className: [
-            "absolute z-10 h-5 w-5 rounded border-2 flex items-center justify-center bg-white/90",
-            selected ? "bg-primary border-primary" : "border-zinc-300",
+            "absolute z-10 h-4 w-4 rounded flex items-center justify-center",
+            "transition-all duration-150 cursor-pointer border focus-visible:outline-none",
+            "focus-visible:ring-2 focus-visible:ring-primary/50",
+            selected
+                ? "bg-primary border-primary shadow-sm"
+                : "bg-white/80 border-zinc-300/80 hover:border-primary/60 hover:bg-white dark:bg-zinc-800/80 dark:border-zinc-600",
             position,
             className,
         ]
             .filter(Boolean)
-            .join(" "), children: selected && _jsx(Span, { className: "text-white text-xs leading-none", children: "\u2713" }) }));
+            .join(" "), children: selected && (_jsx("svg", { className: "w-2.5 h-2.5 text-white", viewBox: "0 0 10 10", fill: "none", "aria-hidden": "true", children: _jsx("path", { d: "M1.5 5L4 7.5L8.5 2.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })) }));
 }
 export const BaseListingCard = Object.assign(BaseListingCardRoot, {
     Hero: BaseListingCardHero,

package/dist/ui/components/Button.style.css

@@ -100,20 +100,23 @@
 }
 
 .appkit-button--secondary {
-  background: var(--appkit-color-primary-700);
-  color: var(--appkit-color-text-on-primary);
+  background: var(--appkit-color-surface);
+  border-color: var(--appkit-color-primary-700);
+  color: var(--appkit-color-primary-700);
 }
 
 .appkit-button--secondary:hover:not(:disabled) {
-  background: var(--appkit-color-primary-600);
+  background: color-mix(in srgb, var(--appkit-color-primary-700) 8%, transparent);
 }
 
 .dark .appkit-button--secondary {
-  background: var(--appkit-color-secondary-700);
+  background: transparent;
+  border-color: var(--appkit-color-secondary);
+  color: var(--appkit-color-secondary);
 }
 
 .dark .appkit-button--secondary:hover:not(:disabled) {
-  background: var(--appkit-color-secondary-600);
+  background: color-mix(in srgb, var(--appkit-color-secondary) 12%, transparent);
 }
 
 .appkit-button--outline {

package/dist/ui/components/ListingLayout.style.css

@@ -227,20 +227,30 @@
 /* -- Bulk action bar --------------------------------- */
 
 .appkit-listing-layout__bulk-bar {
-  display: none;
+  display: block;
   padding-top: 0.5rem;
-  margin-top: 0.5rem;
-  border-top: 1px solid var(--appkit-color-zinc-100);
+  margin-top: 0.375rem;
+  border-top: 1px solid rgba(161, 161, 170, 0.25);
 }
 
-@media (min-width: 1024px) {
-  .appkit-listing-layout__bulk-bar {
-    display: block;
-  }
+.dark .appkit-listing-layout__bulk-bar {
+  border-top-color: rgba(30, 41, 59, 0.6);
 }
 
-.dark .appkit-listing-layout__bulk-bar {
-  border-top-color: var(--appkit-color-slate-800);
+/* Strip BulkActionBar card chrome when embedded in the toolbar */
+.appkit-listing-layout__bulk-bar .appkit-bulk-bar {
+  border: none;
+  border-radius: 0;
+  animation: none;
+  background: transparent;
+}
+
+.appkit-listing-layout__bulk-bar .appkit-bulk-bar__stripe {
+  display: none;
+}
+
+.appkit-listing-layout__bulk-bar .appkit-bulk-bar__row {
+  padding: 0 0 0.25rem;
 }
 
 /* -- Body (sidebar + content) ------------------------ */

package/dist/ui/components/LoginRequiredModal.d.ts

@@ -0,0 +1,9 @@
+export interface LoginRequiredModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    /** Body copy shown inside the modal. */
+    message?: string;
+    /** Override the login destination (default: ROUTES.AUTH.LOGIN). */
+    loginHref?: string;
+}
+export declare function LoginRequiredModal({ isOpen, onClose, message, loginHref, }: LoginRequiredModalProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/components/LoginRequiredModal.js

@@ -0,0 +1,11 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Modal } from "./Modal";
+import { Button } from "./Button";
+import { Div } from "./Div";
+import { Text } from "./Typography";
+import { ROUTES } from "../../next/routing/route-map";
+export function LoginRequiredModal({ isOpen, onClose, message = "You need to be signed in to continue. Please log in or create an account.", loginHref, }) {
+    const href = loginHref ?? String(ROUTES.AUTH.LOGIN);
+    return (_jsx(Modal, { isOpen: isOpen, onClose: onClose, title: "Sign in required", size: "sm", actions: _jsxs(Div, { className: "flex gap-3 justify-end", children: [_jsx(Button, { variant: "ghost", size: "sm", onClick: onClose, children: "Cancel" }), _jsx(Button, { variant: "primary", size: "sm", onClick: () => { window.location.href = href; }, children: "Go to Login" })] }), children: _jsx(Text, { className: "text-sm text-zinc-600 dark:text-zinc-300", children: message }) }));
+}

package/dist/ui/index.d.ts

@@ -43,6 +43,8 @@ export type { ModalProps } from "./components/Modal";
 export { Modal, ModalFooter } from "./components/Modal";
 export type { UnsavedChangesModalProps, UnsavedChangesLabels, } from "./components/UnsavedChangesModal";
 export { UnsavedChangesModal } from "./components/UnsavedChangesModal";
+export type { LoginRequiredModalProps } from "./components/LoginRequiredModal";
+export { LoginRequiredModal } from "./components/LoginRequiredModal";
 export type { DrawerProps } from "./components/Drawer";
 export { Drawer } from "./components/Drawer";
 export type { BackgroundRendererProps, BackgroundConfig, } from "./components/BackgroundRenderer";

package/dist/ui/index.js

@@ -25,6 +25,7 @@ export { Pagination } from "./components/Pagination";
 export { StatusBadge } from "./components/StatusBadge";
 export { Modal, ModalFooter } from "./components/Modal";
 export { UnsavedChangesModal } from "./components/UnsavedChangesModal";
+export { LoginRequiredModal } from "./components/LoginRequiredModal";
 export { Drawer } from "./components/Drawer";
 export { BackgroundRenderer } from "./components/BackgroundRenderer";
 export { ResponsiveView } from "./components/ResponsiveView";

package/dist/utils/auth-error.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Detects auth/authorization errors thrown by server actions or fetch responses.
+ *
+ * Pass the caught error (and optionally the HTTP status code for fetch-based
+ * callers) to determine whether the caller should prompt the user to log in
+ * rather than displaying a generic error message.
+ */
+export declare function isAuthError(err: unknown, httpStatus?: number): boolean;

package/dist/utils/auth-error.js

@@ -0,0 +1,20 @@
+/**
+ * Detects auth/authorization errors thrown by server actions or fetch responses.
+ *
+ * Pass the caught error (and optionally the HTTP status code for fetch-based
+ * callers) to determine whether the caller should prompt the user to log in
+ * rather than displaying a generic error message.
+ */
+export function isAuthError(err, httpStatus) {
+    if (httpStatus === 401 || httpStatus === 403)
+        return true;
+    const msg = (err instanceof Error ? err.message : String(err)).toLowerCase();
+    return (msg.includes("unauthorized") ||
+        msg.includes("not authenticated") ||
+        msg.includes("unauthenticated") ||
+        msg.includes("authentication required") ||
+        msg.includes("invalid or expired session") ||
+        msg.includes("sign in to") ||
+        msg === "error 401" ||
+        msg === "error 403");
+}

package/dist/utils/index.d.ts

@@ -1,3 +1,4 @@
+export * from "./auth-error";
 export * from "./date.formatter";
 export * from "./number.formatter";
 export * from "./string.formatter";

package/dist/utils/index.js

@@ -1,3 +1,4 @@
+export * from "./auth-error";
 export * from "./date.formatter";
 export * from "./number.formatter";
 export * from "./string.formatter";

package/package.json

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