@studiolxd/brand 38.14.0 → 38.15.0

package/CHANGELOG.md

@@ -7,6 +7,23 @@ El paquete sigue [semver](https://semver.org/lang/es/): **patch** para bug fixes
 regeneración de `dist`, **minor** para componentes/props/variantes/tokens nuevos, **major**
 para breaking changes.
 
+## [38.15.0] — 2026-09-15
+
+> **Minor.** El cajón de conversaciones del chat, en móvil: ocupa el ancho y su
+> botón no cambia de forma al abrirse. `Sheet` gana `hideClose`.
+
+El cajón medía 320px de 390 porque heredaba el ancho lateral del `Sheet`.
+Mientras está abierto, la lista de conversaciones ES la pantalla: ahora mide lo
+que el armazón. Sin media query, porque el cajón solo se monta por debajo de
+`lg`.
+
+Y al abrirse aparecía el aspa del `Sheet` encima del disparador, así que el
+glifo cambiaba de «barra lateral» a «cerrar» según el estado. `Sheet` acepta
+`hideClose` —por defecto no cambia para nadie— y el armazón pinta dentro del
+cajón el MISMO botón que lo abrió, en el mismo sitio: pliega y despliega sin
+cambiar de dibujo. Dos controles de cierre con formas distintas en la misma
+pantalla son dos maneras de decir lo mismo.
+
 ## [38.14.0] — 2026-09-15
 
 > **Minor.** En móvil, las acciones ocupan la línea porque lo decide el sitio

package/dist/_types/molecules/Sheet/Sheet.d.ts

@@ -15,6 +15,12 @@ export interface SheetProps extends Omit<React.ComponentPropsWithoutRef<'div'>,
     footer?: ReactNode;
     children: ReactNode;
     closeLabel?: string;
+    /**
+     * Oculta el aspa de la esquina. Para un cajón cuyo propio disparador queda
+     * a la vista y ya sirve para cerrarlo: dos controles de cierre en la misma
+     * pantalla, con glifos distintos, son dos formas de decir lo mismo.
+     */
+    hideClose?: boolean;
     /** Elemento que abre el panel. Sin él, la apertura la controla el consumidor. */
     trigger?: ReactNode;
     /**
@@ -53,4 +59,4 @@ export declare function SheetFooter({ className, ...props }: React.HTMLAttribute
  * handlers son lo que permite montar la barrera de eventos cuando el panel se
  * abre desde dentro de una tarjeta clicable, sin `div`s de producto alrededor.
  */
-export declare function Sheet({ open, onOpenChange, side, title, titleHidden, description, footer, children, closeLabel, trigger, container, onAnimationEndCapture, className, ...rest }: SheetProps): import("react/jsx-runtime").JSX.Element;
+export declare function Sheet({ open, onOpenChange, side, title, titleHidden, description, footer, children, closeLabel, hideClose, trigger, container, onAnimationEndCapture, className, ...rest }: SheetProps): import("react/jsx-runtime").JSX.Element;

package/dist/chat-shell.css

@@ -1 +1 @@
-.chat-shell{background-color:var(--chat-shell-bg);flex-direction:column;block-size:100%;min-block-size:0;display:flex;position:relative}.chat-shell .chat-shell__drawer,.chat-shell .sheet__overlay{position:absolute}.chat-shell__list{inline-size:var(--chat-shell-list-width);flex-shrink:0;block-size:100%;overflow-y:auto}.chat-shell.chat-shell--with-list{gap:var(--chat-shell-gap);flex-direction:row}.chat-shell__main{flex-direction:column;flex:1;min-block-size:0;display:flex}.chat-shell__header{justify-content:space-between;align-items:center;gap:var(--chat-shell-header-gap);flex-shrink:0;display:flex}.chat-shell__list-trigger{flex-shrink:0}.chat-shell__header-content{justify-content:space-between;align-items:center;gap:var(--chat-shell-header-gap);flex:1;min-inline-size:0;display:flex}.chat-shell__thread{--conversation-thread-padding-inline:var(--chat-shell-thread-padding-inline);min-block-size:0;padding-block:var(--chat-shell-thread-padding-block);flex-direction:column;flex:1;display:flex;overflow-y:auto}.chat-shell__composer{flex-shrink:0}
+.chat-shell{background-color:var(--chat-shell-bg);flex-direction:column;block-size:100%;min-block-size:0;display:flex;position:relative}.chat-shell .chat-shell__drawer,.chat-shell .sheet__overlay{position:absolute}.chat-shell .chat-shell__drawer{--sheet-inline-size:100%}.chat-shell__list{inline-size:var(--chat-shell-list-width);flex-shrink:0;block-size:100%;overflow-y:auto}.chat-shell.chat-shell--with-list{gap:var(--chat-shell-gap);flex-direction:row}.chat-shell__main{flex-direction:column;flex:1;min-block-size:0;display:flex}.chat-shell__header{justify-content:space-between;align-items:center;gap:var(--chat-shell-header-gap);flex-shrink:0;display:flex}.chat-shell__list-trigger{flex-shrink:0}.chat-shell__header-content{justify-content:space-between;align-items:center;gap:var(--chat-shell-header-gap);flex:1;min-inline-size:0;display:flex}.chat-shell__thread{--conversation-thread-padding-inline:var(--chat-shell-thread-padding-inline);min-block-size:0;padding-block:var(--chat-shell-thread-padding-block);flex-direction:column;flex:1;display:flex;overflow-y:auto}.chat-shell__composer{flex-shrink:0}

package/dist/chat-shell.js

@@ -66,15 +66,28 @@ var l = "(min-width: 1024px)", u = a(function({ list: a, header: u, children: d,
 					})
 				]
 			}),
