@datatechsolutions/ui 2.7.137 → 2.7.139

package/dist/{chunk-5IE2FIWT.js → chunk-JYX3ILSA.js}

@@ -766,7 +766,8 @@ function IconButton({
       isIosColor && finalColor === "ios-red" && "text-[#FF3B30] dark:text-[#FF453A]",
       isIosColor && finalColor === "ios-green" && "text-[#34C759] dark:text-[#30D158]",
       isIosColor && finalColor === "ios-orange" && "text-[#FF9500] dark:text-[#FF9F0A]",
-      isIosColor && finalColor === "ios-purple" && "text-[#AF52DE] dark:text-[#BF5AF2]"
+      isIosColor && finalColor === "ios-purple" && "text-[#AF52DE] dark:text-[#BF5AF2]",
+      !isIosColor && "text-slate-700 dark:text-slate-300"
     ),
     outline: clsx__default.default(
       "bg-transparent border",
@@ -954,6 +955,7 @@ var Input = React11.forwardRef(
     const helperId = `${inputId}-helper`;
     const [isFocused, setIsFocused] = React11.useState(false);
     const [showPassword, setShowPassword] = React11.useState(false);
+    const prefersReducedMotion2 = framerMotion.useReducedMotion();
     const hasValue = value !== void 0 && value !== "";
     const characterCount = typeof value === "string" ? value.length : 0;
     const isOverLimit = maxCharacters ? characterCount > maxCharacters : false;
@@ -988,14 +990,14 @@ var Input = React11.forwardRef(
         liquid-surface h-12 w-full rounded-xl border-0
         px-4 py-3 text-base
         text-slate-900 dark:text-white
-        placeholder:text-slate-400 dark:placeholder:text-slate-500
+        placeholder:text-slate-500 dark:placeholder:text-slate-500
         transition-all duration-200
         disabled:cursor-not-allowed disabled:opacity-50
       ` : `
         liquid-surface h-11 w-full rounded-xl
         px-3.5 py-2.5 text-base
         text-slate-900 dark:text-white
-        placeholder:text-slate-400 dark:placeholder:text-slate-500
+        placeholder:text-slate-500 dark:placeholder:text-slate-500
         transition-all duration-200
         disabled:cursor-not-allowed disabled:opacity-50
       `;
@@ -1023,7 +1025,7 @@ var Input = React11.forwardRef(
           exit: { opacity: 0, scale: 0.8 },
           transition: { duration: 0.15 },
           onClick: togglePassword,
-          className: "p-1 rounded-full text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 hover:bg-white/40 dark:hover:bg-white/[0.08] transition-colors",
+          className: "p-2 min-h-[44px] min-w-[44px] flex items-center justify-center rounded-full text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 hover:bg-white/40 dark:hover:bg-white/[0.08] transition-colors",
           "aria-label": showPassword ? t("hidePassword") : t("showPassword"),
           children: showPassword ? /* @__PURE__ */ jsxRuntime.jsx(solid.EyeSlashIcon, { className: "h-5 w-5" }) : /* @__PURE__ */ jsxRuntime.jsx(solid.EyeIcon, { className: "h-5 w-5" })
         }
@@ -1037,7 +1039,8 @@ var Input = React11.forwardRef(
           exit: { opacity: 0, scale: 0.8 },
           transition: { duration: 0.15 },
           onClick: handleClear,
-          className: "p-1 rounded-full text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 hover:bg-white/40 dark:hover:bg-white/[0.08] transition-colors",
+          className: "p-2 min-h-[44px] min-w-[44px] flex items-center justify-center rounded-full text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 hover:bg-white/40 dark:hover:bg-white/[0.08] transition-colors",
+          "aria-label": "Clear input",
           children: /* @__PURE__ */ jsxRuntime.jsx(solid.XMarkIcon, { className: "h-5 w-5" })
         }
       ) })
@@ -1065,7 +1068,7 @@ var Input = React11.forwardRef(
             children: successMessage
           }
         ),
-        !error && !successMessage && helperText && /* @__PURE__ */ jsxRuntime.jsx("p", { id: helperId, className: "text-sm text-slate-500 dark:text-slate-400", children: helperText })
+        !error && !successMessage && helperText && /* @__PURE__ */ jsxRuntime.jsx("p", { id: helperId, className: "text-sm text-slate-600 dark:text-slate-400", children: helperText })
       ] }),
       showCharacterCount && /* @__PURE__ */ jsxRuntime.jsxs(
         "span",
@@ -1108,16 +1111,33 @@ var Input = React11.forwardRef(
               ...props
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx(
+          prefersReducedMotion2 ? /* @__PURE__ */ jsxRuntime.jsx(
+            "label",
+            {
+              htmlFor: inputId,
+              className: `
+                  absolute left-3.5 pointer-events-none
+                  text-slate-500 dark:text-slate-400
+                  transition-all duration-200
+                  ${icon ? "left-11" : ""}
+                `,
+              style: {
+                top: hasValue || isFocused ? "0.5rem" : "50%",
+                transform: hasValue || isFocused ? "none" : "translateY(-50%)",
+                fontSize: hasValue || isFocused ? "0.75rem" : "1rem"
+              },
+              children: label
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx(
             framerMotion.motion.label,
             {
               htmlFor: inputId,
               className: `
-                absolute left-3.5 pointer-events-none
-                text-slate-500 dark:text-slate-400
-                transition-all duration-200
-                ${icon ? "left-11" : ""}
-              `,
+                  absolute left-3.5 pointer-events-none
+                  text-slate-500 dark:text-slate-400
+                  transition-all duration-200
+                  ${icon ? "left-11" : ""}
+                `,
               initial: false,
               animate: {
                 top: hasValue || isFocused ? "0.5rem" : "50%",
@@ -2014,24 +2034,46 @@ function HeroSection({
   labelExtra,
   children
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "liquid-surface overflow-hidden rounded-2xl", children: [
-    gradient && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-1.5 w-full bg-gradient-to-r ${gradient}` }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-5 sm:p-8", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-slate-600 dark:text-white/70", children: [
-        icon,
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: label }),
-        labelExtra
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex flex-wrap items-center justify-between gap-4", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl font-bold tracking-tight text-slate-900 dark:text-white sm:text-4xl", children: title }),
-        actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-3", children: actions })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 max-w-xl text-sm text-slate-500 dark:text-white/60 sm:mt-3 sm:text-lg", children: subtitle }),
-      toolbar && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4", children: toolbar }),
-      badges && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-6 flex flex-wrap items-center gap-4", children: badges }),
-      children
-    ] })
-  ] });
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      role: "banner",
+      "data-testid": "hero-section",
+      className: "liquid-surface overflow-hidden rounded-2xl",
+      children: [
+        gradient && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-1.5 w-full bg-gradient-to-r ${gradient}` }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-5 sm:p-8", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-slate-600 dark:text-white/70", children: [
+            icon,
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: label }),
+            labelExtra
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex flex-wrap items-center justify-between gap-4", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "h1",
+              {
+                "data-testid": "hero-title",
+                className: "text-2xl font-bold tracking-tight text-slate-900 dark:text-white sm:text-4xl",
+                children: title
+              }
+            ),
+            actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-3", children: actions })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "p",
+            {
+              "data-testid": "hero-subtitle",
+              className: "mt-2 max-w-xl text-sm text-slate-500 dark:text-white/60 sm:mt-3 sm:text-lg",
+              children: subtitle
+            }
+          ),
+          toolbar && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "hero-toolbar", className: "mt-4", children: toolbar }),
+          badges && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-6 flex flex-wrap items-center gap-4", children: badges }),
+          children
+        ] })
+      ]
+    }
+  );
 }
 var DEFAULT_STYLE_CONFIG = {
   default: {
@@ -2304,6 +2346,9 @@ function StatCard({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
+      role: "status",
+      "aria-label": label,
+      "data-testid": label ? `stat-card-${label.toLowerCase().replace(/\s+/g, "-")}` : "stat-card",
       onClick,
       className: `group relative overflow-hidden rounded-xl p-5 transition-all duration-200 ${isClickable ? "cursor-pointer" : ""} ${isActive ? `bg-gradient-to-br ${colorConfig.activeGradient} ring-2 ring-offset-2 ${colorConfig.activeRing} shadow-xl` : `liquid-surface hover:shadow-md ${isFiltered ? "ring-indigo-300 dark:ring-indigo-500/50" : isUrgent ? "ring-amber-300 dark:ring-amber-500/50" : ""}`} ${className}`,
       children: [
@@ -2335,6 +2380,7 @@ function StatCard({
           /* @__PURE__ */ jsxRuntime.jsx(
             "p",
             {
+              "data-testid": "stat-card-value",
               className: `mt-4 text-3xl font-bold ${isActive ? "text-white" : isUrgent ? colorConfig.urgentValueColor || colorConfig.valueColor : colorConfig.valueColor}`,
               children: value
             }
@@ -2342,6 +2388,7 @@ function StatCard({
           /* @__PURE__ */ jsxRuntime.jsx(
             "p",
             {
+              "data-testid": "stat-card-label",
               className: `mt-1 text-sm ${isActive ? "text-white/75" : "text-slate-500 dark:text-slate-400"}`,
               children: label
             }
@@ -2645,7 +2692,7 @@ function CircleSpinner({ size, color, className, ariaLabel }) {
     "div",
     {
       className: clsx.clsx(
-        "rounded-full animate-spin",
+        "rounded-full animate-spin motion-reduce:animate-none",
         config.size,
         config.border,
         colors3.track,
@@ -2660,9 +2707,10 @@ function CircleSpinner({ size, color, className, ariaLabel }) {
 function DotsSpinner({ size, color, className, ariaLabel }) {
   const config = sizeConfig[size];
   const colors3 = colorClasses2[color];
+  const prefersReducedMotion2 = framerMotion.useReducedMotion();
   const dotVariants = {
     initial: { scale: 0.8, opacity: 0.4 },
-    animate: { scale: 1, opacity: 1 }
+    animate: prefersReducedMotion2 ? { scale: 1, opacity: 1 } : { scale: 1, opacity: 1 }
   };
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx.clsx("flex items-center gap-1", className), role: "status", "aria-label": ariaLabel, children: [0, 1, 2].map((index) => /* @__PURE__ */ jsxRuntime.jsx(
     framerMotion.motion.div,
@@ -2675,7 +2723,7 @@ function DotsSpinner({ size, color, className, ariaLabel }) {
       variants: dotVariants,
       initial: "initial",
       animate: "animate",
-      transition: {
+      transition: prefersReducedMotion2 ? { duration: 0 } : {
         duration: 0.5,
         repeat: Infinity,
         repeatType: "reverse",
@@ -2688,16 +2736,17 @@ function DotsSpinner({ size, color, className, ariaLabel }) {
 function PulseSpinner({ size, color, className, ariaLabel }) {
   const config = sizeConfig[size];
   const colors3 = colorClasses2[color];
+  const prefersReducedMotion2 = framerMotion.useReducedMotion();
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx.clsx("relative", config.size, className), role: "status", "aria-label": ariaLabel, children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       framerMotion.motion.div,
       {
         className: clsx.clsx("absolute inset-0 rounded-full", colors3.dot),
-        animate: {
+        animate: prefersReducedMotion2 ? {} : {
           scale: [1, 1.5, 1],
           opacity: [0.7, 0, 0.7]
         },
-        transition: {
+        transition: prefersReducedMotion2 ? { duration: 0 } : {
           duration: 1.5,
           repeat: Infinity,
           ease: "easeInOut"
@@ -2732,7 +2781,8 @@ function Spinner({
     {
       size,
       color,
-      className
+      className,
+      ariaLabel
     }
   );
 }
@@ -3037,10 +3087,42 @@ function SegmentedControl({
     chunkUZ3CMNUJ_js.triggerHaptic("light");
     onChange(segmentValue);
   };
+  const handleKeyDown = React11.useCallback(
+    (event) => {
+      if (disabled) return;
+      const currentIndex = normalizedSegments.findIndex((seg) => seg.value === value);
+      let nextIndex = -1;
+      if (event.key === "ArrowRight" || event.key === "ArrowDown") {
+        event.preventDefault();
+        nextIndex = (currentIndex + 1) % normalizedSegments.length;
+      } else if (event.key === "ArrowLeft" || event.key === "ArrowUp") {
+        event.preventDefault();
+        nextIndex = (currentIndex - 1 + normalizedSegments.length) % normalizedSegments.length;
+      } else if (event.key === "Home") {
+        event.preventDefault();
+        nextIndex = 0;
+      } else if (event.key === "End") {
+        event.preventDefault();
+        nextIndex = normalizedSegments.length - 1;
+      }
+      if (nextIndex >= 0) {
+        const nextSegment = normalizedSegments[nextIndex];
+        onChange(nextSegment.value);
+        chunkUZ3CMNUJ_js.triggerHaptic("light");
+        const buttons = containerRef.current?.querySelectorAll("button");
+        buttons?.[nextIndex]?.focus();
+      }
+    },
+    [disabled, normalizedSegments, value, onChange]
+  );
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
       ref: containerRef,
+      role: "tablist",
+      "aria-live": "polite",
+      "data-testid": "segmented-control",
+      onKeyDown: handleKeyDown,
       className: `
         relative inline-flex items-center rounded-xl
         bg-white/40 dark:bg-white/[0.08]
@@ -3067,6 +3149,11 @@ function SegmentedControl({
             "button",
             {
               type: "button",
+              role: "tab",
+              "aria-selected": isSelected,
+              "aria-label": segment.label,
+              tabIndex: isSelected ? 0 : -1,
+              "data-testid": `tab-${segment.value}`,
               onClick: () => handleSelect(segment.value),
               className: `
               relative z-10 flex items-center justify-center gap-1.5
@@ -5413,11 +5500,14 @@ function GlassModal({
   children,
   panelClassName = "rounded-[2rem]",
   contentClassName = "fixed inset-0 flex items-center justify-center overflow-y-auto p-3 sm:p-5 lg:p-6",
-  zIndex = "z-50"
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: `relative ${zIndex}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogBackdrop, { className: "fixed inset-0 bg-slate-900/40 backdrop-blur-md dark:bg-black/50" }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: contentClassName, children: /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogPanel, { className: panelClassName, children }) })
+  zIndex = "z-50",
+  overlayTestId,
+  panelTestId,
+  ariaLabelledBy
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: `relative ${zIndex}`, "aria-labelledby": ariaLabelledBy, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogBackdrop, { className: "fixed inset-0 bg-slate-900/40 backdrop-blur-md dark:bg-black/50", "data-testid": overlayTestId }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: contentClassName, children: /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogPanel, { className: panelClassName, "data-testid": panelTestId, children }) })
   ] });
 }
 function Text({ className, ...props }) {
@@ -5920,7 +6010,8 @@ function GlassModalShell({
           type: "button",
           onClick: onClose,
           "aria-label": closeLabel,
-          className: "absolute right-4 top-4 inline-flex h-9 w-9 items-center justify-center rounded-xl text-slate-400 transition hover:bg-white/40 hover:text-slate-700 dark:hover:bg-white/[0.08] dark:hover:text-white",
+          "data-testid": "modal-close",
+          className: "absolute right-4 top-4 inline-flex h-9 w-9 items-center justify-center rounded-xl text-slate-400 transition hover:bg-white/40 hover:text-slate-700 dark:hover:bg-white/[0.08] dark:hover:text-white focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
           children: /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.XMarkIcon, { className: "h-5 w-5" })
         }
       ),
@@ -5930,14 +6021,14 @@ function GlassModalShell({
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-start justify-between gap-3 pr-10", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-          /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-xl font-bold text-slate-900 dark:text-white sm:text-2xl", children: title }),
+          /* @__PURE__ */ jsxRuntime.jsx("h2", { id: "modal-title", "data-testid": "modal-title", className: "text-xl font-bold text-slate-900 dark:text-white sm:text-2xl", children: title }),
           subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: subtitle })
         ] }),
         headerActions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", children: headerActions })
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-h-[72vh] overflow-y-auto px-5 pb-5 sm:px-8 sm:pb-8", children }),
-    footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t border-white/20 px-5 py-4 dark:border-white/10 sm:px-8", children: footer })
+    footer && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "modal-footer", className: "border-t border-white/20 px-5 py-4 dark:border-white/10 sm:px-8", children: footer })
   ] });
   return /* @__PURE__ */ jsxRuntime.jsx(
     GlassModal,
@@ -5946,7 +6037,10 @@ function GlassModalShell({
       onClose,
       contentClassName: "fixed inset-0 overflow-y-auto p-3 sm:p-6",
       panelClassName: `liquid-surface-strong w-full overflow-hidden rounded-2xl mx-auto mt-[4vh] sm:mt-[8vh] ${SIZE_CLASSES2[maxWidth]} ${className}`,
+      ariaLabelledBy: "modal-title",
       zIndex,
+      overlayTestId: "modal-overlay",
+      panelTestId: "modal-panel",
       children: onSubmit ? /* @__PURE__ */ jsxRuntime.jsx("form", { onSubmit: handleSubmit, children: inner }) : inner
     }
   );
@@ -5977,6 +6071,7 @@ function GlassFormModal({
         disabled: isLoading,
         outline: true,
         className: "w-full sm:w-auto",
+        "data-testid": "form-modal-cancel",
         children: cancelLabel
       }
     ),
@@ -5989,11 +6084,12 @@ function GlassFormModal({
         loadingText: submitLabel,
         color: "ios-glass-blue",
         className: "w-full sm:w-auto",
+        "data-testid": "form-modal-submit",
         children: submitLabel
       }
     )
   ] }) }) : void 0;
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "form-modal", role: "dialog", "aria-modal": "true", "aria-label": title, children: /* @__PURE__ */ jsxRuntime.jsx(
     GlassModalShell,
     {
       open,
@@ -6007,7 +6103,7 @@ function GlassFormModal({
       footer: defaultFooter,
       children
     }
-  );
+  ) });
 }
 function ContextMenu({
   position,
@@ -6670,13 +6766,13 @@ function FormInput({
   onValueChange,
   ...props
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-testid": label ? `field-${label.toLowerCase().replace(/\s+/g, "-")}` : "form-field", children: [
     label ? /* @__PURE__ */ jsxRuntime.jsxs("label", { className: `mb-1.5 block font-medium text-gray-500 dark:text-gray-400 ${labelClasses[inputSize]}`, children: [
       label,
       required ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 text-red-500", children: "*" }) : null
     ] }) : null,
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: wrapperClass(error), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `relative flex items-center ${sizeClasses3[inputSize]} ${className}`, children: [
-      icon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mr-2 text-gray-400 dark:text-gray-500", children: icon }) : null,
+      icon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mr-2 text-gray-400 dark:text-gray-500", "aria-hidden": "true", children: icon }) : null,
       /* @__PURE__ */ jsxRuntime.jsx(
         "input",
         {
@@ -6699,7 +6795,7 @@ function FormTextarea({
   onValueChange,
   ...props
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-testid": label ? `field-${label.toLowerCase().replace(/\s+/g, "-")}` : "form-field", children: [
     label ? /* @__PURE__ */ jsxRuntime.jsxs("label", { className: `mb-1.5 block font-medium text-gray-500 dark:text-gray-400 ${labelClasses[inputSize]}`, children: [
       label,
       required ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 text-red-500", children: "*" }) : null
@@ -6745,7 +6841,7 @@ function FormPriceInput({
   className = ""
 }) {
   const sizes3 = priceSizeConfig[priceSize ?? defaultPriceSize(inputSize)];
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-testid": label ? `field-${label.toLowerCase().replace(/\s+/g, "-")}` : "form-field", children: [
     label ? /* @__PURE__ */ jsxRuntime.jsxs("label", { className: `mb-1.5 block font-medium text-gray-500 dark:text-gray-400 ${labelClasses[inputSize]}`, children: [
       label,
       required ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 text-red-500", children: "*" }) : null
@@ -6788,7 +6884,7 @@ function FormSelect({
   options,
   ...props
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-testid": label ? `field-${label.toLowerCase().replace(/\s+/g, "-")}` : "form-field", children: [
     label ? /* @__PURE__ */ jsxRuntime.jsxs("label", { className: `mb-1.5 block font-medium text-gray-500 dark:text-gray-400 ${labelClasses[inputSize]}`, children: [
       label,
       required ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 text-red-500", children: "*" }) : null
@@ -7336,7 +7432,7 @@ function SearchFilterToolbar({
     label
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { role: "search", "data-testid": "search-toolbar", className: "flex items-center gap-3", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "liquid-surface flex flex-1 items-center gap-2 flex-wrap min-h-12 rounded-xl px-3.5 py-1.5 transition-colors duration-200 focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-blue-500 dark:focus-within:ring-offset-gray-900", children: [
         /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.MagnifyingGlassIcon, { className: "h-5 w-5 shrink-0 text-slate-400 dark:text-slate-500" }),
         filterPills,
@@ -7347,6 +7443,8 @@ function SearchFilterToolbar({
             value: query,
             onChange: (event) => onQueryChange(event.target.value),
             placeholder,
+            "aria-label": label,
+            "data-testid": "search-input",
             className: "min-w-[100px] flex-1 bg-transparent py-1 text-base text-gray-900 outline-none placeholder:text-slate-400 dark:text-white dark:placeholder:text-slate-500"
           }
         )
@@ -7435,6 +7533,12 @@ function SearchFilterToolbar({
 function isPlainTextTitle(title) {
   return typeof title === "string" || typeof title === "number";
 }
+function getTestIdFromTitle(title) {
+  if (isPlainTextTitle(title)) {
+    return `entity-card-${String(title).toLowerCase().replace(/\s+/g, "-")}`;
+  }
+  return "entity-card";
+}
 function StatusBadgeInternal({ status }) {
   const tCommon = nextIntl.useTranslations("common");
   if (typeof status !== "boolean") {
@@ -7461,9 +7565,24 @@ function EntityCard({
   dragProps
 }) {
   const isInteractive = Boolean(onClick);
+  const plainTextTitle = isPlainTextTitle(title) ? String(title) : void 0;
+  const handleKeyDown = React11.useCallback(
+    (event) => {
+      if (onClick && (event.key === "Enter" || event.key === " ")) {
+        event.preventDefault();
+        onClick();
+      }
+    },
+    [onClick]
+  );
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Card,
     {
+      role: isInteractive ? "article" : "listitem",
+      "aria-label": isInteractive ? plainTextTitle : void 0,
+      "data-testid": getTestIdFromTitle(title),
+      tabIndex: isInteractive ? 0 : void 0,
+      onKeyDown: isInteractive ? handleKeyDown : void 0,
       className: `group overflow-hidden transition-all duration-200 hover:-translate-y-0.5 hover:shadow-md ${isInteractive ? "cursor-pointer" : ""} ${className}`,
       onPress: onClick,
       pressable: isInteractive,
@@ -7472,21 +7591,21 @@ function EntityCard({
         accentGradient && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-1.5 w-full bg-gradient-to-r ${accentGradient}` }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4", children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-3", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
+            /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "entity-card-title", children: /* @__PURE__ */ jsxRuntime.jsx(
               ItemSummary,
               {
                 icon,
                 title,
-                subtitle,
+                subtitle: subtitle ? /* @__PURE__ */ jsxRuntime.jsx("span", { "data-testid": "entity-card-subtitle", children: subtitle }) : void 0,
                 iconContainerClassName: "shrink-0",
                 titleClassName: isPlainTextTitle(title) ? "truncate font-semibold text-slate-900 dark:text-white" : "font-semibold text-slate-900 dark:text-white",
                 subtitleClassName: "mt-0.5 text-xs text-slate-500 dark:text-slate-400"
               }
-            ),
+            ) }),
             status !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(StatusBadgeInternal, { status })
           ] }),
           children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-3", children }),
-          footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-3 border-t border-white/30 pt-3 dark:border-white/10 flex gap-2 justify-end opacity-0 transition-opacity duration-200 group-hover:opacity-100", children: footer })
+          footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-3 border-t border-white/30 pt-3 dark:border-white/10 flex gap-2 justify-end opacity-0 transition-opacity duration-200 group-hover:opacity-100 group-focus-within:opacity-100", children: footer })
         ] })
       ]
     }
@@ -7635,6 +7754,10 @@ function FilterTileButton({
     {
       type: "button",
       onClick,
+      role: "checkbox",
+      "aria-checked": isActive,
+      "aria-label": label,
+      "data-testid": `filter-tile-${label.toLowerCase().replace(/\s+/g, "-")}`,
       className: `relative overflow-hidden rounded-2xl p-4 text-left transition-all duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 ${tokens.focusRing} dark:ring-offset-gray-900 ${isActive ? tokens.activeGradient : INACTIVE_CLASSES}`,
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -8669,6 +8792,7 @@ function Badge({ color = "zinc", className, ...props }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
     {
+      "data-testid": "badge",
       ...props,
       className: clsx__default.default(
         className,
@@ -8883,14 +9007,14 @@ function DynamicIslandConfirm({
       chunkUZ3CMNUJ_js.triggerHaptic("warning");
     }
   }, [open]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: "relative z-[120]", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: "relative z-[120]", "aria-labelledby": "dynamic-island-title", children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed inset-0 bg-black/10 backdrop-blur-[2px]" }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed inset-0 flex items-start justify-center pt-3 px-4", children: /* @__PURE__ */ jsxRuntime.jsxs(Headless6.DialogPanel, { className: "w-full max-w-sm rounded-[28px] bg-black/95 p-3 text-white shadow-2xl", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 px-2 py-1", children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-9 w-9 shrink-0 rounded-xl ${iconBackground} flex items-center justify-center`, children: icon ?? /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.TrashIcon, { className: "h-5 w-5 text-white" }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
           /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[11px] uppercase tracking-wide text-gray-400", children: appName }),
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold", children: title })
+          /* @__PURE__ */ jsxRuntime.jsx("p", { id: "dynamic-island-title", className: "text-sm font-semibold", children: title })
         ] })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 grid grid-cols-2 gap-2", children: [
@@ -8899,7 +9023,7 @@ function DynamicIslandConfirm({
           {
             type: "button",
             onClick: onClose,
-            className: "rounded-xl bg-white/10 px-3 py-2 text-sm font-medium hover:bg-white/15",
+            className: "rounded-xl bg-white/10 px-3 py-3 text-sm font-medium hover:bg-white/15 focus-visible:ring-2 focus-visible:ring-white/70",
             children: resolvedCancelLabel
           }
         ),
@@ -8908,7 +9032,7 @@ function DynamicIslandConfirm({
           {
             type: "button",
             onClick: onConfirm,
-            className: "rounded-xl bg-ios-red px-3 py-2 text-sm font-semibold text-white hover:bg-ios-red-hover",
+            className: "rounded-xl bg-ios-red px-3 py-3 text-sm font-semibold text-white hover:bg-ios-red-hover focus-visible:ring-2 focus-visible:ring-white/70",
             children: resolvedConfirmLabel
           }
         )
@@ -9460,66 +9584,80 @@ var ACCENT_MAP = {
 function PageEmptyState({ title, message, iconName }) {
   const Icon = ICON_MAP[iconName] || FallbackIcon;
   const accent = ACCENT_MAP[iconName] || ACCENT_MAP["folder-open"];
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center py-20", children: /* @__PURE__ */ jsxRuntime.jsxs(
-    framerMotion.motion.div,
+  const prefersReducedMotion2 = framerMotion.useReducedMotion();
+  const noMotion = { opacity: 1, scale: 1, y: 0 };
+  const noTransition = { duration: 0 };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
     {
-      initial: { opacity: 0, scale: 0.95 },
-      animate: { opacity: 1, scale: 1 },
-      transition: springPresets.gentle,
-      className: "liquid-surface w-full max-w-lg rounded-2xl px-8 py-14 text-center",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          framerMotion.motion.div,
-          {
-            initial: { scale: 0.6, opacity: 0 },
-            animate: { scale: 1, opacity: 1 },
-            transition: springPresets.bouncy,
-            className: "mx-auto mb-6",
-            children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: `inline-flex h-20 w-20 items-center justify-center rounded-full backdrop-blur-md border ${accent.container}`, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: `h-10 w-10 ${accent.icon}` }) })
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          framerMotion.motion.h3,
-          {
-            initial: { y: 12, opacity: 0 },
-            animate: { y: 0, opacity: 1 },
-            transition: { ...springPresets.default, delay: 0.1 },
-            className: "text-xl font-semibold text-gray-900 dark:text-white",
-            children: title
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          framerMotion.motion.p,
-          {
-            initial: { y: 12, opacity: 0 },
-            animate: { y: 0, opacity: 1 },
-            transition: { ...springPresets.default, delay: 0.15 },
-            className: "mt-3 text-sm text-gray-500 dark:text-gray-400 max-w-sm mx-auto leading-relaxed",
-            children: message
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          framerMotion.motion.div,
-          {
-            initial: { opacity: 0 },
-            animate: { opacity: 1 },
-            transition: { delay: 0.3 },
-            className: "mt-8 flex items-center justify-center gap-1.5",
-            children: [0, 1, 2].map((i) => /* @__PURE__ */ jsxRuntime.jsx(
+      role: "region",
+      "aria-label": title,
+      "data-testid": "empty-state",
+      className: "flex items-center justify-center py-20",
+      children: /* @__PURE__ */ jsxRuntime.jsxs(
+        framerMotion.motion.div,
+        {
+          initial: prefersReducedMotion2 ? false : { opacity: 0, scale: 0.95 },
+          animate: prefersReducedMotion2 ? noMotion : { opacity: 1, scale: 1 },
+          transition: prefersReducedMotion2 ? noTransition : springPresets.gentle,
+          className: "liquid-surface w-full max-w-lg rounded-2xl px-8 py-14 text-center",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
               framerMotion.motion.div,
               {
-                initial: { scale: 0 },
-                animate: { scale: 1 },
-                transition: { ...springPresets.bouncy, delay: 0.35 + i * 0.08 },
-                className: "h-1.5 w-1.5 rounded-full bg-gray-300 dark:bg-gray-600"
-              },
-              i
-            ))
-          }
-        )
-      ]
+                initial: prefersReducedMotion2 ? false : { scale: 0.6, opacity: 0 },
+                animate: prefersReducedMotion2 ? noMotion : { scale: 1, opacity: 1 },
+                transition: prefersReducedMotion2 ? noTransition : springPresets.bouncy,
+                className: "mx-auto mb-6",
+                children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: `inline-flex h-20 w-20 items-center justify-center rounded-full backdrop-blur-md border ${accent.container}`, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: `h-10 w-10 ${accent.icon}` }) })
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              framerMotion.motion.h3,
+              {
+                "data-testid": "empty-state-title",
+                initial: prefersReducedMotion2 ? false : { y: 12, opacity: 0 },
+                animate: prefersReducedMotion2 ? noMotion : { y: 0, opacity: 1 },
+                transition: prefersReducedMotion2 ? noTransition : { ...springPresets.default, delay: 0.1 },
+                className: "text-xl font-semibold text-gray-900 dark:text-white",
+                children: title
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              framerMotion.motion.p,
+              {
+                "data-testid": "empty-state-message",
+                initial: prefersReducedMotion2 ? false : { y: 12, opacity: 0 },
+                animate: prefersReducedMotion2 ? noMotion : { y: 0, opacity: 1 },
+                transition: prefersReducedMotion2 ? noTransition : { ...springPresets.default, delay: 0.15 },
+                className: "mt-3 text-sm text-gray-500 dark:text-gray-400 max-w-sm mx-auto leading-relaxed",
+                children: message
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              framerMotion.motion.div,
+              {
+                initial: prefersReducedMotion2 ? false : { opacity: 0 },
+                animate: prefersReducedMotion2 ? noMotion : { opacity: 1 },
+                transition: prefersReducedMotion2 ? noTransition : { delay: 0.3 },
+                className: "mt-8 flex items-center justify-center gap-1.5",
+                children: [0, 1, 2].map((i) => /* @__PURE__ */ jsxRuntime.jsx(
+                  framerMotion.motion.div,
+                  {
+                    initial: prefersReducedMotion2 ? false : { scale: 0 },
+                    animate: prefersReducedMotion2 ? noMotion : { scale: 1 },
+                    transition: prefersReducedMotion2 ? noTransition : { ...springPresets.bouncy, delay: 0.35 + i * 0.08 },
+                    className: "h-1.5 w-1.5 rounded-full bg-gray-300 dark:bg-gray-600"
+                  },
+                  i
+                ))
+              }
+            )
+          ]
+        }
+      )
     }
-  ) });
+  );
 }
 var WINDSOCK_LOADER = { gradient: "from-emerald-500 to-teal-600", accentRing: "ring-emerald-500/30" };
 var FUEL_PRICE_LOADER = { gradient: "from-blue-500 to-indigo-600", accentRing: "ring-blue-500/30" };
@@ -11159,7 +11297,7 @@ function NotificationBadge({ count, className = "" }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
     {
-      className: `absolute -top-1 -right-1 flex items-center justify-center min-w-[18px] h-[18px] px-1 text-[10px] font-bold text-white bg-red-500 rounded-full ring-2 ring-white dark:ring-gray-800 ${count > 0 ? "animate-pulse" : ""} ${className}`,
+      className: `absolute -top-1 -right-1 flex items-center justify-center min-w-[18px] h-[18px] px-1 text-[10px] font-bold text-white bg-red-500 rounded-full ring-2 ring-white dark:ring-gray-800 ${count > 0 ? "animate-pulse motion-reduce:animate-none" : ""} ${className}`,
       children: displayCount
     }
   );
@@ -12389,11 +12527,15 @@ function FilterPill({ icon, label, variant, onRemove }) {
     {
       type: "button",
       onClick: onRemove,
+      role: "option",
+      "aria-selected": true,
+      "aria-label": typeof label === "string" ? label : void 0,
+      "data-testid": "filter-pill",
       className: `liquid-pill liquid-pill-${variant}`,
       children: [
         icon,
         label,
-        /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.XMarkIcon, { className: "liquid-pill-dismiss" })
+        /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.XMarkIcon, { className: "liquid-pill-dismiss", "data-testid": "filter-pill-remove" })
       ]
     }
   );
@@ -14216,5 +14358,5 @@ exports.useGeoMapState = useGeoMapState;
 exports.useNotifications = useNotifications;
 exports.usePlatformShellStore = usePlatformShellStore;
 exports.usePullToRefresh = usePullToRefresh;
-//# sourceMappingURL=chunk-5IE2FIWT.js.map
-//# sourceMappingURL=chunk-5IE2FIWT.js.map
+//# sourceMappingURL=chunk-JYX3ILSA.js.map
+//# sourceMappingURL=chunk-JYX3ILSA.js.map