@retinalabsllc/zairusjs 0.2.6 → 0.2.7

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/dist/index.d.mts CHANGED
@@ -793,6 +793,8 @@ interface DirectoryItem {
793
793
  interface UniversalDirectoryPageProps {
794
794
  headerTitle: string;
795
795
  headerDescription: string;
796
+ hideSearch?: boolean;
797
+ headerAction?: React.ReactNode;
796
798
  searchPlaceholder?: string;
797
799
  searchQuery: string;
798
800
  onSearchChange: (val: string) => void;
@@ -809,4 +811,30 @@ interface UniversalDirectoryPageProps {
809
811
  }
810
812
  declare const UniversalDirectoryPage: React.FC<UniversalDirectoryPageProps>;
811
813
 
812
- export { AITranscriptionFeature, type AITranscriptionFeatureProps, type AgentFilePayload, type AgentStat, AppBento2, type AppBento2Props, type BentoFeature, type BoardMember, type CompanyDetails, type DashboardList, type DashboardListItem, type DashboardStat, type DocumentSectionData, type EmailContact, Faq, type FaqItem, type FaqProps, FeatureScroll, type FeatureScrollProps, Footer, type FooterColumn, type FooterLink, type FooterProps, GifFeatureCard, type GifFeatureCardProps, Header, type HeaderLink, type HeaderProps, HeroSection, type HeroSectionProps, ManagedBoardBlock, type ManagedBoardBlockProps, ManagedContactBlock, type ManagedContactBlockProps, ManagedDocument, type ManagedDocumentProps, ManagedNewsletterSplitBlock, type ManagedNewsletterSplitBlockProps, ManagedNotFoundBlock, type ManagedNotFoundBlockProps, ManagedPricingBlock, type ManagedPricingBlockProps, ManagedProjectsBlock, type ManagedProjectsBlockProps, ManagedToaster, type NavItem, NumberInput, type NumberInputProps, type OverviewAlert, type OverviewStat, PageSpinner, type PageSpinnerProps, type PlatformFeatureItem, PlatformFeatures, type PlatformFeaturesProps, PortfolioHero, type PortfolioHeroProps, type PricingFeature, type PricingPlan, ProductHero, type ProductHeroProps, type ProjectItem, type ScrollFeature, type SearchTypeOption, type SocialContact, type SocialLink, TextInput, type TextInputProps, type ThemeColorOption, ThreeDActionButton, type ThreeDActionButtonProps, ThreeDButton, type ThreeDButtonProps, UniversalAgentConsole, type UniversalAgentConsoleProps, UniversalBillingPage, type UniversalBillingPageProps, UniversalDashboardPage, type UniversalDashboardPageProps, UniversalDirectoryPage, type UniversalDirectoryPageProps, UniversalErrorView, type UniversalErrorViewProps, UniversalHeader, type UniversalHeaderProps, UniversalIdentityPage, type UniversalIdentityPageProps, type UniversalInvoice, UniversalLookupPage, type UniversalLookupPageProps, type UniversalMember, UniversalMembersPage, type UniversalMembersPageProps, UniversalOrganizationPage, type UniversalOrganizationPageProps, UniversalOverviewPage, type UniversalOverviewPageProps, UniversalProfileSettings, type UniversalProfileSettingsProps, UniversalSidebar, type UniversalSidebarProps, type WorkspaceItem, ZairusAuth, type ZairusAuthProps };
814
+ interface AiApproveDeclineProps {
815
+ suggestionTitle: string;
816
+ suggestionValue: React.ReactNode;
817
+ onApprove: () => void;
818
+ onDecline: () => void;
819
+ onEdit?: (newVal: string) => void;
820
+ }
821
+ declare const AiApproveDecline: React.FC<AiApproveDeclineProps>;
822
+
823
+ type AiTaskStatus = 'pending' | 'loading' | 'success' | 'error';
824
+ interface AiTask {
825
+ id: string;
826
+ label: string;
827
+ status: AiTaskStatus;
828
+ }
829
+ interface AiStageCheckProps {
830
+ tasks: AiTask[];
831
+ }
832
+ declare const AiStageCheck: React.FC<AiStageCheckProps>;
833
+
834
+ interface StaggerProps {
835
+ steps: string[];
836
+ currentStep: number;
837
+ }
838
+ declare const Stagger: React.FC<StaggerProps>;
839
+
840
+ export { AITranscriptionFeature, type AITranscriptionFeatureProps, type AgentFilePayload, type AgentStat, AiApproveDecline, type AiApproveDeclineProps, AiStageCheck, type AiStageCheckProps, type AiTask, type AiTaskStatus, AppBento2, type AppBento2Props, type BentoFeature, type BoardMember, type CompanyDetails, type DashboardList, type DashboardListItem, type DashboardStat, type DocumentSectionData, type EmailContact, Faq, type FaqItem, type FaqProps, FeatureScroll, type FeatureScrollProps, Footer, type FooterColumn, type FooterLink, type FooterProps, GifFeatureCard, type GifFeatureCardProps, Header, type HeaderLink, type HeaderProps, HeroSection, type HeroSectionProps, ManagedBoardBlock, type ManagedBoardBlockProps, ManagedContactBlock, type ManagedContactBlockProps, ManagedDocument, type ManagedDocumentProps, ManagedNewsletterSplitBlock, type ManagedNewsletterSplitBlockProps, ManagedNotFoundBlock, type ManagedNotFoundBlockProps, ManagedPricingBlock, type ManagedPricingBlockProps, ManagedProjectsBlock, type ManagedProjectsBlockProps, ManagedToaster, type NavItem, NumberInput, type NumberInputProps, type OverviewAlert, type OverviewStat, PageSpinner, type PageSpinnerProps, type PlatformFeatureItem, PlatformFeatures, type PlatformFeaturesProps, PortfolioHero, type PortfolioHeroProps, type PricingFeature, type PricingPlan, ProductHero, type ProductHeroProps, type ProjectItem, type ScrollFeature, type SearchTypeOption, type SocialContact, type SocialLink, Stagger, type StaggerProps, TextInput, type TextInputProps, type ThemeColorOption, ThreeDActionButton, type ThreeDActionButtonProps, ThreeDButton, type ThreeDButtonProps, UniversalAgentConsole, type UniversalAgentConsoleProps, UniversalBillingPage, type UniversalBillingPageProps, UniversalDashboardPage, type UniversalDashboardPageProps, UniversalDirectoryPage, type UniversalDirectoryPageProps, UniversalErrorView, type UniversalErrorViewProps, UniversalHeader, type UniversalHeaderProps, UniversalIdentityPage, type UniversalIdentityPageProps, type UniversalInvoice, UniversalLookupPage, type UniversalLookupPageProps, type UniversalMember, UniversalMembersPage, type UniversalMembersPageProps, UniversalOrganizationPage, type UniversalOrganizationPageProps, UniversalOverviewPage, type UniversalOverviewPageProps, UniversalProfileSettings, type UniversalProfileSettingsProps, UniversalSidebar, type UniversalSidebarProps, type WorkspaceItem, ZairusAuth, type ZairusAuthProps };
package/dist/index.d.ts CHANGED
@@ -793,6 +793,8 @@ interface DirectoryItem {
793
793
  interface UniversalDirectoryPageProps {
794
794
  headerTitle: string;
795
795
  headerDescription: string;
796
+ hideSearch?: boolean;
797
+ headerAction?: React.ReactNode;
796
798
  searchPlaceholder?: string;
797
799
  searchQuery: string;
798
800
  onSearchChange: (val: string) => void;
@@ -809,4 +811,30 @@ interface UniversalDirectoryPageProps {
809
811
  }
810
812
  declare const UniversalDirectoryPage: React.FC<UniversalDirectoryPageProps>;
811
813
 
812
- export { AITranscriptionFeature, type AITranscriptionFeatureProps, type AgentFilePayload, type AgentStat, AppBento2, type AppBento2Props, type BentoFeature, type BoardMember, type CompanyDetails, type DashboardList, type DashboardListItem, type DashboardStat, type DocumentSectionData, type EmailContact, Faq, type FaqItem, type FaqProps, FeatureScroll, type FeatureScrollProps, Footer, type FooterColumn, type FooterLink, type FooterProps, GifFeatureCard, type GifFeatureCardProps, Header, type HeaderLink, type HeaderProps, HeroSection, type HeroSectionProps, ManagedBoardBlock, type ManagedBoardBlockProps, ManagedContactBlock, type ManagedContactBlockProps, ManagedDocument, type ManagedDocumentProps, ManagedNewsletterSplitBlock, type ManagedNewsletterSplitBlockProps, ManagedNotFoundBlock, type ManagedNotFoundBlockProps, ManagedPricingBlock, type ManagedPricingBlockProps, ManagedProjectsBlock, type ManagedProjectsBlockProps, ManagedToaster, type NavItem, NumberInput, type NumberInputProps, type OverviewAlert, type OverviewStat, PageSpinner, type PageSpinnerProps, type PlatformFeatureItem, PlatformFeatures, type PlatformFeaturesProps, PortfolioHero, type PortfolioHeroProps, type PricingFeature, type PricingPlan, ProductHero, type ProductHeroProps, type ProjectItem, type ScrollFeature, type SearchTypeOption, type SocialContact, type SocialLink, TextInput, type TextInputProps, type ThemeColorOption, ThreeDActionButton, type ThreeDActionButtonProps, ThreeDButton, type ThreeDButtonProps, UniversalAgentConsole, type UniversalAgentConsoleProps, UniversalBillingPage, type UniversalBillingPageProps, UniversalDashboardPage, type UniversalDashboardPageProps, UniversalDirectoryPage, type UniversalDirectoryPageProps, UniversalErrorView, type UniversalErrorViewProps, UniversalHeader, type UniversalHeaderProps, UniversalIdentityPage, type UniversalIdentityPageProps, type UniversalInvoice, UniversalLookupPage, type UniversalLookupPageProps, type UniversalMember, UniversalMembersPage, type UniversalMembersPageProps, UniversalOrganizationPage, type UniversalOrganizationPageProps, UniversalOverviewPage, type UniversalOverviewPageProps, UniversalProfileSettings, type UniversalProfileSettingsProps, UniversalSidebar, type UniversalSidebarProps, type WorkspaceItem, ZairusAuth, type ZairusAuthProps };
814
+ interface AiApproveDeclineProps {
815
+ suggestionTitle: string;
816
+ suggestionValue: React.ReactNode;
817
+ onApprove: () => void;
818
+ onDecline: () => void;
819
+ onEdit?: (newVal: string) => void;
820
+ }
821
+ declare const AiApproveDecline: React.FC<AiApproveDeclineProps>;
822
+
823
+ type AiTaskStatus = 'pending' | 'loading' | 'success' | 'error';
824
+ interface AiTask {
825
+ id: string;
826
+ label: string;
827
+ status: AiTaskStatus;
828
+ }
829
+ interface AiStageCheckProps {
830
+ tasks: AiTask[];
831
+ }
832
+ declare const AiStageCheck: React.FC<AiStageCheckProps>;
833
+
834
+ interface StaggerProps {
835
+ steps: string[];
836
+ currentStep: number;
837
+ }
838
+ declare const Stagger: React.FC<StaggerProps>;
839
+
840
+ export { AITranscriptionFeature, type AITranscriptionFeatureProps, type AgentFilePayload, type AgentStat, AiApproveDecline, type AiApproveDeclineProps, AiStageCheck, type AiStageCheckProps, type AiTask, type AiTaskStatus, AppBento2, type AppBento2Props, type BentoFeature, type BoardMember, type CompanyDetails, type DashboardList, type DashboardListItem, type DashboardStat, type DocumentSectionData, type EmailContact, Faq, type FaqItem, type FaqProps, FeatureScroll, type FeatureScrollProps, Footer, type FooterColumn, type FooterLink, type FooterProps, GifFeatureCard, type GifFeatureCardProps, Header, type HeaderLink, type HeaderProps, HeroSection, type HeroSectionProps, ManagedBoardBlock, type ManagedBoardBlockProps, ManagedContactBlock, type ManagedContactBlockProps, ManagedDocument, type ManagedDocumentProps, ManagedNewsletterSplitBlock, type ManagedNewsletterSplitBlockProps, ManagedNotFoundBlock, type ManagedNotFoundBlockProps, ManagedPricingBlock, type ManagedPricingBlockProps, ManagedProjectsBlock, type ManagedProjectsBlockProps, ManagedToaster, type NavItem, NumberInput, type NumberInputProps, type OverviewAlert, type OverviewStat, PageSpinner, type PageSpinnerProps, type PlatformFeatureItem, PlatformFeatures, type PlatformFeaturesProps, PortfolioHero, type PortfolioHeroProps, type PricingFeature, type PricingPlan, ProductHero, type ProductHeroProps, type ProjectItem, type ScrollFeature, type SearchTypeOption, type SocialContact, type SocialLink, Stagger, type StaggerProps, TextInput, type TextInputProps, type ThemeColorOption, ThreeDActionButton, type ThreeDActionButtonProps, ThreeDButton, type ThreeDButtonProps, UniversalAgentConsole, type UniversalAgentConsoleProps, UniversalBillingPage, type UniversalBillingPageProps, UniversalDashboardPage, type UniversalDashboardPageProps, UniversalDirectoryPage, type UniversalDirectoryPageProps, UniversalErrorView, type UniversalErrorViewProps, UniversalHeader, type UniversalHeaderProps, UniversalIdentityPage, type UniversalIdentityPageProps, type UniversalInvoice, UniversalLookupPage, type UniversalLookupPageProps, type UniversalMember, UniversalMembersPage, type UniversalMembersPageProps, UniversalOrganizationPage, type UniversalOrganizationPageProps, UniversalOverviewPage, type UniversalOverviewPageProps, UniversalProfileSettings, type UniversalProfileSettingsProps, UniversalSidebar, type UniversalSidebarProps, type WorkspaceItem, ZairusAuth, type ZairusAuthProps };
package/dist/index.js CHANGED
@@ -32,6 +32,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
32
32
  var index_exports = {};
33
33
  __export(index_exports, {
34
34
  AITranscriptionFeature: () => AITranscriptionFeature,
35
+ AiApproveDecline: () => AiApproveDecline,
36
+ AiStageCheck: () => AiStageCheck,
35
37
  AppBento2: () => AppBento2,
36
38
  Faq: () => Faq,
37
39
  FeatureScroll: () => FeatureScroll,
@@ -52,6 +54,7 @@ __export(index_exports, {
52
54
  PlatformFeatures: () => PlatformFeatures,
53
55
  PortfolioHero: () => PortfolioHero,
54
56
  ProductHero: () => ProductHero,
57
+ Stagger: () => Stagger,
55
58
  TextInput: () => TextInput,
56
59
  ThreeDActionButton: () => ThreeDActionButton,
57
60
  ThreeDButton: () => ThreeDButton,
@@ -2883,6 +2886,10 @@ var PageSpinner4 = () => /* @__PURE__ */ import_react58.default.createElement("d
2883
2886
  var UniversalDirectoryPage = ({
2884
2887
  headerTitle,
2885
2888
  headerDescription,
2889
+ hideSearch = false,
2890
+ // Default to false
2891
+ headerAction,
2892
+ // Capture the action button
2886
2893
  searchPlaceholder = "Search...",
2887
2894
  searchQuery,
2888
2895
  onSearchChange,
@@ -2897,14 +2904,14 @@ var UniversalDirectoryPage = ({
2897
2904
  detailsContent,
2898
2905
  modals
2899
2906
  }) => {
2900
- return /* @__PURE__ */ import_react58.default.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl fade-in duration-300 p-6 rounded-2xl bg-white min-h-full" }, /* @__PURE__ */ import_react58.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react58.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, currentView === "list" ? /* @__PURE__ */ import_react58.default.createElement("div", { className: "w-full" }, /* @__PURE__ */ import_react58.default.createElement("h1", { className: "text-xl text-black mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ import_react58.default.createElement("p", { className: "text-xs text-neutral-500 mb-6" }, headerDescription), /* @__PURE__ */ import_react58.default.createElement(
2907
+ return /* @__PURE__ */ import_react58.default.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl fade-in duration-300 p-6 rounded-2xl bg-white min-h-full" }, /* @__PURE__ */ import_react58.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react58.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, currentView === "list" ? /* @__PURE__ */ import_react58.default.createElement(import_react58.default.Fragment, null, /* @__PURE__ */ import_react58.default.createElement("div", { className: "w-full" }, /* @__PURE__ */ import_react58.default.createElement("h1", { className: "text-xl text-black mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ import_react58.default.createElement("p", { className: "text-xs text-neutral-500 mb-6" }, headerDescription), !hideSearch && /* @__PURE__ */ import_react58.default.createElement(
2901
2908
  TextInput,
2902
2909
  {
2903
2910
  placeholder: searchPlaceholder,
2904
2911
  value: searchQuery,
2905
2912
  onChange: onSearchChange
2906
2913
  }
2907
- )) : /* @__PURE__ */ import_react58.default.createElement("div", { className: "flex flex-col items-start gap-3" }, /* @__PURE__ */ import_react58.default.createElement("button", { onClick: onBackToList, className: "text-[10px] text-neutral-400 hover:text-black tracking-[0.2em] flex items-center gap-1.5 transition-colors outline-none uppercase" }, /* @__PURE__ */ import_react58.default.createElement(import_react59.HugeiconsIcon, { icon: import_core_free_icons18.ArrowLeft01Icon, size: 12 }), " Back"))), currentView === "list" && /* @__PURE__ */ import_react58.default.createElement("div", { className: "w-full overflow-hidden pt-2" }, isLoading ? /* @__PURE__ */ import_react58.default.createElement(PageSpinner4, null) : /* @__PURE__ */ import_react58.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "divide-y divide-neutral-100" }, items.length === 0 ? /* @__PURE__ */ import_react58.default.createElement("p", { className: "text-xs text-neutral-500 py-6 text-center" }, "No records found.") : items.map((item) => /* @__PURE__ */ import_react58.default.createElement(
2914
+ )), headerAction && /* @__PURE__ */ import_react58.default.createElement("div", { className: "shrink-0 w-full sm:w-auto mt-4 sm:mt-0" }, headerAction)) : /* @__PURE__ */ import_react58.default.createElement("div", { className: "flex flex-col items-start gap-3" }, /* @__PURE__ */ import_react58.default.createElement("button", { onClick: onBackToList, className: "text-[10px] text-neutral-400 hover:text-black tracking-[0.2em] flex items-center gap-1.5 transition-colors outline-none uppercase" }, /* @__PURE__ */ import_react58.default.createElement(import_react59.HugeiconsIcon, { icon: import_core_free_icons18.ArrowLeft01Icon, size: 12 }), " Back"))), currentView === "list" && /* @__PURE__ */ import_react58.default.createElement("div", { className: "w-full overflow-hidden pt-2" }, isLoading ? /* @__PURE__ */ import_react58.default.createElement(PageSpinner4, null) : /* @__PURE__ */ import_react58.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "divide-y divide-neutral-100" }, items.length === 0 ? /* @__PURE__ */ import_react58.default.createElement("p", { className: "text-xs text-neutral-500 py-6 text-center" }, "No records found.") : items.map((item) => /* @__PURE__ */ import_react58.default.createElement(
2908
2915
  "div",
2909
2916
  {
2910
2917
  key: item.id,
@@ -2915,9 +2922,61 @@ var UniversalDirectoryPage = ({
2915
2922
  item.rightBadge && /* @__PURE__ */ import_react58.default.createElement("div", { className: "shrink-0 pl-2" }, /* @__PURE__ */ import_react58.default.createElement("span", { className: `text-[10px] tracking-[0.2em] px-3 py-1 rounded-full whitespace-nowrap uppercase ${item.rightBadgeClass || "text-neutral-500 border border-neutral-200 bg-white"}` }, item.rightBadge))
2916
2923
  ))), totalPages > 1 && /* @__PURE__ */ import_react58.default.createElement("div", { className: "flex items-center justify-between p-4 sm:p-5" }, /* @__PURE__ */ import_react58.default.createElement("span", { className: "text-[10px] text-neutral-400 tracking-[0.2em] uppercase" }, "Page ", currentPage, " of ", totalPages), /* @__PURE__ */ import_react58.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react58.default.createElement("button", { onClick: () => onPageChange(currentPage - 1), disabled: currentPage === 1 || isLoading, className: "p-2 border border-neutral-200 rounded-full bg-white text-neutral-500 hover:text-black outline-none disabled:opacity-30" }, /* @__PURE__ */ import_react58.default.createElement(import_react59.HugeiconsIcon, { icon: import_core_free_icons18.ArrowLeft01Icon, size: 14 })), /* @__PURE__ */ import_react58.default.createElement("button", { onClick: () => onPageChange(currentPage + 1), disabled: currentPage >= totalPages || isLoading, className: "p-2 border border-neutral-200 rounded-full bg-white text-neutral-500 hover:text-black outline-none disabled:opacity-30" }, /* @__PURE__ */ import_react58.default.createElement(import_react59.HugeiconsIcon, { icon: import_core_free_icons18.ArrowRight01Icon, size: 14 })))))), currentView === "details" && detailsContent, modals);
2917
2924
  };
2925
+
2926
+ // src/components/AiApproveDecline.tsx
2927
+ var import_react60 = __toESM(require("react"));
2928
+ var import_react61 = require("@hugeicons/react");
2929
+ var import_core_free_icons19 = require("@hugeicons/core-free-icons");
2930
+ var AiApproveDecline = ({ suggestionTitle, suggestionValue, onApprove, onDecline, onEdit }) => {
2931
+ const [isEditing, setIsEditing] = (0, import_react60.useState)(false);
2932
+ const [editVal, setEditVal] = (0, import_react60.useState)(typeof suggestionValue === "string" ? suggestionValue : "");
2933
+ return /* @__PURE__ */ import_react60.default.createElement("div", { className: "border border-purple-100 bg-linear-to-bl from-purple-50/80 via-white to-white p-5 rounded-2xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ import_react60.default.createElement("div", null, /* @__PURE__ */ import_react60.default.createElement("span", { className: "text-[10px] tracking-widest text-purple-600 block mb-1 uppercase" }, "AI Suggestion: ", suggestionTitle), !isEditing ? /* @__PURE__ */ import_react60.default.createElement("div", { className: "text-sm text-black" }, suggestionValue) : /* @__PURE__ */ import_react60.default.createElement(
2934
+ "input",
2935
+ {
2936
+ type: "text",
2937
+ value: editVal,
2938
+ onChange: (e) => setEditVal(e.target.value),
2939
+ className: "w-full text-sm p-2 border-b border-purple-200 bg-transparent outline-none focus:border-purple-400 transition-colors",
2940
+ autoFocus: true
2941
+ }
2942
+ )), /* @__PURE__ */ import_react60.default.createElement("div", { className: "flex items-center gap-1 mt-2" }, !isEditing ? /* @__PURE__ */ import_react60.default.createElement(import_react60.default.Fragment, null, /* @__PURE__ */ import_react60.default.createElement("button", { onClick: onApprove, title: "Approve", className: "p-1.5 text-black hover:text-black hover:bg-neutral-50 rounded-full transition-colors outline-none" }, /* @__PURE__ */ import_react60.default.createElement(import_react61.HugeiconsIcon, { icon: import_core_free_icons19.CheckmarkCircle01Icon, size: 28 })), /* @__PURE__ */ import_react60.default.createElement("button", { onClick: onDecline, title: "Decline", className: "p-1.5 text-neutral-400 hover:text-neutral-400 hover:bg-neutral-50 rounded-full transition-colors outline-none" }, /* @__PURE__ */ import_react60.default.createElement(import_react61.HugeiconsIcon, { icon: import_core_free_icons19.CancelCircleIcon, size: 28 })), onEdit && /* @__PURE__ */ import_react60.default.createElement("button", { onClick: () => setIsEditing(true), title: "Edit", className: "ml-auto p-1.5 text-neutral-400 hover:text-black hover:bg-neutral-100 rounded-full transition-colors outline-none" }, /* @__PURE__ */ import_react60.default.createElement(import_react61.HugeiconsIcon, { icon: import_core_free_icons19.PencilEdit01Icon, size: 18 }))) : /* @__PURE__ */ import_react60.default.createElement(import_react60.default.Fragment, null, /* @__PURE__ */ import_react60.default.createElement("button", { onClick: () => {
2943
+ onEdit?.(editVal);
2944
+ setIsEditing(false);
2945
+ }, title: "Save Edit", className: "p-1.5 text-emerald-500 hover:text-emerald-600 hover:bg-emerald-50 rounded-full transition-colors outline-none" }, /* @__PURE__ */ import_react60.default.createElement(import_react61.HugeiconsIcon, { icon: import_core_free_icons19.CheckmarkCircle01Icon, size: 28 })), /* @__PURE__ */ import_react60.default.createElement("button", { onClick: () => setIsEditing(false), title: "Cancel Edit", className: "p-1.5 text-neutral-400 hover:text-black hover:bg-neutral-100 rounded-full transition-colors outline-none" }, /* @__PURE__ */ import_react60.default.createElement(import_react61.HugeiconsIcon, { icon: import_core_free_icons19.CancelCircleIcon, size: 28 })))));
2946
+ };
2947
+
2948
+ // src/components/AiStageCheck.tsx
2949
+ var import_react62 = __toESM(require("react"));
2950
+ var import_react63 = require("@hugeicons/react");
2951
+ var import_core_free_icons20 = require("@hugeicons/core-free-icons");
2952
+ var AiStageCheck = ({ tasks }) => {
2953
+ return /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex flex-col gap-3 p-5 rounded-2xl border border-purple-100 bg-linear-to-bl from-purple-50/80 via-white to-white relative overflow-hidden" }, /* @__PURE__ */ import_react62.default.createElement("span", { className: "text-[10px] tracking-widest text-purple-600 mb-1 uppercase" }, "AI Processing"), tasks.map((task) => /* @__PURE__ */ import_react62.default.createElement("div", { key: task.id, className: "flex items-center gap-3" }, task.status === "pending" && /* @__PURE__ */ import_react62.default.createElement("div", { className: "w-4 h-4 rounded-full border border-purple-200" }), task.status === "loading" && /* @__PURE__ */ import_react62.default.createElement(import_react63.HugeiconsIcon, { icon: import_core_free_icons20.Loading03Icon, size: 16, className: "animate-spin text-purple-500" }), task.status === "success" && /* @__PURE__ */ import_react62.default.createElement(import_react63.HugeiconsIcon, { icon: import_core_free_icons20.CheckmarkCircle02Icon, size: 16, className: "text-emerald-500" }), task.status === "error" && /* @__PURE__ */ import_react62.default.createElement(import_react63.HugeiconsIcon, { icon: import_core_free_icons20.CancelCircleIcon, size: 16, className: "text-red-500" }), /* @__PURE__ */ import_react62.default.createElement("span", { className: `text-xs transition-colors ${task.status === "success" ? "text-black" : task.status === "loading" ? "text-purple-700" : "text-neutral-500"}` }, task.label))));
2954
+ };
2955
+
2956
+ // src/components/Stagger.tsx
2957
+ var import_react64 = __toESM(require("react"));
2958
+ var import_react65 = require("@hugeicons/react");
2959
+ var import_core_free_icons21 = require("@hugeicons/core-free-icons");
2960
+ var Stagger = ({ steps, currentStep }) => {
2961
+ const getIconForStep = (stepName) => {
2962
+ const lowerName = stepName.toLowerCase();
2963
+ if (lowerName.includes("document")) return import_core_free_icons21.Upload01Icon;
2964
+ if (lowerName.includes("review")) return import_core_free_icons21.FileSyncIcon;
2965
+ if (lowerName.includes("submit")) return import_core_free_icons21.CloudUploadIcon;
2966
+ return import_core_free_icons21.Briefcase02Icon;
2967
+ };
2968
+ return /* @__PURE__ */ import_react64.default.createElement("div", { className: "w-full flex items-center justify-between relative z-0" }, /* @__PURE__ */ import_react64.default.createElement("div", { className: "absolute left-0 top-1/2 -translate-y-1/2 w-full h-px bg-neutral-200 -z-10" }), /* @__PURE__ */ import_react64.default.createElement("div", { className: "absolute left-0 top-1/2 -translate-y-1/2 h-px bg-emerald-500 -z-10 transition-all duration-500", style: { width: `${currentStep / (steps.length - 1) * 100}%` } }), steps.map((step, idx) => {
2969
+ const isActive = idx === currentStep;
2970
+ const isPassed = idx < currentStep;
2971
+ const colorClass = isPassed ? "bg-emerald-500 text-white" : isActive ? "bg-neutral-200 text-neutral-500" : "bg-neutral-200 text-neutral-500";
2972
+ return /* @__PURE__ */ import_react64.default.createElement("div", { key: step, className: `w-6 h-6 rounded-full flex items-center justify-center transition-colors duration-300 ${colorClass}` }, /* @__PURE__ */ import_react64.default.createElement(import_react65.HugeiconsIcon, { icon: getIconForStep(step), size: 11 }));
2973
+ }));
2974
+ };
2918
2975
  // Annotate the CommonJS export names for ESM import in node:
2919
2976
  0 && (module.exports = {
2920
2977
  AITranscriptionFeature,
2978
+ AiApproveDecline,
2979
+ AiStageCheck,
2921
2980
  AppBento2,
2922
2981
  Faq,
2923
2982
  FeatureScroll,
@@ -2938,6 +2997,7 @@ var UniversalDirectoryPage = ({
2938
2997
  PlatformFeatures,
2939
2998
  PortfolioHero,
2940
2999
  ProductHero,
3000
+ Stagger,
2941
3001
  TextInput,
2942
3002
  ThreeDActionButton,
2943
3003
  ThreeDButton,
package/dist/index.mjs CHANGED
@@ -2840,6 +2840,10 @@ var PageSpinner4 = () => /* @__PURE__ */ React37.createElement("div", { classNam
2840
2840
  var UniversalDirectoryPage = ({
2841
2841
  headerTitle,
2842
2842
  headerDescription,
2843
+ hideSearch = false,
2844
+ // Default to false
2845
+ headerAction,
2846
+ // Capture the action button
2843
2847
  searchPlaceholder = "Search...",
2844
2848
  searchQuery,
2845
2849
  onSearchChange,
@@ -2854,14 +2858,14 @@ var UniversalDirectoryPage = ({
2854
2858
  detailsContent,
2855
2859
  modals
2856
2860
  }) => {
2857
- return /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl fade-in duration-300 p-6 rounded-2xl bg-white min-h-full" }, /* @__PURE__ */ React37.createElement(ManagedToaster, null), /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, currentView === "list" ? /* @__PURE__ */ React37.createElement("div", { className: "w-full" }, /* @__PURE__ */ React37.createElement("h1", { className: "text-xl text-black mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ React37.createElement("p", { className: "text-xs text-neutral-500 mb-6" }, headerDescription), /* @__PURE__ */ React37.createElement(
2861
+ return /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl fade-in duration-300 p-6 rounded-2xl bg-white min-h-full" }, /* @__PURE__ */ React37.createElement(ManagedToaster, null), /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, currentView === "list" ? /* @__PURE__ */ React37.createElement(React37.Fragment, null, /* @__PURE__ */ React37.createElement("div", { className: "w-full" }, /* @__PURE__ */ React37.createElement("h1", { className: "text-xl text-black mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ React37.createElement("p", { className: "text-xs text-neutral-500 mb-6" }, headerDescription), !hideSearch && /* @__PURE__ */ React37.createElement(
2858
2862
  TextInput,
2859
2863
  {
2860
2864
  placeholder: searchPlaceholder,
2861
2865
  value: searchQuery,
2862
2866
  onChange: onSearchChange
2863
2867
  }
2864
- )) : /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col items-start gap-3" }, /* @__PURE__ */ React37.createElement("button", { onClick: onBackToList, className: "text-[10px] text-neutral-400 hover:text-black tracking-[0.2em] flex items-center gap-1.5 transition-colors outline-none uppercase" }, /* @__PURE__ */ React37.createElement(HugeiconsIcon22, { icon: ArrowLeft01Icon6, size: 12 }), " Back"))), currentView === "list" && /* @__PURE__ */ React37.createElement("div", { className: "w-full overflow-hidden pt-2" }, isLoading ? /* @__PURE__ */ React37.createElement(PageSpinner4, null) : /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React37.createElement("div", { className: "divide-y divide-neutral-100" }, items.length === 0 ? /* @__PURE__ */ React37.createElement("p", { className: "text-xs text-neutral-500 py-6 text-center" }, "No records found.") : items.map((item) => /* @__PURE__ */ React37.createElement(
2868
+ )), headerAction && /* @__PURE__ */ React37.createElement("div", { className: "shrink-0 w-full sm:w-auto mt-4 sm:mt-0" }, headerAction)) : /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col items-start gap-3" }, /* @__PURE__ */ React37.createElement("button", { onClick: onBackToList, className: "text-[10px] text-neutral-400 hover:text-black tracking-[0.2em] flex items-center gap-1.5 transition-colors outline-none uppercase" }, /* @__PURE__ */ React37.createElement(HugeiconsIcon22, { icon: ArrowLeft01Icon6, size: 12 }), " Back"))), currentView === "list" && /* @__PURE__ */ React37.createElement("div", { className: "w-full overflow-hidden pt-2" }, isLoading ? /* @__PURE__ */ React37.createElement(PageSpinner4, null) : /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React37.createElement("div", { className: "divide-y divide-neutral-100" }, items.length === 0 ? /* @__PURE__ */ React37.createElement("p", { className: "text-xs text-neutral-500 py-6 text-center" }, "No records found.") : items.map((item) => /* @__PURE__ */ React37.createElement(
2865
2869
  "div",
2866
2870
  {
2867
2871
  key: item.id,
@@ -2872,8 +2876,60 @@ var UniversalDirectoryPage = ({
2872
2876
  item.rightBadge && /* @__PURE__ */ React37.createElement("div", { className: "shrink-0 pl-2" }, /* @__PURE__ */ React37.createElement("span", { className: `text-[10px] tracking-[0.2em] px-3 py-1 rounded-full whitespace-nowrap uppercase ${item.rightBadgeClass || "text-neutral-500 border border-neutral-200 bg-white"}` }, item.rightBadge))
2873
2877
  ))), totalPages > 1 && /* @__PURE__ */ React37.createElement("div", { className: "flex items-center justify-between p-4 sm:p-5" }, /* @__PURE__ */ React37.createElement("span", { className: "text-[10px] text-neutral-400 tracking-[0.2em] uppercase" }, "Page ", currentPage, " of ", totalPages), /* @__PURE__ */ React37.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React37.createElement("button", { onClick: () => onPageChange(currentPage - 1), disabled: currentPage === 1 || isLoading, className: "p-2 border border-neutral-200 rounded-full bg-white text-neutral-500 hover:text-black outline-none disabled:opacity-30" }, /* @__PURE__ */ React37.createElement(HugeiconsIcon22, { icon: ArrowLeft01Icon6, size: 14 })), /* @__PURE__ */ React37.createElement("button", { onClick: () => onPageChange(currentPage + 1), disabled: currentPage >= totalPages || isLoading, className: "p-2 border border-neutral-200 rounded-full bg-white text-neutral-500 hover:text-black outline-none disabled:opacity-30" }, /* @__PURE__ */ React37.createElement(HugeiconsIcon22, { icon: ArrowRight01Icon6, size: 14 })))))), currentView === "details" && detailsContent, modals);
2874
2878
  };
2879
+
2880
+ // src/components/AiApproveDecline.tsx
2881
+ import React38, { useState as useState19 } from "react";
2882
+ import { HugeiconsIcon as HugeiconsIcon23 } from "@hugeicons/react";
2883
+ import { CheckmarkCircle01Icon as CheckmarkCircle01Icon2, CancelCircleIcon, PencilEdit01Icon } from "@hugeicons/core-free-icons";
2884
+ var AiApproveDecline = ({ suggestionTitle, suggestionValue, onApprove, onDecline, onEdit }) => {
2885
+ const [isEditing, setIsEditing] = useState19(false);
2886
+ const [editVal, setEditVal] = useState19(typeof suggestionValue === "string" ? suggestionValue : "");
2887
+ return /* @__PURE__ */ React38.createElement("div", { className: "border border-purple-100 bg-linear-to-bl from-purple-50/80 via-white to-white p-5 rounded-2xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ React38.createElement("div", null, /* @__PURE__ */ React38.createElement("span", { className: "text-[10px] tracking-widest text-purple-600 block mb-1 uppercase" }, "AI Suggestion: ", suggestionTitle), !isEditing ? /* @__PURE__ */ React38.createElement("div", { className: "text-sm text-black" }, suggestionValue) : /* @__PURE__ */ React38.createElement(
2888
+ "input",
2889
+ {
2890
+ type: "text",
2891
+ value: editVal,
2892
+ onChange: (e) => setEditVal(e.target.value),
2893
+ className: "w-full text-sm p-2 border-b border-purple-200 bg-transparent outline-none focus:border-purple-400 transition-colors",
2894
+ autoFocus: true
2895
+ }
2896
+ )), /* @__PURE__ */ React38.createElement("div", { className: "flex items-center gap-1 mt-2" }, !isEditing ? /* @__PURE__ */ React38.createElement(React38.Fragment, null, /* @__PURE__ */ React38.createElement("button", { onClick: onApprove, title: "Approve", className: "p-1.5 text-black hover:text-black hover:bg-neutral-50 rounded-full transition-colors outline-none" }, /* @__PURE__ */ React38.createElement(HugeiconsIcon23, { icon: CheckmarkCircle01Icon2, size: 28 })), /* @__PURE__ */ React38.createElement("button", { onClick: onDecline, title: "Decline", className: "p-1.5 text-neutral-400 hover:text-neutral-400 hover:bg-neutral-50 rounded-full transition-colors outline-none" }, /* @__PURE__ */ React38.createElement(HugeiconsIcon23, { icon: CancelCircleIcon, size: 28 })), onEdit && /* @__PURE__ */ React38.createElement("button", { onClick: () => setIsEditing(true), title: "Edit", className: "ml-auto p-1.5 text-neutral-400 hover:text-black hover:bg-neutral-100 rounded-full transition-colors outline-none" }, /* @__PURE__ */ React38.createElement(HugeiconsIcon23, { icon: PencilEdit01Icon, size: 18 }))) : /* @__PURE__ */ React38.createElement(React38.Fragment, null, /* @__PURE__ */ React38.createElement("button", { onClick: () => {
2897
+ onEdit?.(editVal);
2898
+ setIsEditing(false);
2899
+ }, title: "Save Edit", className: "p-1.5 text-emerald-500 hover:text-emerald-600 hover:bg-emerald-50 rounded-full transition-colors outline-none" }, /* @__PURE__ */ React38.createElement(HugeiconsIcon23, { icon: CheckmarkCircle01Icon2, size: 28 })), /* @__PURE__ */ React38.createElement("button", { onClick: () => setIsEditing(false), title: "Cancel Edit", className: "p-1.5 text-neutral-400 hover:text-black hover:bg-neutral-100 rounded-full transition-colors outline-none" }, /* @__PURE__ */ React38.createElement(HugeiconsIcon23, { icon: CancelCircleIcon, size: 28 })))));
2900
+ };
2901
+
2902
+ // src/components/AiStageCheck.tsx
2903
+ import React39 from "react";
2904
+ import { HugeiconsIcon as HugeiconsIcon24 } from "@hugeicons/react";
2905
+ import { Loading03Icon as Loading03Icon11, CheckmarkCircle02Icon, CancelCircleIcon as CancelCircleIcon2 } from "@hugeicons/core-free-icons";
2906
+ var AiStageCheck = ({ tasks }) => {
2907
+ return /* @__PURE__ */ React39.createElement("div", { className: "flex flex-col gap-3 p-5 rounded-2xl border border-purple-100 bg-linear-to-bl from-purple-50/80 via-white to-white relative overflow-hidden" }, /* @__PURE__ */ React39.createElement("span", { className: "text-[10px] tracking-widest text-purple-600 mb-1 uppercase" }, "AI Processing"), tasks.map((task) => /* @__PURE__ */ React39.createElement("div", { key: task.id, className: "flex items-center gap-3" }, task.status === "pending" && /* @__PURE__ */ React39.createElement("div", { className: "w-4 h-4 rounded-full border border-purple-200" }), task.status === "loading" && /* @__PURE__ */ React39.createElement(HugeiconsIcon24, { icon: Loading03Icon11, size: 16, className: "animate-spin text-purple-500" }), task.status === "success" && /* @__PURE__ */ React39.createElement(HugeiconsIcon24, { icon: CheckmarkCircle02Icon, size: 16, className: "text-emerald-500" }), task.status === "error" && /* @__PURE__ */ React39.createElement(HugeiconsIcon24, { icon: CancelCircleIcon2, size: 16, className: "text-red-500" }), /* @__PURE__ */ React39.createElement("span", { className: `text-xs transition-colors ${task.status === "success" ? "text-black" : task.status === "loading" ? "text-purple-700" : "text-neutral-500"}` }, task.label))));
2908
+ };
2909
+
2910
+ // src/components/Stagger.tsx
2911
+ import React40 from "react";
2912
+ import { HugeiconsIcon as HugeiconsIcon25 } from "@hugeicons/react";
2913
+ import { Briefcase02Icon, Upload01Icon as Upload01Icon2, FileSyncIcon, CloudUploadIcon } from "@hugeicons/core-free-icons";
2914
+ var Stagger = ({ steps, currentStep }) => {
2915
+ const getIconForStep = (stepName) => {
2916
+ const lowerName = stepName.toLowerCase();
2917
+ if (lowerName.includes("document")) return Upload01Icon2;
2918
+ if (lowerName.includes("review")) return FileSyncIcon;
2919
+ if (lowerName.includes("submit")) return CloudUploadIcon;
2920
+ return Briefcase02Icon;
2921
+ };
2922
+ return /* @__PURE__ */ React40.createElement("div", { className: "w-full flex items-center justify-between relative z-0" }, /* @__PURE__ */ React40.createElement("div", { className: "absolute left-0 top-1/2 -translate-y-1/2 w-full h-px bg-neutral-200 -z-10" }), /* @__PURE__ */ React40.createElement("div", { className: "absolute left-0 top-1/2 -translate-y-1/2 h-px bg-emerald-500 -z-10 transition-all duration-500", style: { width: `${currentStep / (steps.length - 1) * 100}%` } }), steps.map((step, idx) => {
2923
+ const isActive = idx === currentStep;
2924
+ const isPassed = idx < currentStep;
2925
+ const colorClass = isPassed ? "bg-emerald-500 text-white" : isActive ? "bg-neutral-200 text-neutral-500" : "bg-neutral-200 text-neutral-500";
2926
+ return /* @__PURE__ */ React40.createElement("div", { key: step, className: `w-6 h-6 rounded-full flex items-center justify-center transition-colors duration-300 ${colorClass}` }, /* @__PURE__ */ React40.createElement(HugeiconsIcon25, { icon: getIconForStep(step), size: 11 }));
2927
+ }));
2928
+ };
2875
2929
  export {
2876
2930
  AITranscriptionFeature,
2931
+ AiApproveDecline,
2932
+ AiStageCheck,
2877
2933
  AppBento2,
2878
2934
  Faq,
2879
2935
  FeatureScroll,
@@ -2894,6 +2950,7 @@ export {
2894
2950
  PlatformFeatures,
2895
2951
  PortfolioHero,
2896
2952
  ProductHero,
2953
+ Stagger,
2897
2954
  TextInput,
2898
2955
  ThreeDActionButton,
2899
2956
  ThreeDButton,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@retinalabsllc/zairusjs",
3
- "version": "0.2.6",
3
+ "version": "0.2.7",
4
4
  "description": "A perceptive, Ai data driven Next.js UI component library.",
5
5
  "author": "Retina Labs Company",
6
6
  "license": "MIT",