@toteat-eng/ds-react 2026.7.10 → 2026.7.13

package/dist/components/SidebarNavSection/SidebarNavSection.d.ts

@@ -1,12 +1,28 @@
 import type { ReactNode } from "react";
-export interface SidebarNavSectionProps {
+interface SidebarNavSectionBaseProps {
     title: string;
     icon?: ReactNode;
     titleSuffix?: ReactNode;
-    defaultOpen?: boolean;
     isActive?: boolean;
     className?: string;
     children: ReactNode;
     "data-testid"?: string;
 }
-export declare function SidebarNavSection({ title, icon, titleSuffix, defaultOpen, isActive, className, children, "data-testid": testId, }: SidebarNavSectionProps): import("react/jsx-runtime").JSX.Element;
+interface UncontrolledSidebarNavSectionProps {
+    /** Initial open state (uncontrolled — the component owns open/close). */
+    defaultOpen?: boolean;
+    open?: undefined;
+    /** Fired on every trigger click. */
+    onToggle?: () => void;
+}
+interface ControlledSidebarNavSectionProps {
+    /** Controlled open state. The component renders from this and never mutates
+     *  internal state — the parent owns open/close (e.g. a single-open accordion). */
+    open: boolean;
+    /** Required in controlled mode so the parent can react to trigger clicks. */
+    onToggle: () => void;
+    defaultOpen?: never;
+}
+export type SidebarNavSectionProps = SidebarNavSectionBaseProps & (ControlledSidebarNavSectionProps | UncontrolledSidebarNavSectionProps);
+export declare function SidebarNavSection({ title, icon, titleSuffix, defaultOpen, open, onToggle, isActive, className, children, "data-testid": testId, }: SidebarNavSectionProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/SidebarNavSection/__stories__/SidebarNavSection.stories.d.ts

@@ -8,4 +8,5 @@ export declare const DefaultOpen: Story;
 export declare const Active: Story;
 export declare const WithIcon: Story;
 export declare const WithTitleSuffix: Story;
+export declare const ControlledAccordion: Story;
 export declare const MultipleSections: Story;

package/dist/index.es.js

@@ -2152,8 +2152,8 @@ function si({ options: e, value: t, onChange: n, placeholder: r = "Seleccionar..
 	});
 }
 var ci = {
-	backdrop: "_backdrop_1j7fj_3",
-	sidebar: "_sidebar_1j7fj_16"
+	backdrop: "_backdrop_kq54y_3",
+	sidebar: "_sidebar_kq54y_16"
 }, li = "ds-sidebar-drawer", ui = "a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"])";
 function di(e) {
 	return Array.from(e.querySelectorAll(ui));
@@ -2918,18 +2918,20 @@ var Z = {
 };
 //#endregion
 //#region src/components/SidebarNavSection/SidebarNavSection.tsx
-function qi({ title: e, icon: t, titleSuffix: n, defaultOpen: r = !1, isActive: i = !1, className: a, children: o, "data-testid": s }) {
-	let [c, l] = Ki(r);
+function qi({ title: e, icon: t, titleSuffix: n, defaultOpen: r = !1, open: i, onToggle: a, isActive: o = !1, className: s, children: c, "data-testid": l }) {
+	let [u, p] = Ki(r), m = i !== void 0, h = m ? i : u;
 	return /* @__PURE__ */ f("div", {
-		className: R(Z.section, a),
-		"data-testid": s,
+		className: R(Z.section, s),
+		"data-testid": l,
 		children: [/* @__PURE__ */ f("button", {
 			type: "button",
 			className: Z.trigger,
-			"data-open": c || void 0,
-			"data-active": i || void 0,
-			onClick: l,
-			"aria-expanded": c,
+			"data-open": h || void 0,
+			"data-active": o || void 0,
+			onClick: () => {
+				m || p(), a?.();
+			},
+			"aria-expanded": h,
 			children: [
 				t && /* @__PURE__ */ d("span", {
 					className: Z.icon,
@@ -2952,11 +2954,11 @@ function qi({ title: e, icon: t, titleSuffix: n, defaultOpen: r = !1, isActive:
 			]
 		}), /* @__PURE__ */ d("div", {
 			className: Z.content,
-			"data-open": c || void 0,
-			inert: !c || void 0,
+			"data-open": h || void 0,
+			inert: !h || void 0,
 			children: /* @__PURE__ */ d("div", {
 				className: Z.inner,
-				children: o
+				children: c
 			})
 		})]
 	});
@@ -3904,30 +3906,30 @@ function Wa({ title: e, actions: t, "data-testid": n }) {
 	});
 }
 var Ga = {
-	shell: "_shell_1wom3_2",
-	body: "_body_1wom3_10",
-	sidebarSlot: "_sidebarSlot_1wom3_17",
-	contentArea: "_contentArea_1wom3_28",
-	main: "_main_1wom3_45",
-	tabBarSlot: "_tabBarSlot_1wom3_51"
+	shell: "_shell_h247i_2",
+	body: "_body_h247i_10",
+	sidebarSlot: "_sidebarSlot_h247i_17",
+	contentArea: "_contentArea_h247i_31",
+	main: "_main_h247i_41",
+	tabBarSlot: "_tabBarSlot_h247i_48"
 };
 //#endregion
 //#region src/layouts/AppShell/AppShell.tsx
-function Ka({ restaurantName: e, onMenuToggle: t, onLogoClick: n, onRightToggle: r, sidebar: i, children: a, tabBar: o, headerRight: s, isSidebarOpen: c = !1, sidebarMode: l = "overlay", isPinLocked: u = !1, pinLockContent: p, isLoading: m = !1, "data-testid": h }) {
-	return u ? /* @__PURE__ */ d(ji, {
+function Ka({ restaurantName: e, onMenuToggle: t, onLogoClick: n, onRightToggle: r, sidebar: i, children: a, tabBar: o, headerRight: s, isSidebarOpen: c = !1, sidebarMode: l = "overlay", contentPadding: u, isPinLocked: p = !1, pinLockContent: m, isLoading: h = !1, "data-testid": g }) {
+	return p ? /* @__PURE__ */ d(ji, {
 		isLocked: !0,
-		children: p
+		children: m
 	}) : /* @__PURE__ */ f("div", {
 		className: Ga.shell,
 		"data-sidebar-mode": l,
-		"data-testid": h,
+		"data-testid": g,
 		children: [/* @__PURE__ */ d(mi, {
 			restaurantName: e,
 			onMenuToggle: t,
 			onLogoClick: n,
 			onRightToggle: r,
 			isMenuOpen: c,
-			isLoading: m,
+			isLoading: h,
 			rightSlot: s
 		}), /* @__PURE__ */ f("div", {
 			className: Ga.body,
@@ -3938,6 +3940,7 @@ function Ka({ restaurantName: e, onMenuToggle: t, onLogoClick: n, onRightToggle:
 				className: Ga.contentArea,
 				children: [/* @__PURE__ */ d("main", {
 					className: Ga.main,
+					style: u ? { "--ds-appshell-content-padding": u } : void 0,
 					children: a
 				}), o && /* @__PURE__ */ d("div", {
 					className: Ga.tabBarSlot,