@spaceinvoices/react-ui 0.4.10 → 0.4.12

package/src/common/autocomplete.tsx

@@ -7,6 +7,8 @@ import { cn } from "@/ui/lib/utils";
 export type AutocompleteOption = {
   value: string;
   label: string | React.ReactNode;
+  testId?: string;
+  dataDemo?: string;
 };
 
 type AutocompleteProps = {
@@ -26,7 +28,9 @@ type AutocompleteProps = {
   searchValue?: string;
   displayValue?: string;
   inputTestId?: string;
+  inputDataDemo?: string;
   inputRef?: React.Ref<HTMLInputElement>;
+  ariaInvalid?: boolean;
 };
 
 export function Autocomplete({
@@ -46,20 +50,43 @@ export function Autocomplete({
   searchValue: externalSearchValue,
   displayValue,
   inputTestId,
+  inputDataDemo,
   inputRef: externalInputRef,
+  ariaInvalid = false,
 }: AutocompleteProps) {
   const [open, setOpen] = React.useState(false);
   const [internalSearchValue, setInternalSearchValue] = React.useState("");
   const inputRef = React.useRef<HTMLInputElement>(null);
   const suppressAutoOpenRef = React.useRef(false);
   const blurCloseRef = React.useRef(false);
-  const focusOpenRef = React.useRef(false);
   const selectedValueRef = React.useRef<string | null>(null);
 
   const searchValue = externalSearchValue ?? internalSearchValue;
   // Show displayValue when not typing, otherwise show what user is typing
   const inputValue = searchValue || displayValue;
 
+  const finalizePendingInput = () => {
+    const typedValue = searchValue?.trim();
+    const shouldCommitTypedValue =
+      !!typedValue &&
+      typedValue !== displayValue &&
+      selectedValueRef.current == null &&
+      commitUnselectedOnBlur &&
+      !!onCommitUnselectedInput;
+
+    if (shouldCommitTypedValue) {
+      onCommitUnselectedInput(typedValue);
+      selectedValueRef.current = "__implicit_commit__";
+      return;
+    }
+
+    if (selectedValueRef.current == null) {
+      const restoredValue = committedDisplayValue ?? displayValue ?? "";
+      setInternalSearchValue("");
+      onSearch?.(restoredValue);
+    }
+  };
+
   const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     const value = e.target.value;
     suppressAutoOpenRef.current = false;
@@ -101,11 +128,7 @@ export function Autocomplete({
     if (suppressAutoOpenRef.current) return;
     // Only open popover on focus if there's no displayValue (no customer selected)
     if (!displayValue && options.length > 0) {
-      focusOpenRef.current = true;
       setOpen(true);
-      requestAnimationFrame(() => {
-        focusOpenRef.current = false;
-      });
     }
   };
 
@@ -116,21 +139,7 @@ export function Autocomplete({
       return;
     }
 
-    const typedValue = searchValue?.trim();
-    const shouldCommitTypedValue =
-      !!typedValue &&
-      typedValue !== displayValue &&
-      selectedValueRef.current == null &&
-      commitUnselectedOnBlur &&
-      !!onCommitUnselectedInput;
-
-    if (shouldCommitTypedValue) {
-      onCommitUnselectedInput(typedValue);
-    } else if (selectedValueRef.current == null) {
-      const restoredValue = committedDisplayValue ?? displayValue ?? "";
-      setInternalSearchValue("");
-      onSearch?.(restoredValue);
-    }
+    finalizePendingInput();
 
     blurCloseRef.current = true;
     suppressAutoOpenRef.current = false;
@@ -149,14 +158,16 @@ export function Autocomplete({
     }
   };
 
-  // Handle popover open/close - prevent closing when input is focused
-  const handleOpenChange = (newOpen: boolean) => {
-    if (!newOpen && focusOpenRef.current) {
+  // Ignore synthetic "outside press" close events that originate from the anchor input itself.
+  const handleOpenChange = (newOpen: boolean, eventDetails?: { reason?: string; event?: Event }) => {
+    if (!newOpen && eventDetails?.reason === "outside-press" && eventDetails.event?.target === inputRef.current) {
       return;
     }
-    if (!newOpen && document.activeElement === inputRef.current && !blurCloseRef.current) {
-      return;
+
+    if (!newOpen && eventDetails?.reason === "outside-press" && eventDetails.event?.target !== inputRef.current) {
+      finalizePendingInput();
     }
+
     setOpen(newOpen);
   };
 
@@ -181,11 +192,14 @@ export function Autocomplete({
         disabled={disabled}
         autoComplete="off"
         data-testid={inputTestId}
+        data-demo={inputDataDemo}
+        aria-invalid={ariaInvalid || undefined}
       />
       <Popover.Portal>
         <Popover.Positioner anchor={inputRef} align="start" sideOffset={4} className="isolate z-50">
           <Popover.Popup
             initialFocus={false}
+            finalFocus={false}
             className="flex flex-col rounded-md bg-popover p-0 text-popover-foreground shadow-md outline-hidden ring-1 ring-foreground/10"
             style={{ width: inputRef.current?.offsetWidth }}
           >
@@ -199,6 +213,8 @@ export function Autocomplete({
                       value={option.value}
                       onSelect={() => handleSelect(option.value)}
                       className={cn(value === option.value && "font-bold")}
+                      data-testid={option.testId}
+                      data-demo={option.dataDemo}
                     >
                       {option.label}
                     </CommandItem>

package/src/components/activities/locales/bg.ts

@@ -0,0 +1,21 @@
+export default {
+  Activity: "Activity",
+  created: "created",
+  updated: "updated",
+  deleted: "deleted",
+  voided: "voided",
+  sent: "sent",
+  exported: "exported",
+  synced: "synced",
+  fiscalized: "fiscalized",
+  user: "user",
+  system: "system",
+  cron: "cron",
+  webhook: "webhook",
+  "No activities": "No activities",
+  "No activities yet for this resource": "No activities yet for this resource",
+  "just now": "just now",
+  "minutes ago": "minutes ago",
+  "hours ago": "hours ago",
+  "days ago": "days ago",
+} as const;

package/src/components/activities/locales/cs.ts

@@ -0,0 +1,21 @@
+export default {
+  Activity: "Activity",
+  created: "created",
+  updated: "updated",
+  deleted: "deleted",
+  voided: "voided",
+  sent: "sent",
+  exported: "exported",
+  synced: "synced",
+  fiscalized: "fiscalized",
+  user: "user",
+  system: "system",
+  cron: "cron",
+  webhook: "webhook",
+  "No activities": "No activities",
+  "No activities yet for this resource": "No activities yet for this resource",
+  "just now": "just now",
+  "minutes ago": "minutes ago",
+  "hours ago": "hours ago",
+  "days ago": "days ago",
+} as const;

package/src/components/activities/locales/en.ts

@@ -0,0 +1,21 @@
+export default {
+  Activity: "Activity",
+  created: "created",
+  updated: "updated",
+  deleted: "deleted",
+  voided: "voided",
+  sent: "sent",
+  exported: "exported",
+  synced: "synced",
+  fiscalized: "fiscalized",
+  user: "user",
+  system: "system",
+  cron: "cron",
+  webhook: "webhook",
+  "No activities": "No activities",
+  "No activities yet for this resource": "No activities yet for this resource",
+  "just now": "just now",
+  "minutes ago": "minutes ago",
+  "hours ago": "hours ago",
+  "days ago": "days ago",
+} as const;

package/src/components/activities/locales/et.ts

@@ -0,0 +1,21 @@
+export default {
+  Activity: "Activity",
+  created: "created",
+  updated: "updated",
+  deleted: "deleted",
+  voided: "voided",
+  sent: "sent",
+  exported: "exported",
+  synced: "synced",
+  fiscalized: "fiscalized",
+  user: "user",
+  system: "system",
+  cron: "cron",
+  webhook: "webhook",
+  "No activities": "No activities",
+  "No activities yet for this resource": "No activities yet for this resource",
+  "just now": "just now",
+  "minutes ago": "minutes ago",
+  "hours ago": "hours ago",
+  "days ago": "days ago",
+} as const;

package/src/components/activities/locales/fi.ts

@@ -0,0 +1,21 @@
+export default {
+  Activity: "Activity",
+  created: "created",
+  updated: "updated",
+  deleted: "deleted",
+  voided: "voided",
+  sent: "sent",
+  exported: "exported",
+  synced: "synced",
+  fiscalized: "fiscalized",
+  user: "user",
+  system: "system",
+  cron: "cron",
+  webhook: "webhook",
+  "No activities": "No activities",
+  "No activities yet for this resource": "No activities yet for this resource",
+  "just now": "just now",
+  "minutes ago": "minutes ago",
+  "hours ago": "hours ago",
+  "days ago": "days ago",
+} as const;

package/src/components/activities/locales/is.ts

@@ -0,0 +1,21 @@
+export default {
+  Activity: "Activity",
+  created: "created",
+  updated: "updated",
+  deleted: "deleted",
+  voided: "voided",
+  sent: "sent",
+  exported: "exported",
+  synced: "synced",
+  fiscalized: "fiscalized",
+  user: "user",
+  system: "system",
+  cron: "cron",
+  webhook: "webhook",
+  "No activities": "No activities",
+  "No activities yet for this resource": "No activities yet for this resource",
+  "just now": "just now",
+  "minutes ago": "minutes ago",
+  "hours ago": "hours ago",
+  "days ago": "days ago",
+} as const;

package/src/components/activities/locales/nb.ts

@@ -0,0 +1,21 @@
+export default {
+  Activity: "Activity",
+  created: "created",
+  updated: "updated",
+  deleted: "deleted",
+  voided: "voided",
+  sent: "sent",
+  exported: "exported",
+  synced: "synced",
+  fiscalized: "fiscalized",
+  user: "user",
+  system: "system",
+  cron: "cron",
+  webhook: "webhook",
+  "No activities": "No activities",
+  "No activities yet for this resource": "No activities yet for this resource",
+  "just now": "just now",
+  "minutes ago": "minutes ago",
+  "hours ago": "hours ago",
+  "days ago": "days ago",
+} as const;

package/src/components/activities/locales/sk.ts

@@ -0,0 +1,21 @@
+export default {
+  Activity: "Activity",
+  created: "created",
+  updated: "updated",
+  deleted: "deleted",
+  voided: "voided",
+  sent: "sent",
+  exported: "exported",
+  synced: "synced",
+  fiscalized: "fiscalized",
+  user: "user",
+  system: "system",
+  cron: "cron",
+  webhook: "webhook",
+  "No activities": "No activities",
+  "No activities yet for this resource": "No activities yet for this resource",
+  "just now": "just now",
+  "minutes ago": "minutes ago",
+  "hours ago": "hours ago",
+  "days ago": "days ago",
+} as const;

package/src/components/activities/locales/sv.ts

@@ -0,0 +1,21 @@
+export default {
+  Activity: "Activity",
+  created: "created",
+  updated: "updated",
+  deleted: "deleted",
+  voided: "voided",
+  sent: "sent",
+  exported: "exported",
+  synced: "synced",
+  fiscalized: "fiscalized",
+  user: "user",
+  system: "system",
+  cron: "cron",
+  webhook: "webhook",
+  "No activities": "No activities",
+  "No activities yet for this resource": "No activities yet for this resource",
+  "just now": "just now",
+  "minutes ago": "minutes ago",
+  "hours ago": "hours ago",
+  "days ago": "days ago",
+} as const;

package/src/components/advance-invoices/advance-invoices.hooks.ts

@@ -1,7 +1,7 @@
 import type { AdvanceInvoice, CreateAdvanceInvoice } from "@spaceinvoices/js-sdk";
+import { advanceInvoices } from "@spaceinvoices/js-sdk";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { NEXT_DOCUMENT_NUMBER_CACHE_KEY } from "@/ui/hooks/use-next-document-number";
-import { useSDK } from "@/ui/providers/sdk-provider";
 
 // Define constants for cache keys
 export const ADVANCE_INVOICES_CACHE_KEY = "advance-invoices";
@@ -17,12 +17,11 @@ type UseCreateAdvanceInvoiceOptions = {
 };
 
 export function useCreateAdvanceInvoice({ entityId, onSuccess, onError }: UseCreateAdvanceInvoiceOptions) {
-  const { sdk } = useSDK();
   const queryClient = useQueryClient();
 
   return useMutation({
     mutationFn: async (data: CreateAdvanceInvoice) => {
-      return sdk.advanceInvoices.create(data, { entity_id: entityId });
+      return advanceInvoices.create(data, { entity_id: entityId });
     },
     onSuccess: (data) => {
       // Invalidate advance invoices list cache