-			A && /* @__PURE__ */ r(n, {
+			A && /* @__PURE__ */ i(n, {
 				side: "left",
 				open: O,
 				onOpenChange: D,
 				title: p,
 				titleHidden: !0,
 				container: w ?? void 0,
+				hideClose: !0,
 				className: "chat-shell__drawer",
-				children: a
+				children: [/* @__PURE__ */ r(t, {
+					variant: "ghost",
+					size: "sm",
+					iconOnly: !0,
+					"aria-label": m,
+					"aria-expanded": !0,
+					className: "chat-shell__list-trigger",
+					onClick: () => D(!1),
+					children: /* @__PURE__ */ r(e, {
+						name: "layout-sidebar",
+						size: "sm"
+					})
+				}), a]
 			})
 		]
 	});

package/dist/sheet.js

@@ -12,17 +12,17 @@ function c({ className: e, ...t }) {
 		...t
 	});
 }
-function l({ open: i, onOpenChange: l, side: u = "right", title: d, titleHidden: f = !1, description: p, footer: m, children: h, closeLabel: g = "Cerrar", trigger: _, container: v, onAnimationEndCapture: y, className: b, ...x }) {
+function l({ open: i, onOpenChange: l, side: u = "right", title: d, titleHidden: f = !1, description: p, footer: m, children: h, closeLabel: g = "Cerrar", hideClose: _ = !1, trigger: v, container: y, onAnimationEndCapture: b, className: x, ...S }) {
 	return /* @__PURE__ */ o(s.Root, {
 		open: i,
 		onOpenChange: (e) => l(e),
-		children: [_ && /* @__PURE__ */ a(s.Trigger, { render: _ }), /* @__PURE__ */ o(s.Portal, {
-			container: v,
+		children: [v && /* @__PURE__ */ a(s.Trigger, { render: v }), /* @__PURE__ */ o(s.Portal, {
+			container: y,
 			children: [/* @__PURE__ */ a(r, { className: "sheet__overlay" }), /* @__PURE__ */ o(s.Popup, {
-				className: ["sheet", b].filter(Boolean).join(" "),
+				className: ["sheet", x].filter(Boolean).join(" "),
 				"data-side": u,
-				onAnimationEndCapture: y,
-				...x,
+				onAnimationEndCapture: b,
+				...S,
 				children: [
 					/* @__PURE__ */ o(n, {
 						layout: "stacked",
@@ -35,7 +35,7 @@ function l({ open: i, onOpenChange: l, side: u = "right", title: d, titleHidden:
 							children: p
 						})]
 					}),
-					/* @__PURE__ */ a(s.Close, {
+					!_ && /* @__PURE__ */ a(s.Close, {
 						className: "sheet__close",
 						render: /* @__PURE__ */ a(t, { label: g })
 					}),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@studiolxd/brand",
-  "version": "38.14.0",
+  "version": "38.15.0",
   "description": "El sistema de diseño de Studio LXD: componentes React, tokens y documentación de la suite SLXD.",
   "repository": {
     "type": "git",