analytica-frontend-lib 1.1.96 → 1.1.97

package/dist/Accordation/index.mjs

@@ -2,7 +2,8 @@
 import {
   forwardRef as forwardRef2,
   useId,
-  useState as useState2
+  useState as useState2,
+  useEffect as useEffect2
 } from "react";
 
 // src/components/Card/Card.tsx
@@ -2152,17 +2153,33 @@ var CardAccordation = forwardRef2(
     children,
     className,
     defaultExpanded = false,
+    expanded: controlledExpanded,
     onToggleExpanded,
+    value,
+    disabled = false,
     ...props
   }, ref) => {
-    const [isExpanded, setIsExpanded] = useState2(defaultExpanded);
-    const contentId = useId();
+    const [internalExpanded, setInternalExpanded] = useState2(defaultExpanded);
+    const generatedId = useId();
+    const contentId = value ? `accordion-content-${value}` : generatedId;
+    const headerId = value ? `accordion-header-${value}` : `${generatedId}-header`;
+    const isControlled = controlledExpanded !== void 0;
+    const isExpanded = isControlled ? controlledExpanded : internalExpanded;
+    useEffect2(() => {
+      if (isControlled) {
+        setInternalExpanded(controlledExpanded);
+      }
+    }, [isControlled, controlledExpanded]);
     const handleToggle = () => {
+      if (disabled) return;
       const newExpanded = !isExpanded;
-      setIsExpanded(newExpanded);
+      if (!isControlled) {
+        setInternalExpanded(newExpanded);
+      }
       onToggleExpanded?.(newExpanded);
     };
     const handleKeyDown = (event) => {
+      if (disabled) return;
       if (event.key === "Enter" || event.key === " ") {
         event.preventDefault();
         handleToggle();
@@ -2181,11 +2198,19 @@ var CardAccordation = forwardRef2(
           /* @__PURE__ */ jsxs8(
             "button",
             {
+              id: headerId,
+              type: "button",
               onClick: handleToggle,
               onKeyDown: handleKeyDown,
-              className: "w-full cursor-pointer text-text-950 not-aria-expanded:rounded-xl aria-expanded:rounded-t-xl p-4 flex items-center justify-between gap-3 text-left transition-colors duration-200 focus:outline-none focus:border-2 focus:border-primary-950 focus:ring-inset",
+              disabled,
+              className: cn(
+                "w-full cursor-pointer not-aria-expanded:rounded-xl aria-expanded:rounded-t-xl flex items-center justify-between gap-3 text-left transition-colors duration-200 focus:outline-none focus:border-2 focus:border-primary-950 focus:ring-inset px-2",
+                disabled && "cursor-not-allowed text-text-400"
+              ),
               "aria-expanded": isExpanded,
-              "aria-controls": "accordion-content",
+              "aria-controls": contentId,
+              "aria-disabled": disabled,
+              "data-value": value,
               children: [
                 trigger,
                 /* @__PURE__ */ jsx10(
@@ -2193,7 +2218,8 @@ var CardAccordation = forwardRef2(
                   {
                     size: 20,
                     className: cn(
-                      "text-text-700 transition-transform duration-200 flex-shrink-0",
+                      "transition-transform duration-200 flex-shrink-0",
+                      disabled ? "text-gray-400" : "text-text-700",
                       isExpanded ? "rotate-90" : "rotate-0"
                     ),
                     "data-testid": "accordion-caret"
@@ -2203,15 +2229,18 @@ var CardAccordation = forwardRef2(
             }
           ),
           /* @__PURE__ */ jsx10(
-            "div",
+            "section",
             {
               id: contentId,
+              "aria-labelledby": headerId,
+              "aria-hidden": !isExpanded,
               className: cn(
                 "transition-all duration-300 ease-in-out overflow-hidden",
                 isExpanded ? "max-h-screen opacity-100" : "max-h-0 opacity-0"
               ),
               "data-testid": "accordion-content",
-              children: /* @__PURE__ */ jsx10("div", { className: "p-4 pt-0 border-border-50", children })
+              "data-value": value,
+              children: /* @__PURE__ */ jsx10("div", { className: "p-4 pt-0", children })
             }
           )
         ]
@@ -2219,6 +2248,7 @@ var CardAccordation = forwardRef2(
     );
   }
 );
+CardAccordation.displayName = "CardAccordation";
 export {
   CardAccordation
 };